@timbal-ai/timbal-react 0.6.0 → 0.7.0

package/dist/{chunk-OVHR7J3J.esm.js → chunk-7O5VY3TP.esm.js}

@@ -17,10 +17,10 @@ import {
   studioSidebarEntryItemVariants,
   studioSidebarWidthTransition,
   useShellInsetReporter
-} from "./chunk-OFHLFNJH.esm.js";
+} from "./chunk-Z27GBSOT.esm.js";
 import {
   WorkforceSelector
-} from "./chunk-WLTW56MC.esm.js";
+} from "./chunk-N3PYVTY5.esm.js";
 import {
   Composer,
   TimbalChat,
@@ -43,10 +43,10 @@ import {
   studioTopbarIconPillClass,
   studioTopbarPillHeightClass,
   useTimbalRuntime
-} from "./chunk-YJQLLFKP.esm.js";
+} from "./chunk-TLUF2RUL.esm.js";
 import {
   PillSegmentedTabs
-} from "./chunk-IYENDIRY.esm.js";
+} from "./chunk-TDIJHV4I.esm.js";
 import {
   Avatar,
   AvatarFallback,
@@ -56,7 +56,7 @@ import {
   TooltipContent,
   TooltipTrigger,
   cn
-} from "./chunk-4TCJQSIX.esm.js";
+} from "./chunk-2XZ3S4OP.esm.js";
 
 // src/hooks/use-workforces.ts
 import { useEffect, useMemo, useRef, useState } from "react";
@@ -1452,9 +1452,29 @@ var TimbalStudioShell = ({
 };
 
 // src/studio/sidebar/mode-toggle.tsx
-import { useCallback as useCallback6, useEffect as useEffect6, useState as useState7 } from "react";
+import { useCallback as useCallback6, useLayoutEffect as useLayoutEffect3, useState as useState7 } from "react";
 import { Moon, Sun } from "lucide-react";
 import { jsx as jsx15, jsxs as jsxs9 } from "react/jsx-runtime";
+function readStoredTheme() {
+  if (typeof window === "undefined") return null;
+  try {
+    const value = window.localStorage.getItem(STORAGE_KEYS.theme);
+    return value === "dark" || value === "light" ? value : null;
+  } catch {
+    return null;
+  }
+}
+function writeStoredTheme(theme) {
+  if (typeof window === "undefined") return;
+  try {
+    window.localStorage.setItem(STORAGE_KEYS.theme, theme);
+  } catch {
+  }
+}
+function applyDarkClass(isDark) {
+  if (typeof document === "undefined") return;
+  document.documentElement.classList.toggle("dark", isDark);
+}
 var ModeToggle = ({
   theme,
   setTheme,
@@ -1463,9 +1483,15 @@ var ModeToggle = ({
 }) => {
   const isControlled = theme !== void 0;
   const [internalIsDark, setInternalIsDark] = useState7(false);
-  useEffect6(() => {
+  useLayoutEffect3(() => {
     if (isControlled) return;
-    if (typeof document === "undefined") return;
+    const stored = readStoredTheme();
+    if (stored) {
+      const isDark2 = stored === "dark";
+      applyDarkClass(isDark2);
+      setInternalIsDark(isDark2);
+      return;
+    }
     setInternalIsDark(document.documentElement.classList.contains("dark"));
   }, [isControlled]);
   const isDark = isControlled ? theme === "dark" : internalIsDark;
@@ -1475,9 +1501,10 @@ var ModeToggle = ({
       setTheme(next);
       return;
     }
-    if (typeof document === "undefined") return;
-    document.documentElement.classList.toggle("dark", next === "dark");
-    setInternalIsDark(next === "dark");
+    const isDarkNext = next === "dark";
+    applyDarkClass(isDarkNext);
+    writeStoredTheme(isDarkNext ? "dark" : "light");
+    setInternalIsDark(isDarkNext);
   }, [isDark, setTheme]);
   return /* @__PURE__ */ jsxs9(
     TimbalV2Button,

package/dist/{chunk-WLTW56MC.esm.js → chunk-N3PYVTY5.esm.js}

@@ -1,10 +1,10 @@
 import {
   studioSecondaryChromeClass,
   studioTopbarPillHeightClass
-} from "./chunk-YJQLLFKP.esm.js";
+} from "./chunk-TLUF2RUL.esm.js";
 import {
   cn
-} from "./chunk-4TCJQSIX.esm.js";
+} from "./chunk-2XZ3S4OP.esm.js";
 
 // src/chat/workforce-selector.tsx
 import { ChevronDownIcon } from "lucide-react";

package/dist/{chunk-IYENDIRY.esm.js → chunk-TDIJHV4I.esm.js}

@@ -1,6 +1,6 @@
 import {
   cn
-} from "./chunk-4TCJQSIX.esm.js";
+} from "./chunk-2XZ3S4OP.esm.js";
 
 // src/ui/pill-segmented-tabs.tsx
 import {