npm - @webority/mobile-ui - Versions diffs - 0.12.0 → 0.12.1 - Mend

@webority/mobile-ui 0.12.0 → 0.12.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 (41) hide show

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

	@@ -1 +1 @@
1	- "use strict";import{createContext,forwardRef,useCallback,useContext,useEffect,useImperativeHandle,useMemo,useRef,useState}from"react";import{Dimensions,Modal,Platform,ScrollView,StyleSheet,useWindowDimensions,View}from"react-native";import{Gesture,GestureDetector,GestureHandlerRootView}from"react-native-gesture-handler";import{useReanimatedKeyboardAnimation}from"react-native-keyboard-controller";import Animated,{Easing,runOnJS,useAnimatedStyle,useDerivedValue,useSharedValue,withSpring,withTiming}from"react-native-reanimated";import{SafeAreaProvider,useSafeAreaInsets}from"react-native-safe-area-context";import{useTheme}from"../../theme/index.js";import{triggerHaptic}from"../../utils/index.js";import{smoothCorners}from"../../utils/corners.js";import{ToastHost}from"../Toast/ToastProvider.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const TABLET_MIN_SHORT_SIDE=600,DIALOG_MAX_WIDTH=560,BottomSheetContext=createContext(null);export const useBottomSheet=()=>{const e=useContext(BottomSheetContext);if(!e)throw new Error("useBottomSheet must be used inside a <BottomSheet>.");return e};const SPRING_CONFIG={damping:20,stiffness:240,mass:1},CLOSE_VELOCITY_THRESHOLD=1e3,DRAG_ACTIVATION_OFFSET=10,BottomSheet=forwardRef((e,t)=>{const{snapPoints:o,index:s,onChange:n,onAnimate:r,onAfterClose:a,enablePanDownToClose:l=!0,enableBackdropPress:i=!0,confirmDismiss:u,scrollable:c=!1,scrollRef:d,onScroll:h,onContentSizeChange:m,onScrollLayout:f,scrollEventThrottle:b,keyboardBehavior:p="shift",mode:S="modal",presentation:g="sheet",handleIndicatorStyle:v,containerStyle:y,header:w,footer:C,headerStyle:x,footerStyle:k,children:R,accessibilityLabel:_,accessibilityViewIsModal:I,testID:j}=e,T=useTheme(),M=useSafeAreaInsets(),[V,D]=useState(()=>Dimensions.get("window").height),[O,A]=useState(()=>Dimensions.get("window").width),H=useCallback(e=>{const{height:t,width:o}=e.nativeEvent.layout;t>0&&D(e=>e===t?e:t),o>0&&A(e=>e===o?e:o)},[]),P=useWindowDimensions(),B="dialog"===g\|\|"auto"===g&&Math.min(P.width,P.height)>=600,E=Math.min(560,O-2T.spacing.xl),[G,L]=useState({top:M.top,bottom:M.bottom}),N="modal"===S?G.top:M.top,F="modal"===S?G.bottom:M.bottom,J=o.includes("content"),[z,Y]=useMeasuredHeight(),[$,q]=useMeasuredHeight(),[W,K,X]=useMeasuredHeight(),[U,Q]=useMeasuredHeight(),Z=B?T.spacing.md:z,ee=J?Math.min(Z+(null!=w?$:0)+W+(null!=C?U:0)+F,V-N):0,te=useCallback((e,t)=>{J&&X(t),m?.(e,t)},[J,m,X]),oe=useMemo(()=>resolveSnapPoints(o,V,ee),[o,V,ee]),se=V,ne=oe[oe.length-1]??0,re=useSharedValue(se),ae=useSharedValue(se),le=useSharedValue(-1),[ie,ue]=useState(-1),ce=useRef(!1),[de,he]=useState(!1),[me,fe]=useState(!1),be=useRef(!1),pe=useRef(a);pe.current=a;const[Se,ge]=useState(!1),ve=useRef(-1),ye=useRef(!1);ye.current="modal"===S?me:Se;const we=useRef(u);we.current=u;const Ce=useRef(!1),xe=useRef(!0),ke=useRef([]),Re=useCallback(e=>{const t=ke.current;ke.current=[];for(const o of t)o(e)},[]);useEffect(()=>(xe.current=!0,()=>{xe.current=!1,Re(!1)}),[Re]);const _e=useCallback(e=>{if(e<0\|\|e>=oe.length)return se;const t=oe[e];return B?(V-t)/2:V-t},[oe,V,se,B]),Ie=useCallback(e=>{ve.current=e;ie!==e&&(ue(e),le.value=e,n?.(e))},[ie,le,n]),je=useCallback(()=>{ce.current=!1,le.value<0&&(be.current=!0,"modal"===S?(he(!1),"ios"!==Platform.OS&&fe(!1)):ge(!1))},[S,le]),Te=useCallback(()=>{be.current&&fe(!1)},[]);useEffect(()=>{("modal"===S?!me:!Se)&&be.current&&(be.current=!1,pe.current?.(),Re(!0))},[S,me,Se,Re]);const Me=useCallback((e,t,o)=>{ce.current=!0,r?.(t,o),re.value=withSpring(e,SPRING_CONFIG,e=>{"worklet";e&&runOnJS(je)()})},[r,re,je]),Ve=useCallback(e=>{const t="number"==typeof e?clamp(e,0,oe.length-1):ie>=0?ie:0,o=le.value,s=_e(t);be.current=!1,Re(!1),"modal"===S?(fe(!0),he(!0)):ge(!0),o<0&&(re.value=se),Ie(t),Me(s,o,t)},[Me,se,ie,le,S,oe.length,Ie,Re,re,_e]),De=useCallback(()=>{if(0===oe.length)return;const e=le.value,t=_e(0);Ie(0),Me(t,e,0)},[Me,le,oe.length,Ie,_e]),Oe=useCallback(()=>new Promise(e=>{if(ve.current<0)return void(ye.current?ke.current.push(e):e(!0));ke.current.push(e);const t=le.value;Ie(-1),ce.current=!0,r?.(t,-1),re.value=withTiming(se,{duration:T.motion.duration.fast,easing:Easing.bezier(...T.motion.easing.accelerate)},e=>{"worklet";e&&runOnJS(je)()})}),[se,le,je,r,Ie,re,T.motion.duration.fast,T.motion.easing.accelerate]),Ae=useCallback(async()=>{await Oe()},[Oe]),He=useCallback((e,t,o)=>{const s=we.current;if(!s)return void e();if(Ce.current)return void t?.();const n=s();"boolean"!=typeof n?(Ce.current=!0,o?.(),n.then(o=>{Ce.current=!1,o&&xe.current&&ve.current>=0?e():t?.()},e=>{throw Ce.current=!1,e})):(n?e:t)?.()},[]),Pe=useCallback(()=>new Promise(e=>{ve.current<0?Oe().then(e):He(()=>{Oe().then(e)},()=>e(!1))}),[Oe,He]),Be=useCallback(()=>{He(()=>{Ae()})},[Ae,He]);useImperativeHandle(t,()=>({expand:Ve,collapse:De,close:Ae,requestClose:Pe}),[Ve,De,Ae,Pe]),useEffect(()=>{"number"==typeof s&&s!==ie&&(-1===s?Ae():Ve(s))},[s]);const Ee=useRef({hostHeight:V,contentSnap:ee});useEffect(()=>{const e=Ee.current;e.hostHeight===V&&e.contentSnap===ee\|\|(Ee.current={hostHeight:V,contentSnap:ee},e.hostHeight===V&&le.value<0\|\|(re.value=withSpring(_e(le.value),SPRING_CONFIG)))},[V,ee]);const Ge=V-ne,Le=useMemo(()=>oe.map(e=>V-e),[oe,V]),Ne=useCallback(()=>{const e=ve.current;e<0\|\|Me(_e(e),e,e)},[Me,_e]),Fe=useCallback((e,t)=>{const o=le.value;-1!==e?(Ie(e),Me(t,o,e)):He(()=>{triggerHaptic("selection"),Ae()},Ne,Ne)},[Me,Ae,le,He,Ie,Ne]),Je=useMemo(()=>Gesture.Native().withTestId(j?`${j}-content-gesture`:"bottom-sheet-content-gesture"),[j]),ze=useMemo(()=>{const e=Le,t=se,o=Ge,s=l;return Gesture.Pan().withTestId(j?`${j}-pan-gesture`:"bottom-sheet-pan-gesture").activeOffsetY([-10,10]).failOffsetX([-15,15]).onStart(()=>{"worklet";ae.value=re.value}).onUpdate(e=>{"worklet";const t=ae.value+e.translationY;re.value=t<o?o+.25(t-o):t}).onEnd(o=>{"worklet";const n=re.value;if(o.velocityY>1e3)return s?void runOnJS(Fe)(-1,t):void runOnJS(Fe)(0,e[0]);let r=0,a=Math.abs(n-e[0]);for(let t=1;t<e.length;t++){const o=Math.abs(n-e[t]);o<a&&(a=o,r=t)}const l=e[0];s&&n-l>80?runOnJS(Fe)(-1,t):runOnJS(Fe)(r,e[r])})},[se,ae,l,Fe,Ge,Le,j,re]),{height:Ye}=useReanimatedKeyboardAnimation(),$e="shift"===p,qe=useDerivedValue(()=>$e?Ye.value:0),We=oe[ie>=0?ie:0]??ne,Ke=T.spacing.md,Xe=useAnimatedStyle(()=>{if(B){const e=qe.value,t=V+e-We-Ke,o=e<0&&re.value>t?t:re.value;return{top:o<N?N:o}}const e=re.value+qe.value,t=qe.value<0?N:Ge;return{top:e<t?t:e}}),Ue=useAnimatedStyle(()=>{const e=qe.value;if(B){const t=V+e-We-Ke,o=e<0&&re.value>t?t:re.value,s=V+e-Ke-(o<N?N:o);return{height:s<0?0:s>We?We:s}}const t=e<0?N:Ge,o=re.value+e,s=V+e-(o<t?t:o);return{height:s<0?0:s>ne?ne:s}}),Qe=ie>=0,Ze=useMemo(()=>buildStyles(T),[T]),et=useCallback(()=>{i&&He(()=>{triggerHaptic("selection"),Ae()})},[i,Ae,He]),tt=useMemo(()=>Gesture.Tap().withTestId(j?`${j}-backdrop-gesture`:"bottom-sheet-backdrop-gesture").maxDuration(250).onEnd((e,t)=>{"worklet";t&&runOnJS(et)()}),[et,j]),ot=useMemo(()=>({snapIndex:ie,snapPoints:oe,expand:Ve,collapse:De,close:Ae,requestClose:Pe}),[ie,oe,Ve,De,Ae,Pe]);if("inline"===S&&!Se)return null;if("modal"===S&&!me)return null;const st=_jsxs(View,{collapsable:!1,style:["modal"===S?Ze.backdropModal:Ze.backdropInline,{backgroundColor:T.colors.background.overlay}],onLayout:H,testID:j,accessibilityViewIsModal:I??Qe,children:[_jsx(GestureDetector,{gesture:tt,children:_jsx(Animated.View,{style:StyleSheet.absoluteFill,accessibilityRole:"button",accessibilityLabel:"Close bottom sheet"})}),_jsx(Animated.View,{accessibilityRole:"alert",accessibilityLabel:_,accessibilityViewIsModal:I??Qe,style:[Ze.sheet,{height:ne,backgroundColor:T.colors.background.elevated,borderTopLeftRadius:T.radius["2xl"],borderTopRightRadius:T.radius["2xl"],...smoothCorners,...T.shadows.xl},B?{height:We,left:(O-E)/2,right:void 0,width:E,borderBottomLeftRadius:T.radius["2xl"],borderBottomRightRadius:T.radius["2xl"]}:null,y,Xe],children:_jsxs(SheetBody,{style:[Ze.body,Ue],keyboardOffset:qe,children:[B?_jsx(View,{style:{height:T.spacing.md}}):_jsx(GestureDetector,{gesture:ze,children:_jsx(View,{style:Ze.handleRow,onLayout:J?Y:void 0,accessible:!0,accessibilityLabel:"Drag handle",accessibilityHint:"Drag up or down to resize the sheet, or swipe down to close it",testID:j?`${j}-handle`:"bottom-sheet-handle",children:_jsx(View,{style:[Ze.handle,{backgroundColor:T.components.bottomSheet?.handleColor??T.colors.border.primary},v]})})}),null!=w&&_jsx(View,{style:[Ze.header,x],onLayout:J?q:void 0,children:w}),c?_jsx(GestureDetector,{gesture:Je,children:_jsx(ScrollView,{ref:d,style:Ze.scrollContent,onScroll:h,onContentSizeChange:te,onLayout:f,scrollEventThrottle:b,keyboardShouldPersistTaps:"always",keyboardDismissMode:"none",children:R})}):_jsx(View,{style:Ze.content,children:J?_jsx(View,{onLayout:K,children:R}):R}),null!=C&&_jsx(View,{style:[Ze.footer,k],onLayout:J?Q:void 0,children:C})]})})]}),nt=_jsx(BottomSheetContext.Provider,{value:ot,children:st});return"modal"===S?_jsx(Modal,{transparent:!0,visible:de,onRequestClose:Be,onDismiss:"ios"===Platform.OS?Te:void 0,statusBarTranslucent:!0,navigationBarTranslucent:!0,animationType:"none",supportedOrientations:["portrait","landscape"],children:_jsxs(SafeAreaProvider,{style:Ze.modalRoot,children:[_jsx(InsetsProbe,{onChange:L}),"android"===Platform.OS?_jsx(GestureHandlerRootView,{style:Ze.modalRoot,children:nt}):nt,_jsx(ToastHost,{})]})}):nt}),InsetsProbe=({onChange:e})=>{const{top:t,bottom:o}=useSafeAreaInsets();return useEffect(()=>{e(e=>e.top===t&&e.bottom===o?e:{top:t,bottom:o})},[t,o,e]),null},SheetBody=({style:e,keyboardOffset:t,children:o})=>{const s=useSafeAreaInsets().bottom,n=useAnimatedStyle(()=>{const e=s+t.value;return{paddingBottom:e>0?e:0}});return _jsx(Animated.View,{style:[e,n],children:o})};BottomSheet.displayName="BottomSheet";const useMeasuredHeight=()=>{const[e,t]=useState(0),o=useCallback(e=>{t(t=>t===e?t:e)},[]);return[e,useCallback(e=>o(e.nativeEvent.layout.height),[o]),o]},resolveSnapPoints=(e,t,o)=>[...e.map(e=>{if("number"==typeof e)return e;if("content"===e)return o;const s=parseFloat(e);return Number.isNaN(s)?0:s/100*t})].sort((e,t)=>e-t),clamp=(e,t,o)=>Math.min(Math.max(e,t),o),buildStyles=e=>StyleSheet.create({backdropModal:{flex:1},backdropInline:{...StyleSheet.absoluteFill},sheet:{position:"absolute",left:0,right:0,overflow:"hidden"},body:{overflow:"hidden"},handleRow:{alignItems:"center",justifyContent:"center",alignSelf:"stretch",paddingTop:12,paddingBottom:24},header:{},footer:{},handle:{width:36,height:4,borderRadius:2,...smoothCorners},content:{flex:1,overflow:"hidden"},scrollContent:{flex:1},modalRoot:{flex:1}});export{BottomSheet};export default BottomSheet;
1	+ "use strict";import{createContext,forwardRef,useCallback,useContext,useEffect,useImperativeHandle,useMemo,useRef,useState}from"react";import{Dimensions,Modal,Platform,ScrollView,StyleSheet,useWindowDimensions,View}from"react-native";import{Gesture,GestureDetector,GestureHandlerRootView}from"react-native-gesture-handler";import{useReanimatedKeyboardAnimation}from"react-native-keyboard-controller";import Animated,{Easing,runOnJS,useAnimatedStyle,useDerivedValue,useSharedValue,withSpring,withTiming}from"react-native-reanimated";import{useSafeAreaInsets}from"react-native-safe-area-context";import{useTheme}from"../../theme/index.js";import{triggerHaptic}from"../../utils/index.js";import{smoothCorners}from"../../utils/corners.js";import{ModalSafeArea,useModalInsets}from"../ModalSafeArea/ModalSafeArea.js";import{ToastHost}from"../Toast/ToastProvider.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const TABLET_MIN_SHORT_SIDE=600,DIALOG_MAX_WIDTH=560,BottomSheetContext=createContext(null);export const useBottomSheet=()=>{const e=useContext(BottomSheetContext);if(!e)throw new Error("useBottomSheet must be used inside a <BottomSheet>.");return e};const SPRING_CONFIG={damping:20,stiffness:240,mass:1},CLOSE_VELOCITY_THRESHOLD=1e3,DRAG_ACTIVATION_OFFSET=10,BottomSheet=forwardRef((e,t)=>{const{snapPoints:o,index:s,onChange:n,onAnimate:r,onAfterClose:a,enablePanDownToClose:l=!0,enableBackdropPress:i=!0,confirmDismiss:u,scrollable:c=!1,scrollRef:d,onScroll:h,onContentSizeChange:m,onScrollLayout:f,scrollEventThrottle:b,keyboardBehavior:S="shift",mode:p="modal",presentation:g="sheet",handleIndicatorStyle:y,containerStyle:v,header:w,footer:x,headerStyle:C,footerStyle:k,children:R,accessibilityLabel:M,accessibilityViewIsModal:I,testID:_}=e,j=useTheme(),T=useSafeAreaInsets(),[V,D]=useState(()=>Dimensions.get("window").height),[O,A]=useState(()=>Dimensions.get("window").width),H=useCallback(e=>{const{height:t,width:o}=e.nativeEvent.layout;t>0&&D(e=>e===t?e:t),o>0&&A(e=>e===o?e:o)},[]),B=useWindowDimensions(),E="dialog"===g\|\|"auto"===g&&Math.min(B.width,B.height)>=600,P=Math.min(560,O-2j.spacing.xl),[G,L]=useModalInsets(),N="modal"===p?G.top:T.top,F="modal"===p?G.bottom:T.bottom,J=o.includes("content"),[z,Y]=useMeasuredHeight(),[$,q]=useMeasuredHeight(),[W,K,X]=useMeasuredHeight(),[U,Q]=useMeasuredHeight(),Z=E?j.spacing.md:z,ee=J?Math.min(Z+(null!=w?$:0)+W+(null!=x?U:0)+F,V-N):0,te=useCallback((e,t)=>{J&&X(t),m?.(e,t)},[J,m,X]),oe=useMemo(()=>resolveSnapPoints(o,V,ee),[o,V,ee]),se=V,ne=oe[oe.length-1]??0,re=useSharedValue(se),ae=useSharedValue(se),le=useSharedValue(-1),[ie,ue]=useState(-1),ce=useRef(!1),[de,he]=useState(!1),[me,fe]=useState(!1),be=useRef(!1),Se=useRef(a);Se.current=a;const[pe,ge]=useState(!1),ye=useRef(-1),ve=useRef(!1);ve.current="modal"===p?me:pe;const we=useRef(u);we.current=u;const xe=useRef(!1),Ce=useRef(!0),ke=useRef([]),Re=useCallback(e=>{const t=ke.current;ke.current=[];for(const o of t)o(e)},[]);useEffect(()=>(Ce.current=!0,()=>{Ce.current=!1,Re(!1)}),[Re]);const Me=useCallback(e=>{if(e<0\|\|e>=oe.length)return se;const t=oe[e];return E?(V-t)/2:V-t},[oe,V,se,E]),Ie=useCallback(e=>{ye.current=e;ie!==e&&(ue(e),le.value=e,n?.(e))},[ie,le,n]),je=useCallback(()=>{ce.current=!1,le.value<0&&(be.current=!0,"modal"===p?(he(!1),"ios"!==Platform.OS&&fe(!1)):ge(!1))},[p,le]),Te=useCallback(()=>{be.current&&fe(!1)},[]);useEffect(()=>{("modal"===p?!me:!pe)&&be.current&&(be.current=!1,Se.current?.(),Re(!0))},[p,me,pe,Re]);const Ve=useCallback((e,t,o)=>{ce.current=!0,r?.(t,o),re.value=withSpring(e,SPRING_CONFIG,e=>{"worklet";e&&runOnJS(je)()})},[r,re,je]),De=useCallback(e=>{const t="number"==typeof e?clamp(e,0,oe.length-1):ie>=0?ie:0,o=le.value,s=Me(t);be.current=!1,Re(!1),"modal"===p?(fe(!0),he(!0)):ge(!0),o<0&&(re.value=se),Ie(t),Ve(s,o,t)},[Ve,se,ie,le,p,oe.length,Ie,Re,re,Me]),Oe=useCallback(()=>{if(0===oe.length)return;const e=le.value,t=Me(0);Ie(0),Ve(t,e,0)},[Ve,le,oe.length,Ie,Me]),Ae=useCallback(()=>new Promise(e=>{if(ye.current<0)return void(ve.current?ke.current.push(e):e(!0));ke.current.push(e);const t=le.value;Ie(-1),ce.current=!0,r?.(t,-1),re.value=withTiming(se,{duration:j.motion.duration.fast,easing:Easing.bezier(...j.motion.easing.accelerate)},e=>{"worklet";e&&runOnJS(je)()})}),[se,le,je,r,Ie,re,j.motion.duration.fast,j.motion.easing.accelerate]),He=useCallback(async()=>{await Ae()},[Ae]),Be=useCallback((e,t,o)=>{const s=we.current;if(!s)return void e();if(xe.current)return void t?.();const n=s();"boolean"!=typeof n?(xe.current=!0,o?.(),n.then(o=>{xe.current=!1,o&&Ce.current&&ye.current>=0?e():t?.()},e=>{throw xe.current=!1,e})):(n?e:t)?.()},[]),Ee=useCallback(()=>new Promise(e=>{ye.current<0?Ae().then(e):Be(()=>{Ae().then(e)},()=>e(!1))}),[Ae,Be]),Pe=useCallback(()=>{Be(()=>{He()})},[He,Be]);useImperativeHandle(t,()=>({expand:De,collapse:Oe,close:He,requestClose:Ee}),[De,Oe,He,Ee]),useEffect(()=>{"number"==typeof s&&s!==ie&&(-1===s?He():De(s))},[s]);const Ge=useRef({hostHeight:V,contentSnap:ee});useEffect(()=>{const e=Ge.current;e.hostHeight===V&&e.contentSnap===ee\|\|(Ge.current={hostHeight:V,contentSnap:ee},e.hostHeight===V&&le.value<0\|\|(re.value=withSpring(Me(le.value),SPRING_CONFIG)))},[V,ee]);const Le=V-ne,Ne=useMemo(()=>oe.map(e=>V-e),[oe,V]),Fe=useCallback(()=>{const e=ye.current;e<0\|\|Ve(Me(e),e,e)},[Ve,Me]),Je=useCallback((e,t)=>{const o=le.value;-1!==e?(Ie(e),Ve(t,o,e)):Be(()=>{triggerHaptic("selection"),He()},Fe,Fe)},[Ve,He,le,Be,Ie,Fe]),ze=useMemo(()=>Gesture.Native().withTestId(_?`${_}-content-gesture`:"bottom-sheet-content-gesture"),[_]),Ye=useMemo(()=>{const e=Ne,t=se,o=Le,s=l;return Gesture.Pan().withTestId(_?`${_}-pan-gesture`:"bottom-sheet-pan-gesture").activeOffsetY([-10,10]).failOffsetX([-15,15]).onStart(()=>{"worklet";ae.value=re.value}).onUpdate(e=>{"worklet";const t=ae.value+e.translationY;re.value=t<o?o+.25(t-o):t}).onEnd(o=>{"worklet";const n=re.value;if(o.velocityY>1e3)return s?void runOnJS(Je)(-1,t):void runOnJS(Je)(0,e[0]);let r=0,a=Math.abs(n-e[0]);for(let t=1;t<e.length;t++){const o=Math.abs(n-e[t]);o<a&&(a=o,r=t)}const l=e[0];s&&n-l>80?runOnJS(Je)(-1,t):runOnJS(Je)(r,e[r])})},[se,ae,l,Je,Le,Ne,_,re]),{height:$e}=useReanimatedKeyboardAnimation(),qe="shift"===S,We=useDerivedValue(()=>qe?$e.value:0),Ke=oe[ie>=0?ie:0]??ne,Xe=j.spacing.md,Ue=useAnimatedStyle(()=>{if(E){const e=We.value,t=V+e-Ke-Xe,o=e<0&&re.value>t?t:re.value;return{top:o<N?N:o}}const e=re.value+We.value,t=We.value<0?N:Le;return{top:e<t?t:e}}),Qe=useAnimatedStyle(()=>{const e=We.value;if(E){const t=V+e-Ke-Xe,o=e<0&&re.value>t?t:re.value,s=V+e-Xe-(o<N?N:o);return{height:s<0?0:s>Ke?Ke:s}}const t=e<0?N:Le,o=re.value+e,s=V+e-(o<t?t:o);return{height:s<0?0:s>ne?ne:s}}),Ze=ie>=0,et=useMemo(()=>buildStyles(j),[j]),tt=useCallback(()=>{i&&Be(()=>{triggerHaptic("selection"),He()})},[i,He,Be]),ot=useMemo(()=>Gesture.Tap().withTestId(_?`${_}-backdrop-gesture`:"bottom-sheet-backdrop-gesture").maxDuration(250).onEnd((_e,e)=>{"worklet";e&&runOnJS(tt)()}),[tt,_]),st=useMemo(()=>({snapIndex:ie,snapPoints:oe,expand:De,collapse:Oe,close:He,requestClose:Ee}),[ie,oe,De,Oe,He,Ee]);if("inline"===p&&!pe)return null;if("modal"===p&&!me)return null;const nt=_jsxs(View,{collapsable:!1,style:["modal"===p?et.backdropModal:et.backdropInline,{backgroundColor:j.colors.background.overlay}],onLayout:H,testID:_,accessibilityViewIsModal:I??Ze,children:[_jsx(GestureDetector,{gesture:ot,children:_jsx(Animated.View,{style:StyleSheet.absoluteFill,accessibilityRole:"button",accessibilityLabel:"Close bottom sheet"})}),_jsx(Animated.View,{accessibilityRole:"alert",accessibilityLabel:M,accessibilityViewIsModal:I??Ze,style:[et.sheet,{height:ne,backgroundColor:j.colors.background.elevated,borderTopLeftRadius:j.radius["2xl"],borderTopRightRadius:j.radius["2xl"],...smoothCorners,...j.shadows.xl},E?{height:Ke,left:(O-P)/2,right:void 0,width:P,borderBottomLeftRadius:j.radius["2xl"],borderBottomRightRadius:j.radius["2xl"]}:null,v,Ue],children:_jsxs(SheetBody,{style:[et.body,Qe],keyboardOffset:We,children:[E?_jsx(View,{style:{height:j.spacing.md}}):_jsx(GestureDetector,{gesture:Ye,children:_jsx(View,{style:et.handleRow,onLayout:J?Y:void 0,accessible:!0,accessibilityLabel:"Drag handle",accessibilityHint:"Drag up or down to resize the sheet, or swipe down to close it",testID:_?`${_}-handle`:"bottom-sheet-handle",children:_jsx(View,{style:[et.handle,{backgroundColor:j.components.bottomSheet?.handleColor??j.colors.border.primary},y]})})}),null!=w&&_jsx(View,{style:[et.header,C],onLayout:J?q:void 0,children:w}),c?_jsx(GestureDetector,{gesture:ze,children:_jsx(ScrollView,{ref:d,style:et.scrollContent,onScroll:h,onContentSizeChange:te,onLayout:f,scrollEventThrottle:b,keyboardShouldPersistTaps:"always",keyboardDismissMode:"none",children:R})}):_jsx(View,{style:et.content,children:J?_jsx(View,{onLayout:K,children:R}):R}),null!=x&&_jsx(View,{style:[et.footer,k],onLayout:J?Q:void 0,children:x})]})})]}),rt=_jsx(BottomSheetContext.Provider,{value:st,children:nt});return"modal"===p?_jsx(Modal,{transparent:!0,visible:de,onRequestClose:Pe,onDismiss:"ios"===Platform.OS?Te:void 0,statusBarTranslucent:!0,navigationBarTranslucent:!0,animationType:"none",supportedOrientations:["portrait","landscape"],children:_jsxs(ModalSafeArea,{onInsets:L,children:["android"===Platform.OS?_jsx(GestureHandlerRootView,{style:et.modalRoot,children:rt}):rt,_jsx(ToastHost,{})]})}):rt}),SheetBody=({style:e,keyboardOffset:t,children:o})=>{const s=useSafeAreaInsets().bottom,n=useAnimatedStyle(()=>{const e=s+t.value;return{paddingBottom:e>0?e:0}});return _jsx(Animated.View,{style:[e,n],children:o})};BottomSheet.displayName="BottomSheet";const useMeasuredHeight=()=>{const[e,t]=useState(0),o=useCallback(e=>{t(t=>t===e?t:e)},[]);return[e,useCallback(e=>o(e.nativeEvent.layout.height),[o]),o]},resolveSnapPoints=(e,t,o)=>[...e.map(e=>{if("number"==typeof e)return e;if("content"===e)return o;const s=parseFloat(e);return Number.isNaN(s)?0:s/100*t})].sort((e,t)=>e-t),clamp=(e,t,o)=>Math.min(Math.max(e,t),o),buildStyles=e=>StyleSheet.create({backdropModal:{flex:1},backdropInline:{...StyleSheet.absoluteFill},sheet:{position:"absolute",left:0,right:0,overflow:"hidden"},body:{overflow:"hidden"},handleRow:{alignItems:"center",justifyContent:"center",alignSelf:"stretch",paddingTop:12,paddingBottom:24},header:{},footer:{},handle:{width:36,height:4,borderRadius:2,...smoothCorners},content:{flex:1,overflow:"hidden"},scrollContent:{flex:1},modalRoot:{flex:1}});export{BottomSheet};export default BottomSheet;

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

	@@ -1 +1 @@
