import { makeProviderMark as n, localStorageProp as o, computedOf as m, Use as u, Portal as i, attr as l } from "@tempots/dom";
import { useAppearance as f } from "@tempots/ui";
const d = {
  mark: n("Theme"),
  // Create function returns the value and cleanup
  create: ({
    defaultAppearance: a = "system",
    appearancePreferenceKey: r = "bui-appearance"
  } = {}) => {
    const t = f(), e = o({
      key: r,
      defaultValue: a
    }), c = () => {
      t.dispose(), e.dispose();
    };
    return {
      value: {
        appearance: m(
          t,
          e
        )((s, p) => p === "system" ? s : p),
        appearancePreference: e,
        setAppearancePreference: (s) => {
          e.set(s);
        }
      },
      dispose: c
    };
  }
}, y = () => u(
  d,
  ({ appearance: a }) => i("html", l.class(a.map((r) => r)))
);
export {
  d as T,
  y as a
};
