@webority/mobile-ui 0.11.1 → 0.12.1

package/lib/module/components/BottomNavigation/BottomNavigation.js

@@ -1 +1 @@
-"use strict";import React,{forwardRef,useEffect,useMemo,useRef}from"react";import{Animated,LayoutAnimation,Platform,Pressable,StyleSheet,Text,View}from"react-native";import{useSafeAreaInsets}from"react-native-safe-area-context";import{useReducedMotion}from"../../hooks/useReducedMotion.js";import{createAnimatedValue,useTheme}from"../../theme/index.js";import{triggerHaptic}from"../../utils/index.js";import{smoothCorners}from"../../utils/corners.js";import{supportsBoxShadow,toBoxShadow}from"../../utils/shadows.js";import{renderSlotIcon}from"../AppIcon/index.js";import{useScreenReaderEnabled}from"./useScreenReaderEnabled.js";import{jsx as _jsx,jsxs as _jsxs,Fragment as _Fragment}from"react/jsx-runtime";const DEFAULT_ICON_SIZE=18,DEFAULT_LABEL_MAX_FONT_SCALE=1.2,ICON_WRAP_AIR=4,PILL_AIR=8,DEFAULT_PILL_MAX_WIDTH=64,TILE_MAX_WIDTH=96,DEFAULT_PILL_INSET=16,DEFAULT_UNDERLINE_HEIGHT=3,DEFAULT_FLOATING_MARGIN=16,DEFAULT_FLOATING_RADIUS=28,DEFAULT_BUBBLE_SIZE=48,DEFAULT_BUBBLE_LIFT=14,DEFAULT_CENTER_SIZE=48,DEFAULT_CENTER_ICON_SIZE=24,CENTER_KEY="__webority_center_action__",TAB_PADDING_VERTICAL=6,BAR_PADDING_HORIZONTAL=4,BAR_PADDING_TOP=6,BAR_PADDING_TOP_BUBBLE=8,FLOATING_BAR_PADDING_VERTICAL=6,FLOATING_BAR_PADDING_HORIZONTAL=8,EXPANDED_FLEX=1.5,SOLID_INACTIVE_OPACITY=.7,TILE_INSET=2,TILE_LABEL_GAP=2,formatBadge=e=>null==e||!1===e?null:!0===e||"·"===e?{text:"",isDot:!0}:"number"==typeof e?e<=0?null:{text:e>99?"99+":String(e),isDot:!1}:"string"==typeof e?0===e.length?null:{text:e,isDot:!1}:null,badgeAccessibilitySuffix=e=>null==e||!1===e?"":"number"==typeof e?e>0?`, ${e} unread`:"":!0===e||"·"===e?", new updates":"string"==typeof e&&e.length>0?`, ${e}`:"",BottomNavigation=forwardRef((e,t)=>{const{tabs:i,centerAction:n,activeTab:o,onChange:r,haptic:a="selection",showLabels:l=!0,variant:s="pill",indicatorPosition:d="bottom",radius:c,indicatorRadius:u="auto",elevation:h,iconSize:m,marginHorizontal:p,marginVertical:g,paddingHorizontal:b,paddingVertical:y,border:f,minimizeOnScroll:x=!1,scrollDirection:_="idle",accessory:A,style:I,indicatorStyle:R,labelStyle:S,labelMaxFontScale:E,testID:w}=e,L=useTheme(),T=useSafeAreaInsets(),D=useMemo(()=>buildStyles(L),[L]),v=L.components.bottomNavigation,C=m??v?.iconSize??18,j=v?.pillHeight??C+4+8,B=v?.pillMaxWidth??64,N=v?.pillInset??16,V=v?.floatingMargin??16,P=v?.floatingRadius??28,M=v?.bubbleSize??48,k=v?.bubbleLift??14,F=useReducedMotion(),H=useScreenReaderEnabled(x),[z,O]=React.useState(null);useEffect(()=>{null!==z&&z!==_&&O(null)},[z,_]);const W=x&&!H&&"down"===_&&null===z,[U,G]=React.useState(W);useEffect(()=>{U!==W&&(F||"web"===Platform.OS||LayoutAnimation.configureNext(LayoutAnimation.Presets.easeInEaseOut),G(W))},[U,W,F]);const $="function"==typeof A?A({minimized:U}):A,X=null!=$&&!1!==$,Z=U&&X,[Y,K]=React.useState(0),q=X&&!Z?Y+L.spacing.xs:0,J="tile"===s,Q="floating"===s||J,ee="bubble"===s,te="expand"===s,ie="solid"===s,ne="pill"===s||Q||ie,oe=Math.max(0,i.findIndex(e=>e.key===o)),[re,ae]=React.useState(0),[le,se]=React.useState(0),de=n?Math.ceil(i.length/2):i.length,ce=i.length+(n?1:0),[ue,he]=React.useState({width:0,height:0}),me=n?.size??48,pe=void 0!==n?.gap,ge=Math.max(0,n?.gap??0),be=pe?(ue.width||me)+2*ge:0,ye=pe?i.length>0?Math.max(0,re-be)/i.length:0:ce>0?re/ce:0,fe=pe?be:ye,xe=useRef(createAnimatedValue(oe)).current,_e=useRef({}),Ae=useRef({});i.forEach(e=>{_e.current[e.key]||(_e.current[e.key]=new Animated.Value(1)),Ae.current[e.key]||(Ae.current[e.key]=createAnimatedValue(e.key===o?1:0))});const Ie=ye>0?J?Math.min(ye-4,96):Math.min(ye-N,B):0,Re=ye>0?(ye-Ie)/2:0,Se=ye>0?(ye-M)/2:0,hasLabel=e=>l&&!U&&!1!==e.showLabel&&e.label.trim().length>0,Ee=i[oe],we=Ee&&!hasLabel(Ee)&&le>0?le/2:6+(C+4)/2,Le=we-k-M/2,Te=Math.max(0,le-4),De=J?2:we-j/2,ve=useRef(oe);useEffect(()=>{if(ve.current===oe)return;ve.current=oe;const e=Animated.spring(xe,{toValue:oe,tension:120,friction:14,useNativeDriver:!0});return e.start(),()=>e.stop()},[oe,xe]);const Ce=Math.max(1,i.length-1),je=useMemo(()=>{const e=[],t=[];for(let i=0;i<=Ce;i++)e.push(i),t.push(i<de?i*ye:i*ye+fe);return xe.interpolate({inputRange:e,outputRange:t})},[xe,Ce,de,ye,fe]),Be=i.map(e=>e.key).join(" "),Ne=ee||te;useEffect(()=>{const e=Be.split(" ").flatMap(e=>{const t=e===o?1:0,i=Ae.current[e];return i?Ne?[Animated.spring(i,{toValue:t,tension:140,friction:13,useNativeDriver:!1})]:(i.setValue(t),[]):[]});if(0===e.length)return;const t=Animated.parallel(e);return t.start(),()=>t.stop()},[o,Be,Ne]);const popIcon=e=>{Animated.sequence([Animated.timing(e,{toValue:1.15,duration:120,useNativeDriver:!0}),Animated.spring(e,{toValue:1,tension:200,friction:8,useNativeDriver:!0})]).start()},Ve=useRef(new Animated.Value(1)).current,{colors:Pe}=L,Me=ie?Pe.primary:Pe.background.elevated,ke=ie?Pe.onPrimary:Pe.primary,Fe=ie?Pe.onPrimary:J?Pe.text.primary:Pe.text.tertiary,He=ie?Pe.onPrimary:Pe.primaryMuted,ze=ie?Pe.primary:ee?Pe.onPrimary:ke,Oe=p??V,We=g??(Q?V:0),Ue=We>0,Ge=y??(Q?6:ee?8:6),$e=b??(Q?8:4),Xe=Ue?Ge:Math.max(Ge,T.bottom),Ze=Ue?Math.max(We,T.bottom):0,Ye="full"===c,Ke=Q?le+q+2*Ge+2*StyleSheet.hairlineWidth:le+q+Ge+Xe,qe=Ye?le>0?Ke/2:L.radius.full:c??v?.borderRadius??(J?L.radius.full:Q?P:0),Je=void 0!==c||void 0!==v?.borderRadius,activeBgRadius=(e,t)=>"number"==typeof u?Math.max(0,Math.min(u,e/2)):"auto"===u&&Je?Math.min(qe,e/2):t,Qe="underline"===s?Math.max($e,Ye&&0===le?0:qe):$e,et=h??"none",tt=L.shadows[et],it="none"===et?null:supportsBoxShadow()?{boxShadow:toBoxShadow(tt)}:tt,nt=f?StyleSheet.hairlineWidth:0,ot=ie?Pe.primary:Pe.border.primary,rt=n?.lift??0,at=Ge+nt+q,lt=n&&le>0?Math.max(0,(ue.height||me)/2+rt-le/2-at):0,st=n?_jsx(View,{style:[D.centerCell,pe?{flex:0,marginHorizontal:ge}:null],pointerEvents:"box-none",children:_jsx(Pressable,{onPress:()=>{if(!n)return;const e=n.haptic??a;!1!==e&&triggerHaptic(e),popIcon(Ve),n.onPress()},onLayout:e=>{const{width:t,height:i}=e.nativeEvent.layout;he(e=>e.width===t&&e.height===i?e:{width:t,height:i})},accessibilityRole:"button",accessibilityLabel:n.label,hitSlop:{top:6,bottom:6,left:6,right:6},style:({pressed:e})=>[{top:-rt},e?{opacity:.85}:null],testID:n.testID??(w?`${w}-center`:void 0),children:n.content?_jsx(Animated.View,{style:{transform:[{scale:Ve}]},children:n.content}):_jsx(View,{style:[D.centerCircle,{width:me,height:me,borderRadius:me/2,...smoothCorners,backgroundColor:n.color??Pe.primary}],children:_jsx(Animated.View,{style:{transform:[{scale:Ve}]},children:renderSlotIcon(n.icon??"add",{color:n.iconColor??Pe.onPrimary,size:n.iconSize??24,disabled:!1})})})})},CENTER_KEY):null,dt=X?_jsx(View,{style:Z?D.accessoryInline:D.accessoryStacked,onLayout:e=>K(e.nativeEvent.layout.height),testID:w?`${w}-accessory`:void 0,children:$}):null,ct=_jsxs(View,{style:Z?[D.tabRow,D.tabRowInline]:D.tabRow,onLayout:e=>{const{width:t,height:i}=e.nativeEvent.layout;ae(t),se(i)},children:[ne&&Ie>0&&(!J||Te>0)?_jsx(Animated.View,{pointerEvents:"none",style:[D.pill,{width:Ie,height:J?Te:j,left:Re,top:De,backgroundColor:He,borderRadius:J?activeBgRadius(Te,Te/2):activeBgRadius(j,L.radius.full),...smoothCorners,transform:[{translateX:je}]},R]}):null,ee&&ye>0?_jsx(Animated.View,{pointerEvents:"none",style:[D.bubble,L.shadows.md,{width:M,height:M,borderRadius:M/2,...smoothCorners,left:Se,top:Le,backgroundColor:Pe.primary,borderColor:Pe.background.elevated,transform:[{translateX:je}]},R]}):null,(ut=i.map(e=>{const t=e.key===o,i=t?ke:Fe,n=t?ze:Fe,l="string"==typeof e.icon?{name:e.icon,variant:"bold"}:e.icon,s=t?e.activeIcon??l:e.icon,d=_e.current[e.key],c=Ae.current[e.key],u=formatBadge(e.badge??null),h=badgeAccessibilitySuffix(e.badge??null),m=ie&&!t?.7:1,p=ee&&t||ie?Pe.primary:Pe.background.elevated,g=hasLabel(e),b=g&&(!te||t),y=_jsxs(Animated.View,{style:[D.iconWrap,{width:C+4,height:C+4,opacity:m,transform:[{scale:d}]}],children:[renderSlotIcon(s,{color:n,size:C,focused:t,disabled:!1}),u?_jsx(View,{style:[u.isDot?D.badgeDot:D.badgePill,{backgroundColor:Pe.error,borderColor:p}],children:u.isDot?null:_jsx(Text,{style:[D.badgeText,{color:Pe.onError}],numberOfLines:1,children:u.text})}):null]}),f=ee?_jsx(Animated.View,{style:{top:c.interpolate({inputRange:[0,1],outputRange:[0,-k]})},children:y}):y,x=b?_jsx(Animated.Text,{numberOfLines:1,maxFontSizeMultiplier:E??L.maxFontSizeMultiplier??1.2,style:[D.label,te?D.labelInline:null,{color:i,opacity:te?c:m,fontWeight:t?L.typography.fontWeight.semibold:L.typography.fontWeight.normal},S],children:e.label}):null,A=_jsx(Pressable,{onPress:()=>(e=>{U&&O(_),e.key!==o&&!1!==a&&triggerHaptic(a);const t=_e.current[e.key];t&&popIcon(t),r(e.key)})(e),accessibilityRole:"tab",accessibilityState:{selected:t},"aria-selected":t,accessibilityLabel:`${e.label}${h}`,accessibilityHint:`Switches to ${e.label}`,hitSlop:{top:6,bottom:6,left:6,right:6},style:({pressed:e})=>[D.tab,J?D.tabTile:null,e?{opacity:.85}:null],testID:w?`${w}-tab-${e.key}`:void 0,children:te?_jsxs(View,{style:[D.expandPill,{height:j,paddingHorizontal:t&&g?L.spacing.md:Math.max(0,(j-(C+4))/2)}],children:[_jsx(View,{pointerEvents:"none",style:[D.expandFill,{borderRadius:activeBgRadius(j,j/2),...smoothCorners,backgroundColor:t?Pe.primaryMuted:"transparent"},t?R:null]}),f,x]}):_jsxs(_Fragment,{children:[f,x]})},e.key);return te?_jsx(Animated.View,{style:{flex:c.interpolate({inputRange:[0,1],outputRange:[1,g?1.5:1]})},children:A},e.key):A}),st?[...ut.slice(0,de),st,...ut.slice(de)]:ut),"underline"===s&&ye>0?_jsx(Animated.View,{pointerEvents:"none",style:[D.underline,"top"===d?D.underlineTop:D.underlineBottom,"top"===d?{top:-Ge-q}:{bottom:-Ge},{width:ye,height:v?.underlineHeight??3,backgroundColor:Pe.primary,transform:[{translateX:je}]},R]}):null]});var ut;return _jsx(View,{ref:t,testID:w,accessibilityRole:"tablist",style:[D.outer,{paddingHorizontal:Oe,paddingTop:Math.max(We,lt),paddingBottom:Ze},I],children:_jsxs(View,{style:[Q?D.floatingBar:D.dockedBar,Z?D.barInline:null,it,{backgroundColor:Me,borderColor:ot,borderRadius:qe,...smoothCorners},Q?{borderWidth:nt,paddingHorizontal:$e,paddingVertical:Ge}:{borderTopWidth:nt,borderBottomWidth:nt,borderLeftWidth:nt,borderRightWidth:nt,paddingHorizontal:Qe,paddingTop:Ge,paddingBottom:Xe}],children:[dt,ct]})})});BottomNavigation.displayName="BottomNavigation";const buildStyles=e=>StyleSheet.create({outer:{backgroundColor:"transparent"},dockedBar:{paddingHorizontal:4},floatingBar:{paddingVertical:6,paddingHorizontal:8},tabRow:{flexDirection:"row",alignItems:"stretch",position:"relative"},tabRowInline:{flex:1},barInline:{flexDirection:"row",alignItems:"center"},accessoryStacked:{marginBottom:e.spacing.xs},accessoryInline:{flexShrink:0,marginRight:e.spacing.xs},tab:{flex:1,minHeight:44,alignItems:"center",justifyContent:"center",paddingVertical:6,gap:4},tabTile:{paddingVertical:8,gap:2},centerCell:{flex:1,minHeight:44,alignItems:"center",justifyContent:"center"},centerCircle:{alignItems:"center",justifyContent:"center"},iconWrap:{alignItems:"center",justifyContent:"center",position:"relative"},label:{fontSize:e.typography.fontSize.xs,lineHeight:e.typography.fontSize.xs*e.typography.lineHeight.tight,textAlign:"center",includeFontPadding:!1},labelInline:{fontSize:e.typography.fontSize.sm,lineHeight:e.typography.fontSize.sm*e.typography.lineHeight.tight,flexShrink:1,includeFontPadding:!1},expandPill:{flexDirection:"row",alignItems:"center",justifyContent:"center",gap:e.spacing.xs},expandFill:{position:"absolute",top:0,right:0,bottom:0,left:0,overflow:"hidden"},pill:{position:"absolute",left:0},bubble:{position:"absolute",left:0,borderWidth:3},underline:{position:"absolute",left:0,height:3},underlineBottom:{borderTopLeftRadius:2,borderTopRightRadius:2,...smoothCorners},underlineTop:{borderBottomLeftRadius:2,borderBottomRightRadius:2,...smoothCorners},badgePill:{position:"absolute",top:-4,right:-8,minWidth:18,height:18,borderRadius:9,...smoothCorners,paddingHorizontal:4,paddingVertical:2,alignItems:"center",justifyContent:"center",borderWidth:1.5},badgeDot:{position:"absolute",top:-2,right:-2,width:10,height:10,borderRadius:5,...smoothCorners,borderWidth:1.5},badgeText:{fontSize:10,fontWeight:"700",lineHeight:12,textAlign:"center",includeFontPadding:!1}});export{BottomNavigation};export default BottomNavigation;
+"use strict";import React,{forwardRef,useEffect,useMemo,useRef}from"react";import{Animated,LayoutAnimation,Platform,Pressable,StyleSheet,Text,View}from"react-native";import{useSafeAreaInsets}from"react-native-safe-area-context";import{useReducedMotion}from"../../hooks/useReducedMotion.js";import{createAnimatedValue,useTheme}from"../../theme/index.js";import{triggerHaptic}from"../../utils/index.js";import{smoothCorners}from"../../utils/corners.js";import{supportsBoxShadow,toBoxShadow}from"../../utils/shadows.js";import{renderSlotIcon}from"../AppIcon/index.js";import{useScreenReaderEnabled}from"./useScreenReaderEnabled.js";import{jsx as _jsx,jsxs as _jsxs,Fragment as _Fragment}from"react/jsx-runtime";const DEFAULT_ICON_SIZE=18,DEFAULT_LABEL_MAX_FONT_SCALE=1.2,ICON_WRAP_AIR=4,PILL_AIR=8,DEFAULT_PILL_MAX_WIDTH=64,TILE_MAX_WIDTH=96,DEFAULT_PILL_INSET=16,DEFAULT_UNDERLINE_HEIGHT=3,DEFAULT_FLOATING_MARGIN=16,DEFAULT_FLOATING_RADIUS=28,DEFAULT_BUBBLE_SIZE=48,DEFAULT_BUBBLE_LIFT=14,DEFAULT_CENTER_SIZE=48,DEFAULT_CENTER_ICON_SIZE=24,CENTER_KEY="__webority_center_action__",TAB_PADDING_VERTICAL=6,BAR_PADDING_HORIZONTAL=4,BAR_PADDING_TOP=6,BAR_PADDING_TOP_BUBBLE=8,FLOATING_BAR_PADDING_VERTICAL=6,FLOATING_BAR_PADDING_HORIZONTAL=8,EXPANDED_FLEX=1.5,SOLID_INACTIVE_OPACITY=.7,TILE_INSET=2,TILE_LABEL_GAP=2,formatBadge=e=>null==e||!1===e?null:!0===e||"·"===e?{text:"",isDot:!0}:"number"==typeof e?e<=0?null:{text:e>99?"99+":String(e),isDot:!1}:"string"==typeof e?0===e.length?null:{text:e,isDot:!1}:null,badgeAccessibilitySuffix=e=>null==e||!1===e?"":"number"==typeof e?e>0?`, ${e} unread`:"":!0===e||"·"===e?", new updates":"string"==typeof e&&e.length>0?`, ${e}`:"",BottomNavigation=forwardRef((e,t)=>{const{tabs:i,centerAction:n,activeTab:o,onChange:r,haptic:a="selection",showLabels:l=!0,variant:s="pill",indicatorPosition:d="bottom",radius:c,indicatorRadius:u="auto",elevation:h,iconSize:m,marginHorizontal:p,marginVertical:g,paddingHorizontal:b,paddingVertical:y,border:f,minimizeOnScroll:x=!1,scrollDirection:_="idle",accessory:A,style:I,indicatorStyle:R,labelStyle:S,labelMaxFontScale:E,testID:w}=e,L=useTheme(),T=useSafeAreaInsets(),D=useMemo(()=>buildStyles(L),[L]),v=L.components.bottomNavigation,C=m??v?.iconSize??18,j=v?.pillHeight??C+4+8,B=v?.pillMaxWidth??64,N=v?.pillInset??16,V=v?.floatingMargin??16,P=v?.floatingRadius??28,M=v?.bubbleSize??48,k=v?.bubbleLift??14,F=useReducedMotion(),H=useScreenReaderEnabled(x),[z,O]=React.useState(null);useEffect(()=>{null!==z&&z!==_&&O(null)},[z,_]);const W=x&&!H&&"down"===_&&null===z,[U,G]=React.useState(W);useEffect(()=>{U!==W&&(F||"web"===Platform.OS||LayoutAnimation.configureNext(LayoutAnimation.Presets.easeInEaseOut),G(W))},[U,W,F]);const $="function"==typeof A?A({minimized:U}):A,X=null!=$&&!1!==$,Z=U&&X,[Y,K]=React.useState(0),q=X&&!Z?Y+L.spacing.xs:0,J="tile"===s,Q="floating"===s||J,ee="bubble"===s,te="expand"===s,ie="solid"===s,ne="pill"===s||Q||ie,oe=Math.max(0,i.findIndex(e=>e.key===o)),[re,ae]=React.useState(0),[le,se]=React.useState(0),de=n?Math.ceil(i.length/2):i.length,ce=i.length+(n?1:0),[ue,he]=React.useState({width:0,height:0}),me=n?.size??48,pe=void 0!==n?.gap,ge=Math.max(0,n?.gap??0),be=pe?(ue.width||me)+2*ge:0,ye=pe?i.length>0?Math.max(0,re-be)/i.length:0:ce>0?re/ce:0,fe=pe?be:ye,xe=useRef(createAnimatedValue(oe)).current,Ae=useRef({}),Ie=useRef({});i.forEach(e=>{Ae.current[e.key]||(Ae.current[e.key]=new Animated.Value(1)),Ie.current[e.key]||(Ie.current[e.key]=createAnimatedValue(e.key===o?1:0))});const Re=ye>0?J?Math.min(ye-4,96):Math.min(ye-N,B):0,Se=ye>0?(ye-Re)/2:0,Ee=ye>0?(ye-M)/2:0,hasLabel=e=>l&&!U&&!1!==e.showLabel&&e.label.trim().length>0,we=i[oe],Le=we&&!hasLabel(we)&&le>0?le/2:6+(C+4)/2,Te=Le-k-M/2,De=Math.max(0,le-4),ve=J?2:Le-j/2,Ce=useRef(oe);useEffect(()=>{if(Ce.current===oe)return;Ce.current=oe;const e=Animated.spring(xe,{toValue:oe,tension:120,friction:14,useNativeDriver:!0});return e.start(),()=>e.stop()},[oe,xe]);const je=Math.max(1,i.length-1),Be=useMemo(()=>{const e=[],t=[];for(let i=0;i<=je;i++)e.push(i),t.push(i<de?i*ye:i*ye+fe);return xe.interpolate({inputRange:e,outputRange:t})},[xe,je,de,ye,fe]),Ne=i.map(e=>e.key).join(" "),Ve=ee||te;useEffect(()=>{const e=Ne.split(" ").flatMap(e=>{const t=e===o?1:0,i=Ie.current[e];return i?Ve?[Animated.spring(i,{toValue:t,tension:140,friction:13,useNativeDriver:!1})]:(i.setValue(t),[]):[]});if(0===e.length)return;const t=Animated.parallel(e);return t.start(),()=>t.stop()},[o,Ne,Ve]);const popIcon=e=>{Animated.sequence([Animated.timing(e,{toValue:1.15,duration:120,useNativeDriver:!0}),Animated.spring(e,{toValue:1,tension:200,friction:8,useNativeDriver:!0})]).start()},Pe=useRef(new Animated.Value(1)).current,{colors:Me}=L,ke=ie?Me.primary:Me.background.elevated,Fe=ie?Me.onPrimary:Me.primary,He=ie?Me.onPrimary:J?Me.text.primary:Me.text.tertiary,ze=ie?Me.onPrimary:Me.primaryMuted,Oe=ie?Me.primary:ee?Me.onPrimary:Fe,We=p??V,Ue=g??(Q?V:0),Ge=Ue>0,$e=y??(Q?6:ee?8:6),Xe=b??(Q?8:4),Ze=Ge?$e:Math.max($e,T.bottom),Ye=Ge?Math.max(Ue,T.bottom):0,Ke="full"===c,qe=Q?le+q+2*$e+2*StyleSheet.hairlineWidth:le+q+$e+Ze,Je=Ke?le>0?qe/2:L.radius.full:c??v?.borderRadius??(J?L.radius.full:Q?P:0),Qe=void 0!==c||void 0!==v?.borderRadius,activeBgRadius=(e,t)=>"number"==typeof u?Math.max(0,Math.min(u,e/2)):"auto"===u&&Qe?Math.min(Je,e/2):t,et="underline"===s?Math.max(Xe,Ke&&0===le?0:Je):Xe,tt=h??"none",it=L.shadows[tt],nt="none"===tt?null:supportsBoxShadow()?{boxShadow:toBoxShadow(it)}:it,ot=f?StyleSheet.hairlineWidth:0,rt=ie?Me.primary:Me.border.primary,at=n?.lift??0,lt=$e+ot+q,st=n&&le>0?Math.max(0,(ue.height||me)/2+at-le/2-lt):0,dt=n?_jsx(View,{style:[D.centerCell,pe?{flex:0,marginHorizontal:ge}:null],pointerEvents:"box-none",children:_jsx(Pressable,{onPress:()=>{if(!n)return;const e=n.haptic??a;!1!==e&&triggerHaptic(e),popIcon(Pe),n.onPress()},onLayout:e=>{const{width:t,height:i}=e.nativeEvent.layout;he(e=>e.width===t&&e.height===i?e:{width:t,height:i})},accessibilityRole:"button",accessibilityLabel:n.label,hitSlop:{top:6,bottom:6,left:6,right:6},style:({pressed:e})=>[{top:-at},e?{opacity:.85}:null],testID:n.testID??(w?`${w}-center`:void 0),children:n.content?_jsx(Animated.View,{style:{transform:[{scale:Pe}]},children:n.content}):_jsx(View,{style:[D.centerCircle,{width:me,height:me,borderRadius:me/2,...smoothCorners,backgroundColor:n.color??Me.primary}],children:_jsx(Animated.View,{style:{transform:[{scale:Pe}]},children:renderSlotIcon(n.icon??"add",{color:n.iconColor??Me.onPrimary,size:n.iconSize??24,disabled:!1})})})})},CENTER_KEY):null,ct=X?_jsx(View,{style:Z?D.accessoryInline:D.accessoryStacked,onLayout:e=>K(e.nativeEvent.layout.height),testID:w?`${w}-accessory`:void 0,children:$}):null,ut=_jsxs(View,{style:Z?[D.tabRow,D.tabRowInline]:D.tabRow,onLayout:e=>{const{width:t,height:i}=e.nativeEvent.layout;ae(t),se(i)},children:[ne&&Re>0&&(!J||De>0)?_jsx(Animated.View,{pointerEvents:"none",style:[D.pill,{width:Re,height:J?De:j,left:Se,top:ve,backgroundColor:ze,borderRadius:J?activeBgRadius(De,De/2):activeBgRadius(j,L.radius.full),...smoothCorners,transform:[{translateX:Be}]},R]}):null,ee&&ye>0?_jsx(Animated.View,{pointerEvents:"none",style:[D.bubble,L.shadows.md,{width:M,height:M,borderRadius:M/2,...smoothCorners,left:Ee,top:Te,backgroundColor:Me.primary,borderColor:Me.background.elevated,transform:[{translateX:Be}]},R]}):null,(ht=i.map(e=>{const t=e.key===o,i=t?Fe:He,n=t?Oe:He,l="string"==typeof e.icon?{name:e.icon,variant:"bold"}:e.icon,s=t?e.activeIcon??l:e.icon,d=Ae.current[e.key],c=Ie.current[e.key],u=formatBadge(e.badge??null),h=badgeAccessibilitySuffix(e.badge??null),m=ie&&!t?.7:1,p=ee&&t||ie?Me.primary:Me.background.elevated,g=hasLabel(e),b=g&&(!te||t),y=_jsxs(Animated.View,{style:[D.iconWrap,{width:C+4,height:C+4,opacity:m,transform:[{scale:d}]}],children:[renderSlotIcon(s,{color:n,size:C,focused:t,disabled:!1}),u?_jsx(View,{style:[u.isDot?D.badgeDot:D.badgePill,{backgroundColor:Me.error,borderColor:p}],children:u.isDot?null:_jsx(Text,{style:[D.badgeText,{color:Me.onError}],numberOfLines:1,children:u.text})}):null]}),f=ee?_jsx(Animated.View,{style:{top:c.interpolate({inputRange:[0,1],outputRange:[0,-k]})},children:y}):y,x=b?_jsx(Animated.Text,{numberOfLines:1,maxFontSizeMultiplier:E??L.maxFontSizeMultiplier??1.2,style:[D.label,te?D.labelInline:null,{color:i,opacity:te?c:m,fontWeight:t?L.typography.fontWeight.semibold:L.typography.fontWeight.normal},S],children:e.label}):null,A=_jsx(Pressable,{onPress:()=>(e=>{U&&O(_),e.key!==o&&!1!==a&&triggerHaptic(a);const t=Ae.current[e.key];t&&popIcon(t),r(e.key)})(e),accessibilityRole:"tab",accessibilityState:{selected:t},"aria-selected":t,accessibilityLabel:`${e.label}${h}`,accessibilityHint:`Switches to ${e.label}`,hitSlop:{top:6,bottom:6,left:6,right:6},style:({pressed:e})=>[D.tab,J?D.tabTile:null,e?{opacity:.85}:null],testID:w?`${w}-tab-${e.key}`:void 0,children:te?_jsxs(View,{style:[D.expandPill,{height:j,paddingHorizontal:t&&g?L.spacing.md:Math.max(0,(j-(C+4))/2)}],children:[_jsx(View,{pointerEvents:"none",style:[D.expandFill,{borderRadius:activeBgRadius(j,j/2),...smoothCorners,backgroundColor:t?Me.primaryMuted:"transparent"},t?R:null]}),f,x]}):_jsxs(_Fragment,{children:[f,x]})},e.key);return te?_jsx(Animated.View,{style:{flex:c.interpolate({inputRange:[0,1],outputRange:[1,g?1.5:1]})},children:A},e.key):A}),dt?[...ht.slice(0,de),dt,...ht.slice(de)]:ht),"underline"===s&&ye>0?_jsx(Animated.View,{pointerEvents:"none",style:[D.underline,"top"===d?D.underlineTop:D.underlineBottom,"top"===d?{top:-$e-q}:{bottom:-$e},{width:ye,height:v?.underlineHeight??3,backgroundColor:Me.primary,transform:[{translateX:Be}]},R]}):null]});var ht;return _jsx(View,{ref:t,testID:w,accessibilityRole:"tablist",style:[D.outer,{paddingHorizontal:We,paddingTop:Math.max(Ue,st),paddingBottom:Ye},I],children:_jsxs(View,{style:[Q?D.floatingBar:D.dockedBar,Z?D.barInline:null,nt,{backgroundColor:ke,borderColor:rt,borderRadius:Je,...smoothCorners},Q?{borderWidth:ot,paddingHorizontal:Xe,paddingVertical:$e}:{borderTopWidth:ot,borderBottomWidth:ot,borderLeftWidth:ot,borderRightWidth:ot,paddingHorizontal:et,paddingTop:$e,paddingBottom:Ze}],children:[ct,ut]})})});BottomNavigation.displayName="BottomNavigation";const buildStyles=e=>StyleSheet.create({outer:{backgroundColor:"transparent"},dockedBar:{paddingHorizontal:4},floatingBar:{paddingVertical:6,paddingHorizontal:8},tabRow:{flexDirection:"row",alignItems:"stretch",position:"relative"},tabRowInline:{flex:1},barInline:{flexDirection:"row",alignItems:"center"},accessoryStacked:{marginBottom:e.spacing.xs},accessoryInline:{flexShrink:0,marginRight:e.spacing.xs},tab:{flex:1,minHeight:44,alignItems:"center",justifyContent:"center",paddingVertical:6,gap:4},tabTile:{paddingVertical:8,gap:2},centerCell:{flex:1,minHeight:44,alignItems:"center",justifyContent:"center"},centerCircle:{alignItems:"center",justifyContent:"center"},iconWrap:{alignItems:"center",justifyContent:"center",position:"relative"},label:{fontSize:e.typography.fontSize.xs,lineHeight:e.typography.fontSize.xs*e.typography.lineHeight.tight,textAlign:"center",includeFontPadding:!1},labelInline:{fontSize:e.typography.fontSize.sm,lineHeight:e.typography.fontSize.sm*e.typography.lineHeight.tight,flexShrink:1,includeFontPadding:!1},expandPill:{flexDirection:"row",alignItems:"center",justifyContent:"center",gap:e.spacing.xs},expandFill:{position:"absolute",top:0,right:0,bottom:0,left:0,overflow:"hidden"},pill:{position:"absolute",left:0},bubble:{position:"absolute",left:0,borderWidth:3},underline:{position:"absolute",left:0,height:3},underlineBottom:{borderTopLeftRadius:2,borderTopRightRadius:2,...smoothCorners},underlineTop:{borderBottomLeftRadius:2,borderBottomRightRadius:2,...smoothCorners},badgePill:{position:"absolute",top:-4,right:-8,minWidth:18,height:18,borderRadius:9,...smoothCorners,paddingHorizontal:4,paddingVertical:2,alignItems:"center",justifyContent:"center",borderWidth:1.5},badgeDot:{position:"absolute",top:-2,right:-2,width:10,height:10,borderRadius:5,...smoothCorners,borderWidth:1.5},badgeText:{fontSize:10,fontWeight:"700",lineHeight:12,textAlign:"center",includeFontPadding:!1}});export{BottomNavigation};export default BottomNavigation;

