@webority/mobile-ui 0.9.1 → 0.11.0

package/lib/module/components/Checkbox/Checkbox.js

@@ -1 +1 @@
-"use strict";import{forwardRef,useEffect,useMemo,useRef}from"react";import{Animated,Pressable,StyleSheet,View}from"react-native";import Svg,{Path}from"react-native-svg";import{useControllableState}from"../../hooks/index.js";import{createAnimatedValue,useTheme}from"../../theme/index.js";import{smoothCorners}from"../../utils/corners.js";import{resolveHaptic,triggerHaptic}from"../../utils/hapticUtils.js";import{ChoiceText,hasChoiceDetail}from"../FieldBase/ChoiceText.js";import{fieldTextAsString,hasFieldText}from"../FieldBase/FieldBase.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const sizeMap={sm:16,md:20,lg:24},toneColor=(e,r)=>{switch(r){case"success":return e.colors.success;case"warning":return e.colors.warning;case"error":return e.colors.error;default:return e.colors.primary}},toneOnColor=(e,r)=>{switch(r){case"success":return e.colors.onSuccess;case"warning":return e.colors.onWarning;case"error":return e.colors.onError;default:return e.colors.onPrimary}},Checkbox=forwardRef((e,r)=>{const{checked:t,defaultChecked:s,onChange:o,indeterminate:i=!1,disabled:a=!1,label:n,description:l,error:c,help:d,labelLines:h,size:p="md",tone:m="primary",accessibilityLabel:u,haptic:x,style:b,boxStyle:f,indeterminateBarStyle:g,containerStyle:y,labelStyle:w,testID:C,...S}=e,[j,k]=useControllableState({value:t,defaultValue:s??!1,onChange:o}),T=useTheme(),v=useMemo(()=>buildStyles(T),[T]),R=T.components.checkbox?.[p]?.boxSize??sizeMap[p],_=T.colors.border.width,L=T.components.checkbox?.labelGap??10,V=toneColor(T,m),M=j||i,A=useRef(createAnimatedValue(M?1:0)).current;useEffect(()=>{const e=Animated.spring(A,{toValue:M?1:0,damping:T.motion.spring.snappy.damping,stiffness:T.motion.spring.snappy.stiffness,mass:T.motion.spring.snappy.mass,useNativeDriver:!0});return e.start(),()=>e.stop()},[M,A,T.motion.spring.snappy]);const D=A.interpolate({inputRange:[0,1],outputRange:[0,1]}),F=u??fieldTextAsString(n),I=M?V:a?T.colors.border.primary:hasFieldText(c)?T.colors.field.borderError:T.colors.border.primary,P=M?V:a?T.colors.surface.disabled:"transparent",H=a&&!M?T.colors.text.disabled:toneOnColor(T,m),B=Math.round(.72*R),W=Math.round(.55*R),z=Math.max(2,Math.round(.12*R)),E=_jsxs(Pressable,{ref:r,onPress:e=>{if(a)return;const r=resolveHaptic(x,"selection");r&&triggerHaptic(r),k(!j),S.onPressOut?.(e)},disabled:a,accessibilityRole:"checkbox",accessibilityLabel:F,accessibilityHint:S.accessibilityHint??fieldTextAsString(l),accessibilityState:{checked:i?"mixed":j,disabled:a},"aria-checked":i?"mixed":j,"aria-disabled":a,testID:C,hitSlop:6,...S,style:({pressed:e})=>[v.row,hasChoiceDetail(l,c)?v.rowTop:null,hasFieldText(d)?v.rowShrink:null,{opacity:a?.55:e?.85:1},y,b],children:[_jsx(View,{style:[v.box,{width:R,height:R,borderWidth:_,borderRadius:T.radius.xs,...smoothCorners,borderColor:I,backgroundColor:P},f],children:_jsx(Animated.View,{style:[v.glyphWrap,{opacity:A,transform:[{scale:D}]}],children:i?_jsx(View,{style:[{width:W,height:z,borderRadius:z/2,...smoothCorners,backgroundColor:H},g]}):_jsx(Svg,{width:B,height:B,viewBox:"0 0 24 24",children:_jsx(Path,{d:"M5 12.5l4.5 4.5L19 7.5",stroke:H,strokeWidth:3,strokeLinecap:"round",strokeLinejoin:"round",fill:"none"})})})}),_jsx(ChoiceText,{label:n,description:l,error:c,disabled:a,labelLines:h||void 0,descriptionLines:h||void 0,style:{marginLeft:L},labelStyle:w})]});return hasFieldText(d)?_jsxs(View,{style:[v.helpRow,hasChoiceDetail(l,c)?v.rowTop:null],children:[E,_jsx(View,{style:[v.help,{marginLeft:T.spacing.xs}],children:d})]}):E});Checkbox.displayName="Checkbox";const buildStyles=e=>StyleSheet.create({row:{flexDirection:"row",alignItems:"center"},rowTop:{alignItems:"flex-start"},rowShrink:{flexShrink:1},helpRow:{flexDirection:"row",alignItems:"center"},help:{flexShrink:0},box:{alignItems:"center",justifyContent:"center"},glyphWrap:{alignItems:"center",justifyContent:"center"}});export{Checkbox};export default Checkbox;
+"use strict";import{forwardRef,useEffect,useMemo,useRef}from"react";import{Animated,Pressable,StyleSheet,View}from"react-native";import Svg,{Path}from"react-native-svg";import{useControllableState}from"../../hooks/index.js";import{createAnimatedValue,useTheme}from"../../theme/index.js";import{smoothCorners}from"../../utils/corners.js";import{resolveHaptic,triggerHaptic}from"../../utils/hapticUtils.js";import{ChoiceText,hasChoiceDetail}from"../FieldBase/ChoiceText.js";import{fieldTextAsString,hasFieldText}from"../FieldBase/FieldBase.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const sizeMap={sm:16,md:20,lg:24},toneColor=(e,r)=>{switch(r){case"success":return e.colors.success;case"warning":return e.colors.warning;case"error":return e.colors.error;default:return e.colors.primary}},toneOnColor=(e,r)=>{switch(r){case"success":return e.colors.onSuccess;case"warning":return e.colors.onWarning;case"error":return e.colors.onError;default:return e.colors.onPrimary}},Checkbox=forwardRef((e,r)=>{const{checked:t,defaultChecked:s,onChange:o,indeterminate:i=!1,disabled:a=!1,label:n,description:l,error:c,help:d,labelLines:h,size:p="md",tone:m="primary",accessibilityLabel:u,haptic:x,style:b,boxStyle:f,indeterminateBarStyle:g,containerStyle:y,labelStyle:w,testID:C,...S}=e,[j,k]=useControllableState({value:t,defaultValue:s??!1,onChange:o}),T=useTheme(),v=useMemo(()=>buildStyles(T),[T]),R=T.components.checkbox?.[p]?.boxSize??sizeMap[p],_=T.colors.border.width,L=T.components.checkbox?.labelGap??10,V=toneColor(T,m),M=j||i,A=useRef(createAnimatedValue(M?1:0)).current;useEffect(()=>{const e=Animated.spring(A,{toValue:M?1:0,damping:T.motion.spring.snappy.damping,stiffness:T.motion.spring.snappy.stiffness,mass:T.motion.spring.snappy.mass,useNativeDriver:!0});return e.start(),()=>e.stop()},[M,A,T.motion.spring.snappy]);const D=A.interpolate({inputRange:[0,1],outputRange:[0,1]}),F=u??fieldTextAsString(n),I=!0===c||hasFieldText(c),P=M?V:a?T.colors.border.primary:I?T.colors.field.borderError:T.colors.border.primary,H=M?V:a?T.colors.surface.disabled:"transparent",B=a&&!M?T.colors.text.disabled:toneOnColor(T,m),W=Math.round(.72*R),z=Math.round(.55*R),E=Math.max(2,Math.round(.12*R)),O=_jsxs(Pressable,{ref:r,onPress:e=>{if(a)return;const r=resolveHaptic(x,"selection");r&&triggerHaptic(r),k(!j),S.onPressOut?.(e)},disabled:a,accessibilityRole:"checkbox",accessibilityLabel:F,accessibilityHint:S.accessibilityHint??fieldTextAsString(l),accessibilityState:{checked:i?"mixed":j,disabled:a},"aria-checked":i?"mixed":j,"aria-disabled":a,testID:C,hitSlop:6,...S,style:({pressed:e})=>[v.row,hasChoiceDetail(l,c)?v.rowTop:null,hasFieldText(d)?v.rowShrink:null,{opacity:a?.55:e?.85:1},y,b],children:[_jsx(View,{style:[v.box,{width:R,height:R,borderWidth:_,borderRadius:T.radius.xs,...smoothCorners,borderColor:P,backgroundColor:H},f],children:_jsx(Animated.View,{style:[v.glyphWrap,{opacity:A,transform:[{scale:D}]}],children:i?_jsx(View,{style:[{width:z,height:E,borderRadius:E/2,...smoothCorners,backgroundColor:B},g]}):_jsx(Svg,{width:W,height:W,viewBox:"0 0 24 24",children:_jsx(Path,{d:"M5 12.5l4.5 4.5L19 7.5",stroke:B,strokeWidth:3,strokeLinecap:"round",strokeLinejoin:"round",fill:"none"})})})}),_jsx(ChoiceText,{label:n,description:l,error:c,disabled:a,labelLines:h||void 0,descriptionLines:h||void 0,style:{marginLeft:L},labelStyle:w})]});return hasFieldText(d)?_jsxs(View,{style:[v.helpRow,hasChoiceDetail(l,c)?v.rowTop:null],children:[O,_jsx(View,{style:[v.help,{marginLeft:T.spacing.xs}],children:d})]}):O});Checkbox.displayName="Checkbox";const buildStyles=e=>StyleSheet.create({row:{flexDirection:"row",alignItems:"center"},rowTop:{alignItems:"flex-start"},rowShrink:{flexShrink:1},helpRow:{flexDirection:"row",alignItems:"center"},help:{flexShrink:0},box:{alignItems:"center",justifyContent:"center"},glyphWrap:{alignItems:"center",justifyContent:"center"}});export{Checkbox};export default Checkbox;

