@webority-technologies/mobile 0.0.23 → 0.0.25

package/lib/commonjs/components/Accordion/Accordion.js

@@ -96,7 +96,8 @@ const Accordion = props => {
     contentWrapperStyle,
     containerStyle,
     testID,
-    loading = false
+    loading = false,
+    haptic
   } = props;
   const theme = (0, _index.useTheme)();
   const styles = (0, _react.useMemo)(() => buildStyles(theme), [theme]);
@@ -143,9 +144,8 @@ const Accordion = props => {
   }, [measuredHeight]);
   const handlePress = (0, _react.useCallback)(() => {
     if (disabled) return;
-    if (theme.components.accordion?.pressHaptic ?? false) {
-      (0, _hapticUtils.triggerHaptic)('selection');
-    }
+    const h = (0, _hapticUtils.resolveHaptic)(haptic, 'selection');
+    if (h) (0, _hapticUtils.triggerHaptic)(h);
     if (group && id) {
       group.toggle(id);
       onChange?.(!expanded);
@@ -153,7 +153,7 @@ const Accordion = props => {
     }
     if (!isControlled) setInternalExpanded(!expanded);
     onChange?.(!expanded);
-  }, [disabled, group, id, expanded, isControlled, onChange, theme.components.accordion]);
+  }, [disabled, group, id, expanded, isControlled, onChange, haptic]);
   const rotate = rotateAnim.interpolate({
     inputRange: [0, 1],
     outputRange: ['0deg', '180deg']

package/lib/commonjs/components/AnimatePresence/AnimatePresence.js

@@ -0,0 +1,69 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = exports.AnimatePresence = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _reactNativeReanimated = _interopRequireWildcard(require("react-native-reanimated"));
+var _index = require("../../theme/index.js");
+var _index2 = require("../../hooks/index.js");
+var _jsxRuntime = require("react/jsx-runtime");
+function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+/**
+ * Animates a single child in on mount and out on unmount. Thin, theme-aware
+ * wrapper over Reanimated's `entering`/`exiting` — Reanimated keeps the view
+ * alive to play the exit, so the parent only toggles a condition. Honors the OS
+ * Reduce Motion setting (renders instantly when reduced).
+ *
+ * For animating items inside a list, use Reanimated's `itemLayoutAnimation`
+ * on `Animated.FlatList` instead — this wrapper targets single conditional nodes.
+ */
+const AnimatePresence = ({
+  children,
+  preset = 'fade',
+  duration,
+  style,
+  testID
+}) => {
+  const theme = (0, _index.useTheme)();
+  const reduceMotion = (0, _index2.useReducedMotion)();
+  const visible = children !== null && children !== undefined && children !== false;
+  if (!visible) return null;
+  const dur = duration ?? theme.motion.duration.normal;
+  let entering;
+  let exiting;
+  if (!reduceMotion) {
+    switch (preset) {
+      case 'scale':
+        entering = _reactNativeReanimated.ZoomIn.duration(dur);
+        exiting = _reactNativeReanimated.ZoomOut.duration(dur);
+        break;
+      case 'slide-up':
+        entering = _reactNativeReanimated.FadeInUp.duration(dur);
+        exiting = _reactNativeReanimated.FadeOutDown.duration(dur);
+        break;
+      case 'slide-down':
+        entering = _reactNativeReanimated.FadeInDown.duration(dur);
+        exiting = _reactNativeReanimated.FadeOutUp.duration(dur);
+        break;
+      case 'fade':
+      default:
+        entering = _reactNativeReanimated.FadeIn.duration(dur);
+        exiting = _reactNativeReanimated.FadeOut.duration(dur);
+        break;
+    }
+  }
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNativeReanimated.default.View, {
+    entering: entering,
+    exiting: exiting,
+    style: style,
+    testID: testID,
+    children: children
+  });
+};
+exports.AnimatePresence = AnimatePresence;
+AnimatePresence.displayName = 'AnimatePresence';
+var _default = exports.default = AnimatePresence;
+//# sourceMappingURL=AnimatePresence.js.map

package/lib/commonjs/components/AnimatePresence/index.js

@@ -0,0 +1,13 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "AnimatePresence", {
+  enumerable: true,
+  get: function () {
+    return _AnimatePresence.AnimatePresence;
+  }
+});
+var _AnimatePresence = require("./AnimatePresence.js");
+//# sourceMappingURL=index.js.map

