@saas-ui/react 3.0.0-alpha.7 → 3.0.0-alpha.8
Sign up to get free protection for your applications and to get access to all the features.
- package/CHANGELOG.md +7 -0
- package/dist/chunk-7VSTNV2B.js +53 -0
- package/dist/{chunk-ZWSZQZ5G.js → chunk-CB52LBJK.js} +1 -3
- package/dist/{chunk-GEPWRHHH.js → chunk-H6TFEHY4.js} +1 -3
- package/dist/{chunk-5T7S5OAM.js → chunk-JGHXJ3PI.js} +2 -0
- package/dist/components/dialog/index.cjs +19 -58
- package/dist/components/dialog/index.js +1 -2
- package/dist/components/drawer/index.cjs +23 -64
- package/dist/components/drawer/index.js +1 -2
- package/dist/components/loading-overlay/index.cjs +16 -1868
- package/dist/components/loading-overlay/index.js +1 -1
- package/dist/components/menu/index.cjs +2 -0
- package/dist/components/menu/index.d.cts +3 -1
- package/dist/components/menu/index.d.ts +3 -1
- package/dist/components/menu/index.js +1 -1
- package/dist/index.cjs +438 -2315
- package/dist/index.js +24 -24
- package/package.json +3 -2
- package/dist/chunk-VBIVLREP.js +0 -45
- package/dist/chunk-YWJZWB6I.js +0 -1892
package/CHANGELOG.md
CHANGED
@@ -0,0 +1,53 @@
|
|
1
|
+
'use client'
|
2
|
+
import {
|
3
|
+
Spinner
|
4
|
+
} from "./chunk-32JGENDB.js";
|
5
|
+
import {
|
6
|
+
__export
|
7
|
+
} from "./chunk-RTMS5TJN.js";
|
8
|
+
|
9
|
+
// src/components/loading-overlay/loading-overlay.tsx
|
10
|
+
var loading_overlay_exports = {};
|
11
|
+
__export(loading_overlay_exports, {
|
12
|
+
Root: () => LoadingOverlayRoot,
|
13
|
+
Spinner: () => LoadingOverlaySpinner,
|
14
|
+
Text: () => LoadingOverlayText
|
15
|
+
});
|
16
|
+
import {
|
17
|
+
Presence,
|
18
|
+
splitPresenceProps
|
19
|
+
} from "@ark-ui/react/presence";
|
20
|
+
import { chakra } from "@chakra-ui/react";
|
21
|
+
|
22
|
+
// src/components/loading-overlay/loading-overlay.context.ts
|
23
|
+
import { createSlotRecipeContext } from "@chakra-ui/react";
|
24
|
+
var {
|
25
|
+
useStyles: useLoadingOverlayStyles,
|
26
|
+
withContext,
|
27
|
+
withProvider
|
28
|
+
} = createSlotRecipeContext({
|
29
|
+
key: "suiLoadingOverlay"
|
30
|
+
});
|
31
|
+
|
32
|
+
// src/components/loading-overlay/loading-overlay.tsx
|
33
|
+
import { jsx } from "react/jsx-runtime";
|
34
|
+
var LoadingOverlay = (props) => {
|
35
|
+
const { children, loading = true, ...rest } = props;
|
36
|
+
const [presenceProps, rootProps] = splitPresenceProps(rest);
|
37
|
+
return /* @__PURE__ */ jsx(Presence, { present: loading, ...presenceProps, asChild: true, children: /* @__PURE__ */ jsx(chakra.div, { ...rootProps, children }) });
|
38
|
+
};
|
39
|
+
var LoadingOverlayRoot = withProvider(
|
40
|
+
LoadingOverlay,
|
41
|
+
"root"
|
42
|
+
);
|
43
|
+
LoadingOverlayRoot.displayName = "LoadingOverlay";
|
44
|
+
var LoadingOverlaySpinner = Spinner;
|
45
|
+
var LoadingOverlayText = withContext(
|
46
|
+
"p",
|
47
|
+
"text"
|
48
|
+
);
|
49
|
+
|
50
|
+
export {
|
51
|
+
useLoadingOverlayStyles,
|
52
|
+
loading_overlay_exports
|
53
|
+
};
|
@@ -1,7 +1,4 @@
|
|
1
1
|
'use client'
|
2
|
-
import {
|
3
|
-
DialogContext
|
4
|
-
} from "./chunk-VBIVLREP.js";
|
5
2
|
import {
|
6
3
|
CloseButton
|
7
4
|
} from "./chunk-FZW2DYK3.js";
|
@@ -29,6 +26,7 @@ __export(namespace_exports, {
|
|
29
26
|
// src/components/dialog/dialog.tsx
|
30
27
|
import { forwardRef } from "react";
|
31
28
|
import { Dialog as ChakraDialog, Portal } from "@chakra-ui/react";
|
29
|
+
import { DialogContext } from "@ark-ui/react/dialog";
|
32
30
|
import { jsx, jsxs } from "react/jsx-runtime";
|
33
31
|
var DialogContent = forwardRef(
|
34
32
|
function DialogContent2(props, ref) {
|
@@ -1,7 +1,4 @@
|
|
1
1
|
'use client'
|
2
|
-
import {
|
3
|
-
DialogContext
|
4
|
-
} from "./chunk-VBIVLREP.js";
|
5
2
|
import {
|
6
3
|
CloseButton
|
7
4
|
} from "./chunk-FZW2DYK3.js";
|
@@ -28,6 +25,7 @@ __export(namespace_exports, {
|
|
28
25
|
|
29
26
|
// src/components/drawer/drawer.tsx
|
30
27
|
import { forwardRef } from "react";
|
28
|
+
import { DialogContext } from "@ark-ui/react/dialog";
|
31
29
|
import { Drawer as ChakraDrawer, Portal } from "@chakra-ui/react";
|
32
30
|
import { jsx } from "react/jsx-runtime";
|
33
31
|
var DrawerContent = forwardRef(
|
@@ -17,6 +17,7 @@ __export(menu_exports, {
|
|
17
17
|
Button: () => MenuButton,
|
18
18
|
CheckboxItem: () => MenuCheckboxItem,
|
19
19
|
Content: () => MenuContent,
|
20
|
+
Context: () => MenuContext,
|
20
21
|
ContextTrigger: () => MenuContextTrigger,
|
21
22
|
Item: () => MenuItem,
|
22
23
|
ItemCommand: () => MenuItemCommand,
|
@@ -90,6 +91,7 @@ var MenuRadioItemGroup = ChakraMenu.RadioItemGroup;
|
|
90
91
|
var MenuContextTrigger = ChakraMenu.ContextTrigger;
|
91
92
|
var MenuRoot = ChakraMenu.Root;
|
92
93
|
var MenuSeparator = ChakraMenu.Separator;
|
94
|
+
var MenuContext = ChakraMenu.Context;
|
93
95
|
var MenuItem = ChakraMenu.Item;
|
94
96
|
var MenuItemText = ChakraMenu.ItemText;
|
95
97
|
var MenuItemCommand = ChakraMenu.ItemCommand;
|
@@ -33,7 +33,7 @@ __export(namespace_exports, {
|
|
33
33
|
Body: () => DialogBody,
|
34
34
|
CloseTrigger: () => DialogCloseTrigger,
|
35
35
|
Content: () => DialogContent,
|
36
|
-
Context: () => DialogContext,
|
36
|
+
Context: () => import_dialog.DialogContext,
|
37
37
|
Description: () => DialogDescription,
|
38
38
|
Footer: () => DialogFooter,
|
39
39
|
Header: () => DialogHeader,
|
@@ -43,8 +43,8 @@ __export(namespace_exports, {
|
|
43
43
|
});
|
44
44
|
|
45
45
|
// src/components/dialog/dialog.tsx
|
46
|
-
var
|
47
|
-
var
|
46
|
+
var import_react4 = require("react");
|
47
|
+
var import_react5 = require("@chakra-ui/react");
|
48
48
|
|
49
49
|
// src/components/close-button/close-button.tsx
|
50
50
|
var import_react2 = require("react");
|
@@ -158,49 +158,10 @@ var CloseButton = (0, import_react2.forwardRef)(
|
|
158
158
|
}
|
159
159
|
);
|
160
160
|
|
161
|
-
// ../../node_modules/@ark-ui/react/dist/utils/create-context.js
|
162
|
-
var import_react4 = require("react");
|
163
|
-
function getErrorMessage(hook, provider) {
|
164
|
-
return `${hook} returned \`undefined\`. Seems you forgot to wrap component within ${provider}`;
|
165
|
-
}
|
166
|
-
function createContext(options = {}) {
|
167
|
-
const {
|
168
|
-
name,
|
169
|
-
strict = true,
|
170
|
-
hookName = "useContext",
|
171
|
-
providerName = "Provider",
|
172
|
-
errorMessage,
|
173
|
-
defaultValue
|
174
|
-
} = options;
|
175
|
-
const Context = (0, import_react4.createContext)(defaultValue);
|
176
|
-
Context.displayName = name;
|
177
|
-
function useContext$1() {
|
178
|
-
var _a;
|
179
|
-
const context = (0, import_react4.useContext)(Context);
|
180
|
-
if (!context && strict) {
|
181
|
-
const error = new Error(errorMessage != null ? errorMessage : getErrorMessage(hookName, providerName));
|
182
|
-
error.name = "ContextError";
|
183
|
-
(_a = Error.captureStackTrace) == null ? void 0 : _a.call(Error, error, useContext$1);
|
184
|
-
throw error;
|
185
|
-
}
|
186
|
-
return context;
|
187
|
-
}
|
188
|
-
return [Context.Provider, useContext$1, Context];
|
189
|
-
}
|
190
|
-
|
191
|
-
// ../../node_modules/@ark-ui/react/dist/components/dialog/use-dialog-context.js
|
192
|
-
var [DialogProvider, useDialogContext] = createContext({
|
193
|
-
name: "DialogContext",
|
194
|
-
hookName: "useDialogContext",
|
195
|
-
providerName: "<DialogProvider />"
|
196
|
-
});
|
197
|
-
|
198
|
-
// ../../node_modules/@ark-ui/react/dist/components/dialog/dialog-context.js
|
199
|
-
var DialogContext = (props) => props.children(useDialogContext());
|
200
|
-
|
201
161
|
// src/components/dialog/dialog.tsx
|
162
|
+
var import_dialog = require("@ark-ui/react/dialog");
|
202
163
|
var import_jsx_runtime3 = require("react/jsx-runtime");
|
203
|
-
var DialogContent = (0,
|
164
|
+
var DialogContent = (0, import_react4.forwardRef)(
|
204
165
|
function DialogContent2(props, ref) {
|
205
166
|
const {
|
206
167
|
children,
|
@@ -209,15 +170,15 @@ var DialogContent = (0, import_react5.forwardRef)(
|
|
209
170
|
backdrop = true,
|
210
171
|
...rest
|
211
172
|
} = props;
|
212
|
-
return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
|
213
|
-
backdrop && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
|
214
|
-
/* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
|
173
|
+
return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_react5.Portal, { disabled: !portalled, container: portalRef, children: [
|
174
|
+
backdrop && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_react5.Dialog.Backdrop, {}),
|
175
|
+
/* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_react5.Dialog.Positioner, { children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_react5.Dialog.Content, { ref, ...rest, asChild: false, children }) })
|
215
176
|
] });
|
216
177
|
}
|
217
178
|
);
|
218
|
-
var DialogCloseTrigger = (0,
|
179
|
+
var DialogCloseTrigger = (0, import_react4.forwardRef)(function DialogCloseTrigger2(props, ref) {
|
219
180
|
return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
|
220
|
-
|
181
|
+
import_react5.Dialog.CloseTrigger,
|
221
182
|
{
|
222
183
|
position: "absolute",
|
223
184
|
top: "2",
|
@@ -228,15 +189,15 @@ var DialogCloseTrigger = (0, import_react5.forwardRef)(function DialogCloseTrigg
|
|
228
189
|
}
|
229
190
|
);
|
230
191
|
});
|
231
|
-
var DialogRoot =
|
232
|
-
var DialogFooter =
|
233
|
-
var DialogHeader =
|
234
|
-
var DialogBody =
|
235
|
-
var DialogBackdrop =
|
236
|
-
var DialogTitle =
|
237
|
-
var DialogDescription =
|
238
|
-
var DialogTrigger =
|
239
|
-
var DialogActionTrigger =
|
192
|
+
var DialogRoot = import_react5.Dialog.Root;
|
193
|
+
var DialogFooter = import_react5.Dialog.Footer;
|
194
|
+
var DialogHeader = import_react5.Dialog.Header;
|
195
|
+
var DialogBody = import_react5.Dialog.Body;
|
196
|
+
var DialogBackdrop = import_react5.Dialog.Backdrop;
|
197
|
+
var DialogTitle = import_react5.Dialog.Title;
|
198
|
+
var DialogDescription = import_react5.Dialog.Description;
|
199
|
+
var DialogTrigger = import_react5.Dialog.Trigger;
|
200
|
+
var DialogActionTrigger = import_react5.Dialog.ActionTrigger;
|
240
201
|
// Annotate the CommonJS export names for ESM import in node:
|
241
202
|
0 && (module.exports = {
|
242
203
|
Dialog
|
@@ -43,59 +43,18 @@ __export(namespace_exports, {
|
|
43
43
|
});
|
44
44
|
|
45
45
|
// src/components/drawer/drawer.tsx
|
46
|
-
var
|
47
|
-
|
48
|
-
|
49
|
-
var import_react = require("react");
|
50
|
-
function getErrorMessage(hook, provider) {
|
51
|
-
return `${hook} returned \`undefined\`. Seems you forgot to wrap component within ${provider}`;
|
52
|
-
}
|
53
|
-
function createContext(options = {}) {
|
54
|
-
const {
|
55
|
-
name,
|
56
|
-
strict = true,
|
57
|
-
hookName = "useContext",
|
58
|
-
providerName = "Provider",
|
59
|
-
errorMessage,
|
60
|
-
defaultValue
|
61
|
-
} = options;
|
62
|
-
const Context = (0, import_react.createContext)(defaultValue);
|
63
|
-
Context.displayName = name;
|
64
|
-
function useContext$1() {
|
65
|
-
var _a;
|
66
|
-
const context = (0, import_react.useContext)(Context);
|
67
|
-
if (!context && strict) {
|
68
|
-
const error = new Error(errorMessage != null ? errorMessage : getErrorMessage(hookName, providerName));
|
69
|
-
error.name = "ContextError";
|
70
|
-
(_a = Error.captureStackTrace) == null ? void 0 : _a.call(Error, error, useContext$1);
|
71
|
-
throw error;
|
72
|
-
}
|
73
|
-
return context;
|
74
|
-
}
|
75
|
-
return [Context.Provider, useContext$1, Context];
|
76
|
-
}
|
77
|
-
|
78
|
-
// ../../node_modules/@ark-ui/react/dist/components/dialog/use-dialog-context.js
|
79
|
-
var [DialogProvider, useDialogContext] = createContext({
|
80
|
-
name: "DialogContext",
|
81
|
-
hookName: "useDialogContext",
|
82
|
-
providerName: "<DialogProvider />"
|
83
|
-
});
|
84
|
-
|
85
|
-
// ../../node_modules/@ark-ui/react/dist/components/dialog/dialog-context.js
|
86
|
-
var DialogContext = (props) => props.children(useDialogContext());
|
87
|
-
|
88
|
-
// src/components/drawer/drawer.tsx
|
89
|
-
var import_react6 = require("@chakra-ui/react");
|
46
|
+
var import_react4 = require("react");
|
47
|
+
var import_dialog = require("@ark-ui/react/dialog");
|
48
|
+
var import_react5 = require("@chakra-ui/react");
|
90
49
|
|
91
50
|
// src/components/close-button/close-button.tsx
|
92
|
-
var
|
93
|
-
var
|
51
|
+
var import_react2 = require("react");
|
52
|
+
var import_react3 = require("@chakra-ui/react");
|
94
53
|
|
95
54
|
// src/components/icons/create-icon.tsx
|
96
|
-
var
|
55
|
+
var import_react = require("@chakra-ui/react");
|
97
56
|
var createIcon = (props) => {
|
98
|
-
return (0,
|
57
|
+
return (0, import_react.createIcon)({
|
99
58
|
viewBox: "0 0 24 24",
|
100
59
|
defaultProps: {
|
101
60
|
fill: "none",
|
@@ -193,24 +152,24 @@ var CheckIcon = createIcon({
|
|
193
152
|
|
194
153
|
// src/components/close-button/close-button.tsx
|
195
154
|
var import_jsx_runtime2 = require("react/jsx-runtime");
|
196
|
-
var CloseButton = (0,
|
155
|
+
var CloseButton = (0, import_react2.forwardRef)(
|
197
156
|
function CloseButton2(props, ref) {
|
198
157
|
var _a;
|
199
|
-
return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
158
|
+
return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_react3.IconButton, { variant: "ghost", "aria-label": "Close", ref, ...props, children: (_a = props.children) != null ? _a : /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(CloseIcon, {}) });
|
200
159
|
}
|
201
160
|
);
|
202
161
|
|
203
162
|
// src/components/drawer/drawer.tsx
|
204
163
|
var import_jsx_runtime3 = require("react/jsx-runtime");
|
205
|
-
var DrawerContent = (0,
|
164
|
+
var DrawerContent = (0, import_react4.forwardRef)(
|
206
165
|
function DrawerContent2(props, ref) {
|
207
166
|
const { children, portalled = true, portalRef, offset, ...rest } = props;
|
208
|
-
return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
|
167
|
+
return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_react5.Portal, { disabled: !portalled, container: portalRef, children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_react5.Drawer.Positioner, { padding: offset, children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_react5.Drawer.Content, { ref, ...rest, asChild: false, children }) }) });
|
209
168
|
}
|
210
169
|
);
|
211
|
-
var DrawerCloseTrigger = (0,
|
170
|
+
var DrawerCloseTrigger = (0, import_react4.forwardRef)(function DrawerCloseTrigger2(props, ref) {
|
212
171
|
return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
|
213
|
-
|
172
|
+
import_react5.Drawer.CloseTrigger,
|
214
173
|
{
|
215
174
|
position: "absolute",
|
216
175
|
top: "2",
|
@@ -221,16 +180,16 @@ var DrawerCloseTrigger = (0, import_react5.forwardRef)(function DrawerCloseTrigg
|
|
221
180
|
}
|
222
181
|
);
|
223
182
|
});
|
224
|
-
var DrawerTrigger =
|
225
|
-
var DrawerRoot =
|
226
|
-
var DrawerFooter =
|
227
|
-
var DrawerHeader =
|
228
|
-
var DrawerBody =
|
229
|
-
var DrawerBackdrop =
|
230
|
-
var DrawerDescription =
|
231
|
-
var DrawerTitle =
|
232
|
-
var DrawerActionTrigger =
|
233
|
-
var DrawerContext = DialogContext;
|
183
|
+
var DrawerTrigger = import_react5.Drawer.Trigger;
|
184
|
+
var DrawerRoot = import_react5.Drawer.Root;
|
185
|
+
var DrawerFooter = import_react5.Drawer.Footer;
|
186
|
+
var DrawerHeader = import_react5.Drawer.Header;
|
187
|
+
var DrawerBody = import_react5.Drawer.Body;
|
188
|
+
var DrawerBackdrop = import_react5.Drawer.Backdrop;
|
189
|
+
var DrawerDescription = import_react5.Drawer.Description;
|
190
|
+
var DrawerTitle = import_react5.Drawer.Title;
|
191
|
+
var DrawerActionTrigger = import_react5.Drawer.ActionTrigger;
|
192
|
+
var DrawerContext = import_dialog.DialogContext;
|
234
193
|
// Annotate the CommonJS export names for ESM import in node:
|
235
194
|
0 && (module.exports = {
|
236
195
|
Drawer
|