@webority/mobile-ui 0.8.1 → 0.9.0

package/lib/module/components/Skeleton/Skeleton.js

@@ -1 +1 @@
-"use strict";import React,{useMemo,useState}from"react";import{Animated,StyleSheet,View}from"react-native";import{useTheme}from"../../theme/index.js";import{toBackgroundImage}from"../../theme/Gradient.js";import{useScreenDimensions}from"../../utils/index.js";import{smoothCorners}from"../../utils/corners.js";import{useSkeletonClock}from"./SkeletonClock.js";import{useSkeletonDefaults}from"./SkeletonProvider.js";import{jsx as _jsx}from"react/jsx-runtime";const resolveRadius=(e,t)=>"number"==typeof t?t:e.radius[t],resolveWidth=e=>void 0===e?"100%":e,radiusForShape=(e,t,s,o,i)=>{if(void 0!==i)return resolveRadius(e,i);switch(t){case"circle":return"number"==typeof s?Math.min(s,o)/2:o/2;case"rounded":return e.radius.md;default:return e.radius.sm}},Skeleton=({shape:e="rect",width:t="100%",height:s=16,radius:o,variant:i,speed:r,colors:n,style:a,testID:l})=>{const u=useTheme(),m=useSkeletonDefaults(),c=useSkeletonClock(),d=i??m.variant??"shimmer",h=c.enabled?d:"none",p=n?.background??m.colors?.background??u.colors.skeleton.background,S=n?.highlight??m.colors?.highlight??u.colors.skeleton.highlight,{responsive:k}=useScreenDimensions(),g=useMemo(()=>buildStyles(),[]),y=resolveWidth(t),b=k.size(s),x=radiusForShape(u,e,y,b,o),[f,v]=useState(0),j=useMemo(()=>f<=0?0:Math.max(48,.7*f),[f]),w=useMemo(()=>f<=0?0:c.shimmer.interpolate({inputRange:[0,1],outputRange:[-j,f]}),[c.shimmer,j,f]),C=useMemo(()=>"none"===h?null:"pulse"===h?_jsx(Animated.View,{pointerEvents:"none",style:[StyleSheet.absoluteFill,{backgroundColor:S,opacity:c.pulse.interpolate({inputRange:[0,1],outputRange:[0,.55]})}]}):f<=0?null:_jsx(Animated.View,{pointerEvents:"none",style:[g.shimmerBand,{width:j,transform:[{translateX:w}],experimental_backgroundImage:[toBackgroundImage({colors:["transparent",S,"transparent"],locations:[0,.5,1],start:{x:0,y:.5},end:{x:1,y:.5}})]}]}),[h,S,c.pulse,f,g.shimmerBand,j,w]);return _jsx(View,{onLayout:e=>{const t=e.nativeEvent.layout.width;t!==f&&v(t)},accessible:!0,accessibilityLabel:"Loading",accessibilityRole:"progressbar",accessibilityState:{busy:!0},accessibilityLiveRegion:"polite",testID:l,style:[g.base,{width:y,height:b,borderRadius:x,...smoothCorners,backgroundColor:p},a],children:C})};Skeleton.displayName="Skeleton";const SkeletonCircle=({size:e,style:t,...s})=>{const{responsive:o}=useScreenDimensions(),i=o.size(e);return _jsx(Skeleton,{...s,shape:"circle",width:i,height:e,style:t})};SkeletonCircle.displayName="SkeletonCircle";const SkeletonText=({lines:e=3,lastLineWidth:t="60%",spacing:s,fontSize:o=14,variant:i,speed:r,radius:n="sm",width:a="100%",style:l,testID:u})=>{const m=useTheme(),c=s??m.spacing.xs,d=Math.max(1,e);return _jsx(View,{style:l,testID:u,children:Array.from({length:d}).map((e,s)=>_jsx(Skeleton,{shape:"text",width:s===d-1&&d>1?t:a,height:o,radius:n,variant:i,speed:r,style:s<d-1?{marginBottom:c}:void 0},s))})};SkeletonText.displayName="SkeletonText";const buildStyles=()=>StyleSheet.create({base:{overflow:"hidden"},shimmerBand:{position:"absolute",top:0,bottom:0,left:0}});export{Skeleton,SkeletonCircle,SkeletonText};export default Skeleton;
+"use strict";import{useMemo,useState}from"react";import{Animated,StyleSheet,View}from"react-native";import{useTheme}from"../../theme/index.js";import{toBackgroundImage}from"../../theme/Gradient.js";import{useScreenDimensions}from"../../utils/index.js";import{smoothCorners}from"../../utils/corners.js";import{useSkeletonClock}from"./SkeletonClock.js";import{useSkeletonDefaults}from"./SkeletonProvider.js";import{jsx as _jsx}from"react/jsx-runtime";const resolveRadius=(e,t)=>"number"==typeof t?t:e.radius[t],resolveWidth=e=>void 0===e?"100%":e,radiusForShape=(e,t,s,o,i)=>{if(void 0!==i)return resolveRadius(e,i);switch(t){case"circle":return"number"==typeof s?Math.min(s,o)/2:o/2;case"rounded":return e.radius.md;default:return e.radius.sm}},Skeleton=({shape:e="rect",width:t="100%",height:s=16,radius:o,variant:i,speed:r,colors:n,style:a,testID:l})=>{const u=useTheme(),m=useSkeletonDefaults(),d=useSkeletonClock(),c=i??m.variant??"shimmer",h=d.enabled?c:"none",p=n?.background??m.colors?.background??u.colors.skeleton.background,S=n?.highlight??m.colors?.highlight??u.colors.skeleton.highlight,{responsive:k}=useScreenDimensions(),g=useMemo(()=>buildStyles(),[]),y=resolveWidth(t),b=k.size(s),x=radiusForShape(u,e,y,b,o),[f,v]=useState(0),j=useMemo(()=>f<=0?0:Math.max(48,.7*f),[f]),w=useMemo(()=>f<=0?0:d.shimmer.interpolate({inputRange:[0,1],outputRange:[-j,f]}),[d.shimmer,j,f]),C=useMemo(()=>"none"===h?null:"pulse"===h?_jsx(Animated.View,{pointerEvents:"none",style:[StyleSheet.absoluteFill,{backgroundColor:S,opacity:d.pulse.interpolate({inputRange:[0,1],outputRange:[0,.55]})}]}):f<=0?null:_jsx(Animated.View,{pointerEvents:"none",style:[g.shimmerBand,{width:j,transform:[{translateX:w}],experimental_backgroundImage:[toBackgroundImage({colors:["transparent",S,"transparent"],locations:[0,.5,1],start:{x:0,y:.5},end:{x:1,y:.5}})]}]}),[h,S,d.pulse,f,g.shimmerBand,j,w]);return _jsx(View,{onLayout:e=>{const t=e.nativeEvent.layout.width;t!==f&&v(t)},accessible:!0,accessibilityLabel:"Loading",accessibilityRole:"progressbar",accessibilityState:{busy:!0},"aria-busy":!0,accessibilityLiveRegion:"polite",testID:l,style:[g.base,{width:y,height:b,borderRadius:x,...smoothCorners,backgroundColor:p},a],children:C})};Skeleton.displayName="Skeleton";const SkeletonCircle=({size:e,style:t,...s})=>{const{responsive:o}=useScreenDimensions(),i=o.size(e);return _jsx(Skeleton,{...s,shape:"circle",width:i,height:e,style:t})};SkeletonCircle.displayName="SkeletonCircle";const SkeletonText=({lines:e=3,lastLineWidth:t="60%",spacing:s,fontSize:o=14,variant:i,speed:r,radius:n="sm",width:a="100%",style:l,testID:u})=>{const m=useTheme(),d=s??m.spacing.xs,c=Math.max(1,e);return _jsx(View,{style:l,testID:u,children:Array.from({length:c}).map((e,s)=>_jsx(Skeleton,{shape:"text",width:s===c-1&&c>1?t:a,height:o,radius:n,variant:i,speed:r,style:s<c-1?{marginBottom:d}:void 0},s))})};SkeletonText.displayName="SkeletonText";const buildStyles=()=>StyleSheet.create({base:{overflow:"hidden"},shimmerBand:{position:"absolute",top:0,bottom:0,left:0}});export{Skeleton,SkeletonCircle,SkeletonText};export default Skeleton;

package/lib/module/components/Skeleton/SkeletonClock.js

@@ -1 +1 @@
-"use strict";import React,{createContext,useContext,useEffect,useMemo,useRef}from"react";import{Animated,Easing}from"react-native";import{createAnimatedValue}from"../../theme/index.js";import{jsx as _jsx}from"react/jsx-runtime";const SHIMMER_DURATION={slow:1800,normal:1200,fast:800},PULSE_DURATION=1e3,SkeletonClockContext=createContext(null);export const SkeletonClockProvider=({speed:e,enabled:t,variant:n,children:a})=>{const o=useRef(createAnimatedValue(0)).current,r=useRef(createAnimatedValue(0)).current;useEffect(()=>{if(!t)return o.setValue(0),void r.setValue(.5);const n=Animated.loop(Animated.timing(o,{toValue:1,duration:SHIMMER_DURATION[e],easing:Easing.linear,useNativeDriver:!0})),a=Animated.loop(Animated.sequence([Animated.timing(r,{toValue:1,duration:500,easing:Easing.inOut(Easing.ease),useNativeDriver:!0}),Animated.timing(r,{toValue:0,duration:500,easing:Easing.inOut(Easing.ease),useNativeDriver:!0})]));return n.start(),a.start(),()=>{n.stop(),a.stop()}},[e,t,o,r]);const i=useMemo(()=>({shimmer:o,pulse:r,enabled:t}),[o,r,t]);return _jsx(SkeletonClockContext.Provider,{value:i,children:a})};SkeletonClockProvider.displayName="SkeletonClockProvider";export const useSkeletonClock=()=>{const e=useContext(SkeletonClockContext);return e||fallbackClock};const fallbackClock={shimmer:createAnimatedValue(0),pulse:createAnimatedValue(.5),enabled:!1};
+"use strict";import{createContext,useContext,useEffect,useMemo,useRef}from"react";import{Animated,Easing}from"react-native";import{createAnimatedValue}from"../../theme/index.js";import{jsx as _jsx}from"react/jsx-runtime";const SHIMMER_DURATION={slow:1800,normal:1200,fast:800},PULSE_DURATION=1e3,SkeletonClockContext=createContext(null);export const SkeletonClockProvider=({speed:e,enabled:t,variant:n,children:a})=>{const o=useRef(createAnimatedValue(0)).current,r=useRef(createAnimatedValue(0)).current;useEffect(()=>{if(!t)return o.setValue(0),void r.setValue(.5);const n=Animated.loop(Animated.timing(o,{toValue:1,duration:SHIMMER_DURATION[e],easing:Easing.linear,useNativeDriver:!0})),a=Animated.loop(Animated.sequence([Animated.timing(r,{toValue:1,duration:500,easing:Easing.inOut(Easing.ease),useNativeDriver:!0}),Animated.timing(r,{toValue:0,duration:500,easing:Easing.inOut(Easing.ease),useNativeDriver:!0})]));return n.start(),a.start(),()=>{n.stop(),a.stop()}},[e,t,o,r]);const i=useMemo(()=>({shimmer:o,pulse:r,enabled:t}),[o,r,t]);return _jsx(SkeletonClockContext.Provider,{value:i,children:a})};SkeletonClockProvider.displayName="SkeletonClockProvider";export const useSkeletonClock=()=>{const e=useContext(SkeletonClockContext);return e||fallbackClock};const fallbackClock={shimmer:createAnimatedValue(0),pulse:createAnimatedValue(.5),enabled:!1};

package/lib/module/components/Skeleton/SkeletonContent.js

@@ -1 +1 @@
-"use strict";import React,{Children,cloneElement,isValidElement,useEffect,useRef}from"react";import{Animated,Image,StyleSheet,Text,View}from"react-native";import{createAnimatedValue}from"../../theme/index.js";import{Skeleton}from"./Skeleton.js";import{useSkeletonDefaults}from"./SkeletonProvider.js";import{SkeletonSkip}from"./SkeletonSkip.js";import{jsx as _jsx,Fragment as _Fragment}from"react/jsx-runtime";const flattenStyle=e=>{if(!e)return{};return StyleSheet.flatten(e)??{}},resolveWidth=(e,t)=>"number"==typeof e?e:"string"!=typeof e||"auto"!==e&&"100%"!==e&&!/^\d+(\.\d+)?%$/.test(e)?t:e,resolveRadius=(e,t)=>"number"==typeof e?e:t,skeletonizeNode=(e,t,i,r,n="r")=>{if(null==e||"boolean"==typeof e)return null;if("string"==typeof e||"number"==typeof e)return _jsx(Skeleton,{shape:"text",width:"60%",height:14,variant:t,speed:i,colors:r},`${n}-text`);if(Array.isArray(e))return Children.map(e,(e,s)=>skeletonizeNode(e,t,i,r,`${n}-${s}`));if(!isValidElement(e))return null;const s=e,o=s.props??{},l=s.type;if(l===SkeletonSkip)return cloneElement(s,{key:`${n}-skip`});if("function"==typeof l||"object"==typeof l){const e=l.Skeleton;if(e){return _jsx(e,{...o},`${n}-self`)}}if(l===Image){const e=flattenStyle(o.style),s=resolveWidth(e.width,"100%"),l="number"==typeof e.height?e.height:120,a=resolveRadius(e.borderRadius,"sm");return _jsx(Skeleton,{width:s,height:l,radius:a,variant:t,speed:i,colors:r,style:{margin:"number"==typeof e.margin?e.margin:void 0}},`${n}-img`)}if(l===Text){const e=flattenStyle(o.style),s="number"==typeof e.fontSize?e.fontSize:14,l=resolveWidth(e.width,"85%");return _jsx(Skeleton,{shape:"text",width:l,height:Math.round(1.15*s),variant:t,speed:i,colors:r,style:{marginVertical:2}},`${n}-txt`)}if(null!=o.children)return cloneElement(s,{key:`${n}-w`},skeletonizeNode(o.children,t,i,r,`${n}-c`));if(l===View){const e=flattenStyle(o.style);if(null!=e.width||null!=e.height){const s=resolveWidth(e.width,"100%"),o="number"==typeof e.height?e.height:20,l=resolveRadius(e.borderRadius,"sm");return _jsx(Skeleton,{width:s,height:o,radius:l,variant:t,speed:i,colors:r},`${n}-vw`)}}return cloneElement(s,{key:`${n}-leaf`})},SkeletonContent=({loading:e,children:t,placeholder:i,variant:r,speed:n,count:s=1,colors:o,fadeDuration:l,style:a,testID:c})=>{const u=useSkeletonDefaults(),d=l??u.fadeDuration??300,f=useRef(e),m=useRef(createAnimatedValue(e?0:1)).current;if(useEffect(()=>{let t;return f.current&&!e?(m.setValue(0),t=Animated.timing(m,{toValue:1,duration:d,useNativeDriver:!0}),t.start()):!f.current&&e&&m.setValue(1),f.current=e,()=>t?.stop()},[e,m,d]),!e)return d<=0?_jsx(_Fragment,{children:t}):_jsx(Animated.View,{style:[a,{opacity:m}],testID:c,children:t});if(void 0!==i){const e=s>1?Array.from({length:s},(e,t)=>_jsx(React.Fragment,{children:i},`sk-ph-${t}`)):i;return _jsx(View,{style:a,testID:c,accessible:!0,accessibilityLabel:"Loading",accessibilityRole:"progressbar",accessibilityState:{busy:!0},accessibilityLiveRegion:"polite",children:e})}const h=s>1?Array.from({length:s},(e,i)=>_jsx(React.Fragment,{children:t},`sk-rep-${i}`)):t;return _jsx(View,{style:a,testID:c,accessible:!0,accessibilityLabel:"Loading",accessibilityRole:"progressbar",accessibilityState:{busy:!0},accessibilityLiveRegion:"polite",children:skeletonizeNode(h,r,n,o)})};SkeletonContent.displayName="SkeletonContent";export{SkeletonContent};export default SkeletonContent;
+"use strict";import React,{Children,cloneElement,isValidElement,useEffect,useRef}from"react";import{Animated,Image,StyleSheet,Text,View}from"react-native";import{createAnimatedValue}from"../../theme/index.js";import{Skeleton}from"./Skeleton.js";import{useSkeletonDefaults}from"./SkeletonProvider.js";import{SkeletonSkip}from"./SkeletonSkip.js";import{jsx as _jsx,Fragment as _Fragment}from"react/jsx-runtime";const flattenStyle=e=>{if(!e)return{};return StyleSheet.flatten(e)??{}},resolveWidth=(e,t)=>"number"==typeof e?e:"string"!=typeof e||"auto"!==e&&"100%"!==e&&!/^\d+(\.\d+)?%$/.test(e)?t:e,resolveRadius=(e,t)=>"number"==typeof e?e:t,skeletonizeNode=(e,t,i,r,n="r")=>{if(null==e||"boolean"==typeof e)return null;if("string"==typeof e||"number"==typeof e)return _jsx(Skeleton,{shape:"text",width:"60%",height:14,variant:t,speed:i,colors:r},`${n}-text`);if(Array.isArray(e))return Children.map(e,(e,s)=>skeletonizeNode(e,t,i,r,`${n}-${s}`));if(!isValidElement(e))return null;const s=e,o=s.props??{},l=s.type;if(l===SkeletonSkip)return cloneElement(s,{key:`${n}-skip`});if("function"==typeof l||"object"==typeof l){const e=l.Skeleton;if(e){return _jsx(e,{...o},`${n}-self`)}}if(l===Image){const e=flattenStyle(o.style),s=resolveWidth(e.width,"100%"),l="number"==typeof e.height?e.height:120,a=resolveRadius(e.borderRadius,"sm");return _jsx(Skeleton,{width:s,height:l,radius:a,variant:t,speed:i,colors:r,style:{margin:"number"==typeof e.margin?e.margin:void 0}},`${n}-img`)}if(l===Text){const e=flattenStyle(o.style),s="number"==typeof e.fontSize?e.fontSize:14,l=resolveWidth(e.width,"85%");return _jsx(Skeleton,{shape:"text",width:l,height:Math.round(1.15*s),variant:t,speed:i,colors:r,style:{marginVertical:2}},`${n}-txt`)}if(null!=o.children)return cloneElement(s,{key:`${n}-w`},skeletonizeNode(o.children,t,i,r,`${n}-c`));if(l===View){const e=flattenStyle(o.style);if(null!=e.width||null!=e.height){const s=resolveWidth(e.width,"100%"),o="number"==typeof e.height?e.height:20,l=resolveRadius(e.borderRadius,"sm");return _jsx(Skeleton,{width:s,height:o,radius:l,variant:t,speed:i,colors:r},`${n}-vw`)}}return cloneElement(s,{key:`${n}-leaf`})},SkeletonContent=({loading:e,children:t,placeholder:i,variant:r,speed:n,count:s=1,colors:o,fadeDuration:l,style:a,testID:c})=>{const u=useSkeletonDefaults(),d=l??u.fadeDuration??300,f=useRef(e),m=useRef(createAnimatedValue(e?0:1)).current;if(useEffect(()=>{let t;return f.current&&!e?(m.setValue(0),t=Animated.timing(m,{toValue:1,duration:d,useNativeDriver:!0}),t.start()):!f.current&&e&&m.setValue(1),f.current=e,()=>t?.stop()},[e,m,d]),!e)return d<=0?_jsx(_Fragment,{children:t}):_jsx(Animated.View,{style:[a,{opacity:m}],testID:c,children:t});if(void 0!==i){const e=s>1?Array.from({length:s},(e,t)=>_jsx(React.Fragment,{children:i},`sk-ph-${t}`)):i;return _jsx(View,{style:a,testID:c,accessible:!0,accessibilityLabel:"Loading",accessibilityRole:"progressbar",accessibilityState:{busy:!0},"aria-busy":!0,accessibilityLiveRegion:"polite",children:e})}const h=s>1?Array.from({length:s},(e,i)=>_jsx(React.Fragment,{children:t},`sk-rep-${i}`)):t;return _jsx(View,{style:a,testID:c,accessible:!0,accessibilityLabel:"Loading",accessibilityRole:"progressbar",accessibilityState:{busy:!0},"aria-busy":!0,accessibilityLiveRegion:"polite",children:skeletonizeNode(h,r,n,o)})};SkeletonContent.displayName="SkeletonContent";export{SkeletonContent};export default SkeletonContent;

package/lib/module/components/Skeleton/SkeletonProvider.js

@@ -1 +1 @@
-"use strict";import React,{createContext,useContext,useEffect,useMemo,useState}from"react";import{AccessibilityInfo}from"react-native";import{SkeletonClockProvider}from"./SkeletonClock.js";import{jsx as _jsx}from"react/jsx-runtime";const SkeletonDefaultsContext=createContext({});export const SkeletonProvider=({children:e,variant:t,speed:o,placeholderCount:n,radius:r,colors:s,fadeDuration:a,animation:i="auto"})=>{const c=useReduceMotion(),l="always"===i||"never"!==i&&!c,u=o??"normal",d=t??"shimmer",m=useMemo(()=>({variant:t,speed:o,placeholderCount:n,radius:r,colors:s,fadeDuration:a,animation:i}),[t,o,n,r,s,a,i]);return _jsx(SkeletonDefaultsContext.Provider,{value:m,children:_jsx(SkeletonClockProvider,{speed:u,variant:d,enabled:l,children:e})})};SkeletonProvider.displayName="SkeletonProvider";export const useSkeletonDefaults=()=>useContext(SkeletonDefaultsContext);export const useReduceMotion=()=>{const[e,t]=useState(!1);return useEffect(()=>{let e=!0;AccessibilityInfo.isReduceMotionEnabled().then(o=>{e&&t(o)}).catch(()=>{e&&t(!1)});const o=AccessibilityInfo.addEventListener("reduceMotionChanged",e=>{t(e)});return()=>{e=!1,o.remove()}},[]),e};
+"use strict";import{createContext,useContext,useEffect,useMemo,useState}from"react";import{AccessibilityInfo}from"react-native";import{SkeletonClockProvider}from"./SkeletonClock.js";import{jsx as _jsx}from"react/jsx-runtime";const SkeletonDefaultsContext=createContext({});export const SkeletonProvider=({children:e,variant:t,speed:o,placeholderCount:n,radius:r,colors:s,fadeDuration:i,animation:a="auto"})=>{const c=useReduceMotion(),l="always"===a||"never"!==a&&!c,u=o??"normal",d=t??"shimmer",m=useMemo(()=>({variant:t,speed:o,placeholderCount:n,radius:r,colors:s,fadeDuration:i,animation:a}),[t,o,n,r,s,i,a]);return _jsx(SkeletonDefaultsContext.Provider,{value:m,children:_jsx(SkeletonClockProvider,{speed:u,variant:d,enabled:l,children:e})})};SkeletonProvider.displayName="SkeletonProvider";export const useSkeletonDefaults=()=>useContext(SkeletonDefaultsContext);export const useReduceMotion=()=>{const[e,t]=useState(!1);return useEffect(()=>{let e=!0;AccessibilityInfo.isReduceMotionEnabled().then(o=>{e&&t(o)}).catch(()=>{e&&t(!1)});const o=AccessibilityInfo.addEventListener("reduceMotionChanged",e=>{t(e)});return()=>{e=!1,o.remove()}},[]),e};

package/lib/module/components/Skeleton/SkeletonSkip.js

@@ -1 +1 @@
-"use strict";import React from"react";import{Fragment as _Fragment,jsx as _jsx}from"react/jsx-runtime";export const SkeletonSkip=({children:e})=>_jsx(_Fragment,{children:e});SkeletonSkip.displayName="SkeletonSkip";
+"use strict";import{Fragment as _Fragment,jsx as _jsx}from"react/jsx-runtime";export const SkeletonSkip=({children:e})=>_jsx(_Fragment,{children:e});SkeletonSkip.displayName="SkeletonSkip";

package/lib/module/components/SlideToConfirm/SlideToConfirm.js

