react-native-timer-picker 1.6.0 → 1.8.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 (121) hide show
  1. package/README.md +74 -25
  2. package/dist/commonjs/assets/select_click.mp3 +0 -0
  3. package/dist/commonjs/components/{TimerPicker/DurationScroll.js → DurationScroll/index.js} +113 -63
  4. package/dist/commonjs/components/DurationScroll/index.js.map +1 -0
  5. package/dist/commonjs/components/DurationScroll/types.js +6 -0
  6. package/dist/commonjs/components/DurationScroll/types.js.map +1 -0
  7. package/dist/commonjs/components/Modal/index.js +21 -20
  8. package/dist/commonjs/components/Modal/index.js.map +1 -1
  9. package/dist/commonjs/components/Modal/{Modal.styles.js → styles.js} +1 -1
  10. package/dist/commonjs/components/Modal/styles.js.map +1 -0
  11. package/dist/commonjs/components/Modal/types.js +6 -0
  12. package/dist/commonjs/components/Modal/types.js.map +1 -0
  13. package/dist/commonjs/components/TimerPicker/index.js +68 -79
  14. package/dist/commonjs/components/TimerPicker/index.js.map +1 -1
  15. package/dist/commonjs/components/TimerPicker/{TimerPicker.styles.js → styles.js} +1 -3
  16. package/dist/commonjs/components/TimerPicker/styles.js.map +1 -0
  17. package/dist/commonjs/components/TimerPicker/types.js +6 -0
  18. package/dist/commonjs/components/TimerPicker/types.js.map +1 -0
  19. package/dist/commonjs/components/{index.js → TimerPickerModal/index.js} +42 -99
  20. package/dist/commonjs/components/TimerPickerModal/index.js.map +1 -0
  21. package/dist/commonjs/components/{TimerPickerModal.styles.js → TimerPickerModal/styles.js} +1 -3
  22. package/dist/commonjs/components/TimerPickerModal/styles.js.map +1 -0
  23. package/dist/commonjs/components/TimerPickerModal/types.js +6 -0
  24. package/dist/commonjs/components/TimerPickerModal/types.js.map +1 -0
  25. package/dist/commonjs/index.js +14 -13
  26. package/dist/commonjs/index.js.map +1 -1
  27. package/dist/commonjs/tests/DurationScroll.test.js +1 -1
  28. package/dist/commonjs/tests/DurationScroll.test.js.map +1 -1
  29. package/dist/commonjs/tests/Modal.test.js +7 -7
  30. package/dist/commonjs/tests/Modal.test.js.map +1 -1
  31. package/dist/commonjs/tests/TimerPicker.test.js.map +1 -1
  32. package/dist/commonjs/tests/TimerPickerModal.test.js +2 -2
  33. package/dist/commonjs/tests/TimerPickerModal.test.js.map +1 -1
  34. package/dist/commonjs/utils/generateNumbers.js.map +1 -1
  35. package/dist/commonjs/utils/getAdjustedLimit.js.map +1 -1
  36. package/dist/commonjs/utils/getScrollIndex.js +2 -2
  37. package/dist/commonjs/utils/getScrollIndex.js.map +1 -1
  38. package/dist/module/assets/select_click.mp3 +0 -0
  39. package/dist/module/components/{TimerPicker/DurationScroll.js → DurationScroll/index.js} +114 -64
  40. package/dist/module/components/DurationScroll/index.js.map +1 -0
  41. package/dist/module/components/DurationScroll/types.js +2 -0
  42. package/dist/module/components/DurationScroll/types.js.map +1 -0
  43. package/dist/module/components/Modal/index.js +19 -19
  44. package/dist/module/components/Modal/index.js.map +1 -1
  45. package/dist/module/components/Modal/{Modal.styles.js → styles.js} +1 -1
  46. package/dist/module/components/Modal/styles.js.map +1 -0
  47. package/dist/module/components/Modal/types.js +2 -0
  48. package/dist/module/components/Modal/types.js.map +1 -0
  49. package/dist/module/components/TimerPicker/index.js +67 -78
  50. package/dist/module/components/TimerPicker/index.js.map +1 -1
  51. package/dist/module/components/TimerPicker/{TimerPicker.styles.js → styles.js} +1 -2
  52. package/dist/module/components/TimerPicker/styles.js.map +1 -0
  53. package/dist/module/components/TimerPicker/types.js +2 -0
  54. package/dist/module/components/TimerPicker/types.js.map +1 -0
  55. package/dist/module/components/{index.js → TimerPickerModal/index.js} +41 -98
  56. package/dist/module/components/TimerPickerModal/index.js.map +1 -0
  57. package/dist/module/components/{TimerPickerModal.styles.js → TimerPickerModal/styles.js} +1 -2
  58. package/dist/module/components/TimerPickerModal/styles.js.map +1 -0
  59. package/dist/module/components/TimerPickerModal/types.js +2 -0
  60. package/dist/module/components/TimerPickerModal/types.js.map +1 -0
  61. package/dist/module/index.js +6 -4
  62. package/dist/module/index.js.map +1 -1
  63. package/dist/module/tests/DurationScroll.test.js +1 -1
  64. package/dist/module/tests/DurationScroll.test.js.map +1 -1
  65. package/dist/module/tests/Modal.test.js +1 -1
  66. package/dist/module/tests/Modal.test.js.map +1 -1
  67. package/dist/module/tests/TimerPicker.test.js.map +1 -1
  68. package/dist/module/tests/TimerPickerModal.test.js +2 -2
  69. package/dist/module/tests/TimerPickerModal.test.js.map +1 -1
  70. package/dist/module/utils/generateNumbers.js.map +1 -1
  71. package/dist/module/utils/getAdjustedLimit.js.map +1 -1
  72. package/dist/module/utils/getScrollIndex.js +2 -2
  73. package/dist/module/utils/getScrollIndex.js.map +1 -1
  74. package/dist/typescript/components/DurationScroll/index.d.ts +4 -0
  75. package/dist/typescript/components/{TimerPicker/DurationScroll.d.ts → DurationScroll/types.d.ts} +36 -29
  76. package/dist/typescript/components/Modal/index.d.ts +3 -14
  77. package/dist/typescript/components/Modal/types.d.ts +15 -0
  78. package/dist/typescript/components/TimerPicker/index.d.ts +2 -57
  79. package/dist/typescript/components/TimerPicker/styles.d.ts +1022 -0
  80. package/dist/typescript/components/TimerPicker/types.d.ts +61 -0
  81. package/dist/typescript/components/TimerPickerModal/index.d.ts +4 -0
  82. package/dist/typescript/components/TimerPickerModal/styles.d.ts +738 -0
  83. package/dist/typescript/components/{index.d.ts → TimerPickerModal/types.d.ts} +24 -26
  84. package/dist/typescript/index.d.ts +6 -4
  85. package/dist/typescript/utils/generateNumbers.d.ts +4 -4
  86. package/dist/typescript/utils/getAdjustedLimit.d.ts +1 -1
  87. package/dist/typescript/utils/getScrollIndex.d.ts +2 -2
  88. package/package.json +14 -11
  89. package/src/assets/select_click.mp3 +0 -0
  90. package/src/components/{TimerPicker/DurationScroll.tsx → DurationScroll/index.tsx} +126 -110
  91. package/src/components/DurationScroll/types.ts +63 -0
  92. package/src/components/Modal/index.tsx +20 -30
  93. package/src/components/Modal/types.ts +17 -0
  94. package/src/components/TimerPicker/index.tsx +70 -138
  95. package/src/components/TimerPicker/{TimerPicker.styles.ts → styles.ts} +13 -13
  96. package/src/components/TimerPicker/types.ts +72 -0
  97. package/src/components/{index.tsx → TimerPickerModal/index.tsx} +44 -147
  98. package/src/components/{TimerPickerModal.styles.ts → TimerPickerModal/styles.ts} +9 -9
  99. package/src/components/TimerPickerModal/types.ts +52 -0
  100. package/src/index.ts +6 -7
  101. package/src/tests/DurationScroll.test.tsx +3 -1
  102. package/src/tests/Modal.test.tsx +3 -1
  103. package/src/tests/TimerPicker.test.tsx +2 -0
  104. package/src/tests/TimerPickerModal.test.tsx +3 -1
  105. package/src/utils/generateNumbers.ts +4 -4
  106. package/src/utils/getAdjustedLimit.ts +1 -1
  107. package/src/utils/getScrollIndex.ts +3 -3
  108. package/dist/commonjs/components/Modal/Modal.styles.js.map +0 -1
  109. package/dist/commonjs/components/TimerPicker/DurationScroll.js.map +0 -1
  110. package/dist/commonjs/components/TimerPicker/TimerPicker.styles.js.map +0 -1
  111. package/dist/commonjs/components/TimerPickerModal.styles.js.map +0 -1
  112. package/dist/commonjs/components/index.js.map +0 -1
  113. package/dist/module/components/Modal/Modal.styles.js.map +0 -1
  114. package/dist/module/components/TimerPicker/DurationScroll.js.map +0 -1
  115. package/dist/module/components/TimerPicker/TimerPicker.styles.js.map +0 -1
  116. package/dist/module/components/TimerPickerModal.styles.js.map +0 -1
  117. package/dist/module/components/index.js.map +0 -1
  118. package/dist/typescript/components/TimerPicker/TimerPicker.styles.d.ts +0 -29
  119. package/dist/typescript/components/TimerPickerModal.styles.d.ts +0 -19
  120. /package/dist/typescript/components/Modal/{Modal.styles.d.ts → styles.d.ts} +0 -0
  121. /package/src/components/Modal/{Modal.styles.ts → styles.ts} +0 -0
