/** * Zustand store for theme preferences – reusable across Datalayer apps. * * Persists `colorMode` and `theme` to localStorage. The store key is * configurable so that different apps can maintain independent prefs. * * ## Variants * * A *variant* is a named set of theme/colorMode defaults (e.g. `anonymous`, * `authenticated`). When a variant is active, `setTheme`, `setColorMode`, * and `toggleColorMode` automatically update the active variant's stored * preferences. Calling `setVariant(name)` switches theme/colorMode to * that variant's prefs in one step. * * Variants can be registered at build time (via defaults) or at runtime * (via `registerVariants`). `registerVariants` only sets defaults for * variants that don't already exist, preserving user-customised prefs * across page loads. * * @module theme/useThemeStore */ import { type StoreApi, type UseBoundStore } from 'zustand'; import type { ThemeVariant } from './themeRegistry'; import type { ColorMode } from './DatalayerBrandThemeProvider'; export type VariantPreference = { theme: ThemeVariant; colorMode: ColorMode; version?: number; }; /** Per-variant theme + colorMode preferences. */ export type VariantDefaults = Record; export interface ThemeState { /** Current color mode (light, dark, or auto = follow OS). */ colorMode: ColorMode; /** Current theme variant. */ theme: ThemeVariant; /** Cycle through light → dark → auto. */ toggleColorMode: () => void; /** Set a specific color mode. */ setColorMode: (mode: ColorMode) => void; /** * Set the active theme variant. * @param applyDefaultColorMode When true (default), also switches the * color mode to the theme's configured default. */ setTheme: (theme: ThemeVariant, applyDefaultColorMode?: boolean) => void; /** The currently active variant (`null` when no variant is active). */ activeVariant: string | null; /** Per-variant stored preferences. */ variants: VariantDefaults; /** * Register variant definitions. Only sets defaults for variants that * don't already exist — existing (possibly user-customised) variants * are preserved. */ registerVariants: (defs: VariantDefaults) => void; /** * Activate a named variant. Sets `theme` / `colorMode` to the * variant's stored prefs in one step. */ setVariant: (variant: string) => void; } /** * Create a theme store bound to a specific localStorage key. * * Usage: * ```ts * export const useMyAppThemeStore = createThemeStore('my-app-theme'); * ``` * * @param storageKey localStorage key for persistence (e.g. `'otel-example-theme'`) * @param defaults Optional overrides for the initial colorMode / theme / variants */ export declare function createThemeStore(storageKey: string, defaults?: { colorMode?: ColorMode; theme?: ThemeVariant; variants?: VariantDefaults; }): UseBoundStore>; /** * Default theme store for Datalayer applications. * * Persists to `localStorage` under the key `'datalayer-theme'`. * Use `createThemeStore` if you need an app-specific key or defaults. */ export declare const useThemeStore: UseBoundStore>;