npm - @webority/mobile-ui - Versions diffs - 0.93.0 → 0.94.1 - Mend

@webority/mobile-ui 0.93.0 → 0.94.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (35) hide show

package/lib/commonjs/components/BottomNavigation/BottomNavigation.js CHANGED Viewed

	@@ -1 +1 @@
1	- "use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=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"),_shadows=require("../../utils/shadows.js"),_index3=require("../AppIcon/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_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="__webority_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=>null==e\|\|!1===e?"":"number"==typeof e?e>0?`, ${e} unread`:"":!0===e\|\|"·"===e?", new updates":"string"==typeof e&&e.length>0?`, ${e}`:"",BottomNavigation=exports.BottomNavigation=(0,_react.forwardRef)((e,t)=>{const{tabs:i,centerAction: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:m,marginVertical:_,paddingHorizontal:g,paddingVertical:x,border:b,minimizeOnScroll:f=!1,scrollDirection:y="idle",accessory:v,style:R,indicatorStyle:j,labelStyle:N,labelMaxFontScale:w,testID:S}=e,E=(0,_index.useTheme)(),I=(0,_reactNativeSafeAreaContext.useSafeAreaInsets)(),A=(0,_react.useMemo)(()=>buildStyles(E),[E]),C=h??18,L=C+4+8,T=E.space.lg,D=E.space.lg,M=E.radius.xl,V=(0,_useReducedMotion.useReducedMotion)(),k=(0,_useScreenReaderEnabled.useScreenReaderEnabled)(f),[B,z]=_react.default.useState(null);(0,_react.useEffect)(()=>{null!==B&&B!==y&&z(null)},[B,y]);const P=f&&!k&&"down"===y&&null===B,[H,W]=_react.default.useState(P);(0,_react.useEffect)(()=>{H!==P&&(V\|\|"web"===_reactNative.Platform.OS\|\|_reactNative.LayoutAnimation.configureNext(_reactNative.LayoutAnimation.Presets.easeInEaseOut),W(P))},[H,P,V]);const F="function"==typeof v?v({minimized:H}):v,O=null!=F&&!1!==F,q=H&&O,[U,$]=_react.default.useState(0),X=O&&!q?U+E.space.xs:0,Z="tile"===l,Y="floating"===l\|\|Z,K="bubble"===l,G="expand"===l,J="solid"===l,Q="pill"===l\|\|Y\|\|J,ee=Math.max(0,i.findIndex(e=>e.key===n)),[te,ie]=_react.default.useState(0),[ae,ne]=_react.default.useState(0),re=a?Math.ceil(i.length/2):i.length,oe=i.length+(a?1:0),[se,le]=_react.default.useState({width:0,height:0}),ce=a?.size??48,de=void 0!==a?.gap,ue=Math.max(0,a?.gap??0),pe=de?(se.width\|\|ce)+2ue:0,he=de?i.length>0?Math.max(0,te-pe)/i.length:0:oe>0?te/oe:0,me=de?pe:he,ge=(0,_react.useRef)((0,_index.createAnimatedValue)(ee)).current,xe=(0,_react.useRef)({}),be=(0,_react.useRef)({});i.forEach(e=>{xe.current[e.key]\|\|(xe.current[e.key]=new _reactNative.Animated.Value(1)),be.current[e.key]\|\|(be.current[e.key]=(0,_index.createAnimatedValue)(e.key===n?1:0))});const fe=he>0?Z?Math.min(he-4,96):Math.min(he-T,64):0,ye=he>0?(he-fe)/2:0,ve=he>0?(he-48)/2:0,hasLabel=e=>s&&!H&&!1!==e.showLabel&&e.label.trim().length>0,Re=i[ee],je=Re&&!hasLabel(Re)&&ae>0?ae/2:E.space.xs+(C+4)/2,Ne=je-14-24,we=Math.max(0,ae-4),Se=Z?2:je-L/2,Ee=(0,_react.useRef)(ee);(0,_react.useEffect)(()=>{if(Ee.current===ee)return;Ee.current=ee;const e=_reactNative.Animated.spring(ge,{toValue:ee,tension:120,friction:14,useNativeDriver:!0});return e.start(),()=>e.stop()},[ee,ge]);const Ie=Math.max(1,i.length-1),Ae=(0,_react.useMemo)(()=>{const e=[],t=[];for(let i=0;i<=Ie;i++)e.push(i),t.push(i<re?ihe:ihe+me);return ge.interpolate({inputRange:e,outputRange:t})},[ge,Ie,re,he,me]),Ce=i.map(e=>e.key).join(" "),Le=K\|\|G;(0,_react.useEffect)(()=>{const e=Ce.split(" ").flatMap(e=>{const t=e===n?1:0,i=be.current[e];return i?Le?[_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,Ce,Le]);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()},Te=(0,_react.useRef)(new _reactNative.Animated.Value(1)).current,{colors:De}=E,Me=J?De.primary:De.surface,Ve=J?De["on-primary"]:De.primary,ke=J?De["on-primary"]:Z?De["text-body"]:De["text-subtle"],Be=J?De["on-primary"]:De["primary-soft"],ze=J?De.primary:K?De["on-primary"]:Ve,Pe=m??D,He=_??(Y?D:0),We=He>0,Fe=x??E.space.sm,Oe=g??(Y?E.space.sm:E.space.xs),qe=We?Fe:Math.max(Fe,I.bottom),Ue=We?Math.max(He,I.bottom>0?I.bottom+E.space.sm:0):0,$e="pill"===d,Xe=Y?ae+X+2Fe+2_reactNative.StyleSheet.hairlineWidth:ae+X+Fe+qe,Ze=$e?ae>0?Xe/2:E.radius.pill:d??(Z?E.radius.pill:Y?M:E.radius.none),Ye=void 0!==d,activeBgRadius=(e,t)=>"number"==typeof u?Math.max(0,Math.min(u,e/2)):"auto"===u&&Ye?Math.min(Ze,e/2):t,Ke="underline"===l?Math.max(Oe,$e&&0===ae?0:Ze):Oe,Ge=p??"none",Je="none"===Ge?void 0:E.shadow[Ge],Qe=void 0===Je?null:(0,_shadows.supportsBoxShadow)()?{boxShadow:(0,_shadows.toBoxShadow)(Je)}:Je,et=b?_reactNative.StyleSheet.hairlineWidth:0,tt=J?De.primary:De.border,it=a?.lift??0,at=Fe+et+X,nt=a&&ae>0?Math.max(0,(se.height\|\|ce)/2+it-ae/2-at):0,rt=a?(0,_jsxRuntime.jsx)(_reactNative.View,{style:[A.centerCell,de?{flex:0,marginHorizontal:ue}:null],pointerEvents:"box-none",children:(0,_jsxRuntime.jsx)(_reactNative.Pressable,{onPress:()=>{if(!a)return;const e=a.haptic??o;!1!==e&&(0,_index2.triggerHaptic)(e),popIcon(Te),a.onPress()},onLayout:e=>{const{width:t,height:i}=e.nativeEvent.layout;le(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},style:({pressed:e})=>[{top:-it},e?{opacity:.85}:null],testID:a.testID??(S?`${S}-center`:void 0),children:a.content?(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{style:{transform:[{scale:Te}]},children:a.content}):(0,_jsxRuntime.jsx)(_reactNative.View,{style:[A.centerCircle,{width:ce,height:ce,borderRadius:E.radius.pill,..._corners.smoothCorners,backgroundColor:a.color??De.primary}],children:(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{style:{transform:[{scale:Te}]},children:(0,_index3.renderSlotIcon)(a.icon??"add",{color:a.iconColor??De["on-primary"],size:a.iconSize??24,disabled:!1})})})})},CENTER_KEY):null,ot=O?(0,_jsxRuntime.jsx)(_reactNative.View,{style:q?A.accessoryInline:A.accessoryStacked,onLayout:e=>$(e.nativeEvent.layout.height),testID:S?`${S}-accessory`:void 0,children:F}):null,st=(0,_jsxRuntime.jsxs)(_reactNative.View,{style:q?[A.tabRow,A.tabRowInline]:A.tabRow,onLayout:e=>{const{width:t,height:i}=e.nativeEvent.layout;ie(t),ne(i)},children:[Q&&fe>0&&(!Z\|\|we>0)?(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{pointerEvents:"none",style:[A.pill,{width:fe,height:Z?we:L,left:ye,top:Se,backgroundColor:Be,borderRadius:Z?activeBgRadius(we,we/2):activeBgRadius(L,E.radius.pill),..._corners.smoothCorners,transform:[{translateX:Ae}]},j]}):null,K&&he>0?(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{pointerEvents:"none",style:[A.bubble,E.shadow.elevated,{width:48,height:48,borderRadius:E.radius.pill,..._corners.smoothCorners,left:ve,top:Ne,backgroundColor:De.primary,borderColor:De.surface,transform:[{translateX:Ae}]},j]}):null,(lt=i.map(e=>{const t=e.key===n,i=t?Ve:ke,a=t?ze:ke,s="string"==typeof e.icon?{name:e.icon,variant:"bold"}:e.icon,l=t?e.activeIcon??s:e.icon,c=xe.current[e.key],d=be.current[e.key],u=formatBadge(e.badge??null),p=badgeAccessibilitySuffix(e.badge??null),h=J&&!t?.7:1,m=K&&t\|\|J?De.primary:De.surface,_=hasLabel(e),g=_&&(!G\|\|t),x=(0,_jsxRuntime.jsxs)(_reactNative.Animated.View,{style:[A.iconWrap,{width:C+4,height:C+4,opacity:h,transform:[{scale:c}]}],children:[(0,_index3.renderSlotIcon)(l,{color:a,size:C,focused:t,disabled:!1}),u?(0,_jsxRuntime.jsx)(_reactNative.View,{style:[u.isDot?A.badgeDot:A.badgePill,{backgroundColor:De.danger,borderColor:m}],children:u.isDot?null:(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[A.badgeText,{color:De["on-danger"]}],numberOfLines:1,children:u.text})}):null]}),b=K?(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:w??E.settings.maxFontSizeMultiplier??1.2,style:[A.label,G?A.labelInline:null,{color:i,opacity:G?d:h,fontWeight:t?E.weight.semibold:E.weight.normal},N],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=xe.current[e.key];t&&popIcon(t),r(e.key)})(e),accessibilityRole:"tab",accessibilityState:{selected:t},"aria-selected":t,accessibilityLabel:`${e.label}${p}`,accessibilityHint:`Switches to ${e.label}`,hitSlop:{top:6,bottom:6,left:6,right:6},style:({pressed:e})=>[A.tab,Z?A.tabTile:null,e?{opacity:.85}:null],testID:S?`${S}-tab-${e.key}`:void 0,children:G?(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[A.expandPill,{height:L,paddingHorizontal:t&&_?E.space.md:Math.max(0,(L-(C+4))/2)}],children:[(0,_jsxRuntime.jsx)(_reactNative.View,{pointerEvents:"none",style:[A.expandFill,{borderRadius:activeBgRadius(L,L/2),..._corners.smoothCorners,backgroundColor:t?De["primary-soft"]:"transparent"},t?j:null]}),b,f]}):(0,_jsxRuntime.jsxs)(_jsxRuntime.Fragment,{children:[b,f]})},e.key);return G?(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{style:{flex:d.interpolate({inputRange:[0,1],outputRange:[1,_?1.5:1]})},children:v},e.key):v}),rt?[...lt.slice(0,re),rt,...lt.slice(re)]:lt),"underline"===l&&he>0?(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{pointerEvents:"none",style:[A.underline,"top"===c?A.underlineTop:A.underlineBottom,"top"===c?{top:-Fe-X}:{bottom:-Fe},{width:he,height:3,backgroundColor:De.primary,transform:[{translateX:Ae}]},j]}):null]});var lt;return(0,_jsxRuntime.jsx)(_reactNative.View,{ref:t,testID:S,accessibilityRole:"tablist",style:[A.outer,{paddingHorizontal:Pe,paddingTop:Math.max(He,nt),paddingBottom:Ue},R],children:(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[Y?A.floatingBar:A.dockedBar,q?A.barInline:null,Qe,{backgroundColor:Me,borderColor:tt,borderRadius:Ze,..._corners.smoothCorners},Y?{borderWidth:et,paddingHorizontal:Oe,paddingVertical:Fe}:{borderTopWidth:et,borderBottomWidth:et,borderLeftWidth:et,borderRightWidth:et,paddingHorizontal:Ke,paddingTop:Fe,paddingBottom:qe}],children:[ot,st]})})});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"},centerCircle:{alignItems:"center",justifyContent:"center"},iconWrap:{alignItems:"center",justifyContent:"center",position:"relative"},label:{fontSize:e.text.xs.size,lineHeight:e.text.xs.sizee.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,fontWeight:"700",lineHeight:13,textAlign:"center",includeFontPadding:!1}});var _default=exports.default=BottomNavigation;
1	+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=exports.BottomNavigation=void 0;var 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"),_shadows=require("../../utils/shadows.js"),_index3=require("../AppIcon/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_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="__webority_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=>null==e\|\|!1===e?"":"number"==typeof e?e>0?`, ${e} unread`:"":!0===e\|\|"·"===e?", new updates":"string"==typeof e&&e.length>0?`, ${e}`:"",BottomNavigation=exports.BottomNavigation=(0,_react.forwardRef)((e,t)=>{const{tabs:i,centerAction: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:m,marginVertical:_,paddingHorizontal:g,paddingVertical:x,border:b,minimizeOnScroll:f=!1,scrollDirection:y="idle",accessory:v,style:R,indicatorStyle:j,labelStyle:N,labelMaxFontScale:w,testID:S}=e,E=(0,_index.useTheme)(),I=(0,_reactNativeSafeAreaContext.useSafeAreaInsets)(),A=(0,_react.useMemo)(()=>buildStyles(E),[E]),C=h??18,L=C+4+8,T=E.space.lg,D=E.space.lg,M=E.radius.xl,V=(0,_useReducedMotion.useReducedMotion)(),k=(0,_useScreenReaderEnabled.useScreenReaderEnabled)(f),[z,B]=_react.default.useState(null);(0,_react.useEffect)(()=>{null!==z&&z!==y&&B(null)},[z,y]);const P=f&&!k&&"down"===y&&null===z,[W,F]=_react.default.useState(P);(0,_react.useEffect)(()=>{W!==P&&(V\|\|"web"===_reactNative.Platform.OS\|\|_reactNative.LayoutAnimation.configureNext(_reactNative.LayoutAnimation.Presets.easeInEaseOut),F(P))},[W,P,V]);const H="function"==typeof v?v({minimized:W}):v,O=null!=H&&!1!==H,q=W&&O,[U,$]=_react.default.useState(0),X=O&&!q?U+E.space.xs:0,Z="tile"===l,Y="floating"===l\|\|Z,K="bubble"===l,G="expand"===l,J="solid"===l,Q="pill"===l\|\|Y\|\|J,ee=Math.max(0,i.findIndex(e=>e.key===n)),[te,ie]=_react.default.useState(0),[ae,ne]=_react.default.useState(0),re=a?Math.ceil(i.length/2):i.length,oe=i.length+(a?1:0),[se,le]=_react.default.useState({width:0,height:0}),ce=a?.size??48,de=void 0!==a?.gap,ue=Math.max(0,a?.gap??0),pe=de?(se.width\|\|ce)+2ue:0,he=de?i.length>0?Math.max(0,te-pe)/i.length:0:oe>0?te/oe:0,me=de?pe:he,ge=(0,_react.useRef)((0,_index.createAnimatedValue)(ee)).current,xe=(0,_react.useRef)({}),be=(0,_react.useRef)({});i.forEach(e=>{xe.current[e.key]\|\|(xe.current[e.key]=new _reactNative.Animated.Value(1)),be.current[e.key]\|\|(be.current[e.key]=(0,_index.createAnimatedValue)(e.key===n?1:0))});const fe=he>0?Z?Math.min(he-4,96):Math.min(he-T,64):0,ye=he>0?(he-fe)/2:0,ve=he>0?(he-48)/2:0,hasLabel=e=>s&&!W&&!1!==e.showLabel&&e.label.trim().length>0,Re=i[ee],je=Re&&!hasLabel(Re)&&ae>0?ae/2:E.space.xs+(C+4)/2,Ne=je-14-24,we=Math.max(0,ae-4),Se=Z?2:je-L/2,Ee=(0,_react.useRef)(ee);(0,_react.useEffect)(()=>{if(Ee.current===ee)return;Ee.current=ee;const e=_reactNative.Animated.spring(ge,{toValue:ee,tension:120,friction:14,useNativeDriver:!0});return e.start(),()=>e.stop()},[ee,ge]);const Ie=Math.max(1,i.length-1),Ae=(0,_react.useMemo)(()=>{const e=[],t=[];for(let i=0;i<=Ie;i++)e.push(i),t.push(i<re?ihe:ihe+me);return ge.interpolate({inputRange:e,outputRange:t})},[ge,Ie,re,he,me]),Ce=i.map(e=>e.key).join(" "),Le=K\|\|G;(0,_react.useEffect)(()=>{const e=Ce.split(" ").flatMap(e=>{const t=e===n?1:0,i=be.current[e];return i?Le?[_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,Ce,Le]);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()},Te=(0,_react.useRef)(new _reactNative.Animated.Value(1)).current,{colors:De}=E,Me=J?De.primary:De.surface,Ve=J?De["on-primary"]:De.primary,ke=J?De["on-primary"]:Z?De["text-body"]:De["text-subtle"],ze=J?De["on-primary"]:De["primary-soft"],Be=J?De.primary:K?De["on-primary"]:Ve,Pe=m??D,We=_??(Y?D:0),Fe=We>0,He=x??E.space.sm,Oe=g??(Y?E.space.sm:E.space.xs),qe=Fe?He:Math.max(He,I.bottom),Ue=Fe?Math.max(We,I.bottom>0?I.bottom+E.space.sm:0):0,$e="pill"===d,Xe=Y?ae+X+2He+2_reactNative.StyleSheet.hairlineWidth:ae+X+He+qe,Ze=$e?ae>0?Xe/2:E.radius.pill:d??(Z?E.radius.pill:Y?M:E.radius.none),Ye=void 0!==d,activeBgRadius=(e,t)=>"number"==typeof u?Math.max(0,Math.min(u,e/2)):"auto"===u&&Ye?Math.min(Ze,e/2):t,Ke="underline"===l?Math.max(Oe,$e&&0===ae?0:Ze):Oe,Ge=p??"none",Je="none"===Ge?void 0:E.shadow[Ge],Qe=void 0===Je?null:(0,_shadows.supportsBoxShadow)()?{boxShadow:(0,_shadows.toBoxShadow)(Je)}:Je,et=b?_reactNative.StyleSheet.hairlineWidth:0,tt=J?De.primary:De.border,it=a?.lift??0,at=He+et+X,nt=a&&ae>0?Math.max(0,(se.height\|\|ce)/2+it-ae/2-at):0,rt=a?(0,_jsxRuntime.jsx)(_reactNative.View,{style:[A.centerCell,de?{flex:0,marginHorizontal:ue}: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(Te),a.onPress()},onLayout:e=>{const{width:t,height:i}=e.nativeEvent.layout;le(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},style:({pressed:e})=>[A.centerPressable,{top:-it},e?{opacity:.85}:null],testID:a.testID??(S?`${S}-center`:void 0),children:[a.content?(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{style:{transform:[{scale:Te}]},children:a.content}):(0,_jsxRuntime.jsx)(_reactNative.View,{style:[A.centerCircle,{width:ce,height:ce,borderRadius:E.radius.pill,..._corners.smoothCorners,backgroundColor:a.color??De.primary}],children:(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{style:{transform:[{scale:Te}]},children:(0,_index3.renderSlotIcon)(a.icon??"add",{color:a.iconColor??De["on-primary"],size:a.iconSize??24,disabled:!1})})}),(ot=a,s&&!W&&ot.label.trim().length>0?(0,_jsxRuntime.jsx)(_reactNative.Text,{numberOfLines:1,maxFontSizeMultiplier:w??E.settings.maxFontSizeMultiplier??1.2,style:[A.label,{color:ke,opacity:J?.7:1},N],children:a.label}):null)]})},CENTER_KEY):null;var ot;const st=O?(0,_jsxRuntime.jsx)(_reactNative.View,{style:q?A.accessoryInline:A.accessoryStacked,onLayout:e=>$(e.nativeEvent.layout.height),testID:S?`${S}-accessory`:void 0,children:H}):null,lt=(0,_jsxRuntime.jsxs)(_reactNative.View,{style:q?[A.tabRow,A.tabRowInline]:A.tabRow,onLayout:e=>{const{width:t,height:i}=e.nativeEvent.layout;ie(t),ne(i)},children:[Q&&fe>0&&(!Z\|\|we>0)?(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{pointerEvents:"none",style:[A.pill,{width:fe,height:Z?we:L,left:ye,top:Se,backgroundColor:ze,borderRadius:Z?activeBgRadius(we,we/2):activeBgRadius(L,E.radius.pill),..._corners.smoothCorners,transform:[{translateX:Ae}]},j]}):null,K&&he>0?(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{pointerEvents:"none",style:[A.bubble,E.shadow.elevated,{width:48,height:48,borderRadius:E.radius.pill,..._corners.smoothCorners,left:ve,top:Ne,backgroundColor:De.primary,borderColor:De.surface,transform:[{translateX:Ae}]},j]}):null,(ct=i.map(e=>{const t=e.key===n,i=t?Ve:ke,a=t?Be:ke,s="string"==typeof e.icon?{name:e.icon,variant:"bold"}:e.icon,l=t?e.activeIcon??s:e.icon,c=xe.current[e.key],d=be.current[e.key],u=formatBadge(e.badge??null),p=badgeAccessibilitySuffix(e.badge??null),h=J&&!t?.7:1,m=K&&t\|\|J?De.primary:De.surface,_=hasLabel(e),g=_&&(!G\|\|t),x=(0,_jsxRuntime.jsxs)(_reactNative.Animated.View,{style:[A.iconWrap,{width:C+4,height:C+4,opacity:h,transform:[{scale:c}]}],children:[(0,_index3.renderSlotIcon)(l,{color:a,size:C,focused:t,disabled:!1}),u?(0,_jsxRuntime.jsx)(_reactNative.View,{style:[u.isDot?A.badgeDot:A.badgePill,{backgroundColor:De.danger,borderColor:m}],children:u.isDot?null:(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[A.badgeText,{color:De["on-danger"]}],numberOfLines:1,children:u.text})}):null]}),b=K?(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:w??E.settings.maxFontSizeMultiplier??1.2,style:[A.label,G?A.labelInline:null,{color:i,opacity:G?d:h,fontWeight:t?E.weight.semibold:E.weight.normal},N],children:e.label}):null,v=(0,_jsxRuntime.jsx)(_reactNative.Pressable,{onPress:()=>(e=>{W&&B(y),e.key!==n&&!1!==o&&(0,_index2.triggerHaptic)(o);const t=xe.current[e.key];t&&popIcon(t),r(e.key)})(e),accessibilityRole:"tab",accessibilityState:{selected:t},"aria-selected":t,accessibilityLabel:`${e.label}${p}`,accessibilityHint:`Switches to ${e.label}`,hitSlop:{top:6,bottom:6,left:6,right:6},style:({pressed:e})=>[A.tab,Z?A.tabTile:null,e?{opacity:.85}:null],testID:S?`${S}-tab-${e.key}`:void 0,children:G?(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[A.expandPill,{height:L,paddingHorizontal:t&&_?E.space.md:Math.max(0,(L-(C+4))/2)}],children:[(0,_jsxRuntime.jsx)(_reactNative.View,{pointerEvents:"none",style:[A.expandFill,{borderRadius:activeBgRadius(L,L/2),..._corners.smoothCorners,backgroundColor:t?De["primary-soft"]:"transparent"},t?j:null]}),b,f]}):(0,_jsxRuntime.jsxs)(_jsxRuntime.Fragment,{children:[b,f]})},e.key);return G?(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{style:{flex:d.interpolate({inputRange:[0,1],outputRange:[1,_?1.5:1]})},children:v},e.key):v}),rt?[...ct.slice(0,re),rt,...ct.slice(re)]:ct),"underline"===l&&he>0?(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{pointerEvents:"none",style:[A.underline,"top"===c?A.underlineTop:A.underlineBottom,"top"===c?{top:-He-X}:{bottom:-He},{width:he,height:3,backgroundColor:De.primary,transform:[{translateX:Ae}]},j]}):null]});var ct;return(0,_jsxRuntime.jsx)(_reactNative.View,{ref:t,testID:S,accessibilityRole:"tablist",style:[A.outer,{paddingHorizontal:Pe,paddingTop:Math.max(We,nt),paddingBottom:Ue},R],children:(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[Y?A.floatingBar:A.dockedBar,q?A.barInline:null,Qe,{backgroundColor:Me,borderColor:tt,borderRadius:Ze,..._corners.smoothCorners},Y?{borderWidth:et,paddingHorizontal:Oe,paddingVertical:He}:{borderTopWidth:et,borderBottomWidth:et,borderLeftWidth:et,borderRightWidth:et,paddingHorizontal:Ke,paddingTop:He,paddingBottom:qe}],children:[st,lt]})})});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.sizee.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,fontWeight:"700",lineHeight:13,textAlign:"center",includeFontPadding:!1}});var _default=exports.default=BottomNavigation;

package/lib/commonjs/components/BottomSheet/BottomSheet.js CHANGED Viewed

	@@ -1 +1 @@