package/lib/module/components/Composer/Composer.js

@@ -0,0 +1 @@
+"use strict";import{forwardRef,useCallback,useMemo,useState}from"react";import{Platform,StyleSheet,TextInput,View}from"react-native";import{KeyboardStickyView}from"react-native-keyboard-controller";import{useSafeAreaInsets}from"react-native-safe-area-context";import{useControllableState}from"../../hooks/useControllableState.js";import{useTheme}from"../../theme/index.js";import{smoothCorners}from"../../utils/corners.js";import{resolveFieldTextStyle}from"../FieldBase/FieldBase.js";import{IconButton}from"../IconButton/index.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const MIN_BOX=44;export const Composer=forwardRef(({onSend:e,value:o,onChangeText:t,placeholder:a="Message",accessibilityLabel:i,sendLabel:r="Send",busy:s=!1,disabled:l=!1,maxLength:n,maxLines:d=5,leading:c,trailing:m,above:b,below:p,keyboardAware:u=!0,keyboardOffset:g,safeArea:h=!0,autoFocus:f,haptic:x,style:y,testID:S},C)=>{const j=useTheme(),v=useSafeAreaInsets(),w=useMemo(()=>buildStyles(j),[j]),[k,I]=useControllableState({value:o,defaultValue:"",onChange:t}),T=k.trim(),V=s||l||""===T,_=h?v.bottom:0,D=g??_,z=resolveFieldTextStyle(j,{disabled:l}),B=j.typography.fontSize.base,F=Math.round(B*j.typography.lineHeight.normal),H=(44-F)/2,L=F*d+2*H,[M,A]=useState(void 0),P=useCallback(e=>{const o=e.nativeEvent.contentSize.height+2*H;A(Math.min(Math.max(o,44),L))},[H,L]),O=useCallback(()=>{V||(I(""),e(T))},[V,I,e,T]),R=_jsxs(View,{style:[w.bar,{paddingBottom:j.spacing.sm+_},y],testID:S,children:[b,_jsxs(View,{style:w.row,children:[c,_jsx(View,{style:[w.box,l?w.boxDisabled:null],children:_jsx(TextInput,{ref:C,value:k,onChangeText:I,multiline:!0,maxLength:n,editable:!l,autoFocus:f,placeholder:a,placeholderTextColor:z.placeholderColor,selectionColor:j.colors.field.caret,accessibilityLabel:i??a,accessibilityState:{disabled:l},"aria-disabled":l,onContentSizeChange:"web"===Platform.OS?P:void 0,style:[w.input,{color:z.color,...z.weightStyle,fontSize:B,lineHeight:F,paddingVertical:H,maxHeight:L,height:"web"===Platform.OS?M:void 0}],testID:S?`${S}-input`:void 0})}),m,_jsx(IconButton,{icon:"send",accessibilityLabel:r,variant:"solid",tone:"primary",disabled:V,loading:s,haptic:x,onPress:O,testID:S?`${S}-send`:void 0})]}),p]});return u?_jsx(KeyboardStickyView,{offset:{closed:0,opened:D},children:R}):R});Composer.displayName="Composer";const buildStyles=e=>StyleSheet.create({bar:{gap:e.spacing.xs,paddingHorizontal:e.spacing.md,paddingTop:e.spacing.sm,backgroundColor:e.colors.background.primary,borderTopWidth:StyleSheet.hairlineWidth,borderTopColor:e.colors.border.secondary},row:{flexDirection:"row",alignItems:"flex-end",gap:e.spacing.sm},box:{flex:1,minHeight:44,justifyContent:"center",backgroundColor:e.colors.field.background,borderRadius:22,...smoothCorners,paddingHorizontal:e.spacing.md},boxDisabled:{backgroundColor:e.colors.field.backgroundDisabled},input:{margin:0,paddingHorizontal:0,includeFontPadding:!1,textAlignVertical:"top"}});export default Composer;

package/lib/module/components/Composer/index.js

@@ -0,0 +1 @@
+"use strict";export{Composer,default}from"./Composer.js";

package/lib/module/components/DateSeparator/DateSeparator.js

@@ -0,0 +1 @@
+"use strict";import{formatDate}from"@webority/mobile-core";import{useMemo}from"react";import{StyleSheet,View}from"react-native";import{useTheme}from"../../theme/index.js";import{Text}from"../Text/index.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";export const DEFAULT_DATE_SEPARATOR_LABELS=Object.freeze({today:"Today",yesterday:"Yesterday"});const DAY_MS=864e5;export const dayLabel=(e,t={})=>{const r=formatDate(e,{empty:""});if(!r)return"";const o={...DEFAULT_DATE_SEPARATOR_LABELS,...t.labels},s=t.now??new Date;return r===formatDate(s)?o.today:r===formatDate(new Date(s.getTime()-DAY_MS))?o.yesterday:r};export const DateSeparator=({date:e,label:t,emphasis:r=!1,labels:o,now:s,style:a,testID:i})=>{const l=useTheme(),n=useMemo(()=>buildStyles(l),[l]),m=t??(void 0===e?"":dayLabel(e,{now:s,labels:o})),c=r?l.colors.primary:l.colors.border.secondary;return _jsxs(View,{style:[n.row,a],testID:i,children:[_jsx(View,{style:[n.rule,{backgroundColor:c}]}),_jsx(Text,{variant:"caption",weight:r?"semibold":"medium",color:r?l.colors.toneText.primary:"secondary",accessibilityRole:"header",children:m}),_jsx(View,{style:[n.rule,{backgroundColor:c}]})]})};const buildStyles=e=>StyleSheet.create({row:{flexDirection:"row",alignItems:"center",gap:e.spacing.sm,paddingVertical:e.spacing.sm},rule:{flex:1,height:StyleSheet.hairlineWidth}});export default DateSeparator;

package/lib/module/components/DateSeparator/index.js

@@ -0,0 +1 @@
+"use strict";export{DateSeparator,DEFAULT_DATE_SEPARATOR_LABELS,dayLabel,default}from"./DateSeparator.js";

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

