@raxrai/stylelab-ui 0.3.1 → 0.3.2

package/README.md

@@ -49,6 +49,8 @@ export default function RootLayout({ children }) {
 }
 ```
 
+Optional props: `storageKey` (default `"stylelab-theme"`) for the localStorage key; `persistTheme` (default `true`). When `persistTheme={false}`, the provider does not read or write localStorage (theme is fixed to `defaultTheme` unless you change it in memory).
+
 ### 3. Use components
 
 ```tsx
@@ -213,6 +215,10 @@ import { cn, useFocusTrap, useClickOutside, useKeyboardNavigation, getNextListIn
 
 ## Changelog
 
+### [0.3.2]
+
+- **ThemeProvider** — Optional `persistTheme` prop (default `true`). When `persistTheme={false}`, the provider does not read from or write to localStorage: theme stays at `defaultTheme` unless changed in memory. Use for fixed-theme pages (e.g. landing, docs) or nested providers where only the inner tree should persist. Optional `storageKey` (default `"stylelab-theme"`) still applies when `persistTheme` is true.
+
 ### [0.3.1]
 
 - **Dropdown** — `disabled` prop: when true, the dropdown does not open and the trigger is non-interactive (opacity, cursor, no popover). Use for empty or loading state.

package/dist/index.cjs

@@ -341,12 +341,14 @@ function getStoredTheme(storageKey, defaultTheme) {
 function ThemeProvider({
   children,
   defaultTheme = "minimal",
-  storageKey = "stylelab-theme"
+  storageKey = "stylelab-theme",
+  persistTheme = true
 }) {
   const [theme, setThemeState] = (0, import_react.useState)(defaultTheme);
   (0, import_react.useEffect)(() => {
+    if (!persistTheme) return;
     setThemeState((prev) => getStoredTheme(storageKey, prev));
-  }, [storageKey]);
+  }, [storageKey, persistTheme]);
   (0, import_react.useEffect)(() => {
     if (typeof document !== "undefined") {
       try {
@@ -361,12 +363,12 @@ function ThemeProvider({
       if (typeof document !== "undefined") {
         try {
           document.documentElement.dataset.stylelabTheme = next;
-          localStorage.setItem(storageKey, next);
+          if (persistTheme) localStorage.setItem(storageKey, next);
         } catch (_) {
         }
       }
     },
-    [storageKey]
+    [storageKey, persistTheme]
   );
   const value = (0, import_react.useMemo)(
     () => ({ theme, setTheme }),