1	- "use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.useBottomSheet=exports.default=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"),_ModalSafeArea=require("../ModalSafeArea/ModalSafeArea.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 TABLET_MIN_SHORT_SIDE=600,DIALOG_MAX_WIDTH=560,BottomSheetContext=(0,_react.createContext)(null),useBottomSheet=()=>{const e=(0,_react.useContext)(BottomSheetContext);if(!e)throw new Error("useBottomSheet must be used inside a <BottomSheet>.");return e};exports.useBottomSheet=useBottomSheet;const SPRING_CONFIG={damping:20,stiffness:240,mass:1},CLOSE_VELOCITY_THRESHOLD=1e3,DRAG_ACTIVATION_OFFSET=10,BottomSheet=exports.BottomSheet=(0,_react.forwardRef)((e,t)=>{const{snapPoints:a,index:r,onChange:n,onAnimate:o,onAfterClose:s,enablePanDownToClose:i=!0,enableBackdropPress:c=!0,confirmDismiss:l,scrollable:u=!1,scrollRef:d,onScroll:_,onContentSizeChange:h,onScrollLayout:m,scrollEventThrottle:v,keyboardBehavior:f="shift",mode:b="modal",presentation:p="sheet",handleIndicatorStyle:S,containerStyle:R,header:x,footer:y,headerStyle:N,footerStyle:g,children:w,accessibilityLabel:C,accessibilityViewIsModal:j,testID:M}=e,k=(0,_index.useTheme)(),O=(0,_usePresenceMotion.usePresenceMotion)(),I=(0,_reactNativeSafeAreaContext.useSafeAreaInsets)(),[T,P]=(0,_react.useState)(()=>_reactNative.Dimensions.get("window").height),[E,A]=(0,_react.useState)(()=>_reactNative.Dimensions.get("window").width),H=(0,_react.useCallback)(e=>{const{height:t,width:a}=e.nativeEvent.layout;t>0&&P(e=>e===t?e:t),a>0&&A(e=>e===a?e:a)},[]),B=(0,_reactNative.useWindowDimensions)(),D="dialog"===p\|\|"auto"===p&&Math.min(B.width,B.height)>=600,G=Math.min(560,E-2k.space.xl),[V,q]=(0,_ModalSafeArea.useModalInsets)(),L="modal"===b?V.top:I.top,F="modal"===b?V.bottom:I.bottom,J=a.includes("content"),[W,z]=useMeasuredHeight(),[Y,$]=useMeasuredHeight(),[K,U,X]=useMeasuredHeight(),[Q,Z]=useMeasuredHeight(),ee=D?k.space.md:W,te=J?Math.min(ee+(null!=x?Y:0)+K+(null!=y?Q:0)+F,T-L):0,ae=(0,_react.useCallback)((e,t)=>{J&&X(t),h?.(e,t)},[J,h,X]),re=(0,_react.useMemo)(()=>resolveSnapPoints(a,T,te),[a,T,te]),ne=T,oe=re[re.length-1]??0,se=(0,_reactNativeReanimated.useSharedValue)(ne),ie=(0,_reactNativeReanimated.useSharedValue)(ne),ce=(0,_reactNativeReanimated.useSharedValue)(1),le=(0,_reactNativeReanimated.useSharedValue)(-1),[ue,de]=(0,_react.useState)(-1),he=(0,_react.useRef)(!1),[me,ve]=(0,_react.useState)(!1),[fe,be]=(0,_react.useState)(!1),pe=(0,_react.useRef)(!1),Se=(0,_react.useRef)(s);Se.current=s;const[Re,xe]=(0,_react.useState)(!1),ye=(0,_react.useRef)(-1),Ne=(0,_react.useRef)(!1);Ne.current="modal"===b?fe:Re;const ge=(0,_react.useRef)(l);ge.current=l;const we=(0,_react.useRef)(!1),Ce=(0,_react.useRef)(!0),je=(0,_react.useRef)([]),Me=(0,_react.useCallback)(e=>{const t=je.current;je.current=[];for(const a of t)a(e)},[]);(0,_react.useEffect)(()=>(Ce.current=!0,()=>{Ce.current=!1,Me(!1)}),[Me]);const ke=(0,_react.useCallback)(e=>{if(e<0\|\|e>=re.length)return ne;const t=re[e];return D?(T-t)/2:T-t},[re,T,ne,D]),Oe=(0,_react.useCallback)(e=>{ye.current=e;ue!==e&&(de(e),le.value=e,n?.(e))},[ue,le,n]),Ie=(0,_react.useCallback)(()=>{he.current=!1,le.value<0&&(pe.current=!0,"modal"===b?(ve(!1),"ios"!==_reactNative.Platform.OS&&be(!1)):xe(!1))},[b,le]),Te=(0,_react.useCallback)(()=>{pe.current&&be(!1)},[]);(0,_react.useEffect)(()=>{("modal"===b?!fe:!Re)&&pe.current&&(pe.current=!1,Se.current?.(),Me(!0))},[b,fe,Re,Me]);const Pe=(0,_react.useCallback)((e,t,a)=>{he.current=!0,o?.(t,a),se.value=(0,_reactNativeReanimated.withSpring)(e,SPRING_CONFIG,e=>{"worklet";e&&(0,_reactNativeReanimated.runOnJS)(Ie)()})},[o,se,Ie]),Ee=(0,_react.useCallback)(e=>{const t="number"==typeof e?clamp(e,0,re.length-1):ue>=0?ue:0,a=le.value,r=ke(t);if(pe.current=!1,Me(!1),"modal"===b?(be(!0),ve(!0)):xe(!0),a<0&&O.reduced)return se.value=r,ce.value=0,ce.value=(0,_reactNativeReanimated.withTiming)(1,{duration:O.duration("fast"),easing:_reactNativeReanimated.Easing.bezier(...k.motion.ease.decelerate),reduceMotion:_usePresenceMotion.PRESENCE_REDUCE_MOTION}),Oe(t),void o?.(a,t);a<0&&(se.value=ne,ce.value=1),Oe(t),Pe(r,a,t)},[Pe,ne,ue,le,b,o,O,ce,re.length,Oe,Me,k.motion.ease.decelerate,se,ke]),Ae=(0,_react.useCallback)(()=>{if(0===re.length)return;const e=le.value,t=ke(0);Oe(0),Pe(t,e,0)},[Pe,le,re.length,Oe,ke]),He=(0,_react.useCallback)(()=>new Promise(e=>{if(ye.current<0)return void(Ne.current?je.current.push(e):e(!0));je.current.push(e);const t=le.value;Oe(-1),he.current=!0,o?.(t,-1);const a=O.reduced?ce:se,r=O.reduced?0:ne;a.value=(0,_reactNativeReanimated.withTiming)(r,{duration:O.duration("fast"),easing:_reactNativeReanimated.Easing.bezier(...k.motion.ease.accelerate),reduceMotion:_usePresenceMotion.PRESENCE_REDUCE_MOTION},e=>{"worklet";e&&(0,_reactNativeReanimated.runOnJS)(Ie)()})}),[ne,le,Ie,o,O,ce,Oe,se,k.motion.ease.accelerate]),Be=(0,_react.useCallback)(async()=>{await He()},[He]),De=(0,_react.useCallback)((e,t,a)=>{const r=ge.current;if(!r)return void e();if(we.current)return void t?.();const n=r();"boolean"!=typeof n?(we.current=!0,a?.(),n.then(a=>{we.current=!1,a&&Ce.current&&ye.current>=0?e():t?.()},e=>{throw we.current=!1,e})):(n?e:t)?.()},[]),Ge=(0,_react.useCallback)(()=>new Promise(e=>{ye.current<0?He().then(e):De(()=>{He().then(e)},()=>e(!1))}),[He,De]),Ve=(0,_react.useCallback)(()=>{c&&Ge()},[c,Ge]);(0,_react.useImperativeHandle)(t,()=>({expand:Ee,collapse:Ae,close:Be,requestClose:Ge}),[Ee,Ae,Be,Ge]),(0,_react.useEffect)(()=>{"number"==typeof r&&r!==ue&&(-1===r?Be():Ee(r))},[r]);const qe=(0,_react.useRef)({hostHeight:T,contentSnap:te});(0,_react.useEffect)(()=>{const e=qe.current;e.hostHeight===T&&e.contentSnap===te\|\|(qe.current={hostHeight:T,contentSnap:te},e.hostHeight===T&&le.value<0\|\|(se.value=(0,_reactNativeReanimated.withSpring)(ke(le.value),SPRING_CONFIG)))},[T,te]);const Le=T-oe,Fe=(0,_react.useMemo)(()=>re.map(e=>T-e),[re,T]),Je=(0,_react.useCallback)(()=>{const e=ye.current;e<0\|\|Pe(ke(e),e,e)},[Pe,ke]),We=(0,_react.useCallback)((e,t)=>{const a=le.value;-1!==e?(Oe(e),Pe(t,a,e)):De(()=>{(0,_index2.triggerHaptic)("selection"),Be()},Je,Je)},[Pe,Be,le,De,Oe,Je]),ze=(0,_react.useMemo)(()=>_reactNativeGestureHandler.Gesture.Native().withTestId(M?`${M}-content-gesture`:"bottom-sheet-content-gesture"),[M]),Ye=(0,_react.useMemo)(()=>{const e=Fe,t=ne,a=Le,r=i;return _reactNativeGestureHandler.Gesture.Pan().withTestId(M?`${M}-pan-gesture`:"bottom-sheet-pan-gesture").activeOffsetY([-10,10]).failOffsetX([-15,15]).onStart(()=>{"worklet";ie.value=se.value}).onUpdate(e=>{"worklet";const t=ie.value+e.translationY;se.value=t<a?a+.25(t-a):t}).onEnd(a=>{"worklet";const n=se.value;if(a.velocityY>1e3)return r?void(0,_reactNativeReanimated.runOnJS)(We)(-1,t):void(0,_reactNativeReanimated.runOnJS)(We)(0,e[0]);let o=0,s=Math.abs(n-e[0]);for(let t=1;t<e.length;t++){const a=Math.abs(n-e[t]);a<s&&(s=a,o=t)}const i=e[0];r&&n-i>80?(0,_reactNativeReanimated.runOnJS)(We)(-1,t):(0,_reactNativeReanimated.runOnJS)(We)(o,e[o])})},[ne,ie,i,We,Le,Fe,M,se]),{height:$e}=(0,_reactNativeKeyboardController.useReanimatedKeyboardAnimation)(),Ke="shift"===f,Ue=(0,_reactNativeReanimated.useDerivedValue)(()=>Ke?$e.value:0),Xe=re[ue>=0?ue:0]??oe,Qe=k.space.md,Ze=(0,_reactNativeReanimated.useAnimatedStyle)(()=>{if(D){const e=Ue.value,t=T+e-Xe-Qe,a=e<0&&se.value>t?t:se.value;return{top:a<L?L:a,opacity:ce.value}}const e=se.value+Ue.value,t=Ue.value<0?L:Le;return{top:e<t?t:e,opacity:ce.value}}),et=(0,_reactNativeReanimated.useAnimatedStyle)(()=>{const e=Ue.value;if(D){const t=T+e-Xe-Qe,a=e<0&&se.value>t?t:se.value,r=T+e-Qe-(a<L?L:a);return{height:r<0?0:r>Xe?Xe:r}}const t=e<0?L:Le,a=se.value+e,r=T+e-(a<t?t:a);return{height:r<0?0:r>oe?oe:r}}),tt=ue>=0,at=(0,_react.useMemo)(()=>buildStyles(k),[k]),rt=(0,_react.useCallback)(()=>{c&&De(()=>{(0,_index2.triggerHaptic)("selection"),Be()})},[c,Be,De]),nt=(0,_react.useMemo)(()=>_reactNativeGestureHandler.Gesture.Tap().withTestId(M?`${M}-backdrop-gesture`:"bottom-sheet-backdrop-gesture").maxDuration(250).onEnd((_e,e)=>{"worklet";e&&(0,_reactNativeReanimated.runOnJS)(rt)()}),[rt,M]),ot=(0,_react.useMemo)(()=>({snapIndex:ue,snapPoints:re,expand:Ee,collapse:Ae,close:Be,requestClose:Ge}),[ue,re,Ee,Ae,Be,Ge]);if("inline"===b&&!Re)return null;if("modal"===b&&!fe)return null;const st=(0,_jsxRuntime.jsxs)(_reactNative.View,{collapsable:!1,style:["modal"===b?at.backdropModal:at.backdropInline,{backgroundColor:k.colors.scrim}],onLayout:H,testID:M,accessibilityViewIsModal:j??tt,children:[(0,_jsxRuntime.jsx)(_reactNativeGestureHandler.GestureDetector,{gesture:nt,children:(0,_jsxRuntime.jsx)(_reactNativeReanimated.default.View,{style:_reactNative.StyleSheet.absoluteFill,accessibilityRole:"button",accessibilityLabel:"Close bottom sheet"})}),(0,_jsxRuntime.jsx)(_reactNativeReanimated.default.View,{accessibilityRole:"alert",accessibilityLabel:C,accessibilityViewIsModal:j??tt,accessibilityActions:[{name:"escape",label:"Close bottom sheet"}],onAccessibilityAction:e=>{"escape"===e.nativeEvent.actionName&&Ve()},onAccessibilityEscape:Ve,style:[at.sheet,{height:oe,backgroundColor:k.colors.surface,borderTopLeftRadius:k.radius.xl,borderTopRightRadius:k.radius.xl,..._corners.smoothCorners,...k.shadow.modal},D?{height:Xe,left:(E-G)/2,right:void 0,width:G,borderBottomLeftRadius:k.radius.xl,borderBottomRightRadius:k.radius.xl}:null,R,Ze],children:(0,_jsxRuntime.jsxs)(SheetBody,{style:[at.body,et],keyboardOffset:Ue,children:[D?(0,_jsxRuntime.jsx)(_reactNative.View,{style:{height:k.space.md}}):(0,_jsxRuntime.jsx)(_reactNativeGestureHandler.GestureDetector,{gesture:Ye,children:(0,_jsxRuntime.jsx)(_reactNative.View,{style:at.handleRow,onLayout:J?z:void 0,accessible:!0,accessibilityLabel:"Drag handle",accessibilityHint:"Drag up or down to resize the sheet, or swipe down to close it",testID:M?`${M}-handle`:"bottom-sheet-handle",children:(0,_jsxRuntime.jsx)(_reactNative.View,{style:[at.handle,{backgroundColor:k.colors.border},S]})})}),null!=x&&(0,_jsxRuntime.jsx)(_reactNative.View,{style:[at.header,N],onLayout:J?$:void 0,children:x}),u?(0,_jsxRuntime.jsx)(_reactNativeGestureHandler.GestureDetector,{gesture:ze,children:(0,_jsxRuntime.jsx)(_reactNative.ScrollView,{ref:d,style:at.scrollContent,onScroll:_,onContentSizeChange:ae,onLayout:m,scrollEventThrottle:v,keyboardShouldPersistTaps:"always",keyboardDismissMode:"none",children:w})}):(0,_jsxRuntime.jsx)(_reactNative.View,{style:J?[at.content,{overflow:"visible"}]:at.content,children:J?(0,_jsxRuntime.jsx)(_reactNative.View,{onLayout:U,children:w}):w}),null!=y&&(0,_jsxRuntime.jsx)(_reactNative.View,{style:[at.footer,g],onLayout:J?Z:void 0,children:y})]})})]}),it=(0,_jsxRuntime.jsx)(BottomSheetContext.Provider,{value:ot,children:st});return"modal"===b?(0,_jsxRuntime.jsx)(_reactNative.Modal,{transparent:!0,visible:me,onRequestClose:Ve,onDismiss:"ios"===_reactNative.Platform.OS?Te: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:at.modalRoot,children:it}):it,(0,_jsxRuntime.jsx)(_ToastProvider.ToastHost,{})]})}):it}),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.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"),_ModalSafeArea=require("../ModalSafeArea/ModalSafeArea.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 TABLET_MIN_SHORT_SIDE=600,DIALOG_MAX_WIDTH=560,BottomSheetContext=(0,_react.createContext)(null),useBottomSheet=()=>{const e=(0,_react.useContext)(BottomSheetContext);if(!e)throw new Error("useBottomSheet must be used inside a <BottomSheet>.");return e};exports.useBottomSheet=useBottomSheet;const SPRING_CONFIG={damping:20,stiffness:240,mass:1},CLOSE_VELOCITY_THRESHOLD=1e3,DRAG_ACTIVATION_OFFSET=10,BottomSheet=exports.BottomSheet=(0,_react.forwardRef)((e,t)=>{const{snapPoints:a,index:r,onChange:n,onAnimate:o,onAfterClose:s,enablePanDownToClose:i=!0,enableBackdropPress:c=!0,confirmDismiss:l,scrollable:u=!1,scrollRef:d,onScroll:_,onContentSizeChange:h,onScrollLayout:m,scrollEventThrottle:v,keyboardBehavior:f="shift",mode:b="modal",presentation:p="sheet",animateMount:S=!0,handleIndicatorStyle:R,containerStyle:x,header:y,footer:N,headerStyle:g,footerStyle:w,children:C,accessibilityLabel:j,accessibilityViewIsModal:M,testID:k}=e,O=(0,_index.useTheme)(),I=(0,_usePresenceMotion.usePresenceMotion)(),T=(0,_reactNativeSafeAreaContext.useSafeAreaInsets)(),[P,E]=(0,_react.useState)(()=>_reactNative.Dimensions.get("window").height),[A,H]=(0,_react.useState)(()=>_reactNative.Dimensions.get("window").width),B=(0,_react.useCallback)(e=>{const{height:t,width:a}=e.nativeEvent.layout;t>0&&E(e=>e===t?e:t),a>0&&H(e=>e===a?e:a)},[]),D=(0,_reactNative.useWindowDimensions)(),G="dialog"===p\|\|"auto"===p&&Math.min(D.width,D.height)>=600,V=Math.min(560,A-2O.space.xl),[q,L]=(0,_ModalSafeArea.useModalInsets)(),F="modal"===b?q.top:T.top,J="modal"===b?q.bottom:T.bottom,W=a.includes("content"),[z,Y]=useMeasuredHeight(),[$,K]=useMeasuredHeight(),[U,X,Q]=useMeasuredHeight(),[Z,ee]=useMeasuredHeight(),te=G?O.space.md:z,ae=W?Math.min(te+(null!=y?$:0)+U+(null!=N?Z:0)+J,P-F):0,re=(0,_react.useCallback)((e,t)=>{W&&Q(t),h?.(e,t)},[W,h,Q]),ne=(0,_react.useMemo)(()=>resolveSnapPoints(a,P,ae),[a,P,ae]),oe=P,se=ne[ne.length-1]??0,ie=(0,_reactNativeReanimated.useSharedValue)(oe),ce=(0,_reactNativeReanimated.useSharedValue)(oe),le=(0,_reactNativeReanimated.useSharedValue)(1),ue=(0,_reactNativeReanimated.useSharedValue)(-1),[de,he]=(0,_react.useState)(-1),me=(0,_react.useRef)(!1),[ve,fe]=(0,_react.useState)(!1),[be,pe]=(0,_react.useState)(!1),Se=(0,_react.useRef)(!1),Re=(0,_react.useRef)(s);Re.current=s;const[xe,ye]=(0,_react.useState)(!1),Ne=(0,_react.useRef)(!S&&"number"==typeof r&&r>=0),ge=(0,_react.useRef)(-1),we=(0,_react.useRef)(!1);we.current="modal"===b?be:xe;const Ce=(0,_react.useRef)(l);Ce.current=l;const je=(0,_react.useRef)(!1),Me=(0,_react.useRef)(!0),ke=(0,_react.useRef)([]),Oe=(0,_react.useCallback)(e=>{const t=ke.current;ke.current=[];for(const a of t)a(e)},[]);(0,_react.useEffect)(()=>(Me.current=!0,()=>{Me.current=!1,Oe(!1)}),[Oe]);const Ie=(0,_react.useCallback)(e=>{if(e<0\|\|e>=ne.length)return oe;const t=ne[e];return G?(P-t)/2:P-t},[ne,P,oe,G]),Te=(0,_react.useCallback)(e=>{ge.current=e;de!==e&&(he(e),ue.value=e,n?.(e))},[de,ue,n]),Pe=(0,_react.useCallback)(()=>{me.current=!1,ue.value<0&&(Se.current=!0,"modal"===b?(fe(!1),"ios"!==_reactNative.Platform.OS&&pe(!1)):ye(!1))},[b,ue]),Ee=(0,_react.useCallback)(()=>{Se.current&&pe(!1)},[]);(0,_react.useEffect)(()=>{("modal"===b?!be:!xe)&&Se.current&&(Se.current=!1,Re.current?.(),Oe(!0))},[b,be,xe,Oe]);const Ae=(0,_react.useCallback)((e,t,a)=>{me.current=!0,o?.(t,a),ie.value=(0,_reactNativeReanimated.withSpring)(e,SPRING_CONFIG,e=>{"worklet";e&&(0,_reactNativeReanimated.runOnJS)(Pe)()})},[o,ie,Pe]),He=(0,_react.useCallback)(e=>{const t="number"==typeof e?clamp(e,0,ne.length-1):de>=0?de:0,a=ue.value,r=Ie(t);return Se.current=!1,Oe(!1),"modal"===b?(pe(!0),fe(!0)):ye(!0),a<0&&Ne.current?(ie.value=r,le.value=1,Te(t),void o?.(a,t)):a<0&&I.reduced?(ie.value=r,le.value=0,le.value=(0,_reactNativeReanimated.withTiming)(1,{duration:I.duration("fast"),easing:_reactNativeReanimated.Easing.bezier(...O.motion.ease.decelerate),reduceMotion:_usePresenceMotion.PRESENCE_REDUCE_MOTION}),Te(t),void o?.(a,t)):(a<0&&(ie.value=oe,le.value=1),Te(t),void Ae(r,a,t))},[Ae,oe,de,ue,b,o,I,le,ne.length,Te,Oe,O.motion.ease.decelerate,ie,Ie]),Be=(0,_react.useCallback)(()=>{if(0===ne.length)return;const e=ue.value,t=Ie(0);Te(0),Ae(t,e,0)},[Ae,ue,ne.length,Te,Ie]),De=(0,_react.useCallback)(()=>new Promise(e=>{if(ge.current<0)return void(we.current?ke.current.push(e):e(!0));ke.current.push(e),Ne.current=!1;const t=ue.value;Te(-1),me.current=!0,o?.(t,-1);const a=I.reduced?le:ie,r=I.reduced?0:oe;a.value=(0,_reactNativeReanimated.withTiming)(r,{duration:I.duration("fast"),easing:_reactNativeReanimated.Easing.bezier(...O.motion.ease.accelerate),reduceMotion:_usePresenceMotion.PRESENCE_REDUCE_MOTION},e=>{"worklet";e&&(0,_reactNativeReanimated.runOnJS)(Pe)()})}),[oe,ue,Pe,o,I,le,Te,ie,O.motion.ease.accelerate]),Ge=(0,_react.useCallback)(async()=>{await De()},[De]),Ve=(0,_react.useCallback)((e,t,a)=>{const r=Ce.current;if(!r)return void e();if(je.current)return void t?.();const n=r();"boolean"!=typeof n?(je.current=!0,a?.(),n.then(a=>{je.current=!1,a&&Me.current&&ge.current>=0?e():t?.()},e=>{throw je.current=!1,e})):(n?e:t)?.()},[]),qe=(0,_react.useCallback)(()=>new Promise(e=>{ge.current<0?De().then(e):Ve(()=>{De().then(e)},()=>e(!1))}),[De,Ve]),Le=(0,_react.useCallback)(()=>{c&&qe()},[c,qe]);(0,_react.useImperativeHandle)(t,()=>({expand:He,collapse:Be,close:Ge,requestClose:qe}),[He,Be,Ge,qe]),(0,_react.useEffect)(()=>{"number"==typeof r&&r!==de&&(-1===r?Ge():He(r))},[r]);const Fe=(0,_react.useRef)({hostHeight:P,contentSnap:ae});(0,_react.useEffect)(()=>{const e=Fe.current;if(e.hostHeight===P&&e.contentSnap===ae)return;if(Fe.current={hostHeight:P,contentSnap:ae},e.hostHeight===P&&ue.value<0)return;const t=Ie(ue.value);ie.value=Ne.current?t:(0,_reactNativeReanimated.withSpring)(t,SPRING_CONFIG)},[P,ae]);const Je=P-se,We=(0,_react.useMemo)(()=>ne.map(e=>P-e),[ne,P]),ze=(0,_react.useCallback)(()=>{const e=ge.current;e<0\|\|Ae(Ie(e),e,e)},[Ae,Ie]),Ye=(0,_react.useCallback)((e,t)=>{const a=ue.value;-1!==e?(Te(e),Ae(t,a,e)):Ve(()=>{(0,_index2.triggerHaptic)("selection"),Ge()},ze,ze)},[Ae,Ge,ue,Ve,Te,ze]),$e=(0,_react.useMemo)(()=>_reactNativeGestureHandler.Gesture.Native().withTestId(k?`${k}-content-gesture`:"bottom-sheet-content-gesture"),[k]),Ke=(0,_react.useMemo)(()=>{const e=We,t=oe,a=Je,r=i;return _reactNativeGestureHandler.Gesture.Pan().withTestId(k?`${k}-pan-gesture`:"bottom-sheet-pan-gesture").activeOffsetY([-10,10]).failOffsetX([-15,15]).onStart(()=>{"worklet";ce.value=ie.value}).onUpdate(e=>{"worklet";const t=ce.value+e.translationY;ie.value=t<a?a+.25(t-a):t}).onEnd(a=>{"worklet";const n=ie.value;if(a.velocityY>1e3)return r?void(0,_reactNativeReanimated.runOnJS)(Ye)(-1,t):void(0,_reactNativeReanimated.runOnJS)(Ye)(0,e[0]);let o=0,s=Math.abs(n-e[0]);for(let t=1;t<e.length;t++){const a=Math.abs(n-e[t]);a<s&&(s=a,o=t)}const i=e[0];r&&n-i>80?(0,_reactNativeReanimated.runOnJS)(Ye)(-1,t):(0,_reactNativeReanimated.runOnJS)(Ye)(o,e[o])})},[oe,ce,i,Ye,Je,We,k,ie]),{height:Ue}=(0,_reactNativeKeyboardController.useReanimatedKeyboardAnimation)(),Xe="shift"===f,Qe=(0,_reactNativeReanimated.useDerivedValue)(()=>Xe?Ue.value:0),Ze=ne[de>=0?de:0]??se,et=O.space.md,tt=(0,_reactNativeReanimated.useAnimatedStyle)(()=>{if(G){const e=Qe.value,t=P+e-Ze-et,a=e<0&&ie.value>t?t:ie.value;return{top:a<F?F:a,opacity:le.value}}const e=ie.value+Qe.value,t=Qe.value<0?F:Je;return{top:e<t?t:e,opacity:le.value}}),at=(0,_reactNativeReanimated.useAnimatedStyle)(()=>{const e=Qe.value;if(G){const t=P+e-Ze-et,a=e<0&&ie.value>t?t:ie.value,r=P+e-et-(a<F?F:a);return{height:r<0?0:r>Ze?Ze:r}}const t=e<0?F:Je,a=ie.value+e,r=P+e-(a<t?t:a);return{height:r<0?0:r>se?se:r}}),rt=de>=0,nt=(0,_react.useMemo)(()=>buildStyles(O),[O]),ot=(0,_react.useCallback)(()=>{c&&Ve(()=>{(0,_index2.triggerHaptic)("selection"),Ge()})},[c,Ge,Ve]),st=(0,_react.useMemo)(()=>_reactNativeGestureHandler.Gesture.Tap().withTestId(k?`${k}-backdrop-gesture`:"bottom-sheet-backdrop-gesture").maxDuration(250).onEnd((_e,e)=>{"worklet";e&&(0,_reactNativeReanimated.runOnJS)(ot)()}),[ot,k]),it=(0,_react.useMemo)(()=>({snapIndex:de,snapPoints:ne,expand:He,collapse:Be,close:Ge,requestClose:qe}),[de,ne,He,Be,Ge,qe]);if("inline"===b&&!xe)return null;if("modal"===b&&!be)return null;const ct=(0,_jsxRuntime.jsxs)(_reactNative.View,{collapsable:!1,style:["modal"===b?nt.backdropModal:nt.backdropInline,{backgroundColor:O.colors.scrim}],onLayout:B,testID:k,accessibilityViewIsModal:M??rt,children:[(0,_jsxRuntime.jsx)(_reactNativeGestureHandler.GestureDetector,{gesture:st,children:(0,_jsxRuntime.jsx)(_reactNativeReanimated.default.View,{style:_reactNative.StyleSheet.absoluteFill,accessibilityRole:"button",accessibilityLabel:"Close bottom sheet"})}),(0,_jsxRuntime.jsx)(_reactNativeReanimated.default.View,{accessibilityRole:"alert",accessibilityLabel:j,accessibilityViewIsModal:M??rt,accessibilityActions:[{name:"escape",label:"Close bottom sheet"}],onAccessibilityAction:e=>{"escape"===e.nativeEvent.actionName&&Le()},onAccessibilityEscape:Le,style:[nt.sheet,{height:se,backgroundColor:O.colors.surface,borderTopLeftRadius:O.radius.xl,borderTopRightRadius:O.radius.xl,..._corners.smoothCorners,...O.shadow.modal},G?{height:Ze,left:(A-V)/2,right:void 0,width:V,borderBottomLeftRadius:O.radius.xl,borderBottomRightRadius:O.radius.xl}:null,x,tt],children:(0,_jsxRuntime.jsxs)(SheetBody,{style:[nt.body,at],keyboardOffset:Qe,children:[G?(0,_jsxRuntime.jsx)(_reactNative.View,{style:{height:O.space.md}}):(0,_jsxRuntime.jsx)(_reactNativeGestureHandler.GestureDetector,{gesture:Ke,children:(0,_jsxRuntime.jsx)(_reactNative.View,{style:nt.handleRow,onLayout:W?Y:void 0,accessible:!0,accessibilityLabel:"Drag handle",accessibilityHint:"Drag up or down to resize the sheet, or swipe down to close it",testID:k?`${k}-handle`:"bottom-sheet-handle",children:(0,_jsxRuntime.jsx)(_reactNative.View,{style:[nt.handle,{backgroundColor:O.colors.border},R]})})}),null!=y&&(0,_jsxRuntime.jsx)(_reactNative.View,{style:[nt.header,g],onLayout:W?K:void 0,children:y}),u?(0,_jsxRuntime.jsx)(_reactNativeGestureHandler.GestureDetector,{gesture:$e,children:(0,_jsxRuntime.jsx)(_reactNative.ScrollView,{ref:d,style:nt.scrollContent,onScroll:_,onContentSizeChange:re,onLayout:m,scrollEventThrottle:v,keyboardShouldPersistTaps:"always",keyboardDismissMode:"none",children:C})}):(0,_jsxRuntime.jsx)(_reactNative.View,{style:W?[nt.content,{overflow:"visible"}]:nt.content,children:W?(0,_jsxRuntime.jsx)(_reactNative.View,{onLayout:X,children:C}):C}),null!=N&&(0,_jsxRuntime.jsx)(_reactNative.View,{style:[nt.footer,w],onLayout:W?ee:void 0,children:N})]})})]}),lt=(0,_jsxRuntime.jsx)(BottomSheetContext.Provider,{value:it,children:ct});return"modal"===b?(0,_jsxRuntime.jsx)(_reactNative.Modal,{transparent:!0,visible:ve,onRequestClose:Le,onDismiss:"ios"===_reactNative.Platform.OS?Ee:void 0,statusBarTranslucent:!0,navigationBarTranslucent:!0,animationType:"none",supportedOrientations:["portrait","landscape"],children:(0,_jsxRuntime.jsxs)(_ModalSafeArea.ModalSafeArea,{onInsets:L,children:["android"===_reactNative.Platform.OS?(0,_jsxRuntime.jsx)(_reactNativeGestureHandler.GestureHandlerRootView,{style:nt.modalRoot,children:lt}):lt,(0,_jsxRuntime.jsx)(_ToastProvider.ToastHost,{})]})}):lt}),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;

package/lib/commonjs/components/BottomSheet/BottomSheet.meta.js CHANGED Viewed

	@@ -1 +1 @@
1	- "use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.meta=void 0;var _meta=require("../../canvasKit/meta.js");const meta=exports.meta=(0,_meta.definePhoneMeta)()({name:"BottomSheet",marker:null,platforms:["phone"],acceptsChildren:!0,props:{snapPoints:{type:"array",required:!0,description:"The heights the sheet rests at: a number of points, a percentage such as 50%, or content to hug the content."},index:{type:"number",description:"The snap point the sheet shows, counted from 0. Minus one closes it."},enablePanDownToClose:{type:"boolean",default:!0,description:"Lets a drag on the handle past the threshold close the sheet."},enableBackdropPress:{type:"boolean",default:!0,description:"Lets a tap on the scrim close the sheet. Back and Escape follow it."},scrollable:{type:"boolean",default:!1,description:"Wraps the content in a vertical scroll view between the header and the footer."},scrollEventThrottle:{type:"number",description:"How often the inner scroll view reports scrolling, in milliseconds. Used only with scrollable."},backdropOpacity:{type:"number",description:"The opacity of the scrim."},keyboardBehavior:{type:"enum",values:["none","shift"],default:"shift",description:"How the sheet reacts to the keyboard. Shift rides up with it; none stays put."},mode:{type:"enum",values:["modal","inline"],default:"modal",description:"Modal covers the whole screen in a native modal; inline overlays the parent view."},presentation:{type:"enum",values:["sheet","dialog","auto"],default:"sheet",description:"Sheet is full width at the bottom; dialog is centred; auto picks a dialog on a tablet."},header:{type:"node",description:"A fixed region between the handle and the content. It does not scroll."},footer:{type:"node",description:"A fixed region at the bottom of the sheet, such as a row of buttons."},accessibilityLabel:{type:"string",description:"Names the sheet for a screen reader."},accessibilityViewIsModal:{type:"boolean",description:"Tells a screen reader to ignore what is behind the sheet."}},omit:["scrollRef"],examples:[{id:"BottomSheet.content",title:"Hugs its content",props:{snapPoints:["content"],mode:"inline",index:0},children:"Sheet content."},{id:"BottomSheet.headerFooter",title:"Header and footer",props:{snapPoints:["50%"],mode:"inline",index:0,header:"Filters",footer:"Apply"},children:"Choose how to filter the list."},{id:"BottomSheet.dialog",title:"Dialog presentation",props:{snapPoints:["50%"],presentation:"dialog",mode:"inline",index:0},children:"Centred on a tablet."}],usage:{when:["A short task or a list of choices belongs on top of the current screen.","The person should be able to drag the sheet between a small and a tall height.","The content needs a fixed header or a fixed row of buttons."],whenNot:[{text:"The person must answer one question before going on.",instead:"Dialog"},{text:"The content is a full screen of its own.",instead:"a new screen"}],do:[{note:"Use the content snap point so the sheet is as tall as what it holds.",example:[{component:"BottomSheet",props:{snapPoints:["content"],mode:"inline",index:0}}]}],dont:[{note:"Do not set a snap point taller than the content needs. It leaves a large empty area.",example:[{component:"BottomSheet",props:{snapPoints:["90%"],mode:"inline",index:0}}]}],a11y:["Turning off backdrop press also turns off Back and Escape, so a sheet that must be answered stays open.","Set accessibilityLabel so a screen reader names the sheet when it opens."]}});
1	+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.meta=void 0;var _meta=require("../../canvasKit/meta.js");const meta=exports.meta=(0,_meta.definePhoneMeta)()({name:"BottomSheet",marker:null,platforms:["phone"],acceptsChildren:!0,props:{snapPoints:{type:"array",required:!0,description:"The heights the sheet rests at: a number of points, a percentage such as 50%, or content to hug the content."},index:{type:"number",description:"The snap point the sheet shows, counted from 0. Minus one closes it."},enablePanDownToClose:{type:"boolean",default:!0,description:"Lets a drag on the handle past the threshold close the sheet."},enableBackdropPress:{type:"boolean",default:!0,description:"Lets a tap on the scrim close the sheet. Back and Escape follow it."},scrollable:{type:"boolean",default:!1,description:"Wraps the content in a vertical scroll view between the header and the footer."},scrollEventThrottle:{type:"number",description:"How often the inner scroll view reports scrolling, in milliseconds. Used only with scrollable."},backdropOpacity:{type:"number",description:"The opacity of the scrim."},keyboardBehavior:{type:"enum",values:["none","shift"],default:"shift",description:"How the sheet reacts to the keyboard. Shift rides up with it; none stays put."},mode:{type:"enum",values:["modal","inline"],default:"modal",description:"Modal covers the whole screen in a native modal; inline overlays the parent view."},presentation:{type:"enum",values:["sheet","dialog","auto"],default:"sheet",description:"Sheet is full width at the bottom; dialog is centred; auto picks a dialog on a tablet."},animateMount:{type:"boolean",default:!0,description:"Slides the sheet up when it opens as it mounts. Off, it is drawn at its snap point at once."},header:{type:"node",description:"A fixed region between the handle and the content. It does not scroll."},footer:{type:"node",description:"A fixed region at the bottom of the sheet, such as a row of buttons."},accessibilityLabel:{type:"string",description:"Names the sheet for a screen reader."},accessibilityViewIsModal:{type:"boolean",description:"Tells a screen reader to ignore what is behind the sheet."}},omit:["scrollRef"],examples:[{id:"BottomSheet.content",title:"Hugs its content",props:{snapPoints:["content"],mode:"inline",index:0},children:"Sheet content."},{id:"BottomSheet.headerFooter",title:"Header and footer",props:{snapPoints:["50%"],mode:"inline",index:0,header:"Filters",footer:"Apply"},children:"Choose how to filter the list."},{id:"BottomSheet.dialog",title:"Dialog presentation",props:{snapPoints:["50%"],presentation:"dialog",mode:"inline",index:0},children:"Centred on a tablet."}],usage:{when:["A short task or a list of choices belongs on top of the current screen.","The person should be able to drag the sheet between a small and a tall height.","The content needs a fixed header or a fixed row of buttons."],whenNot:[{text:"The person must answer one question before going on.",instead:"Dialog"},{text:"The content is a full screen of its own.",instead:"a new screen"}],do:[{note:"Use the content snap point so the sheet is as tall as what it holds.",example:[{component:"BottomSheet",props:{snapPoints:["content"],mode:"inline",index:0}}]}],dont:[{note:"Do not set a snap point taller than the content needs. It leaves a large empty area.",example:[{component:"BottomSheet",props:{snapPoints:["90%"],mode:"inline",index:0}}]}],a11y:["Turning off backdrop press also turns off Back and Escape, so a sheet that must be answered stays open.","Set accessibilityLabel so a screen reader names the sheet when it opens."]}});

package/lib/commonjs/components/Dialog/Dialog.js CHANGED Viewed

	@@ -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"),_Modal=require("../Modal/Modal.js"),_jsxRuntime=require("react/jsx-runtime");const Dialog=e=>{const{visible:t,onClose:o,title:r,message:i,children:l,icon:s,variant:a="default",actions:n,dismissOnAction:c=!0,accessibilityLabel:d,contentStyle:u,containerStyle:b,titleStyle:g,messageStyle:m,iconWrapperStyle:x,actionsRowStyle:p,actionButtonStyle:_,actionTextStyle:y,haptic:h,testID:C}=e,f=(0,_index.useTheme)(),j=(0,_react.useMemo)(()=>buildStyles(f),[f]),S=(0,_react.useMemo)(()=>discFor(f,a),[f,a]),R=f.components.dialog["icon-wrapper-size"],v=f.components.dialog["action-button-min-height"],w=Boolean(n&&n.length>0),D=(0,_react.useCallback)(e=>{if(e.loading\|\|e.disabled)return;const t=(0,_hapticUtils.resolveHaptic)(h,"selection");t&&(0,_hapticUtils.triggerHaptic)(t),c?(o(),setTimeout(e.onPress,_Modal.MODAL_DISMISS_GRACE_MS)):e.onPress()},[c,o,h]);return(0,_jsxRuntime.jsx)(_Modal.Modal,{visible:t,onRequestClose:o,haptic:h,presentation:"centered",accessibilityLabel:d??r,contentStyle:u,testID:C,children:(0,_jsxRuntime.jsxs)(_reactNative.View,{accessibilityRole:"alert",accessibilityLabel:d??r,style:[j.container,b],children:[s?(0,_jsxRuntime.jsx)(_reactNative.View,{style:[j.iconWrapper,{width:R,height:R,borderRadius:f.radius.pill,..._corners.smoothCorners,backgroundColor:S,marginBottom:f.space.md},x],children:s}):null,r?(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[j.title,{color:f.colors["text-body"],fontSize:f.text.xl.size,...(0,_index.fontFor)(f,"semibold"),marginBottom:i\|\|null!=l?f.space.sm:f.space.md},g],accessibilityRole:"header",children:r}):null,i?(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[j.message,{color:f.colors["text-muted"],fontSize:f.text.base.size,lineHeight:f.text.base.size*f.leading.body,marginBottom:null!=l?f.space.md:w?f.space.lg:0},m],children:i}):null,null!=l?(0,_jsxRuntime.jsx)(_reactNative.View,{style:{marginBottom:w?f.space.lg:0},children:l}):null,n&&n.length>0?(0,_jsxRuntime.jsx)(_reactNative.View,{style:[j.actionsRow,p],children:n.map((e,t)=>{const o=e.tone??"primary",r=Boolean(e.disabled),i=actionStyleFor(f,o,r),l=t===n.length-1;return(0,_jsxRuntime.jsx)(_reactNative.Pressable,{onPress:()=>D(e),disabled:e.loading\|\|r,accessibilityRole:"button",accessibilityLabel:e.label,accessibilityState:{busy:e.loading,disabled:Boolean(e.loading)\|\|r},"aria-busy":e.loading,"aria-disabled":Boolean(e.loading)\|\|r,style:({pressed:t})=>[j.actionButton,{minHeight:v,backgroundColor:i.backgroundColor,borderColor:i.borderColor,borderWidth:i.borderWidth,borderRadius:f.radius.md,..._corners.smoothCorners,paddingVertical:f.space.sm,paddingHorizontal:f.space.md,marginRight:l?0:f.space.sm,opacity:e.loading?.7:t&&!r?.85:1},_],children:e.loading?(0,_jsxRuntime.jsx)(_reactNative.ActivityIndicator,{size:"small",color:i.textColor}):(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[{color:i.textColor,fontSize:f.text.base.size,...(0,_index.fontFor)(f,"semibold"),textAlign:"center"},y],children:e.label})},`${e.label}-${t}`)})}):null]})})};exports.Dialog=Dialog,Dialog.displayName="Dialog";const SOFT_DISC_OPACITY=.14,discFor=(e,t)=>{const o=e.colors["bg-subtle"];switch(t){case"success":return(0,_color.tintOf)(e.colors.success,.14,o);case"warning":return(0,_color.tintOf)(e.colors.warning,.14,o);case"danger":return(0,_color.tintOf)(e.colors.danger,.14,o);case"info":return(0,_color.tintOf)(e.colors.info,.14,o);default:return e.colors["primary-soft"]}},actionStyleFor=(e,t,o)=>{if(o)return{backgroundColor:"neutral"===t?"transparent":e.colors["surface-disabled"],borderColor:"neutral"===t?e.colors.border:"transparent",borderWidth:"neutral"===t?1:0,textColor:e.colors["text-disabled"]};switch(t){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"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({container:{alignItems:"stretch"},iconWrapper:{alignItems:"center",justifyContent:"center",alignSelf:"center"},title:{textAlign:"center"},message:{textAlign:"center"},actionsRow:{flexDirection:"row",justifyContent:"flex-end",alignItems:"stretch"},~~actionButton~~:{~~flex~~:1,alignItems:"center",justifyContent:"center"}});var _default=exports.default=Dialog;
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"),_Modal=require("../Modal/Modal.js"),_jsxRuntime=require("react/jsx-runtime");const Dialog=e=>{const{visible:t,onClose:o,title:r,message:i,children:l,icon:a,variant:n="default",actions:s,dismissOnAction:c=!0,accessibilityLabel:d,contentStyle:u,containerStyle:b,titleStyle:g,messageStyle:m,iconWrapperStyle:x,actionsRowStyle:_,actionButtonStyle:p,actionTextStyle:y,haptic:h,testID:C}=e,f=(0,_index.useTheme)(),j=(0,_react.useMemo)(()=>buildStyles(f),[f]),S=(0,_react.useMemo)(()=>discFor(f,n),[f,n]),v=f.components.dialog["icon-wrapper-size"],R=f.components.dialog["action-button-min-height"],w=Boolean(s&&s.length>0),D=f.text.base.sizef.leading.body,k=s?s.map(e=>e.label).join("\n"):"",[M,N]=(0,_react.useState)(null),z=null!==M&&M===k,B=(0,_react.useRef)(null),I=(0,_react.useCallback)(e=>{e.nativeEvent.layout.height>1.5D&&N(k)},[D,k]),W=(0,_react.useCallback)(e=>{const t=e.nativeEvent.layout.width,o=B.current;B.current=t,null!==o&&Math.abs(o-t)>.5&&N(null)},[]),q=(0,_react.useCallback)(e=>{if(e.loading\|\|e.disabled)return;const t=(0,_hapticUtils.resolveHaptic)(h,"selection");t&&(0,_hapticUtils.triggerHaptic)(t),c?(o(),setTimeout(e.onPress,_Modal.MODAL_DISMISS_GRACE_MS)):e.onPress()},[c,o,h]);return(0,_jsxRuntime.jsx)(_Modal.Modal,{visible:t,onRequestClose:o,haptic:h,presentation:"centered",accessibilityLabel:d??r,contentStyle:u,testID:C,children:(0,_jsxRuntime.jsxs)(_reactNative.View,{accessibilityRole:"alert",accessibilityLabel:d??r,style:[j.container,b],children:[a?(0,_jsxRuntime.jsx)(_reactNative.View,{style:[j.iconWrapper,{width:v,height:v,borderRadius:f.radius.pill,..._corners.smoothCorners,backgroundColor:S,marginBottom:f.space.md},x],children:a}):null,r?(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[j.title,{color:f.colors["text-body"],fontSize:f.text.xl.size,...(0,_index.fontFor)(f,"semibold"),marginBottom:i\|\|null!=l?f.space.sm:f.space.md},g],accessibilityRole:"header",children:r}):null,i?(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[j.message,{color:f.colors["text-muted"],fontSize:f.text.base.size,lineHeight:f.text.base.size*f.leading.body,marginBottom:null!=l?f.space.md:w?f.space.lg:0},m],children:i}):null,null!=l?(0,_jsxRuntime.jsx)(_reactNative.View,{style:{marginBottom:w?f.space.lg:0},children:l}):null,s&&s.length>0?(0,_jsxRuntime.jsx)(_reactNative.View,{style:[j.actionsRow,z?j.actionsRowStacked:null,_],onLayout:W,children:s.map((e,t)=>{const o=e.tone??"primary",r=Boolean(e.disabled),i=actionStyleFor(f,o,r),l=t===s.length-1;return(0,_jsxRuntime.jsx)(_reactNative.Pressable,{onPress:()=>q(e),disabled:e.loading\|\|r,accessibilityRole:"button",accessibilityLabel:e.label,accessibilityState:{busy:e.loading,disabled:Boolean(e.loading)\|\|r},"aria-busy":e.loading,"aria-disabled":Boolean(e.loading)\|\|r,style:({pressed:t})=>[j.actionButton,{flex:z?0:1,minHeight:R,backgroundColor:i.backgroundColor,borderColor:i.borderColor,borderWidth:i.borderWidth,borderRadius:f.radius.md,..._corners.smoothCorners,paddingVertical:f.space.sm,paddingHorizontal:f.space.md,marginRight:l\|\|z?0:f.space.sm,opacity:e.loading?.7:t&&!r?.85:1},p],children:e.loading?(0,_jsxRuntime.jsx)(_reactNative.ActivityIndicator,{size:"small",color:i.textColor}):(0,_jsxRuntime.jsx)(_reactNative.View,{onLayout:I,children:(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[{color:i.textColor,fontSize:f.text.base.size,...(0,_index.fontFor)(f,"semibold"),textAlign:"center"},y],children:e.label})})},`${e.label}-${t}`)})}):null]})})};exports.Dialog=Dialog,Dialog.displayName="Dialog";const SOFT_DISC_OPACITY=.14,discFor=(e,t)=>{const o=e.colors["bg-subtle"];switch(t){case"success":return(0,_color.tintOf)(e.colors.success,.14,o);case"warning":return(0,_color.tintOf)(e.colors.warning,.14,o);case"danger":return(0,_color.tintOf)(e.colors.danger,.14,o);case"info":return(0,_color.tintOf)(e.colors.info,.14,o);default:return e.colors["primary-soft"]}},actionStyleFor=(e,t,o)=>{if(o)return{backgroundColor:"neutral"===t?"transparent":e.colors["surface-disabled"],borderColor:"neutral"===t?e.colors.border:"transparent",borderWidth:"neutral"===t?1:0,textColor:e.colors["text-disabled"]};switch(t){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"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({container:{alignItems:"stretch"},iconWrapper:{alignItems:"center",justifyContent:"center",alignSelf:"center"},title:{textAlign:"center"},message:{textAlign:"center"},actionsRow:{flexDirection:"row",justifyContent:"flex-end",alignItems:"stretch"},actionsRowStacked:{flexDirection:"column",rowGap:e.space.sm},actionButton:{alignItems:"center",justifyContent:"center"}});var _default=exports.default=Dialog;

package/lib/commonjs/components/Modal/Modal.js CHANGED Viewed

	@@ -1 +1 @@
1	- "use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=exports.Modal=exports.MODAL_DISMISS_GRACE_MS=void 0;var _react=require("react"),_reactNative=require("react-native"),_usePresenceMotion=require("../../hooks/usePresenceMotion.js"),_index=require("../../theme/index.js"),_color=require("../../utils/color.js"),_corners=require("../../utils/corners.js"),_hapticUtils=require("../../utils/hapticUtils.js"),_squircle=require("../../utils/squircle.js"),_ModalSafeArea=require("../ModalSafeArea/ModalSafeArea.js"),_SquircleFill=require("../SquircleFill/SquircleFill.js"),_ToastProvider=require("../Toast/ToastProvider.js"),_jsxRuntime=require("react/jsx-runtime");const MODAL_DISMISS_GRACE_MS=exports.MODAL_DISMISS_GRACE_MS=300,SCALE_START_VALUE=.9,Modal=exports.Modal=(0,_react.forwardRef)((e,t)=>{const{visible:r,onRequestClose:a,presentation:i="centered",backdropOpacity:s,backdropPressClose:o=!0,animationDuration:n,~~accessibilityLabel~~:l,hardwareBackPress:c=!0,children:u,contentStyle:d,backdropStyle:m,restoreFocusRef:_,onDismissed:f,haptic:p,testID:v}=e,g=(0,_index.useTheme)(),b=(0,_usePresenceMotion.usePresenceMotion)(),[S,h]=(0,_ModalSafeArea.useModalInsets)(),x=n??b.duration("default"),A=_reactNative.Dimensions.get("window").height,M=(0,_react.useRef)((0,_index.createAnimatedValue)(.9)).current,N=(0,_react.useRef)((0,_index.createAnimatedValue)(0)).current,y=(0,_react.useRef)((0,_index.createAnimatedValue)(A)).current,R=(0,_react.useRef)((0,_index.createAnimatedValue)(0)).current,j=(0,_react.useRef)(null),q=(0,_react.useRef)(!1),[C,V]=(0,_react.useState)(r),D=(0,_react.useMemo)(()=>buildStyles(g),[g]),T=(0,_react.useMemo)(()=>{const e=g.colors.scrim;return"number"!=typeof s?e:(0,_color.withAlpha)(e,s)??e},[g.colors.scrim,s]),w=(0,_react.useMemo)(()=>R.interpolate({inputRange:[0,1],outputRange:[(0,_color.transparentOf)(T),T]}),[R,T]);(0,_react.useEffect)(()=>{r&&V(!0)},[r]),(0,_react.useEffect)(()=>{const e=[];if(r&&C){const t=_reactNative.Animated.timing(R,{toValue:1,duration:b.duration("default"),useNativeDriver:!1});if(t.start(),e.push(t),b.reduced){N.setValue(0),y.setValue(0),M.setValue(1);const t=_reactNative.Animated.timing(N,{toValue:1,duration:x,useNativeDriver:!0});t.start(),e.push(t)}else if("bottom"===i){N.setValue(1);const t=_reactNative.Animated.spring(y,{toValue:0,damping:g.motion.spring.gentle.damping,stiffness:g.motion.spring.gentle.stiffness,mass:g.motion.spring.gentle.mass,useNativeDriver:!0});t.start(),e.push(t)}else{const t=_reactNative.Animated.parallel([_reactNative.Animated.spring(M,{toValue:1,damping:g.motion.spring.gentle.damping,stiffness:g.motion.spring.gentle.stiffness,mass:g.motion.spring.gentle.mass,useNativeDriver:!0}),_reactNative.Animated.timing(N,{toValue:1,duration:x,useNativeDriver:!0})]);t.start(),e.push(t)}}else if(C){const t=b.duration("fast"),r=_reactNative.Easing.bezier(...g.motion.ease.accelerate),a=_reactNative.Animated.timing(N,{toValue:0,duration:t,easing:r,useNativeDriver:!0}),s=b.reduced?a:"bottom"===i?_reactNative.Animated.timing(y,{toValue:A,duration:t,easing:r,useNativeDriver:!0}):_reactNative.Animated.parallel([_reactNative.Animated.timing(M,{toValue:.9,duration:t,easing:r,useNativeDriver:!0}),a]),o=_reactNative.Animated.parallel([s,_reactNative.Animated.timing(R,{toValue:0,duration:b.duration("default"),useNativeDriver:!1})]);o.start(({finished:e})=>{e&&(y.setValue(A),V(!1))}),e.push(o)}return()=>e.forEach(e=>e.stop())},[r,C,i,x,M,N,R,y,A,g.motion.spring.gentle.damping,g.motion.spring.gentle.stiffness,g.motion.spring.gentle.mass,b,g.motion.ease.accelerate]),(0,_react.useEffect)(()=>{if("web"===_reactNative.Platform.OS)return;let e,t;return r?(e=setTimeout(()=>{j.current&&_reactNative.AccessibilityInfo.sendAccessibilityEvent(j.current,"focus")},150),q.current=!0):q.current&&(q.current=!1,_&&_.current&&(t=setTimeout(()=>{const e=_.current;e&&_reactNative.AccessibilityInfo.sendAccessibilityEvent(e,"focus")},x))),()=>{e&&clearTimeout(e),t&&clearTimeout(t)}},[r,x,_]);const I=(0,_react.useRef)(!1);(0,_react.useEffect)(()=>{if(r)return void(I.current=!0);if(!I.current)return;if(I.current=!1,!f)return;const e=setTimeout(f,MODAL_DISMISS_GRACE_MS);return()=>clearTimeout(e)},[r,f]);const E=(0,_react.useCallback)(()=>{if(!o)return;const e=(0,_hapticUtils.resolveHaptic)(p,"selection");e&&(0,_hapticUtils.triggerHaptic)(e),a()},[o,a,p]),P=(0,_react.useCallback)(()=>{c&&a()},[c,a]),L=(0,_SquircleFill.useSquircle)("bottom"!==i&&"fullScreen"!==i,g.radius.xl),k=(0,_react.useMemo)(()=>"fullScreen"===i?[D.fullScreenContent,{backgroundColor:g.colors.surface}]:"bottom"===i?[D.bottomContent,{backgroundColor:g.colors.surface,borderTopLeftRadius:g.radius.xl,borderTopRightRadius:g.radius.xl,..._corners.smoothCorners,paddingTop:g.space.lg,paddingHorizontal:g.space.lg,paddingBottom:g.space.lg+S.bottom},g.shadow.modal]:[D.centeredContent,{backgroundColor:g.colors.surface,borderRadius:L.active&&L.size?(0,_squircle.squircleHostRadius)(L.size.width,L.size.height,g.radius.xl):g.radius.xl,..._corners.smoothCorners,padding:g.space.xl},g.shadow.modal],[i,g,D,S.bottom,L.active,L.size]),z=(0,_react.useMemo)(()=>"bottom"===i?D.bottomWrapper:"fullScreen"===i?D.fullScreenWrapper:D.centeredWrapper,[i,D]),F=(0,_react.useMemo)(()=>"bottom"===i?{opacity:N,transform:[{translateY:y}]}:"fullScreen"===i?{opacity:N}:{opacity:N,transform:[{scale:M}]},[i,M,N,y]);return(0,_jsxRuntime.jsx)(_reactNative.Modal,{visible:C,transparent:!0,statusBarTranslucent:!0,navigationBarTranslucent:!0,animationType:"none",onRequestClose:P,testID:v,children:(0,_jsxRuntime.jsx)(_reactNative.View,{ref:e=>{j.current=e,"function"==typeof t?t(e):t&&(t.current=e)},style:D.root,accessible:!1,accessibilityViewIsModal:!0,accessibilityRole:"alert",accessibilityLabel:l,children:(0,_jsxRuntime.jsxs)(_ModalSafeArea.ModalSafeArea,{onInsets:h,children:[(0,_jsxRuntime.jsxs)(_reactNative.Animated.View,{collapsable:!1,style:[_reactNative.StyleSheet.absoluteFill,z,{backgroundColor:w},m],children:[(0,_jsxRuntime.jsx)(_reactNative.Pressable,{style:_reactNative.StyleSheet.absoluteFill,onPress:E,accessibilityRole:"button",accessibilityLabel:"Close modal",disabled:!o}),(0,_jsxRuntime.jsxs)(_reactNative.Animated.View,{style:[k,F,d],onLayout:L.onLayout,pointerEvents:"auto",children:[L.active&&L.size?(0,_jsxRuntime.jsx)(_SquircleFill.SquircleFill,{width:L.size.width,height:L.size.height,radius:g.radius.xl,fill:g.colors.surface}):null,u]})]}),(0,_jsxRuntime.jsx)(_ToastProvider.ToastHost,{})]})})})});Modal.displayName="Modal";const buildStyles=e=>_reactNative.StyleSheet.create({root:{flex:1},centeredWrapper:{flex:1,alignItems:"center",justifyContent:"center",paddingHorizontal:e.space.lg},centeredContent:{maxWidth:"90%",width:"90%"},bottomWrapper:{flex:1,justifyContent:"flex-end"},bottomContent:{width:"100%"},fullScreenWrapper:{flex:1},fullScreenContent:{flex:1}});var _default=exports.default=Modal;
1	+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=exports.Modal=exports.MODAL_DISMISS_GRACE_MS=void 0;var _react=require("react"),_reactNative=require("react-native"),_usePresenceMotion=require("../../hooks/usePresenceMotion.js"),_index=require("../../theme/index.js"),_color=require("../../utils/color.js"),_corners=require("../../utils/corners.js"),_hapticUtils=require("../../utils/hapticUtils.js"),_squircle=require("../../utils/squircle.js"),_ModalSafeArea=require("../ModalSafeArea/ModalSafeArea.js"),_SquircleFill=require("../SquircleFill/SquircleFill.js"),_ToastProvider=require("../Toast/ToastProvider.js"),_jsxRuntime=require("react/jsx-runtime");const MODAL_DISMISS_GRACE_MS=exports.MODAL_DISMISS_GRACE_MS=300,SCALE_START_VALUE=.9,Modal=exports.Modal=(0,_react.forwardRef)((e,t)=>{const{visible:r,onRequestClose:a,presentation:i="centered",backdropOpacity:s,backdropPressClose:n=!0,animationDuration:o,animateMount:l=!0,accessibilityLabel:c,hardwareBackPress:u=!0,children:d,contentStyle:m,backdropStyle:_,restoreFocusRef:f,onDismissed:p,haptic:v,testID:g}=e,b=(0,_index.useTheme)(),S=(0,_usePresenceMotion.usePresenceMotion)(),[h,x]=(0,_ModalSafeArea.useModalInsets)(),A=o??S.duration("default"),M=_reactNative.Dimensions.get("window").height,N=(0,_react.useRef)(!l&&r),R=N.current,y=(0,_react.useRef)((0,_index.createAnimatedValue)(R?1:.9)).current,j=(0,_react.useRef)((0,_index.createAnimatedValue)(R?1:0)).current,q=(0,_react.useRef)((0,_index.createAnimatedValue)(R?0:M)).current,C=(0,_react.useRef)((0,_index.createAnimatedValue)(R?1:0)).current,V=(0,_react.useRef)(null),D=(0,_react.useRef)(!1),[T,w]=(0,_react.useState)(r),I=(0,_react.useMemo)(()=>buildStyles(b),[b]),E=(0,_react.useMemo)(()=>{const e=b.colors.scrim;return"number"!=typeof s?e:(0,_color.withAlpha)(e,s)??e},[b.colors.scrim,s]),P=(0,_react.useMemo)(()=>C.interpolate({inputRange:[0,1],outputRange:[(0,_color.transparentOf)(E),E]}),[C,E]);(0,_react.useEffect)(()=>{r&&w(!0)},[r]),(0,_react.useEffect)(()=>{const e=[];if(r&&T&&N.current)N.current=!1;else if(r&&T){const t=_reactNative.Animated.timing(C,{toValue:1,duration:S.duration("default"),useNativeDriver:!1});if(t.start(),e.push(t),S.reduced){j.setValue(0),q.setValue(0),y.setValue(1);const t=_reactNative.Animated.timing(j,{toValue:1,duration:A,useNativeDriver:!0});t.start(),e.push(t)}else if("bottom"===i){j.setValue(1);const t=_reactNative.Animated.spring(q,{toValue:0,damping:b.motion.spring.gentle.damping,stiffness:b.motion.spring.gentle.stiffness,mass:b.motion.spring.gentle.mass,useNativeDriver:!0});t.start(),e.push(t)}else{const t=_reactNative.Animated.parallel([_reactNative.Animated.spring(y,{toValue:1,damping:b.motion.spring.gentle.damping,stiffness:b.motion.spring.gentle.stiffness,mass:b.motion.spring.gentle.mass,useNativeDriver:!0}),_reactNative.Animated.timing(j,{toValue:1,duration:A,useNativeDriver:!0})]);t.start(),e.push(t)}}else if(T){const t=S.duration("fast"),r=_reactNative.Easing.bezier(...b.motion.ease.accelerate),a=_reactNative.Animated.timing(j,{toValue:0,duration:t,easing:r,useNativeDriver:!0}),s=S.reduced?a:"bottom"===i?_reactNative.Animated.timing(q,{toValue:M,duration:t,easing:r,useNativeDriver:!0}):_reactNative.Animated.parallel([_reactNative.Animated.timing(y,{toValue:.9,duration:t,easing:r,useNativeDriver:!0}),a]),n=_reactNative.Animated.parallel([s,_reactNative.Animated.timing(C,{toValue:0,duration:S.duration("default"),useNativeDriver:!1})]);n.start(({finished:e})=>{e&&(q.setValue(M),w(!1))}),e.push(n)}return()=>e.forEach(e=>e.stop())},[r,T,i,A,y,j,C,q,M,b.motion.spring.gentle.damping,b.motion.spring.gentle.stiffness,b.motion.spring.gentle.mass,S,b.motion.ease.accelerate]),(0,_react.useEffect)(()=>{if("web"===_reactNative.Platform.OS)return;let e,t;return r?(e=setTimeout(()=>{V.current&&_reactNative.AccessibilityInfo.sendAccessibilityEvent(V.current,"focus")},150),D.current=!0):D.current&&(D.current=!1,f&&f.current&&(t=setTimeout(()=>{const e=f.current;e&&_reactNative.AccessibilityInfo.sendAccessibilityEvent(e,"focus")},A))),()=>{e&&clearTimeout(e),t&&clearTimeout(t)}},[r,A,f]);const L=(0,_react.useRef)(!1);(0,_react.useEffect)(()=>{if(r)return void(L.current=!0);if(!L.current)return;if(L.current=!1,!p)return;const e=setTimeout(p,MODAL_DISMISS_GRACE_MS);return()=>clearTimeout(e)},[r,p]);const k=(0,_react.useCallback)(()=>{if(!n)return;const e=(0,_hapticUtils.resolveHaptic)(v,"selection");e&&(0,_hapticUtils.triggerHaptic)(e),a()},[n,a,v]),z=(0,_react.useCallback)(()=>{u&&a()},[u,a]),F=(0,_SquircleFill.useSquircle)("bottom"!==i&&"fullScreen"!==i,b.radius.xl),O=(0,_react.useMemo)(()=>"fullScreen"===i?[I.fullScreenContent,{backgroundColor:b.colors.surface}]:"bottom"===i?[I.bottomContent,{backgroundColor:b.colors.surface,borderTopLeftRadius:b.radius.xl,borderTopRightRadius:b.radius.xl,..._corners.smoothCorners,paddingTop:b.space.lg,paddingHorizontal:b.space.lg,paddingBottom:b.space.lg+h.bottom},b.shadow.modal]:[I.centeredContent,{backgroundColor:b.colors.surface,borderRadius:F.active&&F.size?(0,_squircle.squircleHostRadius)(F.size.width,F.size.height,b.radius.xl):b.radius.xl,..._corners.smoothCorners,padding:b.space.xl},b.shadow.modal],[i,b,I,h.bottom,F.active,F.size]),W=(0,_react.useMemo)(()=>"bottom"===i?I.bottomWrapper:"fullScreen"===i?I.fullScreenWrapper:I.centeredWrapper,[i,I]),H=(0,_react.useMemo)(()=>"bottom"===i?{opacity:j,transform:[{translateY:q}]}:"fullScreen"===i?{opacity:j}:{opacity:j,transform:[{scale:y}]},[i,y,j,q]);return(0,_jsxRuntime.jsx)(_reactNative.Modal,{visible:T,transparent:!0,statusBarTranslucent:!0,navigationBarTranslucent:!0,animationType:"none",onRequestClose:z,testID:g,children:(0,_jsxRuntime.jsx)(_reactNative.View,{ref:e=>{V.current=e,"function"==typeof t?t(e):t&&(t.current=e)},style:I.root,accessible:!1,accessibilityViewIsModal:!0,accessibilityRole:"alert",accessibilityLabel:c,children:(0,_jsxRuntime.jsxs)(_ModalSafeArea.ModalSafeArea,{onInsets:x,children:[(0,_jsxRuntime.jsxs)(_reactNative.Animated.View,{collapsable:!1,style:[_reactNative.StyleSheet.absoluteFill,W,{backgroundColor:P},_],children:[(0,_jsxRuntime.jsx)(_reactNative.Pressable,{style:_reactNative.StyleSheet.absoluteFill,onPress:k,accessibilityRole:"button",accessibilityLabel:"Close modal",disabled:!n}),(0,_jsxRuntime.jsxs)(_reactNative.Animated.View,{style:[O,H,m],onLayout:F.onLayout,pointerEvents:"auto",children:[F.active&&F.size?(0,_jsxRuntime.jsx)(_SquircleFill.SquircleFill,{width:F.size.width,height:F.size.height,radius:b.radius.xl,fill:b.colors.surface}):null,d]})]}),(0,_jsxRuntime.jsx)(_ToastProvider.ToastHost,{})]})})})});Modal.displayName="Modal";const buildStyles=e=>_reactNative.StyleSheet.create({root:{flex:1},centeredWrapper:{flex:1,alignItems:"center",justifyContent:"center",paddingHorizontal:e.space.lg},centeredContent:{maxWidth:"90%",width:"90%"},bottomWrapper:{flex:1,justifyContent:"flex-end"},bottomContent:{width:"100%"},fullScreenWrapper:{flex:1},fullScreenContent:{flex:1}});var _default=exports.default=Modal;

package/lib/commonjs/components/Modal/Modal.meta.js CHANGED Viewed

	@@ -1 +1 @@
1	- "use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.meta=void 0;var _meta=require("../../canvasKit/meta.js");const meta=exports.meta=(0,_meta.definePhoneMeta)()({name:"Modal",marker:null,platforms:["phone"],acceptsChildren:!0,props:{visible:{type:"boolean",required:!0,description:"Whether the modal is shown. The parent owns it."},presentation:{type:"enum",values:["centered","bottom","fullScreen"],default:"centered",description:"How the dialog is laid out: a centred card, a sheet anchored to the bottom, or a full screen takeover."},backdropOpacity:{type:"number",description:"Overrides the opacity of the dimmed backdrop for this modal."},backdropPressClose:{type:"boolean",default:!0,description:"Whether tapping the dimmed backdrop closes the modal."},animationDuration:{type:"number",description:"The enter animation length in milliseconds. Without it the theme's normal duration is used."},accessibilityLabel:{type:"string",description:"The name a screen reader gives the dialog."},hardwareBackPress:{type:"boolean",default:!0,description:"Whether the Android back button closes the modal."}},omit:["restoreFocusRef","haptic"],examples:[{id:"Modal.default",title:"Centred dialog",props:{visible:!0,presentation:"centered",accessibilityLabel:"Demo modal"},children:"centered modal"},{id:"Modal.bottom",title:"Bottom sheet",props:{visible:!0,presentation:"bottom",accessibilityLabel:"Demo modal"},children:"bottom modal"},{id:"Modal.fullScreen",title:"Full screen",props:{visible:!0,presentation:"fullScreen",accessibilityLabel:"Demo modal"},children:"fullScreen modal"},{id:"Modal.backdropLocked",title:"Backdrop tap does not close",props:{visible:!0,presentation:"centered",backdropPressClose:!1,accessibilityLabel:"Demo modal"},children:"centered modal"}],usage:{when:["A dialog, confirmation or sheet must sit above the current screen.","A full screen takeover such as onboarding or a media viewer is needed."],whenNot:[{text:"The choice is a list of options.",instead:"OptionSheet"},{text:"A brief message needs no action.",instead:"Toast"}],do:[{note:"Name the dialog with an accessibilityLabel so a screen reader announces what opened.",example:[{component:"Modal",props:{visible:!0,accessibilityLabel:"Delete project"},children:"Delete this project?"}]},{note:"Use the bottom presentation for an action menu.",example:[{component:"Modal",props:{visible:!0,presentation:"bottom"},children:"Choose an action"}]}],dont:[{note:"A dialog with no label opens in silence for a screen reader.",example:[{component:"Modal",props:{visible:!0},children:"Delete this project?"}]},{note:"A full screen takeover for a one-line confirmation hides the page for no reason.",example:[{component:"Modal",props:{visible:!0,presentation:"fullScreen"},children:"Delete this project?"}]}],a11y:["The dialog is marked as a modal view with an alert role and takes its name from accessibilityLabel.","The Android back button closes it unless hardwareBackPress is off, and a screen reader can reach a Close modal button."]}});
1	+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.meta=void 0;var _meta=require("../../canvasKit/meta.js");const meta=exports.meta=(0,_meta.definePhoneMeta)()({name:"Modal",marker:null,platforms:["phone"],acceptsChildren:!0,props:{visible:{type:"boolean",required:!0,description:"Whether the modal is shown. The parent owns it."},presentation:{type:"enum",values:["centered","bottom","fullScreen"],default:"centered",description:"How the dialog is laid out: a centred card, a sheet anchored to the bottom, or a full screen takeover."},backdropOpacity:{type:"number",description:"Overrides the opacity of the dimmed backdrop for this modal."},backdropPressClose:{type:"boolean",default:!0,description:"Whether tapping the dimmed backdrop closes the modal."},animationDuration:{type:"number",description:"The enter animation length in milliseconds. Without it the theme's normal duration is used."},animateMount:{type:"boolean",default:!0,description:"Plays the enter animation when the modal is visible as it mounts. Off, it is drawn at rest at once."},accessibilityLabel:{type:"string",description:"The name a screen reader gives the dialog."},hardwareBackPress:{type:"boolean",default:!0,description:"Whether the Android back button closes the modal."}},omit:["restoreFocusRef","haptic"],examples:[{id:"Modal.default",title:"Centred dialog",props:{visible:!0,presentation:"centered",accessibilityLabel:"Demo modal"},children:"centered modal"},{id:"Modal.bottom",title:"Bottom sheet",props:{visible:!0,presentation:"bottom",accessibilityLabel:"Demo modal"},children:"bottom modal"},{id:"Modal.fullScreen",title:"Full screen",props:{visible:!0,presentation:"fullScreen",accessibilityLabel:"Demo modal"},children:"fullScreen modal"},{id:"Modal.backdropLocked",title:"Backdrop tap does not close",props:{visible:!0,presentation:"centered",backdropPressClose:!1,accessibilityLabel:"Demo modal"},children:"centered modal"}],usage:{when:["A dialog, confirmation or sheet must sit above the current screen.","A full screen takeover such as onboarding or a media viewer is needed."],whenNot:[{text:"The choice is a list of options.",instead:"OptionSheet"},{text:"A brief message needs no action.",instead:"Toast"}],do:[{note:"Name the dialog with an accessibilityLabel so a screen reader announces what opened.",example:[{component:"Modal",props:{visible:!0,accessibilityLabel:"Delete project"},children:"Delete this project?"}]},{note:"Use the bottom presentation for an action menu.",example:[{component:"Modal",props:{visible:!0,presentation:"bottom"},children:"Choose an action"}]}],dont:[{note:"A dialog with no label opens in silence for a screen reader.",example:[{component:"Modal",props:{visible:!0},children:"Delete this project?"}]},{note:"A full screen takeover for a one-line confirmation hides the page for no reason.",example:[{component:"Modal",props:{visible:!0,presentation:"fullScreen"},children:"Delete this project?"}]}],a11y:["The dialog is marked as a modal view with an alert role and takes its name from accessibilityLabel.","The Android back button closes it unless hardwareBackPress is off, and a screen reader can reach a Close modal button."]}});

package/lib/commonjs/components/SegmentedControl/SegmentedControl.js CHANGED Viewed

	@@ -1 +1 @@
1	- "use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=exports.SegmentedControl=void 0;var _react=require("react"),_reactNative=require("react-native"),_index=require("../../hooks/index.js"),_index2=require("../../theme/index.js"),_index3=require("../../utils/index.js"),_corners=require("../../utils/corners.js"),_slotIcon=require("../AppIcon/slotIcon.js"),_index4=require("../FieldBase/index.js"),_SquircleFill=require("../SquircleFill/SquircleFill.js"),_jsxRuntime=require("react/jsx-runtime");const LABEL_LINE_HEIGHT_RATIO=1.25,SegmentedControl=exports.SegmentedControl=(0,_react.forwardRef)((e,t)=>{const{segments:i,label:r,helperText:s,error:l,value:n,defaultValue:a,onChange:o,size:d="md",fullWidth:c=!0,disabled:u=!1,tone:m="primary",variant:x="segmented",radius:h,labelLines:g=1,haptic:_,accessibilityLabel:b,style:p,containerStyle:v,segmentStyle:f,selectedIndicatorStyle:y,textStyle:S,labelStyle:j,testID:C}=e,[R,w]=(0,_index.useControllableState)({value:n,defaultValue:a??i[0]?.value,onChange:o}),q=(0,_index2.useTheme)(),I=q.components["segmented-control"],N=(0,_react.useMemo)(()=>buildStyles(q),[q]),L=(0,_react.useMemo)(()=>(0,_index2.resolveSegmentedControlSize)(q,d),[q,d]),k=g>=2?2:1,F=k>1,M="segmented"===x,z="underline"===x,V="pills"===x,T=M?q.space[I["track-padding"]]:0,A=Math.ceil(1.25L.text)(k-1),E=I["underline-height"],D=q.space[I["pill-inset"]],H="number"==typeof h?h:h?q.radius[h]:void 0,W=H??q.radius.md,B=void 0===H?q.radius.sm:Math.max(H-T,0),P=H??q.radius.pill,O=H??q.radius.none,[G,X]=(0,_react.useState)(0),J=(0,_react.useRef)((0,_index2.createAnimatedValue)(0)).current,K=Math.max(0,i.findIndex(e=>e.value===R)),Q=G>0?(G-2T)/Math.max(i.length,1):0,U=(0,_react.useCallback)((e,t)=>{if(t<=0)return;const i=te,r=q.motion.spring.snappy,s=_reactNative.Animated.spring(J,{toValue:i,damping:r.damping,stiffness:r.stiffness,mass:r.mass,overshootClamping:!0,useNativeDriver:!0});return s.start(),s},[q.motion.spring.snappy,J]);(0,_react.useEffect)(()=>{if(Q>0){const e=U(K,Q);return()=>e?.stop()}},[K,Q,U]);const Y=(0,_react.useCallback)(e=>{const t=e.nativeEvent.layout.width;t!==G&&X(t)},[G])~~,Z=~~(0,_react.useCallback)(e=>{if(u)return;if(e.value===R)return;const t=(0,_index3.resolveHaptic)(_,"selection");t&&(0,_index3.triggerHaptic)(t),w(e.value)},[u,w,R,_])~~,$=~~M?q.colors.surface:V?q.colors["primary-soft"]:q.colors.primary,ee=M?B:V?P:O,te="neutral"===m?q.colors["text-body"]:q.colors.primary,ie=q.colors["bg-muted"],re=(0,_SquircleFill.useSquircle)(M,W,Y),se=!0===l\|\|(0,_index4.hasFieldText)(l),le~~=se~~&&!u,ne=q.colors["field-border-error"],ae=q.size.border,oe=(0,_index4.hasFieldText)(r),de=se?l:s,ce=(0,_index4.hasFieldText)(de),ue=b??("string"==typeof r?r:void 0),me=(0,_jsxRuntime.jsxs)(_reactNative.View,{ref:t,accessibilityRole:"radiogroup",accessibilityLabel:ue,testID:C,style:[N.track,{...F?{minHeight:L.height+A}:{height:L.height},opacity:u?.55:1,alignSelf:c?"stretch":"flex-start"},M?{borderRadius:W,..._corners.smoothCorners,backgroundColor:re.active?"transparent":ie,padding:T}:z?{borderBottomColor:le?ne:q.colors["border-subtle"],borderBottomWidth:_reactNative.StyleSheet.hairlineWidth}:null,v,p],onLayout:re.onLayout,children:[re.active&&re.size?(0,_jsxRuntime.jsx)(_SquircleFill.SquircleFill,{width:re.size.width,height:re.size.height,radius:W,fill:ie,stroke:le?ne:void 0,strokeWidth:ae}):null,(0,_jsxRuntime.jsxs)(_reactNative.View,{style:N.row,children:[Q>0?(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{pointerEvents:"none",style:[N.thumb,M?F?{top:0,bottom:0}:{top:0,height:L.height-2*T}:V?{top:D,bottom:D}:{bottom:0,height:E},{width:Q,borderRadius:ee,..._corners.smoothCorners,backgroundColor~~:$,~~transform:[{translateX:J}]},y]}):null,i.map(e=>{const t=e.value===R,i=t?te:q.colors["text-subtle"],r=(0,_slotIcon.renderSlotIcon)(e.icon,{color:i,size:L.icon,selected:t,disabled:u});return(0,_jsxRuntime.jsxs)(_reactNative.Pressable,{onPress:()~~=>Z~~(e),disabled:u,accessibilityRole:"radio",accessibilityLabel:e.label,accessibilityState:{checked:t,selected:t,disabled:u},"aria-checked":t,"aria-disabled":u,style:({pressed:e})=>[N.segment,F?N.segmentMultiline:null,{paddingHorizontal:L["padding-x"],opacity:e&&!t?.7:1},f],children:[r?(0,_jsxRuntime.jsx)(_reactNative.View,{style:N.segmentIcon,children:r}):null,(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[N.segmentLabel,F?N.segmentLabelMultiline:null,{color:i,fontSize:L.text,fontWeight:t?q.weight.semibold:q.weight.medium},S,j],numberOfLines:k,children:e.label})]},String(e.value))})]}),!le\|\|z\|\|re.active?null:(0,_jsxRuntime.jsx)(_reactNative.View,{pointerEvents:"none",style:[_reactNative.StyleSheet.absoluteFill,{borderWidth:ae,borderColor:ne,borderRadius:M?W:P,..._corners.smoothCorners}]})]});return oe\|\|ce?(0,_jsxRuntime.jsxs)(_reactNative.View,{style:{alignSelf:c?"stretch":"flex-start"},children:[oe?(0,_jsxRuntime.jsx)(_index4.FieldLabel,{size:d,children:r}):null,me,ce?(0,_jsxRuntime.jsx)(_index4.FieldMessage,{size:d,text:de,error:se}):null]}):me});SegmentedControl.displayName="SegmentedControl";const buildStyles=e=>_reactNative.StyleSheet.create({track:{flexDirection:"row",alignItems:"stretch",position:"relative"},row:{flex:1,flexDirection:"row",alignItems:"stretch",position:"relative",overflow:"hidden"},thumb:{position:"absolute",left:0},segment:{flex:1,flexDirection:"row",alignItems:"center",justifyContent:"center"},segmentIcon:{marginRight:e.space.xs},segmentMultiline:{paddingVertical:e.space.xs},segmentLabel:{includeFontPadding:!1},segmentLabelMultiline:{flexShrink:1,textAlign:"center"}});var _default=exports.default=SegmentedControl;
1	+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=exports.SegmentedControl=void 0;var _react=require("react"),_reactNative=require("react-native"),_index=require("../../hooks/index.js"),_index2=require("../../theme/index.js"),_index3=require("../../utils/index.js"),_corners=require("../../utils/corners.js"),_slotIcon=require("../AppIcon/slotIcon.js"),_index4=require("../FieldBase/index.js"),_SquircleFill=require("../SquircleFill/SquircleFill.js"),_jsxRuntime=require("react/jsx-runtime");const LABEL_LINE_HEIGHT_RATIO=1.25,SegmentedControl=exports.SegmentedControl=(0,_react.forwardRef)((e,t)=>{const{segments:i,label:r,helperText:s,error:l,value:n,defaultValue:a,onChange:o,size:c="md",fullWidth:d=!0,disabled:u=!1,tone:m="primary",variant:x="segmented",radius:h,labelLines:g=1,haptic:_,accessibilityLabel:b,style:p,containerStyle:f,segmentStyle:v,selectedIndicatorStyle:y,textStyle:S,labelStyle:j,testID:C}=e,[R,w]=(0,_index.useControllableState)({value:n,defaultValue:a??i[0]?.value,onChange:o}),q=(0,_index2.useTheme)(),I=q.components["segmented-control"],N=(0,_react.useMemo)(()=>buildStyles(q),[q]),L=(0,_react.useMemo)(()=>(0,_index2.resolveSegmentedControlSize)(q,c),[q,c]),k=g>=2?2:1,F=k>1,M="segmented"===x,V="underline"===x,z="pills"===x,T=M?q.space[I["track-padding"]]:0,A=Math.ceil(1.25L.text)(k-1),E=I["underline-height"],D=q.space[I["pill-inset"]],H="number"==typeof h?h:h?q.radius[h]:void 0,W=H??q.radius.md,B=void 0===H?q.radius.sm:Math.max(H-T,0),P=H??q.radius.pill,O=H??q.radius.none,[G,X]=(0,_react.useState)(0),J=(0,_react.useRef)((0,_index2.createAnimatedValue)(0)).current,K=Math.max(0,i.findIndex(e=>e.value===R)),Q=G>0?(G-2T)/Math.max(i.length,1):0,U=(0,_react.useCallback)((e,t)=>{if(t<=0)return;const i=te,r=q.motion.spring.snappy,s=_reactNative.Animated.spring(J,{toValue:i,damping:r.damping,stiffness:r.stiffness,mass:r.mass,overshootClamping:!0,useNativeDriver:!0});return s.start(),s},[q.motion.spring.snappy,J]),Y=(0,_react.useRef)(null);(0,_react.useEffect)(()=>{if(Q<=0)return;const e=null!==Y.current&&Y.current!==K;if(Y.current=K,!e)return void J.setValue(QK);const t=U(K,Q);return()=>t?.stop()},[K,Q,U,J]);const Z=(0,_react.useCallback)(e=>{const t=e.nativeEvent.layout.width;t!==G&&X(t)},[G]),$=(0,_react.useCallback)(e=>{if(u)return;if(e.value===R)return;const t=(0,_index3.resolveHaptic)(_,"selection");t&&(0,_index3.triggerHaptic)(t),w(e.value)},[u,w,R,_]),ee=M?q.colors.surface:z?q.colors["primary-soft"]:q.colors.primary,te=M?B:z?P:O,ie="neutral"===m?q.colors["text-body"]:q.colors.primary,re=q.colors["bg-muted"],se=(0,_SquircleFill.useSquircle)(M,W,Z),le=!0===l\|\|(0,_index4.hasFieldText)(l),ne=le&&!u,ae=q.colors["field-border-error"],oe=q.size.border,ce=(0,_index4.hasFieldText)(r),de=le?l:s,ue=(0,_index4.hasFieldText)(de),me=b??("string"==typeof r?r:void 0),xe=(0,_jsxRuntime.jsxs)(_reactNative.View,{ref:t,accessibilityRole:"radiogroup",accessibilityLabel:me,testID:C,style:[N.track,{...F?{minHeight:L.height+A}:{height:L.height},opacity:u?.55:1,alignSelf:d?"stretch":"flex-start"},M?{borderRadius:W,..._corners.smoothCorners,backgroundColor:se.active?"transparent":re,padding:T}:V?{borderBottomColor:ne?ae:q.colors["border-subtle"],borderBottomWidth:_reactNative.StyleSheet.hairlineWidth}:null,f,p],onLayout:se.onLayout,children:[se.active&&se.size?(0,_jsxRuntime.jsx)(_SquircleFill.SquircleFill,{width:se.size.width,height:se.size.height,radius:W,fill:re,stroke:ne?ae:void 0,strokeWidth:oe}):null,(0,_jsxRuntime.jsxs)(_reactNative.View,{style:N.row,children:[Q>0?(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{pointerEvents:"none",style:[N.thumb,M?F?{top:0,bottom:0}:{top:0,height:L.height-2T}:z?{top:D,bottom:D}:{bottom:0,height:E},{width:Q,borderRadius:te,..._corners.smoothCorners,backgroundColor:ee,transform:[{translateX:J}]},y]}):null,i.map(e=>{const t=e.value===R,i=t?ie:q.colors["text-subtle"],r=(0,_slotIcon.renderSlotIcon)(e.icon,{color:i,size:L.icon,selected:t,disabled:u});return(0,_jsxRuntime.jsxs)(_reactNative.Pressable,{onPress:()=>$(e),disabled:u,accessibilityRole:"radio",accessibilityLabel:e.label,accessibilityState:{checked:t,selected:t,disabled:u},"aria-checked":t,"aria-disabled":u,style:({pressed:e})=>[N.segment,F?N.segmentMultiline:null,{paddingHorizontal:L["padding-x"],opacity:e&&!t?.7:1},v],children:[r?(0,_jsxRuntime.jsx)(_reactNative.View,{style:N.segmentIcon,children:r}):null,(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[N.segmentLabel,F?N.segmentLabelMultiline:null,{color:i,fontSize:L.text,fontWeight:t?q.weight.semibold:q.weight.medium},S,j],numberOfLines:k,children:e.label})]},String(e.value))})]}),!ne\|\|V\|\|se.active?null:(0,_jsxRuntime.jsx)(_reactNative.View,{pointerEvents:"none",style:[_reactNative.StyleSheet.absoluteFill,{borderWidth:oe,borderColor:ae,borderRadius:M?W:P,..._corners.smoothCorners}]})]});return ce\|\|ue?(0,_jsxRuntime.jsxs)(_reactNative.View,{style:{alignSelf:d?"stretch":"flex-start"},children:[ce?(0,_jsxRuntime.jsx)(_index4.FieldLabel,{size:c,children:r}):null,xe,ue?(0,_jsxRuntime.jsx)(_index4.FieldMessage,{size:c,text:de,error:le}):null]}):xe});SegmentedControl.displayName="SegmentedControl";const buildStyles=e=>_reactNative.StyleSheet.create({track:{flexDirection:"row",alignItems:"stretch",position:"relative"},row:{flex:1,flexDirection:"row",alignItems:"stretch",position:"relative",overflow:"hidden"},thumb:{position:"absolute",left:0},segment:{flex:1,flexDirection:"row",alignItems:"center",justifyContent:"center"},segmentIcon:{marginRight:e.space.xs},segmentMultiline:{paddingVertical:e.space.xs},segmentLabel:{includeFontPadding:!1},segmentLabelMultiline:{flexShrink:1,textAlign:"center"}});var _default=exports.default=SegmentedControl;

