@studiolxd/brand 39.0.0 → 40.1.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.
Files changed (132) hide show
  1. package/CHANGELOG.md +107 -0
  2. package/dist/_shared/brandmessagescontext.js +15 -0
  3. package/dist/_shared/calendargrid.js +42 -42
  4. package/dist/_shared/datepicker.js +41 -41
  5. package/dist/_shared/imagecropdialog.js +54 -54
  6. package/dist/_shared/tokens.js +1 -0
  7. package/dist/_types/messages/BrandMessages.d.ts +26 -0
  8. package/dist/_types/messages/BrandMessagesContext.d.ts +21 -0
  9. package/dist/_types/messages/BrandMessagesProvider.d.ts +46 -0
  10. package/dist/_types/messages/index.d.ts +5 -0
  11. package/dist/_types/molecules/Pagination/Pagination.d.ts +40 -23
  12. package/dist/_types/organisms/AnnotationThread/AnnotationThread.d.ts +27 -5
  13. package/dist/_types/organisms/DataTable/DataTable.d.ts +3 -2
  14. package/dist/accordion.js +26 -26
  15. package/dist/alert.js +26 -26
  16. package/dist/annotation-thread.css +1 -1
  17. package/dist/annotation-thread.js +37 -26
  18. package/dist/app-header.js +8 -8
  19. package/dist/app-launcher.js +34 -34
  20. package/dist/app-shell.js +14 -14
  21. package/dist/assistant-message.js +8 -8
  22. package/dist/async-multi-select-field.js +9 -9
  23. package/dist/async-multi-select.js +40 -40
  24. package/dist/async-select-field.js +9 -9
  25. package/dist/async-select.js +64 -64
  26. package/dist/avatar-upload.js +40 -40
  27. package/dist/avatar.js +5 -5
  28. package/dist/banner.js +9 -9
  29. package/dist/brand.css +2 -1
  30. package/dist/button.js +7 -7
  31. package/dist/calendar-planner.js +16 -16
  32. package/dist/calendar.js +38 -38
  33. package/dist/card.js +28 -28
  34. package/dist/carousel.js +19 -19
  35. package/dist/chart.js +137 -137
  36. package/dist/chat-shell.js +23 -23
  37. package/dist/checkbox-field.js +11 -11
  38. package/dist/checkbox.js +7 -7
  39. package/dist/close-button.js +6 -6
  40. package/dist/code-block.js +15 -15
  41. package/dist/code.js +5 -5
  42. package/dist/collapsible.js +1 -1
  43. package/dist/columns.js +7 -7
  44. package/dist/command-palette.js +14 -14
  45. package/dist/confirm-dialog.js +10 -10
  46. package/dist/connector-auth-shell.js +9 -9
  47. package/dist/consent.js +23 -23
  48. package/dist/container.js +6 -6
  49. package/dist/conversation-list.js +19 -19
  50. package/dist/conversation-thread.js +15 -15
  51. package/dist/copy-button.js +9 -9
  52. package/dist/copyable-value.js +17 -17
  53. package/dist/data-table.js +29 -29
  54. package/dist/date-picker-field.js +9 -9
  55. package/dist/date-time-field.js +12 -12
  56. package/dist/description-list.js +12 -12
  57. package/dist/docs-search.js +1 -1
  58. package/dist/dots-button.js +7 -7
  59. package/dist/dropdown-field.js +13 -13
  60. package/dist/email.js +44 -44
  61. package/dist/error-text.js +4 -4
  62. package/dist/field-row.js +20 -20
  63. package/dist/figure.js +8 -8
  64. package/dist/file-upload-field.js +9 -9
  65. package/dist/file-upload.js +29 -29
  66. package/dist/filter-bar.js +10 -10
  67. package/dist/floating-dock.js +17 -17
  68. package/dist/form-field.js +43 -43
  69. package/dist/form.js +14 -14
  70. package/dist/heading.js +5 -5
  71. package/dist/input-field.js +20 -20
  72. package/dist/input-phone-field.js +9 -9
  73. package/dist/input-phone.js +19 -19
  74. package/dist/input.js +5 -5
  75. package/dist/kbd.js +5 -5
  76. package/dist/label.js +5 -5
  77. package/dist/link.js +7 -7
  78. package/dist/list.js +7 -7
  79. package/dist/menu-button.js +7 -7
  80. package/dist/message-bubble.js +5 -5
  81. package/dist/message-composer.js +13 -13
  82. package/dist/messages.js +12 -0
  83. package/dist/multi-select-field.js +9 -9
  84. package/dist/multi-select.js +52 -52
  85. package/dist/notification-button.js +8 -8
  86. package/dist/notification-panel.js +25 -25
  87. package/dist/number-input-field.js +9 -9
  88. package/dist/number-input.js +11 -11
  89. package/dist/otp-field.js +9 -9
  90. package/dist/otp-input.js +48 -48
  91. package/dist/pagination.js +92 -89
  92. package/dist/paragraph.js +5 -5
  93. package/dist/password-field.js +15 -15
  94. package/dist/prose.js +4 -4
  95. package/dist/public-page-shell.js +11 -11
  96. package/dist/radio-field.js +11 -11
  97. package/dist/radio-group.js +5 -5
  98. package/dist/radio.js +5 -5
  99. package/dist/scroll-area.js +11 -11
  100. package/dist/search-form.js +8 -8
  101. package/dist/select-field.js +9 -9
  102. package/dist/select.js +85 -85
  103. package/dist/separator.js +6 -6
  104. package/dist/sidebar.js +16 -16
  105. package/dist/site-header.js +14 -14
  106. package/dist/site-shell.js +6 -6
  107. package/dist/sparkline.js +9 -9
  108. package/dist/star-rating.js +24 -24
  109. package/dist/stat-tile.js +12 -12
  110. package/dist/steps.js +32 -32
  111. package/dist/switcher-field.js +13 -13
  112. package/dist/switcher.js +8 -8
  113. package/dist/table-of-contents.js +14 -14
  114. package/dist/tag.js +5 -5
  115. package/dist/text.js +7 -7
  116. package/dist/textarea-field.js +11 -11
  117. package/dist/textarea.js +5 -5
  118. package/dist/time-field.js +9 -9
  119. package/dist/time-select.js +17 -17
  120. package/dist/toaster.js +16 -16
  121. package/dist/toggle-group.js +7 -7
  122. package/dist/toggle.js +5 -5
  123. package/dist/tokens.css +2 -1
  124. package/dist/tooltip.js +16 -16
  125. package/dist/tree-view.js +41 -41
  126. package/dist/uptime-bars.js +34 -34
  127. package/dist/user-message.js +8 -8
  128. package/dist/visually-hidden.js +5 -5
  129. package/package.json +5 -1
  130. package/src/tokens/molecules/annotation-thread.css +1 -0
  131. package/src/tokens/scss/molecules/_annotation-thread.scss +1 -0
  132. package/src/tokens/tokens.json +1 -0
