@webority/mobile-ui 0.88.0 → 0.89.0

package/lib/module/components/NumberInput/NumberInput.js

@@ -1 +1 @@
-"use strict";import React,{forwardRef,useCallback,useEffect,useMemo,useRef,useState}from"react";import{Pressable,StyleSheet,Text,TextInput,View}from"react-native";import{useControllableState}from"../../hooks/index.js";import{resolveFieldSize,useTheme}from"../../theme/index.js";import{resolveHaptic,triggerHaptic}from"../../utils/index.js";import{smoothCorners}from"../../utils/corners.js";import{FieldBase,FieldLabel,FieldMessage,fieldTextAsString,hasFieldText,resolveFieldTextStyle}from"../FieldBase/FieldBase.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const DEFAULT_LONG_PRESS_DELAY=500,DEFAULT_LONG_PRESS_INTERVAL=80,roundToPrecision=(e,t)=>{if(!Number.isFinite(e))return 0;if(t<=0)return Math.round(e);const i=10**t;return Math.round(e*i)/i},clamp=(e,t,i)=>e<t?t:e>i?i:e,formatValue=(e,t,i)=>Number.isFinite(e)?t&&i>0?e.toFixed(i):String(Math.trunc(e)):"",sanitizeTyped=(e,t)=>{if(!e)return"";let i=e.replace(/[^0-9.-]/g,"");if(i=i.replace(/(?!^)-/g,""),t){const e=i.indexOf(".");-1!==e&&(i=i.slice(0,e+1)+i.slice(e+1).replace(/\./g,""))}else i=i.replace(/\./g,"");return i},NumberInput=forwardRef((e,t)=>{const{value:i,defaultValue:s,onChange:l,min:r=Number.NEGATIVE_INFINITY,max:n=Number.POSITIVE_INFINITY,step:a=1,allowDecimal:o=!1,precision:c=0,label:u,help:d,helperText:b,error:m,disabled:p=!1,size:f="md",variant:x="inline",unit:g,haptic:h,accessibilityLabel:y,style:S,containerStyle:T,inputStyle:I,buttonStyle:F,unitStyle:N,labelStyle:j,textInputProps:C,testID:v}=e,[_,P]=useControllableState({value:i,defaultValue:s??e.min??0,onChange:l}),R=useTheme(),w=resolveFieldSize(R,f),z=resolveFieldTextStyle(R,{disabled:p}),L=useMemo(()=>buildStyles(R),[R]),V=R.components.numberInput?.longPressDelayMs??500,k=R.components.numberInput?.longPressIntervalMs??80,E=useRef(null),[D,A]=useState(formatValue(_,o,c)),[M,H]=useState(!1),[B,O]=useState(!1),W=useCallback(()=>{p||E.current?.focus()},[p]),G=useRef(null),Y=useRef(null),U=useCallback(()=>{null!==G.current&&(clearTimeout(G.current),G.current=null),null!==Y.current&&(clearInterval(Y.current),Y.current=null)},[]);useEffect(()=>U,[U]),useEffect(()=>{M||A(formatValue(_,o,c))},[_,o,c,M]);const $=_<=r,q=_>=n,J=!p,K=useCallback(e=>{const t=roundToPrecision(e,o?c:0),i=clamp(t,r,n);i!==_&&P(i)},[o,n,r,P,c,_]),Q=useCallback(()=>{if(!J||$)return;const e=resolveHaptic(h,"selection");e&&triggerHaptic(e),K(_-a)},[$,J,h,K,a,_]),X=useCallback(()=>{if(!J||q)return;const e=resolveHaptic(h,"selection");e&&triggerHaptic(e),K(_+a)},[q,J,h,K,a,_]);React.useImperativeHandle(t,()=>({focus:()=>E.current?.focus(),blur:()=>E.current?.blur(),clear:()=>{A(""),Number.isFinite(r)&&r>0?P(r):P(0<r?r:0>n?n:0)}}),[n,r,P]);const Z=useCallback(e=>{J&&(U(),G.current=setTimeout(()=>{Y.current=setInterval(()=>{"inc"===e?X():Q()},k)},V))},[U,Q,X,J,V,k]),ee=useCallback(e=>{const t=sanitizeTyped(e,o);A(t);const i=Number(t);""!==t&&"-"!==t&&"."!==t&&Number.isFinite(i)&&i>=r&&i<=n&&i!==_&&P(roundToPrecision(i,o?c:0))},[o,n,r,P,c,_]),te=useCallback(()=>{H(!1),O(!1);const e=Number(D);if(""===D||!Number.isFinite(e))return void A(formatValue(_,o,c));const t=roundToPrecision(e,o?c:0),i=clamp(t,r,n);i!==_&&P(i),A(formatValue(i,o,c))},[o,D,n,r,P,c,_]),ie=useCallback(()=>{H(!0),O(!0)},[]),se=$||p?R.colors.text.disabled:R.colors.text.primary,le=q||p?R.colors.text.disabled:R.colors.text.primary,re=w.icon+8,renderStepper=(e,t,i,s,l,r)=>_jsx(Pressable,{onPress:t,onLongPress:()=>Z(e),onPressOut:U,delayLongPress:V,disabled:i,accessibilityRole:"button",accessibilityLabel:s,accessibilityState:{disabled:i},"aria-disabled":i,style:({pressed:e})=>[{width:re,height:re,alignItems:"center",justifyContent:"center",borderRadius:R.radius.pill,...smoothCorners},e&&!i?{backgroundColor:R.colors.surface.pressed}:null,F],testID:`${v??"numberinput"}-${"inc"===e?"plus":"minus"}`,children:_jsx(Text,{style:{fontSize:w.icon,color:l,fontWeight:R.typography.fontWeight.semibold,lineHeight:w.icon+2},children:r})}),ne=y??fieldTextAsString(u)??"Number input",ae=!0===m||hasFieldText(m),oe=_jsx(FieldBase,{size:f,disabled:p,error:ae,filled:!0,focused:B,onPress:W,pressFeedback:!1,leading:renderStepper("dec",Q,$||p,"Decrease",se,"−"),trailing:renderStepper("inc",X,q||p,"Increase",le,"+"),children:_jsxs(View,{style:L.inputRow,children:[_jsx(TextInput,{ref:E,value:D,onChangeText:ee,onFocus:ie,onBlur:te,editable:!p,keyboardType:o?"decimal-pad":"number-pad",selectTextOnFocus:!0,accessibilityRole:"adjustable",accessibilityLabel:ne,accessibilityValue:{now:Number.isFinite(_)?_:0},accessibilityState:{disabled:p},"aria-disabled":p,accessibilityActions:[{name:"increment",label:"Increase"},{name:"decrement",label:"Decrease"}],onAccessibilityAction:e=>{"increment"===e.nativeEvent.actionName&&X(),"decrement"===e.nativeEvent.actionName&&Q()},style:[L.input,{fontSize:w.text,color:z.color,...z.weightStyle},I],...C}),g?_jsx(Text,{style:[L.unit,{fontSize:w.text,color:z.placeholderColor},N],children:g}):null]})}),ce=hasFieldText(u)?_jsx(FieldLabel,{size:f,help:d,style:j,children:u}):null,ue=_jsx(FieldMessage,{size:f,error:ae,text:ae?m:b});return _jsxs(View,"horizontal"===x?{style:[L.horizontalContainer,S,T],testID:v,accessibilityState:{disabled:p},"aria-disabled":p,children:[_jsx(View,{style:L.horizontalLabelWrap,children:ce}),_jsxs(View,{children:[oe,ue]})]}:{style:[S,T],testID:v,accessibilityState:{disabled:p},"aria-disabled":p,children:[ce,oe,ue]})});NumberInput.displayName="NumberInput";const buildStyles=e=>StyleSheet.create({inputRow:{flex:1,flexDirection:"row",alignItems:"center",justifyContent:"center"},input:{flex:1,textAlign:"center",padding:e.spacing.none,margin:e.spacing.none,includeFontPadding:!1},unit:{marginLeft:e.spacing.xs},label:{marginBottom:e.spacing.xs},helper:{marginTop:e.spacing.xs},horizontalContainer:{flexDirection:"row",alignItems:"center",justifyContent:"space-between"},horizontalLabelWrap:{flexShrink:1,paddingRight:e.spacing.md}});export{NumberInput};export default NumberInput;
+"use strict";import React,{forwardRef,useCallback,useEffect,useMemo,useRef,useState}from"react";import{Pressable,StyleSheet,Text,TextInput,View}from"react-native";import{useControllableState}from"../../hooks/index.js";import{resolveFieldSize,useTheme}from"../../theme/index.js";import{resolveHaptic,triggerHaptic}from"../../utils/index.js";import{smoothCorners}from"../../utils/corners.js";import{FieldBase,FieldLabel,FieldMessage,fieldTextAsString,hasFieldText,resolveFieldTextStyle}from"../FieldBase/FieldBase.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const DEFAULT_LONG_PRESS_DELAY=500,DEFAULT_LONG_PRESS_INTERVAL=80,roundToPrecision=(e,t)=>{if(!Number.isFinite(e))return 0;if(t<=0)return Math.round(e);const i=10**t;return Math.round(e*i)/i},clamp=(e,t,i)=>e<t?t:e>i?i:e,formatValue=(e,t,i)=>Number.isFinite(e)?t&&i>0?e.toFixed(i):String(Math.trunc(e)):"",sanitizeTyped=(e,t)=>{if(!e)return"";let i=e.replace(/[^0-9.-]/g,"");if(i=i.replace(/(?!^)-/g,""),t){const e=i.indexOf(".");-1!==e&&(i=i.slice(0,e+1)+i.slice(e+1).replace(/\./g,""))}else i=i.replace(/\./g,"");return i},NumberInput=forwardRef((e,t)=>{const{value:i,defaultValue:s,onChange:l,min:r=Number.NEGATIVE_INFINITY,max:n=Number.POSITIVE_INFINITY,step:a=1,allowDecimal:o=!1,precision:c=0,label:u,help:d,helperText:b,error:m,disabled:p=!1,size:f="md",variant:x="inline",unit:h,haptic:y,accessibilityLabel:g,style:S,containerStyle:T,inputStyle:F,buttonStyle:I,unitStyle:N,labelStyle:j,textInputProps:C,testID:_}=e,[v,w]=useControllableState({value:i,defaultValue:s??e.min??0,onChange:l}),R=useTheme(),z=resolveFieldSize(R,f),L=resolveFieldTextStyle(R,{disabled:p}),P=useMemo(()=>buildStyles(R),[R]),V=useRef(null),[k,E]=useState(formatValue(v,o,c)),[D,A]=useState(!1),[H,M]=useState(!1),B=useCallback(()=>{p||V.current?.focus()},[p]),O=useRef(null),G=useRef(null),W=useCallback(()=>{null!==O.current&&(clearTimeout(O.current),O.current=null),null!==G.current&&(clearInterval(G.current),G.current=null)},[]);useEffect(()=>W,[W]),useEffect(()=>{D||E(formatValue(v,o,c))},[v,o,c,D]);const Y=v<=r,U=v>=n,$=!p,q=useCallback(e=>{const t=roundToPrecision(e,o?c:0),i=clamp(t,r,n);i!==v&&w(i)},[o,n,r,w,c,v]),J=useCallback(()=>{if(!$||Y)return;const e=resolveHaptic(y,"selection");e&&triggerHaptic(e),q(v-a)},[Y,$,y,q,a,v]),K=useCallback(()=>{if(!$||U)return;const e=resolveHaptic(y,"selection");e&&triggerHaptic(e),q(v+a)},[U,$,y,q,a,v]);React.useImperativeHandle(t,()=>({focus:()=>V.current?.focus(),blur:()=>V.current?.blur(),clear:()=>{E(""),Number.isFinite(r)&&r>0?w(r):w(0<r?r:0>n?n:0)}}),[n,r,w]);const Q=useCallback(e=>{$&&(W(),O.current=setTimeout(()=>{G.current=setInterval(()=>{"inc"===e?K():J()},80)},500))},[W,J,K,$]),X=useCallback(e=>{const t=sanitizeTyped(e,o);E(t);const i=Number(t);""!==t&&"-"!==t&&"."!==t&&Number.isFinite(i)&&i>=r&&i<=n&&i!==v&&w(roundToPrecision(i,o?c:0))},[o,n,r,w,c,v]),Z=useCallback(()=>{A(!1),M(!1);const e=Number(k);if(""===k||!Number.isFinite(e))return void E(formatValue(v,o,c));const t=roundToPrecision(e,o?c:0),i=clamp(t,r,n);i!==v&&w(i),E(formatValue(i,o,c))},[o,k,n,r,w,c,v]),ee=useCallback(()=>{A(!0),M(!0)},[]),te=Y||p?R.colors["text-disabled"]:R.colors["text-body"],ie=U||p?R.colors["text-disabled"]:R.colors["text-body"],se=z.icon+8,renderStepper=(e,t,i,s,l,r)=>_jsx(Pressable,{onPress:t,onLongPress:()=>Q(e),onPressOut:W,delayLongPress:500,disabled:i,accessibilityRole:"button",accessibilityLabel:s,accessibilityState:{disabled:i},"aria-disabled":i,style:({pressed:e})=>[{width:se,height:se,alignItems:"center",justifyContent:"center",borderRadius:R.radius.pill,...smoothCorners},e&&!i?{backgroundColor:R.colors["surface-pressed"]}:null,I],testID:`${_??"numberinput"}-${"inc"===e?"plus":"minus"}`,children:_jsx(Text,{style:{fontSize:z.icon,color:l,fontWeight:R.weight.semibold,lineHeight:z.icon+2},children:r})}),le=g??fieldTextAsString(u)??"Number input",re=!0===m||hasFieldText(m),ne=_jsx(FieldBase,{size:f,disabled:p,error:re,filled:!0,focused:H,onPress:B,pressFeedback:!1,leading:renderStepper("dec",J,Y||p,"Decrease",te,"−"),trailing:renderStepper("inc",K,U||p,"Increase",ie,"+"),children:_jsxs(View,{style:P.inputRow,children:[_jsx(TextInput,{ref:V,value:k,onChangeText:X,onFocus:ee,onBlur:Z,editable:!p,keyboardType:o?"decimal-pad":"number-pad",selectTextOnFocus:!0,accessibilityRole:"adjustable",accessibilityLabel:le,accessibilityValue:{now:Number.isFinite(v)?v:0},accessibilityState:{disabled:p},"aria-disabled":p,accessibilityActions:[{name:"increment",label:"Increase"},{name:"decrement",label:"Decrease"}],onAccessibilityAction:e=>{"increment"===e.nativeEvent.actionName&&K(),"decrement"===e.nativeEvent.actionName&&J()},style:[P.input,{fontSize:z.text,color:L.color,...L.weightStyle},F],...C}),h?_jsx(Text,{style:[P.unit,{fontSize:z.text,color:L.placeholderColor},N],children:h}):null]})}),ae=hasFieldText(u)?_jsx(FieldLabel,{size:f,help:d,style:j,children:u}):null,oe=_jsx(FieldMessage,{size:f,error:re,text:re?m:b});return _jsxs(View,"horizontal"===x?{style:[P.horizontalContainer,S,T],testID:_,accessibilityState:{disabled:p},"aria-disabled":p,children:[_jsx(View,{style:P.horizontalLabelWrap,children:ae}),_jsxs(View,{children:[ne,oe]})]}:{style:[S,T],testID:_,accessibilityState:{disabled:p},"aria-disabled":p,children:[ae,ne,oe]})});NumberInput.displayName="NumberInput";const buildStyles=e=>StyleSheet.create({inputRow:{flex:1,flexDirection:"row",alignItems:"center",justifyContent:"center"},input:{flex:1,textAlign:"center",padding:e.space.none,margin:e.space.none,includeFontPadding:!1},unit:{marginLeft:e.space.xs},label:{marginBottom:e.space.xs},helper:{marginTop:e.space.xs},horizontalContainer:{flexDirection:"row",alignItems:"center",justifyContent:"space-between"},horizontalLabelWrap:{flexShrink:1,paddingRight:e.space.md}});export{NumberInput};export default NumberInput;

