@webority/mobile-ui 0.99.0 → 0.100.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,21 +1,21 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "webority-phone",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.100.0",
|
|
4
4
|
"platform": "Phone",
|
|
5
5
|
"kitModuleVersion": 2,
|
|
6
6
|
"rendererProtocolVersion": 8,
|
|
7
7
|
"library": {
|
|
8
8
|
"name": "@webority/mobile-ui",
|
|
9
|
-
"version": "0.
|
|
9
|
+
"version": "0.100.0"
|
|
10
10
|
},
|
|
11
11
|
"files": {
|
|
12
12
|
"manifest.json": {
|
|
13
|
-
"sha256": "
|
|
14
|
-
"bytes":
|
|
13
|
+
"sha256": "5421eeb376029819c284cb7219f6e5e66c542a59302ad31bf53c5d06c3076bd4",
|
|
14
|
+
"bytes": 613046
|
|
15
15
|
},
|
|
16
16
|
"kit.js": {
|
|
17
|
-
"sha256": "
|
|
18
|
-
"bytes":
|
|
17
|
+
"sha256": "18d1c4cea3927d8e14d11fa713ed01bde669021845fc4da42a3235ec7c5dd95a",
|
|
18
|
+
"bytes": 5916562
|
|
19
19
|
},
|
|
20
20
|
"kit.css": {
|
|
21
21
|
"sha256": "e3b0c44298fc1c149afbf4c8996fb92427ae41e4649b934ca495991b7852b855",
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.useBottomSheet=exports.default=exports.BottomSheet=void 0;var cache,_react=require("react"),_reactNative=require("react-native"),_reactNativeGestureHandler=require("react-native-gesture-handler"),_reactNativeKeyboardController=require("react-native-keyboard-controller"),_reactNativeReanimated=_interopRequireWildcard(require("react-native-reanimated")),_reactNativeSafeAreaContext=require("react-native-safe-area-context"),_usePresenceMotion=require("../../hooks/usePresenceMotion.js"),_index=require("../../theme/index.js"),_index2=require("../../utils/index.js"),_corners=require("../../utils/corners.js"),_ModalSafeArea=require("../ModalSafeArea/ModalSafeArea.js"),_ToastProvider=require("../Toast/ToastProvider.js"),_jsxRuntime=require("react/jsx-runtime");function _interopRequireWildcard(e,t){if(!t&&e&&e.__esModule)return e;var a,r,n=Object.defineProperty,o={__proto__:null,default:e};if(Object(e)!==e)return o;if(cache||"function"!=typeof WeakMap||(cache=new WeakMap),cache){if(cache.has(e))return cache.get(e);cache.set(e,o)}for(r in e)"default"!==r&&{}.hasOwnProperty.call(e,r)&&((a=n&&Object.getOwnPropertyDescriptor(e,r))&&(a.get||a.set)?n(o,r,a):o[r]=e[r]);return o}const TABLET_MIN_SHORT_SIDE=600,DIALOG_MAX_WIDTH=560,BottomSheetContext=(0,_react.createContext)(null),useBottomSheet=()=>{const e=(0,_react.useContext)(BottomSheetContext);if(!e)throw new Error("useBottomSheet must be used inside a <BottomSheet>.");return e};exports.useBottomSheet=useBottomSheet;const SPRING_CONFIG={damping:20,stiffness:240,mass:1},CLOSE_VELOCITY_THRESHOLD=1e3,DRAG_ACTIVATION_OFFSET=10,BottomSheet=exports.BottomSheet=(0,_react.forwardRef)((e,t)=>{const{snapPoints:a,index:r,onChange:n,onAnimate:o,onAfterClose:s,enablePanDownToClose:i=!0,enableBackdropPress:c=!0,confirmDismiss:l,scrollable:u=!1,scrollRef:d,onScroll:_,onContentSizeChange:h,onScrollLayout:m,scrollEventThrottle:v,keyboardBehavior:f="shift",mode:b="modal",presentation:p="sheet",animateMount:S=!0,handleIndicatorStyle:R,containerStyle:x,header:y,footer:N,headerStyle:g,footerStyle:w,children:C,accessibilityLabel:j,accessibilityViewIsModal:M,testID:k}=e,O=(0,_index.useTheme)(),I=(0,_usePresenceMotion.usePresenceMotion)(),T=(0,_reactNativeSafeAreaContext.useSafeAreaInsets)(),[P,E]=(0,_react.useState)(()=>_reactNative.Dimensions.get("window").height),[A,H]=(0,_react.useState)(()=>_reactNative.Dimensions.get("window").width),B=(0,_react.useCallback)(e=>{const{height:t,width:a}=e.nativeEvent.layout;t>0&&E(e=>e===t?e:t),a>0&&H(e=>e===a?e:a)},[]),D=(0,_reactNative.useWindowDimensions)(),G="dialog"===p||"auto"===p&&Math.min(D.width,D.height)>=600,V=Math.min(560,A-2*O.space.xl),[q,L]=(0,_ModalSafeArea.useModalInsets)(),F="modal"===b?q.top:T.top,J="modal"===b?q.bottom:T.bottom,W=a.includes("content"),[z,Y]=useMeasuredHeight(),[$,K]=useMeasuredHeight(),[U,X,Q]=useMeasuredHeight(),[Z,ee]=useMeasuredHeight(),te=G?O.space.md:z,ae=W?Math.min(te+(null!=y?$:0)+U+(null!=N?Z:0)+J,P-F):0,re=(0,_react.useCallback)((e,t)=>{W&&Q(t),h?.(e,t)},[W,h,Q]),ne=(0,_react.useMemo)(()=>resolveSnapPoints(a,P,ae),[a,P,ae]),oe=P,se=ne[ne.length-1]??0,ie=(0,_reactNativeReanimated.useSharedValue)(oe),ce=(0,_reactNativeReanimated.useSharedValue)(oe),le=(0,_reactNativeReanimated.useSharedValue)(1),ue=(0,_reactNativeReanimated.useSharedValue)(-1),[de,he]=(0,_react.useState)(-1),me=(0,_react.useRef)(!1),[ve,fe]=(0,_react.useState)(!1),[be,pe]=(0,_react.useState)(!1),Se=(0,_react.useRef)(!1),Re=(0,_react.useRef)(s);Re.current=s;const[xe,ye]=(0,_react.useState)(!1),Ne=(0,_react.useRef)(!S&&"number"==typeof r&&r>=0),ge=(0,_react.useRef)(-1),we=(0,_react.useRef)(!1);we.current="modal"===b?be:xe;const Ce=(0,_react.useRef)(l);Ce.current=l;const je=(0,_react.useRef)(!1),Me=(0,_react.useRef)(!0),ke=(0,_react.useRef)([]),Oe=(0,_react.useCallback)(e=>{const t=ke.current;ke.current=[];for(const a of t)a(e)},[]);(0,_react.useEffect)(()=>(Me.current=!0,()=>{Me.current=!1,Oe(!1)}),[Oe]);const Ie=(0,_react.useCallback)(e=>{if(e<0||e>=ne.length)return oe;const t=ne[e];return G?(P-t)/2:P-t},[ne,P,oe,G]),Te=(0,_react.useCallback)(e=>{ge.current=e;de!==e&&(he(e),ue.value=e,n?.(e))},[de,ue,n]),Pe=(0,_react.useCallback)(()=>{me.current=!1,ue.value<0&&(Se.current=!0,"modal"===b?(fe(!1),"ios"!==_reactNative.Platform.OS&&pe(!1)):ye(!1))},[b,ue]),Ee=(0,_react.useCallback)(()=>{Se.current&&pe(!1)},[]);(0,_react.useEffect)(()=>{("modal"===b?!be:!xe)&&Se.current&&(Se.current=!1,Re.current?.(),Oe(!0))},[b,be,xe,Oe]);const Ae=(0,_react.useCallback)((e,t,a)=>{me.current=!0,o?.(t,a),ie.value=(0,_reactNativeReanimated.withSpring)(e,SPRING_CONFIG,e=>{"worklet";e&&(0,_reactNativeReanimated.runOnJS)(Pe)()})},[o,ie,Pe]),He=(0,_react.useCallback)(e=>{const t="number"==typeof e?clamp(e,0,ne.length-1):de>=0?de:0,a=ue.value,r=Ie(t);return Se.current=!1,Oe(!1),"modal"===b?(pe(!0),fe(!0)):ye(!0),a<0&&Ne.current?(ie.value=r,le.value=1,Te(t),void o?.(a,t)):a<0&&I.reduced?(ie.value=r,le.value=0,le.value=(0,_reactNativeReanimated.withTiming)(1,{duration:I.duration("fast"),easing:_reactNativeReanimated.Easing.bezier(...O.motion.ease.decelerate),reduceMotion:_usePresenceMotion.PRESENCE_REDUCE_MOTION}),Te(t),void o?.(a,t)):(a<0&&(ie.value=oe,le.value=1),Te(t),void Ae(r,a,t))},[Ae,oe,de,ue,b,o,I,le,ne.length,Te,Oe,O.motion.ease.decelerate,ie,Ie]),Be=(0,_react.useCallback)(()=>{if(0===ne.length)return;const e=ue.value,t=Ie(0);Te(0),Ae(t,e,0)},[Ae,ue,ne.length,Te,Ie]),De=(0,_react.useCallback)(()=>new Promise(e=>{if(ge.current<0)return void(we.current?ke.current.push(e):e(!0));ke.current.push(e),Ne.current=!1;const t=ue.value;Te(-1),me.current=!0,o?.(t,-1);const a=I.reduced?le:ie,r=I.reduced?0:oe;a.value=(0,_reactNativeReanimated.withTiming)(r,{duration:I.duration("fast"),easing:_reactNativeReanimated.Easing.bezier(...O.motion.ease.accelerate),reduceMotion:_usePresenceMotion.PRESENCE_REDUCE_MOTION},e=>{"worklet";e&&(0,_reactNativeReanimated.runOnJS)(Pe)()})}),[oe,ue,Pe,o,I,le,Te,ie,O.motion.ease.accelerate]),Ge=(0,_react.useCallback)(async()=>{await De()},[De]),Ve=(0,_react.useCallback)((e,t,a)=>{const r=Ce.current;if(!r)return void e();if(je.current)return void t?.();const n=r();"boolean"!=typeof n?(je.current=!0,a?.(),n.then(a=>{je.current=!1,a&&Me.current&&ge.current>=0?e():t?.()},e=>{throw je.current=!1,e})):(n?e:t)?.()},[]),qe=(0,_react.useCallback)(()=>new Promise(e=>{ge.current<0?De().then(e):Ve(()=>{De().then(e)},()=>e(!1))}),[De,Ve]),Le=(0,_react.useCallback)(()=>{c&&qe()},[c,qe]);(0,_react.useImperativeHandle)(t,()=>({expand:He,collapse:Be,close:Ge,requestClose:qe}),[He,Be,Ge,qe]),(0,_react.useEffect)(()=>{"number"==typeof r&&r!==de&&(-1===r?Ge():He(r))},[r]);const Fe=(0,_react.useRef)({hostHeight:P,contentSnap:ae});(0,_react.useEffect)(()=>{const e=Fe.current;if(e.hostHeight===P&&e.contentSnap===ae)return;if(Fe.current={hostHeight:P,contentSnap:ae},e.hostHeight===P&&ue.value<0)return;const t=Ie(ue.value);ie.value=Ne.current?t:(0,_reactNativeReanimated.withSpring)(t,SPRING_CONFIG)},[P,ae]);const Je=P-se,We=(0,_react.useMemo)(()=>ne.map(e=>P-e),[ne,P]),ze=(0,_react.useCallback)(()=>{const e=ge.current;e<0||Ae(Ie(e),e,e)},[Ae,Ie]),Ye=(0,_react.useCallback)((e,t)=>{const a=ue.value;-1!==e?(Te(e),Ae(t,a,e)):Ve(()=>{(0,_index2.triggerHaptic)("selection"),Ge()},ze,ze)},[Ae,Ge,ue,Ve,Te,ze]),$e=(0,_react.useMemo)(()=>_reactNativeGestureHandler.Gesture.Native().withTestId(k?`${k}-content-gesture`:"bottom-sheet-content-gesture"),[k]),Ke=(0,_react.useMemo)(()=>{const e=We,t=oe,a=Je,r=i;return _reactNativeGestureHandler.Gesture.Pan().withTestId(k?`${k}-pan-gesture`:"bottom-sheet-pan-gesture").activeOffsetY([-10,10]).failOffsetX([-15,15]).onStart(()=>{"worklet";ce.value=ie.value}).onUpdate(e=>{"worklet";const t=ce.value+e.translationY;ie.value=t<a?a+.25*(t-a):t}).onEnd(a=>{"worklet";const n=ie.value;if(a.velocityY>1e3)return r?void(0,_reactNativeReanimated.runOnJS)(Ye)(-1,t):void(0,_reactNativeReanimated.runOnJS)(Ye)(0,e[0]);let o=0,s=Math.abs(n-e[0]);for(let t=1;t<e.length;t++){const a=Math.abs(n-e[t]);a<s&&(s=a,o=t)}const i=e[0];r&&n-i>80?(0,_reactNativeReanimated.runOnJS)(Ye)(-1,t):(0,_reactNativeReanimated.runOnJS)(Ye)(o,e[o])})},[oe,ce,i,Ye,Je,We,k,ie]),{height:Ue}=(0,_reactNativeKeyboardController.useReanimatedKeyboardAnimation)(),Xe="shift"===f,Qe=(0,_reactNativeReanimated.useDerivedValue)(()=>Xe?Ue.value:0),Ze=ne[de>=0?de:0]??se,et=O.space.md,tt=(0,_reactNativeReanimated.useAnimatedStyle)(()=>{if(G){const e=Qe.value,t=P+e-Ze-et,a=e<0&&ie.value>t?t:ie.value;return{top:a<F?F:a,opacity:le.value}}const e=ie.value+Qe.value,t=Qe.value<0?F:Je;return{top:e<t?t:e,opacity:le.value}}),at=(0,_reactNativeReanimated.useAnimatedStyle)(()=>{const e=Qe.value;if(G){const t=P+e-Ze-et,a=e<0&&ie.value>t?t:ie.value,r=P+e-et-(a<F?F:a);return{height:r<0?0:r>Ze?Ze:r}}const t=e<0?F:Je,a=ie.value+e,r=P+e-(a<t?t:a);return{height:r<0?0:r>se?se:r}}),rt=de>=0,nt=(0,_react.useMemo)(()=>buildStyles(O),[O]),ot=(0,_react.useCallback)(()=>{c&&Ve(()=>{(0,_index2.triggerHaptic)("selection"),Ge()})},[c,Ge,Ve]),st=(0,_react.useMemo)(()=>_reactNativeGestureHandler.Gesture.Tap().withTestId(k?`${k}-backdrop-gesture`:"bottom-sheet-backdrop-gesture").maxDuration(250).onEnd((_e,e)=>{"worklet";e&&(0,_reactNativeReanimated.runOnJS)(ot)()}),[ot,k]),it=(0,_react.useMemo)(()=>({snapIndex:de,snapPoints:ne,expand:He,collapse:Be,close:Ge,requestClose:qe}),[de,ne,He,Be,Ge,qe]);if("inline"===b&&!xe)return null;if("modal"===b&&!be)return null;const ct=(0,_jsxRuntime.jsxs)(_reactNative.View,{collapsable:!1,style:["modal"===b?nt.backdropModal:nt.backdropInline,{backgroundColor:O.colors.scrim}],onLayout:B,testID:k,accessibilityViewIsModal:M??rt,children:[(0,_jsxRuntime.jsx)(_reactNativeGestureHandler.GestureDetector,{gesture:st,children:(0,_jsxRuntime.jsx)(_reactNativeReanimated.default.View,{style:_reactNative.StyleSheet.absoluteFill,accessibilityRole:"button",accessibilityLabel:"Close bottom sheet"})}),(0,_jsxRuntime.jsx)(_reactNativeReanimated.default.View,{accessibilityRole:"alert",accessibilityLabel:j,accessibilityViewIsModal:M??rt,accessibilityActions:[{name:"escape",label:"Close bottom sheet"}],onAccessibilityAction:e=>{"escape"===e.nativeEvent.actionName&&Le()},onAccessibilityEscape:Le,style:[nt.sheet,{height:se,backgroundColor:O.colors.surface,borderTopLeftRadius:O.radius.xl,borderTopRightRadius:O.radius.xl,..._corners.smoothCorners,...O.shadow.modal},G?{height:Ze,left:(A-V)/2,right:void 0,width:V,borderBottomLeftRadius:O.radius.xl,borderBottomRightRadius:O.radius.xl}:null,x,tt],children:(0,_jsxRuntime.jsxs)(SheetBody,{style:[nt.body,at],keyboardOffset:Qe,children:[G?(0,_jsxRuntime.jsx)(_reactNative.View,{style:{height:O.space.md}}):(0,_jsxRuntime.jsx)(_reactNativeGestureHandler.GestureDetector,{gesture:Ke,children:(0,_jsxRuntime.jsx)(_reactNative.View,{style:nt.handleRow,onLayout:W?Y:void 0,accessible:!0,accessibilityLabel:"Drag handle",accessibilityHint:"Drag up or down to resize the sheet, or swipe down to close it",testID:k?`${k}-handle`:"bottom-sheet-handle",children:(0,_jsxRuntime.jsx)(_reactNative.View,{style:[nt.handle,{backgroundColor:O.colors.border},R]})})}),null!=y&&(0,_jsxRuntime.jsx)(_reactNative.View,{style:[nt.header,g],onLayout:W?K:void 0,children:y}),u?(0,_jsxRuntime.jsx)(_reactNativeGestureHandler.GestureDetector,{gesture:$e,children:(0,_jsxRuntime.jsx)(_reactNative.ScrollView,{ref:d,style:nt.scrollContent,onScroll:_,onContentSizeChange:re,onLayout:m,scrollEventThrottle:v,keyboardShouldPersistTaps:"always",keyboardDismissMode:"none",children:C})}):(0,_jsxRuntime.jsx)(_reactNative.View,{style:W?[nt.content,{overflow:"visible"}]:nt.content,children:W?(0,_jsxRuntime.jsx)(_reactNative.View,{onLayout:X,children:C}):C}),null!=N&&(0,_jsxRuntime.jsx)(_reactNative.View,{style:[nt.footer,w],onLayout:W?ee:void 0,children:N})]})})]}),lt=(0,_jsxRuntime.jsx)(BottomSheetContext.Provider,{value:it,children:ct});return"modal"===b?(0,_jsxRuntime.jsx)(_reactNative.Modal,{transparent:!0,visible:ve,onRequestClose:Le,onDismiss:"ios"===_reactNative.Platform.OS?Ee:void 0,statusBarTranslucent:!0,navigationBarTranslucent:!0,animationType:"none",supportedOrientations:["portrait","landscape"],children:(0,_jsxRuntime.jsxs)(_ModalSafeArea.ModalSafeArea,{onInsets:L,children:["android"===_reactNative.Platform.OS?(0,_jsxRuntime.jsx)(_reactNativeGestureHandler.GestureHandlerRootView,{style:nt.modalRoot,children:lt}):lt,(0,_jsxRuntime.jsx)(_ToastProvider.ToastHost,{})]})}):lt}),SheetBody=({style:e,keyboardOffset:t,children:a})=>{const r=(0,_reactNativeSafeAreaContext.useSafeAreaInsets)().bottom,n=(0,_reactNativeReanimated.useAnimatedStyle)(()=>{const e=r+t.value;return{paddingBottom:e>0?e:0}});return(0,_jsxRuntime.jsx)(_reactNativeReanimated.default.View,{style:[e,n],children:a})};BottomSheet.displayName="BottomSheet";const useMeasuredHeight=()=>{const[e,t]=(0,_react.useState)(0),a=(0,_react.useCallback)(e=>{t(t=>t===e?t:e)},[]);return[e,(0,_react.useCallback)(e=>a(e.nativeEvent.layout.height),[a]),a]},resolveSnapPoints=(e,t,a)=>[...e.map(e=>{if("number"==typeof e)return e;if("content"===e)return a;const r=parseFloat(e);return Number.isNaN(r)?0:r/100*t})].sort((e,t)=>e-t),clamp=(e,t,a)=>Math.min(Math.max(e,t),a),buildStyles=e=>_reactNative.StyleSheet.create({backdropModal:{flex:1},backdropInline:{..._reactNative.StyleSheet.absoluteFill},sheet:{position:"absolute",left:0,right:0,overflow:"hidden"},body:{overflow:"hidden"},handleRow:{alignItems:"center",justifyContent:"center",alignSelf:"stretch",paddingTop:e.space.md,paddingBottom:e.space.xl},header:{},footer:{},handle:{width:36,height:4,borderRadius:e.radius.pill,..._corners.smoothCorners},content:{flex:1,overflow:"hidden"},scrollContent:{flex:1},modalRoot:{flex:1}});var _default=exports.default=BottomSheet;
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.useBottomSheet=exports.default=exports.BottomSheet=void 0;var cache,_react=require("react"),_reactNative=require("react-native"),_reactNativeGestureHandler=require("react-native-gesture-handler"),_reactNativeKeyboardController=require("react-native-keyboard-controller"),_reactNativeReanimated=_interopRequireWildcard(require("react-native-reanimated")),_reactNativeSafeAreaContext=require("react-native-safe-area-context"),_usePresenceMotion=require("../../hooks/usePresenceMotion.js"),_index=require("../../theme/index.js"),_index2=require("../../utils/index.js"),_corners=require("../../utils/corners.js"),_ModalSafeArea=require("../ModalSafeArea/ModalSafeArea.js"),_ToastProvider=require("../Toast/ToastProvider.js"),_jsxRuntime=require("react/jsx-runtime");function _interopRequireWildcard(e,t){if(!t&&e&&e.__esModule)return e;var a,r,n=Object.defineProperty,o={__proto__:null,default:e};if(Object(e)!==e)return o;if(cache||"function"!=typeof WeakMap||(cache=new WeakMap),cache){if(cache.has(e))return cache.get(e);cache.set(e,o)}for(r in e)"default"!==r&&{}.hasOwnProperty.call(e,r)&&((a=n&&Object.getOwnPropertyDescriptor(e,r))&&(a.get||a.set)?n(o,r,a):o[r]=e[r]);return o}const TABLET_MIN_SHORT_SIDE=600,DIALOG_MAX_WIDTH=560,BottomSheetContext=(0,_react.createContext)(null),useBottomSheet=()=>{const e=(0,_react.useContext)(BottomSheetContext);if(!e)throw new Error("useBottomSheet must be used inside a <BottomSheet>.");return e};exports.useBottomSheet=useBottomSheet;const SPRING_CONFIG={damping:20,stiffness:240,mass:1},CLOSE_VELOCITY_THRESHOLD=1e3,DRAG_ACTIVATION_OFFSET=10,BottomSheet=exports.BottomSheet=(0,_react.forwardRef)((e,t)=>{const{snapPoints:a,index:r,onChange:n,onAnimate:o,onAfterClose:s,enablePanDownToClose:i=!0,enableBackdropPress:c=!0,confirmDismiss:l,scrollable:u=!1,scrollRef:d,onScroll:_,onContentSizeChange:h,onScrollLayout:m,scrollEventThrottle:v,keyboardBehavior:f="shift",mode:b="modal",presentation:p="sheet",animateMount:S=!0,handleIndicatorStyle:R,containerStyle:x,header:y,footer:N,headerStyle:g,footerStyle:w,children:C,accessibilityLabel:j,accessibilityViewIsModal:M,testID:k}=e,O=(0,_index.useTheme)(),I=(0,_usePresenceMotion.usePresenceMotion)(),T=(0,_reactNativeSafeAreaContext.useSafeAreaInsets)(),[P,E]=(0,_react.useState)(()=>_reactNative.Dimensions.get("window").height),[A,H]=(0,_react.useState)(()=>_reactNative.Dimensions.get("window").width),B=(0,_react.useCallback)(e=>{const{height:t,width:a}=e.nativeEvent.layout;t>0&&E(e=>e===t?e:t),a>0&&H(e=>e===a?e:a)},[]),D=(0,_reactNative.useWindowDimensions)(),G="dialog"===p||"auto"===p&&Math.min(D.width,D.height)>=600,V=Math.min(560,A-2*O.space.xl),[q,L]=(0,_ModalSafeArea.useModalInsets)(),F="modal"===b?q.top:T.top,J="modal"===b?q.bottom:T.bottom,W=a.includes("content"),[z,K]=useMeasuredHeight(),[Y,$]=useMeasuredHeight(),[U,X,Q]=useMeasuredHeight(),[Z,ee]=useMeasuredHeight(),te=G?O.space.md:z,ae=W?Math.min(te+(null!=y?Y:0)+U+(null!=N?Z:0)+J,P-F):0,re=(0,_react.useCallback)((e,t)=>{W&&Q(t),h?.(e,t)},[W,h,Q]),ne=(0,_react.useMemo)(()=>resolveSnapPoints(a,P,ae),[a,P,ae]),oe=P,se=ne[ne.length-1]??0,ie=(0,_reactNativeReanimated.useSharedValue)(oe),ce=(0,_reactNativeReanimated.useSharedValue)(oe),le=(0,_reactNativeReanimated.useSharedValue)(1),ue=(0,_reactNativeReanimated.useSharedValue)(-1),[de,he]=(0,_react.useState)(-1),me=(0,_react.useRef)(!1),[ve,fe]=(0,_react.useState)(!1),[be,pe]=(0,_react.useState)(!1),Se=(0,_react.useRef)(!1),Re=(0,_react.useRef)(s);Re.current=s;const[xe,ye]=(0,_react.useState)(!1),Ne=(0,_react.useRef)(!S&&"number"==typeof r&&r>=0),ge=(0,_react.useRef)(-1),we=(0,_react.useRef)(!1);we.current="modal"===b?be:xe;const Ce=(0,_react.useRef)(l);Ce.current=l;const je=(0,_react.useRef)(!1),Me=(0,_react.useRef)(!0),ke=(0,_react.useRef)([]),Oe=(0,_react.useCallback)(e=>{const t=ke.current;ke.current=[];for(const a of t)a(e)},[]);(0,_react.useEffect)(()=>(Me.current=!0,()=>{Me.current=!1,Oe(!1)}),[Oe]);const Ie=(0,_react.useCallback)(e=>{if(e<0||e>=ne.length)return oe;const t=ne[e];return G?(P-t)/2:P-t},[ne,P,oe,G]),Te=(0,_react.useCallback)(e=>{ge.current=e;de!==e&&(he(e),ue.value=e,n?.(e))},[de,ue,n]),Pe=(0,_react.useCallback)(()=>{me.current=!1,ue.value<0&&(Se.current=!0,"modal"===b?(fe(!1),"ios"!==_reactNative.Platform.OS&&pe(!1)):ye(!1))},[b,ue]),Ee=(0,_react.useCallback)(()=>{Se.current&&pe(!1)},[]);(0,_react.useEffect)(()=>{("modal"===b?!be:!xe)&&Se.current&&(Se.current=!1,Re.current?.(),Oe(!0))},[b,be,xe,Oe]);const Ae=(0,_react.useCallback)((e,t,a)=>{me.current=!0,o?.(t,a),ie.value=(0,_reactNativeReanimated.withSpring)(e,SPRING_CONFIG,e=>{"worklet";e&&(0,_reactNativeReanimated.runOnJS)(Pe)()})},[o,ie,Pe]),He=(0,_react.useCallback)(e=>{const t="number"==typeof e?clamp(e,0,ne.length-1):de>=0?de:0,a=ue.value,r=Ie(t);return Se.current=!1,Oe(!1),"modal"===b?(pe(!0),fe(!0)):ye(!0),a<0&&Ne.current?(ie.value=r,le.value=1,Te(t),void o?.(a,t)):a<0&&I.reduced?(ie.value=r,le.value=0,le.value=(0,_reactNativeReanimated.withTiming)(1,{duration:I.duration("fast"),easing:_reactNativeReanimated.Easing.bezier(...O.motion.ease.decelerate),reduceMotion:_usePresenceMotion.PRESENCE_REDUCE_MOTION}),Te(t),void o?.(a,t)):(a<0&&(ie.value=oe,le.value=1),Te(t),void Ae(r,a,t))},[Ae,oe,de,ue,b,o,I,le,ne.length,Te,Oe,O.motion.ease.decelerate,ie,Ie]),Be=(0,_react.useCallback)(()=>{if(0===ne.length)return;const e=ue.value,t=Ie(0);Te(0),Ae(t,e,0)},[Ae,ue,ne.length,Te,Ie]),De=(0,_react.useCallback)(()=>new Promise(e=>{if(ge.current<0)return void(we.current?ke.current.push(e):e(!0));ke.current.push(e),Ne.current=!1;const t=ue.value;Te(-1),me.current=!0,o?.(t,-1);const a=I.reduced?le:ie,r=I.reduced?0:oe;a.value=(0,_reactNativeReanimated.withTiming)(r,{duration:I.duration("fast"),easing:_reactNativeReanimated.Easing.bezier(...O.motion.ease.accelerate),reduceMotion:_usePresenceMotion.PRESENCE_REDUCE_MOTION},e=>{"worklet";e&&(0,_reactNativeReanimated.runOnJS)(Pe)()})}),[oe,ue,Pe,o,I,le,Te,ie,O.motion.ease.accelerate]),Ge=(0,_react.useCallback)(async()=>{await De()},[De]),Ve=(0,_react.useCallback)((e,t,a)=>{const r=Ce.current;if(!r)return void e();if(je.current)return void t?.();const n=r();"boolean"!=typeof n?(je.current=!0,a?.(),n.then(a=>{je.current=!1,a&&Me.current&&ge.current>=0?e():t?.()},e=>{throw je.current=!1,e})):(n?e:t)?.()},[]),qe=(0,_react.useCallback)(()=>new Promise(e=>{ge.current<0?De().then(e):Ve(()=>{De().then(e)},()=>e(!1))}),[De,Ve]),Le=(0,_react.useCallback)(()=>{c&&qe()},[c,qe]);(0,_react.useImperativeHandle)(t,()=>({expand:He,collapse:Be,close:Ge,requestClose:qe}),[He,Be,Ge,qe]),(0,_react.useEffect)(()=>{"number"==typeof r&&r!==de&&(-1===r?Ge():He(r))},[r]);const Fe=(0,_react.useRef)({hostHeight:P,contentSnap:ae});(0,_react.useEffect)(()=>{const e=Fe.current;if(e.hostHeight===P&&e.contentSnap===ae)return;if(Fe.current={hostHeight:P,contentSnap:ae},e.hostHeight===P&&ue.value<0)return;const t=Ie(ue.value);ie.value=Ne.current?t:(0,_reactNativeReanimated.withSpring)(t,SPRING_CONFIG)},[P,ae]);const Je=P-se,We=(0,_react.useMemo)(()=>ne.map(e=>P-e),[ne,P]),ze=(0,_react.useCallback)(()=>{const e=ge.current;e<0||Ae(Ie(e),e,e)},[Ae,Ie]),Ke=(0,_react.useCallback)((e,t)=>{const a=ue.value;-1!==e?(Te(e),Ae(t,a,e)):Ve(()=>{_reactNative.Keyboard.dismiss(),(0,_index2.triggerHaptic)("selection"),Ge()},ze,ze)},[Ae,Ge,ue,Ve,Te,ze]),Ye=(0,_react.useMemo)(()=>_reactNativeGestureHandler.Gesture.Native().withTestId(k?`${k}-content-gesture`:"bottom-sheet-content-gesture"),[k]),$e=(0,_react.useMemo)(()=>{const e=We,t=oe,a=Je,r=i;return _reactNativeGestureHandler.Gesture.Pan().withTestId(k?`${k}-pan-gesture`:"bottom-sheet-pan-gesture").activeOffsetY([-10,10]).failOffsetX([-15,15]).onStart(()=>{"worklet";ce.value=ie.value}).onUpdate(e=>{"worklet";const t=ce.value+e.translationY;ie.value=t<a?a+.25*(t-a):t}).onEnd(a=>{"worklet";const n=ie.value;if(a.velocityY>1e3)return r?void(0,_reactNativeReanimated.runOnJS)(Ke)(-1,t):void(0,_reactNativeReanimated.runOnJS)(Ke)(0,e[0]);let o=0,s=Math.abs(n-e[0]);for(let t=1;t<e.length;t++){const a=Math.abs(n-e[t]);a<s&&(s=a,o=t)}const i=e[0];r&&n-i>80?(0,_reactNativeReanimated.runOnJS)(Ke)(-1,t):(0,_reactNativeReanimated.runOnJS)(Ke)(o,e[o])})},[oe,ce,i,Ke,Je,We,k,ie]),{height:Ue}=(0,_reactNativeKeyboardController.useReanimatedKeyboardAnimation)(),Xe="shift"===f,Qe=(0,_reactNativeReanimated.useDerivedValue)(()=>Xe?Ue.value:0),Ze=ne[de>=0?de:0]??se,et=O.space.md,tt=(0,_reactNativeReanimated.useAnimatedStyle)(()=>{if(G){const e=Qe.value,t=P+e-Ze-et,a=e<0&&ie.value>t?t:ie.value;return{top:a<F?F:a,opacity:le.value}}const e=ie.value+Qe.value,t=Qe.value<0?F:Je;return{top:e<t?t:e,opacity:le.value}}),at=(0,_reactNativeReanimated.useAnimatedStyle)(()=>{const e=Qe.value;if(G){const t=P+e-Ze-et,a=e<0&&ie.value>t?t:ie.value,r=P+e-et-(a<F?F:a);return{height:r<0?0:r>Ze?Ze:r}}const t=e<0?F:Je,a=ie.value+e,r=P+e-(a<t?t:a);return{height:r<0?0:r>se?se:r}}),rt=de>=0,nt=(0,_react.useMemo)(()=>buildStyles(O),[O]),ot=(0,_react.useCallback)(()=>{c&&Ve(()=>{(0,_index2.triggerHaptic)("selection"),Ge()})},[c,Ge,Ve]),st=(0,_react.useMemo)(()=>_reactNativeGestureHandler.Gesture.Tap().withTestId(k?`${k}-backdrop-gesture`:"bottom-sheet-backdrop-gesture").maxDuration(250).onEnd((_e,e)=>{"worklet";e&&(0,_reactNativeReanimated.runOnJS)(ot)()}),[ot,k]),it=(0,_react.useMemo)(()=>({snapIndex:de,snapPoints:ne,expand:He,collapse:Be,close:Ge,requestClose:qe}),[de,ne,He,Be,Ge,qe]);if("inline"===b&&!xe)return null;if("modal"===b&&!be)return null;const ct=(0,_jsxRuntime.jsxs)(_reactNative.View,{collapsable:!1,style:["modal"===b?nt.backdropModal:nt.backdropInline,{backgroundColor:O.colors.scrim}],onLayout:B,testID:k,accessibilityViewIsModal:M??rt,children:[(0,_jsxRuntime.jsx)(_reactNativeGestureHandler.GestureDetector,{gesture:st,children:(0,_jsxRuntime.jsx)(_reactNativeReanimated.default.View,{style:_reactNative.StyleSheet.absoluteFill,accessibilityRole:"button",accessibilityLabel:"Close bottom sheet"})}),(0,_jsxRuntime.jsx)(_reactNativeReanimated.default.View,{accessibilityRole:"alert",accessibilityLabel:j,accessibilityViewIsModal:M??rt,accessibilityActions:[{name:"escape",label:"Close bottom sheet"}],onAccessibilityAction:e=>{"escape"===e.nativeEvent.actionName&&Le()},onAccessibilityEscape:Le,style:[nt.sheet,{height:se,backgroundColor:O.colors.surface,borderTopLeftRadius:O.radius.xl,borderTopRightRadius:O.radius.xl,..._corners.smoothCorners,...O.shadow.modal},G?{height:Ze,left:(A-V)/2,right:void 0,width:V,borderBottomLeftRadius:O.radius.xl,borderBottomRightRadius:O.radius.xl}:null,x,tt],children:(0,_jsxRuntime.jsxs)(SheetBody,{style:[nt.body,at],keyboardOffset:Qe,children:[G?(0,_jsxRuntime.jsx)(_reactNative.View,{style:{height:O.space.md}}):(0,_jsxRuntime.jsx)(_reactNativeGestureHandler.GestureDetector,{gesture:$e,children:(0,_jsxRuntime.jsx)(_reactNative.View,{style:nt.handleRow,onLayout:W?K:void 0,accessible:!0,accessibilityLabel:"Drag handle",accessibilityHint:"Drag up or down to resize the sheet, or swipe down to close it",testID:k?`${k}-handle`:"bottom-sheet-handle",children:(0,_jsxRuntime.jsx)(_reactNative.View,{style:[nt.handle,{backgroundColor:O.colors.border},R]})})}),null!=y&&(0,_jsxRuntime.jsx)(_reactNative.View,{style:[nt.header,g],onLayout:W?$:void 0,children:y}),u?(0,_jsxRuntime.jsx)(_reactNativeGestureHandler.GestureDetector,{gesture:Ye,children:(0,_jsxRuntime.jsx)(_reactNative.ScrollView,{ref:d,style:nt.scrollContent,onScroll:_,onContentSizeChange:re,onLayout:m,scrollEventThrottle:v,keyboardShouldPersistTaps:"always",keyboardDismissMode:"none",children:C})}):(0,_jsxRuntime.jsx)(_reactNative.View,{style:W?[nt.content,{overflow:"visible"}]:nt.content,children:W?(0,_jsxRuntime.jsx)(_reactNative.View,{onLayout:X,children:C}):C}),null!=N&&(0,_jsxRuntime.jsx)(_reactNative.View,{style:[nt.footer,w],onLayout:W?ee:void 0,children:N})]})})]}),lt=(0,_jsxRuntime.jsx)(BottomSheetContext.Provider,{value:it,children:ct});return"modal"===b?(0,_jsxRuntime.jsx)(_reactNative.Modal,{transparent:!0,visible:ve,onRequestClose:Le,onDismiss:"ios"===_reactNative.Platform.OS?Ee:void 0,statusBarTranslucent:!0,navigationBarTranslucent:!0,animationType:"none",supportedOrientations:["portrait","landscape"],children:(0,_jsxRuntime.jsxs)(_ModalSafeArea.ModalSafeArea,{onInsets:L,children:["android"===_reactNative.Platform.OS?(0,_jsxRuntime.jsx)(_reactNativeGestureHandler.GestureHandlerRootView,{style:nt.modalRoot,children:lt}):lt,(0,_jsxRuntime.jsx)(_ToastProvider.ToastHost,{})]})}):lt}),SheetBody=({style:e,keyboardOffset:t,children:a})=>{const r=(0,_reactNativeSafeAreaContext.useSafeAreaInsets)().bottom,n=(0,_reactNativeReanimated.useAnimatedStyle)(()=>{const e=r+t.value;return{paddingBottom:e>0?e:0}});return(0,_jsxRuntime.jsx)(_reactNativeReanimated.default.View,{style:[e,n],children:a})};BottomSheet.displayName="BottomSheet";const useMeasuredHeight=()=>{const[e,t]=(0,_react.useState)(0),a=(0,_react.useCallback)(e=>{t(t=>t===e?t:e)},[]);return[e,(0,_react.useCallback)(e=>a(e.nativeEvent.layout.height),[a]),a]},resolveSnapPoints=(e,t,a)=>[...e.map(e=>{if("number"==typeof e)return e;if("content"===e)return a;const r=parseFloat(e);return Number.isNaN(r)?0:r/100*t})].sort((e,t)=>e-t),clamp=(e,t,a)=>Math.min(Math.max(e,t),a),buildStyles=e=>_reactNative.StyleSheet.create({backdropModal:{flex:1},backdropInline:{..._reactNative.StyleSheet.absoluteFill},sheet:{position:"absolute",left:0,right:0,overflow:"hidden"},body:{overflow:"hidden"},handleRow:{alignItems:"center",justifyContent:"center",alignSelf:"stretch",paddingTop:e.space.md,paddingBottom:e.space.xl},header:{},footer:{},handle:{width:36,height:4,borderRadius:e.radius.pill,..._corners.smoothCorners},content:{flex:1,overflow:"hidden"},scrollContent:{flex:1},modalRoot:{flex:1}});var _default=exports.default=BottomSheet;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=exports.Card=void 0;var cache,_react=_interopRequireWildcard(require("react")),_reactNative=require("react-native"),_useControllableState=require("../../hooks/useControllableState.js"),_usePressAnimation=require("../../hooks/usePressAnimation.js"),_index=require("../../theme/index.js"),_corners=require("../../utils/corners.js"),_hapticUtils=require("../../utils/hapticUtils.js"),_mergeRefs=require("../../utils/mergeRefs.js"),_shadows=require("../../utils/shadows.js"),_squircle=require("../../utils/squircle.js"),_themeStyles=require("../../utils/themeStyles.js"),_AppIcon=require("../AppIcon/AppIcon.js"),_useContextMenu=require("../Menu/useContextMenu.js"),_index2=require("../Skeleton/index.js"),_SquircleFill=require("../SquircleFill/SquircleFill.js"),_index3=require("../Text/index.js"),_jsxRuntime=require("react/jsx-runtime");function _interopRequireWildcard(e,t){if(!t&&e&&e.__esModule)return e;var i,s,r=Object.defineProperty,n={__proto__:null,default:e};if(Object(e)!==e)return n;if(cache||"function"!=typeof WeakMap||(cache=new WeakMap),cache){if(cache.has(e))return cache.get(e);cache.set(e,n)}for(s in e)"default"!==s&&{}.hasOwnProperty.call(e,s)&&((i=r&&Object.getOwnPropertyDescriptor(e,s))&&(i.get||i.set)?r(n,s,i):n[s]=e[s]);return n}const BACKGROUND_TOKENS=["bg","bg-subtle","bg-muted","surface","scrim","surface-inverse"],paddingMap={none:"none",sm:"sm",md:"lg",lg:"xl",xl:"2xl"},Card=exports.Card=_react.default.memo((0,_react.forwardRef)((e,t)=>{const{children:i,variant:s="elevated",elevation:r="card",radius:n="lg",padding:a="md",interactive:o=!1,bg:l,header:c,title:d,titleFont:u="sans",lead:h,action:x,headerActions:m,collapsible:_=!1,collapsed:p,defaultCollapsed:b=!1,onCollapsedChange:g,collapsedSummary:y,onRemove:j,removeLabel:v="Remove",separatorHeight:R=_reactNative.StyleSheet.hairlineWidth,footer:f,imageSource:S,imageHeight:C=160,imageAspectRatio:w,imageOverlay:A,loading:N=!1,gradient:q,onPress:k,haptic:F,contextMenu:T,accessibilityLabel:B,accessibilityHint:P,accessibilityRole:I,style:L,containerStyle:M,headerStyle:V,bodyStyle:H,footerStyle:O,borderRadius:z,testID:W,onLayout:D,...U}=e,E=(0,_index.useTheme)(),G=o||"function"==typeof k,K=(0,_useContextMenu.useContextMenu)(T,{haptic:F||!1,testID:W,accessibilityActions:U.accessibilityActions,onAccessibilityAction:U.onAccessibilityAction}),$=(0,_react.useMemo)(()=>(0,_mergeRefs.mergeRefs)(t,K.hostRef),[t,K.hostRef]),J=G||K.enabled,{style:Q,pressIn:X,pressOut:Y}=(0,_usePressAnimation.usePressAnimation)({enabled:J}),Z=stylesFor(E),ee=Boolean(S),te=E.space[paddingMap[a]],ie=(0,_react.useMemo)(()=>q?"string"==typeof q?E.settings.gradients[q]??null:q:null,[q,E.settings.gradients]),se="flat"===s,re=se?E.radius.none:z??E.radius[n],ne=resolveBackground(E,l),[ae,oe]=(0,_useControllableState.useControllableState)({value:p,defaultValue:b,onChange:g}),le=_&&ae,ce=hasBuiltInHeaderContent(e),de=Boolean(c)||ce,ue=(0,_SquircleFill.useSquircle)(!ee&&!ie&&!se,re,D),he=_reactNative.StyleSheet.flatten([L,M])??{},xe=he.backgroundColor,me=he.borderColor,pe=xe??ne??("filled"===s?E.colors["bg-subtle"]:E.colors.surface),be="outlined"===s?E.size.border:0,ge=me??E.colors.border,ye="none"===r?void 0:E.shadow[r],je="elevated"===s&&(0,_shadows.supportsBoxShadow)()&&ye?(0,_shadows.toBoxShadow)(ye):void 0,ve=ue.active&&"elevated"===s&&!je,Re=ue.active&&!ve?{backgroundColor:"transparent",borderColor:"transparent"}:null,fe=(0,_react.useMemo)(()=>{const e={borderRadius:ve&&ue.size?(0,_squircle.squircleHostRadius)(ue.size.width,ue.size.height,re):re,..._corners.smoothCorners,padding:ee?E.space.none:te,overflow:ue.active?"visible":"hidden"};switch(s){case"flat":return{...e,backgroundColor:ne??E.colors.surface,borderBottomWidth:R,borderBottomColor:E.colors.border};case"outlined":return{...e,backgroundColor:ue.active?"transparent":ne??E.colors.surface,borderWidth:E.size.border,borderColor:ue.active?"transparent":E.colors.border};case"filled":return{...e,backgroundColor:ue.active?"transparent":ne??E.colors["bg-subtle"]};default:return{...e,backgroundColor:ne??E.colors.surface,...je?{boxShadow:je}:ye}}},[E,s,ye,re,ee,te,ue.active,ue.size,je,ve,ne,R]),Se=(0,_react.useMemo)(()=>({..."number"==typeof w?{width:"100%",aspectRatio:w}:{width:"100%",height:C},borderTopLeftRadius:re,borderTopRightRadius:re,borderBottomLeftRadius:E.radius.none,borderBottomRightRadius:E.radius.none,..._corners.smoothCorners}),[E,re,w,C]),Ce="string"==typeof d?d:"",we=(0,_jsxRuntime.jsxs)(_jsxRuntime.Fragment,{children:[(0,_jsxRuntime.jsxs)(_reactNative.View,{style:Z.titleColumn,children:["string"==typeof d?(0,_jsxRuntime.jsx)(_index3.Text,{variant:"title",accessibilityRole:"header",style:titleFaceFor(E,u),children:d}):d,h?(0,_jsxRuntime.jsx)(_index3.Text,{variant:"bodySmall",style:Z.lead,children:h}):null,le&&y?(0,_jsxRuntime.jsx)(_index3.Text,{variant:"caption",style:Z.lead,children:y}):null]}),isCardTextAction(x)?(0,_jsxRuntime.jsx)(CardTextActionButton,{action:x,haptic:F}):x?(0,_jsxRuntime.jsx)(_reactNative.View,{style:Z.actionNode,children:x}):null,m,_?(0,_jsxRuntime.jsx)(CardIconAction,{icon:le?"chevron-down":"chevron-up",label:`${le?"Show":"Hide"} ${Ce}`.trim(),expanded:!le,onPress:()=>oe(!le),haptic:F}):null,j?(0,_jsxRuntime.jsx)(CardIconAction,{icon:"trash",label:v,onPress:j,color:E.colors["danger-text"],haptic:F}):null]}),Ae=(0,_jsxRuntime.jsxs)(_jsxRuntime.Fragment,{children:[de?(0,_jsxRuntime.jsx)(_reactNative.View,{style:[Z.header,!c&&Z.headerRow,le&&Z.headerFolded,V],children:c??we}):null,le?null:(0,_jsxRuntime.jsx)(_reactNative.View,{style:[de||f?Z.body:null,H],children:i}),f&&!le?(0,_jsxRuntime.jsx)(_reactNative.View,{style:[Z.footer,O],children:f}):null]}),Ne=ee?(0,_jsxRuntime.jsxs)(_jsxRuntime.Fragment,{children:[(0,_jsxRuntime.jsxs)(_reactNative.View,{style:Z.imageWrapper,children:[(0,_jsxRuntime.jsx)(_reactNative.Image,{source:S,resizeMode:"cover",style:Se,accessibilityLabel:"",accessible:!1}),A?(0,_jsxRuntime.jsx)(_reactNative.View,{pointerEvents:"box-none",style:Z.imageOverlay,children:A}):null]}),(0,_jsxRuntime.jsx)(_reactNative.View,{style:{padding:te},children:Ae})]}):Ae,qe=ie?(0,_jsxRuntime.jsxs)(_jsxRuntime.Fragment,{children:[(0,_jsxRuntime.jsx)(_index.Gradient,{gradient:ie,style:_reactNative.StyleSheet.absoluteFill}),Ne]}):ue.active&&ue.size?(0,_jsxRuntime.jsxs)(_jsxRuntime.Fragment,{children:[(0,_jsxRuntime.jsx)(_SquircleFill.SquircleFill,{width:ue.size.width,height:ue.size.height,radius:re,fill:pe,stroke:be?ge:void 0,strokeWidth:be,outset:be}),Ne]}):Ne;let ke;if(J){const handlePress=e=>{G&&(F&&(0,_hapticUtils.triggerHaptic)(F),k?.(e))};ke=(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{style:Q,children:(0,_jsxRuntime.jsx)(_reactNative.Pressable,{ref:$,onPress:handlePress,onPressIn:X,onPressOut:Y,android_ripple:{color:E.colors["surface-pressed"],borderless:!1},accessibilityRole:I??(G?"button":void 0),accessibilityLabel:B,accessibilityHint:P,testID:W,onLayout:ue.onLayout,style:[fe,L,M,Re],...U,...K.hostProps,children:qe})})}else ke=(0,_jsxRuntime.jsx)(_reactNative.View,{ref:t,accessibilityLabel:B,accessibilityHint:P,accessibilityRole:I,testID:W,onLayout:ue.onLayout,style:[fe,L,M,Re],...U,children:qe});return N?(0,_jsxRuntime.jsx)(CardSkeleton,{...e}):K.enabled?(0,_jsxRuntime.jsxs)(_jsxRuntime.Fragment,{children:[ke,K.renderSurface((0,_jsxRuntime.jsx)(_reactNative.View,{style:[fe,L,M,Re,Z.preview],children:qe}))]}):ke}));Card.displayName="Card";const CardSkeleton=({variant:e="elevated",elevation:t,radius:i="lg",padding:s="md",bg:r,header:n,footer:a,imageSource:o,imageHeight:l=160,imageAspectRatio:c,borderRadius:d,containerStyle:u,headerStyle:h,bodyStyle:x,footerStyle:m,style:_,...p})=>{const b=(0,_index.useTheme)(),g=paddingMap[s],y=b.space[g],j="flat"===e?b.radius.none:d??b.radius[i],v=void 0!==n||hasBuiltInHeaderContent(p),R=resolveBackground(b,r)??b.colors.surface,f="outlined"===e?1:0,S="outlined"===e?b.colors.border:void 0;return(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[{backgroundColor:R,borderRadius:j,..._corners.smoothCorners,borderWidth:f,borderColor:S,overflow:"hidden"},u,_],accessibilityRole:"progressbar",accessibilityLabel:"Loading",accessibilityState:{busy:!0},"aria-busy":!0,children:[void 0!==o?(0,_jsxRuntime.jsx)(_index2.Skeleton,{width:"100%",height:c?void 0:l,style:c?{aspectRatio:c,width:"100%"}:void 0}):null,v?(0,_jsxRuntime.jsx)(_reactNative.View,{style:[{padding:y,paddingBottom:b.space.sm},h],children:(0,_jsxRuntime.jsx)(_index2.Skeleton,{shape:"text",width:"60%",height:18})}):null,(0,_jsxRuntime.jsx)(_reactNative.View,{style:[{padding:y},x],children:(0,_jsxRuntime.jsx)(_index2.SkeletonText,{lines:3,fontSize:b.text.base.size,lastLineWidth:"55%"})}),void 0!==a?(0,_jsxRuntime.jsx)(_reactNative.View,{style:[{padding:y,paddingTop:b.space.sm,flexDirection:"row"},m],children:(0,_jsxRuntime.jsx)(_index2.Skeleton,{width:88,height:32,shape:"rounded"})}):null]})};CardSkeleton.displayName="CardSkeleton",Card.Skeleton=CardSkeleton;const hasBuiltInHeaderContent=e=>Boolean(e.title||e.lead||e.action||e.headerActions||e.collapsible||e.onRemove),isCardTextAction=e=>"object"==typeof e&&null!==e&&!_react.default.isValidElement(e)&&"label"in e&&"onPress"in e,HIT_TARGET=44,CardIconAction=({icon:e,label:t,onPress:i,expanded:s,color:r,haptic:n})=>{const a=(0,_index.useTheme)();return(0,_jsxRuntime.jsx)(_reactNative.Pressable,{accessibilityRole:"button",accessibilityLabel:t,accessibilityState:void 0===s?void 0:{expanded:s},"aria-expanded":s,onPress:()=>{n&&(0,_hapticUtils.triggerHaptic)(n),i()},style:iconActionStyle,children:(0,_jsxRuntime.jsx)(_AppIcon.AppIcon,{name:e,size:20,color:r??a.colors["text-body"]})})},CardTextActionButton=({action:e,haptic:t})=>{const i=(0,_index.useTheme)();return(0,_jsxRuntime.jsx)(_reactNative.Pressable,{accessibilityRole:"button",accessibilityLabel:e.accessibilityLabel??e.label,onPress:()=>{t&&(0,_hapticUtils.triggerHaptic)(t),e.onPress()},style:textActionStyle,children:(0,_jsxRuntime.jsx)(_index3.Text,{variant:"label",weight:"semibold",color:i.colors.primary,children:e.label})})},iconActionStyle={width:44,height:44,alignItems:"center",justifyContent:"center"},textActionStyle={minWidth:44,minHeight:44,alignItems:"center",justifyContent:"center"},titleFaceFor=(e,t)=>"serif"===t?(0,_index.fontFor)(e,"semibold","display"):{fontFamily:void 0,...(0,_index.fontFor)(e,"semibold")},resolveBackground=(e,t)=>{if(null!=t)return BACKGROUND_TOKENS.includes(t)?e.colors[t]:t},buildStyles=e=>_reactNative.StyleSheet.create({header:{marginBottom:e.space.md},headerRow:{flexDirection:"row",alignItems:"center",gap:e.space.sm},headerFolded:{marginBottom:e.space.none},titleColumn:{flex:1},lead:{marginTop:e.space.xs},actionNode:{flexShrink:0},body:{flexShrink:1},footer:{marginTop:e.space.md},imageWrapper:{position:"relative"},imageOverlay:{..._reactNative.StyleSheet.absoluteFill},preview:{margin:e.space.none,marginTop:e.space.none,marginBottom:e.space.none,marginLeft:e.space.none,marginRight:e.space.none,marginStart:e.space.none,marginEnd:e.space.none,marginHorizontal:e.space.none,marginVertical:e.space.none,position:"relative",top:0,left:0,width:"100%",height:"100%"}}),stylesFor=(0,_themeStyles.themeStyles)(buildStyles);var _default=exports.default=Card;
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=exports.Card=void 0;var cache,_react=_interopRequireWildcard(require("react")),_reactNative=require("react-native"),_useControllableState=require("../../hooks/useControllableState.js"),_usePressAnimation=require("../../hooks/usePressAnimation.js"),_index=require("../../theme/index.js"),_corners=require("../../utils/corners.js"),_hapticUtils=require("../../utils/hapticUtils.js"),_mergeRefs=require("../../utils/mergeRefs.js"),_shadows=require("../../utils/shadows.js"),_squircle=require("../../utils/squircle.js"),_themeStyles=require("../../utils/themeStyles.js"),_AppIcon=require("../AppIcon/AppIcon.js"),_useContextMenu=require("../Menu/useContextMenu.js"),_index2=require("../Skeleton/index.js"),_SquircleFill=require("../SquircleFill/SquircleFill.js"),_index3=require("../Text/index.js"),_jsxRuntime=require("react/jsx-runtime");function _interopRequireWildcard(e,t){if(!t&&e&&e.__esModule)return e;var i,s,r=Object.defineProperty,n={__proto__:null,default:e};if(Object(e)!==e)return n;if(cache||"function"!=typeof WeakMap||(cache=new WeakMap),cache){if(cache.has(e))return cache.get(e);cache.set(e,n)}for(s in e)"default"!==s&&{}.hasOwnProperty.call(e,s)&&((i=r&&Object.getOwnPropertyDescriptor(e,s))&&(i.get||i.set)?r(n,s,i):n[s]=e[s]);return n}const BACKGROUND_TOKENS=["bg","bg-subtle","bg-muted","surface","scrim","surface-inverse"],paddingMap={none:"none",sm:"sm",md:"lg",lg:"xl",xl:"2xl"},Card=exports.Card=_react.default.memo((0,_react.forwardRef)((e,t)=>{const{children:i,variant:s="elevated",elevation:r="card",radius:n="lg",padding:a="md",interactive:o=!1,bg:l,header:c,title:d,titleFont:u="sans",lead:h,action:x,headerActions:m,collapsible:_=!1,collapsed:p,defaultCollapsed:b=!1,onCollapsedChange:g,collapsedSummary:y,onRemove:j,removeLabel:v="Remove",separatorHeight:R=_reactNative.StyleSheet.hairlineWidth,footer:f,imageSource:S,imageHeight:C=160,imageAspectRatio:w,imageOverlay:q,loading:A=!1,gradient:N,onPress:k,haptic:F,contextMenu:T,accessibilityLabel:B,accessibilityHint:P,accessibilityRole:I,style:L,containerStyle:V,headerStyle:H,bodyStyle:M,footerStyle:z,borderRadius:O,testID:W,onLayout:D,...U}=e,E=(0,_index.useTheme)(),G=o||"function"==typeof k,K=(0,_useContextMenu.useContextMenu)(T,{haptic:F||!1,testID:W,accessibilityActions:U.accessibilityActions,onAccessibilityAction:U.onAccessibilityAction}),$=(0,_react.useMemo)(()=>(0,_mergeRefs.mergeRefs)(t,K.hostRef),[t,K.hostRef]),J=G||K.enabled,{style:Q,pressIn:X,pressOut:Y}=(0,_usePressAnimation.usePressAnimation)({enabled:J}),Z=stylesFor(E),ee=Boolean(S),te=E.space[paddingMap[a]],ie=(0,_react.useMemo)(()=>N?"string"==typeof N?E.settings.gradients[N]??null:N:null,[N,E.settings.gradients]),se="flat"===s,re=se?E.radius.none:O??E.radius[n],ne=resolveBackground(E,l),[ae,oe]=(0,_useControllableState.useControllableState)({value:p,defaultValue:b,onChange:g}),le=_&&ae,ce=hasBuiltInHeaderContent(e),de=Boolean(c)||ce,ue=(0,_SquircleFill.useSquircle)(!ee&&!ie&&!se,re,D),he=_reactNative.StyleSheet.flatten([L,V])??{},xe=he.backgroundColor,me=he.borderColor,pe=xe??ne??("filled"===s?E.colors["bg-subtle"]:E.colors.surface),be="outlined"===s?E.size.border:0,ge=me??E.colors.border,ye="none"===r?void 0:E.shadow[r],je="elevated"===s&&(0,_shadows.supportsBoxShadow)()&&ye?(0,_shadows.toBoxShadow)(ye):void 0,ve=ue.active&&"elevated"===s&&!je,Re=ue.active&&!ve?{backgroundColor:"transparent",borderColor:"transparent"}:null,fe=(0,_react.useMemo)(()=>{const e={borderRadius:ve&&ue.size?(0,_squircle.squircleHostRadius)(ue.size.width,ue.size.height,re):re,..._corners.smoothCorners,padding:ee||ue.active?E.space.none:te,overflow:ue.active?"visible":"hidden"};switch(s){case"flat":return{...e,backgroundColor:ne??E.colors.surface,borderBottomWidth:R,borderBottomColor:E.colors.border};case"outlined":return{...e,backgroundColor:ue.active?"transparent":ne??E.colors.surface,borderWidth:E.size.border,borderColor:ue.active?"transparent":E.colors.border};case"filled":return{...e,backgroundColor:ue.active?"transparent":ne??E.colors["bg-subtle"]};default:return{...e,backgroundColor:ne??E.colors.surface,...je?{boxShadow:je}:ye}}},[E,s,ye,re,ee,te,ue.active,ue.size,je,ve,ne,R]),Se=(0,_react.useMemo)(()=>({..."number"==typeof w?{width:"100%",aspectRatio:w}:{width:"100%",height:C},borderTopLeftRadius:re,borderTopRightRadius:re,borderBottomLeftRadius:E.radius.none,borderBottomRightRadius:E.radius.none,..._corners.smoothCorners}),[E,re,w,C]),Ce="string"==typeof d?d:"",we=(0,_jsxRuntime.jsxs)(_jsxRuntime.Fragment,{children:[(0,_jsxRuntime.jsxs)(_reactNative.View,{style:Z.titleColumn,children:["string"==typeof d?(0,_jsxRuntime.jsx)(_index3.Text,{variant:"title",accessibilityRole:"header",style:titleFaceFor(E,u),children:d}):d,h?(0,_jsxRuntime.jsx)(_index3.Text,{variant:"bodySmall",style:Z.lead,children:h}):null,le&&y?(0,_jsxRuntime.jsx)(_index3.Text,{variant:"caption",style:Z.lead,children:y}):null]}),isCardTextAction(x)?(0,_jsxRuntime.jsx)(CardTextActionButton,{action:x,haptic:F}):x?(0,_jsxRuntime.jsx)(_reactNative.View,{style:Z.actionNode,children:x}):null,m,_?(0,_jsxRuntime.jsx)(CardIconAction,{icon:le?"chevron-down":"chevron-up",label:`${le?"Show":"Hide"} ${Ce}`.trim(),expanded:!le,onPress:()=>oe(!le),haptic:F}):null,j?(0,_jsxRuntime.jsx)(CardIconAction,{icon:"trash",label:v,onPress:j,color:E.colors["danger-text"],haptic:F}):null]}),qe=(0,_jsxRuntime.jsxs)(_jsxRuntime.Fragment,{children:[de?(0,_jsxRuntime.jsx)(_reactNative.View,{style:[Z.header,!c&&Z.headerRow,le&&Z.headerFolded,H],children:c??we}):null,le?null:(0,_jsxRuntime.jsx)(_reactNative.View,{style:[de||f?Z.body:null,M],children:i}),f&&!le?(0,_jsxRuntime.jsx)(_reactNative.View,{style:[Z.footer,z],children:f}):null]}),Ae=ee?(0,_jsxRuntime.jsxs)(_jsxRuntime.Fragment,{children:[(0,_jsxRuntime.jsxs)(_reactNative.View,{style:Z.imageWrapper,children:[(0,_jsxRuntime.jsx)(_reactNative.Image,{source:S,resizeMode:"cover",style:Se,accessibilityLabel:"",accessible:!1}),q?(0,_jsxRuntime.jsx)(_reactNative.View,{pointerEvents:"box-none",style:Z.imageOverlay,children:q}):null]}),(0,_jsxRuntime.jsx)(_reactNative.View,{style:{padding:te},children:qe})]}):qe,Ne=ie?(0,_jsxRuntime.jsxs)(_jsxRuntime.Fragment,{children:[(0,_jsxRuntime.jsx)(_index.Gradient,{gradient:ie,style:_reactNative.StyleSheet.absoluteFill}),Ae]}):ue.active&&ue.size?(0,_jsxRuntime.jsxs)(_jsxRuntime.Fragment,{children:[(0,_jsxRuntime.jsx)(_SquircleFill.SquircleFill,{width:ue.size.width,height:ue.size.height,radius:re,fill:pe,stroke:be?ge:void 0,strokeWidth:be,outset:be}),(0,_jsxRuntime.jsx)(_reactNative.View,{style:[Z.squircleClip,{padding:te,borderRadius:ue.size?(0,_squircle.squircleHostRadius)(ue.size.width,ue.size.height,re):re}],children:Ae})]}):Ae;let ke;if(J){const handlePress=e=>{G&&(F&&(0,_hapticUtils.triggerHaptic)(F),k?.(e))};ke=(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{style:Q,children:(0,_jsxRuntime.jsx)(_reactNative.Pressable,{ref:$,onPress:handlePress,onPressIn:X,onPressOut:Y,accessibilityRole:I??(G?"button":void 0),accessibilityLabel:B,accessibilityHint:P,testID:W,onLayout:ue.onLayout,style:[fe,L,V,Re],...U,...K.hostProps,children:Ne})})}else ke=(0,_jsxRuntime.jsx)(_reactNative.View,{ref:t,accessibilityLabel:B,accessibilityHint:P,accessibilityRole:I,testID:W,onLayout:ue.onLayout,style:[fe,L,V,Re],...U,children:Ne});return A?(0,_jsxRuntime.jsx)(CardSkeleton,{...e}):K.enabled?(0,_jsxRuntime.jsxs)(_jsxRuntime.Fragment,{children:[ke,K.renderSurface((0,_jsxRuntime.jsx)(_reactNative.View,{style:[fe,L,V,Re,Z.preview],children:Ne}))]}):ke}));Card.displayName="Card";const CardSkeleton=({variant:e="elevated",elevation:t,radius:i="lg",padding:s="md",bg:r,header:n,footer:a,imageSource:o,imageHeight:l=160,imageAspectRatio:c,borderRadius:d,containerStyle:u,headerStyle:h,bodyStyle:x,footerStyle:m,style:_,...p})=>{const b=(0,_index.useTheme)(),g=paddingMap[s],y=b.space[g],j="flat"===e?b.radius.none:d??b.radius[i],v=void 0!==n||hasBuiltInHeaderContent(p),R=resolveBackground(b,r)??b.colors.surface,f="outlined"===e?1:0,S="outlined"===e?b.colors.border:void 0;return(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[{backgroundColor:R,borderRadius:j,..._corners.smoothCorners,borderWidth:f,borderColor:S,overflow:"hidden"},u,_],accessibilityRole:"progressbar",accessibilityLabel:"Loading",accessibilityState:{busy:!0},"aria-busy":!0,children:[void 0!==o?(0,_jsxRuntime.jsx)(_index2.Skeleton,{width:"100%",height:c?void 0:l,style:c?{aspectRatio:c,width:"100%"}:void 0}):null,v?(0,_jsxRuntime.jsx)(_reactNative.View,{style:[{padding:y,paddingBottom:b.space.sm},h],children:(0,_jsxRuntime.jsx)(_index2.Skeleton,{shape:"text",width:"60%",height:18})}):null,(0,_jsxRuntime.jsx)(_reactNative.View,{style:[{padding:y},x],children:(0,_jsxRuntime.jsx)(_index2.SkeletonText,{lines:3,fontSize:b.text.base.size,lastLineWidth:"55%"})}),void 0!==a?(0,_jsxRuntime.jsx)(_reactNative.View,{style:[{padding:y,paddingTop:b.space.sm,flexDirection:"row"},m],children:(0,_jsxRuntime.jsx)(_index2.Skeleton,{width:88,height:32,shape:"rounded"})}):null]})};CardSkeleton.displayName="CardSkeleton",Card.Skeleton=CardSkeleton;const hasBuiltInHeaderContent=e=>Boolean(e.title||e.lead||e.action||e.headerActions||e.collapsible||e.onRemove),isCardTextAction=e=>"object"==typeof e&&null!==e&&!_react.default.isValidElement(e)&&"label"in e&&"onPress"in e,HIT_TARGET=44,CardIconAction=({icon:e,label:t,onPress:i,expanded:s,color:r,haptic:n})=>{const a=(0,_index.useTheme)();return(0,_jsxRuntime.jsx)(_reactNative.Pressable,{accessibilityRole:"button",accessibilityLabel:t,accessibilityState:void 0===s?void 0:{expanded:s},"aria-expanded":s,onPress:()=>{n&&(0,_hapticUtils.triggerHaptic)(n),i()},style:iconActionStyle,children:(0,_jsxRuntime.jsx)(_AppIcon.AppIcon,{name:e,size:20,color:r??a.colors["text-body"]})})},CardTextActionButton=({action:e,haptic:t})=>{const i=(0,_index.useTheme)();return(0,_jsxRuntime.jsx)(_reactNative.Pressable,{accessibilityRole:"button",accessibilityLabel:e.accessibilityLabel??e.label,onPress:()=>{t&&(0,_hapticUtils.triggerHaptic)(t),e.onPress()},style:textActionStyle,children:(0,_jsxRuntime.jsx)(_index3.Text,{variant:"label",weight:"semibold",color:i.colors.primary,children:e.label})})},iconActionStyle={width:44,height:44,alignItems:"center",justifyContent:"center"},textActionStyle={minWidth:44,minHeight:44,alignItems:"center",justifyContent:"center"},titleFaceFor=(e,t)=>"serif"===t?(0,_index.fontFor)(e,"semibold","display"):{fontFamily:void 0,...(0,_index.fontFor)(e,"semibold")},resolveBackground=(e,t)=>{if(null!=t)return BACKGROUND_TOKENS.includes(t)?e.colors[t]:t},buildStyles=e=>_reactNative.StyleSheet.create({header:{marginBottom:e.space.md},headerRow:{flexDirection:"row",alignItems:"center",gap:e.space.sm},headerFolded:{marginBottom:e.space.none},titleColumn:{flex:1},lead:{marginTop:e.space.xs},actionNode:{flexShrink:0},body:{flexShrink:1},footer:{marginTop:e.space.md},imageWrapper:{position:"relative"},imageOverlay:{..._reactNative.StyleSheet.absoluteFill},squircleClip:{flexGrow:1,overflow:"hidden",..._corners.smoothCorners},preview:{margin:e.space.none,marginTop:e.space.none,marginBottom:e.space.none,marginLeft:e.space.none,marginRight:e.space.none,marginStart:e.space.none,marginEnd:e.space.none,marginHorizontal:e.space.none,marginVertical:e.space.none,position:"relative",top:0,left:0,width:"100%",height:"100%"}}),stylesFor=(0,_themeStyles.themeStyles)(buildStyles);var _default=exports.default=Card;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.resolveVariantColors=exports.resolveFieldTextStyle=exports.pickRepresentativeBorderColor=exports.hasFieldText=exports.fieldTextAsString=exports.default=exports.RequiredPlaceholder=exports.RequiredMark=exports.FieldMessage=exports.FieldLabel=exports.FieldErrorGlyph=exports.FieldBase=void 0;var _react=require("react"),_reactNative=require("react-native"),_index=require("../../theme/index.js"),_ariaState=require("../../utils/ariaState.js"),_corners=require("../../utils/corners.js"),_defaultIcons=require("../AppIcon/defaultIcons.js"),_Notation=require("../Notation/Notation.js"),_SquircleFill=require("../SquircleFill/SquircleFill.js"),_jsxRuntime=require("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},pickRepresentativeBorderColor=e=>{for(const t of["bottom","top","left","right"]){const r=e[t];if(r&&"transparent"!==r)return r}return e.bottom};exports.pickRepresentativeBorderColor=pickRepresentativeBorderColor;const resolveFieldTextStyle=(e,t={})=>{const{disabled:r=!1}=t;return{color:r?e.colors["field-text-disabled"]:e.colors["field-text"],placeholderColor:r?e.colors["field-placeholder-disabled"]:e.colors["field-placeholder"],weightStyle:(0,_index.fontFor)(e,"normal")}};exports.resolveFieldTextStyle=resolveFieldTextStyle;const RequiredMark=()=>{const e=(0,_index.useTheme)();return(0,_jsxRuntime.jsx)(_reactNative.Text,{style:{color:e.colors["danger-text"]},children:` ${e.settings.components.field?.requiredMarker??"*"}`})};exports.RequiredMark=RequiredMark;const RequiredPlaceholder=({text:e,color:t,fontSize:r,weightStyle:o,align:i="center",paddingTop:l,textAlign:s})=>(0,_jsxRuntime.jsx)(_reactNative.View,{pointerEvents:"none",style:[_reactNative.StyleSheet.absoluteFill,{justifyContent:"top"===i?"flex-start":"center",paddingTop:l}],children:(0,_jsxRuntime.jsxs)(_reactNative.Text,{accessible:!1,numberOfLines:1,style:{color:t,fontSize:r,...o,includeFontPadding:!1,textAlign:s},children:[e,(0,_jsxRuntime.jsx)(RequiredMark,{})]})});exports.RequiredPlaceholder=RequiredPlaceholder;const FieldErrorGlyph=({size:e,color:t})=>{const r=(0,_index.useTheme)().settings.icons.error??_defaultIcons.defaultIcons.error;return(0,_jsxRuntime.jsx)(_jsxRuntime.Fragment,{children:r({size:e,color:t})})};exports.FieldErrorGlyph=FieldErrorGlyph;const hasFieldText=e=>null!=e&&!1!==e&&!0!==e&&""!==e;exports.hasFieldText=hasFieldText;const fieldTextAsString=e=>"string"==typeof e?e:void 0;exports.fieldTextAsString=fieldTextAsString;const FieldLabel=({children:e,size:t="md",required:r=!1,help:o,color:i,style:l})=>{const s=(0,_index.useTheme)(),n=(0,_index.resolveFieldSize)(s,t),a=hasFieldText(o),d=(0,_Notation.useNotationInk)(l,n["label-text"],i??s.colors["field-label"]),c=(0,_jsxRuntime.jsxs)(_reactNative.Text,{style:[familyStyles.label,{color:i??s.colors["field-label"],fontSize:n["label-text"],...(0,_index.fontFor)(s,"semibold"),marginBottom:a?s.space.none:n["label-gap"]},a?familyStyles.labelShrink:null,l],children:[(0,_jsxRuntime.jsx)(_Notation.NotationInkContext.Provider,{value:d,children:e}),r?(0,_jsxRuntime.jsx)(RequiredMark,{}):null]});return a?(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[familyStyles.labelRow,{marginBottom:n["label-gap"]}],children:[c,(0,_jsxRuntime.jsx)(_reactNative.View,{style:[familyStyles.help,{marginLeft:s.space.xs}],children:o})]}):c};exports.FieldLabel=FieldLabel;const FieldMessage=({text:e,error:t=!1,size:r="md",style:o})=>{const i=(0,_index.useTheme)(),l=(0,_index.resolveFieldSize)(i,r),s=t?i.colors["field-message"]:i.colors["text-muted"],n=(0,_Notation.useNotationInk)(o,l["message-text"],s);return hasFieldText(e)?(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[familyStyles.messageRow,{marginTop:l["message-gap"],columnGap:i.space.xs}],accessibilityLiveRegion:t?"polite":"none",children:[t?(0,_jsxRuntime.jsx)(FieldErrorGlyph,{size:l["message-text"],color:s}):null,(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[familyStyles.messageText,{color:s,fontSize:l["message-text"],...(0,_index.fontFor)(i,"normal")},o],children:(0,_jsxRuntime.jsx)(_Notation.NotationInkContext.Provider,{value:n,children:e})})]}):null};exports.FieldMessage=FieldMessage;const familyStyles=_reactNative.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}}),resolveVariantColors=(e,t)=>{let r,o,i,l,s;"outlined"===t?(r=e.colors["field-bg"],o=e.colors["field-bg-focus"],i=e.colors["field-bg-disabled"],l=e.colors["field-border"],s=e.size.border):"underline"===t?(r="transparent",o=void 0,i="transparent",l={bottom:e.colors["field-border"]},s={bottom:e.size.border}):(r=e.colors["field-bg"],o=void 0,i=e.colors["field-bg-disabled"],l="transparent",s=0);const wrapToIdleShape=e=>"string"==typeof l?e:{bottom:e},n=expandColorSides(l),a=expandColorSides(wrapToIdleShape(e.colors["field-border-focus"]));return{backgroundIdleEmpty:r,backgroundIdleFilled:r,backgroundFocused:o,backgroundError:void 0,backgroundDisabled:i,borderIdle:n,borderFocused:a,borderError:expandColorSides(wrapToIdleShape(e.colors["field-border-error"])),borderDisabled:expandColorSides(l),borderWidth:expandWidthSides(s),borderFocusedRepresentative:pickRepresentativeBorderColor(a)}};exports.resolveVariantColors=resolveVariantColors;const FieldBase=e=>{const{size:t="md",variant:r,focused:o=!1,disabled:i=!1,error:l=!1,filled:s=!1,leading:n,leadingDivider:a=!1,trailing:d,slotAlign:c="center",slotLineHeight:u,topNotch:b,children:p,onPress:x,pressFeedback:g=!0,minHeight:m,maxHeight:h,width:f,height:_,paddingHorizontal:R,paddingLeft:y,paddingRight:v,paddingVertical:j,borderRadius:S,borderTopLeftRadius:F,borderTopRightRadius:C,borderBottomLeftRadius:T,borderBottomRightRadius:k,borderWidth:N,borderTopWidth:q,borderRightWidth:w,borderBottomWidth:I,borderLeftWidth:L,gap:B,style:V,testID:z,accessibilityRole:M,accessibilityLabel:E,accessibilityState:W,accessibilityHint:D}=e,P=(0,_index.useTheme)(),A=(0,_react.useMemo)(()=>buildStyles(),[]),H=r??P.settings.components.field?.defaultVariant??"outlined",G=(0,_index.resolveFieldSize)(P,t),O=(0,_react.useMemo)(()=>resolveVariantColors(P,H),[P,H]),$=l?2:o?1:0,J=(0,_react.useRef)((0,_index.createAnimatedValue)($)).current;(0,_react.useEffect)(()=>{const e=_reactNative.Animated.timing(J,{toValue:$,duration:P.motion.duration.fast,easing:_reactNative.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,re={top:q,right:w,bottom:I,left:L},oe={top:re.top??N??O.borderWidth.top,right:re.right??N??O.borderWidth.right,bottom:re.bottom??N??O.borderWidth.bottom,left:re.left??N??O.borderWidth.left},ie={minHeight:_??m??G["min-height"],maxHeight:h,paddingHorizontal:R??G["padding-x"],paddingVertical:j??G["padding-y"],paddingLeft:y??R??G["padding-x"],paddingRight:v??R??G["padding-x"],backgroundColor:Y,columnGap:B??P.space.md,alignItems:"top"===c?"flex-start":"center"},le="underline"===H,se=le?P.radius.none:S??G.radius,ne=le?{tl:P.radius.none,tr:P.radius.none,bl:P.radius.none,br:P.radius.none}:{tl:F??se,tr:C??se,bl:T??se,br:k??se};ie.borderTopLeftRadius=ne.tl,ie.borderTopRightRadius=ne.tr,ie.borderBottomLeftRadius=ne.bl,ie.borderBottomRightRadius=ne.br,ie.borderCurve=_corners.smoothCorners.borderCurve,ie.borderTopWidth=oe.top,ie.borderRightWidth=oe.right,ie.borderBottomWidth=oe.bottom,ie.borderLeftWidth=oe.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,ae=!le&&ne.tl===ne.tr&&ne.tl===ne.bl&&ne.tl===ne.br&&sameOnEverySide(oe)&&sameOnEverySide(Z)&&sameOnEverySide(ee)&&sameOnEverySide(te)&&sameOnEverySide(O.borderDisabled),de=(0,_SquircleFill.useSquircle)(ae,ne.tl);if(de.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"),ue=(0,_react.useRef)($);ue.current=$,(0,_react.useEffect)(()=>{J.setValue(ue.current)},[O,J]),void 0!==f&&(ie.width=f),void 0!==_&&(ie.height=_);const be={disabled:i,...W},pe="top"===c,xe=pe?{alignSelf:"flex-start",marginTop:Math.max(0,((u??G.icon)-G.icon)/2)}:null,ge=_??m??G["min-height"],me=(()=>{if(!b)return 0;const e=Math.min(ne.tl,ge/2),t=b.left;return e<=0||t>=e?0:Math.ceil(e-Math.sqrt(e*e-(e-t)*(e-t)))})(),he=b&&oe.top>0?(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{pointerEvents:"none",style:{position:"absolute",top:-oe.top,left:b.left-oe.left,width:b.width,height:oe.top+me,backgroundColor:Y}}):null,renderInner=e=>(0,_jsxRuntime.jsxs)(_jsxRuntime.Fragment,{children:[de.active&&de.size?(0,_jsxRuntime.jsx)(_SquircleFill.SquircleFill,{width:de.size.width,height:de.size.height,radius:ne.tl,fill:e&&!i?P.colors["surface-pressed"]:Y,stroke:ce,strokeWidth:oe.top,outset:oe.top}):null,he,null!=n?(0,_jsxRuntime.jsx)(_reactNative.View,{style:[A.slot,xe],children:n}):null,null!=n&&a?(0,_jsxRuntime.jsx)(_reactNative.View,{pointerEvents:"none",style:[A.divider,xe,{height:G.icon,backgroundColor:P.colors["field-border"]}]}):null,(0,_jsxRuntime.jsx)(_reactNative.View,{style:[A.content,pe?A.contentTop:null],children:p}),null!=d?(0,_jsxRuntime.jsx)(_reactNative.View,{style:[A.slot,xe],children:d}):null]}),fe=(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{onLayout:de.onLayout,style:[A.box,ie,V],accessibilityRole:M,accessibilityLabel:E,accessibilityHint:D,accessibilityState:be,...(0,_ariaState.ariaFromState)(be),testID:z,children:renderInner(!1)});return x&&!g?(0,_jsxRuntime.jsx)(_reactNative.Pressable,{onPress:x,disabled:i,accessible:!1,children:fe}):x?(0,_jsxRuntime.jsx)(_reactNative.Pressable,{onPress:x,disabled:i,accessibilityRole:M??"button",accessibilityLabel:E,accessibilityHint:D,accessibilityState:be,...(0,_ariaState.ariaFromState)(be),testID:z,children:({pressed:e})=>(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{onLayout:de.onLayout,style:[A.box,ie,!e||i||de.active?null:{backgroundColor:P.colors["surface-pressed"]},V],children:renderInner(e)})}):fe};exports.FieldBase=FieldBase,FieldBase.displayName="FieldBase";const buildStyles=()=>_reactNative.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"}});var _default=exports.default=FieldBase;
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.resolveVariantColors=exports.resolveFieldTextStyle=exports.pickRepresentativeBorderColor=exports.hasFieldText=exports.fieldTextAsString=exports.default=exports.RequiredPlaceholder=exports.RequiredMark=exports.FieldMessage=exports.FieldLabel=exports.FieldErrorGlyph=exports.FieldBase=void 0;var _react=require("react"),_reactNative=require("react-native"),_index=require("../../theme/index.js"),_ariaState=require("../../utils/ariaState.js"),_corners=require("../../utils/corners.js"),_defaultIcons=require("../AppIcon/defaultIcons.js"),_Notation=require("../Notation/Notation.js"),_SquircleFill=require("../SquircleFill/SquircleFill.js"),_jsxRuntime=require("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},pickRepresentativeBorderColor=e=>{for(const t of["bottom","top","left","right"]){const r=e[t];if(r&&"transparent"!==r)return r}return e.bottom};exports.pickRepresentativeBorderColor=pickRepresentativeBorderColor;const resolveFieldTextStyle=(e,t={})=>{const{disabled:r=!1}=t;return{color:r?e.colors["field-text-disabled"]:e.colors["field-text"],placeholderColor:r?e.colors["field-placeholder-disabled"]:e.colors["field-placeholder"],weightStyle:(0,_index.fontFor)(e,"normal")}};exports.resolveFieldTextStyle=resolveFieldTextStyle;const RequiredMark=()=>{const e=(0,_index.useTheme)();return(0,_jsxRuntime.jsx)(_reactNative.Text,{style:{color:e.colors["danger-text"]},children:` ${e.settings.components.field?.requiredMarker??"*"}`})};exports.RequiredMark=RequiredMark;const RequiredPlaceholder=({text:e,color:t,fontSize:r,weightStyle:o,align:i="center",paddingTop:l,textAlign:s})=>(0,_jsxRuntime.jsx)(_reactNative.View,{pointerEvents:"none",style:[_reactNative.StyleSheet.absoluteFill,{justifyContent:"top"===i?"flex-start":"center",paddingTop:l}],children:(0,_jsxRuntime.jsxs)(_reactNative.Text,{accessible:!1,numberOfLines:1,style:{color:t,fontSize:r,...o,includeFontPadding:!1,textAlign:s},children:[e,(0,_jsxRuntime.jsx)(RequiredMark,{})]})});exports.RequiredPlaceholder=RequiredPlaceholder;const FieldErrorGlyph=({size:e,color:t})=>{const r=(0,_index.useTheme)().settings.icons.error??_defaultIcons.defaultIcons.error;return(0,_jsxRuntime.jsx)(_jsxRuntime.Fragment,{children:r({size:e,color:t})})};exports.FieldErrorGlyph=FieldErrorGlyph;const hasFieldText=e=>null!=e&&!1!==e&&!0!==e&&""!==e;exports.hasFieldText=hasFieldText;const fieldTextAsString=e=>"string"==typeof e?e:void 0;exports.fieldTextAsString=fieldTextAsString;const FieldLabel=({children:e,size:t="md",required:r=!1,help:o,color:i,style:l})=>{const s=(0,_index.useTheme)(),n=(0,_index.resolveFieldSize)(s,t),a=hasFieldText(o),d=(0,_Notation.useNotationInk)(l,n["label-text"],i??s.colors["field-label"]),c=(0,_jsxRuntime.jsxs)(_reactNative.Text,{style:[familyStyles.label,{color:i??s.colors["field-label"],fontSize:n["label-text"],...(0,_index.fontFor)(s,"semibold"),marginBottom:a?s.space.none:n["label-gap"]},a?familyStyles.labelShrink:null,l],children:[(0,_jsxRuntime.jsx)(_Notation.NotationInkContext.Provider,{value:d,children:e}),r?(0,_jsxRuntime.jsx)(RequiredMark,{}):null]});return a?(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[familyStyles.labelRow,{marginBottom:n["label-gap"]}],children:[c,(0,_jsxRuntime.jsx)(_reactNative.View,{style:[familyStyles.help,{marginLeft:s.space.xs}],children:o})]}):c};exports.FieldLabel=FieldLabel;const FieldMessage=({text:e,error:t=!1,size:r="md",style:o})=>{const i=(0,_index.useTheme)(),l=(0,_index.resolveFieldSize)(i,r),s=t?i.colors["field-message"]:i.colors["text-muted"],n=(0,_Notation.useNotationInk)(o,l["message-text"],s);return hasFieldText(e)?(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[familyStyles.messageRow,{marginTop:l["message-gap"],columnGap:i.space.xs}],accessibilityLiveRegion:t?"polite":"none",children:[t?(0,_jsxRuntime.jsx)(FieldErrorGlyph,{size:l["message-text"],color:s}):null,(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[familyStyles.messageText,{color:s,fontSize:l["message-text"],...(0,_index.fontFor)(i,"normal")},o],children:(0,_jsxRuntime.jsx)(_Notation.NotationInkContext.Provider,{value:n,children:e})})]}):null};exports.FieldMessage=FieldMessage;const familyStyles=_reactNative.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}}),resolveVariantColors=(e,t)=>{let r,o,i,l,s;"outlined"===t?(r=e.colors["field-bg"],o=e.colors["field-bg-focus"],i=e.colors["field-bg-disabled"],l=e.colors["field-border"],s=e.size.border):"underline"===t?(r="transparent",o=void 0,i="transparent",l={bottom:e.colors["field-border"]},s={bottom:e.size.border}):(r=e.colors["field-bg"],o=void 0,i=e.colors["field-bg-disabled"],l="transparent",s=0);const wrapToIdleShape=e=>"string"==typeof l?e:{bottom:e},n=expandColorSides(l),a=expandColorSides(wrapToIdleShape(e.colors["field-border-focus"]));return{backgroundIdleEmpty:r,backgroundIdleFilled:r,backgroundFocused:o,backgroundError:void 0,backgroundDisabled:i,borderIdle:n,borderFocused:a,borderError:expandColorSides(wrapToIdleShape(e.colors["field-border-error"])),borderDisabled:expandColorSides(l),borderWidth:expandWidthSides(s),borderFocusedRepresentative:pickRepresentativeBorderColor(a)}};exports.resolveVariantColors=resolveVariantColors;const FieldBase=e=>{const{size:t="md",variant:r,focused:o=!1,disabled:i=!1,error:l=!1,filled:s=!1,leading:n,leadingDivider:a=!1,trailing:d,slotAlign:c="center",slotLineHeight:u,topNotch:b,children:p,onPress:x,pressFeedback:g=!0,minHeight:m,maxHeight:h,width:f,height:_,paddingHorizontal:R,paddingLeft:y,paddingRight:v,paddingVertical:j,borderRadius:S,borderTopLeftRadius:F,borderTopRightRadius:C,borderBottomLeftRadius:T,borderBottomRightRadius:k,borderWidth:N,borderTopWidth:q,borderRightWidth:w,borderBottomWidth:I,borderLeftWidth:L,gap:B,style:V,testID:z,accessibilityRole:M,accessibilityLabel:E,accessibilityState:W,accessibilityHint:D}=e,P=(0,_index.useTheme)(),A=(0,_react.useMemo)(()=>buildStyles(),[]),H=r??P.settings.components.field?.defaultVariant??"outlined",G=(0,_index.resolveFieldSize)(P,t),O=(0,_react.useMemo)(()=>resolveVariantColors(P,H),[P,H]),$=l?2:o?1:0,J=(0,_react.useRef)((0,_index.createAnimatedValue)($)).current;(0,_react.useEffect)(()=>{const e=_reactNative.Animated.timing(J,{toValue:$,duration:P.motion.duration.fast,easing:_reactNative.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,re={top:q,right:w,bottom:I,left:L},oe={top:re.top??N??O.borderWidth.top,right:re.right??N??O.borderWidth.right,bottom:re.bottom??N??O.borderWidth.bottom,left:re.left??N??O.borderWidth.left},ie={minHeight:_??m??G["min-height"],maxHeight:h,paddingHorizontal:R??G["padding-x"],paddingVertical:j??G["padding-y"],paddingLeft:y??R??G["padding-x"],paddingRight:v??R??G["padding-x"],backgroundColor:Y,columnGap:B??P.space.md,alignItems:"top"===c?"flex-start":"center"},le="underline"===H,se=le?P.radius.none:S??G.radius,ne=le?{tl:P.radius.none,tr:P.radius.none,bl:P.radius.none,br:P.radius.none}:{tl:F??se,tr:C??se,bl:T??se,br:k??se};ie.borderTopLeftRadius=ne.tl,ie.borderTopRightRadius=ne.tr,ie.borderBottomLeftRadius=ne.bl,ie.borderBottomRightRadius=ne.br,ie.borderCurve=_corners.smoothCorners.borderCurve,ie.borderTopWidth=oe.top,ie.borderRightWidth=oe.right,ie.borderBottomWidth=oe.bottom,ie.borderLeftWidth=oe.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,ae=!le&&ne.tl===ne.tr&&ne.tl===ne.bl&&ne.tl===ne.br&&sameOnEverySide(oe)&&sameOnEverySide(Z)&&sameOnEverySide(ee)&&sameOnEverySide(te)&&sameOnEverySide(O.borderDisabled),de=(0,_SquircleFill.useSquircle)(ae,ne.tl);if(de.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"),ue=(0,_react.useRef)($);ue.current=$,(0,_react.useEffect)(()=>{J.setValue(ue.current)},[O,J]),void 0!==f&&(ie.width=f),void 0!==_&&(ie.height=_);const be={disabled:i,...W},pe="top"===c,xe=pe?{alignSelf:"flex-start",marginTop:Math.max(0,((u??G.icon)-G.icon)/2)}:null,ge=_??m??G["min-height"],me=(()=>{if(!b)return 0;const e=Math.min(ne.tl,ge/2),t=b.left;return e<=0||t>=e?0:Math.ceil(e-Math.sqrt(e*e-(e-t)*(e-t)))})(),he=b&&oe.top>0?(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{pointerEvents:"none",style:{position:"absolute",top:-oe.top,left:b.left-oe.left,width:b.width,height:oe.top+me,backgroundColor:Y}}):null,renderInner=e=>(0,_jsxRuntime.jsxs)(_jsxRuntime.Fragment,{children:[de.active&&de.size?(0,_jsxRuntime.jsx)(_SquircleFill.SquircleFill,{width:de.size.width,height:de.size.height,radius:ne.tl,fill:e&&!i?P.colors["surface-pressed"]:Y,stroke:ce,strokeWidth:oe.top,outset:oe.top}):null,he,null!=n?(0,_jsxRuntime.jsx)(_reactNative.View,{style:[A.slot,xe],children:n}):null,null!=n&&a?(0,_jsxRuntime.jsx)(_reactNative.View,{pointerEvents:"none",style:[A.divider,xe,{height:G.icon,backgroundColor:P.colors["field-border"]}]}):null,(0,_jsxRuntime.jsx)(_reactNative.View,{style:[A.content,pe?A.contentTop:null],children:p}),null!=d?(0,_jsxRuntime.jsx)(_reactNative.View,{style:[A.slot,xe],children:d}):null]}),fe=(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{onLayout:de.onLayout,style:[A.box,ie,V],accessibilityRole:M,accessibilityLabel:E,accessibilityHint:D,accessibilityState:be,...(0,_ariaState.ariaFromState)(be),testID:z,children:renderInner(!1)});return x&&!g?(0,_jsxRuntime.jsx)(_reactNative.Pressable,{onPress:x,disabled:i,accessible:!1,children:fe}):x?(0,_jsxRuntime.jsx)(_reactNative.Pressable,{onPress:x,disabled:i,accessibilityRole:M??"button",accessibilityLabel:E,accessibilityHint:D,accessibilityState:be,...(0,_ariaState.ariaFromState)(be),testID:z,children:({pressed:e})=>(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{onLayout:de.onLayout,style:[A.box,ie,!e||i||de.active?null:{backgroundColor:P.colors["surface-pressed"]},V],children:renderInner(e)})}):fe};exports.FieldBase=FieldBase,FieldBase.displayName="FieldBase";const buildStyles=()=>_reactNative.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"}});var _default=exports.default=FieldBase;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=exports.KeyboardAwareScrollView=void 0;var _react=require("react"),_reactNative=require("react-native"),_reactNativeKeyboardController=require("react-native-keyboard-controller"),_reactNativeSafeAreaContext=require("react-native-safe-area-context"),_index=require("../../theme/index.js"),_jsxRuntime=require("react/jsx-runtime");const tapAreaStyle={flexGrow:1},KeyboardAwareScrollView=exports.KeyboardAwareScrollView=(0,_react.forwardRef)((e,r)=>{const{children:t,bottomOffset:o=24,extraKeyboardSpace:a=0,safeAreaEdges:i=["bottom"],refreshing:s=!1,onRefresh:l,dismissOnTapOutside:n=!1,contentContainerStyle:d,refreshControl:c,...u}=e,f=(0,_index.useTheme)(),b=(0,_reactNativeSafeAreaContext.useSafeAreaInsets)(),y=i.includes("bottom"),p={paddingBottom:y?b.bottom:0,...i.includes("top")?{paddingTop:b.top}:null,...i.includes("left")?{paddingLeft:b.left}:null,...i.includes("right")?{paddingRight:b.right}:null},x=c??(l?(0,_jsxRuntime.jsx)(_reactNative.RefreshControl,{refreshing:s,onRefresh:l,tintColor:f.colors.primary,colors:[f.colors.primary],progressBackgroundColor:f.colors.surface,titleColor:f.colors["text-muted"]}):void 0);return(0,_jsxRuntime.jsx)(_reactNativeKeyboardController.KeyboardAwareScrollView,{ref:r,bottomOffset:o,extraKeyboardSpace:a-(y?b.bottom:0),keyboardShouldPersistTaps:"handled",keyboardDismissMode:"none",contentContainerStyle:[d,p],refreshControl:x,...u,children:n?(0,_jsxRuntime.jsx)(_reactNative.Pressable,{accessible:!1,onPress:_reactNative.Keyboard.dismiss,style:tapAreaStyle,children:t}):t})});KeyboardAwareScrollView.displayName="KeyboardAwareScrollView";var _default=exports.default=KeyboardAwareScrollView;
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=exports.KeyboardAwareScrollView=void 0;var _react=require("react"),_reactNative=require("react-native"),_reactNativeKeyboardController=require("react-native-keyboard-controller"),_reactNativeSafeAreaContext=require("react-native-safe-area-context"),_index=require("../../theme/index.js"),_jsxRuntime=require("react/jsx-runtime");const tapAreaStyle={flexGrow:1},KeyboardAwareScrollView=exports.KeyboardAwareScrollView=(0,_react.forwardRef)((e,r)=>{const{children:t,bottomOffset:o=24,extraKeyboardSpace:a=0,safeAreaEdges:i=["bottom"],refreshing:s=!1,onRefresh:l,dismissOnTapOutside:n=!1,contentContainerStyle:d,refreshControl:c,...u}=e,f=(0,_index.useTheme)(),b=(0,_reactNativeSafeAreaContext.useSafeAreaInsets)(),y=i.includes("bottom"),p={paddingBottom:y?b.bottom:0,...i.includes("top")?{paddingTop:b.top}:null,...i.includes("left")?{paddingLeft:b.left}:null,...i.includes("right")?{paddingRight:b.right}:null},x=c??(l?(0,_jsxRuntime.jsx)(_reactNative.RefreshControl,{refreshing:s,onRefresh:l,tintColor:f.colors.primary,colors:[f.colors.primary],progressBackgroundColor:f.colors.surface,titleColor:f.colors["text-muted"]}):void 0);return(0,_jsxRuntime.jsx)(_reactNativeKeyboardController.KeyboardAwareScrollView,{ref:r,bottomOffset:o,extraKeyboardSpace:a-(y?b.bottom:0),disableScrollOnKeyboardHide:!0,keyboardShouldPersistTaps:"handled",keyboardDismissMode:"none",contentContainerStyle:[d,p],refreshControl:x,...u,children:n?(0,_jsxRuntime.jsx)(_reactNative.Pressable,{accessible:!1,onPress:_reactNative.Keyboard.dismiss,style:tapAreaStyle,children:t}):t})});KeyboardAwareScrollView.displayName="KeyboardAwareScrollView";var _default=exports.default=KeyboardAwareScrollView;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=exports.ListItem=void 0;var cache,_react=_interopRequireWildcard(require("react")),_reactNative=require("react-native"),_reactNativeSvg=_interopRequireWildcard(require("react-native-svg")),_useFlickGuard=require("../../hooks/useFlickGuard.js"),_usePressAnimation=require("../../hooks/usePressAnimation.js"),_index=require("../../theme/index.js"),_corners=require("../../utils/corners.js"),_hapticUtils=require("../../utils/hapticUtils.js"),_mergeRefs=require("../../utils/mergeRefs.js"),_themeStyles=require("../../utils/themeStyles.js"),_defaultIcons=require("../AppIcon/defaultIcons.js"),_index2=require("../Button/index.js"),_index3=require("../IconBadge/index.js"),_useContextMenu=require("../Menu/useContextMenu.js"),_index4=require("../Skeleton/index.js"),_index5=require("../Swipeable/index.js"),_jsxRuntime=require("react/jsx-runtime");function _interopRequireWildcard(e,t){if(!t&&e&&e.__esModule)return e;var i,s,r=Object.defineProperty,n={__proto__:null,default:e};if(Object(e)!==e)return n;if(cache||"function"!=typeof WeakMap||(cache=new WeakMap),cache){if(cache.has(e))return cache.get(e);cache.set(e,n)}for(s in e)"default"!==s&&{}.hasOwnProperty.call(e,s)&&((i=r&&Object.getOwnPropertyDescriptor(e,s))&&(i.get||i.set)?r(n,s,i):n[s]=e[s]);return n}const Chevron=({color:e})=>{const t=(0,_index.useTheme)();return(0,_jsxRuntime.jsx)(_jsxRuntime.Fragment,{children:(t.settings.icons.chevronRight??_defaultIcons.defaultIcons.chevronRight)({size:20,color:e})})},BADGE_SIZE={sm:"sm",md:"md",lg:"lg"},RIGHT_BELOW_FONT_SCALE=1.2,SelectionBox=({checked:e,disabled:t})=>{const i=(0,_index.useTheme)(),s=(0,_index.resolveCheckboxSize)(i,"md")["box-size"],r=Math.round(.72*s);return(0,_jsxRuntime.jsx)(_reactNative.View,{accessibilityElementsHidden:!0,importantForAccessibility:"no-hide-descendants",pointerEvents:"none",style:{width:s,height:s,alignItems:"center",justifyContent:"center",borderWidth:i.size.border,borderRadius:i.radius.sm,..._corners.smoothCorners,borderColor:e?i.colors.primary:i.colors.border,backgroundColor:e?i.colors.primary:t?i.colors["surface-disabled"]:"transparent"},children:e?(0,_jsxRuntime.jsx)(_reactNativeSvg.default,{width:r,height:r,viewBox:"0 0 24 24",children:(0,_jsxRuntime.jsx)(_reactNativeSvg.Path,{d:"M5 12.5l4.5 4.5L19 7.5",stroke:i.colors["on-primary"],strokeWidth:3,strokeLinecap:"round",strokeLinejoin:"round",fill:"none"})}):null})},isActionList=e=>Array.isArray(e)&&e.length>0&&e.every(e=>null!=e&&"object"==typeof e&&!_react.default.isValidElement(e)&&"label"in e),renderActions=e=>isActionList(e)?e.map(e=>(0,_jsxRuntime.jsx)(_index2.Button,{size:"sm",variant:e.variant??"outline",tone:e.tone,leftIcon:e.icon,disabled:e.disabled,testID:e.testID,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:r,description:n,children:l,titleLines:o=1,subtitleLines:a=1,left:c,icon:d,iconTone:u="primary",right:x,rightPlacement:m="auto",selectable:h=!1,checked:_=!1,onCheckedChange:j,actions:p,onPress:g,haptic:b,selected:y=!1,disabled:f=!1,size:v="md",divider:R=!1,chevron:S=!1,leftActions:w,rightActions:I,contextMenu:k,accessibilityLabel:L,accessibilityHint:N,style:C,containerStyle:A,titleStyle:V,subtitleStyle:q,descriptionStyle:P,leftSlotStyle:B,rightSlotStyle:D,testID:z}=e,M=(0,_index.useTheme)(),F=(0,_react.useMemo)(()=>(0,_index.resolveListItemSize)(M,v),[M,v]),T=stylesFor(M),{fontScale:W}=(0,_reactNative.useWindowDimensions)(),O=!!x&&("below"===m||"auto"===m&&W>1.2),H=(0,_useContextMenu.useContextMenu)(f?void 0:k,{haptic:b||!1,testID:z}),E=(0,_react.useMemo)(()=>(0,_mergeRefs.mergeRefs)(t,H.hostRef),[t,H.hostRef]),G=h||!!g,U=G||H.enabled,Z=U&&!f,{style:J,pressIn:K,pressOut:Q}=(0,_usePressAnimation.usePressAnimation)({enabled:Z}),X=(0,_useFlickGuard.useFlickGuard)(),Y=L??("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[v]})),ee=h?(0,_jsxRuntime.jsxs)(_reactNative.View,{style:T.selectionLead,children:[(0,_jsxRuntime.jsx)(SelectionBox,{checked:_,disabled:f}),$?(0,_jsxRuntime.jsx)(_reactNative.View,{style:T.selectionLeadContent,children:$}):null]}):$,te=null!=p&&!1!==p&&!(Array.isArray(p)&&0===p.length),ie=R&&!te,se=(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[T.row,{paddingVertical:F["padding-y"],minHeight:F["min-height"],backgroundColor:y?M.colors["surface-selected"]:"transparent"},ie?T.divider:null,f?T.disabled:null,A],children:[ee?(0,_jsxRuntime.jsx)(_reactNative.View,{style:[T.leftSlot,B],children:ee}):null,(0,_jsxRuntime.jsxs)(_reactNative.View,{style:T.middle,children:[null==i||isText(i)?(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[T.title,{fontSize:F["title-text"],...(0,_index.fontFor)(M,"medium"),color:f?M.colors["text-disabled"]:M.colors["text-body"]},V],numberOfLines:o,children:i??" "}):i,null==r||""===r?null:isText(r)?(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[T.subtitle,{fontSize:F["subtitle-text"],color:f?M.colors["text-disabled"]:M.colors["text-muted"]},q],numberOfLines:a,children:r}):r,n?(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[T.description,{fontSize:F["subtitle-text"],color:f?M.colors["text-disabled"]:M.colors["text-subtle"]},P],numberOfLines:2,children:n}):null,null!=l&&!1!==l?(0,_jsxRuntime.jsx)(_reactNative.View,{style:T.body,children:l}):null,O?(0,_jsxRuntime.jsx)(_reactNative.View,{style:[T.rightBelow,D],children:x}):null]}),x&&!O||S?(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[T.rightSlot,O?null:D],children:[O?null:x,S?(0,_jsxRuntime.jsx)(_reactNative.View,{style:x&&!O?T.chevronWithRight:null,children:(0,_jsxRuntime.jsx)(Chevron,{color:f?M.colors["text-disabled"]:M.colors["text-subtle"]})}):null]}):null]}),re=U?(0,_jsxRuntime.jsx)(_reactNative.
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=exports.ListItem=void 0;var cache,_react=_interopRequireWildcard(require("react")),_reactNative=require("react-native"),_reactNativeSvg=_interopRequireWildcard(require("react-native-svg")),_useFlickGuard=require("../../hooks/useFlickGuard.js"),_usePressAnimation=require("../../hooks/usePressAnimation.js"),_index=require("../../theme/index.js"),_corners=require("../../utils/corners.js"),_hapticUtils=require("../../utils/hapticUtils.js"),_mergeRefs=require("../../utils/mergeRefs.js"),_themeStyles=require("../../utils/themeStyles.js"),_defaultIcons=require("../AppIcon/defaultIcons.js"),_index2=require("../Button/index.js"),_index3=require("../IconBadge/index.js"),_useContextMenu=require("../Menu/useContextMenu.js"),_index4=require("../Skeleton/index.js"),_index5=require("../Swipeable/index.js"),_jsxRuntime=require("react/jsx-runtime");function _interopRequireWildcard(e,t){if(!t&&e&&e.__esModule)return e;var i,s,r=Object.defineProperty,n={__proto__:null,default:e};if(Object(e)!==e)return n;if(cache||"function"!=typeof WeakMap||(cache=new WeakMap),cache){if(cache.has(e))return cache.get(e);cache.set(e,n)}for(s in e)"default"!==s&&{}.hasOwnProperty.call(e,s)&&((i=r&&Object.getOwnPropertyDescriptor(e,s))&&(i.get||i.set)?r(n,s,i):n[s]=e[s]);return n}const Chevron=({color:e})=>{const t=(0,_index.useTheme)();return(0,_jsxRuntime.jsx)(_jsxRuntime.Fragment,{children:(t.settings.icons.chevronRight??_defaultIcons.defaultIcons.chevronRight)({size:20,color:e})})},BADGE_SIZE={sm:"sm",md:"md",lg:"lg"},RIGHT_BELOW_FONT_SCALE=1.2,SelectionBox=({checked:e,disabled:t})=>{const i=(0,_index.useTheme)(),s=(0,_index.resolveCheckboxSize)(i,"md")["box-size"],r=Math.round(.72*s);return(0,_jsxRuntime.jsx)(_reactNative.View,{accessibilityElementsHidden:!0,importantForAccessibility:"no-hide-descendants",pointerEvents:"none",style:{width:s,height:s,alignItems:"center",justifyContent:"center",borderWidth:i.size.border,borderRadius:i.radius.sm,..._corners.smoothCorners,borderColor:e?i.colors.primary:i.colors.border,backgroundColor:e?i.colors.primary:t?i.colors["surface-disabled"]:"transparent"},children:e?(0,_jsxRuntime.jsx)(_reactNativeSvg.default,{width:r,height:r,viewBox:"0 0 24 24",children:(0,_jsxRuntime.jsx)(_reactNativeSvg.Path,{d:"M5 12.5l4.5 4.5L19 7.5",stroke:i.colors["on-primary"],strokeWidth:3,strokeLinecap:"round",strokeLinejoin:"round",fill:"none"})}):null})},isActionList=e=>Array.isArray(e)&&e.length>0&&e.every(e=>null!=e&&"object"==typeof e&&!_react.default.isValidElement(e)&&"label"in e),renderActions=e=>isActionList(e)?e.map(e=>(0,_jsxRuntime.jsx)(_index2.Button,{size:"sm",variant:e.variant??"outline",tone:e.tone,leftIcon:e.icon,disabled:e.disabled,testID:e.testID,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:r,description:n,children:l,titleLines:o=1,subtitleLines:a=1,left:c,icon:d,iconTone:u="primary",right:x,rightPlacement:m="auto",selectable:h=!1,checked:_=!1,onCheckedChange:j,actions:p,onPress:g,haptic:b,selected:y=!1,disabled:f=!1,size:v="md",divider:R=!1,chevron:S=!1,leftActions:w,rightActions:I,contextMenu:k,accessibilityLabel:L,accessibilityHint:N,style:C,containerStyle:A,titleStyle:V,subtitleStyle:q,descriptionStyle:P,leftSlotStyle:B,rightSlotStyle:D,testID:z}=e,M=(0,_index.useTheme)(),F=(0,_react.useMemo)(()=>(0,_index.resolveListItemSize)(M,v),[M,v]),T=stylesFor(M),{fontScale:W}=(0,_reactNative.useWindowDimensions)(),O=!!x&&("below"===m||"auto"===m&&W>1.2),H=(0,_useContextMenu.useContextMenu)(f?void 0:k,{haptic:b||!1,testID:z}),E=(0,_react.useMemo)(()=>(0,_mergeRefs.mergeRefs)(t,H.hostRef),[t,H.hostRef]),G=h||!!g,U=G||H.enabled,Z=U&&!f,{style:J,pressIn:K,pressOut:Q}=(0,_usePressAnimation.usePressAnimation)({enabled:Z}),X=(0,_useFlickGuard.useFlickGuard)(),Y=L??("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[v]})),ee=h?(0,_jsxRuntime.jsxs)(_reactNative.View,{style:T.selectionLead,children:[(0,_jsxRuntime.jsx)(SelectionBox,{checked:_,disabled:f}),$?(0,_jsxRuntime.jsx)(_reactNative.View,{style:T.selectionLeadContent,children:$}):null]}):$,te=null!=p&&!1!==p&&!(Array.isArray(p)&&0===p.length),ie=R&&!te,se=(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[T.row,{paddingVertical:F["padding-y"],minHeight:F["min-height"],backgroundColor:y?M.colors["surface-selected"]:"transparent"},ie?T.divider:null,f?T.disabled:null,A],children:[ee?(0,_jsxRuntime.jsx)(_reactNative.View,{style:[T.leftSlot,B],children:ee}):null,(0,_jsxRuntime.jsxs)(_reactNative.View,{style:T.middle,children:[null==i||isText(i)?(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[T.title,{fontSize:F["title-text"],...(0,_index.fontFor)(M,"medium"),color:f?M.colors["text-disabled"]:M.colors["text-body"]},V],numberOfLines:o,children:i??" "}):i,null==r||""===r?null:isText(r)?(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[T.subtitle,{fontSize:F["subtitle-text"],color:f?M.colors["text-disabled"]:M.colors["text-muted"]},q],numberOfLines:a,children:r}):r,n?(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[T.description,{fontSize:F["subtitle-text"],color:f?M.colors["text-disabled"]:M.colors["text-subtle"]},P],numberOfLines:2,children:n}):null,null!=l&&!1!==l?(0,_jsxRuntime.jsx)(_reactNative.View,{style:T.body,children:l}):null,O?(0,_jsxRuntime.jsx)(_reactNative.View,{style:[T.rightBelow,D],children:x}):null]}),x&&!O||S?(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[T.rightSlot,O?null:D],children:[O?null:x,S?(0,_jsxRuntime.jsx)(_reactNative.View,{style:x&&!O?T.chevronWithRight:null,children:(0,_jsxRuntime.jsx)(Chevron,{color:f?M.colors["text-disabled"]:M.colors["text-subtle"]})}):null]}):null]}),re=U?(0,_jsxRuntime.jsx)(_reactNative.Pressable,{ref:E,onPress:e=>{Z&&G&&!X.isFlick(e)&&(b&&(0,_hapticUtils.triggerHaptic)(b),h?j?.(!_):g?.(e))},onPressIn:e=>{X.onPressIn(e),K()},onPressOut:Q,disabled:!Z,accessibilityRole:h?"checkbox":g?"button":void 0,accessibilityLabel:Y,accessibilityHint:N,accessibilityState:h?{checked:_,disabled:!Z}:{selected:y,disabled:!Z},"aria-disabled":!Z,...h?{"aria-checked":_}:{"aria-selected":y},testID:z,android_ripple:{color:M.colors["surface-pressed"],borderless:!1},style:({pressed:e})=>[C,e?T.pressed:null],...H.hostProps,children:(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{style:J,children:se})}):(0,_jsxRuntime.jsx)(_reactNative.View,{ref:t,accessibilityRole:"none",accessibilityLabel:Y,accessibilityHint:N,accessibilityState:{selected:y,disabled:f},"aria-selected":y,"aria-disabled":f,testID:z,style:C,children:se}),ne=w&&w.length>0||I&&I.length>0,le=te?(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[y?{backgroundColor:M.colors["surface-selected"]}:null,R?T.divider:null],children:[re,(0,_jsxRuntime.jsx)(_reactNative.View,{style:T.actions,children:renderActions(p)})]}):re,oe=ne?(0,_jsxRuntime.jsx)(_index5.Swipeable,{leftActions:w,rightActions:I,accessibilityLabel:Y,children:le}):le;return s?(0,_jsxRuntime.jsx)(ListItemSkeleton,{...e}):H.enabled?(0,_jsxRuntime.jsxs)(_jsxRuntime.Fragment,{children:[oe,H.renderSurface((0,_jsxRuntime.jsx)(_reactNative.View,{style:T.preview,children:se}))]}):oe}));ListItem.displayName="ListItem";const ListItemSkeleton=({subtitle:e,description:t,left:i,icon:s,right:r,chevron:n,size:l="md",containerStyle:o,style:a})=>{const c=(0,_index.useTheme)(),d=(0,_index.resolveListItemSize)(c,l),u=Math.round(1.15*d["title-text"]),x=Math.round(1.15*d["subtitle-text"]);return(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[{flexDirection:"row",alignItems:"center",paddingHorizontal:c.space.md,paddingVertical:d["padding-y"],minHeight:d["min-height"]},o,a],children:[void 0!==i||void 0!==s?(0,_jsxRuntime.jsx)(_reactNative.View,{style:{marginRight:c.space.sm},children:(0,_jsxRuntime.jsx)(_index4.Skeleton,{shape:"circle",width:40,height:40})}):null,(0,_jsxRuntime.jsxs)(_reactNative.View,{style:{flex:1},children:[(0,_jsxRuntime.jsx)(_index4.Skeleton,{shape:"text",width:"70%",height:u,style:{marginBottom:c.space.xs}}),void 0!==e?(0,_jsxRuntime.jsx)(_index4.Skeleton,{shape:"text",width:"50%",height:x,style:void 0!==t?{marginBottom:c.space.xs}:void 0}):null,void 0!==t?(0,_jsxRuntime.jsx)(_index4.Skeleton,{shape:"text",width:"85%",height:x}):null]}),void 0!==r||n?(0,_jsxRuntime.jsx)(_reactNative.View,{style:{marginLeft:c.space.sm},children:(0,_jsxRuntime.jsx)(_index4.Skeleton,{width:20,height:20,radius:"sm"})}):null]})};ListItemSkeleton.displayName="ListItemSkeleton",ListItem.Skeleton=ListItemSkeleton;const buildStyles=e=>_reactNative.StyleSheet.create({row:{flexDirection:"row",alignItems:"center",paddingHorizontal:e.space.md},divider:{borderBottomWidth:_reactNative.StyleSheet.hairlineWidth,borderBottomColor:e.colors.border},pressed:{backgroundColor:e.colors["surface-pressed"]},disabled:{opacity:.55},leftSlot:{marginRight:e.space.md,alignItems:"center",justifyContent:"center"},middle:{flex:1,flexDirection:"column",justifyContent:"center"},selectionLead:{flexDirection:"row",alignItems:"center"},selectionLeadContent:{marginLeft:e.space.sm},body:{marginTop:e.space.xs},rightBelow:{alignSelf:"flex-start",flexDirection:"row",alignItems:"center",marginTop:e.space.xs},rightSlot:{marginLeft:e.space.md,alignItems:"center",justifyContent:"center",flexDirection:"row"},actions:{flexDirection:"row",flexWrap:"wrap",gap:e.space.sm,paddingHorizontal:e.space.md,paddingBottom:e.space.md},chevronWithRight:{marginLeft:e.space.xs},preview:{flex:1,backgroundColor:e.colors.surface,borderRadius:e.radius.md,..._corners.smoothCorners,overflow:"hidden"},title:{letterSpacing:e["letter-spacing"].normal},subtitle:{marginTop:e.space.xxs,...(0,_index.fontFor)(e,"normal")},description:{marginTop:e.space.xxs,...(0,_index.fontFor)(e,"normal")}}),stylesFor=(0,_themeStyles.themeStyles)(buildStyles);var _default=exports.default=ListItem;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=exports.Modal=exports.MODAL_DISMISS_GRACE_MS=void 0;var _react=require("react"),_reactNative=require("react-native"),_usePresenceMotion=require("../../hooks/usePresenceMotion.js"),_index=require("../../theme/index.js"),_color=require("../../utils/color.js"),_corners=require("../../utils/corners.js"),_hapticUtils=require("../../utils/hapticUtils.js"),_squircle=require("../../utils/squircle.js"),_ModalSafeArea=require("../ModalSafeArea/ModalSafeArea.js"),_SquircleFill=require("../SquircleFill/SquircleFill.js"),_ToastProvider=require("../Toast/ToastProvider.js"),_jsxRuntime=require("react/jsx-runtime");const MODAL_DISMISS_GRACE_MS=exports.MODAL_DISMISS_GRACE_MS=300,SCALE_START_VALUE=.9,Modal=exports.Modal=(0,_react.forwardRef)((e,t)=>{const{visible:r,onRequestClose:a,presentation:i="centered",backdropOpacity:s,backdropPressClose:n=!0,animationDuration:o,animateMount:l=!0,accessibilityLabel:c,hardwareBackPress:u=!0,children:d,contentStyle:m,backdropStyle:_,restoreFocusRef:f,onDismissed:p,haptic:v,testID:g}=e,b=(0,_index.useTheme)(),S=(0,_usePresenceMotion.usePresenceMotion)(),[h,x]=(0,_ModalSafeArea.useModalInsets)(),A=o??S.duration("default"),M=_reactNative.Dimensions.get("window").height,N=(0,_react.useRef)(!l&&r),
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=exports.Modal=exports.MODAL_DISMISS_GRACE_MS=void 0;var _react=require("react"),_reactNative=require("react-native"),_usePresenceMotion=require("../../hooks/usePresenceMotion.js"),_index=require("../../theme/index.js"),_color=require("../../utils/color.js"),_corners=require("../../utils/corners.js"),_hapticUtils=require("../../utils/hapticUtils.js"),_squircle=require("../../utils/squircle.js"),_ModalSafeArea=require("../ModalSafeArea/ModalSafeArea.js"),_SquircleFill=require("../SquircleFill/SquircleFill.js"),_ToastProvider=require("../Toast/ToastProvider.js"),_jsxRuntime=require("react/jsx-runtime");const MODAL_DISMISS_GRACE_MS=exports.MODAL_DISMISS_GRACE_MS=300,SCALE_START_VALUE=.9,Modal=exports.Modal=(0,_react.forwardRef)((e,t)=>{const{visible:r,onRequestClose:a,presentation:i="centered",backdropOpacity:s,backdropPressClose:n=!0,animationDuration:o,animateMount:l=!0,accessibilityLabel:c,hardwareBackPress:u=!0,children:d,contentStyle:m,backdropStyle:_,restoreFocusRef:f,onDismissed:p,haptic:v,testID:g}=e,b=(0,_index.useTheme)(),S=(0,_usePresenceMotion.usePresenceMotion)(),[h,x]=(0,_ModalSafeArea.useModalInsets)(),A=o??S.duration("default"),M=_reactNative.Dimensions.get("window").height,N=(0,_react.useRef)(!l&&r),y=N.current,R=(0,_react.useRef)((0,_index.createAnimatedValue)(y?1:.9)).current,j=(0,_react.useRef)((0,_index.createAnimatedValue)(y?1:0)).current,C=(0,_react.useRef)((0,_index.createAnimatedValue)(y?0:M)).current,q=(0,_react.useRef)((0,_index.createAnimatedValue)(y?1:0)).current,V=(0,_react.useRef)(null),D=(0,_react.useRef)(!1),[T,w]=(0,_react.useState)(r),I=(0,_react.useMemo)(()=>buildStyles(b),[b]),E=(0,_react.useMemo)(()=>{const e=b.colors.scrim;return"number"!=typeof s?e:(0,_color.withAlpha)(e,s)??e},[b.colors.scrim,s]),P=(0,_react.useMemo)(()=>q.interpolate({inputRange:[0,1],outputRange:[(0,_color.transparentOf)(E),E]}),[q,E]);(0,_react.useEffect)(()=>{r&&(_reactNative.Keyboard.dismiss(),w(!0))},[r]),(0,_react.useEffect)(()=>{const e=[];if(r&&T&&N.current)N.current=!1;else if(r&&T){const t=_reactNative.Animated.timing(q,{toValue:1,duration:S.duration("default"),useNativeDriver:!1});if(t.start(),e.push(t),S.reduced){j.setValue(0),C.setValue(0),R.setValue(1);const t=_reactNative.Animated.timing(j,{toValue:1,duration:A,useNativeDriver:!0});t.start(),e.push(t)}else if("bottom"===i){j.setValue(1);const t=_reactNative.Animated.spring(C,{toValue:0,damping:b.motion.spring.gentle.damping,stiffness:b.motion.spring.gentle.stiffness,mass:b.motion.spring.gentle.mass,useNativeDriver:!0});t.start(),e.push(t)}else{const t=_reactNative.Animated.parallel([_reactNative.Animated.spring(R,{toValue:1,damping:b.motion.spring.gentle.damping,stiffness:b.motion.spring.gentle.stiffness,mass:b.motion.spring.gentle.mass,useNativeDriver:!0}),_reactNative.Animated.timing(j,{toValue:1,duration:A,useNativeDriver:!0})]);t.start(),e.push(t)}}else if(T){const t=S.duration("fast"),r=_reactNative.Easing.bezier(...b.motion.ease.accelerate),a=_reactNative.Animated.timing(j,{toValue:0,duration:t,easing:r,useNativeDriver:!0}),s=S.reduced?a:"bottom"===i?_reactNative.Animated.timing(C,{toValue:M,duration:t,easing:r,useNativeDriver:!0}):_reactNative.Animated.parallel([_reactNative.Animated.timing(R,{toValue:.9,duration:t,easing:r,useNativeDriver:!0}),a]),n=_reactNative.Animated.parallel([s,_reactNative.Animated.timing(q,{toValue:0,duration:S.duration("default"),useNativeDriver:!1})]);n.start(({finished:e})=>{e&&(C.setValue(M),w(!1))}),e.push(n)}return()=>e.forEach(e=>{e.stop()})},[r,T,i,A,R,j,q,C,M,b.motion.spring.gentle.damping,b.motion.spring.gentle.stiffness,b.motion.spring.gentle.mass,S,b.motion.ease.accelerate]),(0,_react.useEffect)(()=>{if("web"===_reactNative.Platform.OS)return;let e,t;return r?(e=setTimeout(()=>{V.current&&_reactNative.AccessibilityInfo.sendAccessibilityEvent(V.current,"focus")},150),D.current=!0):D.current&&(D.current=!1,f?.current&&(t=setTimeout(()=>{const e=f.current;e&&_reactNative.AccessibilityInfo.sendAccessibilityEvent(e,"focus")},A))),()=>{e&&clearTimeout(e),t&&clearTimeout(t)}},[r,A,f]);const L=(0,_react.useRef)(!1);(0,_react.useEffect)(()=>{if(r)return void(L.current=!0);if(!L.current)return;if(L.current=!1,!p)return;const e=setTimeout(p,MODAL_DISMISS_GRACE_MS);return()=>clearTimeout(e)},[r,p]);const k=(0,_react.useCallback)(()=>{if(!n)return;const e=(0,_hapticUtils.resolveHaptic)(v,"selection");e&&(0,_hapticUtils.triggerHaptic)(e),a()},[n,a,v]),z=(0,_react.useCallback)(()=>{u&&a()},[u,a]),F=(0,_SquircleFill.useSquircle)("bottom"!==i&&"fullScreen"!==i,b.radius.xl),O=(0,_react.useMemo)(()=>"fullScreen"===i?[I.fullScreenContent,{backgroundColor:b.colors.surface}]:"bottom"===i?[I.bottomContent,{backgroundColor:b.colors.surface,borderTopLeftRadius:b.radius.xl,borderTopRightRadius:b.radius.xl,..._corners.smoothCorners,paddingTop:b.space.lg,paddingHorizontal:b.space.lg,paddingBottom:b.space.lg+h.bottom},b.shadow.modal]:[I.centeredContent,{backgroundColor:b.colors.surface,borderRadius:F.active&&F.size?(0,_squircle.squircleHostRadius)(F.size.width,F.size.height,b.radius.xl):b.radius.xl,..._corners.smoothCorners,padding:b.space.xl},b.shadow.modal],[i,b,I,h.bottom,F.active,F.size]),W=(0,_react.useMemo)(()=>"bottom"===i?I.bottomWrapper:"fullScreen"===i?I.fullScreenWrapper:I.centeredWrapper,[i,I]),H=(0,_react.useMemo)(()=>"bottom"===i?{opacity:j,transform:[{translateY:C}]}:"fullScreen"===i?{opacity:j}:{opacity:j,transform:[{scale:R}]},[i,R,j,C]);return(0,_jsxRuntime.jsx)(_reactNative.Modal,{visible:T,transparent:!0,statusBarTranslucent:!0,navigationBarTranslucent:!0,animationType:"none",onRequestClose:z,testID:g,children:(0,_jsxRuntime.jsx)(_reactNative.View,{ref:e=>{V.current=e,"function"==typeof t?t(e):t&&(t.current=e)},style:I.root,accessible:!1,accessibilityViewIsModal:!0,accessibilityRole:"alert",accessibilityLabel:c,children:(0,_jsxRuntime.jsxs)(_ModalSafeArea.ModalSafeArea,{onInsets:x,children:[(0,_jsxRuntime.jsxs)(_reactNative.Animated.View,{collapsable:!1,style:[_reactNative.StyleSheet.absoluteFill,W,{backgroundColor:P},_],children:[(0,_jsxRuntime.jsx)(_reactNative.Pressable,{style:_reactNative.StyleSheet.absoluteFill,onPress:k,accessibilityRole:"button",accessibilityLabel:"Close modal",disabled:!n}),(0,_jsxRuntime.jsxs)(_reactNative.Animated.View,{style:[O,H,m],onLayout:F.onLayout,pointerEvents:"auto",needsOffscreenAlphaCompositing:!0,children:[F.active&&F.size?(0,_jsxRuntime.jsx)(_SquircleFill.SquircleFill,{width:F.size.width,height:F.size.height,radius:b.radius.xl,fill:b.colors.surface}):null,d]})]}),(0,_jsxRuntime.jsx)(_ToastProvider.ToastHost,{})]})})})});Modal.displayName="Modal";const buildStyles=e=>_reactNative.StyleSheet.create({root:{flex:1},centeredWrapper:{flex:1,alignItems:"center",justifyContent:"center",paddingHorizontal:e.space.lg},centeredContent:{maxWidth:"90%",width:"90%"},bottomWrapper:{flex:1,justifyContent:"flex-end"},bottomContent:{width:"100%"},fullScreenWrapper:{flex:1},fullScreenContent:{flex:1}});var _default=exports.default=Modal;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=exports.OptionSheet=void 0;var _react=require("react"),_reactNative=require("react-native"),_reactNativeGestureHandler=require("react-native-gesture-handler"),_reactNativeKeyboardController=require("react-native-keyboard-controller"),_useDragToDismiss=require("../../hooks/useDragToDismiss.js"),_usePresenceMotion=require("../../hooks/usePresenceMotion.js"),_index=require("../../theme/index.js"),_color=require("../../utils/color.js"),_corners=require("../../utils/corners.js"),_hitSlop=require("../../utils/hitSlop.js"),_defaultIcons=require("../AppIcon/defaultIcons.js"),_ModalSafeArea=require("../ModalSafeArea/ModalSafeArea.js"),_ToastProvider=require("../Toast/ToastProvider.js"),_jsxRuntime=require("react/jsx-runtime");const AnimatedGestureRoot=_reactNative.Animated.createAnimatedComponent(_reactNativeGestureHandler.GestureHandlerRootView),SEARCH_ICON_SIZE=18,OptionSheet=e=>{const{open:t,onClose:i,onAfterClose:r,onOpenChange:s,title:a,options:o,sections:n,renderSectionHeader:l,renderOption:c,alphabetIndex:d=!1,searchPlaceholder:u="Search…",emptyText:p="No options",labelOf:m,getValue:h,disabledOf:_,destructiveOf:x,descriptionOf:g,iconOf:b,isSelected:f,onSelect:y,multi:v=!1,searchable:j=!1,searchSelectionColor:R,accessibilityLabel:N,optionStyle:S,selectedOptionStyle:T,optionTextStyle:w,selectedOptionTextStyle:C,testID:k}=e,I=(0,_index.useTheme)(),V=(0,_usePresenceMotion.usePresenceMotion)(),[M,z]=(0,_ModalSafeArea.useModalInsets)(),D=(0,_react.useMemo)(()=>buildStyles(I),[I]),[A,P]=(0,_react.useState)(""),L=_reactNative.Dimensions.get("window").height,H=Math.round(.7*L),[O,W]=(0,_react.useState)(t),B=(0,_react.useRef)((0,_index.createAnimatedValue)(0)).current,E=(0,_react.useRef)((0,_index.createAnimatedValue)(H)).current,q=(0,_react.useRef)((0,_index.createAnimatedValue)(0)).current,F=(0,_react.useMemo)(()=>V.reduced?q:_reactNative.Animated.add(E,q),[V.reduced,E,q]),G=(0,_react.useMemo)(()=>V.reduced?E.interpolate({inputRange:[0,H],outputRange:[1,0],extrapolate:"clamp"}):1,[V.reduced,E,H]),{handleGesture:$,opacity:K}=(0,_useDragToDismiss.useDragToDismiss)({drag:q,travel:H,onDismiss:i}),J=(0,_react.useMemo)(()=>_reactNative.Animated.multiply(G,K),[G,K]),U=(0,_react.useMemo)(()=>{const e=I.colors.scrim;return B.interpolate({inputRange:[0,1],outputRange:[(0,_color.transparentOf)(e),e]})},[B,I.colors.scrim]);(0,_react.useEffect)(()=>{t&&W(!0)},[t]);const Y=(0,_react.useRef)(s);Y.current=s;const Z=(0,_react.useRef)(!1);(0,_react.useEffect)(()=>{Z.current!==t&&(Z.current=t,Y.current?.(t))},[t]);const Q=(0,_react.useRef)(r);Q.current=r;const X=(0,_react.useRef)(O);(0,_react.useEffect)(()=>{X.current&&!O&&"ios"!==_reactNative.Platform.OS&&Q.current?.(),X.current=O},[O]),(0,_react.useEffect)(()=>{if(!O)return;t&&((0,_index.setNativeValue)(q,0),(0,_index.setNativeValue)(K,1));const e=t?_reactNative.Animated.parallel([_reactNative.Animated.timing(B,{toValue:1,duration:V.duration("default"),easing:_reactNative.Easing.bezier(...I.motion.ease["in-out"]),useNativeDriver:!1}),V.reduced?_reactNative.Animated.timing(E,{toValue:0,duration:V.duration("default"),easing:_reactNative.Easing.bezier(...I.motion.ease["in-out"]),useNativeDriver:!0}):_reactNative.Animated.spring(E,{toValue:0,damping:I.motion.spring.snappy.damping,stiffness:I.motion.spring.snappy.stiffness,mass:I.motion.spring.snappy.mass,useNativeDriver:!0})]):_reactNative.Animated.parallel([_reactNative.Animated.timing(B,{toValue:0,duration:V.duration("default"),easing:_reactNative.Easing.bezier(...I.motion.ease["in-out"]),useNativeDriver:!1}),_reactNative.Animated.timing(E,{toValue:H,duration:V.duration("fast"),easing:_reactNative.Easing.bezier(...I.motion.ease.accelerate),useNativeDriver:!0})]);return e.start(({finished:e})=>{e&&!t&&W(!1)}),()=>e.stop()},[t,O,B,E,q,K,H,V,I.motion.ease["in-out"],I.motion.ease.accelerate,I.motion.spring.snappy]);const ee=(0,_react.useMemo)(()=>_reactNativeGestureHandler.Gesture.Native(),[]),[te,ie]=(0,_react.useState)(0),re=(0,_reactNativeKeyboardController.useKeyboardState)(e=>e.height),se=O?Math.max(0,Math.round(re)):0,ae=Math.max(M.top,_reactNative.StatusBar.currentHeight??0)+I.space.sm,oe=se>0,ne=oe?Math.max(0,Math.min(H,(te>0?te:L)-se-ae)):H;(0,_react.useEffect)(()=>{t||P("")},[t]);const le=(0,_react.useMemo)(()=>{const e=j?A.trim().toLowerCase():"",matches=t=>0===e.length||m(t).toLowerCase().includes(e)||(g(t)??"").toLowerCase().includes(e);if(!n)return o.filter(matches).map(e=>({kind:"option",option:e}));const t=[];return n.forEach((e,i)=>{const r=e.options.filter(matches);if(0!==r.length){t.push({kind:"header",title:e.title});for(const e of r)t.push({kind:"option",option:e,section:i})}}),t},[j,A,o,n,m,g]),ce=(0,_react.useCallback)(()=>{i()},[i]),de=(0,_react.useRef)(null),ue=(0,_react.useMemo)(()=>{const e=new Map;if(!d)return e;let t=0;if(n)for(let e=le.length-1;e>=0;e-=1)if("header"===le[e].kind){t=e+1;break}for(let i=t;i<le.length;i+=1){const t=le[i];if("option"!==t.kind)continue;const r=m(t.option).trim().charAt(0).toUpperCase(),s=/^[A-Z]$/.test(r)?r:"#";e.has(s)||e.set(s,i)}return e},[d,le,n,m]),pe=d&&ue.size>0&&0===A.trim().length,me=(0,_react.useMemo)(()=>[..."ABCDEFGHIJKLMNOPQRSTUVWXYZ",...ue.has("#")?["#"]:[]],[ue]),he=(0,_react.useCallback)(e=>{const t=ue.get(e);void 0!==t&&de.current?.scrollToIndex({index:t,animated:!0,viewPosition:0})},[ue]),xe=(0,_react.useRef)(null),ge=(0,_react.useCallback)(()=>{null!==xe.current&&(clearTimeout(xe.current),xe.current=null)},[]),be=(0,_react.useCallback)(e=>{de.current?.scrollToOffset({offset:e.averageItemLength*e.index,animated:!1}),ge(),xe.current=setTimeout(()=>{xe.current=null,de.current?.scrollToIndex({index:e.index,animated:!0,viewPosition:0})},50)},[ge]);(0,_react.useEffect)(()=>(O||ge(),ge),[O,ge]);return(0,_jsxRuntime.jsx)(_reactNative.Modal,{visible:O,transparent:!0,animationType:"none",onRequestClose:ce,onDismiss:()=>Q.current?.(),statusBarTranslucent:!0,navigationBarTranslucent:!0,children:(0,_jsxRuntime.jsx)(_ModalSafeArea.ModalSafeArea,{onInsets:z,children:(0,_jsxRuntime.jsxs)(AnimatedGestureRoot,{collapsable:!1,onLayout:e=>ie(e.nativeEvent.layout.height),style:[_reactNative.StyleSheet.absoluteFill,{backgroundColor:U}],children:[(0,_jsxRuntime.jsx)(_reactNative.Pressable,{style:_reactNative.StyleSheet.absoluteFill,onPress:ce,accessibilityRole:"button",accessibilityLabel:"Close picker"}),(0,_jsxRuntime.jsxs)(_reactNative.Animated.View,{testID:k,accessibilityViewIsModal:!0,accessibilityLabel:N??a??"Options",style:[D.sheet,{maxHeight:ne,bottom:se,paddingBottom:oe?I.space.lg:M.bottom+I.space.lg,backgroundColor:I.colors.surface,borderTopLeftRadius:I.radius.xl,borderTopRightRadius:I.radius.xl,..._corners.smoothCorners,opacity:J,transform:[{translateY:F}],...I.shadow.modal}],children:[(0,_jsxRuntime.jsx)(_reactNativeGestureHandler.GestureDetector,{gesture:$,children:(0,_jsxRuntime.jsxs)(_reactNative.View,{children:[(0,_jsxRuntime.jsx)(_reactNative.View,{style:D.sheetHandleRow,children:(0,_jsxRuntime.jsx)(_reactNative.View,{style:[D.sheetHandle,{backgroundColor:I.colors.border}]})}),a?(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[D.sheetTitle,{color:I.colors["text-body"],fontSize:I.text.lg.size,fontWeight:I.weight.semibold,paddingHorizontal:I.space.lg,marginBottom:I.space.sm}],children:a}):null]})}),j?(0,_jsxRuntime.jsx)(_reactNative.View,{style:[D.searchWrap,{marginHorizontal:I.space.lg,marginBottom:I.space.sm}],children:(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[D.searchBox,{backgroundColor:I.colors["bg-subtle"],borderColor:I.colors.border,borderRadius:I.radius.md,..._corners.smoothCorners,paddingHorizontal:I.space.md,gap:I.space.sm}],children:[(I.settings.icons.search??_defaultIcons.defaultIcons.search)({size:18,color:I.colors["text-subtle"]}),(0,_jsxRuntime.jsx)(_reactNative.TextInput,{value:A,onChangeText:P,placeholder:u,placeholderTextColor:I.colors["text-subtle"],selectionColor:R??I.colors["focus-ring"],accessibilityLabel:"Search options",style:[D.searchInput,{color:I.colors["text-body"],fontSize:I.text.base.size,paddingVertical:I.space.sm}]}),A.length>0?(0,_jsxRuntime.jsx)(_reactNative.Pressable,{onPress:()=>P(""),hitSlop:8,...(0,_hitSlop.hitSlopMarker)(8),accessibilityRole:"button",accessibilityLabel:"Clear search",children:(I.settings.icons.close??_defaultIcons.defaultIcons.close)({size:18,color:I.colors["text-muted"]})}):null]})}):null,(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[D.listWrap,pe?D.listRow:null],children:[(0,_jsxRuntime.jsx)(_reactNativeGestureHandler.GestureDetector,{gesture:ee,children:(0,_jsxRuntime.jsx)(_reactNative.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(0,_jsxRuntime.jsx)(_reactNative.View,{accessible:!0,accessibilityRole:"header",style:[D.sectionHeader,{paddingHorizontal:I.space.lg,paddingTop:I.space.md}],children:l?l(e.title):(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[D.sectionTitle,{color:I.colors["text-subtle"],fontSize:I.text.xs.size,fontWeight:I.weight.semibold}],children:e.title.toUpperCase()})});const t=e.option,i=m(t),r=h(t),s=g(t),a=b(t),o=f(r),n=_(t),d=x?.(t)??!1;return(0,_jsxRuntime.jsxs)(_reactNative.Pressable,{onPress:()=>y(t),disabled:n,android_ripple:{color:I.colors["surface-pressed"],borderless:!1},accessibilityRole:"button",accessibilityLabel:i,accessibilityState:{selected:o,disabled:n},"aria-selected":o,"aria-disabled":n,style:({pressed:e})=>[D.optionRow,{backgroundColor:o?I.colors["surface-selected"]:e?I.colors["surface-pressed"]:"transparent",opacity:n?.5:1,paddingHorizontal:I.space.lg,paddingVertical:I.space.md},S,o?T:null],children:[c?(0,_jsxRuntime.jsx)(_reactNative.View,{style:D.optionTextWrap,children:c(t,{selected:o,disabled:n})}):(0,_jsxRuntime.jsxs)(_jsxRuntime.Fragment,{children:[a?(0,_jsxRuntime.jsx)(_reactNative.View,{style:D.optionIcon,children:a}):null,(0,_jsxRuntime.jsxs)(_reactNative.View,{style:D.optionTextWrap,children:[(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[D.optionLabel,{color:d?I.colors["danger-text"]:o?I.colors.primary:I.colors["text-body"],fontSize:I.text.base.size,fontWeight:o?I.weight.semibold:I.weight.medium},w,o?C:null],children:i}),s?(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[D.optionDescription,{color:I.colors["text-subtle"],fontSize:I.text.sm.size}],numberOfLines:2,children:s}):null]})]}),v?(0,_jsxRuntime.jsx)(_reactNative.View,{style:[D.checkbox,{borderColor:o?I.colors.primary:I.colors.border,backgroundColor:o?I.colors.primary:"transparent"}],children:o?(0,_jsxRuntime.jsx)(_reactNative.View,{style:D.checkboxTick}):null}):o?"icon"===I.settings.components["option-sheet"]?.selectedMarker?(0,_jsxRuntime.jsx)(_reactNative.View,{style:D.singleSelectedIcon,children:(I.settings.icons.selectedTick??_defaultIcons.defaultIcons.selectedTick)({size:20,color:I.colors.primary})}):(0,_jsxRuntime.jsx)(_reactNative.View,{style:[D.singleSelectedDot,{backgroundColor:I.colors.primary}]}):null]})},onScrollToIndexFailed:be,overScrollMode:"never",bounces:!1,keyboardShouldPersistTaps:"handled",showsVerticalScrollIndicator:!pe,style:pe?D.listBesideRail:null,ListEmptyComponent:(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[D.empty,{color:I.colors["text-subtle"],fontSize:I.text.sm.size,paddingVertical:I.space.xl}],children:p})})}),pe?(0,_jsxRuntime.jsx)(_reactNative.View,{style:[D.rail,{paddingRight:I.space.xs}],accessibilityRole:"list",accessibilityLabel:"Jump to letter",testID:"option-sheet-alphabet",children:me.map(e=>{const t=ue.has(e);return(0,_jsxRuntime.jsx)(_reactNative.Pressable,{onPress:()=>he(e),disabled:!t,hitSlop:{left:8,right:8},...(0,_hitSlop.hitSlopMarker)({left:8,right:8}),accessibilityRole:"button",accessibilityLabel:`Jump to ${e}`,accessibilityState:{disabled:!t},"aria-disabled":!t,style:D.railLetter,children:(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[D.railLetterText,{color:t?I.colors.primary:I.colors["text-subtle"],fontSize:I.text.xs.size,fontWeight:I.weight.semibold,opacity:t?1:.45}],children:e})},e)})}):null]}),v?(0,_jsxRuntime.jsx)(_reactNative.View,{style:[D.sheetFooter,{borderTopColor:I.colors["border-subtle"],paddingHorizontal:I.space.lg,paddingVertical:I.space.md}],children:(0,_jsxRuntime.jsx)(_reactNative.Pressable,{onPress:ce,accessibilityRole:"button",accessibilityLabel:"Done",style:({pressed:e})=>[D.doneButton,{backgroundColor:e?I.colors["primary-pressed"]:I.colors.primary,borderRadius:I.radius.md,..._corners.smoothCorners,paddingVertical:I.space.sm,paddingHorizontal:I.space.lg}],children:(0,_jsxRuntime.jsx)(_reactNative.Text,{style:{color:I.colors["on-primary"],fontSize:I.text.base.size,fontWeight:I.weight.semibold},children:"Done"})})}):null]}),(0,_jsxRuntime.jsx)(_ToastProvider.ToastHost,{})]})})})};exports.OptionSheet=OptionSheet,OptionSheet.displayName="OptionSheet";const buildStyles=e=>_reactNative.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,..._corners.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,..._corners.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,..._corners.smoothCorners,marginLeft:e.space.md},singleSelectedIcon:{marginLeft:e.space.md},empty:{textAlign:"center"},sheetFooter:{borderTopWidth:_reactNative.StyleSheet.hairlineWidth,alignItems:"flex-end"},doneButton:{alignSelf:"flex-end"}});var _default=exports.default=OptionSheet;
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=exports.OptionSheet=void 0;var _react=require("react"),_reactNative=require("react-native"),_reactNativeGestureHandler=require("react-native-gesture-handler"),_reactNativeKeyboardController=require("react-native-keyboard-controller"),_useDragToDismiss=require("../../hooks/useDragToDismiss.js"),_usePresenceMotion=require("../../hooks/usePresenceMotion.js"),_index=require("../../theme/index.js"),_color=require("../../utils/color.js"),_corners=require("../../utils/corners.js"),_hitSlop=require("../../utils/hitSlop.js"),_defaultIcons=require("../AppIcon/defaultIcons.js"),_ModalSafeArea=require("../ModalSafeArea/ModalSafeArea.js"),_ToastProvider=require("../Toast/ToastProvider.js"),_jsxRuntime=require("react/jsx-runtime");const AnimatedGestureRoot=_reactNative.Animated.createAnimatedComponent(_reactNativeGestureHandler.GestureHandlerRootView),SEARCH_ICON_SIZE=18,OptionSheet=e=>{const{open:t,onClose:i,onAfterClose:r,onOpenChange:s,title:a,options:o,sections:n,renderSectionHeader:l,renderOption:c,alphabetIndex:d=!1,searchPlaceholder:u="Search…",emptyText:p="No options",labelOf:m,getValue:h,disabledOf:_,destructiveOf:x,descriptionOf:g,iconOf:b,isSelected:f,onSelect:y,multi:v=!1,searchable:j=!1,searchSelectionColor:R,accessibilityLabel:N,optionStyle:S,selectedOptionStyle:T,optionTextStyle:w,selectedOptionTextStyle:C,testID:k}=e,I=(0,_index.useTheme)(),V=(0,_usePresenceMotion.usePresenceMotion)(),[M,z]=(0,_ModalSafeArea.useModalInsets)(),D=(0,_react.useMemo)(()=>buildStyles(I),[I]),[A,P]=(0,_react.useState)(""),L=_reactNative.Dimensions.get("window").height,H=Math.round(.7*L),[O,W]=(0,_react.useState)(t),B=(0,_react.useRef)((0,_index.createAnimatedValue)(0)).current,E=(0,_react.useRef)((0,_index.createAnimatedValue)(H)).current,q=(0,_react.useRef)((0,_index.createAnimatedValue)(0)).current,F=(0,_react.useMemo)(()=>V.reduced?q:_reactNative.Animated.add(E,q),[V.reduced,E,q]),G=(0,_react.useMemo)(()=>V.reduced?E.interpolate({inputRange:[0,H],outputRange:[1,0],extrapolate:"clamp"}):1,[V.reduced,E,H]),{handleGesture:K,opacity:$}=(0,_useDragToDismiss.useDragToDismiss)({drag:q,travel:H,onDismiss:i}),J=(0,_react.useMemo)(()=>_reactNative.Animated.multiply(G,$),[G,$]),U=(0,_react.useMemo)(()=>{const e=I.colors.scrim;return B.interpolate({inputRange:[0,1],outputRange:[(0,_color.transparentOf)(e),e]})},[B,I.colors.scrim]);(0,_react.useEffect)(()=>{t&&(_reactNative.Keyboard.dismiss(),W(!0))},[t]);const Y=(0,_react.useRef)(s);Y.current=s;const Z=(0,_react.useRef)(!1);(0,_react.useEffect)(()=>{Z.current!==t&&(Z.current=t,Y.current?.(t))},[t]);const Q=(0,_react.useRef)(r);Q.current=r;const X=(0,_react.useRef)(O);(0,_react.useEffect)(()=>{X.current&&!O&&"ios"!==_reactNative.Platform.OS&&Q.current?.(),X.current=O},[O]),(0,_react.useEffect)(()=>{if(!O)return;t&&((0,_index.setNativeValue)(q,0),(0,_index.setNativeValue)($,1));const e=t?_reactNative.Animated.parallel([_reactNative.Animated.timing(B,{toValue:1,duration:V.duration("default"),easing:_reactNative.Easing.bezier(...I.motion.ease["in-out"]),useNativeDriver:!1}),V.reduced?_reactNative.Animated.timing(E,{toValue:0,duration:V.duration("default"),easing:_reactNative.Easing.bezier(...I.motion.ease["in-out"]),useNativeDriver:!0}):_reactNative.Animated.spring(E,{toValue:0,damping:I.motion.spring.snappy.damping,stiffness:I.motion.spring.snappy.stiffness,mass:I.motion.spring.snappy.mass,useNativeDriver:!0})]):_reactNative.Animated.parallel([_reactNative.Animated.timing(B,{toValue:0,duration:V.duration("default"),easing:_reactNative.Easing.bezier(...I.motion.ease["in-out"]),useNativeDriver:!1}),_reactNative.Animated.timing(E,{toValue:H,duration:V.duration("fast"),easing:_reactNative.Easing.bezier(...I.motion.ease.accelerate),useNativeDriver:!0})]);return e.start(({finished:e})=>{e&&!t&&W(!1)}),()=>e.stop()},[t,O,B,E,q,$,H,V,I.motion.ease["in-out"],I.motion.ease.accelerate,I.motion.spring.snappy]);const ee=(0,_react.useMemo)(()=>_reactNativeGestureHandler.Gesture.Native(),[]),[te,ie]=(0,_react.useState)(0),re=(0,_reactNativeKeyboardController.useKeyboardState)(e=>e.height),se=O?Math.max(0,Math.round(re)):0,ae=Math.max(M.top,_reactNative.StatusBar.currentHeight??0)+I.space.sm,oe=se>0,ne=oe?Math.max(0,Math.min(H,(te>0?te:L)-se-ae)):H;(0,_react.useEffect)(()=>{t||P("")},[t]);const le=(0,_react.useMemo)(()=>{const e=j?A.trim().toLowerCase():"",matches=t=>0===e.length||m(t).toLowerCase().includes(e)||(g(t)??"").toLowerCase().includes(e);if(!n)return o.filter(matches).map(e=>({kind:"option",option:e}));const t=[];return n.forEach((e,i)=>{const r=e.options.filter(matches);if(0!==r.length){t.push({kind:"header",title:e.title});for(const e of r)t.push({kind:"option",option:e,section:i})}}),t},[j,A,o,n,m,g]),ce=(0,_react.useCallback)(()=>{i()},[i]),de=(0,_react.useRef)(null),ue=(0,_react.useMemo)(()=>{const e=new Map;if(!d)return e;let t=0;if(n)for(let e=le.length-1;e>=0;e-=1)if("header"===le[e].kind){t=e+1;break}for(let i=t;i<le.length;i+=1){const t=le[i];if("option"!==t.kind)continue;const r=m(t.option).trim().charAt(0).toUpperCase(),s=/^[A-Z]$/.test(r)?r:"#";e.has(s)||e.set(s,i)}return e},[d,le,n,m]),pe=d&&ue.size>0&&0===A.trim().length,me=(0,_react.useMemo)(()=>[..."ABCDEFGHIJKLMNOPQRSTUVWXYZ",...ue.has("#")?["#"]:[]],[ue]),he=(0,_react.useCallback)(e=>{const t=ue.get(e);void 0!==t&&de.current?.scrollToIndex({index:t,animated:!0,viewPosition:0})},[ue]),xe=(0,_react.useRef)(null),ge=(0,_react.useCallback)(()=>{null!==xe.current&&(clearTimeout(xe.current),xe.current=null)},[]),be=(0,_react.useCallback)(e=>{de.current?.scrollToOffset({offset:e.averageItemLength*e.index,animated:!1}),ge(),xe.current=setTimeout(()=>{xe.current=null,de.current?.scrollToIndex({index:e.index,animated:!0,viewPosition:0})},50)},[ge]);(0,_react.useEffect)(()=>(O||ge(),ge),[O,ge]);return(0,_jsxRuntime.jsx)(_reactNative.Modal,{visible:O,transparent:!0,animationType:"none",onRequestClose:ce,onDismiss:()=>Q.current?.(),statusBarTranslucent:!0,navigationBarTranslucent:!0,children:(0,_jsxRuntime.jsx)(_ModalSafeArea.ModalSafeArea,{onInsets:z,children:(0,_jsxRuntime.jsxs)(AnimatedGestureRoot,{collapsable:!1,onLayout:e=>ie(e.nativeEvent.layout.height),style:[_reactNative.StyleSheet.absoluteFill,{backgroundColor:U}],children:[(0,_jsxRuntime.jsx)(_reactNative.Pressable,{style:_reactNative.StyleSheet.absoluteFill,onPress:ce,accessibilityRole:"button",accessibilityLabel:"Close picker"}),(0,_jsxRuntime.jsxs)(_reactNative.Animated.View,{testID:k,accessibilityViewIsModal:!0,accessibilityLabel:N??a??"Options",style:[D.sheet,{maxHeight:ne,bottom:se,paddingBottom:oe?I.space.lg:M.bottom+I.space.lg,backgroundColor:I.colors.surface,borderTopLeftRadius:I.radius.xl,borderTopRightRadius:I.radius.xl,..._corners.smoothCorners,opacity:J,transform:[{translateY:F}],...I.shadow.modal}],children:[(0,_jsxRuntime.jsx)(_reactNativeGestureHandler.GestureDetector,{gesture:K,children:(0,_jsxRuntime.jsxs)(_reactNative.View,{children:[(0,_jsxRuntime.jsx)(_reactNative.View,{style:D.sheetHandleRow,children:(0,_jsxRuntime.jsx)(_reactNative.View,{style:[D.sheetHandle,{backgroundColor:I.colors.border}]})}),a?(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[D.sheetTitle,{color:I.colors["text-body"],fontSize:I.text.lg.size,fontWeight:I.weight.semibold,paddingHorizontal:I.space.lg,marginBottom:I.space.sm}],children:a}):null]})}),j?(0,_jsxRuntime.jsx)(_reactNative.View,{style:[D.searchWrap,{marginHorizontal:I.space.lg,marginBottom:I.space.sm}],children:(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[D.searchBox,{backgroundColor:I.colors["bg-subtle"],borderColor:I.colors.border,borderRadius:I.radius.md,..._corners.smoothCorners,paddingHorizontal:I.space.md,gap:I.space.sm}],children:[(I.settings.icons.search??_defaultIcons.defaultIcons.search)({size:18,color:I.colors["text-subtle"]}),(0,_jsxRuntime.jsx)(_reactNative.TextInput,{value:A,onChangeText:P,placeholder:u,placeholderTextColor:I.colors["text-subtle"],selectionColor:R??I.colors["focus-ring"],accessibilityLabel:"Search options",style:[D.searchInput,{color:I.colors["text-body"],fontSize:I.text.base.size,paddingVertical:I.space.sm}]}),A.length>0?(0,_jsxRuntime.jsx)(_reactNative.Pressable,{onPress:()=>P(""),hitSlop:8,...(0,_hitSlop.hitSlopMarker)(8),accessibilityRole:"button",accessibilityLabel:"Clear search",children:(I.settings.icons.close??_defaultIcons.defaultIcons.close)({size:18,color:I.colors["text-muted"]})}):null]})}):null,(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[D.listWrap,pe?D.listRow:null],children:[(0,_jsxRuntime.jsx)(_reactNativeGestureHandler.GestureDetector,{gesture:ee,children:(0,_jsxRuntime.jsx)(_reactNative.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(0,_jsxRuntime.jsx)(_reactNative.View,{accessible:!0,accessibilityRole:"header",style:[D.sectionHeader,{paddingHorizontal:I.space.lg,paddingTop:I.space.md}],children:l?l(e.title):(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[D.sectionTitle,{color:I.colors["text-subtle"],fontSize:I.text.xs.size,fontWeight:I.weight.semibold}],children:e.title.toUpperCase()})});const t=e.option,i=m(t),r=h(t),s=g(t),a=b(t),o=f(r),n=_(t),d=x?.(t)??!1;return(0,_jsxRuntime.jsxs)(_reactNative.Pressable,{onPress:()=>y(t),disabled:n,android_ripple:{color:I.colors["surface-pressed"],borderless:!1},accessibilityRole:"button",accessibilityLabel:i,accessibilityState:{selected:o,disabled:n},"aria-selected":o,"aria-disabled":n,style:({pressed:e})=>[D.optionRow,{backgroundColor:o?I.colors["surface-selected"]:e?I.colors["surface-pressed"]:"transparent",opacity:n?.5:1,paddingHorizontal:I.space.lg,paddingVertical:I.space.md},S,o?T:null],children:[c?(0,_jsxRuntime.jsx)(_reactNative.View,{style:D.optionTextWrap,children:c(t,{selected:o,disabled:n})}):(0,_jsxRuntime.jsxs)(_jsxRuntime.Fragment,{children:[a?(0,_jsxRuntime.jsx)(_reactNative.View,{style:D.optionIcon,children:a}):null,(0,_jsxRuntime.jsxs)(_reactNative.View,{style:D.optionTextWrap,children:[(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[D.optionLabel,{color:d?I.colors["danger-text"]:o?I.colors.primary:I.colors["text-body"],fontSize:I.text.base.size,fontWeight:o?I.weight.semibold:I.weight.medium},w,o?C:null],children:i}),s?(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[D.optionDescription,{color:I.colors["text-subtle"],fontSize:I.text.sm.size}],numberOfLines:2,children:s}):null]})]}),v?(0,_jsxRuntime.jsx)(_reactNative.View,{style:[D.checkbox,{borderColor:o?I.colors.primary:I.colors.border,backgroundColor:o?I.colors.primary:"transparent"}],children:o?(0,_jsxRuntime.jsx)(_reactNative.View,{style:D.checkboxTick}):null}):o?"icon"===I.settings.components["option-sheet"]?.selectedMarker?(0,_jsxRuntime.jsx)(_reactNative.View,{style:D.singleSelectedIcon,children:(I.settings.icons.selectedTick??_defaultIcons.defaultIcons.selectedTick)({size:20,color:I.colors.primary})}):(0,_jsxRuntime.jsx)(_reactNative.View,{style:[D.singleSelectedDot,{backgroundColor:I.colors.primary}]}):null]})},onScrollToIndexFailed:be,overScrollMode:"never",bounces:!1,keyboardShouldPersistTaps:"handled",showsVerticalScrollIndicator:!pe,style:pe?D.listBesideRail:null,ListEmptyComponent:(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[D.empty,{color:I.colors["text-subtle"],fontSize:I.text.sm.size,paddingVertical:I.space.xl}],children:p})})}),pe?(0,_jsxRuntime.jsx)(_reactNative.View,{style:[D.rail,{paddingRight:I.space.xs}],accessibilityRole:"list",accessibilityLabel:"Jump to letter",testID:"option-sheet-alphabet",children:me.map(e=>{const t=ue.has(e);return(0,_jsxRuntime.jsx)(_reactNative.Pressable,{onPress:()=>he(e),disabled:!t,hitSlop:{left:8,right:8},...(0,_hitSlop.hitSlopMarker)({left:8,right:8}),accessibilityRole:"button",accessibilityLabel:`Jump to ${e}`,accessibilityState:{disabled:!t},"aria-disabled":!t,style:D.railLetter,children:(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[D.railLetterText,{color:t?I.colors.primary:I.colors["text-subtle"],fontSize:I.text.xs.size,fontWeight:I.weight.semibold,opacity:t?1:.45}],children:e})},e)})}):null]}),v?(0,_jsxRuntime.jsx)(_reactNative.View,{style:[D.sheetFooter,{borderTopColor:I.colors["border-subtle"],paddingHorizontal:I.space.lg,paddingVertical:I.space.md}],children:(0,_jsxRuntime.jsx)(_reactNative.Pressable,{onPress:ce,accessibilityRole:"button",accessibilityLabel:"Done",style:({pressed:e})=>[D.doneButton,{backgroundColor:e?I.colors["primary-pressed"]:I.colors.primary,borderRadius:I.radius.md,..._corners.smoothCorners,paddingVertical:I.space.sm,paddingHorizontal:I.space.lg}],children:(0,_jsxRuntime.jsx)(_reactNative.Text,{style:{color:I.colors["on-primary"],fontSize:I.text.base.size,fontWeight:I.weight.semibold},children:"Done"})})}):null]}),(0,_jsxRuntime.jsx)(_ToastProvider.ToastHost,{})]})})})};exports.OptionSheet=OptionSheet,OptionSheet.displayName="OptionSheet";const buildStyles=e=>_reactNative.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,..._corners.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,..._corners.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,..._corners.smoothCorners,marginLeft:e.space.md},singleSelectedIcon:{marginLeft:e.space.md},empty:{textAlign:"center"},sheetFooter:{borderTopWidth:_reactNative.StyleSheet.hairlineWidth,alignItems:"flex-end"},doneButton:{alignSelf:"flex-end"}});var _default=exports.default=OptionSheet;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";import{createContext,forwardRef,useCallback,useContext,useEffect,useImperativeHandle,useMemo,useRef,useState}from"react";import{Dimensions,Modal,Platform,ScrollView,StyleSheet,useWindowDimensions,View}from"react-native";import{Gesture,GestureDetector,GestureHandlerRootView}from"react-native-gesture-handler";import{useReanimatedKeyboardAnimation}from"react-native-keyboard-controller";import Animated,{Easing,runOnJS,useAnimatedStyle,useDerivedValue,useSharedValue,withSpring,withTiming}from"react-native-reanimated";import{useSafeAreaInsets}from"react-native-safe-area-context";import{PRESENCE_REDUCE_MOTION,usePresenceMotion}from"../../hooks/usePresenceMotion.js";import{useTheme}from"../../theme/index.js";import{triggerHaptic}from"../../utils/index.js";import{smoothCorners}from"../../utils/corners.js";import{ModalSafeArea,useModalInsets}from"../ModalSafeArea/ModalSafeArea.js";import{ToastHost}from"../Toast/ToastProvider.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const TABLET_MIN_SHORT_SIDE=600,DIALOG_MAX_WIDTH=560,BottomSheetContext=createContext(null);export const useBottomSheet=()=>{const e=useContext(BottomSheetContext);if(!e)throw new Error("useBottomSheet must be used inside a <BottomSheet>.");return e};const SPRING_CONFIG={damping:20,stiffness:240,mass:1},CLOSE_VELOCITY_THRESHOLD=1e3,DRAG_ACTIVATION_OFFSET=10,BottomSheet=forwardRef((e,t)=>{const{snapPoints:o,index:s,onChange:n,onAnimate:r,onAfterClose:a,enablePanDownToClose:l=!0,enableBackdropPress:i=!0,confirmDismiss:u,scrollable:c=!1,scrollRef:d,onScroll:h,onContentSizeChange:m,onScrollLayout:f,scrollEventThrottle:b,keyboardBehavior:p="shift",mode:S="modal",presentation:v="sheet",animateMount:g=!0,handleIndicatorStyle:y,containerStyle:w,header:C,footer:x,headerStyle:M,footerStyle:R,children:k,accessibilityLabel:_,accessibilityViewIsModal:E,testID:I}=e,T=useTheme(),j=usePresenceMotion(),O=useSafeAreaInsets(),[A,D]=useState(()=>Dimensions.get("window").height),[V,P]=useState(()=>Dimensions.get("window").width),H=useCallback(e=>{const{height:t,width:o}=e.nativeEvent.layout;t>0&&D(e=>e===t?e:t),o>0&&P(e=>e===o?e:o)},[]),B=useWindowDimensions(),N="dialog"===v||"auto"===v&&Math.min(B.width,B.height)>=600,G=Math.min(560,V-2*T.space.xl),[L,F]=useModalInsets(),J="modal"===S?L.top:O.top,z="modal"===S?L.bottom:O.bottom,U=o.includes("content"),[Y,$]=useMeasuredHeight(),[q,W]=useMeasuredHeight(),[K,X,Q]=useMeasuredHeight(),[Z,ee]=useMeasuredHeight(),te=N?T.space.md:Y,oe=U?Math.min(te+(null!=C?q:0)+K+(null!=x?Z:0)+z,A-J):0,se=useCallback((e,t)=>{U&&Q(t),m?.(e,t)},[U,m,Q]),ne=useMemo(()=>resolveSnapPoints(o,A,oe),[o,A,oe]),re=A,ae=ne[ne.length-1]??0,le=useSharedValue(re),ie=useSharedValue(re),ue=useSharedValue(1),ce=useSharedValue(-1),[de,he]=useState(-1),me=useRef(!1),[fe,be]=useState(!1),[pe,Se]=useState(!1),ve=useRef(!1),ge=useRef(a);ge.current=a;const[ye,we]=useState(!1),Ce=useRef(!g&&"number"==typeof s&&s>=0),xe=useRef(-1),Me=useRef(!1);Me.current="modal"===S?pe:ye;const Re=useRef(u);Re.current=u;const ke=useRef(!1),Ee=useRef(!0),Ie=useRef([]),Te=useCallback(e=>{const t=Ie.current;Ie.current=[];for(const o of t)o(e)},[]);useEffect(()=>(Ee.current=!0,()=>{Ee.current=!1,Te(!1)}),[Te]);const je=useCallback(e=>{if(e<0||e>=ne.length)return re;const t=ne[e];return N?(A-t)/2:A-t},[ne,A,re,N]),Oe=useCallback(e=>{xe.current=e;de!==e&&(he(e),ce.value=e,n?.(e))},[de,ce,n]),Ae=useCallback(()=>{me.current=!1,ce.value<0&&(ve.current=!0,"modal"===S?(be(!1),"ios"!==Platform.OS&&Se(!1)):we(!1))},[S,ce]),De=useCallback(()=>{ve.current&&Se(!1)},[]);useEffect(()=>{("modal"===S?!pe:!ye)&&ve.current&&(ve.current=!1,ge.current?.(),Te(!0))},[S,pe,ye,Te]);const Ve=useCallback((e,t,o)=>{me.current=!0,r?.(t,o),le.value=withSpring(e,SPRING_CONFIG,e=>{"worklet";e&&runOnJS(Ae)()})},[r,le,Ae]),Pe=useCallback(e=>{const t="number"==typeof e?clamp(e,0,ne.length-1):de>=0?de:0,o=ce.value,s=je(t);return ve.current=!1,Te(!1),"modal"===S?(Se(!0),be(!0)):we(!0),o<0&&Ce.current?(le.value=s,ue.value=1,Oe(t),void r?.(o,t)):o<0&&j.reduced?(le.value=s,ue.value=0,ue.value=withTiming(1,{duration:j.duration("fast"),easing:Easing.bezier(...T.motion.ease.decelerate),reduceMotion:PRESENCE_REDUCE_MOTION}),Oe(t),void r?.(o,t)):(o<0&&(le.value=re,ue.value=1),Oe(t),void Ve(s,o,t))},[Ve,re,de,ce,S,r,j,ue,ne.length,Oe,Te,T.motion.ease.decelerate,le,je]),He=useCallback(()=>{if(0===ne.length)return;const e=ce.value,t=je(0);Oe(0),Ve(t,e,0)},[Ve,ce,ne.length,Oe,je]),Be=useCallback(()=>new Promise(e=>{if(xe.current<0)return void(Me.current?Ie.current.push(e):e(!0));Ie.current.push(e),Ce.current=!1;const t=ce.value;Oe(-1),me.current=!0,r?.(t,-1);const o=j.reduced?ue:le,s=j.reduced?0:re;o.value=withTiming(s,{duration:j.duration("fast"),easing:Easing.bezier(...T.motion.ease.accelerate),reduceMotion:PRESENCE_REDUCE_MOTION},e=>{"worklet";e&&runOnJS(Ae)()})}),[re,ce,Ae,r,j,ue,Oe,le,T.motion.ease.accelerate]),Ne=useCallback(async()=>{await Be()},[Be]),Ge=useCallback((e,t,o)=>{const s=Re.current;if(!s)return void e();if(ke.current)return void t?.();const n=s();"boolean"!=typeof n?(ke.current=!0,o?.(),n.then(o=>{ke.current=!1,o&&Ee.current&&xe.current>=0?e():t?.()},e=>{throw ke.current=!1,e})):(n?e:t)?.()},[]),Le=useCallback(()=>new Promise(e=>{xe.current<0?Be().then(e):Ge(()=>{Be().then(e)},()=>e(!1))}),[Be,Ge]),Fe=useCallback(()=>{i&&Le()},[i,Le]);useImperativeHandle(t,()=>({expand:Pe,collapse:He,close:Ne,requestClose:Le}),[Pe,He,Ne,Le]),useEffect(()=>{"number"==typeof s&&s!==de&&(-1===s?Ne():Pe(s))},[s]);const Je=useRef({hostHeight:A,contentSnap:oe});useEffect(()=>{const e=Je.current;if(e.hostHeight===A&&e.contentSnap===oe)return;if(Je.current={hostHeight:A,contentSnap:oe},e.hostHeight===A&&ce.value<0)return;const t=je(ce.value);le.value=Ce.current?t:withSpring(t,SPRING_CONFIG)},[A,oe]);const ze=A-ae,Ue=useMemo(()=>ne.map(e=>A-e),[ne,A]),Ye=useCallback(()=>{const e=xe.current;e<0||Ve(je(e),e,e)},[Ve,je]),$e=useCallback((e,t)=>{const o=ce.value;-1!==e?(Oe(e),Ve(t,o,e)):Ge(()=>{triggerHaptic("selection"),Ne()},Ye,Ye)},[Ve,Ne,ce,Ge,Oe,Ye]),qe=useMemo(()=>Gesture.Native().withTestId(I?`${I}-content-gesture`:"bottom-sheet-content-gesture"),[I]),We=useMemo(()=>{const e=Ue,t=re,o=ze,s=l;return Gesture.Pan().withTestId(I?`${I}-pan-gesture`:"bottom-sheet-pan-gesture").activeOffsetY([-10,10]).failOffsetX([-15,15]).onStart(()=>{"worklet";ie.value=le.value}).onUpdate(e=>{"worklet";const t=ie.value+e.translationY;le.value=t<o?o+.25*(t-o):t}).onEnd(o=>{"worklet";const n=le.value;if(o.velocityY>1e3)return s?void runOnJS($e)(-1,t):void runOnJS($e)(0,e[0]);let r=0,a=Math.abs(n-e[0]);for(let t=1;t<e.length;t++){const o=Math.abs(n-e[t]);o<a&&(a=o,r=t)}const l=e[0];s&&n-l>80?runOnJS($e)(-1,t):runOnJS($e)(r,e[r])})},[re,ie,l,$e,ze,Ue,I,le]),{height:Ke}=useReanimatedKeyboardAnimation(),Xe="shift"===p,Qe=useDerivedValue(()=>Xe?Ke.value:0),Ze=ne[de>=0?de:0]??ae,et=T.space.md,tt=useAnimatedStyle(()=>{if(N){const e=Qe.value,t=A+e-Ze-et,o=e<0&&le.value>t?t:le.value;return{top:o<J?J:o,opacity:ue.value}}const e=le.value+Qe.value,t=Qe.value<0?J:ze;return{top:e<t?t:e,opacity:ue.value}}),ot=useAnimatedStyle(()=>{const e=Qe.value;if(N){const t=A+e-Ze-et,o=e<0&&le.value>t?t:le.value,s=A+e-et-(o<J?J:o);return{height:s<0?0:s>Ze?Ze:s}}const t=e<0?J:ze,o=le.value+e,s=A+e-(o<t?t:o);return{height:s<0?0:s>ae?ae:s}}),st=de>=0,nt=useMemo(()=>buildStyles(T),[T]),rt=useCallback(()=>{i&&Ge(()=>{triggerHaptic("selection"),Ne()})},[i,Ne,Ge]),at=useMemo(()=>Gesture.Tap().withTestId(I?`${I}-backdrop-gesture`:"bottom-sheet-backdrop-gesture").maxDuration(250).onEnd((_e,e)=>{"worklet";e&&runOnJS(rt)()}),[rt,I]),lt=useMemo(()=>({snapIndex:de,snapPoints:ne,expand:Pe,collapse:He,close:Ne,requestClose:Le}),[de,ne,Pe,He,Ne,Le]);if("inline"===S&&!ye)return null;if("modal"===S&&!pe)return null;const it=_jsxs(View,{collapsable:!1,style:["modal"===S?nt.backdropModal:nt.backdropInline,{backgroundColor:T.colors.scrim}],onLayout:H,testID:I,accessibilityViewIsModal:E??st,children:[_jsx(GestureDetector,{gesture:at,children:_jsx(Animated.View,{style:StyleSheet.absoluteFill,accessibilityRole:"button",accessibilityLabel:"Close bottom sheet"})}),_jsx(Animated.View,{accessibilityRole:"alert",accessibilityLabel:_,accessibilityViewIsModal:E??st,accessibilityActions:[{name:"escape",label:"Close bottom sheet"}],onAccessibilityAction:e=>{"escape"===e.nativeEvent.actionName&&Fe()},onAccessibilityEscape:Fe,style:[nt.sheet,{height:ae,backgroundColor:T.colors.surface,borderTopLeftRadius:T.radius.xl,borderTopRightRadius:T.radius.xl,...smoothCorners,...T.shadow.modal},N?{height:Ze,left:(V-G)/2,right:void 0,width:G,borderBottomLeftRadius:T.radius.xl,borderBottomRightRadius:T.radius.xl}:null,w,tt],children:_jsxs(SheetBody,{style:[nt.body,ot],keyboardOffset:Qe,children:[N?_jsx(View,{style:{height:T.space.md}}):_jsx(GestureDetector,{gesture:We,children:_jsx(View,{style:nt.handleRow,onLayout:U?$:void 0,accessible:!0,accessibilityLabel:"Drag handle",accessibilityHint:"Drag up or down to resize the sheet, or swipe down to close it",testID:I?`${I}-handle`:"bottom-sheet-handle",children:_jsx(View,{style:[nt.handle,{backgroundColor:T.colors.border},y]})})}),null!=C&&_jsx(View,{style:[nt.header,M],onLayout:U?W:void 0,children:C}),c?_jsx(GestureDetector,{gesture:qe,children:_jsx(ScrollView,{ref:d,style:nt.scrollContent,onScroll:h,onContentSizeChange:se,onLayout:f,scrollEventThrottle:b,keyboardShouldPersistTaps:"always",keyboardDismissMode:"none",children:k})}):_jsx(View,{style:U?[nt.content,{overflow:"visible"}]:nt.content,children:U?_jsx(View,{onLayout:X,children:k}):k}),null!=x&&_jsx(View,{style:[nt.footer,R],onLayout:U?ee:void 0,children:x})]})})]}),ut=_jsx(BottomSheetContext.Provider,{value:lt,children:it});return"modal"===S?_jsx(Modal,{transparent:!0,visible:fe,onRequestClose:Fe,onDismiss:"ios"===Platform.OS?De:void 0,statusBarTranslucent:!0,navigationBarTranslucent:!0,animationType:"none",supportedOrientations:["portrait","landscape"],children:_jsxs(ModalSafeArea,{onInsets:F,children:["android"===Platform.OS?_jsx(GestureHandlerRootView,{style:nt.modalRoot,children:ut}):ut,_jsx(ToastHost,{})]})}):ut}),SheetBody=({style:e,keyboardOffset:t,children:o})=>{const s=useSafeAreaInsets().bottom,n=useAnimatedStyle(()=>{const e=s+t.value;return{paddingBottom:e>0?e:0}});return _jsx(Animated.View,{style:[e,n],children:o})};BottomSheet.displayName="BottomSheet";const useMeasuredHeight=()=>{const[e,t]=useState(0),o=useCallback(e=>{t(t=>t===e?t:e)},[]);return[e,useCallback(e=>o(e.nativeEvent.layout.height),[o]),o]},resolveSnapPoints=(e,t,o)=>[...e.map(e=>{if("number"==typeof e)return e;if("content"===e)return o;const s=parseFloat(e);return Number.isNaN(s)?0:s/100*t})].sort((e,t)=>e-t),clamp=(e,t,o)=>Math.min(Math.max(e,t),o),buildStyles=e=>StyleSheet.create({backdropModal:{flex:1},backdropInline:{...StyleSheet.absoluteFill},sheet:{position:"absolute",left:0,right:0,overflow:"hidden"},body:{overflow:"hidden"},handleRow:{alignItems:"center",justifyContent:"center",alignSelf:"stretch",paddingTop:e.space.md,paddingBottom:e.space.xl},header:{},footer:{},handle:{width:36,height:4,borderRadius:e.radius.pill,...smoothCorners},content:{flex:1,overflow:"hidden"},scrollContent:{flex:1},modalRoot:{flex:1}});export{BottomSheet};export default BottomSheet;
|
|
1
|
+
"use strict";import{createContext,forwardRef,useCallback,useContext,useEffect,useImperativeHandle,useMemo,useRef,useState}from"react";import{Dimensions,Keyboard,Modal,Platform,ScrollView,StyleSheet,useWindowDimensions,View}from"react-native";import{Gesture,GestureDetector,GestureHandlerRootView}from"react-native-gesture-handler";import{useReanimatedKeyboardAnimation}from"react-native-keyboard-controller";import Animated,{Easing,runOnJS,useAnimatedStyle,useDerivedValue,useSharedValue,withSpring,withTiming}from"react-native-reanimated";import{useSafeAreaInsets}from"react-native-safe-area-context";import{PRESENCE_REDUCE_MOTION,usePresenceMotion}from"../../hooks/usePresenceMotion.js";import{useTheme}from"../../theme/index.js";import{triggerHaptic}from"../../utils/index.js";import{smoothCorners}from"../../utils/corners.js";import{ModalSafeArea,useModalInsets}from"../ModalSafeArea/ModalSafeArea.js";import{ToastHost}from"../Toast/ToastProvider.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const TABLET_MIN_SHORT_SIDE=600,DIALOG_MAX_WIDTH=560,BottomSheetContext=createContext(null);export const useBottomSheet=()=>{const e=useContext(BottomSheetContext);if(!e)throw new Error("useBottomSheet must be used inside a <BottomSheet>.");return e};const SPRING_CONFIG={damping:20,stiffness:240,mass:1},CLOSE_VELOCITY_THRESHOLD=1e3,DRAG_ACTIVATION_OFFSET=10,BottomSheet=forwardRef((e,t)=>{const{snapPoints:o,index:s,onChange:n,onAnimate:r,onAfterClose:a,enablePanDownToClose:l=!0,enableBackdropPress:i=!0,confirmDismiss:u,scrollable:c=!1,scrollRef:d,onScroll:h,onContentSizeChange:m,onScrollLayout:f,scrollEventThrottle:b,keyboardBehavior:p="shift",mode:S="modal",presentation:v="sheet",animateMount:y=!0,handleIndicatorStyle:g,containerStyle:w,header:C,footer:x,headerStyle:M,footerStyle:R,children:k,accessibilityLabel:_,accessibilityViewIsModal:E,testID:I}=e,T=useTheme(),j=usePresenceMotion(),O=useSafeAreaInsets(),[A,D]=useState(()=>Dimensions.get("window").height),[V,P]=useState(()=>Dimensions.get("window").width),H=useCallback(e=>{const{height:t,width:o}=e.nativeEvent.layout;t>0&&D(e=>e===t?e:t),o>0&&P(e=>e===o?e:o)},[]),B=useWindowDimensions(),N="dialog"===v||"auto"===v&&Math.min(B.width,B.height)>=600,G=Math.min(560,V-2*T.space.xl),[L,F]=useModalInsets(),J="modal"===S?L.top:O.top,z="modal"===S?L.bottom:O.bottom,K=o.includes("content"),[U,Y]=useMeasuredHeight(),[$,q]=useMeasuredHeight(),[W,X,Q]=useMeasuredHeight(),[Z,ee]=useMeasuredHeight(),te=N?T.space.md:U,oe=K?Math.min(te+(null!=C?$:0)+W+(null!=x?Z:0)+z,A-J):0,se=useCallback((e,t)=>{K&&Q(t),m?.(e,t)},[K,m,Q]),ne=useMemo(()=>resolveSnapPoints(o,A,oe),[o,A,oe]),re=A,ae=ne[ne.length-1]??0,le=useSharedValue(re),ie=useSharedValue(re),ue=useSharedValue(1),ce=useSharedValue(-1),[de,he]=useState(-1),me=useRef(!1),[fe,be]=useState(!1),[pe,Se]=useState(!1),ve=useRef(!1),ye=useRef(a);ye.current=a;const[ge,we]=useState(!1),Ce=useRef(!y&&"number"==typeof s&&s>=0),xe=useRef(-1),Me=useRef(!1);Me.current="modal"===S?pe:ge;const Re=useRef(u);Re.current=u;const ke=useRef(!1),Ee=useRef(!0),Ie=useRef([]),Te=useCallback(e=>{const t=Ie.current;Ie.current=[];for(const o of t)o(e)},[]);useEffect(()=>(Ee.current=!0,()=>{Ee.current=!1,Te(!1)}),[Te]);const je=useCallback(e=>{if(e<0||e>=ne.length)return re;const t=ne[e];return N?(A-t)/2:A-t},[ne,A,re,N]),Oe=useCallback(e=>{xe.current=e;de!==e&&(he(e),ce.value=e,n?.(e))},[de,ce,n]),Ae=useCallback(()=>{me.current=!1,ce.value<0&&(ve.current=!0,"modal"===S?(be(!1),"ios"!==Platform.OS&&Se(!1)):we(!1))},[S,ce]),De=useCallback(()=>{ve.current&&Se(!1)},[]);useEffect(()=>{("modal"===S?!pe:!ge)&&ve.current&&(ve.current=!1,ye.current?.(),Te(!0))},[S,pe,ge,Te]);const Ve=useCallback((e,t,o)=>{me.current=!0,r?.(t,o),le.value=withSpring(e,SPRING_CONFIG,e=>{"worklet";e&&runOnJS(Ae)()})},[r,le,Ae]),Pe=useCallback(e=>{const t="number"==typeof e?clamp(e,0,ne.length-1):de>=0?de:0,o=ce.value,s=je(t);return ve.current=!1,Te(!1),"modal"===S?(Se(!0),be(!0)):we(!0),o<0&&Ce.current?(le.value=s,ue.value=1,Oe(t),void r?.(o,t)):o<0&&j.reduced?(le.value=s,ue.value=0,ue.value=withTiming(1,{duration:j.duration("fast"),easing:Easing.bezier(...T.motion.ease.decelerate),reduceMotion:PRESENCE_REDUCE_MOTION}),Oe(t),void r?.(o,t)):(o<0&&(le.value=re,ue.value=1),Oe(t),void Ve(s,o,t))},[Ve,re,de,ce,S,r,j,ue,ne.length,Oe,Te,T.motion.ease.decelerate,le,je]),He=useCallback(()=>{if(0===ne.length)return;const e=ce.value,t=je(0);Oe(0),Ve(t,e,0)},[Ve,ce,ne.length,Oe,je]),Be=useCallback(()=>new Promise(e=>{if(xe.current<0)return void(Me.current?Ie.current.push(e):e(!0));Ie.current.push(e),Ce.current=!1;const t=ce.value;Oe(-1),me.current=!0,r?.(t,-1);const o=j.reduced?ue:le,s=j.reduced?0:re;o.value=withTiming(s,{duration:j.duration("fast"),easing:Easing.bezier(...T.motion.ease.accelerate),reduceMotion:PRESENCE_REDUCE_MOTION},e=>{"worklet";e&&runOnJS(Ae)()})}),[re,ce,Ae,r,j,ue,Oe,le,T.motion.ease.accelerate]),Ne=useCallback(async()=>{await Be()},[Be]),Ge=useCallback((e,t,o)=>{const s=Re.current;if(!s)return void e();if(ke.current)return void t?.();const n=s();"boolean"!=typeof n?(ke.current=!0,o?.(),n.then(o=>{ke.current=!1,o&&Ee.current&&xe.current>=0?e():t?.()},e=>{throw ke.current=!1,e})):(n?e:t)?.()},[]),Le=useCallback(()=>new Promise(e=>{xe.current<0?Be().then(e):Ge(()=>{Be().then(e)},()=>e(!1))}),[Be,Ge]),Fe=useCallback(()=>{i&&Le()},[i,Le]);useImperativeHandle(t,()=>({expand:Pe,collapse:He,close:Ne,requestClose:Le}),[Pe,He,Ne,Le]),useEffect(()=>{"number"==typeof s&&s!==de&&(-1===s?Ne():Pe(s))},[s]);const Je=useRef({hostHeight:A,contentSnap:oe});useEffect(()=>{const e=Je.current;if(e.hostHeight===A&&e.contentSnap===oe)return;if(Je.current={hostHeight:A,contentSnap:oe},e.hostHeight===A&&ce.value<0)return;const t=je(ce.value);le.value=Ce.current?t:withSpring(t,SPRING_CONFIG)},[A,oe]);const ze=A-ae,Ke=useMemo(()=>ne.map(e=>A-e),[ne,A]),Ue=useCallback(()=>{const e=xe.current;e<0||Ve(je(e),e,e)},[Ve,je]),Ye=useCallback((e,t)=>{const o=ce.value;-1!==e?(Oe(e),Ve(t,o,e)):Ge(()=>{Keyboard.dismiss(),triggerHaptic("selection"),Ne()},Ue,Ue)},[Ve,Ne,ce,Ge,Oe,Ue]),$e=useMemo(()=>Gesture.Native().withTestId(I?`${I}-content-gesture`:"bottom-sheet-content-gesture"),[I]),qe=useMemo(()=>{const e=Ke,t=re,o=ze,s=l;return Gesture.Pan().withTestId(I?`${I}-pan-gesture`:"bottom-sheet-pan-gesture").activeOffsetY([-10,10]).failOffsetX([-15,15]).onStart(()=>{"worklet";ie.value=le.value}).onUpdate(e=>{"worklet";const t=ie.value+e.translationY;le.value=t<o?o+.25*(t-o):t}).onEnd(o=>{"worklet";const n=le.value;if(o.velocityY>1e3)return s?void runOnJS(Ye)(-1,t):void runOnJS(Ye)(0,e[0]);let r=0,a=Math.abs(n-e[0]);for(let t=1;t<e.length;t++){const o=Math.abs(n-e[t]);o<a&&(a=o,r=t)}const l=e[0];s&&n-l>80?runOnJS(Ye)(-1,t):runOnJS(Ye)(r,e[r])})},[re,ie,l,Ye,ze,Ke,I,le]),{height:We}=useReanimatedKeyboardAnimation(),Xe="shift"===p,Qe=useDerivedValue(()=>Xe?We.value:0),Ze=ne[de>=0?de:0]??ae,et=T.space.md,tt=useAnimatedStyle(()=>{if(N){const e=Qe.value,t=A+e-Ze-et,o=e<0&&le.value>t?t:le.value;return{top:o<J?J:o,opacity:ue.value}}const e=le.value+Qe.value,t=Qe.value<0?J:ze;return{top:e<t?t:e,opacity:ue.value}}),ot=useAnimatedStyle(()=>{const e=Qe.value;if(N){const t=A+e-Ze-et,o=e<0&&le.value>t?t:le.value,s=A+e-et-(o<J?J:o);return{height:s<0?0:s>Ze?Ze:s}}const t=e<0?J:ze,o=le.value+e,s=A+e-(o<t?t:o);return{height:s<0?0:s>ae?ae:s}}),st=de>=0,nt=useMemo(()=>buildStyles(T),[T]),rt=useCallback(()=>{i&&Ge(()=>{triggerHaptic("selection"),Ne()})},[i,Ne,Ge]),at=useMemo(()=>Gesture.Tap().withTestId(I?`${I}-backdrop-gesture`:"bottom-sheet-backdrop-gesture").maxDuration(250).onEnd((_e,e)=>{"worklet";e&&runOnJS(rt)()}),[rt,I]),lt=useMemo(()=>({snapIndex:de,snapPoints:ne,expand:Pe,collapse:He,close:Ne,requestClose:Le}),[de,ne,Pe,He,Ne,Le]);if("inline"===S&&!ge)return null;if("modal"===S&&!pe)return null;const it=_jsxs(View,{collapsable:!1,style:["modal"===S?nt.backdropModal:nt.backdropInline,{backgroundColor:T.colors.scrim}],onLayout:H,testID:I,accessibilityViewIsModal:E??st,children:[_jsx(GestureDetector,{gesture:at,children:_jsx(Animated.View,{style:StyleSheet.absoluteFill,accessibilityRole:"button",accessibilityLabel:"Close bottom sheet"})}),_jsx(Animated.View,{accessibilityRole:"alert",accessibilityLabel:_,accessibilityViewIsModal:E??st,accessibilityActions:[{name:"escape",label:"Close bottom sheet"}],onAccessibilityAction:e=>{"escape"===e.nativeEvent.actionName&&Fe()},onAccessibilityEscape:Fe,style:[nt.sheet,{height:ae,backgroundColor:T.colors.surface,borderTopLeftRadius:T.radius.xl,borderTopRightRadius:T.radius.xl,...smoothCorners,...T.shadow.modal},N?{height:Ze,left:(V-G)/2,right:void 0,width:G,borderBottomLeftRadius:T.radius.xl,borderBottomRightRadius:T.radius.xl}:null,w,tt],children:_jsxs(SheetBody,{style:[nt.body,ot],keyboardOffset:Qe,children:[N?_jsx(View,{style:{height:T.space.md}}):_jsx(GestureDetector,{gesture:qe,children:_jsx(View,{style:nt.handleRow,onLayout:K?Y:void 0,accessible:!0,accessibilityLabel:"Drag handle",accessibilityHint:"Drag up or down to resize the sheet, or swipe down to close it",testID:I?`${I}-handle`:"bottom-sheet-handle",children:_jsx(View,{style:[nt.handle,{backgroundColor:T.colors.border},g]})})}),null!=C&&_jsx(View,{style:[nt.header,M],onLayout:K?q:void 0,children:C}),c?_jsx(GestureDetector,{gesture:$e,children:_jsx(ScrollView,{ref:d,style:nt.scrollContent,onScroll:h,onContentSizeChange:se,onLayout:f,scrollEventThrottle:b,keyboardShouldPersistTaps:"always",keyboardDismissMode:"none",children:k})}):_jsx(View,{style:K?[nt.content,{overflow:"visible"}]:nt.content,children:K?_jsx(View,{onLayout:X,children:k}):k}),null!=x&&_jsx(View,{style:[nt.footer,R],onLayout:K?ee:void 0,children:x})]})})]}),ut=_jsx(BottomSheetContext.Provider,{value:lt,children:it});return"modal"===S?_jsx(Modal,{transparent:!0,visible:fe,onRequestClose:Fe,onDismiss:"ios"===Platform.OS?De:void 0,statusBarTranslucent:!0,navigationBarTranslucent:!0,animationType:"none",supportedOrientations:["portrait","landscape"],children:_jsxs(ModalSafeArea,{onInsets:F,children:["android"===Platform.OS?_jsx(GestureHandlerRootView,{style:nt.modalRoot,children:ut}):ut,_jsx(ToastHost,{})]})}):ut}),SheetBody=({style:e,keyboardOffset:t,children:o})=>{const s=useSafeAreaInsets().bottom,n=useAnimatedStyle(()=>{const e=s+t.value;return{paddingBottom:e>0?e:0}});return _jsx(Animated.View,{style:[e,n],children:o})};BottomSheet.displayName="BottomSheet";const useMeasuredHeight=()=>{const[e,t]=useState(0),o=useCallback(e=>{t(t=>t===e?t:e)},[]);return[e,useCallback(e=>o(e.nativeEvent.layout.height),[o]),o]},resolveSnapPoints=(e,t,o)=>[...e.map(e=>{if("number"==typeof e)return e;if("content"===e)return o;const s=parseFloat(e);return Number.isNaN(s)?0:s/100*t})].sort((e,t)=>e-t),clamp=(e,t,o)=>Math.min(Math.max(e,t),o),buildStyles=e=>StyleSheet.create({backdropModal:{flex:1},backdropInline:{...StyleSheet.absoluteFill},sheet:{position:"absolute",left:0,right:0,overflow:"hidden"},body:{overflow:"hidden"},handleRow:{alignItems:"center",justifyContent:"center",alignSelf:"stretch",paddingTop:e.space.md,paddingBottom:e.space.xl},header:{},footer:{},handle:{width:36,height:4,borderRadius:e.radius.pill,...smoothCorners},content:{flex:1,overflow:"hidden"},scrollContent:{flex:1},modalRoot:{flex:1}});export{BottomSheet};export default BottomSheet;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";import React,{forwardRef,useMemo}from"react";import{Animated,Image,Pressable,StyleSheet,View}from"react-native";import{useControllableState}from"../../hooks/useControllableState.js";import{usePressAnimation}from"../../hooks/usePressAnimation.js";import{fontFor,Gradient,useTheme}from"../../theme/index.js";import{smoothCorners}from"../../utils/corners.js";import{triggerHaptic}from"../../utils/hapticUtils.js";import{mergeRefs}from"../../utils/mergeRefs.js";import{supportsBoxShadow,toBoxShadow}from"../../utils/shadows.js";import{squircleHostRadius}from"../../utils/squircle.js";import{themeStyles}from"../../utils/themeStyles.js";import{AppIcon}from"../AppIcon/AppIcon.js";import{useContextMenu}from"../Menu/useContextMenu.js";import{Skeleton,SkeletonText}from"../Skeleton/index.js";import{SquircleFill,useSquircle}from"../SquircleFill/SquircleFill.js";import{Text}from"../Text/index.js";import{jsx as _jsx,jsxs as _jsxs,Fragment as _Fragment}from"react/jsx-runtime";const BACKGROUND_TOKENS=["bg","bg-subtle","bg-muted","surface","scrim","surface-inverse"],paddingMap={none:"none",sm:"sm",md:"lg",lg:"xl",xl:"2xl"},Card=React.memo(forwardRef((e,t)=>{const{children:o,variant:i="elevated",elevation:s="card",radius:r="lg",padding:l="md",interactive:a=!1,bg:n,header:d,title:c,titleFont:u="sans",lead:h,action:m,headerActions:p,collapsible:b=!1,collapsed:g,defaultCollapsed:y=!1,onCollapsedChange:x,collapsedSummary:f,onRemove:S,removeLabel:j="Remove",separatorHeight:v=StyleSheet.hairlineWidth,footer:C,imageSource:_,imageHeight:w=160,imageAspectRatio:R,imageOverlay:A,loading:k=!1,gradient:T,onPress:F,haptic:B,contextMenu:I,accessibilityLabel:H,accessibilityHint:
|
|
1
|
+
"use strict";import React,{forwardRef,useMemo}from"react";import{Animated,Image,Pressable,StyleSheet,View}from"react-native";import{useControllableState}from"../../hooks/useControllableState.js";import{usePressAnimation}from"../../hooks/usePressAnimation.js";import{fontFor,Gradient,useTheme}from"../../theme/index.js";import{smoothCorners}from"../../utils/corners.js";import{triggerHaptic}from"../../utils/hapticUtils.js";import{mergeRefs}from"../../utils/mergeRefs.js";import{supportsBoxShadow,toBoxShadow}from"../../utils/shadows.js";import{squircleHostRadius}from"../../utils/squircle.js";import{themeStyles}from"../../utils/themeStyles.js";import{AppIcon}from"../AppIcon/AppIcon.js";import{useContextMenu}from"../Menu/useContextMenu.js";import{Skeleton,SkeletonText}from"../Skeleton/index.js";import{SquircleFill,useSquircle}from"../SquircleFill/SquircleFill.js";import{Text}from"../Text/index.js";import{jsx as _jsx,jsxs as _jsxs,Fragment as _Fragment}from"react/jsx-runtime";const BACKGROUND_TOKENS=["bg","bg-subtle","bg-muted","surface","scrim","surface-inverse"],paddingMap={none:"none",sm:"sm",md:"lg",lg:"xl",xl:"2xl"},Card=React.memo(forwardRef((e,t)=>{const{children:o,variant:i="elevated",elevation:s="card",radius:r="lg",padding:l="md",interactive:a=!1,bg:n,header:d,title:c,titleFont:u="sans",lead:h,action:m,headerActions:p,collapsible:b=!1,collapsed:g,defaultCollapsed:y=!1,onCollapsedChange:x,collapsedSummary:f,onRemove:S,removeLabel:j="Remove",separatorHeight:v=StyleSheet.hairlineWidth,footer:C,imageSource:_,imageHeight:w=160,imageAspectRatio:R,imageOverlay:A,loading:k=!1,gradient:T,onPress:F,haptic:B,contextMenu:I,accessibilityLabel:H,accessibilityHint:V,accessibilityRole:L,style:P,containerStyle:z,headerStyle:M,bodyStyle:q,footerStyle:O,borderRadius:W,testID:D,onLayout:N,...E}=e,G=useTheme(),K=a||"function"==typeof F,U=useContextMenu(I,{haptic:B||!1,testID:D,accessibilityActions:E.accessibilityActions,onAccessibilityAction:E.onAccessibilityAction}),$=useMemo(()=>mergeRefs(t,U.hostRef),[t,U.hostRef]),J=K||U.enabled,{style:Q,pressIn:X,pressOut:Y}=usePressAnimation({enabled:J}),Z=stylesFor(G),ee=Boolean(_),te=G.space[paddingMap[l]],oe=useMemo(()=>T?"string"==typeof T?G.settings.gradients[T]??null:T:null,[T,G.settings.gradients]),ie="flat"===i,se=ie?G.radius.none:W??G.radius[r],re=resolveBackground(G,n),[le,ae]=useControllableState({value:g,defaultValue:y,onChange:x}),ne=b&&le,de=hasBuiltInHeaderContent(e),ce=Boolean(d)||de,ue=useSquircle(!ee&&!oe&&!ie,se,N),he=StyleSheet.flatten([P,z])??{},me=he.backgroundColor,pe=he.borderColor,be=me??re??("filled"===i?G.colors["bg-subtle"]:G.colors.surface),ge="outlined"===i?G.size.border:0,ye=pe??G.colors.border,xe="none"===s?void 0:G.shadow[s],fe="elevated"===i&&supportsBoxShadow()&&xe?toBoxShadow(xe):void 0,Se=ue.active&&"elevated"===i&&!fe,je=ue.active&&!Se?{backgroundColor:"transparent",borderColor:"transparent"}:null,ve=useMemo(()=>{const e={borderRadius:Se&&ue.size?squircleHostRadius(ue.size.width,ue.size.height,se):se,...smoothCorners,padding:ee||ue.active?G.space.none:te,overflow:ue.active?"visible":"hidden"};switch(i){case"flat":return{...e,backgroundColor:re??G.colors.surface,borderBottomWidth:v,borderBottomColor:G.colors.border};case"outlined":return{...e,backgroundColor:ue.active?"transparent":re??G.colors.surface,borderWidth:G.size.border,borderColor:ue.active?"transparent":G.colors.border};case"filled":return{...e,backgroundColor:ue.active?"transparent":re??G.colors["bg-subtle"]};default:return{...e,backgroundColor:re??G.colors.surface,...fe?{boxShadow:fe}:xe}}},[G,i,xe,se,ee,te,ue.active,ue.size,fe,Se,re,v]),Ce=useMemo(()=>({..."number"==typeof R?{width:"100%",aspectRatio:R}:{width:"100%",height:w},borderTopLeftRadius:se,borderTopRightRadius:se,borderBottomLeftRadius:G.radius.none,borderBottomRightRadius:G.radius.none,...smoothCorners}),[G,se,R,w]),we="string"==typeof c?c:"",Re=_jsxs(_Fragment,{children:[_jsxs(View,{style:Z.titleColumn,children:["string"==typeof c?_jsx(Text,{variant:"title",accessibilityRole:"header",style:titleFaceFor(G,u),children:c}):c,h?_jsx(Text,{variant:"bodySmall",style:Z.lead,children:h}):null,ne&&f?_jsx(Text,{variant:"caption",style:Z.lead,children:f}):null]}),isCardTextAction(m)?_jsx(CardTextActionButton,{action:m,haptic:B}):m?_jsx(View,{style:Z.actionNode,children:m}):null,p,b?_jsx(CardIconAction,{icon:ne?"chevron-down":"chevron-up",label:`${ne?"Show":"Hide"} ${we}`.trim(),expanded:!ne,onPress:()=>ae(!ne),haptic:B}):null,S?_jsx(CardIconAction,{icon:"trash",label:j,onPress:S,color:G.colors["danger-text"],haptic:B}):null]}),Ae=_jsxs(_Fragment,{children:[ce?_jsx(View,{style:[Z.header,!d&&Z.headerRow,ne&&Z.headerFolded,M],children:d??Re}):null,ne?null:_jsx(View,{style:[ce||C?Z.body:null,q],children:o}),C&&!ne?_jsx(View,{style:[Z.footer,O],children:C}):null]}),ke=ee?_jsxs(_Fragment,{children:[_jsxs(View,{style:Z.imageWrapper,children:[_jsx(Image,{source:_,resizeMode:"cover",style:Ce,accessibilityLabel:"",accessible:!1}),A?_jsx(View,{pointerEvents:"box-none",style:Z.imageOverlay,children:A}):null]}),_jsx(View,{style:{padding:te},children:Ae})]}):Ae,Te=oe?_jsxs(_Fragment,{children:[_jsx(Gradient,{gradient:oe,style:StyleSheet.absoluteFill}),ke]}):ue.active&&ue.size?_jsxs(_Fragment,{children:[_jsx(SquircleFill,{width:ue.size.width,height:ue.size.height,radius:se,fill:be,stroke:ge?ye:void 0,strokeWidth:ge,outset:ge}),_jsx(View,{style:[Z.squircleClip,{padding:te,borderRadius:ue.size?squircleHostRadius(ue.size.width,ue.size.height,se):se}],children:ke})]}):ke;let Fe;if(J){const handlePress=e=>{K&&(B&&triggerHaptic(B),F?.(e))};Fe=_jsx(Animated.View,{style:Q,children:_jsx(Pressable,{ref:$,onPress:handlePress,onPressIn:X,onPressOut:Y,accessibilityRole:L??(K?"button":void 0),accessibilityLabel:H,accessibilityHint:V,testID:D,onLayout:ue.onLayout,style:[ve,P,z,je],...E,...U.hostProps,children:Te})})}else Fe=_jsx(View,{ref:t,accessibilityLabel:H,accessibilityHint:V,accessibilityRole:L,testID:D,onLayout:ue.onLayout,style:[ve,P,z,je],...E,children:Te});return k?_jsx(CardSkeleton,{...e}):U.enabled?_jsxs(_Fragment,{children:[Fe,U.renderSurface(_jsx(View,{style:[ve,P,z,je,Z.preview],children:Te}))]}):Fe}));Card.displayName="Card";const CardSkeleton=({variant:e="elevated",elevation:t,radius:o="lg",padding:i="md",bg:s,header:r,footer:l,imageSource:a,imageHeight:n=160,imageAspectRatio:d,borderRadius:c,containerStyle:u,headerStyle:h,bodyStyle:m,footerStyle:p,style:b,...g})=>{const y=useTheme(),x=paddingMap[i],f=y.space[x],S="flat"===e?y.radius.none:c??y.radius[o],j=void 0!==r||hasBuiltInHeaderContent(g),v=resolveBackground(y,s)??y.colors.surface,C="outlined"===e?1:0,_="outlined"===e?y.colors.border:void 0;return _jsxs(View,{style:[{backgroundColor:v,borderRadius:S,...smoothCorners,borderWidth:C,borderColor:_,overflow:"hidden"},u,b],accessibilityRole:"progressbar",accessibilityLabel:"Loading",accessibilityState:{busy:!0},"aria-busy":!0,children:[void 0!==a?_jsx(Skeleton,{width:"100%",height:d?void 0:n,style:d?{aspectRatio:d,width:"100%"}:void 0}):null,j?_jsx(View,{style:[{padding:f,paddingBottom:y.space.sm},h],children:_jsx(Skeleton,{shape:"text",width:"60%",height:18})}):null,_jsx(View,{style:[{padding:f},m],children:_jsx(SkeletonText,{lines:3,fontSize:y.text.base.size,lastLineWidth:"55%"})}),void 0!==l?_jsx(View,{style:[{padding:f,paddingTop:y.space.sm,flexDirection:"row"},p],children:_jsx(Skeleton,{width:88,height:32,shape:"rounded"})}):null]})};CardSkeleton.displayName="CardSkeleton",Card.Skeleton=CardSkeleton;const hasBuiltInHeaderContent=e=>Boolean(e.title||e.lead||e.action||e.headerActions||e.collapsible||e.onRemove),isCardTextAction=e=>"object"==typeof e&&null!==e&&!React.isValidElement(e)&&"label"in e&&"onPress"in e,HIT_TARGET=44,CardIconAction=({icon:e,label:t,onPress:o,expanded:i,color:s,haptic:r})=>{const l=useTheme();return _jsx(Pressable,{accessibilityRole:"button",accessibilityLabel:t,accessibilityState:void 0===i?void 0:{expanded:i},"aria-expanded":i,onPress:()=>{r&&triggerHaptic(r),o()},style:iconActionStyle,children:_jsx(AppIcon,{name:e,size:20,color:s??l.colors["text-body"]})})},CardTextActionButton=({action:e,haptic:t})=>{const o=useTheme();return _jsx(Pressable,{accessibilityRole:"button",accessibilityLabel:e.accessibilityLabel??e.label,onPress:()=>{t&&triggerHaptic(t),e.onPress()},style:textActionStyle,children:_jsx(Text,{variant:"label",weight:"semibold",color:o.colors.primary,children:e.label})})},iconActionStyle={width:44,height:44,alignItems:"center",justifyContent:"center"},textActionStyle={minWidth:44,minHeight:44,alignItems:"center",justifyContent:"center"},titleFaceFor=(e,t)=>"serif"===t?fontFor(e,"semibold","display"):{fontFamily:void 0,...fontFor(e,"semibold")},resolveBackground=(e,t)=>{if(null!=t)return BACKGROUND_TOKENS.includes(t)?e.colors[t]:t},buildStyles=e=>StyleSheet.create({header:{marginBottom:e.space.md},headerRow:{flexDirection:"row",alignItems:"center",gap:e.space.sm},headerFolded:{marginBottom:e.space.none},titleColumn:{flex:1},lead:{marginTop:e.space.xs},actionNode:{flexShrink:0},body:{flexShrink:1},footer:{marginTop:e.space.md},imageWrapper:{position:"relative"},imageOverlay:{...StyleSheet.absoluteFill},squircleClip:{flexGrow:1,overflow:"hidden",...smoothCorners},preview:{margin:e.space.none,marginTop:e.space.none,marginBottom:e.space.none,marginLeft:e.space.none,marginRight:e.space.none,marginStart:e.space.none,marginEnd:e.space.none,marginHorizontal:e.space.none,marginVertical:e.space.none,position:"relative",top:0,left:0,width:"100%",height:"100%"}}),stylesFor=themeStyles(buildStyles);export{Card};export default Card;
|