prometeo-design-system 2.6.2 → 2.6.3

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.
@@ -1,798 +0,0 @@
1
- import { j as l } from "./jsx-runtime-ByW6EXIE.js";
2
- import { Icons as ce } from "./Icons.es.js";
3
- import { c as u } from "./cn-B6yFEsav.js";
4
- import we, { memo as F, useState as ue, useRef as V, useMemo as Y, useCallback as J, useEffect as Z, useImperativeHandle as $e } from "react";
5
- import _e from "./Spinner.es.js";
6
- import { createPortal as Re } from "react-dom";
7
- import { u as We } from "./useDragScroll-CHN9OMwn.js";
8
- import { u as Be, I as Ke } from "./Input-r2N9xkjM.js";
9
- import { H as Ue } from "./HelperComponent-8ErmQ_n9.js";
10
- import Fe from "./CheckBox.es.js";
11
- import { Skeleton as Se } from "./Skeleton.es.js";
12
- const qe = {
13
- default: {
14
- container: "text-neutral-default-default border-neutral-default-default ",
15
- icon: ""
16
- },
17
- error: {
18
- container: "",
19
- icon: ""
20
- },
21
- success: {
22
- container: "",
23
- icon: ""
24
- }
25
- }, Ne = {
26
- icon: " text-neutral-default-disabled",
27
- container: " border-neutral-strong-default text-neutral-default-disabled"
28
- }, ke = ({ id: e, label: t, onRemove: i, className: c, disabled: s, variant: o = "default", tabIndex: v }) => /* @__PURE__ */ l.jsxs(
29
- "div",
30
- {
31
- tabIndex: v,
32
- className: u(
33
- "inline-flex max-w-[calc(50%-0.25rem)] items-center gap-1 px-2 py-1 bg-inherit text-xs rounded-lg border h-[30px]",
34
- qe[o].container,
35
- s && Ne.container
36
- ),
37
- children: [
38
- /* @__PURE__ */ l.jsx("span", { className: "truncate w-max ", children: t }),
39
- i && /* @__PURE__ */ l.jsx(
40
- "button",
41
- {
42
- onMouseDown: (p) => {
43
- s || (p.stopPropagation(), p.preventDefault(), i?.(e));
44
- },
45
- className: u(
46
- "shrink-0 p-0.5 transition-all duration-200 hover:text-neutral-default-hover cursor-pointer z-50 text-neutral-default-default hover:scale-105",
47
- s && "cursor-default hover:scale-100",
48
- c
49
- ),
50
- type: "button",
51
- tabIndex: v,
52
- children: /* @__PURE__ */ l.jsx(ce.Close, { size: 18, className: u(s && Ne.icon) })
53
- }
54
- )
55
- ]
56
- }
57
- );
58
- ke.displayName = "Chip";
59
- const Ge = F(ke);
60
- function E(e, t) {
61
- if (typeof t == "function")
62
- return t(e);
63
- const i = t?.split(".");
64
- let c = e;
65
- for (const s of i)
66
- if (c && typeof c == "object" && s in c)
67
- c = c[s];
68
- else
69
- return;
70
- return c;
71
- }
72
- const je = (e, t) => {
73
- if (!t) return !0;
74
- const i = 0.1, c = String(e).toLowerCase(), s = String(t).toLowerCase().trim();
75
- if (c.includes(s)) return !0;
76
- const o = s.split(/\s+/).filter(Boolean), v = o.filter((m) => /^\d+$/.test(m));
77
- if (o.length > 1 || v.length > 0) {
78
- for (const m of v)
79
- if (!new RegExp(`(^|\\D)${m}(\\D|$)`).test(c)) return !1;
80
- for (const m of o)
81
- if (!/^\d+$/.test(m) && !c.includes(m))
82
- return !1;
83
- return !0;
84
- }
85
- if (s.length > c.length) return !1;
86
- const p = Math.floor(s.length * i);
87
- if (p <= 0) return !1;
88
- const k = (m, L) => {
89
- const b = m.length, S = L.length;
90
- if (b === 0) return S;
91
- if (S === 0) return b;
92
- const w = new Array(S + 1);
93
- for (let x = 0; x <= S; x++) w[x] = x;
94
- for (let x = 1; x <= b; x++) {
95
- let h = x - 1;
96
- w[0] = x;
97
- for (let g = 1; g <= S; g++) {
98
- const R = w[g], N = m.charCodeAt(x - 1) === L.charCodeAt(g - 1) ? 0 : 1, H = w[g] + 1, I = w[g - 1] + 1, O = h + N;
99
- w[g] = H < I ? H < O ? H : O : I < O ? I : O, h = R;
100
- }
101
- }
102
- return w[S];
103
- };
104
- for (let m = 0; m <= c.length - s.length; m++) {
105
- const L = c.slice(m, m + s.length);
106
- if (k(L, s) <= p) return !0;
107
- }
108
- return !1;
109
- }, ye = {
110
- default: {
111
- container: "",
112
- input: u(
113
- "border-neutral-default-default text-neutral-default-default",
114
- "focus:ring-primary-default-default focus:ring-[1px] focus:border-primary-default-default ",
115
- "hover:border-primary-default-default"
116
- ),
117
- label: u(
118
- "text-neutral-medium-default",
119
- "peer-focus:text-primary-default-default"
120
- ),
121
- icon: u(
122
- "text-neutral-medium-default",
123
- "peer-focus:text-primary-default-default"
124
- )
125
- },
126
- error: {
127
- container: "",
128
- input: u(
129
- "border-error-default-default text-neutral-default-default hover:border-error-default-hover",
130
- "focus:border-error-default focus:border-2",
131
- "focus:ring-0 focus:ring-error-default/20"
132
- ),
133
- label: u(
134
- "text-error-light",
135
- "peer-focus:text-error-light"
136
- ),
137
- icon: u(
138
- "text-error-medium-default",
139
- "peer-focus:text-error-light"
140
- )
141
- },
142
- success: {
143
- container: "",
144
- input: u(
145
- "border-success-default-default text-neutral-default-default",
146
- "focus:border-success-default focus:border-2",
147
- "focus:ring-0 focus:ring-success-default/20"
148
- ),
149
- label: u(
150
- "text-success",
151
- "peer-focus:text-success-light"
152
- ),
153
- icon: u(
154
- "text-success-medium-default",
155
- "peer-focus:text-success-light"
156
- )
157
- }
158
- }, ve = {
159
- input: u(
160
- "border-neutral-strong-default text-neutral-default-default",
161
- "focus:ring-primary-default-default focus:ring-[1px] focus:border-primary-default-default ",
162
- "hover:border-primary-default-default"
163
- ),
164
- label: u(
165
- "text-neutral-medium-disabled",
166
- "peer-focus:text-primary-default-default"
167
- ),
168
- icon: u(
169
- "text-neutral-medium-disabled",
170
- "peer-focus:text-primary-default-default"
171
- )
172
- };
173
- function Ve(e) {
174
- const [t, i] = ue(!1), [c, s] = ue([]), [o, v] = ue(""), p = V(null), k = V(null), m = V(null), L = V(null), b = V(() => {
175
- }), S = V(null), w = V(/* @__PURE__ */ new Set()), {
176
- id: x,
177
- name: h,
178
- label: g,
179
- height: R,
180
- options: N,
181
- controls: H,
182
- className: I,
183
- placeholder: O,
184
- optionValue: j,
185
- optionLabel: W,
186
- renderOption: T,
187
- renderSelection: ee,
188
- buttonClassName: q,
189
- dropdownClassName: le,
190
- containerClassName: de,
191
- dropdownOptions: z,
192
- helperComponent: ae,
193
- errorComponent: fe,
194
- onRemoveOption: B,
195
- onOptionClick: P,
196
- onClose: oe,
197
- onClear: te,
198
- disabled: K = !1,
199
- overflow: me = "wrap",
200
- variant: Q = "default",
201
- isLoading: se = !1,
202
- attachToParent: he = !1,
203
- displayMode: X = "compact",
204
- labelVariant: U = "default",
205
- disableOpenOnFocus: pe = !1,
206
- emptyMessage: ge = "No hay opciones disponibles"
207
- } = e, { ref: ie } = Be(), { bind: r, ref: a } = We({
208
- axis: "x",
209
- cursor: { idle: "default", dragging: "grabbing" }
210
- }), d = e.multiple ? Array.isArray(e.value) && e.value.length > 0 : e.value !== void 0 && e.value !== null && e.value !== "", y = {}, M = Y(() => U === "static" && O ? O : "", [U, O]), $ = Y(
211
- () => z?.controledSearchValue || o,
212
- [z?.controledSearchValue, o]
213
- ), _ = () => {
214
- const n = {
215
- static: {
216
- active: "relative prometeo-fonts-label-large",
217
- default: "relative prometeo-fonts-label-large"
218
- },
219
- default: {
220
- active: "absolute top-0 -translate-y-1/2 left-3 px-1 prometeo-fonts-body-small",
221
- default: "absolute top-1/2 -translate-y-1/2 "
222
- }
223
- }, f = t || d ? "active" : "default";
224
- return n[U][f];
225
- }, G = J((n) => ({
226
- id: E(n, j),
227
- value: E(n, j),
228
- label: E(n, W)
229
- }), [j, W]), C = Y(
230
- () => N.map(G),
231
- [N]
232
- ), A = Y(
233
- () => {
234
- const n = [];
235
- if (e.multiple)
236
- e.value?.forEach((f) => {
237
- const D = N?.find((re) => E(re, j) === f);
238
- D && n.push(D);
239
- });
240
- else {
241
- const f = N?.find((D) => E(D, j) === e.value);
242
- f && n.push(f);
243
- }
244
- return n;
245
- },
246
- [e.value, j, N, e.multiple]
247
- ), ne = Y(
248
- () => A.map(G),
249
- [A, G]
250
- ), Ee = Y(
251
- () => new Set(ne.map((n) => n.id)),
252
- [ne]
253
- ), Le = J(() => {
254
- i((n) => !n);
255
- }, []);
256
- b.current = (n) => {
257
- if (!e.multiple)
258
- e.onChange?.(n, h);
259
- else {
260
- const f = e.value || [], D = [], re = f.includes(n.value);
261
- f.forEach((xe) => {
262
- const De = C.find((Me) => Me.value === xe);
263
- De && D.push(De);
264
- });
265
- const Pe = re ? D.filter((xe) => xe.value !== n.value) : [...D, n];
266
- e.onChange?.(Pe, h);
267
- }
268
- };
269
- const He = J((n) => {
270
- P?.(n, h), b.current?.(n), e.multiple || (i(!1), oe?.());
271
- }, [e.multiple, P, oe, h]), Ie = (n) => {
272
- n.preventDefault(), n.stopPropagation(), n.target.blur(), te?.(), e.multiple ? e.onChange?.([], h) : e.onChange?.(void 0, h);
273
- }, be = J((n) => {
274
- e.multiple || e.onChange?.(void 0, h);
275
- const f = N.find((re) => E(re, j) === n);
276
- if (!f) return;
277
- const D = G(f);
278
- P?.(D, h), b.current?.(D), B?.(f);
279
- }, [P, B, N, h, e.multiple, e.onChange, G, j]), Te = J((n) => {
280
- be(n);
281
- }, [be]);
282
- Z(() => {
283
- if (!t) return;
284
- const n = (f) => {
285
- const D = f.target;
286
- if (f.type === "mousedown") {
287
- if (p.current?.contains(D) || k.current?.contains(D)) return;
288
- i(!1);
289
- }
290
- if (f.type === "scroll") {
291
- if (k.current?.contains(D)) return;
292
- i(!1);
293
- }
294
- f.type === "resize" && i(!1);
295
- };
296
- return document.addEventListener("mousedown", n), window.addEventListener("scroll", n, !0), window.addEventListener("resize", n, !0), () => {
297
- document.removeEventListener("mousedown", n), window.removeEventListener("scroll", n, !0), window.removeEventListener("resize", n, !0);
298
- };
299
- }, [t]), Z(() => {
300
- w.current.forEach((n) => {
301
- try {
302
- n(t);
303
- } catch {
304
- }
305
- });
306
- }, [t]), $e(H, () => ({
307
- open: () => {
308
- !t && i(!0);
309
- },
310
- close: () => {
311
- t && i(!1);
312
- },
313
- toggle: () => i((n) => !n),
314
- subscribeOpenChange: (n) => (w.current.add(n), () => {
315
- w.current.delete(n);
316
- }),
317
- searchInputRef: m
318
- }), [t]);
319
- const Ae = (n) => {
320
- n.preventDefault(), n.stopPropagation(), n.target.matches(":focus-visible") && !pe && !t && (i(!0), setTimeout(() => {
321
- m.current?.focus();
322
- }, 10));
323
- }, ze = (n) => {
324
- n.key === "Tab" && t && i(!1), (n.keyCode === 32 || n.key === "ArrowDown") && (i(!0), setTimeout(() => {
325
- m.current?.focus();
326
- }, 10));
327
- };
328
- return /* @__PURE__ */ l.jsxs(
329
- "div",
330
- {
331
- className: u(
332
- "relative bg-inherit select-none w-full",
333
- I,
334
- U === "static" && "mt-2"
335
- ),
336
- ref: p,
337
- draggable: !1,
338
- style: y,
339
- children: [
340
- /* @__PURE__ */ l.jsxs("div", { className: u("relative bg-inherit ", de), children: [
341
- /* @__PURE__ */ l.jsx(
342
- "label",
343
- {
344
- htmlFor: x,
345
- ref: ie,
346
- className: u(
347
- "left-3 pointer-events-none bg-inherit z-10",
348
- U === "default" && "transition-all duration-200 ease-in-out",
349
- _(),
350
- d || t ? ye[Q].label : "text-neutral-medium-default",
351
- K && ve.label
352
- ),
353
- children: g
354
- }
355
- ),
356
- /* @__PURE__ */ l.jsxs(
357
- "div",
358
- {
359
- id: x,
360
- tabIndex: 0,
361
- role: "button",
362
- ref: L,
363
- onFocus: Ae,
364
- onKeyDown: ze,
365
- onClick: (n) => {
366
- n.preventDefault(), n.stopPropagation(), Le();
367
- },
368
- className: u(
369
- "w-full px-2 text-left border rounded-lg transition-all duration-200 ease-in-out",
370
- "flex items-center justify-start bg-inherit ",
371
- "focus:outline-none",
372
- X === "chips" && "mt-1.5",
373
- X === "chips" && e.multiple && d ? "min-h-14 py-3 " : !R && "h-14 min-h-14",
374
- ye[Q].input,
375
- K && ve.input,
376
- q
377
- ),
378
- children: [
379
- /* @__PURE__ */ l.jsx(
380
- "div",
381
- {
382
- className: u("flex-1 overflow-x-auto overflow-y-hidden px-1 prometeo-scrollbar-none "),
383
- ref: a,
384
- onPointerUp: r.onPointerUp,
385
- onPointerDown: r.onPointerDown,
386
- onPointerMove: r.onPointerMove,
387
- onPointerLeave: r.onPointerLeave,
388
- onPointerCancel: r.onPointerCancel,
389
- onClickCapture: r.onClickCapture,
390
- children: ee ? we.createElement(
391
- F(
392
- ee,
393
- (n, f) => n.disabled === f.disabled && n.multiple === f.multiple
394
- ),
395
- {
396
- disabled: K,
397
- multiple: e.multiple || !1,
398
- placeholder: O,
399
- selectedOptions: A,
400
- onRemoveOption: Te
401
- }
402
- ) : /* @__PURE__ */ l.jsx(
403
- Oe,
404
- {
405
- displayMode: X,
406
- selectedOptions: ne,
407
- placeholder: M,
408
- onRemoveOption: be,
409
- multiple: e.multiple || !1,
410
- className: u(me === "scroll" ? "flex-nowrap" : "flex-wrap"),
411
- disabled: K
412
- }
413
- )
414
- }
415
- ),
416
- /* @__PURE__ */ l.jsxs("div", { className: "flex items-center gap-2", children: [
417
- se && /* @__PURE__ */ l.jsx(_e, { size: "small", variant: "clip", className: " translate-y-1", speedMultiplier: 0.7 }),
418
- d && te && /* @__PURE__ */ l.jsx(
419
- "button",
420
- {
421
- onMouseDown: (n) => {
422
- n.preventDefault(), n.stopPropagation(), Ie(n);
423
- },
424
- type: "button",
425
- tabIndex: -1,
426
- children: /* @__PURE__ */ l.jsx(ce.Cancel, { size: 20, className: u(" cursor-pointer transition-all", ye[Q].icon) })
427
- }
428
- ),
429
- /* @__PURE__ */ l.jsx(
430
- ce.ChevronDown,
431
- {
432
- size: 20,
433
- className: u(
434
- "transition-transform text-neutral-default-default",
435
- t ? "rotate-180" : "",
436
- K && ve.icon
437
- )
438
- }
439
- )
440
- ] })
441
- ]
442
- }
443
- )
444
- ] }),
445
- t && /* @__PURE__ */ l.jsx(
446
- Xe,
447
- {
448
- isOpen: t,
449
- multiple: e.multiple || !1,
450
- disabled: K,
451
- optionLabel: W,
452
- optionValue: j,
453
- labelVariant: U,
454
- renderOption: T,
455
- emptyMessage: ge,
456
- attachToParent: he,
457
- filteredOptions: c,
458
- dropdownClassName: le,
459
- setFilteredOptions: s,
460
- selectedOptionsIds: Ee,
461
- options: T ? N : C,
462
- selectRef: p,
463
- dropdownRef: k,
464
- selectButtonRef: L,
465
- helperComponentRef: S,
466
- onOptionClick: He,
467
- onCloseDropdown: () => i(!1),
468
- searchValue: $,
469
- setSearchValue: v,
470
- searchInputRef: m,
471
- isLoading: z?.isLoading,
472
- onSearchClear: z?.onSearchClear,
473
- hideSearchBar: z?.hideSearchBar,
474
- dropdownHeight: z?.dropdownHeight,
475
- onSearchValueChange: z?.onSearchValueChange,
476
- inputSearchPlaceholder: z?.inputSearchPlaceholder
477
- }
478
- ),
479
- /* @__PURE__ */ l.jsx("div", { className: "min-h-6", children: (fe || ae) && /* @__PURE__ */ l.jsx(
480
- Ue,
481
- {
482
- ref: S,
483
- variant: Q,
484
- className: "absolute bottom-0 ",
485
- children: fe || ae
486
- }
487
- ) })
488
- ]
489
- }
490
- );
491
- }
492
- const Je = F(Ve, (e, t) => e.value === t.value && e.options === t.options && e.isLoading === t.isLoading && e.disabled === t.disabled && e.errorComponent === t.errorComponent && e.helperComponent === t.helperComponent && e.variant === t.variant && e.label === t.label && e.id === t.id && e.name === t.name && e.placeholder === t.placeholder && e.dropdownOptions?.controledSearchValue === t.dropdownOptions?.controledSearchValue && e.dropdownOptions?.isLoading === t.dropdownOptions?.isLoading), ut = Je;
493
- function Qe({
494
- isOpen: e,
495
- options: t,
496
- multiple: i,
497
- disabled: c,
498
- selectRef: s,
499
- dropdownRef: o,
500
- optionLabel: v,
501
- optionValue: p,
502
- searchValue: k,
503
- labelVariant: m,
504
- emptyMessage: L,
505
- renderOption: b,
506
- onOptionClick: S,
507
- onSearchClear: w,
508
- searchInputRef: x,
509
- setSearchValue: h,
510
- dropdownHeight: g,
511
- attachToParent: R,
512
- filteredOptions: N,
513
- selectButtonRef: H,
514
- onCloseDropdown: I,
515
- dropdownClassName: O,
516
- helperComponentRef: j,
517
- selectedOptionsIds: W,
518
- setFilteredOptions: T,
519
- onSearchValueChange: ee,
520
- isLoading: q = !1,
521
- hideSearchBar: le = !1,
522
- inputSearchPlaceholder: de = "Buscar opciones"
523
- }) {
524
- const ae = m === "static" ? -20 : 7, B = J(() => g ? g.endsWith("px") ? Number(g.replace("px", "")) : g.endsWith("vh") ? window.innerHeight * Number(g.replace("vh", "")) / 100 : g.endsWith("%") ? window.innerHeight * Number(g.replace("%", "")) / 100 : 320 : 320, [g])(), [P, oe] = ue({ direction: "down", height: B }), te = (r) => {
525
- if (!o.current || !s.current) return;
526
- const a = s.current.getBoundingClientRect();
527
- switch (r || P.direction) {
528
- case "down":
529
- o.current.style.top = `${a.top + a.height - (j?.current?.offsetHeight ? j?.current?.offsetHeight + 4 : 0)}px`;
530
- break;
531
- case "up":
532
- o.current.style.top = "auto", o.current.style.bottom = `${window.innerHeight - a.top + ae}px`;
533
- break;
534
- }
535
- o.current.style.left = `${a.left}px`, o.current.style.width = `${a.width}px`;
536
- }, K = (r) => {
537
- o.current && (o.current.style.maxHeight = `${r}px`);
538
- }, me = () => {
539
- if (!o.current || !s.current) return P;
540
- const r = s.current.getBoundingClientRect(), a = window.innerHeight - (window.innerHeight - r.top), d = window.innerHeight - r.bottom, y = d >= B, M = a >= B;
541
- let $ = "down", _;
542
- return y ? ($ = "down", _ = B) : M ? ($ = "up", _ = B) : d > a ? ($ = "down", _ = d - 16) : ($ = "up", _ = a - 16), { direction: $, height: _ };
543
- }, Q = (r) => {
544
- if (!(!o.current || !s.current)) {
545
- if (o.current.style.transition = "max-height 0.2s ease,opacity 0.2s ease", !r) {
546
- o.current.style.maxHeight = "0", o.current.style.opacity = "0", o.current.style.pointerEvents = "none";
547
- return;
548
- }
549
- if (!R) {
550
- const a = me();
551
- oe(a), te(a.direction), K(a.height);
552
- }
553
- o.current.style.opacity = "1", o.current.style.pointerEvents = "auto";
554
- }
555
- };
556
- Z(() => {
557
- R || !s.current || !e || te();
558
- }, [W]), Z(() => {
559
- Q(e);
560
- }, [e]), Z(() => {
561
- t && T(t);
562
- }, [t]), Z(() => {
563
- if (q || !k) return;
564
- const r = se(t, k);
565
- T(r);
566
- }, [t]);
567
- const se = (r, a) => r.filter((d) => je(b ? E(d, v) : d.label, a)), he = (r) => {
568
- const a = se(t, r);
569
- if (T(a), ee) {
570
- if (r === "") {
571
- X();
572
- return;
573
- }
574
- ee(r);
575
- return;
576
- }
577
- h && t && h(r);
578
- }, X = J(() => {
579
- if (w) {
580
- w(), T(
581
- t.filter((r) => {
582
- const a = b ? E(r, p) : r.id;
583
- return W.has(a);
584
- })
585
- );
586
- return;
587
- }
588
- h && (h(""), T(t));
589
- }, [t, W, p, w, T, h, b]), U = (r) => {
590
- r.key === "ArrowDown" ? (r.preventDefault(), o.current?.querySelector("[role=listitem]")?.focus()) : (r.key === "Tab" || r.key === "Escape") && setTimeout(() => {
591
- H.current?.focus(), I();
592
- }, 10);
593
- }, pe = (r, a) => {
594
- const d = Array.from(o.current?.querySelectorAll("[role=listitem]") || []), y = d.indexOf(r.currentTarget);
595
- if (r.key === "ArrowDown") {
596
- r.preventDefault();
597
- const M = y < d.length - 1 ? y + 1 : y;
598
- d[M]?.focus();
599
- } else if (r.key === "ArrowUp")
600
- if (r.preventDefault(), y === 0)
601
- x && x.current?.focus();
602
- else {
603
- const M = y - 1;
604
- d[M]?.focus();
605
- }
606
- else if (r.key === "Enter" || r.key === " ") {
607
- if (r.preventDefault(), c) return;
608
- S(a), i || setTimeout(() => {
609
- H.current?.focus(), I();
610
- }, 10);
611
- } else r.key === "Escape" ? (r.preventDefault(), setTimeout(() => {
612
- H.current?.focus(), I();
613
- }, 10)) : r.key === "Tab" && setTimeout(() => {
614
- H.current?.focus(), I();
615
- }, 10);
616
- }, ge = Array.from({ length: 5 }).map((r, a) => b ? we.createElement(
617
- F(
618
- b,
619
- (d, y) => d.isSelected === y.isSelected && d.option === y.option && d.disabled === y.disabled && d.multiple === y.multiple
620
- ),
621
- {
622
- key: `skeleton-option-${a}`,
623
- option: { id: a, label: "", value: "" },
624
- isSelected: !1,
625
- multiple: !1,
626
- onSelect: () => {
627
- },
628
- disabled: !1,
629
- isLoading: !0
630
- }
631
- ) : /* @__PURE__ */ l.jsx(
632
- Ce,
633
- {
634
- multiple: !1,
635
- isLoading: !0,
636
- onSelect: () => {
637
- },
638
- isSelected: !1,
639
- option: { id: a, label: "", value: "" }
640
- },
641
- `skeleton-option-${// biome-ignore lint/suspicious/noArrayIndexKey: <>
642
- a}`
643
- )), ie = /* @__PURE__ */ l.jsx(
644
- "div",
645
- {
646
- tabIndex: 0,
647
- ref: o,
648
- style: { opacity: "0" },
649
- className: u(
650
- " z-50 w-full mt-1 bg-neutral-default-default border border-neutral-default-default rounded-lg shadow-lg",
651
- " overflow-hidden focus-visible:bg-neutral-default-hover ",
652
- R ? "absolute z-50 " : "fixed z-100 top-0 left-0",
653
- P.direction === "up" ? "h-auto" : " h-max",
654
- O
655
- ),
656
- children: /* @__PURE__ */ l.jsxs(
657
- "div",
658
- {
659
- className: u(
660
- "flex flex-col ",
661
- le ? "p-0" : "p-2 pt-0 gap-2"
662
- ),
663
- style: {
664
- height: "auto",
665
- maxHeight: P.height
666
- },
667
- children: [
668
- !le && /* @__PURE__ */ l.jsx(
669
- Ke,
670
- {
671
- name: "",
672
- label: "",
673
- size: "small",
674
- tabIndex: 0,
675
- value: k,
676
- disabled: c,
677
- ref: x,
678
- labelVariant: "static",
679
- icon: /* @__PURE__ */ l.jsx(ce.Search, {}),
680
- isFetching: q,
681
- onKeyDown: U,
682
- onClear: X,
683
- onChange: he,
684
- placeholder: de,
685
- className: " bg-neutral-medium-pressed"
686
- }
687
- ),
688
- /* @__PURE__ */ l.jsx("div", { className: " overflow-y-auto flex-1 max-h-max ", children: N.length === 0 ? q ? /* @__PURE__ */ l.jsx("div", { className: "flex flex-col gap-1 overflow-hidden w-full", children: ge }) : /* @__PURE__ */ l.jsx("div", { className: "px-3 py-2 text-neutral-medium-default", children: k ? `No se encontraron resultados para "${k}"` : L }) : N.map((r) => {
689
- const a = b ? E(r, p) : r.id, d = W.has(a), y = (C) => b ? {
690
- id: a,
691
- label: String(E(C, v)),
692
- value: E(C, p)
693
- } : C, M = () => {
694
- S(y(r));
695
- }, $ = (C) => {
696
- if (S(C), !i) {
697
- if (!h) return;
698
- h(""), T(t);
699
- }
700
- }, _ = (C, A) => (
701
- // biome-ignore lint/a11y/useSemanticElements: <>
702
- /* @__PURE__ */ l.jsx(
703
- "div",
704
- {
705
- tabIndex: 0,
706
- role: "listitem",
707
- onKeyDown: (ne) => pe(ne, A),
708
- className: u(
709
- "focus-visible:bg-neutral-medium-hover outline-none hover:bg-neutral-medium-hover ",
710
- d && "bg-neutral-medium-selected"
711
- ),
712
- children: C
713
- }
714
- )
715
- ), G = b ? we.createElement(
716
- F(
717
- b,
718
- (C, A) => C.isSelected === A.isSelected && C.option === A.option && C.disabled === A.disabled && C.multiple === A.multiple
719
- ),
720
- {
721
- key: a,
722
- option: r,
723
- isSelected: d,
724
- multiple: i,
725
- onSelect: M,
726
- disabled: c,
727
- isLoading: q
728
- }
729
- ) : /* @__PURE__ */ l.jsx(
730
- Ce,
731
- {
732
- disabled: c,
733
- multiple: i,
734
- isLoading: q,
735
- isSelected: d,
736
- onSelect: $,
737
- option: r
738
- },
739
- a
740
- );
741
- return _(G, y(r));
742
- }) })
743
- ]
744
- }
745
- )
746
- }
747
- );
748
- return R ? ie : Re(ie, document.body);
749
- }
750
- const Xe = F(Qe, (e, t) => e.options === t.options && e.selectedOptionsIds === t.selectedOptionsIds && e.multiple === t.multiple && e.disabled === t.disabled && e.emptyMessage === t.emptyMessage && e.renderOption === t.renderOption && e.isOpen === t.isOpen && e.attachToParent === t.attachToParent && e.optionValue === t.optionValue && e.optionLabel === t.optionLabel && e.filteredOptions === t.filteredOptions && e.isLoading === t.isLoading), Ce = F(({ option: e, isSelected: t, onSelect: i, multiple: c, disabled: s, isLoading: o }) => o ? /* @__PURE__ */ l.jsxs("div", { className: "flex gap-2 w-full px-3 py-2 cursor-wait", children: [
751
- /* @__PURE__ */ l.jsx(Se, { className: "size-6 aspect-square" }),
752
- /* @__PURE__ */ l.jsx(Se, { className: "flex-1 h-6" })
753
- ] }) : (
754
- // biome-ignore lint/a11y/noStaticElementInteractions: no keyboard interaction needed
755
- /* @__PURE__ */ l.jsxs(
756
- "div",
757
- {
758
- onMouseDown: (v) => {
759
- v.preventDefault(), v.stopPropagation(), !s && i?.(e);
760
- },
761
- className: u(
762
- "px-3 py-2 cursor-pointer flex items-center transition-colors text-neutral-default-default ",
763
- t ? " text-primary-default-default" : "hover:bg-neutral-medium-hover text-neutral-default-hover",
764
- s && "text-neutral-default-disabled hover:bg-neutral-default-default"
765
- ),
766
- children: [
767
- c && /* @__PURE__ */ l.jsx(
768
- Fe,
769
- {
770
- checked: t,
771
- disabled: s
772
- }
773
- ),
774
- /* @__PURE__ */ l.jsx("span", { children: e.label })
775
- ]
776
- }
777
- )
778
- ), (e, t) => e.isSelected === t.isSelected);
779
- Ce.displayName = "DefaultOptionRenderer";
780
- const Oe = F(({ selectedOptions: e, placeholder: t, onRemoveOption: i, displayMode: c, multiple: s, className: o, disabled: v }) => e?.length === 0 ? t ? /* @__PURE__ */ l.jsx("span", { className: "text-neutral-medium-default opacity-50", children: t }) : null : c === "chips" && s ? /* @__PURE__ */ l.jsx("div", { className: u("flex items-center gap-1 ", o), children: e.map((p) => /* @__PURE__ */ l.jsx(
781
- Ge,
782
- {
783
- tabIndex: -1,
784
- id: p.id,
785
- label: p.label,
786
- onRemove: i,
787
- disabled: v
788
- },
789
- p.id
790
- )) }) : e?.length === 1 ? /* @__PURE__ */ l.jsx("span", { children: e[0].label }) : /* @__PURE__ */ l.jsxs("span", { children: [
791
- e?.length,
792
- " seleccionados"
793
- ] }), (e, t) => e.selectedOptions === t.selectedOptions);
794
- Oe.displayName = "DefaultSelectionDisplay";
795
- export {
796
- ut as S,
797
- E as g
798
- };