@oxyhq/bloom 0.4.0 → 0.5.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/README.md +105 -90
- package/lib/commonjs/bottom-sheet/index.js +2 -2
- package/lib/commonjs/context-menu/index.js +18 -19
- package/lib/commonjs/context-menu/index.js.map +1 -1
- package/lib/commonjs/dialog/BloomDialogProvider.js +61 -0
- package/lib/commonjs/dialog/BloomDialogProvider.js.map +1 -0
- package/lib/commonjs/dialog/BloomDialogProvider.web.js +45 -0
- package/lib/commonjs/dialog/BloomDialogProvider.web.js.map +1 -0
- package/lib/commonjs/dialog/Dialog.js +197 -100
- package/lib/commonjs/dialog/Dialog.js.map +1 -1
- package/lib/commonjs/dialog/Dialog.web.js +194 -84
- package/lib/commonjs/dialog/Dialog.web.js.map +1 -1
- package/lib/commonjs/dialog/SheetShell.js +149 -0
- package/lib/commonjs/dialog/SheetShell.js.map +1 -0
- package/lib/commonjs/dialog/alert-store.js +116 -0
- package/lib/commonjs/dialog/alert-store.js.map +1 -0
- package/lib/commonjs/dialog/alert.js +38 -0
- package/lib/commonjs/dialog/alert.js.map +1 -0
- package/lib/commonjs/dialog/context.js +10 -2
- package/lib/commonjs/dialog/context.js.map +1 -1
- package/lib/commonjs/dialog/index.js +8 -24
- package/lib/commonjs/dialog/index.js.map +1 -1
- package/lib/commonjs/dialog/index.web.js +10 -20
- package/lib/commonjs/dialog/index.web.js.map +1 -1
- package/lib/commonjs/index.js +101 -66
- package/lib/commonjs/index.js.map +1 -1
- package/lib/commonjs/index.web.js +101 -66
- package/lib/commonjs/index.web.js.map +1 -1
- package/lib/commonjs/menu/index.js +21 -23
- package/lib/commonjs/menu/index.js.map +1 -1
- package/lib/commonjs/select/index.js +26 -27
- package/lib/commonjs/select/index.js.map +1 -1
- package/lib/commonjs/toast/index.js +42 -13
- package/lib/commonjs/toast/index.js.map +1 -1
- package/lib/commonjs/toast/index.web.js +19 -15
- package/lib/commonjs/toast/index.web.js.map +1 -1
- package/lib/module/bottom-sheet/index.js +2 -2
- package/lib/module/context-menu/index.js +15 -16
- package/lib/module/context-menu/index.js.map +1 -1
- package/lib/module/dialog/BloomDialogProvider.js +57 -0
- package/lib/module/dialog/BloomDialogProvider.js.map +1 -0
- package/lib/module/dialog/BloomDialogProvider.web.js +41 -0
- package/lib/module/dialog/BloomDialogProvider.web.js.map +1 -0
- package/lib/module/dialog/Dialog.js +199 -87
- package/lib/module/dialog/Dialog.js.map +1 -1
- package/lib/module/dialog/Dialog.web.js +195 -70
- package/lib/module/dialog/Dialog.web.js.map +1 -1
- package/lib/module/dialog/SheetShell.js +143 -0
- package/lib/module/dialog/SheetShell.js.map +1 -0
- package/lib/module/dialog/alert-store.js +107 -0
- package/lib/module/dialog/alert-store.js.map +1 -0
- package/lib/module/dialog/alert.js +35 -0
- package/lib/module/dialog/alert.js.map +1 -0
- package/lib/module/dialog/context.js +10 -2
- package/lib/module/dialog/context.js.map +1 -1
- package/lib/module/dialog/index.js +3 -1
- package/lib/module/dialog/index.js.map +1 -1
- package/lib/module/dialog/index.web.js +9 -7
- package/lib/module/dialog/index.web.js.map +1 -1
- package/lib/module/index.js +2 -3
- package/lib/module/index.js.map +1 -1
- package/lib/module/index.web.js +2 -3
- package/lib/module/index.web.js.map +1 -1
- package/lib/module/menu/index.js +11 -13
- package/lib/module/menu/index.js.map +1 -1
- package/lib/module/select/index.js +27 -28
- package/lib/module/select/index.js.map +1 -1
- package/lib/module/toast/index.js +41 -11
- package/lib/module/toast/index.js.map +1 -1
- package/lib/module/toast/index.web.js +18 -13
- package/lib/module/toast/index.web.js.map +1 -1
- package/lib/typescript/commonjs/__tests__/Dialog.test.d.ts +2 -0
- package/lib/typescript/commonjs/__tests__/Dialog.test.d.ts.map +1 -0
- package/lib/typescript/commonjs/bottom-sheet/index.d.ts +1 -1
- package/lib/typescript/commonjs/context-menu/index.d.ts +4 -3
- package/lib/typescript/commonjs/context-menu/index.d.ts.map +1 -1
- package/lib/typescript/commonjs/dialog/BloomDialogProvider.d.ts +27 -0
- package/lib/typescript/commonjs/dialog/BloomDialogProvider.d.ts.map +1 -0
- package/lib/typescript/commonjs/dialog/BloomDialogProvider.web.d.ts +15 -0
- package/lib/typescript/commonjs/dialog/BloomDialogProvider.web.d.ts.map +1 -0
- package/lib/typescript/commonjs/dialog/Dialog.d.ts +37 -10
- package/lib/typescript/commonjs/dialog/Dialog.d.ts.map +1 -1
- package/lib/typescript/commonjs/dialog/Dialog.web.d.ts +26 -10
- package/lib/typescript/commonjs/dialog/Dialog.web.d.ts.map +1 -1
- package/lib/typescript/commonjs/dialog/SheetShell.d.ts +31 -0
- package/lib/typescript/commonjs/dialog/SheetShell.d.ts.map +1 -0
- package/lib/typescript/commonjs/dialog/alert-store.d.ts +70 -0
- package/lib/typescript/commonjs/dialog/alert-store.d.ts.map +1 -0
- package/lib/typescript/commonjs/dialog/alert.d.ts +27 -0
- package/lib/typescript/commonjs/dialog/alert.d.ts.map +1 -0
- package/lib/typescript/commonjs/dialog/context.d.ts +7 -0
- package/lib/typescript/commonjs/dialog/context.d.ts.map +1 -1
- package/lib/typescript/commonjs/dialog/index.d.ts +5 -2
- package/lib/typescript/commonjs/dialog/index.d.ts.map +1 -1
- package/lib/typescript/commonjs/dialog/index.web.d.ts +5 -2
- package/lib/typescript/commonjs/dialog/index.web.d.ts.map +1 -1
- package/lib/typescript/commonjs/dialog/types.d.ts +70 -15
- package/lib/typescript/commonjs/dialog/types.d.ts.map +1 -1
- package/lib/typescript/commonjs/index.d.ts +3 -3
- package/lib/typescript/commonjs/index.d.ts.map +1 -1
- package/lib/typescript/commonjs/index.web.d.ts +3 -3
- package/lib/typescript/commonjs/index.web.d.ts.map +1 -1
- package/lib/typescript/commonjs/menu/index.d.ts +4 -4
- package/lib/typescript/commonjs/menu/index.d.ts.map +1 -1
- package/lib/typescript/commonjs/select/index.d.ts.map +1 -1
- package/lib/typescript/commonjs/toast/index.d.ts +32 -3
- package/lib/typescript/commonjs/toast/index.d.ts.map +1 -1
- package/lib/typescript/commonjs/toast/index.web.d.ts +14 -7
- package/lib/typescript/commonjs/toast/index.web.d.ts.map +1 -1
- package/lib/typescript/module/__tests__/Dialog.test.d.ts +2 -0
- package/lib/typescript/module/__tests__/Dialog.test.d.ts.map +1 -0
- package/lib/typescript/module/bottom-sheet/index.d.ts +1 -1
- package/lib/typescript/module/context-menu/index.d.ts +4 -3
- package/lib/typescript/module/context-menu/index.d.ts.map +1 -1
- package/lib/typescript/module/dialog/BloomDialogProvider.d.ts +27 -0
- package/lib/typescript/module/dialog/BloomDialogProvider.d.ts.map +1 -0
- package/lib/typescript/module/dialog/BloomDialogProvider.web.d.ts +15 -0
- package/lib/typescript/module/dialog/BloomDialogProvider.web.d.ts.map +1 -0
- package/lib/typescript/module/dialog/Dialog.d.ts +37 -10
- package/lib/typescript/module/dialog/Dialog.d.ts.map +1 -1
- package/lib/typescript/module/dialog/Dialog.web.d.ts +26 -10
- package/lib/typescript/module/dialog/Dialog.web.d.ts.map +1 -1
- package/lib/typescript/module/dialog/SheetShell.d.ts +31 -0
- package/lib/typescript/module/dialog/SheetShell.d.ts.map +1 -0
- package/lib/typescript/module/dialog/alert-store.d.ts +70 -0
- package/lib/typescript/module/dialog/alert-store.d.ts.map +1 -0
- package/lib/typescript/module/dialog/alert.d.ts +27 -0
- package/lib/typescript/module/dialog/alert.d.ts.map +1 -0
- package/lib/typescript/module/dialog/context.d.ts +7 -0
- package/lib/typescript/module/dialog/context.d.ts.map +1 -1
- package/lib/typescript/module/dialog/index.d.ts +5 -2
- package/lib/typescript/module/dialog/index.d.ts.map +1 -1
- package/lib/typescript/module/dialog/index.web.d.ts +5 -2
- package/lib/typescript/module/dialog/index.web.d.ts.map +1 -1
- package/lib/typescript/module/dialog/types.d.ts +70 -15
- package/lib/typescript/module/dialog/types.d.ts.map +1 -1
- package/lib/typescript/module/index.d.ts +3 -3
- package/lib/typescript/module/index.d.ts.map +1 -1
- package/lib/typescript/module/index.web.d.ts +3 -3
- package/lib/typescript/module/index.web.d.ts.map +1 -1
- package/lib/typescript/module/menu/index.d.ts +4 -4
- package/lib/typescript/module/menu/index.d.ts.map +1 -1
- package/lib/typescript/module/select/index.d.ts.map +1 -1
- package/lib/typescript/module/toast/index.d.ts +32 -3
- package/lib/typescript/module/toast/index.d.ts.map +1 -1
- package/lib/typescript/module/toast/index.web.d.ts +14 -7
- package/lib/typescript/module/toast/index.web.d.ts.map +1 -1
- package/package.json +3 -14
- package/src/__tests__/Dialog.test.tsx +177 -0
- package/src/bottom-sheet/index.tsx +3 -3
- package/src/context-menu/index.tsx +12 -12
- package/src/dialog/BloomDialogProvider.tsx +61 -0
- package/src/dialog/BloomDialogProvider.web.tsx +46 -0
- package/src/dialog/Dialog.tsx +217 -64
- package/src/dialog/Dialog.web.tsx +240 -75
- package/src/dialog/SheetShell.tsx +154 -0
- package/src/dialog/alert-store.ts +126 -0
- package/src/dialog/alert.ts +42 -0
- package/src/dialog/context.ts +14 -3
- package/src/dialog/index.ts +14 -2
- package/src/dialog/index.web.ts +20 -8
- package/src/dialog/types.ts +73 -16
- package/src/index.ts +17 -3
- package/src/index.web.ts +17 -3
- package/src/menu/index.tsx +13 -17
- package/src/select/index.tsx +30 -30
- package/src/toast/index.tsx +55 -11
- package/src/toast/index.web.tsx +33 -13
- package/lib/commonjs/prompt/Prompt.js +0 -267
- package/lib/commonjs/prompt/Prompt.js.map +0 -1
- package/lib/commonjs/prompt/index.js +0 -61
- package/lib/commonjs/prompt/index.js.map +0 -1
- package/lib/module/prompt/Prompt.js +0 -250
- package/lib/module/prompt/Prompt.js.map +0 -1
- package/lib/module/prompt/index.js +0 -4
- package/lib/module/prompt/index.js.map +0 -1
- package/lib/typescript/commonjs/prompt/Prompt.d.ts +0 -42
- package/lib/typescript/commonjs/prompt/Prompt.d.ts.map +0 -1
- package/lib/typescript/commonjs/prompt/index.d.ts +0 -3
- package/lib/typescript/commonjs/prompt/index.d.ts.map +0 -1
- package/lib/typescript/module/prompt/Prompt.d.ts +0 -42
- package/lib/typescript/module/prompt/Prompt.d.ts.map +0 -1
- package/lib/typescript/module/prompt/index.d.ts +0 -3
- package/lib/typescript/module/prompt/index.d.ts.map +0 -1
- package/src/prompt/Prompt.tsx +0 -247
- package/src/prompt/index.ts +0 -13
package/README.md
CHANGED
|
@@ -5,7 +5,7 @@ Shared UI component library for the Oxy ecosystem. Built for React Native + Expo
|
|
|
5
5
|
## Install
|
|
6
6
|
|
|
7
7
|
```sh
|
|
8
|
-
|
|
8
|
+
bun add @oxyhq/bloom
|
|
9
9
|
```
|
|
10
10
|
|
|
11
11
|
### Peer dependencies
|
|
@@ -18,10 +18,10 @@ Required:
|
|
|
18
18
|
|
|
19
19
|
Optional:
|
|
20
20
|
|
|
21
|
-
- `@gorhom/bottom-sheet >= 5` (native `Dialog` and `Prompt`) — also requires wrapping the app root with `BottomSheetModalProvider`, see [Dialog](#dialog).
|
|
22
21
|
- `react-native-reanimated >= 3` (native `Dialog`, `BottomSheet`, Loading `top` variant)
|
|
23
22
|
- `react-native-gesture-handler >= 2` (native `Dialog`, `BottomSheet`) — also requires wrapping the app root with `GestureHandlerRootView`, see [Dialog](#dialog).
|
|
24
23
|
- `react-native-svg >= 13` (Avatar `squircle` shape)
|
|
24
|
+
- `sonner >= 2` / `sonner-native >= 0.17` (`toast`)
|
|
25
25
|
|
|
26
26
|
## Usage
|
|
27
27
|
|
|
@@ -50,76 +50,107 @@ const theme = useTheme();
|
|
|
50
50
|
|
|
51
51
|
4 modes: `light`, `dark`, `system`, `adaptive` (uses iOS/Android native dynamic colors when available).
|
|
52
52
|
|
|
53
|
-
### Modal components: Dialog,
|
|
53
|
+
### Modal & feedback components: Dialog, BottomSheet, toast / alert
|
|
54
54
|
|
|
55
|
-
Bloom ships three
|
|
55
|
+
Bloom ships three primitives for modal, sheet, and feedback presentation. Pick the one that matches your use case:
|
|
56
56
|
|
|
57
57
|
| Component | Native | Web | Use when |
|
|
58
58
|
|-----------|--------|-----|----------|
|
|
59
|
-
| `Dialog` | Bottom
|
|
60
|
-
| `
|
|
61
|
-
| `
|
|
62
|
-
|
|
63
|
-
`Prompt` is built on top of `Dialog` (so the provider requirements are the same). `BottomSheet` is a separate, standalone implementation.
|
|
59
|
+
| `Dialog` | Bottom-sheet card (Bloom's own) | Centered modal | Confirmation flows AND custom modal content — same component handles both |
|
|
60
|
+
| `BottomSheet` | Draggable sheet | RN `Modal` polyfill | You need direct control over snap points, scroll handoff, keyboard, detached/flush layout |
|
|
61
|
+
| `toast` / `alert` | Sonner-native + Bloom theme | Sonner + Bloom theme | Passive feedback (`toast`) or one-shot confirmations (`alert`) called imperatively from anywhere |
|
|
64
62
|
|
|
65
63
|
### Dialog
|
|
66
64
|
|
|
67
|
-
|
|
65
|
+
A single `<Dialog>` component for both confirmation flows AND custom modal content. Bottom-sheet card on native, centered modal on web.
|
|
68
66
|
|
|
69
|
-
> **Required providers (native).**
|
|
67
|
+
> **Required providers (native).** Your app root **must** be wrapped with `GestureHandlerRootView` from `react-native-gesture-handler` for the bottom-sheet pan gestures to work.
|
|
70
68
|
|
|
71
69
|
```tsx
|
|
72
70
|
import { GestureHandlerRootView } from 'react-native-gesture-handler';
|
|
73
|
-
import {
|
|
74
|
-
import { BloomThemeProvider } from '@oxyhq/bloom/theme';
|
|
71
|
+
import { BloomThemeProvider, BloomDialogProvider } from '@oxyhq/bloom';
|
|
75
72
|
|
|
76
73
|
export default function Root() {
|
|
77
74
|
return (
|
|
78
75
|
<GestureHandlerRootView style={{ flex: 1 }}>
|
|
79
76
|
<BloomThemeProvider mode="system" colorPreset="oxy">
|
|
80
|
-
<
|
|
77
|
+
<BloomDialogProvider>
|
|
81
78
|
<App />
|
|
82
|
-
</
|
|
79
|
+
</BloomDialogProvider>
|
|
83
80
|
</BloomThemeProvider>
|
|
84
81
|
</GestureHandlerRootView>
|
|
85
82
|
);
|
|
86
83
|
}
|
|
87
84
|
```
|
|
88
85
|
|
|
89
|
-
|
|
86
|
+
`BloomDialogProvider` powers the imperative `alert()` helper (see below) — mount it once near the app root.
|
|
90
87
|
|
|
91
|
-
|
|
92
|
-
import * as Dialog from '@oxyhq/bloom/dialog';
|
|
88
|
+
#### Declarative (the 90% case)
|
|
93
89
|
|
|
94
|
-
|
|
95
|
-
|
|
90
|
+
```tsx
|
|
91
|
+
import { Dialog, useDialogControl } from '@oxyhq/bloom';
|
|
96
92
|
|
|
93
|
+
function SignOutButton() {
|
|
94
|
+
const control = useDialogControl();
|
|
97
95
|
return (
|
|
98
96
|
<>
|
|
99
|
-
<Button onPress={() => control.open()}>
|
|
100
|
-
|
|
101
|
-
<Dialog
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
97
|
+
<Button onPress={() => control.open()}>Sign out</Button>
|
|
98
|
+
|
|
99
|
+
<Dialog
|
|
100
|
+
control={control}
|
|
101
|
+
title="Sign out?"
|
|
102
|
+
description="You'll need to enter your password to sign in again."
|
|
103
|
+
actions={[
|
|
104
|
+
{ label: 'Sign out', color: 'destructive', onPress: doSignOut },
|
|
105
|
+
{ label: 'Cancel', color: 'cancel' },
|
|
106
|
+
]}
|
|
107
|
+
/>
|
|
107
108
|
</>
|
|
108
109
|
);
|
|
109
110
|
}
|
|
110
111
|
```
|
|
111
112
|
|
|
112
|
-
|
|
113
|
+
#### Custom content
|
|
113
114
|
|
|
114
|
-
|
|
115
|
-
- `onClose?` — fires after the dialog has finished closing.
|
|
116
|
-
- `testID?`
|
|
117
|
-
- `webOptions?: { alignCenter?: boolean }` — center the dialog vertically on web instead of anchoring near the top.
|
|
118
|
-
- `preventExpansion?: boolean` — on native, snaps the bottom sheet to a fixed `'40%'` height instead of dynamic sizing.
|
|
115
|
+
Provide any JSX as `children`. Combine with `title` to keep a consistent header.
|
|
119
116
|
|
|
120
|
-
|
|
117
|
+
```tsx
|
|
118
|
+
<Dialog control={control} title="Pick a tag">
|
|
119
|
+
<YourCustomBody />
|
|
120
|
+
</Dialog>
|
|
121
|
+
```
|
|
121
122
|
|
|
122
|
-
|
|
123
|
+
#### Pure custom
|
|
124
|
+
|
|
125
|
+
Drop the declarative props entirely — `children` owns every pixel.
|
|
126
|
+
|
|
127
|
+
```tsx
|
|
128
|
+
<Dialog control={control}>
|
|
129
|
+
<YourEntirelyCustomLayout />
|
|
130
|
+
</Dialog>
|
|
131
|
+
```
|
|
132
|
+
|
|
133
|
+
#### Props
|
|
134
|
+
|
|
135
|
+
- `control` — from `useDialogControl()`.
|
|
136
|
+
- `title?: string` — header text.
|
|
137
|
+
- `description?: string` — supporting copy rendered below the title.
|
|
138
|
+
- `actions?: DialogAction[]` — confirmation buttons. Each action accepts:
|
|
139
|
+
- `label: string` — button text.
|
|
140
|
+
- `color?: 'default' | 'cancel' | 'destructive'` — defaults to `'default'`.
|
|
141
|
+
- `onPress?: (e) => void` — invoked after the dialog finishes closing.
|
|
142
|
+
- `disabled?: boolean`
|
|
143
|
+
- `shouldCloseOnPress?: boolean` — defaults to `true`. Set `false` while an async action is in flight.
|
|
144
|
+
- `testID?: string`
|
|
145
|
+
- `children?: React.ReactNode` — custom content rendered after the description.
|
|
146
|
+
- `onClose?: () => void` — fires after the dialog has finished closing.
|
|
147
|
+
- `style?` — applied to the dialog content container.
|
|
148
|
+
- `label?: string` — accessibility label.
|
|
149
|
+
- `testID?: string`
|
|
150
|
+
|
|
151
|
+
#### Web setup
|
|
152
|
+
|
|
153
|
+
Inject the CSS animations into your global styles once:
|
|
123
154
|
|
|
124
155
|
```tsx
|
|
125
156
|
import { BLOOM_DIALOG_CSS } from '@oxyhq/bloom/dialog';
|
|
@@ -128,66 +159,49 @@ import { BLOOM_DIALOG_CSS } from '@oxyhq/bloom/dialog';
|
|
|
128
159
|
<style>{BLOOM_DIALOG_CSS}</style>
|
|
129
160
|
```
|
|
130
161
|
|
|
131
|
-
###
|
|
132
|
-
|
|
133
|
-
Confirmation dialogs built on top of `Dialog`. On native, constrained to a 40% bottom sheet (Gorhom); on web, a centered 320px modal. Same provider requirements as [Dialog](#dialog).
|
|
162
|
+
### toast
|
|
134
163
|
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
`Prompt.Basic` — one-shot confirm dialog:
|
|
164
|
+
Passive notifications, sonner under the hood, themed by bloom.
|
|
138
165
|
|
|
139
166
|
```tsx
|
|
140
|
-
import
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
confirmButtonCta="Delete"
|
|
154
|
-
confirmButtonColor="negative"
|
|
155
|
-
onConfirm={() => handleDelete()}
|
|
156
|
-
/>
|
|
157
|
-
</>
|
|
158
|
-
);
|
|
159
|
-
}
|
|
167
|
+
import { toast } from '@oxyhq/bloom';
|
|
168
|
+
import { ToastOutlet } from '@oxyhq/bloom/toast';
|
|
169
|
+
|
|
170
|
+
// Mount once near the app root, inside BloomThemeProvider:
|
|
171
|
+
<ToastOutlet />
|
|
172
|
+
|
|
173
|
+
// Anywhere in your app:
|
|
174
|
+
toast('Saved');
|
|
175
|
+
toast.success('Profile updated');
|
|
176
|
+
toast.error('Network error', { duration: 5000 });
|
|
177
|
+
toast.warning('Please verify your email');
|
|
178
|
+
toast.info('A new version is available');
|
|
179
|
+
toast.dismiss(id);
|
|
160
180
|
```
|
|
161
181
|
|
|
162
|
-
`
|
|
182
|
+
`toast(content, options?)` accepts strings or React elements. `options.type` (`'default' | 'success' | 'error' | 'warning' | 'info'`) is overridden by the typed helpers above.
|
|
163
183
|
|
|
164
|
-
|
|
165
|
-
- `title: string`
|
|
166
|
-
- `description?: string`
|
|
167
|
-
- `confirmButtonCta?: string` — defaults to `'Confirm'`.
|
|
168
|
-
- `cancelButtonCta?: string` — defaults to `'Cancel'`.
|
|
169
|
-
- `confirmButtonColor?: ActionColor` — defaults to `'primary'`.
|
|
170
|
-
- `onConfirm: (e) => void`
|
|
171
|
-
- `showCancel?: boolean` — defaults to `true`.
|
|
184
|
+
### alert()
|
|
172
185
|
|
|
173
|
-
|
|
186
|
+
Imperative one-shot confirmation dialogs, matching React Native's `Alert.alert(title, message?, buttons?)` signature. Calls are queued and rendered through `BloomDialogProvider` — you can call `alert()` from anywhere, including before the provider mounts (alerts queue and drain on subscribe).
|
|
174
187
|
|
|
175
188
|
```tsx
|
|
176
|
-
|
|
177
|
-
|
|
178
|
-
|
|
179
|
-
|
|
180
|
-
|
|
181
|
-
|
|
182
|
-
|
|
183
|
-
|
|
184
|
-
|
|
185
|
-
</Prompt.Outer>
|
|
189
|
+
import { alert } from '@oxyhq/bloom';
|
|
190
|
+
|
|
191
|
+
alert('Sign out?', 'Are you sure you want to sign out of this device?', [
|
|
192
|
+
{ text: 'Cancel', style: 'cancel' },
|
|
193
|
+
{ text: 'Sign out', style: 'destructive', onPress: doSignOut },
|
|
194
|
+
]);
|
|
195
|
+
|
|
196
|
+
// Single OK button (default when no buttons passed):
|
|
197
|
+
alert('Saved');
|
|
186
198
|
```
|
|
187
199
|
|
|
188
|
-
|
|
200
|
+
Each button:
|
|
189
201
|
|
|
190
|
-
`
|
|
202
|
+
- `text: string` — required label.
|
|
203
|
+
- `style?: 'default' | 'cancel' | 'destructive'` — defaults to `'default'`.
|
|
204
|
+
- `onPress?: () => void` — fires after the dialog finishes closing.
|
|
191
205
|
|
|
192
206
|
### BottomSheet
|
|
193
207
|
|
|
@@ -396,9 +410,9 @@ import {
|
|
|
396
410
|
|
|
397
411
|
```ts
|
|
398
412
|
import { BloomThemeProvider, useTheme } from '@oxyhq/bloom/theme';
|
|
399
|
-
import
|
|
400
|
-
import * as Prompt from '@oxyhq/bloom/prompt';
|
|
413
|
+
import { Dialog, BloomDialogProvider, alert, useDialogControl } from '@oxyhq/bloom/dialog';
|
|
401
414
|
import { BottomSheet, type BottomSheetRef } from '@oxyhq/bloom/bottom-sheet';
|
|
415
|
+
import { toast, ToastOutlet } from '@oxyhq/bloom/toast';
|
|
402
416
|
import { Button, IconButton } from '@oxyhq/bloom/button';
|
|
403
417
|
import { GroupedButtons } from '@oxyhq/bloom/grouped-buttons';
|
|
404
418
|
import { Divider } from '@oxyhq/bloom/divider';
|
|
@@ -413,10 +427,11 @@ import { PromptInput, PromptInputTextarea } from '@oxyhq/bloom/prompt-input';
|
|
|
413
427
|
## Development
|
|
414
428
|
|
|
415
429
|
```sh
|
|
416
|
-
|
|
417
|
-
|
|
418
|
-
|
|
419
|
-
|
|
430
|
+
bun install
|
|
431
|
+
bun run build # react-native-builder-bob
|
|
432
|
+
bun run typescript # type-check
|
|
433
|
+
bun run test # jest
|
|
434
|
+
bun run clean # remove lib/
|
|
420
435
|
```
|
|
421
436
|
|
|
422
437
|
## License
|
|
@@ -211,8 +211,8 @@ const BottomSheet = exports.BottomSheet = /*#__PURE__*/(0, _react.forwardRef)((p
|
|
|
211
211
|
|
|
212
212
|
// On unmount: ensure pending close callbacks (e.g. consumer's `onDismiss`)
|
|
213
213
|
// still fire if the BS is yanked mid-animation by a parent re-render.
|
|
214
|
-
// Without this, `Dialog
|
|
215
|
-
// callbacks
|
|
214
|
+
// Without this, `Dialog`'s `handleDismiss` never runs and queued
|
|
215
|
+
// callbacks (post-close handlers) are silently lost.
|
|
216
216
|
// Only fires when the sheet was actually rendered (open or closing) to
|
|
217
217
|
// avoid spuriously calling onDismiss on bare unmount of a never-opened
|
|
218
218
|
// sheet. Refs are read inside the cleanup, so latest values are captured.
|
|
@@ -15,17 +15,19 @@ var _react = _interopRequireWildcard(require("react"));
|
|
|
15
15
|
var _reactNative = require("react-native");
|
|
16
16
|
var _useTheme = require("../theme/use-theme.js");
|
|
17
17
|
var _index = require("../typography/index.js");
|
|
18
|
-
var
|
|
18
|
+
var _context = require("../dialog/context.js");
|
|
19
|
+
var _SheetShell = require("../dialog/SheetShell.js");
|
|
19
20
|
var _useInteractionState = require("../hooks/useInteractionState.js");
|
|
20
|
-
var
|
|
21
|
+
var _context2 = require("./context.js");
|
|
21
22
|
var _jsxRuntime = require("react/jsx-runtime");
|
|
22
23
|
function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
|
|
23
24
|
/**
|
|
24
25
|
* ContextMenu — Native implementation
|
|
25
26
|
*
|
|
26
|
-
* Opens a bottom-sheet menu
|
|
27
|
-
*
|
|
28
|
-
*
|
|
27
|
+
* Opens a bottom-sheet menu when the user long-presses the trigger. The
|
|
28
|
+
* menu body uses bloom's internal `SheetShell` (a `BottomSheet`
|
|
29
|
+
* presentation primitive with the same drag-handle + close-on-tap
|
|
30
|
+
* semantics shared by `Menu` and `Select`).
|
|
29
31
|
*/
|
|
30
32
|
|
|
31
33
|
// ---------------------------------------------------------------------------
|
|
@@ -49,7 +51,7 @@ function useNativeContextMenuContext() {
|
|
|
49
51
|
function Root({
|
|
50
52
|
children
|
|
51
53
|
}) {
|
|
52
|
-
const control =
|
|
54
|
+
const control = (0, _context.useDialogControl)();
|
|
53
55
|
const ctx = (0, _react.useMemo)(() => ({
|
|
54
56
|
isOpen: false,
|
|
55
57
|
open: () => control.open(),
|
|
@@ -112,24 +114,21 @@ function Outer({
|
|
|
112
114
|
const {
|
|
113
115
|
control
|
|
114
116
|
} = useNativeContextMenuContext();
|
|
115
|
-
return /*#__PURE__*/(0, _jsxRuntime.
|
|
117
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_SheetShell.SheetShell, {
|
|
116
118
|
control: control,
|
|
117
|
-
|
|
118
|
-
children:
|
|
119
|
+
label: "Context menu",
|
|
120
|
+
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(NativeContextMenuContext.Provider, {
|
|
119
121
|
value: {
|
|
120
122
|
isOpen: true,
|
|
121
123
|
open: () => control.open(),
|
|
122
124
|
close: () => control.close(),
|
|
123
125
|
control
|
|
124
126
|
},
|
|
125
|
-
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(
|
|
126
|
-
|
|
127
|
-
children:
|
|
128
|
-
style: [styles.outerContent, style],
|
|
129
|
-
children: children
|
|
130
|
-
})
|
|
127
|
+
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
|
|
128
|
+
style: [styles.outerContent, style],
|
|
129
|
+
children: children
|
|
131
130
|
})
|
|
132
|
-
})
|
|
131
|
+
})
|
|
133
132
|
});
|
|
134
133
|
}
|
|
135
134
|
|
|
@@ -184,7 +183,7 @@ function Item({
|
|
|
184
183
|
}, isHighlighted && {
|
|
185
184
|
backgroundColor: theme.colors.backgroundSecondary
|
|
186
185
|
}, style],
|
|
187
|
-
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(
|
|
186
|
+
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_context2.ItemCtx.Provider, {
|
|
188
187
|
value: itemCtx,
|
|
189
188
|
children: children
|
|
190
189
|
})
|
|
@@ -202,7 +201,7 @@ function ItemText({
|
|
|
202
201
|
const theme = (0, _useTheme.useTheme)();
|
|
203
202
|
const {
|
|
204
203
|
disabled
|
|
205
|
-
} = (0,
|
|
204
|
+
} = (0, _context2.useItemContext)();
|
|
206
205
|
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_index.Text, {
|
|
207
206
|
numberOfLines: 2,
|
|
208
207
|
ellipsizeMode: "middle",
|
|
@@ -223,7 +222,7 @@ function ItemIcon({
|
|
|
223
222
|
const theme = (0, _useTheme.useTheme)();
|
|
224
223
|
const {
|
|
225
224
|
disabled
|
|
226
|
-
} = (0,
|
|
225
|
+
} = (0, _context2.useItemContext)();
|
|
227
226
|
return /*#__PURE__*/(0, _jsxRuntime.jsx)(Comp, {
|
|
228
227
|
size: "lg",
|
|
229
228
|
fill: disabled ? theme.colors.textTertiary : theme.colors.textSecondary
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["_react","_interopRequireWildcard","require","_reactNative","_useTheme","_index","
|
|
1
|
+
{"version":3,"names":["_react","_interopRequireWildcard","require","_reactNative","_useTheme","_index","_context","_SheetShell","_useInteractionState","_context2","_jsxRuntime","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","NativeContextMenuContext","createContext","displayName","useNativeContextMenuContext","ctx","useContext","Error","Root","children","control","useDialogControl","useMemo","isOpen","open","close","jsx","Provider","value","Trigger","label","hint","style","state","focused","onIn","onFocus","onOut","onBlur","useInteractionState","View","hovered","pressed","props","onPress","onLongPress","accessibilityLabel","accessibilityHint","Outer","SheetShell","styles","outerContent","Item","disabled","theme","useTheme","onPressIn","onPressOut","isHighlighted","handlePress","useCallback","itemCtx","Pressable","accessibilityState","item","backgroundColor","colors","contrast50","borderColor","borderLight","backgroundSecondary","ItemCtx","ItemText","useItemContext","Text","numberOfLines","ellipsizeMode","itemText","color","textTertiary","text","ItemIcon","icon","Comp","size","fill","textSecondary","Group","Divider","divider","borderTopColor","StyleSheet","create","gap","flexDirection","alignItems","paddingHorizontal","borderRadius","overflow","borderWidth","minHeight","paddingVertical","flex","fontSize","fontWeight","borderTopWidth","hairlineWidth","marginVertical"],"sourceRoot":"../../../src","sources":["context-menu/index.tsx"],"mappings":"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","ignoreList":[]}
|
|
@@ -0,0 +1,61 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.BloomDialogProvider = BloomDialogProvider;
|
|
7
|
+
var _react = _interopRequireWildcard(require("react"));
|
|
8
|
+
var _Dialog = require("./Dialog");
|
|
9
|
+
var _alertStore = require("./alert-store.js");
|
|
10
|
+
var _jsxRuntime = require("react/jsx-runtime");
|
|
11
|
+
function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
|
|
12
|
+
/**
|
|
13
|
+
* Mounts the imperative `alert()` host inside your app.
|
|
14
|
+
*
|
|
15
|
+
* Wrap your app root once (after `BloomThemeProvider`, so the dialog's
|
|
16
|
+
* colours come from the active theme) and you can call `alert()` from
|
|
17
|
+
* anywhere — including from code that runs before the provider mounts
|
|
18
|
+
* (alerts are queued and drained on subscribe).
|
|
19
|
+
*
|
|
20
|
+
* ```tsx
|
|
21
|
+
* import { BloomDialogProvider } from '@oxyhq/bloom';
|
|
22
|
+
*
|
|
23
|
+
* <BloomThemeProvider mode="system" colorPreset="oxy">
|
|
24
|
+
* <BloomDialogProvider>
|
|
25
|
+
* <App />
|
|
26
|
+
* </BloomDialogProvider>
|
|
27
|
+
* </BloomThemeProvider>
|
|
28
|
+
* ```
|
|
29
|
+
*
|
|
30
|
+
* Alerts are presented one at a time. While one is on screen, subsequent
|
|
31
|
+
* `alert()` calls enqueue and present in FIFO order once their predecessor
|
|
32
|
+
* has finished closing.
|
|
33
|
+
*/
|
|
34
|
+
function BloomDialogProvider({
|
|
35
|
+
children
|
|
36
|
+
}) {
|
|
37
|
+
const [queue, setQueue] = (0, _react.useState)([]);
|
|
38
|
+
(0, _react.useEffect)(() => (0, _alertStore.subscribeAlerts)(setQueue), []);
|
|
39
|
+
|
|
40
|
+
// Only the head of the queue is presented; this keeps the bottom-sheet
|
|
41
|
+
// exit/enter animations clean and matches the platform `Alert.alert`
|
|
42
|
+
// behaviour our consumers expect.
|
|
43
|
+
const head = queue[0];
|
|
44
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
|
|
45
|
+
children: [children, head ? /*#__PURE__*/(0, _jsxRuntime.jsx)(AlertHost, {
|
|
46
|
+
entry: head
|
|
47
|
+
}, head.id) : null]
|
|
48
|
+
});
|
|
49
|
+
}
|
|
50
|
+
function AlertHost({
|
|
51
|
+
entry
|
|
52
|
+
}) {
|
|
53
|
+
const actions = entry.buttons.map(_alertStore.buttonToAction);
|
|
54
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_Dialog.AutoMountedDialog, {
|
|
55
|
+
title: entry.title,
|
|
56
|
+
description: entry.message,
|
|
57
|
+
actions: actions,
|
|
58
|
+
onResolve: () => (0, _alertStore.dismissAlert)(entry.id)
|
|
59
|
+
});
|
|
60
|
+
}
|
|
61
|
+
//# sourceMappingURL=BloomDialogProvider.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["_react","_interopRequireWildcard","require","_Dialog","_alertStore","_jsxRuntime","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","BloomDialogProvider","children","queue","setQueue","useState","useEffect","subscribeAlerts","head","jsxs","Fragment","jsx","AlertHost","entry","id","actions","buttons","map","buttonToAction","AutoMountedDialog","title","description","message","onResolve","dismissAlert"],"sourceRoot":"../../../src","sources":["dialog/BloomDialogProvider.tsx"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,uBAAA,CAAAC,OAAA;AAEA,IAAAC,OAAA,GAAAD,OAAA;AACA,IAAAE,WAAA,GAAAF,OAAA;AAKuB,IAAAG,WAAA,GAAAH,OAAA;AAAA,SAAAD,wBAAAK,CAAA,EAAAC,CAAA,6BAAAC,OAAA,MAAAC,CAAA,OAAAD,OAAA,IAAAE,CAAA,OAAAF,OAAA,YAAAP,uBAAA,YAAAA,CAAAK,CAAA,EAAAC,CAAA,SAAAA,CAAA,IAAAD,CAAA,IAAAA,CAAA,CAAAK,UAAA,SAAAL,CAAA,MAAAM,CAAA,EAAAC,CAAA,EAAAC,CAAA,KAAAC,SAAA,QAAAC,OAAA,EAAAV,CAAA,iBAAAA,CAAA,uBAAAA,CAAA,yBAAAA,CAAA,SAAAQ,CAAA,MAAAF,CAAA,GAAAL,CAAA,GAAAG,CAAA,GAAAD,CAAA,QAAAG,CAAA,CAAAK,GAAA,CAAAX,CAAA,UAAAM,CAAA,CAAAM,GAAA,CAAAZ,CAAA,GAAAM,CAAA,CAAAO,GAAA,CAAAb,CAAA,EAAAQ,CAAA,gBAAAP,CAAA,IAAAD,CAAA,gBAAAC,CAAA,OAAAa,cAAA,CAAAC,IAAA,CAAAf,CAAA,EAAAC,CAAA,OAAAM,CAAA,IAAAD,CAAA,GAAAU,MAAA,CAAAC,cAAA,KAAAD,MAAA,CAAAE,wBAAA,CAAAlB,CAAA,EAAAC,CAAA,OAAAM,CAAA,CAAAK,GAAA,IAAAL,CAAA,CAAAM,GAAA,IAAAP,CAAA,CAAAE,CAAA,EAAAP,CAAA,EAAAM,CAAA,IAAAC,CAAA,CAAAP,CAAA,IAAAD,CAAA,CAAAC,CAAA,WAAAO,CAAA,KAAAR,CAAA,EAAAC,CAAA;AAEvB;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACO,SAASkB,mBAAmBA,CAAC;EAAEC;AAAwC,CAAC,EAAE;EAC/E,MAAM,CAACC,KAAK,EAAEC,QAAQ,CAAC,GAAG,IAAAC,eAAQ,EAAwB,EAAE,CAAC;EAE7D,IAAAC,gBAAS,EAAC,MAAM,IAAAC,2BAAe,EAACH,QAAQ,CAAC,EAAE,EAAE,CAAC;;EAE9C;EACA;EACA;EACA,MAAMI,IAAI,GAAGL,KAAK,CAAC,CAAC,CAAC;EAErB,oBACE,IAAAtB,WAAA,CAAA4B,IAAA,EAAA5B,WAAA,CAAA6B,QAAA;IAAAR,QAAA,GACGA,QAAQ,EACRM,IAAI,gBAAG,IAAA3B,WAAA,CAAA8B,GAAA,EAACC,SAAS;MAAeC,KAAK,EAAEL;IAAK,GAArBA,IAAI,CAACM,EAAkB,CAAC,GAAG,IAAI;EAAA,CACvD,CAAC;AAEP;AAEA,SAASF,SAASA,CAAC;EAAEC;AAA6B,CAAC,EAAE;EACnD,MAAME,OAAO,GAAGF,KAAK,CAACG,OAAO,CAACC,GAAG,CAACC,0BAAc,CAAC;EACjD,oBACE,IAAArC,WAAA,CAAA8B,GAAA,EAAChC,OAAA,CAAAwC,iBAAiB;IAChBC,KAAK,EAAEP,KAAK,CAACO,KAAM;IACnBC,WAAW,EAAER,KAAK,CAACS,OAAQ;IAC3BP,OAAO,EAAEA,OAAQ;IACjBQ,SAAS,EAAEA,CAAA,KAAM,IAAAC,wBAAY,EAACX,KAAK,CAACC,EAAE;EAAE,CACzC,CAAC;AAEN","ignoreList":[]}
|
|
@@ -0,0 +1,45 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.BloomDialogProvider = BloomDialogProvider;
|
|
7
|
+
var _react = _interopRequireWildcard(require("react"));
|
|
8
|
+
var _DialogWeb = require("./Dialog.web.js");
|
|
9
|
+
var _alertStore = require("./alert-store.js");
|
|
10
|
+
var _jsxRuntime = require("react/jsx-runtime");
|
|
11
|
+
function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
|
|
12
|
+
/**
|
|
13
|
+
* Web variant of `BloomDialogProvider`. Identical surface area to the
|
|
14
|
+
* native version — it just uses the web-fork `Dialog` (`Dialog.web.tsx`)
|
|
15
|
+
* underneath instead of the bottom-sheet variant.
|
|
16
|
+
*
|
|
17
|
+
* See the native file (`./BloomDialogProvider.tsx`) for the full design
|
|
18
|
+
* notes; this fork exists purely so the bundler's `browser` condition can
|
|
19
|
+
* resolve to a `Dialog` that doesn't pull in the native gesture-handler /
|
|
20
|
+
* reanimated stack.
|
|
21
|
+
*/
|
|
22
|
+
function BloomDialogProvider({
|
|
23
|
+
children
|
|
24
|
+
}) {
|
|
25
|
+
const [queue, setQueue] = (0, _react.useState)([]);
|
|
26
|
+
(0, _react.useEffect)(() => (0, _alertStore.subscribeAlerts)(setQueue), []);
|
|
27
|
+
const head = queue[0];
|
|
28
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
|
|
29
|
+
children: [children, head ? /*#__PURE__*/(0, _jsxRuntime.jsx)(AlertHost, {
|
|
30
|
+
entry: head
|
|
31
|
+
}, head.id) : null]
|
|
32
|
+
});
|
|
33
|
+
}
|
|
34
|
+
function AlertHost({
|
|
35
|
+
entry
|
|
36
|
+
}) {
|
|
37
|
+
const actions = entry.buttons.map(_alertStore.buttonToAction);
|
|
38
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_DialogWeb.AutoMountedDialog, {
|
|
39
|
+
title: entry.title,
|
|
40
|
+
description: entry.message,
|
|
41
|
+
actions: actions,
|
|
42
|
+
onResolve: () => (0, _alertStore.dismissAlert)(entry.id)
|
|
43
|
+
});
|
|
44
|
+
}
|
|
45
|
+
//# sourceMappingURL=BloomDialogProvider.web.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["_react","_interopRequireWildcard","require","_DialogWeb","_alertStore","_jsxRuntime","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","BloomDialogProvider","children","queue","setQueue","useState","useEffect","subscribeAlerts","head","jsxs","Fragment","jsx","AlertHost","entry","id","actions","buttons","map","buttonToAction","AutoMountedDialog","title","description","message","onResolve","dismissAlert"],"sourceRoot":"../../../src","sources":["dialog/BloomDialogProvider.web.tsx"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,uBAAA,CAAAC,OAAA;AAEA,IAAAC,UAAA,GAAAD,OAAA;AACA,IAAAE,WAAA,GAAAF,OAAA;AAKuB,IAAAG,WAAA,GAAAH,OAAA;AAAA,SAAAD,wBAAAK,CAAA,EAAAC,CAAA,6BAAAC,OAAA,MAAAC,CAAA,OAAAD,OAAA,IAAAE,CAAA,OAAAF,OAAA,YAAAP,uBAAA,YAAAA,CAAAK,CAAA,EAAAC,CAAA,SAAAA,CAAA,IAAAD,CAAA,IAAAA,CAAA,CAAAK,UAAA,SAAAL,CAAA,MAAAM,CAAA,EAAAC,CAAA,EAAAC,CAAA,KAAAC,SAAA,QAAAC,OAAA,EAAAV,CAAA,iBAAAA,CAAA,uBAAAA,CAAA,yBAAAA,CAAA,SAAAQ,CAAA,MAAAF,CAAA,GAAAL,CAAA,GAAAG,CAAA,GAAAD,CAAA,QAAAG,CAAA,CAAAK,GAAA,CAAAX,CAAA,UAAAM,CAAA,CAAAM,GAAA,CAAAZ,CAAA,GAAAM,CAAA,CAAAO,GAAA,CAAAb,CAAA,EAAAQ,CAAA,gBAAAP,CAAA,IAAAD,CAAA,gBAAAC,CAAA,OAAAa,cAAA,CAAAC,IAAA,CAAAf,CAAA,EAAAC,CAAA,OAAAM,CAAA,IAAAD,CAAA,GAAAU,MAAA,CAAAC,cAAA,KAAAD,MAAA,CAAAE,wBAAA,CAAAlB,CAAA,EAAAC,CAAA,OAAAM,CAAA,CAAAK,GAAA,IAAAL,CAAA,CAAAM,GAAA,IAAAP,CAAA,CAAAE,CAAA,EAAAP,CAAA,EAAAM,CAAA,IAAAC,CAAA,CAAAP,CAAA,IAAAD,CAAA,CAAAC,CAAA,WAAAO,CAAA,KAAAR,CAAA,EAAAC,CAAA;AAEvB;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACO,SAASkB,mBAAmBA,CAAC;EAAEC;AAAwC,CAAC,EAAE;EAC/E,MAAM,CAACC,KAAK,EAAEC,QAAQ,CAAC,GAAG,IAAAC,eAAQ,EAAwB,EAAE,CAAC;EAE7D,IAAAC,gBAAS,EAAC,MAAM,IAAAC,2BAAe,EAACH,QAAQ,CAAC,EAAE,EAAE,CAAC;EAE9C,MAAMI,IAAI,GAAGL,KAAK,CAAC,CAAC,CAAC;EAErB,oBACE,IAAAtB,WAAA,CAAA4B,IAAA,EAAA5B,WAAA,CAAA6B,QAAA;IAAAR,QAAA,GACGA,QAAQ,EACRM,IAAI,gBAAG,IAAA3B,WAAA,CAAA8B,GAAA,EAACC,SAAS;MAAeC,KAAK,EAAEL;IAAK,GAArBA,IAAI,CAACM,EAAkB,CAAC,GAAG,IAAI;EAAA,CACvD,CAAC;AAEP;AAEA,SAASF,SAASA,CAAC;EAAEC;AAA6B,CAAC,EAAE;EACnD,MAAME,OAAO,GAAGF,KAAK,CAACG,OAAO,CAACC,GAAG,CAACC,0BAAc,CAAC;EACjD,oBACE,IAAArC,WAAA,CAAA8B,GAAA,EAAChC,UAAA,CAAAwC,iBAAiB;IAChBC,KAAK,EAAEP,KAAK,CAACO,KAAM;IACnBC,WAAW,EAAER,KAAK,CAACS,OAAQ;IAC3BP,OAAO,EAAEA,OAAQ;IACjBQ,SAAS,EAAEA,CAAA,KAAM,IAAAC,wBAAY,EAACX,KAAK,CAACC,EAAE;EAAE,CACzC,CAAC;AAEN","ignoreList":[]}
|