package/lib/commonjs/components/Tabs/Tabs.js CHANGED Viewed

	@@ -1 +1 @@
1	- "use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=exports.Tabs=void 0;var _react=require("react"),_reactNative=require("react-native"),_index=require("../../theme/index.js"),_index2=require("../../utils/index.js"),_corners=require("../../utils/corners.js"),_slotIcon=require("../AppIcon/slotIcon.js"),_SquircleFill=require("../SquircleFill/SquircleFill.js"),_jsxRuntime=require("react/jsx-runtime");const Tabs=exports.Tabs=(0,_react.forwardRef)((e,t)=>{const{tabs:i,activeKey:r,onChange:a,variant:s="underline",radius:n,size:o="md",scrollable:l=!1,align:c="left",style:d,containerStyle:u,tabStyle:p,tabLabelStyle:m,tabIconStyle:b,tabBadgeStyle:x,dividerStyle:g,indicatorStyle:_,progress:h,haptic:y,accessibilityLabel:f,testID:v}=e,j=(0,_index.useTheme)(),S=(0,_react.useMemo)(()=>buildStyles(j),[j]),R=j.components.tabs,w=(0,_react.useMemo)(()=>(0,_index.resolveTabsSize)(j,o),[j,o]),C=l?w["scrollable-padding-x"]:w["padding-x"],N=w["padding-y"],k=w.text,z=j.space[R["icon-gap"]],q=w.icon,I=R["underline-height"],T=j.space[R["pill-inset"]],L=R["disabled-opacity"],F=j.space[R["badge-gap"]],V="segmented"===s,A=(0,_react.useMemo)(()=>(0,_index.resolveSegmentedControlSize)(j,o),[j,o]),M=j.space[R["track-padding"]],P="number"==typeof n?n:n?j.radius[n]:void 0,D=P??j.radius.md,H=void 0===P?j.radius.sm:Math.max(P-M,0),B=P??j.radius.pill,W=P??j.radius.none,E=j.colors["bg-muted"],O=(0,_SquircleFill.useSquircle)(V,D),[U,K]=(0,_react.useState)({}),X=(0,_react.useRef)((0,_index.createAnimatedValue)(0)).current,G=(0,_react.useRef)((0,_index.createAnimatedValue)(0)).current,J=U[r],Q=i.every(e=>void 0!==U[e.key]),Y=void 0!==h&&Q&&i.length>1,Z=(0,_react.useMemo)(()=>Y&&h?h.interpolate({inputRange:i.map((e,t)=>t),outputRange:i.map(e=>U[e.key].x),extrapolate:"clamp"}):null,[Y,h,i,U]),$=(0,_react.useMemo)(()=>Y&&h?h.interpolate({inputRange:i.map((e,t)=>t),outputRange:i.map(e=>U[e.key].width),extrapolate:"clamp"}):null,[Y,h,i,U]);(0,_react.useEffect)(()=>{if(!J)return;if(Y)return;const e=j.motion.spring.snappy,t=_reactNative.Animated.parallel([_reactNative.Animated.spring(X,{toValue:J.x,damping:e.damping,stiffness:e.stiffness,mass:e.mass,overshootClamping:!0,useNativeDriver:!1}),_reactNative.Animated.spring(G,{toValue:J.width,damping:e.damping,stiffness:e.stiffness,mass:e.mass,overshootClamping:!0,useNativeDriver:!1})]);return t.start(),()=>t.stop()},[J,r,X,G,j.motion.spring.snappy,Y]);const ee=(0,_react.useCallback)(e=>t=>{const{x:i,width:r}=t.nativeEvent.layout;K(t=>{const a=t[e];return a&&a.x===i&&a.width===r?t:{...t,[e]:{x:i,width:r}}})},[]),te=(0,_react.useCallback)(e=>{if(e.disabled)return;if(e.key===r)return;const t=(0,_index2.resolveHaptic)(y,"selection");t&&(0,_index2.triggerHaptic)(t),a(e.key)},[r,a,y]),ie="pills"===s,re=(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{pointerEvents:"none",style:[V?S.indicatorThumb:ie?S.indicatorPill:S.indicatorUnderline,V?null:ie?{top:T,bottom:T}:{height:I},{width:$??G,transform:[{translateX:Z??X}],backgroundColor:V?j.colors.surface:ie?j.colors["primary-soft"]:j.colors.primary,borderRadius:V?H:ie?B:W,..._corners.smoothCorners},_]}),renderTabs=()=>i.map(e=>{const t=e.key===r,i=!0===e.disabled,a=t?j.colors.primary:j.colors["text-subtle"],s=(0,_slotIcon.renderSlotIcon)(e.icon,{color:a,size:q,focused:t,disabled:i});return(0,_jsxRuntime.jsxs)(_reactNative.Pressable,{onPress:()=>te(e),onLayout:ee(e.key),disabled:i,accessibilityRole:"tab",accessibilityLabel:e.label,accessibilityState:{selected:t,disabled:i},"aria-selected":t,"aria-disabled":i,android_ripple:V?void 0:{color:j.colors["surface-pressed"],borderless:!1},style:({pressed:e})=>[S.tab,l?null:S.tabFlex,V?{paddingHorizontal:A["padding-x"],height:A.height-2*M}:{paddingHorizontal:C,paddingVertical:N},{opacity:i?L:e&&V&&!t?.7:1,backgroundColor:e&&!V?j.colors["surface-pressed"]:"transparent"},p],children:[s?(0,_jsxRuntime.jsx)(_reactNative.View,{style:[S.tabIcon,{marginRight:z},b],children:s}):null,(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[S.tabLabel,{color:a,fontSize:V?A.text:k,fontWeight:t?j.weight.semibold:j.weight.medium},m],numberOfLines:1,children:e.label}),void 0!==e.badge&&null!==e.badge?(0,_jsxRuntime.jsx)(_reactNative.View,{style:[S.tabBadge,{marginLeft:F,backgroundColor:j.colors["primary-soft"],borderRadius:j.radius.pill,..._corners.smoothCorners,paddingHorizontal:j.space.xs},x],children:(0,_jsxRuntime.jsx)(_reactNative.Text,{style:{color:j.colors.primary,fontSize:j.text.xs.size,fontWeight:j.weight.semibold},numberOfLines:1,children:String(e.badge)})}):null]},e.key)}),ae={flexDirection:"row",alignItems:"stretch",justifyContent:l?"flex-start":"center"===c?"center":"flex-start",position:"relative",overflow:"hidden"},se=V?(0,_jsxRuntime.jsxs)(_jsxRuntime.Fragment,{children:[re,renderTabs()]}):(0,_jsxRuntime.jsxs)(_jsxRuntime.Fragment,{children:[renderTabs(),re]});return(0,_jsxRuntime.jsxs)(_reactNative.View,{ref:t,style:[S.container,{borderBottomColor:j.colors["border-subtle"],borderBottomWidth:"underline"===s?_reactNative.StyleSheet.hairlineWidth:0},"underline"===s?g:null,V?{padding:M,borderRadius:D,..._corners.smoothCorners,backgroundColor:O.active?"transparent":E}:null,d,u],onLayout:O.onLayout,accessibilityRole:"tablist",accessibilityLabel:f,testID:v,children:[O.active&&O.size?(0,_jsxRuntime.jsx)(_SquircleFill.SquircleFill,{width:O.size.width,height:O.size.height,radius:D,fill:E}):null,l?(0,_jsxRuntime.jsx)(_reactNative.ScrollView,{horizontal:!0,showsHorizontalScrollIndicator:!1,contentContainerStyle:[ae],keyboardShouldPersistTaps:"handled",children:se}):(0,_jsxRuntime.jsx)(_reactNative.View,{style:ae,children:se})]})});Tabs.displayName="Tabs";const buildStyles=e=>_reactNative.StyleSheet.create({container:{width:"100%",position:"relative"},tab:{flexDirection:"row",alignItems:"center",justifyContent:"center"},tabFlex:{flex:1},tabIcon:{},tabLabel:{includeFontPadding:!1,flexShrink:1},tabBadge:{minWidth:18,alignItems:"center",justifyContent:"center"},indicatorUnderline:{position:"absolute",left:0,bottom:0},indicatorPill:{position:"absolute",left:0,zIndex:-1},indicatorThumb:{position:"absolute",left:0,top:0,bottom:0}});var _default=exports.default=Tabs;
1	+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=exports.Tabs=void 0;var _react=require("react"),_reactNative=require("react-native"),_index=require("../../theme/index.js"),_index2=require("../../utils/index.js"),_corners=require("../../utils/corners.js"),_slotIcon=require("../AppIcon/slotIcon.js"),_SquircleFill=require("../SquircleFill/SquircleFill.js"),_jsxRuntime=require("react/jsx-runtime");const Tabs=exports.Tabs=(0,_react.forwardRef)((e,t)=>{const{tabs:i,activeKey:r,onChange:a,variant:s="underline",radius:n,size:l="md",scrollable:o=!1,align:c="left",style:d,containerStyle:u,tabStyle:p,tabLabelStyle:m,tabIconStyle:b,tabBadgeStyle:x,dividerStyle:g,indicatorStyle:_,progress:h,haptic:y,accessibilityLabel:f,testID:v}=e,j=(0,_index.useTheme)(),S=(0,_react.useMemo)(()=>buildStyles(j),[j]),R=j.components.tabs,w=(0,_react.useMemo)(()=>(0,_index.resolveTabsSize)(j,l),[j,l]),C=o?w["scrollable-padding-x"]:w["padding-x"],N=w["padding-y"],k=w.text,z=j.space[R["icon-gap"]],q=w.icon,I=R["underline-height"],T=j.space[R["pill-inset"]],V=R["disabled-opacity"],L=j.space[R["badge-gap"]],F="segmented"===s,A=(0,_react.useMemo)(()=>(0,_index.resolveSegmentedControlSize)(j,l),[j,l]),M=j.space[R["track-padding"]],P="number"==typeof n?n:n?j.radius[n]:void 0,D=P??j.radius.md,H=void 0===P?j.radius.sm:Math.max(P-M,0),B=P??j.radius.pill,W=P??j.radius.none,E=j.colors["bg-muted"],O=(0,_SquircleFill.useSquircle)(F,D),[U,K]=(0,_react.useState)({}),X=(0,_react.useRef)((0,_index.createAnimatedValue)(0)).current,G=(0,_react.useRef)((0,_index.createAnimatedValue)(0)).current,J=U[r],Q=i.every(e=>void 0!==U[e.key]),Y=void 0!==h&&Q&&i.length>1,Z=(0,_react.useMemo)(()=>Y&&h?h.interpolate({inputRange:i.map((e,t)=>t),outputRange:i.map(e=>U[e.key].x),extrapolate:"clamp"}):null,[Y,h,i,U]),$=(0,_react.useMemo)(()=>Y&&h?h.interpolate({inputRange:i.map((e,t)=>t),outputRange:i.map(e=>U[e.key].width),extrapolate:"clamp"}):null,[Y,h,i,U]),ee=(0,_react.useRef)(null);(0,_react.useEffect)(()=>{if(!J)return;if(Y)return;const e=null!==ee.current&&ee.current!==r;if(ee.current=r,!e)return X.setValue(J.x),void G.setValue(J.width);const t=j.motion.spring.snappy,i=_reactNative.Animated.parallel([_reactNative.Animated.spring(X,{toValue:J.x,damping:t.damping,stiffness:t.stiffness,mass:t.mass,overshootClamping:!0,useNativeDriver:!1}),_reactNative.Animated.spring(G,{toValue:J.width,damping:t.damping,stiffness:t.stiffness,mass:t.mass,overshootClamping:!0,useNativeDriver:!1})]);return i.start(),()=>i.stop()},[J,r,X,G,j.motion.spring.snappy,Y]);const te=(0,_react.useCallback)(e=>t=>{const{x:i,width:r}=t.nativeEvent.layout;K(t=>{const a=t[e];return a&&a.x===i&&a.width===r?t:{...t,[e]:{x:i,width:r}}})},[]),ie=(0,_react.useCallback)(e=>{if(e.disabled)return;if(e.key===r)return;const t=(0,_index2.resolveHaptic)(y,"selection");t&&(0,_index2.triggerHaptic)(t),a(e.key)},[r,a,y]),re="pills"===s,ae=(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{pointerEvents:"none",style:[F?S.indicatorThumb:re?S.indicatorPill:S.indicatorUnderline,F?null:re?{top:T,bottom:T}:{height:I},{width:$??G,transform:[{translateX:Z??X}],backgroundColor:F?j.colors.surface:re?j.colors["primary-soft"]:j.colors.primary,borderRadius:F?H:re?B:W,..._corners.smoothCorners},_]}),renderTabs=()=>i.map(e=>{const t=e.key===r,i=!0===e.disabled,a=t?j.colors.primary:j.colors["text-subtle"],s=(0,_slotIcon.renderSlotIcon)(e.icon,{color:a,size:q,focused:t,disabled:i});return(0,_jsxRuntime.jsxs)(_reactNative.Pressable,{onPress:()=>ie(e),onLayout:te(e.key),disabled:i,accessibilityRole:"tab",accessibilityLabel:e.label,accessibilityState:{selected:t,disabled:i},"aria-selected":t,"aria-disabled":i,android_ripple:F?void 0:{color:j.colors["surface-pressed"],borderless:!1},style:({pressed:e})=>[S.tab,o?null:S.tabFlex,F?{paddingHorizontal:A["padding-x"],height:A.height-2*M}:{paddingHorizontal:C,paddingVertical:N},{opacity:i?V:e&&F&&!t?.7:1,backgroundColor:e&&!F?j.colors["surface-pressed"]:"transparent"},p],children:[s?(0,_jsxRuntime.jsx)(_reactNative.View,{style:[S.tabIcon,{marginRight:z},b],children:s}):null,(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[S.tabLabel,{color:a,fontSize:F?A.text:k,fontWeight:t?j.weight.semibold:j.weight.medium},m],numberOfLines:1,children:e.label}),void 0!==e.badge&&null!==e.badge?(0,_jsxRuntime.jsx)(_reactNative.View,{style:[S.tabBadge,{marginLeft:L,backgroundColor:j.colors["primary-soft"],borderRadius:j.radius.pill,..._corners.smoothCorners,paddingHorizontal:j.space.xs},x],children:(0,_jsxRuntime.jsx)(_reactNative.Text,{style:{color:j.colors.primary,fontSize:j.text.xs.size,fontWeight:j.weight.semibold},numberOfLines:1,children:String(e.badge)})}):null]},e.key)}),se={flexDirection:"row",alignItems:"stretch",justifyContent:o?"flex-start":"center"===c?"center":"flex-start",position:"relative",overflow:"hidden"},ne=F?(0,_jsxRuntime.jsxs)(_jsxRuntime.Fragment,{children:[ae,renderTabs()]}):(0,_jsxRuntime.jsxs)(_jsxRuntime.Fragment,{children:[renderTabs(),ae]});return(0,_jsxRuntime.jsxs)(_reactNative.View,{ref:t,style:[S.container,{borderBottomColor:j.colors["border-subtle"],borderBottomWidth:"underline"===s?_reactNative.StyleSheet.hairlineWidth:0},"underline"===s?g:null,F?{padding:M,borderRadius:D,..._corners.smoothCorners,backgroundColor:O.active?"transparent":E}:null,d,u],onLayout:O.onLayout,accessibilityRole:"tablist",accessibilityLabel:f,testID:v,children:[O.active&&O.size?(0,_jsxRuntime.jsx)(_SquircleFill.SquircleFill,{width:O.size.width,height:O.size.height,radius:D,fill:E}):null,o?(0,_jsxRuntime.jsx)(_reactNative.ScrollView,{horizontal:!0,showsHorizontalScrollIndicator:!1,contentContainerStyle:[se],keyboardShouldPersistTaps:"handled",children:ne}):(0,_jsxRuntime.jsx)(_reactNative.View,{style:se,children:ne})]})});Tabs.displayName="Tabs";const buildStyles=e=>_reactNative.StyleSheet.create({container:{width:"100%",position:"relative"},tab:{flexDirection:"row",alignItems:"center",justifyContent:"center"},tabFlex:{flex:1},tabIcon:{},tabLabel:{includeFontPadding:!1,flexShrink:1},tabBadge:{minWidth:18,alignItems:"center",justifyContent:"center"},indicatorUnderline:{position:"absolute",left:0,bottom:0},indicatorPill:{position:"absolute",left:0,zIndex:-1},indicatorThumb:{position:"absolute",left:0,top:0,bottom:0}});var _default=exports.default=Tabs;

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

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

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

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

