@webority/mobile-ui 0.18.0 → 0.18.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.
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=exports.BottomNavigation=void 0;var _react=_interopRequireWildcard(require("react")),_reactNative=require("react-native"),_reactNativeSafeAreaContext=require("react-native-safe-area-context"),_useReducedMotion=require("../../hooks/useReducedMotion.js"),_index=require("../../theme/index.js"),_index2=require("../../utils/index.js"),_corners=require("../../utils/corners.js"),_shadows=require("../../utils/shadows.js"),_index3=require("../AppIcon/index.js"),_useScreenReaderEnabled=require("./useScreenReaderEnabled.js"),_jsxRuntime=require("react/jsx-runtime");function _interopRequireWildcard(e,t){if("function"==typeof WeakMap)var i=new WeakMap,n=new WeakMap;return(_interopRequireWildcard=function(e,t){if(!t&&e&&e.__esModule)return e;var r,a,o={__proto__:null,default:e};if(null===e||"object"!=typeof e&&"function"!=typeof e)return o;if(r=t?n:i){if(r.has(e))return r.get(e);r.set(e,o)}for(const t in e)"default"!==t&&{}.hasOwnProperty.call(e,t)&&((a=(r=Object.defineProperty)&&Object.getOwnPropertyDescriptor(e,t))&&(a.get||a.set)?r(o,t,a):o[t]=e[t]);return o})(e,t)}const DEFAULT_ICON_SIZE=18,DEFAULT_LABEL_MAX_FONT_SCALE=1.2,ICON_WRAP_AIR=4,PILL_AIR=8,DEFAULT_PILL_MAX_WIDTH=64,TILE_MAX_WIDTH=96,DEFAULT_PILL_INSET=16,DEFAULT_UNDERLINE_HEIGHT=3,DEFAULT_FLOATING_MARGIN=16,DEFAULT_FLOATING_RADIUS=28,DEFAULT_BUBBLE_SIZE=48,DEFAULT_BUBBLE_LIFT=14,DEFAULT_CENTER_SIZE=48,DEFAULT_CENTER_ICON_SIZE=24,CENTER_KEY="__webority_center_action__",TAB_PADDING_VERTICAL=6,BAR_PADDING_HORIZONTAL=4,BAR_PADDING_TOP=6,BAR_PADDING_TOP_BUBBLE=8,FLOATING_BAR_PADDING_VERTICAL=6,FLOATING_BAR_PADDING_HORIZONTAL=8,EXPANDED_FLEX=1.5,SOLID_INACTIVE_OPACITY=.7,TILE_INSET=2,TILE_LABEL_GAP=2,formatBadge=e=>null==e||!1===e?null:!0===e||"·"===e?{text:"",isDot:!0}:"number"==typeof e?e<=0?null:{text:e>99?"99+":String(e),isDot:!1}:"string"==typeof e?0===e.length?null:{text:e,isDot:!1}:null,badgeAccessibilitySuffix=e=>null==e||!1===e?"":"number"==typeof e?e>0?`, ${e} unread`:"":!0===e||"·"===e?", new updates":"string"==typeof e&&e.length>0?`, ${e}`:"",BottomNavigation=exports.BottomNavigation=(0,_react.forwardRef)((e,t)=>{const{tabs:i,centerAction:n,activeTab:r,onChange:a,haptic:o="selection",showLabels:l=!0,variant:s="pill",indicatorPosition:c="bottom",radius:d,indicatorRadius:u="auto",elevation:_,iconSize:h,marginHorizontal:p,marginVertical:g,paddingHorizontal:m,paddingVertical:b,border:f,minimizeOnScroll:y=!1,scrollDirection:x="idle",accessory:R,style:v,indicatorStyle:N,labelStyle:A,labelMaxFontScale:I,testID:j}=e,E=(0,_index.useTheme)(),S=(0,_reactNativeSafeAreaContext.useSafeAreaInsets)(),w=(0,_react.useMemo)(()=>buildStyles(E),[E]),L=E.components.bottomNavigation,T=h??L?.iconSize??18,D=L?.pillHeight??T+4+8,C=L?.pillMaxWidth??64,M=L?.pillInset??16,B=L?.floatingMargin??16,P=L?.floatingRadius??28,k=L?.bubbleSize??48,V=L?.bubbleLift??14,z=(0,_useReducedMotion.useReducedMotion)(),H=(0,_useScreenReaderEnabled.useScreenReaderEnabled)(y),[F,W]=_react.default.useState(null);(0,_react.useEffect)(()=>{null!==F&&F!==x&&W(null)},[F,x]);const O=y&&!H&&"down"===x&&null===F,[U,q]=_react.default.useState(O);(0,_react.useEffect)(()=>{U!==O&&(z||"web"===_reactNative.Platform.OS||_reactNative.LayoutAnimation.configureNext(_reactNative.LayoutAnimation.Presets.easeInEaseOut),q(O))},[U,O,z]);const G="function"==typeof R?R({minimized:U}):R,$=null!=G&&!1!==G,X=U&&$,[Z,Y]=_react.default.useState(0),K=$&&!X?Z+E.spacing.xs:0,J="tile"===s,Q="floating"===s||J,ee="bubble"===s,te="expand"===s,ie="solid"===s,ne="pill"===s||Q||ie,re=Math.max(0,i.findIndex(e=>e.key===r)),[ae,oe]=_react.default.useState(0),[le,se]=_react.default.useState(0),ce=n?Math.ceil(i.length/2):i.length,de=i.length+(n?1:0),[ue,he]=_react.default.useState({width:0,height:0}),pe=n?.size??48,ge=void 0!==n?.gap,me=Math.max(0,n?.gap??0),be=ge?(ue.width||pe)+2*me:0,fe=ge?i.length>0?Math.max(0,ae-be)/i.length:0:de>0?ae/de:0,ye=ge?be:fe,xe=(0,_react.useRef)((0,_index.createAnimatedValue)(re)).current,Re=(0,_react.useRef)({}),ve=(0,_react.useRef)({});i.forEach(e=>{Re.current[e.key]||(Re.current[e.key]=new _reactNative.Animated.Value(1)),ve.current[e.key]||(ve.current[e.key]=(0,_index.createAnimatedValue)(e.key===r?1:0))});const Ne=fe>0?J?Math.min(fe-4,96):Math.min(fe-M,C):0,Ae=fe>0?(fe-Ne)/2:0,Ie=fe>0?(fe-k)/2:0,hasLabel=e=>l&&!U&&!1!==e.showLabel&&e.label.trim().length>0,je=i[re],Ee=je&&!hasLabel(je)&&le>0?le/2:6+(T+4)/2,Se=Ee-V-k/2,we=Math.max(0,le-4),Le=J?2:Ee-D/2,Te=(0,_react.useRef)(re);(0,_react.useEffect)(()=>{if(Te.current===re)return;Te.current=re;const e=_reactNative.Animated.spring(xe,{toValue:re,tension:120,friction:14,useNativeDriver:!0});return e.start(),()=>e.stop()},[re,xe]);const De=Math.max(1,i.length-1),Ce=(0,_react.useMemo)(()=>{const e=[],t=[];for(let i=0;i<=De;i++)e.push(i),t.push(i<ce?i*fe:i*fe+ye);return xe.interpolate({inputRange:e,outputRange:t})},[xe,De,ce,fe,ye]),Me=i.map(e=>e.key).join(" "),Be=ee||te;(0,_react.useEffect)(()=>{const e=Me.split(" ").flatMap(e=>{const t=e===r?1:0,i=ve.current[e];return i?Be?[_reactNative.Animated.spring(i,{toValue:t,tension:140,friction:13,useNativeDriver:!1})]:(i.setValue(t),[]):[]});if(0===e.length)return;const t=_reactNative.Animated.parallel(e);return t.start(),()=>t.stop()},[r,Me,Be]);const popIcon=e=>{_reactNative.Animated.sequence([_reactNative.Animated.timing(e,{toValue:1.15,duration:120,useNativeDriver:!0}),_reactNative.Animated.spring(e,{toValue:1,tension:200,friction:8,useNativeDriver:!0})]).start()},Pe=(0,_react.useRef)(new _reactNative.Animated.Value(1)).current,{colors:ke}=E,Ve=ie?ke.primary:ke.background.elevated,ze=ie?ke.onPrimary:ke.primary,He=ie?ke.onPrimary:J?ke.text.primary:ke.text.tertiary,Fe=ie?ke.onPrimary:ke.primaryMuted,We=ie?ke.primary:ee?ke.onPrimary:ze,Oe=p??B,Ue=g??(Q?B:0),qe=Ue>0,Ge=b??(Q?6:ee?8:6),$e=m??(Q?8:4),Xe=qe?Ge:Math.max(Ge,S.bottom),Ze=qe?Math.max(Ue,S.bottom):0,Ye="full"===d,Ke=Q?le+K+2*Ge+2*_reactNative.StyleSheet.hairlineWidth:le+K+Ge+Xe,Je=Ye?le>0?Ke/2:E.radius.full:d??L?.borderRadius??(J?E.radius.full:Q?P:0),Qe=void 0!==d||void 0!==L?.borderRadius,activeBgRadius=(e,t)=>"number"==typeof u?Math.max(0,Math.min(u,e/2)):"auto"===u&&Qe?Math.min(Je,e/2):t,et="underline"===s?Math.max($e,Ye&&0===le?0:Je):$e,tt=_??"none",it=E.shadows[tt],nt="none"===tt?null:(0,_shadows.supportsBoxShadow)()?{boxShadow:(0,_shadows.toBoxShadow)(it)}:it,rt=f?_reactNative.StyleSheet.hairlineWidth:0,at=ie?ke.primary:ke.border.primary,ot=n?.lift??0,lt=Ge+rt+K,st=n&&le>0?Math.max(0,(ue.height||pe)/2+ot-le/2-lt):0,ct=n?(0,_jsxRuntime.jsx)(_reactNative.View,{style:[w.centerCell,ge?{flex:0,marginHorizontal:me}:null],pointerEvents:"box-none",children:(0,_jsxRuntime.jsx)(_reactNative.Pressable,{onPress:()=>{if(!n)return;const e=n.haptic??o;!1!==e&&(0,_index2.triggerHaptic)(e),popIcon(Pe),n.onPress()},onLayout:e=>{const{width:t,height:i}=e.nativeEvent.layout;he(e=>e.width===t&&e.height===i?e:{width:t,height:i})},accessibilityRole:"button",accessibilityLabel:n.label,hitSlop:{top:6,bottom:6,left:6,right:6},style:({pressed:e})=>[{top:-ot},e?{opacity:.85}:null],testID:n.testID??(j?`${j}-center`:void 0),children:n.content?(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{style:{transform:[{scale:Pe}]},children:n.content}):(0,_jsxRuntime.jsx)(_reactNative.View,{style:[w.centerCircle,{width:pe,height:pe,borderRadius:pe/2,..._corners.smoothCorners,backgroundColor:n.color??ke.primary}],children:(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{style:{transform:[{scale:Pe}]},children:(0,_index3.renderSlotIcon)(n.icon??"add",{color:n.iconColor??ke.onPrimary,size:n.iconSize??24,disabled:!1})})})})},CENTER_KEY):null,dt=$?(0,_jsxRuntime.jsx)(_reactNative.View,{style:X?w.accessoryInline:w.accessoryStacked,onLayout:e=>Y(e.nativeEvent.layout.height),testID:j?`${j}-accessory`:void 0,children:G}):null,ut=(0,_jsxRuntime.jsxs)(_reactNative.View,{style:X?[w.tabRow,w.tabRowInline]:w.tabRow,onLayout:e=>{const{width:t,height:i}=e.nativeEvent.layout;oe(t),se(i)},children:[ne&&Ne>0&&(!J||we>0)?(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{pointerEvents:"none",style:[w.pill,{width:Ne,height:J?we:D,left:Ae,top:Le,backgroundColor:Fe,borderRadius:J?activeBgRadius(we,we/2):activeBgRadius(D,E.radius.full),..._corners.smoothCorners,transform:[{translateX:Ce}]},N]}):null,ee&&fe>0?(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{pointerEvents:"none",style:[w.bubble,E.shadows.md,{width:k,height:k,borderRadius:k/2,..._corners.smoothCorners,left:Ie,top:Se,backgroundColor:ke.primary,borderColor:ke.background.elevated,transform:[{translateX:Ce}]},N]}):null,(_t=i.map(e=>{const t=e.key===r,i=t?ze:He,n=t?We:He,l="string"==typeof e.icon?{name:e.icon,variant:"bold"}:e.icon,s=t?e.activeIcon??l:e.icon,c=Re.current[e.key],d=ve.current[e.key],u=formatBadge(e.badge??null),_=badgeAccessibilitySuffix(e.badge??null),h=ie&&!t?.7:1,p=ee&&t||ie?ke.primary:ke.background.elevated,g=hasLabel(e),m=g&&(!te||t),b=(0,_jsxRuntime.jsxs)(_reactNative.Animated.View,{style:[w.iconWrap,{width:T+4,height:T+4,opacity:h,transform:[{scale:c}]}],children:[(0,_index3.renderSlotIcon)(s,{color:n,size:T,focused:t,disabled:!1}),u?(0,_jsxRuntime.jsx)(_reactNative.View,{style:[u.isDot?w.badgeDot:w.badgePill,{backgroundColor:ke.error,borderColor:p}],children:u.isDot?null:(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[w.badgeText,{color:ke.onError}],numberOfLines:1,children:u.text})}):null]}),f=ee?(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{style:{top:d.interpolate({inputRange:[0,1],outputRange:[0,-V]})},children:b}):b,y=m?(0,_jsxRuntime.jsx)(_reactNative.Animated.Text,{numberOfLines:1,maxFontSizeMultiplier:I??E.maxFontSizeMultiplier??1.2,style:[w.label,te?w.labelInline:null,{color:i,opacity:te?d:h,fontWeight:t?E.typography.fontWeight.semibold:E.typography.fontWeight.normal},A],children:e.label}):null,R=(0,_jsxRuntime.jsx)(_reactNative.Pressable,{onPress:()=>(e=>{U&&W(x),e.key!==r&&!1!==o&&(0,_index2.triggerHaptic)(o);const t=Re.current[e.key];t&&popIcon(t),a(e.key)})(e),accessibilityRole:"tab",accessibilityState:{selected:t},"aria-selected":t,accessibilityLabel:`${e.label}${_}`,accessibilityHint:`Switches to ${e.label}`,hitSlop:{top:6,bottom:6,left:6,right:6},style:({pressed:e})=>[w.tab,J?w.tabTile:null,e?{opacity:.85}:null],testID:j?`${j}-tab-${e.key}`:void 0,children:te?(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[w.expandPill,{height:D,paddingHorizontal:t&&g?E.spacing.md:Math.max(0,(D-(T+4))/2)}],children:[(0,_jsxRuntime.jsx)(_reactNative.View,{pointerEvents:"none",style:[w.expandFill,{borderRadius:activeBgRadius(D,D/2),..._corners.smoothCorners,backgroundColor:t?ke.primaryMuted:"transparent"},t?N:null]}),f,y]}):(0,_jsxRuntime.jsxs)(_jsxRuntime.Fragment,{children:[f,y]})},e.key);return te?(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{style:{flex:d.interpolate({inputRange:[0,1],outputRange:[1,g?1.5:1]})},children:R},e.key):R}),ct?[..._t.slice(0,ce),ct,..._t.slice(ce)]:_t),"underline"===s&&fe>0?(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{pointerEvents:"none",style:[w.underline,"top"===c?w.underlineTop:w.underlineBottom,"top"===c?{top:-Ge-K}:{bottom:-Ge},{width:fe,height:L?.underlineHeight??3,backgroundColor:ke.primary,transform:[{translateX:Ce}]},N]}):null]});var _t;return(0,_jsxRuntime.jsx)(_reactNative.View,{ref:t,testID:j,accessibilityRole:"tablist",style:[w.outer,{paddingHorizontal:Oe,paddingTop:Math.max(Ue,st),paddingBottom:Ze},v],children:(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[Q?w.floatingBar:w.dockedBar,X?w.barInline:null,nt,{backgroundColor:Ve,borderColor:at,borderRadius:Je,..._corners.smoothCorners},Q?{borderWidth:rt,paddingHorizontal:$e,paddingVertical:Ge}:{borderTopWidth:rt,borderBottomWidth:rt,borderLeftWidth:rt,borderRightWidth:rt,paddingHorizontal:et,paddingTop:Ge,paddingBottom:Xe}],children:[dt,ut]})})});BottomNavigation.displayName="BottomNavigation";const buildStyles=e=>_reactNative.StyleSheet.create({outer:{backgroundColor:"transparent"},dockedBar:{paddingHorizontal:4},floatingBar:{paddingVertical:6,paddingHorizontal:8},tabRow:{flexDirection:"row",alignItems:"stretch",position:"relative"},tabRowInline:{flex:1},barInline:{flexDirection:"row",alignItems:"center"},accessoryStacked:{marginBottom:e.spacing.xs},accessoryInline:{flexShrink:0,marginRight:e.spacing.xs},tab:{flex:1,minHeight:44,alignItems:"center",justifyContent:"center",paddingVertical:6,gap:4},tabTile:{paddingVertical:8,gap:2},centerCell:{flex:1,minHeight:44,alignItems:"center",justifyContent:"center"},centerCircle:{alignItems:"center",justifyContent:"center"},iconWrap:{alignItems:"center",justifyContent:"center",position:"relative"},label:{fontSize:e.typography.fontSize.xs,lineHeight:e.typography.fontSize.xs*e.typography.lineHeight.tight,textAlign:"center",includeFontPadding:!1},labelInline:{fontSize:e.typography.fontSize.sm,lineHeight:e.typography.fontSize.sm*e.typography.lineHeight.tight,flexShrink:1,includeFontPadding:!1},expandPill:{flexDirection:"row",alignItems:"center",justifyContent:"center",gap:e.spacing.xs},expandFill:{position:"absolute",top:0,right:0,bottom:0,left:0,overflow:"hidden"},pill:{position:"absolute",left:0},bubble:{position:"absolute",left:0,borderWidth:3},underline:{position:"absolute",left:0,height:3},underlineBottom:{borderTopLeftRadius:2,borderTopRightRadius:2,..._corners.smoothCorners},underlineTop:{borderBottomLeftRadius:2,borderBottomRightRadius:2,..._corners.smoothCorners},badgePill:{position:"absolute",top:-4,right:-8,minWidth:18,height:18,borderRadius:9,..._corners.smoothCorners,paddingHorizontal:4,paddingVertical:2,alignItems:"center",justifyContent:"center",borderWidth:1.5},badgeDot:{position:"absolute",top:-2,right:-2,width:10,height:10,borderRadius:5,..._corners.smoothCorners,borderWidth:1.5},badgeText:{fontSize:10,fontWeight:"700",lineHeight:12,textAlign:"center",includeFontPadding:!1}});var _default=exports.default=BottomNavigation;
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=exports.BottomNavigation=void 0;var _react=_interopRequireWildcard(require("react")),_reactNative=require("react-native"),_reactNativeSafeAreaContext=require("react-native-safe-area-context"),_useReducedMotion=require("../../hooks/useReducedMotion.js"),_index=require("../../theme/index.js"),_index2=require("../../utils/index.js"),_corners=require("../../utils/corners.js"),_shadows=require("../../utils/shadows.js"),_index3=require("../AppIcon/index.js"),_useScreenReaderEnabled=require("./useScreenReaderEnabled.js"),_jsxRuntime=require("react/jsx-runtime");function _interopRequireWildcard(e,t){if("function"==typeof WeakMap)var i=new WeakMap,n=new WeakMap;return(_interopRequireWildcard=function(e,t){if(!t&&e&&e.__esModule)return e;var r,a,o={__proto__:null,default:e};if(null===e||"object"!=typeof e&&"function"!=typeof e)return o;if(r=t?n:i){if(r.has(e))return r.get(e);r.set(e,o)}for(const t in e)"default"!==t&&{}.hasOwnProperty.call(e,t)&&((a=(r=Object.defineProperty)&&Object.getOwnPropertyDescriptor(e,t))&&(a.get||a.set)?r(o,t,a):o[t]=e[t]);return o})(e,t)}const DEFAULT_ICON_SIZE=18,DEFAULT_LABEL_MAX_FONT_SCALE=1.2,ICON_WRAP_AIR=4,PILL_AIR=8,DEFAULT_PILL_MAX_WIDTH=64,TILE_MAX_WIDTH=96,DEFAULT_PILL_INSET=16,DEFAULT_UNDERLINE_HEIGHT=3,DEFAULT_FLOATING_MARGIN=16,DEFAULT_FLOATING_RADIUS=28,DEFAULT_BUBBLE_SIZE=48,DEFAULT_BUBBLE_LIFT=14,DEFAULT_CENTER_SIZE=48,DEFAULT_CENTER_ICON_SIZE=24,CENTER_KEY="__webority_center_action__",TAB_PADDING_VERTICAL=6,BAR_PADDING_HORIZONTAL=4,BAR_PADDING_TOP=6,BAR_PADDING_TOP_BUBBLE=8,FLOATING_BAR_PADDING_VERTICAL=6,FLOATING_BAR_PADDING_HORIZONTAL=8,EXPANDED_FLEX=1.5,SOLID_INACTIVE_OPACITY=.7,TILE_INSET=2,TILE_LABEL_GAP=2,formatBadge=e=>null==e||!1===e?null:!0===e||"·"===e?{text:"",isDot:!0}:"number"==typeof e?e<=0?null:{text:e>99?"99+":String(e),isDot:!1}:"string"==typeof e?0===e.length?null:{text:e,isDot:!1}:null,badgeAccessibilitySuffix=e=>null==e||!1===e?"":"number"==typeof e?e>0?`, ${e} unread`:"":!0===e||"·"===e?", new updates":"string"==typeof e&&e.length>0?`, ${e}`:"",BottomNavigation=exports.BottomNavigation=(0,_react.forwardRef)((e,t)=>{const{tabs:i,centerAction:n,activeTab:r,onChange:a,haptic:o="selection",showLabels:l=!0,variant:s="pill",indicatorPosition:c="bottom",radius:d,indicatorRadius:u="auto",elevation:_,iconSize:h,marginHorizontal:p,marginVertical:m,paddingHorizontal:g,paddingVertical:b,border:f,minimizeOnScroll:y=!1,scrollDirection:x="idle",accessory:R,style:v,indicatorStyle:N,labelStyle:A,labelMaxFontScale:I,testID:j}=e,E=(0,_index.useTheme)(),S=(0,_reactNativeSafeAreaContext.useSafeAreaInsets)(),w=(0,_react.useMemo)(()=>buildStyles(E),[E]),L=E.components.bottomNavigation,T=h??L?.iconSize??18,D=L?.pillHeight??T+4+8,C=L?.pillMaxWidth??64,M=L?.pillInset??16,B=L?.floatingMargin??16,P=L?.floatingRadius??28,k=L?.bubbleSize??48,V=L?.bubbleLift??14,z=(0,_useReducedMotion.useReducedMotion)(),H=(0,_useScreenReaderEnabled.useScreenReaderEnabled)(y),[F,W]=_react.default.useState(null);(0,_react.useEffect)(()=>{null!==F&&F!==x&&W(null)},[F,x]);const O=y&&!H&&"down"===x&&null===F,[U,q]=_react.default.useState(O);(0,_react.useEffect)(()=>{U!==O&&(z||"web"===_reactNative.Platform.OS||_reactNative.LayoutAnimation.configureNext(_reactNative.LayoutAnimation.Presets.easeInEaseOut),q(O))},[U,O,z]);const G="function"==typeof R?R({minimized:U}):R,$=null!=G&&!1!==G,X=U&&$,[Z,Y]=_react.default.useState(0),K=$&&!X?Z+E.spacing.xs:0,J="tile"===s,Q="floating"===s||J,ee="bubble"===s,te="expand"===s,ie="solid"===s,ne="pill"===s||Q||ie,re=Math.max(0,i.findIndex(e=>e.key===r)),[ae,oe]=_react.default.useState(0),[le,se]=_react.default.useState(0),ce=n?Math.ceil(i.length/2):i.length,de=i.length+(n?1:0),[ue,he]=_react.default.useState({width:0,height:0}),pe=n?.size??48,me=void 0!==n?.gap,ge=Math.max(0,n?.gap??0),be=me?(ue.width||pe)+2*ge:0,fe=me?i.length>0?Math.max(0,ae-be)/i.length:0:de>0?ae/de:0,ye=me?be:fe,xe=(0,_react.useRef)((0,_index.createAnimatedValue)(re)).current,Re=(0,_react.useRef)({}),ve=(0,_react.useRef)({});i.forEach(e=>{Re.current[e.key]||(Re.current[e.key]=new _reactNative.Animated.Value(1)),ve.current[e.key]||(ve.current[e.key]=(0,_index.createAnimatedValue)(e.key===r?1:0))});const Ne=fe>0?J?Math.min(fe-4,96):Math.min(fe-M,C):0,Ae=fe>0?(fe-Ne)/2:0,Ie=fe>0?(fe-k)/2:0,hasLabel=e=>l&&!U&&!1!==e.showLabel&&e.label.trim().length>0,je=i[re],Ee=je&&!hasLabel(je)&&le>0?le/2:6+(T+4)/2,Se=Ee-V-k/2,we=Math.max(0,le-4),Le=J?2:Ee-D/2,Te=(0,_react.useRef)(re);(0,_react.useEffect)(()=>{if(Te.current===re)return;Te.current=re;const e=_reactNative.Animated.spring(xe,{toValue:re,tension:120,friction:14,useNativeDriver:!0});return e.start(),()=>e.stop()},[re,xe]);const De=Math.max(1,i.length-1),Ce=(0,_react.useMemo)(()=>{const e=[],t=[];for(let i=0;i<=De;i++)e.push(i),t.push(i<ce?i*fe:i*fe+ye);return xe.interpolate({inputRange:e,outputRange:t})},[xe,De,ce,fe,ye]),Me=i.map(e=>e.key).join(" "),Be=ee||te;(0,_react.useEffect)(()=>{const e=Me.split(" ").flatMap(e=>{const t=e===r?1:0,i=ve.current[e];return i?Be?[_reactNative.Animated.spring(i,{toValue:t,tension:140,friction:13,useNativeDriver:!1})]:(i.setValue(t),[]):[]});if(0===e.length)return;const t=_reactNative.Animated.parallel(e);return t.start(),()=>t.stop()},[r,Me,Be]);const popIcon=e=>{_reactNative.Animated.sequence([_reactNative.Animated.timing(e,{toValue:1.15,duration:120,useNativeDriver:!0}),_reactNative.Animated.spring(e,{toValue:1,tension:200,friction:8,useNativeDriver:!0})]).start()},Pe=(0,_react.useRef)(new _reactNative.Animated.Value(1)).current,{colors:ke}=E,Ve=ie?ke.primary:ke.background.elevated,ze=ie?ke.onPrimary:ke.primary,He=ie?ke.onPrimary:J?ke.text.primary:ke.text.tertiary,Fe=ie?ke.onPrimary:ke.primaryMuted,We=ie?ke.primary:ee?ke.onPrimary:ze,Oe=p??B,Ue=m??(Q?B:0),qe=Ue>0,Ge=b??(Q?6:ee?8:6),$e=g??(Q?8:4),Xe=qe?Ge:Math.max(Ge,S.bottom),Ze=qe?Math.max(Ue,S.bottom>0?S.bottom+E.spacing.sm:0):0,Ye="full"===d,Ke=Q?le+K+2*Ge+2*_reactNative.StyleSheet.hairlineWidth:le+K+Ge+Xe,Je=Ye?le>0?Ke/2:E.radius.full:d??L?.borderRadius??(J?E.radius.full:Q?P:0),Qe=void 0!==d||void 0!==L?.borderRadius,activeBgRadius=(e,t)=>"number"==typeof u?Math.max(0,Math.min(u,e/2)):"auto"===u&&Qe?Math.min(Je,e/2):t,et="underline"===s?Math.max($e,Ye&&0===le?0:Je):$e,tt=_??"none",it=E.shadows[tt],nt="none"===tt?null:(0,_shadows.supportsBoxShadow)()?{boxShadow:(0,_shadows.toBoxShadow)(it)}:it,rt=f?_reactNative.StyleSheet.hairlineWidth:0,at=ie?ke.primary:ke.border.primary,ot=n?.lift??0,lt=Ge+rt+K,st=n&&le>0?Math.max(0,(ue.height||pe)/2+ot-le/2-lt):0,ct=n?(0,_jsxRuntime.jsx)(_reactNative.View,{style:[w.centerCell,me?{flex:0,marginHorizontal:ge}:null],pointerEvents:"box-none",children:(0,_jsxRuntime.jsx)(_reactNative.Pressable,{onPress:()=>{if(!n)return;const e=n.haptic??o;!1!==e&&(0,_index2.triggerHaptic)(e),popIcon(Pe),n.onPress()},onLayout:e=>{const{width:t,height:i}=e.nativeEvent.layout;he(e=>e.width===t&&e.height===i?e:{width:t,height:i})},accessibilityRole:"button",accessibilityLabel:n.label,hitSlop:{top:6,bottom:6,left:6,right:6},style:({pressed:e})=>[{top:-ot},e?{opacity:.85}:null],testID:n.testID??(j?`${j}-center`:void 0),children:n.content?(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{style:{transform:[{scale:Pe}]},children:n.content}):(0,_jsxRuntime.jsx)(_reactNative.View,{style:[w.centerCircle,{width:pe,height:pe,borderRadius:pe/2,..._corners.smoothCorners,backgroundColor:n.color??ke.primary}],children:(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{style:{transform:[{scale:Pe}]},children:(0,_index3.renderSlotIcon)(n.icon??"add",{color:n.iconColor??ke.onPrimary,size:n.iconSize??24,disabled:!1})})})})},CENTER_KEY):null,dt=$?(0,_jsxRuntime.jsx)(_reactNative.View,{style:X?w.accessoryInline:w.accessoryStacked,onLayout:e=>Y(e.nativeEvent.layout.height),testID:j?`${j}-accessory`:void 0,children:G}):null,ut=(0,_jsxRuntime.jsxs)(_reactNative.View,{style:X?[w.tabRow,w.tabRowInline]:w.tabRow,onLayout:e=>{const{width:t,height:i}=e.nativeEvent.layout;oe(t),se(i)},children:[ne&&Ne>0&&(!J||we>0)?(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{pointerEvents:"none",style:[w.pill,{width:Ne,height:J?we:D,left:Ae,top:Le,backgroundColor:Fe,borderRadius:J?activeBgRadius(we,we/2):activeBgRadius(D,E.radius.full),..._corners.smoothCorners,transform:[{translateX:Ce}]},N]}):null,ee&&fe>0?(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{pointerEvents:"none",style:[w.bubble,E.shadows.md,{width:k,height:k,borderRadius:k/2,..._corners.smoothCorners,left:Ie,top:Se,backgroundColor:ke.primary,borderColor:ke.background.elevated,transform:[{translateX:Ce}]},N]}):null,(_t=i.map(e=>{const t=e.key===r,i=t?ze:He,n=t?We:He,l="string"==typeof e.icon?{name:e.icon,variant:"bold"}:e.icon,s=t?e.activeIcon??l:e.icon,c=Re.current[e.key],d=ve.current[e.key],u=formatBadge(e.badge??null),_=badgeAccessibilitySuffix(e.badge??null),h=ie&&!t?.7:1,p=ee&&t||ie?ke.primary:ke.background.elevated,m=hasLabel(e),g=m&&(!te||t),b=(0,_jsxRuntime.jsxs)(_reactNative.Animated.View,{style:[w.iconWrap,{width:T+4,height:T+4,opacity:h,transform:[{scale:c}]}],children:[(0,_index3.renderSlotIcon)(s,{color:n,size:T,focused:t,disabled:!1}),u?(0,_jsxRuntime.jsx)(_reactNative.View,{style:[u.isDot?w.badgeDot:w.badgePill,{backgroundColor:ke.error,borderColor:p}],children:u.isDot?null:(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[w.badgeText,{color:ke.onError}],numberOfLines:1,children:u.text})}):null]}),f=ee?(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{style:{top:d.interpolate({inputRange:[0,1],outputRange:[0,-V]})},children:b}):b,y=g?(0,_jsxRuntime.jsx)(_reactNative.Animated.Text,{numberOfLines:1,maxFontSizeMultiplier:I??E.maxFontSizeMultiplier??1.2,style:[w.label,te?w.labelInline:null,{color:i,opacity:te?d:h,fontWeight:t?E.typography.fontWeight.semibold:E.typography.fontWeight.normal},A],children:e.label}):null,R=(0,_jsxRuntime.jsx)(_reactNative.Pressable,{onPress:()=>(e=>{U&&W(x),e.key!==r&&!1!==o&&(0,_index2.triggerHaptic)(o);const t=Re.current[e.key];t&&popIcon(t),a(e.key)})(e),accessibilityRole:"tab",accessibilityState:{selected:t},"aria-selected":t,accessibilityLabel:`${e.label}${_}`,accessibilityHint:`Switches to ${e.label}`,hitSlop:{top:6,bottom:6,left:6,right:6},style:({pressed:e})=>[w.tab,J?w.tabTile:null,e?{opacity:.85}:null],testID:j?`${j}-tab-${e.key}`:void 0,children:te?(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[w.expandPill,{height:D,paddingHorizontal:t&&m?E.spacing.md:Math.max(0,(D-(T+4))/2)}],children:[(0,_jsxRuntime.jsx)(_reactNative.View,{pointerEvents:"none",style:[w.expandFill,{borderRadius:activeBgRadius(D,D/2),..._corners.smoothCorners,backgroundColor:t?ke.primaryMuted:"transparent"},t?N:null]}),f,y]}):(0,_jsxRuntime.jsxs)(_jsxRuntime.Fragment,{children:[f,y]})},e.key);return te?(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{style:{flex:d.interpolate({inputRange:[0,1],outputRange:[1,m?1.5:1]})},children:R},e.key):R}),ct?[..._t.slice(0,ce),ct,..._t.slice(ce)]:_t),"underline"===s&&fe>0?(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{pointerEvents:"none",style:[w.underline,"top"===c?w.underlineTop:w.underlineBottom,"top"===c?{top:-Ge-K}:{bottom:-Ge},{width:fe,height:L?.underlineHeight??3,backgroundColor:ke.primary,transform:[{translateX:Ce}]},N]}):null]});var _t;return(0,_jsxRuntime.jsx)(_reactNative.View,{ref:t,testID:j,accessibilityRole:"tablist",style:[w.outer,{paddingHorizontal:Oe,paddingTop:Math.max(Ue,st),paddingBottom:Ze},v],children:(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[Q?w.floatingBar:w.dockedBar,X?w.barInline:null,nt,{backgroundColor:Ve,borderColor:at,borderRadius:Je,..._corners.smoothCorners},Q?{borderWidth:rt,paddingHorizontal:$e,paddingVertical:Ge}:{borderTopWidth:rt,borderBottomWidth:rt,borderLeftWidth:rt,borderRightWidth:rt,paddingHorizontal:et,paddingTop:Ge,paddingBottom:Xe}],children:[dt,ut]})})});BottomNavigation.displayName="BottomNavigation";const buildStyles=e=>_reactNative.StyleSheet.create({outer:{backgroundColor:"transparent"},dockedBar:{paddingHorizontal:4},floatingBar:{paddingVertical:6,paddingHorizontal:8},tabRow:{flexDirection:"row",alignItems:"stretch",position:"relative"},tabRowInline:{flex:1},barInline:{flexDirection:"row",alignItems:"center"},accessoryStacked:{marginBottom:e.spacing.xs},accessoryInline:{flexShrink:0,marginRight:e.spacing.xs},tab:{flex:1,minHeight:44,alignItems:"center",justifyContent:"center",paddingVertical:6,gap:4},tabTile:{paddingVertical:8,gap:2},centerCell:{flex:1,minHeight:44,alignItems:"center",justifyContent:"center"},centerCircle:{alignItems:"center",justifyContent:"center"},iconWrap:{alignItems:"center",justifyContent:"center",position:"relative"},label:{fontSize:e.typography.fontSize.xs,lineHeight:e.typography.fontSize.xs*e.typography.lineHeight.tight,textAlign:"center",includeFontPadding:!1},labelInline:{fontSize:e.typography.fontSize.sm,lineHeight:e.typography.fontSize.sm*e.typography.lineHeight.tight,flexShrink:1,includeFontPadding:!1},expandPill:{flexDirection:"row",alignItems:"center",justifyContent:"center",gap:e.spacing.xs},expandFill:{position:"absolute",top:0,right:0,bottom:0,left:0,overflow:"hidden"},pill:{position:"absolute",left:0},bubble:{position:"absolute",left:0,borderWidth:3},underline:{position:"absolute",left:0,height:3},underlineBottom:{borderTopLeftRadius:2,borderTopRightRadius:2,..._corners.smoothCorners},underlineTop:{borderBottomLeftRadius:2,borderBottomRightRadius:2,..._corners.smoothCorners},badgePill:{position:"absolute",top:-4,right:-8,minWidth:18,height:18,borderRadius:9,..._corners.smoothCorners,paddingHorizontal:4,paddingVertical:2,alignItems:"center",justifyContent:"center",borderWidth:1.5},badgeDot:{position:"absolute",top:-2,right:-2,width:10,height:10,borderRadius:5,..._corners.smoothCorners,borderWidth:1.5},badgeText:{fontSize:10,fontWeight:"700",lineHeight:12,textAlign:"center",includeFontPadding:!1}});var _default=exports.default=BottomNavigation;
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=exports.Chip=void 0;var _react=require("react"),_reactNative=require("react-native"),_usePressAnimation=require("../../hooks/usePressAnimation.js"),_index=require("../../theme/index.js"),_color=require("../../utils/color.js"),_corners=require("../../utils/corners.js"),_hapticUtils=require("../../utils/hapticUtils.js"),_slotIcon=require("../AppIcon/slotIcon.js"),_index2=require("../Skeleton/index.js"),_jsxRuntime=require("react/jsx-runtime");const toneFor=(e,r)=>{switch(r){case"primary":return{base:e.colors.primaryMuted,on:e.colors.primary,ink:e.colors.toneText.primary,border:e.colors.primary,selectedBg:e.colors.primaryMuted,selectedOn:e.colors.primary,selectedInk:e.colors.toneText.primary,selectedBorder:e.colors.primary};case"success":return{base:e.colors.background.tertiary,on:e.colors.success,ink:e.colors.toneText.success,border:e.colors.success,selectedBg:e.colors.primaryMuted,selectedOn:e.colors.primary,selectedInk:e.colors.toneText.primary,selectedBorder:e.colors.primary};case"warning":return{base:e.colors.background.tertiary,on:e.colors.warning,ink:e.colors.toneText.warning,border:e.colors.warning,selectedBg:e.colors.primaryMuted,selectedOn:e.colors.primary,selectedInk:e.colors.toneText.primary,selectedBorder:e.colors.primary};case"error":return{base:e.colors.background.tertiary,on:e.colors.error,ink:e.colors.toneText.error,border:e.colors.error,selectedBg:e.colors.primaryMuted,selectedOn:e.colors.primary,selectedInk:e.colors.toneText.primary,selectedBorder:e.colors.primary};case"info":return{base:e.colors.background.tertiary,on:e.colors.info,ink:e.colors.toneText.info,border:e.colors.info,selectedBg:e.colors.primaryMuted,selectedOn:e.colors.primary,selectedInk:e.colors.toneText.primary,selectedBorder:e.colors.primary};default:return{base:e.colors.background.tertiary,on:e.colors.text.primary,ink:e.colors.text.primary,border:e.colors.border.primary,selectedBg:e.colors.primaryMuted,selectedOn:e.colors.primary,selectedInk:e.colors.toneText.primary,selectedBorder:e.colors.primary}}},SOFT_FILL_OPACITY=.14,SOFT_SELECTED_FILL_OPACITY=.24,sizeMap={sm:{paddingH:10,paddingV:4,fontSize:12,minHeight:26,closeSize:16,closeFont:12,gap:6,iconSize:14},md:{paddingH:12,paddingV:6,fontSize:13,minHeight:32,closeSize:18,closeFont:13,gap:8,iconSize:16}},hasChipCount=e=>null!=e&&""!==e,Chip=exports.Chip=(0,_react.forwardRef)((e,r)=>{const{label:t,count:i,selected:o=!1,selectionMode:s="single",onPress:l,onClose:n,leftIcon:a,iconVariant:c,variant:d="filled",tone:p="neutral",size:u="md",disabled:m=!1,loading:y=!1,accessibilityLabel:g,haptic:h,style:b,textStyle:x,containerStyle:S,countStyle:f,closeButtonStyle:_,closeIconStyle:z,testID:k}=e,j=(0,_index.useTheme)(),C=!!l&&!m,I="radio"===s,M=!!l&&(!m||I),v=hasChipCount(i),{style:H,pressIn:R,pressOut:T}=(0,_usePressAnimation.usePressAnimation)({enabled:C}),w=(0,_react.useMemo)(()=>toneFor(j,p),[j,p]),F=j.components.chip?.[u],O={paddingH:F?.paddingHorizontal??sizeMap[u].paddingH,paddingV:F?.paddingVertical??sizeMap[u].paddingV,fontSize:F?.fontSize??sizeMap[u].fontSize,minHeight:F?.minHeight??sizeMap[u].minHeight,closeSize:F?.closeSize??sizeMap[u].closeSize,closeFont:F?.closeFontSize??sizeMap[u].closeFont,gap:F?.gap??sizeMap[u].gap,iconSize:F?.iconSize??sizeMap[u].iconSize},B=Math.max(0,Math.ceil((44-O.minHeight)/2)),L=I?{top:B,bottom:B}:void 0,P="filled"===d,N="soft"===d,V=(()=>{if(N){const e=o?w.selectedOn:w.on,r=o?.24:.14;return(0,_color.tintOf)(e,r,o?w.selectedBg:w.base)}return o?P?w.selectedBg:"transparent":P?w.base:"transparent"})(),q=N?"transparent":o?w.selectedBorder:P?"transparent":w.border,A=m?j.colors.text.disabled:o?N?j.colors.text.primary:w.selectedInk:w.ink,D=P||N?0:j.colors.border.width,handlePress=()=>{if(!C)return;const e=(0,_hapticUtils.resolveHaptic)(h,"selection");e&&(0,_hapticUtils.triggerHaptic)(e),l?.()},U=g??(v?`${t}, ${i}`:t),E=(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.row,children:[a?(0,_jsxRuntime.jsx)(_reactNative.View,{style:{marginRight:O.gap},children:(0,_slotIcon.renderSlotIcon)(a,{color:A,size:O.iconSize,disabled:m},c)}):null,(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[styles.label,{color:A,fontSize:O.fontSize,...(0,_index.fontFor)(j,"medium")},x],numberOfLines:1,children:t??" "}),v?(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[styles.count,{color:A,fontSize:Math.min(j.typography.fontSize.xs,O.fontSize),marginLeft:j.spacing.xs,...(0,_index.fontFor)(j,"normal")},f],numberOfLines:1,children:i}):null,n?(0,_jsxRuntime.jsx)(_reactNative.Pressable,{onPress:()=>{m||(!1!==h&&(0,_hapticUtils.triggerHaptic)("impactLight"),n?.())},disabled:m,accessibilityRole:"button",accessibilityLabel:`Remove ${t}`,accessibilityState:{disabled:m},"aria-disabled":m,hitSlop:6,style:({pressed:e})=>[styles.close,{width:O.closeSize,height:O.closeSize,borderRadius:O.closeSize/2,..._corners.smoothCorners,marginLeft:O.gap,backgroundColor:e?j.colors.surface.pressed:j.colors.surface.hovered},_],children:(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[{color:A,fontSize:O.closeFont,...(0,_index.fontFor)(j,"bold"),lineHeight:O.closeFont+2},z],maxFontSizeMultiplier:1,children:"×"})}):null]}),$={paddingHorizontal:O.paddingH,paddingVertical:O.paddingV,minHeight:O.minHeight,borderRadius:j.radius.full,..._corners.smoothCorners,backgroundColor:V,borderWidth:D,borderColor:q,opacity:m?.55:1};let Y;return Y=M?(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{style:[H,{alignSelf:"flex-start"}],children:(0,_jsxRuntime.jsx)(_reactNative.Pressable,{ref:r,onPress:handlePress,onPressIn:R,onPressOut:T,disabled:!C,accessibilityRole:I?"radio":"multiple"===s?"checkbox":"button",accessibilityLabel:U,accessibilityState:I||"multiple"===s?{checked:o,disabled:m}:{selected:o,disabled:m},"aria-checked":I||"multiple"===s?o:void 0,"aria-selected":I||"multiple"===s?void 0:o,"aria-disabled":m,hitSlop:L,android_ripple:{color:j.colors.surface.pressed,borderless:!1},testID:k,style:({pressed:e})=>[styles.base,$,e&&"outlined"===d?{backgroundColor:j.colors.surface.pressed}:null,S,b],children:E})}):(0,_jsxRuntime.jsx)(_reactNative.View,{ref:r,style:[styles.base,$,S,b],accessible:!0,accessibilityRole:"text",accessibilityLabel:U,accessibilityState:{selected:o,disabled:m},"aria-selected":o,"aria-disabled":m,testID:k,children:E}),y?(0,_jsxRuntime.jsx)(ChipSkeleton,{...e}):Y});Chip.displayName="Chip";const ChipSkeleton=({label:e,count:r,size:t="md",leftIcon:i,onClose:o,style:s,containerStyle:l})=>{const n=sizeMap[t],a=Math.max(40,Math.min(120,7*(e??"").length)),c=n.minHeight,d=c/2,p=a+2*n.paddingH+(hasChipCount(r)?n.gap/2+7*String(r).length:0)+(void 0!==i?n.gap+14:0)+(void 0!==o?n.gap+n.closeSize:0);return(0,_jsxRuntime.jsx)(_index2.Skeleton,{width:p,height:c,radius:d,style:[{alignSelf:"flex-start"},l,s]})};ChipSkeleton.displayName="ChipSkeleton",Chip.Skeleton=ChipSkeleton;const styles=_reactNative.StyleSheet.create({base:{alignSelf:"flex-start",flexDirection:"row",alignItems:"center",justifyContent:"center"},row:{flexDirection:"row",alignItems:"center"},label:{flexShrink:1,textAlign:"center"},count:{flexShrink:0,fontVariant:["tabular-nums"]},close:{alignItems:"center",justifyContent:"center"}});var _default=exports.default=Chip;
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=exports.Chip=void 0;var _react=require("react"),_reactNative=require("react-native"),_usePressAnimation=require("../../hooks/usePressAnimation.js"),_index=require("../../theme/index.js"),_color=require("../../utils/color.js"),_corners=require("../../utils/corners.js"),_hapticUtils=require("../../utils/hapticUtils.js"),_slotIcon=require("../AppIcon/slotIcon.js"),_index2=require("../Skeleton/index.js"),_jsxRuntime=require("react/jsx-runtime");const toneFor=(e,r)=>{switch(r){case"primary":return{base:e.colors.primaryMuted,on:e.colors.primary,ink:e.colors.toneText.primary,border:e.colors.primary,selectedBg:e.colors.primaryMuted,selectedOn:e.colors.primary,selectedInk:e.colors.toneText.primary,selectedBorder:e.colors.primary};case"success":return{base:e.colors.background.tertiary,on:e.colors.success,ink:e.colors.toneText.success,border:e.colors.success,selectedBg:e.colors.primaryMuted,selectedOn:e.colors.primary,selectedInk:e.colors.toneText.primary,selectedBorder:e.colors.primary};case"warning":return{base:e.colors.background.tertiary,on:e.colors.warning,ink:e.colors.toneText.warning,border:e.colors.warning,selectedBg:e.colors.primaryMuted,selectedOn:e.colors.primary,selectedInk:e.colors.toneText.primary,selectedBorder:e.colors.primary};case"error":return{base:e.colors.background.tertiary,on:e.colors.error,ink:e.colors.toneText.error,border:e.colors.error,selectedBg:e.colors.primaryMuted,selectedOn:e.colors.primary,selectedInk:e.colors.toneText.primary,selectedBorder:e.colors.primary};case"info":return{base:e.colors.background.tertiary,on:e.colors.info,ink:e.colors.toneText.info,border:e.colors.info,selectedBg:e.colors.primaryMuted,selectedOn:e.colors.primary,selectedInk:e.colors.toneText.primary,selectedBorder:e.colors.primary};default:return{base:e.colors.background.tertiary,on:e.colors.text.primary,ink:e.colors.text.primary,border:e.colors.border.primary,selectedBg:e.colors.primaryMuted,selectedOn:e.colors.primary,selectedInk:e.colors.toneText.primary,selectedBorder:e.colors.primary}}},SOFT_FILL_OPACITY=.14,SOFT_SELECTED_FILL_OPACITY=.24,sizeMap={sm:{paddingH:10,paddingV:4,fontSize:12,minHeight:26,closeSize:16,closeFont:12,gap:6,iconSize:14},md:{paddingH:12,paddingV:6,fontSize:13,minHeight:32,closeSize:18,closeFont:13,gap:8,iconSize:16}},hasChipCount=e=>null!=e&&""!==e,Chip=exports.Chip=(0,_react.forwardRef)((e,r)=>{const{label:t,count:o,selected:i=!1,selectionMode:s="single",onPress:l,onClose:n,leftIcon:a,iconVariant:c,variant:d="filled",tone:p="neutral",size:u="md",disabled:m=!1,loading:y=!1,accessibilityLabel:g,haptic:h,style:b,textStyle:x,containerStyle:f,countStyle:S,closeButtonStyle:_,closeIconStyle:z,testID:k}=e,j=(0,_index.useTheme)(),C=!!l&&!m,v="radio"===s,I=!!l&&(!m||v),M=hasChipCount(o),{style:H,pressIn:R,pressOut:T}=(0,_usePressAnimation.usePressAnimation)({enabled:C}),w=(0,_react.useMemo)(()=>toneFor(j,p),[j,p]),F=j.components.chip?.[u],O={paddingH:F?.paddingHorizontal??sizeMap[u].paddingH,paddingV:F?.paddingVertical??sizeMap[u].paddingV,fontSize:F?.fontSize??sizeMap[u].fontSize,minHeight:F?.minHeight??sizeMap[u].minHeight,closeSize:F?.closeSize??sizeMap[u].closeSize,closeFont:F?.closeFontSize??sizeMap[u].closeFont,gap:F?.gap??sizeMap[u].gap,iconSize:F?.iconSize??sizeMap[u].iconSize},B=Math.max(0,Math.ceil((44-O.minHeight)/2)),L=v?{top:B,bottom:B}:void 0,P="filled"===d,N="soft"===d,V=(()=>{if(N){const e=i?w.selectedOn:w.on,r=i?.24:.14;return(0,_color.tintOf)(e,r,i?w.selectedBg:w.base)}return i?P?w.selectedBg:"transparent":P?w.base:"transparent"})(),q=N?"transparent":i?w.selectedBorder:P?"transparent":w.border,A=m?j.colors.text.disabled:i?N?j.colors.text.primary:w.selectedInk:w.ink,D=P||N?0:j.colors.border.width,handlePress=()=>{if(!C)return;const e=(0,_hapticUtils.resolveHaptic)(h,"selection");e&&(0,_hapticUtils.triggerHaptic)(e),l?.()},U=g??(M?`${t}, ${o}`:t),E=(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.row,children:[a?(0,_jsxRuntime.jsx)(_reactNative.View,{style:{marginRight:O.gap},children:(0,_slotIcon.renderSlotIcon)(a,{color:A,size:O.iconSize,disabled:m},c)}):null,(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[styles.label,{color:A,fontSize:O.fontSize,...(0,_index.fontFor)(j,"medium")},x],numberOfLines:1,children:t??" "}),M?(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[styles.count,{color:A,fontSize:Math.min(j.typography.fontSize.xs,O.fontSize),marginLeft:j.spacing.xs,...(0,_index.fontFor)(j,"normal")},S],numberOfLines:1,children:o}):null,n?(0,_jsxRuntime.jsx)(_reactNative.Pressable,{onPress:()=>{m||(!1!==h&&(0,_hapticUtils.triggerHaptic)("impactLight"),n?.())},disabled:m,accessibilityRole:"button",accessibilityLabel:`Remove ${t}`,accessibilityState:{disabled:m},"aria-disabled":m,hitSlop:6,style:({pressed:e})=>[styles.close,{width:O.closeSize,height:O.closeSize,borderRadius:O.closeSize/2,..._corners.smoothCorners,marginLeft:O.gap,backgroundColor:e?j.colors.surface.pressed:j.colors.surface.hovered},_],children:(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[{color:A,fontSize:O.closeFont,...(0,_index.fontFor)(j,"bold"),lineHeight:O.closeFont+2},z],maxFontSizeMultiplier:1,children:"×"})}):null]}),$={paddingHorizontal:O.paddingH,paddingVertical:O.paddingV,minHeight:O.minHeight,borderRadius:j.radius.full,..._corners.smoothCorners,overflow:"hidden",backgroundColor:V,borderWidth:D,borderColor:q,opacity:m?.55:1};let Y;return Y=I?(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{style:[H,{alignSelf:"flex-start",borderRadius:j.radius.full,..._corners.smoothCorners,overflow:"hidden"}],children:(0,_jsxRuntime.jsx)(_reactNative.Pressable,{ref:r,onPress:handlePress,onPressIn:R,onPressOut:T,disabled:!C,accessibilityRole:v?"radio":"multiple"===s?"checkbox":"button",accessibilityLabel:U,accessibilityState:v||"multiple"===s?{checked:i,disabled:m}:{selected:i,disabled:m},"aria-checked":v||"multiple"===s?i:void 0,"aria-selected":v||"multiple"===s?void 0:i,"aria-disabled":m,hitSlop:L,android_ripple:{color:j.colors.surface.pressed,borderless:!1},testID:k,style:({pressed:e})=>[styles.base,$,e&&"outlined"===d?{backgroundColor:j.colors.surface.pressed}:null,f,b],children:E})}):(0,_jsxRuntime.jsx)(_reactNative.View,{ref:r,style:[styles.base,$,f,b],accessible:!0,accessibilityRole:"text",accessibilityLabel:U,accessibilityState:{selected:i,disabled:m},"aria-selected":i,"aria-disabled":m,testID:k,children:E}),y?(0,_jsxRuntime.jsx)(ChipSkeleton,{...e}):Y});Chip.displayName="Chip";const ChipSkeleton=({label:e,count:r,size:t="md",leftIcon:o,onClose:i,style:s,containerStyle:l})=>{const n=sizeMap[t],a=Math.max(40,Math.min(120,7*(e??"").length)),c=n.minHeight,d=c/2,p=a+2*n.paddingH+(hasChipCount(r)?n.gap/2+7*String(r).length:0)+(void 0!==o?n.gap+14:0)+(void 0!==i?n.gap+n.closeSize:0);return(0,_jsxRuntime.jsx)(_index2.Skeleton,{width:p,height:c,radius:d,style:[{alignSelf:"flex-start"},l,s]})};ChipSkeleton.displayName="ChipSkeleton",Chip.Skeleton=ChipSkeleton;const styles=_reactNative.StyleSheet.create({base:{alignSelf:"flex-start",flexDirection:"row",alignItems:"center",justifyContent:"center"},row:{flexDirection:"row",alignItems:"center"},label:{flexShrink:1,textAlign:"center"},count:{flexShrink:0,fontVariant:["tabular-nums"]},close:{alignItems:"center",justifyContent:"center"}});var _default=exports.default=Chip;
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=exports.Descriptions=void 0;var _react=require("react"),_reactNative=require("react-native"),_index=require("../../theme/index.js"),_Notation=require("../Notation/Notation.js"),_Text=require("../Text/Text.js"),_jsxRuntime=require("react/jsx-runtime");const EMPTY_VALUE="-",rowKey=(e,t)=>e.key??("string"==typeof e.label?`${e.label}-${t}`:`row-${t}`),isEmptyValue=e=>null==e||""===e||Array.isArray(e)&&!e.length,isInlineText=e=>"string"==typeof e||"number"==typeof e||(0,_react.isValidElement)(e)&&e.type===_Notation.Notation||Array.isArray(e)&&e.length>0&&e.every(isInlineText),Descriptions=({items:e,columns:t=1,size:r="md",bordered:i=!1,title:o,variant:l="list",style:a,testID:s})=>{const n=(0,_index.useTheme)(),c=(0,_react.useMemo)(()=>buildStyles(n),[n]),x="sm"===r?n.typography.fontSize.xs:n.typography.fontSize.sm,u="sm"===r?n.typography.fontSize.sm:n.typography.fontSize.base,d="sm"===r?n.spacing.xs:n.spacing.sm,m="summary"===l,y=(0,_react.useMemo)(()=>({fontSize:x,color:n.colors.text.tertiary}),[x,n.colors.text.tertiary]),_=(0,_react.useMemo)(()=>({fontSize:u,color:n.colors.text.secondary}),[u,n.colors.text.secondary]);return(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[m?null:{gap:d},a],testID:s,children:[o?(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[c.title,{fontSize:n.typography.fontSize.lg,color:n.colors.text.primary}],children:o}):null,e.map((e,r)=>{const o=isEmptyValue(e.value),l=2===t&&!e.full,a=o?n.colors.text.tertiary:(0,_Text.resolveColor)(n,e.tone??"primary"),s=(0,_index.fontFor)(n,e.strong?"semibold":"normal"),p=o||isInlineText(e.value),v=o?"-":"string"==typeof e.value?e.value:(0,_jsxRuntime.jsx)(_Notation.NotationInkContext.Provider,{value:{fontSize:u,color:a},children:e.value});return m?(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[c.summaryRow,{paddingVertical:d,borderBottomColor:n.colors.border.secondary}],children:[(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[c.summaryLabel,{fontSize:u,color:n.colors.text.secondary}],children:(0,_jsxRuntime.jsx)(_Notation.NotationInkContext.Provider,{value:_,children:e.label})}),p?(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[c.summaryValue,{fontSize:u,color:a},s],children:v}):(0,_jsxRuntime.jsx)(_reactNative.View,{children:e.value})]},rowKey(e,r)):(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[l?c.rowSide:c.rowStack,{paddingVertical:d},i&&r>0?c.bordered:null,i&&r>0?{borderTopColor:n.colors.border.secondary}:null],children:["string"==typeof e.label?(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[c.label,{fontSize:x,color:n.colors.text.tertiary},l?c.labelSide:null],children:e.label}):(0,_jsxRuntime.jsx)(_reactNative.View,{style:l?c.labelSide:null,children:(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[c.label,{fontSize:x,color:n.colors.text.tertiary}],children:(0,_jsxRuntime.jsx)(_Notation.NotationInkContext.Provider,{value:y,children:e.label})})}),p?(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[c.value,{fontSize:u,color:a},e.strong?s:null,l?c.valueSide:null],children:v}):(0,_jsxRuntime.jsx)(_reactNative.View,{style:l?c.valueSide:null,children:e.value})]},rowKey(e,r))})]})};exports.Descriptions=Descriptions;const buildStyles=e=>_reactNative.StyleSheet.create({title:{...(0,_index.fontFor)(e,"semibold")},rowStack:{gap:2},rowSide:{flexDirection:"row",alignItems:"flex-start",gap:e.spacing.md},bordered:{borderTopWidth:_reactNative.StyleSheet.hairlineWidth},label:{...(0,_index.fontFor)(e,"semibold")},labelSide:{flex:4},value:{...(0,_index.fontFor)(e,"normal")},valueSide:{flex:6},summaryRow:{flexDirection:"row",alignItems:"center",gap:e.spacing.md,borderBottomWidth:_reactNative.StyleSheet.hairlineWidth},summaryLabel:{flex:1,...(0,_index.fontFor)(e,"normal")},summaryValue:{textAlign:"right"}});var _default=exports.default=Descriptions;
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=exports.Descriptions=void 0;var _react=require("react"),_reactNative=require("react-native"),_index=require("../../theme/index.js"),_Notation=require("../Notation/Notation.js"),_Text=require("../Text/Text.js"),_jsxRuntime=require("react/jsx-runtime");const EMPTY_VALUE="-",rowKey=(e,t)=>e.key??("string"==typeof e.label?`${e.label}-${t}`:`row-${t}`),isEmptyValue=e=>null==e||""===e||Array.isArray(e)&&!e.length,isInlineText=e=>"string"==typeof e||"number"==typeof e||(0,_react.isValidElement)(e)&&e.type===_Notation.Notation||Array.isArray(e)&&e.length>0&&e.every(isInlineText),Descriptions=({items:e,columns:t=1,size:r="md",bordered:i=!1,title:o,variant:l="list",style:a,testID:s})=>{const n=(0,_index.useTheme)(),c=(0,_react.useMemo)(()=>buildStyles(n),[n]),x="sm"===r?n.typography.fontSize.xs:n.typography.fontSize.sm,u="sm"===r?n.typography.fontSize.sm:n.typography.fontSize.base,d="sm"===r?n.spacing.xs:n.spacing.sm,m="summary"===l,y=(0,_react.useMemo)(()=>({fontSize:x,color:n.colors.text.tertiary}),[x,n.colors.text.tertiary]),_=(0,_react.useMemo)(()=>({fontSize:u,color:n.colors.text.secondary}),[u,n.colors.text.secondary]);return(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[m?null:{gap:d},a],testID:s,children:[o?(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[c.title,{fontSize:n.typography.fontSize.lg,color:n.colors.text.primary}],children:o}):null,e.map((e,r)=>{const o=isEmptyValue(e.value),l=2===t&&!e.full,a=o?n.colors.text.tertiary:(0,_Text.resolveColor)(n,e.tone??"primary"),s=(0,_index.fontFor)(n,e.strong?"semibold":"normal"),p=o||isInlineText(e.value),v=o?"-":"string"==typeof e.value?e.value:(0,_jsxRuntime.jsx)(_Notation.NotationInkContext.Provider,{value:{fontSize:u,color:a},children:e.value});return m?(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[c.summaryRow,{paddingVertical:d,borderBottomColor:n.colors.border.secondary}],children:[(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[c.summaryLabel,{fontSize:u,color:n.colors.text.secondary}],children:(0,_jsxRuntime.jsx)(_Notation.NotationInkContext.Provider,{value:_,children:e.label})}),p?(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[c.summaryValue,{fontSize:u,color:a},s],children:v}):(0,_jsxRuntime.jsx)(_reactNative.View,{style:c.summaryValueView,children:e.value})]},rowKey(e,r)):(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[l?c.rowSide:c.rowStack,{paddingVertical:d},i&&r>0?c.bordered:null,i&&r>0?{borderTopColor:n.colors.border.secondary}:null],children:["string"==typeof e.label?(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[c.label,{fontSize:x,color:n.colors.text.tertiary},l?c.labelSide:null],children:e.label}):(0,_jsxRuntime.jsx)(_reactNative.View,{style:l?c.labelSide:null,children:(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[c.label,{fontSize:x,color:n.colors.text.tertiary}],children:(0,_jsxRuntime.jsx)(_Notation.NotationInkContext.Provider,{value:y,children:e.label})})}),p?(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[c.value,{fontSize:u,color:a},e.strong?s:null,l?c.valueSide:null],children:v}):(0,_jsxRuntime.jsx)(_reactNative.View,{style:l?c.valueSide:null,children:e.value})]},rowKey(e,r))})]})};exports.Descriptions=Descriptions;const buildStyles=e=>_reactNative.StyleSheet.create({title:{...(0,_index.fontFor)(e,"semibold")},rowStack:{gap:2},rowSide:{flexDirection:"row",alignItems:"flex-start",gap:e.spacing.md},bordered:{borderTopWidth:_reactNative.StyleSheet.hairlineWidth},label:{...(0,_index.fontFor)(e,"semibold")},labelSide:{flex:4},value:{...(0,_index.fontFor)(e,"normal")},valueSide:{flex:6},summaryRow:{flexDirection:"row",alignItems:"center",gap:e.spacing.md,borderBottomWidth:_reactNative.StyleSheet.hairlineWidth},summaryLabel:{flex:1,...(0,_index.fontFor)(e,"normal")},summaryValue:{textAlign:"right",flexShrink:1,maxWidth:"60%"},summaryValueView:{flexShrink:1,maxWidth:"60%",alignItems:"flex-end"}});var _default=exports.default=Descriptions;
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=exports.EmptyState=void 0;var _react=require("react"),_reactNative=require("react-native"),_usePressAnimation=require("../../hooks/usePressAnimation.js"),_index=require("../../theme/index.js"),_corners=require("../../utils/corners.js"),_hapticUtils=require("../../utils/hapticUtils.js"),_SquircleFill=require("../SquircleFill/SquircleFill.js"),_jsxRuntime=require("react/jsx-runtime");const SIZE_FALLBACK={sm:{iconSize:48,titleFontSize:"lg",descriptionFontSize:"sm",paddingVertical:"lg",titleGap:"md",descriptionGap:"xs"},md:{iconSize:64,titleFontSize:"xl",descriptionFontSize:"base",paddingVertical:"xl",titleGap:"md",descriptionGap:"xs"},lg:{iconSize:80,titleFontSize:"2xl",descriptionFontSize:"base",paddingVertical:"2xl",titleGap:"md",descriptionGap:"xs"}},sizeFor=(e,t)=>{const i={...SIZE_FALLBACK[t],...e.components.emptyState?.[t]??{}};return{iconSize:i.iconSize,titleSize:e.typography.fontSize[i.titleFontSize],descriptionSize:e.typography.fontSize[i.descriptionFontSize],paddingVertical:e.spacing[i.paddingVertical],titleGap:e.spacing[i.titleGap],descriptionGap:e.spacing[i.descriptionGap]}},ActionButton=({action:e,variant:t})=>{const i=(0,_index.useTheme)(),{style:r,pressIn:o,pressOut:s}=(0,_usePressAnimation.usePressAnimation)({enabled:!0}),n=(0,_react.useMemo)(()=>buildActionStyles(i),[i]),a="primary"===t,l=(0,_SquircleFill.useSquircle)(!0,i.radius.md),fillFor=e=>a?i.colors.primary:e?i.colors.surface.pressed:"transparent";return(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{style:r,children:(0,_jsxRuntime.jsx)(_reactNative.Pressable,{onPress:()=>{(0,_hapticUtils.triggerHaptic)("selection"),e.onPress()},onPressIn:o,onPressOut:s,accessibilityRole:"button",accessibilityLabel:e.accessibilityLabel??e.label,accessibilityHint:e.accessibilityHint,testID:e.testID,onLayout:l.onLayout,android_ripple:{color:a?i.colors.primaryHover:i.colors.surface.pressed,borderless:!1},style:({pressed:e})=>[n.button,a?n.buttonPrimary:n.buttonSecondary,!e||a||l.active?null:n.buttonSecondaryPressed,l.active?n.buttonSquircleHost:null],children:({pressed:t})=>(0,_jsxRuntime.jsxs)(_jsxRuntime.Fragment,{children:[l.active&&l.size?(0,_jsxRuntime.jsx)(_SquircleFill.SquircleFill,{width:l.size.width,height:l.size.height,radius:i.radius.md,fill:fillFor(t),stroke:a?void 0:i.colors.border.primary,strokeWidth:a?0:1,outset:a?0:1}):null,(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[n.buttonText,a?n.buttonTextPrimary:n.buttonTextSecondary],numberOfLines:1,children:e.label})]})})})},EmptyState=exports.EmptyState=(0,_react.forwardRef)((e,t)=>{const{icon:i,title:r,description:o,action:s,secondaryAction:n,size:a="md",fill:l=!1,style:c,testID:d}=e,u=(0,_index.useTheme)(),p=(0,_react.useMemo)(()=>sizeFor(u,a),[u,a]),m=(0,_react.useMemo)(()=>buildStyles(u),[u]);return(0,_jsxRuntime.jsxs)(_reactNative.View,{ref:t,accessibilityRole:"summary",testID:d,style:[m.root,{paddingVertical:p.paddingVertical},l?m.fill:null,c],children:[i?(0,_jsxRuntime.jsx)(_reactNative.View,{style:[m.iconCircle,{width:p.iconSize,height:p.iconSize,marginBottom:p.titleGap,borderRadius:p.iconSize/2,..._corners.smoothCorners}],children:i}):null,(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[m.title,{fontSize:p.titleSize,...(0,_index.fontFor)(u,"semibold")}],children:r}),o?(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[m.description,{fontSize:p.descriptionSize,marginTop:p.descriptionGap}],children:o}):null,s||n?(0,_jsxRuntime.jsxs)(_reactNative.View,{style:m.actions,children:[s?(0,_jsxRuntime.jsx)(ActionButton,{action:s,variant:"primary"}):null,n?(0,_jsxRuntime.jsx)(ActionButton,{action:n,variant:"secondary"}):null]}):null]})});EmptyState.displayName="EmptyState";const buildStyles=e=>_reactNative.StyleSheet.create({root:{alignItems:"center",justifyContent:"center",paddingHorizontal:e.spacing.lg},fill:{flexGrow:1},iconCircle:{backgroundColor:e.colors.surface.disabled,alignItems:"center",justifyContent:"center"},title:{color:e.colors.text.primary,textAlign:"center"},description:{color:e.colors.text.secondary,textAlign:"center",maxWidth:320,lineHeight:e.typography.fontSize.base*e.typography.lineHeight.normal},actions:{flexDirection:"row",alignItems:"center",gap:e.spacing.sm,marginTop:e.spacing.md+e.spacing.xs}}),buildActionStyles=e=>_reactNative.StyleSheet.create({button:{paddingHorizontal:e.spacing.lg,paddingVertical:e.spacing.sm,minHeight:42,borderRadius:e.radius.md,..._corners.smoothCorners,alignItems:"center",justifyContent:"center",flexDirection:"row"},buttonPrimary:{backgroundColor:e.colors.primary},buttonSecondary:{backgroundColor:"transparent",borderWidth:1,borderColor:e.colors.border.primary},buttonSecondaryPressed:{backgroundColor:e.colors.surface.pressed},buttonSquircleHost:{backgroundColor:"transparent",borderColor:"transparent",overflow:"visible"},buttonText:{fontSize:e.typography.fontSize.base,...(0,_index.fontFor)(e,"semibold")},buttonTextPrimary:{color:e.colors.onPrimary},buttonTextSecondary:{color:e.colors.text.primary}});var _default=exports.default=EmptyState;
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=exports.EmptyState=void 0;var _react=require("react"),_reactNative=require("react-native"),_usePressAnimation=require("../../hooks/usePressAnimation.js"),_index=require("../../theme/index.js"),_corners=require("../../utils/corners.js"),_hapticUtils=require("../../utils/hapticUtils.js"),_SquircleFill=require("../SquircleFill/SquircleFill.js"),_jsxRuntime=require("react/jsx-runtime");const SIZE_FALLBACK={sm:{iconSize:48,titleFontSize:"lg",descriptionFontSize:"sm",paddingVertical:"lg",titleGap:"md",descriptionGap:"xs"},md:{iconSize:64,titleFontSize:"xl",descriptionFontSize:"base",paddingVertical:"xl",titleGap:"md",descriptionGap:"xs"},lg:{iconSize:80,titleFontSize:"2xl",descriptionFontSize:"base",paddingVertical:"2xl",titleGap:"md",descriptionGap:"xs"}},sizeFor=(e,t)=>{const i={...SIZE_FALLBACK[t],...e.components.emptyState?.[t]??{}};return{iconSize:i.iconSize,titleSize:e.typography.fontSize[i.titleFontSize],descriptionSize:e.typography.fontSize[i.descriptionFontSize],paddingVertical:e.spacing[i.paddingVertical],titleGap:e.spacing[i.titleGap],descriptionGap:e.spacing[i.descriptionGap]}},ActionButton=({action:e,variant:t})=>{const i=(0,_index.useTheme)(),{style:r,pressIn:o,pressOut:n}=(0,_usePressAnimation.usePressAnimation)({enabled:!0}),s=(0,_react.useMemo)(()=>buildActionStyles(i),[i]),a="primary"===t,l=(0,_SquircleFill.useSquircle)(!0,i.radius.md),fillFor=e=>a?e?i.colors.primaryHover:i.colors.primary:e?i.colors.surface.pressed:"transparent";return(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{style:r,children:(0,_jsxRuntime.jsx)(_reactNative.Pressable,{onPress:()=>{(0,_hapticUtils.triggerHaptic)("selection"),e.onPress()},onPressIn:o,onPressOut:n,accessibilityRole:"button",accessibilityLabel:e.accessibilityLabel??e.label,accessibilityHint:e.accessibilityHint,testID:e.testID,onLayout:l.onLayout,style:({pressed:e})=>[s.button,a?s.buttonPrimary:s.buttonSecondary,e&&!l.active?a?s.buttonPrimaryPressed:s.buttonSecondaryPressed:null,l.active?s.buttonSquircleHost:null],children:({pressed:t})=>(0,_jsxRuntime.jsxs)(_jsxRuntime.Fragment,{children:[l.active&&l.size?(0,_jsxRuntime.jsx)(_SquircleFill.SquircleFill,{width:l.size.width,height:l.size.height,radius:i.radius.md,fill:fillFor(t),stroke:a?void 0:i.colors.border.primary,strokeWidth:a?0:1,outset:a?0:1}):null,(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[s.buttonText,a?s.buttonTextPrimary:s.buttonTextSecondary],numberOfLines:1,children:e.label})]})})})},EmptyState=exports.EmptyState=(0,_react.forwardRef)((e,t)=>{const{icon:i,title:r,description:o,action:n,secondaryAction:s,size:a="md",fill:l=!1,style:c,testID:d}=e,u=(0,_index.useTheme)(),p=(0,_react.useMemo)(()=>sizeFor(u,a),[u,a]),m=(0,_react.useMemo)(()=>buildStyles(u),[u]);return(0,_jsxRuntime.jsxs)(_reactNative.View,{ref:t,accessibilityRole:"summary",testID:d,style:[m.root,{paddingVertical:p.paddingVertical},l?m.fill:null,c],children:[i?(0,_jsxRuntime.jsx)(_reactNative.View,{style:[m.iconCircle,{width:p.iconSize,height:p.iconSize,marginBottom:p.titleGap,borderRadius:p.iconSize/2,..._corners.smoothCorners}],children:i}):null,(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[m.title,{fontSize:p.titleSize,...(0,_index.fontFor)(u,"semibold")}],children:r}),o?(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[m.description,{fontSize:p.descriptionSize,marginTop:p.descriptionGap}],children:o}):null,n||s?(0,_jsxRuntime.jsxs)(_reactNative.View,{style:m.actions,children:[n?(0,_jsxRuntime.jsx)(ActionButton,{action:n,variant:"primary"}):null,s?(0,_jsxRuntime.jsx)(ActionButton,{action:s,variant:"secondary"}):null]}):null]})});EmptyState.displayName="EmptyState";const buildStyles=e=>_reactNative.StyleSheet.create({root:{alignItems:"center",justifyContent:"center",paddingHorizontal:e.spacing.lg},fill:{flexGrow:1},iconCircle:{backgroundColor:e.colors.surface.disabled,alignItems:"center",justifyContent:"center"},title:{color:e.colors.text.primary,textAlign:"center"},description:{color:e.colors.text.secondary,textAlign:"center",maxWidth:320,lineHeight:e.typography.fontSize.base*e.typography.lineHeight.normal},actions:{flexDirection:"row",alignItems:"center",gap:e.spacing.sm,marginTop:e.spacing.md+e.spacing.xs}}),buildActionStyles=e=>_reactNative.StyleSheet.create({button:{paddingHorizontal:e.spacing.lg,paddingVertical:e.spacing.sm,minHeight:42,borderRadius:e.radius.md,..._corners.smoothCorners,overflow:"hidden",alignItems:"center",justifyContent:"center",flexDirection:"row"},buttonPrimary:{backgroundColor:e.colors.primary},buttonPrimaryPressed:{backgroundColor:e.colors.primaryHover},buttonSecondary:{backgroundColor:"transparent",borderWidth:1,borderColor:e.colors.border.primary},buttonSecondaryPressed:{backgroundColor:e.colors.surface.pressed},buttonSquircleHost:{backgroundColor:"transparent",borderColor:"transparent",overflow:"visible"},buttonText:{fontSize:e.typography.fontSize.base,...(0,_index.fontFor)(e,"semibold")},buttonTextPrimary:{color:e.colors.onPrimary},buttonTextSecondary:{color:e.colors.text.primary}});var _default=exports.default=EmptyState;
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=exports.Tour=void 0;var _react=require("react"),_reactNative=require("react-native"),_usePresenceMotion=require("../../hooks/usePresenceMotion.js"),_index=require("../../theme/index.js"),_corners=require("../../utils/corners.js"),_index2=require("../Button/index.js"),_index3=require("../Modal/index.js"),_jsxRuntime=require("react/jsx-runtime");const DEFAULT_GAP=8,DEFAULT_SCREEN_PADDING=8,MAX_CARD_WIDTH=360,HIGHLIGHT_BORDER_WIDTH=2,measureInWindow=e=>new Promise(t=>{const i=e.current;i?i.measureInWindow((e,i,r,n)=>t({x:e,y:i,width:r,height:n})):t(null)}),isOnScreen=(e,t)=>e.width>0&&e.height>0&&e.x<t.width&&e.y<t.height&&e.x+e.width>0&&e.y+e.height>0,Tour=({tourId:e,steps:t,visible:i,onClose:r,seenStore:n,labels:s,haptic:o,testID:a})=>{const c=(0,_index.useTheme)(),l=(0,_usePresenceMotion.usePresenceMotion)().duration("fast"),u=(0,_react.useMemo)(()=>buildStyles(c),[c]),d=(0,_reactNative.useWindowDimensions)(),h=(0,_react.useRef)(d);h.current=d;const x=c.components.tooltip?.gap??8,_=c.components.tooltip?.screenPadding??8,[p,g]=(0,_react.useState)(null),[m,y]=(0,_react.useState)(0),f=(0,_react.useRef)((0,_index.createAnimatedValue)(0)).current,j=(0,_react.useRef)(t);j.current=t;const v=(0,_react.useRef)(r);v.current=r;const b=(0,_react.useRef)(n);b.current=n;const w=(0,_react.useCallback)(async(e,t)=>{for(let i=e;i>=0&&i<j.current.length;i+=t){const e=await measureInWindow(j.current[i].target);if(e&&isOnScreen(e,h.current))return{index:i,rect:e}}return null},[]);(0,_react.useEffect)(()=>{if(!i)return void g(null);let t=!1;return(async()=>{const i=b.current;if(i&&await i.isSeen(e))return void(t||v.current("alreadySeen"));const r=await w(0,1);t||(r?(y(r.index),g(r)):v.current("noTargets"))})(),()=>{t=!0}},[i,e,w]),(0,_react.useEffect)(()=>{if(!p)return;const e=j.current[p.index],t=`Step ${p.index+1} of ${j.current.length}`;_reactNative.AccessibilityInfo.announceForAccessibility([t,e.title,e.description].filter(Boolean).join(". ")),f.setValue(0);const i=_reactNative.Animated.timing(f,{toValue:1,duration:l,useNativeDriver:!0});return i.start(),()=>i.stop()},[p,f,l]);const R=(0,_react.useCallback)(async t=>{g(null),await(b.current?.markSeen(e)),v.current(t)},[e]),S=(0,_react.useCallback)(async()=>{if(!p)return;const e=await w(p.index+1,1);e?g(e):await R("finished")},[p,w,R]),k=(0,_react.useCallback)(async()=>{if(!p)return;const e=await w(p.index-1,-1);e&&g(e)},[p,w]),N=(0,_react.useCallback)(()=>{R("skipped")},[R]),C=p?t[p.index]:void 0,D=!!p&&p.index===t.length-1,T=c.spacing.xs,I=p?{x:p.rect.x-T,y:p.rect.y-T,width:p.rect.width+2*T,height:p.rect.height+2*T}:null,M=Math.min(d.width-2*_,360),P=I?(()=>{const e=I.x+I.width/2,t=Math.max(_,Math.min(e-M/2,d.width-M-_)),i=I.y,r=d.height-(I.y+I.height);return r>=i?{left:t,top:I.y+I.height+x,maxHeight:Math.max(r-x-_,0)}:{left:t,bottom:d.height-I.y+x,maxHeight:Math.max(i-x-_,0)}})():null,V=c.colors.background.overlay;return(0,_jsxRuntime.jsx)(_index3.Modal,{visible:null!==p,onRequestClose:N,presentation:"fullScreen",backdropPressClose:!1,backdropStyle:u.transparent,contentStyle:u.transparent,accessibilityLabel:C?.title??C?.description,haptic:o,testID:a,children:I&&P&&C?(0,_jsxRuntime.jsxs)(_reactNative.View,{style:_reactNative.StyleSheet.absoluteFill,children:[(0,_jsxRuntime.jsx)(_reactNative.View,{style:[u.dim,{backgroundColor:V,top:0,left:0,right:0,height:Math.max(I.y,0)}]}),(0,_jsxRuntime.jsx)(_reactNative.View,{style:[u.dim,{backgroundColor:V,top:I.y+I.height,left:0,right:0,bottom:0}]}),(0,_jsxRuntime.jsx)(_reactNative.View,{style:[u.dim,{backgroundColor:V,top:I.y,left:0,width:Math.max(I.x,0),height:I.height}]}),(0,_jsxRuntime.jsx)(_reactNative.View,{style:[u.dim,{backgroundColor:V,top:I.y,left:I.x+I.width,right:0,height:I.height}]}),(0,_jsxRuntime.jsx)(_reactNative.View,{pointerEvents:"none",style:[u.highlight,{top:I.y,left:I.x,width:I.width,height:I.height}]}),(0,_jsxRuntime.jsxs)(_reactNative.Animated.View,{accessibilityLiveRegion:"polite",style:[u.card,P,{width:M,opacity:f}],testID:a?`${a}-card`:void 0,children:[(0,_jsxRuntime.jsx)(_reactNative.Text,{style:u.position,children:`Step ${(p?.index??0)+1} of ${t.length}`}),C.title?(0,_jsxRuntime.jsx)(_reactNative.Text,{style:u.title,accessibilityRole:"header",children:C.title}):null,(0,_jsxRuntime.jsx)(_reactNative.Text,{style:u.description,children:C.description}),(0,_jsxRuntime.jsxs)(_reactNative.View,{style:u.actions,children:[(0,_jsxRuntime.jsx)(_index2.Button,{title:s?.skip??"Skip",variant:"ghost",size:"sm",haptic:o,onPress:N,testID:a?`${a}-skip`:void 0}),(0,_jsxRuntime.jsxs)(_reactNative.View,{style:u.navigation,children:[p&&p.index>m?(0,_jsxRuntime.jsx)(_index2.Button,{title:s?.back??"Back",variant:"outline",size:"sm",haptic:o,onPress:()=>{k()},testID:a?`${a}-back`:void 0}):null,(0,_jsxRuntime.jsx)(_index2.Button,{title:D?s?.done??"Done":s?.next??"Next",size:"sm",haptic:o,onPress:()=>{S()},testID:a?`${a}-next`:void 0})]})]})]})]}):null})};exports.Tour=Tour,Tour.displayName="Tour";const buildStyles=e=>_reactNative.StyleSheet.create({transparent:{backgroundColor:"transparent"},dim:{position:"absolute"},highlight:{position:"absolute",borderWidth:2,borderColor:e.colors.primary,borderRadius:e.radius.md,..._corners.smoothCorners},card:{position:"absolute",backgroundColor:e.colors.background.elevated,borderRadius:e.radius.lg,..._corners.smoothCorners,padding:e.spacing.lg,gap:e.spacing.sm,...e.shadows.lg},position:{color:e.colors.text.tertiary,fontSize:e.typography.fontSize.xs},title:{color:e.colors.text.primary,fontSize:e.typography.fontSize.lg,fontWeight:e.typography.fontWeight.semibold},description:{color:e.colors.text.secondary,fontSize:e.typography.fontSize.sm},actions:{flexDirection:"row",alignItems:"center",justifyContent:"space-between",marginTop:e.spacing.xs},navigation:{flexDirection:"row",gap:e.spacing.sm}});var _default=exports.default=Tour;
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=exports.Tour=void 0;var _react=require("react"),_reactNative=require("react-native"),_usePresenceMotion=require("../../hooks/usePresenceMotion.js"),_index=require("../../theme/index.js"),_corners=require("../../utils/corners.js"),_index2=require("../Button/index.js"),_index3=require("../Modal/index.js"),_jsxRuntime=require("react/jsx-runtime");const DEFAULT_GAP=8,DEFAULT_SCREEN_PADDING=8,MAX_CARD_WIDTH=360,HIGHLIGHT_BORDER_WIDTH=2,measureInWindow=e=>new Promise(t=>{const i=e.current;i?i.measureInWindow((e,i,r,n)=>t({x:e,y:i,width:r,height:n})):t(null)}),isOnScreen=(e,t)=>e.width>0&&e.height>0&&e.x<t.width&&e.y<t.height&&e.x+e.width>0&&e.y+e.height>0,Tour=({tourId:e,steps:t,visible:i,onClose:r,seenStore:n,labels:s,haptic:a,testID:o})=>{const c=(0,_index.useTheme)(),l=(0,_usePresenceMotion.usePresenceMotion)().duration("fast"),u=(0,_react.useMemo)(()=>buildStyles(c),[c]),d=(0,_reactNative.useWindowDimensions)(),h=(0,_react.useRef)(d);h.current=d;const x=c.components.tooltip?.gap??8,p=c.components.tooltip?.screenPadding??8,[_,g]=(0,_react.useState)(null),[m,y]=(0,_react.useState)(0),f=(0,_react.useRef)((0,_index.createAnimatedValue)(0)).current,b=(0,_react.useRef)(t);b.current=t;const v=(0,_react.useRef)(r);v.current=r;const w=(0,_react.useRef)(n);w.current=n;const j=(0,_react.useCallback)(async(e,t)=>{for(let i=e;i>=0&&i<b.current.length;i+=t){const e=await measureInWindow(b.current[i].target);if(e&&isOnScreen(e,h.current))return{index:i,rect:e}}return null},[]);(0,_react.useEffect)(()=>{if(!i)return void g(null);let t=!1;return(async()=>{const i=w.current;if(i&&await i.isSeen(e))return void(t||v.current("alreadySeen"));const r=await j(0,1);t||(r?(y(r.index),g(r)):v.current("noTargets"))})(),()=>{t=!0}},[i,e,j]),(0,_react.useEffect)(()=>{if(!_)return;const e=b.current[_.index],t=`Step ${_.index+1} of ${b.current.length}`;_reactNative.AccessibilityInfo.announceForAccessibility([t,e.title,e.description].filter(Boolean).join(". ")),f.setValue(0);const i=_reactNative.Animated.timing(f,{toValue:1,duration:l,useNativeDriver:!0});return i.start(),()=>i.stop()},[_,f,l]);const R=(0,_react.useCallback)(async t=>{g(null),await(w.current?.markSeen(e)),v.current(t)},[e]),S=(0,_react.useCallback)(async()=>{if(!_)return;const e=await j(_.index+1,1);e?g(e):await R("finished")},[_,j,R]),k=(0,_react.useCallback)(async()=>{if(!_)return;const e=await j(_.index-1,-1);e&&g(e)},[_,j]),N=(0,_react.useCallback)(()=>{R("skipped")},[R]),D=_?t[_.index]:void 0,T=!!_&&_.index===t.length-1,C=c.spacing.xs,I=_?{x:_.rect.x-C,y:_.rect.y-C,width:_.rect.width+2*C,height:_.rect.height+2*C}:null,M=Math.min(d.width-2*p,360),P=I?(()=>{const e=I.x+I.width/2,t=Math.max(p,Math.min(e-M/2,d.width-M-p)),i=I.y,r=d.height-(I.y+I.height);return r>=i?{left:t,top:I.y+I.height+x,maxHeight:Math.max(r-x-p,0)}:{left:t,bottom:d.height-I.y+x,maxHeight:Math.max(i-x-p,0)}})():null,A=c.colors.background.overlay,W=I?Math.min(D?.radius?c.radius[D.radius]+C:c.radius.md,Math.min(I.width,I.height)/2):0,q=Math.max(d.width,d.height);return(0,_jsxRuntime.jsx)(_index3.Modal,{visible:null!==_,onRequestClose:N,presentation:"fullScreen",backdropPressClose:!1,backdropStyle:u.transparent,contentStyle:u.transparent,accessibilityLabel:D?.title??D?.description,haptic:a,testID:o,children:I&&P&&D?(0,_jsxRuntime.jsxs)(_reactNative.View,{style:_reactNative.StyleSheet.absoluteFill,children:[(0,_jsxRuntime.jsx)(_reactNative.View,{style:[u.dim,{borderColor:A,borderWidth:q,top:I.y-q,left:I.x-q,width:I.width+2*q,height:I.height+2*q,borderRadius:W+q}]}),(0,_jsxRuntime.jsx)(_reactNative.View,{pointerEvents:"none",style:[u.highlight,{top:I.y,left:I.x,width:I.width,height:I.height,borderRadius:W}]}),(0,_jsxRuntime.jsxs)(_reactNative.Animated.View,{accessibilityLiveRegion:"polite",style:[u.card,P,{width:M,opacity:f}],testID:o?`${o}-card`:void 0,children:[(0,_jsxRuntime.jsx)(_reactNative.Text,{style:u.position,children:`Step ${(_?.index??0)+1} of ${t.length}`}),D.title?(0,_jsxRuntime.jsx)(_reactNative.Text,{style:u.title,accessibilityRole:"header",children:D.title}):null,(0,_jsxRuntime.jsx)(_reactNative.Text,{style:u.description,children:D.description}),(0,_jsxRuntime.jsxs)(_reactNative.View,{style:u.actions,children:[(0,_jsxRuntime.jsx)(_index2.Button,{title:s?.skip??"Skip",variant:"ghost",size:"sm",haptic:a,onPress:N,testID:o?`${o}-skip`:void 0}),(0,_jsxRuntime.jsxs)(_reactNative.View,{style:u.navigation,children:[_&&_.index>m?(0,_jsxRuntime.jsx)(_index2.Button,{title:s?.back??"Back",variant:"outline",size:"sm",haptic:a,onPress:()=>{k()},testID:o?`${o}-back`:void 0}):null,(0,_jsxRuntime.jsx)(_index2.Button,{title:T?s?.done??"Done":s?.next??"Next",size:"sm",haptic:a,onPress:()=>{S()},testID:o?`${o}-next`:void 0})]})]})]})]}):null})};exports.Tour=Tour,Tour.displayName="Tour";const buildStyles=e=>_reactNative.StyleSheet.create({transparent:{backgroundColor:"transparent"},dim:{position:"absolute"},highlight:{position:"absolute",borderWidth:2,borderColor:e.colors.primary,borderRadius:e.radius.md,..._corners.smoothCorners},card:{position:"absolute",backgroundColor:e.colors.background.elevated,borderRadius:e.radius.lg,..._corners.smoothCorners,padding:e.spacing.lg,gap:e.spacing.sm,...e.shadows.lg},position:{color:e.colors.text.tertiary,fontSize:e.typography.fontSize.xs},title:{color:e.colors.text.primary,fontSize:e.typography.fontSize.lg,fontWeight:e.typography.fontWeight.semibold},description:{color:e.colors.text.secondary,fontSize:e.typography.fontSize.sm},actions:{flexDirection:"row",alignItems:"center",justifyContent:"space-between",marginTop:e.spacing.xs},navigation:{flexDirection:"row",gap:e.spacing.sm}});var _default=exports.default=Tour;
@@ -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_PILL_INSET=16,DEFAULT_UNDERLINE_HEIGHT=3,DEFAULT_FLOATING_MARGIN=16,DEFAULT_FLOATING_RADIUS=28,DEFAULT_BUBBLE_SIZE=48,DEFAULT_BUBBLE_LIFT=14,DEFAULT_CENTER_SIZE=48,DEFAULT_CENTER_ICON_SIZE=24,CENTER_KEY="__webority_center_action__",TAB_PADDING_VERTICAL=6,BAR_PADDING_HORIZONTAL=4,BAR_PADDING_TOP=6,BAR_PADDING_TOP_BUBBLE=8,FLOATING_BAR_PADDING_VERTICAL=6,FLOATING_BAR_PADDING_HORIZONTAL=8,EXPANDED_FLEX=1.5,SOLID_INACTIVE_OPACITY=.7,TILE_INSET=2,TILE_LABEL_GAP=2,formatBadge=e=>null==e||!1===e?null:!0===e||"·"===e?{text:"",isDot:!0}:"number"==typeof e?e<=0?null:{text:e>99?"99+":String(e),isDot:!1}:"string"==typeof e?0===e.length?null:{text:e,isDot:!1}:null,badgeAccessibilitySuffix=e=>null==e||!1===e?"":"number"==typeof e?e>0?`, ${e} unread`:"":!0===e||"·"===e?", new updates":"string"==typeof e&&e.length>0?`, ${e}`:"",BottomNavigation=forwardRef((e,t)=>{const{tabs:i,centerAction:n,activeTab:o,onChange:r,haptic:a="selection",showLabels:l=!0,variant:s="pill",indicatorPosition:d="bottom",radius:c,indicatorRadius:u="auto",elevation:h,iconSize:m,marginHorizontal:p,marginVertical:g,paddingHorizontal:b,paddingVertical:y,border:f,minimizeOnScroll:x=!1,scrollDirection:_="idle",accessory:A,style:I,indicatorStyle:R,labelStyle:S,labelMaxFontScale:E,testID:w}=e,L=useTheme(),T=useSafeAreaInsets(),D=useMemo(()=>buildStyles(L),[L]),v=L.components.bottomNavigation,C=m??v?.iconSize??18,j=v?.pillHeight??C+4+8,B=v?.pillMaxWidth??64,N=v?.pillInset??16,V=v?.floatingMargin??16,P=v?.floatingRadius??28,M=v?.bubbleSize??48,k=v?.bubbleLift??14,F=useReducedMotion(),H=useScreenReaderEnabled(x),[z,O]=React.useState(null);useEffect(()=>{null!==z&&z!==_&&O(null)},[z,_]);const W=x&&!H&&"down"===_&&null===z,[U,G]=React.useState(W);useEffect(()=>{U!==W&&(F||"web"===Platform.OS||LayoutAnimation.configureNext(LayoutAnimation.Presets.easeInEaseOut),G(W))},[U,W,F]);const $="function"==typeof A?A({minimized:U}):A,X=null!=$&&!1!==$,Z=U&&X,[Y,K]=React.useState(0),q=X&&!Z?Y+L.spacing.xs:0,J="tile"===s,Q="floating"===s||J,ee="bubble"===s,te="expand"===s,ie="solid"===s,ne="pill"===s||Q||ie,oe=Math.max(0,i.findIndex(e=>e.key===o)),[re,ae]=React.useState(0),[le,se]=React.useState(0),de=n?Math.ceil(i.length/2):i.length,ce=i.length+(n?1:0),[ue,he]=React.useState({width:0,height:0}),me=n?.size??48,pe=void 0!==n?.gap,ge=Math.max(0,n?.gap??0),be=pe?(ue.width||me)+2*ge:0,ye=pe?i.length>0?Math.max(0,re-be)/i.length:0:ce>0?re/ce:0,fe=pe?be:ye,xe=useRef(createAnimatedValue(oe)).current,Ae=useRef({}),Ie=useRef({});i.forEach(e=>{Ae.current[e.key]||(Ae.current[e.key]=new Animated.Value(1)),Ie.current[e.key]||(Ie.current[e.key]=createAnimatedValue(e.key===o?1:0))});const Re=ye>0?J?Math.min(ye-4,96):Math.min(ye-N,B):0,Se=ye>0?(ye-Re)/2:0,Ee=ye>0?(ye-M)/2:0,hasLabel=e=>l&&!U&&!1!==e.showLabel&&e.label.trim().length>0,we=i[oe],Le=we&&!hasLabel(we)&&le>0?le/2:6+(C+4)/2,Te=Le-k-M/2,De=Math.max(0,le-4),ve=J?2:Le-j/2,Ce=useRef(oe);useEffect(()=>{if(Ce.current===oe)return;Ce.current=oe;const e=Animated.spring(xe,{toValue:oe,tension:120,friction:14,useNativeDriver:!0});return e.start(),()=>e.stop()},[oe,xe]);const je=Math.max(1,i.length-1),Be=useMemo(()=>{const e=[],t=[];for(let i=0;i<=je;i++)e.push(i),t.push(i<de?i*ye:i*ye+fe);return xe.interpolate({inputRange:e,outputRange:t})},[xe,je,de,ye,fe]),Ne=i.map(e=>e.key).join(" "),Ve=ee||te;useEffect(()=>{const e=Ne.split(" ").flatMap(e=>{const t=e===o?1:0,i=Ie.current[e];return i?Ve?[Animated.spring(i,{toValue:t,tension:140,friction:13,useNativeDriver:!1})]:(i.setValue(t),[]):[]});if(0===e.length)return;const t=Animated.parallel(e);return t.start(),()=>t.stop()},[o,Ne,Ve]);const popIcon=e=>{Animated.sequence([Animated.timing(e,{toValue:1.15,duration:120,useNativeDriver:!0}),Animated.spring(e,{toValue:1,tension:200,friction:8,useNativeDriver:!0})]).start()},Pe=useRef(new Animated.Value(1)).current,{colors:Me}=L,ke=ie?Me.primary:Me.background.elevated,Fe=ie?Me.onPrimary:Me.primary,He=ie?Me.onPrimary:J?Me.text.primary:Me.text.tertiary,ze=ie?Me.onPrimary:Me.primaryMuted,Oe=ie?Me.primary:ee?Me.onPrimary:Fe,We=p??V,Ue=g??(Q?V:0),Ge=Ue>0,$e=y??(Q?6:ee?8:6),Xe=b??(Q?8:4),Ze=Ge?$e:Math.max($e,T.bottom),Ye=Ge?Math.max(Ue,T.bottom):0,Ke="full"===c,qe=Q?le+q+2*$e+2*StyleSheet.hairlineWidth:le+q+$e+Ze,Je=Ke?le>0?qe/2:L.radius.full:c??v?.borderRadius??(J?L.radius.full:Q?P:0),Qe=void 0!==c||void 0!==v?.borderRadius,activeBgRadius=(e,t)=>"number"==typeof u?Math.max(0,Math.min(u,e/2)):"auto"===u&&Qe?Math.min(Je,e/2):t,et="underline"===s?Math.max(Xe,Ke&&0===le?0:Je):Xe,tt=h??"none",it=L.shadows[tt],nt="none"===tt?null:supportsBoxShadow()?{boxShadow:toBoxShadow(it)}:it,ot=f?StyleSheet.hairlineWidth:0,rt=ie?Me.primary:Me.border.primary,at=n?.lift??0,lt=$e+ot+q,st=n&&le>0?Math.max(0,(ue.height||me)/2+at-le/2-lt):0,dt=n?_jsx(View,{style:[D.centerCell,pe?{flex:0,marginHorizontal:ge}:null],pointerEvents:"box-none",children:_jsx(Pressable,{onPress:()=>{if(!n)return;const e=n.haptic??a;!1!==e&&triggerHaptic(e),popIcon(Pe),n.onPress()},onLayout:e=>{const{width:t,height:i}=e.nativeEvent.layout;he(e=>e.width===t&&e.height===i?e:{width:t,height:i})},accessibilityRole:"button",accessibilityLabel:n.label,hitSlop:{top:6,bottom:6,left:6,right:6},style:({pressed:e})=>[{top:-at},e?{opacity:.85}:null],testID:n.testID??(w?`${w}-center`:void 0),children:n.content?_jsx(Animated.View,{style:{transform:[{scale:Pe}]},children:n.content}):_jsx(View,{style:[D.centerCircle,{width:me,height:me,borderRadius:me/2,...smoothCorners,backgroundColor:n.color??Me.primary}],children:_jsx(Animated.View,{style:{transform:[{scale:Pe}]},children:renderSlotIcon(n.icon??"add",{color:n.iconColor??Me.onPrimary,size:n.iconSize??24,disabled:!1})})})})},CENTER_KEY):null,ct=X?_jsx(View,{style:Z?D.accessoryInline:D.accessoryStacked,onLayout:e=>K(e.nativeEvent.layout.height),testID:w?`${w}-accessory`:void 0,children:$}):null,ut=_jsxs(View,{style:Z?[D.tabRow,D.tabRowInline]:D.tabRow,onLayout:e=>{const{width:t,height:i}=e.nativeEvent.layout;ae(t),se(i)},children:[ne&&Re>0&&(!J||De>0)?_jsx(Animated.View,{pointerEvents:"none",style:[D.pill,{width:Re,height:J?De:j,left:Se,top:ve,backgroundColor:ze,borderRadius:J?activeBgRadius(De,De/2):activeBgRadius(j,L.radius.full),...smoothCorners,transform:[{translateX:Be}]},R]}):null,ee&&ye>0?_jsx(Animated.View,{pointerEvents:"none",style:[D.bubble,L.shadows.md,{width:M,height:M,borderRadius:M/2,...smoothCorners,left:Ee,top:Te,backgroundColor:Me.primary,borderColor:Me.background.elevated,transform:[{translateX:Be}]},R]}):null,(ht=i.map(e=>{const t=e.key===o,i=t?Fe:He,n=t?Oe:He,l="string"==typeof e.icon?{name:e.icon,variant:"bold"}:e.icon,s=t?e.activeIcon??l:e.icon,d=Ae.current[e.key],c=Ie.current[e.key],u=formatBadge(e.badge??null),h=badgeAccessibilitySuffix(e.badge??null),m=ie&&!t?.7:1,p=ee&&t||ie?Me.primary:Me.background.elevated,g=hasLabel(e),b=g&&(!te||t),y=_jsxs(Animated.View,{style:[D.iconWrap,{width:C+4,height:C+4,opacity:m,transform:[{scale:d}]}],children:[renderSlotIcon(s,{color:n,size:C,focused:t,disabled:!1}),u?_jsx(View,{style:[u.isDot?D.badgeDot:D.badgePill,{backgroundColor:Me.error,borderColor:p}],children:u.isDot?null:_jsx(Text,{style:[D.badgeText,{color:Me.onError}],numberOfLines:1,children:u.text})}):null]}),f=ee?_jsx(Animated.View,{style:{top:c.interpolate({inputRange:[0,1],outputRange:[0,-k]})},children:y}):y,x=b?_jsx(Animated.Text,{numberOfLines:1,maxFontSizeMultiplier:E??L.maxFontSizeMultiplier??1.2,style:[D.label,te?D.labelInline:null,{color:i,opacity:te?c:m,fontWeight:t?L.typography.fontWeight.semibold:L.typography.fontWeight.normal},S],children:e.label}):null,A=_jsx(Pressable,{onPress:()=>(e=>{U&&O(_),e.key!==o&&!1!==a&&triggerHaptic(a);const t=Ae.current[e.key];t&&popIcon(t),r(e.key)})(e),accessibilityRole:"tab",accessibilityState:{selected:t},"aria-selected":t,accessibilityLabel:`${e.label}${h}`,accessibilityHint:`Switches to ${e.label}`,hitSlop:{top:6,bottom:6,left:6,right:6},style:({pressed:e})=>[D.tab,J?D.tabTile:null,e?{opacity:.85}:null],testID:w?`${w}-tab-${e.key}`:void 0,children:te?_jsxs(View,{style:[D.expandPill,{height:j,paddingHorizontal:t&&g?L.spacing.md:Math.max(0,(j-(C+4))/2)}],children:[_jsx(View,{pointerEvents:"none",style:[D.expandFill,{borderRadius:activeBgRadius(j,j/2),...smoothCorners,backgroundColor:t?Me.primaryMuted:"transparent"},t?R:null]}),f,x]}):_jsxs(_Fragment,{children:[f,x]})},e.key);return te?_jsx(Animated.View,{style:{flex:c.interpolate({inputRange:[0,1],outputRange:[1,g?1.5:1]})},children:A},e.key):A}),dt?[...ht.slice(0,de),dt,...ht.slice(de)]:ht),"underline"===s&&ye>0?_jsx(Animated.View,{pointerEvents:"none",style:[D.underline,"top"===d?D.underlineTop:D.underlineBottom,"top"===d?{top:-$e-q}:{bottom:-$e},{width:ye,height:v?.underlineHeight??3,backgroundColor:Me.primary,transform:[{translateX:Be}]},R]}):null]});var ht;return _jsx(View,{ref:t,testID:w,accessibilityRole:"tablist",style:[D.outer,{paddingHorizontal:We,paddingTop:Math.max(Ue,st),paddingBottom:Ye},I],children:_jsxs(View,{style:[Q?D.floatingBar:D.dockedBar,Z?D.barInline:null,nt,{backgroundColor:ke,borderColor:rt,borderRadius:Je,...smoothCorners},Q?{borderWidth:ot,paddingHorizontal:Xe,paddingVertical:$e}:{borderTopWidth:ot,borderBottomWidth:ot,borderLeftWidth:ot,borderRightWidth:ot,paddingHorizontal:et,paddingTop:$e,paddingBottom:Ze}],children:[ct,ut]})})});BottomNavigation.displayName="BottomNavigation";const buildStyles=e=>StyleSheet.create({outer:{backgroundColor:"transparent"},dockedBar:{paddingHorizontal:4},floatingBar:{paddingVertical:6,paddingHorizontal:8},tabRow:{flexDirection:"row",alignItems:"stretch",position:"relative"},tabRowInline:{flex:1},barInline:{flexDirection:"row",alignItems:"center"},accessoryStacked:{marginBottom:e.spacing.xs},accessoryInline:{flexShrink:0,marginRight:e.spacing.xs},tab:{flex:1,minHeight:44,alignItems:"center",justifyContent:"center",paddingVertical:6,gap:4},tabTile:{paddingVertical:8,gap:2},centerCell:{flex:1,minHeight:44,alignItems:"center",justifyContent:"center"},centerCircle:{alignItems:"center",justifyContent:"center"},iconWrap:{alignItems:"center",justifyContent:"center",position:"relative"},label:{fontSize:e.typography.fontSize.xs,lineHeight:e.typography.fontSize.xs*e.typography.lineHeight.tight,textAlign:"center",includeFontPadding:!1},labelInline:{fontSize:e.typography.fontSize.sm,lineHeight:e.typography.fontSize.sm*e.typography.lineHeight.tight,flexShrink:1,includeFontPadding:!1},expandPill:{flexDirection:"row",alignItems:"center",justifyContent:"center",gap:e.spacing.xs},expandFill:{position:"absolute",top:0,right:0,bottom:0,left:0,overflow:"hidden"},pill:{position:"absolute",left:0},bubble:{position:"absolute",left:0,borderWidth:3},underline:{position:"absolute",left:0,height:3},underlineBottom:{borderTopLeftRadius:2,borderTopRightRadius:2,...smoothCorners},underlineTop:{borderBottomLeftRadius:2,borderBottomRightRadius:2,...smoothCorners},badgePill:{position:"absolute",top:-4,right:-8,minWidth:18,height:18,borderRadius:9,...smoothCorners,paddingHorizontal:4,paddingVertical:2,alignItems:"center",justifyContent:"center",borderWidth:1.5},badgeDot:{position:"absolute",top:-2,right:-2,width:10,height:10,borderRadius:5,...smoothCorners,borderWidth:1.5},badgeText:{fontSize:10,fontWeight:"700",lineHeight:12,textAlign:"center",includeFontPadding:!1}});export{BottomNavigation};export default BottomNavigation;
1
+ "use strict";import React,{forwardRef,useEffect,useMemo,useRef}from"react";import{Animated,LayoutAnimation,Platform,Pressable,StyleSheet,Text,View}from"react-native";import{useSafeAreaInsets}from"react-native-safe-area-context";import{useReducedMotion}from"../../hooks/useReducedMotion.js";import{createAnimatedValue,useTheme}from"../../theme/index.js";import{triggerHaptic}from"../../utils/index.js";import{smoothCorners}from"../../utils/corners.js";import{supportsBoxShadow,toBoxShadow}from"../../utils/shadows.js";import{renderSlotIcon}from"../AppIcon/index.js";import{useScreenReaderEnabled}from"./useScreenReaderEnabled.js";import{jsx as _jsx,jsxs as _jsxs,Fragment as _Fragment}from"react/jsx-runtime";const DEFAULT_ICON_SIZE=18,DEFAULT_LABEL_MAX_FONT_SCALE=1.2,ICON_WRAP_AIR=4,PILL_AIR=8,DEFAULT_PILL_MAX_WIDTH=64,TILE_MAX_WIDTH=96,DEFAULT_PILL_INSET=16,DEFAULT_UNDERLINE_HEIGHT=3,DEFAULT_FLOATING_MARGIN=16,DEFAULT_FLOATING_RADIUS=28,DEFAULT_BUBBLE_SIZE=48,DEFAULT_BUBBLE_LIFT=14,DEFAULT_CENTER_SIZE=48,DEFAULT_CENTER_ICON_SIZE=24,CENTER_KEY="__webority_center_action__",TAB_PADDING_VERTICAL=6,BAR_PADDING_HORIZONTAL=4,BAR_PADDING_TOP=6,BAR_PADDING_TOP_BUBBLE=8,FLOATING_BAR_PADDING_VERTICAL=6,FLOATING_BAR_PADDING_HORIZONTAL=8,EXPANDED_FLEX=1.5,SOLID_INACTIVE_OPACITY=.7,TILE_INSET=2,TILE_LABEL_GAP=2,formatBadge=e=>null==e||!1===e?null:!0===e||"·"===e?{text:"",isDot:!0}:"number"==typeof e?e<=0?null:{text:e>99?"99+":String(e),isDot:!1}:"string"==typeof e?0===e.length?null:{text:e,isDot:!1}:null,badgeAccessibilitySuffix=e=>null==e||!1===e?"":"number"==typeof e?e>0?`, ${e} unread`:"":!0===e||"·"===e?", new updates":"string"==typeof e&&e.length>0?`, ${e}`:"",BottomNavigation=forwardRef((e,t)=>{const{tabs:i,centerAction:n,activeTab:o,onChange:r,haptic:a="selection",showLabels:l=!0,variant:s="pill",indicatorPosition:d="bottom",radius:c,indicatorRadius:u="auto",elevation:h,iconSize:m,marginHorizontal:p,marginVertical:g,paddingHorizontal:b,paddingVertical:y,border:f,minimizeOnScroll:x=!1,scrollDirection:_="idle",accessory:A,style:I,indicatorStyle:R,labelStyle:S,labelMaxFontScale:E,testID:w}=e,L=useTheme(),T=useSafeAreaInsets(),D=useMemo(()=>buildStyles(L),[L]),v=L.components.bottomNavigation,C=m??v?.iconSize??18,j=v?.pillHeight??C+4+8,B=v?.pillMaxWidth??64,N=v?.pillInset??16,V=v?.floatingMargin??16,P=v?.floatingRadius??28,M=v?.bubbleSize??48,k=v?.bubbleLift??14,F=useReducedMotion(),H=useScreenReaderEnabled(x),[z,O]=React.useState(null);useEffect(()=>{null!==z&&z!==_&&O(null)},[z,_]);const W=x&&!H&&"down"===_&&null===z,[U,G]=React.useState(W);useEffect(()=>{U!==W&&(F||"web"===Platform.OS||LayoutAnimation.configureNext(LayoutAnimation.Presets.easeInEaseOut),G(W))},[U,W,F]);const $="function"==typeof A?A({minimized:U}):A,X=null!=$&&!1!==$,Z=U&&X,[Y,K]=React.useState(0),q=X&&!Z?Y+L.spacing.xs:0,J="tile"===s,Q="floating"===s||J,ee="bubble"===s,te="expand"===s,ie="solid"===s,ne="pill"===s||Q||ie,oe=Math.max(0,i.findIndex(e=>e.key===o)),[re,ae]=React.useState(0),[le,se]=React.useState(0),de=n?Math.ceil(i.length/2):i.length,ce=i.length+(n?1:0),[ue,he]=React.useState({width:0,height:0}),me=n?.size??48,pe=void 0!==n?.gap,ge=Math.max(0,n?.gap??0),be=pe?(ue.width||me)+2*ge:0,ye=pe?i.length>0?Math.max(0,re-be)/i.length:0:ce>0?re/ce:0,fe=pe?be:ye,xe=useRef(createAnimatedValue(oe)).current,Ae=useRef({}),Ie=useRef({});i.forEach(e=>{Ae.current[e.key]||(Ae.current[e.key]=new Animated.Value(1)),Ie.current[e.key]||(Ie.current[e.key]=createAnimatedValue(e.key===o?1:0))});const Re=ye>0?J?Math.min(ye-4,96):Math.min(ye-N,B):0,Se=ye>0?(ye-Re)/2:0,Ee=ye>0?(ye-M)/2:0,hasLabel=e=>l&&!U&&!1!==e.showLabel&&e.label.trim().length>0,we=i[oe],Le=we&&!hasLabel(we)&&le>0?le/2:6+(C+4)/2,Te=Le-k-M/2,De=Math.max(0,le-4),ve=J?2:Le-j/2,Ce=useRef(oe);useEffect(()=>{if(Ce.current===oe)return;Ce.current=oe;const e=Animated.spring(xe,{toValue:oe,tension:120,friction:14,useNativeDriver:!0});return e.start(),()=>e.stop()},[oe,xe]);const je=Math.max(1,i.length-1),Be=useMemo(()=>{const e=[],t=[];for(let i=0;i<=je;i++)e.push(i),t.push(i<de?i*ye:i*ye+fe);return xe.interpolate({inputRange:e,outputRange:t})},[xe,je,de,ye,fe]),Ne=i.map(e=>e.key).join(" "),Ve=ee||te;useEffect(()=>{const e=Ne.split(" ").flatMap(e=>{const t=e===o?1:0,i=Ie.current[e];return i?Ve?[Animated.spring(i,{toValue:t,tension:140,friction:13,useNativeDriver:!1})]:(i.setValue(t),[]):[]});if(0===e.length)return;const t=Animated.parallel(e);return t.start(),()=>t.stop()},[o,Ne,Ve]);const popIcon=e=>{Animated.sequence([Animated.timing(e,{toValue:1.15,duration:120,useNativeDriver:!0}),Animated.spring(e,{toValue:1,tension:200,friction:8,useNativeDriver:!0})]).start()},Pe=useRef(new Animated.Value(1)).current,{colors:Me}=L,ke=ie?Me.primary:Me.background.elevated,Fe=ie?Me.onPrimary:Me.primary,He=ie?Me.onPrimary:J?Me.text.primary:Me.text.tertiary,ze=ie?Me.onPrimary:Me.primaryMuted,Oe=ie?Me.primary:ee?Me.onPrimary:Fe,We=p??V,Ue=g??(Q?V:0),Ge=Ue>0,$e=y??(Q?6:ee?8:6),Xe=b??(Q?8:4),Ze=Ge?$e:Math.max($e,T.bottom),Ye=Ge?Math.max(Ue,T.bottom>0?T.bottom+L.spacing.sm:0):0,Ke="full"===c,qe=Q?le+q+2*$e+2*StyleSheet.hairlineWidth:le+q+$e+Ze,Je=Ke?le>0?qe/2:L.radius.full:c??v?.borderRadius??(J?L.radius.full:Q?P:0),Qe=void 0!==c||void 0!==v?.borderRadius,activeBgRadius=(e,t)=>"number"==typeof u?Math.max(0,Math.min(u,e/2)):"auto"===u&&Qe?Math.min(Je,e/2):t,et="underline"===s?Math.max(Xe,Ke&&0===le?0:Je):Xe,tt=h??"none",it=L.shadows[tt],nt="none"===tt?null:supportsBoxShadow()?{boxShadow:toBoxShadow(it)}:it,ot=f?StyleSheet.hairlineWidth:0,rt=ie?Me.primary:Me.border.primary,at=n?.lift??0,lt=$e+ot+q,st=n&&le>0?Math.max(0,(ue.height||me)/2+at-le/2-lt):0,dt=n?_jsx(View,{style:[D.centerCell,pe?{flex:0,marginHorizontal:ge}:null],pointerEvents:"box-none",children:_jsx(Pressable,{onPress:()=>{if(!n)return;const e=n.haptic??a;!1!==e&&triggerHaptic(e),popIcon(Pe),n.onPress()},onLayout:e=>{const{width:t,height:i}=e.nativeEvent.layout;he(e=>e.width===t&&e.height===i?e:{width:t,height:i})},accessibilityRole:"button",accessibilityLabel:n.label,hitSlop:{top:6,bottom:6,left:6,right:6},style:({pressed:e})=>[{top:-at},e?{opacity:.85}:null],testID:n.testID??(w?`${w}-center`:void 0),children:n.content?_jsx(Animated.View,{style:{transform:[{scale:Pe}]},children:n.content}):_jsx(View,{style:[D.centerCircle,{width:me,height:me,borderRadius:me/2,...smoothCorners,backgroundColor:n.color??Me.primary}],children:_jsx(Animated.View,{style:{transform:[{scale:Pe}]},children:renderSlotIcon(n.icon??"add",{color:n.iconColor??Me.onPrimary,size:n.iconSize??24,disabled:!1})})})})},CENTER_KEY):null,ct=X?_jsx(View,{style:Z?D.accessoryInline:D.accessoryStacked,onLayout:e=>K(e.nativeEvent.layout.height),testID:w?`${w}-accessory`:void 0,children:$}):null,ut=_jsxs(View,{style:Z?[D.tabRow,D.tabRowInline]:D.tabRow,onLayout:e=>{const{width:t,height:i}=e.nativeEvent.layout;ae(t),se(i)},children:[ne&&Re>0&&(!J||De>0)?_jsx(Animated.View,{pointerEvents:"none",style:[D.pill,{width:Re,height:J?De:j,left:Se,top:ve,backgroundColor:ze,borderRadius:J?activeBgRadius(De,De/2):activeBgRadius(j,L.radius.full),...smoothCorners,transform:[{translateX:Be}]},R]}):null,ee&&ye>0?_jsx(Animated.View,{pointerEvents:"none",style:[D.bubble,L.shadows.md,{width:M,height:M,borderRadius:M/2,...smoothCorners,left:Ee,top:Te,backgroundColor:Me.primary,borderColor:Me.background.elevated,transform:[{translateX:Be}]},R]}):null,(ht=i.map(e=>{const t=e.key===o,i=t?Fe:He,n=t?Oe:He,l="string"==typeof e.icon?{name:e.icon,variant:"bold"}:e.icon,s=t?e.activeIcon??l:e.icon,d=Ae.current[e.key],c=Ie.current[e.key],u=formatBadge(e.badge??null),h=badgeAccessibilitySuffix(e.badge??null),m=ie&&!t?.7:1,p=ee&&t||ie?Me.primary:Me.background.elevated,g=hasLabel(e),b=g&&(!te||t),y=_jsxs(Animated.View,{style:[D.iconWrap,{width:C+4,height:C+4,opacity:m,transform:[{scale:d}]}],children:[renderSlotIcon(s,{color:n,size:C,focused:t,disabled:!1}),u?_jsx(View,{style:[u.isDot?D.badgeDot:D.badgePill,{backgroundColor:Me.error,borderColor:p}],children:u.isDot?null:_jsx(Text,{style:[D.badgeText,{color:Me.onError}],numberOfLines:1,children:u.text})}):null]}),f=ee?_jsx(Animated.View,{style:{top:c.interpolate({inputRange:[0,1],outputRange:[0,-k]})},children:y}):y,x=b?_jsx(Animated.Text,{numberOfLines:1,maxFontSizeMultiplier:E??L.maxFontSizeMultiplier??1.2,style:[D.label,te?D.labelInline:null,{color:i,opacity:te?c:m,fontWeight:t?L.typography.fontWeight.semibold:L.typography.fontWeight.normal},S],children:e.label}):null,A=_jsx(Pressable,{onPress:()=>(e=>{U&&O(_),e.key!==o&&!1!==a&&triggerHaptic(a);const t=Ae.current[e.key];t&&popIcon(t),r(e.key)})(e),accessibilityRole:"tab",accessibilityState:{selected:t},"aria-selected":t,accessibilityLabel:`${e.label}${h}`,accessibilityHint:`Switches to ${e.label}`,hitSlop:{top:6,bottom:6,left:6,right:6},style:({pressed:e})=>[D.tab,J?D.tabTile:null,e?{opacity:.85}:null],testID:w?`${w}-tab-${e.key}`:void 0,children:te?_jsxs(View,{style:[D.expandPill,{height:j,paddingHorizontal:t&&g?L.spacing.md:Math.max(0,(j-(C+4))/2)}],children:[_jsx(View,{pointerEvents:"none",style:[D.expandFill,{borderRadius:activeBgRadius(j,j/2),...smoothCorners,backgroundColor:t?Me.primaryMuted:"transparent"},t?R:null]}),f,x]}):_jsxs(_Fragment,{children:[f,x]})},e.key);return te?_jsx(Animated.View,{style:{flex:c.interpolate({inputRange:[0,1],outputRange:[1,g?1.5:1]})},children:A},e.key):A}),dt?[...ht.slice(0,de),dt,...ht.slice(de)]:ht),"underline"===s&&ye>0?_jsx(Animated.View,{pointerEvents:"none",style:[D.underline,"top"===d?D.underlineTop:D.underlineBottom,"top"===d?{top:-$e-q}:{bottom:-$e},{width:ye,height:v?.underlineHeight??3,backgroundColor:Me.primary,transform:[{translateX:Be}]},R]}):null]});var ht;return _jsx(View,{ref:t,testID:w,accessibilityRole:"tablist",style:[D.outer,{paddingHorizontal:We,paddingTop:Math.max(Ue,st),paddingBottom:Ye},I],children:_jsxs(View,{style:[Q?D.floatingBar:D.dockedBar,Z?D.barInline:null,nt,{backgroundColor:ke,borderColor:rt,borderRadius:Je,...smoothCorners},Q?{borderWidth:ot,paddingHorizontal:Xe,paddingVertical:$e}:{borderTopWidth:ot,borderBottomWidth:ot,borderLeftWidth:ot,borderRightWidth:ot,paddingHorizontal:et,paddingTop:$e,paddingBottom:Ze}],children:[ct,ut]})})});BottomNavigation.displayName="BottomNavigation";const buildStyles=e=>StyleSheet.create({outer:{backgroundColor:"transparent"},dockedBar:{paddingHorizontal:4},floatingBar:{paddingVertical:6,paddingHorizontal:8},tabRow:{flexDirection:"row",alignItems:"stretch",position:"relative"},tabRowInline:{flex:1},barInline:{flexDirection:"row",alignItems:"center"},accessoryStacked:{marginBottom:e.spacing.xs},accessoryInline:{flexShrink:0,marginRight:e.spacing.xs},tab:{flex:1,minHeight:44,alignItems:"center",justifyContent:"center",paddingVertical:6,gap:4},tabTile:{paddingVertical:8,gap:2},centerCell:{flex:1,minHeight:44,alignItems:"center",justifyContent:"center"},centerCircle:{alignItems:"center",justifyContent:"center"},iconWrap:{alignItems:"center",justifyContent:"center",position:"relative"},label:{fontSize:e.typography.fontSize.xs,lineHeight:e.typography.fontSize.xs*e.typography.lineHeight.tight,textAlign:"center",includeFontPadding:!1},labelInline:{fontSize:e.typography.fontSize.sm,lineHeight:e.typography.fontSize.sm*e.typography.lineHeight.tight,flexShrink:1,includeFontPadding:!1},expandPill:{flexDirection:"row",alignItems:"center",justifyContent:"center",gap:e.spacing.xs},expandFill:{position:"absolute",top:0,right:0,bottom:0,left:0,overflow:"hidden"},pill:{position:"absolute",left:0},bubble:{position:"absolute",left:0,borderWidth:3},underline:{position:"absolute",left:0,height:3},underlineBottom:{borderTopLeftRadius:2,borderTopRightRadius:2,...smoothCorners},underlineTop:{borderBottomLeftRadius:2,borderBottomRightRadius:2,...smoothCorners},badgePill:{position:"absolute",top:-4,right:-8,minWidth:18,height:18,borderRadius:9,...smoothCorners,paddingHorizontal:4,paddingVertical:2,alignItems:"center",justifyContent:"center",borderWidth:1.5},badgeDot:{position:"absolute",top:-2,right:-2,width:10,height:10,borderRadius:5,...smoothCorners,borderWidth:1.5},badgeText:{fontSize:10,fontWeight:"700",lineHeight:12,textAlign:"center",includeFontPadding:!1}});export{BottomNavigation};export default BottomNavigation;
@@ -1 +1 @@
1
- "use strict";import{forwardRef,useMemo}from"react";import{Animated,Pressable,StyleSheet,Text,View}from"react-native";import{usePressAnimation}from"../../hooks/usePressAnimation.js";import{fontFor,useTheme}from"../../theme/index.js";import{tintOf}from"../../utils/color.js";import{smoothCorners}from"../../utils/corners.js";import{resolveHaptic,triggerHaptic}from"../../utils/hapticUtils.js";import{renderSlotIcon}from"../AppIcon/slotIcon.js";import{Skeleton}from"../Skeleton/index.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const toneFor=(e,o)=>{switch(o){case"primary":return{base:e.colors.primaryMuted,on:e.colors.primary,ink:e.colors.toneText.primary,border:e.colors.primary,selectedBg:e.colors.primaryMuted,selectedOn:e.colors.primary,selectedInk:e.colors.toneText.primary,selectedBorder:e.colors.primary};case"success":return{base:e.colors.background.tertiary,on:e.colors.success,ink:e.colors.toneText.success,border:e.colors.success,selectedBg:e.colors.primaryMuted,selectedOn:e.colors.primary,selectedInk:e.colors.toneText.primary,selectedBorder:e.colors.primary};case"warning":return{base:e.colors.background.tertiary,on:e.colors.warning,ink:e.colors.toneText.warning,border:e.colors.warning,selectedBg:e.colors.primaryMuted,selectedOn:e.colors.primary,selectedInk:e.colors.toneText.primary,selectedBorder:e.colors.primary};case"error":return{base:e.colors.background.tertiary,on:e.colors.error,ink:e.colors.toneText.error,border:e.colors.error,selectedBg:e.colors.primaryMuted,selectedOn:e.colors.primary,selectedInk:e.colors.toneText.primary,selectedBorder:e.colors.primary};case"info":return{base:e.colors.background.tertiary,on:e.colors.info,ink:e.colors.toneText.info,border:e.colors.info,selectedBg:e.colors.primaryMuted,selectedOn:e.colors.primary,selectedInk:e.colors.toneText.primary,selectedBorder:e.colors.primary};default:return{base:e.colors.background.tertiary,on:e.colors.text.primary,ink:e.colors.text.primary,border:e.colors.border.primary,selectedBg:e.colors.primaryMuted,selectedOn:e.colors.primary,selectedInk:e.colors.toneText.primary,selectedBorder:e.colors.primary}}},SOFT_FILL_OPACITY=.14,SOFT_SELECTED_FILL_OPACITY=.24,sizeMap={sm:{paddingH:10,paddingV:4,fontSize:12,minHeight:26,closeSize:16,closeFont:12,gap:6,iconSize:14},md:{paddingH:12,paddingV:6,fontSize:13,minHeight:32,closeSize:18,closeFont:13,gap:8,iconSize:16}},hasChipCount=e=>null!=e&&""!==e,Chip=forwardRef((e,o)=>{const{label:r,count:t,selected:s=!1,selectionMode:i="single",onPress:l,onClose:n,leftIcon:a,iconVariant:c,variant:d="filled",tone:p="neutral",size:m="md",disabled:u=!1,loading:y=!1,accessibilityLabel:g,haptic:b,style:h,textStyle:f,containerStyle:S,countStyle:x,closeButtonStyle:z,closeIconStyle:k,testID:C}=e,I=useTheme(),M=!!l&&!u,j="radio"===i,H=!!l&&(!u||j),T=hasChipCount(t),{style:w,pressIn:_,pressOut:F}=usePressAnimation({enabled:M}),O=useMemo(()=>toneFor(I,p),[I,p]),B=I.components.chip?.[m],L={paddingH:B?.paddingHorizontal??sizeMap[m].paddingH,paddingV:B?.paddingVertical??sizeMap[m].paddingV,fontSize:B?.fontSize??sizeMap[m].fontSize,minHeight:B?.minHeight??sizeMap[m].minHeight,closeSize:B?.closeSize??sizeMap[m].closeSize,closeFont:B?.closeFontSize??sizeMap[m].closeFont,gap:B?.gap??sizeMap[m].gap,iconSize:B?.iconSize??sizeMap[m].iconSize},V=Math.max(0,Math.ceil((44-L.minHeight)/2)),P=j?{top:V,bottom:V}:void 0,v="filled"===d,A="soft"===d,R=(()=>{if(A){const e=s?O.selectedOn:O.on;return tintOf(e,s?.24:.14,s?O.selectedBg:O.base)}return s?v?O.selectedBg:"transparent":v?O.base:"transparent"})(),D=A?"transparent":s?O.selectedBorder:v?"transparent":O.border,E=u?I.colors.text.disabled:s?A?I.colors.text.primary:O.selectedInk:O.ink,$=v||A?0:I.colors.border.width,handlePress=()=>{if(!M)return;const e=resolveHaptic(b,"selection");e&&triggerHaptic(e),l?.()},N=g??(T?`${r}, ${t}`:r),Y=_jsxs(View,{style:styles.row,children:[a?_jsx(View,{style:{marginRight:L.gap},children:renderSlotIcon(a,{color:E,size:L.iconSize,disabled:u},c)}):null,_jsx(Text,{style:[styles.label,{color:E,fontSize:L.fontSize,...fontFor(I,"medium")},f],numberOfLines:1,children:r??" "}),T?_jsx(Text,{style:[styles.count,{color:E,fontSize:Math.min(I.typography.fontSize.xs,L.fontSize),marginLeft:I.spacing.xs,...fontFor(I,"normal")},x],numberOfLines:1,children:t}):null,n?_jsx(Pressable,{onPress:()=>{u||(!1!==b&&triggerHaptic("impactLight"),n?.())},disabled:u,accessibilityRole:"button",accessibilityLabel:`Remove ${r}`,accessibilityState:{disabled:u},"aria-disabled":u,hitSlop:6,style:({pressed:e})=>[styles.close,{width:L.closeSize,height:L.closeSize,borderRadius:L.closeSize/2,...smoothCorners,marginLeft:L.gap,backgroundColor:e?I.colors.surface.pressed:I.colors.surface.hovered},z],children:_jsx(Text,{style:[{color:E,fontSize:L.closeFont,...fontFor(I,"bold"),lineHeight:L.closeFont+2},k],maxFontSizeMultiplier:1,children:"×"})}):null]}),U={paddingHorizontal:L.paddingH,paddingVertical:L.paddingV,minHeight:L.minHeight,borderRadius:I.radius.full,...smoothCorners,backgroundColor:R,borderWidth:$,borderColor:D,opacity:u?.55:1};let W;return W=H?_jsx(Animated.View,{style:[w,{alignSelf:"flex-start"}],children:_jsx(Pressable,{ref:o,onPress:handlePress,onPressIn:_,onPressOut:F,disabled:!M,accessibilityRole:j?"radio":"multiple"===i?"checkbox":"button",accessibilityLabel:N,accessibilityState:j||"multiple"===i?{checked:s,disabled:u}:{selected:s,disabled:u},"aria-checked":j||"multiple"===i?s:void 0,"aria-selected":j||"multiple"===i?void 0:s,"aria-disabled":u,hitSlop:P,android_ripple:{color:I.colors.surface.pressed,borderless:!1},testID:C,style:({pressed:e})=>[styles.base,U,e&&"outlined"===d?{backgroundColor:I.colors.surface.pressed}:null,S,h],children:Y})}):_jsx(View,{ref:o,style:[styles.base,U,S,h],accessible:!0,accessibilityRole:"text",accessibilityLabel:N,accessibilityState:{selected:s,disabled:u},"aria-selected":s,"aria-disabled":u,testID:C,children:Y}),y?_jsx(ChipSkeleton,{...e}):W});Chip.displayName="Chip";const ChipSkeleton=({label:e,count:o,size:r="md",leftIcon:t,onClose:s,style:i,containerStyle:l})=>{const n=sizeMap[r],a=Math.max(40,Math.min(120,7*(e??"").length)),c=n.minHeight,d=c/2,p=a+2*n.paddingH+(hasChipCount(o)?n.gap/2+7*String(o).length:0)+(void 0!==t?n.gap+14:0)+(void 0!==s?n.gap+n.closeSize:0);return _jsx(Skeleton,{width:p,height:c,radius:d,style:[{alignSelf:"flex-start"},l,i]})};ChipSkeleton.displayName="ChipSkeleton",Chip.Skeleton=ChipSkeleton;const styles=StyleSheet.create({base:{alignSelf:"flex-start",flexDirection:"row",alignItems:"center",justifyContent:"center"},row:{flexDirection:"row",alignItems:"center"},label:{flexShrink:1,textAlign:"center"},count:{flexShrink:0,fontVariant:["tabular-nums"]},close:{alignItems:"center",justifyContent:"center"}});export{Chip};export default Chip;
1
+ "use strict";import{forwardRef,useMemo}from"react";import{Animated,Pressable,StyleSheet,Text,View}from"react-native";import{usePressAnimation}from"../../hooks/usePressAnimation.js";import{fontFor,useTheme}from"../../theme/index.js";import{tintOf}from"../../utils/color.js";import{smoothCorners}from"../../utils/corners.js";import{resolveHaptic,triggerHaptic}from"../../utils/hapticUtils.js";import{renderSlotIcon}from"../AppIcon/slotIcon.js";import{Skeleton}from"../Skeleton/index.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const toneFor=(e,o)=>{switch(o){case"primary":return{base:e.colors.primaryMuted,on:e.colors.primary,ink:e.colors.toneText.primary,border:e.colors.primary,selectedBg:e.colors.primaryMuted,selectedOn:e.colors.primary,selectedInk:e.colors.toneText.primary,selectedBorder:e.colors.primary};case"success":return{base:e.colors.background.tertiary,on:e.colors.success,ink:e.colors.toneText.success,border:e.colors.success,selectedBg:e.colors.primaryMuted,selectedOn:e.colors.primary,selectedInk:e.colors.toneText.primary,selectedBorder:e.colors.primary};case"warning":return{base:e.colors.background.tertiary,on:e.colors.warning,ink:e.colors.toneText.warning,border:e.colors.warning,selectedBg:e.colors.primaryMuted,selectedOn:e.colors.primary,selectedInk:e.colors.toneText.primary,selectedBorder:e.colors.primary};case"error":return{base:e.colors.background.tertiary,on:e.colors.error,ink:e.colors.toneText.error,border:e.colors.error,selectedBg:e.colors.primaryMuted,selectedOn:e.colors.primary,selectedInk:e.colors.toneText.primary,selectedBorder:e.colors.primary};case"info":return{base:e.colors.background.tertiary,on:e.colors.info,ink:e.colors.toneText.info,border:e.colors.info,selectedBg:e.colors.primaryMuted,selectedOn:e.colors.primary,selectedInk:e.colors.toneText.primary,selectedBorder:e.colors.primary};default:return{base:e.colors.background.tertiary,on:e.colors.text.primary,ink:e.colors.text.primary,border:e.colors.border.primary,selectedBg:e.colors.primaryMuted,selectedOn:e.colors.primary,selectedInk:e.colors.toneText.primary,selectedBorder:e.colors.primary}}},SOFT_FILL_OPACITY=.14,SOFT_SELECTED_FILL_OPACITY=.24,sizeMap={sm:{paddingH:10,paddingV:4,fontSize:12,minHeight:26,closeSize:16,closeFont:12,gap:6,iconSize:14},md:{paddingH:12,paddingV:6,fontSize:13,minHeight:32,closeSize:18,closeFont:13,gap:8,iconSize:16}},hasChipCount=e=>null!=e&&""!==e,Chip=forwardRef((e,o)=>{const{label:r,count:t,selected:s=!1,selectionMode:i="single",onPress:l,onClose:n,leftIcon:a,iconVariant:c,variant:d="filled",tone:p="neutral",size:m="md",disabled:u=!1,loading:y=!1,accessibilityLabel:g,haptic:h,style:b,textStyle:f,containerStyle:S,countStyle:x,closeButtonStyle:z,closeIconStyle:k,testID:C}=e,I=useTheme(),M=!!l&&!u,j="radio"===i,H=!!l&&(!u||j),T=hasChipCount(t),{style:w,pressIn:_,pressOut:F}=usePressAnimation({enabled:M}),O=useMemo(()=>toneFor(I,p),[I,p]),B=I.components.chip?.[m],L={paddingH:B?.paddingHorizontal??sizeMap[m].paddingH,paddingV:B?.paddingVertical??sizeMap[m].paddingV,fontSize:B?.fontSize??sizeMap[m].fontSize,minHeight:B?.minHeight??sizeMap[m].minHeight,closeSize:B?.closeSize??sizeMap[m].closeSize,closeFont:B?.closeFontSize??sizeMap[m].closeFont,gap:B?.gap??sizeMap[m].gap,iconSize:B?.iconSize??sizeMap[m].iconSize},V=Math.max(0,Math.ceil((44-L.minHeight)/2)),v=j?{top:V,bottom:V}:void 0,P="filled"===d,R="soft"===d,A=(()=>{if(R){const e=s?O.selectedOn:O.on;return tintOf(e,s?.24:.14,s?O.selectedBg:O.base)}return s?P?O.selectedBg:"transparent":P?O.base:"transparent"})(),D=R?"transparent":s?O.selectedBorder:P?"transparent":O.border,E=u?I.colors.text.disabled:s?R?I.colors.text.primary:O.selectedInk:O.ink,$=P||R?0:I.colors.border.width,handlePress=()=>{if(!M)return;const e=resolveHaptic(h,"selection");e&&triggerHaptic(e),l?.()},N=g??(T?`${r}, ${t}`:r),Y=_jsxs(View,{style:styles.row,children:[a?_jsx(View,{style:{marginRight:L.gap},children:renderSlotIcon(a,{color:E,size:L.iconSize,disabled:u},c)}):null,_jsx(Text,{style:[styles.label,{color:E,fontSize:L.fontSize,...fontFor(I,"medium")},f],numberOfLines:1,children:r??" "}),T?_jsx(Text,{style:[styles.count,{color:E,fontSize:Math.min(I.typography.fontSize.xs,L.fontSize),marginLeft:I.spacing.xs,...fontFor(I,"normal")},x],numberOfLines:1,children:t}):null,n?_jsx(Pressable,{onPress:()=>{u||(!1!==h&&triggerHaptic("impactLight"),n?.())},disabled:u,accessibilityRole:"button",accessibilityLabel:`Remove ${r}`,accessibilityState:{disabled:u},"aria-disabled":u,hitSlop:6,style:({pressed:e})=>[styles.close,{width:L.closeSize,height:L.closeSize,borderRadius:L.closeSize/2,...smoothCorners,marginLeft:L.gap,backgroundColor:e?I.colors.surface.pressed:I.colors.surface.hovered},z],children:_jsx(Text,{style:[{color:E,fontSize:L.closeFont,...fontFor(I,"bold"),lineHeight:L.closeFont+2},k],maxFontSizeMultiplier:1,children:"×"})}):null]}),U={paddingHorizontal:L.paddingH,paddingVertical:L.paddingV,minHeight:L.minHeight,borderRadius:I.radius.full,...smoothCorners,overflow:"hidden",backgroundColor:A,borderWidth:$,borderColor:D,opacity:u?.55:1};let W;return W=H?_jsx(Animated.View,{style:[w,{alignSelf:"flex-start",borderRadius:I.radius.full,...smoothCorners,overflow:"hidden"}],children:_jsx(Pressable,{ref:o,onPress:handlePress,onPressIn:_,onPressOut:F,disabled:!M,accessibilityRole:j?"radio":"multiple"===i?"checkbox":"button",accessibilityLabel:N,accessibilityState:j||"multiple"===i?{checked:s,disabled:u}:{selected:s,disabled:u},"aria-checked":j||"multiple"===i?s:void 0,"aria-selected":j||"multiple"===i?void 0:s,"aria-disabled":u,hitSlop:v,android_ripple:{color:I.colors.surface.pressed,borderless:!1},testID:C,style:({pressed:e})=>[styles.base,U,e&&"outlined"===d?{backgroundColor:I.colors.surface.pressed}:null,S,b],children:Y})}):_jsx(View,{ref:o,style:[styles.base,U,S,b],accessible:!0,accessibilityRole:"text",accessibilityLabel:N,accessibilityState:{selected:s,disabled:u},"aria-selected":s,"aria-disabled":u,testID:C,children:Y}),y?_jsx(ChipSkeleton,{...e}):W});Chip.displayName="Chip";const ChipSkeleton=({label:e,count:o,size:r="md",leftIcon:t,onClose:s,style:i,containerStyle:l})=>{const n=sizeMap[r],a=Math.max(40,Math.min(120,7*(e??"").length)),c=n.minHeight,d=c/2,p=a+2*n.paddingH+(hasChipCount(o)?n.gap/2+7*String(o).length:0)+(void 0!==t?n.gap+14:0)+(void 0!==s?n.gap+n.closeSize:0);return _jsx(Skeleton,{width:p,height:c,radius:d,style:[{alignSelf:"flex-start"},l,i]})};ChipSkeleton.displayName="ChipSkeleton",Chip.Skeleton=ChipSkeleton;const styles=StyleSheet.create({base:{alignSelf:"flex-start",flexDirection:"row",alignItems:"center",justifyContent:"center"},row:{flexDirection:"row",alignItems:"center"},label:{flexShrink:1,textAlign:"center"},count:{flexShrink:0,fontVariant:["tabular-nums"]},close:{alignItems:"center",justifyContent:"center"}});export{Chip};export default Chip;
@@ -1 +1 @@
1
- "use strict";import{isValidElement,useMemo}from"react";import{StyleSheet,Text,View}from"react-native";import{fontFor,useTheme}from"../../theme/index.js";import{Notation,NotationInkContext}from"../Notation/Notation.js";import{resolveColor}from"../Text/Text.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const EMPTY_VALUE="-",rowKey=(e,t)=>e.key??("string"==typeof e.label?`${e.label}-${t}`:`row-${t}`),isEmptyValue=e=>null==e||""===e||Array.isArray(e)&&!e.length,isInlineText=e=>"string"==typeof e||"number"==typeof e||isValidElement(e)&&e.type===Notation||Array.isArray(e)&&e.length>0&&e.every(isInlineText);export const Descriptions=({items:e,columns:t=1,size:o="md",bordered:r=!1,title:l,variant:i="list",style:s,testID:n})=>{const a=useTheme(),c=useMemo(()=>buildStyles(a),[a]),d="sm"===o?a.typography.fontSize.xs:a.typography.fontSize.sm,m="sm"===o?a.typography.fontSize.sm:a.typography.fontSize.base,y="sm"===o?a.spacing.xs:a.spacing.sm,x="summary"===i,u=useMemo(()=>({fontSize:d,color:a.colors.text.tertiary}),[d,a.colors.text.tertiary]),p=useMemo(()=>({fontSize:m,color:a.colors.text.secondary}),[m,a.colors.text.secondary]);return _jsxs(View,{style:[x?null:{gap:y},s],testID:n,children:[l?_jsx(Text,{style:[c.title,{fontSize:a.typography.fontSize.lg,color:a.colors.text.primary}],children:l}):null,e.map((e,o)=>{const l=isEmptyValue(e.value),i=2===t&&!e.full,s=l?a.colors.text.tertiary:resolveColor(a,e.tone??"primary"),n=fontFor(a,e.strong?"semibold":"normal"),f=l||isInlineText(e.value),h=l?"-":"string"==typeof e.value?e.value:_jsx(NotationInkContext.Provider,{value:{fontSize:m,color:s},children:e.value});return _jsxs(View,x?{style:[c.summaryRow,{paddingVertical:y,borderBottomColor:a.colors.border.secondary}],children:[_jsx(Text,{style:[c.summaryLabel,{fontSize:m,color:a.colors.text.secondary}],children:_jsx(NotationInkContext.Provider,{value:p,children:e.label})}),f?_jsx(Text,{style:[c.summaryValue,{fontSize:m,color:s},n],children:h}):_jsx(View,{children:e.value})]}:{style:[i?c.rowSide:c.rowStack,{paddingVertical:y},r&&o>0?c.bordered:null,r&&o>0?{borderTopColor:a.colors.border.secondary}:null],children:["string"==typeof e.label?_jsx(Text,{style:[c.label,{fontSize:d,color:a.colors.text.tertiary},i?c.labelSide:null],children:e.label}):_jsx(View,{style:i?c.labelSide:null,children:_jsx(Text,{style:[c.label,{fontSize:d,color:a.colors.text.tertiary}],children:_jsx(NotationInkContext.Provider,{value:u,children:e.label})})}),f?_jsx(Text,{style:[c.value,{fontSize:m,color:s},e.strong?n:null,i?c.valueSide:null],children:h}):_jsx(View,{style:i?c.valueSide:null,children:e.value})]},rowKey(e,o))})]})};const buildStyles=e=>StyleSheet.create({title:{...fontFor(e,"semibold")},rowStack:{gap:2},rowSide:{flexDirection:"row",alignItems:"flex-start",gap:e.spacing.md},bordered:{borderTopWidth:StyleSheet.hairlineWidth},label:{...fontFor(e,"semibold")},labelSide:{flex:4},value:{...fontFor(e,"normal")},valueSide:{flex:6},summaryRow:{flexDirection:"row",alignItems:"center",gap:e.spacing.md,borderBottomWidth:StyleSheet.hairlineWidth},summaryLabel:{flex:1,...fontFor(e,"normal")},summaryValue:{textAlign:"right"}});export default Descriptions;
1
+ "use strict";import{isValidElement,useMemo}from"react";import{StyleSheet,Text,View}from"react-native";import{fontFor,useTheme}from"../../theme/index.js";import{Notation,NotationInkContext}from"../Notation/Notation.js";import{resolveColor}from"../Text/Text.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const EMPTY_VALUE="-",rowKey=(e,t)=>e.key??("string"==typeof e.label?`${e.label}-${t}`:`row-${t}`),isEmptyValue=e=>null==e||""===e||Array.isArray(e)&&!e.length,isInlineText=e=>"string"==typeof e||"number"==typeof e||isValidElement(e)&&e.type===Notation||Array.isArray(e)&&e.length>0&&e.every(isInlineText);export const Descriptions=({items:e,columns:t=1,size:o="md",bordered:l=!1,title:r,variant:i="list",style:s,testID:n})=>{const a=useTheme(),m=useMemo(()=>buildStyles(a),[a]),d="sm"===o?a.typography.fontSize.xs:a.typography.fontSize.sm,y="sm"===o?a.typography.fontSize.sm:a.typography.fontSize.base,c="sm"===o?a.spacing.xs:a.spacing.sm,x="summary"===i,u=useMemo(()=>({fontSize:d,color:a.colors.text.tertiary}),[d,a.colors.text.tertiary]),p=useMemo(()=>({fontSize:y,color:a.colors.text.secondary}),[y,a.colors.text.secondary]);return _jsxs(View,{style:[x?null:{gap:c},s],testID:n,children:[r?_jsx(Text,{style:[m.title,{fontSize:a.typography.fontSize.lg,color:a.colors.text.primary}],children:r}):null,e.map((e,o)=>{const r=isEmptyValue(e.value),i=2===t&&!e.full,s=r?a.colors.text.tertiary:resolveColor(a,e.tone??"primary"),n=fontFor(a,e.strong?"semibold":"normal"),f=r||isInlineText(e.value),h=r?"-":"string"==typeof e.value?e.value:_jsx(NotationInkContext.Provider,{value:{fontSize:y,color:s},children:e.value});return _jsxs(View,x?{style:[m.summaryRow,{paddingVertical:c,borderBottomColor:a.colors.border.secondary}],children:[_jsx(Text,{style:[m.summaryLabel,{fontSize:y,color:a.colors.text.secondary}],children:_jsx(NotationInkContext.Provider,{value:p,children:e.label})}),f?_jsx(Text,{style:[m.summaryValue,{fontSize:y,color:s},n],children:h}):_jsx(View,{style:m.summaryValueView,children:e.value})]}:{style:[i?m.rowSide:m.rowStack,{paddingVertical:c},l&&o>0?m.bordered:null,l&&o>0?{borderTopColor:a.colors.border.secondary}:null],children:["string"==typeof e.label?_jsx(Text,{style:[m.label,{fontSize:d,color:a.colors.text.tertiary},i?m.labelSide:null],children:e.label}):_jsx(View,{style:i?m.labelSide:null,children:_jsx(Text,{style:[m.label,{fontSize:d,color:a.colors.text.tertiary}],children:_jsx(NotationInkContext.Provider,{value:u,children:e.label})})}),f?_jsx(Text,{style:[m.value,{fontSize:y,color:s},e.strong?n:null,i?m.valueSide:null],children:h}):_jsx(View,{style:i?m.valueSide:null,children:e.value})]},rowKey(e,o))})]})};const buildStyles=e=>StyleSheet.create({title:{...fontFor(e,"semibold")},rowStack:{gap:2},rowSide:{flexDirection:"row",alignItems:"flex-start",gap:e.spacing.md},bordered:{borderTopWidth:StyleSheet.hairlineWidth},label:{...fontFor(e,"semibold")},labelSide:{flex:4},value:{...fontFor(e,"normal")},valueSide:{flex:6},summaryRow:{flexDirection:"row",alignItems:"center",gap:e.spacing.md,borderBottomWidth:StyleSheet.hairlineWidth},summaryLabel:{flex:1,...fontFor(e,"normal")},summaryValue:{textAlign:"right",flexShrink:1,maxWidth:"60%"},summaryValueView:{flexShrink:1,maxWidth:"60%",alignItems:"flex-end"}});export default Descriptions;
@@ -1 +1 @@
1
- "use strict";import{forwardRef,useMemo}from"react";import{Animated,Pressable,StyleSheet,Text,View}from"react-native";import{usePressAnimation}from"../../hooks/usePressAnimation.js";import{fontFor,useTheme}from"../../theme/index.js";import{smoothCorners}from"../../utils/corners.js";import{triggerHaptic}from"../../utils/hapticUtils.js";import{SquircleFill,useSquircle}from"../SquircleFill/SquircleFill.js";import{jsx as _jsx,Fragment as _Fragment,jsxs as _jsxs}from"react/jsx-runtime";const SIZE_FALLBACK={sm:{iconSize:48,titleFontSize:"lg",descriptionFontSize:"sm",paddingVertical:"lg",titleGap:"md",descriptionGap:"xs"},md:{iconSize:64,titleFontSize:"xl",descriptionFontSize:"base",paddingVertical:"xl",titleGap:"md",descriptionGap:"xs"},lg:{iconSize:80,titleFontSize:"2xl",descriptionFontSize:"base",paddingVertical:"2xl",titleGap:"md",descriptionGap:"xs"}},sizeFor=(e,t)=>{const i={...SIZE_FALLBACK[t],...e.components.emptyState?.[t]??{}};return{iconSize:i.iconSize,titleSize:e.typography.fontSize[i.titleFontSize],descriptionSize:e.typography.fontSize[i.descriptionFontSize],paddingVertical:e.spacing[i.paddingVertical],titleGap:e.spacing[i.titleGap],descriptionGap:e.spacing[i.descriptionGap]}},ActionButton=({action:e,variant:t})=>{const i=useTheme(),{style:r,pressIn:o,pressOut:s}=usePressAnimation({enabled:!0}),n=useMemo(()=>buildActionStyles(i),[i]),l="primary"===t,a=useSquircle(!0,i.radius.md),fillFor=e=>l?i.colors.primary:e?i.colors.surface.pressed:"transparent";return _jsx(Animated.View,{style:r,children:_jsx(Pressable,{onPress:()=>{triggerHaptic("selection"),e.onPress()},onPressIn:o,onPressOut:s,accessibilityRole:"button",accessibilityLabel:e.accessibilityLabel??e.label,accessibilityHint:e.accessibilityHint,testID:e.testID,onLayout:a.onLayout,android_ripple:{color:l?i.colors.primaryHover:i.colors.surface.pressed,borderless:!1},style:({pressed:e})=>[n.button,l?n.buttonPrimary:n.buttonSecondary,!e||l||a.active?null:n.buttonSecondaryPressed,a.active?n.buttonSquircleHost:null],children:({pressed:t})=>_jsxs(_Fragment,{children:[a.active&&a.size?_jsx(SquircleFill,{width:a.size.width,height:a.size.height,radius:i.radius.md,fill:fillFor(t),stroke:l?void 0:i.colors.border.primary,strokeWidth:l?0:1,outset:l?0:1}):null,_jsx(Text,{style:[n.buttonText,l?n.buttonTextPrimary:n.buttonTextSecondary],numberOfLines:1,children:e.label})]})})})},EmptyState=forwardRef((e,t)=>{const{icon:i,title:r,description:o,action:s,secondaryAction:n,size:l="md",fill:a=!1,style:c,testID:d}=e,p=useTheme(),m=useMemo(()=>sizeFor(p,l),[p,l]),u=useMemo(()=>buildStyles(p),[p]);return _jsxs(View,{ref:t,accessibilityRole:"summary",testID:d,style:[u.root,{paddingVertical:m.paddingVertical},a?u.fill:null,c],children:[i?_jsx(View,{style:[u.iconCircle,{width:m.iconSize,height:m.iconSize,marginBottom:m.titleGap,borderRadius:m.iconSize/2,...smoothCorners}],children:i}):null,_jsx(Text,{style:[u.title,{fontSize:m.titleSize,...fontFor(p,"semibold")}],children:r}),o?_jsx(Text,{style:[u.description,{fontSize:m.descriptionSize,marginTop:m.descriptionGap}],children:o}):null,s||n?_jsxs(View,{style:u.actions,children:[s?_jsx(ActionButton,{action:s,variant:"primary"}):null,n?_jsx(ActionButton,{action:n,variant:"secondary"}):null]}):null]})});EmptyState.displayName="EmptyState";const buildStyles=e=>StyleSheet.create({root:{alignItems:"center",justifyContent:"center",paddingHorizontal:e.spacing.lg},fill:{flexGrow:1},iconCircle:{backgroundColor:e.colors.surface.disabled,alignItems:"center",justifyContent:"center"},title:{color:e.colors.text.primary,textAlign:"center"},description:{color:e.colors.text.secondary,textAlign:"center",maxWidth:320,lineHeight:e.typography.fontSize.base*e.typography.lineHeight.normal},actions:{flexDirection:"row",alignItems:"center",gap:e.spacing.sm,marginTop:e.spacing.md+e.spacing.xs}}),buildActionStyles=e=>StyleSheet.create({button:{paddingHorizontal:e.spacing.lg,paddingVertical:e.spacing.sm,minHeight:42,borderRadius:e.radius.md,...smoothCorners,alignItems:"center",justifyContent:"center",flexDirection:"row"},buttonPrimary:{backgroundColor:e.colors.primary},buttonSecondary:{backgroundColor:"transparent",borderWidth:1,borderColor:e.colors.border.primary},buttonSecondaryPressed:{backgroundColor:e.colors.surface.pressed},buttonSquircleHost:{backgroundColor:"transparent",borderColor:"transparent",overflow:"visible"},buttonText:{fontSize:e.typography.fontSize.base,...fontFor(e,"semibold")},buttonTextPrimary:{color:e.colors.onPrimary},buttonTextSecondary:{color:e.colors.text.primary}});export{EmptyState};export default EmptyState;
1
+ "use strict";import{forwardRef,useMemo}from"react";import{Animated,Pressable,StyleSheet,Text,View}from"react-native";import{usePressAnimation}from"../../hooks/usePressAnimation.js";import{fontFor,useTheme}from"../../theme/index.js";import{smoothCorners}from"../../utils/corners.js";import{triggerHaptic}from"../../utils/hapticUtils.js";import{SquircleFill,useSquircle}from"../SquircleFill/SquircleFill.js";import{jsx as _jsx,Fragment as _Fragment,jsxs as _jsxs}from"react/jsx-runtime";const SIZE_FALLBACK={sm:{iconSize:48,titleFontSize:"lg",descriptionFontSize:"sm",paddingVertical:"lg",titleGap:"md",descriptionGap:"xs"},md:{iconSize:64,titleFontSize:"xl",descriptionFontSize:"base",paddingVertical:"xl",titleGap:"md",descriptionGap:"xs"},lg:{iconSize:80,titleFontSize:"2xl",descriptionFontSize:"base",paddingVertical:"2xl",titleGap:"md",descriptionGap:"xs"}},sizeFor=(e,t)=>{const i={...SIZE_FALLBACK[t],...e.components.emptyState?.[t]??{}};return{iconSize:i.iconSize,titleSize:e.typography.fontSize[i.titleFontSize],descriptionSize:e.typography.fontSize[i.descriptionFontSize],paddingVertical:e.spacing[i.paddingVertical],titleGap:e.spacing[i.titleGap],descriptionGap:e.spacing[i.descriptionGap]}},ActionButton=({action:e,variant:t})=>{const i=useTheme(),{style:r,pressIn:o,pressOut:s}=usePressAnimation({enabled:!0}),n=useMemo(()=>buildActionStyles(i),[i]),l="primary"===t,a=useSquircle(!0,i.radius.md),fillFor=e=>l?e?i.colors.primaryHover:i.colors.primary:e?i.colors.surface.pressed:"transparent";return _jsx(Animated.View,{style:r,children:_jsx(Pressable,{onPress:()=>{triggerHaptic("selection"),e.onPress()},onPressIn:o,onPressOut:s,accessibilityRole:"button",accessibilityLabel:e.accessibilityLabel??e.label,accessibilityHint:e.accessibilityHint,testID:e.testID,onLayout:a.onLayout,style:({pressed:e})=>[n.button,l?n.buttonPrimary:n.buttonSecondary,e&&!a.active?l?n.buttonPrimaryPressed:n.buttonSecondaryPressed:null,a.active?n.buttonSquircleHost:null],children:({pressed:t})=>_jsxs(_Fragment,{children:[a.active&&a.size?_jsx(SquircleFill,{width:a.size.width,height:a.size.height,radius:i.radius.md,fill:fillFor(t),stroke:l?void 0:i.colors.border.primary,strokeWidth:l?0:1,outset:l?0:1}):null,_jsx(Text,{style:[n.buttonText,l?n.buttonTextPrimary:n.buttonTextSecondary],numberOfLines:1,children:e.label})]})})})},EmptyState=forwardRef((e,t)=>{const{icon:i,title:r,description:o,action:s,secondaryAction:n,size:l="md",fill:a=!1,style:c,testID:d}=e,p=useTheme(),m=useMemo(()=>sizeFor(p,l),[p,l]),u=useMemo(()=>buildStyles(p),[p]);return _jsxs(View,{ref:t,accessibilityRole:"summary",testID:d,style:[u.root,{paddingVertical:m.paddingVertical},a?u.fill:null,c],children:[i?_jsx(View,{style:[u.iconCircle,{width:m.iconSize,height:m.iconSize,marginBottom:m.titleGap,borderRadius:m.iconSize/2,...smoothCorners}],children:i}):null,_jsx(Text,{style:[u.title,{fontSize:m.titleSize,...fontFor(p,"semibold")}],children:r}),o?_jsx(Text,{style:[u.description,{fontSize:m.descriptionSize,marginTop:m.descriptionGap}],children:o}):null,s||n?_jsxs(View,{style:u.actions,children:[s?_jsx(ActionButton,{action:s,variant:"primary"}):null,n?_jsx(ActionButton,{action:n,variant:"secondary"}):null]}):null]})});EmptyState.displayName="EmptyState";const buildStyles=e=>StyleSheet.create({root:{alignItems:"center",justifyContent:"center",paddingHorizontal:e.spacing.lg},fill:{flexGrow:1},iconCircle:{backgroundColor:e.colors.surface.disabled,alignItems:"center",justifyContent:"center"},title:{color:e.colors.text.primary,textAlign:"center"},description:{color:e.colors.text.secondary,textAlign:"center",maxWidth:320,lineHeight:e.typography.fontSize.base*e.typography.lineHeight.normal},actions:{flexDirection:"row",alignItems:"center",gap:e.spacing.sm,marginTop:e.spacing.md+e.spacing.xs}}),buildActionStyles=e=>StyleSheet.create({button:{paddingHorizontal:e.spacing.lg,paddingVertical:e.spacing.sm,minHeight:42,borderRadius:e.radius.md,...smoothCorners,overflow:"hidden",alignItems:"center",justifyContent:"center",flexDirection:"row"},buttonPrimary:{backgroundColor:e.colors.primary},buttonPrimaryPressed:{backgroundColor:e.colors.primaryHover},buttonSecondary:{backgroundColor:"transparent",borderWidth:1,borderColor:e.colors.border.primary},buttonSecondaryPressed:{backgroundColor:e.colors.surface.pressed},buttonSquircleHost:{backgroundColor:"transparent",borderColor:"transparent",overflow:"visible"},buttonText:{fontSize:e.typography.fontSize.base,...fontFor(e,"semibold")},buttonTextPrimary:{color:e.colors.onPrimary},buttonTextSecondary:{color:e.colors.text.primary}});export{EmptyState};export default EmptyState;
@@ -1 +1 @@
1
- "use strict";import{useCallback,useEffect,useMemo,useRef,useState}from"react";import{AccessibilityInfo,Animated,StyleSheet,Text,useWindowDimensions,View}from"react-native";import{usePresenceMotion}from"../../hooks/usePresenceMotion.js";import{createAnimatedValue,useTheme}from"../../theme/index.js";import{smoothCorners}from"../../utils/corners.js";import{Button}from"../Button/index.js";import{Modal}from"../Modal/index.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const DEFAULT_GAP=8,DEFAULT_SCREEN_PADDING=8,MAX_CARD_WIDTH=360,HIGHLIGHT_BORDER_WIDTH=2,measureInWindow=e=>new Promise(t=>{const i=e.current;i?i.measureInWindow((e,i,o,s)=>t({x:e,y:i,width:o,height:s})):t(null)}),isOnScreen=(e,t)=>e.width>0&&e.height>0&&e.x<t.width&&e.y<t.height&&e.x+e.width>0&&e.y+e.height>0,Tour=({tourId:e,steps:t,visible:i,onClose:o,seenStore:s,labels:n,haptic:r,testID:a})=>{const l=useTheme(),c=usePresenceMotion().duration("fast"),u=useMemo(()=>buildStyles(l),[l]),d=useWindowDimensions(),h=useRef(d);h.current=d;const p=l.components.tooltip?.gap??8,m=l.components.tooltip?.screenPadding??8,[g,x]=useState(null),[y,f]=useState(0),b=useRef(createAnimatedValue(0)).current,w=useRef(t);w.current=t;const S=useRef(o);S.current=o;const j=useRef(s);j.current=s;const k=useCallback(async(e,t)=>{for(let i=e;i>=0&&i<w.current.length;i+=t){const e=await measureInWindow(w.current[i].target);if(e&&isOnScreen(e,h.current))return{index:i,rect:e}}return null},[]);useEffect(()=>{if(!i)return void x(null);let t=!1;return(async()=>{const i=j.current;if(i&&await i.isSeen(e))return void(t||S.current("alreadySeen"));const o=await k(0,1);t||(o?(f(o.index),x(o)):S.current("noTargets"))})(),()=>{t=!0}},[i,e,k]),useEffect(()=>{if(!g)return;const e=w.current[g.index],t=`Step ${g.index+1} of ${w.current.length}`;AccessibilityInfo.announceForAccessibility([t,e.title,e.description].filter(Boolean).join(". ")),b.setValue(0);const i=Animated.timing(b,{toValue:1,duration:c,useNativeDriver:!0});return i.start(),()=>i.stop()},[g,b,c]);const _=useCallback(async t=>{x(null),await(j.current?.markSeen(e)),S.current(t)},[e]),C=useCallback(async()=>{if(!g)return;const e=await k(g.index+1,1);e?x(e):await _("finished")},[g,k,_]),v=useCallback(async()=>{if(!g)return;const e=await k(g.index-1,-1);e&&x(e)},[g,k]),D=useCallback(()=>{_("skipped")},[_]),I=g?t[g.index]:void 0,T=!!g&&g.index===t.length-1,M=l.spacing.xs,R=g?{x:g.rect.x-M,y:g.rect.y-M,width:g.rect.width+2*M,height:g.rect.height+2*M}:null,A=Math.min(d.width-2*m,360),V=R?(()=>{const e=R.x+R.width/2,t=Math.max(m,Math.min(e-A/2,d.width-A-m)),i=R.y,o=d.height-(R.y+R.height);return o>=i?{left:t,top:R.y+R.height+p,maxHeight:Math.max(o-p-m,0)}:{left:t,bottom:d.height-R.y+p,maxHeight:Math.max(i-p-m,0)}})():null,P=l.colors.background.overlay;return _jsx(Modal,{visible:null!==g,onRequestClose:D,presentation:"fullScreen",backdropPressClose:!1,backdropStyle:u.transparent,contentStyle:u.transparent,accessibilityLabel:I?.title??I?.description,haptic:r,testID:a,children:R&&V&&I?_jsxs(View,{style:StyleSheet.absoluteFill,children:[_jsx(View,{style:[u.dim,{backgroundColor:P,top:0,left:0,right:0,height:Math.max(R.y,0)}]}),_jsx(View,{style:[u.dim,{backgroundColor:P,top:R.y+R.height,left:0,right:0,bottom:0}]}),_jsx(View,{style:[u.dim,{backgroundColor:P,top:R.y,left:0,width:Math.max(R.x,0),height:R.height}]}),_jsx(View,{style:[u.dim,{backgroundColor:P,top:R.y,left:R.x+R.width,right:0,height:R.height}]}),_jsx(View,{pointerEvents:"none",style:[u.highlight,{top:R.y,left:R.x,width:R.width,height:R.height}]}),_jsxs(Animated.View,{accessibilityLiveRegion:"polite",style:[u.card,V,{width:A,opacity:b}],testID:a?`${a}-card`:void 0,children:[_jsx(Text,{style:u.position,children:`Step ${(g?.index??0)+1} of ${t.length}`}),I.title?_jsx(Text,{style:u.title,accessibilityRole:"header",children:I.title}):null,_jsx(Text,{style:u.description,children:I.description}),_jsxs(View,{style:u.actions,children:[_jsx(Button,{title:n?.skip??"Skip",variant:"ghost",size:"sm",haptic:r,onPress:D,testID:a?`${a}-skip`:void 0}),_jsxs(View,{style:u.navigation,children:[g&&g.index>y?_jsx(Button,{title:n?.back??"Back",variant:"outline",size:"sm",haptic:r,onPress:()=>{v()},testID:a?`${a}-back`:void 0}):null,_jsx(Button,{title:T?n?.done??"Done":n?.next??"Next",size:"sm",haptic:r,onPress:()=>{C()},testID:a?`${a}-next`:void 0})]})]})]})]}):null})};Tour.displayName="Tour";const buildStyles=e=>StyleSheet.create({transparent:{backgroundColor:"transparent"},dim:{position:"absolute"},highlight:{position:"absolute",borderWidth:2,borderColor:e.colors.primary,borderRadius:e.radius.md,...smoothCorners},card:{position:"absolute",backgroundColor:e.colors.background.elevated,borderRadius:e.radius.lg,...smoothCorners,padding:e.spacing.lg,gap:e.spacing.sm,...e.shadows.lg},position:{color:e.colors.text.tertiary,fontSize:e.typography.fontSize.xs},title:{color:e.colors.text.primary,fontSize:e.typography.fontSize.lg,fontWeight:e.typography.fontWeight.semibold},description:{color:e.colors.text.secondary,fontSize:e.typography.fontSize.sm},actions:{flexDirection:"row",alignItems:"center",justifyContent:"space-between",marginTop:e.spacing.xs},navigation:{flexDirection:"row",gap:e.spacing.sm}});export{Tour};export default Tour;
1
+ "use strict";import{useCallback,useEffect,useMemo,useRef,useState}from"react";import{AccessibilityInfo,Animated,StyleSheet,Text,useWindowDimensions,View}from"react-native";import{usePresenceMotion}from"../../hooks/usePresenceMotion.js";import{createAnimatedValue,useTheme}from"../../theme/index.js";import{smoothCorners}from"../../utils/corners.js";import{Button}from"../Button/index.js";import{Modal}from"../Modal/index.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const DEFAULT_GAP=8,DEFAULT_SCREEN_PADDING=8,MAX_CARD_WIDTH=360,HIGHLIGHT_BORDER_WIDTH=2,measureInWindow=e=>new Promise(t=>{const i=e.current;i?i.measureInWindow((e,i,s,n)=>t({x:e,y:i,width:s,height:n})):t(null)}),isOnScreen=(e,t)=>e.width>0&&e.height>0&&e.x<t.width&&e.y<t.height&&e.x+e.width>0&&e.y+e.height>0,Tour=({tourId:e,steps:t,visible:i,onClose:s,seenStore:n,labels:o,haptic:r,testID:a})=>{const l=useTheme(),c=usePresenceMotion().duration("fast"),d=useMemo(()=>buildStyles(l),[l]),u=useWindowDimensions(),h=useRef(u);h.current=u;const p=l.components.tooltip?.gap??8,m=l.components.tooltip?.screenPadding??8,[x,g]=useState(null),[y,f]=useState(0),b=useRef(createAnimatedValue(0)).current,w=useRef(t);w.current=t;const S=useRef(s);S.current=s;const j=useRef(n);j.current=n;const _=useCallback(async(e,t)=>{for(let i=e;i>=0&&i<w.current.length;i+=t){const e=await measureInWindow(w.current[i].target);if(e&&isOnScreen(e,h.current))return{index:i,rect:e}}return null},[]);useEffect(()=>{if(!i)return void g(null);let t=!1;return(async()=>{const i=j.current;if(i&&await i.isSeen(e))return void(t||S.current("alreadySeen"));const s=await _(0,1);t||(s?(f(s.index),g(s)):S.current("noTargets"))})(),()=>{t=!0}},[i,e,_]),useEffect(()=>{if(!x)return;const e=w.current[x.index],t=`Step ${x.index+1} of ${w.current.length}`;AccessibilityInfo.announceForAccessibility([t,e.title,e.description].filter(Boolean).join(". ")),b.setValue(0);const i=Animated.timing(b,{toValue:1,duration:c,useNativeDriver:!0});return i.start(),()=>i.stop()},[x,b,c]);const k=useCallback(async t=>{g(null),await(j.current?.markSeen(e)),S.current(t)},[e]),v=useCallback(async()=>{if(!x)return;const e=await _(x.index+1,1);e?g(e):await k("finished")},[x,_,k]),D=useCallback(async()=>{if(!x)return;const e=await _(x.index-1,-1);e&&g(e)},[x,_]),C=useCallback(()=>{k("skipped")},[k]),I=x?t[x.index]:void 0,T=!!x&&x.index===t.length-1,M=l.spacing.xs,R=x?{x:x.rect.x-M,y:x.rect.y-M,width:x.rect.width+2*M,height:x.rect.height+2*M}:null,A=Math.min(u.width-2*m,360),P=R?(()=>{const e=R.x+R.width/2,t=Math.max(m,Math.min(e-A/2,u.width-A-m)),i=R.y,s=u.height-(R.y+R.height);return s>=i?{left:t,top:R.y+R.height+p,maxHeight:Math.max(s-p-m,0)}:{left:t,bottom:u.height-R.y+p,maxHeight:Math.max(i-p-m,0)}})():null,V=l.colors.background.overlay,W=R?Math.min(I?.radius?l.radius[I.radius]+M:l.radius.md,Math.min(R.width,R.height)/2):0,z=Math.max(u.width,u.height);return _jsx(Modal,{visible:null!==x,onRequestClose:C,presentation:"fullScreen",backdropPressClose:!1,backdropStyle:d.transparent,contentStyle:d.transparent,accessibilityLabel:I?.title??I?.description,haptic:r,testID:a,children:R&&P&&I?_jsxs(View,{style:StyleSheet.absoluteFill,children:[_jsx(View,{style:[d.dim,{borderColor:V,borderWidth:z,top:R.y-z,left:R.x-z,width:R.width+2*z,height:R.height+2*z,borderRadius:W+z}]}),_jsx(View,{pointerEvents:"none",style:[d.highlight,{top:R.y,left:R.x,width:R.width,height:R.height,borderRadius:W}]}),_jsxs(Animated.View,{accessibilityLiveRegion:"polite",style:[d.card,P,{width:A,opacity:b}],testID:a?`${a}-card`:void 0,children:[_jsx(Text,{style:d.position,children:`Step ${(x?.index??0)+1} of ${t.length}`}),I.title?_jsx(Text,{style:d.title,accessibilityRole:"header",children:I.title}):null,_jsx(Text,{style:d.description,children:I.description}),_jsxs(View,{style:d.actions,children:[_jsx(Button,{title:o?.skip??"Skip",variant:"ghost",size:"sm",haptic:r,onPress:C,testID:a?`${a}-skip`:void 0}),_jsxs(View,{style:d.navigation,children:[x&&x.index>y?_jsx(Button,{title:o?.back??"Back",variant:"outline",size:"sm",haptic:r,onPress:()=>{D()},testID:a?`${a}-back`:void 0}):null,_jsx(Button,{title:T?o?.done??"Done":o?.next??"Next",size:"sm",haptic:r,onPress:()=>{v()},testID:a?`${a}-next`:void 0})]})]})]})]}):null})};Tour.displayName="Tour";const buildStyles=e=>StyleSheet.create({transparent:{backgroundColor:"transparent"},dim:{position:"absolute"},highlight:{position:"absolute",borderWidth:2,borderColor:e.colors.primary,borderRadius:e.radius.md,...smoothCorners},card:{position:"absolute",backgroundColor:e.colors.background.elevated,borderRadius:e.radius.lg,...smoothCorners,padding:e.spacing.lg,gap:e.spacing.sm,...e.shadows.lg},position:{color:e.colors.text.tertiary,fontSize:e.typography.fontSize.xs},title:{color:e.colors.text.primary,fontSize:e.typography.fontSize.lg,fontWeight:e.typography.fontWeight.semibold},description:{color:e.colors.text.secondary,fontSize:e.typography.fontSize.sm},actions:{flexDirection:"row",alignItems:"center",justifyContent:"space-between",marginTop:e.spacing.xs},navigation:{flexDirection:"row",gap:e.spacing.sm}});export{Tour};export default Tour;
@@ -183,8 +183,9 @@ export interface BottomNavigationProps {
183
183
  /**
184
184
  * Air above and below the bar surface, in pixels. Default 16 for the
185
185
  * `floating` and `tile` capsules and 0 for a docked bar. Above zero it
186
- * lifts any variant off the screen edge, and the safe-area inset then goes
187
- * into that lift instead of the surface.
186
+ * lifts any variant off the screen edge. Over a safe-area inset (a home
187
+ * indicator or Android's system buttons) the lift is the inset plus
188
+ * `theme.spacing.sm`, never less than this margin.
188
189
  */
189
190
  marginVertical?: number;
190
191
  /**
@@ -1,5 +1,6 @@
1
1
  import type React from 'react';
2
2
  import type { View as RNView } from 'react-native';
3
+ import type { Theme } from '../../theme/types';
3
4
  import type { HapticType } from '../../utils/hapticUtils';
4
5
  export interface TourStep {
5
6
  /**
@@ -10,6 +11,12 @@ export interface TourStep {
10
11
  target: React.RefObject<RNView | null>;
11
12
  title?: string;
12
13
  description: string;
14
+ /**
15
+ * Corner radius of the target view, as a theme radius key, so the cutout and
16
+ * its outline follow a rounded card. The cutout's own padding is added to it.
17
+ * Default: `theme.radius.md` for the cutout.
18
+ */
19
+ radius?: keyof Theme['radius'];
13
20
  }
