@xaui/native 0.0.23 → 0.0.24

package/dist/chunk-4KSZLONZ.js

@@ -0,0 +1,79 @@
+// src/core/theme-hooks.ts
+import { useContext as useContext2, useMemo as useMemo2 } from "react";
+import { useColorScheme as useColorScheme2 } from "react-native";
+
+// src/core/theme-context.tsx
+import React3, { createContext as createContext2 } from "react";
+import { useColorScheme } from "react-native";
+import { defaultTheme } from "@xaui/core/theme";
+import { colors } from "@xaui/core/palette";
+
+// src/core/portal/portal.tsx
+import { useContext, useEffect, useLayoutEffect, useRef } from "react";
+
+// src/core/portal/portal-context.ts
+import { createContext } from "react";
+var PortalContext = createContext(null);
+
+// src/core/portal/portal.tsx
+var portalId = 0;
+var Portal = ({ children }) => {
+  const context = useContext(PortalContext);
+  const keyRef = useRef(`portal-${++portalId}`);
+  useLayoutEffect(() => {
+    if (!context) return;
+    context.addPortal(keyRef.current, children);
+  }, [children, context]);
+  useEffect(() => {
+    if (!context) return;
+    const key = keyRef.current;
+    return () => {
+      context.removePortal(key);
+    };
+  }, [context]);
+  return null;
+};
+
+// src/core/portal/portal-host.tsx
+import React2, { useCallback, useMemo, useRef as useRef2, useState } from "react";
+import { StyleSheet, View } from "react-native";
+var hostStyles = StyleSheet.create({
+  container: {
+    flex: 1
+  }
+});
+
+// src/core/theme-context.tsx
+var XUIThemeContext = createContext2(null);
+
+// src/core/theme-hooks.ts
+function useXUITheme() {
+  const theme = useContext2(XUIThemeContext);
+  if (!theme) {
+    throw new Error("useXUITheme must be used within XUIProvider");
+  }
+  return theme;
+}
+function useBorderRadiusStyles(radius) {
+  const theme = useXUITheme();
+  const borderRadius = useMemo2(() => {
+    const radiusMap = {
+      none: theme.borderRadius.none,
+      sm: theme.borderRadius.sm,
+      md: theme.borderRadius.md,
+      lg: theme.borderRadius.lg,
+      full: theme.borderRadius.full
+    };
+    return { borderRadius: radiusMap[radius] };
+  }, [radius, theme]);
+  return borderRadius;
+}
+
+// src/core/index.ts
+import { defaultDarkTheme, defaultTheme as defaultTheme2 } from "@xaui/core/theme";
+
+export {
+  Portal,
+  useXUITheme,
+  useBorderRadiusStyles
+};

package/dist/{chunk-DXXNBF5P.js → chunk-CZFDZPAS.js}

@@ -1,7 +1,2 @@
 // src/core/index.ts
 import { defaultDarkTheme, defaultTheme } from "@xaui/core/theme";
-
-export {
-  defaultDarkTheme,
-  defaultTheme
-};

package/dist/{chunk-LTKYHG5V.js → chunk-GHCVNQET.js}

@@ -1,3 +1,9 @@
+// src/core/theme-context.tsx
+import React3, { createContext as createContext2 } from "react";
+import { useColorScheme } from "react-native";
+import { defaultTheme } from "@xaui/core/theme";
+import { colors } from "@xaui/core/palette";
+
 // src/core/portal/portal.tsx
 import { useContext, useEffect, useLayoutEffect, useRef } from "react";
 
@@ -51,10 +57,6 @@ var PortalHost = ({ children }) => {
 };
 
 // src/core/theme-context.tsx