@@ -1 +1 @@
-"use strict";import React,{forwardRef,useCallback,useMemo,useRef,useState}from"react";import{StyleSheet,Text,View}from"react-native";import{Gesture,GestureDetector}from"react-native-gesture-handler";import Animated,{cancelAnimation,Easing,runOnJS,useAnimatedStyle,useSharedValue,withSpring,withTiming}from"react-native-reanimated";import{useTheme}from"../../theme/index.js";import{resolveHaptic,triggerHaptic}from"../../utils/index.js";import{smoothCorners}from"../../utils/corners.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const SIZE_MAP={sm:{height:44,pad:4},md:{height:56,pad:5},lg:{height:64,pad:6}},Chevron=({color:e,size:t})=>_jsx(View,{style:{width:0,height:0,borderTopWidth:.4*t,borderBottomWidth:.4*t,borderLeftWidth:.55*t,borderTopColor:"transparent",borderBottomColor:"transparent",borderLeftColor:e,marginLeft:.2*t}}),ACCESSIBILITY_ACTIONS=[{name:"activate",label:"Confirm"},{name:"increment",label:"Confirm"}],SlideToConfirm=forwardRef((e,t)=>{const{onConfirm:a,label:i="Slide to confirm",confirmedLabel:r="Confirmed",tone:o="primary",size:n="md",disabled:s=!1,threshold:l=.9,resetAfter:c=!1,haptic:d,icon:u,style:m,trackStyle:h,handleStyle:f,labelStyle:p,testID:b}=e,S=useTheme(),g=SIZE_MAP[n],y=g.height-2*g.pad,v=useMemo(()=>buildStyles(S,g),[S,g]),C=S.colors[o],[x,w]=useState(!1),A=useSharedValue(0),T=useSharedValue(0),j=useSharedValue(0),k=useRef(null),_=useCallback(()=>{const e=resolveHaptic(d,"notificationSuccess");e&&triggerHaptic(e)},[d]),E=useCallback(()=>{w(!1),A.value=withSpring(0,{damping:18,stiffness:160,mass:1})},[A]),I=useCallback(()=>{w(!0),_(),a(),!1!==c&&(k.current&&clearTimeout(k.current),k.current=setTimeout(E,c))},[_,a,c,E]),R=useCallback(e=>{if(s||x)return;const{actionName:t}=e.nativeEvent;"activate"!==t&&"increment"!==t||I()},[s,x,I]);React.useEffect(()=>()=>{cancelAnimation(A),k.current&&clearTimeout(k.current)},[A]);const V=useCallback(e=>{T.value=Math.max(0,e.nativeEvent.layout.width-y-2*g.pad)},[T,y,g.pad]),L=useMemo(()=>{const e=l,t={damping:18,stiffness:160,mass:1},a={duration:S.motion.duration.fast,easing:Easing.out(Easing.cubic)};return Gesture.Pan().enabled(!s&&!x).minDistance(0).onStart(()=>{"worklet";j.value=A.value}).onUpdate(e=>{"worklet";A.value=Math.min(Math.max(j.value+e.translationX,0),T.value)}).onEnd(()=>{"worklet";T.value>0&&A.value>=T.value*e?(A.value=withTiming(T.value,a),runOnJS(I)()):A.value=withSpring(0,t)})},[s,x,l,A,T,j,I,S.motion.duration.fast]),M=useAnimatedStyle(()=>({transform:[{translateX:A.value}]})),z=useAnimatedStyle(()=>({width:A.value+y+g.pad})),D=useAnimatedStyle(()=>{const e=T.value>0?T.value:1;return{opacity:Math.max(0,1-A.value/(.6*e))}});return _jsxs(View,{ref:t,style:[v.track,{backgroundColor:S.colors.background.secondary},h,m],onLayout:V,testID:b,accessibilityRole:"adjustable",accessibilityLabel:x?r:i,accessibilityState:{disabled:s},accessibilityActions:ACCESSIBILITY_ACTIONS,onAccessibilityAction:R,children:[_jsx(Animated.View,{style:[v.fill,{backgroundColor:C,opacity:s?.5:1},z],pointerEvents:"none"}),_jsx(Animated.View,{style:[v.labelWrap,D],pointerEvents:"none",children:_jsx(Text,{style:[v.label,{color:S.colors.text.secondary,fontSize:S.typography.fontSize.base},p],numberOfLines:1,children:x?r:i})}),_jsx(GestureDetector,{gesture:L,children:_jsx(Animated.View,{style:[v.handle,{width:y,height:y,borderRadius:y/2,...smoothCorners,backgroundColor:S.colors.background.elevated,opacity:s?.5:1,...S.shadows.sm},f,M],children:u??_jsx(Chevron,{color:C,size:.5*y})})})]})});SlideToConfirm.displayName="SlideToConfirm";const buildStyles=(e,t)=>StyleSheet.create({track:{height:t.height,borderRadius:t.height/2,...smoothCorners,justifyContent:"center",overflow:"hidden",padding:t.pad},fill:{position:"absolute",left:0,top:0,bottom:0,borderRadius:t.height/2,...smoothCorners},labelWrap:{position:"absolute",left:t.height,right:t.height},label:{textAlign:"center",includeFontPadding:!1},handle:{alignItems:"center",justifyContent:"center"}});export{SlideToConfirm};export default SlideToConfirm;
+"use strict";import React,{forwardRef,useCallback,useMemo,useRef,useState}from"react";import{StyleSheet,Text,View}from"react-native";import{Gesture,GestureDetector}from"react-native-gesture-handler";import Animated,{cancelAnimation,Easing,runOnJS,useAnimatedStyle,useSharedValue,withSpring,withTiming}from"react-native-reanimated";import{useTheme}from"../../theme/index.js";import{resolveHaptic,triggerHaptic}from"../../utils/index.js";import{smoothCorners}from"../../utils/corners.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const SIZE_MAP={sm:{height:44,pad:4},md:{height:56,pad:5},lg:{height:64,pad:6}},Chevron=({color:e,size:t})=>_jsx(View,{style:{width:0,height:0,borderTopWidth:.4*t,borderBottomWidth:.4*t,borderLeftWidth:.55*t,borderTopColor:"transparent",borderBottomColor:"transparent",borderLeftColor:e,marginLeft:.2*t}}),ACCESSIBILITY_ACTIONS=[{name:"activate",label:"Confirm"},{name:"increment",label:"Confirm"}],SlideToConfirm=forwardRef((e,t)=>{const{onConfirm:a,label:i="Slide to confirm",confirmedLabel:r="Confirmed",tone:o="primary",size:n="md",disabled:s=!1,threshold:l=.9,resetAfter:c=!1,haptic:d,icon:u,style:m,trackStyle:h,handleStyle:f,labelStyle:b,testID:p}=e,S=useTheme(),g=SIZE_MAP[n],y=g.height-2*g.pad,v=useMemo(()=>buildStyles(g),[g]),C=S.colors[o],[x,w]=useState(!1),A=useSharedValue(0),T=useSharedValue(0),j=useSharedValue(0),k=useRef(null),_=useCallback(()=>{const e=resolveHaptic(d,"notificationSuccess");e&&triggerHaptic(e)},[d]),E=useCallback(()=>{w(!1),A.value=withSpring(0,{damping:18,stiffness:160,mass:1})},[A]),I=useCallback(()=>{w(!0),_(),a(),!1!==c&&(k.current&&clearTimeout(k.current),k.current=setTimeout(E,c))},[_,a,c,E]),R=useCallback(e=>{if(s||x)return;const{actionName:t}=e.nativeEvent;"activate"!==t&&"increment"!==t||I()},[s,x,I]);React.useEffect(()=>()=>{cancelAnimation(A),k.current&&clearTimeout(k.current)},[A]);const V=useCallback(e=>{T.value=Math.max(0,e.nativeEvent.layout.width-y-2*g.pad)},[T,y,g.pad]),L=useMemo(()=>{const e=l,t={damping:18,stiffness:160,mass:1},a={duration:S.motion.duration.fast,easing:Easing.out(Easing.cubic)};return Gesture.Pan().enabled(!s&&!x).minDistance(0).onStart(()=>{"worklet";j.value=A.value}).onUpdate(e=>{"worklet";A.value=Math.min(Math.max(j.value+e.translationX,0),T.value)}).onEnd(()=>{"worklet";T.value>0&&A.value>=T.value*e?(A.value=withTiming(T.value,a),runOnJS(I)()):A.value=withSpring(0,t)})},[s,x,l,A,T,j,I,S.motion.duration.fast]),M=useAnimatedStyle(()=>({transform:[{translateX:A.value}]})),z=useAnimatedStyle(()=>({width:A.value+y+g.pad})),D=useAnimatedStyle(()=>{const e=T.value>0?T.value:1;return{opacity:Math.max(0,1-A.value/(.6*e))}});return _jsxs(View,{ref:t,style:[v.track,{backgroundColor:S.colors.background.secondary},h,m],onLayout:V,testID:p,accessibilityRole:"adjustable",accessibilityLabel:x?r:i,accessibilityState:{disabled:s},"aria-disabled":s,accessibilityActions:ACCESSIBILITY_ACTIONS,onAccessibilityAction:R,children:[_jsx(Animated.View,{style:[v.fill,{backgroundColor:C,opacity:s?.5:1},z],pointerEvents:"none"}),_jsx(Animated.View,{style:[v.labelWrap,D],pointerEvents:"none",children:_jsx(Text,{style:[v.label,{color:S.colors.text.secondary,fontSize:S.typography.fontSize.base},b],numberOfLines:1,children:x?r:i})}),_jsx(GestureDetector,{gesture:L,children:_jsx(Animated.View,{style:[v.handle,{width:y,height:y,borderRadius:y/2,...smoothCorners,backgroundColor:S.colors.background.elevated,opacity:s?.5:1,...S.shadows.sm},f,M],children:u??_jsx(Chevron,{color:C,size:.5*y})})})]})});SlideToConfirm.displayName="SlideToConfirm";const buildStyles=e=>StyleSheet.create({track:{height:e.height,borderRadius:e.height/2,...smoothCorners,justifyContent:"center",overflow:"hidden",padding:e.pad},fill:{position:"absolute",left:0,top:0,bottom:0,borderRadius:e.height/2,...smoothCorners},labelWrap:{position:"absolute",left:e.height,right:e.height},label:{textAlign:"center",includeFontPadding:!1},handle:{alignItems:"center",justifyContent:"center"}});export{SlideToConfirm};export default SlideToConfirm;

package/lib/module/components/Slider/Slider.js

@@ -1 +1 @@
-"use strict";import{forwardRef,useCallback,useEffect,useMemo,useRef,useState}from"react";import{Platform,Pressable,StyleSheet,Text,View}from"react-native";import{Gesture,GestureDetector}from"react-native-gesture-handler";import Animated,{cancelAnimation,Easing,runOnJS,useAnimatedStyle,useSharedValue,withSpring,withTiming}from"react-native-reanimated";import{useControllableState}from"../../hooks/index.js";import{useTheme}from"../../theme/index.js";import{resolveHaptic,triggerHaptic}from"../../utils/index.js";import{smoothCorners}from"../../utils/corners.js";import{sliderToneInk}from"./valueText.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const SIZE_MAP={sm:{trackHeight:4,thumbDiameter:24},md:{trackHeight:6,thumbDiameter:28},lg:{trackHeight:8,thumbDiameter:32}},VARIANT_SIZE_MAP={inset:{sm:{trackHeight:14,thumbDiameter:10},md:{trackHeight:20,thumbDiameter:14},lg:{trackHeight:26,thumbDiameter:18}},minimal:{sm:{trackHeight:2,thumbDiameter:14},md:{trackHeight:3,thumbDiameter:18},lg:{trackHeight:4,thumbDiameter:22}},bar:{sm:{trackHeight:20,thumbDiameter:20},md:{trackHeight:28,thumbDiameter:28},lg:{trackHeight:36,thumbDiameter:36}}},INSET_RING_RATIO=.3,MIN_THUMB_TOUCH=44,TONE_TO_COLOR_KEY={primary:"primary",success:"success",warning:"warning",error:"error"},clamp=(e,t,a)=>Math.min(Math.max(e,t),a),snapToStep=(e,t,a,r)=>{if(r<=0)return clamp(e,t,a);const i=Math.round((e-t)/r)*r+t,s=String(r).split(".")[1]?.length??0,n=s>0?Number(i.toFixed(s)):i;return clamp(n,t,a)},BUBBLE_GAP=2,BUBBLE_CARET=8,BUBBLE_WRAP_WIDTH=160,NO_SHADOW={shadowOpacity:0,elevation:0},defaultFormatLabel=e=>String(e),Slider=forwardRef((e,t)=>{const{min:a=0,max:r=100,step:i=1,disabled:s=!1,tone:n="primary",size:o="md",variant:l="default",showLabel:u=!1,snapThumb:c=!1,formatLabel:m=defaultFormatLabel,renderLabel:d,accessibilityLabel:h,haptic:b,style:g,containerStyle:p,trackStyle:f,fillStyle:y,thumbStyle:v,labelStyle:w,thumbPressScale:S,labelShowDuration:k,labelOpacity:C,testID:x}=e,_=useTheme(),A=_.components.slider,D=A?.[o],M=useMemo(()=>"default"===l?{trackHeight:D?.trackHeight??SIZE_MAP[o].trackHeight,thumbDiameter:D?.thumbDiameter??SIZE_MAP[o].thumbDiameter}:VARIANT_SIZE_MAP[l][o],[D,o,l]),H="inset"===l?M.trackHeight/2:0,O=A?.thumbPressAnimation??!1,E=S??A?.thumbPressScale??1.1,j=k??A?.labelShowDuration??_.motion.duration.fast,T=C??A?.labelOpacity??1,V=useMemo(()=>buildStyles(_,M),[_,M]),R=useMemo(()=>({damping:_.motion.spring.snappy.damping,stiffness:_.motion.spring.snappy.stiffness,mass:_.motion.spring.snappy.mass}),[_.motion.spring.snappy]),[I,P]=useState(0),W=_.colors[TONE_TO_COLOR_KEY[n]],L=sliderToneInk(_,n),N=!0===e.range,[X,B]=useControllableState({value:e.value,defaultValue:e.defaultValue??(N?[a,r]:a),onChange:e.onChange}),F=useSharedValue(0),G=useSharedValue(0),J=useSharedValue(N?X[0]:X),U=useSharedValue(N?X[1]:X),z=useSharedValue(0),Z=useSharedValue(0),K=useSharedValue(1),Y=useSharedValue(1),$="always"===u,q=useSharedValue($?1:0),Q=useSharedValue($?1:0),ee=useMemo(()=>{const e=String(i).split(".")[1]?.length??0;return Math.pow(10,e)},[i]);useEffect(()=>()=>{cancelAnimation(F),cancelAnimation(G),cancelAnimation(K),cancelAnimation(Y),cancelAnimation(q),cancelAnimation(Q)},[F,G,K,Y,q,Q]);const te=useCallback((e,t)=>{const i=t-2*H;return r===a||i<=0?H:H+(e-a)/(r-a)*i},[a,r,H]),ae=useCallback((e,t)=>{const s=t-2*H;if(s<=0)return a;const n=clamp((e-H)/s,0,1);return snapToStep(a+n*(r-a),a,r,i)},[a,r,i,H]),re=useRef(!1),ie=_.motion.duration.fast,se=useRef(X);se.current=X;const ne=useRef(I);ne.current=I;const oe=useCallback((e=!1)=>{const t=ne.current;if(t<=0)return;const place=t=>e?withTiming(t,{duration:ie,easing:Easing.out(Easing.cubic)}):t,a=se.current;if(N){const[e,r]=a,i=Math.min(e,r),s=Math.max(e,r);J.value=i,U.value=s,F.value=place(te(i,t)),G.value=place(te(s,t))}else{const e=a;J.value=e,U.value=e,F.value=place(te(e,t))}},[N,te,J,U,F,G,ie]),[le,ue]=useState(0),ce=useRef(!1),me=useCallback(e=>{re.current=e,e||(ce.current=!0,ue(e=>e+1))},[]);useEffect(()=>{if(re.current)return;const e=ce.current;ce.current=!1,oe(e)},[JSON.stringify(X),I,le,oe]);const de=useCallback(e=>{const t=e.nativeEvent.layout.width;Z.value=t,P(t)},[Z]),he=useCallback((e,t)=>{B(N?[e,t]:e)},[N,B]),be=useCallback(()=>{const e=resolveHaptic(b,"selection");e&&triggerHaptic(e)},[b]),ge=useRef(he);ge.current=he;const pe=useRef(be);pe.current=be;const fe=useCallback((e,t)=>ge.current(e,t),[]),ye=useCallback(()=>pe.current(),[]),ve=Math.max(0,(44-M.thumbDiameter)/2),we=ve>0?ve:void 0,Se=useCallback(e=>{const t="low"===e?F:G,n="low"===e?J:U,o="low"===e?U:J,l="low"===e?K:Y,m="low"===e?q:Q,d="low"===e,h=a,b=r,g=i,p=ee,f=N,y=E,v=O,w=!0===u,S=c,k=T,C=j,x=R,_=H,follow=e=>{"worklet";const a=Z.value-2*_;if(a<=0||!Number.isFinite(e))return;const r=Math.min(Math.max(z.value+e,_),Z.value-_);let i=h+(r-_)/a*(b-h);g>0&&(i=Math.round((i-h)/g)*g+h,i=Math.round(i*p)/p),i=Math.min(Math.max(i,h),b),f&&(d&&i>o.value&&(i=o.value),!d&&i<o.value&&(i=o.value)),t.value=S||b===h?b===h?_:_+(i-h)/(b-h)*a:f?d?Math.min(r,G.value):Math.max(r,F.value):r,i!==n.value&&(n.value=i,i!==h&&i!==b||runOnJS(ye)(),runOnJS(fe)(J.value,U.value))},A=Gesture.Pan().enabled(!s).minDistance(0);return(void 0===we?A:A.hitSlop(we)).onStart(()=>{"worklet";runOnJS(me)(!0),z.value=t.value,v&&(l.value=withSpring(y,x)),w&&(m.value=withTiming(k,{duration:C,easing:Easing.out(Easing.cubic)})),runOnJS(ye)()}).onUpdate(e=>{"worklet";follow(e.translationX)}).onEnd(e=>{"worklet";follow(e.translationX),v&&(l.value=withSpring(1,x)),w&&(m.value=withTiming(0,{duration:C,easing:Easing.out(Easing.cubic)}))}).onFinalize(()=>{"worklet";runOnJS(me)(!1)})},[s,a,r,i,ee,N,E,O,u,c,T,j,R,H,we,fe,ye,me,F,G,J,U,K,Y,q,Q,z,Z]),ke=useMemo(()=>Se("low"),[Se]),Ce=useMemo(()=>Se("high"),[Se]),xe=useCallback(e=>{if(s||N||I<=0)return;const t=clamp(e.nativeEvent.locationX,0,I),a=ae(t,I);a!==J.value&&(be(),J.value=a,F.value=withTiming(te(a,I),{duration:_.motion.duration.fast,easing:Easing.out(Easing.cubic)}),he(a,a))},[s,N,I,ae,te,he,be,F,J,_.motion.duration.fast]),_e=useCallback(e=>{if(s)return;const t="increment"===e.nativeEvent.actionName?i:-i,n=i>0?Math.round(t*ee)/ee:t;if(N){const e=Math.round((J.value+n)*ee)/ee,t=clamp(e,a,U.value);t!==J.value&&(J.value=t,F.value=te(t,I),be(),he(t,U.value))}else{const e=Math.round((J.value+n)*ee)/ee,t=clamp(e,a,r);t!==J.value&&(J.value=t,F.value=te(t,I),be(),he(t,t))}},[s,i,ee,N,a,r,te,I,F,J,U,he,be]),Ae=M.thumbDiameter/2,De=s?_.colors.surface.disabled:W,Me="inset"===l?{backgroundColor:De,borderColor:_.colors.background.elevated,borderWidth:Math.max(2,Math.round(.3*M.thumbDiameter)),...NO_SHADOW}:"minimal"===l?{backgroundColor:De,borderWidth:0}:"bar"===l?{backgroundColor:"transparent",borderWidth:0,...NO_SHADOW}:{backgroundColor:_.colors.background.elevated,borderColor:De},He=useAnimatedStyle(()=>{const e=Z.value;if(e<=0)return{opacity:0,transform:[{translateX:0},{scaleX:1}]};const t=s?.55:1;if(N){const a=Math.max(0,G.value-F.value+2*H);return{opacity:t,transform:[{translateX:F.value-H},{scaleX:a/e}]}}return{opacity:t,transform:[{translateX:F.value+H-e},{scaleX:1}]}}),Oe=useAnimatedStyle(()=>({transform:[{translateX:F.value-Ae},{scale:K.value}]})),Ee=useAnimatedStyle(()=>({transform:[{translateX:G.value-Ae},{scale:Y.value}]})),je=useAnimatedStyle(()=>({opacity:q.value})),Te=useAnimatedStyle(()=>({opacity:Q.value})),clampDisplay=e=>clamp(e,a,r),Ve=clampDisplay(N?Math.min(...X):X),Re=clampDisplay(N?Math.max(...X):X);return _jsx(View,{ref:t,style:[V.container,p,g],testID:x,accessibilityRole:"adjustable",accessibilityLabel:h,accessibilityState:{disabled:s},accessibilityValue:N?{min:a,max:r,now:Ve,text:`${Ve} to ${Re}`}:{min:a,max:r,now:Ve},accessibilityActions:[{name:"increment"},{name:"decrement"}],onAccessibilityAction:_e,children:_jsx(Pressable,{onPress:xe,disabled:s||N,style:V.trackTouch,accessibilityElementsHidden:!0,importantForAccessibility:"no-hide-descendants",children:_jsxs(View,{style:V.trackWrap,onLayout:de,children:[_jsxs(View,{style:V.trackClip,pointerEvents:"none",children:[_jsx(View,{style:[V.track,{backgroundColor:s?_.colors.surface.disabled:_.colors.border.primary},f]}),_jsx(Animated.View,{style:[V.fill,{backgroundColor:s?_.colors.surface.disabled:W},y,He]})]}),_jsx(GestureDetector,{gesture:ke,children:_jsx(Animated.View,{style:[V.thumb,{width:M.thumbDiameter,height:M.thumbDiameter,borderRadius:Ae,...smoothCorners,opacity:s?.55:1},Me,v,Oe],accessibilityElementsHidden:!0,importantForAccessibility:"no-hide-descendants",children:u?_jsxs(Animated.View,{style:[V.bubbleWrap,je],pointerEvents:"none",children:[_jsx(View,{style:[V.bubble,{backgroundColor:W}],children:d?d(Ve):_jsx(Text,{style:[V.bubbleText,{color:L},w],numberOfLines:1,children:m(Ve)})}),_jsx(View,{style:[V.bubbleCaret,{backgroundColor:W}]})]}):null})}),N?_jsx(GestureDetector,{gesture:Ce,children:_jsx(Animated.View,{style:[V.thumb,{width:M.thumbDiameter,height:M.thumbDiameter,borderRadius:Ae,...smoothCorners,opacity:s?.55:1},Me,v,Ee],accessibilityElementsHidden:!0,importantForAccessibility:"no-hide-descendants",children:u?_jsxs(Animated.View,{style:[V.bubbleWrap,Te],pointerEvents:"none",children:[_jsx(View,{style:[V.bubble,{backgroundColor:W}],children:d?d(Re):_jsx(Text,{style:[V.bubbleText,{color:L},w],numberOfLines:1,children:m(Re)})}),_jsx(View,{style:[V.bubbleCaret,{backgroundColor:W}]})]}):null})}):null]})})})});Slider.displayName="Slider";const buildStyles=(e,t)=>{const a=e.shadows.md,r=Math.max(t.thumbDiameter,t.trackHeight),i=r/2+4;return StyleSheet.create({container:{width:"100%",paddingVertical:i,justifyContent:"center"},trackTouch:{width:"100%",justifyContent:"center"},trackWrap:{width:"100%",height:r,justifyContent:"center"},trackClip:{position:"absolute",left:0,right:0,height:t.trackHeight,top:(r-t.trackHeight)/2,borderRadius:t.trackHeight/2,...smoothCorners,overflow:"hidden"},track:{position:"absolute",top:0,right:0,bottom:0,left:0,borderRadius:t.trackHeight/2,...smoothCorners},fill:{position:"absolute",top:0,left:0,width:"100%",height:t.trackHeight,borderRadius:t.trackHeight/2,...smoothCorners,transformOrigin:"left"},thumb:{position:"absolute",top:(r-t.thumbDiameter)/2,left:0,borderWidth:2,shadowColor:a.shadowColor,shadowOffset:a.shadowOffset,shadowOpacity:a.shadowOpacity,shadowRadius:a.shadowRadius,elevation:a.elevation,alignItems:"center",justifyContent:"center"},bubbleWrap:{position:"absolute",bottom:t.thumbDiameter+2,left:t.thumbDiameter/2-80,width:160,alignItems:"center"},bubbleCaret:{width:8,height:8,marginTop:-5,borderRadius:1,...smoothCorners,transform:[{rotate:"45deg"}]},bubble:{paddingHorizontal:e.spacing.sm,paddingVertical:e.spacing.xxs,borderRadius:e.radius.md,...smoothCorners,minWidth:36,alignItems:"center",justifyContent:"center",...Platform.select({ios:{shadowColor:e.shadows.sm.shadowColor,shadowOffset:e.shadows.sm.shadowOffset,shadowOpacity:e.shadows.sm.shadowOpacity,shadowRadius:e.shadows.sm.shadowRadius},android:{elevation:e.shadows.sm.elevation},default:{}})},bubbleText:{color:e.colors.onPrimary,fontSize:e.typography.fontSize.xs,fontWeight:e.typography.fontWeight.semibold}})};export{Slider};export default Slider;
+"use strict";import{forwardRef,useCallback,useEffect,useMemo,useRef,useState}from"react";import{Platform,Pressable,StyleSheet,Text,View}from"react-native";import{Gesture,GestureDetector}from"react-native-gesture-handler";import Animated,{cancelAnimation,Easing,runOnJS,useAnimatedStyle,useSharedValue,withSpring,withTiming}from"react-native-reanimated";import{useControllableState}from"../../hooks/index.js";import{useTheme}from"../../theme/index.js";import{resolveHaptic,triggerHaptic}from"../../utils/index.js";import{smoothCorners}from"../../utils/corners.js";import{sliderToneInk}from"./valueText.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const SIZE_MAP={sm:{trackHeight:4,thumbDiameter:24},md:{trackHeight:6,thumbDiameter:28},lg:{trackHeight:8,thumbDiameter:32}},VARIANT_SIZE_MAP={inset:{sm:{trackHeight:14,thumbDiameter:10},md:{trackHeight:20,thumbDiameter:14},lg:{trackHeight:26,thumbDiameter:18}},minimal:{sm:{trackHeight:2,thumbDiameter:14},md:{trackHeight:3,thumbDiameter:18},lg:{trackHeight:4,thumbDiameter:22}},bar:{sm:{trackHeight:20,thumbDiameter:20},md:{trackHeight:28,thumbDiameter:28},lg:{trackHeight:36,thumbDiameter:36}}},INSET_RING_RATIO=.3,MIN_THUMB_TOUCH=44,TONE_TO_COLOR_KEY={primary:"primary",success:"success",warning:"warning",error:"error"},clamp=(e,t,a)=>Math.min(Math.max(e,t),a),snapToStep=(e,t,a,r)=>{if(r<=0)return clamp(e,t,a);const i=Math.round((e-t)/r)*r+t,s=String(r).split(".")[1]?.length??0,n=s>0?Number(i.toFixed(s)):i;return clamp(n,t,a)},BUBBLE_GAP=2,BUBBLE_CARET=8,BUBBLE_WRAP_WIDTH=160,NO_SHADOW={shadowOpacity:0,elevation:0},defaultFormatLabel=e=>String(e),Slider=forwardRef((e,t)=>{const{min:a=0,max:r=100,step:i=1,disabled:s=!1,tone:n="primary",size:o="md",variant:l="default",showLabel:u=!1,snapThumb:c=!1,formatLabel:m=defaultFormatLabel,renderLabel:d,accessibilityLabel:h,haptic:b,style:g,containerStyle:p,trackStyle:f,fillStyle:y,thumbStyle:v,labelStyle:w,thumbPressScale:S,labelShowDuration:k,labelOpacity:C,testID:x}=e,_=useTheme(),A=_.components.slider,D=A?.[o],H=useMemo(()=>"default"===l?{trackHeight:D?.trackHeight??SIZE_MAP[o].trackHeight,thumbDiameter:D?.thumbDiameter??SIZE_MAP[o].thumbDiameter}:VARIANT_SIZE_MAP[l][o],[D,o,l]),M="inset"===l?H.trackHeight/2:0,O=A?.thumbPressAnimation??!1,E=S??A?.thumbPressScale??1.1,j=k??A?.labelShowDuration??_.motion.duration.fast,T=C??A?.labelOpacity??1,V=useMemo(()=>buildStyles(_,H),[_,H]),R=useMemo(()=>({damping:_.motion.spring.snappy.damping,stiffness:_.motion.spring.snappy.stiffness,mass:_.motion.spring.snappy.mass}),[_.motion.spring.snappy]),[I,P]=useState(0),W=_.colors[TONE_TO_COLOR_KEY[n]],L=sliderToneInk(_,n),N=!0===e.range,[X,B]=useControllableState({value:e.value,defaultValue:e.defaultValue??(N?[a,r]:a),onChange:e.onChange}),F=useSharedValue(0),G=useSharedValue(0),J=useSharedValue(N?X[0]:X),U=useSharedValue(N?X[1]:X),z=useSharedValue(0),Z=useSharedValue(0),K=useSharedValue(1),Y=useSharedValue(1),$="always"===u,q=useSharedValue($?1:0),Q=useSharedValue($?1:0),ee=useMemo(()=>10**(String(i).split(".")[1]?.length??0),[i]);useEffect(()=>()=>{cancelAnimation(F),cancelAnimation(G),cancelAnimation(K),cancelAnimation(Y),cancelAnimation(q),cancelAnimation(Q)},[F,G,K,Y,q,Q]);const te=useCallback((e,t)=>{const i=t-2*M;return r===a||i<=0?M:M+(e-a)/(r-a)*i},[a,r,M]),ae=useCallback((e,t)=>{const s=t-2*M;if(s<=0)return a;const n=clamp((e-M)/s,0,1);return snapToStep(a+n*(r-a),a,r,i)},[a,r,i,M]),re=useRef(!1),ie=_.motion.duration.fast,se=useRef(X);se.current=X;const ne=useRef(I);ne.current=I;const oe=useCallback((e=!1)=>{const t=ne.current;if(t<=0)return;const place=t=>e?withTiming(t,{duration:ie,easing:Easing.out(Easing.cubic)}):t,a=se.current;if(N){const[e,r]=a,i=Math.min(e,r),s=Math.max(e,r);J.value=i,U.value=s,F.value=place(te(i,t)),G.value=place(te(s,t))}else{const e=a;J.value=e,U.value=e,F.value=place(te(e,t))}},[N,te,J,U,F,G,ie]),[le,ue]=useState(0),ce=useRef(!1),me=useCallback(e=>{re.current=e,e||(ce.current=!0,ue(e=>e+1))},[]);useEffect(()=>{if(re.current)return;const e=ce.current;ce.current=!1,oe(e)},[JSON.stringify(X),I,le,oe]);const de=useCallback(e=>{const t=e.nativeEvent.layout.width;Z.value=t,P(t)},[Z]),he=useCallback((e,t)=>{B(N?[e,t]:e)},[N,B]),be=useCallback(()=>{const e=resolveHaptic(b,"selection");e&&triggerHaptic(e)},[b]),ge=useRef(he);ge.current=he;const pe=useRef(be);pe.current=be;const fe=useCallback((e,t)=>ge.current(e,t),[]),ye=useCallback(()=>pe.current(),[]),ve=Math.max(0,(44-H.thumbDiameter)/2),we=ve>0?ve:void 0,Se=useCallback(e=>{const t="low"===e?F:G,n="low"===e?J:U,o="low"===e?U:J,l="low"===e?K:Y,m="low"===e?q:Q,d="low"===e,h=a,b=r,g=i,p=ee,f=N,y=E,v=O,w=!0===u,S=c,k=T,C=j,x=R,_=M,follow=e=>{"worklet";const a=Z.value-2*_;if(a<=0||!Number.isFinite(e))return;const r=Math.min(Math.max(z.value+e,_),Z.value-_);let i=h+(r-_)/a*(b-h);g>0&&(i=Math.round((i-h)/g)*g+h,i=Math.round(i*p)/p),i=Math.min(Math.max(i,h),b),f&&(d&&i>o.value&&(i=o.value),!d&&i<o.value&&(i=o.value)),t.value=S||b===h?b===h?_:_+(i-h)/(b-h)*a:f?d?Math.min(r,G.value):Math.max(r,F.value):r,i!==n.value&&(n.value=i,i!==h&&i!==b||runOnJS(ye)(),runOnJS(fe)(J.value,U.value))},A=Gesture.Pan().enabled(!s).minDistance(0);return(void 0===we?A:A.hitSlop(we)).onStart(()=>{"worklet";runOnJS(me)(!0),z.value=t.value,v&&(l.value=withSpring(y,x)),w&&(m.value=withTiming(k,{duration:C,easing:Easing.out(Easing.cubic)})),runOnJS(ye)()}).onUpdate(e=>{"worklet";follow(e.translationX)}).onEnd(e=>{"worklet";follow(e.translationX),v&&(l.value=withSpring(1,x)),w&&(m.value=withTiming(0,{duration:C,easing:Easing.out(Easing.cubic)}))}).onFinalize(()=>{"worklet";runOnJS(me)(!1)})},[s,a,r,i,ee,N,E,O,u,c,T,j,R,M,we,fe,ye,me,F,G,J,U,K,Y,q,Q,z,Z]),ke=useMemo(()=>Se("low"),[Se]),Ce=useMemo(()=>Se("high"),[Se]),xe=useCallback(e=>{if(s||N||I<=0)return;const t=clamp(e.nativeEvent.locationX,0,I),a=ae(t,I);a!==J.value&&(be(),J.value=a,F.value=withTiming(te(a,I),{duration:_.motion.duration.fast,easing:Easing.out(Easing.cubic)}),he(a,a))},[s,N,I,ae,te,he,be,F,J,_.motion.duration.fast]),_e=useCallback(e=>{if(s)return;const t="increment"===e.nativeEvent.actionName?i:-i,n=i>0?Math.round(t*ee)/ee:t;if(N){const e=Math.round((J.value+n)*ee)/ee,t=clamp(e,a,U.value);t!==J.value&&(J.value=t,F.value=te(t,I),be(),he(t,U.value))}else{const e=Math.round((J.value+n)*ee)/ee,t=clamp(e,a,r);t!==J.value&&(J.value=t,F.value=te(t,I),be(),he(t,t))}},[s,i,ee,N,a,r,te,I,F,J,U,he,be]),Ae=H.thumbDiameter/2,De=s?_.colors.surface.disabled:W,He="inset"===l?{backgroundColor:De,borderColor:_.colors.background.elevated,borderWidth:Math.max(2,Math.round(.3*H.thumbDiameter)),...NO_SHADOW}:"minimal"===l?{backgroundColor:De,borderWidth:0}:"bar"===l?{backgroundColor:"transparent",borderWidth:0,...NO_SHADOW}:{backgroundColor:_.colors.background.elevated,borderColor:De},Me=useAnimatedStyle(()=>{const e=Z.value;if(e<=0)return{opacity:0,transform:[{translateX:0},{scaleX:1}]};const t=s?.55:1;if(N){const a=Math.max(0,G.value-F.value+2*M);return{opacity:t,transform:[{translateX:F.value-M},{scaleX:a/e}]}}return{opacity:t,transform:[{translateX:F.value+M-e},{scaleX:1}]}}),Oe=useAnimatedStyle(()=>({transform:[{translateX:F.value-Ae},{scale:K.value}]})),Ee=useAnimatedStyle(()=>({transform:[{translateX:G.value-Ae},{scale:Y.value}]})),je=useAnimatedStyle(()=>({opacity:q.value})),Te=useAnimatedStyle(()=>({opacity:Q.value})),clampDisplay=e=>clamp(e,a,r),Ve=clampDisplay(N?Math.min(...X):X),Re=clampDisplay(N?Math.max(...X):X);return _jsx(View,{ref:t,style:[V.container,p,g],testID:x,accessibilityRole:"adjustable",accessibilityLabel:h,accessibilityState:{disabled:s},"aria-disabled":s,accessibilityValue:N?{min:a,max:r,now:Ve,text:`${Ve} to ${Re}`}:{min:a,max:r,now:Ve},accessibilityActions:[{name:"increment"},{name:"decrement"}],onAccessibilityAction:_e,children:_jsx(Pressable,{onPress:xe,disabled:s||N,style:V.trackTouch,accessibilityElementsHidden:!0,importantForAccessibility:"no-hide-descendants",children:_jsxs(View,{style:V.trackWrap,onLayout:de,children:[_jsxs(View,{style:V.trackClip,pointerEvents:"none",children:[_jsx(View,{style:[V.track,{backgroundColor:s?_.colors.surface.disabled:_.colors.border.primary},f]}),_jsx(Animated.View,{style:[V.fill,{backgroundColor:s?_.colors.surface.disabled:W},y,Me]})]}),_jsx(GestureDetector,{gesture:ke,children:_jsx(Animated.View,{style:[V.thumb,{width:H.thumbDiameter,height:H.thumbDiameter,borderRadius:Ae,...smoothCorners,opacity:s?.55:1},He,v,Oe],accessibilityElementsHidden:!0,importantForAccessibility:"no-hide-descendants",children:u?_jsxs(Animated.View,{style:[V.bubbleWrap,je],pointerEvents:"none",children:[_jsx(View,{style:[V.bubble,{backgroundColor:W}],children:d?d(Ve):_jsx(Text,{style:[V.bubbleText,{color:L},w],numberOfLines:1,children:m(Ve)})}),_jsx(View,{style:[V.bubbleCaret,{backgroundColor:W}]})]}):null})}),N?_jsx(GestureDetector,{gesture:Ce,children:_jsx(Animated.View,{style:[V.thumb,{width:H.thumbDiameter,height:H.thumbDiameter,borderRadius:Ae,...smoothCorners,opacity:s?.55:1},He,v,Ee],accessibilityElementsHidden:!0,importantForAccessibility:"no-hide-descendants",children:u?_jsxs(Animated.View,{style:[V.bubbleWrap,Te],pointerEvents:"none",children:[_jsx(View,{style:[V.bubble,{backgroundColor:W}],children:d?d(Re):_jsx(Text,{style:[V.bubbleText,{color:L},w],numberOfLines:1,children:m(Re)})}),_jsx(View,{style:[V.bubbleCaret,{backgroundColor:W}]})]}):null})}):null]})})})});Slider.displayName="Slider";const buildStyles=(e,t)=>{const a=e.shadows.md,r=Math.max(t.thumbDiameter,t.trackHeight),i=r/2+4;return StyleSheet.create({container:{width:"100%",paddingVertical:i,justifyContent:"center"},trackTouch:{width:"100%",justifyContent:"center"},trackWrap:{width:"100%",height:r,justifyContent:"center"},trackClip:{position:"absolute",left:0,right:0,height:t.trackHeight,top:(r-t.trackHeight)/2,borderRadius:t.trackHeight/2,...smoothCorners,overflow:"hidden"},track:{position:"absolute",top:0,right:0,bottom:0,left:0,borderRadius:t.trackHeight/2,...smoothCorners},fill:{position:"absolute",top:0,left:0,width:"100%",height:t.trackHeight,borderRadius:t.trackHeight/2,...smoothCorners,transformOrigin:"left"},thumb:{position:"absolute",top:(r-t.thumbDiameter)/2,left:0,borderWidth:2,shadowColor:a.shadowColor,shadowOffset:a.shadowOffset,shadowOpacity:a.shadowOpacity,shadowRadius:a.shadowRadius,elevation:a.elevation,alignItems:"center",justifyContent:"center"},bubbleWrap:{position:"absolute",bottom:t.thumbDiameter+2,left:t.thumbDiameter/2-80,width:160,alignItems:"center"},bubbleCaret:{width:8,height:8,marginTop:-5,borderRadius:1,...smoothCorners,transform:[{rotate:"45deg"}]},bubble:{paddingHorizontal:e.spacing.sm,paddingVertical:e.spacing.xxs,borderRadius:e.radius.md,...smoothCorners,minWidth:36,alignItems:"center",justifyContent:"center",...Platform.select({ios:{shadowColor:e.shadows.sm.shadowColor,shadowOffset:e.shadows.sm.shadowOffset,shadowOpacity:e.shadows.sm.shadowOpacity,shadowRadius:e.shadows.sm.shadowRadius},android:{elevation:e.shadows.sm.elevation},default:{}})},bubbleText:{color:e.colors.onPrimary,fontSize:e.typography.fontSize.xs,fontWeight:e.typography.fontWeight.semibold}})};export{Slider};export default Slider;

