@webority/mobile-ui 0.104.1 → 0.107.0

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.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;
+"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{warnInvalidValue}from"../../utils/warnInvalidValue.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"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:n="md",tone:i="primary",accessibilityLabel:s,style:a,testID:c}=e;warnInvalidValue("IconBadge","size",e.size,["sm","md","lg"]),warnInvalidValue("IconBadge","tone",e.tone,["primary","success","warning","danger","info","neutral"]),warnInvalidValue("IconBadge","iconVariant",e.iconVariant,["linear","bold","broken","bulk","outline","twotone"]);const l=useTheme(),d=SIZE_MAP[n],m=inkFor(l,i),u="neutral"===i?l.colors["bg-muted"]:tintOf(m,.14,l.colors["bg-muted"]),I={color:m,size:d.icon,disabled:!1},g=void 0!==s;return _jsx(View,{ref:r,testID:c,accessible:g,accessibilityRole:g?"image":void 0,accessibilityLabel:s,importantForAccessibility:g?"yes":"no",style:[styles.base,{width:d.diameter,height:d.diameter,borderRadius:d.diameter/2,...smoothCorners,backgroundColor:u},a],children:renderSlotIcon(o,I,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{hitSlopMarker}from"../../utils/hitSlop.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,HIT_SLOP=6,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.neutral,outline:e.colors.border,on:e.colors["on-neutral"],fg:e.colors.neutral};case"success":return{base:e.colors.success,outline:e.colors.success,on:e.colors["on-success"],fg:e.colors["success-text"]};case"warning":return{base:e.colors.warning,outline:e.colors.warning,on:e.colors["on-warning"],fg:e.colors["warning-text"]};case"danger":return{base:e.colors.danger,outline:e.colors.danger,on:e.colors["on-danger"],fg:e.colors["danger-text"]};case"neutral":return{base:e.colors["bg-muted"],outline:e.colors.border,on:e.colors["text-body"],fg:e.colors["text-body"]};default:return{base:e.colors.primary,outline:e.colors.primary,on:e.colors["on-primary"],fg:e.colors.primary}}},IconButton=forwardRef((e,o)=>{const{icon:s,iconVariant:r,onPress:t,accessibilityLabel:n,tone:i="primary",variant:l="solid",size:c="md",shape:a="circle",active:d=!1,disabled:u=!1,loading:m=!1,haptic:b,style:p,testID:f}=e,g=useTheme(),y=SIZE_MAP[c],I=u||m,{style:h,pressIn:S,pressOut:x}=usePressAnimation({scaleTo:.92,enabled:!I}),{base:j,outline:P,on:_,fg:w}=toneFor(g,i),A=d?"solid":l;let C="transparent",O="transparent",T=0,H=I?g.colors["text-disabled"]:w;"solid"===A?(C=I?g.colors["surface-disabled"]:j,H=I?g.colors["text-disabled"]:_):"soft"===A?C=I?g.colors["surface-disabled"]:tintOf(j,.14,g.colors["bg-subtle"]):"outline"===A?(O=I?g.colors.border:P,T=g.size.border):"glass"===A&&(C=g.colors["glass-fill"],O=g.colors["glass-border"],T=1,H=I?g.colors["text-disabled"]:g.colors["on-glass"]);const L={color:H,size:y.icon,disabled:I},v="circle"===a?y.diameter/2:g.radius.md;return _jsx(Pressable,{ref:o,onPress:e=>{if(I)return;const o=resolveHaptic(b,"selection");o&&triggerHaptic(o),t?.(e)},onPressIn:S,onPressOut:x,disabled:I,accessibilityRole:"button",accessibilityLabel:n,accessibilityState:{disabled:I,selected:d},"aria-disabled":I,"aria-selected":d,hitSlop:6,...hitSlopMarker(6),testID:f,style:({pressed:e})=>[styles.base,{width:y.diameter,height:y.diameter,borderRadius:v,...smoothCorners,backgroundColor:C,borderColor:O,borderWidth:T,opacity:e&&"solid"!==A?.7:1},p],children:_jsx(Animated.View,{style:[styles.content,h],children:m?_jsx(Spinner,{size:"sm",color:H}):renderSlotIcon(s,L,r)})})});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{hitSlopMarker}from"../../utils/hitSlop.js";import{warnInvalidValue}from"../../utils/warnInvalidValue.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,HIT_SLOP=6,SOFT_FILL_OPACITY=.14,SIZE_MAP={sm:{diameter:32,icon:16},md:{diameter:40,icon:20},lg:{diameter:48,icon:24}},toneFor=(o,e)=>{switch(e){case"success":return{base:o.colors.success,outline:o.colors.success,on:o.colors["on-success"],fg:o.colors["success-text"]};case"warning":return{base:o.colors.warning,outline:o.colors.warning,on:o.colors["on-warning"],fg:o.colors["warning-text"]};case"danger":return{base:o.colors.danger,outline:o.colors.danger,on:o.colors["on-danger"],fg:o.colors["danger-text"]};case"info":return{base:o.colors.info,outline:o.colors.info,on:o.colors["on-info"],fg:o.colors["info-text"]};case"neutral":return{base:o.colors["bg-muted"],outline:o.colors.border,on:o.colors["text-body"],fg:o.colors["text-body"]};default:return{base:o.colors.primary,outline:o.colors.primary,on:o.colors["on-primary"],fg:o.colors.primary}}},IconButton=forwardRef((o,e)=>{const{icon:r,iconVariant:s,onPress:t,accessibilityLabel:n,tone:i="primary",variant:a="solid",size:l="md",shape:c="circle",active:d=!1,disabled:u=!1,loading:m=!1,haptic:b,style:p,testID:f}=o;warnInvalidValue("IconButton","tone",o.tone,["primary","success","warning","danger","info","neutral"]),warnInvalidValue("IconButton","variant",o.variant,["solid","soft","outline","ghost","glass"]),warnInvalidValue("IconButton","size",o.size,["sm","md","lg"]),warnInvalidValue("IconButton","shape",o.shape,["circle","rounded"]),warnInvalidValue("IconButton","iconVariant",o.iconVariant,["linear","bold","broken","bulk","outline","twotone"]);const g=useTheme(),I=SIZE_MAP[l],y=u||m,{style:h,pressIn:x,pressOut:S}=usePressAnimation({scaleTo:.92,enabled:!y}),{base:w,outline:j,on:v,fg:P}=toneFor(g,i),V=d?"solid":a;let _="transparent",A="transparent",B=0,C=y?g.colors["text-disabled"]:P;"solid"===V?(_=y?g.colors["surface-disabled"]:w,C=y?g.colors["text-disabled"]:v):"soft"===V?_=y?g.colors["surface-disabled"]:tintOf(w,.14,g.colors["bg-subtle"]):"outline"===V?(A=y?g.colors.border:j,B=g.size.border):"glass"===V&&(_=g.colors["glass-fill"],A=g.colors["glass-border"],B=1,C=y?g.colors["text-disabled"]:g.colors["on-glass"]);const O={color:C,size:I.icon,disabled:y},T="circle"===c?I.diameter/2:g.radius.md;return _jsx(Pressable,{ref:e,onPress:o=>{if(y)return;const e=resolveHaptic(b,"selection");e&&triggerHaptic(e),t?.(o)},onPressIn:x,onPressOut:S,disabled:y,accessibilityRole:"button",accessibilityLabel:n,accessibilityState:{disabled:y,selected:d},"aria-disabled":y,"aria-selected":d,hitSlop:6,...hitSlopMarker(6),testID:f,style:({pressed:o})=>[styles.base,{width:I.diameter,height:I.diameter,borderRadius:T,...smoothCorners,backgroundColor:_,borderColor:A,borderWidth:B,opacity:o&&"solid"!==V?.7:1},p],children:_jsx(Animated.View,{style:[styles.content,h],children:m?_jsx(Spinner,{size:"sm",color:C}):renderSlotIcon(r,O,s)})})});IconButton.displayName="IconButton";const styles=StyleSheet.create({base:{alignItems:"center",justifyContent:"center"},content:{alignItems:"center",justifyContent:"center"}});export{IconButton};export default IconButton;

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