package/lib/module/components/BottomSheet/BottomSheet.meta.js CHANGED Viewed

	@@ -1 +1 @@
1	- "use strict";import{definePhoneMeta}from"../../canvasKit/meta.js";export const meta=definePhoneMeta()({name:"BottomSheet",marker:null,platforms:["phone"],acceptsChildren:!0,props:{snapPoints:{type:"array",required:!0,description:"The heights the sheet rests at: a number of points, a percentage such as 50%, or content to hug the content."},index:{type:"number",description:"The snap point the sheet shows, counted from 0. Minus one closes it."},enablePanDownToClose:{type:"boolean",default:!0,description:"Lets a drag on the handle past the threshold close the sheet."},enableBackdropPress:{type:"boolean",default:!0,description:"Lets a tap on the scrim close the sheet. Back and Escape follow it."},scrollable:{type:"boolean",default:!1,description:"Wraps the content in a vertical scroll view between the header and the footer."},scrollEventThrottle:{type:"number",description:"How often the inner scroll view reports scrolling, in milliseconds. Used only with scrollable."},backdropOpacity:{type:"number",description:"The opacity of the scrim."},keyboardBehavior:{type:"enum",values:["none","shift"],default:"shift",description:"How the sheet reacts to the keyboard. Shift rides up with it; none stays put."},mode:{type:"enum",values:["modal","inline"],default:"modal",description:"Modal covers the whole screen in a native modal; inline overlays the parent view."},presentation:{type:"enum",values:["sheet","dialog","auto"],default:"sheet",description:"Sheet is full width at the bottom; dialog is centred; auto picks a dialog on a tablet."},header:{type:"node",description:"A fixed region between the handle and the content. It does not scroll."},footer:{type:"node",description:"A fixed region at the bottom of the sheet, such as a row of buttons."},accessibilityLabel:{type:"string",description:"Names the sheet for a screen reader."},accessibilityViewIsModal:{type:"boolean",description:"Tells a screen reader to ignore what is behind the sheet."}},omit:["scrollRef"],examples:[{id:"BottomSheet.content",title:"Hugs its content",props:{snapPoints:["content"],mode:"inline",index:0},children:"Sheet content."},{id:"BottomSheet.headerFooter",title:"Header and footer",props:{snapPoints:["50%"],mode:"inline",index:0,header:"Filters",footer:"Apply"},children:"Choose how to filter the list."},{id:"BottomSheet.dialog",title:"Dialog presentation",props:{snapPoints:["50%"],presentation:"dialog",mode:"inline",index:0},children:"Centred on a tablet."}],usage:{when:["A short task or a list of choices belongs on top of the current screen.","The person should be able to drag the sheet between a small and a tall height.","The content needs a fixed header or a fixed row of buttons."],whenNot:[{text:"The person must answer one question before going on.",instead:"Dialog"},{text:"The content is a full screen of its own.",instead:"a new screen"}],do:[{note:"Use the content snap point so the sheet is as tall as what it holds.",example:[{component:"BottomSheet",props:{snapPoints:["content"],mode:"inline",index:0}}]}],dont:[{note:"Do not set a snap point taller than the content needs. It leaves a large empty area.",example:[{component:"BottomSheet",props:{snapPoints:["90%"],mode:"inline",index:0}}]}],a11y:["Turning off backdrop press also turns off Back and Escape, so a sheet that must be answered stays open.","Set accessibilityLabel so a screen reader names the sheet when it opens."]}});
1	+ "use strict";import{definePhoneMeta}from"../../canvasKit/meta.js";export const meta=definePhoneMeta()({name:"BottomSheet",marker:null,platforms:["phone"],acceptsChildren:!0,props:{snapPoints:{type:"array",required:!0,description:"The heights the sheet rests at: a number of points, a percentage such as 50%, or content to hug the content."},index:{type:"number",description:"The snap point the sheet shows, counted from 0. Minus one closes it."},enablePanDownToClose:{type:"boolean",default:!0,description:"Lets a drag on the handle past the threshold close the sheet."},enableBackdropPress:{type:"boolean",default:!0,description:"Lets a tap on the scrim close the sheet. Back and Escape follow it."},scrollable:{type:"boolean",default:!1,description:"Wraps the content in a vertical scroll view between the header and the footer."},scrollEventThrottle:{type:"number",description:"How often the inner scroll view reports scrolling, in milliseconds. Used only with scrollable."},backdropOpacity:{type:"number",description:"The opacity of the scrim."},keyboardBehavior:{type:"enum",values:["none","shift"],default:"shift",description:"How the sheet reacts to the keyboard. Shift rides up with it; none stays put."},mode:{type:"enum",values:["modal","inline"],default:"modal",description:"Modal covers the whole screen in a native modal; inline overlays the parent view."},presentation:{type:"enum",values:["sheet","dialog","auto"],default:"sheet",description:"Sheet is full width at the bottom; dialog is centred; auto picks a dialog on a tablet."},animateMount:{type:"boolean",default:!0,description:"Slides the sheet up when it opens as it mounts. Off, it is drawn at its snap point at once."},header:{type:"node",description:"A fixed region between the handle and the content. It does not scroll."},footer:{type:"node",description:"A fixed region at the bottom of the sheet, such as a row of buttons."},accessibilityLabel:{type:"string",description:"Names the sheet for a screen reader."},accessibilityViewIsModal:{type:"boolean",description:"Tells a screen reader to ignore what is behind the sheet."}},omit:["scrollRef"],examples:[{id:"BottomSheet.content",title:"Hugs its content",props:{snapPoints:["content"],mode:"inline",index:0},children:"Sheet content."},{id:"BottomSheet.headerFooter",title:"Header and footer",props:{snapPoints:["50%"],mode:"inline",index:0,header:"Filters",footer:"Apply"},children:"Choose how to filter the list."},{id:"BottomSheet.dialog",title:"Dialog presentation",props:{snapPoints:["50%"],presentation:"dialog",mode:"inline",index:0},children:"Centred on a tablet."}],usage:{when:["A short task or a list of choices belongs on top of the current screen.","The person should be able to drag the sheet between a small and a tall height.","The content needs a fixed header or a fixed row of buttons."],whenNot:[{text:"The person must answer one question before going on.",instead:"Dialog"},{text:"The content is a full screen of its own.",instead:"a new screen"}],do:[{note:"Use the content snap point so the sheet is as tall as what it holds.",example:[{component:"BottomSheet",props:{snapPoints:["content"],mode:"inline",index:0}}]}],dont:[{note:"Do not set a snap point taller than the content needs. It leaves a large empty area.",example:[{component:"BottomSheet",props:{snapPoints:["90%"],mode:"inline",index:0}}]}],a11y:["Turning off backdrop press also turns off Back and Escape, so a sheet that must be answered stays open.","Set accessibilityLabel so a screen reader names the sheet when it opens."]}});

