@riotjs/custom-elements

Simple API to create vanilla custom elements with riot

Demos

• Simple Demo

Usage

importMyComponentfrom'./my-component.riot'importdefinefrom'@riotjs/custom-elements'define('x-tag',MyComponent)

Notice that in order to update the component properties via attribute you will need to rely on the observedAttributes array

<my-component><p>{props.message}</p><script>exportdefault{// the message property will be automatically updated anytime the DOM `message` attribute will changeobservedAttributes: ['message'],}</script></my-component>

API

This module exports only a single factory function that is a wrapper around the native customElements.define. The define function accepts only 3 parameters:

• tag name
• tag api normally generated via riot compiler
• custom options to pass to customElements.define like {extends: 'button'} for example