1	- "use strict";import React,{forwardRef,useMemo}from"react";import{Animated,Image,Pressable,StyleSheet,View}from"react-native";import{useControllableState}from"../../hooks/useControllableState.js";import{usePressAnimation}from"../../hooks/usePressAnimation.js";import{Gradient,useTheme}from"../../theme/index.js";import{smoothCorners}from"../../utils/corners.js";import{resolveHaptic,triggerHaptic}from"../../utils/hapticUtils.js";import{mergeRefs}from"../../utils/mergeRefs.js";import{supportsBoxShadow,toBoxShadow}from"../../utils/shadows.js";import{squircleHostRadius}from"../../utils/squircle.js";import{AppIcon}from"../AppIcon/AppIcon.js";import{useContextMenu}from"../Menu/useContextMenu.js";import{Skeleton,SkeletonText}from"../Skeleton/index.js";import{SquircleFill,useSquircle}from"../SquircleFill/SquircleFill.js";import{Text}from"../Text/index.js";import{jsx as _jsx,jsxs as _jsxs,Fragment as _Fragment}from"react/jsx-runtime";const paddingMap={none:"none",sm:"sm",md:"lg",lg:"xl",xl:"2xl"},Card=forwardRef((e,t)=>{const{children:o,variant:i="elevated",elevation:r="sm",radius:s="lg",padding:l="md",interactive:a=!1,bg:n,header:d,title:c,lead:u,action:h,headerActions:m,collapsible:p=!1,collapsed:g,defaultCollapsed:b=!1,onCollapsedChange:y,collapsedSummary:x,onRemove:f,removeLabel:S="Remove",separatorHeight:v=StyleSheet.hairlineWidth,footer:j,imageSource:w,imageHeight:C=160,imageAspectRatio:_,imageOverlay:R,loading:k=!1,gradient:A,onPress:T,haptic:B,contextMenu:H,accessibilityLabel:I,accessibilityHint:L,accessibilityRole:P,style:V,containerStyle:F,headerStyle:M,bodyStyle:z,footerStyle:q,borderRadius:W,testID:D,onLayout:O,...E}=e,N=useTheme(),G=a\|\|"function"==typeof T,$=useContextMenu(H,{haptic:B,testID:D,accessibilityActions:E.accessibilityActions,onAccessibilityAction:E.onAccessibilityAction}),U=useMemo(()=>mergeRefs(t,$.hostRef),[t,$.hostRef]),J=G\|\|$.enabled,{scale:K,pressIn:Q,pressOut:X}=usePressAnimation({enabled:J}),Y=useMemo(()=>buildStyles(N),[N]),Z=Boolean(w),ee=N.spacing[paddingMap[l]],te=useMemo(()=>A?"string"==typeof A?N.gradients[A]??null:A:null,[A,N.gradients]),oe="flat"===i,ie=oe?0:W??N.radius[s],re=resolveBackground(N,n),[se,le]=useControllableState({value:g,defaultValue:b,onChange:y}),ae=p&&se,ne=hasBuiltInHeaderContent(e),de=Boolean(d)\|\|ne,ce=useSquircle(!Z&&!te&&!oe,ie,O),ue=StyleSheet.flatten([V,F])??{},he=ue.backgroundColor,me=ue.borderColor,pe=he??re??("filled"===i?N.colors.background.secondary:N.colors.background.elevated),ge="outlined"===i?N.colors.border.width:0,be=me??N.colors.border.primary,ye="elevated"===i&&supportsBoxShadow()?toBoxShadow(N.shadows[r]):void 0,xe=ce.active&&"elevated"===i&&!ye,fe=ce.active&&!xe?{backgroundColor:"transparent",borderColor:"transparent"}:null,Se=useMemo(()=>{const e={borderRadius:xe&&ce.size?squircleHostRadius(ce.size.width,ce.size.height,ie):ie,...smoothCorners,padding:Z?0:ee,overflow:ce.active?"visible":"hidden"};switch(i){case"flat":return{...e,backgroundColor:re??N.colors.background.elevated,borderBottomWidth:v,borderBottomColor:N.colors.border.primary};case"outlined":return{...e,backgroundColor:ce.active?"transparent":re??N.colors.background.elevated,borderWidth:N.colors.border.width,borderColor:ce.active?"transparent":N.colors.border.primary};case"filled":return{...e,backgroundColor:ce.active?"transparent":re??N.colors.background.secondary};default:return{...e,backgroundColor:re??N.colors.background.elevated,...ye?{boxShadow:ye}:N.shadows[r]}}},[N,i,r,ie,Z,ee,ce.active,ce.size,ye,xe,re,v]),ve=useMemo(()=>({..."number"==typeof _?{width:"100%",aspectRatio:_}:{width:"100%",height:C},borderTopLeftRadius:ie,borderTopRightRadius:ie,borderBottomLeftRadius:0,borderBottomRightRadius:0,...smoothCorners}),[ie,_,C]),je="string"==typeof c?c:"",we=_jsxs(_Fragment,{children:[_jsxs(View,{style:Y.titleColumn,children:["string"==typeof c?_jsx(Text,{variant:"title",accessibilityRole:"header",children:c}):c,u?_jsx(Text,{variant:"bodySmall",style:Y.lead,children:u}):null,ae&&x?_jsx(Text,{variant:"caption",style:Y.lead,children:x}):null]}),isCardTextAction(h)?_jsx(CardTextActionButton,{action:h,haptic:B}):h?_jsx(View,{style:Y.actionNode,children:h}):null,m,p?_jsx(CardIconAction,{icon:ae?"chevron-down":"chevron-up",label:`${ae?"Show":"Hide"} ${je}`.trim(),expanded:!ae,onPress:()=>le(!ae),haptic:B}):null,f?_jsx(CardIconAction,{icon:"trash",label:S,onPress:f,color:N.colors.toneText.error,haptic:B}):null]}),Ce=_jsxs(_Fragment,{children:[de?_jsx(View,{style:[Y.header,!d&&Y.headerRow,ae&&Y.headerFolded,M],children:d??we}):null,ae?null:_jsx(View,{style:[de\|\|j?Y.body:null,z],children:o}),j&&!ae?_jsx(View,{style:[Y.footer,q],children:j}):null]}),_e=Z?_jsxs(_Fragment,{children:[_jsxs(View,{style:Y.imageWrapper,children:[_jsx(Image,{source:w,resizeMode:"cover",style:ve,accessibilityLabel:"",accessible:!1}),R?_jsx(View,{pointerEvents:"box-none",style:Y.imageOverlay,children:R}):null]}),_jsx(View,{style:{padding:ee},children:Ce})]}):Ce,Re=te?_jsxs(_Fragment,{children:[_jsx(Gradient,{gradient:te,style:StyleSheet.absoluteFill}),_e]}):ce.active&&ce.size?_jsxs(_Fragment,{children:[_jsx(SquircleFill,{width:ce.size.width,height:ce.size.height,radius:ie,fill:pe,stroke:ge?be:void 0,strokeWidth:ge,outset:ge}),_e]}):_e;let ke;if(J){const handlePress=e=>{if(!G)return;const t=resolveHaptic(B,"selection");t&&triggerHaptic(t),T?.(e)};ke=_jsx(Animated.View,{style:[{transform:[{scale:K}]}],children:_jsx(Pressable,{ref:U,onPress:handlePress,onPressIn:Q,onPressOut:X,android_ripple:{color:N.colors.surface.pressed,borderless:!1},accessibilityRole:P??(G?"button":void 0),accessibilityLabel:I,accessibilityHint:L,testID:D,onLayout:ce.onLayout,style:[Se,V,F,fe],...E,...$.hostProps,children:Re})})}else ke=_jsx(View,{ref:t,accessibilityLabel:I,accessibilityHint:L,accessibilityRole:P,testID:D,onLayout:ce.onLayout,style:[Se,V,F,fe],...E,children:Re});return k?_jsx(CardSkeleton,{...e}):$.enabled?_jsxs(_Fragment,{children:[ke,$.renderSurface(_jsx(View,{style:[Se,V,F,fe,Y.preview],children:Re}))]}):ke});Card.displayName="Card";const CardSkeleton=({variant:e="elevated",elevation:t,radius:o="lg",padding:i="md",bg:r,header:s,footer:l,imageSource:a,imageHeight:n=160,imageAspectRatio:d,borderRadius:c,containerStyle:u,headerStyle:h,bodyStyle:m,footerStyle:p,style:g,...b})=>{const y=useTheme(),x=paddingMap[i],f=y.spacing[x],S="flat"===e?0:c??y.radius[o],v=void 0!==s\|\|hasBuiltInHeaderContent(b),j=resolveBackground(y,r)??y.colors.background.elevated,w="outlined"===e?1:0,C="outlined"===e?y.colors.border.primary:void 0;return _jsxs(View,{style:[{backgroundColor:j,borderRadius:S,...smoothCorners,borderWidth:w,borderColor:C,overflow:"hidden"},u,g],accessibilityRole:"progressbar",accessibilityLabel:"Loading",accessibilityState:{busy:!0},"aria-busy":!0,children:[void 0!==a?_jsx(Skeleton,{width:"100%",height:d?void 0:n,style:d?{aspectRatio:d,width:"100%"}:void 0}):null,v?_jsx(View,{style:[{padding:f,paddingBottom:y.spacing.sm},h],children:_jsx(Skeleton,{shape:"text",width:"60%",height:18})}):null,_jsx(View,{style:[{padding:f},m],children:_jsx(SkeletonText,{lines:3,fontSize:14,lastLineWidth:"55%"})}),void 0!==l?_jsx(View,{style:[{padding:f,paddingTop:y.spacing.sm,flexDirection:"row"},p],children:_jsx(Skeleton,{width:88,height:32,shape:"rounded"})}):null]})};CardSkeleton.displayName="CardSkeleton",Card.Skeleton=CardSkeleton;const hasBuiltInHeaderContent=e=>Boolean(e.title\|\|e.lead\|\|e.action\|\|e.headerActions\|\|e.collapsible\|\|e.onRemove),isCardTextAction=e=>"object"==typeof e&&null!==e&&!React.isValidElement(e)&&"label"in e&&"onPress"in e,HIT_TARGET=44,CardIconAction=({icon:e,label:t,onPress:o,expanded:i,color:r,haptic:s})=>{const l=useTheme();return _jsx(Pressable,{accessibilityRole:"button",accessibilityLabel:t,accessibilityState:void 0===i?void 0:{expanded:i},"aria-expanded":i,onPress:()=>{const e=resolveHaptic(s,"selection");e&&triggerHaptic(e),o()},style:iconActionStyle,children:_jsx(AppIcon,{name:e,size:20,color:r??l.colors.text.primary})})},CardTextActionButton=({action:e,haptic:t})=>{const o=useTheme();return _jsx(Pressable,{accessibilityRole:"button",accessibilityLabel:e.accessibilityLabel??e.label,onPress:()=>{const o=resolveHaptic(t,"selection");o&&triggerHaptic(o),e.onPress()},style:textActionStyle,children:_jsx(Text,{variant:"label",weight:"semibold",color:o.colors.primary,children:e.label})})},iconActionStyle={width:44,height:44,alignItems:"center",justifyContent:"center"},textActionStyle={minWidth:44,minHeight:44,alignItems:"center",justifyContent:"center"},resolveBackground=(e,t)=>{if(null==t)return;return e.colors.background[t]??t},buildStyles=e=>StyleSheet.create({header:{marginBottom:e.spacing.md},headerRow:{flexDirection:"row",alignItems:"center",gap:e.spacing.sm},headerFolded:{marginBottom:0},titleColumn:{flex:1},lead:{marginTop:e.spacing.xs},actionNode:{flexShrink:0},body:{flexShrink:1},footer:{marginTop:e.spacing.md},imageWrapper:{position:"relative"},imageOverlay:{...StyleSheet.absoluteFill},preview:{margin:0,marginTop:0,marginBottom:0,marginLeft:0,marginRight:0,marginStart:0,marginEnd:0,marginHorizontal:0,marginVertical:0,position:"relative",top:0,left:0,width:"100%",height:"100%"}});export{Card};export default Card;
1	+ "use strict";import React,{forwardRef,useMemo}from"react";import{Animated,Image,Pressable,StyleSheet,View}from"react-native";import{useControllableState}from"../../hooks/useControllableState.js";import{usePressAnimation}from"../../hooks/usePressAnimation.js";import{Gradient,useTheme}from"../../theme/index.js";import{smoothCorners}from"../../utils/corners.js";import{resolveHaptic,triggerHaptic}from"../../utils/hapticUtils.js";import{mergeRefs}from"../../utils/mergeRefs.js";import{supportsBoxShadow,toBoxShadow}from"../../utils/shadows.js";import{squircleHostRadius}from"../../utils/squircle.js";import{AppIcon}from"../AppIcon/AppIcon.js";import{useContextMenu}from"../Menu/useContextMenu.js";import{Skeleton,SkeletonText}from"../Skeleton/index.js";import{SquircleFill,useSquircle}from"../SquircleFill/SquircleFill.js";import{Text}from"../Text/index.js";import{jsx as _jsx,jsxs as _jsxs,Fragment as _Fragment}from"react/jsx-runtime";const paddingMap={none:"none",sm:"sm",md:"lg",lg:"xl",xl:"2xl"},Card=forwardRef((e,t)=>{const{children:o,variant:i="elevated",elevation:r="sm",radius:s="lg",padding:l="md",interactive:a=!1,bg:n,header:d,title:c,lead:u,action:h,headerActions:m,collapsible:p=!1,collapsed:g,defaultCollapsed:b=!1,onCollapsedChange:y,collapsedSummary:x,onRemove:f,removeLabel:S="Remove",separatorHeight:v=StyleSheet.hairlineWidth,footer:j,imageSource:w,imageHeight:C=160,imageAspectRatio:_,imageOverlay:R,loading:k=!1,gradient:A,onPress:T,haptic:B,contextMenu:H,accessibilityLabel:I,accessibilityHint:L,accessibilityRole:P,style:V,containerStyle:F,headerStyle:M,bodyStyle:z,footerStyle:q,borderRadius:W,testID:D,onLayout:O,...E}=e,N=useTheme(),G=a\|\|"function"==typeof T,$=useContextMenu(H,{haptic:B,testID:D,accessibilityActions:E.accessibilityActions,onAccessibilityAction:E.onAccessibilityAction}),U=useMemo(()=>mergeRefs(t,$.hostRef),[t,$.hostRef]),J=G\|\|$.enabled,{scale:K,pressIn:Q,pressOut:X}=usePressAnimation({enabled:J}),Y=useMemo(()=>buildStyles(N),[N]),Z=Boolean(w),ee=N.spacing[paddingMap[l]],te=useMemo(()=>A?"string"==typeof A?N.gradients[A]??null:A:null,[A,N.gradients]),oe="flat"===i,ie=oe?0:W??N.radius[s],re=resolveBackground(N,n),[se,le]=useControllableState({value:g,defaultValue:b,onChange:y}),ae=p&&se,ne=hasBuiltInHeaderContent(e),de=Boolean(d)\|\|ne,ce=useSquircle(!Z&&!te&&!oe,ie,O),ue=StyleSheet.flatten([V,F])??{},he=ue.backgroundColor,me=ue.borderColor,pe=he??re??("filled"===i?N.colors.background.secondary:N.colors.background.elevated),ge="outlined"===i?N.colors.border.width:0,be=me??N.colors.border.primary,ye="elevated"===i&&supportsBoxShadow()?toBoxShadow(N.shadows[r]):void 0,xe=ce.active&&"elevated"===i&&!ye,fe=ce.active&&!xe?{backgroundColor:"transparent",borderColor:"transparent"}:null,Se=useMemo(()=>{const e={borderRadius:xe&&ce.size?squircleHostRadius(ce.size.width,ce.size.height,ie):ie,...smoothCorners,padding:Z?0:ee,overflow:ce.active?"visible":"hidden"};switch(i){case"flat":return{...e,backgroundColor:re??N.colors.background.elevated,borderBottomWidth:v,borderBottomColor:N.colors.border.primary};case"outlined":return{...e,backgroundColor:ce.active?"transparent":re??N.colors.background.elevated,borderWidth:N.colors.border.width,borderColor:ce.active?"transparent":N.colors.border.primary};case"filled":return{...e,backgroundColor:ce.active?"transparent":re??N.colors.background.secondary};default:return{...e,backgroundColor:re??N.colors.background.elevated,...ye?{boxShadow:ye}:N.shadows[r]}}},[N,i,r,ie,Z,ee,ce.active,ce.size,ye,xe,re,v]),ve=useMemo(()=>({..."number"==typeof _?{width:"100%",aspectRatio:_}:{width:"100%",height:C},borderTopLeftRadius:ie,borderTopRightRadius:ie,borderBottomLeftRadius:0,borderBottomRightRadius:0,...smoothCorners}),[ie,_,C]),je="string"==typeof c?c:"",we=_jsxs(_Fragment,{children:[_jsxs(View,{style:Y.titleColumn,children:["string"==typeof c?_jsx(Text,{variant:"title",accessibilityRole:"header",children:c}):c,u?_jsx(Text,{variant:"bodySmall",style:Y.lead,children:u}):null,ae&&x?_jsx(Text,{variant:"caption",style:Y.lead,children:x}):null]}),isCardTextAction(h)?_jsx(CardTextActionButton,{action:h,haptic:B}):h?_jsx(View,{style:Y.actionNode,children:h}):null,m,p?_jsx(CardIconAction,{icon:ae?"chevron-down":"chevron-up",label:`${ae?"Show":"Hide"} ${je}`.trim(),expanded:!ae,onPress:()=>le(!ae),haptic:B}):null,f?_jsx(CardIconAction,{icon:"trash",label:S,onPress:f,color:N.colors.toneText.error,haptic:B}):null]}),Ce=_jsxs(_Fragment,{children:[de?_jsx(View,{style:[Y.header,!d&&Y.headerRow,ae&&Y.headerFolded,M],children:d??we}):null,ae?null:_jsx(View,{style:[de\|\|j?Y.body:null,z],children:o}),j&&!ae?_jsx(View,{style:[Y.footer,q],children:j}):null]}),Re=Z?_jsxs(_Fragment,{children:[_jsxs(View,{style:Y.imageWrapper,children:[_jsx(Image,{source:w,resizeMode:"cover",style:ve,accessibilityLabel:"",accessible:!1}),R?_jsx(View,{pointerEvents:"box-none",style:Y.imageOverlay,children:R}):null]}),_jsx(View,{style:{padding:ee},children:Ce})]}):Ce,ke=te?_jsxs(_Fragment,{children:[_jsx(Gradient,{gradient:te,style:StyleSheet.absoluteFill}),Re]}):ce.active&&ce.size?_jsxs(_Fragment,{children:[_jsx(SquircleFill,{width:ce.size.width,height:ce.size.height,radius:ie,fill:pe,stroke:ge?be:void 0,strokeWidth:ge,outset:ge}),Re]}):Re;let Ae;if(J){const handlePress=e=>{if(!G)return;const t=resolveHaptic(B,"selection");t&&triggerHaptic(t),T?.(e)};Ae=_jsx(Animated.View,{style:[{transform:[{scale:K}]}],children:_jsx(Pressable,{ref:U,onPress:handlePress,onPressIn:Q,onPressOut:X,android_ripple:{color:N.colors.surface.pressed,borderless:!1},accessibilityRole:P??(G?"button":void 0),accessibilityLabel:I,accessibilityHint:L,testID:D,onLayout:ce.onLayout,style:[Se,V,F,fe],...E,...$.hostProps,children:ke})})}else Ae=_jsx(View,{ref:t,accessibilityLabel:I,accessibilityHint:L,accessibilityRole:P,testID:D,onLayout:ce.onLayout,style:[Se,V,F,fe],...E,children:ke});return k?_jsx(CardSkeleton,{...e}):$.enabled?_jsxs(_Fragment,{children:[Ae,$.renderSurface(_jsx(View,{style:[Se,V,F,fe,Y.preview],children:ke}))]}):Ae});Card.displayName="Card";const CardSkeleton=({variant:e="elevated",elevation:t,radius:o="lg",padding:i="md",bg:r,header:s,footer:l,imageSource:a,imageHeight:n=160,imageAspectRatio:d,borderRadius:c,containerStyle:u,headerStyle:h,bodyStyle:m,footerStyle:p,style:g,...b})=>{const y=useTheme(),x=paddingMap[i],f=y.spacing[x],S="flat"===e?0:c??y.radius[o],v=void 0!==s\|\|hasBuiltInHeaderContent(b),j=resolveBackground(y,r)??y.colors.background.elevated,w="outlined"===e?1:0,C="outlined"===e?y.colors.border.primary:void 0;return _jsxs(View,{style:[{backgroundColor:j,borderRadius:S,...smoothCorners,borderWidth:w,borderColor:C,overflow:"hidden"},u,g],accessibilityRole:"progressbar",accessibilityLabel:"Loading",accessibilityState:{busy:!0},"aria-busy":!0,children:[void 0!==a?_jsx(Skeleton,{width:"100%",height:d?void 0:n,style:d?{aspectRatio:d,width:"100%"}:void 0}):null,v?_jsx(View,{style:[{padding:f,paddingBottom:y.spacing.sm},h],children:_jsx(Skeleton,{shape:"text",width:"60%",height:18})}):null,_jsx(View,{style:[{padding:f},m],children:_jsx(SkeletonText,{lines:3,fontSize:14,lastLineWidth:"55%"})}),void 0!==l?_jsx(View,{style:[{padding:f,paddingTop:y.spacing.sm,flexDirection:"row"},p],children:_jsx(Skeleton,{width:88,height:32,shape:"rounded"})}):null]})};CardSkeleton.displayName="CardSkeleton",Card.Skeleton=CardSkeleton;const hasBuiltInHeaderContent=e=>Boolean(e.title\|\|e.lead\|\|e.action\|\|e.headerActions\|\|e.collapsible\|\|e.onRemove),isCardTextAction=e=>"object"==typeof e&&null!==e&&!React.isValidElement(e)&&"label"in e&&"onPress"in e,HIT_TARGET=44,CardIconAction=({icon:e,label:t,onPress:o,expanded:i,color:r,haptic:s})=>{const l=useTheme();return _jsx(Pressable,{accessibilityRole:"button",accessibilityLabel:t,accessibilityState:void 0===i?void 0:{expanded:i},"aria-expanded":i,onPress:()=>{const e=resolveHaptic(s,"selection");e&&triggerHaptic(e),o()},style:iconActionStyle,children:_jsx(AppIcon,{name:e,size:20,color:r??l.colors.text.primary})})},CardTextActionButton=({action:e,haptic:t})=>{const o=useTheme();return _jsx(Pressable,{accessibilityRole:"button",accessibilityLabel:e.accessibilityLabel??e.label,onPress:()=>{const o=resolveHaptic(t,"selection");o&&triggerHaptic(o),e.onPress()},style:textActionStyle,children:_jsx(Text,{variant:"label",weight:"semibold",color:o.colors.primary,children:e.label})})},iconActionStyle={width:44,height:44,alignItems:"center",justifyContent:"center"},textActionStyle={minWidth:44,minHeight:44,alignItems:"center",justifyContent:"center"},resolveBackground=(e,t)=>{if(null==t)return;return e.colors.background[t]??t},buildStyles=e=>StyleSheet.create({header:{marginBottom:e.spacing.md},headerRow:{flexDirection:"row",alignItems:"center",gap:e.spacing.sm},headerFolded:{marginBottom:0},titleColumn:{flex:1},lead:{marginTop:e.spacing.xs},actionNode:{flexShrink:0},body:{flexShrink:1},footer:{marginTop:e.spacing.md},imageWrapper:{position:"relative"},imageOverlay:{...StyleSheet.absoluteFill},preview:{margin:0,marginTop:0,marginBottom:0,marginLeft:0,marginRight:0,marginStart:0,marginEnd:0,marginHorizontal:0,marginVertical:0,position:"relative",top:0,left:0,width:"100%",height:"100%"}});export{Card};export default Card;

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

	@@ -1 +1 @@
