@retray-dev/ui-kit 9.1.0 → 9.3.0

package/dist/index.js

@@ -10,13 +10,13 @@ var FontAwesome5 = require('@expo/vector-icons/FontAwesome5');
 var MaterialIcons = require('@expo/vector-icons/MaterialIcons');
 var Ionicons = require('@expo/vector-icons/Ionicons');
 var pressto = require('pressto');
-var Animated13 = require('react-native-reanimated');
+var Animated12 = require('react-native-reanimated');
 var expoFont = require('expo-font');
+var bottomSheet = require('@gorhom/bottom-sheet');
+var reactNativeEase = require('react-native-ease');
 var vectorIcons = require('@expo/vector-icons');
 var expoLinearGradient = require('expo-linear-gradient');
-var reactNativeEase = require('react-native-ease');
 var RNSlider = require('@react-native-community/slider');
-var bottomSheet = require('@gorhom/bottom-sheet');
 var reactNativeSafeAreaContext = require('react-native-safe-area-context');
 var picker = require('@react-native-picker/picker');
 var sonnerNative = require('sonner-native');
@@ -31,7 +31,7 @@ var Feather__default = /*#__PURE__*/_interopDefault(Feather);
 var FontAwesome5__default = /*#__PURE__*/_interopDefault(FontAwesome5);
 var MaterialIcons__default = /*#__PURE__*/_interopDefault(MaterialIcons);
 var Ionicons__default = /*#__PURE__*/_interopDefault(Ionicons);
