@webority/mobile-ui 0.99.0 → 0.101.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/canvas-kit/kit.js +6141 -6132
- package/dist/canvas-kit/manifest.json +1 -1
- package/dist/canvas-kit/release.json +6 -6
- package/lib/commonjs/components/BottomSheet/BottomSheet.js +1 -1
- package/lib/commonjs/components/Card/Card.js +1 -1
- package/lib/commonjs/components/FieldBase/FieldBase.js +1 -1
- package/lib/commonjs/components/KeyboardAwareScrollView/KeyboardAwareScrollView.js +1 -1
- package/lib/commonjs/components/ListItem/ListItem.js +1 -1
- package/lib/commonjs/components/Modal/Modal.js +1 -1
- package/lib/commonjs/components/OptionSheet/OptionSheet.js +1 -1
- package/lib/module/components/BottomSheet/BottomSheet.js +1 -1
- package/lib/module/components/Card/Card.js +1 -1
- package/lib/module/components/FieldBase/FieldBase.js +1 -1
- package/lib/module/components/KeyboardAwareScrollView/KeyboardAwareScrollView.js +1 -1
- package/lib/module/components/ListItem/ListItem.js +1 -1
- package/lib/module/components/Modal/Modal.js +1 -1
- package/lib/module/components/OptionSheet/OptionSheet.js +1 -1
- package/package.json +6 -6
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";import{useEffect,useMemo,useRef}from"react";import{Animated,Easing,Pressable,StyleSheet,Text,View}from"react-native";import{createAnimatedValue,fontFor,resolveFieldSize,useTheme}from"../../theme/index.js";import{ariaFromState}from"../../utils/ariaState.js";import{smoothCorners}from"../../utils/corners.js";import{defaultIcons}from"../AppIcon/defaultIcons.js";import{NotationInkContext,useNotationInk}from"../Notation/Notation.js";import{SquircleFill,useSquircle}from"../SquircleFill/SquircleFill.js";import{jsx as _jsx,jsxs as _jsxs,Fragment as _Fragment}from"react/jsx-runtime";const expandColorSides=e=>"string"==typeof e?{top:e,right:e,bottom:e,left:e}:{top:e.top??"transparent",right:e.right??"transparent",bottom:e.bottom??"transparent",left:e.left??"transparent"},expandWidthSides=e=>"number"==typeof e?{top:e,right:e,bottom:e,left:e}:{top:e.top??0,right:e.right??0,bottom:e.bottom??0,left:e.left??0};export const pickRepresentativeBorderColor=e=>{for(const t of["bottom","top","left","right"]){const o=e[t];if(o&&"transparent"!==o)return o}return e.bottom};export const resolveFieldTextStyle=(e,t={})=>{const{disabled:o=!1}=t;return{color:o?e.colors["field-text-disabled"]:e.colors["field-text"],placeholderColor:o?e.colors["field-placeholder-disabled"]:e.colors["field-placeholder"],weightStyle:fontFor(e,"normal")}};export const RequiredMark=()=>{const e=useTheme();return _jsx(Text,{style:{color:e.colors["danger-text"]},children:`
|
|
1
|
+
"use strict";import{useEffect,useMemo,useRef}from"react";import{Animated,Easing,Pressable,StyleSheet,Text,View}from"react-native";import{createAnimatedValue,fontFor,resolveFieldSize,useTheme}from"../../theme/index.js";import{ariaFromState}from"../../utils/ariaState.js";import{smoothCorners}from"../../utils/corners.js";import{defaultIcons}from"../AppIcon/defaultIcons.js";import{NotationInkContext,useNotationInk}from"../Notation/Notation.js";import{SquircleFill,useSquircle}from"../SquircleFill/SquircleFill.js";import{jsx as _jsx,jsxs as _jsxs,Fragment as _Fragment}from"react/jsx-runtime";const expandColorSides=e=>"string"==typeof e?{top:e,right:e,bottom:e,left:e}:{top:e.top??"transparent",right:e.right??"transparent",bottom:e.bottom??"transparent",left:e.left??"transparent"},expandWidthSides=e=>"number"==typeof e?{top:e,right:e,bottom:e,left:e}:{top:e.top??0,right:e.right??0,bottom:e.bottom??0,left:e.left??0};export const pickRepresentativeBorderColor=e=>{for(const t of["bottom","top","left","right"]){const o=e[t];if(o&&"transparent"!==o)return o}return e.bottom};export const resolveFieldTextStyle=(e,t={})=>{const{disabled:o=!1}=t;return{color:o?e.colors["field-text-disabled"]:e.colors["field-text"],placeholderColor:o?e.colors["field-placeholder-disabled"]:e.colors["field-placeholder"],weightStyle:fontFor(e,"normal")}};export const RequiredMark=()=>{const e=useTheme();return _jsx(Text,{style:{color:e.colors["danger-text"]},children:` ${e.settings.components.field?.requiredMarker??"*"}`})};export const RequiredPlaceholder=({text:e,color:t,fontSize:o,weightStyle:r,align:i="center",paddingTop:l,textAlign:s})=>_jsx(View,{pointerEvents:"none",style:[StyleSheet.absoluteFill,{justifyContent:"top"===i?"flex-start":"center",paddingTop:l}],children:_jsxs(Text,{accessible:!1,numberOfLines:1,style:{color:t,fontSize:o,...r,includeFontPadding:!1,textAlign:s},children:[e,_jsx(RequiredMark,{})]})});export const FieldErrorGlyph=({size:e,color:t})=>{const o=useTheme().settings.icons.error??defaultIcons.error;return _jsx(_Fragment,{children:o({size:e,color:t})})};export const hasFieldText=e=>null!=e&&!1!==e&&!0!==e&&""!==e;export const fieldTextAsString=e=>"string"==typeof e?e:void 0;export const FieldLabel=({children:e,size:t="md",required:o=!1,help:r,color:i,style:l})=>{const s=useTheme(),n=resolveFieldSize(s,t),d=hasFieldText(r),a=useNotationInk(l,n["label-text"],i??s.colors["field-label"]),c=_jsxs(Text,{style:[familyStyles.label,{color:i??s.colors["field-label"],fontSize:n["label-text"],...fontFor(s,"semibold"),marginBottom:d?s.space.none:n["label-gap"]},d?familyStyles.labelShrink:null,l],children:[_jsx(NotationInkContext.Provider,{value:a,children:e}),o?_jsx(RequiredMark,{}):null]});return d?_jsxs(View,{style:[familyStyles.labelRow,{marginBottom:n["label-gap"]}],children:[c,_jsx(View,{style:[familyStyles.help,{marginLeft:s.space.xs}],children:r})]}):c};export const FieldMessage=({text:e,error:t=!1,size:o="md",style:r})=>{const i=useTheme(),l=resolveFieldSize(i,o),s=t?i.colors["field-message"]:i.colors["text-muted"],n=useNotationInk(r,l["message-text"],s);return hasFieldText(e)?_jsxs(View,{style:[familyStyles.messageRow,{marginTop:l["message-gap"],columnGap:i.space.xs}],accessibilityLiveRegion:t?"polite":"none",children:[t?_jsx(FieldErrorGlyph,{size:l["message-text"],color:s}):null,_jsx(Text,{style:[familyStyles.messageText,{color:s,fontSize:l["message-text"],...fontFor(i,"normal")},r],children:_jsx(NotationInkContext.Provider,{value:n,children:e})})]}):null};const familyStyles=StyleSheet.create({label:{includeFontPadding:!1},labelShrink:{flexShrink:1},labelRow:{flexDirection:"row",alignItems:"center"},help:{flexShrink:0,alignItems:"center",justifyContent:"center"},messageRow:{flexDirection:"row",alignItems:"center"},messageText:{flexShrink:1,includeFontPadding:!1}});export const resolveVariantColors=(e,t)=>{let o,r,i,l,s;"outlined"===t?(o=e.colors["field-bg"],r=e.colors["field-bg-focus"],i=e.colors["field-bg-disabled"],l=e.colors["field-border"],s=e.size.border):"underline"===t?(o="transparent",r=void 0,i="transparent",l={bottom:e.colors["field-border"]},s={bottom:e.size.border}):(o=e.colors["field-bg"],r=void 0,i=e.colors["field-bg-disabled"],l="transparent",s=0);const wrapToIdleShape=e=>"string"==typeof l?e:{bottom:e},n=expandColorSides(l),d=expandColorSides(wrapToIdleShape(e.colors["field-border-focus"]));return{backgroundIdleEmpty:o,backgroundIdleFilled:o,backgroundFocused:r,backgroundError:void 0,backgroundDisabled:i,borderIdle:n,borderFocused:d,borderError:expandColorSides(wrapToIdleShape(e.colors["field-border-error"])),borderDisabled:expandColorSides(l),borderWidth:expandWidthSides(s),borderFocusedRepresentative:pickRepresentativeBorderColor(d)}};export const FieldBase=e=>{const{size:t="md",variant:o,focused:r=!1,disabled:i=!1,error:l=!1,filled:s=!1,leading:n,leadingDivider:d=!1,trailing:a,slotAlign:c="center",slotLineHeight:b,topNotch:u,children:p,onPress:g,pressFeedback:m=!0,minHeight:h,maxHeight:f,width:x,height:y,paddingHorizontal:S,paddingLeft:F,paddingRight:R,paddingVertical:j,borderRadius:v,borderTopLeftRadius:C,borderTopRightRadius:k,borderBottomLeftRadius:T,borderBottomRightRadius:w,borderWidth:_,borderTopWidth:I,borderRightWidth:L,borderBottomWidth:z,borderLeftWidth:V,gap:B,style:W,testID:E,accessibilityRole:D,accessibilityLabel:q,accessibilityState:A,accessibilityHint:M}=e,P=useTheme(),N=useMemo(()=>buildStyles(),[]),H=o??P.settings.components.field?.defaultVariant??"outlined",G=resolveFieldSize(P,t),O=useMemo(()=>resolveVariantColors(P,H),[P,H]),$=l?2:r?1:0,J=useRef(createAnimatedValue($)).current;useEffect(()=>{const e=Animated.timing(J,{toValue:$,duration:P.motion.duration.fast,easing:Easing.bezier(...P.motion.ease["in-out"]),useNativeDriver:!1});return e.start(),()=>e.stop()},[$,J,P.motion.duration.fast,P.motion.ease["in-out"]]);const K=[0,1,2],Q=s?O.backgroundIdleFilled:O.backgroundIdleEmpty,U=O.backgroundFocused??Q,X=O.backgroundError??Q,Y=i?O.backgroundDisabled:J.interpolate({inputRange:K,outputRange:[Q,U,X]}),Z=O.borderIdle,ee=O.borderFocused,te=O.borderError,oe={top:I,right:L,bottom:z,left:V},re={top:oe.top??_??O.borderWidth.top,right:oe.right??_??O.borderWidth.right,bottom:oe.bottom??_??O.borderWidth.bottom,left:oe.left??_??O.borderWidth.left},ie={minHeight:y??h??G["min-height"],maxHeight:f,paddingHorizontal:S??G["padding-x"],paddingVertical:j??G["padding-y"],paddingLeft:F??S??G["padding-x"],paddingRight:R??S??G["padding-x"],backgroundColor:Y,columnGap:B??P.space.md,alignItems:"top"===c?"flex-start":"center"},le="underline"===H,se=le?P.radius.none:v??G.radius,ne=le?{tl:P.radius.none,tr:P.radius.none,bl:P.radius.none,br:P.radius.none}:{tl:C??se,tr:k??se,bl:T??se,br:w??se};ie.borderTopLeftRadius=ne.tl,ie.borderTopRightRadius=ne.tr,ie.borderBottomLeftRadius=ne.bl,ie.borderBottomRightRadius=ne.br,ie.borderCurve=smoothCorners.borderCurve,ie.borderTopWidth=re.top,ie.borderRightWidth=re.right,ie.borderBottomWidth=re.bottom,ie.borderLeftWidth=re.left;const sideColor=e=>J.interpolate({inputRange:K,outputRange:[Z[e],ee[e],te[e]]}),sameOnEverySide=e=>e.top===e.right&&e.top===e.bottom&&e.top===e.left,de=!le&&ne.tl===ne.tr&&ne.tl===ne.bl&&ne.tl===ne.br&&sameOnEverySide(re)&&sameOnEverySide(Z)&&sameOnEverySide(ee)&&sameOnEverySide(te)&&sameOnEverySide(O.borderDisabled),ae=useSquircle(de,ne.tl);if(ae.active)ie.backgroundColor="transparent",ie.borderTopColor="transparent",ie.borderRightColor="transparent",ie.borderBottomColor="transparent",ie.borderLeftColor="transparent";else if(i){const e=O.borderDisabled;ie.borderTopColor=e.top,ie.borderRightColor=e.right,ie.borderBottomColor=e.bottom,ie.borderLeftColor=e.left}else ie.borderTopColor=sideColor("top"),ie.borderRightColor=sideColor("right"),ie.borderBottomColor=sideColor("bottom"),ie.borderLeftColor=sideColor("left");const ce=i?O.borderDisabled.top:sideColor("top"),be=useRef($);be.current=$,useEffect(()=>{J.setValue(be.current)},[O,J]),void 0!==x&&(ie.width=x),void 0!==y&&(ie.height=y);const ue={disabled:i,...A},pe="top"===c,ge=pe?{alignSelf:"flex-start",marginTop:Math.max(0,((b??G.icon)-G.icon)/2)}:null,me=y??h??G["min-height"],he=(()=>{if(!u)return 0;const e=Math.min(ne.tl,me/2),t=u.left;return e<=0||t>=e?0:Math.ceil(e-Math.sqrt(e*e-(e-t)*(e-t)))})(),fe=u&&re.top>0?_jsx(Animated.View,{pointerEvents:"none",style:{position:"absolute",top:-re.top,left:u.left-re.left,width:u.width,height:re.top+he,backgroundColor:Y}}):null,renderInner=e=>_jsxs(_Fragment,{children:[ae.active&&ae.size?_jsx(SquircleFill,{width:ae.size.width,height:ae.size.height,radius:ne.tl,fill:e&&!i?P.colors["surface-pressed"]:Y,stroke:ce,strokeWidth:re.top,outset:re.top}):null,fe,null!=n?_jsx(View,{style:[N.slot,ge],children:n}):null,null!=n&&d?_jsx(View,{pointerEvents:"none",style:[N.divider,ge,{height:G.icon,backgroundColor:P.colors["field-border"]}]}):null,_jsx(View,{style:[N.content,pe?N.contentTop:null],children:p}),null!=a?_jsx(View,{style:[N.slot,ge],children:a}):null]}),xe=_jsx(Animated.View,{onLayout:ae.onLayout,style:[N.box,ie,W],accessibilityRole:D,accessibilityLabel:q,accessibilityHint:M,accessibilityState:ue,...ariaFromState(ue),testID:E,children:renderInner(!1)});return g&&!m?_jsx(Pressable,{onPress:g,disabled:i,accessible:!1,children:xe}):g?_jsx(Pressable,{onPress:g,disabled:i,accessibilityRole:D??"button",accessibilityLabel:q,accessibilityHint:M,accessibilityState:ue,...ariaFromState(ue),testID:E,children:({pressed:e})=>_jsx(Animated.View,{onLayout:ae.onLayout,style:[N.box,ie,!e||i||ae.active?null:{backgroundColor:P.colors["surface-pressed"]},W],children:renderInner(e)})}):xe};FieldBase.displayName="FieldBase";const buildStyles=()=>StyleSheet.create({box:{flexDirection:"row",alignItems:"center",overflow:"visible"},slot:{alignItems:"center",justifyContent:"center"},divider:{width:1,alignSelf:"center"},content:{flex:1,flexDirection:"row",alignItems:"center"},contentTop:{alignItems:"flex-start"}});export default FieldBase;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";import{forwardRef}from"react";import{Keyboard,Pressable,RefreshControl}from"react-native";import{KeyboardAwareScrollView as ControllerScrollView}from"react-native-keyboard-controller";import{useSafeAreaInsets}from"react-native-safe-area-context";import{useTheme}from"../../theme/index.js";import{jsx as _jsx}from"react/jsx-runtime";const tapAreaStyle={flexGrow:1},KeyboardAwareScrollView=forwardRef((e,r)=>{const{children:o,bottomOffset:t=24,extraKeyboardSpace:s=0,safeAreaEdges:a=["bottom"],refreshing:l=!1,onRefresh:i,dismissOnTapOutside:n=!1,contentContainerStyle:d,refreshControl:c,...f}=e,m=useTheme(),p=useSafeAreaInsets(),b=a.includes("bottom"),y={paddingBottom:b?p.bottom:0,...a.includes("top")?{paddingTop:p.top}:null,...a.includes("left")?{paddingLeft:p.left}:null,...a.includes("right")?{paddingRight:p.right}:null},u=c??(i?_jsx(RefreshControl,{refreshing:l,onRefresh:i,tintColor:m.colors.primary,colors:[m.colors.primary],progressBackgroundColor:m.colors.surface,titleColor:m.colors["text-muted"]}):void 0);return _jsx(ControllerScrollView,{ref:r,bottomOffset:t,extraKeyboardSpace:s-(b?p.bottom:0),keyboardShouldPersistTaps:"handled",keyboardDismissMode:"none",contentContainerStyle:[d,y],refreshControl:u,...f,children:n?_jsx(Pressable,{accessible:!1,onPress:Keyboard.dismiss,style:tapAreaStyle,children:o}):o})});KeyboardAwareScrollView.displayName="KeyboardAwareScrollView";export{KeyboardAwareScrollView};export default KeyboardAwareScrollView;
|
|
1
|
+
"use strict";import{forwardRef}from"react";import{Keyboard,Pressable,RefreshControl}from"react-native";import{KeyboardAwareScrollView as ControllerScrollView}from"react-native-keyboard-controller";import{useSafeAreaInsets}from"react-native-safe-area-context";import{useTheme}from"../../theme/index.js";import{jsx as _jsx}from"react/jsx-runtime";const tapAreaStyle={flexGrow:1},KeyboardAwareScrollView=forwardRef((e,r)=>{const{children:o,bottomOffset:t=24,extraKeyboardSpace:s=0,safeAreaEdges:a=["bottom"],refreshing:l=!1,onRefresh:i,dismissOnTapOutside:n=!1,contentContainerStyle:d,refreshControl:c,...f}=e,m=useTheme(),p=useSafeAreaInsets(),b=a.includes("bottom"),y={paddingBottom:b?p.bottom:0,...a.includes("top")?{paddingTop:p.top}:null,...a.includes("left")?{paddingLeft:p.left}:null,...a.includes("right")?{paddingRight:p.right}:null},u=c??(i?_jsx(RefreshControl,{refreshing:l,onRefresh:i,tintColor:m.colors.primary,colors:[m.colors.primary],progressBackgroundColor:m.colors.surface,titleColor:m.colors["text-muted"]}):void 0);return _jsx(ControllerScrollView,{ref:r,bottomOffset:t,extraKeyboardSpace:s-(b?p.bottom:0),disableScrollOnKeyboardHide:!0,keyboardShouldPersistTaps:"handled",keyboardDismissMode:"none",contentContainerStyle:[d,y],refreshControl:u,...f,children:n?_jsx(Pressable,{accessible:!1,onPress:Keyboard.dismiss,style:tapAreaStyle,children:o}):o})});KeyboardAwareScrollView.displayName="KeyboardAwareScrollView";export{KeyboardAwareScrollView};export default KeyboardAwareScrollView;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";import React,{forwardRef,useMemo}from"react";import{Animated,Pressable,StyleSheet,Text,useWindowDimensions,View}from"react-native";import Svg,{Path}from"react-native-svg";import{useFlickGuard}from"../../hooks/useFlickGuard.js";import{usePressAnimation}from"../../hooks/usePressAnimation.js";import{fontFor,resolveCheckboxSize,resolveListItemSize,useTheme}from"../../theme/index.js";import{smoothCorners}from"../../utils/corners.js";import{triggerHaptic}from"../../utils/hapticUtils.js";import{mergeRefs}from"../../utils/mergeRefs.js";import{themeStyles}from"../../utils/themeStyles.js";import{defaultIcons}from"../AppIcon/defaultIcons.js";import{Button}from"../Button/index.js";import{IconBadge}from"../IconBadge/index.js";import{useContextMenu}from"../Menu/useContextMenu.js";import{Skeleton}from"../Skeleton/index.js";import{Swipeable}from"../Swipeable/index.js";import{Fragment as _Fragment,jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const Chevron=({color:e})=>{const t=useTheme();return _jsx(_Fragment,{children:(t.settings.icons.chevronRight??defaultIcons.chevronRight)({size:20,color:e})})},BADGE_SIZE={sm:"sm",md:"md",lg:"lg"},RIGHT_BELOW_FONT_SCALE=1.2,SelectionBox=({checked:e,disabled:t})=>{const s=useTheme(),i=resolveCheckboxSize(s,"md")["box-size"],o=Math.round(.72*i);return _jsx(View,{accessibilityElementsHidden:!0,importantForAccessibility:"no-hide-descendants",pointerEvents:"none",style:{width:i,height:i,alignItems:"center",justifyContent:"center",borderWidth:s.size.border,borderRadius:s.radius.sm,...smoothCorners,borderColor:e?s.colors.primary:s.colors.border,backgroundColor:e?s.colors.primary:t?s.colors["surface-disabled"]:"transparent"},children:e?_jsx(Svg,{width:o,height:o,viewBox:"0 0 24 24",children:_jsx(Path,{d:"M5 12.5l4.5 4.5L19 7.5",stroke:s.colors["on-primary"],strokeWidth:3,strokeLinecap:"round",strokeLinejoin:"round",fill:"none"})}):null})},isActionList=e=>Array.isArray(e)&&e.length>0&&e.every(e=>null!=e&&"object"==typeof e&&!React.isValidElement(e)&&"label"in e),renderActions=e=>isActionList(e)?e.map(e=>_jsx(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=React.memo(forwardRef((e,t)=>{const{title:s,loading:i=!1,subtitle:o,description:l,children:r,titleLines:n=1,subtitleLines:c=1,left:d,icon:a,iconTone:m="primary",right:h,rightPlacement:u="auto",selectable:x=!1,checked:p=!1,onCheckedChange:g,actions:b,onPress:f,haptic:y,selected:j=!1,disabled:S=!1,size:w="md",divider:_=!1,chevron:v=!1,leftActions:I,rightActions:L,contextMenu:k,accessibilityLabel:C,accessibilityHint:V,style:A,containerStyle:R,titleStyle:B,subtitleStyle:z,descriptionStyle:D,leftSlotStyle:F,rightSlotStyle:P,testID:T}=e,H=useTheme(),M=useMemo(()=>resolveListItemSize(H,w),[H,w]),W=stylesFor(H),{fontScale:E}=useWindowDimensions(),O=!!h&&("below"===u||"auto"===u&&E>1.2),G=useContextMenu(S?void 0:k,{haptic:y||!1,testID:T}),N=useMemo(()=>mergeRefs(t,G.hostRef),[t,G.hostRef]),Z=x||!!f,U=Z||G.enabled,q=U&&!S,{style:J,pressIn:K,pressOut:Q}=usePressAnimation({enabled:q}),X=useFlickGuard(),Y=C??("string"==typeof s?s:void 0),isText=e=>"string"==typeof e||"number"==typeof e,$=d??(void 0===a?null:_jsx(IconBadge,{icon:a,tone:m,size:BADGE_SIZE[w]})),ee=x?_jsxs(View,{style:W.selectionLead,children:[_jsx(SelectionBox,{checked:p,disabled:S}),$?_jsx(View,{style:W.selectionLeadContent,children:$}):null]}):$,te=null!=b&&!1!==b&&!(Array.isArray(b)&&0===b.length),se=_&&!te,ie=_jsxs(View,{style:[W.row,{paddingVertical:M["padding-y"],minHeight:M["min-height"],backgroundColor:j?H.colors["surface-selected"]:"transparent"},se?W.divider:null,S?W.disabled:null,R],children:[ee?_jsx(View,{style:[W.leftSlot,F],children:ee}):null,_jsxs(View,{style:W.middle,children:[null==s||isText(s)?_jsx(Text,{style:[W.title,{fontSize:M["title-text"],...fontFor(H,"medium"),color:S?H.colors["text-disabled"]:H.colors["text-body"]},B],numberOfLines:n,children:s??" "}):s,null==o||""===o?null:isText(o)?_jsx(Text,{style:[W.subtitle,{fontSize:M["subtitle-text"],color:S?H.colors["text-disabled"]:H.colors["text-muted"]},z],numberOfLines:c,children:o}):o,l?_jsx(Text,{style:[W.description,{fontSize:M["subtitle-text"],color:S?H.colors["text-disabled"]:H.colors["text-subtle"]},D],numberOfLines:2,children:l}):null,null!=r&&!1!==r?_jsx(View,{style:W.body,children:r}):null,O?_jsx(View,{style:[W.rightBelow,P],children:h}):null]}),h&&!O||v?_jsxs(View,{style:[W.rightSlot,O?null:P],children:[O?null:h,v?_jsx(View,{style:h&&!O?W.chevronWithRight:null,children:_jsx(Chevron,{color:S?H.colors["text-disabled"]:H.colors["text-subtle"]})}):null]}):null]}),oe=U?_jsx(
|
|
1
|
+
"use strict";import React,{forwardRef,useMemo}from"react";import{Animated,Pressable,StyleSheet,Text,useWindowDimensions,View}from"react-native";import Svg,{Path}from"react-native-svg";import{useFlickGuard}from"../../hooks/useFlickGuard.js";import{usePressAnimation}from"../../hooks/usePressAnimation.js";import{fontFor,resolveCheckboxSize,resolveListItemSize,useTheme}from"../../theme/index.js";import{smoothCorners}from"../../utils/corners.js";import{triggerHaptic}from"../../utils/hapticUtils.js";import{mergeRefs}from"../../utils/mergeRefs.js";import{themeStyles}from"../../utils/themeStyles.js";import{defaultIcons}from"../AppIcon/defaultIcons.js";import{Button}from"../Button/index.js";import{IconBadge}from"../IconBadge/index.js";import{useContextMenu}from"../Menu/useContextMenu.js";import{Skeleton}from"../Skeleton/index.js";import{Swipeable}from"../Swipeable/index.js";import{Fragment as _Fragment,jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const Chevron=({color:e})=>{const t=useTheme();return _jsx(_Fragment,{children:(t.settings.icons.chevronRight??defaultIcons.chevronRight)({size:20,color:e})})},BADGE_SIZE={sm:"sm",md:"md",lg:"lg"},RIGHT_BELOW_FONT_SCALE=1.2,SelectionBox=({checked:e,disabled:t})=>{const s=useTheme(),i=resolveCheckboxSize(s,"md")["box-size"],o=Math.round(.72*i);return _jsx(View,{accessibilityElementsHidden:!0,importantForAccessibility:"no-hide-descendants",pointerEvents:"none",style:{width:i,height:i,alignItems:"center",justifyContent:"center",borderWidth:s.size.border,borderRadius:s.radius.sm,...smoothCorners,borderColor:e?s.colors.primary:s.colors.border,backgroundColor:e?s.colors.primary:t?s.colors["surface-disabled"]:"transparent"},children:e?_jsx(Svg,{width:o,height:o,viewBox:"0 0 24 24",children:_jsx(Path,{d:"M5 12.5l4.5 4.5L19 7.5",stroke:s.colors["on-primary"],strokeWidth:3,strokeLinecap:"round",strokeLinejoin:"round",fill:"none"})}):null})},isActionList=e=>Array.isArray(e)&&e.length>0&&e.every(e=>null!=e&&"object"==typeof e&&!React.isValidElement(e)&&"label"in e),renderActions=e=>isActionList(e)?e.map(e=>_jsx(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=React.memo(forwardRef((e,t)=>{const{title:s,loading:i=!1,subtitle:o,description:l,children:r,titleLines:n=1,subtitleLines:c=1,left:d,icon:a,iconTone:m="primary",right:h,rightPlacement:u="auto",selectable:x=!1,checked:p=!1,onCheckedChange:g,actions:b,onPress:f,haptic:y,selected:j=!1,disabled:S=!1,size:w="md",divider:_=!1,chevron:v=!1,leftActions:I,rightActions:L,contextMenu:k,accessibilityLabel:C,accessibilityHint:V,style:A,containerStyle:R,titleStyle:B,subtitleStyle:z,descriptionStyle:D,leftSlotStyle:F,rightSlotStyle:P,testID:T}=e,H=useTheme(),M=useMemo(()=>resolveListItemSize(H,w),[H,w]),W=stylesFor(H),{fontScale:E}=useWindowDimensions(),O=!!h&&("below"===u||"auto"===u&&E>1.2),G=useContextMenu(S?void 0:k,{haptic:y||!1,testID:T}),N=useMemo(()=>mergeRefs(t,G.hostRef),[t,G.hostRef]),Z=x||!!f,U=Z||G.enabled,q=U&&!S,{style:J,pressIn:K,pressOut:Q}=usePressAnimation({enabled:q}),X=useFlickGuard(),Y=C??("string"==typeof s?s:void 0),isText=e=>"string"==typeof e||"number"==typeof e,$=d??(void 0===a?null:_jsx(IconBadge,{icon:a,tone:m,size:BADGE_SIZE[w]})),ee=x?_jsxs(View,{style:W.selectionLead,children:[_jsx(SelectionBox,{checked:p,disabled:S}),$?_jsx(View,{style:W.selectionLeadContent,children:$}):null]}):$,te=null!=b&&!1!==b&&!(Array.isArray(b)&&0===b.length),se=_&&!te,ie=_jsxs(View,{style:[W.row,{paddingVertical:M["padding-y"],minHeight:M["min-height"],backgroundColor:j?H.colors["surface-selected"]:"transparent"},se?W.divider:null,S?W.disabled:null,R],children:[ee?_jsx(View,{style:[W.leftSlot,F],children:ee}):null,_jsxs(View,{style:W.middle,children:[null==s||isText(s)?_jsx(Text,{style:[W.title,{fontSize:M["title-text"],...fontFor(H,"medium"),color:S?H.colors["text-disabled"]:H.colors["text-body"]},B],numberOfLines:n,children:s??" "}):s,null==o||""===o?null:isText(o)?_jsx(Text,{style:[W.subtitle,{fontSize:M["subtitle-text"],color:S?H.colors["text-disabled"]:H.colors["text-muted"]},z],numberOfLines:c,children:o}):o,l?_jsx(Text,{style:[W.description,{fontSize:M["subtitle-text"],color:S?H.colors["text-disabled"]:H.colors["text-subtle"]},D],numberOfLines:2,children:l}):null,null!=r&&!1!==r?_jsx(View,{style:W.body,children:r}):null,O?_jsx(View,{style:[W.rightBelow,P],children:h}):null]}),h&&!O||v?_jsxs(View,{style:[W.rightSlot,O?null:P],children:[O?null:h,v?_jsx(View,{style:h&&!O?W.chevronWithRight:null,children:_jsx(Chevron,{color:S?H.colors["text-disabled"]:H.colors["text-subtle"]})}):null]}):null]}),oe=U?_jsx(Pressable,{ref:N,onPress:e=>{q&&Z&&!X.isFlick(e)&&(y&&triggerHaptic(y),x?g?.(!p):f?.(e))},onPressIn:e=>{X.onPressIn(e),K()},onPressOut:Q,disabled:!q,accessibilityRole:x?"checkbox":f?"button":void 0,accessibilityLabel:Y,accessibilityHint:V,accessibilityState:x?{checked:p,disabled:!q}:{selected:j,disabled:!q},"aria-disabled":!q,...x?{"aria-checked":p}:{"aria-selected":j},testID:T,android_ripple:{color:H.colors["surface-pressed"],borderless:!1},style:({pressed:e})=>[A,e?W.pressed:null],...G.hostProps,children:_jsx(Animated.View,{style:J,children:ie})}):_jsx(View,{ref:t,accessibilityRole:"none",accessibilityLabel:Y,accessibilityHint:V,accessibilityState:{selected:j,disabled:S},"aria-selected":j,"aria-disabled":S,testID:T,style:A,children:ie}),le=I&&I.length>0||L&&L.length>0,re=te?_jsxs(View,{style:[j?{backgroundColor:H.colors["surface-selected"]}:null,_?W.divider:null],children:[oe,_jsx(View,{style:W.actions,children:renderActions(b)})]}):oe,ne=le?_jsx(Swipeable,{leftActions:I,rightActions:L,accessibilityLabel:Y,children:re}):re;return i?_jsx(ListItemSkeleton,{...e}):G.enabled?_jsxs(_Fragment,{children:[ne,G.renderSurface(_jsx(View,{style:W.preview,children:ie}))]}):ne}));ListItem.displayName="ListItem";const ListItemSkeleton=({subtitle:e,description:t,left:s,icon:i,right:o,chevron:l,size:r="md",containerStyle:n,style:c})=>{const d=useTheme(),a=resolveListItemSize(d,r),m=Math.round(1.15*a["title-text"]),h=Math.round(1.15*a["subtitle-text"]);return _jsxs(View,{style:[{flexDirection:"row",alignItems:"center",paddingHorizontal:d.space.md,paddingVertical:a["padding-y"],minHeight:a["min-height"]},n,c],children:[void 0!==s||void 0!==i?_jsx(View,{style:{marginRight:d.space.sm},children:_jsx(Skeleton,{shape:"circle",width:40,height:40})}):null,_jsxs(View,{style:{flex:1},children:[_jsx(Skeleton,{shape:"text",width:"70%",height:m,style:{marginBottom:d.space.xs}}),void 0!==e?_jsx(Skeleton,{shape:"text",width:"50%",height:h,style:void 0!==t?{marginBottom:d.space.xs}:void 0}):null,void 0!==t?_jsx(Skeleton,{shape:"text",width:"85%",height:h}):null]}),void 0!==o||l?_jsx(View,{style:{marginLeft:d.space.sm},children:_jsx(Skeleton,{width:20,height:20,radius:"sm"})}):null]})};ListItemSkeleton.displayName="ListItemSkeleton",ListItem.Skeleton=ListItemSkeleton;const buildStyles=e=>StyleSheet.create({row:{flexDirection:"row",alignItems:"center",paddingHorizontal:e.space.md},divider:{borderBottomWidth:StyleSheet.hairlineWidth,borderBottomColor:e.colors.border},pressed:{backgroundColor:e.colors["surface-pressed"]},disabled:{opacity:.55},leftSlot:{marginRight:e.space.md,alignItems:"center",justifyContent:"center"},middle:{flex:1,flexDirection:"column",justifyContent:"center"},selectionLead:{flexDirection:"row",alignItems:"center"},selectionLeadContent:{marginLeft:e.space.sm},body:{marginTop:e.space.xs},rightBelow:{alignSelf:"flex-start",flexDirection:"row",alignItems:"center",marginTop:e.space.xs},rightSlot:{marginLeft:e.space.md,alignItems:"center",justifyContent:"center",flexDirection:"row"},actions:{flexDirection:"row",flexWrap:"wrap",gap:e.space.sm,paddingHorizontal:e.space.md,paddingBottom:e.space.md},chevronWithRight:{marginLeft:e.space.xs},preview:{flex:1,backgroundColor:e.colors.surface,borderRadius:e.radius.md,...smoothCorners,overflow:"hidden"},title:{letterSpacing:e["letter-spacing"].normal},subtitle:{marginTop:e.space.xxs,...fontFor(e,"normal")},description:{marginTop:e.space.xxs,...fontFor(e,"normal")}}),stylesFor=themeStyles(buildStyles);export{ListItem};export default ListItem;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";import{forwardRef,useCallback,useEffect,useMemo,useRef,useState}from"react";import{AccessibilityInfo,Animated,Dimensions,Easing,Platform,Pressable,Modal as RNModal,StyleSheet,View}from"react-native";import{usePresenceMotion}from"../../hooks/usePresenceMotion.js";import{createAnimatedValue,useTheme}from"../../theme/index.js";import{transparentOf,withAlpha}from"../../utils/color.js";import{smoothCorners}from"../../utils/corners.js";import{resolveHaptic,triggerHaptic}from"../../utils/hapticUtils.js";import{squircleHostRadius}from"../../utils/squircle.js";import{ModalSafeArea,useModalInsets}from"../ModalSafeArea/ModalSafeArea.js";import{SquircleFill,useSquircle}from"../SquircleFill/SquircleFill.js";import{ToastHost}from"../Toast/ToastProvider.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";export const MODAL_DISMISS_GRACE_MS=300;const SCALE_START_VALUE=.9,Modal=forwardRef((e,t)=>{const{visible:s,onRequestClose:r,presentation:i="centered",backdropOpacity:o,backdropPressClose:a=!0,animationDuration:n,animateMount:l=!0,accessibilityLabel:u,hardwareBackPress:c=!0,children:d,contentStyle:m,backdropStyle:f,restoreFocusRef:p,onDismissed:g,haptic:b,testID:h}=e,S=useTheme(),
|
|
1
|
+
"use strict";import{forwardRef,useCallback,useEffect,useMemo,useRef,useState}from"react";import{AccessibilityInfo,Animated,Dimensions,Easing,Keyboard,Platform,Pressable,Modal as RNModal,StyleSheet,View}from"react-native";import{usePresenceMotion}from"../../hooks/usePresenceMotion.js";import{createAnimatedValue,useTheme}from"../../theme/index.js";import{transparentOf,withAlpha}from"../../utils/color.js";import{smoothCorners}from"../../utils/corners.js";import{resolveHaptic,triggerHaptic}from"../../utils/hapticUtils.js";import{squircleHostRadius}from"../../utils/squircle.js";import{ModalSafeArea,useModalInsets}from"../ModalSafeArea/ModalSafeArea.js";import{SquircleFill,useSquircle}from"../SquircleFill/SquircleFill.js";import{ToastHost}from"../Toast/ToastProvider.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";export const MODAL_DISMISS_GRACE_MS=300;const SCALE_START_VALUE=.9,Modal=forwardRef((e,t)=>{const{visible:s,onRequestClose:r,presentation:i="centered",backdropOpacity:o,backdropPressClose:a=!0,animationDuration:n,animateMount:l=!0,accessibilityLabel:u,hardwareBackPress:c=!0,children:d,contentStyle:m,backdropStyle:f,restoreFocusRef:p,onDismissed:g,haptic:b,testID:h}=e,S=useTheme(),y=usePresenceMotion(),[A,v]=useModalInsets(),x=n??y.duration("default"),M=Dimensions.get("window").height,R=useRef(!l&&s),C=R.current,V=useRef(createAnimatedValue(C?1:.9)).current,j=useRef(createAnimatedValue(C?1:0)).current,w=useRef(createAnimatedValue(C?0:M)).current,T=useRef(createAnimatedValue(C?1:0)).current,D=useRef(null),_=useRef(!1),[E,k]=useState(s),I=useMemo(()=>buildStyles(S),[S]),N=useMemo(()=>{const e=S.colors.scrim;return"number"!=typeof o?e:withAlpha(e,o)??e},[S.colors.scrim,o]),q=useMemo(()=>T.interpolate({inputRange:[0,1],outputRange:[transparentOf(N),N]}),[T,N]);useEffect(()=>{s&&(Keyboard.dismiss(),k(!0))},[s]),useEffect(()=>{const e=[];if(s&&E&&R.current)R.current=!1;else if(s&&E){const t=Animated.timing(T,{toValue:1,duration:y.duration("default"),useNativeDriver:!1});if(t.start(),e.push(t),y.reduced){j.setValue(0),w.setValue(0),V.setValue(1);const t=Animated.timing(j,{toValue:1,duration:x,useNativeDriver:!0});t.start(),e.push(t)}else if("bottom"===i){j.setValue(1);const t=Animated.spring(w,{toValue:0,damping:S.motion.spring.gentle.damping,stiffness:S.motion.spring.gentle.stiffness,mass:S.motion.spring.gentle.mass,useNativeDriver:!0});t.start(),e.push(t)}else{const t=Animated.parallel([Animated.spring(V,{toValue:1,damping:S.motion.spring.gentle.damping,stiffness:S.motion.spring.gentle.stiffness,mass:S.motion.spring.gentle.mass,useNativeDriver:!0}),Animated.timing(j,{toValue:1,duration:x,useNativeDriver:!0})]);t.start(),e.push(t)}}else if(E){const t=y.duration("fast"),s=Easing.bezier(...S.motion.ease.accelerate),r=Animated.timing(j,{toValue:0,duration:t,easing:s,useNativeDriver:!0}),o=y.reduced?r:"bottom"===i?Animated.timing(w,{toValue:M,duration:t,easing:s,useNativeDriver:!0}):Animated.parallel([Animated.timing(V,{toValue:.9,duration:t,easing:s,useNativeDriver:!0}),r]),a=Animated.parallel([o,Animated.timing(T,{toValue:0,duration:y.duration("default"),useNativeDriver:!1})]);a.start(({finished:e})=>{e&&(w.setValue(M),k(!1))}),e.push(a)}return()=>e.forEach(e=>{e.stop()})},[s,E,i,x,V,j,T,w,M,S.motion.spring.gentle.damping,S.motion.spring.gentle.stiffness,S.motion.spring.gentle.mass,y,S.motion.ease.accelerate]),useEffect(()=>{if("web"===Platform.OS)return;let e,t;return s?(e=setTimeout(()=>{D.current&&AccessibilityInfo.sendAccessibilityEvent(D.current,"focus")},150),_.current=!0):_.current&&(_.current=!1,p?.current&&(t=setTimeout(()=>{const e=p.current;e&&AccessibilityInfo.sendAccessibilityEvent(e,"focus")},x))),()=>{e&&clearTimeout(e),t&&clearTimeout(t)}},[s,x,p]);const P=useRef(!1);useEffect(()=>{if(s)return void(P.current=!0);if(!P.current)return;if(P.current=!1,!g)return;const e=setTimeout(g,300);return()=>clearTimeout(e)},[s,g]);const z=useCallback(()=>{if(!a)return;const e=resolveHaptic(b,"selection");e&&triggerHaptic(e),r()},[a,r,b]),H=useCallback(()=>{c&&r()},[c,r]),L=useSquircle("bottom"!==i&&"fullScreen"!==i,S.radius.xl),F=useMemo(()=>"fullScreen"===i?[I.fullScreenContent,{backgroundColor:S.colors.surface}]:"bottom"===i?[I.bottomContent,{backgroundColor:S.colors.surface,borderTopLeftRadius:S.radius.xl,borderTopRightRadius:S.radius.xl,...smoothCorners,paddingTop:S.space.lg,paddingHorizontal:S.space.lg,paddingBottom:S.space.lg+A.bottom},S.shadow.modal]:[I.centeredContent,{backgroundColor:S.colors.surface,borderRadius:L.active&&L.size?squircleHostRadius(L.size.width,L.size.height,S.radius.xl):S.radius.xl,...smoothCorners,padding:S.space.xl},S.shadow.modal],[i,S,I,A.bottom,L.active,L.size]),W=useMemo(()=>"bottom"===i?I.bottomWrapper:"fullScreen"===i?I.fullScreenWrapper:I.centeredWrapper,[i,I]),O=useMemo(()=>"bottom"===i?{opacity:j,transform:[{translateY:w}]}:"fullScreen"===i?{opacity:j}:{opacity:j,transform:[{scale:V}]},[i,V,j,w]);return _jsx(RNModal,{visible:E,transparent:!0,statusBarTranslucent:!0,navigationBarTranslucent:!0,animationType:"none",onRequestClose:H,testID:h,children:_jsx(View,{ref:e=>{D.current=e,"function"==typeof t?t(e):t&&(t.current=e)},style:I.root,accessible:!1,accessibilityViewIsModal:!0,accessibilityRole:"alert",accessibilityLabel:u,children:_jsxs(ModalSafeArea,{onInsets:v,children:[_jsxs(Animated.View,{collapsable:!1,style:[StyleSheet.absoluteFill,W,{backgroundColor:q},f],children:[_jsx(Pressable,{style:StyleSheet.absoluteFill,onPress:z,accessibilityRole:"button",accessibilityLabel:"Close modal",disabled:!a}),_jsxs(Animated.View,{style:[F,O,m],onLayout:L.onLayout,pointerEvents:"auto",needsOffscreenAlphaCompositing:!0,children:[L.active&&L.size?_jsx(SquircleFill,{width:L.size.width,height:L.size.height,radius:S.radius.xl,fill:S.colors.surface}):null,d]})]}),_jsx(ToastHost,{})]})})})});Modal.displayName="Modal";const buildStyles=e=>StyleSheet.create({root:{flex:1},centeredWrapper:{flex:1,alignItems:"center",justifyContent:"center",paddingHorizontal:e.space.lg},centeredContent:{maxWidth:"90%",width:"90%"},bottomWrapper:{flex:1,justifyContent:"flex-end"},bottomContent:{width:"100%"},fullScreenWrapper:{flex:1},fullScreenContent:{flex:1}});export{Modal};export default Modal;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";import{useCallback,useEffect,useMemo,useRef,useState}from"react";import{Animated,Dimensions,Easing,FlatList,Modal,Platform,Pressable,StatusBar,StyleSheet,Text,TextInput,View}from"react-native";import{Gesture,GestureDetector,GestureHandlerRootView}from"react-native-gesture-handler";import{useKeyboardState}from"react-native-keyboard-controller";import{useDragToDismiss}from"../../hooks/useDragToDismiss.js";import{usePresenceMotion}from"../../hooks/usePresenceMotion.js";import{createAnimatedValue,setNativeValue,useTheme}from"../../theme/index.js";import{transparentOf}from"../../utils/color.js";import{smoothCorners}from"../../utils/corners.js";import{hitSlopMarker}from"../../utils/hitSlop.js";import{defaultIcons}from"../AppIcon/defaultIcons.js";import{ModalSafeArea,useModalInsets}from"../ModalSafeArea/ModalSafeArea.js";import{ToastHost}from"../Toast/ToastProvider.js";import{jsx as _jsx,jsxs as _jsxs,Fragment as _Fragment}from"react/jsx-runtime";const AnimatedGestureRoot=Animated.createAnimatedComponent(GestureHandlerRootView),SEARCH_ICON_SIZE=18;export const OptionSheet=e=>{const{open:t,onClose:s,onAfterClose:o,onOpenChange:i,title:r,options:n,sections:a,renderSectionHeader:l,renderOption:c,alphabetIndex:d=!1,searchPlaceholder:u="Search…",emptyText:p="No options",labelOf:m,getValue:h,disabledOf:g,destructiveOf:b,descriptionOf:f,iconOf:x,isSelected:y,onSelect:S,multi:j=!1,searchable:T=!1,searchSelectionColor:w,accessibilityLabel:C,optionStyle:R,selectedOptionStyle:_,optionTextStyle:V,selectedOptionTextStyle:k,testID:I}=e,M=useTheme(),v=usePresenceMotion(),[z,D]=useModalInsets(),A=useMemo(()=>buildStyles(M),[M]),[L,P]=useState(""),H=Dimensions.get("window").height,O=Math.round(.7*H),[E,W]=useState(t),B=useRef(createAnimatedValue(0)).current,F=useRef(createAnimatedValue(O)).current,N=useRef(createAnimatedValue(0)).current,G=useMemo(()=>v.reduced?N:Animated.add(F,N),[v.reduced,F,N]),$=useMemo(()=>v.reduced?F.interpolate({inputRange:[0,O],outputRange:[1,0],extrapolate:"clamp"}):1,[v.reduced,F,O]),{handleGesture:J,opacity:K}=useDragToDismiss({drag:N,travel:O,onDismiss:s}),U=useMemo(()=>Animated.multiply($,K),[$,K]),Y=useMemo(()=>{const e=M.colors.scrim;return B.interpolate({inputRange:[0,1],outputRange:[transparentOf(e),e]})},[B,M.colors.scrim]);useEffect(()=>{t&&W(!0)},[t]);const Z=useRef(i);Z.current=i;const q=useRef(!1);useEffect(()=>{q.current!==t&&(q.current=t,Z.current?.(t))},[t]);const Q=useRef(o);Q.current=o;const X=useRef(E);useEffect(()=>{X.current&&!E&&"ios"!==Platform.OS&&Q.current?.(),X.current=E},[E]),useEffect(()=>{if(!E)return;t&&(setNativeValue(N,0),setNativeValue(K,1));const e=t?Animated.parallel([Animated.timing(B,{toValue:1,duration:v.duration("default"),easing:Easing.bezier(...M.motion.ease["in-out"]),useNativeDriver:!1}),v.reduced?Animated.timing(F,{toValue:0,duration:v.duration("default"),easing:Easing.bezier(...M.motion.ease["in-out"]),useNativeDriver:!0}):Animated.spring(F,{toValue:0,damping:M.motion.spring.snappy.damping,stiffness:M.motion.spring.snappy.stiffness,mass:M.motion.spring.snappy.mass,useNativeDriver:!0})]):Animated.parallel([Animated.timing(B,{toValue:0,duration:v.duration("default"),easing:Easing.bezier(...M.motion.ease["in-out"]),useNativeDriver:!1}),Animated.timing(F,{toValue:O,duration:v.duration("fast"),easing:Easing.bezier(...M.motion.ease.accelerate),useNativeDriver:!0})]);return e.start(({finished:e})=>{e&&!t&&W(!1)}),()=>e.stop()},[t,E,B,F,N,K,O,v,M.motion.ease["in-out"],M.motion.ease.accelerate,M.motion.spring.snappy]);const ee=useMemo(()=>Gesture.Native(),[]),[te,se]=useState(0),oe=useKeyboardState(e=>e.height),ie=E?Math.max(0,Math.round(oe)):0,re=Math.max(z.top,StatusBar.currentHeight??0)+M.space.sm,ne=ie>0,ae=ne?Math.max(0,Math.min(O,(te>0?te:H)-ie-re)):O;useEffect(()=>{t||P("")},[t]);const le=useMemo(()=>{const e=T?L.trim().toLowerCase():"",matches=t=>0===e.length||m(t).toLowerCase().includes(e)||(f(t)??"").toLowerCase().includes(e);if(!a)return n.filter(matches).map(e=>({kind:"option",option:e}));const t=[];return a.forEach((e,s)=>{const o=e.options.filter(matches);if(0!==o.length){t.push({kind:"header",title:e.title});for(const e of o)t.push({kind:"option",option:e,section:s})}}),t},[T,L,n,a,m,f]),ce=useCallback(()=>{s()},[s]),de=useRef(null),ue=useMemo(()=>{const e=new Map;if(!d)return e;let t=0;if(a)for(let e=le.length-1;e>=0;e-=1)if("header"===le[e].kind){t=e+1;break}for(let s=t;s<le.length;s+=1){const t=le[s];if("option"!==t.kind)continue;const o=m(t.option).trim().charAt(0).toUpperCase(),i=/^[A-Z]$/.test(o)?o:"#";e.has(i)||e.set(i,s)}return e},[d,le,a,m]),pe=d&&ue.size>0&&0===L.trim().length,me=useMemo(()=>[..."ABCDEFGHIJKLMNOPQRSTUVWXYZ",...ue.has("#")?["#"]:[]],[ue]),he=useCallback(e=>{const t=ue.get(e);void 0!==t&&de.current?.scrollToIndex({index:t,animated:!0,viewPosition:0})},[ue]),ge=useRef(null),be=useCallback(()=>{null!==ge.current&&(clearTimeout(ge.current),ge.current=null)},[]),fe=useCallback(e=>{de.current?.scrollToOffset({offset:e.averageItemLength*e.index,animated:!1}),be(),ge.current=setTimeout(()=>{ge.current=null,de.current?.scrollToIndex({index:e.index,animated:!0,viewPosition:0})},50)},[be]);useEffect(()=>(E||be(),be),[E,be]);return _jsx(Modal,{visible:E,transparent:!0,animationType:"none",onRequestClose:ce,onDismiss:()=>Q.current?.(),statusBarTranslucent:!0,navigationBarTranslucent:!0,children:_jsx(ModalSafeArea,{onInsets:D,children:_jsxs(AnimatedGestureRoot,{collapsable:!1,onLayout:e=>se(e.nativeEvent.layout.height),style:[StyleSheet.absoluteFill,{backgroundColor:Y}],children:[_jsx(Pressable,{style:StyleSheet.absoluteFill,onPress:ce,accessibilityRole:"button",accessibilityLabel:"Close picker"}),_jsxs(Animated.View,{testID:I,accessibilityViewIsModal:!0,accessibilityLabel:C??r??"Options",style:[A.sheet,{maxHeight:ae,bottom:ie,paddingBottom:ne?M.space.lg:z.bottom+M.space.lg,backgroundColor:M.colors.surface,borderTopLeftRadius:M.radius.xl,borderTopRightRadius:M.radius.xl,...smoothCorners,opacity:U,transform:[{translateY:G}],...M.shadow.modal}],children:[_jsx(GestureDetector,{gesture:J,children:_jsxs(View,{children:[_jsx(View,{style:A.sheetHandleRow,children:_jsx(View,{style:[A.sheetHandle,{backgroundColor:M.colors.border}]})}),r?_jsx(Text,{style:[A.sheetTitle,{color:M.colors["text-body"],fontSize:M.text.lg.size,fontWeight:M.weight.semibold,paddingHorizontal:M.space.lg,marginBottom:M.space.sm}],children:r}):null]})}),T?_jsx(View,{style:[A.searchWrap,{marginHorizontal:M.space.lg,marginBottom:M.space.sm}],children:_jsxs(View,{style:[A.searchBox,{backgroundColor:M.colors["bg-subtle"],borderColor:M.colors.border,borderRadius:M.radius.md,...smoothCorners,paddingHorizontal:M.space.md,gap:M.space.sm}],children:[(M.settings.icons.search??defaultIcons.search)({size:18,color:M.colors["text-subtle"]}),_jsx(TextInput,{value:L,onChangeText:P,placeholder:u,placeholderTextColor:M.colors["text-subtle"],selectionColor:w??M.colors["focus-ring"],accessibilityLabel:"Search options",style:[A.searchInput,{color:M.colors["text-body"],fontSize:M.text.base.size,paddingVertical:M.space.sm}]}),L.length>0?_jsx(Pressable,{onPress:()=>P(""),hitSlop:8,...hitSlopMarker(8),accessibilityRole:"button",accessibilityLabel:"Clear search",children:(M.settings.icons.close??defaultIcons.close)({size:18,color:M.colors["text-muted"]})}):null]})}):null,_jsxs(View,{style:[A.listWrap,pe?A.listRow:null],children:[_jsx(GestureDetector,{gesture:ee,children:_jsx(FlatList,{ref:de,data:le,keyExtractor:e=>"header"===e.kind?`h:${e.title}`:`o:${e.section??""}:${String(h(e.option))}`,renderItem:({item:e})=>{if("header"===e.kind)return _jsx(View,{accessible:!0,accessibilityRole:"header",style:[A.sectionHeader,{paddingHorizontal:M.space.lg,paddingTop:M.space.md}],children:l?l(e.title):_jsx(Text,{style:[A.sectionTitle,{color:M.colors["text-subtle"],fontSize:M.text.xs.size,fontWeight:M.weight.semibold}],children:e.title.toUpperCase()})});const t=e.option,s=m(t),o=h(t),i=f(t),r=x(t),n=y(o),a=g(t),d=b?.(t)??!1;return _jsxs(Pressable,{onPress:()=>S(t),disabled:a,android_ripple:{color:M.colors["surface-pressed"],borderless:!1},accessibilityRole:"button",accessibilityLabel:s,accessibilityState:{selected:n,disabled:a},"aria-selected":n,"aria-disabled":a,style:({pressed:e})=>[A.optionRow,{backgroundColor:n?M.colors["surface-selected"]:e?M.colors["surface-pressed"]:"transparent",opacity:a?.5:1,paddingHorizontal:M.space.lg,paddingVertical:M.space.md},R,n?_:null],children:[c?_jsx(View,{style:A.optionTextWrap,children:c(t,{selected:n,disabled:a})}):_jsxs(_Fragment,{children:[r?_jsx(View,{style:A.optionIcon,children:r}):null,_jsxs(View,{style:A.optionTextWrap,children:[_jsx(Text,{style:[A.optionLabel,{color:d?M.colors["danger-text"]:n?M.colors.primary:M.colors["text-body"],fontSize:M.text.base.size,fontWeight:n?M.weight.semibold:M.weight.medium},V,n?k:null],children:s}),i?_jsx(Text,{style:[A.optionDescription,{color:M.colors["text-subtle"],fontSize:M.text.sm.size}],numberOfLines:2,children:i}):null]})]}),j?_jsx(View,{style:[A.checkbox,{borderColor:n?M.colors.primary:M.colors.border,backgroundColor:n?M.colors.primary:"transparent"}],children:n?_jsx(View,{style:A.checkboxTick}):null}):n?"icon"===M.settings.components["option-sheet"]?.selectedMarker?_jsx(View,{style:A.singleSelectedIcon,children:(M.settings.icons.selectedTick??defaultIcons.selectedTick)({size:20,color:M.colors.primary})}):_jsx(View,{style:[A.singleSelectedDot,{backgroundColor:M.colors.primary}]}):null]})},onScrollToIndexFailed:fe,overScrollMode:"never",bounces:!1,keyboardShouldPersistTaps:"handled",showsVerticalScrollIndicator:!pe,style:pe?A.listBesideRail:null,ListEmptyComponent:_jsx(Text,{style:[A.empty,{color:M.colors["text-subtle"],fontSize:M.text.sm.size,paddingVertical:M.space.xl}],children:p})})}),pe?_jsx(View,{style:[A.rail,{paddingRight:M.space.xs}],accessibilityRole:"list",accessibilityLabel:"Jump to letter",testID:"option-sheet-alphabet",children:me.map(e=>{const t=ue.has(e);return _jsx(Pressable,{onPress:()=>he(e),disabled:!t,hitSlop:{left:8,right:8},...hitSlopMarker({left:8,right:8}),accessibilityRole:"button",accessibilityLabel:`Jump to ${e}`,accessibilityState:{disabled:!t},"aria-disabled":!t,style:A.railLetter,children:_jsx(Text,{style:[A.railLetterText,{color:t?M.colors.primary:M.colors["text-subtle"],fontSize:M.text.xs.size,fontWeight:M.weight.semibold,opacity:t?1:.45}],children:e})},e)})}):null]}),j?_jsx(View,{style:[A.sheetFooter,{borderTopColor:M.colors["border-subtle"],paddingHorizontal:M.space.lg,paddingVertical:M.space.md}],children:_jsx(Pressable,{onPress:ce,accessibilityRole:"button",accessibilityLabel:"Done",style:({pressed:e})=>[A.doneButton,{backgroundColor:e?M.colors["primary-pressed"]:M.colors.primary,borderRadius:M.radius.md,...smoothCorners,paddingVertical:M.space.sm,paddingHorizontal:M.space.lg}],children:_jsx(Text,{style:{color:M.colors["on-primary"],fontSize:M.text.base.size,fontWeight:M.weight.semibold},children:"Done"})})}):null]}),_jsx(ToastHost,{})]})})})};OptionSheet.displayName="OptionSheet";const buildStyles=e=>StyleSheet.create({sheet:{position:"absolute",left:0,right:0,bottom:0,paddingBottom:e.space.lg,overflow:"hidden"},sheetHandleRow:{alignItems:"center",paddingTop:e.space.sm,paddingBottom:e.space.sm},sheetHandle:{width:36,height:4,borderRadius:e.radius.pill,...smoothCorners},sheetTitle:{includeFontPadding:!1},searchWrap:{width:"auto"},searchBox:{flexDirection:"row",alignItems:"center",borderWidth:1},searchInput:{flex:1,includeFontPadding:!1},optionRow:{flexDirection:"row",alignItems:"center"},sectionHeader:{paddingBottom:e.space.xs},listWrap:{flexShrink:1},listRow:{flexDirection:"row"},listBesideRail:{flex:1},rail:{justifyContent:"space-between",alignItems:"center",alignSelf:"stretch",paddingVertical:e.space.xs},railLetter:{paddingHorizontal:e.space.xs,minHeight:14,justifyContent:"center"},railLetterText:{includeFontPadding:!1,lineHeight:14},sectionTitle:{includeFontPadding:!1,letterSpacing:.6},optionIcon:{marginRight:e.space.md},optionTextWrap:{flex:1},optionLabel:{includeFontPadding:!1},optionDescription:{includeFontPadding:!1,marginTop:e.space.xxs},checkbox:{width:22,height:22,borderRadius:e.radius.sm,...smoothCorners,borderWidth:2,alignItems:"center",justifyContent:"center",marginLeft:e.space.md},checkboxTick:{width:10,height:6,borderLeftWidth:2,borderBottomWidth:2,borderColor:e.colors["on-primary"],transform:[{rotate:"-45deg"},{translateY:-1}]},singleSelectedDot:{width:8,height:8,borderRadius:e.radius.pill,...smoothCorners,marginLeft:e.space.md},singleSelectedIcon:{marginLeft:e.space.md},empty:{textAlign:"center"},sheetFooter:{borderTopWidth:StyleSheet.hairlineWidth,alignItems:"flex-end"},doneButton:{alignSelf:"flex-end"}});export default OptionSheet;
|
|
1
|
+
"use strict";import{useCallback,useEffect,useMemo,useRef,useState}from"react";import{Animated,Dimensions,Easing,FlatList,Keyboard,Modal,Platform,Pressable,StatusBar,StyleSheet,Text,TextInput,View}from"react-native";import{Gesture,GestureDetector,GestureHandlerRootView}from"react-native-gesture-handler";import{useKeyboardState}from"react-native-keyboard-controller";import{useDragToDismiss}from"../../hooks/useDragToDismiss.js";import{usePresenceMotion}from"../../hooks/usePresenceMotion.js";import{createAnimatedValue,setNativeValue,useTheme}from"../../theme/index.js";import{transparentOf}from"../../utils/color.js";import{smoothCorners}from"../../utils/corners.js";import{hitSlopMarker}from"../../utils/hitSlop.js";import{defaultIcons}from"../AppIcon/defaultIcons.js";import{ModalSafeArea,useModalInsets}from"../ModalSafeArea/ModalSafeArea.js";import{ToastHost}from"../Toast/ToastProvider.js";import{jsx as _jsx,jsxs as _jsxs,Fragment as _Fragment}from"react/jsx-runtime";const AnimatedGestureRoot=Animated.createAnimatedComponent(GestureHandlerRootView),SEARCH_ICON_SIZE=18;export const OptionSheet=e=>{const{open:t,onClose:s,onAfterClose:o,onOpenChange:i,title:r,options:n,sections:a,renderSectionHeader:l,renderOption:c,alphabetIndex:d=!1,searchPlaceholder:u="Search…",emptyText:p="No options",labelOf:m,getValue:h,disabledOf:g,destructiveOf:b,descriptionOf:f,iconOf:x,isSelected:y,onSelect:S,multi:j=!1,searchable:T=!1,searchSelectionColor:w,accessibilityLabel:C,optionStyle:R,selectedOptionStyle:_,optionTextStyle:V,selectedOptionTextStyle:k,testID:I}=e,M=useTheme(),v=usePresenceMotion(),[z,D]=useModalInsets(),A=useMemo(()=>buildStyles(M),[M]),[L,P]=useState(""),H=Dimensions.get("window").height,O=Math.round(.7*H),[E,W]=useState(t),B=useRef(createAnimatedValue(0)).current,F=useRef(createAnimatedValue(O)).current,N=useRef(createAnimatedValue(0)).current,G=useMemo(()=>v.reduced?N:Animated.add(F,N),[v.reduced,F,N]),K=useMemo(()=>v.reduced?F.interpolate({inputRange:[0,O],outputRange:[1,0],extrapolate:"clamp"}):1,[v.reduced,F,O]),{handleGesture:$,opacity:J}=useDragToDismiss({drag:N,travel:O,onDismiss:s}),U=useMemo(()=>Animated.multiply(K,J),[K,J]),Y=useMemo(()=>{const e=M.colors.scrim;return B.interpolate({inputRange:[0,1],outputRange:[transparentOf(e),e]})},[B,M.colors.scrim]);useEffect(()=>{t&&(Keyboard.dismiss(),W(!0))},[t]);const Z=useRef(i);Z.current=i;const q=useRef(!1);useEffect(()=>{q.current!==t&&(q.current=t,Z.current?.(t))},[t]);const Q=useRef(o);Q.current=o;const X=useRef(E);useEffect(()=>{X.current&&!E&&"ios"!==Platform.OS&&Q.current?.(),X.current=E},[E]),useEffect(()=>{if(!E)return;t&&(setNativeValue(N,0),setNativeValue(J,1));const e=t?Animated.parallel([Animated.timing(B,{toValue:1,duration:v.duration("default"),easing:Easing.bezier(...M.motion.ease["in-out"]),useNativeDriver:!1}),v.reduced?Animated.timing(F,{toValue:0,duration:v.duration("default"),easing:Easing.bezier(...M.motion.ease["in-out"]),useNativeDriver:!0}):Animated.spring(F,{toValue:0,damping:M.motion.spring.snappy.damping,stiffness:M.motion.spring.snappy.stiffness,mass:M.motion.spring.snappy.mass,useNativeDriver:!0})]):Animated.parallel([Animated.timing(B,{toValue:0,duration:v.duration("default"),easing:Easing.bezier(...M.motion.ease["in-out"]),useNativeDriver:!1}),Animated.timing(F,{toValue:O,duration:v.duration("fast"),easing:Easing.bezier(...M.motion.ease.accelerate),useNativeDriver:!0})]);return e.start(({finished:e})=>{e&&!t&&W(!1)}),()=>e.stop()},[t,E,B,F,N,J,O,v,M.motion.ease["in-out"],M.motion.ease.accelerate,M.motion.spring.snappy]);const ee=useMemo(()=>Gesture.Native(),[]),[te,se]=useState(0),oe=useKeyboardState(e=>e.height),ie=E?Math.max(0,Math.round(oe)):0,re=Math.max(z.top,StatusBar.currentHeight??0)+M.space.sm,ne=ie>0,ae=ne?Math.max(0,Math.min(O,(te>0?te:H)-ie-re)):O;useEffect(()=>{t||P("")},[t]);const le=useMemo(()=>{const e=T?L.trim().toLowerCase():"",matches=t=>0===e.length||m(t).toLowerCase().includes(e)||(f(t)??"").toLowerCase().includes(e);if(!a)return n.filter(matches).map(e=>({kind:"option",option:e}));const t=[];return a.forEach((e,s)=>{const o=e.options.filter(matches);if(0!==o.length){t.push({kind:"header",title:e.title});for(const e of o)t.push({kind:"option",option:e,section:s})}}),t},[T,L,n,a,m,f]),ce=useCallback(()=>{s()},[s]),de=useRef(null),ue=useMemo(()=>{const e=new Map;if(!d)return e;let t=0;if(a)for(let e=le.length-1;e>=0;e-=1)if("header"===le[e].kind){t=e+1;break}for(let s=t;s<le.length;s+=1){const t=le[s];if("option"!==t.kind)continue;const o=m(t.option).trim().charAt(0).toUpperCase(),i=/^[A-Z]$/.test(o)?o:"#";e.has(i)||e.set(i,s)}return e},[d,le,a,m]),pe=d&&ue.size>0&&0===L.trim().length,me=useMemo(()=>[..."ABCDEFGHIJKLMNOPQRSTUVWXYZ",...ue.has("#")?["#"]:[]],[ue]),he=useCallback(e=>{const t=ue.get(e);void 0!==t&&de.current?.scrollToIndex({index:t,animated:!0,viewPosition:0})},[ue]),ge=useRef(null),be=useCallback(()=>{null!==ge.current&&(clearTimeout(ge.current),ge.current=null)},[]),fe=useCallback(e=>{de.current?.scrollToOffset({offset:e.averageItemLength*e.index,animated:!1}),be(),ge.current=setTimeout(()=>{ge.current=null,de.current?.scrollToIndex({index:e.index,animated:!0,viewPosition:0})},50)},[be]);useEffect(()=>(E||be(),be),[E,be]);return _jsx(Modal,{visible:E,transparent:!0,animationType:"none",onRequestClose:ce,onDismiss:()=>Q.current?.(),statusBarTranslucent:!0,navigationBarTranslucent:!0,children:_jsx(ModalSafeArea,{onInsets:D,children:_jsxs(AnimatedGestureRoot,{collapsable:!1,onLayout:e=>se(e.nativeEvent.layout.height),style:[StyleSheet.absoluteFill,{backgroundColor:Y}],children:[_jsx(Pressable,{style:StyleSheet.absoluteFill,onPress:ce,accessibilityRole:"button",accessibilityLabel:"Close picker"}),_jsxs(Animated.View,{testID:I,accessibilityViewIsModal:!0,accessibilityLabel:C??r??"Options",style:[A.sheet,{maxHeight:ae,bottom:ie,paddingBottom:ne?M.space.lg:z.bottom+M.space.lg,backgroundColor:M.colors.surface,borderTopLeftRadius:M.radius.xl,borderTopRightRadius:M.radius.xl,...smoothCorners,opacity:U,transform:[{translateY:G}],...M.shadow.modal}],children:[_jsx(GestureDetector,{gesture:$,children:_jsxs(View,{children:[_jsx(View,{style:A.sheetHandleRow,children:_jsx(View,{style:[A.sheetHandle,{backgroundColor:M.colors.border}]})}),r?_jsx(Text,{style:[A.sheetTitle,{color:M.colors["text-body"],fontSize:M.text.lg.size,fontWeight:M.weight.semibold,paddingHorizontal:M.space.lg,marginBottom:M.space.sm}],children:r}):null]})}),T?_jsx(View,{style:[A.searchWrap,{marginHorizontal:M.space.lg,marginBottom:M.space.sm}],children:_jsxs(View,{style:[A.searchBox,{backgroundColor:M.colors["bg-subtle"],borderColor:M.colors.border,borderRadius:M.radius.md,...smoothCorners,paddingHorizontal:M.space.md,gap:M.space.sm}],children:[(M.settings.icons.search??defaultIcons.search)({size:18,color:M.colors["text-subtle"]}),_jsx(TextInput,{value:L,onChangeText:P,placeholder:u,placeholderTextColor:M.colors["text-subtle"],selectionColor:w??M.colors["focus-ring"],accessibilityLabel:"Search options",style:[A.searchInput,{color:M.colors["text-body"],fontSize:M.text.base.size,paddingVertical:M.space.sm}]}),L.length>0?_jsx(Pressable,{onPress:()=>P(""),hitSlop:8,...hitSlopMarker(8),accessibilityRole:"button",accessibilityLabel:"Clear search",children:(M.settings.icons.close??defaultIcons.close)({size:18,color:M.colors["text-muted"]})}):null]})}):null,_jsxs(View,{style:[A.listWrap,pe?A.listRow:null],children:[_jsx(GestureDetector,{gesture:ee,children:_jsx(FlatList,{ref:de,data:le,keyExtractor:e=>"header"===e.kind?`h:${e.title}`:`o:${e.section??""}:${String(h(e.option))}`,renderItem:({item:e})=>{if("header"===e.kind)return _jsx(View,{accessible:!0,accessibilityRole:"header",style:[A.sectionHeader,{paddingHorizontal:M.space.lg,paddingTop:M.space.md}],children:l?l(e.title):_jsx(Text,{style:[A.sectionTitle,{color:M.colors["text-subtle"],fontSize:M.text.xs.size,fontWeight:M.weight.semibold}],children:e.title.toUpperCase()})});const t=e.option,s=m(t),o=h(t),i=f(t),r=x(t),n=y(o),a=g(t),d=b?.(t)??!1;return _jsxs(Pressable,{onPress:()=>S(t),disabled:a,android_ripple:{color:M.colors["surface-pressed"],borderless:!1},accessibilityRole:"button",accessibilityLabel:s,accessibilityState:{selected:n,disabled:a},"aria-selected":n,"aria-disabled":a,style:({pressed:e})=>[A.optionRow,{backgroundColor:n?M.colors["surface-selected"]:e?M.colors["surface-pressed"]:"transparent",opacity:a?.5:1,paddingHorizontal:M.space.lg,paddingVertical:M.space.md},R,n?_:null],children:[c?_jsx(View,{style:A.optionTextWrap,children:c(t,{selected:n,disabled:a})}):_jsxs(_Fragment,{children:[r?_jsx(View,{style:A.optionIcon,children:r}):null,_jsxs(View,{style:A.optionTextWrap,children:[_jsx(Text,{style:[A.optionLabel,{color:d?M.colors["danger-text"]:n?M.colors.primary:M.colors["text-body"],fontSize:M.text.base.size,fontWeight:n?M.weight.semibold:M.weight.medium},V,n?k:null],children:s}),i?_jsx(Text,{style:[A.optionDescription,{color:M.colors["text-subtle"],fontSize:M.text.sm.size}],numberOfLines:2,children:i}):null]})]}),j?_jsx(View,{style:[A.checkbox,{borderColor:n?M.colors.primary:M.colors.border,backgroundColor:n?M.colors.primary:"transparent"}],children:n?_jsx(View,{style:A.checkboxTick}):null}):n?"icon"===M.settings.components["option-sheet"]?.selectedMarker?_jsx(View,{style:A.singleSelectedIcon,children:(M.settings.icons.selectedTick??defaultIcons.selectedTick)({size:20,color:M.colors.primary})}):_jsx(View,{style:[A.singleSelectedDot,{backgroundColor:M.colors.primary}]}):null]})},onScrollToIndexFailed:fe,overScrollMode:"never",bounces:!1,keyboardShouldPersistTaps:"handled",showsVerticalScrollIndicator:!pe,style:pe?A.listBesideRail:null,ListEmptyComponent:_jsx(Text,{style:[A.empty,{color:M.colors["text-subtle"],fontSize:M.text.sm.size,paddingVertical:M.space.xl}],children:p})})}),pe?_jsx(View,{style:[A.rail,{paddingRight:M.space.xs}],accessibilityRole:"list",accessibilityLabel:"Jump to letter",testID:"option-sheet-alphabet",children:me.map(e=>{const t=ue.has(e);return _jsx(Pressable,{onPress:()=>he(e),disabled:!t,hitSlop:{left:8,right:8},...hitSlopMarker({left:8,right:8}),accessibilityRole:"button",accessibilityLabel:`Jump to ${e}`,accessibilityState:{disabled:!t},"aria-disabled":!t,style:A.railLetter,children:_jsx(Text,{style:[A.railLetterText,{color:t?M.colors.primary:M.colors["text-subtle"],fontSize:M.text.xs.size,fontWeight:M.weight.semibold,opacity:t?1:.45}],children:e})},e)})}):null]}),j?_jsx(View,{style:[A.sheetFooter,{borderTopColor:M.colors["border-subtle"],paddingHorizontal:M.space.lg,paddingVertical:M.space.md}],children:_jsx(Pressable,{onPress:ce,accessibilityRole:"button",accessibilityLabel:"Done",style:({pressed:e})=>[A.doneButton,{backgroundColor:e?M.colors["primary-pressed"]:M.colors.primary,borderRadius:M.radius.md,...smoothCorners,paddingVertical:M.space.sm,paddingHorizontal:M.space.lg}],children:_jsx(Text,{style:{color:M.colors["on-primary"],fontSize:M.text.base.size,fontWeight:M.weight.semibold},children:"Done"})})}):null]}),_jsx(ToastHost,{})]})})})};OptionSheet.displayName="OptionSheet";const buildStyles=e=>StyleSheet.create({sheet:{position:"absolute",left:0,right:0,bottom:0,paddingBottom:e.space.lg,overflow:"hidden"},sheetHandleRow:{alignItems:"center",paddingTop:e.space.sm,paddingBottom:e.space.sm},sheetHandle:{width:36,height:4,borderRadius:e.radius.pill,...smoothCorners},sheetTitle:{includeFontPadding:!1},searchWrap:{width:"auto"},searchBox:{flexDirection:"row",alignItems:"center",borderWidth:1},searchInput:{flex:1,includeFontPadding:!1},optionRow:{flexDirection:"row",alignItems:"center"},sectionHeader:{paddingBottom:e.space.xs},listWrap:{flexShrink:1},listRow:{flexDirection:"row"},listBesideRail:{flex:1},rail:{justifyContent:"space-between",alignItems:"center",alignSelf:"stretch",paddingVertical:e.space.xs},railLetter:{paddingHorizontal:e.space.xs,minHeight:14,justifyContent:"center"},railLetterText:{includeFontPadding:!1,lineHeight:14},sectionTitle:{includeFontPadding:!1,letterSpacing:.6},optionIcon:{marginRight:e.space.md},optionTextWrap:{flex:1},optionLabel:{includeFontPadding:!1},optionDescription:{includeFontPadding:!1,marginTop:e.space.xxs},checkbox:{width:22,height:22,borderRadius:e.radius.sm,...smoothCorners,borderWidth:2,alignItems:"center",justifyContent:"center",marginLeft:e.space.md},checkboxTick:{width:10,height:6,borderLeftWidth:2,borderBottomWidth:2,borderColor:e.colors["on-primary"],transform:[{rotate:"-45deg"},{translateY:-1}]},singleSelectedDot:{width:8,height:8,borderRadius:e.radius.pill,...smoothCorners,marginLeft:e.space.md},singleSelectedIcon:{marginLeft:e.space.md},empty:{textAlign:"center"},sheetFooter:{borderTopWidth:StyleSheet.hairlineWidth,alignItems:"flex-end"},doneButton:{alignSelf:"flex-end"}});export default OptionSheet;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@webority/mobile-ui",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.101.0",
|
|
4
4
|
"description": "Beautiful, animated, accessible React Native components, theme and form engine for Webority projects.",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"react-native",
|
|
@@ -86,8 +86,8 @@
|
|
|
86
86
|
"react-native-safe-area-context": ">=5.4.0",
|
|
87
87
|
"react-native-svg": ">=15.0.0",
|
|
88
88
|
"react-native-worklets": ">=0.10.0",
|
|
89
|
-
"@webority/canvas-kit": "0.
|
|
90
|
-
"@webority/mobile-core": "0.
|
|
89
|
+
"@webority/canvas-kit": "0.101.0",
|
|
90
|
+
"@webority/mobile-core": "0.101.0"
|
|
91
91
|
},
|
|
92
92
|
"peerDependenciesMeta": {
|
|
93
93
|
"@webority/canvas-kit": {
|
|
@@ -148,10 +148,10 @@
|
|
|
148
148
|
"react-test-renderer": "19.2.8",
|
|
149
149
|
"rimraf": "6.1.3",
|
|
150
150
|
"typescript": "5.9.3",
|
|
151
|
-
"@webority/canvas-kit": "0.
|
|
152
|
-
"@webority/mobile-core": "0.
|
|
151
|
+
"@webority/canvas-kit": "0.101.0",
|
|
152
|
+
"@webority/mobile-core": "0.101.0",
|
|
153
153
|
"@webority/mobile-dev": "0.0.0",
|
|
154
|
-
"@webority/tokens": "0.
|
|
154
|
+
"@webority/tokens": "0.101.0"
|
|
155
155
|
},
|
|
156
156
|
"scripts": {
|
|
157
157
|
"build": "bob build && node ../mobile-dev/scripts/minify-lib.mjs && node -e \"require('node:fs').rmSync('dist/canvas-kit',{recursive:true,force:true})\" && node ../canvas-kit/dist/cli.js build --config canvas-kit.json --out dist/canvas-kit",
|