1	- "use strict";import{useCallback,useEffect,useMemo,useRef,useState}from"react";import{AccessibilityInfo,Animated,Easing,Modal,Pressable,StyleSheet,Text,View}from"react-native";import{GestureDetector,GestureHandlerRootView}from"react-native-gesture-handler";import{useSafeAreaInsets}from"react-native-safe-area-context";import{useDragToDismiss}from"../../hooks/useDragToDismiss.js";import{createAnimatedValue,setNativeValue,useTheme}from"../../theme/index.js";import{resolveHaptic,triggerHaptic}from"../../utils/index.js";import{smoothCorners}from"../../utils/corners.js";import{defaultIcons}from"../AppIcon/defaultIcons.js";import{PickerTrigger}from"../PickerTrigger/index.js";import{ToastHost}from"../Toast/ToastProvider.js";import{jsx as _jsx,jsxs as _jsxs,Fragment as _Fragment}from"react/jsx-runtime";const GRID_SIZE=12,DECADE_SPAN=10,startOfDay=e=>new Date(e.getFullYear(),e.getMonth(),e.getDate()),isSameDay=(e,t)=>e.getFullYear()===t.getFullYear()&&e.getMonth()===t.getMonth()&&e.getDate()===t.getDate(),toIso=e=>`${e.getFullYear()}-${String(e.getMonth()+1).padStart(2,"0")}-${String(e.getDate()).padStart(2,"0")}`,addMonths=(e,t)=>new Date(e.getFullYear(),e.getMonth()+t,1),buildMonthMatrix=(e,t)=>{const a=e.getFullYear(),r=e.getMonth(),i=(new Date(a,r,1).getDay()-t+7)%7,s=[];for(let e=0;e<42;e+=1){const t=new Date(a,r,1-i+e);s.push({date:t,inMonth:t.getMonth()===r,iso:toIso(t)})}return s},weekdayLabels=(e,t)=>{const a=new Intl.DateTimeFormat(e,{weekday:"short"}),r=[];for(let e=0;e<7;e+=1){const i=new Date(1970,0,4+(t+e)%7);r.push(a.format(i))}return r},formatMonthYear=(e,t)=>new Intl.DateTimeFormat(t,{month:"long",year:"numeric"}).format(e),formatLongDate=(e,t)=>new Intl.DateTimeFormat(t,{weekday:"long",year:"numeric",month:"long",day:"numeric"}).format(e),decadeStartFor=e=>10Math.floor(e/10),buildYearCells=e=>{const t=e-4;return Array.from({length:12},(e,a)=>t+a)},buildDecadeCells=e=>{const t=decadeStartFor(e)-40;return Array.from({length:12},(e,a)=>t+10a)},DatePicker=e=>{const{value:t,onChange:a,onClose:r,minDate:i,maxDate:s,disabledDates:o,mode:n="modal",locale:l="en-IN",weekStartsOn:c=0,title:d="Select Date",confirmLabel:u="Confirm",cancelLabel:g="Cancel",style:m,containerStyle:y,headerLabelStyle:p,navButtonStyle:h,footerButtonStyle:f,haptic:b,testID:x,label:D,placeholder:w,helperText:v,error:C,required:S,disabled:j,size:k,variant:P,clearable:T,onClear:V,formatValue:_,triggerStyle:R}=e,A=void 0!==e.visible,[I,M]=useState(!1),F=A?e.visible:I,L=A?x:x?`${x}-calendar`:void 0,B=useTheme(),Y=useSafeAreaInsets(),z=useMemo(()=>buildStyles(B),[B]),[H,N]=useState(()=>startOfDay(new Date));useEffect(()=>{F&&N(startOfDay(new Date))},[F]);const $=t?startOfDay(t):H,[W,E]=useState($),[O,G]=useState(t?startOfDay(t):null),[q,X]=useState("days"),Z=useRef(createAnimatedValue(0)).current,J=useRef(createAnimatedValue(0)).current,K=useRef(createAnimatedValue(0)).current,Q=useRef(0),U=useRef(createAnimatedValue(0)).current,ee=useRef(createAnimatedValue(1)).current,te=useRef(createAnimatedValue(1)).current,ae=useRef(createAnimatedValue(1)).current,re=useRef(createAnimatedValue(1)).current,ie=useRef(createAnimatedValue(1)).current;useEffect(()=>{if(t){const e=startOfDay(t);G(e),E(e)}else G(null)},[t]),useEffect(()=>{if("modal"===n&&F){Z.setValue(0),setNativeValue(J,0),setNativeValue(K,0);const e=Animated.parallel([Animated.timing(Z,{toValue:1,duration:B.motion.duration.normal,easing:Easing.out(Easing.cubic),useNativeDriver:!1}),Animated.spring(J,{toValue:1,damping:B.motion.spring.gentle.damping,stiffness:B.motion.spring.gentle.stiffness,mass:B.motion.spring.gentle.mass,useNativeDriver:!0})]);return e.start(),()=>e.stop()}},[F,n,Z,J,K,B.motion]);const se=useMemo(()=>{const e=new Set;return o?.forEach(t=>e.add(toIso(startOfDay(t)))),e},[o]),oe=useMemo(()=>i?startOfDay(i):null,[i]),ne=useMemo(()=>s?startOfDay(s):null,[s]),le=useCallback(e=>!!(oe&&e.getTime()<oe.getTime())\|\|(!!(ne&&e.getTime()>ne.getTime())\|\|!!se.has(toIso(e))),[oe,ne,se]),ce=useMemo(()=>buildMonthMatrix(W,c),[W,c]),de=useMemo(()=>buildYearCells(W.getFullYear()),[W]),ue=useMemo(()=>buildDecadeCells(W.getFullYear()),[W]),ge=useMemo(()=>weekdayLabels(l,c),[l,c]),me=useMemo(()=>{if("days"===q)return formatMonthYear(W,l);if("years"===q){return`${de[0]} - ${de[de.length-1]}`}return`${ue[0]} - ${ue[ue.length-1]+9}`},[W,ue,l,q,de]),ye=useCallback(e=>!!(oe&&e<oe.getFullYear())\|\|!!(ne&&e>ne.getFullYear()),[oe,ne]),pe=useCallback(e=>!!(oe&&e+10-1<oe.getFullYear())\|\|!!(ne&&e>ne.getFullYear()),[oe,ne]),he=useCallback(e=>{!1!==b&&triggerHaptic("impactLight");const t=e>0?1:-1,a=B.components.datePicker?.monthSlideDistance??32,r=B.components.datePicker?.monthSlideOutDuration??B.motion.duration.fast??140,i=B.components.datePicker?.monthSlideInDuration??B.motion.duration.fast??160;Animated.sequence([Animated.parallel([Animated.timing(U,{toValue:-ta,duration:r,easing:Easing.out(Easing.quad),useNativeDriver:!0}),Animated.timing(ee,{toValue:0,duration:r,useNativeDriver:!0})]),Animated.timing(U,{toValue:ta,duration:0,useNativeDriver:!0}),Animated.parallel([Animated.timing(U,{toValue:0,duration:i,easing:Easing.out(Easing.cubic),useNativeDriver:!0}),Animated.timing(ee,{toValue:1,duration:i,useNativeDriver:!0})])]).start();const s=addMonths(W,e);E(s),AccessibilityInfo.announceForAccessibility(formatMonthYear(s,l))},[W,b,l,ee,U,B.components.datePicker,B.motion.duration.fast]),fe=useCallback(()=>{"days"!==q?(!1!==b&&triggerHaptic("impactLight"),E("years"===q?e=>new Date(e.getFullYear()-12,e.getMonth(),1):e=>new Date(e.getFullYear()-120,e.getMonth(),1))):he(-1)},[he,q,b]),be=useCallback(()=>{"days"!==q?(!1!==b&&triggerHaptic("impactLight"),E("years"===q?e=>new Date(e.getFullYear()+12,e.getMonth(),1):e=>new Date(e.getFullYear()+120,e.getMonth(),1))):he(1)},[he,q,b]),xe=useCallback(()=>{const e=B.components.datePicker?.viewTransitionDuration??B.motion.duration.normal??200;setNativeValue(ae,0),setNativeValue(re,.9),Animated.parallel([Animated.timing(ae,{toValue:1,duration:e,easing:Easing.out(Easing.cubic),useNativeDriver:!0}),Animated.timing(re,{toValue:1,duration:e,easing:Easing.out(Easing.cubic),useNativeDriver:!0})]).start()},[ae,re,B.components.datePicker,B.motion.duration.normal]),De=useCallback(()=>{const e=resolveHaptic(b,"selection");e&&triggerHaptic(e);const t=B.components.datePicker?.headerPressDuration??80,a=B.components.datePicker?.headerReleaseDuration??100;Animated.sequence([Animated.timing(ie,{toValue:.96,duration:t,useNativeDriver:!0}),Animated.timing(ie,{toValue:1,duration:a,useNativeDriver:!0})]).start(),X(e=>"days"===e?"years":"years"===e?"decades":"years"),xe()},[xe,ie,b,B.components.datePicker]),we=useCallback(e=>{const t=resolveHaptic(b,"selection");t&&triggerHaptic(t),E(t=>new Date(e,t.getMonth(),1)),X("days"),xe()},[xe,b]),ve=useCallback(e=>{const t=resolveHaptic(b,"selection");t&&triggerHaptic(t),E(t=>new Date(e+4,t.getMonth(),1)),X("years"),xe()},[xe,b]),Ce=useCallback(e=>{if(le(e.date))return;const t=resolveHaptic(b,"selection");t&&triggerHaptic(t),G(e.date),e.inMonth\|\|E(new Date(e.date.getFullYear(),e.date.getMonth(),1)),setNativeValue(te,.7),Animated.spring(te,{toValue:1,damping:B.motion.spring.bouncy.damping,stiffness:B.motion.spring.bouncy.stiffness,mass:B.motion.spring.bouncy.mass,useNativeDriver:!0}).start()},[le,te,B.motion.spring.bouncy,b]),Se=useCallback(()=>{A\|\|M(!1),r?.()},[A,r]),je=useCallback(()=>{"modal"===n?Animated.parallel([Animated.timing(Z,{toValue:0,duration:B.motion.duration.fast,easing:Easing.bezier(...B.motion.easing.accelerate),useNativeDriver:!1}),Animated.timing(J,{toValue:0,duration:B.motion.duration.fast,easing:Easing.bezier(...B.motion.easing.accelerate),useNativeDriver:!0})]).start(()=>{Se()}):Se()},[Z,n,Se,J,B.motion.duration.fast,B.motion.easing.accelerate]),{handleGesture:ke}=useDragToDismiss({drag:K,travel:()=>Q.current\|\|320,onDismiss:je}),Pe=useCallback(()=>{!1!==b&&triggerHaptic("selection"),je()},[je,b]),Te=useCallback(()=>{O&&(!1!==b&&triggerHaptic("notificationSuccess"),a?.(O),je())},[je,a,O,b]),Ve=J.interpolate({inputRange:[0,1],outputRange:[320,0]}),_e=_jsx(View,{style:z.titleRow,children:_jsx(Text,{style:z.title,accessibilityRole:"header",children:d})}),Re=_jsxs(View,{style:[z.card,m,y],accessibilityRole:"modal"===n?void 0:"none",accessible:!1,testID:L,children:["modal"===n?_jsx(GestureDetector,{gesture:ke,children:_jsxs(View,{style:z.grabArea,children:[_jsx(View,{style:z.handle}),_e]})}):_e,_jsxs(View,{style:z.headerRow,children:[_jsx(Pressable,{onPress:fe,style:({pressed:e})=>[z.navBtn,e&&z.navBtnPressed,h],accessibilityRole:"button",accessibilityLabel:"days"===q?"Previous month":"years"===q?"Previous years":"Previous decades",hitSlop:8,children:_jsx(Text,{style:z.navText,children:"‹"})}),_jsx(Pressable,{onPress:De,style:[z.headerLabelWrap,p],accessibilityRole:"button",accessibilityLabel:"days"===q?`${me}, switch to year selection`:"years"===q?`${me}, switch to decade selection`:`${me}, switch to year selection`,hitSlop:8,children:_jsxs(Animated.View,{style:[z.headerLabelInner,{transform:[{scale:ie}],opacity:"days"===q?ee:1}],children:[_jsx(Animated.Text,{style:[z.headerLabel,{transform:[{translateX:"days"===q?U:0}]}],accessibilityLiveRegion:"polite",children:me}),_jsx(View,{style:z.headerCaret,children:(B.icons?.chevronDown??defaultIcons.chevronDown)({size:B.typography.fontSize.sm,color:B.colors.text.secondary})})]})}),_jsx(Pressable,{onPress:be,style:({pressed:e})=>[z.navBtn,e&&z.navBtnPressed,h],accessibilityRole:"button",accessibilityLabel:"days"===q?"Next month":"years"===q?"Next years":"Next decades",hitSlop:8,children:_jsx(Text,{style:z.navText,children:"›"})})]}),"days"===q?_jsxs(_Fragment,{children:[_jsx(View,{style:z.weekdayRow,children:ge.map((e,t)=>_jsx(View,{style:z.weekdayCell,children:_jsx(Text,{style:z.weekdayText,children:e})},`${e}-${t}`))}),_jsx(Animated.View,{style:[z.grid,{opacity:ee,transform:[{translateX:U}]}],children:Array.from({length:6}).map((e,t)=>_jsx(View,{style:z.gridRow,children:ce.slice(7t,7t+7).map(e=>{const t=le(e.date),a=!!O&&isSameDay(e.date,O),r=isSameDay(e.date,H),i=a?B.colors.primary:"transparent",s=r&&!a?B.colors.primary:"transparent",o=a?B.colors.onPrimary:e.inMonth?t?B.colors.text.disabled:B.colors.text.primary:B.colors.text.tertiary,n=t?.3:e.inMonth?1:.4;return _jsx(Pressable,{disabled:t,onPress:()=>Ce(e),accessibilityRole:"button",accessibilityLabel:formatLongDate(e.date,l),accessibilityState:{selected:a,disabled:t},"aria-selected":a,"aria-disabled":t,style:z.dayCell,children:_jsx(Animated.View,{style:[z.dayInner,{backgroundColor:i,borderColor:s,borderWidth:r&&!a?1.5:0,opacity:n},a?{transform:[{scale:te}]}:null],children:_jsx(Text,{style:[z.dayText,{color:o}],children:e.date.getDate()})})},e.iso)})},`r-${t}`))})]}):_jsx(Animated.View,"years"===q?{style:[z.yearGrid,{opacity:ae,transform:[{scale:re}]}],children:Array.from({length:3}).map((e,t)=>_jsx(View,{style:z.gridRow,children:de.slice(4t,4t+4).map(e=>{const t=ye(e),a=!!O&&O.getFullYear()===e,r=H.getFullYear()===e,i=a?B.colors.primary:"transparent",s=r&&!a?B.colors.primary:"transparent",o=a?B.colors.onPrimary:t?B.colors.text.disabled:B.colors.text.primary,n=t?.3:1;return _jsx(Pressable,{disabled:t,onPress:()=>we(e),accessibilityRole:"button",accessibilityLabel:`Year ${e}`,accessibilityState:{selected:a,disabled:t},"aria-selected":a,"aria-disabled":t,style:z.yearCell,children:_jsx(View,{style:[z.yearInner,{backgroundColor:i,borderColor:s,borderWidth:r&&!a?1.5:0,opacity:n}],children:_jsx(Text,{style:[z.yearText,{color:o}],children:e})})},`year-${e}`)})},`yr-${t}`))}:{style:[z.yearGrid,{opacity:ae,transform:[{scale:re}]}],children:Array.from({length:3}).map((e,t)=>_jsx(View,{style:z.gridRow,children:ue.slice(4t,4t+4).map(e=>{const t=e+10-1,a=pe(e),r=!!O&&decadeStartFor(O.getFullYear())===e,i=decadeStartFor(H.getFullYear())===e,s=r?B.colors.primary:"transparent",o=i&&!r?B.colors.primary:"transparent",n=r?B.colors.onPrimary:a?B.colors.text.disabled:B.colors.text.primary,l=a?.3:1;return _jsx(Pressable,{disabled:a,onPress:()=>ve(e),accessibilityRole:"button",accessibilityLabel:`Decade ${e} to ${t}`,accessibilityState:{selected:r,disabled:a},"aria-selected":r,"aria-disabled":a,style:z.yearCell,children:_jsxs(View,{style:[z.yearInner,{backgroundColor:s,borderColor:o,borderWidth:i&&!r?1.5:0,opacity:l}],children:[_jsx(Text,{style:[z.yearText,{color:n}],children:`${e}s`}),_jsx(Text,{style:[z.decadeRangeText,{color:r?B.colors.onPrimary:B.colors.text.tertiary}],children:`${e}-${t}`})]})},`decade-${e}`)})},`dec-${t}`))}),_jsxs(View,{style:z.footer,children:[_jsx(Pressable,{onPress:Pe,style:({pressed:e})=>[z.footerBtn,z.footerCancel,e&&z.footerBtnPressed,f],accessibilityRole:"button",accessibilityLabel:g,children:_jsx(Text,{style:[z.footerBtnText,{color:B.colors.text.secondary}],children:g})}),_jsx(Pressable,{onPress:Te,disabled:!O,style:({pressed:e})=>[z.footerBtn,z.footerConfirm,{backgroundColor:B.colors.primary,opacity:O?1:.5},e&&{backgroundColor:B.colors.primaryHover},f],accessibilityRole:"button",accessibilityLabel:u,accessibilityState:{disabled:!O},"aria-disabled":!O,children:_jsx(Text,{style:[z.footerBtnText,{color:B.colors.onPrimary}],children:u})})]})]}),Ae=t?(_??(e=>e.toLocaleDateString()))(t):void 0,Ie=!A;if("inline"===n)return F\|\|Ie?Ie?_jsxs(_Fragment,{children:[_jsx(PickerTrigger,{label:D,value:Ae,placeholder:w,helperText:v,error:C,required:S,disabled:j,size:k,variant:P,clearable:T,onClear:V,onPress:()=>M(!0),triggerStyle:R,testID:x}),F?Re:null]}):Re:null;const Me=_jsx(Modal,{visible:F,transparent:!0,statusBarTranslucent:!0,navigationBarTranslucent:!0,animationType:"none",onRequestClose:je,children:_jsxs(GestureHandlerRootView,{collapsable:!1,style:[z.backdrop,{backgroundColor:B.colors.background.overlay}],children:[_jsx(Pressable,{style:StyleSheet.absoluteFill,onPress:je,accessibilityLabel:"Dismiss"}),_jsx(Animated.View,{style:[z.sheetWrap,{paddingBottom:Math.max(Y.bottom,B.spacing.lg),opacity:J,transform:[{translateY:Animated.add(Ve,K)}]}],onLayout:e=>{Q.current=e.nativeEvent.layout.height},accessibilityViewIsModal:!0,accessibilityRole:"none",children:Re}),_jsx(ToastHost,{})]})});return Ie?_jsxs(_Fragment,{children:[_jsx(PickerTrigger,{label:D,value:Ae,placeholder:w,helperText:v,error:C,required:S,disabled:j,size:k,variant:P,clearable:T,onClear:V,onPress:()=>M(!0),triggerStyle:R,testID:x}),Me]}):Me},buildStyles=e=>{const t=e.shadows.lg;return StyleSheet.create({backdrop:{...StyleSheet.absoluteFill},sheetWrap:{position:"absolute",left:0,right:0,bottom:0,paddingHorizontal:e.spacing.md,paddingBottom:e.spacing.lg},card:{backgroundColor:e.colors.background.elevated,borderRadius:e.radius.xl,...smoothCorners,padding:e.spacing.lg,shadowColor:t.shadowColor,shadowOffset:t.shadowOffset,shadowOpacity:t.shadowOpacity,shadowRadius:t.shadowRadius,elevation:t.elevation},grabArea:{marginTop:-e.spacing.lg,paddingTop:e.spacing.sm},handle:{alignSelf:"center",width:36,height:4,borderRadius:e.radius.full,...smoothCorners,backgroundColor:e.colors.border.secondary,marginBottom:e.spacing.sm},titleRow:{marginBottom:e.spacing.sm},title:{fontSize:e.typography.fontSize.lg,fontWeight:e.typography.fontWeight.semibold,color:e.colors.text.primary},headerRow:{flexDirection:"row",alignItems:"center",justifyContent:"space-between",marginBottom:e.spacing.md},navBtn:{width:e.components.datePicker?.navButtonSize??36,height:e.components.datePicker?.navButtonSize??36,borderRadius:e.radius.full,...smoothCorners,alignItems:"center",justifyContent:"center",backgroundColor:e.colors.background.secondary},navBtnPressed:{backgroundColor:e.colors.surface.pressed},navText:{fontSize:e.components.datePicker?.navTextFontSize??22,lineHeight:e.components.datePicker?.navTextLineHeight??24,color:e.colors.text.primary,fontWeight:e.typography.fontWeight.semibold},headerLabelWrap:{flex:1,alignItems:"center"},headerLabelInner:{flexDirection:"row",alignItems:"center",justifyContent:"center"},headerLabel:{fontSize:e.typography.fontSize.base,fontWeight:e.typography.fontWeight.semibold,color:e.colors.text.primary},headerCaret:{marginLeft:e.spacing.xs,alignItems:"center",justifyContent:"center"},weekdayRow:{flexDirection:"row",marginBottom:e.spacing.xs},weekdayCell:{flex:1,alignItems:"center",paddingVertical:e.spacing.xs},weekdayText:{fontSize:e.typography.fontSize.xs,fontWeight:e.typography.fontWeight.medium,color:e.colors.text.tertiary,letterSpacing:e.typography.letterSpacing.wide},grid:{},gridRow:{flexDirection:"row"},dayCell:{flex:1,aspectRatio:1,alignItems:"center",justifyContent:"center",padding:e.components.datePicker?.dayCellPadding??2},dayInner:{width:"100%",height:"100%",borderRadius:e.components.datePicker?.dayInnerBorderRadius??e.radius.full,...smoothCorners,alignItems:"center",justifyContent:"center"},dayText:{fontSize:e.typography.fontSize.sm,fontWeight:e.typography.fontWeight.medium},yearGrid:{},yearCell:{flex:1,aspectRatio:1.6,alignItems:"center",justifyContent:"center",padding:e.components.datePicker?.yearCellPadding??4},yearInner:{width:"100%",height:"100%",borderRadius:e.components.datePicker?.yearInnerBorderRadius??e.radius.lg,...smoothCorners,alignItems:"center",justifyContent:"center"},yearText:{fontSize:e.typography.fontSize.base,fontWeight:e.typography.fontWeight.semibold},decadeRangeText:{fontSize:e.typography.fontSize.xs,fontWeight:e.typography.fontWeight.medium,marginTop:e.components.datePicker?.decadeRangeMarginTop??2},footer:{flexDirection:"row",justifyContent:"flex-end",alignItems:"center",marginTop:e.spacing.lg,gap:e.spacing.sm},footerBtn:{paddingHorizontal:e.spacing.lg,paddingVertical:e.spacing.sm,borderRadius:e.radius.md,...smoothCorners,minHeight:e.components.datePicker?.footerButtonMinHeight??40,alignItems:"center",justifyContent:"center"},footerCancel:{backgroundColor:"transparent"},footerConfirm:{},footerBtnPressed:{opacity:.85},footerBtnText:{fontSize:e.typography.fontSize.sm,fontWeight:e.typography.fontWeight.semibold}})};export{DatePicker};export default DatePicker;
1	+ "use strict";import{useCallback,useEffect,useMemo,useRef,useState}from"react";import{AccessibilityInfo,Animated,Easing,Modal,Pressable,StyleSheet,Text,View}from"react-native";import{GestureDetector,GestureHandlerRootView}from"react-native-gesture-handler";import{useDragToDismiss}from"../../hooks/useDragToDismiss.js";import{createAnimatedValue,setNativeValue,useTheme}from"../../theme/index.js";import{resolveHaptic,triggerHaptic}from"../../utils/index.js";import{smoothCorners}from"../../utils/corners.js";import{defaultIcons}from"../AppIcon/defaultIcons.js";import{ModalSafeArea,useModalInsets}from"../ModalSafeArea/ModalSafeArea.js";import{PickerTrigger}from"../PickerTrigger/index.js";import{ToastHost}from"../Toast/ToastProvider.js";import{jsx as _jsx,jsxs as _jsxs,Fragment as _Fragment}from"react/jsx-runtime";const GRID_SIZE=12,DECADE_SPAN=10,startOfDay=e=>new Date(e.getFullYear(),e.getMonth(),e.getDate()),isSameDay=(e,t)=>e.getFullYear()===t.getFullYear()&&e.getMonth()===t.getMonth()&&e.getDate()===t.getDate(),toIso=e=>`${e.getFullYear()}-${String(e.getMonth()+1).padStart(2,"0")}-${String(e.getDate()).padStart(2,"0")}`,addMonths=(e,t)=>new Date(e.getFullYear(),e.getMonth()+t,1),buildMonthMatrix=(e,t)=>{const a=e.getFullYear(),r=e.getMonth(),i=(new Date(a,r,1).getDay()-t+7)%7,s=[];for(let e=0;e<42;e+=1){const t=new Date(a,r,1-i+e);s.push({date:t,inMonth:t.getMonth()===r,iso:toIso(t)})}return s},weekdayLabels=(e,t)=>{const a=new Intl.DateTimeFormat(e,{weekday:"short"}),r=[];for(let e=0;e<7;e+=1){const i=new Date(1970,0,4+(t+e)%7);r.push(a.format(i))}return r},formatMonthYear=(e,t)=>new Intl.DateTimeFormat(t,{month:"long",year:"numeric"}).format(e),formatLongDate=(e,t)=>new Intl.DateTimeFormat(t,{weekday:"long",year:"numeric",month:"long",day:"numeric"}).format(e),decadeStartFor=e=>10Math.floor(e/10),buildYearCells=e=>{const t=e-4;return Array.from({length:12},(e,a)=>t+a)},buildDecadeCells=e=>{const t=decadeStartFor(e)-40;return Array.from({length:12},(e,a)=>t+10a)},DatePicker=e=>{const{value:t,onChange:a,onClose:r,minDate:i,maxDate:s,disabledDates:o,mode:n="modal",locale:l="en-IN",weekStartsOn:c=0,title:d="Select Date",confirmLabel:u="Confirm",cancelLabel:g="Cancel",style:m,containerStyle:y,headerLabelStyle:p,navButtonStyle:h,footerButtonStyle:f,haptic:b,testID:x,label:D,placeholder:w,helperText:v,error:C,required:S,disabled:j,size:k,variant:P,clearable:T,onClear:V,formatValue:_,triggerStyle:A}=e,R=void 0!==e.visible,[M,I]=useState(!1),F=R?e.visible:M,L=R?x:x?`${x}-calendar`:void 0,B=useTheme(),[Y,z]=useModalInsets(),H=useMemo(()=>buildStyles(B),[B]),[N,$]=useState(()=>startOfDay(new Date));useEffect(()=>{F&&$(startOfDay(new Date))},[F]);const W=t?startOfDay(t):N,[E,O]=useState(W),[G,q]=useState(t?startOfDay(t):null),[X,Z]=useState("days"),J=useRef(createAnimatedValue(0)).current,K=useRef(createAnimatedValue(0)).current,Q=useRef(createAnimatedValue(0)).current,U=useRef(0),ee=useRef(createAnimatedValue(0)).current,te=useRef(createAnimatedValue(1)).current,ae=useRef(createAnimatedValue(1)).current,re=useRef(createAnimatedValue(1)).current,ie=useRef(createAnimatedValue(1)).current,se=useRef(createAnimatedValue(1)).current;useEffect(()=>{if(t){const e=startOfDay(t);q(e),O(e)}else q(null)},[t]),useEffect(()=>{if("modal"===n&&F){J.setValue(0),setNativeValue(K,0),setNativeValue(Q,0);const e=Animated.parallel([Animated.timing(J,{toValue:1,duration:B.motion.duration.normal,easing:Easing.out(Easing.cubic),useNativeDriver:!1}),Animated.spring(K,{toValue:1,damping:B.motion.spring.gentle.damping,stiffness:B.motion.spring.gentle.stiffness,mass:B.motion.spring.gentle.mass,useNativeDriver:!0})]);return e.start(),()=>e.stop()}},[F,n,J,K,Q,B.motion]);const oe=useMemo(()=>{const e=new Set;return o?.forEach(t=>e.add(toIso(startOfDay(t)))),e},[o]),ne=useMemo(()=>i?startOfDay(i):null,[i]),le=useMemo(()=>s?startOfDay(s):null,[s]),ce=useCallback(e=>!!(ne&&e.getTime()<ne.getTime())\|\|(!!(le&&e.getTime()>le.getTime())\|\|!!oe.has(toIso(e))),[ne,le,oe]),de=useMemo(()=>buildMonthMatrix(E,c),[E,c]),ue=useMemo(()=>buildYearCells(E.getFullYear()),[E]),ge=useMemo(()=>buildDecadeCells(E.getFullYear()),[E]),me=useMemo(()=>weekdayLabels(l,c),[l,c]),ye=useMemo(()=>{if("days"===X)return formatMonthYear(E,l);if("years"===X){return`${ue[0]} - ${ue[ue.length-1]}`}return`${ge[0]} - ${ge[ge.length-1]+9}`},[E,ge,l,X,ue]),pe=useCallback(e=>!!(ne&&e<ne.getFullYear())\|\|!!(le&&e>le.getFullYear()),[ne,le]),he=useCallback(e=>!!(ne&&e+10-1<ne.getFullYear())\|\|!!(le&&e>le.getFullYear()),[ne,le]),fe=useCallback(e=>{!1!==b&&triggerHaptic("impactLight");const t=e>0?1:-1,a=B.components.datePicker?.monthSlideDistance??32,r=B.components.datePicker?.monthSlideOutDuration??B.motion.duration.fast??140,i=B.components.datePicker?.monthSlideInDuration??B.motion.duration.fast??160;Animated.sequence([Animated.parallel([Animated.timing(ee,{toValue:-ta,duration:r,easing:Easing.out(Easing.quad),useNativeDriver:!0}),Animated.timing(te,{toValue:0,duration:r,useNativeDriver:!0})]),Animated.timing(ee,{toValue:ta,duration:0,useNativeDriver:!0}),Animated.parallel([Animated.timing(ee,{toValue:0,duration:i,easing:Easing.out(Easing.cubic),useNativeDriver:!0}),Animated.timing(te,{toValue:1,duration:i,useNativeDriver:!0})])]).start();const s=addMonths(E,e);O(s),AccessibilityInfo.announceForAccessibility(formatMonthYear(s,l))},[E,b,l,te,ee,B.components.datePicker,B.motion.duration.fast]),be=useCallback(()=>{"days"!==X?(!1!==b&&triggerHaptic("impactLight"),O("years"===X?e=>new Date(e.getFullYear()-12,e.getMonth(),1):e=>new Date(e.getFullYear()-120,e.getMonth(),1))):fe(-1)},[fe,X,b]),xe=useCallback(()=>{"days"!==X?(!1!==b&&triggerHaptic("impactLight"),O("years"===X?e=>new Date(e.getFullYear()+12,e.getMonth(),1):e=>new Date(e.getFullYear()+120,e.getMonth(),1))):fe(1)},[fe,X,b]),De=useCallback(()=>{const e=B.components.datePicker?.viewTransitionDuration??B.motion.duration.normal??200;setNativeValue(re,0),setNativeValue(ie,.9),Animated.parallel([Animated.timing(re,{toValue:1,duration:e,easing:Easing.out(Easing.cubic),useNativeDriver:!0}),Animated.timing(ie,{toValue:1,duration:e,easing:Easing.out(Easing.cubic),useNativeDriver:!0})]).start()},[re,ie,B.components.datePicker,B.motion.duration.normal]),we=useCallback(()=>{const e=resolveHaptic(b,"selection");e&&triggerHaptic(e);const t=B.components.datePicker?.headerPressDuration??80,a=B.components.datePicker?.headerReleaseDuration??100;Animated.sequence([Animated.timing(se,{toValue:.96,duration:t,useNativeDriver:!0}),Animated.timing(se,{toValue:1,duration:a,useNativeDriver:!0})]).start(),Z(e=>"days"===e?"years":"years"===e?"decades":"years"),De()},[De,se,b,B.components.datePicker]),ve=useCallback(e=>{const t=resolveHaptic(b,"selection");t&&triggerHaptic(t),O(t=>new Date(e,t.getMonth(),1)),Z("days"),De()},[De,b]),Ce=useCallback(e=>{const t=resolveHaptic(b,"selection");t&&triggerHaptic(t),O(t=>new Date(e+4,t.getMonth(),1)),Z("years"),De()},[De,b]),Se=useCallback(e=>{if(ce(e.date))return;const t=resolveHaptic(b,"selection");t&&triggerHaptic(t),q(e.date),e.inMonth\|\|O(new Date(e.date.getFullYear(),e.date.getMonth(),1)),setNativeValue(ae,.7),Animated.spring(ae,{toValue:1,damping:B.motion.spring.bouncy.damping,stiffness:B.motion.spring.bouncy.stiffness,mass:B.motion.spring.bouncy.mass,useNativeDriver:!0}).start()},[ce,ae,B.motion.spring.bouncy,b]),je=useCallback(()=>{R\|\|I(!1),r?.()},[R,r]),ke=useCallback(()=>{"modal"===n?Animated.parallel([Animated.timing(J,{toValue:0,duration:B.motion.duration.fast,easing:Easing.bezier(...B.motion.easing.accelerate),useNativeDriver:!1}),Animated.timing(K,{toValue:0,duration:B.motion.duration.fast,easing:Easing.bezier(...B.motion.easing.accelerate),useNativeDriver:!0})]).start(()=>{je()}):je()},[J,n,je,K,B.motion.duration.fast,B.motion.easing.accelerate]),{handleGesture:Pe}=useDragToDismiss({drag:Q,travel:()=>U.current\|\|320,onDismiss:ke}),Te=useCallback(()=>{!1!==b&&triggerHaptic("selection"),ke()},[ke,b]),Ve=useCallback(()=>{G&&(!1!==b&&triggerHaptic("notificationSuccess"),a?.(G),ke())},[ke,a,G,b]),Ae=K.interpolate({inputRange:[0,1],outputRange:[320,0]}),Re=_jsx(View,{style:H.titleRow,children:_jsx(Text,{style:H.title,accessibilityRole:"header",children:d})}),Me=_jsxs(View,{style:[H.card,m,y],accessibilityRole:"modal"===n?void 0:"none",accessible:!1,testID:L,children:["modal"===n?_jsx(GestureDetector,{gesture:Pe,children:_jsxs(View,{style:H.grabArea,children:[_jsx(View,{style:H.handle}),Re]})}):Re,_jsxs(View,{style:H.headerRow,children:[_jsx(Pressable,{onPress:be,style:({pressed:e})=>[H.navBtn,e&&H.navBtnPressed,h],accessibilityRole:"button",accessibilityLabel:"days"===X?"Previous month":"years"===X?"Previous years":"Previous decades",hitSlop:8,children:_jsx(Text,{style:H.navText,children:"‹"})}),_jsx(Pressable,{onPress:we,style:[H.headerLabelWrap,p],accessibilityRole:"button",accessibilityLabel:"days"===X?`${ye}, switch to year selection`:"years"===X?`${ye}, switch to decade selection`:`${ye}, switch to year selection`,hitSlop:8,children:_jsxs(Animated.View,{style:[H.headerLabelInner,{transform:[{scale:se}],opacity:"days"===X?te:1}],children:[_jsx(Animated.Text,{style:[H.headerLabel,{transform:[{translateX:"days"===X?ee:0}]}],accessibilityLiveRegion:"polite",children:ye}),_jsx(View,{style:H.headerCaret,children:(B.icons?.chevronDown??defaultIcons.chevronDown)({size:B.typography.fontSize.sm,color:B.colors.text.secondary})})]})}),_jsx(Pressable,{onPress:xe,style:({pressed:e})=>[H.navBtn,e&&H.navBtnPressed,h],accessibilityRole:"button",accessibilityLabel:"days"===X?"Next month":"years"===X?"Next years":"Next decades",hitSlop:8,children:_jsx(Text,{style:H.navText,children:"›"})})]}),"days"===X?_jsxs(_Fragment,{children:[_jsx(View,{style:H.weekdayRow,children:me.map((e,t)=>_jsx(View,{style:H.weekdayCell,children:_jsx(Text,{style:H.weekdayText,children:e})},`${e}-${t}`))}),_jsx(Animated.View,{style:[H.grid,{opacity:te,transform:[{translateX:ee}]}],children:Array.from({length:6}).map((e,t)=>_jsx(View,{style:H.gridRow,children:de.slice(7t,7t+7).map(e=>{const t=ce(e.date),a=!!G&&isSameDay(e.date,G),r=isSameDay(e.date,N),i=a?B.colors.primary:"transparent",s=r&&!a?B.colors.primary:"transparent",o=a?B.colors.onPrimary:e.inMonth?t?B.colors.text.disabled:B.colors.text.primary:B.colors.text.tertiary,n=t?.3:e.inMonth?1:.4;return _jsx(Pressable,{disabled:t,onPress:()=>Se(e),accessibilityRole:"button",accessibilityLabel:formatLongDate(e.date,l),accessibilityState:{selected:a,disabled:t},"aria-selected":a,"aria-disabled":t,style:H.dayCell,children:_jsx(Animated.View,{style:[H.dayInner,{backgroundColor:i,borderColor:s,borderWidth:r&&!a?1.5:0,opacity:n},a?{transform:[{scale:ae}]}:null],children:_jsx(Text,{style:[H.dayText,{color:o}],children:e.date.getDate()})})},e.iso)})},`r-${t}`))})]}):_jsx(Animated.View,"years"===X?{style:[H.yearGrid,{opacity:re,transform:[{scale:ie}]}],children:Array.from({length:3}).map((e,t)=>_jsx(View,{style:H.gridRow,children:ue.slice(4t,4t+4).map(e=>{const t=pe(e),a=!!G&&G.getFullYear()===e,r=N.getFullYear()===e,i=a?B.colors.primary:"transparent",s=r&&!a?B.colors.primary:"transparent",o=a?B.colors.onPrimary:t?B.colors.text.disabled:B.colors.text.primary,n=t?.3:1;return _jsx(Pressable,{disabled:t,onPress:()=>ve(e),accessibilityRole:"button",accessibilityLabel:`Year ${e}`,accessibilityState:{selected:a,disabled:t},"aria-selected":a,"aria-disabled":t,style:H.yearCell,children:_jsx(View,{style:[H.yearInner,{backgroundColor:i,borderColor:s,borderWidth:r&&!a?1.5:0,opacity:n}],children:_jsx(Text,{style:[H.yearText,{color:o}],children:e})})},`year-${e}`)})},`yr-${t}`))}:{style:[H.yearGrid,{opacity:re,transform:[{scale:ie}]}],children:Array.from({length:3}).map((e,t)=>_jsx(View,{style:H.gridRow,children:ge.slice(4t,4t+4).map(e=>{const t=e+10-1,a=he(e),r=!!G&&decadeStartFor(G.getFullYear())===e,i=decadeStartFor(N.getFullYear())===e,s=r?B.colors.primary:"transparent",o=i&&!r?B.colors.primary:"transparent",n=r?B.colors.onPrimary:a?B.colors.text.disabled:B.colors.text.primary,l=a?.3:1;return _jsx(Pressable,{disabled:a,onPress:()=>Ce(e),accessibilityRole:"button",accessibilityLabel:`Decade ${e} to ${t}`,accessibilityState:{selected:r,disabled:a},"aria-selected":r,"aria-disabled":a,style:H.yearCell,children:_jsxs(View,{style:[H.yearInner,{backgroundColor:s,borderColor:o,borderWidth:i&&!r?1.5:0,opacity:l}],children:[_jsx(Text,{style:[H.yearText,{color:n}],children:`${e}s`}),_jsx(Text,{style:[H.decadeRangeText,{color:r?B.colors.onPrimary:B.colors.text.tertiary}],children:`${e}-${t}`})]})},`decade-${e}`)})},`dec-${t}`))}),_jsxs(View,{style:H.footer,children:[_jsx(Pressable,{onPress:Te,style:({pressed:e})=>[H.footerBtn,H.footerCancel,e&&H.footerBtnPressed,f],accessibilityRole:"button",accessibilityLabel:g,children:_jsx(Text,{style:[H.footerBtnText,{color:B.colors.text.secondary}],children:g})}),_jsx(Pressable,{onPress:Ve,disabled:!G,style:({pressed:e})=>[H.footerBtn,H.footerConfirm,{backgroundColor:B.colors.primary,opacity:G?1:.5},e&&{backgroundColor:B.colors.primaryHover},f],accessibilityRole:"button",accessibilityLabel:u,accessibilityState:{disabled:!G},"aria-disabled":!G,children:_jsx(Text,{style:[H.footerBtnText,{color:B.colors.onPrimary}],children:u})})]})]}),Ie=t?(_??(e=>e.toLocaleDateString()))(t):void 0,Fe=!R;if("inline"===n)return F\|\|Fe?Fe?_jsxs(_Fragment,{children:[_jsx(PickerTrigger,{label:D,value:Ie,placeholder:w,helperText:v,error:C,required:S,disabled:j,size:k,variant:P,clearable:T,onClear:V,onPress:()=>I(!0),triggerStyle:A,testID:x}),F?Me:null]}):Me:null;const Le=_jsx(Modal,{visible:F,transparent:!0,statusBarTranslucent:!0,navigationBarTranslucent:!0,animationType:"none",onRequestClose:ke,children:_jsx(ModalSafeArea,{onInsets:z,children:_jsxs(GestureHandlerRootView,{collapsable:!1,style:[H.backdrop,{backgroundColor:B.colors.background.overlay}],children:[_jsx(Pressable,{style:StyleSheet.absoluteFill,onPress:ke,accessibilityLabel:"Dismiss"}),_jsx(Animated.View,{style:[H.sheetWrap,{paddingBottom:Math.max(Y.bottom,B.spacing.lg),opacity:K,transform:[{translateY:Animated.add(Ae,Q)}]}],onLayout:e=>{U.current=e.nativeEvent.layout.height},accessibilityViewIsModal:!0,accessibilityRole:"none",children:Me}),_jsx(ToastHost,{})]})})});return Fe?_jsxs(_Fragment,{children:[_jsx(PickerTrigger,{label:D,value:Ie,placeholder:w,helperText:v,error:C,required:S,disabled:j,size:k,variant:P,clearable:T,onClear:V,onPress:()=>I(!0),triggerStyle:A,testID:x}),Le]}):Le},buildStyles=e=>{const t=e.shadows.lg;return StyleSheet.create({backdrop:{...StyleSheet.absoluteFill},sheetWrap:{position:"absolute",left:0,right:0,bottom:0,paddingHorizontal:e.spacing.md,paddingBottom:e.spacing.lg},card:{backgroundColor:e.colors.background.elevated,borderRadius:e.radius.xl,...smoothCorners,padding:e.spacing.lg,shadowColor:t.shadowColor,shadowOffset:t.shadowOffset,shadowOpacity:t.shadowOpacity,shadowRadius:t.shadowRadius,elevation:t.elevation},grabArea:{marginTop:-e.spacing.lg,paddingTop:e.spacing.sm},handle:{alignSelf:"center",width:36,height:4,borderRadius:e.radius.full,...smoothCorners,backgroundColor:e.colors.border.secondary,marginBottom:e.spacing.sm},titleRow:{marginBottom:e.spacing.sm},title:{fontSize:e.typography.fontSize.lg,fontWeight:e.typography.fontWeight.semibold,color:e.colors.text.primary},headerRow:{flexDirection:"row",alignItems:"center",justifyContent:"space-between",marginBottom:e.spacing.md},navBtn:{width:e.components.datePicker?.navButtonSize??36,height:e.components.datePicker?.navButtonSize??36,borderRadius:e.radius.full,...smoothCorners,alignItems:"center",justifyContent:"center",backgroundColor:e.colors.background.secondary},navBtnPressed:{backgroundColor:e.colors.surface.pressed},navText:{fontSize:e.components.datePicker?.navTextFontSize??22,lineHeight:e.components.datePicker?.navTextLineHeight??24,color:e.colors.text.primary,fontWeight:e.typography.fontWeight.semibold},headerLabelWrap:{flex:1,alignItems:"center"},headerLabelInner:{flexDirection:"row",alignItems:"center",justifyContent:"center"},headerLabel:{fontSize:e.typography.fontSize.base,fontWeight:e.typography.fontWeight.semibold,color:e.colors.text.primary},headerCaret:{marginLeft:e.spacing.xs,alignItems:"center",justifyContent:"center"},weekdayRow:{flexDirection:"row",marginBottom:e.spacing.xs},weekdayCell:{flex:1,alignItems:"center",paddingVertical:e.spacing.xs},weekdayText:{fontSize:e.typography.fontSize.xs,fontWeight:e.typography.fontWeight.medium,color:e.colors.text.tertiary,letterSpacing:e.typography.letterSpacing.wide},grid:{},gridRow:{flexDirection:"row"},dayCell:{flex:1,aspectRatio:1,alignItems:"center",justifyContent:"center",padding:e.components.datePicker?.dayCellPadding??2},dayInner:{width:"100%",height:"100%",borderRadius:e.components.datePicker?.dayInnerBorderRadius??e.radius.full,...smoothCorners,alignItems:"center",justifyContent:"center"},dayText:{fontSize:e.typography.fontSize.sm,fontWeight:e.typography.fontWeight.medium},yearGrid:{},yearCell:{flex:1,aspectRatio:1.6,alignItems:"center",justifyContent:"center",padding:e.components.datePicker?.yearCellPadding??4},yearInner:{width:"100%",height:"100%",borderRadius:e.components.datePicker?.yearInnerBorderRadius??e.radius.lg,...smoothCorners,alignItems:"center",justifyContent:"center"},yearText:{fontSize:e.typography.fontSize.base,fontWeight:e.typography.fontWeight.semibold},decadeRangeText:{fontSize:e.typography.fontSize.xs,fontWeight:e.typography.fontWeight.medium,marginTop:e.components.datePicker?.decadeRangeMarginTop??2},footer:{flexDirection:"row",justifyContent:"flex-end",alignItems:"center",marginTop:e.spacing.lg,gap:e.spacing.sm},footerBtn:{paddingHorizontal:e.spacing.lg,paddingVertical:e.spacing.sm,borderRadius:e.radius.md,...smoothCorners,minHeight:e.components.datePicker?.footerButtonMinHeight??40,alignItems:"center",justifyContent:"center"},footerCancel:{backgroundColor:"transparent"},footerConfirm:{},footerBtnPressed:{opacity:.85},footerBtnText:{fontSize:e.typography.fontSize.sm,fontWeight:e.typography.fontWeight.semibold}})};export{DatePicker};export default DatePicker;

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

	@@ -1 +1 @@
