npm - @webority/mobile-ui - Versions diffs - 0.18.1 → 0.19.1 - Mend

@webority/mobile-ui 0.18.1 → 0.19.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (215) hide show

package/lib/module/components/ProgressBar/ProgressBar.js CHANGED Viewed

	@@ -1 +1 @@
1	- "use strict";import{forwardRef,useEffect,useMemo,useRef}from"react";import{Animated,Easing,StyleSheet,Text,View}from"react-native";import{useReducedMotion}from"../../hooks/useReducedMotion.js";import{createAnimatedValue,fontFor,Gradient,setNativeValue,useTheme}from"../../theme/index.js";import{tintOf}from"../../utils/color.js";import{smoothCorners}from"../../utils/corners.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const 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}},GLOW_LOCATIONS=[0,.35,.5,.65,1],glowOf=e=>{const t=tintOf(e,0,"transparent"),r=tintOf(e,.6,e);return{colors:[t,r,e,r,t],locations:GLOW_LOCATIONS,start:{x:0,y:.5},end:{x:1,y:.5}}},clampProgress=e=>"number"!=typeof e\|\|Number.isNaN(e)\|\|e<0?0:e>1?1:e,ProgressBar=forwardRef((e,t)=>{const r=useTheme(),o=useReducedMotion(),{progress:s,label:i,showPercent:n=!1,indeterminate:a,height:l=6,radius:u,tone:c="primary",trackColor:d,barColor:m,gradient:p,segments:g,animated:f=!0,style:h,containerStyle:y,barStyle:b,accessibilityLabel:w,testID:x}=e,j=a??"number"!=typeof s,R=clampProgress(s),V=useRef(createAnimatedValue(R)).current,S=useRef(createAnimatedValue(0)).current,A=useRef(createAnimatedValue(0)).current,v=useRef(0),_=r.components.progressBar?.determinateAnimationDuration??400,C=r.components.progressBar?.indeterminateLoopDuration??1500,B=r.components.progressBar?.indeterminateWidth??"30%",O=useMemo(()=>buildStyles(r),[r]),N=u??r.radius.~~full~~,L=d??r.colors.surface.disabled,M=m??toneColor(r,c),P=useMemo(()=>p?"string"==typeof p?r.gradients[p]??null:p:null,[p,r.gradients]),k=useMemo(()=>glowOf(M),[M]),D=Array.isArray(g)&&g.length>0;useEffect(()=>{j\|\|(f?Animated.timing(V,{toValue:R,duration:_,easing:Easing.bezier(...r.motion.easing.standard),useNativeDriver:!1}).start():V.setValue(R))},[f,R,_,V,j,r]),useEffect(()=>{if(!j)return;setNativeValue(S,0);const e=Animated.loop(Animated.timing(S,{toValue:1,duration:C,easing:Easing.inOut(Easing.ease),useNativeDriver:!0}));return e.start(),()=>{e.stop()}},[j,S,C]);const E=V.interpolate({inputRange:[0,1],outputRange:["0%","100%"]}),T=S.interpolate({inputRange:[0,1],outputRange:[-1,1]}),G=S.interpolate({inputRange:[0,.5,1],outputRange:[.4,1,.4]}),F=n&&!j&&!D,I=null!=i\|\|F,z=_jsx(View,{ref:t,accessibilityRole:"progressbar",accessibilityLabel:w??("string"==typeof i?i:void 0),accessibilityValue:j?{text:"Loading"}:{min:0,max:100,now:Math.round(100R)},testID:x,onLayout:e=>{const t=e.nativeEvent.layout.width;v.current=t,setNativeValue(A,t)},style:[O.track,{height:l,borderRadius:N,...smoothCorners,backgroundColor:L},h,y],children:D?_jsx(View,{style:[O.segments,{height:l}],children:(g??[]).map((e,t)=>_jsx(View,{style:{width:100clampProgress(e.value)+"%",height:l,backgroundColor:e.color??toneColor(r,e.tone??"primary")}},t))}):_jsx(Animated.View,j?{style:[O.indeterminateBar,{height:l,width:o?"100%":B,opacity:o?G:1,transform:o?[]:[{translateX:Animated.multiply(T,A)}]},b],children:_jsx(Gradient,{gradient:k,style:StyleSheet.absoluteFill})}:{style:[O.determinateBar,{height:l,borderRadius:N,...smoothCorners,backgroundColor:P?"transparent":M,width:E,overflow:P?"hidden":void 0},b],children:P?_jsx(Gradient,{gradient:P,style:StyleSheet.absoluteFill}):null})});if(!I)return z;const W={fontSize:r.typography.fontSize.sm,...fontFor(r,"medium")};return _jsxs(View,{style:O.wrapper,children:[_jsxs(View,{style:[O.labelRow,{marginBottom:r.spacing.xs}],children:["string"==typeof i\|\|"number"==typeof i?_jsx(Text,{style:[O.label,W,{color:r.colors.text.primary}],children:i}):_jsx(View,{style:O.label,children:i}),F?_jsx(Text,{accessible:!1,importantForAccessibility:"no",style:[W,{color:r.colors.text.secondary}],children:`${Math.round(100*R)}%`}):null]}),z]})});ProgressBar.displayName="ProgressBar";const buildStyles=e=>StyleSheet.create({wrapper:{width:"100%"},labelRow:{flexDirection:"row",alignItems:"center",justifyContent:"space-between",columnGap:8},label:{flexShrink:1},track:{width:"100%",overflow:"hidden"},determinateBar:{position:"absolute",left:0,top:0},indeterminateBar:{position:"absolute",left:0,top:0},segments:{flexDirection:"row",width:"100%"}});export{ProgressBar};export default ProgressBar;
1	+ "use strict";import{forwardRef,useEffect,useMemo,useRef}from"react";import{Animated,Easing,StyleSheet,Text,View}from"react-native";import{useReducedMotion}from"../../hooks/useReducedMotion.js";import{createAnimatedValue,fontFor,Gradient,setNativeValue,useTheme}from"../../theme/index.js";import{tintOf}from"../../utils/color.js";import{smoothCorners}from"../../utils/corners.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const 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}},GLOW_LOCATIONS=[0,.35,.5,.65,1],glowOf=e=>{const t=tintOf(e,0,"transparent"),r=tintOf(e,.6,e);return{colors:[t,r,e,r,t],locations:GLOW_LOCATIONS,start:{x:0,y:.5},end:{x:1,y:.5}}},clampProgress=e=>"number"!=typeof e\|\|Number.isNaN(e)\|\|e<0?0:e>1?1:e,ProgressBar=forwardRef((e,t)=>{const r=useTheme(),s=useReducedMotion(),{progress:o,label:i,showPercent:n=!1,indeterminate:a,height:l=6,radius:u,tone:c="primary",trackColor:d,barColor:m,gradient:p,segments:g,animated:f=!0,style:h,containerStyle:y,barStyle:b,accessibilityLabel:w,testID:x}=e,j=a??"number"!=typeof o,R=clampProgress(o),V=useRef(createAnimatedValue(R)).current,S=useRef(createAnimatedValue(0)).current,A=useRef(createAnimatedValue(0)).current,v=useRef(0),_=r.components.progressBar?.determinateAnimationDuration??400,C=r.components.progressBar?.indeterminateLoopDuration??1500,B=r.components.progressBar?.indeterminateWidth??"30%",O=useMemo(()=>buildStyles(r),[r]),N=u??r.radius.pill,L=d??r.colors.surface.disabled,M=m??toneColor(r,c),P=useMemo(()=>p?"string"==typeof p?r.gradients[p]??null:p:null,[p,r.gradients]),k=useMemo(()=>glowOf(M),[M]),D=Array.isArray(g)&&g.length>0;useEffect(()=>{j\|\|(f?Animated.timing(V,{toValue:R,duration:_,easing:Easing.bezier(...r.motion.easing.standard),useNativeDriver:!1}).start():V.setValue(R))},[f,R,_,V,j,r]),useEffect(()=>{if(!j)return;setNativeValue(S,0);const e=Animated.loop(Animated.timing(S,{toValue:1,duration:C,easing:Easing.inOut(Easing.ease),useNativeDriver:!0}));return e.start(),()=>{e.stop()}},[j,S,C]);const E=V.interpolate({inputRange:[0,1],outputRange:["0%","100%"]}),T=S.interpolate({inputRange:[0,1],outputRange:[-1,1]}),G=S.interpolate({inputRange:[0,.5,1],outputRange:[.4,1,.4]}),F=n&&!j&&!D,I=null!=i\|\|F,z=_jsx(View,{ref:t,accessibilityRole:"progressbar",accessibilityLabel:w??("string"==typeof i?i:void 0),accessibilityValue:j?{text:"Loading"}:{min:0,max:100,now:Math.round(100R)},testID:x,onLayout:e=>{const t=e.nativeEvent.layout.width;v.current=t,setNativeValue(A,t)},style:[O.track,{height:l,borderRadius:N,...smoothCorners,backgroundColor:L},h,y],children:D?_jsx(View,{style:[O.segments,{height:l}],children:(g??[]).map((e,t)=>_jsx(View,{style:{width:100clampProgress(e.value)+"%",height:l,backgroundColor:e.color??toneColor(r,e.tone??"primary")}},t))}):_jsx(Animated.View,j?{style:[O.indeterminateBar,{height:l,width:s?"100%":B,opacity:s?G:1,transform:s?[]:[{translateX:Animated.multiply(T,A)}]},b],children:_jsx(Gradient,{gradient:k,style:StyleSheet.absoluteFill})}:{style:[O.determinateBar,{height:l,borderRadius:N,...smoothCorners,backgroundColor:P?"transparent":M,width:E,overflow:P?"hidden":void 0},b],children:P?_jsx(Gradient,{gradient:P,style:StyleSheet.absoluteFill}):null})});if(!I)return z;const W={fontSize:r.typography.fontSize.sm,...fontFor(r,"medium")};return _jsxs(View,{style:O.wrapper,children:[_jsxs(View,{style:[O.labelRow,{marginBottom:r.spacing.xs}],children:["string"==typeof i\|\|"number"==typeof i?_jsx(Text,{style:[O.label,W,{color:r.colors.text.primary}],children:i}):_jsx(View,{style:O.label,children:i}),F?_jsx(Text,{accessible:!1,importantForAccessibility:"no",style:[W,{color:r.colors.text.secondary}],children:`${Math.round(100*R)}%`}):null]}),z]})});ProgressBar.displayName="ProgressBar";const buildStyles=e=>StyleSheet.create({wrapper:{width:"100%"},labelRow:{flexDirection:"row",alignItems:"center",justifyContent:"space-between",columnGap:e.spacing.sm},label:{flexShrink:1},track:{width:"100%",overflow:"hidden"},determinateBar:{position:"absolute",left:0,top:0},indeterminateBar:{position:"absolute",left:0,top:0},segments:{flexDirection:"row",width:"100%"}});export{ProgressBar};export default ProgressBar;

package/lib/module/components/Radio/Radio.js CHANGED Viewed

	@@ -1 +1 @@
1	- "use strict";import{Logger}from"@webority/mobile-core";import{createContext,forwardRef,useContext,useMemo}from"react";import{Pressable,StyleSheet}from"react-native";import{useTheme}from"../../theme/index.js";import{resolveHaptic,triggerHaptic}from"../../utils/hapticUtils.js";import{fieldTextAsString,hasFieldText}from"../FieldBase/index.js";import{ChoiceText,hasChoiceDetail}from"../FieldBase/ChoiceText.js";import{RadioDot}from"./RadioDot.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";export const RadioGroupContext=createContext(null);export const useRadioGroup=()=>useContext(RadioGroupContext);const 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}},Radio=forwardRef((e,t)=>{const{value:o,selected:r,onChange:i,disabled:s=!1,label:a,description:l,error:c,size:n="md",tone:d="primary",accessibilityLabel:p,haptic:u,style:m,containerStyle:b,circleStyle:x,dotStyle:h,labelStyle:y,testID:f,...g}=e,S=useTheme(),w=useMemo(()=>buildStyles(S),[S]),C=useRadioGroup();__DEV__&&void 0===o&&Logger.warn("[@webority/mobile-ui] Radio was rendered without a `value`. Selection compares against it, so the group cannot track which option is chosen.");const R=C?C.selectedValue===o:!!r,j=C&&C.disabled\|\|s,T=toneColor(S,d),D=S.components.radio?.labelGap~~??10~~,_=p??fieldTextAsString(a),v=!0===C?.error\|\|!0===c\|\|hasFieldText(c);return _jsxs(Pressable,{ref:t,onPress:e=>{if(j)return;const t=resolveHaptic(u,"selection");t&&triggerHaptic(t),C?C.onChange(o):i?.(o)},disabled:j,accessibilityRole:"radio",accessibilityLabel:_,accessibilityHint:g.accessibilityHint??fieldTextAsString(l),accessibilityState:{checked:R,disabled:j},"aria-checked":R,"aria-disabled":j,testID:f,hitSlop:6,...g,style:({pressed:e})=>[w.row,hasChoiceDetail(l,c)?w.rowTop:null,{opacity:j?.55:e?.85:1},m,b],children:[_jsx(RadioDot,{selected:R,color:T,disabled:j&&!R,size:n,style:[!v\|\|R\|\|j?null:{borderColor:S.colors.field.borderError},x],dotStyle:h}),_jsx(ChoiceText,{label:a,description:l,error:c,disabled:j,labelLines:2,style:{marginLeft:D},labelStyle:y})]})});Radio.displayName="Radio";const buildStyles=e=>StyleSheet.create({row:{flexDirection:"row",alignItems:"center"},rowTop:{alignItems:"flex-start"}});export{Radio};export default Radio;
1	+ "use strict";import{Logger}from"@webority/mobile-core";import{createContext,forwardRef,useContext,useMemo}from"react";import{Pressable,StyleSheet}from"react-native";import{spaceOf,useTheme}from"../../theme/index.js";import{resolveHaptic,triggerHaptic}from"../../utils/hapticUtils.js";import{fieldTextAsString,hasFieldText}from"../FieldBase/index.js";import{ChoiceText,hasChoiceDetail}from"../FieldBase/ChoiceText.js";import{RadioDot}from"./RadioDot.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";export const RadioGroupContext=createContext(null);export const useRadioGroup=()=>useContext(RadioGroupContext);const 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}},Radio=forwardRef((e,t)=>{const{value:o,selected:r,onChange:i,disabled:s=!1,label:a,description:l,error:c,size:n="md",tone:d="primary",accessibilityLabel:p,haptic:m,style:u,containerStyle:b,circleStyle:x,dotStyle:h,labelStyle:f,testID:y,...g}=e,S=useTheme(),w=useMemo(()=>buildStyles(S),[S]),C=useRadioGroup();__DEV__&&void 0===o&&Logger.warn("[@webority/mobile-ui] Radio was rendered without a `value`. Selection compares against it, so the group cannot track which option is chosen.");const R=C?C.selectedValue===o:!!r,j=C&&C.disabled\|\|s,T=toneColor(S,d),D=spaceOf(S,S.components.radio.labelGap,"components.radio.labelGap"),_=p??fieldTextAsString(a),v=!0===C?.error\|\|!0===c\|\|hasFieldText(c);return _jsxs(Pressable,{ref:t,onPress:e=>{if(j)return;const t=resolveHaptic(m,"selection");t&&triggerHaptic(t),C?C.onChange(o):i?.(o)},disabled:j,accessibilityRole:"radio",accessibilityLabel:_,accessibilityHint:g.accessibilityHint??fieldTextAsString(l),accessibilityState:{checked:R,disabled:j},"aria-checked":R,"aria-disabled":j,testID:y,hitSlop:6,...g,style:({pressed:e})=>[w.row,hasChoiceDetail(l,c)?w.rowTop:null,{opacity:j?.55:e?.85:1},u,b],children:[_jsx(RadioDot,{selected:R,color:T,disabled:j&&!R,size:n,style:[!v\|\|R\|\|j?null:{borderColor:S.colors.field.borderError},x],dotStyle:h}),_jsx(ChoiceText,{label:a,description:l,error:c,disabled:j,labelLines:2,style:{marginLeft:D},labelStyle:f})]})});Radio.displayName="Radio";const buildStyles=e=>StyleSheet.create({row:{flexDirection:"row",alignItems:"center"},rowTop:{alignItems:"flex-start"}});export{Radio};export default Radio;

package/lib/module/components/Radio/RadioDot.js CHANGED Viewed

	@@ -1 +1 @@
