@webority/mobile-ui 0.95.0 → 0.98.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.
Files changed (97) hide show
  1. package/dist/canvas-kit/kit.css +0 -0
  2. package/dist/canvas-kit/kit.js +52518 -0
  3. package/dist/canvas-kit/manifest.json +21091 -0
  4. package/dist/canvas-kit/release.json +25 -0
  5. package/lib/commonjs/canvasKit/index.js +1 -1
  6. package/lib/commonjs/components/AppBar/AppBar.js +1 -1
  7. package/lib/commonjs/components/Avatar/Avatar.js +1 -1
  8. package/lib/commonjs/components/Banner/Banner.js +1 -1
  9. package/lib/commonjs/components/BottomNavigation/BottomNavigation.js +1 -1
  10. package/lib/commonjs/components/Button/Button.js +1 -1
  11. package/lib/commonjs/components/Calendar/Calendar.js +1 -1
  12. package/lib/commonjs/components/Checkbox/Checkbox.js +1 -1
  13. package/lib/commonjs/components/Chip/Chip.js +1 -1
  14. package/lib/commonjs/components/DatePicker/DatePicker.js +1 -1
  15. package/lib/commonjs/components/EmptyState/EmptyState.meta.js +1 -1
  16. package/lib/commonjs/components/FilePicker/FilePicker.js +1 -1
  17. package/lib/commonjs/components/IconButton/IconButton.js +1 -1
  18. package/lib/commonjs/components/ImageGallery/ImageGallery.js +1 -1
  19. package/lib/commonjs/components/InlineSelect/InlineSelect.js +1 -1
  20. package/lib/commonjs/components/Input/Input.js +1 -1
  21. package/lib/commonjs/components/KeyboardToolbar/KeyboardToolbar.js +1 -1
  22. package/lib/commonjs/components/OptionSheet/OptionSheet.js +1 -1
  23. package/lib/commonjs/components/PhoneNumberInput/PhoneNumberInput.js +1 -1
  24. package/lib/commonjs/components/Radio/Radio.js +1 -1
  25. package/lib/commonjs/components/Rating/Rating.js +1 -1
  26. package/lib/commonjs/components/RichTextEditor/RichTextEditor.js +1 -1
  27. package/lib/commonjs/components/SearchBar/SearchBar.js +1 -1
  28. package/lib/commonjs/components/SliderField/SliderField.js +1 -1
  29. package/lib/commonjs/components/Stepper/Stepper.js +1 -1
  30. package/lib/commonjs/components/Switch/Switch.js +1 -1
  31. package/lib/commonjs/components/Text/Text.js +1 -1
  32. package/lib/commonjs/components/Toast/Toast.js +1 -1
  33. package/lib/commonjs/index.js +1 -1
  34. package/lib/commonjs/theme/index.js +1 -1
  35. package/lib/module/canvasKit/index.js +1 -1
  36. package/lib/module/components/AppBar/AppBar.js +1 -1
  37. package/lib/module/components/Avatar/Avatar.js +1 -1
  38. package/lib/module/components/Banner/Banner.js +1 -1
  39. package/lib/module/components/BottomNavigation/BottomNavigation.js +1 -1
  40. package/lib/module/components/Button/Button.js +1 -1
  41. package/lib/module/components/Calendar/Calendar.js +1 -1
  42. package/lib/module/components/Checkbox/Checkbox.js +1 -1
  43. package/lib/module/components/Chip/Chip.js +1 -1
  44. package/lib/module/components/DatePicker/DatePicker.js +1 -1
  45. package/lib/module/components/EmptyState/EmptyState.meta.js +1 -1
  46. package/lib/module/components/FilePicker/FilePicker.js +1 -1
  47. package/lib/module/components/IconButton/IconButton.js +1 -1
  48. package/lib/module/components/ImageGallery/ImageGallery.js +1 -1
  49. package/lib/module/components/InlineSelect/InlineSelect.js +1 -1
  50. package/lib/module/components/Input/Input.js +1 -1
  51. package/lib/module/components/KeyboardToolbar/KeyboardToolbar.js +1 -1
  52. package/lib/module/components/OptionSheet/OptionSheet.js +1 -1
  53. package/lib/module/components/PhoneNumberInput/PhoneNumberInput.js +1 -1
  54. package/lib/module/components/Radio/Radio.js +1 -1
  55. package/lib/module/components/Rating/Rating.js +1 -1
  56. package/lib/module/components/RichTextEditor/RichTextEditor.js +1 -1
  57. package/lib/module/components/SearchBar/SearchBar.js +1 -1
  58. package/lib/module/components/SliderField/SliderField.js +1 -1
  59. package/lib/module/components/Stepper/Stepper.js +1 -1
  60. package/lib/module/components/Switch/Switch.js +1 -1
  61. package/lib/module/components/Text/Text.js +1 -1
  62. package/lib/module/components/Toast/Toast.js +1 -1
  63. package/lib/module/index.js +1 -1
  64. package/lib/module/theme/index.js +1 -1
  65. package/lib/typescript/commonjs/canvasKit/index.d.ts +20 -3
  66. package/lib/typescript/commonjs/components/AppBar/AppBar.d.ts +1 -0
  67. package/lib/typescript/commonjs/components/Button/Button.meta.d.ts +1 -1
  68. package/lib/typescript/commonjs/components/Card/Card.meta.d.ts +1 -1
  69. package/lib/typescript/commonjs/components/Checkbox/Checkbox.meta.d.ts +1 -1
  70. package/lib/typescript/commonjs/components/DecimalInput/DecimalInput.meta.d.ts +1 -1
  71. package/lib/typescript/commonjs/components/EmptyState/EmptyState.meta.d.ts +1 -1
  72. package/lib/typescript/commonjs/components/Input/Input.meta.d.ts +1 -1
  73. package/lib/typescript/commonjs/components/Radio/Radio.meta.d.ts +1 -1
  74. package/lib/typescript/commonjs/components/SearchBar/SearchBar.meta.d.ts +1 -1
  75. package/lib/typescript/commonjs/components/Switch/Switch.meta.d.ts +1 -1
  76. package/lib/typescript/commonjs/components/Text/Text.meta.d.ts +1 -1
  77. package/lib/typescript/commonjs/index.d.ts +2 -3
  78. package/lib/typescript/commonjs/theme/index.d.ts +0 -20
  79. package/lib/typescript/module/canvasKit/index.d.ts +20 -3
  80. package/lib/typescript/module/components/AppBar/AppBar.d.ts +1 -0
  81. package/lib/typescript/module/components/Button/Button.meta.d.ts +1 -1
  82. package/lib/typescript/module/components/Card/Card.meta.d.ts +1 -1
  83. package/lib/typescript/module/components/Checkbox/Checkbox.meta.d.ts +1 -1
  84. package/lib/typescript/module/components/DecimalInput/DecimalInput.meta.d.ts +1 -1
  85. package/lib/typescript/module/components/EmptyState/EmptyState.meta.d.ts +1 -1
  86. package/lib/typescript/module/components/Input/Input.meta.d.ts +1 -1
  87. package/lib/typescript/module/components/Radio/Radio.meta.d.ts +1 -1
  88. package/lib/typescript/module/components/SearchBar/SearchBar.meta.d.ts +1 -1
  89. package/lib/typescript/module/components/Switch/Switch.meta.d.ts +1 -1
  90. package/lib/typescript/module/components/Text/Text.meta.d.ts +1 -1
  91. package/lib/typescript/module/index.d.ts +2 -3
  92. package/lib/typescript/module/theme/index.d.ts +0 -20
  93. package/package.json +10 -8
  94. package/lib/commonjs/initUI.js +0 -1
  95. package/lib/module/initUI.js +0 -1
  96. package/lib/typescript/commonjs/initUI.d.ts +0 -12
  97. package/lib/typescript/module/initUI.d.ts +0 -12