1	- "use strict";import{forwardRef,useCallback,useEffect,useMemo,useRef,useState}from"react";import{Animated,Easing,Modal,Pressable,StyleSheet,Text,View}from"react-native";import{GestureDetector,GestureHandlerRootView}from"react-native-gesture-handler";import{~~useSafeAreaInsets}from"react-native-safe-area-context";import{~~useDragToDismiss}from"../../hooks/useDragToDismiss.js";import{createAnimatedValue,setNativeValue,useTheme}from"../../theme/index.js";import{triggerHaptic}from"../../utils/index.js";import{smoothCorners}from"../../utils/corners.js";import{Calendar}from"../Calendar/index.js";import{daysBetween,startOfDay,startOfMonth}from"../Calendar/calendarDates.js";import{PickerTrigger}from"../PickerTrigger/index.js";import{ToastHost}from"../Toast/ToastProvider.js";import{jsx as _jsx,jsxs as _jsxs,Fragment as _Fragment}from"react/jsx-runtime";const formatRangePart=(e,t)=>new Intl.DateTimeFormat(t,{weekday:"short",day:"numeric",month:"short"}).format(e),DateRangePicker=forwardRef((e,t)=>{const{visible:a,value:r,onChange:s,onClose:o,label:i,placeholder:n,helperText:l,error:d,required:c,disabled:g,size:m,variant:u,clearable:f,onClear:p,formatValue:h,triggerStyle:y,minDate:b,maxDate:x,disabledDates:D,markedDates:v,strikeMarkedInRange:S,locale:R="en-IN",weekStartsOn:C=0,title:j="Select Date Range",confirmLabel:k="Confirm",cancelLabel:w="Cancel",maxRange:T,haptic:P,style:V,containerStyle:_,headerLabelStyle:B,navButtonStyle:A,footerButtonStyle:M,testID:O}=e,H=void 0!==a,[I,z]=useState(!1),L=H?a:I,E=H?O:O?`${O}-calendar`:void 0,N=useTheme(),W=~~useSafeAreaInsets~~()~~,$=~~useMemo(()=>buildStyles(N),[N]),[F,G]=useState(()=>startOfMonth(r.start??new Date)),[q,Y]=useState(r.start?startOfDay(r.start):null),[J,K]=useState(r.end?startOfDay(r.end):null),Q=useRef(createAnimatedValue(0)).current,U=useRef(createAnimatedValue(0)).current,X=useRef(createAnimatedValue(0)).current,Z=useRef(0);useEffect(()=>{if(r.start){const e=startOfDay(r.start);Y(e),G(startOfMonth(e))}else Y(null);r.end?K(startOfDay(r.end)):K(null)},[r.start,r.end]),useEffect(()=>{let e;return L&&(Q.setValue(0),setNativeValue(U,0),setNativeValue(X,0),e=Animated.parallel([Animated.timing(Q,{toValue:1,duration:N.motion.duration.normal,easing:Easing.out(Easing.cubic),useNativeDriver:!1}),Animated.spring(U,{toValue:1,damping:N.motion.spring.gentle.damping,stiffness:N.motion.spring.gentle.stiffness,mass:N.motion.spring.gentle.mass,useNativeDriver:!0})]),e.start()),()=>e?.stop()},[L,Q,U,X,N.motion]);const ee=useCallback(e=>{if(e.end&&T&&daysBetween(e.start,e.end)+1>T)return!1!==P&&triggerHaptic("notificationWarning"),Y(e.end),void K(null);Y(e.start),K(e.end??null)},[T,P]),te=useCallback(()=>{H?o?.():z(!1)},[H,o]),ae=useCallback(()=>{Animated.parallel([Animated.timing(Q,{toValue:0,duration:N.motion.duration.fast,easing:Easing.bezier(...N.motion.easing.accelerate),useNativeDriver:!1}),Animated.timing(U,{toValue:0,duration:N.motion.duration.fast,easing:Easing.bezier(...N.motion.easing.accelerate),useNativeDriver:!0})]).start(()=>{te()})},[Q,te,U,N.motion.duration.fast,N.motion.easing.accelerate]),{handleGesture:re}=useDragToDismiss({drag:X,travel:()=>Z.current\|\|320,onDismiss:ae}),se=useCallback(()=>{!1!==P&&triggerHaptic("selection"),ae()},[ae,P]),oe=useCallback(()=>{q&&J&&(!1!==P&&triggerHaptic("notificationSuccess"),s?.({start:q,end:J}),ae())},[ae,s,q,J,P]),ie=U.interpolate({inputRange:[0,1],outputRange:[320,0]}),ne=useMemo(()=>q&&J?`${formatRangePart(q,R)} — ${formatRangePart(J,R)}`:q?`${formatRangePart(q,R)} — …`:"—",[q,J,R]),le=!q\|\|!J,de=_jsxs(View,{style:[$.card,V,_],ref:t,accessible:!1,testID:E,children:[_jsx(GestureDetector,{gesture:re,children:_jsxs(View,{style~~:$.~~grabArea,children:[_jsx(View,{style~~:$.~~handle}),_jsxs(View,{style~~:$.~~titleRow,children:[_jsx(Text,{style~~:$.~~title,accessibilityRole:"header",children:j}),_jsx(Text,{style~~:$.~~subtitle,accessibilityLiveRegion:"polite",children:ne})]})]})}),_jsx(Calendar,{mode:"range",value:q?{start:q,end:J??void 0}:null,onChange:ee,month:F,onMonthChange:G,minDate:b,maxDate:x,disabledDates:D,markedDates:v,strikeMarkedInRange:S,weekStartsOn:C,locale:R,haptic:P,headerLabelStyle:B,navButtonStyle:A,testID:E?`${E}-grid`:void 0}),_jsxs(View,{style~~:$.~~footer,children:[_jsx(Pressable,{onPress:se,style:({pressed:e})=>[$.footerBtn~~,$.~~footerCancel,e~~&&$.~~footerBtnPressed,M],accessibilityRole:"button",accessibilityLabel:w,children:_jsx(Text,{style:[$.footerBtnText,{color:N.colors.text.secondary}],children:w})}),_jsx(Pressable,{onPress:oe,disabled:le,style:({pressed:e})=>[$.footerBtn~~,$.~~footerConfirm,{backgroundColor:N.colors.primary,opacity:le?.5:1},e&&{backgroundColor:N.colors.primaryHover},M],accessibilityRole:"button",accessibilityLabel:k,accessibilityState:{disabled:le},"aria-disabled":le,children:_jsx(Text,{style:[$.footerBtnText,{color:N.colors.onPrimary}],children:k})})]})]}),ce=useMemo(()=>{if(!r.start\|\|!r.end)return"";const e={start:r.start,end:r.end};return h?h(e):`${e.start.toLocaleDateString()} – ${e.end.toLocaleDateString()}`},[r.start,r.end,h]);return _jsxs(_Fragment,{children:[H?null:_jsx(PickerTrigger,{label:i,placeholder:n,helperText:l,error:d,required:c,disabled:g,size:m,variant:u,clearable:f,onClear:p,value:ce,onPress:()=>z(!0),triggerStyle:y,testID:O}),_jsx(Modal,{visible:L,transparent:!0,statusBarTranslucent:!0,navigationBarTranslucent:!0,animationType:"none",onRequestClose:ae,children:_jsxs(GestureHandlerRootView,{collapsable:!1,style:[$.backdrop,{backgroundColor:N.colors.background.overlay}],children:[_jsx(Pressable,{style:StyleSheet.absoluteFill,onPress:ae,accessibilityLabel:"Dismiss"}),_jsx(Animated.View,{style:[$.sheetWrap,{paddingBottom:Math.max(W.bottom,N.spacing.lg),opacity:U,transform:[{translateY:Animated.add(ie,X)}]}],onLayout:e=>{Z.current=e.nativeEvent.layout.height},accessibilityViewIsModal:!0,accessibilityRole:"none",children:de}),_jsx(ToastHost,{})]})})]})});DateRangePicker.displayName="DateRangePicker";const buildStyles=e=>{const t=e.shadows.lg;return StyleSheet.create({backdrop:{...StyleSheet.absoluteFill},sheetWrap:{position:"absolute",left:0,right:0,bottom:0,paddingHorizontal:e.spacing.md,paddingBottom:e.spacing.lg},card:{backgroundColor:e.colors.background.elevated,borderRadius:e.radius.xl,...smoothCorners,padding:e.spacing.lg,shadowColor:t.shadowColor,shadowOffset:t.shadowOffset,shadowOpacity:t.shadowOpacity,shadowRadius:t.shadowRadius,elevation:t.elevation},grabArea:{marginTop:-e.spacing.lg,paddingTop:e.spacing.sm},handle:{alignSelf:"center",width:36,height:4,borderRadius:e.radius.full,...smoothCorners,backgroundColor:e.colors.border.secondary,marginBottom:e.spacing.sm},titleRow:{marginBottom:e.spacing.sm},title:{fontSize:e.typography.fontSize.lg,fontWeight:e.typography.fontWeight.semibold,color:e.colors.text.primary},subtitle:{marginTop:e.spacing.xxs,fontSize:e.typography.fontSize.sm,color:e.colors.text.secondary},footer:{flexDirection:"row",justifyContent:"flex-end",alignItems:"center",marginTop:e.spacing.lg,gap:e.spacing.sm},footerBtn:{paddingHorizontal:e.spacing.lg,paddingVertical:e.spacing.sm,borderRadius:e.radius.md,...smoothCorners,minHeight:e.components.dateRangePicker?.footerButtonMinHeight??40,alignItems:"center",justifyContent:"center"},footerCancel:{backgroundColor:"transparent"},footerConfirm:{},footerBtnPressed:{opacity:.85},footerBtnText:{fontSize:e.typography.fontSize.sm,fontWeight:e.typography.fontWeight.semibold}})};export{DateRangePicker};export default DateRangePicker;
1	+ "use strict";import{forwardRef,useCallback,useEffect,useMemo,useRef,useState}from"react";import{Animated,Easing,Modal,Pressable,StyleSheet,Text,View}from"react-native";import{GestureDetector,GestureHandlerRootView}from"react-native-gesture-handler";import{useDragToDismiss}from"../../hooks/useDragToDismiss.js";import{createAnimatedValue,setNativeValue,useTheme}from"../../theme/index.js";import{triggerHaptic}from"../../utils/index.js";import{smoothCorners}from"../../utils/corners.js";import{Calendar}from"../Calendar/index.js";import{daysBetween,startOfDay,startOfMonth}from"../Calendar/calendarDates.js";import{ModalSafeArea,useModalInsets}from"../ModalSafeArea/ModalSafeArea.js";import{PickerTrigger}from"../PickerTrigger/index.js";import{ToastHost}from"../Toast/ToastProvider.js";import{jsx as _jsx,jsxs as _jsxs,Fragment as _Fragment}from"react/jsx-runtime";const formatRangePart=(e,t)=>new Intl.DateTimeFormat(t,{weekday:"short",day:"numeric",month:"short"}).format(e),DateRangePicker=forwardRef((e,t)=>{const{visible:a,value:r,onChange:s,onClose:o,label:i,placeholder:n,helperText:l,error:d,required:c,disabled:g,size:m,variant:u,clearable:f,onClear:p,formatValue:h,triggerStyle:y,minDate:b,maxDate:x,disabledDates:D,markedDates:S,strikeMarkedInRange:v,locale:R="en-IN",weekStartsOn:j=0,title:C="Select Date Range",confirmLabel:k="Confirm",cancelLabel:w="Cancel",maxRange:T,haptic:P,style:_,containerStyle:V,headerLabelStyle:M,navButtonStyle:B,footerButtonStyle:A,testID:I}=e,O=void 0!==a,[H,z]=useState(!1),L=O?a:H,E=O?I:I?`${I}-calendar`:void 0,N=useTheme(),[W,$]=useModalInsets(),F=useMemo(()=>buildStyles(N),[N]),[G,q]=useState(()=>startOfMonth(r.start??new Date)),[Y,J]=useState(r.start?startOfDay(r.start):null),[K,Q]=useState(r.end?startOfDay(r.end):null),U=useRef(createAnimatedValue(0)).current,X=useRef(createAnimatedValue(0)).current,Z=useRef(createAnimatedValue(0)).current,ee=useRef(0);useEffect(()=>{if(r.start){const e=startOfDay(r.start);J(e),q(startOfMonth(e))}else J(null);r.end?Q(startOfDay(r.end)):Q(null)},[r.start,r.end]),useEffect(()=>{let e;return L&&(U.setValue(0),setNativeValue(X,0),setNativeValue(Z,0),e=Animated.parallel([Animated.timing(U,{toValue:1,duration:N.motion.duration.normal,easing:Easing.out(Easing.cubic),useNativeDriver:!1}),Animated.spring(X,{toValue:1,damping:N.motion.spring.gentle.damping,stiffness:N.motion.spring.gentle.stiffness,mass:N.motion.spring.gentle.mass,useNativeDriver:!0})]),e.start()),()=>e?.stop()},[L,U,X,Z,N.motion]);const te=useCallback(e=>{if(e.end&&T&&daysBetween(e.start,e.end)+1>T)return!1!==P&&triggerHaptic("notificationWarning"),J(e.end),void Q(null);J(e.start),Q(e.end??null)},[T,P]),ae=useCallback(()=>{O?o?.():z(!1)},[O,o]),re=useCallback(()=>{Animated.parallel([Animated.timing(U,{toValue:0,duration:N.motion.duration.fast,easing:Easing.bezier(...N.motion.easing.accelerate),useNativeDriver:!1}),Animated.timing(X,{toValue:0,duration:N.motion.duration.fast,easing:Easing.bezier(...N.motion.easing.accelerate),useNativeDriver:!0})]).start(()=>{ae()})},[U,ae,X,N.motion.duration.fast,N.motion.easing.accelerate]),{handleGesture:se}=useDragToDismiss({drag:Z,travel:()=>ee.current\|\|320,onDismiss:re}),oe=useCallback(()=>{!1!==P&&triggerHaptic("selection"),re()},[re,P]),ie=useCallback(()=>{Y&&K&&(!1!==P&&triggerHaptic("notificationSuccess"),s?.({start:Y,end:K}),re())},[re,s,Y,K,P]),ne=X.interpolate({inputRange:[0,1],outputRange:[320,0]}),le=useMemo(()=>Y&&K?`${formatRangePart(Y,R)} — ${formatRangePart(K,R)}`:Y?`${formatRangePart(Y,R)} — …`:"—",[Y,K,R]),de=!Y\|\|!K,ce=_jsxs(View,{style:[F.card,_,V],ref:t,accessible:!1,testID:E,children:[_jsx(GestureDetector,{gesture:se,children:_jsxs(View,{style:F.grabArea,children:[_jsx(View,{style:F.handle}),_jsxs(View,{style:F.titleRow,children:[_jsx(Text,{style:F.title,accessibilityRole:"header",children:C}),_jsx(Text,{style:F.subtitle,accessibilityLiveRegion:"polite",children:le})]})]})}),_jsx(Calendar,{mode:"range",value:Y?{start:Y,end:K??void 0}:null,onChange:te,month:G,onMonthChange:q,minDate:b,maxDate:x,disabledDates:D,markedDates:S,strikeMarkedInRange:v,weekStartsOn:j,locale:R,haptic:P,headerLabelStyle:M,navButtonStyle:B,testID:E?`${E}-grid`:void 0}),_jsxs(View,{style:F.footer,children:[_jsx(Pressable,{onPress:oe,style:({pressed:e})=>[F.footerBtn,F.footerCancel,e&&F.footerBtnPressed,A],accessibilityRole:"button",accessibilityLabel:w,children:_jsx(Text,{style:[F.footerBtnText,{color:N.colors.text.secondary}],children:w})}),_jsx(Pressable,{onPress:ie,disabled:de,style:({pressed:e})=>[F.footerBtn,F.footerConfirm,{backgroundColor:N.colors.primary,opacity:de?.5:1},e&&{backgroundColor:N.colors.primaryHover},A],accessibilityRole:"button",accessibilityLabel:k,accessibilityState:{disabled:de},"aria-disabled":de,children:_jsx(Text,{style:[F.footerBtnText,{color:N.colors.onPrimary}],children:k})})]})]}),ge=useMemo(()=>{if(!r.start\|\|!r.end)return"";const e={start:r.start,end:r.end};return h?h(e):`${e.start.toLocaleDateString()} – ${e.end.toLocaleDateString()}`},[r.start,r.end,h]);return _jsxs(_Fragment,{children:[O?null:_jsx(PickerTrigger,{label:i,placeholder:n,helperText:l,error:d,required:c,disabled:g,size:m,variant:u,clearable:f,onClear:p,value:ge,onPress:()=>z(!0),triggerStyle:y,testID:I}),_jsx(Modal,{visible:L,transparent:!0,statusBarTranslucent:!0,navigationBarTranslucent:!0,animationType:"none",onRequestClose:re,children:_jsx(ModalSafeArea,{onInsets:$,children:_jsxs(GestureHandlerRootView,{collapsable:!1,style:[F.backdrop,{backgroundColor:N.colors.background.overlay}],children:[_jsx(Pressable,{style:StyleSheet.absoluteFill,onPress:re,accessibilityLabel:"Dismiss"}),_jsx(Animated.View,{style:[F.sheetWrap,{paddingBottom:Math.max(W.bottom,N.spacing.lg),opacity:X,transform:[{translateY:Animated.add(ne,Z)}]}],onLayout:e=>{ee.current=e.nativeEvent.layout.height},accessibilityViewIsModal:!0,accessibilityRole:"none",children:ce}),_jsx(ToastHost,{})]})})})]})});DateRangePicker.displayName="DateRangePicker";const buildStyles=e=>{const t=e.shadows.lg;return StyleSheet.create({backdrop:{...StyleSheet.absoluteFill},sheetWrap:{position:"absolute",left:0,right:0,bottom:0,paddingHorizontal:e.spacing.md,paddingBottom:e.spacing.lg},card:{backgroundColor:e.colors.background.elevated,borderRadius:e.radius.xl,...smoothCorners,padding:e.spacing.lg,shadowColor:t.shadowColor,shadowOffset:t.shadowOffset,shadowOpacity:t.shadowOpacity,shadowRadius:t.shadowRadius,elevation:t.elevation},grabArea:{marginTop:-e.spacing.lg,paddingTop:e.spacing.sm},handle:{alignSelf:"center",width:36,height:4,borderRadius:e.radius.full,...smoothCorners,backgroundColor:e.colors.border.secondary,marginBottom:e.spacing.sm},titleRow:{marginBottom:e.spacing.sm},title:{fontSize:e.typography.fontSize.lg,fontWeight:e.typography.fontWeight.semibold,color:e.colors.text.primary},subtitle:{marginTop:e.spacing.xxs,fontSize:e.typography.fontSize.sm,color:e.colors.text.secondary},footer:{flexDirection:"row",justifyContent:"flex-end",alignItems:"center",marginTop:e.spacing.lg,gap:e.spacing.sm},footerBtn:{paddingHorizontal:e.spacing.lg,paddingVertical:e.spacing.sm,borderRadius:e.radius.md,...smoothCorners,minHeight:e.components.dateRangePicker?.footerButtonMinHeight??40,alignItems:"center",justifyContent:"center"},footerCancel:{backgroundColor:"transparent"},footerConfirm:{},footerBtnPressed:{opacity:.85},footerBtnText:{fontSize:e.typography.fontSize.sm,fontWeight:e.typography.fontWeight.semibold}})};export{DateRangePicker};export default DateRangePicker;

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

	@@ -1 +1 @@