@@ -1 +1 @@
-"use strict";import{StyleSheet,Text,View}from"react-native";import{fontFor,useTheme}from"../../theme/index.js";import{FieldErrorGlyph,hasFieldText}from"./FieldBase.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";export const hasChoiceDetail=(e,s)=>hasFieldText(e)||hasFieldText(s);export const ChoiceText=({label:e,description:s,error:t,disabled:o=!1,labelLines:l,descriptionLines:r,style:i,labelStyle:n})=>{const a=useTheme();if(!hasFieldText(e)&&!hasFieldText(s)&&!hasFieldText(t))return null;const c=a.typography.fontSize.sm;return _jsxs(View,{style:[styles.column,i],children:[hasFieldText(e)?_jsx(Text,{style:[{color:o?a.colors.text.disabled:a.colors.text.primary,fontSize:a.typography.fontSize.base,...fontFor(a,"normal")},n],numberOfLines:l,children:e}):null,hasFieldText(s)?_jsx(Text,{style:{color:o?a.colors.text.disabled:a.colors.text.secondary,fontSize:c,marginTop:a.spacing.xs/2,...fontFor(a,"normal")},numberOfLines:r,children:s}):null,hasFieldText(t)?_jsxs(View,{style:[styles.errorRow,{marginTop:a.spacing.xs,columnGap:a.spacing.xs}],accessibilityLiveRegion:"polite",children:[_jsx(FieldErrorGlyph,{size:c,color:a.colors.field.message}),_jsx(Text,{style:{flexShrink:1,color:a.colors.field.message,fontSize:c,...fontFor(a,"normal")},children:t})]}):null]})};const styles=StyleSheet.create({column:{flexShrink:1},errorRow:{flexDirection:"row",alignItems:"center"}});
+"use strict";import{StyleSheet,Text,View}from"react-native";import{fontFor,useTheme}from"../../theme/index.js";import{NotationInkContext,useNotationInk}from"../Notation/Notation.js";import{FieldErrorGlyph,hasFieldText}from"./FieldBase.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";export const hasChoiceDetail=(e,o)=>hasFieldText(e)||hasFieldText(o);export const ChoiceText=({label:e,description:o,error:t,disabled:s=!1,labelLines:i,descriptionLines:r,style:l,labelStyle:n})=>{const a=useTheme(),x=s?a.colors.text.disabled:a.colors.text.primary,c=s?a.colors.text.disabled:a.colors.text.secondary,d=a.typography.fontSize.sm,h=useNotationInk(n,a.typography.fontSize.base,x),m=useNotationInk(void 0,d,c),p=useNotationInk(void 0,d,a.colors.field.message);return hasFieldText(e)||hasFieldText(o)||hasFieldText(t)?_jsxs(View,{style:[styles.column,l],children:[hasFieldText(e)?_jsx(Text,{style:[{color:x,fontSize:a.typography.fontSize.base,...fontFor(a,"normal")},n],numberOfLines:i,children:_jsx(NotationInkContext.Provider,{value:h,children:e})}):null,hasFieldText(o)?_jsx(Text,{style:{color:c,fontSize:d,marginTop:a.spacing.xs/2,...fontFor(a,"normal")},numberOfLines:r,children:_jsx(NotationInkContext.Provider,{value:m,children:o})}):null,hasFieldText(t)?_jsxs(View,{style:[styles.errorRow,{marginTop:a.spacing.xs,columnGap:a.spacing.xs}],accessibilityLiveRegion:"polite",children:[_jsx(FieldErrorGlyph,{size:d,color:a.colors.field.message}),_jsx(Text,{style:{flexShrink:1,color:a.colors.field.message,fontSize:d,...fontFor(a,"normal")},children:_jsx(NotationInkContext.Provider,{value:p,children:t})})]}):null]}):null};const styles=StyleSheet.create({column:{flexShrink:1},errorRow:{flexDirection:"row",alignItems:"center"}});

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

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

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

@@ -1 +1 @@
-"use strict";import{useEffect,useMemo,useRef,useState}from"react";import{Animated,Easing,StyleSheet}from"react-native";import{createAnimatedValue,fontFor,useTheme}from"../../theme/index.js";import{hasFieldText,RequiredMark}from"./FieldBase.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";export const FLOATED_LABEL_SCALE=.85;const FLOATED_LABEL_LIFT=1,NOTCH_GAP=4;export const useFloatingLabel=({label:e,enabled:t,floated:n,required:i=!1,variant:a,sizeTokens:r,leadingOffset:o,trailingOffset:s=0,textAlign:l="left",paddingLeft:u,lineHeight:d,restNudge:g=0,floatTrim:m=0,color:f,style:c})=>{const h=useTheme(),p=useRef(createAnimatedValue(n?1:0)).current,x=useRef(createAnimatedValue(n?1:0)).current,A="outlined"===a,[R,E]=useState(null);return useEffect(()=>{const e=n?1:0,timing=(t,n)=>Animated.timing(t,{toValue:e,duration:h.motion.duration.fast,easing:Easing.bezier(...h.motion.easing.standard),useNativeDriver:n});A||x.setValue(e);const t=A?Animated.parallel([timing(p,!0),timing(x,!1)]):timing(p,!0);return t.start(),()=>t.stop()},[n,A,p,x,h.motion.duration.fast,h.motion.easing.standard]),useMemo(()=>{if(!t||!hasFieldText(e))return{node:null,topNotch:void 0};const n=d??R?.height??r.fontSize,a=null!=d?r.paddingVertical+g:Math.max(0,(r.minHeight-n)/2),L=-(a+n/2+1-m),S=p.interpolate({inputRange:[0,1],outputRange:[0,L]}),T=p.interpolate({inputRange:[0,1],outputRange:[1,.85]}),j=-o,v=p.interpolate({inputRange:[0,1],outputRange:[0,j]}),F="right"===l?{right:r.paddingHorizontal+s,transformOrigin:"right center"}:"center"===l?{alignSelf:"center",transformOrigin:"center"}:{left:u+o,transformOrigin:"left center"},_=R?.85*R.width:0,y=R?"right"===l?R.width-_:"center"===l?(R.width-_)/2:0:0,O=A&&R?{left:R.x+j+y-4,width:x.interpolate({inputRange:[0,1],outputRange:[0,_+8]})}:void 0;return{node:_jsxs(Animated.Text,{pointerEvents:"none",onLayout:e=>{const{x:t,width:n,height:i}=e.nativeEvent.layout;E(e=>e&&e.x===t&&e.width===n&&e.height===i?e:{x:t,width:n,height:i})},style:[styles.label,F,{top:a,color:f,fontSize:r.fontSize,lineHeight:d,...fontFor(h,"medium"),transform:[{translateX:v},{translateY:S},{scale:T}]},c],children:[e,i?_jsx(RequiredMark,{}):null]}),topNotch:O}},[t,e,i,A,r,o,s,l,u,d,g,m,f,c,p,x,R,h])};const styles=StyleSheet.create({label:{position:"absolute",zIndex:1}});
+"use strict";import{useEffect,useMemo,useRef,useState}from"react";import{Animated,Easing,StyleSheet}from"react-native";import{createAnimatedValue,fontFor,useTheme}from"../../theme/index.js";import{NotationInkContext}from"../Notation/Notation.js";import{hasFieldText,RequiredMark}from"./FieldBase.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";export const FLOATED_LABEL_SCALE=.85;const FLOATED_LABEL_LIFT=1,NOTCH_GAP=4;export const useFloatingLabel=({label:t,enabled:e,floated:n,required:i=!1,variant:o,sizeTokens:a,leadingOffset:r,trailingOffset:s=0,textAlign:l="left",paddingLeft:u,lineHeight:d,restNudge:f=0,floatTrim:m=0,color:c,style:g})=>{const h=useTheme(),p=useRef(createAnimatedValue(n?1:0)).current,x=useRef(createAnimatedValue(n?1:0)).current,S="outlined"===o,[A,R]=useState(null);return useEffect(()=>{const t=n?1:0,timing=(e,n)=>Animated.timing(e,{toValue:t,duration:h.motion.duration.fast,easing:Easing.bezier(...h.motion.easing.standard),useNativeDriver:n});S||x.setValue(t);const e=S?Animated.parallel([timing(p,!0),timing(x,!1)]):timing(p,!0);return e.start(),()=>e.stop()},[n,S,p,x,h.motion.duration.fast,h.motion.easing.standard]),useMemo(()=>{if(!e||!hasFieldText(t))return{node:null,topNotch:void 0};const n=d??A?.height??a.fontSize,o=null!=d?a.paddingVertical+f:Math.max(0,(a.minHeight-n)/2),j=-(o+n/2+1-m),v=p.interpolate({inputRange:[0,1],outputRange:[0,j]}),E=p.interpolate({inputRange:[0,1],outputRange:[1,.85]}),L=-r,T=p.interpolate({inputRange:[0,1],outputRange:[0,L]}),z="right"===l?{right:a.paddingHorizontal+s,transformOrigin:"right center"}:"center"===l?{alignSelf:"center",transformOrigin:"center"}:{left:u+r,transformOrigin:"left center"},_=A?.85*A.width:0,y=A?"right"===l?A.width-_:"center"===l?(A.width-_)/2:0:0,F=S&&A?{left:A.x+L+y-4,width:x.interpolate({inputRange:[0,1],outputRange:[0,_+8]})}:void 0,N=StyleSheet.flatten(g),O={fontSize:N?.fontSize??a.fontSize,color:N?.color??c};return{node:_jsxs(Animated.Text,{pointerEvents:"none",onLayout:t=>{const{x:e,width:n,height:i}=t.nativeEvent.layout;R(t=>t&&t.x===e&&t.width===n&&t.height===i?t:{x:e,width:n,height:i})},style:[styles.label,z,{top:o,color:c,fontSize:a.fontSize,lineHeight:d,...fontFor(h,"medium"),transform:[{translateX:T},{translateY:v},{scale:E}]},g],children:[_jsx(NotationInkContext.Provider,{value:O,children:t}),i?_jsx(RequiredMark,{}):null]}),topNotch:F}},[e,t,i,S,a,r,s,l,u,d,f,m,c,g,p,x,A,h])};const styles=StyleSheet.create({label:{position:"absolute",zIndex:1}});

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

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

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

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

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

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

package/lib/module/components/ListItem/ListItem.js

