@xaui/native 0.2.7 → 0.9.1-alpha.0

package/dist/chunk-DHSTKO3K.cjs

@@ -1,19 +0,0 @@
-"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }// src/components/select/checkmark-icon.tsx
-var _react = require('react'); var _react2 = _interopRequireDefault(_react);
-var _reactnativesvg = require('react-native-svg'); var _reactnativesvg2 = _interopRequireDefault(_reactnativesvg);
-function CheckmarkIcon({ color, size }) {
-  return /* @__PURE__ */ _react2.default.createElement(_reactnativesvg2.default, { width: size, height: size, viewBox: "0 0 17 18", fill: "none" }, /* @__PURE__ */ _react2.default.createElement(
-    _reactnativesvg.Polyline,
-    {
-      points: "1 9 7 14 15 4",
-      stroke: color,
-      strokeWidth: 2,
-      strokeLinecap: "round",
-      strokeLinejoin: "round"
-    }
-  ));
-}
-
-
-
-exports.CheckmarkIcon = CheckmarkIcon;

package/dist/chunk-DJ4Q37UT.cjs

@@ -1,75 +0,0 @@
-"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
-var _chunk7UFBLUMVcjs = require('./chunk-7UFBLUMV.cjs');
-
-// src/components/divider/divider.tsx
-var _react = require('react'); var _react2 = _interopRequireDefault(_react);
-var _reactnative = require('react-native');
-
-// src/components/divider/divider.style.ts
-
-var styles = _reactnative.StyleSheet.create({
-  horizontal: {
-    height: 1,
-    flexShrink: 1,
-    flexBasis: "auto",
-    width: "100%"
-  },
-  vertical: {
-    width: 1,
-    alignSelf: "stretch"
-  }
-});
-
-// src/components/divider/divider.hook.ts
-
-var _core = require('@xaui/core');
-var useDividerColor = (themeColor, customColor) => {
-  const theme = _chunk7UFBLUMVcjs.useXUITheme.call(void 0, );
-  const dividerColor = _react.useMemo.call(void 0, () => {
-    if (customColor) {
-      return customColor;
-    }
-    const safeThemeColor = _core.getSafeThemeColor.call(void 0, themeColor);
-    return theme.colors[safeThemeColor].main;
-  }, [customColor, themeColor, theme]);
-  return dividerColor;
-};
-var useDividerSize = (size, orientation) => {
-  const sizeStyles = _react.useMemo.call(void 0, () => {
-    if (orientation === "horizontal") {
-      return {
-        height: size
-      };
-    }
-    return {
-      width: size
-    };
-  }, [size, orientation]);
-  return sizeStyles;
-};
-
-// src/components/divider/divider.tsx
-var Divider = ({
-  size = 1,
-  themeColor = "default",
-  color,
-  orientation = "horizontal"
-}) => {
-  const dividerColor = useDividerColor(themeColor, color);
-  const sizeStyles = useDividerSize(size, orientation);
-  return /* @__PURE__ */ _react2.default.createElement(
-    _reactnative.View,
-    {
-      style: [
-        orientation === "horizontal" ? styles.horizontal : styles.vertical,
-        sizeStyles,
-        { backgroundColor: dividerColor }
-      ]
-    }
-  );
-};
-
-
-
-exports.Divider = Divider;

package/dist/chunk-EUQDGTST.cjs

@@ -1 +0,0 @@
-"use strict";

package/dist/chunk-GBHQCAKW.js

@@ -1,19 +0,0 @@
-// src/components/select/checkmark-icon.tsx
-import React from "react";
-import Svg, { Polyline } from "react-native-svg";
-function CheckmarkIcon({ color, size }) {
-  return /* @__PURE__ */ React.createElement(Svg, { width: size, height: size, viewBox: "0 0 17 18", fill: "none" }, /* @__PURE__ */ React.createElement(
-    Polyline,
-    {
-      points: "1 9 7 14 15 4",
-      stroke: color,
-      strokeWidth: 2,
-      strokeLinecap: "round",
-      strokeLinejoin: "round"
-    }
-  ));
-}
-
-export {
-  CheckmarkIcon
-};

package/dist/chunk-RBSA4NH4.js

