@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.
Files changed (116) hide show
  1. package/dist/components/Accordion/Accordion.d.ts +42 -6
  2. package/dist/components/Accordion/Accordion.d.ts.map +1 -1
  3. package/dist/components/Button/Button.d.ts +71 -17
  4. package/dist/components/Button/Button.d.ts.map +1 -1
  5. package/dist/components/DataTable/DataTable.d.ts +66 -20
  6. package/dist/components/DataTable/DataTable.d.ts.map +1 -1
  7. package/dist/components/DataTable/DataTable.js +39 -39
  8. package/dist/components/DataTable/DataTable.stories.d.ts.map +1 -1
  9. package/dist/components/DatePicker/DatePicker.d.ts +69 -36
  10. package/dist/components/DatePicker/DatePicker.d.ts.map +1 -1
  11. package/dist/components/DatePicker/DatePicker.stories.d.ts.map +1 -1
  12. package/dist/components/DropdownMenu/DropdownMenu.d.ts +38 -7
  13. package/dist/components/DropdownMenu/DropdownMenu.d.ts.map +1 -1
  14. package/dist/components/DropdownMenu/DropdownMenu.js +165 -163
  15. package/dist/components/DropdownMenu/DropdownMenu.stories.d.ts +3 -17
  16. package/dist/components/DropdownMenu/DropdownMenu.stories.d.ts.map +1 -1
  17. package/dist/components/EdgeButton/EdgeButton.d.ts +10 -11
  18. package/dist/components/EdgeButton/EdgeButton.d.ts.map +1 -1
  19. package/dist/components/ExpandableTable/ExpandableTable.d.ts +103 -19
  20. package/dist/components/ExpandableTable/ExpandableTable.d.ts.map +1 -1
  21. package/dist/components/ExpandableTable/ExpandableTable.js +100 -111
  22. package/dist/components/ExpandableTable/ExpandableTable.stories.d.ts +6 -1
  23. package/dist/components/ExpandableTable/ExpandableTable.stories.d.ts.map +1 -1
  24. package/dist/components/ExpandableTable/index.d.ts +1 -1
  25. package/dist/components/ExpandableTable/index.d.ts.map +1 -1
  26. package/dist/components/FileUpload/FileItem.d.ts +22 -0
  27. package/dist/components/FileUpload/FileItem.d.ts.map +1 -1
  28. package/dist/components/FileUpload/FileItem.js +38 -41
  29. package/dist/components/FileUpload/FileUpload.d.ts +137 -42
  30. package/dist/components/FileUpload/FileUpload.d.ts.map +1 -1
  31. package/dist/components/FileUpload/FileUpload.js +87 -83
  32. package/dist/components/FileUpload/FileUpload.stories.d.ts +1 -0
  33. package/dist/components/FileUpload/FileUpload.stories.d.ts.map +1 -1
  34. package/dist/components/FileUpload/index.d.ts +1 -1
  35. package/dist/components/FileUpload/index.d.ts.map +1 -1
  36. package/dist/components/Flex/Flex.d.ts +1 -1
  37. package/dist/components/Icons/CustomBadges.d.ts +14 -0
  38. package/dist/components/Icons/CustomBadges.d.ts.map +1 -0
  39. package/dist/components/Icons/CustomBadges.js +334 -0
  40. package/dist/components/Icons/CustomIcons.d.ts +24 -0
  41. package/dist/components/Icons/CustomIcons.d.ts.map +1 -1
  42. package/dist/components/Icons/CustomIcons.js +88 -42
  43. package/dist/components/Icons/CustomLogos.d.ts +29 -0
  44. package/dist/components/Icons/CustomLogos.d.ts.map +1 -0
  45. package/dist/components/Icons/CustomLogos.js +593 -0
  46. package/dist/components/Icons/LogosAndBadges.stories.d.ts +7 -0
  47. package/dist/components/Icons/LogosAndBadges.stories.d.ts.map +1 -0
  48. package/dist/components/Icons/index.d.ts +2 -0
  49. package/dist/components/Icons/index.d.ts.map +1 -1
  50. package/dist/components/Input/Input.d.ts +33 -34
  51. package/dist/components/Input/Input.d.ts.map +1 -1
  52. package/dist/components/Input/Input.stories.d.ts.map +1 -1
  53. package/dist/components/LanguageSwitcher/LanguageSwitcher.d.ts +24 -1
  54. package/dist/components/LanguageSwitcher/LanguageSwitcher.d.ts.map +1 -1
  55. package/dist/components/LanguageSwitcher/LanguageSwitcher.js +71 -52
  56. package/dist/components/LanguageSwitcher/LanguageSwitcher.stories.d.ts +2 -0
  57. package/dist/components/LanguageSwitcher/LanguageSwitcher.stories.d.ts.map +1 -1
  58. package/dist/components/MultiSelect/MultiSelect.d.ts +50 -23
  59. package/dist/components/MultiSelect/MultiSelect.d.ts.map +1 -1
  60. package/dist/components/MultiSelect/MultiSelect.js +18 -17
  61. package/dist/components/Reorderable/Reorderable.d.ts +48 -1
  62. package/dist/components/Reorderable/Reorderable.d.ts.map +1 -1
  63. package/dist/components/ReorderableTable/ReorderableTable.d.ts +34 -17
  64. package/dist/components/ReorderableTable/ReorderableTable.d.ts.map +1 -1
  65. package/dist/components/ReorderableTable/ReorderableTable.stories.d.ts.map +1 -1
  66. package/dist/components/ResponsiveLayoutTable/ResponsiveLayoutTable.d.ts +266 -0
  67. package/dist/components/ResponsiveLayoutTable/ResponsiveLayoutTable.d.ts.map +1 -0
  68. package/dist/components/ResponsiveLayoutTable/ResponsiveLayoutTable.examples.d.ts +39 -0
  69. package/dist/components/ResponsiveLayoutTable/ResponsiveLayoutTable.examples.d.ts.map +1 -0
  70. package/dist/components/ResponsiveLayoutTable/ResponsiveLayoutTable.js +134 -0
  71. package/dist/components/ResponsiveLayoutTable/ResponsiveLayoutTable.stories.d.ts +14 -0
  72. package/dist/components/ResponsiveLayoutTable/ResponsiveLayoutTable.stories.d.ts.map +1 -0
  73. package/dist/components/ResponsiveLayoutTable/index.d.ts +2 -0
  74. package/dist/components/ResponsiveLayoutTable/index.d.ts.map +1 -0
  75. package/dist/components/Select/Select.d.ts +58 -28
  76. package/dist/components/Select/Select.d.ts.map +1 -1
  77. package/dist/components/Select/Select.js +123 -92
  78. package/dist/components/Select/Select.stories.d.ts +1 -0
  79. package/dist/components/Select/Select.stories.d.ts.map +1 -1
  80. package/dist/components/Select/index.d.ts +1 -1
  81. package/dist/components/Select/index.d.ts.map +1 -1
  82. package/dist/components/Select/utils.d.ts +1 -0
  83. package/dist/components/Select/utils.d.ts.map +1 -1
  84. package/dist/components/Select/utils.js +5 -2
  85. package/dist/components/TextEditor/TextEditor.d.ts +82 -46
  86. package/dist/components/TextEditor/TextEditor.d.ts.map +1 -1
  87. package/dist/components/TextEditor/TextEditor.stories.d.ts.map +1 -1
  88. package/dist/components/TextEditor/index.d.ts +1 -1
  89. package/dist/components/TextEditor/index.d.ts.map +1 -1
  90. package/dist/components/Textarea/Textarea.d.ts +41 -10
  91. package/dist/components/Textarea/Textarea.d.ts.map +1 -1
  92. package/dist/components/Textarea/Textarea.stories.d.ts.map +1 -1
  93. package/dist/components/Toggle/Toggle.js +1 -1
  94. package/dist/components/ToggleCheckButton/ToggleCheckButton.d.ts +69 -0
  95. package/dist/components/ToggleCheckButton/ToggleCheckButton.d.ts.map +1 -0
  96. package/dist/components/ToggleCheckButton/ToggleCheckButton.js +64 -0
  97. package/dist/components/ToggleCheckButton/ToggleCheckButton.stories.d.ts +8 -0
  98. package/dist/components/ToggleCheckButton/ToggleCheckButton.stories.d.ts.map +1 -0
  99. package/dist/components/ToggleCheckButton/index.d.ts +2 -0
  100. package/dist/components/ToggleCheckButton/index.d.ts.map +1 -0
  101. package/dist/components/WebCheckoutNav/WebCheckoutNav.examples.d.ts +19 -0
  102. package/dist/components/WebCheckoutNav/WebCheckoutNav.examples.d.ts.map +1 -0
  103. package/dist/components/WebCheckoutNav/WebCheckoutNav.stories.d.ts +8 -0
  104. package/dist/components/WebCheckoutNav/WebCheckoutNav.stories.d.ts.map +1 -0
  105. package/dist/components/index.d.ts +2 -0
  106. package/dist/components/index.d.ts.map +1 -1
  107. package/dist/hooks/use-is-breakpoint.d.ts +11 -0
  108. package/dist/hooks/use-is-breakpoint.d.ts.map +1 -1
  109. package/dist/hooks/use-is-breakpoint.js +24 -13
  110. package/dist/index.js +236 -215
  111. package/dist/muza-ui.css +1 -1
  112. package/dist/styles/token-colors.css +64 -3
  113. package/dist/styles/token-sizes.css +86 -54
  114. package/dist/utils/cn.d.ts.map +1 -1
  115. package/dist/utils/cn.js +16 -5
  116. package/package.json +1 -1