package/lib/commonjs/components/AppBar/AppBar.js

@@ -41,7 +41,8 @@ const variantSize = (theme, variant) => {
 const ActionButton = ({
   action,
   side,
-  badgeStyle
+  badgeStyle,
+  haptic
 }) => {
   const theme = (0, _index.useTheme)();
   const {
@@ -53,9 +54,8 @@ const ActionButton = ({
   });
   const styles = (0, _react.useMemo)(() => buildActionStyles(theme), [theme]);
   const onPress = () => {
-    if (theme.components.appBar?.pressHaptic ?? false) {
-      (0, _hapticUtils.triggerHaptic)('selection');
-    }
+    const h = (0, _hapticUtils.resolveHaptic)(haptic, 'selection');
+    if (h) (0, _hapticUtils.triggerHaptic)(h);
     action.onPress();
   };
   const badgeValue = action.badge;
@@ -113,6 +113,7 @@ const AppBar = exports.AppBar = /*#__PURE__*/(0, _react.forwardRef)((props, ref)
     titleStyle,
     subtitleStyle,
     badgeStyle,
+    haptic,
     testID
   } = props;
   const theme = (0, _index.useTheme)();
@@ -230,7 +231,8 @@ const AppBar = exports.AppBar = /*#__PURE__*/(0, _react.forwardRef)((props, ref)
         style: styles.sideSlot,
         children: leftAction ? /*#__PURE__*/(0, _jsxRuntime.jsx)(ActionButton, {
           action: leftAction,
-          side: "left"
+          side: "left",
+          haptic: haptic
         }) : null
       }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
         style: [styles.center, titleAlignment === 'center' ? styles.centerAligned : styles.centerLeft],
@@ -240,7 +242,8 @@ const AppBar = exports.AppBar = /*#__PURE__*/(0, _react.forwardRef)((props, ref)
         children: rightActions?.map((action, index) => /*#__PURE__*/(0, _jsxRuntime.jsx)(ActionButton, {
           action: action,
           side: "right",
-          badgeStyle: badgeStyle
+          badgeStyle: badgeStyle,
+          haptic: haptic
         }, `appbar-right-${index}`))
       })]
     })]

package/lib/commonjs/components/Autocomplete/Autocomplete.js