package/lib/module/components/SliderField/SliderField.js

@@ -1 +1 @@
-"use strict";import{forwardRef,useCallback,useMemo,useRef}from"react";import{Pressable,StyleSheet,Text,TextInput,View}from"react-native";import{useControllableState}from"../../hooks/index.js";import{useTheme}from"../../theme/index.js";import{AppIcon,renderSlotIcon}from"../AppIcon/index.js";import{FieldBase,FieldLabel,FieldMessage,hasFieldText,resolveFieldSize,resolveFieldTextStyle}from"../FieldBase/FieldBase.js";import{IconButton}from"../IconButton/index.js";import{Slider}from"../Slider/index.js";import{CountingText,clampValue,sliderToneInk,snapValue,useValueDraft}from"../Slider/valueText.js";import{Tooltip}from"../Tooltip/index.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const DEFAULT_INPUT_WIDTH=72,defaultFormatValue=e=>String(e),stepDecimals=e=>String(e).split(".")[1]?.length??0,ValueBox=({draft:e,error:t,disabled:l,width:i,accessibilityLabel:s,style:o,testID:a})=>{const n=useTheme(),r=resolveFieldSize(n,"sm"),d=resolveFieldTextStyle(n,{disabled:l}),c=useRef(null),u=useCallback(()=>{l||c.current?.focus()},[l]);return _jsx(FieldBase,{size:"sm",focused:e.editing,disabled:l,error:t,filled:!0,width:i,onPress:u,pressFeedback:!1,paddingHorizontal:n.spacing.sm,gap:n.spacing.xs,trailing:t?_jsx(AppIcon,{name:"info-circle",size:r.iconSize,color:n.colors.error}):void 0,style:o,children:_jsx(TextInput,{ref:c,style:[styles.boxInput,{color:d.color,fontSize:r.fontSize,...d.weightStyle}],value:e.text,onChangeText:e.onChangeText,onFocus:e.onFocus,onBlur:e.onBlur,onSubmitEditing:e.onBlur,editable:!l,keyboardType:"decimal-pad",returnKeyType:"done",textAlign:"center",selectionColor:n.colors.primary,accessibilityLabel:s,accessibilityState:{disabled:l},testID:a})})},SliderField=forwardRef((e,t)=>{const{label:l,unit:i,info:s,required:o=!1,helperText:a,error:n,min:r=0,max:d=100,step:c=1,disabled:u=!1,tone:p="primary",size:x,variant:b,haptic:m,showBubble:h=!0,showBounds:y=!0,showInput:f=!1,showStepper:g=!1,startIcon:S,endIcon:I,startLabel:j,endLabel:T,formatValue:w=defaultFormatValue,parseInput:_,animationDuration:v,inputWidth:V=DEFAULT_INPUT_WIDTH,accessibilityLabel:F,style:z,labelStyle:D,boundStyle:B,sliderStyle:L,inputStyle:C,testID:$}=e,A=useTheme(),W=useMemo(()=>buildStyles(A),[A]),M=v??A.motion.duration.fast,P=!0===e.range,k=!0===n||hasFieldText(n),R=stepDecimals(c),[H,U]=useControllableState({value:e.value,defaultValue:e.defaultValue??(P?[r,d]:r),onChange:e.onChange}),[E,N]=P?H:[H,d],q=clampValue(Math.min(E,N),r,d),K=clampValue(Math.max(E,N),r,d),G=useValueDraft({value:q,min:r,max:d,step:c,format:w,parse:_,onChange:e=>U(P?[Math.min(e,K),K]:e)}),J=useValueDraft({value:K,min:r,max:d,step:c,format:w,parse:_,onChange:e=>U([q,Math.max(e,q)])}),stepBy=e=>{const t=snapValue(q+e*c,r,d,c);t!==q&&U(t)},O={color:u?A.colors.text.disabled:A.colors.text.secondary,size:A.components.field?.md?.iconSize??18,disabled:u},Q=[W.bubbleText,{color:sliderToneInk(A,p),fontWeight:A.typography.fontWeight.semibold}],boundText=e=>_jsx(Text,{style:[W.bound,{color:u?A.colors.text.disabled:A.colors.text.secondary},B],children:e}),X={min:r,max:d,step:c,disabled:u,tone:p,size:x,variant:b,haptic:m,showLabel:!!h&&"always",renderLabel:h?e=>_jsx(CountingText,{value:e,format:w,decimals:R,duration:M,style:Q,testID:$&&!P?`${$}-bubble`:void 0}):void 0,accessibilityLabel:F??l,style:L,testID:$?`${$}-slider`:void 0};return _jsxs(View,{ref:t,style:[W.container,z],testID:$,children:[l?_jsxs(View,{style:W.labelRow,children:[_jsx(FieldLabel,{required:o,style:D,children:l}),i?_jsx(Text,{style:[W.unit,{color:A.colors.text.tertiary}],children:i}):null,s?_jsx(Tooltip,{content:s,trigger:"press",placement:"top",children:_jsx(Pressable,{accessibilityRole:"button",accessibilityLabel:`About ${l}`,hitSlop:8,style:W.infoButton,children:_jsx(AppIcon,{name:"info-circle",variant:"bold",size:16,color:A.colors.text.tertiary})})}):null]}):null,_jsxs(View,{style:[W.row,h?W.rowWithBubble:null],children:[S?_jsx(View,{children:renderSlotIcon(S,O)}):null,g&&!P?_jsx(IconButton,{icon:e=>_jsx(AppIcon,{name:"minus",size:e.size,color:e.color}),onPress:()=>stepBy(-1),accessibilityLabel:"Decrease",variant:"ghost",tone:"neutral",size:"sm",disabled:u||q<=r,haptic:m,testID:$?`${$}-minus`:void 0}):null,P&&f?_jsx(ValueBox,{draft:G,error:k,disabled:u,width:V,accessibilityLabel:`${l??"Value"} low`,style:C,testID:$?`${$}-input-low`:void 0}):y?boundText(j??w(r)):null,_jsx(View,{style:W.sliderWrap,children:_jsx(Slider,P?{...X,range:!0,value:[q,K],onChange:U}:{...X,value:q,onChange:U})}),P&&f?_jsx(ValueBox,{draft:J,error:k,disabled:u,width:V,accessibilityLabel:`${l??"Value"} high`,style:C,testID:$?`${$}-input-high`:void 0}):y?boundText(T??w(d)):null,g&&!P?_jsx(IconButton,{icon:e=>_jsx(AppIcon,{name:"add",size:e.size,color:e.color}),onPress:()=>stepBy(1),accessibilityLabel:"Increase",variant:"ghost",tone:"neutral",size:"sm",disabled:u||q>=d,haptic:m,testID:$?`${$}-plus`:void 0}):null,I?_jsx(View,{children:renderSlotIcon(I,O)}):null,!P&&f?_jsx(ValueBox,{draft:G,error:k,disabled:u,width:V,accessibilityLabel:`${l??"Value"} value`,style:C,testID:$?`${$}-input`:void 0}):null]}),_jsx(FieldMessage,{text:k?n:a,error:k})]})});SliderField.displayName="SliderField";const styles=StyleSheet.create({boxInput:{flex:1,padding:0,margin:0,includeFontPadding:!1}}),buildStyles=e=>StyleSheet.create({container:{width:"100%"},labelRow:{flexDirection:"row",alignItems:"center",gap:e.spacing.xs},unit:{fontSize:e.typography.fontSize.xs},infoButton:{marginLeft:e.spacing.xxs},row:{flexDirection:"row",alignItems:"center",gap:e.spacing.sm},rowWithBubble:{marginTop:e.spacing.lg},sliderWrap:{flex:1,paddingHorizontal:10},bound:{fontSize:e.typography.fontSize.sm,fontVariant:["tabular-nums"]},bubbleText:{fontSize:e.typography.fontSize.xs,fontVariant:["tabular-nums"]}});export{SliderField};export default SliderField;
+"use strict";import{forwardRef,useCallback,useMemo,useRef}from"react";import{Pressable,StyleSheet,Text,TextInput,View}from"react-native";import{useControllableState}from"../../hooks/index.js";import{useTheme}from"../../theme/index.js";import{AppIcon,renderSlotIcon}from"../AppIcon/index.js";import{FieldBase,FieldLabel,FieldMessage,hasFieldText,resolveFieldSize,resolveFieldTextStyle}from"../FieldBase/FieldBase.js";import{IconButton}from"../IconButton/index.js";import{Slider}from"../Slider/index.js";import{CountingText,clampValue,sliderToneInk,snapValue,useValueDraft}from"../Slider/valueText.js";import{Tooltip}from"../Tooltip/index.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const DEFAULT_INPUT_WIDTH=72,defaultFormatValue=e=>String(e),stepDecimals=e=>String(e).split(".")[1]?.length??0,ValueBox=({draft:e,error:t,disabled:l,width:i,accessibilityLabel:s,style:o,testID:a})=>{const n=useTheme(),r=resolveFieldSize(n,"sm"),d=resolveFieldTextStyle(n,{disabled:l}),c=useRef(null),u=useCallback(()=>{l||c.current?.focus()},[l]);return _jsx(FieldBase,{size:"sm",focused:e.editing,disabled:l,error:t,filled:!0,width:i,onPress:u,pressFeedback:!1,paddingHorizontal:n.spacing.sm,gap:n.spacing.xs,trailing:t?_jsx(AppIcon,{name:"info-circle",size:r.iconSize,color:n.colors.toneText.error}):void 0,style:o,children:_jsx(TextInput,{ref:c,style:[styles.boxInput,{color:d.color,fontSize:r.fontSize,...d.weightStyle}],value:e.text,onChangeText:e.onChangeText,onFocus:e.onFocus,onBlur:e.onBlur,onSubmitEditing:e.onBlur,editable:!l,keyboardType:"decimal-pad",returnKeyType:"done",textAlign:"center",selectionColor:n.colors.primary,accessibilityLabel:s,accessibilityState:{disabled:l},"aria-disabled":l,testID:a})})},SliderField=forwardRef((e,t)=>{const{label:l,unit:i,info:s,required:o=!1,helperText:a,error:n,min:r=0,max:d=100,step:c=1,disabled:u=!1,tone:p="primary",size:x,variant:b,haptic:m,showBubble:h=!0,showBounds:y=!0,showInput:f=!1,showStepper:g=!1,startIcon:S,endIcon:I,startLabel:j,endLabel:T,formatValue:w=defaultFormatValue,parseInput:_,animationDuration:v,inputWidth:V=DEFAULT_INPUT_WIDTH,accessibilityLabel:F,style:z,labelStyle:D,boundStyle:B,sliderStyle:L,inputStyle:C,testID:$}=e,A=useTheme(),W=useMemo(()=>buildStyles(A),[A]),M=v??A.motion.duration.fast,P=!0===e.range,k=!0===n||hasFieldText(n),R=stepDecimals(c),[H,U]=useControllableState({value:e.value,defaultValue:e.defaultValue??(P?[r,d]:r),onChange:e.onChange}),[E,N]=P?H:[H,d],q=clampValue(Math.min(E,N),r,d),K=clampValue(Math.max(E,N),r,d),G=useValueDraft({value:q,min:r,max:d,step:c,format:w,parse:_,onChange:e=>U(P?[Math.min(e,K),K]:e)}),J=useValueDraft({value:K,min:r,max:d,step:c,format:w,parse:_,onChange:e=>U([q,Math.max(e,q)])}),stepBy=e=>{const t=snapValue(q+e*c,r,d,c);t!==q&&U(t)},O={color:u?A.colors.text.disabled:A.colors.text.secondary,size:A.components.field?.md?.iconSize??18,disabled:u},Q=[W.bubbleText,{color:sliderToneInk(A,p),fontWeight:A.typography.fontWeight.semibold}],boundText=e=>_jsx(Text,{style:[W.bound,{color:u?A.colors.text.disabled:A.colors.text.secondary},B],children:e}),X={min:r,max:d,step:c,disabled:u,tone:p,size:x,variant:b,haptic:m,showLabel:!!h&&"always",renderLabel:h?e=>_jsx(CountingText,{value:e,format:w,decimals:R,duration:M,style:Q,testID:$&&!P?`${$}-bubble`:void 0}):void 0,accessibilityLabel:F??l,style:L,testID:$?`${$}-slider`:void 0};return _jsxs(View,{ref:t,style:[W.container,z],testID:$,children:[l?_jsxs(View,{style:W.labelRow,children:[_jsx(FieldLabel,{required:o,style:D,children:l}),i?_jsx(Text,{style:[W.unit,{color:A.colors.text.tertiary}],children:i}):null,s?_jsx(Tooltip,{content:s,trigger:"press",placement:"top",children:_jsx(Pressable,{accessibilityRole:"button",accessibilityLabel:`About ${l}`,hitSlop:8,style:W.infoButton,children:_jsx(AppIcon,{name:"info-circle",variant:"bold",size:16,color:A.colors.text.tertiary})})}):null]}):null,_jsxs(View,{style:[W.row,h?W.rowWithBubble:null],children:[S?_jsx(View,{children:renderSlotIcon(S,O)}):null,g&&!P?_jsx(IconButton,{icon:e=>_jsx(AppIcon,{name:"minus",size:e.size,color:e.color}),onPress:()=>stepBy(-1),accessibilityLabel:"Decrease",variant:"ghost",tone:"neutral",size:"sm",disabled:u||q<=r,haptic:m,testID:$?`${$}-minus`:void 0}):null,P&&f?_jsx(ValueBox,{draft:G,error:k,disabled:u,width:V,accessibilityLabel:`${l??"Value"} low`,style:C,testID:$?`${$}-input-low`:void 0}):y?boundText(j??w(r)):null,_jsx(View,{style:W.sliderWrap,children:_jsx(Slider,P?{...X,range:!0,value:[q,K],onChange:U}:{...X,value:q,onChange:U})}),P&&f?_jsx(ValueBox,{draft:J,error:k,disabled:u,width:V,accessibilityLabel:`${l??"Value"} high`,style:C,testID:$?`${$}-input-high`:void 0}):y?boundText(T??w(d)):null,g&&!P?_jsx(IconButton,{icon:e=>_jsx(AppIcon,{name:"add",size:e.size,color:e.color}),onPress:()=>stepBy(1),accessibilityLabel:"Increase",variant:"ghost",tone:"neutral",size:"sm",disabled:u||q>=d,haptic:m,testID:$?`${$}-plus`:void 0}):null,I?_jsx(View,{children:renderSlotIcon(I,O)}):null,!P&&f?_jsx(ValueBox,{draft:G,error:k,disabled:u,width:V,accessibilityLabel:`${l??"Value"} value`,style:C,testID:$?`${$}-input`:void 0}):null]}),_jsx(FieldMessage,{text:k?n:a,error:k})]})});SliderField.displayName="SliderField";const styles=StyleSheet.create({boxInput:{flex:1,padding:0,margin:0,includeFontPadding:!1}}),buildStyles=e=>StyleSheet.create({container:{width:"100%"},labelRow:{flexDirection:"row",alignItems:"center",gap:e.spacing.xs},unit:{fontSize:e.typography.fontSize.xs},infoButton:{marginLeft:e.spacing.xxs},row:{flexDirection:"row",alignItems:"center",gap:e.spacing.sm},rowWithBubble:{marginTop:e.spacing.lg},sliderWrap:{flex:1,paddingHorizontal:10},bound:{fontSize:e.typography.fontSize.sm,fontVariant:["tabular-nums"]},bubbleText:{fontSize:e.typography.fontSize.xs,fontVariant:["tabular-nums"]}});export{SliderField};export default SliderField;

package/lib/module/components/Spinner/Spinner.js

@@ -1 +1 @@
-"use strict";import React,{forwardRef,useEffect,useMemo,useRef}from"react";import{ActivityIndicator,Animated,Easing,StyleSheet,Text,View}from"react-native";import{createAnimatedValue,useTheme}from"../../theme/index.js";import{smoothCorners}from"../../utils/corners.js";import{squircleHostRadius}from"../../utils/squircle.js";import{SquircleFill,useSquircle}from"../SquircleFill/SquircleFill.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const sizeMap={sm:20,md:32,lg:48},DOT_COUNT=3,DOT_STAGGER_MS=150,DOT_CYCLE_MS=600,Dot=({size:e,color:t,delay:i,duration:r})=>{const s=useRef(createAnimatedValue(1)).current;return useEffect(()=>{const e=Animated.loop(Animated.sequence([Animated.delay(i),Animated.timing(s,{toValue:1.4,duration:r/2,easing:Easing.out(Easing.quad),useNativeDriver:!0}),Animated.timing(s,{toValue:1,duration:r/2,easing:Easing.in(Easing.quad),useNativeDriver:!0})]));return e.start(),()=>{e.stop()}},[s,i,r]),_jsx(Animated.View,{style:{width:e,height:e,borderRadius:e/2,...smoothCorners,backgroundColor:t,transform:[{scale:s}]}})},Spinner=forwardRef((e,t)=>{const{size:i="md",color:r,message:s,overlay:n=!1,backdropColor:o,variant:a="circular",accessibilityLabel:l,style:c,testID:u}=e,d=useTheme(),m=useRef(createAnimatedValue(0)).current;useEffect(()=>{Animated.timing(m,{toValue:1,duration:d.motion.duration.normal,easing:Easing.bezier(...d.motion.easing.standard),useNativeDriver:!0}).start()},[m,d]);const g=useMemo(()=>buildStyles(d),[d]),y=sizeMap[i],h=r??d.colors.primary,p=o??d.colors.background.overlay,f=useMemo(()=>{if("dots"===a){const e=Math.max(6,Math.round(y/4));return _jsx(View,{style:[g.dotsRow,{gap:Math.round(e/2)}],children:Array.from({length:3}).map((t,i)=>_jsx(Dot,{size:e,color:h,delay:150*i,duration:600},i))})}return _jsx(ActivityIndicator,{color:h,size:"sm"===i?"small":"large",style:{width:y,height:y}})},[a,i,y,h,g.dotsRow]),b=l??s??"Loading",x=useSquircle(n,d.radius.lg),S=x.active&&x.size?{borderRadius:squircleHostRadius(x.size.width,x.size.height,d.radius.lg)}:null,j=_jsxs(Animated.View,{ref:t,accessible:!0,accessibilityRole:"progressbar",accessibilityLiveRegion:"polite",accessibilityLabel:b,accessibilityState:{busy:!0},testID:u,onLayout:x.onLayout,style:[n?g.overlayContent:g.inlineContent,S,{opacity:m}],children:[x.active&&x.size?_jsx(SquircleFill,{width:x.size.width,height:x.size.height,radius:d.radius.lg,fill:d.colors.background.elevated}):null,f,s?_jsx(Text,{style:[g.message,{color:d.colors.text.primary,fontSize:d.typography.fontSize.base,fontWeight:d.typography.fontWeight.medium,marginTop:d.spacing.md}],numberOfLines:2,children:s}):null]});return _jsx(View,n?{pointerEvents:"auto",style:[g.overlay,{backgroundColor:p},c],children:j}:{style:[g.inline,c],children:j})});Spinner.displayName="Spinner";const buildStyles=e=>StyleSheet.create({inline:{alignItems:"center",justifyContent:"center"},inlineContent:{alignItems:"center",justifyContent:"center"},overlay:{...StyleSheet.absoluteFill,alignItems:"center",justifyContent:"center",zIndex:1e3},overlayContent:{alignItems:"center",justifyContent:"center",backgroundColor:e.colors.background.elevated,borderRadius:e.radius.lg,...smoothCorners,paddingHorizontal:e.spacing.xl,paddingVertical:e.spacing.xl,minWidth:140,...e.shadows.lg},dotsRow:{flexDirection:"row",alignItems:"center",justifyContent:"center"},message:{textAlign:"center"}});export{Spinner};export default Spinner;
+"use strict";import{forwardRef,useEffect,useMemo,useRef}from"react";import{ActivityIndicator,Animated,Easing,StyleSheet,Text,View}from"react-native";import{createAnimatedValue,useTheme}from"../../theme/index.js";import{smoothCorners}from"../../utils/corners.js";import{squircleHostRadius}from"../../utils/squircle.js";import{SquircleFill,useSquircle}from"../SquircleFill/SquircleFill.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const sizeMap={sm:20,md:32,lg:48},DOT_COUNT=3,DOT_STAGGER_MS=150,DOT_CYCLE_MS=600,Dot=({size:e,color:t,delay:i,duration:r})=>{const s=useRef(createAnimatedValue(1)).current;return useEffect(()=>{const e=Animated.loop(Animated.sequence([Animated.delay(i),Animated.timing(s,{toValue:1.4,duration:r/2,easing:Easing.out(Easing.quad),useNativeDriver:!0}),Animated.timing(s,{toValue:1,duration:r/2,easing:Easing.in(Easing.quad),useNativeDriver:!0})]));return e.start(),()=>{e.stop()}},[s,i,r]),_jsx(Animated.View,{style:{width:e,height:e,borderRadius:e/2,...smoothCorners,backgroundColor:t,transform:[{scale:s}]}})},Spinner=forwardRef((e,t)=>{const{size:i="md",color:r,message:s,overlay:n=!1,backdropColor:o,variant:a="circular",accessibilityLabel:l,style:c,testID:u}=e,d=useTheme(),m=useRef(createAnimatedValue(0)).current;useEffect(()=>{Animated.timing(m,{toValue:1,duration:d.motion.duration.normal,easing:Easing.bezier(...d.motion.easing.standard),useNativeDriver:!0}).start()},[m,d]);const g=useMemo(()=>buildStyles(d),[d]),y=sizeMap[i],h=r??d.colors.primary,p=o??d.colors.background.overlay,f=useMemo(()=>{if("dots"===a){const e=Math.max(6,Math.round(y/4));return _jsx(View,{style:[g.dotsRow,{gap:Math.round(e/2)}],children:Array.from({length:3}).map((t,i)=>_jsx(Dot,{size:e,color:h,delay:150*i,duration:600},i))})}return _jsx(ActivityIndicator,{color:h,size:"sm"===i?"small":"large",style:{width:y,height:y}})},[a,i,y,h,g.dotsRow]),b=l??s??"Loading",x=useSquircle(n,d.radius.lg),S=x.active&&x.size?{borderRadius:squircleHostRadius(x.size.width,x.size.height,d.radius.lg)}:null,j=_jsxs(Animated.View,{ref:t,accessible:!0,accessibilityRole:"progressbar",accessibilityLiveRegion:"polite",accessibilityLabel:b,accessibilityState:{busy:!0},"aria-busy":!0,testID:u,onLayout:x.onLayout,style:[n?g.overlayContent:g.inlineContent,S,{opacity:m}],children:[x.active&&x.size?_jsx(SquircleFill,{width:x.size.width,height:x.size.height,radius:d.radius.lg,fill:d.colors.background.elevated}):null,f,s?_jsx(Text,{style:[g.message,{color:d.colors.text.primary,fontSize:d.typography.fontSize.base,fontWeight:d.typography.fontWeight.medium,marginTop:d.spacing.md}],numberOfLines:2,children:s}):null]});return _jsx(View,n?{pointerEvents:"auto",style:[g.overlay,{backgroundColor:p},c],children:j}:{style:[g.inline,c],children:j})});Spinner.displayName="Spinner";const buildStyles=e=>StyleSheet.create({inline:{alignItems:"center",justifyContent:"center"},inlineContent:{alignItems:"center",justifyContent:"center"},overlay:{...StyleSheet.absoluteFill,alignItems:"center",justifyContent:"center",zIndex:1e3},overlayContent:{alignItems:"center",justifyContent:"center",backgroundColor:e.colors.background.elevated,borderRadius:e.radius.lg,...smoothCorners,paddingHorizontal:e.spacing.xl,paddingVertical:e.spacing.xl,minWidth:140,...e.shadows.lg},dotsRow:{flexDirection:"row",alignItems:"center",justifyContent:"center"},message:{textAlign:"center"}});export{Spinner};export default Spinner;