14
21
  /**
15
22
  * Where the app remembers that a person has seen a tour: one record per tour
@@ -183,8 +183,9 @@ export interface BottomNavigationProps {
183
183
  /**
184
184
  * Air above and below the bar surface, in pixels. Default 16 for the
185
185
  * `floating` and `tile` capsules and 0 for a docked bar. Above zero it
186
- * lifts any variant off the screen edge, and the safe-area inset then goes
187
- * into that lift instead of the surface.
186
+ * lifts any variant off the screen edge. Over a safe-area inset (a home
187
+ * indicator or Android's system buttons) the lift is the inset plus
188
+ * `theme.spacing.sm`, never less than this margin.
188
189
  */
189
190
  marginVertical?: number;
190
191
  /**
@@ -1,5 +1,6 @@
1
1
  import type React from 'react';
2
2
  import type { View as RNView } from 'react-native';
3
+ import type { Theme } from '../../theme/types.js';
3
4
  import type { HapticType } from '../../utils/hapticUtils.js';
4
5
  export interface TourStep {
5
6
  /**
@@ -10,6 +11,12 @@ export interface TourStep {
10
11
  target: React.RefObject<RNView | null>;
11
12
  title?: string;
12
13
  description: string;
14
+ /**
15
+ * Corner radius of the target view, as a theme radius key, so the cutout and
16
+ * its outline follow a rounded card. The cutout's own padding is added to it.
17
+ * Default: `theme.radius.md` for the cutout.
18
+ */
19
+ radius?: keyof Theme['radius'];
13
20
  }
14
21
  /**
15
22
  * Where the app remembers that a person has seen a tour: one record per tour
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@webority/mobile-ui",
3
- "version": "0.18.0",
3
+ "version": "0.18.1",
4
4
  "description": "Beautiful, animated, accessible React Native components, theme and form engine for Webority projects.",
5
5
  "keywords": [
6
6
  "react-native",
@@ -117,7 +117,7 @@
117
117
  ]
118
118
  },
119
119
  "devDependencies": {
120
- "@webority/mobile-core": "0.18.0"
120
+ "@webority/mobile-core": "0.18.1"
121
121
  },
122
122
  "scripts": {
123
123
  "build": "bob build && node ../../scripts/minify-lib.mjs",