@@ -0,0 +1,204 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.Autocomplete = Autocomplete;
+exports.default = void 0;
+var _react = _interopRequireWildcard(require("react"));
+var _reactNative = require("react-native");
+var _index = require("../../theme/index.js");
+var _index2 = require("../../utils/index.js");
+var _index3 = require("../../hooks/index.js");
+var _index4 = require("../Input/index.js");
+var _index5 = require("../Spinner/index.js");
+var _jsxRuntime = require("react/jsx-runtime");
+function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
+const defaultGetLabel = o => typeof o === 'string' ? o : String(o);
+function Autocomplete(props) {
+  const {
+    options,
+    value,
+    defaultValue,
+    onChangeText,
+    onSelect,
+    getOptionLabel,
+    getOptionKey,
+    filter,
+    minChars = 1,
+    maxResults = 8,
+    emptyText = 'No matches',
+    loading = false,
+    filterMode = 'client',
+    loadingText = 'Searching…',
+    placeholder,
+    label,
+    error,
+    helperText,
+    disabled = false,
+    size = 'md',
+    variant,
+    haptic,
+    style,
+    listStyle,
+    optionTextStyle,
+    testID
+  } = props;
+  const theme = (0, _index.useTheme)();
+  const styles = (0, _react.useMemo)(() => buildStyles(theme), [theme]);
+  const [text, setText] = (0, _index3.useControllableState)({
+    value,
+    defaultValue: defaultValue ?? '',
+    onChange: onChangeText
+  });
+  const [focused, setFocused] = (0, _react.useState)(false);
+  const [fieldHeight, setFieldHeight] = (0, _react.useState)(0);
+  const blurTimer = (0, _react.useRef)(null);
+  const labelOf = (0, _react.useCallback)(o => getOptionLabel ? getOptionLabel(o) : defaultGetLabel(o), [getOptionLabel]);
+  const filtered = (0, _react.useMemo)(() => {
+    // Server-side search: trust the provided options, don't re-filter them away.
+    if (filterMode === 'none') return options.slice(0, maxResults);
+    const q = text.trim();
+    if (q.length < minChars) return [];
+    const lower = q.toLowerCase();
+    const match = filter ? o => filter(o, q) : o => labelOf(o).toLowerCase().includes(lower);
+    return options.filter(match).slice(0, maxResults);
+  }, [options, text, minChars, maxResults, filter, labelOf, filterMode]);
+  const showList = focused && (loading || text.trim().length >= minChars);
+  const handleSelect = (0, _react.useCallback)(o => {
+    const h = (0, _index2.resolveHaptic)(haptic, 'selection');
+    if (h) (0, _index2.triggerHaptic)(h);
+    if (blurTimer.current) clearTimeout(blurTimer.current);
+    setText(labelOf(o));
+    setFocused(false);
+    _reactNative.Keyboard.dismiss();
+    onSelect(o);
+  }, [haptic, setText, labelOf, onSelect]);
+  _react.default.useEffect(() => () => {
+    if (blurTimer.current) clearTimeout(blurTimer.current);
+  }, []);
+  const onFieldLayout = (0, _react.useCallback)(e => {
+    setFieldHeight(e.nativeEvent.layout.height);
+  }, []);
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
+    style: [styles.container, style],
+    testID: testID,
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
+      onLayout: onFieldLayout,
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_index4.Input, {
+        value: text,
+        onChangeText: setText,
+        onFocus: () => {
+          if (blurTimer.current) clearTimeout(blurTimer.current);
+          setFocused(true);
+        },
+        onBlur: () => {
+          blurTimer.current = setTimeout(() => setFocused(false), 120);
+        },
+        placeholder: placeholder,
+        label: label,
+        error: error,
+        helperText: helperText,
+        editable: !disabled,
+        size: size,
+        variant: variant,
+        autoCorrect: false,
+        autoCapitalize: "none"
+      })
+    }), showList ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
+      style: [styles.list, {
+        top: fieldHeight,
+        backgroundColor: theme.colors.background.elevated,
+        borderColor: theme.colors.border.primary,
+        borderRadius: theme.radius.md,
+        ...theme.shadows.lg
+      }, listStyle],
+      children: loading ? /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
+        style: styles.loadingRow,
+        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_index5.Spinner, {
+          size: "sm"
+        }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
+          style: [styles.loadingText, {
+            color: theme.colors.text.secondary,
+            fontSize: theme.typography.fontSize.sm
+          }],
+          children: loadingText
+        })]
+      }) : filtered.length === 0 ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
+        style: [styles.empty, {
+          color: theme.colors.text.tertiary,
+          fontSize: theme.typography.fontSize.sm
+        }],
+        children: emptyText
+      }) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.ScrollView, {
+        keyboardShouldPersistTaps: "handled",
+        style: styles.scroll,
+        children: filtered.map((o, i) => /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Pressable, {
+          onPress: () => handleSelect(o),
+          android_ripple: {
+            color: theme.colors.surface.pressed
+          },
+          style: ({
+            pressed
+          }) => [styles.option, {
+            paddingHorizontal: theme.spacing.md,
+            paddingVertical: theme.spacing.sm,
+            backgroundColor: pressed ? theme.colors.surface.pressed : 'transparent'
+          }],
+          accessibilityRole: "button",
+          accessibilityLabel: labelOf(o),
+          children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
+            style: [styles.optionText, {
+              color: theme.colors.text.primary,
+              fontSize: theme.typography.fontSize.base
+            }, optionTextStyle],
+            numberOfLines: 1,
+            children: labelOf(o)
+          })
+        }, getOptionKey ? getOptionKey(o) : `${labelOf(o)}-${i}`))
+      })
+    }) : null]
+  });
+}
+Autocomplete.displayName = 'Autocomplete';
+const buildStyles = theme => _reactNative.StyleSheet.create({
+  container: {
+    width: '100%',
+    position: 'relative',
+    zIndex: 10
+  },
+  list: {
+    position: 'absolute',
+    left: 0,
+    right: 0,
+    borderWidth: _reactNative.StyleSheet.hairlineWidth,
+    overflow: 'hidden',
+    zIndex: 20,
+    maxHeight: 240
+  },
+  scroll: {
+    maxHeight: 240
+  },
+  option: {
+    width: '100%'
+  },
+  optionText: {
+    includeFontPadding: false
+  },
+  empty: {
+    padding: theme.spacing.md,
+    textAlign: 'center',
+    includeFontPadding: false
+  },
+  loadingRow: {
+    flexDirection: 'row',
+    alignItems: 'center',
+    gap: theme.spacing.sm,
+    padding: theme.spacing.md
+  },
+  loadingText: {
+    includeFontPadding: false
+  }
+});
+var _default = exports.default = Autocomplete;
+//# sourceMappingURL=Autocomplete.js.map

