@epam/ai-dial-ui-kit 0.15.0-dev.6 → 0.15.0-dev.9

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 (73) hide show
  1. package/README.md +140 -0
  2. package/dist/CHANGELOG.md +12 -0
  3. package/dist/{DateCellRenderer-BVM-Q8yx.cjs → DateCellRenderer-Bu40QyHE.cjs} +26 -26
  4. package/dist/DateCellRenderer-C3e61i75.cjs +1 -0
  5. package/dist/components/Dropdown/Dropdown.js +70 -65
  6. package/dist/components/Dropdown/DropdownSubMenuItem.js +63 -55
  7. package/dist/components/Dropdown/constants.js +14 -12
  8. package/dist/components/DropdownIcon/DropdownIcon.js +43 -32
  9. package/dist/components/New/Accordion/Accordion.js +39 -37
  10. package/dist/components/New/ButtonDropdown/ButtonDropdown.js +7 -6
  11. package/dist/components/New/Calendar/Calendar.js +253 -222
  12. package/dist/components/New/CaptionText/CaptionText.js +18 -15
  13. package/dist/components/New/CardShell/CardShell.js +4 -2
  14. package/dist/components/New/Checkbox/Checkbox.js +67 -56
  15. package/dist/components/New/Checkbox/CheckboxBox.js +4 -2
  16. package/dist/components/New/CloseButton/CloseButton.js +18 -16
  17. package/dist/components/New/CollapsibleSidebar/CollapsibleSidebar.js +39 -34
  18. package/dist/components/New/ConfirmationPopup/ConfirmationPopup.js +44 -39
  19. package/dist/components/New/Dropdown/Dropdown.js +101 -95
  20. package/dist/components/New/EllipsisTooltip/EllipsisTooltip.js +19 -17
  21. package/dist/components/New/FileDropzone/FileDropzone.js +27 -25
  22. package/dist/components/New/FilterChips/FilterChips.js +43 -0
  23. package/dist/components/New/FilterChips/constants.js +5 -0
  24. package/dist/components/New/FolderPath/FolderPath.js +29 -28
  25. package/dist/components/New/Highlight/Highlight.js +23 -30
  26. package/dist/components/New/InfoButton/InfoButton.js +12 -10
  27. package/dist/components/New/InlineSelect/InlineSelect.js +43 -41
  28. package/dist/components/New/InteractiveTooltip/InteractiveTooltip.js +40 -38
  29. package/dist/components/New/Label/Label.js +13 -8
  30. package/dist/components/New/MenuItem/MenuItem.js +29 -27
  31. package/dist/components/New/MenuItem/constants.js +9 -8
  32. package/dist/components/New/NoDataContent/NoDataContent.js +20 -18
  33. package/dist/components/New/Notification/Notification.js +18 -16
  34. package/dist/components/New/NumberInput/NumberInput.js +42 -33
  35. package/dist/components/New/PasswordInput/PasswordInput.js +41 -35
  36. package/dist/components/New/Popup/Popup.js +45 -43
  37. package/dist/components/New/Radio/Radio.js +75 -64
  38. package/dist/components/New/RadioGroup/RadioGroup.js +76 -65
  39. package/dist/components/New/RadioGroupPopupField/RadioGroupPopupField.js +117 -106
  40. package/dist/components/New/ResizableContainer/ResizableContainer.js +42 -40
  41. package/dist/components/New/Search/Search.js +28 -26
  42. package/dist/components/New/SegmentedControl/SegmentedControl.js +29 -23
  43. package/dist/components/New/Select/Select.js +120 -109
  44. package/dist/components/New/Switch/Switch.js +69 -58
  45. package/dist/components/New/Tabs/Tabs.js +28 -22
  46. package/dist/components/New/Tag/Tag.js +42 -40
  47. package/dist/components/New/TagInput/TagInput.js +44 -42
  48. package/dist/components/New/ToggleIconButton/ToggleIconButton.js +25 -23
  49. package/dist/components/New/Tooltip/TooltipContent.js +10 -8
  50. package/dist/components/ProgressBar/ProgressBar.js +45 -31
  51. package/dist/components/SchemaRenderer/components/SchemaAdditionalPropertiesEditor.js +46 -31
  52. package/dist/components/SchemaRenderer/components/SchemaKeyValueEditor.js +223 -135
  53. package/dist/components/SchemaRenderer/types.js +19 -8
  54. package/dist/components/SchemaRenderer/utils.js +121 -96
  55. package/dist/components/Skeleton/Skeleton.js +25 -19
  56. package/dist/components/Spinner/Spinner.js +6 -4
  57. package/dist/components-manifest.json +85 -2
  58. package/dist/constants/public-class-names.js +157 -0
  59. package/dist/dial-ui-kit.cjs +2 -2
  60. package/dist/dial-ui-kit.js +214 -210
  61. package/dist/file-manager.cjs +1 -1
  62. package/dist/grid.cjs +1 -1
  63. package/dist/index.css +1 -1
  64. package/dist/src/components/New/FilterChips/FilterChips.d.ts +69 -0
  65. package/dist/src/components/New/FilterChips/constants.d.ts +13 -0
  66. package/dist/src/components/SchemaRenderer/types.d.ts +11 -0
  67. package/dist/src/components/SchemaRenderer/utils.d.ts +5 -1
  68. package/dist/src/constants/public-class-names.d.ts +148 -0
  69. package/dist/src/index.d.ts +3 -0
  70. package/dist/use-file-manager-tabs-9DWkp9IJ.cjs +3 -0
  71. package/package.json +1 -1
  72. package/dist/DateCellRenderer-ssp7eaZY.cjs +0 -1
  73. package/dist/use-file-manager-tabs-DjdR_mYM.cjs +0 -3