package/lib/module/components/BottomSheet/BottomSheet.js

@@ -1 +1 @@
-"use strict";import{createContext,forwardRef,useCallback,useContext,useEffect,useImperativeHandle,useMemo,useRef,useState}from"react";import{Dimensions,Modal,Platform,ScrollView,StyleSheet,useWindowDimensions,View}from"react-native";import{Gesture,GestureDetector,GestureHandlerRootView}from"react-native-gesture-handler";import{useReanimatedKeyboardAnimation}from"react-native-keyboard-controller";import Animated,{Easing,runOnJS,useAnimatedStyle,useDerivedValue,useSharedValue,withSpring,withTiming}from"react-native-reanimated";import{SafeAreaProvider,useSafeAreaInsets}from"react-native-safe-area-context";import{useTheme}from"../../theme/index.js";import{triggerHaptic}from"../../utils/index.js";import{smoothCorners}from"../../utils/corners.js";import{ToastHost}from"../Toast/ToastProvider.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const TABLET_MIN_SHORT_SIDE=600,DIALOG_MAX_WIDTH=560,BottomSheetContext=createContext(null);export const useBottomSheet=()=>{const e=useContext(BottomSheetContext);if(!e)throw new Error("useBottomSheet must be used inside a <BottomSheet>.");return e};const SPRING_CONFIG={damping:20,stiffness:240,mass:1},CLOSE_VELOCITY_THRESHOLD=1e3,DRAG_ACTIVATION_OFFSET=10,BottomSheet=forwardRef((e,t)=>{const{snapPoints:o,index:s,onChange:n,onAnimate:r,onAfterClose:a,enablePanDownToClose:l=!0,enableBackdropPress:i=!0,confirmDismiss:u,scrollable:c=!1,scrollRef:d,onScroll:h,onContentSizeChange:m,onScrollLayout:f,scrollEventThrottle:b,keyboardBehavior:p="shift",mode:S="modal",presentation:g="sheet",handleIndicatorStyle:v,containerStyle:y,header:w,footer:C,headerStyle:x,footerStyle:k,children:R,accessibilityLabel:_,accessibilityViewIsModal:I,testID:j}=e,T=useTheme(),M=useSafeAreaInsets(),[V,D]=useState(()=>Dimensions.get("window").height),[O,A]=useState(()=>Dimensions.get("window").width),H=useCallback(e=>{const{height:t,width:o}=e.nativeEvent.layout;t>0&&D(e=>e===t?e:t),o>0&&A(e=>e===o?e:o)},[]),P=useWindowDimensions(),B="dialog"===g||"auto"===g&&Math.min(P.width,P.height)>=600,E=Math.min(560,O-2*T.spacing.xl),[G,L]=useState({top:M.top,bottom:M.bottom}),N="modal"===S?G.top:M.top,F="modal"===S?G.bottom:M.bottom,J=o.includes("content"),[z,Y]=useMeasuredHeight(),[$,q]=useMeasuredHeight(),[W,K,X]=useMeasuredHeight(),[U,Q]=useMeasuredHeight(),Z=B?T.spacing.md:z,ee=J?Math.min(Z+(null!=w?$:0)+W+(null!=C?U:0)+F,V-N):0,te=useCallback((e,t)=>{J&&X(t),m?.(e,t)},[J,m,X]),oe=useMemo(()=>resolveSnapPoints(o,V,ee),[o,V,ee]),se=V,ne=oe[oe.length-1]??0,re=useSharedValue(se),ae=useSharedValue(se),le=useSharedValue(-1),[ie,ue]=useState(-1),ce=useRef(!1),[de,he]=useState(!1),[me,fe]=useState(!1),be=useRef(!1),pe=useRef(a);pe.current=a;const[Se,ge]=useState(!1),ve=useRef(-1),ye=useRef(!1);ye.current="modal"===S?me:Se;const we=useRef(u);we.current=u;const Ce=useRef(!1),xe=useRef(!0),ke=useRef([]),Re=useCallback(e=>{const t=ke.current;ke.current=[];for(const o of t)o(e)},[]);useEffect(()=>(xe.current=!0,()=>{xe.current=!1,Re(!1)}),[Re]);const _e=useCallback(e=>{if(e<0||e>=oe.length)return se;const t=oe[e];return B?(V-t)/2:V-t},[oe,V,se,B]),Ie=useCallback(e=>{ve.current=e;ie!==e&&(ue(e),le.value=e,n?.(e))},[ie,le,n]),je=useCallback(()=>{ce.current=!1,le.value<0&&(be.current=!0,"modal"===S?(he(!1),"ios"!==Platform.OS&&fe(!1)):ge(!1))},[S,le]),Te=useCallback(()=>{be.current&&fe(!1)},[]);useEffect(()=>{("modal"===S?!me:!Se)&&be.current&&(be.current=!1,pe.current?.(),Re(!0))},[S,me,Se,Re]);const Me=useCallback((e,t,o)=>{ce.current=!0,r?.(t,o),re.value=withSpring(e,SPRING_CONFIG,e=>{"worklet";e&&runOnJS(je)()})},[r,re,je]),Ve=useCallback(e=>{const t="number"==typeof e?clamp(e,0,oe.length-1):ie>=0?ie:0,o=le.value,s=_e(t);be.current=!1,Re(!1),"modal"===S?(fe(!0),he(!0)):ge(!0),o<0&&(re.value=se),Ie(t),Me(s,o,t)},[Me,se,ie,le,S,oe.length,Ie,Re,re,_e]),De=useCallback(()=>{if(0===oe.length)return;const e=le.value,t=_e(0);Ie(0),Me(t,e,0)},[Me,le,oe.length,Ie,_e]),Oe=useCallback(()=>new Promise(e=>{if(ve.current<0)return void(ye.current?ke.current.push(e):e(!0));ke.current.push(e);const t=le.value;Ie(-1),ce.current=!0,r?.(t,-1),re.value=withTiming(se,{duration:T.motion.duration.fast,easing:Easing.bezier(...T.motion.easing.accelerate)},e=>{"worklet";e&&runOnJS(je)()})}),[se,le,je,r,Ie,re,T.motion.duration.fast,T.motion.easing.accelerate]),Ae=useCallback(async()=>{await Oe()},[Oe]),He=useCallback((e,t,o)=>{const s=we.current;if(!s)return void e();if(Ce.current)return void t?.();const n=s();"boolean"!=typeof n?(Ce.current=!0,o?.(),n.then(o=>{Ce.current=!1,o&&xe.current&&ve.current>=0?e():t?.()},e=>{throw Ce.current=!1,e})):(n?e:t)?.()},[]),Pe=useCallback(()=>new Promise(e=>{ve.current<0?Oe().then(e):He(()=>{Oe().then(e)},()=>e(!1))}),[Oe,He]),Be=useCallback(()=>{He(()=>{Ae()})},[Ae,He]);useImperativeHandle(t,()=>({expand:Ve,collapse:De,close:Ae,requestClose:Pe}),[Ve,De,Ae,Pe]),useEffect(()=>{"number"==typeof s&&s!==ie&&(-1===s?Ae():Ve(s))},[s]);const Ee=useRef({hostHeight:V,contentSnap:ee});useEffect(()=>{const e=Ee.current;e.hostHeight===V&&e.contentSnap===ee||(Ee.current={hostHeight:V,contentSnap:ee},e.hostHeight===V&&le.value<0||(re.value=withSpring(_e(le.value),SPRING_CONFIG)))},[V,ee]);const Ge=V-ne,Le=useMemo(()=>oe.map(e=>V-e),[oe,V]),Ne=useCallback(()=>{const e=ve.current;e<0||Me(_e(e),e,e)},[Me,_e]),Fe=useCallback((e,t)=>{const o=le.value;-1!==e?(Ie(e),Me(t,o,e)):He(()=>{triggerHaptic("selection"),Ae()},Ne,Ne)},[Me,Ae,le,He,Ie,Ne]),Je=useMemo(()=>Gesture.Native().withTestId(j?`${j}-content-gesture`:"bottom-sheet-content-gesture"),[j]),ze=useMemo(()=>{const e=Le,t=se,o=Ge,s=l;return Gesture.Pan().withTestId(j?`${j}-pan-gesture`:"bottom-sheet-pan-gesture").activeOffsetY([-10,10]).failOffsetX([-15,15]).onStart(()=>{"worklet";ae.value=re.value}).onUpdate(e=>{"worklet";const t=ae.value+e.translationY;re.value=t<o?o+.25*(t-o):t}).onEnd(o=>{"worklet";const n=re.value;if(o.velocityY>1e3)return s?void runOnJS(Fe)(-1,t):void runOnJS(Fe)(0,e[0]);let r=0,a=Math.abs(n-e[0]);for(let t=1;t<e.length;t++){const o=Math.abs(n-e[t]);o<a&&(a=o,r=t)}const l=e[0];s&&n-l>80?runOnJS(Fe)(-1,t):runOnJS(Fe)(r,e[r])})},[se,ae,l,Fe,Ge,Le,j,re]),{height:Ye}=useReanimatedKeyboardAnimation(),$e="shift"===p,qe=useDerivedValue(()=>$e?Ye.value:0),We=oe[ie>=0?ie:0]??ne,Ke=T.spacing.md,Xe=useAnimatedStyle(()=>{if(B){const e=qe.value,t=V+e-We-Ke,o=e<0&&re.value>t?t:re.value;return{top:o<N?N:o}}const e=re.value+qe.value,t=qe.value<0?N:Ge;return{top:e<t?t:e}}),Ue=useAnimatedStyle(()=>{const e=qe.value;if(B){const t=V+e-We-Ke,o=e<0&&re.value>t?t:re.value,s=V+e-Ke-(o<N?N:o);return{height:s<0?0:s>We?We:s}}const t=e<0?N:Ge,o=re.value+e,s=V+e-(o<t?t:o);return{height:s<0?0:s>ne?ne:s}}),Qe=ie>=0,Ze=useMemo(()=>buildStyles(T),[T]),et=useCallback(()=>{i&&He(()=>{triggerHaptic("selection"),Ae()})},[i,Ae,He]),tt=useMemo(()=>Gesture.Tap().withTestId(j?`${j}-backdrop-gesture`:"bottom-sheet-backdrop-gesture").maxDuration(250).onEnd((e,t)=>{"worklet";t&&runOnJS(et)()}),[et,j]),ot=useMemo(()=>({snapIndex:ie,snapPoints:oe,expand:Ve,collapse:De,close:Ae,requestClose:Pe}),[ie,oe,Ve,De,Ae,Pe]);if("inline"===S&&!Se)return null;if("modal"===S&&!me)return null;const st=_jsxs(View,{collapsable:!1,style:["modal"===S?Ze.backdropModal:Ze.backdropInline,{backgroundColor:T.colors.background.overlay}],onLayout:H,testID:j,accessibilityViewIsModal:I??Qe,children:[_jsx(GestureDetector,{gesture:tt,children:_jsx(Animated.View,{style:StyleSheet.absoluteFill,accessibilityRole:"button",accessibilityLabel:"Close bottom sheet"})}),_jsx(Animated.View,{accessibilityRole:"alert",accessibilityLabel:_,accessibilityViewIsModal:I??Qe,style:[Ze.sheet,{height:ne,backgroundColor:T.colors.background.elevated,borderTopLeftRadius:T.radius["2xl"],borderTopRightRadius:T.radius["2xl"],...smoothCorners,...T.shadows.xl},B?{height:We,left:(O-E)/2,right:void 0,width:E,borderBottomLeftRadius:T.radius["2xl"],borderBottomRightRadius:T.radius["2xl"]}:null,y,Xe],children:_jsxs(SheetBody,{style:[Ze.body,Ue],keyboardOffset:qe,children:[B?_jsx(View,{style:{height:T.spacing.md}}):_jsx(GestureDetector,{gesture:ze,children:_jsx(View,{style:Ze.handleRow,onLayout:J?Y:void 0,accessible:!0,accessibilityLabel:"Drag handle",accessibilityHint:"Drag up or down to resize the sheet, or swipe down to close it",testID:j?`${j}-handle`:"bottom-sheet-handle",children:_jsx(View,{style:[Ze.handle,{backgroundColor:T.components.bottomSheet?.handleColor??T.colors.border.primary},v]})})}),null!=w&&_jsx(View,{style:[Ze.header,x],onLayout:J?q:void 0,children:w}),c?_jsx(GestureDetector,{gesture:Je,children:_jsx(ScrollView,{ref:d,style:Ze.scrollContent,onScroll:h,onContentSizeChange:te,onLayout:f,scrollEventThrottle:b,keyboardShouldPersistTaps:"always",keyboardDismissMode:"none",children:R})}):_jsx(View,{style:Ze.content,children:J?_jsx(View,{onLayout:K,children:R}):R}),null!=C&&_jsx(View,{style:[Ze.footer,k],onLayout:J?Q:void 0,children:C})]})})]}),nt=_jsx(BottomSheetContext.Provider,{value:ot,children:st});return"modal"===S?_jsx(Modal,{transparent:!0,visible:de,onRequestClose:Be,onDismiss:"ios"===Platform.OS?Te:void 0,statusBarTranslucent:!0,navigationBarTranslucent:!0,animationType:"none",supportedOrientations:["portrait","landscape"],children:_jsxs(SafeAreaProvider,{style:Ze.modalRoot,children:[_jsx(InsetsProbe,{onChange:L}),"android"===Platform.OS?_jsx(GestureHandlerRootView,{style:Ze.modalRoot,children:nt}):nt,_jsx(ToastHost,{})]})}):nt}),InsetsProbe=({onChange:e})=>{const{top:t,bottom:o}=useSafeAreaInsets();return useEffect(()=>{e(e=>e.top===t&&e.bottom===o?e:{top:t,bottom:o})},[t,o,e]),null},SheetBody=({style:e,keyboardOffset:t,children:o})=>{const s=useSafeAreaInsets().bottom,n=useAnimatedStyle(()=>{const e=s+t.value;return{paddingBottom:e>0?e:0}});return _jsx(Animated.View,{style:[e,n],children:o})};BottomSheet.displayName="BottomSheet";const useMeasuredHeight=()=>{const[e,t]=useState(0),o=useCallback(e=>{t(t=>t===e?t:e)},[]);return[e,useCallback(e=>o(e.nativeEvent.layout.height),[o]),o]},resolveSnapPoints=(e,t,o)=>[...e.map(e=>{if("number"==typeof e)return e;if("content"===e)return o;const s=parseFloat(e);return Number.isNaN(s)?0:s/100*t})].sort((e,t)=>e-t),clamp=(e,t,o)=>Math.min(Math.max(e,t),o),buildStyles=e=>StyleSheet.create({backdropModal:{flex:1},backdropInline:{...StyleSheet.absoluteFill},sheet:{position:"absolute",left:0,right:0,overflow:"hidden"},body:{overflow:"hidden"},handleRow:{alignItems:"center",justifyContent:"center",alignSelf:"stretch",paddingTop:12,paddingBottom:24},header:{},footer:{},handle:{width:36,height:4,borderRadius:2,...smoothCorners},content:{flex:1,overflow:"hidden"},scrollContent:{flex:1},modalRoot:{flex:1}});export{BottomSheet};export default BottomSheet;
+"use strict";import{createContext,forwardRef,useCallback,useContext,useEffect,useImperativeHandle,useMemo,useRef,useState}from"react";import{Dimensions,Modal,Platform,ScrollView,StyleSheet,useWindowDimensions,View}from"react-native";import{Gesture,GestureDetector,GestureHandlerRootView}from"react-native-gesture-handler";import{useReanimatedKeyboardAnimation}from"react-native-keyboard-controller";import Animated,{Easing,runOnJS,useAnimatedStyle,useDerivedValue,useSharedValue,withSpring,withTiming}from"react-native-reanimated";import{useSafeAreaInsets}from"react-native-safe-area-context";import{useTheme}from"../../theme/index.js";import{triggerHaptic}from"../../utils/index.js";import{smoothCorners}from"../../utils/corners.js";import{ModalSafeArea,useModalInsets}from"../ModalSafeArea/ModalSafeArea.js";import{ToastHost}from"../Toast/ToastProvider.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const TABLET_MIN_SHORT_SIDE=600,DIALOG_MAX_WIDTH=560,BottomSheetContext=createContext(null);export const useBottomSheet=()=>{const e=useContext(BottomSheetContext);if(!e)throw new Error("useBottomSheet must be used inside a <BottomSheet>.");return e};const SPRING_CONFIG={damping:20,stiffness:240,mass:1},CLOSE_VELOCITY_THRESHOLD=1e3,DRAG_ACTIVATION_OFFSET=10,BottomSheet=forwardRef((e,t)=>{const{snapPoints:o,index:s,onChange:n,onAnimate:r,onAfterClose:a,enablePanDownToClose:l=!0,enableBackdropPress:i=!0,confirmDismiss:u,scrollable:c=!1,scrollRef:d,onScroll:h,onContentSizeChange:m,onScrollLayout:f,scrollEventThrottle:b,keyboardBehavior:S="shift",mode:p="modal",presentation:g="sheet",handleIndicatorStyle:y,containerStyle:v,header:w,footer:x,headerStyle:C,footerStyle:k,children:R,accessibilityLabel:M,accessibilityViewIsModal:I,testID:_}=e,j=useTheme(),T=useSafeAreaInsets(),[V,D]=useState(()=>Dimensions.get("window").height),[O,A]=useState(()=>Dimensions.get("window").width),H=useCallback(e=>{const{height:t,width:o}=e.nativeEvent.layout;t>0&&D(e=>e===t?e:t),o>0&&A(e=>e===o?e:o)},[]),B=useWindowDimensions(),E="dialog"===g||"auto"===g&&Math.min(B.width,B.height)>=600,P=Math.min(560,O-2*j.spacing.xl),[G,L]=useModalInsets(),N="modal"===p?G.top:T.top,F="modal"===p?G.bottom:T.bottom,J=o.includes("content"),[z,Y]=useMeasuredHeight(),[$,q]=useMeasuredHeight(),[W,K,X]=useMeasuredHeight(),[U,Q]=useMeasuredHeight(),Z=E?j.spacing.md:z,ee=J?Math.min(Z+(null!=w?$:0)+W+(null!=x?U:0)+F,V-N):0,te=useCallback((e,t)=>{J&&X(t),m?.(e,t)},[J,m,X]),oe=useMemo(()=>resolveSnapPoints(o,V,ee),[o,V,ee]),se=V,ne=oe[oe.length-1]??0,re=useSharedValue(se),ae=useSharedValue(se),le=useSharedValue(-1),[ie,ue]=useState(-1),ce=useRef(!1),[de,he]=useState(!1),[me,fe]=useState(!1),be=useRef(!1),Se=useRef(a);Se.current=a;const[pe,ge]=useState(!1),ye=useRef(-1),ve=useRef(!1);ve.current="modal"===p?me:pe;const we=useRef(u);we.current=u;const xe=useRef(!1),Ce=useRef(!0),ke=useRef([]),Re=useCallback(e=>{const t=ke.current;ke.current=[];for(const o of t)o(e)},[]);useEffect(()=>(Ce.current=!0,()=>{Ce.current=!1,Re(!1)}),[Re]);const Me=useCallback(e=>{if(e<0||e>=oe.length)return se;const t=oe[e];return E?(V-t)/2:V-t},[oe,V,se,E]),Ie=useCallback(e=>{ye.current=e;ie!==e&&(ue(e),le.value=e,n?.(e))},[ie,le,n]),je=useCallback(()=>{ce.current=!1,le.value<0&&(be.current=!0,"modal"===p?(he(!1),"ios"!==Platform.OS&&fe(!1)):ge(!1))},[p,le]),Te=useCallback(()=>{be.current&&fe(!1)},[]);useEffect(()=>{("modal"===p?!me:!pe)&&be.current&&(be.current=!1,Se.current?.(),Re(!0))},[p,me,pe,Re]);const Ve=useCallback((e,t,o)=>{ce.current=!0,r?.(t,o),re.value=withSpring(e,SPRING_CONFIG,e=>{"worklet";e&&runOnJS(je)()})},[r,re,je]),De=useCallback(e=>{const t="number"==typeof e?clamp(e,0,oe.length-1):ie>=0?ie:0,o=le.value,s=Me(t);be.current=!1,Re(!1),"modal"===p?(fe(!0),he(!0)):ge(!0),o<0&&(re.value=se),Ie(t),Ve(s,o,t)},[Ve,se,ie,le,p,oe.length,Ie,Re,re,Me]),Oe=useCallback(()=>{if(0===oe.length)return;const e=le.value,t=Me(0);Ie(0),Ve(t,e,0)},[Ve,le,oe.length,Ie,Me]),Ae=useCallback(()=>new Promise(e=>{if(ye.current<0)return void(ve.current?ke.current.push(e):e(!0));ke.current.push(e);const t=le.value;Ie(-1),ce.current=!0,r?.(t,-1),re.value=withTiming(se,{duration:j.motion.duration.fast,easing:Easing.bezier(...j.motion.easing.accelerate)},e=>{"worklet";e&&runOnJS(je)()})}),[se,le,je,r,Ie,re,j.motion.duration.fast,j.motion.easing.accelerate]),He=useCallback(async()=>{await Ae()},[Ae]),Be=useCallback((e,t,o)=>{const s=we.current;if(!s)return void e();if(xe.current)return void t?.();const n=s();"boolean"!=typeof n?(xe.current=!0,o?.(),n.then(o=>{xe.current=!1,o&&Ce.current&&ye.current>=0?e():t?.()},e=>{throw xe.current=!1,e})):(n?e:t)?.()},[]),Ee=useCallback(()=>new Promise(e=>{ye.current<0?Ae().then(e):Be(()=>{Ae().then(e)},()=>e(!1))}),[Ae,Be]),Pe=useCallback(()=>{Be(()=>{He()})},[He,Be]);useImperativeHandle(t,()=>({expand:De,collapse:Oe,close:He,requestClose:Ee}),[De,Oe,He,Ee]),useEffect(()=>{"number"==typeof s&&s!==ie&&(-1===s?He():De(s))},[s]);const Ge=useRef({hostHeight:V,contentSnap:ee});useEffect(()=>{const e=Ge.current;e.hostHeight===V&&e.contentSnap===ee||(Ge.current={hostHeight:V,contentSnap:ee},e.hostHeight===V&&le.value<0||(re.value=withSpring(Me(le.value),SPRING_CONFIG)))},[V,ee]);const Le=V-ne,Ne=useMemo(()=>oe.map(e=>V-e),[oe,V]),Fe=useCallback(()=>{const e=ye.current;e<0||Ve(Me(e),e,e)},[Ve,Me]),Je=useCallback((e,t)=>{const o=le.value;-1!==e?(Ie(e),Ve(t,o,e)):Be(()=>{triggerHaptic("selection"),He()},Fe,Fe)},[Ve,He,le,Be,Ie,Fe]),ze=useMemo(()=>Gesture.Native().withTestId(_?`${_}-content-gesture`:"bottom-sheet-content-gesture"),[_]),Ye=useMemo(()=>{const e=Ne,t=se,o=Le,s=l;return Gesture.Pan().withTestId(_?`${_}-pan-gesture`:"bottom-sheet-pan-gesture").activeOffsetY([-10,10]).failOffsetX([-15,15]).onStart(()=>{"worklet";ae.value=re.value}).onUpdate(e=>{"worklet";const t=ae.value+e.translationY;re.value=t<o?o+.25*(t-o):t}).onEnd(o=>{"worklet";const n=re.value;if(o.velocityY>1e3)return s?void runOnJS(Je)(-1,t):void runOnJS(Je)(0,e[0]);let r=0,a=Math.abs(n-e[0]);for(let t=1;t<e.length;t++){const o=Math.abs(n-e[t]);o<a&&(a=o,r=t)}const l=e[0];s&&n-l>80?runOnJS(Je)(-1,t):runOnJS(Je)(r,e[r])})},[se,ae,l,Je,Le,Ne,_,re]),{height:$e}=useReanimatedKeyboardAnimation(),qe="shift"===S,We=useDerivedValue(()=>qe?$e.value:0),Ke=oe[ie>=0?ie:0]??ne,Xe=j.spacing.md,Ue=useAnimatedStyle(()=>{if(E){const e=We.value,t=V+e-Ke-Xe,o=e<0&&re.value>t?t:re.value;return{top:o<N?N:o}}const e=re.value+We.value,t=We.value<0?N:Le;return{top:e<t?t:e}}),Qe=useAnimatedStyle(()=>{const e=We.value;if(E){const t=V+e-Ke-Xe,o=e<0&&re.value>t?t:re.value,s=V+e-Xe-(o<N?N:o);return{height:s<0?0:s>Ke?Ke:s}}const t=e<0?N:Le,o=re.value+e,s=V+e-(o<t?t:o);return{height:s<0?0:s>ne?ne:s}}),Ze=ie>=0,et=useMemo(()=>buildStyles(j),[j]),tt=useCallback(()=>{i&&Be(()=>{triggerHaptic("selection"),He()})},[i,He,Be]),ot=useMemo(()=>Gesture.Tap().withTestId(_?`${_}-backdrop-gesture`:"bottom-sheet-backdrop-gesture").maxDuration(250).onEnd((_e,e)=>{"worklet";e&&runOnJS(tt)()}),[tt,_]),st=useMemo(()=>({snapIndex:ie,snapPoints:oe,expand:De,collapse:Oe,close:He,requestClose:Ee}),[ie,oe,De,Oe,He,Ee]);if("inline"===p&&!pe)return null;if("modal"===p&&!me)return null;const nt=_jsxs(View,{collapsable:!1,style:["modal"===p?et.backdropModal:et.backdropInline,{backgroundColor:j.colors.background.overlay}],onLayout:H,testID:_,accessibilityViewIsModal:I??Ze,children:[_jsx(GestureDetector,{gesture:ot,children:_jsx(Animated.View,{style:StyleSheet.absoluteFill,accessibilityRole:"button",accessibilityLabel:"Close bottom sheet"})}),_jsx(Animated.View,{accessibilityRole:"alert",accessibilityLabel:M,accessibilityViewIsModal:I??Ze,style:[et.sheet,{height:ne,backgroundColor:j.colors.background.elevated,borderTopLeftRadius:j.radius["2xl"],borderTopRightRadius:j.radius["2xl"],...smoothCorners,...j.shadows.xl},E?{height:Ke,left:(O-P)/2,right:void 0,width:P,borderBottomLeftRadius:j.radius["2xl"],borderBottomRightRadius:j.radius["2xl"]}:null,v,Ue],children:_jsxs(SheetBody,{style:[et.body,Qe],keyboardOffset:We,children:[E?_jsx(View,{style:{height:j.spacing.md}}):_jsx(GestureDetector,{gesture:Ye,children:_jsx(View,{style:et.handleRow,onLayout:J?Y:void 0,accessible:!0,accessibilityLabel:"Drag handle",accessibilityHint:"Drag up or down to resize the sheet, or swipe down to close it",testID:_?`${_}-handle`:"bottom-sheet-handle",children:_jsx(View,{style:[et.handle,{backgroundColor:j.components.bottomSheet?.handleColor??j.colors.border.primary},y]})})}),null!=w&&_jsx(View,{style:[et.header,C],onLayout:J?q:void 0,children:w}),c?_jsx(GestureDetector,{gesture:ze,children:_jsx(ScrollView,{ref:d,style:et.scrollContent,onScroll:h,onContentSizeChange:te,onLayout:f,scrollEventThrottle:b,keyboardShouldPersistTaps:"always",keyboardDismissMode:"none",children:R})}):_jsx(View,{style:et.content,children:J?_jsx(View,{onLayout:K,children:R}):R}),null!=x&&_jsx(View,{style:[et.footer,k],onLayout:J?Q:void 0,children:x})]})})]}),rt=_jsx(BottomSheetContext.Provider,{value:st,children:nt});return"modal"===p?_jsx(Modal,{transparent:!0,visible:de,onRequestClose:Pe,onDismiss:"ios"===Platform.OS?Te:void 0,statusBarTranslucent:!0,navigationBarTranslucent:!0,animationType:"none",supportedOrientations:["portrait","landscape"],children:_jsxs(ModalSafeArea,{onInsets:L,children:["android"===Platform.OS?_jsx(GestureHandlerRootView,{style:et.modalRoot,children:rt}):rt,_jsx(ToastHost,{})]})}):rt}),SheetBody=({style:e,keyboardOffset:t,children:o})=>{const s=useSafeAreaInsets().bottom,n=useAnimatedStyle(()=>{const e=s+t.value;return{paddingBottom:e>0?e:0}});return _jsx(Animated.View,{style:[e,n],children:o})};BottomSheet.displayName="BottomSheet";const useMeasuredHeight=()=>{const[e,t]=useState(0),o=useCallback(e=>{t(t=>t===e?t:e)},[]);return[e,useCallback(e=>o(e.nativeEvent.layout.height),[o]),o]},resolveSnapPoints=(e,t,o)=>[...e.map(e=>{if("number"==typeof e)return e;if("content"===e)return o;const s=parseFloat(e);return Number.isNaN(s)?0:s/100*t})].sort((e,t)=>e-t),clamp=(e,t,o)=>Math.min(Math.max(e,t),o),buildStyles=e=>StyleSheet.create({backdropModal:{flex:1},backdropInline:{...StyleSheet.absoluteFill},sheet:{position:"absolute",left:0,right:0,overflow:"hidden"},body:{overflow:"hidden"},handleRow:{alignItems:"center",justifyContent:"center",alignSelf:"stretch",paddingTop:12,paddingBottom:24},header:{},footer:{},handle:{width:36,height:4,borderRadius:2,...smoothCorners},content:{flex:1,overflow:"hidden"},scrollContent:{flex:1},modalRoot:{flex:1}});export{BottomSheet};export default BottomSheet;