package/lib/commonjs/components/Autocomplete/index.js

@@ -0,0 +1,13 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "Autocomplete", {
+  enumerable: true,
+  get: function () {
+    return _Autocomplete.Autocomplete;
+  }
+});
+var _Autocomplete = require("./Autocomplete.js");
+//# sourceMappingURL=index.js.map

package/lib/commonjs/components/Banner/Banner.js

@@ -7,6 +7,7 @@ exports.default = exports.Banner = void 0;
 var _react = _interopRequireWildcard(require("react"));
 var _reactNative = require("react-native");
 var _index = require("../../theme/index.js");
+var _hapticUtils = require("../../utils/hapticUtils.js");
 var _index2 = require("../Skeleton/index.js");
 var _jsxRuntime = require("react/jsx-runtime");
 function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
@@ -19,6 +20,7 @@ const Banner = exports.Banner = /*#__PURE__*/(0, _react.forwardRef)((props, ref)
     actions,
     dismissible = false,
     onDismiss,
+    haptic,
     visible = true,
     animateMount = true,
     loading = false,
@@ -148,7 +150,11 @@ const Banner = exports.Banner = /*#__PURE__*/(0, _react.forwardRef)((props, ref)
       }), dismissible ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Pressable, {
         accessibilityRole: "button",
         accessibilityLabel: "Dismiss banner",
-        onPress: onDismiss,
+        onPress: () => {
+          const h = (0, _hapticUtils.resolveHaptic)(haptic, 'selection');
+          if (h) (0, _hapticUtils.triggerHaptic)(h);
+          onDismiss?.();
+        },
         hitSlop: 8,
         style: ({
           pressed
@@ -173,7 +179,11 @@ const Banner = exports.Banner = /*#__PURE__*/(0, _react.forwardRef)((props, ref)
         return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Pressable, {
           accessibilityRole: "button",
           accessibilityLabel: action.label,
-          onPress: action.onPress,
+          onPress: () => {
+            const h = (0, _hapticUtils.resolveHaptic)(haptic, 'selection');
+            if (h) (0, _hapticUtils.triggerHaptic)(h);
+            action.onPress();
+          },
           style: ({
             pressed
           }) => [styles.actionBtn, {

package/lib/commonjs/components/BottomNavigation/BottomNavigation.js

@@ -159,7 +159,7 @@ const BottomNavigation = exports.BottomNavigation = /*#__PURE__*/(0, _react.forw
             translateX: indicatorTranslateX
           }]
         }, indicatorStyle]
-      }) : null, tabs.map((tab, index) => {
+      }) : null, tabs.map(tab => {
         const isActive = tab.key === activeTab;
         const color = isActive ? theme.colors.primary : theme.colors.text.tertiary;
         const renderIcon = isActive && tab.activeIcon ? tab.activeIcon : tab.icon;

package/lib/commonjs/components/Card/Card.js

@@ -36,6 +36,7 @@ const Card = exports.Card = /*#__PURE__*/(0, _react.forwardRef)((props, ref) =>
     loading = false,
     gradient,
     onPress,
+    haptic,
     accessibilityLabel,
     accessibilityHint,
     accessibilityRole,
@@ -155,9 +156,8 @@ const Card = exports.Card = /*#__PURE__*/(0, _react.forwardRef)((props, ref) =>
   let rendered;
   if (isInteractive) {
     const handlePress = event => {
-      if (theme.components.card?.pressHaptic ?? false) {
-        (0, _hapticUtils.triggerHaptic)('selection');
-      }
+      const h = (0, _hapticUtils.resolveHaptic)(haptic, 'selection');
+      if (h) (0, _hapticUtils.triggerHaptic)(h);
       onPress?.(event);
     };
     rendered = /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Animated.View, {

package/lib/commonjs/components/Checkbox/Checkbox.js

@@ -40,7 +40,7 @@ const Checkbox = exports.Checkbox = /*#__PURE__*/(0, _react.forwardRef)((props,
     size = 'md',
     tone = 'primary',
     accessibilityLabel,
-    haptic = 'selection',
+    haptic,
     style,
     boxStyle,
     checkIconStyle,
@@ -80,7 +80,8 @@ const Checkbox = exports.Checkbox = /*#__PURE__*/(0, _react.forwardRef)((props,
   });
   const handlePress = event => {
     if (disabled) return;
-    if (haptic !== false && theme.components.checkbox?.pressHaptic) (0, _hapticUtils.triggerHaptic)(haptic);
+    const h = (0, _hapticUtils.resolveHaptic)(haptic, 'selection');
+    if (h) (0, _hapticUtils.triggerHaptic)(h);
     setCurrent(!current);
     rest.onPressOut?.(event);
   };

package/lib/commonjs/components/Chip/Chip.js

@@ -104,6 +104,7 @@ const Chip = exports.Chip = /*#__PURE__*/(0, _react.forwardRef)((props, ref) =>
     disabled = false,
     loading = false,
     accessibilityLabel,
+    haptic,
     style,
     textStyle,
     containerStyle,
@@ -150,12 +151,13 @@ const Chip = exports.Chip = /*#__PURE__*/(0, _react.forwardRef)((props, ref) =>
   const borderWidth = isFilled ? 0 : theme.colors.border.width;
   const handlePress = () => {
     if (!isPressable) return;
-    if (theme.components.chip?.pressHaptic) (0, _hapticUtils.triggerHaptic)('selection');
+    const h = (0, _hapticUtils.resolveHaptic)(haptic, 'selection');
+    if (h) (0, _hapticUtils.triggerHaptic)(h);
     onPress?.();
   };
   const handleClose = () => {
     if (disabled) return;
-    if (theme.components.chip?.closeHaptic) (0, _hapticUtils.triggerHaptic)('impactLight');
+    if (haptic !== false) (0, _hapticUtils.triggerHaptic)('impactLight');
     onClose?.();
   };
   const a11yLabel = accessibilityLabel ?? label;

package/lib/commonjs/components/Confetti/Confetti.js

@@ -0,0 +1,170 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = exports.Confetti = void 0;
+var _react = _interopRequireWildcard(require("react"));
+var _reactNative = require("react-native");
+var _reactNativeReanimated = _interopRequireWildcard(require("react-native-reanimated"));
+var _index = require("../../theme/index.js");
+var _index2 = require("../../hooks/index.js");
+var _jsxRuntime = require("react/jsx-runtime");
+function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
+const TAU = Math.PI * 2;
+const rand = (min, max) => min + Math.random() * (max - min);
+const buildPieces = (count, colors, mode, baseSize) => Array.from({
+  length: count
+}, (_, i) => {
+  const isCannon = mode === 'cannon';
+  return {
+    color: colors[i % colors.length] ?? colors[0],
+    size: baseSize * rand(0.6, 1.4),
+    isCircle: Math.random() < 0.35,
+    baseXFrac: isCannon ? 0.5 : Math.random(),
+    vxFrac: isCannon ? rand(-0.7, 0.7) : rand(-0.15, 0.15),
+    vy0Frac: isCannon ? rand(-1.5, -1.0) : rand(0, 0.15),
+    rotations: rand(1, 5),
+    rotateDir: Math.random() < 0.5 ? 1 : -1,
+    swayAmp: rand(8, 28),
+    swayFreq: rand(1, 3),
+    flutterFreq: rand(2, 5)
+  };
+});
+const ConfettiPiece = ({
+  piece,
+  progress,
+  width,
+  height,
+  originX,
+  originY,
+  mode,
+  fadeOut
+}) => {
+  const animStyle = (0, _reactNativeReanimated.useAnimatedStyle)(() => {
+    const t = progress.value;
+    const startX = mode === 'cannon' ? originX : piece.baseXFrac * width;
+    const startY = mode === 'cannon' ? originY : -piece.size * 2;
+    const gravity = height * (mode === 'cannon' ? 1.8 : 1.5);
+    const x = startX + piece.vxFrac * width * t + Math.sin(t * piece.swayFreq * TAU) * piece.swayAmp;
+    const y = startY + piece.vy0Frac * height * t + gravity * t * t;
+    const rotate = piece.rotateDir * piece.rotations * 360 * t;
+    // Paper-flutter: oscillate scaleX so pieces read as thin spinning paper.
+    const flutter = 0.35 + 0.65 * Math.abs(Math.cos(t * piece.flutterFreq * TAU));
+    const opacity = fadeOut ? Math.max(0, 1 - Math.max(0, t - 0.8) / 0.2) : 1;
+    return {
+      opacity,
+      transform: [{
+        translateX: x
+      }, {
+        translateY: y
+      }, {
+        rotate: `${rotate}deg`
+      }, {
+        scaleX: flutter
+      }]
+    };
+  });
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNativeReanimated.default.View, {
+    style: [{
+      position: 'absolute',
+      width: piece.size,
+      height: piece.isCircle ? piece.size : piece.size * 0.5,
+      borderRadius: piece.isCircle ? piece.size / 2 : 1,
+      backgroundColor: piece.color
+    }, animStyle]
+  });
+};
+const Confetti = exports.Confetti = /*#__PURE__*/(0, _react.forwardRef)(({
+  count = 80,
+  colors,
+  mode = 'rain',
+  origin,
+  duration = 2800,
+  fadeOut = true,
+  autoStart = false,
+  recycle = false,
+  size = 10,
+  onComplete,
+  style,
+  testID
+}, ref) => {
+  const theme = (0, _index.useTheme)();
+  const reduceMotion = (0, _index2.useReducedMotion)();
+  const window = (0, _reactNative.useWindowDimensions)();
+  const [layout, setLayout] = (0, _react.useState)({
+    width: window.width,
+    height: window.height
+  });
+  const [active, setActive] = (0, _react.useState)(false);
+  const [pieces, setPieces] = (0, _react.useState)([]);
+  const palette = (0, _react.useMemo)(() => colors ?? [theme.colors.primary, theme.colors.secondary, theme.colors.success, theme.colors.warning, theme.colors.error, theme.colors.info], [colors, theme.colors]);
+  const progress = (0, _reactNativeReanimated.useSharedValue)(0);
+  const finish = (0, _react.useCallback)(() => {
+    setActive(false);
+    onComplete?.();
+  }, [onComplete]);
+  const start = (0, _react.useCallback)(() => {
+    if (reduceMotion) {
+      onComplete?.();
+      return;
+    }
+    (0, _reactNativeReanimated.cancelAnimation)(progress);
+    progress.value = 0;
+    setPieces(buildPieces(count, palette, mode, size));
+    setActive(true);
+    const tween = (0, _reactNativeReanimated.withTiming)(1, {
+      duration,
+      easing: _reactNativeReanimated.Easing.linear
+    }, finished => {
+      'worklet';
+
+      if (finished && !recycle) (0, _reactNativeReanimated.runOnJS)(finish)();
+    });
+    progress.value = recycle ? (0, _reactNativeReanimated.withRepeat)(tween, -1, false) : tween;
+  }, [reduceMotion, progress, duration, recycle, finish, onComplete, count, palette, mode, size]);
+  const stop = (0, _react.useCallback)(() => {
+    (0, _reactNativeReanimated.cancelAnimation)(progress);
+    setActive(false);
+  }, [progress]);
+  (0, _react.useImperativeHandle)(ref, () => ({
+    start,
+    stop
+  }), [start, stop]);
+  (0, _react.useEffect)(() => {
+    if (autoStart) start();
+    return () => (0, _reactNativeReanimated.cancelAnimation)(progress);
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, []);
+  const onLayout = (0, _react.useCallback)(e => {
+    const {
+      width,
+      height
+    } = e.nativeEvent.layout;
+    if (width > 0 && height > 0) setLayout({
+      width,
+      height
+    });
+  }, []);
+  const originX = origin?.x ?? layout.width / 2;
+  const originY = origin?.y ?? layout.height;
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
+    style: [_reactNative.StyleSheet.absoluteFill, style],
+    pointerEvents: "none",
+    onLayout: onLayout,
+    testID: testID,
+    children: active ? pieces.map((piece, i) => /*#__PURE__*/(0, _jsxRuntime.jsx)(ConfettiPiece, {
+      piece: piece,
+      progress: progress,
+      width: layout.width,
+      height: layout.height,
+      originX: originX,
+      originY: originY,
+      mode: mode,
+      fadeOut: fadeOut
+    }, i)) : null
+  });
+});
+Confetti.displayName = 'Confetti';
+var _default = exports.default = Confetti;
+//# sourceMappingURL=Confetti.js.map