@webority/mobile-ui 0.88.1 → 0.90.0

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

@@ -1 +1 @@
-"use strict";import{Logger}from"@webority/mobile-core";import React,{forwardRef,useCallback,useEffect,useMemo,useRef,useState}from"react";import{AccessibilityInfo,Animated,BackHandler,Easing,Platform,Pressable,StyleSheet,Text,View}from"react-native";import Reanimated,{cancelAnimation,Easing as ReanimatedEasing,useAnimatedStyle,useSharedValue,withTiming}from"react-native-reanimated";import{useSafeAreaInsets}from"react-native-safe-area-context";import{usePresenceMotion}from"../../hooks/usePresenceMotion.js";import{usePressAnimation}from"../../hooks/usePressAnimation.js";import{createAnimatedValue,resolveFloatingActionButtonSize,setNativeValue,spaceOf,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,jsxs as _jsxs,Fragment as _Fragment}from"react/jsx-runtime";const 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:n,onPress:o,label:s,collapsed:i=!1,size:r="md",tone:a="primary",position:l,bottomOffset:c,disabled:u=!1,hideOnScroll:d=!1,isScrolling:m=!1,accessibilityLabel:g,accessibilityHint:f,haptic:p,style:b,containerStyle:h,labelStyle:y,testID:w}=e,A=useTheme(),x=useSafeAreaInsets(),S=useMemo(()=>resolveFloatingActionButtonSize(A,r),[A,r]),v=useMemo(()=>buildStyles(A),[A]),{scale:R,opacity:_,pressIn:E,pressOut:C}=usePressAnimation({enabled:!u}),j=usePresenceMotion(),P=A.components.floatingActionButton,I=spaceOf(A,P.edgeOffset,"components.floatingActionButton.edgeOffset"),k=spaceOf(A,P.bottomOffset,"components.floatingActionButton.bottomOffset"),F=useRef(createAnimatedValue(1)).current,O=j.duration("normal");useEffect(()=>{if(!d)return void setNativeValue(F,1);const e=Animated.timing(F,{toValue:m?0:1,duration:O,easing:Easing.bezier(...A.motion.easing.standard),useNativeDriver:!0});return e.start(),()=>e.stop()},[d,m,F,O,A.motion.easing.standard]);const V=S.diameter+(c??k)+x.bottom+I,B=F.interpolate({inputRange:[0,1],outputRange:j.range(V,0)}),T=useMemo(()=>Animated.multiply(F,_),[F,_]),D=n,L="string"==typeof s&&s.length>0,M=L&&i,N=j.reduced,z=A.spacing.sm,H=S.labelPaddingX,$=A.motion.duration.fast,G=A.motion.easing.standard,W=useSharedValue(M?1:0),[U,Y]=useState(null);useEffect(()=>{const e=M?1:0;return W.value=N?e:withTiming(e,{duration:$,easing:ReanimatedEasing.bezier(...G)}),()=>cancelAnimation(W)},[M,N,W,$,G]);const X=useCallback(e=>{const t=Math.ceil(e);Y(e=>e===t?e:t)},[]),Q=useAnimatedStyle(()=>({paddingHorizontal:H*(1-W.value)})),q=useAnimatedStyle(()=>{const e=Math.max(0,1-2*W.value);return null===U?W.value>=1?{opacity:e,width:0}:{opacity:e}:{opacity:e,width:(U+z)*(1-W.value)}}),J=u?A.colors.surface.disabled:toneBackground(A,a),K=u?A.colors.text.disabled:toneForeground(A,a),Z=useMemo(()=>{if(!l)return null;const e=(c??k)+x.bottom;switch(l){case"bottomLeft":return{position:"absolute",bottom:e,left:I};case"bottomCenter":return{position:"absolute",bottom:e,alignSelf:"center"};default:return{position:"absolute",bottom:e,right:I}}},[l,c,x.bottom,k,I]);return _jsx(Animated.View,{style:[Z,{transform:[{translateY:B},{scale:R}],opacity:T},h,b],pointerEvents:d&&m?"none":"auto",children:_jsx(Pressable,{ref:t,onPress:e=>{if(u)return;const t=resolveHaptic(p,"impactLight");t&&triggerHaptic(t),o()},onPressIn:E,onPressOut:C,disabled:u,accessibilityRole:"button",accessibilityLabel:g,accessibilityHint:f,accessibilityState:{disabled:u},"aria-disabled":u,testID:w,style:[v.base,L?{height:S.diameter,minWidth:S.diameter,borderRadius:S.diameter/2,...smoothCorners}:{width:S.diameter,height:S.diameter,borderRadius:S.diameter/2,...smoothCorners},A.shadows.lg,{backgroundColor:J,opacity:u?.55:1}],children:({pressed:e})=>_jsxs(_Fragment,{children:[e&&!u?_jsx(View,{pointerEvents:"none",testID:"fab-pressed",style:[v.pressedTint,{backgroundColor:pressedTintFor(A,a),borderRadius:S.diameter/2,...smoothCorners}]}):null,L?_jsxs(Reanimated.View,{style:[v.extendedRow,Q],children:[D,_jsx(Reanimated.View,{style:[v.labelClip,q],children:_jsx(Text,{onLayout:e=>X(e.nativeEvent.layout.width),style:[v.label,{color:K,fontSize:S.text,fontWeight:A.typography.fontWeight.semibold,marginLeft:z},y],numberOfLines:1,children:s})})]}):D]})})})});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},extendedRow:{flexDirection:"row",alignItems:"center"},labelClip:{flexDirection:"row",overflow:"hidden"},label:{includeFontPadding:!1,flexShrink:0}}),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:n,actions:o,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:f,secondaryActionStyle:p,labelPillStyle:b,labelStyle:h,testID:y}=e,w=useTheme(),A=useSafeAreaInsets(),x=useMemo(()=>resolveFloatingActionButtonSize(w,c),[w,c]),S=useMemo(()=>buildGroupStyles(w),[w]),v=usePresenceMotion(),R=v.duration("normal"),_=w.components.floatingActionButton,E=spaceOf(w,_.edgeOffset,"components.floatingActionButton.edgeOffset"),C=spaceOf(w,_.bottomOffset,"components.floatingActionButton.bottomOffset"),j=spaceOf(w,_.secondaryGap,"components.floatingActionButton.secondaryGap"),P=_.staggerMs,I=useMemo(()=>o.slice(0,6),[o]),k=I.length,F=useMemo(()=>I.map((e,t)=>({action:e,index:t})).reverse(),[I]),O=__DEV__?describeActionProblem(o):"";useEffect(()=>{__DEV__&&O&&Logger.warn(`[@webority/mobile-ui] FloatingActionButtonGroup ${O}`)},[O]);const V="boolean"==typeof s,[B,T]=useState(i),D=V?s:B,L=useRef(createAnimatedValue(1)).current;useEffect(()=>{if(!m)return void setNativeValue(L,1);const e=Animated.timing(L,{toValue:g?0:1,duration:R,easing:Easing.bezier(...w.motion.easing.standard),useNativeDriver:!0});return e.start(),()=>e.stop()},[m,g,L,R,w.motion.easing.standard]);const M=m&&g;useEffect(()=>{M&&D&&(V||T(!1),r?.(!1))},[M,D,V,r]);const N=x.diameter+(l??C)+A.bottom+E,z=L.interpolate({inputRange:[0,1],outputRange:v.range(N,0)}),H=L,$=useRef(createAnimatedValue(D?1:0)).current,G=useRef([]),[W,U]=useState(0);useEffect(()=>{const e=G.current;if(e.length!==k){if(e.length<k){const t=e.slice();for(let n=e.length;n<k;n+=1)t.push(new Animated.Value(D?1:0));G.current=t}else G.current=e.slice(0,k);U(e=>e+1)}},[k]),useEffect(()=>{const e=Animated.timing($,{toValue:D?1:0,duration:R,easing:Easing.bezier(...w.motion.easing.standard),useNativeDriver:!0});e.start();const t=G.current.map(e=>Animated.timing(e,{toValue:D?1:0,duration:R,easing:Easing.bezier(...w.motion.easing.standard),useNativeDriver:!0})),n=D?t:[...t].reverse(),o=Animated.stagger(P,n);return o.start(),()=>{e.stop(),o.stop()}},[D,$,R,w.motion.easing.standard,k,W,P]);const Y=useCallback(e=>{const t=resolveHaptic(d,"impactLight");t&&triggerHaptic(t),V||T(e),r?.(e)},[V,r,d]),X=useRef(null),Q=useRef(D),q=useRef(!1);useEffect(()=>{if(Q.current===D)return;Q.current=D;const e=q.current;if(q.current=!1,M||e)return;const t=X.current;t&&("web"===Platform.OS?t.focus?.():AccessibilityInfo.sendAccessibilityEvent(t,"focus"));announce(D?`${u}, expanded, ${k} ${1===k?"action":"actions"}`:`${u}, collapsed`)},[D,M,u,k]);const J=useCallback(()=>{Y(!D)},[D,Y]),K=useCallback(e=>{!1!==d&&triggerHaptic("selection"),q.current=!0,e.onPress(),V||T(!1),r?.(!1)},[V,r,d]),Z=useCallback(()=>{D&&Y(!1)},[D,Y]);useEffect(()=>{if(!D)return;const e=BackHandler.addEventListener("hardwareBackPress",()=>(Y(!1),!0));return()=>e.remove()},[D,Y]),useEffect(()=>{if(!D||"web"!==Platform.OS)return;const onKeyDown=e=>{"Escape"===e.key&&Y(!1)};return window.addEventListener("keydown",onKeyDown),()=>window.removeEventListener("keydown",onKeyDown)},[D,Y]);const ee=useMemo(()=>{const e=(l??C)+A.bottom;switch(a){case"bottomLeft":return{position:"absolute",bottom:e,left:E,alignItems:"flex-start"};case"bottomCenter":return{position:"absolute",bottom:e,alignSelf:"center",alignItems:"center"};default:return{position:"absolute",bottom:e,right:E,alignItems:"flex-end"}}},[a,l,A.bottom,C,E]),slotOffset=e=>-(x.diameter+j)*(e+1),te=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]),ne=.78*x.diameter,oe=useMemo(()=>{const e=ne+w.spacing.sm;switch(a){case"bottomLeft":return{left:e,alignItems:"flex-start"};case"bottomCenter":return{right:x.diameter/2+ne/2+w.spacing.sm,alignItems:"flex-end"};default:return{right:e,alignItems:"flex-end"}}},[a,ne,x.diameter,w.spacing.sm]),se=$.interpolate({inputRange:[0,1],outputRange:[0,.4]}),ie=$.interpolate(v.reduced?{inputRange:[0,.5,.5001,1],outputRange:["0deg","0deg","45deg","45deg"]}:{inputRange:[0,1],outputRange:["0deg","45deg"]});return _jsxs(_Fragment,{children:[D?_jsx(Animated.View,{pointerEvents:D?"auto":"none",style:[StyleSheet.absoluteFill,{backgroundColor:w.colors.background.overlay,opacity:se}],children:_jsx(Pressable,{style:StyleSheet.absoluteFill,onPress:Z,accessibilityElementsHidden:!0,importantForAccessibility:"no",testID:y?`${y}-backdrop`:void 0})}):null,_jsxs(Animated.View,{pointerEvents:M?"none":"box-none",style:[ee,{transform:[{translateY:z}],opacity:H},f],accessibilityRole:"menu",testID:y,children:[F.map(({action:e,index:t})=>{const n=G.current[t];if(!n)return null;const o=n.interpolate({inputRange:[0,1],outputRange:v.range(0,slotOffset(t))}),s=n.interpolate({inputRange:[0,1],outputRange:v.range(.6,1)}),i=toneBackground(w,e.tone??"primary"),r=toneForeground(w,e.tone??"primary"),a=e.label?_jsx(View,{pointerEvents:"none",style:[S.labelSlot,oe],testID:y?`${y}-label-${e.key}`:void 0,children:_jsx(View,{style:[S.labelPill,w.shadows.sm,{backgroundColor:w.colors.background.elevated,paddingHorizontal:w.spacing.sm,paddingVertical:w.spacing.xs,borderRadius:w.radius.sm,...smoothCorners},b],children:_jsx(Text,{style:[{color:w.colors.text.primary,fontSize:w.typography.fontSize.sm,fontWeight:w.typography.fontWeight.medium},h],numberOfLines:1,children:e.label})})}):null;return _jsxs(Animated.View,{pointerEvents:D?"auto":"none",accessibilityElementsHidden:!D,importantForAccessibility:D?"auto":"no-hide-descendants","aria-hidden":!D,style:[S.secondaryRow,te,{position:"absolute",bottom:0,opacity:n,transform:[{translateY:o},{scale:s}]}],children:[_jsx(Pressable,{onPress:()=>K(e),focusable:D,accessibilityRole:"menuitem",accessibilityLabel:e.accessibilityLabel,style:[S.fabBase,w.shadows.md,{width:ne,height:ne,borderRadius:ne/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:[S.pressedTint,{backgroundColor:pressedTintFor(w,e.tone??"primary"),borderRadius:ne/2,...smoothCorners}]}):null,React.isValidElement(e.icon)?e.icon:_jsx(Text,{style:{color:r},children:String(e.icon??"")})]})}),a]},e.key)}),_jsx(Pressable,{ref:X,onPress:J,accessibilityRole:"button",accessibilityLabel:u,accessibilityState:{expanded:D},"aria-expanded":D,style:[S.fabBase,w.shadows.lg,{width:x.diameter,height:x.diameter,borderRadius:x.diameter/2,...smoothCorners,backgroundColor:w.colors.primary}],testID:y?`${y}-primary`:void 0,children:({pressed:e})=>_jsxs(_Fragment,{children:[e?_jsx(View,{pointerEvents:"none",testID:"fab-pressed",style:[S.pressedTint,{backgroundColor:ACCENT_PRESSED_TINT,borderRadius:x.diameter/2,...smoothCorners}]}):null,_jsx(Animated.View,{style:n?void 0:{transform:[{rotate:ie}]},children:D&&n?n: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{Logger}from"@webority/mobile-core";import React,{forwardRef,useCallback,useEffect,useMemo,useRef,useState}from"react";import{AccessibilityInfo,Animated,BackHandler,Easing,Platform,Pressable,StyleSheet,Text,View}from"react-native";import Reanimated,{cancelAnimation,Easing as ReanimatedEasing,useAnimatedStyle,useSharedValue,withTiming}from"react-native-reanimated";import{useSafeAreaInsets}from"react-native-safe-area-context";import{usePresenceMotion}from"../../hooks/usePresenceMotion.js";import{usePressAnimation}from"../../hooks/usePressAnimation.js";import{createAnimatedValue,resolveFloatingActionButtonSize,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,jsxs as _jsxs,Fragment as _Fragment}from"react/jsx-runtime";const toneBackground=(e,t)=>{switch(t){case"success":return e.colors.success;case"warning":return e.colors.warning;case"danger":return e.colors.danger;case"neutral":return e.colors["bg-muted"];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-body"];switch(t){case"success":return e.colors["on-success"];case"warning":return e.colors["on-warning"];case"danger":return e.colors["on-danger"];default:return e.colors["on-primary"]}},FloatingActionButton=forwardRef((e,t)=>{const{icon:o,onPress:n,label:s,collapsed:i=!1,size:r="md",tone:a="primary",position:l,bottomOffset:c,disabled:u=!1,hideOnScroll:d=!1,isScrolling:m=!1,accessibilityLabel:b,accessibilityHint:f,haptic:g,style:p,containerStyle:h,labelStyle:y,testID:w}=e,x=useTheme(),v=useSafeAreaInsets(),S=useMemo(()=>resolveFloatingActionButtonSize(x,r),[x,r]),A=useMemo(()=>buildStyles(x),[x]),{scale:R,opacity:_,pressIn:E,pressOut:C}=usePressAnimation({enabled:!u}),j=usePresenceMotion(),I=x.space[x.components["floating-action-button"]["edge-offset"]],P=x.space[x.components["floating-action-button"]["bottom-offset"]],k=useRef(createAnimatedValue(1)).current,F=j.duration("default");useEffect(()=>{if(!d)return void setNativeValue(k,1);const e=Animated.timing(k,{toValue:m?0:1,duration:F,easing:Easing.bezier(...x.motion.ease["in-out"]),useNativeDriver:!0});return e.start(),()=>e.stop()},[d,m,k,F,x.motion.ease["in-out"]]);const V=S.diameter+(c??P)+v.bottom+I,T=k.interpolate({inputRange:[0,1],outputRange:j.range(V,0)}),D=useMemo(()=>Animated.multiply(k,_),[k,_]),B=o,L="string"==typeof s&&s.length>0,M=L&&i,N=j.reduced,O=x.space.sm,z=S["label-padding-x"],H=x.motion.duration.fast,$=x.motion.ease["in-out"],G=useSharedValue(M?1:0),[U,W]=useState(null);useEffect(()=>{const e=M?1:0;return G.value=N?e:withTiming(e,{duration:H,easing:ReanimatedEasing.bezier(...$)}),()=>cancelAnimation(G)},[M,N,G,H,$]);const Y=useCallback(e=>{const t=Math.ceil(e);W(e=>e===t?e:t)},[]),Q=useAnimatedStyle(()=>({paddingHorizontal:z*(1-G.value)})),X=useAnimatedStyle(()=>{const e=Math.max(0,1-2*G.value);return null===U?G.value>=1?{opacity:e,width:0}:{opacity:e}:{opacity:e,width:(U+O)*(1-G.value)}}),q=u?x.colors["surface-disabled"]:toneBackground(x,a),J=u?x.colors["text-disabled"]:toneForeground(x,a),K=useMemo(()=>{if(!l)return null;const e=(c??P)+v.bottom;switch(l){case"bottomLeft":return{position:"absolute",bottom:e,left:I};case"bottomCenter":return{position:"absolute",bottom:e,alignSelf:"center"};default:return{position:"absolute",bottom:e,right:I}}},[l,c,v.bottom,P,I]);return _jsx(Animated.View,{style:[K,{transform:[{translateY:T},{scale:R}],opacity:D},h,p],pointerEvents:d&&m?"none":"auto",children:_jsx(Pressable,{ref:t,onPress:e=>{if(u)return;const t=resolveHaptic(g,"impactLight");t&&triggerHaptic(t),n()},onPressIn:E,onPressOut:C,disabled:u,accessibilityRole:"button",accessibilityLabel:b,accessibilityHint:f,accessibilityState:{disabled:u},"aria-disabled":u,testID:w,style:[A.base,L?{height:S.diameter,minWidth:S.diameter,borderRadius:S.diameter/2,...smoothCorners}:{width:S.diameter,height:S.diameter,borderRadius:S.diameter/2,...smoothCorners},x.shadow.popover,{backgroundColor:q,opacity:u?.55:1}],children:({pressed:e})=>_jsxs(_Fragment,{children:[e&&!u?_jsx(View,{pointerEvents:"none",testID:"fab-pressed",style:[A.pressedTint,{backgroundColor:pressedTintFor(x,a),borderRadius:S.diameter/2,...smoothCorners}]}):null,L?_jsxs(Reanimated.View,{style:[A.extendedRow,Q],children:[B,_jsx(Reanimated.View,{style:[A.labelClip,X],children:_jsx(Text,{onLayout:e=>Y(e.nativeEvent.layout.width),style:[A.label,{color:J,fontSize:S.text,fontWeight:x.weight.semibold,marginLeft:O},y],numberOfLines:1,children:s})})]}):B]})})})});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},extendedRow:{flexDirection:"row",alignItems:"center"},labelClip:{flexDirection:"row",overflow:"hidden"},label:{includeFontPadding:!1,flexShrink:0}}),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:b=!1,containerStyle:f,secondaryActionStyle:g,labelPillStyle:p,labelStyle:h,testID:y}=e,w=useTheme(),x=useSafeAreaInsets(),v=useMemo(()=>resolveFloatingActionButtonSize(w,c),[w,c]),S=useMemo(()=>buildGroupStyles(w),[w]),A=usePresenceMotion(),R=A.duration("default"),_=w.space[w.components["floating-action-button"]["edge-offset"]],E=w.space[w.components["floating-action-button"]["bottom-offset"]],C=w.space[w.components["floating-action-button"]["secondary-gap"]],j=w.components["floating-action-button"]["stagger-ms"],I=useMemo(()=>n.slice(0,6),[n]),P=I.length,k=useMemo(()=>I.map((e,t)=>({action:e,index:t})).reverse(),[I]),F=__DEV__?describeActionProblem(n):"";useEffect(()=>{__DEV__&&F&&Logger.warn(`[@webority/mobile-ui] FloatingActionButtonGroup ${F}`)},[F]);const V="boolean"==typeof s,[T,D]=useState(i),B=V?s:T,L=useRef(createAnimatedValue(1)).current;useEffect(()=>{if(!m)return void setNativeValue(L,1);const e=Animated.timing(L,{toValue:b?0:1,duration:R,easing:Easing.bezier(...w.motion.ease["in-out"]),useNativeDriver:!0});return e.start(),()=>e.stop()},[m,b,L,R,w.motion.ease["in-out"]]);const M=m&&b;useEffect(()=>{M&&B&&(V||D(!1),r?.(!1))},[M,B,V,r]);const N=v.diameter+(l??E)+x.bottom+_,O=L.interpolate({inputRange:[0,1],outputRange:A.range(N,0)}),z=L,H=useRef(createAnimatedValue(B?1:0)).current,$=useRef([]),[G,U]=useState(0);useEffect(()=>{const e=$.current;if(e.length!==P){if(e.length<P){const t=e.slice();for(let o=e.length;o<P;o+=1)t.push(new Animated.Value(B?1:0));$.current=t}else $.current=e.slice(0,P);U(e=>e+1)}},[P]),useEffect(()=>{const e=Animated.timing(H,{toValue:B?1:0,duration:R,easing:Easing.bezier(...w.motion.ease["in-out"]),useNativeDriver:!0});e.start();const t=$.current.map(e=>Animated.timing(e,{toValue:B?1:0,duration:R,easing:Easing.bezier(...w.motion.ease["in-out"]),useNativeDriver:!0})),o=B?t:[...t].reverse(),n=Animated.stagger(j,o);return n.start(),()=>{e.stop(),n.stop()}},[B,H,R,w.motion.ease["in-out"],P,G,j]);const W=useCallback(e=>{const t=resolveHaptic(d,"impactLight");t&&triggerHaptic(t),V||D(e),r?.(e)},[V,r,d]),Y=useRef(null),Q=useRef(B),X=useRef(!1);useEffect(()=>{if(Q.current===B)return;Q.current=B;const e=X.current;if(X.current=!1,M||e)return;const t=Y.current;t&&("web"===Platform.OS?t.focus?.():AccessibilityInfo.sendAccessibilityEvent(t,"focus"));announce(B?`${u}, expanded, ${P} ${1===P?"action":"actions"}`:`${u}, collapsed`)},[B,M,u,P]);const q=useCallback(()=>{W(!B)},[B,W]),J=useCallback(e=>{!1!==d&&triggerHaptic("selection"),X.current=!0,e.onPress(),V||D(!1),r?.(!1)},[V,r,d]),K=useCallback(()=>{B&&W(!1)},[B,W]);useEffect(()=>{if(!B)return;const e=BackHandler.addEventListener("hardwareBackPress",()=>(W(!1),!0));return()=>e.remove()},[B,W]),useEffect(()=>{if(!B||"web"!==Platform.OS)return;const onKeyDown=e=>{"Escape"===e.key&&W(!1)};return window.addEventListener("keydown",onKeyDown),()=>window.removeEventListener("keydown",onKeyDown)},[B,W]);const Z=useMemo(()=>{const e=(l??E)+x.bottom;switch(a){case"bottomLeft":return{position:"absolute",bottom:e,left:_,alignItems:"flex-start"};case"bottomCenter":return{position:"absolute",bottom:e,alignSelf:"center",alignItems:"center"};default:return{position:"absolute",bottom:e,right:_,alignItems:"flex-end"}}},[a,l,x.bottom,E,_]),slotOffset=e=>-(v.diameter+C)*(e+1),ee=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]),te=.78*v.diameter,oe=useMemo(()=>{const e=te+w.space.sm;switch(a){case"bottomLeft":return{left:e,alignItems:"flex-start"};case"bottomCenter":return{right:v.diameter/2+te/2+w.space.sm,alignItems:"flex-end"};default:return{right:e,alignItems:"flex-end"}}},[a,te,v.diameter,w.space.sm]),ne=H.interpolate({inputRange:[0,1],outputRange:[0,.4]}),se=H.interpolate(A.reduced?{inputRange:[0,.5,.5001,1],outputRange:["0deg","0deg","45deg","45deg"]}:{inputRange:[0,1],outputRange:["0deg","45deg"]});return _jsxs(_Fragment,{children:[B?_jsx(Animated.View,{pointerEvents:B?"auto":"none",style:[StyleSheet.absoluteFill,{backgroundColor:w.colors.scrim,opacity:ne}],children:_jsx(Pressable,{style:StyleSheet.absoluteFill,onPress:K,accessibilityElementsHidden:!0,importantForAccessibility:"no",testID:y?`${y}-backdrop`:void 0})}):null,_jsxs(Animated.View,{pointerEvents:M?"none":"box-none",style:[Z,{transform:[{translateY:O}],opacity:z},f],accessibilityRole:"menu",testID:y,children:[k.map(({action:e,index:t})=>{const o=$.current[t];if(!o)return null;const n=o.interpolate({inputRange:[0,1],outputRange:A.range(0,slotOffset(t))}),s=o.interpolate({inputRange:[0,1],outputRange:A.range(.6,1)}),i=toneBackground(w,e.tone??"primary"),r=toneForeground(w,e.tone??"primary"),a=e.label?_jsx(View,{pointerEvents:"none",style:[S.labelSlot,oe],testID:y?`${y}-label-${e.key}`:void 0,children:_jsx(View,{style:[S.labelPill,w.shadow.card,{backgroundColor:w.colors.surface,paddingHorizontal:w.space.sm,paddingVertical:w.space.xs,borderRadius:w.radius.sm,...smoothCorners},p],children:_jsx(Text,{style:[{color:w.colors["text-body"],fontSize:w.text.sm.size,fontWeight:w.weight.medium},h],numberOfLines:1,children:e.label})})}):null;return _jsxs(Animated.View,{pointerEvents:B?"auto":"none",accessibilityElementsHidden:!B,importantForAccessibility:B?"auto":"no-hide-descendants","aria-hidden":!B,style:[S.secondaryRow,ee,{position:"absolute",bottom:0,opacity:o,transform:[{translateY:n},{scale:s}]}],children:[_jsx(Pressable,{onPress:()=>J(e),focusable:B,accessibilityRole:"menuitem",accessibilityLabel:e.accessibilityLabel,style:[S.fabBase,w.shadow.elevated,{width:te,height:te,borderRadius:te/2,...smoothCorners,backgroundColor:i},g],testID:y?`${y}-action-${e.key}`:void 0,children:({pressed:t})=>_jsxs(_Fragment,{children:[t?_jsx(View,{pointerEvents:"none",testID:"fab-pressed",style:[S.pressedTint,{backgroundColor:pressedTintFor(w,e.tone??"primary"),borderRadius:te/2,...smoothCorners}]}):null,React.isValidElement(e.icon)?e.icon:_jsx(Text,{style:{color:r},children:String(e.icon??"")})]})}),a]},e.key)}),_jsx(Pressable,{ref:Y,onPress:q,accessibilityRole:"button",accessibilityLabel:u,accessibilityState:{expanded:B},"aria-expanded":B,style:[S.fabBase,w.shadow.popover,{width:v.diameter,height:v.diameter,borderRadius:v.diameter/2,...smoothCorners,backgroundColor:w.colors.primary}],testID:y?`${y}-primary`:void 0,children:({pressed:e})=>_jsxs(_Fragment,{children:[e?_jsx(View,{pointerEvents:"none",testID:"fab-pressed",style:[S.pressedTint,{backgroundColor:ACCENT_PRESSED_TINT,borderRadius:v.diameter/2,...smoothCorners}]}):null,_jsx(Animated.View,{style:o?void 0:{transform:[{rotate:se}]},children:B&&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{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;
+"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:i,help:r,helperText:l,error:n,required:o=!1,name:s,children:a,layout:u="stacked",helperLines:c,labelStyle:d,helperStyle:x,errorStyle:m,containerStyle:f,inputContainerStyle:p,accessibilityLabel:h,testID:F}=e,S=useTheme(),y=useMemo(()=>buildStyles(S),[S]),b=useOptionalFormContext(),j=null!=s&&null!=b,T=j?b.getFieldProps(s):null,k="function"==typeof a,I=j?k?T?.error:void 0:n,g=fieldTextAsString(j?T?.error:n),v=useRef(createAnimatedValue(I?1:0)).current;useEffect(()=>{const e=Animated.timing(v,{toValue:I?1:0,duration:S.motion.duration.fast,useNativeDriver:!0});return e.start(),()=>e.stop()},[I,v,S.motion.duration.fast]);const w=useMemo(()=>{if(h)return h;const e=fieldTextAsString(i);return e?g?`${e}, error: ${g}`:e:void 0},[h,i,g]),R=useNotationInk(d,S.text.sm.size,S.colors["text-muted"]),_=useNotationInk(x,S.text.sm.size,S.colors["text-subtle"]),N=useNotationInk(m,S.text.sm.size,S.colors["danger-text"]),C=hasFieldText(i),V=_jsxs(Text,{style:[y.label,"inline"!==u||hasFieldText(r)?null:y.labelInline,hasFieldText(r)?y.labelShrink:null,d],children:[_jsx(NotationInkContext.Provider,{value:R,children:i}),o?_jsx(RequiredMark,{}):null]}),z=C?hasFieldText(r)?_jsxs(View,{style:[y.labelRow,"inline"===u?y.labelInline:null],children:[V,_jsx(View,{style:[y.help,{marginLeft:S.space.xs}],children:r})]}):V:null,A="inline"===u?y.inputInline:y.inputStacked,L=hasFieldText(I),D=!L&&hasFieldText(l),E=(()=>{if(k)return T?a(T):null;if(j&&T&&React.isValidElement(a)){const e=a,t=e.props.onChangeText,i=e.props.onBlur,r=e.props.onFocus;return React.cloneElement(e,{value:T.value,onChangeText:e=>{T.onChangeText(e),t?.(e)},onBlur:e=>{T.onBlur(),i?.(e)},onFocus:e=>{T.onFocus(),r?.(e)},error:T.error,ref:e=>b.registerField(s,e??null)})}return a})(),M=o&&!C&&React.isValidElement(E)?React.cloneElement(E,{required:!0}):E;return _jsxs(View,{ref:t,style:["inline"===u?y.rootInline:y.rootStacked,f],accessibilityLabel:w,accessibilityHint:g||void 0,testID:F,children:[z,_jsx(View,{style:[A,p],children:M}),D?_jsx(Text,{style:[y.helper,x],numberOfLines:c||void 0,children:_jsx(NotationInkContext.Provider,{value:_,children:l})}):null,L?_jsx(Animated.Text,{style:[y.error,{opacity:v},m],numberOfLines:c||void 0,accessibilityLiveRegion:"polite",children:_jsx(NotationInkContext.Provider,{value:N,children:I})}):null]})});FormField.displayName="FormField";const buildStyles=e=>StyleSheet.create({rootStacked:{flexDirection:"column",gap:e.space.xs},rootInline:{flexDirection:"row",alignItems:"center",flexWrap:"wrap",gap:e.space.xs},label:{fontSize:e.text.sm.size,...fontFor(e,"medium"),color:e.colors["text-muted"]},labelShrink:{flexShrink:1},labelRow:{flexDirection:"row",alignItems:"center"},help:{flexShrink:0},labelInline:{width:"35%"},inputStacked:{width:"100%"},inputInline:{flex:1,minWidth:0},helper:{fontSize:e.text.sm.size,color:e.colors["text-subtle"]},error:{fontSize:e.text.sm.size,color:e.colors["danger-text"]}});export{FormField};export default FormField;

package/lib/module/components/IconBadge/IconBadge.js

@@ -1 +1 @@
-"use strict";import{forwardRef}from"react";import{StyleSheet,View}from"react-native";import{useTheme}from"../../theme/index.js";import{tintOf}from"../../utils/color.js";import{smoothCorners}from"../../utils/corners.js";import{renderSlotIcon}from"../AppIcon/slotIcon.js";import{jsx as _jsx}from"react/jsx-runtime";const SIZE_MAP={sm:{diameter:32,icon:16},md:{diameter:40,icon:20},lg:{diameter:56,icon:28}},FILL_OPACITY=.14,inkFor=(e,r)=>{switch(r){case"secondary":return e.colors.secondary;case"success":return e.colors.success;case"warning":return e.colors.warning;case"error":return e.colors.error;case"info":return e.colors.info;case"neutral":return e.colors.text.secondary;default:return e.colors.primary}},IconBadge=forwardRef((e,r)=>{const{icon:o,iconVariant:t,size:s="md",tone:i="primary",accessibilityLabel:c,style:n,testID:a}=e,l=useTheme(),d=SIZE_MAP[s],m=inkFor(l,i),u="neutral"===i?l.colors.background.tertiary:tintOf(m,.14,l.colors.background.tertiary),y={color:m,size:d.icon,disabled:!1},f=void 0!==c;return _jsx(View,{ref:r,testID:a,accessible:f,accessibilityRole:f?"image":void 0,accessibilityLabel:c,importantForAccessibility:f?"yes":"no",style:[styles.base,{width:d.diameter,height:d.diameter,borderRadius:d.diameter/2,...smoothCorners,backgroundColor:u},n],children:renderSlotIcon(o,y,t)})});IconBadge.displayName="IconBadge";const styles=StyleSheet.create({base:{alignItems:"center",justifyContent:"center"}});export{IconBadge};export default IconBadge;
+"use strict";import{forwardRef}from"react";import{StyleSheet,View}from"react-native";import{useTheme}from"../../theme/index.js";import{tintOf}from"../../utils/color.js";import{smoothCorners}from"../../utils/corners.js";import{renderSlotIcon}from"../AppIcon/slotIcon.js";import{jsx as _jsx}from"react/jsx-runtime";const SIZE_MAP={sm:{diameter:32,icon:16},md:{diameter:40,icon:20},lg:{diameter:56,icon:28}},FILL_OPACITY=.14,inkFor=(e,r)=>{switch(r){case"secondary":return e.colors.neutral;case"success":return e.colors.success;case"warning":return e.colors.warning;case"danger":return e.colors.danger;case"info":return e.colors.info;case"neutral":return e.colors["text-muted"];default:return e.colors.primary}},IconBadge=forwardRef((e,r)=>{const{icon:o,iconVariant:t,size:s="md",tone:i="primary",accessibilityLabel:c,style:n,testID:a}=e,l=useTheme(),m=SIZE_MAP[s],d=inkFor(l,i),u="neutral"===i?l.colors["bg-muted"]:tintOf(d,.14,l.colors["bg-muted"]),f={color:d,size:m.icon,disabled:!1},g=void 0!==c;return _jsx(View,{ref:r,testID:a,accessible:g,accessibilityRole:g?"image":void 0,accessibilityLabel:c,importantForAccessibility:g?"yes":"no",style:[styles.base,{width:m.diameter,height:m.diameter,borderRadius:m.diameter/2,...smoothCorners,backgroundColor:u},n],children:renderSlotIcon(o,f,t)})});IconBadge.displayName="IconBadge";const styles=StyleSheet.create({base:{alignItems:"center",justifyContent:"center"}});export{IconBadge};export default IconBadge;

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

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

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

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

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

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

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

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

@@ -1 +1 @@
-"use strict";import{forwardRef}from"react";import{Keyboard,Pressable,RefreshControl}from"react-native";import{KeyboardAwareScrollView as ControllerScrollView}from"react-native-keyboard-controller";import{useSafeAreaInsets}from"react-native-safe-area-context";import{useTheme}from"../../theme/index.js";import{jsx as _jsx}from"react/jsx-runtime";const tapAreaStyle={flexGrow:1},KeyboardAwareScrollView=forwardRef((e,r)=>{const{children:o,bottomOffset:t=24,extraKeyboardSpace:a=0,safeAreaEdges:s=["bottom"],refreshing:l=!1,onRefresh:i,dismissOnTapOutside:n=!1,contentContainerStyle:d,refreshControl:c,...f}=e,m=useTheme(),p=useSafeAreaInsets(),b=s.includes("bottom"),y={paddingBottom:b?p.bottom:0,...s.includes("top")?{paddingTop:p.top}:null,...s.includes("left")?{paddingLeft:p.left}:null,...s.includes("right")?{paddingRight:p.right}:null},h=c??(i?_jsx(RefreshControl,{refreshing:l,onRefresh:i,tintColor:m.colors.primary,colors:[m.colors.primary],progressBackgroundColor:m.colors.background.elevated,titleColor:m.colors.text.secondary}):void 0);return _jsx(ControllerScrollView,{ref:r,bottomOffset:t,extraKeyboardSpace:a-(b?p.bottom:0),keyboardShouldPersistTaps:"handled",keyboardDismissMode:"none",contentContainerStyle:[d,y],refreshControl:h,...f,children:n?_jsx(Pressable,{accessible:!1,onPress:Keyboard.dismiss,style:tapAreaStyle,children:o}):o})});KeyboardAwareScrollView.displayName="KeyboardAwareScrollView";export{KeyboardAwareScrollView};export default KeyboardAwareScrollView;
+"use strict";import{forwardRef}from"react";import{Keyboard,Pressable,RefreshControl}from"react-native";import{KeyboardAwareScrollView as ControllerScrollView}from"react-native-keyboard-controller";import{useSafeAreaInsets}from"react-native-safe-area-context";import{useTheme}from"../../theme/index.js";import{jsx as _jsx}from"react/jsx-runtime";const tapAreaStyle={flexGrow:1},KeyboardAwareScrollView=forwardRef((e,r)=>{const{children:o,bottomOffset:t=24,extraKeyboardSpace:s=0,safeAreaEdges:a=["bottom"],refreshing:l=!1,onRefresh:i,dismissOnTapOutside:n=!1,contentContainerStyle:d,refreshControl:c,...f}=e,m=useTheme(),p=useSafeAreaInsets(),b=a.includes("bottom"),y={paddingBottom:b?p.bottom:0,...a.includes("top")?{paddingTop:p.top}:null,...a.includes("left")?{paddingLeft:p.left}:null,...a.includes("right")?{paddingRight:p.right}:null},u=c??(i?_jsx(RefreshControl,{refreshing:l,onRefresh:i,tintColor:m.colors.primary,colors:[m.colors.primary],progressBackgroundColor:m.colors.surface,titleColor:m.colors["text-muted"]}):void 0);return _jsx(ControllerScrollView,{ref:r,bottomOffset:t,extraKeyboardSpace:s-(b?p.bottom:0),keyboardShouldPersistTaps:"handled",keyboardDismissMode:"none",contentContainerStyle:[d,y],refreshControl:u,...f,children:n?_jsx(Pressable,{accessible:!1,onPress:Keyboard.dismiss,style:tapAreaStyle,children:o}):o})});KeyboardAwareScrollView.displayName="KeyboardAwareScrollView";export{KeyboardAwareScrollView};export default KeyboardAwareScrollView;

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

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

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,resolveCheckboxSize,resolveListItemSize,useTheme}from"../../theme/index.js";import{smoothCorners}from"../../utils/corners.js";import{triggerHaptic}from"../../utils/hapticUtils.js";import{mergeRefs}from"../../utils/mergeRefs.js";import{themeStyles}from"../../utils/themeStyles.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 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,SelectionBox=({checked:e,disabled:t})=>{const i=useTheme(),s=resolveCheckboxSize(i,"md").boxSize,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.sm,...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=React.memo(forwardRef((e,t)=>{const{title:i,loading:s=!1,subtitle:o,description:r,children:l,titleLines:n=1,subtitleLines:c=1,left:a,icon:d,iconTone:m="primary",right:h,rightPlacement:u="auto",selectable:g=!1,checked:p=!1,onCheckedChange:x,actions:y,onPress:b,haptic:f,selected:S=!1,disabled:j=!1,size:w="md",divider:_=!1,chevron:v=!1,leftActions:I,rightActions:k,contextMenu:L,accessibilityLabel:C,accessibilityHint:V,style:A,containerStyle:R,titleStyle:T,subtitleStyle:B,descriptionStyle:z,leftSlotStyle:D,rightSlotStyle:P,testID:F}=e,H=useTheme(),M=useMemo(()=>resolveListItemSize(H,w),[H,w]),W=stylesFor(H),{fontScale:E}=useWindowDimensions(),O=!!h&&("below"===u||"auto"===u&&E>1.2),G=useContextMenu(j?void 0:L,{haptic:f||!1,testID:F}),N=useMemo(()=>mergeRefs(t,G.hostRef),[t,G.hostRef]),Y=g||!!b,Z=Y||G.enabled,U=Z&&!j,{style:q,pressIn:J,pressOut:K}=usePressAnimation({enabled:U}),Q=useFlickGuard(),X=C??("string"==typeof i?i:void 0),isText=e=>"string"==typeof e||"number"==typeof e,$=a??(void 0===d?null:_jsx(IconBadge,{icon:d,tone:m,size:BADGE_SIZE[w]})),ee=g?_jsxs(View,{style:W.selectionLead,children:[_jsx(SelectionBox,{checked:p,disabled:j}),$?_jsx(View,{style:W.selectionLeadContent,children:$}):null]}):$,te=null!=y&&!1!==y&&!(Array.isArray(y)&&0===y.length),ie=_&&!te,se=_jsxs(View,{style:[W.row,{paddingVertical:M.paddingY,minHeight:M.minHeight,backgroundColor:S?H.colors.surface.selected:"transparent"},ie?W.divider:null,j?W.disabled:null,R],children:[ee?_jsx(View,{style:[W.leftSlot,D],children:ee}):null,_jsxs(View,{style:W.middle,children:[null==i||isText(i)?_jsx(Text,{style:[W.title,{fontSize:M.titleText,...fontFor(H,"medium"),color:j?H.colors.text.disabled:H.colors.text.primary},T],numberOfLines:n,children:i??" "}):i,null==o||""===o?null:isText(o)?_jsx(Text,{style:[W.subtitle,{fontSize:M.subtitleText,color:j?H.colors.text.disabled:H.colors.text.secondary},B],numberOfLines:c,children:o}):o,r?_jsx(Text,{style:[W.description,{fontSize:M.subtitleText,color:j?H.colors.text.disabled:H.colors.text.tertiary},z],numberOfLines:2,children:r}):null,null!=l&&!1!==l?_jsx(View,{style:W.body,children:l}):null,O?_jsx(View,{style:[W.rightBelow,P],children:h}):null]}),h&&!O||v?_jsxs(View,{style:[W.rightSlot,O?null:P],children:[O?null:h,v?_jsx(View,{style:h&&!O?W.chevronWithRight:null,children:_jsx(Chevron,{color:j?H.colors.text.disabled:H.colors.text.tertiary})}):null]}):null]}),oe=Z?_jsx(Animated.View,{style:[q,A],children:_jsx(Pressable,{ref:N,onPress:e=>{U&&Y&&!Q.isFlick(e)&&(f&&triggerHaptic(f),g?x?.(!p):b?.(e))},onPressIn:e=>{Q.onPressIn(e),J()},onPressOut:K,disabled:!U,accessibilityRole:g?"checkbox":b?"button":void 0,accessibilityLabel:X,accessibilityHint:V,accessibilityState:g?{checked:p,disabled:!U}:{selected:S,disabled:!U},"aria-disabled":!U,...g?{"aria-checked":p}:{"aria-selected":S},testID:F,android_ripple:{color:H.colors.surface.pressed,borderless:!1},style:({pressed:e})=>e?W.pressed:null,...G.hostProps,children:se})}):_jsx(View,{ref:t,accessibilityRole:"none",accessibilityLabel:X,accessibilityHint:V,accessibilityState:{selected:S,disabled:j},"aria-selected":S,"aria-disabled":j,testID:F,style:A,children:se}),re=I&&I.length>0||k&&k.length>0,le=te?_jsxs(View,{style:[S?{backgroundColor:H.colors.surface.selected}:null,_?W.divider:null],children:[oe,_jsx(View,{style:W.actions,children:renderActions(y)})]}):oe,ne=re?_jsx(Swipeable,{leftActions:I,rightActions:k,accessibilityLabel:X,children:le}):le;return s?_jsx(ListItemSkeleton,{...e}):G.enabled?_jsxs(_Fragment,{children:[ne,G.renderSurface(_jsx(View,{style:W.preview,children:se}))]}):ne}));ListItem.displayName="ListItem";const ListItemSkeleton=({subtitle:e,description:t,left:i,icon:s,right:o,chevron:r,size:l="md",containerStyle:n,style:c})=>{const a=useTheme(),d=resolveListItemSize(a,l),m=Math.round(1.15*d.titleText),h=Math.round(1.15*d.subtitleText);return _jsxs(View,{style:[{flexDirection:"row",alignItems:"center",paddingHorizontal:a.spacing.md,paddingVertical:d.paddingY,minHeight:d.minHeight},n,c],children:[void 0!==i||void 0!==s?_jsx(View,{style:{marginRight:a.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:a.spacing.xs}}),void 0!==e?_jsx(Skeleton,{shape:"text",width:"50%",height:h,style:void 0!==t?{marginBottom:a.spacing.xs}:void 0}):null,void 0!==t?_jsx(Skeleton,{shape:"text",width:"85%",height:h}):null]}),void 0!==o||r?_jsx(View,{style:{marginLeft:a.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},body:{marginTop:e.spacing.xs},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:e.spacing.xxs,...fontFor(e,"normal")},description:{marginTop:e.spacing.xxs,...fontFor(e,"normal")}}),stylesFor=themeStyles(buildStyles);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,resolveCheckboxSize,resolveListItemSize,useTheme}from"../../theme/index.js";import{smoothCorners}from"../../utils/corners.js";import{triggerHaptic}from"../../utils/hapticUtils.js";import{mergeRefs}from"../../utils/mergeRefs.js";import{themeStyles}from"../../utils/themeStyles.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 Chevron=({color:e})=>{const t=useTheme();return _jsx(_Fragment,{children:(t.settings.icons.chevronRight??defaultIcons.chevronRight)({size:20,color:e})})},BADGE_SIZE={sm:"sm",md:"md",lg:"lg"},RIGHT_BELOW_FONT_SCALE=1.2,SelectionBox=({checked:e,disabled:t})=>{const s=useTheme(),i=resolveCheckboxSize(s,"md")["box-size"],o=Math.round(.72*i);return _jsx(View,{accessibilityElementsHidden:!0,importantForAccessibility:"no-hide-descendants",pointerEvents:"none",style:{width:i,height:i,alignItems:"center",justifyContent:"center",borderWidth:s.size.border,borderRadius:s.radius.sm,...smoothCorners,borderColor:e?s.colors.primary:s.colors.border,backgroundColor:e?s.colors.primary:t?s.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:s.colors["on-primary"],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=React.memo(forwardRef((e,t)=>{const{title:s,loading:i=!1,subtitle:o,description:l,children:r,titleLines:n=1,subtitleLines:c=1,left:d,icon:a,iconTone:m="primary",right:h,rightPlacement:u="auto",selectable:x=!1,checked:p=!1,onCheckedChange:g,actions:b,onPress:f,haptic:y,selected:j=!1,disabled:S=!1,size:w="md",divider:_=!1,chevron:v=!1,leftActions:I,rightActions:L,contextMenu:k,accessibilityLabel:C,accessibilityHint:V,style:A,containerStyle:R,titleStyle:B,subtitleStyle:z,descriptionStyle:D,leftSlotStyle:F,rightSlotStyle:P,testID:T}=e,H=useTheme(),M=useMemo(()=>resolveListItemSize(H,w),[H,w]),W=stylesFor(H),{fontScale:E}=useWindowDimensions(),O=!!h&&("below"===u||"auto"===u&&E>1.2),G=useContextMenu(S?void 0:k,{haptic:y||!1,testID:T}),N=useMemo(()=>mergeRefs(t,G.hostRef),[t,G.hostRef]),Z=x||!!f,U=Z||G.enabled,q=U&&!S,{style:J,pressIn:K,pressOut:Q}=usePressAnimation({enabled:q}),X=useFlickGuard(),Y=C??("string"==typeof s?s:void 0),isText=e=>"string"==typeof e||"number"==typeof e,$=d??(void 0===a?null:_jsx(IconBadge,{icon:a,tone:m,size:BADGE_SIZE[w]})),ee=x?_jsxs(View,{style:W.selectionLead,children:[_jsx(SelectionBox,{checked:p,disabled:S}),$?_jsx(View,{style:W.selectionLeadContent,children:$}):null]}):$,te=null!=b&&!1!==b&&!(Array.isArray(b)&&0===b.length),se=_&&!te,ie=_jsxs(View,{style:[W.row,{paddingVertical:M["padding-y"],minHeight:M["min-height"],backgroundColor:j?H.colors["surface-selected"]:"transparent"},se?W.divider:null,S?W.disabled:null,R],children:[ee?_jsx(View,{style:[W.leftSlot,F],children:ee}):null,_jsxs(View,{style:W.middle,children:[null==s||isText(s)?_jsx(Text,{style:[W.title,{fontSize:M["title-text"],...fontFor(H,"medium"),color:S?H.colors["text-disabled"]:H.colors["text-body"]},B],numberOfLines:n,children:s??" "}):s,null==o||""===o?null:isText(o)?_jsx(Text,{style:[W.subtitle,{fontSize:M["subtitle-text"],color:S?H.colors["text-disabled"]:H.colors["text-muted"]},z],numberOfLines:c,children:o}):o,l?_jsx(Text,{style:[W.description,{fontSize:M["subtitle-text"],color:S?H.colors["text-disabled"]:H.colors["text-subtle"]},D],numberOfLines:2,children:l}):null,null!=r&&!1!==r?_jsx(View,{style:W.body,children:r}):null,O?_jsx(View,{style:[W.rightBelow,P],children:h}):null]}),h&&!O||v?_jsxs(View,{style:[W.rightSlot,O?null:P],children:[O?null:h,v?_jsx(View,{style:h&&!O?W.chevronWithRight:null,children:_jsx(Chevron,{color:S?H.colors["text-disabled"]:H.colors["text-subtle"]})}):null]}):null]}),oe=U?_jsx(Animated.View,{style:[J,A],children:_jsx(Pressable,{ref:N,onPress:e=>{q&&Z&&!X.isFlick(e)&&(y&&triggerHaptic(y),x?g?.(!p):f?.(e))},onPressIn:e=>{X.onPressIn(e),K()},onPressOut:Q,disabled:!q,accessibilityRole:x?"checkbox":f?"button":void 0,accessibilityLabel:Y,accessibilityHint:V,accessibilityState:x?{checked:p,disabled:!q}:{selected:j,disabled:!q},"aria-disabled":!q,...x?{"aria-checked":p}:{"aria-selected":j},testID:T,android_ripple:{color:H.colors["surface-pressed"],borderless:!1},style:({pressed:e})=>e?W.pressed:null,...G.hostProps,children:ie})}):_jsx(View,{ref:t,accessibilityRole:"none",accessibilityLabel:Y,accessibilityHint:V,accessibilityState:{selected:j,disabled:S},"aria-selected":j,"aria-disabled":S,testID:T,style:A,children:ie}),le=I&&I.length>0||L&&L.length>0,re=te?_jsxs(View,{style:[j?{backgroundColor:H.colors["surface-selected"]}:null,_?W.divider:null],children:[oe,_jsx(View,{style:W.actions,children:renderActions(b)})]}):oe,ne=le?_jsx(Swipeable,{leftActions:I,rightActions:L,accessibilityLabel:Y,children:re}):re;return i?_jsx(ListItemSkeleton,{...e}):G.enabled?_jsxs(_Fragment,{children:[ne,G.renderSurface(_jsx(View,{style:W.preview,children:ie}))]}):ne}));ListItem.displayName="ListItem";const ListItemSkeleton=({subtitle:e,description:t,left:s,icon:i,right:o,chevron:l,size:r="md",containerStyle:n,style:c})=>{const d=useTheme(),a=resolveListItemSize(d,r),m=Math.round(1.15*a["title-text"]),h=Math.round(1.15*a["subtitle-text"]);return _jsxs(View,{style:[{flexDirection:"row",alignItems:"center",paddingHorizontal:d.space.md,paddingVertical:a["padding-y"],minHeight:a["min-height"]},n,c],children:[void 0!==s||void 0!==i?_jsx(View,{style:{marginRight:d.space.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:d.space.xs}}),void 0!==e?_jsx(Skeleton,{shape:"text",width:"50%",height:h,style:void 0!==t?{marginBottom:d.space.xs}:void 0}):null,void 0!==t?_jsx(Skeleton,{shape:"text",width:"85%",height:h}):null]}),void 0!==o||l?_jsx(View,{style:{marginLeft:d.space.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.space.md},divider:{borderBottomWidth:StyleSheet.hairlineWidth,borderBottomColor:e.colors.border},pressed:{backgroundColor:e.colors["surface-pressed"]},disabled:{opacity:.55},leftSlot:{marginRight:e.space.md,alignItems:"center",justifyContent:"center"},middle:{flex:1,flexDirection:"column",justifyContent:"center"},selectionLead:{flexDirection:"row",alignItems:"center"},selectionLeadContent:{marginLeft:e.space.sm},body:{marginTop:e.space.xs},rightBelow:{alignSelf:"flex-start",flexDirection:"row",alignItems:"center",marginTop:e.space.xs},rightSlot:{marginLeft:e.space.md,alignItems:"center",justifyContent:"center",flexDirection:"row"},actions:{flexDirection:"row",flexWrap:"wrap",gap:e.space.sm,paddingHorizontal:e.space.md,paddingBottom:e.space.md},chevronWithRight:{marginLeft:e.space.xs},preview:{flex:1,backgroundColor:e.colors.surface,borderRadius:e.radius.md,...smoothCorners,overflow:"hidden"},title:{letterSpacing:e["letter-spacing"].normal},subtitle:{marginTop:e.space.xxs,...fontFor(e,"normal")},description:{marginTop:e.space.xxs,...fontFor(e,"normal")}}),stylesFor=themeStyles(buildStyles);export{ListItem};export default ListItem;

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

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

package/lib/module/components/Markdown/Markdown.js

@@ -1 +1 @@
-"use strict";import{useMemo}from"react";import{Linking,Platform,StyleSheet,Text,View}from"react-native";import{useTheme}from"../../theme/index.js";import{smoothCorners}from"../../utils/corners.js";import{Skeleton}from"../Skeleton/index.js";import{parseMarkdown}from"./parse.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const renderInline=(e,t,r,o="i")=>e.map((e,n)=>{const s=`${o}-${n}`;switch(e.type){case"text":return _jsx(Text,{children:e.value},s);case"strong":return _jsx(Text,{style:{fontWeight:t.typography.fontWeight.bold},children:renderInline(e.children,t,r,s)},s);case"em":return _jsx(Text,{style:{fontStyle:"italic"},children:renderInline(e.children,t,r,s)},s);case"strike":return _jsx(Text,{style:{textDecorationLine:"line-through"},children:renderInline(e.children,t,r,s)},s);case"code":return _jsx(Text,{style:{fontFamily:MONO,backgroundColor:t.colors.background.secondary,color:t.colors.text.primary},children:e.value},s);case"link":return _jsx(Text,{accessibilityRole:"link",onPress:()=>r(e.href),style:{color:t.colors.text.link,textDecorationLine:"underline"},children:renderInline(e.children,t,r,s)},s);default:return null}}),MONO=Platform.select({ios:"Menlo",android:"monospace",default:"monospace"}),HEADING_SCALE={1:"3xl",2:"2xl",3:"xl",4:"lg",5:"base",6:"sm"};export const Markdown=({children:e,onLinkPress:t,loading:r=!1,style:o,textStyle:n,testID:s})=>{const l=useTheme(),i=useMemo(()=>createStyles(l),[l]),c=useMemo(()=>parseMarkdown(e??""),[e]),handleLink=e=>{t?t(e):Linking.openURL(e).catch(()=>{})};return r?_jsx(MarkdownSkeleton,{style:o,testID:s}):0===c.length?null:_jsx(View,{style:o,testID:s,children:c.map((e,t)=>_jsx(MarkdownBlock,{block:e,theme:l,styles:i,textStyle:n,onLinkPress:handleLink},`b-${t}`))})};Markdown.displayName="Markdown";const MarkdownBlock=({block:e,theme:t,styles:r,textStyle:o,onLinkPress:n})=>{switch(e.type){case"heading":return _jsx(Text,{accessibilityRole:"header",style:[r.block,{fontSize:t.typography.fontSize[HEADING_SCALE[e.level]],fontWeight:t.typography.fontWeight.semibold,color:t.colors.text.primary},o],children:renderInline(e.children,t,n)});case"paragraph":return _jsx(Text,{style:[r.block,r.body,o],children:renderInline(e.children,t,n)});case"listItem":return _jsxs(View,{style:[r.listRow,{marginLeft:e.depth*t.spacing.md}],children:[_jsx(Text,{style:[r.body,r.bullet,o],children:e.ordered?`${e.index}.`:"•"}),_jsx(Text,{style:[r.body,r.listText,o],children:renderInline(e.children,t,n)})]});case"quote":return _jsx(View,{style:r.quote,children:_jsx(Text,{style:[r.body,r.quoteText,o],children:renderInline(e.children,t,n)})});case"codeBlock":return _jsx(View,{style:r.codeBlock,children:_jsx(Text,{style:r.codeText,children:e.value})});case"rule":return _jsx(View,{style:r.rule});default:return null}},MarkdownSkeleton=({style:e,testID:t})=>{const r=useTheme();return _jsxs(View,{style:e,testID:t,children:[_jsx(Skeleton,{shape:"text",width:"70%",height:20,style:{marginBottom:r.spacing.sm}}),_jsx(Skeleton,{shape:"text",width:"100%",height:14,style:{marginBottom:r.spacing.xs}}),_jsx(Skeleton,{shape:"text",width:"92%",height:14,style:{marginBottom:r.spacing.xs}}),_jsx(Skeleton,{shape:"text",width:"60%",height:14})]})},createStyles=e=>StyleSheet.create({block:{marginBottom:e.spacing.sm},body:{fontSize:e.typography.fontSize.base,color:e.colors.text.primary,lineHeight:1.5*e.typography.fontSize.base},listRow:{flexDirection:"row",marginBottom:e.spacing.xs},bullet:{width:e.spacing.lg},listText:{flex:1},quote:{borderLeftWidth:3,borderLeftColor:e.colors.border.secondary,paddingLeft:e.spacing.sm,marginBottom:e.spacing.sm},quoteText:{color:e.colors.text.secondary,fontStyle:"italic"},codeBlock:{backgroundColor:e.colors.background.secondary,borderRadius:e.radius.sm,...smoothCorners,padding:e.spacing.sm,marginBottom:e.spacing.sm},codeText:{fontFamily:MONO,fontSize:e.typography.fontSize.sm,color:e.colors.text.primary},rule:{height:StyleSheet.hairlineWidth,backgroundColor:e.colors.border.primary,marginVertical:e.spacing.md}});
+"use strict";import{useMemo}from"react";import{Linking,Platform,StyleSheet,Text,View}from"react-native";import{useTheme}from"../../theme/index.js";import{smoothCorners}from"../../utils/corners.js";import{Skeleton}from"../Skeleton/index.js";import{parseMarkdown}from"./parse.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const renderInline=(e,t,r,s="i")=>e.map((e,o)=>{const l=`${s}-${o}`;switch(e.type){case"text":return _jsx(Text,{children:e.value},l);case"strong":return _jsx(Text,{style:{fontWeight:t.weight.bold},children:renderInline(e.children,t,r,l)},l);case"em":return _jsx(Text,{style:{fontStyle:"italic"},children:renderInline(e.children,t,r,l)},l);case"strike":return _jsx(Text,{style:{textDecorationLine:"line-through"},children:renderInline(e.children,t,r,l)},l);case"code":return _jsx(Text,{style:{fontFamily:MONO,backgroundColor:t.colors["bg-subtle"],color:t.colors["text-body"]},children:e.value},l);case"link":return _jsx(Text,{accessibilityRole:"link",onPress:()=>r(e.href),style:{color:t.colors.link,textDecorationLine:"underline"},children:renderInline(e.children,t,r,l)},l);default:return null}}),MONO=Platform.select({ios:"Menlo",android:"monospace",default:"monospace"}),HEADING_SCALE={1:"3xl",2:"2xl",3:"xl",4:"lg",5:"base",6:"sm"};export const Markdown=({children:e,onLinkPress:t,loading:r=!1,style:s,textStyle:o,testID:l})=>{const n=useTheme(),i=useMemo(()=>createStyles(n),[n]),c=useMemo(()=>parseMarkdown(e??""),[e]),handleLink=e=>{t?t(e):Linking.openURL(e).catch(()=>{})};return r?_jsx(MarkdownSkeleton,{style:s,testID:l}):0===c.length?null:_jsx(View,{style:s,testID:l,children:c.map((e,t)=>_jsx(MarkdownBlock,{block:e,theme:n,styles:i,textStyle:o,onLinkPress:handleLink},`b-${t}`))})};Markdown.displayName="Markdown";const MarkdownBlock=({block:e,theme:t,styles:r,textStyle:s,onLinkPress:o})=>{switch(e.type){case"heading":return _jsx(Text,{accessibilityRole:"header",style:[r.block,{fontSize:t.text[HEADING_SCALE[e.level]].size,fontWeight:t.weight.semibold,color:t.colors["text-body"]},s],children:renderInline(e.children,t,o)});case"paragraph":return _jsx(Text,{style:[r.block,r.body,s],children:renderInline(e.children,t,o)});case"listItem":return _jsxs(View,{style:[r.listRow,{marginLeft:e.depth*t.space.md}],children:[_jsx(Text,{style:[r.body,r.bullet,s],children:e.ordered?`${e.index}.`:"•"}),_jsx(Text,{style:[r.body,r.listText,s],children:renderInline(e.children,t,o)})]});case"quote":return _jsx(View,{style:r.quote,children:_jsx(Text,{style:[r.body,r.quoteText,s],children:renderInline(e.children,t,o)})});case"codeBlock":return _jsx(View,{style:r.codeBlock,children:_jsx(Text,{style:r.codeText,children:e.value})});case"rule":return _jsx(View,{style:r.rule});default:return null}},MarkdownSkeleton=({style:e,testID:t})=>{const r=useTheme();return _jsxs(View,{style:e,testID:t,children:[_jsx(Skeleton,{shape:"text",width:"70%",height:20,style:{marginBottom:r.space.sm}}),_jsx(Skeleton,{shape:"text",width:"100%",height:14,style:{marginBottom:r.space.xs}}),_jsx(Skeleton,{shape:"text",width:"92%",height:14,style:{marginBottom:r.space.xs}}),_jsx(Skeleton,{shape:"text",width:"60%",height:14})]})},createStyles=e=>StyleSheet.create({block:{marginBottom:e.space.sm},body:{fontSize:e.text.base.size,color:e.colors["text-body"],lineHeight:1.5*e.text.base.size},listRow:{flexDirection:"row",marginBottom:e.space.xs},bullet:{width:e.space.lg},listText:{flex:1},quote:{borderLeftWidth:3,borderLeftColor:e.colors["border-subtle"],paddingLeft:e.space.sm,marginBottom:e.space.sm},quoteText:{color:e.colors["text-muted"],fontStyle:"italic"},codeBlock:{backgroundColor:e.colors["bg-subtle"],borderRadius:e.radius.sm,...smoothCorners,padding:e.space.sm,marginBottom:e.space.sm},codeText:{fontFamily:MONO,fontSize:e.text.sm.size,color:e.colors["text-body"]},rule:{height:StyleSheet.hairlineWidth,backgroundColor:e.colors.border,marginVertical:e.space.md}});

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

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

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

@@ -1 +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{AppIcon}from"../AppIcon/index.js";import{Button}from"../Button/index.js";import{Markdown}from"../Markdown/index.js";import{useContextMenu}from"../Menu/useContextMenu.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",copy:"Copy",replyTo:e=>e?`Reply to ${e}`:"Reply"});const 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:o=!1,groupPosition:r="single",author:n,time:i,status:a,replyTo:l,streaming:c=!1,error:u,onRetry:d,actions:m,onCopy:p,onLongPress:b,footer:x,labels:y,haptic:f,style:h,testID:g})=>{const T=useTheme(),j=useMemo(()=>buildStyles(T),[T]),L=y?{...DEFAULT_MESSAGE_BUBBLE_LABELS,...y}:DEFAULT_MESSAGE_BUBBLE_LABELS,_="mine"===e,S="single"===r||"first"===r,B="single"===r||"last"===r,P=null==i?"":formatTime(i),M=("failed"===a||Boolean(u))&&Boolean(d),E=_?L.you:n??"",A=useMemo(()=>{const e=[];return p&&!m?.some(e=>"copy"===e.name)&&e.push({name:"copy",label:L.copy,onPress:()=>p(t)}),m&&e.push(...m),l?.onPress&&e.push({name:"openReply",label:L.replyTo(l.author),onPress:l.onPress}),M&&d&&e.push({name:"retry",label:L.retry,onPress:d}),e},[m,p,t,l,M,d,L]),v=(m?.length??0)>0||Boolean(p),I=useMemo(()=>v?{items:A.map(({name:e,label:t,onPress:s})=>({key:e,label:t,onPress:s}))}:void 0,[v,A]),k=useContextMenu(I,{haptic:f,testID:g}),C=k.hostProps.onLongPress,R=!s||(m?.length??0)>0,w=a&&_?L[a]:"",D=[E,P,t,l?`${L.replyTo(l.author)}: ${l.text}`:"",w].filter(Boolean).join(", "),$=useRef(c);useEffect(()=>{$.current&&!c&&!u&&t&&announce(E?`${E}, ${t}`:t),$.current=c},[c,u,t,E]);const U=useRef(u);useEffect(()=>{u&&u!==U.current&&announce(u,{polite:!1}),U.current=u},[u]);const z=useCallback(e=>{C?.(e),b?.()},[C,b]),H=useCallback(e=>{A.find(t=>t.name===e.nativeEvent.actionName)?.onPress()},[A]),V=T.radius.xl,F=T.radius.sm,O=_?{borderTopRightRadius:S?V:F,borderBottomRightRadius:B?V:F}:{borderTopLeftRadius:S?V:F,borderBottomLeftRadius:B?V:F},G=s??(o?_jsx(Markdown,{children:t}):_jsx(Text,{variant:"body",children:t})),N=l?_jsxs(Pressable,{onPress:l.onPress,disabled:!l.onPress,accessibilityRole:l.onPress?"button":void 0,accessibilityLabel:`${L.replyTo(l.author)}: ${l.text}`,style:j.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,W=[j.bubble,_?j.mine:j.theirs,O],q=R?{accessible:!0,accessibilityLabel:D,accessibilityState:{busy:c},"aria-busy":c,accessibilityActions:A.map(({name:e,label:t})=>({name:e,label:t})),onAccessibilityAction:H}:{accessible:!1},X=v?_jsxs(Pressable,{ref:k.hostRef,...k.hostProps,onLongPress:z,delayLongPress:350,style:W,testID:g?`${g}-bubble`:void 0,...q,children:[N,G]}):_jsxs(View,{style:W,testID:g?`${g}-bubble`:void 0,...q,children:[N,G]}),Y=B&&(""!==P||_&&a);return _jsxs(View,{style:[j.root,_?j.rootMine:j.rootTheirs,{marginTop:S?T.spacing.sm:T.spacing.xxs},h],testID:g,children:[!_&&S&&n?_jsx(Text,{variant:"caption",color:"secondary",style:j.author,numberOfLines:1,importantForAccessibility:R?"no-hide-descendants":"auto",accessibilityElementsHidden:R,children:n}):null,X,k.renderSurface(),Y?_jsxs(View,{style:[j.meta,_?j.metaMine:null],importantForAccessibility:R?"no-hide-descendants":"auto",accessibilityElementsHidden:R,children:[P?_jsx(Text,{variant:"caption",color:"tertiary",children:P}):null,_&&a?_jsx(AppIcon,{name:statusIcon(a),size:14,color:statusColour(T,a),accessibilityLabel:L[a],testID:g?`${g}-status-${a}`:void 0}):null]}):null,u?_jsx(Text,{variant:"bodySmall",color:"error",style:_?j.endText:null,children:u}):null,M?_jsx(Button,{title:L.retry,variant:"link",size:"sm",leftIcon:"refresh-cw",onPress:d,testID:g?`${g}-retry`:void 0}):null,x]})};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;
+"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{AppIcon}from"../AppIcon/index.js";import{Button}from"../Button/index.js";import{Markdown}from"../Markdown/index.js";import{useContextMenu}from"../Menu/useContextMenu.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",copy:"Copy",replyTo:e=>e?`Reply to ${e}`:"Reply"});const 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,s)=>{switch(s){case"read":return e.colors["info-text"];case"failed":return e.colors["danger-text"];default:return e.colors["text-subtle"]}};export const MessageBubble=({side:e,text:s,children:t,markdown:o=!1,groupPosition:r="single",author:n,time:i,status:a,replyTo:l,streaming:c=!1,error:u,onRetry:d,actions:m,onCopy:p,onLongPress:b,footer:x,labels:y,haptic:f,style:h,testID:g})=>{const T=useTheme(),j=useMemo(()=>buildStyles(T),[T]),L=y?{...DEFAULT_MESSAGE_BUBBLE_LABELS,...y}:DEFAULT_MESSAGE_BUBBLE_LABELS,_="mine"===e,S="single"===r||"first"===r,B="single"===r||"last"===r,P=null==i?"":formatTime(i),E=("failed"===a||Boolean(u))&&Boolean(d),M=_?L.you:n??"",A=useMemo(()=>{const e=[];return p&&!m?.some(e=>"copy"===e.name)&&e.push({name:"copy",label:L.copy,onPress:()=>p(s)}),m&&e.push(...m),l?.onPress&&e.push({name:"openReply",label:L.replyTo(l.author),onPress:l.onPress}),E&&d&&e.push({name:"retry",label:L.retry,onPress:d}),e},[m,p,s,l,E,d,L]),v=(m?.length??0)>0||Boolean(p),I=useMemo(()=>v?{items:A.map(({name:e,label:s,onPress:t})=>({key:e,label:s,onPress:t}))}:void 0,[v,A]),C=useContextMenu(I,{haptic:f,testID:g}),R=C.hostProps.onLongPress,k=!t||(m?.length??0)>0,w=a&&_?L[a]:"",D=[M,P,s,l?`${L.replyTo(l.author)}: ${l.text}`:"",w].filter(Boolean).join(", "),$=useRef(c);useEffect(()=>{$.current&&!c&&!u&&s&&announce(M?`${M}, ${s}`:s),$.current=c},[c,u,s,M]);const U=useRef(u);useEffect(()=>{u&&u!==U.current&&announce(u,{polite:!1}),U.current=u},[u]);const z=useCallback(e=>{R?.(e),b?.()},[R,b]),H=useCallback(e=>{A.find(s=>s.name===e.nativeEvent.actionName)?.onPress()},[A]),V=T.radius.xl,F=T.radius.sm,O=_?{borderTopRightRadius:S?V:F,borderBottomRightRadius:B?V:F}:{borderTopLeftRadius:S?V:F,borderBottomLeftRadius:B?V:F},G=t??(o?_jsx(Markdown,{children:s}):_jsx(Text,{variant:"body",children:s})),N=l?_jsxs(Pressable,{onPress:l.onPress,disabled:!l.onPress,accessibilityRole:l.onPress?"button":void 0,accessibilityLabel:`${L.replyTo(l.author)}: ${l.text}`,style:j.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,W=[j.bubble,_?j.mine:j.theirs,O],q=k?{accessible:!0,accessibilityLabel:D,accessibilityState:{busy:c},"aria-busy":c,accessibilityActions:A.map(({name:e,label:s})=>({name:e,label:s})),onAccessibilityAction:H}:{accessible:!1},X=v?_jsxs(Pressable,{ref:C.hostRef,...C.hostProps,onLongPress:z,delayLongPress:350,style:W,testID:g?`${g}-bubble`:void 0,...q,children:[N,G]}):_jsxs(View,{style:W,testID:g?`${g}-bubble`:void 0,...q,children:[N,G]}),Y=B&&(""!==P||_&&a);return _jsxs(View,{style:[j.root,_?j.rootMine:j.rootTheirs,{marginTop:S?T.space.sm:T.space.xxs},h],testID:g,children:[!_&&S&&n?_jsx(Text,{variant:"caption",color:"secondary",style:j.author,numberOfLines:1,importantForAccessibility:k?"no-hide-descendants":"auto",accessibilityElementsHidden:k,children:n}):null,X,C.renderSurface(),Y?_jsxs(View,{style:[j.meta,_?j.metaMine:null],importantForAccessibility:k?"no-hide-descendants":"auto",accessibilityElementsHidden:k,children:[P?_jsx(Text,{variant:"caption",color:"tertiary",children:P}):null,_&&a?_jsx(AppIcon,{name:statusIcon(a),size:14,color:statusColour(T,a),accessibilityLabel:L[a],testID:g?`${g}-status-${a}`:void 0}):null]}):null,u?_jsx(Text,{variant:"bodySmall",color:"danger",style:_?j.endText:null,children:u}):null,E?_jsx(Button,{title:L.retry,variant:"link",size:"sm",leftIcon:"refresh-cw",onPress:d,testID:g?`${g}-retry`:void 0}):null,x]})};const buildStyles=e=>StyleSheet.create({root:{maxWidth:"85%",gap:e.space.xs},rootMine:{alignSelf:"flex-end",alignItems:"flex-end"},rootTheirs:{alignSelf:"flex-start",alignItems:"flex-start"},author:{paddingHorizontal:e.space.md},bubble:{borderRadius:e.radius.xl,...smoothCorners,paddingHorizontal:e.space.md,paddingVertical:e.space.sm,gap:e.space.xs},mine:{backgroundColor:e.colors["primary-soft"]},theirs:{backgroundColor:e.colors["bg-subtle"]},quote:{borderLeftWidth:3,borderLeftColor:e.colors.primary,paddingLeft:e.space.sm,paddingVertical:e.space.xs},meta:{flexDirection:"row",alignItems:"center",gap:e.space.xs,paddingHorizontal:e.space.xs},metaMine:{justifyContent:"flex-end"},endText:{textAlign:"right"}});export default MessageBubble;

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

@@ -1 +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.pill,...smoothCorners,backgroundColor:e.colors.background.elevated,...e.shadows.md},count:{position:"absolute",top:-e.spacing.xs,right:-e.spacing.xs}});export default MessageList;
+"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:s,getDate:n,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=n?e.map(e=>formatDate(n(e))):null,a=s?e.map(s):null,l=void 0===r?-1:e.findIndex(e=>t(e)===r);return e.map((t,s)=>{const r=s===e.length-1,i=null!==o&&(r||o[s]!==o[s+1]),d=null!==a&&!r&&a[s+1]===a[s]&&!i&&s!==l,u=null!==a&&s>0&&a[s-1]===a[s]&&(null===o||o[s-1]===o[s])&&s-1!==l;return{groupPosition:positionOf(d,u),day:i&&n?dayLabel(n(t),{now:y,labels:C}):null,unread:s===l}})},[e,n,s,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 s=e.findIndex(e=>t(e)===o);if(-1===s)return void D(0);const n=e.slice(0,s).reverse();for(const e of n){const t=c?.(e);t&&announce(t)}m&&n.some(m)?V():T.current&&D(e=>e+n.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 s=A[t];return _jsxs(_Fragment,{children:[s?.day?_jsx(DateSeparator,{label:s.day}):null,s?.unread?_jsx(DateSeparator,{label:C.unread,emphasis:!0}):null,o({item:e,index:t,groupPosition:s?.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.space.md,paddingVertical:e.space.sm},grow:{flexGrow:1},fill:{flex:1},older:{paddingVertical:e.space.md},jump:{position:"absolute",right:e.space.md,bottom:e.space.md},jumpDisc:{borderRadius:e.radius.pill,...smoothCorners,backgroundColor:e.colors.surface,...e.shadow.elevated},count:{position:"absolute",top:-e.space.xs,right:-e.space.xs}});export default MessageList;

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

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

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

@@ -1 +1 @@
-"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;
+"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.text.sm.size));return _jsx(View,{style:{transform:[{translateY:Math.round(.4*s)}]},children:_jsx(RNText,{maxFontSizeMultiplier:o.settings.maxFontSizeMultiplier,style:[styles.sub,{fontSize:s,lineHeight:s,color:e??n?.color??o.colors["text-body"],...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;