JSFiddle - React, Tailwind, and code Playground

by dandclark_msft

HTML

<input id="labeled-input" aria-labelledby="custom-label">
<custom-label id="custom-label">
  <template shadowrootmode="open">
    <label>This is the label</label>
  </template>
</custom-label>
<script>
 /* class CustomLabel extends HTMLElement {
    constructor() {
      super();

      const shadow = this.attachInternals().shadowRoot;
      shadow.querySelector("label").htmlFor = document.querySelector("#labeled-input");
    }
  }

  customElements.define("custom-label", CustomLabel);*/
</script>