@@ -1 +1 @@
-"use strict";import React,{forwardRef,useMemo}from"react";import{Animated,Pressable,StyleSheet,Text,useWindowDimensions,View}from"react-native";import Svg,{Path}from"react-native-svg";import{useFlickGuard}from"../../hooks/useFlickGuard.js";import{usePressAnimation}from"../../hooks/usePressAnimation.js";import{fontFor,useTheme}from"../../theme/index.js";import{smoothCorners}from"../../utils/corners.js";import{resolveHaptic,triggerHaptic}from"../../utils/hapticUtils.js";import{defaultIcons}from"../AppIcon/defaultIcons.js";import{Button}from"../Button/index.js";import{IconBadge}from"../IconBadge/index.js";import{Skeleton}from"../Skeleton/index.js";import{Swipeable}from"../Swipeable/index.js";import{Fragment as _Fragment,jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const SIZE_FALLBACK={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}},sizeFor=(e,t)=>{const i={...SIZE_FALLBACK[t],...e.components.listItem?.[t]??{}};return{paddingVertical:e.spacing[i.paddingVertical],titleSize:e.typography.fontSize[i.titleFontSize],subtitleSize:e.typography.fontSize[i.subtitleFontSize],minHeight:i.minHeight}},Chevron=({color:e})=>{const t=useTheme();return _jsx(_Fragment,{children:(t.icons?.chevronRight??defaultIcons.chevronRight)({size:20,color:e})})},BADGE_SIZE={sm:"sm",md:"md",lg:"lg"},RIGHT_BELOW_FONT_SCALE=1.2,DEFAULT_BOX_SIZE=20,SelectionBox=({checked:e,disabled:t})=>{const i=useTheme(),s=i.components.checkbox?.md?.boxSize??20,n=Math.round(.72*s);return _jsx(View,{accessibilityElementsHidden:!0,importantForAccessibility:"no-hide-descendants",pointerEvents:"none",style:{width:s,height:s,alignItems:"center",justifyContent:"center",borderWidth:i.colors.border.width,borderRadius:i.radius.xs,...smoothCorners,borderColor:e?i.colors.primary:i.colors.border.primary,backgroundColor:e?i.colors.primary:t?i.colors.surface.disabled:"transparent"},children:e?_jsx(Svg,{width:n,height:n,viewBox:"0 0 24 24",children:_jsx(Path,{d:"M5 12.5l4.5 4.5L19 7.5",stroke:i.colors.onPrimary,strokeWidth:3,strokeLinecap:"round",strokeLinejoin:"round",fill:"none"})}):null})},isActionList=e=>Array.isArray(e)&&e.length>0&&e.every(e=>null!=e&&"object"==typeof e&&!React.isValidElement(e)&&"label"in e),renderActions=e=>isActionList(e)?e.map(e=>_jsx(Button,{size:"sm",variant:e.variant??"outline",tone:e.tone,leftIcon:e.icon,disabled:e.disabled,testID:e.testID,title:e.label,onPress:e.onPress},e.label)):e,ListItem=forwardRef((e,t)=>{const{title:i,loading:s=!1,subtitle:n,description:o,titleLines:l=1,subtitleLines:r=1,left:a,icon:c,iconTone:d="primary",right:m,rightPlacement:h="auto",selectable:g=!1,checked:u=!1,onCheckedChange:p,actions:b,onPress:x,haptic:y,selected:f=!1,disabled:S=!1,size:j="md",divider:_=!1,chevron:w=!1,leftActions:I,rightActions:L,accessibilityLabel:k,accessibilityHint:v,style:z,containerStyle:V,titleStyle:A,subtitleStyle:F,descriptionStyle:B,leftSlotStyle:C,rightSlotStyle:H,testID:D}=e,P=useTheme(),T=useMemo(()=>sizeFor(P,j),[P,j]),R=useMemo(()=>buildStyles(P),[P]),{fontScale:E}=useWindowDimensions(),W=!!m&&("below"===h||"auto"===h&&E>1.2),O=g||!!x,M=O&&!S,{scale:G,pressIn:Z,pressOut:N}=usePressAnimation({enabled:M}),K=useFlickGuard(),U=k??("string"==typeof i?i:void 0),isText=e=>"string"==typeof e||"number"==typeof e,X=a??(void 0===c?null:_jsx(IconBadge,{icon:c,tone:d,size:BADGE_SIZE[j]})),q=g?_jsxs(View,{style:R.selectionLead,children:[_jsx(SelectionBox,{checked:u,disabled:S}),X?_jsx(View,{style:R.selectionLeadContent,children:X}):null]}):X,J=null!=b&&!1!==b&&!(Array.isArray(b)&&0===b.length),Q=_&&!J,Y=_jsxs(View,{style:[R.row,{paddingVertical:T.paddingVertical,minHeight:T.minHeight,backgroundColor:f?P.colors.surface.selected:"transparent"},Q?R.divider:null,S?R.disabled:null,V],children:[q?_jsx(View,{style:[R.leftSlot,C],children:q}):null,_jsxs(View,{style:R.middle,children:[null==i||isText(i)?_jsx(Text,{style:[R.title,{fontSize:T.titleSize,...fontFor(P,"medium"),color:S?P.colors.text.disabled:P.colors.text.primary},A],numberOfLines:l,children:i??" "}):i,null==n||""===n?null:isText(n)?_jsx(Text,{style:[R.subtitle,{fontSize:T.subtitleSize,color:S?P.colors.text.disabled:P.colors.text.secondary},F],numberOfLines:r,children:n}):n,o?_jsx(Text,{style:[R.description,{fontSize:T.subtitleSize,color:S?P.colors.text.disabled:P.colors.text.tertiary},B],numberOfLines:2,children:o}):null,W?_jsx(View,{style:[R.rightBelow,H],children:m}):null]}),m&&!W||w?_jsxs(View,{style:[R.rightSlot,W?null:H],children:[W?null:m,w?_jsx(View,{style:m&&!W?R.chevronWithRight:null,children:_jsx(Chevron,{color:S?P.colors.text.disabled:P.colors.text.tertiary})}):null]}):null]}),$=O?_jsx(Animated.View,{style:[{transform:[{scale:G}]},z],children:_jsx(Pressable,{ref:t,onPress:e=>{if(!M||K.isFlick(e))return;const t=resolveHaptic(y,"selection");t&&triggerHaptic(t),g?p?.(!u):x?.(e)},onPressIn:e=>{K.onPressIn(e),Z()},onPressOut:N,disabled:!M,accessibilityRole:g?"checkbox":"button",accessibilityLabel:U,accessibilityHint:v,accessibilityState:g?{checked:u,disabled:!M}:{selected:f,disabled:!M},"aria-disabled":!M,...g?{"aria-checked":u}:{"aria-selected":f},testID:D,android_ripple:{color:P.colors.surface.pressed,borderless:!1},style:({pressed:e})=>e?R.pressed:null,children:Y})}):_jsx(View,{ref:t,accessibilityRole:"none",accessibilityLabel:U,accessibilityHint:v,accessibilityState:{selected:f,disabled:S},"aria-selected":f,"aria-disabled":S,testID:D,style:z,children:Y}),ee=I&&I.length>0||L&&L.length>0,te=J?_jsxs(View,{style:[f?{backgroundColor:P.colors.surface.selected}:null,_?R.divider:null],children:[$,_jsx(View,{style:R.actions,children:renderActions(b)})]}):$,ie=ee?_jsx(Swipeable,{leftActions:I,rightActions:L,accessibilityLabel:U,children:te}):te;return s?_jsx(ListItemSkeleton,{...e}):ie});ListItem.displayName="ListItem";const ListItemSkeleton=({subtitle:e,description:t,left:i,icon:s,right:n,chevron:o,size:l="md",containerStyle:r,style:a})=>{const c=useTheme(),d=sizeFor(c,l),m=Math.round(1.15*d.titleSize),h=Math.round(1.15*d.subtitleSize);return _jsxs(View,{style:[{flexDirection:"row",alignItems:"center",paddingHorizontal:c.spacing.md,paddingVertical:d.paddingVertical,minHeight:d.minHeight},r,a],children:[void 0!==i||void 0!==s?_jsx(View,{style:{marginRight:c.spacing.sm},children:_jsx(Skeleton,{shape:"circle",width:40,height:40})}):null,_jsxs(View,{style:{flex:1},children:[_jsx(Skeleton,{shape:"text",width:"70%",height:m,style:{marginBottom:c.spacing.xs}}),void 0!==e?_jsx(Skeleton,{shape:"text",width:"50%",height:h,style:void 0!==t?{marginBottom:c.spacing.xs}:void 0}):null,void 0!==t?_jsx(Skeleton,{shape:"text",width:"85%",height:h}):null]}),void 0!==n||o?_jsx(View,{style:{marginLeft:c.spacing.sm},children:_jsx(Skeleton,{width:20,height:20,radius:"sm"})}):null]})};ListItemSkeleton.displayName="ListItemSkeleton",ListItem.Skeleton=ListItemSkeleton;const buildStyles=e=>StyleSheet.create({row:{flexDirection:"row",alignItems:"center",paddingHorizontal:e.spacing.md},divider:{borderBottomWidth:StyleSheet.hairlineWidth,borderBottomColor:e.colors.border.primary},pressed:{backgroundColor:e.colors.surface.pressed},disabled:{opacity:.55},leftSlot:{marginRight:e.spacing.md,alignItems:"center",justifyContent:"center"},middle:{flex:1,flexDirection:"column",justifyContent:"center"},selectionLead:{flexDirection:"row",alignItems:"center"},selectionLeadContent:{marginLeft:e.spacing.sm},rightBelow:{alignSelf:"flex-start",flexDirection:"row",alignItems:"center",marginTop:e.spacing.xs},rightSlot:{marginLeft:e.spacing.md,alignItems:"center",justifyContent:"center",flexDirection:"row"},actions:{flexDirection:"row",flexWrap:"wrap",gap:e.spacing.sm,paddingHorizontal:e.spacing.md,paddingBottom:e.spacing.md},chevronWithRight:{marginLeft:e.spacing.xs},title:{letterSpacing:e.typography.letterSpacing.normal},subtitle:{marginTop:2,...fontFor(e,"normal")},description:{marginTop:2,...fontFor(e,"normal")}});export{ListItem};export default ListItem;
+"use strict";import React,{forwardRef,useMemo}from"react";import{Animated,Pressable,StyleSheet,Text,useWindowDimensions,View}from"react-native";import Svg,{Path}from"react-native-svg";import{useFlickGuard}from"../../hooks/useFlickGuard.js";import{usePressAnimation}from"../../hooks/usePressAnimation.js";import{fontFor,useTheme}from"../../theme/index.js";import{smoothCorners}from"../../utils/corners.js";import{resolveHaptic,triggerHaptic}from"../../utils/hapticUtils.js";import{mergeRefs}from"../../utils/mergeRefs.js";import{defaultIcons}from"../AppIcon/defaultIcons.js";import{Button}from"../Button/index.js";import{IconBadge}from"../IconBadge/index.js";import{useContextMenu}from"../Menu/useContextMenu.js";import{Skeleton}from"../Skeleton/index.js";import{Swipeable}from"../Swipeable/index.js";import{Fragment as _Fragment,jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const SIZE_FALLBACK={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}},sizeFor=(e,t)=>{const i={...SIZE_FALLBACK[t],...e.components.listItem?.[t]??{}};return{paddingVertical:e.spacing[i.paddingVertical],titleSize:e.typography.fontSize[i.titleFontSize],subtitleSize:e.typography.fontSize[i.subtitleFontSize],minHeight:i.minHeight}},Chevron=({color:e})=>{const t=useTheme();return _jsx(_Fragment,{children:(t.icons?.chevronRight??defaultIcons.chevronRight)({size:20,color:e})})},BADGE_SIZE={sm:"sm",md:"md",lg:"lg"},RIGHT_BELOW_FONT_SCALE=1.2,DEFAULT_BOX_SIZE=20,SelectionBox=({checked:e,disabled:t})=>{const i=useTheme(),s=i.components.checkbox?.md?.boxSize??20,o=Math.round(.72*s);return _jsx(View,{accessibilityElementsHidden:!0,importantForAccessibility:"no-hide-descendants",pointerEvents:"none",style:{width:s,height:s,alignItems:"center",justifyContent:"center",borderWidth:i.colors.border.width,borderRadius:i.radius.xs,...smoothCorners,borderColor:e?i.colors.primary:i.colors.border.primary,backgroundColor:e?i.colors.primary:t?i.colors.surface.disabled:"transparent"},children:e?_jsx(Svg,{width:o,height:o,viewBox:"0 0 24 24",children:_jsx(Path,{d:"M5 12.5l4.5 4.5L19 7.5",stroke:i.colors.onPrimary,strokeWidth:3,strokeLinecap:"round",strokeLinejoin:"round",fill:"none"})}):null})},isActionList=e=>Array.isArray(e)&&e.length>0&&e.every(e=>null!=e&&"object"==typeof e&&!React.isValidElement(e)&&"label"in e),renderActions=e=>isActionList(e)?e.map(e=>_jsx(Button,{size:"sm",variant:e.variant??"outline",tone:e.tone,leftIcon:e.icon,disabled:e.disabled,testID:e.testID,title:e.label,onPress:e.onPress},e.label)):e,ListItem=forwardRef((e,t)=>{const{title:i,loading:s=!1,subtitle:o,description:n,titleLines:r=1,subtitleLines:l=1,left:a,icon:c,iconTone:d="primary",right:m,rightPlacement:h="auto",selectable:u=!1,checked:g=!1,onCheckedChange:p,actions:x,onPress:b,haptic:f,selected:y=!1,disabled:S=!1,size:j="md",divider:_=!1,chevron:w=!1,leftActions:I,rightActions:L,contextMenu:v,accessibilityLabel:k,accessibilityHint:z,style:V,containerStyle:F,titleStyle:A,subtitleStyle:C,descriptionStyle:B,leftSlotStyle:H,rightSlotStyle:R,testID:D}=e,P=useTheme(),T=useMemo(()=>sizeFor(P,j),[P,j]),E=useMemo(()=>buildStyles(P),[P]),{fontScale:M}=useWindowDimensions(),W=!!m&&("below"===h||"auto"===h&&M>1.2),O=useContextMenu(S?void 0:v,{haptic:f,testID:D}),G=useMemo(()=>mergeRefs(t,O.hostRef),[t,O.hostRef]),Z=u||!!b,N=Z||O.enabled,K=N&&!S,{scale:U,pressIn:X,pressOut:q}=usePressAnimation({enabled:K}),J=useFlickGuard(),Q=k??("string"==typeof i?i:void 0),isText=e=>"string"==typeof e||"number"==typeof e,Y=a??(void 0===c?null:_jsx(IconBadge,{icon:c,tone:d,size:BADGE_SIZE[j]})),$=u?_jsxs(View,{style:E.selectionLead,children:[_jsx(SelectionBox,{checked:g,disabled:S}),Y?_jsx(View,{style:E.selectionLeadContent,children:Y}):null]}):Y,ee=null!=x&&!1!==x&&!(Array.isArray(x)&&0===x.length),te=_&&!ee,ie=_jsxs(View,{style:[E.row,{paddingVertical:T.paddingVertical,minHeight:T.minHeight,backgroundColor:y?P.colors.surface.selected:"transparent"},te?E.divider:null,S?E.disabled:null,F],children:[$?_jsx(View,{style:[E.leftSlot,H],children:$}):null,_jsxs(View,{style:E.middle,children:[null==i||isText(i)?_jsx(Text,{style:[E.title,{fontSize:T.titleSize,...fontFor(P,"medium"),color:S?P.colors.text.disabled:P.colors.text.primary},A],numberOfLines:r,children:i??" "}):i,null==o||""===o?null:isText(o)?_jsx(Text,{style:[E.subtitle,{fontSize:T.subtitleSize,color:S?P.colors.text.disabled:P.colors.text.secondary},C],numberOfLines:l,children:o}):o,n?_jsx(Text,{style:[E.description,{fontSize:T.subtitleSize,color:S?P.colors.text.disabled:P.colors.text.tertiary},B],numberOfLines:2,children:n}):null,W?_jsx(View,{style:[E.rightBelow,R],children:m}):null]}),m&&!W||w?_jsxs(View,{style:[E.rightSlot,W?null:R],children:[W?null:m,w?_jsx(View,{style:m&&!W?E.chevronWithRight:null,children:_jsx(Chevron,{color:S?P.colors.text.disabled:P.colors.text.tertiary})}):null]}):null]}),se=N?_jsx(Animated.View,{style:[{transform:[{scale:U}]},V],children:_jsx(Pressable,{ref:G,onPress:e=>{if(!K||!Z||J.isFlick(e))return;const t=resolveHaptic(f,"selection");t&&triggerHaptic(t),u?p?.(!g):b?.(e)},onPressIn:e=>{J.onPressIn(e),X()},onPressOut:q,disabled:!K,accessibilityRole:u?"checkbox":b?"button":void 0,accessibilityLabel:Q,accessibilityHint:z,accessibilityState:u?{checked:g,disabled:!K}:{selected:y,disabled:!K},"aria-disabled":!K,...u?{"aria-checked":g}:{"aria-selected":y},testID:D,android_ripple:{color:P.colors.surface.pressed,borderless:!1},style:({pressed:e})=>e?E.pressed:null,...O.hostProps,children:ie})}):_jsx(View,{ref:t,accessibilityRole:"none",accessibilityLabel:Q,accessibilityHint:z,accessibilityState:{selected:y,disabled:S},"aria-selected":y,"aria-disabled":S,testID:D,style:V,children:ie}),oe=I&&I.length>0||L&&L.length>0,ne=ee?_jsxs(View,{style:[y?{backgroundColor:P.colors.surface.selected}:null,_?E.divider:null],children:[se,_jsx(View,{style:E.actions,children:renderActions(x)})]}):se,re=oe?_jsx(Swipeable,{leftActions:I,rightActions:L,accessibilityLabel:Q,children:ne}):ne;return s?_jsx(ListItemSkeleton,{...e}):O.enabled?_jsxs(_Fragment,{children:[re,O.renderSurface(_jsx(View,{style:E.preview,children:ie}))]}):re});ListItem.displayName="ListItem";const ListItemSkeleton=({subtitle:e,description:t,left:i,icon:s,right:o,chevron:n,size:r="md",containerStyle:l,style:a})=>{const c=useTheme(),d=sizeFor(c,r),m=Math.round(1.15*d.titleSize),h=Math.round(1.15*d.subtitleSize);return _jsxs(View,{style:[{flexDirection:"row",alignItems:"center",paddingHorizontal:c.spacing.md,paddingVertical:d.paddingVertical,minHeight:d.minHeight},l,a],children:[void 0!==i||void 0!==s?_jsx(View,{style:{marginRight:c.spacing.sm},children:_jsx(Skeleton,{shape:"circle",width:40,height:40})}):null,_jsxs(View,{style:{flex:1},children:[_jsx(Skeleton,{shape:"text",width:"70%",height:m,style:{marginBottom:c.spacing.xs}}),void 0!==e?_jsx(Skeleton,{shape:"text",width:"50%",height:h,style:void 0!==t?{marginBottom:c.spacing.xs}:void 0}):null,void 0!==t?_jsx(Skeleton,{shape:"text",width:"85%",height:h}):null]}),void 0!==o||n?_jsx(View,{style:{marginLeft:c.spacing.sm},children:_jsx(Skeleton,{width:20,height:20,radius:"sm"})}):null]})};ListItemSkeleton.displayName="ListItemSkeleton",ListItem.Skeleton=ListItemSkeleton;const buildStyles=e=>StyleSheet.create({row:{flexDirection:"row",alignItems:"center",paddingHorizontal:e.spacing.md},divider:{borderBottomWidth:StyleSheet.hairlineWidth,borderBottomColor:e.colors.border.primary},pressed:{backgroundColor:e.colors.surface.pressed},disabled:{opacity:.55},leftSlot:{marginRight:e.spacing.md,alignItems:"center",justifyContent:"center"},middle:{flex:1,flexDirection:"column",justifyContent:"center"},selectionLead:{flexDirection:"row",alignItems:"center"},selectionLeadContent:{marginLeft:e.spacing.sm},rightBelow:{alignSelf:"flex-start",flexDirection:"row",alignItems:"center",marginTop:e.spacing.xs},rightSlot:{marginLeft:e.spacing.md,alignItems:"center",justifyContent:"center",flexDirection:"row"},actions:{flexDirection:"row",flexWrap:"wrap",gap:e.spacing.sm,paddingHorizontal:e.spacing.md,paddingBottom:e.spacing.md},chevronWithRight:{marginLeft:e.spacing.xs},preview:{flex:1,backgroundColor:e.colors.background.elevated,borderRadius:e.radius.md,...smoothCorners,overflow:"hidden"},title:{letterSpacing:e.typography.letterSpacing.normal},subtitle:{marginTop:2,...fontFor(e,"normal")},description:{marginTop:2,...fontFor(e,"normal")}});export{ListItem};export default ListItem;