1	- "use strict";import{useEffect,useMemo,useRef}from"react";import{Animated,StyleSheet,View}from"react-native";import{createAnimatedValue,useTheme}from"../../theme/index.js";import{smoothCorners}from"../../utils/corners.js";import{jsx as _jsx}from"react/jsx-runtime";~~const sizeMap={sm:{outer:16,inner:8},md:{outer:20,inner:10},lg:{outer:24,inner:12}};~~export const RadioDot=e=>{const{selected:t,color:o,disabled:r=!1,size:s="md",style:i,dotStyle:n}=e,a=useTheme(),m=useMemo(()=>buildStyles(),[]),d=o??a.colors.primary;let u,p;if("number"==typeof s)u=s,p=Math.round(s/2);else{const e=a~~.components.radio?.[~~s];u=e~~?.outer??sizeMap[s]~~.outer,p=e~~?.inner??sizeMap[s]~~.inner}const l=useRef(createAnimatedValue(t?1:0)).current;useEffect(()=>{const e=Animated.spring(l,{toValue:t?1:0,damping:a.motion.spring.snappy.damping,stiffness:a.motion.spring.snappy.stiffness,mass:a.motion.spring.snappy.mass,useNativeDriver:!0});return e.start(),()=>e.stop()},[t,l,a.motion.spring.snappy]);const c=l.interpolate({inputRange:[0,1],outputRange:[0,1]}),f=r?a.colors.border.primary:t?d:a.colors.border.primary;return _jsx(View,{style:[m.outer,{width:u,height:u,borderWidth:a.colors.border.width,borderRadius:~~u/2~~,...smoothCorners,borderColor:f},i],children:_jsx(Animated.View,{style:[{width:p,height:p,borderRadius:~~p/2~~,...smoothCorners,backgroundColor:r?a.colors.text.disabled:d,opacity:l,transform:[{scale:c}]},n]})})};RadioDot.displayName="RadioDot";const buildStyles=()=>StyleSheet.create({outer:{alignItems:"center",justifyContent:"center"}});export default RadioDot;
1	+ "use strict";import{useEffect,useMemo,useRef}from"react";import{Animated,StyleSheet,View}from"react-native";import{createAnimatedValue,resolveRadioSize,useTheme}from"../../theme/index.js";import{smoothCorners}from"../../utils/corners.js";import{jsx as _jsx}from"react/jsx-runtime";export const RadioDot=e=>{const{selected:t,color:o,disabled:r=!1,size:s="md",style:i,dotStyle:n}=e,a=useTheme(),d=useMemo(()=>buildStyles(),[]),m=o??a.colors.primary;let l,u;if("number"==typeof s)l=s,u=Math.round(s/2);else{const e=resolveRadioSize(a,s);l=e.outer,u=e.inner}const p=useRef(createAnimatedValue(t?1:0)).current;useEffect(()=>{const e=Animated.spring(p,{toValue:t?1:0,damping:a.motion.spring.snappy.damping,stiffness:a.motion.spring.snappy.stiffness,mass:a.motion.spring.snappy.mass,useNativeDriver:!0});return e.start(),()=>e.stop()},[t,p,a.motion.spring.snappy]);const c=p.interpolate({inputRange:[0,1],outputRange:[0,1]}),f=r?a.colors.border.primary:t?m:a.colors.border.primary;return _jsx(View,{style:[d.outer,{width:l,height:l,borderWidth:a.colors.border.width,borderRadius:a.radius.pill,...smoothCorners,borderColor:f},i],children:_jsx(Animated.View,{style:[{width:u,height:u,borderRadius:a.radius.pill,...smoothCorners,backgroundColor:r?a.colors.text.disabled:m,opacity:p,transform:[{scale:c}]},n]})})};RadioDot.displayName="RadioDot";const buildStyles=()=>StyleSheet.create({outer:{alignItems:"center",justifyContent:"center"}});export default RadioDot;

package/lib/module/components/Rating/Rating.js CHANGED Viewed

	@@ -1 +1 @@
1	- "use strict";import{forwardRef,useCallback,useMemo,useRef}from"react";import{Animated,Easing,Pressable,StyleSheet,Text,View}from"react-native";import{useTheme}from"../../theme/index.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 sizePxMap={sm:16,md:24,lg:32},resolveSize=e=>"number"==typeof e?e:sizePxMap[e],toneColorFor=(e,t)=>"primary"===t?e.colors.primary:e.colors.warning,clampToStep=(e,t,i)=>{const s=Math.max(0,Math.min(t,e)),n=Math.round(s/i)i;return Number(n.toFixed(2))},Star=({index:e,filled:t,size:i,filledColor:s,emptyColor:n,scale:a})=>{const o=Math.max(0,Math.min(1,t-e));return _jsxs(Animated.View,{style:[starStyles.starWrap,{width:i,height:i,transform:[{scale:a}]}],children:[_jsx(Text,{style:[starStyles.glyph,{color:n,fontSize:i,lineHeight:i}],accessible:!1,children:"☆"}),o>0?_jsx(View,{pointerEvents:"none",style:[starStyles.fillClip,{width:io,height:i}],children:_jsx(Text,{style:[starStyles.glyph,{color:s,fontSize:i,lineHeight:i}],accessible:!1,children:"★"})}):null]})},Rating=forwardRef((e,t)=>{const{value:i,onChange:s,max:n=5,allowHalf:a=!0,readonly:o=!1,size:r="md",tone:l="warning",label:c,loading:m=!1,haptic:d,accessibilityLabel:u,style:y,containerStyle:p,starContainerStyle:g,testID:f}=e,h=useTheme(),x=useMemo(()=>buildStyles(h),[h]),b=!o&&"function"==typeof s,S=a?.5:1,v=resolveSize(r),w=toneColorFor(h,l),j=h.colors.border.primary,R=useRef(v),k=useCallback(e=>{R.current=e.nativeEvent.layout.width},[]),C=useRef(new Map),_=useMemo(()=>{const e=C.current,t=[];for(let i=0;i<n;i+=1){let s=e.get(i);s\|\|(s=new Animated.Value(1),e.set(i,s)),t.push(s)}for(const t of Array.from(e.keys()))t>=n&&e.delete(t);return t},[n]),z=h.components.rating?.pulseOnPress??!1,M=h.components.rating?.pulseScale??1.2,A=useCallback(e=>{const t=_[e];t&&Animated.sequence([Animated.timing(t,{toValue:M,duration:h.motion.duration.fast,easing:Easing.bezier(...h.motion.easing.standard),useNativeDriver:!0}),Animated.spring(t,{toValue:1,damping:h.motion.spring.bouncy.damping,stiffness:h.motion.spring.bouncy.stiffness,mass:h.motion.spring.bouncy.mass,useNativeDriver:!0})]).start()},[h.motion,M,_]),V=useCallback((e,t)=>{if(!b\|\|!s)return;const i=clampToStep(e,n,S),a=resolveHaptic(d,"selection");a&&triggerHaptic(a),z&&"number"==typeof t&&A(t),s(i)},[b,s,n,S,A,d,z]),P=useCallback(e=>t=>{if(!b)return;const i=R.current\|\|v,s=t.nativeEvent.locationX??i;let n;n=a&&s<i/2?e+.5:e+1,V(n,e)},[b,v,a,V]),T=useCallback(e=>{b&&("increment"===e.nativeEvent.actionName?V(i+S):"decrement"===e.nativeEvent.actionName&&V(i-S))},[b,i,S,V]),D=`${i} of ${n} stars`,E=u??c??D,H=[];for(let e=0;e<n;e+=1){const t=_[e];if(!t)continue;const s=_jsx(Star,{index:e,filled:i,size:v,filledColor:w,emptyColor:j,scale:t},e);H.push(b?_jsx(Pressable,{onPress:P(e),onLayout:0===e?k:void 0,hitSlop:4,accessible:!1,style:x.starPress,children:s},e):_jsx(View,{onLayout:0===e?k:void 0,style:x.starPress,children:s},e))}const N=_jsxs(View,{style:[x.wrapper,y,p],ref:t,testID:f,children:[c?_jsx(Text,{style:[x.label,{color:h.colors.text.secondary,fontSize:h.typography.fontSize.sm}],children:c}):null,_jsx(View,{style:[x.row,g],accessible:!0,accessibilityRole:b?"adjustable":"text",accessibilityLabel:E,accessibilityValue:b?{min:0,max:n,now:i,text:D}:void 0,accessibilityActions:b?[{name:"increment"},{name:"decrement"}]:void 0,onAccessibilityAction:b?T:void 0,children:H})]});return m?_jsx(RatingSkeleton,{...e}):N});Rating.displayName="Rating";const RatingSkeleton=({max:e=5,size:t="md",label:i,containerStyle:s,starContainerStyle:n,style:a})=>{const o=resolveSize(t),r=Math.max(1,e);return _jsxs(View,{style:[{alignItems:"flex-start"},s,a],accessibilityRole:"progressbar",accessibilityState:{busy:!0},"aria-busy":!0,children:[void 0!==i?_jsx(Skeleton,{shape:"text",width:80,height:14,style:{marginBottom:6}}):null,_jsx(View,{style:[{flexDirection:"row"},n],children:Array.from({length:r}).map((e,t)=>_jsx(Skeleton,{width:o,height:o,radius:Math.round(.25*o),style:t<r-1?{marginRight:4}:void 0},`sk-star-${t}`))})]})};RatingSkeleton.displayName="RatingSkeleton",Rating.Skeleton=RatingSkeleton;const starStyles=StyleSheet.create({starWrap:{position:"relative",alignItems:"flex-start",justifyContent:"center"},glyph:{textAlign:"left",includeFontPadding:!1},fillClip:{position:"absolute",top:0,left:0,overflow:"hidden"}}),buildStyles=e=>StyleSheet.create({wrapper:{flexDirection:"column"},row:{flexDirection:"row",alignItems:"center"},starPress:{marginRight:4},label:{marginBottom:6}});export{Rating};export default Rating;
1	+ "use strict";import{forwardRef,useCallback,useMemo,useRef}from"react";import{Animated,Easing,Pressable,StyleSheet,Text,View}from"react-native";import{useTheme}from"../../theme/index.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 sizePxMap={sm:16,md:24,lg:32},resolveSize=e=>"number"==typeof e?e:sizePxMap[e],toneColorFor=(e,t)=>"primary"===t?e.colors.primary:e.colors.warning,clampToStep=(e,t,i)=>{const s=Math.max(0,Math.min(t,e)),n=Math.round(s/i)i;return Number(n.toFixed(2))},Star=({index:e,filled:t,size:i,filledColor:s,emptyColor:n,scale:a})=>{const o=Math.max(0,Math.min(1,t-e));return _jsxs(Animated.View,{style:[starStyles.starWrap,{width:i,height:i,transform:[{scale:a}]}],children:[_jsx(Text,{style:[starStyles.glyph,{color:n,fontSize:i,lineHeight:i}],accessible:!1,children:"☆"}),o>0?_jsx(View,{pointerEvents:"none",style:[starStyles.fillClip,{width:io,height:i}],children:_jsx(Text,{style:[starStyles.glyph,{color:s,fontSize:i,lineHeight:i}],accessible:!1,children:"★"})}):null]})},Rating=forwardRef((e,t)=>{const{value:i,onChange:s,max:n=5,allowHalf:a=!0,readonly:o=!1,size:r="md",tone:l="warning",label:c,loading:m=!1,haptic:d,accessibilityLabel:u,style:p,containerStyle:y,starContainerStyle:g,testID:f}=e,h=useTheme(),x=useMemo(()=>buildStyles(h),[h]),b=!o&&"function"==typeof s,S=a?.5:1,v=resolveSize(r),w=toneColorFor(h,l),j=h.colors.border.primary,R=useRef(v),k=useCallback(e=>{R.current=e.nativeEvent.layout.width},[]),C=useRef(new Map),_=useMemo(()=>{const e=C.current,t=[];for(let i=0;i<n;i+=1){let s=e.get(i);s\|\|(s=new Animated.Value(1),e.set(i,s)),t.push(s)}for(const t of Array.from(e.keys()))t>=n&&e.delete(t);return t},[n]),z=h.components.rating?.pulseOnPress??!1,M=h.components.rating?.pulseScale??1.2,A=useCallback(e=>{const t=_[e];t&&Animated.sequence([Animated.timing(t,{toValue:M,duration:h.motion.duration.fast,easing:Easing.bezier(...h.motion.easing.standard),useNativeDriver:!0}),Animated.spring(t,{toValue:1,damping:h.motion.spring.bouncy.damping,stiffness:h.motion.spring.bouncy.stiffness,mass:h.motion.spring.bouncy.mass,useNativeDriver:!0})]).start()},[h.motion,M,_]),V=useCallback((e,t)=>{if(!b\|\|!s)return;const i=clampToStep(e,n,S),a=resolveHaptic(d,"selection");a&&triggerHaptic(a),z&&"number"==typeof t&&A(t),s(i)},[b,s,n,S,A,d,z]),P=useCallback(e=>t=>{if(!b)return;const i=R.current\|\|v,s=t.nativeEvent.locationX??i;let n;n=a&&s<i/2?e+.5:e+1,V(n,e)},[b,v,a,V]),T=useCallback(e=>{b&&("increment"===e.nativeEvent.actionName?V(i+S):"decrement"===e.nativeEvent.actionName&&V(i-S))},[b,i,S,V]),D=`${i} of ${n} stars`,E=u??c??D,H=[];for(let e=0;e<n;e+=1){const t=_[e];if(!t)continue;const s=_jsx(Star,{index:e,filled:i,size:v,filledColor:w,emptyColor:j,scale:t},e);H.push(b?_jsx(Pressable,{onPress:P(e),onLayout:0===e?k:void 0,hitSlop:4,accessible:!1,style:x.starPress,children:s},e):_jsx(View,{onLayout:0===e?k:void 0,style:x.starPress,children:s},e))}const N=_jsxs(View,{style:[x.wrapper,p,y],ref:t,testID:f,children:[c?_jsx(Text,{style:[x.label,{color:h.colors.text.secondary,fontSize:h.typography.fontSize.sm}],children:c}):null,_jsx(View,{style:[x.row,g],accessible:!0,accessibilityRole:b?"adjustable":"text",accessibilityLabel:E,accessibilityValue:b?{min:0,max:n,now:i,text:D}:void 0,accessibilityActions:b?[{name:"increment"},{name:"decrement"}]:void 0,onAccessibilityAction:b?T:void 0,children:H})]});return m?_jsx(RatingSkeleton,{...e}):N});Rating.displayName="Rating";const RatingSkeleton=({max:e=5,size:t="md",label:i,containerStyle:s,starContainerStyle:n,style:a})=>{const o=useTheme(),r=resolveSize(t),l=Math.max(1,e);return _jsxs(View,{style:[{alignItems:"flex-start"},s,a],accessibilityRole:"progressbar",accessibilityState:{busy:!0},"aria-busy":!0,children:[void 0!==i?_jsx(Skeleton,{shape:"text",width:80,height:14,style:{marginBottom:o.spacing.xs}}):null,_jsx(View,{style:[{flexDirection:"row"},n],children:Array.from({length:l}).map((e,t)=>_jsx(Skeleton,{width:r,height:r,radius:Math.round(.25*r),style:t<l-1?{marginRight:o.spacing.xs}:void 0},`sk-star-${t}`))})]})};RatingSkeleton.displayName="RatingSkeleton",Rating.Skeleton=RatingSkeleton;const starStyles=StyleSheet.create({starWrap:{position:"relative",alignItems:"flex-start",justifyContent:"center"},glyph:{textAlign:"left",includeFontPadding:!1},fillClip:{position:"absolute",top:0,left:0,overflow:"hidden"}}),buildStyles=e=>StyleSheet.create({wrapper:{flexDirection:"column"},row:{flexDirection:"row",alignItems:"center"},starPress:{marginRight:e.spacing.xs},label:{marginBottom:e.spacing.xs}});export{Rating};export default Rating;

package/lib/module/components/ScannerOverlay/ScannerOverlay.js CHANGED Viewed

	@@ -1 +1 @@