package/lib/module/components/OTPInput/OTPInput.js

@@ -1 +1 @@
-"use strict";import{forwardRef,useCallback,useEffect,useImperativeHandle,useMemo,useRef,useState}from"react";import{Animated,Easing,Pressable,StyleSheet,Text,TextInput,View}from"react-native";import{useControllableState,useReducedMotion}from"../../hooks/index.js";import{createAnimatedValue,fontFor,resolveOtpInputSize,setNativeValue,useTheme}from"../../theme/index.js";import{triggerHaptic}from"../../utils/index.js";import{smoothCorners}from"../../utils/corners.js";import{FieldBase,FieldMessage,hasFieldText}from"../FieldBase/FieldBase.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const sanitizeChar=(e,t)=>e?"number-pad"===t?e.replace(/\D/g,""):e:"",OTPInput=forwardRef((e,t)=>{const{value:n,defaultValue:i,onChange:r,onComplete:s,length:a=6,keyboardType:o="number-pad",autoFocus:l=!1,autoFocusDelay:u=0,disabled:c=!1,error:d,size:m="md",secure:p=!1,haptic:f,onFocus:g,accessibilityLabel:h,style:b,cellStyle:x,textStyle:y,testID:j}=e,[v,C]=useControllableState({value:n,defaultValue:i??"",onChange:r}),T=useTheme(),V=useMemo(()=>buildStyles(T),[T]),S=resolveOtpInputSize(T,m),k=useRef([]),[F,w]=useState(-1),E=useRef(null),I=useRef(createAnimatedValue(0)).current,A=useRef(new Map),R=useMemo(()=>{const e=A.current,t=[];for(let n=0;n<a;n+=1){let i=e.get(n);i||(i=new Animated.Value(0),e.set(n,i)),t.push(i)}for(const t of Array.from(e.keys()))t>=a&&e.delete(t);return t},[a]),O=useRef(-1),_=T.components.otpInput?.shakeOnError??!1,z=useReducedMotion(),M=!0===d||hasFieldText(d);useEffect(()=>{let e;return null===E.current||!M||E.current||(f&&triggerHaptic("notificationError"),_&&!z&&(setNativeValue(I,0),e=Animated.sequence([Animated.timing(I,{toValue:1,duration:T.motion.duration.instant,easing:Easing.linear,useNativeDriver:!0}),Animated.timing(I,{toValue:-1,duration:T.motion.duration.instant,easing:Easing.linear,useNativeDriver:!0}),Animated.timing(I,{toValue:1,duration:T.motion.duration.instant,easing:Easing.linear,useNativeDriver:!0}),Animated.timing(I,{toValue:0,duration:T.motion.duration.instant,easing:Easing.linear,useNativeDriver:!0})]),e.start())),E.current=M,()=>e?.stop()},[M,I,_,f,z,T.motion.duration.instant]),useEffect(()=>{const e=O.current;if(O.current=F,e===F)return;if(-1===e&&-1===F)return;const t=[];return R.forEach((n,i)=>{const r=i===F?1:0;if(i!==F&&i!==e)return;const s=Animated.timing(n,{toValue:r,duration:T.motion.duration.fast,easing:Easing.bezier(...T.motion.easing.standard),useNativeDriver:!0});s.start(),t.push(s)}),()=>t.forEach(e=>e.stop())},[F,R,T]);const D=useCallback(e=>{const t=k.current[e];t&&t.focus()},[]);useImperativeHandle(t,()=>({focus:()=>D(0),blur:()=>{const e=k.current[F>=0?F:0];e?.blur()},clear:()=>{C(""),D(0)}}),[D,F,C]),useEffect(()=>{if(l&&!c){const e=setTimeout(()=>D(0),u);return()=>clearTimeout(e)}},[l,u,c,D]);const P=useMemo(()=>{const e=new Array(a).fill("");for(let t=0;t<Math.min(v.length,a);t+=1)e[t]=v[t]??"";return e},[v,a]),H=useCallback(e=>{const t=e.slice(0,a);t!==v&&(C(t),t.length===a&&s&&s(t))},[a,C,s,v]),N=useCallback((e,t)=>{const n=t.replace(/\u200B/g,""),i=sanitizeChar(n,o);if(!i){const t=P.slice(),n=(t[e]??"").length>0;if(t[e]="",H(t.join("").slice(0,a)),!n&&e>0){const t=P.slice();t[e-1]="",H(t.join("")),D(e-1)}return}const r=P[e]??"",s=r&&i.length>a&&i.startsWith(r)?i.slice(r.length):i;if(s.length>=a){const t=s.slice(0,a),n=v.length;return H(t),t.length!==n&&f&&triggerHaptic(f),void k.current[e]?.blur()}const l=P.slice();let u=e;for(let e=0;e<i.length&&u<a;e+=1)l[u]=i[e]??"",u+=1;const c=l.join("").slice(0,a),d=v.length;H(c),c.length!==d&&f&&triggerHaptic(f);const m=Math.min(u,a-1);u>=a?k.current[e]?.blur():D(m)},[P,D,o,a,f,H,v]),B=useCallback((e,t)=>{if("Backspace"!==t.nativeEvent.key)return;if(0===(P[e]??"").length){if(e>0){const t=P.slice();t[e-1]="",H(t.join("")),D(e-1)}}else{const t=P.slice();t[e]="",H(t.join(""))}},[P,D,H]),W=useCallback((e,t)=>{w(e),g?.(t)},[g]),L=useCallback(()=>{w(-1)},[]),$=useCallback(()=>{if(c)return;const e=P.indexOf("");D(-1===e?a-1:e)},[P,c,D,a]),q=h??`Enter ${a}-digit code`,G=I.interpolate({inputRange:[-1,1],outputRange:[-6,6]});return _jsxs(View,{style:b,accessible:!0,accessibilityRole:"none",accessibilityLabel:q,accessibilityValue:{text:n},accessibilityState:{disabled:c},"aria-disabled":c,testID:j,children:[_jsx(Pressable,{onPress:$,disabled:c,accessible:!1,children:_jsx(Animated.View,{style:[V.row,{columnGap:S.gap,transform:[{translateX:G}]}],children:P.map((e,t)=>{const n=F===t,i=e.length>0,r=M?T.colors.border.error:T.colors.border.focus,s=R[t];if(!s)return null;const l=p&&i?"●":e;return _jsxs(View,{style:V.cellWrapper,children:[_jsxs(FieldBase,{size:m,width:S.cell,height:S.cell,borderRadius:S.radius,borderWidth:1.5,focused:n,error:M,filled:i,disabled:c,paddingHorizontal:T.spacing.none,paddingVertical:T.spacing.none,gap:T.spacing.none,style:x,children:[_jsx(TextInput,{ref:e=>{k.current[t]=e},value:(p&&i?"":e)||"​",onChangeText:e=>N(t,e),onKeyPress:e=>B(t,e),onFocus:e=>W(t,e),onBlur:L,keyboardType:o,editable:!c,selectTextOnFocus:!0,caretHidden:i,maxLength:a+1,textContentType:"oneTimeCode",autoComplete:0===t?"sms-otp":"off",importantForAutofill:0===t?"yes":"no",style:[V.input,{fontSize:S.text,color:T.colors.text.primary,...fontFor(T,"semibold")},y]}),p&&i?_jsx(View,{pointerEvents:"none",style:V.maskOverlay,children:_jsx(Text,{style:[{fontSize:S.text,color:T.colors.text.primary,...fontFor(T,"semibold")},y],children:l})}):null]}),_jsx(Animated.View,{style:[V.underline,{backgroundColor:r,opacity:s}]})]},`otp-cell-${t}`)})})}),_jsx(FieldMessage,{size:m,error:!0,text:d})]})});OTPInput.displayName="OTPInput";const buildStyles=e=>StyleSheet.create({row:{flexDirection:"row",alignItems:"center"},cellWrapper:{alignItems:"center"},input:{width:"100%",height:"100%",textAlign:"center",padding:e.spacing.none},maskOverlay:{...StyleSheet.absoluteFill,alignItems:"center",justifyContent:"center"},underline:{marginTop:e.spacing.xs,height:2,width:"60%",borderRadius:e.radius.pill,...smoothCorners}});export{OTPInput};export default OTPInput;
+"use strict";import{forwardRef,useCallback,useEffect,useImperativeHandle,useMemo,useRef,useState}from"react";import{Animated,Easing,Pressable,StyleSheet,Text,TextInput,View}from"react-native";import{useControllableState,useReducedMotion}from"../../hooks/index.js";import{createAnimatedValue,fontFor,resolveOtpInputSize,setNativeValue,useTheme}from"../../theme/index.js";import{triggerHaptic}from"../../utils/index.js";import{smoothCorners}from"../../utils/corners.js";import{FieldBase,FieldMessage,hasFieldText}from"../FieldBase/FieldBase.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const sanitizeChar=(e,t)=>e?"number-pad"===t?e.replace(/\D/g,""):e:"",OTPInput=forwardRef((e,t)=>{const{value:n,defaultValue:s,onChange:i,onComplete:r,length:o=6,keyboardType:a="number-pad",autoFocus:l=!1,autoFocusDelay:u=0,disabled:c=!1,error:d,size:m="md",secure:p=!1,haptic:f,onFocus:g,accessibilityLabel:h,style:b,cellStyle:x,textStyle:y,testID:j}=e,[v,C]=useControllableState({value:n,defaultValue:s??"",onChange:i}),T=useTheme(),V=useMemo(()=>buildStyles(T),[T]),S=resolveOtpInputSize(T,m),k=useRef([]),[F,w]=useState(-1),E=useRef(null),A=useRef(createAnimatedValue(0)).current,I=useRef(new Map),R=useMemo(()=>{const e=I.current,t=[];for(let n=0;n<o;n+=1){let s=e.get(n);s||(s=new Animated.Value(0),e.set(n,s)),t.push(s)}for(const t of Array.from(e.keys()))t>=o&&e.delete(t);return t},[o]),O=useRef(-1),_=T.settings.components["otp-input"]?.shakeOnError??!1,z=useReducedMotion(),M=!0===d||hasFieldText(d);useEffect(()=>{let e;return null===E.current||!M||E.current||(f&&triggerHaptic("notificationError"),_&&!z&&(setNativeValue(A,0),e=Animated.sequence([Animated.timing(A,{toValue:1,duration:T.motion.duration.instant,easing:Easing.linear,useNativeDriver:!0}),Animated.timing(A,{toValue:-1,duration:T.motion.duration.instant,easing:Easing.linear,useNativeDriver:!0}),Animated.timing(A,{toValue:1,duration:T.motion.duration.instant,easing:Easing.linear,useNativeDriver:!0}),Animated.timing(A,{toValue:0,duration:T.motion.duration.instant,easing:Easing.linear,useNativeDriver:!0})]),e.start())),E.current=M,()=>e?.stop()},[M,A,_,f,z,T.motion.duration.instant]),useEffect(()=>{const e=O.current;if(O.current=F,e===F)return;if(-1===e&&-1===F)return;const t=[];return R.forEach((n,s)=>{const i=s===F?1:0;if(s!==F&&s!==e)return;const r=Animated.timing(n,{toValue:i,duration:T.motion.duration.fast,easing:Easing.bezier(...T.motion.ease["in-out"]),useNativeDriver:!0});r.start(),t.push(r)}),()=>t.forEach(e=>e.stop())},[F,R,T]);const D=useCallback(e=>{const t=k.current[e];t&&t.focus()},[]);useImperativeHandle(t,()=>({focus:()=>D(0),blur:()=>{const e=k.current[F>=0?F:0];e?.blur()},clear:()=>{C(""),D(0)}}),[D,F,C]),useEffect(()=>{if(l&&!c){const e=setTimeout(()=>D(0),u);return()=>clearTimeout(e)}},[l,u,c,D]);const P=useMemo(()=>{const e=new Array(o).fill("");for(let t=0;t<Math.min(v.length,o);t+=1)e[t]=v[t]??"";return e},[v,o]),H=useCallback(e=>{const t=e.slice(0,o);t!==v&&(C(t),t.length===o&&r&&r(t))},[o,C,r,v]),N=useCallback((e,t)=>{const n=t.replace(/\u200B/g,""),s=sanitizeChar(n,a);if(!s){const t=P.slice(),n=(t[e]??"").length>0;if(t[e]="",H(t.join("").slice(0,o)),!n&&e>0){const t=P.slice();t[e-1]="",H(t.join("")),D(e-1)}return}const i=P[e]??"",r=i&&s.length>o&&s.startsWith(i)?s.slice(i.length):s;if(r.length>=o){const t=r.slice(0,o),n=v.length;return H(t),t.length!==n&&f&&triggerHaptic(f),void k.current[e]?.blur()}const l=P.slice();let u=e;for(let e=0;e<s.length&&u<o;e+=1)l[u]=s[e]??"",u+=1;const c=l.join("").slice(0,o),d=v.length;H(c),c.length!==d&&f&&triggerHaptic(f);const m=Math.min(u,o-1);u>=o?k.current[e]?.blur():D(m)},[P,D,a,o,f,H,v]),B=useCallback((e,t)=>{if("Backspace"!==t.nativeEvent.key)return;if(0===(P[e]??"").length){if(e>0){const t=P.slice();t[e-1]="",H(t.join("")),D(e-1)}}else{const t=P.slice();t[e]="",H(t.join(""))}},[P,D,H]),W=useCallback((e,t)=>{w(e),g?.(t)},[g]),L=useCallback(()=>{w(-1)},[]),$=useCallback(()=>{if(c)return;const e=P.indexOf("");D(-1===e?o-1:e)},[P,c,D,o]),q=h??`Enter ${o}-digit code`,G=A.interpolate({inputRange:[-1,1],outputRange:[-6,6]});return _jsxs(View,{style:b,accessible:!0,accessibilityRole:"none",accessibilityLabel:q,accessibilityValue:{text:n},accessibilityState:{disabled:c},"aria-disabled":c,testID:j,children:[_jsx(Pressable,{onPress:$,disabled:c,accessible:!1,children:_jsx(Animated.View,{style:[V.row,{columnGap:S.gap,transform:[{translateX:G}]}],children:P.map((e,t)=>{const n=F===t,s=e.length>0,i=M?T.colors["danger-border"]:T.colors["focus-ring"],r=R[t];if(!r)return null;const l=p&&s?"●":e;return _jsxs(View,{style:V.cellWrapper,children:[_jsxs(FieldBase,{size:m,width:S.cell,height:S.cell,borderRadius:S.radius,borderWidth:1.5,focused:n,error:M,filled:s,disabled:c,paddingHorizontal:T.space.none,paddingVertical:T.space.none,gap:T.space.none,style:x,children:[_jsx(TextInput,{ref:e=>{k.current[t]=e},value:(p&&s?"":e)||"​",onChangeText:e=>N(t,e),onKeyPress:e=>B(t,e),onFocus:e=>W(t,e),onBlur:L,keyboardType:a,editable:!c,selectTextOnFocus:!0,caretHidden:s,maxLength:o+1,textContentType:"oneTimeCode",autoComplete:0===t?"sms-otp":"off",importantForAutofill:0===t?"yes":"no",style:[V.input,{fontSize:S.text,color:T.colors["text-body"],...fontFor(T,"semibold")},y]}),p&&s?_jsx(View,{pointerEvents:"none",style:V.maskOverlay,children:_jsx(Text,{style:[{fontSize:S.text,color:T.colors["text-body"],...fontFor(T,"semibold")},y],children:l})}):null]}),_jsx(Animated.View,{style:[V.underline,{backgroundColor:i,opacity:r}]})]},`otp-cell-${t}`)})})}),_jsx(FieldMessage,{size:m,error:!0,text:d})]})});OTPInput.displayName="OTPInput";const buildStyles=e=>StyleSheet.create({row:{flexDirection:"row",alignItems:"center"},cellWrapper:{alignItems:"center"},input:{width:"100%",height:"100%",textAlign:"center",padding:e.space.none},maskOverlay:{...StyleSheet.absoluteFill,alignItems:"center",justifyContent:"center"},underline:{marginTop:e.space.xs,height:2,width:"60%",borderRadius:e.radius.pill,...smoothCorners}});export{OTPInput};export default OTPInput;

