Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

Appearance settings

webcomponents-dev/custom-elements

Open more actions menu
 
 

Repository files navigation

@riotjs/custom-elements

Simple API to create vanilla custom elements with riot

This module is highly experimental and it's not meant to be used in production yet!

🚧🚧🚧

Build Status

NPM version NPM downloads MIT License

Demos

Usage

import MyComponent from './my-component.riot'
import define from '@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>
    export default {
      // the message property will be automatically updated anytime the DOM `message` attribute will change
      observedAttributes: ['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

About

Simple API to create vanilla custom elements with riot

Resources

License

Stars

Watchers

Forks

Packages

 
 
 

Contributors

Languages

  • JavaScript 100.0%
Morty Proxy This is a proxified and sanitized view of the page, visit original site.