1	- "use strict";import{forwardRef,useEffect,useMemo,useRef,useState}from"react";import{Animated,StyleSheet,View}from"react-native";import{useSafeAreaInsets}from"react-native-safe-area-context";import{useReducedMotion}from"../../hooks/useReducedMotion.js";import{createAnimatedValue,useTheme}from"../../theme/index.js";import{announce}from"../../utils/announce.js";import{smoothCorners}from"../../utils/corners.js";import{triggerHaptic}from"../../utils/hapticUtils.js";import{AppIcon}from"../AppIcon/index.js";import{Button}from"../Button/index.js";import{EmptyState}from"../EmptyState/index.js";import{IconButton}from"../IconButton/index.js";import{Text}from"../Text/index.js";import{jsx as _jsx,jsxs as _jsxs,Fragment as _Fragment}from"react/jsx-runtime";const MIN_FRAME=240,DEFAULT_FRAME=260,MARK_LENGTH=32,MARK_THICKNESS=4,LIFT=.06,BREATHE_SCALE=1.03,SNAP_SCALE=1.08,T=4,CORNERS=[{key:"tl",style:{top:0,left:0,borderTopWidth:4,borderLeftWidth:4}},{key:"tr",style:{top:0,right:0,borderTopWidth:4,borderRightWidth:4}},{key:"bl",style:{bottom:0,left:0,borderBottomWidth:4,borderLeftWidth:4}},{key:"br",style:{bottom:0,right:0,borderBottomWidth:4,borderRightWidth:4}}],DEFAULT_LABELS={found:"Code found",invalid:"This code cannot be used. Try another.",torchOn:"Turn torch on",torchOff:"Turn torch off",manualEntry:"Enter code instead",gallery:"Upload from gallery",noPermissionTitle:"Camera access is off",noPermissionMessage:"Allow camera access to scan a code.",permissionAction:"Allow camera access",noCameraTitle:"No camera found",noCameraMessage:"This device has no camera available. You can still add the code another way."},ScannerOverlay=forwardRef((e,t)=>{const{children:o,state:n="scanning",hint:i="Point the camera at the code",labels:r,torch:s=!1,onTorchChange:a,onManualEntry:l,onGallery:c,onPermissionAction:d,frameSize:m=DEFAULT_FRAME,haptic:u,style:h,testID:f}=e,p=useTheme(),g=useSafeAreaInsets(),y=useReducedMotion(),b=useMemo(()=>buildStyles(p),[p]),x={...DEFAULT_LABELS,...r},[j,v]=useState({width:0,height:0}),S="scanning"===n\|\|"found"===n\|\|"invalid"===n,w=useRef(createAnimatedValue(1)).current,A=p.motion.duration.slower,E=p.motion.duration.normal;useEffect(()=>{if(w.setValue(1),y)return;let e;return"scanning"===n&&A>0?e=Animated.loop(Animated.sequence([Animated.timing(w,{toValue:1.03,duration:2A,useNativeDriver:!0}),Animated.timing(w,{toValue:1,duration:2A,useNativeDriver:!0})])):"found"===n&&E>0&&(w.setValue(1.08),e=Animated.timing(w,{toValue:1,duration:E,useNativeDriver:!0})),e?.start(),()=>e?.stop()},[n,y,A,E,w]);const _=useRef(n);useEffect(()=>{_.current!==n&&(_.current=n,!1!==u&&("found"===n?triggerHaptic("notificationSuccess"):"invalid"===n&&triggerHaptic("notificationError")))},[n,u]);const{found:V,invalid:C}=x,{noPermissionTitle:R,noPermissionMessage:M}=x,{noCameraTitle:k,noCameraMessage:I}=x;useEffect(()=>{switch(n){case"scanning":announce(i);break;case"found":announce(V);break;case"invalid":announce(C,{polite:!1});break;case"noPermission":announce(`${R}. ${M}`);break;case"noCamera":announce(`${k}. ${I}`)}},[n,i,V,C,R,M,k,I]);const L=Math.max(240,Math.min(m,j.width-2p.spacing.xl)),P=(j.width-L)/2,F=Math.max(p.spacing.md,(j.height-L)/2-.06j.height),B=j.width>0&&j.height>0,O={borderColor:"found"===n?p.colors.success:"invalid"===n?p.colors.error:p.colors.onOverlay,width:32,height:32},N="found"===n\|\|"invalid"===n?_jsx(View,{style:[b.pill,{backgroundColor:"found"===n?p.colors.success:p.colors.error}],children:_jsx(Text,{variant:"bodySmall",weight:"semibold",align:"center",color:"found"===n?p.colors.onSuccess:p.colors.onError,children:"found"===n?V:C})}):_jsx(Text,{variant:"bodySmall",align:"center",color:p.colors.onOverlay,children:i}),D=S&&null!=a,H=S?"glass":"outline";return _jsxs(View,{ref:t,testID:f,onLayout:e=>{const{width:t,height:o}=e.nativeEvent.layout;v(e=>e.width===t&&e.height===o?e:{width:t,height:o})},style:[b.root,!S&&{backgroundColor:p.colors.background.primary},h],children:[S?_jsx(View,{style:StyleSheet.absoluteFill,children:o}):null,S&&B?_jsxs(_Fragment,{children:[_jsxs(View,{pointerEvents:"none",style:StyleSheet.absoluteFill,accessibilityElementsHidden:!0,importantForAccessibility:"no-hide-descendants","aria-hidden":!0,children:[_jsx(View,{style:[b.scrim,{left:0,right:0,top:0,height:F}]}),_jsx(View,{style:[b.scrim,{left:0,right:0,top:F+L,bottom:0}]}),_jsx(View,{style:[b.scrim,{left:0,width:P,top:F,height:L}]}),_jsx(View,{style:[b.scrim,{left:P+L,right:0,top:F,height:L}]}),_jsx(Animated.View,{style:{position:"absolute",left:P,top:F,width:L,height:L,transform:[{scale:w}]},children:CORNERS.map(e=>_jsx(View,{style:[b.mark,O,e.style]},e.key))})]}),_jsx(View,{pointerEvents:"none",style:[b.message,{top:F+L+p.spacing.md}],children:N})]}):null,S?null:_jsx(View,{style:b.panel,children:_jsx(EmptyState,{fill:!0,icon:_jsx(AppIcon,{name:"noPermission"===n?"camera":"camera-slash",size:48,color:p.colors.text.tertiary}),title:"noPermission"===n?R:k,description:"noPermission"===n?M:I,action:"noPermission"===n&&d?{label:x.permissionAction,onPress:d}:void 0})}),_jsxs(View,{pointerEvents:"box-none",style:[b.bar,{paddingBottom:Math.max(g.bottom,p.spacing.md)}],children:[D?_jsx(IconButton,{icon:s?"flash":"flash-slash",variant:"glass",size:"lg",active:s,haptic:u,accessibilityLabel:s?x.torchOff:x.torchOn,onPress:()=>a?.(!s)}):null,c?_jsx(Button,{title:x.gallery,leftIcon:"gallery",variant:H,tone:"neutral",size:"lg",haptic:u,onPress:c}):null,l?_jsx(Button,{title:x.manualEntry,leftIcon:"keyboard",variant:H,tone:"neutral",size:"lg",haptic:u,onPress:l}):null]})]})});ScannerOverlay.displayName="ScannerOverlay";const buildStyles=e=>StyleSheet.create({root:{flex:1,overflow:"hidden"},scrim:{position:"absolute",backgroundColor:e.colors.background.overlay},mark:{position:"absolute"},message:{position:"absolute",left:0,right:0,alignItems:"center",paddingHorizontal:e.spacing.xl},pill:{paddingHorizontal:e.spacing.md,paddingVertical:e.spacing.xs,borderRadius:e.radius.~~full~~,...smoothCorners},panel:{...StyleSheet.absoluteFill,justifyContent:"center"},bar:{position:"absolute",left:0,right:0,bottom:0,flexDirection:"row",flexWrap:"wrap",alignItems:"center",justifyContent:"center",gap:e.spacing.sm,paddingHorizontal:e.spacing.md}});export{ScannerOverlay};export default ScannerOverlay;
1	+ "use strict";import{forwardRef,useEffect,useMemo,useRef,useState}from"react";import{Animated,StyleSheet,View}from"react-native";import{useSafeAreaInsets}from"react-native-safe-area-context";import{useReducedMotion}from"../../hooks/useReducedMotion.js";import{createAnimatedValue,useTheme}from"../../theme/index.js";import{announce}from"../../utils/announce.js";import{smoothCorners}from"../../utils/corners.js";import{triggerHaptic}from"../../utils/hapticUtils.js";import{AppIcon}from"../AppIcon/index.js";import{Button}from"../Button/index.js";import{EmptyState}from"../EmptyState/index.js";import{IconButton}from"../IconButton/index.js";import{Text}from"../Text/index.js";import{jsx as _jsx,jsxs as _jsxs,Fragment as _Fragment}from"react/jsx-runtime";const MIN_FRAME=240,DEFAULT_FRAME=260,MARK_LENGTH=32,MARK_THICKNESS=4,LIFT=.06,BREATHE_SCALE=1.03,SNAP_SCALE=1.08,T=4,CORNERS=[{key:"tl",style:{top:0,left:0,borderTopWidth:4,borderLeftWidth:4}},{key:"tr",style:{top:0,right:0,borderTopWidth:4,borderRightWidth:4}},{key:"bl",style:{bottom:0,left:0,borderBottomWidth:4,borderLeftWidth:4}},{key:"br",style:{bottom:0,right:0,borderBottomWidth:4,borderRightWidth:4}}],DEFAULT_LABELS={found:"Code found",invalid:"This code cannot be used. Try another.",torchOn:"Turn torch on",torchOff:"Turn torch off",manualEntry:"Enter code instead",gallery:"Upload from gallery",noPermissionTitle:"Camera access is off",noPermissionMessage:"Allow camera access to scan a code.",permissionAction:"Allow camera access",noCameraTitle:"No camera found",noCameraMessage:"This device has no camera available. You can still add the code another way."},ScannerOverlay=forwardRef((e,t)=>{const{children:o,state:n="scanning",hint:i="Point the camera at the code",labels:r,torch:s=!1,onTorchChange:a,onManualEntry:l,onGallery:c,onPermissionAction:d,frameSize:m=DEFAULT_FRAME,haptic:u,style:h,testID:p}=e,f=useTheme(),g=useSafeAreaInsets(),y=useReducedMotion(),b=useMemo(()=>buildStyles(f),[f]),x={...DEFAULT_LABELS,...r},[j,v]=useState({width:0,height:0}),S="scanning"===n\|\|"found"===n\|\|"invalid"===n,w=useRef(createAnimatedValue(1)).current,A=f.motion.duration.slower,E=f.motion.duration.normal;useEffect(()=>{if(w.setValue(1),y)return;let e;return"scanning"===n&&A>0?e=Animated.loop(Animated.sequence([Animated.timing(w,{toValue:1.03,duration:2A,useNativeDriver:!0}),Animated.timing(w,{toValue:1,duration:2A,useNativeDriver:!0})])):"found"===n&&E>0&&(w.setValue(1.08),e=Animated.timing(w,{toValue:1,duration:E,useNativeDriver:!0})),e?.start(),()=>e?.stop()},[n,y,A,E,w]);const _=useRef(n);useEffect(()=>{_.current!==n&&(_.current=n,!1!==u&&("found"===n?triggerHaptic("notificationSuccess"):"invalid"===n&&triggerHaptic("notificationError")))},[n,u]);const{found:V,invalid:C}=x,{noPermissionTitle:R,noPermissionMessage:M}=x,{noCameraTitle:k,noCameraMessage:I}=x;useEffect(()=>{switch(n){case"scanning":announce(i);break;case"found":announce(V);break;case"invalid":announce(C,{polite:!1});break;case"noPermission":announce(`${R}. ${M}`);break;case"noCamera":announce(`${k}. ${I}`)}},[n,i,V,C,R,M,k,I]);const L=Math.max(240,Math.min(m,j.width-2f.spacing.xl)),P=(j.width-L)/2,F=Math.max(f.spacing.md,(j.height-L)/2-.06j.height),B=j.width>0&&j.height>0,O={borderColor:"found"===n?f.colors.success:"invalid"===n?f.colors.error:f.colors.onOverlay,width:32,height:32},N="found"===n\|\|"invalid"===n?_jsx(View,{style:[b.pill,{backgroundColor:"found"===n?f.colors.success:f.colors.error}],children:_jsx(Text,{variant:"bodySmall",weight:"semibold",align:"center",color:"found"===n?f.colors.onSuccess:f.colors.onError,children:"found"===n?V:C})}):_jsx(Text,{variant:"bodySmall",align:"center",color:f.colors.onOverlay,children:i}),D=S&&null!=a,H=S?"glass":"outline";return _jsxs(View,{ref:t,testID:p,onLayout:e=>{const{width:t,height:o}=e.nativeEvent.layout;v(e=>e.width===t&&e.height===o?e:{width:t,height:o})},style:[b.root,!S&&{backgroundColor:f.colors.background.primary},h],children:[S?_jsx(View,{style:StyleSheet.absoluteFill,children:o}):null,S&&B?_jsxs(_Fragment,{children:[_jsxs(View,{pointerEvents:"none",style:StyleSheet.absoluteFill,accessibilityElementsHidden:!0,importantForAccessibility:"no-hide-descendants","aria-hidden":!0,children:[_jsx(View,{style:[b.scrim,{left:0,right:0,top:0,height:F}]}),_jsx(View,{style:[b.scrim,{left:0,right:0,top:F+L,bottom:0}]}),_jsx(View,{style:[b.scrim,{left:0,width:P,top:F,height:L}]}),_jsx(View,{style:[b.scrim,{left:P+L,right:0,top:F,height:L}]}),_jsx(Animated.View,{style:{position:"absolute",left:P,top:F,width:L,height:L,transform:[{scale:w}]},children:CORNERS.map(e=>_jsx(View,{style:[b.mark,O,e.style]},e.key))})]}),_jsx(View,{pointerEvents:"none",style:[b.message,{top:F+L+f.spacing.md}],children:N})]}):null,S?null:_jsx(View,{style:b.panel,children:_jsx(EmptyState,{fill:!0,icon:_jsx(AppIcon,{name:"noPermission"===n?"camera":"camera-slash",size:48,color:f.colors.text.tertiary}),title:"noPermission"===n?R:k,description:"noPermission"===n?M:I,action:"noPermission"===n&&d?{label:x.permissionAction,onPress:d}:void 0})}),_jsxs(View,{pointerEvents:"box-none",style:[b.bar,{paddingBottom:Math.max(g.bottom,f.spacing.md)}],children:[D?_jsx(IconButton,{icon:s?"flash":"flash-slash",variant:"glass",size:"lg",active:s,haptic:u,accessibilityLabel:s?x.torchOff:x.torchOn,onPress:()=>a?.(!s)}):null,c?_jsx(Button,{title:x.gallery,leftIcon:"gallery",variant:H,tone:"neutral",size:"lg",haptic:u,onPress:c}):null,l?_jsx(Button,{title:x.manualEntry,leftIcon:"keyboard",variant:H,tone:"neutral",size:"lg",haptic:u,onPress:l}):null]})]})});ScannerOverlay.displayName="ScannerOverlay";const buildStyles=e=>StyleSheet.create({root:{flex:1,overflow:"hidden"},scrim:{position:"absolute",backgroundColor:e.colors.background.overlay},mark:{position:"absolute"},message:{position:"absolute",left:0,right:0,alignItems:"center",paddingHorizontal:e.spacing.xl},pill:{paddingHorizontal:e.spacing.md,paddingVertical:e.spacing.xs,borderRadius:e.radius.pill,...smoothCorners},panel:{...StyleSheet.absoluteFill,justifyContent:"center"},bar:{position:"absolute",left:0,right:0,bottom:0,flexDirection:"row",flexWrap:"wrap",alignItems:"center",justifyContent:"center",gap:e.spacing.sm,paddingHorizontal:e.spacing.md}});export{ScannerOverlay};export default ScannerOverlay;

package/lib/module/components/SearchBar/SearchBar.js CHANGED Viewed

	@@ -1 +1 @@