@@ -1,136 +0,0 @@
-// 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
-  }
-});
-var PortalHost = ({ children }) => {
-  const portals = useRef2(/* @__PURE__ */ new Map());
-  const [, forceUpdate] = useState(0);
-  const addPortal = useCallback((key, element) => {
-    portals.current.set(key, element);
-    forceUpdate((n) => n + 1);
-  }, []);
-  const removePortal = useCallback((key) => {
-    portals.current.delete(key);
-    forceUpdate((n) => n + 1);
-  }, []);
-  const contextValue = useMemo(
-    () => ({ addPortal, removePortal }),
-    [addPortal, removePortal]
-  );
-  return /* @__PURE__ */ React2.createElement(PortalContext.Provider, { value: contextValue }, /* @__PURE__ */ React2.createElement(View, { style: hostStyles.container }, children, Array.from(portals.current.entries()).map(([key, element]) => /* @__PURE__ */ React2.createElement(React2.Fragment, { key }, element))));
-};
-
-// src/core/theme-context.tsx
-import React3, { createContext as createContext2 } from "react";
-import { useColorScheme } from "react-native";
-import { defaultDarkTheme, defaultTheme } from "@xaui/core/theme";
-import { colors } from "@xaui/core/palette";
-var XUIThemeContext = createContext2(null);
-function XUIProvider({ children, theme }) {
-  const colorScheme = useColorScheme() ?? "light";
-  const appTheme = React3.useMemo(() => {
-    const isDarkMode = colorScheme === "dark";
-    if (!theme) return isDarkMode ? defaultDarkTheme : defaultTheme;
-    return {
-      ...defaultTheme,
-      ...theme,
-      mode: colorScheme,
-      colors: {
-        ...defaultTheme.colors,
-        ...theme?.colors
-      },
-      fontFamilies: {
-        ...defaultTheme.fontFamilies,
-        ...theme?.fontFamilies
-      },
-      fontSizes: {
-        ...defaultTheme.fontSizes,
-        ...theme?.fontSizes
-      },
-      componentSizes: {
-        ...defaultTheme.componentSizes,
-        ...theme?.componentSizes
-      },
-      palette: colors
-    };
-  }, [colorScheme, theme]);
-  return /* @__PURE__ */ React3.createElement(XUIThemeContext.Provider, { value: appTheme }, /* @__PURE__ */ React3.createElement(PortalHost, null, children));
-}
-
-// src/core/theme-hooks.ts
-import { useContext as useContext2, useMemo as useMemo2 } from "react";
-import { useColorScheme as useColorScheme2 } from "react-native";
-function useColorMode() {
-  const nativeScheme = useColorScheme2();
-  return nativeScheme ?? "light";
-}
-function useXUITheme() {
-  const theme = useContext2(XUIThemeContext);
-  if (!theme) {
-    throw new Error("useXUITheme must be used within XUIProvider");
-  }
-  return theme;
-}
-function useXUIColors() {
-  const theme = useXUITheme();
-  return theme.colors;
-}
-function useXUIPalette() {
-  const theme = useXUITheme();
-  return useMemo2(() => theme.palette, [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,
-  PortalHost,
-  XUIProvider,
-  useColorMode,
-  useXUITheme,
-  useXUIColors,
-  useXUIPalette,
-  useBorderRadiusStyles
-};

package/dist/chunk-SHBDANQN.js

@@ -1,9 +0,0 @@
-// src/core/index.ts
-import { defaultDarkTheme, defaultTheme } from "@xaui/core/theme";
-import { colors } from "@xaui/core/palette";
-
-export {
-  defaultDarkTheme,
-  defaultTheme,
-  colors
-};

package/dist/chunk-UGEINZM7.cjs

@@ -1,290 +0,0 @@
-"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } function _optionalChain(ops) { let lastAccessLHS = undefined; let value = ops[0]; let i = 1; while (i < ops.length) { const op = ops[i]; const fn = ops[i + 1]; i += 2; if ((op === 'optionalAccess' || op === 'optionalCall') && value == null) { return undefined; } if (op === 'access' || op === 'optionalAccess') { lastAccessLHS = value; value = fn(value); } else if (op === 'call' || op === 'optionalCall') { value = fn((...args) => value.call(lastAccessLHS, ...args)); lastAccessLHS = undefined; } } return value; }
-
-var _chunkYIEUN3G5cjs = require('./chunk-YIEUN3G5.cjs');
-
-
-var _chunk7UFBLUMVcjs = require('./chunk-7UFBLUMV.cjs');
-
-// src/components/fab/fab.tsx
-var _react = require('react'); var _react2 = _interopRequireDefault(_react);
-var _reactnative = require('react-native');
-
-// src/components/fab/fab.style.ts
-
-var styles = _reactnative.StyleSheet.create({
-  container: {
-    alignSelf: "flex-start"
-  },
-  fab: {
-    flexDirection: "row",
-    alignItems: "center",
-    justifyContent: "center",
-    overflow: "hidden"
-  },
-  contentContainer: {
-    flexDirection: "row",
-    alignItems: "center",
-    justifyContent: "center",
-    gap: 12
-  },
-  label: {
-    fontWeight: "500"
-  },
-  disabled: {
-    opacity: 0.5
-  }
-});
-
-// src/components/fab/fab.hook.ts
-
-var _core = require('@xaui/core');
-function useFabSizeStyles(size) {
-  const theme = _chunk7UFBLUMVcjs.useXUITheme.call(void 0, );
-  const sizeStyles = _react.useMemo.call(void 0, () => {
-    const sizes = {
-      sm: {
-        width: 40,
-        height: 40,
-        borderRadius: theme.borderRadius.lg,
-        iconSize: 24,
-        fontSize: theme.fontSizes.sm
-      },
-      md: {
-        width: 56,
-        height: 56,
-        borderRadius: theme.borderRadius.xl,
-        iconSize: 24,
-        fontSize: theme.fontSizes.md
-      },
-      lg: {
-        width: 96,
-        height: 96,
-        borderRadius: theme.borderRadius["2xl"],
-        iconSize: 36,
-        fontSize: theme.fontSizes.lg
-      }
-    };
-    return sizes[size];
-  }, [size, theme]);
-  const extendedSizeStyles = _react.useMemo.call(void 0, () => {
-    const sizes = {
-      sm: {
-        height: 40,
-        borderRadius: theme.borderRadius.lg,
-        paddingHorizontal: theme.spacing.md,
-        iconSize: 20,
-        fontSize: theme.fontSizes.sm
-      },
-      md: {
-        height: 56,
-        borderRadius: theme.borderRadius.xl,
-        paddingHorizontal: theme.spacing.lg,
-        iconSize: 24,
-        fontSize: theme.fontSizes.md
-      },
-      lg: {
-        height: 80,
-        borderRadius: theme.borderRadius["2xl"],
-        paddingHorizontal: theme.spacing.xl,
-        iconSize: 28,
-        fontSize: theme.fontSizes.lg
-      }
-    };
-    return sizes[size];
-  }, [size, theme]);
-  return { sizeStyles, extendedSizeStyles };
-}
-function useFabVariantStyles(themeColor, variant, elevation = 0) {
-  const theme = _chunk7UFBLUMVcjs.useXUITheme.call(void 0, );
-  const safeThemeColor = _core.getSafeThemeColor.call(void 0, themeColor);
-  const colorScheme = theme.colors[safeThemeColor];
-  const variantStyles = _react.useMemo.call(void 0, () => {
-    const variantMap = {
-      solid: {
-        backgroundColor: colorScheme.main,
-        borderWidth: 0
-      },
-      flat: {
-        backgroundColor: colorScheme.container,
-        borderWidth: 0
-      },
-      outlined: {
-        backgroundColor: "transparent",
-        borderWidth: theme.borderWidth.md,
-        borderColor: colorScheme.main
-      }
-    };
-    const baseStyle = variantMap[variant];
-    const shouldApplyElevation = variant !== "outlined";
-    const shadowStyles = elevation === 0 ? {} : elevation === 1 ? theme.shadows.sm : elevation === 2 ? theme.shadows.md : elevation === 3 ? theme.shadows.lg : theme.shadows.xl;
-    return {
-      ...baseStyle,
-      ...shouldApplyElevation ? shadowStyles : {},
-      ...shouldApplyElevation && elevation > 0 ? { elevation } : {}
-    };
-  }, [variant, colorScheme, theme, elevation]);
-  return variantStyles;
-}
-function useFabIconColor(themeColor, variant) {
-  const theme = _chunk7UFBLUMVcjs.useXUITheme.call(void 0, );
-  const safeThemeColor = _core.getSafeThemeColor.call(void 0, themeColor);
-  const colorScheme = theme.colors[safeThemeColor];
-  const iconColor = _react.useMemo.call(void 0, () => {
-    if (variant === "solid") {
-      return colorScheme.onMain;
-    }
-    if (variant === "flat") {
-      return colorScheme.onContainer;
-    }
-    return colorScheme.main;
-  }, [variant, colorScheme]);
-  return { iconColor };
-}
-function useFabRadiusValue(radius, fallback) {
-  const theme = _chunk7UFBLUMVcjs.useXUITheme.call(void 0, );
-  return _react.useMemo.call(void 0, () => {
-    if (!radius) return fallback;
-    const radiusMap = {
-      none: theme.borderRadius.none,
-      sm: theme.borderRadius.sm,
-      md: theme.borderRadius.md,
-      lg: theme.borderRadius.lg,
-      full: theme.borderRadius.full
-    };
-    return radiusMap[radius];
-  }, [fallback, radius, theme]);
-}
-
-// src/components/fab/fab.animation.ts
-
-var runFabPressInAnimation = (animatedScale, animatedOpacity) => {
-  _reactnative.Animated.parallel([
-    _reactnative.Animated.spring(animatedScale, {
-      toValue: 0.92,
-      useNativeDriver: true,
-      speed: 50,
-      bounciness: 0
-    }),
-    _reactnative.Animated.timing(animatedOpacity, {
-      toValue: 0.85,
-      duration: 100,
-      useNativeDriver: true
-    })
-  ]).start();
-};
-var runFabPressOutAnimation = (animatedScale, animatedOpacity) => {
-  _reactnative.Animated.parallel([
-    _reactnative.Animated.spring(animatedScale, {
-      toValue: 1,
-      useNativeDriver: true,
-      speed: 50,
-      bounciness: 0
-    }),
-    _reactnative.Animated.timing(animatedOpacity, {
-      toValue: 1,
-      duration: 100,
-      useNativeDriver: true
-    })
-  ]).start();
-};
-
-// src/components/fab/fab.tsx
-var Fab = ({
-  icon,
-  label,
-  themeColor = "primary",
-  variant = "solid",
-  size = "md",
-  radius,
-  isDisabled = false,
-  isLoading = false,
-  elevation = 0,
-  customAppearance,
-  onPress,
-  onLongPress,
-  onPressIn,
-  onPressOut
-}) => {
-  const animatedScale = _react2.default.useRef(new _reactnative.Animated.Value(1)).current;
-  const animatedOpacity = _react2.default.useRef(new _reactnative.Animated.Value(1)).current;
-  const { sizeStyles, extendedSizeStyles } = useFabSizeStyles(size);
-  const variantStyles = useFabVariantStyles(themeColor, variant, elevation);
-  const { iconColor } = useFabIconColor(themeColor, variant);
-  const isExtended = !!label;
-  const resolvedRadius = useFabRadiusValue(
-    radius,
-    isExtended ? extendedSizeStyles.borderRadius : sizeStyles.borderRadius
-  );
-  const handlePressIn = (event) => {
-    if (!isDisabled && !isLoading) {
-      runFabPressInAnimation(animatedScale, animatedOpacity);
-    }
-    _optionalChain([onPressIn, 'optionalCall', _ => _(event)]);
-  };
-  const handlePressOut = (event) => {
-    if (!isDisabled && !isLoading) {
-      runFabPressOutAnimation(animatedScale, animatedOpacity);
-    }
-    _optionalChain([onPressOut, 'optionalCall', _2 => _2(event)]);
-  };
-  const fabDimensionStyles = isExtended ? {
-    height: extendedSizeStyles.height,
-    borderRadius: resolvedRadius,
-    paddingHorizontal: extendedSizeStyles.paddingHorizontal
-  } : {
-    width: sizeStyles.width,
-    height: sizeStyles.height,
-    borderRadius: resolvedRadius
-  };
-  return /* @__PURE__ */ _react2.default.createElement(_reactnative.View, { style: [styles.container, _optionalChain([customAppearance, 'optionalAccess', _3 => _3.container])] }, /* @__PURE__ */ _react2.default.createElement(
-    _reactnative.Pressable,
-    {
-      onPress: isDisabled || isLoading ? void 0 : onPress,
-      onLongPress: isDisabled || isLoading ? void 0 : onLongPress,
-      onPressIn: handlePressIn,
-      onPressOut: handlePressOut,
-      disabled: isDisabled || isLoading
-    },
-    /* @__PURE__ */ _react2.default.createElement(
-      _reactnative.Animated.View,
-      {
-        style: [
-          styles.fab,
-          fabDimensionStyles,
-          variantStyles,
-          isDisabled && styles.disabled,
-          {
-            transform: [{ scale: animatedScale }],
-            opacity: animatedOpacity
-          },
-          _optionalChain([customAppearance, 'optionalAccess', _4 => _4.fab])
-        ]
-      },
-      isLoading ? /* @__PURE__ */ _react2.default.createElement(
-        _chunkYIEUN3G5cjs.ActivityIndicator,
-        {
-          variant: "circular",
-          themeColor: variant === "solid" ? void 0 : themeColor,
-          color: variant === "solid" ? iconColor : void 0,
-          size: isExtended ? extendedSizeStyles.iconSize : sizeStyles.iconSize
-        }
-      ) : /* @__PURE__ */ _react2.default.createElement(_reactnative.View, { style: styles.contentContainer }, icon, isExtended && /* @__PURE__ */ _react2.default.createElement(
-        _reactnative.Text,
-        {
-          style: [
-            styles.label,
-            {
-              fontSize: isExtended ? extendedSizeStyles.fontSize : sizeStyles.fontSize,
-              color: iconColor
-            }
-          ]
-        },
-        label
-      ))
-    )
-  ));
-};
-
-
-
-exports.Fab = Fab;