package/lib/module/components/Card/Card.js

@@ -1 +1 @@
-"use strict";import React,{forwardRef,useMemo}from"react";import{Animated,Image,Pressable,StyleSheet,View}from"react-native";import{useControllableState}from"../../hooks/useControllableState.js";import{usePressAnimation}from"../../hooks/usePressAnimation.js";import{Gradient,useTheme}from"../../theme/index.js";import{smoothCorners}from"../../utils/corners.js";import{resolveHaptic,triggerHaptic}from"../../utils/hapticUtils.js";import{mergeRefs}from"../../utils/mergeRefs.js";import{supportsBoxShadow,toBoxShadow}from"../../utils/shadows.js";import{squircleHostRadius}from"../../utils/squircle.js";import{AppIcon}from"../AppIcon/AppIcon.js";import{useContextMenu}from"../Menu/useContextMenu.js";import{Skeleton,SkeletonText}from"../Skeleton/index.js";import{SquircleFill,useSquircle}from"../SquircleFill/SquircleFill.js";import{Text}from"../Text/index.js";import{jsx as _jsx,jsxs as _jsxs,Fragment as _Fragment}from"react/jsx-runtime";const paddingMap={none:"none",sm:"sm",md:"lg",lg:"xl",xl:"2xl"},Card=forwardRef((e,t)=>{const{children:o,variant:i="elevated",elevation:r="sm",radius:s="lg",padding:l="md",interactive:a=!1,bg:n,header:d,title:c,lead:u,action:h,headerActions:m,collapsible:p=!1,collapsed:g,defaultCollapsed:b=!1,onCollapsedChange:y,collapsedSummary:x,onRemove:f,removeLabel:S="Remove",separatorHeight:v=StyleSheet.hairlineWidth,footer:j,imageSource:w,imageHeight:C=160,imageAspectRatio:_,imageOverlay:R,loading:k=!1,gradient:A,onPress:T,haptic:B,contextMenu:H,accessibilityLabel:I,accessibilityHint:L,accessibilityRole:P,style:V,containerStyle:F,headerStyle:M,bodyStyle:z,footerStyle:q,borderRadius:W,testID:D,onLayout:O,...E}=e,N=useTheme(),G=a||"function"==typeof T,$=useContextMenu(H,{haptic:B,testID:D,accessibilityActions:E.accessibilityActions,onAccessibilityAction:E.onAccessibilityAction}),U=useMemo(()=>mergeRefs(t,$.hostRef),[t,$.hostRef]),J=G||$.enabled,{scale:K,pressIn:Q,pressOut:X}=usePressAnimation({enabled:J}),Y=useMemo(()=>buildStyles(N),[N]),Z=Boolean(w),ee=N.spacing[paddingMap[l]],te=useMemo(()=>A?"string"==typeof A?N.gradients[A]??null:A:null,[A,N.gradients]),oe="flat"===i,ie=oe?0:W??N.radius[s],re=resolveBackground(N,n),[se,le]=useControllableState({value:g,defaultValue:b,onChange:y}),ae=p&&se,ne=hasBuiltInHeaderContent(e),de=Boolean(d)||ne,ce=useSquircle(!Z&&!te&&!oe,ie,O),ue=StyleSheet.flatten([V,F])??{},he=ue.backgroundColor,me=ue.borderColor,pe=he??re??("filled"===i?N.colors.background.secondary:N.colors.background.elevated),ge="outlined"===i?N.colors.border.width:0,be=me??N.colors.border.primary,ye="elevated"===i&&supportsBoxShadow()?toBoxShadow(N.shadows[r]):void 0,xe=ce.active&&"elevated"===i&&!ye,fe=ce.active&&!xe?{backgroundColor:"transparent",borderColor:"transparent"}:null,Se=useMemo(()=>{const e={borderRadius:xe&&ce.size?squircleHostRadius(ce.size.width,ce.size.height,ie):ie,...smoothCorners,padding:Z?0:ee,overflow:ce.active?"visible":"hidden"};switch(i){case"flat":return{...e,backgroundColor:re??N.colors.background.elevated,borderBottomWidth:v,borderBottomColor:N.colors.border.primary};case"outlined":return{...e,backgroundColor:ce.active?"transparent":re??N.colors.background.elevated,borderWidth:N.colors.border.width,borderColor:ce.active?"transparent":N.colors.border.primary};case"filled":return{...e,backgroundColor:ce.active?"transparent":re??N.colors.background.secondary};default:return{...e,backgroundColor:re??N.colors.background.elevated,...ye?{boxShadow:ye}:N.shadows[r]}}},[N,i,r,ie,Z,ee,ce.active,ce.size,ye,xe,re,v]),ve=useMemo(()=>({..."number"==typeof _?{width:"100%",aspectRatio:_}:{width:"100%",height:C},borderTopLeftRadius:ie,borderTopRightRadius:ie,borderBottomLeftRadius:0,borderBottomRightRadius:0,...smoothCorners}),[ie,_,C]),je="string"==typeof c?c:"",we=_jsxs(_Fragment,{children:[_jsxs(View,{style:Y.titleColumn,children:["string"==typeof c?_jsx(Text,{variant:"title",accessibilityRole:"header",children:c}):c,u?_jsx(Text,{variant:"bodySmall",style:Y.lead,children:u}):null,ae&&x?_jsx(Text,{variant:"caption",style:Y.lead,children:x}):null]}),isCardTextAction(h)?_jsx(CardTextActionButton,{action:h,haptic:B}):h?_jsx(View,{style:Y.actionNode,children:h}):null,m,p?_jsx(CardIconAction,{icon:ae?"chevron-down":"chevron-up",label:`${ae?"Show":"Hide"} ${je}`.trim(),expanded:!ae,onPress:()=>le(!ae),haptic:B}):null,f?_jsx(CardIconAction,{icon:"trash",label:S,onPress:f,color:N.colors.toneText.error,haptic:B}):null]}),Ce=_jsxs(_Fragment,{children:[de?_jsx(View,{style:[Y.header,!d&&Y.headerRow,ae&&Y.headerFolded,M],children:d??we}):null,ae?null:_jsx(View,{style:[de||j?Y.body:null,z],children:o}),j&&!ae?_jsx(View,{style:[Y.footer,q],children:j}):null]}),_e=Z?_jsxs(_Fragment,{children:[_jsxs(View,{style:Y.imageWrapper,children:[_jsx(Image,{source:w,resizeMode:"cover",style:ve,accessibilityLabel:"",accessible:!1}),R?_jsx(View,{pointerEvents:"box-none",style:Y.imageOverlay,children:R}):null]}),_jsx(View,{style:{padding:ee},children:Ce})]}):Ce,Re=te?_jsxs(_Fragment,{children:[_jsx(Gradient,{gradient:te,style:StyleSheet.absoluteFill}),_e]}):ce.active&&ce.size?_jsxs(_Fragment,{children:[_jsx(SquircleFill,{width:ce.size.width,height:ce.size.height,radius:ie,fill:pe,stroke:ge?be:void 0,strokeWidth:ge,outset:ge}),_e]}):_e;let ke;if(J){const handlePress=e=>{if(!G)return;const t=resolveHaptic(B,"selection");t&&triggerHaptic(t),T?.(e)};ke=_jsx(Animated.View,{style:[{transform:[{scale:K}]}],children:_jsx(Pressable,{ref:U,onPress:handlePress,onPressIn:Q,onPressOut:X,android_ripple:{color:N.colors.surface.pressed,borderless:!1},accessibilityRole:P??(G?"button":void 0),accessibilityLabel:I,accessibilityHint:L,testID:D,onLayout:ce.onLayout,style:[Se,V,F,fe],...E,...$.hostProps,children:Re})})}else ke=_jsx(View,{ref:t,accessibilityLabel:I,accessibilityHint:L,accessibilityRole:P,testID:D,onLayout:ce.onLayout,style:[Se,V,F,fe],...E,children:Re});return k?_jsx(CardSkeleton,{...e}):$.enabled?_jsxs(_Fragment,{children:[ke,$.renderSurface(_jsx(View,{style:[Se,V,F,fe,Y.preview],children:Re}))]}):ke});Card.displayName="Card";const CardSkeleton=({variant:e="elevated",elevation:t,radius:o="lg",padding:i="md",bg:r,header:s,footer:l,imageSource:a,imageHeight:n=160,imageAspectRatio:d,borderRadius:c,containerStyle:u,headerStyle:h,bodyStyle:m,footerStyle:p,style:g,...b})=>{const y=useTheme(),x=paddingMap[i],f=y.spacing[x],S="flat"===e?0:c??y.radius[o],v=void 0!==s||hasBuiltInHeaderContent(b),j=resolveBackground(y,r)??y.colors.background.elevated,w="outlined"===e?1:0,C="outlined"===e?y.colors.border.primary:void 0;return _jsxs(View,{style:[{backgroundColor:j,borderRadius:S,...smoothCorners,borderWidth:w,borderColor:C,overflow:"hidden"},u,g],accessibilityRole:"progressbar",accessibilityLabel:"Loading",accessibilityState:{busy:!0},"aria-busy":!0,children:[void 0!==a?_jsx(Skeleton,{width:"100%",height:d?void 0:n,style:d?{aspectRatio:d,width:"100%"}:void 0}):null,v?_jsx(View,{style:[{padding:f,paddingBottom:y.spacing.sm},h],children:_jsx(Skeleton,{shape:"text",width:"60%",height:18})}):null,_jsx(View,{style:[{padding:f},m],children:_jsx(SkeletonText,{lines:3,fontSize:14,lastLineWidth:"55%"})}),void 0!==l?_jsx(View,{style:[{padding:f,paddingTop:y.spacing.sm,flexDirection:"row"},p],children:_jsx(Skeleton,{width:88,height:32,shape:"rounded"})}):null]})};CardSkeleton.displayName="CardSkeleton",Card.Skeleton=CardSkeleton;const hasBuiltInHeaderContent=e=>Boolean(e.title||e.lead||e.action||e.headerActions||e.collapsible||e.onRemove),isCardTextAction=e=>"object"==typeof e&&null!==e&&!React.isValidElement(e)&&"label"in e&&"onPress"in e,HIT_TARGET=44,CardIconAction=({icon:e,label:t,onPress:o,expanded:i,color:r,haptic:s})=>{const l=useTheme();return _jsx(Pressable,{accessibilityRole:"button",accessibilityLabel:t,accessibilityState:void 0===i?void 0:{expanded:i},"aria-expanded":i,onPress:()=>{const e=resolveHaptic(s,"selection");e&&triggerHaptic(e),o()},style:iconActionStyle,children:_jsx(AppIcon,{name:e,size:20,color:r??l.colors.text.primary})})},CardTextActionButton=({action:e,haptic:t})=>{const o=useTheme();return _jsx(Pressable,{accessibilityRole:"button",accessibilityLabel:e.accessibilityLabel??e.label,onPress:()=>{const o=resolveHaptic(t,"selection");o&&triggerHaptic(o),e.onPress()},style:textActionStyle,children:_jsx(Text,{variant:"label",weight:"semibold",color:o.colors.primary,children:e.label})})},iconActionStyle={width:44,height:44,alignItems:"center",justifyContent:"center"},textActionStyle={minWidth:44,minHeight:44,alignItems:"center",justifyContent:"center"},resolveBackground=(e,t)=>{if(null==t)return;return e.colors.background[t]??t},buildStyles=e=>StyleSheet.create({header:{marginBottom:e.spacing.md},headerRow:{flexDirection:"row",alignItems:"center",gap:e.spacing.sm},headerFolded:{marginBottom:0},titleColumn:{flex:1},lead:{marginTop:e.spacing.xs},actionNode:{flexShrink:0},body:{flexShrink:1},footer:{marginTop:e.spacing.md},imageWrapper:{position:"relative"},imageOverlay:{...StyleSheet.absoluteFill},preview:{margin:0,marginTop:0,marginBottom:0,marginLeft:0,marginRight:0,marginStart:0,marginEnd:0,marginHorizontal:0,marginVertical:0,position:"relative",top:0,left:0,width:"100%",height:"100%"}});export{Card};export default Card;
+"use strict";import React,{forwardRef,useMemo}from"react";import{Animated,Image,Pressable,StyleSheet,View}from"react-native";import{useControllableState}from"../../hooks/useControllableState.js";import{usePressAnimation}from"../../hooks/usePressAnimation.js";import{Gradient,useTheme}from"../../theme/index.js";import{smoothCorners}from"../../utils/corners.js";import{resolveHaptic,triggerHaptic}from"../../utils/hapticUtils.js";import{mergeRefs}from"../../utils/mergeRefs.js";import{supportsBoxShadow,toBoxShadow}from"../../utils/shadows.js";import{squircleHostRadius}from"../../utils/squircle.js";import{AppIcon}from"../AppIcon/AppIcon.js";import{useContextMenu}from"../Menu/useContextMenu.js";import{Skeleton,SkeletonText}from"../Skeleton/index.js";import{SquircleFill,useSquircle}from"../SquircleFill/SquircleFill.js";import{Text}from"../Text/index.js";import{jsx as _jsx,jsxs as _jsxs,Fragment as _Fragment}from"react/jsx-runtime";const paddingMap={none:"none",sm:"sm",md:"lg",lg:"xl",xl:"2xl"},Card=forwardRef((e,t)=>{const{children:o,variant:i="elevated",elevation:r="sm",radius:s="lg",padding:l="md",interactive:a=!1,bg:n,header:d,title:c,lead:u,action:h,headerActions:m,collapsible:p=!1,collapsed:g,defaultCollapsed:b=!1,onCollapsedChange:y,collapsedSummary:x,onRemove:f,removeLabel:S="Remove",separatorHeight:v=StyleSheet.hairlineWidth,footer:j,imageSource:w,imageHeight:C=160,imageAspectRatio:_,imageOverlay:R,loading:k=!1,gradient:A,onPress:T,haptic:B,contextMenu:H,accessibilityLabel:I,accessibilityHint:L,accessibilityRole:P,style:V,containerStyle:F,headerStyle:M,bodyStyle:z,footerStyle:q,borderRadius:W,testID:D,onLayout:O,...E}=e,N=useTheme(),G=a||"function"==typeof T,$=useContextMenu(H,{haptic:B,testID:D,accessibilityActions:E.accessibilityActions,onAccessibilityAction:E.onAccessibilityAction}),U=useMemo(()=>mergeRefs(t,$.hostRef),[t,$.hostRef]),J=G||$.enabled,{scale:K,pressIn:Q,pressOut:X}=usePressAnimation({enabled:J}),Y=useMemo(()=>buildStyles(N),[N]),Z=Boolean(w),ee=N.spacing[paddingMap[l]],te=useMemo(()=>A?"string"==typeof A?N.gradients[A]??null:A:null,[A,N.gradients]),oe="flat"===i,ie=oe?0:W??N.radius[s],re=resolveBackground(N,n),[se,le]=useControllableState({value:g,defaultValue:b,onChange:y}),ae=p&&se,ne=hasBuiltInHeaderContent(e),de=Boolean(d)||ne,ce=useSquircle(!Z&&!te&&!oe,ie,O),ue=StyleSheet.flatten([V,F])??{},he=ue.backgroundColor,me=ue.borderColor,pe=he??re??("filled"===i?N.colors.background.secondary:N.colors.background.elevated),ge="outlined"===i?N.colors.border.width:0,be=me??N.colors.border.primary,ye="elevated"===i&&supportsBoxShadow()?toBoxShadow(N.shadows[r]):void 0,xe=ce.active&&"elevated"===i&&!ye,fe=ce.active&&!xe?{backgroundColor:"transparent",borderColor:"transparent"}:null,Se=useMemo(()=>{const e={borderRadius:xe&&ce.size?squircleHostRadius(ce.size.width,ce.size.height,ie):ie,...smoothCorners,padding:Z?0:ee,overflow:ce.active?"visible":"hidden"};switch(i){case"flat":return{...e,backgroundColor:re??N.colors.background.elevated,borderBottomWidth:v,borderBottomColor:N.colors.border.primary};case"outlined":return{...e,backgroundColor:ce.active?"transparent":re??N.colors.background.elevated,borderWidth:N.colors.border.width,borderColor:ce.active?"transparent":N.colors.border.primary};case"filled":return{...e,backgroundColor:ce.active?"transparent":re??N.colors.background.secondary};default:return{...e,backgroundColor:re??N.colors.background.elevated,...ye?{boxShadow:ye}:N.shadows[r]}}},[N,i,r,ie,Z,ee,ce.active,ce.size,ye,xe,re,v]),ve=useMemo(()=>({..."number"==typeof _?{width:"100%",aspectRatio:_}:{width:"100%",height:C},borderTopLeftRadius:ie,borderTopRightRadius:ie,borderBottomLeftRadius:0,borderBottomRightRadius:0,...smoothCorners}),[ie,_,C]),je="string"==typeof c?c:"",we=_jsxs(_Fragment,{children:[_jsxs(View,{style:Y.titleColumn,children:["string"==typeof c?_jsx(Text,{variant:"title",accessibilityRole:"header",children:c}):c,u?_jsx(Text,{variant:"bodySmall",style:Y.lead,children:u}):null,ae&&x?_jsx(Text,{variant:"caption",style:Y.lead,children:x}):null]}),isCardTextAction(h)?_jsx(CardTextActionButton,{action:h,haptic:B}):h?_jsx(View,{style:Y.actionNode,children:h}):null,m,p?_jsx(CardIconAction,{icon:ae?"chevron-down":"chevron-up",label:`${ae?"Show":"Hide"} ${je}`.trim(),expanded:!ae,onPress:()=>le(!ae),haptic:B}):null,f?_jsx(CardIconAction,{icon:"trash",label:S,onPress:f,color:N.colors.toneText.error,haptic:B}):null]}),Ce=_jsxs(_Fragment,{children:[de?_jsx(View,{style:[Y.header,!d&&Y.headerRow,ae&&Y.headerFolded,M],children:d??we}):null,ae?null:_jsx(View,{style:[de||j?Y.body:null,z],children:o}),j&&!ae?_jsx(View,{style:[Y.footer,q],children:j}):null]}),Re=Z?_jsxs(_Fragment,{children:[_jsxs(View,{style:Y.imageWrapper,children:[_jsx(Image,{source:w,resizeMode:"cover",style:ve,accessibilityLabel:"",accessible:!1}),R?_jsx(View,{pointerEvents:"box-none",style:Y.imageOverlay,children:R}):null]}),_jsx(View,{style:{padding:ee},children:Ce})]}):Ce,ke=te?_jsxs(_Fragment,{children:[_jsx(Gradient,{gradient:te,style:StyleSheet.absoluteFill}),Re]}):ce.active&&ce.size?_jsxs(_Fragment,{children:[_jsx(SquircleFill,{width:ce.size.width,height:ce.size.height,radius:ie,fill:pe,stroke:ge?be:void 0,strokeWidth:ge,outset:ge}),Re]}):Re;let Ae;if(J){const handlePress=e=>{if(!G)return;const t=resolveHaptic(B,"selection");t&&triggerHaptic(t),T?.(e)};Ae=_jsx(Animated.View,{style:[{transform:[{scale:K}]}],children:_jsx(Pressable,{ref:U,onPress:handlePress,onPressIn:Q,onPressOut:X,android_ripple:{color:N.colors.surface.pressed,borderless:!1},accessibilityRole:P??(G?"button":void 0),accessibilityLabel:I,accessibilityHint:L,testID:D,onLayout:ce.onLayout,style:[Se,V,F,fe],...E,...$.hostProps,children:ke})})}else Ae=_jsx(View,{ref:t,accessibilityLabel:I,accessibilityHint:L,accessibilityRole:P,testID:D,onLayout:ce.onLayout,style:[Se,V,F,fe],...E,children:ke});return k?_jsx(CardSkeleton,{...e}):$.enabled?_jsxs(_Fragment,{children:[Ae,$.renderSurface(_jsx(View,{style:[Se,V,F,fe,Y.preview],children:ke}))]}):Ae});Card.displayName="Card";const CardSkeleton=({variant:e="elevated",elevation:t,radius:o="lg",padding:i="md",bg:r,header:s,footer:l,imageSource:a,imageHeight:n=160,imageAspectRatio:d,borderRadius:c,containerStyle:u,headerStyle:h,bodyStyle:m,footerStyle:p,style:g,...b})=>{const y=useTheme(),x=paddingMap[i],f=y.spacing[x],S="flat"===e?0:c??y.radius[o],v=void 0!==s||hasBuiltInHeaderContent(b),j=resolveBackground(y,r)??y.colors.background.elevated,w="outlined"===e?1:0,C="outlined"===e?y.colors.border.primary:void 0;return _jsxs(View,{style:[{backgroundColor:j,borderRadius:S,...smoothCorners,borderWidth:w,borderColor:C,overflow:"hidden"},u,g],accessibilityRole:"progressbar",accessibilityLabel:"Loading",accessibilityState:{busy:!0},"aria-busy":!0,children:[void 0!==a?_jsx(Skeleton,{width:"100%",height:d?void 0:n,style:d?{aspectRatio:d,width:"100%"}:void 0}):null,v?_jsx(View,{style:[{padding:f,paddingBottom:y.spacing.sm},h],children:_jsx(Skeleton,{shape:"text",width:"60%",height:18})}):null,_jsx(View,{style:[{padding:f},m],children:_jsx(SkeletonText,{lines:3,fontSize:14,lastLineWidth:"55%"})}),void 0!==l?_jsx(View,{style:[{padding:f,paddingTop:y.spacing.sm,flexDirection:"row"},p],children:_jsx(Skeleton,{width:88,height:32,shape:"rounded"})}):null]})};CardSkeleton.displayName="CardSkeleton",Card.Skeleton=CardSkeleton;const hasBuiltInHeaderContent=e=>Boolean(e.title||e.lead||e.action||e.headerActions||e.collapsible||e.onRemove),isCardTextAction=e=>"object"==typeof e&&null!==e&&!React.isValidElement(e)&&"label"in e&&"onPress"in e,HIT_TARGET=44,CardIconAction=({icon:e,label:t,onPress:o,expanded:i,color:r,haptic:s})=>{const l=useTheme();return _jsx(Pressable,{accessibilityRole:"button",accessibilityLabel:t,accessibilityState:void 0===i?void 0:{expanded:i},"aria-expanded":i,onPress:()=>{const e=resolveHaptic(s,"selection");e&&triggerHaptic(e),o()},style:iconActionStyle,children:_jsx(AppIcon,{name:e,size:20,color:r??l.colors.text.primary})})},CardTextActionButton=({action:e,haptic:t})=>{const o=useTheme();return _jsx(Pressable,{accessibilityRole:"button",accessibilityLabel:e.accessibilityLabel??e.label,onPress:()=>{const o=resolveHaptic(t,"selection");o&&triggerHaptic(o),e.onPress()},style:textActionStyle,children:_jsx(Text,{variant:"label",weight:"semibold",color:o.colors.primary,children:e.label})})},iconActionStyle={width:44,height:44,alignItems:"center",justifyContent:"center"},textActionStyle={minWidth:44,minHeight:44,alignItems:"center",justifyContent:"center"},resolveBackground=(e,t)=>{if(null==t)return;return e.colors.background[t]??t},buildStyles=e=>StyleSheet.create({header:{marginBottom:e.spacing.md},headerRow:{flexDirection:"row",alignItems:"center",gap:e.spacing.sm},headerFolded:{marginBottom:0},titleColumn:{flex:1},lead:{marginTop:e.spacing.xs},actionNode:{flexShrink:0},body:{flexShrink:1},footer:{marginTop:e.spacing.md},imageWrapper:{position:"relative"},imageOverlay:{...StyleSheet.absoluteFill},preview:{margin:0,marginTop:0,marginBottom:0,marginLeft:0,marginRight:0,marginStart:0,marginEnd:0,marginHorizontal:0,marginVertical:0,position:"relative",top:0,left:0,width:"100%",height:"100%"}});export{Card};export default Card;