package/lib/module/components/Menu/Menu.js

@@ -0,0 +1 @@
+"use strict";import React,{useCallback,useEffect,useMemo,useRef,useState}from"react";import{View}from"react-native";import{useControllableState}from"../../hooks/useControllableState.js";import{mergeRefs}from"../../utils/mergeRefs.js";import{MenuSurface}from"./MenuSurface.js";import{jsx as _jsx,Fragment as _Fragment,jsxs as _jsxs}from"react/jsx-runtime";const Menu=e=>{const{items:t,trigger:s,title:a,topActions:l,placement:r="bottom",presentation:n="auto",unavailable:o="disable",open:u,onOpenChange:c,haptic:i,accessibilityLabel:m,closeLabel:f="Close menu",backLabel:p="Back",testID:b}=e,[x,g]=useControllableState({value:u,defaultValue:!1,onChange:c}),[h,j]=useState(null),[C,d]=useState(x),S=useRef(null),M=useRef(null);useEffect(()=>{x?(d(!0),S.current?.measureInWindow((e,t,s,a)=>{j({x:e,y:t,width:s,height:a})})):j(null)},[x]);const R=useCallback(()=>g(!1),[g]),k=useCallback(()=>M.current??S.current,[]),_=s.props,L=_.ref,v={ref:useMemo(()=>mergeRefs(L,M),[L]),"aria-expanded":x,onPress:e=>{_.onPress?.(e),g(!0)}};return _jsxs(_Fragment,{children:[_jsx(View,{ref:S,collapsable:!1,testID:b,children:React.cloneElement(s,v)}),C?_jsx(MenuSurface,{open:x,anchor:h,items:t,title:a,topActions:l,placement:r,presentation:n,unavailable:o,onClose:R,restoreFocusTo:k,haptic:i,accessibilityLabel:m,closeLabel:f,backLabel:p,testID:b}):null]})};export{Menu};export default Menu;

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

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

