@webority/mobile-ui 0.0.39 → 0.2.0

package/lib/module/components/Stepper/index.js

@@ -1,4 +1 @@
-"use strict";
-
-export { default, Stepper } from "./Stepper.js";
-//# sourceMappingURL=index.js.map
+"use strict";export{default,Stepper}from"./Stepper.js";

package/lib/module/components/Swipeable/Swipeable.js

@@ -1,378 +1 @@
-"use strict";
-
-/**
- * Swipeable — Reanimated 3 + Gesture Handler 2 implementation.
- *
- * Wraps any content and reveals contextual actions when the user
- * swipes left or right. Past `fullSwipeThreshold`, the first action
- * fires automatically and the content slides off-screen.
- *
- * USAGE:
- *
- * <Swipeable
- *   leftActions={[{ key: 'archive', label: 'Archive', tone: 'success', onPress: handleArchive }]}
- *   rightActions={[{ key: 'delete', label: 'Delete', tone: 'error', onPress: handleDelete }]}
- * >
- *   <ListItem title="Inbox item" />
- * </Swipeable>
- */
-
-import React, { useCallback, useEffect, useMemo, useRef } from 'react';
-import { Dimensions, Pressable, StyleSheet, Text, View } from 'react-native';
-import { Gesture, GestureDetector } from 'react-native-gesture-handler';
-import Animated, { cancelAnimation, runOnJS, useAnimatedStyle, useSharedValue, withSpring } from 'react-native-reanimated';
-import { useTheme } from "../../theme/index.js";
-import { resolveHaptic, triggerHaptic } from "../../utils/index.js";
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-const SPRING_CONFIG = {
-  damping: 22,
-  stiffness: 260,
-  mass: 1
-};
-const DRAG_ACTIVATION_OFFSET = 10;
-const RUBBER_BAND_FACTOR = 0.35;
-const FAIL_OFFSET_Y = 15;
-const toneToBg = (theme, tone) => {
-  switch (tone) {
-    case 'primary':
-      return theme.colors.primary;
-    case 'success':
-      return theme.colors.success;
-    case 'warning':
-      return theme.colors.warning;
-    case 'error':
-      return theme.colors.error;
-    case 'neutral':
-    default:
-      return theme.colors.secondary;
-  }
-};
-const Swipeable = props => {
-  const {
-    children,
-    leftActions,
-    rightActions,
-    threshold: thresholdProp,
-    fullSwipeThreshold: fullSwipeThresholdProp,
-    onSwipeOpen,
-    onSwipeClose,
-    disabled = false,
-    haptic,
-    containerStyle,
-    contentStyle: contentSlotStyle,
-    actionStyle,
-    accessibilityLabel,
-    testID
-  } = props;
-  const theme = useTheme();
-  const swipeTheme = theme.components.swipeable;
-  const threshold = thresholdProp ?? swipeTheme?.threshold ?? 80;
-  const fullSwipeThreshold = fullSwipeThresholdProp ?? swipeTheme?.fullSwipeThreshold ?? 200;
-  const dragActivationOffset = swipeTheme?.dragActivationOffset ?? DRAG_ACTIVATION_OFFSET;
-  const rubberBandFactor = swipeTheme?.rubberBandFactor ?? RUBBER_BAND_FACTOR;
-  const failOffsetY = swipeTheme?.failOffsetY ?? FAIL_OFFSET_Y;
-  const springConfig = useMemo(() => ({
-    damping: swipeTheme?.springDamping ?? SPRING_CONFIG.damping,
-    stiffness: swipeTheme?.springStiffness ?? SPRING_CONFIG.stiffness,
-    mass: swipeTheme?.springMass ?? SPRING_CONFIG.mass
-  }), [swipeTheme]);
-  const styles = useMemo(() => buildStyles(theme), [theme]);
-  const hasLeft = !!leftActions && leftActions.length > 0;
-  const hasRight = !!rightActions && rightActions.length > 0;
-  const screenWidth = Dimensions.get('window').width;
-
-  // Per-side total reveal width; each individual action is totalRevealWidth / actions.length.
-  const leftRevealWidth = hasLeft ? threshold * (leftActions?.length ?? 0) : 0;
-  const rightRevealWidth = hasRight ? threshold * (rightActions?.length ?? 0) : 0;
-
-  // translateX: 0 = closed, +leftRevealWidth = left actions revealed, -rightRevealWidth = right actions revealed.
-  const translateX = useSharedValue(0);
-  const dragStartX = useSharedValue(0);
-
-  // Mirror "is currently open + which side" on JS so we can debounce onSwipeOpen/onSwipeClose callbacks.
-  const openSideRef = useRef(null);
-
-  // ───────── Animation cleanup on unmount ─────────
-  useEffect(() => {
-    return () => {
-      cancelAnimation(translateX);
-      cancelAnimation(dragStartX);
-    };
-  }, [translateX, dragStartX]);
-
-  // ───────── JS-thread callbacks invoked from worklets ─────────
-  const notifyOpen = useCallback(side => {
-    if (openSideRef.current === side) {
-      return;
-    }
-    openSideRef.current = side;
-    onSwipeOpen?.(side);
-  }, [onSwipeOpen]);
-  const notifyClose = useCallback(() => {
-    if (openSideRef.current === null) {
-      return;
-    }
-    openSideRef.current = null;
-    onSwipeClose?.();
-  }, [onSwipeClose]);
-  const fireFirstAction = useCallback(side => {
-    const list = side === 'left' ? leftActions : rightActions;
-    const first = list?.[0];
-    // Structurally unreachable, not a bug guard: both call sites below are
-    // gated on allowLeft/allowRight (== hasLeft/hasRight), which is exactly
-    // "list has at least one element". Kept for type narrowing on `first`.
-    if (!first) {
-      return;
-    }
-    if (haptic !== false) {
-      triggerHaptic('notificationSuccess');
-    }
-    first.onPress();
-    // After the off-screen slide, snap back to 0 silently.
-    translateX.value = withSpring(0, springConfig);
-    openSideRef.current = null;
-    onSwipeClose?.();
-  }, [leftActions, rightActions, translateX, onSwipeClose, springConfig, haptic]);
-  const close = useCallback(() => {
-    translateX.value = withSpring(0, springConfig);
-    notifyClose();
-  }, [translateX, notifyClose, springConfig]);
-  const handleActionPress = useCallback(action => {
-    const h = resolveHaptic(haptic, 'selection');
-    if (h) {
-      triggerHaptic(h);
-    }
-    action.onPress();
-    close();
-  }, [close, haptic]);
-
-  // ───────── Pan gesture (UI thread) ─────────
-  const panGesture = useMemo(() => {
-    const leftCap = leftRevealWidth;
-    const rightCap = rightRevealWidth;
-    const fullSwipeLeft = fullSwipeThreshold; // positive when swiping right→reveal left
-    const fullSwipeRight = -fullSwipeThreshold; // negative when swiping left→reveal right
-    const offScreenLeft = screenWidth;
-    const offScreenRight = -screenWidth;
-    const openThreshold = threshold;
-    const allowLeft = hasLeft;
-    const allowRight = hasRight;
-    return Gesture.Pan().enabled(!disabled).withTestId(testID ? `${testID}-gesture` : 'swipeable-gesture').activeOffsetX([-dragActivationOffset, dragActivationOffset]).failOffsetY([-failOffsetY, failOffsetY]).onStart(() => {
-      'worklet';
-
-      dragStartX.value = translateX.value;
-    }).onUpdate(event => {
-      'worklet';
-
-      const next = dragStartX.value + event.translationX;
-      // Disallow swipe in directions with no actions configured.
-      if (next > 0 && !allowLeft) {
-        translateX.value = 0;
-        return;
-      }
-      if (next < 0 && !allowRight) {
-        translateX.value = 0;
-        return;
-      }
-      // Rubber-band past the open position so it still feels physical past the cap.
-      if (next > leftCap && allowLeft) {
-        translateX.value = leftCap + (next - leftCap) * rubberBandFactor;
-      } else if (next < -rightCap && allowRight) {
-        translateX.value = -rightCap + (next + rightCap) * rubberBandFactor;
-      } else {
-        translateX.value = next;
-      }
-    }).onEnd(() => {
-      'worklet';
-
-      const releaseX = translateX.value;
-
-      // Past full-swipe threshold on either side → fire first action and slide off-screen.
-      if (allowLeft && releaseX >= fullSwipeLeft) {
-        translateX.value = withSpring(offScreenLeft, SPRING_CONFIG);
-        runOnJS(fireFirstAction)('left');
-        return;
-      }
-      if (allowRight && releaseX <= fullSwipeRight) {
-        translateX.value = withSpring(offScreenRight, SPRING_CONFIG);
-        runOnJS(fireFirstAction)('right');
-        return;
-      }
-
-      // Past open threshold → spring to open position.
-      if (allowLeft && releaseX >= openThreshold) {
-        translateX.value = withSpring(leftCap, SPRING_CONFIG);
-        runOnJS(notifyOpen)('left');
-        return;
-      }
-      if (allowRight && releaseX <= -openThreshold) {
-        translateX.value = withSpring(-rightCap, SPRING_CONFIG);
-        runOnJS(notifyOpen)('right');
-        return;
-      }
-
-      // Otherwise → spring back closed.
-      translateX.value = withSpring(0, springConfig);
-      runOnJS(notifyClose)();
-    });
-  }, [disabled, dragStartX, fireFirstAction, fullSwipeThreshold, hasLeft, hasRight, leftRevealWidth, notifyClose, notifyOpen, rightRevealWidth, screenWidth, threshold, translateX, dragActivationOffset, failOffsetY, rubberBandFactor, springConfig, testID]);
-
-  // ───────── Animated styles ─────────
-  const contentStyle = useAnimatedStyle(() => ({
-    transform: [{
-      translateX: translateX.value
-    }]
-  }));
-
-  // Each side fades in proportionally to how much it's been revealed.
-  const leftBgStyle = useAnimatedStyle(() => ({
-    opacity: leftRevealWidth > 0 ? Math.min(1, Math.max(0, translateX.value / leftRevealWidth)) : 0
-  }));
-  const rightBgStyle = useAnimatedStyle(() => ({
-    opacity: rightRevealWidth > 0 ? Math.min(1, Math.max(0, -translateX.value / rightRevealWidth)) : 0
-  }));
-
-  // ───────── A11y actions (so AT users don't need to swipe) ─────────
-  const a11yActions = useMemo(() => {
-    const out = [];
-    leftActions?.forEach(a => out.push({
-      name: a.key,
-      label: a.label
-    }));
-    rightActions?.forEach(a => out.push({
-      name: a.key,
-      label: a.label
-    }));
-    return out;
-  }, [leftActions, rightActions]);
-  const handleA11yAction = useCallback(event => {
-    const name = event.nativeEvent.actionName;
-    const all = [...(leftActions ?? []), ...(rightActions ?? [])];
-    const match = all.find(a => a.key === name);
-    if (match) {
-      if (haptic !== false) {
-        triggerHaptic('selection');
-      }
-      match.onPress();
-    }
-  }, [leftActions, rightActions, haptic]);
-
-  // ───────── Render ─────────
-  // No actions configured → render children directly; zero gesture overhead.
-  if (!hasLeft && !hasRight) {
-    // testID must survive this shortcut too — a consumer targeting a Swipeable
-    // with no actions configured would otherwise find nothing.
-    return /*#__PURE__*/_jsx(View, {
-      style: containerStyle,
-      testID: testID,
-      children: children
-    });
-  }
-  return /*#__PURE__*/_jsxs(View, {
-    style: [styles.root, containerStyle],
-    testID: testID,
-    accessibilityLabel: accessibilityLabel,
-    accessibilityActions: a11yActions,
-    onAccessibilityAction: handleA11yAction,
-    children: [hasLeft ? /*#__PURE__*/_jsx(Animated.View, {
-      style: [styles.actionsRow, styles.actionsLeft, {
-        width: leftRevealWidth
-      }, actionStyle, leftBgStyle],
-      pointerEvents: "box-none",
-      children: leftActions?.map(action => /*#__PURE__*/_jsx(ActionButton, {
-        action: action,
-        theme: theme,
-        width: threshold,
-        onPress: handleActionPress
-      }, action.key))
-    }) : null, hasRight ? /*#__PURE__*/_jsx(Animated.View, {
-      style: [styles.actionsRow, styles.actionsRight, {
-        width: rightRevealWidth
-      }, actionStyle, rightBgStyle],
-      pointerEvents: "box-none",
-      children: rightActions?.map(action => /*#__PURE__*/_jsx(ActionButton, {
-        action: action,
-        theme: theme,
-        width: threshold,
-        onPress: handleActionPress
-      }, action.key))
-    }) : null, /*#__PURE__*/_jsx(GestureDetector, {
-      gesture: panGesture,
-      children: /*#__PURE__*/_jsx(Animated.View, {
-        style: [styles.content, contentSlotStyle, contentStyle],
-        children: children
-      })
-    })]
-  });
-};
-Swipeable.displayName = 'Swipeable';
-const ActionButton = ({
-  action,
-  theme,
-  width,
-  onPress
-}) => {
-  const tone = action.tone ?? 'neutral';
-  const bg = toneToBg(theme, tone);
-  return /*#__PURE__*/_jsxs(Pressable, {
-    onPress: () => onPress(action),
-    accessibilityRole: "button",
-    accessibilityLabel: action.label,
-    style: [actionStyles.button, {
-      width,
-      backgroundColor: bg,
-      paddingHorizontal: theme.spacing.sm
-    }],
-    children: [action.icon ? /*#__PURE__*/_jsx(View, {
-      style: actionStyles.icon,
-      children: action.icon
-    }) : null, /*#__PURE__*/_jsx(Text, {
-      style: [actionStyles.label, {
-        color: theme.colors.text.inverse,
-        fontSize: theme.typography.fontSize.sm,
-        fontWeight: theme.typography.fontWeight.semibold
-      }],
-      numberOfLines: 1,
-      children: action.label
-    })]
-  });
-};
-const actionStyles = StyleSheet.create({
-  button: {
-    flexGrow: 0,
-    flexShrink: 0,
-    alignItems: 'center',
-    justifyContent: 'center'
-  },
-  icon: {
-    marginBottom: 2
-  },
-  label: {
-    textAlign: 'center'
-  }
-});
-const buildStyles = _theme => StyleSheet.create({
-  root: {
-    position: 'relative',
-    overflow: 'hidden'
-  },
-  content: {
-    backgroundColor: 'transparent'
-  },
-  actionsRow: {
-    position: 'absolute',
-    top: 0,
-    bottom: 0,
-    flexDirection: 'row'
-  },
-  actionsLeft: {
-    left: 0
-  },
-  actionsRight: {
-    right: 0,
-    justifyContent: 'flex-end'
-  }
-});
-export { Swipeable };
-export default Swipeable;
-//# sourceMappingURL=Swipeable.js.map
+"use strict";import React,{useCallback,useEffect,useMemo,useRef}from"react";import{Dimensions,Pressable,StyleSheet,Text,View}from"react-native";import{Gesture,GestureDetector}from"react-native-gesture-handler";import Animated,{cancelAnimation,runOnJS,useAnimatedStyle,useSharedValue,withSpring}from"react-native-reanimated";import{useTheme}from"../../theme/index.js";import{resolveHaptic,triggerHaptic}from"../../utils/index.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const SPRING_CONFIG={damping:22,stiffness:260,mass:1},DRAG_ACTIVATION_OFFSET=10,RUBBER_BAND_FACTOR=.35,FAIL_OFFSET_Y=15,toneToBg=(e,t)=>{switch(t){case"primary":return e.colors.primary;case"success":return e.colors.success;case"warning":return e.colors.warning;case"error":return e.colors.error;default:return e.colors.secondary}},toneToOnColor=(e,t)=>{switch(t){case"primary":return e.colors.onPrimary;case"success":return e.colors.onSuccess;case"warning":return e.colors.onWarning;case"error":return e.colors.onError;default:return e.colors.onSecondary}},Swipeable=e=>{const{children:t,leftActions:n,rightActions:s,threshold:i,fullSwipeThreshold:r,onSwipeOpen:o,onSwipeClose:a,disabled:l=!1,haptic:c,containerStyle:u,contentStyle:h,actionStyle:m,accessibilityLabel:d,testID:p}=e,S=useTheme(),f=S.components.swipeable,g=i??f?.threshold??80,b=r??f?.fullSwipeThreshold??200,w=f?.dragActivationOffset??10,y=f?.rubberBandFactor??.35,v=f?.failOffsetY??15,x=useMemo(()=>({damping:f?.springDamping??SPRING_CONFIG.damping,stiffness:f?.springStiffness??SPRING_CONFIG.stiffness,mass:f?.springMass??SPRING_CONFIG.mass}),[f]),A=useMemo(()=>buildStyles(S),[S]),_=!!n&&n.length>0,O=!!s&&s.length>0,C=Dimensions.get("window").width,I=_?g*(n?.length??0):0,G=O?g*(s?.length??0):0,R=useSharedValue(0),j=useSharedValue(0),N=useRef(null);useEffect(()=>()=>{cancelAnimation(R),cancelAnimation(j)},[R,j]);const P=useCallback(e=>{N.current!==e&&(N.current=e,o?.(e))},[o]),k=useCallback(()=>{null!==N.current&&(N.current=null,a?.())},[a]),T=useCallback(e=>{const t="left"===e?n:s,i=t?.[0];i&&(!1!==c&&triggerHaptic("notificationSuccess"),i.onPress(),R.value=withSpring(0,x),N.current=null,a?.())},[n,s,R,a,x,c]),F=useCallback(()=>{R.value=withSpring(0,x),k()},[R,k,x]),E=useCallback(e=>{const t=resolveHaptic(c,"selection");t&&triggerHaptic(t),e.onPress(),F()},[F,c]),D=useMemo(()=>{const e=I,t=G,n=b,s=-b,i=C,r=-C,o=g,a=_,c=O;return Gesture.Pan().enabled(!l).withTestId(p?`${p}-gesture`:"swipeable-gesture").activeOffsetX([-w,w]).failOffsetY([-v,v]).onStart(()=>{"worklet";j.value=R.value}).onUpdate(n=>{"worklet";const s=j.value+n.translationX;R.value=s>0&&!a||s<0&&!c?0:s>e&&a?e+(s-e)*y:s<-t&&c?(s+t)*y-t:s}).onEnd(()=>{"worklet";const l=R.value;return a&&l>=n?(R.value=withSpring(i,SPRING_CONFIG),void runOnJS(T)("left")):c&&l<=s?(R.value=withSpring(r,SPRING_CONFIG),void runOnJS(T)("right")):a&&l>=o?(R.value=withSpring(e,SPRING_CONFIG),void runOnJS(P)("left")):c&&l<=-o?(R.value=withSpring(-t,SPRING_CONFIG),void runOnJS(P)("right")):(R.value=withSpring(0,x),void runOnJS(k)())})},[l,j,T,b,_,O,I,k,P,G,C,g,R,w,v,y,x,p]),V=useAnimatedStyle(()=>({transform:[{translateX:R.value}]})),B=useAnimatedStyle(()=>({opacity:I>0?Math.min(1,Math.max(0,R.value/I)):0})),M=useAnimatedStyle(()=>({opacity:G>0?Math.min(1,Math.max(0,-R.value/G)):0})),H=useMemo(()=>{const e=[];return n?.forEach(t=>e.push({name:t.key,label:t.label})),s?.forEach(t=>e.push({name:t.key,label:t.label})),e},[n,s]),L=useCallback(e=>{const t=e.nativeEvent.actionName,i=[...n??[],...s??[]].find(e=>e.key===t);i&&(!1!==c&&triggerHaptic("selection"),i.onPress())},[n,s,c]);return _||O?_jsxs(View,{style:[A.root,u],testID:p,accessibilityLabel:d,accessibilityActions:H,onAccessibilityAction:L,children:[_?_jsx(Animated.View,{style:[A.actionsRow,A.actionsLeft,{width:I},m,B],pointerEvents:"box-none",children:n?.map(e=>_jsx(ActionButton,{action:e,theme:S,width:g,onPress:E},e.key))}):null,O?_jsx(Animated.View,{style:[A.actionsRow,A.actionsRight,{width:G},m,M],pointerEvents:"box-none",children:s?.map(e=>_jsx(ActionButton,{action:e,theme:S,width:g,onPress:E},e.key))}):null,_jsx(GestureDetector,{gesture:D,children:_jsx(Animated.View,{style:[A.content,h,V],children:t})})]}):_jsx(View,{style:u,testID:p,children:t})};Swipeable.displayName="Swipeable";const ActionButton=({action:e,theme:t,width:n,onPress:s})=>{const i=e.tone??"neutral",r=toneToBg(t,i);return _jsxs(Pressable,{onPress:()=>s(e),accessibilityRole:"button",accessibilityLabel:e.label,style:[actionStyles.button,{width:n,backgroundColor:r,paddingHorizontal:t.spacing.sm}],children:[e.icon?_jsx(View,{style:actionStyles.icon,children:e.icon}):null,_jsx(Text,{style:[actionStyles.label,{color:toneToOnColor(t,i),fontSize:t.typography.fontSize.sm,fontWeight:t.typography.fontWeight.semibold}],numberOfLines:1,children:e.label})]})},actionStyles=StyleSheet.create({button:{flexGrow:0,flexShrink:0,alignItems:"center",justifyContent:"center"},icon:{marginBottom:2},label:{textAlign:"center"}}),buildStyles=e=>StyleSheet.create({root:{position:"relative",overflow:"hidden"},content:{backgroundColor:"transparent"},actionsRow:{position:"absolute",top:0,bottom:0,flexDirection:"row"},actionsLeft:{left:0},actionsRight:{right:0,justifyContent:"flex-end"}});export{Swipeable};export default Swipeable;

