[WIP] ShadyStyle

shady-style.js

import "@webcomponents/shadycss/custom-style-interface.min.js";

const { CustomStyleInterface } = window.ShadyCSS;

class ShadyStyle extends HTMLElement {

  __style = null;

  constructor() {
    super();
    if (!CustomStyleInterface) {
      throw new Error(`You have to load CustomStyleInterface via "import '@webcomponents/shadycss/custom-style-interface.min.js';"`);
    }
    CustomStyleInterface.addCustomStyle(this);
  }
  connectedCallback() {
    this.__style = this.querySelector('style') || document.createElement('style');

    if (!this.css && !this.__style.textContent) {
      throw new Error('Must use either the css property or a `style` tag in the LightDOM');
    }

    if (this.css) {
      this.__style.textContent = this.css;
    }

    document.head.appendChild(this.__style);
  }
  get style() {
    return this.__style;
  }
}

customElements.define('shady-style', ShadyStyle);