@@ -1 +1 @@
-"use strict";import React,{useCallback,useMemo,useRef,useState}from"react";import{Dimensions,Image,Pressable,Modal as RNModal,StyleSheet,Text,View}from"react-native";import{Gesture,GestureDetector}from"react-native-gesture-handler";import Animated,{runOnJS,useAnimatedStyle,useSharedValue,withSpring,withTiming}from"react-native-reanimated";import{useTheme}from"../../theme/index.js";import{resolveHaptic,triggerHaptic}from"../../utils/index.js";import{smoothCorners}from"../../utils/corners.js";import{hitSlopMarker}from"../../utils/hitSlop.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 m=useTheme(),d=useMemo(()=>buildStyles(m),[m]),[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:d.imageWrap,children:_jsx(Image,{source:t.source,style:d.image,resizeMode:"cover"})})},[l,e.length,v,d]),w=useCallback(e=>_jsx(Image,{source:e.source,style:d.thumbnailImage,resizeMode:"cover"}),[d]),C=_jsxs(View,{style:[d.container,c],testID:h,accessibilityLabel:u??"Image gallery",children:[_jsxs(View,{style:d.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:d.counterPill,pointerEvents:"none",children:_jsx(Text,{style:[d.counterText,{color:m.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,m]=useState(a),d=useCallback(e=>{if(e!==h){const t=resolveHaptic(n,"selection");t&&triggerHaptic(t),m(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:d,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,...hitSlopMarker(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),m=useSharedValue(0),d=useSharedValue(0),g=useSharedValue(0),p=useSharedValue(0),b=useCallback(()=>{c.value=withSpring(1,SPRING_CONFIG),h.value=1,m.value=withSpring(0,SPRING_CONFIG),d.value=withSpring(0,SPRING_CONFIG),g.value=0,p.value=0},[c,h,m,d,g,p]);React.useEffect(()=>{i||(c.value=withTiming(1,{duration:150}),m.value=withTiming(0,{duration:150}),d.value=withTiming(0,{duration:150}),h.value=1,g.value=0,p.value=0)},[i,c,m,d,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),m.value=withSpring(0,SPRING_CONFIG),d.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,m,d,g,p,o,s]),v=useMemo(()=>Gesture.Pan().minPointers(1).maxPointers(1).onStart(()=>{"worklet";g.value=m.value,p.value=d.value}).onUpdate(e=>{"worklet";c.value<=1||(m.value=g.value+e.translationX,d.value=p.value+e.translationY)}).onEnd(()=>{"worklet";g.value=m.value,p.value=d.value}),[c,m,d,g,p]),I=useMemo(()=>Gesture.Tap().numberOfTaps(2).onEnd(()=>{"worklet";runOnJS(S)(),c.value>1?(c.value=withSpring(1,SPRING_CONFIG),m.value=withSpring(0,SPRING_CONFIG),d.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,m,d,g,p,S,n]),y=useMemo(()=>Gesture.Race(x,v,I),[x,v,I]),w=useAnimatedStyle(()=>({transform:[{translateX:m.value},{translateY:d.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;
+"use strict";import React,{useCallback,useMemo,useRef,useState}from"react";import{Dimensions,Image,Pressable,StyleSheet,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{hitSlopMarker}from"../../utils/hitSlop.js";import{defaultIcons}from"../AppIcon/defaultIcons.js";import{Carousel}from"../Carousel/index.js";import{Modal}from"../Modal/Modal.js";import{Skeleton}from"../Skeleton/index.js";import{Text}from"../Text/index.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";export const DEFAULT_IMAGE_GALLERY_LABELS={gallery:"Image gallery",imageOf:(e,t)=>`Image ${e} of ${t}`,openFullscreen:"Tap to open fullscreen",closeGallery:"Close gallery"};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:c,containerStyle:u,testID:m,labels:d})=>{const h=useTheme(),g=useMemo(()=>buildStyles(h),[h]),p=useMemo(()=>({...DEFAULT_IMAGE_GALLERY_LABELS,...d}),[d]),[b,S]=useState(clamp(t,0,Math.max(0,e.length-1))),[v,x]=useState(!1),y=useCallback(e=>{S(e),o?.(e)},[o]),I=useCallback(()=>{if(!i)return;const e=resolveHaptic(n,"selection");e&&triggerHaptic(e),x(!0)},[i,n]),w=useCallback(()=>{const e=resolveHaptic(n,"selection");e&&triggerHaptic(e),x(!1)},[n]),C=useCallback((t,a)=>{const l=t.alt??p.imageOf(a+1,e.length);return _jsx(Pressable,{onPress:I,accessibilityRole:"image",accessibilityLabel:l,accessibilityHint:i?p.openFullscreen:void 0,style:g.imageWrap,children:_jsx(Image,{source:t.source,style:g.image,resizeMode:"cover"})})},[i,e.length,I,g,p]),_=useCallback(e=>_jsx(Image,{source:e.source,style:g.thumbnailImage,resizeMode:"cover"}),[g]),f=_jsxs(View,{style:[g.container,u],testID:m,accessibilityLabel:c??p.gallery,children:[_jsxs(View,{style:g.carouselWrap,accessibilityElementsHidden:v,importantForAccessibility:v?"no-hide-descendants":"auto",children:[_jsx(Carousel,{data:e,defaultIndex:t,onIndexChange:y,renderItem:C,showPagination:!1,showThumbnails:a,renderThumbnail:_,haptic:n}),l&&e.length>0?_jsx(View,{style:g.counterPill,pointerEvents:"none",children:_jsx(Text,{variant:"label",weight:"semibold",style:{color:h.colors["on-scrim"]},accessibilityLabel:p.imageOf(b+1,e.length),children:`${b+1} / ${e.length}`})}):null]}),i?_jsx(Lightbox,{visible:v,images:e,initialIndex:b,enablePinchZoom:s,showCounter:l,onClose:w,onIndexChange:y,haptic:n,labels:p}):null]});return r?_jsx(ImageGallerySkeleton,{images:e,showThumbnails:a,showCounter:l,containerStyle:u,testID:m}):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.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:l,showCounter:i,onClose:s,onIndexChange:o,haptic:n,labels:r})=>{const c=useTheme(),u=useMemo(()=>buildLightboxStyles(c),[c]),m=useRef(null),[d,h]=useState(a),g=useCallback(e=>{if(e!==d){const t=resolveHaptic(n,"selection");t&&triggerHaptic(t),h(e),o(e)}},[d,o,n]),p=useCallback((e,a)=>_jsx(ZoomableImage,{image:e,index:a,total:t.length,active:a===d,enabled:l,maxScale:4,minScale:1,doubleTapScale:2,haptic:n,imageLabel:r.imageOf}),[d,l,t.length,n,r]),b=t[d]?.caption;return _jsx(Modal,{visible:e,onClose:s,presentation:"fullScreen",backdropPressClose:!1,animateMount:!1,contentStyle:{backgroundColor:"transparent"},children:_jsxs(View,{style:u.backdrop,children:[_jsx(Carousel,{ref:m,data:t,defaultIndex:a,onIndexChange:g,renderItem:p,showPagination:!1,haptic:n}),i&&t.length>0?_jsx(View,{style:u.counterPill,pointerEvents:"none",children:_jsx(Text,{variant:"label",weight:"semibold",style:{color:c.colors["on-scrim"]},accessibilityLabel:r.imageOf(d+1,t.length),children:`${d+1} / ${t.length}`})}):null,_jsx(Pressable,{onPress:s,accessibilityRole:"button",accessibilityLabel:r.closeGallery,style:u.closeButton,hitSlop:12,...hitSlopMarker(12),children:(c.settings.icons.close??defaultIcons.close)({size:24,color:c.colors["on-scrim"]})}),b?_jsx(Animated.View,{style:u.captionWrap,entering:void 0,accessibilityElementsHidden:!1,children:_jsx(Text,{variant:"body",align:"center",numberOfLines:3,style:u.captionText,children:b})}):null]})})},ZoomableImage=({image:e,index:t,total:a,active:l,enabled:i,maxScale:s,minScale:o,doubleTapScale:n,haptic:r,imageLabel:c})=>{const u=Dimensions.get("window"),m=useSharedValue(1),d=useSharedValue(1),h=useSharedValue(0),g=useSharedValue(0),p=useSharedValue(0),b=useSharedValue(0),S=useCallback(()=>{m.value=withSpring(1,SPRING_CONFIG),d.value=1,h.value=withSpring(0,SPRING_CONFIG),g.value=withSpring(0,SPRING_CONFIG),p.value=0,b.value=0},[m,d,h,g,p,b]);React.useEffect(()=>{l||(m.value=withTiming(1,{duration:150}),h.value=withTiming(0,{duration:150}),g.value=withTiming(0,{duration:150}),d.value=1,p.value=0,b.value=0)},[l,m,h,g,d,p,b]);const v=useCallback(()=>{!1!==r&&triggerHaptic("impactLight")},[r]),x=useMemo(()=>Gesture.Pinch().enabled(i).onStart(()=>{"worklet";d.value=m.value}).onUpdate(e=>{"worklet";const t=d.value*e.scale;m.value=t<o?o+.3*(t-o):t>s?s+.2*(t-s):t}).onEnd(()=>{"worklet";return m.value<o?(m.value=withSpring(o,SPRING_CONFIG),h.value=withSpring(0,SPRING_CONFIG),g.value=withSpring(0,SPRING_CONFIG),d.value=o,p.value=0,void(b.value=0)):m.value>s?(m.value=withSpring(s,SPRING_CONFIG),void(d.value=s)):void(d.value=m.value)}),[i,m,d,h,g,p,b,o,s]),y=useMemo(()=>Gesture.Pan().minPointers(1).maxPointers(1).onStart(()=>{"worklet";p.value=h.value,b.value=g.value}).onUpdate(e=>{"worklet";m.value<=1||(h.value=p.value+e.translationX,g.value=b.value+e.translationY)}).onEnd(()=>{"worklet";p.value=h.value,b.value=g.value}),[m,h,g,p,b]),I=useMemo(()=>Gesture.Tap().numberOfTaps(2).onEnd(()=>{"worklet";runOnJS(v)(),m.value>1?(m.value=withSpring(1,SPRING_CONFIG),h.value=withSpring(0,SPRING_CONFIG),g.value=withSpring(0,SPRING_CONFIG),d.value=1,p.value=0,b.value=0):(m.value=withSpring(n,SPRING_CONFIG),d.value=n)}),[m,d,h,g,p,b,v,n]),w=useMemo(()=>Gesture.Race(x,y,I),[x,y,I]),C=useAnimatedStyle(()=>({transform:[{translateX:h.value},{translateY:g.value},{scale:m.value}]}));React.useEffect(()=>{l||S()},[l,S]);const _=e.alt??c(t+1,a);return _jsx(GestureDetector,{gesture:w,children:_jsx(Animated.View,{style:[lightboxImageStyles.container,{width:u.width}],children:_jsx(Animated.Image,{source:e.source,resizeMode:"contain",style:[lightboxImageStyles.image,C],accessibilityLabel:_,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)"}}),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)"},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",lineHeight:21}}),lightboxImageStyles=StyleSheet.create({container:{flex:1,alignItems:"center",justifyContent:"center"},image:{width:"100%",height:"100%"}});export{ImageGallery};export default ImageGallery;

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

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

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{hitSlopMarker}from"../../utils/hitSlop.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:r,getOptionIcon:a,value:n,onChange:c,placeholder:d,label:p,title:b,searchable:S=!1,haptic:u,disabled:m=!1,size:x="md",color:f,chevronColor:h,chevronSize:g,textStyle:y,style:O,optionStyle:j,selectedOptionStyle:C,optionTextStyle:v,selectedOptionTextStyle:F,accessibilityLabel:k,testID:_}=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=>r?r(e):e.description,[r]),M=useCallback(e=>a?a(e):e.icon,[a]),[P,V]=useState(!1),B=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),V(!0)},[m,u]),N=useCallback(()=>{V(!1)},[]),G=useCallback(e=>{if(w(e))return;const t=resolveHaptic(u,"selection");t&&triggerHaptic(t),c(H(e)),N()},[w,H,c,N,u]),q=m?I.colors["text-disabled"]:f??I.colors.primary,A=void 0!==B?L(B):d??"Select",E=void 0!==B?`Selected: ${L(B)}`:d??"No selection",J=k??`${p??b??"Select"}. ${E}`,K=_jsxs(Pressable,{ref:t,onPress:$,disabled:m,hitSlop:8,...hitSlopMarker(8),accessibilityRole:"button",accessibilityLabel:J,accessibilityState:{disabled:m,expanded:P},"aria-disabled":m,"aria-expanded":P,testID:_,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:h??q,size:g??z.icon,open:P})]});return _jsxs(_Fragment,{children:[p?_jsxs(View,{style:T.labelled,children:[_jsx(FieldLabel,{size:x,children:p}),K]}):K,_jsx(OptionSheet,{open:P,onClose:N,title:b,accessibilityLabel:p??b??d??"Options",options:l,labelOf:L,getValue:H,disabledOf:w,descriptionOf:D,iconOf:M,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{hitSlopMarker}from"../../utils/hitSlop.js";import{warnInvalidValue}from"../../utils/warnInvalidValue.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";export const DEFAULT_INLINE_SELECT_LABELS={select:"Select",options:"Options",noSelection:"No selection",selected:e=>`Selected: ${e}`};const InlineSelect=forwardRef((e,t)=>{const{options:i,getOptionLabel:l,getOptionValue:s,isOptionDisabled:o,getOptionDescription:n,getOptionIcon:a,value:r,onChange:c,placeholder:p,labels:d,label:b,title:u,searchable:S=!1,haptic:m,disabled:x=!1,size:g="md",color:h,chevronColor:f,chevronSize:y,textStyle:O,style:j,optionStyle:v,selectedOptionStyle:I,optionTextStyle:C,selectedOptionTextStyle:L,accessibilityLabel:_,testID:F}=e,T=useTheme(),k=Object.keys(T.components.field);warnInvalidValue("InlineSelect","size",e.size,k);const E=useMemo(()=>buildStyles(T),[T]),z=k.includes(g)?g:"md",D=resolveFieldSize(T,z),w=useMemo(()=>({...DEFAULT_INLINE_SELECT_LABELS,...d}),[d]),V=useCallback(e=>l?l(e):e.label??"",[l]),H=useCallback(e=>s?s(e):e.value,[s]),M=useCallback(e=>o?o(e):!0===e.disabled,[o]),N=useCallback(e=>n?n(e):e.description,[n]),B=useCallback(e=>a?a(e):e.icon,[a]),[A,P]=useState(!1),R=useMemo(()=>{if(null!=r)return i.find(e=>H(e)===r)},[i,r,H]),$=useCallback(()=>{if(x)return;const e=resolveHaptic(m,"selection");e&&triggerHaptic(e),P(!0)},[x,m]),U=useCallback(()=>{P(!1)},[]),G=useCallback(e=>{if(M(e))return;const t=resolveHaptic(m,"selection");t&&triggerHaptic(t),c(H(e)),U()},[M,H,c,U,m]),q=x?T.colors["text-disabled"]:h??T.colors.primary,J=void 0!==R?V(R):p??w.select,K=void 0!==R?w.selected(V(R)):p??w.noSelection,Q=_??`${b??u??w.select}. ${K}`,W=_jsxs(Pressable,{ref:t,onPress:$,disabled:x,hitSlop:8,...hitSlopMarker(8),accessibilityRole:"button",accessibilityLabel:Q,accessibilityState:{disabled:x,expanded:A},"aria-disabled":x,"aria-expanded":A,testID:F,style:({pressed:e})=>[E.trigger,{columnGap:T.space.xs,opacity:e&&!x?.6:1},j],children:[_jsx(Text,{style:[E.triggerText,{color:q,fontSize:D.text,...fontFor(T,"medium")},O],numberOfLines:1,children:J}),_jsx(Chevron,{color:f??q,size:y??D.icon,open:A})]});return _jsxs(_Fragment,{children:[b?_jsxs(View,{style:E.labelled,children:[_jsx(FieldLabel,{size:z,children:b}),W]}):W,_jsx(OptionSheet,{visible:A,onClose:U,haptic:m,title:u,accessibilityLabel:b??u??p??w.options,options:i,getOptionLabel:V,getOptionValue:H,isOptionDisabled:M,getOptionDescription:N,getOptionIcon:B,value:r,onChange:(e,t)=>G(t),searchable:S,optionStyle:v,selectedOptionStyle:I,optionTextStyle:C,selectedOptionTextStyle:L})]})});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/InlineSelect/index.js

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

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

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

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{hitSlopMarker}from"../../utils/hitSlop.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,...hitSlopMarker(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,...hitSlopMarker(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{useMemo}from"react";import{Pressable,StyleSheet,View}from"react-native";import{KeyboardController,KeyboardStickyView,useKeyboardState}from"react-native-keyboard-controller";import{useTheme}from"../../theme/index.js";import{hitSlopMarker}from"../../utils/hitSlop.js";import{Text}from"../Text/index.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";export const DEFAULT_KEYBOARD_TOOLBAR_LABELS={done:"Done",previous:"Previous field",next:"Next field"};const NavButton=({label:e,accessibilityLabel:o,onPress:t,theme:s})=>_jsx(Pressable,{onPress:t,accessibilityRole:"button",accessibilityLabel:o,hitSlop:8,...hitSlopMarker(8),style:{paddingHorizontal:s.space.sm},children:_jsx(Text,{variant:"body",weight:"semibold",size:"lg",color:"link",children:e})}),KeyboardToolbar=e=>{const{showNavigation:o=!0,onDone:t,onNext:s,onPrev:r,labels:i,leading:l,style:a,testID:n}=e,c=useTheme(),b=useKeyboardState(e=>e.isVisible),d=useMemo(()=>({...DEFAULT_KEYBOARD_TOOLBAR_LABELS,...i}),[i]);if(!b)return null;const y=t??(()=>{KeyboardController.dismiss()}),h=r??(()=>KeyboardController.setFocusTo("prev")),x=s??(()=>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:[o?_jsxs(View,{style:styles.nav,children:[_jsx(NavButton,{label:"‹",accessibilityLabel:d.previous,onPress:h,theme:c}),_jsx(NavButton,{label:"›",accessibilityLabel:d.next,onPress:x,theme:c})]}):_jsx(View,{}),l,_jsx(View,{style:styles.spacer}),_jsx(Pressable,{onPress:y,accessibilityRole:"button",accessibilityLabel:d.done,hitSlop:8,...hitSlopMarker(8),children:_jsx(Text,{variant:"body",weight:"semibold",color:"link",children:d.done})})]})})},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/KeyboardToolbar/index.js

@@ -1 +1 @@
-"use strict";export{KeyboardToolbar}from"./KeyboardToolbar.js";
+"use strict";export{DEFAULT_KEYBOARD_TOOLBAR_LABELS,KeyboardToolbar}from"./KeyboardToolbar.js";

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.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(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})=>[A,e?W.pressed:null],...G.hostProps,children:_jsx(Animated.View,{style:J,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;
+"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{warnInvalidValue}from"../../utils/warnInvalidValue.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 i=useTheme(),s=resolveCheckboxSize(i,"md")["box-size"],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.size.border,borderRadius:i.radius.sm,...smoothCorners,borderColor:e?i.colors.primary:i.colors.border,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["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,label:e.label,onPress:e.onPress},e.label)):e,ListItem=React.memo(forwardRef((e,t)=>{const{title:i,loading:s=!1,subtitle:o,description:l,children:r,titleLines:n=1,subtitleLines:a=1,left:c,icon:d,iconTone:m="primary",right:h,rightPlacement:u="auto",selectable:p=!1,checked:x=!1,onCheckedChange:g,actions:b,onPress:f,haptic:y,selected:j=!1,disabled:S=!1,size:w="md",divider:I=!1,chevron:_=!1,leftActions:v,rightActions:L,contextMenu:k,accessibilityLabel:V,accessibilityHint:C,style:A,containerStyle:R,titleStyle:z,subtitleStyle:B,descriptionStyle:P,leftSlotStyle:T,rightSlotStyle:D,testID:F}=e;warnInvalidValue("ListItem","size",e.size,["sm","md","lg"]),warnInvalidValue("ListItem","iconTone",e.iconTone,["primary","success","warning","danger","info","neutral"]),warnInvalidValue("ListItem","rightPlacement",e.rightPlacement,["auto","side","below"]);const 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:F}),N=useMemo(()=>mergeRefs(t,G.hostRef),[t,G.hostRef]),Z=p||!!f,U=Z||G.enabled,q=U&&!S,{style:J,pressIn:K,pressOut:Q}=usePressAnimation({enabled:q}),X=useFlickGuard(),Y=V??("string"==typeof i?i:void 0),isText=e=>"string"==typeof e||"number"==typeof e,$=c??(void 0===d?null:_jsx(IconBadge,{icon:d,tone:m,size:BADGE_SIZE[w]})),ee=p?_jsxs(View,{style:W.selectionLead,children:[_jsx(SelectionBox,{checked:x,disabled:S}),$?_jsx(View,{style:W.selectionLeadContent,children:$}):null]}):$,te=null!=b&&!1!==b&&!(Array.isArray(b)&&0===b.length),ie=I&&!te,se=_jsxs(View,{style:[W.row,{paddingVertical:M["padding-y"],minHeight:M["min-height"],backgroundColor:j?H.colors["surface-selected"]:"transparent"},ie?W.divider:null,S?W.disabled:null,R],children:[ee?_jsx(View,{style:[W.leftSlot,T],children:ee}):null,_jsxs(View,{style:W.middle,children:[null==i||isText(i)?_jsx(Text,{style:[W.title,{fontSize:M["title-text"],...fontFor(H,"medium"),color:S?H.colors["text-disabled"]:H.colors["text-body"]},z],numberOfLines:n,children:i??" "}):i,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"]},B],numberOfLines:a,children:o}):o,l?_jsx(Text,{style:[W.description,{fontSize:M["subtitle-text"],color:S?H.colors["text-disabled"]:H.colors["text-subtle"]},P],numberOfLines:2,children:l}):null,null!=r&&!1!==r?_jsx(View,{style:W.body,children:r}):null,O?_jsx(View,{style:[W.rightBelow,D],children:h}):null]}),h&&!O||_?_jsxs(View,{style:[W.rightSlot,O?null:D],children:[O?null:h,_?_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(Pressable,{ref:N,onPress:e=>{q&&Z&&!X.isFlick(e)&&(y&&triggerHaptic(y),p?g?.(!x):f?.(e))},onPressIn:e=>{X.onPressIn(e),K()},onPressOut:Q,disabled:!q,accessibilityRole:p?"checkbox":f?"button":void 0,accessibilityLabel:Y,accessibilityHint:C,accessibilityState:p?{checked:x,disabled:!q}:{selected:j,disabled:!q},"aria-disabled":!q,...p?{"aria-checked":x}:{"aria-selected":j},testID:F,android_ripple:{color:H.colors["surface-pressed"],borderless:!1},style:({pressed:e})=>[A,e?W.pressed:null],...G.hostProps,children:_jsx(Animated.View,{style:J,children:se})}):_jsx(View,{ref:t,accessibilityRole:"none",accessibilityLabel:Y,accessibilityHint:C,accessibilityState:{selected:j,disabled:S},"aria-selected":j,"aria-disabled":S,testID:F,style:A,children:se}),le=v&&v.length>0||L&&L.length>0,re=te?_jsxs(View,{style:[j?{backgroundColor:H.colors["surface-selected"]}:null,I?W.divider:null],children:[oe,_jsx(View,{style:W.actions,children:renderActions(b)})]}):oe,ne=le?_jsx(Swipeable,{leftActions:v,rightActions:L,accessibilityLabel:Y,children:re}):re;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:l,size:r="md",containerStyle:n,style:a})=>{const c=useTheme(),d=resolveListItemSize(c,r),m=Math.round(1.15*d["title-text"]),h=Math.round(1.15*d["subtitle-text"]);return _jsxs(View,{style:[{flexDirection:"row",alignItems:"center",paddingHorizontal:c.space.md,paddingVertical:d["padding-y"],minHeight:d["min-height"]},n,a],children:[void 0!==i||void 0!==s?_jsx(View,{style:{marginRight:c.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:c.space.xs}}),void 0!==e?_jsx(Skeleton,{shape:"text",width:"50%",height:h,style:void 0!==t?{marginBottom:c.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:c.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("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}});
+"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 DEFAULT_LOADER_OVERLAY_LABELS={loading:"Loading"};export const LoaderOverlay=({renderIndicator:e,backdropColor:t,showDelayMs:s=150,minVisibleMs:r=400,labels:n,testID:i})=>{const o=useTheme(),a=usePresenceMotion().duration("default"),u=useSyncExternalStore(subscribe,getState),[l,c]=useState(!1),f=useRef(null),m=useRef(null),d=useRef(null),y=useRef(createAnimatedValue(0)).current,b=u.refCount>0;useEffect(()=>{if(b)return null!==m.current&&(clearTimeout(m.current),m.current=null),void(l||null!==f.current||(f.current=setTimeout(()=>{f.current=null,0!==getState().refCount&&(d.current=Date.now(),c(!0))},s)));if(null!==f.current&&(clearTimeout(f.current),f.current=null),l&&null===m.current){const e=null!==d.current?Date.now()-d.current:r,t=Math.max(0,r-e);m.current=setTimeout(()=>{m.current=null,d.current=null,c(!1)},t)}},[b,l,s,r]),useEffect(()=>()=>{null!==f.current&&clearTimeout(f.current),null!==m.current&&clearTimeout(m.current)},[]),useEffect(()=>{l?Animated.timing(y,{toValue:1,duration:a,easing:Easing.bezier(...o.motion.ease["in-out"]),useNativeDriver:!0}).start():y.setValue(0)},[l,a,y,o]),useEffect(()=>{if(!l)return;const e=BackHandler.addEventListener("hardwareBackPress",()=>!0);return()=>{e.remove()}},[l]);const S=u.message;useEffect(()=>{l&&S&&AccessibilityInfo.announceForAccessibility(S)},[l,S]);const g=useMemo(()=>buildStyles(),[]),E=useMemo(()=>({...DEFAULT_LOADER_OVERLAY_LABELS,...n}),[n]);return l?_jsx(Animated.View,{pointerEvents:"auto",testID:i,accessible:!0,accessibilityViewIsModal:!0,accessibilityLiveRegion:"polite",accessibilityLabel:S??E.loading,accessibilityRole:"progressbar",accessibilityState:{busy:!0},"aria-busy":!0,style:[g.overlay,{backgroundColor:t??o.colors.scrim,opacity:y}],children:e?e(S):_jsx(Spinner,{size:"lg",message:S})}):null};const buildStyles=()=>StyleSheet.create({overlay:{...StyleSheet.absoluteFill,alignItems:"center",justifyContent:"center",zIndex:1e3}});

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

@@ -1 +1 @@
-"use strict";export{LoaderOverlay,loader,useLoader}from"./LoaderOverlay.js";
+"use strict";export{DEFAULT_LOADER_OVERLAY_LABELS,LoaderOverlay,loader,useLoader}from"./LoaderOverlay.js";

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

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

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(),_=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}});
+"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,labels:f,testID:h}=e,y=useTheme(),x=useMemo(()=>buildStyles(y),[y]),_=useSafeAreaInsets(),[g,v]=useModalInsets(),w=useMemo(()=>({..._,top:g.top,bottom:g.bottom}),[_,g]),j=useWindowDimensions(),A=usePresenceMotion(),I=A.duration("fast"),k=useMemo(()=>visibleGroups(o,a),[o,a]),S=useMemo(()=>visibleTopActions(r,a),[r,a]),E="sheet"===l||"auto"===l&&j.width<Breakpoints.lg&&wantsSheet(k,S),[C,M]=useState(null),[T,R]=useState(null),D=useRef(d);D.current=d;const O=useRef(m);O.current=m;const P=useRef(null),L=useRef(!1),H=useRef(!1),V=useRef(new Map),B=useRef(null),N=useCallback(()=>{if(!L.current)return;L.current=!1;const e=P.current;P.current=null,e?e():focusHost(O.current?.())},[]);useEffect(()=>{if(s)return H.current=!0,L.current=!1,P.current=null,claimAnchoredSurface(()=>D.current());H.current&&(H.current=!1,L.current=!0,M(null),R(null),E||"ios"===Platform.OS||N())},[s]);const F=useCallback(e=>{if(e.disabled)return;const s=resolveHaptic(p,"selection");s&&triggerHaptic(s),e.key!==BACK_KEY?e.submenu?M(e):(P.current=e.onPress??null,D.current()):M(null)},[p]),K=useMemo(()=>({width:j.width,height:j.height,insets:w}),[j.width,j.height,w]),W=useMemo(()=>{if(!t||!T)return null;const e=t.x+t.width/2>K.width/2?"end":"start";return computePlacement(t,T,K,n,{align:e})},[t,T,K,n]);let G=K.height-w.top-w.bottom-2*PLACEMENT_MARGIN;if(t&&W){const e=placementRoom(t,K);G="top"===W.placement?e.above:e.below}const z=Math.min(280,K.width-w.left-w.right-2*PLACEMENT_MARGIN),$=s&&null!==W,Y=useRef(createAnimatedValue(0)).current,U=useRef(createAnimatedValue(1)).current;useEffect(()=>{if(!$)return setNativeValue(Y,0),void setNativeValue(U,1);const e=[Animated.timing(Y,{toValue:1,duration:I,easing:Easing.bezier(...y.motion.ease.decelerate),useNativeDriver:!0})];c&&!A.reduced&&e.push(Animated.spring(U,{toValue:1.02,damping:y.motion.spring.snappy.damping,stiffness:y.motion.spring.snappy.stiffness,mass:y.motion.spring.snappy.mass,useNativeDriver:!0}));const s=Animated.parallel(e);return s.start(),()=>s.stop()},[$,c,A.reduced,Y,U,y.motion,I]);const X=useCallback(e=>{const{width:s,height:t}=e.nativeEvent.layout;R(e=>e&&e.width===s&&e.height===t?e:{width:s,height:t})},[]),q=c&&"top"===W?.placement,Z=C?.submenu?[C.submenu]:k,J=q?[...Z].reverse().map(e=>[...e].reverse()):Z,Q=[];if(C)Q.push({key:BACK_KEY,label:C.label});else for(const e of S)Q.push({key:`${TOP_PREFIX}${e.key}`,label:e.label,item:e});for(const e of J)for(const s of e)Q.push({key:s.key,label:s.label,item:s});const ee=Q[0]?.key;useEffect(()=>{if(!$||E||!ee)return;const e=setTimeout(()=>focusHost(V.current.get(ee)),FOCUS_DELAY_MS);return()=>clearTimeout(e)},[$,E,ee]);const setItemRef=e=>s=>{s?V.current.set(e,s):V.current.delete(e)},se=webOnly({onKeyDown:e=>{const s=e.key??e.nativeEvent?.key??"",t=Q.length,o=Q.findIndex(e=>e.key===B.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&&C)return e.preventDefault?.(),void M(null);if("ArrowRight"===s&&Q[o]?.item?.submenu)return e.preventDefault?.(),void F(Q[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(Q[r].label.toLowerCase().startsWith(e)){i=r;break}}}}i>=0&&(e.preventDefault?.(),(e=>{const s=Q[e];s&&focusHost(V.current.get(s.key))})(i))}});if(E){const e=C?.submenu?[{key:BACK_KEY,label:f.back,icon:"chevron-left"},...C.submenu]:[...S,...k.flat()],t=[...new Set(e.filter(e=>e.checked).map(e=>e.key))];return _jsx(OptionSheet,{visible:s,onClose:d,onAfterClose:N,title:C?.label??i,options:e,getOptionLabel:e=>e.label,getOptionValue:e=>e.key,isOptionDisabled:e=>Boolean(e.disabled),destructiveOf:e=>Boolean(e.destructive),getOptionDescription:e=>e.description,getOptionIcon:e=>{const s=e;return renderSlotIcon(s.icon,{color:s.destructive?y.colors["danger-text"]:y.colors["text-muted"],size:20,disabled:Boolean(s.disabled)})},value:t,onChange:(e,s)=>F(s),accessibilityLabel:b??i,testID:h?`${h}-sheet`:void 0})}const inkFor=e=>e.disabled?y.colors["text-disabled"]:e.destructive?y.colors["danger-text"]:y.colors["text-body"],inkRoleFor=e=>e.disabled?"disabled":e.destructive?"danger":"primary",te=_jsxs(_Fragment,C?{children:[_jsxs(Pressable,{ref:setItemRef(BACK_KEY),onPress:()=>M(null),onFocus:()=>{B.current=BACK_KEY},accessibilityRole:"menuitem",accessibilityLabel:`${f.back}, ${C.label}`,android_ripple:{color:y.colors["surface-pressed"],borderless:!1},style:({pressed:e})=>[x.row,e?x.pressed:null],children:[_jsx(View,{style:x.icon,children:_jsx(AppIcon,{name:"chevron-left",size:20,color:y.colors["text-muted"]})}),_jsx(Text,{variant:"body",weight:"semibold",numberOfLines:1,style:x.labels,children:C.label})]}),_jsx(Divider,{spacing:"none"})]}:{children:[i?_jsx(Text,{variant:"caption",color:"secondary",accessibilityRole:"header",numberOfLines:2,style:x.title,children:i}):null,S.length>0?_jsxs(_Fragment,{children:[_jsx(View,{style:x.topRow,children:S.map(e=>{const s=`${TOP_PREFIX}${e.key}`,t=Boolean(e.disabled),o=inkFor(e);return _jsxs(Pressable,{ref:setItemRef(s),onPress:()=>F(e),onFocus:()=>{B.current=s},disabled:t,accessibilityRole:"menuitem",accessibilityLabel:e.accessibilityLabel??e.label,accessibilityState:{disabled:t},"aria-disabled":t,testID:e.testID,style:({pressed:e})=>[x.topAction,e?x.pressed:null],children:[renderSlotIcon(e.icon,{color:o,size:20,disabled:t}),_jsx(Text,{variant:"caption",color:inkRoleFor(e),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:N,children:_jsxs(ModalSafeArea,{onInsets:v,children:[_jsx(Pressable,{style:[StyleSheet.absoluteFill,c?x.scrim:null],onPress:d,accessibilityRole:"button",accessibilityLabel:f.close,testID:h?`${h}-scrim`:void 0}),c&&u&&t?_jsx(Animated.View,{pointerEvents:"none",accessibilityElementsHidden:!0,importantForAccessibility:"no-hide-descendants",style:[x.preview,{left:t.x,top:t.y,width:t.width,height:t.height,transform:[{scale:U}]}],children:u}):null,_jsx(Animated.View,{accessibilityRole:"menu",accessibilityLabel:C?.label??b??i,onLayout:X,testID:h?`${h}-menu`:void 0,...se,style:[x.anchored,{left:W?.x??0,top:W?.y??0,maxWidth:z,opacity:$?Y:0}],children:_jsx(View,{style:x.surface,children:_jsxs(View,{style:[x.clip,{maxHeight:G}],children:[te,_jsx(ScrollView,{style:x.scroll,bounces:!1,keyboardShouldPersistTaps:"handled",children:J.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:()=>F(e),onFocus:()=>{B.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:y.colors["surface-pressed"],borderless:!1},testID:e.testID,style:({pressed:e})=>[x.row,e?x.pressed:null],children:[s?_jsx(View,{style:x.icon,children:renderSlotIcon(e.icon,{color:o,size:20,disabled:t})}):null,_jsxs(View,{style:x.labels,children:[_jsx(Text,{variant:"body",color:inkRoleFor(e),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:y.colors.primary}):null,e.submenu?_jsx(AppIcon,{name:"chevron-right",size:20,color:y.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/Menu/index.js

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

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

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

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

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

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,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;
+"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{warnInvalidValue}from"../../utils/warnInvalidValue.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:b,onLongPress:p,footer:x,labels:f,haptic:y,style:h,testID:g})=>{warnInvalidValue("MessageBubble","side",e,["mine","theirs"]),warnInvalidValue("MessageBubble","groupPosition",r,["single","first","middle","last"]),warnInvalidValue("MessageBubble","status",a,["sending","sent","delivered","read","failed"]);const j=useTheme(),T=useMemo(()=>buildStyles(j),[j]),L=f?{...DEFAULT_MESSAGE_BUBBLE_LABELS,...f}:DEFAULT_MESSAGE_BUBBLE_LABELS,_="mine"===e,B="single"===r||"first"===r,S="single"===r||"last"===r,v=null==i?"":formatTime(i),M=("failed"===a||Boolean(u))&&Boolean(d),P=_?L.you:n??"",I=useMemo(()=>{const e=[];return b&&!m?.some(e=>"copy"===e.name)&&e.push({name:"copy",label:L.copy,onPress:()=>b(s)}),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,b,s,l,M,d,L]),E=(m?.length??0)>0||Boolean(b),A=useMemo(()=>E?{items:I.map(({name:e,label:s,onPress:t})=>({key:e,label:s,onPress:t}))}:void 0,[E,I]),w=useContextMenu(A,{haptic:y,testID:g}),C=w.hostProps.onLongPress,R=!t||(m?.length??0)>0,k=a&&_?L[a]:"",D=[P,v,s,l?`${L.replyTo(l.author)}: ${l.text}`:"",k].filter(Boolean).join(", "),$=useRef(c);useEffect(()=>{$.current&&!c&&!u&&s&&announce(P?`${P}, ${s}`:s),$.current=c},[c,u,s,P]);const V=useRef(u);useEffect(()=>{u&&u!==V.current&&announce(u,{polite:!1}),V.current=u},[u]);const U=useCallback(e=>{C?.(e),p?.()},[C,p]),z=useCallback(e=>{I.find(s=>s.name===e.nativeEvent.actionName)?.onPress()},[I]),H=j.radius.xl,F=j.radius.sm,O=_?{borderTopRightRadius:B?H:F,borderBottomRightRadius:S?H:F}:{borderTopLeftRadius:B?H:F,borderBottomLeftRadius:S?H: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:T.quote,children:[l.author?_jsx(Text,{variant:"caption",weight:"semibold",color:"link",numberOfLines:1,children:l.author}):null,_jsx(Text,{variant:"bodySmall",color:"secondary",numberOfLines:2,children:l.text})]}):null,W=[T.bubble,_?T.mine:T.theirs,O],q=R?{accessible:!0,accessibilityLabel:D,accessibilityState:{busy:c},"aria-busy":c,accessibilityActions:I.map(({name:e,label:s})=>({name:e,label:s})),onAccessibilityAction:z}:{accessible:!1},X=E?_jsxs(Pressable,{ref:w.hostRef,...w.hostProps,onLongPress:U,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=S&&(""!==v||_&&a);return _jsxs(View,{style:[T.root,_?T.rootMine:T.rootTheirs,{marginTop:B?j.space.sm:j.space.xxs},h],testID:g,children:[!_&&B&&n?_jsx(Text,{variant:"caption",color:"secondary",style:T.author,numberOfLines:1,importantForAccessibility:R?"no-hide-descendants":"auto",accessibilityElementsHidden:R,children:n}):null,X,w.renderSurface(),Y?_jsxs(View,{style:[T.meta,_?T.metaMine:null],importantForAccessibility:R?"no-hide-descendants":"auto",accessibilityElementsHidden:R,children:[v?_jsx(Text,{variant:"caption",color:"tertiary",children:v}):null,_&&a?_jsx(AppIcon,{name:statusIcon(a),size:14,color:statusColour(j,a),accessibilityLabel:L[a],testID:g?`${g}-status-${a}`:void 0}):null]}):null,u?_jsx(Text,{variant:"bodySmall",color:"danger",style:_?T.endText:null,children:u}):null,M?_jsx(Button,{label: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/Modal/Modal.js

@@ -1 +1 @@
-"use strict";import{forwardRef,useCallback,useEffect,useMemo,useRef,useState}from"react";import{AccessibilityInfo,Animated,Dimensions,Easing,Keyboard,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:r,presentation:i="centered",backdropOpacity:o,backdropPressClose:a=!0,animationDuration:n,animateMount:l=!0,accessibilityLabel:u,hardwareBackPress:c=!0,children:d,contentStyle:m,backdropStyle:f,restoreFocusRef:p,onDismissed:g,haptic:b,testID:h}=e,S=useTheme(),y=usePresenceMotion(),[A,v]=useModalInsets(),x=n??y.duration("default"),M=Dimensions.get("window").height,R=useRef(!l&&s),C=R.current,V=useRef(createAnimatedValue(C?1:.9)).current,j=useRef(createAnimatedValue(C?1:0)).current,w=useRef(createAnimatedValue(C?0:M)).current,T=useRef(createAnimatedValue(C?1:0)).current,D=useRef(null),_=useRef(!1),[E,k]=useState(s),I=useMemo(()=>buildStyles(S),[S]),N=useMemo(()=>{const e=S.colors.scrim;return"number"!=typeof o?e:withAlpha(e,o)??e},[S.colors.scrim,o]),q=useMemo(()=>T.interpolate({inputRange:[0,1],outputRange:[transparentOf(N),N]}),[T,N]);useEffect(()=>{s&&(Keyboard.dismiss(),k(!0))},[s]),useEffect(()=>{const e=[];if(s&&E&&R.current)R.current=!1;else if(s&&E){const t=Animated.timing(T,{toValue:1,duration:y.duration("default"),useNativeDriver:!1});if(t.start(),e.push(t),y.reduced){j.setValue(0),w.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(w,{toValue:0,damping:S.motion.spring.gentle.damping,stiffness:S.motion.spring.gentle.stiffness,mass:S.motion.spring.gentle.mass,useNativeDriver:!0});t.start(),e.push(t)}else{const t=Animated.parallel([Animated.spring(V,{toValue:1,damping:S.motion.spring.gentle.damping,stiffness:S.motion.spring.gentle.stiffness,mass:S.motion.spring.gentle.mass,useNativeDriver:!0}),Animated.timing(j,{toValue:1,duration:x,useNativeDriver:!0})]);t.start(),e.push(t)}}else if(E){const t=y.duration("fast"),s=Easing.bezier(...S.motion.ease.accelerate),r=Animated.timing(j,{toValue:0,duration:t,easing:s,useNativeDriver:!0}),o=y.reduced?r:"bottom"===i?Animated.timing(w,{toValue:M,duration:t,easing:s,useNativeDriver:!0}):Animated.parallel([Animated.timing(V,{toValue:.9,duration:t,easing:s,useNativeDriver:!0}),r]),a=Animated.parallel([o,Animated.timing(T,{toValue:0,duration:y.duration("default"),useNativeDriver:!1})]);a.start(({finished:e})=>{e&&(w.setValue(M),k(!1))}),e.push(a)}return()=>e.forEach(e=>{e.stop()})},[s,E,i,x,V,j,T,w,M,S.motion.spring.gentle.damping,S.motion.spring.gentle.stiffness,S.motion.spring.gentle.mass,y,S.motion.ease.accelerate]),useEffect(()=>{if("web"===Platform.OS)return;let e,t;return s?(e=setTimeout(()=>{D.current&&AccessibilityInfo.sendAccessibilityEvent(D.current,"focus")},150),_.current=!0):_.current&&(_.current=!1,p?.current&&(t=setTimeout(()=>{const e=p.current;e&&AccessibilityInfo.sendAccessibilityEvent(e,"focus")},x))),()=>{e&&clearTimeout(e),t&&clearTimeout(t)}},[s,x,p]);const P=useRef(!1);useEffect(()=>{if(s)return void(P.current=!0);if(!P.current)return;if(P.current=!1,!g)return;const e=setTimeout(g,300);return()=>clearTimeout(e)},[s,g]);const z=useCallback(()=>{if(!a)return;const e=resolveHaptic(b,"selection");e&&triggerHaptic(e),r()},[a,r,b]),H=useCallback(()=>{c&&r()},[c,r]),L=useSquircle("bottom"!==i&&"fullScreen"!==i,S.radius.xl),F=useMemo(()=>"fullScreen"===i?[I.fullScreenContent,{backgroundColor:S.colors.surface}]:"bottom"===i?[I.bottomContent,{backgroundColor:S.colors.surface,borderTopLeftRadius:S.radius.xl,borderTopRightRadius:S.radius.xl,...smoothCorners,paddingTop:S.space.lg,paddingHorizontal:S.space.lg,paddingBottom:S.space.lg+A.bottom},S.shadow.modal]:[I.centeredContent,{backgroundColor:S.colors.surface,borderRadius:L.active&&L.size?squircleHostRadius(L.size.width,L.size.height,S.radius.xl):S.radius.xl,...smoothCorners,padding:S.space.xl},S.shadow.modal],[i,S,I,A.bottom,L.active,L.size]),W=useMemo(()=>"bottom"===i?I.bottomWrapper:"fullScreen"===i?I.fullScreenWrapper:I.centeredWrapper,[i,I]),O=useMemo(()=>"bottom"===i?{opacity:j,transform:[{translateY:w}]}:"fullScreen"===i?{opacity:j}:{opacity:j,transform:[{scale:V}]},[i,V,j,w]);return _jsx(RNModal,{visible:E,transparent:!0,statusBarTranslucent:!0,navigationBarTranslucent:!0,animationType:"none",onRequestClose:H,testID:h,children:_jsx(View,{ref:e=>{D.current=e,"function"==typeof t?t(e):t&&(t.current=e)},style:I.root,accessible:!1,accessibilityViewIsModal:!0,accessibilityRole:"alert",accessibilityLabel:u,children:_jsxs(ModalSafeArea,{onInsets:v,children:[_jsxs(Animated.View,{collapsable:!1,style:[StyleSheet.absoluteFill,W,{backgroundColor:q},f],children:[_jsx(Pressable,{style:StyleSheet.absoluteFill,onPress:z,accessibilityRole:"button",accessibilityLabel:"Close modal",disabled:!a}),_jsxs(Animated.View,{style:[F,O,m],onLayout:L.onLayout,pointerEvents:"auto",needsOffscreenAlphaCompositing:!0,children:[L.active&&L.size?_jsx(SquircleFill,{width:L.size.width,height:L.size.height,radius:S.radius.xl,fill:S.colors.surface}):null,d]})]}),_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;
+"use strict";import{forwardRef,useCallback,useEffect,useMemo,useRef,useState}from"react";import{AccessibilityInfo,Animated,Dimensions,Easing,Keyboard,Platform,Pressable,Modal as RNModal,StyleSheet,useWindowDimensions,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{computePlacement,placementMaxHeight,placementRoom}from"../../utils/placement.js";import{squircleHostRadius}from"../../utils/squircle.js";import{warnInvalidValue}from"../../utils/warnInvalidValue.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 DEFAULT_MODAL_LABELS=Object.freeze({close:"Close modal"});const MODAL_PRESENTATIONS=["centered","bottom","fullScreen","anchored"];export const MODAL_DISMISS_GRACE_MS=300;const SCALE_START_VALUE=.9,Modal=forwardRef((e,t)=>{warnInvalidValue("Modal","presentation",e.presentation,MODAL_PRESENTATIONS);const{visible:o,onClose:s,presentation:r="centered",backdropOpacity:i,backdropPressClose:a=!0,animationDuration:n,animateMount:l=!0,accessibilityLabel:c,hardwareBackPress:u=!0,children:d,contentStyle:m,backdropStyle:p,restoreFocusRef:f,onDismissed:h,haptic:g,labels:b,anchor:A,placement:S="auto",align:v="center",testID:y}=e,x=useTheme(),M=useMemo(()=>({...DEFAULT_MODAL_LABELS,...b}),[b]),w=usePresenceMotion(),[R,C]=useModalInsets(),{width:V,height:j}=useWindowDimensions(),[T,D]=useState({width:0,height:0}),E=n??w.duration("default"),_=Dimensions.get("window").height,L=useRef(!l&&o),I=L.current,N=useRef(createAnimatedValue(I?1:.9)).current,H=useRef(createAnimatedValue(I?1:0)).current,P=useRef(createAnimatedValue(I?0:_)).current,k=useRef(createAnimatedValue(I?1:0)).current,O=useRef(null),z=useRef(!1),[W,q]=useState(o),F=useMemo(()=>buildStyles(x),[x]),B=useMemo(()=>{if("anchored"!==r||void 0===A)return null;const e={width:V,height:j,insets:{top:R.top,bottom:R.bottom,left:0,right:0}},t=computePlacement(A,T,e,S,{align:v});return{...t,maxHeight:placementMaxHeight(t.placement,placementRoom(A,e))}},[r,A,T,S,v,V,j,R.top,R.bottom]),U=useMemo(()=>{const e=x.colors.scrim;return"number"!=typeof i?"anchored"===r?transparentOf(e):e:withAlpha(e,i)??e},[x.colors.scrim,i,r]),K=useMemo(()=>k.interpolate({inputRange:[0,1],outputRange:[transparentOf(U),U]}),[k,U]);useEffect(()=>{o&&(Keyboard.dismiss(),q(!0))},[o]),useEffect(()=>{const e=[];if(o&&W&&L.current)L.current=!1;else if(o&&W){const t=Animated.timing(k,{toValue:1,duration:w.duration("default"),useNativeDriver:!1});if(t.start(),e.push(t),w.reduced||"anchored"===r){H.setValue(0),P.setValue(0),N.setValue(1);const t=Animated.timing(H,{toValue:1,duration:E,useNativeDriver:!0});t.start(),e.push(t)}else if("bottom"===r){H.setValue(1);const t=Animated.spring(P,{toValue:0,damping:x.motion.spring.gentle.damping,stiffness:x.motion.spring.gentle.stiffness,mass:x.motion.spring.gentle.mass,useNativeDriver:!0});t.start(),e.push(t)}else{const t=Animated.parallel([Animated.spring(N,{toValue:1,damping:x.motion.spring.gentle.damping,stiffness:x.motion.spring.gentle.stiffness,mass:x.motion.spring.gentle.mass,useNativeDriver:!0}),Animated.timing(H,{toValue:1,duration:E,useNativeDriver:!0})]);t.start(),e.push(t)}}else if(W){const t=w.duration("fast"),o=Easing.bezier(...x.motion.ease.accelerate),s=Animated.timing(H,{toValue:0,duration:t,easing:o,useNativeDriver:!0}),i=w.reduced||"anchored"===r?s:"bottom"===r?Animated.timing(P,{toValue:_,duration:t,easing:o,useNativeDriver:!0}):Animated.parallel([Animated.timing(N,{toValue:.9,duration:t,easing:o,useNativeDriver:!0}),s]),a=Animated.parallel([i,Animated.timing(k,{toValue:0,duration:w.duration("default"),useNativeDriver:!1})]);a.start(({finished:e})=>{e&&(P.setValue(_),q(!1))}),e.push(a)}return()=>e.forEach(e=>{e.stop()})},[o,W,r,E,N,H,k,P,_,x.motion.spring.gentle.damping,x.motion.spring.gentle.stiffness,x.motion.spring.gentle.mass,w,x.motion.ease.accelerate]),useEffect(()=>{if("web"===Platform.OS)return;let e,t;return o?(e=setTimeout(()=>{O.current&&AccessibilityInfo.sendAccessibilityEvent(O.current,"focus")},150),z.current=!0):z.current&&(z.current=!1,f?.current&&(t=setTimeout(()=>{const e=f.current;e&&AccessibilityInfo.sendAccessibilityEvent(e,"focus")},E))),()=>{e&&clearTimeout(e),t&&clearTimeout(t)}},[o,E,f]);const G=useRef(h);G.current=h;const Y=useRef(!1);useEffect(()=>{if(o)return void(Y.current=!0);if(!Y.current)return;Y.current=!1;const e=setTimeout(()=>G.current?.(),300);return()=>clearTimeout(e)},[o]);const J=useCallback(()=>{if(!a)return;const e=resolveHaptic(g,"selection");e&&triggerHaptic(e),s()},[a,s,g]),Q=useCallback(()=>{u&&s()},[u,s]),X=useSquircle("bottom"!==r&&"fullScreen"!==r&&"anchored"!==r,x.radius.xl),Z=useCallback(e=>{X.onLayout(e);const{width:t,height:o}=e.nativeEvent.layout;D(e=>e.width===t&&e.height===o?e:{width:t,height:o})},[X.onLayout]),$=useMemo(()=>"anchored"===r?[F.anchoredContent,{left:B?.x,top:B?.y,maxHeight:B?.maxHeight,backgroundColor:x.colors.surface,borderRadius:x.radius.lg,...smoothCorners},x.shadow.modal]:"fullScreen"===r?[F.fullScreenContent,{backgroundColor:x.colors.surface}]:"bottom"===r?[F.bottomContent,{backgroundColor:x.colors.surface,borderTopLeftRadius:x.radius.xl,borderTopRightRadius:x.radius.xl,...smoothCorners,paddingTop:x.space.lg,paddingHorizontal:x.space.lg,paddingBottom:x.space.lg+R.bottom},x.shadow.modal]:[F.centeredContent,{backgroundColor:x.colors.surface,borderRadius:X.active&&X.size?squircleHostRadius(X.size.width,X.size.height,x.radius.xl):x.radius.xl,...smoothCorners,padding:x.space.xl},x.shadow.modal],[r,x,F,R.bottom,X.active,X.size,B]),ee=useMemo(()=>"anchored"===r?F.anchoredWrapper:"bottom"===r?F.bottomWrapper:"fullScreen"===r?F.fullScreenWrapper:F.centeredWrapper,[r,F]),te=useMemo(()=>"bottom"===r?{opacity:H,transform:[{translateY:P}]}:"fullScreen"===r||"anchored"===r?{opacity:H}:{opacity:H,transform:[{scale:N}]},[r,N,H,P]);if("anchored"===r&&void 0===A)throw new Error('[@webority/mobile-ui] Modal: presentation "anchored" needs an anchor.');return _jsx(RNModal,{visible:W,transparent:!0,statusBarTranslucent:!0,navigationBarTranslucent:!0,animationType:"none",onRequestClose:Q,testID:y,children:_jsx(View,{ref:e=>{O.current=e,"function"==typeof t?t(e):t&&(t.current=e)},style:F.root,accessible:!1,accessibilityViewIsModal:!0,accessibilityRole:"alert",accessibilityLabel:c,children:_jsxs(ModalSafeArea,{onInsets:C,children:[_jsxs(Animated.View,{collapsable:!1,style:[StyleSheet.absoluteFill,ee,{backgroundColor:K},p],children:[_jsx(Pressable,{style:StyleSheet.absoluteFill,onPress:J,accessibilityRole:a?"button":void 0,accessibilityLabel:a?M.close:void 0,accessible:!!a&&void 0,importantForAccessibility:a?void 0:"no",disabled:!a}),_jsxs(Animated.View,{style:[$,te,T.height>0||"anchored"!==r?null:F.unmeasured,m],onLayout:Z,pointerEvents:"auto",needsOffscreenAlphaCompositing:!0,children:[X.active&&X.size?_jsx(SquircleFill,{width:X.size.width,height:X.size.height,radius:x.radius.xl,fill:x.colors.surface}):null,d]})]}),_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},anchoredWrapper:{flex:1},anchoredContent:{position:"absolute"},unmeasured:{opacity:0}});export{Modal};export default Modal;

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

@@ -1 +1 @@
-"use strict";export{default,MODAL_DISMISS_GRACE_MS,Modal}from"./Modal.js";
+"use strict";export{DEFAULT_MODAL_LABELS,default,MODAL_DISMISS_GRACE_MS,Modal}from"./Modal.js";

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

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

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

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