package/lib/module/components/OnboardingPager/OnboardingPager.js

@@ -1 +1 @@
-"use strict";import{useCallback,useEffect,useMemo,useRef,useState}from"react";import{Animated,Easing,Pressable,ScrollView,StyleSheet,View}from"react-native";import{useSafeAreaInsets}from"react-native-safe-area-context";import{useReducedMotion}from"../../hooks/useReducedMotion.js";import{createAnimatedValue,useTheme}from"../../theme/index.js";import{announce}from"../../utils/announce.js";import{smoothCorners}from"../../utils/corners.js";import{Button}from"../Button/index.js";import{Carousel}from"../Carousel/index.js";import{Text}from"../Text/index.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const ONBOARDING_MAX_PAGES=6,CONTROL_HEIGHT=44,DOT_SIZE=8,DOT_ACTIVE_WIDTH=24,defaultStep=(e,t)=>`Step ${e} of ${t}`,OnboardingPager=({pages:e,onDone:t,onSkip:o,doneLabel:n="Get started",labels:s,safeArea:i=!0,haptic:a="selection",testID:r})=>{const l=useTheme(),c=useSafeAreaInsets(),d=useReducedMotion(),u=useMemo(()=>buildStyles(l),[l]),m=useMemo(()=>e.slice(0,6),[e]),p=m.length,g=s?.step??defaultStep,b=useRef(null),[x,f]=useState(0),y=x>=p-1,h=useCallback(e=>{e<0||e>=p||b.current?.scrollTo(e,!d)},[p,d]),j=useCallback(e=>h(x+e),[h,x]),S=useCallback(()=>{y?t():h(x+1)},[y,t,h,x]),_=useRef(x);useEffect(()=>{if(_.current===x)return;_.current=x;const e=m[x];e&&announce(`${g(x+1,p)}, ${e.title}`)},[x,m,p,g]);const C=useCallback((e,t)=>_jsx(ScrollView,{style:u.page,contentContainerStyle:u.pageContent,showsVerticalScrollIndicator:!1,bounces:!1,children:_jsxs(View,{accessible:!0,accessibilityLabel:`${g(t+1,p)}, ${e.title}. ${e.body}`,style:u.pageGroup,children:[e.art?_jsx(View,{style:u.art,children:e.art}):null,_jsx(Text,{variant:"h2",align:"center",children:e.title}),_jsx(Text,{variant:"body",color:"secondary",align:"center",children:e.body})]})}),[u,g,p]);return 0===p?null:_jsxs(View,{style:[u.root,i?{paddingTop:c.top,paddingBottom:c.bottom}:null],testID:r,children:[_jsx(View,{style:u.skipRow,children:_jsx(Button,{title:s?.skip??"Skip",variant:"ghost",tone:"neutral",hitSlop:{top:2,bottom:2,left:8,right:8},haptic:a,onPress:o,testID:r?`${r}-skip`:void 0})}),_jsx(Carousel,{ref:b,data:m,renderItem:C,keyExtractor:e=>e.key,onIndexChange:f,showPagination:!1,containerStyle:u.carousel,testID:r?`${r}-pages`:void 0}),_jsxs(View,{style:u.footer,children:[p>1?_jsx(PageControl,{keys:m.map(e=>e.key),index:x,label:s?.pageControl??"Page",valueText:g(x+1,p),reduceMotion:d,theme:l,onStep:j,testID:r?`${r}-dots`:void 0}):null,_jsx(Button,{title:y?n:s?.next??"Next",size:"lg",fullWidth:!0,haptic:a,onPress:S,testID:r?`${r}-next`:void 0})]})]})};OnboardingPager.displayName="OnboardingPager";const PageControl=({keys:e,index:t,label:o,valueText:n,reduceMotion:s,theme:i,onStep:a,testID:r})=>{const l=useCallback(e=>{"increment"===e.nativeEvent.actionName?a(1):"decrement"===e.nativeEvent.actionName&&a(-1)},[a]);return _jsxs(View,{accessible:!0,accessibilityRole:"adjustable",accessibilityLabel:o,accessibilityValue:{min:0,max:e.length-1,now:t,text:n},accessibilityActions:[{name:"increment"},{name:"decrement"}],onAccessibilityAction:l,style:controlStyles.control,testID:r,children:[_jsx(View,{style:controlStyles.dots,pointerEvents:"none",children:e.map((e,o)=>_jsx(Dot,{active:o===t,reduceMotion:s,theme:i},e))}),_jsx(Pressable,{accessible:!1,importantForAccessibility:"no",style:controlStyles.back,onPress:()=>a(-1),testID:r?`${r}-back`:void 0}),_jsx(Pressable,{accessible:!1,importantForAccessibility:"no",style:controlStyles.forward,onPress:()=>a(1),testID:r?`${r}-forward`:void 0})]})},Dot=({active:e,reduceMotion:t,theme:o})=>{const n=useRef(createAnimatedValue(e?1:0)).current;return useEffect(()=>{const s=Animated.timing(n,{toValue:e?1:0,duration:t?0:o.motion.duration.normal,easing:Easing.bezier(...o.motion.easing.standard),useNativeDriver:!1});return s.start(),()=>s.stop()},[e,t,n,o]),_jsx(Animated.View,{style:{width:n.interpolate({inputRange:[0,1],outputRange:[8,24]}),height:8,marginHorizontal:o.spacing.xs,borderRadius:4,...smoothCorners,backgroundColor:n.interpolate({inputRange:[0,1],outputRange:[o.colors.border.primary,o.colors.primary]})}})},controlStyles=StyleSheet.create({control:{alignSelf:"center",height:44,minWidth:88,alignItems:"center",justifyContent:"center"},dots:{flexDirection:"row",alignItems:"center"},back:{position:"absolute",top:0,bottom:0,start:0,width:"50%"},forward:{position:"absolute",top:0,bottom:0,end:0,width:"50%"}}),buildStyles=e=>StyleSheet.create({root:{flex:1,backgroundColor:e.colors.background.primary},skipRow:{minHeight:44,paddingHorizontal:e.spacing.lg,alignItems:"flex-end",justifyContent:"center"},carousel:{flex:1},page:{flex:1},pageContent:{flexGrow:1,justifyContent:"center",paddingHorizontal:e.spacing.xl,paddingVertical:e.spacing.lg},pageGroup:{alignItems:"center",gap:e.spacing.md},art:{alignItems:"center",marginBottom:e.spacing.xl},footer:{paddingHorizontal:e.spacing.lg,paddingBottom:e.spacing.lg,gap:e.spacing.sm}});export{OnboardingPager};export default OnboardingPager;
+"use strict";import{useCallback,useEffect,useMemo,useRef,useState}from"react";import{Animated,Easing,Pressable,ScrollView,StyleSheet,View}from"react-native";import{useSafeAreaInsets}from"react-native-safe-area-context";import{useReducedMotion}from"../../hooks/useReducedMotion.js";import{createAnimatedValue,useTheme}from"../../theme/index.js";import{announce}from"../../utils/announce.js";import{smoothCorners}from"../../utils/corners.js";import{Button}from"../Button/index.js";import{Carousel}from"../Carousel/index.js";import{Text}from"../Text/index.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const ONBOARDING_MAX_PAGES=6,CONTROL_HEIGHT=44,DOT_SIZE=8,DOT_ACTIVE_WIDTH=24,defaultStep=(e,t)=>`Step ${e} of ${t}`,OnboardingPager=({pages:e,onDone:t,onSkip:o,doneLabel:n="Get started",labels:s,safeArea:a=!0,haptic:i="selection",testID:r})=>{const l=useTheme(),c=useSafeAreaInsets(),u=useReducedMotion(),d=useMemo(()=>buildStyles(l),[l]),p=useMemo(()=>e.slice(0,6),[e]),m=p.length,g=s?.step??defaultStep,b=useRef(null),[x,f]=useState(0),h=x>=m-1,y=useCallback(e=>{e<0||e>=m||b.current?.scrollTo(e,!u)},[m,u]),j=useCallback(e=>y(x+e),[y,x]),S=useCallback(()=>{h?t():y(x+1)},[h,t,y,x]),_=useRef(x);useEffect(()=>{if(_.current===x)return;_.current=x;const e=p[x];e&&announce(`${g(x+1,m)}, ${e.title}`)},[x,p,m,g]);const C=useCallback((e,t)=>_jsx(ScrollView,{style:d.page,contentContainerStyle:d.pageContent,showsVerticalScrollIndicator:!1,bounces:!1,children:_jsxs(View,{accessible:!0,accessibilityLabel:`${g(t+1,m)}, ${e.title}. ${e.body}`,style:d.pageGroup,children:[e.art?_jsx(View,{style:d.art,children:e.art}):null,_jsx(Text,{variant:"h2",align:"center",children:e.title}),_jsx(Text,{variant:"body",color:"secondary",align:"center",children:e.body})]})}),[d,g,m]);return 0===m?null:_jsxs(View,{style:[d.root,a?{paddingTop:c.top,paddingBottom:c.bottom}:null],testID:r,children:[_jsx(View,{style:d.skipRow,children:_jsx(Button,{title:s?.skip??"Skip",variant:"ghost",tone:"neutral",hitSlop:{top:2,bottom:2,left:8,right:8},haptic:i,onPress:o,testID:r?`${r}-skip`:void 0})}),_jsx(Carousel,{ref:b,data:p,renderItem:C,keyExtractor:e=>e.key,onIndexChange:f,showPagination:!1,containerStyle:d.carousel,testID:r?`${r}-pages`:void 0}),_jsxs(View,{style:d.footer,children:[m>1?_jsx(PageControl,{keys:p.map(e=>e.key),index:x,label:s?.pageControl??"Page",valueText:g(x+1,m),reduceMotion:u,theme:l,onStep:j,testID:r?`${r}-dots`:void 0}):null,_jsx(Button,{title:h?n:s?.next??"Next",size:"lg",fullWidth:!0,haptic:i,onPress:S,testID:r?`${r}-next`:void 0})]})]})};OnboardingPager.displayName="OnboardingPager";const PageControl=({keys:e,index:t,label:o,valueText:n,reduceMotion:s,theme:a,onStep:i,testID:r})=>{const l=useCallback(e=>{"increment"===e.nativeEvent.actionName?i(1):"decrement"===e.nativeEvent.actionName&&i(-1)},[i]);return _jsxs(View,{accessible:!0,accessibilityRole:"adjustable",accessibilityLabel:o,accessibilityValue:{min:0,max:e.length-1,now:t,text:n},accessibilityActions:[{name:"increment"},{name:"decrement"}],onAccessibilityAction:l,style:controlStyles.control,testID:r,children:[_jsx(View,{style:controlStyles.dots,pointerEvents:"none",children:e.map((e,o)=>_jsx(Dot,{active:o===t,reduceMotion:s,theme:a},e))}),_jsx(Pressable,{accessible:!1,importantForAccessibility:"no",style:controlStyles.back,onPress:()=>i(-1),testID:r?`${r}-back`:void 0}),_jsx(Pressable,{accessible:!1,importantForAccessibility:"no",style:controlStyles.forward,onPress:()=>i(1),testID:r?`${r}-forward`:void 0})]})},Dot=({active:e,reduceMotion:t,theme:o})=>{const n=useRef(createAnimatedValue(e?1:0)).current;return useEffect(()=>{const s=Animated.timing(n,{toValue:e?1:0,duration:t?0:o.motion.duration.default,easing:Easing.bezier(...o.motion.ease["in-out"]),useNativeDriver:!1});return s.start(),()=>s.stop()},[e,t,n,o]),_jsx(Animated.View,{style:{width:n.interpolate({inputRange:[0,1],outputRange:[8,24]}),height:8,marginHorizontal:o.space.xs,borderRadius:4,...smoothCorners,backgroundColor:n.interpolate({inputRange:[0,1],outputRange:[o.colors.border,o.colors.primary]})}})},controlStyles=StyleSheet.create({control:{alignSelf:"center",height:44,minWidth:88,alignItems:"center",justifyContent:"center"},dots:{flexDirection:"row",alignItems:"center"},back:{position:"absolute",top:0,bottom:0,start:0,width:"50%"},forward:{position:"absolute",top:0,bottom:0,end:0,width:"50%"}}),buildStyles=e=>StyleSheet.create({root:{flex:1,backgroundColor:e.colors.bg},skipRow:{minHeight:44,paddingHorizontal:e.space.lg,alignItems:"flex-end",justifyContent:"center"},carousel:{flex:1},page:{flex:1},pageContent:{flexGrow:1,justifyContent:"center",paddingHorizontal:e.space.xl,paddingVertical:e.space.lg},pageGroup:{alignItems:"center",gap:e.space.md},art:{alignItems:"center",marginBottom:e.space.xl},footer:{paddingHorizontal:e.space.lg,paddingBottom:e.space.lg,gap:e.space.sm}});export{OnboardingPager};export default OnboardingPager;

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

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

package/lib/module/components/PaymentResult/PaymentResult.js