package/lib/module/components/Chip/Chip.js

@@ -1 +1 @@
-"use strict";import{forwardRef,useMemo}from"react";import{Animated,Pressable,StyleSheet,Text,View}from"react-native";import{usePressAnimation}from"../../hooks/usePressAnimation.js";import{fontFor,useTheme}from"../../theme/index.js";import{tintOf}from"../../utils/color.js";import{smoothCorners}from"../../utils/corners.js";import{resolveHaptic,triggerHaptic}from"../../utils/hapticUtils.js";import{renderSlotIcon}from"../AppIcon/slotIcon.js";import{Skeleton}from"../Skeleton/index.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const toneFor=(e,r)=>{switch(r){case"primary":return{base:e.colors.primaryMuted,on:e.colors.primary,ink:e.colors.toneText.primary,border:e.colors.primary,selectedBg:e.colors.primaryMuted,selectedOn:e.colors.primary,selectedInk:e.colors.toneText.primary,selectedBorder:e.colors.primary};case"success":return{base:e.colors.background.tertiary,on:e.colors.success,ink:e.colors.toneText.success,border:e.colors.success,selectedBg:e.colors.primaryMuted,selectedOn:e.colors.primary,selectedInk:e.colors.toneText.primary,selectedBorder:e.colors.primary};case"warning":return{base:e.colors.background.tertiary,on:e.colors.warning,ink:e.colors.toneText.warning,border:e.colors.warning,selectedBg:e.colors.primaryMuted,selectedOn:e.colors.primary,selectedInk:e.colors.toneText.primary,selectedBorder:e.colors.primary};case"error":return{base:e.colors.background.tertiary,on:e.colors.error,ink:e.colors.toneText.error,border:e.colors.error,selectedBg:e.colors.primaryMuted,selectedOn:e.colors.primary,selectedInk:e.colors.toneText.primary,selectedBorder:e.colors.primary};case"info":return{base:e.colors.background.tertiary,on:e.colors.info,ink:e.colors.toneText.info,border:e.colors.info,selectedBg:e.colors.primaryMuted,selectedOn:e.colors.primary,selectedInk:e.colors.toneText.primary,selectedBorder:e.colors.primary};default:return{base:e.colors.background.tertiary,on:e.colors.text.primary,ink:e.colors.text.primary,border:e.colors.border.primary,selectedBg:e.colors.primaryMuted,selectedOn:e.colors.primary,selectedInk:e.colors.toneText.primary,selectedBorder:e.colors.primary}}},SOFT_FILL_OPACITY=.14,SOFT_SELECTED_FILL_OPACITY=.24,sizeMap={sm:{paddingH:10,paddingV:4,fontSize:12,minHeight:26,closeSize:16,closeFont:12,gap:6,iconSize:14},md:{paddingH:12,paddingV:6,fontSize:13,minHeight:32,closeSize:18,closeFont:13,gap:8,iconSize:16}},Chip=forwardRef((e,r)=>{const{label:o,selected:s=!1,selectionMode:t="single",onPress:i,onClose:l,leftIcon:n,iconVariant:c,variant:a="filled",tone:d="neutral",size:p="md",disabled:m=!1,loading:y=!1,accessibilityLabel:g,haptic:b,style:u,textStyle:f,containerStyle:h,closeButtonStyle:S,closeIconStyle:x,testID:z}=e,k=useTheme(),I=!!i&&!m,{scale:C,pressIn:j,pressOut:H}=usePressAnimation({enabled:I}),M=useMemo(()=>toneFor(k,d),[k,d]),T=k.components.chip?.[p],w={paddingH:T?.paddingHorizontal??sizeMap[p].paddingH,paddingV:T?.paddingVertical??sizeMap[p].paddingV,fontSize:T?.fontSize??sizeMap[p].fontSize,minHeight:T?.minHeight??sizeMap[p].minHeight,closeSize:T?.closeSize??sizeMap[p].closeSize,closeFont:T?.closeFontSize??sizeMap[p].closeFont,gap:T?.gap??sizeMap[p].gap,iconSize:T?.iconSize??sizeMap[p].iconSize},_="filled"===a,F="soft"===a,B=(()=>{if(F){const e=s?M.selectedOn:M.on;return tintOf(e,s?.24:.14,s?M.selectedBg:M.base)}return s?_?M.selectedBg:"transparent":_?M.base:"transparent"})(),O=F?"transparent":s?M.selectedBorder:_?"transparent":M.border,P=m?k.colors.text.disabled:s?F?k.colors.text.primary:M.selectedInk:M.ink,V=_||F?0:k.colors.border.width,handlePress=()=>{if(!I)return;const e=resolveHaptic(b,"selection");e&&triggerHaptic(e),i?.()},L=g??o,v=_jsxs(View,{style:styles.row,children:[n?_jsx(View,{style:{marginRight:w.gap},children:renderSlotIcon(n,{color:P,size:w.iconSize,disabled:m},c)}):null,_jsx(Text,{style:[styles.label,{color:P,fontSize:w.fontSize,...fontFor(k,"medium")},f],numberOfLines:1,children:o??" "}),l?_jsx(Pressable,{onPress:()=>{m||(!1!==b&&triggerHaptic("impactLight"),l?.())},disabled:m,accessibilityRole:"button",accessibilityLabel:`Remove ${o}`,accessibilityState:{disabled:m},"aria-disabled":m,hitSlop:6,style:({pressed:e})=>[styles.close,{width:w.closeSize,height:w.closeSize,borderRadius:w.closeSize/2,...smoothCorners,marginLeft:w.gap,backgroundColor:e?k.colors.surface.pressed:k.colors.surface.hovered},S],children:_jsx(Text,{style:[{color:P,fontSize:w.closeFont,...fontFor(k,"bold"),lineHeight:w.closeFont+2},x],allowFontScaling:!1,children:"×"})}):null]}),A={paddingHorizontal:w.paddingH,paddingVertical:w.paddingV,minHeight:w.minHeight,borderRadius:k.radius.full,...smoothCorners,backgroundColor:B,borderWidth:V,borderColor:O,opacity:m?.55:1};let R;return R=I?_jsx(Animated.View,{style:{transform:[{scale:C}],alignSelf:"flex-start"},children:_jsx(Pressable,{ref:r,onPress:handlePress,onPressIn:j,onPressOut:H,disabled:!I,accessibilityRole:"multiple"===t?"checkbox":"button",accessibilityLabel:L,accessibilityState:"multiple"===t?{checked:s,disabled:m}:{selected:s,disabled:m},"aria-checked":"multiple"===t?s:void 0,"aria-selected":"multiple"===t?void 0:s,"aria-disabled":m,android_ripple:{color:k.colors.surface.pressed,borderless:!1},testID:z,style:({pressed:e})=>[styles.base,A,e&&"outlined"===a?{backgroundColor:k.colors.surface.pressed}:null,h,u],children:v})}):_jsx(View,{ref:r,style:[styles.base,A,h,u],accessible:!0,accessibilityRole:"text",accessibilityLabel:L,accessibilityState:{selected:s,disabled:m},"aria-selected":s,"aria-disabled":m,testID:z,children:v}),y?_jsx(ChipSkeleton,{...e}):R});Chip.displayName="Chip";const ChipSkeleton=({label:e,size:r="md",leftIcon:o,onClose:s,style:t,containerStyle:i})=>{const l=sizeMap[r],n=Math.max(40,Math.min(120,7*(e??"").length)),c=l.minHeight,a=c/2,d=n+2*l.paddingH+(void 0!==o?l.gap+14:0)+(void 0!==s?l.gap+l.closeSize:0);return _jsx(Skeleton,{width:d,height:c,radius:a,style:[{alignSelf:"flex-start"},i,t]})};ChipSkeleton.displayName="ChipSkeleton",Chip.Skeleton=ChipSkeleton;const styles=StyleSheet.create({base:{alignSelf:"flex-start",flexDirection:"row",alignItems:"center",justifyContent:"center"},row:{flexDirection:"row",alignItems:"center"},label:{textAlign:"center"},close:{alignItems:"center",justifyContent:"center"}});export{Chip};export default Chip;
+"use strict";import{forwardRef,useMemo}from"react";import{Animated,Pressable,StyleSheet,Text,View}from"react-native";import{usePressAnimation}from"../../hooks/usePressAnimation.js";import{fontFor,useTheme}from"../../theme/index.js";import{tintOf}from"../../utils/color.js";import{smoothCorners}from"../../utils/corners.js";import{resolveHaptic,triggerHaptic}from"../../utils/hapticUtils.js";import{renderSlotIcon}from"../AppIcon/slotIcon.js";import{Skeleton}from"../Skeleton/index.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const toneFor=(e,o)=>{switch(o){case"primary":return{base:e.colors.primaryMuted,on:e.colors.primary,ink:e.colors.toneText.primary,border:e.colors.primary,selectedBg:e.colors.primaryMuted,selectedOn:e.colors.primary,selectedInk:e.colors.toneText.primary,selectedBorder:e.colors.primary};case"success":return{base:e.colors.background.tertiary,on:e.colors.success,ink:e.colors.toneText.success,border:e.colors.success,selectedBg:e.colors.primaryMuted,selectedOn:e.colors.primary,selectedInk:e.colors.toneText.primary,selectedBorder:e.colors.primary};case"warning":return{base:e.colors.background.tertiary,on:e.colors.warning,ink:e.colors.toneText.warning,border:e.colors.warning,selectedBg:e.colors.primaryMuted,selectedOn:e.colors.primary,selectedInk:e.colors.toneText.primary,selectedBorder:e.colors.primary};case"error":return{base:e.colors.background.tertiary,on:e.colors.error,ink:e.colors.toneText.error,border:e.colors.error,selectedBg:e.colors.primaryMuted,selectedOn:e.colors.primary,selectedInk:e.colors.toneText.primary,selectedBorder:e.colors.primary};case"info":return{base:e.colors.background.tertiary,on:e.colors.info,ink:e.colors.toneText.info,border:e.colors.info,selectedBg:e.colors.primaryMuted,selectedOn:e.colors.primary,selectedInk:e.colors.toneText.primary,selectedBorder:e.colors.primary};default:return{base:e.colors.background.tertiary,on:e.colors.text.primary,ink:e.colors.text.primary,border:e.colors.border.primary,selectedBg:e.colors.primaryMuted,selectedOn:e.colors.primary,selectedInk:e.colors.toneText.primary,selectedBorder:e.colors.primary}}},SOFT_FILL_OPACITY=.14,SOFT_SELECTED_FILL_OPACITY=.24,sizeMap={sm:{paddingH:10,paddingV:4,fontSize:12,minHeight:26,closeSize:16,closeFont:12,gap:6,iconSize:14},md:{paddingH:12,paddingV:6,fontSize:13,minHeight:32,closeSize:18,closeFont:13,gap:8,iconSize:16}},hasChipCount=e=>null!=e&&""!==e,Chip=forwardRef((e,o)=>{const{label:r,count:t,selected:s=!1,selectionMode:i="single",onPress:l,onClose:n,leftIcon:a,iconVariant:c,variant:d="filled",tone:p="neutral",size:m="md",disabled:u=!1,loading:g=!1,accessibilityLabel:y,haptic:b,style:h,textStyle:f,containerStyle:S,countStyle:x,closeButtonStyle:z,closeIconStyle:k,testID:C}=e,I=useTheme(),M=!!l&&!u,j="radio"===i,H=!!l&&(!u||j),T=hasChipCount(t),{scale:w,pressIn:_,pressOut:F}=usePressAnimation({enabled:M}),O=useMemo(()=>toneFor(I,p),[I,p]),B=I.components.chip?.[m],L={paddingH:B?.paddingHorizontal??sizeMap[m].paddingH,paddingV:B?.paddingVertical??sizeMap[m].paddingV,fontSize:B?.fontSize??sizeMap[m].fontSize,minHeight:B?.minHeight??sizeMap[m].minHeight,closeSize:B?.closeSize??sizeMap[m].closeSize,closeFont:B?.closeFontSize??sizeMap[m].closeFont,gap:B?.gap??sizeMap[m].gap,iconSize:B?.iconSize??sizeMap[m].iconSize},V=Math.max(0,Math.ceil((44-L.minHeight)/2)),P=j?{top:V,bottom:V}:void 0,v="filled"===d,A="soft"===d,R=(()=>{if(A){const e=s?O.selectedOn:O.on;return tintOf(e,s?.24:.14,s?O.selectedBg:O.base)}return s?v?O.selectedBg:"transparent":v?O.base:"transparent"})(),D=A?"transparent":s?O.selectedBorder:v?"transparent":O.border,E=u?I.colors.text.disabled:s?A?I.colors.text.primary:O.selectedInk:O.ink,$=v||A?0:I.colors.border.width,handlePress=()=>{if(!M)return;const e=resolveHaptic(b,"selection");e&&triggerHaptic(e),l?.()},N=y??(T?`${r}, ${t}`:r),Y=_jsxs(View,{style:styles.row,children:[a?_jsx(View,{style:{marginRight:L.gap},children:renderSlotIcon(a,{color:E,size:L.iconSize,disabled:u},c)}):null,_jsx(Text,{style:[styles.label,{color:E,fontSize:L.fontSize,...fontFor(I,"medium")},f],numberOfLines:1,children:r??" "}),T?_jsx(Text,{style:[styles.count,{color:E,fontSize:Math.min(I.typography.fontSize.xs,L.fontSize),marginLeft:I.spacing.xs,...fontFor(I,"normal")},x],numberOfLines:1,children:t}):null,n?_jsx(Pressable,{onPress:()=>{u||(!1!==b&&triggerHaptic("impactLight"),n?.())},disabled:u,accessibilityRole:"button",accessibilityLabel:`Remove ${r}`,accessibilityState:{disabled:u},"aria-disabled":u,hitSlop:6,style:({pressed:e})=>[styles.close,{width:L.closeSize,height:L.closeSize,borderRadius:L.closeSize/2,...smoothCorners,marginLeft:L.gap,backgroundColor:e?I.colors.surface.pressed:I.colors.surface.hovered},z],children:_jsx(Text,{style:[{color:E,fontSize:L.closeFont,...fontFor(I,"bold"),lineHeight:L.closeFont+2},k],maxFontSizeMultiplier:1,children:"×"})}):null]}),U={paddingHorizontal:L.paddingH,paddingVertical:L.paddingV,minHeight:L.minHeight,borderRadius:I.radius.full,...smoothCorners,backgroundColor:R,borderWidth:$,borderColor:D,opacity:u?.55:1};let W;return W=H?_jsx(Animated.View,{style:{transform:[{scale:w}],alignSelf:"flex-start"},children:_jsx(Pressable,{ref:o,onPress:handlePress,onPressIn:_,onPressOut:F,disabled:!M,accessibilityRole:j?"radio":"multiple"===i?"checkbox":"button",accessibilityLabel:N,accessibilityState:j||"multiple"===i?{checked:s,disabled:u}:{selected:s,disabled:u},"aria-checked":j||"multiple"===i?s:void 0,"aria-selected":j||"multiple"===i?void 0:s,"aria-disabled":u,hitSlop:P,android_ripple:{color:I.colors.surface.pressed,borderless:!1},testID:C,style:({pressed:e})=>[styles.base,U,e&&"outlined"===d?{backgroundColor:I.colors.surface.pressed}:null,S,h],children:Y})}):_jsx(View,{ref:o,style:[styles.base,U,S,h],accessible:!0,accessibilityRole:"text",accessibilityLabel:N,accessibilityState:{selected:s,disabled:u},"aria-selected":s,"aria-disabled":u,testID:C,children:Y}),g?_jsx(ChipSkeleton,{...e}):W});Chip.displayName="Chip";const ChipSkeleton=({label:e,count:o,size:r="md",leftIcon:t,onClose:s,style:i,containerStyle:l})=>{const n=sizeMap[r],a=Math.max(40,Math.min(120,7*(e??"").length)),c=n.minHeight,d=c/2,p=a+2*n.paddingH+(hasChipCount(o)?n.gap/2+7*String(o).length:0)+(void 0!==t?n.gap+14:0)+(void 0!==s?n.gap+n.closeSize:0);return _jsx(Skeleton,{width:p,height:c,radius:d,style:[{alignSelf:"flex-start"},l,i]})};ChipSkeleton.displayName="ChipSkeleton",Chip.Skeleton=ChipSkeleton;const styles=StyleSheet.create({base:{alignSelf:"flex-start",flexDirection:"row",alignItems:"center",justifyContent:"center"},row:{flexDirection:"row",alignItems:"center"},label:{flexShrink:1,textAlign:"center"},count:{flexShrink:0,fontVariant:["tabular-nums"]},close:{alignItems:"center",justifyContent:"center"}});export{Chip};export default Chip;

