@xaui/hybrid 0.0.4 → 0.0.6

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2026 bamory grams
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/dist/core/index.js

@@ -1,9 +1,82 @@
-import {
-  XUIProvider,
-  useColorMode,
-  useXUIColors,
-  useXUITheme
-} from "../chunk-4GTYR4N2.js";
+// src/core/theme-context.tsx
+import React, { createContext } from "react";
+
+// src/core/theme-hooks.ts
+import { useContext, useEffect, useState } from "react";
+var getWebColorMode = () => {
+  if (typeof globalThis === "undefined") return "light";
+  const globalScope = globalThis;
+  if (!globalScope.matchMedia) {
+    return "light";
+  }
+  return globalScope.matchMedia("(prefers-color-scheme: dark)").matches ? "dark" : "light";
+};
+function useColorMode() {
+  const [webScheme, setWebScheme] = useState(() => getWebColorMode());
+  useEffect(() => {
+    if (typeof globalThis === "undefined") return;
+    const globalScope = globalThis;
+    if (!globalScope.matchMedia) return;
+    const media = globalScope.matchMedia("(prefers-color-scheme: dark)");
+    const handleChange = () => {
+      setWebScheme(media.matches ? "dark" : "light");
+    };
+    handleChange();
+    if (typeof media.addEventListener === "function") {
+      media.addEventListener("change", handleChange);
+      return () => media.removeEventListener?.("change", handleChange);
+    }
+    const legacyMedia = media;
+    legacyMedia.addListener?.(handleChange);
+    return () => legacyMedia.removeListener?.(handleChange);
+  }, []);
+  return webScheme;
+}
+function useXUITheme() {
+  const theme = useContext(XUIThemeContext);
+  if (!theme) {
+    throw new Error("useXUITheme must be used within XUIProvider");
+  }
+  return theme;
+}
+function useXUIColors() {
+  const theme = useXUITheme();
+  return theme.colors;
+}
+
+// src/core/theme-context.tsx
+import { defaultTheme } from "@xaui/core/theme";
+import { jsx } from "react/jsx-runtime";
+var XUIThemeContext = createContext(null);
+function XUIProvider({
+  children,
+  theme: lightTheme,
+  darkTheme
+}) {
+  const colorScheme = useColorMode();
+  const theme = React.useMemo(() => {
+    if (!darkTheme && !lightTheme) return defaultTheme;
+    const activeTheme = colorScheme === "dark" && darkTheme ? darkTheme : lightTheme;
+    if (!activeTheme) return defaultTheme;
+    return {
+      ...defaultTheme,
+      ...activeTheme,
+      colors: {
+        ...defaultTheme.colors,
+        ...activeTheme.colors
+      },
+      fontFamilies: {
+        ...defaultTheme.fontFamilies,
+        ...activeTheme.fontFamilies
+      },
+      fontSizes: {
+        ...defaultTheme.fontSizes,
+        ...activeTheme.fontSizes
+      }
+    };
+  }, [lightTheme, darkTheme, colorScheme]);
+  return /* @__PURE__ */ jsx(XUIThemeContext.Provider, { value: theme, children });
+}
 export {
   XUIProvider,
   useColorMode,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@xaui/hybrid",
-  "version": "0.0.4",
+  "version": "0.0.6",
   "description": "Flutter-inspired React UI components for web and mobile webview applications with Framer Motion animations and Tailwind CSS styling",
   "keywords": [
     "react",
@@ -58,10 +58,9 @@
     "clsx": "^2.1.1",
     "tailwind-merge": "^3.4.0",
     "tailwind-variants": "^0.3.1",
-    "@xaui/core": "0.1.7"
+    "@xaui/core": "0.1.9"
   },
   "peerDependencies": {
-    "framer-motion": "^11.0.0",
     "react": "^18.0.0 || ^19.0.0",
     "react-dom": "^18.0.0 || ^19.0.0",
     "tailwindcss": "^4.0.0"