@xaui/native 0.0.32 → 0.0.33

package/dist/bottom-sheet/index.cjs

@@ -1,8 +1,9 @@
-"use strict";Object.defineProperty(exports, "__esModule", {value: true});
+"use strict";Object.defineProperty(exports, "__esModule", {value: true});require('../chunk-EUQDGTST.cjs');
 
-var _chunkXFPPR2VBcjs = require('../chunk-XFPPR2VB.cjs');
+
+var _chunkRVR42THGcjs = require('../chunk-RVR42THG.cjs');
 require('../chunk-HSPTLUFA.cjs');
 require('../chunk-OQ2BLOOG.cjs');
 
 
-exports.BottomSheet = _chunkXFPPR2VBcjs.BottomSheet;
+exports.BottomSheet = _chunkRVR42THGcjs.BottomSheet;

package/dist/bottom-sheet/index.js

@@ -1,6 +1,7 @@
+import "../chunk-DECMUMCI.js";
 import {
   BottomSheet
-} from "../chunk-HC2SSHNU.js";
+} from "../chunk-ED22WCCI.js";
 import "../chunk-DXXNBF5P.js";
 import "../chunk-LTKYHG5V.js";
 export {

package/dist/chunk-2ANGPYCP.cjs

@@ -0,0 +1,308 @@
+"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 _chunkOQ2BLOOGcjs = require('./chunk-OQ2BLOOG.cjs');
+
+// src/components/input-trigger/input-trigger.tsx
+var _react = require('react'); var _react2 = _interopRequireDefault(_react);
+var _reactnative = require('react-native');
+
+// src/components/input-trigger/input-trigger.hook.ts
+
+var _core = require('@xaui/core');
+var sizeMap = {
+  sm: {
+    minHeight: 40,
+    fontSize: 14,
+    paddingHorizontal: 12,
+    paddingVertical: 8,
+    slotGap: 8,
+    labelSize: 13,
+    helperSize: 12
+  },
+  md: {
+    minHeight: 46,
+    fontSize: 16,
+    paddingHorizontal: 14,
+    paddingVertical: 10,
+    slotGap: 10,
+    labelSize: 14,
+    helperSize: 13
+  },
+  lg: {
+    minHeight: 52,
+    fontSize: 17,
+    paddingHorizontal: 16,
+    paddingVertical: 12,
+    slotGap: 12,
+    labelSize: 15,
+    helperSize: 15
+  }
+};
+var useInputTriggerSizeStyles = (size) => _react.useMemo.call(void 0, () => sizeMap[size], [size]);
+var useInputTriggerRadiusStyles = (radius) => {
+  const theme = _chunkOQ2BLOOGcjs.useXUITheme.call(void 0, );
+  return _react.useMemo.call(void 0, () => {
+    if (radius === "full") {
+      return { borderRadius: theme.borderRadius.full };
+    }
+    return { borderRadius: theme.borderRadius[radius] };
+  }, [radius, theme.borderRadius]);
+};
+var useInputTriggerVariantStyles = ({
+  themeColor,
+  variant,
+  isInvalid,
+  isDisabled
+}) => {
+  const theme = _chunkOQ2BLOOGcjs.useXUITheme.call(void 0, );
+  const safeThemeColor = _core.getSafeThemeColor.call(void 0, themeColor);
+  const colorScheme = theme.colors[safeThemeColor];
+  return _react.useMemo.call(void 0, () => {
+    const neutralBorder = _core.withOpacity.call(void 0, theme.colors.foreground, 0.1);
+    const textColor = isDisabled ? _core.withOpacity.call(void 0, theme.colors.foreground, 0.55) : theme.colors.foreground;
+    const placeholderColor = _core.withOpacity.call(void 0, theme.colors.foreground, 0.45);
+    const labelColor = isInvalid ? theme.colors.danger.main : _core.withOpacity.call(void 0, theme.colors.foreground, 0.8);
+    const helperColor = isInvalid ? theme.colors.danger.main : _core.withOpacity.call(void 0, theme.colors.foreground, 0.72);
+    if (variant === "underlined") {
+      return {
+        container: {
+          backgroundColor: "transparent",
+          borderBottomWidth: isInvalid ? 2 : 1,
+          borderColor: isInvalid ? theme.colors.danger.main : _core.withPaletteNumber.call(void 0, colorScheme.main, 500)
+        },
+        unfocusedBorderColor: neutralBorder,
+        textColor,
+        placeholderColor,
+        labelColor,
+        helperColor
+      };
+    }
+    if (variant === "bordered") {
+      return {
+        container: {
+          backgroundColor: theme.colors.background,
+          borderColor: isInvalid ? theme.colors.danger.main : neutralBorder,
+          borderWidth: theme.borderWidth.md
+        },
+        unfocusedBorderColor: neutralBorder,
+        textColor,
+        placeholderColor,
+        labelColor,
+        helperColor
+      };
+    }
+    if (variant === "faded") {
+      return {
+        container: {
+          backgroundColor: _core.withOpacity.call(void 0, colorScheme.background, 0.68),
+          borderColor: isInvalid ? theme.colors.danger.main : "transparent",
+          borderWidth: isInvalid ? theme.borderWidth.md : 0
+        },
+        unfocusedBorderColor: "transparent",
+        textColor,
+        placeholderColor,
+        labelColor,
+        helperColor
+      };
+    }
+    return {
+      container: {
+        backgroundColor: colorScheme.background,
+        borderColor: isInvalid ? _core.withPaletteNumber.call(void 0, theme.colors.danger.main, 500) : "transparent",
+        borderWidth: isInvalid ? theme.borderWidth.md : 0
+      },
+      unfocusedBorderColor: "transparent",
+      textColor,
+      placeholderColor,
+      labelColor,
+      helperColor
+    };
+  }, [colorScheme, isDisabled, isInvalid, theme, variant]);
+};
+
+// src/components/input-trigger/input-trigger.style.ts
+
+var styles = _reactnative.StyleSheet.create({
+  container: {
+    width: "100%",
+    gap: 6
+  },
+  noFullWidth: {
+    alignSelf: "flex-start"
+  },
+  inputContainer: {
+    gap: 6
+  },
+  label: {
+    fontWeight: "500"
+  },
+  inputWrapper: {
+    flexDirection: "row",
+    alignItems: "center"
+  },
+  underlinedWrapper: {
+    borderBottomLeftRadius: 0,
+    borderBottomRightRadius: 0,
+    paddingHorizontal: 0
+  },
+  slot: {
+    justifyContent: "center",
+    alignItems: "center"
+  },
+  content: {
+    flex: 1,
+    padding: 0
+  },
+  helperText: {
+    fontWeight: "400"
+  },
+  disabled: {
+    opacity: 0.6
+  }
+});
+
+// src/components/input-trigger/input-trigger.tsx
+var InputTrigger = ({
+  value,
+  placeholder = "Select...",
+  label,
+  labelPlacement = "outside",
+  description,
+  errorMessage,
+  startContent,
+  endContent,
+  themeColor = "primary",
+  variant = "flat",
+  size = "md",
+  radius = "md",
+  isDisabled = false,
+  isInvalid = false,
+  fullWidth = true,
+  customAppearance,
+  onPress
+}) => {
+  const sizeStyles = useInputTriggerSizeStyles(size);
+  const radiusStyles = useInputTriggerRadiusStyles(radius);
+  const variantStyles = useInputTriggerVariantStyles({
+    themeColor,
+    variant,
+    isInvalid,
+    isDisabled
+  });
+  const hasValue = value !== void 0 && value !== null && value !== "";
+  const helperText = isInvalid && errorMessage ? errorMessage : description;
+  const renderLabel = label ? typeof label === "string" || typeof label === "number" ? /* @__PURE__ */ _react2.default.createElement(
+    _reactnative.Text,
+    {
+      style: [
+        styles.label,
+        {
+          color: variantStyles.labelColor,
+          fontSize: sizeStyles.labelSize
+        },
+        _optionalChain([customAppearance, 'optionalAccess', _ => _.label])
+      ]
+    },
+    label
+  ) : /* @__PURE__ */ _react2.default.createElement(_reactnative.View, null, label) : null;
+  return /* @__PURE__ */ _react2.default.createElement(
+    _reactnative.View,
+    {
+      style: [
+        styles.container,
+        !fullWidth && styles.noFullWidth,
+        isDisabled && styles.disabled,
+        _optionalChain([customAppearance, 'optionalAccess', _2 => _2.container])
+      ]
+    },
+    /* @__PURE__ */ _react2.default.createElement(_reactnative.View, { style: [styles.inputContainer, _optionalChain([customAppearance, 'optionalAccess', _3 => _3.inputContainer])] }, label && labelPlacement === "outside" && renderLabel, /* @__PURE__ */ _react2.default.createElement(
+      _reactnative.Pressable,
+      {
+        onPress: isDisabled ? void 0 : onPress,
+        disabled: isDisabled,
+        accessibilityRole: "button"
+      },
+      /* @__PURE__ */ _react2.default.createElement(
+        _reactnative.View,
+        {
+          style: [
+            styles.inputWrapper,
+            {
+              minHeight: sizeStyles.minHeight,
+              paddingVertical: sizeStyles.paddingVertical,
+              paddingHorizontal: variant === "underlined" ? 0 : sizeStyles.paddingHorizontal,
+              gap: sizeStyles.slotGap,
+              backgroundColor: variantStyles.container.backgroundColor,
+              borderWidth: variant === "underlined" ? 0 : variantStyles.container.borderWidth,
+              ...variant === "underlined" && {
+                borderBottomWidth: variantStyles.container.borderBottomWidth
+              },
+              borderRadius: variant === "underlined" ? 0 : radiusStyles.borderRadius,
+              borderColor: variant === "underlined" ? variantStyles.container.borderColor : variantStyles.container.borderColor
+            },
+            variant === "underlined" && styles.underlinedWrapper,
+            _optionalChain([customAppearance, 'optionalAccess', _4 => _4.inputWrapper])
+          ]
+        },
+        startContent && /* @__PURE__ */ _react2.default.createElement(_reactnative.View, { style: styles.slot }, startContent),
+        /* @__PURE__ */ _react2.default.createElement(
+          _reactnative.View,
+          {
+            style: {
+              flex: 1,
+              gap: labelPlacement === "inside" && label ? 2 : 0
+            }
+          },
+          label && labelPlacement === "inside" && renderLabel,
+          typeof value === "string" || typeof value === "number" ? /* @__PURE__ */ _react2.default.createElement(
+            _reactnative.Text,
+            {
+              numberOfLines: 1,
+              style: [
+                styles.content,
+                {
+                  color: hasValue ? variantStyles.textColor : variantStyles.placeholderColor,
+                  fontSize: sizeStyles.fontSize
+                },
+                _optionalChain([customAppearance, 'optionalAccess', _5 => _5.content])
+              ]
+            },
+            hasValue ? value : placeholder
+          ) : hasValue ? /* @__PURE__ */ _react2.default.createElement(_reactnative.View, { style: { flex: 1 } }, value) : /* @__PURE__ */ _react2.default.createElement(
+            _reactnative.Text,
+            {
+              style: [
+                styles.content,
+                {
+                  color: variantStyles.placeholderColor,
+                  fontSize: sizeStyles.fontSize
+                },
+                _optionalChain([customAppearance, 'optionalAccess', _6 => _6.content])
+              ]
+            },
+            placeholder
+          )
+        ),
+        endContent && /* @__PURE__ */ _react2.default.createElement(_reactnative.View, { style: styles.slot }, endContent)
+      )
+    )),
+    helperText ? typeof helperText === "string" || typeof helperText === "number" ? /* @__PURE__ */ _react2.default.createElement(
+      _reactnative.Text,
+      {
+        style: [
+          styles.helperText,
+          {
+            color: variantStyles.helperColor,
+            fontSize: sizeStyles.helperSize
+          },
+          _optionalChain([customAppearance, 'optionalAccess', _7 => _7.helperText])
+        ]
+      },
+      helperText
+    ) : /* @__PURE__ */ _react2.default.createElement(_reactnative.View, null, helperText) : null
+  );
+};
+
+
+
+exports.InputTrigger = InputTrigger;

package/dist/chunk-E4DOPNVW.js

@@ -0,0 +1,308 @@
+import {
+  useXUITheme
+} from "./chunk-LTKYHG5V.js";
+
+// src/components/input-trigger/input-trigger.tsx
+import React from "react";
+import { Pressable, Text, View } from "react-native";
+
+// src/components/input-trigger/input-trigger.hook.ts
+import { useMemo } from "react";
+import { getSafeThemeColor, withOpacity, withPaletteNumber } from "@xaui/core";
+var sizeMap = {
+  sm: {
+    minHeight: 40,
+    fontSize: 14,
+    paddingHorizontal: 12,
+    paddingVertical: 8,
+    slotGap: 8,
+    labelSize: 13,
+    helperSize: 12
+  },
+  md: {
+    minHeight: 46,
+    fontSize: 16,
+    paddingHorizontal: 14,
+    paddingVertical: 10,
+    slotGap: 10,
+    labelSize: 14,
+    helperSize: 13
+  },
+  lg: {
+    minHeight: 52,
+    fontSize: 17,
+    paddingHorizontal: 16,
+    paddingVertical: 12,
+    slotGap: 12,
+    labelSize: 15,
+    helperSize: 15
+  }
+};
+var useInputTriggerSizeStyles = (size) => useMemo(() => sizeMap[size], [size]);
+var useInputTriggerRadiusStyles = (radius) => {
+  const theme = useXUITheme();
+  return useMemo(() => {
+    if (radius === "full") {
+      return { borderRadius: theme.borderRadius.full };
+    }
+    return { borderRadius: theme.borderRadius[radius] };
+  }, [radius, theme.borderRadius]);
+};
+var useInputTriggerVariantStyles = ({
+  themeColor,
+  variant,
+  isInvalid,
+  isDisabled
+}) => {
+  const theme = useXUITheme();
+  const safeThemeColor = getSafeThemeColor(themeColor);
+  const colorScheme = theme.colors[safeThemeColor];
+  return useMemo(() => {
+    const neutralBorder = withOpacity(theme.colors.foreground, 0.1);
+    const textColor = isDisabled ? withOpacity(theme.colors.foreground, 0.55) : theme.colors.foreground;
+    const placeholderColor = withOpacity(theme.colors.foreground, 0.45);
+    const labelColor = isInvalid ? theme.colors.danger.main : withOpacity(theme.colors.foreground, 0.8);
+    const helperColor = isInvalid ? theme.colors.danger.main : withOpacity(theme.colors.foreground, 0.72);
+    if (variant === "underlined") {
+      return {
+        container: {
+          backgroundColor: "transparent",
+          borderBottomWidth: isInvalid ? 2 : 1,
+          borderColor: isInvalid ? theme.colors.danger.main : withPaletteNumber(colorScheme.main, 500)
+        },
+        unfocusedBorderColor: neutralBorder,
+        textColor,
+        placeholderColor,
+        labelColor,
+        helperColor
+      };
+    }
+    if (variant === "bordered") {
+      return {
+        container: {
+          backgroundColor: theme.colors.background,
+          borderColor: isInvalid ? theme.colors.danger.main : neutralBorder,
+          borderWidth: theme.borderWidth.md
+        },
+        unfocusedBorderColor: neutralBorder,
+        textColor,
+        placeholderColor,
+        labelColor,
+        helperColor
+      };
+    }
+    if (variant === "faded") {
+      return {
+        container: {
+          backgroundColor: withOpacity(colorScheme.background, 0.68),
+          borderColor: isInvalid ? theme.colors.danger.main : "transparent",
+          borderWidth: isInvalid ? theme.borderWidth.md : 0
+        },
+        unfocusedBorderColor: "transparent",
+        textColor,
+        placeholderColor,
+        labelColor,
+        helperColor
+      };
+    }
+    return {
+      container: {
+        backgroundColor: colorScheme.background,
+        borderColor: isInvalid ? withPaletteNumber(theme.colors.danger.main, 500) : "transparent",
+        borderWidth: isInvalid ? theme.borderWidth.md : 0
+      },
+      unfocusedBorderColor: "transparent",
+      textColor,
+      placeholderColor,
+      labelColor,
+      helperColor
+    };
+  }, [colorScheme, isDisabled, isInvalid, theme, variant]);
+};
+
+// src/components/input-trigger/input-trigger.style.ts
+import { StyleSheet } from "react-native";
+var styles = StyleSheet.create({
+  container: {
+    width: "100%",
+    gap: 6
+  },
+  noFullWidth: {
+    alignSelf: "flex-start"
+  },
+  inputContainer: {
+    gap: 6
+  },
+  label: {
+    fontWeight: "500"
+  },
+  inputWrapper: {
+    flexDirection: "row",
+    alignItems: "center"
+  },
+  underlinedWrapper: {
+    borderBottomLeftRadius: 0,
+    borderBottomRightRadius: 0,
+    paddingHorizontal: 0
+  },
+  slot: {
+    justifyContent: "center",
+    alignItems: "center"
+  },
+  content: {
+    flex: 1,
+    padding: 0
+  },
+  helperText: {
+    fontWeight: "400"
+  },
+  disabled: {
+    opacity: 0.6
+  }
+});
+
+// src/components/input-trigger/input-trigger.tsx
+var InputTrigger = ({
+  value,
+  placeholder = "Select...",
+  label,
+  labelPlacement = "outside",
+  description,
+  errorMessage,
+  startContent,
+  endContent,
+  themeColor = "primary",
+  variant = "flat",
+  size = "md",
+  radius = "md",
+  isDisabled = false,
+  isInvalid = false,
+  fullWidth = true,
+  customAppearance,
+  onPress
+}) => {
+  const sizeStyles = useInputTriggerSizeStyles(size);
+  const radiusStyles = useInputTriggerRadiusStyles(radius);
+  const variantStyles = useInputTriggerVariantStyles({
+    themeColor,
+    variant,
+    isInvalid,
+    isDisabled
+  });
+  const hasValue = value !== void 0 && value !== null && value !== "";
+  const helperText = isInvalid && errorMessage ? errorMessage : description;
+  const renderLabel = label ? typeof label === "string" || typeof label === "number" ? /* @__PURE__ */ React.createElement(
+    Text,
+    {
+      style: [
+        styles.label,
+        {
+          color: variantStyles.labelColor,
+          fontSize: sizeStyles.labelSize
+        },
+        customAppearance?.label
+      ]
+    },
+    label
+  ) : /* @__PURE__ */ React.createElement(View, null, label) : null;
+  return /* @__PURE__ */ React.createElement(
+    View,
+    {
+      style: [
+        styles.container,
+        !fullWidth && styles.noFullWidth,
+        isDisabled && styles.disabled,
+        customAppearance?.container
+      ]
+    },
+    /* @__PURE__ */ React.createElement(View, { style: [styles.inputContainer, customAppearance?.inputContainer] }, label && labelPlacement === "outside" && renderLabel, /* @__PURE__ */ React.createElement(
+      Pressable,
+      {
+        onPress: isDisabled ? void 0 : onPress,
+        disabled: isDisabled,
+        accessibilityRole: "button"
+      },
+      /* @__PURE__ */ React.createElement(
+        View,
+        {
+          style: [
+            styles.inputWrapper,
+            {
+              minHeight: sizeStyles.minHeight,
+              paddingVertical: sizeStyles.paddingVertical,
+              paddingHorizontal: variant === "underlined" ? 0 : sizeStyles.paddingHorizontal,
+              gap: sizeStyles.slotGap,
+              backgroundColor: variantStyles.container.backgroundColor,
+              borderWidth: variant === "underlined" ? 0 : variantStyles.container.borderWidth,
+              ...variant === "underlined" && {
+                borderBottomWidth: variantStyles.container.borderBottomWidth
+              },
+              borderRadius: variant === "underlined" ? 0 : radiusStyles.borderRadius,
+              borderColor: variant === "underlined" ? variantStyles.container.borderColor : variantStyles.container.borderColor
+            },
+            variant === "underlined" && styles.underlinedWrapper,
+            customAppearance?.inputWrapper
+          ]
+        },
+        startContent && /* @__PURE__ */ React.createElement(View, { style: styles.slot }, startContent),
+        /* @__PURE__ */ React.createElement(
+          View,
+          {
+            style: {
+              flex: 1,
+              gap: labelPlacement === "inside" && label ? 2 : 0
+            }
+          },
+          label && labelPlacement === "inside" && renderLabel,
+          typeof value === "string" || typeof value === "number" ? /* @__PURE__ */ React.createElement(
+            Text,
+            {
+              numberOfLines: 1,
+              style: [
+                styles.content,
+                {
+                  color: hasValue ? variantStyles.textColor : variantStyles.placeholderColor,
+                  fontSize: sizeStyles.fontSize
+                },
+                customAppearance?.content
+              ]
+            },
+            hasValue ? value : placeholder
+          ) : hasValue ? /* @__PURE__ */ React.createElement(View, { style: { flex: 1 } }, value) : /* @__PURE__ */ React.createElement(
+            Text,
+            {
+              style: [
+                styles.content,
+                {
+                  color: variantStyles.placeholderColor,
+                  fontSize: sizeStyles.fontSize
+                },
+                customAppearance?.content
+              ]
+            },
+            placeholder
+          )
+        ),
+        endContent && /* @__PURE__ */ React.createElement(View, { style: styles.slot }, endContent)
+      )
+    )),
+    helperText ? typeof helperText === "string" || typeof helperText === "number" ? /* @__PURE__ */ React.createElement(
+      Text,
+      {
+        style: [
+          styles.helperText,
+          {
+            color: variantStyles.helperColor,
+            fontSize: sizeStyles.helperSize
+          },
+          customAppearance?.helperText
+        ]
+      },
+      helperText
+    ) : /* @__PURE__ */ React.createElement(View, null, helperText) : null
+  );
+};
+
+export {
+  InputTrigger
+};

package/dist/chunk-EUQDGTST.cjs

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