@metamask-previews/design-system-react-native 0.30.2-preview.9bd8bc3 → 0.30.2-preview.e22e766

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 (65) hide show
  1. package/dist/components/BottomSheet/BottomSheet.cjs +7 -12
  2. package/dist/components/BottomSheet/BottomSheet.cjs.map +1 -1
  3. package/dist/components/BottomSheet/BottomSheet.d.cts +0 -1
  4. package/dist/components/BottomSheet/BottomSheet.d.cts.map +1 -1
  5. package/dist/components/BottomSheet/BottomSheet.d.mts +0 -1
  6. package/dist/components/BottomSheet/BottomSheet.d.mts.map +1 -1
  7. package/dist/components/BottomSheet/BottomSheet.mjs +7 -12
  8. package/dist/components/BottomSheet/BottomSheet.mjs.map +1 -1
  9. package/dist/components/BottomSheetDialog/BottomSheetDialog.cjs +21 -20
  10. package/dist/components/BottomSheetDialog/BottomSheetDialog.cjs.map +1 -1
  11. package/dist/components/BottomSheetDialog/BottomSheetDialog.constants.cjs +9 -16
  12. package/dist/components/BottomSheetDialog/BottomSheetDialog.constants.cjs.map +1 -1
  13. package/dist/components/BottomSheetDialog/BottomSheetDialog.constants.d.cts +7 -14
  14. package/dist/components/BottomSheetDialog/BottomSheetDialog.constants.d.cts.map +1 -1
  15. package/dist/components/BottomSheetDialog/BottomSheetDialog.constants.d.mts +7 -14
  16. package/dist/components/BottomSheetDialog/BottomSheetDialog.constants.d.mts.map +1 -1
  17. package/dist/components/BottomSheetDialog/BottomSheetDialog.constants.mjs +8 -14
  18. package/dist/components/BottomSheetDialog/BottomSheetDialog.constants.mjs.map +1 -1
  19. package/dist/components/BottomSheetDialog/BottomSheetDialog.d.cts +0 -1
  20. package/dist/components/BottomSheetDialog/BottomSheetDialog.d.cts.map +1 -1
  21. package/dist/components/BottomSheetDialog/BottomSheetDialog.d.mts +0 -1
  22. package/dist/components/BottomSheetDialog/BottomSheetDialog.d.mts.map +1 -1
  23. package/dist/components/BottomSheetDialog/BottomSheetDialog.mjs +25 -24
  24. package/dist/components/BottomSheetDialog/BottomSheetDialog.mjs.map +1 -1
  25. package/dist/components/BottomSheetDialog/BottomSheetDialog.types.cjs.map +1 -1
  26. package/dist/components/BottomSheetDialog/BottomSheetDialog.types.d.cts +0 -4
  27. package/dist/components/BottomSheetDialog/BottomSheetDialog.types.d.cts.map +1 -1
  28. package/dist/components/BottomSheetDialog/BottomSheetDialog.types.d.mts +0 -4
  29. package/dist/components/BottomSheetDialog/BottomSheetDialog.types.d.mts.map +1 -1
  30. package/dist/components/BottomSheetDialog/BottomSheetDialog.types.mjs.map +1 -1
  31. package/dist/components/BottomSheetOverlay/BottomSheetOverlay.cjs +5 -21
  32. package/dist/components/BottomSheetOverlay/BottomSheetOverlay.cjs.map +1 -1
  33. package/dist/components/BottomSheetOverlay/BottomSheetOverlay.constants.cjs +3 -5
  34. package/dist/components/BottomSheetOverlay/BottomSheetOverlay.constants.cjs.map +1 -1
  35. package/dist/components/BottomSheetOverlay/BottomSheetOverlay.constants.d.cts +1 -3
  36. package/dist/components/BottomSheetOverlay/BottomSheetOverlay.constants.d.cts.map +1 -1
  37. package/dist/components/BottomSheetOverlay/BottomSheetOverlay.constants.d.mts +1 -3
  38. package/dist/components/BottomSheetOverlay/BottomSheetOverlay.constants.d.mts.map +1 -1
  39. package/dist/components/BottomSheetOverlay/BottomSheetOverlay.constants.mjs +2 -4
  40. package/dist/components/BottomSheetOverlay/BottomSheetOverlay.constants.mjs.map +1 -1
  41. package/dist/components/BottomSheetOverlay/BottomSheetOverlay.d.cts +2 -6
  42. package/dist/components/BottomSheetOverlay/BottomSheetOverlay.d.cts.map +1 -1
  43. package/dist/components/BottomSheetOverlay/BottomSheetOverlay.d.mts +2 -6
  44. package/dist/components/BottomSheetOverlay/BottomSheetOverlay.d.mts.map +1 -1
  45. package/dist/components/BottomSheetOverlay/BottomSheetOverlay.mjs +7 -24
  46. package/dist/components/BottomSheetOverlay/BottomSheetOverlay.mjs.map +1 -1
  47. package/dist/components/BottomSheetOverlay/BottomSheetOverlay.types.cjs.map +1 -1
  48. package/dist/components/BottomSheetOverlay/BottomSheetOverlay.types.d.cts +0 -13
  49. package/dist/components/BottomSheetOverlay/BottomSheetOverlay.types.d.cts.map +1 -1
  50. package/dist/components/BottomSheetOverlay/BottomSheetOverlay.types.d.mts +0 -13
  51. package/dist/components/BottomSheetOverlay/BottomSheetOverlay.types.d.mts.map +1 -1
  52. package/dist/components/BottomSheetOverlay/BottomSheetOverlay.types.mjs.map +1 -1
  53. package/dist/components/BottomSheetOverlay/index.cjs.map +1 -1
  54. package/dist/components/BottomSheetOverlay/index.d.cts +1 -1
  55. package/dist/components/BottomSheetOverlay/index.d.cts.map +1 -1
  56. package/dist/components/BottomSheetOverlay/index.d.mts +1 -1
  57. package/dist/components/BottomSheetOverlay/index.d.mts.map +1 -1
  58. package/dist/components/BottomSheetOverlay/index.mjs.map +1 -1
  59. package/dist/components/index.cjs.map +1 -1
  60. package/dist/components/index.d.cts +1 -1
  61. package/dist/components/index.d.cts.map +1 -1
  62. package/dist/components/index.d.mts +1 -1
  63. package/dist/components/index.d.mts.map +1 -1
  64. package/dist/components/index.mjs.map +1 -1
  65. package/package.json +4 -4
@@ -5,7 +5,6 @@ export declare const BottomSheetDialog: React.ForwardRefExoticComponent<{
5
5
  isFullscreen?: boolean | undefined;
6
6
  isInteractable?: boolean | undefined;
7
7
  keyboardAvoidingViewEnabled?: boolean | undefined;
8
- onDismissStart?: (() => void) | undefined;
9
8
  onClose?: ((hasPendingAction?: boolean | undefined) => void) | undefined;
10
9
  onOpen?: ((hasPendingAction?: boolean | undefined) => void) | undefined;
11
10
  twClassName?: string | undefined;
@@ -1 +1 @@
1
- {"version":3,"file":"BottomSheetDialog.d.mts","sourceRoot":"","sources":["../../../src/components/BottomSheetDialog/BottomSheetDialog.tsx"],"names":[],"mappings":"AAOA,OAAO,KAON,cAAc;AAyBf,OAAO,KAAK,EACV,oBAAoB,EAErB,sCAAkC;AAEnC,eAAO,MAAM,iBAAiB;;;;;;;;;iFAoR7B,CAAC"}
1
+ {"version":3,"file":"BottomSheetDialog.d.mts","sourceRoot":"","sources":["../../../src/components/BottomSheetDialog/BottomSheetDialog.tsx"],"names":[],"mappings":"AAQA,OAAO,KAON,cAAc;AAyBf,OAAO,KAAK,EACV,oBAAoB,EAErB,sCAAkC;AAEnC,eAAO,MAAM,iBAAiB;;;;;;;;iFAqR7B,CAAC"}
@@ -4,24 +4,25 @@ function $importDefault(module) {
4
4
  }
5
5
  return module;
6
6
  }
7
- import { Theme, useTailwind, useTheme } from "@metamask-previews/design-system-twrnc-preset";
8
- import { lightTheme, darkTheme } from "@metamask-previews/design-tokens";
7
+ import { Theme, usePureBlack, useTailwind, useTheme } from "@metamask-previews/design-system-twrnc-preset";
8
+ import { lightTheme, resolveDarkTheme } from "@metamask-previews/design-tokens";
9
9
  import $lodash from "lodash";
10
10
  const { debounce } = $lodash;
11
11
  import $React, { forwardRef, useCallback, useEffect, useMemo, useRef, useImperativeHandle } from "react";
12
12
  const React = $importDefault($React);
13
13
  import { View, Platform, KeyboardAvoidingView } from "react-native";
14
14
  import { Gesture, GestureDetector } from "react-native-gesture-handler";
15
- import Animated, { runOnJS, useAnimatedStyle, useSharedValue, withSpring } from "react-native-reanimated";
15
+ import Animated, { runOnJS, useAnimatedStyle, useSharedValue, withTiming } from "react-native-reanimated";
16
16
  import { useSafeAreaFrame, useSafeAreaInsets } from "react-native-safe-area-context";
17
17
  // Internal dependencies.