@@ -1,34 +1,36 @@
1
1
  function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
2
- import React, { useRef, useCallback, forwardRef, useImperativeHandle } from "react";
2
+ import React, { useRef, useCallback, forwardRef, useImperativeHandle, useState, useEffect } from "react";
3
3
  import { View, Text, FlatList } from "react-native";
4
- import { generate12HourNumbers, generateNumbers } from "../../utils/generateNumbers";
5
4
  import { colorToRgba } from "../../utils/colorToRgba";
5
+ import { generate12HourNumbers, generateNumbers } from "../../utils/generateNumbers";
6
6
  import { getAdjustedLimit } from "../../utils/getAdjustedLimit";
7
7
  import { getScrollIndex } from "../../utils/getScrollIndex";
8
- // eslint-disable-next-line @typescript-eslint/no-explicit-any
9
- const KEY_EXTRACTOR = (_, index) => index.toString();
10
- const DurationScroll = /*#__PURE__*/forwardRef(({
11
- numberOfItems,
12
- label,
13
- initialValue = 0,
14
- onDurationChange,
15
- padNumbersWithZero = false,
16
- disableInfiniteScroll = false,
17
- limit,
18
- isDisabled,
19
- aggressivelyGetLatestDuration,
20
- allowFontScaling = false,
21
- is12HourPicker,
22
- amLabel,
23
- pmLabel,
24
- padWithNItems,
25
- pickerGradientOverlayProps,
26
- topPickerGradientOverlayProps,
27
- bottomPickerGradientOverlayProps,
28
- LinearGradient,
29
- testID,
30
- styles
31
- }, ref) => {
8
+ const DurationScroll = /*#__PURE__*/forwardRef((props, ref) => {
9
+ const {
10
+ aggressivelyGetLatestDuration,
11
+ allowFontScaling = false,
12
+ amLabel,
13
+ Audio,
14
+ bottomPickerGradientOverlayProps,
15
+ clickSoundAsset,
16
+ disableInfiniteScroll = false,
17
+ Haptics,
18
+ initialValue = 0,
19
+ is12HourPicker,
20
+ isDisabled,
21
+ label,
22
+ limit,
23
+ LinearGradient,
24
+ numberOfItems,
25
+ onDurationChange,
26
+ padNumbersWithZero = false,
27
+ padWithNItems,
28
+ pickerGradientOverlayProps,
29
+ pmLabel,
30
+ styles,
31
+ testID,
32
+ topPickerGradientOverlayProps
33
+ } = props;
32
34
  const data = !is12HourPicker ? generateNumbers(numberOfItems, {
33
35
  padNumbersWithZero,
34
36
  repeatNTimes: 3,
@@ -48,8 +50,34 @@ const DurationScroll = /*#__PURE__*/forwardRef(({
48
50
  padWithNItems,
49
51
  disableInfiniteScroll
50
52
  });
53
+
54
+ // keep track of the latest duration as it scrolls
51
55
  const latestDuration = useRef(0);
56
+ // keep track of the last index scrolled past for haptic/audio feedback
57
+ const lastFeedbackIndex = useRef(0);
52
58
  const flatListRef = useRef(null);
59
+ const [clickSound, setClickSound] = useState();
60
+
61
+ // Preload the sound when the component mounts
62
+ useEffect(() => {
63
+ const loadSound = async () => {
64
+ if (Audio) {
65
+ const {
66
+ sound
67
+ } = await Audio.Sound.createAsync(clickSoundAsset ?? require("../../assets/select_click.mp3"), {
68
+ shouldPlay: false
69
+ });
70
+ setClickSound(sound);
71
+ }
72
+ };
73
+ loadSound();
74
+
75
+ // Unload sound when component unmounts
76
+ return () => {
77
+ clickSound === null || clickSound === void 0 || clickSound.unloadAsync();
78
+ };
79
+ // eslint-disable-next-line react-hooks/exhaustive-deps
80
+ }, [Audio]);
53
81
  useImperativeHandle(ref, () => ({
54
82
  reset: options => {
55
83
  var _flatListRef$current;
@@ -93,28 +121,50 @@ const DurationScroll = /*#__PURE__*/forwardRef(({
93
121
  allowFontScaling: allowFontScaling,
94
122
  style: [styles.pickerItem, intItem > adjustedLimited.max || intItem < adjustedLimited.min ? styles.disabledPickerItem : {}]
95
123
  }, stringItem), is12HourPicker ? /*#__PURE__*/React.createElement(View, {
96
- style: styles.pickerAmPmContainer,
97
- pointerEvents: "none"
124
+ pointerEvents: "none",
125
+ style: styles.pickerAmPmContainer
98
126
  }, /*#__PURE__*/React.createElement(Text, {
99
- style: [styles.pickerAmPmLabel],
100
- allowFontScaling: allowFontScaling
127
+ allowFontScaling: allowFontScaling,
128
+ style: [styles.pickerAmPmLabel]
101
129
  }, isAm ? amLabel : pmLabel)) : null);
102
130
  }, [adjustedLimited.max, adjustedLimited.min, allowFontScaling, amLabel, is12HourPicker, pmLabel, styles.disabledPickerItem, styles.pickerAmPmContainer, styles.pickerAmPmLabel, styles.pickerItem, styles.pickerItemContainer]);
103
131
  const onScroll = useCallback(e => {
104
- // this function is only used when the picker is in a modal
132
+ // this function is only used when the picker is in a modal and/or has Haptic/Audio feedback
105
133
  // it is used to ensure that the modal gets the latest duration on clicking
106
134
  // the confirm button, even if the scrollview is still scrolling
107
- const newIndex = Math.round(e.nativeEvent.contentOffset.y / styles.pickerItemContainer.height);
108
- let newDuration = (disableInfiniteScroll ? newIndex : newIndex + padWithNItems) % (numberOfItems + 1);
135
+ if (!aggressivelyGetLatestDuration && !Haptics && !Audio) {
136
+ return;
137
+ }
138
+ if (aggressivelyGetLatestDuration) {
139
+ const newIndex = Math.round(e.nativeEvent.contentOffset.y / styles.pickerItemContainer.height);
140
+ let newDuration = (disableInfiniteScroll ? newIndex : newIndex + padWithNItems) % (numberOfItems + 1);
141
+ if (newDuration !== latestDuration.current) {
142
+ // check limits
143
+ if (newDuration > adjustedLimited.max) {
144
+ newDuration = adjustedLimited.max;
145
+ } else if (newDuration < adjustedLimited.min) {
146
+ newDuration = adjustedLimited.min;
147
+ }
148
+ latestDuration.current = newDuration;
149
+ }
150
+ }
151
+ if (Haptics || Audio) {
152
+ const feedbackIndex = Math.round((e.nativeEvent.contentOffset.y + styles.pickerItemContainer.height / 2) / styles.pickerItemContainer.height);
153
+ if (feedbackIndex !== lastFeedbackIndex.current) {
154
+ // this check stops the feedback firing when the component mounts
155
+ if (lastFeedbackIndex.current) {
156
+ // fire haptic feedback if available
157
+ Haptics === null || Haptics === void 0 || Haptics.selectionAsync();
109
158
 
110
- // check limits
111
- if (newDuration > adjustedLimited.max) {
112
- newDuration = adjustedLimited.max;
113
- } else if (newDuration < adjustedLimited.min) {
114
- newDuration = adjustedLimited.min;
159
+ // play click sound if available
160
+ clickSound === null || clickSound === void 0 || clickSound.replayAsync();
161
+ }
162
+ lastFeedbackIndex.current = feedbackIndex;
163
+ }
115
164
  }
116
- latestDuration.current = newDuration;
117
- }, [adjustedLimited.max, adjustedLimited.min, disableInfiniteScroll, numberOfItems, padWithNItems, styles.pickerItemContainer.height]);
165
+ },
166
+ // eslint-disable-next-line react-hooks/exhaustive-deps
167
+ [adjustedLimited.max, adjustedLimited.min, aggressivelyGetLatestDuration, clickSound, disableInfiniteScroll, numberOfItems, padWithNItems, styles.pickerItemContainer.height]);
118
168
  const onMomentumScrollEnd = useCallback(e => {
119
169
  const newIndex = Math.round(e.nativeEvent.contentOffset.y / styles.pickerItemContainer.height);
120
170
  let newDuration = (disableInfiniteScroll ? newIndex : newIndex + padWithNItems) % (numberOfItems + 1);
@@ -173,35 +223,35 @@ const DurationScroll = /*#__PURE__*/forwardRef(({
173
223
  onViewableItemsChanged: onViewableItemsChanged
174
224
  }]);
175
225
  return /*#__PURE__*/React.createElement(View, {
176
- testID: testID,
177
226
  pointerEvents: isDisabled ? "none" : undefined,
178
227
  style: [{
179
228
  height: styles.pickerItemContainer.height * numberOfItemsToShow,
180
229
  overflow: "visible"
181
- }, isDisabled && styles.disabledPickerContainer]
230
+ }, isDisabled && styles.disabledPickerContainer],
231
+ testID: testID
182
232
  }, /*#__PURE__*/React.createElement(FlatList, {
183
233
  ref: flatListRef,
184
234
  data: data,
235
+ decelerationRate: 0.88,
185
236
  getItemLayout: getItemLayout,
186
237
  initialScrollIndex: initialScrollIndex,
187
- windowSize: numberOfItemsToShow,
238
+ keyExtractor: (_, index) => index.toString(),
239
+ onMomentumScrollEnd: onMomentumScrollEnd,
240
+ onScroll: onScroll,
188
241
  renderItem: renderItem,
189
- keyExtractor: KEY_EXTRACTOR,
190
- showsVerticalScrollIndicator: false,
191
- decelerationRate: 0.88,
242
+ scrollEnabled: !isDisabled,
192
243
  scrollEventThrottle: 16,
193
- snapToAlignment: "start",
194
- scrollEnabled: !isDisabled
244
+ showsVerticalScrollIndicator: false,
245
+ snapToAlignment: "start"
195
246
  // used in place of snapToOffset due to bug on Android
196
247
  ,
197
248
  snapToOffsets: [...Array(data.length)].map((_, i) => i * styles.pickerItemContainer.height),
249
+ testID: "duration-scroll-flatlist",
198
250
  viewabilityConfigCallbackPairs: !disableInfiniteScroll ? viewabilityConfigCallbackPairs === null || viewabilityConfigCallbackPairs === void 0 ? void 0 : viewabilityConfigCallbackPairs.current : undefined,
199
- onMomentumScrollEnd: onMomentumScrollEnd,
200
- onScroll: aggressivelyGetLatestDuration ? onScroll : undefined,
201
- testID: "duration-scroll-flatlist"
251
+ windowSize: numberOfItemsToShow
202
252
  }), /*#__PURE__*/React.createElement(View, {
203
- style: styles.pickerLabelContainer,
204
- pointerEvents: "none"
253
+ pointerEvents: "none",
254
+ style: styles.pickerLabelContainer
205
255
  }, typeof label === "string" ? /*#__PURE__*/React.createElement(Text, {
206
256
  allowFontScaling: allowFontScaling,
207
257
  style: styles.pickerLabel
@@ -210,15 +260,15 @@ const DurationScroll = /*#__PURE__*/forwardRef(({
210
260
  color: styles.pickerContainer.backgroundColor ?? "white",
211
261
  opacity: 0
212
262
  })],
213
- start: {
214
- x: 1,
215
- y: 0.3
216
- },
217
263
  end: {
218
264
  x: 1,
219
265
  y: 1
220
266
  },
221
- pointerEvents: "none"
267
+ pointerEvents: "none",
268
+ start: {
269
+ x: 1,
270
+ y: 0.3
271
+ }
222
272
  }, pickerGradientOverlayProps, topPickerGradientOverlayProps, {
223
273
  style: [styles.pickerGradientOverlay, {
224
274
  top: 0
@@ -228,15 +278,15 @@ const DurationScroll = /*#__PURE__*/forwardRef(({
228
278
  color: styles.pickerContainer.backgroundColor ?? "white",
229
279
  opacity: 0
230
280
  }), styles.pickerContainer.backgroundColor ?? "white"],
231
- start: {
232
- x: 1,
233
- y: 0
234
- },
235
281
  end: {
236
282
  x: 1,
237
283
  y: 0.7
238
284
  },
239
- pointerEvents: "none"
285
+ pointerEvents: "none",
286
+ start: {
287
+ x: 1,
288
+ y: 0
289
+ }
240
290
  }, pickerGradientOverlayProps, bottomPickerGradientOverlayProps, {
241
291
  style: [styles.pickerGradientOverlay, {
242
292
  bottom: -1
@@ -244,4 +294,4 @@ const DurationScroll = /*#__PURE__*/forwardRef(({
244
294
  }))) : null);
245
295
  });
246
296
  export default /*#__PURE__*/React.memo(DurationScroll);
247
- //# sourceMappingURL=DurationScroll.js.map
297
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"names":["React","useRef","useCallback","forwardRef","useImperativeHandle","useState","useEffect","View","Text","FlatList","colorToRgba","generate12HourNumbers","generateNumbers","getAdjustedLimit","getScrollIndex","DurationScroll","props","ref","aggressivelyGetLatestDuration","allowFontScaling","amLabel","Audio","bottomPickerGradientOverlayProps","clickSoundAsset","disableInfiniteScroll","Haptics","initialValue","is12HourPicker","isDisabled","label","limit","LinearGradient","numberOfItems","onDurationChange","padNumbersWithZero","padWithNItems","pickerGradientOverlayProps","pmLabel","styles","testID","topPickerGradientOverlayProps","data","repeatNTimes","numberOfItemsToShow","adjustedLimited","initialScrollIndex","value","latestDuration","lastFeedbackIndex","flatListRef","clickSound","setClickSound","loadSound","sound","Sound","createAsync","require","shouldPlay","unloadAsync","reset","options","_flatListRef$current","current","scrollToIndex","animated","index","setValue","_flatListRef$current2","renderItem","item","stringItem","intItem","isAm","parseInt","includes","replace","createElement","key","style","pickerItemContainer","pickerItem","max","min","disabledPickerItem","pointerEvents","pickerAmPmContainer","pickerAmPmLabel","onScroll","e","newIndex","Math","round","nativeEvent","contentOffset","y","height","newDuration","feedbackIndex","selectionAsync","replayAsync","onMomentumScrollEnd","_flatListRef$current3","targetScrollIndex","_flatListRef$current4","length","onViewableItemsChanged","viewableItems","_viewableItems$","_viewableItems$2","_flatListRef$current5","_flatListRef$current6","getItemLayout","_","offset","viewabilityConfigCallbackPairs","viewabilityConfig","viewAreaCoveragePercentThreshold","undefined","overflow","disabledPickerContainer","decelerationRate","keyExtractor","toString","scrollEnabled","scrollEventThrottle","showsVerticalScrollIndicator","snapToAlignment","snapToOffsets","Array","map","i","windowSize","pickerLabelContainer","pickerLabel","Fragment","_extends","colors","pickerContainer","backgroundColor","color","opacity","end","x","start","pickerGradientOverlay","top","bottom","memo"],"sources":["index.tsx"],"sourcesContent":["import React, {\n useRef,\n useCallback,\n forwardRef,\n useImperativeHandle,\n useState,\n useEffect,\n} from \"react\";\n\nimport { View, Text, FlatList } from \"react-native\";\nimport type {\n ViewabilityConfigCallbackPairs,\n ViewToken,\n NativeSyntheticEvent,\n NativeScrollEvent,\n} from \"react-native\";\n\nimport { colorToRgba } from \"../../utils/colorToRgba\";\nimport {\n generate12HourNumbers,\n generateNumbers,\n} from \"../../utils/generateNumbers\";\nimport { getAdjustedLimit } from \"../../utils/getAdjustedLimit\";\nimport { getScrollIndex } from \"../../utils/getScrollIndex\";\n\nimport type { DurationScrollProps, DurationScrollRef } from \"./types\";\n\nconst DurationScroll = forwardRef<DurationScrollRef, DurationScrollProps>(\n (props, ref) => {\n const {\n aggressivelyGetLatestDuration,\n allowFontScaling = false,\n amLabel,\n Audio,\n bottomPickerGradientOverlayProps,\n clickSoundAsset,\n disableInfiniteScroll = false,\n Haptics,\n initialValue = 0,\n is12HourPicker,\n isDisabled,\n label,\n limit,\n LinearGradient,\n numberOfItems,\n onDurationChange,\n padNumbersWithZero = false,\n padWithNItems,\n pickerGradientOverlayProps,\n pmLabel,\n styles,\n testID,\n topPickerGradientOverlayProps,\n } = props;\n\n const data = !is12HourPicker\n ? generateNumbers(numberOfItems, {\n padNumbersWithZero,\n repeatNTimes: 3,\n disableInfiniteScroll,\n padWithNItems,\n })\n : generate12HourNumbers({\n padNumbersWithZero,\n repeatNTimes: 3,\n disableInfiniteScroll,\n padWithNItems,\n });\n\n const numberOfItemsToShow = 1 + padWithNItems * 2;\n\n const adjustedLimited = getAdjustedLimit(limit, numberOfItems);\n\n const initialScrollIndex = getScrollIndex({\n value: initialValue,\n numberOfItems,\n padWithNItems,\n disableInfiniteScroll,\n });\n\n // keep track of the latest duration as it scrolls\n const latestDuration = useRef(0);\n // keep track of the last index scrolled past for haptic/audio feedback\n const lastFeedbackIndex = useRef(0);\n\n const flatListRef = useRef<FlatList | null>(null);\n\n const [clickSound, setClickSound] = useState<\n | {\n replayAsync: () => Promise<void>;\n unloadAsync: () => Promise<void>;\n }\n | undefined\n >();\n\n // Preload the sound when the component mounts\n useEffect(() => {\n const loadSound = async () => {\n if (Audio) {\n const { sound } = await Audio.Sound.createAsync(\n clickSoundAsset ??\n require(\"../../assets/select_click.mp3\"),\n { shouldPlay: false }\n );\n setClickSound(sound);\n }\n };\n loadSound();\n\n // Unload sound when component unmounts\n return () => {\n clickSound?.unloadAsync();\n };\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [Audio]);\n\n useImperativeHandle(ref, () => ({\n reset: (options) => {\n flatListRef.current?.scrollToIndex({\n animated: options?.animated ?? false,\n index: initialScrollIndex,\n });\n },\n setValue: (value, options) => {\n flatListRef.current?.scrollToIndex({\n animated: options?.animated ?? false,\n index: getScrollIndex({\n value: value,\n numberOfItems,\n padWithNItems,\n disableInfiniteScroll,\n }),\n });\n },\n latestDuration: latestDuration,\n }));\n\n const renderItem = useCallback(\n ({ item }: { item: string }) => {\n let stringItem = item;\n let intItem: number;\n let isAm: boolean | undefined;\n\n if (!is12HourPicker) {\n intItem = parseInt(item);\n } else {\n isAm = item.includes(\"AM\");\n stringItem = item.replace(/\\s[AP]M/g, \"\");\n intItem = parseInt(stringItem);\n }\n\n return (\n <View\n key={item}\n style={styles.pickerItemContainer}\n testID=\"picker-item\">\n <Text\n allowFontScaling={allowFontScaling}\n style={[\n styles.pickerItem,\n intItem > adjustedLimited.max ||\n intItem < adjustedLimited.min\n ? styles.disabledPickerItem\n : {},\n ]}>\n {stringItem}\n </Text>\n {is12HourPicker ? (\n <View\n pointerEvents=\"none\"\n style={styles.pickerAmPmContainer}>\n <Text\n allowFontScaling={allowFontScaling}\n style={[styles.pickerAmPmLabel]}>\n {isAm ? amLabel : pmLabel}\n </Text>\n </View>\n ) : null}\n </View>\n );\n },\n [\n adjustedLimited.max,\n adjustedLimited.min,\n allowFontScaling,\n amLabel,\n is12HourPicker,\n pmLabel,\n styles.disabledPickerItem,\n styles.pickerAmPmContainer,\n styles.pickerAmPmLabel,\n styles.pickerItem,\n styles.pickerItemContainer,\n ]\n );\n\n const onScroll = useCallback(\n (e: NativeSyntheticEvent<NativeScrollEvent>) => {\n // this function is only used when the picker is in a modal and/or has Haptic/Audio feedback\n // it is used to ensure that the modal gets the latest duration on clicking\n // the confirm button, even if the scrollview is still scrolling\n if (!aggressivelyGetLatestDuration && !Haptics && !Audio) {\n return;\n }\n\n if (aggressivelyGetLatestDuration) {\n const newIndex = Math.round(\n e.nativeEvent.contentOffset.y /\n styles.pickerItemContainer.height\n );\n let newDuration =\n (disableInfiniteScroll\n ? newIndex\n : newIndex + padWithNItems) %\n (numberOfItems + 1);\n\n if (newDuration !== latestDuration.current) {\n // check limits\n if (newDuration > adjustedLimited.max) {\n newDuration = adjustedLimited.max;\n } else if (newDuration < adjustedLimited.min) {\n newDuration = adjustedLimited.min;\n }\n\n latestDuration.current = newDuration;\n }\n }\n\n if (Haptics || Audio) {\n const feedbackIndex = Math.round(\n (e.nativeEvent.contentOffset.y +\n styles.pickerItemContainer.height / 2) /\n styles.pickerItemContainer.height\n );\n\n if (feedbackIndex !== lastFeedbackIndex.current) {\n // this check stops the feedback firing when the component mounts\n if (lastFeedbackIndex.current) {\n // fire haptic feedback if available\n Haptics?.selectionAsync();\n\n // play click sound if available\n clickSound?.replayAsync();\n }\n\n lastFeedbackIndex.current = feedbackIndex;\n }\n }\n },\n // eslint-disable-next-line react-hooks/exhaustive-deps\n [\n adjustedLimited.max,\n adjustedLimited.min,\n aggressivelyGetLatestDuration,\n clickSound,\n disableInfiniteScroll,\n numberOfItems,\n padWithNItems,\n styles.pickerItemContainer.height,\n ]\n );\n\n const onMomentumScrollEnd = useCallback(\n (e: NativeSyntheticEvent<NativeScrollEvent>) => {\n const newIndex = Math.round(\n e.nativeEvent.contentOffset.y /\n styles.pickerItemContainer.height\n );\n let newDuration =\n (disableInfiniteScroll\n ? newIndex\n : newIndex + padWithNItems) %\n (numberOfItems + 1);\n\n // check limits\n if (newDuration > adjustedLimited.max) {\n const targetScrollIndex =\n newIndex - (newDuration - adjustedLimited.max);\n flatListRef.current?.scrollToIndex({\n animated: true,\n index:\n // guard against scrolling beyond end of list\n targetScrollIndex >= 0\n ? targetScrollIndex\n : adjustedLimited.max - 1,\n }); // scroll down to max\n newDuration = adjustedLimited.max;\n } else if (newDuration < adjustedLimited.min) {\n const targetScrollIndex =\n newIndex + (adjustedLimited.min - newDuration);\n flatListRef.current?.scrollToIndex({\n animated: true,\n index:\n // guard against scrolling beyond end of list\n targetScrollIndex <= data.length - 1\n ? targetScrollIndex\n : adjustedLimited.min,\n }); // scroll up to min\n newDuration = adjustedLimited.min;\n }\n\n onDurationChange(newDuration);\n },\n [\n adjustedLimited.max,\n adjustedLimited.min,\n data.length,\n disableInfiniteScroll,\n numberOfItems,\n onDurationChange,\n padWithNItems,\n styles.pickerItemContainer.height,\n ]\n );\n\n const onViewableItemsChanged = useCallback(\n ({ viewableItems }: { viewableItems: ViewToken[] }) => {\n if (\n viewableItems[0]?.index &&\n viewableItems[0].index < numberOfItems * 0.5\n ) {\n flatListRef.current?.scrollToIndex({\n animated: false,\n index: viewableItems[0].index + numberOfItems,\n });\n } else if (\n viewableItems[0]?.index &&\n viewableItems[0].index >= numberOfItems * 2.5\n ) {\n flatListRef.current?.scrollToIndex({\n animated: false,\n index: viewableItems[0].index - numberOfItems,\n });\n }\n },\n [numberOfItems]\n );\n\n const getItemLayout = useCallback(\n (_: ArrayLike<string> | null | undefined, index: number) => ({\n length: styles.pickerItemContainer.height,\n offset: styles.pickerItemContainer.height * index,\n index,\n }),\n [styles.pickerItemContainer.height]\n );\n\n const viewabilityConfigCallbackPairs =\n useRef<ViewabilityConfigCallbackPairs>([\n {\n viewabilityConfig: { viewAreaCoveragePercentThreshold: 25 },\n onViewableItemsChanged: onViewableItemsChanged,\n },\n ]);\n\n return (\n <View\n pointerEvents={isDisabled ? \"none\" : undefined}\n style={[\n {\n height:\n styles.pickerItemContainer.height *\n numberOfItemsToShow,\n overflow: \"visible\",\n },\n isDisabled && styles.disabledPickerContainer,\n ]}\n testID={testID}>\n <FlatList\n ref={flatListRef}\n data={data}\n decelerationRate={0.88}\n getItemLayout={getItemLayout}\n initialScrollIndex={initialScrollIndex}\n keyExtractor={(_, index) => index.toString()}\n onMomentumScrollEnd={onMomentumScrollEnd}\n onScroll={onScroll}\n renderItem={renderItem}\n scrollEnabled={!isDisabled}\n scrollEventThrottle={16}\n showsVerticalScrollIndicator={false}\n snapToAlignment=\"start\"\n // used in place of snapToOffset due to bug on Android\n snapToOffsets={[...Array(data.length)].map(\n (_, i) => i * styles.pickerItemContainer.height\n )}\n testID=\"duration-scroll-flatlist\"\n viewabilityConfigCallbackPairs={\n !disableInfiniteScroll\n ? viewabilityConfigCallbackPairs?.current\n : undefined\n }\n windowSize={numberOfItemsToShow}\n />\n <View pointerEvents=\"none\" style={styles.pickerLabelContainer}>\n {typeof label === \"string\" ? (\n <Text\n allowFontScaling={allowFontScaling}\n style={styles.pickerLabel}>\n {label}\n </Text>\n ) : (\n label ?? null\n )}\n </View>\n {LinearGradient ? (\n <>\n <LinearGradient\n colors={[\n styles.pickerContainer.backgroundColor ??\n \"white\",\n colorToRgba({\n color:\n styles.pickerContainer\n .backgroundColor ?? \"white\",\n opacity: 0,\n }),\n ]}\n end={{ x: 1, y: 1 }}\n pointerEvents=\"none\"\n start={{ x: 1, y: 0.3 }}\n {...pickerGradientOverlayProps}\n {...topPickerGradientOverlayProps}\n style={[styles.pickerGradientOverlay, { top: 0 }]}\n />\n <LinearGradient\n colors={[\n colorToRgba({\n color:\n styles.pickerContainer\n .backgroundColor ?? \"white\",\n opacity: 0,\n }),\n styles.pickerContainer.backgroundColor ??\n \"white\",\n ]}\n end={{ x: 1, y: 0.7 }}\n pointerEvents=\"none\"\n start={{ x: 1, y: 0 }}\n {...pickerGradientOverlayProps}\n {...bottomPickerGradientOverlayProps}\n style={[\n styles.pickerGradientOverlay,\n { bottom: -1 },\n ]}\n />\n </>\n ) : null}\n </View>\n );\n }\n);\n\nexport default React.memo(DurationScroll);\n"],"mappings":"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"}
@@ -0,0 +1,2 @@
1
+ export {};
2
+ //# sourceMappingURL=types.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"names":[],"sources":["types.ts"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\nimport type { MutableRefObject } from \"react\";\n\nimport type { View } from \"react-native\";\n\nimport type { generateStyles } from \"../TimerPicker/styles\";\n\nexport interface DurationScrollProps {\n Audio?: any;\n Haptics?: any;\n LinearGradient?: any;\n aggressivelyGetLatestDuration: boolean;\n allowFontScaling?: boolean;\n amLabel?: string;\n bottomPickerGradientOverlayProps?: Partial<LinearGradientProps>;\n clickSoundAsset?: SoundAssetType;\n disableInfiniteScroll?: boolean;\n initialValue?: number;\n is12HourPicker?: boolean;\n isDisabled?: boolean;\n label?: string | React.ReactElement;\n limit?: LimitType;\n numberOfItems: number;\n onDurationChange: (duration: number) => void;\n padNumbersWithZero?: boolean;\n padWithNItems: number;\n pickerGradientOverlayProps?: Partial<LinearGradientProps>;\n pmLabel?: string;\n styles: ReturnType<typeof generateStyles>;\n testID?: string;\n topPickerGradientOverlayProps?: Partial<LinearGradientProps>;\n}\n\nexport interface DurationScrollRef {\n latestDuration: MutableRefObject<number>;\n reset: (options?: { animated?: boolean }) => void;\n setValue: (value: number, options?: { animated?: boolean }) => void;\n}\n\ntype LinearGradientPoint = {\n x: number;\n y: number;\n};\n\nexport type LinearGradientProps = React.ComponentProps<typeof View> & {\n colors: string[];\n end?: LinearGradientPoint | null;\n locations?: number[] | null;\n start?: LinearGradientPoint | null;\n};\n\nexport type LimitType = {\n max?: number;\n min?: number;\n};\n\nexport type SoundAssetType =\n | number\n | {\n headers?: Record<string, string>;\n overrideFileExtensionAndroid?: string;\n uri: string;\n };\n"],"mappings":""}
@@ -1,23 +1,23 @@
1
1
  function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
2
- /* eslint-disable @typescript-eslint/no-explicit-any */
3
2
  import React, { useCallback, useEffect, useRef } from "react";
4
3
  import { Animated, Easing, Modal as ReactNativeModal, TouchableWithoutFeedback, useWindowDimensions } from "react-native";
5
- import { styles } from "./Modal.styles";
6
- export const Modal = ({
7
- children,
8
- onOverlayPress,
9
- onHide,
10
- isVisible = false,
11
- animationDuration = 300,
12
- overlayOpacity = 0.4,
13
- modalProps,
14
- contentStyle,
15
- overlayStyle,
16
- testID = "modal"
17
- }) => {
4
+ import { styles } from "./styles";
5
+ export const Modal = props => {
18
6
  const {
19
- width: screenWidth,
20
- height: screenHeight
7
+ animationDuration = 300,
8
+ children,
9
+ contentStyle,
10
+ isVisible = false,
11
+ modalProps,
12
+ onHide,
13
+ onOverlayPress,
14
+ overlayOpacity = 0.4,
15
+ overlayStyle,
16
+ testID = "modal"
17
+ } = props;
18
+ const {
19
+ height: screenHeight,
20
+ width: screenWidth
21
21
  } = useWindowDimensions();
22
22
  const isMounted = useRef(false);
23
23
  const animatedOpacity = useRef(new Animated.Value(0));
@@ -77,8 +77,8 @@ export const Modal = ({
77
77
  // eslint-disable-next-line react-hooks/exhaustive-deps
78
78
  }, [isVisible]);
79
79
  return /*#__PURE__*/React.createElement(ReactNativeModal, _extends({
80
- transparent: true,
81
80
  animationType: "fade",
81
+ transparent: true,
82
82
  visible: isVisible
83
83
  }, modalProps, {
84
84
  testID: testID
@@ -91,8 +91,8 @@ export const Modal = ({
91
91
  height: screenHeight
92
92
  }, overlayStyle]
93
93
  })), /*#__PURE__*/React.createElement(Animated.View, {
94
- style: [styles.content, contentAnimatedStyle, contentStyle],
95
- pointerEvents: "box-none"
94
+ pointerEvents: "box-none",
95
+ style: [styles.content, contentAnimatedStyle, contentStyle]
96
96
  }, children));
97
97
  };
98
98
  export default /*#__PURE__*/React.memo(Modal);
@@ -1 +1 @@
1
- {"version":3,"names":["React","useCallback","useEffect","useRef","Animated","Easing","Modal","ReactNativeModal","TouchableWithoutFeedback","useWindowDimensions","styles","children","onOverlayPress","onHide","isVisible","animationDuration","overlayOpacity","modalProps","contentStyle","overlayStyle","testID","width","screenWidth","height","screenHeight","isMounted","animatedOpacity","Value","current","show","backdropAnimatedStyle","opacity","interpolate","inputRange","outputRange","contentAnimatedStyle","transform","translateY","extrapolate","timing","easing","inOut","quad","useNativeDriver","duration","toValue","start","hide","createElement","_extends","transparent","animationType","visible","onPress","View","style","backdrop","content","pointerEvents","memo"],"sources":["index.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\nimport React, { useCallback, useEffect, useRef } from \"react\";\nimport {\n Animated,\n Easing,\n Modal as ReactNativeModal,\n TouchableWithoutFeedback,\n useWindowDimensions,\n} from \"react-native\";\n\nimport { styles } from \"./Modal.styles\";\n\ninterface ModalProps {\n children?: React.ReactElement;\n onOverlayPress?: () => void;\n onHide?: () => void;\n isVisible?: boolean;\n animationDuration?: number;\n overlayOpacity?: number;\n modalProps?: any;\n contentStyle?: any;\n overlayStyle?: any;\n testID?: string;\n}\n\nexport const Modal = ({\n children,\n onOverlayPress,\n onHide,\n isVisible = false,\n animationDuration = 300,\n overlayOpacity = 0.4,\n modalProps,\n contentStyle,\n overlayStyle,\n testID = \"modal\",\n}: ModalProps): React.ReactElement => {\n const { width: screenWidth, height: screenHeight } = useWindowDimensions();\n\n const isMounted = useRef(false);\n const animatedOpacity = useRef(new Animated.Value(0));\n\n useEffect(() => {\n isMounted.current = true;\n if (isVisible) {\n show();\n }\n\n return () => {\n isMounted.current = false;\n };\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, []);\n\n const backdropAnimatedStyle = {\n opacity: animatedOpacity.current.interpolate({\n inputRange: [0, 1],\n outputRange: [0, overlayOpacity],\n }),\n };\n const contentAnimatedStyle = {\n transform: [\n {\n translateY: animatedOpacity.current.interpolate({\n inputRange: [0, 1],\n outputRange: [screenHeight, 0],\n extrapolate: \"clamp\",\n }),\n },\n ],\n };\n\n const show = useCallback(() => {\n Animated.timing(animatedOpacity.current, {\n easing: Easing.inOut(Easing.quad),\n // Using native driver in the modal makes the content flash\n useNativeDriver: true,\n duration: animationDuration,\n toValue: 1,\n }).start();\n }, [animationDuration]);\n\n const hide = useCallback(() => {\n Animated.timing(animatedOpacity.current, {\n easing: Easing.inOut(Easing.quad),\n // Using native driver in the modal makes the content flash\n useNativeDriver: true,\n duration: animationDuration,\n toValue: 0,\n }).start(() => {\n if (isMounted.current) {\n onHide?.();\n }\n });\n }, [animationDuration, onHide]);\n\n useEffect(() => {\n if (isVisible) {\n show();\n } else {\n hide();\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [isVisible]);\n\n return (\n <ReactNativeModal\n transparent\n animationType=\"fade\"\n visible={isVisible}\n {...modalProps}\n testID={testID}>\n <TouchableWithoutFeedback\n onPress={onOverlayPress}\n testID=\"modal-backdrop\">\n <Animated.View\n style={[\n styles.backdrop,\n backdropAnimatedStyle,\n { width: screenWidth, height: screenHeight },\n overlayStyle,\n ]}\n />\n </TouchableWithoutFeedback>\n <Animated.View\n style={[styles.content, contentAnimatedStyle, contentStyle]}\n pointerEvents=\"box-none\">\n {children}\n </Animated.View>\n </ReactNativeModal>\n );\n};\n\nexport default React.memo(Modal);\n"],"mappings":"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"}
1
+ {"version":3,"names":["React","useCallback","useEffect","useRef","Animated","Easing","Modal","ReactNativeModal","TouchableWithoutFeedback","useWindowDimensions","styles","props","animationDuration","children","contentStyle","isVisible","modalProps","onHide","onOverlayPress","overlayOpacity","overlayStyle","testID","height","screenHeight","width","screenWidth","isMounted","animatedOpacity","Value","current","show","backdropAnimatedStyle","opacity","interpolate","inputRange","outputRange","contentAnimatedStyle","transform","translateY","extrapolate","timing","easing","inOut","quad","useNativeDriver","duration","toValue","start","hide","createElement","_extends","animationType","transparent","visible","onPress","View","style","backdrop","pointerEvents","content","memo"],"sources":["index.tsx"],"sourcesContent":["import React, { useCallback, useEffect, useRef } from \"react\";\n\nimport {\n Animated,\n Easing,\n Modal as ReactNativeModal,\n TouchableWithoutFeedback,\n useWindowDimensions,\n} from \"react-native\";\n\nimport { styles } from \"./styles\";\nimport type { ModalProps } from \"./types\";\n\nexport const Modal = (props: ModalProps) => {\n const {\n animationDuration = 300,\n children,\n contentStyle,\n isVisible = false,\n modalProps,\n onHide,\n onOverlayPress,\n overlayOpacity = 0.4,\n overlayStyle,\n testID = \"modal\",\n } = props;\n\n const { height: screenHeight, width: screenWidth } = useWindowDimensions();\n\n const isMounted = useRef(false);\n const animatedOpacity = useRef(new Animated.Value(0));\n\n useEffect(() => {\n isMounted.current = true;\n if (isVisible) {\n show();\n }\n\n return () => {\n isMounted.current = false;\n };\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, []);\n\n const backdropAnimatedStyle = {\n opacity: animatedOpacity.current.interpolate({\n inputRange: [0, 1],\n outputRange: [0, overlayOpacity],\n }),\n };\n const contentAnimatedStyle = {\n transform: [\n {\n translateY: animatedOpacity.current.interpolate({\n inputRange: [0, 1],\n outputRange: [screenHeight, 0],\n extrapolate: \"clamp\",\n }),\n },\n ],\n };\n\n const show = useCallback(() => {\n Animated.timing(animatedOpacity.current, {\n easing: Easing.inOut(Easing.quad),\n // Using native driver in the modal makes the content flash\n useNativeDriver: true,\n duration: animationDuration,\n toValue: 1,\n }).start();\n }, [animationDuration]);\n\n const hide = useCallback(() => {\n Animated.timing(animatedOpacity.current, {\n easing: Easing.inOut(Easing.quad),\n // Using native driver in the modal makes the content flash\n useNativeDriver: true,\n duration: animationDuration,\n toValue: 0,\n }).start(() => {\n if (isMounted.current) {\n onHide?.();\n }\n });\n }, [animationDuration, onHide]);\n\n useEffect(() => {\n if (isVisible) {\n show();\n } else {\n hide();\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [isVisible]);\n\n return (\n <ReactNativeModal\n animationType=\"fade\"\n transparent\n visible={isVisible}\n {...modalProps}\n testID={testID}>\n <TouchableWithoutFeedback\n onPress={onOverlayPress}\n testID=\"modal-backdrop\">\n <Animated.View\n style={[\n styles.backdrop,\n backdropAnimatedStyle,\n { width: screenWidth, height: screenHeight },\n overlayStyle,\n ]}\n />\n </TouchableWithoutFeedback>\n <Animated.View\n pointerEvents=\"box-none\"\n style={[styles.content, contentAnimatedStyle, contentStyle]}>\n {children}\n </Animated.View>\n </ReactNativeModal>\n );\n};\n\nexport default React.memo(Modal);\n"],"mappings":"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"}
@@ -23,4 +23,4 @@ export const styles = StyleSheet.create({
23
23
  zIndex: 1
24
24
  }
25
25
  });
26
- //# sourceMappingURL=Modal.styles.js.map
26
+ //# sourceMappingURL=styles.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"names":["StyleSheet","styles","create","container","position","top","left","right","bottom","backdrop","backgroundColor","opacity","content","flex","justifyContent","alignItems","zIndex"],"sources":["styles.ts"],"sourcesContent":["import { StyleSheet } from \"react-native\";\n\nexport const styles = StyleSheet.create({\n container: {\n position: \"absolute\",\n top: 0,\n left: 0,\n right: 0,\n bottom: 0,\n },\n backdrop: {\n position: \"absolute\",\n top: 0,\n bottom: 0,\n left: 0,\n right: 0,\n backgroundColor: \"black\",\n opacity: 0,\n },\n content: {\n flex: 1,\n justifyContent: \"center\",\n alignItems: \"center\",\n zIndex: 1,\n },\n});"],"mappings":"AAAA,SAASA,UAAU,QAAQ,cAAc;AAEzC,OAAO,MAAMC,MAAM,GAAGD,UAAU,CAACE,MAAM,CAAC;EACpCC,SAAS,EAAE;IACPC,QAAQ,EAAE,UAAU;IACpBC,GAAG,EAAE,CAAC;IACNC,IAAI,EAAE,CAAC;IACPC,KAAK,EAAE,CAAC;IACRC,MAAM,EAAE;EACZ,CAAC;EACDC,QAAQ,EAAE;IACNL,QAAQ,EAAE,UAAU;IACpBC,GAAG,EAAE,CAAC;IACNG,MAAM,EAAE,CAAC;IACTF,IAAI,EAAE,CAAC;IACPC,KAAK,EAAE,CAAC;IACRG,eAAe,EAAE,OAAO;IACxBC,OAAO,EAAE;EACb,CAAC;EACDC,OAAO,EAAE;IACLC,IAAI,EAAE,CAAC;IACPC,cAAc,EAAE,QAAQ;IACxBC,UAAU,EAAE,QAAQ;IACpBC,MAAM,EAAE;EACZ;AACJ,CAAC,CAAC"}
@@ -0,0 +1,2 @@
1
+ export {};
2
+ //# sourceMappingURL=types.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"names":[],"sources":["types.ts"],"sourcesContent":["import type { ComponentProps } from \"react\";\n\nimport type { ViewStyle } from \"react-native\";\nimport type { Modal as ReactNativeModal } from \"react-native\";\n\nexport interface ModalProps {\n animationDuration?: number;\n children?: React.ReactElement;\n contentStyle?: ViewStyle;\n isVisible?: boolean;\n modalProps?: ComponentProps<typeof ReactNativeModal>;\n onHide?: () => void;\n onOverlayPress?: () => void;\n overlayOpacity?: number;\n overlayStyle?: ViewStyle;\n testID?: string;\n}\n"],"mappings":""}