@@ -1,60 +1,61 @@
1
- import { jsx as e, jsxs as p } from "react/jsx-runtime";
2
- import * as l from "react";
3
- import * as d from "@radix-ui/react-dropdown-menu";
4
- import { cva as k } from "class-variance-authority";
5
- import { Button as y } from "../Button/Button.js";
6
- import { cn as i } from "../../utils/cn.js";
7
- import { Typography as b } from "../Typography/Typography.js";
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
- const h = l.createContext(null), N = () => l.useContext(h), T = ({ ...o }) => /* @__PURE__ */ e(d.Root, { "data-slot": "dropdown-menu", ...o }), P = ({ ...o }) => /* @__PURE__ */ e(d.Portal, { "data-slot": "dropdown-menu-portal", ...o }), G = ({ ...o }) => /* @__PURE__ */ e(
10
- d.Trigger,
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
- ), j = ({
16
+ ), O = ({
16
17
  className: o,
17
18
  sideOffset: t = 4,
18
- align: r = "start",
19
- ...n
19
+ align: n = "start",
20
+ ...r
20
21
  }) => {
21
- const [s, c] = l.useState(!1), a = l.useRef(null);
22
- return l.useEffect(() => {
23
- const m = () => {
24
- if (a.current) {
25
- const { scrollHeight: g, clientHeight: v } = a.current;
26
- c(g > v);
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(m, 10), w = new ResizeObserver(m);
29
- return a.current && w.observe(a.current), () => {
30
- clearTimeout(u), w.disconnect();
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
- }, [n.children]), /* @__PURE__ */ e(d.Portal, { children: /* @__PURE__ */ e(
33
- d.Content,
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: r,
38
- className: i(
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
- ...n,
44
+ ...r,
44
45
  children: /* @__PURE__ */ e(
45
46
  "div",
46
47
  {
47
- ref: a,
48
- className: i(
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
- s && "w-[calc(100%_-_var(--spacing-sm))]"
51
+ c && "w-[calc(100%_-_var(--spacing-sm))]"
51
52
  ),
52
- children: n.children
53
+ children: r.children
53
54
  }
54
55
  )
55
56
  }
56
57
  ) });
57
- }, f = k(
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
- ), B = ({
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: r,
86
- icon: n,
87
- disabled: s,
88
- isActive: c,
89
- ...a
90
- }) => /* @__PURE__ */ p(
91
- d.Item,
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: s,
95
- className: i(
122
+ disabled: c,
123
+ className: s(
96
124
  "group",
97
- f({
125
+ w({
98
126
  variant: t,
99
- disabled: s,
100
- checked: c
127
+ disabled: c,
128
+ checked: i
101
129
  }),
102
130
  o
103
131
  ),
104
- ...a,
132
+ ...l,
105
133
  children: [
106
- n && /* @__PURE__ */ e(
134
+ r && /* @__PURE__ */ e(
107
135
  "span",
108
136
  {
109
- className: i("block [&>svg]:block [&>svg]:size-icon-small", {
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": c
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
- ) : r
144
+ ),
145
+ /* @__PURE__ */ e(h, { description: d, children: n })
128
146
  ]
129
147
  }
130
- ), H = ({
148
+ ), _ = ({
131
149
  children: o,
132
150
  buttonProps: t,
133
- className: r,
134
- ...n
151
+ className: n,
152
+ ...r
135
153
  }) => /* @__PURE__ */ e("div", { className: "my-md px-lg", children: /* @__PURE__ */ e(
136
- d.Item,
154
+ a.Item,
137
155
  {
138
156
  "data-slot": "dropdown-menu-item",
139
157
  asChild: !0,
140
- ...n,
158
+ ...r,
141
159
  children: /* @__PURE__ */ e(
142
- y,
160
+ I,
143
161
  {
144
162
  fullWidth: !0,
145
163
  ...t,
146
- className: i(
164
+ className: s(
147
165
  "outline-0 hover:ring-transparent",
148
- r,
166
+ n,
149
167
  t.className
150
168
  ),
151
169
  children: o
152
170
  }
153
171
  )
154
172
  }
155
- ) }), O = ({
173
+ ) }), E = ({
156
174
  className: o,
157
175
  children: t,
158
- checked: r,
159
- variant: n,
160
- icon: s,
161
- ...c
162
- }) => /* @__PURE__ */ p(
163
- d.CheckboxItem,
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: i(
167
- f({
168
- variant: n,
169
- checked: !!r
185
+ className: s(
186
+ w({
187
+ variant: r,
188
+ checked: !!n
170
189
  }),
171
190
  o
172
191
  ),
173
- checked: r,
174
- onSelect: (a) => {
175
- a.preventDefault();
192
+ checked: n,
193
+ onSelect: (l) => {
194
+ l.preventDefault();
176
195
  },
177
- ...c,
196
+ ...d,
178
197
  children: [
179
- s && /* @__PURE__ */ e(
198
+ c && /* @__PURE__ */ e(
180
199
  "span",
181
200
  {
182
- className: i({
183
- "text-comp-dropdown-menu-text-error": n === "destructive",
184
- "group-focus-visible:-icon-brand-focused text-icon-dark-secondary-def group-hover:text-icon-brand-def": n !== "destructive"
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: s
205
+ children: c
187
206
  }
188
207
  ),
189
- typeof t != "function" ? /* @__PURE__ */ e(
190
- b,
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
- ), Y = ({
212
+ ), L = ({
203
213
  value: o,
204
214
  onValueChange: t,
205
- ...r
206
- }) => /* @__PURE__ */ e(h.Provider, { value: { value: o, onValueChange: t }, children: /* @__PURE__ */ e(
207
- d.RadioGroup,
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
- ...r
222
+ ...n
213
223
  }
214
- ) }), I = l.forwardRef(({ className: o, children: t, variant: r, icon: n, value: s, ...c }, a) => {
215
- const m = N(), u = (m == null ? void 0 : m.value) === s;
216
- return /* @__PURE__ */ p(
217
- d.RadioItem,
218
- {
219
- ref: a,
220
- "data-slot": "dropdown-menu-radio-item",
221
- className: i(
222
- f({
223
- variant: r,
224
- checked: u
225
- }),
226
- o,
227
- c.disabled && "cursor-not-allowed text-comp-dropdown-menu-text-base-disabled hover:bg-transparent hover:text-comp-dropdown-menu-text-base-disabled"
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
- typeof t != "function" ? /* @__PURE__ */ e(
244
- b,
245
- {
246
- component: "span",
247
- size: "sm",
248
- weight: "medium",
249
- className: "flex-1",
250
- fixY: !0,
251
- children: t
252
- }
253
- ) : t,
254
- /* @__PURE__ */ e("span", { className: "text-comp-dropdown-menu-icon-brand-def", children: /* @__PURE__ */ e(d.ItemIndicator, { children: /* @__PURE__ */ e(x, { className: "size-icon-small" }) }) })
255
- ]
256
- }
257
- );
258
- });
259
- I.displayName = "DropdownMenuRadioItem";
260
- const _ = ({
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
- d.Separator,
266
+ a.Separator,
265
267
  {
266
268
  "data-slot": "dropdown-menu-separator",
267
- className: i("my-sm h-0 border-b border-stroke-base-primary", o),
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
- T as DropdownMenu,
273
- H as DropdownMenuButtonItem,
274
- O as DropdownMenuCheckboxItem,
275
- j as DropdownMenuContent,
276
- B as DropdownMenuItem,
277
- P as DropdownMenuPortal,
278
- Y as DropdownMenuRadioGroup,
279
- I as DropdownMenuRadioItem,
280
- _ as DropdownMenuSeparator,
281
- G as DropdownMenuTrigger,
282
- f as dropdownMenuItemVariants
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;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA0E2B,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,cAAc,EAAE,KA4B5B,CAAA"}
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
- * EdgeButton is a fixed-position help button designed for page corners with a distinctive
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;;;;;GAKG;AACH,MAAM,WAAW,eACf,SAAQ,KAAK,CAAC,oBAAoB,CAAC,iBAAiB,CAAC;IACrD,sDAAsD;IACtD,IAAI,CAAC,EAAE,MAAM,CAAA;IACb;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB;;;;;;;;OAQG;IACH,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB;;OAEG;IACH,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;CACvB;AAED,QAAA,MAAM,UAAU,2FAmFf,CAAA;AAID,OAAO,EAAE,UAAU,EAAE,kBAAkB,EAAE,CAAA"}
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"}