package/lib/module/components/StatusBadge/StatusBadge.js

@@ -1 +1 @@
-"use strict";import React,{forwardRef,useMemo}from"react";import{StyleSheet,Text,View}from"react-native";import{fontFor,useTheme}from"../../theme/index.js";import{tintOf}from"../../utils/color.js";import{smoothCorners}from"../../utils/corners.js";import{Skeleton}from"../Skeleton/index.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const sizeMap={sm:{height:22,paddingH:8,fontSize:11,dot:5,gap:5},md:{height:24,paddingH:10,fontSize:12,dot:6,gap:6}},SOFT_FILL_OPACITY=.14,SOFT_BORDER_OPACITY=.4,BORDER_WIDTH=1,toneFor=(e,t)=>{switch(t){case"success":return{base:e.colors.success,on:e.colors.onSuccess};case"warning":return{base:e.colors.warning,on:e.colors.onWarning};case"error":return{base:e.colors.error,on:e.colors.onError};case"info":return{base:e.colors.info,on:e.colors.onInfo};case"primary":return{base:e.colors.primary,on:e.colors.onPrimary};default:return{base:e.colors.text.secondary,on:e.colors.text.inverse}}},isHex=e=>"string"==typeof e&&/^#[0-9a-f]{6}$/i.test(e),paletteFor=(e,t,o,r)=>{const s=isHex(r),{base:a,on:n}=s?{base:r,on:e.colors.text.inverse}:toneFor(e,t),i=!s&&"neutral"===t,l=i?e.colors.background.tertiary:tintOf(a,.14,e.colors.background.secondary),d=i?e.colors.border.primary:tintOf(a,.4,a);switch(o){case"solid":return{fill:a,border:a,text:n,dot:n};case"outline":return{fill:"transparent",border:i?d:a,text:a,dot:a};default:return{fill:l,border:d,text:a,dot:a}}},StatusBadge=forwardRef((e,t)=>{const{label:o,tone:r="neutral",variant:s="soft",size:a="md",dot:n=!1,color:i,loading:l=!1,accessibilityLabel:d,style:c,textStyle:u,testID:g}=e,f=useTheme(),m=sizeMap[a],b=useMemo(()=>paletteFor(f,r,s,i),[f,r,s,i]);return l?_jsx(StatusBadgeSkeleton,{...e}):_jsxs(View,{ref:t,accessible:!0,accessibilityRole:"text",accessibilityLabel:d??o,testID:g,style:[styles.base,{minHeight:m.height,paddingHorizontal:m.paddingH,borderRadius:f.radius.full,...smoothCorners,backgroundColor:b.fill,borderColor:b.border,borderWidth:1},c],children:[n?_jsx(View,{testID:"status-badge-dot",style:{width:m.dot,height:m.dot,borderRadius:m.dot/2,marginRight:m.gap,backgroundColor:b.dot}}):null,_jsx(Text,{style:[styles.label,{color:b.text,fontSize:m.fontSize,...fontFor(f,"semibold")},u],numberOfLines:1,maxFontSizeMultiplier:f.maxFontSizeMultiplier,children:o})]})});StatusBadge.displayName="StatusBadge";const StatusBadgeSkeleton=({label:e,size:t="md",dot:o,style:r})=>{const s=sizeMap[t],a=Math.max(32,Math.min(120,6.5*(e??"").length))+2*s.paddingH+(o?s.dot+s.gap:0);return _jsx(Skeleton,{width:a,height:s.height,radius:s.height/2,style:[styles.skeleton,r]})};StatusBadgeSkeleton.displayName="StatusBadgeSkeleton",StatusBadge.Skeleton=StatusBadgeSkeleton;const styles=StyleSheet.create({base:{alignSelf:"flex-start",flexDirection:"row",alignItems:"center",justifyContent:"center"},label:{textAlign:"center",includeFontPadding:!1,textAlignVertical:"center"},skeleton:{alignSelf:"flex-start"}});export{StatusBadge};export default StatusBadge;
+"use strict";import{forwardRef,useMemo}from"react";import{StyleSheet,Text,View}from"react-native";import{fontFor,useTheme}from"../../theme/index.js";import{tintOf}from"../../utils/color.js";import{smoothCorners}from"../../utils/corners.js";import{Skeleton}from"../Skeleton/index.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const sizeMap={sm:{height:22,paddingH:8,fontSize:11,dot:5,gap:5},md:{height:24,paddingH:10,fontSize:12,dot:6,gap:6}},SOFT_FILL_OPACITY=.14,SOFT_BORDER_OPACITY=.4,BORDER_WIDTH=1,toneFor=(e,t)=>{const{toneText:o}=e.colors;switch(t){case"success":return{base:e.colors.success,on:e.colors.onSuccess,ink:o.success};case"warning":return{base:e.colors.warning,on:e.colors.onWarning,ink:o.warning};case"error":return{base:e.colors.error,on:e.colors.onError,ink:o.error};case"info":return{base:e.colors.info,on:e.colors.onInfo,ink:o.info};case"primary":return{base:e.colors.primary,on:e.colors.onPrimary,ink:o.primary};default:return{base:e.colors.text.secondary,on:e.colors.text.inverse,ink:e.colors.text.secondary}}},isHex=e=>"string"==typeof e&&/^#[0-9a-f]{6}$/i.test(e),paletteFor=(e,t,o,r)=>{const s=isHex(r),{base:n,on:a,ink:i}=s?{base:r,on:e.colors.text.inverse,ink:r}:toneFor(e,t),l=!s&&"neutral"===t,d=l?e.colors.background.tertiary:tintOf(n,.14,e.colors.background.secondary),c=l?e.colors.border.primary:tintOf(n,.4,n);switch(o){case"solid":return{fill:n,border:n,text:a,dot:a};case"outline":return{fill:"transparent",border:l?c:n,text:i,dot:n};default:return{fill:d,border:c,text:i,dot:n}}},StatusBadge=forwardRef((e,t)=>{const{label:o,tone:r="neutral",variant:s="soft",size:n="md",dot:a=!1,color:i,loading:l=!1,accessibilityLabel:d,style:c,textStyle:u,testID:g}=e,f=useTheme(),m=sizeMap[n],x=useMemo(()=>paletteFor(f,r,s,i),[f,r,s,i]);return l?_jsx(StatusBadgeSkeleton,{...e}):_jsxs(View,{ref:t,accessible:!0,accessibilityRole:"text",accessibilityLabel:d??o,testID:g,style:[styles.base,{minHeight:m.height,paddingHorizontal:m.paddingH,borderRadius:f.radius.full,...smoothCorners,backgroundColor:x.fill,borderColor:x.border,borderWidth:1},c],children:[a?_jsx(View,{testID:"status-badge-dot",style:{width:m.dot,height:m.dot,borderRadius:m.dot/2,marginRight:m.gap,backgroundColor:x.dot}}):null,_jsx(Text,{style:[styles.label,{color:x.text,fontSize:m.fontSize,...fontFor(f,"semibold")},u],numberOfLines:1,maxFontSizeMultiplier:f.maxFontSizeMultiplier,children:o})]})});StatusBadge.displayName="StatusBadge";const StatusBadgeSkeleton=({label:e,size:t="md",dot:o,style:r})=>{const s=sizeMap[t],n=Math.max(32,Math.min(120,6.5*(e??"").length))+2*s.paddingH+(o?s.dot+s.gap:0);return _jsx(Skeleton,{width:n,height:s.height,radius:s.height/2,style:[styles.skeleton,r]})};StatusBadgeSkeleton.displayName="StatusBadgeSkeleton",StatusBadge.Skeleton=StatusBadgeSkeleton;const styles=StyleSheet.create({base:{alignSelf:"flex-start",flexDirection:"row",alignItems:"center",justifyContent:"center"},label:{textAlign:"center",includeFontPadding:!1,textAlignVertical:"center"},skeleton:{alignSelf:"flex-start"}});export{StatusBadge};export default StatusBadge;

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

@@ -1 +1 @@
-"use strict";import React,{forwardRef,useEffect,useMemo,useRef,useState}from"react";import{Animated,Easing,Pressable,StyleSheet,Text,View}from"react-native";import{createAnimatedValue,useTheme}from"../../theme/index.js";import{smoothCorners}from"../../utils/corners.js";import{resolveHaptic,triggerHaptic}from"../../utils/hapticUtils.js";import{Skeleton}from"../Skeleton/index.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const CIRCLE_SIZE=24,SEGMENT_HEIGHT=4,SEGMENT_GAP=6,PULSE_SIZE=32,PULSE_DURATION=1100,toneColorFor=(e,t)=>"success"===t?e.colors.success:e.colors.primary,toneOnColorFor=(e,t)=>"success"===t?e.colors.onSuccess:e.colors.onPrimary,StepCircle=({index:e,step:t,status:i,toneColor:o,upcomingColor:s,upcomingFillColor:l,textOnColor:n,upcomingTextColor:r,interactive:a,canPress:c,totalSteps:p,onPress:u,circleSize:d,pulseSize:h,pulseEnabled:m,pulseDuration:y,circleSlotStyle:g})=>{const S="active"===i,x=useRef(createAnimatedValue(1)).current,b=useRef(createAnimatedValue(.5)).current;useEffect(()=>{if(!S||!m)return x.setValue(1),void b.setValue(0);const e=Animated.loop(Animated.parallel([Animated.sequence([Animated.timing(x,{toValue:1.4,duration:y,easing:Easing.out(Easing.ease),useNativeDriver:!0}),Animated.timing(x,{toValue:1,duration:0,useNativeDriver:!0})]),Animated.sequence([Animated.timing(b,{toValue:0,duration:y,easing:Easing.out(Easing.ease),useNativeDriver:!0}),Animated.timing(b,{toValue:.5,duration:0,useNativeDriver:!0})])]));return e.start(),()=>e.stop()},[S,x,b,m,y]);const f="upcoming"===i?l:o,w="upcoming"===i?s:o,C="upcoming"===i?r:n,v="complete"===i,j=`Step ${e+1} of ${p}, ${t.label}, ${i}`,_=_jsxs(View,{style:circleStyles.relative,children:[S&&m?_jsx(Animated.View,{pointerEvents:"none",style:[circleStyles.pulse,{width:h,height:h,borderRadius:h/2,...smoothCorners,backgroundColor:o,opacity:b,transform:[{scale:x}]}]}):null,_jsx(View,{style:[circleStyles.circle,{width:d,height:d,borderRadius:d/2,...smoothCorners,backgroundColor:f,borderColor:w},g],children:t.icon?t.icon:_jsx(Text,v?{style:[circleStyles.glyph,{color:C}],children:"✓"}:{style:[circleStyles.glyph,{color:C}],children:e+1})})]});return a?_jsx(Pressable,{onPress:()=>u(e),disabled:!c,accessibilityRole:"button",accessibilityLabel:j,accessibilityState:{selected:S,disabled:!c},hitSlop:8,children:_}):_jsx(View,{accessibilityRole:"text",accessibilityLabel:j,accessibilityState:{selected:S},children:_})},circleStyles=StyleSheet.create({relative:{alignItems:"center",justifyContent:"center"},pulse:{position:"absolute"},circle:{borderWidth:2,alignItems:"center",justifyContent:"center"},glyph:{fontSize:12,fontWeight:"600",includeFontPadding:!1}}),Stepper=forwardRef((e,t)=>{const{steps:i,activeStep:o,defaultActiveStep:s=0,pressMode:l="none",onStepPress:n,onActiveStepChange:r,variant:a="horizontal",tone:c="primary",formatCaption:p,showCaption:u=!0,loading:d=!1,accessibilityLabel:h,style:m,containerStyle:y,circleStyle:g,labelStyle:S,connectorStyle:x,haptic:b,testID:f}=e,w=useTheme(),C=w.components.stepper,v=C?.circleSize??24,j=C?.pulseSize??32,_=C?.pulseAnimation??!1,V=C?.pulseDuration??1100,k=resolveHaptic(b,"selection"),R=useMemo(()=>buildStyles(w),[w]),I=toneColorFor(w,c),A=w.colors.border.primary,D=w.colors.background.primary,E=w.colors.text.secondary,L=toneOnColorFor(w,c),T=i.length,$="none"!==l,P=void 0!==o,[z,F]=useState(s),B=P?o:z,N=null==B||B<0?null:B,O=i.map((e,t)=>(e=>null===N?"upcoming":e<N?"complete":e===N?"active":"upcoming")(t)),H=O.filter(e=>"upcoming"!==e).length,M=O.filter(e=>"complete"===e).length,canPressStatus=e=>"back"===l?"complete"===e:$,handleStepPress=e=>{if(!canPressStatus(O[e]))return;k&&triggerHaptic(k),n?.(e);const t="select"===l&&e===N?null:e;P||F(t),r?.(t)},G=useRef(createAnimatedValue(H)).current,U=useRef(H);useEffect(()=>{const e=U.current;if(e===H)return;U.current=H;const t=Animated.timing(G,{toValue:H,duration:w.motion.duration.normal*Math.abs(H-e),easing:Easing.linear,useNativeDriver:!1});return t.start(),()=>t.stop()},[H,G,w.motion]);const sliceOf=e=>G.interpolate({inputRange:[e,e+1],outputRange:["0%","100%"],extrapolate:"clamp"}),W=T<=1?"0%":G.interpolate({inputRange:[1,T],outputRange:["0%","100%"],extrapolate:"clamp"}),q=null!==N&&N<T?N:null,Z=h??(null!==q?`Progress: step ${q+1} of ${T}`:`Progress: ${M} of ${T} steps done`),[J,K]=useState(0),Q=T>0&&J>0?J/(2*T):0,X=_jsx(View,{ref:t,style:[R.container,y,m],testID:f,accessibilityRole:"progressbar",accessibilityLabel:Z,accessibilityValue:{min:0,max:T,now:H},children:"segmented"===a?(()=>{const e=null!==q?i[q]:void 0,t=u?p?p(q,T,e):null!==q?`Step ${q+1} of ${T}${e?.label?` · ${e.label}`:""}`:`${M} of ${T} done`:"";return _jsxs(View,{children:[u?_jsx(Text,{style:[R.sCaption,{color:w.colors.text.secondary,fontSize:w.typography.fontSize.sm,marginBottom:w.spacing.sm},S],numberOfLines:1,children:t}):null,_jsx(View,{style:R.sRow,children:i.map((e,t)=>{const i=O[t],o=`Step ${t+1} of ${T}, ${e.label}, ${i}`,s=_jsx(View,{testID:f?`${f}-segment-${t}`:void 0,style:[R.sTrack,{backgroundColor:A},x],children:_jsx(Animated.View,{style:[R.sFill,{backgroundColor:I,width:sliceOf(t)}]})});if($){const l=canPressStatus(i);return _jsx(Pressable,{style:R.sItem,onPress:()=>handleStepPress(t),disabled:!l,accessibilityRole:"button",accessibilityLabel:o,accessibilityState:{selected:"active"===i,disabled:!l},hitSlop:{top:12,bottom:12},children:s},e.key)}return _jsx(View,{style:R.sItem,accessibilityRole:"text",accessibilityLabel:o,accessibilityState:{selected:"active"===i},children:s},e.key)})})]})})():"vertical"===a?_jsx(View,{style:R.vCol,children:i.map((e,t)=>{const i=O[t],o=t===T-1;return _jsxs(View,{style:R.vRow,children:[_jsxs(View,{style:R.vLeft,children:[_jsx(StepCircle,{index:t,step:e,status:i,toneColor:I,upcomingColor:A,upcomingFillColor:D,onPressColor:I,textOnColor:L,upcomingTextColor:E,interactive:$,canPress:canPressStatus(i),totalSteps:T,onPress:handleStepPress,circleSize:v,pulseSize:j,pulseEnabled:_,pulseDuration:V,circleSlotStyle:g}),o?null:_jsxs(View,{style:[R.vConnectorContainer,x],children:[_jsx(View,{style:[R.vConnectorTrack,{backgroundColor:A}]}),_jsx(Animated.View,{style:[R.vConnectorFill,{backgroundColor:I,height:sliceOf(t+1)}]})]})]}),_jsxs(View,{style:R.vBody,children:[_jsx(Text,{style:[R.vLabel,{color:"upcoming"===i?w.colors.text.tertiary:w.colors.text.primary,fontSize:w.typography.fontSize.base,fontWeight:w.typography.fontWeight.semibold},S],numberOfLines:1,children:e?.label??" "}),e.description?_jsx(Text,{style:[R.vDescription,{color:w.colors.text.secondary,fontSize:w.typography.fontSize.sm}],numberOfLines:3,children:e.description}):null]})]},e.key)})}):_jsxs(View,{style:R.hRow,onLayout:e=>K(e.nativeEvent.layout.width),children:[_jsxs(View,{pointerEvents:"none",style:[R.hConnectorContainer,{left:Q,right:Q},x],children:[_jsx(View,{style:[R.hConnectorTrack,{backgroundColor:A}]}),_jsx(Animated.View,{style:[R.hConnectorFill,{backgroundColor:I,width:W}]})]}),i.map((e,t)=>{const i=O[t];return _jsxs(View,{style:R.hStepItem,children:[_jsx(StepCircle,{index:t,step:e,status:i,toneColor:I,upcomingColor:A,upcomingFillColor:D,onPressColor:I,textOnColor:L,upcomingTextColor:E,interactive:$,canPress:canPressStatus(i),totalSteps:T,onPress:handleStepPress,circleSize:v,pulseSize:j,pulseEnabled:_,pulseDuration:V,circleSlotStyle:g}),_jsx(Text,{style:[R.hLabel,{color:"upcoming"===i?w.colors.text.tertiary:w.colors.text.primary,fontSize:w.typography.fontSize.xs},S],numberOfLines:1,children:e?.label??" "})]},e.key)})]})});return d?_jsx(StepperSkeleton,{...e}):X});Stepper.displayName="Stepper";const StepperSkeleton=({steps:e,variant:t="horizontal",showCaption:i=!0,containerStyle:o,style:s,testID:l})=>{const n=useTheme(),r=n.components.stepper,a=r?.circleSize??24,c=useMemo(()=>buildStyles(n),[n]),p=e.length||3;return"segmented"===t?_jsxs(View,{style:[c.container,o,s],testID:l,accessibilityRole:"progressbar",accessibilityState:{busy:!0},children:[i?_jsx(Skeleton,{shape:"text",width:"45%",height:14,style:{marginBottom:n.spacing.sm}}):null,_jsx(View,{style:c.sRow,children:Array.from({length:p}).map((e,t)=>_jsx(View,{style:c.sItem,children:_jsx(Skeleton,{width:"100%",height:4,radius:2})},`sk-step-${t}`))})]}):_jsx(View,"vertical"===t?{style:[c.container,o,s],testID:l,accessibilityRole:"progressbar",accessibilityState:{busy:!0},children:_jsx(View,{style:skeletonStyles.vCol,children:Array.from({length:p}).map((e,t)=>{const i=t===p-1;return _jsxs(View,{style:skeletonStyles.vRow,children:[_jsxs(View,{style:[skeletonStyles.vLeft,{width:a+8}],children:[_jsx(Skeleton,{shape:"circle",width:a,height:a}),i?null:_jsx(Skeleton,{width:2,height:36})]}),_jsxs(View,{style:skeletonStyles.vBody,children:[_jsx(Skeleton,{shape:"text",width:"55%",height:16,style:{marginBottom:4}}),_jsx(Skeleton,{shape:"text",width:"80%",height:12})]})]},`sk-step-${t}`)})})}:{style:[c.container,o,s],testID:l,accessibilityRole:"progressbar",accessibilityState:{busy:!0},children:_jsxs(View,{style:c.hRow,children:[_jsx(View,{pointerEvents:"none",style:[c.hConnectorContainer,{left:50/p+"%",right:50/p+"%"}],children:_jsx(Skeleton,{width:"100%",height:2,radius:1})}),Array.from({length:p}).map((e,t)=>_jsxs(View,{style:c.hStepItem,children:[_jsx(Skeleton,{shape:"circle",width:a,height:a}),_jsx(Skeleton,{shape:"text",width:"80%",height:12,style:{marginTop:n.spacing.xs}})]},`sk-step-${t}`))]})})};StepperSkeleton.displayName="StepperSkeleton",Stepper.Skeleton=StepperSkeleton;const skeletonStyles=StyleSheet.create({vCol:{flexDirection:"column"},vRow:{flexDirection:"row",alignItems:"flex-start"},vLeft:{alignItems:"center"},vBody:{flex:1,paddingLeft:12,paddingBottom:16}}),buildStyles=e=>StyleSheet.create({container:{width:"100%"},hRow:{flexDirection:"row",alignItems:"flex-start",justifyContent:"space-between",position:"relative"},hConnectorContainer:{position:"absolute",top:11,height:2,flexDirection:"row",alignItems:"center"},hConnectorTrack:{position:"absolute",left:0,right:0,height:2,borderRadius:1,...smoothCorners},hConnectorFill:{position:"absolute",left:0,height:2,borderRadius:1,...smoothCorners},hStepItem:{alignItems:"center",flex:1},hLabel:{marginTop:e.spacing.xs,textAlign:"center"},vCol:{flexDirection:"column"},vRow:{flexDirection:"row",alignItems:"flex-start"},vLeft:{alignItems:"center",alignSelf:"stretch",width:32},vConnectorContainer:{flex:1,width:2,minHeight:32,position:"relative",alignSelf:"center"},vConnectorTrack:{position:"absolute",top:0,bottom:0,width:2,borderRadius:1,...smoothCorners},vConnectorFill:{position:"absolute",top:0,width:2,borderRadius:1,...smoothCorners},vBody:{flex:1,paddingLeft:e.spacing.sm,paddingBottom:e.spacing.md},vLabel:{marginBottom:2},vDescription:{},sCaption:{includeFontPadding:!1},sRow:{flexDirection:"row",columnGap:6},sItem:{flex:1},sTrack:{height:4,borderRadius:2,overflow:"hidden"},sFill:{height:4,borderRadius:2}});export{Stepper};export default Stepper;
+"use strict";import{forwardRef,useEffect,useMemo,useRef,useState}from"react";import{Animated,Easing,Pressable,StyleSheet,Text,View}from"react-native";import{createAnimatedValue,useTheme}from"../../theme/index.js";import{smoothCorners}from"../../utils/corners.js";import{resolveHaptic,triggerHaptic}from"../../utils/hapticUtils.js";import{Skeleton}from"../Skeleton/index.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const CIRCLE_SIZE=24,SEGMENT_HEIGHT=4,SEGMENT_GAP=6,PULSE_SIZE=32,PULSE_DURATION=1100,toneColorFor=(e,t)=>"success"===t?e.colors.success:e.colors.primary,toneOnColorFor=(e,t)=>"success"===t?e.colors.onSuccess:e.colors.onPrimary,StepCircle=({index:e,step:t,status:i,toneColor:s,upcomingColor:o,upcomingFillColor:l,textOnColor:r,upcomingTextColor:n,interactive:a,canPress:c,totalSteps:p,onPress:d,circleSize:u,pulseSize:h,pulseEnabled:m,pulseDuration:y,circleSlotStyle:g})=>{const S="active"===i,x=useRef(createAnimatedValue(1)).current,b=useRef(createAnimatedValue(.5)).current;useEffect(()=>{if(!S||!m)return x.setValue(1),void b.setValue(0);const e=Animated.loop(Animated.parallel([Animated.sequence([Animated.timing(x,{toValue:1.4,duration:y,easing:Easing.out(Easing.ease),useNativeDriver:!0}),Animated.timing(x,{toValue:1,duration:0,useNativeDriver:!0})]),Animated.sequence([Animated.timing(b,{toValue:0,duration:y,easing:Easing.out(Easing.ease),useNativeDriver:!0}),Animated.timing(b,{toValue:.5,duration:0,useNativeDriver:!0})])]));return e.start(),()=>e.stop()},[S,x,b,m,y]);const f="upcoming"===i?l:s,w="upcoming"===i?o:s,C="upcoming"===i?n:r,v="complete"===i,j=`Step ${e+1} of ${p}, ${t.label}, ${i}`,_=_jsxs(View,{style:circleStyles.relative,children:[S&&m?_jsx(Animated.View,{pointerEvents:"none",style:[circleStyles.pulse,{width:h,height:h,borderRadius:h/2,...smoothCorners,backgroundColor:s,opacity:b,transform:[{scale:x}]}]}):null,_jsx(View,{style:[circleStyles.circle,{width:u,height:u,borderRadius:u/2,...smoothCorners,backgroundColor:f,borderColor:w},g],children:t.icon?t.icon:_jsx(Text,v?{style:[circleStyles.glyph,{color:C}],children:"✓"}:{style:[circleStyles.glyph,{color:C}],children:e+1})})]});return a?_jsx(Pressable,{onPress:()=>d(e),disabled:!c,accessibilityRole:"button",accessibilityLabel:j,accessibilityState:{selected:S,disabled:!c},"aria-selected":S,"aria-disabled":!c,hitSlop:8,children:_}):_jsx(View,{accessibilityRole:"text",accessibilityLabel:j,accessibilityState:{selected:S},"aria-selected":S,children:_})},circleStyles=StyleSheet.create({relative:{alignItems:"center",justifyContent:"center"},pulse:{position:"absolute"},circle:{borderWidth:2,alignItems:"center",justifyContent:"center"},glyph:{fontSize:12,fontWeight:"600",includeFontPadding:!1}}),Stepper=forwardRef((e,t)=>{const{steps:i,activeStep:s,defaultActiveStep:o=0,pressMode:l="none",onStepPress:r,onActiveStepChange:n,variant:a="horizontal",tone:c="primary",formatCaption:p,showCaption:d=!0,loading:u=!1,accessibilityLabel:h,style:m,containerStyle:y,circleStyle:g,labelStyle:S,connectorStyle:x,haptic:b,testID:f}=e,w=useTheme(),C=w.components.stepper,v=C?.circleSize??24,j=C?.pulseSize??32,_=C?.pulseAnimation??!1,V=C?.pulseDuration??1100,k=resolveHaptic(b,"selection"),R=useMemo(()=>buildStyles(w),[w]),I=toneColorFor(w,c),A=w.colors.border.primary,D=w.colors.background.primary,E=w.colors.text.secondary,L=toneOnColorFor(w,c),T=i.length,$="none"!==l,P=void 0!==s,[z,F]=useState(o),B=P?s:z,N=null==B||B<0?null:B,O=i.map((e,t)=>(e=>null===N?"upcoming":e<N?"complete":e===N?"active":"upcoming")(t)),H=O.filter(e=>"upcoming"!==e).length,M=O.filter(e=>"complete"===e).length,canPressStatus=e=>"back"===l?"complete"===e:$,handleStepPress=e=>{if(!canPressStatus(O[e]))return;k&&triggerHaptic(k),r?.(e);const t="select"===l&&e===N?null:e;P||F(t),n?.(t)},G=useRef(createAnimatedValue(H)).current,U=useRef(H);useEffect(()=>{const e=U.current;if(e===H)return;U.current=H;const t=Animated.timing(G,{toValue:H,duration:w.motion.duration.normal*Math.abs(H-e),easing:Easing.linear,useNativeDriver:!1});return t.start(),()=>t.stop()},[H,G,w.motion]);const sliceOf=e=>G.interpolate({inputRange:[e,e+1],outputRange:["0%","100%"],extrapolate:"clamp"}),W=T<=1?"0%":G.interpolate({inputRange:[1,T],outputRange:["0%","100%"],extrapolate:"clamp"}),q=null!==N&&N<T?N:null,Z=h??(null!==q?`Progress: step ${q+1} of ${T}`:`Progress: ${M} of ${T} steps done`),[J,K]=useState(0),Q=T>0&&J>0?J/(2*T):0,X=_jsx(View,{ref:t,style:[R.container,y,m],testID:f,accessibilityRole:"progressbar",accessibilityLabel:Z,accessibilityValue:{min:0,max:T,now:H},children:"segmented"===a?(()=>{const e=null!==q?i[q]:void 0,t=d?p?p(q,T,e):null!==q?`Step ${q+1} of ${T}${e?.label?` · ${e.label}`:""}`:`${M} of ${T} done`:"";return _jsxs(View,{children:[d?_jsx(Text,{style:[R.sCaption,{color:w.colors.text.secondary,fontSize:w.typography.fontSize.sm,marginBottom:w.spacing.sm},S],numberOfLines:1,children:t}):null,_jsx(View,{style:R.sRow,children:i.map((e,t)=>{const i=O[t],s=`Step ${t+1} of ${T}, ${e.label}, ${i}`,o=_jsx(View,{testID:f?`${f}-segment-${t}`:void 0,style:[R.sTrack,{backgroundColor:A},x],children:_jsx(Animated.View,{style:[R.sFill,{backgroundColor:I,width:sliceOf(t)}]})});if($){const l=canPressStatus(i);return _jsx(Pressable,{style:R.sItem,onPress:()=>handleStepPress(t),disabled:!l,accessibilityRole:"button",accessibilityLabel:s,accessibilityState:{selected:"active"===i,disabled:!l},"aria-selected":"active"===i,"aria-disabled":!l,hitSlop:{top:12,bottom:12},children:o},e.key)}return _jsx(View,{style:R.sItem,accessibilityRole:"text",accessibilityLabel:s,accessibilityState:{selected:"active"===i},"aria-selected":"active"===i,children:o},e.key)})})]})})():"vertical"===a?_jsx(View,{style:R.vCol,children:i.map((e,t)=>{const i=O[t],s=t===T-1;return _jsxs(View,{style:R.vRow,children:[_jsxs(View,{style:R.vLeft,children:[_jsx(StepCircle,{index:t,step:e,status:i,toneColor:I,upcomingColor:A,upcomingFillColor:D,onPressColor:I,textOnColor:L,upcomingTextColor:E,interactive:$,canPress:canPressStatus(i),totalSteps:T,onPress:handleStepPress,circleSize:v,pulseSize:j,pulseEnabled:_,pulseDuration:V,circleSlotStyle:g}),s?null:_jsxs(View,{style:[R.vConnectorContainer,x],children:[_jsx(View,{style:[R.vConnectorTrack,{backgroundColor:A}]}),_jsx(Animated.View,{style:[R.vConnectorFill,{backgroundColor:I,height:sliceOf(t+1)}]})]})]}),_jsxs(View,{style:R.vBody,children:[_jsx(Text,{style:[R.vLabel,{color:"upcoming"===i?w.colors.text.tertiary:w.colors.text.primary,fontSize:w.typography.fontSize.base,fontWeight:w.typography.fontWeight.semibold},S],numberOfLines:1,children:e?.label??" "}),e.description?_jsx(Text,{style:[R.vDescription,{color:w.colors.text.secondary,fontSize:w.typography.fontSize.sm}],numberOfLines:3,children:e.description}):null]})]},e.key)})}):_jsxs(View,{style:R.hRow,onLayout:e=>K(e.nativeEvent.layout.width),children:[_jsxs(View,{pointerEvents:"none",style:[R.hConnectorContainer,{left:Q,right:Q},x],children:[_jsx(View,{style:[R.hConnectorTrack,{backgroundColor:A}]}),_jsx(Animated.View,{style:[R.hConnectorFill,{backgroundColor:I,width:W}]})]}),i.map((e,t)=>{const i=O[t];return _jsxs(View,{style:R.hStepItem,children:[_jsx(StepCircle,{index:t,step:e,status:i,toneColor:I,upcomingColor:A,upcomingFillColor:D,onPressColor:I,textOnColor:L,upcomingTextColor:E,interactive:$,canPress:canPressStatus(i),totalSteps:T,onPress:handleStepPress,circleSize:v,pulseSize:j,pulseEnabled:_,pulseDuration:V,circleSlotStyle:g}),_jsx(Text,{style:[R.hLabel,{color:"upcoming"===i?w.colors.text.tertiary:w.colors.text.primary,fontSize:w.typography.fontSize.xs},S],numberOfLines:1,children:e?.label??" "})]},e.key)})]})});return u?_jsx(StepperSkeleton,{...e}):X});Stepper.displayName="Stepper";const StepperSkeleton=({steps:e,variant:t="horizontal",showCaption:i=!0,containerStyle:s,style:o,testID:l})=>{const r=useTheme(),n=r.components.stepper,a=n?.circleSize??24,c=useMemo(()=>buildStyles(r),[r]),p=e.length||3;return"segmented"===t?_jsxs(View,{style:[c.container,s,o],testID:l,accessibilityRole:"progressbar",accessibilityState:{busy:!0},"aria-busy":!0,children:[i?_jsx(Skeleton,{shape:"text",width:"45%",height:14,style:{marginBottom:r.spacing.sm}}):null,_jsx(View,{style:c.sRow,children:Array.from({length:p}).map((e,t)=>_jsx(View,{style:c.sItem,children:_jsx(Skeleton,{width:"100%",height:4,radius:2})},`sk-step-${t}`))})]}):_jsx(View,"vertical"===t?{style:[c.container,s,o],testID:l,accessibilityRole:"progressbar",accessibilityState:{busy:!0},"aria-busy":!0,children:_jsx(View,{style:skeletonStyles.vCol,children:Array.from({length:p}).map((e,t)=>{const i=t===p-1;return _jsxs(View,{style:skeletonStyles.vRow,children:[_jsxs(View,{style:[skeletonStyles.vLeft,{width:a+8}],children:[_jsx(Skeleton,{shape:"circle",width:a,height:a}),i?null:_jsx(Skeleton,{width:2,height:36})]}),_jsxs(View,{style:skeletonStyles.vBody,children:[_jsx(Skeleton,{shape:"text",width:"55%",height:16,style:{marginBottom:4}}),_jsx(Skeleton,{shape:"text",width:"80%",height:12})]})]},`sk-step-${t}`)})})}:{style:[c.container,s,o],testID:l,accessibilityRole:"progressbar",accessibilityState:{busy:!0},"aria-busy":!0,children:_jsxs(View,{style:c.hRow,children:[_jsx(View,{pointerEvents:"none",style:[c.hConnectorContainer,{left:50/p+"%",right:50/p+"%"}],children:_jsx(Skeleton,{width:"100%",height:2,radius:1})}),Array.from({length:p}).map((e,t)=>_jsxs(View,{style:c.hStepItem,children:[_jsx(Skeleton,{shape:"circle",width:a,height:a}),_jsx(Skeleton,{shape:"text",width:"80%",height:12,style:{marginTop:r.spacing.xs}})]},`sk-step-${t}`))]})})};StepperSkeleton.displayName="StepperSkeleton",Stepper.Skeleton=StepperSkeleton;const skeletonStyles=StyleSheet.create({vCol:{flexDirection:"column"},vRow:{flexDirection:"row",alignItems:"flex-start"},vLeft:{alignItems:"center"},vBody:{flex:1,paddingLeft:12,paddingBottom:16}}),buildStyles=e=>StyleSheet.create({container:{width:"100%"},hRow:{flexDirection:"row",alignItems:"flex-start",justifyContent:"space-between",position:"relative"},hConnectorContainer:{position:"absolute",top:11,height:2,flexDirection:"row",alignItems:"center"},hConnectorTrack:{position:"absolute",left:0,right:0,height:2,borderRadius:1,...smoothCorners},hConnectorFill:{position:"absolute",left:0,height:2,borderRadius:1,...smoothCorners},hStepItem:{alignItems:"center",flex:1},hLabel:{marginTop:e.spacing.xs,textAlign:"center"},vCol:{flexDirection:"column"},vRow:{flexDirection:"row",alignItems:"flex-start"},vLeft:{alignItems:"center",alignSelf:"stretch",width:32},vConnectorContainer:{flex:1,width:2,minHeight:32,position:"relative",alignSelf:"center"},vConnectorTrack:{position:"absolute",top:0,bottom:0,width:2,borderRadius:1,...smoothCorners},vConnectorFill:{position:"absolute",top:0,width:2,borderRadius:1,...smoothCorners},vBody:{flex:1,paddingLeft:e.spacing.sm,paddingBottom:e.spacing.md},vLabel:{marginBottom:2},vDescription:{},sCaption:{includeFontPadding:!1},sRow:{flexDirection:"row",columnGap:6},sItem:{flex:1},sTrack:{height:4,borderRadius:2,overflow:"hidden"},sFill:{height:4,borderRadius:2}});export{Stepper};export default Stepper;

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

