Sinuous+swiss

[kethan]

In the below example I see it updates and it renders twice.

https://codepen.io/kethan-the-selector/pen/mdVLjRQ?editors=1010

can anyone point my mistake?

[luwes]

Nice example, thanks for putting this together! Sinuous doesn't need the use of the update method. It should only create the template once, in the constructor or in the connected callback, seems not documented I'm noticing.

https://github.com/luwes/swiss/blob/master/packages/swiss/src/swiss.js#L34

This works https://codepen.io/luwes/pen/vYLjazb?editors=1010

[kethan]

@luwes thanks it was simple!. Yes without documentation I am breaking my head how to use it. any more detail doc will be helpful. Thanks.

[kethan]

And how do i define event handler outside of swiss. may be in HTML tag like <sin-counter count="10" onclick=fun()></sin-counter>

[luwes]

that should work like expected, the custom element extends the HTMLElement so it gets it from that base class.

to fire custom events, check some code here https://github.com/luwes/playerx/blob/5d2004614472de73840382c12348316c07434538/packages/playerx/src/playerx.js#L356-L356

[kethan]

Oh thanks. One final doubt. How do I send function from attribute or setAttribute?

let obj = {
	count: 3,
	click: () => {
		console.log("clicked!");
	}
}

[luwes]

@kethan via attributes is not possible. it can only be a string or stringified value. a function has to go through a property. Sinuous templates use props by default so something like

html`<a onclick=${myfunction} />`