@vkzstudio/muza-ui 1.0.43 → 1.0.45
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/dist/components/Accordion/Accordion.d.ts +42 -6
- package/dist/components/Accordion/Accordion.d.ts.map +1 -1
- package/dist/components/Button/Button.d.ts +71 -17
- package/dist/components/Button/Button.d.ts.map +1 -1
- package/dist/components/DataTable/DataTable.d.ts +66 -20
- package/dist/components/DataTable/DataTable.d.ts.map +1 -1
- package/dist/components/DataTable/DataTable.js +39 -39
- package/dist/components/DataTable/DataTable.stories.d.ts.map +1 -1
- package/dist/components/DatePicker/DatePicker.d.ts +69 -36
- package/dist/components/DatePicker/DatePicker.d.ts.map +1 -1
- package/dist/components/DatePicker/DatePicker.stories.d.ts.map +1 -1
- package/dist/components/DropdownMenu/DropdownMenu.d.ts +38 -7
- package/dist/components/DropdownMenu/DropdownMenu.d.ts.map +1 -1
- package/dist/components/DropdownMenu/DropdownMenu.js +165 -163
- package/dist/components/DropdownMenu/DropdownMenu.stories.d.ts +3 -17
- package/dist/components/DropdownMenu/DropdownMenu.stories.d.ts.map +1 -1
- package/dist/components/EdgeButton/EdgeButton.d.ts +10 -11
- package/dist/components/EdgeButton/EdgeButton.d.ts.map +1 -1
- package/dist/components/ExpandableTable/ExpandableTable.d.ts +103 -19
- package/dist/components/ExpandableTable/ExpandableTable.d.ts.map +1 -1
- package/dist/components/ExpandableTable/ExpandableTable.js +100 -111
- package/dist/components/ExpandableTable/ExpandableTable.stories.d.ts +6 -1
- package/dist/components/ExpandableTable/ExpandableTable.stories.d.ts.map +1 -1
- package/dist/components/ExpandableTable/index.d.ts +1 -1
- package/dist/components/ExpandableTable/index.d.ts.map +1 -1
- package/dist/components/FileUpload/FileItem.d.ts +22 -0
- package/dist/components/FileUpload/FileItem.d.ts.map +1 -1
- package/dist/components/FileUpload/FileItem.js +38 -41
- package/dist/components/FileUpload/FileUpload.d.ts +137 -42
- package/dist/components/FileUpload/FileUpload.d.ts.map +1 -1
- package/dist/components/FileUpload/FileUpload.js +87 -83
- package/dist/components/FileUpload/FileUpload.stories.d.ts +1 -0
- package/dist/components/FileUpload/FileUpload.stories.d.ts.map +1 -1
- package/dist/components/FileUpload/index.d.ts +1 -1
- package/dist/components/FileUpload/index.d.ts.map +1 -1
- package/dist/components/Flex/Flex.d.ts +1 -1
- package/dist/components/Icons/CustomBadges.d.ts +14 -0
- package/dist/components/Icons/CustomBadges.d.ts.map +1 -0
- package/dist/components/Icons/CustomBadges.js +334 -0
- package/dist/components/Icons/CustomIcons.d.ts +24 -0
- package/dist/components/Icons/CustomIcons.d.ts.map +1 -1
- package/dist/components/Icons/CustomIcons.js +88 -42
- package/dist/components/Icons/CustomLogos.d.ts +29 -0
- package/dist/components/Icons/CustomLogos.d.ts.map +1 -0
- package/dist/components/Icons/CustomLogos.js +593 -0
- package/dist/components/Icons/LogosAndBadges.stories.d.ts +7 -0
- package/dist/components/Icons/LogosAndBadges.stories.d.ts.map +1 -0
- package/dist/components/Icons/index.d.ts +2 -0
- package/dist/components/Icons/index.d.ts.map +1 -1
- package/dist/components/Input/Input.d.ts +33 -34
- package/dist/components/Input/Input.d.ts.map +1 -1
- package/dist/components/Input/Input.stories.d.ts.map +1 -1
- package/dist/components/LanguageSwitcher/LanguageSwitcher.d.ts +24 -1
- package/dist/components/LanguageSwitcher/LanguageSwitcher.d.ts.map +1 -1
- package/dist/components/LanguageSwitcher/LanguageSwitcher.js +71 -52
- package/dist/components/LanguageSwitcher/LanguageSwitcher.stories.d.ts +2 -0
- package/dist/components/LanguageSwitcher/LanguageSwitcher.stories.d.ts.map +1 -1
- package/dist/components/MultiSelect/MultiSelect.d.ts +50 -23
- package/dist/components/MultiSelect/MultiSelect.d.ts.map +1 -1
- package/dist/components/MultiSelect/MultiSelect.js +18 -17
- package/dist/components/Reorderable/Reorderable.d.ts +48 -1
- package/dist/components/Reorderable/Reorderable.d.ts.map +1 -1
- package/dist/components/ReorderableTable/ReorderableTable.d.ts +34 -17
- package/dist/components/ReorderableTable/ReorderableTable.d.ts.map +1 -1
- package/dist/components/ReorderableTable/ReorderableTable.stories.d.ts.map +1 -1
- package/dist/components/ResponsiveLayoutTable/ResponsiveLayoutTable.d.ts +266 -0
- package/dist/components/ResponsiveLayoutTable/ResponsiveLayoutTable.d.ts.map +1 -0
- package/dist/components/ResponsiveLayoutTable/ResponsiveLayoutTable.examples.d.ts +39 -0
- package/dist/components/ResponsiveLayoutTable/ResponsiveLayoutTable.examples.d.ts.map +1 -0
- package/dist/components/ResponsiveLayoutTable/ResponsiveLayoutTable.js +134 -0
- package/dist/components/ResponsiveLayoutTable/ResponsiveLayoutTable.stories.d.ts +14 -0
- package/dist/components/ResponsiveLayoutTable/ResponsiveLayoutTable.stories.d.ts.map +1 -0
- package/dist/components/ResponsiveLayoutTable/index.d.ts +2 -0
- package/dist/components/ResponsiveLayoutTable/index.d.ts.map +1 -0
- package/dist/components/Select/Select.d.ts +58 -28
- package/dist/components/Select/Select.d.ts.map +1 -1
- package/dist/components/Select/Select.js +123 -92
- package/dist/components/Select/Select.stories.d.ts +1 -0
- package/dist/components/Select/Select.stories.d.ts.map +1 -1
- package/dist/components/Select/index.d.ts +1 -1
- package/dist/components/Select/index.d.ts.map +1 -1
- package/dist/components/Select/utils.d.ts +1 -0
- package/dist/components/Select/utils.d.ts.map +1 -1
- package/dist/components/Select/utils.js +5 -2
- package/dist/components/TextEditor/TextEditor.d.ts +82 -46
- package/dist/components/TextEditor/TextEditor.d.ts.map +1 -1
- package/dist/components/TextEditor/TextEditor.stories.d.ts.map +1 -1
- package/dist/components/TextEditor/index.d.ts +1 -1
- package/dist/components/TextEditor/index.d.ts.map +1 -1
- package/dist/components/Textarea/Textarea.d.ts +41 -10
- package/dist/components/Textarea/Textarea.d.ts.map +1 -1
- package/dist/components/Textarea/Textarea.stories.d.ts.map +1 -1
- package/dist/components/Toggle/Toggle.js +1 -1
- package/dist/components/ToggleCheckButton/ToggleCheckButton.d.ts +69 -0
- package/dist/components/ToggleCheckButton/ToggleCheckButton.d.ts.map +1 -0
- package/dist/components/ToggleCheckButton/ToggleCheckButton.js +64 -0
- package/dist/components/ToggleCheckButton/ToggleCheckButton.stories.d.ts +8 -0
- package/dist/components/ToggleCheckButton/ToggleCheckButton.stories.d.ts.map +1 -0
- package/dist/components/ToggleCheckButton/index.d.ts +2 -0
- package/dist/components/ToggleCheckButton/index.d.ts.map +1 -0
- package/dist/components/WebCheckoutNav/WebCheckoutNav.examples.d.ts +19 -0
- package/dist/components/WebCheckoutNav/WebCheckoutNav.examples.d.ts.map +1 -0
- package/dist/components/WebCheckoutNav/WebCheckoutNav.stories.d.ts +8 -0
- package/dist/components/WebCheckoutNav/WebCheckoutNav.stories.d.ts.map +1 -0
- package/dist/components/index.d.ts +2 -0
- package/dist/components/index.d.ts.map +1 -1
- package/dist/hooks/use-is-breakpoint.d.ts +11 -0
- package/dist/hooks/use-is-breakpoint.d.ts.map +1 -1
- package/dist/hooks/use-is-breakpoint.js +24 -13
- package/dist/index.js +236 -215
- package/dist/muza-ui.css +1 -1
- package/dist/styles/token-colors.css +64 -3
- package/dist/styles/token-sizes.css +86 -54
- package/dist/utils/cn.d.ts.map +1 -1
- package/dist/utils/cn.js +16 -5
- package/package.json +1 -1
|
@@ -1,60 +1,61 @@
|
|
|
1
|
-
import { jsx as e, jsxs as
|
|
2
|
-
import * as
|
|
3
|
-
import * as
|
|
4
|
-
import { cva as
|
|
5
|
-
import { Button as
|
|
6
|
-
import {
|
|
7
|
-
import {
|
|
1
|
+
import { jsx as e, jsxs as b, Fragment as y } from "react/jsx-runtime";
|
|
2
|
+
import * as m from "react";
|
|
3
|
+
import * as a from "@radix-ui/react-dropdown-menu";
|
|
4
|
+
import { cva as N } from "class-variance-authority";
|
|
5
|
+
import { Button as I } from "../Button/Button.js";
|
|
6
|
+
import { Flex as D } from "../Flex/Flex.js";
|
|
7
|
+
import { cn as s } from "../../utils/cn.js";
|
|
8
8
|
import { UnreadOutline as x } from "@solar-icons/react-perf";
|
|
9
|
-
|
|
10
|
-
|
|
9
|
+
import { Typography as f } from "../Typography/Typography.js";
|
|
10
|
+
const g = m.createContext(null), M = () => m.useContext(g), B = ({ ...o }) => /* @__PURE__ */ e(a.Root, { "data-slot": "dropdown-menu", ...o }), F = ({ ...o }) => /* @__PURE__ */ e(a.Portal, { "data-slot": "dropdown-menu-portal", ...o }), H = ({ ...o }) => /* @__PURE__ */ e(
|
|
11
|
+
a.Trigger,
|
|
11
12
|
{
|
|
12
13
|
"data-slot": "dropdown-menu-trigger",
|
|
13
14
|
...o
|
|
14
15
|
}
|
|
15
|
-
),
|
|
16
|
+
), O = ({
|
|
16
17
|
className: o,
|
|
17
18
|
sideOffset: t = 4,
|
|
18
|
-
align:
|
|
19
|
-
...
|
|
19
|
+
align: n = "start",
|
|
20
|
+
...r
|
|
20
21
|
}) => {
|
|
21
|
-
const [
|
|
22
|
-
return
|
|
23
|
-
const
|
|
24
|
-
if (
|
|
25
|
-
const { scrollHeight:
|
|
26
|
-
|
|
22
|
+
const [c, i] = m.useState(!1), d = m.useRef(null);
|
|
23
|
+
return m.useEffect(() => {
|
|
24
|
+
const l = () => {
|
|
25
|
+
if (d.current) {
|
|
26
|
+
const { scrollHeight: v, clientHeight: k } = d.current;
|
|
27
|
+
i(v > k);
|
|
27
28
|
}
|
|
28
|
-
}, u = setTimeout(
|
|
29
|
-
return
|
|
30
|
-
clearTimeout(u),
|
|
29
|
+
}, u = setTimeout(l, 10), p = new ResizeObserver(l);
|
|
30
|
+
return d.current && p.observe(d.current), () => {
|
|
31
|
+
clearTimeout(u), p.disconnect();
|
|
31
32
|
};
|
|
32
|
-
}, [
|
|
33
|
-
|
|
33
|
+
}, [r.children]), /* @__PURE__ */ e(a.Portal, { children: /* @__PURE__ */ e(
|
|
34
|
+
a.Content,
|
|
34
35
|
{
|
|
35
36
|
"data-slot": "dropdown-menu-content",
|
|
36
37
|
sideOffset: t,
|
|
37
|
-
align:
|
|
38
|
-
className:
|
|
38
|
+
align: n,
|
|
39
|
+
className: s(
|
|
39
40
|
"z-50 max-h-(--radix-dropdown-menu-content-available-height) min-w-[8rem] origin-(--radix-dropdown-menu-content-transform-origin) overflow-hidden data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95",
|
|
40
41
|
"flex flex-col rounded-xl bg-comp-select-fill-def dropdown-shadow-default",
|
|
41
42
|
o
|
|
42
43
|
),
|
|
43
|
-
...
|
|
44
|
+
...r,
|
|
44
45
|
children: /* @__PURE__ */ e(
|
|
45
46
|
"div",
|
|
46
47
|
{
|
|
47
|
-
ref:
|
|
48
|
-
className:
|
|
48
|
+
ref: d,
|
|
49
|
+
className: s(
|
|
49
50
|
"scrollbar-thin scrollbar-track-transparent scrollbar-thumb-stroke-base-secondary hover:scrollbar-thumb-stroke-base-primary scrollbar-thumb-rounded-full my-sm max-h-full overflow-y-auto px-sm py-0 [&::-webkit-scrollbar]:w-1 [&::-webkit-scrollbar]:bg-transparent [&::-webkit-scrollbar-thumb]:rounded-full [&::-webkit-scrollbar-thumb]:border-2 [&::-webkit-scrollbar-thumb]:border-transparent [&::-webkit-scrollbar-thumb]:bg-stroke-base-secondary hover:[&::-webkit-scrollbar-thumb]:bg-stroke-base-primary [&::-webkit-scrollbar-track]:bg-transparent",
|
|
50
|
-
|
|
51
|
+
c && "w-[calc(100%_-_var(--spacing-sm))]"
|
|
51
52
|
),
|
|
52
|
-
children:
|
|
53
|
+
children: r.children
|
|
53
54
|
}
|
|
54
55
|
)
|
|
55
56
|
}
|
|
56
57
|
) });
|
|
57
|
-
},
|
|
58
|
+
}, w = N(
|
|
58
59
|
[
|
|
59
60
|
"text-comp-dropdown-menu-text-primary flex cursor-pointer items-center gap-sm rounded-md pt-md pr-lg pb-md pl-lg outline-0 transition-colors",
|
|
60
61
|
"hover:bg-comp-dropdown-menu-fill-base-hover hover:text-comp-dropdown-menu-text-base-hover",
|
|
@@ -79,205 +80,206 @@ const h = l.createContext(null), N = () => l.useContext(h), T = ({ ...o }) => /*
|
|
|
79
80
|
variant: "base"
|
|
80
81
|
}
|
|
81
82
|
}
|
|
82
|
-
),
|
|
83
|
+
), h = ({
|
|
84
|
+
children: o,
|
|
85
|
+
description: t
|
|
86
|
+
}) => typeof o == "function" ? /* @__PURE__ */ e(y, { children: o }) : t ? /* @__PURE__ */ b(D, { flex: 1, direction: "column", className: "min-w-0", children: [
|
|
87
|
+
/* @__PURE__ */ e(
|
|
88
|
+
f,
|
|
89
|
+
{
|
|
90
|
+
component: "span",
|
|
91
|
+
size: "sm",
|
|
92
|
+
variant: "body",
|
|
93
|
+
weight: "medium",
|
|
94
|
+
fixY: !0,
|
|
95
|
+
children: o
|
|
96
|
+
}
|
|
97
|
+
),
|
|
98
|
+
/* @__PURE__ */ e(f, { component: "span", size: "sm", variant: "body", weight: "regular", children: t })
|
|
99
|
+
] }) : /* @__PURE__ */ e(
|
|
100
|
+
f,
|
|
101
|
+
{
|
|
102
|
+
component: "span",
|
|
103
|
+
size: "sm",
|
|
104
|
+
weight: "medium",
|
|
105
|
+
className: "flex-1",
|
|
106
|
+
fixY: !0,
|
|
107
|
+
children: o
|
|
108
|
+
}
|
|
109
|
+
), Y = ({
|
|
83
110
|
className: o,
|
|
84
111
|
variant: t,
|
|
85
|
-
children:
|
|
86
|
-
icon:
|
|
87
|
-
disabled:
|
|
88
|
-
isActive:
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
112
|
+
children: n,
|
|
113
|
+
icon: r,
|
|
114
|
+
disabled: c,
|
|
115
|
+
isActive: i,
|
|
116
|
+
description: d,
|
|
117
|
+
...l
|
|
118
|
+
}) => /* @__PURE__ */ b(
|
|
119
|
+
a.Item,
|
|
92
120
|
{
|
|
93
121
|
"data-slot": "dropdown-menu-item",
|
|
94
|
-
disabled:
|
|
95
|
-
className:
|
|
122
|
+
disabled: c,
|
|
123
|
+
className: s(
|
|
96
124
|
"group",
|
|
97
|
-
|
|
125
|
+
w({
|
|
98
126
|
variant: t,
|
|
99
|
-
disabled:
|
|
100
|
-
checked:
|
|
127
|
+
disabled: c,
|
|
128
|
+
checked: i
|
|
101
129
|
}),
|
|
102
130
|
o
|
|
103
131
|
),
|
|
104
|
-
...
|
|
132
|
+
...l,
|
|
105
133
|
children: [
|
|
106
|
-
|
|
134
|
+
r && /* @__PURE__ */ e(
|
|
107
135
|
"span",
|
|
108
136
|
{
|
|
109
|
-
className:
|
|
137
|
+
className: s("block [&>svg]:block [&>svg]:size-icon-small", {
|
|
110
138
|
"text-comp-dropdown-menu-text-error": t === "destructive",
|
|
111
139
|
"group-focus-visible:-icon-brand-focused text-icon-dark-secondary-def group-hover:text-icon-brand-def": t !== "destructive",
|
|
112
|
-
"text-comp-dropdown-menu-icon-base-active":
|
|
140
|
+
"text-comp-dropdown-menu-icon-base-active": i
|
|
113
141
|
}),
|
|
114
|
-
children: n
|
|
115
|
-
}
|
|
116
|
-
),
|
|
117
|
-
typeof r != "function" ? /* @__PURE__ */ e(
|
|
118
|
-
b,
|
|
119
|
-
{
|
|
120
|
-
component: "span",
|
|
121
|
-
size: "sm",
|
|
122
|
-
weight: "medium",
|
|
123
|
-
className: "flex-1",
|
|
124
|
-
fixY: !0,
|
|
125
142
|
children: r
|
|
126
143
|
}
|
|
127
|
-
)
|
|
144
|
+
),
|
|
145
|
+
/* @__PURE__ */ e(h, { description: d, children: n })
|
|
128
146
|
]
|
|
129
147
|
}
|
|
130
|
-
),
|
|
148
|
+
), _ = ({
|
|
131
149
|
children: o,
|
|
132
150
|
buttonProps: t,
|
|
133
|
-
className:
|
|
134
|
-
...
|
|
151
|
+
className: n,
|
|
152
|
+
...r
|
|
135
153
|
}) => /* @__PURE__ */ e("div", { className: "my-md px-lg", children: /* @__PURE__ */ e(
|
|
136
|
-
|
|
154
|
+
a.Item,
|
|
137
155
|
{
|
|
138
156
|
"data-slot": "dropdown-menu-item",
|
|
139
157
|
asChild: !0,
|
|
140
|
-
...
|
|
158
|
+
...r,
|
|
141
159
|
children: /* @__PURE__ */ e(
|
|
142
|
-
|
|
160
|
+
I,
|
|
143
161
|
{
|
|
144
162
|
fullWidth: !0,
|
|
145
163
|
...t,
|
|
146
|
-
className:
|
|
164
|
+
className: s(
|
|
147
165
|
"outline-0 hover:ring-transparent",
|
|
148
|
-
|
|
166
|
+
n,
|
|
149
167
|
t.className
|
|
150
168
|
),
|
|
151
169
|
children: o
|
|
152
170
|
}
|
|
153
171
|
)
|
|
154
172
|
}
|
|
155
|
-
) }),
|
|
173
|
+
) }), E = ({
|
|
156
174
|
className: o,
|
|
157
175
|
children: t,
|
|
158
|
-
checked:
|
|
159
|
-
variant:
|
|
160
|
-
icon:
|
|
161
|
-
|
|
162
|
-
|
|
163
|
-
|
|
176
|
+
checked: n,
|
|
177
|
+
variant: r,
|
|
178
|
+
icon: c,
|
|
179
|
+
description: i,
|
|
180
|
+
...d
|
|
181
|
+
}) => /* @__PURE__ */ b(
|
|
182
|
+
a.CheckboxItem,
|
|
164
183
|
{
|
|
165
184
|
"data-slot": "dropdown-menu-checkbox-item",
|
|
166
|
-
className:
|
|
167
|
-
|
|
168
|
-
variant:
|
|
169
|
-
checked: !!
|
|
185
|
+
className: s(
|
|
186
|
+
w({
|
|
187
|
+
variant: r,
|
|
188
|
+
checked: !!n
|
|
170
189
|
}),
|
|
171
190
|
o
|
|
172
191
|
),
|
|
173
|
-
checked:
|
|
174
|
-
onSelect: (
|
|
175
|
-
|
|
192
|
+
checked: n,
|
|
193
|
+
onSelect: (l) => {
|
|
194
|
+
l.preventDefault();
|
|
176
195
|
},
|
|
177
|
-
...
|
|
196
|
+
...d,
|
|
178
197
|
children: [
|
|
179
|
-
|
|
198
|
+
c && /* @__PURE__ */ e(
|
|
180
199
|
"span",
|
|
181
200
|
{
|
|
182
|
-
className:
|
|
183
|
-
"text-comp-dropdown-menu-text-error":
|
|
184
|
-
"group-focus-visible:-icon-brand-focused text-icon-dark-secondary-def group-hover:text-icon-brand-def":
|
|
201
|
+
className: s({
|
|
202
|
+
"text-comp-dropdown-menu-text-error": r === "destructive",
|
|
203
|
+
"group-focus-visible:-icon-brand-focused text-icon-dark-secondary-def group-hover:text-icon-brand-def": r !== "destructive"
|
|
185
204
|
}),
|
|
186
|
-
children:
|
|
205
|
+
children: c
|
|
187
206
|
}
|
|
188
207
|
),
|
|
189
|
-
|
|
190
|
-
|
|
191
|
-
{
|
|
192
|
-
component: "span",
|
|
193
|
-
size: "sm",
|
|
194
|
-
weight: "medium",
|
|
195
|
-
className: "flex-1 fix-y-text",
|
|
196
|
-
children: t
|
|
197
|
-
}
|
|
198
|
-
) : t,
|
|
199
|
-
/* @__PURE__ */ e("span", { className: "text-comp-dropdown-menu-icon-brand-def", children: /* @__PURE__ */ e(d.ItemIndicator, { children: /* @__PURE__ */ e(x, { className: "size-icon-small" }) }) })
|
|
208
|
+
/* @__PURE__ */ e(h, { description: i, children: t }),
|
|
209
|
+
/* @__PURE__ */ e("span", { className: "text-comp-dropdown-menu-icon-brand-def", children: /* @__PURE__ */ e(a.ItemIndicator, { children: /* @__PURE__ */ e(x, { className: "size-icon-small" }) }) })
|
|
200
210
|
]
|
|
201
211
|
}
|
|
202
|
-
),
|
|
212
|
+
), L = ({
|
|
203
213
|
value: o,
|
|
204
214
|
onValueChange: t,
|
|
205
|
-
...
|
|
206
|
-
}) => /* @__PURE__ */ e(
|
|
207
|
-
|
|
215
|
+
...n
|
|
216
|
+
}) => /* @__PURE__ */ e(g.Provider, { value: { value: o, onValueChange: t }, children: /* @__PURE__ */ e(
|
|
217
|
+
a.RadioGroup,
|
|
208
218
|
{
|
|
209
219
|
"data-slot": "dropdown-menu-radio-group",
|
|
210
220
|
value: o,
|
|
211
221
|
onValueChange: t,
|
|
212
|
-
...
|
|
222
|
+
...n
|
|
213
223
|
}
|
|
214
|
-
) }),
|
|
215
|
-
|
|
216
|
-
|
|
217
|
-
|
|
218
|
-
|
|
219
|
-
|
|
220
|
-
|
|
221
|
-
|
|
222
|
-
|
|
223
|
-
|
|
224
|
-
|
|
225
|
-
|
|
226
|
-
|
|
227
|
-
|
|
228
|
-
|
|
229
|
-
value: s,
|
|
230
|
-
...c,
|
|
231
|
-
children: [
|
|
232
|
-
n && /* @__PURE__ */ e(
|
|
233
|
-
"span",
|
|
234
|
-
{
|
|
235
|
-
className: i({
|
|
236
|
-
"text-comp-dropdown-menu-text-error": r === "destructive",
|
|
237
|
-
"group-focus-visible:-icon-brand-focused text-icon-dark-secondary-def group-hover:text-icon-brand-def": r !== "destructive",
|
|
238
|
-
"text-comp-dropdown-menu-text-base-disabled": c.disabled
|
|
239
|
-
}),
|
|
240
|
-
children: n
|
|
241
|
-
}
|
|
224
|
+
) }), R = m.forwardRef(
|
|
225
|
+
({ className: o, children: t, variant: n, icon: r, description: c, value: i, ...d }, l) => {
|
|
226
|
+
const u = M(), p = (u == null ? void 0 : u.value) === i;
|
|
227
|
+
return /* @__PURE__ */ b(
|
|
228
|
+
a.RadioItem,
|
|
229
|
+
{
|
|
230
|
+
ref: l,
|
|
231
|
+
"data-slot": "dropdown-menu-radio-item",
|
|
232
|
+
className: s(
|
|
233
|
+
w({
|
|
234
|
+
variant: n,
|
|
235
|
+
checked: p
|
|
236
|
+
}),
|
|
237
|
+
o,
|
|
238
|
+
d.disabled && "cursor-not-allowed text-comp-dropdown-menu-text-base-disabled hover:bg-transparent hover:text-comp-dropdown-menu-text-base-disabled"
|
|
242
239
|
),
|
|
243
|
-
|
|
244
|
-
|
|
245
|
-
|
|
246
|
-
|
|
247
|
-
|
|
248
|
-
|
|
249
|
-
|
|
250
|
-
|
|
251
|
-
|
|
252
|
-
|
|
253
|
-
|
|
254
|
-
|
|
255
|
-
|
|
256
|
-
|
|
257
|
-
|
|
258
|
-
})
|
|
259
|
-
|
|
260
|
-
|
|
240
|
+
value: i,
|
|
241
|
+
...d,
|
|
242
|
+
children: [
|
|
243
|
+
r && /* @__PURE__ */ e(
|
|
244
|
+
"span",
|
|
245
|
+
{
|
|
246
|
+
className: s({
|
|
247
|
+
"text-comp-dropdown-menu-text-error": n === "destructive",
|
|
248
|
+
"group-focus-visible:-icon-brand-focused text-icon-dark-secondary-def group-hover:text-icon-brand-def": n !== "destructive",
|
|
249
|
+
"text-comp-dropdown-menu-text-base-disabled": d.disabled
|
|
250
|
+
}),
|
|
251
|
+
children: r
|
|
252
|
+
}
|
|
253
|
+
),
|
|
254
|
+
/* @__PURE__ */ e(h, { description: c, children: t }),
|
|
255
|
+
/* @__PURE__ */ e("span", { className: "text-comp-dropdown-menu-icon-brand-def", children: /* @__PURE__ */ e(a.ItemIndicator, { children: /* @__PURE__ */ e(x, { className: "size-icon-small" }) }) })
|
|
256
|
+
]
|
|
257
|
+
}
|
|
258
|
+
);
|
|
259
|
+
}
|
|
260
|
+
);
|
|
261
|
+
R.displayName = "DropdownMenuRadioItem";
|
|
262
|
+
const U = ({
|
|
261
263
|
className: o,
|
|
262
264
|
...t
|
|
263
265
|
}) => /* @__PURE__ */ e(
|
|
264
|
-
|
|
266
|
+
a.Separator,
|
|
265
267
|
{
|
|
266
268
|
"data-slot": "dropdown-menu-separator",
|
|
267
|
-
className:
|
|
269
|
+
className: s("my-sm h-0 border-b border-stroke-base-primary", o),
|
|
268
270
|
...t
|
|
269
271
|
}
|
|
270
272
|
);
|
|
271
273
|
export {
|
|
272
|
-
|
|
273
|
-
|
|
274
|
-
|
|
275
|
-
|
|
276
|
-
|
|
277
|
-
|
|
278
|
-
|
|
279
|
-
|
|
280
|
-
|
|
281
|
-
|
|
282
|
-
|
|
274
|
+
B as DropdownMenu,
|
|
275
|
+
_ as DropdownMenuButtonItem,
|
|
276
|
+
E as DropdownMenuCheckboxItem,
|
|
277
|
+
O as DropdownMenuContent,
|
|
278
|
+
Y as DropdownMenuItem,
|
|
279
|
+
F as DropdownMenuPortal,
|
|
280
|
+
L as DropdownMenuRadioGroup,
|
|
281
|
+
R as DropdownMenuRadioItem,
|
|
282
|
+
U as DropdownMenuSeparator,
|
|
283
|
+
H as DropdownMenuTrigger,
|
|
284
|
+
w as dropdownMenuItemVariants
|
|
283
285
|
};
|
|
@@ -5,8 +5,8 @@ declare const meta: {
|
|
|
5
5
|
subcomponents: {
|
|
6
6
|
DropdownMenuTrigger: ({ ...props }: import('./DropdownMenu').DropdownMenuTriggerProps) => import("react/jsx-runtime").JSX.Element;
|
|
7
7
|
DropdownMenuContent: ({ className, sideOffset, align, ...props }: import('./DropdownMenu').DropdownMenuContentProps) => import("react/jsx-runtime").JSX.Element;
|
|
8
|
-
DropdownMenuItem: ({ className, variant, children, icon, disabled, isActive, ...props }: import('./DropdownMenu').DropdownMenuItemProps) => import("react/jsx-runtime").JSX.Element;
|
|
9
|
-
DropdownMenuCheckboxItem: ({ className, children, checked, variant, icon, ...props }: import('./DropdownMenu').DropdownMenuCheckboxItemProps) => import("react/jsx-runtime").JSX.Element;
|
|
8
|
+
DropdownMenuItem: ({ className, variant, children, icon, disabled, isActive, description, ...props }: import('./DropdownMenu').DropdownMenuItemProps) => import("react/jsx-runtime").JSX.Element;
|
|
9
|
+
DropdownMenuCheckboxItem: ({ className, children, checked, variant, icon, description, ...props }: import('./DropdownMenu').DropdownMenuCheckboxItemProps) => import("react/jsx-runtime").JSX.Element;
|
|
10
10
|
DropdownMenuRadioGroup: ({ value, onValueChange, ...props }: import('./DropdownMenu').DropdownMenuRadioGroupProps) => import("react/jsx-runtime").JSX.Element;
|
|
11
11
|
DropdownMenuRadioItem: import('react').ForwardRefExoticComponent<Omit<import('./DropdownMenu').DropdownMenuRadioItemProps, "ref"> & import('react').RefAttributes<HTMLDivElement>>;
|
|
12
12
|
DropdownMenuSeparator: ({ className, ...props }: import('./DropdownMenu').DropdownMenuSeparatorProps) => import("react/jsx-runtime").JSX.Element;
|
|
@@ -29,34 +29,19 @@ declare const meta: {
|
|
|
29
29
|
argTypes: {
|
|
30
30
|
open: {
|
|
31
31
|
control: "boolean";
|
|
32
|
-
table: {
|
|
33
|
-
category: string;
|
|
34
|
-
};
|
|
35
32
|
};
|
|
36
33
|
defaultOpen: {
|
|
37
34
|
control: "boolean";
|
|
38
|
-
table: {
|
|
39
|
-
category: string;
|
|
40
|
-
};
|
|
41
35
|
};
|
|
42
36
|
onOpenChange: {
|
|
43
37
|
control: false;
|
|
44
|
-
table: {
|
|
45
|
-
category: string;
|
|
46
|
-
};
|
|
47
38
|
};
|
|
48
39
|
modal: {
|
|
49
40
|
control: "boolean";
|
|
50
|
-
table: {
|
|
51
|
-
category: string;
|
|
52
|
-
};
|
|
53
41
|
};
|
|
54
42
|
dir: {
|
|
55
43
|
control: "select";
|
|
56
44
|
options: string[];
|
|
57
|
-
table: {
|
|
58
|
-
category: string;
|
|
59
|
-
};
|
|
60
45
|
};
|
|
61
46
|
};
|
|
62
47
|
};
|
|
@@ -71,5 +56,6 @@ export declare const WithButton: Story;
|
|
|
71
56
|
export declare const ItemVariants: Story;
|
|
72
57
|
export declare const WithCheckboxItems: Story;
|
|
73
58
|
export declare const WithCheckboxItemsWithCustomContent: Story;
|
|
59
|
+
export declare const WithDescriptions: Story;
|
|
74
60
|
export declare const WithRadioGroup: Story;
|
|
75
61
|
//# sourceMappingURL=DropdownMenu.stories.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DropdownMenu.stories.d.ts","sourceRoot":"","sources":["../../../src/components/DropdownMenu/DropdownMenu.stories.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAQ,QAAQ,EAAE,MAAM,uBAAuB,CAAA;AA4B3D,QAAA,MAAM,IAAI
|
|
1
|
+
{"version":3,"file":"DropdownMenu.stories.d.ts","sourceRoot":"","sources":["../../../src/components/DropdownMenu/DropdownMenu.stories.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAQ,QAAQ,EAAE,MAAM,uBAAuB,CAAA;AA4B3D,QAAA,MAAM,IAAI;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA2D2B,CAAA;AAErC,eAAe,IAAI,CAAA;AACnB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAA;AAElC,eAAO,MAAM,OAAO,EAAE,KAyBrB,CAAA;AAED,eAAO,MAAM,SAAS,EAAE,KA+BvB,CAAA;AAED,eAAO,MAAM,aAAa,EAAE,KAuB3B,CAAA;AAED,eAAO,MAAM,gBAAgB,EAAE,KAuB9B,CAAA;AAED,eAAO,MAAM,cAAc,EAAE,KAwB5B,CAAA;AAED,eAAO,MAAM,UAAU,EAAE,KAgCxB,CAAA;AAED,eAAO,MAAM,YAAY,EAAE,KAiC1B,CAAA;AAED,eAAO,MAAM,iBAAiB,EAAE,KA2C/B,CAAA;AAED,eAAO,MAAM,kCAAkC,EAAE,KA+EhD,CAAA;AAED,eAAO,MAAM,gBAAgB,EAAE,KA2D9B,CAAA;AAED,eAAO,MAAM,cAAc,EAAE,KA4B5B,CAAA"}
|
|
@@ -4,17 +4,13 @@ declare const edgeButtonVariants: (props?: ({
|
|
|
4
4
|
} & import('class-variance-authority/types').ClassProp) | undefined) => string;
|
|
5
5
|
/**
|
|
6
6
|
* Props for the EdgeButton component.
|
|
7
|
-
*
|
|
8
|
-
*
|
|
9
|
-
* rounded top-left corner design and primary brand styling.
|
|
7
|
+
* Extends standard button HTML attributes. `disabled` is re-declared on the
|
|
8
|
+
* interface so JSDoc flows into the generated `.d.ts` output.
|
|
10
9
|
*/
|
|
11
10
|
export interface EdgeButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
|
|
12
|
-
/** Button text content displayed next to the icon. */
|
|
11
|
+
/** Button text content displayed next to the icon. Rendered with Typography (cta, medium, base). */
|
|
13
12
|
text?: string;
|
|
14
|
-
/**
|
|
15
|
-
* Prevents user interaction and applies disabled styling with reduced opacity.
|
|
16
|
-
* @default false
|
|
17
|
-
*/
|
|
13
|
+
/** Prevents interaction and applies disabled styling. @default false */
|
|
18
14
|
disabled?: boolean;
|
|
19
15
|
/**
|
|
20
16
|
* When true, merges EdgeButton props/styles onto the single child element via
|
|
@@ -24,11 +20,14 @@ export interface EdgeButtonProps extends React.ButtonHTMLAttributes<HTMLButtonEl
|
|
|
24
20
|
* Note: `disabled` has no effect on non-`<button>` children — use
|
|
25
21
|
* `aria-disabled` on the child instead.
|
|
26
22
|
* @default false
|
|
23
|
+
*
|
|
24
|
+
* @example
|
|
25
|
+
* <EdgeButton asChild text="Help">
|
|
26
|
+
* <a href="/help" />
|
|
27
|
+
* </EdgeButton>
|
|
27
28
|
*/
|
|
28
29
|
asChild?: boolean;
|
|
29
|
-
/**
|
|
30
|
-
* Leading icon element positioned before the text.
|
|
31
|
-
*/
|
|
30
|
+
/** Leading icon node rendered before the text. Sized to `size-icon-medium`. */
|
|
32
31
|
icon?: React.ReactNode;
|
|
33
32
|
}
|
|
34
33
|
declare const EdgeButton: React.ForwardRefExoticComponent<EdgeButtonProps & React.RefAttributes<HTMLButtonElement>>;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"EdgeButton.d.ts","sourceRoot":"","sources":["../../../src/components/EdgeButton/EdgeButton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAOzB,QAAA,MAAM,kBAAkB;;8EAwBvB,CAAA;AAED
|
|
1
|
+
{"version":3,"file":"EdgeButton.d.ts","sourceRoot":"","sources":["../../../src/components/EdgeButton/EdgeButton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAOzB,QAAA,MAAM,kBAAkB;;8EAwBvB,CAAA;AAED;;;;GAIG;AACH,MAAM,WAAW,eACf,SAAQ,KAAK,CAAC,oBAAoB,CAAC,iBAAiB,CAAC;IACrD,oGAAoG;IACpG,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,wEAAwE;IACxE,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB;;;;;;;;;;;;;OAaG;IACH,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,+EAA+E;IAC/E,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;CACvB;AAED,QAAA,MAAM,UAAU,2FAmFf,CAAA;AAID,OAAO,EAAE,UAAU,EAAE,kBAAkB,EAAE,CAAA"}
|