package/lib/module/components/Dialog/Dialog.js CHANGED Viewed

	@@ -1 +1 @@
1	- "use strict";import{useCallback,useMemo}from"react";import{ActivityIndicator,Pressable,StyleSheet,Text,View}from"react-native";import{fontFor,useTheme}from"../../theme/index.js";import{tintOf}from"../../utils/color.js";import{smoothCorners}from"../../utils/corners.js";import{resolveHaptic,triggerHaptic}from"../../utils/hapticUtils.js";import{MODAL_DISMISS_GRACE_MS,Modal}from"../Modal/Modal.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const Dialog=e=>{const{visible:t,onClose:o,title:r,message:i,children:s,icon:l,variant:n="default",actions:a,dismissOnAction:c=!0,accessibilityLabel:d,contentStyle:u,containerStyle:b,titleStyle:m,messageStyle:g,iconWrapperStyle:p,actionsRowStyle:y,actionButtonStyle:x,actionTextStyle:h,haptic:f,testID:C}=e,S=useTheme(),j=useMemo(()=>buildStyles(S),[S]),_=useMemo(()=>discFor(S,n),[S,n]),w=S.components.dialog["icon-wrapper-size"],I=S.components.dialog["action-button-min-height"],D=Boolean(a&&a.length>0),M=useCallback(e=>{if(e.loading\|\|e.disabled)return;const t=resolveHaptic(f,"selection");t&&triggerHaptic(t),c?(o(),setTimeout(e.onPress,MODAL_DISMISS_GRACE_MS)):e.onPress()},[c,o,f]);return _jsx(Modal,{visible:t,onRequestClose:o,haptic:f,presentation:"centered",accessibilityLabel:d??r,contentStyle:u,testID:C,children:_jsxs(View,{accessibilityRole:"alert",accessibilityLabel:d??r,style:[j.container,b],children:[l?_jsx(View,{style:[j.iconWrapper,{width:w,height:w,borderRadius:S.radius.pill,...smoothCorners,backgroundColor:_,marginBottom:S.space.md},p],children:l}):null,r?_jsx(Text,{style:[j.title,{color:S.colors["text-body"],fontSize:S.text.xl.size,...fontFor(S,"semibold"),marginBottom:i\|\|null!=s?S.space.sm:S.space.md},m],accessibilityRole:"header",children:r}):null,i?_jsx(Text,{style:[j.message,{color:S.colors["text-muted"],fontSize:S.text.base.size,lineHeight:S.text.base.size*S.leading.body,marginBottom:null!=s?S.space.md:D?S.space.lg:0},g],children:i}):null,null!=s?_jsx(View,{style:{marginBottom:D?S.space.lg:0},children:s}):null,a&&a.length>0?_jsx(View,{style:[j.actionsRow,y],children:a.map((e,t)=>{const o=e.tone??"primary",r=Boolean(e.disabled),i=actionStyleFor(S,o,r),s=t===a.length-1;return _jsx(Pressable,{onPress:()=>M(e),disabled:e.loading\|\|r,accessibilityRole:"button",accessibilityLabel:e.label,accessibilityState:{busy:e.loading,disabled:Boolean(e.loading)\|\|r},"aria-busy":e.loading,"aria-disabled":Boolean(e.loading)\|\|r,style:({pressed:t})=>[j.actionButton,{minHeight:I,backgroundColor:i.backgroundColor,borderColor:i.borderColor,borderWidth:i.borderWidth,borderRadius:S.radius.md,...smoothCorners,paddingVertical:S.space.sm,paddingHorizontal:S.space.md,marginRight:s?0:S.space.sm,opacity:e.loading?.7:t&&!r?.85:1},x],children:e.loading?_jsx(ActivityIndicator,{size:"small",color:i.textColor}):_jsx(Text,{style:[{color:i.textColor,fontSize:S.text.base.size,...fontFor(S,"semibold"),textAlign:"center"},h],children:e.label})},`${e.label}-${t}`)})}):null]})})};Dialog.displayName="Dialog";const SOFT_DISC_OPACITY=.14,discFor=(e,t)=>{const o=e.colors["bg-subtle"];switch(t){case"success":return tintOf(e.colors.success,.14,o);case"warning":return tintOf(e.colors.warning,.14,o);case"danger":return tintOf(e.colors.danger,.14,o);case"info":return tintOf(e.colors.info,.14,o);default:return e.colors["primary-soft"]}},actionStyleFor=(e,t,o)=>{if(o)return{backgroundColor:"neutral"===t?"transparent":e.colors["surface-disabled"],borderColor:"neutral"===t?e.colors.border:"transparent",borderWidth:"neutral"===t?1:0,textColor:e.colors["text-disabled"]};switch(t){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"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=>StyleSheet.create({container:{alignItems:"stretch"},iconWrapper:{alignItems:"center",justifyContent:"center",alignSelf:"center"},title:{textAlign:"center"},message:{textAlign:"center"},actionsRow:{flexDirection:"row",justifyContent:"flex-end",alignItems:"stretch"},~~actionButton~~:{~~flex~~:1,alignItems:"center",justifyContent:"center"}});export{Dialog};export default Dialog;
1	+ "use strict";import{useCallback,useMemo,useRef,useState}from"react";import{ActivityIndicator,Pressable,StyleSheet,Text,View}from"react-native";import{fontFor,useTheme}from"../../theme/index.js";import{tintOf}from"../../utils/color.js";import{smoothCorners}from"../../utils/corners.js";import{resolveHaptic,triggerHaptic}from"../../utils/hapticUtils.js";import{MODAL_DISMISS_GRACE_MS,Modal}from"../Modal/Modal.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const Dialog=e=>{const{visible:t,onClose:o,title:r,message:l,children:s,icon:i,variant:n="default",actions:a,dismissOnAction:c=!0,accessibilityLabel:d,contentStyle:u,containerStyle:b,titleStyle:m,messageStyle:g,iconWrapperStyle:p,actionsRowStyle:y,actionButtonStyle:h,actionTextStyle:x,haptic:f,testID:C}=e,S=useTheme(),j=useMemo(()=>buildStyles(S),[S]),_=useMemo(()=>discFor(S,n),[S,n]),w=S.components.dialog["icon-wrapper-size"],R=S.components.dialog["action-button-min-height"],k=Boolean(a&&a.length>0),D=S.text.base.sizeS.leading.body,I=a?a.map(e=>e.label).join("\n"):"",[M,v]=useState(null),z=null!==M&&M===I,A=useRef(null),B=useCallback(e=>{e.nativeEvent.layout.height>1.5D&&v(I)},[D,I]),O=useCallback(e=>{const t=e.nativeEvent.layout.width,o=A.current;A.current=t,null!==o&&Math.abs(o-t)>.5&&v(null)},[]),T=useCallback(e=>{if(e.loading\|\|e.disabled)return;const t=resolveHaptic(f,"selection");t&&triggerHaptic(t),c?(o(),setTimeout(e.onPress,MODAL_DISMISS_GRACE_MS)):e.onPress()},[c,o,f]);return _jsx(Modal,{visible:t,onRequestClose:o,haptic:f,presentation:"centered",accessibilityLabel:d??r,contentStyle:u,testID:C,children:_jsxs(View,{accessibilityRole:"alert",accessibilityLabel:d??r,style:[j.container,b],children:[i?_jsx(View,{style:[j.iconWrapper,{width:w,height:w,borderRadius:S.radius.pill,...smoothCorners,backgroundColor:_,marginBottom:S.space.md},p],children:i}):null,r?_jsx(Text,{style:[j.title,{color:S.colors["text-body"],fontSize:S.text.xl.size,...fontFor(S,"semibold"),marginBottom:l\|\|null!=s?S.space.sm:S.space.md},m],accessibilityRole:"header",children:r}):null,l?_jsx(Text,{style:[j.message,{color:S.colors["text-muted"],fontSize:S.text.base.size,lineHeight:S.text.base.size*S.leading.body,marginBottom:null!=s?S.space.md:k?S.space.lg:0},g],children:l}):null,null!=s?_jsx(View,{style:{marginBottom:k?S.space.lg:0},children:s}):null,a&&a.length>0?_jsx(View,{style:[j.actionsRow,z?j.actionsRowStacked:null,y],onLayout:O,children:a.map((e,t)=>{const o=e.tone??"primary",r=Boolean(e.disabled),l=actionStyleFor(S,o,r),s=t===a.length-1;return _jsx(Pressable,{onPress:()=>T(e),disabled:e.loading\|\|r,accessibilityRole:"button",accessibilityLabel:e.label,accessibilityState:{busy:e.loading,disabled:Boolean(e.loading)\|\|r},"aria-busy":e.loading,"aria-disabled":Boolean(e.loading)\|\|r,style:({pressed:t})=>[j.actionButton,{flex:z?0:1,minHeight:R,backgroundColor:l.backgroundColor,borderColor:l.borderColor,borderWidth:l.borderWidth,borderRadius:S.radius.md,...smoothCorners,paddingVertical:S.space.sm,paddingHorizontal:S.space.md,marginRight:s\|\|z?0:S.space.sm,opacity:e.loading?.7:t&&!r?.85:1},h],children:e.loading?_jsx(ActivityIndicator,{size:"small",color:l.textColor}):_jsx(View,{onLayout:B,children:_jsx(Text,{style:[{color:l.textColor,fontSize:S.text.base.size,...fontFor(S,"semibold"),textAlign:"center"},x],children:e.label})})},`${e.label}-${t}`)})}):null]})})};Dialog.displayName="Dialog";const SOFT_DISC_OPACITY=.14,discFor=(e,t)=>{const o=e.colors["bg-subtle"];switch(t){case"success":return tintOf(e.colors.success,.14,o);case"warning":return tintOf(e.colors.warning,.14,o);case"danger":return tintOf(e.colors.danger,.14,o);case"info":return tintOf(e.colors.info,.14,o);default:return e.colors["primary-soft"]}},actionStyleFor=(e,t,o)=>{if(o)return{backgroundColor:"neutral"===t?"transparent":e.colors["surface-disabled"],borderColor:"neutral"===t?e.colors.border:"transparent",borderWidth:"neutral"===t?1:0,textColor:e.colors["text-disabled"]};switch(t){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"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=>StyleSheet.create({container:{alignItems:"stretch"},iconWrapper:{alignItems:"center",justifyContent:"center",alignSelf:"center"},title:{textAlign:"center"},message:{textAlign:"center"},actionsRow:{flexDirection:"row",justifyContent:"flex-end",alignItems:"stretch"},actionsRowStacked:{flexDirection:"column",rowGap:e.space.sm},actionButton:{alignItems:"center",justifyContent:"center"}});export{Dialog};export default Dialog;