-import React3, { createContext as createContext2 } from "react";
-import { useColorScheme } from "react-native";
-import { defaultTheme } from "@xaui/core/theme";
-import { colors } from "@xaui/core/palette";
 var XUIThemeContext = createContext2(null);
 function XUIProvider({
   children,
@@ -126,6 +128,9 @@ function useBorderRadiusStyles(radius) {
   return borderRadius;
 }
 
+// src/core/index.ts
+import { defaultDarkTheme, defaultTheme as defaultTheme2 } from "@xaui/core/theme";
+
 export {
   Portal,
   PortalHost,
@@ -134,5 +139,7 @@ export {
   useXUITheme,
   useXUIColors,
   useXUIPalette,
-  useBorderRadiusStyles
+  useBorderRadiusStyles,
+  defaultDarkTheme,
+  defaultTheme2 as defaultTheme
 };

package/dist/chunk-I4V5Y5GD.js

@@ -0,0 +1,76 @@
+// src/core/portal/portal.tsx
+import { useContext, useEffect, useLayoutEffect, useRef } from "react";
+
+// src/core/portal/portal-context.ts
+import { createContext } from "react";
+var PortalContext = createContext(null);
+
+// src/core/portal/portal.tsx
+var portalId = 0;
+var Portal = ({ children }) => {
+  const context = useContext(PortalContext);
+  const keyRef = useRef(`portal-${++portalId}`);
+  useLayoutEffect(() => {
+    if (!context) return;
+    context.addPortal(keyRef.current, children);
+  }, [children, context]);
+  useEffect(() => {
+    if (!context) return;
+    const key = keyRef.current;
+    return () => {
+      context.removePortal(key);
+    };
+  }, [context]);
+  return null;
+};
+
+// src/core/theme-hooks.ts
+import { useContext as useContext2, useMemo as useMemo2 } from "react";
+import { useColorScheme as useColorScheme2 } from "react-native";
+
+// src/core/theme-context.tsx
+import React3, { createContext as createContext2 } from "react";
+import { useColorScheme } from "react-native";
+import { defaultTheme } from "@xaui/core/theme";
+import { colors } from "@xaui/core/palette";
+
+// src/core/portal/portal-host.tsx
+import React2, { useCallback, useMemo, useRef as useRef2, useState } from "react";
+import { StyleSheet, View } from "react-native";
+var hostStyles = StyleSheet.create({
+  container: {
+    flex: 1
+  }
+});
+
+// src/core/theme-context.tsx
+var XUIThemeContext = createContext2(null);
+
+// src/core/theme-hooks.ts
+function useXUITheme() {
+  const theme = useContext2(XUIThemeContext);
+  if (!theme) {
+    throw new Error("useXUITheme must be used within XUIProvider");
+  }
+  return theme;
+}
+function useBorderRadiusStyles(radius) {
+  const theme = useXUITheme();
+  const borderRadius = useMemo2(() => {
+    const radiusMap = {
+      none: theme.borderRadius.none,
+      sm: theme.borderRadius.sm,
+      md: theme.borderRadius.md,
+      lg: theme.borderRadius.lg,
+      full: theme.borderRadius.full
+    };
+    return { borderRadius: radiusMap[radius] };
+  }, [radius, theme]);
+  return borderRadius;
+}
+
+export {
+  Portal,
+  useXUITheme,
+  useBorderRadiusStyles
+};

package/dist/{chunk-F7WH4DMG.js → chunk-UI5L26KD.js}

@@ -1,6 +1,6 @@
 import {
   useXUITheme
-} from "./chunk-LTKYHG5V.js";
+} from "./chunk-GHCVNQET.js";
 
 // src/components/indicator/indicator.tsx
 import React3 from "react";

package/dist/{chunk-LUBWRVI2.js → chunk-ULJSCNPE.js}

@@ -1,6 +1,6 @@
 import {
   useXUITheme
-} from "./chunk-LTKYHG5V.js";
+} from "./chunk-GHCVNQET.js";
 
 // src/components/divider/divider.tsx
 import React from "react";

package/dist/chunk-URBEEDFX.js

@@ -0,0 +1,79 @@
+// src/core/portal/portal.tsx
+import { useContext, useEffect, useLayoutEffect, useRef } from "react";
+
+// src/core/portal/portal-context.ts
+import { createContext } from "react";
+var PortalContext = createContext(null);
+
+// src/core/portal/portal.tsx
+var portalId = 0;
+var Portal = ({ children }) => {
+  const context = useContext(PortalContext);
+  const keyRef = useRef(`portal-${++portalId}`);
+  useLayoutEffect(() => {
+    if (!context) return;
+    context.addPortal(keyRef.current, children);
+  }, [children, context]);
+  useEffect(() => {
+    if (!context) return;
+    const key = keyRef.current;
+    return () => {
+      context.removePortal(key);
+    };
+  }, [context]);
+  return null;
+};
+
+// src/core/theme-hooks.ts
+import { useContext as useContext2, useMemo as useMemo2 } from "react";
+import { useColorScheme as useColorScheme2 } from "react-native";
+
+// src/core/theme-context.tsx
+import React3, { createContext as createContext2 } from "react";
+import { useColorScheme } from "react-native";
+import { defaultTheme } from "@xaui/core/theme";
+import { colors } from "@xaui/core/palette";
+
+// src/core/portal/portal-host.tsx
+import React2, { useCallback, useMemo, useRef as useRef2, useState } from "react";
+import { StyleSheet, View } from "react-native";
+var hostStyles = StyleSheet.create({
+  container: {
+    flex: 1
+  }
+});
+
+// src/core/theme-context.tsx
+var XUIThemeContext = createContext2(null);
+
+// src/core/theme-hooks.ts
+function useXUITheme() {
+  const theme = useContext2(XUIThemeContext);
+  if (!theme) {
+    throw new Error("useXUITheme must be used within XUIProvider");
+  }
+  return theme;
+}
+function useBorderRadiusStyles(radius) {
+  const theme = useXUITheme();
+  const borderRadius = useMemo2(() => {
+    const radiusMap = {
+      none: theme.borderRadius.none,
+      sm: theme.borderRadius.sm,
+      md: theme.borderRadius.md,
+      lg: theme.borderRadius.lg,
+      full: theme.borderRadius.full
+    };
+    return { borderRadius: radiusMap[radius] };
+  }, [radius, theme]);
+  return borderRadius;
+}
+
+// src/core/index.ts
+import { defaultDarkTheme, defaultTheme as defaultTheme2 } from "@xaui/core/theme";
+
+export {
+  Portal,
+  useXUITheme,
+  useBorderRadiusStyles
+};

package/dist/core/index.d.cts

@@ -0,0 +1,28 @@
+import React, { ReactNode } from 'react';
+import { XUITheme } from '@xaui/core/theme';
+export { defaultDarkTheme, defaultTheme } from '@xaui/core/theme';
+
+type DeepPartial<T> = {
+    [P in keyof T]?: T[P] extends object ? DeepPartial<T[P]> : T[P];
+};
+interface XUIProviderProps {
+    children: ReactNode;
+    theme?: DeepPartial<XUITheme>;
+    darkTheme?: DeepPartial<XUITheme>;
+}
+declare function XUIProvider({ children, theme: lightTheme, darkTheme, }: XUIProviderProps): React.JSX.Element;
+
+type ColorMode = 'light' | 'dark';
+declare function useColorMode(): ColorMode;
+declare function useXUITheme(): XUITheme;
+declare function useXUIColors(): XUITheme['colors'];
+
+declare const Portal: React.FC<{
+    children: ReactNode;
+}>;
+
+declare const PortalHost: React.FC<{
+    children: ReactNode;
+}>;
+
+export { Portal, PortalHost, XUIProvider, useColorMode, useXUIColors, useXUITheme };

package/dist/core/index.d.ts

@@ -1,5 +1,28 @@
-export { XUIProvider } from './theme-context';
-export { useColorMode, useXUITheme, useXUIColors } from './theme-hooks';
+import React, { ReactNode } from 'react';
+import { XUITheme } from '@xaui/core/theme';
 export { defaultDarkTheme, defaultTheme } from '@xaui/core/theme';
-export { Portal, PortalHost } from './portal';
-//# sourceMappingURL=index.d.ts.map
+
+type DeepPartial<T> = {
+    [P in keyof T]?: T[P] extends object ? DeepPartial<T[P]> : T[P];
+};
+interface XUIProviderProps {
+    children: ReactNode;
+    theme?: DeepPartial<XUITheme>;
+    darkTheme?: DeepPartial<XUITheme>;
+}
+declare function XUIProvider({ children, theme: lightTheme, darkTheme, }: XUIProviderProps): React.JSX.Element;
+
+type ColorMode = 'light' | 'dark';
+declare function useColorMode(): ColorMode;
+declare function useXUITheme(): XUITheme;
+declare function useXUIColors(): XUITheme['colors'];
+
+declare const Portal: React.FC<{
+    children: ReactNode;
+}>;
+
+declare const PortalHost: React.FC<{
+    children: ReactNode;
+}>;
+
+export { Portal, PortalHost, XUIProvider, useColorMode, useXUIColors, useXUITheme };

package/dist/core/index.js

@@ -1,15 +1,13 @@
-import {
-  defaultDarkTheme,
-  defaultTheme
-} from "../chunk-DXXNBF5P.js";
 import {
   Portal,
   PortalHost,
   XUIProvider,
+  defaultDarkTheme,
+  defaultTheme,
   useColorMode,
   useXUIColors,
   useXUITheme
-} from "../chunk-LTKYHG5V.js";
+} from "../chunk-GHCVNQET.js";
 export {
   Portal,
   PortalHost,

package/dist/{components/datepicker/datepicker.type.d.mts → datepicker/index.d.cts}

@@ -1,15 +1,16 @@
-import type { ReactNode } from 'react';
-import type { TextStyle, ViewStyle } from 'react-native';
-import type { Radius, Size, ThemeColor } from '../../types';
-export type DatePickerVariant = 'outlined' | 'flat' | 'light' | 'faded' | 'underlined';
-export type DatePickerLabelPlacement = 'inside' | 'outside' | 'outside-left' | 'outside-top';
-export type DatePickerCustomAppearance = {
+import React, { ReactNode } from 'react';
+import { ViewStyle, TextStyle } from 'react-native';
+import { T as ThemeColor, S as Size, R as Radius } from '../index-BOw6tbkc.cjs';
+
+type DatePickerVariant = 'outlined' | 'flat' | 'light' | 'faded' | 'underlined';
+type DatePickerLabelPlacement = 'inside' | 'outside' | 'outside-left' | 'outside-top';
+type DatePickerCustomAppearance = {
     container?: ViewStyle;
     text?: TextStyle;
     trigger?: ViewStyle;
     calendar?: ViewStyle;
 };
-export type DatePickerProps = {
+type DatePickerProps = {
     value?: Date | null;
     defaultValue?: Date;
     onChange?: (date: Date | null) => void;
@@ -38,5 +39,7 @@ export type DatePickerProps = {
     onClose?: () => void;
     onOpenChange?: (isOpen: boolean) => void;
 };
-export type CalendarViewMode = 'calendar' | 'year' | 'month';
-//# sourceMappingURL=datepicker.type.d.ts.map
+
+declare const DatePicker: React.FC<DatePickerProps>;
+
+export { DatePicker, type DatePickerCustomAppearance, type DatePickerLabelPlacement, type DatePickerProps, type DatePickerVariant };

package/dist/datepicker/index.d.ts

@@ -1,3 +1,45 @@
-export { DatePicker } from './datepicker';
-export type { DatePickerProps, DatePickerVariant, DatePickerLabelPlacement, DatePickerCustomAppearance, } from './datepicker.type';
-//# sourceMappingURL=index.d.ts.map
+import React, { ReactNode } from 'react';
+import { ViewStyle, TextStyle } from 'react-native';
+import { T as ThemeColor, S as Size, R as Radius } from '../index-BOw6tbkc.js';
+
+type DatePickerVariant = 'outlined' | 'flat' | 'light' | 'faded' | 'underlined';
+type DatePickerLabelPlacement = 'inside' | 'outside' | 'outside-left' | 'outside-top';
+type DatePickerCustomAppearance = {
+    container?: ViewStyle;
+    text?: TextStyle;
+    trigger?: ViewStyle;
+    calendar?: ViewStyle;
+};
+type DatePickerProps = {
+    value?: Date | null;
+    defaultValue?: Date;
+    onChange?: (date: Date | null) => void;
+    locale?: string;
+    minDate?: Date;
+    maxDate?: Date;
+    firstDayOfWeek?: 0 | 1;
+    variant?: DatePickerVariant;
+    themeColor?: ThemeColor;
+    size?: Size;
+    radius?: Radius;
+    label?: ReactNode;
+    placeholder?: string;
+    description?: ReactNode;
+    errorMessage?: ReactNode;
+    labelPlacement?: DatePickerLabelPlacement;
+    fullWidth?: boolean;
+    isDisabled?: boolean;
+    isInvalid?: boolean;
+    isReadOnly?: boolean;
+    isClearable?: boolean;
+    disableAnimation?: boolean;
+    customAppearance?: DatePickerCustomAppearance;
+    calendarIcon?: ReactNode;
+    onOpen?: () => void;
+    onClose?: () => void;
+    onOpenChange?: (isOpen: boolean) => void;
+};
+
+declare const DatePicker: React.FC<DatePickerProps>;
+
+export { DatePicker, type DatePickerCustomAppearance, type DatePickerLabelPlacement, type DatePickerProps, type DatePickerVariant };

package/dist/datepicker/index.js

@@ -1,8 +1,7 @@
-import "../chunk-DXXNBF5P.js";
 import {
   Portal,
   useXUITheme
-} from "../chunk-LTKYHG5V.js";
+} from "../chunk-URBEEDFX.js";
 
 // src/components/datepicker/datepicker.tsx
 import React7, { useCallback as useCallback5, useMemo as useMemo6, useRef as useRef6 } from "react";

package/dist/{components/divider/divider.type.d.mts → divider/index.d.cts}

@@ -1,6 +1,8 @@
-import type { ThemeColor } from '../../types';
-export type DividerOrientation = 'horizontal' | 'vertical';
-export type DividerProps = {
+import React from 'react';
+import { T as ThemeColor } from '../index-BOw6tbkc.cjs';
+
+type DividerOrientation = 'horizontal' | 'vertical';
+type DividerProps = {
     /**
      * The size (thickness) of the divider in pixels.
      * @default 1
@@ -22,4 +24,7 @@ export type DividerProps = {
      */
     orientation?: DividerOrientation;
 };
-//# sourceMappingURL=divider.type.d.ts.map
+
+declare const Divider: React.FC<DividerProps>;
+
+export { Divider, type DividerOrientation, type DividerProps };

package/dist/divider/index.d.ts

@@ -1,3 +1,30 @@
-export { Divider } from './divider';
-export type { DividerProps, DividerOrientation } from './divider.type';
-//# sourceMappingURL=index.d.ts.map
+import React from 'react';
+import { T as ThemeColor } from '../index-BOw6tbkc.js';
+
+type DividerOrientation = 'horizontal' | 'vertical';
+type DividerProps = {
+    /**
+     * The size (thickness) of the divider in pixels.
+     * @default 1
+     */
+    size?: number;
+    /**
+     * The theme color of the divider.
+     * @default 'default'
+     */
+    themeColor?: ThemeColor;
+    /**
+     * Custom color for the divider.
+     * If provided, this will override themeColor.
+     */
+    color?: string;
+    /**
+     * The orientation of the divider.
+     * @default 'horizontal'
+     */
+    orientation?: DividerOrientation;
+};
+
+declare const Divider: React.FC<DividerProps>;
+
+export { Divider, type DividerOrientation, type DividerProps };

package/dist/divider/index.js

@@ -1,8 +1,7 @@
 import {
   Divider
-} from "../chunk-LUBWRVI2.js";
-import "../chunk-DXXNBF5P.js";
-import "../chunk-LTKYHG5V.js";
+} from "../chunk-ULJSCNPE.js";
+import "../chunk-GHCVNQET.js";
 export {
   Divider
 };

package/dist/drawer/index.cjs

@@ -267,7 +267,15 @@ var Drawer = ({
         setIsModalMounted(false);
       }
     });
-  }, [isOpen, position, size, disableAnimation, translateX, translateY, overlayOpacity]);
+  }, [
+    isOpen,
+    position,
+    size,
+    disableAnimation,
+    translateX,
+    translateY,
+    overlayOpacity
+  ]);
   if (!isModalMounted) {
     return null;
   }