@@ -1 +1 @@
-"use strict";import{formatDateTime,formatMinor}from"@webority/mobile-core";import{useEffect,useMemo,useRef}from"react";import{StyleSheet,View}from"react-native";import Animated,{cancelAnimation,useAnimatedStyle,useSharedValue,withSpring,withTiming}from"react-native-reanimated";import{useReducedMotion}from"../../hooks/index.js";import{useTheme}from"../../theme/index.js";import{announce}from"../../utils/announce.js";import{tintOf}from"../../utils/color.js";import{smoothCorners}from"../../utils/corners.js";import{triggerHaptic}from"../../utils/hapticUtils.js";import{AppIcon}from"../AppIcon/index.js";import{Button}from"../Button/index.js";import{Confetti}from"../Confetti/index.js";import{Descriptions}from"../Descriptions/index.js";import{StatusBadge}from"../StatusBadge/index.js";import{Text}from"../Text/index.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const STATUS={success:{icon:"check-circle",badge:"Success",tone:"success",title:"Payment successful"},pending:{icon:"clock",badge:"Pending",tone:"neutral",title:"Payment pending"},failed:{icon:"x-circle",badge:"Failed",tone:"error",title:"Payment failed"},refunded:{icon:"refresh-cw",badge:"Refunded",tone:"info",title:"Payment refunded"}},MARK_SIZE=72,ICON_SIZE=36,TINT_OPACITY=.14,DEFAULT_REFUND_DAYS=5,CONFETTI_PIECES=60,SETTLE_WINDOW="Most payments confirm in a few minutes. Your bank can take up to 48 hours.",REFRESH_HINT="Tap Check status to see the latest.",PENDING_WARNING="Do not pay again. If money has left your account, it will either complete or come back to you.",istStamp=e=>formatDateTime(e,{zone:"IST",zoneLabel:!0}),markColors=(e,t)=>{const{colors:n}=e;switch(t){case"success":return{fill:tintOf(n.success,.14,n.background.secondary),ink:n.toneText.success};case"failed":return{fill:tintOf(n.error,.14,n.background.secondary),ink:n.toneText.error};case"refunded":return{fill:tintOf(n.info,.14,n.background.secondary),ink:n.toneText.info};default:return{fill:n.background.tertiary,ink:n.text.secondary}}},failedLead=(e,t,n,r)=>{if(!0===e){return`${t} will return to your account within ${n} working days.${r?` Reference ${r}.`:""}`}return!1===e?"No money was taken from your account. You can try again.":"We could not confirm whether money left your account. Check your bank statement before you try again."},leadFor=(e,t,n)=>{switch(e){case"success":return"Your payment has been received. Keep this receipt for your records.";case"pending":return"Your bank has not confirmed this payment yet.";case"refunded":return`${t} has been returned to your account.`;default:return n}},renderAction=e=>_jsx(Button,{title:e.title,size:"lg",fullWidth:!0,variant:e.variant,tone:e.tone,leftIcon:e.icon,loading:e.loading,onPress:e.onPress},e.key);export const PaymentResult=({status:e,amount:t,currency:n="INR",payee:r,reference:o,paidAt:i,method:a,rows:s,debited:l,refundDays:c=5,settlesBy:u,title:d,message:m,onShare:f,onDownload:p,onDone:h,onRetry:y,onRefresh:g,refreshing:b=!1,celebrate:x=!0,haptic:k=!0,style:j,testID:S})=>{const T=useTheme(),v=useReducedMotion(),w=useMemo(()=>buildStyles(T),[T]),_=useRef(null),I=useRef(null),A=STATUS[e],R=useMemo(()=>markColors(T,e),[T,e]),D=d??A.title,E=formatMinor(t,{currency:n,dropZeroDecimals:!0}),C=failedLead(l,E,c,o),P=m??leadFor(e,E,C),N=`${D}, ${E}${r&&"refunded"!==e?` to ${r}`:""}`,V=void 0===u?SETTLE_WINDOW:`Expected to settle by ${istStamp(u)}.`;useEffect(()=>{I.current!==e&&(I.current=e,announce(N,{polite:"failed"!==e}),k&&("success"===e?triggerHaptic("confirm"):"failed"===e&&triggerHaptic("reject")),"success"===e&&x&&_.current?.start())},[e]);const M=useSharedValue(.9),$=useSharedValue(0),W=T.motion.duration.normal;useEffect(()=>(v?(M.value=1,$.value=1):"success"===e?($.value=0,$.value=withTiming(1,{duration:W}),M.value=.6,M.value=withSpring(1,{damping:12,stiffness:160})):($.value=0,$.value=withTiming(1,{duration:W}),M.value=.9,M.value=withTiming(1,{duration:W})),()=>{cancelAnimation(M),cancelAnimation($)}),[e,v,M,$,W]);const F=useAnimatedStyle(()=>({opacity:$.value,transform:[{scale:M.value}]})),H=useMemo(()=>{const e=[];if(r&&e.push({key:"payee",label:"Paid to",value:r}),a&&e.push({key:"method",label:"Method",value:a}),o){const t=/^\d+$/.test(o);e.push({key:"reference",label:"Reference",value:_jsx(Text,{selectable:!0,accessibilityLabel:t?o.split("").join(" "):void 0,style:w.tabular,children:o})})}void 0!==i&&e.push({key:"paidAt",label:"Date and time",value:istStamp(i)});for(const t of s??[])void 0!==t.value&&null!==t.value&&""!==t.value&&e.push(t);return e},[r,a,o,i,s,w.tabular]),O="pending"===e&&g?{key:"refresh",title:"Check status",onPress:g,icon:"refresh-cw",loading:b}:null,B=h?{key:"done",title:"Done",onPress:h}:null,L=("failed"===e&&!1===l&&y?{key:"retry",title:"Try again",onPress:y,icon:"refresh-cw"}:null)??O??B,Y=B&&L!==B?{...B,variant:"ghost",tone:"neutral"}:null,z=[];return f&&z.push({key:"share",title:"Share receipt",onPress:f,icon:"share",variant:"outline",tone:"neutral"}),p&&z.push({key:"download",title:"Download",onPress:p,icon:"download",variant:"outline",tone:"neutral"}),_jsxs(View,{style:[w.root,j],testID:S,accessibilityRole:"summary",children:[_jsxs(View,{style:w.header,children:[_jsx(Animated.View,{style:[w.mark,{backgroundColor:R.fill},F],accessibilityElementsHidden:!0,importantForAccessibility:"no-hide-descendants",children:_jsx(AppIcon,{name:A.icon,size:36,color:R.ink})}),_jsx(StatusBadge,{label:A.badge,tone:A.tone}),_jsx(Text,{variant:"h3",align:"center",children:D}),_jsx(Text,{variant:"h1",align:"center",style:w.tabular,children:E}),_jsx(Text,{variant:"body",color:"secondary",align:"center",children:P})]}),"pending"===e?_jsxs(View,{style:w.note,children:[_jsx(Text,{variant:"bodySmall",color:"secondary",children:V}),_jsx(Text,{variant:"bodySmall",weight:"semibold",children:PENDING_WARNING}),O?_jsx(Text,{variant:"bodySmall",color:"secondary",children:REFRESH_HINT}):null]}):null,H.length>0?_jsx(View,{style:w.receipt,children:_jsx(Descriptions,{items:H,columns:2,bordered:!0})}):null,L||z.length>0?_jsxs(View,{style:w.actions,children:[L?renderAction(L):null,z.length>0?_jsx(View,{style:w.pair,children:z.map(e=>_jsx(View,{style:w.pairItem,children:renderAction(e)},e.key))}):null,Y?renderAction(Y):null]}):null,"success"===e&&x?_jsx(Confetti,{ref:_,count:60,preset:"pop"}):null]})};const buildStyles=e=>StyleSheet.create({root:{gap:e.spacing.lg},header:{alignItems:"center",gap:e.spacing.sm},mark:{width:72,height:72,borderRadius:e.radius.pill,alignItems:"center",justifyContent:"center",marginBottom:e.spacing.xs,...smoothCorners},tabular:{fontVariant:["tabular-nums"]},note:{gap:e.spacing.xs,padding:e.spacing.md,borderRadius:e.radius.md,backgroundColor:e.colors.background.secondary,...smoothCorners},receipt:{paddingHorizontal:e.spacing.md,borderRadius:e.radius.lg,borderWidth:StyleSheet.hairlineWidth,borderColor:e.colors.border.secondary,backgroundColor:e.colors.background.primary,...smoothCorners},actions:{gap:e.spacing.sm},pair:{flexDirection:"row",gap:e.spacing.sm},pairItem:{flex:1}});export default PaymentResult;
+"use strict";import{formatDateTime,formatMinor}from"@webority/mobile-core";import{useEffect,useMemo,useRef}from"react";import{StyleSheet,View}from"react-native";import Animated,{cancelAnimation,useAnimatedStyle,useSharedValue,withSpring,withTiming}from"react-native-reanimated";import{useReducedMotion}from"../../hooks/index.js";import{useTheme}from"../../theme/index.js";import{announce}from"../../utils/announce.js";import{tintOf}from"../../utils/color.js";import{smoothCorners}from"../../utils/corners.js";import{triggerHaptic}from"../../utils/hapticUtils.js";import{AppIcon}from"../AppIcon/index.js";import{Button}from"../Button/index.js";import{Confetti}from"../Confetti/index.js";import{Descriptions}from"../Descriptions/index.js";import{StatusBadge}from"../StatusBadge/index.js";import{Text}from"../Text/index.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const STATUS={success:{icon:"check-circle",badge:"Success",tone:"success",title:"Payment successful"},pending:{icon:"clock",badge:"Pending",tone:"neutral",title:"Payment pending"},failed:{icon:"x-circle",badge:"Failed",tone:"danger",title:"Payment failed"},refunded:{icon:"refresh-cw",badge:"Refunded",tone:"info",title:"Payment refunded"}},MARK_SIZE=72,ICON_SIZE=36,TINT_OPACITY=.14,DEFAULT_REFUND_DAYS=5,CONFETTI_PIECES=60,SETTLE_WINDOW="Most payments confirm in a few minutes. Your bank can take up to 48 hours.",REFRESH_HINT="Tap Check status to see the latest.",PENDING_WARNING="Do not pay again. If money has left your account, it will either complete or come back to you.",istStamp=e=>formatDateTime(e,{zone:"IST",zoneLabel:!0}),markColors=(e,t)=>{const{colors:n}=e;switch(t){case"success":return{fill:tintOf(n.success,.14,n["bg-subtle"]),ink:n["success-text"]};case"failed":return{fill:tintOf(n.danger,.14,n["bg-subtle"]),ink:n["danger-text"]};case"refunded":return{fill:tintOf(n.info,.14,n["bg-subtle"]),ink:n["info-text"]};default:return{fill:n["bg-muted"],ink:n["text-muted"]}}},failedLead=(e,t,n,r)=>{if(!0===e){return`${t} will return to your account within ${n} working days.${r?` Reference ${r}.`:""}`}return!1===e?"No money was taken from your account. You can try again.":"We could not confirm whether money left your account. Check your bank statement before you try again."},leadFor=(e,t,n)=>{switch(e){case"success":return"Your payment has been received. Keep this receipt for your records.";case"pending":return"Your bank has not confirmed this payment yet.";case"refunded":return`${t} has been returned to your account.`;default:return n}},renderAction=e=>_jsx(Button,{title:e.title,size:"lg",fullWidth:!0,variant:e.variant,tone:e.tone,leftIcon:e.icon,loading:e.loading,onPress:e.onPress},e.key);export const PaymentResult=({status:e,amount:t,currency:n="INR",payee:r,reference:o,paidAt:i,method:s,rows:a,debited:l,refundDays:c=5,settlesBy:u,title:d,message:m,onShare:f,onDownload:p,onDone:h,onRetry:y,onRefresh:g,refreshing:b=!1,celebrate:x=!0,haptic:j=!0,style:S,testID:v})=>{const k=useTheme(),w=useReducedMotion(),T=useMemo(()=>buildStyles(k),[k]),_=useRef(null),I=useRef(null),A=STATUS[e],R=useMemo(()=>markColors(k,e),[k,e]),D=d??A.title,E=formatMinor(t,{currency:n,dropZeroDecimals:!0}),C=failedLead(l,E,c,o),P=m??leadFor(e,E,C),N=`${D}, ${E}${r&&"refunded"!==e?` to ${r}`:""}`,V=void 0===u?SETTLE_WINDOW:`Expected to settle by ${istStamp(u)}.`;useEffect(()=>{I.current!==e&&(I.current=e,announce(N,{polite:"failed"!==e}),j&&("success"===e?triggerHaptic("confirm"):"failed"===e&&triggerHaptic("reject")),"success"===e&&x&&_.current?.start())},[e]);const M=useSharedValue(.9),$=useSharedValue(0),W=k.motion.duration.default;useEffect(()=>(w?(M.value=1,$.value=1):"success"===e?($.value=0,$.value=withTiming(1,{duration:W}),M.value=.6,M.value=withSpring(1,{damping:12,stiffness:160})):($.value=0,$.value=withTiming(1,{duration:W}),M.value=.9,M.value=withTiming(1,{duration:W})),()=>{cancelAnimation(M),cancelAnimation($)}),[e,w,M,$,W]);const F=useAnimatedStyle(()=>({opacity:$.value,transform:[{scale:M.value}]})),H=useMemo(()=>{const e=[];if(r&&e.push({key:"payee",label:"Paid to",value:r}),s&&e.push({key:"method",label:"Method",value:s}),o){const t=/^\d+$/.test(o);e.push({key:"reference",label:"Reference",value:_jsx(Text,{selectable:!0,accessibilityLabel:t?o.split("").join(" "):void 0,style:T.tabular,children:o})})}void 0!==i&&e.push({key:"paidAt",label:"Date and time",value:istStamp(i)});for(const t of a??[])void 0!==t.value&&null!==t.value&&""!==t.value&&e.push(t);return e},[r,s,o,i,a,T.tabular]),O="pending"===e&&g?{key:"refresh",title:"Check status",onPress:g,icon:"refresh-cw",loading:b}:null,B=h?{key:"done",title:"Done",onPress:h}:null,L=("failed"===e&&!1===l&&y?{key:"retry",title:"Try again",onPress:y,icon:"refresh-cw"}:null)??O??B,Y=B&&L!==B?{...B,variant:"ghost",tone:"neutral"}:null,z=[];return f&&z.push({key:"share",title:"Share receipt",onPress:f,icon:"share",variant:"outline",tone:"neutral"}),p&&z.push({key:"download",title:"Download",onPress:p,icon:"download",variant:"outline",tone:"neutral"}),_jsxs(View,{style:[T.root,S],testID:v,accessibilityRole:"summary",children:[_jsxs(View,{style:T.header,children:[_jsx(Animated.View,{style:[T.mark,{backgroundColor:R.fill},F],accessibilityElementsHidden:!0,importantForAccessibility:"no-hide-descendants",children:_jsx(AppIcon,{name:A.icon,size:36,color:R.ink})}),_jsx(StatusBadge,{label:A.badge,tone:A.tone}),_jsx(Text,{variant:"h3",align:"center",children:D}),_jsx(Text,{variant:"h1",align:"center",style:T.tabular,children:E}),_jsx(Text,{variant:"body",color:"secondary",align:"center",children:P})]}),"pending"===e?_jsxs(View,{style:T.note,children:[_jsx(Text,{variant:"bodySmall",color:"secondary",children:V}),_jsx(Text,{variant:"bodySmall",weight:"semibold",children:PENDING_WARNING}),O?_jsx(Text,{variant:"bodySmall",color:"secondary",children:REFRESH_HINT}):null]}):null,H.length>0?_jsx(View,{style:T.receipt,children:_jsx(Descriptions,{items:H,columns:2,bordered:!0})}):null,L||z.length>0?_jsxs(View,{style:T.actions,children:[L?renderAction(L):null,z.length>0?_jsx(View,{style:T.pair,children:z.map(e=>_jsx(View,{style:T.pairItem,children:renderAction(e)},e.key))}):null,Y?renderAction(Y):null]}):null,"success"===e&&x?_jsx(Confetti,{ref:_,count:60,preset:"pop"}):null]})};const buildStyles=e=>StyleSheet.create({root:{gap:e.space.lg},header:{alignItems:"center",gap:e.space.sm},mark:{width:72,height:72,borderRadius:e.radius.pill,alignItems:"center",justifyContent:"center",marginBottom:e.space.xs,...smoothCorners},tabular:{fontVariant:["tabular-nums"]},note:{gap:e.space.xs,padding:e.space.md,borderRadius:e.radius.md,backgroundColor:e.colors["bg-subtle"],...smoothCorners},receipt:{paddingHorizontal:e.space.md,borderRadius:e.radius.lg,borderWidth:StyleSheet.hairlineWidth,borderColor:e.colors["border-subtle"],backgroundColor:e.colors.bg,...smoothCorners},actions:{gap:e.space.sm},pair:{flexDirection:"row",gap:e.space.sm},pairItem:{flex:1}});export default PaymentResult;

package/lib/module/components/PermissionPrompt/PermissionPrompt.js