package/lib/module/components/Modal/Modal.js CHANGED Viewed

	@@ -1 +1 @@
1	- "use strict";import{forwardRef,useCallback,useEffect,useMemo,useRef,useState}from"react";import{AccessibilityInfo,Animated,Dimensions,Easing,Platform,Pressable,Modal as RNModal,StyleSheet,View}from"react-native";import{usePresenceMotion}from"../../hooks/usePresenceMotion.js";import{createAnimatedValue,useTheme}from"../../theme/index.js";import{transparentOf,withAlpha}from"../../utils/color.js";import{smoothCorners}from"../../utils/corners.js";import{resolveHaptic,triggerHaptic}from"../../utils/hapticUtils.js";import{squircleHostRadius}from"../../utils/squircle.js";import{ModalSafeArea,useModalInsets}from"../ModalSafeArea/ModalSafeArea.js";import{SquircleFill,useSquircle}from"../SquircleFill/SquircleFill.js";import{ToastHost}from"../Toast/ToastProvider.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";export const MODAL_DISMISS_GRACE_MS=300;const SCALE_START_VALUE=.9,Modal=forwardRef((e,t)=>{const{visible:s,onRequestClose:i,presentation:r="centered",backdropOpacity:o,backdropPressClose:a=!0,animationDuration:n,~~accessibilityLabel~~:l,hardwareBackPress:u=!0,children:c,contentStyle:d,backdropStyle:m,restoreFocusRef:f,onDismissed:p,haptic:g,testID:b}=e,h=useTheme(),S=usePresenceMotion(),[A,y]=useModalInsets(),v=n??S.duration("default"),x=Dimensions.get("window").height,M=useRef(createAnimatedValue(.9)).current,R=useRef(createAnimatedValue(0)).current,V=useRef(createAnimatedValue(x)).current,j=useRef(createAnimatedValue(0)).current,C=useRef(null),w=useRef(!1),[T,D]=useState(s),_=useMemo(()=>buildStyles(h),[h]),E=useMemo(()=>{const e=h.colors.scrim;return"number"!=typeof o?e:withAlpha(e,o)??e},[h.colors.scrim,o]),k=useMemo(()=>j.interpolate({inputRange:[0,1],outputRange:[transparentOf(E),E]}),[j,E]);useEffect(()=>{s&&D(!0)},[s]),useEffect(()=>{const e=[];if(s&&T){const t=Animated.timing(j,{toValue:1,duration:S.duration("default"),useNativeDriver:!1});if(t.start(),e.push(t),S.reduced){R.setValue(0),V.setValue(0),M.setValue(1);const t=Animated.timing(R,{toValue:1,duration:v,useNativeDriver:!0});t.start(),e.push(t)}else if("bottom"===r){R.setValue(1);const t=Animated.spring(V,{toValue:0,damping:h.motion.spring.gentle.damping,stiffness:h.motion.spring.gentle.stiffness,mass:h.motion.spring.gentle.mass,useNativeDriver:!0});t.start(),e.push(t)}else{const t=Animated.parallel([Animated.spring(M,{toValue:1,damping:h.motion.spring.gentle.damping,stiffness:h.motion.spring.gentle.stiffness,mass:h.motion.spring.gentle.mass,useNativeDriver:!0}),Animated.timing(R,{toValue:1,duration:v,useNativeDriver:!0})]);t.start(),e.push(t)}}else if(T){const t=S.duration("fast"),s=Easing.bezier(...h.motion.ease.accelerate),i=Animated.timing(R,{toValue:0,duration:t,easing:s,useNativeDriver:!0}),o=S.reduced?i:"bottom"===r?Animated.timing(V,{toValue:x,duration:t,easing:s,useNativeDriver:!0}):Animated.parallel([Animated.timing(M,{toValue:.9,duration:t,easing:s,useNativeDriver:!0}),i]),a=Animated.parallel([o,Animated.timing(j,{toValue:0,duration:S.duration("default"),useNativeDriver:!1})]);a.start(({finished:e})=>{e&&(V.setValue(x),D(!1))}),e.push(a)}return()=>e.forEach(e=>e.stop())},[s,T,r,v,M,R,j,V,x,h.motion.spring.gentle.damping,h.motion.spring.gentle.stiffness,h.motion.spring.gentle.mass,S,h.motion.ease.accelerate]),useEffect(()=>{if("web"===Platform.OS)return;let e,t;return s?(e=setTimeout(()=>{C.current&&AccessibilityInfo.sendAccessibilityEvent(C.current,"focus")},150),w.current=!0):w.current&&(w.current=!1,f&&f.current&&(t=setTimeout(()=>{const e=f.current;e&&AccessibilityInfo.sendAccessibilityEvent(e,"focus")},v))),()=>{e&&clearTimeout(e),t&&clearTimeout(t)}},[s,v,f]);const I=useRef(!1);useEffect(()=>{if(s)return void(I.current=!0);if(!I.current)return;if(I.current=!1,!p)return;const e=setTimeout(p,300);return()=>clearTimeout(e)},[s,p]);const N=useCallback(()=>{if(!a)return;const e=resolveHaptic(g,"selection");e&&triggerHaptic(e),i()},[a,i,g]),q=useCallback(()=>{u&&i()},[u,i]),P=useSquircle("bottom"!==r&&"fullScreen"!==r,h.radius.xl),z=useMemo(()=>"fullScreen"===r?[_.fullScreenContent,{backgroundColor:h.colors.surface}]:"bottom"===r?[_.bottomContent,{backgroundColor:h.colors.surface,borderTopLeftRadius:h.radius.xl,borderTopRightRadius:h.radius.xl,...smoothCorners,paddingTop:h.space.lg,paddingHorizontal:h.space.lg,paddingBottom:h.space.lg+A.bottom},h.shadow.modal]:[_.centeredContent,{backgroundColor:h.colors.surface,borderRadius:P.active&&P.size?squircleHostRadius(P.size.width,P.size.height,h.radius.xl):h.radius.xl,...smoothCorners,padding:h.space.xl},h.shadow.modal],[r,h,_,A.bottom,P.active,P.size]),H=useMemo(()=>"bottom"===r?_.bottomWrapper:"fullScreen"===r?_.fullScreenWrapper:_.centeredWrapper,[r,_]),L=useMemo(()=>"bottom"===r?{opacity:R,transform:[{translateY:V}]}:"fullScreen"===r?{opacity:R}:{opacity:R,transform:[{scale:M}]},[r,M,R,V]);return _jsx(RNModal,{visible:T,transparent:!0,statusBarTranslucent:!0,navigationBarTranslucent:!0,animationType:"none",onRequestClose:q,testID:b,children:_jsx(View,{ref:e=>{C.current=e,"function"==typeof t?t(e):t&&(t.current=e)},style:_.root,accessible:!1,accessibilityViewIsModal:!0,accessibilityRole:"alert",accessibilityLabel:l,children:_jsxs(ModalSafeArea,{onInsets:y,children:[_jsxs(Animated.View,{collapsable:!1,style:[StyleSheet.absoluteFill,H,{backgroundColor:k},m],children:[_jsx(Pressable,{style:StyleSheet.absoluteFill,onPress:N,accessibilityRole:"button",accessibilityLabel:"Close modal",disabled:!a}),_jsxs(Animated.View,{style:[z,L,d],onLayout:P.onLayout,pointerEvents:"auto",children:[P.active&&P.size?_jsx(SquircleFill,{width:P.size.width,height:P.size.height,radius:h.radius.xl,fill:h.colors.surface}):null,c]})]}),_jsx(ToastHost,{})]})})})});Modal.displayName="Modal";const buildStyles=e=>StyleSheet.create({root:{flex:1},centeredWrapper:{flex:1,alignItems:"center",justifyContent:"center",paddingHorizontal:e.space.lg},centeredContent:{maxWidth:"90%",width:"90%"},bottomWrapper:{flex:1,justifyContent:"flex-end"},bottomContent:{width:"100%"},fullScreenWrapper:{flex:1},fullScreenContent:{flex:1}});export{Modal};export default Modal;
1	+ "use strict";import{forwardRef,useCallback,useEffect,useMemo,useRef,useState}from"react";import{AccessibilityInfo,Animated,Dimensions,Easing,Platform,Pressable,Modal as RNModal,StyleSheet,View}from"react-native";import{usePresenceMotion}from"../../hooks/usePresenceMotion.js";import{createAnimatedValue,useTheme}from"../../theme/index.js";import{transparentOf,withAlpha}from"../../utils/color.js";import{smoothCorners}from"../../utils/corners.js";import{resolveHaptic,triggerHaptic}from"../../utils/hapticUtils.js";import{squircleHostRadius}from"../../utils/squircle.js";import{ModalSafeArea,useModalInsets}from"../ModalSafeArea/ModalSafeArea.js";import{SquircleFill,useSquircle}from"../SquircleFill/SquircleFill.js";import{ToastHost}from"../Toast/ToastProvider.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";export const MODAL_DISMISS_GRACE_MS=300;const SCALE_START_VALUE=.9,Modal=forwardRef((e,t)=>{const{visible:s,onRequestClose:r,presentation:i="centered",backdropOpacity:o,backdropPressClose:a=!0,animationDuration:n,animateMount:l=!0,accessibilityLabel:u,hardwareBackPress:c=!0,children:d,contentStyle:m,backdropStyle:f,restoreFocusRef:p,onDismissed:g,haptic:b,testID:h}=e,S=useTheme(),A=usePresenceMotion(),[y,v]=useModalInsets(),x=n??A.duration("default"),M=Dimensions.get("window").height,R=useRef(!l&&s),V=R.current,j=useRef(createAnimatedValue(V?1:.9)).current,C=useRef(createAnimatedValue(V?1:0)).current,w=useRef(createAnimatedValue(V?0:M)).current,T=useRef(createAnimatedValue(V?1:0)).current,D=useRef(null),_=useRef(!1),[E,k]=useState(s),I=useMemo(()=>buildStyles(S),[S]),N=useMemo(()=>{const e=S.colors.scrim;return"number"!=typeof o?e:withAlpha(e,o)??e},[S.colors.scrim,o]),q=useMemo(()=>T.interpolate({inputRange:[0,1],outputRange:[transparentOf(N),N]}),[T,N]);useEffect(()=>{s&&k(!0)},[s]),useEffect(()=>{const e=[];if(s&&E&&R.current)R.current=!1;else if(s&&E){const t=Animated.timing(T,{toValue:1,duration:A.duration("default"),useNativeDriver:!1});if(t.start(),e.push(t),A.reduced){C.setValue(0),w.setValue(0),j.setValue(1);const t=Animated.timing(C,{toValue:1,duration:x,useNativeDriver:!0});t.start(),e.push(t)}else if("bottom"===i){C.setValue(1);const t=Animated.spring(w,{toValue:0,damping:S.motion.spring.gentle.damping,stiffness:S.motion.spring.gentle.stiffness,mass:S.motion.spring.gentle.mass,useNativeDriver:!0});t.start(),e.push(t)}else{const t=Animated.parallel([Animated.spring(j,{toValue:1,damping:S.motion.spring.gentle.damping,stiffness:S.motion.spring.gentle.stiffness,mass:S.motion.spring.gentle.mass,useNativeDriver:!0}),Animated.timing(C,{toValue:1,duration:x,useNativeDriver:!0})]);t.start(),e.push(t)}}else if(E){const t=A.duration("fast"),s=Easing.bezier(...S.motion.ease.accelerate),r=Animated.timing(C,{toValue:0,duration:t,easing:s,useNativeDriver:!0}),o=A.reduced?r:"bottom"===i?Animated.timing(w,{toValue:M,duration:t,easing:s,useNativeDriver:!0}):Animated.parallel([Animated.timing(j,{toValue:.9,duration:t,easing:s,useNativeDriver:!0}),r]),a=Animated.parallel([o,Animated.timing(T,{toValue:0,duration:A.duration("default"),useNativeDriver:!1})]);a.start(({finished:e})=>{e&&(w.setValue(M),k(!1))}),e.push(a)}return()=>e.forEach(e=>e.stop())},[s,E,i,x,j,C,T,w,M,S.motion.spring.gentle.damping,S.motion.spring.gentle.stiffness,S.motion.spring.gentle.mass,A,S.motion.ease.accelerate]),useEffect(()=>{if("web"===Platform.OS)return;let e,t;return s?(e=setTimeout(()=>{D.current&&AccessibilityInfo.sendAccessibilityEvent(D.current,"focus")},150),_.current=!0):_.current&&(_.current=!1,p&&p.current&&(t=setTimeout(()=>{const e=p.current;e&&AccessibilityInfo.sendAccessibilityEvent(e,"focus")},x))),()=>{e&&clearTimeout(e),t&&clearTimeout(t)}},[s,x,p]);const P=useRef(!1);useEffect(()=>{if(s)return void(P.current=!0);if(!P.current)return;if(P.current=!1,!g)return;const e=setTimeout(g,300);return()=>clearTimeout(e)},[s,g]);const z=useCallback(()=>{if(!a)return;const e=resolveHaptic(b,"selection");e&&triggerHaptic(e),r()},[a,r,b]),H=useCallback(()=>{c&&r()},[c,r]),L=useSquircle("bottom"!==i&&"fullScreen"!==i,S.radius.xl),F=useMemo(()=>"fullScreen"===i?[I.fullScreenContent,{backgroundColor:S.colors.surface}]:"bottom"===i?[I.bottomContent,{backgroundColor:S.colors.surface,borderTopLeftRadius:S.radius.xl,borderTopRightRadius:S.radius.xl,...smoothCorners,paddingTop:S.space.lg,paddingHorizontal:S.space.lg,paddingBottom:S.space.lg+y.bottom},S.shadow.modal]:[I.centeredContent,{backgroundColor:S.colors.surface,borderRadius:L.active&&L.size?squircleHostRadius(L.size.width,L.size.height,S.radius.xl):S.radius.xl,...smoothCorners,padding:S.space.xl},S.shadow.modal],[i,S,I,y.bottom,L.active,L.size]),W=useMemo(()=>"bottom"===i?I.bottomWrapper:"fullScreen"===i?I.fullScreenWrapper:I.centeredWrapper,[i,I]),O=useMemo(()=>"bottom"===i?{opacity:C,transform:[{translateY:w}]}:"fullScreen"===i?{opacity:C}:{opacity:C,transform:[{scale:j}]},[i,j,C,w]);return _jsx(RNModal,{visible:E,transparent:!0,statusBarTranslucent:!0,navigationBarTranslucent:!0,animationType:"none",onRequestClose:H,testID:h,children:_jsx(View,{ref:e=>{D.current=e,"function"==typeof t?t(e):t&&(t.current=e)},style:I.root,accessible:!1,accessibilityViewIsModal:!0,accessibilityRole:"alert",accessibilityLabel:u,children:_jsxs(ModalSafeArea,{onInsets:v,children:[_jsxs(Animated.View,{collapsable:!1,style:[StyleSheet.absoluteFill,W,{backgroundColor:q},f],children:[_jsx(Pressable,{style:StyleSheet.absoluteFill,onPress:z,accessibilityRole:"button",accessibilityLabel:"Close modal",disabled:!a}),_jsxs(Animated.View,{style:[F,O,m],onLayout:L.onLayout,pointerEvents:"auto",children:[L.active&&L.size?_jsx(SquircleFill,{width:L.size.width,height:L.size.height,radius:S.radius.xl,fill:S.colors.surface}):null,d]})]}),_jsx(ToastHost,{})]})})})});Modal.displayName="Modal";const buildStyles=e=>StyleSheet.create({root:{flex:1},centeredWrapper:{flex:1,alignItems:"center",justifyContent:"center",paddingHorizontal:e.space.lg},centeredContent:{maxWidth:"90%",width:"90%"},bottomWrapper:{flex:1,justifyContent:"flex-end"},bottomContent:{width:"100%"},fullScreenWrapper:{flex:1},fullScreenContent:{flex:1}});export{Modal};export default Modal;