package/lib/module/components/DatePicker/DatePicker.js

@@ -1 +1 @@
-"use strict";import{useCallback,useEffect,useMemo,useRef,useState}from"react";import{AccessibilityInfo,Animated,Easing,Modal,Pressable,StyleSheet,Text,View}from"react-native";import{GestureDetector,GestureHandlerRootView}from"react-native-gesture-handler";import{useSafeAreaInsets}from"react-native-safe-area-context";import{useDragToDismiss}from"../../hooks/useDragToDismiss.js";import{createAnimatedValue,setNativeValue,useTheme}from"../../theme/index.js";import{resolveHaptic,triggerHaptic}from"../../utils/index.js";import{smoothCorners}from"../../utils/corners.js";import{defaultIcons}from"../AppIcon/defaultIcons.js";import{PickerTrigger}from"../PickerTrigger/index.js";import{ToastHost}from"../Toast/ToastProvider.js";import{jsx as _jsx,jsxs as _jsxs,Fragment as _Fragment}from"react/jsx-runtime";const GRID_SIZE=12,DECADE_SPAN=10,startOfDay=e=>new Date(e.getFullYear(),e.getMonth(),e.getDate()),isSameDay=(e,t)=>e.getFullYear()===t.getFullYear()&&e.getMonth()===t.getMonth()&&e.getDate()===t.getDate(),toIso=e=>`${e.getFullYear()}-${String(e.getMonth()+1).padStart(2,"0")}-${String(e.getDate()).padStart(2,"0")}`,addMonths=(e,t)=>new Date(e.getFullYear(),e.getMonth()+t,1),buildMonthMatrix=(e,t)=>{const a=e.getFullYear(),r=e.getMonth(),i=(new Date(a,r,1).getDay()-t+7)%7,s=[];for(let e=0;e<42;e+=1){const t=new Date(a,r,1-i+e);s.push({date:t,inMonth:t.getMonth()===r,iso:toIso(t)})}return s},weekdayLabels=(e,t)=>{const a=new Intl.DateTimeFormat(e,{weekday:"short"}),r=[];for(let e=0;e<7;e+=1){const i=new Date(1970,0,4+(t+e)%7);r.push(a.format(i))}return r},formatMonthYear=(e,t)=>new Intl.DateTimeFormat(t,{month:"long",year:"numeric"}).format(e),formatLongDate=(e,t)=>new Intl.DateTimeFormat(t,{weekday:"long",year:"numeric",month:"long",day:"numeric"}).format(e),decadeStartFor=e=>10*Math.floor(e/10),buildYearCells=e=>{const t=e-4;return Array.from({length:12},(e,a)=>t+a)},buildDecadeCells=e=>{const t=decadeStartFor(e)-40;return Array.from({length:12},(e,a)=>t+10*a)},DatePicker=e=>{const{value:t,onChange:a,onClose:r,minDate:i,maxDate:s,disabledDates:o,mode:n="modal",locale:l="en-IN",weekStartsOn:c=0,title:d="Select Date",confirmLabel:u="Confirm",cancelLabel:g="Cancel",style:m,containerStyle:y,headerLabelStyle:p,navButtonStyle:h,footerButtonStyle:f,haptic:b,testID:x,label:D,placeholder:w,helperText:v,error:C,required:S,disabled:j,size:k,variant:P,clearable:T,onClear:V,formatValue:_,triggerStyle:R}=e,A=void 0!==e.visible,[I,M]=useState(!1),F=A?e.visible:I,L=A?x:x?`${x}-calendar`:void 0,B=useTheme(),Y=useSafeAreaInsets(),z=useMemo(()=>buildStyles(B),[B]),[H,N]=useState(()=>startOfDay(new Date));useEffect(()=>{F&&N(startOfDay(new Date))},[F]);const $=t?startOfDay(t):H,[W,E]=useState($),[O,G]=useState(t?startOfDay(t):null),[q,X]=useState("days"),Z=useRef(createAnimatedValue(0)).current,J=useRef(createAnimatedValue(0)).current,K=useRef(createAnimatedValue(0)).current,Q=useRef(0),U=useRef(createAnimatedValue(0)).current,ee=useRef(createAnimatedValue(1)).current,te=useRef(createAnimatedValue(1)).current,ae=useRef(createAnimatedValue(1)).current,re=useRef(createAnimatedValue(1)).current,ie=useRef(createAnimatedValue(1)).current;useEffect(()=>{if(t){const e=startOfDay(t);G(e),E(e)}else G(null)},[t]),useEffect(()=>{if("modal"===n&&F){Z.setValue(0),setNativeValue(J,0),setNativeValue(K,0);const e=Animated.parallel([Animated.timing(Z,{toValue:1,duration:B.motion.duration.normal,easing:Easing.out(Easing.cubic),useNativeDriver:!1}),Animated.spring(J,{toValue:1,damping:B.motion.spring.gentle.damping,stiffness:B.motion.spring.gentle.stiffness,mass:B.motion.spring.gentle.mass,useNativeDriver:!0})]);return e.start(),()=>e.stop()}},[F,n,Z,J,K,B.motion]);const se=useMemo(()=>{const e=new Set;return o?.forEach(t=>e.add(toIso(startOfDay(t)))),e},[o]),oe=useMemo(()=>i?startOfDay(i):null,[i]),ne=useMemo(()=>s?startOfDay(s):null,[s]),le=useCallback(e=>!!(oe&&e.getTime()<oe.getTime())||(!!(ne&&e.getTime()>ne.getTime())||!!se.has(toIso(e))),[oe,ne,se]),ce=useMemo(()=>buildMonthMatrix(W,c),[W,c]),de=useMemo(()=>buildYearCells(W.getFullYear()),[W]),ue=useMemo(()=>buildDecadeCells(W.getFullYear()),[W]),ge=useMemo(()=>weekdayLabels(l,c),[l,c]),me=useMemo(()=>{if("days"===q)return formatMonthYear(W,l);if("years"===q){return`${de[0]} - ${de[de.length-1]}`}return`${ue[0]} - ${ue[ue.length-1]+9}`},[W,ue,l,q,de]),ye=useCallback(e=>!!(oe&&e<oe.getFullYear())||!!(ne&&e>ne.getFullYear()),[oe,ne]),pe=useCallback(e=>!!(oe&&e+10-1<oe.getFullYear())||!!(ne&&e>ne.getFullYear()),[oe,ne]),he=useCallback(e=>{!1!==b&&triggerHaptic("impactLight");const t=e>0?1:-1,a=B.components.datePicker?.monthSlideDistance??32,r=B.components.datePicker?.monthSlideOutDuration??B.motion.duration.fast??140,i=B.components.datePicker?.monthSlideInDuration??B.motion.duration.fast??160;Animated.sequence([Animated.parallel([Animated.timing(U,{toValue:-t*a,duration:r,easing:Easing.out(Easing.quad),useNativeDriver:!0}),Animated.timing(ee,{toValue:0,duration:r,useNativeDriver:!0})]),Animated.timing(U,{toValue:t*a,duration:0,useNativeDriver:!0}),Animated.parallel([Animated.timing(U,{toValue:0,duration:i,easing:Easing.out(Easing.cubic),useNativeDriver:!0}),Animated.timing(ee,{toValue:1,duration:i,useNativeDriver:!0})])]).start();const s=addMonths(W,e);E(s),AccessibilityInfo.announceForAccessibility(formatMonthYear(s,l))},[W,b,l,ee,U,B.components.datePicker,B.motion.duration.fast]),fe=useCallback(()=>{"days"!==q?(!1!==b&&triggerHaptic("impactLight"),E("years"===q?e=>new Date(e.getFullYear()-12,e.getMonth(),1):e=>new Date(e.getFullYear()-120,e.getMonth(),1))):he(-1)},[he,q,b]),be=useCallback(()=>{"days"!==q?(!1!==b&&triggerHaptic("impactLight"),E("years"===q?e=>new Date(e.getFullYear()+12,e.getMonth(),1):e=>new Date(e.getFullYear()+120,e.getMonth(),1))):he(1)},[he,q,b]),xe=useCallback(()=>{const e=B.components.datePicker?.viewTransitionDuration??B.motion.duration.normal??200;setNativeValue(ae,0),setNativeValue(re,.9),Animated.parallel([Animated.timing(ae,{toValue:1,duration:e,easing:Easing.out(Easing.cubic),useNativeDriver:!0}),Animated.timing(re,{toValue:1,duration:e,easing:Easing.out(Easing.cubic),useNativeDriver:!0})]).start()},[ae,re,B.components.datePicker,B.motion.duration.normal]),De=useCallback(()=>{const e=resolveHaptic(b,"selection");e&&triggerHaptic(e);const t=B.components.datePicker?.headerPressDuration??80,a=B.components.datePicker?.headerReleaseDuration??100;Animated.sequence([Animated.timing(ie,{toValue:.96,duration:t,useNativeDriver:!0}),Animated.timing(ie,{toValue:1,duration:a,useNativeDriver:!0})]).start(),X(e=>"days"===e?"years":"years"===e?"decades":"years"),xe()},[xe,ie,b,B.components.datePicker]),we=useCallback(e=>{const t=resolveHaptic(b,"selection");t&&triggerHaptic(t),E(t=>new Date(e,t.getMonth(),1)),X("days"),xe()},[xe,b]),ve=useCallback(e=>{const t=resolveHaptic(b,"selection");t&&triggerHaptic(t),E(t=>new Date(e+4,t.getMonth(),1)),X("years"),xe()},[xe,b]),Ce=useCallback(e=>{if(le(e.date))return;const t=resolveHaptic(b,"selection");t&&triggerHaptic(t),G(e.date),e.inMonth||E(new Date(e.date.getFullYear(),e.date.getMonth(),1)),setNativeValue(te,.7),Animated.spring(te,{toValue:1,damping:B.motion.spring.bouncy.damping,stiffness:B.motion.spring.bouncy.stiffness,mass:B.motion.spring.bouncy.mass,useNativeDriver:!0}).start()},[le,te,B.motion.spring.bouncy,b]),Se=useCallback(()=>{A||M(!1),r?.()},[A,r]),je=useCallback(()=>{"modal"===n?Animated.parallel([Animated.timing(Z,{toValue:0,duration:B.motion.duration.fast,easing:Easing.bezier(...B.motion.easing.accelerate),useNativeDriver:!1}),Animated.timing(J,{toValue:0,duration:B.motion.duration.fast,easing:Easing.bezier(...B.motion.easing.accelerate),useNativeDriver:!0})]).start(()=>{Se()}):Se()},[Z,n,Se,J,B.motion.duration.fast,B.motion.easing.accelerate]),{handleGesture:ke}=useDragToDismiss({drag:K,travel:()=>Q.current||320,onDismiss:je}),Pe=useCallback(()=>{!1!==b&&triggerHaptic("selection"),je()},[je,b]),Te=useCallback(()=>{O&&(!1!==b&&triggerHaptic("notificationSuccess"),a?.(O),je())},[je,a,O,b]),Ve=J.interpolate({inputRange:[0,1],outputRange:[320,0]}),_e=_jsx(View,{style:z.titleRow,children:_jsx(Text,{style:z.title,accessibilityRole:"header",children:d})}),Re=_jsxs(View,{style:[z.card,m,y],accessibilityRole:"modal"===n?void 0:"none",accessible:!1,testID:L,children:["modal"===n?_jsx(GestureDetector,{gesture:ke,children:_jsxs(View,{style:z.grabArea,children:[_jsx(View,{style:z.handle}),_e]})}):_e,_jsxs(View,{style:z.headerRow,children:[_jsx(Pressable,{onPress:fe,style:({pressed:e})=>[z.navBtn,e&&z.navBtnPressed,h],accessibilityRole:"button",accessibilityLabel:"days"===q?"Previous month":"years"===q?"Previous years":"Previous decades",hitSlop:8,children:_jsx(Text,{style:z.navText,children:"‹"})}),_jsx(Pressable,{onPress:De,style:[z.headerLabelWrap,p],accessibilityRole:"button",accessibilityLabel:"days"===q?`${me}, switch to year selection`:"years"===q?`${me}, switch to decade selection`:`${me}, switch to year selection`,hitSlop:8,children:_jsxs(Animated.View,{style:[z.headerLabelInner,{transform:[{scale:ie}],opacity:"days"===q?ee:1}],children:[_jsx(Animated.Text,{style:[z.headerLabel,{transform:[{translateX:"days"===q?U:0}]}],accessibilityLiveRegion:"polite",children:me}),_jsx(View,{style:z.headerCaret,children:(B.icons?.chevronDown??defaultIcons.chevronDown)({size:B.typography.fontSize.sm,color:B.colors.text.secondary})})]})}),_jsx(Pressable,{onPress:be,style:({pressed:e})=>[z.navBtn,e&&z.navBtnPressed,h],accessibilityRole:"button",accessibilityLabel:"days"===q?"Next month":"years"===q?"Next years":"Next decades",hitSlop:8,children:_jsx(Text,{style:z.navText,children:"›"})})]}),"days"===q?_jsxs(_Fragment,{children:[_jsx(View,{style:z.weekdayRow,children:ge.map((e,t)=>_jsx(View,{style:z.weekdayCell,children:_jsx(Text,{style:z.weekdayText,children:e})},`${e}-${t}`))}),_jsx(Animated.View,{style:[z.grid,{opacity:ee,transform:[{translateX:U}]}],children:Array.from({length:6}).map((e,t)=>_jsx(View,{style:z.gridRow,children:ce.slice(7*t,7*t+7).map(e=>{const t=le(e.date),a=!!O&&isSameDay(e.date,O),r=isSameDay(e.date,H),i=a?B.colors.primary:"transparent",s=r&&!a?B.colors.primary:"transparent",o=a?B.colors.onPrimary:e.inMonth?t?B.colors.text.disabled:B.colors.text.primary:B.colors.text.tertiary,n=t?.3:e.inMonth?1:.4;return _jsx(Pressable,{disabled:t,onPress:()=>Ce(e),accessibilityRole:"button",accessibilityLabel:formatLongDate(e.date,l),accessibilityState:{selected:a,disabled:t},"aria-selected":a,"aria-disabled":t,style:z.dayCell,children:_jsx(Animated.View,{style:[z.dayInner,{backgroundColor:i,borderColor:s,borderWidth:r&&!a?1.5:0,opacity:n},a?{transform:[{scale:te}]}:null],children:_jsx(Text,{style:[z.dayText,{color:o}],children:e.date.getDate()})})},e.iso)})},`r-${t}`))})]}):_jsx(Animated.View,"years"===q?{style:[z.yearGrid,{opacity:ae,transform:[{scale:re}]}],children:Array.from({length:3}).map((e,t)=>_jsx(View,{style:z.gridRow,children:de.slice(4*t,4*t+4).map(e=>{const t=ye(e),a=!!O&&O.getFullYear()===e,r=H.getFullYear()===e,i=a?B.colors.primary:"transparent",s=r&&!a?B.colors.primary:"transparent",o=a?B.colors.onPrimary:t?B.colors.text.disabled:B.colors.text.primary,n=t?.3:1;return _jsx(Pressable,{disabled:t,onPress:()=>we(e),accessibilityRole:"button",accessibilityLabel:`Year ${e}`,accessibilityState:{selected:a,disabled:t},"aria-selected":a,"aria-disabled":t,style:z.yearCell,children:_jsx(View,{style:[z.yearInner,{backgroundColor:i,borderColor:s,borderWidth:r&&!a?1.5:0,opacity:n}],children:_jsx(Text,{style:[z.yearText,{color:o}],children:e})})},`year-${e}`)})},`yr-${t}`))}:{style:[z.yearGrid,{opacity:ae,transform:[{scale:re}]}],children:Array.from({length:3}).map((e,t)=>_jsx(View,{style:z.gridRow,children:ue.slice(4*t,4*t+4).map(e=>{const t=e+10-1,a=pe(e),r=!!O&&decadeStartFor(O.getFullYear())===e,i=decadeStartFor(H.getFullYear())===e,s=r?B.colors.primary:"transparent",o=i&&!r?B.colors.primary:"transparent",n=r?B.colors.onPrimary:a?B.colors.text.disabled:B.colors.text.primary,l=a?.3:1;return _jsx(Pressable,{disabled:a,onPress:()=>ve(e),accessibilityRole:"button",accessibilityLabel:`Decade ${e} to ${t}`,accessibilityState:{selected:r,disabled:a},"aria-selected":r,"aria-disabled":a,style:z.yearCell,children:_jsxs(View,{style:[z.yearInner,{backgroundColor:s,borderColor:o,borderWidth:i&&!r?1.5:0,opacity:l}],children:[_jsx(Text,{style:[z.yearText,{color:n}],children:`${e}s`}),_jsx(Text,{style:[z.decadeRangeText,{color:r?B.colors.onPrimary:B.colors.text.tertiary}],children:`${e}-${t}`})]})},`decade-${e}`)})},`dec-${t}`))}),_jsxs(View,{style:z.footer,children:[_jsx(Pressable,{onPress:Pe,style:({pressed:e})=>[z.footerBtn,z.footerCancel,e&&z.footerBtnPressed,f],accessibilityRole:"button",accessibilityLabel:g,children:_jsx(Text,{style:[z.footerBtnText,{color:B.colors.text.secondary}],children:g})}),_jsx(Pressable,{onPress:Te,disabled:!O,style:({pressed:e})=>[z.footerBtn,z.footerConfirm,{backgroundColor:B.colors.primary,opacity:O?1:.5},e&&{backgroundColor:B.colors.primaryHover},f],accessibilityRole:"button",accessibilityLabel:u,accessibilityState:{disabled:!O},"aria-disabled":!O,children:_jsx(Text,{style:[z.footerBtnText,{color:B.colors.onPrimary}],children:u})})]})]}),Ae=t?(_??(e=>e.toLocaleDateString()))(t):void 0,Ie=!A;if("inline"===n)return F||Ie?Ie?_jsxs(_Fragment,{children:[_jsx(PickerTrigger,{label:D,value:Ae,placeholder:w,helperText:v,error:C,required:S,disabled:j,size:k,variant:P,clearable:T,onClear:V,onPress:()=>M(!0),triggerStyle:R,testID:x}),F?Re:null]}):Re:null;const Me=_jsx(Modal,{visible:F,transparent:!0,statusBarTranslucent:!0,navigationBarTranslucent:!0,animationType:"none",onRequestClose:je,children:_jsxs(GestureHandlerRootView,{collapsable:!1,style:[z.backdrop,{backgroundColor:B.colors.background.overlay}],children:[_jsx(Pressable,{style:StyleSheet.absoluteFill,onPress:je,accessibilityLabel:"Dismiss"}),_jsx(Animated.View,{style:[z.sheetWrap,{paddingBottom:Math.max(Y.bottom,B.spacing.lg),opacity:J,transform:[{translateY:Animated.add(Ve,K)}]}],onLayout:e=>{Q.current=e.nativeEvent.layout.height},accessibilityViewIsModal:!0,accessibilityRole:"none",children:Re}),_jsx(ToastHost,{})]})});return Ie?_jsxs(_Fragment,{children:[_jsx(PickerTrigger,{label:D,value:Ae,placeholder:w,helperText:v,error:C,required:S,disabled:j,size:k,variant:P,clearable:T,onClear:V,onPress:()=>M(!0),triggerStyle:R,testID:x}),Me]}):Me},buildStyles=e=>{const t=e.shadows.lg;return StyleSheet.create({backdrop:{...StyleSheet.absoluteFill},sheetWrap:{position:"absolute",left:0,right:0,bottom:0,paddingHorizontal:e.spacing.md,paddingBottom:e.spacing.lg},card:{backgroundColor:e.colors.background.elevated,borderRadius:e.radius.xl,...smoothCorners,padding:e.spacing.lg,shadowColor:t.shadowColor,shadowOffset:t.shadowOffset,shadowOpacity:t.shadowOpacity,shadowRadius:t.shadowRadius,elevation:t.elevation},grabArea:{marginTop:-e.spacing.lg,paddingTop:e.spacing.sm},handle:{alignSelf:"center",width:36,height:4,borderRadius:e.radius.full,...smoothCorners,backgroundColor:e.colors.border.secondary,marginBottom:e.spacing.sm},titleRow:{marginBottom:e.spacing.sm},title:{fontSize:e.typography.fontSize.lg,fontWeight:e.typography.fontWeight.semibold,color:e.colors.text.primary},headerRow:{flexDirection:"row",alignItems:"center",justifyContent:"space-between",marginBottom:e.spacing.md},navBtn:{width:e.components.datePicker?.navButtonSize??36,height:e.components.datePicker?.navButtonSize??36,borderRadius:e.radius.full,...smoothCorners,alignItems:"center",justifyContent:"center",backgroundColor:e.colors.background.secondary},navBtnPressed:{backgroundColor:e.colors.surface.pressed},navText:{fontSize:e.components.datePicker?.navTextFontSize??22,lineHeight:e.components.datePicker?.navTextLineHeight??24,color:e.colors.text.primary,fontWeight:e.typography.fontWeight.semibold},headerLabelWrap:{flex:1,alignItems:"center"},headerLabelInner:{flexDirection:"row",alignItems:"center",justifyContent:"center"},headerLabel:{fontSize:e.typography.fontSize.base,fontWeight:e.typography.fontWeight.semibold,color:e.colors.text.primary},headerCaret:{marginLeft:e.spacing.xs,alignItems:"center",justifyContent:"center"},weekdayRow:{flexDirection:"row",marginBottom:e.spacing.xs},weekdayCell:{flex:1,alignItems:"center",paddingVertical:e.spacing.xs},weekdayText:{fontSize:e.typography.fontSize.xs,fontWeight:e.typography.fontWeight.medium,color:e.colors.text.tertiary,letterSpacing:e.typography.letterSpacing.wide},grid:{},gridRow:{flexDirection:"row"},dayCell:{flex:1,aspectRatio:1,alignItems:"center",justifyContent:"center",padding:e.components.datePicker?.dayCellPadding??2},dayInner:{width:"100%",height:"100%",borderRadius:e.components.datePicker?.dayInnerBorderRadius??e.radius.full,...smoothCorners,alignItems:"center",justifyContent:"center"},dayText:{fontSize:e.typography.fontSize.sm,fontWeight:e.typography.fontWeight.medium},yearGrid:{},yearCell:{flex:1,aspectRatio:1.6,alignItems:"center",justifyContent:"center",padding:e.components.datePicker?.yearCellPadding??4},yearInner:{width:"100%",height:"100%",borderRadius:e.components.datePicker?.yearInnerBorderRadius??e.radius.lg,...smoothCorners,alignItems:"center",justifyContent:"center"},yearText:{fontSize:e.typography.fontSize.base,fontWeight:e.typography.fontWeight.semibold},decadeRangeText:{fontSize:e.typography.fontSize.xs,fontWeight:e.typography.fontWeight.medium,marginTop:e.components.datePicker?.decadeRangeMarginTop??2},footer:{flexDirection:"row",justifyContent:"flex-end",alignItems:"center",marginTop:e.spacing.lg,gap:e.spacing.sm},footerBtn:{paddingHorizontal:e.spacing.lg,paddingVertical:e.spacing.sm,borderRadius:e.radius.md,...smoothCorners,minHeight:e.components.datePicker?.footerButtonMinHeight??40,alignItems:"center",justifyContent:"center"},footerCancel:{backgroundColor:"transparent"},footerConfirm:{},footerBtnPressed:{opacity:.85},footerBtnText:{fontSize:e.typography.fontSize.sm,fontWeight:e.typography.fontWeight.semibold}})};export{DatePicker};export default DatePicker;
+"use strict";import{useCallback,useEffect,useMemo,useRef,useState}from"react";import{AccessibilityInfo,Animated,Easing,Modal,Pressable,StyleSheet,Text,View}from"react-native";import{GestureDetector,GestureHandlerRootView}from"react-native-gesture-handler";import{useDragToDismiss}from"../../hooks/useDragToDismiss.js";import{createAnimatedValue,setNativeValue,useTheme}from"../../theme/index.js";import{resolveHaptic,triggerHaptic}from"../../utils/index.js";import{smoothCorners}from"../../utils/corners.js";import{defaultIcons}from"../AppIcon/defaultIcons.js";import{ModalSafeArea,useModalInsets}from"../ModalSafeArea/ModalSafeArea.js";import{PickerTrigger}from"../PickerTrigger/index.js";import{ToastHost}from"../Toast/ToastProvider.js";import{jsx as _jsx,jsxs as _jsxs,Fragment as _Fragment}from"react/jsx-runtime";const GRID_SIZE=12,DECADE_SPAN=10,startOfDay=e=>new Date(e.getFullYear(),e.getMonth(),e.getDate()),isSameDay=(e,t)=>e.getFullYear()===t.getFullYear()&&e.getMonth()===t.getMonth()&&e.getDate()===t.getDate(),toIso=e=>`${e.getFullYear()}-${String(e.getMonth()+1).padStart(2,"0")}-${String(e.getDate()).padStart(2,"0")}`,addMonths=(e,t)=>new Date(e.getFullYear(),e.getMonth()+t,1),buildMonthMatrix=(e,t)=>{const a=e.getFullYear(),r=e.getMonth(),i=(new Date(a,r,1).getDay()-t+7)%7,s=[];for(let e=0;e<42;e+=1){const t=new Date(a,r,1-i+e);s.push({date:t,inMonth:t.getMonth()===r,iso:toIso(t)})}return s},weekdayLabels=(e,t)=>{const a=new Intl.DateTimeFormat(e,{weekday:"short"}),r=[];for(let e=0;e<7;e+=1){const i=new Date(1970,0,4+(t+e)%7);r.push(a.format(i))}return r},formatMonthYear=(e,t)=>new Intl.DateTimeFormat(t,{month:"long",year:"numeric"}).format(e),formatLongDate=(e,t)=>new Intl.DateTimeFormat(t,{weekday:"long",year:"numeric",month:"long",day:"numeric"}).format(e),decadeStartFor=e=>10*Math.floor(e/10),buildYearCells=e=>{const t=e-4;return Array.from({length:12},(e,a)=>t+a)},buildDecadeCells=e=>{const t=decadeStartFor(e)-40;return Array.from({length:12},(e,a)=>t+10*a)},DatePicker=e=>{const{value:t,onChange:a,onClose:r,minDate:i,maxDate:s,disabledDates:o,mode:n="modal",locale:l="en-IN",weekStartsOn:c=0,title:d="Select Date",confirmLabel:u="Confirm",cancelLabel:g="Cancel",style:m,containerStyle:y,headerLabelStyle:p,navButtonStyle:h,footerButtonStyle:f,haptic:b,testID:x,label:D,placeholder:w,helperText:v,error:C,required:S,disabled:j,size:k,variant:P,clearable:T,onClear:V,formatValue:_,triggerStyle:A}=e,R=void 0!==e.visible,[M,I]=useState(!1),F=R?e.visible:M,L=R?x:x?`${x}-calendar`:void 0,B=useTheme(),[Y,z]=useModalInsets(),H=useMemo(()=>buildStyles(B),[B]),[N,$]=useState(()=>startOfDay(new Date));useEffect(()=>{F&&$(startOfDay(new Date))},[F]);const W=t?startOfDay(t):N,[E,O]=useState(W),[G,q]=useState(t?startOfDay(t):null),[X,Z]=useState("days"),J=useRef(createAnimatedValue(0)).current,K=useRef(createAnimatedValue(0)).current,Q=useRef(createAnimatedValue(0)).current,U=useRef(0),ee=useRef(createAnimatedValue(0)).current,te=useRef(createAnimatedValue(1)).current,ae=useRef(createAnimatedValue(1)).current,re=useRef(createAnimatedValue(1)).current,ie=useRef(createAnimatedValue(1)).current,se=useRef(createAnimatedValue(1)).current;useEffect(()=>{if(t){const e=startOfDay(t);q(e),O(e)}else q(null)},[t]),useEffect(()=>{if("modal"===n&&F){J.setValue(0),setNativeValue(K,0),setNativeValue(Q,0);const e=Animated.parallel([Animated.timing(J,{toValue:1,duration:B.motion.duration.normal,easing:Easing.out(Easing.cubic),useNativeDriver:!1}),Animated.spring(K,{toValue:1,damping:B.motion.spring.gentle.damping,stiffness:B.motion.spring.gentle.stiffness,mass:B.motion.spring.gentle.mass,useNativeDriver:!0})]);return e.start(),()=>e.stop()}},[F,n,J,K,Q,B.motion]);const oe=useMemo(()=>{const e=new Set;return o?.forEach(t=>e.add(toIso(startOfDay(t)))),e},[o]),ne=useMemo(()=>i?startOfDay(i):null,[i]),le=useMemo(()=>s?startOfDay(s):null,[s]),ce=useCallback(e=>!!(ne&&e.getTime()<ne.getTime())||(!!(le&&e.getTime()>le.getTime())||!!oe.has(toIso(e))),[ne,le,oe]),de=useMemo(()=>buildMonthMatrix(E,c),[E,c]),ue=useMemo(()=>buildYearCells(E.getFullYear()),[E]),ge=useMemo(()=>buildDecadeCells(E.getFullYear()),[E]),me=useMemo(()=>weekdayLabels(l,c),[l,c]),ye=useMemo(()=>{if("days"===X)return formatMonthYear(E,l);if("years"===X){return`${ue[0]} - ${ue[ue.length-1]}`}return`${ge[0]} - ${ge[ge.length-1]+9}`},[E,ge,l,X,ue]),pe=useCallback(e=>!!(ne&&e<ne.getFullYear())||!!(le&&e>le.getFullYear()),[ne,le]),he=useCallback(e=>!!(ne&&e+10-1<ne.getFullYear())||!!(le&&e>le.getFullYear()),[ne,le]),fe=useCallback(e=>{!1!==b&&triggerHaptic("impactLight");const t=e>0?1:-1,a=B.components.datePicker?.monthSlideDistance??32,r=B.components.datePicker?.monthSlideOutDuration??B.motion.duration.fast??140,i=B.components.datePicker?.monthSlideInDuration??B.motion.duration.fast??160;Animated.sequence([Animated.parallel([Animated.timing(ee,{toValue:-t*a,duration:r,easing:Easing.out(Easing.quad),useNativeDriver:!0}),Animated.timing(te,{toValue:0,duration:r,useNativeDriver:!0})]),Animated.timing(ee,{toValue:t*a,duration:0,useNativeDriver:!0}),Animated.parallel([Animated.timing(ee,{toValue:0,duration:i,easing:Easing.out(Easing.cubic),useNativeDriver:!0}),Animated.timing(te,{toValue:1,duration:i,useNativeDriver:!0})])]).start();const s=addMonths(E,e);O(s),AccessibilityInfo.announceForAccessibility(formatMonthYear(s,l))},[E,b,l,te,ee,B.components.datePicker,B.motion.duration.fast]),be=useCallback(()=>{"days"!==X?(!1!==b&&triggerHaptic("impactLight"),O("years"===X?e=>new Date(e.getFullYear()-12,e.getMonth(),1):e=>new Date(e.getFullYear()-120,e.getMonth(),1))):fe(-1)},[fe,X,b]),xe=useCallback(()=>{"days"!==X?(!1!==b&&triggerHaptic("impactLight"),O("years"===X?e=>new Date(e.getFullYear()+12,e.getMonth(),1):e=>new Date(e.getFullYear()+120,e.getMonth(),1))):fe(1)},[fe,X,b]),De=useCallback(()=>{const e=B.components.datePicker?.viewTransitionDuration??B.motion.duration.normal??200;setNativeValue(re,0),setNativeValue(ie,.9),Animated.parallel([Animated.timing(re,{toValue:1,duration:e,easing:Easing.out(Easing.cubic),useNativeDriver:!0}),Animated.timing(ie,{toValue:1,duration:e,easing:Easing.out(Easing.cubic),useNativeDriver:!0})]).start()},[re,ie,B.components.datePicker,B.motion.duration.normal]),we=useCallback(()=>{const e=resolveHaptic(b,"selection");e&&triggerHaptic(e);const t=B.components.datePicker?.headerPressDuration??80,a=B.components.datePicker?.headerReleaseDuration??100;Animated.sequence([Animated.timing(se,{toValue:.96,duration:t,useNativeDriver:!0}),Animated.timing(se,{toValue:1,duration:a,useNativeDriver:!0})]).start(),Z(e=>"days"===e?"years":"years"===e?"decades":"years"),De()},[De,se,b,B.components.datePicker]),ve=useCallback(e=>{const t=resolveHaptic(b,"selection");t&&triggerHaptic(t),O(t=>new Date(e,t.getMonth(),1)),Z("days"),De()},[De,b]),Ce=useCallback(e=>{const t=resolveHaptic(b,"selection");t&&triggerHaptic(t),O(t=>new Date(e+4,t.getMonth(),1)),Z("years"),De()},[De,b]),Se=useCallback(e=>{if(ce(e.date))return;const t=resolveHaptic(b,"selection");t&&triggerHaptic(t),q(e.date),e.inMonth||O(new Date(e.date.getFullYear(),e.date.getMonth(),1)),setNativeValue(ae,.7),Animated.spring(ae,{toValue:1,damping:B.motion.spring.bouncy.damping,stiffness:B.motion.spring.bouncy.stiffness,mass:B.motion.spring.bouncy.mass,useNativeDriver:!0}).start()},[ce,ae,B.motion.spring.bouncy,b]),je=useCallback(()=>{R||I(!1),r?.()},[R,r]),ke=useCallback(()=>{"modal"===n?Animated.parallel([Animated.timing(J,{toValue:0,duration:B.motion.duration.fast,easing:Easing.bezier(...B.motion.easing.accelerate),useNativeDriver:!1}),Animated.timing(K,{toValue:0,duration:B.motion.duration.fast,easing:Easing.bezier(...B.motion.easing.accelerate),useNativeDriver:!0})]).start(()=>{je()}):je()},[J,n,je,K,B.motion.duration.fast,B.motion.easing.accelerate]),{handleGesture:Pe}=useDragToDismiss({drag:Q,travel:()=>U.current||320,onDismiss:ke}),Te=useCallback(()=>{!1!==b&&triggerHaptic("selection"),ke()},[ke,b]),Ve=useCallback(()=>{G&&(!1!==b&&triggerHaptic("notificationSuccess"),a?.(G),ke())},[ke,a,G,b]),Ae=K.interpolate({inputRange:[0,1],outputRange:[320,0]}),Re=_jsx(View,{style:H.titleRow,children:_jsx(Text,{style:H.title,accessibilityRole:"header",children:d})}),Me=_jsxs(View,{style:[H.card,m,y],accessibilityRole:"modal"===n?void 0:"none",accessible:!1,testID:L,children:["modal"===n?_jsx(GestureDetector,{gesture:Pe,children:_jsxs(View,{style:H.grabArea,children:[_jsx(View,{style:H.handle}),Re]})}):Re,_jsxs(View,{style:H.headerRow,children:[_jsx(Pressable,{onPress:be,style:({pressed:e})=>[H.navBtn,e&&H.navBtnPressed,h],accessibilityRole:"button",accessibilityLabel:"days"===X?"Previous month":"years"===X?"Previous years":"Previous decades",hitSlop:8,children:_jsx(Text,{style:H.navText,children:"‹"})}),_jsx(Pressable,{onPress:we,style:[H.headerLabelWrap,p],accessibilityRole:"button",accessibilityLabel:"days"===X?`${ye}, switch to year selection`:"years"===X?`${ye}, switch to decade selection`:`${ye}, switch to year selection`,hitSlop:8,children:_jsxs(Animated.View,{style:[H.headerLabelInner,{transform:[{scale:se}],opacity:"days"===X?te:1}],children:[_jsx(Animated.Text,{style:[H.headerLabel,{transform:[{translateX:"days"===X?ee:0}]}],accessibilityLiveRegion:"polite",children:ye}),_jsx(View,{style:H.headerCaret,children:(B.icons?.chevronDown??defaultIcons.chevronDown)({size:B.typography.fontSize.sm,color:B.colors.text.secondary})})]})}),_jsx(Pressable,{onPress:xe,style:({pressed:e})=>[H.navBtn,e&&H.navBtnPressed,h],accessibilityRole:"button",accessibilityLabel:"days"===X?"Next month":"years"===X?"Next years":"Next decades",hitSlop:8,children:_jsx(Text,{style:H.navText,children:"›"})})]}),"days"===X?_jsxs(_Fragment,{children:[_jsx(View,{style:H.weekdayRow,children:me.map((e,t)=>_jsx(View,{style:H.weekdayCell,children:_jsx(Text,{style:H.weekdayText,children:e})},`${e}-${t}`))}),_jsx(Animated.View,{style:[H.grid,{opacity:te,transform:[{translateX:ee}]}],children:Array.from({length:6}).map((e,t)=>_jsx(View,{style:H.gridRow,children:de.slice(7*t,7*t+7).map(e=>{const t=ce(e.date),a=!!G&&isSameDay(e.date,G),r=isSameDay(e.date,N),i=a?B.colors.primary:"transparent",s=r&&!a?B.colors.primary:"transparent",o=a?B.colors.onPrimary:e.inMonth?t?B.colors.text.disabled:B.colors.text.primary:B.colors.text.tertiary,n=t?.3:e.inMonth?1:.4;return _jsx(Pressable,{disabled:t,onPress:()=>Se(e),accessibilityRole:"button",accessibilityLabel:formatLongDate(e.date,l),accessibilityState:{selected:a,disabled:t},"aria-selected":a,"aria-disabled":t,style:H.dayCell,children:_jsx(Animated.View,{style:[H.dayInner,{backgroundColor:i,borderColor:s,borderWidth:r&&!a?1.5:0,opacity:n},a?{transform:[{scale:ae}]}:null],children:_jsx(Text,{style:[H.dayText,{color:o}],children:e.date.getDate()})})},e.iso)})},`r-${t}`))})]}):_jsx(Animated.View,"years"===X?{style:[H.yearGrid,{opacity:re,transform:[{scale:ie}]}],children:Array.from({length:3}).map((e,t)=>_jsx(View,{style:H.gridRow,children:ue.slice(4*t,4*t+4).map(e=>{const t=pe(e),a=!!G&&G.getFullYear()===e,r=N.getFullYear()===e,i=a?B.colors.primary:"transparent",s=r&&!a?B.colors.primary:"transparent",o=a?B.colors.onPrimary:t?B.colors.text.disabled:B.colors.text.primary,n=t?.3:1;return _jsx(Pressable,{disabled:t,onPress:()=>ve(e),accessibilityRole:"button",accessibilityLabel:`Year ${e}`,accessibilityState:{selected:a,disabled:t},"aria-selected":a,"aria-disabled":t,style:H.yearCell,children:_jsx(View,{style:[H.yearInner,{backgroundColor:i,borderColor:s,borderWidth:r&&!a?1.5:0,opacity:n}],children:_jsx(Text,{style:[H.yearText,{color:o}],children:e})})},`year-${e}`)})},`yr-${t}`))}:{style:[H.yearGrid,{opacity:re,transform:[{scale:ie}]}],children:Array.from({length:3}).map((e,t)=>_jsx(View,{style:H.gridRow,children:ge.slice(4*t,4*t+4).map(e=>{const t=e+10-1,a=he(e),r=!!G&&decadeStartFor(G.getFullYear())===e,i=decadeStartFor(N.getFullYear())===e,s=r?B.colors.primary:"transparent",o=i&&!r?B.colors.primary:"transparent",n=r?B.colors.onPrimary:a?B.colors.text.disabled:B.colors.text.primary,l=a?.3:1;return _jsx(Pressable,{disabled:a,onPress:()=>Ce(e),accessibilityRole:"button",accessibilityLabel:`Decade ${e} to ${t}`,accessibilityState:{selected:r,disabled:a},"aria-selected":r,"aria-disabled":a,style:H.yearCell,children:_jsxs(View,{style:[H.yearInner,{backgroundColor:s,borderColor:o,borderWidth:i&&!r?1.5:0,opacity:l}],children:[_jsx(Text,{style:[H.yearText,{color:n}],children:`${e}s`}),_jsx(Text,{style:[H.decadeRangeText,{color:r?B.colors.onPrimary:B.colors.text.tertiary}],children:`${e}-${t}`})]})},`decade-${e}`)})},`dec-${t}`))}),_jsxs(View,{style:H.footer,children:[_jsx(Pressable,{onPress:Te,style:({pressed:e})=>[H.footerBtn,H.footerCancel,e&&H.footerBtnPressed,f],accessibilityRole:"button",accessibilityLabel:g,children:_jsx(Text,{style:[H.footerBtnText,{color:B.colors.text.secondary}],children:g})}),_jsx(Pressable,{onPress:Ve,disabled:!G,style:({pressed:e})=>[H.footerBtn,H.footerConfirm,{backgroundColor:B.colors.primary,opacity:G?1:.5},e&&{backgroundColor:B.colors.primaryHover},f],accessibilityRole:"button",accessibilityLabel:u,accessibilityState:{disabled:!G},"aria-disabled":!G,children:_jsx(Text,{style:[H.footerBtnText,{color:B.colors.onPrimary}],children:u})})]})]}),Ie=t?(_??(e=>e.toLocaleDateString()))(t):void 0,Fe=!R;if("inline"===n)return F||Fe?Fe?_jsxs(_Fragment,{children:[_jsx(PickerTrigger,{label:D,value:Ie,placeholder:w,helperText:v,error:C,required:S,disabled:j,size:k,variant:P,clearable:T,onClear:V,onPress:()=>I(!0),triggerStyle:A,testID:x}),F?Me:null]}):Me:null;const Le=_jsx(Modal,{visible:F,transparent:!0,statusBarTranslucent:!0,navigationBarTranslucent:!0,animationType:"none",onRequestClose:ke,children:_jsx(ModalSafeArea,{onInsets:z,children:_jsxs(GestureHandlerRootView,{collapsable:!1,style:[H.backdrop,{backgroundColor:B.colors.background.overlay}],children:[_jsx(Pressable,{style:StyleSheet.absoluteFill,onPress:ke,accessibilityLabel:"Dismiss"}),_jsx(Animated.View,{style:[H.sheetWrap,{paddingBottom:Math.max(Y.bottom,B.spacing.lg),opacity:K,transform:[{translateY:Animated.add(Ae,Q)}]}],onLayout:e=>{U.current=e.nativeEvent.layout.height},accessibilityViewIsModal:!0,accessibilityRole:"none",children:Me}),_jsx(ToastHost,{})]})})});return Fe?_jsxs(_Fragment,{children:[_jsx(PickerTrigger,{label:D,value:Ie,placeholder:w,helperText:v,error:C,required:S,disabled:j,size:k,variant:P,clearable:T,onClear:V,onPress:()=>I(!0),triggerStyle:A,testID:x}),Le]}):Le},buildStyles=e=>{const t=e.shadows.lg;return StyleSheet.create({backdrop:{...StyleSheet.absoluteFill},sheetWrap:{position:"absolute",left:0,right:0,bottom:0,paddingHorizontal:e.spacing.md,paddingBottom:e.spacing.lg},card:{backgroundColor:e.colors.background.elevated,borderRadius:e.radius.xl,...smoothCorners,padding:e.spacing.lg,shadowColor:t.shadowColor,shadowOffset:t.shadowOffset,shadowOpacity:t.shadowOpacity,shadowRadius:t.shadowRadius,elevation:t.elevation},grabArea:{marginTop:-e.spacing.lg,paddingTop:e.spacing.sm},handle:{alignSelf:"center",width:36,height:4,borderRadius:e.radius.full,...smoothCorners,backgroundColor:e.colors.border.secondary,marginBottom:e.spacing.sm},titleRow:{marginBottom:e.spacing.sm},title:{fontSize:e.typography.fontSize.lg,fontWeight:e.typography.fontWeight.semibold,color:e.colors.text.primary},headerRow:{flexDirection:"row",alignItems:"center",justifyContent:"space-between",marginBottom:e.spacing.md},navBtn:{width:e.components.datePicker?.navButtonSize??36,height:e.components.datePicker?.navButtonSize??36,borderRadius:e.radius.full,...smoothCorners,alignItems:"center",justifyContent:"center",backgroundColor:e.colors.background.secondary},navBtnPressed:{backgroundColor:e.colors.surface.pressed},navText:{fontSize:e.components.datePicker?.navTextFontSize??22,lineHeight:e.components.datePicker?.navTextLineHeight??24,color:e.colors.text.primary,fontWeight:e.typography.fontWeight.semibold},headerLabelWrap:{flex:1,alignItems:"center"},headerLabelInner:{flexDirection:"row",alignItems:"center",justifyContent:"center"},headerLabel:{fontSize:e.typography.fontSize.base,fontWeight:e.typography.fontWeight.semibold,color:e.colors.text.primary},headerCaret:{marginLeft:e.spacing.xs,alignItems:"center",justifyContent:"center"},weekdayRow:{flexDirection:"row",marginBottom:e.spacing.xs},weekdayCell:{flex:1,alignItems:"center",paddingVertical:e.spacing.xs},weekdayText:{fontSize:e.typography.fontSize.xs,fontWeight:e.typography.fontWeight.medium,color:e.colors.text.tertiary,letterSpacing:e.typography.letterSpacing.wide},grid:{},gridRow:{flexDirection:"row"},dayCell:{flex:1,aspectRatio:1,alignItems:"center",justifyContent:"center",padding:e.components.datePicker?.dayCellPadding??2},dayInner:{width:"100%",height:"100%",borderRadius:e.components.datePicker?.dayInnerBorderRadius??e.radius.full,...smoothCorners,alignItems:"center",justifyContent:"center"},dayText:{fontSize:e.typography.fontSize.sm,fontWeight:e.typography.fontWeight.medium},yearGrid:{},yearCell:{flex:1,aspectRatio:1.6,alignItems:"center",justifyContent:"center",padding:e.components.datePicker?.yearCellPadding??4},yearInner:{width:"100%",height:"100%",borderRadius:e.components.datePicker?.yearInnerBorderRadius??e.radius.lg,...smoothCorners,alignItems:"center",justifyContent:"center"},yearText:{fontSize:e.typography.fontSize.base,fontWeight:e.typography.fontWeight.semibold},decadeRangeText:{fontSize:e.typography.fontSize.xs,fontWeight:e.typography.fontWeight.medium,marginTop:e.components.datePicker?.decadeRangeMarginTop??2},footer:{flexDirection:"row",justifyContent:"flex-end",alignItems:"center",marginTop:e.spacing.lg,gap:e.spacing.sm},footerBtn:{paddingHorizontal:e.spacing.lg,paddingVertical:e.spacing.sm,borderRadius:e.radius.md,...smoothCorners,minHeight:e.components.datePicker?.footerButtonMinHeight??40,alignItems:"center",justifyContent:"center"},footerCancel:{backgroundColor:"transparent"},footerConfirm:{},footerBtnPressed:{opacity:.85},footerBtnText:{fontSize:e.typography.fontSize.sm,fontWeight:e.typography.fontWeight.semibold}})};export{DatePicker};export default DatePicker;

