@helpwave/hightide 0.1.20 → 0.1.21

package/dist/index.mjs

@@ -3128,8 +3128,9 @@ var LanguageProvider = ({ initialLanguage, children }) => {
     }
   }, [initialLanguage]);
   useEffect2(() => {
+    document.documentElement.setAttribute("lang", language);
     setStoredLanguage(language);
-  }, [language, setStoredLanguage]);
+  }, [language]);
   useEffect2(() => {
     if (storedLanguage !== null) {
       setLanguage(storedLanguage);
@@ -4611,7 +4612,7 @@ var Overlay = ({
   }, []);
   if (!root || !isOpen) return null;
   return ReactDOM.createPortal(
-    /* @__PURE__ */ jsxs9("div", { className: clsx11("fixed inset-0 z-[9999]"), children: [
+    /* @__PURE__ */ jsxs9("div", { className: clsx11("fixed inset-0 z-[200]"), children: [
       /* @__PURE__ */ jsx13(
         "div",
         {
@@ -7152,7 +7153,7 @@ var Menu = ({
         ref: menuRef,
         onClick: (e) => e.stopPropagation(),
         className: clsx33(
-          "absolute rounded-md bg-menu-background text-menu-text shadow-around-lg z-10",
+          "absolute rounded-md bg-menu-background text-menu-text shadow-around-lg z-[300]",
           {
             "animate-pop-in": isOpen,
             "animate-pop-out": !isOpen,
@@ -7371,7 +7372,8 @@ var LanguageModal = ({
             className: "mt-2",
             value: language,
             options: LanguageUtil.languages.map((language2) => ({ label: translation(language2), value: language2 })),
-            onChange: (language2) => setLanguage(language2)
+            onChange: (language2) => setLanguage(language2),
+            searchOptions: { disabled: true }
           }
         ),
         /* @__PURE__ */ jsx44("div", { className: "flex-row-4 mt-3 justify-end", children: /* @__PURE__ */ jsx44(SolidButton, { autoFocus: true, color: "positive", onClick: onClose, children: translation("done") }) })
@@ -7412,6 +7414,7 @@ var ThemeContext = createContext2({
 });
 var ThemeProvider = ({ children, initialTheme = "light" }) => {
   const [theme, setTheme] = useState20(initialTheme);
+  const [storedTheme, setStoredTheme] = useLocalStorage("theme", initialTheme);
   useEffect21(() => {
     if (theme !== initialTheme) {
       console.warn("ThemeProvider initial state changed: Prefer using useTheme's setTheme instead");
@@ -7420,7 +7423,16 @@ var ThemeProvider = ({ children, initialTheme = "light" }) => {
   }, [initialTheme]);
   useEffect21(() => {
     document.documentElement.setAttribute("data-theme", theme);
+    setStoredTheme(theme);
   }, [theme]);
+  useEffect21(() => {
+    if (storedTheme !== null) {
+      setTheme(storedTheme);
+      return;
+    }
+    const prefersDark = window.matchMedia("(prefers-color-scheme: dark)").matches;
+    setTheme(prefersDark ? "dark" : "light");
+  }, []);
   return /* @__PURE__ */ jsx45(ThemeContext.Provider, { value: { theme, setTheme }, children });
 };
 var useTheme = () => useContext2(ThemeContext);
@@ -7460,7 +7472,8 @@ var ThemeModal = ({
             className: "mt-2",
             value: theme,
             options: ThemeUtil.themes.map((theme2) => ({ label: translation(theme2), value: theme2 })),
-            onChange: (theme2) => setTheme(theme2)
+            onChange: (theme2) => setTheme(theme2),
+            searchOptions: { disabled: true }
           }
         ),
         /* @__PURE__ */ jsx46("div", { className: "flex-row-4 mt-3 justify-end", children: /* @__PURE__ */ jsx46(SolidButton, { autoFocus: true, color: "positive", onClick: onClose, children: translation("done") }) })