-var Animated13__default = /*#__PURE__*/_interopDefault(Animated13);
+var Animated12__default = /*#__PURE__*/_interopDefault(Animated12);
 var RNSlider__default = /*#__PURE__*/_interopDefault(RNSlider);
 
 var __require = /* @__PURE__ */ ((x) => typeof require !== "undefined" ? require : typeof Proxy !== "undefined" ? new Proxy(x, {
@@ -611,11 +611,11 @@ var TIMINGS = {
 };
 var EASINGS = {
   /** Material-style ease-out — natural deceleration for state changes. */
-  standard: Animated13.Easing.bezier(0.2, 0, 0, 1),
+  standard: Animated12.Easing.bezier(0.2, 0, 0, 1),
   /** Strong ease-out for expanding surfaces (Accordion open). */
-  expand: Animated13.Easing.bezier(0.23, 1, 0.32, 1),
+  expand: Animated12.Easing.bezier(0.23, 1, 0.32, 1),
   /** Quick ease-in for collapsing. */
-  collapse: Animated13.Easing.in(Animated13.Easing.ease)
+  collapse: Animated12.Easing.in(Animated12.Easing.ease)
 };
 var COLOR_TRANSITION = {
   type: "timing",
@@ -1000,24 +1000,11 @@ function TextBase({ variant = "body-md", color, style, children, ...props }) {
   );
 }
 var Text3 = React25__default.default.memo(TextBase);
-function useColorTransition(active, options = {}) {
-  const { duration = TIMINGS.state.duration } = options;
-  const progress = Animated13.useSharedValue(active ? 1 : 0);
-  React25.useEffect(() => {
-    progress.value = Animated13.withTiming(active ? 1 : 0, { duration, easing: EASINGS.standard });
-  }, [active, duration, progress]);
-  return progress;
-}
-
-// src/components/Input/Input.tsx
 var webInputResetStyle = reactNative.Platform.OS === "web" ? { outlineStyle: "none", outlineWidth: 0, outlineColor: "transparent", boxShadow: "none" } : {};
-function Input({ label, error, hint, disabled, prefix, suffix, prefixStyle, suffixStyle, prefixIcon, suffixIcon, prefixIconColor, suffixIconColor, type = "text", containerStyle, inputWrapperStyle, style, onFocus, onBlur, secureTextEntry, editable, accessibilityLabel, ...props }) {
+function Input({ label, error, hint, disabled, prefix, suffix, prefixStyle, suffixStyle, prefixIcon, suffixIcon, prefixIconColor, suffixIconColor, type = "text", containerStyle, inputWrapperStyle, sheetMode = false, style, onFocus, onBlur, secureTextEntry, editable, accessibilityLabel, ...props }) {
   const { colors } = useTheme();
   const [focused, setFocused] = React25.useState(false);
   const [showPassword, setShowPassword] = React25.useState(false);
-  const focusProgress = useColorTransition(focused, {
-    duration: focused ? TIMINGS.focusIn.duration : TIMINGS.focusOut.duration
-  });
   const isDisabled = disabled || editable === false;
   const isPassword = type === "password";
   const effectiveSecure = isPassword ? !showPassword : secureTextEntry;
@@ -1033,22 +1020,45 @@ function Input({ label, error, hint, disabled, prefix, suffix, prefixStyle, suff
     },
     /* @__PURE__ */ React25__default.default.createElement(vectorIcons.AntDesign, { name: showPassword ? "eye" : "eye-invisible", size: 20, color: colors.foregroundMuted })
   ) : suffixIcon ? renderIcon(suffixIcon, 20, suffixIconColor ?? colors.foregroundMuted) : suffix;
-  const borderAnimStyle = Animated13.useAnimatedStyle(() => ({
-    borderColor: error ? colors.destructive : Animated13.interpolateColor(focusProgress.value, [0, 1], [colors.border, colors.primary]),
-    borderWidth: error ? 2 : Animated13.interpolate(focusProgress.value, [0, 1], [1, 2])
-  }));
+  const borderColor = error ? colors.destructive : focused ? colors.primary : colors.border;
   return /* @__PURE__ */ React25__default.default.createElement(reactNative.View, { style: [styles4.container, isDisabled && styles4.containerDisabled, containerStyle] }, label ? /* @__PURE__ */ React25__default.default.createElement(reactNative.Text, { style: [styles4.label, { color: colors.foreground }], allowFontScaling: true }, label) : null, /* @__PURE__ */ React25__default.default.createElement(
-    Animated13__default.default.View,
+    reactNativeEase.EaseView,
     {
       style: [
         styles4.inputWrapper,
         { backgroundColor: isDisabled ? colors.surface : colors.background },
+        error && styles4.inputWrapperError,
         inputWrapperStyle
-      ]
+      ],
+      animate: { borderColor },
+      transition: COLOR_TRANSITION
     },
-    /* @__PURE__ */ React25__default.default.createElement(Animated13__default.default.View, { style: [styles4.borderOverlay, borderAnimStyle], pointerEvents: "none" }),
     effectivePrefix ? typeof effectivePrefix === "string" ? /* @__PURE__ */ React25__default.default.createElement(reactNative.Text, { style: [styles4.prefixText, { color: colors.foregroundMuted }, prefixStyle], allowFontScaling: true }, effectivePrefix) : /* @__PURE__ */ React25__default.default.createElement(reactNative.View, { style: styles4.prefixContainer }, effectivePrefix) : null,
-    /* @__PURE__ */ React25__default.default.createElement(
+    sheetMode ? /* @__PURE__ */ React25__default.default.createElement(
+      bottomSheet.BottomSheetTextInput,
+      {
+        style: [
+          styles4.input,
+          { color: colors.foreground },
+          webInputResetStyle,
+          style
+        ],
+        onFocus: (e) => {
+          setFocused(true);
+          onFocus?.(e);
+        },
+        onBlur: (e) => {
+          setFocused(false);
+          onBlur?.(e);
+        },
+        placeholderTextColor: colors.foregroundMuted,
+        allowFontScaling: true,
+        secureTextEntry: effectiveSecure,
+        editable: isDisabled ? false : editable,
+        accessibilityLabel: accessibilityLabel ?? label,
+        ...props
+      }
+    ) : /* @__PURE__ */ React25__default.default.createElement(
       reactNative.TextInput,
       {
         style: [
@@ -1098,16 +1108,14 @@ var styles4 = reactNative.StyleSheet.create({
   inputWrapper: {
     flexDirection: "row",
     alignItems: "center",
-    // Border lives on borderOverlay (absolute) so its 1px→2px focus change
-    // never resizes this box. Wrapper itself carries no border.
     borderRadius: 8,
+    borderWidth: 1,
     paddingHorizontal: s(14),
     paddingVertical: vs(11),
     minHeight: 48
   },
-  borderOverlay: {
-    ...reactNative.StyleSheet.absoluteFillObject,
-    borderRadius: 8
+  inputWrapperError: {
+    borderWidth: 2
   },
   input: {
     fontFamily: "Sohne-Regular",
@@ -1397,17 +1405,17 @@ function Skeleton({
   style
 }) {
   const { colors, colorScheme } = useTheme();
-  const shimmer = Animated13.useSharedValue(0);
+  const shimmer = Animated12.useSharedValue(0);
   const [containerWidth, setContainerWidth] = React25.useState(300);
   const shimmerHighlight = colorScheme === "dark" ? "rgba(255,255,255,0.08)" : "rgba(255,255,255,0.7)";
   React25.useEffect(() => {
-    shimmer.value = Animated13.withRepeat(
-      Animated13.withTiming(1, { duration: TIMINGS.shimmer.duration, easing: Animated13.Easing.linear }),
+    shimmer.value = Animated12.withRepeat(
+      Animated12.withTiming(1, { duration: TIMINGS.shimmer.duration, easing: Animated12.Easing.linear }),
       -1,
       false
     );
   }, [shimmer]);
-  const shimmerStyle = Animated13.useAnimatedStyle(() => ({
+  const shimmerStyle = Animated12.useAnimatedStyle(() => ({
     transform: [{ translateX: -containerWidth + shimmer.value * (containerWidth * 2) }]
   }));
   const resolvedWidth = preset === "circle" ? s(diameter) : preset === "text" ? "60%" : width;
@@ -1426,7 +1434,7 @@ function Skeleton({
       accessibilityLabel: "Loading",
       accessibilityState: { busy: true }
     },
-    /* @__PURE__ */ React25__default.default.createElement(Animated13__default.default.View, { style: [reactNative.StyleSheet.absoluteFill, shimmerStyle] }, /* @__PURE__ */ React25__default.default.createElement(
+    /* @__PURE__ */ React25__default.default.createElement(Animated12__default.default.View, { style: [reactNative.StyleSheet.absoluteFill, shimmerStyle] }, /* @__PURE__ */ React25__default.default.createElement(
       expoLinearGradient.LinearGradient,
       {
         colors: ["transparent", shimmerHighlight, "transparent"],
@@ -1604,7 +1612,7 @@ var styles10 = reactNative.StyleSheet.create({
     right: 0
   }
 });
-function AlertBanner({ title, description, variant = "default", icon, iconName, iconColor, style }) {
+function AlertBanner({ title, description, variant = "default", icon, iconName, iconColor, onDismiss, style }) {
   const { colors, colorScheme } = useTheme();
   const isDark = colorScheme === "dark";
   const accentColor = variant === "destructive" ? colors.destructive : variant === "success" ? colors.success : variant === "warning" ? colors.warning : colors.foreground;
@@ -1630,7 +1638,18 @@ function AlertBanner({ title, description, variant = "default", icon, iconName,
       accessibilityLabel: a11yLabel
     },
     /* @__PURE__ */ React25__default.default.createElement(reactNative.View, { style: styles11.iconSlot }, effectiveIcon),
-    /* @__PURE__ */ React25__default.default.createElement(reactNative.View, { style: styles11.content }, /* @__PURE__ */ React25__default.default.createElement(reactNative.Text, { style: [styles11.title, { color: colors.foreground }], allowFontScaling: true }, title), description ? /* @__PURE__ */ React25__default.default.createElement(reactNative.Text, { style: [styles11.description, { color: colors.foreground, opacity: 0.85 }], allowFontScaling: true }, description) : null)
+    /* @__PURE__ */ React25__default.default.createElement(reactNative.View, { style: styles11.content }, /* @__PURE__ */ React25__default.default.createElement(reactNative.Text, { style: [styles11.title, { color: colors.foreground }], allowFontScaling: true }, title), description ? /* @__PURE__ */ React25__default.default.createElement(reactNative.Text, { style: [styles11.description, { color: colors.foreground, opacity: 0.85 }], allowFontScaling: true }, description) : null),
+    onDismiss ? /* @__PURE__ */ React25__default.default.createElement(
+      reactNative.TouchableOpacity,
+      {
+        onPress: onDismiss,
+        style: styles11.dismissButton,
+        activeOpacity: 0.6,
+        accessibilityRole: "button",
+        accessibilityLabel: "Dismiss"
+      },
+      /* @__PURE__ */ React25__default.default.createElement(vectorIcons.Feather, { name: "x", size: ms(16), color: colors.foregroundMuted })
+    ) : null
   );
 }
 var styles11 = reactNative.StyleSheet.create({
@@ -1656,18 +1675,23 @@ var styles11 = reactNative.StyleSheet.create({
   description: {
     fontFamily: "Sohne-Regular",
     fontSize: ms(12)
+  },
+  dismissButton: {
+    padding: s(4),
+    marginTop: vs(-2),
+    marginRight: -s(4)
   }
 });
 function Progress({ value = 0, max = 100, variant = "default", style, accessibilityLabel }) {
   const { colors } = useTheme();
   const percent = Math.min(Math.max(value / max * 100, 0), 100);
   const [trackWidth, setTrackWidth] = React25.useState(0);
-  const animatedWidth = Animated13.useSharedValue(0);
+  const animatedWidth = Animated12.useSharedValue(0);
   React25.useEffect(() => {
     if (trackWidth === 0) return;
-    animatedWidth.value = Animated13.withSpring(percent / 100 * trackWidth, SPRINGS.glide);
+    animatedWidth.value = Animated12.withSpring(percent / 100 * trackWidth, SPRINGS.glide);
   }, [percent, trackWidth, animatedWidth]);
-  const indicatorAnimatedStyle = Animated13.useAnimatedStyle(() => ({
+  const indicatorAnimatedStyle = Animated12.useAnimatedStyle(() => ({
     width: animatedWidth.value
   }));
   const indicatorColor = variant === "success" ? colors.success : variant === "warning" ? colors.warning : variant === "destructive" ? colors.destructive : colors.primary;
@@ -1681,7 +1705,7 @@ function Progress({ value = 0, max = 100, variant = "default", style, accessibil
       accessibilityValue: { min: 0, max: 100, now: Math.round(percent) }
     },
     /* @__PURE__ */ React25__default.default.createElement(
-      Animated13__default.default.View,
+      Animated12__default.default.View,
       {
         style: [styles12.indicator, { backgroundColor: indicatorColor }, indicatorAnimatedStyle]
       }
@@ -1789,6 +1813,16 @@ var styles13 = reactNative.StyleSheet.create({
     paddingHorizontal: s(32)
   }
 });
+function useColorTransition(active, options = {}) {
+  const { duration = TIMINGS.state.duration } = options;
+  const progress = Animated12.useSharedValue(active ? 1 : 0);
+  React25.useEffect(() => {
+    progress.value = Animated12.withTiming(active ? 1 : 0, { duration, easing: EASINGS.standard });
+  }, [active, duration, progress]);
+  return progress;
+}
+
+// src/components/Textarea/Textarea.tsx
 var webInputResetStyle2 = reactNative.Platform.OS === "web" ? { outlineStyle: "none", outlineWidth: 0, outlineColor: "transparent", boxShadow: "none" } : {};
 function Textarea({
   label,
@@ -1811,19 +1845,19 @@ function Textarea({
     duration: focused ? TIMINGS.focusIn.duration : TIMINGS.focusOut.duration
   });
   const resolvedPrefixIcon = prefixIcon ? renderIcon(prefixIcon, ms(16), prefixIconColor ?? colors.foregroundMuted) : prefixIconNode;
-  const borderAnimStyle = Animated13.useAnimatedStyle(() => ({
-    borderColor: error ? colors.destructive : Animated13.interpolateColor(focusProgress.value, [0, 1], [colors.border, colors.primary]),
-    borderWidth: error ? 2 : Animated13.interpolate(focusProgress.value, [0, 1], [1, 2])
+  const borderAnimStyle = Animated12.useAnimatedStyle(() => ({
+    borderColor: error ? colors.destructive : Animated12.interpolateColor(focusProgress.value, [0, 1], [colors.border, colors.primary]),
+    borderWidth: error ? 2 : Animated12.interpolate(focusProgress.value, [0, 1], [1, 2])
   }));
   return /* @__PURE__ */ React25__default.default.createElement(reactNative.View, { style: [styles14.container, containerStyle] }, label ? /* @__PURE__ */ React25__default.default.createElement(reactNative.Text, { style: [styles14.label, { color: colors.foreground }], allowFontScaling: true }, label) : null, /* @__PURE__ */ React25__default.default.createElement(
-    Animated13__default.default.View,
+    Animated12__default.default.View,
     {
       style: [
         styles14.inputWrapper,
         { backgroundColor: colors.background }
       ]
     },
-    /* @__PURE__ */ React25__default.default.createElement(Animated13__default.default.View, { style: [styles14.borderOverlay, borderAnimStyle], pointerEvents: "none" }),
+    /* @__PURE__ */ React25__default.default.createElement(Animated12__default.default.View, { style: [styles14.borderOverlay, borderAnimStyle], pointerEvents: "none" }),
     resolvedPrefixIcon ? /* @__PURE__ */ React25__default.default.createElement(reactNative.View, { style: styles14.prefixIcon }, resolvedPrefixIcon) : null,
     /* @__PURE__ */ React25__default.default.createElement(
       reactNative.TextInput,
@@ -2203,18 +2237,18 @@ function usePressScale({
   pressOutSpring = SPRINGS.pressOut,
   disabled = false
 } = {}) {
-  const scale2 = Animated13.useSharedValue(1);
+  const scale2 = Animated12.useSharedValue(1);
   const { hovered, hoverHandlers } = useHover();
   const onPressIn = React25.useCallback(() => {
     if (disabled) return;
-    scale2.value = Animated13.withSpring(pressScale, pressInSpring);
+    scale2.value = Animated12.withSpring(pressScale, pressInSpring);
   }, [disabled, pressScale, pressInSpring, scale2]);
   const onPressOut = React25.useCallback(() => {
     if (disabled) return;
-    scale2.value = Animated13.withSpring(1, pressOutSpring);
+    scale2.value = Animated12.withSpring(1, pressOutSpring);
   }, [disabled, pressOutSpring, scale2]);
   const hoverActive = reactNative.Platform.OS === "web" && hovered && hoverScale !== 1 && !disabled;
-  const animatedStyle = Animated13.useAnimatedStyle(() => ({
+  const animatedStyle = Animated12.useAnimatedStyle(() => ({
     transform: [
       { scale: scale2.value * (hoverActive ? hoverScale : 1) }
     ]
@@ -2261,7 +2295,7 @@ function RadioItem({
         accessibilityLabel: option.label,
         accessibilityState: { checked: selected, disabled: !!option.disabled }
       },
-      /* @__PURE__ */ React25__default.default.createElement(Animated13__default.default.View, { style: scaleStyle }, /* @__PURE__ */ React25__default.default.createElement(
+      /* @__PURE__ */ React25__default.default.createElement(Animated12__default.default.View, { style: scaleStyle }, /* @__PURE__ */ React25__default.default.createElement(
         reactNativeEase.EaseView,
         {
           style: styles18.radio,
@@ -2396,15 +2430,15 @@ function Tabs({ tabs, variant = "pill", value, onValueChange, children, style })
   const { colors } = useTheme();
   const active = value ?? internal;
   const tabLayouts = React25.useRef({});
-  const pillX = Animated13.useSharedValue(0);
-  const pillWidth = Animated13.useSharedValue(0);
+  const pillX = Animated12.useSharedValue(0);
+  const pillWidth = Animated12.useSharedValue(0);
   const initialised = React25.useRef(false);
   const animatePill = React25.useCallback((tabValue, animate) => {
     const layout = tabLayouts.current[tabValue];
     if (!layout) return;
     if (animate) {
-      pillX.value = Animated13.withSpring(layout.x, SPRINGS.glide);
-      pillWidth.value = Animated13.withSpring(layout.width, SPRINGS.glide);
+      pillX.value = Animated12.withSpring(layout.x, SPRINGS.glide);
+      pillWidth.value = Animated12.withSpring(layout.width, SPRINGS.glide);
     } else {
       pillX.value = layout.x;
       pillWidth.value = layout.width;
@@ -2418,7 +2452,7 @@ function Tabs({ tabs, variant = "pill", value, onValueChange, children, style })
     if (!value) setInternal(v);
     onValueChange?.(v);
   };
-  const pillAnimatedStyle = Animated13.useAnimatedStyle(() => ({
+  const pillAnimatedStyle = Animated12.useAnimatedStyle(() => ({
     transform: [{ translateX: pillX.value }],
     width: pillWidth.value
   }));
@@ -2431,7 +2465,7 @@ function Tabs({ tabs, variant = "pill", value, onValueChange, children, style })
       accessibilityRole: "tablist"
     },
     variant === "pill" && /* @__PURE__ */ React25__default.default.createElement(
-      Animated13__default.default.View,
+      Animated12__default.default.View,
       {
         style: [
           styles19.pill,
@@ -2533,28 +2567,28 @@ function AccordionItemComponent({
 }) {
   const { colors } = useTheme();
   const resolvedIcon = item.iconName ? renderIcon(item.iconName, ms(16), item.iconColor ?? colors.foregroundMuted) : item.icon;
-  const isExpanded = Animated13.useSharedValue(isOpen);
-  const height = Animated13.useSharedValue(0);
+  const isExpanded = Animated12.useSharedValue(isOpen);
+  const height = Animated12.useSharedValue(0);
   React25__default.default.useEffect(() => {
     isExpanded.value = isOpen;
   }, [isOpen, isExpanded]);
-  const derivedHeight = Animated13.useDerivedValue(
-    () => Animated13.withTiming(height.value * Number(isExpanded.value), {
+  const derivedHeight = Animated12.useDerivedValue(
+    () => Animated12.withTiming(height.value * Number(isExpanded.value), {
       duration: isExpanded.value ? TIMINGS.expand.duration : TIMINGS.collapse.duration,
       easing: isExpanded.value ? EASINGS.expand : EASINGS.collapse
     })
   );
-  const derivedRotation = Animated13.useDerivedValue(
-    () => Animated13.withTiming(isExpanded.value ? 1 : 0, {
+  const derivedRotation = Animated12.useDerivedValue(
+    () => Animated12.withTiming(isExpanded.value ? 1 : 0, {
       duration: isExpanded.value ? TIMINGS.expand.duration : TIMINGS.collapse.duration,
       easing: isExpanded.value ? EASINGS.expand : EASINGS.collapse
     })
   );
-  const bodyStyle = Animated13.useAnimatedStyle(() => ({
+  const bodyStyle = Animated12.useAnimatedStyle(() => ({
     height: derivedHeight.value,
     overflow: "hidden"
   }));
-  const rotationStyle = Animated13.useAnimatedStyle(() => ({
+  const rotationStyle = Animated12.useAnimatedStyle(() => ({
     transform: [{ rotate: `${derivedRotation.value * 180}deg` }]
   }));
   return /* @__PURE__ */ React25__default.default.createElement(reactNative.View, { style: [styles20.item, { backgroundColor: colors.card, borderColor: colors.border }] }, /* @__PURE__ */ React25__default.default.createElement(
@@ -2570,8 +2604,8 @@ function AccordionItemComponent({
       accessibilityLabel: item.trigger
     },
     /* @__PURE__ */ React25__default.default.createElement(reactNative.View, { style: styles20.triggerContent }, resolvedIcon ? /* @__PURE__ */ React25__default.default.createElement(reactNative.View, { style: styles20.icon }, resolvedIcon) : null, /* @__PURE__ */ React25__default.default.createElement(reactNative.Text, { style: [styles20.triggerText, { color: colors.foreground }], allowFontScaling: true }, item.trigger)),
-    /* @__PURE__ */ React25__default.default.createElement(Animated13__default.default.View, { style: [styles20.chevron, rotationStyle] }, /* @__PURE__ */ React25__default.default.createElement(vectorIcons.Entypo, { name: "chevron-down", size: 18, color: colors.foregroundMuted }))
-  ), /* @__PURE__ */ React25__default.default.createElement(Animated13__default.default.View, { style: bodyStyle }, /* @__PURE__ */ React25__default.default.createElement(
+    /* @__PURE__ */ React25__default.default.createElement(Animated12__default.default.View, { style: [styles20.chevron, rotationStyle] }, /* @__PURE__ */ React25__default.default.createElement(vectorIcons.Entypo, { name: "chevron-down", size: 18, color: colors.foregroundMuted }))
+  ), /* @__PURE__ */ React25__default.default.createElement(Animated12__default.default.View, { style: bodyStyle }, /* @__PURE__ */ React25__default.default.createElement(
     reactNative.View,
     {
       style: styles20.content,
@@ -3002,7 +3036,7 @@ function Select({
     }
     setPickerVisible(false);
   };
-  return /* @__PURE__ */ React25__default.default.createElement(reactNative.View, { style: [styles23.container, style] }, label ? /* @__PURE__ */ React25__default.default.createElement(reactNative.Text, { style: [styles23.label, { color: colors.foreground }], allowFontScaling: true }, label) : null, !isWeb2 ? /* @__PURE__ */ React25__default.default.createElement(Animated13__default.default.View, { style: [animatedStyle, { opacity: disabled ? 0.45 : 1 }] }, /* @__PURE__ */ React25__default.default.createElement(
+  return /* @__PURE__ */ React25__default.default.createElement(reactNative.View, { style: [styles23.container, style] }, label ? /* @__PURE__ */ React25__default.default.createElement(reactNative.Text, { style: [styles23.label, { color: colors.foreground }], allowFontScaling: true }, label) : null, !isWeb2 ? /* @__PURE__ */ React25__default.default.createElement(Animated12__default.default.View, { style: [animatedStyle, { opacity: disabled ? 0.45 : 1 }] }, /* @__PURE__ */ React25__default.default.createElement(
     reactNative.TouchableOpacity,
     {
       style: [
@@ -3249,7 +3283,8 @@ function CurrencyInput({
   placeholder,
   editable,
   containerStyle,
-  style
+  style,
+  sheetMode
 }) {
   const handleChange = (text) => {
     const withoutPrefix = prefix && text.startsWith(prefix) ? text.slice(prefix.length) : text;
@@ -3282,7 +3317,8 @@ function CurrencyInput({
       prefixStyle,
       containerStyle,
       inputWrapperStyle: isLarge ? { paddingVertical: vs(16), minHeight: 72 } : void 0,
-      style: [inputStyle, style]
+      style: [inputStyle, style],
+      sheetMode
     }
   );
 }
@@ -3340,6 +3376,7 @@ var styles24 = reactNative.StyleSheet.create({
   }
 });
 function ListItemBase({
+  imageSource,
   leftRender,
   rightRender,
   trailing,
@@ -3359,6 +3396,7 @@ function ListItemBase({
   style,
   titleStyle,
   subtitleStyle,
+  subtitleNumberOfLines = 2,
   captionStyle,
   accessibilityLabel
 }) {
@@ -3367,7 +3405,7 @@ function ListItemBase({
     selectionAsync();
     onPress?.();
   };
-  const effectiveLeft = leftIcon ? renderIcon(leftIcon, 24, leftIconColor ?? colors.foreground) : leftRender ?? icon;
+  const effectiveLeft = imageSource ? /* @__PURE__ */ React25__default.default.createElement(reactNative.Image, { source: imageSource, style: styles25.image }) : leftIcon ? renderIcon(leftIcon, 24, leftIconColor ?? colors.foreground) : leftRender ?? icon;
   const effectiveRight = rightIcon ? renderIcon(rightIcon, 24, rightIconColor ?? colors.foregroundMuted) : rightRender ?? trailing;
   const cardStyle = variant === "card" ? {
     backgroundColor: colors.card,
@@ -3393,7 +3431,7 @@ function ListItemBase({
     reactNative.Text,
     {
       style: [styles25.subtitle, { color: colors.foregroundMuted }, subtitleStyle],
-      numberOfLines: 2,
+      numberOfLines: subtitleNumberOfLines,
       allowFontScaling: true
     },
     subtitle
@@ -3448,6 +3486,11 @@ var styles25 = reactNative.StyleSheet.create({
     justifyContent: "center",
     flexShrink: 0
   },
+  image: {
+    width: s(40),
+    height: s(40),
+    borderRadius: 8
+  },
   content: {
     flex: 1,
     gap: vs(4)
@@ -3861,6 +3904,7 @@ function ConfirmDialog({
   confirmLabel = "Confirm",
   cancelLabel = "Cancel",
   confirmVariant = "primary",
+  loading = false,
   onConfirm,
   onCancel
 }) {
@@ -3900,6 +3944,8 @@ function ConfirmDialog({
         label: confirmLabel,
         variant: confirmVariant,
         fullWidth: true,
+        loading,
+        disabled: loading,
         onPress: () => {
           notificationSuccess();
           onConfirm();
@@ -4166,7 +4212,7 @@ function MediaCardBase({
     (title || subtitle || caption || footer) && /* @__PURE__ */ React25__default.default.createElement(reactNative.View, { style: styles33.meta }, title ? /* @__PURE__ */ React25__default.default.createElement(reactNative.Text, { style: [styles33.title, { color: colors.foreground }], numberOfLines: 2, allowFontScaling: true }, title) : null, subtitle ? /* @__PURE__ */ React25__default.default.createElement(reactNative.Text, { style: [styles33.subtitle, { color: colors.foregroundSubtle }], numberOfLines: 1, allowFontScaling: true }, subtitle) : null, caption ? /* @__PURE__ */ React25__default.default.createElement(reactNative.Text, { style: [styles33.caption, { color: colors.foregroundMuted }], numberOfLines: 1, allowFontScaling: true }, caption) : null, footer)
   );
   if (onPress) {
-    return /* @__PURE__ */ React25__default.default.createElement(Animated13__default.default.View, { style: animatedStyle }, /* @__PURE__ */ React25__default.default.createElement(
+    return /* @__PURE__ */ React25__default.default.createElement(Animated12__default.default.View, { style: animatedStyle }, /* @__PURE__ */ React25__default.default.createElement(
       reactNative.TouchableOpacity,
       {
         onPress: handlePress,
@@ -4251,7 +4297,7 @@ var CategoryChip = React25__default.default.memo(function CategoryChip2({
   });
   const iconColor = selected ? colors.primaryForeground : colors.foregroundSubtle;
   const resolvedIcon = typeof item.icon === "string" ? renderIcon(item.icon, 16, iconColor) : item.icon ?? null;
-  return /* @__PURE__ */ React25__default.default.createElement(Animated13__default.default.View, { style: scaleStyle, ...hoverHandlers }, /* @__PURE__ */ React25__default.default.createElement(
+  return /* @__PURE__ */ React25__default.default.createElement(Animated12__default.default.View, { style: scaleStyle, ...hoverHandlers }, /* @__PURE__ */ React25__default.default.createElement(
     reactNative.TouchableOpacity,
     {
       onPress: () => onSelect(item.value),
@@ -4674,15 +4720,15 @@ var styles38 = reactNative.StyleSheet.create({
   }
 });
 function Dot({ active, size, activeColor, inactiveColor, onPress, index, total }) {
-  const progress = Animated13.useSharedValue(active ? 1 : 0);
+  const progress = Animated12.useSharedValue(active ? 1 : 0);
   React25.useEffect(() => {
-    progress.value = Animated13.withSpring(active ? 1 : 0, SPRINGS.glide);
+    progress.value = Animated12.withSpring(active ? 1 : 0, SPRINGS.glide);
   }, [active, progress]);
-  const animatedStyle = Animated13.useAnimatedStyle(() => ({
+  const animatedStyle = Animated12.useAnimatedStyle(() => ({
     width: size + progress.value * size * 1.5,
-    backgroundColor: Animated13.interpolateColor(progress.value, [0, 1], [inactiveColor, activeColor])
+    backgroundColor: Animated12.interpolateColor(progress.value, [0, 1], [inactiveColor, activeColor])
   }));
-  const dot = /* @__PURE__ */ React25__default.default.createElement(Animated13__default.default.View, { style: [{ height: size, borderRadius: size / 2 }, animatedStyle] });
+  const dot = /* @__PURE__ */ React25__default.default.createElement(Animated12__default.default.View, { style: [{ height: size, borderRadius: size / 2 }, animatedStyle] });
   if (!onPress) return dot;
   const handlePress = () => {
     selectionAsync();
@@ -4921,7 +4967,7 @@ function Cell({ item, selected, width, onPress }) {
   });
   const iconColor = selected ? colors.primary : colors.foregroundSubtle;
   const iconNode = item.icon ?? (item.iconName ? renderIcon(item.iconName, ms(24), iconColor) : null);
-  return /* @__PURE__ */ React25__default.default.createElement(Animated13__default.default.View, { style: [{ width }, animatedStyle] }, /* @__PURE__ */ React25__default.default.createElement(
+  return /* @__PURE__ */ React25__default.default.createElement(Animated12__default.default.View, { style: [{ width }, animatedStyle] }, /* @__PURE__ */ React25__default.default.createElement(
     reactNative.TouchableOpacity,
     {
       onPress,
@@ -5283,22 +5329,22 @@ var styles43 = reactNative.StyleSheet.create({
 var MAX_SCALE = 3;
 var DOUBLE_TAP_SCALE = 2.5;
 function ZoomableImage({ source, width, height, onZoomChange }) {
-  const scale2 = Animated13.useSharedValue(1);
-  const savedScale = Animated13.useSharedValue(1);
-  const translateX = Animated13.useSharedValue(0);
-  const translateY = Animated13.useSharedValue(0);
-  const savedX = Animated13.useSharedValue(0);
-  const savedY = Animated13.useSharedValue(0);
+  const scale2 = Animated12.useSharedValue(1);
+  const savedScale = Animated12.useSharedValue(1);
+  const translateX = Animated12.useSharedValue(0);
+  const translateY = Animated12.useSharedValue(0);
+  const savedX = Animated12.useSharedValue(0);
+  const savedY = Animated12.useSharedValue(0);
   const reportZoom = React25.useCallback((zoomed) => onZoomChange(zoomed), [onZoomChange]);
   const reset = () => {
     "worklet";
-    scale2.value = Animated13.withTiming(1);
+    scale2.value = Animated12.withTiming(1);
     savedScale.value = 1;
-    translateX.value = Animated13.withTiming(0);
-    translateY.value = Animated13.withTiming(0);
+    translateX.value = Animated12.withTiming(0);
+    translateY.value = Animated12.withTiming(0);
     savedX.value = 0;
     savedY.value = 0;
-    Animated13.runOnJS(reportZoom)(false);
+    Animated12.runOnJS(reportZoom)(false);
   };
   const pinch = reactNativeGestureHandler.Gesture.Pinch().onUpdate((e) => {
     scale2.value = Math.max(1, Math.min(savedScale.value * e.scale, MAX_SCALE));
@@ -5307,7 +5353,7 @@ function ZoomableImage({ source, width, height, onZoomChange }) {
     if (scale2.value <= 1) {
       reset();
     } else {
-      Animated13.runOnJS(reportZoom)(true);
+      Animated12.runOnJS(reportZoom)(true);
     }
   });
   const pan = reactNativeGestureHandler.Gesture.Pan().onUpdate((e) => {
@@ -5322,21 +5368,21 @@ function ZoomableImage({ source, width, height, onZoomChange }) {
     if (scale2.value > 1) {
       reset();
     } else {
-      scale2.value = Animated13.withTiming(DOUBLE_TAP_SCALE);
+      scale2.value = Animated12.withTiming(DOUBLE_TAP_SCALE);
       savedScale.value = DOUBLE_TAP_SCALE;
-      Animated13.runOnJS(reportZoom)(true);
+      Animated12.runOnJS(reportZoom)(true);
     }
   });
   const composed = reactNativeGestureHandler.Gesture.Exclusive(doubleTap, reactNativeGestureHandler.Gesture.Simultaneous(pinch, pan));
-  const animatedStyle = Animated13.useAnimatedStyle(() => ({
+  const animatedStyle = Animated12.useAnimatedStyle(() => ({
     transform: [
       { translateX: translateX.value },
       { translateY: translateY.value },
       { scale: scale2.value }
     ]
   }));
-  return /* @__PURE__ */ React25__default.default.createElement(reactNativeGestureHandler.GestureDetector, { gesture: composed }, /* @__PURE__ */ React25__default.default.createElement(Animated13__default.default.View, { style: [{ width, height }, styles44.imageWrap] }, /* @__PURE__ */ React25__default.default.createElement(
-    Animated13__default.default.Image,
+  return /* @__PURE__ */ React25__default.default.createElement(reactNativeGestureHandler.GestureDetector, { gesture: composed }, /* @__PURE__ */ React25__default.default.createElement(Animated12__default.default.View, { style: [{ width, height }, styles44.imageWrap] }, /* @__PURE__ */ React25__default.default.createElement(
+    Animated12__default.default.Image,
     {
       source,
       style: [{ width, height }, animatedStyle],
@@ -5359,25 +5405,25 @@ function ImageViewer({ images, visible, onClose, initialIndex = 0 }) {
     });
     return () => cancelAnimationFrame(handle);
   }, [visible, initialIndex, width]);
-  const dragY = Animated13.useSharedValue(0);
+  const dragY = Animated12.useSharedValue(0);
   const DISMISS_THRESHOLD = height * 0.18;
   const closeViewer = React25.useCallback(() => onClose(), [onClose]);
   const swipeDown = reactNativeGestureHandler.Gesture.Pan().enabled(pagingEnabled).activeOffsetY(12).failOffsetX([-16, 16]).onUpdate((e) => {
     dragY.value = Math.max(0, e.translationY);
   }).onEnd((e) => {
     if (e.translationY > DISMISS_THRESHOLD || e.velocityY > 800) {
-      Animated13.runOnJS(closeViewer)();
+      Animated12.runOnJS(closeViewer)();
     } else {
-      dragY.value = Animated13.withTiming(0);
+      dragY.value = Animated12.withTiming(0);
     }
   });
   React25__default.default.useEffect(() => {
     if (visible) dragY.value = 0;
   }, [visible, dragY]);
-  const dismissStyle = Animated13.useAnimatedStyle(() => ({
+  const dismissStyle = Animated12.useAnimatedStyle(() => ({
     transform: [{ translateY: dragY.value }]
   }));
-  const backdropStyle = Animated13.useAnimatedStyle(() => ({
+  const backdropStyle = Animated12.useAnimatedStyle(() => ({
     opacity: 1 - Math.min(dragY.value / (height * 0.5), 0.85)
   }));
   const onMomentumEnd = (e) => {
@@ -5388,7 +5434,7 @@ function ImageViewer({ images, visible, onClose, initialIndex = 0 }) {
     scrollRef.current?.scrollTo({ x: page * width, animated: true });
     setIndex(page);
   };
-  return /* @__PURE__ */ React25__default.default.createElement(reactNative.Modal, { visible, transparent: false, animationType: "fade", onRequestClose: onClose, statusBarTranslucent: true }, /* @__PURE__ */ React25__default.default.createElement(reactNativeGestureHandler.GestureHandlerRootView, { style: styles44.root }, /* @__PURE__ */ React25__default.default.createElement(Animated13__default.default.View, { style: [styles44.backdrop, backdropStyle], pointerEvents: "none" }), /* @__PURE__ */ React25__default.default.createElement(Animated13__default.default.View, { style: [styles44.container, dismissStyle] }, /* @__PURE__ */ React25__default.default.createElement(reactNativeGestureHandler.GestureDetector, { gesture: swipeDown }, /* @__PURE__ */ React25__default.default.createElement(Animated13__default.default.View, { style: styles44.root }, /* @__PURE__ */ React25__default.default.createElement(
+  return /* @__PURE__ */ React25__default.default.createElement(reactNative.Modal, { visible, transparent: false, animationType: "fade", onRequestClose: onClose, statusBarTranslucent: true }, /* @__PURE__ */ React25__default.default.createElement(reactNativeGestureHandler.GestureHandlerRootView, { style: styles44.root }, /* @__PURE__ */ React25__default.default.createElement(Animated12__default.default.View, { style: [styles44.backdrop, backdropStyle], pointerEvents: "none" }), /* @__PURE__ */ React25__default.default.createElement(Animated12__default.default.View, { style: [styles44.container, dismissStyle] }, /* @__PURE__ */ React25__default.default.createElement(reactNativeGestureHandler.GestureDetector, { gesture: swipeDown }, /* @__PURE__ */ React25__default.default.createElement(Animated12__default.default.View, { style: styles44.root }, /* @__PURE__ */ React25__default.default.createElement(
     reactNative.ScrollView,
     {
       ref: scrollRef,
@@ -5465,6 +5511,240 @@ var styles44 = reactNative.StyleSheet.create({
     alignItems: "center"
   }
 });
+function SheetSelectChip({
+  option,
+  selected,
+  onPress
+}) {
+  const { colors } = useTheme();
+  const handlePress = () => {
+    selectionAsync();
+    onPress();
+  };
+  const iconColor = selected ? colors.primaryForeground : colors.foreground;
+  const resolvedIcon = option.iconName ? renderIcon(option.iconName, ms(13), iconColor) : null;
+  return /* @__PURE__ */ React25__default.default.createElement(
+    PressableChip,
+    {
+      onPress: option.disabled ? void 0 : handlePress,
+      rippleColor: "transparent",
+      touchSoundDisabled: true,
+      accessibilityRole: "button",
+      accessibilityLabel: option.disabled ? `${option.label}, unavailable` : option.label,
+      accessibilityState: { selected, disabled: option.disabled }
+    },
+    /* @__PURE__ */ React25__default.default.createElement(
+      reactNativeEase.EaseView,
+      {
+        style: [styles45.chip, option.disabled && styles45.chipDisabled],
+        animate: {
+          backgroundColor: selected ? colors.primary : colors.surface,
+          borderColor: selected ? colors.primary : colors.border
+        },
+        transition: COLOR_TRANSITION
+      },
+      resolvedIcon ? /* @__PURE__ */ React25__default.default.createElement(reactNative.View, { style: styles45.chipIcon }, resolvedIcon) : null,
+      /* @__PURE__ */ React25__default.default.createElement(
+        reactNative.Text,
+        {
+          style: [styles45.chipLabel, { color: selected ? colors.primaryForeground : colors.foreground }],
+          allowFontScaling: true
+        },
+        option.label
+      )
+    )
+  );
+}
+function SheetSelect({
+  options,
+  value,
+  onValueChange,
+  multiSelect = false,
+  label,
+  error,
+  wrap = false,
+  style,
+  accessibilityLabel
+}) {
+  const { colors } = useTheme();
+  const isSelected2 = (optionValue) => {
+    if (Array.isArray(value)) return value.includes(optionValue);
+    return optionValue === value;
+  };
+  const handlePress = (optionValue) => {
+    if (!multiSelect) {
+      onValueChange?.(optionValue);
+      return;
+    }
+    const currentArray = Array.isArray(value) ? value : value != null ? [value] : [];
+    const alreadySelected = currentArray.includes(optionValue);
+    const newArray = alreadySelected ? currentArray.filter((v) => v !== optionValue) : [...currentArray, optionValue];
+    onValueChange?.(newArray);
+  };
+  const chips = options.map((opt) => /* @__PURE__ */ React25__default.default.createElement(
+    SheetSelectChip,
+    {
+      key: opt.value,
+      option: opt,
+      selected: isSelected2(opt.value),
+      onPress: () => handlePress(opt.value)
+    }
+  ));
+  return /* @__PURE__ */ React25__default.default.createElement(reactNative.View, { style: [styles45.container, style], accessibilityLabel }, label ? /* @__PURE__ */ React25__default.default.createElement(reactNative.Text, { style: [styles45.label, { color: colors.foreground }], allowFontScaling: true }, label) : null, wrap ? /* @__PURE__ */ React25__default.default.createElement(reactNative.View, { style: styles45.wrapContainer }, chips) : /* @__PURE__ */ React25__default.default.createElement(
+    reactNative.ScrollView,
+    {
+      horizontal: true,
+      showsHorizontalScrollIndicator: false,
+      contentContainerStyle: styles45.scrollContent
+    },
+    chips
+  ), error ? /* @__PURE__ */ React25__default.default.createElement(reactNative.Text, { style: [styles45.error, { color: colors.destructive }], allowFontScaling: true, accessibilityLiveRegion: "polite" }, error) : null);
+}
+var styles45 = reactNative.StyleSheet.create({
+  container: {
+    gap: vs(8)
+  },
+  label: {
+    fontFamily: "Sohne-Medium",
+    fontSize: ms(14)
+  },
+  scrollContent: {
+    flexDirection: "row",
+    gap: s(8)
+  },
+  wrapContainer: {
+    flexDirection: "row",
+    flexWrap: "wrap",
+    gap: s(8)
+  },
+  chip: {
+    borderRadius: RADIUS.full,
+    paddingHorizontal: s(14),
+    paddingVertical: vs(10),
+    minHeight: 44,
+    borderWidth: 1,
+    alignItems: "center",
+    justifyContent: "center",
+    flexDirection: "row",
+    gap: s(5)
+  },
+  chipDisabled: {
+    opacity: 0.4
+  },
+  chipIcon: {
+    alignItems: "center",
+    justifyContent: "center"
+  },
+  chipLabel: {
+    fontFamily: "Sohne-Medium",
+    fontSize: ms(13),
+    lineHeight: mvs(18)
+  },
+  error: {
+    fontFamily: "Sohne-Regular",
+    fontSize: ms(13)
+  }
+});
+function ImageUpload({
+  value,
+  onChange,
+  loading = false,
+  placeholder = "Tap to add image",
+  width,
+  height = 200,
+  borderRadius = RADIUS.lg,
+  resizeMode = "cover",
+  disabled = false,
+  style,
+  accessibilityLabel
+}) {
+  const { colors } = useTheme();
+  const handlePress = async () => {
+    if (disabled || loading) return;
+    impactLight();
+    let ImagePicker;
+    try {
+      ImagePicker = await import('expo-image-picker');
+    } catch {
+      if (__DEV__) console.warn("[ImageUpload] expo-image-picker not installed. Add it as a dependency.");
+      return;
+    }
+    if (reactNative.Platform.OS !== "web") {
+      const { status } = await ImagePicker.requestMediaLibraryPermissionsAsync();
+      if (status !== "granted") return;
+    }
+    const result = await ImagePicker.launchImageLibraryAsync({
+      mediaTypes: ["images"],
+      allowsEditing: true,
+      quality: 0.8
+    });
+    if (!result.canceled && result.assets[0]) {
+      onChange?.(result.assets[0].uri);
+    }
+  };
+  const containerStyle = {
+    width,
+    height,
+    borderRadius,
+    borderWidth: value ? 0 : 1,
+    borderStyle: "dashed",
+    borderColor: colors.border,
+    backgroundColor: value ? "transparent" : colors.surface,
+    overflow: "hidden"
+  };
+  return /* @__PURE__ */ React25__default.default.createElement(
+    PressableCard,
+    {
+      onPress: handlePress,
+      enabled: !disabled && !loading,
+      rippleColor: "transparent",
+      touchSoundDisabled: true,
+      accessibilityRole: "button",
+      accessibilityLabel: accessibilityLabel ?? (value ? "Change image" : placeholder),
+      accessibilityState: { disabled: disabled || loading },
+      style: [containerStyle, style]
+    },
+    value ? /* @__PURE__ */ React25__default.default.createElement(
+      reactNative.Image,
+      {
+        source: { uri: value },
+        style: [reactNative.StyleSheet.absoluteFillObject, { borderRadius }],
+        resizeMode
+      }
+    ) : /* @__PURE__ */ React25__default.default.createElement(reactNative.View, { style: styles46.placeholder }, /* @__PURE__ */ React25__default.default.createElement(vectorIcons.Feather, { name: "image", size: ms(28), color: colors.foregroundMuted }), /* @__PURE__ */ React25__default.default.createElement(reactNative.Text, { style: [styles46.placeholderText, { color: colors.foregroundMuted }], allowFontScaling: true }, placeholder)),
+    loading ? /* @__PURE__ */ React25__default.default.createElement(reactNative.View, { style: [styles46.loadingOverlay, { backgroundColor: colors.overlay }] }, /* @__PURE__ */ React25__default.default.createElement(Spinner, { size: "md" })) : null,
+    value && !loading ? /* @__PURE__ */ React25__default.default.createElement(reactNative.View, { style: styles46.editBadge, pointerEvents: "none" }, /* @__PURE__ */ React25__default.default.createElement(reactNative.View, { style: [styles46.editBadgeInner, { backgroundColor: colors.overlay }] }, /* @__PURE__ */ React25__default.default.createElement(vectorIcons.Feather, { name: "edit-2", size: ms(12), color: "#fff" }))) : null
+  );
+}
+var styles46 = reactNative.StyleSheet.create({
+  placeholder: {
+    flex: 1,
+    alignItems: "center",
+    justifyContent: "center",
+    gap: vs(8)
+  },
+  placeholderText: {
+    fontFamily: "Sohne-Regular",
+    fontSize: ms(13)
+  },
+  loadingOverlay: {
+    ...reactNative.StyleSheet.absoluteFillObject,
+    alignItems: "center",
+    justifyContent: "center"
+  },
+  editBadge: {
+    position: "absolute",
+    bottom: vs(8),
+    right: s(8)
+  },
+  editBadgeInner: {
+    width: s(28),
+    height: s(28),
+    borderRadius: 999,
+    alignItems: "center",
+    justifyContent: "center"
+  }
+});
 
 // src/utils/typography.ts
 function getResponsiveFontSize(text, maxSize, steps = [
@@ -5479,6 +5759,42 @@ function getResponsiveFontSize(text, maxSize, steps = [
   }
   return maxSize - 8;
 }
+function useConfirmDialog(options) {
+  const [visible, setVisible] = React25.useState(false);
+  const [target, setTarget] = React25.useState(null);
+  const [loading, setLoading] = React25.useState(false);
+  const open = React25.useCallback((t) => {
+    setTarget(t ?? null);
+    setVisible(true);
+  }, []);
+  const handleConfirm = React25.useCallback(async () => {
+    setLoading(true);
+    try {
+      await options.onConfirm();
+    } finally {
+      setLoading(false);
+      setVisible(false);
+      setTarget(null);
+    }
+  }, [options]);
+  const handleCancel = React25.useCallback(() => {
+    setVisible(false);
+    setTarget(null);
+    options.onCancel?.();
+  }, [options]);
+  return {
+    visible,
+    target,
+    loading,
+    open,
+    dialogProps: {
+      visible,
+      loading,
+      onConfirm: handleConfirm,
+      onCancel: handleCancel
+    }
+  };
+}
 
 Object.defineProperty(exports, "BottomSheetModalProvider", {
   enumerable: true,
@@ -5523,6 +5839,7 @@ exports.FormSection = FormSection;
 exports.ICON_SIZES = ICON_SIZES;
 exports.Icon = Icon;
 exports.IconButton = IconButton;
+exports.ImageUpload = ImageUpload;
 exports.ImageViewer = ImageViewer;
 exports.Input = Input;
 exports.LabelValue = LabelValue;
@@ -5549,6 +5866,7 @@ exports.Select = Select;
 exports.SelectableGrid = SelectableGrid;
 exports.Separator = Separator;
 exports.Sheet = Sheet;
+exports.SheetSelect = SheetSelect;
 exports.Skeleton = Skeleton;
 exports.Slider = Slider;
 exports.Spinner = Spinner;
@@ -5579,5 +5897,6 @@ exports.notificationWarning = notificationWarning;
 exports.renderIcon = renderIcon;
 exports.richHaptics = richHaptics;
 exports.selectionAsync = selectionAsync;
+exports.useConfirmDialog = useConfirmDialog;
 exports.useTheme = useTheme;
 exports.useToast = useToast;