1	- "use strict";import{forwardRef,useCallback,useEffect,useMemo,useRef,useState}from"react";import{Animated,Easing,Pressable,StyleSheet,Text,TextInput,View}from"react-native";import{useReducedMotion}from"../../hooks/index.js";import{createAnimatedValue,fontFor,setNativeValue,useTheme}from"../../theme/index.js";import{mergeRefs,triggerHaptic}from"../../utils/index.js";import{defaultIcons}from"../AppIcon/defaultIcons.js";import{renderSlotIcon}from"../AppIcon/slotIcon.js";import{Button}from"../Button/index.js";import{FieldBase,FieldErrorGlyph,FieldLabel,fieldTextAsString,hasFieldText,RequiredPlaceholder,resolveFieldSize,resolveFieldTextStyle}from"../FieldBase/FieldBase.js";import{useFloatingLabel}from"../FieldBase/useFloatingLabel.js";import{NotationInkContext,useNotationInk}from"../Notation/Notation.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const multilineMinHeightMap={sm:72,md:92,lg:110},Input=forwardRef((e,t)=>{const{label:i,help:o,placeholder:n,value:l,onChangeText:r,error:s,helperText:a,type:d="input",secureTextEntry:c=!1,showPasswordToggle:u=!1,disabled:f=!1,multiline:p=!1,leftIcon:g,rightIcon:m,unit:x,unitStyle:h,prefix:y,prefixStyle:S,readOnly:b=!1,action:v,actionStyle:j,size:F="md",variant:w,labelMode:z,required:T=!1,maxLength:I,showCounter:R=!0,textAlign:V,format:_,parse:k,style:A,containerStyle:C,inputStyle:N,labelStyle:D,messageStyle:H,borderRadius:L,onFocus:P,onBlur:E,accessibilityLabel:M,testID:B,editable:O,...G}=e,q=useTheme(),W=useMemo(()=>buildStyles(q),[q]),$=resolveFieldSize(q,F),X=multilineMinHeightMap[F],J=Math.round(1.4$.fontSize),K=w??q.components.input?.defaultVariant??q.components.field?.defaultVariant??"outlined",Q=z??q.components.input?.defaultLabelMode??"top",[U,Y]=useState(!1),[Z,ee]=useState(!1),te="password"===d\|\|u\|\|c,ie="password"===d\|\|u,oe="textarea"===d\|\|p,ne=oe?Math.round(.1$.fontSize):0,le="string"==typeof l&&l.length>0,re=hasFieldText(s),se=!0===s\|\|re,ae=hasFieldText(a),de=re\|\|!se&&ae,ce=hasFieldText(i),ue=hasFieldText(y),fe=!f&&!1!==O,pe=U\|\|le\|\|ue,ge=useRef(null),me=useMemo(()=>mergeRefs(ge,t),[t]),xe=useCallback(()=>{fe&&ge.current?.focus()},[fe]),he=ce&&"float"===Q,ye=useRef(createAnimatedValue(0)).current,Se=useRef(createAnimatedValue(de?1:0)).current;useEffect(()=>{const e=Animated.timing(Se,{toValue:de?1:0,duration:q.motion.duration.fast,easing:Easing.bezier(...q.motion.easing.standard),useNativeDriver:!0});return e.start(),()=>e.stop()},[de,Se,q.motion.duration.fast,q.motion.easing.standard]);const be=useReducedMotion(),ve=q.components.input?.shakeOnError??!1,je=useRef(se);useEffect(()=>{if(!ve)return void(je.current=se);let e;return se&&!je.current&&(be\|\|(setNativeValue(ye,0),e=Animated.sequence([Animated.timing(ye,{toValue:1,duration:50,useNativeDriver:!0}),Animated.timing(ye,{toValue:-1,duration:50,useNativeDriver:!0}),Animated.timing(ye,{toValue:1,duration:50,useNativeDriver:!0}),Animated.timing(ye,{toValue:-1,duration:50,useNativeDriver:!0}),Animated.timing(ye,{toValue:0,duration:100,useNativeDriver:!0})]),e.start()),triggerHaptic("notificationError")),je.current=se,()=>e?.stop()},[se,ye,ve,be]);const Fe=useCallback(e=>{Y(!0),P?.(e)},[P]),we=useCallback(e=>{Y(!1),E?.(e)},[E]),ze=useCallback(()=>{triggerHaptic("selection"),ee(e=>!e)},[]),Te=useMemo(()=>{const e=q.components.input?.fillColors?.[K];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},[q.components.input?.fillColors,K]),Ie=q.colors.field.caret,Re=L??q.components.input?.borderRadius,Ve=q.components.input?.tintLabelOnFocus??!1,_e=U&&Ve?q.colors.field.borderFocused:q.colors.field.label,ke=ye.interpolate({inputRange:[-1,0,1],outputRange:[-6,0,6]}),Ae=Boolean(m)\|\|Boolean(x)\|\|ie,Ce="underline"===K,Ne=g?$.iconSize+q.spacing.md+1+q.spacing.md:0,De=useFloatingLabel({label:i,enabled:he,floated:pe,required:T,variant:K,sizeTokens:$,leadingOffset:Ne,trailingOffset:Ae?$.iconSize+q.spacing.sm:0,textAlign:V,paddingLeft:Ce?0:$.paddingHorizontal,lineHeight:oe?J:void 0,restNudge:ne,floatTrim:oe?2:0,color:_e,style:D}),He=resolveFieldTextStyle(q,{disabled:f}),Le~~=He~~.color,Pe=He.placeholderColor,Ee=T&&!ce&&!le&&"string"==typeof n&&n.length>0,Me=se?s:a,Be=R&&"number"==typeof I&&"string"==typeof l?`${l.length} / ${I}`:null,Oe=se?q.colors.field.message:q.colors.text.secondary,Ge=useNotationInk(H,$.messageFontSize,Oe),qe=M??fieldTextAsString(i)??n~~,We~~=q.colors.field~~,$e~~=f~~?We~~.iconDisabled:U~~?We~~.iconFocused~~:We~~.icon,Xe={focused:U,disabled:f,error:se,color~~:$e~~,size:$.iconSize},renderSlot=e=>renderSlotIcon(e,Xe),Je=(()=>{if(ie){const e=(Z?q.icons?.eyeOff:q.icons?.eye)??(Z?defaultIcons.eyeOff:defaultIcons.eye);return _jsx(Pressable,{onPress:ze,disabled:!fe,hitSlop:8,accessibilityRole:"button",accessibilityLabel:Z?"Hide password":"Show password",children:e({size:$.iconSize,color~~:$e~~})})}const e=x?_jsx(Text,{style:[W.unit,{fontSize:$.fontSize,color:Pe},h],children:x}):null,t=m?_jsx(View,{children:renderSlot(m)}):null;return e&&t?_jsxs(View,{style:W.trailingRow,children:[e,t]}):e??t})(),Ke=g?_jsx(View,{children:renderSlot(g)}):null,Qe=StyleSheet.flatten(S),Ue~~=Qe~~?.fontSize??$.fontSize,Ye=Qe?.color??Pe,Ze=useMemo(()=>({fontSize:Ue,color:Ye}),[Ue,Ye]),et=ue?"string"==typeof y\|\|"number"==typeof y?_jsx(Text,{style:[W.prefix,{fontSize:$.fontSize,color:Pe,marginRight:q.spacing.xs,lineHeight:oe?J:void 0,paddingTop:oe?ne:void 0},S],children:y}):_jsx(View,{style:[W.prefixNode,{marginRight:q.spacing.xs,minHeight:oe?J:void 0,justifyContent:"center",paddingTop:oe?ne:void 0}],children:_jsx(Text,{style:[W.prefix,{fontSize:$.fontSize,color:Pe,lineHeight:oe?J:void 0},S],children:_jsx(NotationInkContext.Provider,{value:Ze,children:y})})}):null,tt=v?_jsx(Button,{variant:v.variant??"outline",tone:v.tone??"primary",size:F,title:v.label,leftIcon:v.icon,loading:v.loading,disabled:f\|\|v.disabled,onPress:v.onPress,pressAnimation:!1,testID:v.testID,style:[W.action,{minHeight:$.minHeight,alignSelf:oe?"flex-start":"stretch"},j]}):null;return _jsxs(Animated.View,{style:[W.container,{transform:[{translateX:ke}]},A],children:[ce&&!he?_jsx(FieldLabel,{size:F,required:T,help:o,color:_e,style:D,children:i}):null,_jsxs(View,{style:[W.fieldRow,{columnGap:q.spacing.sm,alignItems:oe?"flex-start":"stretch"}],children:[_jsxs(View,{style:W.fieldWrapper,children:[_jsxs(FieldBase,{size:F,variant:K,focused:U,disabled:f,error:se,filled:le,minHeight:oe?X:void 0,borderRadius:Re,fillOverrides:Te,leading:Ke,leadingDivider:null!=g,paddingLeft:Ce?0:void 0,trailing:Je,slotAlign:oe?"top":"center",slotLineHeight:oe?J:void 0,topNotch:De.topNotch,onPress:xe,pressFeedback:!1,style:C,children:[et,_jsxs(View,{style:W.inputWrap,children:[_jsx(TextInput,{ref:me,style:[W.input,{color:Le,fontSize:$.fontSize,...He.weightStyle,paddingLeft:Ce?0:void 0,minHeight:oe?X-2*$.paddingVertical:void 0,lineHeight:oe?J:void 0,paddingTop:oe?ne:void 0,textAlignVertical:oe?"top":"center"},N],textAlign:V,placeholder:he&&!pe\|\|Ee?void 0:n,placeholderTextColor:Pe,value:_&&null!=l?_(l):l,onChangeText:e=>{r&&r(k?k(e):e)},onFocus:Fe,onBlur:we,editable:fe,readOnly:b,secureTextEntry:te&&!Z,multiline:oe,autoCapitalize:te?"none":void 0,autoCorrect:!te&&void 0,maxLength:I,selectionColor:Ie,accessibilityLabel:qe,accessibilityState:{disabled:f},"aria-disabled":f,testID:B,...G}),Ee?_jsx(RequiredPlaceholder,{text:n,color:Pe,fontSize:$.fontSize,weightStyle:He.weightStyle,align:oe?"top":"center",paddingTop:oe?ne:void 0,textAlign:V}):null]})]}),De.node]}),tt]}),de\|\|Be?_jsxs(View,{style:[W.footerRow,{marginTop:$.messageGap}],children:[de?_jsxs(Animated.View,{style:[W.messageRow,{columnGap:q.spacing.xs+2,opacity:Se}],accessibilityLiveRegion:se?"polite":"none",children:[se?_jsx(FieldErrorGlyph,{size:$.messageFontSize,color:Oe}):null,_jsx(Text,{style:[W.messageText,{color:Oe,fontSize:$.messageFontSize,...fontFor(q,"normal")},H],children:_jsx(NotationInkContext.Provider,{value:Ge,children:Me})})]}):_jsx(View,{style:W.footerSpacer}),Be?_jsx(Text,{style:[W.counterText,{color:q.colors.text.tertiary,fontSize:$.messageFontSize,...fontFor(q,"normal")}],children:Be}):null]}):null]})});Input.displayName="Input";const buildStyles=e=>StyleSheet.create({container:{width:"100%"},fieldRow:{flexDirection:"row"},fieldWrapper:{position:"relative",overflow:"visible",flex:1},action:{flexShrink:0},input:{padding:0,margin:0,includeFontPadding:!1},prefix:{flexShrink:0,includeFontPadding:!1},prefixNode:{flexShrink:0},inputWrap:{flex:1,alignSelf:"stretch",justifyContent:"center"},unit:{includeFontPadding:!1},trailingRow:{flexDirection:"row",alignItems:"center",columnGap:8},footerRow:{flexDirection:"row",alignItems:"center",justifyContent:"space-between",columnGap:8},footerSpacer:{flex:1},messageRow:{flex:1,flexDirection:"row",alignItems:"center"},messageText:{flexShrink:1,includeFontPadding:!1},counterText:{flexShrink:0,includeFontPadding:!1}});export{Input};export default Input;
1	+ "use strict";import{forwardRef,useCallback,useEffect,useMemo,useRef,useState}from"react";import{Animated,Easing,Pressable,StyleSheet,Text,TextInput,View}from"react-native";import{useReducedMotion}from"../../hooks/index.js";import{createAnimatedValue,fontFor,setNativeValue,useTheme}from"../../theme/index.js";import{mergeRefs,triggerHaptic}from"../../utils/index.js";import{defaultIcons}from"../AppIcon/defaultIcons.js";import{renderSlotIcon}from"../AppIcon/slotIcon.js";import{Button}from"../Button/index.js";import{FieldBase,FieldErrorGlyph,FieldLabel,fieldTextAsString,hasFieldText,RequiredPlaceholder,resolveFieldSize,resolveFieldTextStyle}from"../FieldBase/FieldBase.js";import{useFloatingLabel}from"../FieldBase/useFloatingLabel.js";import{NotationInkContext,useNotationInk}from"../Notation/Notation.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const multilineMinHeightMap={sm:72,md:92,lg:110},Input=forwardRef((e,t)=>{const{label:i,help:o,placeholder:n,value:l,onChangeText:r,error:s,helperText:a,type:d="input",secureTextEntry:c=!1,showPasswordToggle:u=!1,disabled:f=!1,multiline:p=!1,leftIcon:g,rightIcon:m,unit:x,unitStyle:h,prefix:y,prefixStyle:S,readOnly:b=!1,action:v,actionStyle:j,size:F="md",variant:w,labelMode:z,required:T=!1,maxLength:I,showCounter:R=!0,textAlign:V,format:_,parse:k,style:A,containerStyle:C,inputStyle:N,labelStyle:D,messageStyle:H,borderRadius:L,onFocus:P,onBlur:E,accessibilityLabel:M,testID:B,editable:O,...G}=e,q=useTheme(),W=useMemo(()=>buildStyles(q),[q]),$=resolveFieldSize(q,F),X=multilineMinHeightMap[F],J=Math.round(1.4$.fontSize),K=w??q.components.input?.defaultVariant??q.components.field?.defaultVariant??"outlined",Q=z??q.components.input?.defaultLabelMode??"top",[U,Y]=useState(!1),[Z,ee]=useState(!1),te="password"===d\|\|u\|\|c,ie="password"===d\|\|u,oe="textarea"===d\|\|p,ne=oe?Math.round(.1$.fontSize):0,le="string"==typeof l&&l.length>0,re=hasFieldText(s),se=!0===s\|\|re,ae=hasFieldText(a),de=re\|\|!se&&ae,ce=hasFieldText(i),ue=hasFieldText(y),fe=!f&&!1!==O,pe=U\|\|le\|\|ue,ge=useRef(null),me=useMemo(()=>mergeRefs(ge,t),[t]),xe=useCallback(()=>{fe&&ge.current?.focus()},[fe]),he=ce&&"float"===Q,ye=useRef(createAnimatedValue(0)).current,Se=useRef(createAnimatedValue(de?1:0)).current;useEffect(()=>{const e=Animated.timing(Se,{toValue:de?1:0,duration:q.motion.duration.fast,easing:Easing.bezier(...q.motion.easing.standard),useNativeDriver:!0});return e.start(),()=>e.stop()},[de,Se,q.motion.duration.fast,q.motion.easing.standard]);const be=useReducedMotion(),ve=q.components.input?.shakeOnError??!1,je=useRef(se);useEffect(()=>{if(!ve)return void(je.current=se);let e;return se&&!je.current&&(be\|\|(setNativeValue(ye,0),e=Animated.sequence([Animated.timing(ye,{toValue:1,duration:50,useNativeDriver:!0}),Animated.timing(ye,{toValue:-1,duration:50,useNativeDriver:!0}),Animated.timing(ye,{toValue:1,duration:50,useNativeDriver:!0}),Animated.timing(ye,{toValue:-1,duration:50,useNativeDriver:!0}),Animated.timing(ye,{toValue:0,duration:100,useNativeDriver:!0})]),e.start()),triggerHaptic("notificationError")),je.current=se,()=>e?.stop()},[se,ye,ve,be]);const Fe=useCallback(e=>{Y(!0),P?.(e)},[P]),we=useCallback(e=>{Y(!1),E?.(e)},[E]),ze=useCallback(()=>{triggerHaptic("selection"),ee(e=>!e)},[]),Te=useMemo(()=>{const e=q.components.input?.fillColors?.[K];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},[q.components.input?.fillColors,K]),Ie=q.colors.field.caret,Re=L??q.components.input?.borderRadius,Ve=q.components.input?.tintLabelOnFocus??!1,ke=U&&Ve?q.colors.field.borderFocused:q.colors.field.label,Ae=ye.interpolate({inputRange:[-1,0,1],outputRange:[-6,0,6]}),Ce=Boolean(m)\|\|Boolean(x)\|\|ie,Ne="underline"===K,De=g?$.iconSize+q.spacing.md+1+q.spacing.md:0,He=useFloatingLabel({label:i,enabled:he,floated:pe,required:T,variant:K,sizeTokens:$,leadingOffset:De,trailingOffset:Ce?$.iconSize+q.spacing.sm:0,textAlign:V,paddingLeft:Ne?0:$.paddingHorizontal,lineHeight:oe?J:void 0,restNudge:ne,floatTrim:oe?2:0,color:ke,style:D}),Le=resolveFieldTextStyle(q,{disabled:f}),Pe=Le.color,Ee=Le.placeholderColor,Me=T&&!ce&&!le&&"string"==typeof n&&n.length>0,Be=se?s:a,Oe=R&&"number"==typeof I&&"string"==typeof l?`${l.length} / ${I}`:null,Ge=se?q.colors.field.message:q.colors.text.secondary,qe=useNotationInk(H,$.messageFontSize,Ge),We=M??fieldTextAsString(i)??n,$e=q.colors.field,Xe=f?$e.iconDisabled:U?$e.iconFocused:$e.icon,Je={focused:U,disabled:f,error:se,color:Xe,size:$.iconSize},renderSlot=e=>renderSlotIcon(e,Je),Ke=(()=>{if(ie){const e=(Z?q.icons?.eyeOff:q.icons?.eye)??(Z?defaultIcons.eyeOff:defaultIcons.eye);return _jsx(Pressable,{onPress:ze,disabled:!fe,hitSlop:8,accessibilityRole:"button",accessibilityLabel:Z?"Hide password":"Show password",children:e({size:$.iconSize,color:Xe})})}const e=x?_jsx(Text,{style:[W.unit,{fontSize:$.fontSize,color:Ee},h],children:x}):null,t=m?_jsx(View,{children:renderSlot(m)}):null;return e&&t?_jsxs(View,{style:W.trailingRow,children:[e,t]}):e??t})(),Qe=g?_jsx(View,{children:renderSlot(g)}):null,Ue=StyleSheet.flatten(S),Ye=Ue?.fontSize??$.fontSize,Ze=Ue?.color??Ee,et=useMemo(()=>({fontSize:Ye,color:Ze}),[Ye,Ze]),tt=ue?"string"==typeof y\|\|"number"==typeof y?_jsx(Text,{style:[W.prefix,{fontSize:$.fontSize,color:Ee,marginRight:q.spacing.xs,lineHeight:oe?J:void 0,paddingTop:oe?ne:void 0},S],children:y}):_jsx(View,{style:[W.prefixNode,{marginRight:q.spacing.xs,minHeight:oe?J:void 0,justifyContent:"center",paddingTop:oe?ne:void 0}],children:_jsx(Text,{style:[W.prefix,{fontSize:$.fontSize,color:Ee,lineHeight:oe?J:void 0},S],children:_jsx(NotationInkContext.Provider,{value:et,children:y})})}):null,it=v?_jsx(Button,{variant:v.variant??"outline",tone:v.tone??"primary",size:F,title:v.label,leftIcon:v.icon,loading:v.loading,disabled:f\|\|v.disabled,onPress:v.onPress,pressAnimation:!1,testID:v.testID,style:[W.action,{minHeight:$.minHeight,alignSelf:oe?"flex-start":"stretch"},j]}):null;return _jsxs(Animated.View,{style:[W.container,{transform:[{translateX:Ae}]},A],children:[ce&&!he?_jsx(FieldLabel,{size:F,required:T,help:o,color:ke,style:D,children:i}):null,_jsxs(View,{style:[W.fieldRow,{columnGap:q.spacing.sm,alignItems:oe?"flex-start":"stretch"}],children:[_jsxs(View,{style:W.fieldWrapper,children:[_jsxs(FieldBase,{size:F,variant:K,focused:U,disabled:f,error:se,filled:le,minHeight:oe?X:void 0,borderRadius:Re,fillOverrides:Te,leading:Qe,leadingDivider:null!=g,paddingLeft:Ne?0:void 0,trailing:Ke,slotAlign:oe?"top":"center",slotLineHeight:oe?J:void 0,topNotch:He.topNotch,onPress:xe,pressFeedback:!1,style:C,children:[tt,_jsxs(View,{style:W.inputWrap,children:[_jsx(TextInput,{ref:me,style:[W.input,{color:Pe,fontSize:$.fontSize,...Le.weightStyle,paddingLeft:Ne?0:void 0,minHeight:oe?X-2*$.paddingVertical:void 0,lineHeight:oe?J:void 0,paddingTop:oe?ne:void 0,textAlignVertical:oe?"top":"center"},N],textAlign:V,placeholder:he&&!pe\|\|Me?void 0:n,placeholderTextColor:Ee,value:_&&null!=l?_(l):l,onChangeText:e=>{r&&r(k?k(e):e)},onFocus:Fe,onBlur:we,editable:fe,readOnly:b,secureTextEntry:te&&!Z,multiline:oe,autoCapitalize:te?"none":void 0,autoCorrect:!te&&void 0,maxLength:I,selectionColor:Ie,accessibilityLabel:We,accessibilityState:{disabled:f},"aria-disabled":f,testID:B,...G}),Me?_jsx(RequiredPlaceholder,{text:n,color:Ee,fontSize:$.fontSize,weightStyle:Le.weightStyle,align:oe?"top":"center",paddingTop:oe?ne:void 0,textAlign:V}):null]})]}),He.node]}),it]}),de\|\|Oe?_jsxs(View,{style:[W.footerRow,{marginTop:$.messageGap}],children:[de?_jsxs(Animated.View,{style:[W.messageRow,{columnGap:q.spacing.xs+2,opacity:Se}],accessibilityLiveRegion:se?"polite":"none",children:[se?_jsx(FieldErrorGlyph,{size:$.messageFontSize,color:Ge}):null,_jsx(Text,{style:[W.messageText,{color:Ge,fontSize:$.messageFontSize,...fontFor(q,"normal")},H],children:_jsx(NotationInkContext.Provider,{value:qe,children:Be})})]}):_jsx(View,{style:W.footerSpacer}),Oe?_jsx(Text,{style:[W.counterText,{color:q.colors.text.tertiary,fontSize:$.messageFontSize,...fontFor(q,"normal")}],children:Oe}):null]}):null]})});Input.displayName="Input";const buildStyles=e=>StyleSheet.create({container:{width:"100%"},fieldRow:{flexDirection:"row"},fieldWrapper:{position:"relative",overflow:"visible",flex:1},action:{flexShrink:0},input:{padding:0,margin:0,includeFontPadding:!1},prefix:{flexShrink:0,includeFontPadding:!1},prefixNode:{flexShrink:0},inputWrap:{flex:1,alignSelf:"stretch",justifyContent:"center"},unit:{includeFontPadding:!1},trailingRow:{flexDirection:"row",alignItems:"center",columnGap:8},footerRow:{flexDirection:"row",alignItems:"center",justifyContent:"space-between",columnGap:8},footerSpacer:{flex:1},messageRow:{flex:1,flexDirection:"row",alignItems:"center"},messageText:{flexShrink:1,includeFontPadding:!1},counterText:{flexShrink:0,includeFontPadding:!1}});export{Input};export default Input;

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

	@@ -1 +1 @@
1	- "use strict";import{useEffect,useMemo,useRef,useState}from"react";import{AccessibilityInfo,Animated,BackHandler,Easing,StyleSheet}from"react-native";import{useReducedMotion}from"../../hooks/useReducedMotion.js";import{createAnimatedValue,useTheme}from"../../theme/index.js";import{Spinner}from"../Spinner/index.js";import{jsx as _jsx}from"react/jsx-runtime";const DEFAULT_SHOW_DELAY_MS=150,DEFAULT_MIN_VISIBLE_MS=400;let state={refCount:0,message:void 0};const listeners=new Set,notify=()=>{for(const e of listeners)e()},subscribe=e=>(listeners.add(e),()=>{listeners.delete(e)}),getState=()=>state,show=e=>{state={refCount:state.refCount+1,message:e??state.message},notify()},hide=()=>{if(state.refCount<=0)return;const e=state.refCount-1;state={refCount:e,message:0===e?void 0:state.message},notify()},reset=()=>{0===state.refCount&&void 0===state.message\|\|(state={refCount:0,message:void 0},notify())},isVisible=()=>state.refCount>0,wrap=async(e,t)=>{show(t);try{return await("function"==typeof e?e():e)}finally{hide()}};export const loader={show:show,hide:hide,wrap:wrap,isVisible:isVisible,reset:reset};export const useLoader=()=>loader;export const LoaderOverlay=({renderIndicator:e,backdropColor:t,showDelayMs:s=150,minVisibleMs:r=400,testID:n})=>{const i=useTheme(),o=useReducedMotion(),~~[u,~~a]=~~useState~~(getState),[c,l]=useState(!1),f=useRef(~~!1),d=useRef(~~null),m=useRef(null),y=useRef(null),b=useRef(createAnimatedValue(0)).current~~;useEffect(()=>subscribe(()=>a(getState()))~~,~~[]),useEffect(()=>{f.current~~=~~c},[c]);const g=u~~.refCount>0;useEffect(()=>{if(g)return null!==m.current&&(clearTimeout(m.current),m.current=null),void(~~f.current~~\|\|null!==d.current\|\|(d.current=setTimeout(()=>{d.current=null,y.current=Date.now(),l(!0)},s)));if(null!==d.current~~)return~~ clearTimeout(d.current),~~void(d~~.current=null)~~;if(f.current~~&&null===m.current){const e=null!==y.current?Date.now()-y.current:r,t=Math.max(0,r-e);m.current=setTimeout(()=>{m.current=null,y.current=null,l(!1)},t)}},[g,s,r]),useEffect(()=>()=>{null!==d.current&&clearTimeout(d.current),null!==m.current&&clearTimeout(m.current)},[]),useEffect(()=>{c?o?b.setValue(1):Animated.timing(b,{toValue:1,duration:i.motion.duration.normal,easing:Easing.bezier(...i.motion.easing.standard),useNativeDriver:!0}).start():b.setValue(0)},[c,o,b,i]),useEffect(()=>{if(!c)return;const e=BackHandler.addEventListener("hardwareBackPress",()=>!0);return()=>{e.remove()}},[c]);const S=u.message;useEffect(()=>{c&&S&&AccessibilityInfo.announceForAccessibility(S)},[c,S]);const p=useMemo(()=>buildStyles(),[]);return c?_jsx(Animated.View,{pointerEvents:"auto",testID:n,accessible:!0,accessibilityViewIsModal:!0,accessibilityLiveRegion:"polite",accessibilityLabel:S??"Loading",accessibilityRole:"progressbar",accessibilityState:{busy:!0},"aria-busy":!0,style:[p.overlay,{backgroundColor:t??i.colors.background.overlay,opacity:b}],children:e?e(S):_jsx(Spinner,{size:"lg",message:S})}):null};const buildStyles=()=>StyleSheet.create({overlay:{...StyleSheet.absoluteFill,alignItems:"center",justifyContent:"center",zIndex:1e3}});
1	+ "use strict";import{useEffect,useMemo,useRef,useState,useSyncExternalStore}from"react";import{AccessibilityInfo,Animated,BackHandler,Easing,StyleSheet}from"react-native";import{useReducedMotion}from"../../hooks/useReducedMotion.js";import{createAnimatedValue,useTheme}from"../../theme/index.js";import{Spinner}from"../Spinner/index.js";import{jsx as _jsx}from"react/jsx-runtime";const DEFAULT_SHOW_DELAY_MS=150,DEFAULT_MIN_VISIBLE_MS=400;let state={refCount:0,message:void 0};const listeners=new Set,notify=()=>{for(const e of listeners)e()},subscribe=e=>(listeners.add(e),()=>{listeners.delete(e)}),getState=()=>state,show=e=>{state={refCount:state.refCount+1,message:e??state.message},notify()},hide=()=>{if(state.refCount<=0)return;const e=state.refCount-1;state={refCount:e,message:0===e?void 0:state.message},notify()},reset=()=>{0===state.refCount&&void 0===state.message\|\|(state={refCount:0,message:void 0},notify())},isVisible=()=>state.refCount>0,wrap=async(e,t)=>{show(t);try{return await("function"==typeof e?e():e)}finally{hide()}};export const loader={show:show,hide:hide,wrap:wrap,isVisible:isVisible,reset:reset};export const useLoader=()=>loader;export const LoaderOverlay=({renderIndicator:e,backdropColor:t,showDelayMs:s=150,minVisibleMs:r=400,testID:n})=>{const i=useTheme(),o=useReducedMotion(),a=useSyncExternalStore(subscribe,getState),[u,l]=useState(!1),c=useRef(null),f=useRef(null),d=useRef(null),m=useRef(createAnimatedValue(0)).current,y=a.refCount>0;useEffect(()=>{if(y)return null!==f.current&&(clearTimeout(f.current),f.current=null),void(u\|\|null!==c.current\|\|(c.current=setTimeout(()=>{c.current=null,0!==getState().refCount&&(d.current=Date.now(),l(!0))},s)));if(null!==c.current&&(clearTimeout(c.current),c.current=null),u&&null===f.current){const e=null!==d.current?Date.now()-d.current:r,t=Math.max(0,r-e);f.current=setTimeout(()=>{f.current=null,d.current=null,l(!1)},t)}},[y,u,s,r]),useEffect(()=>()=>{null!==c.current&&clearTimeout(c.current),null!==f.current&&clearTimeout(f.current)},[]),useEffect(()=>{u?o?m.setValue(1):Animated.timing(m,{toValue:1,duration:i.motion.duration.normal,easing:Easing.bezier(...i.motion.easing.standard),useNativeDriver:!0}).start():m.setValue(0)},[u,o,m,i]),useEffect(()=>{if(!u)return;const e=BackHandler.addEventListener("hardwareBackPress",()=>!0);return()=>{e.remove()}},[u]);const b=a.message;useEffect(()=>{u&&b&&AccessibilityInfo.announceForAccessibility(b)},[u,b]);const S=useMemo(()=>buildStyles(),[]);return u?_jsx(Animated.View,{pointerEvents:"auto",testID:n,accessible:!0,accessibilityViewIsModal:!0,accessibilityLiveRegion:"polite",accessibilityLabel:b??"Loading",accessibilityRole:"progressbar",accessibilityState:{busy:!0},"aria-busy":!0,style:[S.overlay,{backgroundColor:t??i.colors.background.overlay,opacity:m}],children:e?e(b):_jsx(Spinner,{size:"lg",message:b})}):null};const buildStyles=()=>StyleSheet.create({overlay:{...StyleSheet.absoluteFill,alignItems:"center",justifyContent:"center",zIndex:1e3}});

package/lib/module/components/Menu/MenuSurface.js CHANGED Viewed

	@@ -1 +1 @@