package/lib/module/components/DateRangePicker/DateRangePicker.js

@@ -1 +1 @@
-"use strict";import{forwardRef,useCallback,useEffect,useMemo,useRef,useState}from"react";import{Animated,Easing,Modal,Pressable,StyleSheet,Text,View}from"react-native";import{GestureDetector,GestureHandlerRootView}from"react-native-gesture-handler";import{useSafeAreaInsets}from"react-native-safe-area-context";import{useDragToDismiss}from"../../hooks/useDragToDismiss.js";import{createAnimatedValue,setNativeValue,useTheme}from"../../theme/index.js";import{triggerHaptic}from"../../utils/index.js";import{smoothCorners}from"../../utils/corners.js";import{Calendar}from"../Calendar/index.js";import{daysBetween,startOfDay,startOfMonth}from"../Calendar/calendarDates.js";import{PickerTrigger}from"../PickerTrigger/index.js";import{ToastHost}from"../Toast/ToastProvider.js";import{jsx as _jsx,jsxs as _jsxs,Fragment as _Fragment}from"react/jsx-runtime";const formatRangePart=(e,t)=>new Intl.DateTimeFormat(t,{weekday:"short",day:"numeric",month:"short"}).format(e),DateRangePicker=forwardRef((e,t)=>{const{visible:a,value:r,onChange:s,onClose:o,label:i,placeholder:n,helperText:l,error:d,required:c,disabled:g,size:m,variant:u,clearable:f,onClear:p,formatValue:h,triggerStyle:y,minDate:b,maxDate:x,disabledDates:D,markedDates:v,strikeMarkedInRange:S,locale:R="en-IN",weekStartsOn:C=0,title:j="Select Date Range",confirmLabel:k="Confirm",cancelLabel:w="Cancel",maxRange:T,haptic:P,style:V,containerStyle:_,headerLabelStyle:B,navButtonStyle:A,footerButtonStyle:M,testID:O}=e,H=void 0!==a,[I,z]=useState(!1),L=H?a:I,E=H?O:O?`${O}-calendar`:void 0,N=useTheme(),W=useSafeAreaInsets(),$=useMemo(()=>buildStyles(N),[N]),[F,G]=useState(()=>startOfMonth(r.start??new Date)),[q,Y]=useState(r.start?startOfDay(r.start):null),[J,K]=useState(r.end?startOfDay(r.end):null),Q=useRef(createAnimatedValue(0)).current,U=useRef(createAnimatedValue(0)).current,X=useRef(createAnimatedValue(0)).current,Z=useRef(0);useEffect(()=>{if(r.start){const e=startOfDay(r.start);Y(e),G(startOfMonth(e))}else Y(null);r.end?K(startOfDay(r.end)):K(null)},[r.start,r.end]),useEffect(()=>{let e;return L&&(Q.setValue(0),setNativeValue(U,0),setNativeValue(X,0),e=Animated.parallel([Animated.timing(Q,{toValue:1,duration:N.motion.duration.normal,easing:Easing.out(Easing.cubic),useNativeDriver:!1}),Animated.spring(U,{toValue:1,damping:N.motion.spring.gentle.damping,stiffness:N.motion.spring.gentle.stiffness,mass:N.motion.spring.gentle.mass,useNativeDriver:!0})]),e.start()),()=>e?.stop()},[L,Q,U,X,N.motion]);const ee=useCallback(e=>{if(e.end&&T&&daysBetween(e.start,e.end)+1>T)return!1!==P&&triggerHaptic("notificationWarning"),Y(e.end),void K(null);Y(e.start),K(e.end??null)},[T,P]),te=useCallback(()=>{H?o?.():z(!1)},[H,o]),ae=useCallback(()=>{Animated.parallel([Animated.timing(Q,{toValue:0,duration:N.motion.duration.fast,easing:Easing.bezier(...N.motion.easing.accelerate),useNativeDriver:!1}),Animated.timing(U,{toValue:0,duration:N.motion.duration.fast,easing:Easing.bezier(...N.motion.easing.accelerate),useNativeDriver:!0})]).start(()=>{te()})},[Q,te,U,N.motion.duration.fast,N.motion.easing.accelerate]),{handleGesture:re}=useDragToDismiss({drag:X,travel:()=>Z.current||320,onDismiss:ae}),se=useCallback(()=>{!1!==P&&triggerHaptic("selection"),ae()},[ae,P]),oe=useCallback(()=>{q&&J&&(!1!==P&&triggerHaptic("notificationSuccess"),s?.({start:q,end:J}),ae())},[ae,s,q,J,P]),ie=U.interpolate({inputRange:[0,1],outputRange:[320,0]}),ne=useMemo(()=>q&&J?`${formatRangePart(q,R)} — ${formatRangePart(J,R)}`:q?`${formatRangePart(q,R)} — …`:"—",[q,J,R]),le=!q||!J,de=_jsxs(View,{style:[$.card,V,_],ref:t,accessible:!1,testID:E,children:[_jsx(GestureDetector,{gesture:re,children:_jsxs(View,{style:$.grabArea,children:[_jsx(View,{style:$.handle}),_jsxs(View,{style:$.titleRow,children:[_jsx(Text,{style:$.title,accessibilityRole:"header",children:j}),_jsx(Text,{style:$.subtitle,accessibilityLiveRegion:"polite",children:ne})]})]})}),_jsx(Calendar,{mode:"range",value:q?{start:q,end:J??void 0}:null,onChange:ee,month:F,onMonthChange:G,minDate:b,maxDate:x,disabledDates:D,markedDates:v,strikeMarkedInRange:S,weekStartsOn:C,locale:R,haptic:P,headerLabelStyle:B,navButtonStyle:A,testID:E?`${E}-grid`:void 0}),_jsxs(View,{style:$.footer,children:[_jsx(Pressable,{onPress:se,style:({pressed:e})=>[$.footerBtn,$.footerCancel,e&&$.footerBtnPressed,M],accessibilityRole:"button",accessibilityLabel:w,children:_jsx(Text,{style:[$.footerBtnText,{color:N.colors.text.secondary}],children:w})}),_jsx(Pressable,{onPress:oe,disabled:le,style:({pressed:e})=>[$.footerBtn,$.footerConfirm,{backgroundColor:N.colors.primary,opacity:le?.5:1},e&&{backgroundColor:N.colors.primaryHover},M],accessibilityRole:"button",accessibilityLabel:k,accessibilityState:{disabled:le},"aria-disabled":le,children:_jsx(Text,{style:[$.footerBtnText,{color:N.colors.onPrimary}],children:k})})]})]}),ce=useMemo(()=>{if(!r.start||!r.end)return"";const e={start:r.start,end:r.end};return h?h(e):`${e.start.toLocaleDateString()} – ${e.end.toLocaleDateString()}`},[r.start,r.end,h]);return _jsxs(_Fragment,{children:[H?null:_jsx(PickerTrigger,{label:i,placeholder:n,helperText:l,error:d,required:c,disabled:g,size:m,variant:u,clearable:f,onClear:p,value:ce,onPress:()=>z(!0),triggerStyle:y,testID:O}),_jsx(Modal,{visible:L,transparent:!0,statusBarTranslucent:!0,navigationBarTranslucent:!0,animationType:"none",onRequestClose:ae,children:_jsxs(GestureHandlerRootView,{collapsable:!1,style:[$.backdrop,{backgroundColor:N.colors.background.overlay}],children:[_jsx(Pressable,{style:StyleSheet.absoluteFill,onPress:ae,accessibilityLabel:"Dismiss"}),_jsx(Animated.View,{style:[$.sheetWrap,{paddingBottom:Math.max(W.bottom,N.spacing.lg),opacity:U,transform:[{translateY:Animated.add(ie,X)}]}],onLayout:e=>{Z.current=e.nativeEvent.layout.height},accessibilityViewIsModal:!0,accessibilityRole:"none",children:de}),_jsx(ToastHost,{})]})})]})});DateRangePicker.displayName="DateRangePicker";const buildStyles=e=>{const t=e.shadows.lg;return StyleSheet.create({backdrop:{...StyleSheet.absoluteFill},sheetWrap:{position:"absolute",left:0,right:0,bottom:0,paddingHorizontal:e.spacing.md,paddingBottom:e.spacing.lg},card:{backgroundColor:e.colors.background.elevated,borderRadius:e.radius.xl,...smoothCorners,padding:e.spacing.lg,shadowColor:t.shadowColor,shadowOffset:t.shadowOffset,shadowOpacity:t.shadowOpacity,shadowRadius:t.shadowRadius,elevation:t.elevation},grabArea:{marginTop:-e.spacing.lg,paddingTop:e.spacing.sm},handle:{alignSelf:"center",width:36,height:4,borderRadius:e.radius.full,...smoothCorners,backgroundColor:e.colors.border.secondary,marginBottom:e.spacing.sm},titleRow:{marginBottom:e.spacing.sm},title:{fontSize:e.typography.fontSize.lg,fontWeight:e.typography.fontWeight.semibold,color:e.colors.text.primary},subtitle:{marginTop:e.spacing.xxs,fontSize:e.typography.fontSize.sm,color:e.colors.text.secondary},footer:{flexDirection:"row",justifyContent:"flex-end",alignItems:"center",marginTop:e.spacing.lg,gap:e.spacing.sm},footerBtn:{paddingHorizontal:e.spacing.lg,paddingVertical:e.spacing.sm,borderRadius:e.radius.md,...smoothCorners,minHeight:e.components.dateRangePicker?.footerButtonMinHeight??40,alignItems:"center",justifyContent:"center"},footerCancel:{backgroundColor:"transparent"},footerConfirm:{},footerBtnPressed:{opacity:.85},footerBtnText:{fontSize:e.typography.fontSize.sm,fontWeight:e.typography.fontWeight.semibold}})};export{DateRangePicker};export default DateRangePicker;
+"use strict";import{forwardRef,useCallback,useEffect,useMemo,useRef,useState}from"react";import{Animated,Easing,Modal,Pressable,StyleSheet,Text,View}from"react-native";import{GestureDetector,GestureHandlerRootView}from"react-native-gesture-handler";import{useDragToDismiss}from"../../hooks/useDragToDismiss.js";import{createAnimatedValue,setNativeValue,useTheme}from"../../theme/index.js";import{triggerHaptic}from"../../utils/index.js";import{smoothCorners}from"../../utils/corners.js";import{Calendar}from"../Calendar/index.js";import{daysBetween,startOfDay,startOfMonth}from"../Calendar/calendarDates.js";import{ModalSafeArea,useModalInsets}from"../ModalSafeArea/ModalSafeArea.js";import{PickerTrigger}from"../PickerTrigger/index.js";import{ToastHost}from"../Toast/ToastProvider.js";import{jsx as _jsx,jsxs as _jsxs,Fragment as _Fragment}from"react/jsx-runtime";const formatRangePart=(e,t)=>new Intl.DateTimeFormat(t,{weekday:"short",day:"numeric",month:"short"}).format(e),DateRangePicker=forwardRef((e,t)=>{const{visible:a,value:r,onChange:s,onClose:o,label:i,placeholder:n,helperText:l,error:d,required:c,disabled:g,size:m,variant:u,clearable:f,onClear:p,formatValue:h,triggerStyle:y,minDate:b,maxDate:x,disabledDates:D,markedDates:S,strikeMarkedInRange:v,locale:R="en-IN",weekStartsOn:j=0,title:C="Select Date Range",confirmLabel:k="Confirm",cancelLabel:w="Cancel",maxRange:T,haptic:P,style:_,containerStyle:V,headerLabelStyle:M,navButtonStyle:B,footerButtonStyle:A,testID:I}=e,O=void 0!==a,[H,z]=useState(!1),L=O?a:H,E=O?I:I?`${I}-calendar`:void 0,N=useTheme(),[W,$]=useModalInsets(),F=useMemo(()=>buildStyles(N),[N]),[G,q]=useState(()=>startOfMonth(r.start??new Date)),[Y,J]=useState(r.start?startOfDay(r.start):null),[K,Q]=useState(r.end?startOfDay(r.end):null),U=useRef(createAnimatedValue(0)).current,X=useRef(createAnimatedValue(0)).current,Z=useRef(createAnimatedValue(0)).current,ee=useRef(0);useEffect(()=>{if(r.start){const e=startOfDay(r.start);J(e),q(startOfMonth(e))}else J(null);r.end?Q(startOfDay(r.end)):Q(null)},[r.start,r.end]),useEffect(()=>{let e;return L&&(U.setValue(0),setNativeValue(X,0),setNativeValue(Z,0),e=Animated.parallel([Animated.timing(U,{toValue:1,duration:N.motion.duration.normal,easing:Easing.out(Easing.cubic),useNativeDriver:!1}),Animated.spring(X,{toValue:1,damping:N.motion.spring.gentle.damping,stiffness:N.motion.spring.gentle.stiffness,mass:N.motion.spring.gentle.mass,useNativeDriver:!0})]),e.start()),()=>e?.stop()},[L,U,X,Z,N.motion]);const te=useCallback(e=>{if(e.end&&T&&daysBetween(e.start,e.end)+1>T)return!1!==P&&triggerHaptic("notificationWarning"),J(e.end),void Q(null);J(e.start),Q(e.end??null)},[T,P]),ae=useCallback(()=>{O?o?.():z(!1)},[O,o]),re=useCallback(()=>{Animated.parallel([Animated.timing(U,{toValue:0,duration:N.motion.duration.fast,easing:Easing.bezier(...N.motion.easing.accelerate),useNativeDriver:!1}),Animated.timing(X,{toValue:0,duration:N.motion.duration.fast,easing:Easing.bezier(...N.motion.easing.accelerate),useNativeDriver:!0})]).start(()=>{ae()})},[U,ae,X,N.motion.duration.fast,N.motion.easing.accelerate]),{handleGesture:se}=useDragToDismiss({drag:Z,travel:()=>ee.current||320,onDismiss:re}),oe=useCallback(()=>{!1!==P&&triggerHaptic("selection"),re()},[re,P]),ie=useCallback(()=>{Y&&K&&(!1!==P&&triggerHaptic("notificationSuccess"),s?.({start:Y,end:K}),re())},[re,s,Y,K,P]),ne=X.interpolate({inputRange:[0,1],outputRange:[320,0]}),le=useMemo(()=>Y&&K?`${formatRangePart(Y,R)} — ${formatRangePart(K,R)}`:Y?`${formatRangePart(Y,R)} — …`:"—",[Y,K,R]),de=!Y||!K,ce=_jsxs(View,{style:[F.card,_,V],ref:t,accessible:!1,testID:E,children:[_jsx(GestureDetector,{gesture:se,children:_jsxs(View,{style:F.grabArea,children:[_jsx(View,{style:F.handle}),_jsxs(View,{style:F.titleRow,children:[_jsx(Text,{style:F.title,accessibilityRole:"header",children:C}),_jsx(Text,{style:F.subtitle,accessibilityLiveRegion:"polite",children:le})]})]})}),_jsx(Calendar,{mode:"range",value:Y?{start:Y,end:K??void 0}:null,onChange:te,month:G,onMonthChange:q,minDate:b,maxDate:x,disabledDates:D,markedDates:S,strikeMarkedInRange:v,weekStartsOn:j,locale:R,haptic:P,headerLabelStyle:M,navButtonStyle:B,testID:E?`${E}-grid`:void 0}),_jsxs(View,{style:F.footer,children:[_jsx(Pressable,{onPress:oe,style:({pressed:e})=>[F.footerBtn,F.footerCancel,e&&F.footerBtnPressed,A],accessibilityRole:"button",accessibilityLabel:w,children:_jsx(Text,{style:[F.footerBtnText,{color:N.colors.text.secondary}],children:w})}),_jsx(Pressable,{onPress:ie,disabled:de,style:({pressed:e})=>[F.footerBtn,F.footerConfirm,{backgroundColor:N.colors.primary,opacity:de?.5:1},e&&{backgroundColor:N.colors.primaryHover},A],accessibilityRole:"button",accessibilityLabel:k,accessibilityState:{disabled:de},"aria-disabled":de,children:_jsx(Text,{style:[F.footerBtnText,{color:N.colors.onPrimary}],children:k})})]})]}),ge=useMemo(()=>{if(!r.start||!r.end)return"";const e={start:r.start,end:r.end};return h?h(e):`${e.start.toLocaleDateString()} – ${e.end.toLocaleDateString()}`},[r.start,r.end,h]);return _jsxs(_Fragment,{children:[O?null:_jsx(PickerTrigger,{label:i,placeholder:n,helperText:l,error:d,required:c,disabled:g,size:m,variant:u,clearable:f,onClear:p,value:ge,onPress:()=>z(!0),triggerStyle:y,testID:I}),_jsx(Modal,{visible:L,transparent:!0,statusBarTranslucent:!0,navigationBarTranslucent:!0,animationType:"none",onRequestClose:re,children:_jsx(ModalSafeArea,{onInsets:$,children:_jsxs(GestureHandlerRootView,{collapsable:!1,style:[F.backdrop,{backgroundColor:N.colors.background.overlay}],children:[_jsx(Pressable,{style:StyleSheet.absoluteFill,onPress:re,accessibilityLabel:"Dismiss"}),_jsx(Animated.View,{style:[F.sheetWrap,{paddingBottom:Math.max(W.bottom,N.spacing.lg),opacity:X,transform:[{translateY:Animated.add(ne,Z)}]}],onLayout:e=>{ee.current=e.nativeEvent.layout.height},accessibilityViewIsModal:!0,accessibilityRole:"none",children:ce}),_jsx(ToastHost,{})]})})})]})});DateRangePicker.displayName="DateRangePicker";const buildStyles=e=>{const t=e.shadows.lg;return StyleSheet.create({backdrop:{...StyleSheet.absoluteFill},sheetWrap:{position:"absolute",left:0,right:0,bottom:0,paddingHorizontal:e.spacing.md,paddingBottom:e.spacing.lg},card:{backgroundColor:e.colors.background.elevated,borderRadius:e.radius.xl,...smoothCorners,padding:e.spacing.lg,shadowColor:t.shadowColor,shadowOffset:t.shadowOffset,shadowOpacity:t.shadowOpacity,shadowRadius:t.shadowRadius,elevation:t.elevation},grabArea:{marginTop:-e.spacing.lg,paddingTop:e.spacing.sm},handle:{alignSelf:"center",width:36,height:4,borderRadius:e.radius.full,...smoothCorners,backgroundColor:e.colors.border.secondary,marginBottom:e.spacing.sm},titleRow:{marginBottom:e.spacing.sm},title:{fontSize:e.typography.fontSize.lg,fontWeight:e.typography.fontWeight.semibold,color:e.colors.text.primary},subtitle:{marginTop:e.spacing.xxs,fontSize:e.typography.fontSize.sm,color:e.colors.text.secondary},footer:{flexDirection:"row",justifyContent:"flex-end",alignItems:"center",marginTop:e.spacing.lg,gap:e.spacing.sm},footerBtn:{paddingHorizontal:e.spacing.lg,paddingVertical:e.spacing.sm,borderRadius:e.radius.md,...smoothCorners,minHeight:e.components.dateRangePicker?.footerButtonMinHeight??40,alignItems:"center",justifyContent:"center"},footerCancel:{backgroundColor:"transparent"},footerConfirm:{},footerBtnPressed:{opacity:.85},footerBtnText:{fontSize:e.typography.fontSize.sm,fontWeight:e.typography.fontWeight.semibold}})};export{DateRangePicker};export default DateRangePicker;

