custom-elements

set of custom (vanilla) elements following Material Design 3 spec

disclaimer: This is not as advanced as the material-components set

demo

Elements

---

custom-theme

  the start for all elements (for now).   custom-theme can be used to switch defined token values
  the idea is just to use material design tokens
  this should allow us to use DSP generated tokens
  note: only JS tokens supported for now.   

<custom-theme language="css" path="./themes/default/theme.css"></custom-theme>

Under the hood

---

lit-html

  Uses lit-html to render,
  this brings allot of extra features checkout lit-html

examples

bind to attribute

html`<my-el value=${this.value}></my-el>`

bind to property

html`<my-el .value=${this.value}></my-el>`

setting attributes

html`<my-el ?disabled=${this.disabled}></my-el>`

declarative events

html`<my-el @click=${() => console.log('click')}></my-el>`