@@ -1 +1 @@
-"use strict";import{useEffect,useMemo,useRef}from"react";import{StyleSheet,View}from"react-native";import{useTheme}from"../../theme/index.js";import{announce}from"../../utils/announce.js";import{Button}from"../Button/index.js";import{IconBadge}from"../IconBadge/index.js";import{Text}from"../Text/index.js";import{usePermissionPrompt}from"./usePermissionPrompt.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const ACCESS={camera:"Camera access",microphone:"Microphone access",photos:"Photo access",photosAdd:"Photo access",mediaLibrary:"Media library access",location:"Location access",locationAlways:"Location access",contacts:"Contacts access",calendar:"Calendar access",reminders:"Reminders access",notifications:"Notification access",bluetooth:"Bluetooth access",storage:"Storage access"},unavailableMessage=(e,s,t)=>{const i=ACCESS[e];return"unavailable"===s?`${i} is not available on this device.`:t?`${i} is off for this app. You can turn it on in Settings.`:`${i} is off, so this cannot be used right now.`};export const PermissionPrompt=({kind:e,title:s,reason:t,icon:i,onResult:n,fallback:a,haptic:o="selection",style:r,testID:c})=>{const l=useTheme(),u=useMemo(()=>buildStyles(l),[l]),m=usePermissionPrompt(e,{onResult:n}),p=unavailableMessage(e,m.status,m.showSettings),d=useRef(!1);if(useEffect(()=>{"explain"!==m.view?("unavailable"===m.view&&d.current&&announce(p),d.current=!1):d.current=!0},[m.view,p]),"explain"!==m.view&&"unavailable"!==m.view)return _jsx(View,{style:r,testID:c});const h="explain"===m.view;return _jsxs(View,{style:[u.root,r],testID:c,children:[_jsxs(View,{style:u.header,children:[i?_jsx(IconBadge,{icon:i,size:"lg",tone:h?"primary":"neutral"}):null,_jsx(Text,{variant:"h3",align:"center",children:s}),_jsx(Text,{variant:"body",color:"secondary",align:"center",children:h?t:p})]}),_jsxs(View,h?{style:u.actions,children:[_jsx(Button,{haptic:o,title:"Continue",size:"lg",fullWidth:!0,loading:m.requesting,onPress:()=>{m.request()}}),m.cancellable?_jsx(Button,{haptic:o,title:"Cancel",size:"lg",fullWidth:!0,variant:"ghost",tone:"neutral",disabled:m.requesting,onPress:m.cancel}):null]}:{style:u.actions,children:[a?_jsx(Button,{haptic:o,title:a.label,size:"lg",fullWidth:!0,onPress:a.onPress}):null,m.showSettings?_jsx(View,{style:u.link,children:_jsx(Button,{haptic:o,title:"Open Settings",variant:"link",onPress:()=>{m.openSettings()}})}):null]})]})};const buildStyles=e=>StyleSheet.create({root:{gap:e.spacing.lg,paddingVertical:e.spacing.lg},header:{alignItems:"center",gap:e.spacing.sm},actions:{gap:e.spacing.sm},link:{alignItems:"center",paddingVertical:e.spacing.sm}});export default PermissionPrompt;
+"use strict";import{useEffect,useMemo,useRef}from"react";import{StyleSheet,View}from"react-native";import{useTheme}from"../../theme/index.js";import{announce}from"../../utils/announce.js";import{Button}from"../Button/index.js";import{IconBadge}from"../IconBadge/index.js";import{Text}from"../Text/index.js";import{usePermissionPrompt}from"./usePermissionPrompt.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const ACCESS={camera:"Camera access",microphone:"Microphone access",photos:"Photo access",photosAdd:"Photo access",mediaLibrary:"Media library access",location:"Location access",locationAlways:"Location access",contacts:"Contacts access",calendar:"Calendar access",reminders:"Reminders access",notifications:"Notification access",bluetooth:"Bluetooth access",storage:"Storage access"},unavailableMessage=(e,s,t)=>{const i=ACCESS[e];return"unavailable"===s?`${i} is not available on this device.`:t?`${i} is off for this app. You can turn it on in Settings.`:`${i} is off, so this cannot be used right now.`};export const PermissionPrompt=({kind:e,title:s,reason:t,icon:i,onResult:n,fallback:a,haptic:o="selection",style:r,testID:c})=>{const l=useTheme(),u=useMemo(()=>buildStyles(l),[l]),m=usePermissionPrompt(e,{onResult:n}),p=unavailableMessage(e,m.status,m.showSettings),d=useRef(!1);if(useEffect(()=>{"explain"!==m.view?("unavailable"===m.view&&d.current&&announce(p),d.current=!1):d.current=!0},[m.view,p]),"explain"!==m.view&&"unavailable"!==m.view)return _jsx(View,{style:r,testID:c});const h="explain"===m.view;return _jsxs(View,{style:[u.root,r],testID:c,children:[_jsxs(View,{style:u.header,children:[i?_jsx(IconBadge,{icon:i,size:"lg",tone:h?"primary":"neutral"}):null,_jsx(Text,{variant:"h3",align:"center",children:s}),_jsx(Text,{variant:"body",color:"secondary",align:"center",children:h?t:p})]}),_jsxs(View,h?{style:u.actions,children:[_jsx(Button,{haptic:o,title:"Continue",size:"lg",fullWidth:!0,loading:m.requesting,onPress:()=>{m.request()}}),m.cancellable?_jsx(Button,{haptic:o,title:"Cancel",size:"lg",fullWidth:!0,variant:"ghost",tone:"neutral",disabled:m.requesting,onPress:m.cancel}):null]}:{style:u.actions,children:[a?_jsx(Button,{haptic:o,title:a.label,size:"lg",fullWidth:!0,onPress:a.onPress}):null,m.showSettings?_jsx(View,{style:u.link,children:_jsx(Button,{haptic:o,title:"Open Settings",variant:"link",onPress:()=>{m.openSettings()}})}):null]})]})};const buildStyles=e=>StyleSheet.create({root:{gap:e.space.lg,paddingVertical:e.space.lg},header:{alignItems:"center",gap:e.space.sm},actions:{gap:e.space.sm},link:{alignItems:"center",paddingVertical:e.space.sm}});export default PermissionPrompt;

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

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

package/lib/module/components/PickerTrigger/PickerTrigger.js

@@ -1 +1 @@
-"use strict";import{forwardRef,useMemo}from"react";import{StyleSheet,Text,View}from"react-native";import{resolveFieldSize,useTheme}from"../../theme/index.js";import{FieldBase,FieldLabel,FieldMessage,fieldTextAsString,hasFieldText,RequiredMark,resolveFieldTextStyle}from"../FieldBase/index.js";import{Chevron}from"../FieldBase/Chevron.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const PickerTrigger=forwardRef((e,l)=>{const{value:i,placeholder:t,label:r,help:s,helperText:o,error:a,required:d=!1,onPress:n,clearable:c=!1,onClear:x,leadingIcon:g,trailing:u,disabled:y=!1,size:b="md",variant:h,style:m,triggerStyle:S,valueStyle:f,labelStyle:T,messageStyle:F,accessibilityLabel:j,testID:p}=e,v=useTheme(),P=useMemo(()=>buildStyles(v),[v]),_=resolveFieldSize(v,b),w=resolveFieldTextStyle(v,{disabled:y}),z="string"==typeof i&&i.length>0,R=!0===a||hasFieldText(a),k=hasFieldText(r),C=z?i:t??"Select…",L=z?w.color:w.placeholderColor,M=z?`${fieldTextAsString(r)??"Selection"}: ${i}`:t??"No selection",q=j??M,B={disabled:y},I=void 0===u,D=c&&z&&!y;return _jsxs(View,{style:[P.root,m],testID:p,children:[k?_jsx(FieldLabel,{size:b,required:d,help:s,style:T,children:r}):null,_jsx(FieldBase,{size:b,variant:h,disabled:y,error:R,filled:z,onPress:n,leading:g,trailing:D||I||null!==u?_jsxs(View,{style:P.trailingRow,children:[D?_jsx(Text,{onPress:()=>{y||x?.()},accessibilityRole:"button",accessibilityLabel:"Clear",style:{fontSize:_.icon,color:v.colors.text.secondary,paddingHorizontal:v.spacing.xs},children:"×"}):null,void 0!==u?u:I?_jsx(Chevron,{size:_.icon,color:y?v.colors.text.disabled:v.colors.text.tertiary}):null]}):null,accessibilityLabel:q,accessibilityState:B,accessibilityRole:"button",style:S,children:_jsxs(Text,{numberOfLines:1,style:[P.valueText,{color:L,fontSize:_.text,...w.weightStyle},f],children:[C,z||!d||k?null:_jsx(RequiredMark,{})]})}),_jsx(FieldMessage,{size:b,error:R,text:R?a:o,style:F})]})});PickerTrigger.displayName="PickerTrigger";const buildStyles=e=>StyleSheet.create({root:{width:"100%"},label:{includeFontPadding:!1},valueText:{flex:1,includeFontPadding:!1},message:{includeFontPadding:!1},trailingRow:{flexDirection:"row",alignItems:"center"}});export{PickerTrigger};export default PickerTrigger;
+"use strict";import{forwardRef,useMemo}from"react";import{StyleSheet,Text,View}from"react-native";import{resolveFieldSize,useTheme}from"../../theme/index.js";import{FieldBase,FieldLabel,FieldMessage,fieldTextAsString,hasFieldText,RequiredMark,resolveFieldTextStyle}from"../FieldBase/index.js";import{Chevron}from"../FieldBase/Chevron.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const PickerTrigger=forwardRef((e,l)=>{const{value:i,placeholder:t,label:r,help:s,helperText:o,error:a,required:d=!1,onPress:n,clearable:c=!1,onClear:x,leadingIcon:g,trailing:u,disabled:y=!1,size:b="md",variant:h,style:m,triggerStyle:S,valueStyle:f,labelStyle:T,messageStyle:F,accessibilityLabel:j,testID:p}=e,v=useTheme(),P=useMemo(()=>buildStyles(v),[v]),_=resolveFieldSize(v,b),w=resolveFieldTextStyle(v,{disabled:y}),z="string"==typeof i&&i.length>0,R=!0===a||hasFieldText(a),k=hasFieldText(r),C=z?i:t??"Select…",L=z?w.color:w.placeholderColor,M=z?`${fieldTextAsString(r)??"Selection"}: ${i}`:t??"No selection",q=j??M,B={disabled:y},I=void 0===u,D=c&&z&&!y;return _jsxs(View,{style:[P.root,m],testID:p,children:[k?_jsx(FieldLabel,{size:b,required:d,help:s,style:T,children:r}):null,_jsx(FieldBase,{size:b,variant:h,disabled:y,error:R,filled:z,onPress:n,leading:g,trailing:D||I||null!==u?_jsxs(View,{style:P.trailingRow,children:[D?_jsx(Text,{onPress:()=>{y||x?.()},accessibilityRole:"button",accessibilityLabel:"Clear",style:{fontSize:_.icon,color:v.colors["text-muted"],paddingHorizontal:v.space.xs},children:"×"}):null,void 0!==u?u:I?_jsx(Chevron,{size:_.icon,color:y?v.colors["text-disabled"]:v.colors["text-subtle"]}):null]}):null,accessibilityLabel:q,accessibilityState:B,accessibilityRole:"button",style:S,children:_jsxs(Text,{numberOfLines:1,style:[P.valueText,{color:L,fontSize:_.text,...w.weightStyle},f],children:[C,z||!d||k?null:_jsx(RequiredMark,{})]})}),_jsx(FieldMessage,{size:b,error:R,text:R?a:o,style:F})]})});PickerTrigger.displayName="PickerTrigger";const buildStyles=e=>StyleSheet.create({root:{width:"100%"},label:{includeFontPadding:!1},valueText:{flex:1,includeFontPadding:!1},message:{includeFontPadding:!1},trailingRow:{flexDirection:"row",alignItems:"center"}});export{PickerTrigger};export default PickerTrigger;

package/lib/module/components/ProfileCompletion/ProfileCompletion.js

@@ -1 +1 @@
-"use strict";import{forwardRef,useMemo}from"react";import{StyleSheet,Text,View}from"react-native";import{fontFor,useTheme}from"../../theme/index.js";import{smoothCorners}from"../../utils/corners.js";import{AppIcon}from"../AppIcon/index.js";import{Avatar}from"../Avatar/index.js";import{ProgressRing}from"../ProgressRing/index.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const DEFAULT_AVATAR_SIZE=56,DEFAULT_RING_WIDTH=3,DEFAULT_RING_GAP=1,ProfileCompletion=forwardRef((e,t)=>{const{progress:o,title:r,subtitle:i,description:s,source:n,ImageComponent:l,size:a=DEFAULT_AVATAR_SIZE,avatarTone:c="neutral",avatarBackgroundColor:m,avatarColor:p,ringWidth:d,ringGap:g=DEFAULT_RING_GAP,ringVariant:u="banded",tone:y,ringColor:f,animated:x=!0,showCompleteBadge:h=!0,trailing:b,accessibilityLabel:_,style:j,titleStyle:S,subtitleStyle:w,descriptionStyle:A,testID:I}=e,C=useTheme(),T=useMemo(()=>buildStyles(C),[C]),R=d??C.components.progressRing?.strokeWidth??3,D=a+2*(g+R),v=Math.min(100,Math.max(0,Number.isNaN(o)?0:o)),z=Math.round(v),P=_??`${r}, profile ${z}% complete`,V=I??"profile-completion",L=h&&v>=100,F=Math.max(16,Math.round(.3*D)),G=D/2*(1+Math.SQRT1_2)-R/2,E=f??("banded"===u&&null==y||"success"===y?C.colors.success:"warning"===y?C.colors.warning:"error"===y?C.colors.error:C.colors.primary);return _jsxs(View,{ref:t,style:[T.root,j],testID:I,children:[_jsxs(View,{style:T.summary,accessible:!0,accessibilityRole:"summary",accessibilityLabel:P,accessibilityValue:{min:0,max:100,now:z},testID:`${V}-summary`,children:[_jsxs(View,{style:{width:D,height:D},children:[_jsx(ProgressRing,{progress:v/100,size:D,strokeWidth:R,tone:y??"primary",ringColor:f,colorByProgress:"banded"===u&&null==y&&null==f,animated:x,testID:`${V}-ring`,children:_jsx(Avatar,{name:r,source:n,ImageComponent:l,size:a,tone:c,backgroundColor:m,color:p,accessibilityLabel:`${r}'s avatar`})}),L?_jsx(View,{pointerEvents:"none",style:[T.badge,{width:F,height:F,borderRadius:C.radius.pill,...smoothCorners,left:G-F/2,top:G-F/2,backgroundColor:C.colors.background.elevated}],testID:`${V}-complete-badge`,children:_jsx(AppIcon,{name:"verify",variant:"bold",size:F-2,color:E})}):null]}),_jsxs(View,{style:T.body,children:[_jsx(Text,{style:[T.title,S],numberOfLines:2,children:r}),i?_jsx(Text,{style:[T.subtitle,w],numberOfLines:1,children:i}):null,s?_jsx(Text,{style:[T.description,A],children:s}):null]})]}),null!=b?_jsx(View,{style:T.trailing,children:b}):null]})});ProfileCompletion.displayName="ProfileCompletion";const buildStyles=e=>StyleSheet.create({root:{flexDirection:"row",alignItems:"center",columnGap:e.spacing.md},summary:{flex:1,flexDirection:"row",alignItems:"center",columnGap:e.spacing.md},body:{flex:1,rowGap:e.spacing.xxs},badge:{position:"absolute",alignItems:"center",justifyContent:"center"},title:{fontSize:e.typography.fontSize.xl,lineHeight:e.typography.fontSize.xl*e.typography.lineHeight.tight,color:e.colors.text.primary,...fontFor(e,"semibold")},subtitle:{fontSize:e.typography.fontSize.sm,color:e.colors.text.tertiary,textTransform:"uppercase",letterSpacing:e.typography.letterSpacing.wide,...fontFor(e,"medium")},description:{fontSize:e.typography.fontSize.base,color:e.colors.text.secondary,...fontFor(e,"normal")},trailing:{alignSelf:"flex-start"}});export{ProfileCompletion};export default ProfileCompletion;
+"use strict";import{forwardRef,useMemo}from"react";import{StyleSheet,Text,View}from"react-native";import{fontFor,useTheme}from"../../theme/index.js";import{smoothCorners}from"../../utils/corners.js";import{AppIcon}from"../AppIcon/index.js";import{Avatar}from"../Avatar/index.js";import{ProgressRing}from"../ProgressRing/index.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const DEFAULT_AVATAR_SIZE=56,DEFAULT_RING_WIDTH=3,DEFAULT_RING_GAP=1,ProfileCompletion=forwardRef((e,t)=>{const{progress:o,title:r,subtitle:i,description:s,source:l,ImageComponent:n,size:a=DEFAULT_AVATAR_SIZE,avatarTone:c="neutral",avatarBackgroundColor:m,avatarColor:d,ringWidth:p,ringGap:u=DEFAULT_RING_GAP,ringVariant:x="banded",tone:g,ringColor:f,animated:b=!0,showCompleteBadge:y=!0,trailing:h,accessibilityLabel:_,style:j,titleStyle:w,subtitleStyle:A,descriptionStyle:I,testID:C}=e,S=useTheme(),T=useMemo(()=>buildStyles(S),[S]),D=p??3,R=a+2*(u+D),v=Math.min(100,Math.max(0,Number.isNaN(o)?0:o)),z=Math.round(v),P=_??`${r}, profile ${z}% complete`,V=C??"profile-completion",L=y&&v>=100,F=Math.max(16,Math.round(.3*R)),G=R/2*(1+Math.SQRT1_2)-D/2,E=f??("banded"===x&&null==g||"success"===g?S.colors.success:"warning"===g?S.colors.warning:"danger"===g?S.colors.danger:S.colors.primary);return _jsxs(View,{ref:t,style:[T.root,j],testID:C,children:[_jsxs(View,{style:T.summary,accessible:!0,accessibilityRole:"summary",accessibilityLabel:P,accessibilityValue:{min:0,max:100,now:z},testID:`${V}-summary`,children:[_jsxs(View,{style:{width:R,height:R},children:[_jsx(ProgressRing,{progress:v/100,size:R,strokeWidth:D,tone:g??"primary",ringColor:f,colorByProgress:"banded"===x&&null==g&&null==f,animated:b,testID:`${V}-ring`,children:_jsx(Avatar,{name:r,source:l,ImageComponent:n,size:a,tone:c,backgroundColor:m,color:d,accessibilityLabel:`${r}'s avatar`})}),L?_jsx(View,{pointerEvents:"none",style:[T.badge,{width:F,height:F,borderRadius:S.radius.pill,...smoothCorners,left:G-F/2,top:G-F/2,backgroundColor:S.colors.surface}],testID:`${V}-complete-badge`,children:_jsx(AppIcon,{name:"verify",variant:"bold",size:F-2,color:E})}):null]}),_jsxs(View,{style:T.body,children:[_jsx(Text,{style:[T.title,w],numberOfLines:2,children:r}),i?_jsx(Text,{style:[T.subtitle,A],numberOfLines:1,children:i}):null,s?_jsx(Text,{style:[T.description,I],children:s}):null]})]}),null!=h?_jsx(View,{style:T.trailing,children:h}):null]})});ProfileCompletion.displayName="ProfileCompletion";const buildStyles=e=>StyleSheet.create({root:{flexDirection:"row",alignItems:"center",columnGap:e.space.md},summary:{flex:1,flexDirection:"row",alignItems:"center",columnGap:e.space.md},body:{flex:1,rowGap:e.space.xxs},badge:{position:"absolute",alignItems:"center",justifyContent:"center"},title:{fontSize:e.text.xl.size,lineHeight:e.text.xl.size*e.leading.tight,color:e.colors["text-body"],...fontFor(e,"semibold")},subtitle:{fontSize:e.text.sm.size,color:e.colors["text-subtle"],textTransform:"uppercase",letterSpacing:e["letter-spacing"].wide,...fontFor(e,"medium")},description:{fontSize:e.text.base.size,color:e.colors["text-muted"],...fontFor(e,"normal")},trailing:{alignSelf:"flex-start"}});export{ProfileCompletion};export default ProfileCompletion;

