@webority/mobile-ui 0.17.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.
- package/lib/commonjs/canvasKit/index.js +1 -1
- package/lib/commonjs/components/AppBar/AppBar.js +1 -1
- package/lib/commonjs/components/BottomNavigation/BottomNavigation.js +1 -1
- package/lib/commonjs/components/Button/Button.js +1 -1
- package/lib/commonjs/components/Chip/Chip.js +1 -1
- package/lib/commonjs/components/Descriptions/Descriptions.js +1 -1
- package/lib/commonjs/components/Dialog/Dialog.js +1 -1
- package/lib/commonjs/components/EmptyState/EmptyState.js +1 -1
- package/lib/commonjs/components/ForceUpdateDialog/ForceUpdateDialog.js +1 -1
- package/lib/commonjs/components/ListItem/ListItem.js +1 -1
- package/lib/commonjs/components/OTPInput/OTPInput.js +1 -1
- package/lib/commonjs/components/TagInput/TagInput.js +1 -1
- package/lib/commonjs/components/Tour/Tour.js +1 -1
- package/lib/commonjs/theme/tokens.js +1 -1
- package/lib/module/canvasKit/index.js +1 -1
- package/lib/module/components/AppBar/AppBar.js +1 -1
- package/lib/module/components/BottomNavigation/BottomNavigation.js +1 -1
- package/lib/module/components/Button/Button.js +1 -1
- package/lib/module/components/Chip/Chip.js +1 -1
- package/lib/module/components/Descriptions/Descriptions.js +1 -1
- package/lib/module/components/Dialog/Dialog.js +1 -1
- package/lib/module/components/EmptyState/EmptyState.js +1 -1
- package/lib/module/components/ForceUpdateDialog/ForceUpdateDialog.js +1 -1
- package/lib/module/components/ListItem/ListItem.js +1 -1
- package/lib/module/components/OTPInput/OTPInput.js +1 -1
- package/lib/module/components/TagInput/TagInput.js +1 -1
- package/lib/module/components/Tour/Tour.js +1 -1
- package/lib/module/theme/tokens.js +1 -1
- package/lib/typescript/commonjs/canvasKit/index.d.ts +8 -1
- package/lib/typescript/commonjs/components/BottomNavigation/BottomNavigation.d.ts +3 -2
- package/lib/typescript/commonjs/components/Dialog/Dialog.d.ts +1 -1
- package/lib/typescript/commonjs/components/FilePicker/FilePicker.d.ts +9 -9
- package/lib/typescript/commonjs/components/ListItem/ListItem.d.ts +5 -0
- package/lib/typescript/commonjs/components/OTPInput/OTPInput.d.ts +3 -1
- package/lib/typescript/commonjs/components/ProfilePicker/ProfilePicker.d.ts +6 -6
- package/lib/typescript/commonjs/components/TagInput/TagInput.d.ts +3 -1
- package/lib/typescript/commonjs/components/Tour/Tour.d.ts +7 -0
- package/lib/typescript/module/canvasKit/index.d.ts +8 -1
- package/lib/typescript/module/components/BottomNavigation/BottomNavigation.d.ts +3 -2
- package/lib/typescript/module/components/Dialog/Dialog.d.ts +1 -1
- package/lib/typescript/module/components/FilePicker/FilePicker.d.ts +9 -9
- package/lib/typescript/module/components/ListItem/ListItem.d.ts +5 -0
- package/lib/typescript/module/components/OTPInput/OTPInput.d.ts +3 -1
- package/lib/typescript/module/components/ProfilePicker/ProfilePicker.d.ts +6 -6
- package/lib/typescript/module/components/TagInput/TagInput.d.ts +3 -1
- package/lib/typescript/module/components/Tour/Tour.d.ts +7 -0
- package/package.json +3 -3
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.phoneChromeEntries=exports.StatusBar=exports.SafeArea=exports.KeyboardFrame=exports.HomeIndicator=void 0;var _react=require("react"),_reactNative=require("react-native"),_reactNativeKeyboardController=require("react-native-keyboard-controller"),_index=require("../theme/index.js");const STATUS_BAR_HEIGHT={Ios:54,Android:24},HOME_AREA_HEIGHT={Ios:34,Android:0},HOME_BAR_WIDTH=134,HOME_BAR_HEIGHT=5,MARKER={statusBar:"AppStatusBar",homeIndicator:"AppHomeIndicator",safeArea:"AppSafeArea",keyboardFrame:"AppKeyboardFrame"},wuiMarker=e=>({dataSet:{wui:e}}),paletteFor=e=>"dark"===e?_index.darkTheme:_index.lightTheme,styles=_reactNative.StyleSheet.create({overlayTop:{position:"absolute",top:0,left:0,right:0},overlayBottom:{position:"absolute",bottom:0,left:0,right:0,alignItems:"center",justifyContent:"flex-end"},fill:{flex:1},homeBar:{width:134,height:5}}),StatusBar=({os:e,colorMode:r="light"})=>{const t=paletteFor(r);return(0,_react.createElement)(_reactNative.View,{...wuiMarker(MARKER.statusBar),accessibilityElementsHidden:!0,importantForAccessibility:"no-hide-descendants",pointerEvents:"none",style:[styles.overlayTop,{height:STATUS_BAR_HEIGHT[e],backgroundColor:t.colors.background.primary}]})};exports.StatusBar=StatusBar;const HomeIndicator=({os:e,colorMode:r="light"})=>{const t=paletteFor(r);return(0,_react.createElement)(_reactNative.View,{...wuiMarker(MARKER.homeIndicator),accessibilityElementsHidden:!0,importantForAccessibility:"no-hide-descendants",pointerEvents:"none",style:[styles.overlayBottom,{height:HOME_AREA_HEIGHT[e]}]},"Ios"===e?(0,_react.createElement)(_reactNative.View,{style:[styles.homeBar,{backgroundColor:t.colors.text.primary,borderRadius:t.radius.full,marginBottom:t.spacing.sm}]}):null)};exports.HomeIndicator=HomeIndicator;const SafeArea=({os:e,children:r})=>(0,_react.createElement)(_reactNative.View,{...wuiMarker(MARKER.safeArea),style:[styles.fill,{paddingTop:STATUS_BAR_HEIGHT[e],paddingBottom:HOME_AREA_HEIGHT[e]}]},r);exports.SafeArea=SafeArea;const KeyboardFrame=({colorMode:e="light",children:
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.phoneChromeEntries=exports.StatusBar=exports.SafeArea=exports.NavigationBar=exports.KeyboardFrame=exports.HomeIndicator=void 0;var _react=require("react"),_reactNative=require("react-native"),_reactNativeKeyboardController=require("react-native-keyboard-controller"),_index=require("../theme/index.js");const STATUS_BAR_HEIGHT={Ios:54,Android:24},HOME_AREA_HEIGHT={Ios:34,Android:0},HOME_BAR_WIDTH=134,HOME_BAR_HEIGHT=5,NAV_BAR_HEIGHT=24,NAV_PILL_WIDTH=108,NAV_PILL_HEIGHT=4,KEYBOARD_HEIGHT_IOS=336,KEYBOARD_HEIGHT_ANDROID=300,MARKER={statusBar:"AppStatusBar",homeIndicator:"AppHomeIndicator",navigationBar:"AppNavigationBar",safeArea:"AppSafeArea",keyboardFrame:"AppKeyboardFrame"},wuiMarker=e=>({dataSet:{wui:e}}),paletteFor=e=>"dark"===e?_index.darkTheme:_index.lightTheme,styles=_reactNative.StyleSheet.create({overlayTop:{position:"absolute",top:0,left:0,right:0},overlayBottom:{position:"absolute",bottom:0,left:0,right:0,alignItems:"center",justifyContent:"flex-end"},fill:{flex:1},homeBar:{width:134,height:5},navPill:{width:108,height:4},keyboardPreview:{position:"absolute",bottom:0,left:0,right:0}}),StatusBar=({os:e,colorMode:r="light"})=>{const t=paletteFor(r);return(0,_react.createElement)(_reactNative.View,{...wuiMarker(MARKER.statusBar),accessibilityElementsHidden:!0,importantForAccessibility:"no-hide-descendants",pointerEvents:"none",style:[styles.overlayTop,{height:STATUS_BAR_HEIGHT[e],backgroundColor:t.colors.background.primary}]})};exports.StatusBar=StatusBar;const HomeIndicator=({os:e,colorMode:r="light"})=>{const t=paletteFor(r);return(0,_react.createElement)(_reactNative.View,{...wuiMarker(MARKER.homeIndicator),accessibilityElementsHidden:!0,importantForAccessibility:"no-hide-descendants",pointerEvents:"none",style:[styles.overlayBottom,{height:HOME_AREA_HEIGHT[e]}]},"Ios"===e?(0,_react.createElement)(_reactNative.View,{style:[styles.homeBar,{backgroundColor:t.colors.text.primary,borderRadius:t.radius.full,marginBottom:t.spacing.sm}]}):null)};exports.HomeIndicator=HomeIndicator;const NavigationBar=({os:e,colorMode:r="light"})=>{if("Android"!==e)return null;const t=paletteFor(r);return(0,_react.createElement)(_reactNative.View,{...wuiMarker(MARKER.navigationBar),accessibilityElementsHidden:!0,importantForAccessibility:"no-hide-descendants",pointerEvents:"none",style:[styles.overlayBottom,{height:24,justifyContent:"center"}]},(0,_react.createElement)(_reactNative.View,{style:[styles.navPill,{backgroundColor:t.colors.text.primary,borderRadius:t.radius.full}]}))};exports.NavigationBar=NavigationBar;const SafeArea=({os:e,children:r})=>(0,_react.createElement)(_reactNative.View,{...wuiMarker(MARKER.safeArea),style:[styles.fill,{paddingTop:STATUS_BAR_HEIGHT[e],paddingBottom:HOME_AREA_HEIGHT[e]}]},r);exports.SafeArea=SafeArea;const KEYBOARD_PREVIEW_HEIGHT={ios:336,android:300},KeyboardFrame=({colorMode:e="light",previewOs:r,children:t})=>{const o=paletteFor(e),a=(0,_reactNativeKeyboardController.useKeyboardState)(e=>Math.max(0,Math.round(e.height)));return(0,_react.createElement)(_reactNative.View,{...wuiMarker(MARKER.keyboardFrame),style:[styles.fill,{paddingBottom:a,backgroundColor:o.colors.background.primary}]},t,r?(0,_react.createElement)(_reactNative.View,{pointerEvents:"none",style:[styles.keyboardPreview,{height:KEYBOARD_PREVIEW_HEIGHT[r],backgroundColor:o.colors.background.primary}]}):null)};exports.KeyboardFrame=KeyboardFrame;const SOURCE="@webority/mobile-ui",osProp={name:"os",type:"enum",enum:["Ios","Android"],required:!0},colorModeProp={name:"colorMode",type:"enum",enum:["light","dark"],required:!1},phoneChromeEntries=exports.phoneChromeEntries=[{name:"StatusBar",marker:MARKER.statusBar,acceptsChildren:!1,props:[osProp,colorModeProp],itemsTakeAction:[],takesAction:[],source:SOURCE},{name:"HomeIndicator",marker:MARKER.homeIndicator,acceptsChildren:!1,props:[osProp,colorModeProp],itemsTakeAction:[],takesAction:[],source:SOURCE},{name:"NavigationBar",marker:MARKER.navigationBar,acceptsChildren:!1,props:[osProp,colorModeProp],itemsTakeAction:[],takesAction:[],source:SOURCE},{name:"SafeArea",marker:MARKER.safeArea,acceptsChildren:!0,props:[osProp],itemsTakeAction:[],takesAction:[],source:SOURCE},{name:"KeyboardFrame",marker:MARKER.keyboardFrame,acceptsChildren:!0,props:[colorModeProp],itemsTakeAction:[],takesAction:[],source:SOURCE}];
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=exports.AppBar=void 0;var _react=require("react"),_reactNative=require("react-native"),_reactNativeSafeAreaContext=require("react-native-safe-area-context"),_usePressAnimation=require("../../hooks/usePressAnimation.js"),_index=require("../../theme/index.js"),_corners=require("../../utils/corners.js"),_hapticUtils=require("../../utils/hapticUtils.js"),_AppIcon=require("../AppIcon/AppIcon.js"),_Text=require("../Text/Text.js"),_jsxRuntime=require("react/jsx-runtime");const variantSize=(t
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=exports.AppBar=void 0;var _react=require("react"),_reactNative=require("react-native"),_reactNativeSafeAreaContext=require("react-native-safe-area-context"),_usePressAnimation=require("../../hooks/usePressAnimation.js"),_index=require("../../theme/index.js"),_corners=require("../../utils/corners.js"),_hapticUtils=require("../../utils/hapticUtils.js"),_AppIcon=require("../AppIcon/AppIcon.js"),_Text=require("../Text/Text.js"),_jsxRuntime=require("react/jsx-runtime");const variantSize=(e,t)=>{switch(t){case"compact":return{height:44,titleSize:e.typography.fontSize.lg,titleWeight:"semibold",alignBottom:!1};case"large":return{height:96,titleSize:e.typography.fontSize["2xl"],titleWeight:"bold",alignBottom:!0};default:return{height:56,titleSize:e.typography.fontSize.lg,titleWeight:"semibold",alignBottom:!1}}},ActionButton=({action:e,side:t,badgeStyle:i,haptic:n,flush:a})=>{const o=(0,_index.useTheme)(),{style:r,pressIn:s,pressOut:l}=(0,_usePressAnimation.usePressAnimation)({enabled:!0}),c=(0,_react.useMemo)(()=>buildActionStyles(o),[o]),p=e.badge,d=void 0!==p&&0!==p,u=void 0!==e.text;return(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{style:r,children:(0,_jsxRuntime.jsxs)(_reactNative.Pressable,{onPress:()=>{const t=(0,_hapticUtils.resolveHaptic)(n,"selection");t&&(0,_hapticUtils.triggerHaptic)(t),e.onPress()},onPressIn:s,onPressOut:l,accessibilityRole:"button",accessibilityLabel:e.accessibilityLabel??e.text,testID:e.testID,android_ripple:{color:o.colors.surface.pressed,borderless:!u},style:({pressed:e})=>[u?c.textButton:c.actionButton,a?null:"left"===t?c.actionLeft:c.actionRight,e&&!u?c.actionPressed:null,e&&u?c.textPressed:null],children:[u?(0,_jsxRuntime.jsx)(_reactNative.Text,{style:c.actionText,numberOfLines:1,children:e.text}):(0,_jsxRuntime.jsx)(_reactNative.View,{style:c.iconWrap,children:e.icon}),d?(0,_jsxRuntime.jsx)(_reactNative.View,{style:[c.badge,i],pointerEvents:"none",children:(0,_jsxRuntime.jsx)(_reactNative.Text,{style:c.badgeText,numberOfLines:1,children:String(p)})}):null,e.dot?(0,_jsxRuntime.jsx)(_reactNative.View,{testID:e.testID?`${e.testID}-dot`:"appbar-action-dot",style:c.dot,pointerEvents:"none"}):null]})})},COLLAPSE_RANGE=60,LARGE_TITLE_SCALE_END=.71,AppBar=exports.AppBar=(0,_react.forwardRef)((e,t)=>{const{title:i,subtitle:n,titleAlignment:a="left",leftAction:o,rightActions:r,leading:s,trailing:l,onBack:c,gutter:p,titleVariant:d,titleOffset:u,height:m,divider:g,variant:h="default",transparent:x=!1,scrollY:f,style:_,containerStyle:y,titleStyle:b,subtitleStyle:j,badgeStyle:S,haptic:v,testID:B}=e,R=(0,_index.useTheme)(),A=(0,_reactNativeSafeAreaContext.useSafeAreaInsets)(),N=(0,_react.useMemo)(()=>variantSize(R,h),[R,h]),w=(0,_react.useMemo)(()=>buildStyles(R),[R]),C="large"===h&&void 0!==f,z=R.components.appBar?.iconSize??24,I=R.components.appBar?.actionButtonSize??44,T=o??(c?{icon:(0,_jsxRuntime.jsx)(_AppIcon.AppIcon,{name:"arrow-left",size:z,color:R.colors.text.primary}),onPress:c,accessibilityLabel:"Back"}:void 0),W=l?void 0:r?.[r.length-1],opticalInset=e=>void 0===e?0:void 0!==e.text?R.spacing.sm:Math.max((I-z)/2,0),L=void 0===p?null:{paddingLeft:Math.max(p-opticalInset(T),0),paddingRight:Math.max(p-opticalInset(W),0)},V=void 0!==u,O=Boolean(T)||Boolean(s),P=g??!x,D=R.components.appBar?.dividerWidth??_reactNative.StyleSheet.hairlineWidth,H=R.components.appBar?.collapseTranslateDistance??-20,E=(0,_react.useMemo)(()=>{if(!f)return null;const e={inputRange:[0,60],extrapolate:"clamp"};return{titleScale:f.interpolate({...e,outputRange:[1,.71]}),titleTranslateY:f.interpolate({...e,outputRange:[0,H]}),titleTranslateX:f.interpolate({...e,outputRange:"center"===a?[0,0]:[0,8]}),subtitleOpacity:f.interpolate({inputRange:[0,30],outputRange:[1,0],extrapolate:"clamp"}),barHeight:f.interpolate({...e,outputRange:[96,56]}),borderOpacity:f.interpolate({...e,outputRange:[0,1]})}},[f,a,H]),M=C&&E?{transform:[{translateX:E.titleTranslateX},{translateY:E.titleTranslateY},{scale:E.titleScale}]}:null,k=i?d?(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{style:M,children:(0,_jsxRuntime.jsx)(_Text.Text,{variant:d,align:"center"===a?"center":"left",accessibilityRole:"header",numberOfLines:1,style:[w.titleVariant,b],children:i})}):(0,_jsxRuntime.jsx)(_reactNative.Animated.Text,{accessibilityRole:"header",style:[w.title,{fontSize:N.titleSize,fontWeight:R.typography.fontWeight[N.titleWeight],textAlign:"center"===a?"center":"left"},M,b],numberOfLines:1,children:i}):null,q=n?(0,_jsxRuntime.jsx)(_reactNative.Animated.Text,{style:[w.subtitle,{textAlign:"center"===a?"center":"left"},C&&E?{opacity:E.subtitleOpacity}:null,j],numberOfLines:1,children:n}):null,U=(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[w.titleColumn,"center"===a?w.titleColumnCenter:null,N.alignBottom?w.titleColumnBottom:null],children:[k,q]}),Y=C?_reactNative.Animated.View:_reactNative.View,F=C&&E?{height:_reactNative.Animated.add(E.barHeight,new _reactNative.Animated.Value(A.top))}:{height:(m??N.height)+A.top};return(0,_jsxRuntime.jsxs)(Y,{ref:t,testID:B,style:[w.root,{paddingTop:A.top,backgroundColor:x?"transparent":R.colors.background.elevated},F,!C&&P?{borderBottomWidth:D,borderBottomColor:R.colors.border.primary}:null,_,y],children:[C&&E&&P?(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{pointerEvents:"none",style:[w.animatedBorder,{backgroundColor:R.colors.border.primary,opacity:E.borderOpacity}]}):null,(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[w.row,N.alignBottom?w.rowAlignBottom:null,L,{flex:1}],children:[(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[w.sideSlot,V?w.sideSlotCompact:null],children:[T?(0,_jsxRuntime.jsx)(ActionButton,{action:T,side:"left",haptic:v,flush:V}):null,null!=s&&!1!==s?(0,_jsxRuntime.jsx)(_reactNative.View,{style:w.slotNode,children:s}):null]}),(0,_jsxRuntime.jsx)(_reactNative.View,{pointerEvents:"none",style:[w.center,"center"===a?w.centerAligned:w.centerLeft,V?{paddingLeft:O?u:0,paddingRight:0}:null],children:U}),(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[w.sideSlot,w.sideSlotRight,V?w.sideSlotCompact:null],children:[r?.map((e,t)=>(0,_jsxRuntime.jsx)(ActionButton,{action:e,side:"right",badgeStyle:S,haptic:v,flush:V},`appbar-right-${t}`)),null!=l&&!1!==l?(0,_jsxRuntime.jsx)(_reactNative.View,{style:w.slotNode,children:l}):null]})]})]})});AppBar.displayName="AppBar";const buildStyles=e=>_reactNative.StyleSheet.create({root:{width:"100%"},row:{flexDirection:"row",alignItems:"center",paddingHorizontal:e.spacing.xs},rowAlignBottom:{alignItems:"flex-end",paddingBottom:e.spacing.sm},sideSlot:{flexDirection:"row",alignItems:"center",minWidth:e.components.appBar?.sideSlotMinWidth??48},sideSlotRight:{justifyContent:"flex-end"},sideSlotCompact:{minWidth:0},slotNode:{flexDirection:"row",alignItems:"center"},center:{flex:1,paddingHorizontal:e.spacing.xs},centerAligned:{alignItems:"center"},centerLeft:{alignItems:"flex-start"},titleColumn:{flexDirection:"column"},titleColumnCenter:{alignItems:"center"},titleColumnBottom:{justifyContent:"flex-end"},title:{color:e.colors.text.primary},titleVariant:{includeFontPadding:!1,textAlignVertical:"center"},subtitle:{marginTop:e.components.appBar?.subtitleMarginTop??2,color:e.colors.text.tertiary,fontSize:e.typography.fontSize.sm,fontWeight:e.typography.fontWeight.normal},animatedBorder:{position:"absolute",left:0,right:0,bottom:0,height:_reactNative.StyleSheet.hairlineWidth}}),buildActionStyles=e=>_reactNative.StyleSheet.create({actionButton:{width:e.components.appBar?.actionButtonSize??44,height:e.components.appBar?.actionButtonSize??44,borderRadius:e.radius.full,..._corners.smoothCorners,alignItems:"center",justifyContent:"center"},actionLeft:{marginRight:e.spacing.xs},actionRight:{marginLeft:e.spacing.xs},actionPressed:{backgroundColor:e.colors.surface.pressed},textButton:{minWidth:44,minHeight:44,paddingHorizontal:e.spacing.sm,alignItems:"center",justifyContent:"center"},textPressed:{opacity:.6},actionText:{color:e.colors.text.link,fontSize:e.typography.fontSize.base,...(0,_index.fontFor)(e,"semibold")},dot:{position:"absolute",top:e.components.appBar?.dotOffset??10,right:e.components.appBar?.dotOffset??10,width:e.components.appBar?.dotSize??8,height:e.components.appBar?.dotSize??8,borderRadius:e.radius.full,backgroundColor:e.colors.error},iconWrap:{alignItems:"center",justifyContent:"center"},badge:{position:"absolute",top:e.components.appBar?.badgeOffset??4,right:e.components.appBar?.badgeOffset??4,minWidth:e.components.appBar?.badgeMinWidth??16,height:e.components.appBar?.badgeHeight??16,paddingHorizontal:e.components.appBar?.badgePaddingHorizontal??4,borderRadius:e.radius.full,..._corners.smoothCorners,backgroundColor:e.colors.error,alignItems:"center",justifyContent:"center"},badgeText:{color:e.colors.onError,fontSize:e.components.appBar?.badgeFontSize??10,fontWeight:e.typography.fontWeight.semibold,lineHeight:e.components.appBar?.badgeLineHeight??12}});var _default=exports.default=AppBar;
|
|
@@ -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.Button=void 0;var _react=_interopRequireWildcard(require("react")),_reactNative=require("react-native"),_useFlickGuard=require("../../hooks/useFlickGuard.js"),_usePressAnimation=require("../../hooks/usePressAnimation.js"),_index=require("../../theme/index.js"),_animatedValue=require("../../theme/animatedValue.js"),_ariaState=require("../../utils/ariaState.js"),_color=require("../../utils/color.js"),_corners=require("../../utils/corners.js"),_hapticUtils=require("../../utils/hapticUtils.js"),_slotIcon=require("../AppIcon/slotIcon.js"),_index2=require("../Spinner/index.js"),_SquircleFill=require("../SquircleFill/SquircleFill.js"),_jsxRuntime=require("react/jsx-runtime");function _interopRequireWildcard(e,r){if("function"==typeof WeakMap)var t=new WeakMap,o=new WeakMap;return(_interopRequireWildcard=function(e,r){if(!r&&e&&e.__esModule)return e;var i,s,n={__proto__:null,default:e};if(null===e||"object"!=typeof e&&"function"!=typeof e)return n;if(i=r?o:t){if(i.has(e))return i.get(e);i.set(e,n)}for(const r in e)"default"!==r&&{}.hasOwnProperty.call(e,r)&&((s=(i=Object.defineProperty)&&Object.getOwnPropertyDescriptor(e,r))&&(s.get||s.set)?i(n,r,s):n[r]=e[r]);return n})(e,r)}const Button=exports.Button=(0,_react.forwardRef)((e,r)=>{const{title:t,children:o,variant:i="solid",tone:s="primary",size:n="md",loading:a=!1,disabled:l=!1,fullWidth:c=!1,leftIcon:d,rightIcon:u,iconVariant:b,leftIconBadge:g=!1,haptic:p,rounded:_=!1,gradient:h,style:f,containerStyle:m,textStyle:x,pressAnimation:y,onPress:S,accessibilityLabel:j,accessibilityHint:v,accessibilityState:I,testID:C,onLayout:R,...k}=e;if(__DEV__&&hasTextChild(o))throw new Error('[@webority/mobile-ui] Button was given its label as text children. Pass it as `title` (<Button title="Save" />): text children draw a blank button with no accessible name.');const w=(0,_index.useTheme)(),T=!l&&!a,z={...I,disabled:!T,busy:a},F="link"===i,N=y??(!F&&"scale"),q=(0,_usePressAnimation.usePressAnimation)({preset:N||"scale",enabled:!1!==N&&T}),H=(0,_useFlickGuard.useFlickGuard)(),L=(0,_react.useMemo)(()=>buildStyles(w),[w]),W={...sizeMap[n],...w.components.button?.[n]??{}},O=(0,_react.useMemo)(()=>toneFor(w,s),[w,s]),P=(0,_react.useMemo)(()=>variantFor(w,i,O,l),[w,i,O,l]),V=(0,_react.useMemo)(()=>!h||l||"solid"!==i?null:"string"==typeof h?w.gradients[h]??null:h,[h,l,i,w.gradients]),A=_reactNative.StyleSheet.flatten(f)?.borderRadius,E=F?0:"number"==typeof A?A:_?w.radius.full:W.borderRadius,B=(0,_SquircleFill.useSquircle)(!V&&"link"!==i,E,R),D=(0,_react.useRef)((0,_animatedValue.createAnimatedValue)(0)).current,[M,G]=(0,_react.useState)(0),[U,K]=(0,_react.useState)(null),X=F?e=>G(e.nativeEvent.layout.width):void 0,Y=j??t,J="outline"===i||"ghost"===i,Q=!J&&!F,Z={color:P.textColor,size:W.iconSize,disabled:l},$=g&&!F&&Boolean(d),ee=W.minHeight-2*BADGE_INSET-2*P.borderWidth,re={color:P.badgeInk,size:W.badgeIconSize??W.iconSize,disabled:l},te=a?(0,_jsxRuntime.jsx)(_index2.Spinner,{variant:"circular",size:"sm",color:$?P.badgeInk:P.textColor,accessibilityLabel:"Loading"}):d?(0,_slotIcon.renderSlotIcon)(d,$?re:Z,b):null,oe=(0,_jsxRuntime.jsxs)(_reactNative.View,{style:L.contentRow,children:[$?(0,_jsxRuntime.jsx)(_reactNative.View,{testID:"button-icon-badge",style:[L.iconLeft,L.iconBadge,{width:ee,height:ee,borderRadius:ee/2,backgroundColor:P.badgeFill}],children:te}):te?(0,_jsxRuntime.jsx)(_reactNative.View,{style:L.iconLeft,children:te}):null,t?(0,_jsxRuntime.jsxs)(_reactNative.View,{onLayout:X,children:[(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[L.label,{color:P.textColor,fontSize:W.fontSize,...(0,_index.fontFor)(w,"semibold")},x],numberOfLines:1,children:t}),F?(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{pointerEvents:"none",testID:"button-link-underline",style:[L.linkUnderline,{backgroundColor:P.textColor,transform:[{translateX:D.interpolate({inputRange:[0,1],outputRange:[-M/2,0]})},{scaleX:D.interpolate({inputRange:[0,1],outputRange:[0,1]})}]}]}):null]}):o,u?(0,_jsxRuntime.jsx)(_reactNative.View,{style:L.iconRight,children:(0,_slotIcon.renderSlotIcon)(u,Z,b)}):null]}),ie=F?null===U?LINK_HIT_SLOP:Math.max(LINK_HIT_SLOP,touchSlopFor(U)):touchSlopFor(W.minHeight),se={top:ie,bottom:ie,left:F?LINK_HIT_SLOP:0,right:F?LINK_HIT_SLOP:0};return(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{style:[q.style,c?L.fullWidth:null,m],children:(0,_jsxRuntime.jsx)(_reactNative.Pressable,{ref:r,onPress:e=>{T&&!H.isFlick(e)&&(q.press(),p&&(0,_hapticUtils.triggerHaptic)(p),S?.(e))},onPressIn:e=>{H.onPressIn(e),q.pressIn(),F&&T&&(D.stopAnimation(),D.setValue(0),_reactNative.Animated.timing(D,{toValue:1,duration:w.motion.duration.slower,easing:_reactNative.Easing.bezier(...w.motion.easing.decelerate),useNativeDriver:!0}).start())},onPressOut:()=>{q.pressOut()},disabled:!T,hitSlop:se,accessibilityRole:"button",accessibilityLabel:Y,accessibilityHint:v,accessibilityState:z,...(0,_ariaState.ariaFromState)(z),testID:C,onLayout:e=>{B.onLayout(e),F&&K(e.nativeEvent.layout.height)},style:({pressed:e})=>[L.base,{paddingHorizontal:F?0:W.paddingHorizontal,paddingVertical:F?0:$?BADGE_INSET:W.paddingVertical,paddingLeft:$?BADGE_INSET:void 0,minHeight:F?void 0:W.minHeight,borderRadius:E,..._corners.smoothCorners,backgroundColor:V||B.active?"transparent":P.backgroundColor,borderWidth:P.borderWidth,borderColor:B.active?"transparent":P.borderColor,opacity:a?.55:1,overflow:B.active||F?"visible":"hidden"},e&&J&&!B.active?{backgroundColor:w.colors.surface.pressed}:null,c?L.fullWidth:null,f],...k,"aria-disabled":!T,"aria-busy":a,children:({pressed:e})=>(0,_jsxRuntime.jsxs)(_jsxRuntime.Fragment,{children:[B.active&&B.size?(0,_jsxRuntime.jsx)(_SquircleFill.SquircleFill,{width:B.size.width,height:B.size.height,radius:E,fill:e&&J?w.colors.surface.pressed:P.backgroundColor,stroke:P.borderColor,strokeWidth:P.borderWidth,outset:P.borderWidth}):null,V?(0,_jsxRuntime.jsx)(_index.Gradient,{gradient:V,style:[_reactNative.StyleSheet.absoluteFill,{borderRadius:E,..._corners.smoothCorners}]}):null,e&&Q?B.active&&B.size?(0,_jsxRuntime.jsx)(_SquircleFill.SquircleFill,{width:B.size.width,height:B.size.height,radius:E,fill:P.pressedTint,outset:P.borderWidth,testID:"button-pressed"}):(0,_jsxRuntime.jsx)(_reactNative.View,{pointerEvents:"none",style:[L.pressedOverlay,{borderRadius:E,backgroundColor:P.pressedTint,..._corners.smoothCorners}],testID:"button-pressed"}):null,oe]})})})});Button.displayName="Button";const hasTextChild=e=>_react.default.Children.toArray(e).some(e=>"string"==typeof e||"number"==typeof e),sizeMap={xs:{paddingHorizontal:10,paddingVertical:4,minHeight:28,fontSize:12,borderRadius:8,iconSize:14,badgeIconSize:11},sm:{paddingHorizontal:12,paddingVertical:6,minHeight:34,fontSize:14,borderRadius:10,iconSize:16},md:{paddingHorizontal:16,paddingVertical:9,minHeight:42,fontSize:16,borderRadius:12,iconSize:18},lg:{paddingHorizontal:20,paddingVertical:12,minHeight:50,fontSize:18,borderRadius:14,iconSize:20},xl:{paddingHorizontal:24,paddingVertical:14,minHeight:58,fontSize:20,borderRadius:16,iconSize:22}},SOFT_FILL_OPACITY=.14,toneFor=(e,r)=>{switch(r){case"primary":return{base:e.colors.primary,on:e.colors.onPrimary,fg:e.colors.toneText.primary,soft:(0,_color.tintOf)(e.colors.primary,.14,e.colors.primaryMuted)};case"secondary":return{base:e.colors.secondary,on:e.colors.onSecondary,fg:e.colors.onSecondary,soft:e.colors.secondary};case"success":return{base:e.colors.success,on:e.colors.onSuccess,fg:e.colors.toneText.success,soft:(0,_color.tintOf)(e.colors.success,.14,e.colors.background.secondary)};case"warning":return{base:e.colors.warning,on:e.colors.onWarning,fg:e.colors.toneText.warning,soft:(0,_color.tintOf)(e.colors.warning,.14,e.colors.background.secondary)};case"error":return{base:e.colors.error,on:e.colors.onError,fg:e.colors.toneText.error,soft:(0,_color.tintOf)(e.colors.error,.14,e.colors.background.secondary)};default:return{base:e.colors.background.tertiary,on:e.colors.text.primary,fg:e.colors.text.primary,soft:e.colors.background.secondary}}},BADGE_INSET=4,BUTTON_BORDER_WIDTH=1,MIN_TOUCH_TARGET=44,LINK_HIT_SLOP=8,touchSlopFor=e=>Math.max(0,Math.ceil((44-e)/2)),variantFor=(e,r,t,o)=>{const i=o?e.colors.text.disabled:t.fg,s={badgeFill:e.colors.surface.disabled,badgeInk:e.colors.text.disabled},n=o?s:{badgeFill:t.on,badgeInk:t.base},a=o?s:{badgeFill:t.base,badgeInk:t.on};switch(r){case"solid":return{backgroundColor:o?e.colors.surface.disabled:t.base,borderColor:"transparent",borderWidth:1,textColor:o?e.colors.text.disabled:t.on,pressedTint:e.colors.surface.pressed,...n};case"soft":return{backgroundColor:o?e.colors.surface.disabled:t.soft,borderColor:"transparent",borderWidth:1,textColor:i,pressedTint:e.colors.surface.pressed,...a};case"outline":return{backgroundColor:"transparent",borderColor:o?e.colors.border.primary:t.base,borderWidth:1,textColor:i,pressedTint:e.colors.surface.pressed,...a};case"ghost":return{backgroundColor:"transparent",borderColor:"transparent",borderWidth:1,textColor:i,pressedTint:e.colors.surface.pressed,...a};case"link":return{backgroundColor:"transparent",borderColor:"transparent",borderWidth:0,textColor:o?e.colors.text.disabled:e.colors.text.link,pressedTint:e.colors.surface.pressed,...a};case"glass":return{backgroundColor:e.colors.glass.fill,borderColor:e.colors.glass.border,borderWidth:1,textColor:o?e.colors.text.disabled:e.colors.glass.on,pressedTint:_color.ACCENT_PRESSED_TINT,badgeFill:e.colors.glass.badge,badgeInk:o?e.colors.text.disabled:t.base};default:return{backgroundColor:t.base,borderColor:"transparent",borderWidth:1,textColor:t.on,pressedTint:e.colors.surface.pressed,...n}}},buildStyles=e=>_reactNative.StyleSheet.create({pressedOverlay:{position:"absolute",top:0,right:0,bottom:0,left:0},base:{alignItems:"center",justifyContent:"center",flexDirection:"row",overflow:"hidden"},contentRow:{flexDirection:"row",alignItems:"center",justifyContent:"center"},label:{textAlign:"center",includeFontPadding:!1,textAlignVertical:"center"},linkUnderline:{height:1.5,marginTop:1},iconLeft:{marginRight:8},iconBadge:{alignItems:"center",justifyContent:"center"},iconRight:{marginLeft:8},fullWidth:{alignSelf:"stretch"}});var _default=exports.default=Button;
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=exports.Button=void 0;var _react=_interopRequireWildcard(require("react")),_reactNative=require("react-native"),_useFlickGuard=require("../../hooks/useFlickGuard.js"),_usePressAnimation=require("../../hooks/usePressAnimation.js"),_index=require("../../theme/index.js"),_animatedValue=require("../../theme/animatedValue.js"),_ariaState=require("../../utils/ariaState.js"),_color=require("../../utils/color.js"),_corners=require("../../utils/corners.js"),_hapticUtils=require("../../utils/hapticUtils.js"),_slotIcon=require("../AppIcon/slotIcon.js"),_index2=require("../Spinner/index.js"),_SquircleFill=require("../SquircleFill/SquircleFill.js"),_jsxRuntime=require("react/jsx-runtime");function _interopRequireWildcard(e,r){if("function"==typeof WeakMap)var t=new WeakMap,o=new WeakMap;return(_interopRequireWildcard=function(e,r){if(!r&&e&&e.__esModule)return e;var i,s,n={__proto__:null,default:e};if(null===e||"object"!=typeof e&&"function"!=typeof e)return n;if(i=r?o:t){if(i.has(e))return i.get(e);i.set(e,n)}for(const r in e)"default"!==r&&{}.hasOwnProperty.call(e,r)&&((s=(i=Object.defineProperty)&&Object.getOwnPropertyDescriptor(e,r))&&(s.get||s.set)?i(n,r,s):n[r]=e[r]);return n})(e,r)}const Button=exports.Button=(0,_react.forwardRef)((e,r)=>{const{title:t,children:o,variant:i="solid",tone:s="primary",size:n="md",loading:a=!1,disabled:l=!1,fullWidth:c=!1,leftIcon:d,rightIcon:u,iconVariant:b,leftIconBadge:g=!1,haptic:p,rounded:_=!1,gradient:h,style:f,containerStyle:m,textStyle:x,pressAnimation:y,onPress:S,accessibilityLabel:j,accessibilityHint:v,accessibilityState:I,testID:C,onLayout:R,...k}=e;if(__DEV__&&hasTextChild(o))throw new Error('[@webority/mobile-ui] Button was given its label as text children. Pass it as `title` (<Button title="Save" />): text children draw a blank button with no accessible name.');const w=(0,_index.useTheme)(),T=!l&&!a,z={...I,disabled:!T,busy:a},F="link"===i,N=y??(!F&&"scale"),q=(0,_usePressAnimation.usePressAnimation)({preset:N||"scale",enabled:!1!==N&&T}),H=(0,_useFlickGuard.useFlickGuard)(),L=(0,_react.useMemo)(()=>buildStyles(w),[w]),W={...sizeMap[n],...w.components.button?.[n]??{}},O=(0,_react.useMemo)(()=>toneFor(w,s),[w,s]),P=(0,_react.useMemo)(()=>variantFor(w,i,O,l),[w,i,O,l]),V=(0,_react.useMemo)(()=>!h||l||"solid"!==i?null:"string"==typeof h?w.gradients[h]??null:h,[h,l,i,w.gradients]),A=_reactNative.StyleSheet.flatten(f)?.borderRadius,E=F?0:"number"==typeof A?A:_?w.radius.full:W.borderRadius,B=(0,_SquircleFill.useSquircle)(!V&&"link"!==i,E,R),D=(0,_react.useRef)((0,_animatedValue.createAnimatedValue)(0)).current,[M,G]=(0,_react.useState)(0),[U,K]=(0,_react.useState)(null),X=F?e=>G(e.nativeEvent.layout.width):void 0,Y=j??t,J="outline"===i||"ghost"===i,Q=!J&&!F,Z={color:P.textColor,size:W.iconSize,disabled:l},$=g&&!F&&Boolean(d),ee=W.minHeight-2*BADGE_INSET-2*P.borderWidth,re={color:P.badgeInk,size:W.badgeIconSize??W.iconSize,disabled:l},te=a?(0,_jsxRuntime.jsx)(_index2.Spinner,{variant:"circular",size:"sm",color:$?P.badgeInk:P.textColor,accessibilityLabel:"Loading"}):d?(0,_slotIcon.renderSlotIcon)(d,$?re:Z,b):null,oe=(0,_jsxRuntime.jsxs)(_reactNative.View,{style:L.contentRow,children:[$?(0,_jsxRuntime.jsx)(_reactNative.View,{testID:"button-icon-badge",style:[L.iconLeft,L.iconBadge,{width:ee,height:ee,borderRadius:ee/2,backgroundColor:P.badgeFill}],children:te}):te?(0,_jsxRuntime.jsx)(_reactNative.View,{style:L.iconLeft,children:te}):null,t?(0,_jsxRuntime.jsxs)(_reactNative.View,{onLayout:X,children:[(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[L.label,{color:P.textColor,fontSize:W.fontSize,...(0,_index.fontFor)(w,"semibold")},x],numberOfLines:1,children:t}),F?(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{pointerEvents:"none",testID:"button-link-underline",style:[L.linkUnderline,{backgroundColor:P.textColor,transform:[{translateX:D.interpolate({inputRange:[0,1],outputRange:[-M/2,0]})},{scaleX:D.interpolate({inputRange:[0,1],outputRange:[0,1]})}]}]}):null]}):o,u?(0,_jsxRuntime.jsx)(_reactNative.View,{style:L.iconRight,children:(0,_slotIcon.renderSlotIcon)(u,Z,b)}):null]}),ie=F?null===U?LINK_HIT_SLOP:Math.max(LINK_HIT_SLOP,touchSlopFor(U)):touchSlopFor(W.minHeight),se={top:ie,bottom:ie,left:F?LINK_HIT_SLOP:0,right:F?LINK_HIT_SLOP:0};return(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{style:[q.style,c?L.fullWidth:null,m],children:(0,_jsxRuntime.jsx)(_reactNative.Pressable,{ref:r,onPress:e=>{T&&!H.isFlick(e)&&(q.press(),p&&(0,_hapticUtils.triggerHaptic)(p),S?.(e))},onPressIn:e=>{H.onPressIn(e),q.pressIn(),F&&T&&(D.stopAnimation(),D.setValue(0),_reactNative.Animated.timing(D,{toValue:1,duration:w.motion.duration.slower,easing:_reactNative.Easing.bezier(...w.motion.easing.decelerate),useNativeDriver:!0}).start())},onPressOut:()=>{q.pressOut()},disabled:!T,hitSlop:se,accessibilityRole:"button",accessibilityLabel:Y,accessibilityHint:v,accessibilityState:z,...(0,_ariaState.ariaFromState)(z),testID:C,onLayout:e=>{B.onLayout(e),F&&K(e.nativeEvent.layout.height)},style:({pressed:e})=>[L.base,{paddingHorizontal:F?0:W.paddingHorizontal,paddingVertical:F?0:$?BADGE_INSET:W.paddingVertical,paddingLeft:$?BADGE_INSET:void 0,minHeight:F?void 0:W.minHeight,borderRadius:E,..._corners.smoothCorners,backgroundColor:V||B.active?"transparent":P.backgroundColor,borderWidth:P.borderWidth,borderColor:B.active?"transparent":P.borderColor,opacity:a?.55:1,overflow:B.active||F?"visible":"hidden"},e&&J&&!B.active?{backgroundColor:w.colors.surface.pressed}:null,c?L.fullWidth:null,f],...k,"aria-disabled":!T,"aria-busy":a,children:({pressed:e})=>(0,_jsxRuntime.jsxs)(_jsxRuntime.Fragment,{children:[B.active&&B.size?(0,_jsxRuntime.jsx)(_SquircleFill.SquircleFill,{width:B.size.width,height:B.size.height,radius:E,fill:e&&J?w.colors.surface.pressed:P.backgroundColor,stroke:P.borderColor,strokeWidth:P.borderWidth,outset:P.borderWidth}):null,V?(0,_jsxRuntime.jsx)(_index.Gradient,{gradient:V,style:[_reactNative.StyleSheet.absoluteFill,{borderRadius:E,..._corners.smoothCorners}]}):null,e&&Q?B.active&&B.size?(0,_jsxRuntime.jsx)(_SquircleFill.SquircleFill,{width:B.size.width,height:B.size.height,radius:E,fill:P.pressedTint,outset:P.borderWidth,testID:"button-pressed"}):(0,_jsxRuntime.jsx)(_reactNative.View,{pointerEvents:"none",style:[L.pressedOverlay,{borderRadius:E,backgroundColor:P.pressedTint,..._corners.smoothCorners}],testID:"button-pressed"}):null,oe]})})})});Button.displayName="Button";const hasTextChild=e=>_react.default.Children.toArray(e).some(e=>"string"==typeof e||"number"==typeof e),sizeMap={xs:{paddingHorizontal:10,paddingVertical:4,minHeight:28,fontSize:12,borderRadius:8,iconSize:14,badgeIconSize:11},sm:{paddingHorizontal:12,paddingVertical:6,minHeight:34,fontSize:14,borderRadius:10,iconSize:16},md:{paddingHorizontal:16,paddingVertical:9,minHeight:44,fontSize:16,borderRadius:12,iconSize:18},lg:{paddingHorizontal:20,paddingVertical:12,minHeight:50,fontSize:18,borderRadius:14,iconSize:20},xl:{paddingHorizontal:24,paddingVertical:14,minHeight:58,fontSize:20,borderRadius:16,iconSize:22}},SOFT_FILL_OPACITY=.14,toneFor=(e,r)=>{switch(r){case"primary":return{base:e.colors.primary,on:e.colors.onPrimary,fg:e.colors.toneText.primary,soft:(0,_color.tintOf)(e.colors.primary,.14,e.colors.primaryMuted)};case"secondary":return{base:e.colors.secondary,on:e.colors.onSecondary,fg:e.colors.onSecondary,soft:e.colors.secondary};case"success":return{base:e.colors.success,on:e.colors.onSuccess,fg:e.colors.toneText.success,soft:(0,_color.tintOf)(e.colors.success,.14,e.colors.background.secondary)};case"warning":return{base:e.colors.warning,on:e.colors.onWarning,fg:e.colors.toneText.warning,soft:(0,_color.tintOf)(e.colors.warning,.14,e.colors.background.secondary)};case"error":return{base:e.colors.error,on:e.colors.onError,fg:e.colors.toneText.error,soft:(0,_color.tintOf)(e.colors.error,.14,e.colors.background.secondary)};default:return{base:e.colors.background.tertiary,on:e.colors.text.primary,fg:e.colors.text.primary,soft:e.colors.background.secondary}}},BADGE_INSET=4,BUTTON_BORDER_WIDTH=1,MIN_TOUCH_TARGET=44,LINK_HIT_SLOP=8,touchSlopFor=e=>Math.max(0,Math.ceil((44-e)/2)),variantFor=(e,r,t,o)=>{const i=o?e.colors.text.disabled:t.fg,s={badgeFill:e.colors.surface.disabled,badgeInk:e.colors.text.disabled},n=o?s:{badgeFill:t.on,badgeInk:t.base},a=o?s:{badgeFill:t.base,badgeInk:t.on};switch(r){case"solid":return{backgroundColor:o?e.colors.surface.disabled:t.base,borderColor:"transparent",borderWidth:1,textColor:o?e.colors.text.disabled:t.on,pressedTint:e.colors.surface.pressed,...n};case"soft":return{backgroundColor:o?e.colors.surface.disabled:t.soft,borderColor:"transparent",borderWidth:1,textColor:i,pressedTint:e.colors.surface.pressed,...a};case"outline":return{backgroundColor:"transparent",borderColor:o?e.colors.border.primary:t.base,borderWidth:1,textColor:i,pressedTint:e.colors.surface.pressed,...a};case"ghost":return{backgroundColor:"transparent",borderColor:"transparent",borderWidth:1,textColor:i,pressedTint:e.colors.surface.pressed,...a};case"link":return{backgroundColor:"transparent",borderColor:"transparent",borderWidth:0,textColor:o?e.colors.text.disabled:e.colors.text.link,pressedTint:e.colors.surface.pressed,...a};case"glass":return{backgroundColor:e.colors.glass.fill,borderColor:e.colors.glass.border,borderWidth:1,textColor:o?e.colors.text.disabled:e.colors.glass.on,pressedTint:_color.ACCENT_PRESSED_TINT,badgeFill:e.colors.glass.badge,badgeInk:o?e.colors.text.disabled:t.base};default:return{backgroundColor:t.base,borderColor:"transparent",borderWidth:1,textColor:t.on,pressedTint:e.colors.surface.pressed,...n}}},buildStyles=e=>_reactNative.StyleSheet.create({pressedOverlay:{position:"absolute",top:0,right:0,bottom:0,left:0},base:{alignItems:"center",justifyContent:"center",flexDirection:"row",overflow:"hidden"},contentRow:{flexDirection:"row",alignItems:"center",justifyContent:"center"},label:{textAlign:"center",includeFontPadding:!1,textAlignVertical:"center"},linkUnderline:{height:1.5,marginTop:1},iconLeft:{marginRight:8},iconBadge:{alignItems:"center",justifyContent:"center"},iconRight:{marginLeft:8},fullWidth:{alignSelf:"stretch"}});var _default=exports.default=Button;
|
|
@@ -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:
|
|
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.Dialog=void 0;var _react=require("react"),_reactNative=require("react-native"),_index=require("../../theme/index.js"),_corners=require("../../utils/corners.js"),_hapticUtils=require("../../utils/hapticUtils.js"),_Modal=require("../Modal/Modal.js"),_jsxRuntime=require("react/jsx-runtime");const Dialog=e=>{const{visible:t,onClose:r,title:o,message:i,children:n,icon:a,variant:
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=exports.Dialog=void 0;var _react=require("react"),_reactNative=require("react-native"),_index=require("../../theme/index.js"),_color=require("../../utils/color.js"),_corners=require("../../utils/corners.js"),_hapticUtils=require("../../utils/hapticUtils.js"),_Modal=require("../Modal/Modal.js"),_jsxRuntime=require("react/jsx-runtime");const Dialog=e=>{const{visible:t,onClose:r,title:o,message:i,children:n,icon:a,variant:l="default",actions:s,dismissOnAction:c=!0,accessibilityLabel:d,contentStyle:u,containerStyle:g,titleStyle:p,messageStyle:b,iconWrapperStyle:m,actionsRowStyle:y,actionButtonStyle:x,actionTextStyle:_,haptic:h,testID:f}=e,C=(0,_index.useTheme)(),j=(0,_react.useMemo)(()=>buildStyles(C),[C]),S=(0,_react.useMemo)(()=>discFor(C,l),[C,l]),R=C.components.dialog,v=R?.iconWrapperSize??48,M=R?.iconWrapperBorderRadius??24,w=R?.actionButtonMinHeight??44,B=Boolean(s&&s.length>0),D=(0,_react.useCallback)(e=>{if(e.loading||e.disabled)return;const t=(0,_hapticUtils.resolveHaptic)(h,"selection");t&&(0,_hapticUtils.triggerHaptic)(t),c?(r(),setTimeout(e.onPress,_Modal.MODAL_DISMISS_GRACE_MS)):e.onPress()},[c,r,h]);return(0,_jsxRuntime.jsx)(_Modal.Modal,{visible:t,onRequestClose:r,haptic:h,presentation:"centered",accessibilityLabel:d??o,contentStyle:u,testID:f,children:(0,_jsxRuntime.jsxs)(_reactNative.View,{accessibilityRole:"alert",accessibilityLabel:d??o,style:[j.container,g],children:[a?(0,_jsxRuntime.jsx)(_reactNative.View,{style:[j.iconWrapper,{width:v,height:v,borderRadius:M,..._corners.smoothCorners,backgroundColor:S,marginBottom:C.spacing.md},m],children:a}):null,o?(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[j.title,{color:C.colors.text.primary,fontSize:C.typography.fontSize.xl,...(0,_index.fontFor)(C,"semibold"),marginBottom:i||null!=n?C.spacing.sm:C.spacing.md},p],accessibilityRole:"header",children:o}):null,i?(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[j.message,{color:C.colors.text.secondary,fontSize:C.typography.fontSize.base,lineHeight:C.typography.fontSize.base*C.typography.lineHeight.normal,marginBottom:null!=n?C.spacing.md:B?C.spacing.lg:0},b],children:i}):null,null!=n?(0,_jsxRuntime.jsx)(_reactNative.View,{style:{marginBottom:B?C.spacing.lg:0},children:n}):null,s&&s.length>0?(0,_jsxRuntime.jsx)(_reactNative.View,{style:[j.actionsRow,y],children:s.map((e,t)=>{const r=e.tone??"primary",o=Boolean(e.disabled),i=actionStyleFor(C,r,o),n=t===s.length-1;return(0,_jsxRuntime.jsx)(_reactNative.Pressable,{onPress:()=>D(e),disabled:e.loading||o,accessibilityRole:"button",accessibilityLabel:e.label,accessibilityState:{busy:e.loading,disabled:Boolean(e.loading)||o},"aria-busy":e.loading,"aria-disabled":Boolean(e.loading)||o,style:({pressed:t})=>[j.actionButton,{minHeight:w,backgroundColor:i.backgroundColor,borderColor:i.borderColor,borderWidth:i.borderWidth,borderRadius:C.radius.md,..._corners.smoothCorners,paddingVertical:C.spacing.md-2,paddingHorizontal:C.spacing.md,marginRight:n?0:C.spacing.sm,opacity:e.loading?.7:t&&!o?.85:1},x],children:e.loading?(0,_jsxRuntime.jsx)(_reactNative.ActivityIndicator,{size:"small",color:i.textColor}):(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[{color:i.textColor,fontSize:C.typography.fontSize.base,...(0,_index.fontFor)(C,"semibold"),textAlign:"center"},_],children:e.label})},`${e.label}-${t}`)})}):null]})})};exports.Dialog=Dialog,Dialog.displayName="Dialog";const SOFT_DISC_OPACITY=.14,discFor=(e,t)=>{const r=e.colors.background.secondary;switch(t){case"success":return(0,_color.tintOf)(e.colors.success,.14,r);case"warning":return(0,_color.tintOf)(e.colors.warning,.14,r);case"error":return(0,_color.tintOf)(e.colors.error,.14,r);case"info":return(0,_color.tintOf)(e.colors.info,.14,r);default:return e.colors.primaryMuted}},actionStyleFor=(e,t,r)=>{if(r)return{backgroundColor:"neutral"===t?"transparent":e.colors.surface.disabled,borderColor:"neutral"===t?e.colors.border.primary:"transparent",borderWidth:"neutral"===t?1:0,textColor:e.colors.text.disabled};switch(t){case"primary":return{backgroundColor:e.colors.primary,borderColor:"transparent",borderWidth:0,textColor:e.colors.onPrimary};case"info":return{backgroundColor:e.colors.info,borderColor:"transparent",borderWidth:0,textColor:e.colors.onInfo};case"error":return{backgroundColor:e.colors.error,borderColor:"transparent",borderWidth:0,textColor:e.colors.onError};default:return{backgroundColor:"transparent",borderColor:e.colors.border.primary,borderWidth:1,textColor:e.colors.text.primary}}},buildStyles=e=>_reactNative.StyleSheet.create({container:{alignItems:"stretch"},iconWrapper:{alignItems:"center",justifyContent:"center",alignSelf:"center"},title:{textAlign:"center"},message:{textAlign:"center"},actionsRow:{flexDirection:"row",justifyContent:"flex-end",alignItems:"stretch"},actionButton:{flex:1,alignItems:"center",justifyContent:"center"}});var _default=exports.default=Dialog;
|
|
@@ -1 +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:
|
|
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.ForceUpdateDialog=void 0;var _mobileCore=require("@webority/mobile-core"),_react=require("react"),_index=require("../Dialog/index.js"),_jsxRuntime=require("react/jsx-runtime");const ForceUpdateDialog=({visible:e,onClose:t,mandatory:a=!1,updateUrl:
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=exports.ForceUpdateDialog=void 0;var _mobileCore=require("@webority/mobile-core"),_react=require("react"),_index=require("../Dialog/index.js"),_jsxRuntime=require("react/jsx-runtime");const ForceUpdateDialog=({visible:e,onClose:t,mandatory:a=!1,updateUrl:o,title:r="Update available",message:l="A new version of the app is available. Please update to continue using the latest features and security improvements.",updateLabel:i="Update now",laterLabel:s="Later",containerStyle:n,titleStyle:c,messageStyle:d,testID:u})=>{const[p,b]=(0,_react.useState)(!1),g=(0,_react.useCallback)(()=>{b(!0),(async()=>{try{await _mobileCore.VersionCheck.openUpdateUrl(o??null)}catch(e){_mobileCore.Logger.error("[ForceUpdateDialog] Failed to open store URL",e)}finally{b(!1)}})()},[o]),m=(0,_react.useCallback)(()=>{a||t?.()},[a,t]),_=a?[{label:i,onPress:g,tone:"info",loading:p}]:[{label:s,onPress:m,tone:"neutral"},{label:i,onPress:g,tone:"info",loading:p}];return(0,_jsxRuntime.jsx)(_index.Dialog,{visible:e,onClose:m,title:r,message:l,variant:"info",actions:_,dismissOnAction:!1,containerStyle:n,titleStyle:c,messageStyle:d,testID:u})};exports.ForceUpdateDialog=ForceUpdateDialog;var _default=exports.default=ForceUpdateDialog;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=exports.ListItem=void 0;var _react=_interopRequireWildcard(require("react")),_reactNative=require("react-native"),_reactNativeSvg=_interopRequireWildcard(require("react-native-svg")),_useFlickGuard=require("../../hooks/useFlickGuard.js"),_usePressAnimation=require("../../hooks/usePressAnimation.js"),_index=require("../../theme/index.js"),_corners=require("../../utils/corners.js"),_hapticUtils=require("../../utils/hapticUtils.js"),_mergeRefs=require("../../utils/mergeRefs.js"),_themeStyles=require("../../utils/themeStyles.js"),_defaultIcons=require("../AppIcon/defaultIcons.js"),_index2=require("../Button/index.js"),_index3=require("../IconBadge/index.js"),_useContextMenu=require("../Menu/useContextMenu.js"),_index4=require("../Skeleton/index.js"),_index5=require("../Swipeable/index.js"),_jsxRuntime=require("react/jsx-runtime");function _interopRequireWildcard(e,t){if("function"==typeof WeakMap)var i=new WeakMap,s=new WeakMap;return(_interopRequireWildcard=function(e,t){if(!t&&e&&e.__esModule)return e;var n,r,l={__proto__:null,default:e};if(null===e||"object"!=typeof e&&"function"!=typeof e)return l;if(n=t?s:i){if(n.has(e))return n.get(e);n.set(e,l)}for(const t in e)"default"!==t&&{}.hasOwnProperty.call(e,t)&&((r=(n=Object.defineProperty)&&Object.getOwnPropertyDescriptor(e,t))&&(r.get||r.set)?n(l,t,r):l[t]=e[t]);return l})(e,t)}const SIZE_FALLBACK={sm:{paddingVertical:"sm",titleFontSize:"sm",subtitleFontSize:"xs",minHeight:44},md:{paddingVertical:"md",titleFontSize:"base",subtitleFontSize:"sm",minHeight:56},lg:{paddingVertical:"lg",titleFontSize:"lg",subtitleFontSize:"sm",minHeight:72}},sizeFor=(e,t)=>{const i={...SIZE_FALLBACK[t],...e.components.listItem?.[t]??{}};return{paddingVertical:e.spacing[i.paddingVertical],titleSize:e.typography.fontSize[i.titleFontSize],subtitleSize:e.typography.fontSize[i.subtitleFontSize],minHeight:i.minHeight}},Chevron=({color:e})=>{const t=(0,_index.useTheme)();return(0,_jsxRuntime.jsx)(_jsxRuntime.Fragment,{children:(t.icons?.chevronRight??_defaultIcons.defaultIcons.chevronRight)({size:20,color:e})})},BADGE_SIZE={sm:"sm",md:"md",lg:"lg"},RIGHT_BELOW_FONT_SCALE=1.2,DEFAULT_BOX_SIZE=20,SelectionBox=({checked:e,disabled:t})=>{const i=(0,_index.useTheme)(),s=i.components.checkbox?.md?.boxSize??20,n=Math.round(.72*s);return(0,_jsxRuntime.jsx)(_reactNative.View,{accessibilityElementsHidden:!0,importantForAccessibility:"no-hide-descendants",pointerEvents:"none",style:{width:s,height:s,alignItems:"center",justifyContent:"center",borderWidth:i.colors.border.width,borderRadius:i.radius.xs,..._corners.smoothCorners,borderColor:e?i.colors.primary:i.colors.border.primary,backgroundColor:e?i.colors.primary:t?i.colors.surface.disabled:"transparent"},children:e?(0,_jsxRuntime.jsx)(_reactNativeSvg.default,{width:n,height:n,viewBox:"0 0 24 24",children:(0,_jsxRuntime.jsx)(_reactNativeSvg.Path,{d:"M5 12.5l4.5 4.5L19 7.5",stroke:i.colors.onPrimary,strokeWidth:3,strokeLinecap:"round",strokeLinejoin:"round",fill:"none"})}):null})},isActionList=e=>Array.isArray(e)&&e.length>0&&e.every(e=>null!=e&&"object"==typeof e&&!_react.default.isValidElement(e)&&"label"in e),renderActions=e=>isActionList(e)?e.map(e=>(0,_jsxRuntime.jsx)(_index2.Button,{size:"sm",variant:e.variant??"outline",tone:e.tone,leftIcon:e.icon,disabled:e.disabled,testID:e.testID,title:e.label,onPress:e.onPress},e.label)):e,ListItem=exports.ListItem=_react.default.memo((0,_react.forwardRef)((e,t)=>{const{title:i,loading:s=!1,subtitle:n,description:r,titleLines:l=1,subtitleLines:o=1,left:a,icon:c,iconTone:d="primary",right:u,rightPlacement:m="auto",selectable:x=!1,checked:h=!1,onCheckedChange:_,actions:g,onPress:p,haptic:j,selected:y=!1,disabled:b=!1,size:f="md",divider:S=!1,chevron:v=!1,leftActions:R,rightActions:w,contextMenu:I,accessibilityLabel:L,accessibilityHint:k,style:z,containerStyle:N,titleStyle:F,subtitleStyle:V,descriptionStyle:A,leftSlotStyle:C,rightSlotStyle:q,testID:B}=e,P=(0,_index.useTheme)(),D=(0,_react.useMemo)(()=>sizeFor(P,f),[P,f]),H=stylesFor(P),{fontScale:M}=(0,_reactNative.useWindowDimensions)(),W=!!u&&("below"===m||"auto"===m&&M>1.2),T=(0,_useContextMenu.useContextMenu)(b?void 0:I,{haptic:j||!1,testID:B}),E=(0,_react.useMemo)(()=>(0,_mergeRefs.mergeRefs)(t,T.hostRef),[t,T.hostRef]),O=x||!!p,G=O||T.enabled,Z=G&&!b,{style:U,pressIn:K,pressOut:X}=(0,_usePressAnimation.usePressAnimation)({enabled:Z}),J=(0,_useFlickGuard.useFlickGuard)(),Q=L??("string"==typeof i?i:void 0),isText=e=>"string"==typeof e||"number"==typeof e,Y=a??(void 0===c?null:(0,_jsxRuntime.jsx)(_index3.IconBadge,{icon:c,tone:d,size:BADGE_SIZE[f]})),$=x?(0,_jsxRuntime.jsxs)(_reactNative.View,{style:H.selectionLead,children:[(0,_jsxRuntime.jsx)(SelectionBox,{checked:h,disabled:b}),Y?(0,_jsxRuntime.jsx)(_reactNative.View,{style:H.selectionLeadContent,children:Y}):null]}):Y,ee=null!=g&&!1!==g&&!(Array.isArray(g)&&0===g.length),te=S&&!ee,ie=(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[H.row,{paddingVertical:D.paddingVertical,minHeight:D.minHeight,backgroundColor:y?P.colors.surface.selected:"transparent"},te?H.divider:null,b?H.disabled:null,N],children:[$?(0,_jsxRuntime.jsx)(_reactNative.View,{style:[H.leftSlot,C],children:$}):null,(0,_jsxRuntime.jsxs)(_reactNative.View,{style:H.middle,children:[null==i||isText(i)?(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[H.title,{fontSize:D.titleSize,...(0,_index.fontFor)(P,"medium"),color:b?P.colors.text.disabled:P.colors.text.primary},F],numberOfLines:l,children:i??" "}):i,null==n||""===n?null:isText(n)?(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[H.subtitle,{fontSize:D.subtitleSize,color:b?P.colors.text.disabled:P.colors.text.secondary},V],numberOfLines:o,children:n}):n,r?(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[H.description,{fontSize:D.subtitleSize,color:b?P.colors.text.disabled:P.colors.text.tertiary},A],numberOfLines:2,children:r}):null,W?(0,_jsxRuntime.jsx)(_reactNative.View,{style:[H.rightBelow,q],children:u}):null]}),u&&!W||v?(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[H.rightSlot,W?null:q],children:[W?null:u,v?(0,_jsxRuntime.jsx)(_reactNative.View,{style:u&&!W?H.chevronWithRight:null,children:(0,_jsxRuntime.jsx)(Chevron,{color:b?P.colors.text.disabled:P.colors.text.tertiary})}):null]}):null]}),se=G?(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{style:[U,z],children:(0,_jsxRuntime.jsx)(_reactNative.Pressable,{ref:E,onPress:e=>{Z&&O&&!J.isFlick(e)&&(j&&(0,_hapticUtils.triggerHaptic)(j),x?_?.(!h):p?.(e))},onPressIn:e=>{J.onPressIn(e),K()},onPressOut:X,disabled:!Z,accessibilityRole:x?"checkbox":p?"button":void 0,accessibilityLabel:Q,accessibilityHint:k,accessibilityState:x?{checked:h,disabled:!Z}:{selected:y,disabled:!Z},"aria-disabled":!Z,...x?{"aria-checked":h}:{"aria-selected":y},testID:B,android_ripple:{color:P.colors.surface.pressed,borderless:!1},style:({pressed:e})=>e?H.pressed:null,...T.hostProps,children:ie})}):(0,_jsxRuntime.jsx)(_reactNative.View,{ref:t,accessibilityRole:"none",accessibilityLabel:Q,accessibilityHint:k,accessibilityState:{selected:y,disabled:b},"aria-selected":y,"aria-disabled":b,testID:B,style:z,children:ie}),ne=R&&R.length>0||w&&w.length>0,re=ee?(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[y?{backgroundColor:P.colors.surface.selected}:null,S?H.divider:null],children:[se,(0,_jsxRuntime.jsx)(_reactNative.View,{style:H.actions,children:renderActions(g)})]}):se,le=ne?(0,_jsxRuntime.jsx)(_index5.Swipeable,{leftActions:R,rightActions:w,accessibilityLabel:Q,children:re}):re;return s?(0,_jsxRuntime.jsx)(ListItemSkeleton,{...e}):T.enabled?(0,_jsxRuntime.jsxs)(_jsxRuntime.Fragment,{children:[le,T.renderSurface((0,_jsxRuntime.jsx)(_reactNative.View,{style:H.preview,children:ie}))]}):le}));ListItem.displayName="ListItem";const ListItemSkeleton=({subtitle:e,description:t,left:i,icon:s,right:n,chevron:r,size:l="md",containerStyle:o,style:a})=>{const c=(0,_index.useTheme)(),d=sizeFor(c,l),u=Math.round(1.15*d.titleSize),m=Math.round(1.15*d.subtitleSize);return(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[{flexDirection:"row",alignItems:"center",paddingHorizontal:c.spacing.md,paddingVertical:d.paddingVertical,minHeight:d.minHeight},o,a],children:[void 0!==i||void 0!==s?(0,_jsxRuntime.jsx)(_reactNative.View,{style:{marginRight:c.spacing.sm},children:(0,_jsxRuntime.jsx)(_index4.Skeleton,{shape:"circle",width:40,height:40})}):null,(0,_jsxRuntime.jsxs)(_reactNative.View,{style:{flex:1},children:[(0,_jsxRuntime.jsx)(_index4.Skeleton,{shape:"text",width:"70%",height:u,style:{marginBottom:c.spacing.xs}}),void 0!==e?(0,_jsxRuntime.jsx)(_index4.Skeleton,{shape:"text",width:"50%",height:m,style:void 0!==t?{marginBottom:c.spacing.xs}:void 0}):null,void 0!==t?(0,_jsxRuntime.jsx)(_index4.Skeleton,{shape:"text",width:"85%",height:m}):null]}),void 0!==n||r?(0,_jsxRuntime.jsx)(_reactNative.View,{style:{marginLeft:c.spacing.sm},children:(0,_jsxRuntime.jsx)(_index4.Skeleton,{width:20,height:20,radius:"sm"})}):null]})};ListItemSkeleton.displayName="ListItemSkeleton",ListItem.Skeleton=ListItemSkeleton;const buildStyles=e=>_reactNative.StyleSheet.create({row:{flexDirection:"row",alignItems:"center",paddingHorizontal:e.spacing.md},divider:{borderBottomWidth:_reactNative.StyleSheet.hairlineWidth,borderBottomColor:e.colors.border.primary},pressed:{backgroundColor:e.colors.surface.pressed},disabled:{opacity:.55},leftSlot:{marginRight:e.spacing.md,alignItems:"center",justifyContent:"center"},middle:{flex:1,flexDirection:"column",justifyContent:"center"},selectionLead:{flexDirection:"row",alignItems:"center"},selectionLeadContent:{marginLeft:e.spacing.sm},rightBelow:{alignSelf:"flex-start",flexDirection:"row",alignItems:"center",marginTop:e.spacing.xs},rightSlot:{marginLeft:e.spacing.md,alignItems:"center",justifyContent:"center",flexDirection:"row"},actions:{flexDirection:"row",flexWrap:"wrap",gap:e.spacing.sm,paddingHorizontal:e.spacing.md,paddingBottom:e.spacing.md},chevronWithRight:{marginLeft:e.spacing.xs},preview:{flex:1,backgroundColor:e.colors.background.elevated,borderRadius:e.radius.md,..._corners.smoothCorners,overflow:"hidden"},title:{letterSpacing:e.typography.letterSpacing.normal},subtitle:{marginTop:2,...(0,_index.fontFor)(e,"normal")},description:{marginTop:2,...(0,_index.fontFor)(e,"normal")}}),stylesFor=(0,_themeStyles.themeStyles)(buildStyles);var _default=exports.default=ListItem;
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=exports.ListItem=void 0;var _react=_interopRequireWildcard(require("react")),_reactNative=require("react-native"),_reactNativeSvg=_interopRequireWildcard(require("react-native-svg")),_useFlickGuard=require("../../hooks/useFlickGuard.js"),_usePressAnimation=require("../../hooks/usePressAnimation.js"),_index=require("../../theme/index.js"),_corners=require("../../utils/corners.js"),_hapticUtils=require("../../utils/hapticUtils.js"),_mergeRefs=require("../../utils/mergeRefs.js"),_themeStyles=require("../../utils/themeStyles.js"),_defaultIcons=require("../AppIcon/defaultIcons.js"),_index2=require("../Button/index.js"),_index3=require("../IconBadge/index.js"),_useContextMenu=require("../Menu/useContextMenu.js"),_index4=require("../Skeleton/index.js"),_index5=require("../Swipeable/index.js"),_jsxRuntime=require("react/jsx-runtime");function _interopRequireWildcard(e,t){if("function"==typeof WeakMap)var i=new WeakMap,s=new WeakMap;return(_interopRequireWildcard=function(e,t){if(!t&&e&&e.__esModule)return e;var n,r,l={__proto__:null,default:e};if(null===e||"object"!=typeof e&&"function"!=typeof e)return l;if(n=t?s:i){if(n.has(e))return n.get(e);n.set(e,l)}for(const t in e)"default"!==t&&{}.hasOwnProperty.call(e,t)&&((r=(n=Object.defineProperty)&&Object.getOwnPropertyDescriptor(e,t))&&(r.get||r.set)?n(l,t,r):l[t]=e[t]);return l})(e,t)}const SIZE_FALLBACK={sm:{paddingVertical:"sm",titleFontSize:"sm",subtitleFontSize:"xs",minHeight:44},md:{paddingVertical:"md",titleFontSize:"base",subtitleFontSize:"sm",minHeight:56},lg:{paddingVertical:"lg",titleFontSize:"lg",subtitleFontSize:"sm",minHeight:72}},sizeFor=(e,t)=>{const i={...SIZE_FALLBACK[t],...e.components.listItem?.[t]??{}};return{paddingVertical:e.spacing[i.paddingVertical],titleSize:e.typography.fontSize[i.titleFontSize],subtitleSize:e.typography.fontSize[i.subtitleFontSize],minHeight:i.minHeight}},Chevron=({color:e})=>{const t=(0,_index.useTheme)();return(0,_jsxRuntime.jsx)(_jsxRuntime.Fragment,{children:(t.icons?.chevronRight??_defaultIcons.defaultIcons.chevronRight)({size:20,color:e})})},BADGE_SIZE={sm:"sm",md:"md",lg:"lg"},RIGHT_BELOW_FONT_SCALE=1.2,DEFAULT_BOX_SIZE=20,SelectionBox=({checked:e,disabled:t})=>{const i=(0,_index.useTheme)(),s=i.components.checkbox?.md?.boxSize??20,n=Math.round(.72*s);return(0,_jsxRuntime.jsx)(_reactNative.View,{accessibilityElementsHidden:!0,importantForAccessibility:"no-hide-descendants",pointerEvents:"none",style:{width:s,height:s,alignItems:"center",justifyContent:"center",borderWidth:i.colors.border.width,borderRadius:i.radius.xs,..._corners.smoothCorners,borderColor:e?i.colors.primary:i.colors.border.primary,backgroundColor:e?i.colors.primary:t?i.colors.surface.disabled:"transparent"},children:e?(0,_jsxRuntime.jsx)(_reactNativeSvg.default,{width:n,height:n,viewBox:"0 0 24 24",children:(0,_jsxRuntime.jsx)(_reactNativeSvg.Path,{d:"M5 12.5l4.5 4.5L19 7.5",stroke:i.colors.onPrimary,strokeWidth:3,strokeLinecap:"round",strokeLinejoin:"round",fill:"none"})}):null})},isActionList=e=>Array.isArray(e)&&e.length>0&&e.every(e=>null!=e&&"object"==typeof e&&!_react.default.isValidElement(e)&&"label"in e),renderActions=e=>isActionList(e)?e.map(e=>(0,_jsxRuntime.jsx)(_index2.Button,{size:"sm",variant:e.variant??"outline",tone:e.tone,leftIcon:e.icon,disabled:e.disabled,testID:e.testID,title:e.label,onPress:e.onPress},e.label)):e,ListItem=exports.ListItem=_react.default.memo((0,_react.forwardRef)((e,t)=>{const{title:i,loading:s=!1,subtitle:n,description:r,children:l,titleLines:o=1,subtitleLines:a=1,left:c,icon:d,iconTone:u="primary",right:m,rightPlacement:x="auto",selectable:h=!1,checked:_=!1,onCheckedChange:g,actions:p,onPress:j,haptic:y,selected:b=!1,disabled:f=!1,size:S="md",divider:v=!1,chevron:R=!1,leftActions:w,rightActions:I,contextMenu:L,accessibilityLabel:k,accessibilityHint:N,style:z,containerStyle:V,titleStyle:F,subtitleStyle:A,descriptionStyle:C,leftSlotStyle:q,rightSlotStyle:B,testID:P}=e,D=(0,_index.useTheme)(),H=(0,_react.useMemo)(()=>sizeFor(D,S),[D,S]),M=stylesFor(D),{fontScale:W}=(0,_reactNative.useWindowDimensions)(),T=!!m&&("below"===x||"auto"===x&&W>1.2),E=(0,_useContextMenu.useContextMenu)(f?void 0:L,{haptic:y||!1,testID:P}),O=(0,_react.useMemo)(()=>(0,_mergeRefs.mergeRefs)(t,E.hostRef),[t,E.hostRef]),G=h||!!j,Z=G||E.enabled,U=Z&&!f,{style:K,pressIn:X,pressOut:J}=(0,_usePressAnimation.usePressAnimation)({enabled:U}),Q=(0,_useFlickGuard.useFlickGuard)(),Y=k??("string"==typeof i?i:void 0),isText=e=>"string"==typeof e||"number"==typeof e,$=c??(void 0===d?null:(0,_jsxRuntime.jsx)(_index3.IconBadge,{icon:d,tone:u,size:BADGE_SIZE[S]})),ee=h?(0,_jsxRuntime.jsxs)(_reactNative.View,{style:M.selectionLead,children:[(0,_jsxRuntime.jsx)(SelectionBox,{checked:_,disabled:f}),$?(0,_jsxRuntime.jsx)(_reactNative.View,{style:M.selectionLeadContent,children:$}):null]}):$,te=null!=p&&!1!==p&&!(Array.isArray(p)&&0===p.length),ie=v&&!te,se=(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[M.row,{paddingVertical:H.paddingVertical,minHeight:H.minHeight,backgroundColor:b?D.colors.surface.selected:"transparent"},ie?M.divider:null,f?M.disabled:null,V],children:[ee?(0,_jsxRuntime.jsx)(_reactNative.View,{style:[M.leftSlot,q],children:ee}):null,(0,_jsxRuntime.jsxs)(_reactNative.View,{style:M.middle,children:[null==i||isText(i)?(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[M.title,{fontSize:H.titleSize,...(0,_index.fontFor)(D,"medium"),color:f?D.colors.text.disabled:D.colors.text.primary},F],numberOfLines:o,children:i??" "}):i,null==n||""===n?null:isText(n)?(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[M.subtitle,{fontSize:H.subtitleSize,color:f?D.colors.text.disabled:D.colors.text.secondary},A],numberOfLines:a,children:n}):n,r?(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[M.description,{fontSize:H.subtitleSize,color:f?D.colors.text.disabled:D.colors.text.tertiary},C],numberOfLines:2,children:r}):null,null!=l&&!1!==l?(0,_jsxRuntime.jsx)(_reactNative.View,{style:M.body,children:l}):null,T?(0,_jsxRuntime.jsx)(_reactNative.View,{style:[M.rightBelow,B],children:m}):null]}),m&&!T||R?(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[M.rightSlot,T?null:B],children:[T?null:m,R?(0,_jsxRuntime.jsx)(_reactNative.View,{style:m&&!T?M.chevronWithRight:null,children:(0,_jsxRuntime.jsx)(Chevron,{color:f?D.colors.text.disabled:D.colors.text.tertiary})}):null]}):null]}),ne=Z?(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{style:[K,z],children:(0,_jsxRuntime.jsx)(_reactNative.Pressable,{ref:O,onPress:e=>{U&&G&&!Q.isFlick(e)&&(y&&(0,_hapticUtils.triggerHaptic)(y),h?g?.(!_):j?.(e))},onPressIn:e=>{Q.onPressIn(e),X()},onPressOut:J,disabled:!U,accessibilityRole:h?"checkbox":j?"button":void 0,accessibilityLabel:Y,accessibilityHint:N,accessibilityState:h?{checked:_,disabled:!U}:{selected:b,disabled:!U},"aria-disabled":!U,...h?{"aria-checked":_}:{"aria-selected":b},testID:P,android_ripple:{color:D.colors.surface.pressed,borderless:!1},style:({pressed:e})=>e?M.pressed:null,...E.hostProps,children:se})}):(0,_jsxRuntime.jsx)(_reactNative.View,{ref:t,accessibilityRole:"none",accessibilityLabel:Y,accessibilityHint:N,accessibilityState:{selected:b,disabled:f},"aria-selected":b,"aria-disabled":f,testID:P,style:z,children:se}),re=w&&w.length>0||I&&I.length>0,le=te?(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[b?{backgroundColor:D.colors.surface.selected}:null,v?M.divider:null],children:[ne,(0,_jsxRuntime.jsx)(_reactNative.View,{style:M.actions,children:renderActions(p)})]}):ne,oe=re?(0,_jsxRuntime.jsx)(_index5.Swipeable,{leftActions:w,rightActions:I,accessibilityLabel:Y,children:le}):le;return s?(0,_jsxRuntime.jsx)(ListItemSkeleton,{...e}):E.enabled?(0,_jsxRuntime.jsxs)(_jsxRuntime.Fragment,{children:[oe,E.renderSurface((0,_jsxRuntime.jsx)(_reactNative.View,{style:M.preview,children:se}))]}):oe}));ListItem.displayName="ListItem";const ListItemSkeleton=({subtitle:e,description:t,left:i,icon:s,right:n,chevron:r,size:l="md",containerStyle:o,style:a})=>{const c=(0,_index.useTheme)(),d=sizeFor(c,l),u=Math.round(1.15*d.titleSize),m=Math.round(1.15*d.subtitleSize);return(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[{flexDirection:"row",alignItems:"center",paddingHorizontal:c.spacing.md,paddingVertical:d.paddingVertical,minHeight:d.minHeight},o,a],children:[void 0!==i||void 0!==s?(0,_jsxRuntime.jsx)(_reactNative.View,{style:{marginRight:c.spacing.sm},children:(0,_jsxRuntime.jsx)(_index4.Skeleton,{shape:"circle",width:40,height:40})}):null,(0,_jsxRuntime.jsxs)(_reactNative.View,{style:{flex:1},children:[(0,_jsxRuntime.jsx)(_index4.Skeleton,{shape:"text",width:"70%",height:u,style:{marginBottom:c.spacing.xs}}),void 0!==e?(0,_jsxRuntime.jsx)(_index4.Skeleton,{shape:"text",width:"50%",height:m,style:void 0!==t?{marginBottom:c.spacing.xs}:void 0}):null,void 0!==t?(0,_jsxRuntime.jsx)(_index4.Skeleton,{shape:"text",width:"85%",height:m}):null]}),void 0!==n||r?(0,_jsxRuntime.jsx)(_reactNative.View,{style:{marginLeft:c.spacing.sm},children:(0,_jsxRuntime.jsx)(_index4.Skeleton,{width:20,height:20,radius:"sm"})}):null]})};ListItemSkeleton.displayName="ListItemSkeleton",ListItem.Skeleton=ListItemSkeleton;const buildStyles=e=>_reactNative.StyleSheet.create({row:{flexDirection:"row",alignItems:"center",paddingHorizontal:e.spacing.md},divider:{borderBottomWidth:_reactNative.StyleSheet.hairlineWidth,borderBottomColor:e.colors.border.primary},pressed:{backgroundColor:e.colors.surface.pressed},disabled:{opacity:.55},leftSlot:{marginRight:e.spacing.md,alignItems:"center",justifyContent:"center"},middle:{flex:1,flexDirection:"column",justifyContent:"center"},selectionLead:{flexDirection:"row",alignItems:"center"},selectionLeadContent:{marginLeft:e.spacing.sm},body:{marginTop:e.spacing.xs},rightBelow:{alignSelf:"flex-start",flexDirection:"row",alignItems:"center",marginTop:e.spacing.xs},rightSlot:{marginLeft:e.spacing.md,alignItems:"center",justifyContent:"center",flexDirection:"row"},actions:{flexDirection:"row",flexWrap:"wrap",gap:e.spacing.sm,paddingHorizontal:e.spacing.md,paddingBottom:e.spacing.md},chevronWithRight:{marginLeft:e.spacing.xs},preview:{flex:1,backgroundColor:e.colors.background.elevated,borderRadius:e.radius.md,..._corners.smoothCorners,overflow:"hidden"},title:{letterSpacing:e.typography.letterSpacing.normal},subtitle:{marginTop:2,...(0,_index.fontFor)(e,"normal")},description:{marginTop:2,...(0,_index.fontFor)(e,"normal")}}),stylesFor=(0,_themeStyles.themeStyles)(buildStyles);var _default=exports.default=ListItem;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=exports.OTPInput=void 0;var _react=require("react"),_reactNative=require("react-native"),_index=require("../../hooks/index.js"),_index2=require("../../theme/index.js"),_index3=require("../../utils/index.js"),_corners=require("../../utils/corners.js"),_FieldBase=require("../FieldBase/FieldBase.js"),_jsxRuntime=require("react/jsx-runtime");const sizeMap={sm:{cell:36,fontSize:16,borderRadius:8,gap:8},md:{cell:48,fontSize:20,borderRadius:10,gap:10},lg:{cell:56,fontSize:24,borderRadius:12,gap:12}},sanitizeChar=(e,t)=>e?"number-pad"===t?e.replace(/\D/g,""):e:"",OTPInput=exports.OTPInput=(0,_react.forwardRef)((e,t)=>{const{value:r,defaultValue:i,onChange:a,onComplete:n,length:s=6,keyboardType:o="number-pad",autoFocus:l=!1,autoFocusDelay:c=0,disabled:u=!1,error:d,size:_="md",secure:m=!1,haptic:p,
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=exports.OTPInput=void 0;var _react=require("react"),_reactNative=require("react-native"),_index=require("../../hooks/index.js"),_index2=require("../../theme/index.js"),_index3=require("../../utils/index.js"),_corners=require("../../utils/corners.js"),_FieldBase=require("../FieldBase/FieldBase.js"),_jsxRuntime=require("react/jsx-runtime");const sizeMap={sm:{cell:36,fontSize:16,borderRadius:8,gap:8},md:{cell:48,fontSize:20,borderRadius:10,gap:10},lg:{cell:56,fontSize:24,borderRadius:12,gap:12}},sanitizeChar=(e,t)=>e?"number-pad"===t?e.replace(/\D/g,""):e:"",OTPInput=exports.OTPInput=(0,_react.forwardRef)((e,t)=>{const{value:r,defaultValue:i,onChange:a,onComplete:n,length:s=6,keyboardType:o="number-pad",autoFocus:l=!1,autoFocusDelay:c=0,disabled:u=!1,error:d,size:_="md",secure:m=!1,haptic:p,onFocus:g,accessibilityLabel:f,style:x,cellStyle:h,textStyle:b,testID:v}=e,[y,j]=(0,_index.useControllableState)({value:r,defaultValue:i??"",onChange:a}),N=(0,_index2.useTheme)(),R=(0,_react.useMemo)(()=>buildStyles(N),[N]),C={...sizeMap[_],...N.components.otpInput?.[_]??{}},T=(0,_react.useRef)([]),[F,S]=(0,_react.useState)(-1),k=(0,_react.useRef)(null),V=(0,_react.useRef)((0,_index2.createAnimatedValue)(0)).current,z=(0,_react.useRef)(new Map),w=(0,_react.useMemo)(()=>{const e=z.current,t=[];for(let r=0;r<s;r+=1){let i=e.get(r);i||(i=new _reactNative.Animated.Value(0),e.set(r,i)),t.push(i)}for(const t of Array.from(e.keys()))t>=s&&e.delete(t);return t},[s]),E=(0,_react.useRef)(-1),I=N.components.otpInput?.shakeOnError??!1,A=(0,_index.useReducedMotion)(),O=!0===d||(0,_FieldBase.hasFieldText)(d);(0,_react.useEffect)(()=>{let e;return null===k.current||!O||k.current||(p&&(0,_index3.triggerHaptic)("notificationError"),I&&!A&&((0,_index2.setNativeValue)(V,0),e=_reactNative.Animated.sequence([_reactNative.Animated.timing(V,{toValue:1,duration:N.motion.duration.instant,easing:_reactNative.Easing.linear,useNativeDriver:!0}),_reactNative.Animated.timing(V,{toValue:-1,duration:N.motion.duration.instant,easing:_reactNative.Easing.linear,useNativeDriver:!0}),_reactNative.Animated.timing(V,{toValue:1,duration:N.motion.duration.instant,easing:_reactNative.Easing.linear,useNativeDriver:!0}),_reactNative.Animated.timing(V,{toValue:0,duration:N.motion.duration.instant,easing:_reactNative.Easing.linear,useNativeDriver:!0})]),e.start())),k.current=O,()=>e?.stop()},[O,V,I,p,A,N.motion.duration.instant]),(0,_react.useEffect)(()=>{const e=E.current;if(E.current=F,e===F)return;if(-1===e&&-1===F)return;const t=[];return w.forEach((r,i)=>{const a=i===F?1:0;if(i!==F&&i!==e)return;const n=_reactNative.Animated.timing(r,{toValue:a,duration:N.motion.duration.fast,easing:_reactNative.Easing.bezier(...N.motion.easing.standard),useNativeDriver:!0});n.start(),t.push(n)}),()=>t.forEach(e=>e.stop())},[F,w,N]);const M=(0,_react.useCallback)(e=>{const t=T.current[e];t&&t.focus()},[]);(0,_react.useImperativeHandle)(t,()=>({focus:()=>M(0),blur:()=>{const e=T.current[F>=0?F:0];e?.blur()},clear:()=>{j(""),M(0)}}),[M,F,j]),(0,_react.useEffect)(()=>{if(l&&!u){const e=setTimeout(()=>M(0),c);return()=>clearTimeout(e)}},[l,c,u,M]);const B=(0,_react.useMemo)(()=>{const e=new Array(s).fill("");for(let t=0;t<Math.min(y.length,s);t+=1)e[t]=y[t]??"";return e},[y,s]),D=(0,_react.useCallback)(e=>{const t=e.slice(0,s);t!==y&&(j(t),t.length===s&&n&&n(t))},[s,j,n,y]),P=(0,_react.useCallback)((e,t)=>{const r=t.replace(/\u200B/g,""),i=sanitizeChar(r,o);if(!i){const t=B.slice(),r=(t[e]??"").length>0;if(t[e]="",D(t.join("").slice(0,s)),!r&&e>0){const t=B.slice();t[e-1]="",D(t.join("")),M(e-1)}return}const a=B[e]??"",n=a&&i.length>s&&i.startsWith(a)?i.slice(a.length):i;if(n.length>=s){const t=n.slice(0,s),r=y.length;return D(t),t.length!==r&&p&&(0,_index3.triggerHaptic)(p),void T.current[e]?.blur()}const l=B.slice();let c=e;for(let e=0;e<i.length&&c<s;e+=1)l[c]=i[e]??"",c+=1;const u=l.join("").slice(0,s),d=y.length;D(u),u.length!==d&&p&&(0,_index3.triggerHaptic)(p);const _=Math.min(c,s-1);c>=s?T.current[e]?.blur():M(_)},[B,M,o,s,p,D,y]),q=(0,_react.useCallback)((e,t)=>{if("Backspace"!==t.nativeEvent.key)return;if(0===(B[e]??"").length){if(e>0){const t=B.slice();t[e-1]="",D(t.join("")),M(e-1)}}else{const t=B.slice();t[e]="",D(t.join(""))}},[B,M,D]),H=(0,_react.useCallback)((e,t)=>{S(e),g?.(t)},[g]),W=(0,_react.useCallback)(()=>{S(-1)},[]),L=(0,_react.useCallback)(()=>{if(u)return;const e=B.indexOf("");M(-1===e?s-1:e)},[B,u,M,s]),$=f??`Enter ${s}-digit code`,G=V.interpolate({inputRange:[-1,1],outputRange:[-6,6]});return(0,_jsxRuntime.jsxs)(_reactNative.View,{style:x,accessible:!0,accessibilityRole:"none",accessibilityLabel:$,accessibilityValue:{text:r},accessibilityState:{disabled:u},"aria-disabled":u,testID:v,children:[(0,_jsxRuntime.jsx)(_reactNative.Pressable,{onPress:L,disabled:u,accessible:!1,children:(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{style:[R.row,{columnGap:C.gap,transform:[{translateX:G}]}],children:B.map((e,t)=>{const r=F===t,i=e.length>0,a=O?N.colors.border.error:N.colors.border.focus,n=w[t];if(!n)return null;const l=m&&i?"●":e;return(0,_jsxRuntime.jsxs)(_reactNative.View,{style:R.cellWrapper,children:[(0,_jsxRuntime.jsxs)(_FieldBase.FieldBase,{size:_,width:C.cell,height:C.cell,borderRadius:C.borderRadius,borderWidth:1.5,focused:r,error:O,filled:i,disabled:u,paddingHorizontal:0,paddingVertical:0,gap:0,style:h,children:[(0,_jsxRuntime.jsx)(_reactNative.TextInput,{ref:e=>{T.current[t]=e},value:(m&&i?"":e)||"",onChangeText:e=>P(t,e),onKeyPress:e=>q(t,e),onFocus:e=>H(t,e),onBlur:W,keyboardType:o,editable:!u,selectTextOnFocus:!0,caretHidden:i,maxLength:s+1,textContentType:"oneTimeCode",autoComplete:0===t?"sms-otp":"off",importantForAutofill:0===t?"yes":"no",style:[R.input,{fontSize:C.fontSize,color:N.colors.text.primary,...(0,_index2.fontFor)(N,"semibold")},b]}),m&&i?(0,_jsxRuntime.jsx)(_reactNative.View,{pointerEvents:"none",style:R.maskOverlay,children:(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[{fontSize:C.fontSize,color:N.colors.text.primary,...(0,_index2.fontFor)(N,"semibold")},b],children:l})}):null]}),(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{style:[R.underline,{backgroundColor:a,opacity:n}]})]},`otp-cell-${t}`)})})}),(0,_jsxRuntime.jsx)(_FieldBase.FieldMessage,{size:_,error:!0,text:d})]})});OTPInput.displayName="OTPInput";const buildStyles=e=>_reactNative.StyleSheet.create({row:{flexDirection:"row",alignItems:"center"},cellWrapper:{alignItems:"center"},input:{width:"100%",height:"100%",textAlign:"center",padding:0},maskOverlay:{..._reactNative.StyleSheet.absoluteFill,alignItems:"center",justifyContent:"center"},underline:{marginTop:4,height:2,width:"60%",borderRadius:1,..._corners.smoothCorners}});var _default=exports.default=OTPInput;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=exports.TagInput=void 0;var _react=require("react"),_reactNative=require("react-native"),_index=require("../../hooks/index.js"),_index2=require("../../theme/index.js"),_index3=require("../../utils/index.js"),_index4=require("../Chip/index.js"),_index5=require("../FieldBase/index.js"),_jsxRuntime=require("react/jsx-runtime");const TagInput=exports.TagInput=(0,_react.forwardRef)((e,t)=>{const{value:i,defaultValue:r,onChange:
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=exports.TagInput=void 0;var _react=require("react"),_reactNative=require("react-native"),_index=require("../../hooks/index.js"),_index2=require("../../theme/index.js"),_index3=require("../../utils/index.js"),_index4=require("../Chip/index.js"),_index5=require("../FieldBase/index.js"),_jsxRuntime=require("react/jsx-runtime");const TagInput=exports.TagInput=(0,_react.forwardRef)((e,t)=>{const{value:i,defaultValue:r,onChange:n,placeholder:a,label:s,helperText:l,error:o,required:u,disabled:d=!1,size:c="md",variant:x,maxTags:p,unique:_=!0,transform:g,separators:h=[","],haptic:m,onFocus:f,style:j,testID:v}=e,b=(0,_index2.useTheme)(),y=(0,_react.useMemo)(()=>buildStyles(b),[b]),[C,R]=(0,_index.useControllableState)({value:i,defaultValue:r??[],onChange:n}),[S,T]=(0,_react.useState)(""),[q,w]=(0,_react.useState)(!1),I=(0,_react.useRef)(null),F=(0,_react.useMemo)(()=>(0,_index3.mergeRefs)(I,t),[t]),k=(0,_react.useCallback)(()=>{d||I.current?.focus()},[d]),z="number"==typeof p&&C.length>=p,B=!0===o||(0,_index5.hasFieldText)(o),N=u&&!s&&0===C.length&&0===S.length&&Boolean(a),V=(0,_react.useCallback)(e=>{const t=g?g(e.trim()):e.trim();if(!t)return;if(z)return;if(_&&C.some(e=>e.toLowerCase()===t.toLowerCase()))return void T("");R([...C,t]),T("");const i=(0,_index3.resolveHaptic)(m,"selection");i&&(0,_index3.triggerHaptic)(i)},[z,m,R,C,g,_]),D=(0,_react.useCallback)(e=>{const t=C.filter((t,i)=>i!==e);R(t);const i=(0,_index3.resolveHaptic)(m,"selection");i&&(0,_index3.triggerHaptic)(i)},[m,R,C]),H=(0,_react.useCallback)(e=>{const t=h.find(t=>t.length>0&&e.includes(t));if(t){const[i]=e.split(t);return void V(i)}T(e)},[V,h]),L=(0,_react.useCallback)(e=>{d||"Backspace"===e.nativeEvent.key&&""===S&&C.length>0&&D(C.length-1)},[d,S,D,C.length]),M=(0,_jsxRuntime.jsx)(_index5.FieldBase,{size:c,variant:x,focused:q,disabled:d,error:B,filled:C.length>0||S.length>0,onPress:k,pressFeedback:!1,style:j,children:(0,_jsxRuntime.jsxs)(_reactNative.View,{style:y.wrap,children:[C.map((e,t)=>(0,_jsxRuntime.jsx)(_index4.Chip,{label:e,size:"sm",onClose:d?void 0:()=>D(t),haptic:m},`${e}-${t}`)),(0,_jsxRuntime.jsxs)(_reactNative.View,{style:y.inputBox,children:[(0,_jsxRuntime.jsx)(_reactNative.TextInput,{ref:F,value:S,onChangeText:H,onKeyPress:L,onSubmitEditing:()=>V(S),onFocus:e=>{w(!0),f?.(e)},onBlur:()=>{w(!1),V(S)},editable:!d&&!z,placeholder:z||N?void 0:a,placeholderTextColor:b.colors.text.tertiary,blurOnSubmit:!1,returnKeyType:"done",accessibilityLabel:s??a,style:[y.input,{color:b.colors.text.primary,fontSize:b.typography.fontSize.base}],testID:v?`${v}-input`:void 0}),N?(0,_jsxRuntime.jsx)(_index5.RequiredPlaceholder,{text:a??"",color:b.colors.text.tertiary,fontSize:b.typography.fontSize.base,weightStyle:(0,_index2.fontFor)(b,"normal")}):null]})]})});return(0,_jsxRuntime.jsxs)(_reactNative.View,{testID:v,children:[s?(0,_jsxRuntime.jsx)(_index5.FieldLabel,{size:c,required:u,children:s}):null,M,(0,_jsxRuntime.jsx)(_index5.FieldMessage,{size:c,error:B,text:B?o:l})]})});TagInput.displayName="TagInput";const buildStyles=e=>_reactNative.StyleSheet.create({wrap:{flex:1,flexDirection:"row",flexWrap:"wrap",alignItems:"center",gap:e.spacing.xs,paddingVertical:e.spacing.xs},inputBox:{flexGrow:1,minWidth:80},input:{...(0,_index2.fontFor)(e,"normal"),padding:0}});var _default=exports.default=TagInput;
|
|
@@ -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:
|
|
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";Object.defineProperty(exports,"__esModule",{value:!0}),exports.lightTheme=exports.darkTheme=void 0;var _squircle=require("../utils/squircle.js");const typography={fontSize:{xs:11,sm:13,base:15,lg:17,xl:20,"2xl":24,"3xl":30,"4xl":36},fontWeight:{normal:"400",medium:"500",semibold:"600",bold:"700"},lineHeight:{tight:1.2,normal:1.4,relaxed:1.6},letterSpacing:{tight:-.2,normal:0,wide:.4}},spacing={none:0,xxs:2,xs:4,sm:8,md:12,lg:16,xl:24,"2xl":32,"3xl":48,"4xl":64},radius={none:0,xs:4,sm:6,md:10,lg:14,xl:20,"2xl":28,full:9999},FIELD_RADIUS=10,fieldSizes={sm:{paddingHorizontal:12,paddingVertical:10,minHeight:38,fontSize:13,borderRadius:10,iconSize:14,labelFontSize:11,labelGap:4,messageFontSize:11,messageGap:2},md:{paddingHorizontal:14,paddingVertical:13,minHeight:44,fontSize:14,borderRadius:10,iconSize:16,labelFontSize:12,labelGap:4,messageFontSize:12,messageGap:2},lg:{paddingHorizontal:16,paddingVertical:15,minHeight:52,fontSize:16,borderRadius:10,iconSize:18,labelFontSize:13,labelGap:4,messageFontSize:13,messageGap:2}},components={button:{xs:{paddingHorizontal:10,paddingVertical:4,minHeight:28,fontSize:12,borderRadius:8},sm:{paddingHorizontal:12,paddingVertical:6,minHeight:34,fontSize:14,borderRadius:10},md:{paddingHorizontal:16,paddingVertical:9,minHeight:
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.lightTheme=exports.darkTheme=void 0;var _squircle=require("../utils/squircle.js");const typography={fontSize:{xs:11,sm:13,base:15,lg:17,xl:20,"2xl":24,"3xl":30,"4xl":36},fontWeight:{normal:"400",medium:"500",semibold:"600",bold:"700"},lineHeight:{tight:1.2,normal:1.4,relaxed:1.6},letterSpacing:{tight:-.2,normal:0,wide:.4}},spacing={none:0,xxs:2,xs:4,sm:8,md:12,lg:16,xl:24,"2xl":32,"3xl":48,"4xl":64},radius={none:0,xs:4,sm:6,md:10,lg:14,xl:20,"2xl":28,full:9999},FIELD_RADIUS=10,fieldSizes={sm:{paddingHorizontal:12,paddingVertical:10,minHeight:38,fontSize:13,borderRadius:10,iconSize:14,labelFontSize:11,labelGap:4,messageFontSize:11,messageGap:2},md:{paddingHorizontal:14,paddingVertical:13,minHeight:44,fontSize:14,borderRadius:10,iconSize:16,labelFontSize:12,labelGap:4,messageFontSize:12,messageGap:2},lg:{paddingHorizontal:16,paddingVertical:15,minHeight:52,fontSize:16,borderRadius:10,iconSize:18,labelFontSize:13,labelGap:4,messageFontSize:13,messageGap:2}},components={button:{xs:{paddingHorizontal:10,paddingVertical:4,minHeight:28,fontSize:12,borderRadius:8},sm:{paddingHorizontal:12,paddingVertical:6,minHeight:34,fontSize:14,borderRadius:10},md:{paddingHorizontal:16,paddingVertical:9,minHeight:44,fontSize:16,borderRadius:12},lg:{paddingHorizontal:20,paddingVertical:12,minHeight:50,fontSize:18,borderRadius:14},xl:{paddingHorizontal:24,paddingVertical:14,minHeight:58,fontSize:20,borderRadius:16}},input:{sm:{...fieldSizes.sm,multilineMinHeight:72},md:{...fieldSizes.md,multilineMinHeight:92},lg:{...fieldSizes.lg,multilineMinHeight:110}},searchBar:{sm:{borderRadius:radius.full},md:{borderRadius:radius.full},lg:{borderRadius:radius.full}},emptyState:{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"}},field:{defaultVariant:"outlined",sm:fieldSizes.sm,md:fieldSizes.md,lg:fieldSizes.lg},listItem:{sm:{paddingVertical:"sm",titleFontSize:"sm",subtitleFontSize:"xs",minHeight:44},md:{paddingVertical:"md",titleFontSize:"base",subtitleFontSize:"sm",minHeight:56},lg:{paddingVertical:"lg",titleFontSize:"lg",subtitleFontSize:"sm",minHeight:72}},badge:{sm:{fontSize:10,minWidth:16,height:16,paddingHorizontal:5,dotSize:8},md:{fontSize:11,minWidth:20,height:20,paddingHorizontal:6,dotSize:10},borderWidth:1.5,anchorOffset:4},chip:{sm:{paddingHorizontal:10,paddingVertical:4,fontSize:12,minHeight:26,closeSize:16,closeFontSize:12,gap:6},md:{paddingHorizontal:12,paddingVertical:6,fontSize:13,minHeight:32,closeSize:18,closeFontSize:13,gap:8}},checkbox:{sm:{boxSize:16},md:{boxSize:20},lg:{boxSize:24},labelGap:10},radio:{sm:{outer:16,inner:8},md:{outer:20,inner:10},lg:{outer:24,inner:12},labelGap:10},switch:{sm:{trackWidth:42,trackHeight:26,thumbSize:22,padding:2},md:{trackWidth:51,trackHeight:31,thumbSize:27,padding:2},lg:{trackWidth:60,trackHeight:36,thumbSize:32,padding:2},thumbColor:"#FFFFFF"},otpInput:{sm:{cell:36,fontSize:16,borderRadius:8,gap:8},md:{cell:48,fontSize:20,borderRadius:10,gap:10},lg:{cell:56,fontSize:24,borderRadius:12,gap:12}},dialog:{iconWrapperSize:48,iconWrapperBorderRadius:24,actionButtonMinHeight:44},toast:{iconCircleSize:28,iconCircleBorderRadius:14,iconGlyphFontSize:16,tintBarWidth:0},banner:{tintBarWidth:0},formField:{inlineLabelWidth:"35%"}},motion={duration:{instant:80,fast:160,normal:240,slow:360,slower:500},fadeDuration:160,easing:{standard:[.4,0,.2,1],accelerate:[.4,0,1,1],decelerate:[0,0,.2,1],sharp:[.4,0,.6,1]},spring:{gentle:{damping:26,stiffness:240,mass:.9},bouncy:{damping:16,stiffness:200,mass:.7},snappy:{damping:20,stiffness:300,mass:.7}}},lightShadows={none:{},xs:{shadowColor:"#000",shadowOffset:{width:0,height:1},shadowOpacity:.04,shadowRadius:2,elevation:1},sm:{shadowColor:"#000",shadowOffset:{width:0,height:2},shadowOpacity:.06,shadowRadius:4,elevation:2},md:{shadowColor:"#000",shadowOffset:{width:0,height:4},shadowOpacity:.08,shadowRadius:8,elevation:4},lg:{shadowColor:"#000",shadowOffset:{width:0,height:8},shadowOpacity:.1,shadowRadius:16,elevation:8},xl:{shadowColor:"#000",shadowOffset:{width:0,height:12},shadowOpacity:.14,shadowRadius:24,elevation:12},"2xl":{shadowColor:"#000",shadowOffset:{width:0,height:20},shadowOpacity:.18,shadowRadius:32,elevation:20}},darkShadows={none:{},xs:{shadowColor:"#000",shadowOffset:{width:0,height:1},shadowOpacity:.3,shadowRadius:2,elevation:1},sm:{shadowColor:"#000",shadowOffset:{width:0,height:2},shadowOpacity:.4,shadowRadius:4,elevation:2},md:{shadowColor:"#000",shadowOffset:{width:0,height:4},shadowOpacity:.5,shadowRadius:8,elevation:4},lg:{shadowColor:"#000",shadowOffset:{width:0,height:8},shadowOpacity:.55,shadowRadius:16,elevation:8},xl:{shadowColor:"#000",shadowOffset:{width:0,height:12},shadowOpacity:.6,shadowRadius:24,elevation:12},"2xl":{shadowColor:"#000",shadowOffset:{width:0,height:20},shadowOpacity:.7,shadowRadius:32,elevation:20}},lightTheme=exports.lightTheme={mode:"light",colors:{primary:"#5B5BD6",primaryHover:"#4F4FBF",primaryPressed:"#4040A8",primaryMuted:"#EEEEFC",secondary:"#F4F4F8",secondaryHover:"#E9E9F0",success:"#18864F",warning:"#F59E0B",error:"#E12C32",info:"#1B6EF5",onPrimary:"#FFFFFF",onNeutral:"#FFFFFF",onSecondary:"#0F0F1A",onSuccess:"#FFFFFF",onWarning:"#0F0F1A",onError:"#FFFFFF",onInfo:"#FFFFFF",onOverlay:"#FFFFFF",toneText:{primary:"#4F4FD3",success:"#147042",warning:"#8F5C06",error:"#BC1B20",info:"#0958D9"},text:{primary:"#0F0F1A",secondary:"#52525B",tertiary:"#62626B",inverse:"#FFFFFF",strong:"#252F4A",disabled:"#B4B4BB",link:"#5B5BD6"},background:{primary:"#FFFFFF",secondary:"#F8F8FB",tertiary:"#F1F1F5",elevated:"#FFFFFF",overlay:"rgba(15, 15, 26, 0.5)",inverse:"#0F0F1A"},border:{primary:"#E5E5EC",secondary:"#EFEFF3",focus:"#5B5BD6",error:"#E5484D",width:1},field:{background:"#F9FBFC",backgroundFocused:"#FFFFFF",backgroundDisabled:"#F5F6FA",border:"#EBEDF3",borderFocused:"#BED2F9",borderError:"#FDBFCE",label:"#242F4A",text:"#252F4A",textDisabled:"#C4CADA",placeholder:"#626D8B",placeholderDisabled:"#C4CADA",icon:"#7A849F",iconFocused:"#4B5675",iconDisabled:"#C4CADA",caret:"#5B8DEE",message:"#D81736"},surface:{pressed:"rgba(15, 15, 26, 0.06)",hovered:"rgba(15, 15, 26, 0.04)",selected:"rgba(91, 91, 214, 0.1)",disabled:"#F1F1F5"},glass:{fill:"rgba(255, 255, 255, 0.28)",border:"rgba(255, 255, 255, 0.45)",on:"#0F0F1A",badge:"#FFFFFF"},skeleton:{background:"#EBEDF3",highlight:"#F5F6FA"},avatarPalette:["#5B5BD6","#0A7979","#A45A05","#CD226E","#2462EB","#7C3AED","#047C57","#D42222"]},typography:typography,spacing:spacing,radius:radius,cornerSmoothing:_squircle.SQUIRCLE_SMOOTHING,shadows:lightShadows,motion:motion,components:components,gradients:{}},darkTheme=exports.darkTheme={mode:"dark",colors:{primary:"#7C7CE8",primaryHover:"#9292EE",primaryPressed:"#A8A8F2",primaryMuted:"#1F1F3D",secondary:"#1F1F26",secondaryHover:"#2A2A33",success:"#30C780",warning:"#FBBF24",error:"#F87171",info:"#60A5FA",onPrimary:"#0F0F1A",onNeutral:"#0F0F1A",onSecondary:"#FAFAFA",onSuccess:"#0F0F1A",onWarning:"#0F0F1A",onError:"#0F0F1A",onInfo:"#0F0F1A",onOverlay:"#FFFFFF",toneText:{primary:"#8989EA",success:"#30C780",warning:"#FBBF24",error:"#F87171",info:"#60A5FA"},text:{primary:"#FAFAFA",secondary:"#B4B4BB",tertiary:"#919199",inverse:"#0F0F1A",strong:"#E2E2E2",disabled:"#52525B",link:"#9292EE"},background:{primary:"#0B0B12",secondary:"#13131C",tertiary:"#1C1C26",elevated:"#1C1C26",overlay:"rgba(0, 0, 0, 0.65)",inverse:"#FAFAFA"},border:{primary:"#27272F",secondary:"#1C1C26",focus:"#7C7CE8",error:"#F87171",width:1},field:{background:"#13131C",backgroundFocused:"#0B0B12",backgroundDisabled:"#1C1C26",border:"#27272F",borderFocused:"#3D5FB0",borderError:"#8A2F42",label:"#E4E6EE",text:"#FAFAFA",textDisabled:"#52525B",placeholder:"#84848D",placeholderDisabled:"#52525B",icon:"#8B8B95",iconFocused:"#D4D4DB",iconDisabled:"#52525B",caret:"#7C9EF0",message:"#F87171"},surface:{pressed:"rgba(255, 255, 255, 0.08)",hovered:"rgba(255, 255, 255, 0.05)",selected:"rgba(124, 124, 232, 0.18)",disabled:"#1C1C26"},glass:{fill:"rgba(255, 255, 255, 0.28)",border:"rgba(255, 255, 255, 0.45)",on:"#0F0F1A",badge:"#FFFFFF"},skeleton:{background:"#1C1C26",highlight:"#27272F"},avatarPalette:["#8B8BEE","#2DD4BF","#FCD34D","#F472B6","#60A5FA","#A78BFA","#34D399","#F87171"]},typography:typography,spacing:spacing,radius:radius,cornerSmoothing:_squircle.SQUIRCLE_SMOOTHING,shadows:darkShadows,motion:motion,components:components,gradients:{}};
|