package/lib/module/components/Menu/focusHost.js

@@ -0,0 +1 @@
+"use strict";import{AccessibilityInfo,Platform}from"react-native";export const FOCUS_DELAY_MS=150;const isHost=s=>null!=s&&"function"==typeof s.measureInWindow;export const focusHost=s=>{"web"!==Platform.OS?isHost(s)&&AccessibilityInfo.sendAccessibilityEvent(s,"focus"):s?.focus?.()};

package/lib/module/components/Menu/index.js

@@ -0,0 +1 @@
+"use strict";export{default,Menu}from"./Menu.js";

package/lib/module/components/Menu/menuModel.js

@@ -0,0 +1 @@
+"use strict";import{Logger}from"@webority/mobile-core";export const MAX_GROUPS=3;export const MAX_TOP_ACTIONS=3;export const SHEET_ITEM_THRESHOLD=7;export const ACTION_PREFIX="menu:";const isGrouped=e=>e.length>0&&Array.isArray(e[0]),isShown=(e,t)=>!(e.hidden||"hide"===t&&e.disabled),visibleItem=(e,t)=>{if(!isShown(e,t))return null;if(!e.submenu)return e;const o=e.submenu.filter(e=>isShown(e,t));return o.length>0?{...e,submenu:o}:null};export const visibleGroups=(e,t)=>{const o=isGrouped(e)?e:[e];__DEV__&&o.length>3&&Logger.warn(`[Menu] ${o.length} groups given; a menu keeps to 3.`);const n=[];for(const e of o){const o=[];for(const n of e){const e=visibleItem(n,t);e&&o.push(e)}o.length>0&&n.push(o)}return n};export const visibleTopActions=(e,t)=>{if(!e)return[];__DEV__&&e.length>3&&Logger.warn("[Menu] topActions takes at most 3; the rest are not shown.");return e.slice(0,3).filter(e=>isShown(e,t)&&!e.submenu)};export const wantsSheet=(e,t)=>{let o=t.length;for(const t of e)for(const e of t)if(o+=1,e.description)return!0;return o>7};export const menuActions=(e,t)=>{const o=[],add=(e,t)=>{if(e.disabled)return;if(e.submenu){for(const t of e.submenu)add(t,e);return}const n=e.accessibilityLabel??e.label;o.push({name:`menu:${t?`${t.key}/`:""}${e.key}`,label:t?`${t.label}, ${n}`:n,item:e})};for(const e of t)add(e);for(const t of e)for(const e of t)add(e);return o};

package/lib/module/components/Menu/useContextMenu.js

@@ -0,0 +1 @@
+"use strict";import{useCallback,useEffect,useMemo,useRef,useState}from"react";import{resolveHaptic,triggerHaptic}from"../../utils/hapticUtils.js";import{MenuSurface}from"./MenuSurface.js";import{menuActions,visibleGroups,visibleTopActions}from"./menuModel.js";import{webOnly}from"./webOnly.js";import{jsx as _jsx}from"react/jsx-runtime";export const useContextMenu=(e,t={})=>{const s=useRef(null),[n,i]=useState(!1),[o,c]=useState(!1),[a,r]=useState(null),l=e?.unavailable??"hide",u=e?.items,p=e?.topActions,m=useMemo(()=>u?visibleGroups(u,l):[],[u,l]),b=useMemo(()=>visibleTopActions(p,l),[p,l]),f=useMemo(()=>menuActions(m,b),[m,b]),v=m.length>0||b.length>0,h=useRef(e);h.current=e;const A=useRef(t);A.current=t;const g=useRef(f);g.current=f;const C=useCallback(e=>{e&&c(!0),i(e),h.current?.onOpenChange?.(e)},[]);useEffect(()=>{!v&&n&&C(!1)},[v,n,C]);const M=useCallback(()=>{s.current?.measureInWindow((e,t,s,n)=>{r({x:e,y:t,width:s,height:n}),C(!0)})},[C]),d=useCallback(()=>{const e=resolveHaptic(A.current.haptic,"longPress");e&&triggerHaptic(e),M()},[M]),k=useCallback(e=>{const t=g.current.find(t=>t.name===e.nativeEvent.actionName);if(!t)return void A.current.onAccessibilityAction?.(e);const s=resolveHaptic(A.current.haptic,"selection");s&&triggerHaptic(s),t.item.onPress?.()},[]),x=t.accessibilityActions,y=useMemo(()=>[...x??[],...f.map(e=>({name:e.name,label:e.label}))],[x,f]),j=useMemo(()=>v?{onLongPress:d,accessibilityActions:y,onAccessibilityAction:k,...webOnly({onContextMenu:e=>{e.preventDefault?.(),M()}})}:{},[v,d,y,k,M]),w=useCallback(()=>C(!1),[C]),S=useCallback(()=>s.current,[]);return{enabled:v,hostRef:s,hostProps:j,renderSurface:s=>e&&v&&o?_jsx(MenuSurface,{open:n,anchor:a,items:e.items,title:e.title,topActions:e.topActions,placement:e.placement??"bottom",presentation:e.presentation??"auto",unavailable:l,context:!0,preview:!1===e.preview?void 0:e.preview??s,onClose:w,restoreFocusTo:S,haptic:t.haptic,accessibilityLabel:e.accessibilityLabel,closeLabel:e.closeLabel??"Close menu",backLabel:e.backLabel??"Back",testID:t.testID?`${t.testID}-context`:void 0}):null}};