18
- import { DEFAULT_BOTTOMSHEETDIALOG_DISMISSTHRESHOLD, DEFAULT_BOTTOMSHEETDIALOG_SWIPETHRESHOLD_VELOCITY, getBottomSheetDialogSpringConfig } from "./BottomSheetDialog.constants.mjs";
19
- export const BottomSheetDialog = forwardRef(({ children, isFullscreen = false, isInteractable = true, keyboardAvoidingViewEnabled = true, onDismissStart, onClose, onOpen, style, twClassName, ...props }, ref) => {
18
+ import { DEFAULT_BOTTOMSHEETDIALOG_DISPLAY_DURATION, DEFAULT_BOTTOMSHEETDIALOG_DISMISSTHRESHOLD, DEFAULT_BOTTOMSHEETDIALOG_SWIPETHRESHOLD_DURATION } from "./BottomSheetDialog.constants.mjs";
19
+ export const BottomSheetDialog = forwardRef(({ children, isFullscreen = false, isInteractable = true, keyboardAvoidingViewEnabled = true, onClose, onOpen, style, twClassName, ...props }, ref) => {
20
20
  const tw = useTailwind();
21
21
  const currentTheme = useTheme();
22
+ const isPureBlack = usePureBlack();
22
23
  const shadowLg = currentTheme === Theme.Light
23
24
  ? lightTheme.shadows.size.lg
24
- : darkTheme.shadows.size.lg;
25
+ : resolveDarkTheme(isPureBlack).shadows.size.lg;
25
26
  const { top: screenTopPadding, bottom: screenBottomPadding } = useSafeAreaInsets();
26
27
  const { y: frameY, height: screenHeight } = useSafeAreaFrame();
27
28
  const maxSheetHeight = screenHeight - screenTopPadding;
@@ -38,23 +39,15 @@ export const BottomSheetDialog = forwardRef(({ children, isFullscreen = false, i
38
39
  const onCloseCB = useCallback(() => {
39
40
  onClose?.();
40
41
  }, [onClose]);
41
- const animateSheetTo = (target, onComplete) => {
42
- currentYOffset.value = withSpring(target, getBottomSheetDialogSpringConfig(), (finished) => {
43
- if (finished && onComplete) {
44
- runOnJS(onComplete)();
45
- }
46
- });
47
- };
48
42
  const onCloseDialog = useCallback((callback) => {
49
- onDismissStart?.();
50
- animateSheetTo(bottomOfDialogYValue.value, () => {
51
- onCloseCB();
43
+ currentYOffset.value = withTiming(bottomOfDialogYValue.value, { duration: DEFAULT_BOTTOMSHEETDIALOG_DISPLAY_DURATION }, () => {
44
+ runOnJS(onCloseCB)();
52
45
  if (callback) {
53
- callback();
46
+ runOnJS(callback)();
54
47
  }
55
48
  });
56
49
  // Ref values do not affect deps.
57
- }, [onCloseCB, onDismissStart]);
50
+ }, [onCloseCB]);
58
51
  const gestureHandler = useMemo(() => {
59
52
  // These gesture callbacks need explicit 'worklet' directives because this
60
53
  // package ships a pre-built dist compiled by ts-bridge (tsc), which emits the
@@ -101,7 +94,7 @@ export const BottomSheetDialog = forwardRef(({ children, isFullscreen = false, i
101
94
  DEFAULT_BOTTOMSHEETDIALOG_DISMISSTHRESHOLD;
102
95
  // Check if the gesture's vertical speed has reached the threshold to determine a swipe action
103
96
  const hasReachedSwipeThreshold = Math.abs(velocityY) >
104
- DEFAULT_BOTTOMSHEETDIALOG_SWIPETHRESHOLD_VELOCITY;
97
+ DEFAULT_BOTTOMSHEETDIALOG_SWIPETHRESHOLD_DURATION;
105
98
  const isQuickDismissing = velocityY > 0;
106
99
  // If user is swiping
107
100
  if (hasReachedSwipeThreshold) {
@@ -124,7 +117,10 @@ export const BottomSheetDialog = forwardRef(({ children, isFullscreen = false, i
124
117
  runOnJS(onCloseDialog)();
125
118
  }
126
119
  else {
127
- currentYOffset.value = withSpring(finalYOffset, getBottomSheetDialogSpringConfig({ velocity: velocityY }));
120
+ // Only animate dialog to a certain Y position instead
121
+ currentYOffset.value = withTiming(finalYOffset, {
122
+ duration: DEFAULT_BOTTOMSHEETDIALOG_DISPLAY_DURATION,
123
+ });
128
124
  }
129
125
  });
130
126
  return gesture;
@@ -138,11 +134,15 @@ export const BottomSheetDialog = forwardRef(({ children, isFullscreen = false, i
138
134
  ]);
139
135
  // Animate in sheet on initial render.
140
136
  const onOpenDialog = (callback) => {
137
+ // Starts setting the Y position of the dialog to the bottom of the dialog
141
138
  currentYOffset.value = bottomOfDialogYValue.value;
142
- animateSheetTo(topOfDialogYValue.value, () => {
143
- onOpenCB();
139
+ // Animate the Y position to the top of the dialog, then call onOpenCB
140
+ currentYOffset.value = withTiming(topOfDialogYValue.value, {
141
+ duration: DEFAULT_BOTTOMSHEETDIALOG_DISPLAY_DURATION,
142
+ }, () => {
143
+ runOnJS(onOpenCB)();
144
144
  if (callback) {
145
- callback();
145
+ runOnJS(callback)();
146
146
  }
147
147
  });
148
148
  };
@@ -170,7 +170,7 @@ export const BottomSheetDialog = forwardRef(({ children, isFullscreen = false, i
170
170
  ],
171
171
  }), []);
172
172
  const sheetStyle = useMemo(() => [
173
- tw.style('bg-default rounded-t-3xl overflow-hidden border border-muted', twClassName),
173
+ tw.style(isPureBlack ? 'bg-alternative' : 'bg-default', 'rounded-t-3xl overflow-hidden border border-muted', twClassName),
174
174
  {
175
175
  maxHeight: maxSheetHeight,
176
176
  paddingBottom: Platform.select({
@@ -184,6 +184,7 @@ export const BottomSheetDialog = forwardRef(({ children, isFullscreen = false, i
184
184
  style,
185
185
  ], [
186
186
  tw,
187
+ isPureBlack,
187
188
  maxSheetHeight,
188
189
  screenBottomPadding,
189
190
  isFullscreen,
@@ -1 +1 @@
1
- {"version":3,"file":"BottomSheetDialog.mjs","sourceRoot":"","sources":["../../../src/components/BottomSheetDialog/BottomSheetDialog.tsx"],"names":[],"mappings":";;;;;;AAAA,OAAO,EACL,KAAK,EACL,WAAW,EACX,QAAQ,EACT,sDAAsD;AACvD,OAAO,EAAE,UAAU,EAAE,SAAS,EAAE,yCAAyC;;;AAEzE,OAAO,QAAO,EACZ,UAAU,EACV,WAAW,EACX,SAAS,EACT,OAAO,EACP,MAAM,EACN,mBAAmB,EACpB,cAAc;;AACf,OAAO,EAEL,IAAI,EACJ,QAAQ,EACR,oBAAoB,EACrB,qBAAqB;AACtB,OAAO,EAAE,OAAO,EAAE,eAAe,EAAE,qCAAqC;AACxE,OAAO,QAAQ,EAAE,EACf,OAAO,EACP,gBAAgB,EAChB,cAAc,EACd,UAAU,EACX,gCAAgC;AACjC,OAAO,EACL,gBAAgB,EAChB,iBAAiB,EAClB,uCAAuC;AAExC,yBAAyB;AACzB,OAAO,EACL,0CAA0C,EAC1C,iDAAiD,EACjD,gCAAgC,EACjC,0CAAsC;AAMvC,MAAM,CAAC,MAAM,iBAAiB,GAAG,UAAU,CAIzC,CACE,EACE,QAAQ,EACR,YAAY,GAAG,KAAK,EACpB,cAAc,GAAG,IAAI,EACrB,2BAA2B,GAAG,IAAI,EAClC,cAAc,EACd,OAAO,EACP,MAAM,EACN,KAAK,EACL,WAAW,EACX,GAAG,KAAK,EACT,EACD,GAAG,EACH,EAAE;IACF,MAAM,EAAE,GAAG,WAAW,EAAE,CAAC;IACzB,MAAM,YAAY,GAAG,QAAQ,EAAE,CAAC;IAChC,MAAM,QAAQ,GACZ,YAAY,KAAK,KAAK,CAAC,KAAK;QAC1B,CAAC,CAAC,UAAU,CAAC,OAAO,CAAC,IAAI,CAAC,EAAE;QAC5B,CAAC,CAAC,SAAS,CAAC,OAAO,CAAC,IAAI,CAAC,EAAE,CAAC;IAEhC,MAAM,EAAE,GAAG,EAAE,gBAAgB,EAAE,MAAM,EAAE,mBAAmB,EAAE,GAC1D,iBAAiB,EAAE,CAAC;IACtB,MAAM,EAAE,CAAC,EAAE,MAAM,EAAE,MAAM,EAAE,YAAY,EAAE,GAAG,gBAAgB,EAAE,CAAC;IAE/D,MAAM,cAAc,GAAG,YAAY,GAAG,gBAAgB,CAAC;IACvD,iDAAiD;IACjD,sEAAsE;IACtE,MAAM,cAAc,GAAG,cAAc,CAAC,YAAY,CAAC,CAAC;IACpD,MAAM,iBAAiB,GAAG,cAAc,CAAC,CAAC,CAAC,CAAC;IAC5C,MAAM,oBAAoB,GAAG,cAAc,CAAC,YAAY,CAAC,CAAC;IAC1D,MAAM,mBAAmB,GAAG,cAAc,CAAC,CAAC,CAAC,CAAC;IAC9C,MAAM,SAAS,GAAG,MAAM,CAAC,KAAK,CAAC,CAAC;IAEhC,MAAM,QAAQ,GAAG,WAAW,CAAC,GAAG,EAAE;QAChC,MAAM,EAAE,EAAE,CAAC;IACb,CAAC,EAAE,CAAC,MAAM,CAAC,CAAC,CAAC;IACb,MAAM,SAAS,GAAG,WAAW,CAAC,GAAG,EAAE;QACjC,OAAO,EAAE,EAAE,CAAC;IACd,CAAC,EAAE,CAAC,OAAO,CAAC,CAAC,CAAC;IAEd,MAAM,cAAc,GAAG,CAAC,MAAc,EAAE,UAAuB,EAAE,EAAE;QACjE,cAAc,CAAC,KAAK,GAAG,UAAU,CAC/B,MAAM,EACN,gCAAgC,EAAE,EAClC,CAAC,QAAQ,EAAE,EAAE;YACX,IAAI,QAAQ,IAAI,UAAU,EAAE;gBAC1B,OAAO,CAAC,UAAU,CAAC,EAAE,CAAC;aACvB;QACH,CAAC,CACF,CAAC;IACJ,CAAC,CAAC;IAEF,MAAM,aAAa,GAAG,WAAW,CAC/B,CAAC,QAAqB,EAAE,EAAE;QACxB,cAAc,EAAE,EAAE,CAAC;QACnB,cAAc,CAAC,oBAAoB,CAAC,KAAK,EAAE,GAAG,EAAE;YAC9C,SAAS,EAAE,CAAC;YACZ,IAAI,QAAQ,EAAE;gBACZ,QAAQ,EAAE,CAAC;aACZ;QACH,CAAC,CAAC,CAAC;QACH,iCAAiC;IACnC,CAAC,EACD,CAAC,SAAS,EAAE,cAAc,CAAC,CAC5B,CAAC;IAEF,MAAM,cAAc,GAAG,OAAO,CAAC,GAAG,EAAE;QAClC,0EAA0E;QAC1E,8EAA8E;QAC9E,+EAA+E;QAC/E,6EAA6E;QAC7E,4EAA4E;QAC5E,2EAA2E;QAC3E,uEAAuE;QACvE,MAAM,OAAO,GAAG,OAAO,CAAC,GAAG,EAAE;aAC1B,OAAO,CAAC,cAAc,CAAC;aACvB,OAAO,CAAC,GAAG,EAAE;YACZ,SAAS,CAAC;YAEV,gDAAgD;YAChD,mBAAmB,CAAC,KAAK,GAAG,cAAc,CAAC,KAAK,CAAC;QACnD,CAAC,CAAC;aACD,QAAQ,CAAC,CAAC,KAAK,EAAE,EAAE;YAClB,SAAS,CAAC;YAEV,MAAM,EAAE,YAAY,EAAE,GAAG,KAAK,CAAC;YAC/B,cAAc,CAAC,KAAK,GAAG,mBAAmB,CAAC,KAAK,GAAG,YAAY,CAAC;YAChE,gFAAgF;YAChF,uEAAuE;YACvE,sCAAsC;YACtC,IAAI,cAAc,CAAC,KAAK,IAAI,oBAAoB,CAAC,KAAK,EAAE;gBACtD,cAAc,CAAC,KAAK,GAAG,oBAAoB,CAAC,KAAK,CAAC;aACnD;YACD,0EAA0E;YAC1E,oEAAoE;YACpE,mCAAmC;YACnC,IAAI,cAAc,CAAC,KAAK,IAAI,iBAAiB,CAAC,KAAK,EAAE;gBACnD,cAAc,CAAC,KAAK,GAAG,iBAAiB,CAAC,KAAK,CAAC;aAChD;QACH,CAAC,CAAC;aACD,KAAK,CAAC,CAAC,KAAK,EAAE,EAAE;YACf,SAAS,CAAC;YAEV,MAAM,EAAE,YAAY,EAAE,SAAS,EAAE,GAAG,KAAK,CAAC;YAC1C,uFAAuF;YACvF,IAAI,YAAoB,CAAC;YACzB,oCAAoC;YACpC,MAAM,YAAY,GAAG,mBAAmB,CAAC,KAAK,GAAG,YAAY,CAAC;YAC9D,kEAAkE;YAClE,yCAAyC;YACzC,MAAM,uBAAuB,GAC3B,YAAY;gBACZ,oBAAoB,CAAC,KAAK;oBACxB,0CAA0C,CAAC;YAC/C,8FAA8F;YAC9F,MAAM,wBAAwB,GAC5B,IAAI,CAAC,GAAG,CAAC,SAAS,CAAC;gBACnB,iDAAiD,CAAC;YACpD,MAAM,iBAAiB,GAAG,SAAS,GAAG,CAAC,CAAC;YAExC,qBAAqB;YACrB,IAAI,wBAAwB,EAAE;gBAC5B,6BAA6B;gBAC7B,IAAI,iBAAiB,EAAE;oBACrB,YAAY,GAAG,oBAAoB,CAAC,KAAK,CAAC;iBAC3C;qBAAM;oBACL,YAAY,GAAG,iBAAiB,CAAC,KAAK,CAAC;iBACxC;aACF;iBAAM,IAAI,uBAAuB,EAAE;gBAClC,YAAY,GAAG,oBAAoB,CAAC,KAAK,CAAC;aAC3C;iBAAM;gBACL,YAAY,GAAG,iBAAiB,CAAC,KAAK,CAAC;aACxC;YAED,MAAM,WAAW,GAAG,YAAY,KAAK,oBAAoB,CAAC,KAAK,CAAC;YAEhE,IAAI,WAAW,EAAE;gBACf,OAAO,CAAC,aAAa,CAAC,EAAE,CAAC;aAC1B;iBAAM;gBACL,cAAc,CAAC,KAAK,GAAG,UAAU,CAC/B,YAAY,EACZ,gCAAgC,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAE,CAAC,CAC1D,CAAC;aACH;QACH,CAAC,CAAC,CAAC;QAEL,OAAO,OAAO,CAAC;IACjB,CAAC,EAAE;QACD,cAAc;QACd,cAAc;QACd,mBAAmB;QACnB,oBAAoB;QACpB,iBAAiB;QACjB,aAAa;KACd,CAAC,CAAC;IAEH,sCAAsC;IACtC,MAAM,YAAY,GAAG,CAAC,QAAqB,EAAE,EAAE;QAC7C,cAAc,CAAC,KAAK,GAAG,oBAAoB,CAAC,KAAK,CAAC;QAClD,cAAc,CAAC,iBAAiB,CAAC,KAAK,EAAE,GAAG,EAAE;YAC3C,QAAQ,EAAE,CAAC;YACX,IAAI,QAAQ,EAAE;gBACZ,QAAQ,EAAE,CAAC;aACZ;QACH,CAAC,CAAC,CAAC;IACL,CAAC,CAAC;IAEF,MAAM,sBAAsB,GAAG,OAAO;IACpC,iGAAiG;IACjG,GAAG,EAAE,CAAC,QAAQ,CAAC,aAAa,EAAE,IAAI,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,EACtD,CAAC,aAAa,CAAC,CAChB,CAAC;IAEF,SAAS,CACP,GAAG,EAAE;IACH,uDAAuD;IACvD,iFAAiF;IACjF,wEAAwE;IACxE,sBAAsB,CAAC,MAAM,EAAE,EACjC,CAAC,QAAQ,EAAE,sBAAsB,CAAC,CACnC,CAAC;IAEF,MAAM,iBAAiB,GAAG,CAAC,CAAoB,EAAE,EAAE;QACjD,MAAM,EAAE,MAAM,EAAE,GAAG,CAAC,CAAC,WAAW,CAAC,MAAM,CAAC;QACxC,oBAAoB,CAAC,KAAK,GAAG,MAAM,CAAC;QAEpC,IAAI,CAAC,SAAS,CAAC,OAAO,EAAE;YACtB,SAAS,CAAC,OAAO,GAAG,IAAI,CAAC;YACzB,YAAY,EAAE,CAAC;SAChB;IACH,CAAC,CAAC;IAEF,MAAM,kBAAkB,GAAG,gBAAgB,CACzC,GAAG,EAAE,CAAC,CAAC;QACL,SAAS,EAAE;YACT;gBACE,UAAU,EAAE,cAAc,CAAC,KAAK;aACjC;SACF;KACF,CAAC,EACF,EAAE,CACH,CAAC;IAEF,MAAM,UAAU,GAAG,OAAO,CACxB,GAAG,EAAE,CAAC;QACJ,EAAE,CAAC,KAAK,CACN,8DAA8D,EAC9D,WAAW,CACZ;QACD;YACE,SAAS,EAAE,cAAc;YACzB,aAAa,EAAE,QAAQ,CAAC,MAAM,CAAC;gBAC7B,GAAG,EAAE,mBAAmB;gBACxB,KAAK,EAAE,mBAAmB;gBAC1B,OAAO,EAAE,mBAAmB,GAAG,EAAE;aAClC,CAAC;YACF,GAAG,CAAC,YAAY,IAAI,EAAE,MAAM,EAAE,cAAc,EAAE,CAAC;YAC/C,GAAG,QAAQ;SACZ;QACD,KAAK;KACN,EAED;QACE,EAAE;QACF,cAAc;QACd,mBAAmB;QACnB,YAAY;QACZ,QAAQ;QACR,KAAK;QACL,WAAW;KACZ,CACF,CAAC;IAEF,MAAM,kBAAkB,GAAG,OAAO,CAChC,GAAG,EAAE,CAAC,CAAC,GAAG,UAAU,EAAE,kBAAkB,CAAC,EAEzC,CAAC,UAAU,CAAC,CACb,CAAC;IAEF,mBAAmB,CAAC,GAAG,EAAE,GAAG,EAAE,CAAC,CAAC;QAC9B,YAAY;QACZ,aAAa;KACd,CAAC,CAAC,CAAC;IAEJ,OAAO,CACL,CAAC,oBAAoB,CACnB,KAAK,CAAC,CAAC,EAAE,CAAC,KAAK,CAAC,6BAA6B,CAAC,CAAC,CAC/C,QAAQ,CAAC,CAAC,QAAQ,CAAC,EAAE,KAAK,KAAK,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,SAAS,CAAC,CACxD,sBAAsB,CAAC,CACrB,QAAQ,CAAC,EAAE,KAAK,KAAK,CAAC,CAAC,CAAC,CAAC,mBAAmB,CAAC,CAAC,CAAC,MAAM,CACtD,CACD,OAAO,CAAC,CAAC,2BAA2B,CAAC,CACrC,IAAI,KAAK,CAAC,CAEV;QAAA,CAAC,eAAe,CAAC,OAAO,CAAC,CAAC,cAAc,CAAC,CACvC;UAAA,CAAC,QAAQ,CAAC,IAAI,CACZ,QAAQ,CAAC,CAAC,iBAAiB,CAAC,CAC5B,KAAK,CAAC,CAAC,kBAAkB,CAAC,CAE1B;YAAA,CAAC,cAAc,IAAI,CACjB,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,EAAE,CAAC,KAAK,CAAC,+BAA+B,CAAC,CAAC,CACrD;gBAAA,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,EAAE,CAAC,KAAK,CAAC,qCAAqC,CAAC,CAAC,EAC/D;cAAA,EAAE,IAAI,CAAC,CACR,CACD;YAAA,CAAC,QAAQ,CACX;UAAA,EAAE,QAAQ,CAAC,IAAI,CACjB;QAAA,EAAE,eAAe,CACnB;MAAA,EAAE,oBAAoB,CAAC,CACxB,CAAC;AACJ,CAAC,CACF,CAAC","sourcesContent":["import {\n Theme,\n useTailwind,\n useTheme,\n} from '@metamask-previews/design-system-twrnc-preset';\nimport { lightTheme, darkTheme } from '@metamask-previews/design-tokens';\nimport { debounce } from 'lodash';\nimport React, {\n forwardRef,\n useCallback,\n useEffect,\n useMemo,\n useRef,\n useImperativeHandle,\n} from 'react';\nimport {\n LayoutChangeEvent,\n View,\n Platform,\n KeyboardAvoidingView,\n} from 'react-native';\nimport { Gesture, GestureDetector } from 'react-native-gesture-handler';\nimport Animated, {\n runOnJS,\n useAnimatedStyle,\n useSharedValue,\n withSpring,\n} from 'react-native-reanimated';\nimport {\n useSafeAreaFrame,\n useSafeAreaInsets,\n} from 'react-native-safe-area-context';\n\n// Internal dependencies.\nimport {\n DEFAULT_BOTTOMSHEETDIALOG_DISMISSTHRESHOLD,\n DEFAULT_BOTTOMSHEETDIALOG_SWIPETHRESHOLD_VELOCITY,\n getBottomSheetDialogSpringConfig,\n} from './BottomSheetDialog.constants';\nimport type {\n BottomSheetDialogRef,\n BottomSheetDialogProps,\n} from './BottomSheetDialog.types';\n\nexport const BottomSheetDialog = forwardRef<\n BottomSheetDialogRef,\n BottomSheetDialogProps\n>(\n (\n {\n children,\n isFullscreen = false,\n isInteractable = true,\n keyboardAvoidingViewEnabled = true,\n onDismissStart,\n onClose,\n onOpen,\n style,\n twClassName,\n ...props\n },\n ref,\n ) => {\n const tw = useTailwind();\n const currentTheme = useTheme();\n const shadowLg =\n currentTheme === Theme.Light\n ? lightTheme.shadows.size.lg\n : darkTheme.shadows.size.lg;\n\n const { top: screenTopPadding, bottom: screenBottomPadding } =\n useSafeAreaInsets();\n const { y: frameY, height: screenHeight } = useSafeAreaFrame();\n\n const maxSheetHeight = screenHeight - screenTopPadding;\n // X and Y values start on top left of the DIALOG\n // currentYOffset will be used to animate the Y position of the Dialog\n const currentYOffset = useSharedValue(screenHeight);\n const topOfDialogYValue = useSharedValue(0);\n const bottomOfDialogYValue = useSharedValue(screenHeight);\n const gestureStartYOffset = useSharedValue(0);\n const isMounted = useRef(false);\n\n const onOpenCB = useCallback(() => {\n onOpen?.();\n }, [onOpen]);\n const onCloseCB = useCallback(() => {\n onClose?.();\n }, [onClose]);\n\n const animateSheetTo = (target: number, onComplete?: () => void) => {\n currentYOffset.value = withSpring(\n target,\n getBottomSheetDialogSpringConfig(),\n (finished) => {\n if (finished && onComplete) {\n runOnJS(onComplete)();\n }\n },\n );\n };\n\n const onCloseDialog = useCallback(\n (callback?: () => void) => {\n onDismissStart?.();\n animateSheetTo(bottomOfDialogYValue.value, () => {\n onCloseCB();\n if (callback) {\n callback();\n }\n });\n // Ref values do not affect deps.\n },\n [onCloseCB, onDismissStart],\n );\n\n const gestureHandler = useMemo(() => {\n // These gesture callbacks need explicit 'worklet' directives because this\n // package ships a pre-built dist compiled by ts-bridge (tsc), which emits the\n // gesture chain as a namespaced call (react_native_gesture_handler_1.Gesture).\n // The consumer's Reanimated/Worklets Babel plugin does run over dist (that's\n // why useAnimatedStyle below works), but its gesture auto-detection doesn't\n // recognize that compiled namespaced form, so without these directives the\n // callbacks run on the JS thread and slow drags lag behind the finger.\n const gesture = Gesture.Pan()\n .enabled(isInteractable)\n .onStart(() => {\n 'worklet';\n\n // Starts tracking vertical position of gesture.\n gestureStartYOffset.value = currentYOffset.value;\n })\n .onUpdate((event) => {\n 'worklet';\n\n const { translationY } = event;\n currentYOffset.value = gestureStartYOffset.value + translationY;\n // If gesture Y value goes above the bottom of Dialog Y value(bottom of dialog),\n // which means the gesture is currently below the bottom of the dialog,\n // sets it to bottom of Dialog Y value\n if (currentYOffset.value >= bottomOfDialogYValue.value) {\n currentYOffset.value = bottomOfDialogYValue.value;\n }\n // If gesture Y value goes below the top of Dialog Y value(top of dialog),\n // which means the gesture is currently above the top of the dialog,\n // sets it to top of Dialog Y value\n if (currentYOffset.value <= topOfDialogYValue.value) {\n currentYOffset.value = topOfDialogYValue.value;\n }\n })\n .onEnd((event) => {\n 'worklet';\n\n const { translationY, velocityY } = event;\n // finalYOffset is used to animate the Y position of the Dialog after the gesture event\n let finalYOffset: number;\n // Measuring dismissing swipe action\n const latestOffset = gestureStartYOffset.value + translationY;\n // Check if the swipe distance reach the dismiss offset threshold,\n // which is currently 60% of sheet height\n const hasReachedDismissOffset =\n latestOffset >\n bottomOfDialogYValue.value *\n DEFAULT_BOTTOMSHEETDIALOG_DISMISSTHRESHOLD;\n // Check if the gesture's vertical speed has reached the threshold to determine a swipe action\n const hasReachedSwipeThreshold =\n Math.abs(velocityY) >\n DEFAULT_BOTTOMSHEETDIALOG_SWIPETHRESHOLD_VELOCITY;\n const isQuickDismissing = velocityY > 0;\n\n // If user is swiping\n if (hasReachedSwipeThreshold) {\n // Quick swipe takes priority\n if (isQuickDismissing) {\n finalYOffset = bottomOfDialogYValue.value;\n } else {\n finalYOffset = topOfDialogYValue.value;\n }\n } else if (hasReachedDismissOffset) {\n finalYOffset = bottomOfDialogYValue.value;\n } else {\n finalYOffset = topOfDialogYValue.value;\n }\n\n const isDismissed = finalYOffset === bottomOfDialogYValue.value;\n\n if (isDismissed) {\n runOnJS(onCloseDialog)();\n } else {\n currentYOffset.value = withSpring(\n finalYOffset,\n getBottomSheetDialogSpringConfig({ velocity: velocityY }),\n );\n }\n });\n\n return gesture;\n }, [\n isInteractable,\n currentYOffset,\n gestureStartYOffset,\n bottomOfDialogYValue,\n topOfDialogYValue,\n onCloseDialog,\n ]);\n\n // Animate in sheet on initial render.\n const onOpenDialog = (callback?: () => void) => {\n currentYOffset.value = bottomOfDialogYValue.value;\n animateSheetTo(topOfDialogYValue.value, () => {\n onOpenCB();\n if (callback) {\n callback();\n }\n });\n };\n\n const onDebouncedCloseDialog = useMemo(\n // Prevent hide from being called multiple times. Potentially caused by taps in quick succession.\n () => debounce(onCloseDialog, 2000, { leading: true }),\n [onCloseDialog],\n );\n\n useEffect(\n () =>\n // Automatically handles animation when content changes\n // Disable for now since network switches causes the screen to hang with this on.\n // LayoutAnimation.configureNext(LayoutAnimation.Presets.easeInEaseOut);\n onDebouncedCloseDialog.cancel(),\n [children, onDebouncedCloseDialog],\n );\n\n const updateSheetHeight = (e: LayoutChangeEvent) => {\n const { height } = e.nativeEvent.layout;\n bottomOfDialogYValue.value = height;\n\n if (!isMounted.current) {\n isMounted.current = true;\n onOpenDialog();\n }\n };\n\n const animatedSheetStyle = useAnimatedStyle(\n () => ({\n transform: [\n {\n translateY: currentYOffset.value,\n },\n ],\n }),\n [],\n );\n\n const sheetStyle = useMemo(\n () => [\n tw.style(\n 'bg-default rounded-t-3xl overflow-hidden border border-muted',\n twClassName,\n ),\n {\n maxHeight: maxSheetHeight,\n paddingBottom: Platform.select({\n ios: screenBottomPadding,\n macos: screenBottomPadding,\n default: screenBottomPadding + 16,\n }),\n ...(isFullscreen && { height: maxSheetHeight }),\n ...shadowLg,\n },\n style,\n ],\n\n [\n tw,\n maxSheetHeight,\n screenBottomPadding,\n isFullscreen,\n shadowLg,\n style,\n twClassName,\n ],\n );\n\n const combinedSheetStyle = useMemo(\n () => [...sheetStyle, animatedSheetStyle],\n\n [sheetStyle],\n );\n\n useImperativeHandle(ref, () => ({\n onOpenDialog,\n onCloseDialog,\n }));\n\n return (\n <KeyboardAvoidingView\n style={tw.style('absolute bottom-0 inset-x-0')}\n behavior={Platform.OS === 'ios' ? 'padding' : undefined}\n keyboardVerticalOffset={\n Platform.OS === 'ios' ? -screenBottomPadding : frameY\n }\n enabled={keyboardAvoidingViewEnabled}\n {...props}\n >\n <GestureDetector gesture={gestureHandler}>\n <Animated.View\n onLayout={updateSheetHeight}\n style={combinedSheetStyle}\n >\n {isInteractable && (\n <View style={tw.style('self-stretch items-center p-1')}>\n <View style={tw.style('h-1 w-10 rounded-sm bg-border-muted')} />\n </View>\n )}\n {children}\n </Animated.View>\n </GestureDetector>\n </KeyboardAvoidingView>\n );\n },\n);\n"]}
1
+ {"version":3,"file":"BottomSheetDialog.mjs","sourceRoot":"","sources":["../../../src/components/BottomSheetDialog/BottomSheetDialog.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n Theme,\n usePureBlack,\n useTailwind,\n useTheme,\n} from '@metamask-previews/design-system-twrnc-preset';\nimport { lightTheme, resolveDarkTheme } from '@metamask-previews/design-tokens';\nimport { debounce } from 'lodash';\nimport React, {\n forwardRef,\n useCallback,\n useEffect,\n useMemo,\n useRef,\n useImperativeHandle,\n} from 'react';\nimport {\n LayoutChangeEvent,\n View,\n Platform,\n KeyboardAvoidingView,\n} from 'react-native';\nimport { Gesture, GestureDetector } from 'react-native-gesture-handler';\nimport Animated, {\n runOnJS,\n useAnimatedStyle,\n useSharedValue,\n withTiming,\n} from 'react-native-reanimated';\nimport {\n useSafeAreaFrame,\n useSafeAreaInsets,\n} from 'react-native-safe-area-context';\n\n// Internal dependencies.\nimport {\n DEFAULT_BOTTOMSHEETDIALOG_DISPLAY_DURATION,\n DEFAULT_BOTTOMSHEETDIALOG_DISMISSTHRESHOLD,\n DEFAULT_BOTTOMSHEETDIALOG_SWIPETHRESHOLD_DURATION,\n} from './BottomSheetDialog.constants';\nimport type {\n BottomSheetDialogRef,\n BottomSheetDialogProps,\n} from './BottomSheetDialog.types';\n\nexport const BottomSheetDialog = forwardRef<\n BottomSheetDialogRef,\n BottomSheetDialogProps\n>(\n (\n {\n children,\n isFullscreen = false,\n isInteractable = true,\n keyboardAvoidingViewEnabled = true,\n onClose,\n onOpen,\n style,\n twClassName,\n ...props\n },\n ref,\n ) => {\n const tw = useTailwind();\n const currentTheme = useTheme();\n const isPureBlack = usePureBlack();\n const shadowLg =\n currentTheme === Theme.Light\n ? lightTheme.shadows.size.lg\n : resolveDarkTheme(isPureBlack).shadows.size.lg;\n\n const { top: screenTopPadding, bottom: screenBottomPadding } =\n useSafeAreaInsets();\n const { y: frameY, height: screenHeight } = useSafeAreaFrame();\n\n const maxSheetHeight = screenHeight - screenTopPadding;\n // X and Y values start on top left of the DIALOG\n // currentYOffset will be used to animate the Y position of the Dialog\n const currentYOffset = useSharedValue(screenHeight);\n const topOfDialogYValue = useSharedValue(0);\n const bottomOfDialogYValue = useSharedValue(screenHeight);\n const gestureStartYOffset = useSharedValue(0);\n const isMounted = useRef(false);\n\n const onOpenCB = useCallback(() => {\n onOpen?.();\n }, [onOpen]);\n const onCloseCB = useCallback(() => {\n onClose?.();\n }, [onClose]);\n\n const onCloseDialog = useCallback(\n (callback?: () => void) => {\n currentYOffset.value = withTiming(\n bottomOfDialogYValue.value,\n { duration: DEFAULT_BOTTOMSHEETDIALOG_DISPLAY_DURATION },\n () => {\n runOnJS(onCloseCB)();\n if (callback) {\n runOnJS(callback)();\n }\n },\n );\n // Ref values do not affect deps.\n },\n [onCloseCB],\n );\n\n const gestureHandler = useMemo(() => {\n // These gesture callbacks need explicit 'worklet' directives because this\n // package ships a pre-built dist compiled by ts-bridge (tsc), which emits the\n // gesture chain as a namespaced call (react_native_gesture_handler_1.Gesture).\n // The consumer's Reanimated/Worklets Babel plugin does run over dist (that's\n // why useAnimatedStyle below works), but its gesture auto-detection doesn't\n // recognize that compiled namespaced form, so without these directives the\n // callbacks run on the JS thread and slow drags lag behind the finger.\n const gesture = Gesture.Pan()\n .enabled(isInteractable)\n .onStart(() => {\n 'worklet';\n\n // Starts tracking vertical position of gesture.\n gestureStartYOffset.value = currentYOffset.value;\n })\n .onUpdate((event) => {\n 'worklet';\n\n const { translationY } = event;\n currentYOffset.value = gestureStartYOffset.value + translationY;\n // If gesture Y value goes above the bottom of Dialog Y value(bottom of dialog),\n // which means the gesture is currently below the bottom of the dialog,\n // sets it to bottom of Dialog Y value\n if (currentYOffset.value >= bottomOfDialogYValue.value) {\n currentYOffset.value = bottomOfDialogYValue.value;\n }\n // If gesture Y value goes below the top of Dialog Y value(top of dialog),\n // which means the gesture is currently above the top of the dialog,\n // sets it to top of Dialog Y value\n if (currentYOffset.value <= topOfDialogYValue.value) {\n currentYOffset.value = topOfDialogYValue.value;\n }\n })\n .onEnd((event) => {\n 'worklet';\n\n const { translationY, velocityY } = event;\n // finalYOffset is used to animate the Y position of the Dialog after the gesture event\n let finalYOffset: number;\n // Measuring dismissing swipe action\n const latestOffset = gestureStartYOffset.value + translationY;\n // Check if the swipe distance reach the dismiss offset threshold,\n // which is currently 60% of sheet height\n const hasReachedDismissOffset =\n latestOffset >\n bottomOfDialogYValue.value *\n DEFAULT_BOTTOMSHEETDIALOG_DISMISSTHRESHOLD;\n // Check if the gesture's vertical speed has reached the threshold to determine a swipe action\n const hasReachedSwipeThreshold =\n Math.abs(velocityY) >\n DEFAULT_BOTTOMSHEETDIALOG_SWIPETHRESHOLD_DURATION;\n const isQuickDismissing = velocityY > 0;\n\n // If user is swiping\n if (hasReachedSwipeThreshold) {\n // Quick swipe takes priority\n if (isQuickDismissing) {\n finalYOffset = bottomOfDialogYValue.value;\n } else {\n finalYOffset = topOfDialogYValue.value;\n }\n } else if (hasReachedDismissOffset) {\n finalYOffset = bottomOfDialogYValue.value;\n } else {\n finalYOffset = topOfDialogYValue.value;\n }\n\n const isDismissed = finalYOffset === bottomOfDialogYValue.value;\n\n if (isDismissed) {\n runOnJS(onCloseDialog)();\n } else {\n // Only animate dialog to a certain Y position instead\n currentYOffset.value = withTiming(finalYOffset, {\n duration: DEFAULT_BOTTOMSHEETDIALOG_DISPLAY_DURATION,\n });\n }\n });\n\n return gesture;\n }, [\n isInteractable,\n currentYOffset,\n gestureStartYOffset,\n bottomOfDialogYValue,\n topOfDialogYValue,\n onCloseDialog,\n ]);\n\n // Animate in sheet on initial render.\n const onOpenDialog = (callback?: () => void) => {\n // Starts setting the Y position of the dialog to the bottom of the dialog\n currentYOffset.value = bottomOfDialogYValue.value;\n // Animate the Y position to the top of the dialog, then call onOpenCB\n currentYOffset.value = withTiming(\n topOfDialogYValue.value,\n {\n duration: DEFAULT_BOTTOMSHEETDIALOG_DISPLAY_DURATION,\n },\n () => {\n runOnJS(onOpenCB)();\n if (callback) {\n runOnJS(callback)();\n }\n },\n );\n };\n\n const onDebouncedCloseDialog = useMemo(\n // Prevent hide from being called multiple times. Potentially caused by taps in quick succession.\n () => debounce(onCloseDialog, 2000, { leading: true }),\n [onCloseDialog],\n );\n\n useEffect(\n () =>\n // Automatically handles animation when content changes\n // Disable for now since network switches causes the screen to hang with this on.\n // LayoutAnimation.configureNext(LayoutAnimation.Presets.easeInEaseOut);\n onDebouncedCloseDialog.cancel(),\n [children, onDebouncedCloseDialog],\n );\n\n const updateSheetHeight = (e: LayoutChangeEvent) => {\n const { height } = e.nativeEvent.layout;\n bottomOfDialogYValue.value = height;\n\n if (!isMounted.current) {\n isMounted.current = true;\n onOpenDialog();\n }\n };\n\n const animatedSheetStyle = useAnimatedStyle(\n () => ({\n transform: [\n {\n translateY: currentYOffset.value,\n },\n ],\n }),\n [],\n );\n\n const sheetStyle = useMemo(\n () => [\n tw.style(\n isPureBlack ? 'bg-alternative' : 'bg-default',\n 'rounded-t-3xl overflow-hidden border border-muted',\n twClassName,\n ),\n {\n maxHeight: maxSheetHeight,\n paddingBottom: Platform.select({\n ios: screenBottomPadding,\n macos: screenBottomPadding,\n default: screenBottomPadding + 16,\n }),\n ...(isFullscreen && { height: maxSheetHeight }),\n ...shadowLg,\n },\n style,\n ],\n\n [\n tw,\n isPureBlack,\n maxSheetHeight,\n screenBottomPadding,\n isFullscreen,\n shadowLg,\n style,\n twClassName,\n ],\n );\n\n const combinedSheetStyle = useMemo(\n () => [...sheetStyle, animatedSheetStyle],\n\n [sheetStyle],\n );\n\n useImperativeHandle(ref, () => ({\n onOpenDialog,\n onCloseDialog,\n }));\n\n return (\n <KeyboardAvoidingView\n style={tw.style('absolute bottom-0 inset-x-0')}\n behavior={Platform.OS === 'ios' ? 'padding' : undefined}\n keyboardVerticalOffset={\n Platform.OS === 'ios' ? -screenBottomPadding : frameY\n }\n enabled={keyboardAvoidingViewEnabled}\n {...props}\n >\n <GestureDetector gesture={gestureHandler}>\n <Animated.View\n onLayout={updateSheetHeight}\n style={combinedSheetStyle}\n >\n {isInteractable && (\n <View style={tw.style('self-stretch items-center p-1')}>\n <View style={tw.style('h-1 w-10 rounded-sm bg-border-muted')} />\n </View>\n )}\n {children}\n </Animated.View>\n </GestureDetector>\n </KeyboardAvoidingView>\n );\n },\n);\n"]}
@@ -1 +1 @@
1
- {"version":3,"file":"BottomSheetDialog.types.cjs","sourceRoot":"","sources":["../../../src/components/BottomSheetDialog/BottomSheetDialog.types.ts"],"names":[],"mappings":"","sourcesContent":["// Third party dependencies.\nimport type { ViewProps } from 'react-native';\n\n/**\n * BottomSheetDialog component props.\n */\nexport type BottomSheetDialogProps = {\n /**\n * Optional content to display inside the dialog.\n */\n children?: React.ReactNode;\n /**\n * Optional prop to toggle full screen state of BottomSheetDialog.\n *\n * @default false\n */\n isFullscreen?: boolean;\n /**\n * Optional boolean that indicates if the sheet is swippable.\n * This affects whether or not tapping on the overlay will dismiss\n * the sheet as well, and whether the drag handle indicator is shown.\n *\n * @default true\n */\n isInteractable?: boolean;\n /**\n * Optional boolean that indicates if the KeyboardAvoidingView is enabled.\n *\n * @default true\n */\n keyboardAvoidingViewEnabled?: boolean;\n /**\n * Optional callback invoked when the sheet begins closing (before animation).\n */\n onDismissStart?: () => void;\n /**\n * Optional callback that gets triggered when the sheet is closed.\n */\n onClose?: (hasPendingAction?: boolean) => void;\n /**\n * Optional callback that gets triggered when the sheet is opened.\n */\n onOpen?: (hasPendingAction?: boolean) => void;\n /**\n * Tailwind CSS classes for the dialog container.\n */\n twClassName?: string;\n} & ViewProps;\n\n/**\n * Ref handle for imperative control of the BottomSheetDialog.\n */\nexport type BottomSheetDialogRef = {\n /**\n * Imperatively close the dialog with an optional callback after animation completes.\n */\n onCloseDialog: (callback?: () => void) => void;\n /**\n * Imperatively open the dialog with an optional callback after animation completes.\n */\n onOpenDialog: (callback?: () => void) => void;\n};\n"]}
1
+ {"version":3,"file":"BottomSheetDialog.types.cjs","sourceRoot":"","sources":["../../../src/components/BottomSheetDialog/BottomSheetDialog.types.ts"],"names":[],"mappings":"","sourcesContent":["// Third party dependencies.\nimport type { ViewProps } from 'react-native';\n\n/**\n * BottomSheetDialog component props.\n */\nexport type BottomSheetDialogProps = {\n /**\n * Optional content to display inside the dialog.\n */\n children?: React.ReactNode;\n /**\n * Optional prop to toggle full screen state of BottomSheetDialog.\n *\n * @default false\n */\n isFullscreen?: boolean;\n /**\n * Optional boolean that indicates if the sheet is swippable.\n * This affects whether or not tapping on the overlay will dismiss\n * the sheet as well, and whether the drag handle indicator is shown.\n *\n * @default true\n */\n isInteractable?: boolean;\n /**\n * Optional boolean that indicates if the KeyboardAvoidingView is enabled.\n *\n * @default true\n */\n keyboardAvoidingViewEnabled?: boolean;\n /**\n * Optional callback that gets triggered when the sheet is closed.\n */\n onClose?: (hasPendingAction?: boolean) => void;\n /**\n * Optional callback that gets triggered when the sheet is opened.\n */\n onOpen?: (hasPendingAction?: boolean) => void;\n /**\n * Tailwind CSS classes for the dialog container.\n */\n twClassName?: string;\n} & ViewProps;\n\n/**\n * Ref handle for imperative control of the BottomSheetDialog.\n */\nexport type BottomSheetDialogRef = {\n /**\n * Imperatively close the dialog with an optional callback after animation completes.\n */\n onCloseDialog: (callback?: () => void) => void;\n /**\n * Imperatively open the dialog with an optional callback after animation completes.\n */\n onOpenDialog: (callback?: () => void) => void;\n};\n"]}
@@ -27,10 +27,6 @@ export type BottomSheetDialogProps = {
27
27
  * @default true
28
28
  */
29
29
  keyboardAvoidingViewEnabled?: boolean;
30
- /**
31
- * Optional callback invoked when the sheet begins closing (before animation).
32
- */
33
- onDismissStart?: () => void;
34
30
  /**
35
31
  * Optional callback that gets triggered when the sheet is closed.
36
32
  */
@@ -1 +1 @@
1
- {"version":3,"file":"BottomSheetDialog.types.d.cts","sourceRoot":"","sources":["../../../src/components/BottomSheetDialog/BottomSheetDialog.types.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAE,qBAAqB;AAE9C;;GAEG;AACH,MAAM,MAAM,sBAAsB,GAAG;IACnC;;OAEG;IACH,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B;;;;OAIG;IACH,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB;;;;;;OAMG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB;;;;OAIG;IACH,2BAA2B,CAAC,EAAE,OAAO,CAAC;IACtC;;OAEG;IACH,cAAc,CAAC,EAAE,MAAM,IAAI,CAAC;IAC5B;;OAEG;IACH,OAAO,CAAC,EAAE,CAAC,gBAAgB,CAAC,EAAE,OAAO,KAAK,IAAI,CAAC;IAC/C;;OAEG;IACH,MAAM,CAAC,EAAE,CAAC,gBAAgB,CAAC,EAAE,OAAO,KAAK,IAAI,CAAC;IAC9C;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB,GAAG,SAAS,CAAC;AAEd;;GAEG;AACH,MAAM,MAAM,oBAAoB,GAAG;IACjC;;OAEG;IACH,aAAa,EAAE,CAAC,QAAQ,CAAC,EAAE,MAAM,IAAI,KAAK,IAAI,CAAC;IAC/C;;OAEG;IACH,YAAY,EAAE,CAAC,QAAQ,CAAC,EAAE,MAAM,IAAI,KAAK,IAAI,CAAC;CAC/C,CAAC"}
1
+ {"version":3,"file":"BottomSheetDialog.types.d.cts","sourceRoot":"","sources":["../../../src/components/BottomSheetDialog/BottomSheetDialog.types.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAE,qBAAqB;AAE9C;;GAEG;AACH,MAAM,MAAM,sBAAsB,GAAG;IACnC;;OAEG;IACH,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B;;;;OAIG;IACH,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB;;;;;;OAMG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB;;;;OAIG;IACH,2BAA2B,CAAC,EAAE,OAAO,CAAC;IACtC;;OAEG;IACH,OAAO,CAAC,EAAE,CAAC,gBAAgB,CAAC,EAAE,OAAO,KAAK,IAAI,CAAC;IAC/C;;OAEG;IACH,MAAM,CAAC,EAAE,CAAC,gBAAgB,CAAC,EAAE,OAAO,KAAK,IAAI,CAAC;IAC9C;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB,GAAG,SAAS,CAAC;AAEd;;GAEG;AACH,MAAM,MAAM,oBAAoB,GAAG;IACjC;;OAEG;IACH,aAAa,EAAE,CAAC,QAAQ,CAAC,EAAE,MAAM,IAAI,KAAK,IAAI,CAAC;IAC/C;;OAEG;IACH,YAAY,EAAE,CAAC,QAAQ,CAAC,EAAE,MAAM,IAAI,KAAK,IAAI,CAAC;CAC/C,CAAC"}
@@ -27,10 +27,6 @@ export type BottomSheetDialogProps = {
27
27
  * @default true
28
28
  */
29
29
  keyboardAvoidingViewEnabled?: boolean;
30
- /**
31
- * Optional callback invoked when the sheet begins closing (before animation).
32
- */
33
- onDismissStart?: () => void;
34
30
  /**
35
31
  * Optional callback that gets triggered when the sheet is closed.
36
32
  */
@@ -1 +1 @@
1
- {"version":3,"file":"BottomSheetDialog.types.d.mts","sourceRoot":"","sources":["../../../src/components/BottomSheetDialog/BottomSheetDialog.types.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAE,qBAAqB;AAE9C;;GAEG;AACH,MAAM,MAAM,sBAAsB,GAAG;IACnC;;OAEG;IACH,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B;;;;OAIG;IACH,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB;;;;;;OAMG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB;;;;OAIG;IACH,2BAA2B,CAAC,EAAE,OAAO,CAAC;IACtC;;OAEG;IACH,cAAc,CAAC,EAAE,MAAM,IAAI,CAAC;IAC5B;;OAEG;IACH,OAAO,CAAC,EAAE,CAAC,gBAAgB,CAAC,EAAE,OAAO,KAAK,IAAI,CAAC;IAC/C;;OAEG;IACH,MAAM,CAAC,EAAE,CAAC,gBAAgB,CAAC,EAAE,OAAO,KAAK,IAAI,CAAC;IAC9C;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB,GAAG,SAAS,CAAC;AAEd;;GAEG;AACH,MAAM,MAAM,oBAAoB,GAAG;IACjC;;OAEG;IACH,aAAa,EAAE,CAAC,QAAQ,CAAC,EAAE,MAAM,IAAI,KAAK,IAAI,CAAC;IAC/C;;OAEG;IACH,YAAY,EAAE,CAAC,QAAQ,CAAC,EAAE,MAAM,IAAI,KAAK,IAAI,CAAC;CAC/C,CAAC"}
1
+ {"version":3,"file":"BottomSheetDialog.types.d.mts","sourceRoot":"","sources":["../../../src/components/BottomSheetDialog/BottomSheetDialog.types.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAE,qBAAqB;AAE9C;;GAEG;AACH,MAAM,MAAM,sBAAsB,GAAG;IACnC;;OAEG;IACH,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B;;;;OAIG;IACH,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB;;;;;;OAMG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB;;;;OAIG;IACH,2BAA2B,CAAC,EAAE,OAAO,CAAC;IACtC;;OAEG;IACH,OAAO,CAAC,EAAE,CAAC,gBAAgB,CAAC,EAAE,OAAO,KAAK,IAAI,CAAC;IAC/C;;OAEG;IACH,MAAM,CAAC,EAAE,CAAC,gBAAgB,CAAC,EAAE,OAAO,KAAK,IAAI,CAAC;IAC9C;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB,GAAG,SAAS,CAAC;AAEd;;GAEG;AACH,MAAM,MAAM,oBAAoB,GAAG;IACjC;;OAEG;IACH,aAAa,EAAE,CAAC,QAAQ,CAAC,EAAE,MAAM,IAAI,KAAK,IAAI,CAAC;IAC/C;;OAEG;IACH,YAAY,EAAE,CAAC,QAAQ,CAAC,EAAE,MAAM,IAAI,KAAK,IAAI,CAAC;CAC/C,CAAC"}
@@ -1 +1 @@
1
- {"version":3,"file":"BottomSheetDialog.types.mjs","sourceRoot":"","sources":["../../../src/components/BottomSheetDialog/BottomSheetDialog.types.ts"],"names":[],"mappings":"","sourcesContent":["// Third party dependencies.\nimport type { ViewProps } from 'react-native';\n\n/**\n * BottomSheetDialog component props.\n */\nexport type BottomSheetDialogProps = {\n /**\n * Optional content to display inside the dialog.\n */\n children?: React.ReactNode;\n /**\n * Optional prop to toggle full screen state of BottomSheetDialog.\n *\n * @default false\n */\n isFullscreen?: boolean;\n /**\n * Optional boolean that indicates if the sheet is swippable.\n * This affects whether or not tapping on the overlay will dismiss\n * the sheet as well, and whether the drag handle indicator is shown.\n *\n * @default true\n */\n isInteractable?: boolean;\n /**\n * Optional boolean that indicates if the KeyboardAvoidingView is enabled.\n *\n * @default true\n */\n keyboardAvoidingViewEnabled?: boolean;\n /**\n * Optional callback invoked when the sheet begins closing (before animation).\n */\n onDismissStart?: () => void;\n /**\n * Optional callback that gets triggered when the sheet is closed.\n */\n onClose?: (hasPendingAction?: boolean) => void;\n /**\n * Optional callback that gets triggered when the sheet is opened.\n */\n onOpen?: (hasPendingAction?: boolean) => void;\n /**\n * Tailwind CSS classes for the dialog container.\n */\n twClassName?: string;\n} & ViewProps;\n\n/**\n * Ref handle for imperative control of the BottomSheetDialog.\n */\nexport type BottomSheetDialogRef = {\n /**\n * Imperatively close the dialog with an optional callback after animation completes.\n */\n onCloseDialog: (callback?: () => void) => void;\n /**\n * Imperatively open the dialog with an optional callback after animation completes.\n */\n onOpenDialog: (callback?: () => void) => void;\n};\n"]}
1
+ {"version":3,"file":"BottomSheetDialog.types.mjs","sourceRoot":"","sources":["../../../src/components/BottomSheetDialog/BottomSheetDialog.types.ts"],"names":[],"mappings":"","sourcesContent":["// Third party dependencies.\nimport type { ViewProps } from 'react-native';\n\n/**\n * BottomSheetDialog component props.\n */\nexport type BottomSheetDialogProps = {\n /**\n * Optional content to display inside the dialog.\n */\n children?: React.ReactNode;\n /**\n * Optional prop to toggle full screen state of BottomSheetDialog.\n *\n * @default false\n */\n isFullscreen?: boolean;\n /**\n * Optional boolean that indicates if the sheet is swippable.\n * This affects whether or not tapping on the overlay will dismiss\n * the sheet as well, and whether the drag handle indicator is shown.\n *\n * @default true\n */\n isInteractable?: boolean;\n /**\n * Optional boolean that indicates if the KeyboardAvoidingView is enabled.\n *\n * @default true\n */\n keyboardAvoidingViewEnabled?: boolean;\n /**\n * Optional callback that gets triggered when the sheet is closed.\n */\n onClose?: (hasPendingAction?: boolean) => void;\n /**\n * Optional callback that gets triggered when the sheet is opened.\n */\n onOpen?: (hasPendingAction?: boolean) => void;\n /**\n * Tailwind CSS classes for the dialog container.\n */\n twClassName?: string;\n} & ViewProps;\n\n/**\n * Ref handle for imperative control of the BottomSheetDialog.\n */\nexport type BottomSheetDialogRef = {\n /**\n * Imperatively close the dialog with an optional callback after animation completes.\n */\n onCloseDialog: (callback?: () => void) => void;\n /**\n * Imperatively open the dialog with an optional callback after animation completes.\n */\n onOpenDialog: (callback?: () => void) => void;\n};\n"]}
@@ -28,33 +28,17 @@ const design_system_twrnc_preset_1 = require("@metamask-previews/design-system-t
28
28
  const react_1 = __importStar(require("react"));
29
29
  const react_native_1 = require("react-native");
30
30
  const BottomSheetOverlay_constants_1 = require("./BottomSheetOverlay.constants.cjs");
31
- exports.BottomSheetOverlay = (0, react_1.forwardRef)(({ style, twClassName, onPress, touchableOpacityProps, ...props }, ref) => {
31
+ const BottomSheetOverlay = ({ style, twClassName, onPress, touchableOpacityProps, ...props }) => {
32
32
  const tw = (0, design_system_twrnc_preset_1.useTailwind)();
33
33
  const opacityVal = (0, react_1.useRef)(new react_native_1.Animated.Value(0)).current;
34
- const fadeIn = (0, react_1.useCallback)(() => {
34
+ (0, react_1.useEffect)(() => {
35
35
  react_native_1.Animated.timing(opacityVal, {
36
36
  toValue: 1,
37
37
  duration: BottomSheetOverlay_constants_1.DEFAULT_OVERLAY_ANIMATION_DURATION,
38
- easing: BottomSheetOverlay_constants_1.DEFAULT_OVERLAY_ANIMATION_EASING,
38
+ easing: react_native_1.Easing.linear,
39
39
  useNativeDriver: true,
40
40
  }).start();
41
41
  }, [opacityVal]);
42
- const fadeOut = (0, react_1.useCallback)((callback) => {
43
- react_native_1.Animated.timing(opacityVal, {
44
- toValue: 0,
45
- duration: BottomSheetOverlay_constants_1.DEFAULT_OVERLAY_ANIMATION_DURATION,
46
- easing: BottomSheetOverlay_constants_1.DEFAULT_OVERLAY_ANIMATION_EASING,
47
- useNativeDriver: true,
48
- }).start(({ finished }) => {
49
- if (finished) {
50
- callback?.();
51
- }
52
- });
53
- }, [opacityVal]);
54
- (0, react_1.useImperativeHandle)(ref, () => ({ fadeIn, fadeOut }), [fadeIn, fadeOut]);
55
- (0, react_1.useEffect)(() => {
56
- fadeIn();
57
- }, [fadeIn]);
58
42
  return (<react_native_1.Animated.View style={[
59
43
  tw.style('absolute inset-0 bg-overlay-default', twClassName),
60
44
  style,
@@ -62,6 +46,6 @@ exports.BottomSheetOverlay = (0, react_1.forwardRef)(({ style, twClassName, onPr
62
46
  ]} {...props}>
63
47
  {onPress && (<react_native_1.TouchableOpacity onPress={onPress} {...touchableOpacityProps} style={tw.style('flex-1')}/>)}
64
48
  </react_native_1.Animated.View>);
65
- });
66
- exports.BottomSheetOverlay.displayName = 'BottomSheetOverlay';
49
+ };
50
+ exports.BottomSheetOverlay = BottomSheetOverlay;
67
51
  //# sourceMappingURL=BottomSheetOverlay.cjs.map
@@ -1 +1 @@
1
- {"version":3,"file":"BottomSheetOverlay.cjs","sourceRoot":"","sources":["../../../src/components/BottomSheetOverlay/BottomSheetOverlay.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,8FAA4E;AAC5E,+CAMe;AACf,+CAA0D;AAE1D,qFAGwC;AAM3B,QAAA,kBAAkB,GAAG,IAAA,kBAAU,EAG1C,CAAC,EAAE,KAAK,EAAE,WAAW,EAAE,OAAO,EAAE,qBAAqB,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,EAAE,EAAE;IAC1E,MAAM,EAAE,GAAG,IAAA,wCAAW,GAAE,CAAC;IACzB,MAAM,UAAU,GAAG,IAAA,cAAM,EAAC,IAAI,uBAAQ,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC;IAEzD,MAAM,MAAM,GAAG,IAAA,mBAAW,EAAC,GAAG,EAAE;QAC9B,uBAAQ,CAAC,MAAM,CAAC,UAAU,EAAE;YAC1B,OAAO,EAAE,CAAC;YACV,QAAQ,EAAE,iEAAkC;YAC5C,MAAM,EAAE,+DAAgC;YACxC,eAAe,EAAE,IAAI;SACtB,CAAC,CAAC,KAAK,EAAE,CAAC;IACb,CAAC,EAAE,CAAC,UAAU,CAAC,CAAC,CAAC;IAEjB,MAAM,OAAO,GAAG,IAAA,mBAAW,EACzB,CAAC,QAAqB,EAAE,EAAE;QACxB,uBAAQ,CAAC,MAAM,CAAC,UAAU,EAAE;YAC1B,OAAO,EAAE,CAAC;YACV,QAAQ,EAAE,iEAAkC;YAC5C,MAAM,EAAE,+DAAgC;YACxC,eAAe,EAAE,IAAI;SACtB,CAAC,CAAC,KAAK,CAAC,CAAC,EAAE,QAAQ,EAAE,EAAE,EAAE;YACxB,IAAI,QAAQ,EAAE;gBACZ,QAAQ,EAAE,EAAE,CAAC;aACd;QACH,CAAC,CAAC,CAAC;IACL,CAAC,EACD,CAAC,UAAU,CAAC,CACb,CAAC;IAEF,IAAA,2BAAmB,EAAC,GAAG,EAAE,GAAG,EAAE,CAAC,CAAC,EAAE,MAAM,EAAE,OAAO,EAAE,CAAC,EAAE,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC,CAAC;IAEzE,IAAA,iBAAS,EAAC,GAAG,EAAE;QACb,MAAM,EAAE,CAAC;IACX,CAAC,EAAE,CAAC,MAAM,CAAC,CAAC,CAAC;IAEb,OAAO,CACL,CAAC,uBAAQ,CAAC,IAAI,CACZ,KAAK,CAAC,CAAC;YACL,EAAE,CAAC,KAAK,CAAC,qCAAqC,EAAE,WAAW,CAAC;YAC5D,KAAK;YACL,EAAE,OAAO,EAAE,UAAU,EAAE;SACxB,CAAC,CACF,IAAI,KAAK,CAAC,CAEV;MAAA,CAAC,OAAO,IAAI,CACV,CAAC,+BAAgB,CACf,OAAO,CAAC,CAAC,OAAO,CAAC,CACjB,IAAI,qBAAqB,CAAC,CAC1B,KAAK,CAAC,CAAC,EAAE,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC,EAC1B,CACH,CACH;IAAA,EAAE,uBAAQ,CAAC,IAAI,CAAC,CACjB,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,0BAAkB,CAAC,WAAW,GAAG,oBAAoB,CAAC","sourcesContent":["import { useTailwind } from '@metamask-previews/design-system-twrnc-preset';\nimport React, {\n forwardRef,\n useCallback,\n useEffect,\n useImperativeHandle,\n useRef,\n} from 'react';\nimport { Animated, TouchableOpacity } from 'react-native';\n\nimport {\n DEFAULT_OVERLAY_ANIMATION_DURATION,\n DEFAULT_OVERLAY_ANIMATION_EASING,\n} from './BottomSheetOverlay.constants';\nimport type {\n BottomSheetOverlayProps,\n BottomSheetOverlayRef,\n} from './BottomSheetOverlay.types';\n\nexport const BottomSheetOverlay = forwardRef<\n BottomSheetOverlayRef,\n BottomSheetOverlayProps\n>(({ style, twClassName, onPress, touchableOpacityProps, ...props }, ref) => {\n const tw = useTailwind();\n const opacityVal = useRef(new Animated.Value(0)).current;\n\n const fadeIn = useCallback(() => {\n Animated.timing(opacityVal, {\n toValue: 1,\n duration: DEFAULT_OVERLAY_ANIMATION_DURATION,\n easing: DEFAULT_OVERLAY_ANIMATION_EASING,\n useNativeDriver: true,\n }).start();\n }, [opacityVal]);\n\n const fadeOut = useCallback(\n (callback?: () => void) => {\n Animated.timing(opacityVal, {\n toValue: 0,\n duration: DEFAULT_OVERLAY_ANIMATION_DURATION,\n easing: DEFAULT_OVERLAY_ANIMATION_EASING,\n useNativeDriver: true,\n }).start(({ finished }) => {\n if (finished) {\n callback?.();\n }\n });\n },\n [opacityVal],\n );\n\n useImperativeHandle(ref, () => ({ fadeIn, fadeOut }), [fadeIn, fadeOut]);\n\n useEffect(() => {\n fadeIn();\n }, [fadeIn]);\n\n return (\n <Animated.View\n style={[\n tw.style('absolute inset-0 bg-overlay-default', twClassName),\n style,\n { opacity: opacityVal },\n ]}\n {...props}\n >\n {onPress && (\n <TouchableOpacity\n onPress={onPress}\n {...touchableOpacityProps}\n style={tw.style('flex-1')}\n />\n )}\n </Animated.View>\n );\n});\n\nBottomSheetOverlay.displayName = 'BottomSheetOverlay';\n"]}
1
+ {"version":3,"file":"BottomSheetOverlay.cjs","sourceRoot":"","sources":["../../../src/components/BottomSheetOverlay/BottomSheetOverlay.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,8FAA4E;AAC5E,+CAAiD;AACjD,+CAAkE;AAElE,qFAAoF;AAG7E,MAAM,kBAAkB,GAAsC,CAAC,EACpE,KAAK,EACL,WAAW,EACX,OAAO,EACP,qBAAqB,EACrB,GAAG,KAAK,EACT,EAAE,EAAE;IACH,MAAM,EAAE,GAAG,IAAA,wCAAW,GAAE,CAAC;IACzB,MAAM,UAAU,GAAG,IAAA,cAAM,EAAC,IAAI,uBAAQ,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC;IAEzD,IAAA,iBAAS,EAAC,GAAG,EAAE;QACb,uBAAQ,CAAC,MAAM,CAAC,UAAU,EAAE;YAC1B,OAAO,EAAE,CAAC;YACV,QAAQ,EAAE,iEAAkC;YAC5C,MAAM,EAAE,qBAAM,CAAC,MAAM;YACrB,eAAe,EAAE,IAAI;SACtB,CAAC,CAAC,KAAK,EAAE,CAAC;IACb,CAAC,EAAE,CAAC,UAAU,CAAC,CAAC,CAAC;IAEjB,OAAO,CACL,CAAC,uBAAQ,CAAC,IAAI,CACZ,KAAK,CAAC,CAAC;YACL,EAAE,CAAC,KAAK,CAAC,qCAAqC,EAAE,WAAW,CAAC;YAC5D,KAAK;YACL,EAAE,OAAO,EAAE,UAAU,EAAE;SACxB,CAAC,CACF,IAAI,KAAK,CAAC,CAEV;MAAA,CAAC,OAAO,IAAI,CACV,CAAC,+BAAgB,CACf,OAAO,CAAC,CAAC,OAAO,CAAC,CACjB,IAAI,qBAAqB,CAAC,CAC1B,KAAK,CAAC,CAAC,EAAE,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC,EAC1B,CACH,CACH;IAAA,EAAE,uBAAQ,CAAC,IAAI,CAAC,CACjB,CAAC;AACJ,CAAC,CAAC;AArCW,QAAA,kBAAkB,sBAqC7B","sourcesContent":["import { useTailwind } from '@metamask-previews/design-system-twrnc-preset';\nimport React, { useEffect, useRef } from 'react';\nimport { Animated, Easing, TouchableOpacity } from 'react-native';\n\nimport { DEFAULT_OVERLAY_ANIMATION_DURATION } from './BottomSheetOverlay.constants';\nimport { BottomSheetOverlayProps } from './BottomSheetOverlay.types';\n\nexport const BottomSheetOverlay: React.FC<BottomSheetOverlayProps> = ({\n style,\n twClassName,\n onPress,\n touchableOpacityProps,\n ...props\n}) => {\n const tw = useTailwind();\n const opacityVal = useRef(new Animated.Value(0)).current;\n\n useEffect(() => {\n Animated.timing(opacityVal, {\n toValue: 1,\n duration: DEFAULT_OVERLAY_ANIMATION_DURATION,\n easing: Easing.linear,\n useNativeDriver: true,\n }).start();\n }, [opacityVal]);\n\n return (\n <Animated.View\n style={[\n tw.style('absolute inset-0 bg-overlay-default', twClassName),\n style,\n { opacity: opacityVal },\n ]}\n {...props}\n >\n {onPress && (\n <TouchableOpacity\n onPress={onPress}\n {...touchableOpacityProps}\n style={tw.style('flex-1')}\n />\n )}\n </Animated.View>\n );\n};\n"]}
@@ -1,9 +1,7 @@
1
1
  "use strict";
2
2
  Object.defineProperty(exports, "__esModule", { value: true });
3
- exports.DEFAULT_OVERLAY_ANIMATION_DURATION = exports.DEFAULT_OVERLAY_ANIMATION_EASING = void 0;
3
+ exports.DEFAULT_OVERLAY_ANIMATION_DURATION = void 0;
4
4
  const design_tokens_1 = require("@metamask-previews/design-tokens");
5
- const react_native_1 = require("react-native");
6
- /** Matches UIKit `curveEaseInOut` for a native modal scrim fade-in. */
7
- exports.DEFAULT_OVERLAY_ANIMATION_EASING = react_native_1.Easing.bezier(0.42, 0, 0.58, 1);
8
- exports.DEFAULT_OVERLAY_ANIMATION_DURATION = design_tokens_1.AnimationDuration.Regularly;
5
+ // Defaults
6
+ exports.DEFAULT_OVERLAY_ANIMATION_DURATION = design_tokens_1.AnimationDuration.Fast;
9
7
  //# sourceMappingURL=BottomSheetOverlay.constants.cjs.map
@@ -1 +1 @@
1
- {"version":3,"file":"BottomSheetOverlay.constants.cjs","sourceRoot":"","sources":["../../../src/components/BottomSheetOverlay/BottomSheetOverlay.constants.ts"],"names":[],"mappings":";;;AAAA,oEAAqE;AACrE,+CAAsC;AAEtC,uEAAuE;AAC1D,QAAA,gCAAgC,GAAG,qBAAM,CAAC,MAAM,CAAC,IAAI,EAAE,CAAC,EAAE,IAAI,EAAE,CAAC,CAAC,CAAC;AAEnE,QAAA,kCAAkC,GAAG,iCAAiB,CAAC,SAAS,CAAC","sourcesContent":["import { AnimationDuration } from '@metamask-previews/design-tokens';\nimport { Easing } from 'react-native';\n\n/** Matches UIKit `curveEaseInOut` for a native modal scrim fade-in. */\nexport const DEFAULT_OVERLAY_ANIMATION_EASING = Easing.bezier(0.42, 0, 0.58, 1);\n\nexport const DEFAULT_OVERLAY_ANIMATION_DURATION = AnimationDuration.Regularly;\n"]}
1
+ {"version":3,"file":"BottomSheetOverlay.constants.cjs","sourceRoot":"","sources":["../../../src/components/BottomSheetOverlay/BottomSheetOverlay.constants.ts"],"names":[],"mappings":";;;AAAA,oEAAqE;AAErE,WAAW;AACE,QAAA,kCAAkC,GAAG,iCAAiB,CAAC,IAAI,CAAC","sourcesContent":["import { AnimationDuration } from '@metamask-previews/design-tokens';\n\n// Defaults\nexport const DEFAULT_OVERLAY_ANIMATION_DURATION = AnimationDuration.Fast;\n"]}
@@ -1,5 +1,3 @@
1
1
  import { AnimationDuration } from "@metamask-previews/design-tokens";
2
- /** Matches UIKit `curveEaseInOut` for a native modal scrim fade-in. */
3
- export declare const DEFAULT_OVERLAY_ANIMATION_EASING: import("react-native").EasingFunction;
4
- export declare const DEFAULT_OVERLAY_ANIMATION_DURATION = AnimationDuration.Regularly;
2
+ export declare const DEFAULT_OVERLAY_ANIMATION_DURATION = AnimationDuration.Fast;
5
3
  //# sourceMappingURL=BottomSheetOverlay.constants.d.cts.map
@@ -1 +1 @@
1
- {"version":3,"file":"BottomSheetOverlay.constants.d.cts","sourceRoot":"","sources":["../../../src/components/BottomSheetOverlay/BottomSheetOverlay.constants.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,yCAAyC;AAGrE,uEAAuE;AACvE,eAAO,MAAM,gCAAgC,uCAAkC,CAAC;AAEhF,eAAO,MAAM,kCAAkC,8BAA8B,CAAC"}
1
+ {"version":3,"file":"BottomSheetOverlay.constants.d.cts","sourceRoot":"","sources":["../../../src/components/BottomSheetOverlay/BottomSheetOverlay.constants.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,yCAAyC;AAGrE,eAAO,MAAM,kCAAkC,yBAAyB,CAAC"}
@@ -1,5 +1,3 @@
1
1
  import { AnimationDuration } from "@metamask-previews/design-tokens";
2
- /** Matches UIKit `curveEaseInOut` for a native modal scrim fade-in. */
3
- export declare const DEFAULT_OVERLAY_ANIMATION_EASING: import("react-native").EasingFunction;
4
- export declare const DEFAULT_OVERLAY_ANIMATION_DURATION = AnimationDuration.Regularly;
2
+ export declare const DEFAULT_OVERLAY_ANIMATION_DURATION = AnimationDuration.Fast;
5
3
  //# sourceMappingURL=BottomSheetOverlay.constants.d.mts.map
@@ -1 +1 @@
1
- {"version":3,"file":"BottomSheetOverlay.constants.d.mts","sourceRoot":"","sources":["../../../src/components/BottomSheetOverlay/BottomSheetOverlay.constants.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,yCAAyC;AAGrE,uEAAuE;AACvE,eAAO,MAAM,gCAAgC,uCAAkC,CAAC;AAEhF,eAAO,MAAM,kCAAkC,8BAA8B,CAAC"}
1
+ {"version":3,"file":"BottomSheetOverlay.constants.d.mts","sourceRoot":"","sources":["../../../src/components/BottomSheetOverlay/BottomSheetOverlay.constants.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,yCAAyC;AAGrE,eAAO,MAAM,kCAAkC,yBAAyB,CAAC"}
@@ -1,6 +1,4 @@
1
1
  import { AnimationDuration } from "@metamask-previews/design-tokens";
2
- import { Easing } from "react-native";
3
- /** Matches UIKit `curveEaseInOut` for a native modal scrim fade-in. */
4
- export const DEFAULT_OVERLAY_ANIMATION_EASING = Easing.bezier(0.42, 0, 0.58, 1);
5
- export const DEFAULT_OVERLAY_ANIMATION_DURATION = AnimationDuration.Regularly;
2
+ // Defaults
3
+ export const DEFAULT_OVERLAY_ANIMATION_DURATION = AnimationDuration.Fast;
6
4
  //# sourceMappingURL=BottomSheetOverlay.constants.mjs.map
@@ -1 +1 @@
1
- {"version":3,"file":"BottomSheetOverlay.constants.mjs","sourceRoot":"","sources":["../../../src/components/BottomSheetOverlay/BottomSheetOverlay.constants.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,yCAAyC;AACrE,OAAO,EAAE,MAAM,EAAE,qBAAqB;AAEtC,uEAAuE;AACvE,MAAM,CAAC,MAAM,gCAAgC,GAAG,MAAM,CAAC,MAAM,CAAC,IAAI,EAAE,CAAC,EAAE,IAAI,EAAE,CAAC,CAAC,CAAC;AAEhF,MAAM,CAAC,MAAM,kCAAkC,GAAG,iBAAiB,CAAC,SAAS,CAAC","sourcesContent":["import { AnimationDuration } from '@metamask-previews/design-tokens';\nimport { Easing } from 'react-native';\n\n/** Matches UIKit `curveEaseInOut` for a native modal scrim fade-in. */\nexport const DEFAULT_OVERLAY_ANIMATION_EASING = Easing.bezier(0.42, 0, 0.58, 1);\n\nexport const DEFAULT_OVERLAY_ANIMATION_DURATION = AnimationDuration.Regularly;\n"]}
1
+ {"version":3,"file":"BottomSheetOverlay.constants.mjs","sourceRoot":"","sources":["../../../src/components/BottomSheetOverlay/BottomSheetOverlay.constants.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,yCAAyC;AAErE,WAAW;AACX,MAAM,CAAC,MAAM,kCAAkC,GAAG,iBAAiB,CAAC,IAAI,CAAC","sourcesContent":["import { AnimationDuration } from '@metamask-previews/design-tokens';\n\n// Defaults\nexport const DEFAULT_OVERLAY_ANIMATION_DURATION = AnimationDuration.Fast;\n"]}
@@ -1,8 +1,4 @@
1
1
  import React from "react";
2
- import type { BottomSheetOverlayRef } from "./BottomSheetOverlay.types.cjs";
3
- export declare const BottomSheetOverlay: React.ForwardRefExoticComponent<{
4
- twClassName?: string | undefined;
5
- onPress?: (() => void) | undefined;
6
- touchableOpacityProps?: Omit<import("react-native").TouchableOpacityProps, "style" | "onPress"> | undefined;
7
- } & import("react-native").ViewProps & React.RefAttributes<BottomSheetOverlayRef>>;
2
+ import { BottomSheetOverlayProps } from "./BottomSheetOverlay.types.cjs";
3
+ export declare const BottomSheetOverlay: React.FC<BottomSheetOverlayProps>;
8
4
  //# sourceMappingURL=BottomSheetOverlay.d.cts.map
@@ -1 +1 @@
1
- {"version":3,"file":"BottomSheetOverlay.d.cts","sourceRoot":"","sources":["../../../src/components/BottomSheetOverlay/BottomSheetOverlay.tsx"],"names":[],"mappings":"AACA,OAAO,KAMN,cAAc;AAOf,OAAO,KAAK,EAEV,qBAAqB,EACtB,uCAAmC;AAEpC,eAAO,MAAM,kBAAkB;;;;kFAwD7B,CAAC"}
1
+ {"version":3,"file":"BottomSheetOverlay.d.cts","sourceRoot":"","sources":["../../../src/components/BottomSheetOverlay/BottomSheetOverlay.tsx"],"names":[],"mappings":"AACA,OAAO,KAA4B,cAAc;AAIjD,OAAO,EAAE,uBAAuB,EAAE,uCAAmC;AAErE,eAAO,MAAM,kBAAkB,EAAE,KAAK,CAAC,EAAE,CAAC,uBAAuB,CAqChE,CAAC"}
@@ -1,8 +1,4 @@
1
1
  import React from "react";
2
- import type { BottomSheetOverlayRef } from "./BottomSheetOverlay.types.mjs";
3
- export declare const BottomSheetOverlay: React.ForwardRefExoticComponent<{
4
- twClassName?: string | undefined;
5
- onPress?: (() => void) | undefined;
6
- touchableOpacityProps?: Omit<import("react-native").TouchableOpacityProps, "style" | "onPress"> | undefined;
7
- } & import("react-native").ViewProps & React.RefAttributes<BottomSheetOverlayRef>>;
2
+ import { BottomSheetOverlayProps } from "./BottomSheetOverlay.types.mjs";
3
+ export declare const BottomSheetOverlay: React.FC<BottomSheetOverlayProps>;
8
4
  //# sourceMappingURL=BottomSheetOverlay.d.mts.map
@@ -1 +1 @@
1
- {"version":3,"file":"BottomSheetOverlay.d.mts","sourceRoot":"","sources":["../../../src/components/BottomSheetOverlay/BottomSheetOverlay.tsx"],"names":[],"mappings":"AACA,OAAO,KAMN,cAAc;AAOf,OAAO,KAAK,EAEV,qBAAqB,EACtB,uCAAmC;AAEpC,eAAO,MAAM,kBAAkB;;;;kFAwD7B,CAAC"}
1
+ {"version":3,"file":"BottomSheetOverlay.d.mts","sourceRoot":"","sources":["../../../src/components/BottomSheetOverlay/BottomSheetOverlay.tsx"],"names":[],"mappings":"AACA,OAAO,KAA4B,cAAc;AAIjD,OAAO,EAAE,uBAAuB,EAAE,uCAAmC;AAErE,eAAO,MAAM,kBAAkB,EAAE,KAAK,CAAC,EAAE,CAAC,uBAAuB,CAqChE,CAAC"}
@@ -5,37 +5,21 @@ function $importDefault(module) {
5
5
  return module;
6
6
  }
7
7
  import { useTailwind } from "@metamask-previews/design-system-twrnc-preset";
8
- import $React, { forwardRef, useCallback, useEffect, useImperativeHandle, useRef } from "react";
8
+ import $React, { useEffect, useRef } from "react";
9
9
  const React = $importDefault($React);
10
- import { Animated, TouchableOpacity } from "react-native";
11
- import { DEFAULT_OVERLAY_ANIMATION_DURATION, DEFAULT_OVERLAY_ANIMATION_EASING } from "./BottomSheetOverlay.constants.mjs";
12
- export const BottomSheetOverlay = forwardRef(({ style, twClassName, onPress, touchableOpacityProps, ...props }, ref) => {
10
+ import { Animated, Easing, TouchableOpacity } from "react-native";
11
+ import { DEFAULT_OVERLAY_ANIMATION_DURATION } from "./BottomSheetOverlay.constants.mjs";
12
+ export const BottomSheetOverlay = ({ style, twClassName, onPress, touchableOpacityProps, ...props }) => {
13
13
  const tw = useTailwind();
14
14
  const opacityVal = useRef(new Animated.Value(0)).current;
15
- const fadeIn = useCallback(() => {
15
+ useEffect(() => {
16
16
  Animated.timing(opacityVal, {
17
17
  toValue: 1,
18
18
  duration: DEFAULT_OVERLAY_ANIMATION_DURATION,
19
- easing: DEFAULT_OVERLAY_ANIMATION_EASING,
19
+ easing: Easing.linear,
20
20
  useNativeDriver: true,
21
21
  }).start();
22
22
  }, [opacityVal]);
23
- const fadeOut = useCallback((callback) => {
24
- Animated.timing(opacityVal, {
25
- toValue: 0,
26
- duration: DEFAULT_OVERLAY_ANIMATION_DURATION,
27
- easing: DEFAULT_OVERLAY_ANIMATION_EASING,
28
- useNativeDriver: true,
29
- }).start(({ finished }) => {
30
- if (finished) {
31
- callback?.();
32
- }
33
- });
34
- }, [opacityVal]);
35
- useImperativeHandle(ref, () => ({ fadeIn, fadeOut }), [fadeIn, fadeOut]);
36
- useEffect(() => {
37
- fadeIn();
38
- }, [fadeIn]);
39
23
  return (<Animated.View style={[
40
24
  tw.style('absolute inset-0 bg-overlay-default', twClassName),
41
25
  style,
@@ -43,6 +27,5 @@ export const BottomSheetOverlay = forwardRef(({ style, twClassName, onPress, tou
43
27
  ]} {...props}>
44
28
  {onPress && (<TouchableOpacity onPress={onPress} {...touchableOpacityProps} style={tw.style('flex-1')}/>)}
45
29
  </Animated.View>);
46
- });
47
- BottomSheetOverlay.displayName = 'BottomSheetOverlay';
30
+ };
48
31
  //# sourceMappingURL=BottomSheetOverlay.mjs.map
@@ -1 +1 @@
1
- {"version":3,"file":"BottomSheetOverlay.mjs","sourceRoot":"","sources":["../../../src/components/BottomSheetOverlay/BottomSheetOverlay.tsx"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,WAAW,EAAE,sDAAsD;AAC5E,OAAO,QAAO,EACZ,UAAU,EACV,WAAW,EACX,SAAS,EACT,mBAAmB,EACnB,MAAM,EACP,cAAc;;AACf,OAAO,EAAE,QAAQ,EAAE,gBAAgB,EAAE,qBAAqB;AAE1D,OAAO,EACL,kCAAkC,EAClC,gCAAgC,EACjC,2CAAuC;AAMxC,MAAM,CAAC,MAAM,kBAAkB,GAAG,UAAU,CAG1C,CAAC,EAAE,KAAK,EAAE,WAAW,EAAE,OAAO,EAAE,qBAAqB,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,EAAE,EAAE;IAC1E,MAAM,EAAE,GAAG,WAAW,EAAE,CAAC;IACzB,MAAM,UAAU,GAAG,MAAM,CAAC,IAAI,QAAQ,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC;IAEzD,MAAM,MAAM,GAAG,WAAW,CAAC,GAAG,EAAE;QAC9B,QAAQ,CAAC,MAAM,CAAC,UAAU,EAAE;YAC1B,OAAO,EAAE,CAAC;YACV,QAAQ,EAAE,kCAAkC;YAC5C,MAAM,EAAE,gCAAgC;YACxC,eAAe,EAAE,IAAI;SACtB,CAAC,CAAC,KAAK,EAAE,CAAC;IACb,CAAC,EAAE,CAAC,UAAU,CAAC,CAAC,CAAC;IAEjB,MAAM,OAAO,GAAG,WAAW,CACzB,CAAC,QAAqB,EAAE,EAAE;QACxB,QAAQ,CAAC,MAAM,CAAC,UAAU,EAAE;YAC1B,OAAO,EAAE,CAAC;YACV,QAAQ,EAAE,kCAAkC;YAC5C,MAAM,EAAE,gCAAgC;YACxC,eAAe,EAAE,IAAI;SACtB,CAAC,CAAC,KAAK,CAAC,CAAC,EAAE,QAAQ,EAAE,EAAE,EAAE;YACxB,IAAI,QAAQ,EAAE;gBACZ,QAAQ,EAAE,EAAE,CAAC;aACd;QACH,CAAC,CAAC,CAAC;IACL,CAAC,EACD,CAAC,UAAU,CAAC,CACb,CAAC;IAEF,mBAAmB,CAAC,GAAG,EAAE,GAAG,EAAE,CAAC,CAAC,EAAE,MAAM,EAAE,OAAO,EAAE,CAAC,EAAE,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC,CAAC;IAEzE,SAAS,CAAC,GAAG,EAAE;QACb,MAAM,EAAE,CAAC;IACX,CAAC,EAAE,CAAC,MAAM,CAAC,CAAC,CAAC;IAEb,OAAO,CACL,CAAC,QAAQ,CAAC,IAAI,CACZ,KAAK,CAAC,CAAC;YACL,EAAE,CAAC,KAAK,CAAC,qCAAqC,EAAE,WAAW,CAAC;YAC5D,KAAK;YACL,EAAE,OAAO,EAAE,UAAU,EAAE;SACxB,CAAC,CACF,IAAI,KAAK,CAAC,CAEV;MAAA,CAAC,OAAO,IAAI,CACV,CAAC,gBAAgB,CACf,OAAO,CAAC,CAAC,OAAO,CAAC,CACjB,IAAI,qBAAqB,CAAC,CAC1B,KAAK,CAAC,CAAC,EAAE,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC,EAC1B,CACH,CACH;IAAA,EAAE,QAAQ,CAAC,IAAI,CAAC,CACjB,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,kBAAkB,CAAC,WAAW,GAAG,oBAAoB,CAAC","sourcesContent":["import { useTailwind } from '@metamask-previews/design-system-twrnc-preset';\nimport React, {\n forwardRef,\n useCallback,\n useEffect,\n useImperativeHandle,\n useRef,\n} from 'react';\nimport { Animated, TouchableOpacity } from 'react-native';\n\nimport {\n DEFAULT_OVERLAY_ANIMATION_DURATION,\n DEFAULT_OVERLAY_ANIMATION_EASING,\n} from './BottomSheetOverlay.constants';\nimport type {\n BottomSheetOverlayProps,\n BottomSheetOverlayRef,\n} from './BottomSheetOverlay.types';\n\nexport const BottomSheetOverlay = forwardRef<\n BottomSheetOverlayRef,\n BottomSheetOverlayProps\n>(({ style, twClassName, onPress, touchableOpacityProps, ...props }, ref) => {\n const tw = useTailwind();\n const opacityVal = useRef(new Animated.Value(0)).current;\n\n const fadeIn = useCallback(() => {\n Animated.timing(opacityVal, {\n toValue: 1,\n duration: DEFAULT_OVERLAY_ANIMATION_DURATION,\n easing: DEFAULT_OVERLAY_ANIMATION_EASING,\n useNativeDriver: true,\n }).start();\n }, [opacityVal]);\n\n const fadeOut = useCallback(\n (callback?: () => void) => {\n Animated.timing(opacityVal, {\n toValue: 0,\n duration: DEFAULT_OVERLAY_ANIMATION_DURATION,\n easing: DEFAULT_OVERLAY_ANIMATION_EASING,\n useNativeDriver: true,\n }).start(({ finished }) => {\n if (finished) {\n callback?.();\n }\n });\n },\n [opacityVal],\n );\n\n useImperativeHandle(ref, () => ({ fadeIn, fadeOut }), [fadeIn, fadeOut]);\n\n useEffect(() => {\n fadeIn();\n }, [fadeIn]);\n\n return (\n <Animated.View\n style={[\n tw.style('absolute inset-0 bg-overlay-default', twClassName),\n style,\n { opacity: opacityVal },\n ]}\n {...props}\n >\n {onPress && (\n <TouchableOpacity\n onPress={onPress}\n {...touchableOpacityProps}\n style={tw.style('flex-1')}\n />\n )}\n </Animated.View>\n );\n});\n\nBottomSheetOverlay.displayName = 'BottomSheetOverlay';\n"]}
1
+ {"version":3,"file":"BottomSheetOverlay.mjs","sourceRoot":"","sources":["../../../src/components/BottomSheetOverlay/BottomSheetOverlay.tsx"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,WAAW,EAAE,sDAAsD;AAC5E,OAAO,QAAO,EAAE,SAAS,EAAE,MAAM,EAAE,cAAc;;AACjD,OAAO,EAAE,QAAQ,EAAE,MAAM,EAAE,gBAAgB,EAAE,qBAAqB;AAElE,OAAO,EAAE,kCAAkC,EAAE,2CAAuC;AAGpF,MAAM,CAAC,MAAM,kBAAkB,GAAsC,CAAC,EACpE,KAAK,EACL,WAAW,EACX,OAAO,EACP,qBAAqB,EACrB,GAAG,KAAK,EACT,EAAE,EAAE;IACH,MAAM,EAAE,GAAG,WAAW,EAAE,CAAC;IACzB,MAAM,UAAU,GAAG,MAAM,CAAC,IAAI,QAAQ,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC;IAEzD,SAAS,CAAC,GAAG,EAAE;QACb,QAAQ,CAAC,MAAM,CAAC,UAAU,EAAE;YAC1B,OAAO,EAAE,CAAC;YACV,QAAQ,EAAE,kCAAkC;YAC5C,MAAM,EAAE,MAAM,CAAC,MAAM;YACrB,eAAe,EAAE,IAAI;SACtB,CAAC,CAAC,KAAK,EAAE,CAAC;IACb,CAAC,EAAE,CAAC,UAAU,CAAC,CAAC,CAAC;IAEjB,OAAO,CACL,CAAC,QAAQ,CAAC,IAAI,CACZ,KAAK,CAAC,CAAC;YACL,EAAE,CAAC,KAAK,CAAC,qCAAqC,EAAE,WAAW,CAAC;YAC5D,KAAK;YACL,EAAE,OAAO,EAAE,UAAU,EAAE;SACxB,CAAC,CACF,IAAI,KAAK,CAAC,CAEV;MAAA,CAAC,OAAO,IAAI,CACV,CAAC,gBAAgB,CACf,OAAO,CAAC,CAAC,OAAO,CAAC,CACjB,IAAI,qBAAqB,CAAC,CAC1B,KAAK,CAAC,CAAC,EAAE,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC,EAC1B,CACH,CACH;IAAA,EAAE,QAAQ,CAAC,IAAI,CAAC,CACjB,CAAC;AACJ,CAAC,CAAC","sourcesContent":["import { useTailwind } from '@metamask-previews/design-system-twrnc-preset';\nimport React, { useEffect, useRef } from 'react';\nimport { Animated, Easing, TouchableOpacity } from 'react-native';\n\nimport { DEFAULT_OVERLAY_ANIMATION_DURATION } from './BottomSheetOverlay.constants';\nimport { BottomSheetOverlayProps } from './BottomSheetOverlay.types';\n\nexport const BottomSheetOverlay: React.FC<BottomSheetOverlayProps> = ({\n style,\n twClassName,\n onPress,\n touchableOpacityProps,\n ...props\n}) => {\n const tw = useTailwind();\n const opacityVal = useRef(new Animated.Value(0)).current;\n\n useEffect(() => {\n Animated.timing(opacityVal, {\n toValue: 1,\n duration: DEFAULT_OVERLAY_ANIMATION_DURATION,\n easing: Easing.linear,\n useNativeDriver: true,\n }).start();\n }, [opacityVal]);\n\n return (\n <Animated.View\n style={[\n tw.style('absolute inset-0 bg-overlay-default', twClassName),\n style,\n { opacity: opacityVal },\n ]}\n {...props}\n >\n {onPress && (\n <TouchableOpacity\n onPress={onPress}\n {...touchableOpacityProps}\n style={tw.style('flex-1')}\n />\n )}\n </Animated.View>\n );\n};\n"]}
@@ -1 +1 @@
1
- {"version":3,"file":"BottomSheetOverlay.types.cjs","sourceRoot":"","sources":["../../../src/components/BottomSheetOverlay/BottomSheetOverlay.types.ts"],"names":[],"mappings":"","sourcesContent":["// Third party dependencies.\nimport type { TouchableOpacityProps, ViewProps } from 'react-native';\n\n/**\n * Overlay component props.\n */\nexport type BottomSheetOverlayProps = {\n /**\n * Tailwind CSS classes for the overlay container.\n */\n twClassName?: string;\n /**\n * Callback function triggered when the overlay is pressed.\n */\n onPress?: () => void;\n /**\n * Props spread to the TouchableOpacity component (e.g., testID for the button).\n * Note: onPress should be passed as a top-level prop, not through this object.\n */\n touchableOpacityProps?: Omit<TouchableOpacityProps, 'onPress' | 'style'>;\n} & ViewProps;\n\n/**\n * Ref handle for imperative control of overlay fade animations.\n */\nexport type BottomSheetOverlayRef = {\n /**\n * Fade the overlay in.\n */\n fadeIn: () => void;\n /**\n * Fade the overlay out with an optional callback after animation completes.\n */\n fadeOut: (callback?: () => void) => void;\n};\n"]}
1
+ {"version":3,"file":"BottomSheetOverlay.types.cjs","sourceRoot":"","sources":["../../../src/components/BottomSheetOverlay/BottomSheetOverlay.types.ts"],"names":[],"mappings":"","sourcesContent":["// Third party dependencies.\nimport type { TouchableOpacityProps, ViewProps } from 'react-native';\n\n/**\n * Overlay component props.\n */\nexport type BottomSheetOverlayProps = {\n /**\n * Tailwind CSS classes for the overlay container.\n */\n twClassName?: string;\n /**\n * Callback function triggered when the overlay is pressed.\n */\n onPress?: () => void;\n /**\n * Props spread to the TouchableOpacity component (e.g., testID for the button).\n * Note: onPress should be passed as a top-level prop, not through this object.\n */\n touchableOpacityProps?: Omit<TouchableOpacityProps, 'onPress' | 'style'>;\n} & ViewProps;\n"]}
@@ -17,17 +17,4 @@ export type BottomSheetOverlayProps = {
17
17
  */
18
18
  touchableOpacityProps?: Omit<TouchableOpacityProps, 'onPress' | 'style'>;
19
19
  } & ViewProps;
20
- /**
21
- * Ref handle for imperative control of overlay fade animations.
22
- */
23
- export type BottomSheetOverlayRef = {
24
- /**
25
- * Fade the overlay in.
26
- */
27
- fadeIn: () => void;
28
- /**
29
- * Fade the overlay out with an optional callback after animation completes.
30
- */
31
- fadeOut: (callback?: () => void) => void;
32
- };
33
20
  //# sourceMappingURL=BottomSheetOverlay.types.d.cts.map
@@ -1 +1 @@
1
- {"version":3,"file":"BottomSheetOverlay.types.d.cts","sourceRoot":"","sources":["../../../src/components/BottomSheetOverlay/BottomSheetOverlay.types.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,qBAAqB,EAAE,SAAS,EAAE,qBAAqB;AAErE;;GAEG;AACH,MAAM,MAAM,uBAAuB,GAAG;IACpC;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB;;;OAGG;IACH,qBAAqB,CAAC,EAAE,IAAI,CAAC,qBAAqB,EAAE,SAAS,GAAG,OAAO,CAAC,CAAC;CAC1E,GAAG,SAAS,CAAC;AAEd;;GAEG;AACH,MAAM,MAAM,qBAAqB,GAAG;IAClC;;OAEG;IACH,MAAM,EAAE,MAAM,IAAI,CAAC;IACnB;;OAEG;IACH,OAAO,EAAE,CAAC,QAAQ,CAAC,EAAE,MAAM,IAAI,KAAK,IAAI,CAAC;CAC1C,CAAC"}
1
+ {"version":3,"file":"BottomSheetOverlay.types.d.cts","sourceRoot":"","sources":["../../../src/components/BottomSheetOverlay/BottomSheetOverlay.types.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,qBAAqB,EAAE,SAAS,EAAE,qBAAqB;AAErE;;GAEG;AACH,MAAM,MAAM,uBAAuB,GAAG;IACpC;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB;;;OAGG;IACH,qBAAqB,CAAC,EAAE,IAAI,CAAC,qBAAqB,EAAE,SAAS,GAAG,OAAO,CAAC,CAAC;CAC1E,GAAG,SAAS,CAAC"}
@@ -17,17 +17,4 @@ export type BottomSheetOverlayProps = {
17
17
  */
18
18
  touchableOpacityProps?: Omit<TouchableOpacityProps, 'onPress' | 'style'>;
19
19
  } & ViewProps;
20
- /**
21
- * Ref handle for imperative control of overlay fade animations.
22
- */
23
- export type BottomSheetOverlayRef = {
24
- /**
25
- * Fade the overlay in.
26
- */
27
- fadeIn: () => void;
28
- /**
29
- * Fade the overlay out with an optional callback after animation completes.
30
- */
31
- fadeOut: (callback?: () => void) => void;
32
- };
33
20
  //# sourceMappingURL=BottomSheetOverlay.types.d.mts.map
@@ -1 +1 @@
1
- {"version":3,"file":"BottomSheetOverlay.types.d.mts","sourceRoot":"","sources":["../../../src/components/BottomSheetOverlay/BottomSheetOverlay.types.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,qBAAqB,EAAE,SAAS,EAAE,qBAAqB;AAErE;;GAEG;AACH,MAAM,MAAM,uBAAuB,GAAG;IACpC;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB;;;OAGG;IACH,qBAAqB,CAAC,EAAE,IAAI,CAAC,qBAAqB,EAAE,SAAS,GAAG,OAAO,CAAC,CAAC;CAC1E,GAAG,SAAS,CAAC;AAEd;;GAEG;AACH,MAAM,MAAM,qBAAqB,GAAG;IAClC;;OAEG;IACH,MAAM,EAAE,MAAM,IAAI,CAAC;IACnB;;OAEG;IACH,OAAO,EAAE,CAAC,QAAQ,CAAC,EAAE,MAAM,IAAI,KAAK,IAAI,CAAC;CAC1C,CAAC"}
1
+ {"version":3,"file":"BottomSheetOverlay.types.d.mts","sourceRoot":"","sources":["../../../src/components/BottomSheetOverlay/BottomSheetOverlay.types.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,qBAAqB,EAAE,SAAS,EAAE,qBAAqB;AAErE;;GAEG;AACH,MAAM,MAAM,uBAAuB,GAAG;IACpC;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB;;;OAGG;IACH,qBAAqB,CAAC,EAAE,IAAI,CAAC,qBAAqB,EAAE,SAAS,GAAG,OAAO,CAAC,CAAC;CAC1E,GAAG,SAAS,CAAC"}
@@ -1 +1 @@
1
- {"version":3,"file":"BottomSheetOverlay.types.mjs","sourceRoot":"","sources":["../../../src/components/BottomSheetOverlay/BottomSheetOverlay.types.ts"],"names":[],"mappings":"","sourcesContent":["// Third party dependencies.\nimport type { TouchableOpacityProps, ViewProps } from 'react-native';\n\n/**\n * Overlay component props.\n */\nexport type BottomSheetOverlayProps = {\n /**\n * Tailwind CSS classes for the overlay container.\n */\n twClassName?: string;\n /**\n * Callback function triggered when the overlay is pressed.\n */\n onPress?: () => void;\n /**\n * Props spread to the TouchableOpacity component (e.g., testID for the button).\n * Note: onPress should be passed as a top-level prop, not through this object.\n */\n touchableOpacityProps?: Omit<TouchableOpacityProps, 'onPress' | 'style'>;\n} & ViewProps;\n\n/**\n * Ref handle for imperative control of overlay fade animations.\n */\nexport type BottomSheetOverlayRef = {\n /**\n * Fade the overlay in.\n */\n fadeIn: () => void;\n /**\n * Fade the overlay out with an optional callback after animation completes.\n */\n fadeOut: (callback?: () => void) => void;\n};\n"]}
1
+ {"version":3,"file":"BottomSheetOverlay.types.mjs","sourceRoot":"","sources":["../../../src/components/BottomSheetOverlay/BottomSheetOverlay.types.ts"],"names":[],"mappings":"","sourcesContent":["// Third party dependencies.\nimport type { TouchableOpacityProps, ViewProps } from 'react-native';\n\n/**\n * Overlay component props.\n */\nexport type BottomSheetOverlayProps = {\n /**\n * Tailwind CSS classes for the overlay container.\n */\n twClassName?: string;\n /**\n * Callback function triggered when the overlay is pressed.\n */\n onPress?: () => void;\n /**\n * Props spread to the TouchableOpacity component (e.g., testID for the button).\n * Note: onPress should be passed as a top-level prop, not through this object.\n */\n touchableOpacityProps?: Omit<TouchableOpacityProps, 'onPress' | 'style'>;\n} & ViewProps;\n"]}
@@ -1 +1 @@
1
- {"version":3,"file":"index.cjs","sourceRoot":"","sources":["../../../src/components/BottomSheetOverlay/index.ts"],"names":[],"mappings":";;;AAAA,+DAA0D;AAAjD,wHAAA,kBAAkB,OAAA","sourcesContent":["export { BottomSheetOverlay } from './BottomSheetOverlay';\nexport type {\n BottomSheetOverlayProps,\n BottomSheetOverlayRef,\n} from './BottomSheetOverlay.types';\n"]}
1
+ {"version":3,"file":"index.cjs","sourceRoot":"","sources":["../../../src/components/BottomSheetOverlay/index.ts"],"names":[],"mappings":";;;AAAA,+DAA0D;AAAjD,wHAAA,kBAAkB,OAAA","sourcesContent":["export { BottomSheetOverlay } from './BottomSheetOverlay';\nexport type { BottomSheetOverlayProps } from './BottomSheetOverlay.types';\n"]}