package/lib/module/components/Modal/Modal.meta.js CHANGED Viewed

	@@ -1 +1 @@
1	- "use strict";import{definePhoneMeta}from"../../canvasKit/meta.js";export const meta=definePhoneMeta()({name:"Modal",marker:null,platforms:["phone"],acceptsChildren:!0,props:{visible:{type:"boolean",required:!0,description:"Whether the modal is shown. The parent owns it."},presentation:{type:"enum",values:["centered","bottom","fullScreen"],default:"centered",description:"How the dialog is laid out: a centred card, a sheet anchored to the bottom, or a full screen takeover."},backdropOpacity:{type:"number",description:"Overrides the opacity of the dimmed backdrop for this modal."},backdropPressClose:{type:"boolean",default:!0,description:"Whether tapping the dimmed backdrop closes the modal."},animationDuration:{type:"number",description:"The enter animation length in milliseconds. Without it the theme's normal duration is used."},accessibilityLabel:{type:"string",description:"The name a screen reader gives the dialog."},hardwareBackPress:{type:"boolean",default:!0,description:"Whether the Android back button closes the modal."}},omit:["restoreFocusRef","haptic"],examples:[{id:"Modal.default",title:"Centred dialog",props:{visible:!0,presentation:"centered",accessibilityLabel:"Demo modal"},children:"centered modal"},{id:"Modal.bottom",title:"Bottom sheet",props:{visible:!0,presentation:"bottom",accessibilityLabel:"Demo modal"},children:"bottom modal"},{id:"Modal.fullScreen",title:"Full screen",props:{visible:!0,presentation:"fullScreen",accessibilityLabel:"Demo modal"},children:"fullScreen modal"},{id:"Modal.backdropLocked",title:"Backdrop tap does not close",props:{visible:!0,presentation:"centered",backdropPressClose:!1,accessibilityLabel:"Demo modal"},children:"centered modal"}],usage:{when:["A dialog, confirmation or sheet must sit above the current screen.","A full screen takeover such as onboarding or a media viewer is needed."],whenNot:[{text:"The choice is a list of options.",instead:"OptionSheet"},{text:"A brief message needs no action.",instead:"Toast"}],do:[{note:"Name the dialog with an accessibilityLabel so a screen reader announces what opened.",example:[{component:"Modal",props:{visible:!0,accessibilityLabel:"Delete project"},children:"Delete this project?"}]},{note:"Use the bottom presentation for an action menu.",example:[{component:"Modal",props:{visible:!0,presentation:"bottom"},children:"Choose an action"}]}],dont:[{note:"A dialog with no label opens in silence for a screen reader.",example:[{component:"Modal",props:{visible:!0},children:"Delete this project?"}]},{note:"A full screen takeover for a one-line confirmation hides the page for no reason.",example:[{component:"Modal",props:{visible:!0,presentation:"fullScreen"},children:"Delete this project?"}]}],a11y:["The dialog is marked as a modal view with an alert role and takes its name from accessibilityLabel.","The Android back button closes it unless hardwareBackPress is off, and a screen reader can reach a Close modal button."]}});
1	+ "use strict";import{definePhoneMeta}from"../../canvasKit/meta.js";export const meta=definePhoneMeta()({name:"Modal",marker:null,platforms:["phone"],acceptsChildren:!0,props:{visible:{type:"boolean",required:!0,description:"Whether the modal is shown. The parent owns it."},presentation:{type:"enum",values:["centered","bottom","fullScreen"],default:"centered",description:"How the dialog is laid out: a centred card, a sheet anchored to the bottom, or a full screen takeover."},backdropOpacity:{type:"number",description:"Overrides the opacity of the dimmed backdrop for this modal."},backdropPressClose:{type:"boolean",default:!0,description:"Whether tapping the dimmed backdrop closes the modal."},animationDuration:{type:"number",description:"The enter animation length in milliseconds. Without it the theme's normal duration is used."},animateMount:{type:"boolean",default:!0,description:"Plays the enter animation when the modal is visible as it mounts. Off, it is drawn at rest at once."},accessibilityLabel:{type:"string",description:"The name a screen reader gives the dialog."},hardwareBackPress:{type:"boolean",default:!0,description:"Whether the Android back button closes the modal."}},omit:["restoreFocusRef","haptic"],examples:[{id:"Modal.default",title:"Centred dialog",props:{visible:!0,presentation:"centered",accessibilityLabel:"Demo modal"},children:"centered modal"},{id:"Modal.bottom",title:"Bottom sheet",props:{visible:!0,presentation:"bottom",accessibilityLabel:"Demo modal"},children:"bottom modal"},{id:"Modal.fullScreen",title:"Full screen",props:{visible:!0,presentation:"fullScreen",accessibilityLabel:"Demo modal"},children:"fullScreen modal"},{id:"Modal.backdropLocked",title:"Backdrop tap does not close",props:{visible:!0,presentation:"centered",backdropPressClose:!1,accessibilityLabel:"Demo modal"},children:"centered modal"}],usage:{when:["A dialog, confirmation or sheet must sit above the current screen.","A full screen takeover such as onboarding or a media viewer is needed."],whenNot:[{text:"The choice is a list of options.",instead:"OptionSheet"},{text:"A brief message needs no action.",instead:"Toast"}],do:[{note:"Name the dialog with an accessibilityLabel so a screen reader announces what opened.",example:[{component:"Modal",props:{visible:!0,accessibilityLabel:"Delete project"},children:"Delete this project?"}]},{note:"Use the bottom presentation for an action menu.",example:[{component:"Modal",props:{visible:!0,presentation:"bottom"},children:"Choose an action"}]}],dont:[{note:"A dialog with no label opens in silence for a screen reader.",example:[{component:"Modal",props:{visible:!0},children:"Delete this project?"}]},{note:"A full screen takeover for a one-line confirmation hides the page for no reason.",example:[{component:"Modal",props:{visible:!0,presentation:"fullScreen"},children:"Delete this project?"}]}],a11y:["The dialog is marked as a modal view with an alert role and takes its name from accessibilityLabel.","The Android back button closes it unless hardwareBackPress is off, and a screen reader can reach a Close modal button."]}});

package/lib/module/components/SegmentedControl/SegmentedControl.js CHANGED Viewed

	@@ -1 +1 @@
1	- "use strict";import{forwardRef,useCallback,useEffect,useMemo,useRef,useState}from"react";import{Animated,Pressable,StyleSheet,Text,View}from"react-native";import{useControllableState}from"../../hooks/index.js";import{createAnimatedValue,resolveSegmentedControlSize,useTheme}from"../../theme/index.js";import{resolveHaptic,triggerHaptic}from"../../utils/index.js";import{smoothCorners}from"../../utils/corners.js";import{renderSlotIcon}from"../AppIcon/slotIcon.js";import{FieldLabel,FieldMessage,hasFieldText}from"../FieldBase/index.js";import{SquircleFill,useSquircle}from"../SquircleFill/SquircleFill.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const LABEL_LINE_HEIGHT_RATIO=1.25,SegmentedControl=forwardRef((e,t)=>{const{segments:i,label:s,helperText:l,error:r,value:o,defaultValue:n,onChange:a,size:d="md",fullWidth:c=!0,disabled:u=!1,tone:m="primary",variant:h="segmented",radius:g,labelLines:p=1,haptic:b,accessibilityLabel:f,style:x,containerStyle:y,segmentStyle:S,selectedIndicatorStyle:v,textStyle:C,labelStyle:j,testID:w}=e,[I,L]=useControllableState({value:o,defaultValue:n??i[0]?.value,onChange:a}),_=useTheme(),k=_.components["segmented-control"],F=useMemo(()=>buildStyles(_),[_]),M=useMemo(()=>resolveSegmentedControlSize(_,d),[_,d]),V=p>=2?2:1,z=V>1,R="segmented"===h,T="underline"===h,A="pills"===h,E=R?_.space[k["track-padding"]]:0,H=Math.ceil(1.25M.text)(V-1),q=k["underline-height"],D=_.space[k["pill-inset"]],W="number"==typeof g?g:g?_.radius[g]:void 0,B=W??_.radius.md,P=void 0===W?_.radius.sm:Math.max(W-E,0),N=W??_.radius.pill,O=W??_.radius.none,[G,X]=useState(0),J=useRef(createAnimatedValue(0)).current,K=Math.max(0,i.findIndex(e=>e.value===I)),Q=G>0?(G-2E)/Math.max(i.length,1):0,U=useCallback((e,t)=>{if(t<=0)return;const i=te,s=_.motion.spring.snappy,l=Animated.spring(J,{toValue:i,damping:s.damping,stiffness:s.stiffness,mass:s.mass,overshootClamping:!0,useNativeDriver:!0});return l.start(),l},[_.motion.spring.snappy,J]);useEffect(()=>{if(Q>0){const e=U(K,Q);return()=>e?.stop()}},[K,Q,U]);const Y=useCallback(e=>{const t=e.nativeEvent.layout.width;t!==G&&X(t)},[G])~~,Z=~~useCallback(e=>{if(u)return;if(e.value===I)return;const t=resolveHaptic(b,"selection");t&&triggerHaptic(t),L(e.value)},[u,L,I,b])~~,$=~~R?_.colors.surface:A?_.colors["primary-soft"]:_.colors.primary,ee=R?P:A?N:O,te="neutral"===m?_.colors["text-body"]:_.colors.primary,ie=_.colors["bg-muted"],se=useSquircle(R,B,Y),le=!0===r\|\|hasFieldText(r),re~~=le~~&&!u,oe=_.colors["field-border-error"],ne=_.size.border,ae=hasFieldText(s),de=le?r:l,ce=hasFieldText(de),ue=_jsxs(View,{ref:t,accessibilityRole:"radiogroup",accessibilityLabel:f??("string"==typeof s?s:void 0),testID:w,style:[F.track,{...z?{minHeight:M.height+H}:{height:M.height},opacity:u?.55:1,alignSelf:c?"stretch":"flex-start"},R?{borderRadius:B,...smoothCorners,backgroundColor:se.active?"transparent":ie,padding:E}:T?{borderBottomColor:re?oe:_.colors["border-subtle"],borderBottomWidth:StyleSheet.hairlineWidth}:null,y,x],onLayout:se.onLayout,children:[se.active&&se.size?_jsx(SquircleFill,{width:se.size.width,height:se.size.height,radius:B,fill:ie,stroke:re?oe:void 0,strokeWidth:ne}):null,_jsxs(View,{style:F.row,children:[Q>0?_jsx(Animated.View,{pointerEvents:"none",style:[F.thumb,R?z?{top:0,bottom:0}:{top:0,height:M.height-2*E}:A?{top:D,bottom:D}:{bottom:0,height:q},{width:Q,borderRadius:ee,...smoothCorners,backgroundColor~~:$,~~transform:[{translateX:J}]},v]}):null,i.map(e=>{const t=e.value===I,i=t?te:_.colors["text-subtle"],s=renderSlotIcon(e.icon,{color:i,size:M.icon,selected:t,disabled:u});return _jsxs(Pressable,{onPress:()~~=>Z~~(e),disabled:u,accessibilityRole:"radio",accessibilityLabel:e.label,accessibilityState:{checked:t,selected:t,disabled:u},"aria-checked":t,"aria-disabled":u,style:({pressed:e})=>[F.segment,z?F.segmentMultiline:null,{paddingHorizontal:M["padding-x"],opacity:e&&!t?.7:1},S],children:[s?_jsx(View,{style:F.segmentIcon,children:s}):null,_jsx(Text,{style:[F.segmentLabel,z?F.segmentLabelMultiline:null,{color:i,fontSize:M.text,fontWeight:t?_.weight.semibold:_.weight.medium},C,j],numberOfLines:V,children:e.label})]},String(e.value))})]}),!re\|\|T\|\|se.active?null:_jsx(View,{pointerEvents:"none",style:[StyleSheet.absoluteFill,{borderWidth:ne,borderColor:oe,borderRadius:R?B:N,...smoothCorners}]})]});return ae\|\|ce?_jsxs(View,{style:{alignSelf:c?"stretch":"flex-start"},children:[ae?_jsx(FieldLabel,{size:d,children:s}):null,ue~~,ce~~?_jsx(FieldMessage,{size:d,text:de,error:le}):null]}):ue});SegmentedControl.displayName="SegmentedControl";const buildStyles=e=>StyleSheet.create({track:{flexDirection:"row",alignItems:"stretch",position:"relative"},row:{flex:1,flexDirection:"row",alignItems:"stretch",position:"relative",overflow:"hidden"},thumb:{position:"absolute",left:0},segment:{flex:1,flexDirection:"row",alignItems:"center",justifyContent:"center"},segmentIcon:{marginRight:e.space.xs},segmentMultiline:{paddingVertical:e.space.xs},segmentLabel:{includeFontPadding:!1},segmentLabelMultiline:{flexShrink:1,textAlign:"center"}});export{SegmentedControl};export default SegmentedControl;
1	+ "use strict";import{forwardRef,useCallback,useEffect,useMemo,useRef,useState}from"react";import{Animated,Pressable,StyleSheet,Text,View}from"react-native";import{useControllableState}from"../../hooks/index.js";import{createAnimatedValue,resolveSegmentedControlSize,useTheme}from"../../theme/index.js";import{resolveHaptic,triggerHaptic}from"../../utils/index.js";import{smoothCorners}from"../../utils/corners.js";import{renderSlotIcon}from"../AppIcon/slotIcon.js";import{FieldLabel,FieldMessage,hasFieldText}from"../FieldBase/index.js";import{SquircleFill,useSquircle}from"../SquircleFill/SquircleFill.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const LABEL_LINE_HEIGHT_RATIO=1.25,SegmentedControl=forwardRef((e,t)=>{const{segments:i,label:l,helperText:s,error:r,value:o,defaultValue:n,onChange:a,size:d="md",fullWidth:c=!0,disabled:u=!1,tone:m="primary",variant:h="segmented",radius:g,labelLines:p=1,haptic:b,accessibilityLabel:f,style:x,containerStyle:y,segmentStyle:S,selectedIndicatorStyle:v,textStyle:C,labelStyle:j,testID:w}=e,[I,L]=useControllableState({value:o,defaultValue:n??i[0]?.value,onChange:a}),_=useTheme(),k=_.components["segmented-control"],F=useMemo(()=>buildStyles(_),[_]),V=useMemo(()=>resolveSegmentedControlSize(_,d),[_,d]),M=p>=2?2:1,z=M>1,R="segmented"===h,T="underline"===h,A="pills"===h,E=R?_.space[k["track-padding"]]:0,H=Math.ceil(1.25V.text)(M-1),q=k["underline-height"],D=_.space[k["pill-inset"]],W="number"==typeof g?g:g?_.radius[g]:void 0,B=W??_.radius.md,P=void 0===W?_.radius.sm:Math.max(W-E,0),N=W??_.radius.pill,O=W??_.radius.none,[G,X]=useState(0),J=useRef(createAnimatedValue(0)).current,K=Math.max(0,i.findIndex(e=>e.value===I)),Q=G>0?(G-2E)/Math.max(i.length,1):0,U=useCallback((e,t)=>{if(t<=0)return;const i=te,l=_.motion.spring.snappy,s=Animated.spring(J,{toValue:i,damping:l.damping,stiffness:l.stiffness,mass:l.mass,overshootClamping:!0,useNativeDriver:!0});return s.start(),s},[_.motion.spring.snappy,J]),Y=useRef(null);useEffect(()=>{if(Q<=0)return;const e=null!==Y.current&&Y.current!==K;if(Y.current=K,!e)return void J.setValue(QK);const t=U(K,Q);return()=>t?.stop()},[K,Q,U,J]);const Z=useCallback(e=>{const t=e.nativeEvent.layout.width;t!==G&&X(t)},[G]),$=useCallback(e=>{if(u)return;if(e.value===I)return;const t=resolveHaptic(b,"selection");t&&triggerHaptic(t),L(e.value)},[u,L,I,b]),ee=R?_.colors.surface:A?_.colors["primary-soft"]:_.colors.primary,te=R?P:A?N:O,ie="neutral"===m?_.colors["text-body"]:_.colors.primary,le=_.colors["bg-muted"],se=useSquircle(R,B,Z),re=!0===r\|\|hasFieldText(r),oe=re&&!u,ne=_.colors["field-border-error"],ae=_.size.border,de=hasFieldText(l),ce=re?r:s,ue=hasFieldText(ce),me=_jsxs(View,{ref:t,accessibilityRole:"radiogroup",accessibilityLabel:f??("string"==typeof l?l:void 0),testID:w,style:[F.track,{...z?{minHeight:V.height+H}:{height:V.height},opacity:u?.55:1,alignSelf:c?"stretch":"flex-start"},R?{borderRadius:B,...smoothCorners,backgroundColor:se.active?"transparent":le,padding:E}:T?{borderBottomColor:oe?ne:_.colors["border-subtle"],borderBottomWidth:StyleSheet.hairlineWidth}:null,y,x],onLayout:se.onLayout,children:[se.active&&se.size?_jsx(SquircleFill,{width:se.size.width,height:se.size.height,radius:B,fill:le,stroke:oe?ne:void 0,strokeWidth:ae}):null,_jsxs(View,{style:F.row,children:[Q>0?_jsx(Animated.View,{pointerEvents:"none",style:[F.thumb,R?z?{top:0,bottom:0}:{top:0,height:V.height-2E}:A?{top:D,bottom:D}:{bottom:0,height:q},{width:Q,borderRadius:te,...smoothCorners,backgroundColor:ee,transform:[{translateX:J}]},v]}):null,i.map(e=>{const t=e.value===I,i=t?ie:_.colors["text-subtle"],l=renderSlotIcon(e.icon,{color:i,size:V.icon,selected:t,disabled:u});return _jsxs(Pressable,{onPress:()=>$(e),disabled:u,accessibilityRole:"radio",accessibilityLabel:e.label,accessibilityState:{checked:t,selected:t,disabled:u},"aria-checked":t,"aria-disabled":u,style:({pressed:e})=>[F.segment,z?F.segmentMultiline:null,{paddingHorizontal:V["padding-x"],opacity:e&&!t?.7:1},S],children:[l?_jsx(View,{style:F.segmentIcon,children:l}):null,_jsx(Text,{style:[F.segmentLabel,z?F.segmentLabelMultiline:null,{color:i,fontSize:V.text,fontWeight:t?_.weight.semibold:_.weight.medium},C,j],numberOfLines:M,children:e.label})]},String(e.value))})]}),!oe\|\|T\|\|se.active?null:_jsx(View,{pointerEvents:"none",style:[StyleSheet.absoluteFill,{borderWidth:ae,borderColor:ne,borderRadius:R?B:N,...smoothCorners}]})]});return de\|\|ue?_jsxs(View,{style:{alignSelf:c?"stretch":"flex-start"},children:[de?_jsx(FieldLabel,{size:d,children:l}):null,me,ue?_jsx(FieldMessage,{size:d,text:ce,error:re}):null]}):me});SegmentedControl.displayName="SegmentedControl";const buildStyles=e=>StyleSheet.create({track:{flexDirection:"row",alignItems:"stretch",position:"relative"},row:{flex:1,flexDirection:"row",alignItems:"stretch",position:"relative",overflow:"hidden"},thumb:{position:"absolute",left:0},segment:{flex:1,flexDirection:"row",alignItems:"center",justifyContent:"center"},segmentIcon:{marginRight:e.space.xs},segmentMultiline:{paddingVertical:e.space.xs},segmentLabel:{includeFontPadding:!1},segmentLabelMultiline:{flexShrink:1,textAlign:"center"}});export{SegmentedControl};export default SegmentedControl;

package/lib/module/components/Tabs/Tabs.js CHANGED Viewed

	@@ -1 +1 @@
