FAST + domdom

fast-domdom.tsx

import domdom from "@eirikb/domdom";
import {
  FASTDesignSystemProvider,
  FASTButton,
  FASTAccordion
} from "@microsoft/fast-components";

const { React, init, on, set, get } = domdom();

FASTDesignSystemProvider;
FASTButton;
FASTAccordion;

init(
  document.body,
  <fast-design-system-provider use-defaults>
    <fast-button onClick={() => set("expanded", !get("expanded"))}>
      Expand!
    </fast-button>

    <fast-design-system-provider use-defaults>
      <fast-accordion>
        <fast-accordion-item expanded={on("expanded")}>
          <span slot="heading">Panel one</span>
          Panel one content
        </fast-accordion-item>
      </fast-accordion>
    </fast-design-system-provider>
  </fast-design-system-provider>
);