@webority/mobile-ui 0.11.1 → 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/Avatar/Avatar.js +1 -1
- 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/Chip/Chip.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/EmptyState/EmptyState.js +1 -1
- package/lib/commonjs/components/FileViewer/FileViewer.js +1 -1
- package/lib/commonjs/components/FileViewer/FileViewerPage.js +1 -0
- package/lib/commonjs/components/FileViewer/useFileViewerZoom.js +1 -0
- package/lib/commonjs/components/FilterChipRow/FilterChipRow.js +1 -0
- package/lib/commonjs/components/FilterChipRow/index.js +1 -0
- package/lib/commonjs/components/FloatingActionButton/FloatingActionButton.js +1 -1
- package/lib/commonjs/components/Input/Input.js +1 -1
- package/lib/commonjs/components/KeyboardAwareScrollView/KeyboardAwareScrollView.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/ProgressBar/ProgressBar.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/SquircleView/SquircleView.js +1 -0
- package/lib/commonjs/components/SquircleView/index.js +1 -0
- package/lib/commonjs/components/TimePicker/TimePicker.js +1 -1
- package/lib/commonjs/components/Tooltip/Tooltip.js +1 -1
- package/lib/commonjs/components/index.js +1 -1
- package/lib/commonjs/form/useForm.js +1 -1
- package/lib/commonjs/hooks/useDragToDismiss.js +1 -1
- package/lib/commonjs/theme/tokens.js +1 -1
- package/lib/module/components/Avatar/Avatar.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/Chip/Chip.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/EmptyState/EmptyState.js +1 -1
- package/lib/module/components/FileViewer/FileViewer.js +1 -1
- package/lib/module/components/FileViewer/FileViewerPage.js +1 -0
- package/lib/module/components/FileViewer/useFileViewerZoom.js +1 -0
- package/lib/module/components/FilterChipRow/FilterChipRow.js +1 -0
- package/lib/module/components/FilterChipRow/index.js +1 -0
- package/lib/module/components/FloatingActionButton/FloatingActionButton.js +1 -1
- package/lib/module/components/Input/Input.js +1 -1
- package/lib/module/components/KeyboardAwareScrollView/KeyboardAwareScrollView.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/ProgressBar/ProgressBar.js +1 -1
- package/lib/module/components/SearchBar/SearchBar.js +1 -1
- package/lib/module/components/SignaturePad/SignaturePad.js +1 -1
- package/lib/module/components/Slider/Slider.js +1 -1
- package/lib/module/components/SquircleView/SquircleView.js +1 -0
- package/lib/module/components/SquircleView/index.js +1 -0
- package/lib/module/components/TimePicker/TimePicker.js +1 -1
- package/lib/module/components/Tooltip/Tooltip.js +1 -1
- package/lib/module/components/index.js +1 -1
- package/lib/module/form/useForm.js +1 -1
- package/lib/module/hooks/useDragToDismiss.js +1 -1
- package/lib/module/theme/tokens.js +1 -1
- package/lib/typescript/commonjs/components/Avatar/Avatar.d.ts +25 -1
- package/lib/typescript/commonjs/components/Chip/Chip.d.ts +15 -2
- package/lib/typescript/commonjs/components/FileViewer/FileViewer.d.ts +21 -10
- package/lib/typescript/commonjs/components/FileViewer/FileViewerPage.d.ts +12 -0
- package/lib/typescript/commonjs/components/FileViewer/useFileViewerZoom.d.ts +41 -0
- package/lib/typescript/commonjs/components/FilterChipRow/FilterChipRow.d.ts +55 -0
- package/lib/typescript/commonjs/components/FilterChipRow/index.d.ts +3 -0
- package/lib/typescript/commonjs/components/FloatingActionButton/FloatingActionButton.d.ts +8 -0
- package/lib/typescript/commonjs/components/ModalSafeArea/ModalSafeArea.d.ts +26 -0
- package/lib/typescript/commonjs/components/SignaturePad/SignaturePad.d.ts +8 -2
- package/lib/typescript/commonjs/components/SquircleView/SquircleView.d.ts +22 -0
- package/lib/typescript/commonjs/components/SquircleView/index.d.ts +3 -0
- package/lib/typescript/commonjs/components/index.d.ts +4 -0
- package/lib/typescript/commonjs/theme/types.d.ts +4 -0
- package/lib/typescript/module/components/Avatar/Avatar.d.ts +25 -1
- package/lib/typescript/module/components/Chip/Chip.d.ts +15 -2
- package/lib/typescript/module/components/FileViewer/FileViewer.d.ts +21 -10
- package/lib/typescript/module/components/FileViewer/FileViewerPage.d.ts +12 -0
- package/lib/typescript/module/components/FileViewer/useFileViewerZoom.d.ts +41 -0
- package/lib/typescript/module/components/FilterChipRow/FilterChipRow.d.ts +55 -0
- package/lib/typescript/module/components/FilterChipRow/index.d.ts +3 -0
- package/lib/typescript/module/components/FloatingActionButton/FloatingActionButton.d.ts +8 -0
- package/lib/typescript/module/components/ModalSafeArea/ModalSafeArea.d.ts +26 -0
- package/lib/typescript/module/components/SignaturePad/SignaturePad.d.ts +8 -2
- package/lib/typescript/module/components/SquircleView/SquircleView.d.ts +22 -0
- package/lib/typescript/module/components/SquircleView/index.d.ts +3 -0
- package/lib/typescript/module/components/index.d.ts +4 -0
- package/lib/typescript/module/theme/types.d.ts +4 -0
- package/package.json +3 -3
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=exports.avatarToneColors=exports.AvatarGroup=exports.Avatar=void 0;var _expoImage=require("expo-image"),_react=require("react"),_reactNative=require("react-native"),_index=require("../../theme/index.js"),_color=require("../../utils/color.js"),_corners=require("../../utils/corners.js"),_index2=require("../AppIcon/index.js"),_index3=require("../Skeleton/index.js"),_jsxRuntime=require("react/jsx-runtime");const SOFT_FILL_OPACITY=.14,avatarToneColors=(e,
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=exports.avatarToneColors=exports.AvatarGroup=exports.Avatar=void 0;var _expoImage=require("expo-image"),_react=require("react"),_reactNative=require("react-native"),_index=require("../../theme/index.js"),_color=require("../../utils/color.js"),_corners=require("../../utils/corners.js"),_hapticUtils=require("../../utils/hapticUtils.js"),_index2=require("../AppIcon/index.js"),_index3=require("../Skeleton/index.js"),_jsxRuntime=require("react/jsx-runtime");const SOFT_FILL_OPACITY=.14,MIN_TOUCH_TARGET=44,PRESSED_OPACITY=.7,INITIALS_MAX_FONT_SCALE=1.2,avatarToneColors=(e,t)=>{const soft=(e,t)=>(0,_color.tintOf)(e,.14,t);switch(t){case"primary":return{background:soft(e.colors.primary,e.colors.primaryMuted),color:e.colors.toneText.primary};case"secondary":return{background:e.colors.secondary,color:e.colors.onSecondary};case"success":return{background:soft(e.colors.success,e.colors.background.secondary),color:e.colors.toneText.success};case"warning":return{background:soft(e.colors.warning,e.colors.background.secondary),color:e.colors.toneText.warning};case"error":return{background:soft(e.colors.error,e.colors.background.secondary),color:e.colors.toneText.error};case"info":return{background:soft(e.colors.info,e.colors.background.secondary),color:e.colors.toneText.info};default:return{background:e.colors.background.tertiary,color:e.colors.text.primary}}};exports.avatarToneColors=avatarToneColors;const sizeMap={xs:24,sm:32,md:48,lg:64,xl:80},resolveSize=e=>"number"==typeof e?e:sizeMap[e],resolveRadius=(e,t)=>{switch(e){case"circle":return t/2;case"rounded":return Math.max(6,Math.round(.22*t));default:return 0}},initialsFromName=e=>{if(!e)return"";const t=e.trim().split(/\s+/u).filter(Boolean);return 0===t.length?"":1===t.length?t[0].charAt(0).toUpperCase():(t[0].charAt(0)+t[1].charAt(0)).toUpperCase()},hashColor=(e,t)=>{if(!e)return t[0];let r=0;for(let t=0;t<e.length;t+=1)r=(r<<5)-r+e.charCodeAt(t),r|=0;return t[Math.abs(r)%t.length]},RING_WIDTH=1.5,isRingStatus=e=>"verified"===e||"pending"===e,statusColor=(e,t)=>{switch(t){case"online":case"verified":return e.colors.success;case"busy":return e.colors.error;case"away":case"pending":return e.colors.warning;default:return e.colors.text.tertiary}},Avatar=exports.Avatar=(0,_react.forwardRef)((e,t)=>{const{source:r,ImageComponent:o,name:s,size:a="md",shape:i="circle",status:n=null,statusPosition:c="bottomRight",tone:l,backgroundColor:u,color:d,fontSize:h,loading:m=!1,accessibilityLabel:g,onPress:p,onLongPress:b,haptic:v,hitSlop:_,style:y,textStyle:x,testID:f}=e,R=(0,_index.useTheme)(),j=R.components.avatar,[C,A]=(0,_react.useState)(!1),S=(0,_react.useMemo)(()=>resolveSize(a),[a]),I=(0,_react.useMemo)(()=>resolveRadius(i,S),[i,S]),M=j?.borderWidth??0,w=j?.borderColor??R.colors.border.primary,T=j?.statusBorderWidth??2,k=j?.statusBorderColor??R.colors.background.elevated,N=(0,_react.useMemo)(()=>initialsFromName(s),[s]),G=(0,_react.useMemo)(()=>l?avatarToneColors(R,l):null,[R,l]),W=(0,_react.useMemo)(()=>u||(G?.background??hashColor(s??"",R.colors.avatarPalette)),[u,G,s,R.colors.avatarPalette]),z=d??G?.color??R.colors.onPrimary,E=!!r&&!C,L=j?.fontSizeRatio??.4,P=h??j?.fontSize??Math.max(10,Math.round(S*L)),F=Math.max(8,Math.round(.25*S)),D=isRingStatus(n),O=j?.ringWidth??1.5,V=S-2*(D?O+(j?.ringGap??O):0),$=D?resolveRadius(i,V):I,q=D?statusColor(R,n):"transparent",U=Math.max(12,Math.round(.32*S)),B=Math.max(10,U-4),H=E?R.colors.background.tertiary:W,Y=f??"avatar",X=s?`${s}'s avatar`:"Avatar",J="verified"===n?", verified":"pending"===n?", pending verification":"",K=g??`${X}${J}`,Q="function"==typeof p||"function"==typeof b,Z=g??`${s||X}${J}`,ee=Math.max(0,Math.ceil((44-S)/2)),te=[styles.root,{width:S,height:S,borderRadius:I,..._corners.smoothCorners,borderWidth:D?0:M,borderColor:w,backgroundColor:D?"transparent":H},y],re=(0,_jsxRuntime.jsxs)(_jsxRuntime.Fragment,{children:[D?(0,_jsxRuntime.jsx)(_reactNative.View,{style:[styles.ring,{borderRadius:I,..._corners.smoothCorners,borderWidth:O,borderColor:q}],accessible:!1,pointerEvents:"none",testID:`${Y}-ring`}):null,(0,_jsxRuntime.jsx)(_reactNative.View,{style:[styles.picture,{width:V,height:V,borderRadius:$,..._corners.smoothCorners,borderWidth:D?M:0,borderColor:w,backgroundColor:D?H:"transparent"}],children:E?(()=>{const e={width:V,height:V,borderRadius:$,..._corners.smoothCorners},onError=()=>A(!0);return o?(0,_jsxRuntime.jsx)(o,{source:r,onError:onError,style:e,contentFit:"cover",resizeMode:"cover",accessibilityIgnoresInvertColors:!0}):(0,_jsxRuntime.jsx)(_expoImage.Image,{source:r,onError:onError,style:e,contentFit:"cover",accessibilityIgnoresInvertColors:!0})})():(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[styles.initials,{color:z,fontSize:P,fontWeight:R.typography.fontWeight[j?.fontWeight??"semibold"]},x],numberOfLines:1,maxFontSizeMultiplier:1.2,children:N??" "})}),"verified"===n?(0,_jsxRuntime.jsx)(_reactNative.View,{style:[styles.status,"topRight"===c?styles.badgeTopRight:styles.badgeBottomRight,{width:U,height:U,borderRadius:U/2,..._corners.smoothCorners,backgroundColor:k}],accessible:!1,pointerEvents:"none",testID:`${Y}-badge`,children:(0,_jsxRuntime.jsx)(_index2.AppIcon,{name:"verify",variant:"bold",size:B,color:q})}):null,n&&!D?(0,_jsxRuntime.jsx)(_reactNative.View,{style:[styles.status,"topRight"===c?styles.statusTopRight:styles.statusBottomRight,{width:F,height:F,borderRadius:F/2,..._corners.smoothCorners,backgroundColor:statusColor(R,n),borderWidth:T,borderColor:k}],accessible:!1,pointerEvents:"none"}):null]}),oe=Q?(0,_jsxRuntime.jsx)(_reactNative.Pressable,{ref:t,onPress:p?e=>{const t=(0,_hapticUtils.resolveHaptic)(v,"selection");t&&(0,_hapticUtils.triggerHaptic)(t),p?.(e)}:void 0,onLongPress:b?e=>{const t=(0,_hapticUtils.resolveHaptic)(v,"longPress");t&&(0,_hapticUtils.triggerHaptic)(t),b?.(e)}:void 0,hitSlop:_??ee,accessibilityRole:"button",accessibilityLabel:Z,testID:f,style:({pressed:e})=>[te,e?styles.pressed:null],children:re}):(0,_jsxRuntime.jsx)(_reactNative.View,{ref:t,style:te,accessible:!0,accessibilityRole:"image",accessibilityLabel:K,testID:f,children:re});return m?(0,_jsxRuntime.jsx)(AvatarSkeleton,{...e}):oe});Avatar.displayName="Avatar";const AvatarSkeleton=({size:e="md",shape:t="circle",style:r})=>{const o=resolveSize(e),s="circle"===t?"circle":"rounded"===t?"rounded":"rect";return(0,_jsxRuntime.jsx)(_index3.Skeleton,{shape:s,width:o,height:o,style:r})};AvatarSkeleton.displayName="AvatarSkeleton",Avatar.Skeleton=AvatarSkeleton;const styles=_reactNative.StyleSheet.create({root:{alignItems:"center",justifyContent:"center",overflow:"visible",position:"relative"},pressed:{opacity:.7},initials:{textAlign:"center"},ring:{position:"absolute",top:0,right:0,bottom:0,left:0},picture:{alignItems:"center",justifyContent:"center",overflow:"hidden"},status:{position:"absolute"},badgeTopRight:{top:-2,right:-2,alignItems:"center",justifyContent:"center"},badgeBottomRight:{bottom:-2,right:-2,alignItems:"center",justifyContent:"center"},statusTopRight:{top:0,right:0},statusBottomRight:{bottom:0,right:0}}),SPACING_OFFSET={tight:-16,normal:-12,loose:-8},STAGGER_MS=50,ENTRANCE_DURATION_MS=220,AvatarGroupItem=({delay:e,marginLeft:t,borderColor:r,borderWidth:o,children:s})=>{const a=(0,_react.useRef)((0,_index.createAnimatedValue)(0)).current;return(0,_react.useEffect)(()=>{const t=_reactNative.Animated.timing(a,{toValue:1,duration:220,delay:e,easing:_reactNative.Easing.out(_reactNative.Easing.cubic),useNativeDriver:!0});return t.start(),()=>t.stop()},[e,a]),(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{style:[groupStyles.item,{marginLeft:t,borderColor:r,borderWidth:o,opacity:a}],children:s})},AvatarGroup=e=>{const{children:t,max:r=4,size:o="md",spacing:s="normal",overflowVariant:a="count",accessibilityLabel:i,style:n,testID:c}=e,l=(0,_index.useTheme)(),u=(0,_react.useMemo)(()=>_react.Children.toArray(t).filter(e=>(0,_react.isValidElement)(e)),[t]),d=u.length,h=u.slice(0,r),m=Math.max(0,d-r),g=m>0,p=SPACING_OFFSET[s],b=l.colors.background.elevated,v=i??`Group of ${d} ${1===d?"person":"people"}`,_=(0,_react.useMemo)(()=>resolveSize(o),[o]),y=Math.max(10,Math.round(.34*_));return(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[groupStyles.row,n],accessible:!0,accessibilityLabel:v,accessibilityRole:"summary",testID:c,children:[h.map((e,t)=>{const r=e.key??`avatar-${t}`,s=(0,_react.cloneElement)(e,{size:o});return(0,_jsxRuntime.jsx)(AvatarGroupItem,{delay:50*t,marginLeft:0===t?0:p,borderColor:b,borderWidth:1.5,children:s},r)}),g?(0,_jsxRuntime.jsx)(AvatarGroupItem,{delay:50*h.length,marginLeft:0===h.length?0:p,borderColor:b,borderWidth:1.5,children:(0,_jsxRuntime.jsx)(_reactNative.View,{style:[groupStyles.overflow,{width:_,height:_,borderRadius:_/2,..._corners.smoothCorners,backgroundColor:l.colors.surface.disabled}],accessible:!0,accessibilityRole:"text",accessibilityLabel:"count"===a?`${m} more`:"More avatars",children:(0,_jsxRuntime.jsx)(_reactNative.Text,{style:{color:l.colors.text.secondary,fontSize:y,fontWeight:l.typography.fontWeight.semibold},numberOfLines:1,maxFontSizeMultiplier:1.2,children:"count"===a?`+${m}`:"+"})})},"avatar-overflow"):null]})};exports.AvatarGroup=AvatarGroup;const groupStyles=_reactNative.StyleSheet.create({row:{flexDirection:"row",alignItems:"center"},item:{borderRadius:9999,..._corners.smoothCorners},overflow:{alignItems:"center",justifyContent:"center"}}),AvatarWithGroup=Avatar;AvatarWithGroup.Group=AvatarGroup;var _default=exports.default=AvatarWithGroup;
|
|
@@ -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.Chip=void 0;var _react=require("react"),_reactNative=require("react-native"),_usePressAnimation=require("../../hooks/usePressAnimation.js"),_index=require("../../theme/index.js"),_color=require("../../utils/color.js"),_corners=require("../../utils/corners.js"),_hapticUtils=require("../../utils/hapticUtils.js"),_slotIcon=require("../AppIcon/slotIcon.js"),_index2=require("../Skeleton/index.js"),_jsxRuntime=require("react/jsx-runtime");const toneFor=(e,r)=>{switch(r){case"primary":return{base:e.colors.primaryMuted,on:e.colors.primary,ink:e.colors.toneText.primary,border:e.colors.primary,selectedBg:e.colors.primaryMuted,selectedOn:e.colors.primary,selectedInk:e.colors.toneText.primary,selectedBorder:e.colors.primary};case"success":return{base:e.colors.background.tertiary,on:e.colors.success,ink:e.colors.toneText.success,border:e.colors.success,selectedBg:e.colors.primaryMuted,selectedOn:e.colors.primary,selectedInk:e.colors.toneText.primary,selectedBorder:e.colors.primary};case"warning":return{base:e.colors.background.tertiary,on:e.colors.warning,ink:e.colors.toneText.warning,border:e.colors.warning,selectedBg:e.colors.primaryMuted,selectedOn:e.colors.primary,selectedInk:e.colors.toneText.primary,selectedBorder:e.colors.primary};case"error":return{base:e.colors.background.tertiary,on:e.colors.error,ink:e.colors.toneText.error,border:e.colors.error,selectedBg:e.colors.primaryMuted,selectedOn:e.colors.primary,selectedInk:e.colors.toneText.primary,selectedBorder:e.colors.primary};case"info":return{base:e.colors.background.tertiary,on:e.colors.info,ink:e.colors.toneText.info,border:e.colors.info,selectedBg:e.colors.primaryMuted,selectedOn:e.colors.primary,selectedInk:e.colors.toneText.primary,selectedBorder:e.colors.primary};default:return{base:e.colors.background.tertiary,on:e.colors.text.primary,ink:e.colors.text.primary,border:e.colors.border.primary,selectedBg:e.colors.primaryMuted,selectedOn:e.colors.primary,selectedInk:e.colors.toneText.primary,selectedBorder:e.colors.primary}}},SOFT_FILL_OPACITY=.14,SOFT_SELECTED_FILL_OPACITY=.24,sizeMap={sm:{paddingH:10,paddingV:4,fontSize:12,minHeight:26,closeSize:16,closeFont:12,gap:6,iconSize:14},md:{paddingH:12,paddingV:6,fontSize:13,minHeight:32,closeSize:18,closeFont:13,gap:8,iconSize:16}},Chip=exports.Chip=(0,_react.forwardRef)((e,r)=>{const{label:
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=exports.Chip=void 0;var _react=require("react"),_reactNative=require("react-native"),_usePressAnimation=require("../../hooks/usePressAnimation.js"),_index=require("../../theme/index.js"),_color=require("../../utils/color.js"),_corners=require("../../utils/corners.js"),_hapticUtils=require("../../utils/hapticUtils.js"),_slotIcon=require("../AppIcon/slotIcon.js"),_index2=require("../Skeleton/index.js"),_jsxRuntime=require("react/jsx-runtime");const toneFor=(e,r)=>{switch(r){case"primary":return{base:e.colors.primaryMuted,on:e.colors.primary,ink:e.colors.toneText.primary,border:e.colors.primary,selectedBg:e.colors.primaryMuted,selectedOn:e.colors.primary,selectedInk:e.colors.toneText.primary,selectedBorder:e.colors.primary};case"success":return{base:e.colors.background.tertiary,on:e.colors.success,ink:e.colors.toneText.success,border:e.colors.success,selectedBg:e.colors.primaryMuted,selectedOn:e.colors.primary,selectedInk:e.colors.toneText.primary,selectedBorder:e.colors.primary};case"warning":return{base:e.colors.background.tertiary,on:e.colors.warning,ink:e.colors.toneText.warning,border:e.colors.warning,selectedBg:e.colors.primaryMuted,selectedOn:e.colors.primary,selectedInk:e.colors.toneText.primary,selectedBorder:e.colors.primary};case"error":return{base:e.colors.background.tertiary,on:e.colors.error,ink:e.colors.toneText.error,border:e.colors.error,selectedBg:e.colors.primaryMuted,selectedOn:e.colors.primary,selectedInk:e.colors.toneText.primary,selectedBorder:e.colors.primary};case"info":return{base:e.colors.background.tertiary,on:e.colors.info,ink:e.colors.toneText.info,border:e.colors.info,selectedBg:e.colors.primaryMuted,selectedOn:e.colors.primary,selectedInk:e.colors.toneText.primary,selectedBorder:e.colors.primary};default:return{base:e.colors.background.tertiary,on:e.colors.text.primary,ink:e.colors.text.primary,border:e.colors.border.primary,selectedBg:e.colors.primaryMuted,selectedOn:e.colors.primary,selectedInk:e.colors.toneText.primary,selectedBorder:e.colors.primary}}},SOFT_FILL_OPACITY=.14,SOFT_SELECTED_FILL_OPACITY=.24,sizeMap={sm:{paddingH:10,paddingV:4,fontSize:12,minHeight:26,closeSize:16,closeFont:12,gap:6,iconSize:14},md:{paddingH:12,paddingV:6,fontSize:13,minHeight:32,closeSize:18,closeFont:13,gap:8,iconSize:16}},hasChipCount=e=>null!=e&&""!==e,Chip=exports.Chip=(0,_react.forwardRef)((e,r)=>{const{label:t,count:i,selected:s=!1,selectionMode:o="single",onPress:l,onClose:n,leftIcon:a,iconVariant:c,variant:d="filled",tone:p="neutral",size:u="md",disabled:m=!1,loading:y=!1,accessibilityLabel:g,haptic:h,style:b,textStyle:x,containerStyle:S,countStyle:f,closeButtonStyle:_,closeIconStyle:z,testID:k}=e,j=(0,_index.useTheme)(),C=!!l&&!m,I="radio"===o,M=!!l&&(!m||I),v=hasChipCount(i),{scale:H,pressIn:R,pressOut:T}=(0,_usePressAnimation.usePressAnimation)({enabled:C}),w=(0,_react.useMemo)(()=>toneFor(j,p),[j,p]),F=j.components.chip?.[u],O={paddingH:F?.paddingHorizontal??sizeMap[u].paddingH,paddingV:F?.paddingVertical??sizeMap[u].paddingV,fontSize:F?.fontSize??sizeMap[u].fontSize,minHeight:F?.minHeight??sizeMap[u].minHeight,closeSize:F?.closeSize??sizeMap[u].closeSize,closeFont:F?.closeFontSize??sizeMap[u].closeFont,gap:F?.gap??sizeMap[u].gap,iconSize:F?.iconSize??sizeMap[u].iconSize},B=Math.max(0,Math.ceil((44-O.minHeight)/2)),L=I?{top:B,bottom:B}:void 0,P="filled"===d,N="soft"===d,V=(()=>{if(N){const e=s?w.selectedOn:w.on,r=s?.24:.14;return(0,_color.tintOf)(e,r,s?w.selectedBg:w.base)}return s?P?w.selectedBg:"transparent":P?w.base:"transparent"})(),q=N?"transparent":s?w.selectedBorder:P?"transparent":w.border,A=m?j.colors.text.disabled:s?N?j.colors.text.primary:w.selectedInk:w.ink,D=P||N?0:j.colors.border.width,handlePress=()=>{if(!C)return;const e=(0,_hapticUtils.resolveHaptic)(h,"selection");e&&(0,_hapticUtils.triggerHaptic)(e),l?.()},U=g??(v?`${t}, ${i}`:t),E=(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.row,children:[a?(0,_jsxRuntime.jsx)(_reactNative.View,{style:{marginRight:O.gap},children:(0,_slotIcon.renderSlotIcon)(a,{color:A,size:O.iconSize,disabled:m},c)}):null,(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[styles.label,{color:A,fontSize:O.fontSize,...(0,_index.fontFor)(j,"medium")},x],numberOfLines:1,children:t??" "}),v?(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[styles.count,{color:A,fontSize:Math.min(j.typography.fontSize.xs,O.fontSize),marginLeft:j.spacing.xs,...(0,_index.fontFor)(j,"normal")},f],numberOfLines:1,children:i}):null,n?(0,_jsxRuntime.jsx)(_reactNative.Pressable,{onPress:()=>{m||(!1!==h&&(0,_hapticUtils.triggerHaptic)("impactLight"),n?.())},disabled:m,accessibilityRole:"button",accessibilityLabel:`Remove ${t}`,accessibilityState:{disabled:m},"aria-disabled":m,hitSlop:6,style:({pressed:e})=>[styles.close,{width:O.closeSize,height:O.closeSize,borderRadius:O.closeSize/2,..._corners.smoothCorners,marginLeft:O.gap,backgroundColor:e?j.colors.surface.pressed:j.colors.surface.hovered},_],children:(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[{color:A,fontSize:O.closeFont,...(0,_index.fontFor)(j,"bold"),lineHeight:O.closeFont+2},z],maxFontSizeMultiplier:1,children:"×"})}):null]}),$={paddingHorizontal:O.paddingH,paddingVertical:O.paddingV,minHeight:O.minHeight,borderRadius:j.radius.full,..._corners.smoothCorners,backgroundColor:V,borderWidth:D,borderColor:q,opacity:m?.55:1};let Y;return Y=M?(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{style:{transform:[{scale:H}],alignSelf:"flex-start"},children:(0,_jsxRuntime.jsx)(_reactNative.Pressable,{ref:r,onPress:handlePress,onPressIn:R,onPressOut:T,disabled:!C,accessibilityRole:I?"radio":"multiple"===o?"checkbox":"button",accessibilityLabel:U,accessibilityState:I||"multiple"===o?{checked:s,disabled:m}:{selected:s,disabled:m},"aria-checked":I||"multiple"===o?s:void 0,"aria-selected":I||"multiple"===o?void 0:s,"aria-disabled":m,hitSlop:L,android_ripple:{color:j.colors.surface.pressed,borderless:!1},testID:k,style:({pressed:e})=>[styles.base,$,e&&"outlined"===d?{backgroundColor:j.colors.surface.pressed}:null,S,b],children:E})}):(0,_jsxRuntime.jsx)(_reactNative.View,{ref:r,style:[styles.base,$,S,b],accessible:!0,accessibilityRole:"text",accessibilityLabel:U,accessibilityState:{selected:s,disabled:m},"aria-selected":s,"aria-disabled":m,testID:k,children:E}),y?(0,_jsxRuntime.jsx)(ChipSkeleton,{...e}):Y});Chip.displayName="Chip";const ChipSkeleton=({label:e,count:r,size:t="md",leftIcon:i,onClose:s,style:o,containerStyle:l})=>{const n=sizeMap[t],a=Math.max(40,Math.min(120,7*(e??"").length)),c=n.minHeight,d=c/2,p=a+2*n.paddingH+(hasChipCount(r)?n.gap/2+7*String(r).length:0)+(void 0!==i?n.gap+14:0)+(void 0!==s?n.gap+n.closeSize:0);return(0,_jsxRuntime.jsx)(_index2.Skeleton,{width:p,height:c,radius:d,style:[{alignSelf:"flex-start"},l,o]})};ChipSkeleton.displayName="ChipSkeleton",Chip.Skeleton=ChipSkeleton;const styles=_reactNative.StyleSheet.create({base:{alignSelf:"flex-start",flexDirection:"row",alignItems:"center",justifyContent:"center"},row:{flexDirection:"row",alignItems:"center"},label:{flexShrink:1,textAlign:"center"},count:{flexShrink:0,fontVariant:["tabular-nums"]},close:{alignItems:"center",justifyContent:"center"}});var _default=exports.default=Chip;
|
|
@@ -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.EmptyState=void 0;var _react=require("react"),_reactNative=require("react-native"),_usePressAnimation=require("../../hooks/usePressAnimation.js"),_index=require("../../theme/index.js"),_corners=require("../../utils/corners.js"),_hapticUtils=require("../../utils/hapticUtils.js"),_SquircleFill=require("../SquircleFill/SquircleFill.js"),_jsxRuntime=require("react/jsx-runtime");const SIZE_FALLBACK={sm:{iconSize:48,titleFontSize:"lg",descriptionFontSize:"sm",paddingVertical:"lg"},md:{iconSize:64,titleFontSize:"xl",descriptionFontSize:"base",paddingVertical:"xl"},lg:{iconSize:80,titleFontSize:"2xl",descriptionFontSize:"base",paddingVertical:"2xl"}},sizeFor=(e,t)=>{const i={...SIZE_FALLBACK[t],...e.components.emptyState?.[t]??{}};return{iconSize:i.iconSize,titleSize:e.typography.fontSize[i.titleFontSize],descriptionSize:e.typography.fontSize[i.descriptionFontSize],paddingVertical:e.spacing[i.paddingVertical]}},ActionButton=({action:e,variant:t})=>{const i=(0,_index.useTheme)(),{scale:r,pressIn:o,pressOut:s}=(0,_usePressAnimation.usePressAnimation)({enabled:!0}),n=(0,_react.useMemo)(()=>buildActionStyles(i),[i]),a="primary"===t,l=(0,_SquircleFill.useSquircle)(!0,i.radius.md),fillFor=e=>a?i.colors.primary:e?i.colors.surface.pressed:"transparent";return(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{style:{transform:[{scale:r}]},children:(0,_jsxRuntime.jsx)(_reactNative.Pressable,{onPress:()=>{(0,_hapticUtils.triggerHaptic)("selection"),e.onPress()},onPressIn:o,onPressOut:s,accessibilityRole:"button",accessibilityLabel:e.accessibilityLabel??e.label,accessibilityHint:e.accessibilityHint,testID:e.testID,onLayout:l.onLayout,android_ripple:{color:a?i.colors.primaryHover:i.colors.surface.pressed,borderless:!1},style:({pressed:e})=>[n.button,a?n.buttonPrimary:n.buttonSecondary,!e||a||l.active?null:n.buttonSecondaryPressed,l.active?n.buttonSquircleHost:null],children:({pressed:t})=>(0,_jsxRuntime.jsxs)(_jsxRuntime.Fragment,{children:[l.active&&l.size?(0,_jsxRuntime.jsx)(_SquircleFill.SquircleFill,{width:l.size.width,height:l.size.height,radius:i.radius.md,fill:fillFor(t),stroke:a?void 0:i.colors.border.primary,strokeWidth:a?0:1,outset:a?0:1}):null,(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[n.buttonText,a?n.buttonTextPrimary:n.buttonTextSecondary],numberOfLines:1,children:e.label})]})})})},EmptyState=exports.EmptyState=(0,_react.forwardRef)((e,t)=>{const{icon:i,title:r,description:o,action:s,secondaryAction:n,size:a="md",fill:l=!1,style:c,testID:d}=e,u=(0,_index.useTheme)(),p=(0,_react.useMemo)(()=>sizeFor(u,a),[u,a]),m=(0,_react.useMemo)(()=>buildStyles(u),[u]);return(0,_jsxRuntime.jsxs)(_reactNative.View,{ref:t,accessibilityRole:"summary",testID:d,style:[m.root,{paddingVertical:p.paddingVertical},l?m.fill:null,c],children:[i?(0,_jsxRuntime.jsx)(_reactNative.View,{style:[m.iconCircle,{width:p.iconSize,height:p.iconSize,borderRadius:p.iconSize/2,..._corners.smoothCorners}],children:i}):null,(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[m.title,{fontSize:p.titleSize,...(0,_index.fontFor)(u,"semibold")}],children:r}),o?(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[m.description,{fontSize:p.descriptionSize}],children:o}):null,s||n?(0,_jsxRuntime.jsxs)(_reactNative.View,{style:m.actions,children:[s?(0,_jsxRuntime.jsx)(ActionButton,{action:s,variant:"primary"}):null,n?(0,_jsxRuntime.jsx)(ActionButton,{action:n,variant:"secondary"}):null]}):null]})});EmptyState.displayName="EmptyState";const buildStyles=e=>_reactNative.StyleSheet.create({root:{alignItems:"center",justifyContent:"center",paddingHorizontal:e.spacing.lg
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=exports.EmptyState=void 0;var _react=require("react"),_reactNative=require("react-native"),_usePressAnimation=require("../../hooks/usePressAnimation.js"),_index=require("../../theme/index.js"),_corners=require("../../utils/corners.js"),_hapticUtils=require("../../utils/hapticUtils.js"),_SquircleFill=require("../SquircleFill/SquircleFill.js"),_jsxRuntime=require("react/jsx-runtime");const SIZE_FALLBACK={sm:{iconSize:48,titleFontSize:"lg",descriptionFontSize:"sm",paddingVertical:"lg",titleGap:"md",descriptionGap:"xs"},md:{iconSize:64,titleFontSize:"xl",descriptionFontSize:"base",paddingVertical:"xl",titleGap:"md",descriptionGap:"xs"},lg:{iconSize:80,titleFontSize:"2xl",descriptionFontSize:"base",paddingVertical:"2xl",titleGap:"md",descriptionGap:"xs"}},sizeFor=(e,t)=>{const i={...SIZE_FALLBACK[t],...e.components.emptyState?.[t]??{}};return{iconSize:i.iconSize,titleSize:e.typography.fontSize[i.titleFontSize],descriptionSize:e.typography.fontSize[i.descriptionFontSize],paddingVertical:e.spacing[i.paddingVertical],titleGap:e.spacing[i.titleGap],descriptionGap:e.spacing[i.descriptionGap]}},ActionButton=({action:e,variant:t})=>{const i=(0,_index.useTheme)(),{scale:r,pressIn:o,pressOut:s}=(0,_usePressAnimation.usePressAnimation)({enabled:!0}),n=(0,_react.useMemo)(()=>buildActionStyles(i),[i]),a="primary"===t,l=(0,_SquircleFill.useSquircle)(!0,i.radius.md),fillFor=e=>a?i.colors.primary:e?i.colors.surface.pressed:"transparent";return(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{style:{transform:[{scale:r}]},children:(0,_jsxRuntime.jsx)(_reactNative.Pressable,{onPress:()=>{(0,_hapticUtils.triggerHaptic)("selection"),e.onPress()},onPressIn:o,onPressOut:s,accessibilityRole:"button",accessibilityLabel:e.accessibilityLabel??e.label,accessibilityHint:e.accessibilityHint,testID:e.testID,onLayout:l.onLayout,android_ripple:{color:a?i.colors.primaryHover:i.colors.surface.pressed,borderless:!1},style:({pressed:e})=>[n.button,a?n.buttonPrimary:n.buttonSecondary,!e||a||l.active?null:n.buttonSecondaryPressed,l.active?n.buttonSquircleHost:null],children:({pressed:t})=>(0,_jsxRuntime.jsxs)(_jsxRuntime.Fragment,{children:[l.active&&l.size?(0,_jsxRuntime.jsx)(_SquircleFill.SquircleFill,{width:l.size.width,height:l.size.height,radius:i.radius.md,fill:fillFor(t),stroke:a?void 0:i.colors.border.primary,strokeWidth:a?0:1,outset:a?0:1}):null,(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[n.buttonText,a?n.buttonTextPrimary:n.buttonTextSecondary],numberOfLines:1,children:e.label})]})})})},EmptyState=exports.EmptyState=(0,_react.forwardRef)((e,t)=>{const{icon:i,title:r,description:o,action:s,secondaryAction:n,size:a="md",fill:l=!1,style:c,testID:d}=e,u=(0,_index.useTheme)(),p=(0,_react.useMemo)(()=>sizeFor(u,a),[u,a]),m=(0,_react.useMemo)(()=>buildStyles(u),[u]);return(0,_jsxRuntime.jsxs)(_reactNative.View,{ref:t,accessibilityRole:"summary",testID:d,style:[m.root,{paddingVertical:p.paddingVertical},l?m.fill:null,c],children:[i?(0,_jsxRuntime.jsx)(_reactNative.View,{style:[m.iconCircle,{width:p.iconSize,height:p.iconSize,marginBottom:p.titleGap,borderRadius:p.iconSize/2,..._corners.smoothCorners}],children:i}):null,(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[m.title,{fontSize:p.titleSize,...(0,_index.fontFor)(u,"semibold")}],children:r}),o?(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[m.description,{fontSize:p.descriptionSize,marginTop:p.descriptionGap}],children:o}):null,s||n?(0,_jsxRuntime.jsxs)(_reactNative.View,{style:m.actions,children:[s?(0,_jsxRuntime.jsx)(ActionButton,{action:s,variant:"primary"}):null,n?(0,_jsxRuntime.jsx)(ActionButton,{action:n,variant:"secondary"}):null]}):null]})});EmptyState.displayName="EmptyState";const buildStyles=e=>_reactNative.StyleSheet.create({root:{alignItems:"center",justifyContent:"center",paddingHorizontal:e.spacing.lg},fill:{flexGrow:1},iconCircle:{backgroundColor:e.colors.surface.disabled,alignItems:"center",justifyContent:"center"},title:{color:e.colors.text.primary,textAlign:"center"},description:{color:e.colors.text.secondary,textAlign:"center",maxWidth:320,lineHeight:e.typography.fontSize.base*e.typography.lineHeight.normal},actions:{flexDirection:"row",alignItems:"center",gap:e.spacing.sm,marginTop:e.spacing.md+e.spacing.xs}}),buildActionStyles=e=>_reactNative.StyleSheet.create({button:{paddingHorizontal:e.spacing.lg,paddingVertical:e.spacing.sm,minHeight:42,borderRadius:e.radius.md,..._corners.smoothCorners,alignItems:"center",justifyContent:"center",flexDirection:"row"},buttonPrimary:{backgroundColor:e.colors.primary},buttonSecondary:{backgroundColor:"transparent",borderWidth:1,borderColor:e.colors.border.primary},buttonSecondaryPressed:{backgroundColor:e.colors.surface.pressed},buttonSquircleHost:{backgroundColor:"transparent",borderColor:"transparent",overflow:"visible"},buttonText:{fontSize:e.typography.fontSize.base,...(0,_index.fontFor)(e,"semibold")},buttonTextPrimary:{color:e.colors.onPrimary},buttonTextSecondary:{color:e.colors.text.primary}});var _default=exports.default=EmptyState;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=exports.FileViewer=void 0;var _mobileCore=require("@webority/mobile-core"),_download=require("@webority/mobile-core/download"),_react=require("react"),_reactNative=require("react-native"),_NativePdfRasterizer=_interopRequireDefault(require("../../specs/NativePdfRasterizer.js")),_hashString=require("../../utils/hashString.js"),
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=exports.FileViewer=void 0;var _mobileCore=require("@webority/mobile-core"),_download=require("@webority/mobile-core/download"),_react=require("react"),_reactNative=require("react-native"),_reactNativeGestureHandler=require("react-native-gesture-handler"),_reactNativeReanimated=_interopRequireDefault(require("react-native-reanimated")),_NativePdfRasterizer=_interopRequireDefault(require("../../specs/NativePdfRasterizer.js")),_index=require("../../theme/index.js"),_hashString=require("../../utils/hashString.js"),_index2=require("../Spinner/index.js"),_FileViewerPage=require("./FileViewerPage.js"),_useFileViewerZoom=require("./useFileViewerZoom.js"),_jsxRuntime=require("react/jsx-runtime");function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}const HAS_SCHEME=/^[a-z][a-z0-9+.-]*:/i,MAX_RENDER_SCALE=5,RENDER_OVERSCALE=1.25,RENDER_AHEAD=3,MOUNT_AROUND=2,DEFAULT_MAX_ZOOM=4,toError=e=>e instanceof Error?e:new Error(String(e)),scaleForWidth=(e,t,r)=>{if(t<=0)return 1;const i=e/t*_reactNative.PixelRatio.get()*1.25*r;return Math.round(100*Math.min(Math.max(i,1),5))/100},cacheFileName=e=>{const t=(e.split("#")[0]?.split("?")[0]??"").split("/").pop()??"",r=/\.[a-z0-9]{1,8}$/i.exec(t)?.[0]??"";return`${(0,_hashString.hashString)(e)}${r.toLowerCase()}`},localPathFromSource=async e=>{if(!HAS_SCHEME.test(e.uri)||e.uri.startsWith("file://"))return e.uri.replace(/^file:\/\//,"");return(await(0,_download.downloadFile)({client:e.client??_mobileCore.publicClient,url:e.uri,fileName:cacheFileName(e.uri),headers:e.headers,overwrite:!1===e.cache})).path},AnimatedScrollView=_reactNativeReanimated.default.createAnimatedComponent(_reactNative.ScrollView),FileViewer=({source:e,onLoadComplete:t,onPageChanged:r,onError:i,loadingIndicator:a,zoomEnabled:l=!0,maxZoom:o=4,style:n,testID:s,accessibilityLabel:c})=>{const u=(0,_index.useTheme)().spacing.sm,{width:d,height:h}=(0,_reactNative.useWindowDimensions)(),[_,f]=(0,_react.useState)({width:0,height:0}),[m,w]=(0,_react.useState)(0),[g,p]=(0,_react.useState)({width:612,height:792}),R=g.height/g.width,[v,x]=(0,_react.useState)({}),[b,y]=(0,_react.useState)(null),[S,E]=(0,_react.useState)(0),N=(0,_react.useRef)(0),j=(0,_react.useRef)(null),F=(0,_react.useRef)(null),V=(0,_react.useRef)(i);V.current=i;const M=(0,_react.useRef)(t);M.current=t;const C=(0,_react.useRef)(r);C.current=r;const P=(0,_react.useRef)(a);P.current=a;const z=d*R,q=z+u,A=_.height>0?_.height:h,{scrollRef:D,scrollGesture:Z,zoomGesture:H,zoomStyle:O,zoomLevel:L,resetZoom:G}=(0,_useFileViewerZoom.useFileViewerZoom)({zoomEnabled:l,maxZoom:o,viewportWidth:_.width>0?_.width:d,viewportHeight:A,maxScroll:Math.max(0,m*q-u-A)}),W=(0,_react.useMemo)(()=>({uri:e.uri,headers:e.headers,client:e.client,cache:e.cache}),[e.uri,e.headers,e.client,e.cache]);(0,_react.useEffect)(()=>{let e=!1;return(async()=>{if(_NativePdfRasterizer.default)try{const t=await localPathFromSource(W);if(e)return;const r=await _NativePdfRasterizer.default.open(t);if(e)return void await _NativePdfRasterizer.default.close(r.handle).catch(()=>{});j.current=r.handle,N.current=0,w(r.pageCount),E(0),x({}),y(null),G(),r.pageWidth>0&&r.pageHeight>0&&p({width:r.pageWidth,height:r.pageHeight}),M.current?.(r.pageCount)}catch(t){if(!e){const e=toError(t);_mobileCore.Logger.error("[@webority/mobile-ui] FileViewer failed to load.",e),V.current?.(e)}}else V.current?.(new Error("[@webority/mobile-ui] PdfRasterizer native module is not linked. Run pod install / rebuild the app after adding @webority/mobile-ui."))})(),()=>{e=!0;const t=j.current;j.current=null,t&&_NativePdfRasterizer.default?.close(t).catch(()=>{})}},[W,G]);const T=scaleForWidth(d,g.width,1),k=L>_useFileViewerZoom.ZOOM_REST?scaleForWidth(d,g.width,Math.ceil(L)):0,I=(0,_react.useCallback)(async()=>{const e=j.current;if(!e||!_NativePdfRasterizer.default||0===m)return;if(F.current===e)return;let t;if(void 0===v[S])t={page:S,scale:T,sharp:!1};else if(k>T&&null!==v[S]&&(b?.page!==S||b.scale!==k))t={page:S,scale:k,sharp:!0};else for(let e=1;e<=3&&!t;e+=1)for(const r of[S+e,S-e])if(r>=0&&r<m&&void 0===v[r]){t={page:r,scale:T,sharp:!1};break}if(!t)return;const{page:r,scale:i,sharp:a}=t;F.current=e;let l=null;try{l=await _NativePdfRasterizer.default.renderPage(e,r,i)}catch(t){j.current===e&&_mobileCore.Logger.error(`[@webority/mobile-ui] FileViewer failed to render page ${r}.`,toError(t))}finally{F.current===e&&(F.current=null)}j.current===e&&(a?y({page:r,scale:i,uri:l}):x(e=>({...e,[r]:l})))},[T,S,m,v,b,k]);(0,_react.useEffect)(()=>{I()},[I]),(0,_react.useEffect)(()=>{L<=_useFileViewerZoom.ZOOM_REST&&y(null)},[L]);const $=(0,_react.useCallback)(e=>{const{width:t,height:r}=e.nativeEvent.layout;f(e=>e.width===t&&e.height===r?e:{width:t,height:r})},[]),U=(0,_react.useCallback)(e=>{if(q<=0||0===m)return;const t=Math.min(m-1,Math.max(0,Math.round(e.nativeEvent.contentOffset.y/q)));t!==N.current&&(N.current=t,E(t),C.current?.(t+1,m))},[m,q]),X=(0,_react.useCallback)(()=>P.current?.()??(0,_jsxRuntime.jsx)(_index2.Spinner,{size:"lg"}),[]),B=(0,_react.useMemo)(()=>({gap:u}),[u]),J=(0,_react.useMemo)(()=>Array.from({length:m},(e,t)=>t),[m]),K=L>_useFileViewerZoom.ZOOM_REST;return(0,_jsxRuntime.jsx)(_reactNativeGestureHandler.GestureHandlerRootView,{style:[styles.root,n],onLayout:$,testID:s,accessible:void 0!==c,accessibilityLabel:c,accessibilityRole:"none",children:0===m?(0,_jsxRuntime.jsx)(_reactNative.View,{style:styles.pagePlaceholder,children:a?a():(0,_jsxRuntime.jsx)(_index2.Spinner,{size:"lg"})}):(0,_jsxRuntime.jsx)(_reactNativeGestureHandler.GestureDetector,{gesture:H,children:(0,_jsxRuntime.jsx)(_reactNative.View,{style:styles.viewport,collapsable:!1,children:(0,_jsxRuntime.jsx)(_reactNativeReanimated.default.View,{style:[styles.viewport,O],children:(0,_jsxRuntime.jsx)(_reactNativeGestureHandler.GestureDetector,{gesture:Z,children:(0,_jsxRuntime.jsx)(AnimatedScrollView,{ref:D,onScroll:U,scrollEventThrottle:16,scrollEnabled:!K,showsVerticalScrollIndicator:!K,contentContainerStyle:B,children:J.map(e=>(0,_jsxRuntime.jsx)(_FileViewerPage.FileViewerPage,{width:d,height:z,uri:K&&b?.page===e&&b.uri?b.uri:v[e],mounted:Math.abs(e-S)<=2,renderLoading:X},e))})})})})})})};exports.FileViewer=FileViewer,FileViewer.displayName="FileViewer";const styles=_reactNative.StyleSheet.create({root:{flex:1,overflow:"hidden"},viewport:{flex:1},pagePlaceholder:{flex:1,alignItems:"center",justifyContent:"center"}});var _default=exports.default=FileViewer;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.FileViewerPage=void 0;var _expoImage=require("expo-image"),_react=require("react"),_reactNative=require("react-native"),_jsxRuntime=require("react/jsx-runtime");const FileViewerPageView=({width:e,height:t,uri:i,mounted:r,renderLoading:a})=>(0,_jsxRuntime.jsx)(_reactNative.View,{style:[styles.page,{width:e,height:t}],children:r&&i?(0,_jsxRuntime.jsx)(_expoImage.Image,{source:{uri:i},style:_reactNative.StyleSheet.absoluteFill,contentFit:"contain",cachePolicy:"none",allowDownscaling:!1,transition:0,accessible:!1}):r&&void 0===i?(0,_jsxRuntime.jsx)(_reactNative.View,{style:styles.pagePlaceholder,children:a()}):null}),FileViewerPage=exports.FileViewerPage=(0,_react.memo)(FileViewerPageView),styles=_reactNative.StyleSheet.create({page:{alignSelf:"center"},pagePlaceholder:{flex:1,alignItems:"center",justifyContent:"center"}});
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.useFileViewerZoom=exports.ZOOM_REST=void 0;var _react=require("react"),_reactNativeGestureHandler=require("react-native-gesture-handler"),_reactNativeReanimated=require("react-native-reanimated");const DOUBLE_TAP_ZOOM=2.5,ZOOM_REST=exports.ZOOM_REST=1.01,clamp=(e,a,t)=>{"worklet";return Math.min(Math.max(e,a),t)},panLimit=(e,a)=>{"worklet";return e*(a-1)/2},useFileViewerZoom=({zoomEnabled:e,maxZoom:a,viewportWidth:t,viewportHeight:i,maxScroll:l})=>{const[u,r]=(0,_react.useState)(1),v=(0,_reactNativeReanimated.useAnimatedRef)(),n=(0,_reactNativeReanimated.useScrollViewOffset)(v),m=(0,_reactNativeReanimated.useSharedValue)(0),c=(0,_reactNativeReanimated.useSharedValue)(0),s=(0,_reactNativeReanimated.useSharedValue)(0),o=(0,_reactNativeReanimated.useSharedValue)(0),d=(0,_reactNativeReanimated.useSharedValue)(1),_=(0,_reactNativeReanimated.useSharedValue)(1),R=(0,_reactNativeReanimated.useSharedValue)(0),N=(0,_reactNativeReanimated.useSharedValue)(0),h=(0,_reactNativeReanimated.useSharedValue)(0),w=(0,_reactNativeReanimated.useSharedValue)(0);(0,_react.useEffect)(()=>{s.value=t,o.value=i,c.value=l},[t,i,l,s,o,c]);const S=(0,_react.useCallback)(()=>{d.value=(0,_reactNativeReanimated.withTiming)(1),R.value=(0,_reactNativeReanimated.withTiming)(0),N.value=(0,_reactNativeReanimated.withTiming)(0),_.value=1,h.value=0,w.value=0,r(1)},[d,_,R,N,h,w]);(0,_react.useEffect)(()=>{e||S()},[e,S]);const p=(0,_react.useCallback)(e=>r(e),[]),O=(0,_react.useMemo)(()=>_reactNativeGestureHandler.Gesture.Native(),[]),T=(0,_react.useMemo)(()=>{const t=Math.max(1,a),i=Math.min(2.5,t),l=_reactNativeGestureHandler.Gesture.Pinch().enabled(e).onStart(()=>{"worklet";_.value=d.value,h.value=R.value,w.value=N.value}).onUpdate(e=>{"worklet";const a=clamp(_.value*e.scale,1,t),i=e.focalX-s.value/2,l=e.focalY-o.value/2,u=a/_.value,r=panLimit(s.value,a),v=panLimit(o.value,a);R.value=clamp(i-(i-h.value)*u,-r,r),N.value=clamp(l-(l-w.value)*u,-v,v),d.value=a}).onEnd(()=>{"worklet";if(d.value<=ZOOM_REST)return d.value=(0,_reactNativeReanimated.withTiming)(1),R.value=(0,_reactNativeReanimated.withTiming)(0),N.value=(0,_reactNativeReanimated.withTiming)(0),_.value=1,h.value=0,w.value=0,void(0,_reactNativeReanimated.runOnJS)(p)(1);_.value=d.value,h.value=R.value,w.value=N.value,(0,_reactNativeReanimated.runOnJS)(p)(d.value)}),u=_reactNativeGestureHandler.Gesture.Pan().enabled(e).minPointers(1).maxPointers(1).manualActivation(!0).onTouchesMove((e,a)=>{"worklet";d.value>ZOOM_REST?a.activate():a.fail()}).onStart(()=>{"worklet";h.value=R.value,w.value=N.value,m.value=n.value}).onUpdate(e=>{"worklet";const a=d.value,t=panLimit(s.value,a),i=panLimit(o.value,a);R.value=clamp(h.value+e.translationX,-t,t);const l=w.value+e.translationY,u=clamp(l,-i,i),r=l-u;if(0!==r){const e=clamp(m.value-r/a,0,c.value);e!==m.value&&(m.value=e,(0,_reactNativeReanimated.scrollTo)(v,0,e,!1)),w.value-=r}N.value=u}).onEnd(()=>{"worklet";h.value=R.value,w.value=N.value}),r=_reactNativeGestureHandler.Gesture.Tap().enabled(e).numberOfTaps(2).maxDistance(10).onEnd(e=>{"worklet";if(d.value>ZOOM_REST)return d.value=(0,_reactNativeReanimated.withTiming)(1),R.value=(0,_reactNativeReanimated.withTiming)(0),N.value=(0,_reactNativeReanimated.withTiming)(0),_.value=1,h.value=0,w.value=0,void(0,_reactNativeReanimated.runOnJS)(p)(1);if(i<=ZOOM_REST)return;const a=e.x-s.value/2,t=e.y-o.value/2,l=panLimit(s.value,i),u=panLimit(o.value,i),r=clamp(-a*(i-1),-l,l),v=clamp(-t*(i-1),-u,u);d.value=(0,_reactNativeReanimated.withTiming)(i),R.value=(0,_reactNativeReanimated.withTiming)(r),N.value=(0,_reactNativeReanimated.withTiming)(v),_.value=i,h.value=r,w.value=v,(0,_reactNativeReanimated.runOnJS)(p)(i)});return l.simultaneousWithExternalGesture(O),u.simultaneousWithExternalGesture(O),r.simultaneousWithExternalGesture(O),_reactNativeGestureHandler.Gesture.Simultaneous(l,u,r)},[a,e,p,O,v,n,m,c,s,o,d,_,R,N,h,w]),f=(0,_reactNativeReanimated.useAnimatedStyle)(()=>({transform:[{translateX:R.value},{translateY:N.value},{scale:d.value}]}));return{scrollRef:v,scrollGesture:O,zoomGesture:T,zoomStyle:f,zoomLevel:u,resetZoom:S}};exports.useFileViewerZoom=useFileViewerZoom;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=exports.FilterChipRow=void 0;var _react=require("react"),_reactNative=require("react-native"),_index=require("../../hooks/index.js"),_index2=require("../../theme/index.js"),_index3=require("../Chip/index.js"),_jsxRuntime=require("react/jsx-runtime");const FilterChipRowItem=(0,_react.memo)(({itemKey:e,label:t,count:r,disabled:a,selected:i,size:n,variant:c,tone:l,haptic:o,onSelect:s,onItemLayout:u})=>{const d=(0,_react.useCallback)(()=>s(e),[s,e]),p=(0,_react.useCallback)(t=>u(e,t.nativeEvent.layout),[u,e]);return(0,_jsxRuntime.jsx)(_reactNative.View,{onLayout:p,collapsable:!1,children:(0,_jsxRuntime.jsx)(_index3.Chip,{label:t,count:r,selected:i,selectionMode:"radio",disabled:a,size:n,variant:c,tone:l,haptic:!i&&o,onPress:d})})});FilterChipRowItem.displayName="FilterChipRowItem";const FilterChipRow=exports.FilterChipRow=(0,_react.forwardRef)((e,t)=>{const{items:r,value:a,onChange:i,bleed:n=0,size:c,variant:l,tone:o,haptic:s,accessibilityLabel:u,style:d,contentContainerStyle:p,testID:h}=e,_=(0,_index2.useTheme)(),x=(0,_index.useReducedMotion)(),m=(0,_react.useRef)(null),v=(0,_react.useRef)({viewport:0,content:0,chips:{},revealed:null}),w=(0,_react.useRef)(a),b=(0,_react.useRef)(i);(0,_react.useEffect)(()=>{b.current=i},[i]);const y=(0,_react.useCallback)((e,t)=>{const r=v.current,a=r.chips[e];if(!a||0===r.viewport||0===r.content)return;const i=a.x+a.width/2-r.viewport/2,n=Math.min(Math.max(i,0),Math.max(r.content-r.viewport,0));m.current?.scrollTo({x:n,animated:t&&!x}),r.revealed=e},[x]),C=(0,_react.useCallback)(()=>{v.current.revealed!==w.current&&y(w.current,!1)},[y]);(0,_react.useEffect)(()=>{w.current=a,y(a,!0)},[a,y]);const R=(0,_react.useCallback)(e=>{v.current.viewport=e.nativeEvent.layout.width,C()},[C]),f=(0,_react.useCallback)(e=>{v.current.content=e,C()},[C]),j=(0,_react.useCallback)((e,t)=>{v.current.chips[e]={x:t.x,width:t.width},C()},[C]),k=(0,_react.useCallback)(e=>{e!==w.current?b.current(e):y(e,!0)},[y]),F=(0,_react.useMemo)(()=>[styles.row,{paddingHorizontal:n,columnGap:_.spacing.xs},p],[n,_.spacing.xs,p]);return(0,_jsxRuntime.jsx)(_reactNative.View,{ref:t,accessibilityRole:"radiogroup",accessibilityLabel:u,testID:h,style:[n>0?{marginHorizontal:-n}:null,d],children:(0,_jsxRuntime.jsx)(_reactNative.ScrollView,{ref:m,horizontal:!0,showsHorizontalScrollIndicator:!1,keyboardShouldPersistTaps:"handled",contentContainerStyle:F,onLayout:R,onContentSizeChange:f,children:r.map(e=>(0,_jsxRuntime.jsx)(FilterChipRowItem,{itemKey:e.key,label:e.label,count:e.count,disabled:e.disabled,selected:e.key===a,size:c,variant:l,tone:o,haptic:s,onSelect:k,onItemLayout:j},e.key))})})});FilterChipRow.displayName="FilterChipRow";const styles=_reactNative.StyleSheet.create({row:{alignItems:"center"}});var _default=exports.default=FilterChipRow;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),Object.defineProperty(exports,"FilterChipRow",{enumerable:!0,get:function(){return _FilterChipRow.FilterChipRow}}),Object.defineProperty(exports,"default",{enumerable:!0,get:function(){return _FilterChipRow.default}});var _FilterChipRow=_interopRequireWildcard(require("./FilterChipRow.js"));function _interopRequireWildcard(e,r){if("function"==typeof WeakMap)var t=new WeakMap,i=new WeakMap;return(_interopRequireWildcard=function(e,r){if(!r&&e&&e.__esModule)return e;var n,o,u={__proto__:null,default:e};if(null===e||"object"!=typeof e&&"function"!=typeof e)return u;if(n=r?i:t){if(n.has(e))return n.get(e);n.set(e,u)}for(const r in e)"default"!==r&&{}.hasOwnProperty.call(e,r)&&((o=(n=Object.defineProperty)&&Object.getOwnPropertyDescriptor(e,r))&&(o.get||o.set)?n(u,r,o):u[r]=e[r]);return u})(e,r)}
|