1	- "use strict";import{useCallback,useEffect,useMemo,useRef,useState}from"react";import{Animated,Easing,Modal,Platform,Pressable,ScrollView,StyleSheet,useWindowDimensions,View}from"react-native";import{useSafeAreaInsets}from"react-native-safe-area-context";import{useReducedMotion}from"../../hooks/useReducedMotion.js";import{createAnimatedValue,setNativeValue,useTheme}from"../../theme/index.js";import{smoothCorners}from"../../utils/corners.js";import{resolveHaptic,triggerHaptic}from"../../utils/hapticUtils.js";import{claimAnchoredSurface,computePlacement,PLACEMENT_MARGIN,placementRoom}from"../../utils/placement.js";import{Breakpoints}from"../../utils/responsive.js";import{AppIcon}from"../AppIcon/AppIcon.js";import{renderSlotIcon}from"../AppIcon/slotIcon.js";import{Divider}from"../Divider/index.js";import{OptionSheet}from"../OptionSheet/index.js";import{Text}from"../Text/index.js";import{ToastHost}from"../Toast/ToastProvider.js";import{FOCUS_DELAY_MS,focusHost}from"./focusHost.js";import{visibleGroups,visibleTopActions,wantsSheet}from"./menuModel.js";import{webOnly}from"./webOnly.js";import{jsx as _jsx,jsxs as _jsxs,Fragment as _Fragment}from"react/jsx-runtime";const MENU_MIN_WIDTH=180,MENU_MAX_WIDTH=280,ROW_MIN_HEIGHT=48,TOP_ACTION_MIN_HEIGHT=64,ICON_SIZE=20,PREVIEW_LIFT=1.02,BACK_KEY="__menu-back",TOP_PREFIX="__menu-top:",WEB_CHECKABLE_ROLE=webOnly({role:"menuitemcheckbox"});export const MenuSurface=e=>{const{open:t,anchor:s,items:i,title:o,topActions:r,placement:n,presentation:l,unavailable:a,context:c=!1,preview:u,onClose:d,restoreFocusTo:m,haptic:p,accessibilityLabel:b,closeLabel:f,backLabel:h,testID:y}=e,x=useTheme(),g=useMemo(()=>buildStyles(x),[x]),_=useSafeAreaInsets(),v=useWindowDimensions(),w=useReducedMotion(),j=useMemo(()=>visibleGroups(i,a),[i,a]),A=useMemo(()=>visibleTopActions(r,a),[r,a]),k="sheet"===l\|\|"auto"===l&&v.width<Breakpoints.lg&&wantsSheet(j,A),[I,S]=useState(null),[E,R]=useState(null),T=useRef(d);T.current=d;const C=useRef(m);C.current=m;const L=useRef(null),D=useRef(!1),M=useRef(!1),O=useRef(new Map),P=useRef(null),H=useCallback(()=>{if(!D.current)return;D.current=!1;const e=L.current;L.current=null,e?e():focusHost(C.current?.())},[]);useEffect(()=>{if(t)return M.current=!0,D.current=!1,L.current=null,claimAnchoredSurface(()=>T.current());M.current&&(M.current=!1,D.current=!0,S(null),R(null),k\|\|"ios"===Platform.OS\|\|H())},[t]);const V=useCallback(e=>{if(e.disabled)return;const t=resolveHaptic(p,"selection");t&&triggerHaptic(t),e.key!==BACK_KEY?e.submenu?S(e):(L.current=e.onPress??null,T.current()):S(null)},[p]),B=useMemo(()=>({width:v.width,height:v.height,insets:_}),[v.width,v.height,_]),N=useMemo(()=>{if(!s\|\|!E)return null;const e=s.x+s.width/2>B.width/2?"end":"start";return computePlacement(s,E,B,n,{align:e})},[s,E,B,n]);let F=B.height-_.top-_.bottom-2PLACEMENT_MARGIN;if(s&&N){const e=placementRoom(s,B);F="top"===N.placement?e.above:e.below}const K=Math.min(280,B.width-_.left-_.right-2PLACEMENT_MARGIN),W=t&&null!==N,G=useRef(createAnimatedValue(0)).current,z=useRef(createAnimatedValue(1)).current;useEffect(()=>{if(!W)return setNativeValue(G,0),void setNativeValue(z,1);const e=[Animated.timing(G,{toValue:1,duration:x.motion.duration.fast,easing:Easing.bezier(...x.motion.easing.decelerate),useNativeDriver:!0})];c&&!w&&e.push(Animated.spring(z,{toValue:1.02,damping:x.motion.spring.snappy.damping,stiffness:x.motion.spring.snappy.stiffness,mass:x.motion.spring.snappy.mass,useNativeDriver:!0}));const t=Animated.parallel(e);return t.start(),()=>t.stop()},[W,c,w,G,z,x.motion]);const $=useCallback(e=>{const{width:t,height:s}=e.nativeEvent.layout;R(e=>e&&e.width===t&&e.height===s?e:{width:t,height:s})},[]),Y=c&&"top"===N?.placement,U=I?.submenu?[I.submenu]:j,X=Y?[...U].reverse().map(e=>[...e].reverse()):U,q=[];if(I)q.push({key:BACK_KEY,label:I.label});else for(const e of A)q.push({key:`${TOP_PREFIX}${e.key}`,label:e.label,item:e});for(const e of X)for(const t of e)q.push({key:t.key,label:t.label,item:t});const Z=q[0]?.key;useEffect(()=>{if(!W\|\|k\|\|!Z)return;const e=setTimeout(()=>focusHost(O.current.get(Z)),FOCUS_DELAY_MS);return()=>clearTimeout(e)},[W,k,Z]);const setItemRef=e=>t=>{t?O.current.set(e,t):O.current.delete(e)},J=webOnly({onKeyDown:e=>{const t=e.key??e.nativeEvent?.key??"",s=q.length,i=q.findIndex(e=>e.key===P.current);let o=-1;if("ArrowDown"===t)o=(i+1)%s;else if("ArrowUp"===t)o=i<=0?s-1:i-1;else if("Home"===t)o=0;else if("End"===t)o=s-1;else{if("ArrowLeft"===t&&I)return e.preventDefault?.(),void S(null);if("ArrowRight"===t&&q[i]?.item?.submenu)return e.preventDefault?.(),void V(q[i].item);if(1===t.length&&""!==t.trim()){const e=t.toLowerCase();for(let t=1;t<=s;t+=1){const r=(i+t)%s;if(q[r].label.toLowerCase().startsWith(e)){o=r;break}}}}o>=0&&(e.preventDefault?.(),(e=>{const t=q[e];t&&focusHost(O.current.get(t.key))})(o))}});if(k){const e=I?.submenu?[{key:BACK_KEY,label:h,icon:"chevron-left"},...I.submenu]:[...A,...j.flat()],s=new Set(e.filter(e=>e.checked).map(e=>e.key));return _jsx(OptionSheet,{open:t,onClose:d,onAfterClose:H,title:I?.label??o,options:e,labelOf:e=>e.label,getValue:e=>e.key,disabledOf:e=>Boolean(e.disabled),destructiveOf:e=>Boolean(e.destructive),descriptionOf:e=>e.description,iconOf:e=>{const t=e;return renderSlotIcon(t.icon,{color:t.destructive?x.colors.toneText.error:x.colors.text.secondary,size:20,disabled:Boolean(t.disabled)})},isSelected:e=>s.has(String(e)),onSelect:e=>V(e),accessibilityLabel:b??o,testID:y?`${y}-sheet`:void 0})}const inkFor=e=>e.disabled?x.colors.text.disabled:e.destructive?x.colors.toneText.error:x.colors.text.primary,Q=_jsxs(_Fragment,I?{children:[_jsxs(Pressable,{ref:setItemRef(BACK_KEY),onPress:()=>S(null),onFocus:()=>{P.current=BACK_KEY},accessibilityRole:"menuitem",accessibilityLabel:`${h}, ${I.label}`,android_ripple:{color:x.colors.surface.pressed,borderless:!1},style:({pressed:e})=>[g.row,e?g.pressed:null],children:[_jsx(View,{style:g.icon,children:_jsx(AppIcon,{name:"chevron-left",size:20,color:x.colors.text.secondary})}),_jsx(Text,{variant:"body",weight:"semibold",numberOfLines:1,style:g.labels,children:I.label})]}),_jsx(Divider,{spacing:"none"})]}:{children:[o?_jsx(Text,{variant:"caption",color:"secondary",accessibilityRole:"header",numberOfLines:2,style:g.title,children:o}):null,A.length>0?_jsxs(_Fragment,{children:[_jsx(View,{style:g.topRow,children:A.map(e=>{const t=`${TOP_PREFIX}${e.key}`,s=Boolean(e.disabled),i=inkFor(e);return _jsxs(Pressable,{ref:setItemRef(t),onPress:()=>V(e),onFocus:()=>{P.current=t},disabled:s,accessibilityRole:"menuitem",accessibilityLabel:e.accessibilityLabel??e.label,accessibilityState:{disabled:s},"aria-disabled":s,testID:e.testID,style:({pressed:e})=>[g.topAction,e?g.pressed:null],children:[renderSlotIcon(e.icon,{color:i,size:20,disabled:s}),_jsx(Text,{variant:"caption",color:i,numberOfLines:1,children:e.label})]},t)})}),_jsx(Divider,{spacing:"none"})]}):null]});return _jsxs(Modal,{visible:t,transparent:!0,statusBarTranslucent:!0,presentationStyle:"overFullScreen",animationType:"none",onRequestClose:d,onDismiss:H,children:[_jsx(Pressable,{style:[StyleSheet.absoluteFill,c?g.scrim:null],onPress:d,accessibilityRole:"button",accessibilityLabel:f,testID:y?`${y}-scrim`:void 0}),c&&u&&s?_jsx(Animated.View,{pointerEvents:"none",accessibilityElementsHidden:!0,importantForAccessibility:"no-hide-descendants",style:[g.preview,{left:s.x,top:s.y,width:s.width,height:s.height,transform:[{scale:z}]}],children:u}):null,_jsx(Animated.View,{accessibilityRole:"menu",accessibilityLabel:I?.label??b??o,onLayout:$,testID:y?`${y}-menu`:void 0,...J,style:[g.anchored,{left:N?.x??0,top:N?.y??0,maxWidth:K,opacity:W?G:0}],children:_jsx(View,{style:g.surface,children:_jsxs(View,{style:[g.clip,{maxHeight:F}],children:[Q,_jsx(ScrollView,{style:g.scroll,bounces:!1,keyboardShouldPersistTaps:"handled",children:X.map((e,t)=>{const s=e.some(e=>null!=e.icon);return _jsxs(View,{children:[t>0?_jsx(Divider,{spacing:"none"}):null,e.map(e=>((e,t)=>{const s=Boolean(e.disabled),i=inkFor(e);return _jsxs(Pressable,{ref:setItemRef(e.key),onPress:()=>V(e),onFocus:()=>{P.current=e.key},disabled:s,accessibilityRole:"menuitem",accessibilityLabel:e.accessibilityLabel??e.label,accessibilityState:{disabled:s,checked:e.checked},"aria-disabled":s,"aria-checked":e.checked,...void 0!==e.checked?WEB_CHECKABLE_ROLE:null,android_ripple:{color:x.colors.surface.pressed,borderless:!1},testID:e.testID,style:({pressed:e})=>[g.row,e?g.pressed:null],children:[t?_jsx(View,{style:g.icon,children:renderSlotIcon(e.icon,{color:i,size:20,disabled:s})}):null,_jsxs(View,{style:g.labels,children:[_jsx(Text,{variant:"body",color:i,numberOfLines:2,children:e.label}),e.description?_jsx(Text,{variant:"caption",color:"secondary",numberOfLines:2,children:e.description}):null]}),e.detail?_jsx(Text,{variant:"caption",color:"tertiary",children:e.detail}):null,e.checked?_jsx(AppIcon,{name:"check",size:20,color:x.colors.primary}):null,e.submenu?_jsx(AppIcon,{name:"chevron-right",size:20,color:x.colors.text.tertiary}):null]},e.key)})(e,s))]},e[0].key)})})]})})}),_jsx(ToastHost,{})]})};const buildStyles=e=>StyleSheet.create({scrim:{backgroundColor:e.colors.background.overlay},preview:{position:"absolute"},anchored:{position:"absolute",minWidth:180},surface:{backgroundColor:e.colors.background.elevated,borderRadius:e.radius.md,...smoothCorners,...e.shadows.lg},clip:{borderRadius:e.radius.md,...smoothCorners,overflow:"hidden"},scroll:{flexGrow:0,flexShrink:1},title:{paddingHorizontal:e.spacing.md,paddingTop:e.spacing.sm,paddingBottom:e.spacing.xs},row:{flexDirection:"row",alignItems:"center",gap:e.spacing.md,minHeight:48,paddingHorizontal:e.spacing.md,paddingVertical:e.spacing.sm},pressed:{backgroundColor:e.colors.surface.pressed},icon:{width:20,alignItems:"center"},labels:{flexGrow:1,flexShrink:1},topRow:{flexDirection:"row",padding:e.spacing.xs,gap:e.spacing.xs},topAction:{flexGrow:1,flexBasis:0,alignItems:"center",justifyContent:"center",gap:e.spacing.xs,minHeight:64,borderRadius:e.radius.sm,...smoothCorners}});
1	+ "use strict";import{useCallback,useEffect,useMemo,useRef,useState}from"react";import{Animated,Easing,Modal,Platform,Pressable,ScrollView,StyleSheet,useWindowDimensions,View}from"react-native";import{useSafeAreaInsets}from"react-native-safe-area-context";import{useReducedMotion}from"../../hooks/useReducedMotion.js";import{createAnimatedValue,setNativeValue,useTheme}from"../../theme/index.js";import{smoothCorners}from"../../utils/corners.js";import{resolveHaptic,triggerHaptic}from"../../utils/hapticUtils.js";import{claimAnchoredSurface,computePlacement,PLACEMENT_MARGIN,placementRoom}from"../../utils/placement.js";import{Breakpoints}from"../../utils/responsive.js";import{AppIcon}from"../AppIcon/AppIcon.js";import{renderSlotIcon}from"../AppIcon/slotIcon.js";import{Divider}from"../Divider/index.js";import{ModalSafeArea,useModalInsets}from"../ModalSafeArea/ModalSafeArea.js";import{OptionSheet}from"../OptionSheet/index.js";import{Text}from"../Text/index.js";import{ToastHost}from"../Toast/ToastProvider.js";import{FOCUS_DELAY_MS,focusHost}from"./focusHost.js";import{visibleGroups,visibleTopActions,wantsSheet}from"./menuModel.js";import{webOnly}from"./webOnly.js";import{jsx as _jsx,jsxs as _jsxs,Fragment as _Fragment}from"react/jsx-runtime";const MENU_MIN_WIDTH=180,MENU_MAX_WIDTH=280,ROW_MIN_HEIGHT=48,TOP_ACTION_MIN_HEIGHT=64,ICON_SIZE=20,PREVIEW_LIFT=1.02,BACK_KEY="__menu-back",TOP_PREFIX="__menu-top:",WEB_CHECKABLE_ROLE=webOnly({role:"menuitemcheckbox"});export const MenuSurface=e=>{const{open:t,anchor:s,items:o,title:i,topActions:r,placement:n,presentation:l,unavailable:a,context:c=!1,preview:u,onClose:d,restoreFocusTo:m,haptic:p,accessibilityLabel:b,closeLabel:f,backLabel:h,testID:y}=e,x=useTheme(),g=useMemo(()=>buildStyles(x),[x]),_=useSafeAreaInsets(),[v,w]=useModalInsets(),j=useMemo(()=>({..._,top:v.top,bottom:v.bottom}),[_,v]),A=useWindowDimensions(),S=useReducedMotion(),I=useMemo(()=>visibleGroups(o,a),[o,a]),k=useMemo(()=>visibleTopActions(r,a),[r,a]),E="sheet"===l\|\|"auto"===l&&A.width<Breakpoints.lg&&wantsSheet(I,k),[R,T]=useState(null),[M,C]=useState(null),L=useRef(d);L.current=d;const D=useRef(m);D.current=m;const O=useRef(null),P=useRef(!1),H=useRef(!1),V=useRef(new Map),B=useRef(null),N=useCallback(()=>{if(!P.current)return;P.current=!1;const e=O.current;O.current=null,e?e():focusHost(D.current?.())},[]);useEffect(()=>{if(t)return H.current=!0,P.current=!1,O.current=null,claimAnchoredSurface(()=>L.current());H.current&&(H.current=!1,P.current=!0,T(null),C(null),E\|\|"ios"===Platform.OS\|\|N())},[t]);const F=useCallback(e=>{if(e.disabled)return;const t=resolveHaptic(p,"selection");t&&triggerHaptic(t),e.key!==BACK_KEY?e.submenu?T(e):(O.current=e.onPress??null,L.current()):T(null)},[p]),K=useMemo(()=>({width:A.width,height:A.height,insets:j}),[A.width,A.height,j]),W=useMemo(()=>{if(!s\|\|!M)return null;const e=s.x+s.width/2>K.width/2?"end":"start";return computePlacement(s,M,K,n,{align:e})},[s,M,K,n]);let G=K.height-j.top-j.bottom-2PLACEMENT_MARGIN;if(s&&W){const e=placementRoom(s,K);G="top"===W.placement?e.above:e.below}const z=Math.min(280,K.width-j.left-j.right-2PLACEMENT_MARGIN),$=t&&null!==W,Y=useRef(createAnimatedValue(0)).current,U=useRef(createAnimatedValue(1)).current;useEffect(()=>{if(!$)return setNativeValue(Y,0),void setNativeValue(U,1);const e=[Animated.timing(Y,{toValue:1,duration:x.motion.duration.fast,easing:Easing.bezier(...x.motion.easing.decelerate),useNativeDriver:!0})];c&&!S&&e.push(Animated.spring(U,{toValue:1.02,damping:x.motion.spring.snappy.damping,stiffness:x.motion.spring.snappy.stiffness,mass:x.motion.spring.snappy.mass,useNativeDriver:!0}));const t=Animated.parallel(e);return t.start(),()=>t.stop()},[$,c,S,Y,U,x.motion]);const X=useCallback(e=>{const{width:t,height:s}=e.nativeEvent.layout;C(e=>e&&e.width===t&&e.height===s?e:{width:t,height:s})},[]),q=c&&"top"===W?.placement,Z=R?.submenu?[R.submenu]:I,J=q?[...Z].reverse().map(e=>[...e].reverse()):Z,Q=[];if(R)Q.push({key:BACK_KEY,label:R.label});else for(const e of k)Q.push({key:`${TOP_PREFIX}${e.key}`,label:e.label,item:e});for(const e of J)for(const t of e)Q.push({key:t.key,label:t.label,item:t});const ee=Q[0]?.key;useEffect(()=>{if(!$\|\|E\|\|!ee)return;const e=setTimeout(()=>focusHost(V.current.get(ee)),FOCUS_DELAY_MS);return()=>clearTimeout(e)},[$,E,ee]);const setItemRef=e=>t=>{t?V.current.set(e,t):V.current.delete(e)},te=webOnly({onKeyDown:e=>{const t=e.key??e.nativeEvent?.key??"",s=Q.length,o=Q.findIndex(e=>e.key===B.current);let i=-1;if("ArrowDown"===t)i=(o+1)%s;else if("ArrowUp"===t)i=o<=0?s-1:o-1;else if("Home"===t)i=0;else if("End"===t)i=s-1;else{if("ArrowLeft"===t&&R)return e.preventDefault?.(),void T(null);if("ArrowRight"===t&&Q[o]?.item?.submenu)return e.preventDefault?.(),void F(Q[o].item);if(1===t.length&&""!==t.trim()){const e=t.toLowerCase();for(let t=1;t<=s;t+=1){const r=(o+t)%s;if(Q[r].label.toLowerCase().startsWith(e)){i=r;break}}}}i>=0&&(e.preventDefault?.(),(e=>{const t=Q[e];t&&focusHost(V.current.get(t.key))})(i))}});if(E){const e=R?.submenu?[{key:BACK_KEY,label:h,icon:"chevron-left"},...R.submenu]:[...k,...I.flat()],s=new Set(e.filter(e=>e.checked).map(e=>e.key));return _jsx(OptionSheet,{open:t,onClose:d,onAfterClose:N,title:R?.label??i,options:e,labelOf:e=>e.label,getValue:e=>e.key,disabledOf:e=>Boolean(e.disabled),destructiveOf:e=>Boolean(e.destructive),descriptionOf:e=>e.description,iconOf:e=>{const t=e;return renderSlotIcon(t.icon,{color:t.destructive?x.colors.toneText.error:x.colors.text.secondary,size:20,disabled:Boolean(t.disabled)})},isSelected:e=>s.has(String(e)),onSelect:e=>F(e),accessibilityLabel:b??i,testID:y?`${y}-sheet`:void 0})}const inkFor=e=>e.disabled?x.colors.text.disabled:e.destructive?x.colors.toneText.error:x.colors.text.primary,se=_jsxs(_Fragment,R?{children:[_jsxs(Pressable,{ref:setItemRef(BACK_KEY),onPress:()=>T(null),onFocus:()=>{B.current=BACK_KEY},accessibilityRole:"menuitem",accessibilityLabel:`${h}, ${R.label}`,android_ripple:{color:x.colors.surface.pressed,borderless:!1},style:({pressed:e})=>[g.row,e?g.pressed:null],children:[_jsx(View,{style:g.icon,children:_jsx(AppIcon,{name:"chevron-left",size:20,color:x.colors.text.secondary})}),_jsx(Text,{variant:"body",weight:"semibold",numberOfLines:1,style:g.labels,children:R.label})]}),_jsx(Divider,{spacing:"none"})]}:{children:[i?_jsx(Text,{variant:"caption",color:"secondary",accessibilityRole:"header",numberOfLines:2,style:g.title,children:i}):null,k.length>0?_jsxs(_Fragment,{children:[_jsx(View,{style:g.topRow,children:k.map(e=>{const t=`${TOP_PREFIX}${e.key}`,s=Boolean(e.disabled),o=inkFor(e);return _jsxs(Pressable,{ref:setItemRef(t),onPress:()=>F(e),onFocus:()=>{B.current=t},disabled:s,accessibilityRole:"menuitem",accessibilityLabel:e.accessibilityLabel??e.label,accessibilityState:{disabled:s},"aria-disabled":s,testID:e.testID,style:({pressed:e})=>[g.topAction,e?g.pressed:null],children:[renderSlotIcon(e.icon,{color:o,size:20,disabled:s}),_jsx(Text,{variant:"caption",color:o,numberOfLines:1,children:e.label})]},t)})}),_jsx(Divider,{spacing:"none"})]}):null]});return _jsx(Modal,{visible:t,transparent:!0,statusBarTranslucent:!0,presentationStyle:"overFullScreen",animationType:"none",onRequestClose:d,onDismiss:N,children:_jsxs(ModalSafeArea,{onInsets:w,children:[_jsx(Pressable,{style:[StyleSheet.absoluteFill,c?g.scrim:null],onPress:d,accessibilityRole:"button",accessibilityLabel:f,testID:y?`${y}-scrim`:void 0}),c&&u&&s?_jsx(Animated.View,{pointerEvents:"none",accessibilityElementsHidden:!0,importantForAccessibility:"no-hide-descendants",style:[g.preview,{left:s.x,top:s.y,width:s.width,height:s.height,transform:[{scale:U}]}],children:u}):null,_jsx(Animated.View,{accessibilityRole:"menu",accessibilityLabel:R?.label??b??i,onLayout:X,testID:y?`${y}-menu`:void 0,...te,style:[g.anchored,{left:W?.x??0,top:W?.y??0,maxWidth:z,opacity:$?Y:0}],children:_jsx(View,{style:g.surface,children:_jsxs(View,{style:[g.clip,{maxHeight:G}],children:[se,_jsx(ScrollView,{style:g.scroll,bounces:!1,keyboardShouldPersistTaps:"handled",children:J.map((e,t)=>{const s=e.some(e=>null!=e.icon);return _jsxs(View,{children:[t>0?_jsx(Divider,{spacing:"none"}):null,e.map(e=>((e,t)=>{const s=Boolean(e.disabled),o=inkFor(e);return _jsxs(Pressable,{ref:setItemRef(e.key),onPress:()=>F(e),onFocus:()=>{B.current=e.key},disabled:s,accessibilityRole:"menuitem",accessibilityLabel:e.accessibilityLabel??e.label,accessibilityState:{disabled:s,checked:e.checked},"aria-disabled":s,"aria-checked":e.checked,...void 0!==e.checked?WEB_CHECKABLE_ROLE:null,android_ripple:{color:x.colors.surface.pressed,borderless:!1},testID:e.testID,style:({pressed:e})=>[g.row,e?g.pressed:null],children:[t?_jsx(View,{style:g.icon,children:renderSlotIcon(e.icon,{color:o,size:20,disabled:s})}):null,_jsxs(View,{style:g.labels,children:[_jsx(Text,{variant:"body",color:o,numberOfLines:2,children:e.label}),e.description?_jsx(Text,{variant:"caption",color:"secondary",numberOfLines:2,children:e.description}):null]}),e.detail?_jsx(Text,{variant:"caption",color:"tertiary",children:e.detail}):null,e.checked?_jsx(AppIcon,{name:"check",size:20,color:x.colors.primary}):null,e.submenu?_jsx(AppIcon,{name:"chevron-right",size:20,color:x.colors.text.tertiary}):null]},e.key)})(e,s))]},e[0].key)})})]})})}),_jsx(ToastHost,{})]})})};const buildStyles=e=>StyleSheet.create({scrim:{backgroundColor:e.colors.background.overlay},preview:{position:"absolute"},anchored:{position:"absolute",minWidth:180},surface:{backgroundColor:e.colors.background.elevated,borderRadius:e.radius.md,...smoothCorners,...e.shadows.lg},clip:{borderRadius:e.radius.md,...smoothCorners,overflow:"hidden"},scroll:{flexGrow:0,flexShrink:1},title:{paddingHorizontal:e.spacing.md,paddingTop:e.spacing.sm,paddingBottom:e.spacing.xs},row:{flexDirection:"row",alignItems:"center",gap:e.spacing.md,minHeight:48,paddingHorizontal:e.spacing.md,paddingVertical:e.spacing.sm},pressed:{backgroundColor:e.colors.surface.pressed},icon:{width:20,alignItems:"center"},labels:{flexGrow:1,flexShrink:1},topRow:{flexDirection:"row",padding:e.spacing.xs,gap:e.spacing.xs},topAction:{flexGrow:1,flexBasis:0,alignItems:"center",justifyContent:"center",gap:e.spacing.xs,minHeight:64,borderRadius:e.radius.sm,...smoothCorners}});

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

	@@ -1 +1 @@
1	- "use strict";import{forwardRef,useCallback,useEffect,useMemo,useRef,useState}from"react";import{AccessibilityInfo,Animated,Dimensions,Easing,Platform,Pressable,Modal as RNModal,StyleSheet,View}from"react-native";import{~~useSafeAreaInsets}from"react-native-safe-area-context";import{~~createAnimatedValue,useTheme}from"../../theme/index.js";import{smoothCorners}from"../../utils/corners.js";import{resolveHaptic,triggerHaptic}from"../../utils/hapticUtils.js";import{squircleHostRadius}from"../../utils/squircle.js";import{SquircleFill,useSquircle}from"../SquircleFill/SquircleFill.js";import{ToastHost}from"../Toast/ToastProvider.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";export const MODAL_DISMISS_GRACE_MS=300;const Modal=forwardRef((e,t)=>{const{visible:s,onRequestClose:i,presentation:r="centered",backdropOpacity:o,backdropPressClose:n=!0,animationDuration:a,accessibilityLabel:l,hardwareBackPress:c=!0,children:u,contentStyle:d,backdropStyle:m,restoreFocusRef:f,onDismissed:p,haptic:g,testID:b}=e,h=useTheme(),y=~~useSafeAreaInsets~~(),S=a??h.motion.duration.normal,v=Dimensions.get("window").height,x=h.components.modal,A=x?.scaleStartValue??.9,C=useRef(createAnimatedValue(A)).current,R=useRef(createAnimatedValue(0)).current,j=useRef(createAnimatedValue(v)).current,w=useRef(null),M=useRef(!1),[T,k]=useState(s),V=useMemo(()=>buildStyles(h),[h]),D=useMemo(()=>{const e=h.colors.background.overlay;if("number"!=typeof o)return e;const t=e.match(/^rgba?$([^)]+)$$/);if(!t)return e;const[s,i,r]=t[1].split(",").map(e=>e.trim());return`rgba(${s}, ${i}, ${r}, ${o})`},[h.colors.background.overlay,o]);useEffect(()=>{s&&k(!0)},[s]),useEffect(()=>{const e=[];if(s&&T)if("bottom"===r){const t=Animated.spring(j,{toValue:0,damping:h.motion.spring.gentle.damping,stiffness:h.motion.spring.gentle.stiffness,mass:h.motion.spring.gentle.mass,useNativeDriver:!0});t.start(),e.push(t)}else{const t=Animated.parallel([Animated.spring(C,{toValue:1,damping:h.motion.spring.gentle.damping,stiffness:h.motion.spring.gentle.stiffness,mass:h.motion.spring.gentle.mass,useNativeDriver:!0}),Animated.timing(R,{toValue:1,duration:S,useNativeDriver:!0})]);t.start(),e.push(t)}else if(T){const t=h.motion.duration.fast,s=Easing.bezier(...h.motion.easing.accelerate),i=Animated.parallel(["bottom"===r?Animated.timing(j,{toValue:v,duration:t,easing:s,useNativeDriver:!0}):Animated.parallel([Animated.timing(C,{toValue:A,duration:t,easing:s,useNativeDriver:!0}),Animated.timing(R,{toValue:0,duration:t,easing:s,useNativeDriver:!0})])]);i.start(({finished:e})=>{e&&k(!1)}),e.push(i)}return()=>e.forEach(e=>e.stop())},[s,T,r,S,C,R,j,v,h.motion.spring.gentle.damping,h.motion.spring.gentle.stiffness,h.motion.spring.gentle.mass,h.motion.duration.fast,h.motion.easing.accelerate,A]),useEffect(()=>{if("web"===Platform.OS)return;let e,t;return s?(e=setTimeout(()=>{w.current&&AccessibilityInfo.sendAccessibilityEvent(w.current,"focus")},150),M.current=!0):M.current&&(M.current=!1,f&&f.current&&(t=setTimeout(()=>{const e=f.current;e&&AccessibilityInfo.sendAccessibilityEvent(e,"focus")},S))),()=>{e&&clearTimeout(e),t&&clearTimeout(t)}},[s,S,f]);const E=useRef(!1);useEffect(()=>{if(s)return void(E.current=!0);if(!E.current)return;if(E.current=!1,!p)return;const e=setTimeout(p,300);return()=>clearTimeout(e)},[s,p]);const _=useCallback(()=>{if(!n)return;const e=resolveHaptic(g,"selection");e&&triggerHaptic(e),i()},[n,i,g]),q=useCallback(()=>{c&&i()},[c,i]),I=useSquircle("bottom"!==r&&"fullScreen"!==r,h.radius.xl),z=useMemo(()=>"fullScreen"===r?[V.fullScreenContent,{backgroundColor:h.colors.background.elevated}]:"bottom"===r?[V.bottomContent,{backgroundColor:h.colors.background.elevated,borderTopLeftRadius:h.radius.xl,borderTopRightRadius:h.radius.xl,...smoothCorners,paddingTop:h.spacing.lg,paddingHorizontal:h.spacing.lg,paddingBottom:h.spacing.lg+y.bottom},h.shadows.xl]:[V.centeredContent,{backgroundColor:h.colors.background.elevated,borderRadius:I.active&&I.size?squircleHostRadius(I.size.width,I.size.height,h.radius.xl):h.radius.xl,...smoothCorners,padding:h.spacing.xl},h.shadows.xl],[r,h,V,y.bottom,I.active,I.size]),H=useMemo(()=>"bottom"===r?V.bottomWrapper:"fullScreen"===r?V.fullScreenWrapper:V.centeredWrapper,[r,V]),N=useMemo(()=>"bottom"===r?{transform:[{translateY:j}]}:"fullScreen"===r?{opacity:R}:{opacity:R,transform:[{scale:C}]},[r,C,R,j]);return _jsx(RNModal,{visible:T,transparent:!0,statusBarTranslucent:!0,navigationBarTranslucent:!0,animationType:"none",onRequestClose:q,testID:b,children:~~_jsxs~~(View,{ref:e=>{w.current=e,"function"==typeof t?t(e):t&&(t.current=e)},style:V.root,accessible:!1,accessibilityViewIsModal:!0,accessibilityRole:"alert",accessibilityLabel:l,children:[_jsxs(View,{collapsable:!1,style:[StyleSheet.absoluteFill,H,{backgroundColor:D},m],children:[_jsx(Pressable,{style:StyleSheet.absoluteFill,onPress:_,accessibilityRole:"button",accessibilityLabel:"Close modal",disabled:!n}),_jsxs(Animated.View,{style:[z,N,d],onLayout:I.onLayout,pointerEvents:"auto",children:[I.active&&I.size?_jsx(SquircleFill,{width:I.size.width,height:I.size.height,radius:h.radius.xl,fill:h.colors.background.elevated}):null,u]})]}),_jsx(ToastHost,{})]})})});Modal.displayName="Modal";const buildStyles=e=>StyleSheet.create({root:{flex:1},centeredWrapper:{flex:1,alignItems:"center",justifyContent:"center",paddingHorizontal:16},centeredContent:{maxWidth:"90%",width:"90%"},bottomWrapper:{flex:1,justifyContent:"flex-end"},bottomContent:{width:"100%"},fullScreenWrapper:{flex:1},fullScreenContent:{flex:1}});export{Modal};export default Modal;
1	+ "use strict";import{forwardRef,useCallback,useEffect,useMemo,useRef,useState}from"react";import{AccessibilityInfo,Animated,Dimensions,Easing,Platform,Pressable,Modal as RNModal,StyleSheet,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{squircleHostRadius}from"../../utils/squircle.js";import{ModalSafeArea,useModalInsets}from"../ModalSafeArea/ModalSafeArea.js";import{SquircleFill,useSquircle}from"../SquircleFill/SquircleFill.js";import{ToastHost}from"../Toast/ToastProvider.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";export const MODAL_DISMISS_GRACE_MS=300;const Modal=forwardRef((e,t)=>{const{visible:s,onRequestClose:o,presentation:r="centered",backdropOpacity:i,backdropPressClose:a=!0,animationDuration:n,accessibilityLabel:l,hardwareBackPress:c=!0,children:u,contentStyle:d,backdropStyle:m,restoreFocusRef:f,onDismissed:p,haptic:g,testID:b}=e,h=useTheme(),[S,y]=useModalInsets(),x=n??h.motion.duration.normal,v=Dimensions.get("window").height,A=h.components.modal,M=A?.scaleStartValue??.9,C=useRef(createAnimatedValue(M)).current,R=useRef(createAnimatedValue(0)).current,j=useRef(createAnimatedValue(v)).current,w=useRef(null),T=useRef(!1),[k,V]=useState(s),D=useMemo(()=>buildStyles(h),[h]),_=useMemo(()=>{const e=h.colors.background.overlay;if("number"!=typeof i)return e;const t=e.match(/^rgba?$([^)]+)$$/);if(!t)return e;const[s,o,r]=t[1].split(",").map(e=>e.trim());return`rgba(${s}, ${o}, ${r}, ${i})`},[h.colors.background.overlay,i]);useEffect(()=>{s&&V(!0)},[s]),useEffect(()=>{const e=[];if(s&&k)if("bottom"===r){const t=Animated.spring(j,{toValue:0,damping:h.motion.spring.gentle.damping,stiffness:h.motion.spring.gentle.stiffness,mass:h.motion.spring.gentle.mass,useNativeDriver:!0});t.start(),e.push(t)}else{const t=Animated.parallel([Animated.spring(C,{toValue:1,damping:h.motion.spring.gentle.damping,stiffness:h.motion.spring.gentle.stiffness,mass:h.motion.spring.gentle.mass,useNativeDriver:!0}),Animated.timing(R,{toValue:1,duration:x,useNativeDriver:!0})]);t.start(),e.push(t)}else if(k){const t=h.motion.duration.fast,s=Easing.bezier(...h.motion.easing.accelerate),o=Animated.parallel(["bottom"===r?Animated.timing(j,{toValue:v,duration:t,easing:s,useNativeDriver:!0}):Animated.parallel([Animated.timing(C,{toValue:M,duration:t,easing:s,useNativeDriver:!0}),Animated.timing(R,{toValue:0,duration:t,easing:s,useNativeDriver:!0})])]);o.start(({finished:e})=>{e&&V(!1)}),e.push(o)}return()=>e.forEach(e=>e.stop())},[s,k,r,x,C,R,j,v,h.motion.spring.gentle.damping,h.motion.spring.gentle.stiffness,h.motion.spring.gentle.mass,h.motion.duration.fast,h.motion.easing.accelerate,M]),useEffect(()=>{if("web"===Platform.OS)return;let e,t;return s?(e=setTimeout(()=>{w.current&&AccessibilityInfo.sendAccessibilityEvent(w.current,"focus")},150),T.current=!0):T.current&&(T.current=!1,f&&f.current&&(t=setTimeout(()=>{const e=f.current;e&&AccessibilityInfo.sendAccessibilityEvent(e,"focus")},x))),()=>{e&&clearTimeout(e),t&&clearTimeout(t)}},[s,x,f]);const E=useRef(!1);useEffect(()=>{if(s)return void(E.current=!0);if(!E.current)return;if(E.current=!1,!p)return;const e=setTimeout(p,300);return()=>clearTimeout(e)},[s,p]);const I=useCallback(()=>{if(!a)return;const e=resolveHaptic(g,"selection");e&&triggerHaptic(e),o()},[a,o,g]),q=useCallback(()=>{c&&o()},[c,o]),z=useSquircle("bottom"!==r&&"fullScreen"!==r,h.radius.xl),H=useMemo(()=>"fullScreen"===r?[D.fullScreenContent,{backgroundColor:h.colors.background.elevated}]:"bottom"===r?[D.bottomContent,{backgroundColor:h.colors.background.elevated,borderTopLeftRadius:h.radius.xl,borderTopRightRadius:h.radius.xl,...smoothCorners,paddingTop:h.spacing.lg,paddingHorizontal:h.spacing.lg,paddingBottom:h.spacing.lg+S.bottom},h.shadows.xl]:[D.centeredContent,{backgroundColor:h.colors.background.elevated,borderRadius:z.active&&z.size?squircleHostRadius(z.size.width,z.size.height,h.radius.xl):h.radius.xl,...smoothCorners,padding:h.spacing.xl},h.shadows.xl],[r,h,D,S.bottom,z.active,z.size]),N=useMemo(()=>"bottom"===r?D.bottomWrapper:"fullScreen"===r?D.fullScreenWrapper:D.centeredWrapper,[r,D]),P=useMemo(()=>"bottom"===r?{transform:[{translateY:j}]}:"fullScreen"===r?{opacity:R}:{opacity:R,transform:[{scale:C}]},[r,C,R,j]);return _jsx(RNModal,{visible:k,transparent:!0,statusBarTranslucent:!0,navigationBarTranslucent:!0,animationType:"none",onRequestClose:q,testID:b,children:_jsx(View,{ref:e=>{w.current=e,"function"==typeof t?t(e):t&&(t.current=e)},style:D.root,accessible:!1,accessibilityViewIsModal:!0,accessibilityRole:"alert",accessibilityLabel:l,children:_jsxs(ModalSafeArea,{onInsets:y,children:[_jsxs(View,{collapsable:!1,style:[StyleSheet.absoluteFill,N,{backgroundColor:_},m],children:[_jsx(Pressable,{style:StyleSheet.absoluteFill,onPress:I,accessibilityRole:"button",accessibilityLabel:"Close modal",disabled:!a}),_jsxs(Animated.View,{style:[H,P,d],onLayout:z.onLayout,pointerEvents:"auto",children:[z.active&&z.size?_jsx(SquircleFill,{width:z.size.width,height:z.size.height,radius:h.radius.xl,fill:h.colors.background.elevated}):null,u]})]}),_jsx(ToastHost,{})]})})})});Modal.displayName="Modal";const buildStyles=e=>StyleSheet.create({root:{flex:1},centeredWrapper:{flex:1,alignItems:"center",justifyContent:"center",paddingHorizontal:16},centeredContent:{maxWidth:"90%",width:"90%"},bottomWrapper:{flex:1,justifyContent:"flex-end"},bottomContent:{width:"100%"},fullScreenWrapper:{flex:1},fullScreenContent:{flex:1}});export{Modal};export default Modal;