package/dist/{components/drawer/drawer.type.d.mts → drawer/index.d.cts}

@@ -1,8 +1,9 @@
-import type { ReactNode } from 'react';
-import type { ViewStyle } from 'react-native';
-import type { ThemeColor } from '../../types';
-export type DrawerPosition = 'top' | 'left' | 'bottom' | 'right';
-export type DrawerProps = {
+import React, { ReactNode } from 'react';
+import { ViewStyle } from 'react-native';
+import { T as ThemeColor } from '../index-BOw6tbkc.cjs';
+
+type DrawerPosition = 'top' | 'left' | 'bottom' | 'right';
+type DrawerProps = {
     /**
      * Content to render inside the drawer.
      */
@@ -51,4 +52,7 @@ export type DrawerProps = {
      */
     disableAnimation?: boolean;
 };
-//# sourceMappingURL=drawer.type.d.ts.map
+
+declare const Drawer: React.FC<DrawerProps>;
+
+export { Drawer, type DrawerPosition, type DrawerProps };

package/dist/drawer/index.d.ts

@@ -1,3 +1,58 @@
-export { Drawer } from './drawer';
-export type { DrawerProps, DrawerPosition } from './drawer.type';
-//# sourceMappingURL=index.d.ts.map
+import React, { ReactNode } from 'react';
+import { ViewStyle } from 'react-native';
+import { T as ThemeColor } from '../index-BOw6tbkc.js';
+
+type DrawerPosition = 'top' | 'left' | 'bottom' | 'right';
+type DrawerProps = {
+    /**
+     * Content to render inside the drawer.
+     */
+    children: ReactNode;
+    /**
+     * Whether the drawer is visible.
+     * @default false
+     */
+    isOpen: boolean;
+    /**
+     * Position of the drawer.
+     * @default 'left'
+     */
+    position?: DrawerPosition;
+    /**
+     * The theme color of the drawer.
+     * @default 'default'
+     */
+    themeColor?: ThemeColor;
+    /**
+     * Width of the drawer (for left/right position).
+     * @default 280
+     */
+    width?: number;
+    /**
+     * Height of the drawer (for top/bottom position).
+     * @default 280
+     */
+    height?: number;
+    /**
+     * Whether to show overlay backdrop.
+     * @default true
+     */
+    showOverlay?: boolean;
+    /**
+     * Callback fired when drawer should close (overlay tap or back button).
+     */
+    onClose?: () => void;
+    /**
+     * Custom styles for the drawer container.
+     */
+    customStyle?: ViewStyle;
+    /**
+     * Disable slide animation.
+     * @default false
+     */
+    disableAnimation?: boolean;
+};
+
+declare const Drawer: React.FC<DrawerProps>;
+
+export { Drawer, type DrawerPosition, type DrawerProps };