@saas-ui/modals 3.0.0-alpha.3 → 3.0.0-alpha.30
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/CHANGELOG.md +295 -0
- package/dist/index.cjs +2 -2
- package/dist/index.cjs.map +1 -1
- package/dist/index.js +2 -2
- package/dist/index.js.map +1 -1
- package/package.json +7 -7
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,277 @@
|
|
|
1
1
|
# @saas-ui/modals
|
|
2
2
|
|
|
3
|
+
## 3.0.0-alpha.30
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- Updated dependencies [0f49a18]
|
|
8
|
+
- @saas-ui/hooks@3.0.0-alpha.5
|
|
9
|
+
- @saas-ui/core@3.0.0-alpha.8
|
|
10
|
+
- @saas-ui/react@3.0.0-alpha.30
|
|
11
|
+
- @saas-ui/forms@3.0.0-alpha.30
|
|
12
|
+
|
|
13
|
+
## 3.0.0-alpha.29
|
|
14
|
+
|
|
15
|
+
### Patch Changes
|
|
16
|
+
|
|
17
|
+
- Updated dependencies
|
|
18
|
+
- Updated dependencies
|
|
19
|
+
- @saas-ui/forms@3.0.0-alpha.29
|
|
20
|
+
- @saas-ui/react@3.0.0-alpha.29
|
|
21
|
+
|
|
22
|
+
## 3.0.0-alpha.28
|
|
23
|
+
|
|
24
|
+
### Patch Changes
|
|
25
|
+
|
|
26
|
+
- Updated dependencies [6a8bf46]
|
|
27
|
+
- Updated dependencies [6a8bf46]
|
|
28
|
+
- @saas-ui/react@3.0.0-alpha.28
|
|
29
|
+
- @saas-ui/forms@3.0.0-alpha.28
|
|
30
|
+
|
|
31
|
+
## 3.0.0-alpha.27
|
|
32
|
+
|
|
33
|
+
### Patch Changes
|
|
34
|
+
|
|
35
|
+
- Updated dependencies [56b0623]
|
|
36
|
+
- Updated dependencies [56b0623]
|
|
37
|
+
- @saas-ui/forms@3.0.0-alpha.27
|
|
38
|
+
- @saas-ui/react@3.0.0-alpha.27
|
|
39
|
+
|
|
40
|
+
## 3.0.0-alpha.26
|
|
41
|
+
|
|
42
|
+
### Patch Changes
|
|
43
|
+
|
|
44
|
+
- Updated dependencies [c51e12c]
|
|
45
|
+
- @saas-ui/react@3.0.0-alpha.26
|
|
46
|
+
- @saas-ui/forms@3.0.0-alpha.26
|
|
47
|
+
|
|
48
|
+
## 3.0.0-alpha.25
|
|
49
|
+
|
|
50
|
+
### Patch Changes
|
|
51
|
+
|
|
52
|
+
- Updated dependencies [8d8ffaa]
|
|
53
|
+
- Updated dependencies [8d8ffaa]
|
|
54
|
+
- Updated dependencies [8d8ffaa]
|
|
55
|
+
- Updated dependencies [8d8ffaa]
|
|
56
|
+
- Updated dependencies [8d8ffaa]
|
|
57
|
+
- @saas-ui/react@3.0.0-alpha.25
|
|
58
|
+
- @saas-ui/forms@3.0.0-alpha.25
|
|
59
|
+
|
|
60
|
+
## 3.0.0-alpha.24
|
|
61
|
+
|
|
62
|
+
### Patch Changes
|
|
63
|
+
|
|
64
|
+
- Updated dependencies [ac2d80d]
|
|
65
|
+
- Updated dependencies [9d47676]
|
|
66
|
+
- @saas-ui/react@3.0.0-alpha.24
|
|
67
|
+
- @saas-ui/forms@3.0.0-alpha.24
|
|
68
|
+
|
|
69
|
+
## 3.0.0-alpha.23
|
|
70
|
+
|
|
71
|
+
### Patch Changes
|
|
72
|
+
|
|
73
|
+
- Updated dependencies [8ac704a]
|
|
74
|
+
- @saas-ui/react@3.0.0-alpha.23
|
|
75
|
+
- @saas-ui/forms@3.0.0-alpha.23
|
|
76
|
+
|
|
77
|
+
## 3.0.0-alpha.22
|
|
78
|
+
|
|
79
|
+
### Major Changes
|
|
80
|
+
|
|
81
|
+
- Renamed ModalOptions.children to ModalOptions.body
|
|
82
|
+
|
|
83
|
+
### Patch Changes
|
|
84
|
+
|
|
85
|
+
- Updated dependencies
|
|
86
|
+
- Updated dependencies
|
|
87
|
+
- Updated dependencies
|
|
88
|
+
- Updated dependencies
|
|
89
|
+
- Updated dependencies
|
|
90
|
+
- Updated dependencies
|
|
91
|
+
- Updated dependencies
|
|
92
|
+
- Updated dependencies
|
|
93
|
+
- Updated dependencies
|
|
94
|
+
- Updated dependencies
|
|
95
|
+
- @saas-ui/react@3.0.0-alpha.22
|
|
96
|
+
- @saas-ui/modals-provider@1.0.0-alpha.4
|
|
97
|
+
- @saas-ui/forms@3.0.0-alpha.22
|
|
98
|
+
|
|
99
|
+
## 3.0.0-alpha.21
|
|
100
|
+
|
|
101
|
+
### Patch Changes
|
|
102
|
+
|
|
103
|
+
- Updated dependencies [6f9f04d]
|
|
104
|
+
- @saas-ui/react@3.0.0-alpha.21
|
|
105
|
+
- @saas-ui/core@3.0.0-alpha.7
|
|
106
|
+
- @saas-ui/forms@3.0.0-alpha.21
|
|
107
|
+
|
|
108
|
+
## 3.0.0-alpha.20
|
|
109
|
+
|
|
110
|
+
### Patch Changes
|
|
111
|
+
|
|
112
|
+
- Updated dependencies [f85d493]
|
|
113
|
+
- Updated dependencies [f85d493]
|
|
114
|
+
- @saas-ui/react@3.0.0-alpha.20
|
|
115
|
+
- @saas-ui/core@3.0.0-alpha.6
|
|
116
|
+
- @saas-ui/forms@3.0.0-alpha.20
|
|
117
|
+
|
|
118
|
+
## 3.0.0-alpha.19
|
|
119
|
+
|
|
120
|
+
### Patch Changes
|
|
121
|
+
|
|
122
|
+
- Updated dependencies [ba3b566]
|
|
123
|
+
- Updated dependencies [38082d4]
|
|
124
|
+
- Updated dependencies [ba3b566]
|
|
125
|
+
- Updated dependencies [ba3b566]
|
|
126
|
+
- Updated dependencies [3a73bc8]
|
|
127
|
+
- Updated dependencies [ba3b566]
|
|
128
|
+
- Updated dependencies [727b902]
|
|
129
|
+
- @saas-ui/react@3.0.0-alpha.19
|
|
130
|
+
- @saas-ui/forms@3.0.0-alpha.19
|
|
131
|
+
|
|
132
|
+
## 3.0.0-alpha.18
|
|
133
|
+
|
|
134
|
+
### Patch Changes
|
|
135
|
+
|
|
136
|
+
- Updated dependencies [eb02362]
|
|
137
|
+
- Updated dependencies [e7fe684]
|
|
138
|
+
- Updated dependencies [eb02362]
|
|
139
|
+
- Updated dependencies [eb02362]
|
|
140
|
+
- @saas-ui/react@3.0.0-alpha.18
|
|
141
|
+
- @saas-ui/core@3.0.0-alpha.5
|
|
142
|
+
- @saas-ui/forms@3.0.0-alpha.18
|
|
143
|
+
|
|
144
|
+
## 3.0.0-alpha.17
|
|
145
|
+
|
|
146
|
+
### Patch Changes
|
|
147
|
+
|
|
148
|
+
- Updated dependencies [a2ef175]
|
|
149
|
+
- @saas-ui/react@3.0.0-alpha.17
|
|
150
|
+
- @saas-ui/forms@3.0.0-alpha.17
|
|
151
|
+
|
|
152
|
+
## 3.0.0-alpha.16
|
|
153
|
+
|
|
154
|
+
### Patch Changes
|
|
155
|
+
|
|
156
|
+
- Updated dependencies [205580d]
|
|
157
|
+
- Updated dependencies [205580d]
|
|
158
|
+
- @saas-ui/react@3.0.0-alpha.16
|
|
159
|
+
- @saas-ui/forms@3.0.0-alpha.16
|
|
160
|
+
|
|
161
|
+
## 3.0.0-alpha.15
|
|
162
|
+
|
|
163
|
+
### Patch Changes
|
|
164
|
+
|
|
165
|
+
- Updated dependencies [2285040]
|
|
166
|
+
- Updated dependencies [2285040]
|
|
167
|
+
- @saas-ui/react@3.0.0-alpha.15
|
|
168
|
+
- @saas-ui/forms@3.0.0-alpha.15
|
|
169
|
+
|
|
170
|
+
## 3.0.0-alpha.14
|
|
171
|
+
|
|
172
|
+
### Patch Changes
|
|
173
|
+
|
|
174
|
+
- Updated dependencies [0067207]
|
|
175
|
+
- Updated dependencies [0067207]
|
|
176
|
+
- @saas-ui/react@3.0.0-alpha.14
|
|
177
|
+
- @saas-ui/forms@3.0.0-alpha.14
|
|
178
|
+
|
|
179
|
+
## 3.0.0-alpha.13
|
|
180
|
+
|
|
181
|
+
### Patch Changes
|
|
182
|
+
|
|
183
|
+
- Updated dependencies [b51aff9]
|
|
184
|
+
- Updated dependencies [b51aff9]
|
|
185
|
+
- Updated dependencies [b51aff9]
|
|
186
|
+
- Updated dependencies [b51aff9]
|
|
187
|
+
- @saas-ui/forms@3.0.0-alpha.13
|
|
188
|
+
- @saas-ui/react@3.0.0-alpha.13
|
|
189
|
+
|
|
190
|
+
## 3.0.0-alpha.12
|
|
191
|
+
|
|
192
|
+
### Patch Changes
|
|
193
|
+
|
|
194
|
+
- Updated dependencies [61ce1b5]
|
|
195
|
+
- @saas-ui/react@3.0.0-alpha.12
|
|
196
|
+
- @saas-ui/forms@3.0.0-alpha.12
|
|
197
|
+
|
|
198
|
+
## 3.0.0-alpha.11
|
|
199
|
+
|
|
200
|
+
### Patch Changes
|
|
201
|
+
|
|
202
|
+
- Updated dependencies [19309d4]
|
|
203
|
+
- Updated dependencies [19309d4]
|
|
204
|
+
- @saas-ui/react@3.0.0-alpha.11
|
|
205
|
+
- @saas-ui/forms@3.0.0-alpha.11
|
|
206
|
+
|
|
207
|
+
## 3.0.0-alpha.10
|
|
208
|
+
|
|
209
|
+
### Patch Changes
|
|
210
|
+
|
|
211
|
+
- Updated dependencies [212a7e6]
|
|
212
|
+
- Updated dependencies [942e9a0]
|
|
213
|
+
- Updated dependencies [212a7e6]
|
|
214
|
+
- Updated dependencies [65fac53]
|
|
215
|
+
- @saas-ui/react@3.0.0-alpha.10
|
|
216
|
+
- @saas-ui/forms@3.0.0-alpha.10
|
|
217
|
+
|
|
218
|
+
## 3.0.0-alpha.9
|
|
219
|
+
|
|
220
|
+
### Patch Changes
|
|
221
|
+
|
|
222
|
+
- Updated dependencies [f0f5ab0]
|
|
223
|
+
- @saas-ui/react@3.0.0-alpha.9
|
|
224
|
+
- @saas-ui/forms@3.0.0-alpha.9
|
|
225
|
+
|
|
226
|
+
## 3.0.0-alpha.8
|
|
227
|
+
|
|
228
|
+
### Patch Changes
|
|
229
|
+
|
|
230
|
+
- Updated dependencies [64e680e]
|
|
231
|
+
- Updated dependencies [64e680e]
|
|
232
|
+
- @saas-ui/react@3.0.0-alpha.8
|
|
233
|
+
- @saas-ui/forms@3.0.0-alpha.8
|
|
234
|
+
|
|
235
|
+
## 3.0.0-alpha.7
|
|
236
|
+
|
|
237
|
+
### Patch Changes
|
|
238
|
+
|
|
239
|
+
- Updated dependencies [8e760c5]
|
|
240
|
+
- @saas-ui/react@3.0.0-alpha.7
|
|
241
|
+
- @saas-ui/forms@3.0.0-alpha.7
|
|
242
|
+
|
|
243
|
+
## 3.0.0-alpha.6
|
|
244
|
+
|
|
245
|
+
### Minor Changes
|
|
246
|
+
|
|
247
|
+
- 95c8652: Update to Chakra UI 3.2.1
|
|
248
|
+
|
|
249
|
+
### Patch Changes
|
|
250
|
+
|
|
251
|
+
- Updated dependencies [95c8652]
|
|
252
|
+
- @saas-ui/modals-provider@1.0.0-alpha.3
|
|
253
|
+
- @saas-ui/forms@3.0.0-alpha.6
|
|
254
|
+
- @saas-ui/hooks@3.0.0-alpha.4
|
|
255
|
+
- @saas-ui/react@3.0.0-alpha.6
|
|
256
|
+
- @saas-ui/core@3.0.0-alpha.4
|
|
257
|
+
|
|
258
|
+
## 3.0.0-alpha.5
|
|
259
|
+
|
|
260
|
+
### Patch Changes
|
|
261
|
+
|
|
262
|
+
- Updated dependencies [e9fec88]
|
|
263
|
+
- Updated dependencies [f62c3d6]
|
|
264
|
+
- @saas-ui/react@3.0.0-alpha.5
|
|
265
|
+
- @saas-ui/forms@3.0.0-alpha.5
|
|
266
|
+
|
|
267
|
+
## 3.0.0-alpha.4
|
|
268
|
+
|
|
269
|
+
### Patch Changes
|
|
270
|
+
|
|
271
|
+
- Updated dependencies [7808a76]
|
|
272
|
+
- @saas-ui/react@3.0.0-alpha.4
|
|
273
|
+
- @saas-ui/forms@3.0.0-alpha.4
|
|
274
|
+
|
|
3
275
|
## 3.0.0-alpha.3
|
|
4
276
|
|
|
5
277
|
### Patch Changes
|
|
@@ -55,6 +327,29 @@
|
|
|
55
327
|
- @saas-ui/react@3.0.0-alpha.0
|
|
56
328
|
- @saas-ui/core@3.0.0-alpha.0
|
|
57
329
|
|
|
330
|
+
## 2.4.4
|
|
331
|
+
|
|
332
|
+
### Patch Changes
|
|
333
|
+
|
|
334
|
+
- Updated dependencies [091fd38]
|
|
335
|
+
- @saas-ui/forms@2.11.0
|
|
336
|
+
|
|
337
|
+
## 2.4.3
|
|
338
|
+
|
|
339
|
+
### Patch Changes
|
|
340
|
+
|
|
341
|
+
- Updated dependencies [eb53116]
|
|
342
|
+
- @saas-ui/forms@2.10.0
|
|
343
|
+
|
|
344
|
+
## 2.4.2
|
|
345
|
+
|
|
346
|
+
### Patch Changes
|
|
347
|
+
|
|
348
|
+
- 862937a: Bump chakra version
|
|
349
|
+
- Updated dependencies [862937a]
|
|
350
|
+
- @saas-ui/react-utils@2.2.1
|
|
351
|
+
- @saas-ui/forms@2.9.1
|
|
352
|
+
|
|
58
353
|
## 2.4.1
|
|
59
354
|
|
|
60
355
|
### Patch Changes
|
package/dist/index.cjs
CHANGED
|
@@ -149,7 +149,7 @@ var Drawer = (props) => {
|
|
|
149
149
|
!hideBackdrop && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_drawer.Drawer.Backdrop, {}),
|
|
150
150
|
/* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(import_drawer.Drawer.Content, { ...contentProps, children: [
|
|
151
151
|
title && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_drawer.Drawer.Header, { ...headerProps, children: title }),
|
|
152
|
-
!hideCloseButton && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_drawer.Drawer.
|
|
152
|
+
!hideCloseButton && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_drawer.Drawer.CloseButton, {}),
|
|
153
153
|
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_drawer.Drawer.Body, { ...bodyProps, children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_drawer.Drawer.Context, { children: ({ open: open2, setOpen }) => (0, import_utils2.runIfFn)(children, { open: open2, setOpen }) }) }),
|
|
154
154
|
footer && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_drawer.Drawer.Footer, { ...footerProps, children: footer })
|
|
155
155
|
] })
|
|
@@ -177,7 +177,7 @@ var Modal = (props) => {
|
|
|
177
177
|
} = props;
|
|
178
178
|
return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_dialog2.Dialog.Root, { open, onOpenChange, ...rest, children: /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_dialog2.Dialog.Content, { ...contentProps, children: [
|
|
179
179
|
title && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_dialog2.Dialog.Header, { ...headerProps, children: title }),
|
|
180
|
-
!hideCloseButton && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_dialog2.Dialog.
|
|
180
|
+
!hideCloseButton && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_dialog2.Dialog.CloseButton, {}),
|
|
181
181
|
/* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_dialog2.Dialog.Body, { children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_dialog2.Dialog.Context, { children: ({ open: open2, setOpen }) => (0, import_utils3.runIfFn)(children, { open: open2, setOpen }) }) }),
|
|
182
182
|
footer && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_dialog2.Dialog.Footer, { ...footerProps, children: footer })
|
|
183
183
|
] }) });
|
package/dist/index.cjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/index.ts","../src/alert-dialog.tsx","../src/drawer.tsx","../src/modal.tsx","../src/default-modals.ts"],"sourcesContent":["import { createModals } from '@saas-ui/modals-provider'\n\nimport { defaultModals } from './default-modals.ts'\n\n// Exporting from './dialog'\nexport { AlertDialog } from './alert-dialog.tsx'\nexport type { AlertDialogProps } from './alert-dialog.tsx'\n\n// Exporting from './drawer'\nexport { Drawer } from './drawer'\nexport type { DrawerProps } from './drawer'\n\n// Exporting from './modal'\nexport { Modal } from './modal'\nexport type { ModalProps } from './modal'\n\n// Exporting from './form'\n// export { FormDialog, createFormDialog } from './form'\n// export type {\n// DefaultFormType,\n// FormDialogFieldOverrides,\n// FormDialogProps,\n// } from './form'\n\n// Exporting from './provider'\n\nconst { useModals, ModalsProvider } = createModals({\n modals: defaultModals,\n})\n\nexport { ModalsProvider, useModals }\n","import * as React from 'react'\n\nimport { Button, ButtonProps, type HTMLChakraProps } from '@chakra-ui/react'\nimport { callAll } from '@saas-ui/core/utils'\nimport { Dialog } from '@saas-ui/react/dialog'\n\nexport interface AlertDialogProps\n extends Omit<\n Dialog.RootProps,\n 'leastDestructiveRef' | 'onOpenChange' | 'open'\n > {\n /**\n * Whether the dialog is open\n */\n open: boolean\n /**\n * Callback when the dialog is opened or closed\n */\n onOpenChange: (details: { open: boolean }) => void\n /**\n * The dialog title\n */\n title?: React.ReactNode\n translations?: {\n cancel?: React.ReactNode\n confirm?: React.ReactNode\n close?: React.ReactNode\n }\n slotProps?: {\n cancel?: ButtonProps\n confirm?: ButtonProps\n footer?: HTMLChakraProps<'div'>\n }\n /**\n * Close the dialog on cancel\n * @default true\n */\n closeOnCancel?: boolean\n /**\n * Close the dialog on confirm\n * @default true\n */\n closeOnConfirm?: boolean\n /**\n * Hide the backdrop\n */\n backdrop?: boolean\n /**\n * Hide the close button\n */\n hideCloseButton?: boolean\n /**\n * Defines which button gets initial focus\n * https://www.w3.org/TR/wai-aria-practices/#alertdialog\n */\n leastDestructiveFocus?: 'cancel' | 'confirm'\n /**\n * Function that's called when cancel is clicked\n */\n onCancel?: () => void\n /**\n * Function that's called when confirm is clicked.\n */\n onConfirm?: () => Promise<void> | void\n}\n\nexport const AlertDialog: React.FC<AlertDialogProps> = (props) => {\n const {\n title,\n translations,\n slotProps,\n open,\n closeOnCancel = true,\n closeOnConfirm = true,\n leastDestructiveFocus = 'cancel',\n onOpenChange,\n onCancel,\n onConfirm,\n children,\n ...rest\n } = props\n\n const cancelRef = React.useRef(null)\n const confirmRef = React.useRef(null)\n const [isLoading, setIsLoading] = React.useState(false)\n\n const handleConfirm = async () => {\n try {\n const result = onConfirm?.()\n if (typeof result?.then === 'function') {\n setIsLoading(true)\n await result\n }\n\n closeOnConfirm && onOpenChange({ open: false })\n /* eslint-disable no-useless-catch */\n } catch (e: any) {\n throw e\n } finally {\n setIsLoading(false)\n }\n /* eslint-enable */\n }\n\n const titleId = React.useId()\n const contentId = React.useId()\n\n return (\n <Dialog.Root\n open={open}\n onOpenChange={onOpenChange}\n size=\"sm\"\n aria-labelledby={titleId}\n aria-describedby={contentId}\n {...rest}\n initialFocusEl={() =>\n leastDestructiveFocus === 'cancel'\n ? cancelRef.current\n : confirmRef.current\n }\n >\n <Dialog.Content>\n <Dialog.Header>\n <Dialog.Title id={titleId}>{title}</Dialog.Title>\n </Dialog.Header>\n\n <Dialog.Body id={contentId}>{children}</Dialog.Body>\n\n <Dialog.Footer {...slotProps?.footer}>\n <Button\n ref={cancelRef}\n variant=\"ghost\"\n colorPalette=\"gray\"\n {...slotProps?.cancel}\n onClick={callAll(slotProps?.cancel?.onClick, () => {\n onCancel?.()\n\n closeOnCancel && onOpenChange({ open: false })\n })}\n >\n {slotProps?.cancel?.children || translations?.cancel || 'Cancel'}\n </Button>\n <Button\n ref={confirmRef}\n variant=\"solid\"\n disabled={isLoading}\n {...slotProps?.confirm}\n onClick={callAll(handleConfirm, slotProps?.confirm?.onClick)}\n >\n {slotProps?.confirm?.children || translations?.confirm || 'OK'}\n </Button>\n </Dialog.Footer>\n </Dialog.Content>\n </Dialog.Root>\n )\n}\n","import * as React from 'react'\n\nimport { type HTMLChakraProps } from '@chakra-ui/react'\nimport { MaybeRenderProp, runIfFn } from '@saas-ui/core/utils'\nimport { Drawer as BaseDrawer } from '@saas-ui/react/drawer'\n\nexport interface DrawerProps extends Omit<BaseDrawer.RootProps, 'children'> {\n /**\n * The drawer title\n */\n title: React.ReactNode\n /**\n * Whether the modal is open\n */\n open: boolean\n /**\n * Callback when the drawer is opened or closed\n */\n onOpenChange: (details: { open: boolean }) => void\n /**\n * The drawer children\n */\n children: MaybeRenderProp<{\n open: boolean\n setOpen: (open: boolean) => void\n }>\n /**\n * The modal footer\n */\n footer?: React.ReactNode\n /**\n * Hide the close button\n */\n hideCloseButton?: boolean\n /**\n * Hide the backdrop\n */\n hideBackdrop?: boolean\n /**\n * Props for the modal header\n */\n headerProps?: HTMLChakraProps<'div'>\n /**\n * Props for the modal content\n */\n contentProps?: BaseDrawer.ContentProps\n /**\n * Props for the modal footer\n */\n footerProps?: HTMLChakraProps<'div'>\n /**\n * Props for the modal body\n */\n bodyProps?: HTMLChakraProps<'div'>\n}\n\nexport const Drawer: React.FC<DrawerProps> = (props) => {\n const {\n title,\n children,\n footer,\n open,\n onOpenChange,\n hideCloseButton,\n hideBackdrop,\n headerProps,\n contentProps,\n bodyProps,\n footerProps,\n ...rest\n } = props\n return (\n <BaseDrawer.Root open={open} onOpenChange={onOpenChange} {...rest}>\n {!hideBackdrop && <BaseDrawer.Backdrop />}\n <BaseDrawer.Content {...contentProps}>\n {title && (\n <BaseDrawer.Header {...headerProps}>{title}</BaseDrawer.Header>\n )}\n {!hideCloseButton && <BaseDrawer.CloseTrigger />}\n <BaseDrawer.Body {...bodyProps}>\n <BaseDrawer.Context>\n {({ open, setOpen }) => runIfFn(children, { open, setOpen })}\n </BaseDrawer.Context>\n </BaseDrawer.Body>\n {footer && (\n <BaseDrawer.Footer {...footerProps}>{footer}</BaseDrawer.Footer>\n )}\n </BaseDrawer.Content>\n </BaseDrawer.Root>\n )\n}\n","import * as React from 'react'\n\nimport type { HTMLChakraProps } from '@chakra-ui/react'\nimport { MaybeRenderProp, runIfFn } from '@saas-ui/core/utils'\nimport { Dialog as BaseDialog } from '@saas-ui/react/dialog'\n\nexport interface ModalProps extends Omit<BaseDialog.RootProps, 'children'> {\n /**\n * The modal title\n */\n title?: React.ReactNode\n /**\n * Whether the modal is open\n */\n open: boolean\n /**\n * Callback when the modal is opened or closed\n */\n onOpenChange: (details: { open: boolean }) => void\n /**\n * The modal children\n */\n children: MaybeRenderProp<{\n open: boolean\n setOpen: (open: boolean) => void\n }>\n /**\n * The modal footer\n */\n footer?: React.ReactNode\n /**\n * Hide the close button\n */\n hideCloseButton?: boolean\n /**\n * Hide the overlay\n */\n hideBackdrop?: boolean\n /**\n * Props for the modal header\n */\n headerProps?: HTMLChakraProps<'div'>\n /**\n * Props for the modal content\n */\n contentProps?: HTMLChakraProps<'div'>\n /**\n * Props for the modal body\n */\n bodyProps?: HTMLChakraProps<'div'>\n /**\n * Props for the modal footer\n */\n footerProps?: HTMLChakraProps<'div'>\n}\n\nexport const Modal: React.FC<ModalProps> = (props) => {\n const {\n title,\n footer,\n children,\n open,\n onOpenChange,\n hideCloseButton,\n hideBackdrop,\n headerProps,\n contentProps,\n bodyProps,\n footerProps,\n ...rest\n } = props\n return (\n <BaseDialog.Root open={open} onOpenChange={onOpenChange} {...rest}>\n <BaseDialog.Content {...contentProps}>\n {title && (\n <BaseDialog.Header {...headerProps}>{title}</BaseDialog.Header>\n )}\n {!hideCloseButton && <BaseDialog.CloseTrigger />}\n <BaseDialog.Body>\n <BaseDialog.Context>\n {({ open, setOpen }) => runIfFn(children, { open, setOpen })}\n </BaseDialog.Context>\n </BaseDialog.Body>\n {footer && (\n <BaseDialog.Footer {...footerProps}>{footer}</BaseDialog.Footer>\n )}\n </BaseDialog.Content>\n </BaseDialog.Root>\n )\n}\n","import { AlertDialog } from './alert-dialog'\nimport { Drawer } from './drawer'\nimport { Modal } from './modal'\n\nexport const defaultModals = {\n alert: AlertDialog,\n confirm: AlertDialog,\n drawer: Drawer,\n modal: Modal,\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,6BAA6B;;;ACA7B,YAAuB;AAEvB,mBAA0D;AAC1D,mBAAwB;AACxB,oBAAuB;AAuHb;AAzDH,IAAM,cAA0C,CAAC,UAAU;AAlElE;AAmEE,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,gBAAgB;AAAA,IAChB,iBAAiB;AAAA,IACjB,wBAAwB;AAAA,IACxB;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EACL,IAAI;AAEJ,QAAM,YAAkB,aAAO,IAAI;AACnC,QAAM,aAAmB,aAAO,IAAI;AACpC,QAAM,CAAC,WAAW,YAAY,IAAU,eAAS,KAAK;AAEtD,QAAM,gBAAgB,YAAY;AAChC,QAAI;AACF,YAAM,SAAS;AACf,UAAI,QAAO,iCAAQ,UAAS,YAAY;AACtC,qBAAa,IAAI;AACjB,cAAM;AAAA,MACR;AAEA,wBAAkB,aAAa,EAAE,MAAM,MAAM,CAAC;AAAA,IAEhD,SAAS,GAAQ;AACf,YAAM;AAAA,IACR,UAAE;AACA,mBAAa,KAAK;AAAA,IACpB;AAAA,EAEF;AAEA,QAAM,UAAgB,YAAM;AAC5B,QAAM,YAAkB,YAAM;AAE9B,SACE;AAAA,IAAC,qBAAO;AAAA,IAAP;AAAA,MACC;AAAA,MACA;AAAA,MACA,MAAK;AAAA,MACL,mBAAiB;AAAA,MACjB,oBAAkB;AAAA,MACjB,GAAG;AAAA,MACJ,gBAAgB,MACd,0BAA0B,WACtB,UAAU,UACV,WAAW;AAAA,MAGjB,uDAAC,qBAAO,SAAP,EACC;AAAA,oDAAC,qBAAO,QAAP,EACC,sDAAC,qBAAO,OAAP,EAAa,IAAI,SAAU,iBAAM,GACpC;AAAA,QAEA,4CAAC,qBAAO,MAAP,EAAY,IAAI,WAAY,UAAS;AAAA,QAEtC,6CAAC,qBAAO,QAAP,EAAe,GAAG,uCAAW,QAC5B;AAAA;AAAA,YAAC;AAAA;AAAA,cACC,KAAK;AAAA,cACL,SAAQ;AAAA,cACR,cAAa;AAAA,cACZ,GAAG,uCAAW;AAAA,cACf,aAAS,uBAAQ,4CAAW,WAAX,mBAAmB,SAAS,MAAM;AACjD;AAEA,iCAAiB,aAAa,EAAE,MAAM,MAAM,CAAC;AAAA,cAC/C,CAAC;AAAA,cAEA,wDAAW,WAAX,mBAAmB,cAAY,6CAAc,WAAU;AAAA;AAAA,UAC1D;AAAA,UACA;AAAA,YAAC;AAAA;AAAA,cACC,KAAK;AAAA,cACL,SAAQ;AAAA,cACR,UAAU;AAAA,cACT,GAAG,uCAAW;AAAA,cACf,aAAS,sBAAQ,gBAAe,4CAAW,YAAX,mBAAoB,OAAO;AAAA,cAE1D,wDAAW,YAAX,mBAAoB,cAAY,6CAAc,YAAW;AAAA;AAAA,UAC5D;AAAA,WACF;AAAA,SACF;AAAA;AAAA,EACF;AAEJ;;;ACxJA,IAAAA,gBAAyC;AACzC,oBAAqC;AAqEb,IAAAC,sBAAA;AAjBjB,IAAM,SAAgC,CAAC,UAAU;AACtD,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EACL,IAAI;AACJ,SACE,8CAAC,cAAAC,OAAW,MAAX,EAAgB,MAAY,cAA6B,GAAG,MAC1D;AAAA,KAAC,gBAAgB,6CAAC,cAAAA,OAAW,UAAX,EAAoB;AAAA,IACvC,8CAAC,cAAAA,OAAW,SAAX,EAAoB,GAAG,cACrB;AAAA,eACC,6CAAC,cAAAA,OAAW,QAAX,EAAmB,GAAG,aAAc,iBAAM;AAAA,MAE5C,CAAC,mBAAmB,6CAAC,cAAAA,OAAW,cAAX,EAAwB;AAAA,MAC9C,6CAAC,cAAAA,OAAW,MAAX,EAAiB,GAAG,WACnB,uDAAC,cAAAA,OAAW,SAAX,EACE,WAAC,EAAE,MAAAC,OAAM,QAAQ,UAAM,uBAAQ,UAAU,EAAE,MAAAA,OAAM,QAAQ,CAAC,GAC7D,GACF;AAAA,MACC,UACC,6CAAC,cAAAD,OAAW,QAAX,EAAmB,GAAG,aAAc,kBAAO;AAAA,OAEhD;AAAA,KACF;AAEJ;;;ACvFA,IAAAE,gBAAyC;AACzC,IAAAC,iBAAqC;AAqE/B,IAAAC,sBAAA;AAjBC,IAAM,QAA8B,CAAC,UAAU;AACpD,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EACL,IAAI;AACJ,SACE,6CAAC,eAAAC,OAAW,MAAX,EAAgB,MAAY,cAA6B,GAAG,MAC3D,wDAAC,eAAAA,OAAW,SAAX,EAAoB,GAAG,cACrB;AAAA,aACC,6CAAC,eAAAA,OAAW,QAAX,EAAmB,GAAG,aAAc,iBAAM;AAAA,IAE5C,CAAC,mBAAmB,6CAAC,eAAAA,OAAW,cAAX,EAAwB;AAAA,IAC9C,6CAAC,eAAAA,OAAW,MAAX,EACC,uDAAC,eAAAA,OAAW,SAAX,EACE,WAAC,EAAE,MAAAC,OAAM,QAAQ,UAAM,uBAAQ,UAAU,EAAE,MAAAA,OAAM,QAAQ,CAAC,GAC7D,GACF;AAAA,IACC,UACC,6CAAC,eAAAD,OAAW,QAAX,EAAmB,GAAG,aAAc,kBAAO;AAAA,KAEhD,GACF;AAEJ;;;ACrFO,IAAM,gBAAgB;AAAA,EAC3B,OAAO;AAAA,EACP,SAAS;AAAA,EACT,QAAQ;AAAA,EACR,OAAO;AACT;;;AJiBA,IAAM,EAAE,WAAW,eAAe,QAAI,qCAAa;AAAA,EACjD,QAAQ;AACV,CAAC;","names":["import_utils","import_jsx_runtime","BaseDrawer","open","import_utils","import_dialog","import_jsx_runtime","BaseDialog","open"]}
|
|
1
|
+
{"version":3,"sources":["../src/index.ts","../src/alert-dialog.tsx","../src/drawer.tsx","../src/modal.tsx","../src/default-modals.ts"],"sourcesContent":["import { createModals } from '@saas-ui/modals-provider'\n\nimport { defaultModals } from './default-modals.ts'\n\n// Exporting from './dialog'\nexport { AlertDialog } from './alert-dialog.tsx'\nexport type { AlertDialogProps } from './alert-dialog.tsx'\n\n// Exporting from './drawer'\nexport { Drawer } from './drawer'\nexport type { DrawerProps } from './drawer'\n\n// Exporting from './modal'\nexport { Modal } from './modal'\nexport type { ModalProps } from './modal'\n\n// Exporting from './form'\n// export { FormDialog, createFormDialog } from './form'\n// export type {\n// DefaultFormType,\n// FormDialogFieldOverrides,\n// FormDialogProps,\n// } from './form'\n\n// Exporting from './provider'\n\nconst { useModals, ModalsProvider } = createModals({\n modals: defaultModals,\n})\n\nexport { ModalsProvider, useModals }\n","import * as React from 'react'\n\nimport { Button, ButtonProps, type HTMLChakraProps } from '@chakra-ui/react'\nimport { callAll } from '@saas-ui/core/utils'\nimport { Dialog } from '@saas-ui/react/dialog'\n\nexport interface AlertDialogProps\n extends Omit<\n Dialog.RootProps,\n 'leastDestructiveRef' | 'onOpenChange' | 'open'\n > {\n /**\n * Whether the dialog is open\n */\n open: boolean\n /**\n * Callback when the dialog is opened or closed\n */\n onOpenChange: (details: { open: boolean }) => void\n /**\n * The dialog title\n */\n title?: React.ReactNode\n translations?: {\n cancel?: React.ReactNode\n confirm?: React.ReactNode\n close?: React.ReactNode\n }\n slotProps?: {\n cancel?: ButtonProps\n confirm?: ButtonProps\n footer?: HTMLChakraProps<'div'>\n }\n /**\n * Close the dialog on cancel\n * @default true\n */\n closeOnCancel?: boolean\n /**\n * Close the dialog on confirm\n * @default true\n */\n closeOnConfirm?: boolean\n /**\n * Hide the backdrop\n */\n backdrop?: boolean\n /**\n * Hide the close button\n */\n hideCloseButton?: boolean\n /**\n * Defines which button gets initial focus\n * https://www.w3.org/TR/wai-aria-practices/#alertdialog\n */\n leastDestructiveFocus?: 'cancel' | 'confirm'\n /**\n * Function that's called when cancel is clicked\n */\n onCancel?: () => void\n /**\n * Function that's called when confirm is clicked.\n */\n onConfirm?: () => Promise<void> | void\n}\n\nexport const AlertDialog: React.FC<AlertDialogProps> = (props) => {\n const {\n title,\n translations,\n slotProps,\n open,\n closeOnCancel = true,\n closeOnConfirm = true,\n leastDestructiveFocus = 'cancel',\n onOpenChange,\n onCancel,\n onConfirm,\n children,\n ...rest\n } = props\n\n const cancelRef = React.useRef(null)\n const confirmRef = React.useRef(null)\n const [isLoading, setIsLoading] = React.useState(false)\n\n const handleConfirm = async () => {\n try {\n const result = onConfirm?.()\n if (typeof result?.then === 'function') {\n setIsLoading(true)\n await result\n }\n\n closeOnConfirm && onOpenChange({ open: false })\n /* eslint-disable no-useless-catch */\n } catch (e: any) {\n throw e\n } finally {\n setIsLoading(false)\n }\n /* eslint-enable */\n }\n\n const titleId = React.useId()\n const contentId = React.useId()\n\n return (\n <Dialog.Root\n open={open}\n onOpenChange={onOpenChange}\n size=\"sm\"\n aria-labelledby={titleId}\n aria-describedby={contentId}\n {...rest}\n initialFocusEl={() =>\n leastDestructiveFocus === 'cancel'\n ? cancelRef.current\n : confirmRef.current\n }\n >\n <Dialog.Content>\n <Dialog.Header>\n <Dialog.Title id={titleId}>{title}</Dialog.Title>\n </Dialog.Header>\n\n <Dialog.Body id={contentId}>{children}</Dialog.Body>\n\n <Dialog.Footer {...slotProps?.footer}>\n <Button\n ref={cancelRef}\n variant=\"ghost\"\n colorPalette=\"gray\"\n {...slotProps?.cancel}\n onClick={callAll(slotProps?.cancel?.onClick, () => {\n onCancel?.()\n\n closeOnCancel && onOpenChange({ open: false })\n })}\n >\n {slotProps?.cancel?.children || translations?.cancel || 'Cancel'}\n </Button>\n <Button\n ref={confirmRef}\n variant=\"solid\"\n disabled={isLoading}\n {...slotProps?.confirm}\n onClick={callAll(handleConfirm, slotProps?.confirm?.onClick)}\n >\n {slotProps?.confirm?.children || translations?.confirm || 'OK'}\n </Button>\n </Dialog.Footer>\n </Dialog.Content>\n </Dialog.Root>\n )\n}\n","import * as React from 'react'\n\nimport { type HTMLChakraProps } from '@chakra-ui/react'\nimport { MaybeRenderProp, runIfFn } from '@saas-ui/core/utils'\nimport { Drawer as BaseDrawer } from '@saas-ui/react/drawer'\n\nexport interface DrawerProps extends Omit<BaseDrawer.RootProps, 'children'> {\n /**\n * The drawer title\n */\n title: React.ReactNode\n /**\n * Whether the modal is open\n */\n open: boolean\n /**\n * Callback when the drawer is opened or closed\n */\n onOpenChange: (details: { open: boolean }) => void\n /**\n * The drawer children\n */\n children: MaybeRenderProp<{\n open: boolean\n setOpen: (open: boolean) => void\n }>\n /**\n * The modal footer\n */\n footer?: React.ReactNode\n /**\n * Hide the close button\n */\n hideCloseButton?: boolean\n /**\n * Hide the backdrop\n */\n hideBackdrop?: boolean\n /**\n * Props for the modal header\n */\n headerProps?: HTMLChakraProps<'div'>\n /**\n * Props for the modal content\n */\n contentProps?: BaseDrawer.ContentProps\n /**\n * Props for the modal footer\n */\n footerProps?: HTMLChakraProps<'div'>\n /**\n * Props for the modal body\n */\n bodyProps?: HTMLChakraProps<'div'>\n}\n\nexport const Drawer: React.FC<DrawerProps> = (props) => {\n const {\n title,\n children,\n footer,\n open,\n onOpenChange,\n hideCloseButton,\n hideBackdrop,\n headerProps,\n contentProps,\n bodyProps,\n footerProps,\n ...rest\n } = props\n return (\n <BaseDrawer.Root open={open} onOpenChange={onOpenChange} {...rest}>\n {!hideBackdrop && <BaseDrawer.Backdrop />}\n <BaseDrawer.Content {...contentProps}>\n {title && (\n <BaseDrawer.Header {...headerProps}>{title}</BaseDrawer.Header>\n )}\n {!hideCloseButton && <BaseDrawer.CloseButton />}\n <BaseDrawer.Body {...bodyProps}>\n <BaseDrawer.Context>\n {({ open, setOpen }) => runIfFn(children, { open, setOpen })}\n </BaseDrawer.Context>\n </BaseDrawer.Body>\n {footer && (\n <BaseDrawer.Footer {...footerProps}>{footer}</BaseDrawer.Footer>\n )}\n </BaseDrawer.Content>\n </BaseDrawer.Root>\n )\n}\n","import * as React from 'react'\n\nimport type { HTMLChakraProps } from '@chakra-ui/react'\nimport { MaybeRenderProp, runIfFn } from '@saas-ui/core/utils'\nimport { Dialog as BaseDialog } from '@saas-ui/react/dialog'\n\nexport interface ModalProps extends Omit<BaseDialog.RootProps, 'children'> {\n /**\n * The modal title\n */\n title?: React.ReactNode\n /**\n * Whether the modal is open\n */\n open: boolean\n /**\n * Callback when the modal is opened or closed\n */\n onOpenChange: (details: { open: boolean }) => void\n /**\n * The modal children\n */\n children: MaybeRenderProp<{\n open: boolean\n setOpen: (open: boolean) => void\n }>\n /**\n * The modal footer\n */\n footer?: React.ReactNode\n /**\n * Hide the close button\n */\n hideCloseButton?: boolean\n /**\n * Hide the overlay\n */\n hideBackdrop?: boolean\n /**\n * Props for the modal header\n */\n headerProps?: HTMLChakraProps<'div'>\n /**\n * Props for the modal content\n */\n contentProps?: HTMLChakraProps<'div'>\n /**\n * Props for the modal body\n */\n bodyProps?: HTMLChakraProps<'div'>\n /**\n * Props for the modal footer\n */\n footerProps?: HTMLChakraProps<'div'>\n}\n\nexport const Modal: React.FC<ModalProps> = (props) => {\n const {\n title,\n footer,\n children,\n open,\n onOpenChange,\n hideCloseButton,\n hideBackdrop,\n headerProps,\n contentProps,\n bodyProps,\n footerProps,\n ...rest\n } = props\n return (\n <BaseDialog.Root open={open} onOpenChange={onOpenChange} {...rest}>\n <BaseDialog.Content {...contentProps}>\n {title && (\n <BaseDialog.Header {...headerProps}>{title}</BaseDialog.Header>\n )}\n {!hideCloseButton && <BaseDialog.CloseButton />}\n <BaseDialog.Body>\n <BaseDialog.Context>\n {({ open, setOpen }) => runIfFn(children, { open, setOpen })}\n </BaseDialog.Context>\n </BaseDialog.Body>\n {footer && (\n <BaseDialog.Footer {...footerProps}>{footer}</BaseDialog.Footer>\n )}\n </BaseDialog.Content>\n </BaseDialog.Root>\n )\n}\n","import { AlertDialog } from './alert-dialog'\nimport { Drawer } from './drawer'\nimport { Modal } from './modal'\n\nexport const defaultModals = {\n alert: AlertDialog,\n confirm: AlertDialog,\n drawer: Drawer,\n modal: Modal,\n}\n"],"mappings":"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","names":["import_utils","import_jsx_runtime","BaseDrawer","open","import_utils","import_dialog","import_jsx_runtime","BaseDialog","open"]}
|
package/dist/index.js
CHANGED
|
@@ -112,7 +112,7 @@ var Drawer = (props) => {
|
|
|
112
112
|
!hideBackdrop && /* @__PURE__ */ jsx2(BaseDrawer.Backdrop, {}),
|
|
113
113
|
/* @__PURE__ */ jsxs2(BaseDrawer.Content, { ...contentProps, children: [
|
|
114
114
|
title && /* @__PURE__ */ jsx2(BaseDrawer.Header, { ...headerProps, children: title }),
|
|
115
|
-
!hideCloseButton && /* @__PURE__ */ jsx2(BaseDrawer.
|
|
115
|
+
!hideCloseButton && /* @__PURE__ */ jsx2(BaseDrawer.CloseButton, {}),
|
|
116
116
|
/* @__PURE__ */ jsx2(BaseDrawer.Body, { ...bodyProps, children: /* @__PURE__ */ jsx2(BaseDrawer.Context, { children: ({ open: open2, setOpen }) => runIfFn(children, { open: open2, setOpen }) }) }),
|
|
117
117
|
footer && /* @__PURE__ */ jsx2(BaseDrawer.Footer, { ...footerProps, children: footer })
|
|
118
118
|
] })
|
|
@@ -140,7 +140,7 @@ var Modal = (props) => {
|
|
|
140
140
|
} = props;
|
|
141
141
|
return /* @__PURE__ */ jsx3(BaseDialog.Root, { open, onOpenChange, ...rest, children: /* @__PURE__ */ jsxs3(BaseDialog.Content, { ...contentProps, children: [
|
|
142
142
|
title && /* @__PURE__ */ jsx3(BaseDialog.Header, { ...headerProps, children: title }),
|
|
143
|
-
!hideCloseButton && /* @__PURE__ */ jsx3(BaseDialog.
|
|
143
|
+
!hideCloseButton && /* @__PURE__ */ jsx3(BaseDialog.CloseButton, {}),
|
|
144
144
|
/* @__PURE__ */ jsx3(BaseDialog.Body, { children: /* @__PURE__ */ jsx3(BaseDialog.Context, { children: ({ open: open2, setOpen }) => runIfFn2(children, { open: open2, setOpen }) }) }),
|
|
145
145
|
footer && /* @__PURE__ */ jsx3(BaseDialog.Footer, { ...footerProps, children: footer })
|
|
146
146
|
] }) });
|
package/dist/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/index.ts","../src/alert-dialog.tsx","../src/drawer.tsx","../src/modal.tsx","../src/default-modals.ts"],"sourcesContent":["import { createModals } from '@saas-ui/modals-provider'\n\nimport { defaultModals } from './default-modals.ts'\n\n// Exporting from './dialog'\nexport { AlertDialog } from './alert-dialog.tsx'\nexport type { AlertDialogProps } from './alert-dialog.tsx'\n\n// Exporting from './drawer'\nexport { Drawer } from './drawer'\nexport type { DrawerProps } from './drawer'\n\n// Exporting from './modal'\nexport { Modal } from './modal'\nexport type { ModalProps } from './modal'\n\n// Exporting from './form'\n// export { FormDialog, createFormDialog } from './form'\n// export type {\n// DefaultFormType,\n// FormDialogFieldOverrides,\n// FormDialogProps,\n// } from './form'\n\n// Exporting from './provider'\n\nconst { useModals, ModalsProvider } = createModals({\n modals: defaultModals,\n})\n\nexport { ModalsProvider, useModals }\n","import * as React from 'react'\n\nimport { Button, ButtonProps, type HTMLChakraProps } from '@chakra-ui/react'\nimport { callAll } from '@saas-ui/core/utils'\nimport { Dialog } from '@saas-ui/react/dialog'\n\nexport interface AlertDialogProps\n extends Omit<\n Dialog.RootProps,\n 'leastDestructiveRef' | 'onOpenChange' | 'open'\n > {\n /**\n * Whether the dialog is open\n */\n open: boolean\n /**\n * Callback when the dialog is opened or closed\n */\n onOpenChange: (details: { open: boolean }) => void\n /**\n * The dialog title\n */\n title?: React.ReactNode\n translations?: {\n cancel?: React.ReactNode\n confirm?: React.ReactNode\n close?: React.ReactNode\n }\n slotProps?: {\n cancel?: ButtonProps\n confirm?: ButtonProps\n footer?: HTMLChakraProps<'div'>\n }\n /**\n * Close the dialog on cancel\n * @default true\n */\n closeOnCancel?: boolean\n /**\n * Close the dialog on confirm\n * @default true\n */\n closeOnConfirm?: boolean\n /**\n * Hide the backdrop\n */\n backdrop?: boolean\n /**\n * Hide the close button\n */\n hideCloseButton?: boolean\n /**\n * Defines which button gets initial focus\n * https://www.w3.org/TR/wai-aria-practices/#alertdialog\n */\n leastDestructiveFocus?: 'cancel' | 'confirm'\n /**\n * Function that's called when cancel is clicked\n */\n onCancel?: () => void\n /**\n * Function that's called when confirm is clicked.\n */\n onConfirm?: () => Promise<void> | void\n}\n\nexport const AlertDialog: React.FC<AlertDialogProps> = (props) => {\n const {\n title,\n translations,\n slotProps,\n open,\n closeOnCancel = true,\n closeOnConfirm = true,\n leastDestructiveFocus = 'cancel',\n onOpenChange,\n onCancel,\n onConfirm,\n children,\n ...rest\n } = props\n\n const cancelRef = React.useRef(null)\n const confirmRef = React.useRef(null)\n const [isLoading, setIsLoading] = React.useState(false)\n\n const handleConfirm = async () => {\n try {\n const result = onConfirm?.()\n if (typeof result?.then === 'function') {\n setIsLoading(true)\n await result\n }\n\n closeOnConfirm && onOpenChange({ open: false })\n /* eslint-disable no-useless-catch */\n } catch (e: any) {\n throw e\n } finally {\n setIsLoading(false)\n }\n /* eslint-enable */\n }\n\n const titleId = React.useId()\n const contentId = React.useId()\n\n return (\n <Dialog.Root\n open={open}\n onOpenChange={onOpenChange}\n size=\"sm\"\n aria-labelledby={titleId}\n aria-describedby={contentId}\n {...rest}\n initialFocusEl={() =>\n leastDestructiveFocus === 'cancel'\n ? cancelRef.current\n : confirmRef.current\n }\n >\n <Dialog.Content>\n <Dialog.Header>\n <Dialog.Title id={titleId}>{title}</Dialog.Title>\n </Dialog.Header>\n\n <Dialog.Body id={contentId}>{children}</Dialog.Body>\n\n <Dialog.Footer {...slotProps?.footer}>\n <Button\n ref={cancelRef}\n variant=\"ghost\"\n colorPalette=\"gray\"\n {...slotProps?.cancel}\n onClick={callAll(slotProps?.cancel?.onClick, () => {\n onCancel?.()\n\n closeOnCancel && onOpenChange({ open: false })\n })}\n >\n {slotProps?.cancel?.children || translations?.cancel || 'Cancel'}\n </Button>\n <Button\n ref={confirmRef}\n variant=\"solid\"\n disabled={isLoading}\n {...slotProps?.confirm}\n onClick={callAll(handleConfirm, slotProps?.confirm?.onClick)}\n >\n {slotProps?.confirm?.children || translations?.confirm || 'OK'}\n </Button>\n </Dialog.Footer>\n </Dialog.Content>\n </Dialog.Root>\n )\n}\n","import * as React from 'react'\n\nimport { type HTMLChakraProps } from '@chakra-ui/react'\nimport { MaybeRenderProp, runIfFn } from '@saas-ui/core/utils'\nimport { Drawer as BaseDrawer } from '@saas-ui/react/drawer'\n\nexport interface DrawerProps extends Omit<BaseDrawer.RootProps, 'children'> {\n /**\n * The drawer title\n */\n title: React.ReactNode\n /**\n * Whether the modal is open\n */\n open: boolean\n /**\n * Callback when the drawer is opened or closed\n */\n onOpenChange: (details: { open: boolean }) => void\n /**\n * The drawer children\n */\n children: MaybeRenderProp<{\n open: boolean\n setOpen: (open: boolean) => void\n }>\n /**\n * The modal footer\n */\n footer?: React.ReactNode\n /**\n * Hide the close button\n */\n hideCloseButton?: boolean\n /**\n * Hide the backdrop\n */\n hideBackdrop?: boolean\n /**\n * Props for the modal header\n */\n headerProps?: HTMLChakraProps<'div'>\n /**\n * Props for the modal content\n */\n contentProps?: BaseDrawer.ContentProps\n /**\n * Props for the modal footer\n */\n footerProps?: HTMLChakraProps<'div'>\n /**\n * Props for the modal body\n */\n bodyProps?: HTMLChakraProps<'div'>\n}\n\nexport const Drawer: React.FC<DrawerProps> = (props) => {\n const {\n title,\n children,\n footer,\n open,\n onOpenChange,\n hideCloseButton,\n hideBackdrop,\n headerProps,\n contentProps,\n bodyProps,\n footerProps,\n ...rest\n } = props\n return (\n <BaseDrawer.Root open={open} onOpenChange={onOpenChange} {...rest}>\n {!hideBackdrop && <BaseDrawer.Backdrop />}\n <BaseDrawer.Content {...contentProps}>\n {title && (\n <BaseDrawer.Header {...headerProps}>{title}</BaseDrawer.Header>\n )}\n {!hideCloseButton && <BaseDrawer.CloseTrigger />}\n <BaseDrawer.Body {...bodyProps}>\n <BaseDrawer.Context>\n {({ open, setOpen }) => runIfFn(children, { open, setOpen })}\n </BaseDrawer.Context>\n </BaseDrawer.Body>\n {footer && (\n <BaseDrawer.Footer {...footerProps}>{footer}</BaseDrawer.Footer>\n )}\n </BaseDrawer.Content>\n </BaseDrawer.Root>\n )\n}\n","import * as React from 'react'\n\nimport type { HTMLChakraProps } from '@chakra-ui/react'\nimport { MaybeRenderProp, runIfFn } from '@saas-ui/core/utils'\nimport { Dialog as BaseDialog } from '@saas-ui/react/dialog'\n\nexport interface ModalProps extends Omit<BaseDialog.RootProps, 'children'> {\n /**\n * The modal title\n */\n title?: React.ReactNode\n /**\n * Whether the modal is open\n */\n open: boolean\n /**\n * Callback when the modal is opened or closed\n */\n onOpenChange: (details: { open: boolean }) => void\n /**\n * The modal children\n */\n children: MaybeRenderProp<{\n open: boolean\n setOpen: (open: boolean) => void\n }>\n /**\n * The modal footer\n */\n footer?: React.ReactNode\n /**\n * Hide the close button\n */\n hideCloseButton?: boolean\n /**\n * Hide the overlay\n */\n hideBackdrop?: boolean\n /**\n * Props for the modal header\n */\n headerProps?: HTMLChakraProps<'div'>\n /**\n * Props for the modal content\n */\n contentProps?: HTMLChakraProps<'div'>\n /**\n * Props for the modal body\n */\n bodyProps?: HTMLChakraProps<'div'>\n /**\n * Props for the modal footer\n */\n footerProps?: HTMLChakraProps<'div'>\n}\n\nexport const Modal: React.FC<ModalProps> = (props) => {\n const {\n title,\n footer,\n children,\n open,\n onOpenChange,\n hideCloseButton,\n hideBackdrop,\n headerProps,\n contentProps,\n bodyProps,\n footerProps,\n ...rest\n } = props\n return (\n <BaseDialog.Root open={open} onOpenChange={onOpenChange} {...rest}>\n <BaseDialog.Content {...contentProps}>\n {title && (\n <BaseDialog.Header {...headerProps}>{title}</BaseDialog.Header>\n )}\n {!hideCloseButton && <BaseDialog.CloseTrigger />}\n <BaseDialog.Body>\n <BaseDialog.Context>\n {({ open, setOpen }) => runIfFn(children, { open, setOpen })}\n </BaseDialog.Context>\n </BaseDialog.Body>\n {footer && (\n <BaseDialog.Footer {...footerProps}>{footer}</BaseDialog.Footer>\n )}\n </BaseDialog.Content>\n </BaseDialog.Root>\n )\n}\n","import { AlertDialog } from './alert-dialog'\nimport { Drawer } from './drawer'\nimport { Modal } from './modal'\n\nexport const defaultModals = {\n alert: AlertDialog,\n confirm: AlertDialog,\n drawer: Drawer,\n modal: Modal,\n}\n"],"mappings":"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","names":["jsx","jsxs","open","runIfFn","jsx","jsxs","open"]}
|
|
1
|
+
{"version":3,"sources":["../src/index.ts","../src/alert-dialog.tsx","../src/drawer.tsx","../src/modal.tsx","../src/default-modals.ts"],"sourcesContent":["import { createModals } from '@saas-ui/modals-provider'\n\nimport { defaultModals } from './default-modals.ts'\n\n// Exporting from './dialog'\nexport { AlertDialog } from './alert-dialog.tsx'\nexport type { AlertDialogProps } from './alert-dialog.tsx'\n\n// Exporting from './drawer'\nexport { Drawer } from './drawer'\nexport type { DrawerProps } from './drawer'\n\n// Exporting from './modal'\nexport { Modal } from './modal'\nexport type { ModalProps } from './modal'\n\n// Exporting from './form'\n// export { FormDialog, createFormDialog } from './form'\n// export type {\n// DefaultFormType,\n// FormDialogFieldOverrides,\n// FormDialogProps,\n// } from './form'\n\n// Exporting from './provider'\n\nconst { useModals, ModalsProvider } = createModals({\n modals: defaultModals,\n})\n\nexport { ModalsProvider, useModals }\n","import * as React from 'react'\n\nimport { Button, ButtonProps, type HTMLChakraProps } from '@chakra-ui/react'\nimport { callAll } from '@saas-ui/core/utils'\nimport { Dialog } from '@saas-ui/react/dialog'\n\nexport interface AlertDialogProps\n extends Omit<\n Dialog.RootProps,\n 'leastDestructiveRef' | 'onOpenChange' | 'open'\n > {\n /**\n * Whether the dialog is open\n */\n open: boolean\n /**\n * Callback when the dialog is opened or closed\n */\n onOpenChange: (details: { open: boolean }) => void\n /**\n * The dialog title\n */\n title?: React.ReactNode\n translations?: {\n cancel?: React.ReactNode\n confirm?: React.ReactNode\n close?: React.ReactNode\n }\n slotProps?: {\n cancel?: ButtonProps\n confirm?: ButtonProps\n footer?: HTMLChakraProps<'div'>\n }\n /**\n * Close the dialog on cancel\n * @default true\n */\n closeOnCancel?: boolean\n /**\n * Close the dialog on confirm\n * @default true\n */\n closeOnConfirm?: boolean\n /**\n * Hide the backdrop\n */\n backdrop?: boolean\n /**\n * Hide the close button\n */\n hideCloseButton?: boolean\n /**\n * Defines which button gets initial focus\n * https://www.w3.org/TR/wai-aria-practices/#alertdialog\n */\n leastDestructiveFocus?: 'cancel' | 'confirm'\n /**\n * Function that's called when cancel is clicked\n */\n onCancel?: () => void\n /**\n * Function that's called when confirm is clicked.\n */\n onConfirm?: () => Promise<void> | void\n}\n\nexport const AlertDialog: React.FC<AlertDialogProps> = (props) => {\n const {\n title,\n translations,\n slotProps,\n open,\n closeOnCancel = true,\n closeOnConfirm = true,\n leastDestructiveFocus = 'cancel',\n onOpenChange,\n onCancel,\n onConfirm,\n children,\n ...rest\n } = props\n\n const cancelRef = React.useRef(null)\n const confirmRef = React.useRef(null)\n const [isLoading, setIsLoading] = React.useState(false)\n\n const handleConfirm = async () => {\n try {\n const result = onConfirm?.()\n if (typeof result?.then === 'function') {\n setIsLoading(true)\n await result\n }\n\n closeOnConfirm && onOpenChange({ open: false })\n /* eslint-disable no-useless-catch */\n } catch (e: any) {\n throw e\n } finally {\n setIsLoading(false)\n }\n /* eslint-enable */\n }\n\n const titleId = React.useId()\n const contentId = React.useId()\n\n return (\n <Dialog.Root\n open={open}\n onOpenChange={onOpenChange}\n size=\"sm\"\n aria-labelledby={titleId}\n aria-describedby={contentId}\n {...rest}\n initialFocusEl={() =>\n leastDestructiveFocus === 'cancel'\n ? cancelRef.current\n : confirmRef.current\n }\n >\n <Dialog.Content>\n <Dialog.Header>\n <Dialog.Title id={titleId}>{title}</Dialog.Title>\n </Dialog.Header>\n\n <Dialog.Body id={contentId}>{children}</Dialog.Body>\n\n <Dialog.Footer {...slotProps?.footer}>\n <Button\n ref={cancelRef}\n variant=\"ghost\"\n colorPalette=\"gray\"\n {...slotProps?.cancel}\n onClick={callAll(slotProps?.cancel?.onClick, () => {\n onCancel?.()\n\n closeOnCancel && onOpenChange({ open: false })\n })}\n >\n {slotProps?.cancel?.children || translations?.cancel || 'Cancel'}\n </Button>\n <Button\n ref={confirmRef}\n variant=\"solid\"\n disabled={isLoading}\n {...slotProps?.confirm}\n onClick={callAll(handleConfirm, slotProps?.confirm?.onClick)}\n >\n {slotProps?.confirm?.children || translations?.confirm || 'OK'}\n </Button>\n </Dialog.Footer>\n </Dialog.Content>\n </Dialog.Root>\n )\n}\n","import * as React from 'react'\n\nimport { type HTMLChakraProps } from '@chakra-ui/react'\nimport { MaybeRenderProp, runIfFn } from '@saas-ui/core/utils'\nimport { Drawer as BaseDrawer } from '@saas-ui/react/drawer'\n\nexport interface DrawerProps extends Omit<BaseDrawer.RootProps, 'children'> {\n /**\n * The drawer title\n */\n title: React.ReactNode\n /**\n * Whether the modal is open\n */\n open: boolean\n /**\n * Callback when the drawer is opened or closed\n */\n onOpenChange: (details: { open: boolean }) => void\n /**\n * The drawer children\n */\n children: MaybeRenderProp<{\n open: boolean\n setOpen: (open: boolean) => void\n }>\n /**\n * The modal footer\n */\n footer?: React.ReactNode\n /**\n * Hide the close button\n */\n hideCloseButton?: boolean\n /**\n * Hide the backdrop\n */\n hideBackdrop?: boolean\n /**\n * Props for the modal header\n */\n headerProps?: HTMLChakraProps<'div'>\n /**\n * Props for the modal content\n */\n contentProps?: BaseDrawer.ContentProps\n /**\n * Props for the modal footer\n */\n footerProps?: HTMLChakraProps<'div'>\n /**\n * Props for the modal body\n */\n bodyProps?: HTMLChakraProps<'div'>\n}\n\nexport const Drawer: React.FC<DrawerProps> = (props) => {\n const {\n title,\n children,\n footer,\n open,\n onOpenChange,\n hideCloseButton,\n hideBackdrop,\n headerProps,\n contentProps,\n bodyProps,\n footerProps,\n ...rest\n } = props\n return (\n <BaseDrawer.Root open={open} onOpenChange={onOpenChange} {...rest}>\n {!hideBackdrop && <BaseDrawer.Backdrop />}\n <BaseDrawer.Content {...contentProps}>\n {title && (\n <BaseDrawer.Header {...headerProps}>{title}</BaseDrawer.Header>\n )}\n {!hideCloseButton && <BaseDrawer.CloseButton />}\n <BaseDrawer.Body {...bodyProps}>\n <BaseDrawer.Context>\n {({ open, setOpen }) => runIfFn(children, { open, setOpen })}\n </BaseDrawer.Context>\n </BaseDrawer.Body>\n {footer && (\n <BaseDrawer.Footer {...footerProps}>{footer}</BaseDrawer.Footer>\n )}\n </BaseDrawer.Content>\n </BaseDrawer.Root>\n )\n}\n","import * as React from 'react'\n\nimport type { HTMLChakraProps } from '@chakra-ui/react'\nimport { MaybeRenderProp, runIfFn } from '@saas-ui/core/utils'\nimport { Dialog as BaseDialog } from '@saas-ui/react/dialog'\n\nexport interface ModalProps extends Omit<BaseDialog.RootProps, 'children'> {\n /**\n * The modal title\n */\n title?: React.ReactNode\n /**\n * Whether the modal is open\n */\n open: boolean\n /**\n * Callback when the modal is opened or closed\n */\n onOpenChange: (details: { open: boolean }) => void\n /**\n * The modal children\n */\n children: MaybeRenderProp<{\n open: boolean\n setOpen: (open: boolean) => void\n }>\n /**\n * The modal footer\n */\n footer?: React.ReactNode\n /**\n * Hide the close button\n */\n hideCloseButton?: boolean\n /**\n * Hide the overlay\n */\n hideBackdrop?: boolean\n /**\n * Props for the modal header\n */\n headerProps?: HTMLChakraProps<'div'>\n /**\n * Props for the modal content\n */\n contentProps?: HTMLChakraProps<'div'>\n /**\n * Props for the modal body\n */\n bodyProps?: HTMLChakraProps<'div'>\n /**\n * Props for the modal footer\n */\n footerProps?: HTMLChakraProps<'div'>\n}\n\nexport const Modal: React.FC<ModalProps> = (props) => {\n const {\n title,\n footer,\n children,\n open,\n onOpenChange,\n hideCloseButton,\n hideBackdrop,\n headerProps,\n contentProps,\n bodyProps,\n footerProps,\n ...rest\n } = props\n return (\n <BaseDialog.Root open={open} onOpenChange={onOpenChange} {...rest}>\n <BaseDialog.Content {...contentProps}>\n {title && (\n <BaseDialog.Header {...headerProps}>{title}</BaseDialog.Header>\n )}\n {!hideCloseButton && <BaseDialog.CloseButton />}\n <BaseDialog.Body>\n <BaseDialog.Context>\n {({ open, setOpen }) => runIfFn(children, { open, setOpen })}\n </BaseDialog.Context>\n </BaseDialog.Body>\n {footer && (\n <BaseDialog.Footer {...footerProps}>{footer}</BaseDialog.Footer>\n )}\n </BaseDialog.Content>\n </BaseDialog.Root>\n )\n}\n","import { AlertDialog } from './alert-dialog'\nimport { Drawer } from './drawer'\nimport { Modal } from './modal'\n\nexport const defaultModals = {\n alert: AlertDialog,\n confirm: AlertDialog,\n drawer: Drawer,\n modal: Modal,\n}\n"],"mappings":"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","names":["jsx","jsxs","open","runIfFn","jsx","jsxs","open"]}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@saas-ui/modals",
|
|
3
|
-
"version": "3.0.0-alpha.
|
|
3
|
+
"version": "3.0.0-alpha.30",
|
|
4
4
|
"description": "A modal manager for Chakra UI",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"exports": {
|
|
@@ -66,15 +66,15 @@
|
|
|
66
66
|
"url": "https://storybook.saas-ui.dev"
|
|
67
67
|
},
|
|
68
68
|
"dependencies": {
|
|
69
|
-
"@saas-ui/core": "3.0.0-alpha.
|
|
70
|
-
"@saas-ui/forms": "3.0.0-alpha.
|
|
71
|
-
"@saas-ui/hooks": "3.0.0-alpha.
|
|
72
|
-
"@saas-ui/modals-provider": "1.0.0-alpha.
|
|
69
|
+
"@saas-ui/core": "3.0.0-alpha.8",
|
|
70
|
+
"@saas-ui/forms": "3.0.0-alpha.30",
|
|
71
|
+
"@saas-ui/hooks": "3.0.0-alpha.5",
|
|
72
|
+
"@saas-ui/modals-provider": "1.0.0-alpha.4"
|
|
73
73
|
},
|
|
74
74
|
"peerDependencies": {
|
|
75
|
-
"@chakra-ui/react": "^3.
|
|
75
|
+
"@chakra-ui/react": "^3.2.3",
|
|
76
76
|
"@emotion/react": ">=11.0.0",
|
|
77
|
-
"@saas-ui/react": "3.0.0-alpha.
|
|
77
|
+
"@saas-ui/react": "3.0.0-alpha.30",
|
|
78
78
|
"react": ">=18.0.0",
|
|
79
79
|
"react-dom": ">=18.0.0"
|
|
80
80
|
},
|