package/lib/module/components/ModalSafeArea/ModalSafeArea.js ADDED Viewed

@@ -0,0 +1 @@

+ "use strict";import{useEffect,useState}from"react";import{StyleSheet}from"react-native";import{SafeAreaProvider,useSafeAreaInsets}from"react-native-safe-area-context";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";export const useModalInsets=()=>{const{top:e,bottom:t}=useSafeAreaInsets();return useState({top:e,bottom:t})};export const InsetsProbe=({onChange:e})=>{const{top:t,bottom:s}=useSafeAreaInsets();return useEffect(()=>{e(e=>e.top===t&&e.bottom===s?e:{top:t,bottom:s})},[t,s,e]),null};export const ModalSafeArea=({onInsets:e,children:t})=>_jsxs(SafeAreaProvider,{style:styles.fill,children:[_jsx(InsetsProbe,{onChange:e}),t]});const styles=StyleSheet.create({fill:{flex:1}});

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

	@@ -1 +1 @@
1	- "use strict";import{useCallback,useEffect,useMemo,useRef,useState}from"react";import{Animated,Dimensions,Easing,FlatList,Modal,Platform,Pressable,StatusBar,StyleSheet,Text,TextInput,View}from"react-native";import{Gesture,GestureDetector,GestureHandlerRootView}from"react-native-gesture-handler";import{useKeyboardState}from"react-native-keyboard-controller";import{useSafeAreaInsets}from"react-native-safe-area-context";import{useDragToDismiss}from"../../hooks/useDragToDismiss.js";import{createAnimatedValue,setNativeValue,useTheme}from"../../theme/index.js";import{smoothCorners}from"../../utils/corners.js";import{defaultIcons}from"../AppIcon/defaultIcons.js";import{ToastHost}from"../Toast/ToastProvider.js";import{jsx as _jsx,jsxs as _jsxs,Fragment as _Fragment}from"react/jsx-runtime";const SEARCH_ICON_SIZE=18;export const OptionSheet=e=>{const{open:t,onClose:o,onAfterClose:i,onOpenChange:s,title:r,options:n,sections:a,renderSectionHeader:l,renderOption:c,alphabetIndex:d=!1,searchPlaceholder:p="Search…",emptyText:u="No options",labelOf:h,getValue:m,disabledOf:g,destructiveOf:f,descriptionOf:y,iconOf:b,isSelected:x,onSelect:S,multi:T=!1,searchable:j=!1,searchSelectionColor:C,accessibilityLabel:w,optionStyle:_,selectedOptionStyle:R,optionTextStyle:V,selectedOptionTextStyle:k,testID:I}=e,v=useTheme(),z=useSafeAreaInsets(),D=useMemo(()=>buildStyles(v),[v]),[L,P]=useState(""),H=Dimensions.get("window").height,W=Math.round(.7H),[A,M]=useState(t),O=useRef(createAnimatedValue(0)).current,B=useRef(createAnimatedValue(W)).current,E=useRef(createAnimatedValue(0)).current,F=useMemo(()=>Animated.add(B,E),[B,E]);useEffect(()=>{t&&M(!0)},[t]);const N=useRef(s);N.current=s;const G=useRef(!1);useEffect(()=>{G.current!==t&&(G.current=t,N.current?.(t))},[t]);const $=useRef(i);$.current=i;const J=useRef(A);useEffect(()=>{J.current&&!A&&"ios"!==Platform.OS&&$.current?.(),J.current=A},[A]),useEffect(()=>{if(!A)return;t&&setNativeValue(E,0);const e=t?Animated.parallel([Animated.timing(O,{toValue:1,duration:v.motion.duration.fast,easing:Easing.bezier(...v.motion.easing.standard),useNativeDriver:!1}),Animated.spring(B,{toValue:0,damping:v.motion.spring.snappy.damping,stiffness:v.motion.spring.snappy.stiffness,mass:v.motion.spring.snappy.mass,useNativeDriver:!0})]):Animated.parallel([Animated.timing(O,{toValue:0,duration:v.motion.duration.fast,easing:Easing.bezier(...v.motion.easing.standard),useNativeDriver:!1}),Animated.timing(B,{toValue:W,duration:v.motion.duration.fast,easing:Easing.bezier(...v.motion.easing.accelerate),useNativeDriver:!0})]);return e.start(({finished:e})=>{e&&!t&&M(!1)}),()=>e.stop()},[t,A,O,B,E,W,v.motion.duration.fast,v.motion.easing.standard,v.motion.easing.accelerate,v.motion.spring.snappy]);const{handleGesture:K}=useDragToDismiss({drag:E,travel:W,onDismiss:o}),U=useMemo(()=>Gesture.Native(),[]),[Y,Z]=useState(0),q=useKeyboardState(e=>e.height),Q=A?Math.max(0,Math.round(q)):0,X=Math.max(z.top,StatusBar.currentHeight??0)+v.spacing.sm,ee=Q>0,te=ee?Math.max(0,Math.min(W,(Y>0?Y:H)-Q-X)):W;useEffect(()=>{t\|\|P("")},[t]);const oe=useMemo(()=>{const e=j?L.trim().toLowerCase():"",matches=t=>0===e.length\|\|h(t).toLowerCase().includes(e)\|\|(y(t)??"").toLowerCase().includes(e);if(!a)return n.filter(matches).map(e=>({kind:"option",option:e}));const t=[];return a.forEach((e,o)=>{const i=e.options.filter(matches);if(0!==i.length){t.push({kind:"header",title:e.title});for(const e of i)t.push({kind:"option",option:e,section:o})}}),t},[j,L,n,a,h,y]),ie=useCallback(()=>{o()},[o]),se=useRef(null),re=useMemo(()=>{const e=new Map;if(!d)return e;let t=0;if(a)for(let e=oe.length-1;e>=0;e-=1)if("header"===oe[e].kind){t=e+1;break}for(let o=t;o<oe.length;o+=1){const t=oe[o];if("option"!==t.kind)continue;const i=h(t.option).trim().charAt(0).toUpperCase(),s=/^[A-Z]$/.test(i)?i:"#";e.has(s)\|\|e.set(s,o)}return e},[d,oe,a,h]),ne=d&&re.size>0&&0===L.trim().length,ae=useMemo(()=>[..."ABCDEFGHIJKLMNOPQRSTUVWXYZ",...re.has("#")?["#"]:[]],[re]),le=useCallback(e=>{const t=re.get(e);void 0!==t&&se.current?.scrollToIndex({index:t,animated:!0,viewPosition:0})},[re]),ce=useRef(null),de=useCallback(()=>{null!==ce.current&&(clearTimeout(ce.current),ce.current=null)},[]),pe=useCallback(e=>{se.current?.scrollToOffset({offset:e.averageItemLengthe.index,animated:!1}),de(),ce.current=setTimeout(()=>{ce.current=null,se.current?.scrollToIndex({index:e.index,animated:!0,viewPosition:0})},50)},[de]);useEffect(()=>(A\|\|de(),de),[A,de]);return _jsx(Modal,{visible:A,transparent:!0,animationType:"none",onRequestClose:ie,onDismiss:()=>$.current?.(),statusBarTranslucent:!0,navigationBarTranslucent:!0,children:_jsxs(GestureHandlerRootView,{collapsable:!1,onLayout:e=>Z(e.nativeEvent.layout.height),style:[StyleSheet.absoluteFill,{backgroundColor:v.colors.background.overlay}],children:[_jsx(Pressable,{style:StyleSheet.absoluteFill,onPress:ie,accessibilityRole:"button",accessibilityLabel:"Close picker"}),_jsxs(Animated.View,{testID:I,accessibilityViewIsModal:!0,accessibilityLabel:w??r??"Options",style:[D.sheet,{maxHeight:te,bottom:Q,paddingBottom:ee?16:z.bottom+16,backgroundColor:v.colors.background.elevated,borderTopLeftRadius:v.radius.xl,borderTopRightRadius:v.radius.xl,...smoothCorners,transform:[{translateY:F}],...v.shadows.xl}],children:[_jsx(GestureDetector,{gesture:K,children:_jsxs(View,{children:[_jsx(View,{style:D.sheetHandleRow,children:_jsx(View,{style:[D.sheetHandle,{backgroundColor:v.components.select?.handleColor??v.components.bottomSheet?.handleColor??v.colors.border.primary}]})}),r?_jsx(Text,{style:[D.sheetTitle,{color:v.colors.text.primary,fontSize:v.typography.fontSize.lg,fontWeight:v.typography.fontWeight.semibold,paddingHorizontal:v.spacing.lg,marginBottom:v.spacing.sm}],children:r}):null]})}),j?_jsx(View,{style:[D.searchWrap,{marginHorizontal:v.spacing.lg,marginBottom:v.spacing.sm}],children:_jsxs(View,{style:[D.searchBox,{backgroundColor:v.colors.background.secondary,borderColor:v.colors.border.primary,borderRadius:v.radius.md,...smoothCorners,paddingHorizontal:v.spacing.md,gap:v.spacing.sm}],children:[(v.icons?.search??defaultIcons.search)({size:18,color:v.colors.text.tertiary}),_jsx(TextInput,{value:L,onChangeText:P,placeholder:p,placeholderTextColor:v.colors.text.tertiary,selectionColor:C??v.colors.border.focus,accessibilityLabel:"Search options",style:[D.searchInput,{color:v.colors.text.primary,fontSize:v.typography.fontSize.base,paddingVertical:v.spacing.sm}]}),L.length>0?_jsx(Pressable,{onPress:()=>P(""),hitSlop:8,accessibilityRole:"button",accessibilityLabel:"Clear search",children:(v.icons?.close??defaultIcons.close)({size:18,color:v.colors.text.secondary})}):null]})}):null,_jsxs(View,{style:[D.listWrap,ne?D.listRow:null],children:[_jsx(GestureDetector,{gesture:U,children:_jsx(FlatList,{ref:se,data:oe,keyExtractor:e=>"header"===e.kind?`h:${e.title}`:`o:${e.section??""}:${String(m(e.option))}`,renderItem:({item:e})=>{if("header"===e.kind)return _jsx(View,{accessible:!0,accessibilityRole:"header",style:[D.sectionHeader,{paddingHorizontal:v.spacing.lg,paddingTop:v.spacing.md}],children:l?l(e.title):_jsx(Text,{style:[D.sectionTitle,{color:v.colors.text.tertiary,fontSize:v.typography.fontSize.xs,fontWeight:v.typography.fontWeight.semibold}],children:e.title.toUpperCase()})});const t=e.option,o=h(t),i=m(t),s=y(t),r=b(t),n=x(i),a=g(t),d=f?.(t)??!1;return _jsxs(Pressable,{onPress:()=>S(t),disabled:a,android_ripple:{color:v.colors.surface.pressed,borderless:!1},accessibilityRole:"button",accessibilityLabel:o,accessibilityState:{selected:n,disabled:a},"aria-selected":n,"aria-disabled":a,style:({pressed:e})=>[D.optionRow,{backgroundColor:n?v.colors.surface.selected:e?v.colors.surface.pressed:"transparent",opacity:a?.5:1,paddingHorizontal:v.spacing.lg,paddingVertical:v.spacing.md},_,n?R:null],children:[c?_jsx(View,{style:D.optionTextWrap,children:c(t,{selected:n,disabled:a})}):_jsxs(_Fragment,{children:[r?_jsx(View,{style:D.optionIcon,children:r}):null,_jsxs(View,{style:D.optionTextWrap,children:[_jsx(Text,{style:[D.optionLabel,{color:d?v.colors.toneText.error:n?v.colors.primary:v.colors.text.primary,fontSize:v.typography.fontSize.base,fontWeight:n?v.typography.fontWeight.semibold:v.typography.fontWeight.medium},V,n?k:null],children:o}),s?_jsx(Text,{style:[D.optionDescription,{color:v.colors.text.tertiary,fontSize:v.typography.fontSize.sm}],numberOfLines:2,children:s}):null]})]}),T?_jsx(View,{style:[D.checkbox,{borderColor:n?v.colors.primary:v.colors.border.primary,backgroundColor:n?v.colors.primary:"transparent"}],children:n?_jsx(View,{style:D.checkboxTick}):null}):n?"icon"===v.components.optionSheet?.selectedMarker?_jsx(View,{style:D.singleSelectedIcon,children:(v.icons?.selectedTick??defaultIcons.selectedTick)({size:20,color:v.colors.primary})}):_jsx(View,{style:[D.singleSelectedDot,{backgroundColor:v.colors.primary}]}):null]})},onScrollToIndexFailed:pe,overScrollMode:"never",bounces:!1,keyboardShouldPersistTaps:"handled",showsVerticalScrollIndicator:!ne,style:ne?D.listBesideRail:null,ListEmptyComponent:_jsx(Text,{style:[D.empty,{color:v.colors.text.tertiary,fontSize:v.typography.fontSize.sm,paddingVertical:v.spacing.xl}],children:u})})}),ne?_jsx(View,{style:[D.rail,{paddingRight:v.spacing.xs}],accessibilityRole:"list",accessibilityLabel:"Jump to letter",testID:"option-sheet-alphabet",children:ae.map(e=>{const t=re.has(e);return _jsx(Pressable,{onPress:()=>le(e),disabled:!t,hitSlop:{left:8,right:8},accessibilityRole:"button",accessibilityLabel:`Jump to ${e}`,accessibilityState:{disabled:!t},"aria-disabled":!t,style:D.railLetter,children:_jsx(Text,{style:[D.railLetterText,{color:t?v.colors.primary:v.colors.text.tertiary,fontSize:v.typography.fontSize.xs,fontWeight:v.typography.fontWeight.semibold,opacity:t?1:.45}],children:e})},e)})}):null]}),T?_jsx(View,{style:[D.sheetFooter,{borderTopColor:v.colors.border.secondary,paddingHorizontal:v.spacing.lg,paddingVertical:v.spacing.md}],children:_jsx(Pressable,{onPress:ie,accessibilityRole:"button",accessibilityLabel:"Done",style:({pressed:e})=>[D.doneButton,{backgroundColor:e?v.colors.primaryPressed:v.colors.primary,borderRadius:v.radius.md,...smoothCorners,paddingVertical:v.spacing.sm,paddingHorizontal:v.spacing.lg}],children:_jsx(Text,{style:{color:v.colors.onPrimary,fontSize:v.typography.fontSize.base,fontWeight:v.typography.fontWeight.semibold},children:"Done"})})}):null]}),_jsx(ToastHost,{})]})})};OptionSheet.displayName="OptionSheet";const buildStyles=e=>StyleSheet.create({sheet:{position:"absolute",left:0,right:0,bottom:0,paddingBottom:16,overflow:"hidden"},sheetHandleRow:{alignItems:"center",paddingTop:10,paddingBottom:8},sheetHandle:{width:36,height:4,borderRadius:2,...smoothCorners},sheetTitle:{includeFontPadding:!1},searchWrap:{width:"auto"},searchBox:{flexDirection:"row",alignItems:"center",borderWidth:1},searchInput:{flex:1,includeFontPadding:!1},optionRow:{flexDirection:"row",alignItems:"center"},sectionHeader:{paddingBottom:4},listWrap:{flexShrink:1},listRow:{flexDirection:"row"},listBesideRail:{flex:1},rail:{justifyContent:"space-between",alignItems:"center",alignSelf:"stretch",paddingVertical:4},railLetter:{paddingHorizontal:4,minHeight:14,justifyContent:"center"},railLetterText:{includeFontPadding:!1,lineHeight:14},sectionTitle:{includeFontPadding:!1,letterSpacing:.6},optionIcon:{marginRight:12},optionTextWrap:{flex:1},optionLabel:{includeFontPadding:!1},optionDescription:{includeFontPadding:!1,marginTop:2},checkbox:{width:22,height:22,borderRadius:6,...smoothCorners,borderWidth:2,alignItems:"center",justifyContent:"center",marginLeft:12},checkboxTick:{width:10,height:6,borderLeftWidth:2,borderBottomWidth:2,borderColor:e.colors.onPrimary,transform:[{rotate:"-45deg"},{translateY:-1}]},singleSelectedDot:{width:8,height:8,borderRadius:4,...smoothCorners,marginLeft:12},singleSelectedIcon:{marginLeft:12},empty:{textAlign:"center"},sheetFooter:{borderTopWidth:StyleSheet.hairlineWidth,alignItems:"flex-end"},doneButton:{alignSelf:"flex-end"}});export default OptionSheet;
1	+ "use strict";import{useCallback,useEffect,useMemo,useRef,useState}from"react";import{Animated,Dimensions,Easing,FlatList,Modal,Platform,Pressable,StatusBar,StyleSheet,Text,TextInput,View}from"react-native";import{Gesture,GestureDetector,GestureHandlerRootView}from"react-native-gesture-handler";import{useKeyboardState}from"react-native-keyboard-controller";import{useDragToDismiss}from"../../hooks/useDragToDismiss.js";import{createAnimatedValue,setNativeValue,useTheme}from"../../theme/index.js";import{smoothCorners}from"../../utils/corners.js";import{defaultIcons}from"../AppIcon/defaultIcons.js";import{ModalSafeArea,useModalInsets}from"../ModalSafeArea/ModalSafeArea.js";import{ToastHost}from"../Toast/ToastProvider.js";import{jsx as _jsx,jsxs as _jsxs,Fragment as _Fragment}from"react/jsx-runtime";const SEARCH_ICON_SIZE=18;export const OptionSheet=e=>{const{open:t,onClose:o,onAfterClose:i,onOpenChange:s,title:r,options:n,sections:a,renderSectionHeader:l,renderOption:c,alphabetIndex:d=!1,searchPlaceholder:p="Search…",emptyText:u="No options",labelOf:h,getValue:m,disabledOf:g,destructiveOf:f,descriptionOf:y,iconOf:b,isSelected:x,onSelect:S,multi:T=!1,searchable:j=!1,searchSelectionColor:C,accessibilityLabel:w,optionStyle:_,selectedOptionStyle:R,optionTextStyle:V,selectedOptionTextStyle:k,testID:I}=e,v=useTheme(),[z,D]=useModalInsets(),L=useMemo(()=>buildStyles(v),[v]),[P,M]=useState(""),H=Dimensions.get("window").height,W=Math.round(.7H),[A,O]=useState(t),B=useRef(createAnimatedValue(0)).current,E=useRef(createAnimatedValue(W)).current,F=useRef(createAnimatedValue(0)).current,N=useMemo(()=>Animated.add(E,F),[E,F]);useEffect(()=>{t&&O(!0)},[t]);const G=useRef(s);G.current=s;const $=useRef(!1);useEffect(()=>{$.current!==t&&($.current=t,G.current?.(t))},[t]);const J=useRef(i);J.current=i;const K=useRef(A);useEffect(()=>{K.current&&!A&&"ios"!==Platform.OS&&J.current?.(),K.current=A},[A]),useEffect(()=>{if(!A)return;t&&setNativeValue(F,0);const e=t?Animated.parallel([Animated.timing(B,{toValue:1,duration:v.motion.duration.fast,easing:Easing.bezier(...v.motion.easing.standard),useNativeDriver:!1}),Animated.spring(E,{toValue:0,damping:v.motion.spring.snappy.damping,stiffness:v.motion.spring.snappy.stiffness,mass:v.motion.spring.snappy.mass,useNativeDriver:!0})]):Animated.parallel([Animated.timing(B,{toValue:0,duration:v.motion.duration.fast,easing:Easing.bezier(...v.motion.easing.standard),useNativeDriver:!1}),Animated.timing(E,{toValue:W,duration:v.motion.duration.fast,easing:Easing.bezier(...v.motion.easing.accelerate),useNativeDriver:!0})]);return e.start(({finished:e})=>{e&&!t&&O(!1)}),()=>e.stop()},[t,A,B,E,F,W,v.motion.duration.fast,v.motion.easing.standard,v.motion.easing.accelerate,v.motion.spring.snappy]);const{handleGesture:U}=useDragToDismiss({drag:F,travel:W,onDismiss:o}),Y=useMemo(()=>Gesture.Native(),[]),[Z,q]=useState(0),Q=useKeyboardState(e=>e.height),X=A?Math.max(0,Math.round(Q)):0,ee=Math.max(z.top,StatusBar.currentHeight??0)+v.spacing.sm,te=X>0,oe=te?Math.max(0,Math.min(W,(Z>0?Z:H)-X-ee)):W;useEffect(()=>{t\|\|M("")},[t]);const ie=useMemo(()=>{const e=j?P.trim().toLowerCase():"",matches=t=>0===e.length\|\|h(t).toLowerCase().includes(e)\|\|(y(t)??"").toLowerCase().includes(e);if(!a)return n.filter(matches).map(e=>({kind:"option",option:e}));const t=[];return a.forEach((e,o)=>{const i=e.options.filter(matches);if(0!==i.length){t.push({kind:"header",title:e.title});for(const e of i)t.push({kind:"option",option:e,section:o})}}),t},[j,P,n,a,h,y]),se=useCallback(()=>{o()},[o]),re=useRef(null),ne=useMemo(()=>{const e=new Map;if(!d)return e;let t=0;if(a)for(let e=ie.length-1;e>=0;e-=1)if("header"===ie[e].kind){t=e+1;break}for(let o=t;o<ie.length;o+=1){const t=ie[o];if("option"!==t.kind)continue;const i=h(t.option).trim().charAt(0).toUpperCase(),s=/^[A-Z]$/.test(i)?i:"#";e.has(s)\|\|e.set(s,o)}return e},[d,ie,a,h]),ae=d&&ne.size>0&&0===P.trim().length,le=useMemo(()=>[..."ABCDEFGHIJKLMNOPQRSTUVWXYZ",...ne.has("#")?["#"]:[]],[ne]),ce=useCallback(e=>{const t=ne.get(e);void 0!==t&&re.current?.scrollToIndex({index:t,animated:!0,viewPosition:0})},[ne]),de=useRef(null),pe=useCallback(()=>{null!==de.current&&(clearTimeout(de.current),de.current=null)},[]),ue=useCallback(e=>{re.current?.scrollToOffset({offset:e.averageItemLengthe.index,animated:!1}),pe(),de.current=setTimeout(()=>{de.current=null,re.current?.scrollToIndex({index:e.index,animated:!0,viewPosition:0})},50)},[pe]);useEffect(()=>(A\|\|pe(),pe),[A,pe]);return _jsx(Modal,{visible:A,transparent:!0,animationType:"none",onRequestClose:se,onDismiss:()=>J.current?.(),statusBarTranslucent:!0,navigationBarTranslucent:!0,children:_jsx(ModalSafeArea,{onInsets:D,children:_jsxs(GestureHandlerRootView,{collapsable:!1,onLayout:e=>q(e.nativeEvent.layout.height),style:[StyleSheet.absoluteFill,{backgroundColor:v.colors.background.overlay}],children:[_jsx(Pressable,{style:StyleSheet.absoluteFill,onPress:se,accessibilityRole:"button",accessibilityLabel:"Close picker"}),_jsxs(Animated.View,{testID:I,accessibilityViewIsModal:!0,accessibilityLabel:w??r??"Options",style:[L.sheet,{maxHeight:oe,bottom:X,paddingBottom:te?16:z.bottom+16,backgroundColor:v.colors.background.elevated,borderTopLeftRadius:v.radius.xl,borderTopRightRadius:v.radius.xl,...smoothCorners,transform:[{translateY:N}],...v.shadows.xl}],children:[_jsx(GestureDetector,{gesture:U,children:_jsxs(View,{children:[_jsx(View,{style:L.sheetHandleRow,children:_jsx(View,{style:[L.sheetHandle,{backgroundColor:v.components.select?.handleColor??v.components.bottomSheet?.handleColor??v.colors.border.primary}]})}),r?_jsx(Text,{style:[L.sheetTitle,{color:v.colors.text.primary,fontSize:v.typography.fontSize.lg,fontWeight:v.typography.fontWeight.semibold,paddingHorizontal:v.spacing.lg,marginBottom:v.spacing.sm}],children:r}):null]})}),j?_jsx(View,{style:[L.searchWrap,{marginHorizontal:v.spacing.lg,marginBottom:v.spacing.sm}],children:_jsxs(View,{style:[L.searchBox,{backgroundColor:v.colors.background.secondary,borderColor:v.colors.border.primary,borderRadius:v.radius.md,...smoothCorners,paddingHorizontal:v.spacing.md,gap:v.spacing.sm}],children:[(v.icons?.search??defaultIcons.search)({size:18,color:v.colors.text.tertiary}),_jsx(TextInput,{value:P,onChangeText:M,placeholder:p,placeholderTextColor:v.colors.text.tertiary,selectionColor:C??v.colors.border.focus,accessibilityLabel:"Search options",style:[L.searchInput,{color:v.colors.text.primary,fontSize:v.typography.fontSize.base,paddingVertical:v.spacing.sm}]}),P.length>0?_jsx(Pressable,{onPress:()=>M(""),hitSlop:8,accessibilityRole:"button",accessibilityLabel:"Clear search",children:(v.icons?.close??defaultIcons.close)({size:18,color:v.colors.text.secondary})}):null]})}):null,_jsxs(View,{style:[L.listWrap,ae?L.listRow:null],children:[_jsx(GestureDetector,{gesture:Y,children:_jsx(FlatList,{ref:re,data:ie,keyExtractor:e=>"header"===e.kind?`h:${e.title}`:`o:${e.section??""}:${String(m(e.option))}`,renderItem:({item:e})=>{if("header"===e.kind)return _jsx(View,{accessible:!0,accessibilityRole:"header",style:[L.sectionHeader,{paddingHorizontal:v.spacing.lg,paddingTop:v.spacing.md}],children:l?l(e.title):_jsx(Text,{style:[L.sectionTitle,{color:v.colors.text.tertiary,fontSize:v.typography.fontSize.xs,fontWeight:v.typography.fontWeight.semibold}],children:e.title.toUpperCase()})});const t=e.option,o=h(t),i=m(t),s=y(t),r=b(t),n=x(i),a=g(t),d=f?.(t)??!1;return _jsxs(Pressable,{onPress:()=>S(t),disabled:a,android_ripple:{color:v.colors.surface.pressed,borderless:!1},accessibilityRole:"button",accessibilityLabel:o,accessibilityState:{selected:n,disabled:a},"aria-selected":n,"aria-disabled":a,style:({pressed:e})=>[L.optionRow,{backgroundColor:n?v.colors.surface.selected:e?v.colors.surface.pressed:"transparent",opacity:a?.5:1,paddingHorizontal:v.spacing.lg,paddingVertical:v.spacing.md},_,n?R:null],children:[c?_jsx(View,{style:L.optionTextWrap,children:c(t,{selected:n,disabled:a})}):_jsxs(_Fragment,{children:[r?_jsx(View,{style:L.optionIcon,children:r}):null,_jsxs(View,{style:L.optionTextWrap,children:[_jsx(Text,{style:[L.optionLabel,{color:d?v.colors.toneText.error:n?v.colors.primary:v.colors.text.primary,fontSize:v.typography.fontSize.base,fontWeight:n?v.typography.fontWeight.semibold:v.typography.fontWeight.medium},V,n?k:null],children:o}),s?_jsx(Text,{style:[L.optionDescription,{color:v.colors.text.tertiary,fontSize:v.typography.fontSize.sm}],numberOfLines:2,children:s}):null]})]}),T?_jsx(View,{style:[L.checkbox,{borderColor:n?v.colors.primary:v.colors.border.primary,backgroundColor:n?v.colors.primary:"transparent"}],children:n?_jsx(View,{style:L.checkboxTick}):null}):n?"icon"===v.components.optionSheet?.selectedMarker?_jsx(View,{style:L.singleSelectedIcon,children:(v.icons?.selectedTick??defaultIcons.selectedTick)({size:20,color:v.colors.primary})}):_jsx(View,{style:[L.singleSelectedDot,{backgroundColor:v.colors.primary}]}):null]})},onScrollToIndexFailed:ue,overScrollMode:"never",bounces:!1,keyboardShouldPersistTaps:"handled",showsVerticalScrollIndicator:!ae,style:ae?L.listBesideRail:null,ListEmptyComponent:_jsx(Text,{style:[L.empty,{color:v.colors.text.tertiary,fontSize:v.typography.fontSize.sm,paddingVertical:v.spacing.xl}],children:u})})}),ae?_jsx(View,{style:[L.rail,{paddingRight:v.spacing.xs}],accessibilityRole:"list",accessibilityLabel:"Jump to letter",testID:"option-sheet-alphabet",children:le.map(e=>{const t=ne.has(e);return _jsx(Pressable,{onPress:()=>ce(e),disabled:!t,hitSlop:{left:8,right:8},accessibilityRole:"button",accessibilityLabel:`Jump to ${e}`,accessibilityState:{disabled:!t},"aria-disabled":!t,style:L.railLetter,children:_jsx(Text,{style:[L.railLetterText,{color:t?v.colors.primary:v.colors.text.tertiary,fontSize:v.typography.fontSize.xs,fontWeight:v.typography.fontWeight.semibold,opacity:t?1:.45}],children:e})},e)})}):null]}),T?_jsx(View,{style:[L.sheetFooter,{borderTopColor:v.colors.border.secondary,paddingHorizontal:v.spacing.lg,paddingVertical:v.spacing.md}],children:_jsx(Pressable,{onPress:se,accessibilityRole:"button",accessibilityLabel:"Done",style:({pressed:e})=>[L.doneButton,{backgroundColor:e?v.colors.primaryPressed:v.colors.primary,borderRadius:v.radius.md,...smoothCorners,paddingVertical:v.spacing.sm,paddingHorizontal:v.spacing.lg}],children:_jsx(Text,{style:{color:v.colors.onPrimary,fontSize:v.typography.fontSize.base,fontWeight:v.typography.fontWeight.semibold},children:"Done"})})}):null]}),_jsx(ToastHost,{})]})})})};OptionSheet.displayName="OptionSheet";const buildStyles=e=>StyleSheet.create({sheet:{position:"absolute",left:0,right:0,bottom:0,paddingBottom:16,overflow:"hidden"},sheetHandleRow:{alignItems:"center",paddingTop:10,paddingBottom:8},sheetHandle:{width:36,height:4,borderRadius:2,...smoothCorners},sheetTitle:{includeFontPadding:!1},searchWrap:{width:"auto"},searchBox:{flexDirection:"row",alignItems:"center",borderWidth:1},searchInput:{flex:1,includeFontPadding:!1},optionRow:{flexDirection:"row",alignItems:"center"},sectionHeader:{paddingBottom:4},listWrap:{flexShrink:1},listRow:{flexDirection:"row"},listBesideRail:{flex:1},rail:{justifyContent:"space-between",alignItems:"center",alignSelf:"stretch",paddingVertical:4},railLetter:{paddingHorizontal:4,minHeight:14,justifyContent:"center"},railLetterText:{includeFontPadding:!1,lineHeight:14},sectionTitle:{includeFontPadding:!1,letterSpacing:.6},optionIcon:{marginRight:12},optionTextWrap:{flex:1},optionLabel:{includeFontPadding:!1},optionDescription:{includeFontPadding:!1,marginTop:2},checkbox:{width:22,height:22,borderRadius:6,...smoothCorners,borderWidth:2,alignItems:"center",justifyContent:"center",marginLeft:12},checkboxTick:{width:10,height:6,borderLeftWidth:2,borderBottomWidth:2,borderColor:e.colors.onPrimary,transform:[{rotate:"-45deg"},{translateY:-1}]},singleSelectedDot:{width:8,height:8,borderRadius:4,...smoothCorners,marginLeft:12},singleSelectedIcon:{marginLeft:12},empty:{textAlign:"center"},sheetFooter:{borderTopWidth:StyleSheet.hairlineWidth,alignItems:"flex-end"},doneButton:{alignSelf:"flex-end"}});export default OptionSheet;

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

	@@ -1 +1 @@