package/lib/module/components/ProfilePicker/ProfilePicker.js

@@ -1 +1 @@
-"use strict";import{forwardRef,useCallback,useMemo,useRef,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{blendOf}from"../../utils/color.js";import{smoothCorners}from"../../utils/corners.js";import{AppIcon}from"../AppIcon/index.js";import{renderSlotIcon}from"../AppIcon/slotIcon.js";import{Avatar,avatarToneColors}from"../Avatar/index.js";import{FieldLabel,FieldMessage,fieldTextAsString,hasFieldText}from"../FieldBase/index.js";import{matchesAccept}from"../FilePicker/FilePicker.js";import{OptionSheet}from"../OptionSheet/OptionSheet.js";import{Spinner}from"../Spinner/index.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const DEFAULT_LABELS={pick:"Change profile photo",remove:"Remove photo",sheetTitle:"Change photo",errorTooLarge:e=>`The photo is larger than ${e} MB.`,errorWrongType:"That file is not a supported image."},DEFAULT_ACCEPT=["image/*"],SHEET_ICON_SIZE=20,SOFT_FILL_OPACITY=.14,SIZE_PX={sm:72,md:120,lg:160},clamp=(e,r,o)=>Math.min(o,Math.max(r,e)),toneFor=(e,r)=>{switch(r){case"success":return{base:e.colors.success,on:e.colors.onSuccess};case"warning":return{base:e.colors.warning,on:e.colors.onWarning};case"error":return{base:e.colors.error,on:e.colors.onError};case"info":return{base:e.colors.info,on:e.colors.onInfo};case"neutral":return{base:e.colors.text.secondary,on:e.colors.onNeutral};default:return{base:e.colors.primary,on:e.colors.onPrimary}}},badgeLookFor=(e,r,o,t)=>{const s=toneFor(e,r),n=t?.badgeColor??s.base,i=e.colors.background.primary,l="neutral"===r&&void 0===t?.badgeColor;let a;switch(o){case"soft":a={fill:l?e.colors.background.tertiary:blendOf(n,.14,i,e.colors.background.secondary),ring:i,icon:n};break;case"outline":a={fill:i,ring:l?e.colors.border.primary:n,icon:n};break;default:a={fill:n,ring:i,icon:s.on}}return t?.badgeIconColor?{...a,icon:t.badgeIconColor}:a},resolveRadius=(e,r)=>"circle"===e?r/2:"rounded"===e?Math.max(6,Math.round(.22*r)):0,REMOVE_VALUE="__profile-picker-remove__",ProfilePicker=forwardRef((e,r)=>{const{value:o,name:t,sources:s,onPick:n,onRemove:i,loading:l=!1,disabled:a=!1,accept:c=DEFAULT_ACCEPT,maxSizeMB:d,size:u="md",shape:m="circle",badgeIcon:p="camera",tone:g,variant:b,avatarTone:f,avatarBackgroundColor:h,avatarColor:y,label:x,required:k=!1,helperText:C,error:v,layout:S="stacked",title:_,subtitle:j,ImageComponent:T,labels:I,haptic:F,onError:A,accessibilityLabel:P,style:w,testID:E}=e,L=useTheme(),M=L.components.profilePicker,R=g??M?.defaultTone??"primary",O=b??M?.defaultVariant??"solid",V=useMemo(()=>badgeLookFor(L,R,O,M),[L,R,O,M]),z=f??M?.defaultAvatarTone,D=useMemo(()=>{const e=z?avatarToneColors(L,z):null;return{background:h??e?.background??L.colors.background.tertiary,icon:y??e?.color??L.colors.text.tertiary}},[L,z,h,y]),B=useMemo(()=>({...DEFAULT_LABELS,...I}),[I]),[H,U]=useState(null),[W,$]=useState(null),[N,Z]=useState(!1),[q,G]=useState(o);o!==q&&(G(o),U(null));const X=l||a,Q=H??o??null,Y=v??W??void 0,J=!X&&(null!==H||Boolean(o)&&Boolean(i)),K=s.length>0||J,ee="number"==typeof u?u:SIZE_PX[u],re=resolveRadius(m,ee),oe=re*(1-Math.SQRT1_2),te=clamp(Math.round(.28*ee),24,44),se=oe-te/2,ne=Math.max(0,-se),ie=useCallback(e=>{$(e),A?.(e),!1!==F&&triggerHaptic("notificationError")},[A,F]),le=useCallback(async e=>{let r;try{r=await e.pick()}catch(e){return void ie(e instanceof Error?e.message:String(e))}const o=r?.[0];if(!o)return;if("number"==typeof d&&"number"==typeof o.size&&o.size>1024*d*1024)return void ie(B.errorTooLarge(d));if(o.type&&!matchesAccept(o.type,c))return void ie(B.errorWrongType);$(null),U(o.uri);const t=resolveHaptic(F,"selection");t&&triggerHaptic(t),n?.(o)},[d,c,B,F,n,ie]),ae=useCallback(()=>{X||(ue.current=null,1!==s.length||J?(s.length>0||J)&&Z(!0):le(s[0]))},[X,s,J,le]),ce=useCallback(()=>{U(null),$(null);const e=resolveHaptic(F,"selection");e&&triggerHaptic(e),i?.()},[F,i]),de=useMemo(()=>{const e=s.map(e=>({kind:"source",source:e}));return J&&e.push({kind:"remove"}),e},[s,J]),ue=useRef(null),me=useCallback(e=>{ue.current||(Z(!1),"remove"===e.kind?ce():ue.current=e.source)},[ce]),pe=useCallback(()=>{const e=ue.current;ue.current=null,e&&le(e)},[le]),ge=E??"profile-picker",be=P??(K?B.pick:t),fe=_jsx(View,{style:[styles.fill,{width:ee,height:ee,borderRadius:re,...smoothCorners,backgroundColor:D.background}],children:_jsx(AppIcon,{name:"user",size:Math.round(.45*ee),color:D.icon})}),he=_jsx(View,{style:{width:ee,height:ee,marginBottom:ne,marginRight:ne},children:_jsxs(Pressable,{onPress:ae,disabled:X||!K,accessibilityRole:K?"button":"image",accessibilityLabel:be,accessibilityHint:fieldTextAsString(Y),accessibilityState:K?{disabled:X,busy:l}:{busy:l},"aria-disabled":K?X:void 0,"aria-busy":l,testID:`${ge}-button`,style:({pressed:e})=>[{width:ee,height:ee,borderRadius:re,...smoothCorners},{opacity:a?.55:e?.85:1}],children:[Q||t?_jsx(Avatar,{source:Q?{uri:Q}:void 0,name:t,size:ee,shape:m,tone:z,backgroundColor:h,color:y,ImageComponent:T,accessibilityLabel:be},Q??"initials"):fe,l?_jsx(View,{style:[styles.fill,styles.overlay,{borderRadius:re,...smoothCorners,backgroundColor:L.colors.background.overlay}],testID:`${ge}-loading`,children:_jsx(Spinner,{size:ee>=100?"md":"sm",color:L.colors.onPrimary})}):null,!a&&K?_jsx(View,{pointerEvents:"none",testID:`${ge}-badge`,style:[styles.badge,{width:te,height:te,borderRadius:L.radius.pill,...smoothCorners,right:se,bottom:se,backgroundColor:V.fill,borderColor:V.ring}],children:renderSlotIcon(p,{color:V.icon,size:Math.round(.55*te),disabled:!1})}):null]})}),ye="stacked"!==S?_jsxs(View,{style:[styles.meta,"profile"===S?styles.metaCentred:null],children:[_?_jsx(Text,{style:[styles.title,"profile"===S?styles.textCentred:null,{color:L.colors.text.primary,fontSize:L.typography.fontSize.base,...fontFor(L,"semibold")}],children:_}):null,j?_jsx(Text,{style:[styles.subtitle,"profile"===S?styles.textCentred:null,{color:L.colors.text.secondary,fontSize:L.typography.fontSize.sm,marginTop:L.spacing.xxs,...fontFor(L,"normal")}],children:j}):null,_jsx(FieldMessage,{text:Y??C,error:hasFieldText(Y)})]}):_jsx(FieldMessage,{text:Y??C,error:hasFieldText(Y)});return _jsxs(View,{ref:r,style:w,testID:E,children:[x?_jsx(FieldLabel,{required:k,children:x}):null,_jsxs(View,{style:"inline"===S?[styles.row,{columnGap:L.spacing.md}]:["profile"===S?styles.columnCentred:styles.column,{rowGap:L.spacing.xs}],children:[he,ye]}),_jsx(OptionSheet,{open:N,onClose:()=>Z(!1),onAfterClose:pe,title:B.sheetTitle,options:de,labelOf:e=>{const r=e;return"remove"===r.kind?B.remove:r.source.label},getValue:e=>{const r=e;return"remove"===r.kind?REMOVE_VALUE:r.source.key},disabledOf:()=>!1,destructiveOf:e=>"remove"===e.kind,descriptionOf:e=>{const r=e;return"remove"===r.kind?void 0:r.source.description},iconOf:e=>{const r=e;return"remove"===r.kind?_jsx(AppIcon,{name:"trash",size:20,color:L.colors.toneText.error}):r.source.icon},isSelected:()=>!1,onSelect:e=>me(e)})]})});ProfilePicker.displayName="ProfilePicker";const styles=StyleSheet.create({fill:{alignItems:"center",justifyContent:"center",overflow:"hidden"},overlay:{...StyleSheet.absoluteFill},badge:{position:"absolute",alignItems:"center",justifyContent:"center",borderWidth:2},row:{flexDirection:"row",alignItems:"center"},column:{alignItems:"flex-start"},columnCentred:{alignItems:"center"},meta:{flexShrink:1},metaCentred:{alignItems:"center"},title:{includeFontPadding:!1},subtitle:{includeFontPadding:!1},textCentred:{textAlign:"center"}});export{ProfilePicker};export default ProfilePicker;
+"use strict";import{forwardRef,useCallback,useMemo,useRef,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{blendOf}from"../../utils/color.js";import{smoothCorners}from"../../utils/corners.js";import{AppIcon}from"../AppIcon/index.js";import{renderSlotIcon}from"../AppIcon/slotIcon.js";import{Avatar,avatarToneColors}from"../Avatar/index.js";import{FieldLabel,FieldMessage,fieldTextAsString,hasFieldText}from"../FieldBase/index.js";import{matchesAccept}from"../FilePicker/FilePicker.js";import{OptionSheet}from"../OptionSheet/OptionSheet.js";import{Spinner}from"../Spinner/index.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const DEFAULT_LABELS={pick:"Change profile photo",remove:"Remove photo",sheetTitle:"Change photo",errorTooLarge:e=>`The photo is larger than ${e} MB.`,errorWrongType:"That file is not a supported image."},DEFAULT_ACCEPT=["image/*"],SHEET_ICON_SIZE=20,SOFT_FILL_OPACITY=.14,SIZE_PX={sm:72,md:120,lg:160},clamp=(e,o,r)=>Math.min(r,Math.max(o,e)),toneFor=(e,o)=>{switch(o){case"success":return{base:e.colors.success,on:e.colors["on-success"]};case"warning":return{base:e.colors.warning,on:e.colors["on-warning"]};case"danger":return{base:e.colors.danger,on:e.colors["on-danger"]};case"info":return{base:e.colors.info,on:e.colors["on-info"]};case"neutral":return{base:e.colors["text-muted"],on:e.colors["on-neutral-strong"]};default:return{base:e.colors.primary,on:e.colors["on-primary"]}}},badgeLookFor=(e,o,r)=>{const t=toneFor(e,o),s=t.base,l=e.colors.bg,i="neutral"===o;let n;switch(r){case"soft":n={fill:i?e.colors["bg-muted"]:blendOf(s,.14,l,e.colors["bg-subtle"]),ring:l,icon:s};break;case"outline":n={fill:l,ring:i?e.colors.border:s,icon:s};break;default:n={fill:s,ring:l,icon:t.on}}return n},resolveRadius=(e,o)=>"circle"===e?o/2:"rounded"===e?Math.max(6,Math.round(.22*o)):0,REMOVE_VALUE="__profile-picker-remove__",ProfilePicker=forwardRef((e,o)=>{const{value:r,name:t,sources:s,onPick:l,onRemove:i,loading:n=!1,disabled:a=!1,accept:c=DEFAULT_ACCEPT,maxSizeMB:u,size:d="md",shape:m="circle",badgeIcon:p="camera",tone:b,variant:g,avatarTone:f,avatarBackgroundColor:h,avatarColor:x,label:y,required:k=!1,helperText:C,error:v,layout:S="stacked",title:_,subtitle:j,ImageComponent:T,labels:I,haptic:F,onError:A,accessibilityLabel:w,style:E,testID:P}=e,L=useTheme(),M=L.settings.components["profile-picker"],R=b??M?.defaultTone??"primary",O=g??M?.defaultVariant??"solid",V=useMemo(()=>badgeLookFor(L,R,O),[L,R,O]),z=f??M?.defaultAvatarTone,D=useMemo(()=>{const e=z?avatarToneColors(L,z):null;return{background:h??e?.background??L.colors["bg-muted"],icon:x??e?.color??L.colors["text-subtle"]}},[L,z,h,x]),B=useMemo(()=>({...DEFAULT_LABELS,...I}),[I]),[H,U]=useState(null),[$,W]=useState(null),[Z,q]=useState(!1),[G,N]=useState(r);r!==G&&(N(r),U(null));const X=n||a,Q=H??r??null,Y=v??$??void 0,J=!X&&(null!==H||Boolean(r)&&Boolean(i)),K=s.length>0||J,ee="number"==typeof d?d:SIZE_PX[d],oe=resolveRadius(m,ee),re=oe*(1-Math.SQRT1_2),te=clamp(Math.round(.28*ee),24,44),se=re-te/2,le=Math.max(0,-se),ie=useCallback(e=>{W(e),A?.(e),!1!==F&&triggerHaptic("notificationError")},[A,F]),ne=useCallback(async e=>{let o;try{o=await e.pick()}catch(e){return void ie(e instanceof Error?e.message:String(e))}const r=o?.[0];if(!r)return;if("number"==typeof u&&"number"==typeof r.size&&r.size>1024*u*1024)return void ie(B.errorTooLarge(u));if(r.type&&!matchesAccept(r.type,c))return void ie(B.errorWrongType);W(null),U(r.uri);const t=resolveHaptic(F,"selection");t&&triggerHaptic(t),l?.(r)},[u,c,B,F,l,ie]),ae=useCallback(()=>{X||(de.current=null,1!==s.length||J?(s.length>0||J)&&q(!0):ne(s[0]))},[X,s,J,ne]),ce=useCallback(()=>{U(null),W(null);const e=resolveHaptic(F,"selection");e&&triggerHaptic(e),i?.()},[F,i]),ue=useMemo(()=>{const e=s.map(e=>({kind:"source",source:e}));return J&&e.push({kind:"remove"}),e},[s,J]),de=useRef(null),me=useCallback(e=>{de.current||(q(!1),"remove"===e.kind?ce():de.current=e.source)},[ce]),pe=useCallback(()=>{const e=de.current;de.current=null,e&&ne(e)},[ne]),be=P??"profile-picker",ge=w??(K?B.pick:t),fe=_jsx(View,{style:[styles.fill,{width:ee,height:ee,borderRadius:oe,...smoothCorners,backgroundColor:D.background}],children:_jsx(AppIcon,{name:"user",size:Math.round(.45*ee),color:D.icon})}),he=_jsx(View,{style:{width:ee,height:ee,marginBottom:le,marginRight:le},children:_jsxs(Pressable,{onPress:ae,disabled:X||!K,accessibilityRole:K?"button":"image",accessibilityLabel:ge,accessibilityHint:fieldTextAsString(Y),accessibilityState:K?{disabled:X,busy:n}:{busy:n},"aria-disabled":K?X:void 0,"aria-busy":n,testID:`${be}-button`,style:({pressed:e})=>[{width:ee,height:ee,borderRadius:oe,...smoothCorners},{opacity:a?.55:e?.85:1}],children:[Q||t?_jsx(Avatar,{source:Q?{uri:Q}:void 0,name:t,size:ee,shape:m,tone:z,backgroundColor:h,color:x,ImageComponent:T,accessibilityLabel:ge},Q??"initials"):fe,n?_jsx(View,{style:[styles.fill,styles.overlay,{borderRadius:oe,...smoothCorners,backgroundColor:L.colors.scrim}],testID:`${be}-loading`,children:_jsx(Spinner,{size:ee>=100?"md":"sm",color:L.colors["on-primary"]})}):null,!a&&K?_jsx(View,{pointerEvents:"none",testID:`${be}-badge`,style:[styles.badge,{width:te,height:te,borderRadius:L.radius.pill,...smoothCorners,right:se,bottom:se,backgroundColor:V.fill,borderColor:V.ring}],children:renderSlotIcon(p,{color:V.icon,size:Math.round(.55*te),disabled:!1})}):null]})}),xe="stacked"!==S?_jsxs(View,{style:[styles.meta,"profile"===S?styles.metaCentred:null],children:[_?_jsx(Text,{style:[styles.title,"profile"===S?styles.textCentred:null,{color:L.colors["text-body"],fontSize:L.text.base.size,...fontFor(L,"semibold")}],children:_}):null,j?_jsx(Text,{style:[styles.subtitle,"profile"===S?styles.textCentred:null,{color:L.colors["text-muted"],fontSize:L.text.sm.size,marginTop:L.space.xxs,...fontFor(L,"normal")}],children:j}):null,_jsx(FieldMessage,{text:Y??C,error:hasFieldText(Y)})]}):_jsx(FieldMessage,{text:Y??C,error:hasFieldText(Y)});return _jsxs(View,{ref:o,style:E,testID:P,children:[y?_jsx(FieldLabel,{required:k,children:y}):null,_jsxs(View,{style:"inline"===S?[styles.row,{columnGap:L.space.md}]:["profile"===S?styles.columnCentred:styles.column,{rowGap:L.space.xs}],children:[he,xe]}),_jsx(OptionSheet,{open:Z,onClose:()=>q(!1),onAfterClose:pe,title:B.sheetTitle,options:ue,labelOf:e=>{const o=e;return"remove"===o.kind?B.remove:o.source.label},getValue:e=>{const o=e;return"remove"===o.kind?REMOVE_VALUE:o.source.key},disabledOf:()=>!1,destructiveOf:e=>"remove"===e.kind,descriptionOf:e=>{const o=e;return"remove"===o.kind?void 0:o.source.description},iconOf:e=>{const o=e;return"remove"===o.kind?_jsx(AppIcon,{name:"trash",size:20,color:L.colors["danger-text"]}):o.source.icon},isSelected:()=>!1,onSelect:e=>me(e)})]})});ProfilePicker.displayName="ProfilePicker";const styles=StyleSheet.create({fill:{alignItems:"center",justifyContent:"center",overflow:"hidden"},overlay:{...StyleSheet.absoluteFill},badge:{position:"absolute",alignItems:"center",justifyContent:"center",borderWidth:2},row:{flexDirection:"row",alignItems:"center"},column:{alignItems:"flex-start"},columnCentred:{alignItems:"center"},meta:{flexShrink:1},metaCentred:{alignItems:"center"},title:{includeFontPadding:!1},subtitle:{includeFontPadding:!1},textCentred:{textAlign:"center"}});export{ProfilePicker};export default ProfilePicker;

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

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

package/lib/module/components/ProgressRing/ProgressRing.js

@@ -1 +1 @@
-"use strict";import{forwardRef,useEffect,useMemo,useRef}from"react";import{Animated,Easing,StyleSheet,View}from"react-native";import Svg,{Circle}from"react-native-svg";import{useReducedMotion}from"../../hooks/index.js";import{createAnimatedValue,useTheme}from"../../theme/index.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const AnimatedCircle=Animated.createAnimatedComponent(Circle),toneColor=(e,r)=>{switch(r){case"success":return e.colors.success;case"warning":return e.colors.warning;case"error":return e.colors.error;default:return e.colors.primary}},clampProgress=e=>"number"!=typeof e||Number.isNaN(e)?0:Math.min(1,Math.max(0,e)),DEFAULT_STROKE_WIDTH=4,DEFAULT_DURATION=600,DEFAULT_COLOR_STOPS=[1/3,2/3],STOP_EDGE=1e-4,ProgressRing=forwardRef((e,r)=>{const{progress:t,size:o=48,strokeWidth:s,tone:i="primary",trackColor:n,ringColor:a,colorByProgress:c=!1,animated:l=!0,rounded:u=!0,children:m,accessibilityLabel:d,style:g,testID:p}=e,f=useTheme(),h=f.components.progressRing,R=useReducedMotion(),y=clampProgress(t),x=s??h?.strokeWidth??4,b=h?.animationDuration??600,w=n??h?.trackColor??f.colors.surface.disabled,[C,S]=h?.colorStops??DEFAULT_COLOR_STOPS,_=Math.max(0,(o-x)/2),j=2*Math.PI*_,D=useRef(createAnimatedValue(y)).current;useEffect(()=>{if(!l||R)return void D.setValue(y);const e=Animated.timing(D,{toValue:y,duration:b,easing:Easing.bezier(...f.motion.easing.standard),useNativeDriver:!1});return e.start(),()=>e.stop()},[l,y,b,D,R,f.motion.easing.standard]);const k=D.interpolate({inputRange:[0,1],outputRange:[j,0]}),A=D.interpolate({inputRange:[0,.001,1],outputRange:[0,1,1]}),E=useMemo(()=>D.interpolate({inputRange:[0,C-1e-4,C,S-1e-4,S,1],outputRange:[f.colors.error,f.colors.error,f.colors.warning,f.colors.warning,f.colors.success,f.colors.success]}),[D,C,S,f.colors.error,f.colors.warning,f.colors.success]),P=a??(c?E:toneColor(f,i)),T=useMemo(()=>buildStyles(),[]),v=o/2;return _jsxs(View,{ref:r,accessible:null==m,accessibilityRole:"progressbar",accessibilityLabel:d,accessibilityValue:{min:0,max:100,now:Math.round(100*y)},testID:p,style:[T.root,{width:o,height:o},g],children:[_jsxs(Svg,{width:o,height:o,viewBox:`0 0 ${o} ${o}`,children:[_jsx(Circle,{cx:v,cy:v,r:_,stroke:w,strokeWidth:x,fill:"none"}),_jsx(AnimatedCircle,{cx:v,cy:v,r:_,stroke:P,strokeWidth:x,strokeLinecap:u?"round":"butt",strokeDasharray:`${j} ${j}`,strokeDashoffset:k,strokeOpacity:A,fill:"none",transform:`rotate(-90 ${v} ${v})`,testID:p?`${p}-fill`:void 0})]}),null!=m?_jsx(View,{style:T.content,pointerEvents:"box-none",children:m}):null]})});ProgressRing.displayName="ProgressRing";const buildStyles=()=>StyleSheet.create({root:{alignItems:"center",justifyContent:"center"},content:{position:"absolute",top:0,right:0,bottom:0,left:0,alignItems:"center",justifyContent:"center"}});export{ProgressRing};export default ProgressRing;
+"use strict";import{forwardRef,useEffect,useMemo,useRef}from"react";import{Animated,Easing,StyleSheet,View}from"react-native";import Svg,{Circle}from"react-native-svg";import{useReducedMotion}from"../../hooks/index.js";import{createAnimatedValue,useTheme}from"../../theme/index.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const AnimatedCircle=Animated.createAnimatedComponent(Circle),toneColor=(e,t)=>{switch(t){case"success":return e.colors.success;case"warning":return e.colors.warning;case"danger":return e.colors.danger;default:return e.colors.primary}},clampProgress=e=>"number"!=typeof e||Number.isNaN(e)?0:Math.min(1,Math.max(0,e)),DEFAULT_STROKE_WIDTH=4,DEFAULT_DURATION=600,DEFAULT_COLOR_STOPS=[1/3,2/3],STOP_EDGE=1e-4,ProgressRing=forwardRef((e,t)=>{const{progress:r,size:s=48,strokeWidth:o,tone:n="primary",trackColor:i,ringColor:a,colorByProgress:c=!1,animated:l=!0,rounded:u=!0,children:m,accessibilityLabel:d,style:g,testID:p}=e,f=useTheme(),h=useReducedMotion(),y=clampProgress(r),R=o??4,x=i??f.colors["surface-disabled"],[b,w]=DEFAULT_COLOR_STOPS,_=Math.max(0,(s-R)/2),j=2*Math.PI*_,C=useRef(createAnimatedValue(y)).current;useEffect(()=>{if(!l||h)return void C.setValue(y);const e=Animated.timing(C,{toValue:y,duration:600,easing:Easing.bezier(...f.motion.ease["in-out"]),useNativeDriver:!1});return e.start(),()=>e.stop()},[l,y,C,h,f.motion.ease["in-out"]]);const S=C.interpolate({inputRange:[0,1],outputRange:[j,0]}),A=C.interpolate({inputRange:[0,.001,1],outputRange:[0,1,1]}),D=useMemo(()=>C.interpolate({inputRange:[0,b-1e-4,b,w-1e-4,w,1],outputRange:[f.colors.danger,f.colors.danger,f.colors.warning,f.colors.warning,f.colors.success,f.colors.success]}),[C,f.colors.danger,f.colors.warning,f.colors.success]),E=a??(c?D:toneColor(f,n)),P=useMemo(()=>buildStyles(),[]),T=s/2;return _jsxs(View,{ref:t,accessible:null==m,accessibilityRole:"progressbar",accessibilityLabel:d,accessibilityValue:{min:0,max:100,now:Math.round(100*y)},testID:p,style:[P.root,{width:s,height:s},g],children:[_jsxs(Svg,{width:s,height:s,viewBox:`0 0 ${s} ${s}`,children:[_jsx(Circle,{cx:T,cy:T,r:_,stroke:x,strokeWidth:R,fill:"none"}),_jsx(AnimatedCircle,{cx:T,cy:T,r:_,stroke:E,strokeWidth:R,strokeLinecap:u?"round":"butt",strokeDasharray:`${j} ${j}`,strokeDashoffset:S,strokeOpacity:A,fill:"none",transform:`rotate(-90 ${T} ${T})`,testID:p?`${p}-fill`:void 0})]}),null!=m?_jsx(View,{style:P.content,pointerEvents:"box-none",children:m}):null]})});ProgressRing.displayName="ProgressRing";const buildStyles=()=>StyleSheet.create({root:{alignItems:"center",justifyContent:"center"},content:{position:"absolute",top:0,right:0,bottom:0,left:0,alignItems:"center",justifyContent:"center"}});export{ProgressRing};export default ProgressRing;

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

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

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

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

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

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

package/lib/module/components/Repeater/Repeater.js

@@ -1 +1 @@
-"use strict";import{useCallback,useMemo,useRef}from"react";import{StyleSheet,Text,View}from"react-native";import{fontFor,useTheme}from"../../theme/index.js";import{resolveHaptic,triggerHaptic}from"../../utils/index.js";import{AppIcon}from"../AppIcon/index.js";import{Button}from"../Button/index.js";import{IconButton}from"../IconButton/index.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";let rowIdCounter=0;const nextRowId=()=>(rowIdCounter+=1,`row-${rowIdCounter}`);export const Repeater=({value:e,onChange:t,createRow:r,renderRow:o,addLabel:n="Add another",rowLabel:s,renderRowHeader:i,onRemove:l,minRows:a=0,maxRows:c,removable:m=!0,emptyText:u,disabled:p=!1,haptic:d,style:x,testID:h})=>{const g=useTheme(),f=useMemo(()=>buildStyles(g),[g]),w=useRef([]);if(w.current.length<e.length)for(;w.current.length<e.length;)w.current.push(nextRowId());else w.current.length>e.length&&(w.current.length=e.length);const y="number"==typeof c&&e.length>=c,j=m&&e.length>a,b=useCallback(e=>{const t=resolveHaptic(d,e);t&&triggerHaptic(t)},[d]),I=useCallback(()=>{p||y||(t([...e,r()]),b("impactLight"))},[y,r,p,b,t,e]),v=useCallback((r,o)=>{t(e.map((e,t)=>t===r?o:e))},[t,e]),R=useCallback(r=>{!p&&j&&(w.current=w.current.filter((e,t)=>t!==r),l?.(r,e[r]),t(e.filter((e,t)=>t!==r)),b("notificationWarning"))},[j,p,b,t,l,e]);return _jsxs(View,{style:[{gap:g.spacing.md},x],testID:h,children:[0===e.length&&u?_jsx(Text,{style:[f.empty,{color:g.colors.text.tertiary,fontSize:g.typography.fontSize.sm}],children:u}):null,e.map((e,t)=>{const r={item:e,index:t,update:e=>v(t,e),remove:()=>R(t),canRemove:j};return _jsxs(View,{style:{gap:g.spacing.xs},children:[i?i(r):s||j&&!p?_jsxs(View,{style:f.rowHeader,children:[s?_jsx(Text,{style:[f.rowLabel,{color:g.colors.text.tertiary,fontSize:g.typography.fontSize.xs}],children:s(t)}):_jsx(View,{}),j&&!p?_jsx(IconButton,{icon:({color:e,size:t})=>_jsx(AppIcon,{name:"x",size:t,color:e}),onPress:()=>R(t),accessibilityLabel:`Remove ${s?s(t):`row ${t+1}`}`,size:"sm",tone:"error",variant:"ghost",haptic:d,testID:h?`${h}-remove-${t}`:void 0}):null]}):null,o(r)]},w.current[t])}),y||p?null:_jsx(Button,{title:n,onPress:I,variant:"outline",size:"sm",haptic:d,testID:h?`${h}-add`:void 0})]})};const buildStyles=e=>StyleSheet.create({rowHeader:{flexDirection:"row",alignItems:"center",justifyContent:"space-between",minHeight:24},rowLabel:{...fontFor(e,"semibold"),fontWeight:"600",letterSpacing:.5,textTransform:"uppercase"},empty:{...fontFor(e,"normal")}});export default Repeater;
+"use strict";import{useCallback,useMemo,useRef}from"react";import{StyleSheet,Text,View}from"react-native";import{fontFor,useTheme}from"../../theme/index.js";import{resolveHaptic,triggerHaptic}from"../../utils/index.js";import{AppIcon}from"../AppIcon/index.js";import{Button}from"../Button/index.js";import{IconButton}from"../IconButton/index.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";let rowIdCounter=0;const nextRowId=()=>(rowIdCounter+=1,`row-${rowIdCounter}`);export const Repeater=({value:e,onChange:t,createRow:o,renderRow:r,addLabel:n="Add another",rowLabel:s,renderRowHeader:i,onRemove:l,minRows:a=0,maxRows:c,removable:u=!0,emptyText:m,disabled:p=!1,haptic:d,style:x,testID:h})=>{const f=useTheme(),g=useMemo(()=>buildStyles(f),[f]),w=useRef([]);if(w.current.length<e.length)for(;w.current.length<e.length;)w.current.push(nextRowId());else w.current.length>e.length&&(w.current.length=e.length);const b="number"==typeof c&&e.length>=c,j=u&&e.length>a,y=useCallback(e=>{const t=resolveHaptic(d,e);t&&triggerHaptic(t)},[d]),I=useCallback(()=>{p||b||(t([...e,o()]),y("impactLight"))},[b,o,p,y,t,e]),v=useCallback((o,r)=>{t(e.map((e,t)=>t===o?r:e))},[t,e]),R=useCallback(o=>{!p&&j&&(w.current=w.current.filter((e,t)=>t!==o),l?.(o,e[o]),t(e.filter((e,t)=>t!==o)),y("notificationWarning"))},[j,p,y,t,l,e]);return _jsxs(View,{style:[{gap:f.space.md},x],testID:h,children:[0===e.length&&m?_jsx(Text,{style:[g.empty,{color:f.colors["text-subtle"],fontSize:f.text.sm.size}],children:m}):null,e.map((e,t)=>{const o={item:e,index:t,update:e=>v(t,e),remove:()=>R(t),canRemove:j};return _jsxs(View,{style:{gap:f.space.xs},children:[i?i(o):s||j&&!p?_jsxs(View,{style:g.rowHeader,children:[s?_jsx(Text,{style:[g.rowLabel,{color:f.colors["text-subtle"],fontSize:f.text.xs.size}],children:s(t)}):_jsx(View,{}),j&&!p?_jsx(IconButton,{icon:({color:e,size:t})=>_jsx(AppIcon,{name:"x",size:t,color:e}),onPress:()=>R(t),accessibilityLabel:`Remove ${s?s(t):`row ${t+1}`}`,size:"sm",tone:"danger",variant:"ghost",haptic:d,testID:h?`${h}-remove-${t}`:void 0}):null]}):null,r(o)]},w.current[t])}),b||p?null:_jsx(Button,{title:n,onPress:I,variant:"outline",size:"sm",haptic:d,testID:h?`${h}-add`:void 0})]})};const buildStyles=e=>StyleSheet.create({rowHeader:{flexDirection:"row",alignItems:"center",justifyContent:"space-between",minHeight:24},rowLabel:{...fontFor(e,"semibold"),fontWeight:"600",letterSpacing:.5,textTransform:"uppercase"},empty:{...fontFor(e,"normal")}});export default Repeater;

package/lib/module/components/RichTextEditor/RichTextEditor.js

@@ -1 +1 @@
-"use strict";import{forwardRef,useCallback,useMemo,useState}from"react";import{Pressable,StyleSheet,Text,TextInput,View}from"react-native";import{fontFor,useTheme}from"../../theme/index.js";import{resolveHaptic,triggerHaptic}from"../../utils/index.js";import{smoothCorners}from"../../utils/corners.js";import{Skeleton}from"../Skeleton/index.js";import{applyMarkdownAction,normalizeSelection}from"./markdownActions.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const ACTION_META={bold:{glyph:"B",label:"Bold"},italic:{glyph:"I",label:"Italic"},strikethrough:{glyph:"S",label:"Strikethrough"},code:{glyph:"</>",label:"Inline code"},link:{glyph:"link",label:"Link"},heading1:{glyph:"H1",label:"Heading 1"},heading2:{glyph:"H2",label:"Heading 2"},bulletList:{glyph:"•",label:"Bulleted list"},numberedList:{glyph:"1.",label:"Numbered list"},quote:{glyph:">",label:"Quote"}},DEFAULT_ACTIONS=["bold","italic","strikethrough","code","link","heading1","heading2","bulletList","numberedList","quote"],DEFAULT_MIN_HEIGHT=160;export const RichTextEditor=forwardRef((e,t)=>{const{value:o,onChangeText:i,placeholder:l,actions:r=DEFAULT_ACTIONS,disabled:s=!1,loading:n=!1,minHeight:a=DEFAULT_MIN_HEIGHT,autoFocus:c=!1,accessibilityLabel:d,haptic:h,style:u,toolbarStyle:p,inputStyle:b,testID:g}=e,m=useTheme(),y=useMemo(()=>buildStyles(m),[m]),x=o??"",[S,T]=useState({start:0,end:0}),[f,k]=useState(!1),[j,C]=useState(null),I=useCallback(e=>{T(e.nativeEvent.selection),C(null)},[]),_=useCallback(e=>{C(null),i?.(e)},[i]),H=useCallback(e=>{if(s)return;const t=resolveHaptic(h,"selection");t&&triggerHaptic(t);const o=applyMarkdownAction({text:x,selection:normalizeSelection(S,x.length)},e);T(o.selection),C(o.selection),i?.(o.text)},[s,h,i,S,x]);return n?_jsx(RichTextEditorSkeleton,{actionCount:r.length,minHeight:a,style:u,testID:g}):_jsxs(View,{testID:g,style:[y.container,{borderColor:f?m.colors.border.focus:m.colors.border.primary,opacity:s?.55:1},u],children:[_jsx(View,{style:[y.toolbar,p],children:r.map(e=>_jsx(ToolbarButton,{action:e,disabled:s,onPress:H,styles:y,theme:m,testID:g?`${g}-${e}`:void 0},e))}),_jsx(TextInput,{ref:t,value:x,onChangeText:_,onSelectionChange:I,onFocus:()=>k(!0),onBlur:()=>k(!1),selection:j??void 0,editable:!s,autoFocus:c,multiline:!0,textAlignVertical:"top",placeholder:l,placeholderTextColor:m.colors.text.tertiary,accessibilityLabel:d,style:[y.input,{minHeight:a},b],testID:g?`${g}-input`:void 0})]})});RichTextEditor.displayName="RichTextEditor";const ToolbarButton=({action:e,disabled:t,onPress:o,styles:i,theme:l,testID:r})=>{const s=ACTION_META[e],n={color:t?l.colors.text.disabled:l.colors.text.primary};return"bold"===e&&(n.fontWeight=l.typography.fontWeight.bold),"italic"===e&&(n.fontStyle="italic"),"strikethrough"===e&&(n.textDecorationLine="line-through"),_jsx(Pressable,{onPress:()=>o(e),disabled:t,accessibilityRole:"button",accessibilityLabel:s.label,accessibilityState:{disabled:t},"aria-disabled":t,hitSlop:4,testID:r,style:({pressed:e})=>[i.button,{backgroundColor:e?l.colors.surface.pressed:l.colors.background.secondary}],children:_jsx(Text,{allowFontScaling:!1,style:[i.buttonLabel,n],children:s.glyph})})};ToolbarButton.displayName="RichTextEditorToolbarButton";const RichTextEditorSkeleton=({actionCount:e,minHeight:t,style:o,testID:i})=>{const l=useTheme(),r=useMemo(()=>buildStyles(l),[l]),s=Array.from({length:Math.max(1,e)},(e,t)=>t);return _jsxs(View,{testID:i,style:[r.container,o],children:[_jsx(View,{style:r.toolbar,children:s.map(e=>_jsx(Skeleton,{width:34,height:30,radius:"sm"},e))}),_jsxs(View,{style:[r.skeletonBody,{minHeight:t}],children:[_jsx(Skeleton,{shape:"text",width:"94%",height:14}),_jsx(Skeleton,{shape:"text",width:"100%",height:14}),_jsx(Skeleton,{shape:"text",width:"72%",height:14})]})]})};RichTextEditorSkeleton.displayName="RichTextEditorSkeleton";const buildStyles=e=>StyleSheet.create({container:{borderWidth:e.colors.border.width,borderColor:e.colors.border.primary,borderRadius:e.radius.md,...smoothCorners,backgroundColor:e.colors.background.primary,overflow:"hidden"},toolbar:{flexDirection:"row",flexWrap:"wrap",alignItems:"center",gap:e.spacing.xs,padding:e.spacing.xs,borderBottomWidth:StyleSheet.hairlineWidth,borderBottomColor:e.colors.border.secondary,backgroundColor:e.colors.background.secondary},button:{minWidth:34,height:30,paddingHorizontal:e.spacing.xs,borderRadius:e.radius.sm,...smoothCorners,alignItems:"center",justifyContent:"center"},buttonLabel:{...fontFor(e,"medium"),fontSize:e.typography.fontSize.sm},input:{...fontFor(e,"normal"),color:e.colors.text.primary,fontSize:e.typography.fontSize.base,lineHeight:1.5*e.typography.fontSize.base,paddingHorizontal:e.spacing.md,paddingVertical:e.spacing.sm},skeletonBody:{paddingHorizontal:e.spacing.md,paddingVertical:e.spacing.sm,gap:e.spacing.sm}});export default RichTextEditor;
+"use strict";import{forwardRef,useCallback,useMemo,useState}from"react";import{Pressable,StyleSheet,Text,TextInput,View}from"react-native";import{fontFor,useTheme}from"../../theme/index.js";import{resolveHaptic,triggerHaptic}from"../../utils/index.js";import{smoothCorners}from"../../utils/corners.js";import{Skeleton}from"../Skeleton/index.js";import{applyMarkdownAction,normalizeSelection}from"./markdownActions.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const ACTION_META={bold:{glyph:"B",label:"Bold"},italic:{glyph:"I",label:"Italic"},strikethrough:{glyph:"S",label:"Strikethrough"},code:{glyph:"</>",label:"Inline code"},link:{glyph:"link",label:"Link"},heading1:{glyph:"H1",label:"Heading 1"},heading2:{glyph:"H2",label:"Heading 2"},bulletList:{glyph:"•",label:"Bulleted list"},numberedList:{glyph:"1.",label:"Numbered list"},quote:{glyph:">",label:"Quote"}},DEFAULT_ACTIONS=["bold","italic","strikethrough","code","link","heading1","heading2","bulletList","numberedList","quote"],DEFAULT_MIN_HEIGHT=160;export const RichTextEditor=forwardRef((e,t)=>{const{value:o,onChangeText:l,placeholder:i,actions:s=DEFAULT_ACTIONS,disabled:r=!1,loading:n=!1,minHeight:a=DEFAULT_MIN_HEIGHT,autoFocus:d=!1,accessibilityLabel:c,haptic:h,style:b,toolbarStyle:u,inputStyle:p,testID:g}=e,m=useTheme(),x=useMemo(()=>buildStyles(m),[m]),y=o??"",[S,T]=useState({start:0,end:0}),[k,f]=useState(!1),[j,C]=useState(null),I=useCallback(e=>{T(e.nativeEvent.selection),C(null)},[]),_=useCallback(e=>{C(null),l?.(e)},[l]),H=useCallback(e=>{if(r)return;const t=resolveHaptic(h,"selection");t&&triggerHaptic(t);const o=applyMarkdownAction({text:y,selection:normalizeSelection(S,y.length)},e);T(o.selection),C(o.selection),l?.(o.text)},[r,h,l,S,y]);return n?_jsx(RichTextEditorSkeleton,{actionCount:s.length,minHeight:a,style:b,testID:g}):_jsxs(View,{testID:g,style:[x.container,{borderColor:k?m.colors["focus-ring"]:m.colors.border,opacity:r?.55:1},b],children:[_jsx(View,{style:[x.toolbar,u],children:s.map(e=>_jsx(ToolbarButton,{action:e,disabled:r,onPress:H,styles:x,theme:m,testID:g?`${g}-${e}`:void 0},e))}),_jsx(TextInput,{ref:t,value:y,onChangeText:_,onSelectionChange:I,onFocus:()=>f(!0),onBlur:()=>f(!1),selection:j??void 0,editable:!r,autoFocus:d,multiline:!0,textAlignVertical:"top",placeholder:i,placeholderTextColor:m.colors["text-subtle"],accessibilityLabel:c,style:[x.input,{minHeight:a},p],testID:g?`${g}-input`:void 0})]})});RichTextEditor.displayName="RichTextEditor";const ToolbarButton=({action:e,disabled:t,onPress:o,styles:l,theme:i,testID:s})=>{const r=ACTION_META[e],n={color:t?i.colors["text-disabled"]:i.colors["text-body"]};return"bold"===e&&(n.fontWeight=i.weight.bold),"italic"===e&&(n.fontStyle="italic"),"strikethrough"===e&&(n.textDecorationLine="line-through"),_jsx(Pressable,{onPress:()=>o(e),disabled:t,accessibilityRole:"button",accessibilityLabel:r.label,accessibilityState:{disabled:t},"aria-disabled":t,hitSlop:4,testID:s,style:({pressed:e})=>[l.button,{backgroundColor:e?i.colors["surface-pressed"]:i.colors["bg-subtle"]}],children:_jsx(Text,{allowFontScaling:!1,style:[l.buttonLabel,n],children:r.glyph})})};ToolbarButton.displayName="RichTextEditorToolbarButton";const RichTextEditorSkeleton=({actionCount:e,minHeight:t,style:o,testID:l})=>{const i=useTheme(),s=useMemo(()=>buildStyles(i),[i]),r=Array.from({length:Math.max(1,e)},(e,t)=>t);return _jsxs(View,{testID:l,style:[s.container,o],children:[_jsx(View,{style:s.toolbar,children:r.map(e=>_jsx(Skeleton,{width:34,height:30,radius:"sm"},e))}),_jsxs(View,{style:[s.skeletonBody,{minHeight:t}],children:[_jsx(Skeleton,{shape:"text",width:"94%",height:14}),_jsx(Skeleton,{shape:"text",width:"100%",height:14}),_jsx(Skeleton,{shape:"text",width:"72%",height:14})]})]})};RichTextEditorSkeleton.displayName="RichTextEditorSkeleton";const buildStyles=e=>StyleSheet.create({container:{borderWidth:e.size.border,borderColor:e.colors.border,borderRadius:e.radius.md,...smoothCorners,backgroundColor:e.colors.bg,overflow:"hidden"},toolbar:{flexDirection:"row",flexWrap:"wrap",alignItems:"center",gap:e.space.xs,padding:e.space.xs,borderBottomWidth:StyleSheet.hairlineWidth,borderBottomColor:e.colors["border-subtle"],backgroundColor:e.colors["bg-subtle"]},button:{minWidth:34,height:30,paddingHorizontal:e.space.xs,borderRadius:e.radius.sm,...smoothCorners,alignItems:"center",justifyContent:"center"},buttonLabel:{...fontFor(e,"medium"),fontSize:e.text.sm.size},input:{...fontFor(e,"normal"),color:e.colors["text-body"],fontSize:e.text.base.size,lineHeight:1.5*e.text.base.size,paddingHorizontal:e.space.md,paddingVertical:e.space.sm},skeletonBody:{paddingHorizontal:e.space.md,paddingVertical:e.space.sm,gap:e.space.sm}});export default RichTextEditor;