1	- "use strict";import{forwardRef,useCallback,useEffect,useMemo,useRef,useState}from"react";import{Pressable,StyleSheet,TextInput,View}from"react-native";import{useControllableState}from"../../hooks/useControllableState.js";import{useDebounce}from"../../hooks/useDebounce.js";import{useTheme}from"../../theme/index.js";import{announce}from"../../utils/announce.js";import{resolveHaptic,triggerHaptic}from"../../utils/hapticUtils.js";import{mergeRefs}from"../../utils/mergeRefs.js";import{defaultIcons}from"../AppIcon/defaultIcons.js";import{renderSlotIcon}from"../AppIcon/slotIcon.js";import{FieldBase,FieldLabel,~~resolveFieldSize,~~resolveFieldTextStyle,resolveVariantColors}from"../FieldBase/FieldBase.js";import{useFloatingLabel}from"../FieldBase/useFloatingLabel.js";import{normalizeSuggestion,SearchRecents,SearchScopeBar,SearchSuggestions}from"./SearchPanel.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const DEFAULT_PANEL_ROWS=8,HOLD_RELEASE_MS=50,SearchBar=forwardRef((e,l)=>{const{value:o,onChangeText:s,onSubmit:t,onFocus:a,onBlur:i,placeholder:n="Search…",autoFocus:r=!1,disabled:c=!1,onClear:u,leftIcon:d,debounceMs:b,size:f="md",variant:p,borderRadius:S,label:m,labelMode:g="top",labelStyle:h,scopes:v,scope:x,onScopeChange:C,recents:R,recentsTitle:y="Recent searches",maxRecents:j=DEFAULT_PANEL_ROWS,onSelectRecent:F,onRemoveRecent:k,onClearRecents:_,suggestions:z,maxSuggestions:L=DEFAULT_PANEL_ROWS,onSelectSuggestion:B,haptic:T,style:E,inputStyle:I,accessibilityLabel:H,testID:w,...D}=e,A=useTheme(),P=p??A.components.searchBar?.defaultVariant??A.components.field?.defaultVariant??"filled",V="underline"===P,M=resolveFieldSize(A,f),N=~~{...M,...~~A.components.searchBar?.[f]??{}},O=resolveFieldTextStyle(A,{disabled:c}),W=useRef(null),U=useMemo(()=>mergeRefs(W,l),[l]),$=useCallback(()=>{c\|\|W.current?.focus()},[c]),q=useMemo(()=>buildStyles(A),[A]),K="string"==typeof o?o:"",[G,J]=useState(!1),Q=useCallback(e=>{J(!0),a?.(e)},[a]),X=useCallback(e=>{J(!1),i?.(e)},[i]),[Y,Z]=useState(K),ee=useDebounce(Y,b??0);useEffect(()=>{void 0!==b&&K!==Y&&Z(K)},[K,b]);const le=useRef(K);useEffect(()=>{void 0!==b&&ee!==le.current&&(le.current=ee,s(ee))},[ee,b,s]);const oe=useCallback(e=>{void 0===b?s(e):Z(e)},[b,s]),se=useCallback(()=>{const e=resolveHaptic(T,"selection");e&&triggerHaptic(e),void 0!==b&&(Z(""),le.current=""),s(""),u?.()},[T,b,s,u]),te=useCallback(()=>{t?.(void 0!==b?Y:K)},[t,b,Y,K]),ae=void 0!==b?Y:K,ie=ae.length>0,[ne,re]=useControllableState({value:x,defaultValue:v?.[0]?.value??"",onChange:C}),ce=useCallback(e=>{re(e);const l=v?.find(l=>l.value===e)?.label;l&&announce(`Searching ${l}`)},[v,re]),[ue,de]=useState(!1),be=useRef(null),fe=useCallback(()=>{be.current&&(clearTimeout(be.current),be.current=null)},[]),pe=useCallback(()=>{fe(),de(!0)},[fe]),Se=useCallback(()=>{fe(),be.current=setTimeout(()=>de(!1),50)},[fe]);useEffect(()=>fe,[fe]);const me=!c&&(G\|\|ue),ge=useMemo(()=>(R??[]).slice(0,j),[R,j]),he=useMemo(()=>(z??[]).slice(0,L).map(normalizeSuggestion),[z,L]),ve=me&&!ie&&ge.length>0,xe=me&&ie&&he.length>0,Ce=xe?he.length:0;useEffect(()=>{Ce>0&&announce(1===Ce?"1 suggestion":`${Ce} suggestions`)},[Ce]);const Re=useCallback(()=>{const e=resolveHaptic(T,"selection");e&&triggerHaptic(e)},[T]),ye=useCallback(e=>{Re(),W.current?.blur(),de(!1),F?.(e)},[Re,F]),je=useCallback(e=>{Re(),W.current?.blur(),de(!1),B?.(e)},[Re,B]),Fe=useCallback(e=>{Re(),k?.(e),announce(`Removed ${e}`),$()},[Re,k,$]),ke=useCallback(()=>{Re(),_?.(),announce("Recent searches cleared"),$()},[Re,_,$]),ze={size:N.~~iconSize~~,color:c?A.colors.text.disabled:A.colors.text.tertiary,disabled:c},Le=d?renderSlotIcon(d,ze):(A.icons?.search??defaultIcons.search)(ze),Be=Boolean(m)&&"float"===g,Te=useFloatingLabel({label:m,enabled:Be,floated:G\|\|ie,variant:P,sizeTokens:~~{...~~M~~,...N}~~,leadingOffset:N.~~iconSize~~+A.spacing.md,trailingOffset:ie?N.~~iconSize~~+A.spacing.md:0,paddingLeft:V?0:N.~~paddingHorizontal~~,color:A.colors.field.label,style:h}),Ee=ie&&!c?_jsx(Pressable,{onPress:se,hitSlop:8,accessibilityRole:"button",accessibilityLabel:"Clear search",children:(A.icons?.close??defaultIcons.close)({size:N.~~iconSize~~,color:A.colors.text.secondary})}):null;return _jsxs(View,{style:E,testID:w,children:[m&&!Be?_jsx(FieldLabel,{size:f,style:h,children:m}):null,_jsx(View,{style:q.root,children:_jsxs(View,{style:q.fieldWrap,children:[_jsx(FieldBase,{size:f,variant:P,focused:G,disabled:c,filled:ie,minHeight:N.minHeight,paddingHorizontal:V?0:N.~~paddingHorizontal~~,borderRadius:S??~~N.borderRadius~~,leading:Le,trailing:Ee,topNotch:Te.topNotch,onPress:$,pressFeedback:!1,accessibilityRole:"search",accessibilityLabel:H??n,children:_jsx(TextInput,{ref:U,style:[q.input,{fontSize:N.~~fontSize~~,color:O.color,...O.weightStyle},I],value:ae,onChangeText:oe,onSubmitEditing:te,onFocus:Q,onBlur:X,placeholder:!Be\|\|G\|\|ie?n:void 0,placeholderTextColor:O.placeholderColor,autoFocus:r,editable:!c,returnKeyType:"search",selectionColor:resolveVariantColors(A,P).borderFocusedRepresentative,accessibilityLabel:H??n,accessibilityState:{disabled:c},"aria-disabled":c,...D})}),Te.node]})}),v&&v.length>0?_jsx(SearchScopeBar,{scopes:v,scope:ne\|\|(v[0]?.value??""),disabled:c,haptic:T,onChange:ce}):null,ve?_jsx(SearchRecents,{recents:ge,title:y,onSelect:ye,onRemove:k?Fe:void 0,onClear:_?ke:void 0,onHold:pe,onRelease:Se}):null,xe?_jsx(SearchSuggestions,{suggestions:he,query:ae,onSelect:je,onHold:pe,onRelease:Se}):null]})});SearchBar.displayName="SearchBar";const buildStyles=e=>StyleSheet.create({root:{flexDirection:"row",alignItems:"center",width:"100%",position:"relative",overflow:"visible"},fieldWrap:{flex:1,position:"relative",overflow:"visible"},input:{flex:1,padding:0,margin:0,includeFontPadding:!1}});export{SearchBar};export default SearchBar;
1	+ "use strict";import{forwardRef,useCallback,useEffect,useMemo,useRef,useState}from"react";import{Pressable,StyleSheet,TextInput,View}from"react-native";import{useControllableState}from"../../hooks/useControllableState.js";import{useDebounce}from"../../hooks/useDebounce.js";import{radiusOf,resolveFieldSize,useTheme}from"../../theme/index.js";import{announce}from"../../utils/announce.js";import{resolveHaptic,triggerHaptic}from"../../utils/hapticUtils.js";import{mergeRefs}from"../../utils/mergeRefs.js";import{defaultIcons}from"../AppIcon/defaultIcons.js";import{renderSlotIcon}from"../AppIcon/slotIcon.js";import{FieldBase,FieldLabel,resolveFieldTextStyle,resolveVariantColors}from"../FieldBase/FieldBase.js";import{useFloatingLabel}from"../FieldBase/useFloatingLabel.js";import{normalizeSuggestion,SearchRecents,SearchScopeBar,SearchSuggestions}from"./SearchPanel.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const DEFAULT_PANEL_ROWS=8,HOLD_RELEASE_MS=50,SearchBar=forwardRef((e,s)=>{const{value:l,onChangeText:o,onSubmit:t,onFocus:a,onBlur:n,placeholder:i="Search…",autoFocus:r=!1,disabled:c=!1,onClear:u,leftIcon:d,debounceMs:p,size:b="md",variant:f,borderRadius:g,label:m,labelMode:h="top",labelStyle:S,scopes:v,scope:x,onScopeChange:C,recents:R,recentsTitle:y="Recent searches",maxRecents:j=DEFAULT_PANEL_ROWS,onSelectRecent:F,onRemoveRecent:k,onClearRecents:_,suggestions:B,maxSuggestions:L=DEFAULT_PANEL_ROWS,onSelectSuggestion:T,haptic:E,style:I,inputStyle:z,accessibilityLabel:H,testID:w,...D}=e,A=useTheme(),P=f??A.components.searchBar?.defaultVariant??A.components.field?.defaultVariant??"filled",V="underline"===P,M=resolveFieldSize(A,b),O=radiusOf(A,A.components.searchBar[b].radius,`components.searchBar.${b}.radius`),N=resolveFieldTextStyle(A,{disabled:c}),W=useRef(null),U=useMemo(()=>mergeRefs(W,s),[s]),$=useCallback(()=>{c\|\|W.current?.focus()},[c]),X=useMemo(()=>buildStyles(A),[A]),q="string"==typeof l?l:"",[K,G]=useState(!1),J=useCallback(e=>{G(!0),a?.(e)},[a]),Q=useCallback(e=>{G(!1),n?.(e)},[n]),[Y,Z]=useState(q),ee=useDebounce(Y,p??0);useEffect(()=>{void 0!==p&&q!==Y&&Z(q)},[q,p]);const se=useRef(q);useEffect(()=>{void 0!==p&&ee!==se.current&&(se.current=ee,o(ee))},[ee,p,o]);const le=useCallback(e=>{void 0===p?o(e):Z(e)},[p,o]),oe=useCallback(()=>{const e=resolveHaptic(E,"selection");e&&triggerHaptic(e),void 0!==p&&(Z(""),se.current=""),o(""),u?.()},[E,p,o,u]),te=useCallback(()=>{t?.(void 0!==p?Y:q)},[t,p,Y,q]),ae=void 0!==p?Y:q,ne=ae.length>0,[ie,re]=useControllableState({value:x,defaultValue:v?.[0]?.value??"",onChange:C}),ce=useCallback(e=>{re(e);const s=v?.find(s=>s.value===e)?.label;s&&announce(`Searching ${s}`)},[v,re]),[ue,de]=useState(!1),pe=useRef(null),be=useCallback(()=>{pe.current&&(clearTimeout(pe.current),pe.current=null)},[]),fe=useCallback(()=>{be(),de(!0)},[be]),ge=useCallback(()=>{be(),pe.current=setTimeout(()=>de(!1),50)},[be]);useEffect(()=>be,[be]);const me=!c&&(K\|\|ue),he=useMemo(()=>(R??[]).slice(0,j),[R,j]),Se=useMemo(()=>(B??[]).slice(0,L).map(normalizeSuggestion),[B,L]),ve=me&&!ne&&he.length>0,xe=me&&ne&&Se.length>0,Ce=xe?Se.length:0;useEffect(()=>{Ce>0&&announce(1===Ce?"1 suggestion":`${Ce} suggestions`)},[Ce]);const Re=useCallback(()=>{const e=resolveHaptic(E,"selection");e&&triggerHaptic(e)},[E]),ye=useCallback(e=>{Re(),W.current?.blur(),de(!1),F?.(e)},[Re,F]),je=useCallback(e=>{Re(),W.current?.blur(),de(!1),T?.(e)},[Re,T]),Fe=useCallback(e=>{Re(),k?.(e),announce(`Removed ${e}`),$()},[Re,k,$]),ke=useCallback(()=>{Re(),_?.(),announce("Recent searches cleared"),$()},[Re,_,$]),Be={size:M.icon,color:c?A.colors.text.disabled:A.colors.text.tertiary,disabled:c},Le=d?renderSlotIcon(d,Be):(A.icons?.search??defaultIcons.search)(Be),Te=Boolean(m)&&"float"===h,Ee=useFloatingLabel({label:m,enabled:Te,floated:K\|\|ne,variant:P,sizeTokens:M,leadingOffset:M.icon+A.spacing.md,trailingOffset:ne?M.icon+A.spacing.md:0,paddingLeft:V?A.spacing.none:M.paddingX,color:A.colors.field.label,style:S}),Ie=ne&&!c?_jsx(Pressable,{onPress:oe,hitSlop:8,accessibilityRole:"button",accessibilityLabel:"Clear search",children:(A.icons?.close??defaultIcons.close)({size:M.icon,color:A.colors.text.secondary})}):null;return _jsxs(View,{style:I,testID:w,children:[m&&!Te?_jsx(FieldLabel,{size:b,style:S,children:m}):null,_jsx(View,{style:X.root,children:_jsxs(View,{style:X.fieldWrap,children:[_jsx(FieldBase,{size:b,variant:P,focused:K,disabled:c,filled:ne,minHeight:M.minHeight,paddingHorizontal:V?A.spacing.none:M.paddingX,borderRadius:g??O,leading:Le,trailing:Ie,topNotch:Ee.topNotch,onPress:$,pressFeedback:!1,accessibilityRole:"search",accessibilityLabel:H??i,children:_jsx(TextInput,{ref:U,style:[X.input,{fontSize:M.text,color:N.color,...N.weightStyle},z],value:ae,onChangeText:le,onSubmitEditing:te,onFocus:J,onBlur:Q,placeholder:!Te\|\|K\|\|ne?i:void 0,placeholderTextColor:N.placeholderColor,autoFocus:r,editable:!c,returnKeyType:"search",selectionColor:resolveVariantColors(A,P).borderFocusedRepresentative,accessibilityLabel:H??i,accessibilityState:{disabled:c},"aria-disabled":c,...D})}),Ee.node]})}),v&&v.length>0?_jsx(SearchScopeBar,{scopes:v,scope:ie\|\|(v[0]?.value??""),disabled:c,haptic:E,onChange:ce}):null,ve?_jsx(SearchRecents,{recents:he,title:y,onSelect:ye,onRemove:k?Fe:void 0,onClear:_?ke:void 0,onHold:fe,onRelease:ge}):null,xe?_jsx(SearchSuggestions,{suggestions:Se,query:ae,onSelect:je,onHold:fe,onRelease:ge}):null]})});SearchBar.displayName="SearchBar";const buildStyles=e=>StyleSheet.create({root:{flexDirection:"row",alignItems:"center",width:"100%",position:"relative",overflow:"visible"},fieldWrap:{flex:1,position:"relative",overflow:"visible"},input:{flex:1,padding:e.spacing.none,margin:e.spacing.none,includeFontPadding:!1}});export{SearchBar};export default SearchBar;

package/lib/module/components/SegmentedControl/SegmentedControl.js CHANGED Viewed

	@@ -1 +1 @@
