@webority/mobile-ui 0.109.6 → 0.109.8
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/dist/canvas-kit/kit.js +8178 -7802
- package/dist/canvas-kit/manifest.json +360 -2
- package/dist/canvas-kit/release.json +6 -6
- package/lib/commonjs/components/AppBar/AppBar.js +1 -1
- package/lib/commonjs/components/Avatar/Avatar.js +1 -1
- package/lib/commonjs/components/Badge/Badge.js +1 -1
- package/lib/commonjs/components/Banner/Banner.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/Dialog/Dialog.js +1 -1
- package/lib/commonjs/components/Dialog/OverlayActions.js +1 -0
- package/lib/commonjs/components/EmptyState/EmptyState.js +1 -1
- package/lib/commonjs/components/IconBadge/IconBadge.js +1 -1
- package/lib/commonjs/components/ListItem/ListItem.js +1 -1
- package/lib/commonjs/components/ListSection/ListSection.js +1 -0
- package/lib/commonjs/components/ListSection/index.js +1 -0
- package/lib/commonjs/components/Menu/MenuSurface.js +1 -1
- package/lib/commonjs/components/ProfileCompletion/ProfileCompletion.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/StatusBadge/StatusBadge.js +1 -1
- package/lib/commonjs/components/Tabs/Tabs.js +1 -1
- package/lib/commonjs/components/Timeline/Timeline.js +1 -1
- package/lib/commonjs/components/index.js +1 -1
- package/lib/commonjs/hooks/usePressAnimation.js +1 -1
- package/lib/module/components/AppBar/AppBar.js +1 -1
- package/lib/module/components/Avatar/Avatar.js +1 -1
- package/lib/module/components/Badge/Badge.js +1 -1
- package/lib/module/components/Banner/Banner.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/Dialog/Dialog.js +1 -1
- package/lib/module/components/Dialog/OverlayActions.js +1 -0
- package/lib/module/components/EmptyState/EmptyState.js +1 -1
- package/lib/module/components/IconBadge/IconBadge.js +1 -1
- package/lib/module/components/ListItem/ListItem.js +1 -1
- package/lib/module/components/ListSection/ListSection.js +1 -0
- package/lib/module/components/ListSection/index.js +1 -0
- package/lib/module/components/Menu/MenuSurface.js +1 -1
- package/lib/module/components/ProfileCompletion/ProfileCompletion.js +1 -1
- package/lib/module/components/ProfilePicker/ProfilePicker.js +1 -1
- package/lib/module/components/ProgressBar/ProgressBar.js +1 -1
- package/lib/module/components/StatusBadge/StatusBadge.js +1 -1
- package/lib/module/components/Tabs/Tabs.js +1 -1
- package/lib/module/components/Timeline/Timeline.js +1 -1
- package/lib/module/components/index.js +1 -1
- package/lib/module/hooks/usePressAnimation.js +1 -1
- package/lib/typescript/commonjs/components/AppBar/AppBar.d.ts +22 -2
- package/lib/typescript/commonjs/components/AppBar/index.d.ts +1 -1
- package/lib/typescript/commonjs/components/Avatar/Avatar.d.ts +20 -2
- package/lib/typescript/commonjs/components/Avatar/index.d.ts +1 -1
- package/lib/typescript/commonjs/components/Badge/Badge.d.ts +5 -0
- package/lib/typescript/commonjs/components/Badge/index.d.ts +1 -1
- package/lib/typescript/commonjs/components/Banner/Banner.d.ts +3 -1
- package/lib/typescript/commonjs/components/BottomSheet/BottomSheet.d.ts +6 -0
- package/lib/typescript/commonjs/components/Card/Card.d.ts +3 -0
- package/lib/typescript/commonjs/components/Dialog/Dialog.d.ts +9 -0
- package/lib/typescript/commonjs/components/Dialog/OverlayActions.d.ts +19 -0
- package/lib/typescript/commonjs/components/EmptyState/EmptyState.d.ts +4 -0
- package/lib/typescript/commonjs/components/EmptyState/index.d.ts +1 -1
- package/lib/typescript/commonjs/components/IconBadge/IconBadge.d.ts +20 -1
- package/lib/typescript/commonjs/components/IconBadge/index.d.ts +1 -1
- package/lib/typescript/commonjs/components/ListItem/ListItem.d.ts +9 -3
- package/lib/typescript/commonjs/components/ListItem/index.d.ts +1 -1
- package/lib/typescript/commonjs/components/ListSection/ListSection.d.ts +20 -0
- package/lib/typescript/commonjs/components/ListSection/index.d.ts +3 -0
- package/lib/typescript/commonjs/components/ProgressBar/ProgressBar.d.ts +2 -0
- package/lib/typescript/commonjs/components/StatusBadge/StatusBadge.d.ts +18 -1
- package/lib/typescript/commonjs/components/StatusBadge/index.d.ts +1 -1
- package/lib/typescript/commonjs/components/index.d.ts +9 -7
- package/lib/typescript/commonjs/hooks/usePressAnimation.d.ts +6 -3
- package/lib/typescript/module/components/AppBar/AppBar.d.ts +22 -2
- package/lib/typescript/module/components/AppBar/index.d.ts +1 -1
- package/lib/typescript/module/components/Avatar/Avatar.d.ts +20 -2
- package/lib/typescript/module/components/Avatar/index.d.ts +1 -1
- package/lib/typescript/module/components/Badge/Badge.d.ts +5 -0
- package/lib/typescript/module/components/Badge/index.d.ts +1 -1
- package/lib/typescript/module/components/Banner/Banner.d.ts +3 -1
- package/lib/typescript/module/components/BottomSheet/BottomSheet.d.ts +6 -0
- package/lib/typescript/module/components/Card/Card.d.ts +3 -0
- package/lib/typescript/module/components/Dialog/Dialog.d.ts +9 -0
- package/lib/typescript/module/components/Dialog/OverlayActions.d.ts +19 -0
- package/lib/typescript/module/components/EmptyState/EmptyState.d.ts +4 -0
- package/lib/typescript/module/components/EmptyState/index.d.ts +1 -1
- package/lib/typescript/module/components/IconBadge/IconBadge.d.ts +20 -1
- package/lib/typescript/module/components/IconBadge/index.d.ts +1 -1
- package/lib/typescript/module/components/ListItem/ListItem.d.ts +9 -3
- package/lib/typescript/module/components/ListItem/index.d.ts +1 -1
- package/lib/typescript/module/components/ListSection/ListSection.d.ts +20 -0
- package/lib/typescript/module/components/ListSection/index.d.ts +3 -0
- package/lib/typescript/module/components/ProgressBar/ProgressBar.d.ts +2 -0
- package/lib/typescript/module/components/StatusBadge/StatusBadge.d.ts +18 -1
- package/lib/typescript/module/components/StatusBadge/index.d.ts +1 -1
- package/lib/typescript/module/components/index.d.ts +9 -7
- package/lib/typescript/module/hooks/usePressAnimation.d.ts +6 -3
- package/package.json +7 -7
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=exports.DEFAULT_BADGE_LABELS=exports.Badge=void 0;var _react=require("react"),_reactNative=require("react-native"),_index=require("../../theme/index.js"),_corners=require("../../utils/corners.js"),_warnInvalidValue=require("../../utils/warnInvalidValue.js"),_index2=require("../Skeleton/index.js"),_index3=require("../Text/index.js"),_jsxRuntime=require("react/jsx-runtime");const DEFAULT_BADGE_LABELS=exports.DEFAULT_BADGE_LABELS=Object.freeze({indicator:"Notification indicator",unread:e=>`${e} unread`}),toneFor=(e,t)=>{switch(t){case"primary":return{background:e.colors.primary,text:e.colors["on-primary"]};case"success":return{background:e.colors.success,text:e.colors["on-success"]};case"warning":return{background:e.colors.warning,text:e.colors["on-warning"]};case"info":return{background:e.colors.info,text:e.colors["on-info"]};case"neutral":return{background:e.colors["bg-muted"],text:e.colors["text-body"]};default:return{background:e.colors.danger,text:e.colors["on-danger"]}}},anchorPosition=(e,t)=>{const
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=exports.DEFAULT_BADGE_LABELS=exports.Badge=void 0;var _react=require("react"),_reactNative=require("react-native"),_index=require("../../theme/index.js"),_corners=require("../../utils/corners.js"),_warnInvalidValue=require("../../utils/warnInvalidValue.js"),_index2=require("../Skeleton/index.js"),_index3=require("../Text/index.js"),_jsxRuntime=require("react/jsx-runtime");const DEFAULT_BADGE_LABELS=exports.DEFAULT_BADGE_LABELS=Object.freeze({indicator:"Notification indicator",unread:e=>`${e} unread`}),toneFor=(e,t)=>{switch(t){case"primary":return{background:e.colors.primary,text:e.colors["on-primary"]};case"success":return{background:e.colors.success,text:e.colors["on-success"]};case"warning":return{background:e.colors.warning,text:e.colors["on-warning"]};case"info":return{background:e.colors.info,text:e.colors["on-info"]};case"neutral":return{background:e.colors["bg-muted"],text:e.colors["text-body"]};default:return{background:e.colors.danger,text:e.colors["on-danger"]}}},softToneFor=(e,t)=>{switch(t){case"primary":return{background:e.colors["primary-soft"],text:e.colors.primary};case"success":return{background:e.colors["success-soft"],text:e.colors.success};case"warning":return{background:e.colors["warning-soft"],text:e.colors.warning};case"info":return{background:e.colors["info-soft"],text:e.colors.info};case"neutral":return{background:e.colors["bg-muted"],text:e.colors["text-muted"]};default:return{background:e.colors["danger-soft"],text:e.colors.danger}}},anchorPosition=(e,t)=>{const r=-t;switch(e){case"topLeft":return{top:r,left:r};case"bottomRight":return{bottom:r,right:r};case"bottomLeft":return{bottom:r,left:r};default:return{top:r,right:r}}},formatValue=(e,t)=>{if(null==e)return null;if("number"==typeof e)return e<=0?null:e>t?`${t}+`:String(e);const r=String(e);return 0===r.length?null:r},Badge=exports.Badge=(0,_react.forwardRef)((e,t)=>{const{value:r,max:i=99,variant:n="standard",tone:o="danger",size:a="sm",fill:s="solid",accessible:l=!0,invisible:d=!1,loading:c=!1,children:u,anchor:g="topRight",pulse:h=!1,accessibilityLabel:m,labels:x,style:f,badgeStyle:_,textStyle:b,testID:v}=e;(0,_warnInvalidValue.warnInvalidValue)("Badge","variant",e.variant,["standard","dot"]),(0,_warnInvalidValue.warnInvalidValue)("Badge","tone",e.tone,["primary","success","warning","danger","neutral","info"]),(0,_warnInvalidValue.warnInvalidValue)("Badge","size",e.size,["sm","md"]),(0,_warnInvalidValue.warnInvalidValue)("Badge","anchor",e.anchor,["topRight","topLeft","bottomRight","bottomLeft"]),(0,_warnInvalidValue.warnInvalidValue)("Badge","fill",e.fill,["solid","soft"]);const p=(0,_react.useMemo)(()=>({...DEFAULT_BADGE_LABELS,...x}),[x]),w=(0,_index.useTheme)(),y=(0,_react.useMemo)(()=>"soft"===s?softToneFor(w,o):toneFor(w,o),[w,o,s]),j=(0,_index.resolveBadgeSize)(w,a),B=w.components.badge["border-width"],S=w.components.badge["anchor-offset"],k="dot"===n?null:formatValue(r,i),V=!d&&("dot"===n||null!==k),L=(0,_react.useRef)((0,_index.createAnimatedValue)(1)).current;(0,_react.useEffect)(()=>{if(!h||!V)return void(0,_index.setNativeValue)(L,1);const e=_reactNative.Animated.loop(_reactNative.Animated.sequence([_reactNative.Animated.timing(L,{toValue:1.15,duration:w.motion.duration.slow,easing:_reactNative.Easing.bezier(...w.motion.ease["in-out"]),useNativeDriver:!0}),_reactNative.Animated.timing(L,{toValue:1,duration:w.motion.duration.slow,easing:_reactNative.Easing.bezier(...w.motion.ease["in-out"]),useNativeDriver:!0})]));return e.start(),()=>{e.stop()}},[h,V,L,w]);const R="dot"===n,A=R?"image":"text",N=m??(R?p.indicator:k?p.unread(k):void 0),z=V?(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{style:[styles.badge,R?{width:j["dot-size"],height:j["dot-size"],borderRadius:j["dot-size"]/2,..._corners.smoothCorners,paddingHorizontal:0}:{minWidth:j["min-width"],minHeight:j.height,borderRadius:w.radius.pill,..._corners.smoothCorners,paddingHorizontal:j["padding-x"]},{backgroundColor:y.background,transform:[{scale:L}]},u?{position:"absolute",borderWidth:B,borderColor:w.colors.surface,...anchorPosition(g,S)}:null,_],accessible:l,importantForAccessibility:l?void 0:"no-hide-descendants",accessibilityElementsHidden:!l||void 0,accessibilityRole:l?A:void 0,accessibilityLabel:l?N:void 0,children:R||null===k?null:(0,_jsxRuntime.jsx)(_index3.Text,{variant:"caption",weight:"soft"===s?"semibold":"bold",numberOfLines:1,style:[styles.text,{color:y.text,fontSize:j.text,lineHeight:Math.round(j.text*w.leading.body)},b],children:k??" "})}):null,E=u?(0,_jsxRuntime.jsxs)(_reactNative.View,{ref:t,style:[styles.wrapper,f],testID:v,children:[u,z]}):(0,_jsxRuntime.jsx)(_reactNative.View,{ref:t,style:f,testID:v,children:z});return c?(0,_jsxRuntime.jsx)(BadgeSkeleton,{...e}):E});Badge.displayName="Badge";const BadgeSkeleton=({variant:e="standard",size:t="md",children:r,anchor:i,style:n,badgeStyle:o})=>{const a=(0,_index.useTheme)(),s=(0,_index.resolveBadgeSize)(a,t);if("dot"===e)return(0,_jsxRuntime.jsx)(_index2.Skeleton,{shape:"circle",width:s["dot-size"],height:s["dot-size"],style:[o,n]});const l=s.height/2;if(void 0!==r){const e="topLeft"===i?{top:-s.height/2,left:-s.height/2}:"bottomRight"===i?{bottom:-s.height/2,right:-s.height/2}:"bottomLeft"===i?{bottom:-s.height/2,left:-s.height/2}:{top:-s.height/2,right:-s.height/2};return(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[styles.wrapper,n],children:[r,(0,_jsxRuntime.jsx)(_reactNative.View,{style:[{position:"absolute"},e],children:(0,_jsxRuntime.jsx)(_index2.Skeleton,{width:s["min-width"]+s["padding-x"],height:s.height,radius:l,style:o})})]})}return(0,_jsxRuntime.jsx)(_index2.Skeleton,{width:s["min-width"]+s["padding-x"],height:s.height,radius:l,style:[o,n]})};BadgeSkeleton.displayName="BadgeSkeleton",Badge.Skeleton=BadgeSkeleton;const styles=_reactNative.StyleSheet.create({wrapper:{position:"relative",alignSelf:"flex-start"},badge:{alignItems:"center",justifyContent:"center",flexDirection:"row"},text:{textAlign:"center",includeFontPadding:!1}});var _default=exports.default=Badge;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=exports.DEFAULT_BANNER_LABELS=exports.Banner=void 0;var _react=require("react"),_reactNative=require("react-native"),_usePresenceMotion=require("../../hooks/usePresenceMotion.js"),_index=require("../../theme/index.js"),_corners=require("../../utils/corners.js"),_hapticUtils=require("../../utils/hapticUtils.js"),_hitSlop=require("../../utils/hitSlop.js"),_warnInvalidValue=require("../../utils/warnInvalidValue.js"),_slotIcon=require("../AppIcon/slotIcon.js"),_index2=require("../
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=exports.DEFAULT_BANNER_LABELS=exports.Banner=void 0;var _react=require("react"),_reactNative=require("react-native"),_usePresenceMotion=require("../../hooks/usePresenceMotion.js"),_index=require("../../theme/index.js"),_corners=require("../../utils/corners.js"),_hapticUtils=require("../../utils/hapticUtils.js"),_hitSlop=require("../../utils/hitSlop.js"),_warnInvalidValue=require("../../utils/warnInvalidValue.js"),_slotIcon=require("../AppIcon/slotIcon.js"),_index2=require("../IconBadge/index.js"),_index3=require("../Skeleton/index.js"),_index4=require("../Text/index.js"),_jsxRuntime=require("react/jsx-runtime");const DEFAULT_BANNER_LABELS=exports.DEFAULT_BANNER_LABELS=Object.freeze({dismiss:"Dismiss banner"}),Banner=exports.Banner=(0,_react.forwardRef)((e,t)=>{const{title:r,message:n,tone:i="neutral",variant:s="bar",icon:a,actions:o,dismissible:l=!1,onClose:c,haptic:d,visible:u=!0,animateMount:x=!0,loading:m=!1,accessibilityRole:p="alert",accessibilityLabel:_,labels:g,style:h,containerStyle:y,iconCircleStyle:b,tintBarStyle:v,closeButtonStyle:f,actionButtonStyle:j,testID:w}=e;(0,_warnInvalidValue.warnInvalidValue)("Banner","tone",e.tone,["primary","success","warning","danger","info","neutral"]),(0,_warnInvalidValue.warnInvalidValue)("Banner","variant",e.variant,["bar","wash","tint"]),(0,_warnInvalidValue.warnInvalidValue)("Banner","accessibilityRole",e.accessibilityRole,["alert","summary","none"]);const R=(0,_index.useTheme)(),B=(0,_usePresenceMotion.usePresenceMotion)(),S=(0,_react.useMemo)(()=>buildStyles(R),[R]),N=(0,_react.useMemo)(()=>tintFor(R,i),[R,i]),I=(0,_react.useMemo)(()=>({...DEFAULT_BANNER_LABELS,...g}),[g]),[V,k]=B.range(-20,0),C=(0,_react.useRef)((0,_index.createAnimatedValue)(x&&u?V:0)).current,L=(0,_react.useRef)((0,_index.createAnimatedValue)(x&&u?0:u?1:0)).current,[A,D]=(0,_react.useState)(u),E=(0,_react.useRef)(!0);if((0,_react.useEffect)(()=>{if(E.current&&(E.current=!1,!x))return;let e;return u?(D(!0),e=_reactNative.Animated.parallel([_reactNative.Animated.timing(C,{toValue:k,duration:R.motion.duration.default,useNativeDriver:!0}),_reactNative.Animated.timing(L,{toValue:1,duration:B.duration("default"),useNativeDriver:!0})]),e.start()):A&&(e=_reactNative.Animated.parallel([_reactNative.Animated.timing(C,{toValue:V,duration:R.motion.duration.fast,useNativeDriver:!0}),_reactNative.Animated.timing(L,{toValue:0,duration:B.duration("fast"),useNativeDriver:!0})]),e.start(()=>{D(!1)})),()=>e?.stop()},[u]),!A)return null;const T=r??" ",q="string"==typeof n?n??" ":"",M="wash"===s,H="bar"!==s,z="alert"===p?"danger"===i?"assertive":"polite":"none",P=(0,_jsxRuntime.jsxs)(_reactNative.Animated.View,{ref:t,accessibilityRole:p,accessibilityLiveRegion:z,accessibilityLabel:_,testID:w,style:[S.container,{backgroundColor:H?N.soft:R.colors["bg-subtle"],borderRadius:M?R.radius.sm:R.radius.md,..._corners.smoothCorners,padding:R.space.md,opacity:L,transform:[{translateY:C}]},h,y],children:[!M&&R.components.banner["tint-bar-width"]>0?(0,_jsxRuntime.jsx)(_reactNative.View,{style:[S.tintBar,{backgroundColor:N.bar},v]}):null,(0,_jsxRuntime.jsxs)(_reactNative.View,{style:S.row,children:[!1===a?null:a?(0,_jsxRuntime.jsx)(_reactNative.View,{style:S.iconWrap,children:(0,_slotIcon.renderSlotIcon)(a,{color:N.ink,size:R.text.xl.size,disabled:!1})}):(0,_jsxRuntime.jsx)(_index2.IconBadge,{dimension:ICON_CIRCLE_SIZE,color:N.bar,icon:(0,_jsxRuntime.jsx)(_index4.Text,{variant:"body",weight:"bold",accessible:!1,style:[S.iconGlyph,{color:N.ink}],children:N.glyph}),style:[S.iconCircle,b]}),(0,_jsxRuntime.jsxs)(_reactNative.View,{style:S.textBlock,children:[r||m?(0,_jsxRuntime.jsx)(_index4.Text,{variant:"body",weight:"semibold",numberOfLines:2,style:{lineHeight:20,...M?{color:N.ink}:null},children:T}):null,"string"==typeof n||m?(0,_jsxRuntime.jsx)(_index4.Text,{variant:"bodySmall",color:"secondary",style:{lineHeight:18,marginTop:r?R.space.xxs:0},children:q||" "}):(0,_jsxRuntime.jsx)(_reactNative.View,{style:{marginTop:r?R.space.xxs:0},children:n})]}),l?(0,_jsxRuntime.jsx)(_reactNative.Pressable,{accessibilityRole:"button",accessibilityLabel:I.dismiss,onPress:()=>{const e=(0,_hapticUtils.resolveHaptic)(d,"selection");e&&(0,_hapticUtils.triggerHaptic)(e),c?.()},hitSlop:8,...(0,_hitSlop.hitSlopMarker)(8),style:({pressed:e})=>[S.closeBtn,{backgroundColor:e?R.colors["surface-pressed"]:"transparent"},f],children:(0,_jsxRuntime.jsx)(_index4.Text,{variant:"title",weight:"bold",color:"secondary",accessible:!1,style:{lineHeight:17},children:"×"})}):null]}),o&&o.length>0?(0,_jsxRuntime.jsx)(_reactNative.View,{style:S.actionsRow,children:o.map((e,t)=>{(0,_warnInvalidValue.warnInvalidValue)("Banner","action.tone",e.tone,["primary","success","warning","danger","info","neutral"]),(0,_warnInvalidValue.warnInvalidValue)("Banner","action.variant",e.variant,["solid","outline","ghost"]),(0,_warnInvalidValue.warnInvalidValue)("Banner","action.size",e.size,["sm","md"]);const r=e.tone??"primary",n=e.variant??"ghost",i="primary"===r?N.glyphColor:"neutral"===r?R.colors["text-muted"]:R.colors[r],s="primary"===r?N.ink:"neutral"===r?R.colors["text-muted"]:R.colors[`${r}-text`],a="primary"===r?N.on:"neutral"===r?R.colors["on-neutral-strong"]:R.colors[`on-${r}`],o="solid"===n;return(0,_jsxRuntime.jsx)(_reactNative.Pressable,{accessibilityRole:"button",accessibilityLabel:e.label,testID:e.testID,onPress:()=>{const t=(0,_hapticUtils.resolveHaptic)(d,"selection");t&&(0,_hapticUtils.triggerHaptic)(t),e.onPress()},style:({pressed:t})=>[S.actionBtn,"md"===e.size&&S.actionBtnMd,"outline"===n&&{borderWidth:1,borderColor:s},{backgroundColor:o?i:t?R.colors["surface-pressed"]:"transparent",opacity:o&&t?.85:1},j],children:(0,_jsxRuntime.jsx)(_index4.Text,{variant:"bodySmall",weight:"semibold",align:"center",style:{color:o?a:s},children:e.label})},`${e.label}-${t}`)})}):null]});return m?(0,_jsxRuntime.jsx)(BannerSkeleton,{...e}):P});Banner.displayName="Banner";const BannerSkeleton=({title:e,actions:t,icon:r,containerStyle:n,style:i})=>{const s=(0,_index.useTheme)(),a=!1!==r;return(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[{flexDirection:"row",alignItems:"flex-start",backgroundColor:s.colors.surface,borderRadius:s.radius.md,..._corners.smoothCorners,padding:s.space.md,borderWidth:1,borderColor:s.colors.border},n,i],accessibilityRole:"progressbar",accessibilityState:{busy:!0},"aria-busy":!0,children:[a?(0,_jsxRuntime.jsx)(_reactNative.View,{style:{marginRight:s.space.sm},children:(0,_jsxRuntime.jsx)(_index3.Skeleton,{shape:"circle",width:32,height:32})}):null,(0,_jsxRuntime.jsxs)(_reactNative.View,{style:{flex:1},children:[void 0!==e?(0,_jsxRuntime.jsx)(_index3.Skeleton,{shape:"text",width:"55%",height:16,style:{marginBottom:s.space.xs}}):null,(0,_jsxRuntime.jsx)(_index3.SkeletonText,{lines:2,fontSize:s.text.sm.size,lastLineWidth:"70%"}),t&&t.length>0?(0,_jsxRuntime.jsx)(_reactNative.View,{style:{flexDirection:"row",marginTop:s.space.sm},children:t.map((e,t)=>(0,_jsxRuntime.jsx)(_index3.Skeleton,{width:72,height:28,shape:"rounded",style:{marginRight:s.space.sm}},`sk-banner-action-${t}`))}):null]})]})};BannerSkeleton.displayName="BannerSkeleton",Banner.Skeleton=BannerSkeleton;const tintFor=(e,t)=>{switch(t){case"success":return{soft:e.colors["success-soft"],bar:e.colors.success,glyphColor:e.colors.success,ink:e.colors["success-text"],on:e.colors["on-success"],glyph:"✓"};case"warning":return{soft:e.colors["warning-soft"],bar:e.colors.warning,glyphColor:e.colors.warning,ink:e.colors["warning-text"],on:e.colors["on-warning"],glyph:"⚠"};case"danger":return{soft:e.colors["danger-soft"],bar:e.colors.danger,glyphColor:e.colors.danger,ink:e.colors["danger-text"],on:e.colors["on-danger"],glyph:"✗"};case"neutral":return{soft:e.colors["bg-subtle"],bar:e.colors["text-subtle"],glyphColor:e.colors["text-muted"],ink:e.colors["text-muted"],on:e.colors["on-neutral-strong"],glyph:"i"};case"primary":return{soft:e.colors["primary-soft"],bar:e.colors.primary,glyphColor:e.colors.primary,ink:e.colors["primary-text"],on:e.colors["on-primary"],glyph:"i"};case"info":return{soft:e.colors["info-soft"],bar:e.colors.info,glyphColor:e.colors.info,ink:e.colors["info-text"],on:e.colors["on-info"],glyph:"i"};default:return tintFor(e,"neutral")}},ICON_CIRCLE_SIZE=28,buildStyles=e=>{const t=e.components.banner,r=e.space.sm;return _reactNative.StyleSheet.create({container:{overflow:"hidden",paddingLeft:e.space.md},tintBar:{position:"absolute",left:0,top:0,bottom:0,width:t["tint-bar-width"]},row:{flexDirection:"row",alignItems:"flex-start"},iconWrap:{marginRight:r},iconCircle:{marginRight:r},iconGlyph:{lineHeight:17},textBlock:{flex:1,paddingRight:e.space.xs},closeBtn:{width:28,height:28,borderRadius:e.radius.pill,..._corners.smoothCorners,alignItems:"center",justifyContent:"center",marginLeft:e.space.xxs},actionsRow:{flexDirection:"row",flexWrap:"wrap",justifyContent:"flex-end",marginTop:e.space.xs,columnGap:e.space.xs,rowGap:e.space.xs},actionBtn:{paddingHorizontal:e.space.sm,paddingVertical:e.space.xs,borderRadius:e.radius.sm,..._corners.smoothCorners,maxWidth:"100%",alignItems:"center",justifyContent:"center"},actionBtnMd:{minHeight:44,paddingHorizontal:e.space.md}})};var _default=exports.default=Banner;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=exports.DEFAULT_BOTTOM_NAVIGATION_LABELS=exports.BottomNavigation=void 0;var cache,_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"),_hitSlop=require("../../utils/hitSlop.js"),_shadows=require("../../utils/shadows.js"),_warnInvalidValue=require("../../utils/warnInvalidValue.js"),_index3=require("../AppIcon/index.js"),_index4=require("../Text/index.js"),_useScreenReaderEnabled=require("./useScreenReaderEnabled.js"),_jsxRuntime=require("react/jsx-runtime");function _interopRequireWildcard(e,t){if(!t&&e&&e.__esModule)return e;var i,a,n=Object.defineProperty,r={__proto__:null,default:e};if(Object(e)!==e)return r;if(cache||"function"!=typeof WeakMap||(cache=new WeakMap),cache){if(cache.has(e))return cache.get(e);cache.set(e,r)}for(a in e)"default"!==a&&{}.hasOwnProperty.call(e,a)&&((i=n&&Object.getOwnPropertyDescriptor(e,a))&&(i.get||i.set)?n(r,a,i):r[a]=e[a]);return r}const DEFAULT_BOTTOM_NAVIGATION_LABELS=exports.DEFAULT_BOTTOM_NAVIGATION_LABELS=Object.freeze({switchesTo:e=>`Switches to ${e}`,unread:e=>`${e} unread`,newUpdates:"new updates"}),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_UNDERLINE_HEIGHT=3,DEFAULT_BUBBLE_SIZE=48,DEFAULT_BUBBLE_LIFT=14,DEFAULT_CENTER_SIZE=48,DEFAULT_CENTER_ICON_SIZE=24,CENTER_KEY="__center_action__",EXPANDED_FLEX=1.5,SOLID_INACTIVE_OPACITY=.7,TILE_INSET=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,t)=>null==e||!1===e?"":"number"==typeof e?e>0?`, ${t.unread(e)}`:"":!0===e||"·"===e?`, ${t.newUpdates}`:"string"==typeof e&&e.length>0?`, ${e}`:"",BottomNavigation=exports.BottomNavigation=(0,_react.forwardRef)((e,t)=>{const{tabs:i,centerAction:a,activeTab:n,onChange:r,haptic:o="selection",showLabels:s=!0,variant:l="pill",indicatorPosition:c="bottom",radius:d,indicatorRadius:u="auto",elevation:p,iconSize:h,marginHorizontal:_,marginVertical:m,paddingHorizontal:g,paddingVertical:x,border:b,minimizeOnScroll:f=!1,scrollDirection:y="idle",accessory:v,style:R,indicatorStyle:N,labelStyle:w,labelMaxFontScale:j,labels:A,testID:I}=e;(0,_warnInvalidValue.warnInvalidValue)("BottomNavigation","variant",e.variant,["pill","underline","floating","bubble","expand","solid","tile"]),(0,_warnInvalidValue.warnInvalidValue)("BottomNavigation","indicatorPosition",e.indicatorPosition,["top","bottom"]);const S=(0,_react.useMemo)(()=>A?{...DEFAULT_BOTTOM_NAVIGATION_LABELS,...A}:DEFAULT_BOTTOM_NAVIGATION_LABELS,[A]),E=(0,_index.useTheme)(),T=(0,_reactNativeSafeAreaContext.useSafeAreaInsets)(),L=(0,_react.useMemo)(()=>buildStyles(E),[E]),V=h??18,C=V+4+8,M=E.space.lg,B=E.space.lg,D=E.radius.xl,k=(0,_useReducedMotion.useReducedMotion)(),O=(0,_useScreenReaderEnabled.useScreenReaderEnabled)(f),[z,P]=_react.default.useState(null);(0,_react.useEffect)(()=>{null!==z&&z!==y&&P(null)},[z,y]);const F=f&&!O&&"down"===y&&null===z,[H,W]=_react.default.useState(F);(0,_react.useEffect)(()=>{H!==F&&(k||"web"===_reactNative.Platform.OS||_reactNative.LayoutAnimation.configureNext(_reactNative.LayoutAnimation.Presets.easeInEaseOut),W(F))},[H,F,k]);const U="function"==typeof v?v({minimized:H}):v,q=null!=U&&!1!==U,$=H&&q,[X,G]=_react.default.useState(0),Z=q&&!$?X+E.space.xs:0,Y="tile"===l,K="floating"===l||Y,J="bubble"===l,Q="expand"===l,ee="solid"===l,te="pill"===l||K||ee,ie=Math.max(0,i.findIndex(e=>e.key===n)),[ae,ne]=_react.default.useState(0),[re,oe]=_react.default.useState(0),se=a?Math.ceil(i.length/2):i.length,le=i.length+(a?1:0),[ce,de]=_react.default.useState({width:0,height:0}),ue=a?.size??48,pe=void 0!==a?.gap,he=Math.max(0,a?.gap??0),me=pe?(ce.width||ue)+2*he:0,ge=pe?i.length>0?Math.max(0,ae-me)/i.length:0:le>0?ae/le:0,xe=pe?me:ge,be=(0,_react.useRef)((0,_index.createAnimatedValue)(ie)).current,fe=(0,_react.useRef)({}),ye=(0,_react.useRef)({});i.forEach(e=>{fe.current[e.key]||(fe.current[e.key]=new _reactNative.Animated.Value(1)),ye.current[e.key]||(ye.current[e.key]=(0,_index.createAnimatedValue)(e.key===n?1:0))});const ve=ge>0?Y?Math.min(ge-4,96):Math.min(ge-M,64):0,Re=ge>0?(ge-ve)/2:0,Ne=ge>0?(ge-48)/2:0,hasLabel=e=>s&&!H&&!1!==e.showLabel&&e.label.trim().length>0,we=i[ie],je=we&&!hasLabel(we)&&re>0?re/2:E.space.xs+(V+4)/2,Ae=je-14-24,Ie=Math.max(0,re-4),Se=Y?2:je-C/2,Ee=(0,_react.useRef)(ie);(0,_react.useEffect)(()=>{if(Ee.current===ie)return;Ee.current=ie;const e=_reactNative.Animated.spring(be,{toValue:ie,tension:120,friction:14,useNativeDriver:!0});return e.start(),()=>e.stop()},[ie,be]);const Te=Math.max(1,i.length-1),Le=(0,_react.useMemo)(()=>{const e=[],t=[];for(let i=0;i<=Te;i++)e.push(i),t.push(i<se?i*ge:i*ge+xe);return be.interpolate({inputRange:e,outputRange:t})},[be,Te,se,ge,xe]),Ve=i.map(e=>e.key).join(" "),Ce=J||Q;(0,_react.useEffect)(()=>{const e=Ve.split(" ").flatMap(e=>{const t=e===n?1:0,i=ye.current[e];return i?Ce?[_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()},[n,Ve,Ce]);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()},Me=(0,_react.useRef)(new _reactNative.Animated.Value(1)).current,{colors:Be}=E,De=ee?Be.primary:Be.surface,ke=ee?Be["on-primary"]:Be.primary,Oe=ee?Be["on-primary"]:Y?Be["text-body"]:Be["text-subtle"],ze=ee?Be["on-primary"]:Be["primary-soft"],Pe=ee?Be.primary:J?Be["on-primary"]:ke,Fe=_??B,He=m??(K?B:0),We=He>0,Ue=x??E.space.sm,qe=g??(K?E.space.sm:E.space.xs),$e=We?Ue:Math.max(Ue,T.bottom),Xe=We?Math.max(He,T.bottom>0?T.bottom+E.space.sm:0):0,Ge="pill"===d,Ze=K?re+Z+2*Ue+2*_reactNative.StyleSheet.hairlineWidth:re+Z+Ue+$e,Ye=Ge?re>0?Ze/2:E.radius.pill:d??(Y?E.radius.pill:K?D:E.radius.none),Ke=void 0!==d,activeBgRadius=(e,t)=>"number"==typeof u?Math.max(0,Math.min(u,e/2)):"auto"===u&&Ke?Math.min(Ye,e/2):t,Je="underline"===l?Math.max(qe,Ge&&0===re?0:Ye):qe,Qe=p??"none",et="none"===Qe?void 0:E.shadow[Qe],tt=void 0===et?null:(0,_shadows.supportsBoxShadow)()?{boxShadow:(0,_shadows.toBoxShadow)(et)}:et,it=b?_reactNative.StyleSheet.hairlineWidth:0,at=ee?Be.primary:Be.border,nt=a?.lift??0,rt=Ue+it+Z,ot=a&&re>0?Math.max(0,(ce.height||ue)/2+nt-re/2-rt):0,st=a?(0,_jsxRuntime.jsx)(_reactNative.View,{style:[L.centerCell,pe?{flex:0,marginHorizontal:he}:null],pointerEvents:"box-none",children:(0,_jsxRuntime.jsxs)(_reactNative.Pressable,{onPress:()=>{if(!a)return;const e=a.haptic??o;!1!==e&&(0,_index2.triggerHaptic)(e),popIcon(Me),a.onPress()},onLayout:e=>{const{width:t,height:i}=e.nativeEvent.layout;de(e=>e.width===t&&e.height===i?e:{width:t,height:i})},accessibilityRole:"button",accessibilityLabel:a.label,hitSlop:{top:6,bottom:6,left:6,right:6},...(0,_hitSlop.hitSlopMarker)({top:6,bottom:6,left:6,right:6}),style:({pressed:e})=>[L.centerPressable,{top:-nt},e?{opacity:.85}:null],testID:a.testID??(I?`${I}-center`:void 0),children:[a.content?(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{style:{transform:[{scale:Me}]},children:a.content}):(0,_jsxRuntime.jsx)(_reactNative.View,{style:[L.centerCircle,{width:ue,height:ue,borderRadius:E.radius.pill,..._corners.smoothCorners,backgroundColor:a.color??Be.primary}],children:(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{style:{transform:[{scale:Me}]},children:(0,_index3.renderSlotIcon)(a.icon??"add",{color:a.iconColor??Be["on-primary"],size:a.iconSize??24,disabled:!1})})}),(lt=a,s&&!H&<.label.trim().length>0?(0,_jsxRuntime.jsx)(_index4.Text,{variant:"caption",numberOfLines:1,maxFontSizeMultiplier:j??E.settings.maxFontSizeMultiplier??1.2,style:[L.label,{color:Oe,opacity:ee?.7:1},w],children:a.label}):null)]})},CENTER_KEY):null;var lt;const ct=q?(0,_jsxRuntime.jsx)(_reactNative.View,{style:$?L.accessoryInline:L.accessoryStacked,onLayout:e=>G(e.nativeEvent.layout.height),testID:I?`${I}-accessory`:void 0,children:U}):null,dt=(0,_jsxRuntime.jsxs)(_reactNative.View,{style:$?[L.tabRow,L.tabRowInline]:L.tabRow,onLayout:e=>{const{width:t,height:i}=e.nativeEvent.layout;ne(t),oe(i)},children:[te&&ve>0&&(!Y||Ie>0)?(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{pointerEvents:"none",style:[L.pill,{width:ve,height:Y?Ie:C,left:Re,top:Se,backgroundColor:ze,borderRadius:Y?activeBgRadius(Ie,Ie/2):activeBgRadius(C,E.radius.pill),..._corners.smoothCorners,transform:[{translateX:Le}]},N]}):null,J&&ge>0?(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{pointerEvents:"none",style:[L.bubble,E.shadow.elevated,{width:48,height:48,borderRadius:E.radius.pill,..._corners.smoothCorners,left:Ne,top:Ae,backgroundColor:Be.primary,borderColor:Be.surface,transform:[{translateX:Le}]},N]}):null,(ut=i.map(e=>{const t=e.key===n,i=t?ke:Oe,a=t?Pe:Oe,s="string"==typeof e.icon?{name:e.icon,variant:"bold"}:e.icon,l=t?e.activeIcon??s:e.icon,c=fe.current[e.key],d=ye.current[e.key],u=formatBadge(e.badge??null),p=badgeAccessibilitySuffix(e.badge??null,S),h=ee&&!t?.7:1,_=J&&t||ee?Be.primary:Be.surface,m=hasLabel(e),g=m&&(!Q||t),x=(0,_jsxRuntime.jsxs)(_reactNative.Animated.View,{style:[L.iconWrap,{width:V+4,height:V+4,opacity:h,transform:[{scale:c}]}],children:[(0,_index3.renderSlotIcon)(l,{color:a,size:V,focused:t,disabled:!1}),u?(0,_jsxRuntime.jsx)(_reactNative.View,{style:[u.isDot?L.badgeDot:L.badgePill,{backgroundColor:Be.danger,borderColor:_}],children:u.isDot?null:(0,_jsxRuntime.jsx)(_index4.Text,{variant:"caption",weight:"bold",style:[L.badgeText,{color:Be["on-danger"]}],numberOfLines:1,children:u.text})}):null]}),b=J?(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{style:{top:d.interpolate({inputRange:[0,1],outputRange:[0,-14]})},children:x}):x,f=g?(0,_jsxRuntime.jsx)(_reactNative.Animated.Text,{numberOfLines:1,maxFontSizeMultiplier:j??E.settings.maxFontSizeMultiplier??1.2,style:[L.label,Q?L.labelInline:null,{color:i,opacity:Q?d:h,fontWeight:t?E.weight.semibold:E.weight.normal},w],children:e.label}):null,v=(0,_jsxRuntime.jsx)(_reactNative.Pressable,{onPress:()=>(e=>{H&&P(y),e.key!==n&&!1!==o&&(0,_index2.triggerHaptic)(o);const t=fe.current[e.key];t&&popIcon(t),r(e.key)})(e),accessibilityRole:"tab",accessibilityState:{selected:t},"aria-selected":t,accessibilityLabel:`${e.label}${p}`,accessibilityHint:S.switchesTo(e.label),hitSlop:{top:6,bottom:6,left:6,right:6},...(0,_hitSlop.hitSlopMarker)({top:6,bottom:6,left:6,right:6}),style:({pressed:e})=>[L.tab,Y?L.tabTile:null,e?{opacity:.85}:null],testID:I?`${I}-tab-${e.key}`:void 0,children:Q?(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[L.expandPill,{height:C,paddingHorizontal:t&&m?E.space.md:Math.max(0,(C-(V+4))/2)}],children:[(0,_jsxRuntime.jsx)(_reactNative.View,{pointerEvents:"none",style:[L.expandFill,{borderRadius:activeBgRadius(C,C/2),..._corners.smoothCorners,backgroundColor:t?Be["primary-soft"]:"transparent"},t?N:null]}),b,f]}):(0,_jsxRuntime.jsxs)(_jsxRuntime.Fragment,{children:[b,f]})},e.key);return Q?(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{style:{flex:d.interpolate({inputRange:[0,1],outputRange:[1,m?1.5:1]})},children:v},e.key):v}),st?[...ut.slice(0,se),st,...ut.slice(se)]:ut),"underline"===l&&ge>0?(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{pointerEvents:"none",style:[L.underline,"top"===c?L.underlineTop:L.underlineBottom,"top"===c?{top:-Ue-Z}:{bottom:-Ue},{width:ge,height:3,backgroundColor:Be.primary,transform:[{translateX:Le}]},N]}):null]});var ut;return(0,_jsxRuntime.jsx)(_reactNative.View,{ref:t,testID:I,accessibilityRole:"tablist",style:[L.outer,{paddingHorizontal:Fe,paddingTop:Math.max(He,ot),paddingBottom:Xe},R],children:(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[K?L.floatingBar:L.dockedBar,$?L.barInline:null,tt,{backgroundColor:De,borderColor:at,borderRadius:Ye,..._corners.smoothCorners},K?{borderWidth:it,paddingHorizontal:qe,paddingVertical:Ue}:{borderTopWidth:it,borderBottomWidth:it,borderLeftWidth:it,borderRightWidth:it,paddingHorizontal:Je,paddingTop:Ue,paddingBottom:$e}],children:[ct,dt]})})});BottomNavigation.displayName="BottomNavigation";const buildStyles=e=>_reactNative.StyleSheet.create({outer:{backgroundColor:"transparent"},dockedBar:{paddingHorizontal:e.space.xs},floatingBar:{paddingVertical:e.space.sm,paddingHorizontal:e.space.sm},tabRow:{flexDirection:"row",alignItems:"stretch",position:"relative"},tabRowInline:{flex:1},barInline:{flexDirection:"row",alignItems:"center"},accessoryStacked:{marginBottom:e.space.xs},accessoryInline:{flexShrink:0,marginRight:e.space.xs},tab:{flex:1,minHeight:44,alignItems:"center",justifyContent:"center",paddingVertical:e.space.xs,gap:e.space.xs},tabTile:{paddingVertical:e.space.sm,gap:e.space.xxs},centerCell:{flex:1,minHeight:44,alignItems:"center",justifyContent:"center"},centerPressable:{alignItems:"center",maxWidth:"100%",gap:e.space.xs},centerCircle:{alignItems:"center",justifyContent:"center"},iconWrap:{alignItems:"center",justifyContent:"center",position:"relative"},label:{fontSize:e.text.xs.size,lineHeight:e.text.xs.size*e.leading.heading,textAlign:"center",includeFontPadding:!1},labelInline:{fontSize:e.text.sm.size,lineHeight:e.text.sm.size*e.leading.heading,flexShrink:1,includeFontPadding:!1},expandPill:{flexDirection:"row",alignItems:"center",justifyContent:"center",gap:e.space.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:e.radius.none,borderTopRightRadius:e.radius.none,..._corners.smoothCorners},underlineTop:{borderBottomLeftRadius:e.radius.none,borderBottomRightRadius:e.radius.none,..._corners.smoothCorners},badgePill:{position:"absolute",top:-4,right:-8,minWidth:18,height:18,borderRadius:e.radius.pill,..._corners.smoothCorners,paddingHorizontal:e.space.xs,paddingVertical:e.space.xxs,alignItems:"center",justifyContent:"center",borderWidth:1.5},badgeDot:{position:"absolute",top:-2,right:-2,width:10,height:10,borderRadius:e.radius.pill,..._corners.smoothCorners,borderWidth:1.5},badgeText:{fontSize:e.text.xs.size,lineHeight:13,textAlign:"center",includeFontPadding:!1}});var _default=exports.default=BottomNavigation;
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=exports.DEFAULT_BOTTOM_NAVIGATION_LABELS=exports.BottomNavigation=void 0;var cache,_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"),_hitSlop=require("../../utils/hitSlop.js"),_shadows=require("../../utils/shadows.js"),_warnInvalidValue=require("../../utils/warnInvalidValue.js"),_index3=require("../AppIcon/index.js"),_index4=require("../Badge/index.js"),_index5=require("../Text/index.js"),_useScreenReaderEnabled=require("./useScreenReaderEnabled.js"),_jsxRuntime=require("react/jsx-runtime");function _interopRequireWildcard(e,t){if(!t&&e&&e.__esModule)return e;var i,a,n=Object.defineProperty,r={__proto__:null,default:e};if(Object(e)!==e)return r;if(cache||"function"!=typeof WeakMap||(cache=new WeakMap),cache){if(cache.has(e))return cache.get(e);cache.set(e,r)}for(a in e)"default"!==a&&{}.hasOwnProperty.call(e,a)&&((i=n&&Object.getOwnPropertyDescriptor(e,a))&&(i.get||i.set)?n(r,a,i):r[a]=e[a]);return r}const DEFAULT_BOTTOM_NAVIGATION_LABELS=exports.DEFAULT_BOTTOM_NAVIGATION_LABELS=Object.freeze({switchesTo:e=>`Switches to ${e}`,unread:e=>`${e} unread`,newUpdates:"new updates"}),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_UNDERLINE_HEIGHT=3,DEFAULT_BUBBLE_SIZE=48,DEFAULT_BUBBLE_LIFT=14,DEFAULT_CENTER_SIZE=48,DEFAULT_CENTER_ICON_SIZE=24,CENTER_KEY="__center_action__",EXPANDED_FLEX=1.5,SOLID_INACTIVE_OPACITY=.7,TILE_INSET=2,badgeVariantOf=e=>null==e||!1===e?null:!0===e||"·"===e?"dot":"number"==typeof e?e>0?"standard":null:e.length>0?"standard":null,badgeAccessibilitySuffix=(e,t)=>null==e||!1===e?"":"number"==typeof e?e>0?`, ${t.unread(e)}`:"":!0===e||"·"===e?`, ${t.newUpdates}`:"string"==typeof e&&e.length>0?`, ${e}`:"",BottomNavigation=exports.BottomNavigation=(0,_react.forwardRef)((e,t)=>{const{tabs:i,centerAction:a,activeTab:n,onChange:r,haptic:o="selection",showLabels:s=!0,variant:l="pill",indicatorPosition:d="bottom",radius:c,indicatorRadius:u="auto",elevation:p,iconSize:h,marginHorizontal:_,marginVertical:m,paddingHorizontal:g,paddingVertical:b,border:x,minimizeOnScroll:f=!1,scrollDirection:y="idle",accessory:v,style:R,indicatorStyle:N,labelStyle:w,labelMaxFontScale:j,labels:S,testID:A}=e;(0,_warnInvalidValue.warnInvalidValue)("BottomNavigation","variant",e.variant,["pill","underline","floating","bubble","expand","solid","tile"]),(0,_warnInvalidValue.warnInvalidValue)("BottomNavigation","indicatorPosition",e.indicatorPosition,["top","bottom"]);const I=(0,_react.useMemo)(()=>S?{...DEFAULT_BOTTOM_NAVIGATION_LABELS,...S}:DEFAULT_BOTTOM_NAVIGATION_LABELS,[S]),E=(0,_index.useTheme)(),T=(0,_reactNativeSafeAreaContext.useSafeAreaInsets)(),L=(0,_react.useMemo)(()=>buildStyles(E),[E]),V=h??18,M=V+4+8,B=E.space.lg,C=E.space.lg,D=E.radius.xl,O=(0,_useReducedMotion.useReducedMotion)(),k=(0,_useScreenReaderEnabled.useScreenReaderEnabled)(f),[P,z]=_react.default.useState(null);(0,_react.useEffect)(()=>{null!==P&&P!==y&&z(null)},[P,y]);const F=f&&!k&&"down"===y&&null===P,[H,W]=_react.default.useState(F);(0,_react.useEffect)(()=>{H!==F&&(O||"web"===_reactNative.Platform.OS||_reactNative.LayoutAnimation.configureNext(_reactNative.LayoutAnimation.Presets.easeInEaseOut),W(F))},[H,F,O]);const q="function"==typeof v?v({minimized:H}):v,U=null!=q&&!1!==q,$=H&&U,[X,G]=_react.default.useState(0),Z=U&&!$?X+E.space.xs:0,Y="tile"===l,K="floating"===l||Y,J="bubble"===l,Q="expand"===l,ee="solid"===l,te="pill"===l||K||ee,ie=Math.max(0,i.findIndex(e=>e.key===n)),[ae,ne]=_react.default.useState(0),[re,oe]=_react.default.useState(0),se=a?Math.ceil(i.length/2):i.length,le=i.length+(a?1:0),[de,ce]=_react.default.useState({width:0,height:0}),ue=a?.size??48,pe=void 0!==a?.gap,he=Math.max(0,a?.gap??0),me=pe?(de.width||ue)+2*he:0,ge=pe?i.length>0?Math.max(0,ae-me)/i.length:0:le>0?ae/le:0,be=pe?me:ge,xe=(0,_react.useRef)((0,_index.createAnimatedValue)(ie)).current,fe=(0,_react.useRef)({}),ye=(0,_react.useRef)({});i.forEach(e=>{fe.current[e.key]||(fe.current[e.key]=new _reactNative.Animated.Value(1)),ye.current[e.key]||(ye.current[e.key]=(0,_index.createAnimatedValue)(e.key===n?1:0))});const ve=ge>0?Y?Math.min(ge-4,96):Math.min(ge-B,64):0,Re=ge>0?(ge-ve)/2:0,Ne=ge>0?(ge-48)/2:0,hasLabel=e=>s&&!H&&!1!==e.showLabel&&e.label.trim().length>0,we=i[ie],je=we&&!hasLabel(we)&&re>0?re/2:E.space.xs+(V+4)/2,Se=je-14-24,Ae=Math.max(0,re-4),Ie=Y?2:je-M/2,Ee=(0,_react.useRef)(ie);(0,_react.useEffect)(()=>{if(Ee.current===ie)return;Ee.current=ie;const e=_reactNative.Animated.spring(xe,{toValue:ie,tension:120,friction:14,useNativeDriver:!0});return e.start(),()=>e.stop()},[ie,xe]);const Te=Math.max(1,i.length-1),Le=(0,_react.useMemo)(()=>{const e=[],t=[];for(let i=0;i<=Te;i++)e.push(i),t.push(i<se?i*ge:i*ge+be);return xe.interpolate({inputRange:e,outputRange:t})},[xe,Te,se,ge,be]),Ve=i.map(e=>e.key).join(" "),Me=J||Q;(0,_react.useEffect)(()=>{const e=Ve.split(" ").flatMap(e=>{const t=e===n?1:0,i=ye.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()},[n,Ve,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:Ce}=E,De=ee?Ce.primary:Ce.surface,Oe=ee?Ce["on-primary"]:Ce.primary,ke=ee?Ce["on-primary"]:Y?Ce["text-body"]:Ce["text-subtle"],Pe=ee?Ce["on-primary"]:Ce["primary-soft"],ze=ee?Ce.primary:J?Ce["on-primary"]:Oe,Fe=_??C,He=m??(K?C:0),We=He>0,qe=b??E.space.sm,Ue=g??(K?E.space.sm:E.space.xs),$e=We?qe:Math.max(qe,T.bottom),Xe=We?Math.max(He,T.bottom>0?T.bottom+E.space.sm:0):0,Ge="pill"===c,Ze=K?re+Z+2*qe+2*_reactNative.StyleSheet.hairlineWidth:re+Z+qe+$e,Ye=Ge?re>0?Ze/2:E.radius.pill:c??(Y?E.radius.pill:K?D:E.radius.none),Ke=void 0!==c,activeBgRadius=(e,t)=>"number"==typeof u?Math.max(0,Math.min(u,e/2)):"auto"===u&&Ke?Math.min(Ye,e/2):t,Je="underline"===l?Math.max(Ue,Ge&&0===re?0:Ye):Ue,Qe=p??"none",et="none"===Qe?void 0:E.shadow[Qe],tt=void 0===et?null:(0,_shadows.supportsBoxShadow)()?{boxShadow:(0,_shadows.toBoxShadow)(et)}:et,it=x?_reactNative.StyleSheet.hairlineWidth:0,at=ee?Ce.primary:Ce.border,nt=a?.lift??0,rt=qe+it+Z,ot=a&&re>0?Math.max(0,(de.height||ue)/2+nt-re/2-rt):0,st=a?(0,_jsxRuntime.jsx)(_reactNative.View,{style:[L.centerCell,pe?{flex:0,marginHorizontal:he}:null],pointerEvents:"box-none",children:(0,_jsxRuntime.jsxs)(_reactNative.Pressable,{onPress:()=>{if(!a)return;const e=a.haptic??o;!1!==e&&(0,_index2.triggerHaptic)(e),popIcon(Be),a.onPress()},onLayout:e=>{const{width:t,height:i}=e.nativeEvent.layout;ce(e=>e.width===t&&e.height===i?e:{width:t,height:i})},accessibilityRole:"button",accessibilityLabel:a.label,hitSlop:{top:6,bottom:6,left:6,right:6},...(0,_hitSlop.hitSlopMarker)({top:6,bottom:6,left:6,right:6}),style:({pressed:e})=>[L.centerPressable,{top:-nt},e?{opacity:.85}:null],testID:a.testID??(A?`${A}-center`:void 0),children:[a.content?(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{style:{transform:[{scale:Be}]},children:a.content}):(0,_jsxRuntime.jsx)(_reactNative.View,{style:[L.centerCircle,{width:ue,height:ue,borderRadius:E.radius.pill,..._corners.smoothCorners,backgroundColor:a.color??Ce.primary}],children:(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{style:{transform:[{scale:Be}]},children:(0,_index3.renderSlotIcon)(a.icon??"add",{color:a.iconColor??Ce["on-primary"],size:a.iconSize??24,disabled:!1})})}),(lt=a,s&&!H&<.label.trim().length>0?(0,_jsxRuntime.jsx)(_index5.Text,{variant:"caption",numberOfLines:1,maxFontSizeMultiplier:j??E.settings.maxFontSizeMultiplier??1.2,style:[L.label,{color:ke,opacity:ee?.7:1},w],children:a.label}):null)]})},CENTER_KEY):null;var lt;const dt=U?(0,_jsxRuntime.jsx)(_reactNative.View,{style:$?L.accessoryInline:L.accessoryStacked,onLayout:e=>G(e.nativeEvent.layout.height),testID:A?`${A}-accessory`:void 0,children:q}):null,ct=(0,_jsxRuntime.jsxs)(_reactNative.View,{style:$?[L.tabRow,L.tabRowInline]:L.tabRow,onLayout:e=>{const{width:t,height:i}=e.nativeEvent.layout;ne(t),oe(i)},children:[te&&ve>0&&(!Y||Ae>0)?(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{pointerEvents:"none",style:[L.pill,{width:ve,height:Y?Ae:M,left:Re,top:Ie,backgroundColor:Pe,borderRadius:Y?activeBgRadius(Ae,Ae/2):activeBgRadius(M,E.radius.pill),..._corners.smoothCorners,transform:[{translateX:Le}]},N]}):null,J&&ge>0?(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{pointerEvents:"none",style:[L.bubble,E.shadow.elevated,{width:48,height:48,borderRadius:E.radius.pill,..._corners.smoothCorners,left:Ne,top:Se,backgroundColor:Ce.primary,borderColor:Ce.surface,transform:[{translateX:Le}]},N]}):null,(ut=i.map(e=>{const t=e.key===n,i=t?Oe:ke,a=t?ze:ke,s="string"==typeof e.icon?{name:e.icon,variant:"bold"}:e.icon,l=t?e.activeIcon??s:e.icon,d=fe.current[e.key],c=ye.current[e.key],u=badgeVariantOf(e.badge??null),p=badgeAccessibilitySuffix(e.badge??null,I),h=ee&&!t?.7:1,_=J&&t||ee?Ce.primary:Ce.surface,m=hasLabel(e),g=m&&(!Q||t),b=(0,_jsxRuntime.jsxs)(_reactNative.Animated.View,{style:[L.iconWrap,{width:V+4,height:V+4,opacity:h,transform:[{scale:d}]}],children:[(0,_index3.renderSlotIcon)(l,{color:a,size:V,focused:t,disabled:!1}),u?(0,_jsxRuntime.jsx)(_index4.Badge,{variant:u,value:"standard"===u?e.badge:void 0,tone:"danger",accessible:!1,style:"dot"===u?L.badgeDotPosition:L.badgePillPosition,badgeStyle:["dot"===u?L.badgeDot:L.badgePill,{borderColor:_}],textStyle:L.badgeText}):null]}),x=J?(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{style:{top:c.interpolate({inputRange:[0,1],outputRange:[0,-14]})},children:b}):b,f=g?(0,_jsxRuntime.jsx)(_reactNative.Animated.Text,{numberOfLines:1,maxFontSizeMultiplier:j??E.settings.maxFontSizeMultiplier??1.2,style:[L.label,Q?L.labelInline:null,{color:i,opacity:Q?c:h,fontWeight:t?E.weight.semibold:E.weight.normal},w],children:e.label}):null,v=(0,_jsxRuntime.jsx)(_reactNative.Pressable,{onPress:()=>(e=>{H&&z(y),e.key!==n&&!1!==o&&(0,_index2.triggerHaptic)(o);const t=fe.current[e.key];t&&popIcon(t),r(e.key)})(e),accessibilityRole:"tab",accessibilityState:{selected:t},"aria-selected":t,accessibilityLabel:`${e.label}${p}`,accessibilityHint:I.switchesTo(e.label),hitSlop:{top:6,bottom:6,left:6,right:6},...(0,_hitSlop.hitSlopMarker)({top:6,bottom:6,left:6,right:6}),style:({pressed:e})=>[L.tab,Y?L.tabTile:null,e?{opacity:.85}:null],testID:A?`${A}-tab-${e.key}`:void 0,children:Q?(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[L.expandPill,{height:M,paddingHorizontal:t&&m?E.space.md:Math.max(0,(M-(V+4))/2)}],children:[(0,_jsxRuntime.jsx)(_reactNative.View,{pointerEvents:"none",style:[L.expandFill,{borderRadius:activeBgRadius(M,M/2),..._corners.smoothCorners,backgroundColor:t?Ce["primary-soft"]:"transparent"},t?N:null]}),x,f]}):(0,_jsxRuntime.jsxs)(_jsxRuntime.Fragment,{children:[x,f]})},e.key);return Q?(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{style:{flex:c.interpolate({inputRange:[0,1],outputRange:[1,m?1.5:1]})},children:v},e.key):v}),st?[...ut.slice(0,se),st,...ut.slice(se)]:ut),"underline"===l&&ge>0?(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{pointerEvents:"none",style:[L.underline,"top"===d?L.underlineTop:L.underlineBottom,"top"===d?{top:-qe-Z}:{bottom:-qe},{width:ge,height:3,backgroundColor:Ce.primary,transform:[{translateX:Le}]},N]}):null]});var ut;return(0,_jsxRuntime.jsx)(_reactNative.View,{ref:t,testID:A,accessibilityRole:"tablist",style:[L.outer,{paddingHorizontal:Fe,paddingTop:Math.max(He,ot),paddingBottom:Xe},R],children:(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[K?L.floatingBar:L.dockedBar,$?L.barInline:null,tt,{backgroundColor:De,borderColor:at,borderRadius:Ye,..._corners.smoothCorners},K?{borderWidth:it,paddingHorizontal:Ue,paddingVertical:qe}:{borderTopWidth:it,borderBottomWidth:it,borderLeftWidth:it,borderRightWidth:it,paddingHorizontal:Je,paddingTop:qe,paddingBottom:$e}],children:[dt,ct]})})});BottomNavigation.displayName="BottomNavigation";const buildStyles=e=>_reactNative.StyleSheet.create({outer:{backgroundColor:"transparent"},dockedBar:{paddingHorizontal:e.space.xs},floatingBar:{paddingVertical:e.space.sm,paddingHorizontal:e.space.sm},tabRow:{flexDirection:"row",alignItems:"stretch",position:"relative"},tabRowInline:{flex:1},barInline:{flexDirection:"row",alignItems:"center"},accessoryStacked:{marginBottom:e.space.xs},accessoryInline:{flexShrink:0,marginRight:e.space.xs},tab:{flex:1,minHeight:44,alignItems:"center",justifyContent:"center",paddingVertical:e.space.xs,gap:e.space.xs},tabTile:{paddingVertical:e.space.sm,gap:e.space.xxs},centerCell:{flex:1,minHeight:44,alignItems:"center",justifyContent:"center"},centerPressable:{alignItems:"center",maxWidth:"100%",gap:e.space.xs},centerCircle:{alignItems:"center",justifyContent:"center"},iconWrap:{alignItems:"center",justifyContent:"center",position:"relative"},label:{fontSize:e.text.xs.size,lineHeight:e.text.xs.size*e.leading.heading,textAlign:"center",includeFontPadding:!1},labelInline:{fontSize:e.text.sm.size,lineHeight:e.text.sm.size*e.leading.heading,flexShrink:1,includeFontPadding:!1},expandPill:{flexDirection:"row",alignItems:"center",justifyContent:"center",gap:e.space.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:e.radius.none,borderTopRightRadius:e.radius.none,..._corners.smoothCorners},underlineTop:{borderBottomLeftRadius:e.radius.none,borderBottomRightRadius:e.radius.none,..._corners.smoothCorners},badgePillPosition:{position:"absolute",top:-4,right:-8},badgePill:{minWidth:18,height:18,paddingHorizontal:e.space.xs,paddingVertical:e.space.xxs,borderWidth:1.5},badgeDotPosition:{position:"absolute",top:-2,right:-2},badgeDot:{width:10,height:10,borderRadius:e.radius.pill,borderWidth:1.5},badgeText:{lineHeight:13}});var _default=exports.default=BottomNavigation;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.useBottomSheet=exports.default=exports.DEFAULT_BOTTOM_SHEET_LABELS=exports.BottomSheet=void 0;var cache,_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"),_usePresenceMotion=require("../../hooks/usePresenceMotion.js"),_index=require("../../theme/index.js"),_index2=require("../../utils/index.js"),_corners=require("../../utils/corners.js"),_warnInvalidValue=require("../../utils/warnInvalidValue.js"),_ModalSafeArea=require("../ModalSafeArea/ModalSafeArea.js"),_index3=require("../Text/index.js"),_ToastProvider=require("../Toast/ToastProvider.js"),_jsxRuntime=require("react/jsx-runtime");function _interopRequireWildcard(e,t){if(!t&&e&&e.__esModule)return e;var a,r,n=Object.defineProperty,o={__proto__:null,default:e};if(Object(e)!==e)return o;if(cache||"function"!=typeof WeakMap||(cache=new WeakMap),cache){if(cache.has(e))return cache.get(e);cache.set(e,o)}for(r in e)"default"!==r&&{}.hasOwnProperty.call(e,r)&&((a=n&&Object.getOwnPropertyDescriptor(e,r))&&(a.get||a.set)?n(o,r,a):o[r]=e[r]);return o}const DEFAULT_BOTTOM_SHEET_LABELS=exports.DEFAULT_BOTTOM_SHEET_LABELS=Object.freeze({close:"Close bottom sheet",dragHandle:"Drag handle"}),DEFAULT_SNAP_POINTS=["content"],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("[@webority/mobile-ui] BottomSheet: 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=e=>{const{snapPoints:t=DEFAULT_SNAP_POINTS,visible:a,onClose:r,snapIndex:n,onSnapChange:o,onAnimate:i,onAfterClose:s,enablePanDownToClose:c=!0,enableBackdropPress:l=!0,onBeforeClose:u,title:d,labels:_,scrollable:h=!1,scrollRef:m,onScroll:v,onContentSizeChange:f,onScrollLayout:b,scrollEventThrottle:S,keyboardBehavior:p="shift",inline:R=!1,presentation:x="sheet",animateMount:y=!0,handleIndicatorStyle:N,containerStyle:g,header:w,footer:j,headerStyle:C,footerStyle:M,children:T,accessibilityLabel:E,accessibilityViewIsModal:k,testID:O}=e;(0,_warnInvalidValue.warnInvalidValue)("BottomSheet","presentation",e.presentation,["sheet","dialog","auto"]),(0,_warnInvalidValue.warnInvalidValue)("BottomSheet","keyboardBehavior",e.keyboardBehavior,["none","shift"]);const I=(0,_react.useMemo)(()=>({...DEFAULT_BOTTOM_SHEET_LABELS,..._}),[_]),B=null!=w||null!=d,A=R?"inline":"modal",P=(0,_index.useTheme)(),H=(0,_usePresenceMotion.usePresenceMotion)(),L=(0,_reactNativeSafeAreaContext.useSafeAreaInsets)(),[D,V]=(0,_react.useState)(()=>_reactNative.Dimensions.get("window").height),[G,q]=(0,_react.useState)(()=>_reactNative.Dimensions.get("window").width),F=(0,_react.useCallback)(e=>{const{height:t,width:a}=e.nativeEvent.layout;t>0&&V(e=>e===t?e:t),a>0&&q(e=>e===a?e:a)},[]),U=(0,_reactNative.useWindowDimensions)(),J="dialog"===x||"auto"===x&&Math.min(U.width,U.height)>=600,z=Math.min(560,G-2*P.space.xl),[W,K]=(0,_ModalSafeArea.useModalInsets)(),Y="modal"===A?W.top:L.top,$="modal"===A?W.bottom:L.bottom,X=t.includes("content"),[Q,Z]=useMeasuredHeight(),[ee,te]=useMeasuredHeight(),[ae,re,ne]=useMeasuredHeight(),[oe,ie]=useMeasuredHeight(),se=J?P.space.md:Q,ce=X?Math.min(se+(B?ee:0)+ae+(null!=j?oe:0)+$,D-Y):0,le=(0,_react.useCallback)((e,t)=>{X&&ne(t),f?.(e,t)},[X,f,ne]),ue=(0,_react.useMemo)(()=>resolveSnapPoints(t,D,ce),[t,D,ce]),de=D,he=ue[ue.length-1]??0,me=(0,_reactNativeReanimated.useSharedValue)(de),ve=(0,_reactNativeReanimated.useSharedValue)(de),fe=(0,_reactNativeReanimated.useSharedValue)(1),be=(0,_reactNativeReanimated.useSharedValue)(-1),[Se,pe]=(0,_react.useState)(-1),Re=(0,_react.useRef)(!1),[xe,ye]=(0,_react.useState)(!1),[Ne,ge]=(0,_react.useState)(!1),we=(0,_react.useRef)(!1),je=(0,_react.useRef)(s);je.current=s;const[Ce,Me]=(0,_react.useState)(!1),Te=(0,_react.useRef)(!y&&a),Ee=(0,_react.useRef)(-1),ke=(0,_react.useRef)(!1);ke.current="modal"===A?Ne:Ce;const Oe=(0,_react.useRef)(u);Oe.current=u;const Ie=(0,_react.useRef)(r);Ie.current=r;const Be=(0,_react.useRef)(!1),Ae=(0,_react.useRef)(!0),Pe=(0,_react.useRef)([]),He=(0,_react.useCallback)(e=>{const t=Pe.current;Pe.current=[];for(const a of t)a(e)},[]);(0,_react.useEffect)(()=>(Ae.current=!0,()=>{Ae.current=!1,He(!1)}),[He]);const Le=(0,_react.useCallback)(e=>{if(e<0||e>=ue.length)return de;const t=ue[e];return J?(D-t)/2:D-t},[ue,D,de,J]),De=(0,_react.useCallback)(e=>{Ee.current=e;Se!==e&&(pe(e),be.value=e,e>=0&&o?.(e))},[Se,be,o]),Ve=(0,_react.useCallback)(()=>{Re.current=!1,be.value<0&&(we.current=!0,"modal"===A?(ye(!1),"ios"!==_reactNative.Platform.OS&&ge(!1)):Me(!1))},[A,be]),Ge=(0,_react.useCallback)(()=>{we.current&&ge(!1)},[]);(0,_react.useEffect)(()=>{("modal"===A?!Ne:!Ce)&&we.current&&(we.current=!1,je.current?.(),He(!0))},[A,Ne,Ce,He]);const qe=(0,_react.useCallback)((e,t,a)=>{Re.current=!0,i?.(t,a),me.value=(0,_reactNativeReanimated.withSpring)(e,SPRING_CONFIG,e=>{"worklet";e&&(0,_reactNativeReanimated.runOnJS)(Ve)()})},[i,me,Ve]),Fe=(0,_react.useCallback)(e=>{const t="number"==typeof e?clamp(e,0,ue.length-1):Se>=0?Se:0,a=be.value,r=Le(t);return we.current=!1,He(!1),"modal"===A?(ge(!0),ye(!0)):Me(!0),a<0&&Te.current?(me.value=r,fe.value=1,De(t),void i?.(a,t)):a<0&&H.reduced?(me.value=r,fe.value=0,fe.value=(0,_reactNativeReanimated.withTiming)(1,{duration:H.duration("fast"),easing:_reactNativeReanimated.Easing.bezier(...P.motion.ease.decelerate),reduceMotion:_usePresenceMotion.PRESENCE_REDUCE_MOTION}),De(t),void i?.(a,t)):(a<0&&(me.value=de,fe.value=1),De(t),void qe(r,a,t))},[qe,de,Se,be,A,i,H,fe,ue.length,De,He,P.motion.ease.decelerate,me,Le]),Ue=(0,_react.useCallback)(()=>new Promise(e=>{if(Ee.current<0)return void(ke.current?Pe.current.push(e):e(!0));Pe.current.push(e),Te.current=!1;const t=be.value;De(-1),Re.current=!0,i?.(t,-1);const a=H.reduced?fe:me,r=H.reduced?0:de;a.value=(0,_reactNativeReanimated.withTiming)(r,{duration:H.duration("fast"),easing:_reactNativeReanimated.Easing.bezier(...P.motion.ease.accelerate),reduceMotion:_usePresenceMotion.PRESENCE_REDUCE_MOTION},e=>{"worklet";e&&(0,_reactNativeReanimated.runOnJS)(Ve)()})}),[de,be,Ve,i,H,fe,De,me,P.motion.ease.accelerate]),Je=(0,_react.useCallback)((e,t,a)=>{const r=Oe.current;if(!r)return void e();if(Be.current)return void t?.();const n=r();"boolean"!=typeof n?(Be.current=!0,a?.(),n.then(a=>{Be.current=!1,a&&Ae.current&&Ee.current>=0?e():t?.()},e=>{throw Be.current=!1,e})):(n?e:t)?.()},[]),ze=(0,_react.useCallback)(()=>new Promise(e=>{Ee.current<0?e(!0):Je(()=>{Ie.current(),Ue(),e(!0)},()=>e(!1))}),[Ue,Je]),We=(0,_react.useCallback)(()=>{Ie.current()},[]),Ke=(0,_react.useCallback)(()=>{l&&ze()},[l,ze]),Ye=(0,_react.useRef)(null);(0,_react.useEffect)(()=>{const e=Ye.current!==a;Ye.current=a,e?a?Fe(n??0):Ue():a&&"number"==typeof n&&n!==be.value&&Fe(n)},[a,n]);const $e=(0,_react.useRef)({hostHeight:D,contentSnap:ce});(0,_react.useEffect)(()=>{const e=$e.current;if(e.hostHeight===D&&e.contentSnap===ce)return;if($e.current={hostHeight:D,contentSnap:ce},e.hostHeight===D&&be.value<0)return;const t=Le(be.value);me.value=Te.current?t:(0,_reactNativeReanimated.withSpring)(t,SPRING_CONFIG)},[D,ce]);const Xe=D-he,Qe=(0,_react.useMemo)(()=>ue.map(e=>D-e),[ue,D]),Ze=(0,_react.useCallback)(()=>{const e=Ee.current;e<0||qe(Le(e),e,e)},[qe,Le]),et=(0,_react.useCallback)((e,t)=>{const a=be.value;-1!==e?(De(e),qe(t,a,e)):Je(()=>{_reactNative.Keyboard.dismiss(),(0,_index2.triggerHaptic)("selection"),Ie.current(),Ue()},Ze,Ze)},[qe,Ue,be,Je,De,Ze]),tt=(0,_react.useMemo)(()=>_reactNativeGestureHandler.Gesture.Native().withTestId(O?`${O}-content-gesture`:"bottom-sheet-content-gesture"),[O]),at=(0,_react.useMemo)(()=>{const e=Qe,t=de,a=Xe,r=c;return _reactNativeGestureHandler.Gesture.Pan().withTestId(O?`${O}-pan-gesture`:"bottom-sheet-pan-gesture").activeOffsetY([-10,10]).failOffsetX([-15,15]).onStart(()=>{"worklet";ve.value=me.value}).onUpdate(e=>{"worklet";const t=ve.value+e.translationY;me.value=t<a?a+.25*(t-a):t}).onEnd(a=>{"worklet";const n=me.value;if(a.velocityY>1e3)return r?void(0,_reactNativeReanimated.runOnJS)(et)(-1,t):void(0,_reactNativeReanimated.runOnJS)(et)(0,e[0]);let o=0,i=Math.abs(n-e[0]);for(let t=1;t<e.length;t++){const a=Math.abs(n-e[t]);a<i&&(i=a,o=t)}const s=e[0];r&&n-s>80?(0,_reactNativeReanimated.runOnJS)(et)(-1,t):(0,_reactNativeReanimated.runOnJS)(et)(o,e[o])})},[de,ve,c,et,Xe,Qe,O,me]),{height:rt}=(0,_reactNativeKeyboardController.useReanimatedKeyboardAnimation)(),nt="shift"===p,ot=(0,_reactNativeReanimated.useDerivedValue)(()=>nt?rt.value:0),it=ue[Se>=0?Se:0]??he,st=P.space.md,ct=(0,_reactNativeReanimated.useAnimatedStyle)(()=>{if(J){const e=ot.value,t=D+e-it-st,a=e<0&&me.value>t?t:me.value;return{top:a<Y?Y:a,opacity:fe.value}}const e=me.value+ot.value,t=ot.value<0?Y:Xe;return{top:e<t?t:e,opacity:fe.value}}),lt=(0,_reactNativeReanimated.useAnimatedStyle)(()=>{const e=ot.value;if(J){const t=D+e-it-st,a=e<0&&me.value>t?t:me.value,r=D+e-st-(a<Y?Y:a);return{height:r<0?0:r>it?it:r}}const t=e<0?Y:Xe,a=me.value+e,r=D+e-(a<t?t:a);return{height:r<0?0:r>he?he:r}}),ut=Se>=0,dt=(0,_react.useMemo)(()=>buildStyles(P),[P]),_t=(0,_react.useCallback)(()=>{l&&Je(()=>{(0,_index2.triggerHaptic)("selection"),Ie.current(),Ue()})},[l,Ue,Je]),ht=(0,_react.useMemo)(()=>_reactNativeGestureHandler.Gesture.Tap().withTestId(O?`${O}-backdrop-gesture`:"bottom-sheet-backdrop-gesture").maxDuration(250).onEnd((_e,e)=>{"worklet";e&&(0,_reactNativeReanimated.runOnJS)(_t)()}),[_t,O]),mt=(0,_react.useMemo)(()=>({snapIndex:Se,snapPoints:ue,close:We,requestClose:ze}),[Se,ue,We,ze]);if("inline"===A&&!Ce)return null;if("modal"===A&&!Ne)return null;const vt=(0,_jsxRuntime.jsxs)(_reactNative.View,{collapsable:!1,style:["modal"===A?dt.backdropModal:dt.backdropInline,{backgroundColor:P.colors.scrim}],onLayout:F,testID:O,accessibilityViewIsModal:k??ut,children:[(0,_jsxRuntime.jsx)(_reactNativeGestureHandler.GestureDetector,{gesture:ht,children:(0,_jsxRuntime.jsx)(_reactNativeReanimated.default.View,{style:_reactNative.StyleSheet.absoluteFill,accessibilityRole:"button",accessibilityLabel:I.close})}),(0,_jsxRuntime.jsx)(_reactNativeReanimated.default.View,{accessibilityRole:"alert",accessibilityLabel:E,accessibilityViewIsModal:k??ut,accessibilityActions:[{name:"escape",label:I.close}],onAccessibilityAction:e=>{"escape"===e.nativeEvent.actionName&&Ke()},onAccessibilityEscape:Ke,style:[dt.sheet,{height:he,backgroundColor:P.colors.surface,borderTopLeftRadius:P.radius.xl,borderTopRightRadius:P.radius.xl,..._corners.smoothCorners,...P.shadow.modal},J?{height:it,left:(G-z)/2,right:void 0,width:z,borderBottomLeftRadius:P.radius.xl,borderBottomRightRadius:P.radius.xl}:null,g,ct],children:(0,_jsxRuntime.jsxs)(SheetBody,{style:[dt.body,lt],keyboardOffset:ot,children:[J?(0,_jsxRuntime.jsx)(_reactNative.View,{style:{height:P.space.md}}):(0,_jsxRuntime.jsx)(_reactNativeGestureHandler.GestureDetector,{gesture:at,children:(0,_jsxRuntime.jsx)(_reactNative.View,{style:dt.handleRow,onLayout:X?Z:void 0,accessible:!0,accessibilityLabel:I.dragHandle,accessibilityHint:"Drag up or down to resize the sheet, or swipe down to close it",testID:O?`${O}-handle`:"bottom-sheet-handle",children:(0,_jsxRuntime.jsx)(_reactNative.View,{style:[dt.handle,{backgroundColor:P.colors.border},N]})})}),B&&(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[dt.header,C],onLayout:X?te:void 0,children:[null!=d?(0,_jsxRuntime.jsx)(_index3.Text,{variant:"title",accessibilityRole:"header",children:d}):null,w]}),h?(0,_jsxRuntime.jsx)(_reactNativeGestureHandler.GestureDetector,{gesture:tt,children:(0,_jsxRuntime.jsx)(_reactNative.ScrollView,{ref:m,style:dt.scrollContent,onScroll:v,onContentSizeChange:le,onLayout:b,scrollEventThrottle:S,keyboardShouldPersistTaps:"always",keyboardDismissMode:"none",children:T})}):(0,_jsxRuntime.jsx)(_reactNative.View,{style:X?[dt.content,{overflow:"visible"}]:dt.content,children:X?(0,_jsxRuntime.jsx)(_reactNative.View,{onLayout:re,children:T}):T}),null!=j&&(0,_jsxRuntime.jsx)(_reactNative.View,{style:[dt.footer,M],onLayout:X?ie:void 0,children:j})]})})]}),ft=(0,_jsxRuntime.jsx)(BottomSheetContext.Provider,{value:mt,children:vt});return"modal"===A?(0,_jsxRuntime.jsx)(_reactNative.Modal,{transparent:!0,visible:xe,onRequestClose:Ke,onDismiss:"ios"===_reactNative.Platform.OS?Ge:void 0,statusBarTranslucent:!0,navigationBarTranslucent:!0,animationType:"none",supportedOrientations:["portrait","landscape"],children:(0,_jsxRuntime.jsxs)(_ModalSafeArea.ModalSafeArea,{onInsets:K,children:["android"===_reactNative.Platform.OS?(0,_jsxRuntime.jsx)(_reactNativeGestureHandler.GestureHandlerRootView,{style:dt.modalRoot,children:ft}):ft,(0,_jsxRuntime.jsx)(_ToastProvider.ToastHost,{})]})}):ft};exports.BottomSheet=BottomSheet;const 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:e.space.md,paddingBottom:e.space.xl},header:{},footer:{},handle:{width:36,height:4,borderRadius:e.radius.pill,..._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.DEFAULT_BOTTOM_SHEET_LABELS=exports.BottomSheet=void 0;var cache,_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"),_usePresenceMotion=require("../../hooks/usePresenceMotion.js"),_index=require("../../theme/index.js"),_index2=require("../../utils/index.js"),_corners=require("../../utils/corners.js"),_warnInvalidValue=require("../../utils/warnInvalidValue.js"),_OverlayActions=require("../Dialog/OverlayActions.js"),_ModalSafeArea=require("../ModalSafeArea/ModalSafeArea.js"),_index3=require("../Text/index.js"),_ToastProvider=require("../Toast/ToastProvider.js"),_jsxRuntime=require("react/jsx-runtime");function _interopRequireWildcard(e,t){if(!t&&e&&e.__esModule)return e;var a,r,n=Object.defineProperty,o={__proto__:null,default:e};if(Object(e)!==e)return o;if(cache||"function"!=typeof WeakMap||(cache=new WeakMap),cache){if(cache.has(e))return cache.get(e);cache.set(e,o)}for(r in e)"default"!==r&&{}.hasOwnProperty.call(e,r)&&((a=n&&Object.getOwnPropertyDescriptor(e,r))&&(a.get||a.set)?n(o,r,a):o[r]=e[r]);return o}const DEFAULT_BOTTOM_SHEET_LABELS=exports.DEFAULT_BOTTOM_SHEET_LABELS=Object.freeze({close:"Close bottom sheet",dragHandle:"Drag handle"}),DEFAULT_SNAP_POINTS=["content"],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("[@webority/mobile-ui] BottomSheet: 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=e=>{const{snapPoints:t=DEFAULT_SNAP_POINTS,visible:a,onClose:r,snapIndex:n,onSnapChange:o,onAnimate:i,onAfterClose:s,enablePanDownToClose:c=!0,enableBackdropPress:l=!0,onBeforeClose:u,title:d,labels:_,scrollable:h=!1,scrollRef:v,onScroll:m,onContentSizeChange:f,onScrollLayout:S,scrollEventThrottle:b,keyboardBehavior:p="shift",inline:x=!1,presentation:R="sheet",animateMount:y=!0,handleIndicatorStyle:N,containerStyle:g,header:w,actions:j,actionsLayout:C="auto",footer:T,headerStyle:M,footerStyle:O,children:E,accessibilityLabel:k,accessibilityViewIsModal:A,testID:I}=e;(0,_warnInvalidValue.warnInvalidValue)("BottomSheet","presentation",e.presentation,["sheet","dialog","auto"]),(0,_warnInvalidValue.warnInvalidValue)("BottomSheet","keyboardBehavior",e.keyboardBehavior,["none","shift"]),(0,_warnInvalidValue.warnInvalidValue)("BottomSheet","actionsLayout",e.actionsLayout,_OverlayActions.ACTIONS_LAYOUTS);const B=(0,_react.useMemo)(()=>({...DEFAULT_BOTTOM_SHEET_LABELS,..._}),[_]),L=null!=w||null!=d,P=null!=j&&j.length>0,H=null!=T||P,V=x?"inline":"modal",D=(0,_index.useTheme)(),G=(0,_usePresenceMotion.usePresenceMotion)(),q=(0,_reactNativeSafeAreaContext.useSafeAreaInsets)(),[F,U]=(0,_react.useState)(()=>_reactNative.Dimensions.get("window").height),[J,z]=(0,_react.useState)(()=>_reactNative.Dimensions.get("window").width),W=(0,_react.useCallback)(e=>{const{height:t,width:a}=e.nativeEvent.layout;t>0&&U(e=>e===t?e:t),a>0&&z(e=>e===a?e:a)},[]),Y=(0,_reactNative.useWindowDimensions)(),K="dialog"===R||"auto"===R&&Math.min(Y.width,Y.height)>=600,$=Math.min(560,J-2*D.space.xl),[X,Q]=(0,_ModalSafeArea.useModalInsets)(),Z="modal"===V?X.top:q.top,ee="modal"===V?X.bottom:q.bottom,te=t.includes("content"),[ae,re]=useMeasuredHeight(),[ne,oe]=useMeasuredHeight(),[ie,se,ce]=useMeasuredHeight(),[le,ue]=useMeasuredHeight(),de=K?D.space.md:ae,he=te?Math.min(de+(L?ne:0)+ie+(H?le:0)+ee,F-Z):0,ve=(0,_react.useCallback)((e,t)=>{te&&ce(t),f?.(e,t)},[te,f,ce]),me=(0,_react.useMemo)(()=>resolveSnapPoints(t,F,he),[t,F,he]),fe=F,Se=me[me.length-1]??0,be=(0,_reactNativeReanimated.useSharedValue)(fe),pe=(0,_reactNativeReanimated.useSharedValue)(fe),xe=(0,_reactNativeReanimated.useSharedValue)(1),Re=(0,_reactNativeReanimated.useSharedValue)(-1),[ye,Ne]=(0,_react.useState)(-1),ge=(0,_react.useRef)(!1),[we,je]=(0,_react.useState)(!1),[Ce,Te]=(0,_react.useState)(!1),Me=(0,_react.useRef)(!1),Oe=(0,_react.useRef)(s);Oe.current=s;const[Ee,ke]=(0,_react.useState)(!1),Ae=(0,_react.useRef)(!y&&a),Ie=(0,_react.useRef)(-1),Be=(0,_react.useRef)(!1);Be.current="modal"===V?Ce:Ee;const Le=(0,_react.useRef)(u);Le.current=u;const Pe=(0,_react.useRef)(r);Pe.current=r;const He=(0,_react.useRef)(!1),Ve=(0,_react.useRef)(!0),De=(0,_react.useRef)([]),Ge=(0,_react.useCallback)(e=>{const t=De.current;De.current=[];for(const a of t)a(e)},[]);(0,_react.useEffect)(()=>(Ve.current=!0,()=>{Ve.current=!1,Ge(!1)}),[Ge]);const qe=(0,_react.useCallback)(e=>{if(e<0||e>=me.length)return fe;const t=me[e];return K?(F-t)/2:F-t},[me,F,fe,K]),Fe=(0,_react.useCallback)(e=>{Ie.current=e;ye!==e&&(Ne(e),Re.value=e,e>=0&&o?.(e))},[ye,Re,o]),Ue=(0,_react.useCallback)(()=>{ge.current=!1,Re.value<0&&(Me.current=!0,"modal"===V?(je(!1),"ios"!==_reactNative.Platform.OS&&Te(!1)):ke(!1))},[V,Re]),Je=(0,_react.useCallback)(()=>{Me.current&&Te(!1)},[]);(0,_react.useEffect)(()=>{("modal"===V?!Ce:!Ee)&&Me.current&&(Me.current=!1,Oe.current?.(),Ge(!0))},[V,Ce,Ee,Ge]);const ze=(0,_react.useCallback)((e,t,a)=>{ge.current=!0,i?.(t,a),be.value=(0,_reactNativeReanimated.withSpring)(e,SPRING_CONFIG,e=>{"worklet";e&&(0,_reactNativeReanimated.runOnJS)(Ue)()})},[i,be,Ue]),We=(0,_react.useCallback)(e=>{const t="number"==typeof e?clamp(e,0,me.length-1):ye>=0?ye:0,a=Re.value,r=qe(t);return Me.current=!1,Ge(!1),"modal"===V?(Te(!0),je(!0)):ke(!0),a<0&&Ae.current?(be.value=r,xe.value=1,Fe(t),void i?.(a,t)):a<0&&G.reduced?(be.value=r,xe.value=0,xe.value=(0,_reactNativeReanimated.withTiming)(1,{duration:G.duration("fast"),easing:_reactNativeReanimated.Easing.bezier(...D.motion.ease.decelerate),reduceMotion:_usePresenceMotion.PRESENCE_REDUCE_MOTION}),Fe(t),void i?.(a,t)):(a<0&&(be.value=fe,xe.value=1),Fe(t),void ze(r,a,t))},[ze,fe,ye,Re,V,i,G,xe,me.length,Fe,Ge,D.motion.ease.decelerate,be,qe]),Ye=(0,_react.useCallback)(()=>new Promise(e=>{if(Ie.current<0)return void(Be.current?De.current.push(e):e(!0));De.current.push(e),Ae.current=!1;const t=Re.value;Fe(-1),ge.current=!0,i?.(t,-1);const a=G.reduced?xe:be,r=G.reduced?0:fe;a.value=(0,_reactNativeReanimated.withTiming)(r,{duration:G.duration("fast"),easing:_reactNativeReanimated.Easing.bezier(...D.motion.ease.accelerate),reduceMotion:_usePresenceMotion.PRESENCE_REDUCE_MOTION},e=>{"worklet";e&&(0,_reactNativeReanimated.runOnJS)(Ue)()})}),[fe,Re,Ue,i,G,xe,Fe,be,D.motion.ease.accelerate]),Ke=(0,_react.useCallback)((e,t,a)=>{const r=Le.current;if(!r)return void e();if(He.current)return void t?.();const n=r();"boolean"!=typeof n?(He.current=!0,a?.(),n.then(a=>{He.current=!1,a&&Ve.current&&Ie.current>=0?e():t?.()},e=>{throw He.current=!1,e})):(n?e:t)?.()},[]),$e=(0,_react.useCallback)(()=>new Promise(e=>{Ie.current<0?e(!0):Ke(()=>{Pe.current(),Ye(),e(!0)},()=>e(!1))}),[Ye,Ke]),Xe=(0,_react.useCallback)(()=>{Pe.current()},[]),Qe=(0,_react.useCallback)(()=>{l&&$e()},[l,$e]),Ze=(0,_react.useRef)(null);(0,_react.useEffect)(()=>{const e=Ze.current!==a;Ze.current=a,e?a?We(n??0):Ye():a&&"number"==typeof n&&n!==Re.value&&We(n)},[a,n]);const et=(0,_react.useRef)({hostHeight:F,contentSnap:he});(0,_react.useEffect)(()=>{const e=et.current;if(e.hostHeight===F&&e.contentSnap===he)return;if(et.current={hostHeight:F,contentSnap:he},e.hostHeight===F&&Re.value<0)return;const t=qe(Re.value);be.value=Ae.current?t:(0,_reactNativeReanimated.withSpring)(t,SPRING_CONFIG)},[F,he]);const tt=F-Se,at=(0,_react.useMemo)(()=>me.map(e=>F-e),[me,F]),rt=(0,_react.useCallback)(()=>{const e=Ie.current;e<0||ze(qe(e),e,e)},[ze,qe]),nt=(0,_react.useCallback)((e,t)=>{const a=Re.value;-1!==e?(Fe(e),ze(t,a,e)):Ke(()=>{_reactNative.Keyboard.dismiss(),(0,_index2.triggerHaptic)("selection"),Pe.current(),Ye()},rt,rt)},[ze,Ye,Re,Ke,Fe,rt]),ot=(0,_react.useMemo)(()=>_reactNativeGestureHandler.Gesture.Native().withTestId(I?`${I}-content-gesture`:"bottom-sheet-content-gesture"),[I]),it=(0,_react.useMemo)(()=>{const e=at,t=fe,a=tt,r=c;return _reactNativeGestureHandler.Gesture.Pan().withTestId(I?`${I}-pan-gesture`:"bottom-sheet-pan-gesture").activeOffsetY([-10,10]).failOffsetX([-15,15]).onStart(()=>{"worklet";pe.value=be.value}).onUpdate(e=>{"worklet";const t=pe.value+e.translationY;be.value=t<a?a+.25*(t-a):t}).onEnd(a=>{"worklet";const n=be.value;if(a.velocityY>1e3)return r?void(0,_reactNativeReanimated.runOnJS)(nt)(-1,t):void(0,_reactNativeReanimated.runOnJS)(nt)(0,e[0]);let o=0,i=Math.abs(n-e[0]);for(let t=1;t<e.length;t++){const a=Math.abs(n-e[t]);a<i&&(i=a,o=t)}const s=e[0];r&&n-s>80?(0,_reactNativeReanimated.runOnJS)(nt)(-1,t):(0,_reactNativeReanimated.runOnJS)(nt)(o,e[o])})},[fe,pe,c,nt,tt,at,I,be]),{height:st}=(0,_reactNativeKeyboardController.useReanimatedKeyboardAnimation)(),ct="shift"===p,lt=(0,_reactNativeReanimated.useDerivedValue)(()=>ct?st.value:0),ut=me[ye>=0?ye:0]??Se,dt=D.space.md,_t=(0,_reactNativeReanimated.useAnimatedStyle)(()=>{if(K){const e=lt.value,t=F+e-ut-dt,a=e<0&&be.value>t?t:be.value;return{top:a<Z?Z:a,opacity:xe.value}}const e=be.value+lt.value,t=lt.value<0?Z:tt;return{top:e<t?t:e,opacity:xe.value}}),ht=(0,_reactNativeReanimated.useAnimatedStyle)(()=>{const e=lt.value;if(K){const t=F+e-ut-dt,a=e<0&&be.value>t?t:be.value,r=F+e-dt-(a<Z?Z:a);return{height:r<0?0:r>ut?ut:r}}const t=e<0?Z:tt,a=be.value+e,r=F+e-(a<t?t:a);return{height:r<0?0:r>Se?Se:r}}),vt=ye>=0,mt=(0,_react.useMemo)(()=>buildStyles(D),[D]),ft=(0,_react.useCallback)(()=>{l&&Ke(()=>{(0,_index2.triggerHaptic)("selection"),Pe.current(),Ye()})},[l,Ye,Ke]),St=(0,_react.useMemo)(()=>_reactNativeGestureHandler.Gesture.Tap().withTestId(I?`${I}-backdrop-gesture`:"bottom-sheet-backdrop-gesture").maxDuration(250).onEnd((_e,e)=>{"worklet";e&&(0,_reactNativeReanimated.runOnJS)(ft)()}),[ft,I]),bt=(0,_react.useMemo)(()=>({snapIndex:ye,snapPoints:me,close:Xe,requestClose:$e}),[ye,me,Xe,$e]);if("inline"===V&&!Ee)return null;if("modal"===V&&!Ce)return null;const pt=(0,_jsxRuntime.jsxs)(_reactNative.View,{collapsable:!1,style:["modal"===V?mt.backdropModal:mt.backdropInline,{backgroundColor:D.colors.scrim}],onLayout:W,testID:I,accessibilityViewIsModal:A??vt,children:[(0,_jsxRuntime.jsx)(_reactNativeGestureHandler.GestureDetector,{gesture:St,children:(0,_jsxRuntime.jsx)(_reactNativeReanimated.default.View,{style:_reactNative.StyleSheet.absoluteFill,accessibilityRole:"button",accessibilityLabel:B.close})}),(0,_jsxRuntime.jsx)(_reactNativeReanimated.default.View,{accessibilityRole:"alert",accessibilityLabel:k,accessibilityViewIsModal:A??vt,accessibilityActions:[{name:"escape",label:B.close}],onAccessibilityAction:e=>{"escape"===e.nativeEvent.actionName&&Qe()},onAccessibilityEscape:Qe,style:[mt.sheet,{height:Se,backgroundColor:D.colors.surface,borderTopLeftRadius:D.radius.xl,borderTopRightRadius:D.radius.xl,..._corners.smoothCorners,...D.shadow.modal},K?{height:ut,left:(J-$)/2,right:void 0,width:$,borderBottomLeftRadius:D.radius.xl,borderBottomRightRadius:D.radius.xl}:null,g,_t],children:(0,_jsxRuntime.jsxs)(SheetBody,{style:[mt.body,ht],keyboardOffset:lt,children:[K?(0,_jsxRuntime.jsx)(_reactNative.View,{style:{height:D.space.md}}):(0,_jsxRuntime.jsx)(_reactNativeGestureHandler.GestureDetector,{gesture:it,children:(0,_jsxRuntime.jsx)(_reactNative.View,{style:mt.handleRow,onLayout:te?re:void 0,accessible:!0,accessibilityLabel:B.dragHandle,accessibilityHint:"Drag up or down to resize the sheet, or swipe down to close it",testID:I?`${I}-handle`:"bottom-sheet-handle",children:(0,_jsxRuntime.jsx)(_reactNative.View,{style:[mt.handle,{backgroundColor:D.colors.border},N]})})}),L&&(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[mt.header,M],onLayout:te?oe:void 0,children:[null!=d?(0,_jsxRuntime.jsx)(_index3.Text,{variant:"title",accessibilityRole:"header",children:d}):null,w]}),h?(0,_jsxRuntime.jsx)(_reactNativeGestureHandler.GestureDetector,{gesture:ot,children:(0,_jsxRuntime.jsx)(_reactNative.ScrollView,{ref:v,style:mt.scrollContent,onScroll:m,onContentSizeChange:ve,onLayout:S,scrollEventThrottle:b,keyboardShouldPersistTaps:"always",keyboardDismissMode:"none",children:E})}):(0,_jsxRuntime.jsx)(_reactNative.View,{style:te?[mt.content,{overflow:"visible"}]:mt.content,children:te?(0,_jsxRuntime.jsx)(_reactNative.View,{onLayout:se,children:E}):E}),H&&(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[mt.footer,O],onLayout:te?ue:void 0,children:[P?(0,_jsxRuntime.jsx)(_reactNative.View,{style:mt.actions,children:(0,_jsxRuntime.jsx)(_OverlayActions.OverlayActions,{actions:j??[],layout:C})}):null,T]})]})})]}),xt=(0,_jsxRuntime.jsx)(BottomSheetContext.Provider,{value:bt,children:pt});return"modal"===V?(0,_jsxRuntime.jsx)(_reactNative.Modal,{transparent:!0,visible:we,onRequestClose:Qe,onDismiss:"ios"===_reactNative.Platform.OS?Je: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:mt.modalRoot,children:xt}):xt,(0,_jsxRuntime.jsx)(_ToastProvider.ToastHost,{})]})}):xt};exports.BottomSheet=BottomSheet;const 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:e.space.md,paddingBottom:e.space.xl},header:{},actions:{padding:e.space.lg},footer:{},handle:{width:36,height:4,borderRadius:e.radius.pill,..._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.DEFAULT_CARD_LABELS=exports.Card=void 0;var cache,_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"),_themeStyles=require("../../utils/themeStyles.js"),_warnInvalidValue=require("../../utils/warnInvalidValue.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(!t&&e&&e.__esModule)return e;var i,s,r=Object.defineProperty,a={__proto__:null,default:e};if(Object(e)!==e)return a;if(cache||"function"!=typeof WeakMap||(cache=new WeakMap),cache){if(cache.has(e))return cache.get(e);cache.set(e,a)}for(s in e)"default"!==s&&{}.hasOwnProperty.call(e,s)&&((i=r&&Object.getOwnPropertyDescriptor(e,s))&&(i.get||i.set)?r(a,s,i):a[s]=e[s]);return a}const BACKGROUND_TOKENS=["bg","bg-subtle","bg-muted","surface","scrim","surface-inverse"],DEFAULT_CARD_LABELS=exports.DEFAULT_CARD_LABELS=Object.freeze({remove:"Remove",show:"Show",hide:"Hide",loading:"Loading"}),paddingMap={none:"none",sm:"sm",md:"lg",lg:"xl",xl:"2xl"},Card=exports.Card=_react.default.memo((0,_react.forwardRef)((e,t)=>{const{children:i,variant:s="elevated",elevation:r="card",radius:a="lg",padding:n="md",interactive:o=!1,bg:l,header:d,title:c,titleFont:u="sans",lead:h,action:_,headerActions:x,collapsible:m=!1,collapsed:p,defaultCollapsed:b=!1,onCollapsedChange:g,collapsedSummary:j,onRemove:y,separatorHeight:v=_reactNative.StyleSheet.hairlineWidth,footer:R,imageSource:f,imageHeight:S=160,imageAspectRatio:C,imageOverlay:w,loading:A=!1,gradient:q,onPress:N,haptic:F,contextMenu:L,accessibilityLabel:I,accessibilityHint:k,accessibilityRole:T,style:V,containerStyle:B,headerStyle:P,bodyStyle:D,footerStyle:M,borderRadius:z,testID:H,labels:E,onLayout:O,...W}=e;(0,_warnInvalidValue.warnInvalidValue)("Card","variant",e.variant,["elevated","outline","filled","flat"]),(0,_warnInvalidValue.warnInvalidValue)("Card","radius",e.radius,["sm","md","lg","xl"]),(0,_warnInvalidValue.warnInvalidValue)("Card","padding",e.padding,["none","sm","md","lg","xl"]),(0,_warnInvalidValue.warnInvalidValue)("Card","titleFont",e.titleFont,["sans","serif"]);const U=(0,_index.useTheme)(),G=(0,_react.useMemo)(()=>({...DEFAULT_CARD_LABELS,...E}),[E]),K=o||"function"==typeof N,$=(0,_useContextMenu.useContextMenu)(L,{haptic:F||!1,testID:H,accessibilityActions:W.accessibilityActions,onAccessibilityAction:W.onAccessibilityAction}),J=(0,_react.useMemo)(()=>(0,_mergeRefs.mergeRefs)(t,$.hostRef),[t,$.hostRef]),Q=K||$.enabled,{style:X,pressIn:Y,pressOut:Z}=(0,_usePressAnimation.usePressAnimation)({enabled:Q}),ee=stylesFor(U),te=Boolean(f),ie=U.space[paddingMap[n]],se=(0,_react.useMemo)(()=>q?"string"==typeof q?U.settings.gradients[q]??null:q:null,[q,U.settings.gradients]),re="flat"===s,ae=re?U.radius.none:z??U.radius[a],ne=resolveBackground(U,l),[oe,le]=(0,_useControllableState.useControllableState)({value:p,defaultValue:b,onChange:g}),de=m&&oe,ce=hasBuiltInHeaderContent(e),ue=Boolean(d)||ce,he=(0,_SquircleFill.useSquircle)(!te&&!se&&!re,ae,O),xe=_reactNative.StyleSheet.flatten([V,B])??{},me=xe.backgroundColor,pe=xe.borderColor,be=me??ne??("filled"===s?U.colors["bg-subtle"]:U.colors.surface),ge="outline"===s?U.size.border:0,je=pe??U.colors.border,ye="none"===r?void 0:U.shadow[r],ve="elevated"===s&&(0,_shadows.supportsBoxShadow)()&&ye?(0,_shadows.toBoxShadow)(ye):void 0,Re=he.active&&"elevated"===s&&!ve,fe=he.active&&!Re?{backgroundColor:"transparent",borderColor:"transparent"}:null,Se=(0,_react.useMemo)(()=>{const e={borderRadius:Re&&he.size?(0,_squircle.squircleHostRadius)(he.size.width,he.size.height,ae):ae,..._corners.smoothCorners,padding:te||he.active?U.space.none:ie,overflow:he.active?"visible":"hidden"};switch(s){case"flat":return{...e,backgroundColor:ne??U.colors.surface,borderBottomWidth:v,borderBottomColor:U.colors.border};case"outline":return{...e,backgroundColor:he.active?"transparent":ne??U.colors.surface,borderWidth:U.size.border,borderColor:he.active?"transparent":U.colors.border};case"filled":return{...e,backgroundColor:he.active?"transparent":ne??U.colors["bg-subtle"]};default:return{...e,backgroundColor:ne??U.colors.surface,...ve?{boxShadow:ve}:ye}}},[U,s,ye,ae,te,ie,he.active,he.size,ve,Re,ne,v]),Ce=(0,_react.useMemo)(()=>({..."number"==typeof C?{width:"100%",aspectRatio:C}:{width:"100%",height:S},borderTopLeftRadius:ae,borderTopRightRadius:ae,borderBottomLeftRadius:U.radius.none,borderBottomRightRadius:U.radius.none,..._corners.smoothCorners}),[U,ae,C,S]),we=c??"",Ae=(0,_jsxRuntime.jsxs)(_jsxRuntime.Fragment,{children:[(0,_jsxRuntime.jsxs)(_reactNative.View,{style:ee.titleColumn,children:[c?(0,_jsxRuntime.jsx)(_index3.Text,{variant:"title",accessibilityRole:"header",style:titleFaceFor(U,u),children:c}):null,h?(0,_jsxRuntime.jsx)(_index3.Text,{variant:"bodySmall",style:ee.lead,children:h}):null,de&&j?(0,_jsxRuntime.jsx)(_index3.Text,{variant:"caption",style:ee.lead,children:j}):null]}),isCardTextAction(_)?(0,_jsxRuntime.jsx)(CardTextActionButton,{action:_,haptic:F}):_?(0,_jsxRuntime.jsx)(_reactNative.View,{style:ee.actionNode,children:_}):null,x,m?(0,_jsxRuntime.jsx)(CardIconAction,{icon:de?"chevron-down":"chevron-up",label:`${de?G.show:G.hide} ${we}`.trim(),expanded:!de,onPress:()=>le(!de),haptic:F}):null,y?(0,_jsxRuntime.jsx)(CardIconAction,{icon:"trash",label:G.remove,onPress:y,color:U.colors["danger-text"],haptic:F}):null]}),qe=(0,_jsxRuntime.jsxs)(_jsxRuntime.Fragment,{children:[ue?(0,_jsxRuntime.jsx)(_reactNative.View,{style:[ee.header,!d&&ee.headerRow,de&&ee.headerFolded,P],children:d??Ae}):null,de?null:(0,_jsxRuntime.jsx)(_reactNative.View,{style:[ue||R?ee.body:null,D],children:i}),R&&!de?(0,_jsxRuntime.jsx)(_reactNative.View,{style:[ee.footer,M],children:R}):null]}),Ne=te?(0,_jsxRuntime.jsxs)(_jsxRuntime.Fragment,{children:[(0,_jsxRuntime.jsxs)(_reactNative.View,{style:ee.imageWrapper,children:[(0,_jsxRuntime.jsx)(_reactNative.Image,{source:f,resizeMode:"cover",style:Ce,accessibilityLabel:"",accessible:!1}),w?(0,_jsxRuntime.jsx)(_reactNative.View,{pointerEvents:"box-none",style:ee.imageOverlay,children:w}):null]}),(0,_jsxRuntime.jsx)(_reactNative.View,{style:{padding:ie},children:qe})]}):qe,Fe=se?(0,_jsxRuntime.jsxs)(_jsxRuntime.Fragment,{children:[(0,_jsxRuntime.jsx)(_index.Gradient,{gradient:se,style:_reactNative.StyleSheet.absoluteFill}),Ne]}):he.active&&he.size?(0,_jsxRuntime.jsxs)(_jsxRuntime.Fragment,{children:[(0,_jsxRuntime.jsx)(_SquircleFill.SquircleFill,{width:he.size.width,height:he.size.height,radius:ae,fill:be,stroke:ge?je:void 0,strokeWidth:ge}),(0,_jsxRuntime.jsx)(_reactNative.View,{style:[ee.squircleClip,{padding:ie,borderRadius:he.size?(0,_squircle.squircleHostRadius)(he.size.width,he.size.height,ae):ae}],children:Ne})]}):Ne;let Le;if(Q){const handlePress=e=>{K&&(F&&(0,_hapticUtils.triggerHaptic)(F),N?.(e))};Le=(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{style:X,children:(0,_jsxRuntime.jsx)(_reactNative.Pressable,{ref:J,onPress:handlePress,onPressIn:Y,onPressOut:Z,accessibilityRole:T??(K?"button":void 0),accessibilityLabel:I,accessibilityHint:k,testID:H,onLayout:he.onLayout,style:[Se,V,B,fe],...W,...$.hostProps,children:Fe})})}else Le=(0,_jsxRuntime.jsx)(_reactNative.View,{ref:t,accessibilityLabel:I,accessibilityHint:k,accessibilityRole:T,testID:H,onLayout:he.onLayout,style:[Se,V,B,fe],...W,children:Fe});return A?(0,_jsxRuntime.jsx)(CardSkeleton,{...e}):$.enabled?(0,_jsxRuntime.jsxs)(_jsxRuntime.Fragment,{children:[Le,$.renderSurface((0,_jsxRuntime.jsx)(_reactNative.View,{style:[Se,V,B,fe,ee.preview],children:Fe}))]}):Le}));Card.displayName="Card";const CardSkeleton=({variant:e="elevated",elevation:t,radius:i="lg",padding:s="md",bg:r,header:a,footer:n,imageSource:o,imageHeight:l=160,imageAspectRatio:d,borderRadius:c,containerStyle:u,headerStyle:h,bodyStyle:_,footerStyle:x,style:m,labels:p,...b})=>{const g=(0,_index.useTheme)(),j={...DEFAULT_CARD_LABELS,...p},y=paddingMap[s],v=g.space[y],R="flat"===e?g.radius.none:c??g.radius[i],f=void 0!==a||hasBuiltInHeaderContent(b),S=resolveBackground(g,r)??g.colors.surface,C="outline"===e?1:0,w="outline"===e?g.colors.border:void 0;return(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[{backgroundColor:S,borderRadius:R,..._corners.smoothCorners,borderWidth:C,borderColor:w,overflow:"hidden"},u,m],accessibilityRole:"progressbar",accessibilityLabel:j.loading,accessibilityState:{busy:!0},"aria-busy":!0,children:[void 0!==o?(0,_jsxRuntime.jsx)(_index2.Skeleton,{width:"100%",height:d?void 0:l,style:d?{aspectRatio:d,width:"100%"}:void 0}):null,f?(0,_jsxRuntime.jsx)(_reactNative.View,{style:[{padding:v,paddingBottom:g.space.sm},h],children:(0,_jsxRuntime.jsx)(_index2.Skeleton,{shape:"text",width:"60%",height:18})}):null,(0,_jsxRuntime.jsx)(_reactNative.View,{style:[{padding:v},_],children:(0,_jsxRuntime.jsx)(_index2.SkeletonText,{lines:3,fontSize:g.text.base.size,lastLineWidth:"55%"})}),void 0!==n?(0,_jsxRuntime.jsx)(_reactNative.View,{style:[{padding:v,paddingTop:g.space.sm,flexDirection:"row"},x],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:s,color:r,haptic:a})=>{const n=(0,_index.useTheme)();return(0,_jsxRuntime.jsx)(_reactNative.Pressable,{accessibilityRole:"button",accessibilityLabel:t,accessibilityState:void 0===s?void 0:{expanded:s},"aria-expanded":s,onPress:()=>{a&&(0,_hapticUtils.triggerHaptic)(a),i()},style:iconActionStyle,children:(0,_jsxRuntime.jsx)(_AppIcon.AppIcon,{name:e,size:20,color:r??n.colors["text-body"]})})},CardTextActionButton=({action:e,haptic:t})=>(0,_jsxRuntime.jsx)(_reactNative.Pressable,{accessibilityRole:"button",accessibilityLabel:e.accessibilityLabel??e.label,onPress:()=>{t&&(0,_hapticUtils.triggerHaptic)(t),e.onPress()},style:textActionStyle,children:(0,_jsxRuntime.jsx)(_index3.Text,{variant:"label",weight:"semibold",color:"brand",children:e.label})}),iconActionStyle={width:44,height:44,alignItems:"center",justifyContent:"center"},textActionStyle={minWidth:44,minHeight:44,alignItems:"center",justifyContent:"center"},titleFaceFor=(e,t)=>"serif"===t?(0,_index.fontFor)(e,"semibold","display"):{fontFamily:void 0,...(0,_index.fontFor)(e,"semibold")},resolveBackground=(e,t)=>{if(null!=t)return BACKGROUND_TOKENS.includes(t)?e.colors[t]:t},buildStyles=e=>_reactNative.StyleSheet.create({header:{marginBottom:e.space.md},headerRow:{flexDirection:"row",alignItems:"center",gap:e.space.sm},headerFolded:{marginBottom:e.space.none},titleColumn:{flex:1},lead:{marginTop:e.space.xs},actionNode:{flexShrink:0},body:{flexShrink:1},footer:{marginTop:e.space.md},imageWrapper:{position:"relative"},imageOverlay:{..._reactNative.StyleSheet.absoluteFill},squircleClip:{flexGrow:1,overflow:"hidden",..._corners.smoothCorners},preview:{margin:e.space.none,marginTop:e.space.none,marginBottom:e.space.none,marginLeft:e.space.none,marginRight:e.space.none,marginStart:e.space.none,marginEnd:e.space.none,marginHorizontal:e.space.none,marginVertical:e.space.none,position:"relative",top:0,left:0,width:"100%",height:"100%"}}),stylesFor=(0,_themeStyles.themeStyles)(buildStyles);var _default=exports.default=Card;
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=exports.DEFAULT_CARD_LABELS=exports.Card=void 0;var cache,_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"),_themeStyles=require("../../utils/themeStyles.js"),_warnInvalidValue=require("../../utils/warnInvalidValue.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(!t&&e&&e.__esModule)return e;var i,s,a=Object.defineProperty,r={__proto__:null,default:e};if(Object(e)!==e)return r;if(cache||"function"!=typeof WeakMap||(cache=new WeakMap),cache){if(cache.has(e))return cache.get(e);cache.set(e,r)}for(s in e)"default"!==s&&{}.hasOwnProperty.call(e,s)&&((i=a&&Object.getOwnPropertyDescriptor(e,s))&&(i.get||i.set)?a(r,s,i):r[s]=e[s]);return r}const BACKGROUND_TOKENS=["bg","bg-subtle","bg-muted","surface","scrim","surface-inverse"],DEFAULT_CARD_LABELS=exports.DEFAULT_CARD_LABELS=Object.freeze({remove:"Remove",show:"Show",hide:"Hide",loading:"Loading"}),paddingMap={none:"none",sm:"sm",md:"lg",lg:"xl",xl:"2xl"},Card=exports.Card=_react.default.memo((0,_react.forwardRef)((e,t)=>{const{children:i,variant:s="elevated",elevation:a="card",radius:r="lg",padding:n="md",interactive:o=!1,pressAnimation:l="scale",bg:d,header:c,title:u,titleFont:h="sans",lead:m,action:_,headerActions:x,collapsible:p=!1,collapsed:b,defaultCollapsed:g=!1,onCollapsedChange:j,collapsedSummary:y,onRemove:v,separatorHeight:R=_reactNative.StyleSheet.hairlineWidth,footer:f,imageSource:S,imageHeight:w=160,imageAspectRatio:C,imageOverlay:A,loading:q=!1,gradient:I,onPress:N,haptic:F,contextMenu:L,accessibilityLabel:V,accessibilityHint:k,accessibilityRole:T,style:B,containerStyle:P,headerStyle:D,bodyStyle:M,footerStyle:z,borderRadius:H,testID:E,labels:O,onLayout:W,...U}=e;(0,_warnInvalidValue.warnInvalidValue)("Card","variant",e.variant,["elevated","outline","filled","flat"]),(0,_warnInvalidValue.warnInvalidValue)("Card","radius",e.radius,["sm","md","lg","xl"]),(0,_warnInvalidValue.warnInvalidValue)("Card","padding",e.padding,["none","sm","md","lg","xl"]),(0,_warnInvalidValue.warnInvalidValue)("Card","titleFont",e.titleFont,["sans","serif"]),(0,_warnInvalidValue.warnInvalidValue)("Card","pressAnimation",e.pressAnimation,["scale","bounce","fade","sink","pulse","dim","false"]);const G=(0,_index.useTheme)(),K=(0,_react.useMemo)(()=>({...DEFAULT_CARD_LABELS,...O}),[O]),$=o||"function"==typeof N,J=(0,_useContextMenu.useContextMenu)(L,{haptic:F||!1,testID:E,accessibilityActions:U.accessibilityActions,onAccessibilityAction:U.onAccessibilityAction}),Q=(0,_react.useMemo)(()=>(0,_mergeRefs.mergeRefs)(t,J.hostRef),[t,J.hostRef]),X=$||J.enabled,{style:Y,pressIn:Z,pressOut:ee}=(0,_usePressAnimation.usePressAnimation)({preset:l||"scale",enabled:X&&!1!==l}),te=stylesFor(G),ie=Boolean(S),se=G.space[paddingMap[n]],ae=(0,_react.useMemo)(()=>I?"string"==typeof I?G.settings.gradients[I]??null:I:null,[I,G.settings.gradients]),re="flat"===s,ne=re?G.radius.none:H??G.radius[r],oe=resolveBackground(G,d),[le,de]=(0,_useControllableState.useControllableState)({value:b,defaultValue:g,onChange:j}),ce=p&&le,ue=hasBuiltInHeaderContent(e),he=Boolean(c)||ue,me=(0,_SquircleFill.useSquircle)(!ie&&!ae&&!re,ne,W),xe=_reactNative.StyleSheet.flatten([B,P])??{},pe=xe.backgroundColor,be=xe.borderColor,ge=pe??oe??("filled"===s?G.colors["bg-subtle"]:G.colors.surface),je="outline"===s?G.size.border:0,ye=be??G.colors.border,ve="none"===a?void 0:G.shadow[a],Re="elevated"===s&&(0,_shadows.supportsBoxShadow)()&&ve?(0,_shadows.toBoxShadow)(ve):void 0,fe=me.active&&"elevated"===s&&!Re,Se=me.active&&!fe?{backgroundColor:"transparent",borderColor:"transparent"}:null,we=(0,_react.useMemo)(()=>{const e={borderRadius:fe&&me.size?(0,_squircle.squircleHostRadius)(me.size.width,me.size.height,ne):ne,..._corners.smoothCorners,padding:ie||me.active?G.space.none:se,overflow:me.active?"visible":"hidden"};switch(s){case"flat":return{...e,backgroundColor:oe??G.colors.surface,borderBottomWidth:R,borderBottomColor:G.colors.border};case"outline":return{...e,backgroundColor:me.active?"transparent":oe??G.colors.surface,borderWidth:G.size.border,borderColor:me.active?"transparent":G.colors.border};case"filled":return{...e,backgroundColor:me.active?"transparent":oe??G.colors["bg-subtle"]};default:return{...e,backgroundColor:oe??G.colors.surface,...Re?{boxShadow:Re}:ve}}},[G,s,ve,ne,ie,se,me.active,me.size,Re,fe,oe,R]),Ce=(0,_react.useMemo)(()=>({..."number"==typeof C?{width:"100%",aspectRatio:C}:{width:"100%",height:w},borderTopLeftRadius:ne,borderTopRightRadius:ne,borderBottomLeftRadius:G.radius.none,borderBottomRightRadius:G.radius.none,..._corners.smoothCorners}),[G,ne,C,w]),Ae=u??"",qe=(0,_jsxRuntime.jsxs)(_jsxRuntime.Fragment,{children:[(0,_jsxRuntime.jsxs)(_reactNative.View,{style:te.titleColumn,children:[u?(0,_jsxRuntime.jsx)(_index3.Text,{variant:"title",accessibilityRole:"header",style:titleFaceFor(G,h),children:u}):null,m?(0,_jsxRuntime.jsx)(_index3.Text,{variant:"bodySmall",style:te.lead,children:m}):null,ce&&y?(0,_jsxRuntime.jsx)(_index3.Text,{variant:"caption",style:te.lead,children:y}):null]}),isCardTextAction(_)?(0,_jsxRuntime.jsx)(CardTextActionButton,{action:_,haptic:F}):_?(0,_jsxRuntime.jsx)(_reactNative.View,{style:te.actionNode,children:_}):null,x,p?(0,_jsxRuntime.jsx)(CardIconAction,{icon:ce?"chevron-down":"chevron-up",label:`${ce?K.show:K.hide} ${Ae}`.trim(),expanded:!ce,onPress:()=>de(!ce),haptic:F}):null,v?(0,_jsxRuntime.jsx)(CardIconAction,{icon:"trash",label:K.remove,onPress:v,color:G.colors["danger-text"],haptic:F}):null]}),Ie=(0,_jsxRuntime.jsxs)(_jsxRuntime.Fragment,{children:[he?(0,_jsxRuntime.jsx)(_reactNative.View,{style:[te.header,!c&&te.headerRow,ce&&te.headerFolded,D],children:c??qe}):null,ce?null:(0,_jsxRuntime.jsx)(_reactNative.View,{style:[he||f?te.body:null,M],children:i}),f&&!ce?(0,_jsxRuntime.jsx)(_reactNative.View,{style:[te.footer,z],children:f}):null]}),Ne=ie?(0,_jsxRuntime.jsxs)(_jsxRuntime.Fragment,{children:[(0,_jsxRuntime.jsxs)(_reactNative.View,{style:te.imageWrapper,children:[(0,_jsxRuntime.jsx)(_reactNative.Image,{source:S,resizeMode:"cover",style:Ce,accessibilityLabel:"",accessible:!1}),A?(0,_jsxRuntime.jsx)(_reactNative.View,{pointerEvents:"box-none",style:te.imageOverlay,children:A}):null]}),(0,_jsxRuntime.jsx)(_reactNative.View,{style:{padding:se},children:Ie})]}):Ie,Fe=ae?(0,_jsxRuntime.jsxs)(_jsxRuntime.Fragment,{children:[(0,_jsxRuntime.jsx)(_index.Gradient,{gradient:ae,style:_reactNative.StyleSheet.absoluteFill}),Ne]}):me.active&&me.size?(0,_jsxRuntime.jsxs)(_jsxRuntime.Fragment,{children:[(0,_jsxRuntime.jsx)(_SquircleFill.SquircleFill,{width:me.size.width,height:me.size.height,radius:ne,fill:ge,stroke:je?ye:void 0,strokeWidth:je}),(0,_jsxRuntime.jsx)(_reactNative.View,{style:[te.squircleClip,{padding:se,borderRadius:me.size?(0,_squircle.squircleHostRadius)(me.size.width,me.size.height,ne):ne}],children:Ne})]}):Ne;let Le;if(X){const handlePress=e=>{$&&(F&&(0,_hapticUtils.triggerHaptic)(F),N?.(e))};Le=(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{style:Y,children:(0,_jsxRuntime.jsx)(_reactNative.Pressable,{ref:Q,onPress:handlePress,onPressIn:Z,onPressOut:ee,accessibilityRole:T??($?"button":void 0),accessibilityLabel:V,accessibilityHint:k,testID:E,onLayout:me.onLayout,style:[we,B,P,Se],...U,...J.hostProps,children:Fe})})}else Le=(0,_jsxRuntime.jsx)(_reactNative.View,{ref:t,accessibilityLabel:V,accessibilityHint:k,accessibilityRole:T,testID:E,onLayout:me.onLayout,style:[we,B,P,Se],...U,children:Fe});return q?(0,_jsxRuntime.jsx)(CardSkeleton,{...e}):J.enabled?(0,_jsxRuntime.jsxs)(_jsxRuntime.Fragment,{children:[Le,J.renderSurface((0,_jsxRuntime.jsx)(_reactNative.View,{style:[we,B,P,Se,te.preview],children:Fe}))]}):Le}));Card.displayName="Card";const CardSkeleton=({variant:e="elevated",elevation:t,radius:i="lg",padding:s="md",bg:a,header:r,footer:n,imageSource:o,imageHeight:l=160,imageAspectRatio:d,borderRadius:c,containerStyle:u,headerStyle:h,bodyStyle:m,footerStyle:_,style:x,labels:p,...b})=>{const g=(0,_index.useTheme)(),j={...DEFAULT_CARD_LABELS,...p},y=paddingMap[s],v=g.space[y],R="flat"===e?g.radius.none:c??g.radius[i],f=void 0!==r||hasBuiltInHeaderContent(b),S=resolveBackground(g,a)??g.colors.surface,w="outline"===e?1:0,C="outline"===e?g.colors.border:void 0;return(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[{backgroundColor:S,borderRadius:R,..._corners.smoothCorners,borderWidth:w,borderColor:C,overflow:"hidden"},u,x],accessibilityRole:"progressbar",accessibilityLabel:j.loading,accessibilityState:{busy:!0},"aria-busy":!0,children:[void 0!==o?(0,_jsxRuntime.jsx)(_index2.Skeleton,{width:"100%",height:d?void 0:l,style:d?{aspectRatio:d,width:"100%"}:void 0}):null,f?(0,_jsxRuntime.jsx)(_reactNative.View,{style:[{padding:v,paddingBottom:g.space.sm},h],children:(0,_jsxRuntime.jsx)(_index2.Skeleton,{shape:"text",width:"60%",height:18})}):null,(0,_jsxRuntime.jsx)(_reactNative.View,{style:[{padding:v},m],children:(0,_jsxRuntime.jsx)(_index2.SkeletonText,{lines:3,fontSize:g.text.base.size,lastLineWidth:"55%"})}),void 0!==n?(0,_jsxRuntime.jsx)(_reactNative.View,{style:[{padding:v,paddingTop:g.space.sm,flexDirection:"row"},_],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:s,color:a,haptic:r})=>{const n=(0,_index.useTheme)();return(0,_jsxRuntime.jsx)(_reactNative.Pressable,{accessibilityRole:"button",accessibilityLabel:t,accessibilityState:void 0===s?void 0:{expanded:s},"aria-expanded":s,onPress:()=>{r&&(0,_hapticUtils.triggerHaptic)(r),i()},style:iconActionStyle,children:(0,_jsxRuntime.jsx)(_AppIcon.AppIcon,{name:e,size:20,color:a??n.colors["text-body"]})})},CardTextActionButton=({action:e,haptic:t})=>(0,_jsxRuntime.jsx)(_reactNative.Pressable,{accessibilityRole:"button",accessibilityLabel:e.accessibilityLabel??e.label,onPress:()=>{t&&(0,_hapticUtils.triggerHaptic)(t),e.onPress()},style:textActionStyle,children:(0,_jsxRuntime.jsx)(_index3.Text,{variant:"label",weight:"semibold",color:"brand",children:e.label})}),iconActionStyle={width:44,height:44,alignItems:"center",justifyContent:"center"},textActionStyle={minWidth:44,minHeight:44,alignItems:"center",justifyContent:"center"},titleFaceFor=(e,t)=>"serif"===t?(0,_index.fontFor)(e,"semibold","display"):{fontFamily:void 0,...(0,_index.fontFor)(e,"semibold")},resolveBackground=(e,t)=>{if(null!=t)return BACKGROUND_TOKENS.includes(t)?e.colors[t]:t},buildStyles=e=>_reactNative.StyleSheet.create({header:{marginBottom:e.space.md},headerRow:{flexDirection:"row",alignItems:"center",gap:e.space.sm},headerFolded:{marginBottom:e.space.none},titleColumn:{flex:1},lead:{marginTop:e.space.xs},actionNode:{flexShrink:0},body:{flexShrink:1},footer:{marginTop:e.space.md},imageWrapper:{position:"relative"},imageOverlay:{..._reactNative.StyleSheet.absoluteFill},squircleClip:{flexGrow:1,overflow:"hidden",..._corners.smoothCorners},preview:{margin:e.space.none,marginTop:e.space.none,marginBottom:e.space.none,marginLeft:e.space.none,marginRight:e.space.none,marginStart:e.space.none,marginEnd:e.space.none,marginHorizontal:e.space.none,marginVertical:e.space.none,position:"relative",top:0,left:0,width:"100%",height:"100%"}}),stylesFor=(0,_themeStyles.themeStyles)(buildStyles);var _default=exports.default=Card;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=exports.Dialog=void 0;var _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"),_warnInvalidValue=require("../../utils/warnInvalidValue.js"),_index2=require("../AppIcon/index.js"),_Modal=require("../Modal/Modal.js"),_jsxRuntime=require("react/jsx-runtime");const
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=exports.Dialog=void 0;var _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"),_warnInvalidValue=require("../../utils/warnInvalidValue.js"),_index2=require("../AppIcon/index.js"),_Modal=require("../Modal/Modal.js"),_OverlayActions=require("./OverlayActions.js"),_jsxRuntime=require("react/jsx-runtime");const DIALOG_ILLUSTRATION_SIZE=120,STATUS_MARK={success:"check-circle",warning:"alert-triangle",danger:"alert-circle",info:"info-circle"},Dialog=e=>{const{visible:t,onClose:i,title:l,message:s,children:r,icon:n,illustration:a,tone:o="neutral",actions:c,actionsLayout:u="auto",dismissOnAction:d=!0,accessibilityLabel:_,contentStyle:m,containerStyle:g,titleStyle:x,messageStyle:y,iconWrapperStyle:p,actionsRowStyle:S,actionButtonStyle:j,actionTextStyle:h,haptic:v,testID:b}=e;(0,_warnInvalidValue.warnInvalidValue)("Dialog","tone",e.tone,_OverlayActions.OVERLAY_TONES),(0,_warnInvalidValue.warnInvalidValue)("Dialog","actionsLayout",e.actionsLayout,_OverlayActions.ACTIONS_LAYOUTS);const A=(0,_index.useTheme)(),I=(0,_react.useMemo)(()=>buildStyles(),[]),O=(0,_react.useMemo)(()=>discFor(A,o),[A,o]),R=A.components.dialog["icon-wrapper-size"],f=Boolean(c&&c.length>0),w=(0,_react.useState)(null),M=(0,_react.useCallback)(e=>{if(e.loading||e.disabled)return;const t=(0,_hapticUtils.resolveHaptic)(v,"selection");t&&(0,_hapticUtils.triggerHaptic)(t),d?(i(),setTimeout(e.onPress,_Modal.MODAL_DISMISS_GRACE_MS)):e.onPress()},[d,i,v]),T=(0,_react.useMemo)(()=>(c??[]).map(e=>({...e,onPress:()=>M(e)})),[c,M]),D=null==n&&null==a&&STATUS_MARK[o]?(0,_jsxRuntime.jsx)(_index2.AppIcon,{name:STATUS_MARK[o],size:Math.round(R/2),color:A.colors[o]}):null,L=n??D;return(0,_jsxRuntime.jsx)(_Modal.Modal,{visible:t,onClose:i,haptic:v,presentation:"centered",accessibilityLabel:_??l,contentStyle:m,testID:b,children:(0,_jsxRuntime.jsxs)(_reactNative.View,{accessibilityRole:"alert",accessibilityLabel:_??l,style:[I.container,g],children:[null!=a?(0,_jsxRuntime.jsx)(_reactNative.View,{style:{alignItems:"center",marginBottom:A.space.md},children:(0,_react.isValidElement)(a)?a:(0,_jsxRuntime.jsx)(_reactNative.Image,{source:a,style:{width:120,height:120},resizeMode:"contain",accessibilityIgnoresInvertColors:!0})}):null,L?(0,_jsxRuntime.jsx)(_reactNative.View,{style:[I.iconWrapper,{width:R,height:R,borderRadius:A.radius.pill,..._corners.smoothCorners,backgroundColor:O,marginBottom:A.space.md},p],children:L}):null,l?(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[I.title,{color:A.colors["text-body"],fontSize:A.text.xl.size,...(0,_index.fontFor)(A,"semibold"),marginBottom:s||null!=r?A.space.sm:A.space.md},x],accessibilityRole:"header",children:l}):null,s?(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[I.message,{color:A.colors["text-muted"],fontSize:A.text.base.size,lineHeight:A.text.base.size*A.leading.body,marginBottom:null!=r?A.space.md:f?A.space.lg:0},y],children:s}):null,null!=r?(0,_jsxRuntime.jsx)(_reactNative.View,{style:{marginBottom:f?A.space.lg:0},children:r}):null,f?(0,_jsxRuntime.jsx)(_OverlayActions.OverlayActions,{actions:T,layout:u,stackedLabels:w,rowStyle:S,buttonStyle:j,textStyle:h}):null]})})};exports.Dialog=Dialog,Dialog.displayName="Dialog";const SOFT_DISC_OPACITY=.14,discFor=(e,t)=>{const i=e.colors["bg-subtle"];switch(t){case"success":return(0,_color.tintOf)(e.colors.success,.14,i);case"warning":return(0,_color.tintOf)(e.colors.warning,.14,i);case"danger":return(0,_color.tintOf)(e.colors.danger,.14,i);case"info":return(0,_color.tintOf)(e.colors.info,.14,i);default:return e.colors["primary-soft"]}},buildStyles=()=>_reactNative.StyleSheet.create({container:{alignItems:"stretch"},iconWrapper:{alignItems:"center",justifyContent:"center",alignSelf:"center"},title:{textAlign:"center"},message:{textAlign:"center"}});var _default=exports.default=Dialog;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.OverlayActions=exports.OVERLAY_TONES=exports.ACTIONS_LAYOUTS=void 0;var _react=require("react"),_reactNative=require("react-native"),_index=require("../../theme/index.js"),_corners=require("../../utils/corners.js"),_warnInvalidValue=require("../../utils/warnInvalidValue.js"),_slotIcon=require("../AppIcon/slotIcon.js"),_jsxRuntime=require("react/jsx-runtime");const OVERLAY_TONES=exports.OVERLAY_TONES=["primary","success","warning","danger","info","neutral"],ACTIONS_LAYOUTS=exports.ACTIONS_LAYOUTS=["auto","row","stacked"],OverlayActions=({actions:e,layout:r,testID:o,stackedLabels:t,rowStyle:n,buttonStyle:a,textStyle:l})=>{const s=(0,_index.useTheme)(),i=(0,_react.useMemo)(()=>buildStyles(s),[s]),c=s.components.dialog["action-button-min-height"],d=(0,_index.resolveButtonSize)(s,"md").icon,u=s.text.base.size*s.leading.body,b=e.map(e=>e.label).join("\n"),x=(0,_react.useState)(null),[y,_]=t??x,g="stacked"===r||"row"!==r&&(null!==y&&y===b),m=(0,_react.useRef)(null),p=(0,_react.useCallback)(e=>{e.nativeEvent.layout.height>1.5*u&&_(b)},[u,b,_]),C=(0,_react.useCallback)(e=>{const r=e.nativeEvent.layout.width,o=m.current;m.current=r,null!==o&&Math.abs(o-r)>.5&&_(null)},[_]),h=new Map;return(0,_jsxRuntime.jsx)(_reactNative.View,{testID:o,style:[i.actionsRow,g?i.actionsRowStacked:null,n],onLayout:C,children:e.map((r,o)=>{const t=(h.get(r.label)??0)+1;h.set(r.label,t),(0,_warnInvalidValue.warnInvalidValue)("OverlayActions","actions[].tone",r.tone,OVERLAY_TONES);const n=r.tone??"primary",u=Boolean(r.disabled),b=actionStyleFor(s,n,u),x=o===e.length-1;return(0,_jsxRuntime.jsx)(_reactNative.Pressable,{onPress:r.onPress,disabled:r.loading||u,accessibilityRole:"button",accessibilityLabel:r.label,accessibilityState:{busy:r.loading,disabled:Boolean(r.loading)||u},"aria-busy":r.loading,"aria-disabled":Boolean(r.loading)||u,style:({pressed:e})=>[i.actionButton,{flex:g?0:1,minHeight:c,backgroundColor:b.backgroundColor,borderColor:b.borderColor,borderWidth:b.borderWidth,borderRadius:s.radius.md,..._corners.smoothCorners,paddingVertical:s.space.sm,paddingHorizontal:s.space.md,marginRight:x||g?0:s.space.sm,opacity:r.loading?.7:e&&!u?.85:1},a],children:r.loading?(0,_jsxRuntime.jsx)(_reactNative.ActivityIndicator,{size:"small",color:b.textColor}):(0,_jsxRuntime.jsxs)(_reactNative.View,{style:i.labelRow,children:[r.icon?(0,_jsxRuntime.jsx)(_reactNative.View,{style:i.labelIcon,children:(0,_slotIcon.renderSlotIcon)(r.icon,{color:b.textColor,size:d,disabled:u},"linear")}):null,(0,_jsxRuntime.jsx)(_reactNative.View,{onLayout:p,children:(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[{color:b.textColor,fontSize:s.text.base.size,...(0,_index.fontFor)(s,"semibold"),textAlign:"center"},l],children:r.label})})]})},`${r.label}-${t}`)})})};exports.OverlayActions=OverlayActions,OverlayActions.displayName="OverlayActions";const actionStyleFor=(e,r,o)=>{if(o)return{backgroundColor:"neutral"===r?"transparent":e.colors["surface-disabled"],borderColor:"neutral"===r?e.colors.border:"transparent",borderWidth:"neutral"===r?1:0,textColor:e.colors["text-disabled"]};switch(r){case"primary":return{backgroundColor:e.colors.primary,borderColor:"transparent",borderWidth:0,textColor:e.colors["on-primary"]};case"info":return{backgroundColor:e.colors.info,borderColor:"transparent",borderWidth:0,textColor:e.colors["on-info"]};case"success":return{backgroundColor:e.colors.success,borderColor:"transparent",borderWidth:0,textColor:e.colors["on-success"]};case"warning":return{backgroundColor:e.colors.warning,borderColor:"transparent",borderWidth:0,textColor:e.colors["on-warning"]};case"danger":return{backgroundColor:e.colors.danger,borderColor:"transparent",borderWidth:0,textColor:e.colors["on-danger"]};default:return{backgroundColor:"transparent",borderColor:e.colors.border,borderWidth:1,textColor:e.colors["text-body"]}}},buildStyles=e=>_reactNative.StyleSheet.create({actionsRow:{flexDirection:"row",justifyContent:"flex-end",alignItems:"stretch"},actionsRowStacked:{flexDirection:"column",rowGap:e.space.sm},actionButton:{alignItems:"center",justifyContent:"center"},labelRow:{flexDirection:"row",alignItems:"center",justifyContent:"center"},labelIcon:{marginRight:e.space.xs}});
|
|
@@ -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"),_warnInvalidValue=require("../../utils/warnInvalidValue.js"),_SquircleFill=require("../SquircleFill/SquircleFill.js"),_jsxRuntime=require("react/jsx-runtime");const ActionButton=({action:e,variant:t})=>{const i=(0,_index.useTheme)(),{style:r,pressIn:s,pressOut:
|
|
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"),_warnInvalidValue=require("../../utils/warnInvalidValue.js"),_SquircleFill=require("../SquircleFill/SquircleFill.js"),_index2=require("../Text/index.js"),_jsxRuntime=require("react/jsx-runtime");const ActionButton=({action:e,variant:t})=>{const i=(0,_index.useTheme)(),{style:r,pressIn:s,pressOut:n}=(0,_usePressAnimation.usePressAnimation)({enabled:!0}),o=(0,_react.useMemo)(()=>buildActionStyles(i),[i]),a="primary"===t,l=(0,_SquircleFill.useSquircle)(!0,i.radius.md),fillFor=e=>a?e?i.colors["primary-hover"]:i.colors.primary:e?i.colors["surface-pressed"]:"transparent";return(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{style:r,children:(0,_jsxRuntime.jsx)(_reactNative.Pressable,{onPress:()=>{(0,_hapticUtils.triggerHaptic)("selection"),e.onPress()},onPressIn:s,onPressOut:n,accessibilityRole:"button",accessibilityLabel:e.accessibilityLabel??e.label,accessibilityHint:e.accessibilityHint,testID:e.testID,onLayout:l.onLayout,style:({pressed:e})=>[o.button,a?o.buttonPrimary:o.buttonSecondary,e&&!l.active?a?o.buttonPrimaryPressed:o.buttonSecondaryPressed:null,l.active?o.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,strokeWidth:a?0:1}):null,(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[o.buttonText,a?o.buttonTextPrimary:o.buttonTextSecondary],numberOfLines:1,children:e.label})]})})})},EmptyState=exports.EmptyState=(0,_react.forwardRef)((e,t)=>{const i=(0,_index.useTheme)(),r=Object.keys(i.components["empty-state"]);(0,_warnInvalidValue.warnInvalidValue)("EmptyState","size",e.size,r),(0,_warnInvalidValue.warnInvalidValue)("EmptyState","variant",e.variant,["block","inline"]);const{icon:s,illustration:n,title:o,description:a,action:l,secondaryAction:c,size:u="md",variant:d="block",fill:m=!1,style:x,testID:y}=e,b=r.includes(u)?u:"md",p=(0,_react.useMemo)(()=>(0,_index.resolveEmptyStateSize)(i,b),[i,b]),_=(0,_react.useMemo)(()=>buildStyles(i),[i]);return"inline"===d?(0,_jsxRuntime.jsx)(_reactNative.View,{ref:t,accessibilityRole:"summary",testID:y,style:[_.inline,m?_.fill:null,x],children:(0,_jsxRuntime.jsx)(_index2.Text,{variant:"caption",weight:"medium",color:"secondary",align:"center",children:o})}):(0,_jsxRuntime.jsxs)(_reactNative.View,{ref:t,accessibilityRole:"summary",testID:y,style:[_.root,{paddingVertical:p["padding-y"]},m?_.fill:null,x],children:[null!=n?(0,_jsxRuntime.jsx)(_reactNative.View,{style:{marginBottom:p["title-gap"]},children:(0,_react.isValidElement)(n)?n:(0,_jsxRuntime.jsx)(_reactNative.Image,{source:n,style:{width:p["illustration-size"],height:p["illustration-size"]},resizeMode:"contain",accessibilityIgnoresInvertColors:!0})}):s?(0,_jsxRuntime.jsx)(_reactNative.View,{style:[_.iconCircle,{width:p.icon,height:p.icon,marginBottom:p["title-gap"],borderRadius:i.radius.pill,..._corners.smoothCorners}],children:s}):null,(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[_.title,{fontSize:p["title-text"],...(0,_index.fontFor)(i,"semibold")}],children:o}),a?(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[_.description,{fontSize:p["description-text"],marginTop:p["description-gap"]}],children:a}):null,l||c?(0,_jsxRuntime.jsxs)(_reactNative.View,{style:_.actions,children:[l?(0,_jsxRuntime.jsx)(ActionButton,{action:l,variant:"primary"}):null,c?(0,_jsxRuntime.jsx)(ActionButton,{action:c,variant:"secondary"}):null]}):null]})});EmptyState.displayName="EmptyState";const buildStyles=e=>_reactNative.StyleSheet.create({root:{alignItems:"center",justifyContent:"center",paddingHorizontal:e.space.lg},inline:{alignItems:"center",justifyContent:"center"},fill:{flexGrow:1},iconCircle:{backgroundColor:e.colors["surface-disabled"],alignItems:"center",justifyContent:"center"},title:{color:e.colors["text-body"],textAlign:"center"},description:{color:e.colors["text-muted"],textAlign:"center",maxWidth:320,lineHeight:e.text.base.size*e.leading.body},actions:{flexDirection:"row",alignItems:"center",gap:e.space.sm,marginTop:e.space.lg}}),buildActionStyles=e=>_reactNative.StyleSheet.create({button:{paddingHorizontal:e.space.lg,paddingVertical:e.space.sm,minHeight:42,borderRadius:e.radius.md,..._corners.smoothCorners,overflow:"hidden",alignItems:"center",justifyContent:"center",flexDirection:"row"},buttonPrimary:{backgroundColor:e.colors.primary},buttonPrimaryPressed:{backgroundColor:e.colors["primary-hover"]},buttonSecondary:{backgroundColor:"transparent",borderWidth:1,borderColor:e.colors.border},buttonSecondaryPressed:{backgroundColor:e.colors["surface-pressed"]},buttonSquircleHost:{backgroundColor:"transparent",borderColor:"transparent",overflow:"visible"},buttonText:{fontSize:e.text.base.size,...(0,_index.fontFor)(e,"semibold")},buttonTextPrimary:{color:e.colors["on-primary"]},buttonTextSecondary:{color:e.colors["text-body"]}});var _default=exports.default=EmptyState;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=exports.IconBadge=void 0;var _react=require("react"),_reactNative=require("react-native"),_index=require("../../theme/index.js"),_color=require("../../utils/color.js"),_corners=require("../../utils/corners.js"),_warnInvalidValue=require("../../utils/warnInvalidValue.js"),_slotIcon=require("../AppIcon/slotIcon.js"),_jsxRuntime=require("react/jsx-runtime");const SIZE_MAP={sm:{diameter:32,icon:16},md:{diameter:40,icon:20},lg:{diameter:56,icon:28}},FILL_OPACITY=.14,inkFor=(e,r)=>{switch(r){case"success":return e.colors.success;case"warning":return e.colors.warning;case"danger":return e.colors.danger;case"info":return e.colors.info;case"neutral":return e.colors["text-muted"];default:return e.colors.primary}},IconBadge=exports.IconBadge=(0,_react.forwardRef)((e,r)=>{const{icon:
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=exports.IconBadge=void 0;var _react=require("react"),_reactNative=require("react-native"),_index=require("../../theme/index.js"),_color=require("../../utils/color.js"),_corners=require("../../utils/corners.js"),_warnInvalidValue=require("../../utils/warnInvalidValue.js"),_slotIcon=require("../AppIcon/slotIcon.js"),_jsxRuntime=require("react/jsx-runtime");const SIZE_MAP={sm:{diameter:32,icon:16},md:{diameter:40,icon:20},lg:{diameter:56,icon:28}},FILL_OPACITY=.14,HALO_FILL_OPACITY=.16,inkFor=(e,r)=>{switch(r){case"success":return e.colors.success;case"warning":return e.colors.warning;case"danger":return e.colors.danger;case"info":return e.colors.info;case"neutral":return e.colors["text-muted"];default:return e.colors.primary}},IconBadge=exports.IconBadge=(0,_react.forwardRef)((e,r)=>{const{icon:n,iconVariant:a,size:t="md",tone:o="primary",color:i,fill:s="tint",dimension:c,accessibilityLabel:l,pointerEvents:d,style:u,testID:I}=e;(0,_warnInvalidValue.warnInvalidValue)("IconBadge","size",e.size,["sm","md","lg"]),(0,_warnInvalidValue.warnInvalidValue)("IconBadge","tone",e.tone,["primary","success","warning","danger","info","neutral"]),(0,_warnInvalidValue.warnInvalidValue)("IconBadge","iconVariant",e.iconVariant,["linear","bold","broken","bulk","outline","twotone"]),(0,_warnInvalidValue.warnInvalidValue)("IconBadge","fill",e.fill,["tint","halo","surface"]);const _=(0,_index.useTheme)(),m=SIZE_MAP[t],g=i??inkFor(_,o),v=c??m.diameter,f=null!=c?Math.round(c/2):m.icon,b="surface"===s?_.colors.surface:void 0===i&&"neutral"===o?_.colors["bg-muted"]:(0,_color.tintOf)(g,"halo"===s?.16:.14,_.colors["bg-muted"]),w={color:g,size:f,disabled:!1},y=void 0!==l;return(0,_jsxRuntime.jsx)(_reactNative.View,{ref:r,testID:I,pointerEvents:d,accessible:y,accessibilityRole:y?"image":void 0,accessibilityLabel:l,importantForAccessibility:y?"yes":"no",style:[styles.base,{width:v,height:v,borderRadius:v/2,..._corners.smoothCorners,backgroundColor:b},u],children:(0,_slotIcon.renderSlotIcon)(n,w,a)})});IconBadge.displayName="IconBadge";const styles=_reactNative.StyleSheet.create({base:{alignItems:"center",justifyContent:"center"}});var _default=exports.default=IconBadge;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=exports.ListItem=void 0;var cache,_react=_interopRequireWildcard(require("react")),_reactNative=require("react-native"),_reactNativeSvg=_interopRequireWildcard(require("react-native-svg")),_useFlickGuard=require("../../hooks/useFlickGuard.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"),_themeStyles=require("../../utils/themeStyles.js"),_warnInvalidValue=require("../../utils/warnInvalidValue.js"),_defaultIcons=require("../AppIcon/defaultIcons.js"),_index2=require("../Button/index.js"),_index3=require("../IconBadge/index.js"),_useContextMenu=require("../Menu/useContextMenu.js"),_index4=require("../Skeleton/index.js"),_index5=require("../Swipeable/index.js"),_jsxRuntime=require("react/jsx-runtime");function _interopRequireWildcard(e,t){if(!t&&e&&e.__esModule)return e;var i,s,n=Object.defineProperty,r={__proto__:null,default:e};if(Object(e)!==e)return r;if(cache||"function"!=typeof WeakMap||(cache=new WeakMap),cache){if(cache.has(e))return cache.get(e);cache.set(e,r)}for(s in e)"default"!==s&&{}.hasOwnProperty.call(e,s)&&((i=n&&Object.getOwnPropertyDescriptor(e,s))&&(i.get||i.set)?n(r,s,i):r[s]=e[s]);return r}const Chevron=({color:e})=>{const t=(0,_index.useTheme)();return(0,_jsxRuntime.jsx)(_jsxRuntime.Fragment,{children:(t.settings.icons.chevronRight??_defaultIcons.defaultIcons.chevronRight)({size:20,color:e})})},BADGE_SIZE={sm:"sm",md:"md",lg:"lg"},RIGHT_BELOW_FONT_SCALE=1.2,SelectionBox=({checked:e,disabled:t})=>{const i=(0,_index.useTheme)(),s=(0,_index.resolveCheckboxSize)(i,"md")["box-size"],n=Math.round(.72*s);return(0,_jsxRuntime.jsx)(_reactNative.View,{accessibilityElementsHidden:!0,importantForAccessibility:"no-hide-descendants",pointerEvents:"none",style:{width:s,height:s,alignItems:"center",justifyContent:"center",borderWidth:i.size.border,borderRadius:i.radius.sm,..._corners.smoothCorners,borderColor:e?i.colors.primary:i.colors.border,backgroundColor:e?i.colors.primary:t?i.colors["surface-disabled"]:"transparent"},children:e?(0,_jsxRuntime.jsx)(_reactNativeSvg.default,{width:n,height:n,viewBox:"0 0 24 24",children:(0,_jsxRuntime.jsx)(_reactNativeSvg.Path,{d:"M5 12.5l4.5 4.5L19 7.5",stroke:i.colors["on-primary"],strokeWidth:3,strokeLinecap:"round",strokeLinejoin:"round",fill:"none"})}):null})},isActionList=e=>Array.isArray(e)&&e.length>0&&e.every(e=>null!=e&&"object"==typeof e&&!_react.default.isValidElement(e)&&"label"in e),renderActions=e=>isActionList(e)?e.map(e=>(0,_jsxRuntime.jsx)(_index2.Button,{size:"sm",variant:e.variant??"outline",tone:e.tone,leftIcon:e.icon,disabled:e.disabled,testID:e.testID,label:e.label,onPress:e.onPress},e.label)):e,ListItem=exports.ListItem=_react.default.memo((0,_react.forwardRef)((e,t)=>{const{title:i,loading:s=!1,subtitle:n,description:r,children:l,titleLines:a=1,subtitleLines:o=1,left:c,icon:d,iconTone:u="primary",right:x,rightPlacement:m="auto",selectable:h=!1,checked:_=!1,onCheckedChange:j,actions:p,onPress:g,haptic:b,selected:y=!1,expanded:f,disabled:v=!1,size:R="md",divider:w=!1,chevron:S=!1,leftActions:I,rightActions:L,contextMenu:k,accessibilityLabel:N,accessibilityHint:V,style:C,containerStyle:A,titleStyle:q,subtitleStyle:P,descriptionStyle:z,leftSlotStyle:B,rightSlotStyle:D,testID:M}=e;(0,_warnInvalidValue.warnInvalidValue)("ListItem","size",e.size,["sm","md","lg"]),(0,_warnInvalidValue.warnInvalidValue)("ListItem","iconTone",e.iconTone,["primary","success","warning","danger","info","neutral"]),(0,_warnInvalidValue.warnInvalidValue)("ListItem","rightPlacement",e.rightPlacement,["auto","side","below"]);const T=(0,_index.useTheme)(),F=(0,_react.useMemo)(()=>(0,_index.resolveListItemSize)(T,R),[T,R]),W=stylesFor(T),{fontScale:O}=(0,_reactNative.useWindowDimensions)(),H=!!x&&("below"===m||"auto"===m&&O>1.2),E=(0,_useContextMenu.useContextMenu)(v?void 0:k,{haptic:b||!1,testID:M}),G=(0,_react.useMemo)(()=>(0,_mergeRefs.mergeRefs)(t,E.hostRef),[t,E.hostRef]),U=h||!!g,Z=U||E.enabled,J=Z&&!v,{style:K,pressIn:Q,pressOut:X}=(0,_usePressAnimation.usePressAnimation)({enabled:J}),Y=(0,_useFlickGuard.useFlickGuard)(),$=N??("string"==typeof i?i:void 0),isText=e=>"string"==typeof e||"number"==typeof e,ee=c??(void 0===d?null:(0,_jsxRuntime.jsx)(_index3.IconBadge,{icon:d,tone:u,size:BADGE_SIZE[R]})),te=h?(0,_jsxRuntime.jsxs)(_reactNative.View,{style:W.selectionLead,children:[(0,_jsxRuntime.jsx)(SelectionBox,{checked:_,disabled:v}),ee?(0,_jsxRuntime.jsx)(_reactNative.View,{style:W.selectionLeadContent,children:ee}):null]}):ee,ie=null!=p&&!1!==p&&!(Array.isArray(p)&&0===p.length),se=w&&!ie,ne=(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[W.row,{paddingVertical:F["padding-y"],minHeight:F["min-height"],backgroundColor:y?T.colors["surface-selected"]:"transparent"},se?W.divider:null,v?W.disabled:null,A],children:[te?(0,_jsxRuntime.jsx)(_reactNative.View,{style:[W.leftSlot,B],children:te}):null,(0,_jsxRuntime.jsxs)(_reactNative.View,{style:W.middle,children:[null==i||isText(i)?(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[W.title,{fontSize:F["title-text"],...(0,_index.fontFor)(T,"medium"),color:v?T.colors["text-disabled"]:T.colors["text-body"]},q],numberOfLines:a,children:i??" "}):i,null==n||""===n?null:isText(n)?(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[W.subtitle,{fontSize:F["subtitle-text"],color:v?T.colors["text-disabled"]:T.colors["text-muted"]},P],numberOfLines:o,children:n}):n,r?(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[W.description,{fontSize:F["subtitle-text"],color:v?T.colors["text-disabled"]:T.colors["text-subtle"]},z],numberOfLines:2,children:r}):null,null!=l&&!1!==l?(0,_jsxRuntime.jsx)(_reactNative.View,{style:W.body,children:l}):null,H?(0,_jsxRuntime.jsx)(_reactNative.View,{style:[W.rightBelow,D],children:x}):null]}),x&&!H||S?(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[W.rightSlot,H?null:D],children:[H?null:x,S?(0,_jsxRuntime.jsx)(_reactNative.View,{style:x&&!H?W.chevronWithRight:null,children:(0,_jsxRuntime.jsx)(Chevron,{color:v?T.colors["text-disabled"]:T.colors["text-subtle"]})}):null]}):null]}),re=Z?(0,_jsxRuntime.jsx)(_reactNative.Pressable,{ref:G,onPress:e=>{J&&U&&!Y.isFlick(e)&&(b&&(0,_hapticUtils.triggerHaptic)(b),h?j?.(!_):g?.(e))},onPressIn:e=>{Y.onPressIn(e),Q()},onPressOut:X,disabled:!J,accessibilityRole:h?"checkbox":g?"button":void 0,accessibilityLabel:$,accessibilityHint:V,accessibilityState:h?{checked:_,disabled:!J,expanded:f}:{selected:y,disabled:!J,expanded:f},"aria-disabled":!J,"aria-expanded":f,...h?{"aria-checked":_}:{"aria-selected":y},testID:M,android_ripple:{color:T.colors["surface-pressed"],borderless:!1},style:({pressed:e})=>[C,e?W.pressed:null],...E.hostProps,children:(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{style:K,children:ne})}):(0,_jsxRuntime.jsx)(_reactNative.View,{ref:t,accessibilityRole:"none",accessibilityLabel:$,accessibilityHint:V,accessibilityState:{selected:y,disabled:v},"aria-selected":y,"aria-disabled":v,testID:M,style:C,children:ne}),le=I&&I.length>0||L&&L.length>0,ae=ie?(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[y?{backgroundColor:T.colors["surface-selected"]}:null,w?W.divider:null],children:[re,(0,_jsxRuntime.jsx)(_reactNative.View,{style:W.actions,children:renderActions(p)})]}):re,oe=le?(0,_jsxRuntime.jsx)(_index5.Swipeable,{leftActions:I,rightActions:L,accessibilityLabel:$,children:ae}):ae;return s?(0,_jsxRuntime.jsx)(ListItemSkeleton,{...e}):E.enabled?(0,_jsxRuntime.jsxs)(_jsxRuntime.Fragment,{children:[oe,E.renderSurface((0,_jsxRuntime.jsx)(_reactNative.View,{style:W.preview,children:ne}))]}):oe}));ListItem.displayName="ListItem";const ListItemSkeleton=({subtitle:e,description:t,left:i,icon:s,right:n,chevron:r,size:l="md",containerStyle:a,style:o})=>{const c=(0,_index.useTheme)(),d=(0,_index.resolveListItemSize)(c,l),u=Math.round(1.15*d["title-text"]),x=Math.round(1.15*d["subtitle-text"]);return(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[{flexDirection:"row",alignItems:"center",paddingHorizontal:c.space.md,paddingVertical:d["padding-y"],minHeight:d["min-height"]},a,o],children:[void 0!==i||void 0!==s?(0,_jsxRuntime.jsx)(_reactNative.View,{style:{marginRight:c.space.sm},children:(0,_jsxRuntime.jsx)(_index4.Skeleton,{shape:"circle",width:40,height:40})}):null,(0,_jsxRuntime.jsxs)(_reactNative.View,{style:{flex:1},children:[(0,_jsxRuntime.jsx)(_index4.Skeleton,{shape:"text",width:"70%",height:u,style:{marginBottom:c.space.xs}}),void 0!==e?(0,_jsxRuntime.jsx)(_index4.Skeleton,{shape:"text",width:"50%",height:x,style:void 0!==t?{marginBottom:c.space.xs}:void 0}):null,void 0!==t?(0,_jsxRuntime.jsx)(_index4.Skeleton,{shape:"text",width:"85%",height:x}):null]}),void 0!==n||r?(0,_jsxRuntime.jsx)(_reactNative.View,{style:{marginLeft:c.space.sm},children:(0,_jsxRuntime.jsx)(_index4.Skeleton,{width:20,height:20,radius:"sm"})}):null]})};ListItemSkeleton.displayName="ListItemSkeleton",ListItem.Skeleton=ListItemSkeleton;const buildStyles=e=>_reactNative.StyleSheet.create({row:{flexDirection:"row",alignItems:"center",paddingHorizontal:e.space.md},divider:{borderBottomWidth:_reactNative.StyleSheet.hairlineWidth,borderBottomColor:e.colors.border},pressed:{backgroundColor:e.colors["surface-pressed"]},disabled:{opacity:.55},leftSlot:{marginRight:e.space.md,alignItems:"center",justifyContent:"center"},middle:{flex:1,flexDirection:"column",justifyContent:"center"},selectionLead:{flexDirection:"row",alignItems:"center"},selectionLeadContent:{marginLeft:e.space.sm},body:{marginTop:e.space.xs},rightBelow:{alignSelf:"flex-start",flexDirection:"row",alignItems:"center",marginTop:e.space.xs},rightSlot:{marginLeft:e.space.md,alignItems:"center",justifyContent:"center",flexDirection:"row"},actions:{flexDirection:"row",flexWrap:"wrap",gap:e.space.sm,paddingHorizontal:e.space.md,paddingBottom:e.space.md},chevronWithRight:{marginLeft:e.space.xs},preview:{flex:1,backgroundColor:e.colors.surface,borderRadius:e.radius.md,..._corners.smoothCorners,overflow:"hidden"},title:{letterSpacing:e["letter-spacing"].normal},subtitle:{marginTop:e.space.xxs,...(0,_index.fontFor)(e,"normal")},description:{marginTop:e.space.xxs,...(0,_index.fontFor)(e,"normal")}}),stylesFor=(0,_themeStyles.themeStyles)(buildStyles);var _default=exports.default=ListItem;
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=exports.ListItem=void 0;var cache,_react=_interopRequireWildcard(require("react")),_reactNative=require("react-native"),_reactNativeSvg=_interopRequireWildcard(require("react-native-svg")),_useFlickGuard=require("../../hooks/useFlickGuard.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"),_themeStyles=require("../../utils/themeStyles.js"),_warnInvalidValue=require("../../utils/warnInvalidValue.js"),_defaultIcons=require("../AppIcon/defaultIcons.js"),_index2=require("../Button/index.js"),_index3=require("../IconBadge/index.js"),_useContextMenu=require("../Menu/useContextMenu.js"),_webOnly=require("../Menu/webOnly.js"),_index4=require("../Skeleton/index.js"),_index5=require("../Swipeable/index.js"),_jsxRuntime=require("react/jsx-runtime");function _interopRequireWildcard(e,t){if(!t&&e&&e.__esModule)return e;var i,s,n=Object.defineProperty,r={__proto__:null,default:e};if(Object(e)!==e)return r;if(cache||"function"!=typeof WeakMap||(cache=new WeakMap),cache){if(cache.has(e))return cache.get(e);cache.set(e,r)}for(s in e)"default"!==s&&{}.hasOwnProperty.call(e,s)&&((i=n&&Object.getOwnPropertyDescriptor(e,s))&&(i.get||i.set)?n(r,s,i):r[s]=e[s]);return r}const Chevron=({color:e})=>{const t=(0,_index.useTheme)();return(0,_jsxRuntime.jsx)(_jsxRuntime.Fragment,{children:(t.settings.icons.chevronRight??_defaultIcons.defaultIcons.chevronRight)({size:20,color:e})})},BADGE_SIZE={sm:"sm",md:"md",lg:"lg"},RIGHT_BELOW_FONT_SCALE=1.2,MENU_ROW_MIN_HEIGHT=48,WEB_CHECKABLE_ROLE=(0,_webOnly.webOnly)({role:"menuitemcheckbox"}),SelectionBox=({checked:e,disabled:t})=>{const i=(0,_index.useTheme)(),s=(0,_index.resolveCheckboxSize)(i,"md")["box-size"],n=Math.round(.72*s);return(0,_jsxRuntime.jsx)(_reactNative.View,{accessibilityElementsHidden:!0,importantForAccessibility:"no-hide-descendants",pointerEvents:"none",style:{width:s,height:s,alignItems:"center",justifyContent:"center",borderWidth:i.size.border,borderRadius:i.radius.sm,..._corners.smoothCorners,borderColor:e?i.colors.primary:i.colors.border,backgroundColor:e?i.colors.primary:t?i.colors["surface-disabled"]:"transparent"},children:e?(0,_jsxRuntime.jsx)(_reactNativeSvg.default,{width:n,height:n,viewBox:"0 0 24 24",children:(0,_jsxRuntime.jsx)(_reactNativeSvg.Path,{d:"M5 12.5l4.5 4.5L19 7.5",stroke:i.colors["on-primary"],strokeWidth:3,strokeLinecap:"round",strokeLinejoin:"round",fill:"none"})}):null})},isActionList=e=>Array.isArray(e)&&e.length>0&&e.every(e=>null!=e&&"object"==typeof e&&!_react.default.isValidElement(e)&&"label"in e),renderActions=e=>isActionList(e)?e.map(e=>(0,_jsxRuntime.jsx)(_index2.Button,{size:"sm",variant:e.variant??"outline",tone:e.tone,leftIcon:e.icon,disabled:e.disabled,testID:e.testID,label:e.label,onPress:e.onPress},e.label)):e,ListItem=exports.ListItem=_react.default.memo((0,_react.forwardRef)((e,t)=>{const{title:i,loading:s=!1,subtitle:n,description:r,children:l,titleLines:a,subtitleLines:o=1,left:c,icon:d,iconTone:u="primary",right:m,rightPlacement:x="auto",selectable:_=!1,checked:h=!1,onCheckedChange:p,actions:j,onPress:b,onFocus:g,haptic:v,selected:y=!1,expanded:f,disabled:w=!1,size:R="md",variant:S="list",divider:I=!1,chevron:L=!1,leftActions:k,rightActions:N,contextMenu:V,accessibilityLabel:C,accessibilityHint:A,style:q,containerStyle:B,titleStyle:P,subtitleStyle:z,descriptionStyle:O,leftSlotStyle:E,rightSlotStyle:M,testID:T}=e;(0,_warnInvalidValue.warnInvalidValue)("ListItem","size",e.size,["sm","md","lg"]),(0,_warnInvalidValue.warnInvalidValue)("ListItem","iconTone",e.iconTone,["primary","success","warning","danger","info","neutral"]),(0,_warnInvalidValue.warnInvalidValue)("ListItem","rightPlacement",e.rightPlacement,["auto","side","below"]),(0,_warnInvalidValue.warnInvalidValue)("ListItem","variant",e.variant,["list","menu"]);const D="menu"===S,W=a??(D?2:1),F=D?e.checked:void 0,H=(0,_index.useTheme)(),G=(0,_react.useMemo)(()=>(0,_index.resolveListItemSize)(H,R),[H,R]),U=stylesFor(H),{fontScale:K}=(0,_reactNative.useWindowDimensions)(),Z=!!m&&("below"===x||"auto"===x&&K>1.2),J=(0,_useContextMenu.useContextMenu)(w?void 0:V,{haptic:v||!1,testID:T}),Q=(0,_react.useMemo)(()=>(0,_mergeRefs.mergeRefs)(t,J.hostRef),[t,J.hostRef]),X=_||!!b,Y=X||J.enabled,$=Y&&!w,{style:ee,pressIn:te,pressOut:ie}=(0,_usePressAnimation.usePressAnimation)({enabled:$&&!D}),se=(0,_useFlickGuard.useFlickGuard)(),ne=C??("string"==typeof i?i:void 0),isText=e=>"string"==typeof e||"number"==typeof e,re=c??(void 0===d?null:(0,_jsxRuntime.jsx)(_index3.IconBadge,{icon:d,tone:u,size:BADGE_SIZE[R]})),le=_?(0,_jsxRuntime.jsxs)(_reactNative.View,{style:U.selectionLead,children:[(0,_jsxRuntime.jsx)(SelectionBox,{checked:h,disabled:w}),re?(0,_jsxRuntime.jsx)(_reactNative.View,{style:U.selectionLeadContent,children:re}):null]}):re,ae=null!=j&&!1!==j&&!(Array.isArray(j)&&0===j.length),oe=I&&!ae,ce=(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[U.row,{paddingVertical:D?H.space.sm:G["padding-y"],minHeight:D?48:G["min-height"],backgroundColor:y?H.colors["surface-selected"]:"transparent"},oe?U.divider:null,w&&!D?U.disabled:null,B],children:[le?(0,_jsxRuntime.jsx)(_reactNative.View,{style:[U.leftSlot,E],children:le}):null,(0,_jsxRuntime.jsxs)(_reactNative.View,{style:U.middle,children:[null==i||isText(i)?(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[U.title,{fontSize:D?H.text.base.size:G["title-text"],...(0,_index.fontFor)(H,D?"normal":"medium"),color:w?H.colors["text-disabled"]:H.colors["text-body"]},P],numberOfLines:W,children:i??" "}):i,null==n||""===n?null:isText(n)?(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[U.subtitle,{fontSize:D?H.text.xs.size:G["subtitle-text"],color:w?H.colors["text-disabled"]:H.colors["text-muted"]},D?U.menuSubtitle:null,z],numberOfLines:o,children:n}):n,r?(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[U.description,{fontSize:G["subtitle-text"],color:w?H.colors["text-disabled"]:H.colors["text-subtle"]},O],numberOfLines:2,children:r}):null,null!=l&&!1!==l?(0,_jsxRuntime.jsx)(_reactNative.View,{style:U.body,children:l}):null,Z?(0,_jsxRuntime.jsx)(_reactNative.View,{style:[U.rightBelow,M],children:m}):null]}),m&&!Z||L?(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[U.rightSlot,Z?null:M],children:[Z?null:m,L?(0,_jsxRuntime.jsx)(_reactNative.View,{style:m&&!Z?U.chevronWithRight:null,children:(0,_jsxRuntime.jsx)(Chevron,{color:w?H.colors["text-disabled"]:H.colors["text-subtle"]})}):null]}):null]}),de=Y?(0,_jsxRuntime.jsx)(_reactNative.Pressable,{ref:Q,onPress:e=>{$&&X&&!se.isFlick(e)&&(v&&(0,_hapticUtils.triggerHaptic)(v),_?p?.(!h):b?.(e))},onPressIn:e=>{se.onPressIn(e),te()},onPressOut:ie,disabled:!$,onFocus:g,accessibilityRole:_?"checkbox":D?"menuitem":b?"button":void 0,accessibilityLabel:ne,accessibilityHint:A,accessibilityState:_?{checked:h,disabled:!$,expanded:f}:{selected:y,disabled:!$,expanded:f,...void 0!==F?{checked:F}:null},"aria-disabled":!$,"aria-expanded":f,..._?{"aria-checked":h}:void 0!==F?{"aria-checked":F}:{"aria-selected":y},...void 0!==F?WEB_CHECKABLE_ROLE:null,testID:T,android_ripple:{color:H.colors["surface-pressed"],borderless:!1},style:({pressed:e})=>[q,e?U.pressed:null],...J.hostProps,children:(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{style:ee,children:ce})}):(0,_jsxRuntime.jsx)(_reactNative.View,{ref:t,accessibilityRole:"none",accessibilityLabel:ne,accessibilityHint:A,accessibilityState:{selected:y,disabled:w},"aria-selected":y,"aria-disabled":w,testID:T,style:q,children:ce}),ue=k&&k.length>0||N&&N.length>0,me=ae?(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[y?{backgroundColor:H.colors["surface-selected"]}:null,I?U.divider:null],children:[de,(0,_jsxRuntime.jsx)(_reactNative.View,{style:U.actions,children:renderActions(j)})]}):de,xe=ue?(0,_jsxRuntime.jsx)(_index5.Swipeable,{leftActions:k,rightActions:N,accessibilityLabel:ne,children:me}):me;return s?(0,_jsxRuntime.jsx)(ListItemSkeleton,{...e}):J.enabled?(0,_jsxRuntime.jsxs)(_jsxRuntime.Fragment,{children:[xe,J.renderSurface((0,_jsxRuntime.jsx)(_reactNative.View,{style:U.preview,children:ce}))]}):xe}));ListItem.displayName="ListItem";const ListItemSkeleton=({subtitle:e,description:t,left:i,icon:s,right:n,chevron:r,size:l="md",variant:a="list",containerStyle:o,style:c})=>{const d=(0,_index.useTheme)(),u=(0,_index.resolveListItemSize)(d,l),m=Math.round(1.15*u["title-text"]),x=Math.round(1.15*u["subtitle-text"]),_="menu"===a;return(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[{flexDirection:"row",alignItems:"center",paddingHorizontal:d.space.md,paddingVertical:_?d.space.sm:u["padding-y"],minHeight:_?48:u["min-height"]},o,c],children:[void 0!==i||void 0!==s?(0,_jsxRuntime.jsx)(_reactNative.View,{style:{marginRight:d.space.sm},children:(0,_jsxRuntime.jsx)(_index4.Skeleton,{shape:"circle",width:40,height:40})}):null,(0,_jsxRuntime.jsxs)(_reactNative.View,{style:{flex:1},children:[(0,_jsxRuntime.jsx)(_index4.Skeleton,{shape:"text",width:"70%",height:m,style:{marginBottom:d.space.xs}}),void 0!==e?(0,_jsxRuntime.jsx)(_index4.Skeleton,{shape:"text",width:"50%",height:x,style:void 0!==t?{marginBottom:d.space.xs}:void 0}):null,void 0!==t?(0,_jsxRuntime.jsx)(_index4.Skeleton,{shape:"text",width:"85%",height:x}):null]}),void 0!==n||r?(0,_jsxRuntime.jsx)(_reactNative.View,{style:{marginLeft:d.space.sm},children:(0,_jsxRuntime.jsx)(_index4.Skeleton,{width:20,height:20,radius:"sm"})}):null]})};ListItemSkeleton.displayName="ListItemSkeleton",ListItem.Skeleton=ListItemSkeleton;const buildStyles=e=>_reactNative.StyleSheet.create({row:{flexDirection:"row",alignItems:"center",paddingHorizontal:e.space.md},divider:{borderBottomWidth:_reactNative.StyleSheet.hairlineWidth,borderBottomColor:e.colors.border},pressed:{backgroundColor:e.colors["surface-pressed"]},disabled:{opacity:.55},leftSlot:{marginRight:e.space.md,alignItems:"center",justifyContent:"center"},middle:{flex:1,flexDirection:"column",justifyContent:"center"},selectionLead:{flexDirection:"row",alignItems:"center"},selectionLeadContent:{marginLeft:e.space.sm},body:{marginTop:e.space.xs},rightBelow:{alignSelf:"flex-start",flexDirection:"row",alignItems:"center",marginTop:e.space.xs},rightSlot:{marginLeft:e.space.md,alignItems:"center",justifyContent:"center",flexDirection:"row"},actions:{flexDirection:"row",flexWrap:"wrap",gap:e.space.sm,paddingHorizontal:e.space.md,paddingBottom:e.space.md},chevronWithRight:{marginLeft:e.space.xs},preview:{flex:1,backgroundColor:e.colors.surface,borderRadius:e.radius.md,..._corners.smoothCorners,overflow:"hidden"},title:{letterSpacing:e["letter-spacing"].normal},subtitle:{marginTop:e.space.xxs,...(0,_index.fontFor)(e,"normal")},menuSubtitle:{marginTop:0},description:{marginTop:e.space.xxs,...(0,_index.fontFor)(e,"normal")}}),stylesFor=(0,_themeStyles.themeStyles)(buildStyles);var _default=exports.default=ListItem;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=exports.ListSection=void 0;var _react=require("react"),_index=require("../../theme/index.js"),_warnInvalidValue=require("../../utils/warnInvalidValue.js"),_index2=require("../Card/index.js"),_index3=require("../Divider/index.js"),_index4=require("../SectionHeader/index.js"),_index5=require("../Text/index.js"),_jsxRuntime=require("react/jsx-runtime");const useStyles=(0,_index.makeStyles)(e=>({footer:{marginTop:e.space.sm,paddingHorizontal:e.space.md}})),ListSection=e=>{const{title:i,action:t,footer:n,variant:r="outline",testID:a,children:s}=e;(0,_warnInvalidValue.warnInvalidValue)("ListSection","variant",e.variant,["elevated","outline","filled","flat"]);const d=useStyles(),l=_react.Children.toArray(s).filter(_react.isValidElement).flatMap((e,i)=>0===i?[e]:[(0,_jsxRuntime.jsx)(_index3.Divider,{},`divider-${e.key}`),e]);return(0,_jsxRuntime.jsxs)(_jsxRuntime.Fragment,{children:[i?(0,_jsxRuntime.jsx)(_index4.SectionHeader,{variant:"caps",action:t,children:i}):null,(0,_jsxRuntime.jsx)(_index2.Card,{variant:r,padding:"none",testID:a,children:l}),n?(0,_jsxRuntime.jsx)(_index5.Text,{variant:"caption",color:"secondary",style:d.footer,children:n}):null]})};exports.ListSection=ListSection;var _default=exports.default=ListSection;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),Object.defineProperty(exports,"ListSection",{enumerable:!0,get:function(){return _ListSection.ListSection}}),Object.defineProperty(exports,"default",{enumerable:!0,get:function(){return _ListSection.default}});var cache,_ListSection=_interopRequireWildcard(require("./ListSection.js"));function _interopRequireWildcard(e,t){if(!t&&e&&e.__esModule)return e;var r,c,i=Object.defineProperty,n={__proto__:null,default:e};if(Object(e)!==e)return n;if(cache||"function"!=typeof WeakMap||(cache=new WeakMap),cache){if(cache.has(e))return cache.get(e);cache.set(e,n)}for(c in e)"default"!==c&&{}.hasOwnProperty.call(e,c)&&((r=i&&Object.getOwnPropertyDescriptor(e,c))&&(r.get||r.set)?i(n,c,r):n[c]=e[c]);return n}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.MenuSurface=void 0;var _react=require("react"),_reactNative=require("react-native"),_reactNativeSafeAreaContext=require("react-native-safe-area-context"),_usePresenceMotion=require("../../hooks/usePresenceMotion.js"),_index=require("../../theme/index.js"),_corners=require("../../utils/corners.js"),_hapticUtils=require("../../utils/hapticUtils.js"),_placement=require("../../utils/placement.js"),_responsive=require("../../utils/responsive.js"),_AppIcon=require("../AppIcon/AppIcon.js"),_slotIcon=require("../AppIcon/slotIcon.js"),_index2=require("../Divider/index.js"),_ModalSafeArea=require("../ModalSafeArea/ModalSafeArea.js"),_index3=require("../OptionSheet/index.js"),_index4=require("../Text/index.js"),_ToastProvider=require("../Toast/ToastProvider.js"),_focusHost=require("./focusHost.js"),_menuModel=require("./menuModel.js"),_webOnly=require("./webOnly.js"),_jsxRuntime=require("react/jsx-runtime");const MENU_MIN_WIDTH=180,MENU_MAX_WIDTH=280,ROW_MIN_HEIGHT=48,TOP_ACTION_MIN_HEIGHT=64,ICON_SIZE=20,PREVIEW_LIFT=1.02,BACK_KEY="__menu-back",TOP_PREFIX="__menu-top:",WEB_CHECKABLE_ROLE=(0,_webOnly.webOnly)({role:"menuitemcheckbox"}),MenuSurface=e=>{const{open:t,anchor:s,items:i,title:r,topActions:n,placement:o,presentation:a,unavailable:l,context:c=!1,preview:u,onClose:d,restoreFocusTo:_,haptic:m,accessibilityLabel:p,labels:x,testID:b}=e,h=(0,_index.useTheme)(),f=(0,_react.useMemo)(()=>buildStyles(h),[h]),v=(0,_reactNativeSafeAreaContext.useSafeAreaInsets)(),[j,y]=(0,_ModalSafeArea.useModalInsets)(),R=(0,_react.useMemo)(()=>({...v,top:j.top,bottom:j.bottom}),[v,j]),g=(0,_reactNative.useWindowDimensions)(),w=(0,_usePresenceMotion.usePresenceMotion)(),A=w.duration("fast"),I=(0,_react.useMemo)(()=>(0,_menuModel.visibleGroups)(i,l),[i,l]),k=(0,_react.useMemo)(()=>(0,_menuModel.visibleTopActions)(n,l),[n,l]),M="sheet"===a||"auto"===a&&g.width<_responsive.Breakpoints.lg&&(0,_menuModel.wantsSheet)(I,k),[N,S]=(0,_react.useState)(null),[E,C]=(0,_react.useState)(null),T=(0,_react.useRef)(d);T.current=d;const O=(0,_react.useRef)(_);O.current=_;const P=(0,_react.useRef)(null),D=(0,_react.useRef)(!1),H=(0,_react.useRef)(!1),L=(0,_react.useRef)(new Map),q=(0,_react.useRef)(null),B=(0,_react.useCallback)(()=>{if(!D.current)return;D.current=!1;const e=P.current;P.current=null,e?e():(0,_focusHost.focusHost)(O.current?.())},[]);(0,_react.useEffect)(()=>{if(t)return H.current=!0,D.current=!1,P.current=null,(0,_placement.claimAnchoredSurface)(()=>T.current());H.current&&(H.current=!1,D.current=!0,S(null),C(null),M||"ios"===_reactNative.Platform.OS||B())},[t]);const V=(0,_react.useCallback)(e=>{if(e.disabled)return;const t=(0,_hapticUtils.resolveHaptic)(m,"selection");t&&(0,_hapticUtils.triggerHaptic)(t),e.key!==BACK_KEY?e.submenu?S(e):(P.current=e.onPress??null,T.current()):S(null)},[m]),F=(0,_react.useMemo)(()=>({width:g.width,height:g.height,insets:R}),[g.width,g.height,R]),K=(0,_react.useMemo)(()=>{if(!s||!E)return null;const e=s.x+s.width/2>F.width/2?"end":"start";return(0,_placement.computePlacement)(s,E,F,o,{align:e})},[s,E,F,o]);let W=F.height-R.top-R.bottom-2*_placement.PLACEMENT_MARGIN;if(s&&K){const e=(0,_placement.placementRoom)(s,F);W="top"===K.placement?e.above:e.below}const z=Math.min(280,F.width-R.left-R.right-2*_placement.PLACEMENT_MARGIN),$=t&&null!==K,G=(0,_react.useRef)((0,_index.createAnimatedValue)(0)).current,U=(0,_react.useRef)((0,_index.createAnimatedValue)(1)).current;(0,_react.useEffect)(()=>{if(!$)return(0,_index.setNativeValue)(G,0),void(0,_index.setNativeValue)(U,1);const e=[_reactNative.Animated.timing(G,{toValue:1,duration:A,easing:_reactNative.Easing.bezier(...h.motion.ease.decelerate),useNativeDriver:!0})];c&&!w.reduced&&e.push(_reactNative.Animated.spring(U,{toValue:1.02,damping:h.motion.spring.snappy.damping,stiffness:h.motion.spring.snappy.stiffness,mass:h.motion.spring.snappy.mass,useNativeDriver:!0}));const t=_reactNative.Animated.parallel(e);return t.start(),()=>t.stop()},[$,c,w.reduced,G,U,h.motion,A]);const Y=(0,_react.useCallback)(e=>{const{width:t,height:s}=e.nativeEvent.layout;C(e=>e&&e.width===t&&e.height===s?e:{width:t,height:s})},[]),X=c&&"top"===K?.placement,Z=N?.submenu?[N.submenu]:I,J=X?[...Z].reverse().map(e=>[...e].reverse()):Z,Q=[];if(N)Q.push({key:BACK_KEY,label:N.label});else for(const e of k)Q.push({key:`${TOP_PREFIX}${e.key}`,label:e.label,item:e});for(const e of J)for(const t of e)Q.push({key:t.key,label:t.label,item:t});const ee=Q[0]?.key;(0,_react.useEffect)(()=>{if(!$||M||!ee)return;const e=setTimeout(()=>(0,_focusHost.focusHost)(L.current.get(ee)),_focusHost.FOCUS_DELAY_MS);return()=>clearTimeout(e)},[$,M,ee]);const setItemRef=e=>t=>{t?L.current.set(e,t):L.current.delete(e)},te=(0,_webOnly.webOnly)({onKeyDown:e=>{const t=e.key??e.nativeEvent?.key??"",s=Q.length,i=Q.findIndex(e=>e.key===q.current);let r=-1;if("ArrowDown"===t)r=(i+1)%s;else if("ArrowUp"===t)r=i<=0?s-1:i-1;else if("Home"===t)r=0;else if("End"===t)r=s-1;else{if("ArrowLeft"===t&&N)return e.preventDefault?.(),void S(null);if("ArrowRight"===t&&Q[i]?.item?.submenu)return e.preventDefault?.(),void V(Q[i].item);if(1===t.length&&""!==t.trim()){const e=t.toLowerCase();for(let t=1;t<=s;t+=1){const n=(i+t)%s;if(Q[n].label.toLowerCase().startsWith(e)){r=n;break}}}}r>=0&&(e.preventDefault?.(),(e=>{const t=Q[e];t&&(0,_focusHost.focusHost)(L.current.get(t.key))})(r))}});if(M){const e=N?.submenu?[{key:BACK_KEY,label:x.back,icon:"chevron-left"},...N.submenu]:[...k,...I.flat()],s=[...new Set(e.filter(e=>e.checked).map(e=>e.key))];return(0,_jsxRuntime.jsx)(_index3.OptionSheet,{visible:t,onClose:d,onAfterClose:B,title:N?.label??r,options:e,getOptionLabel:e=>e.label,getOptionValue:e=>e.key,isOptionDisabled:e=>Boolean(e.disabled),destructiveOf:e=>Boolean(e.destructive),getOptionDescription:e=>e.description,getOptionIcon:e=>{const t=e;return(0,_slotIcon.renderSlotIcon)(t.icon,{color:t.destructive?h.colors["danger-text"]:h.colors["text-muted"],size:20,disabled:Boolean(t.disabled)})},value:s,onChange:(e,t)=>V(t),accessibilityLabel:p??r,testID:b?`${b}-sheet`:void 0})}const inkFor=e=>e.disabled?h.colors["text-disabled"]:e.destructive?h.colors["danger-text"]:h.colors["text-body"],inkRoleFor=e=>e.disabled?"disabled":e.destructive?"danger":"primary",se=N?(0,_jsxRuntime.jsxs)(_jsxRuntime.Fragment,{children:[(0,_jsxRuntime.jsxs)(_reactNative.Pressable,{ref:setItemRef(BACK_KEY),onPress:()=>S(null),onFocus:()=>{q.current=BACK_KEY},accessibilityRole:"menuitem",accessibilityLabel:`${x.back}, ${N.label}`,android_ripple:{color:h.colors["surface-pressed"],borderless:!1},style:({pressed:e})=>[f.row,e?f.pressed:null],children:[(0,_jsxRuntime.jsx)(_reactNative.View,{style:f.icon,children:(0,_jsxRuntime.jsx)(_AppIcon.AppIcon,{name:"chevron-left",size:20,color:h.colors["text-muted"]})}),(0,_jsxRuntime.jsx)(_index4.Text,{variant:"body",weight:"semibold",numberOfLines:1,style:f.labels,children:N.label})]}),(0,_jsxRuntime.jsx)(_index2.Divider,{spacing:"none"})]}):(0,_jsxRuntime.jsxs)(_jsxRuntime.Fragment,{children:[r?(0,_jsxRuntime.jsx)(_index4.Text,{variant:"caption",color:"secondary",accessibilityRole:"header",numberOfLines:2,style:f.title,children:r}):null,k.length>0?(0,_jsxRuntime.jsxs)(_jsxRuntime.Fragment,{children:[(0,_jsxRuntime.jsx)(_reactNative.View,{style:f.topRow,children:k.map(e=>{const t=`${TOP_PREFIX}${e.key}`,s=Boolean(e.disabled),i=inkFor(e);return(0,_jsxRuntime.jsxs)(_reactNative.Pressable,{ref:setItemRef(t),onPress:()=>V(e),onFocus:()=>{q.current=t},disabled:s,accessibilityRole:"menuitem",accessibilityLabel:e.accessibilityLabel??e.label,accessibilityState:{disabled:s},"aria-disabled":s,testID:e.testID,style:({pressed:e})=>[f.topAction,e?f.pressed:null],children:[(0,_slotIcon.renderSlotIcon)(e.icon,{color:i,size:20,disabled:s}),(0,_jsxRuntime.jsx)(_index4.Text,{variant:"caption",color:inkRoleFor(e),numberOfLines:1,children:e.label})]},t)})}),(0,_jsxRuntime.jsx)(_index2.Divider,{spacing:"none"})]}):null]});return(0,_jsxRuntime.jsx)(_reactNative.Modal,{visible:t,transparent:!0,statusBarTranslucent:!0,presentationStyle:"overFullScreen",animationType:"none",onRequestClose:d,onDismiss:B,children:(0,_jsxRuntime.jsxs)(_ModalSafeArea.ModalSafeArea,{onInsets:y,children:[(0,_jsxRuntime.jsx)(_reactNative.Pressable,{style:[_reactNative.StyleSheet.absoluteFill,c?f.scrim:null],onPress:d,accessibilityRole:"button",accessibilityLabel:x.close,testID:b?`${b}-scrim`:void 0}),c&&u&&s?(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{pointerEvents:"none",accessibilityElementsHidden:!0,importantForAccessibility:"no-hide-descendants",style:[f.preview,{left:s.x,top:s.y,width:s.width,height:s.height,transform:[{scale:U}]}],children:u}):null,(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{accessibilityRole:"menu",accessibilityLabel:N?.label??p??r,onLayout:Y,testID:b?`${b}-menu`:void 0,...te,style:[f.anchored,{left:K?.x??0,top:K?.y??0,maxWidth:z,opacity:$?G:0}],children:(0,_jsxRuntime.jsx)(_reactNative.View,{style:f.surface,children:(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[f.clip,{maxHeight:W}],children:[se,(0,_jsxRuntime.jsx)(_reactNative.ScrollView,{style:f.scroll,bounces:!1,keyboardShouldPersistTaps:"handled",children:J.map((e,t)=>{const s=e.some(e=>null!=e.icon);return(0,_jsxRuntime.jsxs)(_reactNative.View,{children:[t>0?(0,_jsxRuntime.jsx)(_index2.Divider,{spacing:"none"}):null,e.map(e=>((e,t)=>{const s=Boolean(e.disabled),i=inkFor(e);return(0,_jsxRuntime.jsxs)(_reactNative.Pressable,{ref:setItemRef(e.key),onPress:()=>V(e),onFocus:()=>{q.current=e.key},disabled:s,accessibilityRole:"menuitem",accessibilityLabel:e.accessibilityLabel??e.label,accessibilityState:{disabled:s,checked:e.checked},"aria-disabled":s,"aria-checked":e.checked,...void 0!==e.checked?WEB_CHECKABLE_ROLE:null,android_ripple:{color:h.colors["surface-pressed"],borderless:!1},testID:e.testID,style:({pressed:e})=>[f.row,e?f.pressed:null],children:[t?(0,_jsxRuntime.jsx)(_reactNative.View,{style:f.icon,children:(0,_slotIcon.renderSlotIcon)(e.icon,{color:i,size:20,disabled:s})}):null,(0,_jsxRuntime.jsxs)(_reactNative.View,{style:f.labels,children:[(0,_jsxRuntime.jsx)(_index4.Text,{variant:"body",color:inkRoleFor(e),numberOfLines:2,children:e.label}),e.description?(0,_jsxRuntime.jsx)(_index4.Text,{variant:"caption",color:"secondary",numberOfLines:2,children:e.description}):null]}),e.detail?(0,_jsxRuntime.jsx)(_index4.Text,{variant:"caption",color:"tertiary",children:e.detail}):null,e.checked?(0,_jsxRuntime.jsx)(_AppIcon.AppIcon,{name:"check",size:20,color:h.colors.primary}):null,e.submenu?(0,_jsxRuntime.jsx)(_AppIcon.AppIcon,{name:"chevron-right",size:20,color:h.colors["text-subtle"]}):null]},e.key)})(e,s))]},e[0].key)})})]})})}),(0,_jsxRuntime.jsx)(_ToastProvider.ToastHost,{})]})})};exports.MenuSurface=MenuSurface;const buildStyles=e=>_reactNative.StyleSheet.create({scrim:{backgroundColor:e.colors.scrim},preview:{position:"absolute"},anchored:{position:"absolute",minWidth:180},surface:{backgroundColor:e.colors.surface,borderRadius:e.radius.md,..._corners.smoothCorners,...e.shadow.popover},clip:{borderRadius:e.radius.md,..._corners.smoothCorners,overflow:"hidden"},scroll:{flexGrow:0,flexShrink:1},title:{paddingHorizontal:e.space.md,paddingTop:e.space.sm,paddingBottom:e.space.xs},row:{flexDirection:"row",alignItems:"center",gap:e.space.md,minHeight:48,paddingHorizontal:e.space.md,paddingVertical:e.space.sm},pressed:{backgroundColor:e.colors["surface-pressed"]},icon:{width:20,alignItems:"center"},labels:{flexGrow:1,flexShrink:1},topRow:{flexDirection:"row",padding:e.space.xs,gap:e.space.xs},topAction:{flexGrow:1,flexBasis:0,alignItems:"center",justifyContent:"center",gap:e.space.xs,minHeight:64,borderRadius:e.radius.sm,..._corners.smoothCorners}});
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.MenuSurface=void 0;var _react=require("react"),_reactNative=require("react-native"),_reactNativeSafeAreaContext=require("react-native-safe-area-context"),_usePresenceMotion=require("../../hooks/usePresenceMotion.js"),_index=require("../../theme/index.js"),_corners=require("../../utils/corners.js"),_hapticUtils=require("../../utils/hapticUtils.js"),_placement=require("../../utils/placement.js"),_responsive=require("../../utils/responsive.js"),_AppIcon=require("../AppIcon/AppIcon.js"),_slotIcon=require("../AppIcon/slotIcon.js"),_index2=require("../Box/index.js"),_index3=require("../Divider/index.js"),_index4=require("../ListItem/index.js"),_ModalSafeArea=require("../ModalSafeArea/ModalSafeArea.js"),_index5=require("../OptionSheet/index.js"),_index6=require("../Text/index.js"),_ToastProvider=require("../Toast/ToastProvider.js"),_focusHost=require("./focusHost.js"),_menuModel=require("./menuModel.js"),_webOnly=require("./webOnly.js"),_jsxRuntime=require("react/jsx-runtime");const MENU_MIN_WIDTH=180,MENU_MAX_WIDTH=280,TOP_ACTION_MIN_HEIGHT=64,ICON_SIZE=20,PREVIEW_LIFT=1.02,BACK_KEY="__menu-back",TOP_PREFIX="__menu-top:",MenuSurface=e=>{const{open:t,anchor:s,items:i,title:n,topActions:r,placement:o,presentation:a,unavailable:c,context:l=!1,preview:u,onClose:d,restoreFocusTo:_,haptic:m,accessibilityLabel:p,labels:x,testID:b}=e,h=(0,_index.useTheme)(),f=(0,_react.useMemo)(()=>buildStyles(h),[h]),v=(0,_reactNativeSafeAreaContext.useSafeAreaInsets)(),[j,y]=(0,_ModalSafeArea.useModalInsets)(),R=(0,_react.useMemo)(()=>({...v,top:j.top,bottom:j.bottom}),[v,j]),g=(0,_reactNative.useWindowDimensions)(),w=(0,_usePresenceMotion.usePresenceMotion)(),I=w.duration("fast"),A=(0,_react.useMemo)(()=>(0,_menuModel.visibleGroups)(i,c),[i,c]),M=(0,_react.useMemo)(()=>(0,_menuModel.visibleTopActions)(r,c),[r,c]),k="sheet"===a||"auto"===a&&g.width<_responsive.Breakpoints.lg&&(0,_menuModel.wantsSheet)(A,M),[S,N]=(0,_react.useState)(null),[T,C]=(0,_react.useState)(null),E=(0,_react.useRef)(d);E.current=d;const P=(0,_react.useRef)(_);P.current=_;const D=(0,_react.useRef)(null),L=(0,_react.useRef)(!1),O=(0,_react.useRef)(!1),q=(0,_react.useRef)(new Map),H=(0,_react.useRef)(null),V=(0,_react.useCallback)(()=>{if(!L.current)return;L.current=!1;const e=D.current;D.current=null,e?e():(0,_focusHost.focusHost)(P.current?.())},[]);(0,_react.useEffect)(()=>{if(t)return O.current=!0,L.current=!1,D.current=null,(0,_placement.claimAnchoredSurface)(()=>E.current());O.current&&(O.current=!1,L.current=!0,N(null),C(null),k||"ios"===_reactNative.Platform.OS||V())},[t]);const B=(0,_react.useCallback)(e=>{if(e.disabled)return;const t=(0,_hapticUtils.resolveHaptic)(m,"selection");t&&(0,_hapticUtils.triggerHaptic)(t),e.key!==BACK_KEY?e.submenu?N(e):(D.current=e.onPress??null,E.current()):N(null)},[m]),F=(0,_react.useMemo)(()=>({width:g.width,height:g.height,insets:R}),[g.width,g.height,R]),K=(0,_react.useMemo)(()=>{if(!s||!T)return null;const e=s.x+s.width/2>F.width/2?"end":"start";return(0,_placement.computePlacement)(s,T,F,o,{align:e})},[s,T,F,o]);let $=F.height-R.top-R.bottom-2*_placement.PLACEMENT_MARGIN;if(s&&K){const e=(0,_placement.placementRoom)(s,F);$="top"===K.placement?e.above:e.below}const z=Math.min(280,F.width-R.left-R.right-2*_placement.PLACEMENT_MARGIN),U=t&&null!==K,W=(0,_react.useRef)((0,_index.createAnimatedValue)(0)).current,Y=(0,_react.useRef)((0,_index.createAnimatedValue)(1)).current;(0,_react.useEffect)(()=>{if(!U)return(0,_index.setNativeValue)(W,0),void(0,_index.setNativeValue)(Y,1);const e=[_reactNative.Animated.timing(W,{toValue:1,duration:I,easing:_reactNative.Easing.bezier(...h.motion.ease.decelerate),useNativeDriver:!0})];l&&!w.reduced&&e.push(_reactNative.Animated.spring(Y,{toValue:1.02,damping:h.motion.spring.snappy.damping,stiffness:h.motion.spring.snappy.stiffness,mass:h.motion.spring.snappy.mass,useNativeDriver:!0}));const t=_reactNative.Animated.parallel(e);return t.start(),()=>t.stop()},[U,l,w.reduced,W,Y,h.motion,I]);const G=(0,_react.useCallback)(e=>{const{width:t,height:s}=e.nativeEvent.layout;C(e=>e&&e.width===t&&e.height===s?e:{width:t,height:s})},[]),X=l&&"top"===K?.placement,Z=S?.submenu?[S.submenu]:A,J=X?[...Z].reverse().map(e=>[...e].reverse()):Z,Q=[];if(S)Q.push({key:BACK_KEY,label:S.label});else for(const e of M)Q.push({key:`${TOP_PREFIX}${e.key}`,label:e.label,item:e});for(const e of J)for(const t of e)Q.push({key:t.key,label:t.label,item:t});const ee=Q[0]?.key;(0,_react.useEffect)(()=>{if(!U||k||!ee)return;const e=setTimeout(()=>(0,_focusHost.focusHost)(q.current.get(ee)),_focusHost.FOCUS_DELAY_MS);return()=>clearTimeout(e)},[U,k,ee]);const setItemRef=e=>t=>{t?q.current.set(e,t):q.current.delete(e)},te=(0,_webOnly.webOnly)({onKeyDown:e=>{const t=e.key??e.nativeEvent?.key??"",s=Q.length,i=Q.findIndex(e=>e.key===H.current);let n=-1;if("ArrowDown"===t)n=(i+1)%s;else if("ArrowUp"===t)n=i<=0?s-1:i-1;else if("Home"===t)n=0;else if("End"===t)n=s-1;else{if("ArrowLeft"===t&&S)return e.preventDefault?.(),void N(null);if("ArrowRight"===t&&Q[i]?.item?.submenu)return e.preventDefault?.(),void B(Q[i].item);if(1===t.length&&""!==t.trim()){const e=t.toLowerCase();for(let t=1;t<=s;t+=1){const r=(i+t)%s;if(Q[r].label.toLowerCase().startsWith(e)){n=r;break}}}}n>=0&&(e.preventDefault?.(),(e=>{const t=Q[e];t&&(0,_focusHost.focusHost)(q.current.get(t.key))})(n))}});if(k){const e=S?.submenu?[{key:BACK_KEY,label:x.back,icon:"chevron-left"},...S.submenu]:[...M,...A.flat()],s=[...new Set(e.filter(e=>e.checked).map(e=>e.key))];return(0,_jsxRuntime.jsx)(_index5.OptionSheet,{visible:t,onClose:d,onAfterClose:V,title:S?.label??n,options:e,getOptionLabel:e=>e.label,getOptionValue:e=>e.key,isOptionDisabled:e=>Boolean(e.disabled),destructiveOf:e=>Boolean(e.destructive),getOptionDescription:e=>e.description,getOptionIcon:e=>{const t=e;return(0,_slotIcon.renderSlotIcon)(t.icon,{color:t.destructive?h.colors["danger-text"]:h.colors["text-muted"],size:20,disabled:Boolean(t.disabled)})},value:s,onChange:(e,t)=>B(t),accessibilityLabel:p??n,testID:b?`${b}-sheet`:void 0})}const inkFor=e=>e.disabled?h.colors["text-disabled"]:e.destructive?h.colors["danger-text"]:h.colors["text-body"],inkRoleFor=e=>e.disabled?"disabled":e.destructive?"danger":"primary",se=S?(0,_jsxRuntime.jsxs)(_jsxRuntime.Fragment,{children:[(0,_jsxRuntime.jsx)(_index4.ListItem,{ref:setItemRef(BACK_KEY),variant:"menu",onPress:()=>N(null),onFocus:()=>{H.current=BACK_KEY},accessibilityLabel:`${x.back}, ${S.label}`,left:(0,_jsxRuntime.jsx)(_reactNative.View,{style:f.icon,children:(0,_jsxRuntime.jsx)(_AppIcon.AppIcon,{name:"chevron-left",size:20,color:h.colors["text-muted"]})}),title:(0,_jsxRuntime.jsx)(_index6.Text,{variant:"body",weight:"semibold",numberOfLines:1,children:S.label})}),(0,_jsxRuntime.jsx)(_index3.Divider,{spacing:"none"})]}):(0,_jsxRuntime.jsxs)(_jsxRuntime.Fragment,{children:[n?(0,_jsxRuntime.jsx)(_index6.Text,{variant:"caption",color:"secondary",accessibilityRole:"header",numberOfLines:2,style:f.title,children:n}):null,M.length>0?(0,_jsxRuntime.jsxs)(_jsxRuntime.Fragment,{children:[(0,_jsxRuntime.jsx)(_reactNative.View,{style:f.topRow,children:M.map(e=>{const t=`${TOP_PREFIX}${e.key}`,s=Boolean(e.disabled),i=inkFor(e);return(0,_jsxRuntime.jsxs)(_reactNative.Pressable,{ref:setItemRef(t),onPress:()=>B(e),onFocus:()=>{H.current=t},disabled:s,accessibilityRole:"menuitem",accessibilityLabel:e.accessibilityLabel??e.label,accessibilityState:{disabled:s},"aria-disabled":s,testID:e.testID,style:({pressed:e})=>[f.topAction,e?f.pressed:null],children:[(0,_slotIcon.renderSlotIcon)(e.icon,{color:i,size:20,disabled:s}),(0,_jsxRuntime.jsx)(_index6.Text,{variant:"caption",color:inkRoleFor(e),numberOfLines:1,children:e.label})]},t)})}),(0,_jsxRuntime.jsx)(_index3.Divider,{spacing:"none"})]}):null]});return(0,_jsxRuntime.jsx)(_reactNative.Modal,{visible:t,transparent:!0,statusBarTranslucent:!0,presentationStyle:"overFullScreen",animationType:"none",onRequestClose:d,onDismiss:V,children:(0,_jsxRuntime.jsxs)(_ModalSafeArea.ModalSafeArea,{onInsets:y,children:[(0,_jsxRuntime.jsx)(_reactNative.Pressable,{style:[_reactNative.StyleSheet.absoluteFill,l?f.scrim:null],onPress:d,accessibilityRole:"button",accessibilityLabel:x.close,testID:b?`${b}-scrim`:void 0}),l&&u&&s?(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{pointerEvents:"none",accessibilityElementsHidden:!0,importantForAccessibility:"no-hide-descendants",style:[f.preview,{left:s.x,top:s.y,width:s.width,height:s.height,transform:[{scale:Y}]}],children:u}):null,(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{accessibilityRole:"menu",accessibilityLabel:S?.label??p??n,onLayout:G,testID:b?`${b}-menu`:void 0,...te,style:[f.anchored,{left:K?.x??0,top:K?.y??0,maxWidth:z,opacity:U?W:0}],children:(0,_jsxRuntime.jsx)(_reactNative.View,{style:f.surface,children:(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[f.clip,{maxHeight:$}],children:[se,(0,_jsxRuntime.jsx)(_reactNative.ScrollView,{style:f.scroll,bounces:!1,keyboardShouldPersistTaps:"handled",children:J.map((e,t)=>{const s=e.some(e=>null!=e.icon);return(0,_jsxRuntime.jsxs)(_reactNative.View,{children:[t>0?(0,_jsxRuntime.jsx)(_index3.Divider,{spacing:"none"}):null,e.map(e=>((e,t)=>{const s=Boolean(e.disabled),i=inkFor(e),n=e.detail||e.checked||e.submenu?(0,_jsxRuntime.jsxs)(_index2.Row,{gap:"md",children:[e.detail?(0,_jsxRuntime.jsx)(_index6.Text,{variant:"caption",color:"tertiary",children:e.detail}):null,e.checked?(0,_jsxRuntime.jsx)(_AppIcon.AppIcon,{name:"check",size:20,color:h.colors.primary}):null,e.submenu?(0,_jsxRuntime.jsx)(_AppIcon.AppIcon,{name:"chevron-right",size:20,color:h.colors["text-subtle"]}):null]}):void 0;return(0,_jsxRuntime.jsx)(_index4.ListItem,{ref:setItemRef(e.key),variant:"menu",onPress:()=>B(e),onFocus:()=>{H.current=e.key},disabled:s,checked:e.checked,accessibilityLabel:e.accessibilityLabel??e.label,testID:e.testID,rightPlacement:"side",left:t?(0,_jsxRuntime.jsx)(_reactNative.View,{style:f.icon,children:(0,_slotIcon.renderSlotIcon)(e.icon,{color:i,size:20,disabled:s})}):void 0,title:(0,_jsxRuntime.jsx)(_index6.Text,{variant:"body",color:inkRoleFor(e),numberOfLines:2,children:e.label}),subtitle:e.description?(0,_jsxRuntime.jsx)(_index6.Text,{variant:"caption",color:"secondary",numberOfLines:2,children:e.description}):void 0,right:n},e.key)})(e,s))]},e[0].key)})})]})})}),(0,_jsxRuntime.jsx)(_ToastProvider.ToastHost,{})]})})};exports.MenuSurface=MenuSurface;const buildStyles=e=>_reactNative.StyleSheet.create({scrim:{backgroundColor:e.colors.scrim},preview:{position:"absolute"},anchored:{position:"absolute",minWidth:180},surface:{backgroundColor:e.colors.surface,borderRadius:e.radius.md,..._corners.smoothCorners,...e.shadow.popover},clip:{borderRadius:e.radius.md,..._corners.smoothCorners,overflow:"hidden"},scroll:{flexGrow:0,flexShrink:1},title:{paddingHorizontal:e.space.md,paddingTop:e.space.sm,paddingBottom:e.space.xs},pressed:{backgroundColor:e.colors["surface-pressed"]},icon:{width:20,alignItems:"center"},topRow:{flexDirection:"row",padding:e.space.xs,gap:e.space.xs},topAction:{flexGrow:1,flexBasis:0,alignItems:"center",justifyContent:"center",gap:e.space.xs,minHeight:64,borderRadius:e.radius.sm,..._corners.smoothCorners}});
|