@studiolxd/brand 45.0.0 → 46.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 +70 -0
- package/dist/_shared/tokens.js +9 -0
- package/dist/_types/messages/BrandMessages.d.ts +13 -1
- package/dist/_types/messages/index.d.ts +1 -1
- package/dist/_types/molecules/AppLauncher/AppLauncher.d.ts +43 -8
- package/dist/_types/molecules/CommandPalette/CommandPalette.d.ts +43 -8
- package/dist/_types/molecules/Consent/Consent.d.ts +93 -20
- package/dist/_types/molecules/NotificationButton/NotificationButton.d.ts +17 -4
- package/dist/_types/molecules/NotificationPanel/NotificationPanel.d.ts +54 -8
- package/dist/_types/sections/FloatingDock/FloatingDock.d.ts +33 -3
- package/dist/app-launcher.js +67 -61
- package/dist/brand.css +137 -6
- package/dist/command-palette.js +38 -36
- package/dist/consent.js +75 -73
- package/dist/floating-dock.js +42 -41
- package/dist/multi-select.css +1 -1
- package/dist/multi-select.js +1 -2
- package/dist/notification-button.js +18 -17
- package/dist/notification-panel.js +81 -80
- package/dist/select.css +1 -1
- package/dist/select.js +1 -2
- package/dist/tokens.css +137 -6
- package/package.json +1 -1
- package/src/tokens/components/control.css +4 -1
- package/src/tokens/components/multi-select.css +3 -0
- package/src/tokens/components/select.css +3 -0
- package/src/tokens/molecules/filter-bar.css +2 -2
- package/src/tokens/scss/components/_control.scss +4 -1
- package/src/tokens/scss/components/_multi-select.scss +3 -0
- package/src/tokens/scss/components/_select.scss +3 -0
- package/src/tokens/scss/molecules/_filter-bar.scss +2 -2
- package/src/tokens/surface-public.css +124 -2
- package/src/tokens/tokens.json +9 -0
package/dist/app-launcher.js
CHANGED
|
@@ -1,119 +1,125 @@
|
|
|
1
1
|
'use client';
|
|
2
2
|
import './app-launcher.css';
|
|
3
|
-
import {
|
|
4
|
-
import {
|
|
5
|
-
import {
|
|
6
|
-
import {
|
|
7
|
-
import {
|
|
8
|
-
import {
|
|
3
|
+
import { n as e } from "./_shared/brandmessagescontext.js";
|
|
4
|
+
import { Icon as t } from "./icon.js";
|
|
5
|
+
import { Tag as n } from "./tag.js";
|
|
6
|
+
import { Modal as r } from "./modal.js";
|
|
7
|
+
import { useState as i } from "react";
|
|
8
|
+
import { Fragment as a, jsx as o, jsxs as s } from "react/jsx-runtime";
|
|
9
|
+
import { Popover as c } from "@base-ui/react/popover";
|
|
9
10
|
//#region src/stories/molecules/AppLauncher/AppLauncher.tsx
|
|
10
|
-
function
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
11
|
+
function l({ app: t, isCurrent: r, newLabel: i }) {
|
|
12
|
+
let a = e("appLauncher");
|
|
13
|
+
return /* @__PURE__ */ s("a", {
|
|
14
|
+
href: t.url,
|
|
15
|
+
className: `app-launcher__tile${r ? " app-launcher__tile--active" : ""}`,
|
|
16
|
+
"aria-current": r ? "page" : void 0,
|
|
17
|
+
children: [/* @__PURE__ */ o("span", {
|
|
16
18
|
className: "app-launcher__tile-name",
|
|
17
|
-
children:
|
|
18
|
-
}),
|
|
19
|
+
children: t.name
|
|
20
|
+
}), t.isNew && /* @__PURE__ */ o(n, {
|
|
19
21
|
variant: "info",
|
|
20
22
|
className: "app-launcher__tile-badge",
|
|
21
|
-
children:
|
|
23
|
+
children: a("new", i)
|
|
22
24
|
})]
|
|
23
25
|
});
|
|
24
26
|
}
|
|
25
|
-
function
|
|
26
|
-
return /* @__PURE__ */
|
|
27
|
+
function u({ apps: e, currentAppId: t, newLabel: n }) {
|
|
28
|
+
return /* @__PURE__ */ o("ul", {
|
|
27
29
|
className: "app-launcher__grid",
|
|
28
30
|
role: "list",
|
|
29
|
-
children: e.map((e) => /* @__PURE__ */
|
|
31
|
+
children: e.map((e) => /* @__PURE__ */ o("li", { children: /* @__PURE__ */ o(l, {
|
|
30
32
|
app: e,
|
|
31
33
|
isCurrent: e.id === t,
|
|
32
34
|
newLabel: n
|
|
33
35
|
}) }, e.id))
|
|
34
36
|
});
|
|
35
37
|
}
|
|
36
|
-
function
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
38
|
+
function d({ apps: n, labels: r, currentAppId: i, open: a, defaultOpen: l, onOpenChange: d }) {
|
|
39
|
+
let f = e("appLauncher");
|
|
40
|
+
return /* @__PURE__ */ s(c.Root, {
|
|
41
|
+
open: a,
|
|
42
|
+
defaultOpen: l,
|
|
43
|
+
onOpenChange: (e) => d?.(e),
|
|
44
|
+
children: [/* @__PURE__ */ o(c.Trigger, { render: r.trigger ? /* @__PURE__ */ s("button", {
|
|
42
45
|
type: "button",
|
|
43
46
|
className: "app-launcher__trigger app-launcher__trigger--label",
|
|
44
|
-
children: [/* @__PURE__ */
|
|
47
|
+
children: [/* @__PURE__ */ o(t, {
|
|
45
48
|
name: "grid",
|
|
46
49
|
size: "md"
|
|
47
|
-
}), /* @__PURE__ */
|
|
50
|
+
}), /* @__PURE__ */ o("span", {
|
|
48
51
|
className: "app-launcher__trigger-label",
|
|
49
|
-
children:
|
|
52
|
+
children: r.trigger
|
|
50
53
|
})]
|
|
51
|
-
}) : /* @__PURE__ */
|
|
54
|
+
}) : /* @__PURE__ */ o("button", {
|
|
52
55
|
type: "button",
|
|
53
56
|
className: "app-launcher__trigger",
|
|
54
|
-
"aria-label":
|
|
55
|
-
children: /* @__PURE__ */
|
|
57
|
+
"aria-label": f("open", r.open),
|
|
58
|
+
children: /* @__PURE__ */ o(t, {
|
|
56
59
|
name: "grid",
|
|
57
60
|
size: "md"
|
|
58
61
|
})
|
|
59
|
-
}) }), /* @__PURE__ */
|
|
62
|
+
}) }), /* @__PURE__ */ o(c.Portal, { children: /* @__PURE__ */ o(c.Positioner, {
|
|
60
63
|
className: "app-launcher__positioner",
|
|
61
64
|
sideOffset: 4,
|
|
62
65
|
align: "end",
|
|
63
|
-
children: /* @__PURE__ */
|
|
66
|
+
children: /* @__PURE__ */ o(c.Popup, {
|
|
64
67
|
className: "app-launcher__content",
|
|
65
|
-
children: /* @__PURE__ */
|
|
66
|
-
apps:
|
|
67
|
-
currentAppId:
|
|
68
|
-
newLabel:
|
|
68
|
+
children: /* @__PURE__ */ o(u, {
|
|
69
|
+
apps: n,
|
|
70
|
+
currentAppId: i,
|
|
71
|
+
newLabel: r.new
|
|
69
72
|
})
|
|
70
73
|
})
|
|
71
74
|
}) })]
|
|
72
75
|
});
|
|
73
76
|
}
|
|
74
|
-
function
|
|
75
|
-
let [
|
|
76
|
-
return [e ??
|
|
77
|
+
function f(e, t, n) {
|
|
78
|
+
let [r, a] = i(t ?? !1);
|
|
79
|
+
return [e ?? r, (t) => {
|
|
77
80
|
e === void 0 && a(t), n?.(t);
|
|
78
81
|
}];
|
|
79
82
|
}
|
|
80
|
-
function
|
|
81
|
-
let [
|
|
82
|
-
return /* @__PURE__ */
|
|
83
|
+
function p({ apps: n, labels: i, currentAppId: c, open: l, defaultOpen: d, onOpenChange: p }) {
|
|
84
|
+
let m = e("appLauncher"), [h, g] = f(l, d, p);
|
|
85
|
+
return /* @__PURE__ */ s(a, { children: [i.trigger ? /* @__PURE__ */ s("button", {
|
|
83
86
|
type: "button",
|
|
84
87
|
className: "app-launcher__trigger app-launcher__trigger--label",
|
|
85
88
|
"aria-haspopup": "dialog",
|
|
86
|
-
onClick: () =>
|
|
87
|
-
children: [/* @__PURE__ */
|
|
89
|
+
onClick: () => g(!0),
|
|
90
|
+
children: [/* @__PURE__ */ o(t, {
|
|
88
91
|
name: "grid",
|
|
89
92
|
size: "md"
|
|
90
|
-
}), /* @__PURE__ */
|
|
93
|
+
}), /* @__PURE__ */ o("span", {
|
|
91
94
|
className: "app-launcher__trigger-label",
|
|
92
|
-
children:
|
|
95
|
+
children: i.trigger
|
|
93
96
|
})]
|
|
94
|
-
}) : /* @__PURE__ */
|
|
97
|
+
}) : /* @__PURE__ */ o("button", {
|
|
95
98
|
type: "button",
|
|
96
99
|
className: "app-launcher__trigger",
|
|
97
|
-
"aria-label":
|
|
100
|
+
"aria-label": m("open", i.open),
|
|
98
101
|
"aria-haspopup": "dialog",
|
|
99
|
-
onClick: () =>
|
|
100
|
-
children: /* @__PURE__ */
|
|
102
|
+
onClick: () => g(!0),
|
|
103
|
+
children: /* @__PURE__ */ o(t, {
|
|
101
104
|
name: "grid",
|
|
102
105
|
size: "md"
|
|
103
106
|
})
|
|
104
|
-
}), /* @__PURE__ */
|
|
105
|
-
open:
|
|
106
|
-
onClose: () =>
|
|
107
|
-
title:
|
|
108
|
-
children: /* @__PURE__ */
|
|
109
|
-
apps:
|
|
110
|
-
currentAppId:
|
|
111
|
-
newLabel:
|
|
107
|
+
}), /* @__PURE__ */ o(r, {
|
|
108
|
+
open: h,
|
|
109
|
+
onClose: () => g(!1),
|
|
110
|
+
title: m("title", i.title),
|
|
111
|
+
children: /* @__PURE__ */ o(u, {
|
|
112
|
+
apps: n,
|
|
113
|
+
currentAppId: c,
|
|
114
|
+
newLabel: i.new
|
|
112
115
|
})
|
|
113
116
|
})] });
|
|
114
117
|
}
|
|
115
|
-
function
|
|
116
|
-
return
|
|
118
|
+
function m({ presentation: e = "modal", labels: t = {}, ...n }) {
|
|
119
|
+
return o(e === "popover" ? d : p, {
|
|
120
|
+
labels: t,
|
|
121
|
+
...n
|
|
122
|
+
});
|
|
117
123
|
}
|
|
118
124
|
//#endregion
|
|
119
|
-
export {
|
|
125
|
+
export { m as AppLauncher };
|