@@ -1 +1 @@
1
- "use strict";import{forwardRef,useCallback,useEffect,useLayoutEffect,useMemo,useRef}from"react";import{AccessibilityInfo,Animated,Easing,Pressable,Text,View}from"react-native";import{useControllableState,usePresenceMotion}from"../../hooks/index.js";import{createAnimatedValue,useTheme}from"../../theme/index.js";import{resolveHaptic,triggerHaptic}from"../../utils/index.js";import{CalendarDay}from"./CalendarDay.js";import{addMonths,buildMonthMatrix,GRID_CELLS,startOfDay,startOfMonth,toIso,weekdayLabels}from"./calendarDates.js";import{buildCalendarStyles,MIN_CELL_SIZE,NAV_BUTTON_SIZE}from"./calendarStyles.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const DEFAULT_TONE={holiday:"danger",event:"primary",pending:"warning"},MAX_DOTS=3,DAY_TEXT_MAX_SCALE=1.5,toneColor=(e,t)=>{switch(t){case"success":return e.colors.success;case"warning":return e.colors.warning;case"danger":return e.colors.danger;case"info":return e.colors.info;case"primary":return e.colors.primary;default:return e.colors["text-muted"]}},toneInk=(e,t)=>"neutral"===t?e.colors["text-muted"]:e.colors[`${t}-text`],Calendar=forwardRef((e,t)=>{const{mode:a="single",value:s,onChange:i,month:n,onMonthChange:r,minDate:l,maxDate:o,disabledDates:d,weekStartsOn:u=0,locale:c="en-IN",markedDates:m,strikeMarkedInRange:h=!1,cellSize:y,haptic:g,accessibilityLabel:f,style:p,headerLabelStyle:b,navButtonStyle:x,testID:M}=e,w=useTheme(),D=usePresenceMotion(),T=useMemo(()=>buildCalendarStyles(w),[w]),[_,k]=useControllableState({value:n?startOfMonth(n):void 0,defaultValue:startOfMonth(s?.start??new Date),onChange:r}),v=12*_.getFullYear()+_.getMonth(),C=s?.start?startOfDay(s.start):null,S="range"===a&&s?.end?startOfDay(s.end):null,I=C?.getTime()??null,L=S?.getTime()??null,E=toIso(new Date),j=l?startOfDay(l).getTime():null,A=o?startOfDay(o).getTime():null,V=useMemo(()=>new Set((d??[]).map(e=>toIso(e))),[d]),N=useCallback(e=>null!==j&&e.getTime()<j||null!==A&&e.getTime()>A||V.has(toIso(e)),[j,A,V]),R=useMemo(()=>{const e=new Map;for(const t of m??[]){const a=toIso(t.date);let s=e.get(a);s||(s={dots:[],holiday:!1,spoken:[]},e.set(a,s));const i=t.tone??DEFAULT_TONE[t.kind],n=toneColor(w,i);s.dots.length<3&&s.dots.push({key:`${t.kind}-${s.dots.length}`,color:n}),"holiday"===t.kind&&(s.holiday=!0,s.holidayInk??=toneInk(w,i)),t.label&&s.spoken.push(t.label),s.spoken.push(t.kind)}return e},[m,w]),O=useMemo(()=>buildMonthMatrix(new Date(Math.floor(v/12),v%12,1),u),[v,u]),F=useMemo(()=>weekdayLabels(c,u),[c,u]),P=useMemo(()=>new Intl.DateTimeFormat(c,{month:"long",year:"numeric"}),[c]),B=useMemo(()=>new Intl.DateTimeFormat(c,{weekday:"short",day:"numeric",month:"long"}),[c]),z=P.format(_),H=null===j||startOfMonth(new Date(j)).getTime()<_.getTime(),Z=null===A||startOfMonth(new Date(A)).getTime()>_.getTime(),X=useRef(createAnimatedValue(0)).current,$=useRef(createAnimatedValue(1)).current,U=useRef(null);useEffect(()=>()=>U.current?.stop(),[]);const q=useCallback(e=>{!1!==g&&triggerHaptic("impactLight");const t=w.motion.duration.fast,a=w.motion.duration.fast,[s]=D.range(32*-e,0),[i]=D.range(32*e,0),n=D.reduced?D.duration("fast"):t,r=D.reduced?D.duration("fast"):a;U.current?.stop(),U.current=Animated.sequence([Animated.parallel([Animated.timing(X,{toValue:s,duration:t,easing:Easing.out(Easing.quad),useNativeDriver:!0}),Animated.timing($,{toValue:0,duration:n,useNativeDriver:!0})]),Animated.timing(X,{toValue:i,duration:0,useNativeDriver:!0}),Animated.parallel([Animated.timing(X,{toValue:0,duration:a,easing:Easing.out(Easing.cubic),useNativeDriver:!0}),Animated.timing($,{toValue:1,duration:r,useNativeDriver:!0})])]),U.current.start();const l=addMonths(_,e);k(l),AccessibilityInfo.announceForAccessibility(P.format(l))},[g,_,$,P,X,D,k,w]),G=useCallback(()=>q(-1),[q]),Y=useCallback(()=>q(1),[q]),pressDay=e=>{if(N(e.date))return;const t=resolveHaptic(g,"selection");t&&triggerHaptic(t);const s=e.date;"single"===a||!C||S||s.getTime()<C.getTime()?i({start:s}):i({start:C,end:s}),e.inMonth||k(startOfMonth(s))},W=useRef(pressDay);useLayoutEffect(()=>{W.current=pressDay});const J=useCallback(e=>W.current(e),[]),K=void 0===y?void 0:Math.max(y,MIN_CELL_SIZE),Q=useMemo(()=>void 0===K?{flex:1}:{width:K},[K]),ee=useMemo(()=>void 0===K?{flex:1,aspectRatio:1,minHeight:MIN_CELL_SIZE}:{width:K,height:K},[K]),te=Math.max(w.space.sm,(MIN_CELL_SIZE-NAV_BUTTON_SIZE)/2),ae=Math.min(w.settings.maxFontSizeMultiplier??1.5,1.5),se=[];for(let e=0;e<GRID_CELLS;e+=7)se.push(O.slice(e,e+7));return _jsxs(View,{ref:t,style:[T.root,p],testID:M,children:[_jsxs(View,{style:T.headerRow,children:[_jsx(Pressable,{onPress:G,disabled:!H,style:({pressed:e})=>[T.navBtn,e&&T.navBtnPressed,!H&&T.navBtnDisabled,x],accessibilityRole:"button",accessibilityLabel:"Previous month",accessibilityState:{disabled:!H},"aria-disabled":!H,hitSlop:te,children:_jsx(Text,{style:T.navText,maxFontSizeMultiplier:ae,children:"‹"})}),_jsx(Animated.View,{style:[T.headerLabelWrap,{opacity:$,transform:[{translateX:X}]},b],children:_jsx(Text,{style:T.headerLabel,accessibilityRole:"header",accessibilityLabel:f?`${f}, ${z}`:void 0,maxFontSizeMultiplier:w.settings.maxFontSizeMultiplier,children:z})}),_jsx(Pressable,{onPress:Y,disabled:!Z,style:({pressed:e})=>[T.navBtn,e&&T.navBtnPressed,!Z&&T.navBtnDisabled,x],accessibilityRole:"button",accessibilityLabel:"Next month",accessibilityState:{disabled:!Z},"aria-disabled":!Z,hitSlop:te,children:_jsx(Text,{style:T.navText,maxFontSizeMultiplier:ae,children:"›"})})]}),_jsx(View,{style:T.weekdayRow,accessibilityElementsHidden:!0,importantForAccessibility:"no-hide-descendants",children:F.map(({weekday:e,label:t})=>_jsx(View,{style:[T.weekdayCell,Q],children:_jsx(Text,{style:T.weekdayText,maxFontSizeMultiplier:ae,children:t})},e))}),_jsx(Animated.View,{style:{opacity:$,transform:[{translateX:X}]},children:se.map(e=>_jsx(View,{style:T.gridRow,children:e.map(e=>{const t=e.date.getTime(),s=null!==I&&t===I,i=null!==L&&t===L,n=null!==I&&null!==L&&t>=I&&t<=L,r=n&&!s&&!i,l=e.iso===E,o=R.get(e.iso),d=h&&n&&!0===o?.holiday,u=[B.format(e.date),...o?.spoken??[]];return l&&u.push("today"),"range"===a&&(s&&i?u.push("start and end of your range"):s?u.push("start of your range"):i?u.push("end of your range"):r&&u.push("in your range")),d&&u.push("not counted"),_jsx(CalendarDay,{cell:e,accessibilityLabel:u.join(", "),disabled:N(e.date),edge:s||i,mid:r,barLeft:n&&(i||r)&&!(s&&i),barRight:n&&(s||r)&&!(s&&i),today:l,struck:d,dots:o?.dots,inkColor:o?.holidayInk,cellStyle:ee,styles:T,maxFontSizeMultiplier:ae,onPressDay:J},e.iso)})},e[0].iso))})]})});Calendar.displayName="Calendar";export{Calendar};export default Calendar;
1
+ "use strict";import{forwardRef,useCallback,useEffect,useLayoutEffect,useMemo,useRef}from"react";import{AccessibilityInfo,Animated,Easing,Pressable,Text,View}from"react-native";import{useControllableState,usePresenceMotion}from"../../hooks/index.js";import{createAnimatedValue,useTheme}from"../../theme/index.js";import{resolveHaptic,triggerHaptic}from"../../utils/index.js";import{hitSlopMarker}from"../../utils/hitSlop.js";import{CalendarDay}from"./CalendarDay.js";import{addMonths,buildMonthMatrix,GRID_CELLS,startOfDay,startOfMonth,toIso,weekdayLabels}from"./calendarDates.js";import{buildCalendarStyles,MIN_CELL_SIZE,NAV_BUTTON_SIZE}from"./calendarStyles.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const DEFAULT_TONE={holiday:"danger",event:"primary",pending:"warning"},MAX_DOTS=3,DAY_TEXT_MAX_SCALE=1.5,toneColor=(e,t)=>{switch(t){case"success":return e.colors.success;case"warning":return e.colors.warning;case"danger":return e.colors.danger;case"info":return e.colors.info;case"primary":return e.colors.primary;default:return e.colors["text-muted"]}},toneInk=(e,t)=>"neutral"===t?e.colors["text-muted"]:e.colors[`${t}-text`],Calendar=forwardRef((e,t)=>{const{mode:a="single",value:s,onChange:i,month:n,onMonthChange:r,minDate:l,maxDate:o,disabledDates:d,weekStartsOn:u=0,locale:c="en-IN",markedDates:m,strikeMarkedInRange:h=!1,cellSize:y,haptic:g,accessibilityLabel:p,style:f,headerLabelStyle:b,navButtonStyle:x,testID:M}=e,k=useTheme(),w=usePresenceMotion(),D=useMemo(()=>buildCalendarStyles(k),[k]),[S,T]=useControllableState({value:n?startOfMonth(n):void 0,defaultValue:startOfMonth(s?.start??new Date),onChange:r}),_=12*S.getFullYear()+S.getMonth(),v=s?.start?startOfDay(s.start):null,C="range"===a&&s?.end?startOfDay(s.end):null,I=v?.getTime()??null,L=C?.getTime()??null,E=toIso(new Date),j=l?startOfDay(l).getTime():null,A=o?startOfDay(o).getTime():null,V=useMemo(()=>new Set((d??[]).map(e=>toIso(e))),[d]),N=useCallback(e=>null!==j&&e.getTime()<j||null!==A&&e.getTime()>A||V.has(toIso(e)),[j,A,V]),R=useMemo(()=>{const e=new Map;for(const t of m??[]){const a=toIso(t.date);let s=e.get(a);s||(s={dots:[],holiday:!1,spoken:[]},e.set(a,s));const i=t.tone??DEFAULT_TONE[t.kind],n=toneColor(k,i);s.dots.length<3&&s.dots.push({key:`${t.kind}-${s.dots.length}`,color:n}),"holiday"===t.kind&&(s.holiday=!0,s.holidayInk??=toneInk(k,i)),t.label&&s.spoken.push(t.label),s.spoken.push(t.kind)}return e},[m,k]),O=useMemo(()=>buildMonthMatrix(new Date(Math.floor(_/12),_%12,1),u),[_,u]),F=useMemo(()=>weekdayLabels(c,u),[c,u]),P=useMemo(()=>new Intl.DateTimeFormat(c,{month:"long",year:"numeric"}),[c]),B=useMemo(()=>new Intl.DateTimeFormat(c,{weekday:"short",day:"numeric",month:"long"}),[c]),z=P.format(S),H=null===j||startOfMonth(new Date(j)).getTime()<S.getTime(),Z=null===A||startOfMonth(new Date(A)).getTime()>S.getTime(),X=useRef(createAnimatedValue(0)).current,$=useRef(createAnimatedValue(1)).current,U=useRef(null);useEffect(()=>()=>U.current?.stop(),[]);const q=useCallback(e=>{!1!==g&&triggerHaptic("impactLight");const t=k.motion.duration.fast,a=k.motion.duration.fast,[s]=w.range(32*-e,0),[i]=w.range(32*e,0),n=w.reduced?w.duration("fast"):t,r=w.reduced?w.duration("fast"):a;U.current?.stop(),U.current=Animated.sequence([Animated.parallel([Animated.timing(X,{toValue:s,duration:t,easing:Easing.out(Easing.quad),useNativeDriver:!0}),Animated.timing($,{toValue:0,duration:n,useNativeDriver:!0})]),Animated.timing(X,{toValue:i,duration:0,useNativeDriver:!0}),Animated.parallel([Animated.timing(X,{toValue:0,duration:a,easing:Easing.out(Easing.cubic),useNativeDriver:!0}),Animated.timing($,{toValue:1,duration:r,useNativeDriver:!0})])]),U.current.start();const l=addMonths(S,e);T(l),AccessibilityInfo.announceForAccessibility(P.format(l))},[g,S,$,P,X,w,T,k]),G=useCallback(()=>q(-1),[q]),Y=useCallback(()=>q(1),[q]),pressDay=e=>{if(N(e.date))return;const t=resolveHaptic(g,"selection");t&&triggerHaptic(t);const s=e.date;"single"===a||!v||C||s.getTime()<v.getTime()?i({start:s}):i({start:v,end:s}),e.inMonth||T(startOfMonth(s))},W=useRef(pressDay);useLayoutEffect(()=>{W.current=pressDay});const J=useCallback(e=>W.current(e),[]),K=void 0===y?void 0:Math.max(y,MIN_CELL_SIZE),Q=useMemo(()=>void 0===K?{flex:1}:{width:K},[K]),ee=useMemo(()=>void 0===K?{flex:1,aspectRatio:1,minHeight:MIN_CELL_SIZE}:{width:K,height:K},[K]),te=Math.max(k.space.sm,(MIN_CELL_SIZE-NAV_BUTTON_SIZE)/2),ae=Math.min(k.settings.maxFontSizeMultiplier??1.5,1.5),se=[];for(let e=0;e<GRID_CELLS;e+=7)se.push(O.slice(e,e+7));return _jsxs(View,{ref:t,style:[D.root,f],testID:M,children:[_jsxs(View,{style:D.headerRow,children:[_jsx(Pressable,{onPress:G,disabled:!H,style:({pressed:e})=>[D.navBtn,e&&D.navBtnPressed,!H&&D.navBtnDisabled,x],accessibilityRole:"button",accessibilityLabel:"Previous month",accessibilityState:{disabled:!H},"aria-disabled":!H,hitSlop:te,...hitSlopMarker(te),children:_jsx(Text,{style:D.navText,maxFontSizeMultiplier:ae,children:"‹"})}),_jsx(Animated.View,{style:[D.headerLabelWrap,{opacity:$,transform:[{translateX:X}]},b],children:_jsx(Text,{style:D.headerLabel,accessibilityRole:"header",accessibilityLabel:p?`${p}, ${z}`:void 0,maxFontSizeMultiplier:k.settings.maxFontSizeMultiplier,children:z})}),_jsx(Pressable,{onPress:Y,disabled:!Z,style:({pressed:e})=>[D.navBtn,e&&D.navBtnPressed,!Z&&D.navBtnDisabled,x],accessibilityRole:"button",accessibilityLabel:"Next month",accessibilityState:{disabled:!Z},"aria-disabled":!Z,hitSlop:te,...hitSlopMarker(te),children:_jsx(Text,{style:D.navText,maxFontSizeMultiplier:ae,children:"›"})})]}),_jsx(View,{style:D.weekdayRow,accessibilityElementsHidden:!0,importantForAccessibility:"no-hide-descendants",children:F.map(({weekday:e,label:t})=>_jsx(View,{style:[D.weekdayCell,Q],children:_jsx(Text,{style:D.weekdayText,maxFontSizeMultiplier:ae,children:t})},e))}),_jsx(Animated.View,{style:{opacity:$,transform:[{translateX:X}]},children:se.map(e=>_jsx(View,{style:D.gridRow,children:e.map(e=>{const t=e.date.getTime(),s=null!==I&&t===I,i=null!==L&&t===L,n=null!==I&&null!==L&&t>=I&&t<=L,r=n&&!s&&!i,l=e.iso===E,o=R.get(e.iso),d=h&&n&&!0===o?.holiday,u=[B.format(e.date),...o?.spoken??[]];return l&&u.push("today"),"range"===a&&(s&&i?u.push("start and end of your range"):s?u.push("start of your range"):i?u.push("end of your range"):r&&u.push("in your range")),d&&u.push("not counted"),_jsx(CalendarDay,{cell:e,accessibilityLabel:u.join(", "),disabled:N(e.date),edge:s||i,mid:r,barLeft:n&&(i||r)&&!(s&&i),barRight:n&&(s||r)&&!(s&&i),today:l,struck:d,dots:o?.dots,inkColor:o?.holidayInk,cellStyle:ee,styles:D,maxFontSizeMultiplier:ae,onPressDay:J},e.iso)})},e[0].iso))})]})});Calendar.displayName="Calendar";export{Calendar};export default Calendar;
@@ -1 +1 @@
1
- "use strict";import{forwardRef,useEffect,useMemo,useRef}from"react";import{Animated,Pressable,StyleSheet,View}from"react-native";import Svg,{Path}from"react-native-svg";import{useControllableState}from"../../hooks/index.js";import{createAnimatedValue,resolveCheckboxSize,spaceOf,useTheme}from"../../theme/index.js";import{smoothCorners}from"../../utils/corners.js";import{resolveHaptic,triggerHaptic}from"../../utils/hapticUtils.js";import{ChoiceText,hasChoiceDetail}from"../FieldBase/ChoiceText.js";import{fieldTextAsString,hasFieldText}from"../FieldBase/FieldBase.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const toneColor=(e,r)=>{switch(r){case"success":return e.colors.success;case"warning":return e.colors.warning;case"danger":return e.colors.danger;default:return e.colors.primary}},toneOnColor=(e,r)=>{switch(r){case"success":return e.colors["on-success"];case"warning":return e.colors["on-warning"];case"danger":return e.colors["on-danger"];default:return e.colors["on-primary"]}},Checkbox=forwardRef((e,r)=>{const{checked:s,defaultChecked:t,onChange:o,indeterminate:i=!1,disabled:a=!1,label:n,description:l,error:c,help:d,labelLines:h,size:p="md",tone:u="primary",accessibilityLabel:m,haptic:x,style:b,boxStyle:f,indeterminateBarStyle:g,containerStyle:y,labelStyle:C,testID:w,...S}=e,[k,j]=useControllableState({value:s,defaultValue:t??!1,onChange:o}),v=useTheme(),T=useMemo(()=>buildStyles(v),[v]),{"box-size":R}=useMemo(()=>resolveCheckboxSize(v,p),[v,p]),_=v.size.border,L=spaceOf(v,v.components.checkbox["label-gap"]),V=toneColor(v,u),A=k||i,D=useRef(createAnimatedValue(A?1:0)).current;useEffect(()=>{const e=Animated.spring(D,{toValue:A?1:0,damping:v.motion.spring.snappy.damping,stiffness:v.motion.spring.snappy.stiffness,mass:v.motion.spring.snappy.mass,useNativeDriver:!0});return e.start(),()=>e.stop()},[A,D,v.motion.spring.snappy]);const M=D.interpolate({inputRange:[0,1],outputRange:[0,1]}),F=m??fieldTextAsString(n),I=!0===c||hasFieldText(c),H=A?V:a?v.colors.border:I?v.colors["field-border-error"]:v.colors.border,P=A?V:a?v.colors["surface-disabled"]:"transparent",z=a&&!A?v.colors["text-disabled"]:toneOnColor(v,u),B=Math.round(.72*R),O=Math.round(.55*R),W=Math.max(2,Math.round(.12*R)),E=_jsxs(Pressable,{ref:r,onPress:e=>{if(a)return;const r=resolveHaptic(x,"selection");r&&triggerHaptic(r),j(!k),S.onPressOut?.(e)},disabled:a,accessibilityRole:"checkbox",accessibilityLabel:F,accessibilityHint:S.accessibilityHint??fieldTextAsString(l),accessibilityState:{checked:i?"mixed":k,disabled:a},"aria-checked":i?"mixed":k,"aria-disabled":a,testID:w,hitSlop:6,...S,style:({pressed:e})=>[T.row,hasChoiceDetail(l,c)?T.rowTop:null,hasFieldText(d)?T.rowShrink:null,{opacity:a?.55:e?.85:1},y,b],children:[_jsx(View,{style:[T.box,{width:R,height:R,borderWidth:_,borderRadius:v.radius.sm,...smoothCorners,borderColor:H,backgroundColor:P},f],children:_jsx(Animated.View,{style:[T.glyphWrap,{opacity:D,transform:[{scale:M}]}],children:i?_jsx(View,{style:[{width:O,height:W,borderRadius:v.radius.pill,...smoothCorners,backgroundColor:z},g]}):_jsx(Svg,{width:B,height:B,viewBox:"0 0 24 24",children:_jsx(Path,{d:"M5 12.5l4.5 4.5L19 7.5",stroke:z,strokeWidth:3,strokeLinecap:"round",strokeLinejoin:"round",fill:"none"})})})}),_jsx(ChoiceText,{label:n,description:l,error:c,disabled:a,labelLines:h||void 0,descriptionLines:h||void 0,style:{marginLeft:L},labelStyle:C})]});return hasFieldText(d)?_jsxs(View,{style:[T.helpRow,hasChoiceDetail(l,c)?T.rowTop:null],children:[E,_jsx(View,{style:[T.help,{marginLeft:v.space.xs}],children:d})]}):E});Checkbox.displayName="Checkbox";const buildStyles=e=>StyleSheet.create({row:{flexDirection:"row",alignItems:"center"},rowTop:{alignItems:"flex-start"},rowShrink:{flexShrink:1},helpRow:{flexDirection:"row",alignItems:"center"},help:{flexShrink:0},box:{alignItems:"center",justifyContent:"center"},glyphWrap:{alignItems:"center",justifyContent:"center"}});export{Checkbox};export default Checkbox;
1
+ "use strict";import{forwardRef,useEffect,useMemo,useRef}from"react";import{Animated,Pressable,StyleSheet,View}from"react-native";import Svg,{Path}from"react-native-svg";import{useControllableState}from"../../hooks/index.js";import{createAnimatedValue,resolveCheckboxSize,spaceOf,useTheme}from"../../theme/index.js";import{smoothCorners}from"../../utils/corners.js";import{resolveHaptic,triggerHaptic}from"../../utils/hapticUtils.js";import{hitSlopMarker}from"../../utils/hitSlop.js";import{ChoiceText,hasChoiceDetail}from"../FieldBase/ChoiceText.js";import{fieldTextAsString,hasFieldText}from"../FieldBase/FieldBase.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const toneColor=(e,r)=>{switch(r){case"success":return e.colors.success;case"warning":return e.colors.warning;case"danger":return e.colors.danger;default:return e.colors.primary}},toneOnColor=(e,r)=>{switch(r){case"success":return e.colors["on-success"];case"warning":return e.colors["on-warning"];case"danger":return e.colors["on-danger"];default:return e.colors["on-primary"]}},Checkbox=forwardRef((e,r)=>{const{checked:t,defaultChecked:s,onChange:o,indeterminate:i=!1,disabled:a=!1,label:l,description:n,error:c,help:d,labelLines:h,size:p="md",tone:u="primary",accessibilityLabel:m,haptic:x,style:b,boxStyle:f,indeterminateBarStyle:g,containerStyle:y,labelStyle:C,testID:S,hitSlop:w,...k}=e,[j,v]=useControllableState({value:t,defaultValue:s??!1,onChange:o}),T=useTheme(),R=useMemo(()=>buildStyles(T),[T]),{"box-size":_}=useMemo(()=>resolveCheckboxSize(T,p),[T,p]),L=T.size.border,M=spaceOf(T,T.components.checkbox["label-gap"]),V=toneColor(T,u),A=w??6,D=j||i,F=useRef(createAnimatedValue(D?1:0)).current;useEffect(()=>{const e=Animated.spring(F,{toValue:D?1:0,damping:T.motion.spring.snappy.damping,stiffness:T.motion.spring.snappy.stiffness,mass:T.motion.spring.snappy.mass,useNativeDriver:!0});return e.start(),()=>e.stop()},[D,F,T.motion.spring.snappy]);const I=F.interpolate({inputRange:[0,1],outputRange:[0,1]}),H=m??fieldTextAsString(l),P=!0===c||hasFieldText(c),z=D?V:a?T.colors.border:P?T.colors["field-border-error"]:T.colors.border,B=D?V:a?T.colors["surface-disabled"]:"transparent",O=a&&!D?T.colors["text-disabled"]:toneOnColor(T,u),W=Math.round(.72*_),E=Math.round(.55*_),N=Math.max(2,Math.round(.12*_)),U=_jsxs(Pressable,{ref:r,onPress:e=>{if(a)return;const r=resolveHaptic(x,"selection");r&&triggerHaptic(r),v(!j),k.onPressOut?.(e)},disabled:a,accessibilityRole:"checkbox",accessibilityLabel:H,accessibilityHint:k.accessibilityHint??fieldTextAsString(n),accessibilityState:{checked:i?"mixed":j,disabled:a},"aria-checked":i?"mixed":j,"aria-disabled":a,testID:S,hitSlop:A,...hitSlopMarker(A),...k,style:({pressed:e})=>[R.row,hasChoiceDetail(n,c)?R.rowTop:null,hasFieldText(d)?R.rowShrink:null,{opacity:a?.55:e?.85:1},y,b],children:[_jsx(View,{style:[R.box,{width:_,height:_,borderWidth:L,borderRadius:T.radius.sm,...smoothCorners,borderColor:z,backgroundColor:B},f],children:_jsx(Animated.View,{style:[R.glyphWrap,{opacity:F,transform:[{scale:I}]}],children:i?_jsx(View,{style:[{width:E,height:N,borderRadius:T.radius.pill,...smoothCorners,backgroundColor:O},g]}):_jsx(Svg,{width:W,height:W,viewBox:"0 0 24 24",children:_jsx(Path,{d:"M5 12.5l4.5 4.5L19 7.5",stroke:O,strokeWidth:3,strokeLinecap:"round",strokeLinejoin:"round",fill:"none"})})})}),_jsx(ChoiceText,{label:l,description:n,error:c,disabled:a,labelLines:h||void 0,descriptionLines:h||void 0,style:{marginLeft:M},labelStyle:C})]});return hasFieldText(d)?_jsxs(View,{style:[R.helpRow,hasChoiceDetail(n,c)?R.rowTop:null],children:[U,_jsx(View,{style:[R.help,{marginLeft:T.space.xs}],children:d})]}):U});Checkbox.displayName="Checkbox";const buildStyles=e=>StyleSheet.create({row:{flexDirection:"row",alignItems:"center"},rowTop:{alignItems:"flex-start"},rowShrink:{flexShrink:1},helpRow:{flexDirection:"row",alignItems:"center"},help:{flexShrink:0},box:{alignItems:"center",justifyContent:"center"},glyphWrap:{alignItems:"center",justifyContent:"center"}});export{Checkbox};export default Checkbox;
@@ -1 +1 @@
1
- "use strict";import{forwardRef,useMemo}from"react";import{Animated,Pressable,StyleSheet,Text,View}from"react-native";import{usePressAnimation}from"../../hooks/usePressAnimation.js";import{fontFor,resolveChipSize,useTheme}from"../../theme/index.js";import{tintOf}from"../../utils/color.js";import{smoothCorners}from"../../utils/corners.js";import{resolveHaptic,triggerHaptic}from"../../utils/hapticUtils.js";import{renderSlotIcon}from"../AppIcon/slotIcon.js";import{Skeleton}from"../Skeleton/index.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const toneFor=(e,r)=>{switch(r){case"primary":return{base:e.colors["primary-soft"],on:e.colors.primary,ink:e.colors["primary-text"],border:e.colors.primary,selectedBg:e.colors["primary-soft"],selectedOn:e.colors.primary,selectedInk:e.colors["primary-text"],selectedBorder:e.colors.primary};case"success":return{base:e.colors["bg-muted"],on:e.colors.success,ink:e.colors["success-text"],border:e.colors.success,selectedBg:e.colors["primary-soft"],selectedOn:e.colors.primary,selectedInk:e.colors["primary-text"],selectedBorder:e.colors.primary};case"warning":return{base:e.colors["bg-muted"],on:e.colors.warning,ink:e.colors["warning-text"],border:e.colors.warning,selectedBg:e.colors["primary-soft"],selectedOn:e.colors.primary,selectedInk:e.colors["primary-text"],selectedBorder:e.colors.primary};case"danger":return{base:e.colors["bg-muted"],on:e.colors.danger,ink:e.colors["danger-text"],border:e.colors.danger,selectedBg:e.colors["primary-soft"],selectedOn:e.colors.primary,selectedInk:e.colors["primary-text"],selectedBorder:e.colors.primary};case"info":return{base:e.colors["bg-muted"],on:e.colors.info,ink:e.colors["info-text"],border:e.colors.info,selectedBg:e.colors["primary-soft"],selectedOn:e.colors.primary,selectedInk:e.colors["primary-text"],selectedBorder:e.colors.primary};default:return{base:e.colors["bg-muted"],on:e.colors["text-body"],ink:e.colors["text-body"],border:e.colors.border,selectedBg:e.colors["primary-soft"],selectedOn:e.colors.primary,selectedInk:e.colors["primary-text"],selectedBorder:e.colors.primary}}},SOFT_FILL_OPACITY=.14,SOFT_SELECTED_FILL_OPACITY=.24,hasChipCount=e=>null!=e&&""!==e,Chip=forwardRef((e,r)=>{const{label:s,count:o,selected:t=!1,selectionMode:l="single",onPress:i,onClose:n,leftIcon:c,iconVariant:a,variant:d="filled",tone:p="neutral",size:m="md",disabled:u=!1,loading:b=!1,accessibilityLabel:h,haptic:y,style:f,textStyle:g,containerStyle:x,countStyle:S,closeButtonStyle:C,closeIconStyle:k,testID:I}=e,j=useTheme(),w=!!i&&!u,_="radio"===l,z=!!i&&(!u||_),O=hasChipCount(o),{style:v,pressIn:B,pressOut:L}=usePressAnimation({enabled:w}),P=useMemo(()=>toneFor(j,p),[j,p]),T=useMemo(()=>resolveChipSize(j,m),[j,m]),F=Math.max(0,Math.ceil((44-T["min-height"])/2)),M=_?{top:F,bottom:F}:void 0,R="filled"===d,A="soft"===d,H=(()=>{if(A){const e=t?P.selectedOn:P.on;return tintOf(e,t?.24:.14,t?P.selectedBg:P.base)}return t?R?P.selectedBg:"transparent":R?P.base:"transparent"})(),V=A?"transparent":t?P.selectedBorder:R?"transparent":P.border,D=u?j.colors["text-disabled"]:t?A?j.colors["text-body"]:P.selectedInk:P.ink,E=R||A?0:j.size.border,handlePress=()=>{if(!w)return;const e=resolveHaptic(y,"selection");e&&triggerHaptic(e),i?.()},$=h??(O?`${s}, ${o}`:s),N=_jsxs(View,{style:styles.row,children:[c?_jsx(View,{style:{marginRight:T.gap},children:renderSlotIcon(c,{color:D,size:T.icon,disabled:u},a)}):null,_jsx(Text,{style:[styles.label,{color:D,fontSize:T.text,...fontFor(j,"medium")},g],numberOfLines:1,children:s??" "}),O?_jsx(Text,{style:[styles.count,{color:D,fontSize:Math.min(j.text.xs.size,T.text),marginLeft:j.space.xs,...fontFor(j,"normal")},S],numberOfLines:1,children:o}):null,n?_jsx(Pressable,{onPress:()=>{u||(!1!==y&&triggerHaptic("impactLight"),n?.())},disabled:u,accessibilityRole:"button",accessibilityLabel:`Remove ${s}`,accessibilityState:{disabled:u},"aria-disabled":u,hitSlop:6,style:({pressed:e})=>[styles.close,{width:T["close-size"],height:T["close-size"],borderRadius:T["close-size"]/2,...smoothCorners,marginLeft:T.gap,backgroundColor:e?j.colors["surface-pressed"]:j.colors["surface-hover"]},C],children:_jsx(Text,{style:[{color:D,fontSize:T["close-text"],...fontFor(j,"bold"),lineHeight:T["close-text"]+2},k],maxFontSizeMultiplier:1,children:"×"})}):null]}),Y={paddingHorizontal:T["padding-x"],paddingVertical:T["padding-y"],minHeight:T["min-height"],borderRadius:j.radius.pill,...smoothCorners,overflow:"hidden",backgroundColor:H,borderWidth:E,borderColor:V,opacity:u?.55:1};let U;return U=z?_jsx(Animated.View,{style:[v,{alignSelf:"flex-start",borderRadius:j.radius.pill,...smoothCorners,overflow:"hidden"}],children:_jsx(Pressable,{ref:r,onPress:handlePress,onPressIn:B,onPressOut:L,disabled:!w,accessibilityRole:_?"radio":"multiple"===l?"checkbox":"button",accessibilityLabel:$,accessibilityState:_||"multiple"===l?{checked:t,disabled:u}:{selected:t,disabled:u},"aria-checked":_||"multiple"===l?t:void 0,"aria-selected":_||"multiple"===l?void 0:t,"aria-disabled":u,hitSlop:M,android_ripple:{color:j.colors["surface-pressed"],borderless:!1},testID:I,style:({pressed:e})=>[styles.base,Y,e&&"outlined"===d?{backgroundColor:j.colors["surface-pressed"]}:null,x,f],children:N})}):_jsx(View,{ref:r,style:[styles.base,Y,x,f],accessible:!0,accessibilityRole:"text",accessibilityLabel:$,accessibilityState:{selected:t,disabled:u},"aria-selected":t,"aria-disabled":u,testID:I,children:N}),b?_jsx(ChipSkeleton,{...e}):U});Chip.displayName="Chip";const ChipSkeleton=({label:e,count:r,size:s="md",leftIcon:o,onClose:t,style:l,containerStyle:i})=>{const n=useTheme(),c=resolveChipSize(n,s),a=Math.max(40,Math.min(120,7*(e??"").length)),d=c["min-height"],p=d/2,m=a+2*c["padding-x"]+(hasChipCount(r)?c.gap/2+7*String(r).length:0)+(void 0!==o?c.gap+14:0)+(void 0!==t?c.gap+c["close-size"]:0);return _jsx(Skeleton,{width:m,height:d,radius:p,style:[{alignSelf:"flex-start"},i,l]})};ChipSkeleton.displayName="ChipSkeleton",Chip.Skeleton=ChipSkeleton;const styles=StyleSheet.create({base:{alignSelf:"flex-start",flexDirection:"row",alignItems:"center",justifyContent:"center"},row:{flexDirection:"row",alignItems:"center"},label:{flexShrink:1,textAlign:"center"},count:{flexShrink:0,fontVariant:["tabular-nums"]},close:{alignItems:"center",justifyContent:"center"}});export{Chip};export default Chip;
1
+ "use strict";import{forwardRef,useMemo}from"react";import{Animated,Pressable,StyleSheet,Text,View}from"react-native";import{usePressAnimation}from"../../hooks/usePressAnimation.js";import{fontFor,resolveChipSize,useTheme}from"../../theme/index.js";import{tintOf}from"../../utils/color.js";import{smoothCorners}from"../../utils/corners.js";import{resolveHaptic,triggerHaptic}from"../../utils/hapticUtils.js";import{hitSlopMarker}from"../../utils/hitSlop.js";import{renderSlotIcon}from"../AppIcon/slotIcon.js";import{Skeleton}from"../Skeleton/index.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const toneFor=(e,r)=>{switch(r){case"primary":return{base:e.colors["primary-soft"],on:e.colors.primary,ink:e.colors["primary-text"],border:e.colors.primary,selectedBg:e.colors["primary-soft"],selectedOn:e.colors.primary,selectedInk:e.colors["primary-text"],selectedBorder:e.colors.primary};case"success":return{base:e.colors["bg-muted"],on:e.colors.success,ink:e.colors["success-text"],border:e.colors.success,selectedBg:e.colors["primary-soft"],selectedOn:e.colors.primary,selectedInk:e.colors["primary-text"],selectedBorder:e.colors.primary};case"warning":return{base:e.colors["bg-muted"],on:e.colors.warning,ink:e.colors["warning-text"],border:e.colors.warning,selectedBg:e.colors["primary-soft"],selectedOn:e.colors.primary,selectedInk:e.colors["primary-text"],selectedBorder:e.colors.primary};case"danger":return{base:e.colors["bg-muted"],on:e.colors.danger,ink:e.colors["danger-text"],border:e.colors.danger,selectedBg:e.colors["primary-soft"],selectedOn:e.colors.primary,selectedInk:e.colors["primary-text"],selectedBorder:e.colors.primary};case"info":return{base:e.colors["bg-muted"],on:e.colors.info,ink:e.colors["info-text"],border:e.colors.info,selectedBg:e.colors["primary-soft"],selectedOn:e.colors.primary,selectedInk:e.colors["primary-text"],selectedBorder:e.colors.primary};default:return{base:e.colors["bg-muted"],on:e.colors["text-body"],ink:e.colors["text-body"],border:e.colors.border,selectedBg:e.colors["primary-soft"],selectedOn:e.colors.primary,selectedInk:e.colors["primary-text"],selectedBorder:e.colors.primary}}},SOFT_FILL_OPACITY=.14,SOFT_SELECTED_FILL_OPACITY=.24,hasChipCount=e=>null!=e&&""!==e,Chip=forwardRef((e,r)=>{const{label:s,count:o,selected:t=!1,selectionMode:l="single",onPress:i,onClose:n,leftIcon:c,iconVariant:a,variant:d="filled",tone:p="neutral",size:m="md",disabled:u=!1,loading:h=!1,accessibilityLabel:b,haptic:y,style:f,textStyle:g,containerStyle:x,countStyle:S,closeButtonStyle:k,closeIconStyle:C,testID:j}=e,I=useTheme(),w=!!i&&!u,_="radio"===l,z=!!i&&(!u||_),O=hasChipCount(o),{style:v,pressIn:B,pressOut:L}=usePressAnimation({enabled:w}),M=useMemo(()=>toneFor(I,p),[I,p]),P=useMemo(()=>resolveChipSize(I,m),[I,m]),T=Math.max(0,Math.ceil((44-P["min-height"])/2)),F=_?{top:T,bottom:T}:void 0,R="filled"===d,A="soft"===d,H=(()=>{if(A){const e=t?M.selectedOn:M.on;return tintOf(e,t?.24:.14,t?M.selectedBg:M.base)}return t?R?M.selectedBg:"transparent":R?M.base:"transparent"})(),V=A?"transparent":t?M.selectedBorder:R?"transparent":M.border,D=u?I.colors["text-disabled"]:t?A?I.colors["text-body"]:M.selectedInk:M.ink,E=R||A?0:I.size.border,handlePress=()=>{if(!w)return;const e=resolveHaptic(y,"selection");e&&triggerHaptic(e),i?.()},$=b??(O?`${s}, ${o}`:s),N=_jsxs(View,{style:styles.row,children:[c?_jsx(View,{style:{marginRight:P.gap},children:renderSlotIcon(c,{color:D,size:P.icon,disabled:u},a)}):null,_jsx(Text,{style:[styles.label,{color:D,fontSize:P.text,...fontFor(I,"medium")},g],numberOfLines:1,children:s??" "}),O?_jsx(Text,{style:[styles.count,{color:D,fontSize:Math.min(I.text.xs.size,P.text),marginLeft:I.space.xs,...fontFor(I,"normal")},S],numberOfLines:1,children:o}):null,n?_jsx(Pressable,{onPress:()=>{u||(!1!==y&&triggerHaptic("impactLight"),n?.())},disabled:u,accessibilityRole:"button",accessibilityLabel:`Remove ${s}`,accessibilityState:{disabled:u},"aria-disabled":u,hitSlop:6,...hitSlopMarker(6),style:({pressed:e})=>[styles.close,{width:P["close-size"],height:P["close-size"],borderRadius:P["close-size"]/2,...smoothCorners,marginLeft:P.gap,backgroundColor:e?I.colors["surface-pressed"]:I.colors["surface-hover"]},k],children:_jsx(Text,{style:[{color:D,fontSize:P["close-text"],...fontFor(I,"bold"),lineHeight:P["close-text"]+2},C],maxFontSizeMultiplier:1,children:"×"})}):null]}),Y={paddingHorizontal:P["padding-x"],paddingVertical:P["padding-y"],minHeight:P["min-height"],borderRadius:I.radius.pill,...smoothCorners,overflow:"hidden",backgroundColor:H,borderWidth:E,borderColor:V,opacity:u?.55:1};let U;return U=z?_jsx(Animated.View,{style:[v,{alignSelf:"flex-start",borderRadius:I.radius.pill,...smoothCorners,overflow:"hidden"}],children:_jsx(Pressable,{ref:r,onPress:handlePress,onPressIn:B,onPressOut:L,disabled:!w,accessibilityRole:_?"radio":"multiple"===l?"checkbox":"button",accessibilityLabel:$,accessibilityState:_||"multiple"===l?{checked:t,disabled:u}:{selected:t,disabled:u},"aria-checked":_||"multiple"===l?t:void 0,"aria-selected":_||"multiple"===l?void 0:t,"aria-disabled":u,hitSlop:F,...F?hitSlopMarker(F):{},android_ripple:{color:I.colors["surface-pressed"],borderless:!1},testID:j,style:({pressed:e})=>[styles.base,Y,e&&"outlined"===d?{backgroundColor:I.colors["surface-pressed"]}:null,x,f],children:N})}):_jsx(View,{ref:r,style:[styles.base,Y,x,f],accessible:!0,accessibilityRole:"text",accessibilityLabel:$,accessibilityState:{selected:t,disabled:u},"aria-selected":t,"aria-disabled":u,testID:j,children:N}),h?_jsx(ChipSkeleton,{...e}):U});Chip.displayName="Chip";const ChipSkeleton=({label:e,count:r,size:s="md",leftIcon:o,onClose:t,style:l,containerStyle:i})=>{const n=useTheme(),c=resolveChipSize(n,s),a=Math.max(40,Math.min(120,7*(e??"").length)),d=c["min-height"],p=d/2,m=a+2*c["padding-x"]+(hasChipCount(r)?c.gap/2+7*String(r).length:0)+(void 0!==o?c.gap+14:0)+(void 0!==t?c.gap+c["close-size"]:0);return _jsx(Skeleton,{width:m,height:d,radius:p,style:[{alignSelf:"flex-start"},i,l]})};ChipSkeleton.displayName="ChipSkeleton",Chip.Skeleton=ChipSkeleton;const styles=StyleSheet.create({base:{alignSelf:"flex-start",flexDirection:"row",alignItems:"center",justifyContent:"center"},row:{flexDirection:"row",alignItems:"center"},label:{flexShrink:1,textAlign:"center"},count:{flexShrink:0,fontVariant:["tabular-nums"]},close:{alignItems:"center",justifyContent:"center"}});export{Chip};export default Chip;
@@ -1 +1 @@
1
- "use strict";import{useCallback,useEffect,useMemo,useRef,useState}from"react";import{AccessibilityInfo,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{resolveHaptic,triggerHaptic}from"../../utils/index.js";import{transparentOf}from"../../utils/color.js";import{smoothCorners}from"../../utils/corners.js";import{defaultIcons}from"../AppIcon/defaultIcons.js";import{ModalSafeArea,useModalInsets}from"../ModalSafeArea/ModalSafeArea.js";import{PickerTrigger}from"../PickerTrigger/index.js";import{ToastHost}from"../Toast/ToastProvider.js";import{jsx as _jsx,jsxs as _jsxs,Fragment as _Fragment}from"react/jsx-runtime";const NAV_BUTTON_SIZE=36,AnimatedGestureRoot=Animated.createAnimatedComponent(GestureHandlerRootView),GRID_SIZE=12,DECADE_SPAN=10,startOfDay=e=>new Date(e.getFullYear(),e.getMonth(),e.getDate()),isSameDay=(e,t)=>e.getFullYear()===t.getFullYear()&&e.getMonth()===t.getMonth()&&e.getDate()===t.getDate(),toIso=e=>`${e.getFullYear()}-${String(e.getMonth()+1).padStart(2,"0")}-${String(e.getDate()).padStart(2,"0")}`,addMonths=(e,t)=>new Date(e.getFullYear(),e.getMonth()+t,1),buildMonthMatrix=(e,t)=>{const a=e.getFullYear(),r=e.getMonth(),s=(new Date(a,r,1).getDay()-t+7)%7,i=[];for(let e=0;e<42;e+=1){const t=new Date(a,r,1-s+e);i.push({date:t,inMonth:t.getMonth()===r,iso:toIso(t)})}return i},weekdayLabels=(e,t)=>{const a=new Intl.DateTimeFormat(e,{weekday:"short"}),r=[];for(let e=0;e<7;e+=1){const s=new Date(1970,0,4+(t+e)%7);r.push(a.format(s))}return r},formatMonthYear=(e,t)=>new Intl.DateTimeFormat(t,{month:"long",year:"numeric"}).format(e),decadeStartFor=e=>10*Math.floor(e/10),buildYearCells=e=>{const t=e-4;return Array.from({length:12},(e,a)=>t+a)},buildDecadeCells=e=>{const t=decadeStartFor(e)-40;return Array.from({length:12},(e,a)=>t+10*a)},DatePicker=e=>{const{value:t,onChange:a,onClose:r,minDate:s,maxDate:i,disabledDates:o,mode:n="modal",locale:l="en-IN",weekStartsOn:c=0,title:d="Select Date",confirmLabel:u="Confirm",cancelLabel:m="Cancel",style:g,containerStyle:y,headerLabelStyle:h,navButtonStyle:b,footerButtonStyle:p,haptic:f,testID:x,label:w,placeholder:D,helperText:v,error:C,required:j,disabled:A,size:S,variant:V,clearable:T,onClear:_,formatValue:R,triggerStyle:M}=e,k=void 0!==e.visible,[I,P]=useState(!1),F=k?e.visible:I,N=k?x:x?`${x}-calendar`:void 0,Y=useTheme(),L=usePresenceMotion(),[z,B]=useModalInsets(),$=useMemo(()=>buildStyles(Y),[Y]),[E,H]=useState(()=>startOfDay(new Date));useEffect(()=>{F&&H(startOfDay(new Date))},[F]);const O=t?startOfDay(t):E,[W,G]=useState(O),[q,X]=useState(t?startOfDay(t):null),[Z,U]=useState("days"),J=useRef(createAnimatedValue(0)).current,K=useRef(createAnimatedValue(0)).current,Q=useRef(createAnimatedValue(0)).current,ee=useRef(0),te=useRef(createAnimatedValue(0)).current,ae=useRef(createAnimatedValue(1)).current,re=useRef(createAnimatedValue(1)).current,se=useRef(createAnimatedValue(1)).current,ie=useRef(createAnimatedValue(1)).current,oe=useRef(createAnimatedValue(1)).current;useEffect(()=>{if(t){const e=startOfDay(t);X(e),G(e)}else X(null)},[t]);const ne=useMemo(()=>{const e=new Set;return o?.forEach(t=>e.add(toIso(startOfDay(t)))),e},[o]),le=useMemo(()=>s?startOfDay(s):null,[s]),ce=useMemo(()=>i?startOfDay(i):null,[i]),de=useCallback(e=>!!(le&&e.getTime()<le.getTime())||(!!(ce&&e.getTime()>ce.getTime())||!!ne.has(toIso(e))),[le,ce,ne]),ue=useMemo(()=>buildMonthMatrix(W,c),[W,c]),me=useMemo(()=>buildYearCells(W.getFullYear()),[W]),ge=useMemo(()=>buildDecadeCells(W.getFullYear()),[W]),ye=useMemo(()=>weekdayLabels(l,c),[l,c]),he=useMemo(()=>new Intl.DateTimeFormat(l,{weekday:"long",year:"numeric",month:"long",day:"numeric"}),[l]),be=useMemo(()=>{if("days"===Z)return formatMonthYear(W,l);if("years"===Z){return`${me[0]} - ${me[me.length-1]}`}return`${ge[0]} - ${ge[ge.length-1]+9}`},[W,ge,l,Z,me]),pe=useCallback(e=>!!(le&&e<le.getFullYear())||!!(ce&&e>ce.getFullYear()),[le,ce]),fe=useCallback(e=>!!(le&&e+10-1<le.getFullYear())||!!(ce&&e>ce.getFullYear()),[le,ce]),xe=useCallback(e=>{!1!==f&&triggerHaptic("impactLight");const t=e>0?1:-1,a=Y.motion.duration.fast,r=Y.motion.duration.fast,[s]=L.range(32*-t,0),[i]=L.range(32*t,0),o=L.reduced?L.duration("fast"):a,n=L.reduced?L.duration("fast"):r;Animated.sequence([Animated.parallel([Animated.timing(te,{toValue:s,duration:a,easing:Easing.out(Easing.quad),useNativeDriver:!0}),Animated.timing(ae,{toValue:0,duration:o,useNativeDriver:!0})]),Animated.timing(te,{toValue:i,duration:0,useNativeDriver:!0}),Animated.parallel([Animated.timing(te,{toValue:0,duration:r,easing:Easing.out(Easing.cubic),useNativeDriver:!0}),Animated.timing(ae,{toValue:1,duration:n,useNativeDriver:!0})])]).start();const c=addMonths(W,e);G(c),AccessibilityInfo.announceForAccessibility(formatMonthYear(c,l))},[W,f,l,ae,te,L,Y.motion.duration.fast]),we=useCallback(()=>{"days"!==Z?(!1!==f&&triggerHaptic("impactLight"),G("years"===Z?e=>new Date(e.getFullYear()-12,e.getMonth(),1):e=>new Date(e.getFullYear()-120,e.getMonth(),1))):xe(-1)},[xe,Z,f]),De=useCallback(()=>{"days"!==Z?(!1!==f&&triggerHaptic("impactLight"),G("years"===Z?e=>new Date(e.getFullYear()+12,e.getMonth(),1):e=>new Date(e.getFullYear()+120,e.getMonth(),1))):xe(1)},[xe,Z,f]),ve=useCallback(()=>{const[e]=L.range(.9,1),t=L.reduced?L.duration("default"):Y.motion.duration.default;setNativeValue(se,0),setNativeValue(ie,e),Animated.parallel([Animated.timing(se,{toValue:1,duration:t,easing:Easing.out(Easing.cubic),useNativeDriver:!0}),Animated.timing(ie,{toValue:1,duration:t,easing:Easing.out(Easing.cubic),useNativeDriver:!0})]).start()},[se,ie,L,Y.motion.duration.default]),Ce=useCallback(()=>{const e=resolveHaptic(f,"selection");if(e&&triggerHaptic(e),!L.reduced){const e=80,t=100;Animated.sequence([Animated.timing(oe,{toValue:.96,duration:e,useNativeDriver:!0}),Animated.timing(oe,{toValue:1,duration:t,useNativeDriver:!0})]).start()}U(e=>"days"===e?"years":"years"===e?"decades":"years"),ve()},[ve,oe,f,L.reduced]),je=useCallback(e=>{const t=resolveHaptic(f,"selection");t&&triggerHaptic(t),G(t=>new Date(e,t.getMonth(),1)),U("days"),ve()},[ve,f]),Ae=useCallback(e=>{const t=resolveHaptic(f,"selection");t&&triggerHaptic(t),G(t=>new Date(e+4,t.getMonth(),1)),U("years"),ve()},[ve,f]),Se=useCallback(e=>{if(de(e.date))return;const t=resolveHaptic(f,"selection");t&&triggerHaptic(t),X(e.date),e.inMonth||G(new Date(e.date.getFullYear(),e.date.getMonth(),1)),L.reduced||(setNativeValue(re,.7),Animated.spring(re,{toValue:1,damping:Y.motion.spring.bouncy.damping,stiffness:Y.motion.spring.bouncy.stiffness,mass:Y.motion.spring.bouncy.mass,useNativeDriver:!0}).start())},[de,L.reduced,re,Y.motion.spring.bouncy,f]),Ve=useCallback(()=>{k||P(!1),r?.()},[k,r]),Te=useCallback(()=>{"modal"===n?Animated.parallel([Animated.timing(J,{toValue:0,duration:L.duration("default"),easing:Easing.bezier(...Y.motion.ease.accelerate),useNativeDriver:!1}),Animated.timing(K,{toValue:0,duration:L.duration("fast"),easing:Easing.bezier(...Y.motion.ease.accelerate),useNativeDriver:!0})]).start(()=>{Ve()}):Ve()},[J,n,Ve,L,K,Y.motion.ease.accelerate]),{handleGesture:Re,opacity:Me}=useDragToDismiss({drag:Q,travel:()=>ee.current||320,onDismiss:Te}),ke=useMemo(()=>Animated.multiply(K,Me),[K,Me]),Ie=useMemo(()=>J.interpolate({inputRange:[0,1],outputRange:[transparentOf(Y.colors.scrim),Y.colors.scrim]}),[J,Y.colors.scrim]);useEffect(()=>{if("modal"===n&&F){J.setValue(0),setNativeValue(K,0),setNativeValue(Q,0),setNativeValue(Me,1);const e=L.reduced?Animated.timing(K,{toValue:1,duration:L.duration("default"),useNativeDriver:!0}):Animated.spring(K,{toValue:1,damping:Y.motion.spring.gentle.damping,stiffness:Y.motion.spring.gentle.stiffness,mass:Y.motion.spring.gentle.mass,useNativeDriver:!0}),t=Animated.parallel([Animated.timing(J,{toValue:1,duration:L.duration("default"),easing:Easing.out(Easing.cubic),useNativeDriver:!1}),e]);return t.start(),()=>t.stop()}},[F,n,J,L,K,Q,Me,Y.motion]);const Pe=useCallback(()=>{!1!==f&&triggerHaptic("selection"),Te()},[Te,f]),Fe=useCallback(()=>{q&&(!1!==f&&triggerHaptic("notificationSuccess"),a?.(q),Te())},[Te,a,q,f]),Ne=K.interpolate({inputRange:[0,1],outputRange:L.range(320,0)}),Ye=_jsx(View,{style:$.titleRow,children:_jsx(Text,{style:$.title,accessibilityRole:"header",children:d})}),Le=_jsxs(View,{style:[$.card,g,y],accessibilityRole:"modal"===n?void 0:"none",accessible:!1,testID:N,children:["modal"===n?_jsx(GestureDetector,{gesture:Re,children:_jsxs(View,{style:$.grabArea,children:[_jsx(View,{style:$.handle}),Ye]})}):Ye,_jsxs(View,{style:$.headerRow,children:[_jsx(Pressable,{onPress:we,style:({pressed:e})=>[$.navBtn,e&&$.navBtnPressed,b],accessibilityRole:"button",accessibilityLabel:"days"===Z?"Previous month":"years"===Z?"Previous years":"Previous decades",hitSlop:8,children:_jsx(Text,{style:$.navText,children:"‹"})}),_jsx(Pressable,{onPress:Ce,style:[$.headerLabelWrap,h],accessibilityRole:"button",accessibilityLabel:"days"===Z?`${be}, switch to year selection`:"years"===Z?`${be}, switch to decade selection`:`${be}, switch to year selection`,hitSlop:8,children:_jsxs(Animated.View,{style:[$.headerLabelInner,{transform:[{scale:oe}],opacity:"days"===Z?ae:1}],children:[_jsx(Animated.Text,{style:[$.headerLabel,{transform:[{translateX:"days"===Z?te:0}]}],accessibilityLiveRegion:"polite",children:be}),_jsx(View,{style:$.headerCaret,children:(Y.settings.icons.chevronDown??defaultIcons.chevronDown)({size:Y.text.sm.size,color:Y.colors["text-muted"]})})]})}),_jsx(Pressable,{onPress:De,style:({pressed:e})=>[$.navBtn,e&&$.navBtnPressed,b],accessibilityRole:"button",accessibilityLabel:"days"===Z?"Next month":"years"===Z?"Next years":"Next decades",hitSlop:8,children:_jsx(Text,{style:$.navText,children:"›"})})]}),"days"===Z?_jsxs(_Fragment,{children:[_jsx(View,{style:$.weekdayRow,children:ye.map((e,t)=>_jsx(View,{style:$.weekdayCell,children:_jsx(Text,{style:$.weekdayText,children:e})},`${e}-${t}`))}),_jsx(Animated.View,{style:[$.grid,{opacity:ae,transform:[{translateX:te}]}],children:Array.from({length:6}).map((e,t)=>_jsx(View,{style:$.gridRow,children:ue.slice(7*t,7*t+7).map(e=>{const t=de(e.date),a=!!q&&isSameDay(e.date,q),r=isSameDay(e.date,E),s=a?Y.colors.primary:"transparent",i=r&&!a?Y.colors.primary:"transparent",o=a?Y.colors["on-primary"]:e.inMonth?t?Y.colors["text-disabled"]:Y.colors["text-body"]:Y.colors["text-subtle"],n=t?.3:e.inMonth?1:.4;return _jsx(Pressable,{disabled:t,onPress:()=>Se(e),accessibilityRole:"button",accessibilityLabel:he.format(e.date),accessibilityState:{selected:a,disabled:t},"aria-selected":a,"aria-disabled":t,style:$.dayCell,children:_jsx(Animated.View,{style:[$.dayInner,{backgroundColor:s,borderColor:i,borderWidth:r&&!a?1.5:0,opacity:n},a?{transform:[{scale:re}]}:null],children:_jsx(Text,{style:[$.dayText,{color:o}],children:e.date.getDate()})})},e.iso)})},`r-${t}`))})]}):_jsx(Animated.View,"years"===Z?{style:[$.yearGrid,{opacity:se,transform:[{scale:ie}]}],children:Array.from({length:3}).map((e,t)=>_jsx(View,{style:$.gridRow,children:me.slice(4*t,4*t+4).map(e=>{const t=pe(e),a=!!q&&q.getFullYear()===e,r=E.getFullYear()===e,s=a?Y.colors.primary:"transparent",i=r&&!a?Y.colors.primary:"transparent",o=a?Y.colors["on-primary"]:t?Y.colors["text-disabled"]:Y.colors["text-body"],n=t?.3:1;return _jsx(Pressable,{disabled:t,onPress:()=>je(e),accessibilityRole:"button",accessibilityLabel:`Year ${e}`,accessibilityState:{selected:a,disabled:t},"aria-selected":a,"aria-disabled":t,style:$.yearCell,children:_jsx(View,{style:[$.yearInner,{backgroundColor:s,borderColor:i,borderWidth:r&&!a?1.5:0,opacity:n}],children:_jsx(Text,{style:[$.yearText,{color:o}],children:e})})},`year-${e}`)})},`yr-${t}`))}:{style:[$.yearGrid,{opacity:se,transform:[{scale:ie}]}],children:Array.from({length:3}).map((e,t)=>_jsx(View,{style:$.gridRow,children:ge.slice(4*t,4*t+4).map(e=>{const t=e+10-1,a=fe(e),r=!!q&&decadeStartFor(q.getFullYear())===e,s=decadeStartFor(E.getFullYear())===e,i=r?Y.colors.primary:"transparent",o=s&&!r?Y.colors.primary:"transparent",n=r?Y.colors["on-primary"]:a?Y.colors["text-disabled"]:Y.colors["text-body"],l=a?.3:1;return _jsx(Pressable,{disabled:a,onPress:()=>Ae(e),accessibilityRole:"button",accessibilityLabel:`Decade ${e} to ${t}`,accessibilityState:{selected:r,disabled:a},"aria-selected":r,"aria-disabled":a,style:$.yearCell,children:_jsxs(View,{style:[$.yearInner,{backgroundColor:i,borderColor:o,borderWidth:s&&!r?1.5:0,opacity:l}],children:[_jsx(Text,{style:[$.yearText,{color:n}],children:`${e}s`}),_jsx(Text,{style:[$.decadeRangeText,{color:r?Y.colors["on-primary"]:Y.colors["text-subtle"]}],children:`${e}-${t}`})]})},`decade-${e}`)})},`dec-${t}`))}),_jsxs(View,{style:$.footer,children:[_jsx(Pressable,{onPress:Pe,style:({pressed:e})=>[$.footerBtn,$.footerCancel,e&&$.footerBtnPressed,p],accessibilityRole:"button",accessibilityLabel:m,children:_jsx(Text,{style:[$.footerBtnText,{color:Y.colors["text-muted"]}],children:m})}),_jsx(Pressable,{onPress:Fe,disabled:!q,style:({pressed:e})=>[$.footerBtn,$.footerConfirm,{backgroundColor:Y.colors.primary,opacity:q?1:.5},e&&{backgroundColor:Y.colors["primary-hover"]},p],accessibilityRole:"button",accessibilityLabel:u,accessibilityState:{disabled:!q},"aria-disabled":!q,children:_jsx(Text,{style:[$.footerBtnText,{color:Y.colors["on-primary"]}],children:u})})]})]}),ze=t?(R??(e=>e.toLocaleDateString()))(t):void 0,Be=!k;if("inline"===n)return F||Be?Be?_jsxs(_Fragment,{children:[_jsx(PickerTrigger,{label:w,value:ze,placeholder:D,helperText:v,error:C,required:j,disabled:A,size:S,variant:V,clearable:T,onClear:_,onPress:()=>P(!0),triggerStyle:M,testID:x}),F?Le:null]}):Le:null;const $e=_jsx(Modal,{visible:F,transparent:!0,statusBarTranslucent:!0,navigationBarTranslucent:!0,animationType:"none",onRequestClose:Te,children:_jsx(ModalSafeArea,{onInsets:B,children:_jsxs(AnimatedGestureRoot,{collapsable:!1,style:[$.backdrop,{backgroundColor:Ie}],children:[_jsx(Pressable,{style:StyleSheet.absoluteFill,onPress:Te,accessibilityLabel:"Dismiss"}),_jsx(Animated.View,{style:[$.sheetWrap,{paddingBottom:Math.max(z.bottom,Y.space.lg),opacity:ke,transform:[{translateY:Animated.add(Ne,Q)}]}],onLayout:e=>{ee.current=e.nativeEvent.layout.height},accessibilityViewIsModal:!0,accessibilityRole:"none",children:Le}),_jsx(ToastHost,{})]})})});return Be?_jsxs(_Fragment,{children:[_jsx(PickerTrigger,{label:w,value:ze,placeholder:D,helperText:v,error:C,required:j,disabled:A,size:S,variant:V,clearable:T,onClear:_,onPress:()=>P(!0),triggerStyle:M,testID:x}),$e]}):$e},buildStyles=e=>{const t=e.shadow.popover;return StyleSheet.create({backdrop:{...StyleSheet.absoluteFill},sheetWrap:{position:"absolute",left:0,right:0,bottom:0,paddingHorizontal:e.space.md,paddingBottom:e.space.lg},card:{backgroundColor:e.colors.surface,borderRadius:e.radius.xl,...smoothCorners,padding:e.space.lg,shadowColor:t.shadowColor,shadowOffset:t.shadowOffset,shadowOpacity:t.shadowOpacity,shadowRadius:t.shadowRadius,elevation:t.elevation},grabArea:{marginTop:-e.space.lg,paddingTop:e.space.sm},handle:{alignSelf:"center",width:36,height:4,borderRadius:e.radius.pill,...smoothCorners,backgroundColor:e.colors["border-subtle"],marginBottom:e.space.sm},titleRow:{marginBottom:e.space.sm},title:{fontSize:e.text.lg.size,fontWeight:e.weight.semibold,color:e.colors["text-body"]},headerRow:{flexDirection:"row",alignItems:"center",justifyContent:"space-between",marginBottom:e.space.md},navBtn:{width:36,height:36,borderRadius:e.radius.pill,...smoothCorners,alignItems:"center",justifyContent:"center",backgroundColor:e.colors["bg-subtle"]},navBtnPressed:{backgroundColor:e.colors["surface-pressed"]},navText:{fontSize:e.text["2xl"].size,lineHeight:26,color:e.colors["text-body"],fontWeight:e.weight.semibold},headerLabelWrap:{flex:1,alignItems:"center"},headerLabelInner:{flexDirection:"row",alignItems:"center",justifyContent:"center"},headerLabel:{fontSize:e.text.base.size,fontWeight:e.weight.semibold,color:e.colors["text-body"]},headerCaret:{marginLeft:e.space.xs,alignItems:"center",justifyContent:"center"},weekdayRow:{flexDirection:"row",marginBottom:e.space.xs},weekdayCell:{flex:1,alignItems:"center",paddingVertical:e.space.xs},weekdayText:{fontSize:e.text.xs.size,fontWeight:e.weight.medium,color:e.colors["text-subtle"],letterSpacing:e["letter-spacing"].wide},grid:{},gridRow:{flexDirection:"row"},dayCell:{flex:1,aspectRatio:1,alignItems:"center",justifyContent:"center",padding:e.space.xxs},dayInner:{width:"100%",height:"100%",borderRadius:e.radius.pill,...smoothCorners,alignItems:"center",justifyContent:"center"},dayText:{fontSize:e.text.sm.size,fontWeight:e.weight.medium},yearGrid:{},yearCell:{flex:1,aspectRatio:1.6,alignItems:"center",justifyContent:"center",padding:e.space.xs},yearInner:{width:"100%",height:"100%",borderRadius:e.radius.lg,...smoothCorners,alignItems:"center",justifyContent:"center"},yearText:{fontSize:e.text.base.size,fontWeight:e.weight.semibold},decadeRangeText:{fontSize:e.text.xs.size,fontWeight:e.weight.medium,marginTop:e.space.xxs},footer:{flexDirection:"row",justifyContent:"flex-end",alignItems:"center",marginTop:e.space.lg,gap:e.space.sm},footerBtn:{paddingHorizontal:e.space.lg,paddingVertical:e.space.sm,borderRadius:e.radius.md,...smoothCorners,minHeight:40,alignItems:"center",justifyContent:"center"},footerCancel:{backgroundColor:"transparent"},footerConfirm:{},footerBtnPressed:{opacity:.85},footerBtnText:{fontSize:e.text.sm.size,fontWeight:e.weight.semibold}})};export{DatePicker};export default DatePicker;
1
+ "use strict";import{useCallback,useEffect,useMemo,useRef,useState}from"react";import{AccessibilityInfo,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{resolveHaptic,triggerHaptic}from"../../utils/index.js";import{transparentOf}from"../../utils/color.js";import{smoothCorners}from"../../utils/corners.js";import{hitSlopMarker}from"../../utils/hitSlop.js";import{defaultIcons}from"../AppIcon/defaultIcons.js";import{ModalSafeArea,useModalInsets}from"../ModalSafeArea/ModalSafeArea.js";import{PickerTrigger}from"../PickerTrigger/index.js";import{ToastHost}from"../Toast/ToastProvider.js";import{jsx as _jsx,jsxs as _jsxs,Fragment as _Fragment}from"react/jsx-runtime";const NAV_BUTTON_SIZE=36,AnimatedGestureRoot=Animated.createAnimatedComponent(GestureHandlerRootView),GRID_SIZE=12,DECADE_SPAN=10,startOfDay=e=>new Date(e.getFullYear(),e.getMonth(),e.getDate()),isSameDay=(e,t)=>e.getFullYear()===t.getFullYear()&&e.getMonth()===t.getMonth()&&e.getDate()===t.getDate(),toIso=e=>`${e.getFullYear()}-${String(e.getMonth()+1).padStart(2,"0")}-${String(e.getDate()).padStart(2,"0")}`,addMonths=(e,t)=>new Date(e.getFullYear(),e.getMonth()+t,1),buildMonthMatrix=(e,t)=>{const a=e.getFullYear(),r=e.getMonth(),s=(new Date(a,r,1).getDay()-t+7)%7,i=[];for(let e=0;e<42;e+=1){const t=new Date(a,r,1-s+e);i.push({date:t,inMonth:t.getMonth()===r,iso:toIso(t)})}return i},weekdayLabels=(e,t)=>{const a=new Intl.DateTimeFormat(e,{weekday:"short"}),r=[];for(let e=0;e<7;e+=1){const s=new Date(1970,0,4+(t+e)%7);r.push(a.format(s))}return r},formatMonthYear=(e,t)=>new Intl.DateTimeFormat(t,{month:"long",year:"numeric"}).format(e),decadeStartFor=e=>10*Math.floor(e/10),buildYearCells=e=>{const t=e-4;return Array.from({length:12},(e,a)=>t+a)},buildDecadeCells=e=>{const t=decadeStartFor(e)-40;return Array.from({length:12},(e,a)=>t+10*a)},DatePicker=e=>{const{value:t,onChange:a,onClose:r,minDate:s,maxDate:i,disabledDates:o,mode:n="modal",locale:l="en-IN",weekStartsOn:c=0,title:d="Select Date",confirmLabel:u="Confirm",cancelLabel:m="Cancel",style:g,containerStyle:y,headerLabelStyle:h,navButtonStyle:p,footerButtonStyle:b,haptic:f,testID:x,label:w,placeholder:D,helperText:v,error:C,required:j,disabled:S,size:A,variant:V,clearable:T,onClear:_,formatValue:M,triggerStyle:R}=e,k=void 0!==e.visible,[I,P]=useState(!1),F=k?e.visible:I,N=k?x:x?`${x}-calendar`:void 0,Y=useTheme(),L=usePresenceMotion(),[z,B]=useModalInsets(),$=useMemo(()=>buildStyles(Y),[Y]),[E,H]=useState(()=>startOfDay(new Date));useEffect(()=>{F&&H(startOfDay(new Date))},[F]);const O=t?startOfDay(t):E,[W,G]=useState(O),[q,X]=useState(t?startOfDay(t):null),[Z,U]=useState("days"),J=useRef(createAnimatedValue(0)).current,K=useRef(createAnimatedValue(0)).current,Q=useRef(createAnimatedValue(0)).current,ee=useRef(0),te=useRef(createAnimatedValue(0)).current,ae=useRef(createAnimatedValue(1)).current,re=useRef(createAnimatedValue(1)).current,se=useRef(createAnimatedValue(1)).current,ie=useRef(createAnimatedValue(1)).current,oe=useRef(createAnimatedValue(1)).current;useEffect(()=>{if(t){const e=startOfDay(t);X(e),G(e)}else X(null)},[t]);const ne=useMemo(()=>{const e=new Set;return o?.forEach(t=>e.add(toIso(startOfDay(t)))),e},[o]),le=useMemo(()=>s?startOfDay(s):null,[s]),ce=useMemo(()=>i?startOfDay(i):null,[i]),de=useCallback(e=>!!(le&&e.getTime()<le.getTime())||(!!(ce&&e.getTime()>ce.getTime())||!!ne.has(toIso(e))),[le,ce,ne]),ue=useMemo(()=>buildMonthMatrix(W,c),[W,c]),me=useMemo(()=>buildYearCells(W.getFullYear()),[W]),ge=useMemo(()=>buildDecadeCells(W.getFullYear()),[W]),ye=useMemo(()=>weekdayLabels(l,c),[l,c]),he=useMemo(()=>new Intl.DateTimeFormat(l,{weekday:"long",year:"numeric",month:"long",day:"numeric"}),[l]),pe=useMemo(()=>{if("days"===Z)return formatMonthYear(W,l);if("years"===Z){return`${me[0]} - ${me[me.length-1]}`}return`${ge[0]} - ${ge[ge.length-1]+9}`},[W,ge,l,Z,me]),be=useCallback(e=>!!(le&&e<le.getFullYear())||!!(ce&&e>ce.getFullYear()),[le,ce]),fe=useCallback(e=>!!(le&&e+10-1<le.getFullYear())||!!(ce&&e>ce.getFullYear()),[le,ce]),xe=useCallback(e=>{!1!==f&&triggerHaptic("impactLight");const t=e>0?1:-1,a=Y.motion.duration.fast,r=Y.motion.duration.fast,[s]=L.range(32*-t,0),[i]=L.range(32*t,0),o=L.reduced?L.duration("fast"):a,n=L.reduced?L.duration("fast"):r;Animated.sequence([Animated.parallel([Animated.timing(te,{toValue:s,duration:a,easing:Easing.out(Easing.quad),useNativeDriver:!0}),Animated.timing(ae,{toValue:0,duration:o,useNativeDriver:!0})]),Animated.timing(te,{toValue:i,duration:0,useNativeDriver:!0}),Animated.parallel([Animated.timing(te,{toValue:0,duration:r,easing:Easing.out(Easing.cubic),useNativeDriver:!0}),Animated.timing(ae,{toValue:1,duration:n,useNativeDriver:!0})])]).start();const c=addMonths(W,e);G(c),AccessibilityInfo.announceForAccessibility(formatMonthYear(c,l))},[W,f,l,ae,te,L,Y.motion.duration.fast]),we=useCallback(()=>{"days"!==Z?(!1!==f&&triggerHaptic("impactLight"),G("years"===Z?e=>new Date(e.getFullYear()-12,e.getMonth(),1):e=>new Date(e.getFullYear()-120,e.getMonth(),1))):xe(-1)},[xe,Z,f]),De=useCallback(()=>{"days"!==Z?(!1!==f&&triggerHaptic("impactLight"),G("years"===Z?e=>new Date(e.getFullYear()+12,e.getMonth(),1):e=>new Date(e.getFullYear()+120,e.getMonth(),1))):xe(1)},[xe,Z,f]),ve=useCallback(()=>{const[e]=L.range(.9,1),t=L.reduced?L.duration("default"):Y.motion.duration.default;setNativeValue(se,0),setNativeValue(ie,e),Animated.parallel([Animated.timing(se,{toValue:1,duration:t,easing:Easing.out(Easing.cubic),useNativeDriver:!0}),Animated.timing(ie,{toValue:1,duration:t,easing:Easing.out(Easing.cubic),useNativeDriver:!0})]).start()},[se,ie,L,Y.motion.duration.default]),Ce=useCallback(()=>{const e=resolveHaptic(f,"selection");if(e&&triggerHaptic(e),!L.reduced){const e=80,t=100;Animated.sequence([Animated.timing(oe,{toValue:.96,duration:e,useNativeDriver:!0}),Animated.timing(oe,{toValue:1,duration:t,useNativeDriver:!0})]).start()}U(e=>"days"===e?"years":"years"===e?"decades":"years"),ve()},[ve,oe,f,L.reduced]),je=useCallback(e=>{const t=resolveHaptic(f,"selection");t&&triggerHaptic(t),G(t=>new Date(e,t.getMonth(),1)),U("days"),ve()},[ve,f]),Se=useCallback(e=>{const t=resolveHaptic(f,"selection");t&&triggerHaptic(t),G(t=>new Date(e+4,t.getMonth(),1)),U("years"),ve()},[ve,f]),Ae=useCallback(e=>{if(de(e.date))return;const t=resolveHaptic(f,"selection");t&&triggerHaptic(t),X(e.date),e.inMonth||G(new Date(e.date.getFullYear(),e.date.getMonth(),1)),L.reduced||(setNativeValue(re,.7),Animated.spring(re,{toValue:1,damping:Y.motion.spring.bouncy.damping,stiffness:Y.motion.spring.bouncy.stiffness,mass:Y.motion.spring.bouncy.mass,useNativeDriver:!0}).start())},[de,L.reduced,re,Y.motion.spring.bouncy,f]),Ve=useCallback(()=>{k||P(!1),r?.()},[k,r]),Te=useCallback(()=>{"modal"===n?Animated.parallel([Animated.timing(J,{toValue:0,duration:L.duration("default"),easing:Easing.bezier(...Y.motion.ease.accelerate),useNativeDriver:!1}),Animated.timing(K,{toValue:0,duration:L.duration("fast"),easing:Easing.bezier(...Y.motion.ease.accelerate),useNativeDriver:!0})]).start(()=>{Ve()}):Ve()},[J,n,Ve,L,K,Y.motion.ease.accelerate]),{handleGesture:Me,opacity:Re}=useDragToDismiss({drag:Q,travel:()=>ee.current||320,onDismiss:Te}),ke=useMemo(()=>Animated.multiply(K,Re),[K,Re]),Ie=useMemo(()=>J.interpolate({inputRange:[0,1],outputRange:[transparentOf(Y.colors.scrim),Y.colors.scrim]}),[J,Y.colors.scrim]);useEffect(()=>{if("modal"===n&&F){J.setValue(0),setNativeValue(K,0),setNativeValue(Q,0),setNativeValue(Re,1);const e=L.reduced?Animated.timing(K,{toValue:1,duration:L.duration("default"),useNativeDriver:!0}):Animated.spring(K,{toValue:1,damping:Y.motion.spring.gentle.damping,stiffness:Y.motion.spring.gentle.stiffness,mass:Y.motion.spring.gentle.mass,useNativeDriver:!0}),t=Animated.parallel([Animated.timing(J,{toValue:1,duration:L.duration("default"),easing:Easing.out(Easing.cubic),useNativeDriver:!1}),e]);return t.start(),()=>t.stop()}},[F,n,J,L,K,Q,Re,Y.motion]);const Pe=useCallback(()=>{!1!==f&&triggerHaptic("selection"),Te()},[Te,f]),Fe=useCallback(()=>{q&&(!1!==f&&triggerHaptic("notificationSuccess"),a?.(q),Te())},[Te,a,q,f]),Ne=K.interpolate({inputRange:[0,1],outputRange:L.range(320,0)}),Ye=_jsx(View,{style:$.titleRow,children:_jsx(Text,{style:$.title,accessibilityRole:"header",children:d})}),Le=_jsxs(View,{style:[$.card,g,y],accessibilityRole:"modal"===n?void 0:"none",accessible:!1,testID:N,children:["modal"===n?_jsx(GestureDetector,{gesture:Me,children:_jsxs(View,{style:$.grabArea,children:[_jsx(View,{style:$.handle}),Ye]})}):Ye,_jsxs(View,{style:$.headerRow,children:[_jsx(Pressable,{onPress:we,style:({pressed:e})=>[$.navBtn,e&&$.navBtnPressed,p],accessibilityRole:"button",accessibilityLabel:"days"===Z?"Previous month":"years"===Z?"Previous years":"Previous decades",hitSlop:8,...hitSlopMarker(8),children:_jsx(Text,{style:$.navText,children:"‹"})}),_jsx(Pressable,{onPress:Ce,style:[$.headerLabelWrap,h],accessibilityRole:"button",accessibilityLabel:"days"===Z?`${pe}, switch to year selection`:"years"===Z?`${pe}, switch to decade selection`:`${pe}, switch to year selection`,hitSlop:8,...hitSlopMarker(8),children:_jsxs(Animated.View,{style:[$.headerLabelInner,{transform:[{scale:oe}],opacity:"days"===Z?ae:1}],children:[_jsx(Animated.Text,{style:[$.headerLabel,{transform:[{translateX:"days"===Z?te:0}]}],accessibilityLiveRegion:"polite",children:pe}),_jsx(View,{style:$.headerCaret,children:(Y.settings.icons.chevronDown??defaultIcons.chevronDown)({size:Y.text.sm.size,color:Y.colors["text-muted"]})})]})}),_jsx(Pressable,{onPress:De,style:({pressed:e})=>[$.navBtn,e&&$.navBtnPressed,p],accessibilityRole:"button",accessibilityLabel:"days"===Z?"Next month":"years"===Z?"Next years":"Next decades",hitSlop:8,...hitSlopMarker(8),children:_jsx(Text,{style:$.navText,children:"›"})})]}),"days"===Z?_jsxs(_Fragment,{children:[_jsx(View,{style:$.weekdayRow,children:ye.map((e,t)=>_jsx(View,{style:$.weekdayCell,children:_jsx(Text,{style:$.weekdayText,children:e})},`${e}-${t}`))}),_jsx(Animated.View,{style:[$.grid,{opacity:ae,transform:[{translateX:te}]}],children:Array.from({length:6}).map((e,t)=>_jsx(View,{style:$.gridRow,children:ue.slice(7*t,7*t+7).map(e=>{const t=de(e.date),a=!!q&&isSameDay(e.date,q),r=isSameDay(e.date,E),s=a?Y.colors.primary:"transparent",i=r&&!a?Y.colors.primary:"transparent",o=a?Y.colors["on-primary"]:e.inMonth?t?Y.colors["text-disabled"]:Y.colors["text-body"]:Y.colors["text-subtle"],n=t?.3:e.inMonth?1:.4;return _jsx(Pressable,{disabled:t,onPress:()=>Ae(e),accessibilityRole:"button",accessibilityLabel:he.format(e.date),accessibilityState:{selected:a,disabled:t},"aria-selected":a,"aria-disabled":t,style:$.dayCell,children:_jsx(Animated.View,{style:[$.dayInner,{backgroundColor:s,borderColor:i,borderWidth:r&&!a?1.5:0,opacity:n},a?{transform:[{scale:re}]}:null],children:_jsx(Text,{style:[$.dayText,{color:o}],children:e.date.getDate()})})},e.iso)})},`r-${t}`))})]}):_jsx(Animated.View,"years"===Z?{style:[$.yearGrid,{opacity:se,transform:[{scale:ie}]}],children:Array.from({length:3}).map((e,t)=>_jsx(View,{style:$.gridRow,children:me.slice(4*t,4*t+4).map(e=>{const t=be(e),a=!!q&&q.getFullYear()===e,r=E.getFullYear()===e,s=a?Y.colors.primary:"transparent",i=r&&!a?Y.colors.primary:"transparent",o=a?Y.colors["on-primary"]:t?Y.colors["text-disabled"]:Y.colors["text-body"],n=t?.3:1;return _jsx(Pressable,{disabled:t,onPress:()=>je(e),accessibilityRole:"button",accessibilityLabel:`Year ${e}`,accessibilityState:{selected:a,disabled:t},"aria-selected":a,"aria-disabled":t,style:$.yearCell,children:_jsx(View,{style:[$.yearInner,{backgroundColor:s,borderColor:i,borderWidth:r&&!a?1.5:0,opacity:n}],children:_jsx(Text,{style:[$.yearText,{color:o}],children:e})})},`year-${e}`)})},`yr-${t}`))}:{style:[$.yearGrid,{opacity:se,transform:[{scale:ie}]}],children:Array.from({length:3}).map((e,t)=>_jsx(View,{style:$.gridRow,children:ge.slice(4*t,4*t+4).map(e=>{const t=e+10-1,a=fe(e),r=!!q&&decadeStartFor(q.getFullYear())===e,s=decadeStartFor(E.getFullYear())===e,i=r?Y.colors.primary:"transparent",o=s&&!r?Y.colors.primary:"transparent",n=r?Y.colors["on-primary"]:a?Y.colors["text-disabled"]:Y.colors["text-body"],l=a?.3:1;return _jsx(Pressable,{disabled:a,onPress:()=>Se(e),accessibilityRole:"button",accessibilityLabel:`Decade ${e} to ${t}`,accessibilityState:{selected:r,disabled:a},"aria-selected":r,"aria-disabled":a,style:$.yearCell,children:_jsxs(View,{style:[$.yearInner,{backgroundColor:i,borderColor:o,borderWidth:s&&!r?1.5:0,opacity:l}],children:[_jsx(Text,{style:[$.yearText,{color:n}],children:`${e}s`}),_jsx(Text,{style:[$.decadeRangeText,{color:r?Y.colors["on-primary"]:Y.colors["text-subtle"]}],children:`${e}-${t}`})]})},`decade-${e}`)})},`dec-${t}`))}),_jsxs(View,{style:$.footer,children:[_jsx(Pressable,{onPress:Pe,style:({pressed:e})=>[$.footerBtn,$.footerCancel,e&&$.footerBtnPressed,b],accessibilityRole:"button",accessibilityLabel:m,children:_jsx(Text,{style:[$.footerBtnText,{color:Y.colors["text-muted"]}],children:m})}),_jsx(Pressable,{onPress:Fe,disabled:!q,style:({pressed:e})=>[$.footerBtn,$.footerConfirm,{backgroundColor:Y.colors.primary,opacity:q?1:.5},e&&{backgroundColor:Y.colors["primary-hover"]},b],accessibilityRole:"button",accessibilityLabel:u,accessibilityState:{disabled:!q},"aria-disabled":!q,children:_jsx(Text,{style:[$.footerBtnText,{color:Y.colors["on-primary"]}],children:u})})]})]}),ze=t?(M??(e=>e.toLocaleDateString()))(t):void 0,Be=!k;if("inline"===n)return F||Be?Be?_jsxs(_Fragment,{children:[_jsx(PickerTrigger,{label:w,value:ze,placeholder:D,helperText:v,error:C,required:j,disabled:S,size:A,variant:V,clearable:T,onClear:_,onPress:()=>P(!0),triggerStyle:R,testID:x}),F?Le:null]}):Le:null;const $e=_jsx(Modal,{visible:F,transparent:!0,statusBarTranslucent:!0,navigationBarTranslucent:!0,animationType:"none",onRequestClose:Te,children:_jsx(ModalSafeArea,{onInsets:B,children:_jsxs(AnimatedGestureRoot,{collapsable:!1,style:[$.backdrop,{backgroundColor:Ie}],children:[_jsx(Pressable,{style:StyleSheet.absoluteFill,onPress:Te,accessibilityLabel:"Dismiss"}),_jsx(Animated.View,{style:[$.sheetWrap,{paddingBottom:Math.max(z.bottom,Y.space.lg),opacity:ke,transform:[{translateY:Animated.add(Ne,Q)}]}],onLayout:e=>{ee.current=e.nativeEvent.layout.height},accessibilityViewIsModal:!0,accessibilityRole:"none",children:Le}),_jsx(ToastHost,{})]})})});return Be?_jsxs(_Fragment,{children:[_jsx(PickerTrigger,{label:w,value:ze,placeholder:D,helperText:v,error:C,required:j,disabled:S,size:A,variant:V,clearable:T,onClear:_,onPress:()=>P(!0),triggerStyle:R,testID:x}),$e]}):$e},buildStyles=e=>{const t=e.shadow.popover;return StyleSheet.create({backdrop:{...StyleSheet.absoluteFill},sheetWrap:{position:"absolute",left:0,right:0,bottom:0,paddingHorizontal:e.space.md,paddingBottom:e.space.lg},card:{backgroundColor:e.colors.surface,borderRadius:e.radius.xl,...smoothCorners,padding:e.space.lg,shadowColor:t.shadowColor,shadowOffset:t.shadowOffset,shadowOpacity:t.shadowOpacity,shadowRadius:t.shadowRadius,elevation:t.elevation},grabArea:{marginTop:-e.space.lg,paddingTop:e.space.sm},handle:{alignSelf:"center",width:36,height:4,borderRadius:e.radius.pill,...smoothCorners,backgroundColor:e.colors["border-subtle"],marginBottom:e.space.sm},titleRow:{marginBottom:e.space.sm},title:{fontSize:e.text.lg.size,fontWeight:e.weight.semibold,color:e.colors["text-body"]},headerRow:{flexDirection:"row",alignItems:"center",justifyContent:"space-between",marginBottom:e.space.md},navBtn:{width:36,height:36,borderRadius:e.radius.pill,...smoothCorners,alignItems:"center",justifyContent:"center",backgroundColor:e.colors["bg-subtle"]},navBtnPressed:{backgroundColor:e.colors["surface-pressed"]},navText:{fontSize:e.text["2xl"].size,lineHeight:26,color:e.colors["text-body"],fontWeight:e.weight.semibold},headerLabelWrap:{flex:1,alignItems:"center"},headerLabelInner:{flexDirection:"row",alignItems:"center",justifyContent:"center"},headerLabel:{fontSize:e.text.base.size,fontWeight:e.weight.semibold,color:e.colors["text-body"]},headerCaret:{marginLeft:e.space.xs,alignItems:"center",justifyContent:"center"},weekdayRow:{flexDirection:"row",marginBottom:e.space.xs},weekdayCell:{flex:1,alignItems:"center",paddingVertical:e.space.xs},weekdayText:{fontSize:e.text.xs.size,fontWeight:e.weight.medium,color:e.colors["text-subtle"],letterSpacing:e["letter-spacing"].wide},grid:{},gridRow:{flexDirection:"row"},dayCell:{flex:1,aspectRatio:1,alignItems:"center",justifyContent:"center",padding:e.space.xxs},dayInner:{width:"100%",height:"100%",borderRadius:e.radius.pill,...smoothCorners,alignItems:"center",justifyContent:"center"},dayText:{fontSize:e.text.sm.size,fontWeight:e.weight.medium},yearGrid:{},yearCell:{flex:1,aspectRatio:1.6,alignItems:"center",justifyContent:"center",padding:e.space.xs},yearInner:{width:"100%",height:"100%",borderRadius:e.radius.lg,...smoothCorners,alignItems:"center",justifyContent:"center"},yearText:{fontSize:e.text.base.size,fontWeight:e.weight.semibold},decadeRangeText:{fontSize:e.text.xs.size,fontWeight:e.weight.medium,marginTop:e.space.xxs},footer:{flexDirection:"row",justifyContent:"flex-end",alignItems:"center",marginTop:e.space.lg,gap:e.space.sm},footerBtn:{paddingHorizontal:e.space.lg,paddingVertical:e.space.sm,borderRadius:e.radius.md,...smoothCorners,minHeight:40,alignItems:"center",justifyContent:"center"},footerCancel:{backgroundColor:"transparent"},footerConfirm:{},footerBtnPressed:{opacity:.85},footerBtnText:{fontSize:e.text.sm.size,fontWeight:e.weight.semibold}})};export{DatePicker};export default DatePicker;
@@ -1 +1 @@
1
- "use strict";import{definePhoneMeta}from"../../canvasKit/meta.js";export const meta=definePhoneMeta()({name:"EmptyState",marker:null,platforms:["phone"],acceptsChildren:!1,props:{icon:{type:"node",description:"Illustration or icon drawn in a circle above the title."},title:{type:"string",required:!0,description:"Headline message."},description:{type:"string",description:"Supporting copy under the title."},size:{type:"enum",values:["sm","md","lg"],default:"md",description:"Icon size, type scale and vertical padding."},fill:{type:"boolean",default:!1,description:"Grows to fill the space it is given and centres its content; pass it as the empty component of a list."}},omit:["action","secondaryAction"],examples:[{id:"EmptyState.medium",title:"Medium",props:{title:"No messages yet",description:"Start a conversation with anyone in your contacts.",size:"md"}},{id:"EmptyState.small",title:"Small",props:{title:"No messages yet",description:"Start a conversation with anyone in your contacts.",size:"sm"}},{id:"EmptyState.large",title:"Large",props:{title:"No messages yet",description:"Start a conversation with anyone in your contacts.",size:"lg"}},{id:"EmptyState.titleOnly",title:"Title only",props:{title:"Nothing here"}}],usage:{when:["A list, search or screen has no data yet and needs a clear next step.","A load failed and the screen shows a message with a retry action."],whenNot:[{text:"Data is still loading.",instead:"Skeleton"},{text:"A short passing message about an action.",instead:"Toast"}],do:[{note:"Say what is missing and what to do about it.",example:[{component:"EmptyState",props:{title:"No orders yet",description:"When you place an order it will show up here."}}]}],dont:[{note:"Do not leave a bare title with no explanation.",example:[{component:"EmptyState",props:{title:"Empty"}}]}],a11y:["Announced as a summary region, so write the title and description as plain sentences.","Put the meaning in the title and description, not in the icon."]}});
1
+ "use strict";import{definePhoneMeta}from"../../canvasKit/meta.js";export const meta=definePhoneMeta()({name:"EmptyState",marker:null,platforms:["phone"],acceptsChildren:!1,props:{icon:{type:"node",description:"Illustration or icon drawn in a circle above the title."},title:{type:"string",required:!0,description:"Headline message."},description:{type:"string",description:"Supporting copy under the title."},size:{type:"enum",values:["sm","md","lg"],default:"md",description:"Icon size, type scale and vertical padding."},fill:{type:"boolean",default:!1,description:"Grows to fill the space it is given and centres its content; pass it as the empty component of a list."},action:{type:"object",description:"The main button under the message, filled in the primary colour.",fields:{label:{type:"string",required:!0,description:"The button's text."},accessibilityLabel:{type:"string",description:"The spoken label, when it differs from the text."},accessibilityHint:{type:"string",description:"What pressing the button does, spoken after the label."}}},secondaryAction:{type:"object",description:"A second, quieter button beside the main one.",fields:{label:{type:"string",required:!0,description:"The button's text."},accessibilityLabel:{type:"string",description:"The spoken label, when it differs from the text."},accessibilityHint:{type:"string",description:"What pressing the button does, spoken after the label."}}}},omit:[],examples:[{id:"EmptyState.medium",title:"Medium",props:{title:"No messages yet",description:"Start a conversation with anyone in your contacts.",size:"md"}},{id:"EmptyState.small",title:"Small",props:{title:"No messages yet",description:"Start a conversation with anyone in your contacts.",size:"sm"}},{id:"EmptyState.large",title:"Large",props:{title:"No messages yet",description:"Start a conversation with anyone in your contacts.",size:"lg"}},{id:"EmptyState.titleOnly",title:"Title only",props:{title:"Nothing here"}}],usage:{when:["A list, search or screen has no data yet and needs a clear next step.","A load failed and the screen shows a message with a retry action."],whenNot:[{text:"Data is still loading.",instead:"Skeleton"},{text:"A short passing message about an action.",instead:"Toast"}],do:[{note:"Say what is missing and what to do about it.",example:[{component:"EmptyState",props:{title:"No orders yet",description:"When you place an order it will show up here."}}]}],dont:[{note:"Do not leave a bare title with no explanation.",example:[{component:"EmptyState",props:{title:"Empty"}}]}],a11y:["Announced as a summary region, so write the title and description as plain sentences.","Put the meaning in the title and description, not in the icon."]}});
@@ -1 +1 @@
1
- "use strict";import{forwardRef,useCallback,useImperativeHandle,useMemo,useRef,useState}from"react";import{Image,Pressable,ScrollView,StyleSheet,Text,View}from"react-native";import{useControllableState}from"../../hooks/index.js";import{fontFor,useTheme}from"../../theme/index.js";import{resolveHaptic,triggerHaptic}from"../../utils/index.js";import{smoothCorners}from"../../utils/corners.js";import{defaultIcons}from"../AppIcon/defaultIcons.js";import{hasFieldText}from"../FieldBase/index.js";import{OptionSheet}from"../OptionSheet/OptionSheet.js";import{Spinner}from"../Spinner/index.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";let fileIdSeq=0;const nextFileId=()=>"wfp-"+ ++fileIdSeq,DEFAULT_LABELS={trigger:"Attach file",addMore:"Add more",sheetTitle:"Add from",removeFile:e=>`Remove ${e}`,retry:"Retry upload",errorTooMany:e=>`You can attach up to ${e} files.`,errorTooLarge:(e,t)=>`${e} is larger than ${t} MB.`,errorWrongType:e=>`${e} is not an accepted file type.`};export const formatFileSize=e=>{if(void 0===e||e<=0)return"";const t=["B","KB","MB","GB"];let r=e,s=0;for(;r>=1024&&s<t.length-1;)r/=1024,s+=1;return`${r>=10||0===s?Math.round(r):Math.round(10*r)/10} ${t[s]}`};export const matchesAccept=(e,t)=>!t||0===t.length||!!e&&t.some(t=>"*/*"===t||"*"===t||(t.endsWith("/*")?e.startsWith(t.slice(0,t.length-1)):e===t));const isImage=e=>!0===e.type?.startsWith("image/")||!e.type&&/\.(png|jpe?g|gif|webp|heic)$/i.test(e.name),imageSourceOf=e=>e.thumbnailUrl??(isImage(e)?e.uri??e.url:void 0),extensionOf=e=>{const t=e.lastIndexOf(".");return t<=0||t===e.length-1?"FILE":e.slice(t+1).toUpperCase().slice(0,4)},FilePicker=forwardRef((e,t)=>{const{files:r,defaultFiles:s,onChange:i,sources:o,maxFiles:l,maxSizeMB:n,accept:a,validate:c,process:d,variant:u="card",renderFile:g,renderTrigger:h,disabled:m=!1,helperText:p,error:x,labels:b,haptic:f,onPick:y,onRemove:T,onError:j,onFilePress:S,onRetry:C,style:w,accessibilityLabel:F,testID:_}=e,v=useTheme(),z=useMemo(()=>buildStyles(v),[v]),P=useMemo(()=>({...DEFAULT_LABELS,...b}),[b]),k=v.radius.md,R=v.colors.primary,[I,V]=useControllableState({value:r,defaultValue:s??[],onChange:i}),O=useRef(I);O.current=I;const B=useCallback(e=>{O.current=e,V(e)},[V]),[L,M]=useState(null),[H,$]=useState(!1),A=x??L??void 0,E="number"==typeof l&&I.length>=l,W=useCallback((e,t)=>{0!==e.length&&(M(e[0]),e.forEach(e=>j?.(e,t)),!1!==f&&triggerHaptic("notificationError"))},[j,f]),D=useCallback(async e=>{let t;try{t=await e.pick()}catch(e){return void W([e instanceof Error?e.message:String(e)])}if(!t||0===t.length)return;const r=[];let s=t.map(e=>({id:nextFileId(),name:e.name??e.uri.split("/").pop()??"file",uri:e.uri,type:e.type,size:e.size,meta:e.meta,status:"idle"}));if("number"==typeof l){const e=Math.max(0,l-O.current.length);s.length>e&&(r.push(P.errorTooMany(l)),s=s.slice(0,e))}const i=[];for(const e of s){if("number"==typeof n&&"number"==typeof e.size&&e.size>1024*n*1024){r.push(P.errorTooLarge(e.name,n));continue}if(!matchesAccept(e.type,a)){r.push(P.errorWrongType(e.name));continue}const t=c?.(e);t?r.push(t):i.push(e)}if(W(r),0===i.length)return;if(!d){B([...O.current,...i]),M(r.length>0?r[0]:null);const e=resolveHaptic(f,"selection");return e&&triggerHaptic(e),void y?.(i)}const o=i.map(e=>({...e,status:"processing"}));B([...O.current,...o]);const u=[];for(const e of o)try{const t=await d({...e,status:"idle"}),r={...t,id:e.id,status:t.status??"idle"};B(O.current.map(t=>t.id===e.id?r:t)),u.push(r)}catch(t){B(O.current.filter(t=>t.id!==e.id)),W([t instanceof Error?t.message:String(t)],e)}if(u.length>0){0===r.length&&M(null);const e=resolveHaptic(f,"selection");e&&triggerHaptic(e),y?.(u)}},[l,n,a,c,d,P,W,B,y,f]),U=useCallback(e=>{if(m||E)return;const t=e?o.find(t=>t.key===e):1===o.length?o[0]:void 0;t?D(t):o.length>1&&$(!0)},[m,E,o,D]),G=useCallback(e=>{if(m)return;B(O.current.filter(t=>t.id!==e.id)),M(null);const t=resolveHaptic(f,"selection");t&&triggerHaptic(t),T?.(e)},[m,B,T,f]),N=useCallback(()=>{B([]),M(null)},[B]);useImperativeHandle(t,()=>({open:U,clear:N}),[U,N]);const q=0===I.length?P.trigger:`${I.length} file${1===I.length?"":"s"} attached`,K=F??`Attachments. ${q}`,statusText=e=>{switch(e.status){case"processing":return"Processing…";case"uploading":return`Uploading ${Math.round(100*(e.progress??0))}%`;case"done":return"Uploaded";case"error":return e.error??"Failed";default:return""}},fileA11yLabel=e=>[e.name,formatFileSize(e.size),statusText(e)].filter(Boolean).join(", "),Y=v.settings.icons.attachment??defaultIcons.attachment,renderStatusOverlay=e=>{if("processing"===e.status)return _jsx(View,{style:[z.tileOverlay,{backgroundColor:v.colors.scrim}],children:_jsx(Spinner,{size:"sm"})});if("uploading"===e.status){const t=Math.round(100*(e.progress??0));return _jsxs(View,{style:[z.tileOverlay,{backgroundColor:v.colors.scrim}],children:[_jsx(Text,{style:[z.tileOverlayText,{color:v.colors["on-scrim"]}],children:`${t}%`}),_jsx(View,{style:[z.tileProgressTrack,{backgroundColor:v.colors.border}],children:_jsx(View,{style:[z.tileProgressFill,{width:`${t}%`,backgroundColor:v.colors.primary}]})})]})}return"done"===e.status?_jsx(View,{style:[z.doneBadge,{backgroundColor:v.colors.success}],children:_jsx(Text,{style:[z.doneBadgeText,{color:v.colors["on-success"]}],children:"✓"})}):null},renderThumbnail=e=>{const t=imageSourceOf(e);return t?_jsx(Image,{source:{uri:t},style:z.thumbnailImage}):_jsx(View,{style:[z.extensionTile,{backgroundColor:v.colors["bg-subtle"]}],children:_jsx(Text,{style:[z.extensionText,{color:v.colors["text-muted"],...fontFor(v,"semibold")}],children:extensionOf(e.name)})})},removeButton=e=>_jsx(Pressable,{onPress:()=>G(e),disabled:m,hitSlop:8,accessibilityRole:"button",accessibilityLabel:P.removeFile(e.name),style:[z.removeButton,{backgroundColor:v.colors.scrim}],children:_jsx(Text,{style:[z.removeButtonText,{color:v.colors["on-scrim"]}],children:"×"})}),retryButton=e=>C&&"error"===e.status?_jsx(Pressable,{onPress:()=>C(e),disabled:m,hitSlop:8,accessibilityRole:"button",accessibilityLabel:P.retry,children:_jsx(Text,{style:[z.retryText,{color:v.colors.primary}],children:"↻"})}):null,renderOneFile=(e,t)=>{const r={file:e,index:t,disabled:m,remove:()=>G(e),retry:C?()=>C(e):void 0},s=g?g(r):"card"===u?(e=>{const{file:t}=e;return _jsxs(View,{style:[z.tile,{width:84,height:84,borderRadius:k,...smoothCorners,borderColor:"error"===t.status?v.colors.danger:v.colors.border}],children:[renderThumbnail(t),renderStatusOverlay(t),"error"===t.status?_jsx(View,{style:[z.tileOverlay,{backgroundColor:v.colors.scrim}],children:retryButton(t)}):null,removeButton(t)]})})(r):(e=>{const{file:t}=e,r=statusText(t);return _jsxs(View,{style:[z.listRow,{borderRadius:k,...smoothCorners,borderColor:"error"===t.status?v.colors.danger:v.colors.border,backgroundColor:v.colors.bg}],children:[_jsxs(View,{style:[z.listThumb,{borderRadius:v.radius.sm,...smoothCorners}],children:[renderThumbnail(t),"processing"===t.status?_jsx(View,{style:[z.tileOverlay,{backgroundColor:v.colors.scrim}],children:_jsx(Spinner,{size:"sm"})}):null]}),_jsxs(View,{style:z.listTextWrap,children:[_jsx(Text,{numberOfLines:1,ellipsizeMode:"middle",style:[z.listName,{color:v.colors["text-body"],fontSize:v.text.sm.size,...fontFor(v,"medium")}],children:t.name}),_jsx(Text,{numberOfLines:1,style:[z.listSubtitle,{color:"error"===t.status?v.colors["danger-text"]:v.colors["text-subtle"],fontSize:v.text.xs.size}],children:[formatFileSize(t.size),r].filter(Boolean).join(" · ")}),"uploading"===t.status?_jsx(View,{style:[z.listProgressTrack,{backgroundColor:v.colors.border}],children:_jsx(View,{style:[z.listProgressFill,{width:`${Math.round(100*(t.progress??0))}%`,backgroundColor:v.colors.primary}]})}):null]}),retryButton(t),_jsx(Pressable,{onPress:()=>G(t),disabled:m,hitSlop:8,accessibilityRole:"button",accessibilityLabel:P.removeFile(t.name),children:_jsx(Text,{style:[z.listRemoveText,{color:v.colors["text-subtle"]}],children:"×"})})]})})(r);return _jsx(Pressable,{onPress:S?()=>S(e):void 0,disabled:m||!S,accessibilityLabel:fileA11yLabel(e),children:s},e.id)},J={open:U,disabled:m||E,fileCount:I.length,atCapacity:E},dashedTrigger=e=>_jsxs(Pressable,{onPress:()=>U(),disabled:m||E,accessibilityRole:"button",accessibilityLabel:K,accessibilityState:{disabled:m||E},"aria-disabled":m||E,style:({pressed:t})=>[z.trigger,e?z.triggerCompact:null,{borderRadius:k,...smoothCorners,borderColor:R,backgroundColor:t?v.colors["surface-pressed"]:v.colors.bg,opacity:m||E?.55:1}],children:[_jsxs(View,{style:z.triggerRow,children:[Y?Y({size:16,color:v.colors.primary}):null,_jsx(Text,{style:[z.triggerText,{color:v.colors.primary,fontSize:v.text.sm.size,...fontFor(v,"medium")}],children:0===I.length?P.trigger:P.addMore})]}),!e&&p?_jsx(Text,{style:[z.helperText,{color:v.colors["text-subtle"],fontSize:v.text.xs.size}],children:p}):null]}),Q=_jsx(Pressable,{onPress:()=>U(),disabled:m||E,accessibilityRole:"button",accessibilityLabel:P.addMore,style:({pressed:e})=>[z.tile,z.addTile,{width:84,height:84,borderRadius:k,...smoothCorners,borderColor:R,backgroundColor:e?v.colors["surface-pressed"]:"transparent",opacity:m||E?.55:1}],children:_jsx(Text,{style:[z.addTileText,{color:v.colors.primary}],children:"+"})});return _jsxs(View,{style:[z.container,w],testID:_,accessibilityLabel:K,children:["card"===u?0===I.length?h?h(J):dashedTrigger(!1):_jsxs(ScrollView,{horizontal:!0,showsHorizontalScrollIndicator:!1,contentContainerStyle:[z.strip,{columnGap:v.space.sm}],children:[I.map(renderOneFile),h?h(J):E||m?null:Q]}):_jsxs(View,{style:{rowGap:v.space.sm},children:[h?h(J):E?null:dashedTrigger(I.length>0),I.map(renderOneFile)]}),hasFieldText(A)?_jsx(Text,{accessibilityLiveRegion:"polite",style:[z.errorText,{color:v.colors["danger-text"],fontSize:v.text.xs.size,marginTop:v.space.xxs}],children:A}):null,_jsx(OptionSheet,{open:H,onClose:()=>$(!1),title:P.sheetTitle,options:o,labelOf:e=>e.label,getValue:e=>e.key,disabledOf:()=>!1,descriptionOf:e=>e.description,iconOf:e=>e.icon,isSelected:()=>!1,onSelect:e=>{$(!1),D(e)}})]})});FilePicker.displayName="FilePicker";const buildStyles=e=>StyleSheet.create({container:{width:"100%"},trigger:{borderWidth:1,borderStyle:"dashed",alignItems:"center",minHeight:48,paddingVertical:e.space.md,paddingHorizontal:e.space.lg},triggerCompact:{minHeight:40,paddingVertical:e.space.sm},triggerRow:{flexDirection:"row",alignItems:"center",columnGap:e.space.sm},triggerText:{includeFontPadding:!1},helperText:{includeFontPadding:!1,marginTop:e.space.xs,textAlign:"center"},strip:{paddingVertical:e.space.xxs},tile:{borderWidth:1,overflow:"hidden"},addTile:{borderStyle:"dashed",alignItems:"center",justifyContent:"center"},addTileText:{fontSize:e.text["3xl"].size,includeFontPadding:!1},thumbnailImage:{width:"100%",height:"100%",resizeMode:"cover"},extensionTile:{width:"100%",height:"100%",alignItems:"center",justifyContent:"center"},extensionText:{fontSize:e.text.sm.size,letterSpacing:1,includeFontPadding:!1},tileOverlay:{...StyleSheet.absoluteFill,alignItems:"center",justifyContent:"center"},tileOverlayText:{fontSize:e.text.sm.size,includeFontPadding:!1,marginBottom:e.space.xs},tileProgressTrack:{position:"absolute",left:8,right:8,bottom:8,height:3,borderRadius:e.radius.pill,...smoothCorners,overflow:"hidden"},tileProgressFill:{height:"100%",borderRadius:e.radius.pill,...smoothCorners},doneBadge:{position:"absolute",right:4,bottom:4,width:18,height:18,borderRadius:e.radius.pill,...smoothCorners,alignItems:"center",justifyContent:"center"},doneBadgeText:{fontSize:e.text.xs.size,includeFontPadding:!1},removeButton:{position:"absolute",top:4,right:4,width:20,height:20,borderRadius:e.radius.pill,...smoothCorners,alignItems:"center",justifyContent:"center"},removeButtonText:{fontSize:e.text.sm.size,lineHeight:15,includeFontPadding:!1},retryText:{fontSize:e.text.xl.size,includeFontPadding:!1},listRow:{flexDirection:"row",alignItems:"center",borderWidth:1,padding:e.space.sm,columnGap:e.space.sm},listThumb:{width:40,height:40,overflow:"hidden"},listTextWrap:{flex:1},listName:{includeFontPadding:!1},listSubtitle:{includeFontPadding:!1,marginTop:e.space.xxs},listProgressTrack:{height:3,borderRadius:e.radius.pill,...smoothCorners,overflow:"hidden",marginTop:e.space.xs},listProgressFill:{height:"100%",borderRadius:e.radius.pill,...smoothCorners},listRemoveText:{fontSize:e.text["2xl"].size,includeFontPadding:!1,paddingHorizontal:e.space.xs},errorText:{includeFontPadding:!1}});export{FilePicker};export default FilePicker;
1
+ "use strict";import{forwardRef,useCallback,useImperativeHandle,useMemo,useRef,useState}from"react";import{Image,Pressable,ScrollView,StyleSheet,Text,View}from"react-native";import{useControllableState}from"../../hooks/index.js";import{fontFor,useTheme}from"../../theme/index.js";import{resolveHaptic,triggerHaptic}from"../../utils/index.js";import{smoothCorners}from"../../utils/corners.js";import{hitSlopMarker}from"../../utils/hitSlop.js";import{defaultIcons}from"../AppIcon/defaultIcons.js";import{hasFieldText}from"../FieldBase/index.js";import{OptionSheet}from"../OptionSheet/OptionSheet.js";import{Spinner}from"../Spinner/index.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";let fileIdSeq=0;const nextFileId=()=>"wfp-"+ ++fileIdSeq,DEFAULT_LABELS={trigger:"Attach file",addMore:"Add more",sheetTitle:"Add from",removeFile:e=>`Remove ${e}`,retry:"Retry upload",errorTooMany:e=>`You can attach up to ${e} files.`,errorTooLarge:(e,t)=>`${e} is larger than ${t} MB.`,errorWrongType:e=>`${e} is not an accepted file type.`};export const formatFileSize=e=>{if(void 0===e||e<=0)return"";const t=["B","KB","MB","GB"];let r=e,s=0;for(;r>=1024&&s<t.length-1;)r/=1024,s+=1;return`${r>=10||0===s?Math.round(r):Math.round(10*r)/10} ${t[s]}`};export const matchesAccept=(e,t)=>!t||0===t.length||!!e&&t.some(t=>"*/*"===t||"*"===t||(t.endsWith("/*")?e.startsWith(t.slice(0,t.length-1)):e===t));const isImage=e=>!0===e.type?.startsWith("image/")||!e.type&&/\.(png|jpe?g|gif|webp|heic)$/i.test(e.name),imageSourceOf=e=>e.thumbnailUrl??(isImage(e)?e.uri??e.url:void 0),extensionOf=e=>{const t=e.lastIndexOf(".");return t<=0||t===e.length-1?"FILE":e.slice(t+1).toUpperCase().slice(0,4)},FilePicker=forwardRef((e,t)=>{const{files:r,defaultFiles:s,onChange:i,sources:o,maxFiles:l,maxSizeMB:n,accept:a,validate:c,process:d,variant:u="card",renderFile:h,renderTrigger:g,disabled:m=!1,helperText:p,error:x,labels:b,haptic:f,onPick:y,onRemove:T,onError:S,onFilePress:j,onRetry:C,style:w,accessibilityLabel:F,testID:_}=e,v=useTheme(),z=useMemo(()=>buildStyles(v),[v]),P=useMemo(()=>({...DEFAULT_LABELS,...b}),[b]),k=v.radius.md,R=v.colors.primary,[I,V]=useControllableState({value:r,defaultValue:s??[],onChange:i}),M=useRef(I);M.current=I;const O=useCallback(e=>{M.current=e,V(e)},[V]),[B,L]=useState(null),[H,$]=useState(!1),A=x??B??void 0,E="number"==typeof l&&I.length>=l,W=useCallback((e,t)=>{0!==e.length&&(L(e[0]),e.forEach(e=>S?.(e,t)),!1!==f&&triggerHaptic("notificationError"))},[S,f]),D=useCallback(async e=>{let t;try{t=await e.pick()}catch(e){return void W([e instanceof Error?e.message:String(e)])}if(!t||0===t.length)return;const r=[];let s=t.map(e=>({id:nextFileId(),name:e.name??e.uri.split("/").pop()??"file",uri:e.uri,type:e.type,size:e.size,meta:e.meta,status:"idle"}));if("number"==typeof l){const e=Math.max(0,l-M.current.length);s.length>e&&(r.push(P.errorTooMany(l)),s=s.slice(0,e))}const i=[];for(const e of s){if("number"==typeof n&&"number"==typeof e.size&&e.size>1024*n*1024){r.push(P.errorTooLarge(e.name,n));continue}if(!matchesAccept(e.type,a)){r.push(P.errorWrongType(e.name));continue}const t=c?.(e);t?r.push(t):i.push(e)}if(W(r),0===i.length)return;if(!d){O([...M.current,...i]),L(r.length>0?r[0]:null);const e=resolveHaptic(f,"selection");return e&&triggerHaptic(e),void y?.(i)}const o=i.map(e=>({...e,status:"processing"}));O([...M.current,...o]);const u=[];for(const e of o)try{const t=await d({...e,status:"idle"}),r={...t,id:e.id,status:t.status??"idle"};O(M.current.map(t=>t.id===e.id?r:t)),u.push(r)}catch(t){O(M.current.filter(t=>t.id!==e.id)),W([t instanceof Error?t.message:String(t)],e)}if(u.length>0){0===r.length&&L(null);const e=resolveHaptic(f,"selection");e&&triggerHaptic(e),y?.(u)}},[l,n,a,c,d,P,W,O,y,f]),U=useCallback(e=>{if(m||E)return;const t=e?o.find(t=>t.key===e):1===o.length?o[0]:void 0;t?D(t):o.length>1&&$(!0)},[m,E,o,D]),G=useCallback(e=>{if(m)return;O(M.current.filter(t=>t.id!==e.id)),L(null);const t=resolveHaptic(f,"selection");t&&triggerHaptic(t),T?.(e)},[m,O,T,f]),N=useCallback(()=>{O([]),L(null)},[O]);useImperativeHandle(t,()=>({open:U,clear:N}),[U,N]);const q=0===I.length?P.trigger:`${I.length} file${1===I.length?"":"s"} attached`,K=F??`Attachments. ${q}`,statusText=e=>{switch(e.status){case"processing":return"Processing…";case"uploading":return`Uploading ${Math.round(100*(e.progress??0))}%`;case"done":return"Uploaded";case"error":return e.error??"Failed";default:return""}},fileA11yLabel=e=>[e.name,formatFileSize(e.size),statusText(e)].filter(Boolean).join(", "),Y=v.settings.icons.attachment??defaultIcons.attachment,renderStatusOverlay=e=>{if("processing"===e.status)return _jsx(View,{style:[z.tileOverlay,{backgroundColor:v.colors.scrim}],children:_jsx(Spinner,{size:"sm"})});if("uploading"===e.status){const t=Math.round(100*(e.progress??0));return _jsxs(View,{style:[z.tileOverlay,{backgroundColor:v.colors.scrim}],children:[_jsx(Text,{style:[z.tileOverlayText,{color:v.colors["on-scrim"]}],children:`${t}%`}),_jsx(View,{style:[z.tileProgressTrack,{backgroundColor:v.colors.border}],children:_jsx(View,{style:[z.tileProgressFill,{width:`${t}%`,backgroundColor:v.colors.primary}]})})]})}return"done"===e.status?_jsx(View,{style:[z.doneBadge,{backgroundColor:v.colors.success}],children:_jsx(Text,{style:[z.doneBadgeText,{color:v.colors["on-success"]}],children:"✓"})}):null},renderThumbnail=e=>{const t=imageSourceOf(e);return t?_jsx(Image,{source:{uri:t},style:z.thumbnailImage}):_jsx(View,{style:[z.extensionTile,{backgroundColor:v.colors["bg-subtle"]}],children:_jsx(Text,{style:[z.extensionText,{color:v.colors["text-muted"],...fontFor(v,"semibold")}],children:extensionOf(e.name)})})},removeButton=e=>_jsx(Pressable,{onPress:()=>G(e),disabled:m,hitSlop:8,...hitSlopMarker(8),accessibilityRole:"button",accessibilityLabel:P.removeFile(e.name),style:[z.removeButton,{backgroundColor:v.colors.scrim}],children:_jsx(Text,{style:[z.removeButtonText,{color:v.colors["on-scrim"]}],children:"×"})}),retryButton=e=>C&&"error"===e.status?_jsx(Pressable,{onPress:()=>C(e),disabled:m,hitSlop:8,...hitSlopMarker(8),accessibilityRole:"button",accessibilityLabel:P.retry,children:_jsx(Text,{style:[z.retryText,{color:v.colors.primary}],children:"↻"})}):null,renderOneFile=(e,t)=>{const r={file:e,index:t,disabled:m,remove:()=>G(e),retry:C?()=>C(e):void 0},s=h?h(r):"card"===u?(e=>{const{file:t}=e;return _jsxs(View,{style:[z.tile,{width:84,height:84,borderRadius:k,...smoothCorners,borderColor:"error"===t.status?v.colors.danger:v.colors.border}],children:[renderThumbnail(t),renderStatusOverlay(t),"error"===t.status?_jsx(View,{style:[z.tileOverlay,{backgroundColor:v.colors.scrim}],children:retryButton(t)}):null,removeButton(t)]})})(r):(e=>{const{file:t}=e,r=statusText(t);return _jsxs(View,{style:[z.listRow,{borderRadius:k,...smoothCorners,borderColor:"error"===t.status?v.colors.danger:v.colors.border,backgroundColor:v.colors.bg}],children:[_jsxs(View,{style:[z.listThumb,{borderRadius:v.radius.sm,...smoothCorners}],children:[renderThumbnail(t),"processing"===t.status?_jsx(View,{style:[z.tileOverlay,{backgroundColor:v.colors.scrim}],children:_jsx(Spinner,{size:"sm"})}):null]}),_jsxs(View,{style:z.listTextWrap,children:[_jsx(Text,{numberOfLines:1,ellipsizeMode:"middle",style:[z.listName,{color:v.colors["text-body"],fontSize:v.text.sm.size,...fontFor(v,"medium")}],children:t.name}),_jsx(Text,{numberOfLines:1,style:[z.listSubtitle,{color:"error"===t.status?v.colors["danger-text"]:v.colors["text-subtle"],fontSize:v.text.xs.size}],children:[formatFileSize(t.size),r].filter(Boolean).join(" · ")}),"uploading"===t.status?_jsx(View,{style:[z.listProgressTrack,{backgroundColor:v.colors.border}],children:_jsx(View,{style:[z.listProgressFill,{width:`${Math.round(100*(t.progress??0))}%`,backgroundColor:v.colors.primary}]})}):null]}),retryButton(t),_jsx(Pressable,{onPress:()=>G(t),disabled:m,hitSlop:8,...hitSlopMarker(8),accessibilityRole:"button",accessibilityLabel:P.removeFile(t.name),children:_jsx(Text,{style:[z.listRemoveText,{color:v.colors["text-subtle"]}],children:"×"})})]})})(r);return _jsx(Pressable,{onPress:j?()=>j(e):void 0,disabled:m||!j,accessibilityLabel:fileA11yLabel(e),children:s},e.id)},J={open:U,disabled:m||E,fileCount:I.length,atCapacity:E},dashedTrigger=e=>_jsxs(Pressable,{onPress:()=>U(),disabled:m||E,accessibilityRole:"button",accessibilityLabel:K,accessibilityState:{disabled:m||E},"aria-disabled":m||E,style:({pressed:t})=>[z.trigger,e?z.triggerCompact:null,{borderRadius:k,...smoothCorners,borderColor:R,backgroundColor:t?v.colors["surface-pressed"]:v.colors.bg,opacity:m||E?.55:1}],children:[_jsxs(View,{style:z.triggerRow,children:[Y?Y({size:16,color:v.colors.primary}):null,_jsx(Text,{style:[z.triggerText,{color:v.colors.primary,fontSize:v.text.sm.size,...fontFor(v,"medium")}],children:0===I.length?P.trigger:P.addMore})]}),!e&&p?_jsx(Text,{style:[z.helperText,{color:v.colors["text-subtle"],fontSize:v.text.xs.size}],children:p}):null]}),Q=_jsx(Pressable,{onPress:()=>U(),disabled:m||E,accessibilityRole:"button",accessibilityLabel:P.addMore,style:({pressed:e})=>[z.tile,z.addTile,{width:84,height:84,borderRadius:k,...smoothCorners,borderColor:R,backgroundColor:e?v.colors["surface-pressed"]:"transparent",opacity:m||E?.55:1}],children:_jsx(Text,{style:[z.addTileText,{color:v.colors.primary}],children:"+"})});return _jsxs(View,{style:[z.container,w],testID:_,accessibilityLabel:K,children:["card"===u?0===I.length?g?g(J):dashedTrigger(!1):_jsxs(ScrollView,{horizontal:!0,showsHorizontalScrollIndicator:!1,contentContainerStyle:[z.strip,{columnGap:v.space.sm}],children:[I.map(renderOneFile),g?g(J):E||m?null:Q]}):_jsxs(View,{style:{rowGap:v.space.sm},children:[g?g(J):E?null:dashedTrigger(I.length>0),I.map(renderOneFile)]}),hasFieldText(A)?_jsx(Text,{accessibilityLiveRegion:"polite",style:[z.errorText,{color:v.colors["danger-text"],fontSize:v.text.xs.size,marginTop:v.space.xxs}],children:A}):null,_jsx(OptionSheet,{open:H,onClose:()=>$(!1),title:P.sheetTitle,options:o,labelOf:e=>e.label,getValue:e=>e.key,disabledOf:()=>!1,descriptionOf:e=>e.description,iconOf:e=>e.icon,isSelected:()=>!1,onSelect:e=>{$(!1),D(e)}})]})});FilePicker.displayName="FilePicker";const buildStyles=e=>StyleSheet.create({container:{width:"100%"},trigger:{borderWidth:1,borderStyle:"dashed",alignItems:"center",minHeight:48,paddingVertical:e.space.md,paddingHorizontal:e.space.lg},triggerCompact:{minHeight:40,paddingVertical:e.space.sm},triggerRow:{flexDirection:"row",alignItems:"center",columnGap:e.space.sm},triggerText:{includeFontPadding:!1},helperText:{includeFontPadding:!1,marginTop:e.space.xs,textAlign:"center"},strip:{paddingVertical:e.space.xxs},tile:{borderWidth:1,overflow:"hidden"},addTile:{borderStyle:"dashed",alignItems:"center",justifyContent:"center"},addTileText:{fontSize:e.text["3xl"].size,includeFontPadding:!1},thumbnailImage:{width:"100%",height:"100%",resizeMode:"cover"},extensionTile:{width:"100%",height:"100%",alignItems:"center",justifyContent:"center"},extensionText:{fontSize:e.text.sm.size,letterSpacing:1,includeFontPadding:!1},tileOverlay:{...StyleSheet.absoluteFill,alignItems:"center",justifyContent:"center"},tileOverlayText:{fontSize:e.text.sm.size,includeFontPadding:!1,marginBottom:e.space.xs},tileProgressTrack:{position:"absolute",left:8,right:8,bottom:8,height:3,borderRadius:e.radius.pill,...smoothCorners,overflow:"hidden"},tileProgressFill:{height:"100%",borderRadius:e.radius.pill,...smoothCorners},doneBadge:{position:"absolute",right:4,bottom:4,width:18,height:18,borderRadius:e.radius.pill,...smoothCorners,alignItems:"center",justifyContent:"center"},doneBadgeText:{fontSize:e.text.xs.size,includeFontPadding:!1},removeButton:{position:"absolute",top:4,right:4,width:20,height:20,borderRadius:e.radius.pill,...smoothCorners,alignItems:"center",justifyContent:"center"},removeButtonText:{fontSize:e.text.sm.size,lineHeight:15,includeFontPadding:!1},retryText:{fontSize:e.text.xl.size,includeFontPadding:!1},listRow:{flexDirection:"row",alignItems:"center",borderWidth:1,padding:e.space.sm,columnGap:e.space.sm},listThumb:{width:40,height:40,overflow:"hidden"},listTextWrap:{flex:1},listName:{includeFontPadding:!1},listSubtitle:{includeFontPadding:!1,marginTop:e.space.xxs},listProgressTrack:{height:3,borderRadius:e.radius.pill,...smoothCorners,overflow:"hidden",marginTop:e.space.xs},listProgressFill:{height:"100%",borderRadius:e.radius.pill,...smoothCorners},listRemoveText:{fontSize:e.text["2xl"].size,includeFontPadding:!1,paddingHorizontal:e.space.xs},errorText:{includeFontPadding:!1}});export{FilePicker};export default FilePicker;
@@ -1 +1 @@
1
- "use strict";import{forwardRef}from"react";import{Animated,Pressable,StyleSheet}from"react-native";import{usePressAnimation}from"../../hooks/usePressAnimation.js";import{useTheme}from"../../theme/index.js";import{resolveHaptic,triggerHaptic}from"../../utils/index.js";import{tintOf}from"../../utils/color.js";import{smoothCorners}from"../../utils/corners.js";import{hitSlopMarker}from"../../utils/hitSlop.js";import{renderSlotIcon}from"../AppIcon/slotIcon.js";import{Spinner}from"../Spinner/index.js";import{jsx as _jsx}from"react/jsx-runtime";const GLASS_RIM_WIDTH=1,HIT_SLOP=6,SOFT_FILL_OPACITY=.14,SIZE_MAP={sm:{diameter:32,icon:16},md:{diameter:40,icon:20},lg:{diameter:48,icon:24}},toneFor=(e,o)=>{switch(o){case"secondary":return{base:e.colors.neutral,on:e.colors["on-neutral"],fg:e.colors.neutral};case"success":return{base:e.colors.success,on:e.colors["on-success"],fg:e.colors["success-text"]};case"warning":return{base:e.colors.warning,on:e.colors["on-warning"],fg:e.colors["warning-text"]};case"danger":return{base:e.colors.danger,on:e.colors["on-danger"],fg:e.colors["danger-text"]};case"neutral":return{base:e.colors["bg-muted"],on:e.colors["text-body"],fg:e.colors["text-body"]};default:return{base:e.colors.primary,on:e.colors["on-primary"],fg:e.colors.primary}}},IconButton=forwardRef((e,o)=>{const{icon:s,iconVariant:r,onPress:t,accessibilityLabel:n,tone:i="primary",variant:a="solid",size:l="md",shape:c="circle",active:d=!1,disabled:m=!1,loading:u=!1,haptic:b,style:p,testID:f}=e,g=useTheme(),y=SIZE_MAP[l],I=m||u,{style:h,pressIn:S,pressOut:x}=usePressAnimation({scaleTo:.92,enabled:!I}),{base:j,on:P,fg:_}=toneFor(g,i),A=d?"solid":a;let w="transparent",C="transparent",O=0,T=I?g.colors["text-disabled"]:_;"solid"===A?(w=I?g.colors["surface-disabled"]:j,T=I?g.colors["text-disabled"]:P):"soft"===A?w=I?g.colors["surface-disabled"]:tintOf(j,.14,g.colors["bg-subtle"]):"outline"===A?(C=I?g.colors.border:j,O=g.size.border):"glass"===A&&(w=g.colors["glass-fill"],C=g.colors["glass-border"],O=1,T=I?g.colors["text-disabled"]:g.colors["on-glass"]);const H={color:T,size:y.icon,disabled:I},L="circle"===c?y.diameter/2:g.radius.md;return _jsx(Pressable,{ref:o,onPress:e=>{if(I)return;const o=resolveHaptic(b,"selection");o&&triggerHaptic(o),t?.(e)},onPressIn:S,onPressOut:x,disabled:I,accessibilityRole:"button",accessibilityLabel:n,accessibilityState:{disabled:I,selected:d},"aria-disabled":I,"aria-selected":d,hitSlop:6,...hitSlopMarker(6),testID:f,style:({pressed:e})=>[styles.base,{width:y.diameter,height:y.diameter,borderRadius:L,...smoothCorners,backgroundColor:w,borderColor:C,borderWidth:O,opacity:e&&"solid"!==A?.7:1},p],children:_jsx(Animated.View,{style:[styles.content,h],children:u?_jsx(Spinner,{size:"sm",color:T}):renderSlotIcon(s,H,r)})})});IconButton.displayName="IconButton";const styles=StyleSheet.create({base:{alignItems:"center",justifyContent:"center"},content:{alignItems:"center",justifyContent:"center"}});export{IconButton};export default IconButton;
1
+ "use strict";import{forwardRef}from"react";import{Animated,Pressable,StyleSheet}from"react-native";import{usePressAnimation}from"../../hooks/usePressAnimation.js";import{useTheme}from"../../theme/index.js";import{resolveHaptic,triggerHaptic}from"../../utils/index.js";import{tintOf}from"../../utils/color.js";import{smoothCorners}from"../../utils/corners.js";import{hitSlopMarker}from"../../utils/hitSlop.js";import{renderSlotIcon}from"../AppIcon/slotIcon.js";import{Spinner}from"../Spinner/index.js";import{jsx as _jsx}from"react/jsx-runtime";const GLASS_RIM_WIDTH=1,HIT_SLOP=6,SOFT_FILL_OPACITY=.14,SIZE_MAP={sm:{diameter:32,icon:16},md:{diameter:40,icon:20},lg:{diameter:48,icon:24}},toneFor=(e,o)=>{switch(o){case"secondary":return{base:e.colors.neutral,outline:e.colors.border,on:e.colors["on-neutral"],fg:e.colors.neutral};case"success":return{base:e.colors.success,outline:e.colors.success,on:e.colors["on-success"],fg:e.colors["success-text"]};case"warning":return{base:e.colors.warning,outline:e.colors.warning,on:e.colors["on-warning"],fg:e.colors["warning-text"]};case"danger":return{base:e.colors.danger,outline:e.colors.danger,on:e.colors["on-danger"],fg:e.colors["danger-text"]};case"neutral":return{base:e.colors["bg-muted"],outline:e.colors.border,on:e.colors["text-body"],fg:e.colors["text-body"]};default:return{base:e.colors.primary,outline:e.colors.primary,on:e.colors["on-primary"],fg:e.colors.primary}}},IconButton=forwardRef((e,o)=>{const{icon:s,iconVariant:r,onPress:t,accessibilityLabel:n,tone:i="primary",variant:l="solid",size:c="md",shape:a="circle",active:d=!1,disabled:u=!1,loading:m=!1,haptic:b,style:p,testID:f}=e,g=useTheme(),y=SIZE_MAP[c],I=u||m,{style:h,pressIn:S,pressOut:x}=usePressAnimation({scaleTo:.92,enabled:!I}),{base:j,outline:P,on:_,fg:w}=toneFor(g,i),A=d?"solid":l;let C="transparent",O="transparent",T=0,H=I?g.colors["text-disabled"]:w;"solid"===A?(C=I?g.colors["surface-disabled"]:j,H=I?g.colors["text-disabled"]:_):"soft"===A?C=I?g.colors["surface-disabled"]:tintOf(j,.14,g.colors["bg-subtle"]):"outline"===A?(O=I?g.colors.border:P,T=g.size.border):"glass"===A&&(C=g.colors["glass-fill"],O=g.colors["glass-border"],T=1,H=I?g.colors["text-disabled"]:g.colors["on-glass"]);const L={color:H,size:y.icon,disabled:I},v="circle"===a?y.diameter/2:g.radius.md;return _jsx(Pressable,{ref:o,onPress:e=>{if(I)return;const o=resolveHaptic(b,"selection");o&&triggerHaptic(o),t?.(e)},onPressIn:S,onPressOut:x,disabled:I,accessibilityRole:"button",accessibilityLabel:n,accessibilityState:{disabled:I,selected:d},"aria-disabled":I,"aria-selected":d,hitSlop:6,...hitSlopMarker(6),testID:f,style:({pressed:e})=>[styles.base,{width:y.diameter,height:y.diameter,borderRadius:v,...smoothCorners,backgroundColor:C,borderColor:O,borderWidth:T,opacity:e&&"solid"!==A?.7:1},p],children:_jsx(Animated.View,{style:[styles.content,h],children:m?_jsx(Spinner,{size:"sm",color:H}):renderSlotIcon(s,L,r)})})});IconButton.displayName="IconButton";const styles=StyleSheet.create({base:{alignItems:"center",justifyContent:"center"},content:{alignItems:"center",justifyContent:"center"}});export{IconButton};export default IconButton;
@@ -1 +1 @@
1
- "use strict";import React,{useCallback,useMemo,useRef,useState}from"react";import{Dimensions,Image,Pressable,Modal as RNModal,StyleSheet,Text,View}from"react-native";import{Gesture,GestureDetector}from"react-native-gesture-handler";import Animated,{runOnJS,useAnimatedStyle,useSharedValue,withSpring,withTiming}from"react-native-reanimated";import{useTheme}from"../../theme/index.js";import{resolveHaptic,triggerHaptic}from"../../utils/index.js";import{smoothCorners}from"../../utils/corners.js";import{defaultIcons}from"../AppIcon/defaultIcons.js";import{Carousel}from"../Carousel/index.js";import{Skeleton}from"../Skeleton/index.js";import{ToastHost}from"../Toast/ToastProvider.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const MAX_SCALE_FALLBACK=4,MIN_SCALE_FALLBACK=1,DOUBLE_TAP_SCALE_FALLBACK=2,SPRING_CONFIG={damping:18,stiffness:220,mass:1},ImageGallery=({images:e,initialIndex:t=0,showThumbnails:a=!0,showCounter:i=!0,enableLightbox:l=!0,enablePinchZoom:s=!0,onIndexChange:o,haptic:n,loading:r=!1,accessibilityLabel:u,containerStyle:c,testID:h})=>{const d=useTheme(),m=useMemo(()=>buildStyles(d),[d]),[g,p]=useState(clamp(t,0,Math.max(0,e.length-1))),[b,S]=useState(!1),x=useCallback(e=>{p(e),o?.(e)},[o]),v=useCallback(()=>{if(!l)return;const e=resolveHaptic(n,"selection");e&&triggerHaptic(e),S(!0)},[l,n]),I=useCallback(()=>{const e=resolveHaptic(n,"selection");e&&triggerHaptic(e),S(!1)},[n]),y=useCallback((t,a)=>{const i=t.alt??`Image ${a+1} of ${e.length}`;return _jsx(Pressable,{onPress:v,accessibilityRole:"image",accessibilityLabel:i,accessibilityHint:l?"Tap to open fullscreen":void 0,style:m.imageWrap,children:_jsx(Image,{source:t.source,style:m.image,resizeMode:"cover"})})},[l,e.length,v,m]),w=useCallback(e=>_jsx(Image,{source:e.source,style:m.thumbnailImage,resizeMode:"cover"}),[m]),C=_jsxs(View,{style:[m.container,c],testID:h,accessibilityLabel:u??"Image gallery",children:[_jsxs(View,{style:m.carouselWrap,children:[_jsx(Carousel,{data:e,defaultIndex:t,onIndexChange:x,renderItem:y,showPagination:!1,showThumbnails:a,renderThumbnail:w,haptic:n}),i&&e.length>0?_jsx(View,{style:m.counterPill,pointerEvents:"none",children:_jsx(Text,{style:[m.counterText,{color:d.colors["on-scrim"]}],accessibilityLabel:`Image ${g+1} of ${e.length}`,children:`${g+1} / ${e.length}`})}):null]}),l?_jsx(Lightbox,{visible:b,images:e,initialIndex:g,enablePinchZoom:s,showCounter:i,onClose:I,onIndexChange:x,haptic:n}):null]});return r?_jsx(ImageGallerySkeleton,{images:e,showThumbnails:a,showCounter:i,containerStyle:c,testID:h}):C};ImageGallery.displayName="ImageGallery";const ImageGallerySkeleton=({images:e,showThumbnails:t=!0,showCounter:a=!0,containerStyle:i,testID:l})=>{const s=useTheme(),o=Math.min(e?.length||4,6);return _jsxs(View,{style:[{width:"100%"},i],testID:l,accessibilityRole:"progressbar",accessibilityState:{busy:!0},"aria-busy":!0,children:[_jsxs(View,{style:{position:"relative"},children:[_jsx(Skeleton,{width:"100%",height:280,radius:"lg"}),a?_jsx(View,{style:{position:"absolute",top:12,right:12},children:_jsx(Skeleton,{width:44,height:22,radius:"pill"})}):null]}),t?_jsx(View,{style:{flexDirection:"row",marginTop:s.space.md},children:Array.from({length:o}).map((e,t)=>_jsx(Skeleton,{width:64,height:64,radius:"md",style:{marginRight:s.space.sm}},`sk-thumb-${t}`))}):null]})};ImageGallerySkeleton.displayName="ImageGallerySkeleton",ImageGallery.Skeleton=ImageGallerySkeleton;const Lightbox=({visible:e,images:t,initialIndex:a,enablePinchZoom:i,showCounter:l,onClose:s,onIndexChange:o,haptic:n})=>{const r=useTheme(),u=useMemo(()=>buildLightboxStyles(r),[r]),c=useRef(null),[h,d]=useState(a),m=useCallback(e=>{if(e!==h){const t=resolveHaptic(n,"selection");t&&triggerHaptic(t),d(e),o(e)}},[h,o,n]),g=useCallback((e,a)=>_jsx(ZoomableImage,{image:e,index:a,total:t.length,active:a===h,enabled:i,maxScale:4,minScale:1,doubleTapScale:2,haptic:n}),[h,i,t.length,n]),p=t[h]?.caption;return _jsx(RNModal,{visible:e,transparent:!0,statusBarTranslucent:!0,presentationStyle:"overFullScreen",animationType:"fade",onRequestClose:s,accessibilityViewIsModal:!0,children:_jsxs(View,{style:u.backdrop,accessibilityViewIsModal:!0,children:[_jsx(Carousel,{ref:c,data:t,defaultIndex:a,onIndexChange:m,renderItem:g,showPagination:!1,haptic:n}),l&&t.length>0?_jsx(View,{style:u.counterPill,pointerEvents:"none",children:_jsx(Text,{style:[u.counterText,{color:r.colors["on-scrim"]}],accessibilityLabel:`Image ${h+1} of ${t.length}`,children:`${h+1} / ${t.length}`})}):null,_jsx(Pressable,{onPress:s,accessibilityRole:"button",accessibilityLabel:"Close gallery",style:u.closeButton,hitSlop:12,children:(r.settings.icons.close??defaultIcons.close)({size:24,color:r.colors["on-scrim"]})}),p?_jsx(Animated.View,{style:u.captionWrap,entering:void 0,accessibilityElementsHidden:!1,children:_jsx(Text,{style:u.captionText,numberOfLines:3,children:p})}):null,_jsx(ToastHost,{})]})})},ZoomableImage=({image:e,index:t,total:a,active:i,enabled:l,maxScale:s,minScale:o,doubleTapScale:n,haptic:r})=>{const u=Dimensions.get("window"),c=useSharedValue(1),h=useSharedValue(1),d=useSharedValue(0),m=useSharedValue(0),g=useSharedValue(0),p=useSharedValue(0),b=useCallback(()=>{c.value=withSpring(1,SPRING_CONFIG),h.value=1,d.value=withSpring(0,SPRING_CONFIG),m.value=withSpring(0,SPRING_CONFIG),g.value=0,p.value=0},[c,h,d,m,g,p]);React.useEffect(()=>{i||(c.value=withTiming(1,{duration:150}),d.value=withTiming(0,{duration:150}),m.value=withTiming(0,{duration:150}),h.value=1,g.value=0,p.value=0)},[i,c,d,m,h,g,p]);const S=useCallback(()=>{!1!==r&&triggerHaptic("impactLight")},[r]),x=useMemo(()=>Gesture.Pinch().enabled(l).onStart(()=>{"worklet";h.value=c.value}).onUpdate(e=>{"worklet";const t=h.value*e.scale;c.value=t<o?o+.3*(t-o):t>s?s+.2*(t-s):t}).onEnd(()=>{"worklet";return c.value<o?(c.value=withSpring(o,SPRING_CONFIG),d.value=withSpring(0,SPRING_CONFIG),m.value=withSpring(0,SPRING_CONFIG),h.value=o,g.value=0,void(p.value=0)):c.value>s?(c.value=withSpring(s,SPRING_CONFIG),void(h.value=s)):void(h.value=c.value)}),[l,c,h,d,m,g,p,o,s]),v=useMemo(()=>Gesture.Pan().minPointers(1).maxPointers(1).onStart(()=>{"worklet";g.value=d.value,p.value=m.value}).onUpdate(e=>{"worklet";c.value<=1||(d.value=g.value+e.translationX,m.value=p.value+e.translationY)}).onEnd(()=>{"worklet";g.value=d.value,p.value=m.value}),[c,d,m,g,p]),I=useMemo(()=>Gesture.Tap().numberOfTaps(2).onEnd(()=>{"worklet";runOnJS(S)(),c.value>1?(c.value=withSpring(1,SPRING_CONFIG),d.value=withSpring(0,SPRING_CONFIG),m.value=withSpring(0,SPRING_CONFIG),h.value=1,g.value=0,p.value=0):(c.value=withSpring(n,SPRING_CONFIG),h.value=n)}),[c,h,d,m,g,p,S,n]),y=useMemo(()=>Gesture.Race(x,v,I),[x,v,I]),w=useAnimatedStyle(()=>({transform:[{translateX:d.value},{translateY:m.value},{scale:c.value}]}));React.useEffect(()=>{i||b()},[i,b]);const C=e.alt??`Image ${t+1} of ${a}`;return _jsx(GestureDetector,{gesture:y,children:_jsx(Animated.View,{style:[lightboxImageStyles.container,{width:u.width}],children:_jsx(Animated.Image,{source:e.source,resizeMode:"contain",style:[lightboxImageStyles.image,w],accessibilityLabel:C,accessible:!0})})})},clamp=(e,t,a)=>Math.min(Math.max(e,t),a),buildStyles=e=>StyleSheet.create({container:{width:"100%"},carouselWrap:{width:"100%",position:"relative"},imageWrap:{width:"100%",aspectRatio:16/9,backgroundColor:e.colors["bg-subtle"],overflow:"hidden",borderRadius:e.radius.md,...smoothCorners},image:{width:"100%",height:"100%"},thumbnailImage:{width:"100%",height:"100%"},counterPill:{position:"absolute",top:12,alignSelf:"center",paddingHorizontal:e.space.md,paddingVertical:e.space.xs,borderRadius:e.radius.pill,...smoothCorners,backgroundColor:"rgba(0,0,0,0.55)"},counterText:{fontSize:e.text.sm.size,fontWeight:e.weight.semibold}}),buildLightboxStyles=e=>StyleSheet.create({backdrop:{flex:1,backgroundColor:"#000",justifyContent:"center"},counterPill:{position:"absolute",top:48,alignSelf:"center",paddingHorizontal:e.space.md,paddingVertical:e.space.xs,borderRadius:e.radius.pill,...smoothCorners,backgroundColor:"rgba(0,0,0,0.6)"},counterText:{fontSize:e.text.sm.size,fontWeight:e.weight.semibold},closeButton:{position:"absolute",top:44,right:16,width:40,height:40,borderRadius:e.radius.pill,...smoothCorners,alignItems:"center",justifyContent:"center",backgroundColor:"rgba(0,0,0,0.5)"},captionWrap:{position:"absolute",left:0,right:0,bottom:32,paddingHorizontal:e.space.xl},captionText:{color:"#FFFFFF",fontSize:e.text.base.size,lineHeight:21,textAlign:"center"}}),lightboxImageStyles=StyleSheet.create({container:{flex:1,alignItems:"center",justifyContent:"center"},image:{width:"100%",height:"100%"}});export{ImageGallery};export default ImageGallery;
1
+ "use strict";import React,{useCallback,useMemo,useRef,useState}from"react";import{Dimensions,Image,Pressable,Modal as RNModal,StyleSheet,Text,View}from"react-native";import{Gesture,GestureDetector}from"react-native-gesture-handler";import Animated,{runOnJS,useAnimatedStyle,useSharedValue,withSpring,withTiming}from"react-native-reanimated";import{useTheme}from"../../theme/index.js";import{resolveHaptic,triggerHaptic}from"../../utils/index.js";import{smoothCorners}from"../../utils/corners.js";import{hitSlopMarker}from"../../utils/hitSlop.js";import{defaultIcons}from"../AppIcon/defaultIcons.js";import{Carousel}from"../Carousel/index.js";import{Skeleton}from"../Skeleton/index.js";import{ToastHost}from"../Toast/ToastProvider.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const MAX_SCALE_FALLBACK=4,MIN_SCALE_FALLBACK=1,DOUBLE_TAP_SCALE_FALLBACK=2,SPRING_CONFIG={damping:18,stiffness:220,mass:1},ImageGallery=({images:e,initialIndex:t=0,showThumbnails:a=!0,showCounter:i=!0,enableLightbox:l=!0,enablePinchZoom:s=!0,onIndexChange:o,haptic:n,loading:r=!1,accessibilityLabel:u,containerStyle:c,testID:h})=>{const m=useTheme(),d=useMemo(()=>buildStyles(m),[m]),[g,p]=useState(clamp(t,0,Math.max(0,e.length-1))),[b,S]=useState(!1),x=useCallback(e=>{p(e),o?.(e)},[o]),v=useCallback(()=>{if(!l)return;const e=resolveHaptic(n,"selection");e&&triggerHaptic(e),S(!0)},[l,n]),I=useCallback(()=>{const e=resolveHaptic(n,"selection");e&&triggerHaptic(e),S(!1)},[n]),y=useCallback((t,a)=>{const i=t.alt??`Image ${a+1} of ${e.length}`;return _jsx(Pressable,{onPress:v,accessibilityRole:"image",accessibilityLabel:i,accessibilityHint:l?"Tap to open fullscreen":void 0,style:d.imageWrap,children:_jsx(Image,{source:t.source,style:d.image,resizeMode:"cover"})})},[l,e.length,v,d]),w=useCallback(e=>_jsx(Image,{source:e.source,style:d.thumbnailImage,resizeMode:"cover"}),[d]),C=_jsxs(View,{style:[d.container,c],testID:h,accessibilityLabel:u??"Image gallery",children:[_jsxs(View,{style:d.carouselWrap,children:[_jsx(Carousel,{data:e,defaultIndex:t,onIndexChange:x,renderItem:y,showPagination:!1,showThumbnails:a,renderThumbnail:w,haptic:n}),i&&e.length>0?_jsx(View,{style:d.counterPill,pointerEvents:"none",children:_jsx(Text,{style:[d.counterText,{color:m.colors["on-scrim"]}],accessibilityLabel:`Image ${g+1} of ${e.length}`,children:`${g+1} / ${e.length}`})}):null]}),l?_jsx(Lightbox,{visible:b,images:e,initialIndex:g,enablePinchZoom:s,showCounter:i,onClose:I,onIndexChange:x,haptic:n}):null]});return r?_jsx(ImageGallerySkeleton,{images:e,showThumbnails:a,showCounter:i,containerStyle:c,testID:h}):C};ImageGallery.displayName="ImageGallery";const ImageGallerySkeleton=({images:e,showThumbnails:t=!0,showCounter:a=!0,containerStyle:i,testID:l})=>{const s=useTheme(),o=Math.min(e?.length||4,6);return _jsxs(View,{style:[{width:"100%"},i],testID:l,accessibilityRole:"progressbar",accessibilityState:{busy:!0},"aria-busy":!0,children:[_jsxs(View,{style:{position:"relative"},children:[_jsx(Skeleton,{width:"100%",height:280,radius:"lg"}),a?_jsx(View,{style:{position:"absolute",top:12,right:12},children:_jsx(Skeleton,{width:44,height:22,radius:"pill"})}):null]}),t?_jsx(View,{style:{flexDirection:"row",marginTop:s.space.md},children:Array.from({length:o}).map((e,t)=>_jsx(Skeleton,{width:64,height:64,radius:"md",style:{marginRight:s.space.sm}},`sk-thumb-${t}`))}):null]})};ImageGallerySkeleton.displayName="ImageGallerySkeleton",ImageGallery.Skeleton=ImageGallerySkeleton;const Lightbox=({visible:e,images:t,initialIndex:a,enablePinchZoom:i,showCounter:l,onClose:s,onIndexChange:o,haptic:n})=>{const r=useTheme(),u=useMemo(()=>buildLightboxStyles(r),[r]),c=useRef(null),[h,m]=useState(a),d=useCallback(e=>{if(e!==h){const t=resolveHaptic(n,"selection");t&&triggerHaptic(t),m(e),o(e)}},[h,o,n]),g=useCallback((e,a)=>_jsx(ZoomableImage,{image:e,index:a,total:t.length,active:a===h,enabled:i,maxScale:4,minScale:1,doubleTapScale:2,haptic:n}),[h,i,t.length,n]),p=t[h]?.caption;return _jsx(RNModal,{visible:e,transparent:!0,statusBarTranslucent:!0,presentationStyle:"overFullScreen",animationType:"fade",onRequestClose:s,accessibilityViewIsModal:!0,children:_jsxs(View,{style:u.backdrop,accessibilityViewIsModal:!0,children:[_jsx(Carousel,{ref:c,data:t,defaultIndex:a,onIndexChange:d,renderItem:g,showPagination:!1,haptic:n}),l&&t.length>0?_jsx(View,{style:u.counterPill,pointerEvents:"none",children:_jsx(Text,{style:[u.counterText,{color:r.colors["on-scrim"]}],accessibilityLabel:`Image ${h+1} of ${t.length}`,children:`${h+1} / ${t.length}`})}):null,_jsx(Pressable,{onPress:s,accessibilityRole:"button",accessibilityLabel:"Close gallery",style:u.closeButton,hitSlop:12,...hitSlopMarker(12),children:(r.settings.icons.close??defaultIcons.close)({size:24,color:r.colors["on-scrim"]})}),p?_jsx(Animated.View,{style:u.captionWrap,entering:void 0,accessibilityElementsHidden:!1,children:_jsx(Text,{style:u.captionText,numberOfLines:3,children:p})}):null,_jsx(ToastHost,{})]})})},ZoomableImage=({image:e,index:t,total:a,active:i,enabled:l,maxScale:s,minScale:o,doubleTapScale:n,haptic:r})=>{const u=Dimensions.get("window"),c=useSharedValue(1),h=useSharedValue(1),m=useSharedValue(0),d=useSharedValue(0),g=useSharedValue(0),p=useSharedValue(0),b=useCallback(()=>{c.value=withSpring(1,SPRING_CONFIG),h.value=1,m.value=withSpring(0,SPRING_CONFIG),d.value=withSpring(0,SPRING_CONFIG),g.value=0,p.value=0},[c,h,m,d,g,p]);React.useEffect(()=>{i||(c.value=withTiming(1,{duration:150}),m.value=withTiming(0,{duration:150}),d.value=withTiming(0,{duration:150}),h.value=1,g.value=0,p.value=0)},[i,c,m,d,h,g,p]);const S=useCallback(()=>{!1!==r&&triggerHaptic("impactLight")},[r]),x=useMemo(()=>Gesture.Pinch().enabled(l).onStart(()=>{"worklet";h.value=c.value}).onUpdate(e=>{"worklet";const t=h.value*e.scale;c.value=t<o?o+.3*(t-o):t>s?s+.2*(t-s):t}).onEnd(()=>{"worklet";return c.value<o?(c.value=withSpring(o,SPRING_CONFIG),m.value=withSpring(0,SPRING_CONFIG),d.value=withSpring(0,SPRING_CONFIG),h.value=o,g.value=0,void(p.value=0)):c.value>s?(c.value=withSpring(s,SPRING_CONFIG),void(h.value=s)):void(h.value=c.value)}),[l,c,h,m,d,g,p,o,s]),v=useMemo(()=>Gesture.Pan().minPointers(1).maxPointers(1).onStart(()=>{"worklet";g.value=m.value,p.value=d.value}).onUpdate(e=>{"worklet";c.value<=1||(m.value=g.value+e.translationX,d.value=p.value+e.translationY)}).onEnd(()=>{"worklet";g.value=m.value,p.value=d.value}),[c,m,d,g,p]),I=useMemo(()=>Gesture.Tap().numberOfTaps(2).onEnd(()=>{"worklet";runOnJS(S)(),c.value>1?(c.value=withSpring(1,SPRING_CONFIG),m.value=withSpring(0,SPRING_CONFIG),d.value=withSpring(0,SPRING_CONFIG),h.value=1,g.value=0,p.value=0):(c.value=withSpring(n,SPRING_CONFIG),h.value=n)}),[c,h,m,d,g,p,S,n]),y=useMemo(()=>Gesture.Race(x,v,I),[x,v,I]),w=useAnimatedStyle(()=>({transform:[{translateX:m.value},{translateY:d.value},{scale:c.value}]}));React.useEffect(()=>{i||b()},[i,b]);const C=e.alt??`Image ${t+1} of ${a}`;return _jsx(GestureDetector,{gesture:y,children:_jsx(Animated.View,{style:[lightboxImageStyles.container,{width:u.width}],children:_jsx(Animated.Image,{source:e.source,resizeMode:"contain",style:[lightboxImageStyles.image,w],accessibilityLabel:C,accessible:!0})})})},clamp=(e,t,a)=>Math.min(Math.max(e,t),a),buildStyles=e=>StyleSheet.create({container:{width:"100%"},carouselWrap:{width:"100%",position:"relative"},imageWrap:{width:"100%",aspectRatio:16/9,backgroundColor:e.colors["bg-subtle"],overflow:"hidden",borderRadius:e.radius.md,...smoothCorners},image:{width:"100%",height:"100%"},thumbnailImage:{width:"100%",height:"100%"},counterPill:{position:"absolute",top:12,alignSelf:"center",paddingHorizontal:e.space.md,paddingVertical:e.space.xs,borderRadius:e.radius.pill,...smoothCorners,backgroundColor:"rgba(0,0,0,0.55)"},counterText:{fontSize:e.text.sm.size,fontWeight:e.weight.semibold}}),buildLightboxStyles=e=>StyleSheet.create({backdrop:{flex:1,backgroundColor:"#000",justifyContent:"center"},counterPill:{position:"absolute",top:48,alignSelf:"center",paddingHorizontal:e.space.md,paddingVertical:e.space.xs,borderRadius:e.radius.pill,...smoothCorners,backgroundColor:"rgba(0,0,0,0.6)"},counterText:{fontSize:e.text.sm.size,fontWeight:e.weight.semibold},closeButton:{position:"absolute",top:44,right:16,width:40,height:40,borderRadius:e.radius.pill,...smoothCorners,alignItems:"center",justifyContent:"center",backgroundColor:"rgba(0,0,0,0.5)"},captionWrap:{position:"absolute",left:0,right:0,bottom:32,paddingHorizontal:e.space.xl},captionText:{color:"#FFFFFF",fontSize:e.text.base.size,lineHeight:21,textAlign:"center"}}),lightboxImageStyles=StyleSheet.create({container:{flex:1,alignItems:"center",justifyContent:"center"},image:{width:"100%",height:"100%"}});export{ImageGallery};export default ImageGallery;
@@ -1 +1 @@
1
- "use strict";import{forwardRef,useCallback,useMemo,useState}from"react";import{Pressable,StyleSheet,Text,View}from"react-native";import{fontFor,resolveFieldSize,useTheme}from"../../theme/index.js";import{resolveHaptic,triggerHaptic}from"../../utils/index.js";import{Chevron}from"../FieldBase/Chevron.js";import{FieldLabel}from"../FieldBase/FieldBase.js";import{OptionSheet}from"../OptionSheet/OptionSheet.js";import{jsx as _jsx,jsxs as _jsxs,Fragment as _Fragment}from"react/jsx-runtime";const InlineSelect=forwardRef((e,t)=>{const{options:l,getOptionLabel:i,getOptionValue:s,getOptionDisabled:o,getOptionDescription:a,getOptionIcon:r,value:n,onChange:c,placeholder:d,label:p,title:b,searchable:u=!1,haptic:S,disabled:m=!1,size:x="md",color:f,chevronColor:g,chevronSize:h,textStyle:y,style:O,optionStyle:j,selectedOptionStyle:C,optionTextStyle:v,selectedOptionTextStyle:F,accessibilityLabel:_,testID:k}=e,I=useTheme(),T=useMemo(()=>buildStyles(I),[I]),z=resolveFieldSize(I,x),L=useCallback(e=>i?i(e):e.label??"",[i]),H=useCallback(e=>s?s(e):e.value,[s]),w=useCallback(e=>o?o(e):!0===e.disabled,[o]),D=useCallback(e=>a?a(e):e.description,[a]),P=useCallback(e=>r?r(e):e.icon,[r]),[V,B]=useState(!1),M=useMemo(()=>{if(null!=n)return l.find(e=>H(e)===n)},[l,n,H]),R=useCallback(e=>n===e,[n]),$=useCallback(()=>{if(m)return;const e=resolveHaptic(S,"selection");e&&triggerHaptic(e),B(!0)},[m,S]),N=useCallback(()=>{B(!1)},[]),G=useCallback(e=>{if(w(e))return;const t=resolveHaptic(S,"selection");t&&triggerHaptic(t),c(H(e)),N()},[w,H,c,N,S]),q=m?I.colors["text-disabled"]:f??I.colors.primary,A=void 0!==M?L(M):d??"Select",E=void 0!==M?`Selected: ${L(M)}`:d??"No selection",J=_jsxs(Pressable,{ref:t,onPress:$,disabled:m,hitSlop:8,accessibilityRole:"button",accessibilityLabel:_??`${p??b??"Select"}. ${E}`,accessibilityState:{disabled:m,expanded:V},"aria-disabled":m,"aria-expanded":V,testID:k,style:({pressed:e})=>[T.trigger,{columnGap:I.space.xs,opacity:e&&!m?.6:1},O],children:[_jsx(Text,{style:[T.triggerText,{color:q,fontSize:z.text,...fontFor(I,"medium")},y],numberOfLines:1,children:A}),_jsx(Chevron,{color:g??q,size:h??z.icon,open:V})]});return _jsxs(_Fragment,{children:[p?_jsxs(View,{style:T.labelled,children:[_jsx(FieldLabel,{size:x,children:p}),J]}):J,_jsx(OptionSheet,{open:V,onClose:N,title:b,accessibilityLabel:p??b??d??"Options",options:l,labelOf:L,getValue:H,disabledOf:w,descriptionOf:D,iconOf:P,isSelected:R,onSelect:G,searchable:u,optionStyle:j,selectedOptionStyle:C,optionTextStyle:v,selectedOptionTextStyle:F})]})});InlineSelect.displayName="InlineSelect";const buildStyles=e=>StyleSheet.create({labelled:{alignItems:"flex-start"},trigger:{flexDirection:"row",alignItems:"center"},triggerText:{includeFontPadding:!1}});export{InlineSelect};export default InlineSelect;
1
+ "use strict";import{forwardRef,useCallback,useMemo,useState}from"react";import{Pressable,StyleSheet,Text,View}from"react-native";import{fontFor,resolveFieldSize,useTheme}from"../../theme/index.js";import{resolveHaptic,triggerHaptic}from"../../utils/index.js";import{hitSlopMarker}from"../../utils/hitSlop.js";import{Chevron}from"../FieldBase/Chevron.js";import{FieldLabel}from"../FieldBase/FieldBase.js";import{OptionSheet}from"../OptionSheet/OptionSheet.js";import{jsx as _jsx,jsxs as _jsxs,Fragment as _Fragment}from"react/jsx-runtime";const InlineSelect=forwardRef((e,t)=>{const{options:l,getOptionLabel:i,getOptionValue:s,getOptionDisabled:o,getOptionDescription:r,getOptionIcon:a,value:n,onChange:c,placeholder:d,label:p,title:b,searchable:S=!1,haptic:u,disabled:m=!1,size:x="md",color:f,chevronColor:h,chevronSize:g,textStyle:y,style:O,optionStyle:j,selectedOptionStyle:C,optionTextStyle:v,selectedOptionTextStyle:F,accessibilityLabel:k,testID:_}=e,I=useTheme(),T=useMemo(()=>buildStyles(I),[I]),z=resolveFieldSize(I,x),L=useCallback(e=>i?i(e):e.label??"",[i]),H=useCallback(e=>s?s(e):e.value,[s]),w=useCallback(e=>o?o(e):!0===e.disabled,[o]),D=useCallback(e=>r?r(e):e.description,[r]),M=useCallback(e=>a?a(e):e.icon,[a]),[P,V]=useState(!1),B=useMemo(()=>{if(null!=n)return l.find(e=>H(e)===n)},[l,n,H]),R=useCallback(e=>n===e,[n]),$=useCallback(()=>{if(m)return;const e=resolveHaptic(u,"selection");e&&triggerHaptic(e),V(!0)},[m,u]),N=useCallback(()=>{V(!1)},[]),G=useCallback(e=>{if(w(e))return;const t=resolveHaptic(u,"selection");t&&triggerHaptic(t),c(H(e)),N()},[w,H,c,N,u]),q=m?I.colors["text-disabled"]:f??I.colors.primary,A=void 0!==B?L(B):d??"Select",E=void 0!==B?`Selected: ${L(B)}`:d??"No selection",J=k??`${p??b??"Select"}. ${E}`,K=_jsxs(Pressable,{ref:t,onPress:$,disabled:m,hitSlop:8,...hitSlopMarker(8),accessibilityRole:"button",accessibilityLabel:J,accessibilityState:{disabled:m,expanded:P},"aria-disabled":m,"aria-expanded":P,testID:_,style:({pressed:e})=>[T.trigger,{columnGap:I.space.xs,opacity:e&&!m?.6:1},O],children:[_jsx(Text,{style:[T.triggerText,{color:q,fontSize:z.text,...fontFor(I,"medium")},y],numberOfLines:1,children:A}),_jsx(Chevron,{color:h??q,size:g??z.icon,open:P})]});return _jsxs(_Fragment,{children:[p?_jsxs(View,{style:T.labelled,children:[_jsx(FieldLabel,{size:x,children:p}),K]}):K,_jsx(OptionSheet,{open:P,onClose:N,title:b,accessibilityLabel:p??b??d??"Options",options:l,labelOf:L,getValue:H,disabledOf:w,descriptionOf:D,iconOf:M,isSelected:R,onSelect:G,searchable:S,optionStyle:j,selectedOptionStyle:C,optionTextStyle:v,selectedOptionTextStyle:F})]})});InlineSelect.displayName="InlineSelect";const buildStyles=e=>StyleSheet.create({labelled:{alignItems:"flex-start"},trigger:{flexDirection:"row",alignItems:"center"},triggerText:{includeFontPadding:!1}});export{InlineSelect};export default InlineSelect;
@@ -1 +1 @@
1
- "use strict";import{forwardRef,useCallback,useEffect,useMemo,useRef,useState}from"react";import{Animated,Easing,Pressable,StyleSheet,Text,TextInput,View}from"react-native";import{useReducedMotion}from"../../hooks/index.js";import{createAnimatedValue,fontFor,resolveFieldSize,setNativeValue,useTheme}from"../../theme/index.js";import{mergeRefs,triggerHaptic}from"../../utils/index.js";import{defaultIcons}from"../AppIcon/defaultIcons.js";import{renderSlotIcon}from"../AppIcon/slotIcon.js";import{Button}from"../Button/index.js";import{FieldBase,FieldErrorGlyph,FieldLabel,fieldTextAsString,hasFieldText,RequiredPlaceholder,resolveFieldTextStyle}from"../FieldBase/FieldBase.js";import{useFloatingLabel}from"../FieldBase/useFloatingLabel.js";import{NotationInkContext,useNotationInk}from"../Notation/Notation.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const Input=forwardRef((e,t)=>{const{label:i,help:n,placeholder:o,value:l,onChangeText:s,error:r,helperText:a,type:d="input",secureTextEntry:c=!1,showPasswordToggle:u=!1,disabled:p=!1,multiline:f=!1,leftIcon:g,rightIcon:m,unit:x,unitStyle:h,prefix:y,prefixStyle:b,readOnly:v=!1,action:S,actionStyle:j,size:w="md",variant:T,labelMode:F,required:I=!1,maxLength:R,showCounter:_=!0,textAlign:V,format:A,parse:z,style:N,containerStyle:k,inputStyle:C,labelStyle:L,messageStyle:P,borderRadius:D,onFocus:H,onBlur:B,accessibilityLabel:E,testID:M,editable:O,...q}=e,G=useTheme(),W=useMemo(()=>buildStyles(G),[G]),$=resolveFieldSize(G,w),X=G.components.input[w]["multiline-min-height"],J=Math.round($.text*G.leading.body),K=T??G.settings.components.input?.defaultVariant??G.settings.components.field?.defaultVariant??"outlined",Q=F??G.settings.components.input?.defaultLabelMode??"top",[U,Y]=useState(!1),[Z,ee]=useState(!1),te="password"===d||u||c,ie="password"===d||u,ne="textarea"===d||f,oe=ne?Math.round(.1*$.text):0,le="string"==typeof l&&l.length>0,se=hasFieldText(r),re=!0===r||se,ae=hasFieldText(a),de=se||!re&&ae,ce=hasFieldText(i),ue=hasFieldText(y),pe=!p&&!1!==O,fe=U||le||ue,ge=useRef(null),me=useMemo(()=>mergeRefs(ge,t),[t]),xe=useCallback(()=>{pe&&ge.current?.focus()},[pe]),he=ce&&"float"===Q,ye=useRef(createAnimatedValue(0)).current,be=useRef(createAnimatedValue(de?1:0)).current;useEffect(()=>{const e=Animated.timing(be,{toValue:de?1:0,duration:G.motion.duration.fast,easing:Easing.bezier(...G.motion.ease["in-out"]),useNativeDriver:!0});return e.start(),()=>e.stop()},[de,be,G.motion.duration.fast,G.motion.ease["in-out"]]);const ve=useReducedMotion(),Se=G.settings.components.input?.shakeOnError??!1,je=useRef(re);useEffect(()=>{if(!Se)return void(je.current=re);let e;return re&&!je.current&&(ve||(setNativeValue(ye,0),e=Animated.sequence([Animated.timing(ye,{toValue:1,duration:50,useNativeDriver:!0}),Animated.timing(ye,{toValue:-1,duration:50,useNativeDriver:!0}),Animated.timing(ye,{toValue:1,duration:50,useNativeDriver:!0}),Animated.timing(ye,{toValue:-1,duration:50,useNativeDriver:!0}),Animated.timing(ye,{toValue:0,duration:100,useNativeDriver:!0})]),e.start()),triggerHaptic("notificationError")),je.current=re,()=>e?.stop()},[re,ye,Se,ve]);const we=useCallback(e=>{Y(!0),H?.(e)},[H]),Te=useCallback(e=>{Y(!1),B?.(e)},[B]),Fe=useCallback(()=>{triggerHaptic("selection"),ee(e=>!e)},[]),Ie=G.colors["field-caret"],Re=D??$.radius,Ve=G.settings.components.input?.tintLabelOnFocus??!1,Ae=U&&Ve?G.colors["field-border-focus"]:G.colors["field-label"],ze=ye.interpolate({inputRange:[-1,0,1],outputRange:[-6,0,6]}),Ne=Boolean(m)||Boolean(x)||ie,ke="underline"===K,Ce=g?$.icon+G.space.md+1+G.space.md:0,Le=useFloatingLabel({label:i,enabled:he,floated:fe,required:I,variant:K,sizeTokens:$,leadingOffset:Ce,trailingOffset:Ne?$.icon+G.space.sm:0,textAlign:V,paddingLeft:ke?G.space.none:$["padding-x"],lineHeight:ne?J:void 0,restNudge:oe,floatTrim:ne?2:0,color:Ae,style:L}),Pe=resolveFieldTextStyle(G,{disabled:p}),De=Pe.color,He=Pe.placeholderColor,Be=I&&!ce&&!le&&"string"==typeof o&&o.length>0,Ee=re?r:a,Me=_&&"number"==typeof R&&"string"==typeof l?`${l.length} / ${R}`:null,Oe=re?G.colors["field-message"]:G.colors["text-muted"],qe=useNotationInk(P,$["message-text"],Oe),Ge=E??fieldTextAsString(i)??o,We=p?G.colors["field-icon-disabled"]:U?G.colors["field-icon-focus"]:G.colors["field-icon"],$e={focused:U,disabled:p,error:re,color:We,size:$.icon},renderSlot=e=>renderSlotIcon(e,$e),Xe=(()=>{if(ie){const e=(Z?G.settings.icons.eyeOff:G.settings.icons.eye)??(Z?defaultIcons.eyeOff:defaultIcons.eye);return _jsx(Pressable,{onPress:Fe,disabled:!pe,hitSlop:8,accessibilityRole:"button",accessibilityLabel:Z?"Hide password":"Show password",children:e({size:$.icon,color:We})})}const e=x?_jsx(Text,{style:[W.unit,{fontSize:$.text,color:He},h],children:x}):null,t=m?_jsx(View,{children:renderSlot(m)}):null;return e&&t?_jsxs(View,{style:W.trailingRow,children:[e,t]}):e??t})(),Je=g?_jsx(View,{children:renderSlot(g)}):null,Ke=StyleSheet.flatten(b),Qe=Ke?.fontSize??$.text,Ue=Ke?.color??He,Ye=useMemo(()=>({fontSize:Qe,color:Ue}),[Qe,Ue]),Ze=ue?"string"==typeof y||"number"==typeof y?_jsx(Text,{style:[W.prefix,{fontSize:$.text,color:He,marginRight:G.space.xs,lineHeight:ne?J:void 0,paddingTop:ne?oe:void 0},b],children:y}):_jsx(View,{style:[W.prefixNode,{marginRight:G.space.xs,minHeight:ne?J:void 0,justifyContent:"center",paddingTop:ne?oe:void 0}],children:_jsx(Text,{style:[W.prefix,{fontSize:$.text,color:He,lineHeight:ne?J:void 0},b],children:_jsx(NotationInkContext.Provider,{value:Ye,children:y})})}):null,et=S?_jsx(Button,{variant:S.variant??"outline",tone:S.tone??"primary",size:w,title:S.label,leftIcon:S.icon,loading:S.loading,disabled:p||S.disabled,onPress:S.onPress,pressAnimation:!1,testID:S.testID,style:[W.action,{minHeight:$["min-height"],alignSelf:ne?"flex-start":"stretch"},j]}):null;return _jsxs(Animated.View,{style:[W.container,{transform:[{translateX:ze}]},N],children:[ce&&!he?_jsx(FieldLabel,{size:w,required:I,help:n,color:Ae,style:L,children:i}):null,_jsxs(View,{style:[W.fieldRow,{columnGap:G.space.sm,alignItems:ne?"flex-start":"stretch"}],children:[_jsxs(View,{style:W.fieldWrapper,children:[_jsxs(FieldBase,{size:w,variant:K,focused:U,disabled:p,error:re,filled:le,minHeight:ne?X:void 0,borderRadius:Re,leading:Je,leadingDivider:null!=g,paddingLeft:ke?G.space.none:void 0,trailing:Xe,slotAlign:ne?"top":"center",slotLineHeight:ne?J:void 0,topNotch:Le.topNotch,onPress:xe,pressFeedback:!1,style:k,children:[Ze,_jsxs(View,{style:W.inputWrap,children:[_jsx(TextInput,{ref:me,style:[W.input,{color:De,fontSize:$.text,...Pe.weightStyle,paddingLeft:ke?G.space.none:void 0,minHeight:ne?X-2*$["padding-y"]:void 0,lineHeight:ne?J:void 0,paddingTop:ne?oe:void 0,textAlignVertical:ne?"top":"center"},C],textAlign:V,placeholder:he&&!fe||Be?void 0:o,placeholderTextColor:He,value:A&&null!=l?A(l):l,onChangeText:e=>{s&&s(z?z(e):e)},onFocus:we,onBlur:Te,editable:pe,readOnly:v,secureTextEntry:te&&!Z,multiline:ne,autoCapitalize:te?"none":void 0,autoCorrect:!te&&void 0,maxLength:R,selectionColor:Ie,accessibilityLabel:Ge,accessibilityState:{disabled:p},"aria-disabled":p,testID:M,...q}),Be?_jsx(RequiredPlaceholder,{text:o,color:He,fontSize:$.text,weightStyle:Pe.weightStyle,align:ne?"top":"center",paddingTop:ne?oe:void 0,textAlign:V}):null]})]}),Le.node]}),et]}),de||Me?_jsxs(View,{style:[W.footerRow,{marginTop:$["message-gap"]}],children:[de?_jsxs(Animated.View,{style:[W.messageRow,{columnGap:G.space.xs,opacity:be}],accessibilityLiveRegion:re?"polite":"none",children:[re?_jsx(FieldErrorGlyph,{size:$["message-text"],color:Oe}):null,_jsx(Text,{style:[W.messageText,{color:Oe,fontSize:$["message-text"],...fontFor(G,"normal")},P],children:_jsx(NotationInkContext.Provider,{value:qe,children:Ee})})]}):_jsx(View,{style:W.footerSpacer}),Me?_jsx(Text,{style:[W.counterText,{color:G.colors["text-subtle"],fontSize:$["message-text"],...fontFor(G,"normal")}],children:Me}):null]}):null]})});Input.displayName="Input";const buildStyles=e=>StyleSheet.create({container:{width:"100%"},fieldRow:{flexDirection:"row"},fieldWrapper:{position:"relative",overflow:"visible",flex:1},action:{flexShrink:0},input:{padding:e.space.none,margin:e.space.none,includeFontPadding:!1},prefix:{flexShrink:0,includeFontPadding:!1},prefixNode:{flexShrink:0},inputWrap:{flex:1,alignSelf:"stretch",justifyContent:"center"},unit:{includeFontPadding:!1},trailingRow:{flexDirection:"row",alignItems:"center",columnGap:e.space.sm},footerRow:{flexDirection:"row",alignItems:"center",justifyContent:"space-between",columnGap:e.space.sm},footerSpacer:{flex:1},messageRow:{flex:1,flexDirection:"row",alignItems:"center"},messageText:{flexShrink:1,includeFontPadding:!1},counterText:{flexShrink:0,includeFontPadding:!1}});export{Input};export default Input;
1
+ "use strict";import{forwardRef,useCallback,useEffect,useMemo,useRef,useState}from"react";import{Animated,Easing,Pressable,StyleSheet,Text,TextInput,View}from"react-native";import{useReducedMotion}from"../../hooks/index.js";import{createAnimatedValue,fontFor,resolveFieldSize,setNativeValue,useTheme}from"../../theme/index.js";import{mergeRefs,triggerHaptic}from"../../utils/index.js";import{hitSlopMarker}from"../../utils/hitSlop.js";import{defaultIcons}from"../AppIcon/defaultIcons.js";import{renderSlotIcon}from"../AppIcon/slotIcon.js";import{Button}from"../Button/index.js";import{FieldBase,FieldErrorGlyph,FieldLabel,fieldTextAsString,hasFieldText,RequiredPlaceholder,resolveFieldTextStyle}from"../FieldBase/FieldBase.js";import{useFloatingLabel}from"../FieldBase/useFloatingLabel.js";import{NotationInkContext,useNotationInk}from"../Notation/Notation.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const Input=forwardRef((e,t)=>{const{label:i,help:o,placeholder:n,value:l,onChangeText:s,error:r,helperText:a,type:d="input",secureTextEntry:c=!1,showPasswordToggle:u=!1,disabled:p=!1,multiline:f=!1,leftIcon:g,rightIcon:m,unit:x,unitStyle:h,prefix:y,prefixStyle:b,readOnly:v=!1,action:S,actionStyle:j,size:w="md",variant:T,labelMode:F,required:I=!1,maxLength:R,showCounter:_=!0,textAlign:V,format:A,parse:k,style:z,containerStyle:N,inputStyle:C,labelStyle:L,messageStyle:P,borderRadius:D,onFocus:H,onBlur:B,accessibilityLabel:M,testID:E,editable:O,...q}=e,G=useTheme(),W=useMemo(()=>buildStyles(G),[G]),$=resolveFieldSize(G,w),X=G.components.input[w]["multiline-min-height"],J=Math.round($.text*G.leading.body),K=T??G.settings.components.input?.defaultVariant??G.settings.components.field?.defaultVariant??"outlined",Q=F??G.settings.components.input?.defaultLabelMode??"top",[U,Y]=useState(!1),[Z,ee]=useState(!1),te="password"===d||u||c,ie="password"===d||u,oe="textarea"===d||f,ne=oe?Math.round(.1*$.text):0,le="string"==typeof l&&l.length>0,se=hasFieldText(r),re=!0===r||se,ae=hasFieldText(a),de=se||!re&&ae,ce=hasFieldText(i),ue=hasFieldText(y),pe=!p&&!1!==O,fe=U||le||ue,ge=useRef(null),me=useMemo(()=>mergeRefs(ge,t),[t]),xe=useCallback(()=>{pe&&ge.current?.focus()},[pe]),he=ce&&"float"===Q,ye=useRef(createAnimatedValue(0)).current,be=useRef(createAnimatedValue(de?1:0)).current;useEffect(()=>{const e=Animated.timing(be,{toValue:de?1:0,duration:G.motion.duration.fast,easing:Easing.bezier(...G.motion.ease["in-out"]),useNativeDriver:!0});return e.start(),()=>e.stop()},[de,be,G.motion.duration.fast,G.motion.ease["in-out"]]);const ve=useReducedMotion(),Se=G.settings.components.input?.shakeOnError??!1,je=useRef(re);useEffect(()=>{if(!Se)return void(je.current=re);let e;return re&&!je.current&&(ve||(setNativeValue(ye,0),e=Animated.sequence([Animated.timing(ye,{toValue:1,duration:50,useNativeDriver:!0}),Animated.timing(ye,{toValue:-1,duration:50,useNativeDriver:!0}),Animated.timing(ye,{toValue:1,duration:50,useNativeDriver:!0}),Animated.timing(ye,{toValue:-1,duration:50,useNativeDriver:!0}),Animated.timing(ye,{toValue:0,duration:100,useNativeDriver:!0})]),e.start()),triggerHaptic("notificationError")),je.current=re,()=>e?.stop()},[re,ye,Se,ve]);const we=useCallback(e=>{Y(!0),H?.(e)},[H]),Te=useCallback(e=>{Y(!1),B?.(e)},[B]),Fe=useCallback(()=>{triggerHaptic("selection"),ee(e=>!e)},[]),Ie=G.colors["field-caret"],Re=D??$.radius,Ve=G.settings.components.input?.tintLabelOnFocus??!1,Ae=U&&Ve?G.colors["field-border-focus"]:G.colors["field-label"],ke=ye.interpolate({inputRange:[-1,0,1],outputRange:[-6,0,6]}),ze=Boolean(m)||Boolean(x)||ie,Ne="underline"===K,Ce=g?$.icon+G.space.md+1+G.space.md:0,Le=useFloatingLabel({label:i,enabled:he,floated:fe,required:I,variant:K,sizeTokens:$,leadingOffset:Ce,trailingOffset:ze?$.icon+G.space.sm:0,textAlign:V,paddingLeft:Ne?G.space.none:$["padding-x"],lineHeight:oe?J:void 0,restNudge:ne,floatTrim:oe?2:0,color:Ae,style:L}),Pe=resolveFieldTextStyle(G,{disabled:p}),De=Pe.color,He=Pe.placeholderColor,Be=I&&!ce&&!le&&"string"==typeof n&&n.length>0,Me=re?r:a,Ee=_&&"number"==typeof R&&"string"==typeof l?`${l.length} / ${R}`:null,Oe=re?G.colors["field-message"]:G.colors["text-muted"],qe=useNotationInk(P,$["message-text"],Oe),Ge=M??fieldTextAsString(i)??n,We=p?G.colors["field-icon-disabled"]:U?G.colors["field-icon-focus"]:G.colors["field-icon"],$e={focused:U,disabled:p,error:re,color:We,size:$.icon},renderSlot=e=>renderSlotIcon(e,$e),Xe=(()=>{if(ie){const e=(Z?G.settings.icons.eyeOff:G.settings.icons.eye)??(Z?defaultIcons.eyeOff:defaultIcons.eye);return _jsx(Pressable,{onPress:Fe,disabled:!pe,hitSlop:8,...hitSlopMarker(8),accessibilityRole:"button",accessibilityLabel:Z?"Hide password":"Show password",children:e({size:$.icon,color:We})})}const e=x?_jsx(Text,{style:[W.unit,{fontSize:$.text,color:He},h],children:x}):null,t=m?_jsx(View,{children:renderSlot(m)}):null;return e&&t?_jsxs(View,{style:W.trailingRow,children:[e,t]}):e??t})(),Je=g?_jsx(View,{children:renderSlot(g)}):null,Ke=StyleSheet.flatten(b),Qe=Ke?.fontSize??$.text,Ue=Ke?.color??He,Ye=useMemo(()=>({fontSize:Qe,color:Ue}),[Qe,Ue]),Ze=ue?"string"==typeof y||"number"==typeof y?_jsx(Text,{style:[W.prefix,{fontSize:$.text,color:He,marginRight:G.space.xs,lineHeight:oe?J:void 0,paddingTop:oe?ne:void 0},b],children:y}):_jsx(View,{style:[W.prefixNode,{marginRight:G.space.xs,minHeight:oe?J:void 0,justifyContent:"center",paddingTop:oe?ne:void 0}],children:_jsx(Text,{style:[W.prefix,{fontSize:$.text,color:He,lineHeight:oe?J:void 0},b],children:_jsx(NotationInkContext.Provider,{value:Ye,children:y})})}):null,et=S?_jsx(Button,{variant:S.variant??"outline",tone:S.tone??"primary",size:w,title:S.label,leftIcon:S.icon,loading:S.loading,disabled:p||S.disabled,onPress:S.onPress,pressAnimation:!1,testID:S.testID,style:[W.action,{minHeight:$["min-height"],alignSelf:oe?"flex-start":"stretch"},j]}):null;return _jsxs(Animated.View,{style:[W.container,{transform:[{translateX:ke}]},z],children:[ce&&!he?_jsx(FieldLabel,{size:w,required:I,help:o,color:Ae,style:L,children:i}):null,_jsxs(View,{style:[W.fieldRow,{columnGap:G.space.sm,alignItems:oe?"flex-start":"stretch"}],children:[_jsxs(View,{style:W.fieldWrapper,children:[_jsxs(FieldBase,{size:w,variant:K,focused:U,disabled:p,error:re,filled:le,minHeight:oe?X:void 0,borderRadius:Re,leading:Je,leadingDivider:null!=g,paddingLeft:Ne?G.space.none:void 0,trailing:Xe,slotAlign:oe?"top":"center",slotLineHeight:oe?J:void 0,topNotch:Le.topNotch,onPress:xe,pressFeedback:!1,style:N,children:[Ze,_jsxs(View,{style:W.inputWrap,children:[_jsx(TextInput,{ref:me,style:[W.input,{color:De,fontSize:$.text,...Pe.weightStyle,paddingLeft:Ne?G.space.none:void 0,minHeight:oe?X-2*$["padding-y"]:void 0,lineHeight:oe?J:void 0,paddingTop:oe?ne:void 0,textAlignVertical:oe?"top":"center"},C],textAlign:V,placeholder:he&&!fe||Be?void 0:n,placeholderTextColor:He,value:A&&null!=l?A(l):l,onChangeText:e=>{s&&s(k?k(e):e)},onFocus:we,onBlur:Te,editable:pe,readOnly:v,secureTextEntry:te&&!Z,multiline:oe,autoCapitalize:te?"none":void 0,autoCorrect:!te&&void 0,maxLength:R,selectionColor:Ie,accessibilityLabel:Ge,accessibilityState:{disabled:p},"aria-disabled":p,testID:E,...q}),Be?_jsx(RequiredPlaceholder,{text:n,color:He,fontSize:$.text,weightStyle:Pe.weightStyle,align:oe?"top":"center",paddingTop:oe?ne:void 0,textAlign:V}):null]})]}),Le.node]}),et]}),de||Ee?_jsxs(View,{style:[W.footerRow,{marginTop:$["message-gap"]}],children:[de?_jsxs(Animated.View,{style:[W.messageRow,{columnGap:G.space.xs,opacity:be}],accessibilityLiveRegion:re?"polite":"none",children:[re?_jsx(FieldErrorGlyph,{size:$["message-text"],color:Oe}):null,_jsx(Text,{style:[W.messageText,{color:Oe,fontSize:$["message-text"],...fontFor(G,"normal")},P],children:_jsx(NotationInkContext.Provider,{value:qe,children:Me})})]}):_jsx(View,{style:W.footerSpacer}),Ee?_jsx(Text,{style:[W.counterText,{color:G.colors["text-subtle"],fontSize:$["message-text"],...fontFor(G,"normal")}],children:Ee}):null]}):null]})});Input.displayName="Input";const buildStyles=e=>StyleSheet.create({container:{width:"100%"},fieldRow:{flexDirection:"row"},fieldWrapper:{position:"relative",overflow:"visible",flex:1},action:{flexShrink:0},input:{padding:e.space.none,margin:e.space.none,includeFontPadding:!1},prefix:{flexShrink:0,includeFontPadding:!1},prefixNode:{flexShrink:0},inputWrap:{flex:1,alignSelf:"stretch",justifyContent:"center"},unit:{includeFontPadding:!1},trailingRow:{flexDirection:"row",alignItems:"center",columnGap:e.space.sm},footerRow:{flexDirection:"row",alignItems:"center",justifyContent:"space-between",columnGap:e.space.sm},footerSpacer:{flex:1},messageRow:{flex:1,flexDirection:"row",alignItems:"center"},messageText:{flexShrink:1,includeFontPadding:!1},counterText:{flexShrink:0,includeFontPadding:!1}});export{Input};export default Input;
@@ -1 +1 @@
1
- "use strict";import{Pressable,StyleSheet,View}from"react-native";import{KeyboardController,KeyboardStickyView,useKeyboardState}from"react-native-keyboard-controller";import{useOptionalFormContext}from"../../form/FormContext.js";import{useTheme}from"../../theme/index.js";import{Text}from"../Text/index.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const NavButton=({label:e,accessibilityLabel:o,onPress:t,theme:s})=>_jsx(Pressable,{onPress:t,accessibilityRole:"button",accessibilityLabel:o,hitSlop:8,style:{paddingHorizontal:s.space.sm},children:_jsx(Text,{variant:"body",weight:"semibold",size:"lg",color:"link",children:e})}),KeyboardToolbar=e=>{const{doneLabel:o="Done",showNavigation:t=!0,onDone:s,onNext:r,onPrev:i,leading:l,style:a,testID:n}=e,c=useTheme(),b=useOptionalFormContext();if(!useKeyboardState(e=>e.isVisible))return null;const d=s??(()=>{KeyboardController.dismiss()}),y=i??b?.focusPrev??(()=>KeyboardController.setFocusTo("prev")),x=r??b?.focusNext??(()=>KeyboardController.setFocusTo("next"));return _jsx(KeyboardStickyView,{style:styles.anchor,children:_jsxs(View,{testID:n,accessibilityRole:"toolbar",style:[styles.bar,{backgroundColor:c.colors.surface,borderTopColor:c.colors.border,paddingHorizontal:c.space.md},a],children:[t?_jsxs(View,{style:styles.nav,children:[_jsx(NavButton,{label:"‹",accessibilityLabel:"Previous field",onPress:y,theme:c}),_jsx(NavButton,{label:"›",accessibilityLabel:"Next field",onPress:x,theme:c})]}):_jsx(View,{}),l,_jsx(View,{style:styles.spacer}),_jsx(Pressable,{onPress:d,accessibilityRole:"button",accessibilityLabel:o,hitSlop:8,children:_jsx(Text,{variant:"body",weight:"semibold",color:"link",children:o})})]})})},styles=StyleSheet.create({anchor:{position:"absolute",left:0,right:0,bottom:0},bar:{height:44,flexDirection:"row",alignItems:"center",borderTopWidth:StyleSheet.hairlineWidth},nav:{flexDirection:"row",alignItems:"center"},spacer:{flex:1}});export{KeyboardToolbar};export default KeyboardToolbar;
1
+ "use strict";import{Pressable,StyleSheet,View}from"react-native";import{KeyboardController,KeyboardStickyView,useKeyboardState}from"react-native-keyboard-controller";import{useOptionalFormContext}from"../../form/FormContext.js";import{useTheme}from"../../theme/index.js";import{hitSlopMarker}from"../../utils/hitSlop.js";import{Text}from"../Text/index.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const NavButton=({label:e,accessibilityLabel:o,onPress:t,theme:s})=>_jsx(Pressable,{onPress:t,accessibilityRole:"button",accessibilityLabel:o,hitSlop:8,...hitSlopMarker(8),style:{paddingHorizontal:s.space.sm},children:_jsx(Text,{variant:"body",weight:"semibold",size:"lg",color:"link",children:e})}),KeyboardToolbar=e=>{const{doneLabel:o="Done",showNavigation:t=!0,onDone:s,onNext:r,onPrev:i,leading:l,style:a,testID:n}=e,c=useTheme(),b=useOptionalFormContext();if(!useKeyboardState(e=>e.isVisible))return null;const d=s??(()=>{KeyboardController.dismiss()}),y=i??b?.focusPrev??(()=>KeyboardController.setFocusTo("prev")),x=r??b?.focusNext??(()=>KeyboardController.setFocusTo("next"));return _jsx(KeyboardStickyView,{style:styles.anchor,children:_jsxs(View,{testID:n,accessibilityRole:"toolbar",style:[styles.bar,{backgroundColor:c.colors.surface,borderTopColor:c.colors.border,paddingHorizontal:c.space.md},a],children:[t?_jsxs(View,{style:styles.nav,children:[_jsx(NavButton,{label:"‹",accessibilityLabel:"Previous field",onPress:y,theme:c}),_jsx(NavButton,{label:"›",accessibilityLabel:"Next field",onPress:x,theme:c})]}):_jsx(View,{}),l,_jsx(View,{style:styles.spacer}),_jsx(Pressable,{onPress:d,accessibilityRole:"button",accessibilityLabel:o,hitSlop:8,...hitSlopMarker(8),children:_jsx(Text,{variant:"body",weight:"semibold",color:"link",children:o})})]})})},styles=StyleSheet.create({anchor:{position:"absolute",left:0,right:0,bottom:0},bar:{height:44,flexDirection:"row",alignItems:"center",borderTopWidth:StyleSheet.hairlineWidth},nav:{flexDirection:"row",alignItems:"center"},spacer:{flex:1}});export{KeyboardToolbar};export default KeyboardToolbar;
@@ -1 +1 @@
1
- "use strict";import{useCallback,useEffect,useMemo,useRef,useState}from"react";import{Animated,Dimensions,Easing,FlatList,Modal,Platform,Pressable,StatusBar,StyleSheet,Text,TextInput,View}from"react-native";import{Gesture,GestureDetector,GestureHandlerRootView}from"react-native-gesture-handler";import{useKeyboardState}from"react-native-keyboard-controller";import{useDragToDismiss}from"../../hooks/useDragToDismiss.js";import{usePresenceMotion}from"../../hooks/usePresenceMotion.js";import{createAnimatedValue,setNativeValue,useTheme}from"../../theme/index.js";import{transparentOf}from"../../utils/color.js";import{smoothCorners}from"../../utils/corners.js";import{defaultIcons}from"../AppIcon/defaultIcons.js";import{ModalSafeArea,useModalInsets}from"../ModalSafeArea/ModalSafeArea.js";import{ToastHost}from"../Toast/ToastProvider.js";import{jsx as _jsx,jsxs as _jsxs,Fragment as _Fragment}from"react/jsx-runtime";const AnimatedGestureRoot=Animated.createAnimatedComponent(GestureHandlerRootView),SEARCH_ICON_SIZE=18;export const OptionSheet=e=>{const{open:t,onClose:s,onAfterClose:o,onOpenChange:i,title:r,options:n,sections:a,renderSectionHeader:l,renderOption:c,alphabetIndex:d=!1,searchPlaceholder:u="Search…",emptyText:p="No options",labelOf:m,getValue:h,disabledOf:g,destructiveOf:b,descriptionOf:f,iconOf:x,isSelected:y,onSelect:S,multi:T=!1,searchable:j=!1,searchSelectionColor:w,accessibilityLabel:C,optionStyle:R,selectedOptionStyle:_,optionTextStyle:V,selectedOptionTextStyle:k,testID:I}=e,v=useTheme(),z=usePresenceMotion(),[M,D]=useModalInsets(),A=useMemo(()=>buildStyles(v),[v]),[L,P]=useState(""),H=Dimensions.get("window").height,O=Math.round(.7*H),[E,W]=useState(t),B=useRef(createAnimatedValue(0)).current,F=useRef(createAnimatedValue(O)).current,N=useRef(createAnimatedValue(0)).current,G=useMemo(()=>z.reduced?N:Animated.add(F,N),[z.reduced,F,N]),$=useMemo(()=>z.reduced?F.interpolate({inputRange:[0,O],outputRange:[1,0],extrapolate:"clamp"}):1,[z.reduced,F,O]),{handleGesture:J,opacity:K}=useDragToDismiss({drag:N,travel:O,onDismiss:s}),U=useMemo(()=>Animated.multiply($,K),[$,K]),Y=useMemo(()=>{const e=v.colors.scrim;return B.interpolate({inputRange:[0,1],outputRange:[transparentOf(e),e]})},[B,v.colors.scrim]);useEffect(()=>{t&&W(!0)},[t]);const Z=useRef(i);Z.current=i;const q=useRef(!1);useEffect(()=>{q.current!==t&&(q.current=t,Z.current?.(t))},[t]);const Q=useRef(o);Q.current=o;const X=useRef(E);useEffect(()=>{X.current&&!E&&"ios"!==Platform.OS&&Q.current?.(),X.current=E},[E]),useEffect(()=>{if(!E)return;t&&(setNativeValue(N,0),setNativeValue(K,1));const e=t?Animated.parallel([Animated.timing(B,{toValue:1,duration:z.duration("default"),easing:Easing.bezier(...v.motion.ease["in-out"]),useNativeDriver:!1}),z.reduced?Animated.timing(F,{toValue:0,duration:z.duration("default"),easing:Easing.bezier(...v.motion.ease["in-out"]),useNativeDriver:!0}):Animated.spring(F,{toValue:0,damping:v.motion.spring.snappy.damping,stiffness:v.motion.spring.snappy.stiffness,mass:v.motion.spring.snappy.mass,useNativeDriver:!0})]):Animated.parallel([Animated.timing(B,{toValue:0,duration:z.duration("default"),easing:Easing.bezier(...v.motion.ease["in-out"]),useNativeDriver:!1}),Animated.timing(F,{toValue:O,duration:z.duration("fast"),easing:Easing.bezier(...v.motion.ease.accelerate),useNativeDriver:!0})]);return e.start(({finished:e})=>{e&&!t&&W(!1)}),()=>e.stop()},[t,E,B,F,N,K,O,z,v.motion.ease["in-out"],v.motion.ease.accelerate,v.motion.spring.snappy]);const ee=useMemo(()=>Gesture.Native(),[]),[te,se]=useState(0),oe=useKeyboardState(e=>e.height),ie=E?Math.max(0,Math.round(oe)):0,re=Math.max(M.top,StatusBar.currentHeight??0)+v.space.sm,ne=ie>0,ae=ne?Math.max(0,Math.min(O,(te>0?te:H)-ie-re)):O;useEffect(()=>{t||P("")},[t]);const le=useMemo(()=>{const e=j?L.trim().toLowerCase():"",matches=t=>0===e.length||m(t).toLowerCase().includes(e)||(f(t)??"").toLowerCase().includes(e);if(!a)return n.filter(matches).map(e=>({kind:"option",option:e}));const t=[];return a.forEach((e,s)=>{const o=e.options.filter(matches);if(0!==o.length){t.push({kind:"header",title:e.title});for(const e of o)t.push({kind:"option",option:e,section:s})}}),t},[j,L,n,a,m,f]),ce=useCallback(()=>{s()},[s]),de=useRef(null),ue=useMemo(()=>{const e=new Map;if(!d)return e;let t=0;if(a)for(let e=le.length-1;e>=0;e-=1)if("header"===le[e].kind){t=e+1;break}for(let s=t;s<le.length;s+=1){const t=le[s];if("option"!==t.kind)continue;const o=m(t.option).trim().charAt(0).toUpperCase(),i=/^[A-Z]$/.test(o)?o:"#";e.has(i)||e.set(i,s)}return e},[d,le,a,m]),pe=d&&ue.size>0&&0===L.trim().length,me=useMemo(()=>[..."ABCDEFGHIJKLMNOPQRSTUVWXYZ",...ue.has("#")?["#"]:[]],[ue]),he=useCallback(e=>{const t=ue.get(e);void 0!==t&&de.current?.scrollToIndex({index:t,animated:!0,viewPosition:0})},[ue]),ge=useRef(null),be=useCallback(()=>{null!==ge.current&&(clearTimeout(ge.current),ge.current=null)},[]),fe=useCallback(e=>{de.current?.scrollToOffset({offset:e.averageItemLength*e.index,animated:!1}),be(),ge.current=setTimeout(()=>{ge.current=null,de.current?.scrollToIndex({index:e.index,animated:!0,viewPosition:0})},50)},[be]);useEffect(()=>(E||be(),be),[E,be]);return _jsx(Modal,{visible:E,transparent:!0,animationType:"none",onRequestClose:ce,onDismiss:()=>Q.current?.(),statusBarTranslucent:!0,navigationBarTranslucent:!0,children:_jsx(ModalSafeArea,{onInsets:D,children:_jsxs(AnimatedGestureRoot,{collapsable:!1,onLayout:e=>se(e.nativeEvent.layout.height),style:[StyleSheet.absoluteFill,{backgroundColor:Y}],children:[_jsx(Pressable,{style:StyleSheet.absoluteFill,onPress:ce,accessibilityRole:"button",accessibilityLabel:"Close picker"}),_jsxs(Animated.View,{testID:I,accessibilityViewIsModal:!0,accessibilityLabel:C??r??"Options",style:[A.sheet,{maxHeight:ae,bottom:ie,paddingBottom:ne?v.space.lg:M.bottom+v.space.lg,backgroundColor:v.colors.surface,borderTopLeftRadius:v.radius.xl,borderTopRightRadius:v.radius.xl,...smoothCorners,opacity:U,transform:[{translateY:G}],...v.shadow.modal}],children:[_jsx(GestureDetector,{gesture:J,children:_jsxs(View,{children:[_jsx(View,{style:A.sheetHandleRow,children:_jsx(View,{style:[A.sheetHandle,{backgroundColor:v.colors.border}]})}),r?_jsx(Text,{style:[A.sheetTitle,{color:v.colors["text-body"],fontSize:v.text.lg.size,fontWeight:v.weight.semibold,paddingHorizontal:v.space.lg,marginBottom:v.space.sm}],children:r}):null]})}),j?_jsx(View,{style:[A.searchWrap,{marginHorizontal:v.space.lg,marginBottom:v.space.sm}],children:_jsxs(View,{style:[A.searchBox,{backgroundColor:v.colors["bg-subtle"],borderColor:v.colors.border,borderRadius:v.radius.md,...smoothCorners,paddingHorizontal:v.space.md,gap:v.space.sm}],children:[(v.settings.icons.search??defaultIcons.search)({size:18,color:v.colors["text-subtle"]}),_jsx(TextInput,{value:L,onChangeText:P,placeholder:u,placeholderTextColor:v.colors["text-subtle"],selectionColor:w??v.colors["focus-ring"],accessibilityLabel:"Search options",style:[A.searchInput,{color:v.colors["text-body"],fontSize:v.text.base.size,paddingVertical:v.space.sm}]}),L.length>0?_jsx(Pressable,{onPress:()=>P(""),hitSlop:8,accessibilityRole:"button",accessibilityLabel:"Clear search",children:(v.settings.icons.close??defaultIcons.close)({size:18,color:v.colors["text-muted"]})}):null]})}):null,_jsxs(View,{style:[A.listWrap,pe?A.listRow:null],children:[_jsx(GestureDetector,{gesture:ee,children:_jsx(FlatList,{ref:de,data:le,keyExtractor:e=>"header"===e.kind?`h:${e.title}`:`o:${e.section??""}:${String(h(e.option))}`,renderItem:({item:e})=>{if("header"===e.kind)return _jsx(View,{accessible:!0,accessibilityRole:"header",style:[A.sectionHeader,{paddingHorizontal:v.space.lg,paddingTop:v.space.md}],children:l?l(e.title):_jsx(Text,{style:[A.sectionTitle,{color:v.colors["text-subtle"],fontSize:v.text.xs.size,fontWeight:v.weight.semibold}],children:e.title.toUpperCase()})});const t=e.option,s=m(t),o=h(t),i=f(t),r=x(t),n=y(o),a=g(t),d=b?.(t)??!1;return _jsxs(Pressable,{onPress:()=>S(t),disabled:a,android_ripple:{color:v.colors["surface-pressed"],borderless:!1},accessibilityRole:"button",accessibilityLabel:s,accessibilityState:{selected:n,disabled:a},"aria-selected":n,"aria-disabled":a,style:({pressed:e})=>[A.optionRow,{backgroundColor:n?v.colors["surface-selected"]:e?v.colors["surface-pressed"]:"transparent",opacity:a?.5:1,paddingHorizontal:v.space.lg,paddingVertical:v.space.md},R,n?_:null],children:[c?_jsx(View,{style:A.optionTextWrap,children:c(t,{selected:n,disabled:a})}):_jsxs(_Fragment,{children:[r?_jsx(View,{style:A.optionIcon,children:r}):null,_jsxs(View,{style:A.optionTextWrap,children:[_jsx(Text,{style:[A.optionLabel,{color:d?v.colors["danger-text"]:n?v.colors.primary:v.colors["text-body"],fontSize:v.text.base.size,fontWeight:n?v.weight.semibold:v.weight.medium},V,n?k:null],children:s}),i?_jsx(Text,{style:[A.optionDescription,{color:v.colors["text-subtle"],fontSize:v.text.sm.size}],numberOfLines:2,children:i}):null]})]}),T?_jsx(View,{style:[A.checkbox,{borderColor:n?v.colors.primary:v.colors.border,backgroundColor:n?v.colors.primary:"transparent"}],children:n?_jsx(View,{style:A.checkboxTick}):null}):n?"icon"===v.settings.components["option-sheet"]?.selectedMarker?_jsx(View,{style:A.singleSelectedIcon,children:(v.settings.icons.selectedTick??defaultIcons.selectedTick)({size:20,color:v.colors.primary})}):_jsx(View,{style:[A.singleSelectedDot,{backgroundColor:v.colors.primary}]}):null]})},onScrollToIndexFailed:fe,overScrollMode:"never",bounces:!1,keyboardShouldPersistTaps:"handled",showsVerticalScrollIndicator:!pe,style:pe?A.listBesideRail:null,ListEmptyComponent:_jsx(Text,{style:[A.empty,{color:v.colors["text-subtle"],fontSize:v.text.sm.size,paddingVertical:v.space.xl}],children:p})})}),pe?_jsx(View,{style:[A.rail,{paddingRight:v.space.xs}],accessibilityRole:"list",accessibilityLabel:"Jump to letter",testID:"option-sheet-alphabet",children:me.map(e=>{const t=ue.has(e);return _jsx(Pressable,{onPress:()=>he(e),disabled:!t,hitSlop:{left:8,right:8},accessibilityRole:"button",accessibilityLabel:`Jump to ${e}`,accessibilityState:{disabled:!t},"aria-disabled":!t,style:A.railLetter,children:_jsx(Text,{style:[A.railLetterText,{color:t?v.colors.primary:v.colors["text-subtle"],fontSize:v.text.xs.size,fontWeight:v.weight.semibold,opacity:t?1:.45}],children:e})},e)})}):null]}),T?_jsx(View,{style:[A.sheetFooter,{borderTopColor:v.colors["border-subtle"],paddingHorizontal:v.space.lg,paddingVertical:v.space.md}],children:_jsx(Pressable,{onPress:ce,accessibilityRole:"button",accessibilityLabel:"Done",style:({pressed:e})=>[A.doneButton,{backgroundColor:e?v.colors["primary-pressed"]:v.colors.primary,borderRadius:v.radius.md,...smoothCorners,paddingVertical:v.space.sm,paddingHorizontal:v.space.lg}],children:_jsx(Text,{style:{color:v.colors["on-primary"],fontSize:v.text.base.size,fontWeight:v.weight.semibold},children:"Done"})})}):null]}),_jsx(ToastHost,{})]})})})};OptionSheet.displayName="OptionSheet";const buildStyles=e=>StyleSheet.create({sheet:{position:"absolute",left:0,right:0,bottom:0,paddingBottom:e.space.lg,overflow:"hidden"},sheetHandleRow:{alignItems:"center",paddingTop:e.space.sm,paddingBottom:e.space.sm},sheetHandle:{width:36,height:4,borderRadius:e.radius.pill,...smoothCorners},sheetTitle:{includeFontPadding:!1},searchWrap:{width:"auto"},searchBox:{flexDirection:"row",alignItems:"center",borderWidth:1},searchInput:{flex:1,includeFontPadding:!1},optionRow:{flexDirection:"row",alignItems:"center"},sectionHeader:{paddingBottom:e.space.xs},listWrap:{flexShrink:1},listRow:{flexDirection:"row"},listBesideRail:{flex:1},rail:{justifyContent:"space-between",alignItems:"center",alignSelf:"stretch",paddingVertical:e.space.xs},railLetter:{paddingHorizontal:e.space.xs,minHeight:14,justifyContent:"center"},railLetterText:{includeFontPadding:!1,lineHeight:14},sectionTitle:{includeFontPadding:!1,letterSpacing:.6},optionIcon:{marginRight:e.space.md},optionTextWrap:{flex:1},optionLabel:{includeFontPadding:!1},optionDescription:{includeFontPadding:!1,marginTop:e.space.xxs},checkbox:{width:22,height:22,borderRadius:e.radius.sm,...smoothCorners,borderWidth:2,alignItems:"center",justifyContent:"center",marginLeft:e.space.md},checkboxTick:{width:10,height:6,borderLeftWidth:2,borderBottomWidth:2,borderColor:e.colors["on-primary"],transform:[{rotate:"-45deg"},{translateY:-1}]},singleSelectedDot:{width:8,height:8,borderRadius:e.radius.pill,...smoothCorners,marginLeft:e.space.md},singleSelectedIcon:{marginLeft:e.space.md},empty:{textAlign:"center"},sheetFooter:{borderTopWidth:StyleSheet.hairlineWidth,alignItems:"flex-end"},doneButton:{alignSelf:"flex-end"}});export default OptionSheet;
1
+ "use strict";import{useCallback,useEffect,useMemo,useRef,useState}from"react";import{Animated,Dimensions,Easing,FlatList,Modal,Platform,Pressable,StatusBar,StyleSheet,Text,TextInput,View}from"react-native";import{Gesture,GestureDetector,GestureHandlerRootView}from"react-native-gesture-handler";import{useKeyboardState}from"react-native-keyboard-controller";import{useDragToDismiss}from"../../hooks/useDragToDismiss.js";import{usePresenceMotion}from"../../hooks/usePresenceMotion.js";import{createAnimatedValue,setNativeValue,useTheme}from"../../theme/index.js";import{transparentOf}from"../../utils/color.js";import{smoothCorners}from"../../utils/corners.js";import{hitSlopMarker}from"../../utils/hitSlop.js";import{defaultIcons}from"../AppIcon/defaultIcons.js";import{ModalSafeArea,useModalInsets}from"../ModalSafeArea/ModalSafeArea.js";import{ToastHost}from"../Toast/ToastProvider.js";import{jsx as _jsx,jsxs as _jsxs,Fragment as _Fragment}from"react/jsx-runtime";const AnimatedGestureRoot=Animated.createAnimatedComponent(GestureHandlerRootView),SEARCH_ICON_SIZE=18;export const OptionSheet=e=>{const{open:t,onClose:s,onAfterClose:o,onOpenChange:i,title:r,options:n,sections:a,renderSectionHeader:l,renderOption:c,alphabetIndex:d=!1,searchPlaceholder:u="Search…",emptyText:p="No options",labelOf:m,getValue:h,disabledOf:g,destructiveOf:b,descriptionOf:f,iconOf:x,isSelected:y,onSelect:S,multi:j=!1,searchable:T=!1,searchSelectionColor:w,accessibilityLabel:C,optionStyle:R,selectedOptionStyle:_,optionTextStyle:V,selectedOptionTextStyle:k,testID:I}=e,M=useTheme(),v=usePresenceMotion(),[z,D]=useModalInsets(),A=useMemo(()=>buildStyles(M),[M]),[L,P]=useState(""),H=Dimensions.get("window").height,O=Math.round(.7*H),[E,W]=useState(t),B=useRef(createAnimatedValue(0)).current,F=useRef(createAnimatedValue(O)).current,N=useRef(createAnimatedValue(0)).current,G=useMemo(()=>v.reduced?N:Animated.add(F,N),[v.reduced,F,N]),$=useMemo(()=>v.reduced?F.interpolate({inputRange:[0,O],outputRange:[1,0],extrapolate:"clamp"}):1,[v.reduced,F,O]),{handleGesture:J,opacity:K}=useDragToDismiss({drag:N,travel:O,onDismiss:s}),U=useMemo(()=>Animated.multiply($,K),[$,K]),Y=useMemo(()=>{const e=M.colors.scrim;return B.interpolate({inputRange:[0,1],outputRange:[transparentOf(e),e]})},[B,M.colors.scrim]);useEffect(()=>{t&&W(!0)},[t]);const Z=useRef(i);Z.current=i;const q=useRef(!1);useEffect(()=>{q.current!==t&&(q.current=t,Z.current?.(t))},[t]);const Q=useRef(o);Q.current=o;const X=useRef(E);useEffect(()=>{X.current&&!E&&"ios"!==Platform.OS&&Q.current?.(),X.current=E},[E]),useEffect(()=>{if(!E)return;t&&(setNativeValue(N,0),setNativeValue(K,1));const e=t?Animated.parallel([Animated.timing(B,{toValue:1,duration:v.duration("default"),easing:Easing.bezier(...M.motion.ease["in-out"]),useNativeDriver:!1}),v.reduced?Animated.timing(F,{toValue:0,duration:v.duration("default"),easing:Easing.bezier(...M.motion.ease["in-out"]),useNativeDriver:!0}):Animated.spring(F,{toValue:0,damping:M.motion.spring.snappy.damping,stiffness:M.motion.spring.snappy.stiffness,mass:M.motion.spring.snappy.mass,useNativeDriver:!0})]):Animated.parallel([Animated.timing(B,{toValue:0,duration:v.duration("default"),easing:Easing.bezier(...M.motion.ease["in-out"]),useNativeDriver:!1}),Animated.timing(F,{toValue:O,duration:v.duration("fast"),easing:Easing.bezier(...M.motion.ease.accelerate),useNativeDriver:!0})]);return e.start(({finished:e})=>{e&&!t&&W(!1)}),()=>e.stop()},[t,E,B,F,N,K,O,v,M.motion.ease["in-out"],M.motion.ease.accelerate,M.motion.spring.snappy]);const ee=useMemo(()=>Gesture.Native(),[]),[te,se]=useState(0),oe=useKeyboardState(e=>e.height),ie=E?Math.max(0,Math.round(oe)):0,re=Math.max(z.top,StatusBar.currentHeight??0)+M.space.sm,ne=ie>0,ae=ne?Math.max(0,Math.min(O,(te>0?te:H)-ie-re)):O;useEffect(()=>{t||P("")},[t]);const le=useMemo(()=>{const e=T?L.trim().toLowerCase():"",matches=t=>0===e.length||m(t).toLowerCase().includes(e)||(f(t)??"").toLowerCase().includes(e);if(!a)return n.filter(matches).map(e=>({kind:"option",option:e}));const t=[];return a.forEach((e,s)=>{const o=e.options.filter(matches);if(0!==o.length){t.push({kind:"header",title:e.title});for(const e of o)t.push({kind:"option",option:e,section:s})}}),t},[T,L,n,a,m,f]),ce=useCallback(()=>{s()},[s]),de=useRef(null),ue=useMemo(()=>{const e=new Map;if(!d)return e;let t=0;if(a)for(let e=le.length-1;e>=0;e-=1)if("header"===le[e].kind){t=e+1;break}for(let s=t;s<le.length;s+=1){const t=le[s];if("option"!==t.kind)continue;const o=m(t.option).trim().charAt(0).toUpperCase(),i=/^[A-Z]$/.test(o)?o:"#";e.has(i)||e.set(i,s)}return e},[d,le,a,m]),pe=d&&ue.size>0&&0===L.trim().length,me=useMemo(()=>[..."ABCDEFGHIJKLMNOPQRSTUVWXYZ",...ue.has("#")?["#"]:[]],[ue]),he=useCallback(e=>{const t=ue.get(e);void 0!==t&&de.current?.scrollToIndex({index:t,animated:!0,viewPosition:0})},[ue]),ge=useRef(null),be=useCallback(()=>{null!==ge.current&&(clearTimeout(ge.current),ge.current=null)},[]),fe=useCallback(e=>{de.current?.scrollToOffset({offset:e.averageItemLength*e.index,animated:!1}),be(),ge.current=setTimeout(()=>{ge.current=null,de.current?.scrollToIndex({index:e.index,animated:!0,viewPosition:0})},50)},[be]);useEffect(()=>(E||be(),be),[E,be]);return _jsx(Modal,{visible:E,transparent:!0,animationType:"none",onRequestClose:ce,onDismiss:()=>Q.current?.(),statusBarTranslucent:!0,navigationBarTranslucent:!0,children:_jsx(ModalSafeArea,{onInsets:D,children:_jsxs(AnimatedGestureRoot,{collapsable:!1,onLayout:e=>se(e.nativeEvent.layout.height),style:[StyleSheet.absoluteFill,{backgroundColor:Y}],children:[_jsx(Pressable,{style:StyleSheet.absoluteFill,onPress:ce,accessibilityRole:"button",accessibilityLabel:"Close picker"}),_jsxs(Animated.View,{testID:I,accessibilityViewIsModal:!0,accessibilityLabel:C??r??"Options",style:[A.sheet,{maxHeight:ae,bottom:ie,paddingBottom:ne?M.space.lg:z.bottom+M.space.lg,backgroundColor:M.colors.surface,borderTopLeftRadius:M.radius.xl,borderTopRightRadius:M.radius.xl,...smoothCorners,opacity:U,transform:[{translateY:G}],...M.shadow.modal}],children:[_jsx(GestureDetector,{gesture:J,children:_jsxs(View,{children:[_jsx(View,{style:A.sheetHandleRow,children:_jsx(View,{style:[A.sheetHandle,{backgroundColor:M.colors.border}]})}),r?_jsx(Text,{style:[A.sheetTitle,{color:M.colors["text-body"],fontSize:M.text.lg.size,fontWeight:M.weight.semibold,paddingHorizontal:M.space.lg,marginBottom:M.space.sm}],children:r}):null]})}),T?_jsx(View,{style:[A.searchWrap,{marginHorizontal:M.space.lg,marginBottom:M.space.sm}],children:_jsxs(View,{style:[A.searchBox,{backgroundColor:M.colors["bg-subtle"],borderColor:M.colors.border,borderRadius:M.radius.md,...smoothCorners,paddingHorizontal:M.space.md,gap:M.space.sm}],children:[(M.settings.icons.search??defaultIcons.search)({size:18,color:M.colors["text-subtle"]}),_jsx(TextInput,{value:L,onChangeText:P,placeholder:u,placeholderTextColor:M.colors["text-subtle"],selectionColor:w??M.colors["focus-ring"],accessibilityLabel:"Search options",style:[A.searchInput,{color:M.colors["text-body"],fontSize:M.text.base.size,paddingVertical:M.space.sm}]}),L.length>0?_jsx(Pressable,{onPress:()=>P(""),hitSlop:8,...hitSlopMarker(8),accessibilityRole:"button",accessibilityLabel:"Clear search",children:(M.settings.icons.close??defaultIcons.close)({size:18,color:M.colors["text-muted"]})}):null]})}):null,_jsxs(View,{style:[A.listWrap,pe?A.listRow:null],children:[_jsx(GestureDetector,{gesture:ee,children:_jsx(FlatList,{ref:de,data:le,keyExtractor:e=>"header"===e.kind?`h:${e.title}`:`o:${e.section??""}:${String(h(e.option))}`,renderItem:({item:e})=>{if("header"===e.kind)return _jsx(View,{accessible:!0,accessibilityRole:"header",style:[A.sectionHeader,{paddingHorizontal:M.space.lg,paddingTop:M.space.md}],children:l?l(e.title):_jsx(Text,{style:[A.sectionTitle,{color:M.colors["text-subtle"],fontSize:M.text.xs.size,fontWeight:M.weight.semibold}],children:e.title.toUpperCase()})});const t=e.option,s=m(t),o=h(t),i=f(t),r=x(t),n=y(o),a=g(t),d=b?.(t)??!1;return _jsxs(Pressable,{onPress:()=>S(t),disabled:a,android_ripple:{color:M.colors["surface-pressed"],borderless:!1},accessibilityRole:"button",accessibilityLabel:s,accessibilityState:{selected:n,disabled:a},"aria-selected":n,"aria-disabled":a,style:({pressed:e})=>[A.optionRow,{backgroundColor:n?M.colors["surface-selected"]:e?M.colors["surface-pressed"]:"transparent",opacity:a?.5:1,paddingHorizontal:M.space.lg,paddingVertical:M.space.md},R,n?_:null],children:[c?_jsx(View,{style:A.optionTextWrap,children:c(t,{selected:n,disabled:a})}):_jsxs(_Fragment,{children:[r?_jsx(View,{style:A.optionIcon,children:r}):null,_jsxs(View,{style:A.optionTextWrap,children:[_jsx(Text,{style:[A.optionLabel,{color:d?M.colors["danger-text"]:n?M.colors.primary:M.colors["text-body"],fontSize:M.text.base.size,fontWeight:n?M.weight.semibold:M.weight.medium},V,n?k:null],children:s}),i?_jsx(Text,{style:[A.optionDescription,{color:M.colors["text-subtle"],fontSize:M.text.sm.size}],numberOfLines:2,children:i}):null]})]}),j?_jsx(View,{style:[A.checkbox,{borderColor:n?M.colors.primary:M.colors.border,backgroundColor:n?M.colors.primary:"transparent"}],children:n?_jsx(View,{style:A.checkboxTick}):null}):n?"icon"===M.settings.components["option-sheet"]?.selectedMarker?_jsx(View,{style:A.singleSelectedIcon,children:(M.settings.icons.selectedTick??defaultIcons.selectedTick)({size:20,color:M.colors.primary})}):_jsx(View,{style:[A.singleSelectedDot,{backgroundColor:M.colors.primary}]}):null]})},onScrollToIndexFailed:fe,overScrollMode:"never",bounces:!1,keyboardShouldPersistTaps:"handled",showsVerticalScrollIndicator:!pe,style:pe?A.listBesideRail:null,ListEmptyComponent:_jsx(Text,{style:[A.empty,{color:M.colors["text-subtle"],fontSize:M.text.sm.size,paddingVertical:M.space.xl}],children:p})})}),pe?_jsx(View,{style:[A.rail,{paddingRight:M.space.xs}],accessibilityRole:"list",accessibilityLabel:"Jump to letter",testID:"option-sheet-alphabet",children:me.map(e=>{const t=ue.has(e);return _jsx(Pressable,{onPress:()=>he(e),disabled:!t,hitSlop:{left:8,right:8},...hitSlopMarker({left:8,right:8}),accessibilityRole:"button",accessibilityLabel:`Jump to ${e}`,accessibilityState:{disabled:!t},"aria-disabled":!t,style:A.railLetter,children:_jsx(Text,{style:[A.railLetterText,{color:t?M.colors.primary:M.colors["text-subtle"],fontSize:M.text.xs.size,fontWeight:M.weight.semibold,opacity:t?1:.45}],children:e})},e)})}):null]}),j?_jsx(View,{style:[A.sheetFooter,{borderTopColor:M.colors["border-subtle"],paddingHorizontal:M.space.lg,paddingVertical:M.space.md}],children:_jsx(Pressable,{onPress:ce,accessibilityRole:"button",accessibilityLabel:"Done",style:({pressed:e})=>[A.doneButton,{backgroundColor:e?M.colors["primary-pressed"]:M.colors.primary,borderRadius:M.radius.md,...smoothCorners,paddingVertical:M.space.sm,paddingHorizontal:M.space.lg}],children:_jsx(Text,{style:{color:M.colors["on-primary"],fontSize:M.text.base.size,fontWeight:M.weight.semibold},children:"Done"})})}):null]}),_jsx(ToastHost,{})]})})})};OptionSheet.displayName="OptionSheet";const buildStyles=e=>StyleSheet.create({sheet:{position:"absolute",left:0,right:0,bottom:0,paddingBottom:e.space.lg,overflow:"hidden"},sheetHandleRow:{alignItems:"center",paddingTop:e.space.sm,paddingBottom:e.space.sm},sheetHandle:{width:36,height:4,borderRadius:e.radius.pill,...smoothCorners},sheetTitle:{includeFontPadding:!1},searchWrap:{width:"auto"},searchBox:{flexDirection:"row",alignItems:"center",borderWidth:1},searchInput:{flex:1,includeFontPadding:!1},optionRow:{flexDirection:"row",alignItems:"center"},sectionHeader:{paddingBottom:e.space.xs},listWrap:{flexShrink:1},listRow:{flexDirection:"row"},listBesideRail:{flex:1},rail:{justifyContent:"space-between",alignItems:"center",alignSelf:"stretch",paddingVertical:e.space.xs},railLetter:{paddingHorizontal:e.space.xs,minHeight:14,justifyContent:"center"},railLetterText:{includeFontPadding:!1,lineHeight:14},sectionTitle:{includeFontPadding:!1,letterSpacing:.6},optionIcon:{marginRight:e.space.md},optionTextWrap:{flex:1},optionLabel:{includeFontPadding:!1},optionDescription:{includeFontPadding:!1,marginTop:e.space.xxs},checkbox:{width:22,height:22,borderRadius:e.radius.sm,...smoothCorners,borderWidth:2,alignItems:"center",justifyContent:"center",marginLeft:e.space.md},checkboxTick:{width:10,height:6,borderLeftWidth:2,borderBottomWidth:2,borderColor:e.colors["on-primary"],transform:[{rotate:"-45deg"},{translateY:-1}]},singleSelectedDot:{width:8,height:8,borderRadius:e.radius.pill,...smoothCorners,marginLeft:e.space.md},singleSelectedIcon:{marginLeft:e.space.md},empty:{textAlign:"center"},sheetFooter:{borderTopWidth:StyleSheet.hairlineWidth,alignItems:"flex-end"},doneButton:{alignSelf:"flex-end"}});export default OptionSheet;
@@ -1 +1 @@
1
- "use strict";import{countryFlagEmoji,formatPhoneAsTyped,getPhoneCountries,isSupportedCountry,isValidNationalNumber,maxNationalNumberLength,splitPhoneNumber}from"@webority/mobile-core";import{PHONE_COUNTRY_NAMES}from"@webority/mobile-core/phone/countries";import{forwardRef,useCallback,useEffect,useImperativeHandle,useMemo,useRef,useState}from"react";import{Pressable,StyleSheet,Text,TextInput,View}from"react-native";import{useControllableState}from"../../hooks/index.js";import{fontFor,resolveFieldSize,useTheme}from"../../theme/index.js";import{resolveHaptic,triggerHaptic}from"../../utils/index.js";import{FieldBase,FieldLabel,FieldMessage,hasFieldText,RequiredPlaceholder,resolveFieldTextStyle}from"../FieldBase/index.js";import{Chevron}from"../FieldBase/Chevron.js";import{useFloatingLabel}from"../FieldBase/useFloatingLabel.js";import{OptionSheet}from"../OptionSheet/OptionSheet.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";export const DEFAULT_CALLING_CODES=[{iso:"IN",code:"91",label:"India"},{iso:"AE",code:"971",label:"United Arab Emirates"},{iso:"GB",code:"44",label:"United Kingdom"},{iso:"US",code:"1",label:"United States"},{iso:"CA",code:"1",label:"Canada"},{iso:"AU",code:"61",label:"Australia"},{iso:"SG",code:"65",label:"Singapore"},{iso:"SA",code:"966",label:"Saudi Arabia"}];export const ALL_CALLING_CODES=getPhoneCountries().map(e=>({iso:e.iso,code:e.callingCode,label:PHONE_COUNTRY_NAMES[e.iso]??e.iso})).sort((e,t)=>e.label.localeCompare(t.label));const digitsOnly=e=>e.replace(/[^0-9]/g,"");export const formatE164=e=>`+${e.callingCode}${e.nationalNumber}`;export const parseE164=(e,t,o)=>{const i=e.replace(/[^0-9]/g,"");if(!i)return null;const n=splitPhoneNumber(`+${i}`);let l=n?.callingCode,r=n?.nationalNumber??"";if(!l){const e=Array.from(new Set(t.map(e=>e.code))).sort((e,t)=>t.length-e.length);if(l=e.find(e=>i.startsWith(e)),!l)return null;r=i.slice(l.length)}const a=t.filter(e=>e.code===l),s=a.find(e=>e.iso===o)?.iso??a.find(e=>e.iso===n?.country)?.iso??n?.country??a[0]?.iso??"";return{callingCode:l,nationalNumber:r,iso:s}};const planOf=e=>isSupportedCountry(e)?e:null;export const PhoneNumberInput=forwardRef((e,t)=>{const{value:o,defaultValue:i,onChange:n,e164:l,onChangeE164:r,returnKeyType:a,submitBehavior:s,onSubmitEditing:u,blurOnSubmit:d,onComplete:c,onValidityChange:b,countries:m=ALL_CALLING_CODES,popularCountries:p,popularCountriesTitle:f="Popular",allCountriesTitle:g="All countries",hiddenCountries:h,showFlag:y=!0,renderFlag:C,renderCountry:N,countrySearchPlaceholder:x,showAlphabetIndex:S,defaultIso:v="IN",validation:F="any",maxLength:T,formatAsYouType:I=!0,countryLocked:E=!1,label:L,labelMode:O="top",labelStyle:P,placeholder:j="Phone number",helperText:_,error:A,invalidMessage:w,required:k,disabled:M=!1,size:R="md",variant:V,borderRadius:z,countrySheetTitle:D="Country code",haptic:B,accessibilityLabel:$,countryAccessibilityLabel:H,onFocus:U,onBlur:W,style:q,testID:G}=e,Y=useTheme(),K=useMemo(()=>buildStyles(Y),[Y]),J=useRef(null),Q=useMemo(()=>h?.length?m.filter(e=>!h.includes(e.iso)):m,[m,h]),X=useMemo(()=>{if(!p?.length)return;const e=p.map(e=>Q.find(t=>t.iso===e)).filter(e=>void 0!==e);return e.length?[{title:f,options:e},{title:g,options:Q}]:void 0},[p,f,g,Q]),Z=useCallback((e,t,o)=>{if(!e)return null;if(C)return C(e);if(!y)return null;const i=countryFlagEmoji(e.iso);return i?_jsx(Text,{style:[K.flag,{fontSize:t}],testID:o,children:i}):null},[C,y,K.flag]),ee=useCallback(e=>{const t=planOf(e),o=t?maxNationalNumberLength(t,!1===F?"any":F):Number.POSITIVE_INFINITY;return T?Math.min(o,T):o},[T,F]),te=useCallback((e,t)=>e.slice(0,ee(t)),[ee]),oe=useCallback((e,t)=>{const o=planOf(t)??void 0,i=splitPhoneNumber(e,o);if(!i)return null;const n=i.country??t,l=m.find(e=>e.iso===n);return{callingCode:l?.code??i.callingCode,nationalNumber:te(i.nationalNumber,n),iso:l?.iso??n}},[m,te]),ie=useMemo(()=>{const e=Q.find(e=>e.iso===v)??Q[0]??m[0],t={callingCode:e?.code??"91",nationalNumber:"",iso:e?.iso??"IN"};return"string"==typeof i?oe(i,t.iso)??t:i??t},[m,Q,v,i,oe]),ne=useCallback(e=>{if(!1===F)return e.nationalNumber.length>0;const t=planOf(e.iso);return t?isValidNationalNumber(e.nationalNumber,t,F):e.nationalNumber.length>0},[F]),[le,re]=useState(ie.iso),ae=useMemo(()=>{if(void 0===l)return;const e=l?parseE164(l,m,le):null;if(e)return{...e,nationalNumber:te(e.nationalNumber,e.iso)};const t=m.find(e=>e.iso===le);return{callingCode:t?.code??ie.callingCode,nationalNumber:"",iso:le}},[l,m,le,ie.callingCode,te]),se=useCallback(e=>{re(e.iso),n?.(e),r?.(e.nationalNumber?formatE164(e):"",{country:m.find(t=>t.iso===e.iso),national:e.nationalNumber,valid:ne(e)})},[n,r,m,ne]),[ue,de]=useControllableState({value:o??ae,defaultValue:ie,onChange:se}),[ce,be]=useState(!1),me=useCallback(()=>{M||J.current?.focus()},[M]),[pe,fe]=useState(!1),[ge,he]=useState(!1),[ye,Ce]=useState(!1),Ne=useRef(!1);useEffect(()=>{ye||(Ne.current=!1)},[ye]);const xe=resolveFieldSize(Y,R),Se=resolveFieldTextStyle(Y,{disabled:M}),ve=V??Y.settings.components.field?.defaultVariant??"outlined",Fe="underline"===ve,Te=z??xe.radius,Ie=Y.space.md,[Ee,Le]=useState(0),Oe=Ee+Ie+1+Ie,Pe=ue.nationalNumber.length>0,je=k&&!L&&!Pe&&j.length>0,Ae=ce||Pe,we=Boolean(L)&&"float"===O&&Ee>0,ke=useFloatingLabel({label:L,enabled:we,floated:Ae,required:k,variant:ve,sizeTokens:xe,leadingOffset:Oe,paddingLeft:Fe?Y.space.none:xe["padding-x"],color:Y.colors["field-label"],style:P}),Me=useMemo(()=>m.find(e=>e.iso===ue.iso),[m,ue.iso]),Re=planOf(ue.iso),Ve=I&&Re?formatPhoneAsTyped(ue.nationalNumber,Re):ue.nationalNumber,ze=ee(ue.iso),De=0===ue.nationalNumber.length||pe||!Number.isFinite(ze)?void 0:Ve.length+Math.max(0,ze-ue.nationalNumber.length),Be=ne(ue);useEffect(()=>{Pe||he(!1)},[Pe]);const $e=Re?maxNationalNumberLength(Re,!1===F?"any":F):Number.POSITIVE_INFINITY,He=ue.nationalNumber.length>=$e,Ue=!1!==F&&!1!==w&&Pe&&!Be&&(ge||He),We="mobile"===F?"Enter a valid mobile number":"Enter a valid number",qe=hasFieldText(A)?A:Ue?w||We:void 0,Ge=!0===A||hasFieldText(qe),Ye=useRef(Be),Ke=useRef(ue);Ke.current=ue,useEffect(()=>{Ye.current!==Be&&(Ye.current=Be,b?.(Be),Be&&c?.(formatE164(Ke.current)))},[Be,c,b]);const Je=useCallback(e=>{if(e.includes("+")){const t=oe(e,ue.iso);if(t&&!E&&Q.some(e=>e.iso===t.iso))return void de(t);if(t&&t.iso===ue.iso)return void de(t)}de({...ue,nationalNumber:te(digitsOnly(e),ue.iso)})},[Q,E,ue,oe,te,de]),Qe=useCallback(e=>{const t=e;de({callingCode:t.code,iso:t.iso,nationalNumber:te(ue.nationalNumber,t.iso)}),Ce(!1);const o=resolveHaptic(B,"selection");o&&triggerHaptic(o)},[ue,B,te,de]);useImperativeHandle(t,()=>({focus:()=>J.current?.focus(),blur:()=>J.current?.blur(),clear:()=>de({...Ke.current,nationalNumber:""}),isFocused:()=>J.current?.isFocused()??!1,getValue:()=>Ke.current,getE164:()=>formatE164(Ke.current),getFormatted:()=>{const e=Ke.current,t=planOf(e.iso);return t?formatPhoneAsTyped(e.nationalNumber,t):e.nationalNumber},isValid:()=>ne(Ke.current),getCountry:()=>m.find(e=>e.iso===Ke.current.iso)}),[m,ne,de]);const Xe=M||E,Ze=_jsx(FieldBase,{size:R,variant:ve,borderRadius:Te,topNotch:ke.topNotch,focused:ce,disabled:M,error:Ge,filled:Pe,onPress:me,pressFeedback:!1,leadingDivider:!0,paddingLeft:Fe?Y.space.none:void 0,leading:_jsxs(Pressable,{onPress:()=>{Xe||(Ne.current=!0,Ce(!0))},disabled:Xe,accessibilityRole:"button",accessibilityLabel:H??`Country code, currently +${ue.callingCode}`,accessibilityState:{disabled:Xe},"aria-disabled":Xe,hitSlop:6,onLayout:e=>{const{width:t}=e.nativeEvent.layout;Le(e=>e===t?e:t)},style:K.codeTrigger,testID:G?`${G}-code`:void 0,children:[Z(Me,xe.text,G?`${G}-flag`:void 0),_jsx(Text,{style:[K.codeText,{color:Se.color,fontSize:xe.text}],children:`+${ue.callingCode}`}),E?null:_jsx(Chevron,{color:M?Y.colors["field-icon-disabled"]:Y.colors["field-icon"],size:xe.icon,open:ye})]}),children:_jsxs(View,{style:K.inputWrap,children:[_jsx(TextInput,{ref:J,value:Ve,maxLength:De,onChangeText:Je,returnKeyType:a,submitBehavior:s,onSubmitEditing:u,blurOnSubmit:d,onSelectionChange:e=>{const{start:t,end:o}=e.nativeEvent.selection;fe(t!==o)},onFocus:()=>{be(!0),U?.()},onBlur:()=>{be(!1),Pe&&!Ne.current&&he(!0),W?.()},editable:!M,placeholder:we&&!Ae||je?void 0:j,placeholderTextColor:Se.placeholderColor,accessibilityLabel:$??L??j,selectionColor:Y.colors["field-caret"],keyboardType:"phone-pad",textContentType:"telephoneNumber",autoComplete:"tel",style:[K.input,{color:Se.color,fontSize:xe.text,...Se.weightStyle,paddingLeft:Fe?Y.space.none:void 0}],testID:G?`${G}-input`:void 0}),je?_jsx(RequiredPlaceholder,{text:j,color:Se.placeholderColor,fontSize:xe.text,weightStyle:Se.weightStyle}):null]})});return _jsxs(View,{style:q,testID:G,children:[L&&"top"===O?_jsx(FieldLabel,{size:R,required:k,children:L}):null,_jsxs(View,{style:K.fieldWrapper,children:[Ze,ke.node]}),_jsx(FieldMessage,{size:R,error:Ge,text:Ge?qe:_}),_jsx(OptionSheet,{open:ye,onClose:()=>Ce(!1),title:D,options:Q,sections:X,labelOf:e=>`${e.label} (+${e.code})`,getValue:e=>e.iso,disabledOf:()=>!1,descriptionOf:()=>{},iconOf:e=>Z(e,Y.text.lg.size),renderOption:N?(e,t)=>N(e,{selected:t.selected}):void 0,isSelected:e=>e===Me?.iso,onSelect:Qe,searchable:Q.length>8,searchPlaceholder:x,alphabetIndex:S??Q.length>20})]})});PhoneNumberInput.displayName="PhoneNumberInput";const buildStyles=e=>StyleSheet.create({fieldWrapper:{position:"relative",overflow:"visible"},codeTrigger:{flexDirection:"row",alignItems:"center",gap:e.space.xxs},flag:{includeFontPadding:!1,marginRight:e.space.xs},codeText:{...fontFor(e,"semibold"),fontWeight:"600",includeFontPadding:!1,writingDirection:"ltr"},input:{padding:e.space.none,margin:e.space.none,includeFontPadding:!1,writingDirection:"ltr"},inputWrap:{flex:1,alignSelf:"stretch",justifyContent:"center"}});export default PhoneNumberInput;
1
+ "use strict";import{countryFlagEmoji,formatPhoneAsTyped,getPhoneCountries,isSupportedCountry,isValidNationalNumber,maxNationalNumberLength,splitPhoneNumber}from"@webority/mobile-core";import{PHONE_COUNTRY_NAMES}from"@webority/mobile-core/phone/countries";import{forwardRef,useCallback,useEffect,useImperativeHandle,useMemo,useRef,useState}from"react";import{Pressable,StyleSheet,Text,TextInput,View}from"react-native";import{useControllableState}from"../../hooks/index.js";import{fontFor,resolveFieldSize,useTheme}from"../../theme/index.js";import{resolveHaptic,triggerHaptic}from"../../utils/index.js";import{hitSlopMarker}from"../../utils/hitSlop.js";import{FieldBase,FieldLabel,FieldMessage,hasFieldText,RequiredPlaceholder,resolveFieldTextStyle}from"../FieldBase/index.js";import{Chevron}from"../FieldBase/Chevron.js";import{useFloatingLabel}from"../FieldBase/useFloatingLabel.js";import{OptionSheet}from"../OptionSheet/OptionSheet.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";export const DEFAULT_CALLING_CODES=[{iso:"IN",code:"91",label:"India"},{iso:"AE",code:"971",label:"United Arab Emirates"},{iso:"GB",code:"44",label:"United Kingdom"},{iso:"US",code:"1",label:"United States"},{iso:"CA",code:"1",label:"Canada"},{iso:"AU",code:"61",label:"Australia"},{iso:"SG",code:"65",label:"Singapore"},{iso:"SA",code:"966",label:"Saudi Arabia"}];export const ALL_CALLING_CODES=getPhoneCountries().map(e=>({iso:e.iso,code:e.callingCode,label:PHONE_COUNTRY_NAMES[e.iso]??e.iso})).sort((e,t)=>e.label.localeCompare(t.label));const digitsOnly=e=>e.replace(/[^0-9]/g,"");export const formatE164=e=>`+${e.callingCode}${e.nationalNumber}`;export const parseE164=(e,t,o)=>{const i=e.replace(/[^0-9]/g,"");if(!i)return null;const n=splitPhoneNumber(`+${i}`);let l=n?.callingCode,r=n?.nationalNumber??"";if(!l){const e=Array.from(new Set(t.map(e=>e.code))).sort((e,t)=>t.length-e.length);if(l=e.find(e=>i.startsWith(e)),!l)return null;r=i.slice(l.length)}const a=t.filter(e=>e.code===l),s=a.find(e=>e.iso===o)?.iso??a.find(e=>e.iso===n?.country)?.iso??n?.country??a[0]?.iso??"";return{callingCode:l,nationalNumber:r,iso:s}};const planOf=e=>isSupportedCountry(e)?e:null;export const PhoneNumberInput=forwardRef((e,t)=>{const{value:o,defaultValue:i,onChange:n,e164:l,onChangeE164:r,returnKeyType:a,submitBehavior:s,onSubmitEditing:u,blurOnSubmit:d,onComplete:c,onValidityChange:b,countries:m=ALL_CALLING_CODES,popularCountries:p,popularCountriesTitle:f="Popular",allCountriesTitle:h="All countries",hiddenCountries:g,showFlag:y=!0,renderFlag:C,renderCountry:N,countrySearchPlaceholder:x,showAlphabetIndex:S,defaultIso:v="IN",validation:F="any",maxLength:T,formatAsYouType:I=!0,countryLocked:E=!1,label:L,labelMode:j="top",labelStyle:O,placeholder:P="Phone number",helperText:_,error:A,invalidMessage:w,required:k,disabled:M=!1,size:R="md",variant:V,borderRadius:z,countrySheetTitle:D="Country code",haptic:B,accessibilityLabel:$,countryAccessibilityLabel:H,onFocus:U,onBlur:W,style:q,testID:G}=e,Y=useTheme(),K=useMemo(()=>buildStyles(Y),[Y]),J=useRef(null),Q=useMemo(()=>g?.length?m.filter(e=>!g.includes(e.iso)):m,[m,g]),X=useMemo(()=>{if(!p?.length)return;const e=p.map(e=>Q.find(t=>t.iso===e)).filter(e=>void 0!==e);return e.length?[{title:f,options:e},{title:h,options:Q}]:void 0},[p,f,h,Q]),Z=useCallback((e,t,o)=>{if(!e)return null;if(C)return C(e);if(!y)return null;const i=countryFlagEmoji(e.iso);return i?_jsx(Text,{style:[K.flag,{fontSize:t}],testID:o,children:i}):null},[C,y,K.flag]),ee=useCallback(e=>{const t=planOf(e),o=t?maxNationalNumberLength(t,!1===F?"any":F):Number.POSITIVE_INFINITY;return T?Math.min(o,T):o},[T,F]),te=useCallback((e,t)=>e.slice(0,ee(t)),[ee]),oe=useCallback((e,t)=>{const o=planOf(t)??void 0,i=splitPhoneNumber(e,o);if(!i)return null;const n=i.country??t,l=m.find(e=>e.iso===n);return{callingCode:l?.code??i.callingCode,nationalNumber:te(i.nationalNumber,n),iso:l?.iso??n}},[m,te]),ie=useMemo(()=>{const e=Q.find(e=>e.iso===v)??Q[0]??m[0],t={callingCode:e?.code??"91",nationalNumber:"",iso:e?.iso??"IN"};return"string"==typeof i?oe(i,t.iso)??t:i??t},[m,Q,v,i,oe]),ne=useCallback(e=>{if(!1===F)return e.nationalNumber.length>0;const t=planOf(e.iso);return t?isValidNationalNumber(e.nationalNumber,t,F):e.nationalNumber.length>0},[F]),[le,re]=useState(ie.iso),ae=useMemo(()=>{if(void 0===l)return;const e=l?parseE164(l,m,le):null;if(e)return{...e,nationalNumber:te(e.nationalNumber,e.iso)};const t=m.find(e=>e.iso===le);return{callingCode:t?.code??ie.callingCode,nationalNumber:"",iso:le}},[l,m,le,ie.callingCode,te]),se=useCallback(e=>{re(e.iso),n?.(e),r?.(e.nationalNumber?formatE164(e):"",{country:m.find(t=>t.iso===e.iso),national:e.nationalNumber,valid:ne(e)})},[n,r,m,ne]),[ue,de]=useControllableState({value:o??ae,defaultValue:ie,onChange:se}),[ce,be]=useState(!1),me=useCallback(()=>{M||J.current?.focus()},[M]),[pe,fe]=useState(!1),[he,ge]=useState(!1),[ye,Ce]=useState(!1),Ne=useRef(!1);useEffect(()=>{ye||(Ne.current=!1)},[ye]);const xe=resolveFieldSize(Y,R),Se=resolveFieldTextStyle(Y,{disabled:M}),ve=V??Y.settings.components.field?.defaultVariant??"outlined",Fe="underline"===ve,Te=z??xe.radius,Ie=Y.space.md,[Ee,Le]=useState(0),je=Ee+Ie+1+Ie,Oe=ue.nationalNumber.length>0,Pe=k&&!L&&!Oe&&P.length>0,Ae=ce||Oe,we=Boolean(L)&&"float"===j&&Ee>0,ke=useFloatingLabel({label:L,enabled:we,floated:Ae,required:k,variant:ve,sizeTokens:xe,leadingOffset:je,paddingLeft:Fe?Y.space.none:xe["padding-x"],color:Y.colors["field-label"],style:O}),Me=useMemo(()=>m.find(e=>e.iso===ue.iso),[m,ue.iso]),Re=planOf(ue.iso),Ve=I&&Re?formatPhoneAsTyped(ue.nationalNumber,Re):ue.nationalNumber,ze=ee(ue.iso),De=0===ue.nationalNumber.length||pe||!Number.isFinite(ze)?void 0:Ve.length+Math.max(0,ze-ue.nationalNumber.length),Be=ne(ue);useEffect(()=>{Oe||ge(!1)},[Oe]);const $e=Re?maxNationalNumberLength(Re,!1===F?"any":F):Number.POSITIVE_INFINITY,He=ue.nationalNumber.length>=$e,Ue=!1!==F&&!1!==w&&Oe&&!Be&&(he||He),We="mobile"===F?"Enter a valid mobile number":"Enter a valid number",qe=hasFieldText(A)?A:Ue?w||We:void 0,Ge=!0===A||hasFieldText(qe),Ye=useRef(Be),Ke=useRef(ue);Ke.current=ue,useEffect(()=>{Ye.current!==Be&&(Ye.current=Be,b?.(Be),Be&&c?.(formatE164(Ke.current)))},[Be,c,b]);const Je=useCallback(e=>{if(e.includes("+")){const t=oe(e,ue.iso);if(t&&!E&&Q.some(e=>e.iso===t.iso))return void de(t);if(t&&t.iso===ue.iso)return void de(t)}de({...ue,nationalNumber:te(digitsOnly(e),ue.iso)})},[Q,E,ue,oe,te,de]),Qe=useCallback(e=>{const t=e;de({callingCode:t.code,iso:t.iso,nationalNumber:te(ue.nationalNumber,t.iso)}),Ce(!1);const o=resolveHaptic(B,"selection");o&&triggerHaptic(o)},[ue,B,te,de]);useImperativeHandle(t,()=>({focus:()=>J.current?.focus(),blur:()=>J.current?.blur(),clear:()=>de({...Ke.current,nationalNumber:""}),isFocused:()=>J.current?.isFocused()??!1,getValue:()=>Ke.current,getE164:()=>formatE164(Ke.current),getFormatted:()=>{const e=Ke.current,t=planOf(e.iso);return t?formatPhoneAsTyped(e.nationalNumber,t):e.nationalNumber},isValid:()=>ne(Ke.current),getCountry:()=>m.find(e=>e.iso===Ke.current.iso)}),[m,ne,de]);const Xe=M||E,Ze=_jsx(FieldBase,{size:R,variant:ve,borderRadius:Te,topNotch:ke.topNotch,focused:ce,disabled:M,error:Ge,filled:Oe,onPress:me,pressFeedback:!1,leadingDivider:!0,paddingLeft:Fe?Y.space.none:void 0,leading:_jsxs(Pressable,{onPress:()=>{Xe||(Ne.current=!0,Ce(!0))},disabled:Xe,accessibilityRole:"button",accessibilityLabel:H??`Country code, currently +${ue.callingCode}`,accessibilityState:{disabled:Xe},"aria-disabled":Xe,hitSlop:6,...hitSlopMarker(6),onLayout:e=>{const{width:t}=e.nativeEvent.layout;Le(e=>e===t?e:t)},style:K.codeTrigger,testID:G?`${G}-code`:void 0,children:[Z(Me,xe.text,G?`${G}-flag`:void 0),_jsx(Text,{style:[K.codeText,{color:Se.color,fontSize:xe.text}],children:`+${ue.callingCode}`}),E?null:_jsx(Chevron,{color:M?Y.colors["field-icon-disabled"]:Y.colors["field-icon"],size:xe.icon,open:ye})]}),children:_jsxs(View,{style:K.inputWrap,children:[_jsx(TextInput,{ref:J,value:Ve,maxLength:De,onChangeText:Je,returnKeyType:a,submitBehavior:s,onSubmitEditing:u,blurOnSubmit:d,onSelectionChange:e=>{const{start:t,end:o}=e.nativeEvent.selection;fe(t!==o)},onFocus:()=>{be(!0),U?.()},onBlur:()=>{be(!1),Oe&&!Ne.current&&ge(!0),W?.()},editable:!M,placeholder:we&&!Ae||Pe?void 0:P,placeholderTextColor:Se.placeholderColor,accessibilityLabel:$??L??P,selectionColor:Y.colors["field-caret"],keyboardType:"phone-pad",textContentType:"telephoneNumber",autoComplete:"tel",style:[K.input,{color:Se.color,fontSize:xe.text,...Se.weightStyle,paddingLeft:Fe?Y.space.none:void 0}],testID:G?`${G}-input`:void 0}),Pe?_jsx(RequiredPlaceholder,{text:P,color:Se.placeholderColor,fontSize:xe.text,weightStyle:Se.weightStyle}):null]})});return _jsxs(View,{style:q,testID:G,children:[L&&"top"===j?_jsx(FieldLabel,{size:R,required:k,children:L}):null,_jsxs(View,{style:K.fieldWrapper,children:[Ze,ke.node]}),_jsx(FieldMessage,{size:R,error:Ge,text:Ge?qe:_}),_jsx(OptionSheet,{open:ye,onClose:()=>Ce(!1),title:D,options:Q,sections:X,labelOf:e=>`${e.label} (+${e.code})`,getValue:e=>e.iso,disabledOf:()=>!1,descriptionOf:()=>{},iconOf:e=>Z(e,Y.text.lg.size),renderOption:N?(e,t)=>N(e,{selected:t.selected}):void 0,isSelected:e=>e===Me?.iso,onSelect:Qe,searchable:Q.length>8,searchPlaceholder:x,alphabetIndex:S??Q.length>20})]})});PhoneNumberInput.displayName="PhoneNumberInput";const buildStyles=e=>StyleSheet.create({fieldWrapper:{position:"relative",overflow:"visible"},codeTrigger:{flexDirection:"row",alignItems:"center",gap:e.space.xxs},flag:{includeFontPadding:!1,marginRight:e.space.xs},codeText:{...fontFor(e,"semibold"),fontWeight:"600",includeFontPadding:!1,writingDirection:"ltr"},input:{padding:e.space.none,margin:e.space.none,includeFontPadding:!1,writingDirection:"ltr"},inputWrap:{flex:1,alignSelf:"stretch",justifyContent:"center"}});export default PhoneNumberInput;