@webority/mobile-ui 0.15.0 → 0.16.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/lib/commonjs/components/Accordion/Accordion.js +1 -1
- package/lib/commonjs/components/AmountSlider/AmountSlider.js +1 -1
- package/lib/commonjs/components/AnimatePresence/AnimatePresence.js +1 -1
- package/lib/commonjs/components/AppBar/AppBar.js +1 -1
- package/lib/commonjs/components/AsyncBlock/AsyncBlock.js +1 -1
- package/lib/commonjs/components/Banner/Banner.js +1 -1
- package/lib/commonjs/components/BottomSheet/BottomSheet.js +1 -1
- package/lib/commonjs/components/Button/Button.js +1 -1
- package/lib/commonjs/components/Calendar/Calendar.js +1 -1
- package/lib/commonjs/components/Card/Card.js +1 -1
- package/lib/commonjs/components/Carousel/Carousel.js +1 -1
- package/lib/commonjs/components/Chip/Chip.js +1 -1
- package/lib/commonjs/components/DatePicker/DatePicker.js +1 -1
- package/lib/commonjs/components/DateRangePicker/DateRangePicker.js +1 -1
- package/lib/commonjs/components/Drawer/Drawer.js +1 -1
- package/lib/commonjs/components/EmptyState/EmptyState.js +1 -1
- package/lib/commonjs/components/FloatingActionButton/FloatingActionButton.js +1 -1
- package/lib/commonjs/components/IconButton/IconButton.js +1 -1
- package/lib/commonjs/components/ListItem/ListItem.js +1 -1
- package/lib/commonjs/components/LoaderOverlay/LoaderOverlay.js +1 -1
- package/lib/commonjs/components/Menu/MenuSurface.js +1 -1
- package/lib/commonjs/components/MessageBubble/MessageBubble.js +1 -1
- package/lib/commonjs/components/Modal/Modal.js +1 -1
- package/lib/commonjs/components/OTPInput/OTPInput.js +1 -1
- package/lib/commonjs/components/OnboardingPager/OnboardingPager.js +1 -1
- package/lib/commonjs/components/OptionSheet/OptionSheet.js +1 -1
- package/lib/commonjs/components/ProgressBar/ProgressBar.js +1 -1
- package/lib/commonjs/components/Screen/Screen.js +1 -0
- package/lib/commonjs/components/Screen/index.js +1 -0
- package/lib/commonjs/components/SignaturePad/SignaturePad.js +1 -1
- package/lib/commonjs/components/Skeleton/Skeleton.js +1 -1
- package/lib/commonjs/components/Skeleton/SkeletonContent.js +1 -1
- package/lib/commonjs/components/Skeleton/SkeletonProvider.js +1 -1
- package/lib/commonjs/components/Skeleton/index.js +1 -1
- package/lib/commonjs/components/Spinner/Spinner.js +1 -1
- package/lib/commonjs/components/TagInput/TagInput.js +1 -1
- package/lib/commonjs/components/Text/Text.js +1 -1
- package/lib/commonjs/components/TimePicker/TimePicker.js +1 -1
- package/lib/commonjs/components/Toast/Toast.js +1 -1
- package/lib/commonjs/components/Tooltip/Tooltip.js +1 -1
- package/lib/commonjs/components/Tour/Tour.js +1 -1
- package/lib/commonjs/components/WheelPicker/Wheel.js +1 -1
- package/lib/commonjs/components/WheelPicker/WheelPicker.js +1 -1
- package/lib/commonjs/components/index.js +1 -1
- package/lib/commonjs/hooks/index.js +1 -1
- package/lib/commonjs/hooks/useDragToDismiss.js +1 -1
- package/lib/commonjs/hooks/useFieldChain.js +1 -0
- package/lib/commonjs/hooks/usePresenceMotion.js +1 -0
- package/lib/commonjs/hooks/usePressAnimation.js +1 -1
- package/lib/commonjs/hooks/useReducedMotion.js +1 -1
- package/lib/commonjs/index.js +1 -1
- package/lib/commonjs/network/NetworkStatusBanner.js +1 -1
- package/lib/commonjs/theme/tokens.js +1 -1
- package/lib/commonjs/utils/hapticUtils.js +1 -1
- package/lib/module/components/Accordion/Accordion.js +1 -1
- package/lib/module/components/AmountSlider/AmountSlider.js +1 -1
- package/lib/module/components/AnimatePresence/AnimatePresence.js +1 -1
- package/lib/module/components/AppBar/AppBar.js +1 -1
- package/lib/module/components/AsyncBlock/AsyncBlock.js +1 -1
- package/lib/module/components/Banner/Banner.js +1 -1
- package/lib/module/components/BottomSheet/BottomSheet.js +1 -1
- package/lib/module/components/Button/Button.js +1 -1
- package/lib/module/components/Calendar/Calendar.js +1 -1
- package/lib/module/components/Card/Card.js +1 -1
- package/lib/module/components/Carousel/Carousel.js +1 -1
- package/lib/module/components/Chip/Chip.js +1 -1
- package/lib/module/components/DatePicker/DatePicker.js +1 -1
- package/lib/module/components/DateRangePicker/DateRangePicker.js +1 -1
- package/lib/module/components/Drawer/Drawer.js +1 -1
- package/lib/module/components/EmptyState/EmptyState.js +1 -1
- package/lib/module/components/FloatingActionButton/FloatingActionButton.js +1 -1
- package/lib/module/components/IconButton/IconButton.js +1 -1
- package/lib/module/components/ListItem/ListItem.js +1 -1
- package/lib/module/components/LoaderOverlay/LoaderOverlay.js +1 -1
- package/lib/module/components/Menu/MenuSurface.js +1 -1
- package/lib/module/components/MessageBubble/MessageBubble.js +1 -1
- package/lib/module/components/Modal/Modal.js +1 -1
- package/lib/module/components/OTPInput/OTPInput.js +1 -1
- package/lib/module/components/OnboardingPager/OnboardingPager.js +1 -1
- package/lib/module/components/OptionSheet/OptionSheet.js +1 -1
- package/lib/module/components/ProgressBar/ProgressBar.js +1 -1
- package/lib/module/components/Screen/Screen.js +1 -0
- package/lib/module/components/Screen/index.js +1 -0
- package/lib/module/components/SignaturePad/SignaturePad.js +1 -1
- package/lib/module/components/Skeleton/Skeleton.js +1 -1
- package/lib/module/components/Skeleton/SkeletonContent.js +1 -1
- package/lib/module/components/Skeleton/SkeletonProvider.js +1 -1
- package/lib/module/components/Skeleton/index.js +1 -1
- package/lib/module/components/Spinner/Spinner.js +1 -1
- package/lib/module/components/TagInput/TagInput.js +1 -1
- package/lib/module/components/Text/Text.js +1 -1
- package/lib/module/components/TimePicker/TimePicker.js +1 -1
- package/lib/module/components/Toast/Toast.js +1 -1
- package/lib/module/components/Tooltip/Tooltip.js +1 -1
- package/lib/module/components/Tour/Tour.js +1 -1
- package/lib/module/components/WheelPicker/Wheel.js +1 -1
- package/lib/module/components/WheelPicker/WheelPicker.js +1 -1
- package/lib/module/components/index.js +1 -1
- package/lib/module/hooks/index.js +1 -1
- package/lib/module/hooks/useDragToDismiss.js +1 -1
- package/lib/module/hooks/useFieldChain.js +1 -0
- package/lib/module/hooks/usePresenceMotion.js +1 -0
- package/lib/module/hooks/usePressAnimation.js +1 -1
- package/lib/module/hooks/useReducedMotion.js +1 -1
- package/lib/module/index.js +1 -1
- package/lib/module/network/NetworkStatusBanner.js +1 -1
- package/lib/module/theme/tokens.js +1 -1
- package/lib/module/utils/hapticUtils.js +1 -1
- package/lib/typescript/commonjs/components/AnimatePresence/AnimatePresence.d.ts +5 -5
- package/lib/typescript/commonjs/components/AsyncBlock/AsyncBlock.d.ts +11 -6
- package/lib/typescript/commonjs/components/BottomSheet/BottomSheet.d.ts +8 -2
- package/lib/typescript/commonjs/components/Button/Button.d.ts +6 -3
- package/lib/typescript/commonjs/components/Card/Card.d.ts +1 -1
- package/lib/typescript/commonjs/components/Carousel/Carousel.d.ts +2 -0
- package/lib/typescript/commonjs/components/ListItem/ListItem.d.ts +1 -1
- package/lib/typescript/commonjs/components/MessageBubble/MessageBubble.d.ts +6 -3
- package/lib/typescript/commonjs/components/OTPInput/OTPInput.d.ts +1 -2
- package/lib/typescript/commonjs/components/Screen/Screen.d.ts +39 -0
- package/lib/typescript/commonjs/components/Screen/index.d.ts +3 -0
- package/lib/typescript/commonjs/components/SignaturePad/SignaturePad.d.ts +6 -0
- package/lib/typescript/commonjs/components/Skeleton/Skeleton.d.ts +2 -2
- package/lib/typescript/commonjs/components/Skeleton/SkeletonProvider.d.ts +3 -11
- package/lib/typescript/commonjs/components/Skeleton/index.d.ts +1 -1
- package/lib/typescript/commonjs/components/WheelPicker/Wheel.d.ts +2 -0
- package/lib/typescript/commonjs/components/WheelPicker/WheelPicker.d.ts +5 -0
- package/lib/typescript/commonjs/components/index.d.ts +3 -1
- package/lib/typescript/commonjs/hooks/index.d.ts +4 -0
- package/lib/typescript/commonjs/hooks/useDragToDismiss.d.ts +10 -2
- package/lib/typescript/commonjs/hooks/useFieldChain.d.ts +10 -0
- package/lib/typescript/commonjs/hooks/usePresenceMotion.d.ts +14 -0
- package/lib/typescript/commonjs/hooks/usePressAnimation.d.ts +2 -2
- package/lib/typescript/commonjs/hooks/useReducedMotion.d.ts +0 -6
- package/lib/typescript/commonjs/index.d.ts +2 -2
- package/lib/typescript/commonjs/theme/types.d.ts +4 -0
- package/lib/typescript/module/components/AnimatePresence/AnimatePresence.d.ts +5 -5
- package/lib/typescript/module/components/AsyncBlock/AsyncBlock.d.ts +11 -6
- package/lib/typescript/module/components/BottomSheet/BottomSheet.d.ts +8 -2
- package/lib/typescript/module/components/Button/Button.d.ts +6 -3
- package/lib/typescript/module/components/Card/Card.d.ts +1 -1
- package/lib/typescript/module/components/Carousel/Carousel.d.ts +2 -0
- package/lib/typescript/module/components/ListItem/ListItem.d.ts +1 -1
- package/lib/typescript/module/components/MessageBubble/MessageBubble.d.ts +6 -3
- package/lib/typescript/module/components/OTPInput/OTPInput.d.ts +1 -2
- package/lib/typescript/module/components/Screen/Screen.d.ts +39 -0
- package/lib/typescript/module/components/Screen/index.d.ts +3 -0
- package/lib/typescript/module/components/SignaturePad/SignaturePad.d.ts +6 -0
- package/lib/typescript/module/components/Skeleton/Skeleton.d.ts +2 -2
- package/lib/typescript/module/components/Skeleton/SkeletonProvider.d.ts +3 -11
- package/lib/typescript/module/components/Skeleton/index.d.ts +1 -1
- package/lib/typescript/module/components/WheelPicker/Wheel.d.ts +2 -0
- package/lib/typescript/module/components/WheelPicker/WheelPicker.d.ts +5 -0
- package/lib/typescript/module/components/index.d.ts +3 -1
- package/lib/typescript/module/hooks/index.d.ts +4 -0
- package/lib/typescript/module/hooks/useDragToDismiss.d.ts +10 -2
- package/lib/typescript/module/hooks/useFieldChain.d.ts +10 -0
- package/lib/typescript/module/hooks/usePresenceMotion.d.ts +14 -0
- package/lib/typescript/module/hooks/usePressAnimation.d.ts +2 -2
- package/lib/typescript/module/hooks/useReducedMotion.d.ts +0 -6
- package/lib/typescript/module/index.d.ts +2 -2
- package/lib/typescript/module/theme/types.d.ts +4 -0
- package/package.json +3 -3
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";import{formatDateTime}from"@webority/mobile-core";import{forwardRef,memo,useCallback,useEffect,useImperativeHandle,useMemo,useRef,useState}from"react";import{AccessibilityInfo,PixelRatio,Platform,StyleSheet,View}from"react-native";import{Gesture,GestureDetector}from"react-native-gesture-handler";import Svg,{Path,Rect,Text as SvgText}from"react-native-svg";import{lightTheme,useTheme}from"../../theme/index.js";import{announce}from"../../utils/announce.js";import{smoothCorners}from"../../utils/corners.js";import{Button}from"../Button/index.js";import{Input}from"../Input/index.js";import{Text}from"../Text/index.js";import{BASELINE_RATIO,buildSignatureSvg,distanceBetween,FALLBACK_WIDTH,pointOf,strokePath,typedFontSize}from"./signatureGeometry.js";import{writePng}from"./writePng";import{jsx as _jsx,Fragment as _Fragment,jsxs as _jsxs}from"react/jsx-runtime";const DEFAULT_LABELS={pad:"Signature pad",padHint:"Draw with one finger. To sign without drawing, use the type your name action.",caption:"Sign above the line. To start with an up or down stroke, rest your finger a moment first.",typedCaption:"Your typed name is used as your signature.",undo:"Undo",clear:"Clear",typeInstead:"Type your name instead",drawInstead:"Draw instead",typedLabel:"Type your name",typedPlaceholder:"Your full name",empty:"Not signed",signed:"Signed",typingAnnouncement:"Signing by typing your name. Your typed name is used as your signature. Choose Draw instead to sign with your finger.",drawingAnnouncement:"Signing by drawing. Use one finger on the pad.",clearedAnnouncement:"Signature cleared",undoneAnnouncement:"Last stroke removed",emptyError:"Add a signature first."},STROKE_WIDTH=2.5,SIDEWAYS_TO_DRAW=6,UPRIGHT_TO_SCROLL=8,REST_TO_DRAW_MS=200,MIN_POINT_GAP=.8,DEFAULT_HEIGHT=180,DEFAULT_NAME_LENGTH=100,MAX_EXPORT_SCALE=3,MIN_TARGET=44,BASELINE_OPACITY=.3,DISABLED_OPACITY=.5,TARGET_STYLE={minHeight:44},defaultScriptFont=()=>Platform.select({ios:"Snell Roundhand",default:"cursive"}),cssFontStack=e=>"cursive"===e?"cursive":`'${e}', cursive`,useScreenReader=()=>{const[e,t]=useState(!1);return useEffect(()=>{let e=!0;AccessibilityInfo.isScreenReaderEnabled().then(n=>{e&&t(n)});const n=AccessibilityInfo.addEventListener("screenReaderChanged",t);return()=>{e=!1,n.remove()}},[]),e},StrokePath=memo(({points:e,color:t})=>_jsx(Path,{d:strokePath(e),stroke:t,strokeWidth:2.5,strokeLinecap:"round",strokeLinejoin:"round",fill:"none"}));StrokePath.displayName="SignaturePadStroke";const Marks=({mode:e,strokes:t,name:n,color:r,fontFamily:a,width:o,height:i})=>"draw"===e?_jsx(_Fragment,{children:t.map(e=>_jsx(StrokePath,{points:e.points,color:r},e.id))}):n?_jsx(SvgText,{x:o/2,y:i*BASELINE_RATIO,fontSize:typedFontSize(o,n),fontFamily:a,textAnchor:"middle",fill:r,children:n}):null,SignaturePad=forwardRef((e,t)=>{const{initialStrokes:n,onChange:r,initialTypedName:a="",onTypedNameChange:o,defaultMode:i="draw",onModeChange:s,onEmptyChange:l,allowTyped:d=!0,signedBy:c,signedAt:u,height:m=DEFAULT_HEIGHT,maxNameLength:p=DEFAULT_NAME_LENGTH,inkColor:h,paperColor:g,scriptFontFamily:y,labels:f,haptic:S="selection",disabled:T=!1,style:w,testID:x}=e,b=useTheme(),_=void 0===h&&void 0===g,E=_?b.colors.text.primary:h??lightTheme.colors.text.primary,A=_?b.colors.background.elevated:g??lightTheme.colors.background.elevated,v=_?lightTheme.colors.text.primary:E,C=_?lightTheme.colors.background.elevated:A,I=v!==E||C!==A,R=y??defaultScriptFont(),L=useMemo(()=>({...DEFAULT_LABELS,...f}),[f]),k=useScreenReader(),j=useRef(null),P=useRef(null),[D,F]=useState(0),[M,N]=useState(()=>(n??[]).map((e,t)=>({id:t+1,points:[...e]}))),B=useRef(M),O=useRef(M.length),G=useRef(null),H=useRef(null),[Y,U]=useState(d?i:"draw"),[W,$]=useState(a),[z,V]=useState(null),K=useRef(!1),X=useRef({onChange:r,onTypedNameChange:o,onModeChange:s,onEmptyChange:l});useEffect(()=>{X.current={onChange:r,onTypedNameChange:o,onModeChange:s,onEmptyChange:l}});const J="draw"===Y&&!T,q="draw"===Y?0===M.length:0===W.trim().length,Q=useRef(null);useEffect(()=>{Q.current!==q&&(Q.current=q,X.current.onEmptyChange?.(q))},[q]);const Z=useCallback(e=>{B.current=e,N(e)},[]),ee=useCallback(()=>{V(Date.now()),X.current.onChange?.(B.current.map(e=>e.points))},[]),te=useMemo(()=>{const pan=e=>Gesture.Pan().enabled(J).runOnJS(!0).onBegin(e=>{G.current=pointOf(e.x,e.y)}).onStart(t=>{H.current=e,O.current+=1;const n=pointOf(t.x,t.y);Z([...B.current,{id:O.current,points:[G.current??n,n]}])}).onUpdate(t=>{if(H.current!==e)return;const n=B.current[B.current.length-1],r=pointOf(t.x,t.y);distanceBetween(n.points[n.points.length-1],r)<.8||Z([...B.current.slice(0,-1),{...n,points:[...n.points,r]}])}).onFinalize(()=>{H.current===e&&(H.current=null,ee())}),e=pan("sideways").activeOffsetX([-6,6]).failOffsetY([-8,8]),t=pan("rested").activateAfterLongPress(200);return Gesture.Race(e,t)},[J,Z,ee]),ne=useCallback(e=>{U(e),X.current.onModeChange?.(e),announce("type"===e?L.typingAnnouncement:L.drawingAnnouncement)},[L.typingAnnouncement,L.drawingAnnouncement]);useEffect(()=>{k&&d&&!K.current&&"draw"===Y&&0===B.current.length&&ne("type")},[k,d,Y,ne]);const re=useCallback(()=>{K.current=!0,ne("draw"===Y?"type":"draw")},[Y,ne]),ae=useCallback(e=>{$(e),V(Date.now()),X.current.onTypedNameChange?.(e)},[]),oe=useCallback(()=>{"type"===Y?ae(""):(Z([]),ee()),announce(L.clearedAnnouncement)},[Y,ae,Z,ee,L.clearedAnnouncement]),ie=useCallback(()=>{"draw"===Y&&0!==B.current.length&&(Z(B.current.slice(0,-1)),ee(),announce(L.undoneAnnouncement))},[Y,Z,ee,L.undoneAnnouncement]),se=D||FALLBACK_WIDTH;useImperativeHandle(t,()=>({toFile:()=>new Promise((e,t)=>{if(q)return void t(new Error(L.emptyError));const n=I?P.current:j.current;if(!n)return void t(new Error("The signature pad is not on screen."));const r=Math.min(3,Math.max(1,PixelRatio.get()));n.toDataURL(n=>{try{e(writePng(n))}catch(e){t(e)}},{width:se*r,height:m*r})}),toSvg:()=>buildSignatureSvg({width:se,height:m,mode:Y,strokes:M.map(e=>e.points),typedName:W,ink:v,paper:C,strokeWidth:2.5,fontFamily:cssFontStack(R)}),clear:oe,undo:ie,isEmpty:()=>q}),[q,L.emptyError,se,m,Y,M,W,I,v,C,R,oe,ie]);const le=useMemo(()=>[{name:"undo",label:L.undo},{name:"clear",label:L.clear},...d?[{name:"toggleMode",label:"draw"===Y?L.typeInstead:L.drawInstead}]:[]],[L.undo,L.clear,L.typeInstead,L.drawInstead,d,Y]),de=useCallback(e=>{if(T)return;const{actionName:t}=e.nativeEvent;"undo"===t?ie():"clear"===t?oe():"toggleMode"===t&&d&&re()},[T,ie,oe,re,d]),ce=useCallback(e=>{F(e.nativeEvent.layout.width)},[]),ue=useMemo(()=>StyleSheet.create({root:{gap:b.spacing.sm},pad:{height:m,borderWidth:b.colors.border.width,borderColor:b.colors.border.primary,borderRadius:b.radius.md,...smoothCorners,overflow:"hidden",backgroundColor:A,opacity:T?.5:1},baseline:{position:"absolute",left:b.spacing.md,right:b.spacing.md,top:m*BASELINE_RATIO,height:StyleSheet.hairlineWidth,backgroundColor:E,opacity:.3},actions:{flexDirection:"row",alignItems:"center",justifyContent:"space-between",flexWrap:"wrap",gap:b.spacing.xs},trailing:{flexDirection:"row",alignItems:"center",gap:b.spacing.xs}}),[b,m,A,E,T]),me=W.trim(),pe=u??z,he=c&&!q?`Signed by ${c}${pe?`, ${formatDateTime(pe)}`:""}`:null,ge="type"===Y&&me?`${L.pad}. ${me}`:L.pad;return _jsxs(View,{style:[ue.root,w],testID:x,children:[_jsx(GestureDetector,{gesture:te,children:_jsxs(View,{style:ue.pad,onLayout:ce,accessible:!0,accessibilityRole:"image",accessibilityLabel:ge,accessibilityHint:"draw"===Y?L.padHint:void 0,accessibilityValue:{text:q?L.empty:L.signed},accessibilityState:{disabled:T},"aria-disabled":T,accessibilityActions:le,onAccessibilityAction:de,children:[I?_jsxs(Svg,{ref:P,style:StyleSheet.absoluteFill,width:"100%",height:m,children:[_jsx(Rect,{x:"0",y:"0",width:"100%",height:"100%",fill:C}),_jsx(Marks,{mode:Y,strokes:M,name:me,color:v,fontFamily:R,width:se,height:m})]}):null,_jsxs(Svg,{ref:j,width:"100%",height:m,children:[_jsx(Rect,{x:"0",y:"0",width:"100%",height:"100%",fill:A}),_jsx(Marks,{mode:Y,strokes:M,name:me,color:E,fontFamily:R,width:se,height:m})]}),_jsx(View,{pointerEvents:"none",style:ue.baseline})]})}),"type"===Y?_jsx(Input,{label:L.typedLabel,placeholder:L.typedPlaceholder,value:W,onChangeText:ae,maxLength:p,disabled:T,autoComplete:"name",textContentType:"name",autoCapitalize:"words",autoCorrect:!1,returnKeyType:"done",testID:x?`${x}-name`:void 0}):null,_jsx(Text,{variant:"caption",color:"tertiary",children:"draw"===Y?L.caption:L.typedCaption}),_jsxs(View,{style:ue.actions,children:[d?_jsx(Button,{title:"draw"===Y?L.typeInstead:L.drawInstead,variant:"ghost",tone:"primary",size:"md",style:TARGET_STYLE,haptic:S,disabled:T,onPress:re,testID:x?`${x}-mode`:void 0}):_jsx(View,{}),"draw"===Y&&M.length>0?_jsxs(View,{style:ue.trailing,children:[_jsx(Button,{title:L.undo,variant:"ghost",tone:"primary",size:"md",style:TARGET_STYLE,haptic:S,disabled:T,onPress:ie,testID:x?`${x}-undo`:void 0}),_jsx(Button,{title:L.clear,variant:"ghost",tone:"primary",size:"md",style:TARGET_STYLE,haptic:S,disabled:T,onPress:oe,testID:x?`${x}-clear`:void 0})]}):null,"type"===Y&&me?_jsx(Button,{title:L.clear,variant:"ghost",tone:"primary",size:"md",style:TARGET_STYLE,haptic:S,disabled:T,onPress:oe,testID:x?`${x}-clear`:void 0}):null]}),he?_jsx(Text,{variant:"caption",color:"secondary",children:he}):null]})});SignaturePad.displayName="SignaturePad";export{SignaturePad};export default SignaturePad;
|
|
1
|
+
"use strict";import{formatDateTime}from"@webority/mobile-core";import{forwardRef,memo,useCallback,useEffect,useImperativeHandle,useMemo,useRef,useState}from"react";import{AccessibilityInfo,Modal,PixelRatio,Platform,StyleSheet,useWindowDimensions,View}from"react-native";import{Gesture,GestureDetector,GestureHandlerRootView}from"react-native-gesture-handler";import Svg,{Path,Rect,Text as SvgText}from"react-native-svg";import{lightTheme,useTheme}from"../../theme/index.js";import{announce}from"../../utils/announce.js";import{smoothCorners}from"../../utils/corners.js";import{Button}from"../Button/index.js";import{Input}from"../Input/index.js";import{Text}from"../Text/index.js";import{BASELINE_RATIO,buildSignatureSvg,distanceBetween,FALLBACK_WIDTH,pointOf,strokePath,typedFontSize}from"./signatureGeometry.js";import{writePng}from"./writePng";import{jsx as _jsx,Fragment as _Fragment,jsxs as _jsxs}from"react/jsx-runtime";const DEFAULT_LABELS={pad:"Signature pad",padHint:"Draw with one finger. To sign without drawing, use the type your name action.",caption:"Sign above the line. To start with an up or down stroke, rest your finger a moment first.",typedCaption:"Your typed name is used as your signature.",undo:"Undo",clear:"Clear",typeInstead:"Type your name instead",drawInstead:"Draw instead",typedLabel:"Type your name",typedPlaceholder:"Your full name",empty:"Not signed",signed:"Signed",typingAnnouncement:"Signing by typing your name. Your typed name is used as your signature. Choose Draw instead to sign with your finger.",drawingAnnouncement:"Signing by drawing. Use one finger on the pad.",clearedAnnouncement:"Signature cleared",undoneAnnouncement:"Last stroke removed",emptyError:"Add a signature first.",expand:"Expand",done:"Done",close:"Close"},STROKE_WIDTH=2.5,SIDEWAYS_TO_DRAW=6,UPRIGHT_TO_SCROLL=8,REST_TO_DRAW_MS=200,MIN_POINT_GAP=.8,DEFAULT_HEIGHT=180,EXPANDED_CHROME=200,DEFAULT_NAME_LENGTH=100,MAX_EXPORT_SCALE=3,MIN_TARGET=44,BASELINE_OPACITY=.3,DISABLED_OPACITY=.5,TARGET_STYLE={minHeight:44},defaultScriptFont=()=>Platform.select({ios:"Snell Roundhand",default:"cursive"}),cssFontStack=e=>"cursive"===e?"cursive":`'${e}', cursive`,useScreenReader=()=>{const[e,t]=useState(!1);return useEffect(()=>{let e=!0;AccessibilityInfo.isScreenReaderEnabled().then(n=>{e&&t(n)});const n=AccessibilityInfo.addEventListener("screenReaderChanged",t);return()=>{e=!1,n.remove()}},[]),e},StrokePath=memo(({points:e,color:t})=>_jsx(Path,{d:strokePath(e),stroke:t,strokeWidth:2.5,strokeLinecap:"round",strokeLinejoin:"round",fill:"none"}));StrokePath.displayName="SignaturePadStroke";const Marks=({mode:e,strokes:t,name:n,color:a,fontFamily:r,width:o,height:i})=>"draw"===e?_jsx(_Fragment,{children:t.map(e=>_jsx(StrokePath,{points:e.points,color:a},e.id))}):n?_jsx(SvgText,{x:o/2,y:i*BASELINE_RATIO,fontSize:typedFontSize(o,n),fontFamily:r,textAnchor:"middle",fill:a,children:n}):null,SignaturePadSurface=forwardRef((e,t)=>{const{expandable:n,initialStrokes:a,onChange:r,initialTypedName:o="",onTypedNameChange:i,defaultMode:s="draw",onModeChange:l,onEmptyChange:d,allowTyped:c=!0,signedBy:u,signedAt:p,height:m=DEFAULT_HEIGHT,maxNameLength:g=DEFAULT_NAME_LENGTH,inkColor:h,paperColor:y,scriptFontFamily:f,labels:S,haptic:x="selection",disabled:T=!1,style:w,testID:_}=e,b=useTheme(),E=void 0===h&&void 0===y,A=E?b.colors.text.primary:h??lightTheme.colors.text.primary,C=E?b.colors.background.elevated:y??lightTheme.colors.background.elevated,v=E?lightTheme.colors.text.primary:A,R=E?lightTheme.colors.background.elevated:C,I=v!==A||R!==C,j=f??defaultScriptFont(),k=useMemo(()=>({...DEFAULT_LABELS,...S}),[S]),L=useScreenReader(),P=useRef(null),D=useRef(null),[F,M]=useState(0),[B,G]=useState(()=>(a??[]).map((e,t)=>({id:t+1,points:[...e]}))),N=useRef(B),H=useRef(B.length),O=useRef(null),Y=useRef(null),[$,W]=useState(c?s:"draw"),[z,U]=useState(o),[V,K]=useState(null),X=useRef(!1),{height:q}=useWindowDimensions(),[J,Q]=useState(!1),[Z,ee]=useState([]),te=useRef({onChange:r,onTypedNameChange:i,onModeChange:l,onEmptyChange:d});useEffect(()=>{te.current={onChange:r,onTypedNameChange:i,onModeChange:l,onEmptyChange:d}});const ne="draw"===$&&!T,ae="draw"===$?0===B.length:0===z.trim().length,re=useRef(null);useEffect(()=>{re.current!==ae&&(re.current=ae,te.current.onEmptyChange?.(ae))},[ae]);const oe=useCallback(e=>{N.current=e,G(e)},[]),ie=useCallback(()=>{K(Date.now()),te.current.onChange?.(N.current.map(e=>e.points))},[]),se=useMemo(()=>{const pan=e=>Gesture.Pan().enabled(ne).runOnJS(!0).onBegin(e=>{O.current=pointOf(e.x,e.y)}).onStart(t=>{Y.current=e,H.current+=1;const n=pointOf(t.x,t.y);oe([...N.current,{id:H.current,points:[O.current??n,n]}])}).onUpdate(t=>{if(Y.current!==e)return;const n=N.current[N.current.length-1],a=pointOf(t.x,t.y);distanceBetween(n.points[n.points.length-1],a)<.8||oe([...N.current.slice(0,-1),{...n,points:[...n.points,a]}])}).onFinalize(()=>{Y.current===e&&(Y.current=null,ie())}),e=pan("sideways").activeOffsetX([-6,6]).failOffsetY([-8,8]),t=pan("rested").activateAfterLongPress(200);return Gesture.Race(e,t)},[ne,oe,ie]),le=useCallback(e=>{W(e),te.current.onModeChange?.(e),announce("type"===e?k.typingAnnouncement:k.drawingAnnouncement)},[k.typingAnnouncement,k.drawingAnnouncement]);useEffect(()=>{L&&c&&!X.current&&"draw"===$&&0===N.current.length&&le("type")},[L,c,$,le]);const de=useCallback(()=>{X.current=!0,le("draw"===$?"type":"draw")},[$,le]),ce=useCallback(e=>{U(e),K(Date.now()),te.current.onTypedNameChange?.(e)},[]),ue=useCallback(()=>{"type"===$?ce(""):(oe([]),ie()),announce(k.clearedAnnouncement)},[$,ce,oe,ie,k.clearedAnnouncement]),pe=useCallback(()=>{"draw"===$&&0!==N.current.length&&(oe(N.current.slice(0,-1)),ie(),announce(k.undoneAnnouncement))},[$,oe,ie,k.undoneAnnouncement]),me=useCallback(()=>{ee(N.current.map(e=>e.points)),Q(!0)},[]),ge=useCallback(()=>{Q(!1)},[]),he=useCallback(()=>{oe(Z.map(e=>(H.current+=1,{id:H.current,points:[...e]}))),ie(),Q(!1)},[Z,oe,ie]),ye=F||FALLBACK_WIDTH;useImperativeHandle(t,()=>({toFile:()=>new Promise((e,t)=>{if(ae)return void t(new Error(k.emptyError));const n=I?D.current:P.current;if(!n)return void t(new Error("The signature pad is not on screen."));const a=Math.min(3,Math.max(1,PixelRatio.get()));n.toDataURL(n=>{try{e(writePng(n))}catch(e){t(e)}},{width:ye*a,height:m*a})}),toSvg:()=>buildSignatureSvg({width:ye,height:m,mode:$,strokes:B.map(e=>e.points),typedName:z,ink:v,paper:R,strokeWidth:2.5,fontFamily:cssFontStack(j)}),clear:ue,undo:pe,isEmpty:()=>ae}),[ae,k.emptyError,ye,m,$,B,z,I,v,R,j,ue,pe]);const fe=useMemo(()=>[{name:"undo",label:k.undo},{name:"clear",label:k.clear},...c?[{name:"toggleMode",label:"draw"===$?k.typeInstead:k.drawInstead}]:[]],[k.undo,k.clear,k.typeInstead,k.drawInstead,c,$]),Se=useCallback(e=>{if(T)return;const{actionName:t}=e.nativeEvent;"undo"===t?pe():"clear"===t?ue():"toggleMode"===t&&c&&de()},[T,pe,ue,de,c]),xe=useCallback(e=>{M(e.nativeEvent.layout.width)},[]),Te=useMemo(()=>StyleSheet.create({root:{gap:b.spacing.sm},pad:{height:m,borderWidth:b.colors.border.width,borderColor:b.colors.border.primary,borderRadius:b.radius.md,...smoothCorners,overflow:"hidden",backgroundColor:C,opacity:T?.5:1},baseline:{position:"absolute",left:b.spacing.md,right:b.spacing.md,top:m*BASELINE_RATIO,height:StyleSheet.hairlineWidth,backgroundColor:A,opacity:.3},actions:{flexDirection:"row",alignItems:"center",justifyContent:"space-between",flexWrap:"wrap",gap:b.spacing.xs},trailing:{flexDirection:"row",alignItems:"center",gap:b.spacing.xs},expandedRoot:{flex:1,padding:b.spacing.md,gap:b.spacing.sm,backgroundColor:b.colors.background.primary},expandedBar:{flexDirection:"row",alignItems:"center",justifyContent:"space-between"}}),[b,m,C,A,T]),we=z.trim(),be=p??V,Ee=u&&!ae?`Signed by ${u}${be?`, ${formatDateTime(be)}`:""}`:null,Ae="type"===$&&we?`${k.pad}. ${we}`:k.pad;return _jsxs(View,{style:[Te.root,w],testID:_,children:[_jsx(GestureDetector,{gesture:se,children:_jsxs(View,{style:Te.pad,onLayout:xe,accessible:!0,accessibilityRole:"image",accessibilityLabel:Ae,accessibilityHint:"draw"===$?k.padHint:void 0,accessibilityValue:{text:ae?k.empty:k.signed},accessibilityState:{disabled:T},"aria-disabled":T,accessibilityActions:fe,onAccessibilityAction:Se,children:[I?_jsxs(Svg,{ref:D,style:StyleSheet.absoluteFill,width:"100%",height:m,children:[_jsx(Rect,{x:"0",y:"0",width:"100%",height:"100%",fill:R}),_jsx(Marks,{mode:$,strokes:B,name:we,color:v,fontFamily:j,width:ye,height:m})]}):null,_jsxs(Svg,{ref:P,width:"100%",height:m,children:[_jsx(Rect,{x:"0",y:"0",width:"100%",height:"100%",fill:C}),_jsx(Marks,{mode:$,strokes:B,name:we,color:A,fontFamily:j,width:ye,height:m})]}),_jsx(View,{pointerEvents:"none",style:Te.baseline})]})}),"type"===$?_jsx(Input,{label:k.typedLabel,placeholder:k.typedPlaceholder,value:z,onChangeText:ce,maxLength:g,disabled:T,autoComplete:"name",textContentType:"name",autoCapitalize:"words",autoCorrect:!1,returnKeyType:"done",testID:_?`${_}-name`:void 0}):null,_jsx(Text,{variant:"caption",color:"tertiary",children:"draw"===$?k.caption:k.typedCaption}),_jsxs(View,{style:Te.actions,children:[c?_jsx(Button,{title:"draw"===$?k.typeInstead:k.drawInstead,variant:"ghost",tone:"primary",size:"md",style:TARGET_STYLE,haptic:x,disabled:T,onPress:de,testID:_?`${_}-mode`:void 0}):_jsx(View,{}),"draw"===$?_jsxs(View,{style:Te.trailing,children:[B.length>0?_jsxs(_Fragment,{children:[_jsx(Button,{title:k.undo,variant:"ghost",tone:"primary",size:"md",style:TARGET_STYLE,haptic:x,disabled:T,onPress:pe,testID:_?`${_}-undo`:void 0}),_jsx(Button,{title:k.clear,variant:"ghost",tone:"primary",size:"md",style:TARGET_STYLE,haptic:x,disabled:T,onPress:ue,testID:_?`${_}-clear`:void 0})]}):null,n?_jsx(Button,{title:k.expand,variant:"ghost",tone:"primary",size:"md",style:TARGET_STYLE,haptic:x,disabled:T,onPress:me,testID:_?`${_}-expand`:void 0}):null]}):null,"type"===$&&we?_jsx(Button,{title:k.clear,variant:"ghost",tone:"primary",size:"md",style:TARGET_STYLE,haptic:x,disabled:T,onPress:ue,testID:_?`${_}-clear`:void 0}):null]}),Ee?_jsx(Text,{variant:"caption",color:"secondary",children:Ee}):null,n?_jsx(Modal,{visible:J,animationType:"slide",presentationStyle:"fullScreen",onRequestClose:ge,children:_jsxs(ExpandedRoot,{style:Te.expandedRoot,children:[_jsxs(View,{style:Te.expandedBar,children:[_jsx(Button,{title:k.close,variant:"ghost",tone:"primary",size:"md",style:TARGET_STYLE,haptic:x,onPress:ge,testID:_?`${_}-close`:void 0}),_jsx(Button,{title:k.done,variant:"solid",tone:"primary",size:"md",style:TARGET_STYLE,haptic:x,onPress:he,testID:_?`${_}-done`:void 0})]}),J?_jsx(SignaturePadSurface,{expandable:!1,defaultMode:"draw",allowTyped:!1,initialStrokes:Z,onChange:ee,height:Math.max(DEFAULT_HEIGHT,q-200),inkColor:h,paperColor:y,scriptFontFamily:f,labels:S,haptic:x,testID:_?`${_}-expanded`:void 0}):null]})}):null]})});SignaturePadSurface.displayName="SignaturePadSurface";const ExpandedRoot="android"===Platform.OS?GestureHandlerRootView:View,SignaturePad=forwardRef((e,t)=>_jsx(SignaturePadSurface,{...e,expandable:!0,ref:t}));SignaturePad.displayName="SignaturePad";export{SignaturePad};export default SignaturePad;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";import{useMemo,useState}from"react";import{Animated,StyleSheet,View}from"react-native";import{useTheme}from"../../theme/index.js";import{toBackgroundImage}from"../../theme/Gradient.js";import{useScreenDimensions}from"../../utils/index.js";import{smoothCorners}from"../../utils/corners.js";import{useSkeletonClock}from"./SkeletonClock.js";import{useSkeletonDefaults}from"./SkeletonProvider.js";import{jsx as _jsx}from"react/jsx-runtime";const resolveRadius=(e,t)=>"number"==typeof t?t:e.radius[t],resolveWidth=e=>void 0===e?"100%":e,radiusForShape=(e,t,s,o,i)=>{if(void 0!==i)return resolveRadius(e,i);switch(t){case"circle":return"number"==typeof s?Math.min(s,o)/2:o/2;case"rounded":return e.radius.md;default:return e.radius.sm}},Skeleton=({shape:e="rect",width:t="100%",height:s=16,radius:o,variant:i,speed:
|
|
1
|
+
"use strict";import{useMemo,useState}from"react";import{Animated,StyleSheet,View}from"react-native";import{useReducedMotion}from"../../hooks/useReducedMotion.js";import{useTheme}from"../../theme/index.js";import{toBackgroundImage}from"../../theme/Gradient.js";import{useScreenDimensions}from"../../utils/index.js";import{smoothCorners}from"../../utils/corners.js";import{useSkeletonClock}from"./SkeletonClock.js";import{useSkeletonDefaults}from"./SkeletonProvider.js";import{jsx as _jsx}from"react/jsx-runtime";const resolveRadius=(e,t)=>"number"==typeof t?t:e.radius[t],resolveWidth=e=>void 0===e?"100%":e,radiusForShape=(e,t,s,o,i)=>{if(void 0!==i)return resolveRadius(e,i);switch(t){case"circle":return"number"==typeof s?Math.min(s,o)/2:o/2;case"rounded":return e.radius.md;default:return e.radius.sm}},Skeleton=({shape:e="rect",width:t="100%",height:s=16,radius:o,variant:i,speed:n,colors:r,style:a,testID:l})=>{const u=useTheme(),m=useSkeletonDefaults(),d=useSkeletonClock(),c=useReducedMotion(),h=i??m.variant??"shimmer",p=c&&"auto"===(m.animation??"auto");let S=h;d.enabled?p&&"shimmer"===h&&(S="pulse"):S="none";const k=r?.background??m.colors?.background??u.colors.skeleton.background,g=r?.highlight??m.colors?.highlight??u.colors.skeleton.highlight,{responsive:y}=useScreenDimensions(),b=useMemo(()=>buildStyles(),[]),x=resolveWidth(t),f=y.size(s),v=radiusForShape(u,e,x,f,o),[j,w]=useState(0),R=useMemo(()=>j<=0?0:Math.max(48,.7*j),[j]),C=useMemo(()=>j<=0?0:d.shimmer.interpolate({inputRange:[0,1],outputRange:[-R,j]}),[d.shimmer,R,j]),M=useMemo(()=>"none"===S?null:"pulse"===S?_jsx(Animated.View,{pointerEvents:"none",style:[StyleSheet.absoluteFill,{backgroundColor:g,opacity:d.pulse.interpolate({inputRange:[0,1],outputRange:[0,.55]})}]}):j<=0?null:_jsx(Animated.View,{pointerEvents:"none",style:[b.shimmerBand,{width:R,transform:[{translateX:C}],experimental_backgroundImage:[toBackgroundImage({colors:["transparent",g,"transparent"],locations:[0,.5,1],start:{x:0,y:.5},end:{x:1,y:.5}})]}]}),[S,g,d.pulse,j,b.shimmerBand,R,C]);return _jsx(View,{onLayout:e=>{const t=e.nativeEvent.layout.width;t!==j&&w(t)},accessible:!0,accessibilityLabel:"Loading",accessibilityRole:"progressbar",accessibilityState:{busy:!0},"aria-busy":!0,accessibilityLiveRegion:"polite",testID:l,style:[b.base,{width:x,height:f,borderRadius:v,...smoothCorners,backgroundColor:k},a],children:M})};Skeleton.displayName="Skeleton";const SkeletonCircle=({size:e,style:t,...s})=>{const{responsive:o}=useScreenDimensions(),i=o.size(e);return _jsx(Skeleton,{...s,shape:"circle",width:i,height:e,style:t})};SkeletonCircle.displayName="SkeletonCircle";const SkeletonText=({lines:e=3,lastLineWidth:t="60%",spacing:s,fontSize:o=14,variant:i,speed:n,radius:r="sm",width:a="100%",style:l,testID:u})=>{const m=useTheme(),d=s??m.spacing.xs,c=Math.max(1,e);return _jsx(View,{style:l,testID:u,children:Array.from({length:c}).map((e,s)=>_jsx(Skeleton,{shape:"text",width:s===c-1&&c>1?t:a,height:o,radius:r,variant:i,speed:n,style:s<c-1?{marginBottom:d}:void 0},s))})};SkeletonText.displayName="SkeletonText";const buildStyles=()=>StyleSheet.create({base:{overflow:"hidden"},shimmerBand:{position:"absolute",top:0,bottom:0,left:0}});export{Skeleton,SkeletonCircle,SkeletonText};export default Skeleton;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";import React,{Children,cloneElement,isValidElement,useEffect,useRef}from"react";import{Animated,Image,StyleSheet,Text,View}from"react-native";import{createAnimatedValue}from"../../theme/index.js";import{Skeleton}from"./Skeleton.js";import{useSkeletonDefaults}from"./SkeletonProvider.js";import{SkeletonSkip}from"./SkeletonSkip.js";import{jsx as _jsx,Fragment as _Fragment}from"react/jsx-runtime";const flattenStyle=e=>{if(!e)return{};return StyleSheet.flatten(e)??{}},resolveWidth=(e,t)=>"number"==typeof e?e:"string"!=typeof e||"auto"!==e&&"100%"!==e&&!/^\d+(\.\d+)?%$/.test(e)?t:e,resolveRadius=(e,t)=>"number"==typeof e?e:t,skeletonizeNode=(e,t,i,r,n="r")=>{if(null==e||"boolean"==typeof e)return null;if("string"==typeof e||"number"==typeof e)return _jsx(Skeleton,{shape:"text",width:"60%",height:14,variant:t,speed:i,colors:r},`${n}-text`);if(Array.isArray(e))return Children.map(e,(e,s)=>skeletonizeNode(e,t,i,r,`${n}-${s}`));if(!isValidElement(e))return null;const s=e,o=s.props??{},l=s.type;if(l===SkeletonSkip)return cloneElement(s,{key:`${n}-skip`});if("function"==typeof l||"object"==typeof l){const e=l.Skeleton;if(e){return _jsx(e,{...o},`${n}-self`)}}if(l===Image){const e=flattenStyle(o.style),s=resolveWidth(e.width,"100%"),l="number"==typeof e.height?e.height:120,a=resolveRadius(e.borderRadius,"sm");return _jsx(Skeleton,{width:s,height:l,radius:a,variant:t,speed:i,colors:r,style:{margin:"number"==typeof e.margin?e.margin:void 0}},`${n}-img`)}if(l===Text){const e=flattenStyle(o.style),s="number"==typeof e.fontSize?e.fontSize:14,l=resolveWidth(e.width,"85%");return _jsx(Skeleton,{shape:"text",width:l,height:Math.round(1.15*s),variant:t,speed:i,colors:r,style:{marginVertical:2}},`${n}-txt`)}if(null!=o.children)return cloneElement(s,{key:`${n}-w`},skeletonizeNode(o.children,t,i,r,`${n}-c`));if(l===View){const e=flattenStyle(o.style);if(null!=e.width||null!=e.height){const s=resolveWidth(e.width,"100%"),o="number"==typeof e.height?e.height:20,l=resolveRadius(e.borderRadius,"sm");return _jsx(Skeleton,{width:s,height:o,radius:l,variant:t,speed:i,colors:r},`${n}-vw`)}}return cloneElement(s,{key:`${n}-leaf`})},SkeletonContent=({loading:e,children:t,placeholder:i,variant:r,speed:n,count:s=1,colors:o,fadeDuration:l,style:a,testID:
|
|
1
|
+
"use strict";import React,{Children,cloneElement,isValidElement,useEffect,useRef}from"react";import{Animated,Image,StyleSheet,Text,View}from"react-native";import{usePresenceMotion}from"../../hooks/usePresenceMotion.js";import{createAnimatedValue}from"../../theme/index.js";import{Skeleton}from"./Skeleton.js";import{useSkeletonDefaults}from"./SkeletonProvider.js";import{SkeletonSkip}from"./SkeletonSkip.js";import{jsx as _jsx,Fragment as _Fragment}from"react/jsx-runtime";const DEFAULT_REVEAL_FADE_MS=300,flattenStyle=e=>{if(!e)return{};return StyleSheet.flatten(e)??{}},resolveWidth=(e,t)=>"number"==typeof e?e:"string"!=typeof e||"auto"!==e&&"100%"!==e&&!/^\d+(\.\d+)?%$/.test(e)?t:e,resolveRadius=(e,t)=>"number"==typeof e?e:t,skeletonizeNode=(e,t,i,r,n="r")=>{if(null==e||"boolean"==typeof e)return null;if("string"==typeof e||"number"==typeof e)return _jsx(Skeleton,{shape:"text",width:"60%",height:14,variant:t,speed:i,colors:r},`${n}-text`);if(Array.isArray(e))return Children.map(e,(e,s)=>skeletonizeNode(e,t,i,r,`${n}-${s}`));if(!isValidElement(e))return null;const s=e,o=s.props??{},l=s.type;if(l===SkeletonSkip)return cloneElement(s,{key:`${n}-skip`});if("function"==typeof l||"object"==typeof l){const e=l.Skeleton;if(e){return _jsx(e,{...o},`${n}-self`)}}if(l===Image){const e=flattenStyle(o.style),s=resolveWidth(e.width,"100%"),l="number"==typeof e.height?e.height:120,a=resolveRadius(e.borderRadius,"sm");return _jsx(Skeleton,{width:s,height:l,radius:a,variant:t,speed:i,colors:r,style:{margin:"number"==typeof e.margin?e.margin:void 0}},`${n}-img`)}if(l===Text){const e=flattenStyle(o.style),s="number"==typeof e.fontSize?e.fontSize:14,l=resolveWidth(e.width,"85%");return _jsx(Skeleton,{shape:"text",width:l,height:Math.round(1.15*s),variant:t,speed:i,colors:r,style:{marginVertical:2}},`${n}-txt`)}if(null!=o.children)return cloneElement(s,{key:`${n}-w`},skeletonizeNode(o.children,t,i,r,`${n}-c`));if(l===View){const e=flattenStyle(o.style);if(null!=e.width||null!=e.height){const s=resolveWidth(e.width,"100%"),o="number"==typeof e.height?e.height:20,l=resolveRadius(e.borderRadius,"sm");return _jsx(Skeleton,{width:s,height:o,radius:l,variant:t,speed:i,colors:r},`${n}-vw`)}}return cloneElement(s,{key:`${n}-leaf`})},SkeletonContent=({loading:e,children:t,placeholder:i,variant:r,speed:n,count:s=1,colors:o,fadeDuration:l,style:a,testID:u})=>{const c=useSkeletonDefaults(),d=usePresenceMotion(),f=l??c.fadeDuration??(d.reduced?d.duration("normal"):300),m=useRef(e),h=useRef(createAnimatedValue(e?0:1)).current;if(useEffect(()=>{let t;return m.current&&!e?(h.setValue(0),t=Animated.timing(h,{toValue:1,duration:f,useNativeDriver:!0}),t.start()):!m.current&&e&&h.setValue(1),m.current=e,()=>t?.stop()},[e,h,f]),!e)return f<=0?_jsx(_Fragment,{children:t}):_jsx(Animated.View,{style:[a,{opacity:h}],testID:u,children:t});if(void 0!==i){const e=s>1?Array.from({length:s},(e,t)=>_jsx(React.Fragment,{children:i},`sk-ph-${t}`)):i;return _jsx(View,{style:a,testID:u,accessible:!0,accessibilityLabel:"Loading",accessibilityRole:"progressbar",accessibilityState:{busy:!0},"aria-busy":!0,accessibilityLiveRegion:"polite",children:e})}const y=s>1?Array.from({length:s},(e,i)=>_jsx(React.Fragment,{children:t},`sk-rep-${i}`)):t;return _jsx(View,{style:a,testID:u,accessible:!0,accessibilityLabel:"Loading",accessibilityRole:"progressbar",accessibilityState:{busy:!0},"aria-busy":!0,accessibilityLiveRegion:"polite",children:skeletonizeNode(y,r,n,o)})};SkeletonContent.displayName="SkeletonContent";export{SkeletonContent};export default SkeletonContent;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";import{createContext,useContext,
|
|
1
|
+
"use strict";import{createContext,useContext,useMemo}from"react";import{SkeletonClockProvider}from"./SkeletonClock.js";import{jsx as _jsx}from"react/jsx-runtime";const SkeletonDefaultsContext=createContext({});export const SkeletonProvider=({children:e,variant:t,speed:o,placeholderCount:r,radius:n,colors:a,fadeDuration:s,animation:l="auto"})=>{const i="never"!==l,d=o??"normal",u=t??"shimmer",c=useMemo(()=>({variant:t,speed:o,placeholderCount:r,radius:n,colors:a,fadeDuration:s,animation:l}),[t,o,r,n,a,s,l]);return _jsx(SkeletonDefaultsContext.Provider,{value:c,children:_jsx(SkeletonClockProvider,{speed:d,variant:u,enabled:i,children:e})})};SkeletonProvider.displayName="SkeletonProvider";export const useSkeletonDefaults=()=>useContext(SkeletonDefaultsContext);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";export{default,Skeleton,SkeletonCircle,SkeletonText}from"./Skeleton.js";export{SkeletonClockProvider,useSkeletonClock}from"./SkeletonClock.js";export{SkeletonContent}from"./SkeletonContent.js";export{SkeletonList}from"./SkeletonList.js";export{SkeletonProvider,
|
|
1
|
+
"use strict";export{default,Skeleton,SkeletonCircle,SkeletonText}from"./Skeleton.js";export{SkeletonClockProvider,useSkeletonClock}from"./SkeletonClock.js";export{SkeletonContent}from"./SkeletonContent.js";export{SkeletonList}from"./SkeletonList.js";export{SkeletonProvider,useSkeletonDefaults}from"./SkeletonProvider.js";export{SkeletonSkip}from"./SkeletonSkip.js";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";import{forwardRef,useEffect,useMemo,useRef}from"react";import{ActivityIndicator,Animated,Easing,StyleSheet,Text,View}from"react-native";import{createAnimatedValue,useTheme}from"../../theme/index.js";import{announce}from"../../utils/announce.js";import{blendOf}from"../../utils/color.js";import{smoothCorners}from"../../utils/corners.js";import{squircleHostRadius}from"../../utils/squircle.js";import{SquircleFill,useSquircle}from"../SquircleFill/SquircleFill.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const sizeMap={sm:20,md:32,lg:48},CONTAINER_RATIO=1.5,DOT_COUNT=3,DOT_STAGGER_MS=150,DOT_CYCLE_MS=600,Dot=({size:e,color:t,delay:i,duration:n})=>{const
|
|
1
|
+
"use strict";import{forwardRef,useEffect,useMemo,useRef}from"react";import{ActivityIndicator,Animated,Easing,StyleSheet,Text,View}from"react-native";import{usePresenceMotion}from"../../hooks/usePresenceMotion.js";import{createAnimatedValue,useTheme}from"../../theme/index.js";import{announce}from"../../utils/announce.js";import{blendOf}from"../../utils/color.js";import{smoothCorners}from"../../utils/corners.js";import{squircleHostRadius}from"../../utils/squircle.js";import{SquircleFill,useSquircle}from"../SquircleFill/SquircleFill.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const sizeMap={sm:20,md:32,lg:48},CONTAINER_RATIO=1.5,DOT_COUNT=3,DOT_STAGGER_MS=150,DOT_CYCLE_MS=600,DOT_GROW_SCALE=1.4,DOT_PULSE_MIN_OPACITY=.4,Dot=({size:e,color:t,delay:i,duration:n,reduced:r})=>{const o=useRef(createAnimatedValue(0)).current;useEffect(()=>{const e=Animated.loop(Animated.sequence([Animated.delay(i),Animated.timing(o,{toValue:1,duration:n/2,easing:Easing.out(Easing.quad),useNativeDriver:!0}),Animated.timing(o,{toValue:0,duration:n/2,easing:Easing.in(Easing.quad),useNativeDriver:!0})]));return e.start(),()=>{e.stop()}},[o,i,n]);const s=useMemo(()=>({grow:o.interpolate({inputRange:[0,1],outputRange:[1,1.4]}),fade:o.interpolate({inputRange:[0,1],outputRange:[.4,1]})}),[o]);return _jsx(Animated.View,{style:{width:e,height:e,borderRadius:e/2,...smoothCorners,backgroundColor:t,...r?{opacity:s.fade}:{transform:[{scale:s.grow}]}}})},Spinner=forwardRef((e,t)=>{const{size:i="md",color:n,message:r,overlay:o=!1,backdropColor:s,variant:a="circular",accessibilityLabel:l,style:c,testID:u}=e,d="contained"===a,m=o&&!d,g=useTheme(),y=usePresenceMotion(),f=y.duration("normal"),p=useRef(createAnimatedValue(0)).current;useEffect(()=>{Animated.timing(p,{toValue:1,duration:f,easing:Easing.bezier(...g.motion.easing.standard),useNativeDriver:!0}).start()},[p,g,f]);const h=useMemo(()=>buildStyles(g),[g]),b=sizeMap[i],j=n??g.colors.primary,x=s??g.colors.background.overlay,C=useMemo(()=>{if("contained"===a){const e=Math.round(1.5*b);return _jsx(View,{style:[h.container,{width:e,height:e,borderRadius:e/2,backgroundColor:blendOf(j,.14,g.colors.background.elevated,g.colors.background.secondary)}],children:_jsx(ActivityIndicator,{color:j,size:"sm"===i?"small":"large",style:{width:b,height:b}})})}if("dots"===a){const e=Math.max(6,Math.round(b/4));return _jsx(View,{style:[h.dotsRow,{gap:Math.round(e/2)}],children:Array.from({length:3}).map((t,i)=>_jsx(Dot,{size:e,color:j,delay:150*i,duration:600,reduced:y.reduced},i))})}return _jsx(ActivityIndicator,{color:j,size:"sm"===i?"small":"large",style:{width:b,height:b}})},[a,i,b,j,h.dotsRow,h.container,y.reduced,g.colors.background.elevated,g.colors.background.secondary]),S=l??r??"Loading",v=useRef(S);v.current=S,useEffect(()=>{d&&announce(v.current)},[d]);const R=useSquircle(m,g.radius.lg),_=R.active&&R.size?{borderRadius:squircleHostRadius(R.size.width,R.size.height,g.radius.lg)}:null;let w=h.inlineContent;m?w=h.overlayContent:d&&(w=h.containedContent);const A=_jsxs(Animated.View,{ref:t,accessible:!0,accessibilityRole:"progressbar",accessibilityLiveRegion:d?"none":"polite",accessibilityLabel:S,accessibilityState:{busy:!0},"aria-busy":!0,testID:u,onLayout:R.onLayout,style:[w,_,{opacity:p}],children:[R.active&&R.size?_jsx(SquircleFill,{width:R.size.width,height:R.size.height,radius:g.radius.lg,fill:g.colors.background.elevated}):null,C,r?_jsx(Text,{style:[h.message,{color:g.colors.text.primary,fontSize:g.typography.fontSize.base,fontWeight:g.typography.fontWeight.medium,marginTop:g.spacing.md}],numberOfLines:2,children:r}):null]});return _jsx(View,m?{pointerEvents:"auto",style:[h.overlay,{backgroundColor:x},c],children:A}:{style:[d?h.containedFill:h.inline,c],children:A})});Spinner.displayName="Spinner";const buildStyles=e=>StyleSheet.create({inline:{alignItems:"center",justifyContent:"center"},inlineContent:{alignItems:"center",justifyContent:"center"},containedFill:{flex:1,alignSelf:"stretch",alignItems:"center",justifyContent:"center",minHeight:Math.round(1.5*sizeMap.lg)+2*e.spacing.xl},containedContent:{alignItems:"center",justifyContent:"center",paddingHorizontal:e.spacing.lg},container:{alignItems:"center",justifyContent:"center"},overlay:{...StyleSheet.absoluteFill,alignItems:"center",justifyContent:"center",zIndex:1e3},overlayContent:{alignItems:"center",justifyContent:"center",backgroundColor:e.colors.background.elevated,borderRadius:e.radius.lg,...smoothCorners,paddingHorizontal:e.spacing.xl,paddingVertical:e.spacing.xl,minWidth:140,...e.shadows.lg},dotsRow:{flexDirection:"row",alignItems:"center",justifyContent:"center"},message:{textAlign:"center"}});export{Spinner};export default Spinner;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";import{forwardRef,useCallback,useMemo,useRef,useState}from"react";import{StyleSheet,TextInput,View}from"react-native";import{useControllableState}from"../../hooks/index.js";import{fontFor,useTheme}from"../../theme/index.js";import{mergeRefs,resolveHaptic,triggerHaptic}from"../../utils/index.js";import{Chip}from"../Chip/index.js";import{FieldBase,FieldLabel,FieldMessage,hasFieldText}from"../FieldBase/index.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";export const TagInput=forwardRef((e,t)=>{const{value:
|
|
1
|
+
"use strict";import{forwardRef,useCallback,useMemo,useRef,useState}from"react";import{StyleSheet,TextInput,View}from"react-native";import{useControllableState}from"../../hooks/index.js";import{fontFor,useTheme}from"../../theme/index.js";import{mergeRefs,resolveHaptic,triggerHaptic}from"../../utils/index.js";import{Chip}from"../Chip/index.js";import{FieldBase,FieldLabel,FieldMessage,hasFieldText,RequiredPlaceholder}from"../FieldBase/index.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";export const TagInput=forwardRef((e,t)=>{const{value:r,defaultValue:s,onChange:l,placeholder:i,label:a,helperText:o,error:n,required:u,disabled:c=!1,size:d="md",variant:p,maxTags:f,unique:m=!0,transform:x,separators:h=[","],haptic:g,style:b,testID:y}=e,j=useTheme(),C=useMemo(()=>buildStyles(j),[j]),[S,v]=useControllableState({value:r,defaultValue:s??[],onChange:l}),[T,w]=useState(""),[F,_]=useState(!1),k=useRef(null),I=useMemo(()=>mergeRefs(k,t),[t]),z=useCallback(()=>{c||k.current?.focus()},[c]),B="number"==typeof f&&S.length>=f,R=!0===n||hasFieldText(n),V=u&&!a&&0===S.length&&0===T.length&&Boolean(i),H=useCallback(e=>{const t=x?x(e.trim()):e.trim();if(!t)return;if(B)return;if(m&&S.some(e=>e.toLowerCase()===t.toLowerCase()))return void w("");v([...S,t]),w("");const r=resolveHaptic(g,"selection");r&&triggerHaptic(r)},[B,g,v,S,x,m]),q=useCallback(e=>{const t=S.filter((t,r)=>r!==e);v(t);const r=resolveHaptic(g,"selection");r&&triggerHaptic(r)},[g,v,S]),L=useCallback(e=>{const t=h.find(t=>t.length>0&&e.includes(t));if(t){const[r]=e.split(t);return void H(r)}w(e)},[H,h]),M=useCallback(e=>{c||"Backspace"===e.nativeEvent.key&&""===T&&S.length>0&&q(S.length-1)},[c,T,q,S.length]),D=_jsx(FieldBase,{size:d,variant:p,focused:F,disabled:c,error:R,filled:S.length>0||T.length>0,onPress:z,pressFeedback:!1,style:b,children:_jsxs(View,{style:C.wrap,children:[S.map((e,t)=>_jsx(Chip,{label:e,size:"sm",onClose:c?void 0:()=>q(t),haptic:g},`${e}-${t}`)),_jsxs(View,{style:C.inputBox,children:[_jsx(TextInput,{ref:I,value:T,onChangeText:L,onKeyPress:M,onSubmitEditing:()=>H(T),onFocus:()=>_(!0),onBlur:()=>{_(!1),H(T)},editable:!c&&!B,placeholder:B||V?void 0:i,placeholderTextColor:j.colors.text.tertiary,blurOnSubmit:!1,returnKeyType:"done",accessibilityLabel:a??i,style:[C.input,{color:j.colors.text.primary,fontSize:j.typography.fontSize.base}],testID:y?`${y}-input`:void 0}),V?_jsx(RequiredPlaceholder,{text:i??"",color:j.colors.text.tertiary,fontSize:j.typography.fontSize.base,weightStyle:fontFor(j,"normal")}):null]})]})});return _jsxs(View,{testID:y,children:[a?_jsx(FieldLabel,{size:d,required:u,children:a}):null,D,_jsx(FieldMessage,{size:d,error:R,text:R?n:o})]})});TagInput.displayName="TagInput";const buildStyles=e=>StyleSheet.create({wrap:{flex:1,flexDirection:"row",flexWrap:"wrap",alignItems:"center",gap:e.spacing.xs,paddingVertical:e.spacing.xs},inputBox:{flexGrow:1,minWidth:80},input:{...fontFor(e,"normal"),padding:0}});export default TagInput;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";import{forwardRef,useMemo}from"react";import{Text as RNText}from"react-native";import{fontFor,useTheme}from"../../theme/index.js";import{jsx as _jsx}from"react/jsx-runtime";const VARIANTS={display:{size:"4xl",weight:"bold",line:"tight",color:"primary",heading:!0,fontFamily:"display"},h1:{size:"3xl",weight:"bold",line:"tight",color:"primary",heading:!0,fontFamily:"display"},h2:{size:"2xl",weight:"semibold",line:"tight",color:"primary",heading:!0,fontFamily:"display"},h3:{size:"xl",weight:"semibold",line:"tight",color:"primary",heading:!0},title:{size:"lg",weight:"semibold",line:"normal",color:"primary",fontFamily:"display"},body:{size:"base",weight:"normal",line:"normal",color:"primary"},bodySmall:{size:"sm",weight:"normal",line:"normal",color:"secondary"},caption:{size:"xs",weight:"normal",line:"normal",color:"tertiary"},label:{size:"sm",weight:"medium",line:"normal",color:"secondary"},overline:{size:"xs",weight:"semibold",line:"normal",color:"secondary",uppercase:!0,letterSpacing:"wide"}},TEXT_ROLES={primary:!0,secondary:!0,tertiary:!0,inverse:!0,disabled:!0,link:!0,textStrong:!0},TEXT_ROLE_KEY={textStrong:"strong"},SEMANTIC={success:!0,warning:!0,error:!0,info:!0};export const resolveColor=(e,i)=>TEXT_ROLES[i]?e.colors.text[TEXT_ROLE_KEY[i]??i]:SEMANTIC[i]?e.colors.toneText[i]:i;const Text=forwardRef((e,i)=>{const{variant:t="body",color:o,weight:r,size:n,align:l,italic:a,underline:s,style:c,children:m,...p}=e,d=useTheme(),y=Object.hasOwn(VARIANTS,t),g=d.textVariants,h=!y&&g&&Object.hasOwn(g,t)?g[t]:void 0,f=useMemo(()=>{if(h){const{typography:e}=d,i="number"==typeof h.size?h.size:e.fontSize[h.size],t="number"==typeof n?n:n?e.fontSize[n]:i,c=h.lineHeight,m=h.letterSpacing;return{fontSize:t,lineHeight:"number"==typeof c?c:c?Math.round(t*e.lineHeight[c]):void 0,color:resolveColor(d,o??h.color??"primary"),textAlign:l,textTransform:h.uppercase?"uppercase":void 0,letterSpacing:"number"!=typeof m&&m?e.letterSpacing[m]:m,fontStyle:a||h.italic?"italic":void 0,fontVariant:h.fontVariant,textDecorationLine:s?"underline":void 0,...fontFor(d,r??h.weight??"normal",h.fontFamily)}}const e=VARIANTS[y?t:"body"],i="number"==typeof n?n:d.typography.fontSize[n??e.size];return{fontSize:i,lineHeight:Math.round(i*d.typography.lineHeight[e.line]),color:resolveColor(d,o??e.color),textAlign:l,textTransform:e.uppercase?"uppercase":void 0,letterSpacing:e.letterSpacing?d.typography.letterSpacing[e.letterSpacing]:void 0,fontStyle:a?"italic":void 0,textDecorationLine:s?"underline":void 0,...fontFor(d,r??e.weight,e.fontFamily)}},[d,h,y,t,o,r,n,l,a,s]),x
|
|
1
|
+
"use strict";import{forwardRef,useMemo}from"react";import{Text as RNText}from"react-native";import{fontFor,useTheme}from"../../theme/index.js";import{jsx as _jsx}from"react/jsx-runtime";const VARIANTS={display:{size:"4xl",weight:"bold",line:"tight",color:"primary",heading:!0,fontFamily:"display"},h1:{size:"3xl",weight:"bold",line:"tight",color:"primary",heading:!0,fontFamily:"display"},h2:{size:"2xl",weight:"semibold",line:"tight",color:"primary",heading:!0,fontFamily:"display"},h3:{size:"xl",weight:"semibold",line:"tight",color:"primary",heading:!0},title:{size:"lg",weight:"semibold",line:"normal",color:"primary",fontFamily:"display"},body:{size:"base",weight:"normal",line:"normal",color:"primary"},bodySmall:{size:"sm",weight:"normal",line:"normal",color:"secondary"},caption:{size:"xs",weight:"normal",line:"normal",color:"tertiary"},label:{size:"sm",weight:"medium",line:"normal",color:"secondary"},overline:{size:"xs",weight:"semibold",line:"normal",color:"secondary",uppercase:!0,letterSpacing:"wide"}},TEXT_ROLES={primary:!0,secondary:!0,tertiary:!0,inverse:!0,disabled:!0,link:!0,textStrong:!0},TEXT_ROLE_KEY={textStrong:"strong"},SEMANTIC={success:!0,warning:!0,error:!0,info:!0};export const resolveColor=(e,i)=>TEXT_ROLES[i]?e.colors.text[TEXT_ROLE_KEY[i]??i]:SEMANTIC[i]?e.colors.toneText[i]:i;const Text=forwardRef((e,i)=>{const{variant:t="body",color:o,weight:r,size:n,align:l,italic:a,underline:s,style:c,children:m,...p}=e,d=useTheme(),y=Object.hasOwn(VARIANTS,t),g=d.textVariants,h=!y&&g&&Object.hasOwn(g,t)?g[t]:void 0,f=useMemo(()=>{if(h){const{typography:e}=d,i="number"==typeof h.size?h.size:e.fontSize[h.size],t="number"==typeof n?n:n?e.fontSize[n]:i,c=h.lineHeight,m=h.letterSpacing;return{fontSize:t,lineHeight:"number"==typeof c?c:c?Math.round(t*e.lineHeight[c]):void 0,color:resolveColor(d,o??h.color??"primary"),textAlign:l,textTransform:h.uppercase?"uppercase":void 0,letterSpacing:"number"!=typeof m&&m?e.letterSpacing[m]:m,fontStyle:a||h.italic?"italic":void 0,fontVariant:h.fontVariant,textDecorationLine:s?"underline":void 0,...fontFor(d,r??h.weight??"normal",h.fontFamily)}}const e=VARIANTS[y?t:"body"],i="number"==typeof n?n:d.typography.fontSize[n??e.size];return{fontSize:i,lineHeight:Math.round(i*d.typography.lineHeight[e.line]),color:resolveColor(d,o??e.color),textAlign:l,textTransform:e.uppercase?"uppercase":void 0,letterSpacing:e.letterSpacing?d.typography.letterSpacing[e.letterSpacing]:void 0,fontStyle:a?"italic":void 0,textDecorationLine:s?"underline":void 0,...fontFor(d,r??e.weight,e.fontFamily)}},[d,h,y,t,o,r,n,l,a,s]),x=y?VARIANTS[t].heading:h?.heading;return _jsx(RNText,{ref:i,style:[f,c],maxFontSizeMultiplier:d.maxFontSizeMultiplier,accessibilityRole:x?"header":p.accessibilityRole,...p,children:m})});Text.displayName="Text";export{Text};export default Text;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";import{useCallback,useEffect,useMemo,useRef,useState}from"react";import{Animated,Easing,Modal,Pressable,StyleSheet,Text,View}from"react-native";import{GestureDetector,GestureHandlerRootView}from"react-native-gesture-handler";import{useDragToDismiss}from"../../hooks/useDragToDismiss.js";import{createAnimatedValue,setNativeValue,useTheme}from"../../theme/index.js";import{smoothCorners}from"../../utils/corners.js";import{triggerHaptic}from"../../utils/hapticUtils.js";import Button from"../Button/Button.js";import{ModalSafeArea,useModalInsets}from"../ModalSafeArea/ModalSafeArea.js";import{PickerTrigger}from"../PickerTrigger/PickerTrigger.js";import{ToastHost}from"../Toast/ToastProvider.js";import{WheelPicker}from"../WheelPicker/index.js";import{jsx as _jsx,jsxs as _jsxs,Fragment as _Fragment}from"react/jsx-runtime";const range=(e,t,i=1)=>{const a=[];for(let r=e;r<=t;r+=i)a.push(r);return a},pad2=e=>e.toString().padStart(2,"0"),to24h=(e,t,i)=>"24h"===i?e:"AM"===t?12===e?0:e:12===e?12:e+12,from24h=(e,t)=>"24h"===t?{displayHour:e,period:"AM"}:0===e?{displayHour:12,period:"AM"}:12===e?{displayHour:12,period:"PM"}:e>12?{displayHour:e-12,period:"PM"}:{displayHour:e,period:"AM"},clampMinuteToStep=(e,t)=>{const i=Math.round(e/t)*t;return Math.min(59,Math.max(0,i))},TimePicker=e=>{const{visible:t,value:i,onChange:a,onClose:r,format:s="12h",minuteStep:o=1,title:n="Select Time",confirmLabel:l="Confirm",cancelLabel:u="Cancel",testID:m,style:c,containerStyle:d,headerLabelStyle:p,footerButtonStyle:g,label:h,placeholder:f,helperText:y,error:b,required:x,disabled:
|
|
1
|
+
"use strict";import{useCallback,useEffect,useMemo,useRef,useState}from"react";import{Animated,Easing,Modal,Pressable,StyleSheet,Text,View}from"react-native";import{GestureDetector,GestureHandlerRootView}from"react-native-gesture-handler";import{useDragToDismiss}from"../../hooks/useDragToDismiss.js";import{usePresenceMotion}from"../../hooks/usePresenceMotion.js";import{createAnimatedValue,setNativeValue,useTheme}from"../../theme/index.js";import{smoothCorners}from"../../utils/corners.js";import{triggerHaptic}from"../../utils/hapticUtils.js";import Button from"../Button/Button.js";import{ModalSafeArea,useModalInsets}from"../ModalSafeArea/ModalSafeArea.js";import{PickerTrigger}from"../PickerTrigger/PickerTrigger.js";import{ToastHost}from"../Toast/ToastProvider.js";import{WheelPicker}from"../WheelPicker/index.js";import{jsx as _jsx,jsxs as _jsxs,Fragment as _Fragment}from"react/jsx-runtime";const AnimatedGestureRoot=Animated.createAnimatedComponent(GestureHandlerRootView),transparentOf=e=>{const t=e.match(/^rgba?\(([^)]+)\)$/);if(!t)return"transparent";const[i,a,r]=t[1].split(",").map(e=>e.trim());return`rgba(${i}, ${a}, ${r}, 0)`},range=(e,t,i=1)=>{const a=[];for(let r=e;r<=t;r+=i)a.push(r);return a},pad2=e=>e.toString().padStart(2,"0"),to24h=(e,t,i)=>"24h"===i?e:"AM"===t?12===e?0:e:12===e?12:e+12,from24h=(e,t)=>"24h"===t?{displayHour:e,period:"AM"}:0===e?{displayHour:12,period:"AM"}:12===e?{displayHour:12,period:"PM"}:e>12?{displayHour:e-12,period:"PM"}:{displayHour:e,period:"AM"},clampMinuteToStep=(e,t)=>{const i=Math.round(e/t)*t;return Math.min(59,Math.max(0,i))},TimePicker=e=>{const{visible:t,value:i,onChange:a,onClose:r,format:s="12h",minuteStep:o=1,title:n="Select Time",confirmLabel:l="Confirm",cancelLabel:u="Cancel",testID:m,style:c,containerStyle:d,headerLabelStyle:p,footerButtonStyle:g,label:h,placeholder:f,helperText:y,error:b,required:x,disabled:v,size:M,variant:k,clearable:A,onClear:S,formatValue:j,triggerStyle:T,haptic:w}=e,D=void 0!==e.visible,[P,V]=useState(!1),C=D?t:P,H=D?m:m?`${m}-modal`:void 0,R=useTheme(),_=usePresenceMotion(),[N,$]=useModalInsets(),B=useMemo(()=>buildStyles(R),[R]),I=useRef(createAnimatedValue(0)).current,O=useRef(createAnimatedValue(0)).current,L=useRef(createAnimatedValue(40)).current,z=useRef(createAnimatedValue(0)).current,F=useRef(0),W=useCallback(()=>{D?r?.():V(!1)},[D,r]),E=useCallback(()=>{const e=Animated.timing(I,{toValue:0,duration:_.duration("fast"),easing:Easing.bezier(...R.motion.easing.accelerate),useNativeDriver:!0}),t=Animated.timing(O,{toValue:0,duration:_.duration("normal"),useNativeDriver:!1});(_.reduced?Animated.parallel([e,t]):Animated.parallel([e,t,Animated.timing(L,{toValue:40,duration:R.motion.duration.fast,easing:Easing.bezier(...R.motion.easing.accelerate),useNativeDriver:!0})])).start(()=>W())},[O,W,I,_,L,R.motion.duration.fast,R.motion.easing.accelerate]),{handleGesture:G,opacity:q}=useDragToDismiss({drag:z,travel:()=>F.current||320,onDismiss:E}),U=useMemo(()=>Animated.multiply(I,q),[I,q]),Y=useMemo(()=>O.interpolate({inputRange:[0,1],outputRange:[transparentOf(R.colors.background.overlay),R.colors.background.overlay]}),[O,R.colors.background.overlay]),J=useMemo(()=>"24h"===s?range(0,23):range(1,12),[s]),K=useMemo(()=>range(0,59,o),[o]),Q=useMemo(()=>["AM","PM"],[]),X=useMemo(()=>{const e=i&&Number.isFinite(i.hour)?i.hour:(new Date).getHours(),t=i&&Number.isFinite(i.minute)?i.minute:(new Date).getMinutes(),a=clampMinuteToStep(t,o),{displayHour:r,period:n}=from24h(e,s);return{displayHour:r,minute:a,period:n,hour24:e}},[i,s,o]),[Z,ee]=useState(()=>{const e=J.indexOf(X.displayHour);return e>=0?e:0}),[te,ie]=useState(()=>{const e=K.indexOf(X.minute);return e>=0?e:0}),[ae,re]=useState(()=>"PM"===X.period?1:0);useEffect(()=>{if(!C)return;const e=i&&Number.isFinite(i.hour)?i.hour:(new Date).getHours(),t=i&&Number.isFinite(i.minute)?i.minute:(new Date).getMinutes(),a=clampMinuteToStep(t,o),{displayHour:r,period:n}=from24h(e,s),l=J.indexOf(r);ee(l>=0?l:0);const u=K.indexOf(a);ie(u>=0?u:0),re("PM"===n?1:0)},[C,i,s,o,J,K]),useEffect(()=>{let e;if(C){const t=Animated.timing(I,{toValue:1,duration:_.duration("normal"),easing:Easing.out(Easing.cubic),useNativeDriver:!0}),i=Animated.timing(O,{toValue:1,duration:_.duration("normal"),useNativeDriver:!1});_.reduced?(setNativeValue(L,0),e=Animated.parallel([t,i])):e=Animated.parallel([t,i,Animated.spring(L,{toValue:0,damping:R.motion.spring.snappy.damping,stiffness:R.motion.spring.snappy.stiffness,mass:R.motion.spring.snappy.mass,useNativeDriver:!0})]),e.start()}else I.setValue(0),O.setValue(0),setNativeValue(L,40),setNativeValue(z,0),setNativeValue(q,1);return()=>e?.stop()},[C,I,O,_,L,z,q,R.motion]);const se=useCallback((e,t)=>{"hour"===e?ee(Math.max(0,J.indexOf(Number(t)))):"minute"===e?ie(Math.max(0,K.indexOf(Number(t)))):re("PM"===t?1:0)},[J,K]),oe=useCallback(()=>{!1!==w&&triggerHaptic("selection"),E()},[E,w]),ne=useCallback(()=>{const e=J[Z]??0,t=Q[ae]??"AM",i=to24h(e,t,s),r=K[te]??0;!1!==w&&triggerHaptic("notificationSuccess"),a?.({hour:i,minute:r}),E()},[J,Z,Q,ae,K,te,s,a,E,w]),le=useMemo(()=>{const e=J[Z]??0,t=K[te]??0;if("24h"===s)return`${pad2(e)}:${pad2(t)}`;const i=Q[ae]??"AM";return`${pad2(e)}:${pad2(t)} ${i}`},[J,Z,K,te,Q,ae,s]),ue=useMemo(()=>J.map(e=>({value:e,label:pad2(e),accessibilityLabel:`Hour ${e}`})),[J]),me=useMemo(()=>K.map(e=>({value:e,label:pad2(e),accessibilityLabel:`${e} minutes`})),[K]),ce=useMemo(()=>Q.map(e=>({value:e,label:e})),[Q]),de=useMemo(()=>{const e=[{key:"hour",label:"Hour",items:ue,value:J[Z]??0,separator:":",testID:"time-picker-hour"},{key:"minute",label:"Minute",items:me,value:K[te]??0,gapAfter:"12h"===s?R.spacing.md:void 0,testID:"time-picker-minute"}];return"12h"===s&&e.push({key:"period",label:"Period",items:ce,value:Q[ae]??"AM",testID:"time-picker-period"}),e},[ue,me,ce,J,Z,K,te,Q,ae,s,R.spacing.md]),pe=useCallback(e=>{if("24h"===s)return`${pad2(e.hour)}:${pad2(e.minute)}`;const{displayHour:t,period:i}=from24h(e.hour,"12h");return`${t}:${pad2(e.minute)} ${i}`},[s]),ge=!D&&i&&Number.isFinite(i.hour)&&Number.isFinite(i.minute)?(j??pe)(i):void 0,he=_jsx(Modal,{visible:C,transparent:!0,statusBarTranslucent:!0,navigationBarTranslucent:!0,animationType:"none",onRequestClose:E,testID:H,children:_jsx(ModalSafeArea,{onInsets:$,children:_jsxs(AnimatedGestureRoot,{collapsable:!1,style:[B.backdrop,{backgroundColor:Y}],children:[_jsx(Pressable,{style:StyleSheet.absoluteFill,onPress:E,accessibilityLabel:"Close time picker",accessibilityRole:"button"}),_jsx(Animated.View,{style:_.reduced?{opacity:U}:void 0,children:_jsxs(Animated.View,{style:[B.sheet,{paddingBottom:Math.max(N.bottom,R.spacing.lg),transform:[{translateY:Animated.add(L,z)}]},c,d],onLayout:e=>{F.current=e.nativeEvent.layout.height},accessibilityViewIsModal:!0,accessible:!0,accessibilityRole:"none",accessibilityLabel:n,children:[_jsx(GestureDetector,{gesture:G,children:_jsxs(View,{children:[_jsx(View,{style:B.handle}),_jsx(Text,{style:[B.title,p],accessibilityRole:"header",children:n})]})}),_jsx(View,{style:B.summaryWrap,accessibilityLiveRegion:"polite",accessibilityLabel:`Selected ${le}`,children:_jsx(Text,{style:B.summary,children:le})}),_jsx(WheelPicker,{columns:de,onChange:se,haptic:w,style:B.wheels}),_jsxs(View,{style:B.footer,children:[_jsx(Button,{title:u,haptic:!1,variant:"ghost",tone:"neutral",onPress:oe,style:[B.footerBtn,g],accessibilityHint:"Dismiss without changes",testID:"time-picker-cancel"}),_jsx(Button,{title:l,variant:"solid",tone:"primary",haptic:!1,onPress:ne,style:[B.footerBtn,g],accessibilityHint:"Confirm selected time",testID:"time-picker-confirm"})]})]})}),_jsx(ToastHost,{})]})})});return D?he:_jsxs(_Fragment,{children:[_jsx(PickerTrigger,{label:h,placeholder:f,helperText:y,error:b,required:x,disabled:v,size:M,variant:k,clearable:A,onClear:S,value:ge,onPress:()=>V(!0),triggerStyle:T,testID:m}),he]})},buildStyles=e=>{const t=e.shadows.xl;return StyleSheet.create({backdrop:{flex:1,justifyContent:"flex-end"},sheet:{backgroundColor:e.colors.background.elevated,borderTopLeftRadius:e.radius.xl,borderTopRightRadius:e.radius.xl,...smoothCorners,paddingTop:e.spacing.sm,paddingHorizontal:e.spacing.lg,paddingBottom:e.spacing.xl,shadowColor:t.shadowColor,shadowOffset:t.shadowOffset,shadowOpacity:t.shadowOpacity,shadowRadius:t.shadowRadius,elevation:t.elevation},handle:{alignSelf:"center",width:e.components.timePicker?.handleWidth??36,height:e.components.timePicker?.handleHeight??4,borderRadius:e.radius.full,...smoothCorners,backgroundColor:e.colors.border.secondary,marginBottom:e.spacing.sm},title:{textAlign:"center",fontSize:e.typography.fontSize.lg,fontWeight:e.typography.fontWeight.semibold,color:e.colors.text.primary,marginBottom:e.spacing.sm},summaryWrap:{alignItems:"center",marginBottom:e.spacing.md},summary:{fontSize:e.typography.fontSize["2xl"],fontWeight:e.typography.fontWeight.bold,color:e.colors.primary,letterSpacing:e.typography.letterSpacing.wide},wheels:{marginBottom:e.spacing.lg},footer:{flexDirection:"row",justifyContent:"flex-end",alignItems:"center",gap:e.spacing.sm},footerBtn:{paddingHorizontal:e.spacing.lg}})};export{TimePicker};export default TimePicker;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";import{useCallback,useEffect,useMemo,useRef,useState}from"react";import{Animated,Easing,PanResponder,Platform,Pressable,StyleSheet,Text,View}from"react-native";import{
|
|
1
|
+
"use strict";import{useCallback,useEffect,useMemo,useRef,useState}from"react";import{Animated,Easing,PanResponder,Platform,Pressable,StyleSheet,Text,View}from"react-native";import{usePresenceMotion}from"../../hooks/usePresenceMotion.js";import{createAnimatedValue,fontFor,setNativeValue,useTheme}from"../../theme/index.js";import{smoothCorners}from"../../utils/corners.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const DEFAULT_SWIPE_DISMISS_THRESHOLD=80,DEFAULT_SWIPE_VELOCITY_THRESHOLD=.5,DEFAULT_STACK_OFFSET=8,DEFAULT_STACK_SCALE_STEP=.04,DEFAULT_AUTO_DISMISS_MS=3e3,WEB_ACTION_MIN_DURATION_MS=8e3,COUNTDOWN_BAR_HEIGHT=3,ACTION_HIT_SLOP={top:8,bottom:8,left:8,right:8},DISMISS_ACTIONS=[{name:"dismiss",label:"Dismiss"}],Toast=({toast:e,index:t,onDismiss:n,shownAt:i,runtime:r})=>{const a=useTheme(),s=usePresenceMotion(),o=s.duration("fast"),l=e.variant??"default",c=e.position??"bottom",u=useMemo(()=>buildStyles(a),[a]),d=useMemo(()=>tintFor(a,l),[a,l]),m=useMemo(()=>inkFor(a,l),[a,l]),p=a.components.toast,g=p?.iconCircleSize??28,h=p?.iconCircleBorderRadius??14,f=p?.iconGlyphFontSize??16,b=p?.tintBarWidth??0,S=p?.swipeDismissThreshold??80,A=p?.swipeVelocityThreshold??.5,v=p?.stackOffset??8,y=p?.stackScaleStep??.04,x=p?.stackMinScale??.9,w=p?.defaultDurationMs??3e3,T=p?.enableSwipeDismiss??!0,M=p?.enterSpringDamping??18,D=p?.enterSpringStiffness??180,_=p?.enterSpringMass??1,V="top"===c?-120:120,C=useRef(createAnimatedValue(s.reduced?0:V)).current,R=useRef(createAnimatedValue(0)).current,E=useRef(createAnimatedValue(0)).current,N=useRef(!1),I="top"===c?t*v:-t*v,k=Math.max(1-t*y,x),P=useRef(createAnimatedValue(I)).current;useEffect(()=>{setNativeValue(P,I)},[I,P]);const j=useMemo(()=>Animated.add(C,P),[C,P]),O=void 0!==e.action,L=e.duration??w,F=L>0&&O&&"web"===Platform.OS?Math.max(L,8e3):L,B=F<=0||O&&!0===r?.screenReaderOn,H=!0===e.countdown&&!B,z=useRef(createAnimatedValue(1)).current,U=useRef({initialised:!1,timer:null,remaining:0,startedAt:0}),G=useRef({touch:!1,pan:!1,hover:!1}),W=useRef(()=>{}),$=useRef({id:e.id,totalMs:F,shownAt:i,runtime:r,persistent:B,animateBar:!1});$.current={id:e.id,totalMs:F,shownAt:i,runtime:r,persistent:B,animateBar:H&&!s.reduced};const K=useCallback(()=>{const e=U.current,t=$.current,n=G.current;if(!e.initialised){e.initialised=!0;const n=t.runtime?.readRemaining(t.id),i=void 0===t.shownAt?0:Date.now()-t.shownAt;e.remaining=n??(t.totalMs>0?Math.max(t.totalMs-i,0):0),t.totalMs>0&&e.remaining<t.totalMs&&setNativeValue(z,e.remaining/t.totalMs)}const i=!(t.persistent||N.current||n.touch||n.pan||n.hover);i&&null===e.timer?(e.startedAt=Date.now(),e.timer=setTimeout(()=>{e.timer=null,e.remaining=0,W.current()},e.remaining),t.animateBar&&Animated.timing(z,{toValue:0,duration:e.remaining,easing:Easing.linear,useNativeDriver:!0}).start()):i||null===e.timer||(clearTimeout(e.timer),e.timer=null,e.remaining=Math.max(e.remaining-(Date.now()-e.startedAt),0),z.stopAnimation())},[z]),dismiss=()=>{if(N.current)return;N.current=!0,K();const t=[Animated.timing(E,{toValue:0,duration:o,easing:Easing.bezier(...a.motion.easing.accelerate),useNativeDriver:!0})];s.reduced||t.push(Animated.timing(C,{toValue:V,duration:a.motion.duration.fast,easing:Easing.bezier(...a.motion.easing.accelerate),useNativeDriver:!0})),Animated.parallel(t).start(()=>n(e.id))};W.current=dismiss,useEffect(()=>{const e=s.reduced?Animated.timing(E,{toValue:1,duration:o,useNativeDriver:!0}):Animated.parallel([Animated.spring(C,{toValue:0,damping:M,stiffness:D,mass:_,useNativeDriver:!0}),Animated.timing(E,{toValue:1,duration:o,useNativeDriver:!0})]);return e.start(),()=>e.stop()},[]),useEffect(()=>{K()},[B,K]),useEffect(()=>()=>{const e=U.current,t=$.current;null!==e.timer&&(clearTimeout(e.timer),e.timer=null,e.remaining=Math.max(e.remaining-(Date.now()-e.startedAt),0)),z.stopAnimation(),e.initialised&&t.totalMs>0&&!N.current&&t.runtime?.writeRemaining(t.id,e.remaining)},[z]);const X=useCallback((e,t)=>{G.current[e]=t,K()},[K]),Y=useCallback(()=>X("touch",!0),[X]),q=useCallback(e=>X("touch",(e.nativeEvent.touches?.length??0)>0),[X]),J=useCallback(()=>X("hover",!0),[X]),Q=useCallback(()=>X("hover",!1),[X]),Z=useMemo(()=>PanResponder.create({onMoveShouldSetPanResponder:(e,t)=>Math.abs(t.dx)>Math.abs(t.dy)&&Math.abs(t.dx)>6,onPanResponderGrant:()=>X("pan",!0),onPanResponderMove:(e,t)=>{setNativeValue(R,t.dx);const n=1-.7*Math.min(Math.abs(t.dx)/200,1);setNativeValue(E,n)},onPanResponderTerminate:()=>{if(X("pan",!1),s.reduced)return setNativeValue(R,0),void Animated.timing(E,{toValue:1,duration:o,useNativeDriver:!0}).start();Animated.parallel([Animated.spring(R,{toValue:0,damping:a.motion.spring.snappy.damping,stiffness:a.motion.spring.snappy.stiffness,mass:a.motion.spring.snappy.mass,useNativeDriver:!0}),Animated.timing(E,{toValue:1,duration:o,useNativeDriver:!0})]).start()},onPanResponderRelease:(t,i)=>{if(Math.abs(i.dx)>S||Math.abs(i.vx)>A){const t=i.dx>=0?1:-1;N.current=!0,X("pan",!1);const r=[Animated.timing(E,{toValue:0,duration:o,useNativeDriver:!0})];s.reduced||r.push(Animated.timing(R,{toValue:500*t,duration:a.motion.duration.fast,useNativeDriver:!0})),Animated.parallel(r).start(()=>n(e.id))}else X("pan",!1),s.reduced?(setNativeValue(R,0),Animated.timing(E,{toValue:1,duration:o,useNativeDriver:!0}).start()):Animated.parallel([Animated.spring(R,{toValue:0,useNativeDriver:!0}),Animated.spring(E,{toValue:1,useNativeDriver:!0})]).start()}}),[R,E,X,S,A,o,s.reduced,a.motion.duration.fast,a.motion.spring.snappy.damping,a.motion.spring.snappy.stiffness,a.motion.spring.snappy.mass,n,e.id]),ee={accessibilityActions:DISMISS_ACTIONS,onAccessibilityAction:e=>{"dismiss"===e.nativeEvent.actionName&&dismiss()}},[te,ne]=useState(0),ie=useMemo(()=>z.interpolate({inputRange:[0,1],outputRange:[-te,0]}),[z,te]),re=e.description?`${e.message}. ${e.description}`:e.message,ae=e.action&&H?`${e.action.label}, ${Math.ceil(F/1e3)} seconds`:e.action?.label;return _jsxs(Animated.View,{...T?Z.panHandlers:{},...O?{}:{accessible:!0,...ee},..."web"===Platform.OS?{onPointerEnter:J,onPointerLeave:Q}:{},onTouchStart:Y,onTouchEnd:q,onTouchCancel:q,accessibilityLabel:re,testID:e.testID,style:[u.container,{backgroundColor:a.colors.background.elevated,borderRadius:a.radius.lg,...smoothCorners,padding:a.spacing.md,...a.shadows.md,shadowColor:a.shadows.md.shadowColor,opacity:E,transform:[{translateY:j},{translateX:R},{scale:k}]},e.style,e.containerStyle],children:[b>0?_jsx(View,{style:[u.tintBar,{width:b,backgroundColor:d}]}):null,_jsxs(View,{style:u.row,children:[(()=>{if(e.icon)return e.icon;const t=defaultGlyph(l);return t?_jsx(View,{style:[u.iconCircle,{width:g,height:g,borderRadius:h,...smoothCorners,backgroundColor:d+"22"},e.iconCircleStyle],children:_jsx(Text,{style:[u.iconGlyph,{color:m,fontSize:f}],accessible:!1,children:t})}):null})(),_jsxs(View,{style:u.textBlock,children:[_jsx(Text,{style:[u.message,{color:a.colors.text.primary,fontSize:a.typography.fontSize.base,...fontFor(a,"semibold")},e.textStyle,e.messageStyle],numberOfLines:2,children:e.message}),e.description?_jsx(Text,{style:[u.description,{color:a.colors.text.secondary,fontSize:a.typography.fontSize.sm}],numberOfLines:3,children:e.description}):null]}),e.action?_jsx(Pressable,{accessibilityRole:"button",accessibilityLabel:ae,hitSlop:ACTION_HIT_SLOP,...ee,onPress:()=>{e.action?.onPress(),dismiss()},style:({pressed:t})=>[u.actionBtn,{backgroundColor:t?a.colors.surface.pressed:"transparent"},e.actionButtonStyle],children:_jsx(Text,{style:{color:d,fontSize:a.typography.fontSize.sm,...fontFor(a,"semibold")},numberOfLines:1,children:e.action.label})}):null]}),H?_jsxs(View,{pointerEvents:"none",accessibilityElementsHidden:!0,importantForAccessibility:"no-hide-descendants",onLayout:e=>ne(e.nativeEvent.layout.width),testID:"toast-countdown",style:[u.countdownTrack,{backgroundColor:d+"22"}],children:[s.reduced?_jsx(View,{style:[u.countdownFill,{backgroundColor:d}]}):null,!s.reduced&&te>0?_jsx(Animated.View,{style:[u.countdownFill,{backgroundColor:d,transform:[{translateX:ie}]}]}):null]}):null]})},tintFor=(e,t)=>{switch(t){case"success":return e.colors.success;case"error":return e.colors.error;case"warning":return e.colors.warning;case"info":return e.colors.info;default:return e.colors.text.primary}},inkFor=(e,t)=>{switch(t){case"success":return e.colors.toneText.success;case"error":return e.colors.toneText.error;case"warning":return e.colors.toneText.warning;case"info":return e.colors.toneText.info;default:return e.colors.text.primary}},defaultGlyph=e=>{switch(e){case"success":return"✓";case"error":return"×";case"warning":return"!";case"info":return"i";default:return""}},buildStyles=e=>StyleSheet.create({container:{overflow:"hidden",marginVertical:4},tintBar:{position:"absolute",left:0,top:0,bottom:0},row:{flexDirection:"row",alignItems:"center",paddingLeft:8},iconCircle:{alignItems:"center",justifyContent:"center",marginRight:12},iconGlyph:{fontWeight:"700",lineHeight:18},textBlock:{flex:1,paddingRight:8},message:{lineHeight:20},description:{marginTop:2,lineHeight:18},countdownTrack:{position:"absolute",left:0,right:0,bottom:0,height:3,overflow:"hidden"},countdownFill:{position:"absolute",left:0,right:0,top:0,bottom:0},actionBtn:{paddingHorizontal:10,paddingVertical:6,borderRadius:8,...smoothCorners,marginLeft:8}});export{Toast};export default Toast;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";import React,{useCallback,useEffect,useMemo,useRef,useState}from"react";import{Animated,Easing,Modal,Platform,Pressable,StyleSheet,Text,useWindowDimensions,View}from"react-native";import{useSafeAreaInsets}from"react-native-safe-area-context";import{createAnimatedValue,useTheme}from"../../theme/index.js";import{smoothCorners}from"../../utils/corners.js";import{mergeRefs}from"../../utils/mergeRefs.js";import{claimAnchoredSurface}from"../../utils/placement.js";import{FOCUS_DELAY_MS,focusHost}from"../Menu/focusHost.js";import{ModalSafeArea,useModalInsets}from"../ModalSafeArea/ModalSafeArea.js";import{ToastHost}from"../Toast/ToastProvider.js";import{RichTooltipBody}from"./RichTooltipBody.js";import{resolveTooltipPosition}from"./tooltipPosition.js";import{jsx as _jsx,jsxs as _jsxs,Fragment as _Fragment}from"react/jsx-runtime";const DEFAULT_TOOLTIP_GAP=8,DEFAULT_SCREEN_PADDING=8,DEFAULT_PRESS_AUTO_HIDE_MS=4e3,DEFAULT_ARROW_HALF_WIDTH=4,DEFAULT_ARROW_HEIGHT=6,DEFAULT_ARROW_CORNER_PADDING=12,DEFAULT_MAX_WIDTH=240,RICH_MAX_WIDTH=280,DEFAULT_LINE_HEIGHT=18,Tooltip=e=>{const{content:t,children:o,variant:r="plain",title:s,action:n,placement:i="auto",visible:a,onVisibleChange:l,hideOnContentPress:u=!0,maxWidth:c,showArrow:m=!0,accessibilityLabel:d,style:f,containerStyle:p,arrowStyle:h,messageStyle:g,closeLabel:b="Close tooltip",testID:y}=e,T="rich"===r,_=e.trigger??(T?"press":"longPress"),A=useTheme(),R=useSafeAreaInsets(),[
|
|
1
|
+
"use strict";import React,{useCallback,useEffect,useMemo,useRef,useState}from"react";import{Animated,Easing,Modal,Platform,Pressable,StyleSheet,Text,useWindowDimensions,View}from"react-native";import{useSafeAreaInsets}from"react-native-safe-area-context";import{usePresenceMotion}from"../../hooks/usePresenceMotion.js";import{createAnimatedValue,setNativeValue,useTheme}from"../../theme/index.js";import{announce}from"../../utils/announce.js";import{smoothCorners}from"../../utils/corners.js";import{mergeRefs}from"../../utils/mergeRefs.js";import{claimAnchoredSurface}from"../../utils/placement.js";import{FOCUS_DELAY_MS,focusHost}from"../Menu/focusHost.js";import{ModalSafeArea,useModalInsets}from"../ModalSafeArea/ModalSafeArea.js";import{ToastHost}from"../Toast/ToastProvider.js";import{RichTooltipBody}from"./RichTooltipBody.js";import{resolveTooltipPosition}from"./tooltipPosition.js";import{jsx as _jsx,jsxs as _jsxs,Fragment as _Fragment}from"react/jsx-runtime";const DEFAULT_TOOLTIP_GAP=8,DEFAULT_SCREEN_PADDING=8,DEFAULT_PRESS_AUTO_HIDE_MS=4e3,DEFAULT_ARROW_HALF_WIDTH=4,DEFAULT_ARROW_HEIGHT=6,DEFAULT_ARROW_CORNER_PADDING=12,DEFAULT_MAX_WIDTH=240,RICH_MAX_WIDTH=280,DEFAULT_LINE_HEIGHT=18,Tooltip=e=>{const{content:t,children:o,variant:r="plain",title:s,action:n,placement:i="auto",visible:a,onVisibleChange:l,hideOnContentPress:u=!0,maxWidth:c,showArrow:m=!0,accessibilityLabel:d,style:f,containerStyle:p,arrowStyle:h,messageStyle:g,closeLabel:b="Close tooltip",testID:y}=e,T="rich"===r,_=e.trigger??(T?"press":"longPress"),A=useTheme(),S=usePresenceMotion(),R=useSafeAreaInsets(),[w,x]=useModalInsets(),v=useMemo(()=>({...R,top:w.top,bottom:w.bottom}),[R,w]),E=useWindowDimensions(),P=useMemo(()=>buildStyles(A),[A]),j=A.components.tooltip,C=j?.gap??8,D=j?.screenPadding??8,L=j?.pressAutoHideMs??4e3,M=j?.arrowHalfWidth??4,H=j?.arrowHeight??6,I=j?.arrowCornerPadding??12,F=j?.lineHeight??18,W=c??(T?280:j?.maxWidth??240),O="press"===_&&!T,V=(j?.enableScaleAnimation??!1)&&!S.reduced,k=j?.exitDurationMs??150,N="manual"===_||"boolean"==typeof a,[U,B]=useState(!1),z=N?Boolean(a):U,[G,X]=useState(null),[Y,q]=useState({width:0,height:0}),J=useRef(null),K=useRef(null),Q=useRef(null),Z=useRef(null),$=useRef(null),ee=useRef(!1),te=useRef(!1),oe=useRef(createAnimatedValue(z||!V?1:.85)).current,re=useRef(createAnimatedValue(z?1:0)).current,se=useRef(null),ne=useRef(!1),[ie,ae]=useState(z),le=useCallback(e=>{N||B(e),l?.(e)},[N,l]),ue=useCallback(()=>{J.current&&J.current.measureInWindow((e,t,o,r)=>{X({x:e,y:t,width:o,height:r})})},[]),ce=useCallback(e=>{ue(),le(!0)},[ue,le]),me=useCallback(()=>{le(!1)},[le]),de=useRef(me);de.current=me;const fe=useCallback(()=>{if(!ee.current)return;ee.current=!1;const e=$.current;$.current=null,e?e():T&&focusHost(K.current??J.current)},[T]);useEffect(()=>{if(z)return te.current=!0,ee.current=!1,claimAnchoredSurface(()=>de.current());te.current&&(te.current=!1,ee.current=!0)},[z]),useEffect(()=>{z&&ae(!0)},[z]);const pe=useRef(ie);useEffect(()=>{pe.current&&!ie&&"ios"!==Platform.OS&&fe(),pe.current=ie},[ie,fe]);const he=useCallback(()=>{$.current=n?.onPress??null,me()},[n,me]);useEffect(()=>{if(!ne.current)return ne.current=!0,z&&(ue(),O&&(se.current&&clearTimeout(se.current),se.current=setTimeout(()=>{me()},L))),()=>{se.current&&(clearTimeout(se.current),se.current=null)};let e;if(z){ue();const t=[Animated.timing(re,{toValue:1,duration:S.duration("fast"),useNativeDriver:!0})];V?t.push(Animated.spring(oe,{toValue:1,damping:A.motion.spring.snappy.damping,stiffness:A.motion.spring.snappy.stiffness,mass:A.motion.spring.snappy.mass,useNativeDriver:!0})):setNativeValue(oe,1),e=Animated.parallel(t),e.start(),O&&(se.current&&clearTimeout(se.current),se.current=setTimeout(()=>{me()},L))}else{const t=[Animated.timing(re,{toValue:0,duration:S.reduced?S.duration("fast"):k,easing:Easing.bezier(...A.motion.easing.accelerate),useNativeDriver:!0})];V&&t.push(Animated.timing(oe,{toValue:.85,duration:k,easing:Easing.bezier(...A.motion.easing.accelerate),useNativeDriver:!0})),e=Animated.parallel(t),e.start(({finished:e})=>{e&&ae(!1)}),se.current&&(clearTimeout(se.current),se.current=null)}return()=>{e?.stop(),se.current&&(clearTimeout(se.current),se.current=null)}},[z]);const handleContentLayout=e=>{const{width:t,height:o}=e.nativeEvent.layout;t===Y.width&&o===Y.height||q({width:t,height:o})},ge=useMemo(()=>resolveTooltipPosition({anchor:G,size:Y,placement:i,rich:T,viewport:{width:E.width,height:E.height,insets:v},maxWidth:W,gap:C,padding:D,arrowCornerPadding:I}),[G,Y,i,T,E.width,E.height,v,W,C,D,I]),be=null!==G&&Y.width>0,ye=z&&be;useEffect(()=>{if(!T||!ye)return;const e="web"===Platform.OS?Z:Q,t=setTimeout(()=>focusHost(e.current),FOCUS_DELAY_MS);return()=>clearTimeout(t)},[T,ye]),useEffect(()=>{!T&&ye&&"ios"===Platform.OS&&"string"==typeof t&&announce(t)},[T,ye,t]);const Te=o.props,Ae=useMemo(()=>mergeRefs(Te.ref,K),[Te.ref]),Se={};"longPress"!==_||Te.contextMenu?"press"===_&&(Se.onPress=e=>{Te.onPress?.(e),ce(e)}):(Se.onLongPress=ce,Se.accessibilityHint="Long press for more info"),T&&(Se.ref=Ae);const Re=React.cloneElement(o,Se),we=d??("string"==typeof t?t:"Tooltip"),xe=useMemo(()=>{if(!m)return null;const e=T?A.colors.background.elevated:A.colors.background.inverse,t={position:"absolute",width:0,height:0,backgroundColor:"transparent",borderStyle:"solid",borderLeftWidth:M,borderRightWidth:M,borderBottomWidth:H,borderTopWidth:0,borderLeftColor:"transparent",borderRightColor:"transparent",borderTopColor:"transparent",borderBottomColor:e};return"top"===ge.placement?{...t,bottom:-H,left:ge.arrowOffset-M,transform:[{rotate:"180deg"}]}:"bottom"===ge.placement?{...t,top:-H,left:ge.arrowOffset-M}:"left"===ge.placement?{...t,right:-H,top:ge.arrowOffset-M,transform:[{rotate:"90deg"}]}:{...t,left:-H,top:ge.arrowOffset-M,transform:[{rotate:"-90deg"}]}},[m,ge,A,T,M,H]),ve={position:"absolute",top:ge.top,left:ge.left,maxWidth:W,opacity:z&&!be?0:re,transform:[{scale:oe}]},Ee=xe?_jsx(View,{style:[xe,h],pointerEvents:"none"}):null;return _jsxs(_Fragment,{children:[_jsx(View,{ref:J,collapsable:!1,onLayout:ue,testID:y,children:Re}),_jsx(Modal,{visible:ie,transparent:!0,statusBarTranslucent:!0,presentationStyle:"overFullScreen",animationType:"none",onRequestClose:me,onDismiss:fe,children:_jsxs(ModalSafeArea,{onInsets:x,children:[T?_jsxs(_Fragment,{children:[_jsx(Pressable,{style:StyleSheet.absoluteFill,onPress:u?me:void 0,accessibilityLabel:b,accessibilityRole:"button"}),ie?_jsxs(Animated.View,{onLayout:handleContentLayout,style:[ve,f,p],children:[_jsx(RichTooltipBody,{title:s,content:t,action:n,onAction:he,focusRef:Q,actionRef:Z,messageStyle:g}),Ee]}):null]}):_jsx(Pressable,{style:StyleSheet.absoluteFill,onPress:u?me:void 0,accessibilityLabel:b,accessibilityRole:"button",children:ie?_jsxs(Animated.View,{accessibilityRole:"tooltip",accessibilityLiveRegion:"polite",accessibilityLabel:we,onLayout:handleContentLayout,style:[ve,f,p],children:[_jsx(View,{style:[P.tooltip,{backgroundColor:A.colors.background.inverse,borderRadius:A.radius.md,...smoothCorners,paddingHorizontal:A.spacing.md,paddingVertical:A.spacing.sm,...A.shadows.lg,shadowColor:A.shadows.lg.shadowColor}],children:"string"==typeof t?_jsx(Text,{style:[{color:A.colors.text.inverse,fontSize:A.typography.fontSize.sm,lineHeight:F},g],children:t}):t}),Ee]}):null}),_jsx(ToastHost,{})]})})]})},buildStyles=e=>StyleSheet.create({tooltip:{overflow:"hidden"}});export{Tooltip};export default Tooltip;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";import{useCallback,useEffect,useMemo,useRef,useState}from"react";import{AccessibilityInfo,Animated,StyleSheet,Text,useWindowDimensions,View}from"react-native";import{createAnimatedValue,useTheme}from"../../theme/index.js";import{smoothCorners}from"../../utils/corners.js";import{Button}from"../Button/index.js";import{Modal}from"../Modal/index.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const DEFAULT_GAP=8,DEFAULT_SCREEN_PADDING=8,MAX_CARD_WIDTH=360,HIGHLIGHT_BORDER_WIDTH=2,measureInWindow=e=>new Promise(t=>{const i=e.current;i?i.measureInWindow((e,i,o,
|
|
1
|
+
"use strict";import{useCallback,useEffect,useMemo,useRef,useState}from"react";import{AccessibilityInfo,Animated,StyleSheet,Text,useWindowDimensions,View}from"react-native";import{usePresenceMotion}from"../../hooks/usePresenceMotion.js";import{createAnimatedValue,useTheme}from"../../theme/index.js";import{smoothCorners}from"../../utils/corners.js";import{Button}from"../Button/index.js";import{Modal}from"../Modal/index.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const DEFAULT_GAP=8,DEFAULT_SCREEN_PADDING=8,MAX_CARD_WIDTH=360,HIGHLIGHT_BORDER_WIDTH=2,measureInWindow=e=>new Promise(t=>{const i=e.current;i?i.measureInWindow((e,i,o,s)=>t({x:e,y:i,width:o,height:s})):t(null)}),isOnScreen=(e,t)=>e.width>0&&e.height>0&&e.x<t.width&&e.y<t.height&&e.x+e.width>0&&e.y+e.height>0,Tour=({tourId:e,steps:t,visible:i,onClose:o,seenStore:s,labels:n,haptic:r,testID:a})=>{const l=useTheme(),c=usePresenceMotion().duration("fast"),u=useMemo(()=>buildStyles(l),[l]),d=useWindowDimensions(),h=useRef(d);h.current=d;const p=l.components.tooltip?.gap??8,m=l.components.tooltip?.screenPadding??8,[g,x]=useState(null),[y,f]=useState(0),b=useRef(createAnimatedValue(0)).current,w=useRef(t);w.current=t;const S=useRef(o);S.current=o;const j=useRef(s);j.current=s;const k=useCallback(async(e,t)=>{for(let i=e;i>=0&&i<w.current.length;i+=t){const e=await measureInWindow(w.current[i].target);if(e&&isOnScreen(e,h.current))return{index:i,rect:e}}return null},[]);useEffect(()=>{if(!i)return void x(null);let t=!1;return(async()=>{const i=j.current;if(i&&await i.isSeen(e))return void(t||S.current("alreadySeen"));const o=await k(0,1);t||(o?(f(o.index),x(o)):S.current("noTargets"))})(),()=>{t=!0}},[i,e,k]),useEffect(()=>{if(!g)return;const e=w.current[g.index],t=`Step ${g.index+1} of ${w.current.length}`;AccessibilityInfo.announceForAccessibility([t,e.title,e.description].filter(Boolean).join(". ")),b.setValue(0);const i=Animated.timing(b,{toValue:1,duration:c,useNativeDriver:!0});return i.start(),()=>i.stop()},[g,b,c]);const _=useCallback(async t=>{x(null),await(j.current?.markSeen(e)),S.current(t)},[e]),C=useCallback(async()=>{if(!g)return;const e=await k(g.index+1,1);e?x(e):await _("finished")},[g,k,_]),v=useCallback(async()=>{if(!g)return;const e=await k(g.index-1,-1);e&&x(e)},[g,k]),D=useCallback(()=>{_("skipped")},[_]),I=g?t[g.index]:void 0,T=!!g&&g.index===t.length-1,M=l.spacing.xs,R=g?{x:g.rect.x-M,y:g.rect.y-M,width:g.rect.width+2*M,height:g.rect.height+2*M}:null,A=Math.min(d.width-2*m,360),V=R?(()=>{const e=R.x+R.width/2,t=Math.max(m,Math.min(e-A/2,d.width-A-m)),i=R.y,o=d.height-(R.y+R.height);return o>=i?{left:t,top:R.y+R.height+p,maxHeight:Math.max(o-p-m,0)}:{left:t,bottom:d.height-R.y+p,maxHeight:Math.max(i-p-m,0)}})():null,P=l.colors.background.overlay;return _jsx(Modal,{visible:null!==g,onRequestClose:D,presentation:"fullScreen",backdropPressClose:!1,backdropStyle:u.transparent,contentStyle:u.transparent,accessibilityLabel:I?.title??I?.description,haptic:r,testID:a,children:R&&V&&I?_jsxs(View,{style:StyleSheet.absoluteFill,children:[_jsx(View,{style:[u.dim,{backgroundColor:P,top:0,left:0,right:0,height:Math.max(R.y,0)}]}),_jsx(View,{style:[u.dim,{backgroundColor:P,top:R.y+R.height,left:0,right:0,bottom:0}]}),_jsx(View,{style:[u.dim,{backgroundColor:P,top:R.y,left:0,width:Math.max(R.x,0),height:R.height}]}),_jsx(View,{style:[u.dim,{backgroundColor:P,top:R.y,left:R.x+R.width,right:0,height:R.height}]}),_jsx(View,{pointerEvents:"none",style:[u.highlight,{top:R.y,left:R.x,width:R.width,height:R.height}]}),_jsxs(Animated.View,{accessibilityLiveRegion:"polite",style:[u.card,V,{width:A,opacity:b}],testID:a?`${a}-card`:void 0,children:[_jsx(Text,{style:u.position,children:`Step ${(g?.index??0)+1} of ${t.length}`}),I.title?_jsx(Text,{style:u.title,accessibilityRole:"header",children:I.title}):null,_jsx(Text,{style:u.description,children:I.description}),_jsxs(View,{style:u.actions,children:[_jsx(Button,{title:n?.skip??"Skip",variant:"ghost",size:"sm",haptic:r,onPress:D,testID:a?`${a}-skip`:void 0}),_jsxs(View,{style:u.navigation,children:[g&&g.index>y?_jsx(Button,{title:n?.back??"Back",variant:"outline",size:"sm",haptic:r,onPress:()=>{v()},testID:a?`${a}-back`:void 0}):null,_jsx(Button,{title:T?n?.done??"Done":n?.next??"Next",size:"sm",haptic:r,onPress:()=>{C()},testID:a?`${a}-next`:void 0})]})]})]})]}):null})};Tour.displayName="Tour";const buildStyles=e=>StyleSheet.create({transparent:{backgroundColor:"transparent"},dim:{position:"absolute"},highlight:{position:"absolute",borderWidth:2,borderColor:e.colors.primary,borderRadius:e.radius.md,...smoothCorners},card:{position:"absolute",backgroundColor:e.colors.background.elevated,borderRadius:e.radius.lg,...smoothCorners,padding:e.spacing.lg,gap:e.spacing.sm,...e.shadows.lg},position:{color:e.colors.text.tertiary,fontSize:e.typography.fontSize.xs},title:{color:e.colors.text.primary,fontSize:e.typography.fontSize.lg,fontWeight:e.typography.fontWeight.semibold},description:{color:e.colors.text.secondary,fontSize:e.typography.fontSize.sm},actions:{flexDirection:"row",alignItems:"center",justifyContent:"space-between",marginTop:e.spacing.xs},navigation:{flexDirection:"row",gap:e.spacing.sm}});export{Tour};export default Tour;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";import{memo,useCallback,useEffect,useMemo,useRef}from"react";import{Animated,Platform,Pressable,StyleSheet,Text,View}from"react-native";import{createAnimatedValue,setNativeValue}from"../../theme/index.js";import{announce}from"../../utils/announce.js";import{resolveHaptic,triggerHaptic}from"../../utils/hapticUtils.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";export const WHEEL_VISIBLE_ITEMS=5;export const WHEEL_CENTER_OFFSET=Math.floor(2.5);const HAPTIC_DEBOUNCE_MS=35,WEB_SETTLE_MS=120,SCALE_STOPS=[-2,-1,0,1,2],WheelRow=memo(({label:e,index:t,scrollY:n,itemHeight:a,selected:
|
|
1
|
+
"use strict";import{memo,useCallback,useEffect,useMemo,useRef,useState}from"react";import{Animated,Platform,Pressable,StyleSheet,Text,TextInput,View}from"react-native";import{createAnimatedValue,setNativeValue}from"../../theme/index.js";import{announce}from"../../utils/announce.js";import{resolveHaptic,triggerHaptic}from"../../utils/hapticUtils.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";export const WHEEL_VISIBLE_ITEMS=5;export const WHEEL_CENTER_OFFSET=Math.floor(2.5);const HAPTIC_DEBOUNCE_MS=35,WEB_SETTLE_MS=120,SCALE_STOPS=[-2,-1,0,1,2],WheelRow=memo(({label:e,index:t,scrollY:n,itemHeight:a,selected:r,theme:i,reducedMotion:s,onPress:l,editor:o})=>{const{opacity:c,scale:u}=useMemo(()=>{const e=Animated.subtract(Animated.divide(n,a),t);return{opacity:e.interpolate({inputRange:SCALE_STOPS,outputRange:[.3,.6,1,.6,.3],extrapolate:"clamp"}),scale:e.interpolate({inputRange:SCALE_STOPS,outputRange:[.85,.95,1.05,.95,.85],extrapolate:"clamp"})}},[n,a,t]),m=_jsx(Text,{numberOfLines:1,maxFontSizeMultiplier:1.5,style:{fontSize:i.typography.fontSize.xl,color:r?i.colors.text.primary:i.colors.text.secondary,fontWeight:r?i.typography.fontWeight.semibold:i.typography.fontWeight.medium,letterSpacing:i.typography.letterSpacing.normal},children:e});return _jsx(Animated.View,{style:[styles.row,{height:a},s?{opacity:c}:{opacity:c,transform:[{scale:u}]}],accessible:!1,importantForAccessibility:"no",children:o??(l?_jsx(Pressable,{focusable:!1,accessible:!1,onPress:()=>l(t),style:styles.rowPress,children:m}):m)})});export const Wheel=({label:e,items:t,selectedIndex:n,onIndexChange:a,itemHeight:r,width:i,theme:s,haptic:l,disabled:o,reducedMotion:c,typeable:u,testID:m})=>{const d="web"===Platform.OS,[f,y]=useState(null),p=useRef(!1),b=useRef(null),h=useRef(createAnimatedValue(n*r)).current,x=useRef(n*r),g=useRef(n*r),S=useRef(n),E=useRef(0),v=useRef(null),T=useRef(()=>{}),M=s.components.timePicker?.hapticDebounceMs??35,w=t.length-1;useEffect(()=>{S.current=n;const e=n*r;if(g.current===e)return;if(g.current=e,Math.abs(x.current-e)<1)return;x.current=e,d||setNativeValue(h,e);const t=requestAnimationFrame(()=>{b.current?.scrollToOffset({offset:e,animated:!1})});return()=>cancelAnimationFrame(t)},[n,r,h,d]),useEffect(()=>()=>{v.current&&clearTimeout(v.current)},[]);const A=useCallback((e,r)=>{if(!(e===n||e<0||e>w)){if("accessibility"===r){const e=resolveHaptic(l,"denseTick");e&&triggerHaptic(e)}if("keyboard"!==r){const n=t[e];n&&announce(n.accessibilityLabel??n.label)}a(e)}},[n,w,t,l,a]),_=useCallback(()=>{!o&&u&&(p.current=!0,y(String(t[n]?.value??"")))},[o,u,t,n]),C=useCallback(e=>{if(!p.current)return;p.current=!1,y(null);const n=e.trim();if(!/^\d+$/.test(n))return;const a=Number(n),r=t.findIndex(e=>e.value===a);r>=0&&A(r,"keyboard")},[t,A]);T.current=()=>{v.current=null;const e=Math.max(0,Math.min(w,Math.round(x.current/r))),t=e*r;Math.abs(x.current-t)>=1&&b.current?.scrollToOffset({offset:t,animated:!c}),A(e,"scroll")};const R=useMemo(()=>Animated.event([{nativeEvent:{contentOffset:{y:h}}}],{useNativeDriver:!d,listener:e=>{const t=e.nativeEvent.contentOffset.y;x.current=t;const n=Math.round(t/r);if(n!==S.current&&n>=0&&n<=w){const e=Date.now();if(e-E.current>=M){const t=resolveHaptic(l,"denseTick");t&&triggerHaptic(t),E.current=e}S.current=n}d&&(v.current&&clearTimeout(v.current),v.current=setTimeout(()=>T.current(),120))}}),[h,r,w,l,M,d]),j=useCallback(e=>{const t=e.nativeEvent.contentOffset.y;A(Math.max(0,Math.min(w,Math.round(t/r))),"scroll")},[A,w,r]),k=useCallback(e=>{if(o)return;const t=e.nativeEvent.actionName;"increment"===t?A(Math.min(w,n+1),"accessibility"):"decrement"===t&&A(Math.max(0,n-1),"accessibility")},[o,A,w,n]),I=useCallback(e=>{o||b.current?.scrollToOffset({offset:e*r,animated:!c})},[o,r,c]),L=useCallback(({item:t,index:a})=>{const i=a===n,l=i&&null!==f;return _jsx(WheelRow,{label:t.label,index:a,scrollY:h,itemHeight:r,selected:i,theme:s,reducedMotion:c,onPress:i&&u?_:d?I:void 0,editor:l?_jsx(TextInput,{autoFocus:!0,selectTextOnFocus:!0,keyboardType:"number-pad",returnKeyType:"done",accessibilityLabel:e,value:f,onChangeText:y,onSubmitEditing:()=>C(f),onBlur:()=>C(f),style:{width:"100%",padding:0,textAlign:"center",fontSize:s.typography.fontSize.xl,color:s.colors.text.primary,fontWeight:s.typography.fontWeight.semibold,letterSpacing:s.typography.letterSpacing.normal}}):void 0})},[h,r,n,s,c,d,I,u,_,f,C,e]),P=useCallback((e,t)=>`${String(e.value)}-${t}`,[]),F=useCallback((e,t)=>({length:r,offset:r*t,index:t}),[r]),O=t[n]?t[n].accessibilityLabel??t[n].label:"",H=d?{focusable:!0,role:"spinbutton","aria-label":e,"aria-valuetext":O,"aria-valuenow":n,"aria-valuemin":0,"aria-valuemax":w,"aria-disabled":o,onKeyDown:e=>{if(o)return;const t={ArrowDown:Math.min(w,n+1),PageDown:Math.min(w,n+1),ArrowUp:Math.max(0,n-1),PageUp:Math.max(0,n-1),Home:0,End:w}[e.key];void 0!==t&&(e.preventDefault?.(),A(t,"keyboard"))}}:void 0;return _jsxs(View,{style:[void 0===i?styles.columnFlex:{width:i},{height:5*r},styles.column,o?styles.disabled:null],testID:m,...H,children:[d?null:_jsx(View,{pointerEvents:"none",style:styles.a11yLayer,accessible:!0,accessibilityRole:"adjustable",accessibilityLabel:e,accessibilityValue:{text:O},accessibilityState:{disabled:Boolean(o)},"aria-disabled":Boolean(o),accessibilityActions:[{name:"increment"},{name:"decrement"}],onAccessibilityAction:k}),_jsx(Animated.FlatList,{ref:b,data:t,keyExtractor:P,renderItem:L,getItemLayout:F,showsVerticalScrollIndicator:!1,snapToInterval:r,snapToAlignment:"start",decelerationRate:"fast",bounces:!1,scrollEnabled:!o,nestedScrollEnabled:!0,scrollEventThrottle:16,onScroll:R,onMomentumScrollEnd:j,contentContainerStyle:{paddingVertical:r*WHEEL_CENTER_OFFSET},initialScrollIndex:n,style:[styles.list,{height:5*r}],importantForAccessibility:"no-hide-descendants","aria-hidden":!0})]})};const styles=StyleSheet.create({column:{overflow:"hidden"},columnFlex:{flex:1},disabled:{opacity:.5},list:{flexGrow:0},row:{alignItems:"center",justifyContent:"center"},rowPress:{alignItems:"center",justifyContent:"center",alignSelf:"stretch",flex:1},a11yLayer:{...StyleSheet.absoluteFill,zIndex:2}});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";import{Fragment,useCallback,useMemo}from"react";import{StyleSheet,Text,useWindowDimensions,View}from"react-native";import{useReducedMotion}from"../../hooks/useReducedMotion.js";import{useTheme}from"../../theme/index.js";import{WHEEL_CENTER_OFFSET,WHEEL_VISIBLE_ITEMS,Wheel}from"./Wheel.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const BASE_ITEM_HEIGHT=40,MAX_FONT_SCALE=1.5,DEFAULT_COLUMN_WIDTH=64,MAX_DURATION_MINUTES=1439,range=(e,t,i=1)=>{const o=[];for(let
|
|
1
|
+
"use strict";import{Fragment,useCallback,useMemo}from"react";import{StyleSheet,Text,useWindowDimensions,View}from"react-native";import{useReducedMotion}from"../../hooks/useReducedMotion.js";import{useTheme}from"../../theme/index.js";import{Chip}from"../Chip/index.js";import{WHEEL_CENTER_OFFSET,WHEEL_VISIBLE_ITEMS,Wheel}from"./Wheel.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const BASE_ITEM_HEIGHT=40,MAX_FONT_SCALE=1.5,DEFAULT_COLUMN_WIDTH=64,MAX_DURATION_MINUTES=1439,range=(e,t,i=1)=>{const o=[];for(let s=e;s<=t;s+=i)o.push(s);return o},plural=(e,t,i)=>`${e} ${1===e?t:i}`,formatPreset=(e,t,i)=>{const o=Math.floor(e/60),s=e%60;return 0===o?`${s} ${i}`:0===s?`${o} ${t}`:`${o} ${t} ${s} ${i}`},toItem=e=>"object"==typeof e?e:{value:e,label:String(e)},WheelPicker=e=>{const{haptic:t,disabled:i,testID:o,style:s}=e,n=useTheme(),r=useReducedMotion(),{fontScale:a}=useWindowDimensions(),l=Math.min(Math.max(a,1),1.5),u=Math.round(40*l),m=useMemo(()=>buildStyles(n,u),[n,u]),d="list"===e.mode?e.items:void 0,h=useMemo(()=>d?.map(toItem),[d]),c="duration"===e.mode?e.minuteStep??1:1,p="duration"===e.mode?Math.max(0,Math.min(1439,Math.floor(e.maxMinutes??1/0))):0,f=Math.floor(p/60),b="duration"===e.mode?e.labels:void 0,x=b?.hours??"Hours",g=b?.minutes??"Minutes",y=b?.hourUnit??"hr",M=b?.minuteUnit??"min",_="duration"===e.mode?e.presets:void 0;for(const e of _??[])if(!Number.isInteger(e)||e<0||e>p||e%c!==0)throw new Error(`WheelPicker preset ${e} must be a whole number of minutes from 0 to ${p} in steps of ${c}.`);const S=useCallback(e=>{const t=e===f?p%60:59;return Math.floor(t/c)*c},[f,p,c]),E="duration"===e.mode?e.value:0,j=useMemo(()=>{const e=Number.isFinite(E)?E:0,t=Math.max(0,Math.min(p,e)),i=Math.floor(t/60),o=Math.round(t%60/c)*c;return{hour:i,minute:Math.min(S(i),o)}},[E,p,c,S]),w=useMemo(()=>"duration"===e.mode?range(0,f).map(e=>({value:e,label:String(e),accessibilityLabel:plural(e,"hour","hours")})):[],[e.mode,f]),I=S(j.hour),v=useMemo(()=>"duration"===e.mode?range(0,I,c).map(e=>({value:e,label:String(e).padStart(2,"0"),accessibilityLabel:plural(e,"minute","minutes")})):[],[e.mode,I,c]),W=useMemo(()=>"list"===e.mode?[{key:"list",label:e.label??"Value",items:h??[],value:e.value??"",width:e.width}]:"duration"===e.mode?[{key:"hours",label:x,items:w,value:j.hour,unit:y,gapAfter:n.spacing.md},{key:"minutes",label:g,items:v,value:j.minute,unit:M}]:e.columns,[e,h,w,v,j,x,g,y,M,n.spacing.md]),{onChange:T}=e,C=useCallback((t,i)=>{const o=t.items[i];if(o&&T)if("list"===e.mode)T(o.value);else if("duration"===e.mode){const e=Number(o.value),i=T;"hours"===t.key?i(60*e+Math.min(j.minute,S(e))):i(60*j.hour+e)}else T(t.key,o.value)},[T,e.mode,j,S]),k=useCallback(e=>{T?.(e)},[T]),L=60*j.hour+j.minute,F=_jsxs(View,{style:[m.wheels,s],testID:o,children:[_jsxs(View,{pointerEvents:"none",style:m.selectionBand,children:[_jsx(View,{style:m.bandLine}),_jsx(View,{style:m.bandLine})]}),W.map(o=>{if(0===o.items.length)return null;const s=o.items.findIndex(e=>e.value===o.value);return _jsxs(Fragment,{children:[_jsx(Wheel,{label:o.label,items:o.items,selectedIndex:Math.max(0,s),onIndexChange:e=>C(o,e),itemHeight:u,width:o.width??("list"===e.mode?void 0:64),theme:n,haptic:t,disabled:i,reducedMotion:r,typeable:"duration"===e.mode,testID:o.testID}),o.unit?_jsx(Text,{style:m.unit,maxFontSizeMultiplier:1.5,numberOfLines:1,accessible:!1,importantForAccessibility:"no","aria-hidden":!0,children:o.unit}):null,o.separator?_jsx(Text,{style:m.separator,maxFontSizeMultiplier:1.5,accessible:!1,importantForAccessibility:"no","aria-hidden":!0,children:o.separator}):null,o.gapAfter?_jsx(View,{style:{width:o.gapAfter}}):null]},o.key)})]});return _&&0!==_.length?_jsxs(View,{children:[F,_jsx(View,{style:m.presets,children:_.map(e=>_jsx(Chip,{label:formatPreset(e,y,M),size:"sm",selected:e===L,disabled:i,onPress:()=>k(e)},e))})]}):F},buildStyles=(e,t)=>StyleSheet.create({wheels:{flexDirection:"row",alignItems:"center",justifyContent:"center",height:t*WHEEL_VISIBLE_ITEMS,position:"relative"},selectionBand:{position:"absolute",left:0,right:0,top:t*WHEEL_CENTER_OFFSET,height:t,justifyContent:"space-between"},bandLine:{height:2*StyleSheet.hairlineWidth,backgroundColor:e.colors.primary,opacity:.85},separator:{fontSize:e.typography.fontSize["2xl"],fontWeight:e.typography.fontWeight.bold,color:e.colors.text.primary,paddingHorizontal:e.spacing.xs},unit:{fontSize:e.typography.fontSize.base,fontWeight:e.typography.fontWeight.semibold,color:e.colors.text.secondary,paddingLeft:e.spacing.xs},presets:{flexDirection:"row",flexWrap:"wrap",justifyContent:"center",gap:e.spacing.xs,paddingTop:e.spacing.sm}});export{WheelPicker};export default WheelPicker;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";export{Accordion,AccordionGroup}from"./Accordion/index.js";export{AmountSlider}from"./AmountSlider/index.js";export{AnimatePresence}from"./AnimatePresence/index.js";export{AppBar}from"./AppBar/index.js";export{AsyncBlock}from"./AsyncBlock/index.js";export{AuthedImage,authedImageCacheStats,clearAuthedImageCache,getAuthedImageCacheLimit,setAuthedImageCacheLimit}from"./AuthedImage/index.js";export{Autocomplete}from"./Autocomplete/index.js";export{Avatar,AvatarGroup}from"./Avatar/index.js";export{Badge}from"./Badge/index.js";export{Banner}from"./Banner/index.js";export{BarChart}from"./BarChart/index.js";export{BottomNavigation}from"./BottomNavigation/index.js";export{BottomSheet,useBottomSheet,useSheetSwap}from"./BottomSheet/index.js";export{Box,Row,Spacer,Stack}from"./Box/index.js";export{Button}from"./Button/index.js";export{Calendar}from"./Calendar/index.js";export{Card}from"./Card/index.js";export{Carousel}from"./Carousel/index.js";export{Checkbox}from"./Checkbox/index.js";export{Chip}from"./Chip/index.js";export{ChoiceGroup}from"./ChoiceGroup/index.js";export{Composer}from"./Composer/index.js";export{Confetti}from"./Confetti/index.js";export{DatePicker}from"./DatePicker/index.js";export{DateRangePicker}from"./DateRangePicker/index.js";export{DateSeparator,DEFAULT_DATE_SEPARATOR_LABELS,dayLabel}from"./DateSeparator/index.js";export{cleanDecimalText,DecimalInput,isUnclearDecimalComma,parseDecimalText,pointDecimalText}from"./DecimalInput/index.js";export{Descriptions}from"./Descriptions/index.js";export{Dialog}from"./Dialog/index.js";export{Divider}from"./Divider/index.js";export{Drawer}from"./Drawer/index.js";export{EmptyState}from"./EmptyState/index.js";export{ErrorBoundary,useErrorHandler,withErrorBoundary}from"./ErrorBoundary/index.js";export{FilePicker,formatFileSize}from"./FilePicker/index.js";export{FileViewer}from"./FileViewer/index.js";export{FilterChipRow}from"./FilterChipRow/index.js";export{FloatingActionButton,FloatingActionButtonGroup}from"./FloatingActionButton/index.js";export{ForceUpdateDialog}from"./ForceUpdateDialog/index.js";export{FormField}from"./FormField/index.js";export{IconBadge}from"./IconBadge/index.js";export{IconButton}from"./IconButton/index.js";export{ImageGallery}from"./ImageGallery/index.js";export{InlineSelect}from"./InlineSelect/index.js";export{Input}from"./Input/index.js";export{KeyboardAwareScrollView}from"./KeyboardAwareScrollView/index.js";export{KeyboardToolbar}from"./KeyboardToolbar/index.js";export{ListItem}from"./ListItem/index.js";export{LoaderOverlay,loader,useLoader}from"./LoaderOverlay/index.js";export{Markdown}from"./Markdown/index.js";export{Menu}from"./Menu/index.js";export{DEFAULT_MESSAGE_BUBBLE_LABELS,MessageBubble}from"./MessageBubble/index.js";export{DEFAULT_MESSAGE_LIST_LABELS,MessageList}from"./MessageList/index.js";export{MODAL_DISMISS_GRACE_MS,Modal}from"./Modal/index.js";export{Notation,parseNotation,sym}from"./Notation/index.js";export{NumberInput}from"./NumberInput/index.js";export{OnboardingPager}from"./OnboardingPager/index.js";export{OptionSheet}from"./OptionSheet/index.js";export{OTPInput}from"./OTPInput/index.js";export{PaymentResult}from"./PaymentResult/index.js";export{PermissionPrompt,usePermissionPrompt}from"./PermissionPrompt/index.js";export{ALL_CALLING_CODES,DEFAULT_CALLING_CODES,formatE164,PhoneNumberInput,parseE164}from"./PhoneNumberInput/index.js";export{PickerTrigger}from"./PickerTrigger/index.js";export{ProfileCompletion}from"./ProfileCompletion/index.js";export{ProfilePicker}from"./ProfilePicker/index.js";export{ProgressBar}from"./ProgressBar/index.js";export{ProgressRing}from"./ProgressRing/index.js";export{Radio,RadioDot,RadioGroup}from"./Radio/index.js";export{Rating}from"./Rating/index.js";export{Repeater}from"./Repeater/index.js";export{applyMarkdownAction,RichTextEditor}from"./RichTextEditor/index.js";export{ScannerOverlay}from"./ScannerOverlay/index.js";export{SearchBar,useRecentSearches}from"./SearchBar/index.js";export{SectionHeader}from"./SectionHeader/index.js";export{SegmentedControl}from"./SegmentedControl/index.js";export{Select}from"./Select/index.js";export{SignaturePad}from"./SignaturePad/index.js";export{Skeleton,SkeletonCircle,SkeletonClockProvider,SkeletonContent,SkeletonList,SkeletonProvider,SkeletonSkip,SkeletonText,
|
|
1
|
+
"use strict";export{Accordion,AccordionGroup}from"./Accordion/index.js";export{AmountSlider}from"./AmountSlider/index.js";export{AnimatePresence}from"./AnimatePresence/index.js";export{AppBar}from"./AppBar/index.js";export{AsyncBlock}from"./AsyncBlock/index.js";export{AuthedImage,authedImageCacheStats,clearAuthedImageCache,getAuthedImageCacheLimit,setAuthedImageCacheLimit}from"./AuthedImage/index.js";export{Autocomplete}from"./Autocomplete/index.js";export{Avatar,AvatarGroup}from"./Avatar/index.js";export{Badge}from"./Badge/index.js";export{Banner}from"./Banner/index.js";export{BarChart}from"./BarChart/index.js";export{BottomNavigation}from"./BottomNavigation/index.js";export{BottomSheet,useBottomSheet,useSheetSwap}from"./BottomSheet/index.js";export{Box,Row,Spacer,Stack}from"./Box/index.js";export{Button}from"./Button/index.js";export{Calendar}from"./Calendar/index.js";export{Card}from"./Card/index.js";export{Carousel}from"./Carousel/index.js";export{Checkbox}from"./Checkbox/index.js";export{Chip}from"./Chip/index.js";export{ChoiceGroup}from"./ChoiceGroup/index.js";export{Composer}from"./Composer/index.js";export{Confetti}from"./Confetti/index.js";export{DatePicker}from"./DatePicker/index.js";export{DateRangePicker}from"./DateRangePicker/index.js";export{DateSeparator,DEFAULT_DATE_SEPARATOR_LABELS,dayLabel}from"./DateSeparator/index.js";export{cleanDecimalText,DecimalInput,isUnclearDecimalComma,parseDecimalText,pointDecimalText}from"./DecimalInput/index.js";export{Descriptions}from"./Descriptions/index.js";export{Dialog}from"./Dialog/index.js";export{Divider}from"./Divider/index.js";export{Drawer}from"./Drawer/index.js";export{EmptyState}from"./EmptyState/index.js";export{ErrorBoundary,useErrorHandler,withErrorBoundary}from"./ErrorBoundary/index.js";export{FilePicker,formatFileSize}from"./FilePicker/index.js";export{FileViewer}from"./FileViewer/index.js";export{FilterChipRow}from"./FilterChipRow/index.js";export{FloatingActionButton,FloatingActionButtonGroup}from"./FloatingActionButton/index.js";export{ForceUpdateDialog}from"./ForceUpdateDialog/index.js";export{FormField}from"./FormField/index.js";export{IconBadge}from"./IconBadge/index.js";export{IconButton}from"./IconButton/index.js";export{ImageGallery}from"./ImageGallery/index.js";export{InlineSelect}from"./InlineSelect/index.js";export{Input}from"./Input/index.js";export{KeyboardAwareScrollView}from"./KeyboardAwareScrollView/index.js";export{KeyboardToolbar}from"./KeyboardToolbar/index.js";export{ListItem}from"./ListItem/index.js";export{LoaderOverlay,loader,useLoader}from"./LoaderOverlay/index.js";export{Markdown}from"./Markdown/index.js";export{Menu}from"./Menu/index.js";export{DEFAULT_MESSAGE_BUBBLE_LABELS,MessageBubble}from"./MessageBubble/index.js";export{DEFAULT_MESSAGE_LIST_LABELS,MessageList}from"./MessageList/index.js";export{MODAL_DISMISS_GRACE_MS,Modal}from"./Modal/index.js";export{Notation,parseNotation,sym}from"./Notation/index.js";export{NumberInput}from"./NumberInput/index.js";export{OnboardingPager}from"./OnboardingPager/index.js";export{OptionSheet}from"./OptionSheet/index.js";export{OTPInput}from"./OTPInput/index.js";export{PaymentResult}from"./PaymentResult/index.js";export{PermissionPrompt,usePermissionPrompt}from"./PermissionPrompt/index.js";export{ALL_CALLING_CODES,DEFAULT_CALLING_CODES,formatE164,PhoneNumberInput,parseE164}from"./PhoneNumberInput/index.js";export{PickerTrigger}from"./PickerTrigger/index.js";export{ProfileCompletion}from"./ProfileCompletion/index.js";export{ProfilePicker}from"./ProfilePicker/index.js";export{ProgressBar}from"./ProgressBar/index.js";export{ProgressRing}from"./ProgressRing/index.js";export{Radio,RadioDot,RadioGroup}from"./Radio/index.js";export{Rating}from"./Rating/index.js";export{Repeater}from"./Repeater/index.js";export{applyMarkdownAction,RichTextEditor}from"./RichTextEditor/index.js";export{ScannerOverlay}from"./ScannerOverlay/index.js";export{Screen}from"./Screen/index.js";export{SearchBar,useRecentSearches}from"./SearchBar/index.js";export{SectionHeader}from"./SectionHeader/index.js";export{SegmentedControl}from"./SegmentedControl/index.js";export{Select}from"./Select/index.js";export{SignaturePad}from"./SignaturePad/index.js";export{Skeleton,SkeletonCircle,SkeletonClockProvider,SkeletonContent,SkeletonList,SkeletonProvider,SkeletonSkip,SkeletonText,useSkeletonClock,useSkeletonDefaults}from"./Skeleton/index.js";export{Slider}from"./Slider/index.js";export{SliderField}from"./SliderField/index.js";export{SlideToConfirm}from"./SlideToConfirm/index.js";export{Sparkline}from"./Sparkline/index.js";export{Spinner}from"./Spinner/index.js";export{SquircleView}from"./SquircleView/index.js";export{StatTile}from"./StatTile/index.js";export{StatusBadge}from"./StatusBadge/index.js";export{Stepper}from"./Stepper/index.js";export{Swipeable}from"./Swipeable/index.js";export{Switch}from"./Switch/index.js";export{Tabs}from"./Tabs/index.js";export{TagInput}from"./TagInput/index.js";export{Text}from"./Text/index.js";export{Timeline}from"./Timeline/index.js";export{TimePicker}from"./TimePicker/index.js";export{Toast,ToastHost,ToastProvider,toast,useToast}from"./Toast/index.js";export{Tooltip}from"./Tooltip/index.js";export{Tour}from"./Tour/index.js";export{TypingIndicator}from"./TypingIndicator/index.js";export{WheelPicker}from"./WheelPicker/index.js";export{ZoomableImage}from"./ZoomableImage/index.js";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";export{useControllableState}from"./useControllableState.js";export{useDebounce}from"./useDebounce.js";export{createDragToDismissController,DRAG_DISMISS_DISTANCE,DRAG_DISMISS_VELOCITY,useDragToDismiss}from"./useDragToDismiss.js";export{FLICK_TOLERANCE,useFlickGuard}from"./useFlickGuard.js";export{PRESS_ANIMATION_PRESETS,usePressAnimation}from"./usePressAnimation.js";export{useReducedMotion}from"./useReducedMotion.js";export{useRefreshControl}from"./useRefreshControl.js";export{useScrollDirection}from"./useScrollDirection.js";export{useToggle}from"./useToggle.js";
|
|
1
|
+
"use strict";export{useControllableState}from"./useControllableState.js";export{useDebounce}from"./useDebounce.js";export{createDragToDismissController,DRAG_DISMISS_DISTANCE,DRAG_DISMISS_VELOCITY,useDragToDismiss}from"./useDragToDismiss.js";export{useFieldChain}from"./useFieldChain.js";export{FLICK_TOLERANCE,useFlickGuard}from"./useFlickGuard.js";export{PRESENCE_REDUCE_MOTION,usePresenceMotion}from"./usePresenceMotion.js";export{PRESS_ANIMATION_PRESETS,usePressAnimation}from"./usePressAnimation.js";export{useReducedMotion}from"./useReducedMotion.js";export{useRefreshControl}from"./useRefreshControl.js";export{useScrollDirection}from"./useScrollDirection.js";export{useToggle}from"./useToggle.js";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";import{useMemo}from"react";import{Animated,Easing}from"react-native";import{Gesture}from"react-native-gesture-handler";import{setNativeValue,useTheme}from"../theme/index.js";export const DRAG_DISMISS_DISTANCE=100;export const DRAG_DISMISS_VELOCITY=.5;export const createDragToDismissController=({drag:e,travel:t,onDismiss:
|
|
1
|
+
"use strict";import{useMemo,useRef}from"react";import{Animated,Easing}from"react-native";import{Gesture}from"react-native-gesture-handler";import{createAnimatedValue,setNativeValue,useTheme}from"../theme/index.js";import{usePresenceMotion}from"./usePresenceMotion.js";export const DRAG_DISMISS_DISTANCE=100;export const DRAG_DISMISS_VELOCITY=.5;export const createDragToDismissController=({drag:e,travel:t,onDismiss:a,opacity:n},s,r)=>{const{snappy:i}=s.spring,springBack=()=>Animated.spring(e,{toValue:0,damping:i.damping,stiffness:i.stiffness,mass:i.mass,useNativeDriver:!0}).start(),o=!0===r?.reduced?n:void 0,u=r?.duration("normal")??s.duration.normal;return{move:t=>{setNativeValue(e,Math.max(0,t))},release:(n,r)=>{if(n>100||r>.5){if(o)return void Animated.timing(o,{toValue:0,duration:u,easing:Easing.bezier(...s.easing.accelerate),useNativeDriver:!0}).start(()=>a());Animated.timing(e,{toValue:"function"==typeof t?t():t,duration:s.duration.fast,easing:Easing.bezier(...s.easing.accelerate),useNativeDriver:!0}).start(()=>a())}else springBack()},cancel:springBack}};export const useDragToDismiss=e=>{const{drag:t,travel:a,onDismiss:n,contentAtTop:s,scrollGesture:r}=e,{motion:i}=useTheme(),o=usePresenceMotion(),u=useRef(createAnimatedValue(1)).current;return useMemo(()=>{const e=createDragToDismissController({drag:t,travel:a,onDismiss:n,opacity:u},i,o),l=Gesture.Pan().runOnJS(!0).activeOffsetY(6).failOffsetX([-12,12]).onUpdate(t=>e.move(t.translationY)).onEnd(t=>e.release(t.translationY,t.velocityY/1e3)).onFinalize((_e,t)=>{t||e.cancel()});let c=0,m=!1;const f=Gesture.Pan().runOnJS(!0).activeOffsetY(8).failOffsetX([-12,12]).onBegin(()=>{c=0,m=!1}).onUpdate(t=>{if(!m){if(s&&!s())return;m=!0,c=t.translationY}e.move(t.translationY-c)}).onEnd(t=>{m&&e.release(t.translationY-c,t.velocityY/1e3)}).onFinalize((_e,t)=>{!t&&m&&e.cancel()});return r&&f.simultaneousWithExternalGesture(r),{handleGesture:l,sheetGesture:f,opacity:u}},[t,a,n,s,r,i,o,u])};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";import{useMemo}from"react";import{KeyboardController}from"react-native-keyboard-controller";const NEXT_FIELD={returnKeyType:"next",submitBehavior:"submit",onSubmitEditing:()=>KeyboardController.setFocusTo("next")};export const useFieldChain=e=>useMemo(()=>({next:NEXT_FIELD,last:{returnKeyType:"done",submitBehavior:"blurAndSubmit",onSubmitEditing:e}}),[e]);
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";import{useMemo}from"react";import{ReduceMotion}from"react-native-reanimated";import{useTheme}from"../theme/ThemeContext.js";import{useReducedMotion}from"./useReducedMotion.js";export const PRESENCE_REDUCE_MOTION=ReduceMotion.Never;export const usePresenceMotion=()=>{const e=useReducedMotion(),{motion:o}=useTheme();return useMemo(()=>({reduced:e,duration:t=>e?o.fadeDuration:o.duration[t],range:(o,t)=>e?[t,t]:[o,t]}),[e,o])};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";import{useCallback,useMemo,useRef}from"react";import{Easing,Animated as RNAnimated}from"react-native";import{useTheme}from"../theme/index.js";import{createAnimatedValue}from"../theme/animatedValue.js";export const PRESS_ANIMATION_PRESETS=["scale","bounce","fade","sink","pulse"];const FADE_TO=.6,SINK_BY=2,PULSE_TO=1.05,DEFAULT_SCALE_TO={scale:.97,bounce:.92,fade:1,sink:1,pulse:1};export const usePressAnimation=({preset:e="scale",scaleTo:a,pressDuration:s,enabled:t=!0}={})=>{const n=useTheme(),i=useRef(createAnimatedValue(1)).current,
|
|
1
|
+
"use strict";import{useCallback,useMemo,useRef}from"react";import{Easing,Animated as RNAnimated}from"react-native";import{useTheme}from"../theme/index.js";import{createAnimatedValue}from"../theme/animatedValue.js";import{usePresenceMotion}from"./usePresenceMotion.js";export const PRESS_ANIMATION_PRESETS=["scale","bounce","fade","sink","pulse"];const FADE_TO=.6,SINK_BY=2,PULSE_TO=1.05,DEFAULT_SCALE_TO={scale:.97,bounce:.92,fade:1,sink:1,pulse:1};export const usePressAnimation=({preset:e="scale",scaleTo:a,pressDuration:s,enabled:t=!0}={})=>{const n=useTheme(),i=usePresenceMotion(),r=useRef(createAnimatedValue(1)).current,o=useRef(createAnimatedValue(1)).current,c=useRef(createAnimatedValue(0)).current,u=i.reduced?"fade":e,m=a??DEFAULT_SCALE_TO[u],l=s??i.duration("fast"),d=useCallback((e,a,s)=>RNAnimated.timing(e,{toValue:a,duration:l,easing:Easing.bezier(...s),useNativeDriver:!0}),[l]),p=useCallback((e,a,s)=>RNAnimated.spring(e,{toValue:a,damping:n.motion.spring[s].damping,stiffness:n.motion.spring[s].stiffness,mass:n.motion.spring[s].mass,useNativeDriver:!0}),[n]),f=useCallback(()=>{if(t)switch(u){case"scale":case"bounce":d(r,m,n.motion.easing.standard).start();break;case"fade":d(o,.6,n.motion.easing.standard).start();break;case"sink":d(c,2,n.motion.easing.standard).start()}},[t,u,m,r,o,c,n,d]),b=useCallback(()=>{if(t)switch(u){case"scale":p(r,1,"snappy").start();break;case"bounce":p(r,1,"bouncy").start();break;case"fade":d(o,1,n.motion.easing.decelerate).start();break;case"sink":p(c,0,"snappy").start()}},[t,u,r,o,c,n,d,p]),g=useCallback(()=>{t&&"pulse"===u&&RNAnimated.sequence([RNAnimated.timing(r,{toValue:1.05,duration:n.motion.duration.instant,easing:Easing.bezier(...n.motion.easing.accelerate),useNativeDriver:!0}),p(r,1,"snappy")]).start()},[t,u,r,n,p]),A=useMemo(()=>({transform:[{scale:r},{translateY:c}],opacity:o}),[r,c,o]);return{scale:r,opacity:o,translateY:c,style:A,pressIn:f,pressOut:b,press:g}};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";import{
|
|
1
|
+
"use strict";import{useSyncExternalStore}from"react";import{AccessibilityInfo}from"react-native";import{useReducedMotion as useReanimatedReducedMotion}from"react-native-reanimated";let live=null;const listeners=new Set;let subscription=null,generation=0;const notify=()=>{for(const e of listeners)e()},subscribe=e=>{if(listeners.add(e),1===listeners.size){const e=++generation;subscription=AccessibilityInfo.addEventListener("reduceMotionChanged",e=>{live=e,notify()}),AccessibilityInfo.isReduceMotionEnabled().then(t=>{e===generation&&listeners.size>0&&(live=t,notify())})}return()=>{listeners.delete(e),0===listeners.size&&(subscription?.remove(),subscription=null,live=null,generation++)}};export const useReducedMotion=()=>{const e=useReanimatedReducedMotion();return useSyncExternalStore(subscribe,()=>live??e,()=>e)};
|
package/lib/module/index.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";export*from"./components/index.js";export{APP_ICON_SIZES,AppIcon,CURATED_ICON_NAMES,defaultIcons,ICON_NAMES,ICONSAX_SUFFIX,renderSlotIcon}from"./components/AppIcon/index.js";export{deletePath,Form,getPath,HookFormField,isFieldFilled,rules,setPath,useField,useFieldArray,useForm,useFormCompletion,useFormContext,useHookFormField,useOptionalFormContext}from"./form/index.js";export{FLICK_TOLERANCE,PRESS_ANIMATION_PRESETS,useControllableState,useDebounce,useFlickGuard,usePressAnimation,useReducedMotion,useRefreshControl,useScrollDirection,useToggle}from"./hooks/index.js";export{initUI}from"./initUI.js";export{NetworkStatusBanner}from"./network/index.js";export{darkTheme,getColorMode,getTheme,lightTheme,mergeTheme,resetTheme,setColorMode,setTheme,subscribeTheme,ThemeProvider,useTheme,useThemeMode}from"./theme/index.js";export{announce,Breakpoints,configureFeedback,feedback,hapticForIntent,isFeedbackEnabled,isScreenSize,isTablet,Margin,Padding,Responsive,ScreenDimensions,Spacing,SQUIRCLE_MIN_RADIUS,SQUIRCLE_SMOOTHING,setHapticImplementation,shadowStyle,smoothCorners,squircleApplies,squircleHostRadius,squirclePath,triggerHaptic,useScreenDimensions,warnUnknownProps}from"./utils/index.js";
|
|
1
|
+
"use strict";export*from"./components/index.js";export{APP_ICON_SIZES,AppIcon,CURATED_ICON_NAMES,defaultIcons,ICON_NAMES,ICONSAX_SUFFIX,renderSlotIcon}from"./components/AppIcon/index.js";export{deletePath,Form,getPath,HookFormField,isFieldFilled,rules,setPath,useField,useFieldArray,useForm,useFormCompletion,useFormContext,useHookFormField,useOptionalFormContext}from"./form/index.js";export{FLICK_TOLERANCE,PRESENCE_REDUCE_MOTION,PRESS_ANIMATION_PRESETS,useControllableState,useDebounce,useFieldChain,useFlickGuard,usePresenceMotion,usePressAnimation,useReducedMotion,useRefreshControl,useScrollDirection,useToggle}from"./hooks/index.js";export{initUI}from"./initUI.js";export{NetworkStatusBanner}from"./network/index.js";export{darkTheme,getColorMode,getTheme,lightTheme,mergeTheme,resetTheme,setColorMode,setTheme,subscribeTheme,ThemeProvider,useTheme,useThemeMode}from"./theme/index.js";export{announce,Breakpoints,configureFeedback,feedback,hapticForIntent,isFeedbackEnabled,isScreenSize,isTablet,Margin,Padding,Responsive,ScreenDimensions,Spacing,SQUIRCLE_MIN_RADIUS,SQUIRCLE_SMOOTHING,setHapticImplementation,shadowStyle,smoothCorners,squircleApplies,squircleHostRadius,squirclePath,triggerHaptic,useScreenDimensions,warnUnknownProps}from"./utils/index.js";
|