1	- "use strict";import{forwardRef,useCallback,useEffect,useMemo,useRef,useState}from"react";import{Animated,Pressable,ScrollView,StyleSheet,Text,View}from"react-native";import{createAnimatedValue,resolveSegmentedControlSize,resolveTabsSize,useTheme}from"../../theme/index.js";import{resolveHaptic,triggerHaptic}from"../../utils/index.js";import{smoothCorners}from"../../utils/corners.js";import{renderSlotIcon}from"../AppIcon/slotIcon.js";import{SquircleFill,useSquircle}from"../SquircleFill/SquircleFill.js";import{jsx as _jsx,jsxs as _jsxs,Fragment as _Fragment}from"react/jsx-runtime";const Tabs=forwardRef((e,t)=>{const{tabs:i,activeKey:s,onChange:r,variant:o="underline",radius:a,size:l="md",scrollable:n=!1,align:d="left",style:c,containerStyle:u,tabStyle:m,tabLabelStyle:p,tabIconStyle:b,tabBadgeStyle:g,dividerStyle:h,indicatorStyle:f,progress:y,haptic:x,accessibilityLabel:S,testID:v}=e,w=useTheme(),j=useMemo(()=>buildStyles(w),[w]),C=w.components.tabs,k=useMemo(()=>resolveTabsSize(w,l),[w,l]),z=n?k["scrollable-padding-x"]:k["padding-x"],_=k["padding-y"],R=k.text,T=w.space[C["icon-gap"]],I=k.icon,V=C["underline-height"],L=w.space[C["pill-inset"]],F=C["disabled-opacity"],A=w.space[C["badge-gap"]],H="segmented"===o,M=useMemo(()=>resolveSegmentedControlSize(w,l),[w,l]),P=w.space[C["track-padding"]],q="number"==typeof a?a:a?w.radius[a]:void 0,D=q??w.radius.md,B=void 0===q?w.radius.sm:Math.max(q-P,0),W=q??w.radius.pill,E=q??w.radius.none,N=w.colors["bg-muted"],O=useSquircle(H,D),[U,K]=useState({}),X=useRef(createAnimatedValue(0)).current,G=useRef(createAnimatedValue(0)).current,J=U[s],Q=i.every(e=>void 0!==U[e.key]),Y=void 0!==y&&Q&&i.length>1,Z=useMemo(()=>Y&&y?y.interpolate({inputRange:i.map((e,t)=>t),outputRange:i.map(e=>U[e.key].x),extrapolate:"clamp"}):null,[Y,y,i,U]),$=useMemo(()=>Y&&y?y.interpolate({inputRange:i.map((e,t)=>t),outputRange:i.map(e=>U[e.key].width),extrapolate:"clamp"}):null,[Y,y,i,U]);useEffect(()=>{if(!J)return;if(Y)return;const e=w.motion.spring.snappy,t=Animated.parallel([Animated.spring(X,{toValue:J.x,damping:e.damping,stiffness:e.stiffness,mass:e.mass,overshootClamping:!0,useNativeDriver:!1}),Animated.spring(G,{toValue:J.width,damping:e.damping,stiffness:e.stiffness,mass:e.mass,overshootClamping:!0,useNativeDriver:!1})]);return t.start(),()=>t.stop()},[J,s,X,G,w.motion.spring.snappy,Y]);const ee=useCallback(e=>t=>{const{x:i,width:s}=t.nativeEvent.layout;K(t=>{const r=t[e];return r&&r.x===i&&r.width===s?t:{...t,[e]:{x:i,width:s}}})},[]),te=useCallback(e=>{if(e.disabled)return;if(e.key===s)return;const t=resolveHaptic(x,"selection");t&&triggerHaptic(t),r(e.key)},[s,r,x]),ie="pills"===o,se=_jsx(Animated.View,{pointerEvents:"none",style:[H?j.indicatorThumb:ie?j.indicatorPill:j.indicatorUnderline,H?null:ie?{top:L,bottom:L}:{height:V},{width:$??G,transform:[{translateX:Z??X}],backgroundColor:H?w.colors.surface:ie?w.colors["primary-soft"]:w.colors.primary,borderRadius:H?B:ie?W:E,...smoothCorners},f]}),renderTabs=()=>i.map(e=>{const t=e.key===s,i=!0===e.disabled,r=t?w.colors.primary:w.colors["text-subtle"],o=renderSlotIcon(e.icon,{color:r,size:I,focused:t,disabled:i});return _jsxs(Pressable,{onPress:()=>te(e),onLayout:ee(e.key),disabled:i,accessibilityRole:"tab",accessibilityLabel:e.label,accessibilityState:{selected:t,disabled:i},"aria-selected":t,"aria-disabled":i,android_ripple:H?void 0:{color:w.colors["surface-pressed"],borderless:!1},style:({pressed:e})=>[j.tab,n?null:j.tabFlex,H?{paddingHorizontal:M["padding-x"],height:M.height-2*P}:{paddingHorizontal:z,paddingVertical:_},{opacity:i?F:e&&H&&!t?.7:1,backgroundColor:e&&!H?w.colors["surface-pressed"]:"transparent"},m],children:[o?_jsx(View,{style:[j.tabIcon,{marginRight:T},b],children:o}):null,_jsx(Text,{style:[j.tabLabel,{color:r,fontSize:H?M.text:R,fontWeight:t?w.weight.semibold:w.weight.medium},p],numberOfLines:1,children:e.label}),void 0!==e.badge&&null!==e.badge?_jsx(View,{style:[j.tabBadge,{marginLeft:A,backgroundColor:w.colors["primary-soft"],borderRadius:w.radius.pill,...smoothCorners,paddingHorizontal:w.space.xs},g],children:_jsx(Text,{style:{color:w.colors.primary,fontSize:w.text.xs.size,fontWeight:w.weight.semibold},numberOfLines:1,children:String(e.badge)})}):null]},e.key)}),re={flexDirection:"row",alignItems:"stretch",justifyContent:n?"flex-start":"center"===d?"center":"flex-start",position:"relative",overflow:"hidden"},oe=_jsxs(_Fragment,H?{children:[se,renderTabs()]}:{children:[renderTabs(),se]});return _jsxs(View,{ref:t,style:[j.container,{borderBottomColor:w.colors["border-subtle"],borderBottomWidth:"underline"===o?StyleSheet.hairlineWidth:0},"underline"===o?h:null,H?{padding:P,borderRadius:D,...smoothCorners,backgroundColor:O.active?"transparent":N}:null,c,u],onLayout:O.onLayout,accessibilityRole:"tablist",accessibilityLabel:S,testID:v,children:[O.active&&O.size?_jsx(SquircleFill,{width:O.size.width,height:O.size.height,radius:D,fill:N}):null,n?_jsx(ScrollView,{horizontal:!0,showsHorizontalScrollIndicator:!1,contentContainerStyle:[re],keyboardShouldPersistTaps:"handled",children:oe}):_jsx(View,{style:re,children:oe})]})});Tabs.displayName="Tabs";const buildStyles=e=>StyleSheet.create({container:{width:"100%",position:"relative"},tab:{flexDirection:"row",alignItems:"center",justifyContent:"center"},tabFlex:{flex:1},tabIcon:{},tabLabel:{includeFontPadding:!1,flexShrink:1},tabBadge:{minWidth:18,alignItems:"center",justifyContent:"center"},indicatorUnderline:{position:"absolute",left:0,bottom:0},indicatorPill:{position:"absolute",left:0,zIndex:-1},indicatorThumb:{position:"absolute",left:0,top:0,bottom:0}});export{Tabs};export default Tabs;
1	+ "use strict";import{forwardRef,useCallback,useEffect,useMemo,useRef,useState}from"react";import{Animated,Pressable,ScrollView,StyleSheet,Text,View}from"react-native";import{createAnimatedValue,resolveSegmentedControlSize,resolveTabsSize,useTheme}from"../../theme/index.js";import{resolveHaptic,triggerHaptic}from"../../utils/index.js";import{smoothCorners}from"../../utils/corners.js";import{renderSlotIcon}from"../AppIcon/slotIcon.js";import{SquircleFill,useSquircle}from"../SquircleFill/SquircleFill.js";import{jsx as _jsx,jsxs as _jsxs,Fragment as _Fragment}from"react/jsx-runtime";const Tabs=forwardRef((e,t)=>{const{tabs:i,activeKey:r,onChange:s,variant:o="underline",radius:a,size:l="md",scrollable:n=!1,align:d="left",style:c,containerStyle:u,tabStyle:m,tabLabelStyle:p,tabIconStyle:b,tabBadgeStyle:g,dividerStyle:h,indicatorStyle:f,progress:y,haptic:x,accessibilityLabel:S,testID:v}=e,w=useTheme(),j=useMemo(()=>buildStyles(w),[w]),C=w.components.tabs,k=useMemo(()=>resolveTabsSize(w,l),[w,l]),z=n?k["scrollable-padding-x"]:k["padding-x"],R=k["padding-y"],V=k.text,_=w.space[C["icon-gap"]],T=k.icon,I=C["underline-height"],L=w.space[C["pill-inset"]],F=C["disabled-opacity"],A=w.space[C["badge-gap"]],H="segmented"===o,M=useMemo(()=>resolveSegmentedControlSize(w,l),[w,l]),P=w.space[C["track-padding"]],q="number"==typeof a?a:a?w.radius[a]:void 0,D=q??w.radius.md,B=void 0===q?w.radius.sm:Math.max(q-P,0),W=q??w.radius.pill,E=q??w.radius.none,N=w.colors["bg-muted"],O=useSquircle(H,D),[U,K]=useState({}),X=useRef(createAnimatedValue(0)).current,G=useRef(createAnimatedValue(0)).current,J=U[r],Q=i.every(e=>void 0!==U[e.key]),Y=void 0!==y&&Q&&i.length>1,Z=useMemo(()=>Y&&y?y.interpolate({inputRange:i.map((e,t)=>t),outputRange:i.map(e=>U[e.key].x),extrapolate:"clamp"}):null,[Y,y,i,U]),$=useMemo(()=>Y&&y?y.interpolate({inputRange:i.map((e,t)=>t),outputRange:i.map(e=>U[e.key].width),extrapolate:"clamp"}):null,[Y,y,i,U]),ee=useRef(null);useEffect(()=>{if(!J)return;if(Y)return;const e=null!==ee.current&&ee.current!==r;if(ee.current=r,!e)return X.setValue(J.x),void G.setValue(J.width);const t=w.motion.spring.snappy,i=Animated.parallel([Animated.spring(X,{toValue:J.x,damping:t.damping,stiffness:t.stiffness,mass:t.mass,overshootClamping:!0,useNativeDriver:!1}),Animated.spring(G,{toValue:J.width,damping:t.damping,stiffness:t.stiffness,mass:t.mass,overshootClamping:!0,useNativeDriver:!1})]);return i.start(),()=>i.stop()},[J,r,X,G,w.motion.spring.snappy,Y]);const te=useCallback(e=>t=>{const{x:i,width:r}=t.nativeEvent.layout;K(t=>{const s=t[e];return s&&s.x===i&&s.width===r?t:{...t,[e]:{x:i,width:r}}})},[]),ie=useCallback(e=>{if(e.disabled)return;if(e.key===r)return;const t=resolveHaptic(x,"selection");t&&triggerHaptic(t),s(e.key)},[r,s,x]),re="pills"===o,se=_jsx(Animated.View,{pointerEvents:"none",style:[H?j.indicatorThumb:re?j.indicatorPill:j.indicatorUnderline,H?null:re?{top:L,bottom:L}:{height:I},{width:$??G,transform:[{translateX:Z??X}],backgroundColor:H?w.colors.surface:re?w.colors["primary-soft"]:w.colors.primary,borderRadius:H?B:re?W:E,...smoothCorners},f]}),renderTabs=()=>i.map(e=>{const t=e.key===r,i=!0===e.disabled,s=t?w.colors.primary:w.colors["text-subtle"],o=renderSlotIcon(e.icon,{color:s,size:T,focused:t,disabled:i});return _jsxs(Pressable,{onPress:()=>ie(e),onLayout:te(e.key),disabled:i,accessibilityRole:"tab",accessibilityLabel:e.label,accessibilityState:{selected:t,disabled:i},"aria-selected":t,"aria-disabled":i,android_ripple:H?void 0:{color:w.colors["surface-pressed"],borderless:!1},style:({pressed:e})=>[j.tab,n?null:j.tabFlex,H?{paddingHorizontal:M["padding-x"],height:M.height-2*P}:{paddingHorizontal:z,paddingVertical:R},{opacity:i?F:e&&H&&!t?.7:1,backgroundColor:e&&!H?w.colors["surface-pressed"]:"transparent"},m],children:[o?_jsx(View,{style:[j.tabIcon,{marginRight:_},b],children:o}):null,_jsx(Text,{style:[j.tabLabel,{color:s,fontSize:H?M.text:V,fontWeight:t?w.weight.semibold:w.weight.medium},p],numberOfLines:1,children:e.label}),void 0!==e.badge&&null!==e.badge?_jsx(View,{style:[j.tabBadge,{marginLeft:A,backgroundColor:w.colors["primary-soft"],borderRadius:w.radius.pill,...smoothCorners,paddingHorizontal:w.space.xs},g],children:_jsx(Text,{style:{color:w.colors.primary,fontSize:w.text.xs.size,fontWeight:w.weight.semibold},numberOfLines:1,children:String(e.badge)})}):null]},e.key)}),oe={flexDirection:"row",alignItems:"stretch",justifyContent:n?"flex-start":"center"===d?"center":"flex-start",position:"relative",overflow:"hidden"},ae=_jsxs(_Fragment,H?{children:[se,renderTabs()]}:{children:[renderTabs(),se]});return _jsxs(View,{ref:t,style:[j.container,{borderBottomColor:w.colors["border-subtle"],borderBottomWidth:"underline"===o?StyleSheet.hairlineWidth:0},"underline"===o?h:null,H?{padding:P,borderRadius:D,...smoothCorners,backgroundColor:O.active?"transparent":N}:null,c,u],onLayout:O.onLayout,accessibilityRole:"tablist",accessibilityLabel:S,testID:v,children:[O.active&&O.size?_jsx(SquircleFill,{width:O.size.width,height:O.size.height,radius:D,fill:N}):null,n?_jsx(ScrollView,{horizontal:!0,showsHorizontalScrollIndicator:!1,contentContainerStyle:[oe],keyboardShouldPersistTaps:"handled",children:ae}):_jsx(View,{style:oe,children:ae})]})});Tabs.displayName="Tabs";const buildStyles=e=>StyleSheet.create({container:{width:"100%",position:"relative"},tab:{flexDirection:"row",alignItems:"center",justifyContent:"center"},tabFlex:{flex:1},tabIcon:{},tabLabel:{includeFontPadding:!1,flexShrink:1},tabBadge:{minWidth:18,alignItems:"center",justifyContent:"center"},indicatorUnderline:{position:"absolute",left:0,bottom:0},indicatorPill:{position:"absolute",left:0,zIndex:-1},indicatorThumb:{position:"absolute",left:0,top:0,bottom:0}});export{Tabs};export default Tabs;

package/lib/typescript/commonjs/components/BottomNavigation/BottomNavigation.d.ts CHANGED Viewed

@@ -73,7 +73,12 @@ export interface TabConfig {
  * the extra one going left when the count is odd.
  */
 export interface BottomNavigationCenterAction {
-    /** The button's accessible name. Never drawn. */
+    /**
+     * Text under the button (its circle, or `content`), and the button's
+     * accessible name. The bar's `showLabels` hides it, as it hides the tab
+     * labels; drawn, it makes the cell taller and the button stays centred over
+     * its label.
+     */
     label: string;
     onPress: () => void;
     /**
@@ -128,8 +133,9 @@ export interface BottomNavigationProps {
     onChange: (tabKey: string) => void;
     haptic?: HapticType | false;
     /**
-     * Show the text label under each icon. `expand` only ever labels the
-     * active tab, and `false` hides that one too.
+     * Show the text label under each icon, and under a centre action's button.
+     * `expand` only ever labels the active tab, and `false` hides that one
+     * too.
      */
     showLabels?: boolean;
     variant?: BottomNavigationVariant;

package/lib/typescript/commonjs/components/BottomSheet/BottomSheet.d.ts CHANGED Viewed

@@ -127,6 +127,13 @@ export interface BottomSheetProps {
      *   more), `'sheet'` on a phone.
      */
     presentation?: BottomSheetPresentation;
+    /**
+     * Whether a sheet that opens as it mounts (an `index` of 0 or more on the
+     * first render) slides up into place. When false it is drawn at its snap
+     * point at once, and a re-measured host moves it without a spring, until
+     * its first close; later opens slide as usual. Default true.
+     */
+    animateMount?: boolean;
     handleIndicatorStyle?: StyleProp<ViewStyle>;
     containerStyle?: StyleProp<ViewStyle>;
     /**

package/lib/typescript/commonjs/components/ChoiceGroup/ChoiceGroup.d.ts CHANGED Viewed

@@ -125,7 +125,7 @@ interface BaseChoiceGroupProps<T = ChoiceOption> {
     max?: number;
     testID?: string;
 }
-interface SingleChoiceGroupProps<T = ChoiceOption> extends BaseChoiceGroupProps<T> {
+export interface SingleChoiceGroupProps<T = ChoiceOption> extends BaseChoiceGroupProps<T> {
     selectionMode?: "single";
     /** Controlled selected value. */
     value?: RadioValue;
@@ -133,7 +133,7 @@ interface SingleChoiceGroupProps<T = ChoiceOption> extends BaseChoiceGroupProps<
     defaultValue?: RadioValue;
     onChange?: (value: RadioValue) => void;
 }
-interface MultipleChoiceGroupProps<T = ChoiceOption> extends BaseChoiceGroupProps<T> {
+export interface MultipleChoiceGroupProps<T = ChoiceOption> extends BaseChoiceGroupProps<T> {
     /**
      * `'multiple'`: pressing an option toggles it. Options are exposed as
      * checkboxes (the group has no radiogroup role), and `value`,

package/lib/typescript/commonjs/components/ChoiceGroup/index.d.ts CHANGED Viewed

@@ -1,3 +1,3 @@
-export type { ChoiceGroupDirection, ChoiceGroupIndicatorPosition, ChoiceGroupProps, ChoiceGroupSelectionMode, ChoiceGroupSize, ChoiceGroupVariant, ChoiceOption, ChoiceOptionState, } from "./ChoiceGroup";
+export type { ChoiceGroupDirection, ChoiceGroupIndicatorPosition, ChoiceGroupProps, ChoiceGroupSelectionMode, ChoiceGroupSize, ChoiceGroupVariant, ChoiceOption, ChoiceOptionState, MultipleChoiceGroupProps, SingleChoiceGroupProps, } from "./ChoiceGroup";
 export { ChoiceGroup, default } from "./ChoiceGroup";
 //# sourceMappingURL=index.d.ts.map

package/lib/typescript/commonjs/components/Modal/Modal.d.ts CHANGED Viewed

@@ -15,6 +15,12 @@ export interface ModalProps {
     backdropOpacity?: number;
     backdropPressClose?: boolean;
     animationDuration?: number;
+    /**
+     * Whether a modal that is visible as it mounts plays its enter animation.
+     * When false it is drawn at rest at once, scrim included; later opens and
+     * every close animate as usual. Default true.
+     */
+    animateMount?: boolean;
     accessibilityLabel?: string;
     hardwareBackPress?: boolean;
     children: React.ReactNode;

package/lib/typescript/commonjs/components/Select/Select.d.ts CHANGED Viewed

@@ -131,12 +131,12 @@ interface BaseSelectProps<T = SelectOption> {
     selectedOptionTextStyle?: StyleProp<TextStyle>;
     testID?: string;
 }
-interface SingleSelectProps<T = SelectOption> extends BaseSelectProps<T> {
+export interface SingleSelectProps<T = SelectOption> extends BaseSelectProps<T> {
     multi?: false;
     value?: SelectValue;
     onChange: (value: SelectValue) => void;
 }
-interface MultiSelectProps<T = SelectOption> extends BaseSelectProps<T> {
+export interface MultiSelectProps<T = SelectOption> extends BaseSelectProps<T> {
     multi: true;
     value?: SelectValue[];
     onChange: (value: SelectValue[]) => void;

package/lib/typescript/commonjs/components/Select/index.d.ts CHANGED Viewed

@@ -1,3 +1,3 @@
-export type { SelectOption, SelectProps, SelectSize, SelectValue } from "./Select";
+export type { MultiSelectProps, SelectOption, SelectProps, SelectSize, SelectValue, SingleSelectProps } from "./Select";
 export { default, Select } from "./Select";
 //# sourceMappingURL=index.d.ts.map

package/lib/typescript/commonjs/components/StatTile/StatTile.d.ts CHANGED Viewed

@@ -19,8 +19,8 @@ export interface StatTileTrend {
 export interface StatTileProps {
     /** What the figure measures, drawn small above it. */
     label: string;
-    /** The figure. A string or number is drawn in the heading style; a node is drawn as is. */
-    value: string | number | ReactNode;
+    /** The figure, always given. A string or number is drawn in the heading style; a node is drawn as is. */
+    value: NonNullable<ReactNode>;
     /** Leading icon in a tinted circle: an AppIcon name, `{ name, variant }`, a render fn or any node. */
     icon?: SlotIcon;
     /** Iconsax style for `icon` given as a name. Default `'linear'`. */

package/lib/typescript/commonjs/components/index.d.ts CHANGED Viewed

@@ -38,7 +38,7 @@ export type { CheckboxProps, CheckboxSize, CheckboxTone } from "./Checkbox";
 export { Checkbox } from "./Checkbox";
 export type { ChipProps, ChipSelectionMode, ChipSize, ChipTone, ChipVariant } from "./Chip";
 export { Chip } from "./Chip";
-export type { ChoiceGroupDirection, ChoiceGroupIndicatorPosition, ChoiceGroupProps, ChoiceGroupSelectionMode, ChoiceGroupSize, ChoiceGroupVariant, ChoiceOption, ChoiceOptionState, } from "./ChoiceGroup";
+export type { ChoiceGroupDirection, ChoiceGroupIndicatorPosition, ChoiceGroupProps, ChoiceGroupSelectionMode, ChoiceGroupSize, ChoiceGroupVariant, ChoiceOption, ChoiceOptionState, MultipleChoiceGroupProps, SingleChoiceGroupProps, } from "./ChoiceGroup";
 export { ChoiceGroup } from "./ChoiceGroup";
 export type { ComposerProps } from "./Composer";
 export { Composer } from "./Composer";
@@ -148,7 +148,7 @@ export type { SectionHeaderProps, SectionHeaderVariant } from "./SectionHeader";
 export { SectionHeader } from "./SectionHeader";
 export type { SegmentedControlProps, SegmentedControlRadius, SegmentedControlSize, SegmentedControlTone, SegmentedControlVariant, SegmentIcon, SegmentIconState, SegmentItem, SegmentValue, } from "./SegmentedControl";
 export { SegmentedControl } from "./SegmentedControl";
-export type { SelectOption, SelectProps, SelectSize, SelectValue } from "./Select";
+export type { MultiSelectProps, SelectOption, SelectProps, SelectSize, SelectValue, SingleSelectProps } from "./Select";
 export { Select } from "./Select";
 export type { SignatureMode, SignaturePadLabels, SignaturePadProps, SignaturePadRef, SignaturePoint, SignatureStroke, } from "./SignaturePad";
 export { SignaturePad } from "./SignaturePad";

package/lib/typescript/module/components/BottomNavigation/BottomNavigation.d.ts CHANGED Viewed

@@ -73,7 +73,12 @@ export interface TabConfig {
  * the extra one going left when the count is odd.
  */
 export interface BottomNavigationCenterAction {
-    /** The button's accessible name. Never drawn. */
+    /**
+     * Text under the button (its circle, or `content`), and the button's
+     * accessible name. The bar's `showLabels` hides it, as it hides the tab
+     * labels; drawn, it makes the cell taller and the button stays centred over
+     * its label.
+     */
     label: string;
     onPress: () => void;
     /**
@@ -128,8 +133,9 @@ export interface BottomNavigationProps {
     onChange: (tabKey: string) => void;
     haptic?: HapticType | false;
     /**
-     * Show the text label under each icon. `expand` only ever labels the
-     * active tab, and `false` hides that one too.
+     * Show the text label under each icon, and under a centre action's button.
+     * `expand` only ever labels the active tab, and `false` hides that one
+     * too.
      */
     showLabels?: boolean;
     variant?: BottomNavigationVariant;

package/lib/typescript/module/components/BottomSheet/BottomSheet.d.ts CHANGED Viewed

@@ -127,6 +127,13 @@ export interface BottomSheetProps {
      *   more), `'sheet'` on a phone.
      */
     presentation?: BottomSheetPresentation;
+    /**
+     * Whether a sheet that opens as it mounts (an `index` of 0 or more on the
+     * first render) slides up into place. When false it is drawn at its snap
+     * point at once, and a re-measured host moves it without a spring, until
+     * its first close; later opens slide as usual. Default true.
+     */
+    animateMount?: boolean;
     handleIndicatorStyle?: StyleProp<ViewStyle>;
     containerStyle?: StyleProp<ViewStyle>;
     /**

package/lib/typescript/module/components/ChoiceGroup/ChoiceGroup.d.ts CHANGED Viewed

@@ -125,7 +125,7 @@ interface BaseChoiceGroupProps<T = ChoiceOption> {
     max?: number;
     testID?: string;
 }
-interface SingleChoiceGroupProps<T = ChoiceOption> extends BaseChoiceGroupProps<T> {
+export interface SingleChoiceGroupProps<T = ChoiceOption> extends BaseChoiceGroupProps<T> {
     selectionMode?: "single";
     /** Controlled selected value. */
     value?: RadioValue;
@@ -133,7 +133,7 @@ interface SingleChoiceGroupProps<T = ChoiceOption> extends BaseChoiceGroupProps<
     defaultValue?: RadioValue;
     onChange?: (value: RadioValue) => void;
 }
-interface MultipleChoiceGroupProps<T = ChoiceOption> extends BaseChoiceGroupProps<T> {
+export interface MultipleChoiceGroupProps<T = ChoiceOption> extends BaseChoiceGroupProps<T> {
     /**
      * `'multiple'`: pressing an option toggles it. Options are exposed as
      * checkboxes (the group has no radiogroup role), and `value`,

package/lib/typescript/module/components/ChoiceGroup/index.d.ts CHANGED Viewed

@@ -1,3 +1,3 @@
-export type { ChoiceGroupDirection, ChoiceGroupIndicatorPosition, ChoiceGroupProps, ChoiceGroupSelectionMode, ChoiceGroupSize, ChoiceGroupVariant, ChoiceOption, ChoiceOptionState, } from "./ChoiceGroup.js";
+export type { ChoiceGroupDirection, ChoiceGroupIndicatorPosition, ChoiceGroupProps, ChoiceGroupSelectionMode, ChoiceGroupSize, ChoiceGroupVariant, ChoiceOption, ChoiceOptionState, MultipleChoiceGroupProps, SingleChoiceGroupProps, } from "./ChoiceGroup.js";
 export { ChoiceGroup, default } from "./ChoiceGroup.js";
 //# sourceMappingURL=index.d.ts.map

package/lib/typescript/module/components/Modal/Modal.d.ts CHANGED Viewed

@@ -15,6 +15,12 @@ export interface ModalProps {
     backdropOpacity?: number;
     backdropPressClose?: boolean;
     animationDuration?: number;
+    /**
+     * Whether a modal that is visible as it mounts plays its enter animation.
+     * When false it is drawn at rest at once, scrim included; later opens and
+     * every close animate as usual. Default true.
+     */
+    animateMount?: boolean;
     accessibilityLabel?: string;
     hardwareBackPress?: boolean;
     children: React.ReactNode;

package/lib/typescript/module/components/Select/Select.d.ts CHANGED Viewed

@@ -131,12 +131,12 @@ interface BaseSelectProps<T = SelectOption> {
     selectedOptionTextStyle?: StyleProp<TextStyle>;
     testID?: string;
 }
-interface SingleSelectProps<T = SelectOption> extends BaseSelectProps<T> {
+export interface SingleSelectProps<T = SelectOption> extends BaseSelectProps<T> {
     multi?: false;
     value?: SelectValue;
     onChange: (value: SelectValue) => void;
 }
-interface MultiSelectProps<T = SelectOption> extends BaseSelectProps<T> {
+export interface MultiSelectProps<T = SelectOption> extends BaseSelectProps<T> {
     multi: true;
     value?: SelectValue[];
     onChange: (value: SelectValue[]) => void;

package/lib/typescript/module/components/Select/index.d.ts CHANGED Viewed

@@ -1,3 +1,3 @@
-export type { SelectOption, SelectProps, SelectSize, SelectValue } from "./Select.js";
+export type { MultiSelectProps, SelectOption, SelectProps, SelectSize, SelectValue, SingleSelectProps } from "./Select.js";
 export { default, Select } from "./Select.js";
 //# sourceMappingURL=index.d.ts.map

package/lib/typescript/module/components/StatTile/StatTile.d.ts CHANGED Viewed

@@ -19,8 +19,8 @@ export interface StatTileTrend {
 export interface StatTileProps {
     /** What the figure measures, drawn small above it. */
     label: string;
-    /** The figure. A string or number is drawn in the heading style; a node is drawn as is. */
-    value: string | number | ReactNode;
+    /** The figure, always given. A string or number is drawn in the heading style; a node is drawn as is. */
+    value: NonNullable<ReactNode>;
     /** Leading icon in a tinted circle: an AppIcon name, `{ name, variant }`, a render fn or any node. */
     icon?: SlotIcon;
     /** Iconsax style for `icon` given as a name. Default `'linear'`. */

package/lib/typescript/module/components/index.d.ts CHANGED Viewed

@@ -38,7 +38,7 @@ export type { CheckboxProps, CheckboxSize, CheckboxTone } from "./Checkbox/index
 export { Checkbox } from "./Checkbox/index.js";
 export type { ChipProps, ChipSelectionMode, ChipSize, ChipTone, ChipVariant } from "./Chip/index.js";
 export { Chip } from "./Chip/index.js";
-export type { ChoiceGroupDirection, ChoiceGroupIndicatorPosition, ChoiceGroupProps, ChoiceGroupSelectionMode, ChoiceGroupSize, ChoiceGroupVariant, ChoiceOption, ChoiceOptionState, } from "./ChoiceGroup/index.js";
+export type { ChoiceGroupDirection, ChoiceGroupIndicatorPosition, ChoiceGroupProps, ChoiceGroupSelectionMode, ChoiceGroupSize, ChoiceGroupVariant, ChoiceOption, ChoiceOptionState, MultipleChoiceGroupProps, SingleChoiceGroupProps, } from "./ChoiceGroup/index.js";
 export { ChoiceGroup } from "./ChoiceGroup/index.js";
 export type { ComposerProps } from "./Composer/index.js";
 export { Composer } from "./Composer/index.js";
@@ -148,7 +148,7 @@ export type { SectionHeaderProps, SectionHeaderVariant } from "./SectionHeader/i
 export { SectionHeader } from "./SectionHeader/index.js";
 export type { SegmentedControlProps, SegmentedControlRadius, SegmentedControlSize, SegmentedControlTone, SegmentedControlVariant, SegmentIcon, SegmentIconState, SegmentItem, SegmentValue, } from "./SegmentedControl/index.js";
 export { SegmentedControl } from "./SegmentedControl/index.js";
-export type { SelectOption, SelectProps, SelectSize, SelectValue } from "./Select/index.js";
+export type { MultiSelectProps, SelectOption, SelectProps, SelectSize, SelectValue, SingleSelectProps } from "./Select/index.js";
 export { Select } from "./Select/index.js";
 export type { SignatureMode, SignaturePadLabels, SignaturePadProps, SignaturePadRef, SignaturePoint, SignatureStroke, } from "./SignaturePad/index.js";
 export { SignaturePad } from "./SignaturePad/index.js";

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@webority/mobile-ui",
-  "version": "0.93.0",
+  "version": "0.94.1",
   "description": "Beautiful, animated, accessible React Native components, theme and form engine for Webority projects.",
   "keywords": [
     "react-native",
@@ -84,8 +84,8 @@
     "react-native-safe-area-context": ">=5.4.0",
     "react-native-svg": ">=15.0.0",
     "react-native-worklets": ">=0.10.0",
-    "@webority/canvas-kit": "0.93.0",
-    "@webority/mobile-core": "0.93.0"
+    "@webority/canvas-kit": "0.94.1",
+    "@webority/mobile-core": "0.94.1"
   },
   "peerDependenciesMeta": {
     "@webority/canvas-kit": {
@@ -146,9 +146,9 @@
     "react-test-renderer": "19.2.8",
     "rimraf": "6.1.3",
     "typescript": "5.9.3",
-    "@webority/canvas-kit": "0.93.0",
-    "@webority/mobile-core": "0.93.0",
-    "@webority/tokens": "0.93.0",
+    "@webority/mobile-core": "0.94.1",
+    "@webority/tokens": "0.94.1",
+    "@webority/canvas-kit": "0.94.1",
     "@webority/mobile-dev": "0.0.0"
   },
   "scripts": {