package/lib/module/components/EmptyState/EmptyState.js

@@ -1 +1 @@
-"use strict";import{forwardRef,useMemo}from"react";import{Animated,Pressable,StyleSheet,Text,View}from"react-native";import{usePressAnimation}from"../../hooks/usePressAnimation.js";import{fontFor,useTheme}from"../../theme/index.js";import{smoothCorners}from"../../utils/corners.js";import{triggerHaptic}from"../../utils/hapticUtils.js";import{SquircleFill,useSquircle}from"../SquircleFill/SquircleFill.js";import{jsx as _jsx,Fragment as _Fragment,jsxs as _jsxs}from"react/jsx-runtime";const SIZE_FALLBACK={sm:{iconSize:48,titleFontSize:"lg",descriptionFontSize:"sm",paddingVertical:"lg"},md:{iconSize:64,titleFontSize:"xl",descriptionFontSize:"base",paddingVertical:"xl"},lg:{iconSize:80,titleFontSize:"2xl",descriptionFontSize:"base",paddingVertical:"2xl"}},sizeFor=(e,t)=>{const i={...SIZE_FALLBACK[t],...e.components.emptyState?.[t]??{}};return{iconSize:i.iconSize,titleSize:e.typography.fontSize[i.titleFontSize],descriptionSize:e.typography.fontSize[i.descriptionFontSize],paddingVertical:e.spacing[i.paddingVertical]}},ActionButton=({action:e,variant:t})=>{const i=useTheme(),{scale:r,pressIn:o,pressOut:s}=usePressAnimation({enabled:!0}),n=useMemo(()=>buildActionStyles(i),[i]),l="primary"===t,a=useSquircle(!0,i.radius.md),fillFor=e=>l?i.colors.primary:e?i.colors.surface.pressed:"transparent";return _jsx(Animated.View,{style:{transform:[{scale:r}]},children:_jsx(Pressable,{onPress:()=>{triggerHaptic("selection"),e.onPress()},onPressIn:o,onPressOut:s,accessibilityRole:"button",accessibilityLabel:e.accessibilityLabel??e.label,accessibilityHint:e.accessibilityHint,testID:e.testID,onLayout:a.onLayout,android_ripple:{color:l?i.colors.primaryHover:i.colors.surface.pressed,borderless:!1},style:({pressed:e})=>[n.button,l?n.buttonPrimary:n.buttonSecondary,!e||l||a.active?null:n.buttonSecondaryPressed,a.active?n.buttonSquircleHost:null],children:({pressed:t})=>_jsxs(_Fragment,{children:[a.active&&a.size?_jsx(SquircleFill,{width:a.size.width,height:a.size.height,radius:i.radius.md,fill:fillFor(t),stroke:l?void 0:i.colors.border.primary,strokeWidth:l?0:1,outset:l?0:1}):null,_jsx(Text,{style:[n.buttonText,l?n.buttonTextPrimary:n.buttonTextSecondary],numberOfLines:1,children:e.label})]})})})},EmptyState=forwardRef((e,t)=>{const{icon:i,title:r,description:o,action:s,secondaryAction:n,size:l="md",fill:a=!1,style:c,testID:d}=e,u=useTheme(),m=useMemo(()=>sizeFor(u,l),[u,l]),p=useMemo(()=>buildStyles(u),[u]);return _jsxs(View,{ref:t,accessibilityRole:"summary",testID:d,style:[p.root,{paddingVertical:m.paddingVertical},a?p.fill:null,c],children:[i?_jsx(View,{style:[p.iconCircle,{width:m.iconSize,height:m.iconSize,borderRadius:m.iconSize/2,...smoothCorners}],children:i}):null,_jsx(Text,{style:[p.title,{fontSize:m.titleSize,...fontFor(u,"semibold")}],children:r}),o?_jsx(Text,{style:[p.description,{fontSize:m.descriptionSize}],children:o}):null,s||n?_jsxs(View,{style:p.actions,children:[s?_jsx(ActionButton,{action:s,variant:"primary"}):null,n?_jsx(ActionButton,{action:n,variant:"secondary"}):null]}):null]})});EmptyState.displayName="EmptyState";const buildStyles=e=>StyleSheet.create({root:{alignItems:"center",justifyContent:"center",paddingHorizontal:e.spacing.lg,gap:e.spacing.md},fill:{flexGrow:1},iconCircle:{backgroundColor:e.colors.surface.disabled,alignItems:"center",justifyContent:"center"},title:{color:e.colors.text.primary,textAlign:"center"},description:{color:e.colors.text.secondary,textAlign:"center",maxWidth:320,lineHeight:e.typography.fontSize.base*e.typography.lineHeight.normal},actions:{flexDirection:"row",alignItems:"center",gap:e.spacing.sm,marginTop:e.spacing.xs}}),buildActionStyles=e=>StyleSheet.create({button:{paddingHorizontal:e.spacing.lg,paddingVertical:e.spacing.sm,minHeight:42,borderRadius:e.radius.md,...smoothCorners,alignItems:"center",justifyContent:"center",flexDirection:"row"},buttonPrimary:{backgroundColor:e.colors.primary},buttonSecondary:{backgroundColor:"transparent",borderWidth:1,borderColor:e.colors.border.primary},buttonSecondaryPressed:{backgroundColor:e.colors.surface.pressed},buttonSquircleHost:{backgroundColor:"transparent",borderColor:"transparent",overflow:"visible"},buttonText:{fontSize:e.typography.fontSize.base,...fontFor(e,"semibold")},buttonTextPrimary:{color:e.colors.onPrimary},buttonTextSecondary:{color:e.colors.text.primary}});export{EmptyState};export default EmptyState;
+"use strict";import{forwardRef,useMemo}from"react";import{Animated,Pressable,StyleSheet,Text,View}from"react-native";import{usePressAnimation}from"../../hooks/usePressAnimation.js";import{fontFor,useTheme}from"../../theme/index.js";import{smoothCorners}from"../../utils/corners.js";import{triggerHaptic}from"../../utils/hapticUtils.js";import{SquircleFill,useSquircle}from"../SquircleFill/SquircleFill.js";import{jsx as _jsx,Fragment as _Fragment,jsxs as _jsxs}from"react/jsx-runtime";const SIZE_FALLBACK={sm:{iconSize:48,titleFontSize:"lg",descriptionFontSize:"sm",paddingVertical:"lg",titleGap:"md",descriptionGap:"xs"},md:{iconSize:64,titleFontSize:"xl",descriptionFontSize:"base",paddingVertical:"xl",titleGap:"md",descriptionGap:"xs"},lg:{iconSize:80,titleFontSize:"2xl",descriptionFontSize:"base",paddingVertical:"2xl",titleGap:"md",descriptionGap:"xs"}},sizeFor=(e,t)=>{const i={...SIZE_FALLBACK[t],...e.components.emptyState?.[t]??{}};return{iconSize:i.iconSize,titleSize:e.typography.fontSize[i.titleFontSize],descriptionSize:e.typography.fontSize[i.descriptionFontSize],paddingVertical:e.spacing[i.paddingVertical],titleGap:e.spacing[i.titleGap],descriptionGap:e.spacing[i.descriptionGap]}},ActionButton=({action:e,variant:t})=>{const i=useTheme(),{scale:r,pressIn:o,pressOut:s}=usePressAnimation({enabled:!0}),n=useMemo(()=>buildActionStyles(i),[i]),l="primary"===t,a=useSquircle(!0,i.radius.md),fillFor=e=>l?i.colors.primary:e?i.colors.surface.pressed:"transparent";return _jsx(Animated.View,{style:{transform:[{scale:r}]},children:_jsx(Pressable,{onPress:()=>{triggerHaptic("selection"),e.onPress()},onPressIn:o,onPressOut:s,accessibilityRole:"button",accessibilityLabel:e.accessibilityLabel??e.label,accessibilityHint:e.accessibilityHint,testID:e.testID,onLayout:a.onLayout,android_ripple:{color:l?i.colors.primaryHover:i.colors.surface.pressed,borderless:!1},style:({pressed:e})=>[n.button,l?n.buttonPrimary:n.buttonSecondary,!e||l||a.active?null:n.buttonSecondaryPressed,a.active?n.buttonSquircleHost:null],children:({pressed:t})=>_jsxs(_Fragment,{children:[a.active&&a.size?_jsx(SquircleFill,{width:a.size.width,height:a.size.height,radius:i.radius.md,fill:fillFor(t),stroke:l?void 0:i.colors.border.primary,strokeWidth:l?0:1,outset:l?0:1}):null,_jsx(Text,{style:[n.buttonText,l?n.buttonTextPrimary:n.buttonTextSecondary],numberOfLines:1,children:e.label})]})})})},EmptyState=forwardRef((e,t)=>{const{icon:i,title:r,description:o,action:s,secondaryAction:n,size:l="md",fill:a=!1,style:c,testID:d}=e,p=useTheme(),m=useMemo(()=>sizeFor(p,l),[p,l]),u=useMemo(()=>buildStyles(p),[p]);return _jsxs(View,{ref:t,accessibilityRole:"summary",testID:d,style:[u.root,{paddingVertical:m.paddingVertical},a?u.fill:null,c],children:[i?_jsx(View,{style:[u.iconCircle,{width:m.iconSize,height:m.iconSize,marginBottom:m.titleGap,borderRadius:m.iconSize/2,...smoothCorners}],children:i}):null,_jsx(Text,{style:[u.title,{fontSize:m.titleSize,...fontFor(p,"semibold")}],children:r}),o?_jsx(Text,{style:[u.description,{fontSize:m.descriptionSize,marginTop:m.descriptionGap}],children:o}):null,s||n?_jsxs(View,{style:u.actions,children:[s?_jsx(ActionButton,{action:s,variant:"primary"}):null,n?_jsx(ActionButton,{action:n,variant:"secondary"}):null]}):null]})});EmptyState.displayName="EmptyState";const buildStyles=e=>StyleSheet.create({root:{alignItems:"center",justifyContent:"center",paddingHorizontal:e.spacing.lg},fill:{flexGrow:1},iconCircle:{backgroundColor:e.colors.surface.disabled,alignItems:"center",justifyContent:"center"},title:{color:e.colors.text.primary,textAlign:"center"},description:{color:e.colors.text.secondary,textAlign:"center",maxWidth:320,lineHeight:e.typography.fontSize.base*e.typography.lineHeight.normal},actions:{flexDirection:"row",alignItems:"center",gap:e.spacing.sm,marginTop:e.spacing.md+e.spacing.xs}}),buildActionStyles=e=>StyleSheet.create({button:{paddingHorizontal:e.spacing.lg,paddingVertical:e.spacing.sm,minHeight:42,borderRadius:e.radius.md,...smoothCorners,alignItems:"center",justifyContent:"center",flexDirection:"row"},buttonPrimary:{backgroundColor:e.colors.primary},buttonSecondary:{backgroundColor:"transparent",borderWidth:1,borderColor:e.colors.border.primary},buttonSecondaryPressed:{backgroundColor:e.colors.surface.pressed},buttonSquircleHost:{backgroundColor:"transparent",borderColor:"transparent",overflow:"visible"},buttonText:{fontSize:e.typography.fontSize.base,...fontFor(e,"semibold")},buttonTextPrimary:{color:e.colors.onPrimary},buttonTextSecondary:{color:e.colors.text.primary}});export{EmptyState};export default EmptyState;

