import { AegisComponent, TRIGGERS, SYMBOLS } from '@aegisjsproject/component';
import { html, css, appendTo, addStyles } from '@aegisjsproject/core';

export class HTMLHelloWorldElement extends AegisComponent {
  [SYMBOLS.render](type, { shadow }) {
    switch(type) {
      case TRIGGERS.constructed:
        appendTo(shadow, html`<h1 class="foo">Hello, World!</h1>`);

        addStyles(shadow, css`
          .foo {
            color: red;
          }
        `);
       break;
    }
  }
}

HTMLHelloWorldElement.register('hello-world');