1	- "use strict";import{countryFlagEmoji,formatPhoneAsTyped,getPhoneCountries,isSupportedCountry,isValidNationalNumber,maxNationalNumberLength,splitPhoneNumber}from"@webority/mobile-core";import{PHONE_COUNTRY_NAMES}from"@webority/mobile-core/phone/countries";import{forwardRef,useCallback,useEffect,useImperativeHandle,useMemo,useRef,useState}from"react";import{Pressable,StyleSheet,Text,TextInput,View}from"react-native";import{useControllableState}from"../../hooks/index.js";import{fontFor,useTheme}from"../../theme/index.js";import{resolveHaptic,triggerHaptic}from"../../utils/index.js";import{FieldBase,FieldLabel,FieldMessage,hasFieldText,RequiredPlaceholder,resolveFieldSize,resolveFieldTextStyle}from"../FieldBase/index.js";import{Chevron}from"../FieldBase/Chevron.js";import{useFloatingLabel}from"../FieldBase/useFloatingLabel.js";import{OptionSheet}from"../OptionSheet/OptionSheet.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";export const DEFAULT_CALLING_CODES=[{iso:"IN",code:"91",label:"India"},{iso:"AE",code:"971",label:"United Arab Emirates"},{iso:"GB",code:"44",label:"United Kingdom"},{iso:"US",code:"1",label:"United States"},{iso:"CA",code:"1",label:"Canada"},{iso:"AU",code:"61",label:"Australia"},{iso:"SG",code:"65",label:"Singapore"},{iso:"SA",code:"966",label:"Saudi Arabia"}];export const ALL_CALLING_CODES=getPhoneCountries().map(e=>({iso:e.iso,code:e.callingCode,label:PHONE_COUNTRY_NAMES[e.iso]??e.iso})).sort((e,t)=>e.label.localeCompare(t.label));const digitsOnly=e=>e.replace(/[^0-9]/g,"");export const formatE164=e=>`+${e.callingCode}${e.nationalNumber}`;export const parseE164=(e,t,o)=>{const i=e.replace(/[^0-9]/g,"");if(!i)return null;const n=splitPhoneNumber(`+${i}`);let l=n?.callingCode,r=n?.nationalNumber??"";if(!l){const e=Array.from(new Set(t.map(e=>e.code))).sort((e,t)=>t.length-e.length);if(l=e.find(e=>i.startsWith(e)),!l)return null;r=i.slice(l.length)}const a=t.filter(e=>e.code===l),s=a.find(e=>e.iso===o)?.iso??a.find(e=>e.iso===n?.country)?.iso??n?.country??a[0]?.iso??"";return{callingCode:l,nationalNumber:r,iso:s}};const planOf=e=>isSupportedCountry(e)?e:null;export const PhoneNumberInput=forwardRef((e,t)=>{const{value:o,defaultValue:i,onChange:n,e164:l,onChangeE164:r,returnKeyType:a,submitBehavior:s,onSubmitEditing:u,blurOnSubmit:d,onComplete:c,onValidityChange:b,countries:m=ALL_CALLING_CODES,popularCountries:p,popularCountriesTitle:f="Popular",allCountriesTitle:g="All countries",hiddenCountries:h,showFlag:y=!0,renderFlag:N,renderCountry:C,countrySearchPlaceholder:S,showAlphabetIndex:x,defaultIso:v="IN",validation:F="any",maxLength:T,formatAsYouType:I=!0,countryLocked:E=!1,label:L,labelMode:O="top",labelStyle:P,placeholder:j="Phone number",helperText:_,error:A,invalidMessage:w,required:z,disabled:R=!1,size:k="md",variant:M,borderRadius:V,countrySheetTitle:D="Country code",haptic:B,accessibilityLabel:$,countryAccessibilityLabel:H,onFocus:U,onBlur:W,style:q,testID:G}=e,Y=useTheme(),K=useMemo(()=>buildStyles(Y),[Y]),J=useRef(null),Q=useMemo(()=>h?.length?m.filter(e=>!h.includes(e.iso)):m,[m,h]),X=useMemo(()=>{if(!p?.length)return;const e=p.map(e=>Q.find(t=>t.iso===e)).filter(e=>void 0!==e);return e.length?[{title:f,options:e},{title:g,options:Q}]:void 0},[p,f,g,Q]),Z=useCallback((e,t,o)=>{if(!e)return null;if(N)return N(e);if(!y)return null;const i=countryFlagEmoji(e.iso);return i?_jsx(Text,{style:[K.flag,{fontSize:t}],testID:o,children:i}):null},[N,y,K.flag]),ee=useCallback(e=>{const t=planOf(e),o=t?maxNationalNumberLength(t,!1===F?"any":F):Number.POSITIVE_INFINITY;return T?Math.min(o,T):o},[T,F]),te=useCallback((e,t)=>e.slice(0,ee(t)),[ee]),oe=useCallback((e,t)=>{const o=planOf(t)??void 0,i=splitPhoneNumber(e,o);if(!i)return null;const n=i.country??t,l=m.find(e=>e.iso===n);return{callingCode:l?.code??i.callingCode,nationalNumber:te(i.nationalNumber,n),iso:l?.iso??n}},[m,te]),ie=useMemo(()=>{const e=Q.find(e=>e.iso===v)??Q[0]??m[0],t={callingCode:e?.code??"91",nationalNumber:"",iso:e?.iso??"IN"};return"string"==typeof i?oe(i,t.iso)??t:i??t},[m,Q,v,i,oe]),ne=useCallback(e=>{if(!1===F)return e.nationalNumber.length>0;const t=planOf(e.iso);return t?isValidNationalNumber(e.nationalNumber,t,F):e.nationalNumber.length>0},[F]),[le,re]=useState(ie.iso),ae=useMemo(()=>{if(void 0===l)return;const e=l?parseE164(l,m,le):null;if(e)return{...e,nationalNumber:te(e.nationalNumber,e.iso)};const t=m.find(e=>e.iso===le);return{callingCode:t?.code??ie.callingCode,nationalNumber:"",iso:le}},[l,m,le,ie.callingCode,te]),se=useCallback(e=>{re(e.iso),n?.(e),r?.(e.nationalNumber?formatE164(e):"",{country:m.find(t=>t.iso===e.iso),national:e.nationalNumber,valid:ne(e)})},[n,r,m,ne]),[ue,de]=useControllableState({value:o??ae,defaultValue:ie,onChange:se}),[ce,be]=useState(!1),me=useCallback(()=>{R\|\|J.current?.focus()},[R]),[pe,fe]=useState(!1),[ge,he]=useState(!1),[ye,Ne]=useState(!1),Ce=useRef(!1);useEffect(()=>{ye\|\|(Ce.current=!1)},[ye]);const Se=resolveFieldSize(Y,k),xe=resolveFieldTextStyle(Y,{disabled:R}),ve=M??Y.components.field?.defaultVariant??"outlined",Fe="underline"===ve,Te=V??Y.components.phoneNumberInput?.borderRadius,Ie=Y.spacing.md,[Ee,Le]=useState(0),Oe=Ee+Ie+1+Ie,Pe=ue.nationalNumber.length>0,je=z&&!L&&!Pe&&j.length>0,_e=ce\|\|Pe,Ae=Boolean(L)&&"float"===O&&Ee>0,we=useFloatingLabel({label:L,enabled:Ae,floated:_e,required:z,variant:ve,sizeTokens:Se,leadingOffset:Oe,paddingLeft:Fe?0:Se.paddingHorizontal,color:Y.colors.field.label,style:P}),ze=useMemo(()=>m.find(e=>e.iso===ue.iso),[m,ue.iso]),Re=planOf(ue.iso),ke=I&&Re?formatPhoneAsTyped(ue.nationalNumber,Re):ue.nationalNumber,Me=ee(ue.iso),Ve=0===ue.nationalNumber.length\|\|pe\|\|!Number.isFinite(Me)?void 0:ke.length+Math.max(0,Me-ue.nationalNumber.length),De=ne(ue);useEffect(()=>{Pe\|\|he(!1)},[Pe]);const Be=Re?maxNationalNumberLength(Re,!1===F?"any":F):Number.POSITIVE_INFINITY~~,$e~~=ue.nationalNumber.length~~>=Be~~,He=!1!==F&&!1!==w&&Pe&&!De&&(ge~~\|\|$e~~),Ue="mobile"===F?"Enter a valid mobile number":"Enter a valid number",We=hasFieldText(A)?A:He?w\|\|Ue:void 0,qe=!0===A\|\|hasFieldText(We),Ge=useRef(De),Ye=useRef(ue);Ye.current=ue,useEffect(()=>{Ge.current!==De&&(Ge.current=De,b?.(De),De&&c?.(formatE164(Ye.current)))},[De,c,b]);const Ke=useCallback(e=>{if(e.includes("+")){const t=oe(e,ue.iso);if(t&&!E&&Q.some(e=>e.iso===t.iso))return void de(t);if(t&&t.iso===ue.iso)return void de(t)}de({...ue,nationalNumber:te(digitsOnly(e),ue.iso)})},[Q,E,ue,oe,te,de]),Je=useCallback(e=>{const t=e;de({callingCode:t.code,iso:t.iso,nationalNumber:te(ue.nationalNumber,t.iso)}),Ne(!1);const o=resolveHaptic(B,"selection");o&&triggerHaptic(o)},[ue,B,te,de]);useImperativeHandle(t,()=>({focus:()=>J.current?.focus(),blur:()=>J.current?.blur(),clear:()=>de({...Ye.current,nationalNumber:""}),isFocused:()=>J.current?.isFocused()??!1,getValue:()=>Ye.current,getE164:()=>formatE164(Ye.current),getFormatted:()=>{const e=Ye.current,t=planOf(e.iso);return t?formatPhoneAsTyped(e.nationalNumber,t):e.nationalNumber},isValid:()=>ne(Ye.current),getCountry:()=>m.find(e=>e.iso===Ye.current.iso)}),[m,ne,de]);const Qe=R\|\|E,Xe=_jsx(FieldBase,{size:k,variant:ve,borderRadius:Te,topNotch:we.topNotch,focused:ce,disabled:R,error:qe,filled:Pe,onPress:me,pressFeedback:!1,leadingDivider:!0,paddingLeft:Fe?0:void 0,leading:_jsxs(Pressable,{onPress:()=>{Qe\|\|(Ce.current=!0,Ne(!0))},disabled:Qe,accessibilityRole:"button",accessibilityLabel:H??`Country code, currently +${ue.callingCode}`,accessibilityState:{disabled:Qe},"aria-disabled":Qe,hitSlop:6,onLayout:e=>{const{width:t}=e.nativeEvent.layout;Le(e=>e===t?e:t)},style:K.codeTrigger,testID:G?`${G}-code`:void 0,children:[Z(ze,Se.fontSize,G?`${G}-flag`:void 0),_jsx(Text,{style:[K.codeText,{color:xe.color,fontSize:Se.fontSize}],children:`+${ue.callingCode}`}),E?null:_jsx(Chevron,{color:R?Y.colors.field.iconDisabled:Y.colors.field.icon,size:Se.iconSize,open:ye})]}),children:_jsxs(View,{style:K.inputWrap,children:[_jsx(TextInput,{ref:J,value:ke,maxLength:Ve,onChangeText:Ke,returnKeyType:a,submitBehavior:s,onSubmitEditing:u,blurOnSubmit:d,onSelectionChange:e=>{const{start:t,end:o}=e.nativeEvent.selection;fe(t!==o)},onFocus:()=>{be(!0),U?.()},onBlur:()=>{be(!1),Pe&&!Ce.current&&he(!0),W?.()},editable:!R,placeholder:Ae~~&&!_e~~\|\|je?void 0:j,placeholderTextColor:xe.placeholderColor,accessibilityLabel:$??L??j,selectionColor:Y.colors.field.caret,keyboardType:"phone-pad",textContentType:"telephoneNumber",autoComplete:"tel",style:[K.input,{color:xe.color,fontSize:Se.fontSize,...xe.weightStyle,paddingLeft:Fe?0:void 0}],testID:G?`${G}-input`:void 0}),je?_jsx(RequiredPlaceholder,{text:j,color:xe.placeholderColor,fontSize:Se.fontSize,weightStyle:xe.weightStyle}):null]})});return _jsxs(View,{style:q,testID:G,children:[L&&"top"===O?_jsx(FieldLabel,{size:k,required:z,children:L}):null,_jsxs(View,{style:K.fieldWrapper,children:[Xe,we.node]}),_jsx(FieldMessage,{size:k,error:qe,text:qe~~?We~~:_}),_jsx(OptionSheet,{open:ye,onClose:()=>Ne(!1),title:D,options:Q,sections:X,labelOf:e=>`${e.label} (+${e.code})`,getValue:e=>e.iso,disabledOf:()=>!1,descriptionOf:()=>{},iconOf:e=>Z(e,Y.typography.fontSize.lg),renderOption:C?(e,t)=>C(e,{selected:t.selected}):void 0,isSelected:e=>e===ze?.iso,onSelect:Je,searchable:Q.length>8,searchPlaceholder:S,alphabetIndex:x??Q.length>20})]})});PhoneNumberInput.displayName="PhoneNumberInput";const buildStyles=e=>StyleSheet.create({fieldWrapper:{position:"relative",overflow:"visible"},codeTrigger:{flexDirection:"row",alignItems:"center",gap:2},flag:{includeFontPadding:!1,marginRight:4},codeText:{...fontFor(e,"semibold"),fontWeight:"600",includeFontPadding:!1,writingDirection:"ltr"},input:{padding:0,margin:0,includeFontPadding:!1,writingDirection:"ltr"},inputWrap:{flex:1,alignSelf:"stretch",justifyContent:"center"}});export default PhoneNumberInput;
1	+ "use strict";import{countryFlagEmoji,formatPhoneAsTyped,getPhoneCountries,isSupportedCountry,isValidNationalNumber,maxNationalNumberLength,splitPhoneNumber}from"@webority/mobile-core";import{PHONE_COUNTRY_NAMES}from"@webority/mobile-core/phone/countries";import{forwardRef,useCallback,useEffect,useImperativeHandle,useMemo,useRef,useState}from"react";import{Pressable,StyleSheet,Text,TextInput,View}from"react-native";import{useControllableState}from"../../hooks/index.js";import{fontFor,useTheme}from"../../theme/index.js";import{resolveHaptic,triggerHaptic}from"../../utils/index.js";import{FieldBase,FieldLabel,FieldMessage,hasFieldText,RequiredPlaceholder,resolveFieldSize,resolveFieldTextStyle}from"../FieldBase/index.js";import{Chevron}from"../FieldBase/Chevron.js";import{useFloatingLabel}from"../FieldBase/useFloatingLabel.js";import{OptionSheet}from"../OptionSheet/OptionSheet.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";export const DEFAULT_CALLING_CODES=[{iso:"IN",code:"91",label:"India"},{iso:"AE",code:"971",label:"United Arab Emirates"},{iso:"GB",code:"44",label:"United Kingdom"},{iso:"US",code:"1",label:"United States"},{iso:"CA",code:"1",label:"Canada"},{iso:"AU",code:"61",label:"Australia"},{iso:"SG",code:"65",label:"Singapore"},{iso:"SA",code:"966",label:"Saudi Arabia"}];export const ALL_CALLING_CODES=getPhoneCountries().map(e=>({iso:e.iso,code:e.callingCode,label:PHONE_COUNTRY_NAMES[e.iso]??e.iso})).sort((e,t)=>e.label.localeCompare(t.label));const digitsOnly=e=>e.replace(/[^0-9]/g,"");export const formatE164=e=>`+${e.callingCode}${e.nationalNumber}`;export const parseE164=(e,t,o)=>{const i=e.replace(/[^0-9]/g,"");if(!i)return null;const n=splitPhoneNumber(`+${i}`);let l=n?.callingCode,r=n?.nationalNumber??"";if(!l){const e=Array.from(new Set(t.map(e=>e.code))).sort((e,t)=>t.length-e.length);if(l=e.find(e=>i.startsWith(e)),!l)return null;r=i.slice(l.length)}const a=t.filter(e=>e.code===l),s=a.find(e=>e.iso===o)?.iso??a.find(e=>e.iso===n?.country)?.iso??n?.country??a[0]?.iso??"";return{callingCode:l,nationalNumber:r,iso:s}};const planOf=e=>isSupportedCountry(e)?e:null;export const PhoneNumberInput=forwardRef((e,t)=>{const{value:o,defaultValue:i,onChange:n,e164:l,onChangeE164:r,returnKeyType:a,submitBehavior:s,onSubmitEditing:u,blurOnSubmit:d,onComplete:c,onValidityChange:b,countries:m=ALL_CALLING_CODES,popularCountries:p,popularCountriesTitle:f="Popular",allCountriesTitle:g="All countries",hiddenCountries:h,showFlag:y=!0,renderFlag:N,renderCountry:C,countrySearchPlaceholder:S,showAlphabetIndex:x,defaultIso:v="IN",validation:F="any",maxLength:T,formatAsYouType:I=!0,countryLocked:E=!1,label:L,labelMode:O="top",labelStyle:P,placeholder:j="Phone number",helperText:_,error:A,invalidMessage:w,required:z,disabled:R=!1,size:k="md",variant:M,borderRadius:V,countrySheetTitle:D="Country code",haptic:B,accessibilityLabel:$,countryAccessibilityLabel:H,onFocus:U,onBlur:W,style:q,testID:G}=e,Y=useTheme(),K=useMemo(()=>buildStyles(Y),[Y]),J=useRef(null),Q=useMemo(()=>h?.length?m.filter(e=>!h.includes(e.iso)):m,[m,h]),X=useMemo(()=>{if(!p?.length)return;const e=p.map(e=>Q.find(t=>t.iso===e)).filter(e=>void 0!==e);return e.length?[{title:f,options:e},{title:g,options:Q}]:void 0},[p,f,g,Q]),Z=useCallback((e,t,o)=>{if(!e)return null;if(N)return N(e);if(!y)return null;const i=countryFlagEmoji(e.iso);return i?_jsx(Text,{style:[K.flag,{fontSize:t}],testID:o,children:i}):null},[N,y,K.flag]),ee=useCallback(e=>{const t=planOf(e),o=t?maxNationalNumberLength(t,!1===F?"any":F):Number.POSITIVE_INFINITY;return T?Math.min(o,T):o},[T,F]),te=useCallback((e,t)=>e.slice(0,ee(t)),[ee]),oe=useCallback((e,t)=>{const o=planOf(t)??void 0,i=splitPhoneNumber(e,o);if(!i)return null;const n=i.country??t,l=m.find(e=>e.iso===n);return{callingCode:l?.code??i.callingCode,nationalNumber:te(i.nationalNumber,n),iso:l?.iso??n}},[m,te]),ie=useMemo(()=>{const e=Q.find(e=>e.iso===v)??Q[0]??m[0],t={callingCode:e?.code??"91",nationalNumber:"",iso:e?.iso??"IN"};return"string"==typeof i?oe(i,t.iso)??t:i??t},[m,Q,v,i,oe]),ne=useCallback(e=>{if(!1===F)return e.nationalNumber.length>0;const t=planOf(e.iso);return t?isValidNationalNumber(e.nationalNumber,t,F):e.nationalNumber.length>0},[F]),[le,re]=useState(ie.iso),ae=useMemo(()=>{if(void 0===l)return;const e=l?parseE164(l,m,le):null;if(e)return{...e,nationalNumber:te(e.nationalNumber,e.iso)};const t=m.find(e=>e.iso===le);return{callingCode:t?.code??ie.callingCode,nationalNumber:"",iso:le}},[l,m,le,ie.callingCode,te]),se=useCallback(e=>{re(e.iso),n?.(e),r?.(e.nationalNumber?formatE164(e):"",{country:m.find(t=>t.iso===e.iso),national:e.nationalNumber,valid:ne(e)})},[n,r,m,ne]),[ue,de]=useControllableState({value:o??ae,defaultValue:ie,onChange:se}),[ce,be]=useState(!1),me=useCallback(()=>{R\|\|J.current?.focus()},[R]),[pe,fe]=useState(!1),[ge,he]=useState(!1),[ye,Ne]=useState(!1),Ce=useRef(!1);useEffect(()=>{ye\|\|(Ce.current=!1)},[ye]);const Se=resolveFieldSize(Y,k),xe=resolveFieldTextStyle(Y,{disabled:R}),ve=M??Y.components.field?.defaultVariant??"outlined",Fe="underline"===ve,Te=V??Y.components.phoneNumberInput?.borderRadius,Ie=Y.spacing.md,[Ee,Le]=useState(0),Oe=Ee+Ie+1+Ie,Pe=ue.nationalNumber.length>0,je=z&&!L&&!Pe&&j.length>0,Ae=ce\|\|Pe,we=Boolean(L)&&"float"===O&&Ee>0,ze=useFloatingLabel({label:L,enabled:we,floated:Ae,required:z,variant:ve,sizeTokens:Se,leadingOffset:Oe,paddingLeft:Fe?0:Se.paddingHorizontal,color:Y.colors.field.label,style:P}),Re=useMemo(()=>m.find(e=>e.iso===ue.iso),[m,ue.iso]),ke=planOf(ue.iso),Me=I&&ke?formatPhoneAsTyped(ue.nationalNumber,ke):ue.nationalNumber,Ve=ee(ue.iso),De=0===ue.nationalNumber.length\|\|pe\|\|!Number.isFinite(Ve)?void 0:Me.length+Math.max(0,Ve-ue.nationalNumber.length),Be=ne(ue);useEffect(()=>{Pe\|\|he(!1)},[Pe]);const $e=ke?maxNationalNumberLength(ke,!1===F?"any":F):Number.POSITIVE_INFINITY,He=ue.nationalNumber.length>=$e,Ue=!1!==F&&!1!==w&&Pe&&!Be&&(ge\|\|He),We="mobile"===F?"Enter a valid mobile number":"Enter a valid number",qe=hasFieldText(A)?A:Ue?w\|\|We:void 0,Ge=!0===A\|\|hasFieldText(qe),Ye=useRef(Be),Ke=useRef(ue);Ke.current=ue,useEffect(()=>{Ye.current!==Be&&(Ye.current=Be,b?.(Be),Be&&c?.(formatE164(Ke.current)))},[Be,c,b]);const Je=useCallback(e=>{if(e.includes("+")){const t=oe(e,ue.iso);if(t&&!E&&Q.some(e=>e.iso===t.iso))return void de(t);if(t&&t.iso===ue.iso)return void de(t)}de({...ue,nationalNumber:te(digitsOnly(e),ue.iso)})},[Q,E,ue,oe,te,de]),Qe=useCallback(e=>{const t=e;de({callingCode:t.code,iso:t.iso,nationalNumber:te(ue.nationalNumber,t.iso)}),Ne(!1);const o=resolveHaptic(B,"selection");o&&triggerHaptic(o)},[ue,B,te,de]);useImperativeHandle(t,()=>({focus:()=>J.current?.focus(),blur:()=>J.current?.blur(),clear:()=>de({...Ke.current,nationalNumber:""}),isFocused:()=>J.current?.isFocused()??!1,getValue:()=>Ke.current,getE164:()=>formatE164(Ke.current),getFormatted:()=>{const e=Ke.current,t=planOf(e.iso);return t?formatPhoneAsTyped(e.nationalNumber,t):e.nationalNumber},isValid:()=>ne(Ke.current),getCountry:()=>m.find(e=>e.iso===Ke.current.iso)}),[m,ne,de]);const Xe=R\|\|E,Ze=_jsx(FieldBase,{size:k,variant:ve,borderRadius:Te,topNotch:ze.topNotch,focused:ce,disabled:R,error:Ge,filled:Pe,onPress:me,pressFeedback:!1,leadingDivider:!0,paddingLeft:Fe?0:void 0,leading:_jsxs(Pressable,{onPress:()=>{Xe\|\|(Ce.current=!0,Ne(!0))},disabled:Xe,accessibilityRole:"button",accessibilityLabel:H??`Country code, currently +${ue.callingCode}`,accessibilityState:{disabled:Xe},"aria-disabled":Xe,hitSlop:6,onLayout:e=>{const{width:t}=e.nativeEvent.layout;Le(e=>e===t?e:t)},style:K.codeTrigger,testID:G?`${G}-code`:void 0,children:[Z(Re,Se.fontSize,G?`${G}-flag`:void 0),_jsx(Text,{style:[K.codeText,{color:xe.color,fontSize:Se.fontSize}],children:`+${ue.callingCode}`}),E?null:_jsx(Chevron,{color:R?Y.colors.field.iconDisabled:Y.colors.field.icon,size:Se.iconSize,open:ye})]}),children:_jsxs(View,{style:K.inputWrap,children:[_jsx(TextInput,{ref:J,value:Me,maxLength:De,onChangeText:Je,returnKeyType:a,submitBehavior:s,onSubmitEditing:u,blurOnSubmit:d,onSelectionChange:e=>{const{start:t,end:o}=e.nativeEvent.selection;fe(t!==o)},onFocus:()=>{be(!0),U?.()},onBlur:()=>{be(!1),Pe&&!Ce.current&&he(!0),W?.()},editable:!R,placeholder:we&&!Ae\|\|je?void 0:j,placeholderTextColor:xe.placeholderColor,accessibilityLabel:$??L??j,selectionColor:Y.colors.field.caret,keyboardType:"phone-pad",textContentType:"telephoneNumber",autoComplete:"tel",style:[K.input,{color:xe.color,fontSize:Se.fontSize,...xe.weightStyle,paddingLeft:Fe?0:void 0}],testID:G?`${G}-input`:void 0}),je?_jsx(RequiredPlaceholder,{text:j,color:xe.placeholderColor,fontSize:Se.fontSize,weightStyle:xe.weightStyle}):null]})});return _jsxs(View,{style:q,testID:G,children:[L&&"top"===O?_jsx(FieldLabel,{size:k,required:z,children:L}):null,_jsxs(View,{style:K.fieldWrapper,children:[Ze,ze.node]}),_jsx(FieldMessage,{size:k,error:Ge,text:Ge?qe:_}),_jsx(OptionSheet,{open:ye,onClose:()=>Ne(!1),title:D,options:Q,sections:X,labelOf:e=>`${e.label} (+${e.code})`,getValue:e=>e.iso,disabledOf:()=>!1,descriptionOf:()=>{},iconOf:e=>Z(e,Y.typography.fontSize.lg),renderOption:C?(e,t)=>C(e,{selected:t.selected}):void 0,isSelected:e=>e===Re?.iso,onSelect:Qe,searchable:Q.length>8,searchPlaceholder:S,alphabetIndex:x??Q.length>20})]})});PhoneNumberInput.displayName="PhoneNumberInput";const buildStyles=e=>StyleSheet.create({fieldWrapper:{position:"relative",overflow:"visible"},codeTrigger:{flexDirection:"row",alignItems:"center",gap:2},flag:{includeFontPadding:!1,marginRight:4},codeText:{...fontFor(e,"semibold"),fontWeight:"600",includeFontPadding:!1,writingDirection:"ltr"},input:{padding:0,margin:0,includeFontPadding:!1,writingDirection:"ltr"},inputWrap:{flex:1,alignSelf:"stretch",justifyContent:"center"}});export default PhoneNumberInput;

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,_,$]),_e={size:N.iconSize,color:c?A.colors.text.disabled:A.colors.text.tertiary,disabled:c},ze=d?renderSlotIcon(d,_e):(A.icons?.search??defaultIcons.search)(_e),Le=Boolean(m)&&"float"===g,Be=useFloatingLabel({label:m,enabled:Le,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}),Te=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&&!Le?_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:ze,trailing:Te,topNotch:Be.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:!Le\|\|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})}),Be.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{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;