@webority/mobile-ui 0.8.1 → 0.9.0

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

@@ -1 +1 @@
-"use strict";import{forwardRef,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{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 DAY_MS=864e5,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),daysBetween=(e,t)=>{const a=startOfDay(t).getTime()-startOfDay(e).getTime();return Math.round(a/DAY_MS)},buildMonthMatrix=(e,t)=>{const a=e.getFullYear(),r=e.getMonth(),o=(new Date(a,r,1).getDay()-t+7)%7,i=[];for(let e=0;e<42;e+=1){const t=new Date(a,r,1-o+e);i.push({date:t,inMonth:t.getMonth()===r,iso:toIso(t)})}return i},weekdayLabels=(e,t)=>{const a=new Intl.DateTimeFormat(e,{weekday:"short"}),r=[];for(let e=0;e<7;e+=1){const o=new Date(1970,0,4+(t+e)%7);r.push(a.format(o))}return r},formatMonthYear=(e,t)=>new Intl.DateTimeFormat(t,{month:"long",year:"numeric"}).format(e),formatRangePart=(e,t)=>new Intl.DateTimeFormat(t,{weekday:"short",day:"numeric",month:"short"}).format(e),formatLongDate=(e,t)=>new Intl.DateTimeFormat(t,{weekday:"long",year:"numeric",month:"long",day:"numeric"}).format(e),DateRangePicker=forwardRef((e,t)=>{const{visible:a,value:r,onChange:o,onClose:i,label:n,placeholder:s,helperText:l,error:c,required:d,disabled:g,size:u,variant:m,clearable:y,onClear:f,formatValue:p,triggerStyle:h,minDate:b,maxDate:x,disabledDates:D,locale:w="en-IN",weekStartsOn:S=0,title:v="Select Date Range",confirmLabel:R="Confirm",cancelLabel:T="Cancel",maxRange:k,haptic:j,style:C,containerStyle:P,headerLabelStyle:_,navButtonStyle:V,footerButtonStyle:M,testID:A}=e,B=void 0!==a,[I,L]=useState(!1),z=B?a:I,O=B?A:A?`${A}-calendar`:void 0,H=useTheme(),F=useSafeAreaInsets(),W=useMemo(()=>buildStyles(H),[H]),[E,N]=useState(()=>startOfDay(new Date));useEffect(()=>{z&&N(startOfDay(new Date))},[z]);const $=r.start?startOfDay(r.start):E,[Y,q]=useState($),[G,X]=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,Z=useRef(createAnimatedValue(0)).current,ee=useRef(0),te=useRef(createAnimatedValue(0)).current,ae=useRef(createAnimatedValue(1)).current;useEffect(()=>{if(r.start){const e=startOfDay(r.start);X(e),q(e)}else X(null);r.end?K(startOfDay(r.end)):K(null)},[r.start,r.end]),useEffect(()=>{let e;return z&&(Q.setValue(0),setNativeValue(U,0),setNativeValue(Z,0),e=Animated.parallel([Animated.timing(Q,{toValue:1,duration:H.motion.duration.normal,easing:Easing.out(Easing.cubic),useNativeDriver:!1}),Animated.spring(U,{toValue:1,damping:H.motion.spring.gentle.damping,stiffness:H.motion.spring.gentle.stiffness,mass:H.motion.spring.gentle.mass,useNativeDriver:!0})]),e.start()),()=>e?.stop()},[z,Q,U,Z,H.motion]);const re=useMemo(()=>{const e=new Set;return D?.forEach(t=>e.add(toIso(startOfDay(t)))),e},[D]),oe=useMemo(()=>b?startOfDay(b):null,[b]),ie=useMemo(()=>x?startOfDay(x):null,[x]),ne=useCallback(e=>!!(oe&&e.getTime()<oe.getTime())||(!!(ie&&e.getTime()>ie.getTime())||!!re.has(toIso(e))),[oe,ie,re]),se=useMemo(()=>buildMonthMatrix(Y,S),[Y,S]),le=useMemo(()=>formatMonthYear(Y,w),[Y,w]),ce=useMemo(()=>weekdayLabels(w,S),[w,S]),de=useCallback(e=>{!1!==j&&triggerHaptic("impactLight");const t=e>0?1:-1,a=H.components.dateRangePicker?.monthSlideDistance??32,r=H.components.dateRangePicker?.monthSlideOutDuration??H.motion.duration.fast??140,o=H.components.dateRangePicker?.monthSlideInDuration??H.motion.duration.fast??160;Animated.sequence([Animated.parallel([Animated.timing(te,{toValue:-t*a,duration:r,easing:Easing.out(Easing.quad),useNativeDriver:!0}),Animated.timing(ae,{toValue:0,duration:r,useNativeDriver:!0})]),Animated.timing(te,{toValue:t*a,duration:0,useNativeDriver:!0}),Animated.parallel([Animated.timing(te,{toValue:0,duration:o,easing:Easing.out(Easing.cubic),useNativeDriver:!0}),Animated.timing(ae,{toValue:1,duration:o,useNativeDriver:!0})])]).start();const i=addMonths(Y,e);q(i),AccessibilityInfo.announceForAccessibility(formatMonthYear(i,w))},[Y,j,w,ae,te,H.components.dateRangePicker,H.motion.duration.fast]),ge=useCallback(()=>de(-1),[de]),ue=useCallback(()=>de(1),[de]),me=useCallback(e=>{if(ne(e.date))return;const t=resolveHaptic(j,"selection");t&&triggerHaptic(t);const a=e.date;if(!G||G&&J)X(a),K(null);else if(a.getTime()<G.getTime())X(a),K(null);else if(isSameDay(a,G))K(a);else{if(k&&daysBetween(G,a)+1>k)return!1!==j&&triggerHaptic("notificationWarning"),X(a),void K(null);K(a)}e.inMonth||q(new Date(e.date.getFullYear(),e.date.getMonth(),1))},[ne,G,J,k,j]),ye=useCallback(()=>{B?i?.():L(!1)},[B,i]),fe=useCallback(()=>{Animated.parallel([Animated.timing(Q,{toValue:0,duration:H.motion.duration.fast,easing:Easing.bezier(...H.motion.easing.accelerate),useNativeDriver:!1}),Animated.timing(U,{toValue:0,duration:H.motion.duration.fast,easing:Easing.bezier(...H.motion.easing.accelerate),useNativeDriver:!0})]).start(()=>{ye()})},[Q,ye,U,H.motion.duration.fast,H.motion.easing.accelerate]),{handleGesture:pe}=useDragToDismiss({drag:Z,travel:()=>ee.current||320,onDismiss:fe}),he=useCallback(()=>{!1!==j&&triggerHaptic("selection"),fe()},[fe,j]),be=useCallback(()=>{G&&J&&(!1!==j&&triggerHaptic("notificationSuccess"),o?.({start:G,end:J}),fe())},[fe,o,G,J,j]),xe=U.interpolate({inputRange:[0,1],outputRange:[320,0]}),De=useMemo(()=>G&&J?`${formatRangePart(G,w)} — ${formatRangePart(J,w)}`:G?`${formatRangePart(G,w)} — …`:"—",[G,J,w]),we=useCallback(e=>{if(!G||!J)return!1;const t=startOfDay(e).getTime();return t>=G.getTime()&&t<=J.getTime()},[G,J]),Se=!G||!J,ve=_jsxs(View,{style:[W.card,C,P],ref:t,accessible:!1,testID:O,children:[_jsx(GestureDetector,{gesture:pe,children:_jsxs(View,{style:W.grabArea,children:[_jsx(View,{style:W.handle}),_jsxs(View,{style:W.titleRow,children:[_jsx(Text,{style:W.title,accessibilityRole:"header",children:v}),_jsx(Text,{style:W.subtitle,accessibilityLiveRegion:"polite",children:De})]})]})}),_jsxs(View,{style:W.headerRow,children:[_jsx(Pressable,{onPress:ge,style:({pressed:e})=>[W.navBtn,e&&W.navBtnPressed,V],accessibilityRole:"button",accessibilityLabel:"Previous month",hitSlop:8,children:_jsx(Text,{style:W.navText,children:"‹"})}),_jsx(Animated.View,{style:[W.headerLabelWrap,{opacity:ae,transform:[{translateX:te}]},_],children:_jsx(Text,{style:W.headerLabel,accessibilityLiveRegion:"polite",children:le})}),_jsx(Pressable,{onPress:ue,style:({pressed:e})=>[W.navBtn,e&&W.navBtnPressed,V],accessibilityRole:"button",accessibilityLabel:"Next month",hitSlop:8,children:_jsx(Text,{style:W.navText,children:"›"})})]}),_jsx(View,{style:W.weekdayRow,children:ce.map((e,t)=>_jsx(View,{style:W.weekdayCell,children:_jsx(Text,{style:W.weekdayText,children:e})},`${e}-${t}`))}),_jsx(Animated.View,{style:[W.grid,{opacity:ae,transform:[{translateX:te}]}],children:Array.from({length:6}).map((e,t)=>_jsx(View,{style:W.gridRow,children:se.slice(7*t,7*t+7).map(e=>{const t=ne(e.date),a=!!G&&isSameDay(e.date,G),r=!!J&&isSameDay(e.date,J),o=we(e.date),i=o&&!a&&!r,n=isSameDay(e.date,E),s=H.colors.primary,l=H.colors.primaryMuted,c=a||r?H.colors.onPrimary:e.inMonth?t?H.colors.text.disabled:H.colors.text.primary:H.colors.text.tertiary,d=t?.3:e.inMonth?1:.4,g=o&&!!G&&!!J&&(r||i),u=o&&!!G&&!!J&&(a||i),m=a?", start of range":r?", end of range":i?", in selected range":"";return _jsxs(Pressable,{disabled:t,onPress:()=>me(e),accessibilityRole:"button",accessibilityLabel:`${formatLongDate(e.date,w)}${m}`,accessibilityState:{selected:a||r,disabled:t,busy:i},style:W.dayCell,children:[g?_jsx(View,{style:[W.barLeft,{backgroundColor:l}],pointerEvents:"none"}):null,u?_jsx(View,{style:[W.barRight,{backgroundColor:l}],pointerEvents:"none"}):null,_jsx(View,{style:[W.dayInner,{backgroundColor:a||r?s:i?l:"transparent",borderColor:!n||a||r?"transparent":s,borderWidth:!n||a||r?0:1.5,borderRadius:i?H.radius.none:H.radius.full,...smoothCorners,opacity:d}],children:_jsx(Text,{style:[W.dayText,{color:c}],children:e.date.getDate()})})]},e.iso)})},`r-${t}`))}),_jsxs(View,{style:W.footer,children:[_jsx(Pressable,{onPress:he,style:({pressed:e})=>[W.footerBtn,W.footerCancel,e&&W.footerBtnPressed,M],accessibilityRole:"button",accessibilityLabel:T,children:_jsx(Text,{style:[W.footerBtnText,{color:H.colors.text.secondary}],children:T})}),_jsx(Pressable,{onPress:be,disabled:Se,style:({pressed:e})=>[W.footerBtn,W.footerConfirm,{backgroundColor:H.colors.primary,opacity:Se?.5:1},e&&{backgroundColor:H.colors.primaryHover},M],accessibilityRole:"button",accessibilityLabel:R,accessibilityState:{disabled:Se},children:_jsx(Text,{style:[W.footerBtnText,{color:H.colors.onPrimary}],children:R})})]})]}),Re=useMemo(()=>{if(!r.start||!r.end)return"";const e={start:r.start,end:r.end};return p?p(e):`${e.start.toLocaleDateString()} – ${e.end.toLocaleDateString()}`},[r.start,r.end,p]);return _jsxs(_Fragment,{children:[B?null:_jsx(PickerTrigger,{label:n,placeholder:s,helperText:l,error:c,required:d,disabled:g,size:u,variant:m,clearable:y,onClear:f,value:Re,onPress:()=>L(!0),triggerStyle:h,testID:A}),_jsx(Modal,{visible:z,transparent:!0,statusBarTranslucent:!0,navigationBarTranslucent:!0,animationType:"none",onRequestClose:fe,children:_jsxs(GestureHandlerRootView,{collapsable:!1,style:[W.backdrop,{backgroundColor:H.colors.background.overlay}],children:[_jsx(Pressable,{style:StyleSheet.absoluteFill,onPress:fe,accessibilityLabel:"Dismiss"}),_jsx(Animated.View,{style:[W.sheetWrap,{paddingBottom:Math.max(F.bottom,H.spacing.lg),opacity:U,transform:[{translateY:Animated.add(xe,Z)}]}],onLayout:e=>{ee.current=e.nativeEvent.layout.height},accessibilityViewIsModal:!0,accessibilityRole:"none",children:ve}),_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},headerRow:{flexDirection:"row",alignItems:"center",justifyContent:"space-between",marginBottom:e.spacing.md},navBtn:{width:e.components.dateRangePicker?.navButtonSize??36,height:e.components.dateRangePicker?.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.dateRangePicker?.navTextFontSize??22,lineHeight:e.components.dateRangePicker?.navTextLineHeight??24,color:e.colors.text.primary,fontWeight:e.typography.fontWeight.semibold},headerLabelWrap:{flex:1,alignItems:"center"},headerLabel:{fontSize:e.typography.fontSize.base,fontWeight:e.typography.fontWeight.semibold,color:e.colors.text.primary},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:0,position:"relative"},barLeft:{position:"absolute",left:0,right:"50%",top:"5%",bottom:"5%"},barRight:{position:"absolute",left:"50%",right:0,top:"5%",bottom:"5%"},dayInner:{width:"90%",height:"90%",alignItems:"center",justifyContent:"center"},dayText:{fontSize:e.typography.fontSize.sm,fontWeight:e.typography.fontWeight.medium},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;
+"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;

package/lib/module/components/Descriptions/Descriptions.js

@@ -1 +1 @@
-"use strict";import React,{useMemo}from"react";import{StyleSheet,Text,View}from"react-native";import{fontFor,useTheme}from"../../theme/index.js";import{resolveColor}from"../Text/Text.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const EMPTY_VALUE="-",rowKey=(e,t)=>e.key??("string"==typeof e.label?`${e.label}-${t}`:`row-${t}`),isEmptyValue=e=>null==e||""===e||Array.isArray(e)&&!e.length;export const Descriptions=({items:e,columns:t=1,size:l="md",bordered:r=!1,title:o,variant:s="list",style:i,testID:a})=>{const n=useTheme(),m=useMemo(()=>buildStyles(n),[n]),d="sm"===l?n.typography.fontSize.xs:n.typography.fontSize.sm,y="sm"===l?n.typography.fontSize.sm:n.typography.fontSize.base,c="sm"===l?n.spacing.xs:n.spacing.sm,u="summary"===s;return _jsxs(View,{style:[u?null:{gap:c},i],testID:a,children:[o?_jsx(Text,{style:[m.title,{fontSize:n.typography.fontSize.lg,color:n.colors.text.primary}],children:o}):null,e.map((e,l)=>{const o=isEmptyValue(e.value),s=2===t&&!e.full,i=o?n.colors.text.tertiary:resolveColor(n,e.tone??"primary"),a=fontFor(n,e.strong?"semibold":"normal");return _jsxs(View,u?{style:[m.summaryRow,{paddingVertical:c,borderBottomColor:n.colors.border.secondary}],children:[_jsx(Text,{style:[m.summaryLabel,{fontSize:y,color:n.colors.text.secondary}],children:e.label}),"string"==typeof e.value||o?_jsx(Text,{style:[m.summaryValue,{fontSize:y,color:i},a],children:o?"-":e.value}):_jsx(View,{children:e.value})]}:{style:[s?m.rowSide:m.rowStack,{paddingVertical:c},r&&l>0?m.bordered:null,r&&l>0?{borderTopColor:n.colors.border.secondary}:null],children:["string"==typeof e.label?_jsx(Text,{style:[m.label,{fontSize:d,color:n.colors.text.tertiary},s?m.labelSide:null],children:e.label}):_jsx(View,{style:s?m.labelSide:null,children:e.label}),"string"==typeof e.value||o?_jsx(Text,{style:[m.value,{fontSize:y,color:i},e.strong?a:null,s?m.valueSide:null],children:o?"-":e.value}):_jsx(View,{style:s?m.valueSide:null,children:e.value})]},rowKey(e,l))})]})};const buildStyles=e=>StyleSheet.create({title:{...fontFor(e,"semibold")},rowStack:{gap:2},rowSide:{flexDirection:"row",alignItems:"flex-start",gap:e.spacing.md},bordered:{borderTopWidth:StyleSheet.hairlineWidth},label:{...fontFor(e,"semibold")},labelSide:{flex:4},value:{...fontFor(e,"normal")},valueSide:{flex:6},summaryRow:{flexDirection:"row",alignItems:"center",gap:e.spacing.md,borderBottomWidth:StyleSheet.hairlineWidth},summaryLabel:{flex:1,...fontFor(e,"normal")},summaryValue:{textAlign:"right"}});export default Descriptions;
+"use strict";import{useMemo}from"react";import{StyleSheet,Text,View}from"react-native";import{fontFor,useTheme}from"../../theme/index.js";import{resolveColor}from"../Text/Text.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const EMPTY_VALUE="-",rowKey=(e,t)=>e.key??("string"==typeof e.label?`${e.label}-${t}`:`row-${t}`),isEmptyValue=e=>null==e||""===e||Array.isArray(e)&&!e.length;export const Descriptions=({items:e,columns:t=1,size:l="md",bordered:r=!1,title:o,variant:s="list",style:i,testID:a})=>{const n=useTheme(),m=useMemo(()=>buildStyles(n),[n]),d="sm"===l?n.typography.fontSize.xs:n.typography.fontSize.sm,y="sm"===l?n.typography.fontSize.sm:n.typography.fontSize.base,c="sm"===l?n.spacing.xs:n.spacing.sm,u="summary"===s;return _jsxs(View,{style:[u?null:{gap:c},i],testID:a,children:[o?_jsx(Text,{style:[m.title,{fontSize:n.typography.fontSize.lg,color:n.colors.text.primary}],children:o}):null,e.map((e,l)=>{const o=isEmptyValue(e.value),s=2===t&&!e.full,i=o?n.colors.text.tertiary:resolveColor(n,e.tone??"primary"),a=fontFor(n,e.strong?"semibold":"normal");return _jsxs(View,u?{style:[m.summaryRow,{paddingVertical:c,borderBottomColor:n.colors.border.secondary}],children:[_jsx(Text,{style:[m.summaryLabel,{fontSize:y,color:n.colors.text.secondary}],children:e.label}),"string"==typeof e.value||o?_jsx(Text,{style:[m.summaryValue,{fontSize:y,color:i},a],children:o?"-":e.value}):_jsx(View,{children:e.value})]}:{style:[s?m.rowSide:m.rowStack,{paddingVertical:c},r&&l>0?m.bordered:null,r&&l>0?{borderTopColor:n.colors.border.secondary}:null],children:["string"==typeof e.label?_jsx(Text,{style:[m.label,{fontSize:d,color:n.colors.text.tertiary},s?m.labelSide:null],children:e.label}):_jsx(View,{style:s?m.labelSide:null,children:e.label}),"string"==typeof e.value||o?_jsx(Text,{style:[m.value,{fontSize:y,color:i},e.strong?a:null,s?m.valueSide:null],children:o?"-":e.value}):_jsx(View,{style:s?m.valueSide:null,children:e.value})]},rowKey(e,l))})]})};const buildStyles=e=>StyleSheet.create({title:{...fontFor(e,"semibold")},rowStack:{gap:2},rowSide:{flexDirection:"row",alignItems:"flex-start",gap:e.spacing.md},bordered:{borderTopWidth:StyleSheet.hairlineWidth},label:{...fontFor(e,"semibold")},labelSide:{flex:4},value:{...fontFor(e,"normal")},valueSide:{flex:6},summaryRow:{flexDirection:"row",alignItems:"center",gap:e.spacing.md,borderBottomWidth:StyleSheet.hairlineWidth},summaryLabel:{flex:1,...fontFor(e,"normal")},summaryValue:{textAlign:"right"}});export default Descriptions;

package/lib/module/components/Dialog/Dialog.js

@@ -1 +1 @@
-"use strict";import React,{useCallback,useMemo}from"react";import{ActivityIndicator,Pressable,StyleSheet,Text,View}from"react-native";import{fontFor,useTheme}from"../../theme/index.js";import{smoothCorners}from"../../utils/corners.js";import{resolveHaptic,triggerHaptic}from"../../utils/hapticUtils.js";import{MODAL_DISMISS_GRACE_MS,Modal}from"../Modal/Modal.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const Dialog=e=>{const{visible:o,onClose:t,title:r,message:n,children:i,icon:s,variant:l="default",actions:a,dismissOnAction:c=!0,accessibilityLabel:d,contentStyle:u,containerStyle:m,titleStyle:g,messageStyle:b,iconWrapperStyle:p,actionsRowStyle:y,actionButtonStyle:h,actionTextStyle:x,haptic:S,testID:f}=e,C=useTheme(),j=useMemo(()=>buildStyles(C),[C]),_=useMemo(()=>tintForVariant(C,l),[C,l]),M=C.components.dialog,w=M?.iconWrapperSize??48,R=M?.iconWrapperBorderRadius??24,I=M?.actionButtonMinHeight??44,B=Boolean(a&&a.length>0),D=useCallback(e=>{if(e.loading||e.disabled)return;const o=resolveHaptic(S,"selection");o&&triggerHaptic(o),c?(t(),setTimeout(e.onPress,MODAL_DISMISS_GRACE_MS)):e.onPress()},[c,t,S]);return _jsx(Modal,{visible:o,onRequestClose:t,haptic:S,presentation:"centered",accessibilityLabel:d??r,contentStyle:u,testID:f,children:_jsxs(View,{accessibilityRole:"alert",accessibilityLabel:d??r,style:[j.container,m],children:[s?_jsx(View,{style:[j.iconWrapper,{width:w,height:w,borderRadius:R,...smoothCorners,backgroundColor:_.muted,marginBottom:C.spacing.md},p],children:s}):null,r?_jsx(Text,{style:[j.title,{color:C.colors.text.primary,fontSize:C.typography.fontSize.xl,...fontFor(C,"semibold"),marginBottom:n||null!=i?C.spacing.sm:C.spacing.md},g],accessibilityRole:"header",children:r}):null,n?_jsx(Text,{style:[j.message,{color:C.colors.text.secondary,fontSize:C.typography.fontSize.base,lineHeight:C.typography.fontSize.base*C.typography.lineHeight.normal,marginBottom:null!=i?C.spacing.md:B?C.spacing.lg:0},b],children:n}):null,null!=i?_jsx(View,{style:{marginBottom:B?C.spacing.lg:0},children:i}):null,a&&a.length>0?_jsx(View,{style:[j.actionsRow,y],children:a.map((e,o)=>{const t=e.tone??"primary",r=Boolean(e.disabled),n=actionStyleFor(C,t,l,r),i=o===a.length-1;return _jsx(Pressable,{onPress:()=>D(e),disabled:e.loading||r,accessibilityRole:"button",accessibilityLabel:e.label,accessibilityState:{busy:e.loading,disabled:Boolean(e.loading)||r},style:({pressed:o})=>[j.actionButton,{minHeight:I,backgroundColor:n.backgroundColor,borderColor:n.borderColor,borderWidth:n.borderWidth,borderRadius:C.radius.md,...smoothCorners,paddingVertical:C.spacing.md-2,paddingHorizontal:C.spacing.lg,marginRight:i?0:C.spacing.sm,opacity:e.loading?.7:o&&!r?.85:1},h],children:e.loading?_jsx(ActivityIndicator,{size:"small",color:n.textColor}):_jsx(Text,{style:[{color:n.textColor,fontSize:C.typography.fontSize.base,...fontFor(C,"semibold"),textAlign:"center"},x],numberOfLines:1,children:e.label})},`${e.label}-${o}`)})}):null]})})};Dialog.displayName="Dialog";const tintForVariant=(e,o)=>{const t=e.colors.background.secondary;switch(o){case"success":return{base:e.colors.success,on:e.colors.onSuccess,muted:t};case"warning":return{base:e.colors.warning,on:e.colors.onWarning,muted:t};case"error":return{base:e.colors.error,on:e.colors.onError,muted:t};case"info":return{base:e.colors.info,on:e.colors.onInfo,muted:t};default:return{base:e.colors.primary,on:e.colors.onPrimary,muted:e.colors.primaryMuted}}},actionStyleFor=(e,o,t,r)=>{if(r)return{backgroundColor:"neutral"===o?"transparent":e.colors.surface.disabled,borderColor:"neutral"===o?e.colors.border.primary:"transparent",borderWidth:"neutral"===o?1:0,textColor:e.colors.text.disabled};switch(o){case"primary":{const o=tintForVariant(e,t);return{backgroundColor:o.base,borderColor:"transparent",borderWidth:0,textColor:o.on}}case"error":return{backgroundColor:e.colors.error,borderColor:"transparent",borderWidth:0,textColor:e.colors.onError};default:return{backgroundColor:"transparent",borderColor:e.colors.border.primary,borderWidth:1,textColor:e.colors.text.primary}}},buildStyles=e=>StyleSheet.create({container:{alignItems:"stretch"},iconWrapper:{alignItems:"center",justifyContent:"center",alignSelf:"center"},title:{textAlign:"center"},message:{textAlign:"center"},actionsRow:{flexDirection:"row",justifyContent:"flex-end",alignItems:"center"},actionButton:{flex:1,alignItems:"center",justifyContent:"center"}});export{Dialog};export default Dialog;
+"use strict";import{useCallback,useMemo}from"react";import{ActivityIndicator,Pressable,StyleSheet,Text,View}from"react-native";import{fontFor,useTheme}from"../../theme/index.js";import{smoothCorners}from"../../utils/corners.js";import{resolveHaptic,triggerHaptic}from"../../utils/hapticUtils.js";import{MODAL_DISMISS_GRACE_MS,Modal}from"../Modal/Modal.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const Dialog=e=>{const{visible:o,onClose:t,title:r,message:i,children:n,icon:s,variant:l="default",actions:a,dismissOnAction:c=!0,accessibilityLabel:d,contentStyle:u,containerStyle:g,titleStyle:m,messageStyle:b,iconWrapperStyle:p,actionsRowStyle:y,actionButtonStyle:h,actionTextStyle:x,haptic:S,testID:f}=e,C=useTheme(),j=useMemo(()=>buildStyles(C),[C]),_=useMemo(()=>tintForVariant(C,l),[C,l]),M=C.components.dialog,w=M?.iconWrapperSize??48,B=M?.iconWrapperBorderRadius??24,I=M?.actionButtonMinHeight??44,R=Boolean(a&&a.length>0),D=useCallback(e=>{if(e.loading||e.disabled)return;const o=resolveHaptic(S,"selection");o&&triggerHaptic(o),c?(t(),setTimeout(e.onPress,MODAL_DISMISS_GRACE_MS)):e.onPress()},[c,t,S]);return _jsx(Modal,{visible:o,onRequestClose:t,haptic:S,presentation:"centered",accessibilityLabel:d??r,contentStyle:u,testID:f,children:_jsxs(View,{accessibilityRole:"alert",accessibilityLabel:d??r,style:[j.container,g],children:[s?_jsx(View,{style:[j.iconWrapper,{width:w,height:w,borderRadius:B,...smoothCorners,backgroundColor:_.muted,marginBottom:C.spacing.md},p],children:s}):null,r?_jsx(Text,{style:[j.title,{color:C.colors.text.primary,fontSize:C.typography.fontSize.xl,...fontFor(C,"semibold"),marginBottom:i||null!=n?C.spacing.sm:C.spacing.md},m],accessibilityRole:"header",children:r}):null,i?_jsx(Text,{style:[j.message,{color:C.colors.text.secondary,fontSize:C.typography.fontSize.base,lineHeight:C.typography.fontSize.base*C.typography.lineHeight.normal,marginBottom:null!=n?C.spacing.md:R?C.spacing.lg:0},b],children:i}):null,null!=n?_jsx(View,{style:{marginBottom:R?C.spacing.lg:0},children:n}):null,a&&a.length>0?_jsx(View,{style:[j.actionsRow,y],children:a.map((e,o)=>{const t=e.tone??"primary",r=Boolean(e.disabled),i=actionStyleFor(C,t,l,r),n=o===a.length-1;return _jsx(Pressable,{onPress:()=>D(e),disabled:e.loading||r,accessibilityRole:"button",accessibilityLabel:e.label,accessibilityState:{busy:e.loading,disabled:Boolean(e.loading)||r},"aria-busy":e.loading,"aria-disabled":Boolean(e.loading)||r,style:({pressed:o})=>[j.actionButton,{minHeight:I,backgroundColor:i.backgroundColor,borderColor:i.borderColor,borderWidth:i.borderWidth,borderRadius:C.radius.md,...smoothCorners,paddingVertical:C.spacing.md-2,paddingHorizontal:C.spacing.lg,marginRight:n?0:C.spacing.sm,opacity:e.loading?.7:o&&!r?.85:1},h],children:e.loading?_jsx(ActivityIndicator,{size:"small",color:i.textColor}):_jsx(Text,{style:[{color:i.textColor,fontSize:C.typography.fontSize.base,...fontFor(C,"semibold"),textAlign:"center"},x],numberOfLines:1,children:e.label})},`${e.label}-${o}`)})}):null]})})};Dialog.displayName="Dialog";const tintForVariant=(e,o)=>{const t=e.colors.background.secondary;switch(o){case"success":return{base:e.colors.success,on:e.colors.onSuccess,muted:t};case"warning":return{base:e.colors.warning,on:e.colors.onWarning,muted:t};case"error":return{base:e.colors.error,on:e.colors.onError,muted:t};case"info":return{base:e.colors.info,on:e.colors.onInfo,muted:t};default:return{base:e.colors.primary,on:e.colors.onPrimary,muted:e.colors.primaryMuted}}},actionStyleFor=(e,o,t,r)=>{if(r)return{backgroundColor:"neutral"===o?"transparent":e.colors.surface.disabled,borderColor:"neutral"===o?e.colors.border.primary:"transparent",borderWidth:"neutral"===o?1:0,textColor:e.colors.text.disabled};switch(o){case"primary":{const o=tintForVariant(e,t);return{backgroundColor:o.base,borderColor:"transparent",borderWidth:0,textColor:o.on}}case"error":return{backgroundColor:e.colors.error,borderColor:"transparent",borderWidth:0,textColor:e.colors.onError};default:return{backgroundColor:"transparent",borderColor:e.colors.border.primary,borderWidth:1,textColor:e.colors.text.primary}}},buildStyles=e=>StyleSheet.create({container:{alignItems:"stretch"},iconWrapper:{alignItems:"center",justifyContent:"center",alignSelf:"center"},title:{textAlign:"center"},message:{textAlign:"center"},actionsRow:{flexDirection:"row",justifyContent:"flex-end",alignItems:"center"},actionButton:{flex:1,alignItems:"center",justifyContent:"center"}});export{Dialog};export default Dialog;

package/lib/module/components/Drawer/Drawer.js

@@ -1 +1 @@
-"use strict";import React,{forwardRef,useCallback,useEffect,useImperativeHandle,useMemo,useRef,useState}from"react";import{Dimensions,Pressable,StyleSheet,View}from"react-native";import{Gesture,GestureDetector}from"react-native-gesture-handler";import Animated,{Extrapolation,interpolate,runOnJS,useAnimatedStyle,useSharedValue,withSpring}from"react-native-reanimated";import{useSafeAreaInsets}from"react-native-safe-area-context";import{useTheme}from"../../theme/index.js";import{resolveHaptic,triggerHaptic}from"../../utils/index.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const DEFAULT_CLOSE_VELOCITY_THRESHOLD=1e3,DEFAULT_DRAG_ACTIVATION_OFFSET=10,Drawer=forwardRef((e,t)=>{const{visible:a,defaultVisible:r=!1,onChange:s,side:o="left",width:i,enableSwipe:l=!0,enableBackdropPress:n=!0,backdropOpacity:u=.5,haptic:c,containerStyle:d,children:p,accessibilityLabel:f,testID:h}=e,m=useTheme(),b=useSafeAreaInsets(),g="boolean"==typeof a,S=m.components.drawer,v=S?.closeVelocityThreshold??1e3,w=S?.dragActivationOffset??10,[y,x]=useState(()=>Dimensions.get("window"));useEffect(()=>{const e=Dimensions.addEventListener("change",({window:e})=>x(e));return()=>e.remove()},[]);const k="left"===o||"right"===o,D=useMemo(()=>resolveSize(i,k,y),[i,k,y]),C=useMemo(()=>{switch(o){case"left":case"top":return-D;case"right":case"bottom":return D}},[o,D]),E=useSharedValue(r?0:C),A=useSharedValue(r?0:C),[M,O]=useState(r),V=useSharedValue(r);useEffect(()=>{M||(E.value=C,A.value=C)},[C,M,E,A]);const _=m.motion.spring.snappy,j=useCallback(()=>{E.value=withSpring(0,_)},[E,_]),L=useCallback(()=>{E.value=withSpring(C,_)},[E,C,_]),T=useCallback(e=>{O(t=>t===e?t:(s?.(e),e)),V.value=e},[s,V]),R=useCallback(()=>{T(!0),j()},[T,j]),I=useCallback(()=>{T(!1),L()},[T,L]),F=useCallback(()=>{M?I():R()},[M,R,I]);useImperativeHandle(t,()=>({open:R,close:I,toggle:F}),[R,I,F]),useEffect(()=>{g&&a!==M&&(a?R():I())},[a]);const H=useMemo(()=>{const e=C,t=o,a=l;let r=Gesture.Pan();return r=k?r.activeOffsetX([-w,w]).failOffsetY([-15,15]):r.activeOffsetY([-w,w]).failOffsetX([-15,15]),r.onStart(()=>{"worklet";a&&(A.value=E.value)}).onUpdate(t=>{"worklet";if(!a)return;const r=k?t.translationX:t.translationY,s=A.value+r,o=Math.min(0,e),i=Math.max(0,e);E.value=s<o?o+.25*(s-o):s>i?i+.25*(s-i):s}).onEnd(r=>{"worklet";if(!a)return;const s=k?r.velocityX:r.velocityY,o=E.value;let i=!1;i="left"===t||"top"===t?s<-v:s>v;const l=Math.abs(e),n=Math.abs(o)/l;i||n>.5?(runOnJS(T)(!1),E.value=withSpring(e,_)):(runOnJS(T)(!0),E.value=withSpring(0,_))})},[C,A,l,k,E,T,o,_,v,w]),P=useAnimatedStyle(()=>k?{transform:[{translateX:E.value}]}:{transform:[{translateY:E.value}]}),Y=useAnimatedStyle(()=>({opacity:interpolate(E.value,[C,0],[0,u],Extrapolation.CLAMP),pointerEvents:Math.abs(E.value-C)<.5?"none":"auto"}),[C,u]),G=useMemo(()=>buildStyles(m),[m]),N=useCallback(()=>{if(!n)return;const e=resolveHaptic(c,"selection");e&&triggerHaptic(e),I()},[n,I,c]),X=useMemo(()=>{switch(o){case"left":return{position:"absolute",top:0,bottom:0,left:0,width:D,paddingTop:b.top,paddingBottom:b.bottom,paddingLeft:b.left};case"right":return{position:"absolute",top:0,bottom:0,right:0,width:D,paddingTop:b.top,paddingBottom:b.bottom,paddingRight:b.right};case"top":return{position:"absolute",top:0,left:0,right:0,height:D,paddingTop:b.top,paddingLeft:b.left,paddingRight:b.right};case"bottom":return{position:"absolute",bottom:0,left:0,right:0,height:D,paddingBottom:b.bottom,paddingLeft:b.left,paddingRight:b.right}}},[o,D,b]),B=useRef(r);return M&&(B.current=!0),B.current?_jsxs(View,{style:StyleSheet.absoluteFill,pointerEvents:"box-none",testID:h,accessibilityViewIsModal:M,children:[_jsx(Animated.View,{style:[G.backdrop,{backgroundColor:m.colors.background.overlay},Y],children:_jsx(Pressable,{style:StyleSheet.absoluteFill,onPress:N,accessibilityRole:"button",accessibilityLabel:"Close drawer",disabled:!n||!M})}),_jsx(GestureDetector,{gesture:H,children:_jsx(Animated.View,{accessibilityRole:"alert",accessibilityLabel:f??"Drawer",style:[X,{backgroundColor:m.colors.background.elevated,...m.shadows.xl},d,P],children:_jsx(View,{style:G.content,children:p})})})]}):null});Drawer.displayName="Drawer";const resolveSize=(e,t,a)=>{if("number"==typeof e)return e;if("string"==typeof e){const r=parseFloat(e);if(Number.isNaN(r))return t?280:Math.round(.4*a.height);return r/100*(t?a.width:a.height)}return t?280:Math.round(.4*a.height)},buildStyles=e=>StyleSheet.create({backdrop:{...StyleSheet.absoluteFill},content:{flex:1}});export{Drawer};export default Drawer;
+"use strict";import{forwardRef,useCallback,useEffect,useImperativeHandle,useMemo,useRef,useState}from"react";import{Dimensions,Pressable,StyleSheet,View}from"react-native";import{Gesture,GestureDetector}from"react-native-gesture-handler";import Animated,{Extrapolation,interpolate,runOnJS,useAnimatedStyle,useSharedValue,withSpring}from"react-native-reanimated";import{useSafeAreaInsets}from"react-native-safe-area-context";import{useTheme}from"../../theme/index.js";import{resolveHaptic,triggerHaptic}from"../../utils/index.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const DEFAULT_CLOSE_VELOCITY_THRESHOLD=1e3,DEFAULT_DRAG_ACTIVATION_OFFSET=10,Drawer=forwardRef((e,t)=>{const{visible:a,defaultVisible:r=!1,onChange:s,side:o="left",width:i,enableSwipe:l=!0,enableBackdropPress:n=!0,backdropOpacity:u=.5,haptic:c,containerStyle:d,children:p,accessibilityLabel:f,testID:h}=e,m=useTheme(),b=useSafeAreaInsets(),g="boolean"==typeof a,S=m.components.drawer,v=S?.closeVelocityThreshold??1e3,w=S?.dragActivationOffset??10,[y,x]=useState(()=>Dimensions.get("window"));useEffect(()=>{const e=Dimensions.addEventListener("change",({window:e})=>x(e));return()=>e.remove()},[]);const k="left"===o||"right"===o,D=useMemo(()=>resolveSize(i,k,y),[i,k,y]),C=useMemo(()=>{switch(o){case"left":case"top":return-D;case"right":case"bottom":return D}},[o,D]),E=useSharedValue(r?0:C),A=useSharedValue(r?0:C),[M,O]=useState(r),V=useSharedValue(r);useEffect(()=>{M||(E.value=C,A.value=C)},[C,M,E,A]);const _=m.motion.spring.snappy,j=useCallback(()=>{E.value=withSpring(0,_)},[E,_]),L=useCallback(()=>{E.value=withSpring(C,_)},[E,C,_]),T=useCallback(e=>{O(t=>t===e?t:(s?.(e),e)),V.value=e},[s,V]),R=useCallback(()=>{T(!0),j()},[T,j]),I=useCallback(()=>{T(!1),L()},[T,L]),F=useCallback(()=>{M?I():R()},[M,R,I]);useImperativeHandle(t,()=>({open:R,close:I,toggle:F}),[R,I,F]),useEffect(()=>{g&&a!==M&&(a?R():I())},[a]);const H=useMemo(()=>{const e=C,t=o,a=l;let r=Gesture.Pan();return r=k?r.activeOffsetX([-w,w]).failOffsetY([-15,15]):r.activeOffsetY([-w,w]).failOffsetX([-15,15]),r.onStart(()=>{"worklet";a&&(A.value=E.value)}).onUpdate(t=>{"worklet";if(!a)return;const r=k?t.translationX:t.translationY,s=A.value+r,o=Math.min(0,e),i=Math.max(0,e);E.value=s<o?o+.25*(s-o):s>i?i+.25*(s-i):s}).onEnd(r=>{"worklet";if(!a)return;const s=k?r.velocityX:r.velocityY,o=E.value;let i=!1;i="left"===t||"top"===t?s<-v:s>v;const l=Math.abs(e),n=Math.abs(o)/l;i||n>.5?(runOnJS(T)(!1),E.value=withSpring(e,_)):(runOnJS(T)(!0),E.value=withSpring(0,_))})},[C,A,l,k,E,T,o,_,v,w]),P=useAnimatedStyle(()=>k?{transform:[{translateX:E.value}]}:{transform:[{translateY:E.value}]}),Y=useAnimatedStyle(()=>({opacity:interpolate(E.value,[C,0],[0,u],Extrapolation.CLAMP),pointerEvents:Math.abs(E.value-C)<.5?"none":"auto"}),[C,u]),G=useMemo(()=>buildStyles(m),[m]),N=useCallback(()=>{if(!n)return;const e=resolveHaptic(c,"selection");e&&triggerHaptic(e),I()},[n,I,c]),X=useMemo(()=>{switch(o){case"left":return{position:"absolute",top:0,bottom:0,left:0,width:D,paddingTop:b.top,paddingBottom:b.bottom,paddingLeft:b.left};case"right":return{position:"absolute",top:0,bottom:0,right:0,width:D,paddingTop:b.top,paddingBottom:b.bottom,paddingRight:b.right};case"top":return{position:"absolute",top:0,left:0,right:0,height:D,paddingTop:b.top,paddingLeft:b.left,paddingRight:b.right};case"bottom":return{position:"absolute",bottom:0,left:0,right:0,height:D,paddingBottom:b.bottom,paddingLeft:b.left,paddingRight:b.right}}},[o,D,b]),B=useRef(r);return M&&(B.current=!0),B.current?_jsxs(View,{style:StyleSheet.absoluteFill,pointerEvents:"box-none",testID:h,accessibilityViewIsModal:M,children:[_jsx(Animated.View,{style:[G.backdrop,{backgroundColor:m.colors.background.overlay},Y],children:_jsx(Pressable,{style:StyleSheet.absoluteFill,onPress:N,accessibilityRole:"button",accessibilityLabel:"Close drawer",disabled:!n||!M})}),_jsx(GestureDetector,{gesture:H,children:_jsx(Animated.View,{accessibilityRole:"alert",accessibilityLabel:f??"Drawer",style:[X,{backgroundColor:m.colors.background.elevated,...m.shadows.xl},d,P],children:_jsx(View,{style:G.content,children:p})})})]}):null});Drawer.displayName="Drawer";const resolveSize=(e,t,a)=>{if("number"==typeof e)return e;if("string"==typeof e){const r=parseFloat(e);if(Number.isNaN(r))return t?280:Math.round(.4*a.height);return r/100*(t?a.width:a.height)}return t?280:Math.round(.4*a.height)},buildStyles=e=>StyleSheet.create({backdrop:{...StyleSheet.absoluteFill},content:{flex:1}});export{Drawer};export default Drawer;

package/lib/module/components/EmptyState/EmptyState.js

@@ -1 +1 @@
-"use strict";import React,{forwardRef,useMemo}from"react";import{Animated,Pressable,StyleSheet,Text,View}from"react-native";import{usePressAnimation}from"../../hooks/usePressAnimation.js";import{fontFor,useTheme}from"../../theme/index.js";import{smoothCorners}from"../../utils/corners.js";import{triggerHaptic}from"../../utils/hapticUtils.js";import{SquircleFill,useSquircle}from"../SquircleFill/SquircleFill.js";import{jsx as _jsx,Fragment as _Fragment,jsxs as _jsxs}from"react/jsx-runtime";const SIZE_FALLBACK={sm:{iconSize:48,titleFontSize:"lg",descriptionFontSize:"sm",paddingVertical:"lg"},md:{iconSize:64,titleFontSize:"xl",descriptionFontSize:"base",paddingVertical:"xl"},lg:{iconSize:80,titleFontSize:"2xl",descriptionFontSize:"base",paddingVertical:"2xl"}},sizeFor=(e,t)=>{const i={...SIZE_FALLBACK[t],...e.components.emptyState?.[t]??{}};return{iconSize:i.iconSize,titleSize:e.typography.fontSize[i.titleFontSize],descriptionSize:e.typography.fontSize[i.descriptionFontSize],paddingVertical:e.spacing[i.paddingVertical]}},ActionButton=({action:e,variant:t})=>{const i=useTheme(),{scale:r,pressIn:o,pressOut:s}=usePressAnimation({enabled:!0}),n=useMemo(()=>buildActionStyles(i),[i]),l="primary"===t,a=useSquircle(!0,i.radius.md),fillFor=e=>l?i.colors.primary:e?i.colors.surface.pressed:"transparent";return _jsx(Animated.View,{style:{transform:[{scale:r}]},children:_jsx(Pressable,{onPress:()=>{triggerHaptic("selection"),e.onPress()},onPressIn:o,onPressOut:s,accessibilityRole:"button",accessibilityLabel:e.accessibilityLabel??e.label,accessibilityHint:e.accessibilityHint,testID:e.testID,onLayout:a.onLayout,android_ripple:{color:l?i.colors.primaryHover:i.colors.surface.pressed,borderless:!1},style:({pressed:e})=>[n.button,l?n.buttonPrimary:n.buttonSecondary,!e||l||a.active?null:n.buttonSecondaryPressed,a.active?n.buttonSquircleHost:null],children:({pressed:t})=>_jsxs(_Fragment,{children:[a.active&&a.size?_jsx(SquircleFill,{width:a.size.width,height:a.size.height,radius:i.radius.md,fill:fillFor(t),stroke:l?void 0:i.colors.border.primary,strokeWidth:l?0:1,outset:l?0:1}):null,_jsx(Text,{style:[n.buttonText,l?n.buttonTextPrimary:n.buttonTextSecondary],numberOfLines:1,children:e.label})]})})})},EmptyState=forwardRef((e,t)=>{const{icon:i,title:r,description:o,action:s,secondaryAction:n,size:l="md",fill:a=!1,style:c,testID:d}=e,u=useTheme(),m=useMemo(()=>sizeFor(u,l),[u,l]),p=useMemo(()=>buildStyles(u),[u]);return _jsxs(View,{ref:t,accessibilityRole:"summary",testID:d,style:[p.root,{paddingVertical:m.paddingVertical},a?p.fill:null,c],children:[i?_jsx(View,{style:[p.iconCircle,{width:m.iconSize,height:m.iconSize,borderRadius:m.iconSize/2,...smoothCorners}],children:i}):null,_jsx(Text,{style:[p.title,{fontSize:m.titleSize,...fontFor(u,"semibold")}],children:r}),o?_jsx(Text,{style:[p.description,{fontSize:m.descriptionSize}],children:o}):null,s||n?_jsxs(View,{style:p.actions,children:[s?_jsx(ActionButton,{action:s,variant:"primary"}):null,n?_jsx(ActionButton,{action:n,variant:"secondary"}):null]}):null]})});EmptyState.displayName="EmptyState";const buildStyles=e=>StyleSheet.create({root:{alignItems:"center",justifyContent:"center",paddingHorizontal:e.spacing.lg,gap:e.spacing.md},fill:{flexGrow:1},iconCircle:{backgroundColor:e.colors.surface.disabled,alignItems:"center",justifyContent:"center"},title:{color:e.colors.text.primary,textAlign:"center"},description:{color:e.colors.text.secondary,textAlign:"center",maxWidth:320,lineHeight:e.typography.fontSize.base*e.typography.lineHeight.normal},actions:{flexDirection:"row",alignItems:"center",gap:e.spacing.sm,marginTop:e.spacing.xs}}),buildActionStyles=e=>StyleSheet.create({button:{paddingHorizontal:e.spacing.lg,paddingVertical:e.spacing.sm,minHeight:42,borderRadius:e.radius.md,...smoothCorners,alignItems:"center",justifyContent:"center",flexDirection:"row"},buttonPrimary:{backgroundColor:e.colors.primary},buttonSecondary:{backgroundColor:"transparent",borderWidth:1,borderColor:e.colors.border.primary},buttonSecondaryPressed:{backgroundColor:e.colors.surface.pressed},buttonSquircleHost:{backgroundColor:"transparent",borderColor:"transparent",overflow:"visible"},buttonText:{fontSize:e.typography.fontSize.base,...fontFor(e,"semibold")},buttonTextPrimary:{color:e.colors.onPrimary},buttonTextSecondary:{color:e.colors.text.primary}});export{EmptyState};export default EmptyState;
+"use strict";import{forwardRef,useMemo}from"react";import{Animated,Pressable,StyleSheet,Text,View}from"react-native";import{usePressAnimation}from"../../hooks/usePressAnimation.js";import{fontFor,useTheme}from"../../theme/index.js";import{smoothCorners}from"../../utils/corners.js";import{triggerHaptic}from"../../utils/hapticUtils.js";import{SquircleFill,useSquircle}from"../SquircleFill/SquircleFill.js";import{jsx as _jsx,Fragment as _Fragment,jsxs as _jsxs}from"react/jsx-runtime";const SIZE_FALLBACK={sm:{iconSize:48,titleFontSize:"lg",descriptionFontSize:"sm",paddingVertical:"lg"},md:{iconSize:64,titleFontSize:"xl",descriptionFontSize:"base",paddingVertical:"xl"},lg:{iconSize:80,titleFontSize:"2xl",descriptionFontSize:"base",paddingVertical:"2xl"}},sizeFor=(e,t)=>{const i={...SIZE_FALLBACK[t],...e.components.emptyState?.[t]??{}};return{iconSize:i.iconSize,titleSize:e.typography.fontSize[i.titleFontSize],descriptionSize:e.typography.fontSize[i.descriptionFontSize],paddingVertical:e.spacing[i.paddingVertical]}},ActionButton=({action:e,variant:t})=>{const i=useTheme(),{scale:r,pressIn:o,pressOut:s}=usePressAnimation({enabled:!0}),n=useMemo(()=>buildActionStyles(i),[i]),l="primary"===t,a=useSquircle(!0,i.radius.md),fillFor=e=>l?i.colors.primary:e?i.colors.surface.pressed:"transparent";return _jsx(Animated.View,{style:{transform:[{scale:r}]},children:_jsx(Pressable,{onPress:()=>{triggerHaptic("selection"),e.onPress()},onPressIn:o,onPressOut:s,accessibilityRole:"button",accessibilityLabel:e.accessibilityLabel??e.label,accessibilityHint:e.accessibilityHint,testID:e.testID,onLayout:a.onLayout,android_ripple:{color:l?i.colors.primaryHover:i.colors.surface.pressed,borderless:!1},style:({pressed:e})=>[n.button,l?n.buttonPrimary:n.buttonSecondary,!e||l||a.active?null:n.buttonSecondaryPressed,a.active?n.buttonSquircleHost:null],children:({pressed:t})=>_jsxs(_Fragment,{children:[a.active&&a.size?_jsx(SquircleFill,{width:a.size.width,height:a.size.height,radius:i.radius.md,fill:fillFor(t),stroke:l?void 0:i.colors.border.primary,strokeWidth:l?0:1,outset:l?0:1}):null,_jsx(Text,{style:[n.buttonText,l?n.buttonTextPrimary:n.buttonTextSecondary],numberOfLines:1,children:e.label})]})})})},EmptyState=forwardRef((e,t)=>{const{icon:i,title:r,description:o,action:s,secondaryAction:n,size:l="md",fill:a=!1,style:c,testID:d}=e,u=useTheme(),m=useMemo(()=>sizeFor(u,l),[u,l]),p=useMemo(()=>buildStyles(u),[u]);return _jsxs(View,{ref:t,accessibilityRole:"summary",testID:d,style:[p.root,{paddingVertical:m.paddingVertical},a?p.fill:null,c],children:[i?_jsx(View,{style:[p.iconCircle,{width:m.iconSize,height:m.iconSize,borderRadius:m.iconSize/2,...smoothCorners}],children:i}):null,_jsx(Text,{style:[p.title,{fontSize:m.titleSize,...fontFor(u,"semibold")}],children:r}),o?_jsx(Text,{style:[p.description,{fontSize:m.descriptionSize}],children:o}):null,s||n?_jsxs(View,{style:p.actions,children:[s?_jsx(ActionButton,{action:s,variant:"primary"}):null,n?_jsx(ActionButton,{action:n,variant:"secondary"}):null]}):null]})});EmptyState.displayName="EmptyState";const buildStyles=e=>StyleSheet.create({root:{alignItems:"center",justifyContent:"center",paddingHorizontal:e.spacing.lg,gap:e.spacing.md},fill:{flexGrow:1},iconCircle:{backgroundColor:e.colors.surface.disabled,alignItems:"center",justifyContent:"center"},title:{color:e.colors.text.primary,textAlign:"center"},description:{color:e.colors.text.secondary,textAlign:"center",maxWidth:320,lineHeight:e.typography.fontSize.base*e.typography.lineHeight.normal},actions:{flexDirection:"row",alignItems:"center",gap:e.spacing.sm,marginTop:e.spacing.xs}}),buildActionStyles=e=>StyleSheet.create({button:{paddingHorizontal:e.spacing.lg,paddingVertical:e.spacing.sm,minHeight:42,borderRadius:e.radius.md,...smoothCorners,alignItems:"center",justifyContent:"center",flexDirection:"row"},buttonPrimary:{backgroundColor:e.colors.primary},buttonSecondary:{backgroundColor:"transparent",borderWidth:1,borderColor:e.colors.border.primary},buttonSecondaryPressed:{backgroundColor:e.colors.surface.pressed},buttonSquircleHost:{backgroundColor:"transparent",borderColor:"transparent",overflow:"visible"},buttonText:{fontSize:e.typography.fontSize.base,...fontFor(e,"semibold")},buttonTextPrimary:{color:e.colors.onPrimary},buttonTextSecondary:{color:e.colors.text.primary}});export{EmptyState};export default EmptyState;

package/lib/module/components/ErrorBoundary/ErrorBoundary.js

@@ -1 +1 @@
-"use strict";import{Logger}from"@webority/mobile-core";import React,{useMemo}from"react";import{StyleSheet,Text,View}from"react-native";import{useTheme}from"../../theme/index.js";import{EmptyState}from"../EmptyState/index.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const COMPONENT_STACK_LIMIT=500,DEFAULT_TITLE="Something went wrong",DEFAULT_MESSAGE="An unexpected error occurred. Please try again.",hasResetKeysChanged=(e,t)=>e!==t&&(!e||!t||e.length!==t.length||e.some((e,r)=>e!==t[r])),DefaultFallback=({error:e,reset:t,title:r,message:o,testID:s})=>{const n=useTheme(),i=useMemo(()=>buildStyles(n),[n]),a="undefined"!=typeof __DEV__&&__DEV__;return _jsxs(View,{style:i.root,testID:s,children:[_jsx(EmptyState,{title:r??DEFAULT_TITLE,description:o??DEFAULT_MESSAGE,action:{label:"Try again",onPress:t,testID:s?`${s}-retry`:void 0}}),a?_jsx(Text,{style:i.devError,testID:s?`${s}-dev-error`:void 0,children:e.message}):null]})},buildStyles=e=>StyleSheet.create({root:{flex:1,alignItems:"center",justifyContent:"center",backgroundColor:e.colors.background.primary,padding:e.spacing.lg},devError:{marginTop:e.spacing.md,color:e.colors.error,fontSize:e.typography.fontSize.sm,textAlign:"center"}});export class ErrorBoundary extends React.Component{state={error:null};static getDerivedStateFromError(e){return{error:e}}componentDidUpdate(e){this.state.error&&hasResetKeysChanged(e.resetKeys,this.props.resetKeys)&&this.reset()}componentDidCatch(e,t){const r=(t.componentStack??"").slice(0,500);Logger.recordError(e,{errorType:"RenderError",componentStack:r});try{this.props.onError?.(e,{componentStack:r})}catch(e){Logger.error("[@webority/mobile-ui] ErrorBoundary onError threw; the boundary itself is unaffected.",e)}}reset=()=>{this.setState({error:null}),this.props.onReset?.()};render(){const{error:e}=this.state;if(!e)return this.props.children;const{fallback:t,title:r,message:o,testID:s}=this.props;return void 0!==t?"function"==typeof t?t(e,this.reset):t:_jsx(DefaultFallback,{error:e,reset:this.reset,title:r,message:o,testID:s})}}
+"use strict";import{Logger}from"@webority/mobile-core";import React,{useMemo}from"react";import{StyleSheet,Text,View}from"react-native";import{useTheme}from"../../theme/index.js";import{EmptyState}from"../EmptyState/index.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const COMPONENT_STACK_LIMIT=500,DEFAULT_TITLE="Something went wrong",DEFAULT_MESSAGE="An unexpected error occurred. Please try again.",hasResetKeysChanged=(e,t)=>e!==t&&(!e||!t||e.length!==t.length||e.some((e,r)=>e!==t[r])),DefaultFallback=({error:e,reset:t,title:r,message:o,testID:s})=>{const n=useTheme(),i=useMemo(()=>buildStyles(n),[n]),a="undefined"!=typeof __DEV__&&__DEV__;return _jsxs(View,{style:i.root,testID:s,children:[_jsx(EmptyState,{title:r??DEFAULT_TITLE,description:o??DEFAULT_MESSAGE,action:{label:"Try again",onPress:t,testID:s?`${s}-retry`:void 0}}),a?_jsx(Text,{style:i.devError,testID:s?`${s}-dev-error`:void 0,children:e.message}):null]})},buildStyles=e=>StyleSheet.create({root:{flex:1,alignItems:"center",justifyContent:"center",backgroundColor:e.colors.background.primary,padding:e.spacing.lg},devError:{marginTop:e.spacing.md,color:e.colors.toneText.error,fontSize:e.typography.fontSize.sm,textAlign:"center"}});export class ErrorBoundary extends React.Component{state={error:null};static getDerivedStateFromError(e){return{error:e}}componentDidUpdate(e){this.state.error&&hasResetKeysChanged(e.resetKeys,this.props.resetKeys)&&this.reset()}componentDidCatch(e,t){const r=(t.componentStack??"").slice(0,500);Logger.recordError(e,{errorType:"RenderError",componentStack:r});try{this.props.onError?.(e,{componentStack:r})}catch(e){Logger.error("[@webority/mobile-ui] ErrorBoundary onError threw; the boundary itself is unaffected.",e)}}reset=()=>{this.setState({error:null}),this.props.onReset?.()};render(){const{error:e}=this.state;if(!e)return this.props.children;const{fallback:t,title:r,message:o,testID:s}=this.props;return void 0!==t?"function"==typeof t?t(e,this.reset):t:_jsx(DefaultFallback,{error:e,reset:this.reset,title:r,message:o,testID:s})}}

package/lib/module/components/ErrorBoundary/withErrorBoundary.js

@@ -1 +1 @@
-"use strict";import React from"react";import{ErrorBoundary}from"./ErrorBoundary.js";import{jsx as _jsx}from"react/jsx-runtime";export const withErrorBoundary=(r,o)=>{const t=r.displayName??r.name??"Component",Wrapped=t=>_jsx(ErrorBoundary,{...o,children:_jsx(r,{...t})});return Wrapped.displayName=`withErrorBoundary(${t})`,Wrapped};
+"use strict";import{ErrorBoundary}from"./ErrorBoundary.js";import{jsx as _jsx}from"react/jsx-runtime";export const withErrorBoundary=(r,o)=>{const n=r.displayName??r.name??"Component",Wrapped=n=>_jsx(ErrorBoundary,{...o,children:_jsx(r,{...n})});return Wrapped.displayName=`withErrorBoundary(${n})`,Wrapped};

package/lib/module/components/FieldBase/Chevron.js

@@ -1 +1 @@
-"use strict";import React,{useEffect,useRef}from"react";import{Animated,View}from"react-native";import{createAnimatedValue,useTheme}from"../../theme/index.js";import{defaultIcons}from"../AppIcon/defaultIcons.js";import{jsx as _jsx}from"react/jsx-runtime";export const Chevron=({color:e,size:t,open:o,style:r})=>{const n=useTheme(),i=useRef(createAnimatedValue(o?1:0)).current;useEffect(()=>{if(void 0===o)return;const e=Animated.timing(i,{toValue:o?1:0,duration:n.motion.duration.fast,useNativeDriver:!0});return e.start(),()=>e.stop()},[o,i,n.motion.duration.fast]);const s=(n.icons?.chevronDown??defaultIcons.chevronDown)({size:t,color:e}),a={width:t,height:t,alignItems:"center",justifyContent:"center"};if(void 0===o)return _jsx(View,{style:[a,r],children:s});const c=i.interpolate({inputRange:[0,1],outputRange:["0deg","180deg"]});return _jsx(Animated.View,{style:[a,{transform:[{rotate:c}]},r],children:s})};export default Chevron;
+"use strict";import{useEffect,useRef}from"react";import{Animated,View}from"react-native";import{createAnimatedValue,useTheme}from"../../theme/index.js";import{defaultIcons}from"../AppIcon/defaultIcons.js";import{jsx as _jsx}from"react/jsx-runtime";export const Chevron=({color:e,size:t,open:o,style:r})=>{const n=useTheme(),i=useRef(createAnimatedValue(o?1:0)).current;useEffect(()=>{if(void 0===o)return;const e=Animated.timing(i,{toValue:o?1:0,duration:n.motion.duration.fast,useNativeDriver:!0});return e.start(),()=>e.stop()},[o,i,n.motion.duration.fast]);const s=(n.icons?.chevronDown??defaultIcons.chevronDown)({size:t,color:e}),a={width:t,height:t,alignItems:"center",justifyContent:"center"};if(void 0===o)return _jsx(View,{style:[a,r],children:s});const u=i.interpolate({inputRange:[0,1],outputRange:["0deg","180deg"]});return _jsx(Animated.View,{style:[a,{transform:[{rotate:u}]},r],children:s})};export default Chevron;

package/lib/module/components/FieldBase/FieldBase.js

@@ -1 +1 @@
-"use strict";import{useEffect,useMemo,useRef}from"react";import{Animated,Easing,Pressable,StyleSheet,Text,View}from"react-native";import{createAnimatedValue,fontFor,useTheme}from"../../theme/index.js";import{smoothCorners}from"../../utils/corners.js";import{defaultIcons}from"../AppIcon/defaultIcons.js";import{NotationInkContext}from"../Notation/Notation.js";import{SquircleFill,useSquircle}from"../SquircleFill/SquircleFill.js";import{jsx as _jsx,jsxs as _jsxs,Fragment as _Fragment}from"react/jsx-runtime";const expandColorSides=e=>"string"==typeof e?{top:e,right:e,bottom:e,left:e}:{top:e.top??"transparent",right:e.right??"transparent",bottom:e.bottom??"transparent",left:e.left??"transparent"},expandWidthSides=e=>"number"==typeof e?{top:e,right:e,bottom:e,left:e}:{top:e.top??0,right:e.right??0,bottom:e.bottom??0,left:e.left??0};export const pickRepresentativeBorderColor=e=>{for(const t of["bottom","top","left","right"]){const o=e[t];if(o&&"transparent"!==o)return o}return e.bottom};export const resolveFieldTextStyle=(e,t={})=>{const{disabled:o=!1}=t,r=e.components.field,i=e.colors.field;return{color:o?r?.disabledTextColor??i.textDisabled:r?.textColor??i.text,placeholderColor:r?.placeholderColor??(o?i.placeholderDisabled:i.placeholder),weightStyle:r?.fontWeight?{fontWeight:r.fontWeight}:fontFor(e,"normal")}};export const RequiredMark=()=>{const e=useTheme(),t=e.components.field;return _jsx(Text,{style:{color:t?.requiredMarkerColor??e.colors.error},children:` ${t?.requiredMarker??"*"}`})};export const RequiredPlaceholder=({text:e,color:t,fontSize:o,weightStyle:r,align:i="center",paddingTop:l,textAlign:n})=>_jsx(View,{pointerEvents:"none",style:[StyleSheet.absoluteFill,{justifyContent:"top"===i?"flex-start":"center",paddingTop:l}],children:_jsxs(Text,{accessible:!1,numberOfLines:1,style:{color:t,fontSize:o,...r,includeFontPadding:!1,textAlign:n},children:[e,_jsx(RequiredMark,{})]})});export const FieldErrorGlyph=({size:e,color:t})=>{const o=useTheme(),r=o.icons?.error??defaultIcons.error;return _jsx(_Fragment,{children:r({size:e,color:t})})};export const hasFieldText=e=>null!=e&&!1!==e&&!0!==e&&""!==e;export const fieldTextAsString=e=>"string"==typeof e?e:void 0;export const FieldLabel=({children:e,size:t="md",required:o=!1,help:r,color:i,style:l})=>{const n=useTheme(),s=resolveFieldSize(n,t),d=hasFieldText(r),a=StyleSheet.flatten(l),c=a?.fontSize??s.labelFontSize,b=a?.color??i??n.colors.field.label,p=useMemo(()=>({fontSize:c,color:b}),[c,b]),g=_jsxs(Text,{style:[familyStyles.label,{color:i??n.colors.field.label,fontSize:s.labelFontSize,...fontFor(n,"semibold"),marginBottom:d?0:s.labelGap},d?familyStyles.labelShrink:null,l],children:[_jsx(NotationInkContext.Provider,{value:p,children:e}),o?_jsx(RequiredMark,{}):null]});return d?_jsxs(View,{style:[familyStyles.labelRow,{marginBottom:s.labelGap}],children:[g,_jsx(View,{style:[familyStyles.help,{marginLeft:n.spacing.xs}],children:r})]}):g};export const FieldMessage=({text:e,error:t=!1,size:o="md",style:r})=>{const i=useTheme(),l=resolveFieldSize(i,o);if(!hasFieldText(e))return null;const n=t?i.colors.field.message:i.colors.text.secondary;return _jsxs(View,{style:[familyStyles.messageRow,{marginTop:l.messageGap,columnGap:i.spacing.xs+2}],accessibilityLiveRegion:t?"polite":"none",children:[t?_jsx(FieldErrorGlyph,{size:l.messageFontSize,color:n}):null,_jsx(Text,{style:[familyStyles.messageText,{color:n,fontSize:l.messageFontSize,...fontFor(i,"normal")},r],children:e})]})};const familyStyles=StyleSheet.create({label:{includeFontPadding:!1},labelShrink:{flexShrink:1},labelRow:{flexDirection:"row",alignItems:"center"},help:{flexShrink:0,alignItems:"center",justifyContent:"center"},messageRow:{flexDirection:"row",alignItems:"center"},messageText:{flexShrink:1,includeFontPadding:!1}});export const resolveFieldSize=(e,t)=>{const o=e.components.field?.[t],r=DEFAULT_SIZES[t];return{paddingHorizontal:o?.paddingHorizontal??r.paddingHorizontal,paddingVertical:o?.paddingVertical??r.paddingVertical,minHeight:o?.minHeight??r.minHeight,fontSize:o?.fontSize??r.fontSize,borderRadius:o?.borderRadius??r.borderRadius,iconSize:o?.iconSize??r.iconSize,labelFontSize:o?.labelFontSize??r.labelFontSize,labelGap:o?.labelGap??r.labelGap,messageFontSize:o?.messageFontSize??r.messageFontSize,messageGap:o?.messageGap??r.messageGap}};const DEFAULT_SIZES={sm:{paddingHorizontal:12,paddingVertical:10,minHeight:38,fontSize:13,borderRadius:10,iconSize:14,labelFontSize:11,labelGap:4,messageFontSize:11,messageGap:2},md:{paddingHorizontal:14,paddingVertical:13,minHeight:44,fontSize:14,borderRadius:10,iconSize:16,labelFontSize:12,labelGap:4,messageFontSize:12,messageGap:2},lg:{paddingHorizontal:16,paddingVertical:15,minHeight:52,fontSize:16,borderRadius:10,iconSize:18,labelFontSize:13,labelGap:4,messageFontSize:13,messageGap:2}};export const resolveVariantColors=(e,t,o)=>{const r=e.components.field?.[t],i=e.colors.field;let l,n,s,d,a;"outlined"===t?(l=i.background,n=i.backgroundFocused,s=i.backgroundDisabled,d=i.border,a=e.colors.border.width):"underline"===t?(l="transparent",n=void 0,s="transparent",d={bottom:i.border},a={bottom:e.colors.border.width}):(l=i.background,n=void 0,s=i.backgroundDisabled,d="transparent",a=0);const wrapToIdleShape=e=>"string"==typeof d?e:{bottom:e},c=expandColorSides(o?.borderIdle??r?.borderIdle??d),b=expandColorSides(o?.borderFocused??r?.borderFocused??wrapToIdleShape(i.borderFocused)),p=expandColorSides(o?.borderError??r?.borderError??wrapToIdleShape(i.borderError)),g=expandColorSides(o?.borderDisabled??r?.borderDisabled??d),u=expandWidthSides(o?.borderWidth??r?.borderWidth??a);return{backgroundIdleEmpty:o?.backgroundIdleEmpty??r?.backgroundIdleEmpty??l,backgroundIdleFilled:o?.backgroundIdleFilled??r?.backgroundIdleFilled??o?.backgroundIdleEmpty??r?.backgroundIdleEmpty??l,backgroundFocused:o?.backgroundFocused??r?.backgroundFocused??n,backgroundError:o?.backgroundError??r?.backgroundError??void 0,backgroundDisabled:o?.backgroundDisabled??r?.backgroundDisabled??s,borderIdle:c,borderFocused:b,borderError:p,borderDisabled:g,borderWidth:u,borderFocusedRepresentative:pickRepresentativeBorderColor(b)}};export const FieldBase=e=>{const{size:t="md",variant:o,focused:r=!1,disabled:i=!1,error:l=!1,filled:n=!1,leading:s,leadingDivider:d=!1,trailing:a,slotAlign:c="center",slotLineHeight:b,topNotch:p,children:g,onPress:u,pressFeedback:m=!0,minHeight:h,maxHeight:f,width:x,height:S,paddingHorizontal:y,paddingLeft:F,paddingRight:z,paddingVertical:k,borderRadius:R,borderTopLeftRadius:C,borderTopRightRadius:j,borderBottomLeftRadius:v,borderBottomRightRadius:T,borderWidth:I,borderTopWidth:w,borderRightWidth:_,borderBottomWidth:E,borderLeftWidth:V,gap:H,fillOverrides:D,style:L,testID:W,accessibilityRole:G,accessibilityLabel:B,accessibilityState:q,accessibilityHint:A}=e,M=useTheme(),P=useMemo(()=>buildStyles(),[]),N=o??M.components.field?.defaultVariant??"outlined",O=resolveFieldSize(M,t),U=useMemo(()=>resolveVariantColors(M,N,D),[M,N,D]),Z=l?2:r?1:0,$=useRef(createAnimatedValue(Z)).current;useEffect(()=>{const e=Animated.timing($,{toValue:Z,duration:M.motion.duration.fast,easing:Easing.bezier(...M.motion.easing.standard),useNativeDriver:!1});return e.start(),()=>e.stop()},[Z,$,M.motion.duration.fast,M.motion.easing.standard]);const J=[0,1,2],K=n?U.backgroundIdleFilled:U.backgroundIdleEmpty,Q=U.backgroundFocused??K,X=U.backgroundError??K,Y=i?U.backgroundDisabled:$.interpolate({inputRange:J,outputRange:[K,Q,X]}),ee=U.borderIdle,te=U.borderFocused,oe=U.borderError,re={top:w,right:_,bottom:E,left:V},ie={top:re.top??I??U.borderWidth.top,right:re.right??I??U.borderWidth.right,bottom:re.bottom??I??U.borderWidth.bottom,left:re.left??I??U.borderWidth.left},le={minHeight:S??h??O.minHeight,maxHeight:f,paddingHorizontal:y??O.paddingHorizontal,paddingVertical:k??O.paddingVertical,paddingLeft:F??y??O.paddingHorizontal,paddingRight:z??y??O.paddingHorizontal,backgroundColor:Y,columnGap:H??M.spacing.md,alignItems:"top"===c?"flex-start":"center"},ne="underline"===N,se=ne?0:R??O.borderRadius,de=ne?{tl:0,tr:0,bl:0,br:0}:{tl:C??se,tr:j??se,bl:v??se,br:T??se};le.borderTopLeftRadius=de.tl,le.borderTopRightRadius=de.tr,le.borderBottomLeftRadius=de.bl,le.borderBottomRightRadius=de.br,le.borderCurve=smoothCorners.borderCurve,le.borderTopWidth=ie.top,le.borderRightWidth=ie.right,le.borderBottomWidth=ie.bottom,le.borderLeftWidth=ie.left;const sideColor=e=>$.interpolate({inputRange:J,outputRange:[ee[e],te[e],oe[e]]}),sameOnEverySide=e=>e.top===e.right&&e.top===e.bottom&&e.top===e.left,ae=!ne&&de.tl===de.tr&&de.tl===de.bl&&de.tl===de.br&&sameOnEverySide(ie)&&sameOnEverySide(ee)&&sameOnEverySide(te)&&sameOnEverySide(oe)&&sameOnEverySide(U.borderDisabled),ce=useSquircle(ae,de.tl);if(ce.active)le.backgroundColor="transparent",le.borderTopColor="transparent",le.borderRightColor="transparent",le.borderBottomColor="transparent",le.borderLeftColor="transparent";else if(i){const e=U.borderDisabled;le.borderTopColor=e.top,le.borderRightColor=e.right,le.borderBottomColor=e.bottom,le.borderLeftColor=e.left}else le.borderTopColor=sideColor("top"),le.borderRightColor=sideColor("right"),le.borderBottomColor=sideColor("bottom"),le.borderLeftColor=sideColor("left");const be=i?U.borderDisabled.top:sideColor("top"),pe=useRef(Z);pe.current=Z,useEffect(()=>{$.setValue(pe.current)},[U,$]),void 0!==x&&(le.width=x),void 0!==S&&(le.height=S);const ge={disabled:i,...q},ue="top"===c,me=ue?{alignSelf:"flex-start",marginTop:Math.max(0,((b??O.iconSize)-O.iconSize)/2)}:null,he=S??h??O.minHeight,fe=(()=>{if(!p)return 0;const e=Math.min(de.tl,he/2),t=p.left;return e<=0||t>=e?0:Math.ceil(e-Math.sqrt(e*e-(e-t)*(e-t)))})(),xe=p&&ie.top>0?_jsx(Animated.View,{pointerEvents:"none",style:{position:"absolute",top:-ie.top,left:p.left-ie.left,width:p.width,height:ie.top+fe,backgroundColor:Y}}):null,renderInner=e=>_jsxs(_Fragment,{children:[ce.active&&ce.size?_jsx(SquircleFill,{width:ce.size.width,height:ce.size.height,radius:de.tl,fill:e&&!i?M.colors.surface.pressed:Y,stroke:be,strokeWidth:ie.top,outset:ie.top}):null,xe,null!=s?_jsx(View,{style:[P.slot,me],children:s}):null,null!=s&&d?_jsx(View,{pointerEvents:"none",style:[P.divider,me,{height:O.iconSize,backgroundColor:M.colors.field.border}]}):null,_jsx(View,{style:[P.content,ue?P.contentTop:null],children:g}),null!=a?_jsx(View,{style:[P.slot,me],children:a}):null]}),Se=_jsx(Animated.View,{onLayout:ce.onLayout,style:[P.box,le,L],accessibilityRole:G,accessibilityLabel:B,accessibilityHint:A,accessibilityState:ge,testID:W,children:renderInner(!1)});return u&&!m?_jsx(Pressable,{onPress:u,disabled:i,accessible:!1,children:Se}):u?_jsx(Pressable,{onPress:u,disabled:i,accessibilityRole:G??"button",accessibilityLabel:B,accessibilityHint:A,accessibilityState:ge,testID:W,children:({pressed:e})=>_jsx(Animated.View,{onLayout:ce.onLayout,style:[P.box,le,!e||i||ce.active?null:{backgroundColor:M.colors.surface.pressed},L],children:renderInner(e)})}):Se};FieldBase.displayName="FieldBase";const buildStyles=()=>StyleSheet.create({box:{flexDirection:"row",alignItems:"center",overflow:"visible"},slot:{alignItems:"center",justifyContent:"center"},divider:{width:1,alignSelf:"center"},content:{flex:1,flexDirection:"row",alignItems:"center"},contentTop:{alignItems:"flex-start"}});export default FieldBase;
+"use strict";import{useEffect,useMemo,useRef}from"react";import{Animated,Easing,Pressable,StyleSheet,Text,View}from"react-native";import{createAnimatedValue,fontFor,useTheme}from"../../theme/index.js";import{ariaFromState}from"../../utils/ariaState.js";import{smoothCorners}from"../../utils/corners.js";import{defaultIcons}from"../AppIcon/defaultIcons.js";import{NotationInkContext}from"../Notation/Notation.js";import{SquircleFill,useSquircle}from"../SquircleFill/SquircleFill.js";import{jsx as _jsx,jsxs as _jsxs,Fragment as _Fragment}from"react/jsx-runtime";const expandColorSides=e=>"string"==typeof e?{top:e,right:e,bottom:e,left:e}:{top:e.top??"transparent",right:e.right??"transparent",bottom:e.bottom??"transparent",left:e.left??"transparent"},expandWidthSides=e=>"number"==typeof e?{top:e,right:e,bottom:e,left:e}:{top:e.top??0,right:e.right??0,bottom:e.bottom??0,left:e.left??0};export const pickRepresentativeBorderColor=e=>{for(const t of["bottom","top","left","right"]){const o=e[t];if(o&&"transparent"!==o)return o}return e.bottom};export const resolveFieldTextStyle=(e,t={})=>{const{disabled:o=!1}=t,r=e.components.field,i=e.colors.field;return{color:o?r?.disabledTextColor??i.textDisabled:r?.textColor??i.text,placeholderColor:r?.placeholderColor??(o?i.placeholderDisabled:i.placeholder),weightStyle:r?.fontWeight?{fontWeight:r.fontWeight}:fontFor(e,"normal")}};export const RequiredMark=()=>{const e=useTheme(),t=e.components.field;return _jsx(Text,{style:{color:t?.requiredMarkerColor??e.colors.toneText.error},children:` ${t?.requiredMarker??"*"}`})};export const RequiredPlaceholder=({text:e,color:t,fontSize:o,weightStyle:r,align:i="center",paddingTop:l,textAlign:n})=>_jsx(View,{pointerEvents:"none",style:[StyleSheet.absoluteFill,{justifyContent:"top"===i?"flex-start":"center",paddingTop:l}],children:_jsxs(Text,{accessible:!1,numberOfLines:1,style:{color:t,fontSize:o,...r,includeFontPadding:!1,textAlign:n},children:[e,_jsx(RequiredMark,{})]})});export const FieldErrorGlyph=({size:e,color:t})=>{const o=useTheme(),r=o.icons?.error??defaultIcons.error;return _jsx(_Fragment,{children:r({size:e,color:t})})};export const hasFieldText=e=>null!=e&&!1!==e&&!0!==e&&""!==e;export const fieldTextAsString=e=>"string"==typeof e?e:void 0;export const FieldLabel=({children:e,size:t="md",required:o=!1,help:r,color:i,style:l})=>{const n=useTheme(),s=resolveFieldSize(n,t),d=hasFieldText(r),a=StyleSheet.flatten(l),c=a?.fontSize??s.labelFontSize,b=a?.color??i??n.colors.field.label,p=useMemo(()=>({fontSize:c,color:b}),[c,b]),g=_jsxs(Text,{style:[familyStyles.label,{color:i??n.colors.field.label,fontSize:s.labelFontSize,...fontFor(n,"semibold"),marginBottom:d?0:s.labelGap},d?familyStyles.labelShrink:null,l],children:[_jsx(NotationInkContext.Provider,{value:p,children:e}),o?_jsx(RequiredMark,{}):null]});return d?_jsxs(View,{style:[familyStyles.labelRow,{marginBottom:s.labelGap}],children:[g,_jsx(View,{style:[familyStyles.help,{marginLeft:n.spacing.xs}],children:r})]}):g};export const FieldMessage=({text:e,error:t=!1,size:o="md",style:r})=>{const i=useTheme(),l=resolveFieldSize(i,o);if(!hasFieldText(e))return null;const n=t?i.colors.field.message:i.colors.text.secondary;return _jsxs(View,{style:[familyStyles.messageRow,{marginTop:l.messageGap,columnGap:i.spacing.xs+2}],accessibilityLiveRegion:t?"polite":"none",children:[t?_jsx(FieldErrorGlyph,{size:l.messageFontSize,color:n}):null,_jsx(Text,{style:[familyStyles.messageText,{color:n,fontSize:l.messageFontSize,...fontFor(i,"normal")},r],children:e})]})};const familyStyles=StyleSheet.create({label:{includeFontPadding:!1},labelShrink:{flexShrink:1},labelRow:{flexDirection:"row",alignItems:"center"},help:{flexShrink:0,alignItems:"center",justifyContent:"center"},messageRow:{flexDirection:"row",alignItems:"center"},messageText:{flexShrink:1,includeFontPadding:!1}});export const resolveFieldSize=(e,t)=>{const o=e.components.field?.[t],r=DEFAULT_SIZES[t];return{paddingHorizontal:o?.paddingHorizontal??r.paddingHorizontal,paddingVertical:o?.paddingVertical??r.paddingVertical,minHeight:o?.minHeight??r.minHeight,fontSize:o?.fontSize??r.fontSize,borderRadius:o?.borderRadius??r.borderRadius,iconSize:o?.iconSize??r.iconSize,labelFontSize:o?.labelFontSize??r.labelFontSize,labelGap:o?.labelGap??r.labelGap,messageFontSize:o?.messageFontSize??r.messageFontSize,messageGap:o?.messageGap??r.messageGap}};const DEFAULT_SIZES={sm:{paddingHorizontal:12,paddingVertical:10,minHeight:38,fontSize:13,borderRadius:10,iconSize:14,labelFontSize:11,labelGap:4,messageFontSize:11,messageGap:2},md:{paddingHorizontal:14,paddingVertical:13,minHeight:44,fontSize:14,borderRadius:10,iconSize:16,labelFontSize:12,labelGap:4,messageFontSize:12,messageGap:2},lg:{paddingHorizontal:16,paddingVertical:15,minHeight:52,fontSize:16,borderRadius:10,iconSize:18,labelFontSize:13,labelGap:4,messageFontSize:13,messageGap:2}};export const resolveVariantColors=(e,t,o)=>{const r=e.components.field?.[t],i=e.colors.field;let l,n,s,d,a;"outlined"===t?(l=i.background,n=i.backgroundFocused,s=i.backgroundDisabled,d=i.border,a=e.colors.border.width):"underline"===t?(l="transparent",n=void 0,s="transparent",d={bottom:i.border},a={bottom:e.colors.border.width}):(l=i.background,n=void 0,s=i.backgroundDisabled,d="transparent",a=0);const wrapToIdleShape=e=>"string"==typeof d?e:{bottom:e},c=expandColorSides(o?.borderIdle??r?.borderIdle??d),b=expandColorSides(o?.borderFocused??r?.borderFocused??wrapToIdleShape(i.borderFocused)),p=expandColorSides(o?.borderError??r?.borderError??wrapToIdleShape(i.borderError)),g=expandColorSides(o?.borderDisabled??r?.borderDisabled??d),u=expandWidthSides(o?.borderWidth??r?.borderWidth??a);return{backgroundIdleEmpty:o?.backgroundIdleEmpty??r?.backgroundIdleEmpty??l,backgroundIdleFilled:o?.backgroundIdleFilled??r?.backgroundIdleFilled??o?.backgroundIdleEmpty??r?.backgroundIdleEmpty??l,backgroundFocused:o?.backgroundFocused??r?.backgroundFocused??n,backgroundError:o?.backgroundError??r?.backgroundError??void 0,backgroundDisabled:o?.backgroundDisabled??r?.backgroundDisabled??s,borderIdle:c,borderFocused:b,borderError:p,borderDisabled:g,borderWidth:u,borderFocusedRepresentative:pickRepresentativeBorderColor(b)}};export const FieldBase=e=>{const{size:t="md",variant:o,focused:r=!1,disabled:i=!1,error:l=!1,filled:n=!1,leading:s,leadingDivider:d=!1,trailing:a,slotAlign:c="center",slotLineHeight:b,topNotch:p,children:g,onPress:u,pressFeedback:m=!0,minHeight:h,maxHeight:f,width:S,height:x,paddingHorizontal:y,paddingLeft:F,paddingRight:z,paddingVertical:k,borderRadius:R,borderTopLeftRadius:C,borderTopRightRadius:j,borderBottomLeftRadius:v,borderBottomRightRadius:T,borderWidth:I,borderTopWidth:w,borderRightWidth:_,borderBottomWidth:E,borderLeftWidth:V,gap:H,fillOverrides:D,style:L,testID:W,accessibilityRole:G,accessibilityLabel:B,accessibilityState:q,accessibilityHint:A}=e,M=useTheme(),P=useMemo(()=>buildStyles(),[]),N=o??M.components.field?.defaultVariant??"outlined",O=resolveFieldSize(M,t),U=useMemo(()=>resolveVariantColors(M,N,D),[M,N,D]),Z=l?2:r?1:0,$=useRef(createAnimatedValue(Z)).current;useEffect(()=>{const e=Animated.timing($,{toValue:Z,duration:M.motion.duration.fast,easing:Easing.bezier(...M.motion.easing.standard),useNativeDriver:!1});return e.start(),()=>e.stop()},[Z,$,M.motion.duration.fast,M.motion.easing.standard]);const J=[0,1,2],K=n?U.backgroundIdleFilled:U.backgroundIdleEmpty,Q=U.backgroundFocused??K,X=U.backgroundError??K,Y=i?U.backgroundDisabled:$.interpolate({inputRange:J,outputRange:[K,Q,X]}),ee=U.borderIdle,te=U.borderFocused,oe=U.borderError,re={top:w,right:_,bottom:E,left:V},ie={top:re.top??I??U.borderWidth.top,right:re.right??I??U.borderWidth.right,bottom:re.bottom??I??U.borderWidth.bottom,left:re.left??I??U.borderWidth.left},le={minHeight:x??h??O.minHeight,maxHeight:f,paddingHorizontal:y??O.paddingHorizontal,paddingVertical:k??O.paddingVertical,paddingLeft:F??y??O.paddingHorizontal,paddingRight:z??y??O.paddingHorizontal,backgroundColor:Y,columnGap:H??M.spacing.md,alignItems:"top"===c?"flex-start":"center"},ne="underline"===N,se=ne?0:R??O.borderRadius,de=ne?{tl:0,tr:0,bl:0,br:0}:{tl:C??se,tr:j??se,bl:v??se,br:T??se};le.borderTopLeftRadius=de.tl,le.borderTopRightRadius=de.tr,le.borderBottomLeftRadius=de.bl,le.borderBottomRightRadius=de.br,le.borderCurve=smoothCorners.borderCurve,le.borderTopWidth=ie.top,le.borderRightWidth=ie.right,le.borderBottomWidth=ie.bottom,le.borderLeftWidth=ie.left;const sideColor=e=>$.interpolate({inputRange:J,outputRange:[ee[e],te[e],oe[e]]}),sameOnEverySide=e=>e.top===e.right&&e.top===e.bottom&&e.top===e.left,ae=!ne&&de.tl===de.tr&&de.tl===de.bl&&de.tl===de.br&&sameOnEverySide(ie)&&sameOnEverySide(ee)&&sameOnEverySide(te)&&sameOnEverySide(oe)&&sameOnEverySide(U.borderDisabled),ce=useSquircle(ae,de.tl);if(ce.active)le.backgroundColor="transparent",le.borderTopColor="transparent",le.borderRightColor="transparent",le.borderBottomColor="transparent",le.borderLeftColor="transparent";else if(i){const e=U.borderDisabled;le.borderTopColor=e.top,le.borderRightColor=e.right,le.borderBottomColor=e.bottom,le.borderLeftColor=e.left}else le.borderTopColor=sideColor("top"),le.borderRightColor=sideColor("right"),le.borderBottomColor=sideColor("bottom"),le.borderLeftColor=sideColor("left");const be=i?U.borderDisabled.top:sideColor("top"),pe=useRef(Z);pe.current=Z,useEffect(()=>{$.setValue(pe.current)},[U,$]),void 0!==S&&(le.width=S),void 0!==x&&(le.height=x);const ge={disabled:i,...q},ue="top"===c,me=ue?{alignSelf:"flex-start",marginTop:Math.max(0,((b??O.iconSize)-O.iconSize)/2)}:null,he=x??h??O.minHeight,fe=(()=>{if(!p)return 0;const e=Math.min(de.tl,he/2),t=p.left;return e<=0||t>=e?0:Math.ceil(e-Math.sqrt(e*e-(e-t)*(e-t)))})(),Se=p&&ie.top>0?_jsx(Animated.View,{pointerEvents:"none",style:{position:"absolute",top:-ie.top,left:p.left-ie.left,width:p.width,height:ie.top+fe,backgroundColor:Y}}):null,renderInner=e=>_jsxs(_Fragment,{children:[ce.active&&ce.size?_jsx(SquircleFill,{width:ce.size.width,height:ce.size.height,radius:de.tl,fill:e&&!i?M.colors.surface.pressed:Y,stroke:be,strokeWidth:ie.top,outset:ie.top}):null,Se,null!=s?_jsx(View,{style:[P.slot,me],children:s}):null,null!=s&&d?_jsx(View,{pointerEvents:"none",style:[P.divider,me,{height:O.iconSize,backgroundColor:M.colors.field.border}]}):null,_jsx(View,{style:[P.content,ue?P.contentTop:null],children:g}),null!=a?_jsx(View,{style:[P.slot,me],children:a}):null]}),xe=_jsx(Animated.View,{onLayout:ce.onLayout,style:[P.box,le,L],accessibilityRole:G,accessibilityLabel:B,accessibilityHint:A,accessibilityState:ge,...ariaFromState(ge),testID:W,children:renderInner(!1)});return u&&!m?_jsx(Pressable,{onPress:u,disabled:i,accessible:!1,children:xe}):u?_jsx(Pressable,{onPress:u,disabled:i,accessibilityRole:G??"button",accessibilityLabel:B,accessibilityHint:A,accessibilityState:ge,...ariaFromState(ge),testID:W,children:({pressed:e})=>_jsx(Animated.View,{onLayout:ce.onLayout,style:[P.box,le,!e||i||ce.active?null:{backgroundColor:M.colors.surface.pressed},L],children:renderInner(e)})}):xe};FieldBase.displayName="FieldBase";const buildStyles=()=>StyleSheet.create({box:{flexDirection:"row",alignItems:"center",overflow:"visible"},slot:{alignItems:"center",justifyContent:"center"},divider:{width:1,alignSelf:"center"},content:{flex:1,flexDirection:"row",alignItems:"center"},contentTop:{alignItems:"flex-start"}});export default FieldBase;

package/lib/module/components/FilePicker/FilePicker.js

@@ -1 +1 @@
-"use strict";import React,{forwardRef,useCallback,useImperativeHandle,useMemo,useRef,useState}from"react";import{Image,Pressable,ScrollView,StyleSheet,Text,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{smoothCorners}from"../../utils/corners.js";import{defaultIcons}from"../AppIcon/defaultIcons.js";import{hasFieldText}from"../FieldBase/index.js";import{OptionSheet}from"../OptionSheet/OptionSheet.js";import{Spinner}from"../Spinner/index.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";let fileIdSeq=0;const nextFileId=()=>"wfp-"+ ++fileIdSeq,DEFAULT_LABELS={trigger:"Attach file",addMore:"Add more",sheetTitle:"Add from",removeFile:e=>`Remove ${e}`,retry:"Retry upload",errorTooMany:e=>`You can attach up to ${e} files.`,errorTooLarge:(e,r)=>`${e} is larger than ${r} MB.`,errorWrongType:e=>`${e} is not an accepted file type.`};export const formatFileSize=e=>{if(void 0===e||e<=0)return"";const r=["B","KB","MB","GB"];let t=e,o=0;for(;t>=1024&&o<r.length-1;)t/=1024,o+=1;return`${t>=10||0===o?Math.round(t):Math.round(10*t)/10} ${r[o]}`};export const matchesAccept=(e,r)=>!r||0===r.length||!!e&&r.some(r=>"*/*"===r||"*"===r||(r.endsWith("/*")?e.startsWith(r.slice(0,r.length-1)):e===r));const isImage=e=>!0===e.type?.startsWith("image/")||!e.type&&/\.(png|jpe?g|gif|webp|heic)$/i.test(e.name),imageSourceOf=e=>e.thumbnailUrl??(isImage(e)?e.uri??e.url:void 0),extensionOf=e=>{const r=e.lastIndexOf(".");return r<=0||r===e.length-1?"FILE":e.slice(r+1).toUpperCase().slice(0,4)},FilePicker=forwardRef((e,r)=>{const{files:t,defaultFiles:o,onChange:i,sources:s,maxFiles:l,maxSizeMB:n,accept:a,validate:c,process:d,variant:u="card",renderFile:g,renderTrigger:h,disabled:p=!1,helperText:m,error:y,labels:b,haptic:f,onPick:x,onRemove:S,onError:T,onFilePress:j,onRetry:C,style:v,accessibilityLabel:w,testID:F}=e,k=useTheme(),_=useMemo(()=>buildStyles(k),[k]),P=useMemo(()=>({...DEFAULT_LABELS,...b}),[b]),z=k.components.filePicker,R=z?.thumbnailSize??84,I=z?.borderRadius??k.radius.md,V=z?.dashedBorderColor??k.colors.primary,[O,B]=useControllableState({value:t,defaultValue:o??[],onChange:i}),L=useRef(O);L.current=O;const M=useCallback(e=>{L.current=e,B(e)},[B]),[H,$]=useState(null),[A,E]=useState(!1),W=y??H??void 0,D="number"==typeof l&&O.length>=l,U=useCallback((e,r)=>{0!==e.length&&($(e[0]),e.forEach(e=>T?.(e,r)),!1!==f&&triggerHaptic("notificationError"))},[T,f]),G=useCallback(async e=>{let r;try{r=await e.pick()}catch(e){return void U([e instanceof Error?e.message:String(e)])}if(!r||0===r.length)return;const t=[];let o=r.map(e=>({id:nextFileId(),name:e.name??e.uri.split("/").pop()??"file",uri:e.uri,type:e.type,size:e.size,meta:e.meta,status:"idle"}));if("number"==typeof l){const e=Math.max(0,l-L.current.length);o.length>e&&(t.push(P.errorTooMany(l)),o=o.slice(0,e))}const i=[];for(const e of o){if("number"==typeof n&&"number"==typeof e.size&&e.size>1024*n*1024){t.push(P.errorTooLarge(e.name,n));continue}if(!matchesAccept(e.type,a)){t.push(P.errorWrongType(e.name));continue}const r=c?.(e);r?t.push(r):i.push(e)}if(U(t),0===i.length)return;if(!d){M([...L.current,...i]),$(t.length>0?t[0]:null);const e=resolveHaptic(f,"selection");return e&&triggerHaptic(e),void x?.(i)}const s=i.map(e=>({...e,status:"processing"}));M([...L.current,...s]);const u=[];for(const e of s)try{const r=await d({...e,status:"idle"}),t={...r,id:e.id,status:r.status??"idle"};M(L.current.map(r=>r.id===e.id?t:r)),u.push(t)}catch(r){M(L.current.filter(r=>r.id!==e.id)),U([r instanceof Error?r.message:String(r)],e)}if(u.length>0){0===t.length&&$(null);const e=resolveHaptic(f,"selection");e&&triggerHaptic(e),x?.(u)}},[l,n,a,c,d,P,U,M,x,f]),N=useCallback(e=>{if(p||D)return;const r=e?s.find(r=>r.key===e):1===s.length?s[0]:void 0;r?G(r):s.length>1&&E(!0)},[p,D,s,G]),q=useCallback(e=>{if(p)return;M(L.current.filter(r=>r.id!==e.id)),$(null);const r=resolveHaptic(f,"selection");r&&triggerHaptic(r),S?.(e)},[p,M,S,f]),K=useCallback(()=>{M([]),$(null)},[M]);useImperativeHandle(r,()=>({open:N,clear:K}),[N,K]);const Y=0===O.length?P.trigger:`${O.length} file${1===O.length?"":"s"} attached`,J=w??`Attachments. ${Y}`,statusText=e=>{switch(e.status){case"processing":return"Processing…";case"uploading":return`Uploading ${Math.round(100*(e.progress??0))}%`;case"done":return"Uploaded";case"error":return e.error??"Failed";default:return""}},fileA11yLabel=e=>[e.name,formatFileSize(e.size),statusText(e)].filter(Boolean).join(", "),Q=k.icons?.attachment??defaultIcons.attachment,renderStatusOverlay=e=>{if("processing"===e.status)return _jsx(View,{style:[_.tileOverlay,{backgroundColor:k.colors.background.overlay}],children:_jsx(Spinner,{size:"sm"})});if("uploading"===e.status){const r=Math.round(100*(e.progress??0));return _jsxs(View,{style:[_.tileOverlay,{backgroundColor:k.colors.background.overlay}],children:[_jsx(Text,{style:[_.tileOverlayText,{color:k.colors.onOverlay}],children:`${r}%`}),_jsx(View,{style:[_.tileProgressTrack,{backgroundColor:k.colors.border.primary}],children:_jsx(View,{style:[_.tileProgressFill,{width:`${r}%`,backgroundColor:k.colors.primary}]})})]})}return"done"===e.status?_jsx(View,{style:[_.doneBadge,{backgroundColor:k.colors.success}],children:_jsx(Text,{style:[_.doneBadgeText,{color:k.colors.onSuccess}],children:"✓"})}):null},renderThumbnail=e=>{const r=imageSourceOf(e);return r?_jsx(Image,{source:{uri:r},style:_.thumbnailImage}):_jsx(View,{style:[_.extensionTile,{backgroundColor:k.colors.background.secondary}],children:_jsx(Text,{style:[_.extensionText,{color:k.colors.text.secondary,...fontFor(k,"semibold")}],children:extensionOf(e.name)})})},removeButton=e=>_jsx(Pressable,{onPress:()=>q(e),disabled:p,hitSlop:8,accessibilityRole:"button",accessibilityLabel:P.removeFile(e.name),style:[_.removeButton,{backgroundColor:k.colors.background.overlay}],children:_jsx(Text,{style:[_.removeButtonText,{color:k.colors.onOverlay}],children:"×"})}),retryButton=e=>C&&"error"===e.status?_jsx(Pressable,{onPress:()=>C(e),disabled:p,hitSlop:8,accessibilityRole:"button",accessibilityLabel:P.retry,children:_jsx(Text,{style:[_.retryText,{color:k.colors.primary}],children:"↻"})}):null,renderOneFile=(e,r)=>{const t={file:e,index:r,disabled:p,remove:()=>q(e),retry:C?()=>C(e):void 0},o=g?g(t):"card"===u?(e=>{const{file:r}=e;return _jsxs(View,{style:[_.tile,{width:R,height:R,borderRadius:I,...smoothCorners,borderColor:"error"===r.status?k.colors.error:k.colors.border.primary}],children:[renderThumbnail(r),renderStatusOverlay(r),"error"===r.status?_jsx(View,{style:[_.tileOverlay,{backgroundColor:k.colors.background.overlay}],children:retryButton(r)}):null,removeButton(r)]})})(t):(e=>{const{file:r}=e,t=statusText(r);return _jsxs(View,{style:[_.listRow,{borderRadius:I,...smoothCorners,borderColor:"error"===r.status?k.colors.error:k.colors.border.primary,backgroundColor:k.colors.background.primary}],children:[_jsxs(View,{style:[_.listThumb,{borderRadius:k.radius.sm,...smoothCorners}],children:[renderThumbnail(r),"processing"===r.status?_jsx(View,{style:[_.tileOverlay,{backgroundColor:k.colors.background.overlay}],children:_jsx(Spinner,{size:"sm"})}):null]}),_jsxs(View,{style:_.listTextWrap,children:[_jsx(Text,{numberOfLines:1,ellipsizeMode:"middle",style:[_.listName,{color:k.colors.text.primary,fontSize:k.typography.fontSize.sm,...fontFor(k,"medium")}],children:r.name}),_jsx(Text,{numberOfLines:1,style:[_.listSubtitle,{color:"error"===r.status?k.colors.error:k.colors.text.tertiary,fontSize:k.typography.fontSize.xs}],children:[formatFileSize(r.size),t].filter(Boolean).join(" · ")}),"uploading"===r.status?_jsx(View,{style:[_.listProgressTrack,{backgroundColor:k.colors.border.primary}],children:_jsx(View,{style:[_.listProgressFill,{width:`${Math.round(100*(r.progress??0))}%`,backgroundColor:k.colors.primary}]})}):null]}),retryButton(r),_jsx(Pressable,{onPress:()=>q(r),disabled:p,hitSlop:8,accessibilityRole:"button",accessibilityLabel:P.removeFile(r.name),children:_jsx(Text,{style:[_.listRemoveText,{color:k.colors.text.tertiary}],children:"×"})})]})})(t);return _jsx(Pressable,{onPress:j?()=>j(e):void 0,disabled:p||!j,accessibilityLabel:fileA11yLabel(e),children:o},e.id)},X={open:N,disabled:p||D,fileCount:O.length,atCapacity:D},dashedTrigger=e=>_jsxs(Pressable,{onPress:()=>N(),disabled:p||D,accessibilityRole:"button",accessibilityLabel:J,accessibilityState:{disabled:p||D},style:({pressed:r})=>[_.trigger,e?_.triggerCompact:null,{borderRadius:I,...smoothCorners,borderColor:V,backgroundColor:r?k.colors.surface.pressed:k.colors.background.primary,opacity:p||D?.55:1}],children:[_jsxs(View,{style:_.triggerRow,children:[Q?Q({size:16,color:k.colors.primary}):null,_jsx(Text,{style:[_.triggerText,{color:k.colors.primary,fontSize:k.typography.fontSize.sm,...fontFor(k,"medium")}],children:0===O.length?P.trigger:P.addMore})]}),!e&&m?_jsx(Text,{style:[_.helperText,{color:k.colors.text.tertiary,fontSize:k.typography.fontSize.xs}],children:m}):null]}),Z=_jsx(Pressable,{onPress:()=>N(),disabled:p||D,accessibilityRole:"button",accessibilityLabel:P.addMore,style:({pressed:e})=>[_.tile,_.addTile,{width:R,height:R,borderRadius:I,...smoothCorners,borderColor:V,backgroundColor:e?k.colors.surface.pressed:"transparent",opacity:p||D?.55:1}],children:_jsx(Text,{style:[_.addTileText,{color:k.colors.primary}],children:"+"})});return _jsxs(View,{style:[_.container,v],testID:F,accessibilityLabel:J,children:["card"===u?0===O.length?h?h(X):dashedTrigger(!1):_jsxs(ScrollView,{horizontal:!0,showsHorizontalScrollIndicator:!1,contentContainerStyle:[_.strip,{columnGap:k.spacing.sm}],children:[O.map(renderOneFile),h?h(X):D||p?null:Z]}):_jsxs(View,{style:{rowGap:k.spacing.sm},children:[h?h(X):D?null:dashedTrigger(O.length>0),O.map(renderOneFile)]}),hasFieldText(W)?_jsx(Text,{accessibilityLiveRegion:"polite",style:[_.errorText,{color:k.colors.error,fontSize:k.typography.fontSize.xs,marginTop:k.spacing.xxs}],children:W}):null,_jsx(OptionSheet,{open:A,onClose:()=>E(!1),title:P.sheetTitle,options:s,labelOf:e=>e.label,getValue:e=>e.key,disabledOf:()=>!1,descriptionOf:e=>e.description,iconOf:e=>e.icon,isSelected:()=>!1,onSelect:e=>{E(!1),G(e)}})]})});FilePicker.displayName="FilePicker";const buildStyles=e=>StyleSheet.create({container:{width:"100%"},trigger:{borderWidth:1,borderStyle:"dashed",alignItems:"center",paddingVertical:14,paddingHorizontal:16},triggerCompact:{paddingVertical:10},triggerRow:{flexDirection:"row",alignItems:"center",columnGap:8},triggerText:{includeFontPadding:!1},helperText:{includeFontPadding:!1,marginTop:6,textAlign:"center"},strip:{paddingVertical:2},tile:{borderWidth:1,overflow:"hidden"},addTile:{borderStyle:"dashed",alignItems:"center",justifyContent:"center"},addTileText:{fontSize:28,includeFontPadding:!1},thumbnailImage:{width:"100%",height:"100%",resizeMode:"cover"},extensionTile:{width:"100%",height:"100%",alignItems:"center",justifyContent:"center"},extensionText:{fontSize:12,letterSpacing:1,includeFontPadding:!1},tileOverlay:{...StyleSheet.absoluteFill,alignItems:"center",justifyContent:"center"},tileOverlayText:{fontSize:12,includeFontPadding:!1,marginBottom:6},tileProgressTrack:{position:"absolute",left:8,right:8,bottom:8,height:3,borderRadius:2,...smoothCorners,overflow:"hidden"},tileProgressFill:{height:"100%",borderRadius:2,...smoothCorners},doneBadge:{position:"absolute",right:4,bottom:4,width:18,height:18,borderRadius:9,...smoothCorners,alignItems:"center",justifyContent:"center"},doneBadgeText:{fontSize:11,includeFontPadding:!1},removeButton:{position:"absolute",top:4,right:4,width:20,height:20,borderRadius:10,...smoothCorners,alignItems:"center",justifyContent:"center"},removeButtonText:{fontSize:13,lineHeight:15,includeFontPadding:!1},retryText:{fontSize:20,includeFontPadding:!1},listRow:{flexDirection:"row",alignItems:"center",borderWidth:1,padding:10,columnGap:10},listThumb:{width:40,height:40,overflow:"hidden"},listTextWrap:{flex:1},listName:{includeFontPadding:!1},listSubtitle:{includeFontPadding:!1,marginTop:2},listProgressTrack:{height:3,borderRadius:2,...smoothCorners,overflow:"hidden",marginTop:6},listProgressFill:{height:"100%",borderRadius:2,...smoothCorners},listRemoveText:{fontSize:22,includeFontPadding:!1,paddingHorizontal:4},errorText:{includeFontPadding:!1}});export{FilePicker};export default FilePicker;
+"use strict";import{forwardRef,useCallback,useImperativeHandle,useMemo,useRef,useState}from"react";import{Image,Pressable,ScrollView,StyleSheet,Text,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{smoothCorners}from"../../utils/corners.js";import{defaultIcons}from"../AppIcon/defaultIcons.js";import{hasFieldText}from"../FieldBase/index.js";import{OptionSheet}from"../OptionSheet/OptionSheet.js";import{Spinner}from"../Spinner/index.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";let fileIdSeq=0;const nextFileId=()=>"wfp-"+ ++fileIdSeq,DEFAULT_LABELS={trigger:"Attach file",addMore:"Add more",sheetTitle:"Add from",removeFile:e=>`Remove ${e}`,retry:"Retry upload",errorTooMany:e=>`You can attach up to ${e} files.`,errorTooLarge:(e,r)=>`${e} is larger than ${r} MB.`,errorWrongType:e=>`${e} is not an accepted file type.`};export const formatFileSize=e=>{if(void 0===e||e<=0)return"";const r=["B","KB","MB","GB"];let t=e,o=0;for(;t>=1024&&o<r.length-1;)t/=1024,o+=1;return`${t>=10||0===o?Math.round(t):Math.round(10*t)/10} ${r[o]}`};export const matchesAccept=(e,r)=>!r||0===r.length||!!e&&r.some(r=>"*/*"===r||"*"===r||(r.endsWith("/*")?e.startsWith(r.slice(0,r.length-1)):e===r));const isImage=e=>!0===e.type?.startsWith("image/")||!e.type&&/\.(png|jpe?g|gif|webp|heic)$/i.test(e.name),imageSourceOf=e=>e.thumbnailUrl??(isImage(e)?e.uri??e.url:void 0),extensionOf=e=>{const r=e.lastIndexOf(".");return r<=0||r===e.length-1?"FILE":e.slice(r+1).toUpperCase().slice(0,4)},FilePicker=forwardRef((e,r)=>{const{files:t,defaultFiles:o,onChange:i,sources:s,maxFiles:l,maxSizeMB:n,accept:a,validate:c,process:d,variant:u="card",renderFile:g,renderTrigger:h,disabled:p=!1,helperText:m,error:y,labels:b,haptic:x,onPick:f,onRemove:T,onError:S,onFilePress:j,onRetry:C,style:v,accessibilityLabel:w,testID:F}=e,k=useTheme(),_=useMemo(()=>buildStyles(k),[k]),P=useMemo(()=>({...DEFAULT_LABELS,...b}),[b]),z=k.components.filePicker,R=z?.thumbnailSize??84,I=z?.borderRadius??k.radius.md,V=z?.dashedBorderColor??k.colors.primary,[O,B]=useControllableState({value:t,defaultValue:o??[],onChange:i}),L=useRef(O);L.current=O;const M=useCallback(e=>{L.current=e,B(e)},[B]),[H,$]=useState(null),[A,E]=useState(!1),W=y??H??void 0,D="number"==typeof l&&O.length>=l,U=useCallback((e,r)=>{0!==e.length&&($(e[0]),e.forEach(e=>S?.(e,r)),!1!==x&&triggerHaptic("notificationError"))},[S,x]),G=useCallback(async e=>{let r;try{r=await e.pick()}catch(e){return void U([e instanceof Error?e.message:String(e)])}if(!r||0===r.length)return;const t=[];let o=r.map(e=>({id:nextFileId(),name:e.name??e.uri.split("/").pop()??"file",uri:e.uri,type:e.type,size:e.size,meta:e.meta,status:"idle"}));if("number"==typeof l){const e=Math.max(0,l-L.current.length);o.length>e&&(t.push(P.errorTooMany(l)),o=o.slice(0,e))}const i=[];for(const e of o){if("number"==typeof n&&"number"==typeof e.size&&e.size>1024*n*1024){t.push(P.errorTooLarge(e.name,n));continue}if(!matchesAccept(e.type,a)){t.push(P.errorWrongType(e.name));continue}const r=c?.(e);r?t.push(r):i.push(e)}if(U(t),0===i.length)return;if(!d){M([...L.current,...i]),$(t.length>0?t[0]:null);const e=resolveHaptic(x,"selection");return e&&triggerHaptic(e),void f?.(i)}const s=i.map(e=>({...e,status:"processing"}));M([...L.current,...s]);const u=[];for(const e of s)try{const r=await d({...e,status:"idle"}),t={...r,id:e.id,status:r.status??"idle"};M(L.current.map(r=>r.id===e.id?t:r)),u.push(t)}catch(r){M(L.current.filter(r=>r.id!==e.id)),U([r instanceof Error?r.message:String(r)],e)}if(u.length>0){0===t.length&&$(null);const e=resolveHaptic(x,"selection");e&&triggerHaptic(e),f?.(u)}},[l,n,a,c,d,P,U,M,f,x]),N=useCallback(e=>{if(p||D)return;const r=e?s.find(r=>r.key===e):1===s.length?s[0]:void 0;r?G(r):s.length>1&&E(!0)},[p,D,s,G]),q=useCallback(e=>{if(p)return;M(L.current.filter(r=>r.id!==e.id)),$(null);const r=resolveHaptic(x,"selection");r&&triggerHaptic(r),T?.(e)},[p,M,T,x]),K=useCallback(()=>{M([]),$(null)},[M]);useImperativeHandle(r,()=>({open:N,clear:K}),[N,K]);const Y=0===O.length?P.trigger:`${O.length} file${1===O.length?"":"s"} attached`,J=w??`Attachments. ${Y}`,statusText=e=>{switch(e.status){case"processing":return"Processing…";case"uploading":return`Uploading ${Math.round(100*(e.progress??0))}%`;case"done":return"Uploaded";case"error":return e.error??"Failed";default:return""}},fileA11yLabel=e=>[e.name,formatFileSize(e.size),statusText(e)].filter(Boolean).join(", "),Q=k.icons?.attachment??defaultIcons.attachment,renderStatusOverlay=e=>{if("processing"===e.status)return _jsx(View,{style:[_.tileOverlay,{backgroundColor:k.colors.background.overlay}],children:_jsx(Spinner,{size:"sm"})});if("uploading"===e.status){const r=Math.round(100*(e.progress??0));return _jsxs(View,{style:[_.tileOverlay,{backgroundColor:k.colors.background.overlay}],children:[_jsx(Text,{style:[_.tileOverlayText,{color:k.colors.onOverlay}],children:`${r}%`}),_jsx(View,{style:[_.tileProgressTrack,{backgroundColor:k.colors.border.primary}],children:_jsx(View,{style:[_.tileProgressFill,{width:`${r}%`,backgroundColor:k.colors.primary}]})})]})}return"done"===e.status?_jsx(View,{style:[_.doneBadge,{backgroundColor:k.colors.success}],children:_jsx(Text,{style:[_.doneBadgeText,{color:k.colors.onSuccess}],children:"✓"})}):null},renderThumbnail=e=>{const r=imageSourceOf(e);return r?_jsx(Image,{source:{uri:r},style:_.thumbnailImage}):_jsx(View,{style:[_.extensionTile,{backgroundColor:k.colors.background.secondary}],children:_jsx(Text,{style:[_.extensionText,{color:k.colors.text.secondary,...fontFor(k,"semibold")}],children:extensionOf(e.name)})})},removeButton=e=>_jsx(Pressable,{onPress:()=>q(e),disabled:p,hitSlop:8,accessibilityRole:"button",accessibilityLabel:P.removeFile(e.name),style:[_.removeButton,{backgroundColor:k.colors.background.overlay}],children:_jsx(Text,{style:[_.removeButtonText,{color:k.colors.onOverlay}],children:"×"})}),retryButton=e=>C&&"error"===e.status?_jsx(Pressable,{onPress:()=>C(e),disabled:p,hitSlop:8,accessibilityRole:"button",accessibilityLabel:P.retry,children:_jsx(Text,{style:[_.retryText,{color:k.colors.primary}],children:"↻"})}):null,renderOneFile=(e,r)=>{const t={file:e,index:r,disabled:p,remove:()=>q(e),retry:C?()=>C(e):void 0},o=g?g(t):"card"===u?(e=>{const{file:r}=e;return _jsxs(View,{style:[_.tile,{width:R,height:R,borderRadius:I,...smoothCorners,borderColor:"error"===r.status?k.colors.error:k.colors.border.primary}],children:[renderThumbnail(r),renderStatusOverlay(r),"error"===r.status?_jsx(View,{style:[_.tileOverlay,{backgroundColor:k.colors.background.overlay}],children:retryButton(r)}):null,removeButton(r)]})})(t):(e=>{const{file:r}=e,t=statusText(r);return _jsxs(View,{style:[_.listRow,{borderRadius:I,...smoothCorners,borderColor:"error"===r.status?k.colors.error:k.colors.border.primary,backgroundColor:k.colors.background.primary}],children:[_jsxs(View,{style:[_.listThumb,{borderRadius:k.radius.sm,...smoothCorners}],children:[renderThumbnail(r),"processing"===r.status?_jsx(View,{style:[_.tileOverlay,{backgroundColor:k.colors.background.overlay}],children:_jsx(Spinner,{size:"sm"})}):null]}),_jsxs(View,{style:_.listTextWrap,children:[_jsx(Text,{numberOfLines:1,ellipsizeMode:"middle",style:[_.listName,{color:k.colors.text.primary,fontSize:k.typography.fontSize.sm,...fontFor(k,"medium")}],children:r.name}),_jsx(Text,{numberOfLines:1,style:[_.listSubtitle,{color:"error"===r.status?k.colors.toneText.error:k.colors.text.tertiary,fontSize:k.typography.fontSize.xs}],children:[formatFileSize(r.size),t].filter(Boolean).join(" · ")}),"uploading"===r.status?_jsx(View,{style:[_.listProgressTrack,{backgroundColor:k.colors.border.primary}],children:_jsx(View,{style:[_.listProgressFill,{width:`${Math.round(100*(r.progress??0))}%`,backgroundColor:k.colors.primary}]})}):null]}),retryButton(r),_jsx(Pressable,{onPress:()=>q(r),disabled:p,hitSlop:8,accessibilityRole:"button",accessibilityLabel:P.removeFile(r.name),children:_jsx(Text,{style:[_.listRemoveText,{color:k.colors.text.tertiary}],children:"×"})})]})})(t);return _jsx(Pressable,{onPress:j?()=>j(e):void 0,disabled:p||!j,accessibilityLabel:fileA11yLabel(e),children:o},e.id)},X={open:N,disabled:p||D,fileCount:O.length,atCapacity:D},dashedTrigger=e=>_jsxs(Pressable,{onPress:()=>N(),disabled:p||D,accessibilityRole:"button",accessibilityLabel:J,accessibilityState:{disabled:p||D},"aria-disabled":p||D,style:({pressed:r})=>[_.trigger,e?_.triggerCompact:null,{borderRadius:I,...smoothCorners,borderColor:V,backgroundColor:r?k.colors.surface.pressed:k.colors.background.primary,opacity:p||D?.55:1}],children:[_jsxs(View,{style:_.triggerRow,children:[Q?Q({size:16,color:k.colors.primary}):null,_jsx(Text,{style:[_.triggerText,{color:k.colors.primary,fontSize:k.typography.fontSize.sm,...fontFor(k,"medium")}],children:0===O.length?P.trigger:P.addMore})]}),!e&&m?_jsx(Text,{style:[_.helperText,{color:k.colors.text.tertiary,fontSize:k.typography.fontSize.xs}],children:m}):null]}),Z=_jsx(Pressable,{onPress:()=>N(),disabled:p||D,accessibilityRole:"button",accessibilityLabel:P.addMore,style:({pressed:e})=>[_.tile,_.addTile,{width:R,height:R,borderRadius:I,...smoothCorners,borderColor:V,backgroundColor:e?k.colors.surface.pressed:"transparent",opacity:p||D?.55:1}],children:_jsx(Text,{style:[_.addTileText,{color:k.colors.primary}],children:"+"})});return _jsxs(View,{style:[_.container,v],testID:F,accessibilityLabel:J,children:["card"===u?0===O.length?h?h(X):dashedTrigger(!1):_jsxs(ScrollView,{horizontal:!0,showsHorizontalScrollIndicator:!1,contentContainerStyle:[_.strip,{columnGap:k.spacing.sm}],children:[O.map(renderOneFile),h?h(X):D||p?null:Z]}):_jsxs(View,{style:{rowGap:k.spacing.sm},children:[h?h(X):D?null:dashedTrigger(O.length>0),O.map(renderOneFile)]}),hasFieldText(W)?_jsx(Text,{accessibilityLiveRegion:"polite",style:[_.errorText,{color:k.colors.toneText.error,fontSize:k.typography.fontSize.xs,marginTop:k.spacing.xxs}],children:W}):null,_jsx(OptionSheet,{open:A,onClose:()=>E(!1),title:P.sheetTitle,options:s,labelOf:e=>e.label,getValue:e=>e.key,disabledOf:()=>!1,descriptionOf:e=>e.description,iconOf:e=>e.icon,isSelected:()=>!1,onSelect:e=>{E(!1),G(e)}})]})});FilePicker.displayName="FilePicker";const buildStyles=e=>StyleSheet.create({container:{width:"100%"},trigger:{borderWidth:1,borderStyle:"dashed",alignItems:"center",paddingVertical:14,paddingHorizontal:16},triggerCompact:{paddingVertical:10},triggerRow:{flexDirection:"row",alignItems:"center",columnGap:8},triggerText:{includeFontPadding:!1},helperText:{includeFontPadding:!1,marginTop:6,textAlign:"center"},strip:{paddingVertical:2},tile:{borderWidth:1,overflow:"hidden"},addTile:{borderStyle:"dashed",alignItems:"center",justifyContent:"center"},addTileText:{fontSize:28,includeFontPadding:!1},thumbnailImage:{width:"100%",height:"100%",resizeMode:"cover"},extensionTile:{width:"100%",height:"100%",alignItems:"center",justifyContent:"center"},extensionText:{fontSize:12,letterSpacing:1,includeFontPadding:!1},tileOverlay:{...StyleSheet.absoluteFill,alignItems:"center",justifyContent:"center"},tileOverlayText:{fontSize:12,includeFontPadding:!1,marginBottom:6},tileProgressTrack:{position:"absolute",left:8,right:8,bottom:8,height:3,borderRadius:2,...smoothCorners,overflow:"hidden"},tileProgressFill:{height:"100%",borderRadius:2,...smoothCorners},doneBadge:{position:"absolute",right:4,bottom:4,width:18,height:18,borderRadius:9,...smoothCorners,alignItems:"center",justifyContent:"center"},doneBadgeText:{fontSize:11,includeFontPadding:!1},removeButton:{position:"absolute",top:4,right:4,width:20,height:20,borderRadius:10,...smoothCorners,alignItems:"center",justifyContent:"center"},removeButtonText:{fontSize:13,lineHeight:15,includeFontPadding:!1},retryText:{fontSize:20,includeFontPadding:!1},listRow:{flexDirection:"row",alignItems:"center",borderWidth:1,padding:10,columnGap:10},listThumb:{width:40,height:40,overflow:"hidden"},listTextWrap:{flex:1},listName:{includeFontPadding:!1},listSubtitle:{includeFontPadding:!1,marginTop:2},listProgressTrack:{height:3,borderRadius:2,...smoothCorners,overflow:"hidden",marginTop:6},listProgressFill:{height:"100%",borderRadius:2,...smoothCorners},listRemoveText:{fontSize:22,includeFontPadding:!1,paddingHorizontal:4},errorText:{includeFontPadding:!1}});export{FilePicker};export default FilePicker;

package/lib/module/components/FloatingActionButton/FloatingActionButton.js

@@ -1 +1 @@
-"use strict";import React,{forwardRef,useCallback,useEffect,useMemo,useRef,useState}from"react";import{Animated,Easing,Pressable,StyleSheet,Text,View}from"react-native";import{useSafeAreaInsets}from"react-native-safe-area-context";import{usePressAnimation}from"../../hooks/usePressAnimation.js";import{createAnimatedValue,setNativeValue,useTheme}from"../../theme/index.js";import{ACCENT_PRESSED_TINT}from"../../utils/color.js";import{smoothCorners}from"../../utils/corners.js";import{resolveHaptic,triggerHaptic}from"../../utils/hapticUtils.js";import{jsx as _jsx,Fragment as _Fragment,jsxs as _jsxs}from"react/jsx-runtime";const sizeMap={sm:{diameter:40,iconSize:18,fontSize:13,labelPaddingHorizontal:14},md:{diameter:56,iconSize:22,fontSize:15,labelPaddingHorizontal:18},lg:{diameter:72,iconSize:28,fontSize:16,labelPaddingHorizontal:22}},toneBackground=(e,t)=>{switch(t){case"success":return e.colors.success;case"warning":return e.colors.warning;case"error":return e.colors.error;case"neutral":return e.colors.background.tertiary;default:return e.colors.primary}},pressedTintFor=(e,t)=>"neutral"===t?e.colors.surface.pressed:ACCENT_PRESSED_TINT,toneForeground=(e,t)=>{if("neutral"===t)return e.colors.text.primary;switch(t){case"success":return e.colors.onSuccess;case"warning":return e.colors.onWarning;case"error":return e.colors.onError;default:return e.colors.onPrimary}},FloatingActionButton=forwardRef((e,t)=>{const{icon:o,onPress:n,label:s,size:r="md",tone:i="primary",position:a,bottomOffset:l,disabled:c=!1,hideOnScroll:u=!1,isScrolling:d=!1,accessibilityLabel:m,accessibilityHint:g,haptic:p,style:b,containerStyle:f,labelStyle:h,testID:y}=e,S=useTheme(),x=useSafeAreaInsets(),R=sizeMap[r],C=useMemo(()=>buildStyles(S),[S]),{scale:j,pressIn:v,pressOut:w}=usePressAnimation({enabled:!c}),A=S.components.floatingActionButton,_=A?.edgeOffset??24,E=A?.bottomOffset??24,I=useRef(createAnimatedValue(0)).current;useEffect(()=>{if(!u)return void setNativeValue(I,0);const e=Animated.timing(I,{toValue:d?1:0,duration:S.motion.duration.normal,easing:Easing.bezier(...S.motion.easing.standard),useNativeDriver:!0});return e.start(),()=>e.stop()},[u,d,I,S.motion.duration.normal,S.motion.easing.standard]);const P=I.interpolate({inputRange:[0,1],outputRange:[0,R.diameter+(l??E)+x.bottom+_]}),k=I.interpolate({inputRange:[0,1],outputRange:[1,0]}),z=o,V="string"==typeof s&&s.length>0,T=c?S.colors.surface.disabled:toneBackground(S,i),F=c?S.colors.text.disabled:toneForeground(S,i),D=useMemo(()=>{if(!a)return null;const e=(l??E)+x.bottom;switch(a){case"bottomLeft":return{position:"absolute",bottom:e,left:_};case"bottomCenter":return{position:"absolute",bottom:e,alignSelf:"center"};default:return{position:"absolute",bottom:e,right:_}}},[a,l,x.bottom,E,_]);return _jsx(Animated.View,{style:[D,{transform:[{translateY:P},{scale:j}],opacity:k},f,b],pointerEvents:u&&d?"none":"auto",children:_jsx(Pressable,{ref:t,onPress:e=>{if(c)return;const t=resolveHaptic(p,"impactLight");t&&triggerHaptic(t),n()},onPressIn:v,onPressOut:w,disabled:c,accessibilityRole:"button",accessibilityLabel:m,accessibilityHint:g,accessibilityState:{disabled:c},testID:y,style:[C.base,V?{height:R.diameter,paddingHorizontal:R.labelPaddingHorizontal,borderRadius:R.diameter/2,...smoothCorners}:{width:R.diameter,height:R.diameter,borderRadius:R.diameter/2,...smoothCorners},S.shadows.lg,{backgroundColor:T,opacity:c?.55:1}],children:({pressed:e})=>_jsxs(_Fragment,{children:[e&&!c?_jsx(View,{pointerEvents:"none",testID:"fab-pressed",style:[C.pressedTint,{backgroundColor:pressedTintFor(S,i),borderRadius:R.diameter/2,...smoothCorners}]}):null,z,V?_jsx(Text,{style:[C.label,{color:F,fontSize:R.fontSize,fontWeight:S.typography.fontWeight.semibold,marginLeft:S.spacing.sm},h],numberOfLines:1,children:s}):null]})})})});FloatingActionButton.displayName="FloatingActionButton";const buildStyles=e=>StyleSheet.create({base:{flexDirection:"row",alignItems:"center",justifyContent:"center",overflow:"hidden"},pressedTint:{position:"absolute",top:0,right:0,bottom:0,left:0},label:{includeFontPadding:!1}}),FloatingActionButtonGroup=e=>{const{primaryIcon:t,primaryActiveIcon:o,actions:n,open:s,defaultOpen:r=!1,onOpenChange:i,position:a="bottomRight",bottomOffset:l,size:c="md",accessibilityLabel:u="Quick actions",haptic:d,hideOnScroll:m=!1,isScrolling:g=!1,containerStyle:p,secondaryActionStyle:b,labelPillStyle:f,labelStyle:h,testID:y}=e,S=useTheme(),x=useSafeAreaInsets(),R=sizeMap[c],C=useMemo(()=>buildGroupStyles(S),[S]),j=S.components.floatingActionButton,v=j?.edgeOffset??24,w=j?.bottomOffset??24,A=j?.secondaryGap??16,_=j?.staggerMs??50,E="boolean"==typeof s,[I,P]=useState(r),k=E?s:I,z=useRef(createAnimatedValue(0)).current;useEffect(()=>{if(!m)return void setNativeValue(z,0);const e=Animated.timing(z,{toValue:g?1:0,duration:S.motion.duration.normal,easing:Easing.bezier(...S.motion.easing.standard),useNativeDriver:!0});return e.start(),()=>e.stop()},[m,g,z,S.motion.duration.normal,S.motion.easing.standard]);const V=m&&g;useEffect(()=>{V&&k&&(E||P(!1),i?.(!1))},[V,k,E,i]);const T=z.interpolate({inputRange:[0,1],outputRange:[0,R.diameter+(l??w)+x.bottom+v]}),F=z.interpolate({inputRange:[0,1],outputRange:[1,0]}),D=useRef(createAnimatedValue(k?1:0)).current,H=useRef([]),[B,L]=useState(0);useEffect(()=>{const e=H.current;if(e.length!==n.length){if(e.length<n.length){const t=e.slice();for(let o=e.length;o<n.length;o+=1)t.push(new Animated.Value(k?1:0));H.current=t}else H.current=e.slice(0,n.length);L(e=>e+1)}},[n.length]),useEffect(()=>{const e=Animated.timing(D,{toValue:k?1:0,duration:S.motion.duration.normal,easing:Easing.bezier(...S.motion.easing.standard),useNativeDriver:!0});e.start();const t=H.current.map(e=>Animated.timing(e,{toValue:k?1:0,duration:S.motion.duration.normal,easing:Easing.bezier(...S.motion.easing.standard),useNativeDriver:!0})),o=k?t:[...t].reverse(),n=Animated.stagger(_,o);return n.start(),()=>{e.stop(),n.stop()}},[k,D,S.motion.duration.normal,S.motion.easing.standard,n.length,B,_]);const N=useCallback(e=>{const t=resolveHaptic(d,"impactLight");t&&triggerHaptic(t),E||P(e),i?.(e)},[E,i,d]),O=useCallback(()=>{N(!k)},[k,N]),M=useCallback(e=>{!1!==d&&triggerHaptic("selection"),e.onPress(),E||P(!1),i?.(!1)},[E,i,d]),$=useCallback(()=>{k&&N(!1)},[k,N]),G=useMemo(()=>{const e=(l??w)+x.bottom;switch(a){case"bottomLeft":return{position:"absolute",bottom:e,left:v,alignItems:"flex-start"};case"bottomCenter":return{position:"absolute",bottom:e,alignSelf:"center",alignItems:"center"};default:return{position:"absolute",bottom:e,right:v,alignItems:"flex-end"}}},[a,l,x.bottom,w,v]),slotOffset=e=>-(R.diameter+A)*(e+1),W=useMemo(()=>{switch(a){case"bottomLeft":return{left:0,right:0,justifyContent:"flex-start"};case"bottomCenter":return{left:0,right:0,justifyContent:"center"};default:return{left:0,right:0,justifyContent:"flex-end"}}},[a]),Y=.78*R.diameter,Q=useMemo(()=>{const e=Y+S.spacing.sm;switch(a){case"bottomLeft":return{left:e,alignItems:"flex-start"};case"bottomCenter":return{right:R.diameter/2+Y/2+S.spacing.sm,alignItems:"flex-end"};default:return{right:e,alignItems:"flex-end"}}},[a,Y,R.diameter,S.spacing.sm]),U=D.interpolate({inputRange:[0,1],outputRange:[0,.4]}),q=D.interpolate({inputRange:[0,1],outputRange:["0deg","45deg"]});return _jsxs(_Fragment,{children:[k?_jsx(Animated.View,{pointerEvents:k?"auto":"none",style:[StyleSheet.absoluteFill,{backgroundColor:S.colors.background.overlay,opacity:U}],children:_jsx(Pressable,{style:StyleSheet.absoluteFill,onPress:$,accessibilityElementsHidden:!0,importantForAccessibility:"no",testID:y?`${y}-backdrop`:void 0})}):null,_jsxs(Animated.View,{pointerEvents:V?"none":"box-none",style:[G,{transform:[{translateY:T}],opacity:F},p],accessibilityRole:"menu",testID:y,children:[n.map((e,t)=>{const o=H.current[t];if(!o)return null;const n=o.interpolate({inputRange:[0,1],outputRange:[0,slotOffset(t)]}),s=o.interpolate({inputRange:[0,1],outputRange:[.6,1]}),r=toneBackground(S,e.tone??"primary"),i=toneForeground(S,e.tone??"primary"),a=e.label?_jsx(View,{pointerEvents:"none",style:[C.labelSlot,Q],testID:y?`${y}-label-${e.key}`:void 0,children:_jsx(View,{style:[C.labelPill,S.shadows.sm,{backgroundColor:S.colors.background.elevated,paddingHorizontal:S.spacing.sm,paddingVertical:S.spacing.xs,borderRadius:S.radius.sm,...smoothCorners},f],children:_jsx(Text,{style:[{color:S.colors.text.primary,fontSize:S.typography.fontSize.sm,fontWeight:S.typography.fontWeight.medium},h],numberOfLines:1,children:e.label})})}):null;return _jsxs(Animated.View,{pointerEvents:k?"auto":"none",style:[C.secondaryRow,W,{position:"absolute",bottom:0,opacity:o,transform:[{translateY:n},{scale:s}]}],children:[_jsx(Pressable,{onPress:()=>M(e),accessibilityRole:"menuitem",accessibilityLabel:e.accessibilityLabel,style:[C.fabBase,S.shadows.md,{width:Y,height:Y,borderRadius:Y/2,...smoothCorners,backgroundColor:r},b],testID:y?`${y}-action-${e.key}`:void 0,children:({pressed:t})=>_jsxs(_Fragment,{children:[t?_jsx(View,{pointerEvents:"none",testID:"fab-pressed",style:[C.pressedTint,{backgroundColor:pressedTintFor(S,e.tone??"primary"),borderRadius:Y/2,...smoothCorners}]}):null,React.isValidElement(e.icon)?e.icon:_jsx(Text,{style:{color:i},children:String(e.icon??"")})]})}),a]},e.key)}),_jsx(Pressable,{onPress:O,accessibilityRole:"button",accessibilityLabel:u,accessibilityState:{expanded:k},style:[C.fabBase,S.shadows.lg,{width:R.diameter,height:R.diameter,borderRadius:R.diameter/2,...smoothCorners,backgroundColor:S.colors.primary}],testID:y?`${y}-primary`:void 0,children:({pressed:e})=>_jsxs(_Fragment,{children:[e?_jsx(View,{pointerEvents:"none",testID:"fab-pressed",style:[C.pressedTint,{backgroundColor:ACCENT_PRESSED_TINT,borderRadius:R.diameter/2,...smoothCorners}]}):null,_jsx(Animated.View,{style:o?void 0:{transform:[{rotate:q}]},children:k&&o?o:t})]})})]})]})},buildGroupStyles=e=>StyleSheet.create({fabBase:{flexDirection:"row",alignItems:"center",justifyContent:"center",overflow:"hidden"},pressedTint:{position:"absolute",top:0,right:0,bottom:0,left:0},secondaryRow:{flexDirection:"row",alignItems:"center"},labelSlot:{position:"absolute",top:0,bottom:0,justifyContent:"center"},labelPill:{alignSelf:"auto"}});export{FloatingActionButton,FloatingActionButtonGroup};export default FloatingActionButton;
+"use strict";import React,{forwardRef,useCallback,useEffect,useMemo,useRef,useState}from"react";import{Animated,Easing,Pressable,StyleSheet,Text,View}from"react-native";import{useSafeAreaInsets}from"react-native-safe-area-context";import{usePressAnimation}from"../../hooks/usePressAnimation.js";import{createAnimatedValue,setNativeValue,useTheme}from"../../theme/index.js";import{ACCENT_PRESSED_TINT}from"../../utils/color.js";import{smoothCorners}from"../../utils/corners.js";import{resolveHaptic,triggerHaptic}from"../../utils/hapticUtils.js";import{jsx as _jsx,Fragment as _Fragment,jsxs as _jsxs}from"react/jsx-runtime";const sizeMap={sm:{diameter:40,iconSize:18,fontSize:13,labelPaddingHorizontal:14},md:{diameter:56,iconSize:22,fontSize:15,labelPaddingHorizontal:18},lg:{diameter:72,iconSize:28,fontSize:16,labelPaddingHorizontal:22}},toneBackground=(e,t)=>{switch(t){case"success":return e.colors.success;case"warning":return e.colors.warning;case"error":return e.colors.error;case"neutral":return e.colors.background.tertiary;default:return e.colors.primary}},pressedTintFor=(e,t)=>"neutral"===t?e.colors.surface.pressed:ACCENT_PRESSED_TINT,toneForeground=(e,t)=>{if("neutral"===t)return e.colors.text.primary;switch(t){case"success":return e.colors.onSuccess;case"warning":return e.colors.onWarning;case"error":return e.colors.onError;default:return e.colors.onPrimary}},FloatingActionButton=forwardRef((e,t)=>{const{icon:o,onPress:n,label:s,size:r="md",tone:i="primary",position:a,bottomOffset:l,disabled:c=!1,hideOnScroll:u=!1,isScrolling:d=!1,accessibilityLabel:m,accessibilityHint:g,haptic:p,style:b,containerStyle:f,labelStyle:h,testID:y}=e,S=useTheme(),x=useSafeAreaInsets(),R=sizeMap[r],C=useMemo(()=>buildStyles(S),[S]),{scale:j,pressIn:v,pressOut:w}=usePressAnimation({enabled:!c}),A=S.components.floatingActionButton,_=A?.edgeOffset??24,E=A?.bottomOffset??24,I=useRef(createAnimatedValue(0)).current;useEffect(()=>{if(!u)return void setNativeValue(I,0);const e=Animated.timing(I,{toValue:d?1:0,duration:S.motion.duration.normal,easing:Easing.bezier(...S.motion.easing.standard),useNativeDriver:!0});return e.start(),()=>e.stop()},[u,d,I,S.motion.duration.normal,S.motion.easing.standard]);const P=I.interpolate({inputRange:[0,1],outputRange:[0,R.diameter+(l??E)+x.bottom+_]}),k=I.interpolate({inputRange:[0,1],outputRange:[1,0]}),z=o,V="string"==typeof s&&s.length>0,T=c?S.colors.surface.disabled:toneBackground(S,i),F=c?S.colors.text.disabled:toneForeground(S,i),D=useMemo(()=>{if(!a)return null;const e=(l??E)+x.bottom;switch(a){case"bottomLeft":return{position:"absolute",bottom:e,left:_};case"bottomCenter":return{position:"absolute",bottom:e,alignSelf:"center"};default:return{position:"absolute",bottom:e,right:_}}},[a,l,x.bottom,E,_]);return _jsx(Animated.View,{style:[D,{transform:[{translateY:P},{scale:j}],opacity:k},f,b],pointerEvents:u&&d?"none":"auto",children:_jsx(Pressable,{ref:t,onPress:e=>{if(c)return;const t=resolveHaptic(p,"impactLight");t&&triggerHaptic(t),n()},onPressIn:v,onPressOut:w,disabled:c,accessibilityRole:"button",accessibilityLabel:m,accessibilityHint:g,accessibilityState:{disabled:c},"aria-disabled":c,testID:y,style:[C.base,V?{height:R.diameter,paddingHorizontal:R.labelPaddingHorizontal,borderRadius:R.diameter/2,...smoothCorners}:{width:R.diameter,height:R.diameter,borderRadius:R.diameter/2,...smoothCorners},S.shadows.lg,{backgroundColor:T,opacity:c?.55:1}],children:({pressed:e})=>_jsxs(_Fragment,{children:[e&&!c?_jsx(View,{pointerEvents:"none",testID:"fab-pressed",style:[C.pressedTint,{backgroundColor:pressedTintFor(S,i),borderRadius:R.diameter/2,...smoothCorners}]}):null,z,V?_jsx(Text,{style:[C.label,{color:F,fontSize:R.fontSize,fontWeight:S.typography.fontWeight.semibold,marginLeft:S.spacing.sm},h],numberOfLines:1,children:s}):null]})})})});FloatingActionButton.displayName="FloatingActionButton";const buildStyles=e=>StyleSheet.create({base:{flexDirection:"row",alignItems:"center",justifyContent:"center",overflow:"hidden"},pressedTint:{position:"absolute",top:0,right:0,bottom:0,left:0},label:{includeFontPadding:!1}}),FloatingActionButtonGroup=e=>{const{primaryIcon:t,primaryActiveIcon:o,actions:n,open:s,defaultOpen:r=!1,onOpenChange:i,position:a="bottomRight",bottomOffset:l,size:c="md",accessibilityLabel:u="Quick actions",haptic:d,hideOnScroll:m=!1,isScrolling:g=!1,containerStyle:p,secondaryActionStyle:b,labelPillStyle:f,labelStyle:h,testID:y}=e,S=useTheme(),x=useSafeAreaInsets(),R=sizeMap[c],C=useMemo(()=>buildGroupStyles(S),[S]),j=S.components.floatingActionButton,v=j?.edgeOffset??24,w=j?.bottomOffset??24,A=j?.secondaryGap??16,_=j?.staggerMs??50,E="boolean"==typeof s,[I,P]=useState(r),k=E?s:I,z=useRef(createAnimatedValue(0)).current;useEffect(()=>{if(!m)return void setNativeValue(z,0);const e=Animated.timing(z,{toValue:g?1:0,duration:S.motion.duration.normal,easing:Easing.bezier(...S.motion.easing.standard),useNativeDriver:!0});return e.start(),()=>e.stop()},[m,g,z,S.motion.duration.normal,S.motion.easing.standard]);const V=m&&g;useEffect(()=>{V&&k&&(E||P(!1),i?.(!1))},[V,k,E,i]);const T=z.interpolate({inputRange:[0,1],outputRange:[0,R.diameter+(l??w)+x.bottom+v]}),F=z.interpolate({inputRange:[0,1],outputRange:[1,0]}),D=useRef(createAnimatedValue(k?1:0)).current,H=useRef([]),[B,L]=useState(0);useEffect(()=>{const e=H.current;if(e.length!==n.length){if(e.length<n.length){const t=e.slice();for(let o=e.length;o<n.length;o+=1)t.push(new Animated.Value(k?1:0));H.current=t}else H.current=e.slice(0,n.length);L(e=>e+1)}},[n.length]),useEffect(()=>{const e=Animated.timing(D,{toValue:k?1:0,duration:S.motion.duration.normal,easing:Easing.bezier(...S.motion.easing.standard),useNativeDriver:!0});e.start();const t=H.current.map(e=>Animated.timing(e,{toValue:k?1:0,duration:S.motion.duration.normal,easing:Easing.bezier(...S.motion.easing.standard),useNativeDriver:!0})),o=k?t:[...t].reverse(),n=Animated.stagger(_,o);return n.start(),()=>{e.stop(),n.stop()}},[k,D,S.motion.duration.normal,S.motion.easing.standard,n.length,B,_]);const N=useCallback(e=>{const t=resolveHaptic(d,"impactLight");t&&triggerHaptic(t),E||P(e),i?.(e)},[E,i,d]),O=useCallback(()=>{N(!k)},[k,N]),M=useCallback(e=>{!1!==d&&triggerHaptic("selection"),e.onPress(),E||P(!1),i?.(!1)},[E,i,d]),$=useCallback(()=>{k&&N(!1)},[k,N]),G=useMemo(()=>{const e=(l??w)+x.bottom;switch(a){case"bottomLeft":return{position:"absolute",bottom:e,left:v,alignItems:"flex-start"};case"bottomCenter":return{position:"absolute",bottom:e,alignSelf:"center",alignItems:"center"};default:return{position:"absolute",bottom:e,right:v,alignItems:"flex-end"}}},[a,l,x.bottom,w,v]),slotOffset=e=>-(R.diameter+A)*(e+1),W=useMemo(()=>{switch(a){case"bottomLeft":return{left:0,right:0,justifyContent:"flex-start"};case"bottomCenter":return{left:0,right:0,justifyContent:"center"};default:return{left:0,right:0,justifyContent:"flex-end"}}},[a]),Y=.78*R.diameter,Q=useMemo(()=>{const e=Y+S.spacing.sm;switch(a){case"bottomLeft":return{left:e,alignItems:"flex-start"};case"bottomCenter":return{right:R.diameter/2+Y/2+S.spacing.sm,alignItems:"flex-end"};default:return{right:e,alignItems:"flex-end"}}},[a,Y,R.diameter,S.spacing.sm]),U=D.interpolate({inputRange:[0,1],outputRange:[0,.4]}),q=D.interpolate({inputRange:[0,1],outputRange:["0deg","45deg"]});return _jsxs(_Fragment,{children:[k?_jsx(Animated.View,{pointerEvents:k?"auto":"none",style:[StyleSheet.absoluteFill,{backgroundColor:S.colors.background.overlay,opacity:U}],children:_jsx(Pressable,{style:StyleSheet.absoluteFill,onPress:$,accessibilityElementsHidden:!0,importantForAccessibility:"no",testID:y?`${y}-backdrop`:void 0})}):null,_jsxs(Animated.View,{pointerEvents:V?"none":"box-none",style:[G,{transform:[{translateY:T}],opacity:F},p],accessibilityRole:"menu",testID:y,children:[n.map((e,t)=>{const o=H.current[t];if(!o)return null;const n=o.interpolate({inputRange:[0,1],outputRange:[0,slotOffset(t)]}),s=o.interpolate({inputRange:[0,1],outputRange:[.6,1]}),r=toneBackground(S,e.tone??"primary"),i=toneForeground(S,e.tone??"primary"),a=e.label?_jsx(View,{pointerEvents:"none",style:[C.labelSlot,Q],testID:y?`${y}-label-${e.key}`:void 0,children:_jsx(View,{style:[C.labelPill,S.shadows.sm,{backgroundColor:S.colors.background.elevated,paddingHorizontal:S.spacing.sm,paddingVertical:S.spacing.xs,borderRadius:S.radius.sm,...smoothCorners},f],children:_jsx(Text,{style:[{color:S.colors.text.primary,fontSize:S.typography.fontSize.sm,fontWeight:S.typography.fontWeight.medium},h],numberOfLines:1,children:e.label})})}):null;return _jsxs(Animated.View,{pointerEvents:k?"auto":"none",style:[C.secondaryRow,W,{position:"absolute",bottom:0,opacity:o,transform:[{translateY:n},{scale:s}]}],children:[_jsx(Pressable,{onPress:()=>M(e),accessibilityRole:"menuitem",accessibilityLabel:e.accessibilityLabel,style:[C.fabBase,S.shadows.md,{width:Y,height:Y,borderRadius:Y/2,...smoothCorners,backgroundColor:r},b],testID:y?`${y}-action-${e.key}`:void 0,children:({pressed:t})=>_jsxs(_Fragment,{children:[t?_jsx(View,{pointerEvents:"none",testID:"fab-pressed",style:[C.pressedTint,{backgroundColor:pressedTintFor(S,e.tone??"primary"),borderRadius:Y/2,...smoothCorners}]}):null,React.isValidElement(e.icon)?e.icon:_jsx(Text,{style:{color:i},children:String(e.icon??"")})]})}),a]},e.key)}),_jsx(Pressable,{onPress:O,accessibilityRole:"button",accessibilityLabel:u,accessibilityState:{expanded:k},"aria-expanded":k,style:[C.fabBase,S.shadows.lg,{width:R.diameter,height:R.diameter,borderRadius:R.diameter/2,...smoothCorners,backgroundColor:S.colors.primary}],testID:y?`${y}-primary`:void 0,children:({pressed:e})=>_jsxs(_Fragment,{children:[e?_jsx(View,{pointerEvents:"none",testID:"fab-pressed",style:[C.pressedTint,{backgroundColor:ACCENT_PRESSED_TINT,borderRadius:R.diameter/2,...smoothCorners}]}):null,_jsx(Animated.View,{style:o?void 0:{transform:[{rotate:q}]},children:k&&o?o:t})]})})]})]})},buildGroupStyles=e=>StyleSheet.create({fabBase:{flexDirection:"row",alignItems:"center",justifyContent:"center",overflow:"hidden"},pressedTint:{position:"absolute",top:0,right:0,bottom:0,left:0},secondaryRow:{flexDirection:"row",alignItems:"center"},labelSlot:{position:"absolute",top:0,bottom:0,justifyContent:"center"},labelPill:{alignSelf:"auto"}});export{FloatingActionButton,FloatingActionButtonGroup};export default FloatingActionButton;

package/lib/module/components/ForceUpdateDialog/ForceUpdateDialog.js

@@ -1 +1 @@
-"use strict";import{Logger,VersionCheck}from"@webority/mobile-core";import React,{useCallback,useState}from"react";import{Dialog}from"../Dialog/index.js";import{jsx as _jsx}from"react/jsx-runtime";export const ForceUpdateDialog=({visible:e,onClose:t,mandatory:a=!1,updateUrl:o,title:l="Update available",message:s="A new version of the app is available. Please update to continue using the latest features and security improvements.",updateLabel:r="Update now",laterLabel:i="Later",containerStyle:n,titleStyle:c,messageStyle:p,testID:m})=>{const[u,d]=useState(!1),g=useCallback(()=>{d(!0),(async()=>{try{await VersionCheck.openUpdateUrl(o??null)}catch(e){Logger.error("[ForceUpdateDialog] Failed to open store URL",e)}finally{d(!1)}})()},[o]),b=useCallback(()=>{a||t?.()},[a,t]);return _jsx(Dialog,{visible:e,onClose:b,title:l,message:s,variant:"info",actions:a?[{label:r,onPress:g,tone:"primary",loading:u}]:[{label:i,onPress:b,tone:"neutral"},{label:r,onPress:g,tone:"primary",loading:u}],dismissOnAction:!1,containerStyle:n,titleStyle:c,messageStyle:p,testID:m})};export default ForceUpdateDialog;
+"use strict";import{Logger,VersionCheck}from"@webority/mobile-core";import{useCallback,useState}from"react";import{Dialog}from"../Dialog/index.js";import{jsx as _jsx}from"react/jsx-runtime";export const ForceUpdateDialog=({visible:e,onClose:t,mandatory:a=!1,updateUrl:o,title:l="Update available",message:s="A new version of the app is available. Please update to continue using the latest features and security improvements.",updateLabel:r="Update now",laterLabel:i="Later",containerStyle:n,titleStyle:c,messageStyle:p,testID:m})=>{const[u,d]=useState(!1),g=useCallback(()=>{d(!0),(async()=>{try{await VersionCheck.openUpdateUrl(o??null)}catch(e){Logger.error("[ForceUpdateDialog] Failed to open store URL",e)}finally{d(!1)}})()},[o]),b=useCallback(()=>{a||t?.()},[a,t]);return _jsx(Dialog,{visible:e,onClose:b,title:l,message:s,variant:"info",actions:a?[{label:r,onPress:g,tone:"primary",loading:u}]:[{label:i,onPress:b,tone:"neutral"},{label:r,onPress:g,tone:"primary",loading:u}],dismissOnAction:!1,containerStyle:n,titleStyle:c,messageStyle:p,testID:m})};export default ForceUpdateDialog;

package/lib/module/components/FormField/FormField.js

@@ -1 +1 @@
-"use strict";import React,{forwardRef,useEffect,useMemo,useRef}from"react";import{Animated,StyleSheet,Text,View}from"react-native";import{useOptionalFormContext}from"../../form/FormContext.js";import{createAnimatedValue,fontFor,useTheme}from"../../theme/index.js";import{fieldTextAsString,hasFieldText,RequiredMark}from"../FieldBase/index.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const FormField=forwardRef((e,t)=>{const{label:r,help:i,helperText:l,error:n,required:o=!1,name:s,children:a,layout:c="stacked",helperLines:u,labelStyle:d,helperStyle:m,errorStyle:x,containerStyle:f,inputContainerStyle:p,accessibilityLabel:h,testID:y}=e,F=useTheme(),S=useMemo(()=>buildStyles(F),[F]),b=useOptionalFormContext(),g=null!=s&&null!=b,T=g?b.getFieldProps(s):null,j="function"==typeof a,w=g?j?T?.error:void 0:n,R=fieldTextAsString(g?T?.error:n),k=useRef(createAnimatedValue(w?1:0)).current;useEffect(()=>{const e=Animated.timing(k,{toValue:w?1:0,duration:F.motion.duration.fast,useNativeDriver:!0});return e.start(),()=>e.stop()},[w,k,F.motion.duration.fast]);const v=useMemo(()=>{if(h)return h;const e=fieldTextAsString(r);return e?R?`${e}, error: ${R}`:e:void 0},[h,r,R]),I=hasFieldText(r),V=_jsxs(Text,{style:[S.label,"inline"!==c||hasFieldText(i)?null:S.labelInline,hasFieldText(i)?S.labelShrink:null,d],children:[r,o?_jsx(RequiredMark,{}):null]}),_=I?hasFieldText(i)?_jsxs(View,{style:[S.labelRow,"inline"===c?S.labelInline:null],children:[V,_jsx(View,{style:[S.help,{marginLeft:F.spacing.xs}],children:i})]}):V:null,A="inline"===c?S.inputInline:S.inputStacked,L=hasFieldText(w),C=!L&&hasFieldText(l),z=(()=>{if(j)return T?a(T):null;if(g&&T&&React.isValidElement(a)){const e=a,t=e.props.onChangeText,r=e.props.onBlur,i=e.props.onFocus;return React.cloneElement(e,{value:T.value,onChangeText:e=>{T.onChangeText(e),t?.(e)},onBlur:e=>{T.onBlur(),r?.(e)},onFocus:e=>{T.onFocus(),i?.(e)},error:T.error,ref:e=>b.registerField(s,e??null)})}return a})(),D=o&&!I&&React.isValidElement(z)?React.cloneElement(z,{required:!0}):z;return _jsxs(View,{ref:t,style:["inline"===c?S.rootInline:S.rootStacked,f],accessibilityLabel:v,accessibilityHint:R||void 0,testID:y,children:[_,_jsx(View,{style:[A,p],children:D}),C?_jsx(Text,{style:[S.helper,m],numberOfLines:u||void 0,children:l}):null,L?_jsx(Animated.Text,{style:[S.error,{opacity:k},x],numberOfLines:u||void 0,accessibilityLiveRegion:"polite",children:w}):null]})});FormField.displayName="FormField";const buildStyles=e=>StyleSheet.create({rootStacked:{flexDirection:"column",gap:e.spacing.xs},rootInline:{flexDirection:"row",alignItems:"center",flexWrap:"wrap",gap:e.spacing.xs},label:{fontSize:e.typography.fontSize.sm,...fontFor(e,"medium"),color:e.colors.text.secondary},labelShrink:{flexShrink:1},labelRow:{flexDirection:"row",alignItems:"center"},help:{flexShrink:0},labelInline:{width:e.components.formField?.inlineLabelWidth??"35%"},inputStacked:{width:"100%"},inputInline:{flex:1,minWidth:0},helper:{fontSize:e.typography.fontSize.sm,color:e.colors.text.tertiary},error:{fontSize:e.typography.fontSize.sm,color:e.colors.error}});export{FormField};export default FormField;
+"use strict";import React,{forwardRef,useEffect,useMemo,useRef}from"react";import{Animated,StyleSheet,Text,View}from"react-native";import{useOptionalFormContext}from"../../form/FormContext.js";import{createAnimatedValue,fontFor,useTheme}from"../../theme/index.js";import{fieldTextAsString,hasFieldText,RequiredMark}from"../FieldBase/index.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const FormField=forwardRef((e,t)=>{const{label:r,help:i,helperText:l,error:n,required:o=!1,name:s,children:a,layout:c="stacked",helperLines:u,labelStyle:d,helperStyle:m,errorStyle:x,containerStyle:f,inputContainerStyle:p,accessibilityLabel:h,testID:y}=e,F=useTheme(),S=useMemo(()=>buildStyles(F),[F]),b=useOptionalFormContext(),g=null!=s&&null!=b,T=g?b.getFieldProps(s):null,j="function"==typeof a,w=g?j?T?.error:void 0:n,R=fieldTextAsString(g?T?.error:n),k=useRef(createAnimatedValue(w?1:0)).current;useEffect(()=>{const e=Animated.timing(k,{toValue:w?1:0,duration:F.motion.duration.fast,useNativeDriver:!0});return e.start(),()=>e.stop()},[w,k,F.motion.duration.fast]);const v=useMemo(()=>{if(h)return h;const e=fieldTextAsString(r);return e?R?`${e}, error: ${R}`:e:void 0},[h,r,R]),I=hasFieldText(r),V=_jsxs(Text,{style:[S.label,"inline"!==c||hasFieldText(i)?null:S.labelInline,hasFieldText(i)?S.labelShrink:null,d],children:[r,o?_jsx(RequiredMark,{}):null]}),_=I?hasFieldText(i)?_jsxs(View,{style:[S.labelRow,"inline"===c?S.labelInline:null],children:[V,_jsx(View,{style:[S.help,{marginLeft:F.spacing.xs}],children:i})]}):V:null,A="inline"===c?S.inputInline:S.inputStacked,L=hasFieldText(w),C=!L&&hasFieldText(l),z=(()=>{if(j)return T?a(T):null;if(g&&T&&React.isValidElement(a)){const e=a,t=e.props.onChangeText,r=e.props.onBlur,i=e.props.onFocus;return React.cloneElement(e,{value:T.value,onChangeText:e=>{T.onChangeText(e),t?.(e)},onBlur:e=>{T.onBlur(),r?.(e)},onFocus:e=>{T.onFocus(),i?.(e)},error:T.error,ref:e=>b.registerField(s,e??null)})}return a})(),D=o&&!I&&React.isValidElement(z)?React.cloneElement(z,{required:!0}):z;return _jsxs(View,{ref:t,style:["inline"===c?S.rootInline:S.rootStacked,f],accessibilityLabel:v,accessibilityHint:R||void 0,testID:y,children:[_,_jsx(View,{style:[A,p],children:D}),C?_jsx(Text,{style:[S.helper,m],numberOfLines:u||void 0,children:l}):null,L?_jsx(Animated.Text,{style:[S.error,{opacity:k},x],numberOfLines:u||void 0,accessibilityLiveRegion:"polite",children:w}):null]})});FormField.displayName="FormField";const buildStyles=e=>StyleSheet.create({rootStacked:{flexDirection:"column",gap:e.spacing.xs},rootInline:{flexDirection:"row",alignItems:"center",flexWrap:"wrap",gap:e.spacing.xs},label:{fontSize:e.typography.fontSize.sm,...fontFor(e,"medium"),color:e.colors.text.secondary},labelShrink:{flexShrink:1},labelRow:{flexDirection:"row",alignItems:"center"},help:{flexShrink:0},labelInline:{width:e.components.formField?.inlineLabelWidth??"35%"},inputStacked:{width:"100%"},inputInline:{flex:1,minWidth:0},helper:{fontSize:e.typography.fontSize.sm,color:e.colors.text.tertiary},error:{fontSize:e.typography.fontSize.sm,color:e.colors.toneText.error}});export{FormField};export default FormField;

package/lib/module/components/IconButton/IconButton.js

@@ -1 +1 @@
-"use strict";import{forwardRef}from"react";import{Animated,Pressable,StyleSheet}from"react-native";import{usePressAnimation}from"../../hooks/usePressAnimation.js";import{useTheme}from"../../theme/index.js";import{resolveHaptic,triggerHaptic}from"../../utils/index.js";import{tintOf}from"../../utils/color.js";import{smoothCorners}from"../../utils/corners.js";import{renderSlotIcon}from"../AppIcon/slotIcon.js";import{Spinner}from"../Spinner/index.js";import{jsx as _jsx}from"react/jsx-runtime";const GLASS_RIM_WIDTH=1,SOFT_FILL_OPACITY=.14,SIZE_MAP={sm:{diameter:32,icon:16},md:{diameter:40,icon:20},lg:{diameter:48,icon:24}},toneFor=(e,r)=>{switch(r){case"secondary":return{base:e.colors.secondary,on:e.colors.onSecondary,fg:e.colors.secondary};case"success":return{base:e.colors.success,on:e.colors.onSuccess,fg:e.colors.success};case"warning":return{base:e.colors.warning,on:e.colors.onWarning,fg:e.colors.warning};case"error":return{base:e.colors.error,on:e.colors.onError,fg:e.colors.error};case"neutral":return{base:e.colors.background.tertiary,on:e.colors.text.primary,fg:e.colors.text.primary};default:return{base:e.colors.primary,on:e.colors.onPrimary,fg:e.colors.primary}}},IconButton=forwardRef((e,r)=>{const{icon:o,iconVariant:s,onPress:t,accessibilityLabel:n,tone:i="primary",variant:c="solid",size:a="md",shape:l="circle",active:d=!1,disabled:m=!1,loading:u=!1,haptic:b,style:p,testID:f}=e,y=useTheme(),g=SIZE_MAP[a],I=m||u,{scale:h,pressIn:S,pressOut:x}=usePressAnimation({scaleTo:.92,enabled:!I}),{base:j,on:P,fg:A}=toneFor(y,i),_=d?"solid":c;let w="transparent",C="transparent",O=0,T=I?y.colors.text.disabled:A;"solid"===_?(w=I?y.colors.surface.disabled:j,T=I?y.colors.text.disabled:P):"soft"===_?w=I?y.colors.surface.disabled:tintOf(j,.14,y.colors.background.secondary):"outline"===_?(C=I?y.colors.border.primary:j,O=y.colors.border.width):"glass"===_&&(w=y.colors.glass.fill,C=y.colors.glass.border,O=1,T=I?y.colors.text.disabled:y.colors.glass.on);const v={color:T,size:g.icon,disabled:I},B="circle"===l?g.diameter/2:y.radius.md;return _jsx(Pressable,{ref:r,onPress:e=>{if(I)return;const r=resolveHaptic(b,"selection");r&&triggerHaptic(r),t?.(e)},onPressIn:S,onPressOut:x,disabled:I,accessibilityRole:"button",accessibilityLabel:n,accessibilityState:{disabled:I,selected:d},hitSlop:6,testID:f,style:({pressed:e})=>[styles.base,{width:g.diameter,height:g.diameter,borderRadius:B,...smoothCorners,backgroundColor:w,borderColor:C,borderWidth:O,opacity:e&&"solid"!==_?.7:1},p],children:_jsx(Animated.View,{style:[styles.content,{transform:[{scale:h}]}],children:u?_jsx(Spinner,{size:"sm",color:T}):renderSlotIcon(o,v,s)})})});IconButton.displayName="IconButton";const styles=StyleSheet.create({base:{alignItems:"center",justifyContent:"center"},content:{alignItems:"center",justifyContent:"center"}});export{IconButton};export default IconButton;
+"use strict";import{forwardRef}from"react";import{Animated,Pressable,StyleSheet}from"react-native";import{usePressAnimation}from"../../hooks/usePressAnimation.js";import{useTheme}from"../../theme/index.js";import{resolveHaptic,triggerHaptic}from"../../utils/index.js";import{tintOf}from"../../utils/color.js";import{smoothCorners}from"../../utils/corners.js";import{renderSlotIcon}from"../AppIcon/slotIcon.js";import{Spinner}from"../Spinner/index.js";import{jsx as _jsx}from"react/jsx-runtime";const GLASS_RIM_WIDTH=1,SOFT_FILL_OPACITY=.14,SIZE_MAP={sm:{diameter:32,icon:16},md:{diameter:40,icon:20},lg:{diameter:48,icon:24}},toneFor=(e,r)=>{switch(r){case"secondary":return{base:e.colors.secondary,on:e.colors.onSecondary,fg:e.colors.secondary};case"success":return{base:e.colors.success,on:e.colors.onSuccess,fg:e.colors.toneText.success};case"warning":return{base:e.colors.warning,on:e.colors.onWarning,fg:e.colors.toneText.warning};case"error":return{base:e.colors.error,on:e.colors.onError,fg:e.colors.toneText.error};case"neutral":return{base:e.colors.background.tertiary,on:e.colors.text.primary,fg:e.colors.text.primary};default:return{base:e.colors.primary,on:e.colors.onPrimary,fg:e.colors.primary}}},IconButton=forwardRef((e,r)=>{const{icon:o,iconVariant:s,onPress:t,accessibilityLabel:n,tone:i="primary",variant:c="solid",size:a="md",shape:l="circle",active:d=!1,disabled:m=!1,loading:u=!1,haptic:b,style:p,testID:f}=e,y=useTheme(),g=SIZE_MAP[a],I=m||u,{scale:h,pressIn:x,pressOut:S}=usePressAnimation({scaleTo:.92,enabled:!I}),{base:j,on:P,fg:A}=toneFor(y,i),_=d?"solid":c;let w="transparent",T="transparent",C=0,O=I?y.colors.text.disabled:A;"solid"===_?(w=I?y.colors.surface.disabled:j,O=I?y.colors.text.disabled:P):"soft"===_?w=I?y.colors.surface.disabled:tintOf(j,.14,y.colors.background.secondary):"outline"===_?(T=I?y.colors.border.primary:j,C=y.colors.border.width):"glass"===_&&(w=y.colors.glass.fill,T=y.colors.glass.border,C=1,O=I?y.colors.text.disabled:y.colors.glass.on);const v={color:O,size:g.icon,disabled:I},B="circle"===l?g.diameter/2:y.radius.md;return _jsx(Pressable,{ref:r,onPress:e=>{if(I)return;const r=resolveHaptic(b,"selection");r&&triggerHaptic(r),t?.(e)},onPressIn:x,onPressOut:S,disabled:I,accessibilityRole:"button",accessibilityLabel:n,accessibilityState:{disabled:I,selected:d},"aria-disabled":I,"aria-selected":d,hitSlop:6,testID:f,style:({pressed:e})=>[styles.base,{width:g.diameter,height:g.diameter,borderRadius:B,...smoothCorners,backgroundColor:w,borderColor:T,borderWidth:C,opacity:e&&"solid"!==_?.7:1},p],children:_jsx(Animated.View,{style:[styles.content,{transform:[{scale:h}]}],children:u?_jsx(Spinner,{size:"sm",color:O}):renderSlotIcon(o,v,s)})})});IconButton.displayName="IconButton";const styles=StyleSheet.create({base:{alignItems:"center",justifyContent:"center"},content:{alignItems:"center",justifyContent:"center"}});export{IconButton};export default IconButton;

package/lib/module/components/ImageGallery/ImageGallery.js

@@ -1 +1 @@
-"use strict";import React,{useCallback,useMemo,useRef,useState}from"react";import{Dimensions,Image,Pressable,Modal as RNModal,StyleSheet,Text,View}from"react-native";import{Gesture,GestureDetector}from"react-native-gesture-handler";import Animated,{runOnJS,useAnimatedStyle,useSharedValue,withSpring,withTiming}from"react-native-reanimated";import{useTheme}from"../../theme/index.js";import{resolveHaptic,triggerHaptic}from"../../utils/index.js";import{smoothCorners}from"../../utils/corners.js";import{defaultIcons}from"../AppIcon/defaultIcons.js";import{Carousel}from"../Carousel/index.js";import{Skeleton}from"../Skeleton/index.js";import{ToastHost}from"../Toast/ToastProvider.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const MAX_SCALE_FALLBACK=4,MIN_SCALE_FALLBACK=1,DOUBLE_TAP_SCALE_FALLBACK=2,SPRING_CONFIG={damping:18,stiffness:220,mass:1},ImageGallery=({images:e,initialIndex:t=0,showThumbnails:a=!0,showCounter:l=!0,enableLightbox:i=!0,enablePinchZoom:o=!0,onIndexChange:s,haptic:n,loading:r=!1,accessibilityLabel:u,containerStyle:c,testID:h})=>{const d=useTheme(),m=useMemo(()=>buildStyles(d),[d]),[g,p]=useState(clamp(t,0,Math.max(0,e.length-1))),[b,S]=useState(!1),y=useCallback(e=>{p(e),s?.(e)},[s]),v=useCallback(()=>{if(!i)return;const e=resolveHaptic(n,"selection");e&&triggerHaptic(e),S(!0)},[i,n]),x=useCallback(()=>{const e=resolveHaptic(n,"selection");e&&triggerHaptic(e),S(!1)},[n]),I=useCallback((t,a)=>{const l=t.alt??`Image ${a+1} of ${e.length}`;return _jsx(Pressable,{onPress:v,accessibilityRole:"image",accessibilityLabel:l,accessibilityHint:i?"Tap to open fullscreen":void 0,style:m.imageWrap,children:_jsx(Image,{source:t.source,style:m.image,resizeMode:"cover"})})},[i,e.length,v,m]),w=useCallback(e=>_jsx(Image,{source:e.source,style:m.thumbnailImage,resizeMode:"cover"}),[m]),f=_jsxs(View,{style:[m.container,c],testID:h,accessibilityLabel:u??"Image gallery",children:[_jsxs(View,{style:m.carouselWrap,children:[_jsx(Carousel,{data:e,defaultIndex:t,onIndexChange:y,renderItem:I,showPagination:!1,showThumbnails:a,renderThumbnail:w,haptic:n}),l&&e.length>0?_jsx(View,{style:m.counterPill,pointerEvents:"none",children:_jsx(Text,{style:[m.counterText,{color:d.colors.onOverlay}],accessibilityLabel:`Image ${g+1} of ${e.length}`,children:`${g+1} / ${e.length}`})}):null]}),i?_jsx(Lightbox,{visible:b,images:e,initialIndex:g,enablePinchZoom:o,showCounter:l,onClose:x,onIndexChange:y,haptic:n}):null]});return r?_jsx(ImageGallerySkeleton,{images:e,showThumbnails:a,showCounter:l,containerStyle:c,testID:h}):f};ImageGallery.displayName="ImageGallery";const ImageGallerySkeleton=({images:e,showThumbnails:t=!0,showCounter:a=!0,containerStyle:l,testID:i})=>{const o=Math.min(e?.length||4,6);return _jsxs(View,{style:[{width:"100%"},l],testID:i,accessibilityRole:"progressbar",accessibilityState:{busy:!0},children:[_jsxs(View,{style:{position:"relative"},children:[_jsx(Skeleton,{width:"100%",height:280,radius:"lg"}),a?_jsx(View,{style:{position:"absolute",top:12,right:12},children:_jsx(Skeleton,{width:44,height:22,radius:"full"})}):null]}),t?_jsx(View,{style:{flexDirection:"row",marginTop:12},children:Array.from({length:o}).map((e,t)=>_jsx(Skeleton,{width:64,height:64,radius:"md",style:{marginRight:8}},`sk-thumb-${t}`))}):null]})};ImageGallerySkeleton.displayName="ImageGallerySkeleton",ImageGallery.Skeleton=ImageGallerySkeleton;const Lightbox=({visible:e,images:t,initialIndex:a,enablePinchZoom:l,showCounter:i,onClose:o,onIndexChange:s,haptic:n})=>{const r=useTheme(),u=useMemo(()=>buildLightboxStyles(r),[r]),c=r.components.imageGallery,h=c?.maxScale??4,d=c?.minScale??1,m=c?.doubleTapScale??2,g=useRef(null),[p,b]=useState(a),S=useCallback(e=>{if(e!==p){const t=resolveHaptic(n,"selection");t&&triggerHaptic(t),b(e),s(e)}},[p,s,n]),y=useCallback((e,a)=>_jsx(ZoomableImage,{image:e,index:a,total:t.length,active:a===p,enabled:l,maxScale:h,minScale:d,doubleTapScale:m,haptic:n}),[p,l,t.length,h,d,m,n]),v=t[p]?.caption;return _jsx(RNModal,{visible:e,transparent:!0,statusBarTranslucent:!0,presentationStyle:"overFullScreen",animationType:"fade",onRequestClose:o,accessibilityViewIsModal:!0,children:_jsxs(View,{style:u.backdrop,accessibilityViewIsModal:!0,children:[_jsx(Carousel,{ref:g,data:t,defaultIndex:a,onIndexChange:S,renderItem:y,showPagination:!1,haptic:n}),i&&t.length>0?_jsx(View,{style:u.counterPill,pointerEvents:"none",children:_jsx(Text,{style:[u.counterText,{color:r.colors.onOverlay}],accessibilityLabel:`Image ${p+1} of ${t.length}`,children:`${p+1} / ${t.length}`})}):null,_jsx(Pressable,{onPress:o,accessibilityRole:"button",accessibilityLabel:"Close gallery",style:u.closeButton,hitSlop:12,children:(r.icons?.close??defaultIcons.close)({size:24,color:r.colors.onOverlay})}),v?_jsx(Animated.View,{style:u.captionWrap,entering:void 0,accessibilityElementsHidden:!1,children:_jsx(Text,{style:u.captionText,numberOfLines:3,children:v})}):null,_jsx(ToastHost,{})]})})},ZoomableImage=({image:e,index:t,total:a,active:l,enabled:i,maxScale:o,minScale:s,doubleTapScale:n,haptic:r})=>{const u=Dimensions.get("window"),c=useSharedValue(1),h=useSharedValue(1),d=useSharedValue(0),m=useSharedValue(0),g=useSharedValue(0),p=useSharedValue(0),b=useCallback(()=>{c.value=withSpring(1,SPRING_CONFIG),h.value=1,d.value=withSpring(0,SPRING_CONFIG),m.value=withSpring(0,SPRING_CONFIG),g.value=0,p.value=0},[c,h,d,m,g,p]);React.useEffect(()=>{l||(c.value=withTiming(1,{duration:150}),d.value=withTiming(0,{duration:150}),m.value=withTiming(0,{duration:150}),h.value=1,g.value=0,p.value=0)},[l,c,d,m,h,g,p]);const S=useCallback(()=>{!1!==r&&triggerHaptic("impactLight")},[r]),y=useMemo(()=>Gesture.Pinch().enabled(i).onStart(()=>{"worklet";h.value=c.value}).onUpdate(e=>{"worklet";const t=h.value*e.scale;c.value=t<s?s+.3*(t-s):t>o?o+.2*(t-o):t}).onEnd(()=>{"worklet";return c.value<s?(c.value=withSpring(s,SPRING_CONFIG),d.value=withSpring(0,SPRING_CONFIG),m.value=withSpring(0,SPRING_CONFIG),h.value=s,g.value=0,void(p.value=0)):c.value>o?(c.value=withSpring(o,SPRING_CONFIG),void(h.value=o)):void(h.value=c.value)}),[i,c,h,d,m,g,p,s,o]),v=useMemo(()=>Gesture.Pan().minPointers(1).maxPointers(1).onStart(()=>{"worklet";g.value=d.value,p.value=m.value}).onUpdate(e=>{"worklet";c.value<=1||(d.value=g.value+e.translationX,m.value=p.value+e.translationY)}).onEnd(()=>{"worklet";g.value=d.value,p.value=m.value}),[c,d,m,g,p]),x=useMemo(()=>Gesture.Tap().numberOfTaps(2).onEnd(()=>{"worklet";runOnJS(S)(),c.value>1?(c.value=withSpring(1,SPRING_CONFIG),d.value=withSpring(0,SPRING_CONFIG),m.value=withSpring(0,SPRING_CONFIG),h.value=1,g.value=0,p.value=0):(c.value=withSpring(n,SPRING_CONFIG),h.value=n)}),[c,h,d,m,g,p,S,n]),I=useMemo(()=>Gesture.Race(y,v,x),[y,v,x]),w=useAnimatedStyle(()=>({transform:[{translateX:d.value},{translateY:m.value},{scale:c.value}]}));React.useEffect(()=>{l||b()},[l,b]);const f=e.alt??`Image ${t+1} of ${a}`;return _jsx(GestureDetector,{gesture:I,children:_jsx(Animated.View,{style:[lightboxImageStyles.container,{width:u.width}],children:_jsx(Animated.Image,{source:e.source,resizeMode:"contain",style:[lightboxImageStyles.image,w],accessibilityLabel:f,accessible:!0})})})},clamp=(e,t,a)=>Math.min(Math.max(e,t),a),buildStyles=e=>StyleSheet.create({container:{width:"100%"},carouselWrap:{width:"100%",position:"relative"},imageWrap:{width:"100%",aspectRatio:16/9,backgroundColor:e.colors.background.secondary,overflow:"hidden",borderRadius:e.radius.md,...smoothCorners},image:{width:"100%",height:"100%"},thumbnailImage:{width:"100%",height:"100%"},counterPill:{position:"absolute",top:12,alignSelf:"center",paddingHorizontal:12,paddingVertical:4,borderRadius:e.radius.full,...smoothCorners,backgroundColor:"rgba(0,0,0,0.55)"},counterText:{fontSize:e.typography.fontSize.sm,fontWeight:e.typography.fontWeight.semibold}}),buildLightboxStyles=e=>StyleSheet.create({backdrop:{flex:1,backgroundColor:"#000",justifyContent:"center"},counterPill:{position:"absolute",top:48,alignSelf:"center",paddingHorizontal:14,paddingVertical:6,borderRadius:e.radius.full,...smoothCorners,backgroundColor:"rgba(0,0,0,0.6)"},counterText:{fontSize:e.typography.fontSize.sm,fontWeight:e.typography.fontWeight.semibold},closeButton:{position:"absolute",top:44,right:16,width:40,height:40,borderRadius:20,...smoothCorners,alignItems:"center",justifyContent:"center",backgroundColor:"rgba(0,0,0,0.5)"},captionWrap:{position:"absolute",left:0,right:0,bottom:32,paddingHorizontal:24},captionText:{color:"#FFFFFF",fontSize:14,lineHeight:20,textAlign:"center"}}),lightboxImageStyles=StyleSheet.create({container:{flex:1,alignItems:"center",justifyContent:"center"},image:{width:"100%",height:"100%"}});export{ImageGallery};export default ImageGallery;
+"use strict";import React,{useCallback,useMemo,useRef,useState}from"react";import{Dimensions,Image,Pressable,Modal as RNModal,StyleSheet,Text,View}from"react-native";import{Gesture,GestureDetector}from"react-native-gesture-handler";import Animated,{runOnJS,useAnimatedStyle,useSharedValue,withSpring,withTiming}from"react-native-reanimated";import{useTheme}from"../../theme/index.js";import{resolveHaptic,triggerHaptic}from"../../utils/index.js";import{smoothCorners}from"../../utils/corners.js";import{defaultIcons}from"../AppIcon/defaultIcons.js";import{Carousel}from"../Carousel/index.js";import{Skeleton}from"../Skeleton/index.js";import{ToastHost}from"../Toast/ToastProvider.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const MAX_SCALE_FALLBACK=4,MIN_SCALE_FALLBACK=1,DOUBLE_TAP_SCALE_FALLBACK=2,SPRING_CONFIG={damping:18,stiffness:220,mass:1},ImageGallery=({images:e,initialIndex:t=0,showThumbnails:a=!0,showCounter:l=!0,enableLightbox:i=!0,enablePinchZoom:o=!0,onIndexChange:s,haptic:n,loading:r=!1,accessibilityLabel:u,containerStyle:c,testID:h})=>{const d=useTheme(),m=useMemo(()=>buildStyles(d),[d]),[g,p]=useState(clamp(t,0,Math.max(0,e.length-1))),[b,S]=useState(!1),y=useCallback(e=>{p(e),s?.(e)},[s]),v=useCallback(()=>{if(!i)return;const e=resolveHaptic(n,"selection");e&&triggerHaptic(e),S(!0)},[i,n]),x=useCallback(()=>{const e=resolveHaptic(n,"selection");e&&triggerHaptic(e),S(!1)},[n]),I=useCallback((t,a)=>{const l=t.alt??`Image ${a+1} of ${e.length}`;return _jsx(Pressable,{onPress:v,accessibilityRole:"image",accessibilityLabel:l,accessibilityHint:i?"Tap to open fullscreen":void 0,style:m.imageWrap,children:_jsx(Image,{source:t.source,style:m.image,resizeMode:"cover"})})},[i,e.length,v,m]),w=useCallback(e=>_jsx(Image,{source:e.source,style:m.thumbnailImage,resizeMode:"cover"}),[m]),f=_jsxs(View,{style:[m.container,c],testID:h,accessibilityLabel:u??"Image gallery",children:[_jsxs(View,{style:m.carouselWrap,children:[_jsx(Carousel,{data:e,defaultIndex:t,onIndexChange:y,renderItem:I,showPagination:!1,showThumbnails:a,renderThumbnail:w,haptic:n}),l&&e.length>0?_jsx(View,{style:m.counterPill,pointerEvents:"none",children:_jsx(Text,{style:[m.counterText,{color:d.colors.onOverlay}],accessibilityLabel:`Image ${g+1} of ${e.length}`,children:`${g+1} / ${e.length}`})}):null]}),i?_jsx(Lightbox,{visible:b,images:e,initialIndex:g,enablePinchZoom:o,showCounter:l,onClose:x,onIndexChange:y,haptic:n}):null]});return r?_jsx(ImageGallerySkeleton,{images:e,showThumbnails:a,showCounter:l,containerStyle:c,testID:h}):f};ImageGallery.displayName="ImageGallery";const ImageGallerySkeleton=({images:e,showThumbnails:t=!0,showCounter:a=!0,containerStyle:l,testID:i})=>{const o=Math.min(e?.length||4,6);return _jsxs(View,{style:[{width:"100%"},l],testID:i,accessibilityRole:"progressbar",accessibilityState:{busy:!0},"aria-busy":!0,children:[_jsxs(View,{style:{position:"relative"},children:[_jsx(Skeleton,{width:"100%",height:280,radius:"lg"}),a?_jsx(View,{style:{position:"absolute",top:12,right:12},children:_jsx(Skeleton,{width:44,height:22,radius:"full"})}):null]}),t?_jsx(View,{style:{flexDirection:"row",marginTop:12},children:Array.from({length:o}).map((e,t)=>_jsx(Skeleton,{width:64,height:64,radius:"md",style:{marginRight:8}},`sk-thumb-${t}`))}):null]})};ImageGallerySkeleton.displayName="ImageGallerySkeleton",ImageGallery.Skeleton=ImageGallerySkeleton;const Lightbox=({visible:e,images:t,initialIndex:a,enablePinchZoom:l,showCounter:i,onClose:o,onIndexChange:s,haptic:n})=>{const r=useTheme(),u=useMemo(()=>buildLightboxStyles(r),[r]),c=r.components.imageGallery,h=c?.maxScale??4,d=c?.minScale??1,m=c?.doubleTapScale??2,g=useRef(null),[p,b]=useState(a),S=useCallback(e=>{if(e!==p){const t=resolveHaptic(n,"selection");t&&triggerHaptic(t),b(e),s(e)}},[p,s,n]),y=useCallback((e,a)=>_jsx(ZoomableImage,{image:e,index:a,total:t.length,active:a===p,enabled:l,maxScale:h,minScale:d,doubleTapScale:m,haptic:n}),[p,l,t.length,h,d,m,n]),v=t[p]?.caption;return _jsx(RNModal,{visible:e,transparent:!0,statusBarTranslucent:!0,presentationStyle:"overFullScreen",animationType:"fade",onRequestClose:o,accessibilityViewIsModal:!0,children:_jsxs(View,{style:u.backdrop,accessibilityViewIsModal:!0,children:[_jsx(Carousel,{ref:g,data:t,defaultIndex:a,onIndexChange:S,renderItem:y,showPagination:!1,haptic:n}),i&&t.length>0?_jsx(View,{style:u.counterPill,pointerEvents:"none",children:_jsx(Text,{style:[u.counterText,{color:r.colors.onOverlay}],accessibilityLabel:`Image ${p+1} of ${t.length}`,children:`${p+1} / ${t.length}`})}):null,_jsx(Pressable,{onPress:o,accessibilityRole:"button",accessibilityLabel:"Close gallery",style:u.closeButton,hitSlop:12,children:(r.icons?.close??defaultIcons.close)({size:24,color:r.colors.onOverlay})}),v?_jsx(Animated.View,{style:u.captionWrap,entering:void 0,accessibilityElementsHidden:!1,children:_jsx(Text,{style:u.captionText,numberOfLines:3,children:v})}):null,_jsx(ToastHost,{})]})})},ZoomableImage=({image:e,index:t,total:a,active:l,enabled:i,maxScale:o,minScale:s,doubleTapScale:n,haptic:r})=>{const u=Dimensions.get("window"),c=useSharedValue(1),h=useSharedValue(1),d=useSharedValue(0),m=useSharedValue(0),g=useSharedValue(0),p=useSharedValue(0),b=useCallback(()=>{c.value=withSpring(1,SPRING_CONFIG),h.value=1,d.value=withSpring(0,SPRING_CONFIG),m.value=withSpring(0,SPRING_CONFIG),g.value=0,p.value=0},[c,h,d,m,g,p]);React.useEffect(()=>{l||(c.value=withTiming(1,{duration:150}),d.value=withTiming(0,{duration:150}),m.value=withTiming(0,{duration:150}),h.value=1,g.value=0,p.value=0)},[l,c,d,m,h,g,p]);const S=useCallback(()=>{!1!==r&&triggerHaptic("impactLight")},[r]),y=useMemo(()=>Gesture.Pinch().enabled(i).onStart(()=>{"worklet";h.value=c.value}).onUpdate(e=>{"worklet";const t=h.value*e.scale;c.value=t<s?s+.3*(t-s):t>o?o+.2*(t-o):t}).onEnd(()=>{"worklet";return c.value<s?(c.value=withSpring(s,SPRING_CONFIG),d.value=withSpring(0,SPRING_CONFIG),m.value=withSpring(0,SPRING_CONFIG),h.value=s,g.value=0,void(p.value=0)):c.value>o?(c.value=withSpring(o,SPRING_CONFIG),void(h.value=o)):void(h.value=c.value)}),[i,c,h,d,m,g,p,s,o]),v=useMemo(()=>Gesture.Pan().minPointers(1).maxPointers(1).onStart(()=>{"worklet";g.value=d.value,p.value=m.value}).onUpdate(e=>{"worklet";c.value<=1||(d.value=g.value+e.translationX,m.value=p.value+e.translationY)}).onEnd(()=>{"worklet";g.value=d.value,p.value=m.value}),[c,d,m,g,p]),x=useMemo(()=>Gesture.Tap().numberOfTaps(2).onEnd(()=>{"worklet";runOnJS(S)(),c.value>1?(c.value=withSpring(1,SPRING_CONFIG),d.value=withSpring(0,SPRING_CONFIG),m.value=withSpring(0,SPRING_CONFIG),h.value=1,g.value=0,p.value=0):(c.value=withSpring(n,SPRING_CONFIG),h.value=n)}),[c,h,d,m,g,p,S,n]),I=useMemo(()=>Gesture.Race(y,v,x),[y,v,x]),w=useAnimatedStyle(()=>({transform:[{translateX:d.value},{translateY:m.value},{scale:c.value}]}));React.useEffect(()=>{l||b()},[l,b]);const f=e.alt??`Image ${t+1} of ${a}`;return _jsx(GestureDetector,{gesture:I,children:_jsx(Animated.View,{style:[lightboxImageStyles.container,{width:u.width}],children:_jsx(Animated.Image,{source:e.source,resizeMode:"contain",style:[lightboxImageStyles.image,w],accessibilityLabel:f,accessible:!0})})})},clamp=(e,t,a)=>Math.min(Math.max(e,t),a),buildStyles=e=>StyleSheet.create({container:{width:"100%"},carouselWrap:{width:"100%",position:"relative"},imageWrap:{width:"100%",aspectRatio:16/9,backgroundColor:e.colors.background.secondary,overflow:"hidden",borderRadius:e.radius.md,...smoothCorners},image:{width:"100%",height:"100%"},thumbnailImage:{width:"100%",height:"100%"},counterPill:{position:"absolute",top:12,alignSelf:"center",paddingHorizontal:12,paddingVertical:4,borderRadius:e.radius.full,...smoothCorners,backgroundColor:"rgba(0,0,0,0.55)"},counterText:{fontSize:e.typography.fontSize.sm,fontWeight:e.typography.fontWeight.semibold}}),buildLightboxStyles=e=>StyleSheet.create({backdrop:{flex:1,backgroundColor:"#000",justifyContent:"center"},counterPill:{position:"absolute",top:48,alignSelf:"center",paddingHorizontal:14,paddingVertical:6,borderRadius:e.radius.full,...smoothCorners,backgroundColor:"rgba(0,0,0,0.6)"},counterText:{fontSize:e.typography.fontSize.sm,fontWeight:e.typography.fontWeight.semibold},closeButton:{position:"absolute",top:44,right:16,width:40,height:40,borderRadius:20,...smoothCorners,alignItems:"center",justifyContent:"center",backgroundColor:"rgba(0,0,0,0.5)"},captionWrap:{position:"absolute",left:0,right:0,bottom:32,paddingHorizontal:24},captionText:{color:"#FFFFFF",fontSize:14,lineHeight:20,textAlign:"center"}}),lightboxImageStyles=StyleSheet.create({container:{flex:1,alignItems:"center",justifyContent:"center"},image:{width:"100%",height:"100%"}});export{ImageGallery};export default ImageGallery;

package/lib/module/components/InlineSelect/InlineSelect.js

@@ -1 +1 @@
-"use strict";import React,{forwardRef,useCallback,useMemo,useState}from"react";import{Pressable,StyleSheet,Text,View}from"react-native";import{fontFor,useTheme}from"../../theme/index.js";import{resolveHaptic,triggerHaptic}from"../../utils/index.js";import{Chevron}from"../FieldBase/Chevron.js";import{FieldLabel,resolveFieldSize}from"../FieldBase/FieldBase.js";import{OptionSheet}from"../OptionSheet/OptionSheet.js";import{jsx as _jsx,jsxs as _jsxs,Fragment as _Fragment}from"react/jsx-runtime";const InlineSelect=forwardRef((e,t)=>{const{options:l,getOptionLabel:i,getOptionValue:s,getOptionDisabled:o,getOptionDescription:n,getOptionIcon:r,value:a,onChange:c,placeholder:d,label:p,title:b,searchable:S=!1,haptic:u,disabled:m=!1,size:x="md",color:f,chevronColor:g,chevronSize:h,textStyle:y,style:O,optionStyle:j,selectedOptionStyle:C,optionTextStyle:v,selectedOptionTextStyle:F,accessibilityLabel:_,testID:k}=e,I=useTheme(),T=useMemo(()=>buildStyles(I),[I]),z=resolveFieldSize(I,x),L=useCallback(e=>i?i(e):e.label??"",[i]),H=useCallback(e=>s?s(e):e.value,[s]),w=useCallback(e=>o?o(e):!0===e.disabled,[o]),D=useCallback(e=>n?n(e):e.description,[n]),P=useCallback(e=>r?r(e):e.icon,[r]),[R,V]=useState(!1),B=useMemo(()=>{if(null!=a)return l.find(e=>H(e)===a)},[l,a,H]),M=useCallback(e=>a===e,[a]),$=useCallback(()=>{if(m)return;const e=resolveHaptic(u,"selection");e&&triggerHaptic(e),V(!0)},[m,u]),N=useCallback(()=>{V(!1)},[]),G=useCallback(e=>{if(w(e))return;const t=resolveHaptic(u,"selection");t&&triggerHaptic(t),c(H(e)),N()},[w,H,c,N,u]),q=m?I.colors.text.disabled:f??I.components.inlineSelect?.color??I.colors.primary,A=void 0!==B?L(B):d??"Select",E=void 0!==B?`Selected: ${L(B)}`:d??"No selection",J=_jsxs(Pressable,{ref:t,onPress:$,disabled:m,hitSlop:8,accessibilityRole:"button",accessibilityLabel:_??`${p??b??"Select"}. ${E}`,accessibilityState:{disabled:m,expanded:R},testID:k,style:({pressed:e})=>[T.trigger,{columnGap:I.spacing.xs,opacity:e&&!m?.6:1},O],children:[_jsx(Text,{style:[T.triggerText,{color:q,fontSize:z.fontSize,...fontFor(I,"medium")},y],numberOfLines:1,children:A}),_jsx(Chevron,{color:g??q,size:h??z.iconSize,open:R})]});return _jsxs(_Fragment,{children:[p?_jsxs(View,{style:T.labelled,children:[_jsx(FieldLabel,{size:x,children:p}),J]}):J,_jsx(OptionSheet,{open:R,onClose:N,title:b,accessibilityLabel:p??b??d??"Options",options:l,labelOf:L,getValue:H,disabledOf:w,descriptionOf:D,iconOf:P,isSelected:M,onSelect:G,searchable:S,optionStyle:j,selectedOptionStyle:C,optionTextStyle:v,selectedOptionTextStyle:F})]})});InlineSelect.displayName="InlineSelect";const buildStyles=e=>StyleSheet.create({labelled:{alignItems:"flex-start"},trigger:{flexDirection:"row",alignItems:"center"},triggerText:{includeFontPadding:!1}});export{InlineSelect};export default InlineSelect;
+"use strict";import{forwardRef,useCallback,useMemo,useState}from"react";import{Pressable,StyleSheet,Text,View}from"react-native";import{fontFor,useTheme}from"../../theme/index.js";import{resolveHaptic,triggerHaptic}from"../../utils/index.js";import{Chevron}from"../FieldBase/Chevron.js";import{FieldLabel,resolveFieldSize}from"../FieldBase/FieldBase.js";import{OptionSheet}from"../OptionSheet/OptionSheet.js";import{jsx as _jsx,jsxs as _jsxs,Fragment as _Fragment}from"react/jsx-runtime";const InlineSelect=forwardRef((e,t)=>{const{options:l,getOptionLabel:i,getOptionValue:s,getOptionDisabled:o,getOptionDescription:a,getOptionIcon:n,value:r,onChange:c,placeholder:d,label:p,title:b,searchable:S=!1,haptic:u,disabled:m=!1,size:x="md",color:f,chevronColor:g,chevronSize:h,textStyle:y,style:O,optionStyle:j,selectedOptionStyle:C,optionTextStyle:v,selectedOptionTextStyle:F,accessibilityLabel:_,testID:k}=e,I=useTheme(),T=useMemo(()=>buildStyles(I),[I]),z=resolveFieldSize(I,x),L=useCallback(e=>i?i(e):e.label??"",[i]),H=useCallback(e=>s?s(e):e.value,[s]),w=useCallback(e=>o?o(e):!0===e.disabled,[o]),D=useCallback(e=>a?a(e):e.description,[a]),P=useCallback(e=>n?n(e):e.icon,[n]),[V,B]=useState(!1),M=useMemo(()=>{if(null!=r)return l.find(e=>H(e)===r)},[l,r,H]),R=useCallback(e=>r===e,[r]),$=useCallback(()=>{if(m)return;const e=resolveHaptic(u,"selection");e&&triggerHaptic(e),B(!0)},[m,u]),N=useCallback(()=>{B(!1)},[]),G=useCallback(e=>{if(w(e))return;const t=resolveHaptic(u,"selection");t&&triggerHaptic(t),c(H(e)),N()},[w,H,c,N,u]),q=m?I.colors.text.disabled:f??I.components.inlineSelect?.color??I.colors.primary,A=void 0!==M?L(M):d??"Select",E=void 0!==M?`Selected: ${L(M)}`:d??"No selection",J=_jsxs(Pressable,{ref:t,onPress:$,disabled:m,hitSlop:8,accessibilityRole:"button",accessibilityLabel:_??`${p??b??"Select"}. ${E}`,accessibilityState:{disabled:m,expanded:V},"aria-disabled":m,"aria-expanded":V,testID:k,style:({pressed:e})=>[T.trigger,{columnGap:I.spacing.xs,opacity:e&&!m?.6:1},O],children:[_jsx(Text,{style:[T.triggerText,{color:q,fontSize:z.fontSize,...fontFor(I,"medium")},y],numberOfLines:1,children:A}),_jsx(Chevron,{color:g??q,size:h??z.iconSize,open:V})]});return _jsxs(_Fragment,{children:[p?_jsxs(View,{style:T.labelled,children:[_jsx(FieldLabel,{size:x,children:p}),J]}):J,_jsx(OptionSheet,{open:V,onClose:N,title:b,accessibilityLabel:p??b??d??"Options",options:l,labelOf:L,getValue:H,disabledOf:w,descriptionOf:D,iconOf:P,isSelected:R,onSelect:G,searchable:S,optionStyle:j,selectedOptionStyle:C,optionTextStyle:v,selectedOptionTextStyle:F})]})});InlineSelect.displayName="InlineSelect";const buildStyles=e=>StyleSheet.create({labelled:{alignItems:"flex-start"},trigger:{flexDirection:"row",alignItems:"center"},triggerText:{includeFontPadding:!1}});export{InlineSelect};export default InlineSelect;

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

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

package/lib/module/components/KeyboardToolbar/KeyboardToolbar.js

@@ -1 +1 @@
-"use strict";import{Pressable,StyleSheet,View}from"react-native";import{KeyboardController,KeyboardStickyView,useKeyboardState}from"react-native-keyboard-controller";import{useOptionalFormContext}from"../../form/FormContext.js";import{useTheme}from"../../theme/index.js";import{Text}from"../Text/index.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const NavButton=({label:e,accessibilityLabel:o,onPress:t,theme:s})=>_jsx(Pressable,{onPress:t,accessibilityRole:"button",accessibilityLabel:o,hitSlop:8,style:{paddingHorizontal:s.spacing.sm},children:_jsx(Text,{variant:"h2",color:"link",children:e})}),KeyboardToolbar=e=>{const{doneLabel:o="Done",showNavigation:t=!0,onDone:s,onNext:r,onPrev:i,leading:l,style:a,testID:n}=e,c=useTheme(),b=useOptionalFormContext();if(!useKeyboardState(e=>e.isVisible))return null;const d=s??(()=>{KeyboardController.dismiss()}),y=i??b?.focusPrev??(()=>KeyboardController.setFocusTo("prev")),x=r??b?.focusNext??(()=>KeyboardController.setFocusTo("next"));return _jsx(KeyboardStickyView,{style:styles.anchor,children:_jsxs(View,{testID:n,accessibilityRole:"toolbar",style:[styles.bar,{backgroundColor:c.colors.background.elevated,borderTopColor:c.colors.border.primary,paddingHorizontal:c.spacing.md},a],children:[t?_jsxs(View,{style:styles.nav,children:[_jsx(NavButton,{label:"‹",accessibilityLabel:"Previous field",onPress:y,theme:c}),_jsx(NavButton,{label:"›",accessibilityLabel:"Next field",onPress:x,theme:c})]}):_jsx(View,{}),l,_jsx(View,{style:styles.spacer}),_jsx(Pressable,{onPress:d,accessibilityRole:"button",accessibilityLabel:o,hitSlop:8,children:_jsx(Text,{variant:"body",weight:"semibold",color:"link",children:o})})]})})},styles=StyleSheet.create({anchor:{position:"absolute",left:0,right:0,bottom:0},bar:{height:44,flexDirection:"row",alignItems:"center",borderTopWidth:StyleSheet.hairlineWidth},nav:{flexDirection:"row",alignItems:"center"},spacer:{flex:1}});export{KeyboardToolbar};export default KeyboardToolbar;
+"use strict";import{Pressable,StyleSheet,View}from"react-native";import{KeyboardController,KeyboardStickyView,useKeyboardState}from"react-native-keyboard-controller";import{useOptionalFormContext}from"../../form/FormContext.js";import{useTheme}from"../../theme/index.js";import{Text}from"../Text/index.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const NavButton=({label:e,accessibilityLabel:o,onPress:t,theme:s})=>_jsx(Pressable,{onPress:t,accessibilityRole:"button",accessibilityLabel:o,hitSlop:8,style:{paddingHorizontal:s.spacing.sm},children:_jsx(Text,{variant:"body",weight:"semibold",size:"lg",color:"link",children:e})}),KeyboardToolbar=e=>{const{doneLabel:o="Done",showNavigation:t=!0,onDone:s,onNext:r,onPrev:i,leading:l,style:a,testID:n}=e,c=useTheme(),b=useOptionalFormContext();if(!useKeyboardState(e=>e.isVisible))return null;const d=s??(()=>{KeyboardController.dismiss()}),y=i??b?.focusPrev??(()=>KeyboardController.setFocusTo("prev")),x=r??b?.focusNext??(()=>KeyboardController.setFocusTo("next"));return _jsx(KeyboardStickyView,{style:styles.anchor,children:_jsxs(View,{testID:n,accessibilityRole:"toolbar",style:[styles.bar,{backgroundColor:c.colors.background.elevated,borderTopColor:c.colors.border.primary,paddingHorizontal:c.spacing.md},a],children:[t?_jsxs(View,{style:styles.nav,children:[_jsx(NavButton,{label:"‹",accessibilityLabel:"Previous field",onPress:y,theme:c}),_jsx(NavButton,{label:"›",accessibilityLabel:"Next field",onPress:x,theme:c})]}):_jsx(View,{}),l,_jsx(View,{style:styles.spacer}),_jsx(Pressable,{onPress:d,accessibilityRole:"button",accessibilityLabel:o,hitSlop:8,children:_jsx(Text,{variant:"body",weight:"semibold",color:"link",children:o})})]})})},styles=StyleSheet.create({anchor:{position:"absolute",left:0,right:0,bottom:0},bar:{height:44,flexDirection:"row",alignItems:"center",borderTopWidth:StyleSheet.hairlineWidth},nav:{flexDirection:"row",alignItems:"center"},spacer:{flex:1}});export{KeyboardToolbar};export default KeyboardToolbar;