package/lib/module/components/Menu/webOnly.js

@@ -0,0 +1 @@
+"use strict";import{Platform}from"react-native";export const webOnly=t=>"web"===Platform.OS?t:null;

package/lib/module/components/MessageBubble/MessageBubble.js

@@ -0,0 +1 @@
+"use strict";import{formatTime}from"@webority/mobile-core";import{useCallback,useEffect,useMemo,useRef}from"react";import{Pressable,StyleSheet,View}from"react-native";import{useTheme}from"../../theme/index.js";import{announce}from"../../utils/announce.js";import{smoothCorners}from"../../utils/corners.js";import{resolveHaptic,triggerHaptic}from"../../utils/hapticUtils.js";import{AppIcon}from"../AppIcon/index.js";import{Button}from"../Button/index.js";import{Markdown}from"../Markdown/index.js";import{Text}from"../Text/index.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";export const DEFAULT_MESSAGE_BUBBLE_LABELS=Object.freeze({you:"You",sending:"Sending",sent:"Sent",delivered:"Delivered",read:"Read",failed:"Not sent",retry:"Try again",replyTo:e=>e?`Reply to ${e}`:"Reply"});const RUN_GAP=2,MAX_WIDTH="85%",STATUS_ICON=14,statusIcon=e=>{switch(e){case"sending":return"clock";case"sent":return"check";case"failed":return"alert-circle";default:return"check-check"}},statusColour=(e,t)=>{switch(t){case"read":return e.colors.toneText.info;case"failed":return e.colors.toneText.error;default:return e.colors.text.tertiary}};export const MessageBubble=({side:e,text:t,children:s,markdown:r=!1,groupPosition:o="single",author:n,time:i,status:a,replyTo:l,streaming:c=!1,error:d,onRetry:u,actions:m,onLongPress:p,footer:b,labels:x,haptic:f,style:y,testID:g})=>{const h=useTheme(),T=useMemo(()=>buildStyles(h),[h]),j=x?{...DEFAULT_MESSAGE_BUBBLE_LABELS,...x}:DEFAULT_MESSAGE_BUBBLE_LABELS,_="mine"===e,L="single"===o||"first"===o,S="single"===o||"last"===o,B=null==i?"":formatTime(i),A=("failed"===a||Boolean(d))&&Boolean(u),E=_?j.you:n??"",v=useMemo(()=>{const e=m?[...m]:[];return l?.onPress&&e.push({name:"openReply",label:j.replyTo(l.author),onPress:l.onPress}),A&&u&&e.push({name:"retry",label:j.retry,onPress:u}),e},[m,l,A,u,j]),P=!s||(m?.length??0)>0,I=a&&_?j[a]:"",M=[E,B,t,l?`${j.replyTo(l.author)}: ${l.text}`:"",I].filter(Boolean).join(", "),R=useRef(c);useEffect(()=>{R.current&&!c&&!d&&t&&announce(E?`${E}, ${t}`:t),R.current=c},[c,d,t,E]);const k=useRef(d);useEffect(()=>{d&&d!==k.current&&announce(d,{polite:!1}),k.current=d},[d]);const w=useCallback(()=>{const e=resolveHaptic(f,"longPress");e&&triggerHaptic(e),p?.()},[f,p]),C=useCallback(e=>{v.find(t=>t.name===e.nativeEvent.actionName)?.onPress()},[v]),D=h.radius.xl,$=h.radius.xs,H=_?{borderTopRightRadius:L?D:$,borderBottomRightRadius:S?D:$}:{borderTopLeftRadius:L?D:$,borderBottomLeftRadius:S?D:$},U=s??(r?_jsx(Markdown,{children:t}):_jsx(Text,{variant:"body",children:t})),z=l?_jsxs(Pressable,{onPress:l.onPress,disabled:!l.onPress,accessibilityRole:l.onPress?"button":void 0,accessibilityLabel:`${j.replyTo(l.author)}: ${l.text}`,style:T.quote,children:[l.author?_jsx(Text,{variant:"caption",weight:"semibold",color:"link",numberOfLines:1,children:l.author}):null,_jsx(Text,{variant:"bodySmall",color:"secondary",numberOfLines:2,children:l.text})]}):null,V=[T.bubble,_?T.mine:T.theirs,H],F=P?{accessible:!0,accessibilityLabel:M,accessibilityState:{busy:c},"aria-busy":c,accessibilityActions:v.map(({name:e,label:t})=>({name:e,label:t})),onAccessibilityAction:C}:{accessible:!1},O=(m?.length??0)>0?_jsxs(Pressable,{onLongPress:w,delayLongPress:350,style:V,testID:g?`${g}-bubble`:void 0,...F,children:[z,U]}):_jsxs(View,{style:V,testID:g?`${g}-bubble`:void 0,...F,children:[z,U]}),G=S&&(""!==B||_&&a);return _jsxs(View,{style:[T.root,_?T.rootMine:T.rootTheirs,{marginTop:L?h.spacing.sm:2},y],testID:g,children:[!_&&L&&n?_jsx(Text,{variant:"caption",color:"secondary",style:T.author,numberOfLines:1,importantForAccessibility:P?"no-hide-descendants":"auto",accessibilityElementsHidden:P,children:n}):null,O,G?_jsxs(View,{style:[T.meta,_?T.metaMine:null],importantForAccessibility:P?"no-hide-descendants":"auto",accessibilityElementsHidden:P,children:[B?_jsx(Text,{variant:"caption",color:"tertiary",children:B}):null,_&&a?_jsx(AppIcon,{name:statusIcon(a),size:14,color:statusColour(h,a),accessibilityLabel:j[a],testID:g?`${g}-status-${a}`:void 0}):null]}):null,d?_jsx(Text,{variant:"bodySmall",color:"error",style:_?T.endText:null,children:d}):null,A?_jsx(Button,{title:j.retry,variant:"link",size:"sm",leftIcon:"refresh-cw",onPress:u,testID:g?`${g}-retry`:void 0}):null,b]})};const buildStyles=e=>StyleSheet.create({root:{maxWidth:"85%",gap:e.spacing.xs},rootMine:{alignSelf:"flex-end",alignItems:"flex-end"},rootTheirs:{alignSelf:"flex-start",alignItems:"flex-start"},author:{paddingHorizontal:e.spacing.md},bubble:{borderRadius:e.radius.xl,...smoothCorners,paddingHorizontal:e.spacing.md,paddingVertical:e.spacing.sm,gap:e.spacing.xs},mine:{backgroundColor:e.colors.primaryMuted},theirs:{backgroundColor:e.colors.background.secondary},quote:{borderLeftWidth:3,borderLeftColor:e.colors.primary,paddingLeft:e.spacing.sm,paddingVertical:e.spacing.xs},meta:{flexDirection:"row",alignItems:"center",gap:e.spacing.xs,paddingHorizontal:e.spacing.xs},metaMine:{justifyContent:"flex-end"},endText:{textAlign:"right"}});export default MessageBubble;

package/lib/module/components/MessageBubble/index.js

@@ -0,0 +1 @@
+"use strict";export{DEFAULT_MESSAGE_BUBBLE_LABELS,default,MessageBubble}from"./MessageBubble.js";

package/lib/module/components/MessageList/MessageList.js

