as-custom-element

As Custom Element

The easiest way to add Custom Elements like callbacks to any node.

Compatible with modern browsers, as well as IE11, and no polyfills are needed, for a total minified size of ~0.6K.

import asCustomElement from 'as-custom-element';

const setup = {
  // lifecycle callbacks
  connectedCallback() {
    console.log(this, 'is connected');
  },
  disconnectedCallback() {},

  // attributes related helpers
  observedAttributes: ['one', 'or', 'more'],
  attributeChangedCallback(attributeName, oldValue, newValue) {}
};

asCustomElement(document.querySelector('#any'), setup);