npm - @webority/mobile-ui - Versions diffs - 0.7.4 → 0.8.1 - Mend

@webority/mobile-ui 0.7.4 → 0.8.1

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

Files changed (47) hide show

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

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

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

	@@ -1 +1 @@
1	- "use strict";import ~~React~~,{Fragment}from"react";import{Text as RNText,StyleSheet,View}from"react-native";import{fontFor,useTheme}from"../../theme/index.js";import{~~Text}from"../Text/Text.js";import{~~jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const SUBSCRIPTED=/(?<![A-Za-z0-9_])([A-Za-z])_([A-Za-z0-9]+)(?![A-Za-z0-9_])/g;export const parseNotation=t=>{const e=String(t??""),r=[];let s=0;for(const t of e.matchAll(SUBSCRIPTED)){const o=t.index??0;o>s&&r.push({text:e.slice(s,o)}),r.push({text:t[1],sub:t[2]}),s=o+t[0].length}return s<e.length&&r.push({text:e.slice(s)}),r};const SUB_DROP=.4,Subscript=({children:t,color:e})=>{const r=useTheme(),s=Math.round(.75r.typography.fontSize.sm);return _jsx(View,{style:{transform:[{translateY:Math.round(.4s)}]},children:_jsx(RNText,{maxFontSizeMultiplier:r.maxFontSizeMultiplier,style:[styles.sub,{fontSize:s,lineHeight:s,color:e??r.colors.text.primary,...fontFor(r,"normal")}],children:t})})},renderNotation=(t,e)=>parseNotation(t).map((t,r)=>t.sub?_jsxs(Fragment,{children:[t.text,_jsx(Subscript,{color:e,children:t.sub})]},r):_jsx(Fragment,{children:t.text},r));export const Notation=({text:t,base:e,sub:r,desc:s,color:o,testID:n})=>null!=e?_jsxs(~~Text~~,{testID:n,children:[e,r?_jsx(Subscript,{color:o,children:r}):null,s?` ${s}`:null]}):_jsx(RNText,{testID:n,children:"string"==typeof t\|\|null==t?renderNotation(t??"",o):t.map((t,e)=>_jsx(Fragment,"string"==typeof t?{children:renderNotation(t,o)}:{children:t.verbatim},e))});export const sym=(t,e,r,s)=>_jsx(Notation,{base:t,sub:e,desc:r,color:s});const styles=StyleSheet.create({sub:{includeFontPadding:!1}});export default Notation;
1	+ "use strict";import{createContext,Fragment,useContext}from"react";import{Text as RNText,StyleSheet,View}from"react-native";import{fontFor,useTheme}from"../../theme/index.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const SUBSCRIPTED=/(?<![A-Za-z0-9_])([A-Za-z])_([A-Za-z0-9]+)(?![A-Za-z0-9_])/g;export const parseNotation=t=>{const e=String(t??""),o=[];let n=0;for(const t of e.matchAll(SUBSCRIPTED)){const s=t.index??0;s>n&&o.push({text:e.slice(n,s)}),o.push({text:t[1],sub:t[2]}),n=s+t[0].length}return n<e.length&&o.push({text:e.slice(n)}),o};const SUB_DROP=.4;export const NotationInkContext=createContext(null);const Subscript=({children:t,color:e})=>{const o=useTheme(),n=useContext(NotationInkContext),s=Math.round(.75(n?.fontSize??o.typography.fontSize.sm));return _jsx(View,{style:{transform:[{translateY:Math.round(.4s)}]},children:_jsx(RNText,{maxFontSizeMultiplier:o.maxFontSizeMultiplier,style:[styles.sub,{fontSize:s,lineHeight:s,color:e??n?.color??o.colors.text.primary,...fontFor(o,"normal")}],children:t})})},renderNotation=(t,e)=>parseNotation(t).map((t,o)=>t.sub?_jsxs(Fragment,{children:[t.text,_jsx(Subscript,{color:e,children:t.sub})]},o):_jsx(Fragment,{children:t.text},o));export const Notation=({text:t,base:e,sub:o,desc:n,color:s,testID:r})=>null!=e?_jsxs(RNText,{testID:r,children:[e,o?_jsx(Subscript,{color:s,children:o}):null,n?` ${n}`:null]}):_jsx(RNText,{testID:r,children:"string"==typeof t\|\|null==t?renderNotation(t??"",s):t.map((t,e)=>_jsx(Fragment,"string"==typeof t?{children:renderNotation(t,s)}:{children:t.verbatim},e))});export const sym=(t,e,o,n)=>_jsx(Notation,{base:t,sub:e,desc:o,color:n});const styles=StyleSheet.create({sub:{includeFontPadding:!1}});export default Notation;

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

	@@ -1 +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{useTheme}from"../../theme/index.js";import{resolveHaptic,triggerHaptic}from"../../utils/index.js";import{smoothCorners}from"../../utils/corners.js";import{FieldBase,FieldLabel,FieldMessage,fieldTextAsString,hasFieldText,resolveFieldSize,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=~~Math.pow(~~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:l,onChange:s,min:r=Number.NEGATIVE_INFINITY,max:n=Number.POSITIVE_INFINITY,step:a=1,allowDecimal:o=!1,precision:c=0,label:u,help:d,helperText:m,error:b,disabled:p=!1,size:f="md",variant:x="inline",unit:h,haptic:y,accessibilityLabel:g,style:S,containerStyle:T,inputStyle:I,buttonStyle:F,unitStyle:N,labelStyle:j,textInputProps:C,testID:v}=e,[z,_]=useControllableState({value:i,defaultValue:l??e.min??0,onChange:s}),P=useTheme(),w=resolveFieldSize(P,f),R=resolveFieldTextStyle(P,{disabled:p}),L=useMemo(()=>buildStyles(P),[P]),V=P.components.numberInput?.longPressDelayMs??500,k=P.components.numberInput?.longPressIntervalMs??80,E=useRef(null),[D,A]=useState(formatValue(z,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(z,o,c))},[z,o,c,M]);const $=z<=r,q=z>=n,J=!p,K=useCallback(e=>{const t=roundToPrecision(e,o?c:0),i=clamp(t,r,n);i!==z&&_(i)},[o,n,r,_,c,z]),Q=useCallback(()=>{if(!J\|\|$)return;const e=resolveHaptic(y,"selection");e&&triggerHaptic(e),K(z-a)},[$,J,y,K,a,z]),X=useCallback(()=>{if(!J\|\|q)return;const e=resolveHaptic(y,"selection");e&&triggerHaptic(e),K(z+a)},[q,J,y,K,a,z]);React.useImperativeHandle(t,()=>({focus:()=>E.current?.focus(),blur:()=>E.current?.blur(),clear:()=>{A(""),Number.isFinite(r)&&r>0?_(r):_(0<r?r:0>n?n:0)}}),[n,r,_]);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!==z&&_(roundToPrecision(i,o?c:0))},[o,n,r,_,c,z]),te=useCallback(()=>{H(!1),O(!1);const e=Number(D);if(""===D\|\|!Number.isFinite(e))return void A(formatValue(z,o,c));const t=roundToPrecision(e,o?c:0),i=clamp(t,r,n);i!==z&&_(i),A(formatValue(i,o,c))},[o,D,n,r,_,c,z]),ie=useCallback(()=>{H(!0),O(!0)},[]),le=$\|\|p?P.colors.text.disabled:P.colors.text.primary,se=q\|\|p?P.colors.text.disabled:P.colors.text.primary,re=w.iconSize+8,renderStepper=(e,t,i,l,s,r)=>_jsx(Pressable,{onPress:t,onLongPress:()=>Z(e),onPressOut:U,delayLongPress:V,disabled:i,accessibilityRole:"button",accessibilityLabel:l,accessibilityState:{disabled:i},style:({pressed:e})=>[{width:re,height:re,alignItems:"center",justifyContent:"center",borderRadius:re/2,...smoothCorners},e&&!i?{backgroundColor:P.colors.surface.pressed}:null,F],testID:`${v??"numberinput"}-${"inc"===e?"plus":"minus"}`,children:_jsx(Text,{style:{fontSize:w.iconSize,color:s,fontWeight:P.typography.fontWeight.semibold,lineHeight:w.iconSize+2},children:r})}),ne=g??fieldTextAsString(u)??"Number input",ae=_jsx(FieldBase,{size:f,disabled:p,error:~~hasFieldText(b)~~,filled:!0,focused:B,onPress:W,pressFeedback:!1,leading:renderStepper("dec",Q,$\|\|p,"Decrease",le,"−"),trailing:renderStepper("inc",X,q\|\|p,"Increase",se,"+"),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(z)?z:0},accessibilityState:{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.fontSize,color:R.color,...R.weightStyle},I],...C}),h?_jsx(Text,{style:[L.unit,{fontSize:w.fontSize,color:R.placeholderColor},N],children:h}):null]})}),oe=hasFieldText(u)?_jsx(FieldLabel,{size:f,help:d,style:j,children:u}):null,ce=_jsx(FieldMessage,{size:f,error:~~hasFieldText(b)~~,text:~~hasFieldText(b)~~?b:m});return _jsxs(View,"horizontal"===x?{style:[L.horizontalContainer,S,T],testID:v,accessibilityState:{disabled:p},children:[_jsx(View,{style:L.horizontalLabelWrap,children:oe}),_jsxs(View,{children:[ae,ce]})]}:{style:[S,T],testID:v,accessibilityState:{disabled:p},children:[oe,~~ae,ce~~]})});NumberInput.displayName="NumberInput";const buildStyles=e=>StyleSheet.create({inputRow:{flex:1,flexDirection:"row",alignItems:"center",justifyContent:"center"},input:{flex:1,textAlign:"center",padding:0,margin:0,includeFontPadding:!1},unit:{marginLeft:4},label:{marginBottom:6},helper:{marginTop:6},horizontalContainer:{flexDirection:"row",alignItems:"center",justifyContent:"space-between"},horizontalLabelWrap:{flexShrink:1,paddingRight:12}});export{NumberInput};export default NumberInput;
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{useTheme}from"../../theme/index.js";import{resolveHaptic,triggerHaptic}from"../../utils/index.js";import{smoothCorners}from"../../utils/corners.js";import{FieldBase,FieldLabel,FieldMessage,fieldTextAsString,hasFieldText,resolveFieldSize,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(ei)/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:l,onChange:r,min:s=Number.NEGATIVE_INFINITY,max:n=Number.POSITIVE_INFINITY,step:a=1,allowDecimal:o=!1,precision:c=0,label:u,help:d,helperText:m,error:b,disabled:p=!1,size:f="md",variant:x="inline",unit:h,haptic:y,accessibilityLabel:g,style:S,containerStyle:T,inputStyle:I,buttonStyle:F,unitStyle:N,labelStyle:j,textInputProps:C,testID:v}=e,[z,_]=useControllableState({value:i,defaultValue:l??e.min??0,onChange:r}),P=useTheme(),R=resolveFieldSize(P,f),w=resolveFieldTextStyle(P,{disabled:p}),L=useMemo(()=>buildStyles(P),[P]),V=P.components.numberInput?.longPressDelayMs??500,k=P.components.numberInput?.longPressIntervalMs??80,E=useRef(null),[D,A]=useState(formatValue(z,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(z,o,c))},[z,o,c,M]);const $=z<=s,q=z>=n,J=!p,K=useCallback(e=>{const t=roundToPrecision(e,o?c:0),i=clamp(t,s,n);i!==z&&_(i)},[o,n,s,_,c,z]),Q=useCallback(()=>{if(!J\|\|$)return;const e=resolveHaptic(y,"selection");e&&triggerHaptic(e),K(z-a)},[$,J,y,K,a,z]),X=useCallback(()=>{if(!J\|\|q)return;const e=resolveHaptic(y,"selection");e&&triggerHaptic(e),K(z+a)},[q,J,y,K,a,z]);React.useImperativeHandle(t,()=>({focus:()=>E.current?.focus(),blur:()=>E.current?.blur(),clear:()=>{A(""),Number.isFinite(s)&&s>0?_(s):_(0<s?s:0>n?n:0)}}),[n,s,_]);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>=s&&i<=n&&i!==z&&_(roundToPrecision(i,o?c:0))},[o,n,s,_,c,z]),te=useCallback(()=>{H(!1),O(!1);const e=Number(D);if(""===D\|\|!Number.isFinite(e))return void A(formatValue(z,o,c));const t=roundToPrecision(e,o?c:0),i=clamp(t,s,n);i!==z&&_(i),A(formatValue(i,o,c))},[o,D,n,s,_,c,z]),ie=useCallback(()=>{H(!0),O(!0)},[]),le=$\|\|p?P.colors.text.disabled:P.colors.text.primary,re=q\|\|p?P.colors.text.disabled:P.colors.text.primary,se=R.iconSize+8,renderStepper=(e,t,i,l,r,s)=>_jsx(Pressable,{onPress:t,onLongPress:()=>Z(e),onPressOut:U,delayLongPress:V,disabled:i,accessibilityRole:"button",accessibilityLabel:l,accessibilityState:{disabled:i},style:({pressed:e})=>[{width:se,height:se,alignItems:"center",justifyContent:"center",borderRadius:se/2,...smoothCorners},e&&!i?{backgroundColor:P.colors.surface.pressed}:null,F],testID:`${v??"numberinput"}-${"inc"===e?"plus":"minus"}`,children:_jsx(Text,{style:{fontSize:R.iconSize,color:r,fontWeight:P.typography.fontWeight.semibold,lineHeight:R.iconSize+2},children:s})}),ne=g??fieldTextAsString(u)??"Number input",ae=!0===b\|\|hasFieldText(b),oe=_jsx(FieldBase,{size:f,disabled:p,error:ae,filled:!0,focused:B,onPress:W,pressFeedback:!1,leading:renderStepper("dec",Q,$\|\|p,"Decrease",le,"−"),trailing:renderStepper("inc",X,q\|\|p,"Increase",re,"+"),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(z)?z:0},accessibilityState:{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:R.fontSize,color:w.color,...w.weightStyle},I],...C}),h?_jsx(Text,{style:[L.unit,{fontSize:R.fontSize,color:w.placeholderColor},N],children:h}):null]})}),ce=hasFieldText(u)?_jsx(FieldLabel,{size:f,help:d,style:j,children:u}):null,ue=_jsx(FieldMessage,{size:f,error:ae,text:ae?b:m});return _jsxs(View,"horizontal"===x?{style:[L.horizontalContainer,S,T],testID:v,accessibilityState:{disabled:p},children:[_jsx(View,{style:L.horizontalLabelWrap,children:ce}),_jsxs(View,{children:[oe,ue]})]}:{style:[S,T],testID:v,accessibilityState:{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:0,margin:0,includeFontPadding:!1},unit:{marginLeft:4},label:{marginBottom:6},helper:{marginTop:6},horizontalContainer:{flexDirection:"row",alignItems:"center",justifyContent:"space-between"},horizontalLabelWrap:{flexShrink:1,paddingRight:12}});export{NumberInput};export default NumberInput;

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

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

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

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

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

	@@ -1 +1 @@