@@ -5,21 +5,21 @@ import { n as t } from "./_shared/form-size.js";
5
5
  import { ErrorText as n } from "./error-text.js";
6
6
  import { Label as r } from "./label.js";
7
7
  import { n as i } from "./_shared/field-labels.js";
8
- import { jsx as a, jsxs as o } from "react/jsx-runtime";
9
- import { forwardRef as s, useId as c } from "react";
8
+ import { forwardRef as a, useId as o } from "react";
9
+ import { jsx as s, jsxs as c } from "react/jsx-runtime";
10
10
  //#region src/stories/molecules/AsyncMultiSelectField/AsyncMultiSelectField.tsx
11
- var l = s(function({ id: s, label: l, labelHidden: u, onSearch: d, value: f, defaultValue: p, onValueChange: m, selectedOptions: h, placeholder: g, name: _, disabled: v, readOnly: y, size: b, debounceMs: x, required: S, error: C = !1, errorMessage: w, helperText: T, className: E, emptyMessage: D, removeLabel: O, loadingLabel: k, container: A, onBlur: j }, M) {
12
- let N = i(u), P = t(b), F = c(), I = s ?? F, L = w ? `${I}-error` : void 0, R = T ? `${I}-helper` : void 0, z = [L, R].filter(Boolean).join(" ") || void 0, B = C || !!w;
13
- return /* @__PURE__ */ o("div", {
11
+ var l = a(function({ id: a, label: l, labelHidden: u, onSearch: d, value: f, defaultValue: p, onValueChange: m, selectedOptions: h, placeholder: g, name: _, disabled: v, readOnly: y, size: b, debounceMs: x, required: S, error: C = !1, errorMessage: w, helperText: T, className: E, emptyMessage: D, removeLabel: O, loadingLabel: k, container: A, onBlur: j }, M) {
12
+ let N = i(u), P = t(b), F = o(), I = a ?? F, L = w ? `${I}-error` : void 0, R = T ? `${I}-helper` : void 0, z = [L, R].filter(Boolean).join(" ") || void 0, B = C || !!w;
13
+ return /* @__PURE__ */ c("div", {
14
14
  className: ["async-multi-select-field", E].filter(Boolean).join(" "),
15
15
  children: [
16
- /* @__PURE__ */ a(r, {
16
+ /* @__PURE__ */ s(r, {
17
17
  htmlFor: I,
18
18
  hidden: N,
19
19
  size: P,
20
20
  children: l
21
21
  }),
22
- /* @__PURE__ */ a(e, {
22
+ /* @__PURE__ */ s(e, {
23
23
  ref: M,
24
24
  id: I,
25
25
  name: _,
@@ -42,11 +42,11 @@ var l = s(function({ id: s, label: l, labelHidden: u, onSearch: d, value: f, def
42
42
  "aria-describedby": z,
43
43
  onBlur: j
44
44
  }),
45
- w && /* @__PURE__ */ a(n, {
45
+ w && /* @__PURE__ */ s(n, {
46
46
  id: L,
47
47
  children: w
48
48
  }),
49
- T && /* @__PURE__ */ a("span", {
49
+ T && /* @__PURE__ */ s("span", {
50
50
  id: R,
51
51
  className: "async-multi-select-field__helper",
52
52
  children: T
@@ -2,31 +2,31 @@
2
2
  import './async-multi-select.css';
3
3
  import { Icon as e } from "./icon.js";
4
4
  import { Spinner as t } from "./spinner.js";
5
- import { jsx as n, jsxs as r } from "react/jsx-runtime";
6
- import { forwardRef as i, useCallback as a, useEffect as ee, useId as o, useRef as s, useState as c } from "react";
5
+ import { forwardRef as n, useCallback as r, useEffect as ee, useId as i, useRef as a, useState as o } from "react";
6
+ import { jsx as s, jsxs as c } from "react/jsx-runtime";
7
7
  import { Popover as l } from "@base-ui/react/popover";
8
8
  //#region src/stories/atoms/AsyncMultiSelect/AsyncMultiSelect.tsx
9
- function u(e, t) {
9
+ function te(e, t) {
10
10
  typeof e == "function" ? e(t) : e && (e.current = t);
11
11
  }
12
- var d = i(function({ onSearch: i, value: d, defaultValue: f = [], onValueChange: p, selectedOptions: te, placeholder: m = "Buscar…", disabled: h, readOnly: g, size: _ = "md", debounceMs: v = 300, id: y, name: b, error: x = !1, required: S, onBlur: C, className: w, "aria-label": T, "aria-describedby": ne, removeLabel: re = (e) => `Quitar ${e}`, emptyMessage: E = "Sin resultados", loadingLabel: D = "Buscando…", container: O }, ie) {
13
- let [k, A] = c(!1), [j, M] = c(""), [N, P] = c(!1), [F, I] = c([]), [L, R] = c(!1), [z, B] = c(-1), [V, H] = c(f), [U, W] = c([]), G = s(null), K = s(0), q = s(null), J = s(null), Y = o(), ae = o(), X = d === void 0 ? V : d, oe = X.map((e) => te?.find((t) => t.value === e) ?? U.find((t) => t.value === e) ?? {
12
+ var u = n(function({ onSearch: n, value: u, defaultValue: d = [], onValueChange: f, selectedOptions: p, placeholder: m = "Buscar…", disabled: h, readOnly: g, size: _ = "md", debounceMs: v = 300, id: y, name: b, error: x = !1, required: S, onBlur: C, className: w, "aria-label": T, "aria-describedby": ne, removeLabel: re = (e) => `Quitar ${e}`, emptyMessage: ie = "Sin resultados", loadingLabel: E = "Buscando…", container: D }, O) {
13
+ let [k, A] = o(!1), [j, M] = o(""), [N, P] = o(!1), [F, I] = o([]), [L, R] = o(!1), [z, B] = o(-1), [V, H] = o(d), [U, W] = o([]), G = a(null), K = a(0), q = a(null), J = a(null), Y = i(), ae = i(), X = u === void 0 ? V : u, oe = X.map((e) => p?.find((t) => t.value === e) ?? U.find((t) => t.value === e) ?? {
14
14
  value: e,
15
15
  label: e
16
- }), Z = (e) => `${ae}-opt-${e}`, Q = a(async (e) => {
16
+ }), Z = (e) => `${ae}-opt-${e}`, Q = r(async (e) => {
17
17
  let t = ++K.current;
18
18
  P(!0), R(!1);
19
19
  try {
20
- let n = await i(e);
20
+ let r = await n(e);
21
21
  if (t !== K.current) return;
22
- I(n), B(-1);
22
+ I(r), B(-1);
23
23
  } catch {
24
24
  if (t !== K.current) return;
25
25
  I([]), B(-1);
26
26
  } finally {
27
27
  t === K.current && (P(!1), R(!0));
28
28
  }
29
- }, [i]);
29
+ }, [n]);
30
30
  ee(() => () => {
31
31
  K.current += 1, G.current && clearTimeout(G.current);
32
32
  }, []);
@@ -39,7 +39,7 @@ var d = i(function({ onSearch: i, value: d, defaultValue: f = [], onValueChange:
39
39
  }
40
40
  function $(e, t) {
41
41
  let n = X.includes(e) ? X.filter((t) => t !== e) : [...X, e];
42
- t && W((e) => e.some((e) => e.value === t.value) ? e : [...e, t]), d === void 0 && H(n), p?.(n);
42
+ t && W((e) => e.some((e) => e.value === t.value) ? e : [...e, t]), u === void 0 && H(n), f?.(n);
43
43
  }
44
44
  function le(e) {
45
45
  if (e.key === "ArrowDown") e.preventDefault(), k ? B((e) => Math.min(e + 1, F.length - 1)) : (A(!0), Q(j));
@@ -69,22 +69,22 @@ var d = i(function({ onSearch: i, value: d, defaultValue: f = [], onValueChange:
69
69
  x ? "async-multi-select--error" : "",
70
70
  w ?? ""
71
71
  ].filter(Boolean).join(" "), fe = ["async-multi-select__content", _ === "md" ? "" : `async-multi-select__content--${_}`].filter(Boolean).join(" ");
72
- return /* @__PURE__ */ r(l.Root, {
72
+ return /* @__PURE__ */ c(l.Root, {
73
73
  open: k,
74
74
  onOpenChange: ue,
75
- children: [/* @__PURE__ */ r("div", {
75
+ children: [/* @__PURE__ */ c("div", {
76
76
  ref: J,
77
77
  className: de,
78
78
  "data-popup-open": k || void 0,
79
- children: [/* @__PURE__ */ r("div", {
79
+ children: [/* @__PURE__ */ c("div", {
80
80
  className: "async-multi-select__input-area",
81
81
  children: [
82
- oe.map((t) => /* @__PURE__ */ r("span", {
82
+ oe.map((t) => /* @__PURE__ */ c("span", {
83
83
  className: "async-multi-select__pill",
84
- children: [/* @__PURE__ */ n("span", {
84
+ children: [/* @__PURE__ */ s("span", {
85
85
  className: "async-multi-select__pill-label",
86
86
  children: t.label
87
- }), !h && !g && /* @__PURE__ */ n("button", {
87
+ }), !h && !g && /* @__PURE__ */ s("button", {
88
88
  type: "button",
89
89
  className: "async-multi-select__pill-remove",
90
90
  "aria-label": re(t.label),
@@ -92,15 +92,15 @@ var d = i(function({ onSearch: i, value: d, defaultValue: f = [], onValueChange:
92
92
  onMouseDown: (e) => {
93
93
  e.preventDefault(), $(t.value);
94
94
  },
95
- children: /* @__PURE__ */ n(e, {
95
+ children: /* @__PURE__ */ s(e, {
96
96
  name: "close",
97
97
  size: "xs"
98
98
  })
99
99
  })]
100
100
  }, t.value)),
101
- /* @__PURE__ */ n("input", {
101
+ /* @__PURE__ */ s("input", {
102
102
  ref: (e) => {
103
- q.current = e, u(ie, e);
103
+ q.current = e, te(O, e);
104
104
  },
105
105
  id: y,
106
106
  type: "text",
@@ -125,64 +125,64 @@ var d = i(function({ onSearch: i, value: d, defaultValue: f = [], onValueChange:
125
125
  "aria-autocomplete": "list",
126
126
  onBlur: C
127
127
  }),
128
- b && X.map((e) => /* @__PURE__ */ n("input", {
128
+ b && X.map((e) => /* @__PURE__ */ s("input", {
129
129
  type: "hidden",
130
130
  name: b,
131
131
  value: e
132
132
  }, e))
133
133
  ]
134
- }), N && /* @__PURE__ */ n(t, {
134
+ }), N && /* @__PURE__ */ s(t, {
135
135
  size: "sm",
136
136
  "aria-hidden": !0
137
137
  })]
138
- }), /* @__PURE__ */ n(l.Portal, {
139
- container: O,
140
- children: /* @__PURE__ */ n(l.Positioner, {
138
+ }), /* @__PURE__ */ s(l.Portal, {
139
+ container: D,
140
+ children: /* @__PURE__ */ s(l.Positioner, {
141
141
  className: "async-multi-select__positioner",
142
142
  anchor: J,
143
143
  align: "start",
144
144
  sideOffset: -1,
145
- children: /* @__PURE__ */ n(l.Popup, {
145
+ children: /* @__PURE__ */ s(l.Popup, {
146
146
  className: fe,
147
147
  initialFocus: !1,
148
148
  finalFocus: !1,
149
- children: /* @__PURE__ */ r("div", {
149
+ children: /* @__PURE__ */ c("div", {
150
150
  role: "listbox",
151
151
  "aria-multiselectable": "true",
152
152
  "aria-label": T ?? m,
153
153
  id: Y,
154
154
  children: [
155
- N && /* @__PURE__ */ n("div", {
155
+ N && /* @__PURE__ */ s("div", {
156
156
  className: "async-multi-select__loading",
157
- children: /* @__PURE__ */ n(t, {
157
+ children: /* @__PURE__ */ s(t, {
158
158
  size: "sm",
159
- label: D
159
+ label: E
160
160
  })
161
161
  }),
162
- !N && L && F.length === 0 && /* @__PURE__ */ n("div", {
162
+ !N && L && F.length === 0 && /* @__PURE__ */ s("div", {
163
163
  className: "async-multi-select__empty",
164
- children: E
164
+ children: ie
165
165
  }),
166
166
  !N && F.map((e, t) => {
167
- let i = X.includes(e.value), a = z === t;
168
- return /* @__PURE__ */ r("div", {
167
+ let n = X.includes(e.value), r = z === t;
168
+ return /* @__PURE__ */ c("div", {
169
169
  id: Z(t),
170
170
  role: "option",
171
- "aria-selected": i,
171
+ "aria-selected": n,
172
172
  className: [
173
173
  "async-multi-select__item",
174
- i ? "async-multi-select__item--selected" : "",
175
- a ? "async-multi-select__item--active" : ""
174
+ n ? "async-multi-select__item--selected" : "",
175
+ r ? "async-multi-select__item--active" : ""
176
176
  ].filter(Boolean).join(" "),
177
177
  onPointerDown: (e) => e.preventDefault(),
178
178
  onClick: () => {
179
179
  $(e.value, e), q.current?.focus();
180
180
  },
181
- children: [/* @__PURE__ */ n("span", {
181
+ children: [/* @__PURE__ */ s("span", {
182
182
  className: "async-multi-select__item-check",
183
183
  "aria-hidden": "true",
184
- children: /* @__PURE__ */ n("span", { className: "async-multi-select__item-check-mark" })
185
- }), /* @__PURE__ */ n("span", { children: e.label })]
184
+ children: /* @__PURE__ */ s("span", { className: "async-multi-select__item-check-mark" })
185
+ }), /* @__PURE__ */ s("span", { children: e.label })]
186
186
  }, e.value);
187
187
  })
188
188
  ]
@@ -193,4 +193,4 @@ var d = i(function({ onSearch: i, value: d, defaultValue: f = [], onValueChange:
193
193
  });
194
194
  });
195
195
  //#endregion
196
- export { d as AsyncMultiSelect };
196
+ export { u as AsyncMultiSelect };
@@ -5,21 +5,21 @@ import { n as t } from "./_shared/form-size.js";
5
5
  import { ErrorText as n } from "./error-text.js";
6
6
  import { Label as r } from "./label.js";
7
7
  import { n as i } from "./_shared/field-labels.js";
8
- import { jsx as a, jsxs as o } from "react/jsx-runtime";
9
- import { forwardRef as s, useId as c } from "react";
8
+ import { forwardRef as a, useId as o } from "react";
9
+ import { jsx as s, jsxs as c } from "react/jsx-runtime";
10
10
  //#region src/stories/molecules/AsyncSelectField/AsyncSelectField.tsx
11
- var l = s(function({ id: s, label: l, labelHidden: u, onSearch: d, value: f, onValueChange: p, selectedOption: m, placeholder: h, name: g, disabled: _, readOnly: v, size: y, debounceMs: b, required: x, error: S = !1, errorMessage: C, helperText: w, className: T, emptyMessage: E, loadingLabel: D, clearLabel: O, container: k, onBlur: A }, j) {
12
- let M = i(u), N = t(y), P = c(), F = s ?? P, I = C ? `${F}-error` : void 0, L = w ? `${F}-helper` : void 0, R = [I, L].filter(Boolean).join(" ") || void 0, z = S || !!C;
13
- return /* @__PURE__ */ o("div", {
11
+ var l = a(function({ id: a, label: l, labelHidden: u, onSearch: d, value: f, onValueChange: p, selectedOption: m, placeholder: h, name: g, disabled: _, readOnly: v, size: y, debounceMs: b, required: x, error: S = !1, errorMessage: C, helperText: w, className: T, emptyMessage: E, loadingLabel: D, clearLabel: O, container: k, onBlur: A }, j) {
12
+ let M = i(u), N = t(y), P = o(), F = a ?? P, I = C ? `${F}-error` : void 0, L = w ? `${F}-helper` : void 0, R = [I, L].filter(Boolean).join(" ") || void 0, z = S || !!C;
13
+ return /* @__PURE__ */ c("div", {
14
14
  className: ["async-select-field", T].filter(Boolean).join(" "),
15
15
  children: [
16
- /* @__PURE__ */ a(r, {
16
+ /* @__PURE__ */ s(r, {
17
17
  htmlFor: F,
18
18
  hidden: M,
19
19
  size: N,
20
20
  children: l
21
21
  }),
22
- /* @__PURE__ */ a(e, {
22
+ /* @__PURE__ */ s(e, {
23
23
  ref: j,
24
24
  id: F,
25
25
  name: g,
@@ -41,11 +41,11 @@ var l = s(function({ id: s, label: l, labelHidden: u, onSearch: d, value: f, onV
41
41
  "aria-describedby": R,
42
42
  onBlur: A
43
43
  }),
44
- C && /* @__PURE__ */ a(n, {
44
+ C && /* @__PURE__ */ s(n, {
45
45
  id: I,
46
46
  children: C
47
47
  }),
48
- w && /* @__PURE__ */ a("span", {
48
+ w && /* @__PURE__ */ s("span", {
49
49
  id: L,
50
50
  className: "async-select-field__helper",
51
51
  children: w
@@ -2,159 +2,159 @@
2
2
  import './async-select.css';
3
3
  import { Icon as e } from "./icon.js";
4
4
  import { Spinner as t } from "./spinner.js";
5
- import { jsx as n, jsxs as r } from "react/jsx-runtime";
6
- import { forwardRef as i, useCallback as a, useEffect as o, useId as s, useRef as c, useState as l } from "react";
5
+ import { forwardRef as n, useCallback as r, useEffect as i, useId as a, useRef as o, useState as s } from "react";
6
+ import { jsx as c, jsxs as l } from "react/jsx-runtime";
7
7
  import { Popover as u } from "@base-ui/react/popover";
8
8
  //#region src/stories/atoms/AsyncSelect/AsyncSelect.tsx
9
9
  function ee(e, t) {
10
10
  typeof e == "function" ? e(t) : e && (e.current = t);
11
11
  }
12
- var d = i(function({ onSearch: i, value: d, onValueChange: f, selectedOption: p, placeholder: m = "Buscar…", disabled: h, readOnly: g, size: _ = "md", debounceMs: v = 300, id: y, name: b, error: x = !1, required: te, onBlur: S, className: C, "aria-label": w, "aria-describedby": T, emptyMessage: ne = "Sin resultados", loadingLabel: re = "Buscando…", clearLabel: E = "Limpiar selección", container: D }, ie) {
13
- let [O, k] = l(!1), [A, j] = l(""), [M, N] = l(!1), [P, F] = l([]), [I, L] = l(!1), [R, z] = l(-1), [B, V] = l(null), [H, U] = l(null), W = c(null), G = c(0), K = c(null), q = c(null), J = s(), ae = s(), Y = d === void 0 ? B : d, oe = p === void 0 ? H : p, X = (e) => `${ae}-opt-${e}`, Z = a(async (e) => {
14
- let t = ++G.current;
15
- N(!0), L(!1);
12
+ var d = n(function({ onSearch: n, value: d, onValueChange: f, selectedOption: p, placeholder: m = "Buscar…", disabled: h, readOnly: g, size: _ = "md", debounceMs: v = 300, id: y, name: b, error: x = !1, required: S, onBlur: C, className: w, "aria-label": T, "aria-describedby": E, emptyMessage: D = "Sin resultados", loadingLabel: te = "Buscando…", clearLabel: ne = "Limpiar selección", container: re }, ie) {
13
+ let [O, k] = s(!1), [A, j] = s(""), [M, N] = s(!1), [P, F] = s([]), [ae, I] = s(!1), [L, R] = s(-1), [z, B] = s(null), [V, H] = s(null), U = o(null), W = o(0), G = o(null), K = o(null), q = a(), oe = a(), J = d === void 0 ? z : d, se = p === void 0 ? V : p, Y = (e) => `${oe}-opt-${e}`, X = r(async (e) => {
14
+ let t = ++W.current;
15
+ N(!0), I(!1);
16
16
  try {
17
- let n = await i(e);
18
- if (t !== G.current) return;
19
- F(n), z(-1);
17
+ let r = await n(e);
18
+ if (t !== W.current) return;
19
+ F(r), R(-1);
20
20
  } catch {
21
- if (t !== G.current) return;
22
- F([]), z(-1);
21
+ if (t !== W.current) return;
22
+ F([]), R(-1);
23
23
  } finally {
24
- t === G.current && (N(!1), L(!0));
24
+ t === W.current && (N(!1), I(!0));
25
25
  }
26
- }, [i]);
27
- o(() => () => {
28
- G.current += 1, W.current && clearTimeout(W.current);
26
+ }, [n]);
27
+ i(() => () => {
28
+ W.current += 1, U.current && clearTimeout(U.current);
29
29
  }, []);
30
- function se(e) {
30
+ function ce(e) {
31
31
  let t = e.target.value;
32
- j(t), W.current && clearTimeout(W.current), W.current = setTimeout(() => void Z(t), v);
32
+ j(t), U.current && clearTimeout(U.current), U.current = setTimeout(() => void X(t), v);
33
33
  }
34
- function ce(e) {
35
- h || g || O || (e.preventDefault(), K.current?.focus(), z(-1), j(""), F([]), L(!1), k(!0), Z(""));
34
+ function Z(e) {
35
+ h || g || O || (e.preventDefault(), G.current?.focus(), R(-1), j(""), F([]), I(!1), k(!0), X(""));
36
36
  }
37
37
  function Q(e) {
38
- d === void 0 && (V(e.value), U(e)), f?.(e.value, e), k(!1), z(-1), j("");
38
+ d === void 0 && (B(e.value), H(e)), f?.(e.value, e), k(!1), R(-1), j("");
39
39
  }
40
40
  function $() {
41
- d === void 0 && (V(null), U(null)), f?.(null, null), j(""), F([]), L(!1), K.current?.focus();
41
+ d === void 0 && (B(null), H(null)), f?.(null, null), j(""), F([]), I(!1), G.current?.focus();
42
42
  }
43
43
  function le(e) {
44
44
  e.stopPropagation(), $();
45
45
  }
46
46
  function ue(e) {
47
- e.key === "ArrowDown" ? (e.preventDefault(), O ? z((e) => Math.min(e + 1, P.length - 1)) : (k(!0), Z(A))) : e.key === "ArrowUp" ? (e.preventDefault(), z((e) => Math.max(e - 1, -1))) : e.key === "Enter" && R >= 0 && P[R] ? (e.preventDefault(), Q(P[R])) : e.key === "Escape" ? (k(!1), j(""), z(-1)) : e.key === "Tab" ? (k(!1), z(-1)) : (e.key === "Backspace" || e.key === "Delete") && A === "" && Y && !h && !g ? (e.preventDefault(), $()) : !O && e.key.length === 1 && !e.ctrlKey && !e.metaKey && !e.altKey && (e.preventDefault(), j(e.key), k(!0), F([]), L(!1), W.current && clearTimeout(W.current), W.current = setTimeout(() => void Z(e.key), v));
47
+ e.key === "ArrowDown" ? (e.preventDefault(), O ? R((e) => Math.min(e + 1, P.length - 1)) : (k(!0), X(A))) : e.key === "ArrowUp" ? (e.preventDefault(), R((e) => Math.max(e - 1, -1))) : e.key === "Enter" && L >= 0 && P[L] ? (e.preventDefault(), Q(P[L])) : e.key === "Escape" ? (k(!1), j(""), R(-1)) : e.key === "Tab" ? (k(!1), R(-1)) : (e.key === "Backspace" || e.key === "Delete") && A === "" && J && !h && !g ? (e.preventDefault(), $()) : !O && e.key.length === 1 && !e.ctrlKey && !e.metaKey && !e.altKey && (e.preventDefault(), j(e.key), k(!0), F([]), I(!1), U.current && clearTimeout(U.current), U.current = setTimeout(() => void X(e.key), v));
48
48
  }
49
49
  function de(e, t) {
50
50
  if (!e) {
51
51
  if (t.reason === "outside-press") {
52
52
  let e = t.event?.target;
53
- if (e instanceof Node && q.current?.contains(e)) return;
53
+ if (e instanceof Node && K.current?.contains(e)) return;
54
54
  }
55
- k(!1), j(""), z(-1);
55
+ k(!1), j(""), R(-1);
56
56
  }
57
57
  }
58
- let fe = O ? A : oe?.label ?? "", pe = [
58
+ let fe = O ? A : se?.label ?? "", pe = [
59
59
  "async-select",
60
60
  _ === "md" ? "" : `async-select--${_}`,
61
61
  h ? "async-select--disabled" : "",
62
62
  x ? "async-select--error" : "",
63
- C ?? ""
63
+ w ?? ""
64
64
  ].filter(Boolean).join(" "), me = ["async-select__content", _ === "md" ? "" : `async-select__content--${_}`].filter(Boolean).join(" ");
65
- return /* @__PURE__ */ r(u.Root, {
65
+ return /* @__PURE__ */ l(u.Root, {
66
66
  open: O,
67
67
  onOpenChange: de,
68
- children: [/* @__PURE__ */ r("div", {
69
- ref: q,
68
+ children: [/* @__PURE__ */ l("div", {
69
+ ref: K,
70
70
  className: pe,
71
71
  "data-popup-open": O || void 0,
72
72
  children: [
73
- /* @__PURE__ */ n("input", {
73
+ /* @__PURE__ */ c("input", {
74
74
  ref: (e) => {
75
- K.current = e, ee(ie, e);
75
+ G.current = e, ee(ie, e);
76
76
  },
77
77
  id: y,
78
78
  type: "text",
79
79
  className: "async-select__input",
80
80
  value: fe,
81
- onChange: se,
82
- onPointerDown: ce,
81
+ onChange: ce,
82
+ onPointerDown: Z,
83
83
  onKeyDown: ue,
84
84
  placeholder: m,
85
85
  disabled: h,
86
86
  readOnly: g,
87
- "aria-label": w,
88
- "aria-describedby": T,
87
+ "aria-label": T,
88
+ "aria-describedby": E,
89
89
  "aria-invalid": x || void 0,
90
- "aria-required": te || void 0,
90
+ "aria-required": S || void 0,
91
91
  "aria-expanded": O,
92
92
  "aria-haspopup": "listbox",
93
- "aria-controls": O ? J : void 0,
94
- "aria-activedescendant": R >= 0 ? X(R) : void 0,
93
+ "aria-controls": O ? q : void 0,
94
+ "aria-activedescendant": L >= 0 ? Y(L) : void 0,
95
95
  autoComplete: "off",
96
96
  role: "combobox",
97
97
  "aria-autocomplete": "list",
98
- onBlur: S
98
+ onBlur: C
99
99
  }),
100
- b && /* @__PURE__ */ n("input", {
100
+ b && /* @__PURE__ */ c("input", {
101
101
  type: "hidden",
102
102
  name: b,
103
- value: Y ?? ""
103
+ value: J ?? ""
104
104
  }),
105
- M && /* @__PURE__ */ n(t, {
105
+ M && /* @__PURE__ */ c(t, {
106
106
  size: "sm",
107
107
  "aria-hidden": !0
108
108
  }),
109
- !M && Y && !h && !g && /* @__PURE__ */ n("button", {
109
+ !M && J && !h && !g && /* @__PURE__ */ c("button", {
110
110
  type: "button",
111
111
  className: "async-select__clear",
112
- "aria-label": E,
112
+ "aria-label": ne,
113
113
  tabIndex: -1,
114
114
  onMouseDown: le,
115
- children: /* @__PURE__ */ n(e, {
115
+ children: /* @__PURE__ */ c(e, {
116
116
  name: "close",
117
117
  size: "xs"
118
118
  })
119
119
  })
120
120
  ]
121
- }), /* @__PURE__ */ n(u.Portal, {
122
- container: D,
123
- children: /* @__PURE__ */ n(u.Positioner, {
121
+ }), /* @__PURE__ */ c(u.Portal, {
122
+ container: re,
123
+ children: /* @__PURE__ */ c(u.Positioner, {
124
124
  className: "async-select__positioner",
125
- anchor: q,
125
+ anchor: K,
126
126
  align: "start",
127
127
  sideOffset: -1,
128
- children: /* @__PURE__ */ n(u.Popup, {
128
+ children: /* @__PURE__ */ c(u.Popup, {
129
129
  className: me,
130
130
  initialFocus: !1,
131
131
  finalFocus: !1,
132
- children: /* @__PURE__ */ r("div", {
132
+ children: /* @__PURE__ */ l("div", {
133
133
  role: "listbox",
134
- "aria-label": w ?? m,
135
- id: J,
134
+ "aria-label": T ?? m,
135
+ id: q,
136
136
  children: [
137
- M && /* @__PURE__ */ n("div", {
137
+ M && /* @__PURE__ */ c("div", {
138
138
  className: "async-select__loading",
139
- children: /* @__PURE__ */ n(t, {
139
+ children: /* @__PURE__ */ c(t, {
140
140
  size: "sm",
141
- label: re
141
+ label: te
142
142
  })
143
143
  }),
144
- !M && I && P.length === 0 && /* @__PURE__ */ n("div", {
144
+ !M && ae && P.length === 0 && /* @__PURE__ */ c("div", {
145
145
  className: "async-select__empty",
146
- children: ne
146
+ children: D
147
147
  }),
148
148
  !M && P.map((e, t) => {
149
- let r = e.value === Y, i = R === t;
150
- return /* @__PURE__ */ n("div", {
151
- id: X(t),
149
+ let n = e.value === J, r = L === t;
150
+ return /* @__PURE__ */ c("div", {
151
+ id: Y(t),
152
152
  role: "option",
153
- "aria-selected": r,
153
+ "aria-selected": n,
154
154
  className: [
155
155
  "async-select__item",
156
- r ? "async-select__item--selected" : "",
157
- i ? "async-select__item--active" : ""
156
+ n ? "async-select__item--selected" : "",
157
+ r ? "async-select__item--active" : ""
158
158
  ].filter(Boolean).join(" "),
159
159
  onPointerDown: (e) => e.preventDefault(),
160
160
  onClick: () => Q(e),