@oxyhq/bloom 0.14.0 → 0.16.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/lib/commonjs/alert-dialog/AlertDialog.js +35 -27
- package/lib/commonjs/alert-dialog/AlertDialog.js.map +1 -1
- package/lib/commonjs/alert-dialog/index.js +1 -1
- package/lib/commonjs/alert-dialog/index.js.map +1 -1
- package/lib/commonjs/alert-dialog/index.web.js +1 -1
- package/lib/commonjs/alert-dialog/index.web.js.map +1 -1
- package/lib/commonjs/command/Command.js +27 -16
- package/lib/commonjs/command/Command.js.map +1 -1
- package/lib/commonjs/command/index.js +1 -1
- package/lib/commonjs/command/index.js.map +1 -1
- package/lib/commonjs/command/index.web.js +1 -1
- package/lib/commonjs/command/index.web.js.map +1 -1
- package/lib/commonjs/dialog/Dialog.js +336 -43
- package/lib/commonjs/dialog/Dialog.js.map +1 -1
- package/lib/commonjs/dialog/Dialog.web.js +420 -66
- package/lib/commonjs/dialog/Dialog.web.js.map +1 -1
- package/lib/commonjs/dialog/index.js +2 -9
- package/lib/commonjs/dialog/index.js.map +1 -1
- package/lib/commonjs/dialog/index.web.js +2 -15
- package/lib/commonjs/dialog/index.web.js.map +1 -1
- package/lib/commonjs/dialog/placement.js +104 -0
- package/lib/commonjs/dialog/placement.js.map +1 -0
- package/lib/commonjs/index.js +7 -29
- package/lib/commonjs/index.js.map +1 -1
- package/lib/commonjs/index.web.js +13 -35
- package/lib/commonjs/index.web.js.map +1 -1
- package/lib/module/alert-dialog/AlertDialog.js +35 -27
- package/lib/module/alert-dialog/AlertDialog.js.map +1 -1
- package/lib/module/alert-dialog/index.js +2 -2
- package/lib/module/alert-dialog/index.js.map +1 -1
- package/lib/module/alert-dialog/index.web.js +2 -2
- package/lib/module/alert-dialog/index.web.js.map +1 -1
- package/lib/module/command/Command.js +27 -16
- package/lib/module/command/Command.js.map +1 -1
- package/lib/module/command/index.js +2 -2
- package/lib/module/command/index.js.map +1 -1
- package/lib/module/command/index.web.js +2 -2
- package/lib/module/command/index.web.js.map +1 -1
- package/lib/module/dialog/Dialog.js +335 -46
- package/lib/module/dialog/Dialog.js.map +1 -1
- package/lib/module/dialog/Dialog.web.js +418 -68
- package/lib/module/dialog/Dialog.web.js.map +1 -1
- package/lib/module/dialog/index.js +1 -2
- package/lib/module/dialog/index.js.map +1 -1
- package/lib/module/dialog/index.web.js +1 -2
- package/lib/module/dialog/index.web.js.map +1 -1
- package/lib/module/dialog/placement.js +100 -0
- package/lib/module/dialog/placement.js.map +1 -0
- package/lib/module/index.js +1 -3
- package/lib/module/index.js.map +1 -1
- package/lib/module/index.web.js +1 -3
- package/lib/module/index.web.js.map +1 -1
- package/lib/typescript/commonjs/alert-dialog/AlertDialog.d.ts +13 -12
- package/lib/typescript/commonjs/alert-dialog/AlertDialog.d.ts.map +1 -1
- package/lib/typescript/commonjs/alert-dialog/index.d.ts.map +1 -1
- package/lib/typescript/commonjs/alert-dialog/index.web.d.ts.map +1 -1
- package/lib/typescript/commonjs/command/Command.d.ts +8 -8
- package/lib/typescript/commonjs/command/Command.d.ts.map +1 -1
- package/lib/typescript/commonjs/command/index.d.ts.map +1 -1
- package/lib/typescript/commonjs/command/index.web.d.ts.map +1 -1
- package/lib/typescript/commonjs/dialog/Dialog.d.ts +17 -15
- package/lib/typescript/commonjs/dialog/Dialog.d.ts.map +1 -1
- package/lib/typescript/commonjs/dialog/Dialog.web.d.ts +18 -5
- package/lib/typescript/commonjs/dialog/Dialog.web.d.ts.map +1 -1
- package/lib/typescript/commonjs/dialog/index.d.ts +2 -4
- package/lib/typescript/commonjs/dialog/index.d.ts.map +1 -1
- package/lib/typescript/commonjs/dialog/index.web.d.ts +2 -4
- package/lib/typescript/commonjs/dialog/index.web.d.ts.map +1 -1
- package/lib/typescript/commonjs/dialog/placement.d.ts +71 -0
- package/lib/typescript/commonjs/dialog/placement.d.ts.map +1 -0
- package/lib/typescript/commonjs/dialog/types.d.ts +66 -3
- package/lib/typescript/commonjs/dialog/types.d.ts.map +1 -1
- package/lib/typescript/commonjs/index.d.ts +2 -4
- package/lib/typescript/commonjs/index.d.ts.map +1 -1
- package/lib/typescript/commonjs/index.web.d.ts +2 -4
- package/lib/typescript/commonjs/index.web.d.ts.map +1 -1
- package/lib/typescript/module/alert-dialog/AlertDialog.d.ts +13 -12
- package/lib/typescript/module/alert-dialog/AlertDialog.d.ts.map +1 -1
- package/lib/typescript/module/alert-dialog/index.d.ts.map +1 -1
- package/lib/typescript/module/alert-dialog/index.web.d.ts.map +1 -1
- package/lib/typescript/module/command/Command.d.ts +8 -8
- package/lib/typescript/module/command/Command.d.ts.map +1 -1
- package/lib/typescript/module/command/index.d.ts.map +1 -1
- package/lib/typescript/module/command/index.web.d.ts.map +1 -1
- package/lib/typescript/module/dialog/Dialog.d.ts +17 -15
- package/lib/typescript/module/dialog/Dialog.d.ts.map +1 -1
- package/lib/typescript/module/dialog/Dialog.web.d.ts +18 -5
- package/lib/typescript/module/dialog/Dialog.web.d.ts.map +1 -1
- package/lib/typescript/module/dialog/index.d.ts +2 -4
- package/lib/typescript/module/dialog/index.d.ts.map +1 -1
- package/lib/typescript/module/dialog/index.web.d.ts +2 -4
- package/lib/typescript/module/dialog/index.web.d.ts.map +1 -1
- package/lib/typescript/module/dialog/placement.d.ts +71 -0
- package/lib/typescript/module/dialog/placement.d.ts.map +1 -0
- package/lib/typescript/module/dialog/types.d.ts +66 -3
- package/lib/typescript/module/dialog/types.d.ts.map +1 -1
- package/lib/typescript/module/index.d.ts +2 -4
- package/lib/typescript/module/index.d.ts.map +1 -1
- package/lib/typescript/module/index.web.d.ts +2 -4
- package/lib/typescript/module/index.web.d.ts.map +1 -1
- package/package.json +1 -18
- package/src/__tests__/AlertDialog.test.tsx +122 -0
- package/src/__tests__/Command.test.tsx +107 -0
- package/src/__tests__/DialogPlacement.test.tsx +144 -0
- package/src/alert-dialog/AlertDialog.tsx +46 -36
- package/src/alert-dialog/index.ts +2 -2
- package/src/alert-dialog/index.web.ts +2 -2
- package/src/command/Command.tsx +30 -19
- package/src/command/index.ts +2 -2
- package/src/command/index.web.ts +2 -2
- package/src/dialog/Dialog.tsx +406 -50
- package/src/dialog/Dialog.web.tsx +496 -78
- package/src/dialog/index.ts +4 -3
- package/src/dialog/index.web.ts +4 -7
- package/src/dialog/placement.ts +113 -0
- package/src/dialog/types.ts +69 -3
- package/src/index.ts +4 -11
- package/src/index.web.ts +4 -11
- package/lib/commonjs/dialog/CenteredDialog.js +0 -250
- package/lib/commonjs/dialog/CenteredDialog.js.map +0 -1
- package/lib/commonjs/dialog/CenteredDialog.web.js +0 -328
- package/lib/commonjs/dialog/CenteredDialog.web.js.map +0 -1
- package/lib/commonjs/dialog/centered-dialog-tokens.js +0 -62
- package/lib/commonjs/dialog/centered-dialog-tokens.js.map +0 -1
- package/lib/commonjs/dialog/centered-dialog-types.js +0 -6
- package/lib/commonjs/dialog/centered-dialog-types.js.map +0 -1
- package/lib/commonjs/responsive-sheet/ResponsiveSheet.js +0 -300
- package/lib/commonjs/responsive-sheet/ResponsiveSheet.js.map +0 -1
- package/lib/commonjs/responsive-sheet/ResponsiveSheet.native.js +0 -226
- package/lib/commonjs/responsive-sheet/ResponsiveSheet.native.js.map +0 -1
- package/lib/commonjs/responsive-sheet/const.js +0 -60
- package/lib/commonjs/responsive-sheet/const.js.map +0 -1
- package/lib/commonjs/responsive-sheet/index.js +0 -19
- package/lib/commonjs/responsive-sheet/index.js.map +0 -1
- package/lib/commonjs/responsive-sheet/index.web.js +0 -19
- package/lib/commonjs/responsive-sheet/index.web.js.map +0 -1
- package/lib/commonjs/responsive-sheet/types.js +0 -6
- package/lib/commonjs/responsive-sheet/types.js.map +0 -1
- package/lib/module/dialog/CenteredDialog.js +0 -244
- package/lib/module/dialog/CenteredDialog.js.map +0 -1
- package/lib/module/dialog/CenteredDialog.web.js +0 -322
- package/lib/module/dialog/CenteredDialog.web.js.map +0 -1
- package/lib/module/dialog/centered-dialog-tokens.js +0 -58
- package/lib/module/dialog/centered-dialog-tokens.js.map +0 -1
- package/lib/module/dialog/centered-dialog-types.js +0 -4
- package/lib/module/dialog/centered-dialog-types.js.map +0 -1
- package/lib/module/responsive-sheet/ResponsiveSheet.js +0 -293
- package/lib/module/responsive-sheet/ResponsiveSheet.js.map +0 -1
- package/lib/module/responsive-sheet/ResponsiveSheet.native.js +0 -219
- package/lib/module/responsive-sheet/ResponsiveSheet.native.js.map +0 -1
- package/lib/module/responsive-sheet/const.js +0 -56
- package/lib/module/responsive-sheet/const.js.map +0 -1
- package/lib/module/responsive-sheet/index.js +0 -4
- package/lib/module/responsive-sheet/index.js.map +0 -1
- package/lib/module/responsive-sheet/index.web.js +0 -14
- package/lib/module/responsive-sheet/index.web.js.map +0 -1
- package/lib/module/responsive-sheet/types.js +0 -4
- package/lib/module/responsive-sheet/types.js.map +0 -1
- package/lib/typescript/commonjs/dialog/CenteredDialog.d.ts +0 -20
- package/lib/typescript/commonjs/dialog/CenteredDialog.d.ts.map +0 -1
- package/lib/typescript/commonjs/dialog/CenteredDialog.web.d.ts +0 -29
- package/lib/typescript/commonjs/dialog/CenteredDialog.web.d.ts.map +0 -1
- package/lib/typescript/commonjs/dialog/centered-dialog-tokens.d.ts +0 -47
- package/lib/typescript/commonjs/dialog/centered-dialog-tokens.d.ts.map +0 -1
- package/lib/typescript/commonjs/dialog/centered-dialog-types.d.ts +0 -70
- package/lib/typescript/commonjs/dialog/centered-dialog-types.d.ts.map +0 -1
- package/lib/typescript/commonjs/responsive-sheet/ResponsiveSheet.d.ts +0 -26
- package/lib/typescript/commonjs/responsive-sheet/ResponsiveSheet.d.ts.map +0 -1
- package/lib/typescript/commonjs/responsive-sheet/ResponsiveSheet.native.d.ts +0 -20
- package/lib/typescript/commonjs/responsive-sheet/ResponsiveSheet.native.d.ts.map +0 -1
- package/lib/typescript/commonjs/responsive-sheet/const.d.ts +0 -43
- package/lib/typescript/commonjs/responsive-sheet/const.d.ts.map +0 -1
- package/lib/typescript/commonjs/responsive-sheet/index.d.ts +0 -3
- package/lib/typescript/commonjs/responsive-sheet/index.d.ts.map +0 -1
- package/lib/typescript/commonjs/responsive-sheet/index.web.d.ts +0 -3
- package/lib/typescript/commonjs/responsive-sheet/index.web.d.ts.map +0 -1
- package/lib/typescript/commonjs/responsive-sheet/types.d.ts +0 -55
- package/lib/typescript/commonjs/responsive-sheet/types.d.ts.map +0 -1
- package/lib/typescript/module/dialog/CenteredDialog.d.ts +0 -20
- package/lib/typescript/module/dialog/CenteredDialog.d.ts.map +0 -1
- package/lib/typescript/module/dialog/CenteredDialog.web.d.ts +0 -29
- package/lib/typescript/module/dialog/CenteredDialog.web.d.ts.map +0 -1
- package/lib/typescript/module/dialog/centered-dialog-tokens.d.ts +0 -47
- package/lib/typescript/module/dialog/centered-dialog-tokens.d.ts.map +0 -1
- package/lib/typescript/module/dialog/centered-dialog-types.d.ts +0 -70
- package/lib/typescript/module/dialog/centered-dialog-types.d.ts.map +0 -1
- package/lib/typescript/module/responsive-sheet/ResponsiveSheet.d.ts +0 -26
- package/lib/typescript/module/responsive-sheet/ResponsiveSheet.d.ts.map +0 -1
- package/lib/typescript/module/responsive-sheet/ResponsiveSheet.native.d.ts +0 -20
- package/lib/typescript/module/responsive-sheet/ResponsiveSheet.native.d.ts.map +0 -1
- package/lib/typescript/module/responsive-sheet/const.d.ts +0 -43
- package/lib/typescript/module/responsive-sheet/const.d.ts.map +0 -1
- package/lib/typescript/module/responsive-sheet/index.d.ts +0 -3
- package/lib/typescript/module/responsive-sheet/index.d.ts.map +0 -1
- package/lib/typescript/module/responsive-sheet/index.web.d.ts +0 -3
- package/lib/typescript/module/responsive-sheet/index.web.d.ts.map +0 -1
- package/lib/typescript/module/responsive-sheet/types.d.ts +0 -55
- package/lib/typescript/module/responsive-sheet/types.d.ts.map +0 -1
- package/src/__tests__/CenteredDialog.test.tsx +0 -108
- package/src/__tests__/ResponsiveSheet.test.tsx +0 -104
- package/src/dialog/CenteredDialog.stories.tsx +0 -125
- package/src/dialog/CenteredDialog.tsx +0 -303
- package/src/dialog/CenteredDialog.web.tsx +0 -372
- package/src/dialog/centered-dialog-tokens.ts +0 -68
- package/src/dialog/centered-dialog-types.ts +0 -70
- package/src/responsive-sheet/ResponsiveSheet.native.tsx +0 -257
- package/src/responsive-sheet/ResponsiveSheet.stories.tsx +0 -54
- package/src/responsive-sheet/ResponsiveSheet.tsx +0 -327
- package/src/responsive-sheet/const.ts +0 -53
- package/src/responsive-sheet/index.ts +0 -6
- package/src/responsive-sheet/index.web.ts +0 -16
- package/src/responsive-sheet/types.ts +0 -57
|
@@ -0,0 +1,71 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Anchor a `<Dialog>` can render against.
|
|
3
|
+
*
|
|
4
|
+
* - `'center'` — the default centered modal card (current behavior).
|
|
5
|
+
* - `'left'` / `'right'` — an anchored side-sheet / drawer.
|
|
6
|
+
* - `'bottom'` — a bottom-sheet (drag handle, slide-up).
|
|
7
|
+
*/
|
|
8
|
+
export type DialogPlacement = 'center' | 'left' | 'right' | 'bottom';
|
|
9
|
+
/**
|
|
10
|
+
* A `<Dialog>` placement that may vary by viewport width.
|
|
11
|
+
*
|
|
12
|
+
* Either a single `DialogPlacement` (applied at every width) or a responsive
|
|
13
|
+
* map whose `base` applies below the first breakpoint and whose `sm`/`md`/`lg`/
|
|
14
|
+
* `xl` keys override it at and above the matching Tailwind breakpoint.
|
|
15
|
+
*
|
|
16
|
+
* The common store-drawer case is `{ base: 'bottom', md: 'left' }`; the common
|
|
17
|
+
* dialog-to-sheet case is `{ base: 'bottom', md: 'center' }`.
|
|
18
|
+
*/
|
|
19
|
+
export type ResponsiveDialogPlacement = DialogPlacement | {
|
|
20
|
+
base: DialogPlacement;
|
|
21
|
+
sm?: DialogPlacement;
|
|
22
|
+
md?: DialogPlacement;
|
|
23
|
+
lg?: DialogPlacement;
|
|
24
|
+
xl?: DialogPlacement;
|
|
25
|
+
};
|
|
26
|
+
/**
|
|
27
|
+
* Tailwind-default breakpoints (px). A responsive `placement` map resolves to
|
|
28
|
+
* the value for the largest key whose min-width is `<=` the current viewport
|
|
29
|
+
* width, falling back to `base`.
|
|
30
|
+
*/
|
|
31
|
+
export declare const BREAKPOINT_SM = 640;
|
|
32
|
+
export declare const BREAKPOINT_MD = 768;
|
|
33
|
+
export declare const BREAKPOINT_LG = 1024;
|
|
34
|
+
export declare const BREAKPOINT_XL = 1280;
|
|
35
|
+
/** Default side-sheet width (px) on wide screens. */
|
|
36
|
+
export declare const DEFAULT_SIDE_WIDTH = 460;
|
|
37
|
+
/** Default centered-card max width (px). Matches the legacy `maxWidth: 480`. */
|
|
38
|
+
export declare const DEFAULT_CENTER_MAX_WIDTH = 480;
|
|
39
|
+
/** Default bottom-sheet max height as a fraction of the viewport height. */
|
|
40
|
+
export declare const DEFAULT_MAX_HEIGHT_RATIO = 0.9;
|
|
41
|
+
/** Corner radius shared by the side-sheet panel and the bottom-sheet top. */
|
|
42
|
+
export declare const PANEL_RADIUS = 20;
|
|
43
|
+
/** Open/close transition duration (ms). ~280ms ease-out reads smooth. */
|
|
44
|
+
export declare const ANIMATION_DURATION = 280;
|
|
45
|
+
/** Centered-card fade-out duration (ms) — preserves the legacy timing. */
|
|
46
|
+
export declare const CENTER_FADE_OUT_DURATION = 150;
|
|
47
|
+
/** CSS approximation of reanimated's `Easing.out(Easing.cubic)`. */
|
|
48
|
+
export declare const EASE_OUT = "cubic-bezier(0.33, 1, 0.68, 1)";
|
|
49
|
+
/** Backdrop dim opacity once fully shown (matches `bg-black/40`). */
|
|
50
|
+
export declare const SHEET_BACKDROP_OPACITY = 0.4;
|
|
51
|
+
/** Stable testID for the dimmed backdrop of a side/bottom placement dialog. */
|
|
52
|
+
export declare const DIALOG_SHEET_BACKDROP_TESTID = "bloom-dialog-sheet-backdrop";
|
|
53
|
+
/** Drag-handle pill geometry for the bottom-sheet. */
|
|
54
|
+
export declare const HANDLE_WIDTH = 36;
|
|
55
|
+
export declare const HANDLE_HEIGHT = 5;
|
|
56
|
+
export declare const HANDLE_RADIUS = 3;
|
|
57
|
+
/**
|
|
58
|
+
* Minimum gutter kept between a wide side-sheet and the opposite viewport edge
|
|
59
|
+
* when capping its width, so the panel never spans the full screen.
|
|
60
|
+
*/
|
|
61
|
+
export declare const SIDE_SHEET_MIN_GUTTER = 24;
|
|
62
|
+
/**
|
|
63
|
+
* Resolve a (possibly responsive) `placement` to a concrete `DialogPlacement`
|
|
64
|
+
* for the current viewport width.
|
|
65
|
+
*
|
|
66
|
+
* A plain string placement resolves to itself. A responsive map picks the
|
|
67
|
+
* value for the largest breakpoint key whose min-width is `<=` the viewport
|
|
68
|
+
* width, falling back to `base` below the first breakpoint.
|
|
69
|
+
*/
|
|
70
|
+
export declare function useResolvedPlacement(placement: ResponsiveDialogPlacement | undefined): DialogPlacement;
|
|
71
|
+
//# sourceMappingURL=placement.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"placement.d.ts","sourceRoot":"","sources":["../../../../src/dialog/placement.ts"],"names":[],"mappings":"AAGA;;;;;;GAMG;AACH,MAAM,MAAM,eAAe,GAAG,QAAQ,GAAG,MAAM,GAAG,OAAO,GAAG,QAAQ,CAAC;AAErE;;;;;;;;;GASG;AACH,MAAM,MAAM,yBAAyB,GACjC,eAAe,GACf;IACE,IAAI,EAAE,eAAe,CAAC;IACtB,EAAE,CAAC,EAAE,eAAe,CAAC;IACrB,EAAE,CAAC,EAAE,eAAe,CAAC;IACrB,EAAE,CAAC,EAAE,eAAe,CAAC;IACrB,EAAE,CAAC,EAAE,eAAe,CAAC;CACtB,CAAC;AAEN;;;;GAIG;AACH,eAAO,MAAM,aAAa,MAAM,CAAC;AACjC,eAAO,MAAM,aAAa,MAAM,CAAC;AACjC,eAAO,MAAM,aAAa,OAAO,CAAC;AAClC,eAAO,MAAM,aAAa,OAAO,CAAC;AAUlC,qDAAqD;AACrD,eAAO,MAAM,kBAAkB,MAAM,CAAC;AAEtC,gFAAgF;AAChF,eAAO,MAAM,wBAAwB,MAAM,CAAC;AAE5C,4EAA4E;AAC5E,eAAO,MAAM,wBAAwB,MAAM,CAAC;AAE5C,6EAA6E;AAC7E,eAAO,MAAM,YAAY,KAAK,CAAC;AAE/B,yEAAyE;AACzE,eAAO,MAAM,kBAAkB,MAAM,CAAC;AAEtC,0EAA0E;AAC1E,eAAO,MAAM,wBAAwB,MAAM,CAAC;AAE5C,oEAAoE;AACpE,eAAO,MAAM,QAAQ,mCAAmC,CAAC;AAEzD,qEAAqE;AACrE,eAAO,MAAM,sBAAsB,MAAM,CAAC;AAE1C,+EAA+E;AAC/E,eAAO,MAAM,4BAA4B,gCAAgC,CAAC;AAE1E,sDAAsD;AACtD,eAAO,MAAM,YAAY,KAAK,CAAC;AAC/B,eAAO,MAAM,aAAa,IAAI,CAAC;AAC/B,eAAO,MAAM,aAAa,IAAI,CAAC;AAE/B;;;GAGG;AACH,eAAO,MAAM,qBAAqB,KAAK,CAAC;AAExC;;;;;;;GAOG;AACH,wBAAgB,oBAAoB,CAClC,SAAS,EAAE,yBAAyB,GAAG,SAAS,GAC/C,eAAe,CAcjB"}
|
|
@@ -1,4 +1,17 @@
|
|
|
1
1
|
import type { GestureResponderEvent, StyleProp, ViewStyle } from 'react-native';
|
|
2
|
+
import type { ResponsiveDialogPlacement } from './placement';
|
|
3
|
+
export type { DialogPlacement, ResponsiveDialogPlacement } from './placement';
|
|
4
|
+
/**
|
|
5
|
+
* Side-sheet inset (px) from the root overlay's edges. Lets a host place a
|
|
6
|
+
* `left`/`right` placement "inside its own shell" — e.g. offset from the top
|
|
7
|
+
* by a header, or from the anchored edge by a nav rail.
|
|
8
|
+
*/
|
|
9
|
+
export type DialogInset = {
|
|
10
|
+
top?: number;
|
|
11
|
+
bottom?: number;
|
|
12
|
+
left?: number;
|
|
13
|
+
right?: number;
|
|
14
|
+
};
|
|
2
15
|
/**
|
|
3
16
|
* Imperative open/close handle returned by `useDialogControl`.
|
|
4
17
|
*
|
|
@@ -45,7 +58,14 @@ export type DialogAction = {
|
|
|
45
58
|
/**
|
|
46
59
|
* Props accepted by the unified `<Dialog>` component.
|
|
47
60
|
*
|
|
48
|
-
*
|
|
61
|
+
* Open/close is driven by EITHER of two mutually-exclusive modes:
|
|
62
|
+
*
|
|
63
|
+
* - **Imperative `control`** (`useDialogControl()` + `control.open()` /
|
|
64
|
+
* `control.close()`). The legacy default; unchanged.
|
|
65
|
+
* - **Controlled `open`** (an `open` boolean + `onClose`). When `open` is
|
|
66
|
+
* provided it wins and `control` is ignored.
|
|
67
|
+
*
|
|
68
|
+
* Rendering modes (orthogonal to open/close mode) — pick whichever fits:
|
|
49
69
|
*
|
|
50
70
|
* 1. **Declarative (`title` / `description` / `actions`).** Most common
|
|
51
71
|
* confirm/cancel surface. Bloom renders the title, description and
|
|
@@ -57,10 +77,26 @@ export type DialogAction = {
|
|
|
57
77
|
*
|
|
58
78
|
* 3. **Imperative `alert()`.** Bypass the JSX layer entirely — see the
|
|
59
79
|
* module-level `alert()` helper.
|
|
80
|
+
*
|
|
81
|
+
* `placement` controls the surface anchor — centered modal (default), an
|
|
82
|
+
* anchored side-sheet (`left`/`right`), or a bottom-sheet (`bottom`) — and may
|
|
83
|
+
* be a responsive map that collapses to a bottom-sheet on narrow viewports.
|
|
60
84
|
*/
|
|
61
85
|
export type DialogProps = React.PropsWithChildren<{
|
|
62
|
-
|
|
63
|
-
|
|
86
|
+
/**
|
|
87
|
+
* Imperative open/close handle from `useDialogControl()`. Optional — omit it
|
|
88
|
+
* when driving the dialog with the controlled `open` prop instead.
|
|
89
|
+
*/
|
|
90
|
+
control?: DialogControlProps;
|
|
91
|
+
/**
|
|
92
|
+
* Controlled open state (opt-in). When provided, the dialog is driven by
|
|
93
|
+
* this boolean and `onClose`, and `control` is ignored.
|
|
94
|
+
*/
|
|
95
|
+
open?: boolean;
|
|
96
|
+
/**
|
|
97
|
+
* Fires after the dialog has finished closing. In controlled mode it is the
|
|
98
|
+
* close request the host must answer by flipping `open` to `false`.
|
|
99
|
+
*/
|
|
64
100
|
onClose?: () => void;
|
|
65
101
|
testID?: string;
|
|
66
102
|
/** Optional dialog header text. Rendered above `description` / `children`. */
|
|
@@ -72,11 +108,38 @@ export type DialogProps = React.PropsWithChildren<{
|
|
|
72
108
|
* confirm/cancel/destructive buttons for you. Order is preserved.
|
|
73
109
|
*/
|
|
74
110
|
actions?: DialogAction[];
|
|
111
|
+
/**
|
|
112
|
+
* Surface anchor. Defaults to `'center'` (the centered modal — current
|
|
113
|
+
* behavior). `'left'`/`'right'` render an anchored side-sheet, `'bottom'` a
|
|
114
|
+
* bottom-sheet. A responsive map resolves by viewport width, e.g.
|
|
115
|
+
* `{ base: 'bottom', md: 'left' }` (drawer on wide, sheet on narrow).
|
|
116
|
+
*/
|
|
117
|
+
placement?: ResponsiveDialogPlacement;
|
|
118
|
+
/** Side-sheet width (px) on wide screens. Defaults to `460`. */
|
|
119
|
+
width?: number;
|
|
120
|
+
/** Centered-card max width (px). Defaults to `480`. */
|
|
121
|
+
maxWidth?: number;
|
|
122
|
+
/** Bottom-sheet max height as a fraction of the viewport height. Defaults to `0.9`. */
|
|
123
|
+
maxHeightRatio?: number;
|
|
124
|
+
/** Side-sheet inset (px) from the root overlay's edges. */
|
|
125
|
+
inset?: DialogInset;
|
|
126
|
+
/** Whether to render the drag handle in bottom-sheet mode. Defaults to `true`. */
|
|
127
|
+
showHandle?: boolean;
|
|
128
|
+
/** Whether tapping the backdrop dismisses the dialog. Defaults to `true`. */
|
|
129
|
+
dismissOnBackdrop?: boolean;
|
|
75
130
|
/**
|
|
76
131
|
* Style overrides applied to the inner content container on native (the
|
|
77
132
|
* floating bottom-sheet card) and to the modal panel on web.
|
|
78
133
|
*/
|
|
79
134
|
style?: StyleProp<ViewStyle>;
|
|
135
|
+
/** Style overrides for the side/bottom placement panel surface. */
|
|
136
|
+
panelStyle?: StyleProp<ViewStyle>;
|
|
137
|
+
/** NativeWind classes for the side/bottom placement panel surface. */
|
|
138
|
+
panelClassName?: string;
|
|
139
|
+
/** Style for the root overlay (theme-var scope, rail offset, etc.). */
|
|
140
|
+
containerStyle?: StyleProp<ViewStyle>;
|
|
141
|
+
/** NativeWind classes for the root overlay (e.g. `"md:left-[4.75rem]"`). */
|
|
142
|
+
containerClassName?: string;
|
|
80
143
|
/** Accessibility label, applied to the dialog role on web. */
|
|
81
144
|
label?: string;
|
|
82
145
|
}>;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/dialog/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,qBAAqB,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAEhF;;;;;;;GAOG;AACH,MAAM,MAAM,qBAAqB,GAAG;IAClC,IAAI,EAAE,MAAM,IAAI,CAAC;IACjB,KAAK,EAAE,CAAC,QAAQ,CAAC,EAAE,MAAM,IAAI,KAAK,IAAI,CAAC;CACxC,CAAC;AAEF,MAAM,MAAM,kBAAkB,GAAG,qBAAqB,GAAG;IACvD,EAAE,EAAE,MAAM,CAAC;IACX,GAAG,EAAE,KAAK,CAAC,SAAS,CAAC,qBAAqB,GAAG,IAAI,CAAC,CAAC;CACpD,CAAC;AAEF,MAAM,MAAM,kBAAkB,GAAG;IAC/B,KAAK,EAAE,kBAAkB,CAAC,OAAO,CAAC,CAAC;IACnC,cAAc,EAAE,OAAO,CAAC;CACzB,CAAC;AAEF;;;;;;GAMG;AACH,MAAM,MAAM,iBAAiB,GAAG,SAAS,GAAG,QAAQ,GAAG,aAAa,CAAC;AAErE,MAAM,MAAM,YAAY,GAAG;IACzB,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,CAAC,CAAC,EAAE,qBAAqB,KAAK,IAAI,CAAC;IAC7C,KAAK,CAAC,EAAE,iBAAiB,CAAC;IAC1B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;;;;OAMG;IACH,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB,CAAC;AAEF
|
|
1
|
+
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/dialog/types.ts"],"names":[],"mappings":"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"}
|
|
@@ -9,8 +9,8 @@ export { useThrottledValue } from './hooks/useThrottledValue';
|
|
|
9
9
|
export * as Icons from './icons';
|
|
10
10
|
export { type Props as IconProps, sizes as iconSizes, useCommonSVGProps } from './icons/common';
|
|
11
11
|
export * from './portal';
|
|
12
|
-
export { Dialog,
|
|
13
|
-
export type { AlertButton, AlertButtonStyle,
|
|
12
|
+
export { Dialog, DIALOG_SHEET_BACKDROP_TESTID, BloomDialogProvider, alert, useDialogContext, useDialogControl, } from './dialog';
|
|
13
|
+
export type { AlertButton, AlertButtonStyle, DialogAction, DialogActionColor, DialogContextProps, DialogControlProps, DialogInset, DialogPlacement, DialogProps, ResponsiveDialogPlacement, } from './dialog';
|
|
14
14
|
export * from './button';
|
|
15
15
|
export { Fab } from './fab';
|
|
16
16
|
export type { FabProps, FabVariant, FabSize, FabPlacement } from './fab';
|
|
@@ -49,8 +49,6 @@ export { Combobox } from './combobox';
|
|
|
49
49
|
export type { ComboboxProps, ComboboxOption } from './combobox';
|
|
50
50
|
export { BottomSheet } from './bottom-sheet';
|
|
51
51
|
export type { BottomSheetRef, BottomSheetProps } from './bottom-sheet';
|
|
52
|
-
export { ResponsiveSheet, RESPONSIVE_SHEET_BACKDROP_TESTID } from './responsive-sheet';
|
|
53
|
-
export type { ResponsiveSheetProps, ResponsiveSheetSide, ResponsiveSheetInset, } from './responsive-sheet';
|
|
54
52
|
export * from './card';
|
|
55
53
|
export * from './badge';
|
|
56
54
|
export * from './chip';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/index.ts"],"names":[],"mappings":"AACA,cAAc,SAAS,CAAC;AAGxB,OAAO,EAAE,KAAK,EAAE,OAAO,EAAE,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAC3D,YAAY,EAAE,aAAa,EAAE,aAAa,EAAE,MAAM,UAAU,CAAC;AAC7D,OAAO,KAAK,MAAM,MAAM,iBAAiB,CAAC;AAC1C,OAAO,EAAE,GAAG,EAAE,MAAM,EAAE,GAAG,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,EAAE,MAAM,mBAAmB,CAAC;AAGhF,OAAO,EAAE,mBAAmB,EAAE,MAAM,6BAA6B,CAAC;AAClE,OAAO,EAAE,iBAAiB,EAAE,MAAM,2BAA2B,CAAC;AAC9D,OAAO,EAAE,iBAAiB,EAAE,MAAM,2BAA2B,CAAC;AAG9D,OAAO,KAAK,KAAK,MAAM,SAAS,CAAC;AACjC,OAAO,EAAE,KAAK,KAAK,IAAI,SAAS,EAAE,KAAK,IAAI,SAAS,EAAE,iBAAiB,EAAE,MAAM,gBAAgB,CAAC;AAGhG,cAAc,UAAU,CAAC;AACzB,OAAO,EACL,MAAM,EACN,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/index.ts"],"names":[],"mappings":"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"}
|
|
@@ -9,8 +9,8 @@ export { useThrottledValue } from './hooks/useThrottledValue';
|
|
|
9
9
|
export * as Icons from './icons';
|
|
10
10
|
export { type Props as IconProps, sizes as iconSizes, useCommonSVGProps } from './icons/common';
|
|
11
11
|
export * from './portal/index.web';
|
|
12
|
-
export { Dialog,
|
|
13
|
-
export type { AlertButton, AlertButtonStyle,
|
|
12
|
+
export { Dialog, DIALOG_SHEET_BACKDROP_TESTID, BloomDialogProvider, alert, useDialogContext, useDialogControl, } from './dialog/index.web';
|
|
13
|
+
export type { AlertButton, AlertButtonStyle, DialogAction, DialogActionColor, DialogContextProps, DialogControlProps, DialogInset, DialogPlacement, DialogProps, ResponsiveDialogPlacement, } from './dialog/index.web';
|
|
14
14
|
export * from './button/index.web';
|
|
15
15
|
export { Fab } from './fab/index.web';
|
|
16
16
|
export type { FabProps, FabVariant, FabSize, FabPlacement } from './fab/index.web';
|
|
@@ -49,8 +49,6 @@ export { Combobox } from './combobox/index.web';
|
|
|
49
49
|
export type { ComboboxProps, ComboboxOption } from './combobox/index.web';
|
|
50
50
|
export { BottomSheet } from './bottom-sheet';
|
|
51
51
|
export type { BottomSheetRef, BottomSheetProps } from './bottom-sheet';
|
|
52
|
-
export { ResponsiveSheet, RESPONSIVE_SHEET_BACKDROP_TESTID } from './responsive-sheet/index.web';
|
|
53
|
-
export type { ResponsiveSheetProps, ResponsiveSheetSide, ResponsiveSheetInset, } from './responsive-sheet/index.web';
|
|
54
52
|
export * from './card';
|
|
55
53
|
export * from './badge';
|
|
56
54
|
export * from './chip';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.web.d.ts","sourceRoot":"","sources":["../../../src/index.web.ts"],"names":[],"mappings":"AAMA,cAAc,SAAS,CAAC;AAGxB,OAAO,EAAE,KAAK,EAAE,OAAO,EAAE,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAC3D,YAAY,EAAE,aAAa,EAAE,aAAa,EAAE,MAAM,UAAU,CAAC;AAC7D,OAAO,KAAK,MAAM,MAAM,iBAAiB,CAAC;AAC1C,OAAO,EAAE,GAAG,EAAE,MAAM,EAAE,GAAG,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,EAAE,MAAM,mBAAmB,CAAC;AAGhF,OAAO,EAAE,mBAAmB,EAAE,MAAM,6BAA6B,CAAC;AAClE,OAAO,EAAE,iBAAiB,EAAE,MAAM,2BAA2B,CAAC;AAC9D,OAAO,EAAE,iBAAiB,EAAE,MAAM,2BAA2B,CAAC;AAG9D,OAAO,KAAK,KAAK,MAAM,SAAS,CAAC;AACjC,OAAO,EAAE,KAAK,KAAK,IAAI,SAAS,EAAE,KAAK,IAAI,SAAS,EAAE,iBAAiB,EAAE,MAAM,gBAAgB,CAAC;AAGhG,cAAc,oBAAoB,CAAC;AACnC,OAAO,EACL,MAAM,EACN,
|
|
1
|
+
{"version":3,"file":"index.web.d.ts","sourceRoot":"","sources":["../../../src/index.web.ts"],"names":[],"mappings":"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"}
|
|
@@ -1,21 +1,22 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import type {
|
|
2
|
+
import type { DialogProps } from '../dialog';
|
|
3
3
|
import type { AlertDialogProps } from './types';
|
|
4
|
-
type
|
|
4
|
+
type DialogComponent = React.ComponentType<DialogProps>;
|
|
5
5
|
/**
|
|
6
|
-
* Build the `AlertDialog` component bound to a platform `
|
|
6
|
+
* Build the `AlertDialog` component bound to a platform `Dialog`.
|
|
7
7
|
*
|
|
8
|
-
* `
|
|
9
|
-
* overlay), and this repo never
|
|
10
|
-
*
|
|
11
|
-
* `
|
|
8
|
+
* `Dialog` is platform-forked (native `BottomSheet`-backed surface vs pure-DOM
|
|
9
|
+
* web overlay) through its `./dialog` export conditions, and this repo never
|
|
10
|
+
* relies on implicit `.web` resolution — the platform entry files
|
|
11
|
+
* (`index.ts` / `index.web.ts`) inject the correct `Dialog` here. The body
|
|
12
|
+
* below is single-source, no duplication.
|
|
12
13
|
*
|
|
13
|
-
* `AlertDialog` is a thin wrapper over
|
|
14
|
-
* description and a confirm/cancel action row. Reach for the
|
|
15
|
-
* `confirm()` helper + `<AlertDialogHost />` to trigger a confirm
|
|
16
|
-
* event handler without owning visible state.
|
|
14
|
+
* `AlertDialog` is a thin wrapper over `<Dialog placement="center">` that lays
|
|
15
|
+
* out a title, description and a confirm/cancel action row. Reach for the
|
|
16
|
+
* imperative `confirm()` helper + `<AlertDialogHost />` to trigger a confirm
|
|
17
|
+
* from an event handler without owning visible state.
|
|
17
18
|
*/
|
|
18
|
-
export declare function createAlertDialog(
|
|
19
|
+
export declare function createAlertDialog(Dialog: DialogComponent): React.MemoExoticComponent<({ visible, onClose, title, description, confirmLabel, cancelLabel, onConfirm, onCancel, destructive, hideCancel, dismissible, cardStyle, testID, }: AlertDialogProps) => import("react/jsx-runtime").JSX.Element>;
|
|
19
20
|
export type AlertDialogType = ReturnType<typeof createAlertDialog>;
|
|
20
21
|
export {};
|
|
21
22
|
//# sourceMappingURL=AlertDialog.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AlertDialog.d.ts","sourceRoot":"","sources":["../../../../src/alert-dialog/AlertDialog.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA4B,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"AlertDialog.d.ts","sourceRoot":"","sources":["../../../../src/alert-dialog/AlertDialog.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA4B,MAAM,OAAO,CAAC;AAIjD,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,WAAW,CAAC;AAI7C,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,SAAS,CAAC;AAEhD,KAAK,eAAe,GAAG,KAAK,CAAC,aAAa,CAAC,WAAW,CAAC,CAAC;AAKxD;;;;;;;;;;;;;GAaG;AACH,wBAAgB,iBAAiB,CAAC,MAAM,EAAE,eAAe,kLAepD,gBAAgB,8CAwEpB;AAED,MAAM,MAAM,eAAe,GAAG,UAAU,CAAC,OAAO,iBAAiB,CAAC,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/alert-dialog/index.ts"],"names":[],"mappings":"AAIA,eAAO,MAAM,WAAW,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/alert-dialog/index.ts"],"names":[],"mappings":"AAIA,eAAO,MAAM,WAAW,0QAA4B,CAAC;AACrD,eAAO,MAAM,eAAe;;;CAAqC,CAAC;AAElE,OAAO,EAAE,OAAO,EAAE,MAAM,iBAAiB,CAAC;AAC1C,YAAY,EACV,gBAAgB,EAChB,sBAAsB,EACtB,cAAc,GACf,MAAM,SAAS,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.web.d.ts","sourceRoot":"","sources":["../../../../src/alert-dialog/index.web.ts"],"names":[],"mappings":"AAIA,eAAO,MAAM,WAAW,
|
|
1
|
+
{"version":3,"file":"index.web.d.ts","sourceRoot":"","sources":["../../../../src/alert-dialog/index.web.ts"],"names":[],"mappings":"AAIA,eAAO,MAAM,WAAW,0QAA4B,CAAC;AACrD,eAAO,MAAM,eAAe;;;CAAqC,CAAC;AAElE,OAAO,EAAE,OAAO,EAAE,MAAM,iBAAiB,CAAC;AAC1C,YAAY,EACV,gBAAgB,EAChB,sBAAsB,EACtB,cAAc,GACf,MAAM,SAAS,CAAC"}
|
|
@@ -1,19 +1,19 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import type {
|
|
2
|
+
import type { DialogProps } from '../dialog';
|
|
3
3
|
import type { CommandProps } from './types';
|
|
4
|
-
type
|
|
4
|
+
type DialogComponent = React.ComponentType<DialogProps>;
|
|
5
5
|
/**
|
|
6
|
-
* Build the `Command` palette bound to a platform `
|
|
7
|
-
*
|
|
8
|
-
*
|
|
9
|
-
* implicit `.web` resolution. The body is single-source.
|
|
6
|
+
* Build the `Command` palette bound to a platform `Dialog`. The platform entry
|
|
7
|
+
* files (`index.ts` / `index.web.ts`) inject the correct one (native
|
|
8
|
+
* `BottomSheet`-backed surface vs pure-DOM web overlay) — this repo never
|
|
9
|
+
* relies on implicit `.web` resolution. The body is single-source.
|
|
10
10
|
*
|
|
11
|
-
* `Command` is a ⌘K command palette built on
|
|
11
|
+
* `Command` is a ⌘K command palette built on `<Dialog placement="center">`,
|
|
12
12
|
* `SearchInput`, an `Item` results list and `Kbd` shortcut hints. Items group
|
|
13
13
|
* by their `group` field (ungrouped first). On web the list is
|
|
14
14
|
* keyboard-navigable (Up/Down/Enter); on native, tap to select.
|
|
15
15
|
*/
|
|
16
|
-
export declare function createCommand(
|
|
16
|
+
export declare function createCommand(Dialog: DialogComponent): {
|
|
17
17
|
({ visible, onClose, items, placeholder, emptyText, query: queryProp, onQueryChange, filter, maxListHeight, style, testID, }: CommandProps): import("react/jsx-runtime").JSX.Element;
|
|
18
18
|
displayName: string;
|
|
19
19
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Command.d.ts","sourceRoot":"","sources":["../../../../src/command/Command.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAiD,MAAM,OAAO,CAAC;AAgBtE,OAAO,KAAK,EAAE,
|
|
1
|
+
{"version":3,"file":"Command.d.ts","sourceRoot":"","sources":["../../../../src/command/Command.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAiD,MAAM,OAAO,CAAC;AAgBtE,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,WAAW,CAAC;AAC7C,OAAO,KAAK,EAAe,YAAY,EAAE,MAAM,SAAS,CAAC;AAEzD,KAAK,eAAe,GAAG,KAAK,CAAC,aAAa,CAAC,WAAW,CAAC,CAAC;AAqBxD;;;;;;;;;;GAUG;AACH,wBAAgB,aAAa,CAAC,MAAM,EAAE,eAAe;kIAahD,YAAY;;EA2LhB;AAED,MAAM,MAAM,WAAW,GAAG,UAAU,CAAC,OAAO,aAAa,CAAC,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/command/index.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,OAAO;;;
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/command/index.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,OAAO;;;CAAwB,CAAC;AAE7C,YAAY,EAAE,YAAY,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.web.d.ts","sourceRoot":"","sources":["../../../../src/command/index.web.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,OAAO;;;
|
|
1
|
+
{"version":3,"file":"index.web.d.ts","sourceRoot":"","sources":["../../../../src/command/index.web.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,OAAO;;;CAAwB,CAAC;AAE7C,YAAY,EAAE,YAAY,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC"}
|
|
@@ -1,26 +1,28 @@
|
|
|
1
|
+
import { DIALOG_SHEET_BACKDROP_TESTID } from './placement';
|
|
1
2
|
import type { DialogAction, DialogProps } from './types';
|
|
3
|
+
export { DIALOG_SHEET_BACKDROP_TESTID };
|
|
2
4
|
/**
|
|
3
5
|
* Native variant of `<Dialog>`.
|
|
4
6
|
*
|
|
5
|
-
*
|
|
6
|
-
*
|
|
7
|
-
* gracefully degrades from sheet (phone) to centered card (tablet, via the
|
|
8
|
-
* 500px max-width cap).
|
|
7
|
+
* Open/close is driven by EITHER the imperative `control` (legacy) OR the
|
|
8
|
+
* controlled `open` prop. When `open` is provided it wins.
|
|
9
9
|
*
|
|
10
|
-
*
|
|
10
|
+
* `placement` selects the surface:
|
|
11
|
+
*
|
|
12
|
+
* - `'center'` (default) / `'bottom'` — bloom's `BottomSheet` (`detached`
|
|
13
|
+
* for center: a floating, content-hugging card that degrades from sheet to
|
|
14
|
+
* centered card via the 500px cap; flush for bottom: a full-width sheet
|
|
15
|
+
* with a drag handle). Default behavior is unchanged.
|
|
16
|
+
* - `'left'` / `'right'` — an anchored side-sheet/drawer driven by
|
|
17
|
+
* reanimated. Exit animations are safe on native.
|
|
11
18
|
*
|
|
12
|
-
*
|
|
13
|
-
* standard confirm/destructive/cancel layout.
|
|
14
|
-
* 2. Custom children — caller passes JSX, bloom renders the chrome (title
|
|
15
|
-
* + close behaviour) and the children fill the body.
|
|
16
|
-
* 3. Pure children — no `title`/`description`/`actions`; caller owns
|
|
17
|
-
* every pixel.
|
|
19
|
+
* The component accepts three rendering modes simultaneously:
|
|
18
20
|
*
|
|
19
|
-
*
|
|
20
|
-
*
|
|
21
|
-
*
|
|
21
|
+
* 1. Declarative — `title`, `description`, `actions`.
|
|
22
|
+
* 2. Custom children — caller passes JSX, bloom renders the chrome.
|
|
23
|
+
* 3. Pure children — no `title`/`description`/`actions`.
|
|
22
24
|
*/
|
|
23
|
-
export declare function Dialog({ control, onClose, testID, title, description, actions, style, label, children, }: DialogProps): import("react/jsx-runtime").JSX.Element;
|
|
25
|
+
export declare function Dialog({ control, open: controlledOpen, onClose, testID, title, description, actions, placement, width, maxHeightRatio, inset, showHandle, dismissOnBackdrop, style, panelStyle, panelClassName, containerStyle, containerClassName, label, children, }: DialogProps): import("react/jsx-runtime").JSX.Element;
|
|
24
26
|
/**
|
|
25
27
|
* Helper used by the imperative `alert()` API. Mounts a `<Dialog>` against
|
|
26
28
|
* a fresh control and presents it immediately. `onResolve` is invoked
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Dialog.d.ts","sourceRoot":"","sources":["../../../../src/dialog/Dialog.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"Dialog.d.ts","sourceRoot":"","sources":["../../../../src/dialog/Dialog.tsx"],"names":[],"mappings":"AAkCA,OAAO,EAIL,4BAA4B,EAK7B,MAAM,aAAa,CAAC;AACrB,OAAO,KAAK,EACV,YAAY,EAIZ,WAAW,EACZ,MAAM,SAAS,CAAC;AAEjB,OAAO,EAAE,4BAA4B,EAAE,CAAC;AAExC;;;;;;;;;;;;;;;;;;;;GAoBG;AACH,wBAAgB,MAAM,CAAC,EACrB,OAAO,EACP,IAAI,EAAE,cAAc,EACpB,OAAO,EACP,MAAM,EACN,KAAK,EACL,WAAW,EACX,OAAO,EACP,SAAS,EACT,KAA0B,EAC1B,cAAyC,EACzC,KAAK,EACL,UAAiB,EACjB,iBAAwB,EACxB,KAAK,EACL,UAAU,EACV,cAAc,EACd,cAAc,EACd,kBAAkB,EAClB,KAAK,EACL,QAAQ,GACT,EAAE,WAAW,2CAwLb;AAuVD;;;;;;;GAOG;AACH,wBAAgB,iBAAiB,CAAC,EAChC,KAAK,EACL,WAAW,EACX,OAAO,EACP,SAAS,GACV,EAAE;IACD,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,OAAO,EAAE,YAAY,EAAE,CAAC;IACxB,SAAS,EAAE,MAAM,IAAI,CAAC;CACvB,2CAoBA"}
|
|
@@ -1,18 +1,28 @@
|
|
|
1
|
+
import { DIALOG_SHEET_BACKDROP_TESTID } from './placement';
|
|
1
2
|
import type { DialogAction, DialogProps } from './types';
|
|
2
3
|
/**
|
|
3
4
|
* Web variant of `<Dialog>`.
|
|
4
5
|
*
|
|
5
|
-
* A centered modal card rendered into the bloom Portal at the end of
|
|
6
|
-
* `document.body
|
|
7
|
-
*
|
|
8
|
-
* agnostic.
|
|
6
|
+
* A centered modal card (default) rendered into the bloom Portal at the end of
|
|
7
|
+
* `document.body`, or — when `placement` is `left`/`right`/`bottom` — an
|
|
8
|
+
* anchored side-sheet or bottom-sheet. Same prop API as native, so call sites
|
|
9
|
+
* are platform agnostic.
|
|
10
|
+
*
|
|
11
|
+
* Open/close is driven by EITHER the imperative `control` (legacy) OR the
|
|
12
|
+
* controlled `open` prop. When `open` is provided it wins.
|
|
9
13
|
*
|
|
10
14
|
* Accessibility: the panel has `role="dialog"` and the `title`/`description`
|
|
11
15
|
* props (when provided) become the `aria-labelledby` / `aria-describedby`
|
|
12
16
|
* targets. Pressing the backdrop dismisses. Pressing `Escape` dismisses.
|
|
13
17
|
* Focus is locked inside the dialog while it's open.
|
|
18
|
+
*
|
|
19
|
+
* Web motion never uses reanimated `exiting` (which throws `removeChild` on
|
|
20
|
+
* concurrent React unmounts): the centered card uses CSS keyframes and the
|
|
21
|
+
* side/bottom modes use self-contained CSS transitions on a
|
|
22
|
+
* mounted-through-exit node.
|
|
14
23
|
*/
|
|
15
|
-
export declare function Dialog({ control, onClose, testID, title, description, actions, style, label, children, }: DialogProps): import("react/jsx-runtime").JSX.Element | null;
|
|
24
|
+
export declare function Dialog({ control, open: controlledOpen, onClose, testID, title, description, actions, placement, width, maxWidth, maxHeightRatio, inset, showHandle, dismissOnBackdrop, style, panelStyle, panelClassName, containerStyle, containerClassName, label, children, }: DialogProps): import("react/jsx-runtime").JSX.Element | null;
|
|
25
|
+
export { DIALOG_SHEET_BACKDROP_TESTID };
|
|
16
26
|
/**
|
|
17
27
|
* Inline imperative dialog used by `alert()`. Mounts and immediately
|
|
18
28
|
* presents; resolves the host's `onResolve` once the dialog has finished
|
|
@@ -34,6 +44,9 @@ export declare function AutoMountedDialog({ title, description, actions, onResol
|
|
|
34
44
|
* @keyframes bloomDialogZoomFadeIn { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }
|
|
35
45
|
* @keyframes bloomDialogZoomFadeOut { from { opacity: 1; transform: scale(1); } to { opacity: 0; transform: scale(0.95); } }
|
|
36
46
|
* ```
|
|
47
|
+
*
|
|
48
|
+
* The `left`/`right`/`bottom` placements do NOT depend on this — they animate
|
|
49
|
+
* via self-contained inline CSS transitions and need no keyframe injection.
|
|
37
50
|
*/
|
|
38
51
|
export declare const BLOOM_DIALOG_CSS = "\n@keyframes bloomDialogFadeIn { from { opacity: 0; } to { opacity: 1; } }\n@keyframes bloomDialogFadeOut { from { opacity: 1; } to { opacity: 0; } }\n@keyframes bloomDialogZoomFadeIn { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }\n@keyframes bloomDialogZoomFadeOut { from { opacity: 1; transform: scale(1); } to { opacity: 0; transform: scale(0.95); } }\n";
|
|
39
52
|
//# sourceMappingURL=Dialog.web.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Dialog.web.d.ts","sourceRoot":"","sources":["../../../../src/dialog/Dialog.web.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"Dialog.web.d.ts","sourceRoot":"","sources":["../../../../src/dialog/Dialog.web.tsx"],"names":[],"mappings":"AA2BA,OAAO,EAML,4BAA4B,EAU7B,MAAM,aAAa,CAAC;AACrB,OAAO,KAAK,EACV,YAAY,EAIZ,WAAW,EACZ,MAAM,SAAS,CAAC;AASjB;;;;;;;;;;;;;;;;;;;;GAoBG;AACH,wBAAgB,MAAM,CAAC,EACrB,OAAO,EACP,IAAI,EAAE,cAAc,EACpB,OAAO,EACP,MAAM,EACN,KAAK,EACL,WAAW,EACX,OAAO,EACP,SAAS,EACT,KAA0B,EAC1B,QAAmC,EACnC,cAAyC,EACzC,KAAK,EACL,UAAiB,EACjB,iBAAwB,EACxB,KAAK,EACL,UAAU,EACV,cAAc,EACd,cAAc,EACd,kBAAkB,EAClB,KAAK,EACL,QAAQ,GACT,EAAE,WAAW,kDA6Lb;AAkID,OAAO,EAAE,4BAA4B,EAAE,CAAC;AAyTxC;;;;GAIG;AACH,wBAAgB,iBAAiB,CAAC,EAChC,KAAK,EACL,WAAW,EACX,OAAO,EACP,SAAS,GACV,EAAE;IACD,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,OAAO,EAAE,YAAY,EAAE,CAAC;IACxB,SAAS,EAAE,MAAM,IAAI,CAAC;CACvB,2CAgBA;AA4CD;;;;;;;;;;;;;GAaG;AACH,eAAO,MAAM,gBAAgB,mZAK5B,CAAC"}
|
|
@@ -1,9 +1,7 @@
|
|
|
1
|
-
export { Dialog } from './Dialog';
|
|
2
|
-
export { CenteredDialog, CENTERED_DIALOG_BACKDROP_TESTID } from './CenteredDialog';
|
|
1
|
+
export { Dialog, DIALOG_SHEET_BACKDROP_TESTID } from './Dialog';
|
|
3
2
|
export { BloomDialogProvider } from './BloomDialogProvider';
|
|
4
3
|
export { alert } from './alert';
|
|
5
4
|
export { useDialogContext, useDialogControl } from './context';
|
|
6
5
|
export type { AlertButton, AlertButtonStyle, } from './alert-store';
|
|
7
|
-
export type { DialogAction, DialogActionColor, DialogContextProps, DialogControlProps, DialogProps, } from './types';
|
|
8
|
-
export type { CenteredDialogProps } from './centered-dialog-types';
|
|
6
|
+
export type { DialogAction, DialogActionColor, DialogContextProps, DialogControlProps, DialogInset, DialogPlacement, DialogProps, ResponsiveDialogPlacement, } from './types';
|
|
9
7
|
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/dialog/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/dialog/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,4BAA4B,EAAE,MAAM,UAAU,CAAC;AAChE,OAAO,EAAE,mBAAmB,EAAE,MAAM,uBAAuB,CAAC;AAC5D,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAC;AAChC,OAAO,EAAE,gBAAgB,EAAE,gBAAgB,EAAE,MAAM,WAAW,CAAC;AAC/D,YAAY,EACV,WAAW,EACX,gBAAgB,GACjB,MAAM,eAAe,CAAC;AACvB,YAAY,EACV,YAAY,EACZ,iBAAiB,EACjB,kBAAkB,EAClB,kBAAkB,EAClB,WAAW,EACX,eAAe,EACf,WAAW,EACX,yBAAyB,GAC1B,MAAM,SAAS,CAAC"}
|
|
@@ -1,9 +1,7 @@
|
|
|
1
|
-
export { Dialog, BLOOM_DIALOG_CSS } from './Dialog.web';
|
|
2
|
-
export { CenteredDialog, BLOOM_CENTERED_DIALOG_CSS, CENTERED_DIALOG_BACKDROP_TESTID, } from './CenteredDialog.web';
|
|
1
|
+
export { Dialog, BLOOM_DIALOG_CSS, DIALOG_SHEET_BACKDROP_TESTID } from './Dialog.web';
|
|
3
2
|
export { BloomDialogProvider } from './BloomDialogProvider.web';
|
|
4
3
|
export { alert } from './alert';
|
|
5
4
|
export { useDialogContext, useDialogControl } from './context';
|
|
6
5
|
export type { AlertButton, AlertButtonStyle, } from './alert-store';
|
|
7
|
-
export type { DialogAction, DialogActionColor, DialogContextProps, DialogControlProps, DialogProps, } from './types';
|
|
8
|
-
export type { CenteredDialogProps } from './centered-dialog-types';
|
|
6
|
+
export type { DialogAction, DialogActionColor, DialogContextProps, DialogControlProps, DialogInset, DialogPlacement, DialogProps, ResponsiveDialogPlacement, } from './types';
|
|
9
7
|
//# sourceMappingURL=index.web.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.web.d.ts","sourceRoot":"","sources":["../../../../src/dialog/index.web.ts"],"names":[],"mappings":"AAUA,OAAO,EAAE,MAAM,EAAE,gBAAgB,EAAE,
|
|
1
|
+
{"version":3,"file":"index.web.d.ts","sourceRoot":"","sources":["../../../../src/dialog/index.web.ts"],"names":[],"mappings":"AAUA,OAAO,EAAE,MAAM,EAAE,gBAAgB,EAAE,4BAA4B,EAAE,MAAM,cAAc,CAAC;AACtF,OAAO,EAAE,mBAAmB,EAAE,MAAM,2BAA2B,CAAC;AAChE,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAC;AAChC,OAAO,EAAE,gBAAgB,EAAE,gBAAgB,EAAE,MAAM,WAAW,CAAC;AAC/D,YAAY,EACV,WAAW,EACX,gBAAgB,GACjB,MAAM,eAAe,CAAC;AACvB,YAAY,EACV,YAAY,EACZ,iBAAiB,EACjB,kBAAkB,EAClB,kBAAkB,EAClB,WAAW,EACX,eAAe,EACf,WAAW,EACX,yBAAyB,GAC1B,MAAM,SAAS,CAAC"}
|
|
@@ -0,0 +1,71 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Anchor a `<Dialog>` can render against.
|
|
3
|
+
*
|
|
4
|
+
* - `'center'` — the default centered modal card (current behavior).
|
|
5
|
+
* - `'left'` / `'right'` — an anchored side-sheet / drawer.
|
|
6
|
+
* - `'bottom'` — a bottom-sheet (drag handle, slide-up).
|
|
7
|
+
*/
|
|
8
|
+
export type DialogPlacement = 'center' | 'left' | 'right' | 'bottom';
|
|
9
|
+
/**
|
|
10
|
+
* A `<Dialog>` placement that may vary by viewport width.
|
|
11
|
+
*
|
|
12
|
+
* Either a single `DialogPlacement` (applied at every width) or a responsive
|
|
13
|
+
* map whose `base` applies below the first breakpoint and whose `sm`/`md`/`lg`/
|
|
14
|
+
* `xl` keys override it at and above the matching Tailwind breakpoint.
|
|
15
|
+
*
|
|
16
|
+
* The common store-drawer case is `{ base: 'bottom', md: 'left' }`; the common
|
|
17
|
+
* dialog-to-sheet case is `{ base: 'bottom', md: 'center' }`.
|
|
18
|
+
*/
|
|
19
|
+
export type ResponsiveDialogPlacement = DialogPlacement | {
|
|
20
|
+
base: DialogPlacement;
|
|
21
|
+
sm?: DialogPlacement;
|
|
22
|
+
md?: DialogPlacement;
|
|
23
|
+
lg?: DialogPlacement;
|
|
24
|
+
xl?: DialogPlacement;
|
|
25
|
+
};
|
|
26
|
+
/**
|
|
27
|
+
* Tailwind-default breakpoints (px). A responsive `placement` map resolves to
|
|
28
|
+
* the value for the largest key whose min-width is `<=` the current viewport
|
|
29
|
+
* width, falling back to `base`.
|
|
30
|
+
*/
|
|
31
|
+
export declare const BREAKPOINT_SM = 640;
|
|
32
|
+
export declare const BREAKPOINT_MD = 768;
|
|
33
|
+
export declare const BREAKPOINT_LG = 1024;
|
|
34
|
+
export declare const BREAKPOINT_XL = 1280;
|
|
35
|
+
/** Default side-sheet width (px) on wide screens. */
|
|
36
|
+
export declare const DEFAULT_SIDE_WIDTH = 460;
|
|
37
|
+
/** Default centered-card max width (px). Matches the legacy `maxWidth: 480`. */
|
|
38
|
+
export declare const DEFAULT_CENTER_MAX_WIDTH = 480;
|
|
39
|
+
/** Default bottom-sheet max height as a fraction of the viewport height. */
|
|
40
|
+
export declare const DEFAULT_MAX_HEIGHT_RATIO = 0.9;
|
|
41
|
+
/** Corner radius shared by the side-sheet panel and the bottom-sheet top. */
|
|
42
|
+
export declare const PANEL_RADIUS = 20;
|
|
43
|
+
/** Open/close transition duration (ms). ~280ms ease-out reads smooth. */
|
|
44
|
+
export declare const ANIMATION_DURATION = 280;
|
|
45
|
+
/** Centered-card fade-out duration (ms) — preserves the legacy timing. */
|
|
46
|
+
export declare const CENTER_FADE_OUT_DURATION = 150;
|
|
47
|
+
/** CSS approximation of reanimated's `Easing.out(Easing.cubic)`. */
|
|
48
|
+
export declare const EASE_OUT = "cubic-bezier(0.33, 1, 0.68, 1)";
|
|
49
|
+
/** Backdrop dim opacity once fully shown (matches `bg-black/40`). */
|
|
50
|
+
export declare const SHEET_BACKDROP_OPACITY = 0.4;
|
|
51
|
+
/** Stable testID for the dimmed backdrop of a side/bottom placement dialog. */
|
|
52
|
+
export declare const DIALOG_SHEET_BACKDROP_TESTID = "bloom-dialog-sheet-backdrop";
|
|
53
|
+
/** Drag-handle pill geometry for the bottom-sheet. */
|
|
54
|
+
export declare const HANDLE_WIDTH = 36;
|
|
55
|
+
export declare const HANDLE_HEIGHT = 5;
|
|
56
|
+
export declare const HANDLE_RADIUS = 3;
|
|
57
|
+
/**
|
|
58
|
+
* Minimum gutter kept between a wide side-sheet and the opposite viewport edge
|
|
59
|
+
* when capping its width, so the panel never spans the full screen.
|
|
60
|
+
*/
|
|
61
|
+
export declare const SIDE_SHEET_MIN_GUTTER = 24;
|
|
62
|
+
/**
|
|
63
|
+
* Resolve a (possibly responsive) `placement` to a concrete `DialogPlacement`
|
|
64
|
+
* for the current viewport width.
|
|
65
|
+
*
|
|
66
|
+
* A plain string placement resolves to itself. A responsive map picks the
|
|
67
|
+
* value for the largest breakpoint key whose min-width is `<=` the viewport
|
|
68
|
+
* width, falling back to `base` below the first breakpoint.
|
|
69
|
+
*/
|
|
70
|
+
export declare function useResolvedPlacement(placement: ResponsiveDialogPlacement | undefined): DialogPlacement;
|
|
71
|
+
//# sourceMappingURL=placement.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"placement.d.ts","sourceRoot":"","sources":["../../../../src/dialog/placement.ts"],"names":[],"mappings":"AAGA;;;;;;GAMG;AACH,MAAM,MAAM,eAAe,GAAG,QAAQ,GAAG,MAAM,GAAG,OAAO,GAAG,QAAQ,CAAC;AAErE;;;;;;;;;GASG;AACH,MAAM,MAAM,yBAAyB,GACjC,eAAe,GACf;IACE,IAAI,EAAE,eAAe,CAAC;IACtB,EAAE,CAAC,EAAE,eAAe,CAAC;IACrB,EAAE,CAAC,EAAE,eAAe,CAAC;IACrB,EAAE,CAAC,EAAE,eAAe,CAAC;IACrB,EAAE,CAAC,EAAE,eAAe,CAAC;CACtB,CAAC;AAEN;;;;GAIG;AACH,eAAO,MAAM,aAAa,MAAM,CAAC;AACjC,eAAO,MAAM,aAAa,MAAM,CAAC;AACjC,eAAO,MAAM,aAAa,OAAO,CAAC;AAClC,eAAO,MAAM,aAAa,OAAO,CAAC;AAUlC,qDAAqD;AACrD,eAAO,MAAM,kBAAkB,MAAM,CAAC;AAEtC,gFAAgF;AAChF,eAAO,MAAM,wBAAwB,MAAM,CAAC;AAE5C,4EAA4E;AAC5E,eAAO,MAAM,wBAAwB,MAAM,CAAC;AAE5C,6EAA6E;AAC7E,eAAO,MAAM,YAAY,KAAK,CAAC;AAE/B,yEAAyE;AACzE,eAAO,MAAM,kBAAkB,MAAM,CAAC;AAEtC,0EAA0E;AAC1E,eAAO,MAAM,wBAAwB,MAAM,CAAC;AAE5C,oEAAoE;AACpE,eAAO,MAAM,QAAQ,mCAAmC,CAAC;AAEzD,qEAAqE;AACrE,eAAO,MAAM,sBAAsB,MAAM,CAAC;AAE1C,+EAA+E;AAC/E,eAAO,MAAM,4BAA4B,gCAAgC,CAAC;AAE1E,sDAAsD;AACtD,eAAO,MAAM,YAAY,KAAK,CAAC;AAC/B,eAAO,MAAM,aAAa,IAAI,CAAC;AAC/B,eAAO,MAAM,aAAa,IAAI,CAAC;AAE/B;;;GAGG;AACH,eAAO,MAAM,qBAAqB,KAAK,CAAC;AAExC;;;;;;;GAOG;AACH,wBAAgB,oBAAoB,CAClC,SAAS,EAAE,yBAAyB,GAAG,SAAS,GAC/C,eAAe,CAcjB"}
|