@@ -1,105 +1,106 @@
1
- import { jsxs as N, Fragment as M, jsx as n } from "react/jsx-runtime";
2
- import { useFloatingNodeId as he, useFloating as ge, autoUpdate as ye, offset as we, autoPlacement as ve, flip as xe, shift as Ce, size as ke, useClick as be, useHover as Pe, safePolygon as Ee, useDismiss as Ie, useRole as Ne, useInteractions as Me, FloatingTree as De, FloatingNode as Fe, FloatingPortal as Ae, FloatingFocusManager as Oe } from "@floating-ui/react";
3
- import { useState as W, useRef as Re, useCallback as m, useId as Te, useEffect as j, useMemo as Se, Fragment as Le } from "react";
1
+ import { jsxs as N, Fragment as A, jsx as n } from "react/jsx-runtime";
2
+ import { useFloatingNodeId as ge, useFloating as ye, autoUpdate as we, offset as ve, autoPlacement as xe, flip as Ce, shift as ke, size as be, useClick as Ie, useHover as Pe, safePolygon as Ee, useDismiss as Ne, useRole as Ae, useInteractions as De, FloatingTree as Me, FloatingNode as Fe, FloatingPortal as Oe, FloatingFocusManager as Te } from "@floating-ui/react";
3
+ import { useState as K, useRef as Re, useCallback as m, useId as Se, useEffect as W, useMemo as Le, Fragment as _e } from "react";
4
4
  import { InteractiveTooltip as $e } from "../InteractiveTooltip/InteractiveTooltip.js";
5
- import { DropdownTrigger as y, DropdownItemType as K } from "../../../types/dropdown.js";
5
+ import { DIAL_KIT_CLASS as j } from "../../../constants/public-class-names.js";
6
+ import { DropdownTrigger as y, DropdownItemType as U } from "../../../types/dropdown.js";
6
7
  import { MenuItemMark as Be } from "../../../types/menu-item.js";
7
- import { dropdownGap as w, dropdownDividerClassName as Ye, dropdownBaseClassName as _e, dropdownListBaseClassName as We } from "./constants.js";
8
+ import { dropdownGap as w, dropdownDividerClassName as Ye, dropdownBaseClassName as Ke, dropdownListBaseClassName as We } from "./constants.js";
8
9
  import { CloseButton as je } from "../CloseButton/CloseButton.js";
9
- import { MenuItem as Ke } from "../MenuItem/MenuItem.js";
10
- import { useThemeScope as Ue } from "../ThemeScope/ThemeScope.js";
10
+ import { MenuItem as Ue } from "../MenuItem/MenuItem.js";
11
+ import { useThemeScope as Ve } from "../ThemeScope/ThemeScope.js";
11
12
  import { mergeClasses as v } from "../../../utils/merge-classes.js";
