@studiolxd/brand 45.1.0 → 47.0.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/CHANGELOG.md +168 -0
- package/dist/_shared/portal-container.js +9 -0
- package/dist/_types/atoms/AsyncMultiSelect/AsyncMultiSelect.d.ts +8 -7
- package/dist/_types/atoms/AsyncSelect/AsyncSelect.d.ts +8 -6
- package/dist/_types/atoms/InputPhone/InputPhone.d.ts +8 -5
- package/dist/_types/atoms/MenuButton/MenuButton.d.ts +22 -2
- package/dist/_types/atoms/MultiSelect/MultiSelect.d.ts +8 -6
- package/dist/_types/atoms/Popover/Popover.d.ts +8 -1
- package/dist/_types/atoms/Select/Select.d.ts +8 -7
- package/dist/_types/atoms/Tooltip/Tooltip.d.ts +7 -0
- package/dist/_types/constants/portal-container.d.ts +42 -0
- package/dist/_types/messages/BrandMessages.d.ts +41 -1
- package/dist/_types/messages/index.d.ts +1 -1
- package/dist/_types/molecules/AppLauncher/AppLauncher.d.ts +43 -8
- package/dist/_types/molecules/Breadcrumb/Breadcrumb.d.ts +10 -2
- package/dist/_types/molecules/CommandPalette/CommandPalette.d.ts +43 -8
- package/dist/_types/molecules/Consent/Consent.d.ts +93 -20
- package/dist/_types/molecules/Menu/Menu.d.ts +8 -1
- package/dist/_types/molecules/Modal/Modal.d.ts +8 -6
- package/dist/_types/molecules/NotificationButton/NotificationButton.d.ts +17 -4
- package/dist/_types/molecules/NotificationPanel/NotificationPanel.d.ts +54 -8
- package/dist/_types/molecules/OrgSwitcher/OrgSwitcher.d.ts +15 -1
- package/dist/_types/molecules/PrevNextNav/PrevNextNav.d.ts +17 -2
- package/dist/_types/molecules/Sheet/Sheet.d.ts +8 -7
- package/dist/_types/molecules/SidebarNav/SidebarNav.d.ts +18 -3
- package/dist/_types/molecules/SiteNav/SiteNav.d.ts +9 -0
- package/dist/_types/molecules/TableOfContents/TableOfContents.d.ts +11 -2
- package/dist/_types/molecules/UserMenu/UserMenu.d.ts +16 -1
- package/dist/_types/sections/AppHeader/AppHeader.d.ts +8 -2
- package/dist/_types/sections/AppRoot/AppRoot.d.ts +12 -1
- package/dist/_types/sections/AppShell/AppShell.d.ts +14 -1
- package/dist/_types/sections/FloatingDock/FloatingDock.d.ts +33 -3
- package/dist/_types/sections/Sidebar/Sidebar.d.ts +27 -3
- package/dist/_types/sections/SiteHeader/SiteHeader.d.ts +22 -3
- package/dist/_types/sections/SiteShell/SiteShell.d.ts +11 -5
- package/dist/_types/templates/OnboardingShell/OnboardingShell.d.ts +19 -2
- package/dist/_types/templates/PublicPageShell/PublicPageShell.d.ts +42 -6
- package/dist/app-header.js +1 -1
- package/dist/app-launcher.js +73 -63
- package/dist/app-root.js +10 -8
- package/dist/app-shell.js +51 -50
- package/dist/async-multi-select.js +65 -64
- package/dist/async-select.js +49 -48
- package/dist/breadcrumb.js +24 -21
- package/dist/command-palette.js +38 -36
- package/dist/consent.js +75 -73
- package/dist/floating-dock.js +42 -41
- package/dist/input-phone.js +38 -37
- package/dist/menu-button.js +16 -14
- package/dist/menu.js +44 -40
- package/dist/modal.js +32 -31
- package/dist/multi-select.js +106 -105
- package/dist/notification-button.js +18 -17
- package/dist/notification-panel.js +81 -80
- package/dist/onboarding-shell.js +36 -35
- package/dist/org-switcher.js +64 -59
- package/dist/popover.js +27 -22
- package/dist/prev-next-nav.js +38 -36
- package/dist/public-page-shell.js +24 -20
- package/dist/select.js +70 -69
- package/dist/sheet.js +30 -29
- package/dist/sidebar-nav.js +91 -90
- package/dist/sidebar.js +72 -71
- package/dist/site-header.js +44 -43
- package/dist/site-nav.js +27 -25
- package/dist/site-shell.js +23 -15
- package/dist/table-of-contents.js +30 -27
- package/dist/toaster.js +57 -53
- package/dist/tooltip.js +45 -41
- package/dist/user-menu.js +58 -52
- package/package.json +1 -1
package/dist/prev-next-nav.js
CHANGED
|
@@ -1,39 +1,41 @@
|
|
|
1
|
+
'use client';
|
|
1
2
|
import './prev-next-nav.css';
|
|
2
|
-
import {
|
|
3
|
-
import {
|
|
3
|
+
import { n as e } from "./_shared/brandmessagescontext.js";
|
|
4
|
+
import { Icon as t } from "./icon.js";
|
|
5
|
+
import { Fragment as n, jsx as r, jsxs as i } from "react/jsx-runtime";
|
|
4
6
|
//#region src/stories/molecules/PrevNextNav/PrevNextNav.tsx
|
|
5
|
-
function
|
|
7
|
+
function a({ href: e, onClick: a, label: o, title: s, disabled: c, direction: l, chevronSize: u, linkComponent: d }) {
|
|
6
8
|
let f = [
|
|
7
9
|
"prev-next-nav__btn",
|
|
8
10
|
`prev-next-nav__btn--${l}`,
|
|
9
11
|
s ? "prev-next-nav__btn--titled" : "",
|
|
10
12
|
c ? "prev-next-nav__btn--disabled" : ""
|
|
11
|
-
].filter(Boolean).join(" "), p = /* @__PURE__ */
|
|
13
|
+
].filter(Boolean).join(" "), p = /* @__PURE__ */ r(t, {
|
|
12
14
|
name: "chevron",
|
|
13
15
|
size: u
|
|
14
|
-
}), m = s ? /* @__PURE__ */
|
|
16
|
+
}), m = s ? /* @__PURE__ */ i(n, { children: [p, /* @__PURE__ */ i("span", {
|
|
15
17
|
className: "prev-next-nav__text",
|
|
16
|
-
children: [/* @__PURE__ */
|
|
18
|
+
children: [/* @__PURE__ */ r("span", {
|
|
17
19
|
className: "prev-next-nav__eyebrow",
|
|
18
20
|
children: o
|
|
19
|
-
}), /* @__PURE__ */
|
|
21
|
+
}), /* @__PURE__ */ r("span", {
|
|
20
22
|
className: "prev-next-nav__title",
|
|
21
23
|
children: s
|
|
22
24
|
})]
|
|
23
25
|
})] }) : p, h = s ? void 0 : o;
|
|
24
|
-
return c ? /* @__PURE__ */
|
|
26
|
+
return c ? /* @__PURE__ */ r("button", {
|
|
25
27
|
type: "button",
|
|
26
28
|
className: f,
|
|
27
29
|
"aria-label": h,
|
|
28
30
|
disabled: !0,
|
|
29
31
|
children: m
|
|
30
|
-
}) :
|
|
31
|
-
href:
|
|
32
|
+
}) : e ? /* @__PURE__ */ r(d ?? "a", {
|
|
33
|
+
href: e,
|
|
32
34
|
className: f,
|
|
33
35
|
"aria-label": h,
|
|
34
36
|
onClick: a,
|
|
35
37
|
children: m
|
|
36
|
-
}) : /* @__PURE__ */
|
|
38
|
+
}) : /* @__PURE__ */ r("button", {
|
|
37
39
|
type: "button",
|
|
38
40
|
className: f,
|
|
39
41
|
"aria-label": h,
|
|
@@ -41,42 +43,42 @@ function i({ href: i, onClick: a, label: o, title: s, disabled: c, direction: l,
|
|
|
41
43
|
children: m
|
|
42
44
|
});
|
|
43
45
|
}
|
|
44
|
-
function
|
|
45
|
-
let
|
|
46
|
-
return /* @__PURE__ */
|
|
46
|
+
function o({ prevHref: t, nextHref: n, prevOnClick: o, nextOnClick: s, prevLabel: c, nextLabel: l, prevTitle: u, nextTitle: d, label: f, labelId: p, linkComponent: m, size: h = "md" }) {
|
|
47
|
+
let g = e("prevNextNav"), _ = h === "sm" ? "sm" : "md";
|
|
48
|
+
return /* @__PURE__ */ i("div", {
|
|
47
49
|
className: [
|
|
48
50
|
"prev-next-nav",
|
|
49
|
-
|
|
50
|
-
|
|
51
|
+
h === "sm" ? "prev-next-nav--sm" : "",
|
|
52
|
+
u !== void 0 || d !== void 0 ? "prev-next-nav--titled" : ""
|
|
51
53
|
].filter(Boolean).join(" "),
|
|
52
54
|
children: [
|
|
53
|
-
/* @__PURE__ */
|
|
54
|
-
href:
|
|
55
|
-
onClick:
|
|
56
|
-
label:
|
|
57
|
-
disabled: !
|
|
55
|
+
/* @__PURE__ */ r(a, {
|
|
56
|
+
href: t,
|
|
57
|
+
onClick: o,
|
|
58
|
+
label: g("previous", c),
|
|
59
|
+
disabled: !t && !o,
|
|
58
60
|
direction: "prev",
|
|
59
|
-
title:
|
|
60
|
-
chevronSize:
|
|
61
|
-
linkComponent:
|
|
61
|
+
title: u,
|
|
62
|
+
chevronSize: _,
|
|
63
|
+
linkComponent: m
|
|
62
64
|
}),
|
|
63
|
-
|
|
64
|
-
id:
|
|
65
|
+
f !== void 0 && /* @__PURE__ */ r("strong", {
|
|
66
|
+
id: p,
|
|
65
67
|
className: "prev-next-nav__label",
|
|
66
|
-
children:
|
|
68
|
+
children: f
|
|
67
69
|
}),
|
|
68
|
-
/* @__PURE__ */
|
|
69
|
-
href:
|
|
70
|
-
onClick:
|
|
71
|
-
label:
|
|
72
|
-
disabled: !
|
|
70
|
+
/* @__PURE__ */ r(a, {
|
|
71
|
+
href: n,
|
|
72
|
+
onClick: s,
|
|
73
|
+
label: g("next", l),
|
|
74
|
+
disabled: !n && !s,
|
|
73
75
|
direction: "next",
|
|
74
|
-
title:
|
|
75
|
-
chevronSize:
|
|
76
|
-
linkComponent:
|
|
76
|
+
title: d,
|
|
77
|
+
chevronSize: _,
|
|
78
|
+
linkComponent: m
|
|
77
79
|
})
|
|
78
80
|
]
|
|
79
81
|
});
|
|
80
82
|
}
|
|
81
83
|
//#endregion
|
|
82
|
-
export {
|
|
84
|
+
export { o as PrevNextNav };
|
|
@@ -1,34 +1,38 @@
|
|
|
1
1
|
'use client';
|
|
2
2
|
import './public-page-shell.css';
|
|
3
|
-
import {
|
|
4
|
-
import {
|
|
5
|
-
import {
|
|
6
|
-
import {
|
|
7
|
-
import {
|
|
3
|
+
import { n as e } from "./_shared/brandmessagescontext.js";
|
|
4
|
+
import { Container as t } from "./container.js";
|
|
5
|
+
import { ErrorBoundary as n } from "./error-boundary.js";
|
|
6
|
+
import { SiteShell as r } from "./site-shell.js";
|
|
7
|
+
import { forwardRef as i } from "react";
|
|
8
|
+
import { Fragment as a, jsx as o, jsxs as s } from "react/jsx-runtime";
|
|
8
9
|
//#region src/stories/templates/PublicPageShell/PublicPageShell.tsx
|
|
9
|
-
var
|
|
10
|
-
|
|
11
|
-
|
|
10
|
+
var c = i(function({ children: i, header: c, footer: l, preferences: u, preferencesLabel: d, mainWidth: f = "xl", mainSpace: p = "xl", mainFlush: m = !1, id: h = "main-content", shell: g = !0 }, _) {
|
|
11
|
+
let v = e("publicPageShell");
|
|
12
|
+
if (!g) return /* @__PURE__ */ o(a, { children: i });
|
|
13
|
+
let y = u && /* @__PURE__ */ o(t, {
|
|
12
14
|
as: "section",
|
|
13
15
|
className: "public-page-shell__preferences",
|
|
14
|
-
"aria-label":
|
|
15
|
-
children: /* @__PURE__ */
|
|
16
|
+
"aria-label": v("preferences", d),
|
|
17
|
+
children: /* @__PURE__ */ o("div", {
|
|
16
18
|
className: "public-page-shell__preferences-row",
|
|
17
|
-
children:
|
|
19
|
+
children: u
|
|
18
20
|
})
|
|
19
21
|
});
|
|
20
|
-
return /* @__PURE__ */
|
|
21
|
-
ref:
|
|
22
|
-
header:
|
|
23
|
-
footer: (
|
|
24
|
-
children: /* @__PURE__ */
|
|
22
|
+
return /* @__PURE__ */ o(r, {
|
|
23
|
+
ref: _,
|
|
24
|
+
header: c && /* @__PURE__ */ o(n, { children: c }),
|
|
25
|
+
footer: (y || l) && /* @__PURE__ */ s(a, { children: [y && /* @__PURE__ */ o(n, { children: y }), l && /* @__PURE__ */ o(n, { children: l })] }),
|
|
26
|
+
children: /* @__PURE__ */ o(t, {
|
|
25
27
|
as: "main",
|
|
26
|
-
id:
|
|
28
|
+
id: h,
|
|
27
29
|
tabIndex: -1,
|
|
28
|
-
|
|
29
|
-
|
|
30
|
+
width: f,
|
|
31
|
+
space: p,
|
|
32
|
+
flush: m,
|
|
33
|
+
children: i
|
|
30
34
|
})
|
|
31
35
|
});
|
|
32
36
|
});
|
|
33
37
|
//#endregion
|
|
34
|
-
export {
|
|
38
|
+
export { c as PublicPageShell };
|
package/dist/select.js
CHANGED
|
@@ -2,158 +2,159 @@
|
|
|
2
2
|
import './select.css';
|
|
3
3
|
import { n as e } from "./_shared/brandmessagescontext.js";
|
|
4
4
|
import { Icon as t } from "./icon.js";
|
|
5
|
-
import {
|
|
6
|
-
import {
|
|
7
|
-
import {
|
|
5
|
+
import { n } from "./_shared/portal-container.js";
|
|
6
|
+
import { Children as r, createContext as i, forwardRef as a, isValidElement as o, useContext as s, useMemo as c } from "react";
|
|
7
|
+
import { Fragment as l, jsx as u, jsxs as d } from "react/jsx-runtime";
|
|
8
|
+
import { Select as f } from "@base-ui/react/select";
|
|
8
9
|
//#region src/stories/atoms/Select/Select.tsx
|
|
9
|
-
function
|
|
10
|
+
function p(e) {
|
|
10
11
|
return Array.isArray(e.options);
|
|
11
12
|
}
|
|
12
|
-
var
|
|
13
|
-
function
|
|
14
|
-
|
|
15
|
-
if (!
|
|
13
|
+
var m = i(null);
|
|
14
|
+
function h(e, t) {
|
|
15
|
+
r.forEach(e, (e) => {
|
|
16
|
+
if (!o(e)) return;
|
|
16
17
|
let n = e.props ?? {};
|
|
17
|
-
if (e.type ===
|
|
18
|
+
if (e.type === x || typeof n.value == "string" && e.type !== g) {
|
|
18
19
|
typeof n.value == "string" && t.set(n.value, n.children);
|
|
19
20
|
return;
|
|
20
21
|
}
|
|
21
|
-
n.children != null &&
|
|
22
|
+
n.children != null && h(n.children, t);
|
|
22
23
|
});
|
|
23
24
|
}
|
|
24
|
-
function
|
|
25
|
-
let r =
|
|
25
|
+
function g({ children: e, onValueChange: t, ...n }) {
|
|
26
|
+
let r = c(() => {
|
|
26
27
|
let t = /* @__PURE__ */ new Map();
|
|
27
|
-
return
|
|
28
|
+
return h(e, t), t;
|
|
28
29
|
}, [e]);
|
|
29
|
-
return /* @__PURE__ */
|
|
30
|
+
return /* @__PURE__ */ u(m.Provider, {
|
|
30
31
|
value: r,
|
|
31
|
-
children: /* @__PURE__ */
|
|
32
|
+
children: /* @__PURE__ */ u(f.Root, {
|
|
32
33
|
onValueChange: t ? (e) => t(e) : void 0,
|
|
33
34
|
...n,
|
|
34
35
|
children: e
|
|
35
36
|
})
|
|
36
37
|
});
|
|
37
38
|
}
|
|
38
|
-
var
|
|
39
|
-
let i =
|
|
40
|
-
return /* @__PURE__ */
|
|
39
|
+
var _ = a(function({ placeholder: e, children: t, ...n }, r) {
|
|
40
|
+
let i = s(m);
|
|
41
|
+
return /* @__PURE__ */ u(f.Value, {
|
|
41
42
|
ref: r,
|
|
42
43
|
...n,
|
|
43
44
|
children: (n) => typeof t == "function" ? t(n) : t ?? (n == null || n === "" ? e ?? null : i?.get(n) ?? n)
|
|
44
45
|
});
|
|
45
|
-
}),
|
|
46
|
+
}), v = a(function({ className: e, children: t, ...n }, r) {
|
|
46
47
|
let i = ["select__group", e ?? ""].filter(Boolean).join(" ");
|
|
47
|
-
return /* @__PURE__ */
|
|
48
|
+
return /* @__PURE__ */ u(f.Group, {
|
|
48
49
|
ref: r,
|
|
49
50
|
className: i,
|
|
50
51
|
...n,
|
|
51
52
|
children: t
|
|
52
53
|
});
|
|
53
|
-
}),
|
|
54
|
+
}), y = a(function({ size: e = "md", className: n, children: r, ...i }, a) {
|
|
54
55
|
let o = [
|
|
55
56
|
"select",
|
|
56
57
|
e === "md" ? "" : `select--${e}`,
|
|
57
58
|
n ?? ""
|
|
58
59
|
].filter(Boolean).join(" ");
|
|
59
|
-
return /* @__PURE__ */
|
|
60
|
+
return /* @__PURE__ */ d(f.Trigger, {
|
|
60
61
|
ref: a,
|
|
61
62
|
className: o,
|
|
62
63
|
...i,
|
|
63
|
-
children: [r, /* @__PURE__ */
|
|
64
|
+
children: [r, /* @__PURE__ */ u(t, {
|
|
64
65
|
name: "chevron",
|
|
65
66
|
className: "select__icon"
|
|
66
67
|
})]
|
|
67
68
|
});
|
|
68
|
-
}),
|
|
69
|
-
let
|
|
69
|
+
}), b = a(function({ size: e = "md", container: t, className: r, children: i, side: a = "bottom", align: o = "start", sideOffset: s = -1, ...c }, l) {
|
|
70
|
+
let d = n(t), p = [
|
|
70
71
|
"select__content",
|
|
71
72
|
e === "md" ? "" : `select__content--${e}`,
|
|
72
|
-
|
|
73
|
+
r ?? ""
|
|
73
74
|
].filter(Boolean).join(" ");
|
|
74
|
-
return /* @__PURE__ */
|
|
75
|
-
container:
|
|
76
|
-
children: /* @__PURE__ */
|
|
75
|
+
return /* @__PURE__ */ u(f.Portal, {
|
|
76
|
+
container: d,
|
|
77
|
+
children: /* @__PURE__ */ u(f.Positioner, {
|
|
77
78
|
className: "select__positioner",
|
|
78
|
-
side:
|
|
79
|
-
align:
|
|
80
|
-
sideOffset:
|
|
79
|
+
side: a,
|
|
80
|
+
align: o,
|
|
81
|
+
sideOffset: s,
|
|
81
82
|
alignItemWithTrigger: !1,
|
|
82
|
-
children: /* @__PURE__ */
|
|
83
|
-
ref:
|
|
84
|
-
className:
|
|
85
|
-
...
|
|
86
|
-
children:
|
|
83
|
+
children: /* @__PURE__ */ u(f.Popup, {
|
|
84
|
+
ref: l,
|
|
85
|
+
className: p,
|
|
86
|
+
...c,
|
|
87
|
+
children: i
|
|
87
88
|
})
|
|
88
89
|
})
|
|
89
90
|
});
|
|
90
|
-
}),
|
|
91
|
+
}), x = a(function({ className: e, children: t, ...n }, r) {
|
|
91
92
|
let i = ["select__item", e ?? ""].filter(Boolean).join(" ");
|
|
92
|
-
return /* @__PURE__ */
|
|
93
|
+
return /* @__PURE__ */ u(f.Item, {
|
|
93
94
|
ref: r,
|
|
94
95
|
className: i,
|
|
95
96
|
...n,
|
|
96
|
-
children: /* @__PURE__ */
|
|
97
|
+
children: /* @__PURE__ */ u(f.ItemText, { children: t })
|
|
97
98
|
});
|
|
98
|
-
}),
|
|
99
|
+
}), S = a(function({ className: e, children: t, ...n }, r) {
|
|
99
100
|
let i = ["select__label", e ?? ""].filter(Boolean).join(" ");
|
|
100
|
-
return /* @__PURE__ */
|
|
101
|
+
return /* @__PURE__ */ u(f.GroupLabel, {
|
|
101
102
|
ref: r,
|
|
102
103
|
className: i,
|
|
103
104
|
...n,
|
|
104
105
|
children: t
|
|
105
106
|
});
|
|
106
|
-
}),
|
|
107
|
+
}), C = a(function({ className: e, ...t }, n) {
|
|
107
108
|
let r = ["select__separator", e ?? ""].filter(Boolean).join(" ");
|
|
108
|
-
return /* @__PURE__ */
|
|
109
|
+
return /* @__PURE__ */ u(f.Separator, {
|
|
109
110
|
ref: n,
|
|
110
111
|
className: r,
|
|
111
112
|
...t
|
|
112
113
|
});
|
|
113
114
|
});
|
|
114
|
-
function
|
|
115
|
-
return /* @__PURE__ */
|
|
115
|
+
function w({ value: e, label: t, "aria-label": n }) {
|
|
116
|
+
return /* @__PURE__ */ u(x, {
|
|
116
117
|
value: e,
|
|
117
118
|
"aria-label": n,
|
|
118
119
|
children: t
|
|
119
120
|
}, e);
|
|
120
121
|
}
|
|
121
|
-
function
|
|
122
|
-
return /* @__PURE__ */ l
|
|
122
|
+
function T({ override: t }) {
|
|
123
|
+
return /* @__PURE__ */ u(l, { children: e("select")("placeholder", t) });
|
|
123
124
|
}
|
|
124
|
-
var
|
|
125
|
-
return /* @__PURE__ */
|
|
125
|
+
var E = a(function({ options: e, value: t, defaultValue: n, placeholder: r, disabled: i, readOnly: a, size: o = "md", onValueChange: s, id: c, name: l, required: f, onBlur: m, "aria-label": h, "aria-describedby": x, "aria-invalid": C, container: E }, D) {
|
|
126
|
+
return /* @__PURE__ */ d(g, {
|
|
126
127
|
value: t,
|
|
127
128
|
defaultValue: n,
|
|
128
129
|
disabled: i,
|
|
129
130
|
readOnly: a,
|
|
130
|
-
name:
|
|
131
|
-
required:
|
|
131
|
+
name: l,
|
|
132
|
+
required: f,
|
|
132
133
|
onValueChange: s,
|
|
133
|
-
children: [/* @__PURE__ */
|
|
134
|
+
children: [/* @__PURE__ */ u(y, {
|
|
134
135
|
ref: D,
|
|
135
136
|
size: o,
|
|
136
137
|
id: c,
|
|
137
138
|
onBlur: m,
|
|
138
|
-
"aria-label":
|
|
139
|
-
"aria-describedby":
|
|
140
|
-
"aria-invalid":
|
|
141
|
-
children: /* @__PURE__ */
|
|
142
|
-
}), /* @__PURE__ */
|
|
139
|
+
"aria-label": h,
|
|
140
|
+
"aria-describedby": x,
|
|
141
|
+
"aria-invalid": C || void 0,
|
|
142
|
+
children: /* @__PURE__ */ u(_, { placeholder: /* @__PURE__ */ u(T, { override: r }) })
|
|
143
|
+
}), /* @__PURE__ */ u(b, {
|
|
143
144
|
size: o,
|
|
144
145
|
container: E,
|
|
145
|
-
children: e.map((e, t) =>
|
|
146
|
+
children: e.map((e, t) => p(e) ? /* @__PURE__ */ d(v, { children: [/* @__PURE__ */ u(S, { children: e.label }), e.options.map(w)] }, `group-${t}`) : w(e))
|
|
146
147
|
})]
|
|
147
148
|
});
|
|
148
|
-
}),
|
|
149
|
-
Root:
|
|
150
|
-
Trigger:
|
|
151
|
-
Value:
|
|
152
|
-
Content:
|
|
153
|
-
Group:
|
|
154
|
-
Label:
|
|
155
|
-
Item:
|
|
156
|
-
Separator:
|
|
149
|
+
}), D = Object.assign(E, {
|
|
150
|
+
Root: g,
|
|
151
|
+
Trigger: y,
|
|
152
|
+
Value: _,
|
|
153
|
+
Content: b,
|
|
154
|
+
Group: v,
|
|
155
|
+
Label: S,
|
|
156
|
+
Item: x,
|
|
157
|
+
Separator: C
|
|
157
158
|
});
|
|
158
159
|
//#endregion
|
|
159
|
-
export {
|
|
160
|
+
export { D as Select, b as SelectContent, v as SelectGroup, x as SelectItem, S as SelectLabel, g as SelectRoot, C as SelectSeparator, y as SelectTrigger, _ as SelectValue, p as isSelectOptionGroup };
|
package/dist/sheet.js
CHANGED
|
@@ -2,54 +2,55 @@
|
|
|
2
2
|
import './sheet.css';
|
|
3
3
|
import { n as e } from "./_shared/brandmessagescontext.js";
|
|
4
4
|
import { VisuallyHidden as t } from "./visually-hidden.js";
|
|
5
|
-
import {
|
|
6
|
-
import {
|
|
7
|
-
import {
|
|
8
|
-
import {
|
|
5
|
+
import { n } from "./_shared/portal-container.js";
|
|
6
|
+
import { CloseButton as r } from "./close-button.js";
|
|
7
|
+
import { n as i, r as a, t as o } from "./_shared/dialogsurface.js";
|
|
8
|
+
import { jsx as s, jsxs as c } from "react/jsx-runtime";
|
|
9
|
+
import { Dialog as l } from "@base-ui/react/dialog";
|
|
9
10
|
//#region src/stories/molecules/Sheet/Sheet.tsx
|
|
10
|
-
function
|
|
11
|
-
return /* @__PURE__ */ o
|
|
11
|
+
function u({ className: e, ...t }) {
|
|
12
|
+
return /* @__PURE__ */ s(o, {
|
|
12
13
|
className: ["sheet__footer", e].filter(Boolean).join(" "),
|
|
13
14
|
...t
|
|
14
15
|
});
|
|
15
16
|
}
|
|
16
|
-
function
|
|
17
|
-
let
|
|
18
|
-
return /* @__PURE__ */
|
|
19
|
-
open:
|
|
20
|
-
onOpenChange: (e) =>
|
|
21
|
-
children: [
|
|
22
|
-
container:
|
|
23
|
-
children: [/* @__PURE__ */
|
|
24
|
-
className: ["sheet",
|
|
25
|
-
"data-side":
|
|
26
|
-
onAnimationEndCapture:
|
|
27
|
-
...
|
|
17
|
+
function d({ open: o, onOpenChange: d, side: f = "right", title: p, titleHidden: m = !1, description: h, footer: g, children: _, closeLabel: v, hideClose: y = !1, trigger: b, container: x, onAnimationEndCapture: S, className: C, ...w }) {
|
|
18
|
+
let T = e("sheet"), E = n(x);
|
|
19
|
+
return /* @__PURE__ */ c(l.Root, {
|
|
20
|
+
open: o,
|
|
21
|
+
onOpenChange: (e) => d(e),
|
|
22
|
+
children: [b && /* @__PURE__ */ s(l.Trigger, { render: b }), /* @__PURE__ */ c(l.Portal, {
|
|
23
|
+
container: E,
|
|
24
|
+
children: [/* @__PURE__ */ s(a, { className: "sheet__overlay" }), /* @__PURE__ */ c(l.Popup, {
|
|
25
|
+
className: ["sheet", C].filter(Boolean).join(" "),
|
|
26
|
+
"data-side": f,
|
|
27
|
+
onAnimationEndCapture: S,
|
|
28
|
+
...w,
|
|
28
29
|
children: [
|
|
29
|
-
/* @__PURE__ */
|
|
30
|
+
/* @__PURE__ */ c(i, {
|
|
30
31
|
layout: "stacked",
|
|
31
32
|
className: "sheet__header",
|
|
32
|
-
children: [
|
|
33
|
+
children: [m ? /* @__PURE__ */ s(l.Title, { render: /* @__PURE__ */ s(t, { children: p }) }) : /* @__PURE__ */ s(l.Title, {
|
|
33
34
|
className: "sheet__title",
|
|
34
|
-
children:
|
|
35
|
-
}),
|
|
35
|
+
children: p
|
|
36
|
+
}), h != null && /* @__PURE__ */ s(l.Description, {
|
|
36
37
|
className: "sheet__description",
|
|
37
|
-
children:
|
|
38
|
+
children: h
|
|
38
39
|
})]
|
|
39
40
|
}),
|
|
40
|
-
!
|
|
41
|
+
!y && /* @__PURE__ */ s(l.Close, {
|
|
41
42
|
className: "sheet__close",
|
|
42
|
-
render: /* @__PURE__ */
|
|
43
|
+
render: /* @__PURE__ */ s(r, { label: T("close", v) })
|
|
43
44
|
}),
|
|
44
|
-
/* @__PURE__ */
|
|
45
|
+
/* @__PURE__ */ s("div", {
|
|
45
46
|
className: "sheet__body",
|
|
46
|
-
children:
|
|
47
|
+
children: _
|
|
47
48
|
}),
|
|
48
|
-
|
|
49
|
+
g && /* @__PURE__ */ s(u, { children: g })
|
|
49
50
|
]
|
|
50
51
|
})]
|
|
51
52
|
})]
|
|
52
53
|
});
|
|
53
54
|
}
|
|
54
55
|
//#endregion
|
|
55
|
-
export {
|
|
56
|
+
export { d as Sheet, u as SheetFooter };
|