@@ -0,0 +1 @@
+"use strict";import{formatDate}from"@webority/mobile-core";import{useCallback,useEffect,useMemo,useRef,useState}from"react";import{FlatList,StyleSheet,View}from"react-native";import{KeyboardChatScrollView}from"react-native-keyboard-controller";import{useSafeAreaInsets}from"react-native-safe-area-context";import{useReducedMotion}from"../../hooks/useReducedMotion.js";import{useTheme}from"../../theme/index.js";import{announce}from"../../utils/announce.js";import{smoothCorners}from"../../utils/corners.js";import{Badge}from"../Badge/index.js";import{DateSeparator,dayLabel}from"../DateSeparator/index.js";import{IconButton}from"../IconButton/index.js";import{Spinner}from"../Spinner/index.js";import{jsx as _jsx,Fragment as _Fragment,jsxs as _jsxs}from"react/jsx-runtime";export const DEFAULT_MESSAGE_LIST_LABELS=Object.freeze({today:"Today",yesterday:"Yesterday",jumpToLatest:"Jump to the latest message",newMessages:e=>1===e?"1 new message":`${e} new messages`,unread:"New messages",loadingOlder:"Loading earlier messages"});const JUMP_AT=160,KEEP_POSITION={minIndexForVisible:0,autoscrollToTopThreshold:160},positionOf=(e,t)=>e?t?"middle":"last":t?"first":"single";export function MessageList({messages:e,keyExtractor:t,renderMessage:o,getAuthorKey:n,getDate:s,firstUnreadKey:r,onLoadOlder:a,loadingOlder:l=!1,hasOlder:i=!0,typing:d,empty:u,getAnnouncement:c,followNew:m,keyboardAware:p=!0,keyboardOffset:f,labels:g,now:y,onScroll:x,contentContainerStyle:b,style:j,testID:S,...h}){const _=useTheme(),w=useSafeAreaInsets(),L=useReducedMotion(),E=useMemo(()=>buildStyles(_),[_]),C=useMemo(()=>({...DEFAULT_MESSAGE_LIST_LABELS,...g}),[g]),v=f??w.bottom,I=useRef(null),T=useRef(!1),[k,M]=useState(!1),[O,D]=useState(0),A=useMemo(()=>{const o=s?e.map(e=>formatDate(s(e))):null,a=n?e.map(n):null,l=void 0===r?-1:e.findIndex(e=>t(e)===r);return e.map((t,n)=>{const r=n===e.length-1,i=null!==o&&(r||o[n]!==o[n+1]),d=null!==a&&!r&&a[n+1]===a[n]&&!i&&n!==l,u=null!==a&&n>0&&a[n-1]===a[n]&&(null===o||o[n-1]===o[n])&&n-1!==l;return{groupPosition:positionOf(d,u),day:i&&s?dayLabel(s(t),{now:y,labels:C}):null,unread:n===l}})},[e,s,n,r,t,y,C]),V=useCallback(()=>{I.current?.scrollToOffset({offset:0,animated:!L}),D(0)},[L]),F=e.length>0?t(e[0]):null,P=useRef(F);useEffect(()=>{const o=P.current;if(P.current=F,null===o||null===F||o===F)return;const n=e.findIndex(e=>t(e)===o);if(-1===n)return void D(0);const s=e.slice(0,n).reverse();for(const e of s){const t=c?.(e);t&&announce(t)}m&&s.some(m)?V():T.current&&D(e=>e+s.length)},[F]);const R=useCallback(e=>{const t=e.nativeEvent.contentOffset.y>160;t!==T.current&&(T.current=t,M(t),t||D(0)),x?.(e)},[x]),B=useCallback(()=>{i&&!l&&a?.()},[i,l,a]),K=useCallback(({item:e,index:t})=>{const n=A[t];return _jsxs(_Fragment,{children:[n?.day?_jsx(DateSeparator,{label:n.day}):null,n?.unread?_jsx(DateSeparator,{label:C.unread,emphasis:!0}):null,o({item:e,index:t,groupPosition:n?.groupPosition??"single"})]})},[A,C.unread,o]),z=useCallback(e=>t(e),[t]),N=useCallback(e=>_jsx(KeyboardChatScrollView,{...e,inverted:!0,offset:v}),[v]),U=O>0?`${C.newMessages(O)}. ${C.jumpToLatest}`:C.jumpToLatest;return _jsxs(View,{style:[E.root,j],children:[_jsx(FlatList,{keyboardShouldPersistTaps:"handled",maintainVisibleContentPosition:KEEP_POSITION,...h,ref:I,data:e,renderItem:K,keyExtractor:z,inverted:!0,onScroll:R,onEndReached:a?B:void 0,ListHeaderComponent:d?_jsx(_Fragment,{children:d}):null,ListFooterComponent:l?_jsx(Spinner,{size:"sm",accessibilityLabel:C.loadingOlder,style:E.older}):null,ListEmptyComponent:u?_jsx(View,{style:E.fill,children:u}):null,renderScrollComponent:p?N:void 0,contentContainerStyle:[E.content,0===e.length?E.grow:null,b],testID:S}),k?_jsxs(View,{style:E.jump,pointerEvents:"box-none",children:[_jsx(View,{style:E.jumpDisc,children:_jsx(IconButton,{icon:"arrow-down",accessibilityLabel:U,variant:"ghost",tone:"neutral",onPress:V,testID:S?`${S}-jump`:void 0})}),O>0?_jsx(View,{style:E.count,pointerEvents:"none",importantForAccessibility:"no-hide-descendants",accessibilityElementsHidden:!0,children:_jsx(Badge,{value:O,max:99,tone:"primary",size:"sm"})}):null]}):null]})}const buildStyles=e=>StyleSheet.create({root:{flex:1},content:{paddingHorizontal:e.spacing.md,paddingVertical:e.spacing.sm},grow:{flexGrow:1},fill:{flex:1},older:{paddingVertical:e.spacing.md},jump:{position:"absolute",right:e.spacing.md,bottom:e.spacing.md},jumpDisc:{borderRadius:e.radius.full,...smoothCorners,backgroundColor:e.colors.background.elevated,...e.shadows.md},count:{position:"absolute",top:-e.spacing.xs,right:-e.spacing.xs}});export default MessageList;

package/lib/module/components/MessageList/index.js

@@ -0,0 +1 @@
+"use strict";export{DEFAULT_MESSAGE_LIST_LABELS,default,MessageList}from"./MessageList.js";

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

@@ -1 +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(.4*s)}]},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;
+"use strict";import{createContext,Fragment,useContext,useMemo}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);export const useNotationInk=(t,e,o)=>{const n=StyleSheet.flatten(t),s=n?.fontSize??e,r=n?.color??o;return useMemo(()=>({fontSize:s,color:r}),[s,r])};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(.4*s)}]},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/OnboardingPager/OnboardingPager.js

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

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

@@ -0,0 +1 @@
+"use strict";export{default,OnboardingPager}from"./OnboardingPager.js";

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

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

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

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

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

@@ -0,0 +1 @@
+"use strict";export{default,PaymentResult}from"./PaymentResult.js";

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

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

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

@@ -0,0 +1 @@
+"use strict";export{default,PermissionPrompt}from"./PermissionPrompt.js";export{usePermissionPrompt}from"./usePermissionPrompt.js";

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

@@ -0,0 +1 @@
+"use strict";import{Logger}from"@webority/mobile-core";import{Permissions}from"@webority/mobile-core/permissions";import{useCallback,useEffect,useRef,useState}from"react";import{AppState,Platform}from"react-native";const INITIAL={view:"pending",status:null,requesting:!1,answered:!1},isAuthorized=e=>"granted"===e||"limited"===e,canAsk=e=>"undetermined"===e||"denied"===e,settledView=e=>isAuthorized(e)?"authorized":"unavailable",safely=async(e,t,r)=>{try{return await r()}catch(r){return Logger.error(`[@webority/mobile-ui] PermissionPrompt: ${e}(${t}) failed.`,r),"unavailable"}};export const usePermissionPrompt=(e,{onResult:t}={})=>{const[r,s]=useState(INITIAL),n=useRef(r);n.current=r;const i=useRef(t);i.current=t;const u=useRef(0),a=useRef(!1),c="android"===Platform.OS,o=useCallback(async t=>{if(a.current)return null;a.current=!0,s(e=>({...e,requesting:!0}));const r=await safely("request",e,()=>Permissions.request(e));return a.current=!1,t!==u.current||(s({view:settledView(r),status:r,requesting:!1,answered:!0}),i.current?.(r)),r},[e]);useEffect(()=>{u.current+=1;const t=u.current;s(INITIAL);return(async()=>{const r=await safely("check",e,()=>Permissions.check(e));if(t===u.current){if(c&&"undetermined"===r){s({...INITIAL,status:r});return void(null===await o(t)&&t===u.current&&s({...INITIAL,view:"explain",status:r}))}canAsk(r)?s({...INITIAL,view:"explain",status:r}):(s({...INITIAL,view:settledView(r),status:r}),i.current?.(r))}})(),()=>{u.current+=1}},[e,c,o]);const l="unavailable"===r.view&&"blocked"===r.status&&!r.answered;useEffect(()=>{if(!l)return;const t=u.current,r=AppState.addEventListener("change",r=>{"active"===r&&safely("check",e,()=>Permissions.check(e)).then(e=>{t===u.current&&(isAuthorized(e)?(s({view:"authorized",status:e,requesting:!1,answered:!0}),i.current?.(e)):canAsk(e)&&s({...INITIAL,view:"explain",status:e}))})});return()=>r.remove()},[l,e]);const d=useCallback(()=>o(u.current),[o]),w=useCallback(()=>{const e=n.current;"explain"!==e.view||null===e.status||e.requesting||(s({...e,view:"unavailable",answered:!0}),i.current?.(e.status))},[]);return{view:r.view,status:r.status,requesting:r.requesting,cancellable:c,showSettings:l,request:d,cancel:w,openSettings:Permissions.openSettings}};