package/lib/module/components/FileViewer/FileViewer.js

@@ -1 +1 @@
-"use strict";import{Logger,publicClient}from"@webority/mobile-core";import{downloadFile}from"@webority/mobile-core/download";import{useCallback,useEffect,useMemo,useRef,useState}from"react";import{Image,PixelRatio,ScrollView,StyleSheet,useWindowDimensions,View}from"react-native";import PdfRasterizer from"../../specs/NativePdfRasterizer.js";import{hashString}from"../../utils/hashString.js";import{Spinner}from"../Spinner/index.js";import{jsx as _jsx}from"react/jsx-runtime";const HAS_SCHEME=/^[a-z][a-z0-9+.-]*:/i,MAX_RENDER_SCALE=3,RENDER_WINDOW=1,toError=e=>e instanceof Error?e:new Error(String(e)),scaleForWidth=(e,t)=>{if(t<=0)return 1;const r=e/t*PixelRatio.get();return Math.min(Math.max(r,1),3)},cacheFileName=e=>{const t=(e.split("#")[0]?.split("?")[0]??"").split("/").pop()??"",r=/\.[a-z0-9]{1,8}$/i.exec(t)?.[0]??"";return`${hashString(e)}${r.toLowerCase()}`},localPathFromSource=async e=>{if(!HAS_SCHEME.test(e.uri)||e.uri.startsWith("file://"))return e.uri.replace(/^file:\/\//,"");return(await downloadFile({client:e.client??publicClient,url:e.uri,fileName:cacheFileName(e.uri),headers:e.headers,overwrite:!1===e.cache})).path};export const FileViewer=({source:e,onLoadComplete:t,onPageChanged:r,onError:i,loadingIndicator:a,style:o,testID:s,accessibilityLabel:n})=>{const{width:l}=useWindowDimensions(),[c,u]=useState(0),[h,d]=useState({width:612,height:792}),f=h.height/h.width,[m,p]=useState({}),[g,w]=useState(0),y=useRef(null),S=useRef(i);S.current=i;const b=useRef(t);b.current=t;const x=useRef(r);x.current=r;const E=useMemo(()=>({uri:e.uri,headers:e.headers,client:e.client,cache:e.cache}),[e.uri,e.headers,e.client,e.cache]);useEffect(()=>{let e=!1;return(async()=>{if(PdfRasterizer)try{const t=await localPathFromSource(E);if(e)return;const r=await PdfRasterizer.open(t);if(e)return void await PdfRasterizer.close(r.handle).catch(()=>{});y.current=r.handle,u(r.pageCount),w(0),p({}),r.pageWidth>0&&r.pageHeight>0&&d({width:r.pageWidth,height:r.pageHeight}),b.current?.(r.pageCount)}catch(t){if(!e){const e=toError(t);Logger.error("[@webority/mobile-ui] FileViewer failed to load.",e),S.current?.(e)}}else S.current?.(new Error("[@webority/mobile-ui] PdfRasterizer native module is not linked. Run pod install / rebuild the app after adding @webority/mobile-ui."))})(),()=>{e=!0}},[E]),useEffect(()=>()=>{const e=y.current;e&&PdfRasterizer?.close(e).catch(()=>{})},[]);const R=useCallback(async e=>{const t=y.current;if(t&&PdfRasterizer)try{const r=scaleForWidth(l,h.width),i=await PdfRasterizer.renderPage(t,e,r);p(t=>t[e]?t:{...t,[e]:i})}catch(t){Logger.error(`[@webority/mobile-ui] FileViewer failed to render page ${e}.`,toError(t))}},[h.width,l]),P=l*f;useEffect(()=>{if(0===c)return;const e=Math.max(0,g-1),t=Math.min(c-1,g+1);for(let r=e;r<=t;r+=1)R(r)},[g,c,R]);const M=useCallback(e=>{if(P<=0)return;const t=Math.min(c-1,Math.max(0,Math.round(e.nativeEvent.contentOffset.y/P)));w(e=>(e!==t&&x.current?.(t+1,c),t))},[c,P]),j=useMemo(()=>Array.from({length:c},(e,t)=>t),[c]),z=Math.max(0,g-1),C=Math.min(c-1,g+1);return _jsx(View,{style:[styles.root,o],testID:s,accessible:void 0!==n,accessibilityLabel:n,accessibilityRole:"none",children:0===c?_jsx(View,{style:styles.pagePlaceholder,children:a?a():_jsx(Spinner,{size:"lg"})}):_jsx(ScrollView,{onScroll:M,scrollEventThrottle:32,showsVerticalScrollIndicator:!0,removeClippedSubviews:!0,children:j.map(e=>{const t=e>=z&&e<=C,r=t?m[e]:void 0;return _jsx(View,{style:[styles.page,{width:l,height:P}],children:r?_jsx(Image,{source:{uri:r},style:styles.pageImage,resizeMode:"contain",accessible:!1}):_jsx(View,{style:styles.pagePlaceholder,children:t?a?.()??_jsx(Spinner,{size:"lg"}):null})},e)})})})};FileViewer.displayName="FileViewer";const styles=StyleSheet.create({root:{flex:1},page:{alignSelf:"center"},pageImage:{flex:1},pagePlaceholder:{flex:1,alignItems:"center",justifyContent:"center"}});export default FileViewer;
+"use strict";import{Logger,publicClient}from"@webority/mobile-core";import{downloadFile}from"@webority/mobile-core/download";import{useCallback,useEffect,useMemo,useRef,useState}from"react";import{PixelRatio,ScrollView,StyleSheet,useWindowDimensions,View}from"react-native";import{GestureDetector,GestureHandlerRootView}from"react-native-gesture-handler";import Animated from"react-native-reanimated";import PdfRasterizer from"../../specs/NativePdfRasterizer.js";import{useTheme}from"../../theme/index.js";import{hashString}from"../../utils/hashString.js";import{Spinner}from"../Spinner/index.js";import{FileViewerPage}from"./FileViewerPage.js";import{useFileViewerZoom,ZOOM_REST}from"./useFileViewerZoom.js";import{jsx as _jsx}from"react/jsx-runtime";const HAS_SCHEME=/^[a-z][a-z0-9+.-]*:/i,MAX_RENDER_SCALE=5,RENDER_OVERSCALE=1.25,RENDER_AHEAD=3,MOUNT_AROUND=2,DEFAULT_MAX_ZOOM=4,toError=e=>e instanceof Error?e:new Error(String(e)),scaleForWidth=(e,t,r)=>{if(t<=0)return 1;const i=e/t*PixelRatio.get()*1.25*r;return Math.round(100*Math.min(Math.max(i,1),5))/100},cacheFileName=e=>{const t=(e.split("#")[0]?.split("?")[0]??"").split("/").pop()??"",r=/\.[a-z0-9]{1,8}$/i.exec(t)?.[0]??"";return`${hashString(e)}${r.toLowerCase()}`},localPathFromSource=async e=>{if(!HAS_SCHEME.test(e.uri)||e.uri.startsWith("file://"))return e.uri.replace(/^file:\/\//,"");return(await downloadFile({client:e.client??publicClient,url:e.uri,fileName:cacheFileName(e.uri),headers:e.headers,overwrite:!1===e.cache})).path},AnimatedScrollView=Animated.createAnimatedComponent(ScrollView);export const FileViewer=({source:e,onLoadComplete:t,onPageChanged:r,onError:i,loadingIndicator:o,zoomEnabled:a=!0,maxZoom:l=4,style:s,testID:n,accessibilityLabel:c})=>{const u=useTheme().spacing.sm,{width:h,height:d}=useWindowDimensions(),[m,f]=useState({width:0,height:0}),[p,w]=useState(0),[g,S]=useState({width:612,height:792}),E=g.height/g.width,[R,y]=useState({}),[b,x]=useState(null),[V,_]=useState(0),M=useRef(0),v=useRef(null),F=useRef(null),j=useRef(i);j.current=i;const P=useRef(t);P.current=t;const z=useRef(r);z.current=r;const C=useRef(o);C.current=o;const A=h*E,O=A+u,D=m.height>0?m.height:d,{scrollRef:L,scrollGesture:Z,zoomGesture:H,zoomStyle:N,zoomLevel:T,resetZoom:W}=useFileViewerZoom({zoomEnabled:a,maxZoom:l,viewportWidth:m.width>0?m.width:h,viewportHeight:D,maxScroll:Math.max(0,p*O-u-D)}),k=useMemo(()=>({uri:e.uri,headers:e.headers,client:e.client,cache:e.cache}),[e.uri,e.headers,e.client,e.cache]);useEffect(()=>{let e=!1;return(async()=>{if(PdfRasterizer)try{const t=await localPathFromSource(k);if(e)return;const r=await PdfRasterizer.open(t);if(e)return void await PdfRasterizer.close(r.handle).catch(()=>{});v.current=r.handle,M.current=0,w(r.pageCount),_(0),y({}),x(null),W(),r.pageWidth>0&&r.pageHeight>0&&S({width:r.pageWidth,height:r.pageHeight}),P.current?.(r.pageCount)}catch(t){if(!e){const e=toError(t);Logger.error("[@webority/mobile-ui] FileViewer failed to load.",e),j.current?.(e)}}else j.current?.(new Error("[@webority/mobile-ui] PdfRasterizer native module is not linked. Run pod install / rebuild the app after adding @webority/mobile-ui."))})(),()=>{e=!0;const t=v.current;v.current=null,t&&PdfRasterizer?.close(t).catch(()=>{})}},[k,W]);const G=scaleForWidth(h,g.width,1),I=T>ZOOM_REST?scaleForWidth(h,g.width,Math.ceil(T)):0,$=useCallback(async()=>{const e=v.current;if(!e||!PdfRasterizer||0===p)return;if(F.current===e)return;let t;if(void 0===R[V])t={page:V,scale:G,sharp:!1};else if(I>G&&null!==R[V]&&(b?.page!==V||b.scale!==I))t={page:V,scale:I,sharp:!0};else for(let e=1;e<=3&&!t;e+=1)for(const r of[V+e,V-e])if(r>=0&&r<p&&void 0===R[r]){t={page:r,scale:G,sharp:!1};break}if(!t)return;const{page:r,scale:i,sharp:o}=t;F.current=e;let a=null;try{a=await PdfRasterizer.renderPage(e,r,i)}catch(t){v.current===e&&Logger.error(`[@webority/mobile-ui] FileViewer failed to render page ${r}.`,toError(t))}finally{F.current===e&&(F.current=null)}v.current===e&&(o?x({page:r,scale:i,uri:a}):y(e=>({...e,[r]:a})))},[G,V,p,R,b,I]);useEffect(()=>{$()},[$]),useEffect(()=>{T<=ZOOM_REST&&x(null)},[T]);const U=useCallback(e=>{const{width:t,height:r}=e.nativeEvent.layout;f(e=>e.width===t&&e.height===r?e:{width:t,height:r})},[]),X=useCallback(e=>{if(O<=0||0===p)return;const t=Math.min(p-1,Math.max(0,Math.round(e.nativeEvent.contentOffset.y/O)));t!==M.current&&(M.current=t,_(t),z.current?.(t+1,p))},[p,O]),q=useCallback(()=>C.current?.()??_jsx(Spinner,{size:"lg"}),[]),B=useMemo(()=>({gap:u}),[u]),J=useMemo(()=>Array.from({length:p},(e,t)=>t),[p]),K=T>ZOOM_REST;return _jsx(GestureHandlerRootView,{style:[styles.root,s],onLayout:U,testID:n,accessible:void 0!==c,accessibilityLabel:c,accessibilityRole:"none",children:0===p?_jsx(View,{style:styles.pagePlaceholder,children:o?o():_jsx(Spinner,{size:"lg"})}):_jsx(GestureDetector,{gesture:H,children:_jsx(View,{style:styles.viewport,collapsable:!1,children:_jsx(Animated.View,{style:[styles.viewport,N],children:_jsx(GestureDetector,{gesture:Z,children:_jsx(AnimatedScrollView,{ref:L,onScroll:X,scrollEventThrottle:16,scrollEnabled:!K,showsVerticalScrollIndicator:!K,contentContainerStyle:B,children:J.map(e=>_jsx(FileViewerPage,{width:h,height:A,uri:K&&b?.page===e&&b.uri?b.uri:R[e],mounted:Math.abs(e-V)<=2,renderLoading:q},e))})})})})})})};FileViewer.displayName="FileViewer";const styles=StyleSheet.create({root:{flex:1,overflow:"hidden"},viewport:{flex:1},pagePlaceholder:{flex:1,alignItems:"center",justifyContent:"center"}});export default FileViewer;

package/lib/module/components/FileViewer/FileViewerPage.js

@@ -0,0 +1 @@
+"use strict";import{Image}from"expo-image";import{memo}from"react";import{StyleSheet,View}from"react-native";import{jsx as _jsx}from"react/jsx-runtime";const FileViewerPageView=({width:e,height:t,uri:i,mounted:l,renderLoading:r})=>_jsx(View,{style:[styles.page,{width:e,height:t}],children:l&&i?_jsx(Image,{source:{uri:i},style:StyleSheet.absoluteFill,contentFit:"contain",cachePolicy:"none",allowDownscaling:!1,transition:0,accessible:!1}):l&&void 0===i?_jsx(View,{style:styles.pagePlaceholder,children:r()}):null});export const FileViewerPage=memo(FileViewerPageView);const styles=StyleSheet.create({page:{alignSelf:"center"},pagePlaceholder:{flex:1,alignItems:"center",justifyContent:"center"}});

package/lib/module/components/FileViewer/useFileViewerZoom.js

@@ -0,0 +1 @@
+"use strict";import{useCallback,useEffect,useMemo,useState}from"react";import{Gesture}from"react-native-gesture-handler";import{runOnJS,scrollTo,useAnimatedRef,useAnimatedStyle,useScrollViewOffset,useSharedValue,withTiming}from"react-native-reanimated";const DOUBLE_TAP_ZOOM=2.5;export const ZOOM_REST=1.01;const clamp=(e,a,l)=>{"worklet";return Math.min(Math.max(e,a),l)},panLimit=(e,a)=>{"worklet";return e*(a-1)/2};export const useFileViewerZoom=({zoomEnabled:e,maxZoom:a,viewportWidth:l,viewportHeight:u,maxScroll:t})=>{const[i,n]=useState(1),v=useAnimatedRef(),r=useScrollViewOffset(v),o=useSharedValue(0),s=useSharedValue(0),m=useSharedValue(0),c=useSharedValue(0),h=useSharedValue(1),d=useSharedValue(1),w=useSharedValue(0),S=useSharedValue(0),p=useSharedValue(0),f=useSharedValue(0);useEffect(()=>{m.value=l,c.value=u,s.value=t},[l,u,t,m,c,s]);const T=useCallback(()=>{h.value=withTiming(1),w.value=withTiming(0),S.value=withTiming(0),d.value=1,p.value=0,f.value=0,n(1)},[h,d,w,S,p,f]);useEffect(()=>{e||T()},[e,T]);const g=useCallback(e=>n(e),[]),V=useMemo(()=>Gesture.Native(),[]),k=useMemo(()=>{const l=Math.max(1,a),u=Math.min(2.5,l),t=Gesture.Pinch().enabled(e).onStart(()=>{"worklet";d.value=h.value,p.value=w.value,f.value=S.value}).onUpdate(e=>{"worklet";const a=clamp(d.value*e.scale,1,l),u=e.focalX-m.value/2,t=e.focalY-c.value/2,i=a/d.value,n=panLimit(m.value,a),v=panLimit(c.value,a);w.value=clamp(u-(u-p.value)*i,-n,n),S.value=clamp(t-(t-f.value)*i,-v,v),h.value=a}).onEnd(()=>{"worklet";if(h.value<=1.01)return h.value=withTiming(1),w.value=withTiming(0),S.value=withTiming(0),d.value=1,p.value=0,f.value=0,void runOnJS(g)(1);d.value=h.value,p.value=w.value,f.value=S.value,runOnJS(g)(h.value)}),i=Gesture.Pan().enabled(e).minPointers(1).maxPointers(1).manualActivation(!0).onTouchesMove((e,a)=>{"worklet";h.value>1.01?a.activate():a.fail()}).onStart(()=>{"worklet";p.value=w.value,f.value=S.value,o.value=r.value}).onUpdate(e=>{"worklet";const a=h.value,l=panLimit(m.value,a),u=panLimit(c.value,a);w.value=clamp(p.value+e.translationX,-l,l);const t=f.value+e.translationY,i=clamp(t,-u,u),n=t-i;if(0!==n){const e=clamp(o.value-n/a,0,s.value);e!==o.value&&(o.value=e,scrollTo(v,0,e,!1)),f.value-=n}S.value=i}).onEnd(()=>{"worklet";p.value=w.value,f.value=S.value}),n=Gesture.Tap().enabled(e).numberOfTaps(2).maxDistance(10).onEnd(e=>{"worklet";if(h.value>1.01)return h.value=withTiming(1),w.value=withTiming(0),S.value=withTiming(0),d.value=1,p.value=0,f.value=0,void runOnJS(g)(1);if(u<=1.01)return;const a=e.x-m.value/2,l=e.y-c.value/2,t=panLimit(m.value,u),i=panLimit(c.value,u),n=clamp(-a*(u-1),-t,t),v=clamp(-l*(u-1),-i,i);h.value=withTiming(u),w.value=withTiming(n),S.value=withTiming(v),d.value=u,p.value=n,f.value=v,runOnJS(g)(u)});return t.simultaneousWithExternalGesture(V),i.simultaneousWithExternalGesture(V),n.simultaneousWithExternalGesture(V),Gesture.Simultaneous(t,i,n)},[a,e,g,V,v,r,o,s,m,c,h,d,w,S,p,f]),O=useAnimatedStyle(()=>({transform:[{translateX:w.value},{translateY:S.value},{scale:h.value}]}));return{scrollRef:v,scrollGesture:V,zoomGesture:k,zoomStyle:O,zoomLevel:i,resetZoom:T}};

package/lib/module/components/FilterChipRow/FilterChipRow.js

@@ -0,0 +1 @@
+"use strict";import{forwardRef,memo,useCallback,useEffect,useMemo,useRef}from"react";import{ScrollView,StyleSheet,View}from"react-native";import{useReducedMotion}from"../../hooks/index.js";import{useTheme}from"../../theme/index.js";import{Chip}from"../Chip/index.js";import{jsx as _jsx}from"react/jsx-runtime";const FilterChipRowItem=memo(({itemKey:e,label:t,count:o,disabled:i,selected:r,size:a,variant:n,tone:l,haptic:s,onSelect:c,onItemLayout:u})=>{const d=useCallback(()=>c(e),[c,e]),p=useCallback(t=>u(e,t.nativeEvent.layout),[u,e]);return _jsx(View,{onLayout:p,collapsable:!1,children:_jsx(Chip,{label:t,count:o,selected:r,selectionMode:"radio",disabled:i,size:a,variant:n,tone:l,haptic:!r&&s,onPress:d})})});FilterChipRowItem.displayName="FilterChipRowItem";const FilterChipRow=forwardRef((e,t)=>{const{items:o,value:i,onChange:r,bleed:a=0,size:n,variant:l,tone:s,haptic:c,accessibilityLabel:u,style:d,contentContainerStyle:p,testID:h}=e,m=useTheme(),w=useReducedMotion(),C=useRef(null),b=useRef({viewport:0,content:0,chips:{},revealed:null}),f=useRef(i),y=useRef(r);useEffect(()=>{y.current=r},[r]);const x=useCallback((e,t)=>{const o=b.current,i=o.chips[e];if(!i||0===o.viewport||0===o.content)return;const r=i.x+i.width/2-o.viewport/2,a=Math.min(Math.max(r,0),Math.max(o.content-o.viewport,0));C.current?.scrollTo({x:a,animated:t&&!w}),o.revealed=e},[w]),R=useCallback(()=>{b.current.revealed!==f.current&&x(f.current,!1)},[x]);useEffect(()=>{f.current=i,x(i,!0)},[i,x]);const v=useCallback(e=>{b.current.viewport=e.nativeEvent.layout.width,R()},[R]),k=useCallback(e=>{b.current.content=e,R()},[R]),S=useCallback((e,t)=>{b.current.chips[e]={x:t.x,width:t.width},R()},[R]),j=useCallback(e=>{e!==f.current?y.current(e):x(e,!0)},[x]),I=useMemo(()=>[styles.row,{paddingHorizontal:a,columnGap:m.spacing.xs},p],[a,m.spacing.xs,p]);return _jsx(View,{ref:t,accessibilityRole:"radiogroup",accessibilityLabel:u,testID:h,style:[a>0?{marginHorizontal:-a}:null,d],children:_jsx(ScrollView,{ref:C,horizontal:!0,showsHorizontalScrollIndicator:!1,keyboardShouldPersistTaps:"handled",contentContainerStyle:I,onLayout:v,onContentSizeChange:k,children:o.map(e=>_jsx(FilterChipRowItem,{itemKey:e.key,label:e.label,count:e.count,disabled:e.disabled,selected:e.key===i,size:n,variant:l,tone:s,haptic:c,onSelect:j,onItemLayout:S},e.key))})})});FilterChipRow.displayName="FilterChipRow";const styles=StyleSheet.create({row:{alignItems:"center"}});export{FilterChipRow};export default FilterChipRow;

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

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

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

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

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

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

package/lib/module/components/KeyboardAwareScrollView/KeyboardAwareScrollView.js

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