package/lib/module/components/Swipeable/index.js

@@ -1,4 +1 @@
-"use strict";
-
-export { default, Swipeable } from "./Swipeable.js";
-//# sourceMappingURL=index.js.map
+"use strict";export{default,Swipeable}from"./Swipeable.js";

package/lib/module/components/Switch/Switch.js

@@ -1,230 +1 @@
-"use strict";
-
-import { forwardRef, useEffect, useMemo, useRef } from 'react';
-import { Animated, Easing, Pressable, StyleSheet, Text, View } from 'react-native';
-import { useControllableState } from "../../hooks/index.js";
-import { createAnimatedValue, useTheme } from "../../theme/index.js";
-import { smoothCorners } from "../../utils/corners.js";
-import { triggerHaptic } from "../../utils/hapticUtils.js";
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-const sizeMap = {
-  sm: {
-    trackWidth: 42,
-    trackHeight: 26,
-    thumbSize: 22,
-    padding: 2
-  },
-  md: {
-    trackWidth: 51,
-    trackHeight: 31,
-    thumbSize: 27,
-    padding: 2
-  },
-  lg: {
-    trackWidth: 60,
-    trackHeight: 36,
-    thumbSize: 32,
-    padding: 2
-  }
-};
-const toneColor = (theme, tone) => {
-  switch (tone) {
-    case 'success':
-      return theme.colors.success;
-    case 'warning':
-      return theme.colors.warning;
-    case 'error':
-      return theme.colors.error;
-    case 'primary':
-    default:
-      return theme.colors.primary;
-  }
-};
-const Switch = /*#__PURE__*/forwardRef((props, ref) => {
-  const {
-    value,
-    defaultValue,
-    onChange,
-    disabled = false,
-    size = 'md',
-    tone = 'primary',
-    label,
-    accessibilityLabel,
-    haptic = 'selection',
-    bounce = false,
-    style,
-    containerStyle,
-    trackStyle,
-    thumbStyle,
-    testID,
-    ...rest
-  } = props;
-  const [current, setCurrent] = useControllableState({
-    value,
-    defaultValue: defaultValue ?? false,
-    onChange
-  });
-  const theme = useTheme();
-  const sizeStyles = {
-    ...sizeMap[size],
-    ...(theme.components.switch?.[size] ?? {})
-  };
-  const switchThumbColor = theme.components.switch?.thumbColor ?? '#FFFFFF';
-  const styles = useMemo(() => buildStyles(theme), [theme]);
-  const offTrackColor = theme.mode === 'dark' ? theme.colors.secondary : theme.colors.surface.disabled;
-  const onTrackColor = toneColor(theme, tone);
-  const progress = useRef(createAnimatedValue(current ? 1 : 0)).current;
-  useEffect(() => {
-    const anim = Animated.spring(progress, {
-      toValue: current ? 1 : 0,
-      damping: theme.motion.spring.snappy.damping,
-      stiffness: theme.motion.spring.snappy.stiffness,
-      mass: theme.motion.spring.snappy.mass,
-      useNativeDriver: true
-    });
-    anim.start();
-    return () => anim.stop();
-  }, [current, progress, theme.motion.spring.snappy]);
-  const trackBgAnim = useRef(createAnimatedValue(current ? 1 : 0)).current;
-  useEffect(() => {
-    const anim = Animated.timing(trackBgAnim, {
-      toValue: current ? 1 : 0,
-      duration: theme.motion.duration.fast,
-      easing: Easing.out(Easing.ease),
-      useNativeDriver: false
-    });
-    anim.start();
-    return () => anim.stop();
-  }, [current, trackBgAnim, theme.motion.duration.fast]);
-  const offX = sizeStyles.padding;
-  const onX = sizeStyles.trackWidth - sizeStyles.thumbSize - sizeStyles.padding;
-  const translateX = progress.interpolate({
-    inputRange: [0, 1],
-    outputRange: [offX, onX]
-  });
-  const trackBg = trackBgAnim.interpolate({
-    inputRange: [0, 1],
-    outputRange: [offTrackColor, onTrackColor]
-  });
-  const bounceScale = useRef(createAnimatedValue(1)).current;
-  const isFirstRender = useRef(true);
-  // biome-ignore lint/correctness/useExhaustiveDependencies: `current` is the TRIGGER, not a read: the bounce must fire when the value toggles. Biome sees it unused in the body; removing it would silently kill the animation
-  useEffect(() => {
-    if (!bounce) {
-      return;
-    }
-    if (isFirstRender.current) {
-      isFirstRender.current = false;
-      return;
-    }
-    const anim = Animated.sequence([Animated.spring(bounceScale, {
-      toValue: 1.15,
-      damping: 10,
-      stiffness: 220,
-      mass: 1,
-      useNativeDriver: true
-    }), Animated.spring(bounceScale, {
-      toValue: 1,
-      damping: 14,
-      stiffness: 240,
-      mass: 1,
-      useNativeDriver: true
-    })]);
-    anim.start();
-    return () => anim.stop();
-  }, [current, bounce, bounceScale]);
-  const handlePress = event => {
-    if (disabled) {
-      return;
-    }
-    if (haptic !== false) {
-      triggerHaptic(haptic);
-    }
-    setCurrent(!current);
-    rest.onPressOut?.(event);
-  };
-  const accessibleLabel = accessibilityLabel ?? label;
-  const switchEl = /*#__PURE__*/_jsx(Pressable, {
-    ref: ref,
-    onPress: handlePress,
-    disabled: disabled,
-    accessibilityRole: "switch",
-    accessibilityLabel: accessibleLabel,
-    accessibilityState: {
-      checked: current,
-      disabled
-    },
-    testID: testID,
-    hitSlop: 8,
-    ...rest,
-    style: ({
-      pressed
-    }) => [{
-      opacity: disabled ? 0.55 : pressed ? 0.9 : 1
-    }, label ? null : style],
-    children: /*#__PURE__*/_jsx(Animated.View, {
-      style: [styles.track, {
-        width: sizeStyles.trackWidth,
-        height: sizeStyles.trackHeight,
-        borderRadius: sizeStyles.trackHeight / 2,
-        ...smoothCorners,
-        backgroundColor: trackBg
-      }, trackStyle],
-      children: /*#__PURE__*/_jsx(Animated.View, {
-        style: [styles.thumb, theme.shadows.sm, {
-          backgroundColor: switchThumbColor,
-          width: sizeStyles.thumbSize,
-          height: sizeStyles.thumbSize,
-          borderRadius: sizeStyles.thumbSize / 2,
-          ...smoothCorners,
-          transform: [{
-            translateX
-          }, {
-            scale: bounceScale
-          }]
-        }, thumbStyle]
-      })
-    })
-  });
-  if (!label) {
-    if (!containerStyle) {
-      return switchEl;
-    }
-    return /*#__PURE__*/_jsx(View, {
-      style: containerStyle,
-      children: switchEl
-    });
-  }
-  return /*#__PURE__*/_jsxs(View, {
-    style: [styles.row, containerStyle, style],
-    children: [switchEl, /*#__PURE__*/_jsx(Text, {
-      style: [styles.label, {
-        color: disabled ? theme.colors.text.disabled : theme.colors.text.primary,
-        fontSize: theme.typography.fontSize.base
-      }],
-      numberOfLines: 1,
-      children: label
-    })]
-  });
-});
-Switch.displayName = 'Switch';
-const buildStyles = _theme => StyleSheet.create({
-  row: {
-    flexDirection: 'row',
-    alignItems: 'center'
-  },
-  track: {
-    justifyContent: 'center'
-  },
-  thumb: {
-    position: 'absolute',
-    top: 2
-  },
-  label: {
-    marginLeft: 10,
-    flexShrink: 1
-  }
-});
-export { Switch };
-export default Switch;
-//# sourceMappingURL=Switch.js.map
+"use strict";import{forwardRef,useEffect,useMemo,useRef}from"react";import{Animated,Easing,Pressable,StyleSheet,View}from"react-native";import{useControllableState}from"../../hooks/index.js";import{createAnimatedValue,useTheme}from"../../theme/index.js";import{smoothCorners}from"../../utils/corners.js";import{triggerHaptic}from"../../utils/hapticUtils.js";import{ChoiceText,hasChoiceDetail}from"../FieldBase/ChoiceText.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const sizeMap={sm:{trackWidth:42,trackHeight:26,thumbSize:22,padding:2},md:{trackWidth:51,trackHeight:31,thumbSize:27,padding:2},lg:{trackWidth:60,trackHeight:36,thumbSize:32,padding:2}},toneColor=(e,t)=>{switch(t){case"success":return e.colors.success;case"warning":return e.colors.warning;case"error":return e.colors.error;default:return e.colors.primary}},Switch=forwardRef((e,t)=>{const{value:s,defaultValue:i,onChange:r,disabled:a=!1,size:o="md",tone:n="primary",label:c,description:l,error:d,labelLines:u,layout:m="inline",accessibilityLabel:p,haptic:h="selection",bounce:b=!1,style:f,containerStyle:g,trackStyle:y,thumbStyle:w,testID:x,...S}=e,[C,j]=useControllableState({value:s,defaultValue:i??!1,onChange:r}),k=useTheme(),R={...sizeMap[o],...k.components.switch?.[o]??{}},v=k.components.switch?.thumbColor??"#FFFFFF",V=useMemo(()=>buildStyles(k),[k]),A="dark"===k.mode?k.colors.secondary:k.colors.surface.disabled,D=toneColor(k,n),H=useRef(createAnimatedValue(C?1:0)).current;useEffect(()=>{const e=Animated.spring(H,{toValue:C?1:0,damping:k.motion.spring.snappy.damping,stiffness:k.motion.spring.snappy.stiffness,mass:k.motion.spring.snappy.mass,useNativeDriver:!0});return e.start(),()=>e.stop()},[C,H,k.motion.spring.snappy]);const T=useRef(createAnimatedValue(C?1:0)).current;useEffect(()=>{const e=Animated.timing(T,{toValue:C?1:0,duration:k.motion.duration.fast,easing:Easing.out(Easing.ease),useNativeDriver:!1});return e.start(),()=>e.stop()},[C,T,k.motion.duration.fast]);const z=R.padding,_=R.trackWidth-R.thumbSize-R.padding,L=H.interpolate({inputRange:[0,1],outputRange:[z,_]}),E=T.interpolate({inputRange:[0,1],outputRange:[A,D]}),F=useRef(createAnimatedValue(1)).current,P=useRef(!0);useEffect(()=>{if(!b)return;if(P.current)return void(P.current=!1);const e=Animated.sequence([Animated.spring(F,{toValue:1.15,damping:10,stiffness:220,mass:1,useNativeDriver:!0}),Animated.spring(F,{toValue:1,damping:14,stiffness:240,mass:1,useNativeDriver:!0})]);return e.start(),()=>e.stop()},[C,b,F]);const handlePress=e=>{a||(!1!==h&&triggerHaptic(h),j(!C),S.onPressOut?.(e))},I=p??c,N=Boolean(c)||hasChoiceDetail(l,d),W="row"===m&&N,M=_jsx(Animated.View,{style:[V.track,{width:R.trackWidth,height:R.trackHeight,borderRadius:R.trackHeight/2,...smoothCorners,backgroundColor:E},y],children:_jsx(Animated.View,{style:[V.thumb,k.shadows.sm,{backgroundColor:v,width:R.thumbSize,height:R.thumbSize,borderRadius:R.thumbSize/2,...smoothCorners,transform:[{translateX:L},{scale:F}]},w]})});if(W)return _jsxs(Pressable,{ref:t,onPress:handlePress,disabled:a,accessibilityRole:"switch",accessibilityLabel:I,accessibilityHint:S.accessibilityHint??l,accessibilityState:{checked:C,disabled:a},testID:x,...S,style:({pressed:e})=>[V.row,V.spreadRow,hasChoiceDetail(l,d)?V.rowTop:null,{opacity:a?.55:e?.9:1},g,f],children:[_jsx(ChoiceText,{label:c,description:l,error:d,disabled:a,labelLines:u||void 0,descriptionLines:u||void 0,style:V.spreadText}),M]});const B=_jsx(Pressable,{ref:t,onPress:handlePress,disabled:a,accessibilityRole:"switch",accessibilityLabel:I,accessibilityHint:S.accessibilityHint??l,accessibilityState:{checked:C,disabled:a},testID:x,hitSlop:8,...S,style:({pressed:e})=>[{opacity:a?.55:e?.9:1},N?null:f],children:M});return N?_jsxs(View,{style:[V.row,hasChoiceDetail(l,d)?V.rowTop:null,g,f],children:[B,_jsx(ChoiceText,{label:c,description:l,error:d,disabled:a,labelLines:u||void 0,descriptionLines:u||void 0,style:V.text})]}):g?_jsx(View,{style:g,children:B}):B});Switch.displayName="Switch";const buildStyles=e=>StyleSheet.create({row:{flexDirection:"row",alignItems:"center"},track:{justifyContent:"center"},thumb:{position:"absolute",top:2},rowTop:{alignItems:"flex-start"},text:{marginLeft:10},spreadRow:{minHeight:44,justifyContent:"space-between"},spreadText:{flex:1,marginRight:12}});export{Switch};export default Switch;

package/lib/module/components/Switch/index.js

@@ -1,4 +1 @@
-"use strict";
-
-export { default, Switch } from "./Switch.js";
-//# sourceMappingURL=index.js.map
+"use strict";export{default,Switch}from"./Switch.js";