@webority/mobile-ui 0.12.0 → 0.12.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/lib/commonjs/components/BottomNavigation/BottomNavigation.js +1 -1
- package/lib/commonjs/components/BottomSheet/BottomSheet.js +1 -1
- package/lib/commonjs/components/Card/Card.js +1 -1
- package/lib/commonjs/components/DatePicker/DatePicker.js +1 -1
- package/lib/commonjs/components/DateRangePicker/DateRangePicker.js +1 -1
- package/lib/commonjs/components/Input/Input.js +1 -1
- package/lib/commonjs/components/LoaderOverlay/LoaderOverlay.js +1 -1
- package/lib/commonjs/components/Menu/MenuSurface.js +1 -1
- package/lib/commonjs/components/Modal/Modal.js +1 -1
- package/lib/commonjs/components/ModalSafeArea/ModalSafeArea.js +1 -0
- package/lib/commonjs/components/OptionSheet/OptionSheet.js +1 -1
- package/lib/commonjs/components/PhoneNumberInput/PhoneNumberInput.js +1 -1
- package/lib/commonjs/components/ProfilePicker/ProfilePicker.js +1 -1
- package/lib/commonjs/components/SearchBar/SearchBar.js +1 -1
- package/lib/commonjs/components/SignaturePad/SignaturePad.js +1 -1
- package/lib/commonjs/components/Slider/Slider.js +1 -1
- package/lib/commonjs/components/TimePicker/TimePicker.js +1 -1
- package/lib/commonjs/components/Tooltip/Tooltip.js +1 -1
- package/lib/commonjs/form/useForm.js +1 -1
- package/lib/commonjs/hooks/useDragToDismiss.js +1 -1
- package/lib/module/components/BottomNavigation/BottomNavigation.js +1 -1
- package/lib/module/components/BottomSheet/BottomSheet.js +1 -1
- package/lib/module/components/Card/Card.js +1 -1
- package/lib/module/components/DatePicker/DatePicker.js +1 -1
- package/lib/module/components/DateRangePicker/DateRangePicker.js +1 -1
- package/lib/module/components/Input/Input.js +1 -1
- package/lib/module/components/LoaderOverlay/LoaderOverlay.js +1 -1
- package/lib/module/components/Menu/MenuSurface.js +1 -1
- package/lib/module/components/Modal/Modal.js +1 -1
- package/lib/module/components/ModalSafeArea/ModalSafeArea.js +1 -0
- package/lib/module/components/OptionSheet/OptionSheet.js +1 -1
- package/lib/module/components/PhoneNumberInput/PhoneNumberInput.js +1 -1
- package/lib/module/components/SearchBar/SearchBar.js +1 -1
- package/lib/module/components/Slider/Slider.js +1 -1
- package/lib/module/components/TimePicker/TimePicker.js +1 -1
- package/lib/module/components/Tooltip/Tooltip.js +1 -1
- package/lib/module/form/useForm.js +1 -1
- package/lib/module/hooks/useDragToDismiss.js +1 -1
- package/lib/typescript/commonjs/components/ModalSafeArea/ModalSafeArea.d.ts +26 -0
- package/lib/typescript/module/components/ModalSafeArea/ModalSafeArea.d.ts +26 -0
- package/package.json +2 -2
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=exports.BottomNavigation=void 0;var _react=_interopRequireWildcard(require("react")),_reactNative=require("react-native"),_reactNativeSafeAreaContext=require("react-native-safe-area-context"),_useReducedMotion=require("../../hooks/useReducedMotion.js"),_index=require("../../theme/index.js"),_index2=require("../../utils/index.js"),_corners=require("../../utils/corners.js"),_shadows=require("../../utils/shadows.js"),_index3=require("../AppIcon/index.js"),_useScreenReaderEnabled=require("./useScreenReaderEnabled.js"),_jsxRuntime=require("react/jsx-runtime");function _interopRequireWildcard(e,t){if("function"==typeof WeakMap)var i=new WeakMap,n=new WeakMap;return(_interopRequireWildcard=function(e,t){if(!t&&e&&e.__esModule)return e;var r,a,o={__proto__:null,default:e};if(null===e||"object"!=typeof e&&"function"!=typeof e)return o;if(r=t?n:i){if(r.has(e))return r.get(e);r.set(e,o)}for(const t in e)"default"!==t&&{}.hasOwnProperty.call(e,t)&&((a=(r=Object.defineProperty)&&Object.getOwnPropertyDescriptor(e,t))&&(a.get||a.set)?r(o,t,a):o[t]=e[t]);return o})(e,t)}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=exports.BottomNavigation=(0,_react.forwardRef)((e,t)=>{const{tabs:i,centerAction:n,activeTab:r,onChange:a,haptic:o="selection",showLabels:l=!0,variant:s="pill",indicatorPosition:c="bottom",radius:d,indicatorRadius:u="auto",elevation:_,iconSize:h,marginHorizontal:p,marginVertical:g,paddingHorizontal:m,paddingVertical:b,border:f,minimizeOnScroll:y=!1,scrollDirection:x="idle",accessory:R,style:v,indicatorStyle:N,labelStyle:A,labelMaxFontScale:I,testID:j}=e,E=(0,_index.useTheme)(),S=(0,_reactNativeSafeAreaContext.useSafeAreaInsets)(),w=(0,_react.useMemo)(()=>buildStyles(E),[E]),L=E.components.bottomNavigation,T=h??L?.iconSize??18,D=L?.pillHeight??T+4+8,C=L?.pillMaxWidth??64,M=L?.pillInset??16,B=L?.floatingMargin??16,P=L?.floatingRadius??28,k=L?.bubbleSize??48,V=L?.bubbleLift??14,z=(0,_useReducedMotion.useReducedMotion)(),H=(0,_useScreenReaderEnabled.useScreenReaderEnabled)(y),[F,W]=_react.default.useState(null);(0,_react.useEffect)(()=>{null!==F&&F!==x&&W(null)},[F,x]);const O=y&&!H&&"down"===x&&null===F,[U,q]=_react.default.useState(O);(0,_react.useEffect)(()=>{U!==O&&(z||"web"===_reactNative.Platform.OS||_reactNative.LayoutAnimation.configureNext(_reactNative.LayoutAnimation.Presets.easeInEaseOut),q(O))},[U,O,z]);const G="function"==typeof R?R({minimized:U}):R,$=null!=G&&!1!==G,X=U&&$,[Z,Y]=_react.default.useState(0),K=$&&!X?Z+E.spacing.xs:0,J="tile"===s,Q="floating"===s||J,ee="bubble"===s,te="expand"===s,ie="solid"===s,ne="pill"===s||Q||ie,re=Math.max(0,i.findIndex(e=>e.key===r)),[ae,oe]=_react.default.useState(0),[le,se]=_react.default.useState(0),ce=n?Math.ceil(i.length/2):i.length,de=i.length+(n?1:0),[ue,_e]=_react.default.useState({width:0,height:0}),he=n?.size??48,pe=void 0!==n?.gap,ge=Math.max(0,n?.gap??0),me=pe?(ue.width||he)+2*ge:0,be=pe?i.length>0?Math.max(0,ae-me)/i.length:0:de>0?ae/de:0,fe=pe?me:be,ye=(0,_react.useRef)((0,_index.createAnimatedValue)(re)).current,xe=(0,_react.useRef)({}),Re=(0,_react.useRef)({});i.forEach(e=>{xe.current[e.key]||(xe.current[e.key]=new _reactNative.Animated.Value(1)),Re.current[e.key]||(Re.current[e.key]=(0,_index.createAnimatedValue)(e.key===r?1:0))});const ve=be>0?J?Math.min(be-4,96):Math.min(be-M,C):0,Ne=be>0?(be-ve)/2:0,Ae=be>0?(be-k)/2:0,hasLabel=e=>l&&!U&&!1!==e.showLabel&&e.label.trim().length>0,Ie=i[re],je=Ie&&!hasLabel(Ie)&&le>0?le/2:6+(T+4)/2,Ee=je-V-k/2,Se=Math.max(0,le-4),we=J?2:je-D/2,Le=(0,_react.useRef)(re);(0,_react.useEffect)(()=>{if(Le.current===re)return;Le.current=re;const e=_reactNative.Animated.spring(ye,{toValue:re,tension:120,friction:14,useNativeDriver:!0});return e.start(),()=>e.stop()},[re,ye]);const Te=Math.max(1,i.length-1),De=(0,_react.useMemo)(()=>{const e=[],t=[];for(let i=0;i<=Te;i++)e.push(i),t.push(i<ce?i*be:i*be+fe);return ye.interpolate({inputRange:e,outputRange:t})},[ye,Te,ce,be,fe]),Ce=i.map(e=>e.key).join(" "),Me=ee||te;(0,_react.useEffect)(()=>{const e=Ce.split(" ").flatMap(e=>{const t=e===r?1:0,i=Re.current[e];return i?Me?[_reactNative.Animated.spring(i,{toValue:t,tension:140,friction:13,useNativeDriver:!1})]:(i.setValue(t),[]):[]});if(0===e.length)return;const t=_reactNative.Animated.parallel(e);return t.start(),()=>t.stop()},[r,Ce,Me]);const popIcon=e=>{_reactNative.Animated.sequence([_reactNative.Animated.timing(e,{toValue:1.15,duration:120,useNativeDriver:!0}),_reactNative.Animated.spring(e,{toValue:1,tension:200,friction:8,useNativeDriver:!0})]).start()},Be=(0,_react.useRef)(new _reactNative.Animated.Value(1)).current,{colors:Pe}=E,ke=ie?Pe.primary:Pe.background.elevated,Ve=ie?Pe.onPrimary:Pe.primary,ze=ie?Pe.onPrimary:J?Pe.text.primary:Pe.text.tertiary,He=ie?Pe.onPrimary:Pe.primaryMuted,Fe=ie?Pe.primary:ee?Pe.onPrimary:Ve,We=p??B,Oe=g??(Q?B:0),Ue=Oe>0,qe=b??(Q?6:ee?8:6),Ge=m??(Q?8:4),$e=Ue?qe:Math.max(qe,S.bottom),Xe=Ue?Math.max(Oe,S.bottom):0,Ze="full"===d,Ye=Q?le+K+2*qe+2*_reactNative.StyleSheet.hairlineWidth:le+K+qe+$e,Ke=Ze?le>0?Ye/2:E.radius.full:d??L?.borderRadius??(J?E.radius.full:Q?P:0),Je=void 0!==d||void 0!==L?.borderRadius,activeBgRadius=(e,t)=>"number"==typeof u?Math.max(0,Math.min(u,e/2)):"auto"===u&&Je?Math.min(Ke,e/2):t,Qe="underline"===s?Math.max(Ge,Ze&&0===le?0:Ke):Ge,et=_??"none",tt=E.shadows[et],it="none"===et?null:(0,_shadows.supportsBoxShadow)()?{boxShadow:(0,_shadows.toBoxShadow)(tt)}:tt,nt=f?_reactNative.StyleSheet.hairlineWidth:0,rt=ie?Pe.primary:Pe.border.primary,at=n?.lift??0,ot=qe+nt+K,lt=n&&le>0?Math.max(0,(ue.height||he)/2+at-le/2-ot):0,st=n?(0,_jsxRuntime.jsx)(_reactNative.View,{style:[w.centerCell,pe?{flex:0,marginHorizontal:ge}:null],pointerEvents:"box-none",children:(0,_jsxRuntime.jsx)(_reactNative.Pressable,{onPress:()=>{if(!n)return;const e=n.haptic??o;!1!==e&&(0,_index2.triggerHaptic)(e),popIcon(Be),n.onPress()},onLayout:e=>{const{width:t,height:i}=e.nativeEvent.layout;_e(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??(j?`${j}-center`:void 0),children:n.content?(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{style:{transform:[{scale:Be}]},children:n.content}):(0,_jsxRuntime.jsx)(_reactNative.View,{style:[w.centerCircle,{width:he,height:he,borderRadius:he/2,..._corners.smoothCorners,backgroundColor:n.color??Pe.primary}],children:(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{style:{transform:[{scale:Be}]},children:(0,_index3.renderSlotIcon)(n.icon??"add",{color:n.iconColor??Pe.onPrimary,size:n.iconSize??24,disabled:!1})})})})},CENTER_KEY):null,ct=$?(0,_jsxRuntime.jsx)(_reactNative.View,{style:X?w.accessoryInline:w.accessoryStacked,onLayout:e=>Y(e.nativeEvent.layout.height),testID:j?`${j}-accessory`:void 0,children:G}):null,dt=(0,_jsxRuntime.jsxs)(_reactNative.View,{style:X?[w.tabRow,w.tabRowInline]:w.tabRow,onLayout:e=>{const{width:t,height:i}=e.nativeEvent.layout;oe(t),se(i)},children:[ne&&ve>0&&(!J||Se>0)?(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{pointerEvents:"none",style:[w.pill,{width:ve,height:J?Se:D,left:Ne,top:we,backgroundColor:He,borderRadius:J?activeBgRadius(Se,Se/2):activeBgRadius(D,E.radius.full),..._corners.smoothCorners,transform:[{translateX:De}]},N]}):null,ee&&be>0?(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{pointerEvents:"none",style:[w.bubble,E.shadows.md,{width:k,height:k,borderRadius:k/2,..._corners.smoothCorners,left:Ae,top:Ee,backgroundColor:Pe.primary,borderColor:Pe.background.elevated,transform:[{translateX:De}]},N]}):null,(ut=i.map(e=>{const t=e.key===r,i=t?Ve:ze,n=t?Fe:ze,l="string"==typeof e.icon?{name:e.icon,variant:"bold"}:e.icon,s=t?e.activeIcon??l:e.icon,c=xe.current[e.key],d=Re.current[e.key],u=formatBadge(e.badge??null),_=badgeAccessibilitySuffix(e.badge??null),h=ie&&!t?.7:1,p=ee&&t||ie?Pe.primary:Pe.background.elevated,g=hasLabel(e),m=g&&(!te||t),b=(0,_jsxRuntime.jsxs)(_reactNative.Animated.View,{style:[w.iconWrap,{width:T+4,height:T+4,opacity:h,transform:[{scale:c}]}],children:[(0,_index3.renderSlotIcon)(s,{color:n,size:T,focused:t,disabled:!1}),u?(0,_jsxRuntime.jsx)(_reactNative.View,{style:[u.isDot?w.badgeDot:w.badgePill,{backgroundColor:Pe.error,borderColor:p}],children:u.isDot?null:(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[w.badgeText,{color:Pe.onError}],numberOfLines:1,children:u.text})}):null]}),f=ee?(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{style:{top:d.interpolate({inputRange:[0,1],outputRange:[0,-V]})},children:b}):b,y=m?(0,_jsxRuntime.jsx)(_reactNative.Animated.Text,{numberOfLines:1,maxFontSizeMultiplier:I??E.maxFontSizeMultiplier??1.2,style:[w.label,te?w.labelInline:null,{color:i,opacity:te?d:h,fontWeight:t?E.typography.fontWeight.semibold:E.typography.fontWeight.normal},A],children:e.label}):null,R=(0,_jsxRuntime.jsx)(_reactNative.Pressable,{onPress:()=>(e=>{U&&W(x),e.key!==r&&!1!==o&&(0,_index2.triggerHaptic)(o);const t=xe.current[e.key];t&&popIcon(t),a(e.key)})(e),accessibilityRole:"tab",accessibilityState:{selected:t},"aria-selected":t,accessibilityLabel:`${e.label}${_}`,accessibilityHint:`Switches to ${e.label}`,hitSlop:{top:6,bottom:6,left:6,right:6},style:({pressed:e})=>[w.tab,J?w.tabTile:null,e?{opacity:.85}:null],testID:j?`${j}-tab-${e.key}`:void 0,children:te?(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[w.expandPill,{height:D,paddingHorizontal:t&&g?E.spacing.md:Math.max(0,(D-(T+4))/2)}],children:[(0,_jsxRuntime.jsx)(_reactNative.View,{pointerEvents:"none",style:[w.expandFill,{borderRadius:activeBgRadius(D,D/2),..._corners.smoothCorners,backgroundColor:t?Pe.primaryMuted:"transparent"},t?N:null]}),f,y]}):(0,_jsxRuntime.jsxs)(_jsxRuntime.Fragment,{children:[f,y]})},e.key);return te?(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{style:{flex:d.interpolate({inputRange:[0,1],outputRange:[1,g?1.5:1]})},children:R},e.key):R}),st?[...ut.slice(0,ce),st,...ut.slice(ce)]:ut),"underline"===s&&be>0?(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{pointerEvents:"none",style:[w.underline,"top"===c?w.underlineTop:w.underlineBottom,"top"===c?{top:-qe-K}:{bottom:-qe},{width:be,height:L?.underlineHeight??3,backgroundColor:Pe.primary,transform:[{translateX:De}]},N]}):null]});var ut;return(0,_jsxRuntime.jsx)(_reactNative.View,{ref:t,testID:j,accessibilityRole:"tablist",style:[w.outer,{paddingHorizontal:We,paddingTop:Math.max(Oe,lt),paddingBottom:Xe},v],children:(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[Q?w.floatingBar:w.dockedBar,X?w.barInline:null,it,{backgroundColor:ke,borderColor:rt,borderRadius:Ke,..._corners.smoothCorners},Q?{borderWidth:nt,paddingHorizontal:Ge,paddingVertical:qe}:{borderTopWidth:nt,borderBottomWidth:nt,borderLeftWidth:nt,borderRightWidth:nt,paddingHorizontal:Qe,paddingTop:qe,paddingBottom:$e}],children:[ct,dt]})})});BottomNavigation.displayName="BottomNavigation";const buildStyles=e=>_reactNative.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,..._corners.smoothCorners},underlineTop:{borderBottomLeftRadius:2,borderBottomRightRadius:2,..._corners.smoothCorners},badgePill:{position:"absolute",top:-4,right:-8,minWidth:18,height:18,borderRadius:9,..._corners.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,..._corners.smoothCorners,borderWidth:1.5},badgeText:{fontSize:10,fontWeight:"700",lineHeight:12,textAlign:"center",includeFontPadding:!1}});var _default=exports.default=BottomNavigation;
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=exports.BottomNavigation=void 0;var _react=_interopRequireWildcard(require("react")),_reactNative=require("react-native"),_reactNativeSafeAreaContext=require("react-native-safe-area-context"),_useReducedMotion=require("../../hooks/useReducedMotion.js"),_index=require("../../theme/index.js"),_index2=require("../../utils/index.js"),_corners=require("../../utils/corners.js"),_shadows=require("../../utils/shadows.js"),_index3=require("../AppIcon/index.js"),_useScreenReaderEnabled=require("./useScreenReaderEnabled.js"),_jsxRuntime=require("react/jsx-runtime");function _interopRequireWildcard(e,t){if("function"==typeof WeakMap)var i=new WeakMap,n=new WeakMap;return(_interopRequireWildcard=function(e,t){if(!t&&e&&e.__esModule)return e;var r,a,o={__proto__:null,default:e};if(null===e||"object"!=typeof e&&"function"!=typeof e)return o;if(r=t?n:i){if(r.has(e))return r.get(e);r.set(e,o)}for(const t in e)"default"!==t&&{}.hasOwnProperty.call(e,t)&&((a=(r=Object.defineProperty)&&Object.getOwnPropertyDescriptor(e,t))&&(a.get||a.set)?r(o,t,a):o[t]=e[t]);return o})(e,t)}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=exports.BottomNavigation=(0,_react.forwardRef)((e,t)=>{const{tabs:i,centerAction:n,activeTab:r,onChange:a,haptic:o="selection",showLabels:l=!0,variant:s="pill",indicatorPosition:c="bottom",radius:d,indicatorRadius:u="auto",elevation:_,iconSize:h,marginHorizontal:p,marginVertical:g,paddingHorizontal:m,paddingVertical:b,border:f,minimizeOnScroll:y=!1,scrollDirection:x="idle",accessory:R,style:v,indicatorStyle:N,labelStyle:A,labelMaxFontScale:I,testID:j}=e,E=(0,_index.useTheme)(),S=(0,_reactNativeSafeAreaContext.useSafeAreaInsets)(),w=(0,_react.useMemo)(()=>buildStyles(E),[E]),L=E.components.bottomNavigation,T=h??L?.iconSize??18,D=L?.pillHeight??T+4+8,C=L?.pillMaxWidth??64,M=L?.pillInset??16,B=L?.floatingMargin??16,P=L?.floatingRadius??28,k=L?.bubbleSize??48,V=L?.bubbleLift??14,z=(0,_useReducedMotion.useReducedMotion)(),H=(0,_useScreenReaderEnabled.useScreenReaderEnabled)(y),[F,W]=_react.default.useState(null);(0,_react.useEffect)(()=>{null!==F&&F!==x&&W(null)},[F,x]);const O=y&&!H&&"down"===x&&null===F,[U,q]=_react.default.useState(O);(0,_react.useEffect)(()=>{U!==O&&(z||"web"===_reactNative.Platform.OS||_reactNative.LayoutAnimation.configureNext(_reactNative.LayoutAnimation.Presets.easeInEaseOut),q(O))},[U,O,z]);const G="function"==typeof R?R({minimized:U}):R,$=null!=G&&!1!==G,X=U&&$,[Z,Y]=_react.default.useState(0),K=$&&!X?Z+E.spacing.xs:0,J="tile"===s,Q="floating"===s||J,ee="bubble"===s,te="expand"===s,ie="solid"===s,ne="pill"===s||Q||ie,re=Math.max(0,i.findIndex(e=>e.key===r)),[ae,oe]=_react.default.useState(0),[le,se]=_react.default.useState(0),ce=n?Math.ceil(i.length/2):i.length,de=i.length+(n?1:0),[ue,he]=_react.default.useState({width:0,height:0}),pe=n?.size??48,ge=void 0!==n?.gap,me=Math.max(0,n?.gap??0),be=ge?(ue.width||pe)+2*me:0,fe=ge?i.length>0?Math.max(0,ae-be)/i.length:0:de>0?ae/de:0,ye=ge?be:fe,xe=(0,_react.useRef)((0,_index.createAnimatedValue)(re)).current,Re=(0,_react.useRef)({}),ve=(0,_react.useRef)({});i.forEach(e=>{Re.current[e.key]||(Re.current[e.key]=new _reactNative.Animated.Value(1)),ve.current[e.key]||(ve.current[e.key]=(0,_index.createAnimatedValue)(e.key===r?1:0))});const Ne=fe>0?J?Math.min(fe-4,96):Math.min(fe-M,C):0,Ae=fe>0?(fe-Ne)/2:0,Ie=fe>0?(fe-k)/2:0,hasLabel=e=>l&&!U&&!1!==e.showLabel&&e.label.trim().length>0,je=i[re],Ee=je&&!hasLabel(je)&&le>0?le/2:6+(T+4)/2,Se=Ee-V-k/2,we=Math.max(0,le-4),Le=J?2:Ee-D/2,Te=(0,_react.useRef)(re);(0,_react.useEffect)(()=>{if(Te.current===re)return;Te.current=re;const e=_reactNative.Animated.spring(xe,{toValue:re,tension:120,friction:14,useNativeDriver:!0});return e.start(),()=>e.stop()},[re,xe]);const De=Math.max(1,i.length-1),Ce=(0,_react.useMemo)(()=>{const e=[],t=[];for(let i=0;i<=De;i++)e.push(i),t.push(i<ce?i*fe:i*fe+ye);return xe.interpolate({inputRange:e,outputRange:t})},[xe,De,ce,fe,ye]),Me=i.map(e=>e.key).join(" "),Be=ee||te;(0,_react.useEffect)(()=>{const e=Me.split(" ").flatMap(e=>{const t=e===r?1:0,i=ve.current[e];return i?Be?[_reactNative.Animated.spring(i,{toValue:t,tension:140,friction:13,useNativeDriver:!1})]:(i.setValue(t),[]):[]});if(0===e.length)return;const t=_reactNative.Animated.parallel(e);return t.start(),()=>t.stop()},[r,Me,Be]);const popIcon=e=>{_reactNative.Animated.sequence([_reactNative.Animated.timing(e,{toValue:1.15,duration:120,useNativeDriver:!0}),_reactNative.Animated.spring(e,{toValue:1,tension:200,friction:8,useNativeDriver:!0})]).start()},Pe=(0,_react.useRef)(new _reactNative.Animated.Value(1)).current,{colors:ke}=E,Ve=ie?ke.primary:ke.background.elevated,ze=ie?ke.onPrimary:ke.primary,He=ie?ke.onPrimary:J?ke.text.primary:ke.text.tertiary,Fe=ie?ke.onPrimary:ke.primaryMuted,We=ie?ke.primary:ee?ke.onPrimary:ze,Oe=p??B,Ue=g??(Q?B:0),qe=Ue>0,Ge=b??(Q?6:ee?8:6),$e=m??(Q?8:4),Xe=qe?Ge:Math.max(Ge,S.bottom),Ze=qe?Math.max(Ue,S.bottom):0,Ye="full"===d,Ke=Q?le+K+2*Ge+2*_reactNative.StyleSheet.hairlineWidth:le+K+Ge+Xe,Je=Ye?le>0?Ke/2:E.radius.full:d??L?.borderRadius??(J?E.radius.full:Q?P:0),Qe=void 0!==d||void 0!==L?.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($e,Ye&&0===le?0:Je):$e,tt=_??"none",it=E.shadows[tt],nt="none"===tt?null:(0,_shadows.supportsBoxShadow)()?{boxShadow:(0,_shadows.toBoxShadow)(it)}:it,rt=f?_reactNative.StyleSheet.hairlineWidth:0,at=ie?ke.primary:ke.border.primary,ot=n?.lift??0,lt=Ge+rt+K,st=n&&le>0?Math.max(0,(ue.height||pe)/2+ot-le/2-lt):0,ct=n?(0,_jsxRuntime.jsx)(_reactNative.View,{style:[w.centerCell,ge?{flex:0,marginHorizontal:me}:null],pointerEvents:"box-none",children:(0,_jsxRuntime.jsx)(_reactNative.Pressable,{onPress:()=>{if(!n)return;const e=n.haptic??o;!1!==e&&(0,_index2.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:-ot},e?{opacity:.85}:null],testID:n.testID??(j?`${j}-center`:void 0),children:n.content?(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{style:{transform:[{scale:Pe}]},children:n.content}):(0,_jsxRuntime.jsx)(_reactNative.View,{style:[w.centerCircle,{width:pe,height:pe,borderRadius:pe/2,..._corners.smoothCorners,backgroundColor:n.color??ke.primary}],children:(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{style:{transform:[{scale:Pe}]},children:(0,_index3.renderSlotIcon)(n.icon??"add",{color:n.iconColor??ke.onPrimary,size:n.iconSize??24,disabled:!1})})})})},CENTER_KEY):null,dt=$?(0,_jsxRuntime.jsx)(_reactNative.View,{style:X?w.accessoryInline:w.accessoryStacked,onLayout:e=>Y(e.nativeEvent.layout.height),testID:j?`${j}-accessory`:void 0,children:G}):null,ut=(0,_jsxRuntime.jsxs)(_reactNative.View,{style:X?[w.tabRow,w.tabRowInline]:w.tabRow,onLayout:e=>{const{width:t,height:i}=e.nativeEvent.layout;oe(t),se(i)},children:[ne&&Ne>0&&(!J||we>0)?(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{pointerEvents:"none",style:[w.pill,{width:Ne,height:J?we:D,left:Ae,top:Le,backgroundColor:Fe,borderRadius:J?activeBgRadius(we,we/2):activeBgRadius(D,E.radius.full),..._corners.smoothCorners,transform:[{translateX:Ce}]},N]}):null,ee&&fe>0?(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{pointerEvents:"none",style:[w.bubble,E.shadows.md,{width:k,height:k,borderRadius:k/2,..._corners.smoothCorners,left:Ie,top:Se,backgroundColor:ke.primary,borderColor:ke.background.elevated,transform:[{translateX:Ce}]},N]}):null,(_t=i.map(e=>{const t=e.key===r,i=t?ze:He,n=t?We:He,l="string"==typeof e.icon?{name:e.icon,variant:"bold"}:e.icon,s=t?e.activeIcon??l:e.icon,c=Re.current[e.key],d=ve.current[e.key],u=formatBadge(e.badge??null),_=badgeAccessibilitySuffix(e.badge??null),h=ie&&!t?.7:1,p=ee&&t||ie?ke.primary:ke.background.elevated,g=hasLabel(e),m=g&&(!te||t),b=(0,_jsxRuntime.jsxs)(_reactNative.Animated.View,{style:[w.iconWrap,{width:T+4,height:T+4,opacity:h,transform:[{scale:c}]}],children:[(0,_index3.renderSlotIcon)(s,{color:n,size:T,focused:t,disabled:!1}),u?(0,_jsxRuntime.jsx)(_reactNative.View,{style:[u.isDot?w.badgeDot:w.badgePill,{backgroundColor:ke.error,borderColor:p}],children:u.isDot?null:(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[w.badgeText,{color:ke.onError}],numberOfLines:1,children:u.text})}):null]}),f=ee?(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{style:{top:d.interpolate({inputRange:[0,1],outputRange:[0,-V]})},children:b}):b,y=m?(0,_jsxRuntime.jsx)(_reactNative.Animated.Text,{numberOfLines:1,maxFontSizeMultiplier:I??E.maxFontSizeMultiplier??1.2,style:[w.label,te?w.labelInline:null,{color:i,opacity:te?d:h,fontWeight:t?E.typography.fontWeight.semibold:E.typography.fontWeight.normal},A],children:e.label}):null,R=(0,_jsxRuntime.jsx)(_reactNative.Pressable,{onPress:()=>(e=>{U&&W(x),e.key!==r&&!1!==o&&(0,_index2.triggerHaptic)(o);const t=Re.current[e.key];t&&popIcon(t),a(e.key)})(e),accessibilityRole:"tab",accessibilityState:{selected:t},"aria-selected":t,accessibilityLabel:`${e.label}${_}`,accessibilityHint:`Switches to ${e.label}`,hitSlop:{top:6,bottom:6,left:6,right:6},style:({pressed:e})=>[w.tab,J?w.tabTile:null,e?{opacity:.85}:null],testID:j?`${j}-tab-${e.key}`:void 0,children:te?(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[w.expandPill,{height:D,paddingHorizontal:t&&g?E.spacing.md:Math.max(0,(D-(T+4))/2)}],children:[(0,_jsxRuntime.jsx)(_reactNative.View,{pointerEvents:"none",style:[w.expandFill,{borderRadius:activeBgRadius(D,D/2),..._corners.smoothCorners,backgroundColor:t?ke.primaryMuted:"transparent"},t?N:null]}),f,y]}):(0,_jsxRuntime.jsxs)(_jsxRuntime.Fragment,{children:[f,y]})},e.key);return te?(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{style:{flex:d.interpolate({inputRange:[0,1],outputRange:[1,g?1.5:1]})},children:R},e.key):R}),ct?[..._t.slice(0,ce),ct,..._t.slice(ce)]:_t),"underline"===s&&fe>0?(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{pointerEvents:"none",style:[w.underline,"top"===c?w.underlineTop:w.underlineBottom,"top"===c?{top:-Ge-K}:{bottom:-Ge},{width:fe,height:L?.underlineHeight??3,backgroundColor:ke.primary,transform:[{translateX:Ce}]},N]}):null]});var _t;return(0,_jsxRuntime.jsx)(_reactNative.View,{ref:t,testID:j,accessibilityRole:"tablist",style:[w.outer,{paddingHorizontal:Oe,paddingTop:Math.max(Ue,st),paddingBottom:Ze},v],children:(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[Q?w.floatingBar:w.dockedBar,X?w.barInline:null,nt,{backgroundColor:Ve,borderColor:at,borderRadius:Je,..._corners.smoothCorners},Q?{borderWidth:rt,paddingHorizontal:$e,paddingVertical:Ge}:{borderTopWidth:rt,borderBottomWidth:rt,borderLeftWidth:rt,borderRightWidth:rt,paddingHorizontal:et,paddingTop:Ge,paddingBottom:Xe}],children:[dt,ut]})})});BottomNavigation.displayName="BottomNavigation";const buildStyles=e=>_reactNative.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,..._corners.smoothCorners},underlineTop:{borderBottomLeftRadius:2,borderBottomRightRadius:2,..._corners.smoothCorners},badgePill:{position:"absolute",top:-4,right:-8,minWidth:18,height:18,borderRadius:9,..._corners.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,..._corners.smoothCorners,borderWidth:1.5},badgeText:{fontSize:10,fontWeight:"700",lineHeight:12,textAlign:"center",includeFontPadding:!1}});var _default=exports.default=BottomNavigation;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.useBottomSheet=exports.default=exports.BottomSheet=void 0;var _react=require("react"),_reactNative=require("react-native"),_reactNativeGestureHandler=require("react-native-gesture-handler"),_reactNativeKeyboardController=require("react-native-keyboard-controller"),_reactNativeReanimated=_interopRequireWildcard(require("react-native-reanimated")),_reactNativeSafeAreaContext=require("react-native-safe-area-context"),_index=require("../../theme/index.js"),_index2=require("../../utils/index.js"),_corners=require("../../utils/corners.js"),_ToastProvider=require("../Toast/ToastProvider.js"),_jsxRuntime=require("react/jsx-runtime");function _interopRequireWildcard(e,t){if("function"==typeof WeakMap)var a=new WeakMap,r=new WeakMap;return(_interopRequireWildcard=function(e,t){if(!t&&e&&e.__esModule)return e;var n,o,s={__proto__:null,default:e};if(null===e||"object"!=typeof e&&"function"!=typeof e)return s;if(n=t?r:a){if(n.has(e))return n.get(e);n.set(e,s)}for(const t in e)"default"!==t&&{}.hasOwnProperty.call(e,t)&&((o=(n=Object.defineProperty)&&Object.getOwnPropertyDescriptor(e,t))&&(o.get||o.set)?n(s,t,o):s[t]=e[t]);return s})(e,t)}const TABLET_MIN_SHORT_SIDE=600,DIALOG_MAX_WIDTH=560,BottomSheetContext=(0,_react.createContext)(null),useBottomSheet=()=>{const e=(0,_react.useContext)(BottomSheetContext);if(!e)throw new Error("useBottomSheet must be used inside a <BottomSheet>.");return e};exports.useBottomSheet=useBottomSheet;const SPRING_CONFIG={damping:20,stiffness:240,mass:1},CLOSE_VELOCITY_THRESHOLD=1e3,DRAG_ACTIVATION_OFFSET=10,BottomSheet=exports.BottomSheet=(0,_react.forwardRef)((e,t)=>{const{snapPoints:a,index:r,onChange:n,onAnimate:o,onAfterClose:s,enablePanDownToClose:i=!0,enableBackdropPress:c=!0,confirmDismiss:l,scrollable:u=!1,scrollRef:d,onScroll:_,onContentSizeChange:h,onScrollLayout:m,scrollEventThrottle:v,keyboardBehavior:f="shift",mode:b="modal",presentation:p="sheet",handleIndicatorStyle:x,containerStyle:S,header:R,footer:g,headerStyle:y,footerStyle:N,children:w,accessibilityLabel:C,accessibilityViewIsModal:j,testID:k}=e,I=(0,_index.useTheme)(),M=(0,_reactNativeSafeAreaContext.useSafeAreaInsets)(),[O,T]=(0,_react.useState)(()=>_reactNative.Dimensions.get("window").height),[H,P]=(0,_react.useState)(()=>_reactNative.Dimensions.get("window").width),B=(0,_react.useCallback)(e=>{const{height:t,width:a}=e.nativeEvent.layout;t>0&&T(e=>e===t?e:t),a>0&&P(e=>e===a?e:a)},[]),D=(0,_reactNative.useWindowDimensions)(),G="dialog"===p||"auto"===p&&Math.min(D.width,D.height)>=600,V=Math.min(560,H-2*I.spacing.xl),[A,E]=(0,_react.useState)({top:M.top,bottom:M.bottom}),L="modal"===b?A.top:M.top,q="modal"===b?A.bottom:M.bottom,F=a.includes("content"),[W,J]=useMeasuredHeight(),[z,Y]=useMeasuredHeight(),[$,K,X]=useMeasuredHeight(),[U,Q]=useMeasuredHeight(),Z=G?I.spacing.md:W,ee=F?Math.min(Z+(null!=R?z:0)+$+(null!=g?U:0)+q,O-L):0,te=(0,_react.useCallback)((e,t)=>{F&&X(t),h?.(e,t)},[F,h,X]),ae=(0,_react.useMemo)(()=>resolveSnapPoints(a,O,ee),[a,O,ee]),re=O,ne=ae[ae.length-1]??0,oe=(0,_reactNativeReanimated.useSharedValue)(re),se=(0,_reactNativeReanimated.useSharedValue)(re),ie=(0,_reactNativeReanimated.useSharedValue)(-1),[ce,le]=(0,_react.useState)(-1),ue=(0,_react.useRef)(!1),[de,_e]=(0,_react.useState)(!1),[he,me]=(0,_react.useState)(!1),ve=(0,_react.useRef)(!1),fe=(0,_react.useRef)(s);fe.current=s;const[be,pe]=(0,_react.useState)(!1),xe=(0,_react.useRef)(-1),Se=(0,_react.useRef)(!1);Se.current="modal"===b?he:be;const Re=(0,_react.useRef)(l);Re.current=l;const ge=(0,_react.useRef)(!1),ye=(0,_react.useRef)(!0),Ne=(0,_react.useRef)([]),we=(0,_react.useCallback)(e=>{const t=Ne.current;Ne.current=[];for(const a of t)a(e)},[]);(0,_react.useEffect)(()=>(ye.current=!0,()=>{ye.current=!1,we(!1)}),[we]);const Ce=(0,_react.useCallback)(e=>{if(e<0||e>=ae.length)return re;const t=ae[e];return G?(O-t)/2:O-t},[ae,O,re,G]),je=(0,_react.useCallback)(e=>{xe.current=e;ce!==e&&(le(e),ie.value=e,n?.(e))},[ce,ie,n]),ke=(0,_react.useCallback)(()=>{ue.current=!1,ie.value<0&&(ve.current=!0,"modal"===b?(_e(!1),"ios"!==_reactNative.Platform.OS&&me(!1)):pe(!1))},[b,ie]),Ie=(0,_react.useCallback)(()=>{ve.current&&me(!1)},[]);(0,_react.useEffect)(()=>{("modal"===b?!he:!be)&&ve.current&&(ve.current=!1,fe.current?.(),we(!0))},[b,he,be,we]);const Me=(0,_react.useCallback)((e,t,a)=>{ue.current=!0,o?.(t,a),oe.value=(0,_reactNativeReanimated.withSpring)(e,SPRING_CONFIG,e=>{"worklet";e&&(0,_reactNativeReanimated.runOnJS)(ke)()})},[o,oe,ke]),Oe=(0,_react.useCallback)(e=>{const t="number"==typeof e?clamp(e,0,ae.length-1):ce>=0?ce:0,a=ie.value,r=Ce(t);ve.current=!1,we(!1),"modal"===b?(me(!0),_e(!0)):pe(!0),a<0&&(oe.value=re),je(t),Me(r,a,t)},[Me,re,ce,ie,b,ae.length,je,we,oe,Ce]),Te=(0,_react.useCallback)(()=>{if(0===ae.length)return;const e=ie.value,t=Ce(0);je(0),Me(t,e,0)},[Me,ie,ae.length,je,Ce]),He=(0,_react.useCallback)(()=>new Promise(e=>{if(xe.current<0)return void(Se.current?Ne.current.push(e):e(!0));Ne.current.push(e);const t=ie.value;je(-1),ue.current=!0,o?.(t,-1),oe.value=(0,_reactNativeReanimated.withTiming)(re,{duration:I.motion.duration.fast,easing:_reactNativeReanimated.Easing.bezier(...I.motion.easing.accelerate)},e=>{"worklet";e&&(0,_reactNativeReanimated.runOnJS)(ke)()})}),[re,ie,ke,o,je,oe,I.motion.duration.fast,I.motion.easing.accelerate]),Pe=(0,_react.useCallback)(async()=>{await He()},[He]),Be=(0,_react.useCallback)((e,t,a)=>{const r=Re.current;if(!r)return void e();if(ge.current)return void t?.();const n=r();"boolean"!=typeof n?(ge.current=!0,a?.(),n.then(a=>{ge.current=!1,a&&ye.current&&xe.current>=0?e():t?.()},e=>{throw ge.current=!1,e})):(n?e:t)?.()},[]),De=(0,_react.useCallback)(()=>new Promise(e=>{xe.current<0?He().then(e):Be(()=>{He().then(e)},()=>e(!1))}),[He,Be]),Ge=(0,_react.useCallback)(()=>{Be(()=>{Pe()})},[Pe,Be]);(0,_react.useImperativeHandle)(t,()=>({expand:Oe,collapse:Te,close:Pe,requestClose:De}),[Oe,Te,Pe,De]),(0,_react.useEffect)(()=>{"number"==typeof r&&r!==ce&&(-1===r?Pe():Oe(r))},[r]);const Ve=(0,_react.useRef)({hostHeight:O,contentSnap:ee});(0,_react.useEffect)(()=>{const e=Ve.current;e.hostHeight===O&&e.contentSnap===ee||(Ve.current={hostHeight:O,contentSnap:ee},e.hostHeight===O&&ie.value<0||(oe.value=(0,_reactNativeReanimated.withSpring)(Ce(ie.value),SPRING_CONFIG)))},[O,ee]);const Ae=O-ne,Ee=(0,_react.useMemo)(()=>ae.map(e=>O-e),[ae,O]),Le=(0,_react.useCallback)(()=>{const e=xe.current;e<0||Me(Ce(e),e,e)},[Me,Ce]),qe=(0,_react.useCallback)((e,t)=>{const a=ie.value;-1!==e?(je(e),Me(t,a,e)):Be(()=>{(0,_index2.triggerHaptic)("selection"),Pe()},Le,Le)},[Me,Pe,ie,Be,je,Le]),Fe=(0,_react.useMemo)(()=>_reactNativeGestureHandler.Gesture.Native().withTestId(k?`${k}-content-gesture`:"bottom-sheet-content-gesture"),[k]),We=(0,_react.useMemo)(()=>{const e=Ee,t=re,a=Ae,r=i;return _reactNativeGestureHandler.Gesture.Pan().withTestId(k?`${k}-pan-gesture`:"bottom-sheet-pan-gesture").activeOffsetY([-10,10]).failOffsetX([-15,15]).onStart(()=>{"worklet";se.value=oe.value}).onUpdate(e=>{"worklet";const t=se.value+e.translationY;oe.value=t<a?a+.25*(t-a):t}).onEnd(a=>{"worklet";const n=oe.value;if(a.velocityY>1e3)return r?void(0,_reactNativeReanimated.runOnJS)(qe)(-1,t):void(0,_reactNativeReanimated.runOnJS)(qe)(0,e[0]);let o=0,s=Math.abs(n-e[0]);for(let t=1;t<e.length;t++){const a=Math.abs(n-e[t]);a<s&&(s=a,o=t)}const i=e[0];r&&n-i>80?(0,_reactNativeReanimated.runOnJS)(qe)(-1,t):(0,_reactNativeReanimated.runOnJS)(qe)(o,e[o])})},[re,se,i,qe,Ae,Ee,k,oe]),{height:Je}=(0,_reactNativeKeyboardController.useReanimatedKeyboardAnimation)(),ze="shift"===f,Ye=(0,_reactNativeReanimated.useDerivedValue)(()=>ze?Je.value:0),$e=ae[ce>=0?ce:0]??ne,Ke=I.spacing.md,Xe=(0,_reactNativeReanimated.useAnimatedStyle)(()=>{if(G){const e=Ye.value,t=O+e-$e-Ke,a=e<0&&oe.value>t?t:oe.value;return{top:a<L?L:a}}const e=oe.value+Ye.value,t=Ye.value<0?L:Ae;return{top:e<t?t:e}}),Ue=(0,_reactNativeReanimated.useAnimatedStyle)(()=>{const e=Ye.value;if(G){const t=O+e-$e-Ke,a=e<0&&oe.value>t?t:oe.value,r=O+e-Ke-(a<L?L:a);return{height:r<0?0:r>$e?$e:r}}const t=e<0?L:Ae,a=oe.value+e,r=O+e-(a<t?t:a);return{height:r<0?0:r>ne?ne:r}}),Qe=ce>=0,Ze=(0,_react.useMemo)(()=>buildStyles(I),[I]),et=(0,_react.useCallback)(()=>{c&&Be(()=>{(0,_index2.triggerHaptic)("selection"),Pe()})},[c,Pe,Be]),tt=(0,_react.useMemo)(()=>_reactNativeGestureHandler.Gesture.Tap().withTestId(k?`${k}-backdrop-gesture`:"bottom-sheet-backdrop-gesture").maxDuration(250).onEnd((e,t)=>{"worklet";t&&(0,_reactNativeReanimated.runOnJS)(et)()}),[et,k]),at=(0,_react.useMemo)(()=>({snapIndex:ce,snapPoints:ae,expand:Oe,collapse:Te,close:Pe,requestClose:De}),[ce,ae,Oe,Te,Pe,De]);if("inline"===b&&!be)return null;if("modal"===b&&!he)return null;const rt=(0,_jsxRuntime.jsxs)(_reactNative.View,{collapsable:!1,style:["modal"===b?Ze.backdropModal:Ze.backdropInline,{backgroundColor:I.colors.background.overlay}],onLayout:B,testID:k,accessibilityViewIsModal:j??Qe,children:[(0,_jsxRuntime.jsx)(_reactNativeGestureHandler.GestureDetector,{gesture:tt,children:(0,_jsxRuntime.jsx)(_reactNativeReanimated.default.View,{style:_reactNative.StyleSheet.absoluteFill,accessibilityRole:"button",accessibilityLabel:"Close bottom sheet"})}),(0,_jsxRuntime.jsx)(_reactNativeReanimated.default.View,{accessibilityRole:"alert",accessibilityLabel:C,accessibilityViewIsModal:j??Qe,style:[Ze.sheet,{height:ne,backgroundColor:I.colors.background.elevated,borderTopLeftRadius:I.radius["2xl"],borderTopRightRadius:I.radius["2xl"],..._corners.smoothCorners,...I.shadows.xl},G?{height:$e,left:(H-V)/2,right:void 0,width:V,borderBottomLeftRadius:I.radius["2xl"],borderBottomRightRadius:I.radius["2xl"]}:null,S,Xe],children:(0,_jsxRuntime.jsxs)(SheetBody,{style:[Ze.body,Ue],keyboardOffset:Ye,children:[G?(0,_jsxRuntime.jsx)(_reactNative.View,{style:{height:I.spacing.md}}):(0,_jsxRuntime.jsx)(_reactNativeGestureHandler.GestureDetector,{gesture:We,children:(0,_jsxRuntime.jsx)(_reactNative.View,{style:Ze.handleRow,onLayout:F?J:void 0,accessible:!0,accessibilityLabel:"Drag handle",accessibilityHint:"Drag up or down to resize the sheet, or swipe down to close it",testID:k?`${k}-handle`:"bottom-sheet-handle",children:(0,_jsxRuntime.jsx)(_reactNative.View,{style:[Ze.handle,{backgroundColor:I.components.bottomSheet?.handleColor??I.colors.border.primary},x]})})}),null!=R&&(0,_jsxRuntime.jsx)(_reactNative.View,{style:[Ze.header,y],onLayout:F?Y:void 0,children:R}),u?(0,_jsxRuntime.jsx)(_reactNativeGestureHandler.GestureDetector,{gesture:Fe,children:(0,_jsxRuntime.jsx)(_reactNative.ScrollView,{ref:d,style:Ze.scrollContent,onScroll:_,onContentSizeChange:te,onLayout:m,scrollEventThrottle:v,keyboardShouldPersistTaps:"always",keyboardDismissMode:"none",children:w})}):(0,_jsxRuntime.jsx)(_reactNative.View,{style:Ze.content,children:F?(0,_jsxRuntime.jsx)(_reactNative.View,{onLayout:K,children:w}):w}),null!=g&&(0,_jsxRuntime.jsx)(_reactNative.View,{style:[Ze.footer,N],onLayout:F?Q:void 0,children:g})]})})]}),nt=(0,_jsxRuntime.jsx)(BottomSheetContext.Provider,{value:at,children:rt});return"modal"===b?(0,_jsxRuntime.jsx)(_reactNative.Modal,{transparent:!0,visible:de,onRequestClose:Ge,onDismiss:"ios"===_reactNative.Platform.OS?Ie:void 0,statusBarTranslucent:!0,navigationBarTranslucent:!0,animationType:"none",supportedOrientations:["portrait","landscape"],children:(0,_jsxRuntime.jsxs)(_reactNativeSafeAreaContext.SafeAreaProvider,{style:Ze.modalRoot,children:[(0,_jsxRuntime.jsx)(InsetsProbe,{onChange:E}),"android"===_reactNative.Platform.OS?(0,_jsxRuntime.jsx)(_reactNativeGestureHandler.GestureHandlerRootView,{style:Ze.modalRoot,children:nt}):nt,(0,_jsxRuntime.jsx)(_ToastProvider.ToastHost,{})]})}):nt}),InsetsProbe=({onChange:e})=>{const{top:t,bottom:a}=(0,_reactNativeSafeAreaContext.useSafeAreaInsets)();return(0,_react.useEffect)(()=>{e(e=>e.top===t&&e.bottom===a?e:{top:t,bottom:a})},[t,a,e]),null},SheetBody=({style:e,keyboardOffset:t,children:a})=>{const r=(0,_reactNativeSafeAreaContext.useSafeAreaInsets)().bottom,n=(0,_reactNativeReanimated.useAnimatedStyle)(()=>{const e=r+t.value;return{paddingBottom:e>0?e:0}});return(0,_jsxRuntime.jsx)(_reactNativeReanimated.default.View,{style:[e,n],children:a})};BottomSheet.displayName="BottomSheet";const useMeasuredHeight=()=>{const[e,t]=(0,_react.useState)(0),a=(0,_react.useCallback)(e=>{t(t=>t===e?t:e)},[]);return[e,(0,_react.useCallback)(e=>a(e.nativeEvent.layout.height),[a]),a]},resolveSnapPoints=(e,t,a)=>[...e.map(e=>{if("number"==typeof e)return e;if("content"===e)return a;const r=parseFloat(e);return Number.isNaN(r)?0:r/100*t})].sort((e,t)=>e-t),clamp=(e,t,a)=>Math.min(Math.max(e,t),a),buildStyles=e=>_reactNative.StyleSheet.create({backdropModal:{flex:1},backdropInline:{..._reactNative.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,..._corners.smoothCorners},content:{flex:1,overflow:"hidden"},scrollContent:{flex:1},modalRoot:{flex:1}});var _default=exports.default=BottomSheet;
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.useBottomSheet=exports.default=exports.BottomSheet=void 0;var _react=require("react"),_reactNative=require("react-native"),_reactNativeGestureHandler=require("react-native-gesture-handler"),_reactNativeKeyboardController=require("react-native-keyboard-controller"),_reactNativeReanimated=_interopRequireWildcard(require("react-native-reanimated")),_reactNativeSafeAreaContext=require("react-native-safe-area-context"),_index=require("../../theme/index.js"),_index2=require("../../utils/index.js"),_corners=require("../../utils/corners.js"),_ModalSafeArea=require("../ModalSafeArea/ModalSafeArea.js"),_ToastProvider=require("../Toast/ToastProvider.js"),_jsxRuntime=require("react/jsx-runtime");function _interopRequireWildcard(e,t){if("function"==typeof WeakMap)var a=new WeakMap,r=new WeakMap;return(_interopRequireWildcard=function(e,t){if(!t&&e&&e.__esModule)return e;var n,o,s={__proto__:null,default:e};if(null===e||"object"!=typeof e&&"function"!=typeof e)return s;if(n=t?r:a){if(n.has(e))return n.get(e);n.set(e,s)}for(const t in e)"default"!==t&&{}.hasOwnProperty.call(e,t)&&((o=(n=Object.defineProperty)&&Object.getOwnPropertyDescriptor(e,t))&&(o.get||o.set)?n(s,t,o):s[t]=e[t]);return s})(e,t)}const TABLET_MIN_SHORT_SIDE=600,DIALOG_MAX_WIDTH=560,BottomSheetContext=(0,_react.createContext)(null),useBottomSheet=()=>{const e=(0,_react.useContext)(BottomSheetContext);if(!e)throw new Error("useBottomSheet must be used inside a <BottomSheet>.");return e};exports.useBottomSheet=useBottomSheet;const SPRING_CONFIG={damping:20,stiffness:240,mass:1},CLOSE_VELOCITY_THRESHOLD=1e3,DRAG_ACTIVATION_OFFSET=10,BottomSheet=exports.BottomSheet=(0,_react.forwardRef)((e,t)=>{const{snapPoints:a,index:r,onChange:n,onAnimate:o,onAfterClose:s,enablePanDownToClose:i=!0,enableBackdropPress:l=!0,confirmDismiss:c,scrollable:u=!1,scrollRef:d,onScroll:_,onContentSizeChange:h,onScrollLayout:m,scrollEventThrottle:v,keyboardBehavior:f="shift",mode:b="modal",presentation:p="sheet",handleIndicatorStyle:S,containerStyle:x,header:R,footer:g,headerStyle:y,footerStyle:N,children:w,accessibilityLabel:C,accessibilityViewIsModal:j,testID:k}=e,M=(0,_index.useTheme)(),I=(0,_reactNativeSafeAreaContext.useSafeAreaInsets)(),[O,T]=(0,_react.useState)(()=>_reactNative.Dimensions.get("window").height),[H,B]=(0,_react.useState)(()=>_reactNative.Dimensions.get("window").width),P=(0,_react.useCallback)(e=>{const{height:t,width:a}=e.nativeEvent.layout;t>0&&T(e=>e===t?e:t),a>0&&B(e=>e===a?e:a)},[]),A=(0,_reactNative.useWindowDimensions)(),D="dialog"===p||"auto"===p&&Math.min(A.width,A.height)>=600,G=Math.min(560,H-2*M.spacing.xl),[V,q]=(0,_ModalSafeArea.useModalInsets)(),E="modal"===b?V.top:I.top,L="modal"===b?V.bottom:I.bottom,F=a.includes("content"),[W,J]=useMeasuredHeight(),[z,Y]=useMeasuredHeight(),[$,K,X]=useMeasuredHeight(),[U,Q]=useMeasuredHeight(),Z=D?M.spacing.md:W,ee=F?Math.min(Z+(null!=R?z:0)+$+(null!=g?U:0)+L,O-E):0,te=(0,_react.useCallback)((e,t)=>{F&&X(t),h?.(e,t)},[F,h,X]),ae=(0,_react.useMemo)(()=>resolveSnapPoints(a,O,ee),[a,O,ee]),re=O,ne=ae[ae.length-1]??0,oe=(0,_reactNativeReanimated.useSharedValue)(re),se=(0,_reactNativeReanimated.useSharedValue)(re),ie=(0,_reactNativeReanimated.useSharedValue)(-1),[le,ce]=(0,_react.useState)(-1),ue=(0,_react.useRef)(!1),[de,he]=(0,_react.useState)(!1),[me,ve]=(0,_react.useState)(!1),fe=(0,_react.useRef)(!1),be=(0,_react.useRef)(s);be.current=s;const[pe,Se]=(0,_react.useState)(!1),xe=(0,_react.useRef)(-1),Re=(0,_react.useRef)(!1);Re.current="modal"===b?me:pe;const ge=(0,_react.useRef)(c);ge.current=c;const ye=(0,_react.useRef)(!1),Ne=(0,_react.useRef)(!0),we=(0,_react.useRef)([]),Ce=(0,_react.useCallback)(e=>{const t=we.current;we.current=[];for(const a of t)a(e)},[]);(0,_react.useEffect)(()=>(Ne.current=!0,()=>{Ne.current=!1,Ce(!1)}),[Ce]);const je=(0,_react.useCallback)(e=>{if(e<0||e>=ae.length)return re;const t=ae[e];return D?(O-t)/2:O-t},[ae,O,re,D]),ke=(0,_react.useCallback)(e=>{xe.current=e;le!==e&&(ce(e),ie.value=e,n?.(e))},[le,ie,n]),Me=(0,_react.useCallback)(()=>{ue.current=!1,ie.value<0&&(fe.current=!0,"modal"===b?(he(!1),"ios"!==_reactNative.Platform.OS&&ve(!1)):Se(!1))},[b,ie]),Ie=(0,_react.useCallback)(()=>{fe.current&&ve(!1)},[]);(0,_react.useEffect)(()=>{("modal"===b?!me:!pe)&&fe.current&&(fe.current=!1,be.current?.(),Ce(!0))},[b,me,pe,Ce]);const Oe=(0,_react.useCallback)((e,t,a)=>{ue.current=!0,o?.(t,a),oe.value=(0,_reactNativeReanimated.withSpring)(e,SPRING_CONFIG,e=>{"worklet";e&&(0,_reactNativeReanimated.runOnJS)(Me)()})},[o,oe,Me]),Te=(0,_react.useCallback)(e=>{const t="number"==typeof e?clamp(e,0,ae.length-1):le>=0?le:0,a=ie.value,r=je(t);fe.current=!1,Ce(!1),"modal"===b?(ve(!0),he(!0)):Se(!0),a<0&&(oe.value=re),ke(t),Oe(r,a,t)},[Oe,re,le,ie,b,ae.length,ke,Ce,oe,je]),He=(0,_react.useCallback)(()=>{if(0===ae.length)return;const e=ie.value,t=je(0);ke(0),Oe(t,e,0)},[Oe,ie,ae.length,ke,je]),Be=(0,_react.useCallback)(()=>new Promise(e=>{if(xe.current<0)return void(Re.current?we.current.push(e):e(!0));we.current.push(e);const t=ie.value;ke(-1),ue.current=!0,o?.(t,-1),oe.value=(0,_reactNativeReanimated.withTiming)(re,{duration:M.motion.duration.fast,easing:_reactNativeReanimated.Easing.bezier(...M.motion.easing.accelerate)},e=>{"worklet";e&&(0,_reactNativeReanimated.runOnJS)(Me)()})}),[re,ie,Me,o,ke,oe,M.motion.duration.fast,M.motion.easing.accelerate]),Pe=(0,_react.useCallback)(async()=>{await Be()},[Be]),Ae=(0,_react.useCallback)((e,t,a)=>{const r=ge.current;if(!r)return void e();if(ye.current)return void t?.();const n=r();"boolean"!=typeof n?(ye.current=!0,a?.(),n.then(a=>{ye.current=!1,a&&Ne.current&&xe.current>=0?e():t?.()},e=>{throw ye.current=!1,e})):(n?e:t)?.()},[]),De=(0,_react.useCallback)(()=>new Promise(e=>{xe.current<0?Be().then(e):Ae(()=>{Be().then(e)},()=>e(!1))}),[Be,Ae]),Ge=(0,_react.useCallback)(()=>{Ae(()=>{Pe()})},[Pe,Ae]);(0,_react.useImperativeHandle)(t,()=>({expand:Te,collapse:He,close:Pe,requestClose:De}),[Te,He,Pe,De]),(0,_react.useEffect)(()=>{"number"==typeof r&&r!==le&&(-1===r?Pe():Te(r))},[r]);const Ve=(0,_react.useRef)({hostHeight:O,contentSnap:ee});(0,_react.useEffect)(()=>{const e=Ve.current;e.hostHeight===O&&e.contentSnap===ee||(Ve.current={hostHeight:O,contentSnap:ee},e.hostHeight===O&&ie.value<0||(oe.value=(0,_reactNativeReanimated.withSpring)(je(ie.value),SPRING_CONFIG)))},[O,ee]);const qe=O-ne,Ee=(0,_react.useMemo)(()=>ae.map(e=>O-e),[ae,O]),Le=(0,_react.useCallback)(()=>{const e=xe.current;e<0||Oe(je(e),e,e)},[Oe,je]),Fe=(0,_react.useCallback)((e,t)=>{const a=ie.value;-1!==e?(ke(e),Oe(t,a,e)):Ae(()=>{(0,_index2.triggerHaptic)("selection"),Pe()},Le,Le)},[Oe,Pe,ie,Ae,ke,Le]),We=(0,_react.useMemo)(()=>_reactNativeGestureHandler.Gesture.Native().withTestId(k?`${k}-content-gesture`:"bottom-sheet-content-gesture"),[k]),Je=(0,_react.useMemo)(()=>{const e=Ee,t=re,a=qe,r=i;return _reactNativeGestureHandler.Gesture.Pan().withTestId(k?`${k}-pan-gesture`:"bottom-sheet-pan-gesture").activeOffsetY([-10,10]).failOffsetX([-15,15]).onStart(()=>{"worklet";se.value=oe.value}).onUpdate(e=>{"worklet";const t=se.value+e.translationY;oe.value=t<a?a+.25*(t-a):t}).onEnd(a=>{"worklet";const n=oe.value;if(a.velocityY>1e3)return r?void(0,_reactNativeReanimated.runOnJS)(Fe)(-1,t):void(0,_reactNativeReanimated.runOnJS)(Fe)(0,e[0]);let o=0,s=Math.abs(n-e[0]);for(let t=1;t<e.length;t++){const a=Math.abs(n-e[t]);a<s&&(s=a,o=t)}const i=e[0];r&&n-i>80?(0,_reactNativeReanimated.runOnJS)(Fe)(-1,t):(0,_reactNativeReanimated.runOnJS)(Fe)(o,e[o])})},[re,se,i,Fe,qe,Ee,k,oe]),{height:ze}=(0,_reactNativeKeyboardController.useReanimatedKeyboardAnimation)(),Ye="shift"===f,$e=(0,_reactNativeReanimated.useDerivedValue)(()=>Ye?ze.value:0),Ke=ae[le>=0?le:0]??ne,Xe=M.spacing.md,Ue=(0,_reactNativeReanimated.useAnimatedStyle)(()=>{if(D){const e=$e.value,t=O+e-Ke-Xe,a=e<0&&oe.value>t?t:oe.value;return{top:a<E?E:a}}const e=oe.value+$e.value,t=$e.value<0?E:qe;return{top:e<t?t:e}}),Qe=(0,_reactNativeReanimated.useAnimatedStyle)(()=>{const e=$e.value;if(D){const t=O+e-Ke-Xe,a=e<0&&oe.value>t?t:oe.value,r=O+e-Xe-(a<E?E:a);return{height:r<0?0:r>Ke?Ke:r}}const t=e<0?E:qe,a=oe.value+e,r=O+e-(a<t?t:a);return{height:r<0?0:r>ne?ne:r}}),Ze=le>=0,et=(0,_react.useMemo)(()=>buildStyles(M),[M]),tt=(0,_react.useCallback)(()=>{l&&Ae(()=>{(0,_index2.triggerHaptic)("selection"),Pe()})},[l,Pe,Ae]),at=(0,_react.useMemo)(()=>_reactNativeGestureHandler.Gesture.Tap().withTestId(k?`${k}-backdrop-gesture`:"bottom-sheet-backdrop-gesture").maxDuration(250).onEnd((_e,e)=>{"worklet";e&&(0,_reactNativeReanimated.runOnJS)(tt)()}),[tt,k]),rt=(0,_react.useMemo)(()=>({snapIndex:le,snapPoints:ae,expand:Te,collapse:He,close:Pe,requestClose:De}),[le,ae,Te,He,Pe,De]);if("inline"===b&&!pe)return null;if("modal"===b&&!me)return null;const nt=(0,_jsxRuntime.jsxs)(_reactNative.View,{collapsable:!1,style:["modal"===b?et.backdropModal:et.backdropInline,{backgroundColor:M.colors.background.overlay}],onLayout:P,testID:k,accessibilityViewIsModal:j??Ze,children:[(0,_jsxRuntime.jsx)(_reactNativeGestureHandler.GestureDetector,{gesture:at,children:(0,_jsxRuntime.jsx)(_reactNativeReanimated.default.View,{style:_reactNative.StyleSheet.absoluteFill,accessibilityRole:"button",accessibilityLabel:"Close bottom sheet"})}),(0,_jsxRuntime.jsx)(_reactNativeReanimated.default.View,{accessibilityRole:"alert",accessibilityLabel:C,accessibilityViewIsModal:j??Ze,style:[et.sheet,{height:ne,backgroundColor:M.colors.background.elevated,borderTopLeftRadius:M.radius["2xl"],borderTopRightRadius:M.radius["2xl"],..._corners.smoothCorners,...M.shadows.xl},D?{height:Ke,left:(H-G)/2,right:void 0,width:G,borderBottomLeftRadius:M.radius["2xl"],borderBottomRightRadius:M.radius["2xl"]}:null,x,Ue],children:(0,_jsxRuntime.jsxs)(SheetBody,{style:[et.body,Qe],keyboardOffset:$e,children:[D?(0,_jsxRuntime.jsx)(_reactNative.View,{style:{height:M.spacing.md}}):(0,_jsxRuntime.jsx)(_reactNativeGestureHandler.GestureDetector,{gesture:Je,children:(0,_jsxRuntime.jsx)(_reactNative.View,{style:et.handleRow,onLayout:F?J:void 0,accessible:!0,accessibilityLabel:"Drag handle",accessibilityHint:"Drag up or down to resize the sheet, or swipe down to close it",testID:k?`${k}-handle`:"bottom-sheet-handle",children:(0,_jsxRuntime.jsx)(_reactNative.View,{style:[et.handle,{backgroundColor:M.components.bottomSheet?.handleColor??M.colors.border.primary},S]})})}),null!=R&&(0,_jsxRuntime.jsx)(_reactNative.View,{style:[et.header,y],onLayout:F?Y:void 0,children:R}),u?(0,_jsxRuntime.jsx)(_reactNativeGestureHandler.GestureDetector,{gesture:We,children:(0,_jsxRuntime.jsx)(_reactNative.ScrollView,{ref:d,style:et.scrollContent,onScroll:_,onContentSizeChange:te,onLayout:m,scrollEventThrottle:v,keyboardShouldPersistTaps:"always",keyboardDismissMode:"none",children:w})}):(0,_jsxRuntime.jsx)(_reactNative.View,{style:et.content,children:F?(0,_jsxRuntime.jsx)(_reactNative.View,{onLayout:K,children:w}):w}),null!=g&&(0,_jsxRuntime.jsx)(_reactNative.View,{style:[et.footer,N],onLayout:F?Q:void 0,children:g})]})})]}),ot=(0,_jsxRuntime.jsx)(BottomSheetContext.Provider,{value:rt,children:nt});return"modal"===b?(0,_jsxRuntime.jsx)(_reactNative.Modal,{transparent:!0,visible:de,onRequestClose:Ge,onDismiss:"ios"===_reactNative.Platform.OS?Ie:void 0,statusBarTranslucent:!0,navigationBarTranslucent:!0,animationType:"none",supportedOrientations:["portrait","landscape"],children:(0,_jsxRuntime.jsxs)(_ModalSafeArea.ModalSafeArea,{onInsets:q,children:["android"===_reactNative.Platform.OS?(0,_jsxRuntime.jsx)(_reactNativeGestureHandler.GestureHandlerRootView,{style:et.modalRoot,children:ot}):ot,(0,_jsxRuntime.jsx)(_ToastProvider.ToastHost,{})]})}):ot}),SheetBody=({style:e,keyboardOffset:t,children:a})=>{const r=(0,_reactNativeSafeAreaContext.useSafeAreaInsets)().bottom,n=(0,_reactNativeReanimated.useAnimatedStyle)(()=>{const e=r+t.value;return{paddingBottom:e>0?e:0}});return(0,_jsxRuntime.jsx)(_reactNativeReanimated.default.View,{style:[e,n],children:a})};BottomSheet.displayName="BottomSheet";const useMeasuredHeight=()=>{const[e,t]=(0,_react.useState)(0),a=(0,_react.useCallback)(e=>{t(t=>t===e?t:e)},[]);return[e,(0,_react.useCallback)(e=>a(e.nativeEvent.layout.height),[a]),a]},resolveSnapPoints=(e,t,a)=>[...e.map(e=>{if("number"==typeof e)return e;if("content"===e)return a;const r=parseFloat(e);return Number.isNaN(r)?0:r/100*t})].sort((e,t)=>e-t),clamp=(e,t,a)=>Math.min(Math.max(e,t),a),buildStyles=e=>_reactNative.StyleSheet.create({backdropModal:{flex:1},backdropInline:{..._reactNative.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,..._corners.smoothCorners},content:{flex:1,overflow:"hidden"},scrollContent:{flex:1},modalRoot:{flex:1}});var _default=exports.default=BottomSheet;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=exports.Card=void 0;var _react=_interopRequireWildcard(require("react")),_reactNative=require("react-native"),_useControllableState=require("../../hooks/useControllableState.js"),_usePressAnimation=require("../../hooks/usePressAnimation.js"),_index=require("../../theme/index.js"),_corners=require("../../utils/corners.js"),_hapticUtils=require("../../utils/hapticUtils.js"),_mergeRefs=require("../../utils/mergeRefs.js"),_shadows=require("../../utils/shadows.js"),_squircle=require("../../utils/squircle.js"),_AppIcon=require("../AppIcon/AppIcon.js"),_useContextMenu=require("../Menu/useContextMenu.js"),_index2=require("../Skeleton/index.js"),_SquircleFill=require("../SquircleFill/SquircleFill.js"),_index3=require("../Text/index.js"),_jsxRuntime=require("react/jsx-runtime");function _interopRequireWildcard(e,t){if("function"==typeof WeakMap)var i=new WeakMap,r=new WeakMap;return(_interopRequireWildcard=function(e,t){if(!t&&e&&e.__esModule)return e;var s,o,a={__proto__:null,default:e};if(null===e||"object"!=typeof e&&"function"!=typeof e)return a;if(s=t?r:i){if(s.has(e))return s.get(e);s.set(e,a)}for(const t in e)"default"!==t&&{}.hasOwnProperty.call(e,t)&&((o=(s=Object.defineProperty)&&Object.getOwnPropertyDescriptor(e,t))&&(o.get||o.set)?s(a,t,o):a[t]=e[t]);return a})(e,t)}const paddingMap={none:"none",sm:"sm",md:"lg",lg:"xl",xl:"2xl"},Card=exports.Card=(0,_react.forwardRef)((e,t)=>{const{children:i,variant:r="elevated",elevation:s="sm",radius:o="lg",padding:a="md",interactive:n=!1,bg:l,header:c,title:d,lead:u,action:h,headerActions:x,collapsible:m=!1,collapsed:_,defaultCollapsed:p=!1,onCollapsedChange:g,collapsedSummary:b,onRemove:y,removeLabel:j="Remove",separatorHeight:v=_reactNative.StyleSheet.hairlineWidth,footer:R,imageSource:f,imageHeight:S=160,imageAspectRatio:w,imageOverlay:C,loading:k=!1,gradient:A,onPress:q,haptic:N,contextMenu:T,accessibilityLabel:P,accessibilityHint:I,accessibilityRole:B,style:H,containerStyle:M,headerStyle:L,bodyStyle:V,footerStyle:F,borderRadius:W,testID:z,onLayout:O,...U}=e,D=(0,_index.useTheme)(),E=n||"function"==typeof q,G=(0,_useContextMenu.useContextMenu)(T,{haptic:N,testID:z,accessibilityActions:U.accessibilityActions,onAccessibilityAction:U.onAccessibilityAction}),$=(0,_react.useMemo)(()=>(0,_mergeRefs.mergeRefs)(t,G.hostRef),[t,G.hostRef]),J=E||G.enabled,{scale:K,pressIn:Q,pressOut:X}=(0,_usePressAnimation.usePressAnimation)({enabled:J}),Y=(0,_react.useMemo)(()=>buildStyles(D),[D]),Z=Boolean(f),ee=D.spacing[paddingMap[a]],te=(0,_react.useMemo)(()=>A?"string"==typeof A?D.gradients[A]??null:A:null,[A,D.gradients]),ie="flat"===r,re=ie?0:W??D.radius[o],se=resolveBackground(D,l),[oe,ae]=(0,_useControllableState.useControllableState)({value:_,defaultValue:p,onChange:g}),ne=m&&oe,le=hasBuiltInHeaderContent(e),ce=Boolean(c)||le,de=(0,_SquircleFill.useSquircle)(!Z&&!te&&!ie,re,O),ue=_reactNative.StyleSheet.flatten([H,M])??{},he=ue.backgroundColor,xe=ue.borderColor,me=he??se??("filled"===r?D.colors.background.secondary:D.colors.background.elevated),_e="outlined"===r?D.colors.border.width:0,pe=xe??D.colors.border.primary,ge="elevated"===r&&(0,_shadows.supportsBoxShadow)()?(0,_shadows.toBoxShadow)(D.shadows[s]):void 0,be=de.active&&"elevated"===r&&!ge,ye=de.active&&!be?{backgroundColor:"transparent",borderColor:"transparent"}:null,je=(0,_react.useMemo)(()=>{const e={borderRadius:be&&de.size?(0,_squircle.squircleHostRadius)(de.size.width,de.size.height,re):re,..._corners.smoothCorners,padding:Z?0:ee,overflow:de.active?"visible":"hidden"};switch(r){case"flat":return{...e,backgroundColor:se??D.colors.background.elevated,borderBottomWidth:v,borderBottomColor:D.colors.border.primary};case"outlined":return{...e,backgroundColor:de.active?"transparent":se??D.colors.background.elevated,borderWidth:D.colors.border.width,borderColor:de.active?"transparent":D.colors.border.primary};case"filled":return{...e,backgroundColor:de.active?"transparent":se??D.colors.background.secondary};default:return{...e,backgroundColor:se??D.colors.background.elevated,...ge?{boxShadow:ge}:D.shadows[s]}}},[D,r,s,re,Z,ee,de.active,de.size,ge,be,se,v]),ve=(0,_react.useMemo)(()=>({..."number"==typeof w?{width:"100%",aspectRatio:w}:{width:"100%",height:S},borderTopLeftRadius:re,borderTopRightRadius:re,borderBottomLeftRadius:0,borderBottomRightRadius:0,..._corners.smoothCorners}),[re,w,S]),Re="string"==typeof d?d:"",fe=(0,_jsxRuntime.jsxs)(_jsxRuntime.Fragment,{children:[(0,_jsxRuntime.jsxs)(_reactNative.View,{style:Y.titleColumn,children:["string"==typeof d?(0,_jsxRuntime.jsx)(_index3.Text,{variant:"title",accessibilityRole:"header",children:d}):d,u?(0,_jsxRuntime.jsx)(_index3.Text,{variant:"bodySmall",style:Y.lead,children:u}):null,ne&&b?(0,_jsxRuntime.jsx)(_index3.Text,{variant:"caption",style:Y.lead,children:b}):null]}),isCardTextAction(h)?(0,_jsxRuntime.jsx)(CardTextActionButton,{action:h,haptic:N}):h?(0,_jsxRuntime.jsx)(_reactNative.View,{style:Y.actionNode,children:h}):null,x,m?(0,_jsxRuntime.jsx)(CardIconAction,{icon:ne?"chevron-down":"chevron-up",label:`${ne?"Show":"Hide"} ${Re}`.trim(),expanded:!ne,onPress:()=>ae(!ne),haptic:N}):null,y?(0,_jsxRuntime.jsx)(CardIconAction,{icon:"trash",label:j,onPress:y,color:D.colors.toneText.error,haptic:N}):null]}),Se=(0,_jsxRuntime.jsxs)(_jsxRuntime.Fragment,{children:[ce?(0,_jsxRuntime.jsx)(_reactNative.View,{style:[Y.header,!c&&Y.headerRow,ne&&Y.headerFolded,L],children:c??fe}):null,ne?null:(0,_jsxRuntime.jsx)(_reactNative.View,{style:[ce||R?Y.body:null,V],children:i}),R&&!ne?(0,_jsxRuntime.jsx)(_reactNative.View,{style:[Y.footer,F],children:R}):null]}),we=Z?(0,_jsxRuntime.jsxs)(_jsxRuntime.Fragment,{children:[(0,_jsxRuntime.jsxs)(_reactNative.View,{style:Y.imageWrapper,children:[(0,_jsxRuntime.jsx)(_reactNative.Image,{source:f,resizeMode:"cover",style:ve,accessibilityLabel:"",accessible:!1}),C?(0,_jsxRuntime.jsx)(_reactNative.View,{pointerEvents:"box-none",style:Y.imageOverlay,children:C}):null]}),(0,_jsxRuntime.jsx)(_reactNative.View,{style:{padding:ee},children:Se})]}):Se,Ce=te?(0,_jsxRuntime.jsxs)(_jsxRuntime.Fragment,{children:[(0,_jsxRuntime.jsx)(_index.Gradient,{gradient:te,style:_reactNative.StyleSheet.absoluteFill}),we]}):de.active&&de.size?(0,_jsxRuntime.jsxs)(_jsxRuntime.Fragment,{children:[(0,_jsxRuntime.jsx)(_SquircleFill.SquircleFill,{width:de.size.width,height:de.size.height,radius:re,fill:me,stroke:_e?pe:void 0,strokeWidth:_e,outset:_e}),we]}):we;let ke;if(J){const handlePress=e=>{if(!E)return;const t=(0,_hapticUtils.resolveHaptic)(N,"selection");t&&(0,_hapticUtils.triggerHaptic)(t),q?.(e)};ke=(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{style:[{transform:[{scale:K}]}],children:(0,_jsxRuntime.jsx)(_reactNative.Pressable,{ref:$,onPress:handlePress,onPressIn:Q,onPressOut:X,android_ripple:{color:D.colors.surface.pressed,borderless:!1},accessibilityRole:B??(E?"button":void 0),accessibilityLabel:P,accessibilityHint:I,testID:z,onLayout:de.onLayout,style:[je,H,M,ye],...U,...G.hostProps,children:Ce})})}else ke=(0,_jsxRuntime.jsx)(_reactNative.View,{ref:t,accessibilityLabel:P,accessibilityHint:I,accessibilityRole:B,testID:z,onLayout:de.onLayout,style:[je,H,M,ye],...U,children:Ce});return k?(0,_jsxRuntime.jsx)(CardSkeleton,{...e}):G.enabled?(0,_jsxRuntime.jsxs)(_jsxRuntime.Fragment,{children:[ke,G.renderSurface((0,_jsxRuntime.jsx)(_reactNative.View,{style:[je,H,M,ye,Y.preview],children:Ce}))]}):ke});Card.displayName="Card";const CardSkeleton=({variant:e="elevated",elevation:t,radius:i="lg",padding:r="md",bg:s,header:o,footer:a,imageSource:n,imageHeight:l=160,imageAspectRatio:c,borderRadius:d,containerStyle:u,headerStyle:h,bodyStyle:x,footerStyle:m,style:_,...p})=>{const g=(0,_index.useTheme)(),b=paddingMap[r],y=g.spacing[b],j="flat"===e?0:d??g.radius[i],v=void 0!==o||hasBuiltInHeaderContent(p),R=resolveBackground(g,s)??g.colors.background.elevated,f="outlined"===e?1:0,S="outlined"===e?g.colors.border.primary:void 0;return(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[{backgroundColor:R,borderRadius:j,..._corners.smoothCorners,borderWidth:f,borderColor:S,overflow:"hidden"},u,_],accessibilityRole:"progressbar",accessibilityLabel:"Loading",accessibilityState:{busy:!0},"aria-busy":!0,children:[void 0!==n?(0,_jsxRuntime.jsx)(_index2.Skeleton,{width:"100%",height:c?void 0:l,style:c?{aspectRatio:c,width:"100%"}:void 0}):null,v?(0,_jsxRuntime.jsx)(_reactNative.View,{style:[{padding:y,paddingBottom:g.spacing.sm},h],children:(0,_jsxRuntime.jsx)(_index2.Skeleton,{shape:"text",width:"60%",height:18})}):null,(0,_jsxRuntime.jsx)(_reactNative.View,{style:[{padding:y},x],children:(0,_jsxRuntime.jsx)(_index2.SkeletonText,{lines:3,fontSize:14,lastLineWidth:"55%"})}),void 0!==a?(0,_jsxRuntime.jsx)(_reactNative.View,{style:[{padding:y,paddingTop:g.spacing.sm,flexDirection:"row"},m],children:(0,_jsxRuntime.jsx)(_index2.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.default.isValidElement(e)&&"label"in e&&"onPress"in e,HIT_TARGET=44,CardIconAction=({icon:e,label:t,onPress:i,expanded:r,color:s,haptic:o})=>{const a=(0,_index.useTheme)();return(0,_jsxRuntime.jsx)(_reactNative.Pressable,{accessibilityRole:"button",accessibilityLabel:t,accessibilityState:void 0===r?void 0:{expanded:r},"aria-expanded":r,onPress:()=>{const e=(0,_hapticUtils.resolveHaptic)(o,"selection");e&&(0,_hapticUtils.triggerHaptic)(e),i()},style:iconActionStyle,children:(0,_jsxRuntime.jsx)(_AppIcon.AppIcon,{name:e,size:20,color:s??a.colors.text.primary})})},CardTextActionButton=({action:e,haptic:t})=>{const i=(0,_index.useTheme)();return(0,_jsxRuntime.jsx)(_reactNative.Pressable,{accessibilityRole:"button",accessibilityLabel:e.accessibilityLabel??e.label,onPress:()=>{const i=(0,_hapticUtils.resolveHaptic)(t,"selection");i&&(0,_hapticUtils.triggerHaptic)(i),e.onPress()},style:textActionStyle,children:(0,_jsxRuntime.jsx)(_index3.Text,{variant:"label",weight:"semibold",color:i.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=>_reactNative.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:{..._reactNative.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%"}});var _default=exports.default=Card;
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=exports.Card=void 0;var _react=_interopRequireWildcard(require("react")),_reactNative=require("react-native"),_useControllableState=require("../../hooks/useControllableState.js"),_usePressAnimation=require("../../hooks/usePressAnimation.js"),_index=require("../../theme/index.js"),_corners=require("../../utils/corners.js"),_hapticUtils=require("../../utils/hapticUtils.js"),_mergeRefs=require("../../utils/mergeRefs.js"),_shadows=require("../../utils/shadows.js"),_squircle=require("../../utils/squircle.js"),_AppIcon=require("../AppIcon/AppIcon.js"),_useContextMenu=require("../Menu/useContextMenu.js"),_index2=require("../Skeleton/index.js"),_SquircleFill=require("../SquircleFill/SquircleFill.js"),_index3=require("../Text/index.js"),_jsxRuntime=require("react/jsx-runtime");function _interopRequireWildcard(e,t){if("function"==typeof WeakMap)var i=new WeakMap,r=new WeakMap;return(_interopRequireWildcard=function(e,t){if(!t&&e&&e.__esModule)return e;var s,o,a={__proto__:null,default:e};if(null===e||"object"!=typeof e&&"function"!=typeof e)return a;if(s=t?r:i){if(s.has(e))return s.get(e);s.set(e,a)}for(const t in e)"default"!==t&&{}.hasOwnProperty.call(e,t)&&((o=(s=Object.defineProperty)&&Object.getOwnPropertyDescriptor(e,t))&&(o.get||o.set)?s(a,t,o):a[t]=e[t]);return a})(e,t)}const paddingMap={none:"none",sm:"sm",md:"lg",lg:"xl",xl:"2xl"},Card=exports.Card=(0,_react.forwardRef)((e,t)=>{const{children:i,variant:r="elevated",elevation:s="sm",radius:o="lg",padding:a="md",interactive:n=!1,bg:l,header:c,title:d,lead:u,action:h,headerActions:x,collapsible:m=!1,collapsed:_,defaultCollapsed:p=!1,onCollapsedChange:g,collapsedSummary:b,onRemove:y,removeLabel:j="Remove",separatorHeight:v=_reactNative.StyleSheet.hairlineWidth,footer:R,imageSource:f,imageHeight:S=160,imageAspectRatio:w,imageOverlay:C,loading:k=!1,gradient:A,onPress:q,haptic:N,contextMenu:T,accessibilityLabel:P,accessibilityHint:I,accessibilityRole:B,style:H,containerStyle:M,headerStyle:L,bodyStyle:V,footerStyle:F,borderRadius:W,testID:z,onLayout:O,...U}=e,D=(0,_index.useTheme)(),E=n||"function"==typeof q,G=(0,_useContextMenu.useContextMenu)(T,{haptic:N,testID:z,accessibilityActions:U.accessibilityActions,onAccessibilityAction:U.onAccessibilityAction}),$=(0,_react.useMemo)(()=>(0,_mergeRefs.mergeRefs)(t,G.hostRef),[t,G.hostRef]),J=E||G.enabled,{scale:K,pressIn:Q,pressOut:X}=(0,_usePressAnimation.usePressAnimation)({enabled:J}),Y=(0,_react.useMemo)(()=>buildStyles(D),[D]),Z=Boolean(f),ee=D.spacing[paddingMap[a]],te=(0,_react.useMemo)(()=>A?"string"==typeof A?D.gradients[A]??null:A:null,[A,D.gradients]),ie="flat"===r,re=ie?0:W??D.radius[o],se=resolveBackground(D,l),[oe,ae]=(0,_useControllableState.useControllableState)({value:_,defaultValue:p,onChange:g}),ne=m&&oe,le=hasBuiltInHeaderContent(e),ce=Boolean(c)||le,de=(0,_SquircleFill.useSquircle)(!Z&&!te&&!ie,re,O),ue=_reactNative.StyleSheet.flatten([H,M])??{},he=ue.backgroundColor,xe=ue.borderColor,me=he??se??("filled"===r?D.colors.background.secondary:D.colors.background.elevated),pe="outlined"===r?D.colors.border.width:0,ge=xe??D.colors.border.primary,be="elevated"===r&&(0,_shadows.supportsBoxShadow)()?(0,_shadows.toBoxShadow)(D.shadows[s]):void 0,ye=de.active&&"elevated"===r&&!be,je=de.active&&!ye?{backgroundColor:"transparent",borderColor:"transparent"}:null,ve=(0,_react.useMemo)(()=>{const e={borderRadius:ye&&de.size?(0,_squircle.squircleHostRadius)(de.size.width,de.size.height,re):re,..._corners.smoothCorners,padding:Z?0:ee,overflow:de.active?"visible":"hidden"};switch(r){case"flat":return{...e,backgroundColor:se??D.colors.background.elevated,borderBottomWidth:v,borderBottomColor:D.colors.border.primary};case"outlined":return{...e,backgroundColor:de.active?"transparent":se??D.colors.background.elevated,borderWidth:D.colors.border.width,borderColor:de.active?"transparent":D.colors.border.primary};case"filled":return{...e,backgroundColor:de.active?"transparent":se??D.colors.background.secondary};default:return{...e,backgroundColor:se??D.colors.background.elevated,...be?{boxShadow:be}:D.shadows[s]}}},[D,r,s,re,Z,ee,de.active,de.size,be,ye,se,v]),Re=(0,_react.useMemo)(()=>({..."number"==typeof w?{width:"100%",aspectRatio:w}:{width:"100%",height:S},borderTopLeftRadius:re,borderTopRightRadius:re,borderBottomLeftRadius:0,borderBottomRightRadius:0,..._corners.smoothCorners}),[re,w,S]),fe="string"==typeof d?d:"",Se=(0,_jsxRuntime.jsxs)(_jsxRuntime.Fragment,{children:[(0,_jsxRuntime.jsxs)(_reactNative.View,{style:Y.titleColumn,children:["string"==typeof d?(0,_jsxRuntime.jsx)(_index3.Text,{variant:"title",accessibilityRole:"header",children:d}):d,u?(0,_jsxRuntime.jsx)(_index3.Text,{variant:"bodySmall",style:Y.lead,children:u}):null,ne&&b?(0,_jsxRuntime.jsx)(_index3.Text,{variant:"caption",style:Y.lead,children:b}):null]}),isCardTextAction(h)?(0,_jsxRuntime.jsx)(CardTextActionButton,{action:h,haptic:N}):h?(0,_jsxRuntime.jsx)(_reactNative.View,{style:Y.actionNode,children:h}):null,x,m?(0,_jsxRuntime.jsx)(CardIconAction,{icon:ne?"chevron-down":"chevron-up",label:`${ne?"Show":"Hide"} ${fe}`.trim(),expanded:!ne,onPress:()=>ae(!ne),haptic:N}):null,y?(0,_jsxRuntime.jsx)(CardIconAction,{icon:"trash",label:j,onPress:y,color:D.colors.toneText.error,haptic:N}):null]}),we=(0,_jsxRuntime.jsxs)(_jsxRuntime.Fragment,{children:[ce?(0,_jsxRuntime.jsx)(_reactNative.View,{style:[Y.header,!c&&Y.headerRow,ne&&Y.headerFolded,L],children:c??Se}):null,ne?null:(0,_jsxRuntime.jsx)(_reactNative.View,{style:[ce||R?Y.body:null,V],children:i}),R&&!ne?(0,_jsxRuntime.jsx)(_reactNative.View,{style:[Y.footer,F],children:R}):null]}),Ce=Z?(0,_jsxRuntime.jsxs)(_jsxRuntime.Fragment,{children:[(0,_jsxRuntime.jsxs)(_reactNative.View,{style:Y.imageWrapper,children:[(0,_jsxRuntime.jsx)(_reactNative.Image,{source:f,resizeMode:"cover",style:Re,accessibilityLabel:"",accessible:!1}),C?(0,_jsxRuntime.jsx)(_reactNative.View,{pointerEvents:"box-none",style:Y.imageOverlay,children:C}):null]}),(0,_jsxRuntime.jsx)(_reactNative.View,{style:{padding:ee},children:we})]}):we,ke=te?(0,_jsxRuntime.jsxs)(_jsxRuntime.Fragment,{children:[(0,_jsxRuntime.jsx)(_index.Gradient,{gradient:te,style:_reactNative.StyleSheet.absoluteFill}),Ce]}):de.active&&de.size?(0,_jsxRuntime.jsxs)(_jsxRuntime.Fragment,{children:[(0,_jsxRuntime.jsx)(_SquircleFill.SquircleFill,{width:de.size.width,height:de.size.height,radius:re,fill:me,stroke:pe?ge:void 0,strokeWidth:pe,outset:pe}),Ce]}):Ce;let Ae;if(J){const handlePress=e=>{if(!E)return;const t=(0,_hapticUtils.resolveHaptic)(N,"selection");t&&(0,_hapticUtils.triggerHaptic)(t),q?.(e)};Ae=(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{style:[{transform:[{scale:K}]}],children:(0,_jsxRuntime.jsx)(_reactNative.Pressable,{ref:$,onPress:handlePress,onPressIn:Q,onPressOut:X,android_ripple:{color:D.colors.surface.pressed,borderless:!1},accessibilityRole:B??(E?"button":void 0),accessibilityLabel:P,accessibilityHint:I,testID:z,onLayout:de.onLayout,style:[ve,H,M,je],...U,...G.hostProps,children:ke})})}else Ae=(0,_jsxRuntime.jsx)(_reactNative.View,{ref:t,accessibilityLabel:P,accessibilityHint:I,accessibilityRole:B,testID:z,onLayout:de.onLayout,style:[ve,H,M,je],...U,children:ke});return k?(0,_jsxRuntime.jsx)(CardSkeleton,{...e}):G.enabled?(0,_jsxRuntime.jsxs)(_jsxRuntime.Fragment,{children:[Ae,G.renderSurface((0,_jsxRuntime.jsx)(_reactNative.View,{style:[ve,H,M,je,Y.preview],children:ke}))]}):Ae});Card.displayName="Card";const CardSkeleton=({variant:e="elevated",elevation:t,radius:i="lg",padding:r="md",bg:s,header:o,footer:a,imageSource:n,imageHeight:l=160,imageAspectRatio:c,borderRadius:d,containerStyle:u,headerStyle:h,bodyStyle:x,footerStyle:m,style:_,...p})=>{const g=(0,_index.useTheme)(),b=paddingMap[r],y=g.spacing[b],j="flat"===e?0:d??g.radius[i],v=void 0!==o||hasBuiltInHeaderContent(p),R=resolveBackground(g,s)??g.colors.background.elevated,f="outlined"===e?1:0,S="outlined"===e?g.colors.border.primary:void 0;return(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[{backgroundColor:R,borderRadius:j,..._corners.smoothCorners,borderWidth:f,borderColor:S,overflow:"hidden"},u,_],accessibilityRole:"progressbar",accessibilityLabel:"Loading",accessibilityState:{busy:!0},"aria-busy":!0,children:[void 0!==n?(0,_jsxRuntime.jsx)(_index2.Skeleton,{width:"100%",height:c?void 0:l,style:c?{aspectRatio:c,width:"100%"}:void 0}):null,v?(0,_jsxRuntime.jsx)(_reactNative.View,{style:[{padding:y,paddingBottom:g.spacing.sm},h],children:(0,_jsxRuntime.jsx)(_index2.Skeleton,{shape:"text",width:"60%",height:18})}):null,(0,_jsxRuntime.jsx)(_reactNative.View,{style:[{padding:y},x],children:(0,_jsxRuntime.jsx)(_index2.SkeletonText,{lines:3,fontSize:14,lastLineWidth:"55%"})}),void 0!==a?(0,_jsxRuntime.jsx)(_reactNative.View,{style:[{padding:y,paddingTop:g.spacing.sm,flexDirection:"row"},m],children:(0,_jsxRuntime.jsx)(_index2.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.default.isValidElement(e)&&"label"in e&&"onPress"in e,HIT_TARGET=44,CardIconAction=({icon:e,label:t,onPress:i,expanded:r,color:s,haptic:o})=>{const a=(0,_index.useTheme)();return(0,_jsxRuntime.jsx)(_reactNative.Pressable,{accessibilityRole:"button",accessibilityLabel:t,accessibilityState:void 0===r?void 0:{expanded:r},"aria-expanded":r,onPress:()=>{const e=(0,_hapticUtils.resolveHaptic)(o,"selection");e&&(0,_hapticUtils.triggerHaptic)(e),i()},style:iconActionStyle,children:(0,_jsxRuntime.jsx)(_AppIcon.AppIcon,{name:e,size:20,color:s??a.colors.text.primary})})},CardTextActionButton=({action:e,haptic:t})=>{const i=(0,_index.useTheme)();return(0,_jsxRuntime.jsx)(_reactNative.Pressable,{accessibilityRole:"button",accessibilityLabel:e.accessibilityLabel??e.label,onPress:()=>{const i=(0,_hapticUtils.resolveHaptic)(t,"selection");i&&(0,_hapticUtils.triggerHaptic)(i),e.onPress()},style:textActionStyle,children:(0,_jsxRuntime.jsx)(_index3.Text,{variant:"label",weight:"semibold",color:i.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=>_reactNative.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:{..._reactNative.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%"}});var _default=exports.default=Card;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=exports.DatePicker=void 0;var _react=require("react"),_reactNative=require("react-native"),_reactNativeGestureHandler=require("react-native-gesture-handler"),_reactNativeSafeAreaContext=require("react-native-safe-area-context"),_useDragToDismiss=require("../../hooks/useDragToDismiss.js"),_index=require("../../theme/index.js"),_index2=require("../../utils/index.js"),_corners=require("../../utils/corners.js"),_defaultIcons=require("../AppIcon/defaultIcons.js"),_index3=require("../PickerTrigger/index.js"),_ToastProvider=require("../Toast/ToastProvider.js"),_jsxRuntime=require("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,n=[];for(let e=0;e<42;e+=1){const t=new Date(a,r,1-i+e);n.push({date:t,inMonth:t.getMonth()===r,iso:toIso(t)})}return n},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:n,disabledDates:s,mode:o="modal",locale:l="en-IN",weekStartsOn:c=0,title:d="Select Date",confirmLabel:u="Confirm",cancelLabel:m="Cancel",style:g,containerStyle:y,headerLabelStyle:_,navButtonStyle:x,footerButtonStyle:p,haptic:h,testID:v,label:b,placeholder:f,helperText:j,error:N,required:R,disabled:D,size:w,variant:C,clearable:S,onClear:k,formatValue:P,triggerStyle:T}=e,V=void 0!==e.visible,[A,I]=(0,_react.useState)(!1),M=V?e.visible:A,F=V?v:v?`${v}-calendar`:void 0,L=(0,_index.useTheme)(),B=(0,_reactNativeSafeAreaContext.useSafeAreaInsets)(),Y=(0,_react.useMemo)(()=>buildStyles(L),[L]),[z,H]=(0,_react.useState)(()=>startOfDay(new Date));(0,_react.useEffect)(()=>{M&&H(startOfDay(new Date))},[M]);const $=t?startOfDay(t):z,[W,E]=(0,_react.useState)($),[q,O]=(0,_react.useState)(t?startOfDay(t):null),[G,X]=(0,_react.useState)("days"),Z=(0,_react.useRef)((0,_index.createAnimatedValue)(0)).current,J=(0,_react.useRef)((0,_index.createAnimatedValue)(0)).current,K=(0,_react.useRef)((0,_index.createAnimatedValue)(0)).current,Q=(0,_react.useRef)(0),U=(0,_react.useRef)((0,_index.createAnimatedValue)(0)).current,ee=(0,_react.useRef)((0,_index.createAnimatedValue)(1)).current,te=(0,_react.useRef)((0,_index.createAnimatedValue)(1)).current,ae=(0,_react.useRef)((0,_index.createAnimatedValue)(1)).current,re=(0,_react.useRef)((0,_index.createAnimatedValue)(1)).current,ie=(0,_react.useRef)((0,_index.createAnimatedValue)(1)).current;(0,_react.useEffect)(()=>{if(t){const e=startOfDay(t);O(e),E(e)}else O(null)},[t]),(0,_react.useEffect)(()=>{if("modal"===o&&M){Z.setValue(0),(0,_index.setNativeValue)(J,0),(0,_index.setNativeValue)(K,0);const e=_reactNative.Animated.parallel([_reactNative.Animated.timing(Z,{toValue:1,duration:L.motion.duration.normal,easing:_reactNative.Easing.out(_reactNative.Easing.cubic),useNativeDriver:!1}),_reactNative.Animated.spring(J,{toValue:1,damping:L.motion.spring.gentle.damping,stiffness:L.motion.spring.gentle.stiffness,mass:L.motion.spring.gentle.mass,useNativeDriver:!0})]);return e.start(),()=>e.stop()}},[M,o,Z,J,K,L.motion]);const ne=(0,_react.useMemo)(()=>{const e=new Set;return s?.forEach(t=>e.add(toIso(startOfDay(t)))),e},[s]),se=(0,_react.useMemo)(()=>i?startOfDay(i):null,[i]),oe=(0,_react.useMemo)(()=>n?startOfDay(n):null,[n]),le=(0,_react.useCallback)(e=>!!(se&&e.getTime()<se.getTime())||(!!(oe&&e.getTime()>oe.getTime())||!!ne.has(toIso(e))),[se,oe,ne]),ce=(0,_react.useMemo)(()=>buildMonthMatrix(W,c),[W,c]),de=(0,_react.useMemo)(()=>buildYearCells(W.getFullYear()),[W]),ue=(0,_react.useMemo)(()=>buildDecadeCells(W.getFullYear()),[W]),me=(0,_react.useMemo)(()=>weekdayLabels(l,c),[l,c]),ge=(0,_react.useMemo)(()=>{if("days"===G)return formatMonthYear(W,l);if("years"===G){return`${de[0]} - ${de[de.length-1]}`}return`${ue[0]} - ${ue[ue.length-1]+9}`},[W,ue,l,G,de]),ye=(0,_react.useCallback)(e=>!!(se&&e<se.getFullYear())||!!(oe&&e>oe.getFullYear()),[se,oe]),_e=(0,_react.useCallback)(e=>!!(se&&e+10-1<se.getFullYear())||!!(oe&&e>oe.getFullYear()),[se,oe]),xe=(0,_react.useCallback)(e=>{!1!==h&&(0,_index2.triggerHaptic)("impactLight");const t=e>0?1:-1,a=L.components.datePicker?.monthSlideDistance??32,r=L.components.datePicker?.monthSlideOutDuration??L.motion.duration.fast??140,i=L.components.datePicker?.monthSlideInDuration??L.motion.duration.fast??160;_reactNative.Animated.sequence([_reactNative.Animated.parallel([_reactNative.Animated.timing(U,{toValue:-t*a,duration:r,easing:_reactNative.Easing.out(_reactNative.Easing.quad),useNativeDriver:!0}),_reactNative.Animated.timing(ee,{toValue:0,duration:r,useNativeDriver:!0})]),_reactNative.Animated.timing(U,{toValue:t*a,duration:0,useNativeDriver:!0}),_reactNative.Animated.parallel([_reactNative.Animated.timing(U,{toValue:0,duration:i,easing:_reactNative.Easing.out(_reactNative.Easing.cubic),useNativeDriver:!0}),_reactNative.Animated.timing(ee,{toValue:1,duration:i,useNativeDriver:!0})])]).start();const n=addMonths(W,e);E(n),_reactNative.AccessibilityInfo.announceForAccessibility(formatMonthYear(n,l))},[W,h,l,ee,U,L.components.datePicker,L.motion.duration.fast]),pe=(0,_react.useCallback)(()=>{"days"!==G?(!1!==h&&(0,_index2.triggerHaptic)("impactLight"),E("years"===G?e=>new Date(e.getFullYear()-12,e.getMonth(),1):e=>new Date(e.getFullYear()-120,e.getMonth(),1))):xe(-1)},[xe,G,h]),he=(0,_react.useCallback)(()=>{"days"!==G?(!1!==h&&(0,_index2.triggerHaptic)("impactLight"),E("years"===G?e=>new Date(e.getFullYear()+12,e.getMonth(),1):e=>new Date(e.getFullYear()+120,e.getMonth(),1))):xe(1)},[xe,G,h]),ve=(0,_react.useCallback)(()=>{const e=L.components.datePicker?.viewTransitionDuration??L.motion.duration.normal??200;(0,_index.setNativeValue)(ae,0),(0,_index.setNativeValue)(re,.9),_reactNative.Animated.parallel([_reactNative.Animated.timing(ae,{toValue:1,duration:e,easing:_reactNative.Easing.out(_reactNative.Easing.cubic),useNativeDriver:!0}),_reactNative.Animated.timing(re,{toValue:1,duration:e,easing:_reactNative.Easing.out(_reactNative.Easing.cubic),useNativeDriver:!0})]).start()},[ae,re,L.components.datePicker,L.motion.duration.normal]),be=(0,_react.useCallback)(()=>{const e=(0,_index2.resolveHaptic)(h,"selection");e&&(0,_index2.triggerHaptic)(e);const t=L.components.datePicker?.headerPressDuration??80,a=L.components.datePicker?.headerReleaseDuration??100;_reactNative.Animated.sequence([_reactNative.Animated.timing(ie,{toValue:.96,duration:t,useNativeDriver:!0}),_reactNative.Animated.timing(ie,{toValue:1,duration:a,useNativeDriver:!0})]).start(),X(e=>"days"===e?"years":"years"===e?"decades":"years"),ve()},[ve,ie,h,L.components.datePicker]),fe=(0,_react.useCallback)(e=>{const t=(0,_index2.resolveHaptic)(h,"selection");t&&(0,_index2.triggerHaptic)(t),E(t=>new Date(e,t.getMonth(),1)),X("days"),ve()},[ve,h]),je=(0,_react.useCallback)(e=>{const t=(0,_index2.resolveHaptic)(h,"selection");t&&(0,_index2.triggerHaptic)(t),E(t=>new Date(e+4,t.getMonth(),1)),X("years"),ve()},[ve,h]),Ne=(0,_react.useCallback)(e=>{if(le(e.date))return;const t=(0,_index2.resolveHaptic)(h,"selection");t&&(0,_index2.triggerHaptic)(t),O(e.date),e.inMonth||E(new Date(e.date.getFullYear(),e.date.getMonth(),1)),(0,_index.setNativeValue)(te,.7),_reactNative.Animated.spring(te,{toValue:1,damping:L.motion.spring.bouncy.damping,stiffness:L.motion.spring.bouncy.stiffness,mass:L.motion.spring.bouncy.mass,useNativeDriver:!0}).start()},[le,te,L.motion.spring.bouncy,h]),Re=(0,_react.useCallback)(()=>{V||I(!1),r?.()},[V,r]),De=(0,_react.useCallback)(()=>{"modal"===o?_reactNative.Animated.parallel([_reactNative.Animated.timing(Z,{toValue:0,duration:L.motion.duration.fast,easing:_reactNative.Easing.bezier(...L.motion.easing.accelerate),useNativeDriver:!1}),_reactNative.Animated.timing(J,{toValue:0,duration:L.motion.duration.fast,easing:_reactNative.Easing.bezier(...L.motion.easing.accelerate),useNativeDriver:!0})]).start(()=>{Re()}):Re()},[Z,o,Re,J,L.motion.duration.fast,L.motion.easing.accelerate]),{handleGesture:we}=(0,_useDragToDismiss.useDragToDismiss)({drag:K,travel:()=>Q.current||320,onDismiss:De}),Ce=(0,_react.useCallback)(()=>{!1!==h&&(0,_index2.triggerHaptic)("selection"),De()},[De,h]),Se=(0,_react.useCallback)(()=>{q&&(!1!==h&&(0,_index2.triggerHaptic)("notificationSuccess"),a?.(q),De())},[De,a,q,h]),ke=J.interpolate({inputRange:[0,1],outputRange:[320,0]}),Pe=(0,_jsxRuntime.jsx)(_reactNative.View,{style:Y.titleRow,children:(0,_jsxRuntime.jsx)(_reactNative.Text,{style:Y.title,accessibilityRole:"header",children:d})}),Te=(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[Y.card,g,y],accessibilityRole:"modal"===o?void 0:"none",accessible:!1,testID:F,children:["modal"===o?(0,_jsxRuntime.jsx)(_reactNativeGestureHandler.GestureDetector,{gesture:we,children:(0,_jsxRuntime.jsxs)(_reactNative.View,{style:Y.grabArea,children:[(0,_jsxRuntime.jsx)(_reactNative.View,{style:Y.handle}),Pe]})}):Pe,(0,_jsxRuntime.jsxs)(_reactNative.View,{style:Y.headerRow,children:[(0,_jsxRuntime.jsx)(_reactNative.Pressable,{onPress:pe,style:({pressed:e})=>[Y.navBtn,e&&Y.navBtnPressed,x],accessibilityRole:"button",accessibilityLabel:"days"===G?"Previous month":"years"===G?"Previous years":"Previous decades",hitSlop:8,children:(0,_jsxRuntime.jsx)(_reactNative.Text,{style:Y.navText,children:"‹"})}),(0,_jsxRuntime.jsx)(_reactNative.Pressable,{onPress:be,style:[Y.headerLabelWrap,_],accessibilityRole:"button",accessibilityLabel:"days"===G?`${ge}, switch to year selection`:"years"===G?`${ge}, switch to decade selection`:`${ge}, switch to year selection`,hitSlop:8,children:(0,_jsxRuntime.jsxs)(_reactNative.Animated.View,{style:[Y.headerLabelInner,{transform:[{scale:ie}],opacity:"days"===G?ee:1}],children:[(0,_jsxRuntime.jsx)(_reactNative.Animated.Text,{style:[Y.headerLabel,{transform:[{translateX:"days"===G?U:0}]}],accessibilityLiveRegion:"polite",children:ge}),(0,_jsxRuntime.jsx)(_reactNative.View,{style:Y.headerCaret,children:(L.icons?.chevronDown??_defaultIcons.defaultIcons.chevronDown)({size:L.typography.fontSize.sm,color:L.colors.text.secondary})})]})}),(0,_jsxRuntime.jsx)(_reactNative.Pressable,{onPress:he,style:({pressed:e})=>[Y.navBtn,e&&Y.navBtnPressed,x],accessibilityRole:"button",accessibilityLabel:"days"===G?"Next month":"years"===G?"Next years":"Next decades",hitSlop:8,children:(0,_jsxRuntime.jsx)(_reactNative.Text,{style:Y.navText,children:"›"})})]}),"days"===G?(0,_jsxRuntime.jsxs)(_jsxRuntime.Fragment,{children:[(0,_jsxRuntime.jsx)(_reactNative.View,{style:Y.weekdayRow,children:me.map((e,t)=>(0,_jsxRuntime.jsx)(_reactNative.View,{style:Y.weekdayCell,children:(0,_jsxRuntime.jsx)(_reactNative.Text,{style:Y.weekdayText,children:e})},`${e}-${t}`))}),(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{style:[Y.grid,{opacity:ee,transform:[{translateX:U}]}],children:Array.from({length:6}).map((e,t)=>(0,_jsxRuntime.jsx)(_reactNative.View,{style:Y.gridRow,children:ce.slice(7*t,7*t+7).map(e=>{const t=le(e.date),a=!!q&&isSameDay(e.date,q),r=isSameDay(e.date,z),i=a?L.colors.primary:"transparent",n=r&&!a?L.colors.primary:"transparent",s=a?L.colors.onPrimary:e.inMonth?t?L.colors.text.disabled:L.colors.text.primary:L.colors.text.tertiary,o=t?.3:e.inMonth?1:.4;return(0,_jsxRuntime.jsx)(_reactNative.Pressable,{disabled:t,onPress:()=>Ne(e),accessibilityRole:"button",accessibilityLabel:formatLongDate(e.date,l),accessibilityState:{selected:a,disabled:t},"aria-selected":a,"aria-disabled":t,style:Y.dayCell,children:(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{style:[Y.dayInner,{backgroundColor:i,borderColor:n,borderWidth:r&&!a?1.5:0,opacity:o},a?{transform:[{scale:te}]}:null],children:(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[Y.dayText,{color:s}],children:e.date.getDate()})})},e.iso)})},`r-${t}`))})]}):"years"===G?(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{style:[Y.yearGrid,{opacity:ae,transform:[{scale:re}]}],children:Array.from({length:3}).map((e,t)=>(0,_jsxRuntime.jsx)(_reactNative.View,{style:Y.gridRow,children:de.slice(4*t,4*t+4).map(e=>{const t=ye(e),a=!!q&&q.getFullYear()===e,r=z.getFullYear()===e,i=a?L.colors.primary:"transparent",n=r&&!a?L.colors.primary:"transparent",s=a?L.colors.onPrimary:t?L.colors.text.disabled:L.colors.text.primary,o=t?.3:1;return(0,_jsxRuntime.jsx)(_reactNative.Pressable,{disabled:t,onPress:()=>fe(e),accessibilityRole:"button",accessibilityLabel:`Year ${e}`,accessibilityState:{selected:a,disabled:t},"aria-selected":a,"aria-disabled":t,style:Y.yearCell,children:(0,_jsxRuntime.jsx)(_reactNative.View,{style:[Y.yearInner,{backgroundColor:i,borderColor:n,borderWidth:r&&!a?1.5:0,opacity:o}],children:(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[Y.yearText,{color:s}],children:e})})},`year-${e}`)})},`yr-${t}`))}):(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{style:[Y.yearGrid,{opacity:ae,transform:[{scale:re}]}],children:Array.from({length:3}).map((e,t)=>(0,_jsxRuntime.jsx)(_reactNative.View,{style:Y.gridRow,children:ue.slice(4*t,4*t+4).map(e=>{const t=e+10-1,a=_e(e),r=!!q&&decadeStartFor(q.getFullYear())===e,i=decadeStartFor(z.getFullYear())===e,n=r?L.colors.primary:"transparent",s=i&&!r?L.colors.primary:"transparent",o=r?L.colors.onPrimary:a?L.colors.text.disabled:L.colors.text.primary,l=a?.3:1;return(0,_jsxRuntime.jsx)(_reactNative.Pressable,{disabled:a,onPress:()=>je(e),accessibilityRole:"button",accessibilityLabel:`Decade ${e} to ${t}`,accessibilityState:{selected:r,disabled:a},"aria-selected":r,"aria-disabled":a,style:Y.yearCell,children:(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[Y.yearInner,{backgroundColor:n,borderColor:s,borderWidth:i&&!r?1.5:0,opacity:l}],children:[(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[Y.yearText,{color:o}],children:`${e}s`}),(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[Y.decadeRangeText,{color:r?L.colors.onPrimary:L.colors.text.tertiary}],children:`${e}-${t}`})]})},`decade-${e}`)})},`dec-${t}`))}),(0,_jsxRuntime.jsxs)(_reactNative.View,{style:Y.footer,children:[(0,_jsxRuntime.jsx)(_reactNative.Pressable,{onPress:Ce,style:({pressed:e})=>[Y.footerBtn,Y.footerCancel,e&&Y.footerBtnPressed,p],accessibilityRole:"button",accessibilityLabel:m,children:(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[Y.footerBtnText,{color:L.colors.text.secondary}],children:m})}),(0,_jsxRuntime.jsx)(_reactNative.Pressable,{onPress:Se,disabled:!q,style:({pressed:e})=>[Y.footerBtn,Y.footerConfirm,{backgroundColor:L.colors.primary,opacity:q?1:.5},e&&{backgroundColor:L.colors.primaryHover},p],accessibilityRole:"button",accessibilityLabel:u,accessibilityState:{disabled:!q},"aria-disabled":!q,children:(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[Y.footerBtnText,{color:L.colors.onPrimary}],children:u})})]})]}),Ve=t?(P??(e=>e.toLocaleDateString()))(t):void 0,Ae=!V;if("inline"===o)return M||Ae?Ae?(0,_jsxRuntime.jsxs)(_jsxRuntime.Fragment,{children:[(0,_jsxRuntime.jsx)(_index3.PickerTrigger,{label:b,value:Ve,placeholder:f,helperText:j,error:N,required:R,disabled:D,size:w,variant:C,clearable:S,onClear:k,onPress:()=>I(!0),triggerStyle:T,testID:v}),M?Te:null]}):Te:null;const Ie=(0,_jsxRuntime.jsx)(_reactNative.Modal,{visible:M,transparent:!0,statusBarTranslucent:!0,navigationBarTranslucent:!0,animationType:"none",onRequestClose:De,children:(0,_jsxRuntime.jsxs)(_reactNativeGestureHandler.GestureHandlerRootView,{collapsable:!1,style:[Y.backdrop,{backgroundColor:L.colors.background.overlay}],children:[(0,_jsxRuntime.jsx)(_reactNative.Pressable,{style:_reactNative.StyleSheet.absoluteFill,onPress:De,accessibilityLabel:"Dismiss"}),(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{style:[Y.sheetWrap,{paddingBottom:Math.max(B.bottom,L.spacing.lg),opacity:J,transform:[{translateY:_reactNative.Animated.add(ke,K)}]}],onLayout:e=>{Q.current=e.nativeEvent.layout.height},accessibilityViewIsModal:!0,accessibilityRole:"none",children:Te}),(0,_jsxRuntime.jsx)(_ToastProvider.ToastHost,{})]})});return Ae?(0,_jsxRuntime.jsxs)(_jsxRuntime.Fragment,{children:[(0,_jsxRuntime.jsx)(_index3.PickerTrigger,{label:b,value:Ve,placeholder:f,helperText:j,error:N,required:R,disabled:D,size:w,variant:C,clearable:S,onClear:k,onPress:()=>I(!0),triggerStyle:T,testID:v}),Ie]}):Ie};exports.DatePicker=DatePicker;const buildStyles=e=>{const t=e.shadows.lg;return _reactNative.StyleSheet.create({backdrop:{..._reactNative.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,..._corners.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,..._corners.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,..._corners.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,..._corners.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,..._corners.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,..._corners.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}})};var _default=exports.default=DatePicker;
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=exports.DatePicker=void 0;var _react=require("react"),_reactNative=require("react-native"),_reactNativeGestureHandler=require("react-native-gesture-handler"),_useDragToDismiss=require("../../hooks/useDragToDismiss.js"),_index=require("../../theme/index.js"),_index2=require("../../utils/index.js"),_corners=require("../../utils/corners.js"),_defaultIcons=require("../AppIcon/defaultIcons.js"),_ModalSafeArea=require("../ModalSafeArea/ModalSafeArea.js"),_index3=require("../PickerTrigger/index.js"),_ToastProvider=require("../Toast/ToastProvider.js"),_jsxRuntime=require("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,n=[];for(let e=0;e<42;e+=1){const t=new Date(a,r,1-i+e);n.push({date:t,inMonth:t.getMonth()===r,iso:toIso(t)})}return n},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:n,disabledDates:s,mode:o="modal",locale:l="en-IN",weekStartsOn:c=0,title:d="Select Date",confirmLabel:u="Confirm",cancelLabel:m="Cancel",style:g,containerStyle:y,headerLabelStyle:_,navButtonStyle:x,footerButtonStyle:h,haptic:p,testID:b,label:v,placeholder:f,helperText:j,error:N,required:R,disabled:D,size:w,variant:S,clearable:C,onClear:k,formatValue:P,triggerStyle:T}=e,A=void 0!==e.visible,[V,M]=(0,_react.useState)(!1),I=A?e.visible:V,F=A?b:b?`${b}-calendar`:void 0,L=(0,_index.useTheme)(),[B,Y]=(0,_ModalSafeArea.useModalInsets)(),z=(0,_react.useMemo)(()=>buildStyles(L),[L]),[H,$]=(0,_react.useState)(()=>startOfDay(new Date));(0,_react.useEffect)(()=>{I&&$(startOfDay(new Date))},[I]);const W=t?startOfDay(t):H,[E,q]=(0,_react.useState)(W),[O,G]=(0,_react.useState)(t?startOfDay(t):null),[X,Z]=(0,_react.useState)("days"),J=(0,_react.useRef)((0,_index.createAnimatedValue)(0)).current,K=(0,_react.useRef)((0,_index.createAnimatedValue)(0)).current,Q=(0,_react.useRef)((0,_index.createAnimatedValue)(0)).current,U=(0,_react.useRef)(0),ee=(0,_react.useRef)((0,_index.createAnimatedValue)(0)).current,te=(0,_react.useRef)((0,_index.createAnimatedValue)(1)).current,ae=(0,_react.useRef)((0,_index.createAnimatedValue)(1)).current,re=(0,_react.useRef)((0,_index.createAnimatedValue)(1)).current,ie=(0,_react.useRef)((0,_index.createAnimatedValue)(1)).current,ne=(0,_react.useRef)((0,_index.createAnimatedValue)(1)).current;(0,_react.useEffect)(()=>{if(t){const e=startOfDay(t);G(e),q(e)}else G(null)},[t]),(0,_react.useEffect)(()=>{if("modal"===o&&I){J.setValue(0),(0,_index.setNativeValue)(K,0),(0,_index.setNativeValue)(Q,0);const e=_reactNative.Animated.parallel([_reactNative.Animated.timing(J,{toValue:1,duration:L.motion.duration.normal,easing:_reactNative.Easing.out(_reactNative.Easing.cubic),useNativeDriver:!1}),_reactNative.Animated.spring(K,{toValue:1,damping:L.motion.spring.gentle.damping,stiffness:L.motion.spring.gentle.stiffness,mass:L.motion.spring.gentle.mass,useNativeDriver:!0})]);return e.start(),()=>e.stop()}},[I,o,J,K,Q,L.motion]);const se=(0,_react.useMemo)(()=>{const e=new Set;return s?.forEach(t=>e.add(toIso(startOfDay(t)))),e},[s]),oe=(0,_react.useMemo)(()=>i?startOfDay(i):null,[i]),le=(0,_react.useMemo)(()=>n?startOfDay(n):null,[n]),ce=(0,_react.useCallback)(e=>!!(oe&&e.getTime()<oe.getTime())||(!!(le&&e.getTime()>le.getTime())||!!se.has(toIso(e))),[oe,le,se]),de=(0,_react.useMemo)(()=>buildMonthMatrix(E,c),[E,c]),ue=(0,_react.useMemo)(()=>buildYearCells(E.getFullYear()),[E]),me=(0,_react.useMemo)(()=>buildDecadeCells(E.getFullYear()),[E]),ge=(0,_react.useMemo)(()=>weekdayLabels(l,c),[l,c]),ye=(0,_react.useMemo)(()=>{if("days"===X)return formatMonthYear(E,l);if("years"===X){return`${ue[0]} - ${ue[ue.length-1]}`}return`${me[0]} - ${me[me.length-1]+9}`},[E,me,l,X,ue]),xe=(0,_react.useCallback)(e=>!!(oe&&e<oe.getFullYear())||!!(le&&e>le.getFullYear()),[oe,le]),he=(0,_react.useCallback)(e=>!!(oe&&e+10-1<oe.getFullYear())||!!(le&&e>le.getFullYear()),[oe,le]),pe=(0,_react.useCallback)(e=>{!1!==p&&(0,_index2.triggerHaptic)("impactLight");const t=e>0?1:-1,a=L.components.datePicker?.monthSlideDistance??32,r=L.components.datePicker?.monthSlideOutDuration??L.motion.duration.fast??140,i=L.components.datePicker?.monthSlideInDuration??L.motion.duration.fast??160;_reactNative.Animated.sequence([_reactNative.Animated.parallel([_reactNative.Animated.timing(ee,{toValue:-t*a,duration:r,easing:_reactNative.Easing.out(_reactNative.Easing.quad),useNativeDriver:!0}),_reactNative.Animated.timing(te,{toValue:0,duration:r,useNativeDriver:!0})]),_reactNative.Animated.timing(ee,{toValue:t*a,duration:0,useNativeDriver:!0}),_reactNative.Animated.parallel([_reactNative.Animated.timing(ee,{toValue:0,duration:i,easing:_reactNative.Easing.out(_reactNative.Easing.cubic),useNativeDriver:!0}),_reactNative.Animated.timing(te,{toValue:1,duration:i,useNativeDriver:!0})])]).start();const n=addMonths(E,e);q(n),_reactNative.AccessibilityInfo.announceForAccessibility(formatMonthYear(n,l))},[E,p,l,te,ee,L.components.datePicker,L.motion.duration.fast]),be=(0,_react.useCallback)(()=>{"days"!==X?(!1!==p&&(0,_index2.triggerHaptic)("impactLight"),q("years"===X?e=>new Date(e.getFullYear()-12,e.getMonth(),1):e=>new Date(e.getFullYear()-120,e.getMonth(),1))):pe(-1)},[pe,X,p]),ve=(0,_react.useCallback)(()=>{"days"!==X?(!1!==p&&(0,_index2.triggerHaptic)("impactLight"),q("years"===X?e=>new Date(e.getFullYear()+12,e.getMonth(),1):e=>new Date(e.getFullYear()+120,e.getMonth(),1))):pe(1)},[pe,X,p]),fe=(0,_react.useCallback)(()=>{const e=L.components.datePicker?.viewTransitionDuration??L.motion.duration.normal??200;(0,_index.setNativeValue)(re,0),(0,_index.setNativeValue)(ie,.9),_reactNative.Animated.parallel([_reactNative.Animated.timing(re,{toValue:1,duration:e,easing:_reactNative.Easing.out(_reactNative.Easing.cubic),useNativeDriver:!0}),_reactNative.Animated.timing(ie,{toValue:1,duration:e,easing:_reactNative.Easing.out(_reactNative.Easing.cubic),useNativeDriver:!0})]).start()},[re,ie,L.components.datePicker,L.motion.duration.normal]),je=(0,_react.useCallback)(()=>{const e=(0,_index2.resolveHaptic)(p,"selection");e&&(0,_index2.triggerHaptic)(e);const t=L.components.datePicker?.headerPressDuration??80,a=L.components.datePicker?.headerReleaseDuration??100;_reactNative.Animated.sequence([_reactNative.Animated.timing(ne,{toValue:.96,duration:t,useNativeDriver:!0}),_reactNative.Animated.timing(ne,{toValue:1,duration:a,useNativeDriver:!0})]).start(),Z(e=>"days"===e?"years":"years"===e?"decades":"years"),fe()},[fe,ne,p,L.components.datePicker]),Ne=(0,_react.useCallback)(e=>{const t=(0,_index2.resolveHaptic)(p,"selection");t&&(0,_index2.triggerHaptic)(t),q(t=>new Date(e,t.getMonth(),1)),Z("days"),fe()},[fe,p]),Re=(0,_react.useCallback)(e=>{const t=(0,_index2.resolveHaptic)(p,"selection");t&&(0,_index2.triggerHaptic)(t),q(t=>new Date(e+4,t.getMonth(),1)),Z("years"),fe()},[fe,p]),De=(0,_react.useCallback)(e=>{if(ce(e.date))return;const t=(0,_index2.resolveHaptic)(p,"selection");t&&(0,_index2.triggerHaptic)(t),G(e.date),e.inMonth||q(new Date(e.date.getFullYear(),e.date.getMonth(),1)),(0,_index.setNativeValue)(ae,.7),_reactNative.Animated.spring(ae,{toValue:1,damping:L.motion.spring.bouncy.damping,stiffness:L.motion.spring.bouncy.stiffness,mass:L.motion.spring.bouncy.mass,useNativeDriver:!0}).start()},[ce,ae,L.motion.spring.bouncy,p]),we=(0,_react.useCallback)(()=>{A||M(!1),r?.()},[A,r]),Se=(0,_react.useCallback)(()=>{"modal"===o?_reactNative.Animated.parallel([_reactNative.Animated.timing(J,{toValue:0,duration:L.motion.duration.fast,easing:_reactNative.Easing.bezier(...L.motion.easing.accelerate),useNativeDriver:!1}),_reactNative.Animated.timing(K,{toValue:0,duration:L.motion.duration.fast,easing:_reactNative.Easing.bezier(...L.motion.easing.accelerate),useNativeDriver:!0})]).start(()=>{we()}):we()},[J,o,we,K,L.motion.duration.fast,L.motion.easing.accelerate]),{handleGesture:Ce}=(0,_useDragToDismiss.useDragToDismiss)({drag:Q,travel:()=>U.current||320,onDismiss:Se}),ke=(0,_react.useCallback)(()=>{!1!==p&&(0,_index2.triggerHaptic)("selection"),Se()},[Se,p]),Pe=(0,_react.useCallback)(()=>{O&&(!1!==p&&(0,_index2.triggerHaptic)("notificationSuccess"),a?.(O),Se())},[Se,a,O,p]),Te=K.interpolate({inputRange:[0,1],outputRange:[320,0]}),Ae=(0,_jsxRuntime.jsx)(_reactNative.View,{style:z.titleRow,children:(0,_jsxRuntime.jsx)(_reactNative.Text,{style:z.title,accessibilityRole:"header",children:d})}),Ve=(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[z.card,g,y],accessibilityRole:"modal"===o?void 0:"none",accessible:!1,testID:F,children:["modal"===o?(0,_jsxRuntime.jsx)(_reactNativeGestureHandler.GestureDetector,{gesture:Ce,children:(0,_jsxRuntime.jsxs)(_reactNative.View,{style:z.grabArea,children:[(0,_jsxRuntime.jsx)(_reactNative.View,{style:z.handle}),Ae]})}):Ae,(0,_jsxRuntime.jsxs)(_reactNative.View,{style:z.headerRow,children:[(0,_jsxRuntime.jsx)(_reactNative.Pressable,{onPress:be,style:({pressed:e})=>[z.navBtn,e&&z.navBtnPressed,x],accessibilityRole:"button",accessibilityLabel:"days"===X?"Previous month":"years"===X?"Previous years":"Previous decades",hitSlop:8,children:(0,_jsxRuntime.jsx)(_reactNative.Text,{style:z.navText,children:"‹"})}),(0,_jsxRuntime.jsx)(_reactNative.Pressable,{onPress:je,style:[z.headerLabelWrap,_],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:(0,_jsxRuntime.jsxs)(_reactNative.Animated.View,{style:[z.headerLabelInner,{transform:[{scale:ne}],opacity:"days"===X?te:1}],children:[(0,_jsxRuntime.jsx)(_reactNative.Animated.Text,{style:[z.headerLabel,{transform:[{translateX:"days"===X?ee:0}]}],accessibilityLiveRegion:"polite",children:ye}),(0,_jsxRuntime.jsx)(_reactNative.View,{style:z.headerCaret,children:(L.icons?.chevronDown??_defaultIcons.defaultIcons.chevronDown)({size:L.typography.fontSize.sm,color:L.colors.text.secondary})})]})}),(0,_jsxRuntime.jsx)(_reactNative.Pressable,{onPress:ve,style:({pressed:e})=>[z.navBtn,e&&z.navBtnPressed,x],accessibilityRole:"button",accessibilityLabel:"days"===X?"Next month":"years"===X?"Next years":"Next decades",hitSlop:8,children:(0,_jsxRuntime.jsx)(_reactNative.Text,{style:z.navText,children:"›"})})]}),"days"===X?(0,_jsxRuntime.jsxs)(_jsxRuntime.Fragment,{children:[(0,_jsxRuntime.jsx)(_reactNative.View,{style:z.weekdayRow,children:ge.map((e,t)=>(0,_jsxRuntime.jsx)(_reactNative.View,{style:z.weekdayCell,children:(0,_jsxRuntime.jsx)(_reactNative.Text,{style:z.weekdayText,children:e})},`${e}-${t}`))}),(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{style:[z.grid,{opacity:te,transform:[{translateX:ee}]}],children:Array.from({length:6}).map((e,t)=>(0,_jsxRuntime.jsx)(_reactNative.View,{style:z.gridRow,children:de.slice(7*t,7*t+7).map(e=>{const t=ce(e.date),a=!!O&&isSameDay(e.date,O),r=isSameDay(e.date,H),i=a?L.colors.primary:"transparent",n=r&&!a?L.colors.primary:"transparent",s=a?L.colors.onPrimary:e.inMonth?t?L.colors.text.disabled:L.colors.text.primary:L.colors.text.tertiary,o=t?.3:e.inMonth?1:.4;return(0,_jsxRuntime.jsx)(_reactNative.Pressable,{disabled:t,onPress:()=>De(e),accessibilityRole:"button",accessibilityLabel:formatLongDate(e.date,l),accessibilityState:{selected:a,disabled:t},"aria-selected":a,"aria-disabled":t,style:z.dayCell,children:(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{style:[z.dayInner,{backgroundColor:i,borderColor:n,borderWidth:r&&!a?1.5:0,opacity:o},a?{transform:[{scale:ae}]}:null],children:(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[z.dayText,{color:s}],children:e.date.getDate()})})},e.iso)})},`r-${t}`))})]}):"years"===X?(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{style:[z.yearGrid,{opacity:re,transform:[{scale:ie}]}],children:Array.from({length:3}).map((e,t)=>(0,_jsxRuntime.jsx)(_reactNative.View,{style:z.gridRow,children:ue.slice(4*t,4*t+4).map(e=>{const t=xe(e),a=!!O&&O.getFullYear()===e,r=H.getFullYear()===e,i=a?L.colors.primary:"transparent",n=r&&!a?L.colors.primary:"transparent",s=a?L.colors.onPrimary:t?L.colors.text.disabled:L.colors.text.primary,o=t?.3:1;return(0,_jsxRuntime.jsx)(_reactNative.Pressable,{disabled:t,onPress:()=>Ne(e),accessibilityRole:"button",accessibilityLabel:`Year ${e}`,accessibilityState:{selected:a,disabled:t},"aria-selected":a,"aria-disabled":t,style:z.yearCell,children:(0,_jsxRuntime.jsx)(_reactNative.View,{style:[z.yearInner,{backgroundColor:i,borderColor:n,borderWidth:r&&!a?1.5:0,opacity:o}],children:(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[z.yearText,{color:s}],children:e})})},`year-${e}`)})},`yr-${t}`))}):(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{style:[z.yearGrid,{opacity:re,transform:[{scale:ie}]}],children:Array.from({length:3}).map((e,t)=>(0,_jsxRuntime.jsx)(_reactNative.View,{style:z.gridRow,children:me.slice(4*t,4*t+4).map(e=>{const t=e+10-1,a=he(e),r=!!O&&decadeStartFor(O.getFullYear())===e,i=decadeStartFor(H.getFullYear())===e,n=r?L.colors.primary:"transparent",s=i&&!r?L.colors.primary:"transparent",o=r?L.colors.onPrimary:a?L.colors.text.disabled:L.colors.text.primary,l=a?.3:1;return(0,_jsxRuntime.jsx)(_reactNative.Pressable,{disabled:a,onPress:()=>Re(e),accessibilityRole:"button",accessibilityLabel:`Decade ${e} to ${t}`,accessibilityState:{selected:r,disabled:a},"aria-selected":r,"aria-disabled":a,style:z.yearCell,children:(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[z.yearInner,{backgroundColor:n,borderColor:s,borderWidth:i&&!r?1.5:0,opacity:l}],children:[(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[z.yearText,{color:o}],children:`${e}s`}),(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[z.decadeRangeText,{color:r?L.colors.onPrimary:L.colors.text.tertiary}],children:`${e}-${t}`})]})},`decade-${e}`)})},`dec-${t}`))}),(0,_jsxRuntime.jsxs)(_reactNative.View,{style:z.footer,children:[(0,_jsxRuntime.jsx)(_reactNative.Pressable,{onPress:ke,style:({pressed:e})=>[z.footerBtn,z.footerCancel,e&&z.footerBtnPressed,h],accessibilityRole:"button",accessibilityLabel:m,children:(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[z.footerBtnText,{color:L.colors.text.secondary}],children:m})}),(0,_jsxRuntime.jsx)(_reactNative.Pressable,{onPress:Pe,disabled:!O,style:({pressed:e})=>[z.footerBtn,z.footerConfirm,{backgroundColor:L.colors.primary,opacity:O?1:.5},e&&{backgroundColor:L.colors.primaryHover},h],accessibilityRole:"button",accessibilityLabel:u,accessibilityState:{disabled:!O},"aria-disabled":!O,children:(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[z.footerBtnText,{color:L.colors.onPrimary}],children:u})})]})]}),Me=t?(P??(e=>e.toLocaleDateString()))(t):void 0,Ie=!A;if("inline"===o)return I||Ie?Ie?(0,_jsxRuntime.jsxs)(_jsxRuntime.Fragment,{children:[(0,_jsxRuntime.jsx)(_index3.PickerTrigger,{label:v,value:Me,placeholder:f,helperText:j,error:N,required:R,disabled:D,size:w,variant:S,clearable:C,onClear:k,onPress:()=>M(!0),triggerStyle:T,testID:b}),I?Ve:null]}):Ve:null;const Fe=(0,_jsxRuntime.jsx)(_reactNative.Modal,{visible:I,transparent:!0,statusBarTranslucent:!0,navigationBarTranslucent:!0,animationType:"none",onRequestClose:Se,children:(0,_jsxRuntime.jsx)(_ModalSafeArea.ModalSafeArea,{onInsets:Y,children:(0,_jsxRuntime.jsxs)(_reactNativeGestureHandler.GestureHandlerRootView,{collapsable:!1,style:[z.backdrop,{backgroundColor:L.colors.background.overlay}],children:[(0,_jsxRuntime.jsx)(_reactNative.Pressable,{style:_reactNative.StyleSheet.absoluteFill,onPress:Se,accessibilityLabel:"Dismiss"}),(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{style:[z.sheetWrap,{paddingBottom:Math.max(B.bottom,L.spacing.lg),opacity:K,transform:[{translateY:_reactNative.Animated.add(Te,Q)}]}],onLayout:e=>{U.current=e.nativeEvent.layout.height},accessibilityViewIsModal:!0,accessibilityRole:"none",children:Ve}),(0,_jsxRuntime.jsx)(_ToastProvider.ToastHost,{})]})})});return Ie?(0,_jsxRuntime.jsxs)(_jsxRuntime.Fragment,{children:[(0,_jsxRuntime.jsx)(_index3.PickerTrigger,{label:v,value:Me,placeholder:f,helperText:j,error:N,required:R,disabled:D,size:w,variant:S,clearable:C,onClear:k,onPress:()=>M(!0),triggerStyle:T,testID:b}),Fe]}):Fe};exports.DatePicker=DatePicker;const buildStyles=e=>{const t=e.shadows.lg;return _reactNative.StyleSheet.create({backdrop:{..._reactNative.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,..._corners.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,..._corners.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,..._corners.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,..._corners.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,..._corners.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,..._corners.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}})};var _default=exports.default=DatePicker;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=exports.DateRangePicker=void 0;var _react=require("react"),_reactNative=require("react-native"),_reactNativeGestureHandler=require("react-native-gesture-handler"),
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=exports.DateRangePicker=void 0;var _react=require("react"),_reactNative=require("react-native"),_reactNativeGestureHandler=require("react-native-gesture-handler"),_useDragToDismiss=require("../../hooks/useDragToDismiss.js"),_index=require("../../theme/index.js"),_index2=require("../../utils/index.js"),_corners=require("../../utils/corners.js"),_index3=require("../Calendar/index.js"),_calendarDates=require("../Calendar/calendarDates.js"),_ModalSafeArea=require("../ModalSafeArea/ModalSafeArea.js"),_index4=require("../PickerTrigger/index.js"),_ToastProvider=require("../Toast/ToastProvider.js"),_jsxRuntime=require("react/jsx-runtime");const formatRangePart=(e,t)=>new Intl.DateTimeFormat(t,{weekday:"short",day:"numeric",month:"short"}).format(e),DateRangePicker=exports.DateRangePicker=(0,_react.forwardRef)((e,t)=>{const{visible:a,value:r,onChange:i,onClose:s,label:n,placeholder:o,helperText:l,error:c,required:d,disabled:u,size:g,variant:m,clearable:_,onClear:x,formatValue:f,triggerStyle:p,minDate:h,maxDate:v,disabledDates:y,markedDates:b,strikeMarkedInRange:R,locale:j="en-IN",weekStartsOn:D=0,title:N="Select Date Range",confirmLabel:S="Confirm",cancelLabel:k="Cancel",maxRange:C,haptic:T,style:w,containerStyle:P,headerLabelStyle:M,navButtonStyle:V,footerButtonStyle:A,testID:B}=e,q=void 0!==a,[H,I]=(0,_react.useState)(!1),O=q?a:H,z=q?B:B?`${B}-calendar`:void 0,L=(0,_index.useTheme)(),[E,W]=(0,_ModalSafeArea.useModalInsets)(),$=(0,_react.useMemo)(()=>buildStyles(L),[L]),[G,F]=(0,_react.useState)(()=>(0,_calendarDates.startOfMonth)(r.start??new Date)),[Y,J]=(0,_react.useState)(r.start?(0,_calendarDates.startOfDay)(r.start):null),[K,Q]=(0,_react.useState)(r.end?(0,_calendarDates.startOfDay)(r.end):null),U=(0,_react.useRef)((0,_index.createAnimatedValue)(0)).current,X=(0,_react.useRef)((0,_index.createAnimatedValue)(0)).current,Z=(0,_react.useRef)((0,_index.createAnimatedValue)(0)).current,ee=(0,_react.useRef)(0);(0,_react.useEffect)(()=>{if(r.start){const e=(0,_calendarDates.startOfDay)(r.start);J(e),F((0,_calendarDates.startOfMonth)(e))}else J(null);r.end?Q((0,_calendarDates.startOfDay)(r.end)):Q(null)},[r.start,r.end]),(0,_react.useEffect)(()=>{let e;return O&&(U.setValue(0),(0,_index.setNativeValue)(X,0),(0,_index.setNativeValue)(Z,0),e=_reactNative.Animated.parallel([_reactNative.Animated.timing(U,{toValue:1,duration:L.motion.duration.normal,easing:_reactNative.Easing.out(_reactNative.Easing.cubic),useNativeDriver:!1}),_reactNative.Animated.spring(X,{toValue:1,damping:L.motion.spring.gentle.damping,stiffness:L.motion.spring.gentle.stiffness,mass:L.motion.spring.gentle.mass,useNativeDriver:!0})]),e.start()),()=>e?.stop()},[O,U,X,Z,L.motion]);const te=(0,_react.useCallback)(e=>{if(e.end&&C&&(0,_calendarDates.daysBetween)(e.start,e.end)+1>C)return!1!==T&&(0,_index2.triggerHaptic)("notificationWarning"),J(e.end),void Q(null);J(e.start),Q(e.end??null)},[C,T]),ae=(0,_react.useCallback)(()=>{q?s?.():I(!1)},[q,s]),re=(0,_react.useCallback)(()=>{_reactNative.Animated.parallel([_reactNative.Animated.timing(U,{toValue:0,duration:L.motion.duration.fast,easing:_reactNative.Easing.bezier(...L.motion.easing.accelerate),useNativeDriver:!1}),_reactNative.Animated.timing(X,{toValue:0,duration:L.motion.duration.fast,easing:_reactNative.Easing.bezier(...L.motion.easing.accelerate),useNativeDriver:!0})]).start(()=>{ae()})},[U,ae,X,L.motion.duration.fast,L.motion.easing.accelerate]),{handleGesture:ie}=(0,_useDragToDismiss.useDragToDismiss)({drag:Z,travel:()=>ee.current||320,onDismiss:re}),se=(0,_react.useCallback)(()=>{!1!==T&&(0,_index2.triggerHaptic)("selection"),re()},[re,T]),ne=(0,_react.useCallback)(()=>{Y&&K&&(!1!==T&&(0,_index2.triggerHaptic)("notificationSuccess"),i?.({start:Y,end:K}),re())},[re,i,Y,K,T]),oe=X.interpolate({inputRange:[0,1],outputRange:[320,0]}),le=(0,_react.useMemo)(()=>Y&&K?`${formatRangePart(Y,j)} — ${formatRangePart(K,j)}`:Y?`${formatRangePart(Y,j)} — …`:"—",[Y,K,j]),ce=!Y||!K,de=(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[$.card,w,P],ref:t,accessible:!1,testID:z,children:[(0,_jsxRuntime.jsx)(_reactNativeGestureHandler.GestureDetector,{gesture:ie,children:(0,_jsxRuntime.jsxs)(_reactNative.View,{style:$.grabArea,children:[(0,_jsxRuntime.jsx)(_reactNative.View,{style:$.handle}),(0,_jsxRuntime.jsxs)(_reactNative.View,{style:$.titleRow,children:[(0,_jsxRuntime.jsx)(_reactNative.Text,{style:$.title,accessibilityRole:"header",children:N}),(0,_jsxRuntime.jsx)(_reactNative.Text,{style:$.subtitle,accessibilityLiveRegion:"polite",children:le})]})]})}),(0,_jsxRuntime.jsx)(_index3.Calendar,{mode:"range",value:Y?{start:Y,end:K??void 0}:null,onChange:te,month:G,onMonthChange:F,minDate:h,maxDate:v,disabledDates:y,markedDates:b,strikeMarkedInRange:R,weekStartsOn:D,locale:j,haptic:T,headerLabelStyle:M,navButtonStyle:V,testID:z?`${z}-grid`:void 0}),(0,_jsxRuntime.jsxs)(_reactNative.View,{style:$.footer,children:[(0,_jsxRuntime.jsx)(_reactNative.Pressable,{onPress:se,style:({pressed:e})=>[$.footerBtn,$.footerCancel,e&&$.footerBtnPressed,A],accessibilityRole:"button",accessibilityLabel:k,children:(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[$.footerBtnText,{color:L.colors.text.secondary}],children:k})}),(0,_jsxRuntime.jsx)(_reactNative.Pressable,{onPress:ne,disabled:ce,style:({pressed:e})=>[$.footerBtn,$.footerConfirm,{backgroundColor:L.colors.primary,opacity:ce?.5:1},e&&{backgroundColor:L.colors.primaryHover},A],accessibilityRole:"button",accessibilityLabel:S,accessibilityState:{disabled:ce},"aria-disabled":ce,children:(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[$.footerBtnText,{color:L.colors.onPrimary}],children:S})})]})]}),ue=(0,_react.useMemo)(()=>{if(!r.start||!r.end)return"";const e={start:r.start,end:r.end};return f?f(e):`${e.start.toLocaleDateString()} – ${e.end.toLocaleDateString()}`},[r.start,r.end,f]);return(0,_jsxRuntime.jsxs)(_jsxRuntime.Fragment,{children:[q?null:(0,_jsxRuntime.jsx)(_index4.PickerTrigger,{label:n,placeholder:o,helperText:l,error:c,required:d,disabled:u,size:g,variant:m,clearable:_,onClear:x,value:ue,onPress:()=>I(!0),triggerStyle:p,testID:B}),(0,_jsxRuntime.jsx)(_reactNative.Modal,{visible:O,transparent:!0,statusBarTranslucent:!0,navigationBarTranslucent:!0,animationType:"none",onRequestClose:re,children:(0,_jsxRuntime.jsx)(_ModalSafeArea.ModalSafeArea,{onInsets:W,children:(0,_jsxRuntime.jsxs)(_reactNativeGestureHandler.GestureHandlerRootView,{collapsable:!1,style:[$.backdrop,{backgroundColor:L.colors.background.overlay}],children:[(0,_jsxRuntime.jsx)(_reactNative.Pressable,{style:_reactNative.StyleSheet.absoluteFill,onPress:re,accessibilityLabel:"Dismiss"}),(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{style:[$.sheetWrap,{paddingBottom:Math.max(E.bottom,L.spacing.lg),opacity:X,transform:[{translateY:_reactNative.Animated.add(oe,Z)}]}],onLayout:e=>{ee.current=e.nativeEvent.layout.height},accessibilityViewIsModal:!0,accessibilityRole:"none",children:de}),(0,_jsxRuntime.jsx)(_ToastProvider.ToastHost,{})]})})})]})});DateRangePicker.displayName="DateRangePicker";const buildStyles=e=>{const t=e.shadows.lg;return _reactNative.StyleSheet.create({backdrop:{..._reactNative.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,..._corners.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,..._corners.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,..._corners.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}})};var _default=exports.default=DateRangePicker;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=exports.Input=void 0;var _react=require("react"),_reactNative=require("react-native"),_index=require("../../hooks/index.js"),_index2=require("../../theme/index.js"),_index3=require("../../utils/index.js"),_defaultIcons=require("../AppIcon/defaultIcons.js"),_slotIcon=require("../AppIcon/slotIcon.js"),_index4=require("../Button/index.js"),_FieldBase=require("../FieldBase/FieldBase.js"),_useFloatingLabel=require("../FieldBase/useFloatingLabel.js"),_Notation=require("../Notation/Notation.js"),_jsxRuntime=require("react/jsx-runtime");const multilineMinHeightMap={sm:72,md:92,lg:110},Input=exports.Input=(0,_react.forwardRef)((e,t)=>{const{label:i,help:n,placeholder:o,value:a,onChangeText:r,error:l,helperText:s,type:d="input",secureTextEntry:c=!1,showPasswordToggle:u=!1,disabled:x=!1,multiline:p=!1,leftIcon:f,rightIcon:g,unit:m,unitStyle:_,prefix:v,prefixStyle:h,readOnly:y=!1,action:j,actionStyle:b,size:S="md",variant:N,labelMode:R,required:F=!1,maxLength:w,showCounter:z=!0,textAlign:I,format:T,parse:V,style:k,containerStyle:B,inputStyle:A,labelStyle:C,messageStyle:q,borderRadius:D,onFocus:L,onBlur:H,accessibilityLabel:P,testID:M,editable:E,...O}=e,G=(0,_index2.useTheme)(),W=(0,_react.useMemo)(()=>buildStyles(G),[G]),$=(0,_FieldBase.resolveFieldSize)(G,S),X=multilineMinHeightMap[S],J=Math.round(1.4*$.fontSize),K=N??G.components.input?.defaultVariant??G.components.field?.defaultVariant??"outlined",Q=R??G.components.input?.defaultLabelMode??"top",[U,Y]=(0,_react.useState)(!1),[Z,ee]=(0,_react.useState)(!1),te="password"===d||u||c,ie="password"===d||u,ne="textarea"===d||p,oe=ne?Math.round(.1*$.fontSize):0,ae="string"==typeof a&&a.length>0,re=(0,_FieldBase.hasFieldText)(l),le=!0===l||re,se=(0,_FieldBase.hasFieldText)(s),de=re||!le&&se,ce=(0,_FieldBase.hasFieldText)(i),ue=(0,_FieldBase.hasFieldText)(v),xe=!x&&!1!==E,pe=U||ae||ue,fe=(0,_react.useRef)(null),ge=(0,_react.useMemo)(()=>(0,_index3.mergeRefs)(fe,t),[t]),me=(0,_react.useCallback)(()=>{xe&&fe.current?.focus()},[xe]),_e=ce&&"float"===Q,ve=(0,_react.useRef)((0,_index2.createAnimatedValue)(0)).current,he=(0,_react.useRef)((0,_index2.createAnimatedValue)(de?1:0)).current;(0,_react.useEffect)(()=>{const e=_reactNative.Animated.timing(he,{toValue:de?1:0,duration:G.motion.duration.fast,easing:_reactNative.Easing.bezier(...G.motion.easing.standard),useNativeDriver:!0});return e.start(),()=>e.stop()},[de,he,G.motion.duration.fast,G.motion.easing.standard]);const ye=(0,_index.useReducedMotion)(),je=G.components.input?.shakeOnError??!1,be=(0,_react.useRef)(le);(0,_react.useEffect)(()=>{if(!je)return void(be.current=le);let e;return le&&!be.current&&(ye||((0,_index2.setNativeValue)(ve,0),e=_reactNative.Animated.sequence([_reactNative.Animated.timing(ve,{toValue:1,duration:50,useNativeDriver:!0}),_reactNative.Animated.timing(ve,{toValue:-1,duration:50,useNativeDriver:!0}),_reactNative.Animated.timing(ve,{toValue:1,duration:50,useNativeDriver:!0}),_reactNative.Animated.timing(ve,{toValue:-1,duration:50,useNativeDriver:!0}),_reactNative.Animated.timing(ve,{toValue:0,duration:100,useNativeDriver:!0})]),e.start()),(0,_index3.triggerHaptic)("notificationError")),be.current=le,()=>e?.stop()},[le,ve,je,ye]);const Se=(0,_react.useCallback)(e=>{Y(!0),L?.(e)},[L]),Ne=(0,_react.useCallback)(e=>{Y(!1),H?.(e)},[H]),Re=(0,_react.useCallback)(()=>{(0,_index3.triggerHaptic)("selection"),ee(e=>!e)},[]),Fe=(0,_react.useMemo)(()=>{const e=G.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},[G.components.input?.fillColors,K]),we=G.colors.field.caret,ze=D??G.components.input?.borderRadius,Ie=G.components.input?.tintLabelOnFocus??!1,Te=U&&Ie?G.colors.field.borderFocused:G.colors.field.label,Ve=ve.interpolate({inputRange:[-1,0,1],outputRange:[-6,0,6]}),ke=Boolean(g)||Boolean(m)||ie,Be="underline"===K,Ae=f?$.iconSize+G.spacing.md+1+G.spacing.md:0,Ce=(0,_useFloatingLabel.useFloatingLabel)({label:i,enabled:_e,floated:pe,required:F,variant:K,sizeTokens:$,leadingOffset:Ae,trailingOffset:ke?$.iconSize+G.spacing.sm:0,textAlign:I,paddingLeft:Be?0:$.paddingHorizontal,lineHeight:ne?J:void 0,restNudge:oe,floatTrim:ne?2:0,color:Te,style:C}),qe=(0,_FieldBase.resolveFieldTextStyle)(G,{disabled:x}),De=qe.color,Le=qe.placeholderColor,He=F&&!ce&&!ae&&"string"==typeof o&&o.length>0,Pe=le?l:s,Me=z&&"number"==typeof w&&"string"==typeof a?`${a.length} / ${w}`:null,Ee=le?G.colors.field.message:G.colors.text.secondary,Oe=(0,_Notation.useNotationInk)(q,$.messageFontSize,Ee),Ge=P??(0,_FieldBase.fieldTextAsString)(i)??o,We=G.colors.field,$e=x?We.iconDisabled:U?We.iconFocused:We.icon,Xe={focused:U,disabled:x,error:le,color:$e,size:$.iconSize},renderSlot=e=>(0,_slotIcon.renderSlotIcon)(e,Xe),Je=(()=>{if(ie){const e=(Z?G.icons?.eyeOff:G.icons?.eye)??(Z?_defaultIcons.defaultIcons.eyeOff:_defaultIcons.defaultIcons.eye);return(0,_jsxRuntime.jsx)(_reactNative.Pressable,{onPress:Re,disabled:!xe,hitSlop:8,accessibilityRole:"button",accessibilityLabel:Z?"Hide password":"Show password",children:e({size:$.iconSize,color:$e})})}const e=m?(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[W.unit,{fontSize:$.fontSize,color:Le},_],children:m}):null,t=g?(0,_jsxRuntime.jsx)(_reactNative.View,{children:renderSlot(g)}):null;return e&&t?(0,_jsxRuntime.jsxs)(_reactNative.View,{style:W.trailingRow,children:[e,t]}):e??t})(),Ke=f?(0,_jsxRuntime.jsx)(_reactNative.View,{children:renderSlot(f)}):null,Qe=_reactNative.StyleSheet.flatten(h),Ue=Qe?.fontSize??$.fontSize,Ye=Qe?.color??Le,Ze=(0,_react.useMemo)(()=>({fontSize:Ue,color:Ye}),[Ue,Ye]),et=ue?"string"==typeof v||"number"==typeof v?(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[W.prefix,{fontSize:$.fontSize,color:Le,marginRight:G.spacing.xs,lineHeight:ne?J:void 0,paddingTop:ne?oe:void 0},h],children:v}):(0,_jsxRuntime.jsx)(_reactNative.View,{style:[W.prefixNode,{marginRight:G.spacing.xs,minHeight:ne?J:void 0,justifyContent:"center",paddingTop:ne?oe:void 0}],children:(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[W.prefix,{fontSize:$.fontSize,color:Le,lineHeight:ne?J:void 0},h],children:(0,_jsxRuntime.jsx)(_Notation.NotationInkContext.Provider,{value:Ze,children:v})})}):null,tt=j?(0,_jsxRuntime.jsx)(_index4.Button,{variant:j.variant??"outline",tone:j.tone??"primary",size:S,title:j.label,leftIcon:j.icon,loading:j.loading,disabled:x||j.disabled,onPress:j.onPress,pressAnimation:!1,testID:j.testID,style:[W.action,{minHeight:$.minHeight,alignSelf:ne?"flex-start":"stretch"},b]}):null;return(0,_jsxRuntime.jsxs)(_reactNative.Animated.View,{style:[W.container,{transform:[{translateX:Ve}]},k],children:[ce&&!_e?(0,_jsxRuntime.jsx)(_FieldBase.FieldLabel,{size:S,required:F,help:n,color:Te,style:C,children:i}):null,(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[W.fieldRow,{columnGap:G.spacing.sm,alignItems:ne?"flex-start":"stretch"}],children:[(0,_jsxRuntime.jsxs)(_reactNative.View,{style:W.fieldWrapper,children:[(0,_jsxRuntime.jsxs)(_FieldBase.FieldBase,{size:S,variant:K,focused:U,disabled:x,error:le,filled:ae,minHeight:ne?X:void 0,borderRadius:ze,fillOverrides:Fe,leading:Ke,leadingDivider:null!=f,paddingLeft:Be?0:void 0,trailing:Je,slotAlign:ne?"top":"center",slotLineHeight:ne?J:void 0,topNotch:Ce.topNotch,onPress:me,pressFeedback:!1,style:B,children:[et,(0,_jsxRuntime.jsxs)(_reactNative.View,{style:W.inputWrap,children:[(0,_jsxRuntime.jsx)(_reactNative.TextInput,{ref:ge,style:[W.input,{color:De,fontSize:$.fontSize,...qe.weightStyle,paddingLeft:Be?0:void 0,minHeight:ne?X-2*$.paddingVertical:void 0,lineHeight:ne?J:void 0,paddingTop:ne?oe:void 0,textAlignVertical:ne?"top":"center"},A],textAlign:I,placeholder:_e&&!pe||He?void 0:o,placeholderTextColor:Le,value:T&&null!=a?T(a):a,onChangeText:e=>{r&&r(V?V(e):e)},onFocus:Se,onBlur:Ne,editable:xe,readOnly:y,secureTextEntry:te&&!Z,multiline:ne,autoCapitalize:te?"none":void 0,autoCorrect:!te&&void 0,maxLength:w,selectionColor:we,accessibilityLabel:Ge,accessibilityState:{disabled:x},"aria-disabled":x,testID:M,...O}),He?(0,_jsxRuntime.jsx)(_FieldBase.RequiredPlaceholder,{text:o,color:Le,fontSize:$.fontSize,weightStyle:qe.weightStyle,align:ne?"top":"center",paddingTop:ne?oe:void 0,textAlign:I}):null]})]}),Ce.node]}),tt]}),de||Me?(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[W.footerRow,{marginTop:$.messageGap}],children:[de?(0,_jsxRuntime.jsxs)(_reactNative.Animated.View,{style:[W.messageRow,{columnGap:G.spacing.xs+2,opacity:he}],accessibilityLiveRegion:le?"polite":"none",children:[le?(0,_jsxRuntime.jsx)(_FieldBase.FieldErrorGlyph,{size:$.messageFontSize,color:Ee}):null,(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[W.messageText,{color:Ee,fontSize:$.messageFontSize,...(0,_index2.fontFor)(G,"normal")},q],children:(0,_jsxRuntime.jsx)(_Notation.NotationInkContext.Provider,{value:Oe,children:Pe})})]}):(0,_jsxRuntime.jsx)(_reactNative.View,{style:W.footerSpacer}),Me?(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[W.counterText,{color:G.colors.text.tertiary,fontSize:$.messageFontSize,...(0,_index2.fontFor)(G,"normal")}],children:Me}):null]}):null]})});Input.displayName="Input";const buildStyles=e=>_reactNative.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}});var _default=exports.default=Input;
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=exports.Input=void 0;var _react=require("react"),_reactNative=require("react-native"),_index=require("../../hooks/index.js"),_index2=require("../../theme/index.js"),_index3=require("../../utils/index.js"),_defaultIcons=require("../AppIcon/defaultIcons.js"),_slotIcon=require("../AppIcon/slotIcon.js"),_index4=require("../Button/index.js"),_FieldBase=require("../FieldBase/FieldBase.js"),_useFloatingLabel=require("../FieldBase/useFloatingLabel.js"),_Notation=require("../Notation/Notation.js"),_jsxRuntime=require("react/jsx-runtime");const multilineMinHeightMap={sm:72,md:92,lg:110},Input=exports.Input=(0,_react.forwardRef)((e,t)=>{const{label:i,help:n,placeholder:o,value:a,onChangeText:r,error:l,helperText:s,type:d="input",secureTextEntry:c=!1,showPasswordToggle:u=!1,disabled:x=!1,multiline:p=!1,leftIcon:f,rightIcon:g,unit:m,unitStyle:_,prefix:v,prefixStyle:h,readOnly:y=!1,action:j,actionStyle:b,size:S="md",variant:N,labelMode:R,required:F=!1,maxLength:w,showCounter:z=!0,textAlign:I,format:T,parse:V,style:k,containerStyle:B,inputStyle:A,labelStyle:C,messageStyle:q,borderRadius:D,onFocus:L,onBlur:H,accessibilityLabel:P,testID:M,editable:E,...O}=e,G=(0,_index2.useTheme)(),W=(0,_react.useMemo)(()=>buildStyles(G),[G]),$=(0,_FieldBase.resolveFieldSize)(G,S),X=multilineMinHeightMap[S],J=Math.round(1.4*$.fontSize),K=N??G.components.input?.defaultVariant??G.components.field?.defaultVariant??"outlined",Q=R??G.components.input?.defaultLabelMode??"top",[U,Y]=(0,_react.useState)(!1),[Z,ee]=(0,_react.useState)(!1),te="password"===d||u||c,ie="password"===d||u,ne="textarea"===d||p,oe=ne?Math.round(.1*$.fontSize):0,ae="string"==typeof a&&a.length>0,re=(0,_FieldBase.hasFieldText)(l),le=!0===l||re,se=(0,_FieldBase.hasFieldText)(s),de=re||!le&&se,ce=(0,_FieldBase.hasFieldText)(i),ue=(0,_FieldBase.hasFieldText)(v),xe=!x&&!1!==E,pe=U||ae||ue,fe=(0,_react.useRef)(null),ge=(0,_react.useMemo)(()=>(0,_index3.mergeRefs)(fe,t),[t]),me=(0,_react.useCallback)(()=>{xe&&fe.current?.focus()},[xe]),ve=ce&&"float"===Q,he=(0,_react.useRef)((0,_index2.createAnimatedValue)(0)).current,ye=(0,_react.useRef)((0,_index2.createAnimatedValue)(de?1:0)).current;(0,_react.useEffect)(()=>{const e=_reactNative.Animated.timing(ye,{toValue:de?1:0,duration:G.motion.duration.fast,easing:_reactNative.Easing.bezier(...G.motion.easing.standard),useNativeDriver:!0});return e.start(),()=>e.stop()},[de,ye,G.motion.duration.fast,G.motion.easing.standard]);const je=(0,_index.useReducedMotion)(),be=G.components.input?.shakeOnError??!1,Se=(0,_react.useRef)(le);(0,_react.useEffect)(()=>{if(!be)return void(Se.current=le);let e;return le&&!Se.current&&(je||((0,_index2.setNativeValue)(he,0),e=_reactNative.Animated.sequence([_reactNative.Animated.timing(he,{toValue:1,duration:50,useNativeDriver:!0}),_reactNative.Animated.timing(he,{toValue:-1,duration:50,useNativeDriver:!0}),_reactNative.Animated.timing(he,{toValue:1,duration:50,useNativeDriver:!0}),_reactNative.Animated.timing(he,{toValue:-1,duration:50,useNativeDriver:!0}),_reactNative.Animated.timing(he,{toValue:0,duration:100,useNativeDriver:!0})]),e.start()),(0,_index3.triggerHaptic)("notificationError")),Se.current=le,()=>e?.stop()},[le,he,be,je]);const Ne=(0,_react.useCallback)(e=>{Y(!0),L?.(e)},[L]),Re=(0,_react.useCallback)(e=>{Y(!1),H?.(e)},[H]),Fe=(0,_react.useCallback)(()=>{(0,_index3.triggerHaptic)("selection"),ee(e=>!e)},[]),we=(0,_react.useMemo)(()=>{const e=G.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},[G.components.input?.fillColors,K]),ze=G.colors.field.caret,Ie=D??G.components.input?.borderRadius,Te=G.components.input?.tintLabelOnFocus??!1,Ve=U&&Te?G.colors.field.borderFocused:G.colors.field.label,ke=he.interpolate({inputRange:[-1,0,1],outputRange:[-6,0,6]}),Be=Boolean(g)||Boolean(m)||ie,Ae="underline"===K,Ce=f?$.iconSize+G.spacing.md+1+G.spacing.md:0,qe=(0,_useFloatingLabel.useFloatingLabel)({label:i,enabled:ve,floated:pe,required:F,variant:K,sizeTokens:$,leadingOffset:Ce,trailingOffset:Be?$.iconSize+G.spacing.sm:0,textAlign:I,paddingLeft:Ae?0:$.paddingHorizontal,lineHeight:ne?J:void 0,restNudge:oe,floatTrim:ne?2:0,color:Ve,style:C}),De=(0,_FieldBase.resolveFieldTextStyle)(G,{disabled:x}),Le=De.color,He=De.placeholderColor,Pe=F&&!ce&&!ae&&"string"==typeof o&&o.length>0,Me=le?l:s,Ee=z&&"number"==typeof w&&"string"==typeof a?`${a.length} / ${w}`:null,Oe=le?G.colors.field.message:G.colors.text.secondary,Ge=(0,_Notation.useNotationInk)(q,$.messageFontSize,Oe),We=P??(0,_FieldBase.fieldTextAsString)(i)??o,$e=G.colors.field,Xe=x?$e.iconDisabled:U?$e.iconFocused:$e.icon,Je={focused:U,disabled:x,error:le,color:Xe,size:$.iconSize},renderSlot=e=>(0,_slotIcon.renderSlotIcon)(e,Je),Ke=(()=>{if(ie){const e=(Z?G.icons?.eyeOff:G.icons?.eye)??(Z?_defaultIcons.defaultIcons.eyeOff:_defaultIcons.defaultIcons.eye);return(0,_jsxRuntime.jsx)(_reactNative.Pressable,{onPress:Fe,disabled:!xe,hitSlop:8,accessibilityRole:"button",accessibilityLabel:Z?"Hide password":"Show password",children:e({size:$.iconSize,color:Xe})})}const e=m?(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[W.unit,{fontSize:$.fontSize,color:He},_],children:m}):null,t=g?(0,_jsxRuntime.jsx)(_reactNative.View,{children:renderSlot(g)}):null;return e&&t?(0,_jsxRuntime.jsxs)(_reactNative.View,{style:W.trailingRow,children:[e,t]}):e??t})(),Qe=f?(0,_jsxRuntime.jsx)(_reactNative.View,{children:renderSlot(f)}):null,Ue=_reactNative.StyleSheet.flatten(h),Ye=Ue?.fontSize??$.fontSize,Ze=Ue?.color??He,et=(0,_react.useMemo)(()=>({fontSize:Ye,color:Ze}),[Ye,Ze]),tt=ue?"string"==typeof v||"number"==typeof v?(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[W.prefix,{fontSize:$.fontSize,color:He,marginRight:G.spacing.xs,lineHeight:ne?J:void 0,paddingTop:ne?oe:void 0},h],children:v}):(0,_jsxRuntime.jsx)(_reactNative.View,{style:[W.prefixNode,{marginRight:G.spacing.xs,minHeight:ne?J:void 0,justifyContent:"center",paddingTop:ne?oe:void 0}],children:(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[W.prefix,{fontSize:$.fontSize,color:He,lineHeight:ne?J:void 0},h],children:(0,_jsxRuntime.jsx)(_Notation.NotationInkContext.Provider,{value:et,children:v})})}):null,it=j?(0,_jsxRuntime.jsx)(_index4.Button,{variant:j.variant??"outline",tone:j.tone??"primary",size:S,title:j.label,leftIcon:j.icon,loading:j.loading,disabled:x||j.disabled,onPress:j.onPress,pressAnimation:!1,testID:j.testID,style:[W.action,{minHeight:$.minHeight,alignSelf:ne?"flex-start":"stretch"},b]}):null;return(0,_jsxRuntime.jsxs)(_reactNative.Animated.View,{style:[W.container,{transform:[{translateX:ke}]},k],children:[ce&&!ve?(0,_jsxRuntime.jsx)(_FieldBase.FieldLabel,{size:S,required:F,help:n,color:Ve,style:C,children:i}):null,(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[W.fieldRow,{columnGap:G.spacing.sm,alignItems:ne?"flex-start":"stretch"}],children:[(0,_jsxRuntime.jsxs)(_reactNative.View,{style:W.fieldWrapper,children:[(0,_jsxRuntime.jsxs)(_FieldBase.FieldBase,{size:S,variant:K,focused:U,disabled:x,error:le,filled:ae,minHeight:ne?X:void 0,borderRadius:Ie,fillOverrides:we,leading:Qe,leadingDivider:null!=f,paddingLeft:Ae?0:void 0,trailing:Ke,slotAlign:ne?"top":"center",slotLineHeight:ne?J:void 0,topNotch:qe.topNotch,onPress:me,pressFeedback:!1,style:B,children:[tt,(0,_jsxRuntime.jsxs)(_reactNative.View,{style:W.inputWrap,children:[(0,_jsxRuntime.jsx)(_reactNative.TextInput,{ref:ge,style:[W.input,{color:Le,fontSize:$.fontSize,...De.weightStyle,paddingLeft:Ae?0:void 0,minHeight:ne?X-2*$.paddingVertical:void 0,lineHeight:ne?J:void 0,paddingTop:ne?oe:void 0,textAlignVertical:ne?"top":"center"},A],textAlign:I,placeholder:ve&&!pe||Pe?void 0:o,placeholderTextColor:He,value:T&&null!=a?T(a):a,onChangeText:e=>{r&&r(V?V(e):e)},onFocus:Ne,onBlur:Re,editable:xe,readOnly:y,secureTextEntry:te&&!Z,multiline:ne,autoCapitalize:te?"none":void 0,autoCorrect:!te&&void 0,maxLength:w,selectionColor:ze,accessibilityLabel:We,accessibilityState:{disabled:x},"aria-disabled":x,testID:M,...O}),Pe?(0,_jsxRuntime.jsx)(_FieldBase.RequiredPlaceholder,{text:o,color:He,fontSize:$.fontSize,weightStyle:De.weightStyle,align:ne?"top":"center",paddingTop:ne?oe:void 0,textAlign:I}):null]})]}),qe.node]}),it]}),de||Ee?(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[W.footerRow,{marginTop:$.messageGap}],children:[de?(0,_jsxRuntime.jsxs)(_reactNative.Animated.View,{style:[W.messageRow,{columnGap:G.spacing.xs+2,opacity:ye}],accessibilityLiveRegion:le?"polite":"none",children:[le?(0,_jsxRuntime.jsx)(_FieldBase.FieldErrorGlyph,{size:$.messageFontSize,color:Oe}):null,(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[W.messageText,{color:Oe,fontSize:$.messageFontSize,...(0,_index2.fontFor)(G,"normal")},q],children:(0,_jsxRuntime.jsx)(_Notation.NotationInkContext.Provider,{value:Ge,children:Me})})]}):(0,_jsxRuntime.jsx)(_reactNative.View,{style:W.footerSpacer}),Ee?(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[W.counterText,{color:G.colors.text.tertiary,fontSize:$.messageFontSize,...(0,_index2.fontFor)(G,"normal")}],children:Ee}):null]}):null]})});Input.displayName="Input";const buildStyles=e=>_reactNative.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}});var _default=exports.default=Input;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.useLoader=exports.loader=exports.LoaderOverlay=void 0;var _react=require("react"),_reactNative=require("react-native"),_useReducedMotion=require("../../hooks/useReducedMotion.js"),_index=require("../../theme/index.js"),_index2=require("../Spinner/index.js"),_jsxRuntime=require("react/jsx-runtime");const DEFAULT_SHOW_DELAY_MS=150,DEFAULT_MIN_VISIBLE_MS=400;let state={refCount:0,message:void 0};const listeners=new Set,notify=()=>{for(const e of listeners)e()},subscribe=e=>(listeners.add(e),()=>{listeners.delete(e)}),getState=()=>state,show=e=>{state={refCount:state.refCount+1,message:e??state.message},notify()},hide=()=>{if(state.refCount<=0)return;const e=state.refCount-1;state={refCount:e,message:0===e?void 0:state.message},notify()},reset=()=>{0===state.refCount&&void 0===state.message||(state={refCount:0,message:void 0},notify())},isVisible=()=>state.refCount>0,wrap=async(e,t)=>{show(t);try{return await("function"==typeof e?e():e)}finally{hide()}},loader=exports.loader={show:show,hide:hide,wrap:wrap,isVisible:isVisible,reset:reset},useLoader=()=>loader;exports.useLoader=useLoader;const LoaderOverlay=({renderIndicator:e,backdropColor:t,showDelayMs:r=150,minVisibleMs:s=400,testID:a})=>{const n=(0,_index.useTheme)(),i=(0,_useReducedMotion.useReducedMotion)(),
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.useLoader=exports.loader=exports.LoaderOverlay=void 0;var _react=require("react"),_reactNative=require("react-native"),_useReducedMotion=require("../../hooks/useReducedMotion.js"),_index=require("../../theme/index.js"),_index2=require("../Spinner/index.js"),_jsxRuntime=require("react/jsx-runtime");const DEFAULT_SHOW_DELAY_MS=150,DEFAULT_MIN_VISIBLE_MS=400;let state={refCount:0,message:void 0};const listeners=new Set,notify=()=>{for(const e of listeners)e()},subscribe=e=>(listeners.add(e),()=>{listeners.delete(e)}),getState=()=>state,show=e=>{state={refCount:state.refCount+1,message:e??state.message},notify()},hide=()=>{if(state.refCount<=0)return;const e=state.refCount-1;state={refCount:e,message:0===e?void 0:state.message},notify()},reset=()=>{0===state.refCount&&void 0===state.message||(state={refCount:0,message:void 0},notify())},isVisible=()=>state.refCount>0,wrap=async(e,t)=>{show(t);try{return await("function"==typeof e?e():e)}finally{hide()}},loader=exports.loader={show:show,hide:hide,wrap:wrap,isVisible:isVisible,reset:reset},useLoader=()=>loader;exports.useLoader=useLoader;const LoaderOverlay=({renderIndicator:e,backdropColor:t,showDelayMs:r=150,minVisibleMs:s=400,testID:a})=>{const n=(0,_index.useTheme)(),i=(0,_useReducedMotion.useReducedMotion)(),o=(0,_react.useSyncExternalStore)(subscribe,getState),[u,c]=(0,_react.useState)(!1),l=(0,_react.useRef)(null),d=(0,_react.useRef)(null),f=(0,_react.useRef)(null),_=(0,_react.useRef)((0,_index.createAnimatedValue)(0)).current,y=o.refCount>0;(0,_react.useEffect)(()=>{if(y)return null!==d.current&&(clearTimeout(d.current),d.current=null),void(u||null!==l.current||(l.current=setTimeout(()=>{l.current=null,0!==getState().refCount&&(f.current=Date.now(),c(!0))},r)));if(null!==l.current&&(clearTimeout(l.current),l.current=null),u&&null===d.current){const e=null!==f.current?Date.now()-f.current:s,t=Math.max(0,s-e);d.current=setTimeout(()=>{d.current=null,f.current=null,c(!1)},t)}},[y,u,r,s]),(0,_react.useEffect)(()=>()=>{null!==l.current&&clearTimeout(l.current),null!==d.current&&clearTimeout(d.current)},[]),(0,_react.useEffect)(()=>{u?i?_.setValue(1):_reactNative.Animated.timing(_,{toValue:1,duration:n.motion.duration.normal,easing:_reactNative.Easing.bezier(...n.motion.easing.standard),useNativeDriver:!0}).start():_.setValue(0)},[u,i,_,n]),(0,_react.useEffect)(()=>{if(!u)return;const e=_reactNative.BackHandler.addEventListener("hardwareBackPress",()=>!0);return()=>{e.remove()}},[u]);const m=o.message;(0,_react.useEffect)(()=>{u&&m&&_reactNative.AccessibilityInfo.announceForAccessibility(m)},[u,m]);const v=(0,_react.useMemo)(()=>buildStyles(),[]);return u?(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{pointerEvents:"auto",testID:a,accessible:!0,accessibilityViewIsModal:!0,accessibilityLiveRegion:"polite",accessibilityLabel:m??"Loading",accessibilityRole:"progressbar",accessibilityState:{busy:!0},"aria-busy":!0,style:[v.overlay,{backgroundColor:t??n.colors.background.overlay,opacity:_}],children:e?e(m):(0,_jsxRuntime.jsx)(_index2.Spinner,{size:"lg",message:m})}):null};exports.LoaderOverlay=LoaderOverlay;const buildStyles=()=>_reactNative.StyleSheet.create({overlay:{..._reactNative.StyleSheet.absoluteFill,alignItems:"center",justifyContent:"center",zIndex:1e3}});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.MenuSurface=void 0;var _react=require("react"),_reactNative=require("react-native"),_reactNativeSafeAreaContext=require("react-native-safe-area-context"),_useReducedMotion=require("../../hooks/useReducedMotion.js"),_index=require("../../theme/index.js"),_corners=require("../../utils/corners.js"),_hapticUtils=require("../../utils/hapticUtils.js"),_placement=require("../../utils/placement.js"),_responsive=require("../../utils/responsive.js"),_AppIcon=require("../AppIcon/AppIcon.js"),_slotIcon=require("../AppIcon/slotIcon.js"),_index2=require("../Divider/index.js"),_index3=require("../OptionSheet/index.js"),_index4=require("../Text/index.js"),_ToastProvider=require("../Toast/ToastProvider.js"),_focusHost=require("./focusHost.js"),_menuModel=require("./menuModel.js"),_webOnly=require("./webOnly.js"),_jsxRuntime=require("react/jsx-runtime");const MENU_MIN_WIDTH=180,MENU_MAX_WIDTH=280,ROW_MIN_HEIGHT=48,TOP_ACTION_MIN_HEIGHT=64,ICON_SIZE=20,PREVIEW_LIFT=1.02,BACK_KEY="__menu-back",TOP_PREFIX="__menu-top:",WEB_CHECKABLE_ROLE=(0,_webOnly.webOnly)({role:"menuitemcheckbox"}),MenuSurface=e=>{const{open:t,anchor:s,items:i,title:n,topActions:r,placement:o,presentation:a,unavailable:l,context:c=!1,preview:u,onClose:d,restoreFocusTo:_,haptic:m,accessibilityLabel:p,closeLabel:x,backLabel:b,testID:h}=e,f=(0,_index.useTheme)(),v=(0,_react.useMemo)(()=>buildStyles(f),[f]),y=(0,_reactNativeSafeAreaContext.useSafeAreaInsets)(),j=(0,_reactNative.useWindowDimensions)(),R=(0,_useReducedMotion.useReducedMotion)(),g=(0,_react.useMemo)(()=>(0,_menuModel.visibleGroups)(i,l),[i,l]),w=(0,_react.useMemo)(()=>(0,_menuModel.visibleTopActions)(r,l),[r,l]),I="sheet"===a||"auto"===a&&j.width<_responsive.Breakpoints.lg&&(0,_menuModel.wantsSheet)(g,w),[A,k]=(0,_react.useState)(null),[N,E]=(0,_react.useState)(null),S=(0,_react.useRef)(d);S.current=d;const T=(0,_react.useRef)(_);T.current=_;const C=(0,_react.useRef)(null),M=(0,_react.useRef)(!1),O=(0,_react.useRef)(!1),L=(0,_react.useRef)(new Map),H=(0,_react.useRef)(null),D=(0,_react.useCallback)(()=>{if(!M.current)return;M.current=!1;const e=C.current;C.current=null,e?e():(0,_focusHost.focusHost)(T.current?.())},[]);(0,_react.useEffect)(()=>{if(t)return O.current=!0,M.current=!1,C.current=null,(0,_placement.claimAnchoredSurface)(()=>S.current());O.current&&(O.current=!1,M.current=!0,k(null),E(null),I||"ios"===_reactNative.Platform.OS||D())},[t]);const P=(0,_react.useCallback)(e=>{if(e.disabled)return;const t=(0,_hapticUtils.resolveHaptic)(m,"selection");t&&(0,_hapticUtils.triggerHaptic)(t),e.key!==BACK_KEY?e.submenu?k(e):(C.current=e.onPress??null,S.current()):k(null)},[m]),q=(0,_react.useMemo)(()=>({width:j.width,height:j.height,insets:y}),[j.width,j.height,y]),B=(0,_react.useMemo)(()=>{if(!s||!N)return null;const e=s.x+s.width/2>q.width/2?"end":"start";return(0,_placement.computePlacement)(s,N,q,o,{align:e})},[s,N,q,o]);let V=q.height-y.top-y.bottom-2*_placement.PLACEMENT_MARGIN;if(s&&B){const e=(0,_placement.placementRoom)(s,q);V="top"===B.placement?e.above:e.below}const F=Math.min(280,q.width-y.left-y.right-2*_placement.PLACEMENT_MARGIN),K=t&&null!==B,W=(0,_react.useRef)((0,_index.createAnimatedValue)(0)).current,z=(0,_react.useRef)((0,_index.createAnimatedValue)(1)).current;(0,_react.useEffect)(()=>{if(!K)return(0,_index.setNativeValue)(W,0),void(0,_index.setNativeValue)(z,1);const e=[_reactNative.Animated.timing(W,{toValue:1,duration:f.motion.duration.fast,easing:_reactNative.Easing.bezier(...f.motion.easing.decelerate),useNativeDriver:!0})];c&&!R&&e.push(_reactNative.Animated.spring(z,{toValue:1.02,damping:f.motion.spring.snappy.damping,stiffness:f.motion.spring.snappy.stiffness,mass:f.motion.spring.snappy.mass,useNativeDriver:!0}));const t=_reactNative.Animated.parallel(e);return t.start(),()=>t.stop()},[K,c,R,W,z,f.motion]);const $=(0,_react.useCallback)(e=>{const{width:t,height:s}=e.nativeEvent.layout;E(e=>e&&e.width===t&&e.height===s?e:{width:t,height:s})},[]),G=c&&"top"===B?.placement,U=A?.submenu?[A.submenu]:g,Y=G?[...U].reverse().map(e=>[...e].reverse()):U,X=[];if(A)X.push({key:BACK_KEY,label:A.label});else for(const e of w)X.push({key:`${TOP_PREFIX}${e.key}`,label:e.label,item:e});for(const e of Y)for(const t of e)X.push({key:t.key,label:t.label,item:t});const Z=X[0]?.key;(0,_react.useEffect)(()=>{if(!K||I||!Z)return;const e=setTimeout(()=>(0,_focusHost.focusHost)(L.current.get(Z)),_focusHost.FOCUS_DELAY_MS);return()=>clearTimeout(e)},[K,I,Z]);const setItemRef=e=>t=>{t?L.current.set(e,t):L.current.delete(e)},J=(0,_webOnly.webOnly)({onKeyDown:e=>{const t=e.key??e.nativeEvent?.key??"",s=X.length,i=X.findIndex(e=>e.key===H.current);let n=-1;if("ArrowDown"===t)n=(i+1)%s;else if("ArrowUp"===t)n=i<=0?s-1:i-1;else if("Home"===t)n=0;else if("End"===t)n=s-1;else{if("ArrowLeft"===t&&A)return e.preventDefault?.(),void k(null);if("ArrowRight"===t&&X[i]?.item?.submenu)return e.preventDefault?.(),void P(X[i].item);if(1===t.length&&""!==t.trim()){const e=t.toLowerCase();for(let t=1;t<=s;t+=1){const r=(i+t)%s;if(X[r].label.toLowerCase().startsWith(e)){n=r;break}}}}n>=0&&(e.preventDefault?.(),(e=>{const t=X[e];t&&(0,_focusHost.focusHost)(L.current.get(t.key))})(n))}});if(I){const e=A?.submenu?[{key:BACK_KEY,label:b,icon:"chevron-left"},...A.submenu]:[...w,...g.flat()],s=new Set(e.filter(e=>e.checked).map(e=>e.key));return(0,_jsxRuntime.jsx)(_index3.OptionSheet,{open:t,onClose:d,onAfterClose:D,title:A?.label??n,options:e,labelOf:e=>e.label,getValue:e=>e.key,disabledOf:e=>Boolean(e.disabled),destructiveOf:e=>Boolean(e.destructive),descriptionOf:e=>e.description,iconOf:e=>{const t=e;return(0,_slotIcon.renderSlotIcon)(t.icon,{color:t.destructive?f.colors.toneText.error:f.colors.text.secondary,size:20,disabled:Boolean(t.disabled)})},isSelected:e=>s.has(String(e)),onSelect:e=>P(e),accessibilityLabel:p??n,testID:h?`${h}-sheet`:void 0})}const inkFor=e=>e.disabled?f.colors.text.disabled:e.destructive?f.colors.toneText.error:f.colors.text.primary,Q=A?(0,_jsxRuntime.jsxs)(_jsxRuntime.Fragment,{children:[(0,_jsxRuntime.jsxs)(_reactNative.Pressable,{ref:setItemRef(BACK_KEY),onPress:()=>k(null),onFocus:()=>{H.current=BACK_KEY},accessibilityRole:"menuitem",accessibilityLabel:`${b}, ${A.label}`,android_ripple:{color:f.colors.surface.pressed,borderless:!1},style:({pressed:e})=>[v.row,e?v.pressed:null],children:[(0,_jsxRuntime.jsx)(_reactNative.View,{style:v.icon,children:(0,_jsxRuntime.jsx)(_AppIcon.AppIcon,{name:"chevron-left",size:20,color:f.colors.text.secondary})}),(0,_jsxRuntime.jsx)(_index4.Text,{variant:"body",weight:"semibold",numberOfLines:1,style:v.labels,children:A.label})]}),(0,_jsxRuntime.jsx)(_index2.Divider,{spacing:"none"})]}):(0,_jsxRuntime.jsxs)(_jsxRuntime.Fragment,{children:[n?(0,_jsxRuntime.jsx)(_index4.Text,{variant:"caption",color:"secondary",accessibilityRole:"header",numberOfLines:2,style:v.title,children:n}):null,w.length>0?(0,_jsxRuntime.jsxs)(_jsxRuntime.Fragment,{children:[(0,_jsxRuntime.jsx)(_reactNative.View,{style:v.topRow,children:w.map(e=>{const t=`${TOP_PREFIX}${e.key}`,s=Boolean(e.disabled),i=inkFor(e);return(0,_jsxRuntime.jsxs)(_reactNative.Pressable,{ref:setItemRef(t),onPress:()=>P(e),onFocus:()=>{H.current=t},disabled:s,accessibilityRole:"menuitem",accessibilityLabel:e.accessibilityLabel??e.label,accessibilityState:{disabled:s},"aria-disabled":s,testID:e.testID,style:({pressed:e})=>[v.topAction,e?v.pressed:null],children:[(0,_slotIcon.renderSlotIcon)(e.icon,{color:i,size:20,disabled:s}),(0,_jsxRuntime.jsx)(_index4.Text,{variant:"caption",color:i,numberOfLines:1,children:e.label})]},t)})}),(0,_jsxRuntime.jsx)(_index2.Divider,{spacing:"none"})]}):null]});return(0,_jsxRuntime.jsxs)(_reactNative.Modal,{visible:t,transparent:!0,statusBarTranslucent:!0,presentationStyle:"overFullScreen",animationType:"none",onRequestClose:d,onDismiss:D,children:[(0,_jsxRuntime.jsx)(_reactNative.Pressable,{style:[_reactNative.StyleSheet.absoluteFill,c?v.scrim:null],onPress:d,accessibilityRole:"button",accessibilityLabel:x,testID:h?`${h}-scrim`:void 0}),c&&u&&s?(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{pointerEvents:"none",accessibilityElementsHidden:!0,importantForAccessibility:"no-hide-descendants",style:[v.preview,{left:s.x,top:s.y,width:s.width,height:s.height,transform:[{scale:z}]}],children:u}):null,(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{accessibilityRole:"menu",accessibilityLabel:A?.label??p??n,onLayout:$,testID:h?`${h}-menu`:void 0,...J,style:[v.anchored,{left:B?.x??0,top:B?.y??0,maxWidth:F,opacity:K?W:0}],children:(0,_jsxRuntime.jsx)(_reactNative.View,{style:v.surface,children:(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[v.clip,{maxHeight:V}],children:[Q,(0,_jsxRuntime.jsx)(_reactNative.ScrollView,{style:v.scroll,bounces:!1,keyboardShouldPersistTaps:"handled",children:Y.map((e,t)=>{const s=e.some(e=>null!=e.icon);return(0,_jsxRuntime.jsxs)(_reactNative.View,{children:[t>0?(0,_jsxRuntime.jsx)(_index2.Divider,{spacing:"none"}):null,e.map(e=>((e,t)=>{const s=Boolean(e.disabled),i=inkFor(e);return(0,_jsxRuntime.jsxs)(_reactNative.Pressable,{ref:setItemRef(e.key),onPress:()=>P(e),onFocus:()=>{H.current=e.key},disabled:s,accessibilityRole:"menuitem",accessibilityLabel:e.accessibilityLabel??e.label,accessibilityState:{disabled:s,checked:e.checked},"aria-disabled":s,"aria-checked":e.checked,...void 0!==e.checked?WEB_CHECKABLE_ROLE:null,android_ripple:{color:f.colors.surface.pressed,borderless:!1},testID:e.testID,style:({pressed:e})=>[v.row,e?v.pressed:null],children:[t?(0,_jsxRuntime.jsx)(_reactNative.View,{style:v.icon,children:(0,_slotIcon.renderSlotIcon)(e.icon,{color:i,size:20,disabled:s})}):null,(0,_jsxRuntime.jsxs)(_reactNative.View,{style:v.labels,children:[(0,_jsxRuntime.jsx)(_index4.Text,{variant:"body",color:i,numberOfLines:2,children:e.label}),e.description?(0,_jsxRuntime.jsx)(_index4.Text,{variant:"caption",color:"secondary",numberOfLines:2,children:e.description}):null]}),e.detail?(0,_jsxRuntime.jsx)(_index4.Text,{variant:"caption",color:"tertiary",children:e.detail}):null,e.checked?(0,_jsxRuntime.jsx)(_AppIcon.AppIcon,{name:"check",size:20,color:f.colors.primary}):null,e.submenu?(0,_jsxRuntime.jsx)(_AppIcon.AppIcon,{name:"chevron-right",size:20,color:f.colors.text.tertiary}):null]},e.key)})(e,s))]},e[0].key)})})]})})}),(0,_jsxRuntime.jsx)(_ToastProvider.ToastHost,{})]})};exports.MenuSurface=MenuSurface;const buildStyles=e=>_reactNative.StyleSheet.create({scrim:{backgroundColor:e.colors.background.overlay},preview:{position:"absolute"},anchored:{position:"absolute",minWidth:180},surface:{backgroundColor:e.colors.background.elevated,borderRadius:e.radius.md,..._corners.smoothCorners,...e.shadows.lg},clip:{borderRadius:e.radius.md,..._corners.smoothCorners,overflow:"hidden"},scroll:{flexGrow:0,flexShrink:1},title:{paddingHorizontal:e.spacing.md,paddingTop:e.spacing.sm,paddingBottom:e.spacing.xs},row:{flexDirection:"row",alignItems:"center",gap:e.spacing.md,minHeight:48,paddingHorizontal:e.spacing.md,paddingVertical:e.spacing.sm},pressed:{backgroundColor:e.colors.surface.pressed},icon:{width:20,alignItems:"center"},labels:{flexGrow:1,flexShrink:1},topRow:{flexDirection:"row",padding:e.spacing.xs,gap:e.spacing.xs},topAction:{flexGrow:1,flexBasis:0,alignItems:"center",justifyContent:"center",gap:e.spacing.xs,minHeight:64,borderRadius:e.radius.sm,..._corners.smoothCorners}});
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.MenuSurface=void 0;var _react=require("react"),_reactNative=require("react-native"),_reactNativeSafeAreaContext=require("react-native-safe-area-context"),_useReducedMotion=require("../../hooks/useReducedMotion.js"),_index=require("../../theme/index.js"),_corners=require("../../utils/corners.js"),_hapticUtils=require("../../utils/hapticUtils.js"),_placement=require("../../utils/placement.js"),_responsive=require("../../utils/responsive.js"),_AppIcon=require("../AppIcon/AppIcon.js"),_slotIcon=require("../AppIcon/slotIcon.js"),_index2=require("../Divider/index.js"),_ModalSafeArea=require("../ModalSafeArea/ModalSafeArea.js"),_index3=require("../OptionSheet/index.js"),_index4=require("../Text/index.js"),_ToastProvider=require("../Toast/ToastProvider.js"),_focusHost=require("./focusHost.js"),_menuModel=require("./menuModel.js"),_webOnly=require("./webOnly.js"),_jsxRuntime=require("react/jsx-runtime");const MENU_MIN_WIDTH=180,MENU_MAX_WIDTH=280,ROW_MIN_HEIGHT=48,TOP_ACTION_MIN_HEIGHT=64,ICON_SIZE=20,PREVIEW_LIFT=1.02,BACK_KEY="__menu-back",TOP_PREFIX="__menu-top:",WEB_CHECKABLE_ROLE=(0,_webOnly.webOnly)({role:"menuitemcheckbox"}),MenuSurface=e=>{const{open:t,anchor:s,items:i,title:n,topActions:r,placement:o,presentation:a,unavailable:l,context:c=!1,preview:u,onClose:d,restoreFocusTo:_,haptic:m,accessibilityLabel:p,closeLabel:x,backLabel:b,testID:h}=e,f=(0,_index.useTheme)(),v=(0,_react.useMemo)(()=>buildStyles(f),[f]),j=(0,_reactNativeSafeAreaContext.useSafeAreaInsets)(),[y,R]=(0,_ModalSafeArea.useModalInsets)(),g=(0,_react.useMemo)(()=>({...j,top:y.top,bottom:y.bottom}),[j,y]),w=(0,_reactNative.useWindowDimensions)(),A=(0,_useReducedMotion.useReducedMotion)(),I=(0,_react.useMemo)(()=>(0,_menuModel.visibleGroups)(i,l),[i,l]),k=(0,_react.useMemo)(()=>(0,_menuModel.visibleTopActions)(r,l),[r,l]),S="sheet"===a||"auto"===a&&w.width<_responsive.Breakpoints.lg&&(0,_menuModel.wantsSheet)(I,k),[M,N]=(0,_react.useState)(null),[E,T]=(0,_react.useState)(null),C=(0,_react.useRef)(d);C.current=d;const O=(0,_react.useRef)(_);O.current=_;const L=(0,_react.useRef)(null),H=(0,_react.useRef)(!1),D=(0,_react.useRef)(!1),P=(0,_react.useRef)(new Map),q=(0,_react.useRef)(null),B=(0,_react.useCallback)(()=>{if(!H.current)return;H.current=!1;const e=L.current;L.current=null,e?e():(0,_focusHost.focusHost)(O.current?.())},[]);(0,_react.useEffect)(()=>{if(t)return D.current=!0,H.current=!1,L.current=null,(0,_placement.claimAnchoredSurface)(()=>C.current());D.current&&(D.current=!1,H.current=!0,N(null),T(null),S||"ios"===_reactNative.Platform.OS||B())},[t]);const V=(0,_react.useCallback)(e=>{if(e.disabled)return;const t=(0,_hapticUtils.resolveHaptic)(m,"selection");t&&(0,_hapticUtils.triggerHaptic)(t),e.key!==BACK_KEY?e.submenu?N(e):(L.current=e.onPress??null,C.current()):N(null)},[m]),F=(0,_react.useMemo)(()=>({width:w.width,height:w.height,insets:g}),[w.width,w.height,g]),K=(0,_react.useMemo)(()=>{if(!s||!E)return null;const e=s.x+s.width/2>F.width/2?"end":"start";return(0,_placement.computePlacement)(s,E,F,o,{align:e})},[s,E,F,o]);let W=F.height-g.top-g.bottom-2*_placement.PLACEMENT_MARGIN;if(s&&K){const e=(0,_placement.placementRoom)(s,F);W="top"===K.placement?e.above:e.below}const z=Math.min(280,F.width-g.left-g.right-2*_placement.PLACEMENT_MARGIN),$=t&&null!==K,G=(0,_react.useRef)((0,_index.createAnimatedValue)(0)).current,U=(0,_react.useRef)((0,_index.createAnimatedValue)(1)).current;(0,_react.useEffect)(()=>{if(!$)return(0,_index.setNativeValue)(G,0),void(0,_index.setNativeValue)(U,1);const e=[_reactNative.Animated.timing(G,{toValue:1,duration:f.motion.duration.fast,easing:_reactNative.Easing.bezier(...f.motion.easing.decelerate),useNativeDriver:!0})];c&&!A&&e.push(_reactNative.Animated.spring(U,{toValue:1.02,damping:f.motion.spring.snappy.damping,stiffness:f.motion.spring.snappy.stiffness,mass:f.motion.spring.snappy.mass,useNativeDriver:!0}));const t=_reactNative.Animated.parallel(e);return t.start(),()=>t.stop()},[$,c,A,G,U,f.motion]);const Y=(0,_react.useCallback)(e=>{const{width:t,height:s}=e.nativeEvent.layout;T(e=>e&&e.width===t&&e.height===s?e:{width:t,height:s})},[]),X=c&&"top"===K?.placement,Z=M?.submenu?[M.submenu]:I,J=X?[...Z].reverse().map(e=>[...e].reverse()):Z,Q=[];if(M)Q.push({key:BACK_KEY,label:M.label});else for(const e of k)Q.push({key:`${TOP_PREFIX}${e.key}`,label:e.label,item:e});for(const e of J)for(const t of e)Q.push({key:t.key,label:t.label,item:t});const ee=Q[0]?.key;(0,_react.useEffect)(()=>{if(!$||S||!ee)return;const e=setTimeout(()=>(0,_focusHost.focusHost)(P.current.get(ee)),_focusHost.FOCUS_DELAY_MS);return()=>clearTimeout(e)},[$,S,ee]);const setItemRef=e=>t=>{t?P.current.set(e,t):P.current.delete(e)},te=(0,_webOnly.webOnly)({onKeyDown:e=>{const t=e.key??e.nativeEvent?.key??"",s=Q.length,i=Q.findIndex(e=>e.key===q.current);let n=-1;if("ArrowDown"===t)n=(i+1)%s;else if("ArrowUp"===t)n=i<=0?s-1:i-1;else if("Home"===t)n=0;else if("End"===t)n=s-1;else{if("ArrowLeft"===t&&M)return e.preventDefault?.(),void N(null);if("ArrowRight"===t&&Q[i]?.item?.submenu)return e.preventDefault?.(),void V(Q[i].item);if(1===t.length&&""!==t.trim()){const e=t.toLowerCase();for(let t=1;t<=s;t+=1){const r=(i+t)%s;if(Q[r].label.toLowerCase().startsWith(e)){n=r;break}}}}n>=0&&(e.preventDefault?.(),(e=>{const t=Q[e];t&&(0,_focusHost.focusHost)(P.current.get(t.key))})(n))}});if(S){const e=M?.submenu?[{key:BACK_KEY,label:b,icon:"chevron-left"},...M.submenu]:[...k,...I.flat()],s=new Set(e.filter(e=>e.checked).map(e=>e.key));return(0,_jsxRuntime.jsx)(_index3.OptionSheet,{open:t,onClose:d,onAfterClose:B,title:M?.label??n,options:e,labelOf:e=>e.label,getValue:e=>e.key,disabledOf:e=>Boolean(e.disabled),destructiveOf:e=>Boolean(e.destructive),descriptionOf:e=>e.description,iconOf:e=>{const t=e;return(0,_slotIcon.renderSlotIcon)(t.icon,{color:t.destructive?f.colors.toneText.error:f.colors.text.secondary,size:20,disabled:Boolean(t.disabled)})},isSelected:e=>s.has(String(e)),onSelect:e=>V(e),accessibilityLabel:p??n,testID:h?`${h}-sheet`:void 0})}const inkFor=e=>e.disabled?f.colors.text.disabled:e.destructive?f.colors.toneText.error:f.colors.text.primary,se=M?(0,_jsxRuntime.jsxs)(_jsxRuntime.Fragment,{children:[(0,_jsxRuntime.jsxs)(_reactNative.Pressable,{ref:setItemRef(BACK_KEY),onPress:()=>N(null),onFocus:()=>{q.current=BACK_KEY},accessibilityRole:"menuitem",accessibilityLabel:`${b}, ${M.label}`,android_ripple:{color:f.colors.surface.pressed,borderless:!1},style:({pressed:e})=>[v.row,e?v.pressed:null],children:[(0,_jsxRuntime.jsx)(_reactNative.View,{style:v.icon,children:(0,_jsxRuntime.jsx)(_AppIcon.AppIcon,{name:"chevron-left",size:20,color:f.colors.text.secondary})}),(0,_jsxRuntime.jsx)(_index4.Text,{variant:"body",weight:"semibold",numberOfLines:1,style:v.labels,children:M.label})]}),(0,_jsxRuntime.jsx)(_index2.Divider,{spacing:"none"})]}):(0,_jsxRuntime.jsxs)(_jsxRuntime.Fragment,{children:[n?(0,_jsxRuntime.jsx)(_index4.Text,{variant:"caption",color:"secondary",accessibilityRole:"header",numberOfLines:2,style:v.title,children:n}):null,k.length>0?(0,_jsxRuntime.jsxs)(_jsxRuntime.Fragment,{children:[(0,_jsxRuntime.jsx)(_reactNative.View,{style:v.topRow,children:k.map(e=>{const t=`${TOP_PREFIX}${e.key}`,s=Boolean(e.disabled),i=inkFor(e);return(0,_jsxRuntime.jsxs)(_reactNative.Pressable,{ref:setItemRef(t),onPress:()=>V(e),onFocus:()=>{q.current=t},disabled:s,accessibilityRole:"menuitem",accessibilityLabel:e.accessibilityLabel??e.label,accessibilityState:{disabled:s},"aria-disabled":s,testID:e.testID,style:({pressed:e})=>[v.topAction,e?v.pressed:null],children:[(0,_slotIcon.renderSlotIcon)(e.icon,{color:i,size:20,disabled:s}),(0,_jsxRuntime.jsx)(_index4.Text,{variant:"caption",color:i,numberOfLines:1,children:e.label})]},t)})}),(0,_jsxRuntime.jsx)(_index2.Divider,{spacing:"none"})]}):null]});return(0,_jsxRuntime.jsx)(_reactNative.Modal,{visible:t,transparent:!0,statusBarTranslucent:!0,presentationStyle:"overFullScreen",animationType:"none",onRequestClose:d,onDismiss:B,children:(0,_jsxRuntime.jsxs)(_ModalSafeArea.ModalSafeArea,{onInsets:R,children:[(0,_jsxRuntime.jsx)(_reactNative.Pressable,{style:[_reactNative.StyleSheet.absoluteFill,c?v.scrim:null],onPress:d,accessibilityRole:"button",accessibilityLabel:x,testID:h?`${h}-scrim`:void 0}),c&&u&&s?(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{pointerEvents:"none",accessibilityElementsHidden:!0,importantForAccessibility:"no-hide-descendants",style:[v.preview,{left:s.x,top:s.y,width:s.width,height:s.height,transform:[{scale:U}]}],children:u}):null,(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{accessibilityRole:"menu",accessibilityLabel:M?.label??p??n,onLayout:Y,testID:h?`${h}-menu`:void 0,...te,style:[v.anchored,{left:K?.x??0,top:K?.y??0,maxWidth:z,opacity:$?G:0}],children:(0,_jsxRuntime.jsx)(_reactNative.View,{style:v.surface,children:(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[v.clip,{maxHeight:W}],children:[se,(0,_jsxRuntime.jsx)(_reactNative.ScrollView,{style:v.scroll,bounces:!1,keyboardShouldPersistTaps:"handled",children:J.map((e,t)=>{const s=e.some(e=>null!=e.icon);return(0,_jsxRuntime.jsxs)(_reactNative.View,{children:[t>0?(0,_jsxRuntime.jsx)(_index2.Divider,{spacing:"none"}):null,e.map(e=>((e,t)=>{const s=Boolean(e.disabled),i=inkFor(e);return(0,_jsxRuntime.jsxs)(_reactNative.Pressable,{ref:setItemRef(e.key),onPress:()=>V(e),onFocus:()=>{q.current=e.key},disabled:s,accessibilityRole:"menuitem",accessibilityLabel:e.accessibilityLabel??e.label,accessibilityState:{disabled:s,checked:e.checked},"aria-disabled":s,"aria-checked":e.checked,...void 0!==e.checked?WEB_CHECKABLE_ROLE:null,android_ripple:{color:f.colors.surface.pressed,borderless:!1},testID:e.testID,style:({pressed:e})=>[v.row,e?v.pressed:null],children:[t?(0,_jsxRuntime.jsx)(_reactNative.View,{style:v.icon,children:(0,_slotIcon.renderSlotIcon)(e.icon,{color:i,size:20,disabled:s})}):null,(0,_jsxRuntime.jsxs)(_reactNative.View,{style:v.labels,children:[(0,_jsxRuntime.jsx)(_index4.Text,{variant:"body",color:i,numberOfLines:2,children:e.label}),e.description?(0,_jsxRuntime.jsx)(_index4.Text,{variant:"caption",color:"secondary",numberOfLines:2,children:e.description}):null]}),e.detail?(0,_jsxRuntime.jsx)(_index4.Text,{variant:"caption",color:"tertiary",children:e.detail}):null,e.checked?(0,_jsxRuntime.jsx)(_AppIcon.AppIcon,{name:"check",size:20,color:f.colors.primary}):null,e.submenu?(0,_jsxRuntime.jsx)(_AppIcon.AppIcon,{name:"chevron-right",size:20,color:f.colors.text.tertiary}):null]},e.key)})(e,s))]},e[0].key)})})]})})}),(0,_jsxRuntime.jsx)(_ToastProvider.ToastHost,{})]})})};exports.MenuSurface=MenuSurface;const buildStyles=e=>_reactNative.StyleSheet.create({scrim:{backgroundColor:e.colors.background.overlay},preview:{position:"absolute"},anchored:{position:"absolute",minWidth:180},surface:{backgroundColor:e.colors.background.elevated,borderRadius:e.radius.md,..._corners.smoothCorners,...e.shadows.lg},clip:{borderRadius:e.radius.md,..._corners.smoothCorners,overflow:"hidden"},scroll:{flexGrow:0,flexShrink:1},title:{paddingHorizontal:e.spacing.md,paddingTop:e.spacing.sm,paddingBottom:e.spacing.xs},row:{flexDirection:"row",alignItems:"center",gap:e.spacing.md,minHeight:48,paddingHorizontal:e.spacing.md,paddingVertical:e.spacing.sm},pressed:{backgroundColor:e.colors.surface.pressed},icon:{width:20,alignItems:"center"},labels:{flexGrow:1,flexShrink:1},topRow:{flexDirection:"row",padding:e.spacing.xs,gap:e.spacing.xs},topAction:{flexGrow:1,flexBasis:0,alignItems:"center",justifyContent:"center",gap:e.spacing.xs,minHeight:64,borderRadius:e.radius.sm,..._corners.smoothCorners}});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=exports.Modal=exports.MODAL_DISMISS_GRACE_MS=void 0;var _react=require("react"),_reactNative=require("react-native"),
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=exports.Modal=exports.MODAL_DISMISS_GRACE_MS=void 0;var _react=require("react"),_reactNative=require("react-native"),_index=require("../../theme/index.js"),_corners=require("../../utils/corners.js"),_hapticUtils=require("../../utils/hapticUtils.js"),_squircle=require("../../utils/squircle.js"),_ModalSafeArea=require("../ModalSafeArea/ModalSafeArea.js"),_SquircleFill=require("../SquircleFill/SquircleFill.js"),_ToastProvider=require("../Toast/ToastProvider.js"),_jsxRuntime=require("react/jsx-runtime");const MODAL_DISMISS_GRACE_MS=exports.MODAL_DISMISS_GRACE_MS=300,Modal=exports.Modal=(0,_react.forwardRef)((e,t)=>{const{visible:r,onRequestClose:a,presentation:i="centered",backdropOpacity:s,backdropPressClose:n=!0,animationDuration:o,accessibilityLabel:l,hardwareBackPress:c=!0,children:u,contentStyle:d,backdropStyle:m,restoreFocusRef:_,onDismissed:f,haptic:p,testID:g}=e,b=(0,_index.useTheme)(),[v,S]=(0,_ModalSafeArea.useModalInsets)(),x=o??b.motion.duration.normal,h=_reactNative.Dimensions.get("window").height,y=b.components.modal,M=y?.scaleStartValue??.9,A=(0,_react.useRef)((0,_index.createAnimatedValue)(M)).current,N=(0,_react.useRef)((0,_index.createAnimatedValue)(0)).current,R=(0,_react.useRef)((0,_index.createAnimatedValue)(h)).current,j=(0,_react.useRef)(null),C=(0,_react.useRef)(!1),[q,D]=(0,_react.useState)(r),T=(0,_react.useMemo)(()=>buildStyles(b),[b]),k=(0,_react.useMemo)(()=>{const e=b.colors.background.overlay;if("number"!=typeof s)return e;const t=e.match(/^rgba?\(([^)]+)\)$/);if(!t)return e;const[r,a,i]=t[1].split(",").map(e=>e.trim());return`rgba(${r}, ${a}, ${i}, ${s})`},[b.colors.background.overlay,s]);(0,_react.useEffect)(()=>{r&&D(!0)},[r]),(0,_react.useEffect)(()=>{const e=[];if(r&&q)if("bottom"===i){const t=_reactNative.Animated.spring(R,{toValue:0,damping:b.motion.spring.gentle.damping,stiffness:b.motion.spring.gentle.stiffness,mass:b.motion.spring.gentle.mass,useNativeDriver:!0});t.start(),e.push(t)}else{const t=_reactNative.Animated.parallel([_reactNative.Animated.spring(A,{toValue:1,damping:b.motion.spring.gentle.damping,stiffness:b.motion.spring.gentle.stiffness,mass:b.motion.spring.gentle.mass,useNativeDriver:!0}),_reactNative.Animated.timing(N,{toValue:1,duration:x,useNativeDriver:!0})]);t.start(),e.push(t)}else if(q){const t=b.motion.duration.fast,r=_reactNative.Easing.bezier(...b.motion.easing.accelerate),a=_reactNative.Animated.parallel(["bottom"===i?_reactNative.Animated.timing(R,{toValue:h,duration:t,easing:r,useNativeDriver:!0}):_reactNative.Animated.parallel([_reactNative.Animated.timing(A,{toValue:M,duration:t,easing:r,useNativeDriver:!0}),_reactNative.Animated.timing(N,{toValue:0,duration:t,easing:r,useNativeDriver:!0})])]);a.start(({finished:e})=>{e&&D(!1)}),e.push(a)}return()=>e.forEach(e=>e.stop())},[r,q,i,x,A,N,R,h,b.motion.spring.gentle.damping,b.motion.spring.gentle.stiffness,b.motion.spring.gentle.mass,b.motion.duration.fast,b.motion.easing.accelerate,M]),(0,_react.useEffect)(()=>{if("web"===_reactNative.Platform.OS)return;let e,t;return r?(e=setTimeout(()=>{j.current&&_reactNative.AccessibilityInfo.sendAccessibilityEvent(j.current,"focus")},150),C.current=!0):C.current&&(C.current=!1,_&&_.current&&(t=setTimeout(()=>{const e=_.current;e&&_reactNative.AccessibilityInfo.sendAccessibilityEvent(e,"focus")},x))),()=>{e&&clearTimeout(e),t&&clearTimeout(t)}},[r,x,_]);const w=(0,_react.useRef)(!1);(0,_react.useEffect)(()=>{if(r)return void(w.current=!0);if(!w.current)return;if(w.current=!1,!f)return;const e=setTimeout(f,MODAL_DISMISS_GRACE_MS);return()=>clearTimeout(e)},[r,f]);const I=(0,_react.useCallback)(()=>{if(!n)return;const e=(0,_hapticUtils.resolveHaptic)(p,"selection");e&&(0,_hapticUtils.triggerHaptic)(e),a()},[n,a,p]),V=(0,_react.useCallback)(()=>{c&&a()},[c,a]),E=(0,_SquircleFill.useSquircle)("bottom"!==i&&"fullScreen"!==i,b.radius.xl),z=(0,_react.useMemo)(()=>"fullScreen"===i?[T.fullScreenContent,{backgroundColor:b.colors.background.elevated}]:"bottom"===i?[T.bottomContent,{backgroundColor:b.colors.background.elevated,borderTopLeftRadius:b.radius.xl,borderTopRightRadius:b.radius.xl,..._corners.smoothCorners,paddingTop:b.spacing.lg,paddingHorizontal:b.spacing.lg,paddingBottom:b.spacing.lg+v.bottom},b.shadows.xl]:[T.centeredContent,{backgroundColor:b.colors.background.elevated,borderRadius:E.active&&E.size?(0,_squircle.squircleHostRadius)(E.size.width,E.size.height,b.radius.xl):b.radius.xl,..._corners.smoothCorners,padding:b.spacing.xl},b.shadows.xl],[i,b,T,v.bottom,E.active,E.size]),L=(0,_react.useMemo)(()=>"bottom"===i?T.bottomWrapper:"fullScreen"===i?T.fullScreenWrapper:T.centeredWrapper,[i,T]),F=(0,_react.useMemo)(()=>"bottom"===i?{transform:[{translateY:R}]}:"fullScreen"===i?{opacity:N}:{opacity:N,transform:[{scale:A}]},[i,A,N,R]);return(0,_jsxRuntime.jsx)(_reactNative.Modal,{visible:q,transparent:!0,statusBarTranslucent:!0,navigationBarTranslucent:!0,animationType:"none",onRequestClose:V,testID:g,children:(0,_jsxRuntime.jsx)(_reactNative.View,{ref:e=>{j.current=e,"function"==typeof t?t(e):t&&(t.current=e)},style:T.root,accessible:!1,accessibilityViewIsModal:!0,accessibilityRole:"alert",accessibilityLabel:l,children:(0,_jsxRuntime.jsxs)(_ModalSafeArea.ModalSafeArea,{onInsets:S,children:[(0,_jsxRuntime.jsxs)(_reactNative.View,{collapsable:!1,style:[_reactNative.StyleSheet.absoluteFill,L,{backgroundColor:k},m],children:[(0,_jsxRuntime.jsx)(_reactNative.Pressable,{style:_reactNative.StyleSheet.absoluteFill,onPress:I,accessibilityRole:"button",accessibilityLabel:"Close modal",disabled:!n}),(0,_jsxRuntime.jsxs)(_reactNative.Animated.View,{style:[z,F,d],onLayout:E.onLayout,pointerEvents:"auto",children:[E.active&&E.size?(0,_jsxRuntime.jsx)(_SquircleFill.SquircleFill,{width:E.size.width,height:E.size.height,radius:b.radius.xl,fill:b.colors.background.elevated}):null,u]})]}),(0,_jsxRuntime.jsx)(_ToastProvider.ToastHost,{})]})})})});Modal.displayName="Modal";const buildStyles=e=>_reactNative.StyleSheet.create({root:{flex:1},centeredWrapper:{flex:1,alignItems:"center",justifyContent:"center",paddingHorizontal:16},centeredContent:{maxWidth:"90%",width:"90%"},bottomWrapper:{flex:1,justifyContent:"flex-end"},bottomContent:{width:"100%"},fullScreenWrapper:{flex:1},fullScreenContent:{flex:1}});var _default=exports.default=Modal;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.useModalInsets=exports.ModalSafeArea=exports.InsetsProbe=void 0;var _react=require("react"),_reactNative=require("react-native"),_reactNativeSafeAreaContext=require("react-native-safe-area-context"),_jsxRuntime=require("react/jsx-runtime");const useModalInsets=()=>{const{top:e,bottom:t}=(0,_reactNativeSafeAreaContext.useSafeAreaInsets)();return(0,_react.useState)({top:e,bottom:t})};exports.useModalInsets=useModalInsets;const InsetsProbe=({onChange:e})=>{const{top:t,bottom:s}=(0,_reactNativeSafeAreaContext.useSafeAreaInsets)();return(0,_react.useEffect)(()=>{e(e=>e.top===t&&e.bottom===s?e:{top:t,bottom:s})},[t,s,e]),null};exports.InsetsProbe=InsetsProbe;const ModalSafeArea=({onInsets:e,children:t})=>(0,_jsxRuntime.jsxs)(_reactNativeSafeAreaContext.SafeAreaProvider,{style:styles.fill,children:[(0,_jsxRuntime.jsx)(InsetsProbe,{onChange:e}),t]});exports.ModalSafeArea=ModalSafeArea;const styles=_reactNative.StyleSheet.create({fill:{flex:1}});
|