dgz-ui-shared/dist/providers/index.es.js

Custom ui library using React.js, Shadcn/ui, TailwindCSS, Typescript, dgz-ui library

import { j as l } from "../jsx-runtime-C5mzlN2N.js";
import { useState as d, useEffect as h } from "react";
import { T as t } from "../ThemeMode-CqURAYDL.js";
import { T } from "../ThemeProviderContext-DGw2_Ad5.js";
function x({
  children: r,
  defaultTheme: c = t.SYSTEM,
  storageKey: s = "theme",
  ...a
}) {
  const [o, i] = d(
    () => localStorage.getItem(s) || c
  );
  h(() => {
    const e = window.document.documentElement;
    if (e.classList.remove(t.LIGHT, t.DARK), e.style.colorScheme = o, o === t.SYSTEM) {
      const m = window.matchMedia("(prefers-color-scheme: dark)").matches ? t.DARK : t.LIGHT;
      e.classList.add(m), e.style.colorScheme = m;
      return;
    }
    e.classList.add(o);
  }, [o]);
  const n = {
    theme: o,
    setTheme: (e) => {
      localStorage.setItem(s, e), i(e);
    }
  };
  return /* @__PURE__ */ l.jsx(T, { ...a, value: n, children: r });
}
export {
  x as ThemeProvider
};