1	- "use strict";import{forwardRef,useCallback,useEffect,useMemo,useRef,useState}from"react";import{Animated,Pressable,StyleSheet,Text,View}from"react-native";import{useControllableState}from"../../hooks/index.js";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{FieldLabel,FieldMessage,hasFieldText}from"../FieldBase/index.js";import{SquircleFill,useSquircle}from"../SquircleFill/SquircleFill.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";~~export~~ const segmentedControlSizes={sm:{height:32,fontSize:12,paddingHorizontal:10,iconSize:14},md:{height:40,fontSize:14,paddingHorizontal:14,iconSize:16},lg:{height:48,fontSize:16,paddingHorizontal:18,iconSize:18}};export const segmentedControlTrackPadding=4;const LABEL_LINE_HEIGHT_RATIO=1.25,~~sizeMap=segmentedControlSizes,TRACK_PADDING=4,~~SegmentedControl=forwardRef((e,t)=>{const{segments:i,label:o,helperText:r,error:l,value:s,defaultValue:n,onChange:a,size:d="md",fullWidth:c=!0,disabled:u=!1,tone:m="primary",variant:h="segmented",radius:g,labelLines:p=1,haptic:f,accessibilityLabel:b,style:S,containerStyle:y,segmentStyle:x,selectedIndicatorStyle:z,textStyle:v,labelStyle:C,testID:j}=e,[w,k]=useControllableState({value:s,defaultValue:n??i[0]?.value,onChange:a}),I=useTheme(),_=I.components.segmentedControl,H=useMemo(()=>buildStyles(I),[I]),L=~~sizeMap[d],F={height:_?.[d]?.height??~~L~~.height~~,~~fontSize:_?.[~~d~~]?.fontSize??L.fontSize~~,~~paddingHorizontal:_?.~~[~~d]?.paddingHorizontal??~~L~~.paddingHorizontal~~,~~iconSize:_?.[~~d]~~?.iconSize??L.iconSize}~~,M=p>=2?2:1,T=M>1,V="segmented"===h,R="underline"===h,A="pills"===h,E=V?_?.trackPadding~~??4~~:0,D=Math.ceil(1.25F.~~fontSize~~)(M-1),W=_?.underlineHeight??2,P=_?.pillInset~~??4~~,q="number"==typeof g?g:g?I.radius[g]:~~_?.radius~~,B=q??I.radius.md,N=void 0===q?I.radius.sm:Math.max(q-E,0),G=q??I.radius.~~full~~,O=q??0,[K,X]=useState(0),J=useRef(createAnimatedValue(0)).current,Q=Math.max(0,i.findIndex(e=>e.value===w)),U=K>0?(K-2E)/Math.max(i.length,1):0,Y=useCallback((e,t)=>{if(t<=0)return;const i=te,o=I.motion.spring.snappy,r=Animated.spring(J,{toValue:i,damping:o.damping,stiffness:o.stiffness,mass:o.mass,overshootClamping:!0,useNativeDriver:!0});return r.start(),r},[I.motion.spring.snappy,J]);useEffect(()=>{if(U>0){const e=Y(Q,U);return()=>e?.stop()}},[Q,U,Y]);const Z=useCallback(e=>{const t=e.nativeEvent.layout.width;t!==K&&X(t)},[K]),$=useCallback(e=>{if(u)return;if(e.value===w)return;const t=resolveHaptic(f,"selection");t&&triggerHaptic(t),k(e.value)},[u,k,w,f]),ee=V?I.colors.background.elevated:A?I.colors.primaryMuted:I.colors.primary,te=V?N:A?G:O,ie="neutral"===m?I.colors.text.primary:I.colors.primary,oe=I.colors.background.tertiary,re=useSquircle(V,B,Z),le=!0===l\|\|hasFieldText(l),se=le&&!u,ne=I.colors.field.borderError,ae=I.colors.border.width,de=hasFieldText(o),ce=le?l:r,ue=hasFieldText(ce),me=_jsxs(View,{ref:t,accessibilityRole:"radiogroup",accessibilityLabel:b??("string"==typeof o?o:void 0),testID:j,style:[H.track,{...T?{minHeight:F.height+D}:{height:F.height},opacity:u?.55:1,alignSelf:c?"stretch":"flex-start"},V?{borderRadius:B,...smoothCorners,backgroundColor:re.active?"transparent":oe,padding:E}:R?{borderBottomColor:se?ne:I.colors.border.secondary,borderBottomWidth:StyleSheet.hairlineWidth}:null,y,S],onLayout:re.onLayout,children:[re.active&&re.size?_jsx(SquircleFill,{width:re.size.width,height:re.size.height,radius:B,fill:oe,stroke:se?ne:void 0,strokeWidth:ae}):null,_jsxs(View,{style:H.row,children:[U>0?_jsx(Animated.View,{pointerEvents:"none",style:[H.thumb,V?T?{top:0,bottom:0}:{top:0,height:F.height-2*E}:A?{top:P,bottom:P}:{bottom:0,height:W},{width:U,borderRadius:te,...smoothCorners,backgroundColor:ee,transform:[{translateX:J}]},z]}):null,i.map(e=>{const t=e.value===w,i=t?ie:I.colors.text.tertiary,o=renderSlotIcon(e.icon,{color:i,size:F.~~iconSize~~,selected:t,disabled:u});return _jsxs(Pressable,{onPress:()=>$(e),disabled:u,accessibilityRole:"radio",accessibilityLabel:e.label,accessibilityState:{checked:t,selected:t,disabled:u},"aria-checked":t,"aria-disabled":u,style:({pressed:e})=>[H.segment,T?H.segmentMultiline:null,{paddingHorizontal:F.~~paddingHorizontal~~,opacity:e&&!t?.7:1},x],children:[o?_jsx(View,{style:H.segmentIcon,children:o}):null,_jsx(Text,{style:[H.segmentLabel,T?H.segmentLabelMultiline:null,{color:i,fontSize:F.~~fontSize~~,fontWeight:t?I.typography.fontWeight.semibold:I.typography.fontWeight.medium},v,C],numberOfLines:M,children:e.label})]},String(e.value))})]}),!se\|\|R\|\|re.active?null:_jsx(View,{pointerEvents:"none",style:[StyleSheet.absoluteFill,{borderWidth:ae,borderColor:ne,borderRadius:V?B:G,...smoothCorners}]})]});return de\|\|ue?_jsxs(View,{style:{alignSelf:c?"stretch":"flex-start"},children:[de?_jsx(FieldLabel,{size:d,children:o}):null,me,ue?_jsx(FieldMessage,{size:d,text:ce,error:le}):null]}):me});SegmentedControl.displayName="SegmentedControl";const buildStyles=e=>StyleSheet.create({track:{flexDirection:"row",alignItems:"stretch",position:"relative"},row:{flex:1,flexDirection:"row",alignItems:"stretch",position:"relative",overflow:"hidden"},thumb:{position:"absolute",left:0},segment:{flex:1,flexDirection:"row",alignItems:"center",justifyContent:"center"},segmentIcon:{marginRight:6},segmentMultiline:{paddingVertical:6},segmentLabel:{includeFontPadding:!1},segmentLabelMultiline:{flexShrink:1,textAlign:"center"}});export{SegmentedControl};export default SegmentedControl;
1	+ "use strict";import{forwardRef,useCallback,useEffect,useMemo,useRef,useState}from"react";import{Animated,Pressable,StyleSheet,Text,View}from"react-native";import{useControllableState}from"../../hooks/index.js";import{createAnimatedValue,radiusOf,resolveSegmentedControlSize,spaceOf,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{FieldLabel,FieldMessage,hasFieldText}from"../FieldBase/index.js";import{SquircleFill,useSquircle}from"../SquircleFill/SquircleFill.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const LABEL_LINE_HEIGHT_RATIO=1.25,SegmentedControl=forwardRef((e,t)=>{const{segments:i,label:r,helperText:s,error:l,value:o,defaultValue:n,onChange:a,size:d="md",fullWidth:c=!0,disabled:u=!1,tone:m="primary",variant:g="segmented",radius:h,labelLines:p=1,haptic:f,accessibilityLabel:b,style:x,containerStyle:y,segmentStyle:S,selectedIndicatorStyle:v,textStyle:C,labelStyle:j,testID:w}=e,[k,I]=useControllableState({value:o,defaultValue:n??i[0]?.value,onChange:a}),L=useTheme(),_=L.components.segmentedControl,F=useMemo(()=>buildStyles(L),[L]),M=useMemo(()=>resolveSegmentedControlSize(L,d),[L,d]),V=p>=2?2:1,z=V>1,R="segmented"===g,T="underline"===g,A="pills"===g,E=R?spaceOf(L,_.trackPadding,"components.segmentedControl.trackPadding"):0,H=Math.ceil(1.25M.text)(V-1),W=_?.underlineHeight??2,O=spaceOf(L,_.pillInset,"components.segmentedControl.pillInset"),q=void 0===_.radius?void 0:radiusOf(L,_.radius,"components.segmentedControl.radius"),D="number"==typeof h?h:h?L.radius[h]:q,P=D??L.radius.md,B=void 0===D?L.radius.sm:Math.max(D-E,0),N=D??L.radius.pill,X=D??L.radius.none,[G,J]=useState(0),K=useRef(createAnimatedValue(0)).current,Q=Math.max(0,i.findIndex(e=>e.value===k)),U=G>0?(G-2E)/Math.max(i.length,1):0,Y=useCallback((e,t)=>{if(t<=0)return;const i=te,r=L.motion.spring.snappy,s=Animated.spring(K,{toValue:i,damping:r.damping,stiffness:r.stiffness,mass:r.mass,overshootClamping:!0,useNativeDriver:!0});return s.start(),s},[L.motion.spring.snappy,K]);useEffect(()=>{if(U>0){const e=Y(Q,U);return()=>e?.stop()}},[Q,U,Y]);const Z=useCallback(e=>{const t=e.nativeEvent.layout.width;t!==G&&J(t)},[G]),$=useCallback(e=>{if(u)return;if(e.value===k)return;const t=resolveHaptic(f,"selection");t&&triggerHaptic(t),I(e.value)},[u,I,k,f]),ee=R?L.colors.background.elevated:A?L.colors.primaryMuted:L.colors.primary,te=R?B:A?N:X,ie="neutral"===m?L.colors.text.primary:L.colors.primary,re=L.colors.background.tertiary,se=useSquircle(R,P,Z),le=!0===l\|\|hasFieldText(l),oe=le&&!u,ne=L.colors.field.borderError,ae=L.colors.border.width,de=hasFieldText(r),ce=le?l:s,ue=hasFieldText(ce),me=_jsxs(View,{ref:t,accessibilityRole:"radiogroup",accessibilityLabel:b??("string"==typeof r?r:void 0),testID:w,style:[F.track,{...z?{minHeight:M.height+H}:{height:M.height},opacity:u?.55:1,alignSelf:c?"stretch":"flex-start"},R?{borderRadius:P,...smoothCorners,backgroundColor:se.active?"transparent":re,padding:E}:T?{borderBottomColor:oe?ne:L.colors.border.secondary,borderBottomWidth:StyleSheet.hairlineWidth}:null,y,x],onLayout:se.onLayout,children:[se.active&&se.size?_jsx(SquircleFill,{width:se.size.width,height:se.size.height,radius:P,fill:re,stroke:oe?ne:void 0,strokeWidth:ae}):null,_jsxs(View,{style:F.row,children:[U>0?_jsx(Animated.View,{pointerEvents:"none",style:[F.thumb,R?z?{top:0,bottom:0}:{top:0,height:M.height-2*E}:A?{top:O,bottom:O}:{bottom:0,height:W},{width:U,borderRadius:te,...smoothCorners,backgroundColor:ee,transform:[{translateX:K}]},v]}):null,i.map(e=>{const t=e.value===k,i=t?ie:L.colors.text.tertiary,r=renderSlotIcon(e.icon,{color:i,size:M.icon,selected:t,disabled:u});return _jsxs(Pressable,{onPress:()=>$(e),disabled:u,accessibilityRole:"radio",accessibilityLabel:e.label,accessibilityState:{checked:t,selected:t,disabled:u},"aria-checked":t,"aria-disabled":u,style:({pressed:e})=>[F.segment,z?F.segmentMultiline:null,{paddingHorizontal:M.paddingX,opacity:e&&!t?.7:1},S],children:[r?_jsx(View,{style:F.segmentIcon,children:r}):null,_jsx(Text,{style:[F.segmentLabel,z?F.segmentLabelMultiline:null,{color:i,fontSize:M.text,fontWeight:t?L.typography.fontWeight.semibold:L.typography.fontWeight.medium},C,j],numberOfLines:V,children:e.label})]},String(e.value))})]}),!oe\|\|T\|\|se.active?null:_jsx(View,{pointerEvents:"none",style:[StyleSheet.absoluteFill,{borderWidth:ae,borderColor:ne,borderRadius:R?P:N,...smoothCorners}]})]});return de\|\|ue?_jsxs(View,{style:{alignSelf:c?"stretch":"flex-start"},children:[de?_jsx(FieldLabel,{size:d,children:r}):null,me,ue?_jsx(FieldMessage,{size:d,text:ce,error:le}):null]}):me});SegmentedControl.displayName="SegmentedControl";const buildStyles=e=>StyleSheet.create({track:{flexDirection:"row",alignItems:"stretch",position:"relative"},row:{flex:1,flexDirection:"row",alignItems:"stretch",position:"relative",overflow:"hidden"},thumb:{position:"absolute",left:0},segment:{flex:1,flexDirection:"row",alignItems:"center",justifyContent:"center"},segmentIcon:{marginRight:e.spacing.xs},segmentMultiline:{paddingVertical:e.spacing.xs},segmentLabel:{includeFontPadding:!1},segmentLabelMultiline:{flexShrink:1,textAlign:"center"}});export{SegmentedControl};export default SegmentedControl;

package/lib/module/components/Select/Select.js CHANGED Viewed

	@@ -1 +1 @@
1	- "use strict";import{forwardRef,useCallback,useMemo,useState}from"react";import{StyleSheet,Text,View}from"react-native";import{useTheme}from"../../theme/index.js";import{resolveHaptic,triggerHaptic}from"../../utils/index.js";import{renderSlotIcon}from"../AppIcon/slotIcon.js";import{Chevron}from"../FieldBase/Chevron.js";import{FieldBase,FieldLabel,FieldMessage,fieldTextAsString,hasFieldText,RequiredMark,~~resolveFieldSize,~~resolveFieldTextStyle,resolveVariantColors}from"../FieldBase/FieldBase.js";import{NotationInkContext}from"../Notation/Notation.js";import{OptionSheet}from"../OptionSheet/OptionSheet.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const sameSelectValue=(e,t)=>String(e)===String(t),containsValue=(e,t)=>e.some(e=>sameSelectValue(e,t)),Select=forwardRef((e,t)=>{const{options:l,getOptionLabel:i,getOptionValue:o,getOptionDisabled:r,getOptionDescription:n,getOptionIcon:s,placeholder:a,onOpenChange:d,searchable:c=!1,haptic:u,label:p,help:f,title:S,required:h=!1,error:x,helperText:g,prefix:b,numberOfLines:m=1,disabled:v=!1,size:y="md",variant:C,leftIcon:j,rightIcon:F,chevronColor:O,chevronSize:k,borderRadius:z,accessibilityLabel:T,labelStyle:V,style:_,triggerStyle:I,textStyle:H,optionStyle:R,selectedOptionStyle:w,optionTextStyle:L,selectedOptionTextStyle:M,testID:N}=e,D=!0===e.multi,P=useCallback(e=>i?i(e):e.label??"",[i]),B=useCallback(e=>o?o(e):e.value,[o]),q=useCallback(e=>r?r(e):!0===e.disabled,[r]),A=useCallback(e=>n?n(e):e.description,[n]),E=useCallback(e=>s?s(e):e.icon,[s]),$=useTheme(),G=useMemo(()=>buildStyles($),[$]),J=resolveFieldSize($,y),K=resolveFieldTextStyle($,{disabled:v}),Q=C??$.components.select?.defaultVariant??$.components.field?.defaultVariant??"outlined",U=useMemo(()=>{const e=$.components.select?.fillColors?.[Q];if(!e)return;const t={};return void 0!==e.idleEmpty&&(t.backgroundIdleEmpty=e.idleEmpty),void 0!==e.idleFilled&&(t.backgroundIdleFilled=e.idleFilled),void 0!==e.focus&&(t.backgroundFocused=e.focus),void 0!==e.error&&(t.backgroundError=e.error),void 0!==e.disabled&&(t.backgroundDisabled=e.disabled),Object.keys(t).length>0?t:void 0},[$.components.select?.fillColors,Q]),W=~~z??$.components~~.~~select?.borderRadius~~,[X,Y]=useState(!1),Z=useCallback(t=>{if(D){const l=e.value??[];return containsValue(l,t)}return null!=e.value&&sameSelectValue(e.value,t)},[D,e.value]),ee=useMemo(()=>{if(D){const t=e.value??[];return l.filter(e=>containsValue(t,B(e)))}const t=e.value;if(null==t)return[];const i=l.find(e=>sameSelectValue(B(e),t));return i?[i]:[]},[D,l,e.value,B]),te=useCallback(()=>{if(v)return;const e=resolveHaptic(u,"selection");e&&triggerHaptic(e),Y(!0)},[v,u]),le=useCallback(()=>{Y(!1)},[]),ie=useCallback(t=>{if(q(t))return;const l=B(t),i=resolveHaptic(u,"selection");if(i&&triggerHaptic(i),D){const t=e.value??[],i=containsValue(t,l)?t.filter(e=>!sameSelectValue(e,l)):[...t,l];return void e.onChange(i)}e.onChange(l),le()},[D,e,le,q,B,u]),oe=0===ee.length?a??"Select…":ee.map(e=>P(e)).join(", "),re=0===ee.length,ne=!0===x\|\|hasFieldText(x),se=hasFieldText(p),ae=fieldTextAsString(p),de=Math.round(1.4*J.~~fontSize~~),ce=useMemo(()=>({fontSize:J.~~fontSize~~,color:K.placeholderColor}),[J.~~fontSize~~,K.placeholderColor]),ue={color:v?$.colors.field.iconDisabled:X?$.colors.field.iconFocused:$.colors.field.icon,size:J.~~iconSize~~,disabled:v,focused:X,error:ne},pe=0===ee.length?a??"No selection":`Selected: ${ee.map(e=>P(e)).join(", ")}`,fe=T??`${ae??"Select"}. ${pe}`;return _jsxs(View,{style:[G.container,_],testID:N,children:[se?_jsx(FieldLabel,{size:y,required:h,help:f,style:V,children:p}):null,_jsx(View,{ref:t,collapsable:!1,children:_jsxs(FieldBase,{size:y,variant:Q,disabled:v,error:ne,filled:ee.length>0,onPress:te,borderRadius:W,fillOverrides:U,paddingHorizontal:"underline"===Q?0:void 0,accessibilityRole:"button",accessibilityLabel:fe,accessibilityState:{disabled:v,expanded:X},"aria-disabled":v,"aria-expanded":X,style:I,slotAlign:1===m?"center":"top",slotLineHeight:1===m?void 0:de,leading:j?_jsx(View,{children:renderSlotIcon(j,ue)}):null,trailing:F?_jsx(View,{children:renderSlotIcon(F,ue)}):_jsx(Chevron,{color:O??(v?$.colors.text.disabled:$.colors.text.tertiary),size:k??J.~~iconSize~~,open:X,style:G.chevron}),children:[hasFieldText(b)?"string"==typeof b\|\|"number"==typeof b?_jsx(Text,{style:[G.prefix,{color:K.placeholderColor,fontSize:J.~~fontSize~~,lineHeight:1===m?void 0:de,marginRight:$.spacing.xs}],children:b}):_jsx(View,{style:[G.prefixNode,{minHeight:1===m?void 0:de,justifyContent:"center",marginRight:$.spacing.xs}],children:_jsx(Text,{style:[G.prefix,{color:K.placeholderColor,fontSize:J.~~fontSize~~,lineHeight:1===m?void 0:de}],children:_jsx(NotationInkContext.Provider,{value:ce,children:b})})}):null,_jsxs(Text,{style:[G.triggerText,{color:re?K.placeholderColor:K.color,fontSize:J.~~fontSize~~,lineHeight:1===m?void 0:de,...K.weightStyle},H],numberOfLines:m,children:[oe,re&&h&&!se?_jsx(RequiredMark,{}):null]})]})}),_jsx(FieldMessage,{size:y,error:ne,text:ne?x:g}),_jsx(OptionSheet,{open:X,onClose:le,onOpenChange:d,title:S??ae,accessibilityLabel:ae??(se?S:void 0)??a??"Options",options:l,labelOf:P,getValue:B,disabledOf:q,descriptionOf:A,iconOf:E,isSelected:Z,onSelect:ie,multi:D,searchable:c,optionStyle:R,selectedOptionStyle:w,optionTextStyle:L,selectedOptionTextStyle:M,searchSelectionColor:resolveVariantColors($,Q,U).borderFocusedRepresentative})]})});Select.displayName="Select";const buildStyles=e=>StyleSheet.create({container:{width:"100%"},label:{includeFontPadding:!1},triggerText:{flex:1,includeFontPadding:!1},errorText:{includeFontPadding:!1},prefix:{flexShrink:0,includeFontPadding:!1},prefixNode:{flexShrink:0},chevron:{marginLeft:8}});export{Select};export default Select;
1	+ "use strict";import{forwardRef,useCallback,useMemo,useState}from"react";import{StyleSheet,Text,View}from"react-native";import{resolveFieldSize,useTheme}from"../../theme/index.js";import{resolveHaptic,triggerHaptic}from"../../utils/index.js";import{renderSlotIcon}from"../AppIcon/slotIcon.js";import{Chevron}from"../FieldBase/Chevron.js";import{FieldBase,FieldLabel,FieldMessage,fieldTextAsString,hasFieldText,RequiredMark,resolveFieldTextStyle,resolveVariantColors}from"../FieldBase/FieldBase.js";import{NotationInkContext}from"../Notation/Notation.js";import{OptionSheet}from"../OptionSheet/OptionSheet.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const sameSelectValue=(e,t)=>String(e)===String(t),containsValue=(e,t)=>e.some(e=>sameSelectValue(e,t)),Select=forwardRef((e,t)=>{const{options:l,getOptionLabel:i,getOptionValue:o,getOptionDisabled:r,getOptionDescription:n,getOptionIcon:s,placeholder:a,onOpenChange:d,searchable:c=!1,haptic:u,label:p,help:x,title:h,required:f=!1,error:g,helperText:S,prefix:b,numberOfLines:m=1,disabled:v=!1,size:y="md",variant:C,leftIcon:j,rightIcon:F,chevronColor:O,chevronSize:k,borderRadius:T,accessibilityLabel:V,labelStyle:_,style:z,triggerStyle:I,textStyle:H,optionStyle:w,selectedOptionStyle:L,optionTextStyle:M,selectedOptionTextStyle:R,testID:N}=e,D=!0===e.multi,P=useCallback(e=>i?i(e):e.label??"",[i]),B=useCallback(e=>o?o(e):e.value,[o]),q=useCallback(e=>r?r(e):!0===e.disabled,[r]),A=useCallback(e=>n?n(e):e.description,[n]),E=useCallback(e=>s?s(e):e.icon,[s]),$=useTheme(),G=useMemo(()=>buildStyles($),[$]),J=resolveFieldSize($,y),K=resolveFieldTextStyle($,{disabled:v}),Q=C??$.components.select?.defaultVariant??$.components.field?.defaultVariant??"outlined",U=useMemo(()=>{const e=$.components.select?.fillColors?.[Q];if(!e)return;const t={};return void 0!==e.idleEmpty&&(t.backgroundIdleEmpty=e.idleEmpty),void 0!==e.idleFilled&&(t.backgroundIdleFilled=e.idleFilled),void 0!==e.focus&&(t.backgroundFocused=e.focus),void 0!==e.error&&(t.backgroundError=e.error),void 0!==e.disabled&&(t.backgroundDisabled=e.disabled),Object.keys(t).length>0?t:void 0},[$.components.select?.fillColors,Q]),W=T??J.radius,[X,Y]=useState(!1),Z=useCallback(t=>{if(D){const l=e.value??[];return containsValue(l,t)}return null!=e.value&&sameSelectValue(e.value,t)},[D,e.value]),ee=useMemo(()=>{if(D){const t=e.value??[];return l.filter(e=>containsValue(t,B(e)))}const t=e.value;if(null==t)return[];const i=l.find(e=>sameSelectValue(B(e),t));return i?[i]:[]},[D,l,e.value,B]),te=useCallback(()=>{if(v)return;const e=resolveHaptic(u,"selection");e&&triggerHaptic(e),Y(!0)},[v,u]),le=useCallback(()=>{Y(!1)},[]),ie=useCallback(t=>{if(q(t))return;const l=B(t),i=resolveHaptic(u,"selection");if(i&&triggerHaptic(i),D){const t=e.value??[],i=containsValue(t,l)?t.filter(e=>!sameSelectValue(e,l)):[...t,l];return void e.onChange(i)}e.onChange(l),le()},[D,e,le,q,B,u]),oe=0===ee.length?a??"Select…":ee.map(e=>P(e)).join(", "),re=0===ee.length,ne=!0===g\|\|hasFieldText(g),se=hasFieldText(p),ae=fieldTextAsString(p),de=Math.round(1.4*J.text),ce=useMemo(()=>({fontSize:J.text,color:K.placeholderColor}),[J.text,K.placeholderColor]),ue={color:v?$.colors.field.iconDisabled:X?$.colors.field.iconFocused:$.colors.field.icon,size:J.icon,disabled:v,focused:X,error:ne},pe=0===ee.length?a??"No selection":`Selected: ${ee.map(e=>P(e)).join(", ")}`,xe=V??`${ae??"Select"}. ${pe}`;return _jsxs(View,{style:[G.container,z],testID:N,children:[se?_jsx(FieldLabel,{size:y,required:f,help:x,style:_,children:p}):null,_jsx(View,{ref:t,collapsable:!1,children:_jsxs(FieldBase,{size:y,variant:Q,disabled:v,error:ne,filled:ee.length>0,onPress:te,borderRadius:W,fillOverrides:U,paddingHorizontal:"underline"===Q?$.spacing.none:void 0,accessibilityRole:"button",accessibilityLabel:xe,accessibilityState:{disabled:v,expanded:X},"aria-disabled":v,"aria-expanded":X,style:I,slotAlign:1===m?"center":"top",slotLineHeight:1===m?void 0:de,leading:j?_jsx(View,{children:renderSlotIcon(j,ue)}):null,trailing:F?_jsx(View,{children:renderSlotIcon(F,ue)}):_jsx(Chevron,{color:O??(v?$.colors.text.disabled:$.colors.text.tertiary),size:k??J.icon,open:X,style:G.chevron}),children:[hasFieldText(b)?"string"==typeof b\|\|"number"==typeof b?_jsx(Text,{style:[G.prefix,{color:K.placeholderColor,fontSize:J.text,lineHeight:1===m?void 0:de,marginRight:$.spacing.xs}],children:b}):_jsx(View,{style:[G.prefixNode,{minHeight:1===m?void 0:de,justifyContent:"center",marginRight:$.spacing.xs}],children:_jsx(Text,{style:[G.prefix,{color:K.placeholderColor,fontSize:J.text,lineHeight:1===m?void 0:de}],children:_jsx(NotationInkContext.Provider,{value:ce,children:b})})}):null,_jsxs(Text,{style:[G.triggerText,{color:re?K.placeholderColor:K.color,fontSize:J.text,lineHeight:1===m?void 0:de,...K.weightStyle},H],numberOfLines:m,children:[oe,re&&f&&!se?_jsx(RequiredMark,{}):null]})]})}),_jsx(FieldMessage,{size:y,error:ne,text:ne?g:S}),_jsx(OptionSheet,{open:X,onClose:le,onOpenChange:d,title:h??ae,accessibilityLabel:ae??(se?h:void 0)??a??"Options",options:l,labelOf:P,getValue:B,disabledOf:q,descriptionOf:A,iconOf:E,isSelected:Z,onSelect:ie,multi:D,searchable:c,optionStyle:w,selectedOptionStyle:L,optionTextStyle:M,selectedOptionTextStyle:R,searchSelectionColor:resolveVariantColors($,Q,U).borderFocusedRepresentative})]})});Select.displayName="Select";const buildStyles=e=>StyleSheet.create({container:{width:"100%"},label:{includeFontPadding:!1},triggerText:{flex:1,includeFontPadding:!1},errorText:{includeFontPadding:!1},prefix:{flexShrink:0,includeFontPadding:!1},prefixNode:{flexShrink:0},chevron:{marginLeft:e.spacing.sm}});export{Select};export default Select;

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

	@@ -1 +1 @@
1	- "use strict";import{useMemo,useState}from"react";import{Animated,StyleSheet,View}from"react-native";import{useReducedMotion}from"../../hooks/useReducedMotion.js";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:n,colors:r,style:a,testID:l})=>{const u=useTheme(),m=useSkeletonDefaults(),d=useSkeletonClock(),c=useReducedMotion(),h=i??m.variant??"shimmer",p=c&&"auto"===(m.animation??"auto");let S=h;d.enabled?p&&"shimmer"===h&&(S="pulse"):S="none";const k=r?.background??m.colors?.background??u.colors.skeleton.background,g=r?.highlight??m.colors?.highlight??u.colors.skeleton.highlight,{responsive:y}=useScreenDimensions(),b=useMemo(()=>buildStyles(),[]),x=resolveWidth(t),f=y.size(s),v=radiusForShape(u,e,x,f,o),[j,w]=useState(0),R=useMemo(()=>j<=0?0:Math.max(48,.7*j),[j]),C=useMemo(()=>j<=0?0:d.shimmer.interpolate({inputRange:[0,1],outputRange:[-R,j]}),[d.shimmer,R,j]),M=useMemo(()=>"none"===S?null:"pulse"===S?_jsx(Animated.View,{pointerEvents:"none",style:[StyleSheet.absoluteFill,{backgroundColor:g,opacity:d.pulse.interpolate({inputRange:[0,1],outputRange:[0,.55]})}]}):j<=0?null:_jsx(Animated.View,{pointerEvents:"none",style:[b.shimmerBand,{width:R,transform:[{translateX:C}],experimental_backgroundImage:[toBackgroundImage({colors:["transparent",g,"transparent"],locations:[0,.5,1],start:{x:0,y:.5},end:{x:1,y:.5}})]}]}),[S,g,d.pulse,j,b.shimmerBand,R,C]);return _jsx(View,{onLayout:e=>{const t=e.nativeEvent.layout.width;t!==j&&w(t)},accessible:!0,accessibilityLabel:"Loading",accessibilityRole:"progressbar",accessibilityState:{busy:!0},"aria-busy":!0,accessibilityLiveRegion:"polite",testID:l,style:[b.base,{width:x,height:f,borderRadius:v,...smoothCorners,backgroundColor:k},a],children:M})};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:n,radius:r="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:r,variant:i,speed:n,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;
1	+ "use strict";import{useMemo,useState}from"react";import{Animated,StyleSheet,View}from"react-native";import{useReducedMotion}from"../../hooks/useReducedMotion.js";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:n,colors:r,style:a,testID:l})=>{const u=useTheme(),m=useSkeletonDefaults(),d=useSkeletonClock(),c=useReducedMotion(),h=i??m.variant??"shimmer",p=c&&"auto"===(m.animation??"auto");let S=h;d.enabled?p&&"shimmer"===h&&(S="pulse"):S="none";const k=r?.background??m.colors?.background??u.colors.skeleton.background,g=r?.highlight??m.colors?.highlight??u.colors.skeleton.highlight,{responsive:y}=useScreenDimensions(),b=useMemo(()=>buildStyles(),[]),x=resolveWidth(t),f=y.size(s),v=radiusForShape(u,e,x,f,o),[j,w]=useState(0),R=useMemo(()=>j<=0?0:Math.max(48,.7*j),[j]),C=useMemo(()=>j<=0?0:d.shimmer.interpolate({inputRange:[0,1],outputRange:[-R,j]}),[d.shimmer,R,j]),M=useMemo(()=>"none"===S?null:"pulse"===S?_jsx(Animated.View,{pointerEvents:"none",style:[StyleSheet.absoluteFill,{backgroundColor:g,opacity:d.pulse.interpolate({inputRange:[0,1],outputRange:[0,.55]})}]}):j<=0?null:_jsx(Animated.View,{pointerEvents:"none",style:[b.shimmerBand,{width:R,transform:[{translateX:C}],experimental_backgroundImage:[toBackgroundImage({colors:["transparent",g,"transparent"],locations:[0,.5,1],start:{x:0,y:.5},end:{x:1,y:.5}})]}]}),[S,g,d.pulse,j,b.shimmerBand,R,C]);return _jsx(View,{onLayout:e=>{const t=e.nativeEvent.layout.width;t!==j&&w(t)},accessible:!0,accessibilityLabel:"Loading",accessibilityRole:"progressbar",accessibilityState:{busy:!0},"aria-busy":!0,accessibilityLiveRegion:"polite",testID:l,style:[b.base,{width:x,height:f,borderRadius:v,...smoothCorners,backgroundColor:k},a],children:M})};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,variant:i,speed:n,radius:r="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??m.typography.fontSize.base,radius:r,variant:i,speed:n,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/SkeletonContent.js CHANGED Viewed

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

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

	@@ -1 +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:.4t,borderBottomWidth:.4t,borderLeftWidth:.55t,borderTopColor:"transparent",borderBottomColor:"transparent",borderLeftColor:e,marginLeft:.2t}}),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.valuee?(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/(.6e))}});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;
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:"xxs"},md:{height:56,pad:"xs"},lg:{height:64,pad:"sm"}},Chevron=({color:e,size:t})=>_jsx(View,{style:{width:0,height:0,borderTopWidth:.4t,borderBottomWidth:.4t,borderLeftWidth:.55t,borderTopColor:"transparent",borderBottomColor:"transparent",borderLeftColor:e,marginLeft:.2t}}),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:u,icon:d,style:m,trackStyle:h,handleStyle:f,labelStyle:p,testID:b}=e,S=useTheme(),g=SIZE_MAP[n],y=S.spacing[g.pad],v=g.height-2y,C=useMemo(()=>buildStyles(S,g),[S,g]),x=S.colors[o],[w,A]=useState(!1),T=useSharedValue(0),j=useSharedValue(0),k=useSharedValue(0),_=useRef(null),E=useCallback(()=>{const e=resolveHaptic(u,"notificationSuccess");e&&triggerHaptic(e)},[u]),I=useCallback(()=>{A(!1),T.value=withSpring(0,{damping:18,stiffness:160,mass:1})},[T]),R=useCallback(()=>{A(!0),E(),a(),!1!==c&&(_.current&&clearTimeout(_.current),_.current=setTimeout(I,c))},[E,a,c,I]),V=useCallback(e=>{if(s\|\|w)return;const{actionName:t}=e.nativeEvent;"activate"!==t&&"increment"!==t\|\|R()},[s,w,R]);React.useEffect(()=>()=>{cancelAnimation(T),_.current&&clearTimeout(_.current)},[T]);const L=useCallback(e=>{j.value=Math.max(0,e.nativeEvent.layout.width-v-2y)},[j,v,y]),M=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&&!w).minDistance(0).onStart(()=>{"worklet";k.value=T.value}).onUpdate(e=>{"worklet";T.value=Math.min(Math.max(k.value+e.translationX,0),j.value)}).onEnd(()=>{"worklet";j.value>0&&T.value>=j.valuee?(T.value=withTiming(j.value,a),runOnJS(R)()):T.value=withSpring(0,t)})},[s,w,l,T,j,k,R,S.motion.duration.fast]),z=useAnimatedStyle(()=>({transform:[{translateX:T.value}]})),D=useAnimatedStyle(()=>({width:T.value+v+y})),O=useAnimatedStyle(()=>{const e=j.value>0?j.value:1;return{opacity:Math.max(0,1-T.value/(.6e))}});return _jsxs(View,{ref:t,style:[C.track,{backgroundColor:S.colors.background.secondary},h,m],onLayout:L,testID:b,accessibilityRole:"adjustable",accessibilityLabel:w?r:i,accessibilityState:{disabled:s},"aria-disabled":s,accessibilityActions:ACCESSIBILITY_ACTIONS,onAccessibilityAction:V,children:[_jsx(Animated.View,{style:[C.fill,{backgroundColor:x,opacity:s?.5:1},D],pointerEvents:"none"}),_jsx(Animated.View,{style:[C.labelWrap,O],pointerEvents:"none",children:_jsx(Text,{style:[C.label,{color:S.colors.text.secondary,fontSize:S.typography.fontSize.base},p],numberOfLines:1,children:w?r:i})}),_jsx(GestureDetector,{gesture:M,children:_jsx(Animated.View,{style:[C.handle,{width:v,height:v,borderRadius:S.radius.pill,...smoothCorners,backgroundColor:S.colors.background.elevated,opacity:s?.5:1,...S.shadows.sm},f,z],children:d??_jsx(Chevron,{color:x,size:.5*v})})})]})});SlideToConfirm.displayName="SlideToConfirm";const buildStyles=(e,t)=>StyleSheet.create({track:{height:t.height,borderRadius:e.radius.pill,...smoothCorners,justifyContent:"center",overflow:"hidden",padding:e.spacing[t.pad]},fill:{position:"absolute",left:0,top:0,bottom:0,borderRadius:e.radius.pill,...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;

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

	@@ -1 +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],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-2M;return r===a\|\|i<=0?M:M+(e-a)/(r-a)i},[a,r,M]),ae=useCallback((e,t)=>{const s=t-2M;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(ip)/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]),Ae=useCallback(e=>{if(s)return;const t="increment"===e.nativeEvent.actionName?i:-i,n=i>0?Math.round(tee)/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]),De=H.thumbDiameter/2,He=s?_.colors.surface.disabled:W,Me="inset"===l?{backgroundColor:He,borderColor:_.colors.background.elevated,borderWidth:Math.max(2,Math.round(.3H.thumbDiameter)),...NO_SHADOW}:"minimal"===l?{backgroundColor:He,borderWidth:0}:"bar"===l?{backgroundColor:"transparent",borderWidth:0,...NO_SHADOW}:{backgroundColor:_.colors.background.elevated,borderColor:He},Oe=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}]}}),Ee=useAnimatedStyle(()=>({transform:[{translateX:F.value-De},{scale:K.value}]})),je=useAnimatedStyle(()=>({transform:[{translateX:G.value-De},{scale:Y.value}]})),Te=useAnimatedStyle(()=>({opacity:q.value})),Ve=useAnimatedStyle(()=>({opacity:Q.value})),clampDisplay=e=>clamp(e,a,r),Re=clampDisplay(N?Math.min(...X):X),Ie=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:Re,text:`${Re} to ${Ie}`}:{min:a,max:r,now:Re},accessibilityActions:[{name:"increment"},{name:"decrement"}],onAccessibilityAction:Ae,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,Oe]})]}),_jsx(GestureDetector,{gesture:ke,children:_jsx(Animated.View,{style:[V.thumb,{width:H.thumbDiameter,height:H.thumbDiameter,borderRadius:De,...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})}),N?_jsx(GestureDetector,{gesture:Ce,children:_jsx(Animated.View,{style:[V.thumb,{width:H.thumbDiameter,height:H.thumbDiameter,borderRadius:De,...smoothCorners,opacity:s?.55:1},Me,v,je],accessibilityElementsHidden:!0,importantForAccessibility:"no-hide-descendants",children:u?_jsxs(Animated.View,{style:[V.bubbleWrap,Ve],pointerEvents:"none",children:[_jsx(View,{style:[V.bubble,{backgroundColor:W}],children:d?d(Ie):_jsx(Text,{style:[V.bubbleText,{color:L},w],numberOfLines:1,children:m(Ie)})}),_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;
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{resolveSliderSize,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 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:p,containerStyle:g,trackStyle:f,fillStyle:v,thumbStyle:y,labelStyle:w,thumbPressScale:S,labelShowDuration:k,labelOpacity:C,testID:x}=e,_=useTheme(),A=_.components.slider,O=useMemo(()=>resolveSliderSize(_,o),[_,o]),M=useMemo(()=>"default"===l?O:VARIANT_SIZE_MAP[l][o],[O,o,l]),j="inset"===l?M.trackHeight/2:0,T=A?.thumbPressAnimation??!1,E=S??A?.thumbPressScale??1.1,D=k??A?.labelShowDuration??_.motion.duration.fast,V=C??A?.labelOpacity??1,H=useMemo(()=>buildStyles(_,M),[_,M]),R=useMemo(()=>({damping:_.motion.spring.snappy.damping,stiffness:_.motion.spring.snappy.stiffness,mass:_.motion.spring.snappy.mass}),[_.motion.spring.snappy]),[W,I]=useState(0),L=_.colors[TONE_TO_COLOR_KEY[n]],N=sliderToneInk(_,n),P=!0===e.range,[X,B]=useControllableState({value:e.value,defaultValue:e.defaultValue??(P?[a,r]:a),onChange:e.onChange}),F=useSharedValue(0),z=useSharedValue(0),G=useSharedValue(P?X[0]:X),J=useSharedValue(P?X[1]:X),U=useSharedValue(0),K=useSharedValue(0),Y=useSharedValue(1),Z=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(z),cancelAnimation(Y),cancelAnimation(Z),cancelAnimation(q),cancelAnimation(Q)},[F,z,Y,Z,q,Q]);const te=useCallback((e,t)=>{const i=t-2j;return r===a\|\|i<=0?j:j+(e-a)/(r-a)i},[a,r,j]),ae=useCallback((e,t)=>{const s=t-2j;if(s<=0)return a;const n=clamp((e-j)/s,0,1);return snapToStep(a+n(r-a),a,r,i)},[a,r,i,j]),re=useRef(!1),ie=_.motion.duration.fast,se=useRef(X);se.current=X;const ne=useRef(W);ne.current=W;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(P){const[e,r]=a,i=Math.min(e,r),s=Math.max(e,r);G.value=i,J.value=s,F.value=place(te(i,t)),z.value=place(te(s,t))}else{const e=a;G.value=e,J.value=e,F.value=place(te(e,t))}},[P,te,G,J,F,z,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),W,le,oe]);const de=useCallback(e=>{const t=e.nativeEvent.layout.width;K.value=t,I(t)},[K]),he=useCallback((e,t)=>{B(P?[e,t]:e)},[P,B]),be=useCallback(()=>{const e=resolveHaptic(b,"selection");e&&triggerHaptic(e)},[b]),pe=useRef(he);pe.current=he;const ge=useRef(be);ge.current=be;const fe=useCallback((e,t)=>pe.current(e,t),[]),ve=useCallback(()=>ge.current(),[]),ye=Math.max(0,(44-M.thumbDiameter)/2),we=ye>0?ye:void 0,Se=useCallback(e=>{const t="low"===e?F:z,n="low"===e?G:J,o="low"===e?J:G,l="low"===e?Y:Z,m="low"===e?q:Q,d="low"===e,h=a,b=r,p=i,g=ee,f=P,v=E,y=T,w=!0===u,S=c,k=V,C=D,x=R,_=j,follow=e=>{"worklet";const a=K.value-2_;if(a<=0\|\|!Number.isFinite(e))return;const r=Math.min(Math.max(U.value+e,_),K.value-_);let i=h+(r-_)/a(b-h);p>0&&(i=Math.round((i-h)/p)p+h,i=Math.round(ig)/g),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,z.value):Math.max(r,F.value):r,i!==n.value&&(n.value=i,i!==h&&i!==b\|\|runOnJS(ve)(),runOnJS(fe)(G.value,J.value))},A=Gesture.Pan().enabled(!s).minDistance(0);return(void 0===we?A:A.hitSlop(we)).onStart(()=>{"worklet";runOnJS(me)(!0),U.value=t.value,y&&(l.value=withSpring(v,x)),w&&(m.value=withTiming(k,{duration:C,easing:Easing.out(Easing.cubic)})),runOnJS(ve)()}).onUpdate(e=>{"worklet";follow(e.translationX)}).onEnd(e=>{"worklet";follow(e.translationX),y&&(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,P,E,T,u,c,V,D,R,j,we,fe,ve,me,F,z,G,J,Y,Z,q,Q,U,K]),ke=useMemo(()=>Se("low"),[Se]),Ce=useMemo(()=>Se("high"),[Se]),xe=useCallback(e=>{if(s\|\|P\|\|W<=0)return;const t=clamp(e.nativeEvent.locationX,0,W),a=ae(t,W);a!==G.value&&(be(),G.value=a,F.value=withTiming(te(a,W),{duration:_.motion.duration.fast,easing:Easing.out(Easing.cubic)}),he(a,a))},[s,P,W,ae,te,he,be,F,G,_.motion.duration.fast]),Ae=useCallback(e=>{if(s)return;const t="increment"===e.nativeEvent.actionName?i:-i,n=i>0?Math.round(tee)/ee:t;if(P){const e=Math.round((G.value+n)ee)/ee,t=clamp(e,a,J.value);t!==G.value&&(G.value=t,F.value=te(t,W),be(),he(t,J.value))}else{const e=Math.round((G.value+n)ee)/ee,t=clamp(e,a,r);t!==G.value&&(G.value=t,F.value=te(t,W),be(),he(t,t))}},[s,i,ee,P,a,r,te,W,F,G,J,he,be]),Oe=M.thumbDiameter/2,Me=s?_.colors.surface.disabled:L,je="inset"===l?{backgroundColor:Me,borderColor:_.colors.background.elevated,borderWidth:Math.max(2,Math.round(.3M.thumbDiameter)),...NO_SHADOW}:"minimal"===l?{backgroundColor:Me,borderWidth:0}:"bar"===l?{backgroundColor:"transparent",borderWidth:0,...NO_SHADOW}:{backgroundColor:_.colors.background.elevated,borderColor:Me},Te=useAnimatedStyle(()=>{const e=K.value;if(e<=0)return{opacity:0,transform:[{translateX:0},{scaleX:1}]};const t=s?.55:1;if(P){const a=Math.max(0,z.value-F.value+2*j);return{opacity:t,transform:[{translateX:F.value-j},{scaleX:a/e}]}}return{opacity:t,transform:[{translateX:F.value+j-e},{scaleX:1}]}}),Ee=useAnimatedStyle(()=>({transform:[{translateX:F.value-Oe},{scale:Y.value}]})),De=useAnimatedStyle(()=>({transform:[{translateX:z.value-Oe},{scale:Z.value}]})),Ve=useAnimatedStyle(()=>({opacity:q.value})),He=useAnimatedStyle(()=>({opacity:Q.value})),clampDisplay=e=>clamp(e,a,r),Re=clampDisplay(P?Math.min(...X):X),We=clampDisplay(P?Math.max(...X):X);return _jsx(View,{ref:t,style:[H.container,g,p],testID:x,accessibilityRole:"adjustable",accessibilityLabel:h,accessibilityState:{disabled:s},"aria-disabled":s,accessibilityValue:P?{min:a,max:r,now:Re,text:`${Re} to ${We}`}:{min:a,max:r,now:Re},accessibilityActions:[{name:"increment"},{name:"decrement"}],onAccessibilityAction:Ae,children:_jsx(Pressable,{onPress:xe,disabled:s\|\|P,style:H.trackTouch,accessibilityElementsHidden:!0,importantForAccessibility:"no-hide-descendants",children:_jsxs(View,{style:H.trackWrap,onLayout:de,children:[_jsxs(View,{style:H.trackClip,pointerEvents:"none",children:[_jsx(View,{style:[H.track,{backgroundColor:s?_.colors.surface.disabled:_.colors.border.primary},f]}),_jsx(Animated.View,{style:[H.fill,{backgroundColor:s?_.colors.surface.disabled:L},v,Te]})]}),_jsx(GestureDetector,{gesture:ke,children:_jsx(Animated.View,{style:[H.thumb,{width:M.thumbDiameter,height:M.thumbDiameter,borderRadius:Oe,...smoothCorners,opacity:s?.55:1},je,y,Ee],accessibilityElementsHidden:!0,importantForAccessibility:"no-hide-descendants",children:u?_jsxs(Animated.View,{style:[H.bubbleWrap,Ve],pointerEvents:"none",children:[_jsx(View,{style:[H.bubble,{backgroundColor:L}],children:d?d(Re):_jsx(Text,{style:[H.bubbleText,{color:N},w],numberOfLines:1,children:m(Re)})}),_jsx(View,{style:[H.bubbleCaret,{backgroundColor:L}]})]}):null})}),P?_jsx(GestureDetector,{gesture:Ce,children:_jsx(Animated.View,{style:[H.thumb,{width:M.thumbDiameter,height:M.thumbDiameter,borderRadius:Oe,...smoothCorners,opacity:s?.55:1},je,y,De],accessibilityElementsHidden:!0,importantForAccessibility:"no-hide-descendants",children:u?_jsxs(Animated.View,{style:[H.bubbleWrap,He],pointerEvents:"none",children:[_jsx(View,{style:[H.bubble,{backgroundColor:L}],children:d?d(We):_jsx(Text,{style:[H.bubbleText,{color:N},w],numberOfLines:1,children:m(We)})}),_jsx(View,{style:[H.bubbleCaret,{backgroundColor:L}]})]}):null})}):null]})})})});Slider.displayName="Slider";const buildStyles=(e,t)=>{const a=e.shadows.md,r=Math.max(t.thumbDiameter,t.trackHeight),i=r/2+e.spacing.xs;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:e.radius.none,...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 CHANGED Viewed

	@@ -1 +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.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;
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{resolveFieldSize,useTheme}from"../../theme/index.js";import{AppIcon,renderSlotIcon}from"../AppIcon/index.js";import{FieldBase,FieldLabel,FieldMessage,hasFieldText,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,styles:o,style:a,testID:n})=>{const r=useTheme(),d=resolveFieldSize(r,"sm"),c=resolveFieldTextStyle(r,{disabled:l}),u=useRef(null),p=useCallback(()=>{l\|\|u.current?.focus()},[l]);return _jsx(FieldBase,{size:"sm",focused:e.editing,disabled:l,error:t,filled:!0,width:i,onPress:p,pressFeedback:!1,paddingHorizontal:r.spacing.sm,gap:r.spacing.xs,trailing:t?_jsx(AppIcon,{name:"info-circle",size:d.icon,color:r.colors.toneText.error}):void 0,style:a,children:_jsx(TextInput,{ref:u,style:[o.boxInput,{color:c.color,fontSize:d.text,...c.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:r.colors.primary,accessibilityLabel:s,accessibilityState:{disabled:l},"aria-disabled":l,testID:n})})},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:resolveFieldSize(A,"md").icon,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`,styles:W,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`,styles:W,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`,styles:W,style:C,testID:$?`${$}-input`:void 0}):null]}),_jsx(FieldMessage,{text:k?n:a,error:k})]})});SliderField.displayName="SliderField";const 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:e.spacing.sm},bound:{fontSize:e.typography.fontSize.sm,fontVariant:["tabular-nums"]},bubbleText:{fontSize:e.typography.fontSize.xs,fontVariant:["tabular-nums"]},boxInput:{flex:1,padding:e.spacing.none,margin:e.spacing.none,includeFontPadding:!1}});export{SliderField};export default SliderField;

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

	@@ -1 +1 @@
1	- "use strict";import{forwardRef,useEffect,useMemo,useRef}from"react";import{ActivityIndicator,Animated,Easing,StyleSheet,Text,View}from"react-native";import{usePresenceMotion}from"../../hooks/usePresenceMotion.js";import{createAnimatedValue,useTheme}from"../../theme/index.js";import{announce}from"../../utils/announce.js";import{blendOf}from"../../utils/color.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},CONTAINER_RATIO=1.5,DOT_COUNT=3,DOT_STAGGER_MS=150,DOT_CYCLE_MS=600,DOT_GROW_SCALE=1.4,DOT_PULSE_MIN_OPACITY=.4,Dot=({size:e,color:t,delay:i,duration:n,reduced:r})=>{const o=useRef(createAnimatedValue(0)).current;useEffect(()=>{const e=Animated.loop(Animated.sequence([Animated.delay(i),Animated.timing(o,{toValue:1,duration:n/2,easing:Easing.out(Easing.quad),useNativeDriver:!0}),Animated.timing(o,{toValue:0,duration:n/2,easing:Easing.in(Easing.quad),useNativeDriver:!0})]));return e.start(),()=>{e.stop()}},[o,i,n]);const s=useMemo(()=>({grow:o.interpolate({inputRange:[0,1],outputRange:[1,1.4]}),fade:o.interpolate({inputRange:[0,1],outputRange:[.4,1]})}),[o]);return _jsx(Animated.View,{style:{width:e,height:e,borderRadius:~~e/2~~,...smoothCorners,backgroundColor:t,...r?{opacity:s.fade}:{transform:[{scale:s.grow}]}}})},Spinner=forwardRef((e,t)=>{const{size:i="md",color:n,message:r,overlay:o=!1,backdropColor:s,variant:a="circular",accessibilityLabel:l,style:c,testID:u}=e,d="contained"===a,m=o&&!d,g=useTheme(),y=usePresenceMotion(),f=y.duration("normal"),p=useRef(createAnimatedValue(0)).current;useEffect(()=>{Animated.timing(p,{toValue:1,duration:f,easing:Easing.bezier(...g.motion.easing.standard),useNativeDriver:!0}).start()},[p,g,f]);const h=useMemo(()=>buildStyles(g),[g]),b=sizeMap[i],j=n??g.colors.primary,x=s??g.colors.background.overlay,C=useMemo(()=>{if("contained"===a){const e=Math.round(1.5b);return _jsx(View,{style:[h.container,{width:e,height:e,borderRadius:~~e/2~~,backgroundColor:blendOf(j,.14,g.colors.background.elevated,g.colors.background.secondary)}],children:_jsx(ActivityIndicator,{color:j,size:"sm"===i?"small":"large",style:{width:b,height:b}})})}if("dots"===a){const e=Math.max(6,Math.round(b/4));return _jsx(View,{style:[h.dotsRow,{gap:Math.round(e/2)}],children:Array.from({length:3}).map((t,i)=>_jsx(Dot,{size:e,color:j,delay:150i,duration:600,reduced:y.reduced},i))})}return _jsx(ActivityIndicator,{color:j,size:"sm"===i?"small":"large",style:{width:b,height:b}})},[a,i,b,j,h.dotsRow,h.container,y.reduced,g.colors.background.elevated,g.colors.background.secondary]),S=l??r??"Loading",v=useRef(S);v.current=S,useEffect(()=>{d&&announce(v.current)},[d]);const R=useSquircle(m,g.radius.lg),_=R.active&&R.size?{borderRadius:squircleHostRadius(R.size.width,R.size.height,g.radius.lg)}:null;let w=h.inlineContent;m?w=h.overlayContent:d&&(w=h.containedContent);const A=_jsxs(Animated.View,{ref:t,accessible:!0,accessibilityRole:"progressbar",accessibilityLiveRegion:d?"none":"polite",accessibilityLabel:S,accessibilityState:{busy:!0},"aria-busy":!0,testID:u,onLayout:R.onLayout,style:[w,_,{opacity:p}],children:[R.active&&R.size?_jsx(SquircleFill,{width:R.size.width,height:R.size.height,radius:g.radius.lg,fill:g.colors.background.elevated}):null,C,r?_jsx(Text,{style:[h.message,{color:g.colors.text.primary,fontSize:g.typography.fontSize.base,fontWeight:g.typography.fontWeight.medium,marginTop:g.spacing.md}],numberOfLines:2,children:r}):null]});return _jsx(View,m?{pointerEvents:"auto",style:[h.overlay,{backgroundColor:x},c],children:A}:{style:[d?h.containedFill:h.inline,c],children:A})});Spinner.displayName="Spinner";const buildStyles=e=>StyleSheet.create({inline:{alignItems:"center",justifyContent:"center"},inlineContent:{alignItems:"center",justifyContent:"center"},containedFill:{flex:1,alignSelf:"stretch",alignItems:"center",justifyContent:"center",minHeight:Math.round(1.5sizeMap.lg)+2e.spacing.xl},containedContent:{alignItems:"center",justifyContent:"center",paddingHorizontal:e.spacing.lg},container:{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;
1	+ "use strict";import{forwardRef,useEffect,useMemo,useRef}from"react";import{ActivityIndicator,Animated,Easing,StyleSheet,Text,View}from"react-native";import{usePresenceMotion}from"../../hooks/usePresenceMotion.js";import{createAnimatedValue,useTheme}from"../../theme/index.js";import{announce}from"../../utils/announce.js";import{blendOf}from"../../utils/color.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},CONTAINER_RATIO=1.5,DOT_COUNT=3,DOT_STAGGER_MS=150,DOT_CYCLE_MS=600,DOT_GROW_SCALE=1.4,DOT_PULSE_MIN_OPACITY=.4,Dot=({size:e,color:t,delay:i,duration:n,reduced:r})=>{const o=useTheme(),s=useRef(createAnimatedValue(0)).current;useEffect(()=>{const e=Animated.loop(Animated.sequence([Animated.delay(i),Animated.timing(s,{toValue:1,duration:n/2,easing:Easing.out(Easing.quad),useNativeDriver:!0}),Animated.timing(s,{toValue:0,duration:n/2,easing:Easing.in(Easing.quad),useNativeDriver:!0})]));return e.start(),()=>{e.stop()}},[s,i,n]);const a=useMemo(()=>({grow:s.interpolate({inputRange:[0,1],outputRange:[1,1.4]}),fade:s.interpolate({inputRange:[0,1],outputRange:[.4,1]})}),[s]);return _jsx(Animated.View,{style:{width:e,height:e,borderRadius:o.radius.pill,...smoothCorners,backgroundColor:t,...r?{opacity:a.fade}:{transform:[{scale:a.grow}]}}})},Spinner=forwardRef((e,t)=>{const{size:i="md",color:n,message:r,overlay:o=!1,backdropColor:s,variant:a="circular",accessibilityLabel:l,style:c,testID:u}=e,d="contained"===a,m=o&&!d,g=useTheme(),y=usePresenceMotion(),p=y.duration("normal"),f=useRef(createAnimatedValue(0)).current;useEffect(()=>{Animated.timing(f,{toValue:1,duration:p,easing:Easing.bezier(...g.motion.easing.standard),useNativeDriver:!0}).start()},[f,g,p]);const h=useMemo(()=>buildStyles(g),[g]),b=sizeMap[i],j=n??g.colors.primary,x=s??g.colors.background.overlay,C=useMemo(()=>{if("contained"===a){const e=Math.round(1.5b);return _jsx(View,{style:[h.container,{width:e,height:e,borderRadius:g.radius.pill,backgroundColor:blendOf(j,.14,g.colors.background.elevated,g.colors.background.secondary)}],children:_jsx(ActivityIndicator,{color:j,size:"sm"===i?"small":"large",style:{width:b,height:b}})})}if("dots"===a){const e=Math.max(6,Math.round(b/4));return _jsx(View,{style:[h.dotsRow,{gap:Math.round(e/2)}],children:Array.from({length:3}).map((t,i)=>_jsx(Dot,{size:e,color:j,delay:150i,duration:600,reduced:y.reduced},i))})}return _jsx(ActivityIndicator,{color:j,size:"sm"===i?"small":"large",style:{width:b,height:b}})},[a,i,b,j,h.dotsRow,h.container,y.reduced,g.radius.pill,g.colors.background.elevated,g.colors.background.secondary]),S=l??r??"Loading",v=useRef(S);v.current=S,useEffect(()=>{d&&announce(v.current)},[d]);const R=useSquircle(m,g.radius.lg),_=R.active&&R.size?{borderRadius:squircleHostRadius(R.size.width,R.size.height,g.radius.lg)}:null;let w=h.inlineContent;m?w=h.overlayContent:d&&(w=h.containedContent);const A=_jsxs(Animated.View,{ref:t,accessible:!0,accessibilityRole:"progressbar",accessibilityLiveRegion:d?"none":"polite",accessibilityLabel:S,accessibilityState:{busy:!0},"aria-busy":!0,testID:u,onLayout:R.onLayout,style:[w,_,{opacity:f}],children:[R.active&&R.size?_jsx(SquircleFill,{width:R.size.width,height:R.size.height,radius:g.radius.lg,fill:g.colors.background.elevated}):null,C,r?_jsx(Text,{style:[h.message,{color:g.colors.text.primary,fontSize:g.typography.fontSize.base,fontWeight:g.typography.fontWeight.medium,marginTop:g.spacing.md}],numberOfLines:2,children:r}):null]});return _jsx(View,m?{pointerEvents:"auto",style:[h.overlay,{backgroundColor:x},c],children:A}:{style:[d?h.containedFill:h.inline,c],children:A})});Spinner.displayName="Spinner";const buildStyles=e=>StyleSheet.create({inline:{alignItems:"center",justifyContent:"center"},inlineContent:{alignItems:"center",justifyContent:"center"},containedFill:{flex:1,alignSelf:"stretch",alignItems:"center",justifyContent:"center",minHeight:Math.round(1.5sizeMap.lg)+2e.spacing.xl},containedContent:{alignItems:"center",justifyContent:"center",paddingHorizontal:e.spacing.lg},container:{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 CHANGED Viewed

	@@ -1 +1 @@
1	- "use strict";import{forwardRef,useMemo}from"react";import{StyleSheet,Text,View}from"react-native";import{fontFor,useTheme}from"../../theme/index.js";import{deriveToneInk}from"../../theme/toneInk.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":case"danger":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.onNeutral,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:deriveToneInk(r,[e.colors.background.primary,e.colors.background.secondary,e.colors.background.tertiary],e.mode)}: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,m=useTheme(),f=~~sizeMap[~~n],b=useMemo(()=>paletteFor(m,r,s,i),[m,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:f.height,paddingHorizontal:f.paddingH,borderRadius:m.radius.~~full~~,...smoothCorners,backgroundColor:b.fill,borderColor:b.border,borderWidth:1},c],children:[a?_jsx(View,{testID:"status-badge-dot",style:{width:f.dot,height:f.dot,borderRadius:f.dot/2,marginRight:f.gap,backgroundColor:b.dot}}):null,_jsx(Text,{style:[styles.label,{color:b.text,fontSize:f.fontSize,...fontFor(m,"semibold")},u],numberOfLines:1,maxFontSizeMultiplier:m.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))+2s.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;
1	+ "use strict";import{forwardRef,useMemo}from"react";import{StyleSheet,Text,View}from"react-native";import{fontFor,useTheme}from"../../theme/index.js";import{deriveToneInk}from"../../theme/toneInk.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,paddingX:"sm",text:"xs",dot:5,gap:"xs"},md:{height:24,paddingX:"md",text:"sm",dot:6,gap:"xs"}},sizeFor=(e,t)=>{const o=sizeMap[t];return{height:o.height,paddingH:e.spacing[o.paddingX],fontSize:e.typography.fontSize[o.text],dot:o.dot,gap:e.spacing[o.gap]}},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":case"danger":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.onNeutral,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:deriveToneInk(r,[e.colors.background.primary,e.colors.background.secondary,e.colors.background.tertiary],e.mode)}: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:g,testID:u}=e,m=useTheme(),f=sizeFor(m,n),p=useMemo(()=>paletteFor(m,r,s,i),[m,r,s,i]);return l?_jsx(StatusBadgeSkeleton,{...e}):_jsxs(View,{ref:t,accessible:!0,accessibilityRole:"text",accessibilityLabel:d??o,testID:u,style:[styles.base,{minHeight:f.height,paddingHorizontal:f.paddingH,borderRadius:m.radius.pill,...smoothCorners,backgroundColor:p.fill,borderColor:p.border,borderWidth:1},c],children:[a?_jsx(View,{testID:"status-badge-dot",style:{width:f.dot,height:f.dot,borderRadius:f.dot/2,marginRight:f.gap,backgroundColor:p.dot}}):null,_jsx(Text,{style:[styles.label,{color:p.text,fontSize:f.fontSize,...fontFor(m,"semibold")},g],numberOfLines:1,maxFontSizeMultiplier:m.maxFontSizeMultiplier,children:o})]})});StatusBadge.displayName="StatusBadge";const StatusBadgeSkeleton=({label:e,size:t="md",dot:o,style:r})=>{const s=useTheme(),n=sizeFor(s,t),a=Math.max(32,Math.min(120,6.5(e??"").length))+2n.paddingH+(o?n.dot+n.gap:0);return _jsx(Skeleton,{width:a,height:n.height,radius:n.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 CHANGED Viewed

	@@ -1 +1 @@
1	- "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.normalMath.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/(2T):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;
1	+ "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,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,circleStyles:g,circleSlotStyle:x})=>{const S="active"===i,b=useTheme(),f=useRef(createAnimatedValue(1)).current,w=useRef(createAnimatedValue(.5)).current;useEffect(()=>{if(!S\|\|!m)return f.setValue(1),void w.setValue(0);const e=Animated.loop(Animated.parallel([Animated.sequence([Animated.timing(f,{toValue:1.4,duration:y,easing:Easing.out(Easing.ease),useNativeDriver:!0}),Animated.timing(f,{toValue:1,duration:0,useNativeDriver:!0})]),Animated.sequence([Animated.timing(w,{toValue:0,duration:y,easing:Easing.out(Easing.ease),useNativeDriver:!0}),Animated.timing(w,{toValue:.5,duration:0,useNativeDriver:!0})])]));return e.start(),()=>e.stop()},[S,f,w,m,y]);const C="upcoming"===i?l:s,v="upcoming"===i?o:s,j="upcoming"===i?n:r,_="complete"===i,V=`Step ${e+1} of ${p}, ${t.label}, ${i}`,k=_jsxs(View,{style:g.relative,children:[S&&m?_jsx(Animated.View,{pointerEvents:"none",style:[g.pulse,{width:h,height:h,borderRadius:b.radius.pill,...smoothCorners,backgroundColor:s,opacity:w,transform:[{scale:f}]}]}):null,_jsx(View,{style:[g.circle,{width:u,height:u,borderRadius:b.radius.pill,...smoothCorners,backgroundColor:C,borderColor:v},x],children:t.icon?t.icon:_jsx(Text,_?{style:[g.glyph,{color:j}],children:"✓"}:{style:[g.glyph,{color:j}],children:e+1})})]});return a?_jsx(Pressable,{onPress:()=>d(e),disabled:!c,accessibilityRole:"button",accessibilityLabel:V,accessibilityState:{selected:S,disabled:!c},"aria-selected":S,"aria-disabled":!c,hitSlop:8,children:k}):_jsx(View,{accessibilityRole:"text",accessibilityLabel:V,accessibilityState:{selected:S},"aria-selected":S,children:k})},buildCircleStyles=e=>StyleSheet.create({relative:{alignItems:"center",justifyContent:"center"},pulse:{position:"absolute"},circle:{borderWidth:2,alignItems:"center",justifyContent:"center"},glyph:{fontSize:e.typography.fontSize.sm,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:x,connectorStyle:S,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=useMemo(()=>buildCircleStyles(w),[w]),A=toneColorFor(w,c),D=w.colors.border.primary,E=w.colors.background.primary,L=w.colors.text.secondary,T=toneOnColorFor(w,c),$=i.length,z="none"!==l,P=void 0!==s,[F,B]=useState(o),O=P?s:F,N=null==O\|\|O<0?null:O,M=i.map((e,t)=>(e=>null===N?"upcoming":e<N?"complete":e===N?"active":"upcoming")(t)),H=M.filter(e=>"upcoming"!==e).length,U=M.filter(e=>"complete"===e).length,canPressStatus=e=>"back"===l?"complete"===e:z,handleStepPress=e=>{if(!canPressStatus(M[e]))return;k&&triggerHaptic(k),r?.(e);const t="select"===l&&e===N?null:e;P\|\|B(t),n?.(t)},W=useRef(createAnimatedValue(H)).current,G=useRef(H);useEffect(()=>{const e=G.current;if(e===H)return;G.current=H;const t=Animated.timing(W,{toValue:H,duration:w.motion.duration.normalMath.abs(H-e),easing:Easing.linear,useNativeDriver:!1});return t.start(),()=>t.stop()},[H,W,w.motion]);const sliceOf=e=>W.interpolate({inputRange:[e,e+1],outputRange:["0%","100%"],extrapolate:"clamp"}),q=$<=1?"0%":W.interpolate({inputRange:[1,$],outputRange:["0%","100%"],extrapolate:"clamp"}),Z=null!==N&&N<$?N:null,J=h??(null!==Z?`Progress: step ${Z+1} of ${$}`:`Progress: ${U} of ${$} steps done`),[K,Q]=useState(0),X=$>0&&K>0?K/(2$):0,Y=_jsx(View,{ref:t,style:[R.container,y,m],testID:f,accessibilityRole:"progressbar",accessibilityLabel:J,accessibilityValue:{min:0,max:$,now:H},children:"segmented"===a?(()=>{const e=null!==Z?i[Z]:void 0,t=d?p?p(Z,$,e):null!==Z?`Step ${Z+1} of ${$}${e?.label?` · ${e.label}`:""}`:`${U} of ${$} 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},x],numberOfLines:1,children:t}):null,_jsx(View,{style:R.sRow,children:i.map((e,t)=>{const i=M[t],s=`Step ${t+1} of ${$}, ${e.label}, ${i}`,o=_jsx(View,{testID:f?`${f}-segment-${t}`:void 0,style:[R.sTrack,{backgroundColor:D},S],children:_jsx(Animated.View,{style:[R.sFill,{backgroundColor:A,width:sliceOf(t)}]})});if(z){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=M[t],s=t===$-1;return _jsxs(View,{style:R.vRow,children:[_jsxs(View,{style:R.vLeft,children:[_jsx(StepCircle,{index:t,step:e,status:i,toneColor:A,upcomingColor:D,upcomingFillColor:E,onPressColor:A,textOnColor:T,upcomingTextColor:L,interactive:z,canPress:canPressStatus(i),totalSteps:$,onPress:handleStepPress,circleSize:v,pulseSize:j,pulseEnabled:_,pulseDuration:V,circleStyles:I,circleSlotStyle:g}),s?null:_jsxs(View,{style:[R.vConnectorContainer,S],children:[_jsx(View,{style:[R.vConnectorTrack,{backgroundColor:D}]}),_jsx(Animated.View,{style:[R.vConnectorFill,{backgroundColor:A,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},x],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=>Q(e.nativeEvent.layout.width),children:[_jsxs(View,{pointerEvents:"none",style:[R.hConnectorContainer,{left:X,right:X},S],children:[_jsx(View,{style:[R.hConnectorTrack,{backgroundColor:D}]}),_jsx(Animated.View,{style:[R.hConnectorFill,{backgroundColor:A,width:q}]})]}),i.map((e,t)=>{const i=M[t];return _jsxs(View,{style:R.hStepItem,children:[_jsx(StepCircle,{index:t,step:e,status:i,toneColor:A,upcomingColor:D,upcomingFillColor:E,onPressColor:A,textOnColor:T,upcomingTextColor:L,interactive:z,canPress:canPressStatus(i),totalSteps:$,onPress:handleStepPress,circleSize:v,pulseSize:j,pulseEnabled:_,pulseDuration:V,circleStyles:I,circleSlotStyle:g}),_jsx(Text,{style:[R.hLabel,{color:"upcoming"===i?w.colors.text.tertiary:w.colors.text.primary,fontSize:w.typography.fontSize.xs},x],numberOfLines:1,children:e?.label??" "})]},e.key)})]})});return u?_jsx(StepperSkeleton,{...e}):Y});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=useMemo(()=>buildSkeletonStyles(r),[r]),d=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:d}).map((e,t)=>_jsx(View,{style:c.sItem,children:_jsx(Skeleton,{width:"100%",height:4,radius:"pill"})},`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:p.vCol,children:Array.from({length:d}).map((e,t)=>{const i=t===d-1;return _jsxs(View,{style:p.vRow,children:[_jsxs(View,{style:[p.vLeft,{width:a+8}],children:[_jsx(Skeleton,{shape:"circle",width:a,height:a}),i?null:_jsx(Skeleton,{width:2,height:36})]}),_jsxs(View,{style:p.vBody,children:[_jsx(Skeleton,{shape:"text",width:"55%",height:16,style:{marginBottom:r.spacing.xs}}),_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/d+"%",right:50/d+"%"}],children:_jsx(Skeleton,{width:"100%",height:2,radius:"pill"})}),Array.from({length:d}).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 buildSkeletonStyles=e=>StyleSheet.create({vCol:{flexDirection:"column"},vRow:{flexDirection:"row",alignItems:"flex-start"},vLeft:{alignItems:"center"},vBody:{flex:1,paddingLeft:e.spacing.md,paddingBottom:e.spacing.lg}}),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:e.radius.pill,...smoothCorners},hConnectorFill:{position:"absolute",left:0,height:2,borderRadius:e.radius.pill,...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:e.radius.pill,...smoothCorners},vConnectorFill:{position:"absolute",top:0,width:2,borderRadius:e.radius.pill,...smoothCorners},vBody:{flex:1,paddingLeft:e.spacing.sm,paddingBottom:e.spacing.md},vLabel:{marginBottom:e.spacing.xxs},vDescription:{},sCaption:{includeFontPadding:!1},sRow:{flexDirection:"row",columnGap:e.spacing.xs},sItem:{flex:1},sTrack:{height:4,borderRadius:e.radius.pill,overflow:"hidden"},sFill:{height:4,borderRadius:e.radius.pill}});export{Stepper};export default Stepper;

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

	@@ -1 +1 @@
1	- "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;
1	+ "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:o,onSwipeOpen:r,onSwipeClose:a,disabled:l=!1,haptic:c,containerStyle:u,contentStyle:h,actionStyle:d,accessibilityLabel:m,testID:p}=e,S=useTheme(),f=S.components.swipeable,g=i??f?.threshold??80,b=o??f?.fullSwipeThreshold??200,y=f?.dragActivationOffset??10,w=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]),_=useMemo(()=>buildActionStyles(S),[S]),O=!!n&&n.length>0,C=!!s&&s.length>0,I=Dimensions.get("window").width,G=O?g(n?.length??0):0,j=C?g(s?.length??0):0,N=useSharedValue(0),R=useSharedValue(0),P=useRef(null);useEffect(()=>()=>{cancelAnimation(N),cancelAnimation(R)},[N,R]);const k=useCallback(e=>{P.current!==e&&(P.current=e,r?.(e))},[r]),T=useCallback(()=>{null!==P.current&&(P.current=null,a?.())},[a]),F=useCallback(e=>{const t="left"===e?n:s,i=t?.[0];i&&(!1!==c&&triggerHaptic("notificationSuccess"),i.onPress(),N.value=withSpring(0,x),P.current=null,a?.())},[n,s,N,a,x,c]),E=useCallback(()=>{N.value=withSpring(0,x),T()},[N,T,x]),D=useCallback(e=>{const t=resolveHaptic(c,"selection");t&&triggerHaptic(t),e.onPress(),E()},[E,c]),M=useMemo(()=>{const e=G,t=j,n=b,s=-b,i=I,o=-I,r=g,a=O,c=C;return Gesture.Pan().enabled(!l).withTestId(p?`${p}-gesture`:"swipeable-gesture").activeOffsetX([-y,y]).failOffsetY([-v,v]).onStart(()=>{"worklet";R.value=N.value}).onUpdate(n=>{"worklet";const s=R.value+n.translationX;N.value=s>0&&!a\|\|s<0&&!c?0:s>e&&a?e+(s-e)w:s<-t&&c?(s+t)w-t:s}).onEnd(()=>{"worklet";const l=N.value;return a&&l>=n?(N.value=withSpring(i,SPRING_CONFIG),void runOnJS(F)("left")):c&&l<=s?(N.value=withSpring(o,SPRING_CONFIG),void runOnJS(F)("right")):a&&l>=r?(N.value=withSpring(e,SPRING_CONFIG),void runOnJS(k)("left")):c&&l<=-r?(N.value=withSpring(-t,SPRING_CONFIG),void runOnJS(k)("right")):(N.value=withSpring(0,x),void runOnJS(T)())})},[l,R,F,b,O,C,G,T,k,j,I,g,N,y,v,w,x,p]),V=useAnimatedStyle(()=>({transform:[{translateX:N.value}]})),B=useAnimatedStyle(()=>({opacity:G>0?Math.min(1,Math.max(0,N.value/G)):0})),H=useAnimatedStyle(()=>({opacity:j>0?Math.min(1,Math.max(0,-N.value/j)):0})),L=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]),J=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\|\|C?_jsxs(View,{style:[A.root,u],testID:p,accessibilityLabel:m,accessibilityActions:L,onAccessibilityAction:J,children:[O?_jsx(Animated.View,{style:[A.actionsRow,A.actionsLeft,{width:G},d,B],pointerEvents:"box-none",children:n?.map(e=>_jsx(ActionButton,{action:e,theme:S,actionStyles:_,width:g,onPress:D},e.key))}):null,C?_jsx(Animated.View,{style:[A.actionsRow,A.actionsRight,{width:j},d,H],pointerEvents:"box-none",children:s?.map(e=>_jsx(ActionButton,{action:e,theme:S,actionStyles:_,width:g,onPress:D},e.key))}):null,_jsx(GestureDetector,{gesture:M,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,actionStyles:n,width:s,onPress:i})=>{const o=e.tone??"neutral",r=toneToBg(t,o);return _jsxs(Pressable,{onPress:()=>i(e),accessibilityRole:"button",accessibilityLabel:e.label,style:[n.button,{width:s,backgroundColor:r,paddingHorizontal:t.spacing.sm}],children:[e.icon?_jsx(View,{style:n.icon,children:e.icon}):null,_jsx(Text,{style:[n.label,{color:toneToOnColor(t,o),fontSize:t.typography.fontSize.sm,fontWeight:t.typography.fontWeight.semibold}],numberOfLines:1,children:e.label})]})},buildActionStyles=e=>StyleSheet.create({button:{flexGrow:0,flexShrink:0,alignItems:"center",justifyContent:"center"},icon:{marginBottom:e.spacing.xxs},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;