12
- import { DropdownSubMenuItem as Ve } from "./DropdownSubMenuItem.js";
13
- import { resolveItemMark as Xe, getItemRole as qe } from "./item-mark.js";
14
- const ze = '[role="menuitem"], [role="menuitemcheckbox"], [role="menuitemradio"], [role="option"]', Ge = (l) => !l.hasAttribute("disabled") && l.getAttribute("aria-disabled") !== "true", He = ["ArrowDown", "ArrowUp", "Home", "End"], Je = (l, d, u) => {
13
+ import { DropdownSubMenuItem as Xe } from "./DropdownSubMenuItem.js";
14
+ import { resolveItemMark as qe, getItemRole as ze } from "./item-mark.js";
15
+ const Ge = '[role="menuitem"], [role="menuitemcheckbox"], [role="menuitemradio"], [role="option"]', He = (l) => !l.hasAttribute("disabled") && l.getAttribute("aria-disabled") !== "true", Je = ["ArrowDown", "ArrowUp", "Home", "End"], Qe = (l, d, u) => {
15
16
  if (l === "Home") return 0;
16
17
  if (l === "End") return u - 1;
17
18
  const a = l === "ArrowDown" ? 1 : -1;
18
19
  return d === -1 ? a === 1 ? 0 : u - 1 : (d + a + u) % u;
19
- }, Qe = (l) => "clientWidth" in l ? l.clientWidth : l.getBoundingClientRect?.()?.width ?? 0, ft = ({
20
+ }, Ze = (l) => "clientWidth" in l ? l.clientWidth : l.getBoundingClientRect?.()?.width ?? 0, mt = ({
20
21
  children: l,
21
22
  items: d,
22
23
  onItemClick: u,
23
24
  menuHeader: a,
24
25
  menuFooter: h,
25
- renderOverlay: P,
26
+ renderOverlay: I,
26
27
  trigger: f = [y.Click],
27
28
  placement: D,
28
29
  disabled: i = !1,
29
- open: F,
30
- defaultOpen: U = !1,
31
- onOpenChange: A,
32
- closable: V = !1,
33
- onClose: X,
34
- className: q,
30
+ open: M,
31
+ defaultOpen: V = !1,
32
+ onOpenChange: F,
33
+ closable: X = !1,
34
+ onClose: q,
35
+ className: z,
35
36
  overlayContentClassName: O,
36
- separatorClassName: R,
37
- listClassName: z,
38
- outsidePressIgnoreRef: T,
39
- outsideClosable: G = !0,
40
- allowedPlacements: H,
37
+ separatorClassName: T,
38
+ listClassName: G,
39
+ outsidePressIgnoreRef: R,
40
+ outsideClosable: H = !0,
41
+ allowedPlacements: J,
41
42
  anchorToMouse: x = !1,
42
- matchReferenceWidth: E = !0,
43
+ matchReferenceWidth: P = !0,
43
44
  maxDropdownHeight: S,
44
45
  initialFocus: L
45
46
  }) => {
46
- const J = Ue(), [Q, Z] = W(U), I = F !== void 0, c = I ? !!F : Q, C = Re(null), [ee, te] = W(!0), o = m(
47
+ const Q = Ve(), [Z, ee] = K(V), E = M !== void 0, c = E ? !!M : Z, C = Re(null), [te, ne] = K(!0), o = m(
47
48
  (e, t, r) => {
48
- e && te(r !== "hover" && r !== "safe-polygon"), I || Z(e), A?.(e);
49
+ e && ne(r !== "hover" && r !== "safe-polygon"), E || ee(e), F?.(e);
49
50
  },
50
- [I, A]
51
- ), $ = Te(), ne = D === void 0, B = he(), { refs: p, floatingStyles: oe, context: g } = ge({
52
- nodeId: B,
51
+ [E, F]
52
+ ), _ = Se(), oe = D === void 0, $ = ge(), { refs: p, floatingStyles: re, context: g } = ye({
53
+ nodeId: $,
53
54
  placement: D,
54
55
  open: c,
55
56
  onOpenChange: o,
56
- whileElementsMounted: ye,
57
+ whileElementsMounted: we,
57
58
  middleware: [
58
- we({ mainAxis: w, crossAxis: 0 }),
59
- ne ? ve({
59
+ ve({ mainAxis: w, crossAxis: 0 }),
60
+ oe ? xe({
60
61
  alignment: "start",
61
62
  crossAxis: !0,
62
63
  padding: w,
63
- allowedPlacements: H
64
- }) : xe({ padding: w }),
65
- Ce({ padding: w }),
66
- ke({
64
+ allowedPlacements: J
65
+ }) : Ce({ padding: w }),
66
+ ke({ padding: w }),
67
+ be({
67
68
  padding: w,
68
69
  apply({ availableWidth: e, availableHeight: t, elements: r }) {
69
- const s = r.floating, b = Qe(r.reference);
70
+ const s = r.floating, b = Ze(r.reference);
70
71
  s.style.setProperty(
71
72
  "--fui-available-height",
72
73
  `${Math.floor(t)}px`
73
74
  ), s.style.setProperty(
74
75
  "--reference-width",
75
- E ? `${Math.round(b)}px` : "0px"
76
- ), E ? s.style.minWidth = `${Math.round(b)}px` : s.style.removeProperty("min-width"), s.style.maxWidth = `${Math.floor(e)}px`;
77
- const _ = Math.floor(t);
78
- s.style.maxHeight = `${S ? Math.min(_, S) : _}px`;
76
+ P ? `${Math.round(b)}px` : "0px"
77
+ ), P ? s.style.minWidth = `${Math.round(b)}px` : s.style.removeProperty("min-width"), s.style.maxWidth = `${Math.floor(e)}px`;
78
+ const Y = Math.floor(t);
79
+ s.style.maxHeight = `${S ? Math.min(Y, S) : Y}px`;
79
80
  }
80
81
  })
81
82
  ]
82
- }), re = be(g, {
83
+ }), se = Ie(g, {
83
84
  enabled: f.includes(y.Click) && !i
84
- }), se = Pe(g, {
85
+ }), le = Pe(g, {
85
86
  enabled: f.includes(y.Hover) && !i,
86
87
  move: !1,
87
88
  restMs: 40,
88
89
  handleClose: Ee(),
89
90
  delay: { open: 80, close: 80 }
90
- }), le = Ie(g, {
91
+ }), ie = Ne(g, {
91
92
  bubbles: !0,
92
93
  referencePress: !1,
93
94
  outsidePress: (e) => {
94
- if (!G) return !1;
95
+ if (!H) return !1;
95
96
  const t = e.target;
96
- return !(T?.current && t instanceof Node && T.current.contains(t));
97
+ return !(R?.current && t instanceof Node && R.current.contains(t));
97
98
  }
98
- }), ie = Ne(g, { role: "menu" }), { getReferenceProps: ce, getFloatingProps: ae } = Me([
99
- re,
99
+ }), ce = Ae(g, { role: "menu" }), { getReferenceProps: ae, getFloatingProps: de } = De([
100
100
  se,
101
101
  le,
102
- ie
102
+ ie,
103
+ ce
103
104
  ]), k = m(
104
105
  (e, t) => {
105
106
  p.setPositionReference({
@@ -116,7 +117,7 @@ const ze = '[role="menuitem"], [role="menuitemcheckbox"], [role="menuitemradio"]
116
117
  });
117
118
  },
118
119
  [p]
119
- ), de = m(
120
+ ), ue = m(
120
121
  (e) => {
121
122
  !f.includes(y.ContextMenu) || i || (e.preventDefault(), x && (k(e.clientX, e.clientY), C.current = document.elementFromPoint(
122
123
  e.clientX,
@@ -124,7 +125,7 @@ const ze = '[role="menuitem"], [role="menuitemcheckbox"], [role="menuitemradio"]
124
125
  )), o(!0));
125
126
  },
126
127
  [x, i, o, k, f]
127
- ), ue = m(
128
+ ), fe = m(
128
129
  (e) => {
129
130
  !x || i || (f.includes(y.ContextMenu) && c && o(!1), k(e.clientX, e.clientY), C.current = document.elementFromPoint(
130
131
  e.clientX,
@@ -133,50 +134,54 @@ const ze = '[role="menuitem"], [role="menuitemcheckbox"], [role="menuitemradio"]
133
134
  },
134
135
  [x, i, k, c, f, o]
135
136
  );
136
- j(() => {
137
+ W(() => {
137
138
  i && c && o(!1);
138
139
  }, [i, c, o]);
139
- const fe = m(
140
+ const pe = m(
140
141
  (e) => {
141
- if (e.defaultPrevented || !He.includes(e.key)) return;
142
+ if (e.defaultPrevented || !Je.includes(e.key)) return;
142
143
  const t = Array.from(
143
144
  e.currentTarget.querySelectorAll(
144
- ze
145
+ Ge
145
146
  )
146
- ).filter(Ge);
147
+ ).filter(He);
147
148
  if (t.length === 0) return;
148
149
  e.preventDefault();
149
150
  const r = e.currentTarget.ownerDocument.activeElement, s = t.findIndex((b) => b === r);
150
- t[Je(e.key, s, t.length)]?.focus();
151
+ t[Qe(e.key, s, t.length)]?.focus();
151
152
  },
152
153
  []
153
- ), Y = m(
154
+ ), B = m(
154
155
  (e) => (t) => {
155
156
  e.disabled || (e.onClick?.({ key: e.key, domEvent: t }), u?.({ key: e.key, domEvent: t }), e.selectable || o(!1));
156
157
  },
157
158
  [u, o]
158
- ), pe = Se(() => P ? P() : d ? /* @__PURE__ */ N(M, { children: [
159
- a && /* @__PURE__ */ n(M, { children: typeof a == "function" ? a() : a }),
159
+ ), me = Le(() => I ? I() : d ? /* @__PURE__ */ N(A, { children: [
160
+ a && /* @__PURE__ */ n(A, { children: typeof a == "function" ? a() : a }),
160
161
  /* @__PURE__ */ n(
161
162
  "div",
162
163
  {
163
164
  role: "none",
164
- className: v("py-1", O),
165
+ className: v(
166
+ j.dropdownList,
167
+ "py-1",
168
+ O
169
+ ),
165
170
  "aria-label": "dropdown",
166
171
  children: d.map((e) => {
167
- if (e.type === K.Divider)
172
+ if (e.type === U.Divider)
168
173
  return /* @__PURE__ */ n(
169
174
  "div",
170
175
  {
171
176
  role: "separator",
172
177
  className: v(
173
178
  Ye,
174
- R
179
+ T
175
180
  )
176
181
  },
177
182
  e.key
178
183
  );
179
- if (e.type === K.PlainText)
184
+ if (e.type === U.PlainText)
180
185
  return /* @__PURE__ */ n(
181
186
  "div",
182
187
  {
@@ -190,15 +195,15 @@ const ze = '[role="menuitem"], [role="menuitemcheckbox"], [role="menuitemradio"]
190
195
  );
191
196
  if (e.children?.length)
192
197
  return /* @__PURE__ */ n(
193
- Ve,
198
+ Xe,
194
199
  {
195
200
  item: e,
196
201
  onRootClose: () => o(!1)
197
202
  },
198
203
  e.key
199
204
  );
200
- const t = Xe(e), r = qe(e), s = /* @__PURE__ */ n(
201
- Ke,
205
+ const t = qe(e), r = ze(e), s = /* @__PURE__ */ n(
206
+ Ue,
202
207
  {
203
208
  role: r,
204
209
  "aria-checked": r === "menuitem" ? void 0 : !!e.checked,
@@ -212,11 +217,11 @@ const ze = '[role="menuitem"], [role="menuitemcheckbox"], [role="menuitemradio"]
212
217
  label: e.label,
213
218
  className: e.className,
214
219
  rightControl: e.rightControl,
215
- onClick: Y(e),
220
+ onClick: B(e),
216
221
  children: e.renderItem?.(e)
217
222
  }
218
223
  );
219
- return /* @__PURE__ */ n(Le, { children: e.interactiveTooltip ? /* @__PURE__ */ n(
224
+ return /* @__PURE__ */ n(_e, { children: e.interactiveTooltip ? /* @__PURE__ */ n(
220
225
  $e,
221
226
  {
222
227
  asChild: !0,
@@ -229,21 +234,21 @@ const ze = '[role="menuitem"], [role="menuitemcheckbox"], [role="menuitemradio"]
229
234
  })
230
235
  }
231
236
  ),
232
- h && /* @__PURE__ */ n(M, { children: typeof h == "function" ? h() : h })
237
+ h && /* @__PURE__ */ n(A, { children: typeof h == "function" ? h() : h })
233
238
  ] }) : null, [
234
- Y,
239
+ B,
235
240
  d,
236
241
  h,
237
242
  a,
238
- P,
243
+ I,
239
244
  o,
240
245
  O,
241
- R
242
- ]), me = ce({
243
- onContextMenu: de,
244
- onMouseDown: ue
246
+ T
247
+ ]), he = ae({
248
+ onContextMenu: ue,
249
+ onMouseDown: fe
245
250
  });
246
- return j(() => {
251
+ return W(() => {
247
252
  if (!c) return;
248
253
  const e = p.reference.current;
249
254
  let t = null;
@@ -255,55 +260,56 @@ const ze = '[role="menuitem"], [role="menuitemcheckbox"], [role="menuitemradio"]
255
260
  { root: null, threshold: 0 }
256
261
  );
257
262
  return r.observe(t), () => r.disconnect();
258
- }, [c, p.reference, o]), /* @__PURE__ */ n(De, { children: /* @__PURE__ */ N(Fe, { id: B, children: [
263
+ }, [c, p.reference, o]), /* @__PURE__ */ n(Me, { children: /* @__PURE__ */ N(Fe, { id: $, children: [
259
264
  /* @__PURE__ */ n(
260
265
  "span",
261
266
  {
262
267
  ref: p.setReference,
263
268
  className: v(
264
- _e,
269
+ j.dropdown,
270
+ Ke,
265
271
  i && "!cursor-not-allowed opacity-75",
266
- q
272
+ z
267
273
  ),
268
274
  "aria-haspopup": "menu",
269
275
  "aria-expanded": c,
270
- "aria-controls": $,
271
- ...me,
276
+ "aria-controls": _,
277
+ ...he,
272
278
  children: l
273
279
  }
274
280
  ),
275
- c && /* @__PURE__ */ n(Ae, { children: /* @__PURE__ */ n(
276
- Oe,
281
+ c && /* @__PURE__ */ n(Oe, { children: /* @__PURE__ */ n(
282
+ Te,
277
283
  {
278
284
  context: g,
279
285
  modal: !1,
280
- initialFocus: L !== void 0 ? L : ee ? 0 : -1,
286
+ initialFocus: L !== void 0 ? L : te ? 0 : -1,
281
287
  returnFocus: !0,
282
288
  children: /* @__PURE__ */ N(
283
289
  "div",
284
290
  {
285
- id: $,
291
+ id: _,
286
292
  ref: p.setFloating,
287
- style: oe,
293
+ style: re,
288
294
  className: v(
289
295
  We,
290
- !E && "w-max",
296
+ !P && "w-max",
291
297
  "overflow-auto",
292
- J,
293
- z
298
+ Q,
299
+ G
294
300
  ),
295
- ...ae({ onKeyDown: fe }),
301
+ ...de({ onKeyDown: pe }),
296
302
  children: [
297
- V && /* @__PURE__ */ n("div", { className: "flex items-center justify-between px-2 pt-2", children: /* @__PURE__ */ n(
303
+ X && /* @__PURE__ */ n("div", { className: "flex items-center justify-between px-2 pt-2", children: /* @__PURE__ */ n(
298
304
  je,
299
305
  {
300
306
  ariaLabel: "Close dropdown",
301
307
  onClose: (e) => {
302
- X?.(e), o(!1);
308
+ q?.(e), o(!1);
303
309
  }
304
310
  }
305
311
  ) }),
306
- pe
312
+ me
307
313
  ]
308
314
  }
309
315
  )
@@ -312,5 +318,5 @@ const ze = '[role="menuitem"], [role="menuitemcheckbox"], [role="menuitemradio"]
312
318
  ] }) });
313
319
  };
314
320
  export {
315
- ft as Dropdown
321
+ mt as Dropdown
316
322
  };
@@ -1,34 +1,36 @@
1
- import { jsxs as d, jsx as t } from "react/jsx-runtime";
1
+ import { jsxs as T, jsx as e } from "react/jsx-runtime";
2
2
  import { useMemo as C } from "react";
3
- import { mergeClasses as T } from "../../../utils/merge-classes.js";
3
+ import { mergeClasses as d } from "../../../utils/merge-classes.js";
4
4
  import { TooltipContainer as x } from "../Tooltip/TooltipContainer.js";
5
5
  import { TooltipContent as g } from "../Tooltip/TooltipContent.js";
6
6
  import { TooltipTrigger as h } from "../Tooltip/TooltipTrigger.js";
7
7
  import { useTruncation as b } from "./use-truncation.js";
8
- const y = ({
8
+ import { DIAL_KIT_CLASS as j } from "../../../constants/public-class-names.js";
9
+ const _ = ({
9
10
  text: r,
10
11
  className: m,
11
12
  contentClassName: a,
12
- hideTooltip: n = !1,
13
+ hideTooltip: i = !1,
13
14
  id: p,
14
- customTooltipContent: s,
15
- ...u
15
+ customTooltipContent: n,
16
+ ...f
16
17
  }) => {
17
- const { ref: c, isTruncated: e, textContent: f, remeasure: i } = b(r), o = typeof r == "string" ? r : f, l = C(() => n || !e ? null : s ?? o, [s, o, n, e]);
18
- return /* @__PURE__ */ d(x, { ...u, children: [
19
- /* @__PURE__ */ t(
18
+ const { ref: u, isTruncated: t, textContent: c, remeasure: s } = b(r), o = typeof r == "string" ? r : c, l = C(() => i || !t ? null : n ?? o, [n, o, i, t]);
19
+ return /* @__PURE__ */ T(x, { ...f, children: [
20
+ /* @__PURE__ */ e(
20
21
  h,
21
22
  {
22
23
  asChild: !0,
23
- onMouseEnter: i,
24
- onFocusCapture: i,
25
- children: /* @__PURE__ */ t(
24
+ onMouseEnter: s,
25
+ onFocusCapture: s,
26
+ children: /* @__PURE__ */ e(
26
27
  "span",
27
28
  {
28
29
  id: p,
29
- ref: c,
30
- "aria-label": e && o ? o : void 0,
31
- className: T(
30
+ ref: u,
31
+ "aria-label": t && o ? o : void 0,
32
+ className: d(
33
+ j.ellipsisTooltip,
32
34
  "block min-w-0 max-w-full flex-1 truncate text-start",
33
35
  m
34
36
  ),
@@ -37,9 +39,9 @@ const y = ({
37
39
  )
38
40
  }
39
41
  ),
40
- !!l && /* @__PURE__ */ t(g, { className: a, children: l })
42
+ !!l && /* @__PURE__ */ e(g, { className: a, children: l })
41
43
  ] });
42
44
  };
43
45
  export {
44
- y as EllipsisTooltip
46
+ _ as EllipsisTooltip
45
47
  };
@@ -6,48 +6,49 @@ import { Label as U } from "../Label/Label.js";
6
6
  import { DIAL_KIT_ICON_STROKE as Z } from "../constants/icon.js";
7
7
  import { DIAL_ICON_SIZE as q } from "../../../constants/icon.js";
8
8
  import { resolveAccessibleName as B } from "../../../utils/accessible-name.js";
9
- import { matchesAccept as E } from "../../../utils/file-accept.js";
9
+ import { matchesAccept as L } from "../../../utils/file-accept.js";
10
10
  import { mergeClasses as d } from "../../../utils/merge-classes.js";
11
- const er = ({
11
+ import { DIAL_KIT_CLASS as H } from "../../../constants/public-class-names.js";
12
+ const or = ({
12
13
  labelProps: g,
13
14
  label: h,
14
15
  description: y,
15
- onChange: x,
16
- onReject: v,
16
+ onChange: D,
17
+ onReject: x,
17
18
  accept: n,
18
19
  multiple: f = !1,
19
20
  disabled: r = !1,
20
21
  errorText: a,
21
- icon: L,
22
+ icon: _,
22
23
  id: C,
23
- ariaLabel: O,
24
- className: _
24
+ ariaLabel: E,
25
+ className: O
25
26
  }) => {
26
- const F = $(), s = C ?? `file-dropzone-${F}`, D = a ? `${s}-error` : void 0, [m, I] = w(!1), c = G(0), i = t(
27
+ const S = $(), s = C ?? `file-dropzone-${S}`, v = a ? `${s}-error` : void 0, [m, I] = w(!1), c = G(0), i = t(
27
28
  (e) => {
28
29
  if (e.length === 0) return;
29
- const b = f ? e : e.slice(0, 1), N = b.filter((p) => E(p, n)), A = b.filter((p) => !E(p, n));
30
- A.length > 0 && v?.(A), N.length > 0 && x(N);
30
+ const b = f ? e : e.slice(0, 1), A = b.filter((p) => L(p, n)), N = b.filter((p) => !L(p, n));
31
+ N.length > 0 && x?.(N), A.length > 0 && D(A);
31
32
  },
32
- [n, f, x, v]
33
- ), j = t(
33
+ [n, f, D, x]
34
+ ), z = t(
34
35
  (e) => {
35
36
  i(Array.from(e.target.files ?? [])), e.target.value = "";
36
37
  },
37
38
  [i]
38
39
  ), l = t(() => {
39
40
  c.current = 0, I(!1);
40
- }, []), k = t(
41
+ }, []), F = t(
41
42
  (e) => {
42
43
  r || (e.preventDefault(), c.current += 1, I(!0));
43
44
  },
44
45
  [r]
45
- ), z = t(
46
+ ), j = t(
46
47
  (e) => {
47
48
  r || (e.preventDefault(), e.dataTransfer.dropEffect = "copy");
48
49
  },
49
50
  [r]
50
- ), S = t(() => {
51
+ ), k = t(() => {
51
52
  r || (c.current -= 1, c.current <= 0 && l());
52
53
  }, [r, l]), K = t(
53
54
  (e) => {
@@ -65,11 +66,11 @@ const er = ({
65
66
  accept: n,
66
67
  multiple: f,
67
68
  disabled: r,
68
- onChange: j,
69
+ onChange: z,
69
70
  "aria-label": B(
70
- typeof h != "string" ? O : void 0
71
+ typeof h != "string" ? E : void 0
71
72
  ),
72
- "aria-describedby": D,
73
+ "aria-describedby": v,
73
74
  "aria-invalid": a ? !0 : void 0,
74
75
  className: "peer sr-only"
75
76
  }
@@ -78,11 +79,12 @@ const er = ({
78
79
  "label",
79
80
  {
80
81
  htmlFor: s,
81
- onDragEnter: k,
82
- onDragOver: z,
83
- onDragLeave: S,
82
+ onDragEnter: F,
83
+ onDragOver: j,
84
+ onDragLeave: k,
84
85
  onDrop: K,
85
86
  className: d(
87
+ H.fileDropzone,
86
88
  "flex flex-col items-center justify-center gap-3 rounded-xl border border-dashed px-6 py-10 text-center",
87
89
  "transition-colors motion-reduce:transition-none",
88
90
  "peer-focus-visible:outline peer-focus-visible:outline-offset-2 peer-focus-visible:outline-focus",
@@ -90,10 +92,10 @@ const er = ({
90
92
  !r && m && "border-accent bg-control-accent-alpha",
91
93
  !r && !m && "border-secondary hover:border-accent",
92
94
  a && !m && "border-error hover:border-error",
93
- _
95
+ O
94
96
  ),
95
97
  children: [
96
- L ?? /* @__PURE__ */ o(
98
+ _ ?? /* @__PURE__ */ o(
97
99
  T,
98
100
  {
99
101
  size: q.LG,
@@ -127,9 +129,9 @@ const er = ({
127
129
  ]
128
130
  }
129
131
  ),
130
- /* @__PURE__ */ o(R, { id: D, text: a })
132
+ /* @__PURE__ */ o(R, { id: v, text: a })
131
133
  ] });
132
134
  };
133
135
  export {
134
- er as FileDropzone
136
+ or as FileDropzone
135
137
  };
@@ -0,0 +1,43 @@
1
+ import { jsx as e } from "react/jsx-runtime";
2
+ import { Tag as b } from "../Tag/Tag.js";
3
+ import { DIAL_KIT_CLASS as n } from "../../../constants/public-class-names.js";
4
+ import { TagAppearance as f } from "../../../types/tag.js";
5
+ import { mergeClasses as l } from "../../../utils/merge-classes.js";
6
+ import { chipStretchClassName as C, containerClassName as d } from "./constants.js";
7
+ const A = ({
8
+ items: r,
9
+ value: o,
10
+ onChange: i,
11
+ stretch: s = !1,
12
+ className: p,
13
+ chipClassName: c,
14
+ "aria-label": m,
15
+ "aria-labelledby": t
16
+ }) => /* @__PURE__ */ e(
17
+ "div",
18
+ {
19
+ role: "group",
20
+ "aria-label": m,
21
+ "aria-labelledby": t,
22
+ className: l(
23
+ n.filterChips,
24
+ d,
25
+ p
26
+ ),
27
+ children: r.map((a) => /* @__PURE__ */ e(
28
+ b,
29
+ {
30
+ label: a.label,
31
+ icon: a.icon,
32
+ appearance: f.Selectable,
33
+ selected: a.value === o,
34
+ onClick: () => i(a.value),
35
+ className: l(s && C, c)
36
+ },
37
+ a.value
38
+ ))
39
+ }
40
+ );
41
+ export {
42
+ A as FilterChips
43
+ };
@@ -0,0 +1,5 @@
1
+ const e = "flex flex-nowrap items-center gap-1", t = "min-w-max flex-1 justify-center";
2
+ export {
3
+ t as chipStretchClassName,
4
+ e as containerClassName
5
+ };