// Context Store root app

const CS_TWEAK_DEFAULTS = /*EDITMODE-BEGIN*/{
  "accentTheme": "blue"
}/*EDITMODE-END*/;

function CSApp() {
  const [t, setTweak] = useTweaks(CS_TWEAK_DEFAULTS);
  const themeClass = t.accentTheme === "cyan" ? "theme-cyan-accent" : "";

  return (
    <div className={themeClass}>
      <Nav />
      <CSHero />
      <CSValueProps />
      <CSIndustries />
      <CSLogoStrip />
      <CSChallenges />
      <CSArchitecture />
      <CSResources />
      <CSFinalCTA />
      <Footer />

      <TweaksPanel title="Tweaks">
        <TweakSection title="Theme">
          <TweakRadio
            label="Accent color"
            value={t.accentTheme}
            options={[
              { value: "blue", label: "Brand blue" },
              { value: "cyan", label: "Cyan" },
            ]}
            onChange={v => setTweak("accentTheme", v)}
          />
        </TweakSection>
      </TweaksPanel>
    </div>
  );
}

const csRoot = ReactDOM.createRoot(document.getElementById("root"));
csRoot.render(<CSApp />);