@@ -1 +1 @@
-"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;
+"use strict";import{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,j=useSharedValue(0),N=useSharedValue(0),R=useRef(null);useEffect(()=>()=>{cancelAnimation(j),cancelAnimation(N)},[j,N]);const P=useCallback(e=>{R.current!==e&&(R.current=e,o?.(e))},[o]),k=useCallback(()=>{null!==R.current&&(R.current=null,a?.())},[a]),T=useCallback(e=>{const t="left"===e?n:s,i=t?.[0];i&&(!1!==c&&triggerHaptic("notificationSuccess"),i.onPress(),j.value=withSpring(0,x),R.current=null,a?.())},[n,s,j,a,x,c]),F=useCallback(()=>{j.value=withSpring(0,x),k()},[j,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";N.value=j.value}).onUpdate(n=>{"worklet";const s=N.value+n.translationX;j.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=j.value;return a&&l>=n?(j.value=withSpring(i,SPRING_CONFIG),void runOnJS(T)("left")):c&&l<=s?(j.value=withSpring(r,SPRING_CONFIG),void runOnJS(T)("right")):a&&l>=o?(j.value=withSpring(e,SPRING_CONFIG),void runOnJS(P)("left")):c&&l<=-o?(j.value=withSpring(-t,SPRING_CONFIG),void runOnJS(P)("right")):(j.value=withSpring(0,x),void runOnJS(k)())})},[l,N,T,b,_,O,I,k,P,G,C,g,j,w,v,y,x,p]),V=useAnimatedStyle(()=>({transform:[{translateX:j.value}]})),B=useAnimatedStyle(()=>({opacity:I>0?Math.min(1,Math.max(0,j.value/I)):0})),M=useAnimatedStyle(()=>({opacity:G>0?Math.min(1,Math.max(0,-j.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/Switch/Switch.js

@@ -1 +1 @@
-"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;
+"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:i,defaultValue:s,onChange:r,disabled:a=!1,size:o="md",tone:n="primary",label:c,description:l,error:d,labelLines:u,layout:m="inline",accessibilityLabel:h,haptic:p="selection",bounce:b=!1,style:f,containerStyle:g,trackStyle:y,thumbStyle:w,testID:x,...S}=e,[C,k]=useControllableState({value:i,defaultValue:s??!1,onChange:r}),j=useTheme(),R={...sizeMap[o],...j.components.switch?.[o]??{}},v=j.components.switch?.thumbColor??"#FFFFFF",V=useMemo(()=>buildStyles(j),[j]),A="dark"===j.mode?j.colors.secondary:j.colors.surface.disabled,D=toneColor(j,n),H=useRef(createAnimatedValue(C?1:0)).current;useEffect(()=>{const e=Animated.spring(H,{toValue:C?1:0,damping:j.motion.spring.snappy.damping,stiffness:j.motion.spring.snappy.stiffness,mass:j.motion.spring.snappy.mass,useNativeDriver:!0});return e.start(),()=>e.stop()},[C,H,j.motion.spring.snappy]);const T=useRef(createAnimatedValue(C?1:0)).current;useEffect(()=>{const e=Animated.timing(T,{toValue:C?1:0,duration:j.motion.duration.fast,easing:Easing.out(Easing.ease),useNativeDriver:!1});return e.start(),()=>e.stop()},[C,T,j.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!==p&&triggerHaptic(p),k(!C),S.onPressOut?.(e))},I=h??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,j.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},"aria-checked":C,"aria-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},"aria-checked":C,"aria-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/Tabs/Tabs.js

@@ -1 +1 @@
-"use strict";import{forwardRef,useCallback,useEffect,useMemo,useRef,useState}from"react";import{Animated,Pressable,ScrollView,StyleSheet,Text,View}from"react-native";import{createAnimatedValue,useTheme}from"../../theme/index.js";import{resolveHaptic,triggerHaptic}from"../../utils/index.js";import{smoothCorners}from"../../utils/corners.js";import{renderSlotIcon}from"../AppIcon/slotIcon.js";import{segmentedControlSizes}from"../SegmentedControl/SegmentedControl.js";import{SquircleFill,useSquircle}from"../SquircleFill/SquircleFill.js";import{jsx as _jsx,jsxs as _jsxs,Fragment as _Fragment}from"react/jsx-runtime";const tabsSizes={sm:{fontSize:13,paddingVertical:8,paddingHorizontal:4,scrollablePaddingHorizontal:12,iconSize:16},md:{fontSize:15,paddingVertical:12,paddingHorizontal:8,scrollablePaddingHorizontal:16,iconSize:18},lg:{fontSize:17,paddingVertical:16,paddingHorizontal:12,scrollablePaddingHorizontal:24,iconSize:20}},Tabs=forwardRef((e,t)=>{const{tabs:i,activeKey:o,onChange:a,variant:r="underline",radius:n,size:l="md",scrollable:s=!1,align:d="left",style:c,containerStyle:u,tabStyle:p,tabLabelStyle:m,tabIconStyle:g,tabBadgeStyle:b,dividerStyle:f,indicatorStyle:h,progress:y,haptic:S,accessibilityLabel:z,testID:x}=e,v=useTheme(),j=useMemo(()=>buildStyles(v),[v]),C=v.components.tabs,w=tabsSizes[l],H=C?.[l],k=s?H?.scrollablePaddingHorizontal??C?.tabPaddingHorizontal??w.scrollablePaddingHorizontal:H?.paddingHorizontal??C?.tabPaddingHorizontal??w.paddingHorizontal,V=H?.paddingVertical??C?.tabPaddingVertical??w.paddingVertical,I=H?.fontSize??w.fontSize,P=C?.tabIconSpacing??6,_=H?.iconSize??C?.tabIconSize??w.iconSize,R=C?.underlineHeight??2,T=C?.pillInset??4,L=C?.disabledOpacity??.45,F=C?.badgeGap??6,A="segmented"===r,W=v.components.segmentedControl,M=segmentedControlSizes[l],q=W?.[l]?.height??M.height,D=W?.[l]?.fontSize??M.fontSize,B=W?.[l]?.paddingHorizontal??M.paddingHorizontal,E=C?.trackPadding??4,N="number"==typeof n?n:n?v.radius[n]:C?.radius,O=N??v.radius.md,U=void 0===N?v.radius.sm:Math.max(N-E,0),G=N??v.radius.full,K=N??0,X=v.colors.background.tertiary,J=useSquircle(A,O),[Q,Y]=useState({}),Z=useRef(createAnimatedValue(0)).current,$=useRef(createAnimatedValue(0)).current,ee=Q[o],te=i.every(e=>void 0!==Q[e.key]),ie=void 0!==y&&te&&i.length>1,oe=useMemo(()=>ie&&y?y.interpolate({inputRange:i.map((e,t)=>t),outputRange:i.map(e=>Q[e.key].x),extrapolate:"clamp"}):null,[ie,y,i,Q]),ae=useMemo(()=>ie&&y?y.interpolate({inputRange:i.map((e,t)=>t),outputRange:i.map(e=>Q[e.key].width),extrapolate:"clamp"}):null,[ie,y,i,Q]);useEffect(()=>{if(!ee)return;if(ie)return;const e=v.motion.spring.snappy,t=Animated.parallel([Animated.spring(Z,{toValue:ee.x,damping:e.damping,stiffness:e.stiffness,mass:e.mass,overshootClamping:!0,useNativeDriver:!1}),Animated.spring($,{toValue:ee.width,damping:e.damping,stiffness:e.stiffness,mass:e.mass,overshootClamping:!0,useNativeDriver:!1})]);return t.start(),()=>t.stop()},[ee,o,Z,$,v.motion.spring.snappy,ie]);const re=useCallback(e=>t=>{const{x:i,width:o}=t.nativeEvent.layout;Y(t=>{const a=t[e];return a&&a.x===i&&a.width===o?t:{...t,[e]:{x:i,width:o}}})},[]),ne=useCallback(e=>{if(e.disabled)return;if(e.key===o)return;const t=resolveHaptic(S,"selection");t&&triggerHaptic(t),a(e.key)},[o,a,S]),le="pills"===r,se=_jsx(Animated.View,{pointerEvents:"none",style:[A?j.indicatorThumb:le?j.indicatorPill:j.indicatorUnderline,A?null:le?{top:T,bottom:T}:{height:R},{width:ae??$,transform:[{translateX:oe??Z}],backgroundColor:A?v.colors.background.elevated:le?v.colors.primaryMuted:v.colors.primary,borderRadius:A?U:le?G:K,...smoothCorners},h]}),renderTabs=()=>i.map(e=>{const t=e.key===o,i=!0===e.disabled,a=t?v.colors.primary:v.colors.text.tertiary,r=renderSlotIcon(e.icon,{color:a,size:_,focused:t,disabled:i});return _jsxs(Pressable,{onPress:()=>ne(e),onLayout:re(e.key),disabled:i,accessibilityRole:"tab",accessibilityLabel:e.label,accessibilityState:{selected:t,disabled:i},android_ripple:A?void 0:{color:v.colors.surface.pressed,borderless:!1},style:({pressed:e})=>[j.tab,s?null:j.tabFlex,A?{paddingHorizontal:B,height:q-2*E}:{paddingHorizontal:k,paddingVertical:V},{opacity:i?L:e&&A&&!t?.7:1,backgroundColor:e&&!A?v.colors.surface.pressed:"transparent"},p],children:[r?_jsx(View,{style:[j.tabIcon,{marginRight:P},g],children:r}):null,_jsx(Text,{style:[j.tabLabel,{color:a,fontSize:A?D:I,fontWeight:t?v.typography.fontWeight.semibold:v.typography.fontWeight.medium},m],numberOfLines:1,children:e.label}),void 0!==e.badge&&null!==e.badge?_jsx(View,{style:[j.tabBadge,{marginLeft:F,backgroundColor:v.colors.primaryMuted,borderRadius:v.radius.full,...smoothCorners,paddingHorizontal:v.spacing.xs},b],children:_jsx(Text,{style:{color:v.colors.primary,fontSize:v.typography.fontSize.xs,fontWeight:v.typography.fontWeight.semibold},numberOfLines:1,children:String(e.badge)})}):null]},e.key)}),de={flexDirection:"row",alignItems:"stretch",justifyContent:s?"flex-start":"center"===d?"center":"flex-start",position:"relative",overflow:"hidden"},ce=_jsxs(_Fragment,A?{children:[se,renderTabs()]}:{children:[renderTabs(),se]});return _jsxs(View,{ref:t,style:[j.container,{borderBottomColor:v.colors.border.secondary,borderBottomWidth:"underline"===r?StyleSheet.hairlineWidth:0},"underline"===r?f:null,A?{padding:E,borderRadius:O,...smoothCorners,backgroundColor:J.active?"transparent":X}:null,c,u],onLayout:J.onLayout,accessibilityRole:"tablist",accessibilityLabel:z,testID:x,children:[J.active&&J.size?_jsx(SquircleFill,{width:J.size.width,height:J.size.height,radius:O,fill:X}):null,s?_jsx(ScrollView,{horizontal:!0,showsHorizontalScrollIndicator:!1,contentContainerStyle:[de],keyboardShouldPersistTaps:"handled",children:ce}):_jsx(View,{style:de,children:ce})]})});Tabs.displayName="Tabs";const buildStyles=e=>StyleSheet.create({container:{width:"100%",position:"relative"},tab:{flexDirection:"row",alignItems:"center",justifyContent:"center"},tabFlex:{flex:1},tabIcon:{},tabLabel:{includeFontPadding:!1,flexShrink:1},tabBadge:{minWidth:18,alignItems:"center",justifyContent:"center"},indicatorUnderline:{position:"absolute",left:0,bottom:0},indicatorPill:{position:"absolute",left:0,zIndex:-1},indicatorThumb:{position:"absolute",left:0,top:0,bottom:0}});export{Tabs};export default Tabs;
+"use strict";import{forwardRef,useCallback,useEffect,useMemo,useRef,useState}from"react";import{Animated,Pressable,ScrollView,StyleSheet,Text,View}from"react-native";import{createAnimatedValue,useTheme}from"../../theme/index.js";import{resolveHaptic,triggerHaptic}from"../../utils/index.js";import{smoothCorners}from"../../utils/corners.js";import{renderSlotIcon}from"../AppIcon/slotIcon.js";import{segmentedControlSizes}from"../SegmentedControl/SegmentedControl.js";import{SquircleFill,useSquircle}from"../SquircleFill/SquircleFill.js";import{jsx as _jsx,jsxs as _jsxs,Fragment as _Fragment}from"react/jsx-runtime";const tabsSizes={sm:{fontSize:13,paddingVertical:8,paddingHorizontal:4,scrollablePaddingHorizontal:12,iconSize:16},md:{fontSize:15,paddingVertical:12,paddingHorizontal:8,scrollablePaddingHorizontal:16,iconSize:18},lg:{fontSize:17,paddingVertical:16,paddingHorizontal:12,scrollablePaddingHorizontal:24,iconSize:20}},Tabs=forwardRef((e,t)=>{const{tabs:i,activeKey:o,onChange:a,variant:r="underline",radius:n,size:l="md",scrollable:s=!1,align:d="left",style:c,containerStyle:u,tabStyle:p,tabLabelStyle:m,tabIconStyle:g,tabBadgeStyle:b,dividerStyle:f,indicatorStyle:h,progress:y,haptic:S,accessibilityLabel:z,testID:x}=e,v=useTheme(),j=useMemo(()=>buildStyles(v),[v]),C=v.components.tabs,w=tabsSizes[l],H=C?.[l],k=s?H?.scrollablePaddingHorizontal??C?.tabPaddingHorizontal??w.scrollablePaddingHorizontal:H?.paddingHorizontal??C?.tabPaddingHorizontal??w.paddingHorizontal,V=H?.paddingVertical??C?.tabPaddingVertical??w.paddingVertical,I=H?.fontSize??w.fontSize,P=C?.tabIconSpacing??6,_=H?.iconSize??C?.tabIconSize??w.iconSize,R=C?.underlineHeight??2,T=C?.pillInset??4,L=C?.disabledOpacity??.45,F=C?.badgeGap??6,A="segmented"===r,W=v.components.segmentedControl,M=segmentedControlSizes[l],q=W?.[l]?.height??M.height,D=W?.[l]?.fontSize??M.fontSize,B=W?.[l]?.paddingHorizontal??M.paddingHorizontal,E=C?.trackPadding??4,N="number"==typeof n?n:n?v.radius[n]:C?.radius,O=N??v.radius.md,U=void 0===N?v.radius.sm:Math.max(N-E,0),G=N??v.radius.full,K=N??0,X=v.colors.background.tertiary,J=useSquircle(A,O),[Q,Y]=useState({}),Z=useRef(createAnimatedValue(0)).current,$=useRef(createAnimatedValue(0)).current,ee=Q[o],te=i.every(e=>void 0!==Q[e.key]),ie=void 0!==y&&te&&i.length>1,oe=useMemo(()=>ie&&y?y.interpolate({inputRange:i.map((e,t)=>t),outputRange:i.map(e=>Q[e.key].x),extrapolate:"clamp"}):null,[ie,y,i,Q]),ae=useMemo(()=>ie&&y?y.interpolate({inputRange:i.map((e,t)=>t),outputRange:i.map(e=>Q[e.key].width),extrapolate:"clamp"}):null,[ie,y,i,Q]);useEffect(()=>{if(!ee)return;if(ie)return;const e=v.motion.spring.snappy,t=Animated.parallel([Animated.spring(Z,{toValue:ee.x,damping:e.damping,stiffness:e.stiffness,mass:e.mass,overshootClamping:!0,useNativeDriver:!1}),Animated.spring($,{toValue:ee.width,damping:e.damping,stiffness:e.stiffness,mass:e.mass,overshootClamping:!0,useNativeDriver:!1})]);return t.start(),()=>t.stop()},[ee,o,Z,$,v.motion.spring.snappy,ie]);const re=useCallback(e=>t=>{const{x:i,width:o}=t.nativeEvent.layout;Y(t=>{const a=t[e];return a&&a.x===i&&a.width===o?t:{...t,[e]:{x:i,width:o}}})},[]),ne=useCallback(e=>{if(e.disabled)return;if(e.key===o)return;const t=resolveHaptic(S,"selection");t&&triggerHaptic(t),a(e.key)},[o,a,S]),le="pills"===r,se=_jsx(Animated.View,{pointerEvents:"none",style:[A?j.indicatorThumb:le?j.indicatorPill:j.indicatorUnderline,A?null:le?{top:T,bottom:T}:{height:R},{width:ae??$,transform:[{translateX:oe??Z}],backgroundColor:A?v.colors.background.elevated:le?v.colors.primaryMuted:v.colors.primary,borderRadius:A?U:le?G:K,...smoothCorners},h]}),renderTabs=()=>i.map(e=>{const t=e.key===o,i=!0===e.disabled,a=t?v.colors.primary:v.colors.text.tertiary,r=renderSlotIcon(e.icon,{color:a,size:_,focused:t,disabled:i});return _jsxs(Pressable,{onPress:()=>ne(e),onLayout:re(e.key),disabled:i,accessibilityRole:"tab",accessibilityLabel:e.label,accessibilityState:{selected:t,disabled:i},"aria-selected":t,"aria-disabled":i,android_ripple:A?void 0:{color:v.colors.surface.pressed,borderless:!1},style:({pressed:e})=>[j.tab,s?null:j.tabFlex,A?{paddingHorizontal:B,height:q-2*E}:{paddingHorizontal:k,paddingVertical:V},{opacity:i?L:e&&A&&!t?.7:1,backgroundColor:e&&!A?v.colors.surface.pressed:"transparent"},p],children:[r?_jsx(View,{style:[j.tabIcon,{marginRight:P},g],children:r}):null,_jsx(Text,{style:[j.tabLabel,{color:a,fontSize:A?D:I,fontWeight:t?v.typography.fontWeight.semibold:v.typography.fontWeight.medium},m],numberOfLines:1,children:e.label}),void 0!==e.badge&&null!==e.badge?_jsx(View,{style:[j.tabBadge,{marginLeft:F,backgroundColor:v.colors.primaryMuted,borderRadius:v.radius.full,...smoothCorners,paddingHorizontal:v.spacing.xs},b],children:_jsx(Text,{style:{color:v.colors.primary,fontSize:v.typography.fontSize.xs,fontWeight:v.typography.fontWeight.semibold},numberOfLines:1,children:String(e.badge)})}):null]},e.key)}),de={flexDirection:"row",alignItems:"stretch",justifyContent:s?"flex-start":"center"===d?"center":"flex-start",position:"relative",overflow:"hidden"},ce=_jsxs(_Fragment,A?{children:[se,renderTabs()]}:{children:[renderTabs(),se]});return _jsxs(View,{ref:t,style:[j.container,{borderBottomColor:v.colors.border.secondary,borderBottomWidth:"underline"===r?StyleSheet.hairlineWidth:0},"underline"===r?f:null,A?{padding:E,borderRadius:O,...smoothCorners,backgroundColor:J.active?"transparent":X}:null,c,u],onLayout:J.onLayout,accessibilityRole:"tablist",accessibilityLabel:z,testID:x,children:[J.active&&J.size?_jsx(SquircleFill,{width:J.size.width,height:J.size.height,radius:O,fill:X}):null,s?_jsx(ScrollView,{horizontal:!0,showsHorizontalScrollIndicator:!1,contentContainerStyle:[de],keyboardShouldPersistTaps:"handled",children:ce}):_jsx(View,{style:de,children:ce})]})});Tabs.displayName="Tabs";const buildStyles=e=>StyleSheet.create({container:{width:"100%",position:"relative"},tab:{flexDirection:"row",alignItems:"center",justifyContent:"center"},tabFlex:{flex:1},tabIcon:{},tabLabel:{includeFontPadding:!1,flexShrink:1},tabBadge:{minWidth:18,alignItems:"center",justifyContent:"center"},indicatorUnderline:{position:"absolute",left:0,bottom:0},indicatorPill:{position:"absolute",left:0,zIndex:-1},indicatorThumb:{position:"absolute",left:0,top:0,bottom:0}});export{Tabs};export default Tabs;

package/lib/module/components/Text/Text.js

@@ -1 +1 @@
-"use strict";import React,{forwardRef,useMemo}from"react";import{Text as RNText}from"react-native";import{fontFor,useTheme}from"../../theme/index.js";import{jsx as _jsx}from"react/jsx-runtime";const VARIANTS={display:{size:"4xl",weight:"bold",line:"tight",color:"primary",heading:!0},h1:{size:"3xl",weight:"bold",line:"tight",color:"primary",heading:!0},h2:{size:"2xl",weight:"semibold",line:"tight",color:"primary",heading:!0},h3:{size:"xl",weight:"semibold",line:"tight",color:"primary",heading:!0},title:{size:"lg",weight:"semibold",line:"normal",color:"primary"},body:{size:"base",weight:"normal",line:"normal",color:"primary"},bodySmall:{size:"sm",weight:"normal",line:"normal",color:"secondary"},caption:{size:"xs",weight:"normal",line:"normal",color:"tertiary"},label:{size:"sm",weight:"medium",line:"normal",color:"secondary"},overline:{size:"xs",weight:"semibold",line:"normal",color:"secondary",uppercase:!0,letterSpacing:"wide"}},TEXT_ROLES={primary:!0,secondary:!0,tertiary:!0,inverse:!0,disabled:!0,link:!0,textStrong:!0},TEXT_ROLE_KEY={textStrong:"strong"},SEMANTIC={success:!0,warning:!0,error:!0,info:!0};export const resolveColor=(e,i)=>TEXT_ROLES[i]?e.colors.text[TEXT_ROLE_KEY[i]??i]:SEMANTIC[i]?e.colors[i]:i;const Text=forwardRef((e,i)=>{const{variant:t="body",color:o,weight:r,size:n,align:l,italic:a,underline:s,style:c,children:m,...p}=e,g=useTheme(),d=Object.hasOwn(VARIANTS,t),h=g.textVariants,y=!d&&h&&Object.hasOwn(h,t)?h[t]:void 0,x=useMemo(()=>{if(y){const{typography:e}=g,i="number"==typeof y.size?y.size:e.fontSize[y.size],t="number"==typeof n?n:n?e.fontSize[n]:i,c=y.lineHeight,m=y.letterSpacing;return{fontSize:t,lineHeight:"number"==typeof c?c:c?Math.round(t*e.lineHeight[c]):void 0,color:resolveColor(g,o??y.color??"primary"),textAlign:l,textTransform:y.uppercase?"uppercase":void 0,letterSpacing:"number"!=typeof m&&m?e.letterSpacing[m]:m,fontStyle:a||y.italic?"italic":void 0,fontVariant:y.fontVariant,textDecorationLine:s?"underline":void 0,...fontFor(g,r??y.weight??"normal")}}const e=VARIANTS[d?t:"body"],i="number"==typeof n?n:g.typography.fontSize[n??e.size];return{fontSize:i,lineHeight:Math.round(i*g.typography.lineHeight[e.line]),color:resolveColor(g,o??e.color),textAlign:l,textTransform:e.uppercase?"uppercase":void 0,letterSpacing:e.letterSpacing?g.typography.letterSpacing[e.letterSpacing]:void 0,fontStyle:a?"italic":void 0,textDecorationLine:s?"underline":void 0,...fontFor(g,r??e.weight)}},[g,y,d,t,o,r,n,l,a,s]),f=!!d&&VARIANTS[t].heading;return _jsx(RNText,{ref:i,style:[x,c],maxFontSizeMultiplier:g.maxFontSizeMultiplier,accessibilityRole:f?"header":p.accessibilityRole,...p,children:m})});Text.displayName="Text";export{Text};export default Text;
+"use strict";import{forwardRef,useMemo}from"react";import{Text as RNText}from"react-native";import{fontFor,useTheme}from"../../theme/index.js";import{jsx as _jsx}from"react/jsx-runtime";const VARIANTS={display:{size:"4xl",weight:"bold",line:"tight",color:"primary",heading:!0,fontFamily:"display"},h1:{size:"3xl",weight:"bold",line:"tight",color:"primary",heading:!0,fontFamily:"display"},h2:{size:"2xl",weight:"semibold",line:"tight",color:"primary",heading:!0,fontFamily:"display"},h3:{size:"xl",weight:"semibold",line:"tight",color:"primary",heading:!0},title:{size:"lg",weight:"semibold",line:"normal",color:"primary",fontFamily:"display"},body:{size:"base",weight:"normal",line:"normal",color:"primary"},bodySmall:{size:"sm",weight:"normal",line:"normal",color:"secondary"},caption:{size:"xs",weight:"normal",line:"normal",color:"tertiary"},label:{size:"sm",weight:"medium",line:"normal",color:"secondary"},overline:{size:"xs",weight:"semibold",line:"normal",color:"secondary",uppercase:!0,letterSpacing:"wide"}},TEXT_ROLES={primary:!0,secondary:!0,tertiary:!0,inverse:!0,disabled:!0,link:!0,textStrong:!0},TEXT_ROLE_KEY={textStrong:"strong"},SEMANTIC={success:!0,warning:!0,error:!0,info:!0};export const resolveColor=(e,i)=>TEXT_ROLES[i]?e.colors.text[TEXT_ROLE_KEY[i]??i]:SEMANTIC[i]?e.colors.toneText[i]:i;const Text=forwardRef((e,i)=>{const{variant:t="body",color:o,weight:r,size:n,align:l,italic:a,underline:s,style:c,children:m,...p}=e,d=useTheme(),y=Object.hasOwn(VARIANTS,t),g=d.textVariants,h=!y&&g&&Object.hasOwn(g,t)?g[t]:void 0,f=useMemo(()=>{if(h){const{typography:e}=d,i="number"==typeof h.size?h.size:e.fontSize[h.size],t="number"==typeof n?n:n?e.fontSize[n]:i,c=h.lineHeight,m=h.letterSpacing;return{fontSize:t,lineHeight:"number"==typeof c?c:c?Math.round(t*e.lineHeight[c]):void 0,color:resolveColor(d,o??h.color??"primary"),textAlign:l,textTransform:h.uppercase?"uppercase":void 0,letterSpacing:"number"!=typeof m&&m?e.letterSpacing[m]:m,fontStyle:a||h.italic?"italic":void 0,fontVariant:h.fontVariant,textDecorationLine:s?"underline":void 0,...fontFor(d,r??h.weight??"normal",h.fontFamily)}}const e=VARIANTS[y?t:"body"],i="number"==typeof n?n:d.typography.fontSize[n??e.size];return{fontSize:i,lineHeight:Math.round(i*d.typography.lineHeight[e.line]),color:resolveColor(d,o??e.color),textAlign:l,textTransform:e.uppercase?"uppercase":void 0,letterSpacing:e.letterSpacing?d.typography.letterSpacing[e.letterSpacing]:void 0,fontStyle:a?"italic":void 0,textDecorationLine:s?"underline":void 0,...fontFor(d,r??e.weight,e.fontFamily)}},[d,h,y,t,o,r,n,l,a,s]),x=!!y&&VARIANTS[t].heading;return _jsx(RNText,{ref:i,style:[f,c],maxFontSizeMultiplier:d.maxFontSizeMultiplier,accessibilityRole:x?"header":p.accessibilityRole,...p,children:m})});Text.displayName="Text";export{Text};export default Text;

package/lib/module/components/TimePicker/TimePicker.js

@@ -1 +1 @@
-"use strict";import React,{useCallback,useEffect,useMemo,useRef,useState}from"react";import{AccessibilityInfo,Animated,Easing,Modal,Platform,Pressable,StyleSheet,Text,View}from"react-native";import{GestureDetector,GestureHandlerRootView}from"react-native-gesture-handler";import{useSafeAreaInsets}from"react-native-safe-area-context";import{useDragToDismiss}from"../../hooks/useDragToDismiss.js";import{createAnimatedValue,setNativeValue,useTheme}from"../../theme/index.js";import{smoothCorners}from"../../utils/corners.js";import{resolveHaptic,triggerHaptic}from"../../utils/hapticUtils.js";import Button from"../Button/Button.js";import{PickerTrigger}from"../PickerTrigger/PickerTrigger.js";import{ToastHost}from"../Toast/ToastProvider.js";import{jsx as _jsx,jsxs as _jsxs,Fragment as _Fragment}from"react/jsx-runtime";const ITEM_HEIGHT=40,VISIBLE_ITEMS=5,PICKER_HEIGHT=200,CENTER_OFFSET=Math.floor(2.5),HAPTIC_DEBOUNCE_MS=35,range=(e,t,i=1)=>{const a=[];for(let n=e;n<=t;n+=i)a.push(n);return a},pad2=e=>e.toString().padStart(2,"0"),to24h=(e,t,i)=>"24h"===i?e:"AM"===t?12===e?0:e:12===e?12:e+12,from24h=(e,t)=>"24h"===t?{displayHour:e,period:"AM"}:0===e?{displayHour:12,period:"AM"}:12===e?{displayHour:12,period:"PM"}:e>12?{displayHour:e-12,period:"PM"}:{displayHour:e,period:"AM"},clampMinuteToStep=(e,t)=>{const i=Math.round(e/t)*t;return Math.min(59,Math.max(0,i))},Wheel=({kind:e,label:t,data:i,selectedIndex:a,onIndexChange:n,formatItem:s,theme:r,haptic:o,testID:l})=>{const c=useRef(null),u=useRef(createAnimatedValue(40*a)).current,d=useRef(a),m=useRef(0);useEffect(()=>{if(d.current!==a){d.current=a;const e=40*a;setNativeValue(u,e),requestAnimationFrame(()=>{c.current?.scrollToOffset({offset:e,animated:!1})})}},[a,u]);const p=r.components.timePicker?.hapticDebounceMs??35,h=useMemo(()=>Animated.event([{nativeEvent:{contentOffset:{y:u}}}],{useNativeDriver:!0,listener:e=>{const t=e.nativeEvent.contentOffset.y,a=Math.round(t/40);if(a!==d.current&&a>=0&&a<i.length){const e=Date.now();if(e-m.current>=p){const t=resolveHaptic(o,"selection");t&&triggerHaptic(t),m.current=e}d.current=a}}}),[u,i.length,o,p]),g=useCallback(e=>{const t=e.nativeEvent.contentOffset.y,s=Math.max(0,Math.min(i.length-1,Math.round(t/40)));s!==a&&n(s)},[i.length,n,a]),f=useCallback(e=>{const t=e.nativeEvent.actionName;if("increment"===t){const e=Math.min(i.length-1,a+1);e!==a&&n(e)}else if("decrement"===t){const e=Math.max(0,a-1);e!==a&&n(e)}},[i.length,n,a]),y=useCallback(({item:e,index:t})=>{const i=Animated.subtract(Animated.divide(u,40),t),n=i.interpolate({inputRange:[-2,-1,0,1,2],outputRange:[.3,.6,1,.6,.3],extrapolate:"clamp"}),o=i.interpolate({inputRange:[-2,-1,0,1,2],outputRange:[.85,.95,1.05,.95,.85],extrapolate:"clamp"}),l=t===a;return _jsx(Animated.View,{style:[styles.wheelItem,{opacity:n,transform:[{scale:o}]}],accessible:!1,importantForAccessibility:"no",children:_jsx(Text,{style:[{fontSize:r.typography.fontSize.xl,color:l?r.colors.text.primary:r.colors.text.secondary,fontWeight:l?r.typography.fontWeight.semibold:r.typography.fontWeight.medium,letterSpacing:r.typography.letterSpacing.normal}],children:s(e)})})},[u,a,r,s]),b=useCallback((t,i)=>`${e}-${String(t)}-${i}`,[e]),x=useCallback((e,t)=>({length:40,offset:40*t,index:t}),[]),S=s(i[a]??"");return _jsxs(View,{style:styles.wheelColumn,testID:l,children:[_jsx(View,{pointerEvents:"none",style:styles.wheelA11yLayer,accessible:!0,accessibilityRole:"adjustable",accessibilityLabel:t,accessibilityValue:{text:S},accessibilityActions:[{name:"increment"},{name:"decrement"}],onAccessibilityAction:f}),_jsx(Animated.FlatList,{ref:c,data:i,keyExtractor:b,renderItem:y,getItemLayout:x,showsVerticalScrollIndicator:!1,snapToInterval:40,snapToAlignment:"start",decelerationRate:"fast",bounces:!1,scrollEventThrottle:16,onScroll:h,onMomentumScrollEnd:g,contentContainerStyle:{paddingVertical:40*CENTER_OFFSET},initialScrollIndex:a,style:styles.wheelList,importantForAccessibility:"no-hide-descendants"})]})},TimePicker=e=>{const{visible:t,value:i,onChange:a,onClose:n,format:s="12h",minuteStep:r=1,title:o="Select Time",confirmLabel:l="Confirm",cancelLabel:c="Cancel",testID:u,style:d,containerStyle:m,headerLabelStyle:p,footerButtonStyle:h,label:g,placeholder:f,helperText:y,error:b,required:x,disabled:S,size:v,variant:w,clearable:C,onClear:j,formatValue:k,triggerStyle:T,haptic:I}=e,M=void 0!==e.visible,[_,A]=useState(!1),E=M?t:_,V=M?u:u?`${u}-modal`:void 0,H=useTheme(),R=useSafeAreaInsets(),D=useMemo(()=>buildStyles(H),[H]),P=useRef(createAnimatedValue(0)).current,B=useRef(createAnimatedValue(40)).current,F=useRef(createAnimatedValue(0)).current,L=useRef(0),N=useCallback(()=>{M?n?.():A(!1)},[M,n]),O=useCallback(()=>{Animated.parallel([Animated.timing(P,{toValue:0,duration:H.motion.duration.fast,easing:Easing.bezier(...H.motion.easing.accelerate),useNativeDriver:!1}),Animated.timing(B,{toValue:40,duration:H.motion.duration.fast,easing:Easing.bezier(...H.motion.easing.accelerate),useNativeDriver:!0})]).start(()=>N())},[N,P,B,H.motion.duration.fast,H.motion.easing.accelerate]),{handleGesture:W}=useDragToDismiss({drag:F,travel:()=>L.current||320,onDismiss:O}),$=useMemo(()=>"24h"===s?range(0,23):range(1,12),[s]),z=useMemo(()=>range(0,59,r),[r]),G=useMemo(()=>["AM","PM"],[]),q=useMemo(()=>{const e=i&&Number.isFinite(i.hour)?i.hour:(new Date).getHours(),t=i&&Number.isFinite(i.minute)?i.minute:(new Date).getMinutes(),a=clampMinuteToStep(t,r),{displayHour:n,period:o}=from24h(e,s);return{displayHour:n,minute:a,period:o,hour24:e}},[i,s,r]),[U,K]=useState(()=>{const e=$.indexOf(q.displayHour);return e>=0?e:0}),[Y,J]=useState(()=>{const e=z.indexOf(q.minute);return e>=0?e:0}),[Q,X]=useState(()=>"PM"===q.period?1:0);useEffect(()=>{if(!E)return;const e=i&&Number.isFinite(i.hour)?i.hour:(new Date).getHours(),t=i&&Number.isFinite(i.minute)?i.minute:(new Date).getMinutes(),a=clampMinuteToStep(t,r),{displayHour:n,period:o}=from24h(e,s),l=$.indexOf(n);K(l>=0?l:0);const c=z.indexOf(a);J(c>=0?c:0),X("PM"===o?1:0)},[E,i,s,r,$,z]),useEffect(()=>{let e;return E?(e=Animated.parallel([Animated.timing(P,{toValue:1,duration:H.motion.duration.normal,easing:Easing.out(Easing.cubic),useNativeDriver:!1}),Animated.spring(B,{toValue:0,damping:H.motion.spring.snappy.damping,stiffness:H.motion.spring.snappy.stiffness,mass:H.motion.spring.snappy.mass,useNativeDriver:!0})]),e.start()):(P.setValue(0),setNativeValue(B,40),setNativeValue(F,0)),()=>e?.stop()},[E,P,B,F,H.motion]);const Z=useCallback(e=>{"ios"!==Platform.OS&&"android"!==Platform.OS||AccessibilityInfo.announceForAccessibility(e)},[]),ee=useCallback(e=>{K(e),Z(`Hour ${$[e]}`)},[$,Z]),te=useCallback(e=>{J(e),Z(`${z[e]} minutes`)},[z,Z]),ie=useCallback(e=>{X(e),Z(G[e]??"")},[G,Z]),ae=useCallback(()=>{!1!==I&&triggerHaptic("selection"),O()},[O,I]),ne=useCallback(()=>{const e=$[U]??0,t=G[Q]??"AM",i=to24h(e,t,s),n=z[Y]??0;!1!==I&&triggerHaptic("notificationSuccess"),a?.({hour:i,minute:n}),O()},[$,U,G,Q,z,Y,s,a,O,I]),se=useMemo(()=>{const e=$[U]??0,t=z[Y]??0;if("24h"===s)return`${pad2(e)}:${pad2(t)}`;const i=G[Q]??"AM";return`${pad2(e)}:${pad2(t)} ${i}`},[$,U,z,Y,G,Q,s]),re=useCallback(e=>pad2(Number(e)),[]),oe=useCallback(e=>pad2(Number(e)),[]),le=useCallback(e=>String(e),[]),ce=useCallback(e=>{if("24h"===s)return`${pad2(e.hour)}:${pad2(e.minute)}`;const{displayHour:t,period:i}=from24h(e.hour,"12h");return`${t}:${pad2(e.minute)} ${i}`},[s]),ue=!M&&i&&Number.isFinite(i.hour)&&Number.isFinite(i.minute)?(k??ce)(i):void 0,de=_jsx(Modal,{visible:E,transparent:!0,statusBarTranslucent:!0,navigationBarTranslucent:!0,animationType:"none",onRequestClose:O,testID:V,children:_jsxs(GestureHandlerRootView,{collapsable:!1,style:D.backdrop,children:[_jsx(Pressable,{style:StyleSheet.absoluteFill,onPress:O,accessibilityLabel:"Close time picker",accessibilityRole:"button"}),_jsxs(Animated.View,{style:[D.sheet,{paddingBottom:Math.max(R.bottom,H.spacing.lg),transform:[{translateY:Animated.add(B,F)}]},d,m],onLayout:e=>{L.current=e.nativeEvent.layout.height},accessibilityViewIsModal:!0,accessible:!0,accessibilityRole:"none",accessibilityLabel:o,children:[_jsx(GestureDetector,{gesture:W,children:_jsxs(View,{children:[_jsx(View,{style:D.handle}),_jsx(Text,{style:[D.title,p],accessibilityRole:"header",children:o})]})}),_jsx(View,{style:D.summaryWrap,accessibilityLiveRegion:"polite",accessibilityLabel:`Selected ${se}`,children:_jsx(Text,{style:D.summary,children:se})}),_jsxs(View,{style:D.wheelsRow,children:[_jsxs(View,{pointerEvents:"none",style:D.selectionBand,children:[_jsx(View,{style:D.bandLine}),_jsx(View,{style:[D.bandLine,D.bandLineBottom]})]}),_jsx(Wheel,{kind:"hour",label:"Hour",data:$,selectedIndex:U,onIndexChange:ee,formatItem:re,theme:H,haptic:I,testID:"time-picker-hour"}),_jsx(Text,{style:D.separator,children:":"}),_jsx(Wheel,{kind:"minute",label:"Minute",data:z,selectedIndex:Y,onIndexChange:te,formatItem:oe,theme:H,haptic:I,testID:"time-picker-minute"}),"12h"===s?_jsxs(_Fragment,{children:[_jsx(View,{style:D.spacer}),_jsx(Wheel,{kind:"period",label:"Period",data:G,selectedIndex:Q,onIndexChange:ie,formatItem:le,theme:H,haptic:I,testID:"time-picker-period"})]}):null]}),_jsxs(View,{style:D.footer,children:[_jsx(Button,{title:c,haptic:!1,variant:"ghost",tone:"neutral",onPress:ae,style:[D.footerBtn,h],accessibilityHint:"Dismiss without changes",testID:"time-picker-cancel"}),_jsx(Button,{title:l,variant:"solid",tone:"primary",haptic:!1,onPress:ne,style:[D.footerBtn,h],accessibilityHint:"Confirm selected time",testID:"time-picker-confirm"})]})]}),_jsx(ToastHost,{})]})});return M?de:_jsxs(_Fragment,{children:[_jsx(PickerTrigger,{label:g,placeholder:f,helperText:y,error:b,required:x,disabled:S,size:v,variant:w,clearable:C,onClear:j,value:ue,onPress:()=>A(!0),triggerStyle:T,testID:u}),de]})},styles=StyleSheet.create({wheelColumn:{width:64,height:200,overflow:"hidden"},wheelList:{flexGrow:0,height:200},wheelItem:{height:40,alignItems:"center",justifyContent:"center"},wheelA11yLayer:{...StyleSheet.absoluteFill,zIndex:2}}),buildStyles=e=>{const t=e.shadows.xl;return StyleSheet.create({backdrop:{flex:1,backgroundColor:e.colors.background.overlay,justifyContent:"flex-end"},sheet:{backgroundColor:e.colors.background.elevated,borderTopLeftRadius:e.radius.xl,borderTopRightRadius:e.radius.xl,...smoothCorners,paddingTop:e.spacing.sm,paddingHorizontal:e.spacing.lg,paddingBottom:e.spacing.xl,shadowColor:t.shadowColor,shadowOffset:t.shadowOffset,shadowOpacity:t.shadowOpacity,shadowRadius:t.shadowRadius,elevation:t.elevation},handle:{alignSelf:"center",width:e.components.timePicker?.handleWidth??36,height:e.components.timePicker?.handleHeight??4,borderRadius:e.radius.full,...smoothCorners,backgroundColor:e.colors.border.secondary,marginBottom:e.spacing.sm},title:{textAlign:"center",fontSize:e.typography.fontSize.lg,fontWeight:e.typography.fontWeight.semibold,color:e.colors.text.primary,marginBottom:e.spacing.sm},summaryWrap:{alignItems:"center",marginBottom:e.spacing.md},summary:{fontSize:e.typography.fontSize["2xl"],fontWeight:e.typography.fontWeight.bold,color:e.colors.primary,letterSpacing:e.typography.letterSpacing.wide},wheelsRow:{flexDirection:"row",alignItems:"center",justifyContent:"center",height:200,position:"relative",marginBottom:e.spacing.lg},selectionBand:{position:"absolute",left:0,right:0,top:40*CENTER_OFFSET,height:40,justifyContent:"space-between"},bandLine:{height:2*StyleSheet.hairlineWidth,backgroundColor:e.colors.primary,opacity:.85},bandLineBottom:{},separator:{fontSize:e.typography.fontSize["2xl"],fontWeight:e.typography.fontWeight.bold,color:e.colors.text.primary,paddingHorizontal:e.spacing.xs},spacer:{width:e.spacing.md},footer:{flexDirection:"row",justifyContent:"flex-end",alignItems:"center",gap:e.spacing.sm},footerBtn:{paddingHorizontal:e.spacing.lg}})};export{TimePicker};export default TimePicker;
+"use strict";import{useCallback,useEffect,useMemo,useRef,useState}from"react";import{AccessibilityInfo,Animated,Easing,Modal,Platform,Pressable,StyleSheet,Text,View}from"react-native";import{GestureDetector,GestureHandlerRootView}from"react-native-gesture-handler";import{useSafeAreaInsets}from"react-native-safe-area-context";import{useDragToDismiss}from"../../hooks/useDragToDismiss.js";import{createAnimatedValue,setNativeValue,useTheme}from"../../theme/index.js";import{smoothCorners}from"../../utils/corners.js";import{resolveHaptic,triggerHaptic}from"../../utils/hapticUtils.js";import Button from"../Button/Button.js";import{PickerTrigger}from"../PickerTrigger/PickerTrigger.js";import{ToastHost}from"../Toast/ToastProvider.js";import{jsx as _jsx,jsxs as _jsxs,Fragment as _Fragment}from"react/jsx-runtime";const ITEM_HEIGHT=40,VISIBLE_ITEMS=5,PICKER_HEIGHT=200,CENTER_OFFSET=Math.floor(2.5),HAPTIC_DEBOUNCE_MS=35,range=(e,t,i=1)=>{const a=[];for(let n=e;n<=t;n+=i)a.push(n);return a},pad2=e=>e.toString().padStart(2,"0"),to24h=(e,t,i)=>"24h"===i?e:"AM"===t?12===e?0:e:12===e?12:e+12,from24h=(e,t)=>"24h"===t?{displayHour:e,period:"AM"}:0===e?{displayHour:12,period:"AM"}:12===e?{displayHour:12,period:"PM"}:e>12?{displayHour:e-12,period:"PM"}:{displayHour:e,period:"AM"},clampMinuteToStep=(e,t)=>{const i=Math.round(e/t)*t;return Math.min(59,Math.max(0,i))},Wheel=({kind:e,label:t,data:i,selectedIndex:a,onIndexChange:n,formatItem:s,theme:r,haptic:o,testID:l})=>{const c=useRef(null),u=useRef(createAnimatedValue(40*a)).current,d=useRef(a),m=useRef(0);useEffect(()=>{if(d.current!==a){d.current=a;const e=40*a;setNativeValue(u,e),requestAnimationFrame(()=>{c.current?.scrollToOffset({offset:e,animated:!1})})}},[a,u]);const p=r.components.timePicker?.hapticDebounceMs??35,h=useMemo(()=>Animated.event([{nativeEvent:{contentOffset:{y:u}}}],{useNativeDriver:!0,listener:e=>{const t=e.nativeEvent.contentOffset.y,a=Math.round(t/40);if(a!==d.current&&a>=0&&a<i.length){const e=Date.now();if(e-m.current>=p){const t=resolveHaptic(o,"selection");t&&triggerHaptic(t),m.current=e}d.current=a}}}),[u,i.length,o,p]),g=useCallback(e=>{const t=e.nativeEvent.contentOffset.y,s=Math.max(0,Math.min(i.length-1,Math.round(t/40)));s!==a&&n(s)},[i.length,n,a]),f=useCallback(e=>{const t=e.nativeEvent.actionName;if("increment"===t){const e=Math.min(i.length-1,a+1);e!==a&&n(e)}else if("decrement"===t){const e=Math.max(0,a-1);e!==a&&n(e)}},[i.length,n,a]),y=useCallback(({item:e,index:t})=>{const i=Animated.subtract(Animated.divide(u,40),t),n=i.interpolate({inputRange:[-2,-1,0,1,2],outputRange:[.3,.6,1,.6,.3],extrapolate:"clamp"}),o=i.interpolate({inputRange:[-2,-1,0,1,2],outputRange:[.85,.95,1.05,.95,.85],extrapolate:"clamp"}),l=t===a;return _jsx(Animated.View,{style:[styles.wheelItem,{opacity:n,transform:[{scale:o}]}],accessible:!1,importantForAccessibility:"no",children:_jsx(Text,{style:[{fontSize:r.typography.fontSize.xl,color:l?r.colors.text.primary:r.colors.text.secondary,fontWeight:l?r.typography.fontWeight.semibold:r.typography.fontWeight.medium,letterSpacing:r.typography.letterSpacing.normal}],children:s(e)})})},[u,a,r,s]),b=useCallback((t,i)=>`${e}-${String(t)}-${i}`,[e]),x=useCallback((e,t)=>({length:40,offset:40*t,index:t}),[]),S=s(i[a]??"");return _jsxs(View,{style:styles.wheelColumn,testID:l,children:[_jsx(View,{pointerEvents:"none",style:styles.wheelA11yLayer,accessible:!0,accessibilityRole:"adjustable",accessibilityLabel:t,accessibilityValue:{text:S},accessibilityActions:[{name:"increment"},{name:"decrement"}],onAccessibilityAction:f}),_jsx(Animated.FlatList,{ref:c,data:i,keyExtractor:b,renderItem:y,getItemLayout:x,showsVerticalScrollIndicator:!1,snapToInterval:40,snapToAlignment:"start",decelerationRate:"fast",bounces:!1,scrollEventThrottle:16,onScroll:h,onMomentumScrollEnd:g,contentContainerStyle:{paddingVertical:40*CENTER_OFFSET},initialScrollIndex:a,style:styles.wheelList,importantForAccessibility:"no-hide-descendants"})]})},TimePicker=e=>{const{visible:t,value:i,onChange:a,onClose:n,format:s="12h",minuteStep:r=1,title:o="Select Time",confirmLabel:l="Confirm",cancelLabel:c="Cancel",testID:u,style:d,containerStyle:m,headerLabelStyle:p,footerButtonStyle:h,label:g,placeholder:f,helperText:y,error:b,required:x,disabled:S,size:v,variant:w,clearable:C,onClear:j,formatValue:k,triggerStyle:T,haptic:I}=e,M=void 0!==e.visible,[_,A]=useState(!1),E=M?t:_,V=M?u:u?`${u}-modal`:void 0,H=useTheme(),D=useSafeAreaInsets(),R=useMemo(()=>buildStyles(H),[H]),P=useRef(createAnimatedValue(0)).current,B=useRef(createAnimatedValue(40)).current,F=useRef(createAnimatedValue(0)).current,L=useRef(0),N=useCallback(()=>{M?n?.():A(!1)},[M,n]),O=useCallback(()=>{Animated.parallel([Animated.timing(P,{toValue:0,duration:H.motion.duration.fast,easing:Easing.bezier(...H.motion.easing.accelerate),useNativeDriver:!1}),Animated.timing(B,{toValue:40,duration:H.motion.duration.fast,easing:Easing.bezier(...H.motion.easing.accelerate),useNativeDriver:!0})]).start(()=>N())},[N,P,B,H.motion.duration.fast,H.motion.easing.accelerate]),{handleGesture:W}=useDragToDismiss({drag:F,travel:()=>L.current||320,onDismiss:O}),$=useMemo(()=>"24h"===s?range(0,23):range(1,12),[s]),z=useMemo(()=>range(0,59,r),[r]),G=useMemo(()=>["AM","PM"],[]),q=useMemo(()=>{const e=i&&Number.isFinite(i.hour)?i.hour:(new Date).getHours(),t=i&&Number.isFinite(i.minute)?i.minute:(new Date).getMinutes(),a=clampMinuteToStep(t,r),{displayHour:n,period:o}=from24h(e,s);return{displayHour:n,minute:a,period:o,hour24:e}},[i,s,r]),[U,K]=useState(()=>{const e=$.indexOf(q.displayHour);return e>=0?e:0}),[Y,J]=useState(()=>{const e=z.indexOf(q.minute);return e>=0?e:0}),[Q,X]=useState(()=>"PM"===q.period?1:0);useEffect(()=>{if(!E)return;const e=i&&Number.isFinite(i.hour)?i.hour:(new Date).getHours(),t=i&&Number.isFinite(i.minute)?i.minute:(new Date).getMinutes(),a=clampMinuteToStep(t,r),{displayHour:n,period:o}=from24h(e,s),l=$.indexOf(n);K(l>=0?l:0);const c=z.indexOf(a);J(c>=0?c:0),X("PM"===o?1:0)},[E,i,s,r,$,z]),useEffect(()=>{let e;return E?(e=Animated.parallel([Animated.timing(P,{toValue:1,duration:H.motion.duration.normal,easing:Easing.out(Easing.cubic),useNativeDriver:!1}),Animated.spring(B,{toValue:0,damping:H.motion.spring.snappy.damping,stiffness:H.motion.spring.snappy.stiffness,mass:H.motion.spring.snappy.mass,useNativeDriver:!0})]),e.start()):(P.setValue(0),setNativeValue(B,40),setNativeValue(F,0)),()=>e?.stop()},[E,P,B,F,H.motion]);const Z=useCallback(e=>{"ios"!==Platform.OS&&"android"!==Platform.OS||AccessibilityInfo.announceForAccessibility(e)},[]),ee=useCallback(e=>{K(e),Z(`Hour ${$[e]}`)},[$,Z]),te=useCallback(e=>{J(e),Z(`${z[e]} minutes`)},[z,Z]),ie=useCallback(e=>{X(e),Z(G[e]??"")},[G,Z]),ae=useCallback(()=>{!1!==I&&triggerHaptic("selection"),O()},[O,I]),ne=useCallback(()=>{const e=$[U]??0,t=G[Q]??"AM",i=to24h(e,t,s),n=z[Y]??0;!1!==I&&triggerHaptic("notificationSuccess"),a?.({hour:i,minute:n}),O()},[$,U,G,Q,z,Y,s,a,O,I]),se=useMemo(()=>{const e=$[U]??0,t=z[Y]??0;if("24h"===s)return`${pad2(e)}:${pad2(t)}`;const i=G[Q]??"AM";return`${pad2(e)}:${pad2(t)} ${i}`},[$,U,z,Y,G,Q,s]),re=useCallback(e=>pad2(Number(e)),[]),oe=useCallback(e=>pad2(Number(e)),[]),le=useCallback(e=>String(e),[]),ce=useCallback(e=>{if("24h"===s)return`${pad2(e.hour)}:${pad2(e.minute)}`;const{displayHour:t,period:i}=from24h(e.hour,"12h");return`${t}:${pad2(e.minute)} ${i}`},[s]),ue=!M&&i&&Number.isFinite(i.hour)&&Number.isFinite(i.minute)?(k??ce)(i):void 0,de=_jsx(Modal,{visible:E,transparent:!0,statusBarTranslucent:!0,navigationBarTranslucent:!0,animationType:"none",onRequestClose:O,testID:V,children:_jsxs(GestureHandlerRootView,{collapsable:!1,style:R.backdrop,children:[_jsx(Pressable,{style:StyleSheet.absoluteFill,onPress:O,accessibilityLabel:"Close time picker",accessibilityRole:"button"}),_jsxs(Animated.View,{style:[R.sheet,{paddingBottom:Math.max(D.bottom,H.spacing.lg),transform:[{translateY:Animated.add(B,F)}]},d,m],onLayout:e=>{L.current=e.nativeEvent.layout.height},accessibilityViewIsModal:!0,accessible:!0,accessibilityRole:"none",accessibilityLabel:o,children:[_jsx(GestureDetector,{gesture:W,children:_jsxs(View,{children:[_jsx(View,{style:R.handle}),_jsx(Text,{style:[R.title,p],accessibilityRole:"header",children:o})]})}),_jsx(View,{style:R.summaryWrap,accessibilityLiveRegion:"polite",accessibilityLabel:`Selected ${se}`,children:_jsx(Text,{style:R.summary,children:se})}),_jsxs(View,{style:R.wheelsRow,children:[_jsxs(View,{pointerEvents:"none",style:R.selectionBand,children:[_jsx(View,{style:R.bandLine}),_jsx(View,{style:[R.bandLine,R.bandLineBottom]})]}),_jsx(Wheel,{kind:"hour",label:"Hour",data:$,selectedIndex:U,onIndexChange:ee,formatItem:re,theme:H,haptic:I,testID:"time-picker-hour"}),_jsx(Text,{style:R.separator,children:":"}),_jsx(Wheel,{kind:"minute",label:"Minute",data:z,selectedIndex:Y,onIndexChange:te,formatItem:oe,theme:H,haptic:I,testID:"time-picker-minute"}),"12h"===s?_jsxs(_Fragment,{children:[_jsx(View,{style:R.spacer}),_jsx(Wheel,{kind:"period",label:"Period",data:G,selectedIndex:Q,onIndexChange:ie,formatItem:le,theme:H,haptic:I,testID:"time-picker-period"})]}):null]}),_jsxs(View,{style:R.footer,children:[_jsx(Button,{title:c,haptic:!1,variant:"ghost",tone:"neutral",onPress:ae,style:[R.footerBtn,h],accessibilityHint:"Dismiss without changes",testID:"time-picker-cancel"}),_jsx(Button,{title:l,variant:"solid",tone:"primary",haptic:!1,onPress:ne,style:[R.footerBtn,h],accessibilityHint:"Confirm selected time",testID:"time-picker-confirm"})]})]}),_jsx(ToastHost,{})]})});return M?de:_jsxs(_Fragment,{children:[_jsx(PickerTrigger,{label:g,placeholder:f,helperText:y,error:b,required:x,disabled:S,size:v,variant:w,clearable:C,onClear:j,value:ue,onPress:()=>A(!0),triggerStyle:T,testID:u}),de]})},styles=StyleSheet.create({wheelColumn:{width:64,height:200,overflow:"hidden"},wheelList:{flexGrow:0,height:200},wheelItem:{height:40,alignItems:"center",justifyContent:"center"},wheelA11yLayer:{...StyleSheet.absoluteFill,zIndex:2}}),buildStyles=e=>{const t=e.shadows.xl;return StyleSheet.create({backdrop:{flex:1,backgroundColor:e.colors.background.overlay,justifyContent:"flex-end"},sheet:{backgroundColor:e.colors.background.elevated,borderTopLeftRadius:e.radius.xl,borderTopRightRadius:e.radius.xl,...smoothCorners,paddingTop:e.spacing.sm,paddingHorizontal:e.spacing.lg,paddingBottom:e.spacing.xl,shadowColor:t.shadowColor,shadowOffset:t.shadowOffset,shadowOpacity:t.shadowOpacity,shadowRadius:t.shadowRadius,elevation:t.elevation},handle:{alignSelf:"center",width:e.components.timePicker?.handleWidth??36,height:e.components.timePicker?.handleHeight??4,borderRadius:e.radius.full,...smoothCorners,backgroundColor:e.colors.border.secondary,marginBottom:e.spacing.sm},title:{textAlign:"center",fontSize:e.typography.fontSize.lg,fontWeight:e.typography.fontWeight.semibold,color:e.colors.text.primary,marginBottom:e.spacing.sm},summaryWrap:{alignItems:"center",marginBottom:e.spacing.md},summary:{fontSize:e.typography.fontSize["2xl"],fontWeight:e.typography.fontWeight.bold,color:e.colors.primary,letterSpacing:e.typography.letterSpacing.wide},wheelsRow:{flexDirection:"row",alignItems:"center",justifyContent:"center",height:200,position:"relative",marginBottom:e.spacing.lg},selectionBand:{position:"absolute",left:0,right:0,top:40*CENTER_OFFSET,height:40,justifyContent:"space-between"},bandLine:{height:2*StyleSheet.hairlineWidth,backgroundColor:e.colors.primary,opacity:.85},bandLineBottom:{},separator:{fontSize:e.typography.fontSize["2xl"],fontWeight:e.typography.fontWeight.bold,color:e.colors.text.primary,paddingHorizontal:e.spacing.xs},spacer:{width:e.spacing.md},footer:{flexDirection:"row",justifyContent:"flex-end",alignItems:"center",gap:e.spacing.sm},footerBtn:{paddingHorizontal:e.spacing.lg}})};export{TimePicker};export default TimePicker;

package/lib/module/components/Timeline/Timeline.js

@@ -1 +1 @@
-"use strict";import React,{useCallback,useMemo,useState}from"react";import{StyleSheet,Text,View}from"react-native";import{fontFor,useTheme}from"../../theme/index.js";import{tintOf}from"../../utils/color.js";import{smoothCorners}from"../../utils/corners.js";import{jsx as _jsx,Fragment as _Fragment,jsxs as _jsxs}from"react/jsx-runtime";const DOT=12,HALO=6,RAIL=2,GAP=4,GUTTER=28,HALO_OPACITY=.16;export const Timeline=({items:e,variant:t="feed",orientation:r="vertical",style:o,testID:n})=>{const s=useTheme(),i=s.components.timeline,l=i?.dotSize??12,c=i?.haloWidth??6,a=i?.connectorGap??4,d=l+2*c,m=useMemo(()=>buildStyles(s,l,d,a),[s,l,d,a]),h="horizontal"===r,u=s.colors.border.primary,[g,x]=useState(0),y=useCallback(e=>{const{width:t}=e.nativeEvent.layout;x(e=>e===t?e:t)},[]),p=h&&g>0&&e.length>0?g/e.length:0,renderDisc=(e,t)=>e.icon?_jsx(View,{style:m.disc,children:e.icon}):_jsx(View,{style:[m.disc,{backgroundColor:tintOf(t,.16,s.colors.background.tertiary)}],children:_jsx(View,{style:[m.dot,{backgroundColor:t}]})}),renderText=(e,t)=>_jsxs(_Fragment,{children:[_jsx(Text,{style:[m.title,{fontSize:h?s.typography.fontSize.sm:s.typography.fontSize.base,color:"upcoming"===t?s.colors.text.secondary:s.colors.text.primary},h?m.centred:null],children:e.title}),e.meta?_jsx(Text,{style:[m.meta,{fontSize:s.typography.fontSize.xs,color:s.colors.text.tertiary},h?m.centred:null],children:e.meta}):null,e.description?_jsx(Text,{style:[m.description,{fontSize:s.typography.fontSize.sm,color:s.colors.text.secondary},h?m.centred:null],children:e.description}):null,e.children]}),f=e.map((r,o)=>{const n=r.status??("feed"===t?"done":"upcoming"),i=r.color??(e=>{switch(e){case"done":return s.colors.success;case"current":return s.colors.warning;case"onHold":return s.colors.info;case"rejected":return s.colors.error;case"cancelled":case"skipped":return s.colors.text.tertiary;default:return s.colors.text.disabled}})(n),l=0===o,c=o===e.length-1,d=r.key??`${r.title}-${o}`;return _jsxs(View,h?{style:[m.hColumn,p>0?{width:p,flex:0}:null],children:[_jsxs(View,{style:m.hDotRow,children:[_jsx(View,{style:[m.hSegment,{marginRight:a,backgroundColor:l?"transparent":u}]}),renderDisc(r,i),_jsx(View,{style:[m.hSegment,{marginLeft:a,backgroundColor:c?"transparent":u}]})]}),_jsx(View,{style:m.hBody,children:renderText(r,n)})]}:{style:m.row,children:[_jsxs(View,{style:m.gutter,children:[renderDisc(r,i),c?null:_jsx(View,{style:[m.rail,{backgroundColor:u}]})]}),_jsx(View,{style:[m.body,{paddingBottom:c?0:s.spacing.lg}],children:renderText(r,n)})]},d)});return _jsx(View,{style:[h?m.hRow:null,o],onLayout:h?y:void 0,testID:n,children:f})};const buildStyles=(e,t,r,o)=>StyleSheet.create({row:{flexDirection:"row"},gutter:{width:Math.max(28,r+4),alignItems:"center"},disc:{width:r,height:r,borderRadius:r/2,...smoothCorners,alignItems:"center",justifyContent:"center"},dot:{width:t,height:t,borderRadius:t/2,...smoothCorners},rail:{width:2,flex:1,marginTop:o,borderRadius:1,...smoothCorners},body:{flex:1,gap:2,paddingLeft:e.spacing.sm},hRow:{flexDirection:"row",alignItems:"flex-start"},hColumn:{flex:1,minWidth:0,alignItems:"center"},hDotRow:{alignSelf:"stretch",flexDirection:"row",alignItems:"center"},hSegment:{flex:1,height:2,borderRadius:1,...smoothCorners},hBody:{alignSelf:"stretch",alignItems:"center",paddingHorizontal:e.spacing.xs,marginTop:e.spacing.sm,gap:2},centred:{textAlign:"center"},title:{...fontFor(e,"semibold"),fontWeight:"600"},meta:{...fontFor(e,"normal")},description:{...fontFor(e,"normal")}});export default Timeline;
+"use strict";import{useCallback,useMemo,useState}from"react";import{StyleSheet,Text,View}from"react-native";import{fontFor,useTheme}from"../../theme/index.js";import{tintOf}from"../../utils/color.js";import{smoothCorners}from"../../utils/corners.js";import{jsx as _jsx,Fragment as _Fragment,jsxs as _jsxs}from"react/jsx-runtime";const DOT=12,HALO=6,RAIL=2,GAP=4,GUTTER=28,HALO_OPACITY=.16;export const Timeline=({items:e,variant:t="feed",orientation:r="vertical",style:o,testID:n})=>{const s=useTheme(),i=s.components.timeline,l=i?.dotSize??12,c=i?.haloWidth??6,a=i?.connectorGap??4,d=l+2*c,m=useMemo(()=>buildStyles(s,l,d,a),[s,l,d,a]),h="horizontal"===r,u=s.colors.border.primary,[g,x]=useState(0),y=useCallback(e=>{const{width:t}=e.nativeEvent.layout;x(e=>e===t?e:t)},[]),p=h&&g>0&&e.length>0?g/e.length:0,renderDisc=(e,t)=>e.icon?_jsx(View,{style:m.disc,children:e.icon}):_jsx(View,{style:[m.disc,{backgroundColor:tintOf(t,.16,s.colors.background.tertiary)}],children:_jsx(View,{style:[m.dot,{backgroundColor:t}]})}),renderText=(e,t)=>_jsxs(_Fragment,{children:[_jsx(Text,{style:[m.title,{fontSize:h?s.typography.fontSize.sm:s.typography.fontSize.base,color:"upcoming"===t?s.colors.text.secondary:s.colors.text.primary},h?m.centred:null],children:e.title}),e.meta?_jsx(Text,{style:[m.meta,{fontSize:s.typography.fontSize.xs,color:s.colors.text.tertiary},h?m.centred:null],children:e.meta}):null,e.description?_jsx(Text,{style:[m.description,{fontSize:s.typography.fontSize.sm,color:s.colors.text.secondary},h?m.centred:null],children:e.description}):null,e.children]}),f=e.map((r,o)=>{const n=r.status??("feed"===t?"done":"upcoming"),i=r.color??(e=>{switch(e){case"done":return s.colors.success;case"current":return s.colors.warning;case"onHold":return s.colors.info;case"rejected":return s.colors.error;case"cancelled":case"skipped":return s.colors.text.tertiary;default:return s.colors.text.disabled}})(n),l=0===o,c=o===e.length-1,d=r.key??`${r.title}-${o}`;return _jsxs(View,h?{style:[m.hColumn,p>0?{width:p,flex:0}:null],children:[_jsxs(View,{style:m.hDotRow,children:[_jsx(View,{style:[m.hSegment,{marginRight:a,backgroundColor:l?"transparent":u}]}),renderDisc(r,i),_jsx(View,{style:[m.hSegment,{marginLeft:a,backgroundColor:c?"transparent":u}]})]}),_jsx(View,{style:m.hBody,children:renderText(r,n)})]}:{style:m.row,children:[_jsxs(View,{style:m.gutter,children:[renderDisc(r,i),c?null:_jsx(View,{style:[m.rail,{backgroundColor:u}]})]}),_jsx(View,{style:[m.body,{paddingBottom:c?0:s.spacing.lg}],children:renderText(r,n)})]},d)});return _jsx(View,{style:[h?m.hRow:null,o],onLayout:h?y:void 0,testID:n,children:f})};const buildStyles=(e,t,r,o)=>StyleSheet.create({row:{flexDirection:"row"},gutter:{width:Math.max(28,r+4),alignItems:"center"},disc:{width:r,height:r,borderRadius:r/2,...smoothCorners,alignItems:"center",justifyContent:"center"},dot:{width:t,height:t,borderRadius:t/2,...smoothCorners},rail:{width:2,flex:1,marginTop:o,borderRadius:1,...smoothCorners},body:{flex:1,gap:2,paddingLeft:e.spacing.sm},hRow:{flexDirection:"row",alignItems:"flex-start"},hColumn:{flex:1,minWidth:0,alignItems:"center"},hDotRow:{alignSelf:"stretch",flexDirection:"row",alignItems:"center"},hSegment:{flex:1,height:2,borderRadius:1,...smoothCorners},hBody:{alignSelf:"stretch",alignItems:"center",paddingHorizontal:e.spacing.xs,marginTop:e.spacing.sm,gap:2},centred:{textAlign:"center"},title:{...fontFor(e,"semibold"),fontWeight:"600"},meta:{...fontFor(e,"normal")},description:{...fontFor(e,"normal")}});export default Timeline;

package/lib/module/components/Toast/Toast.js

@@ -1 +1 @@
-"use strict";import React,{useEffect,useMemo,useRef}from"react";import{Animated,Easing,PanResponder,Pressable,StyleSheet,Text,View}from"react-native";import{createAnimatedValue,fontFor,setNativeValue,useTheme}from"../../theme/index.js";import{smoothCorners}from"../../utils/corners.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const DEFAULT_SWIPE_DISMISS_THRESHOLD=80,DEFAULT_SWIPE_VELOCITY_THRESHOLD=.5,DEFAULT_STACK_OFFSET=8,DEFAULT_STACK_SCALE_STEP=.04,DEFAULT_AUTO_DISMISS_MS=3e3,Toast=({toast:e,index:t,onDismiss:i,shownAt:s})=>{const n=useTheme(),a=e.variant??"default",r=e.position??"bottom",o=useMemo(()=>buildStyles(n),[n]),l=useMemo(()=>tintFor(n,a),[n,a]),c=n.components.toast,d=c?.iconCircleSize??28,u=c?.iconCircleBorderRadius??14,m=c?.iconGlyphFontSize??16,p=c?.tintBarWidth??4,f=c?.swipeDismissThreshold??80,g=c?.swipeVelocityThreshold??.5,h=c?.stackOffset??8,y=c?.stackScaleStep??.04,S=c?.stackMinScale??.9,b=c?.defaultDurationMs??3e3,x=c?.enableSwipeDismiss??!0,v=c?.enterSpringDamping??18,A=c?.enterSpringStiffness??180,T=c?.enterSpringMass??1,V="top"===r?-120:120,D=useRef(createAnimatedValue(V)).current,w=useRef(createAnimatedValue(0)).current,_=useRef(createAnimatedValue(0)).current,R=useRef(!1),M="top"===r?t*h:-t*h,C=Math.max(1-t*y,S),E=useRef(createAnimatedValue(M)).current;useEffect(()=>{setNativeValue(E,M)},[M,E]);const j=useMemo(()=>Animated.add(D,E),[D,E]),dismiss=()=>{R.current||(R.current=!0,Animated.parallel([Animated.timing(_,{toValue:0,duration:n.motion.duration.fast,easing:Easing.bezier(...n.motion.easing.accelerate),useNativeDriver:!0}),Animated.timing(D,{toValue:V,duration:n.motion.duration.fast,easing:Easing.bezier(...n.motion.easing.accelerate),useNativeDriver:!0})]).start(()=>i(e.id)))};useEffect(()=>{const t=Animated.parallel([Animated.spring(D,{toValue:0,damping:v,stiffness:A,mass:T,useNativeDriver:!0}),Animated.timing(_,{toValue:1,duration:n.motion.duration.fast,useNativeDriver:!0})]);t.start();const i=e.duration??b;if(i>0){const e=void 0===s?0:Date.now()-s,n=setTimeout(()=>dismiss(),Math.max(i-e,0));return()=>{t.stop(),clearTimeout(n)}}return()=>t.stop()},[]);const L=useMemo(()=>PanResponder.create({onMoveShouldSetPanResponder:(e,t)=>Math.abs(t.dx)>Math.abs(t.dy)&&Math.abs(t.dx)>6,onPanResponderMove:(e,t)=>{setNativeValue(w,t.dx);const i=1-.7*Math.min(Math.abs(t.dx)/200,1);setNativeValue(_,i)},onPanResponderTerminate:()=>{Animated.parallel([Animated.spring(w,{toValue:0,damping:n.motion.spring.snappy.damping,stiffness:n.motion.spring.snappy.stiffness,mass:n.motion.spring.snappy.mass,useNativeDriver:!0}),Animated.timing(_,{toValue:1,duration:n.motion.duration.fast,useNativeDriver:!0})]).start()},onPanResponderRelease:(t,s)=>{if(Math.abs(s.dx)>f||Math.abs(s.vx)>g){const t=s.dx>=0?1:-1;Animated.parallel([Animated.timing(w,{toValue:500*t,duration:n.motion.duration.fast,useNativeDriver:!0}),Animated.timing(_,{toValue:0,duration:n.motion.duration.fast,useNativeDriver:!0})]).start(()=>{R.current=!0,i(e.id)})}else Animated.parallel([Animated.spring(w,{toValue:0,useNativeDriver:!0}),Animated.spring(_,{toValue:1,useNativeDriver:!0})]).start()}}),[w,_,f,g,n.motion.duration.fast,n.motion.spring.snappy.damping,n.motion.spring.snappy.stiffness,n.motion.spring.snappy.mass,i,e.id]),N=e.description?`${e.message}. ${e.description}`:e.message;return _jsxs(Animated.View,{...x?L.panHandlers:{},accessibilityRole:"alert",accessibilityLiveRegion:"assertive",accessibilityLabel:N,testID:e.testID,style:[o.container,{backgroundColor:n.colors.background.elevated,borderRadius:n.radius.lg,...smoothCorners,padding:n.spacing.md,...n.shadows.md,shadowColor:n.shadows.md.shadowColor,opacity:_,transform:[{translateY:j},{translateX:w},{scale:C}]},e.style,e.containerStyle],children:[_jsx(View,{style:[o.tintBar,{width:p,backgroundColor:l}]}),_jsxs(View,{style:o.row,children:[(()=>{if(e.icon)return e.icon;const t=defaultGlyph(a);return t?_jsx(View,{style:[o.iconCircle,{width:d,height:d,borderRadius:u,...smoothCorners,backgroundColor:l+"22"},e.iconCircleStyle],children:_jsx(Text,{style:[o.iconGlyph,{color:l,fontSize:m}],accessible:!1,children:t})}):null})(),_jsxs(View,{style:o.textBlock,children:[_jsx(Text,{style:[o.message,{color:n.colors.text.primary,fontSize:n.typography.fontSize.base,...fontFor(n,"semibold")},e.textStyle,e.messageStyle],numberOfLines:2,children:e.message}),e.description?_jsx(Text,{style:[o.description,{color:n.colors.text.secondary,fontSize:n.typography.fontSize.sm}],numberOfLines:3,children:e.description}):null]}),e.action?_jsx(Pressable,{accessibilityRole:"button",accessibilityLabel:e.action.label,onPress:()=>{e.action?.onPress(),dismiss()},style:({pressed:t})=>[o.actionBtn,{backgroundColor:t?n.colors.surface.pressed:"transparent"},e.actionButtonStyle],children:_jsx(Text,{style:{color:l,fontSize:n.typography.fontSize.sm,...fontFor(n,"semibold")},numberOfLines:1,children:e.action.label})}):null]})]})},tintFor=(e,t)=>{switch(t){case"success":return e.colors.success;case"error":return e.colors.error;case"warning":return e.colors.warning;case"info":return e.colors.info;default:return e.colors.text.primary}},defaultGlyph=e=>{switch(e){case"success":return"✓";case"error":return"×";case"warning":return"!";case"info":return"i";default:return""}},buildStyles=e=>StyleSheet.create({container:{overflow:"hidden",marginVertical:4},tintBar:{position:"absolute",left:0,top:0,bottom:0},row:{flexDirection:"row",alignItems:"center",paddingLeft:8},iconCircle:{alignItems:"center",justifyContent:"center",marginRight:12},iconGlyph:{fontWeight:"700",lineHeight:18},textBlock:{flex:1,paddingRight:8},message:{lineHeight:20},description:{marginTop:2,lineHeight:18},actionBtn:{paddingHorizontal:10,paddingVertical:6,borderRadius:8,...smoothCorners,marginLeft:8}});export{Toast};export default Toast;
+"use strict";import{useEffect,useMemo,useRef}from"react";import{Animated,Easing,PanResponder,Pressable,StyleSheet,Text,View}from"react-native";import{createAnimatedValue,fontFor,setNativeValue,useTheme}from"../../theme/index.js";import{smoothCorners}from"../../utils/corners.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const DEFAULT_SWIPE_DISMISS_THRESHOLD=80,DEFAULT_SWIPE_VELOCITY_THRESHOLD=.5,DEFAULT_STACK_OFFSET=8,DEFAULT_STACK_SCALE_STEP=.04,DEFAULT_AUTO_DISMISS_MS=3e3,Toast=({toast:e,index:t,onDismiss:s,shownAt:i})=>{const n=useTheme(),r=e.variant??"default",o=e.position??"bottom",a=useMemo(()=>buildStyles(n),[n]),l=useMemo(()=>tintFor(n,r),[n,r]),c=useMemo(()=>inkFor(n,r),[n,r]),d=n.components.toast,u=d?.iconCircleSize??28,m=d?.iconCircleBorderRadius??14,p=d?.iconGlyphFontSize??16,f=d?.tintBarWidth??0,g=d?.swipeDismissThreshold??80,h=d?.swipeVelocityThreshold??.5,y=d?.stackOffset??8,x=d?.stackScaleStep??.04,S=d?.stackMinScale??.9,b=d?.defaultDurationMs??3e3,v=d?.enableSwipeDismiss??!0,A=d?.enterSpringDamping??18,T=d?.enterSpringStiffness??180,w=d?.enterSpringMass??1,V="top"===o?-120:120,D=useRef(createAnimatedValue(V)).current,_=useRef(createAnimatedValue(0)).current,R=useRef(createAnimatedValue(0)).current,M=useRef(!1),C="top"===o?t*y:-t*y,E=Math.max(1-t*x,S),j=useRef(createAnimatedValue(C)).current;useEffect(()=>{setNativeValue(j,C)},[C,j]);const L=useMemo(()=>Animated.add(D,j),[D,j]),dismiss=()=>{M.current||(M.current=!0,Animated.parallel([Animated.timing(R,{toValue:0,duration:n.motion.duration.fast,easing:Easing.bezier(...n.motion.easing.accelerate),useNativeDriver:!0}),Animated.timing(D,{toValue:V,duration:n.motion.duration.fast,easing:Easing.bezier(...n.motion.easing.accelerate),useNativeDriver:!0})]).start(()=>s(e.id)))};useEffect(()=>{const t=Animated.parallel([Animated.spring(D,{toValue:0,damping:A,stiffness:T,mass:w,useNativeDriver:!0}),Animated.timing(R,{toValue:1,duration:n.motion.duration.fast,useNativeDriver:!0})]);t.start();const s=e.duration??b;if(s>0){const e=void 0===i?0:Date.now()-i,n=setTimeout(()=>dismiss(),Math.max(s-e,0));return()=>{t.stop(),clearTimeout(n)}}return()=>t.stop()},[]);const F=useMemo(()=>PanResponder.create({onMoveShouldSetPanResponder:(e,t)=>Math.abs(t.dx)>Math.abs(t.dy)&&Math.abs(t.dx)>6,onPanResponderMove:(e,t)=>{setNativeValue(_,t.dx);const s=1-.7*Math.min(Math.abs(t.dx)/200,1);setNativeValue(R,s)},onPanResponderTerminate:()=>{Animated.parallel([Animated.spring(_,{toValue:0,damping:n.motion.spring.snappy.damping,stiffness:n.motion.spring.snappy.stiffness,mass:n.motion.spring.snappy.mass,useNativeDriver:!0}),Animated.timing(R,{toValue:1,duration:n.motion.duration.fast,useNativeDriver:!0})]).start()},onPanResponderRelease:(t,i)=>{if(Math.abs(i.dx)>g||Math.abs(i.vx)>h){const t=i.dx>=0?1:-1;Animated.parallel([Animated.timing(_,{toValue:500*t,duration:n.motion.duration.fast,useNativeDriver:!0}),Animated.timing(R,{toValue:0,duration:n.motion.duration.fast,useNativeDriver:!0})]).start(()=>{M.current=!0,s(e.id)})}else Animated.parallel([Animated.spring(_,{toValue:0,useNativeDriver:!0}),Animated.spring(R,{toValue:1,useNativeDriver:!0})]).start()}}),[_,R,g,h,n.motion.duration.fast,n.motion.spring.snappy.damping,n.motion.spring.snappy.stiffness,n.motion.spring.snappy.mass,s,e.id]),N=e.description?`${e.message}. ${e.description}`:e.message;return _jsxs(Animated.View,{...v?F.panHandlers:{},accessibilityRole:"alert",accessibilityLiveRegion:"assertive",accessibilityLabel:N,testID:e.testID,style:[a.container,{backgroundColor:n.colors.background.elevated,borderRadius:n.radius.lg,...smoothCorners,padding:n.spacing.md,...n.shadows.md,shadowColor:n.shadows.md.shadowColor,opacity:R,transform:[{translateY:L},{translateX:_},{scale:E}]},e.style,e.containerStyle],children:[f>0?_jsx(View,{style:[a.tintBar,{width:f,backgroundColor:l}]}):null,_jsxs(View,{style:a.row,children:[(()=>{if(e.icon)return e.icon;const t=defaultGlyph(r);return t?_jsx(View,{style:[a.iconCircle,{width:u,height:u,borderRadius:m,...smoothCorners,backgroundColor:l+"22"},e.iconCircleStyle],children:_jsx(Text,{style:[a.iconGlyph,{color:c,fontSize:p}],accessible:!1,children:t})}):null})(),_jsxs(View,{style:a.textBlock,children:[_jsx(Text,{style:[a.message,{color:n.colors.text.primary,fontSize:n.typography.fontSize.base,...fontFor(n,"semibold")},e.textStyle,e.messageStyle],numberOfLines:2,children:e.message}),e.description?_jsx(Text,{style:[a.description,{color:n.colors.text.secondary,fontSize:n.typography.fontSize.sm}],numberOfLines:3,children:e.description}):null]}),e.action?_jsx(Pressable,{accessibilityRole:"button",accessibilityLabel:e.action.label,onPress:()=>{e.action?.onPress(),dismiss()},style:({pressed:t})=>[a.actionBtn,{backgroundColor:t?n.colors.surface.pressed:"transparent"},e.actionButtonStyle],children:_jsx(Text,{style:{color:l,fontSize:n.typography.fontSize.sm,...fontFor(n,"semibold")},numberOfLines:1,children:e.action.label})}):null]})]})},tintFor=(e,t)=>{switch(t){case"success":return e.colors.success;case"error":return e.colors.error;case"warning":return e.colors.warning;case"info":return e.colors.info;default:return e.colors.text.primary}},inkFor=(e,t)=>{switch(t){case"success":return e.colors.toneText.success;case"error":return e.colors.toneText.error;case"warning":return e.colors.toneText.warning;case"info":return e.colors.toneText.info;default:return e.colors.text.primary}},defaultGlyph=e=>{switch(e){case"success":return"✓";case"error":return"×";case"warning":return"!";case"info":return"i";default:return""}},buildStyles=e=>StyleSheet.create({container:{overflow:"hidden",marginVertical:4},tintBar:{position:"absolute",left:0,top:0,bottom:0},row:{flexDirection:"row",alignItems:"center",paddingLeft:8},iconCircle:{alignItems:"center",justifyContent:"center",marginRight:12},iconGlyph:{fontWeight:"700",lineHeight:18},textBlock:{flex:1,paddingRight:8},message:{lineHeight:20},description:{marginTop:2,lineHeight:18},actionBtn:{paddingHorizontal:10,paddingVertical:6,borderRadius:8,...smoothCorners,marginLeft:8}});export{Toast};export default Toast;

package/lib/module/components/Toast/ToastProvider.js

@@ -1 +1 @@
-"use strict";import React,{createContext,useCallback,useContext,useEffect,useMemo,useRef,useState}from"react";import{StyleSheet,View}from"react-native";import{useSafeAreaInsets}from"react-native-safe-area-context";import{useTheme}from"../../theme/index.js";import{triggerHaptic}from"../../utils/hapticUtils.js";import Toast from"./Toast.js";import{jsx as _jsx,jsxs as _jsxs,Fragment as _Fragment}from"react/jsx-runtime";const MAX_VISIBLE=3,ToastContext=createContext(null),ToastHostContext=createContext(null);let nextId=0;const makeId=()=>(nextId+=1,`toast-${Date.now().toString(36)}-${nextId.toString(36)}`),defaultHaptic=t=>{switch(t){case"error":return"notificationError";case"success":return"notificationSuccess";case"warning":return"notificationWarning";default:return"selection"}},resolveHaptics=(t,e)=>{if(!1===t)return!1;const o=t?.[e??"default"];return void 0===o?defaultHaptic(e):o};let nextHostId=0;const makeHostId=()=>(nextHostId+=1,nextHostId);let providerCount=0,activeApi=null;const setActiveApi=t=>{activeApi=t},getActiveApi=()=>activeApi;export const ToastProvider=({children:t,maxVisible:e=3,topOffset:o,bottomOffset:s,defaultDuration:r,haptics:n})=>{const a=useRef({defaultDuration:r,haptics:n});a.current={defaultDuration:r,haptics:n};const[i,u]=useState([]),[c,l]=useState([]),d=useCallback(t=>{u(e=>e.filter(e=>e.id!==t))},[]),p=useCallback(()=>{u([])},[]),f=useCallback(t=>{const o=makeId(),{defaultDuration:s,haptics:r}=a.current,n={...t,duration:t.duration??s,id:o,shownAt:Date.now()},i=void 0!==t.haptic?t.haptic:resolveHaptics(r,t.variant);return!1!==i&&triggerHaptic(i),u(t=>{const o=[...t,n];return o.length>e?o.slice(o.length-e):o}),o},[e]),m=useMemo(()=>({show:f,hide:d,hideAll:p}),[f,d,p]);useEffect(()=>(providerCount+=1,setActiveApi(m),()=>{providerCount-=1,providerCount<=0&&(providerCount=0,setActiveApi(null))}),[m]);const h=useCallback(t=>{l(e=>[...e,t])},[]),x=useCallback(t=>{l(e=>e.filter(e=>e!==t))},[]),v=c.length>0?c[c.length-1]:null,g=useMemo(()=>({register:h,unregister:x,activeHostId:v,queue:i,hide:d,topOffset:o,bottomOffset:s}),[h,x,v,i,d,o,s]);return _jsx(ToastContext.Provider,{value:m,children:_jsxs(ToastHostContext.Provider,{value:g,children:[t,null===v?_jsx(ToastLayers,{queue:i,onDismiss:d,topOffset:o,bottomOffset:s}):null]})})};let warnedHost=!1;const warnHostWithoutProvider=()=>{warnedHost||(warnedHost=!0,"undefined"!=typeof __DEV__&&__DEV__&&console.warn("[toast] <ToastHost /> rendered outside a <ToastProvider />; it renders nothing. Mount a provider near your app root."))};export const ToastHost=()=>{const t=useContext(ToastHostContext),[e]=useState(makeHostId),o=t?.register,s=t?.unregister;return useEffect(()=>{if(o&&s)return o(e),()=>s(e);warnHostWithoutProvider()},[o,s,e]),t&&t.activeHostId===e?_jsx(ToastLayers,{queue:t.queue,onDismiss:t.hide,topOffset:t.topOffset,bottomOffset:t.bottomOffset}):null};const ToastLayers=({queue:t,onDismiss:e,topOffset:o,bottomOffset:s})=>{const r=useTheme(),n=useSafeAreaInsets(),a=useMemo(()=>buildStyles(),[]),i=t.filter(t=>"top"===(t.position??"bottom")),u=t.filter(t=>"bottom"===(t.position??"bottom"));return _jsxs(_Fragment,{children:[_jsx(View,{testID:"toast-layer-top",pointerEvents:"box-none",style:[a.layer,a.top,{top:(o??n.top)+r.spacing.sm,paddingHorizontal:r.spacing.md}],children:i.map((t,o)=>_jsx(Toast,{toast:t,index:i.length-1-o,shownAt:t.shownAt,onDismiss:e},t.id))}),_jsx(View,{testID:"toast-layer-bottom",pointerEvents:"box-none",style:[a.layer,a.bottom,{bottom:(s??n.bottom)+r.spacing.sm,paddingHorizontal:r.spacing.md}],children:u.map((t,o)=>_jsx(Toast,{toast:t,index:u.length-1-o,shownAt:t.shownAt,onDismiss:e},t.id))})]})};export const useToast=()=>{const t=useContext(ToastContext);if(!t)throw new Error("useToast must be used within a <ToastProvider>.");return t};let warned=!1;const warnNoProvider=()=>{warned||(warned=!0,"undefined"!=typeof __DEV__&&__DEV__&&console.warn("[toast] No <ToastProvider /> mounted; toast() calls are no-ops. Mount a provider near your app root."))},proxy=t=>{const e=getActiveApi();if(!e)return warnNoProvider(),"";const o=t(e);return"string"==typeof o?o:""};export const toast={show:t=>proxy(e=>e.show(t)),success:(t,e)=>proxy(o=>o.show({...e,message:t,variant:"success"})),error:(t,e)=>proxy(o=>o.show({...e,message:t,variant:"error"})),warning:(t,e)=>proxy(o=>o.show({...e,message:t,variant:"warning"})),info:(t,e)=>proxy(o=>o.show({...e,message:t,variant:"info"})),hideAll:()=>{const t=getActiveApi();t?t.hideAll():warnNoProvider()}};const buildStyles=()=>StyleSheet.create({layer:{position:"absolute",left:0,right:0},top:{alignItems:"stretch"},bottom:{alignItems:"stretch"}});
+"use strict";import{createContext,useCallback,useContext,useEffect,useMemo,useRef,useState}from"react";import{StyleSheet,View}from"react-native";import{useSafeAreaInsets}from"react-native-safe-area-context";import{useTheme}from"../../theme/index.js";import{triggerHaptic}from"../../utils/hapticUtils.js";import Toast from"./Toast.js";import{jsx as _jsx,jsxs as _jsxs,Fragment as _Fragment}from"react/jsx-runtime";const MAX_VISIBLE=3,ToastContext=createContext(null),ToastHostContext=createContext(null);let nextId=0;const makeId=()=>(nextId+=1,`toast-${Date.now().toString(36)}-${nextId.toString(36)}`),defaultHaptic=t=>{switch(t){case"error":return"notificationError";case"success":return"notificationSuccess";case"warning":return"notificationWarning";default:return"selection"}},resolveHaptics=(t,e)=>{if(!1===t)return!1;const o=t?.[e??"default"];return void 0===o?defaultHaptic(e):o};let nextHostId=0;const makeHostId=()=>(nextHostId+=1,nextHostId);let providerCount=0,activeApi=null;const setActiveApi=t=>{activeApi=t},getActiveApi=()=>activeApi;export const ToastProvider=({children:t,maxVisible:e=3,topOffset:o,bottomOffset:s,defaultDuration:r,haptics:n})=>{const a=useRef({defaultDuration:r,haptics:n});a.current={defaultDuration:r,haptics:n};const[i,u]=useState([]),[c,l]=useState([]),d=useCallback(t=>{u(e=>e.filter(e=>e.id!==t))},[]),p=useCallback(()=>{u([])},[]),f=useCallback(t=>{const o=makeId(),{defaultDuration:s,haptics:r}=a.current,n={...t,duration:t.duration??s,id:o,shownAt:Date.now()},i=void 0!==t.haptic?t.haptic:resolveHaptics(r,t.variant);return!1!==i&&triggerHaptic(i),u(t=>{const o=[...t,n];return o.length>e?o.slice(o.length-e):o}),o},[e]),m=useMemo(()=>({show:f,hide:d,hideAll:p}),[f,d,p]);useEffect(()=>(providerCount+=1,setActiveApi(m),()=>{providerCount-=1,providerCount<=0&&(providerCount=0,setActiveApi(null))}),[m]);const h=useCallback(t=>{l(e=>[...e,t])},[]),x=useCallback(t=>{l(e=>e.filter(e=>e!==t))},[]),v=c.length>0?c[c.length-1]:null,g=useMemo(()=>({register:h,unregister:x,activeHostId:v,queue:i,hide:d,topOffset:o,bottomOffset:s}),[h,x,v,i,d,o,s]);return _jsx(ToastContext.Provider,{value:m,children:_jsxs(ToastHostContext.Provider,{value:g,children:[t,null===v?_jsx(ToastLayers,{queue:i,onDismiss:d,topOffset:o,bottomOffset:s}):null]})})};let warnedHost=!1;const warnHostWithoutProvider=()=>{warnedHost||(warnedHost=!0,"undefined"!=typeof __DEV__&&__DEV__&&console.warn("[toast] <ToastHost /> rendered outside a <ToastProvider />; it renders nothing. Mount a provider near your app root."))};export const ToastHost=()=>{const t=useContext(ToastHostContext),[e]=useState(makeHostId),o=t?.register,s=t?.unregister;return useEffect(()=>{if(o&&s)return o(e),()=>s(e);warnHostWithoutProvider()},[o,s,e]),t&&t.activeHostId===e?_jsx(ToastLayers,{queue:t.queue,onDismiss:t.hide,topOffset:t.topOffset,bottomOffset:t.bottomOffset}):null};const ToastLayers=({queue:t,onDismiss:e,topOffset:o,bottomOffset:s})=>{const r=useTheme(),n=useSafeAreaInsets(),a=useMemo(()=>buildStyles(),[]),i=t.filter(t=>"top"===(t.position??"bottom")),u=t.filter(t=>"bottom"===(t.position??"bottom"));return _jsxs(_Fragment,{children:[_jsx(View,{testID:"toast-layer-top",pointerEvents:"box-none",style:[a.layer,a.top,{top:(o??n.top)+r.spacing.sm,paddingHorizontal:r.spacing.md}],children:i.map((t,o)=>_jsx(Toast,{toast:t,index:i.length-1-o,shownAt:t.shownAt,onDismiss:e},t.id))}),_jsx(View,{testID:"toast-layer-bottom",pointerEvents:"box-none",style:[a.layer,a.bottom,{bottom:(s??n.bottom)+r.spacing.sm,paddingHorizontal:r.spacing.md}],children:u.map((t,o)=>_jsx(Toast,{toast:t,index:u.length-1-o,shownAt:t.shownAt,onDismiss:e},t.id))})]})};export const useToast=()=>{const t=useContext(ToastContext);if(!t)throw new Error("useToast must be used within a <ToastProvider>.");return t};let warned=!1;const warnNoProvider=()=>{warned||(warned=!0,"undefined"!=typeof __DEV__&&__DEV__&&console.warn("[toast] No <ToastProvider /> mounted; toast() calls are no-ops. Mount a provider near your app root."))},proxy=t=>{const e=getActiveApi();return e?t(e):(warnNoProvider(),"")};export const toast={show:t=>proxy(e=>e.show(t)),success:(t,e)=>proxy(o=>o.show({...e,message:t,variant:"success"})),error:(t,e)=>proxy(o=>o.show({...e,message:t,variant:"error"})),warning:(t,e)=>proxy(o=>o.show({...e,message:t,variant:"warning"})),info:(t,e)=>proxy(o=>o.show({...e,message:t,variant:"info"})),hideAll:()=>{const t=getActiveApi();t?t.hideAll():warnNoProvider()}};const buildStyles=()=>StyleSheet.create({layer:{position:"absolute",left:0,right:0},top:{alignItems:"stretch"},bottom:{alignItems:"stretch"}});

package/lib/module/components/ZoomableImage/ZoomableImage.js

@@ -1 +1 @@
-"use strict";import React,{useCallback,useEffect,useMemo}from"react";import{StyleSheet}from"react-native";import{Gesture,GestureDetector}from"react-native-gesture-handler";import Animated,{runOnJS,useAnimatedStyle,useSharedValue,withSpring}from"react-native-reanimated";import{resolveHaptic,triggerHaptic}from"../../utils/index.js";import{jsx as _jsx}from"react/jsx-runtime";const DEFAULT_MAX_SCALE=4,DEFAULT_MIN_SCALE=1,DEFAULT_DOUBLE_TAP_SCALE=2,SPRING_CONFIG={damping:18,stiffness:220,mass:1};export const ZoomableImage=({children:e,maxScale:a=4,minScale:t=1,doubleTapScale:l=2,disabled:r=!1,haptic:u,style:i,accessibilityLabel:n,testID:s})=>{const o=useSharedValue(1),v=useSharedValue(1),c=useSharedValue(0),S=useSharedValue(0),m=useSharedValue(0),d=useSharedValue(0),h=useCallback(()=>{o.value=withSpring(1,SPRING_CONFIG),v.value=1,c.value=withSpring(0,SPRING_CONFIG),S.value=withSpring(0,SPRING_CONFIG),m.value=0,d.value=0},[o,v,c,S,m,d]);useEffect(()=>{r&&h()},[r,h]);const p=useCallback(()=>{const e=resolveHaptic(u,"impactLight");e&&triggerHaptic(e)},[u]),I=useMemo(()=>Gesture.Pinch().enabled(!r).onStart(()=>{"worklet";v.value=o.value}).onUpdate(e=>{"worklet";const l=v.value*e.scale;o.value=l<t?t+.3*(l-t):l>a?a+.2*(l-a):l}).onEnd(()=>{"worklet";return o.value<t?(o.value=withSpring(t,SPRING_CONFIG),c.value=withSpring(0,SPRING_CONFIG),S.value=withSpring(0,SPRING_CONFIG),v.value=t,m.value=0,void(d.value=0)):o.value>a?(o.value=withSpring(a,SPRING_CONFIG),void(v.value=a)):void(v.value=o.value)}),[r,o,v,c,S,m,d,t,a]),G=useMemo(()=>Gesture.Pan().enabled(!r).minPointers(1).maxPointers(1).onStart(()=>{"worklet";m.value=c.value,d.value=S.value}).onUpdate(e=>{"worklet";o.value<=1||(c.value=m.value+e.translationX,S.value=d.value+e.translationY)}).onEnd(()=>{"worklet";m.value=c.value,d.value=S.value}),[r,o,c,S,m,d]),g=useMemo(()=>Gesture.Tap().enabled(!r).numberOfTaps(2).onEnd(()=>{"worklet";runOnJS(p)(),o.value>1?(o.value=withSpring(1,SPRING_CONFIG),c.value=withSpring(0,SPRING_CONFIG),S.value=withSpring(0,SPRING_CONFIG),v.value=1,m.value=0,d.value=0):(o.value=withSpring(l,SPRING_CONFIG),v.value=l)}),[r,o,v,c,S,m,d,p,l]),N=useMemo(()=>Gesture.Race(I,G,g),[I,G,g]),w=useAnimatedStyle(()=>({transform:[{translateX:c.value},{translateY:S.value},{scale:o.value}]}));return _jsx(GestureDetector,{gesture:N,children:_jsx(Animated.View,{style:[styles.container,i],testID:s,accessibilityLabel:n,accessibilityState:{disabled:r},children:_jsx(Animated.View,{style:[styles.content,w],children:e})})})};ZoomableImage.displayName="ZoomableImage";const styles=StyleSheet.create({container:{flex:1,alignItems:"center",justifyContent:"center",overflow:"hidden"},content:{width:"100%",height:"100%",alignItems:"center",justifyContent:"center"}});export default ZoomableImage;
+"use strict";import{useCallback,useEffect,useMemo}from"react";import{StyleSheet}from"react-native";import{Gesture,GestureDetector}from"react-native-gesture-handler";import Animated,{runOnJS,useAnimatedStyle,useSharedValue,withSpring}from"react-native-reanimated";import{resolveHaptic,triggerHaptic}from"../../utils/index.js";import{jsx as _jsx}from"react/jsx-runtime";const DEFAULT_MAX_SCALE=4,DEFAULT_MIN_SCALE=1,DEFAULT_DOUBLE_TAP_SCALE=2,SPRING_CONFIG={damping:18,stiffness:220,mass:1};export const ZoomableImage=({children:e,maxScale:a=4,minScale:t=1,doubleTapScale:l=2,disabled:r=!1,haptic:u,style:i,accessibilityLabel:n,testID:s})=>{const o=useSharedValue(1),v=useSharedValue(1),c=useSharedValue(0),S=useSharedValue(0),m=useSharedValue(0),d=useSharedValue(0),h=useCallback(()=>{o.value=withSpring(1,SPRING_CONFIG),v.value=1,c.value=withSpring(0,SPRING_CONFIG),S.value=withSpring(0,SPRING_CONFIG),m.value=0,d.value=0},[o,v,c,S,m,d]);useEffect(()=>{r&&h()},[r,h]);const p=useCallback(()=>{const e=resolveHaptic(u,"impactLight");e&&triggerHaptic(e)},[u]),I=useMemo(()=>Gesture.Pinch().enabled(!r).onStart(()=>{"worklet";v.value=o.value}).onUpdate(e=>{"worklet";const l=v.value*e.scale;o.value=l<t?t+.3*(l-t):l>a?a+.2*(l-a):l}).onEnd(()=>{"worklet";return o.value<t?(o.value=withSpring(t,SPRING_CONFIG),c.value=withSpring(0,SPRING_CONFIG),S.value=withSpring(0,SPRING_CONFIG),v.value=t,m.value=0,void(d.value=0)):o.value>a?(o.value=withSpring(a,SPRING_CONFIG),void(v.value=a)):void(v.value=o.value)}),[r,o,v,c,S,m,d,t,a]),G=useMemo(()=>Gesture.Pan().enabled(!r).minPointers(1).maxPointers(1).onStart(()=>{"worklet";m.value=c.value,d.value=S.value}).onUpdate(e=>{"worklet";o.value<=1||(c.value=m.value+e.translationX,S.value=d.value+e.translationY)}).onEnd(()=>{"worklet";m.value=c.value,d.value=S.value}),[r,o,c,S,m,d]),g=useMemo(()=>Gesture.Tap().enabled(!r).numberOfTaps(2).onEnd(()=>{"worklet";runOnJS(p)(),o.value>1?(o.value=withSpring(1,SPRING_CONFIG),c.value=withSpring(0,SPRING_CONFIG),S.value=withSpring(0,SPRING_CONFIG),v.value=1,m.value=0,d.value=0):(o.value=withSpring(l,SPRING_CONFIG),v.value=l)}),[r,o,v,c,S,m,d,p,l]),N=useMemo(()=>Gesture.Race(I,G,g),[I,G,g]),w=useAnimatedStyle(()=>({transform:[{translateX:c.value},{translateY:S.value},{scale:o.value}]}));return _jsx(GestureDetector,{gesture:N,children:_jsx(Animated.View,{style:[styles.container,i],testID:s,accessibilityLabel:n,accessibilityState:{disabled:r},"aria-disabled":r,children:_jsx(Animated.View,{style:[styles.content,w],children:e})})})};ZoomableImage.displayName="ZoomableImage";const styles=StyleSheet.create({container:{flex:1,alignItems:"center",justifyContent:"center",overflow:"hidden"},content:{width:"100%",height:"100%",alignItems:"center",justifyContent:"center"}});export default ZoomableImage;