lit-custom-element

Lightweight library for building native web components

Installation

  npm install lit-custom-element

  import { LitCustomElement, html } from 'lit-custom-element'

  class HelloWorld extends LitCustomElement {

    get message() {
      return this._message
    }

    set message(value) {
      this._message = value
      this.onPropertyChanged('message', true)
    }

    static get styles() {
      return `
        h1 { 
          color: red;
        }
      `
    }

    render() {
      return html `<h1>Hello ${this.message}!</h1>`
    }

  }

  customElements.define('hello-world', HelloWorld)