1	- "use strict";import ~~React,~~{forwardRef,useMemo}from"react";import{StyleSheet,Text,View}from"react-native";import{useTheme}from"../../theme/index.js";import{FieldBase,FieldLabel,FieldMessage,fieldTextAsString,hasFieldText,RequiredMark,resolveFieldSize,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:S,triggerStyle:m,valueStyle:f,labelStyle:T,messageStyle:F,accessibilityLabel:j,testID:p}=e,v=useTheme(),z=useMemo(()=>buildStyles(v),[v]),P=resolveFieldSize(v,b),_=resolveFieldTextStyle(v,{disabled:y}),w="string"==typeof i&&i.length>0,R=hasFieldText(a),k=hasFieldText(r),C=w?i:t??"Select…",L=w?_.color:_.placeholderColor,M=w?`${fieldTextAsString(r)??"Selection"}: ${i}`:t??"No selection",q=j??M,B={disabled:y},I=void 0===u,D=c&&w&&!y;return _jsxs(View,{style:[z.root,S],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:w,onPress:n,leading:g,trailing:D\|\|I\|\|null!==u?_jsxs(View,{style:z.trailingRow,children:[D?_jsx(Text,{onPress:()=>{y\|\|x?.()},accessibilityRole:"button",accessibilityLabel:"Clear",style:{fontSize:P.iconSize,color:v.colors.text.secondary,paddingHorizontal:4},children:"×"}):null,void 0!==u?u:I?_jsx(Chevron,{size:P.iconSize,color:y?v.colors.text.disabled:v.colors.text.tertiary}):null]}):null,accessibilityLabel:q,accessibilityState:B,accessibilityRole:"button",style:m,children:_jsxs(Text,{numberOfLines:1,style:[z.valueText,{color:L,fontSize:P.fontSize,..._.weightStyle},f],children:[C,w\|\|!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;
1	+ "use strict";import{forwardRef,useMemo}from"react";import{StyleSheet,Text,View}from"react-native";import{useTheme}from"../../theme/index.js";import{FieldBase,FieldLabel,FieldMessage,fieldTextAsString,hasFieldText,RequiredMark,resolveFieldSize,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:S,triggerStyle:m,valueStyle:f,labelStyle:T,messageStyle:F,accessibilityLabel:j,testID:p}=e,v=useTheme(),z=useMemo(()=>buildStyles(v),[v]),P=resolveFieldSize(v,b),_=resolveFieldTextStyle(v,{disabled:y}),w="string"==typeof i&&i.length>0,R=!0===a\|\|hasFieldText(a),k=hasFieldText(r),C=w?i:t??"Select…",L=w?_.color:_.placeholderColor,M=w?`${fieldTextAsString(r)??"Selection"}: ${i}`:t??"No selection",q=j??M,B={disabled:y},I=void 0===u,D=c&&w&&!y;return _jsxs(View,{style:[z.root,S],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:w,onPress:n,leading:g,trailing:D\|\|I\|\|null!==u?_jsxs(View,{style:z.trailingRow,children:[D?_jsx(Text,{onPress:()=>{y\|\|x?.()},accessibilityRole:"button",accessibilityLabel:"Clear",style:{fontSize:P.iconSize,color:v.colors.text.secondary,paddingHorizontal:4},children:"×"}):null,void 0!==u?u:I?_jsx(Chevron,{size:P.iconSize,color:y?v.colors.text.disabled:v.colors.text.tertiary}):null]}):null,accessibilityLabel:q,accessibilityState:B,accessibilityRole:"button",style:m,children:_jsxs(Text,{numberOfLines:1,style:[z.valueText,{color:L,fontSize:P.fontSize,..._.weightStyle},f],children:[C,w\|\|!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/Select/Select.js CHANGED Viewed

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

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

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

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

	@@ -1 +1 @@
1	- "use strict";import{useCallback,useState}from"react";import{Animated,Platform,StyleSheet,View}from"react-native";import Svg,{Path}from"react-native-svg";import{squircleApplies,squirclePath}from"../../utils/squircle.js";import{jsx as _jsx}from"react/jsx-runtime";const AnimatedPath=Animated.createAnimatedComponent(Path);export function SquircleFill({width:t,height:e,radius:i,fill:r,stroke:s,strokeWidth:o=0,outset:l=0,testID:a}){const n=o>0&&void 0!==s&&"transparent"!==s,h=squirclePath({width:t,height:e,radius:i,inset:~~n?o/2~~:0});return _jsx(View,{pointerEvents:"none",style:[styles.overlay,l?{top:-l,left:-l,right:-l,bottom:-l}:null],testID:a,children:_jsx(Svg,{width:t,height:e,viewBox:`0 0 ${t} ${e}`,children:_jsx(AnimatedPath,{d:h,fill:r,stroke:n?s:void 0,strokeWidth:n?o:void 0})})})}SquircleFill.displayName="SquircleFill";export function useSquircle(t,e,i){const[r,s]=useState(null),o=t&&"android"===Platform.OS;return{onLayout:useCallback(t=>{if(o){const{width:e,height:i}=t.nativeEvent.layout;s(t=>t&&t.width===e&&t.height===i?t:{width:e,height:i})}i?.(t)},[o,i]),size:r,active:o&&null!==r&&squircleApplies(r.width,r.height,e)}}const styles=StyleSheet.create({overlay:{position:"absolute",top:0,left:0,right:0,bottom:0}});
1	+ "use strict";import{useCallback,useState}from"react";import{Animated,Platform,StyleSheet,View}from"react-native";import Svg,{Path}from"react-native-svg";import{useTheme}from"../../theme/index.js";import{squircleApplies,squirclePath}from"../../utils/squircle.js";import{jsx as _jsx}from"react/jsx-runtime";const AnimatedPath=Animated.createAnimatedComponent(Path);export function SquircleFill({width:t,height:e,radius:i,fill:o,stroke:r,strokeWidth:s=0,outset:l=0,testID:a}){const n=s>0&&void 0!==r&&"transparent"!==r,h=n?s/2:0,u=useTheme().cornerSmoothing,c=squirclePath({width:t,height:e,radius:i,inset:h,smoothing:u});return _jsx(View,{pointerEvents:"none",style:[styles.overlay,l?{top:-l,left:-l,right:-l,bottom:-l}:null],testID:a,children:_jsx(Svg,{width:t,height:e,viewBox:`0 0 ${t} ${e}`,children:_jsx(AnimatedPath,{d:c,fill:o,stroke:n?r:void 0,strokeWidth:n?s:void 0})})})}SquircleFill.displayName="SquircleFill";export function useSquircle(t,e,i){const[o,r]=useState(null),s=t&&"android"===Platform.OS;return{onLayout:useCallback(t=>{if(s){const{width:e,height:i}=t.nativeEvent.layout;r(t=>t&&t.width===e&&t.height===i?t:{width:e,height:i})}i?.(t)},[s,i]),size:o,active:s&&null!==o&&squircleApplies(o.width,o.height,e)}}const styles=StyleSheet.create({overlay:{position:"absolute",top:0,left:0,right:0,bottom:0}});

package/lib/module/theme/tokens.js CHANGED Viewed

	@@ -1 +1 @@
1	- "use strict";const typography={fontSize:{xs:11,sm:13,base:15,lg:17,xl:20,"2xl":24,"3xl":30,"4xl":36},fontWeight:{normal:"400",medium:"500",semibold:"600",bold:"700"},lineHeight:{tight:1.2,normal:1.4,relaxed:1.6},letterSpacing:{tight:-.2,normal:0,wide:.4}},spacing={none:0,xxs:2,xs:4,sm:8,md:12,lg:16,xl:24,"2xl":32,"3xl":48,"4xl":64},radius={none:0,xs:4,sm:6,md:10,lg:14,xl:20,"2xl":28,full:9999},FIELD_RADIUS=10,fieldSizes={sm:{paddingHorizontal:12,paddingVertical:10,minHeight:38,fontSize:13,borderRadius:10,iconSize:14,labelFontSize:11,labelGap:4,messageFontSize:11,messageGap:2},md:{paddingHorizontal:14,paddingVertical:13,minHeight:44,fontSize:14,borderRadius:10,iconSize:16,labelFontSize:12,labelGap:4,messageFontSize:12,messageGap:2},lg:{paddingHorizontal:16,paddingVertical:15,minHeight:52,fontSize:16,borderRadius:10,iconSize:18,labelFontSize:13,labelGap:4,messageFontSize:13,messageGap:2}},components={button:{xs:{paddingHorizontal:10,paddingVertical:4,minHeight:28,fontSize:12,borderRadius:8},sm:{paddingHorizontal:12,paddingVertical:6,minHeight:34,fontSize:14,borderRadius:10},md:{paddingHorizontal:16,paddingVertical:9,minHeight:42,fontSize:16,borderRadius:12},lg:{paddingHorizontal:20,paddingVertical:12,minHeight:50,fontSize:18,borderRadius:14},xl:{paddingHorizontal:24,paddingVertical:14,minHeight:58,fontSize:20,borderRadius:16}},input:{sm:{...fieldSizes.sm,multilineMinHeight:72},md:{...fieldSizes.md,multilineMinHeight:92},lg:{...fieldSizes.lg,multilineMinHeight:110}},searchBar:{sm:{borderRadius:radius.full},md:{borderRadius:radius.full},lg:{borderRadius:radius.full}},emptyState:{sm:{iconSize:48,titleFontSize:"lg",descriptionFontSize:"sm",paddingVertical:"lg"},md:{iconSize:64,titleFontSize:"xl",descriptionFontSize:"base",paddingVertical:"xl"},lg:{iconSize:80,titleFontSize:"2xl",descriptionFontSize:"base",paddingVertical:"2xl"}},field:{defaultVariant:"outlined",sm:fieldSizes.sm,md:fieldSizes.md,lg:fieldSizes.lg},listItem:{sm:{paddingVertical:"sm",titleFontSize:"sm",subtitleFontSize:"xs",minHeight:44},md:{paddingVertical:"md",titleFontSize:"base",subtitleFontSize:"sm",minHeight:56},lg:{paddingVertical:"lg",titleFontSize:"lg",subtitleFontSize:"sm",minHeight:72}},badge:{sm:{fontSize:10,minWidth:16,height:16,paddingHorizontal:5,dotSize:8},md:{fontSize:11,minWidth:20,height:20,paddingHorizontal:6,dotSize:10},borderWidth:1.5,anchorOffset:4},chip:{sm:{paddingHorizontal:10,paddingVertical:4,fontSize:12,minHeight:26,closeSize:16,closeFontSize:12,gap:6},md:{paddingHorizontal:12,paddingVertical:6,fontSize:13,minHeight:32,closeSize:18,closeFontSize:13,gap:8}},checkbox:{sm:{boxSize:16},md:{boxSize:20},lg:{boxSize:24},labelGap:10},radio:{sm:{outer:16,inner:8},md:{outer:20,inner:10},lg:{outer:24,inner:12},labelGap:10},switch:{sm:{trackWidth:42,trackHeight:26,thumbSize:22,padding:2},md:{trackWidth:51,trackHeight:31,thumbSize:27,padding:2},lg:{trackWidth:60,trackHeight:36,thumbSize:32,padding:2},thumbColor:"#FFFFFF"},otpInput:{sm:{cell:36,fontSize:16,borderRadius:8,gap:8},md:{cell:48,fontSize:20,borderRadius:10,gap:10},lg:{cell:56,fontSize:24,borderRadius:12,gap:12}},dialog:{iconWrapperSize:48,iconWrapperBorderRadius:24,actionButtonMinHeight:44},toast:{iconCircleSize:28,iconCircleBorderRadius:14,iconGlyphFontSize:16,tintBarWidth:4},formField:{inlineLabelWidth:"35%"}},motion={duration:{instant:80,fast:160,normal:240,slow:360,slower:500},easing:{standard:[.4,0,.2,1],accelerate:[.4,0,1,1],decelerate:[0,0,.2,1],sharp:[.4,0,.6,1]},spring:{gentle:{damping:26,stiffness:240,mass:.9},bouncy:{damping:16,stiffness:200,mass:.7},snappy:{damping:20,stiffness:300,mass:.7}}},lightShadows={none:{},xs:{shadowColor:"#000",shadowOffset:{width:0,height:1},shadowOpacity:.04,shadowRadius:2,elevation:1},sm:{shadowColor:"#000",shadowOffset:{width:0,height:2},shadowOpacity:.06,shadowRadius:4,elevation:2},md:{shadowColor:"#000",shadowOffset:{width:0,height:4},shadowOpacity:.08,shadowRadius:8,elevation:4},lg:{shadowColor:"#000",shadowOffset:{width:0,height:8},shadowOpacity:.1,shadowRadius:16,elevation:8},xl:{shadowColor:"#000",shadowOffset:{width:0,height:12},shadowOpacity:.14,shadowRadius:24,elevation:12},"2xl":{shadowColor:"#000",shadowOffset:{width:0,height:20},shadowOpacity:.18,shadowRadius:32,elevation:20}},darkShadows={none:{},xs:{shadowColor:"#000",shadowOffset:{width:0,height:1},shadowOpacity:.3,shadowRadius:2,elevation:1},sm:{shadowColor:"#000",shadowOffset:{width:0,height:2},shadowOpacity:.4,shadowRadius:4,elevation:2},md:{shadowColor:"#000",shadowOffset:{width:0,height:4},shadowOpacity:.5,shadowRadius:8,elevation:4},lg:{shadowColor:"#000",shadowOffset:{width:0,height:8},shadowOpacity:.55,shadowRadius:16,elevation:8},xl:{shadowColor:"#000",shadowOffset:{width:0,height:12},shadowOpacity:.6,shadowRadius:24,elevation:12},"2xl":{shadowColor:"#000",shadowOffset:{width:0,height:20},shadowOpacity:.7,shadowRadius:32,elevation:20}};export const lightTheme={mode:"light",colors:{primary:"#5B5BD6",primaryHover:"#4F4FBF",primaryPressed:"#4040A8",primaryMuted:"#EEEEFC",secondary:"#F4F4F8",secondaryHover:"#E9E9F0",success:"#1FAD66",warning:"#F59E0B",error:"#E5484D",info:"#3B82F6",onPrimary:"#FFFFFF",onSecondary:"#0F0F1A",onSuccess:"#FFFFFF",onWarning:"#0F0F1A",onError:"#FFFFFF",onInfo:"#FFFFFF",onOverlay:"#FFFFFF",text:{primary:"#0F0F1A",secondary:"#52525B",tertiary:"#8B8B95",inverse:"#FFFFFF",strong:"#252F4A",disabled:"#B4B4BB",link:"#5B5BD6"},background:{primary:"#FFFFFF",secondary:"#F8F8FB",tertiary:"#F1F1F5",elevated:"#FFFFFF",overlay:"rgba(15, 15, 26, 0.5)",inverse:"#0F0F1A"},border:{primary:"#E5E5EC",secondary:"#EFEFF3",focus:"#5B5BD6",error:"#E5484D",width:1},field:{background:"#F9FBFC",backgroundFocused:"#FFFFFF",backgroundDisabled:"#F5F6FA",border:"#EBEDF3",borderFocused:"#BED2F9",borderError:"#FDBFCE",label:"#242F4A",text:"#252F4A",textDisabled:"#C4CADA",placeholder:"#99A1B7",placeholderDisabled:"#C4CADA",icon:"#99A1B7",iconFocused:"#4B5675",iconDisabled:"#C4CADA",caret:"#5B8DEE",message:"#E82545"},surface:{pressed:"rgba(15, 15, 26, 0.06)",hovered:"rgba(15, 15, 26, 0.04)",selected:"rgba(91, 91, 214, 0.1)",disabled:"#F1F1F5"},glass:{fill:"rgba(255, 255, 255, 0.28)",border:"rgba(255, 255, 255, 0.45)",on:"#0F0F1A",badge:"#FFFFFF"},skeleton:{background:"#EBEDF3",highlight:"#F5F6FA"},avatarPalette:["#5B5BD6","#0A7979","#A45A05","#CD226E","#2462EB","#7C3AED","#047C57","#D42222"]},typography:typography,spacing:spacing,radius:radius,shadows:lightShadows,motion:motion,components:components,gradients:{}};export const darkTheme={mode:"dark",colors:{primary:"#7C7CE8",primaryHover:"#9292EE",primaryPressed:"#A8A8F2",primaryMuted:"#1F1F3D",secondary:"#1F1F26",secondaryHover:"#2A2A33",success:"#30C780",warning:"#FBBF24",error:"#F87171",info:"#60A5FA",onPrimary:"#0F0F1A",onSecondary:"#FAFAFA",onSuccess:"#0F0F1A",onWarning:"#0F0F1A",onError:"#0F0F1A",onInfo:"#0F0F1A",onOverlay:"#FFFFFF",text:{primary:"#FAFAFA",secondary:"#B4B4BB",tertiary:"#71717A",inverse:"#0F0F1A",strong:"#E2E2E2",disabled:"#52525B",link:"#9292EE"},background:{primary:"#0B0B12",secondary:"#13131C",tertiary:"#1C1C26",elevated:"#1C1C26",overlay:"rgba(0, 0, 0, 0.65)",inverse:"#FAFAFA"},border:{primary:"#27272F",secondary:"#1C1C26",focus:"#7C7CE8",error:"#F87171",width:1},field:{background:"#13131C",backgroundFocused:"#0B0B12",backgroundDisabled:"#1C1C26",border:"#27272F",borderFocused:"#3D5FB0",borderError:"#8A2F42",label:"#E4E6EE",text:"#FAFAFA",textDisabled:"#52525B",placeholder:"#71717A",placeholderDisabled:"#52525B",icon:"#8B8B95",iconFocused:"#D4D4DB",iconDisabled:"#52525B",caret:"#7C9EF0",message:"#F87171"},surface:{pressed:"rgba(255, 255, 255, 0.08)",hovered:"rgba(255, 255, 255, 0.05)",selected:"rgba(124, 124, 232, 0.18)",disabled:"#1C1C26"},glass:{fill:"rgba(255, 255, 255, 0.28)",border:"rgba(255, 255, 255, 0.45)",on:"#0F0F1A",badge:"#FFFFFF"},skeleton:{background:"#1C1C26",highlight:"#27272F"},avatarPalette:["#8B8BEE","#2DD4BF","#FCD34D","#F472B6","#60A5FA","#A78BFA","#34D399","#F87171"]},typography:typography,spacing:spacing,radius:radius,shadows:darkShadows,motion:motion,components:components,gradients:{}};
1	+ "use strict";import{SQUIRCLE_SMOOTHING}from"../utils/squircle.js";const typography={fontSize:{xs:11,sm:13,base:15,lg:17,xl:20,"2xl":24,"3xl":30,"4xl":36},fontWeight:{normal:"400",medium:"500",semibold:"600",bold:"700"},lineHeight:{tight:1.2,normal:1.4,relaxed:1.6},letterSpacing:{tight:-.2,normal:0,wide:.4}},spacing={none:0,xxs:2,xs:4,sm:8,md:12,lg:16,xl:24,"2xl":32,"3xl":48,"4xl":64},radius={none:0,xs:4,sm:6,md:10,lg:14,xl:20,"2xl":28,full:9999},FIELD_RADIUS=10,fieldSizes={sm:{paddingHorizontal:12,paddingVertical:10,minHeight:38,fontSize:13,borderRadius:10,iconSize:14,labelFontSize:11,labelGap:4,messageFontSize:11,messageGap:2},md:{paddingHorizontal:14,paddingVertical:13,minHeight:44,fontSize:14,borderRadius:10,iconSize:16,labelFontSize:12,labelGap:4,messageFontSize:12,messageGap:2},lg:{paddingHorizontal:16,paddingVertical:15,minHeight:52,fontSize:16,borderRadius:10,iconSize:18,labelFontSize:13,labelGap:4,messageFontSize:13,messageGap:2}},components={button:{xs:{paddingHorizontal:10,paddingVertical:4,minHeight:28,fontSize:12,borderRadius:8},sm:{paddingHorizontal:12,paddingVertical:6,minHeight:34,fontSize:14,borderRadius:10},md:{paddingHorizontal:16,paddingVertical:9,minHeight:42,fontSize:16,borderRadius:12},lg:{paddingHorizontal:20,paddingVertical:12,minHeight:50,fontSize:18,borderRadius:14},xl:{paddingHorizontal:24,paddingVertical:14,minHeight:58,fontSize:20,borderRadius:16}},input:{sm:{...fieldSizes.sm,multilineMinHeight:72},md:{...fieldSizes.md,multilineMinHeight:92},lg:{...fieldSizes.lg,multilineMinHeight:110}},searchBar:{sm:{borderRadius:radius.full},md:{borderRadius:radius.full},lg:{borderRadius:radius.full}},emptyState:{sm:{iconSize:48,titleFontSize:"lg",descriptionFontSize:"sm",paddingVertical:"lg"},md:{iconSize:64,titleFontSize:"xl",descriptionFontSize:"base",paddingVertical:"xl"},lg:{iconSize:80,titleFontSize:"2xl",descriptionFontSize:"base",paddingVertical:"2xl"}},field:{defaultVariant:"outlined",sm:fieldSizes.sm,md:fieldSizes.md,lg:fieldSizes.lg},listItem:{sm:{paddingVertical:"sm",titleFontSize:"sm",subtitleFontSize:"xs",minHeight:44},md:{paddingVertical:"md",titleFontSize:"base",subtitleFontSize:"sm",minHeight:56},lg:{paddingVertical:"lg",titleFontSize:"lg",subtitleFontSize:"sm",minHeight:72}},badge:{sm:{fontSize:10,minWidth:16,height:16,paddingHorizontal:5,dotSize:8},md:{fontSize:11,minWidth:20,height:20,paddingHorizontal:6,dotSize:10},borderWidth:1.5,anchorOffset:4},chip:{sm:{paddingHorizontal:10,paddingVertical:4,fontSize:12,minHeight:26,closeSize:16,closeFontSize:12,gap:6},md:{paddingHorizontal:12,paddingVertical:6,fontSize:13,minHeight:32,closeSize:18,closeFontSize:13,gap:8}},checkbox:{sm:{boxSize:16},md:{boxSize:20},lg:{boxSize:24},labelGap:10},radio:{sm:{outer:16,inner:8},md:{outer:20,inner:10},lg:{outer:24,inner:12},labelGap:10},switch:{sm:{trackWidth:42,trackHeight:26,thumbSize:22,padding:2},md:{trackWidth:51,trackHeight:31,thumbSize:27,padding:2},lg:{trackWidth:60,trackHeight:36,thumbSize:32,padding:2},thumbColor:"#FFFFFF"},otpInput:{sm:{cell:36,fontSize:16,borderRadius:8,gap:8},md:{cell:48,fontSize:20,borderRadius:10,gap:10},lg:{cell:56,fontSize:24,borderRadius:12,gap:12}},dialog:{iconWrapperSize:48,iconWrapperBorderRadius:24,actionButtonMinHeight:44},toast:{iconCircleSize:28,iconCircleBorderRadius:14,iconGlyphFontSize:16,tintBarWidth:4},formField:{inlineLabelWidth:"35%"}},motion={duration:{instant:80,fast:160,normal:240,slow:360,slower:500},easing:{standard:[.4,0,.2,1],accelerate:[.4,0,1,1],decelerate:[0,0,.2,1],sharp:[.4,0,.6,1]},spring:{gentle:{damping:26,stiffness:240,mass:.9},bouncy:{damping:16,stiffness:200,mass:.7},snappy:{damping:20,stiffness:300,mass:.7}}},lightShadows={none:{},xs:{shadowColor:"#000",shadowOffset:{width:0,height:1},shadowOpacity:.04,shadowRadius:2,elevation:1},sm:{shadowColor:"#000",shadowOffset:{width:0,height:2},shadowOpacity:.06,shadowRadius:4,elevation:2},md:{shadowColor:"#000",shadowOffset:{width:0,height:4},shadowOpacity:.08,shadowRadius:8,elevation:4},lg:{shadowColor:"#000",shadowOffset:{width:0,height:8},shadowOpacity:.1,shadowRadius:16,elevation:8},xl:{shadowColor:"#000",shadowOffset:{width:0,height:12},shadowOpacity:.14,shadowRadius:24,elevation:12},"2xl":{shadowColor:"#000",shadowOffset:{width:0,height:20},shadowOpacity:.18,shadowRadius:32,elevation:20}},darkShadows={none:{},xs:{shadowColor:"#000",shadowOffset:{width:0,height:1},shadowOpacity:.3,shadowRadius:2,elevation:1},sm:{shadowColor:"#000",shadowOffset:{width:0,height:2},shadowOpacity:.4,shadowRadius:4,elevation:2},md:{shadowColor:"#000",shadowOffset:{width:0,height:4},shadowOpacity:.5,shadowRadius:8,elevation:4},lg:{shadowColor:"#000",shadowOffset:{width:0,height:8},shadowOpacity:.55,shadowRadius:16,elevation:8},xl:{shadowColor:"#000",shadowOffset:{width:0,height:12},shadowOpacity:.6,shadowRadius:24,elevation:12},"2xl":{shadowColor:"#000",shadowOffset:{width:0,height:20},shadowOpacity:.7,shadowRadius:32,elevation:20}};export const lightTheme={mode:"light",colors:{primary:"#5B5BD6",primaryHover:"#4F4FBF",primaryPressed:"#4040A8",primaryMuted:"#EEEEFC",secondary:"#F4F4F8",secondaryHover:"#E9E9F0",success:"#1FAD66",warning:"#F59E0B",error:"#E5484D",info:"#3B82F6",onPrimary:"#FFFFFF",onSecondary:"#0F0F1A",onSuccess:"#FFFFFF",onWarning:"#0F0F1A",onError:"#FFFFFF",onInfo:"#FFFFFF",onOverlay:"#FFFFFF",text:{primary:"#0F0F1A",secondary:"#52525B",tertiary:"#8B8B95",inverse:"#FFFFFF",strong:"#252F4A",disabled:"#B4B4BB",link:"#5B5BD6"},background:{primary:"#FFFFFF",secondary:"#F8F8FB",tertiary:"#F1F1F5",elevated:"#FFFFFF",overlay:"rgba(15, 15, 26, 0.5)",inverse:"#0F0F1A"},border:{primary:"#E5E5EC",secondary:"#EFEFF3",focus:"#5B5BD6",error:"#E5484D",width:1},field:{background:"#F9FBFC",backgroundFocused:"#FFFFFF",backgroundDisabled:"#F5F6FA",border:"#EBEDF3",borderFocused:"#BED2F9",borderError:"#FDBFCE",label:"#242F4A",text:"#252F4A",textDisabled:"#C4CADA",placeholder:"#99A1B7",placeholderDisabled:"#C4CADA",icon:"#99A1B7",iconFocused:"#4B5675",iconDisabled:"#C4CADA",caret:"#5B8DEE",message:"#E82545"},surface:{pressed:"rgba(15, 15, 26, 0.06)",hovered:"rgba(15, 15, 26, 0.04)",selected:"rgba(91, 91, 214, 0.1)",disabled:"#F1F1F5"},glass:{fill:"rgba(255, 255, 255, 0.28)",border:"rgba(255, 255, 255, 0.45)",on:"#0F0F1A",badge:"#FFFFFF"},skeleton:{background:"#EBEDF3",highlight:"#F5F6FA"},avatarPalette:["#5B5BD6","#0A7979","#A45A05","#CD226E","#2462EB","#7C3AED","#047C57","#D42222"]},typography:typography,spacing:spacing,radius:radius,cornerSmoothing:SQUIRCLE_SMOOTHING,shadows:lightShadows,motion:motion,components:components,gradients:{}};export const darkTheme={mode:"dark",colors:{primary:"#7C7CE8",primaryHover:"#9292EE",primaryPressed:"#A8A8F2",primaryMuted:"#1F1F3D",secondary:"#1F1F26",secondaryHover:"#2A2A33",success:"#30C780",warning:"#FBBF24",error:"#F87171",info:"#60A5FA",onPrimary:"#0F0F1A",onSecondary:"#FAFAFA",onSuccess:"#0F0F1A",onWarning:"#0F0F1A",onError:"#0F0F1A",onInfo:"#0F0F1A",onOverlay:"#FFFFFF",text:{primary:"#FAFAFA",secondary:"#B4B4BB",tertiary:"#71717A",inverse:"#0F0F1A",strong:"#E2E2E2",disabled:"#52525B",link:"#9292EE"},background:{primary:"#0B0B12",secondary:"#13131C",tertiary:"#1C1C26",elevated:"#1C1C26",overlay:"rgba(0, 0, 0, 0.65)",inverse:"#FAFAFA"},border:{primary:"#27272F",secondary:"#1C1C26",focus:"#7C7CE8",error:"#F87171",width:1},field:{background:"#13131C",backgroundFocused:"#0B0B12",backgroundDisabled:"#1C1C26",border:"#27272F",borderFocused:"#3D5FB0",borderError:"#8A2F42",label:"#E4E6EE",text:"#FAFAFA",textDisabled:"#52525B",placeholder:"#71717A",placeholderDisabled:"#52525B",icon:"#8B8B95",iconFocused:"#D4D4DB",iconDisabled:"#52525B",caret:"#7C9EF0",message:"#F87171"},surface:{pressed:"rgba(255, 255, 255, 0.08)",hovered:"rgba(255, 255, 255, 0.05)",selected:"rgba(124, 124, 232, 0.18)",disabled:"#1C1C26"},glass:{fill:"rgba(255, 255, 255, 0.28)",border:"rgba(255, 255, 255, 0.45)",on:"#0F0F1A",badge:"#FFFFFF"},skeleton:{background:"#1C1C26",highlight:"#27272F"},avatarPalette:["#8B8BEE","#2DD4BF","#FCD34D","#F472B6","#60A5FA","#A78BFA","#34D399","#F87171"]},typography:typography,spacing:spacing,radius:radius,cornerSmoothing:SQUIRCLE_SMOOTHING,shadows:darkShadows,motion:motion,components:components,gradients:{}};

package/lib/typescript/commonjs/components/AppIcon/defaultIcons.d.ts CHANGED Viewed

@@ -1,9 +1,9 @@
 /**
  * The library's own renderers for the affordances components draw
  * themselves: the password eye, the error glyph, SearchBar's magnifier and
- * clear button, FilePicker's attachment. Every one is an AppIcon, so an app
- * gets the design system's glyphs with zero setup; `theme.icons` still wins
- * when an app registers its own.
+ * clear button, FilePicker's attachment, OptionSheet's selected tick. Every
+ * one is an AppIcon, so an app gets the design system's glyphs with zero
+ * setup; `theme.icons` still wins when an app registers its own.
  */
 import type { IconRegistry } from '../../theme/types';
 export declare const defaultIcons: Required<IconRegistry>;

package/lib/typescript/commonjs/components/FieldBase/FieldBase.d.ts CHANGED Viewed

@@ -21,7 +21,7 @@
  *   - Helper / error / counter text rendered below the field.
  *   - Shake-on-error or any cross-field animation.
  */
-import React from 'react';
+import type React from 'react';
 import type { AccessibilityRole, AccessibilityState, StyleProp, TextStyle, ViewStyle } from 'react-native';
 import { Animated } from 'react-native';
 import type { FieldSide, FieldVariantTokens, ResolvedFieldSizeTokens, Theme } from '../../theme/types';

package/lib/typescript/commonjs/components/Input/Input.d.ts CHANGED Viewed

@@ -1,4 +1,4 @@
-import React from 'react';
+import type React from 'react';
 import type { BlurEvent, FocusEvent, StyleProp, TextInputProps, TextStyle, ViewStyle } from 'react-native';
 import { TextInput } from 'react-native';
 import type { SlotIcon, SlotIconState } from '../AppIcon/slotIcon';
@@ -65,7 +65,10 @@ export interface InputProps extends Omit<TextInputProps, 'style'> {
     placeholder?: string;
     value?: string;
     onChangeText?: (text: string) => void;
-    /** A string or a node. A non-empty value puts the field in the error state and replaces the helper. */
+    /**
+     * A string or a node puts the field in the error state and replaces the helper; `true` shows the
+     * error state without a message.
+     */
     error?: React.ReactNode;
     /** A string or a node. */
     helperText?: React.ReactNode;

package/lib/typescript/commonjs/components/Notation/Notation.d.ts CHANGED Viewed

@@ -1,4 +1,5 @@
-import React from 'react';
+import type React from 'react';
+import type { ColorValue } from 'react-native';
 export interface NotationRun {
     text: string;
     /** The subscript that follows `text`, when the run is a symbol. */
@@ -17,17 +18,27 @@ export interface NotationProps {
      * mixes such text with verbatim stored text. Needs a parent Text.
      */
     text?: string | readonly NotationTextRun[];
-    /** One symbol: the base, drawn with `sub` small and lowered after it. Renders its own Text. */
+    /** One symbol: the base, drawn with `sub` small and lowered after it. Needs a parent Text. */
     base?: string;
     sub?: string;
     /** Follows the symbol after a space. */
     desc?: string;
-    /** Subscript ink. Defaults to `colors.text.primary`; pass the parent's colour when it differs. */
+    /**
+     * Subscript ink. Inside a field label it defaults to the label's ink, elsewhere to
+     * `colors.text.primary`; pass the parent's colour when it differs.
+     */
     color?: string;
     testID?: string;
 }
 /** The text split into runs: `{ text }` for prose, `{ text, sub }` for a symbol and its subscript. */
 export declare const parseNotation: (text: string | null | undefined) => NotationRun[];
+/** The size and ink of the Text a Notation sits in, which the subscript's View cannot inherit. */
+export interface NotationInk {
+    fontSize: number;
+    color: ColorValue;
+}
+/** Provided by a label Text (FieldLabel) so a subscript inside it scales and inks with the label. */
+export declare const NotationInkContext: React.Context<NotationInk | null>;
 /** A symbol of a standard with its subscript drawn small and lowered below the baseline. */
 export declare const Notation: React.FC<NotationProps>;
 /** A symbol as the standard prints it: `sym('C', 'IP')` is C with a small IP, then `desc` if given. */

package/lib/typescript/commonjs/components/NumberInput/NumberInput.d.ts CHANGED Viewed

@@ -26,7 +26,10 @@ export interface NumberInputProps {
     help?: React.ReactNode;
     /** A string or a node. */
     helperText?: React.ReactNode;
-    /** A string or a node. A non-empty value puts the field in the error state and replaces the helper. */
+    /**
+     * A string or a node puts the field in the error state and replaces the helper; `true` shows the
+     * error state without a message.
+     */
     error?: React.ReactNode;
     disabled?: boolean;
     size?: NumberInputSize;

package/lib/typescript/commonjs/components/OTPInput/OTPInput.d.ts CHANGED Viewed

@@ -1,3 +1,4 @@
+import type { ReactNode } from 'react';
 import type { StyleProp, TextStyle, ViewStyle } from 'react-native';
 import type { HapticType } from '../../utils';
 export type OTPInputSize = 'sm' | 'md' | 'lg';
@@ -21,7 +22,11 @@ export interface OTPInputProps {
      */
     autoFocusDelay?: number;
     disabled?: boolean;
-    error?: boolean | string;
+    /**
+     * A string or a node puts the cells in the error state and shows it as the
+     * message below them; `true` shows the error state without a message.
+     */
+    error?: ReactNode;
     size?: OTPInputSize;
     secure?: boolean;
     /**

package/lib/typescript/commonjs/components/OptionSheet/OptionSheet.d.ts CHANGED Viewed

@@ -4,16 +4,17 @@
  * The picker behind Select and InlineSelect, exported so an app can open the
  * same sheet from its own trigger: RN Modal-backed slide-up
  * sheet with backdrop fade, grab handle, optional title, optional client-side
- * search, the option list (icon + label + description, single dot / multi
- * checkbox) and the multi-select Done footer. Owns the open/close animations
- * and the search query; selection STATE stays with the caller — the sheet
- * only reports `onSelect(option)` and asks `isSelected(value)`.
+ * search, the option list (icon + label + description, single dot or tick
+ * icon / multi checkbox) and the multi-select Done footer. Owns the
+ * open/close animations and the search query; selection STATE stays with
+ * the caller — the sheet only reports `onSelect(option)` and asks
+ * `isSelected(value)`.
  *
  * Also the home of the canonical option types (`SelectValue`, `SelectOption`)
  * and accessor signatures shared by every option-picking component. Select
  * re-exports them so the public import path is unchanged.
  */
-import React from 'react';
+import type React from 'react';
 import type { StyleProp, TextStyle, ViewStyle } from 'react-native';
 export type SelectValue = string | number;
 export interface SelectOption {
@@ -58,7 +59,7 @@ export interface OptionSheetProps {
     renderSectionHeader?: (title: string) => React.ReactNode;
     /**
      * Replace the row's content (icon + label + description) with your own. The
-     * pressable row, its accessibility state and the selected dot / checkbox
+     * pressable row, its accessibility state and the selected mark / checkbox
      * stay, so a custom row is still a button to a screen reader.
      */
     renderOption?: (option: unknown, state: OptionSheetRowState) => React.ReactNode;

package/lib/typescript/commonjs/components/PickerTrigger/PickerTrigger.d.ts CHANGED Viewed

@@ -11,7 +11,7 @@
  *     internally and manages its own open/close.
  *   - Render PickerTrigger themselves alongside a controlled picker.
  */
-import React from 'react';
+import type React from 'react';
 import type { View as RNView, StyleProp, TextStyle, ViewStyle } from 'react-native';
 import type { FieldBaseSize, FieldBaseVariant } from '../FieldBase';
 export type PickerTriggerSize = FieldBaseSize;
@@ -27,7 +27,10 @@ export interface PickerTriggerProps {
     help?: React.ReactNode;
     /** Helper text shown below the field. Hidden when `error` is set. A string or a node. */
     helperText?: React.ReactNode;
-    /** Error message shown below the field (and red-borders the field). A string or a node. */
+    /**
+     * Error message shown below the field (and red-borders the field). A string or a node; `true`
+     * shows the error state without a message.
+     */
     error?: React.ReactNode;
     /**
      * Appends the required marker to the label. Marker text + colour come from

package/lib/typescript/commonjs/components/Select/Select.d.ts CHANGED Viewed

@@ -6,7 +6,7 @@
  * drift between the two. Supports optional client-side search, theme-aware
  * styling, full a11y, and dark-mode auto.
  */
-import React from 'react';
+import type React from 'react';
 import type { View as RNView, StyleProp, TextStyle, ViewStyle } from 'react-native';
 import type { HapticType } from '../../utils';
 import type { SlotIcon } from '../AppIcon/slotIcon';
@@ -66,7 +66,10 @@ interface BaseSelectProps<T = SelectOption> {
      * `'*'` in `colors.error`).
      */
     required?: boolean;
-    /** A string or a node. A non-empty value puts the trigger in the error state. */
+    /**
+     * A string or a node puts the trigger in the error state and shows it below; `true` shows the
+     * error state without a message.
+     */
     error?: React.ReactNode;
     /** Hint under the field, shown while there is no `error`. A string or a node. */
     helperText?: React.ReactNode;

package/lib/typescript/commonjs/components/SliderField/SliderField.d.ts CHANGED Viewed

@@ -13,7 +13,10 @@ interface SliderFieldCommonProps {
     /** Appends the required marker to the label. */
     required?: boolean;
     helperText?: string;
-    /** Shown in place of `helperText`, in the error colour; the value box turns red with an icon. */
+    /**
+     * Shown in place of `helperText`, in the error colour; the value box turns red with an icon. `true`
+     * shows the error state without a message.
+     */
     error?: React.ReactNode;
     min?: number;
     max?: number;

package/lib/typescript/commonjs/theme/types.d.ts CHANGED Viewed

@@ -638,6 +638,15 @@ export interface InlineSelectTokens {
     /** Trigger text + chevron colour. Library default: `colors.primary`. */
     color?: string;
 }
+export interface OptionSheetTokens {
+    /**
+     * Mark on the selected row of a single-choice sheet (Select, InlineSelect,
+     * PhoneNumberInput and every other OptionSheet): `'dot'` is an 8 px dot,
+     * `'icon'` the `tick-circle` icon in its bulk style at 20 px. Both are drawn
+     * in `colors.primary`. Multi-select keeps its checkbox. Library default: `'dot'`.
+     */
+    selectedMarker?: 'dot' | 'icon';
+}
 export interface SelectTokens {
     /** Colour of the grab-handle rendered above the bottom-sheet picker. Library default: `colors.border.primary`. */
     handleColor?: string;
@@ -1022,6 +1031,7 @@ export interface ComponentTokens {
     listItem?: ListItemTokens;
     modal?: ModalTokens;
     numberInput?: NumberInputTokens;
+    optionSheet?: OptionSheetTokens;
     otpInput?: OTPInputTokens;
     phoneNumberInput?: PhoneNumberInputTokens;
     profilePicker?: ProfilePickerTokens;
@@ -1096,6 +1106,11 @@ export interface IconRegistry {
     chevronDown?: IconRenderer;
     /** Trailing "goes somewhere" chevron on ListItem. Default `chevron-right`. */
     chevronRight?: IconRenderer;
+    /**
+     * Mark on the selected row of a single-choice option sheet when
+     * `components.optionSheet.selectedMarker` is `'icon'`. Default `tick-circle`, bulk.
+     */
+    selectedTick?: IconRenderer;
 }
 /**
  * An app's own text style, registered under a name in `theme.textVariants` and
@@ -1121,6 +1136,14 @@ export interface Theme {
     typography: TypographyScale;
     spacing: SpacingScale;
     radius: RadiusScale;
+    /**
+     * Corner smoothing of the squircle Android draws behind Button, Card,
+     * fields, Box and the other smooth-cornered hosts: 0 is a plain rounded
+     * rectangle, 1 the fullest curve. iOS draws Apple's continuous curve, which
+     * has no smoothing setting, so this changes Android only. Library default:
+     * `SQUIRCLE_SMOOTHING` (0.6, Figma's "iOS" preset).
+     */
+    cornerSmoothing: number;
     shadows: ShadowScale;
     motion: MotionScale;
     components: ComponentTokens;