@agroshine/ags-web-ui-kit 1.0.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 (109) hide show
  1. package/README.md +75 -0
  2. package/dist/atoms/index.cjs +134 -0
  3. package/dist/atoms/index.cjs.map +1 -0
  4. package/dist/atoms/index.d.cts +583 -0
  5. package/dist/atoms/index.d.ts +583 -0
  6. package/dist/atoms/index.js +9 -0
  7. package/dist/atoms/index.js.map +1 -0
  8. package/dist/chunk-2KRMLIJQ.cjs +52 -0
  9. package/dist/chunk-2KRMLIJQ.cjs.map +1 -0
  10. package/dist/chunk-2TBYPKQ3.cjs +79 -0
  11. package/dist/chunk-2TBYPKQ3.cjs.map +1 -0
  12. package/dist/chunk-5FWELSEZ.js +1296 -0
  13. package/dist/chunk-5FWELSEZ.js.map +1 -0
  14. package/dist/chunk-5PEOJVY7.cjs +1502 -0
  15. package/dist/chunk-5PEOJVY7.cjs.map +1 -0
  16. package/dist/chunk-6LUGTNMH.js +259 -0
  17. package/dist/chunk-6LUGTNMH.js.map +1 -0
  18. package/dist/chunk-6O2IDBTX.js +112 -0
  19. package/dist/chunk-6O2IDBTX.js.map +1 -0
  20. package/dist/chunk-6YUNWKT3.js +26 -0
  21. package/dist/chunk-6YUNWKT3.js.map +1 -0
  22. package/dist/chunk-7R6OXNES.cjs +321 -0
  23. package/dist/chunk-7R6OXNES.cjs.map +1 -0
  24. package/dist/chunk-A3A7PJWG.cjs +13 -0
  25. package/dist/chunk-A3A7PJWG.cjs.map +1 -0
  26. package/dist/chunk-A7TDGQAB.js +557 -0
  27. package/dist/chunk-A7TDGQAB.js.map +1 -0
  28. package/dist/chunk-C4LX3XTN.cjs +1187 -0
  29. package/dist/chunk-C4LX3XTN.cjs.map +1 -0
  30. package/dist/chunk-DZW4GS2T.cjs +1340 -0
  31. package/dist/chunk-DZW4GS2T.cjs.map +1 -0
  32. package/dist/chunk-E3BTK736.cjs +174 -0
  33. package/dist/chunk-E3BTK736.cjs.map +1 -0
  34. package/dist/chunk-ERGKCXM2.cjs +267 -0
  35. package/dist/chunk-ERGKCXM2.cjs.map +1 -0
  36. package/dist/chunk-FOA46NSG.cjs +574 -0
  37. package/dist/chunk-FOA46NSG.cjs.map +1 -0
  38. package/dist/chunk-JTFCE6RA.js +1156 -0
  39. package/dist/chunk-JTFCE6RA.js.map +1 -0
  40. package/dist/chunk-KINOE57L.js +225 -0
  41. package/dist/chunk-KINOE57L.js.map +1 -0
  42. package/dist/chunk-MOED3QPY.js +11 -0
  43. package/dist/chunk-MOED3QPY.js.map +1 -0
  44. package/dist/chunk-NVR34DY2.cjs +4 -0
  45. package/dist/chunk-NVR34DY2.cjs.map +1 -0
  46. package/dist/chunk-PI3IJWBG.js +79 -0
  47. package/dist/chunk-PI3IJWBG.js.map +1 -0
  48. package/dist/chunk-PXAMTGYY.js +3 -0
  49. package/dist/chunk-PXAMTGYY.js.map +1 -0
  50. package/dist/chunk-QAZMI5VH.js +151 -0
  51. package/dist/chunk-QAZMI5VH.js.map +1 -0
  52. package/dist/chunk-QEG27NX6.js +30 -0
  53. package/dist/chunk-QEG27NX6.js.map +1 -0
  54. package/dist/chunk-THTOUSMG.cjs +52 -0
  55. package/dist/chunk-THTOUSMG.cjs.map +1 -0
  56. package/dist/chunk-UAXKB6IH.cjs +32 -0
  57. package/dist/chunk-UAXKB6IH.cjs.map +1 -0
  58. package/dist/chunk-W5IHWAMM.js +48 -0
  59. package/dist/chunk-W5IHWAMM.js.map +1 -0
  60. package/dist/chunk-X2UJQVZJ.cjs +139 -0
  61. package/dist/chunk-X2UJQVZJ.cjs.map +1 -0
  62. package/dist/chunk-X43C5OJD.js +1460 -0
  63. package/dist/chunk-X43C5OJD.js.map +1 -0
  64. package/dist/chunk-XCYSBWV4.js +56 -0
  65. package/dist/chunk-XCYSBWV4.js.map +1 -0
  66. package/dist/chunk-XX4CBCEB.cjs +102 -0
  67. package/dist/chunk-XX4CBCEB.cjs.map +1 -0
  68. package/dist/hooks/index.cjs +33 -0
  69. package/dist/hooks/index.cjs.map +1 -0
  70. package/dist/hooks/index.d.cts +59 -0
  71. package/dist/hooks/index.d.ts +59 -0
  72. package/dist/hooks/index.js +4 -0
  73. package/dist/hooks/index.js.map +1 -0
  74. package/dist/index.cjs +366 -0
  75. package/dist/index.cjs.map +1 -0
  76. package/dist/index.d.cts +13 -0
  77. package/dist/index.d.ts +13 -0
  78. package/dist/index.js +17 -0
  79. package/dist/index.js.map +1 -0
  80. package/dist/interface-DnK5S6ww.d.cts +51 -0
  81. package/dist/interface-DnK5S6ww.d.ts +51 -0
  82. package/dist/lib/index.cjs +13 -0
  83. package/dist/lib/index.cjs.map +1 -0
  84. package/dist/lib/index.d.cts +5 -0
  85. package/dist/lib/index.d.ts +5 -0
  86. package/dist/lib/index.js +4 -0
  87. package/dist/lib/index.js.map +1 -0
  88. package/dist/molecules/index.cjs +123 -0
  89. package/dist/molecules/index.cjs.map +1 -0
  90. package/dist/molecules/index.d.cts +449 -0
  91. package/dist/molecules/index.d.ts +449 -0
  92. package/dist/molecules/index.js +10 -0
  93. package/dist/molecules/index.js.map +1 -0
  94. package/dist/organisms/index.cjs +102 -0
  95. package/dist/organisms/index.cjs.map +1 -0
  96. package/dist/organisms/index.d.cts +396 -0
  97. package/dist/organisms/index.d.ts +396 -0
  98. package/dist/organisms/index.js +9 -0
  99. package/dist/organisms/index.js.map +1 -0
  100. package/dist/tooltip-Bl2ZTtfg.d.cts +16 -0
  101. package/dist/tooltip-Bl2ZTtfg.d.ts +16 -0
  102. package/dist/ui/index.cjs +955 -0
  103. package/dist/ui/index.cjs.map +1 -0
  104. package/dist/ui/index.d.cts +252 -0
  105. package/dist/ui/index.d.ts +252 -0
  106. package/dist/ui/index.js +642 -0
  107. package/dist/ui/index.js.map +1 -0
  108. package/package.json +200 -0
  109. package/tailwind.preset.cjs +134 -0
@@ -0,0 +1,1460 @@
1
+ import { FormItem } from './chunk-QEG27NX6.js';
2
+ import { Avatar, AvatarImage, AvatarFallback, Input, RadioGroup, RadioGroupItem, Separator, Skeleton, Textarea, toggleVariants, ToggleGroupItem, ToggleGroup, Checkbox, Badge } from './chunk-KINOE57L.js';
3
+ import { cn } from './chunk-MOED3QPY.js';
4
+ import * as React5 from 'react';
5
+ import { forwardRef, Fragment, useState, useRef, useCallback, useEffect, useImperativeHandle, useMemo } from 'react';
6
+ import { cva } from 'class-variance-authority';
7
+ import { jsxs, jsx } from 'react/jsx-runtime';
8
+ import { X, EyeOff, Eye, Plus, Minus, StarHalf, Star, ChevronDown, Inbox, Check } from 'lucide-react';
9
+ import * as ProgressPrimitive from '@radix-ui/react-progress';
10
+ import * as SliderPrimitive from '@radix-ui/react-slider';
11
+ import * as SwitchPrimitives from '@radix-ui/react-switch';
12
+ import * as TogglePrimitive from '@radix-ui/react-toggle';
13
+
14
+ var avatarVariants = cva(
15
+ "relative flex shrink-0 overflow-hidden bg-default-200 text-default-700",
16
+ {
17
+ variants: {
18
+ size: {
19
+ sm: "h-8 w-8 text-xs",
20
+ md: "h-10 w-10 text-sm",
21
+ lg: "h-12 w-12 text-base",
22
+ xl: "h-16 w-16 text-lg"
23
+ },
24
+ shape: {
25
+ circle: "rounded-full",
26
+ square: "rounded-md"
27
+ }
28
+ },
29
+ defaultVariants: { size: "md", shape: "circle" }
30
+ }
31
+ );
32
+ var Avatar2 = React5.forwardRef(
33
+ ({ src, alt, fallback, size = "md", shape = "circle", className }, ref) => /* @__PURE__ */ jsxs(Avatar, { ref, className: cn(avatarVariants({ size, shape }), className), children: [
34
+ src ? /* @__PURE__ */ jsx(AvatarImage, { src, alt }) : null,
35
+ /* @__PURE__ */ jsx(
36
+ AvatarFallback,
37
+ {
38
+ className: cn(
39
+ "flex h-full w-full items-center justify-center bg-default-200 text-default-700 font-medium",
40
+ shape === "circle" ? "rounded-full" : "rounded-md"
41
+ ),
42
+ children: fallback
43
+ }
44
+ )
45
+ ] })
46
+ );
47
+ Avatar2.displayName = "Avatar";
48
+ var Checkbox2 = ({
49
+ isSelected,
50
+ defaultSelected,
51
+ isDisabled,
52
+ isIndeterminate,
53
+ onValueChange,
54
+ children,
55
+ className,
56
+ classNames,
57
+ name,
58
+ value,
59
+ id
60
+ }) => {
61
+ const checkedProp = isIndeterminate === true ? "indeterminate" : isSelected !== void 0 ? isSelected : void 0;
62
+ return /* @__PURE__ */ jsxs(
63
+ "label",
64
+ {
65
+ className: cn(
66
+ "inline-flex items-center gap-2 cursor-pointer select-none",
67
+ isDisabled && "cursor-not-allowed opacity-60",
68
+ classNames?.base,
69
+ className
70
+ ),
71
+ children: [
72
+ /* @__PURE__ */ jsx(
73
+ Checkbox,
74
+ {
75
+ id,
76
+ name,
77
+ value,
78
+ disabled: isDisabled,
79
+ defaultChecked: defaultSelected,
80
+ checked: checkedProp,
81
+ onCheckedChange: (c) => onValueChange?.(Boolean(c)),
82
+ className: classNames?.wrapper
83
+ }
84
+ ),
85
+ children && /* @__PURE__ */ jsx("span", { className: cn("text-sm", classNames?.label), children })
86
+ ]
87
+ }
88
+ );
89
+ };
90
+ var ROW_PADDING = {
91
+ small: "py-1.5",
92
+ default: "py-2.5",
93
+ // canon (10px)
94
+ middle: "py-2.5",
95
+ // alias compat
96
+ large: "py-3.5"
97
+ };
98
+ var LABEL_TEXT = {
99
+ small: "text-[12px]",
100
+ default: "text-[13px]",
101
+ // canon
102
+ middle: "text-[13px]",
103
+ large: "text-sm"
104
+ };
105
+ var VALUE_TEXT = {
106
+ small: "text-[13px]",
107
+ default: "text-sm",
108
+ // canon (14px)
109
+ middle: "text-sm",
110
+ large: "text-base"
111
+ };
112
+ function DescRow({ label, value, size, layout, bordered, isLast }) {
113
+ const rowBorder = bordered ? "border-b border-border last:border-b-0" : cn("border-b border-border", isLast && "border-b-0");
114
+ if (layout === "vertical") {
115
+ return /* @__PURE__ */ jsxs("div", { className: cn(ROW_PADDING[size], rowBorder, bordered && "px-3"), children: [
116
+ /* @__PURE__ */ jsx("div", { className: cn("mb-1 font-normal text-muted-foreground", LABEL_TEXT[size]), children: label }),
117
+ /* @__PURE__ */ jsx("div", { className: cn("font-medium text-foreground", VALUE_TEXT[size]), children: value })
118
+ ] });
119
+ }
120
+ return /* @__PURE__ */ jsxs(
121
+ "div",
122
+ {
123
+ className: cn(
124
+ "grid grid-cols-[140px_1fr] items-baseline gap-3",
125
+ ROW_PADDING[size],
126
+ rowBorder
127
+ ),
128
+ children: [
129
+ /* @__PURE__ */ jsx(
130
+ "span",
131
+ {
132
+ className: cn(
133
+ "font-normal text-muted-foreground",
134
+ LABEL_TEXT[size],
135
+ bordered && "-my-2.5 bg-muted/40 px-3 py-2.5"
136
+ ),
137
+ children: label
138
+ }
139
+ ),
140
+ /* @__PURE__ */ jsx("span", { className: cn("font-medium text-foreground", VALUE_TEXT[size], bordered && "pr-3"), children: value })
141
+ ]
142
+ }
143
+ );
144
+ }
145
+ var Descriptions = forwardRef(function Descriptions2({
146
+ title,
147
+ column = 1,
148
+ layout = "horizontal",
149
+ size = "default",
150
+ bordered = false,
151
+ items,
152
+ className
153
+ }, ref) {
154
+ return /* @__PURE__ */ jsxs(
155
+ "div",
156
+ {
157
+ ref,
158
+ className: cn(
159
+ "w-full",
160
+ bordered && "overflow-hidden rounded-md border border-border",
161
+ className
162
+ ),
163
+ children: [
164
+ title && /* @__PURE__ */ jsx(
165
+ "div",
166
+ {
167
+ className: cn(
168
+ "mb-3 text-base font-semibold text-foreground",
169
+ bordered && "mb-0 border-b border-border bg-muted/40 px-3 py-2.5"
170
+ ),
171
+ children: title
172
+ }
173
+ ),
174
+ /* @__PURE__ */ jsx(
175
+ "div",
176
+ {
177
+ className: cn(column === 1 ? "flex flex-col" : "grid"),
178
+ style: column > 1 ? { gridTemplateColumns: `repeat(${column}, minmax(0, 1fr))`, columnGap: "24px" } : void 0,
179
+ children: items.map((item, idx) => /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsx(
180
+ DescRow,
181
+ {
182
+ label: item.label,
183
+ value: item.children,
184
+ size,
185
+ layout,
186
+ bordered,
187
+ isLast: idx === items.length - 1
188
+ }
189
+ ) }, idx))
190
+ }
191
+ )
192
+ ]
193
+ }
194
+ );
195
+ });
196
+ Descriptions.displayName = "Descriptions";
197
+ var sizeClasses = {
198
+ small: "h-7 text-[13px] px-2.5",
199
+ default: "h-9 text-sm px-3",
200
+ large: "h-10 text-[15px] px-4"
201
+ };
202
+ var statusBorderClasses = {
203
+ error: "border-destructive focus-visible:ring-destructive",
204
+ success: "border-success-500 focus-visible:ring-success-500",
205
+ warning: "border-warning-500 focus-visible:ring-warning-500",
206
+ default: ""
207
+ };
208
+ var Input2 = forwardRef(function Input3({
209
+ variant = "default",
210
+ prefix,
211
+ suffix,
212
+ allowClear = false,
213
+ status = "default",
214
+ showPasswordToggle = false,
215
+ type = "text",
216
+ disabled,
217
+ className,
218
+ name,
219
+ touched,
220
+ error,
221
+ externalLabel,
222
+ help,
223
+ errorMessage,
224
+ onChange,
225
+ value,
226
+ defaultValue,
227
+ ...rest
228
+ }, ref) {
229
+ const [internalValue, setInternalValue] = useState(defaultValue ?? "");
230
+ const isControlled = value !== void 0;
231
+ const currentValue = isControlled ? value : internalValue;
232
+ const [showPassword, setShowPassword] = useState(false);
233
+ const isPasswordType = type === "password";
234
+ const inputType = isPasswordType && showPasswordToggle ? showPassword ? "text" : "password" : type;
235
+ const showClearButton = allowClear && !disabled && Boolean(currentValue);
236
+ const showPasswordButton = isPasswordType && showPasswordToggle && !disabled;
237
+ const hasRightAffix = Boolean(suffix) || showClearButton || showPasswordButton;
238
+ const hasLeftAffix = Boolean(prefix);
239
+ const messageColor2 = status === "error" ? "text-destructive" : status === "warning" ? "text-warning-700" : "";
240
+ const handleChange = (e) => {
241
+ if (!isControlled) setInternalValue(e.target.value);
242
+ onChange?.(e);
243
+ };
244
+ const handleClear = () => {
245
+ if (!isControlled) setInternalValue("");
246
+ onChange?.({ target: { value: "" } });
247
+ };
248
+ return /* @__PURE__ */ jsxs(
249
+ FormItem,
250
+ {
251
+ help: touched || error ? help : "",
252
+ validateStatus: touched && error ? "error" : "default",
253
+ label: externalLabel,
254
+ children: [
255
+ /* @__PURE__ */ jsxs("div", { className: cn("relative w-full", className), children: [
256
+ hasLeftAffix && /* @__PURE__ */ jsx(
257
+ "span",
258
+ {
259
+ className: "pointer-events-none absolute inset-y-0 left-0 flex items-center px-2.5 text-muted-foreground",
260
+ "aria-hidden": "true",
261
+ children: prefix
262
+ }
263
+ ),
264
+ /* @__PURE__ */ jsx(
265
+ Input,
266
+ {
267
+ ref,
268
+ name,
269
+ type: inputType,
270
+ disabled,
271
+ value: currentValue,
272
+ onChange: handleChange,
273
+ "aria-invalid": status === "error" || touched && Boolean(error) || void 0,
274
+ className: cn(
275
+ sizeClasses[variant],
276
+ statusBorderClasses[status],
277
+ hasLeftAffix && "pl-9",
278
+ hasRightAffix && "pr-9"
279
+ ),
280
+ ...rest
281
+ }
282
+ ),
283
+ hasRightAffix && /* @__PURE__ */ jsxs("span", { className: "absolute inset-y-0 right-0 flex items-center gap-1 px-2.5 text-muted-foreground", children: [
284
+ showClearButton && /* @__PURE__ */ jsx(
285
+ "button",
286
+ {
287
+ type: "button",
288
+ onClick: handleClear,
289
+ "aria-label": "Limpiar",
290
+ className: "inline-flex items-center justify-center text-muted-foreground hover:text-foreground",
291
+ children: /* @__PURE__ */ jsx(X, { className: "h-3.5 w-3.5" })
292
+ }
293
+ ),
294
+ showPasswordButton && /* @__PURE__ */ jsx(
295
+ "button",
296
+ {
297
+ type: "button",
298
+ onClick: () => setShowPassword((v) => !v),
299
+ "aria-label": showPassword ? "Ocultar contrase\xF1a" : "Mostrar contrase\xF1a",
300
+ "aria-pressed": showPassword,
301
+ className: "inline-flex items-center justify-center text-muted-foreground hover:text-foreground",
302
+ children: showPassword ? /* @__PURE__ */ jsx(EyeOff, { className: "h-4 w-4" }) : /* @__PURE__ */ jsx(Eye, { className: "h-4 w-4" })
303
+ }
304
+ ),
305
+ suffix && /* @__PURE__ */ jsx("span", { className: "pointer-events-none flex items-center text-muted-foreground", children: suffix })
306
+ ] })
307
+ ] }),
308
+ errorMessage && /* @__PURE__ */ jsx(
309
+ "p",
310
+ {
311
+ className: cn("mt-1 text-xs", messageColor2),
312
+ role: status === "error" ? "alert" : void 0,
313
+ children: errorMessage
314
+ }
315
+ )
316
+ ]
317
+ }
318
+ );
319
+ });
320
+ var inputNumberRootVariants = cva(
321
+ "inline-flex items-center w-full rounded border bg-background text-default-900 transition-colors focus-within:ring-2 focus-within:ring-ring focus-within:ring-offset-2 focus-within:ring-offset-background",
322
+ {
323
+ variants: {
324
+ size: {
325
+ sm: "text-xs h-8",
326
+ md: "text-sm h-10",
327
+ lg: "text-base h-12"
328
+ },
329
+ disabled: {
330
+ true: "opacity-60 cursor-not-allowed bg-default-100",
331
+ false: ""
332
+ }
333
+ },
334
+ defaultVariants: { size: "md", disabled: false }
335
+ }
336
+ );
337
+ var inputNumberButtonVariants = cva(
338
+ "flex items-center justify-center text-default-700 hover:bg-default-100 disabled:opacity-40 disabled:cursor-not-allowed border-default-200",
339
+ {
340
+ variants: {
341
+ size: {
342
+ sm: "w-7 h-full",
343
+ md: "w-8 h-full",
344
+ lg: "w-10 h-full"
345
+ }
346
+ },
347
+ defaultVariants: { size: "md" }
348
+ }
349
+ );
350
+ function clamp(v, min, max) {
351
+ return Math.min(max, Math.max(min, v));
352
+ }
353
+ function format(v, precision) {
354
+ if (precision === void 0) return String(v);
355
+ return v.toFixed(precision);
356
+ }
357
+ var InputNumber = React5.forwardRef(
358
+ ({
359
+ value,
360
+ defaultValue,
361
+ onChange,
362
+ min = Number.NEGATIVE_INFINITY,
363
+ max = Number.POSITIVE_INFINITY,
364
+ step = 1,
365
+ size = "md",
366
+ disabled,
367
+ precision,
368
+ placeholder,
369
+ name,
370
+ id,
371
+ className
372
+ }, ref) => {
373
+ const [internal, setInternal] = React5.useState(defaultValue);
374
+ const current = value ?? internal;
375
+ const update = (next) => {
376
+ const c = clamp(next, min, max);
377
+ if (value === void 0) setInternal(c);
378
+ onChange?.(c);
379
+ };
380
+ const increment = () => update((current ?? 0) + step);
381
+ const decrement = () => update((current ?? 0) - step);
382
+ const handleInput = (e) => {
383
+ const raw = e.target.value;
384
+ if (raw === "") {
385
+ if (value === void 0) setInternal(void 0);
386
+ return;
387
+ }
388
+ const num = Number(raw);
389
+ if (Number.isNaN(num)) return;
390
+ update(num);
391
+ };
392
+ const display = current === void 0 ? "" : format(current, precision);
393
+ return /* @__PURE__ */ jsxs("div", { className: cn(inputNumberRootVariants({ size, disabled: !!disabled }), className), children: [
394
+ /* @__PURE__ */ jsx(
395
+ "input",
396
+ {
397
+ ref,
398
+ id,
399
+ name,
400
+ type: "number",
401
+ value: display,
402
+ onChange: handleInput,
403
+ disabled,
404
+ placeholder,
405
+ className: "flex-1 bg-transparent outline-none px-3 disabled:cursor-not-allowed [appearance:textfield] [&::-webkit-inner-spin-button]:appearance-none [&::-webkit-outer-spin-button]:appearance-none"
406
+ }
407
+ ),
408
+ /* @__PURE__ */ jsxs("div", { className: "flex flex-col h-full border-l border-default-200", children: [
409
+ /* @__PURE__ */ jsx(
410
+ "button",
411
+ {
412
+ type: "button",
413
+ onClick: increment,
414
+ disabled: disabled || current !== void 0 && current >= max,
415
+ className: cn(inputNumberButtonVariants({ size }), "border-b h-1/2"),
416
+ tabIndex: -1,
417
+ children: /* @__PURE__ */ jsx(Plus, { className: "h-3 w-3" })
418
+ }
419
+ ),
420
+ /* @__PURE__ */ jsx(
421
+ "button",
422
+ {
423
+ type: "button",
424
+ onClick: decrement,
425
+ disabled: disabled || current !== void 0 && current <= min,
426
+ className: cn(inputNumberButtonVariants({ size }), "h-1/2"),
427
+ tabIndex: -1,
428
+ children: /* @__PURE__ */ jsx(Minus, { className: "h-3 w-3" })
429
+ }
430
+ )
431
+ ] })
432
+ ] });
433
+ }
434
+ );
435
+ InputNumber.displayName = "InputNumber";
436
+ var progressTrackVariants = cva(
437
+ "relative w-full overflow-hidden rounded-full bg-default-200",
438
+ {
439
+ variants: {
440
+ size: {
441
+ sm: "h-1",
442
+ md: "h-2",
443
+ lg: "h-3"
444
+ }
445
+ },
446
+ defaultVariants: { size: "md" }
447
+ }
448
+ );
449
+ var progressIndicatorVariants = cva("h-full flex-1 transition-all", {
450
+ variants: {
451
+ color: {
452
+ primary: "bg-primary",
453
+ success: "bg-success",
454
+ warning: "bg-warning",
455
+ danger: "bg-destructive"
456
+ }
457
+ },
458
+ defaultVariants: { color: "primary" }
459
+ });
460
+ var Progress = React5.forwardRef(
461
+ ({ value = 0, color = "primary", size = "md", showLabel, label, className }, ref) => {
462
+ const clamped = Math.max(0, Math.min(100, value));
463
+ return /* @__PURE__ */ jsxs("div", { ref, className: cn("w-full", className), children: [
464
+ (label !== void 0 || showLabel) && /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between text-xs text-default-500 mb-1", children: [
465
+ label !== void 0 && /* @__PURE__ */ jsx("span", { children: label }),
466
+ showLabel && /* @__PURE__ */ jsxs("span", { className: "ml-auto", children: [
467
+ clamped,
468
+ "%"
469
+ ] })
470
+ ] }),
471
+ /* @__PURE__ */ jsx(ProgressPrimitive.Root, { value: clamped, className: progressTrackVariants({ size }), children: /* @__PURE__ */ jsx(
472
+ ProgressPrimitive.Indicator,
473
+ {
474
+ className: progressIndicatorVariants({ color }),
475
+ style: { transform: `translateX(-${100 - clamped}%)` }
476
+ }
477
+ ) })
478
+ ] });
479
+ }
480
+ );
481
+ Progress.displayName = "Progress";
482
+ var radioItemVariants = cva(
483
+ "aspect-square h-4 w-4 rounded-full border ring-offset-background focus:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50",
484
+ {
485
+ variants: {
486
+ color: {
487
+ primary: "border-primary text-primary data-[state=checked]:border-primary",
488
+ secondary: "border-secondary text-secondary data-[state=checked]:border-secondary",
489
+ success: "border-success text-success data-[state=checked]:border-success",
490
+ warning: "border-warning text-warning data-[state=checked]:border-warning",
491
+ danger: "border-destructive text-destructive data-[state=checked]:border-destructive"
492
+ }
493
+ },
494
+ defaultVariants: {
495
+ color: "primary"
496
+ }
497
+ }
498
+ );
499
+ var Radio = React5.forwardRef(
500
+ ({
501
+ value,
502
+ defaultValue,
503
+ options,
504
+ onChange,
505
+ orientation = "vertical",
506
+ color = "primary",
507
+ className,
508
+ name,
509
+ disabled
510
+ }, ref) => /* @__PURE__ */ jsx(
511
+ RadioGroup,
512
+ {
513
+ ref,
514
+ value,
515
+ defaultValue,
516
+ onValueChange: onChange,
517
+ name,
518
+ disabled,
519
+ className: cn(orientation === "horizontal" ? "flex flex-row gap-4" : "grid gap-2", className),
520
+ children: options.map((opt) => /* @__PURE__ */ jsxs(
521
+ "label",
522
+ {
523
+ className: cn(
524
+ "inline-flex items-center gap-2 text-sm cursor-pointer select-none",
525
+ (opt.disabled || disabled) && "cursor-not-allowed opacity-60"
526
+ ),
527
+ children: [
528
+ /* @__PURE__ */ jsx(
529
+ RadioGroupItem,
530
+ {
531
+ value: opt.value,
532
+ disabled: opt.disabled || disabled,
533
+ className: radioItemVariants({ color })
534
+ }
535
+ ),
536
+ /* @__PURE__ */ jsx("span", { children: opt.label })
537
+ ]
538
+ },
539
+ opt.value
540
+ ))
541
+ }
542
+ )
543
+ );
544
+ Radio.displayName = "Radio";
545
+ var rateStarVariants = cva("transition-colors cursor-pointer", {
546
+ variants: {
547
+ size: {
548
+ sm: "h-4 w-4",
549
+ md: "h-5 w-5",
550
+ lg: "h-7 w-7"
551
+ },
552
+ active: {
553
+ true: "fill-warning text-warning",
554
+ false: "fill-transparent text-default-300"
555
+ },
556
+ disabled: {
557
+ true: "cursor-not-allowed",
558
+ false: ""
559
+ }
560
+ },
561
+ defaultVariants: { size: "md", active: false, disabled: false }
562
+ });
563
+ var Rate = React5.forwardRef(
564
+ ({ value, defaultValue = 0, onChange, count = 5, allowHalf, disabled, size = "md", className }, ref) => {
565
+ const [internal, setInternal] = React5.useState(defaultValue);
566
+ const [hover, setHover] = React5.useState(null);
567
+ const current = value ?? internal;
568
+ const display = hover ?? current;
569
+ const setValue = (next) => {
570
+ if (disabled) return;
571
+ if (value === void 0) setInternal(next);
572
+ onChange?.(next);
573
+ };
574
+ const handleClick = (e, index) => {
575
+ if (!allowHalf) return setValue(index + 1);
576
+ const rect = e.currentTarget.getBoundingClientRect();
577
+ const isFirstHalf = e.clientX - rect.left < rect.width / 2;
578
+ setValue(index + (isFirstHalf ? 0.5 : 1));
579
+ };
580
+ const handleHover = (e, index) => {
581
+ if (disabled) return;
582
+ if (!allowHalf) return setHover(index + 1);
583
+ const rect = e.currentTarget.getBoundingClientRect();
584
+ const isFirstHalf = e.clientX - rect.left < rect.width / 2;
585
+ setHover(index + (isFirstHalf ? 0.5 : 1));
586
+ };
587
+ return /* @__PURE__ */ jsx(
588
+ "div",
589
+ {
590
+ ref,
591
+ className: cn("inline-flex items-center gap-1", className),
592
+ onMouseLeave: () => setHover(null),
593
+ children: Array.from({ length: count }).map((_, i) => {
594
+ const filled = display >= i + 1;
595
+ const half = !filled && allowHalf && display >= i + 0.5;
596
+ return /* @__PURE__ */ jsx(
597
+ "button",
598
+ {
599
+ type: "button",
600
+ disabled,
601
+ onClick: (e) => handleClick(e, i),
602
+ onMouseMove: (e) => handleHover(e, i),
603
+ className: cn(
604
+ "p-0 bg-transparent border-0 leading-none",
605
+ disabled && "cursor-not-allowed"
606
+ ),
607
+ "aria-label": `Rate ${i + 1}`,
608
+ children: half ? /* @__PURE__ */ jsx(StarHalf, { className: rateStarVariants({ size, active: true, disabled }) }) : /* @__PURE__ */ jsx(Star, { className: rateStarVariants({ size, active: filled, disabled }) })
609
+ },
610
+ i
611
+ );
612
+ })
613
+ }
614
+ );
615
+ }
616
+ );
617
+ Rate.displayName = "Rate";
618
+
619
+ // src/atoms/Select/utils.ts
620
+ var sizeClasses2 = {
621
+ sm: "h-8 text-[13.5px] pl-[11px] pr-8",
622
+ default: "h-10 text-sm pl-[14px] pr-9",
623
+ lg: "h-[46px] text-[15px] pl-4 pr-10"
624
+ };
625
+ var statusBorder = {
626
+ error: "border-destructive focus:ring-destructive/30",
627
+ warning: "border-warning-500 focus:ring-warning-500/30",
628
+ success: "border-success-500 focus:ring-success-500/30",
629
+ "": "border-input hover:border-primary-200 focus:ring-ring/30"
630
+ };
631
+ var statusBorderWithin = {
632
+ error: "border-destructive focus-within:ring-destructive/30",
633
+ warning: "border-warning-500 focus-within:ring-warning-500/30",
634
+ success: "border-success-500 focus-within:ring-success-500/30",
635
+ "": "border-input hover:border-primary-200 focus-within:ring-ring/30"
636
+ };
637
+ var messageColor = {
638
+ error: "text-destructive",
639
+ warning: "text-warning-600",
640
+ success: "text-success-600",
641
+ "": ""
642
+ };
643
+ var dotColorClass = {
644
+ primary: "bg-primary-700",
645
+ success: "bg-success-700",
646
+ warning: "bg-warning-800",
647
+ danger: "bg-danger-700"
648
+ };
649
+ var chipColorClass = {
650
+ primary: "bg-primary-50 text-primary-700 border-primary-100",
651
+ success: "bg-success-50 text-success-700 border-success-200",
652
+ warning: "bg-warning-50 text-warning-800 border-warning-100",
653
+ danger: "bg-danger-50 text-danger-700 border-danger-100"
654
+ };
655
+ var leadingIconBoxClass = "flex h-[22px] w-[22px] flex-shrink-0 items-center justify-center rounded bg-primary-50 text-[11px] font-bold text-primary-700";
656
+ var richIconBoxClass = "flex h-[26px] w-[26px] flex-shrink-0 items-center justify-center rounded-md text-[11.5px] font-bold";
657
+ var metaPillClass = "ml-auto flex-shrink-0 rounded-full bg-muted px-2 py-0.5 font-mono text-[11.5px] text-muted-foreground";
658
+ var dropdownClass = "absolute left-0 right-0 top-[calc(100%+6px)] z-20 max-h-80 overflow-y-auto rounded-md border border-border bg-popover p-1 text-popover-foreground";
659
+ function Chip({ option, disabled, onRemove }) {
660
+ const dot = option.dotColor ?? "primary";
661
+ return /* @__PURE__ */ jsxs(
662
+ "span",
663
+ {
664
+ className: cn(
665
+ "inline-flex h-7 items-center gap-1.5 rounded-full border pl-2.5 pr-1.5 text-[13px] font-medium",
666
+ chipColorClass[dot]
667
+ ),
668
+ children: [
669
+ /* @__PURE__ */ jsx("span", { className: cn("h-1.5 w-1.5 rounded-full", dotColorClass[dot]) }),
670
+ /* @__PURE__ */ jsx("span", { className: "truncate max-w-[180px]", children: option.label }),
671
+ /* @__PURE__ */ jsx(
672
+ "button",
673
+ {
674
+ type: "button",
675
+ "aria-label": "Quitar",
676
+ onClick: (e) => {
677
+ e.stopPropagation();
678
+ if (!disabled) onRemove(option.value);
679
+ },
680
+ className: "ml-0.5 inline-flex h-4 w-4 items-center justify-center rounded-full opacity-70 transition hover:bg-black/10 hover:opacity-100",
681
+ children: /* @__PURE__ */ jsx(X, { className: "h-3 w-3" })
682
+ }
683
+ )
684
+ ]
685
+ }
686
+ );
687
+ }
688
+ function EmptyState({
689
+ title = "Sin resultados",
690
+ subtitle = "Prueba otro t\xE9rmino de b\xFAsqueda"
691
+ }) {
692
+ return /* @__PURE__ */ jsxs("div", { className: "px-3 py-7 text-center", children: [
693
+ /* @__PURE__ */ jsx(Inbox, { className: "mx-auto mb-1.5 h-7 w-7 text-muted-foreground/40" }),
694
+ /* @__PURE__ */ jsx("div", { className: "text-[13.5px] font-medium text-foreground", children: title }),
695
+ subtitle && /* @__PURE__ */ jsx("div", { className: "mt-0.5 text-xs text-muted-foreground", children: subtitle })
696
+ ] });
697
+ }
698
+ function OptionItem({
699
+ option,
700
+ isActive,
701
+ isHighlighted = false,
702
+ variant = "select",
703
+ onMouseEnter,
704
+ onClick
705
+ }) {
706
+ const dot = option.dotColor ?? "primary";
707
+ return /* @__PURE__ */ jsxs(
708
+ "li",
709
+ {
710
+ role: "option",
711
+ "aria-selected": isActive,
712
+ onMouseEnter,
713
+ onClick,
714
+ className: cn(
715
+ "flex cursor-pointer items-center gap-2.5 rounded-sm px-2.5 py-2 text-sm text-foreground",
716
+ variant === "multiselect" && "hover:bg-accent",
717
+ isHighlighted && "bg-accent",
718
+ isActive && (variant === "select" ? "bg-primary-50 font-semibold text-primary-700" : "bg-primary-50 font-medium text-primary-700"),
719
+ option.disabled && "cursor-not-allowed text-muted-foreground opacity-60"
720
+ ),
721
+ children: [
722
+ option.leadingIcon ? variant === "select" ? /* @__PURE__ */ jsx(
723
+ "span",
724
+ {
725
+ className: cn(
726
+ richIconBoxClass,
727
+ isActive ? "bg-primary-700 text-white" : "bg-gradient-to-br from-primary-50 to-primary-100 text-primary-700"
728
+ ),
729
+ children: option.leadingIcon
730
+ }
731
+ ) : /* @__PURE__ */ jsx("span", { className: leadingIconBoxClass, children: option.leadingIcon }) : option.dotColor && variant === "multiselect" ? /* @__PURE__ */ jsx("span", { className: cn("h-2 w-2 rounded-full", dotColorClass[dot]) }) : null,
732
+ /* @__PURE__ */ jsxs("span", { className: "flex min-w-0 flex-1 flex-col gap-0.5", children: [
733
+ /* @__PURE__ */ jsx("span", { className: "truncate text-sm font-medium", children: option.label }),
734
+ option.description && /* @__PURE__ */ jsx("span", { className: "truncate text-xs font-normal text-muted-foreground", children: option.description })
735
+ ] }),
736
+ option.meta && /* @__PURE__ */ jsx("span", { className: metaPillClass, children: option.meta }),
737
+ isActive && variant === "multiselect" && /* @__PURE__ */ jsx(Check, { className: "ml-auto h-4 w-4 flex-shrink-0 text-primary-700" }),
738
+ isActive && variant === "select" && !option.meta && /* @__PURE__ */ jsx("span", { className: "ml-auto text-primary-700", "aria-hidden": true, children: "\u2713" })
739
+ ]
740
+ }
741
+ );
742
+ }
743
+ function MultiSelectInner(props, ref) {
744
+ const {
745
+ options,
746
+ value,
747
+ onChange,
748
+ placeholder = "Selecciona una opci\xF3n",
749
+ touched,
750
+ error,
751
+ help,
752
+ externalLabel,
753
+ isSearchable = false,
754
+ searchable = false,
755
+ errorMessage,
756
+ status = "",
757
+ disabled,
758
+ className,
759
+ maxTagCount = 3,
760
+ onBlur
761
+ } = props;
762
+ const [open, setOpen] = useState(false);
763
+ const [search, setSearch] = useState("");
764
+ const rootRef = useRef(null);
765
+ useImperativeHandle(ref, () => rootRef.current);
766
+ const enableSearch = searchable || isSearchable;
767
+ useEffect(() => {
768
+ const handleClickOutside = (e) => {
769
+ if (rootRef.current && !rootRef.current.contains(e.target)) {
770
+ if (open) {
771
+ setOpen(false);
772
+ onBlur?.();
773
+ }
774
+ }
775
+ };
776
+ document.addEventListener("mousedown", handleClickOutside);
777
+ return () => document.removeEventListener("mousedown", handleClickOutside);
778
+ }, [open, onBlur]);
779
+ const filteredOptions = useMemo(
780
+ () => enableSearch && search ? options.filter((opt) => opt.label.toLowerCase().includes(search.toLowerCase())) : options,
781
+ [options, search, enableSearch]
782
+ );
783
+ const toggleValue = (v) => {
784
+ if (value.includes(v)) onChange(value.filter((item) => item !== v));
785
+ else onChange([...value, v]);
786
+ };
787
+ const selectedOptions = useMemo(
788
+ () => value.map((v) => options.find((o) => o.value === v)).filter(Boolean),
789
+ [value, options]
790
+ );
791
+ const visibleChips = selectedOptions.slice(0, maxTagCount);
792
+ const overflowCount = selectedOptions.length - visibleChips.length;
793
+ const showError = touched && error || status === "error";
794
+ const effectiveStatus = showError ? "error" : status;
795
+ const isEmpty = filteredOptions.length === 0;
796
+ return /* @__PURE__ */ jsxs(
797
+ FormItem,
798
+ {
799
+ help: touched || error ? help : "",
800
+ validateStatus: showError ? "error" : "default",
801
+ label: externalLabel,
802
+ children: [
803
+ /* @__PURE__ */ jsxs("div", { ref: rootRef, className: cn("relative w-full", className), children: [
804
+ /* @__PURE__ */ jsxs(
805
+ "div",
806
+ {
807
+ role: "combobox",
808
+ "aria-expanded": open,
809
+ "aria-disabled": disabled,
810
+ onClick: () => !disabled && setOpen(true),
811
+ className: cn(
812
+ "relative flex min-h-[40px] w-full cursor-text flex-wrap items-center gap-1.5 rounded-md border bg-background py-1 pl-2 pr-9 text-sm transition-colors",
813
+ "focus-within:outline-none focus-within:ring-2 focus-within:ring-offset-2 focus-within:ring-offset-background",
814
+ statusBorderWithin[effectiveStatus],
815
+ open && !disabled && "border-ring",
816
+ disabled && "bg-muted text-muted-foreground cursor-not-allowed opacity-70"
817
+ ),
818
+ children: [
819
+ visibleChips.map((opt) => /* @__PURE__ */ jsx(Chip, { option: opt, disabled, onRemove: toggleValue }, String(opt.value))),
820
+ overflowCount > 0 && /* @__PURE__ */ jsxs("span", { className: "inline-flex h-[26px] items-center rounded-full bg-muted px-2 text-[12.5px] font-medium text-muted-foreground", children: [
821
+ "+",
822
+ overflowCount,
823
+ " m\xE1s"
824
+ ] }),
825
+ enableSearch ? /* @__PURE__ */ jsx(
826
+ "input",
827
+ {
828
+ className: "h-7 min-w-[80px] flex-1 border-0 bg-transparent px-1.5 text-sm outline-none placeholder:text-muted-foreground",
829
+ value: search,
830
+ placeholder: selectedOptions.length === 0 ? placeholder : "",
831
+ disabled,
832
+ onChange: (e) => {
833
+ setSearch(e.target.value);
834
+ if (!open) setOpen(true);
835
+ },
836
+ onFocus: () => setOpen(true)
837
+ }
838
+ ) : selectedOptions.length === 0 && /* @__PURE__ */ jsx("span", { className: "px-1.5 text-muted-foreground", children: placeholder }),
839
+ /* @__PURE__ */ jsx(
840
+ ChevronDown,
841
+ {
842
+ className: cn(
843
+ "pointer-events-none absolute right-3 top-1/2 h-4 w-4 -translate-y-1/2 text-muted-foreground transition-transform",
844
+ open && "rotate-180 text-primary-700"
845
+ ),
846
+ "aria-hidden": true
847
+ }
848
+ )
849
+ ]
850
+ }
851
+ ),
852
+ open && !disabled && /* @__PURE__ */ jsx("div", { role: "listbox", className: dropdownClass, children: isEmpty ? /* @__PURE__ */ jsx(EmptyState, {}) : /* @__PURE__ */ jsx("ul", { children: filteredOptions.map((option) => /* @__PURE__ */ jsx(
853
+ OptionItem,
854
+ {
855
+ option,
856
+ variant: "multiselect",
857
+ isActive: value.includes(option.value),
858
+ onClick: () => {
859
+ if (option.disabled) return;
860
+ toggleValue(option.value);
861
+ }
862
+ },
863
+ String(option.value)
864
+ )) }) })
865
+ ] }),
866
+ errorMessage && effectiveStatus === "error" && /* @__PURE__ */ jsx("p", { className: "mt-1 text-xs text-destructive", children: errorMessage })
867
+ ]
868
+ }
869
+ );
870
+ }
871
+ var MultiSelect = forwardRef(MultiSelectInner);
872
+ function SelectInner(props, ref) {
873
+ const {
874
+ options,
875
+ value,
876
+ onChange,
877
+ placeholder = "Selecciona una opci\xF3n",
878
+ touched,
879
+ error,
880
+ help,
881
+ externalLabel,
882
+ isSearchable = false,
883
+ errorMessage,
884
+ status = "",
885
+ size = "default",
886
+ leadingIcon,
887
+ disabled,
888
+ className,
889
+ onBlur
890
+ } = props;
891
+ const [open, setOpen] = useState(false);
892
+ const [search, setSearch] = useState("");
893
+ const [activeIndex, setActiveIndex] = useState(-1);
894
+ const rootRef = useRef(null);
895
+ useImperativeHandle(ref, () => rootRef.current);
896
+ const selectedOption = options.find((opt) => opt.value === value);
897
+ useEffect(() => {
898
+ const handleClickOutside = (e) => {
899
+ if (rootRef.current && !rootRef.current.contains(e.target)) {
900
+ if (open) {
901
+ setOpen(false);
902
+ onBlur?.();
903
+ }
904
+ }
905
+ };
906
+ document.addEventListener("mousedown", handleClickOutside);
907
+ return () => document.removeEventListener("mousedown", handleClickOutside);
908
+ }, [open, onBlur]);
909
+ const filteredOptions = useMemo(
910
+ () => isSearchable && search ? options.filter((opt) => opt.label.toLowerCase().includes(search.toLowerCase())) : options,
911
+ [options, search, isSearchable]
912
+ );
913
+ const commitSelection = (opt) => {
914
+ if (opt.disabled) return;
915
+ onChange(opt.value);
916
+ setOpen(false);
917
+ setSearch("");
918
+ setActiveIndex(-1);
919
+ };
920
+ const handleKeyDown = (e) => {
921
+ if (disabled) return;
922
+ if (!open && (e.key === "Enter" || e.key === " " || e.key === "ArrowDown")) {
923
+ e.preventDefault();
924
+ setOpen(true);
925
+ return;
926
+ }
927
+ if (!open) return;
928
+ if (e.key === "Escape") {
929
+ e.preventDefault();
930
+ setOpen(false);
931
+ } else if (e.key === "ArrowDown") {
932
+ e.preventDefault();
933
+ setActiveIndex((i) => Math.min(filteredOptions.length - 1, i + 1));
934
+ } else if (e.key === "ArrowUp") {
935
+ e.preventDefault();
936
+ setActiveIndex((i) => Math.max(0, i - 1));
937
+ } else if (e.key === "Enter") {
938
+ e.preventDefault();
939
+ const opt = filteredOptions[activeIndex];
940
+ if (opt) commitSelection(opt);
941
+ }
942
+ };
943
+ const showError = touched && error || status === "error";
944
+ const effectiveStatus = showError ? "error" : status;
945
+ const isEmpty = filteredOptions.length === 0;
946
+ return /* @__PURE__ */ jsxs(
947
+ FormItem,
948
+ {
949
+ help: touched || error ? help : "",
950
+ validateStatus: showError ? "error" : "default",
951
+ label: externalLabel,
952
+ children: [
953
+ /* @__PURE__ */ jsxs(
954
+ "div",
955
+ {
956
+ ref: rootRef,
957
+ className: cn("relative w-full", className),
958
+ onKeyDown: handleKeyDown,
959
+ tabIndex: -1,
960
+ children: [
961
+ /* @__PURE__ */ jsxs(
962
+ "button",
963
+ {
964
+ type: "button",
965
+ disabled,
966
+ onClick: () => !disabled && setOpen((o) => !o),
967
+ "aria-haspopup": "listbox",
968
+ "aria-expanded": open,
969
+ className: cn(
970
+ "w-full flex items-center gap-2 rounded-md border bg-background text-left transition-colors",
971
+ "focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-offset-background",
972
+ sizeClasses2[size],
973
+ statusBorder[effectiveStatus],
974
+ open && !disabled && "border-ring",
975
+ disabled && "bg-muted text-muted-foreground cursor-not-allowed opacity-70"
976
+ ),
977
+ children: [
978
+ leadingIcon && /* @__PURE__ */ jsx("span", { className: leadingIconBoxClass, children: leadingIcon }),
979
+ selectedOption ? /* @__PURE__ */ jsxs("span", { className: "flex min-w-0 flex-1 items-center gap-2 truncate font-medium text-foreground", children: [
980
+ selectedOption.leadingIcon && !leadingIcon && /* @__PURE__ */ jsx("span", { className: leadingIconBoxClass, children: selectedOption.leadingIcon }),
981
+ /* @__PURE__ */ jsx("span", { className: "truncate", children: selectedOption.label }),
982
+ selectedOption.meta && /* @__PURE__ */ jsxs("span", { className: "ml-1 text-[12.5px] font-normal text-muted-foreground", children: [
983
+ "\xB7 ",
984
+ selectedOption.meta
985
+ ] })
986
+ ] }) : /* @__PURE__ */ jsx("span", { className: "flex-1 truncate text-muted-foreground", children: placeholder }),
987
+ /* @__PURE__ */ jsx(
988
+ ChevronDown,
989
+ {
990
+ className: cn(
991
+ "absolute right-3 h-4 w-4 text-muted-foreground transition-transform",
992
+ open && "rotate-180 text-primary-700"
993
+ ),
994
+ "aria-hidden": true
995
+ }
996
+ )
997
+ ]
998
+ }
999
+ ),
1000
+ open && !disabled && /* @__PURE__ */ jsxs("div", { role: "listbox", className: dropdownClass, children: [
1001
+ isSearchable && /* @__PURE__ */ jsx("div", { className: "sticky top-[-4px] z-10 -mx-1 mb-1 border-b border-border bg-popover px-2 py-1.5", children: /* @__PURE__ */ jsx(
1002
+ "input",
1003
+ {
1004
+ type: "text",
1005
+ autoFocus: true,
1006
+ value: search,
1007
+ onChange: (e) => {
1008
+ setSearch(e.target.value);
1009
+ setActiveIndex(0);
1010
+ },
1011
+ className: "w-full rounded-sm border border-transparent bg-muted px-2.5 py-1.5 text-[13.5px] outline-none focus:border-primary-500 focus:bg-background",
1012
+ placeholder: "Buscar..."
1013
+ }
1014
+ ) }),
1015
+ isEmpty ? /* @__PURE__ */ jsx(EmptyState, {}) : /* @__PURE__ */ jsx("ul", { children: filteredOptions.map((option, idx) => /* @__PURE__ */ jsx(
1016
+ OptionItem,
1017
+ {
1018
+ option,
1019
+ isActive: option.value === value,
1020
+ isHighlighted: idx === activeIndex,
1021
+ onMouseEnter: () => setActiveIndex(idx),
1022
+ onClick: () => commitSelection(option)
1023
+ },
1024
+ String(option.value)
1025
+ )) })
1026
+ ] })
1027
+ ]
1028
+ }
1029
+ ),
1030
+ errorMessage && /* @__PURE__ */ jsx("p", { className: cn("mt-1 text-xs", messageColor[effectiveStatus]), children: errorMessage })
1031
+ ]
1032
+ }
1033
+ );
1034
+ }
1035
+ var Select = forwardRef(SelectInner);
1036
+ var Separator2 = React5.forwardRef(
1037
+ ({ orientation = "horizontal", text, className }, ref) => {
1038
+ if (text && orientation === "horizontal") {
1039
+ return /* @__PURE__ */ jsxs("div", { ref, className: cn("relative flex items-center w-full my-2", className), children: [
1040
+ /* @__PURE__ */ jsx(Separator, { orientation: "horizontal", className: "flex-1" }),
1041
+ /* @__PURE__ */ jsx("span", { className: "px-3 text-xs text-muted-foreground uppercase tracking-wider bg-background", children: text }),
1042
+ /* @__PURE__ */ jsx(Separator, { orientation: "horizontal", className: "flex-1" })
1043
+ ] });
1044
+ }
1045
+ return /* @__PURE__ */ jsx(
1046
+ Separator,
1047
+ {
1048
+ ref,
1049
+ orientation,
1050
+ className: cn(orientation === "vertical" ? "mx-2 h-4 inline-block" : "", className)
1051
+ }
1052
+ );
1053
+ }
1054
+ );
1055
+ Separator2.displayName = "Separator";
1056
+ function roundedClass(r) {
1057
+ if (r === "sm") return "rounded-sm";
1058
+ if (r === "full") return "rounded-full";
1059
+ return "rounded-md";
1060
+ }
1061
+ function toCss(v) {
1062
+ if (typeof v === "number") return `${v}px`;
1063
+ return v;
1064
+ }
1065
+ var Skeleton2 = React5.forwardRef(
1066
+ ({ width, height, rounded = "md", lines, className }, ref) => {
1067
+ if (lines && lines > 1) {
1068
+ return /* @__PURE__ */ jsx("div", { ref, className: cn("flex flex-col gap-2", className), children: Array.from({ length: lines }).map((_, i) => /* @__PURE__ */ jsx(
1069
+ Skeleton,
1070
+ {
1071
+ className: cn(roundedClass(rounded), "h-3"),
1072
+ style: {
1073
+ width: i === lines - 1 ? "60%" : toCss(width) ?? "100%"
1074
+ }
1075
+ },
1076
+ i
1077
+ )) });
1078
+ }
1079
+ return /* @__PURE__ */ jsx(
1080
+ Skeleton,
1081
+ {
1082
+ ref,
1083
+ className: cn(roundedClass(rounded), className),
1084
+ style: { width: toCss(width), height: toCss(height) }
1085
+ }
1086
+ );
1087
+ }
1088
+ );
1089
+ Skeleton2.displayName = "Skeleton";
1090
+ var sliderRangeVariants = cva("absolute h-full", {
1091
+ variants: {
1092
+ color: {
1093
+ primary: "bg-primary",
1094
+ secondary: "bg-secondary",
1095
+ success: "bg-success",
1096
+ warning: "bg-warning",
1097
+ danger: "bg-destructive"
1098
+ }
1099
+ },
1100
+ defaultVariants: { color: "primary" }
1101
+ });
1102
+ var sliderThumbVariants = cva(
1103
+ "block h-3.5 w-3.5 rounded-full border-2 bg-background ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50",
1104
+ {
1105
+ variants: {
1106
+ color: {
1107
+ primary: "border-primary",
1108
+ secondary: "border-secondary",
1109
+ success: "border-success",
1110
+ warning: "border-warning",
1111
+ danger: "border-destructive"
1112
+ }
1113
+ },
1114
+ defaultVariants: { color: "primary" }
1115
+ }
1116
+ );
1117
+ function toArray(v) {
1118
+ if (v === void 0) return void 0;
1119
+ return Array.isArray(v) ? v : [v];
1120
+ }
1121
+ var Slider = React5.forwardRef(
1122
+ ({
1123
+ value,
1124
+ defaultValue,
1125
+ onChange,
1126
+ min = 0,
1127
+ max = 100,
1128
+ step = 1,
1129
+ color = "primary",
1130
+ disabled,
1131
+ showTooltip,
1132
+ className
1133
+ }, ref) => {
1134
+ const valueArr = toArray(value);
1135
+ const defaultArr = toArray(defaultValue);
1136
+ const [internal, setInternal] = React5.useState(defaultArr ?? [min]);
1137
+ const display = valueArr ?? internal;
1138
+ const handleChange = (next) => {
1139
+ if (valueArr === void 0) setInternal(next);
1140
+ if (!onChange) return;
1141
+ onChange(next.length === 1 ? next[0] : next);
1142
+ };
1143
+ return /* @__PURE__ */ jsxs(
1144
+ SliderPrimitive.Root,
1145
+ {
1146
+ ref,
1147
+ value: valueArr,
1148
+ defaultValue: defaultArr,
1149
+ onValueChange: handleChange,
1150
+ min,
1151
+ max,
1152
+ step,
1153
+ disabled,
1154
+ className: cn(
1155
+ "relative flex w-full touch-none select-none items-center",
1156
+ disabled && "opacity-50",
1157
+ className
1158
+ ),
1159
+ children: [
1160
+ /* @__PURE__ */ jsx(SliderPrimitive.Track, { className: "relative h-1 w-full grow overflow-hidden rounded-full bg-muted", children: /* @__PURE__ */ jsx(SliderPrimitive.Range, { className: sliderRangeVariants({ color }) }) }),
1161
+ display.map((v, i) => /* @__PURE__ */ jsx(SliderPrimitive.Thumb, { className: sliderThumbVariants({ color }), children: showTooltip && /* @__PURE__ */ jsx("span", { className: "absolute -top-7 left-1/2 -translate-x-1/2 rounded bg-default-900 text-default-50 px-1.5 py-0.5 text-xs whitespace-nowrap", children: v }) }, i))
1162
+ ]
1163
+ }
1164
+ );
1165
+ }
1166
+ );
1167
+ Slider.displayName = "Slider";
1168
+ var switchRootVariants = cva(
1169
+ "peer inline-flex shrink-0 cursor-pointer items-center rounded-full border-2 border-transparent transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background disabled:cursor-not-allowed disabled:opacity-50 data-[state=unchecked]:bg-default-200",
1170
+ {
1171
+ variants: {
1172
+ color: {
1173
+ primary: "data-[state=checked]:bg-primary",
1174
+ secondary: "data-[state=checked]:bg-secondary",
1175
+ success: "data-[state=checked]:bg-success",
1176
+ warning: "data-[state=checked]:bg-warning",
1177
+ danger: "data-[state=checked]:bg-destructive"
1178
+ },
1179
+ size: {
1180
+ sm: "h-5 w-9",
1181
+ md: "h-6 w-11",
1182
+ lg: "h-7 w-14"
1183
+ }
1184
+ },
1185
+ defaultVariants: { color: "primary", size: "md" }
1186
+ }
1187
+ );
1188
+ var switchThumbVariants = cva(
1189
+ "pointer-events-none block rounded-full bg-background shadow-lg ring-0 transition-transform data-[state=unchecked]:translate-x-0",
1190
+ {
1191
+ variants: {
1192
+ size: {
1193
+ sm: "h-4 w-4 data-[state=checked]:translate-x-4",
1194
+ md: "h-5 w-5 data-[state=checked]:translate-x-5",
1195
+ lg: "h-6 w-6 data-[state=checked]:translate-x-7"
1196
+ }
1197
+ },
1198
+ defaultVariants: { size: "md" }
1199
+ }
1200
+ );
1201
+ var Switch = React5.forwardRef(
1202
+ ({
1203
+ checked,
1204
+ defaultChecked,
1205
+ onChange,
1206
+ color = "primary",
1207
+ size = "md",
1208
+ label,
1209
+ disabled,
1210
+ className,
1211
+ name,
1212
+ id
1213
+ }, ref) => {
1214
+ const control = /* @__PURE__ */ jsx(
1215
+ SwitchPrimitives.Root,
1216
+ {
1217
+ ref,
1218
+ id,
1219
+ name,
1220
+ checked,
1221
+ defaultChecked,
1222
+ onCheckedChange: onChange,
1223
+ disabled,
1224
+ className: cn(switchRootVariants({ color, size }), !label && className),
1225
+ children: /* @__PURE__ */ jsx(SwitchPrimitives.Thumb, { className: switchThumbVariants({ size }) })
1226
+ }
1227
+ );
1228
+ if (!label) return control;
1229
+ return /* @__PURE__ */ jsxs(
1230
+ "label",
1231
+ {
1232
+ className: cn(
1233
+ "inline-flex items-center gap-2 text-sm cursor-pointer select-none",
1234
+ disabled && "cursor-not-allowed opacity-60",
1235
+ className
1236
+ ),
1237
+ children: [
1238
+ control,
1239
+ /* @__PURE__ */ jsx("span", { children: label })
1240
+ ]
1241
+ }
1242
+ );
1243
+ }
1244
+ );
1245
+ Switch.displayName = "Switch";
1246
+ var variantMap = {
1247
+ default: "bg-default-100 text-foreground border-default-200",
1248
+ success: "bg-success-50 text-success-800 border-success-200",
1249
+ warning: "bg-warning-50 text-warning-800 border-warning-200",
1250
+ danger: "bg-danger-50 text-danger-800 border-danger-200"
1251
+ };
1252
+ var Tag = ({ icon, onClose, variant, children }) => {
1253
+ return /* @__PURE__ */ jsxs(
1254
+ Badge,
1255
+ {
1256
+ variant: "outline",
1257
+ className: cn("gap-2 px-3 py-1 text-sm rounded-md border", variantMap[variant]),
1258
+ children: [
1259
+ icon,
1260
+ children,
1261
+ onClose && /* @__PURE__ */ jsx(
1262
+ "button",
1263
+ {
1264
+ type: "button",
1265
+ onClick: onClose,
1266
+ className: "ml-1 inline-flex items-center justify-center rounded hover:bg-black/10",
1267
+ "aria-label": "close",
1268
+ children: /* @__PURE__ */ jsx(X, { className: "h-3 w-3" })
1269
+ }
1270
+ )
1271
+ ]
1272
+ }
1273
+ );
1274
+ };
1275
+ var sizeClasses3 = {
1276
+ small: "text-[13px] py-1.5 px-2.5",
1277
+ default: "text-sm py-2 px-3",
1278
+ large: "text-[15px] py-2.5 px-4"
1279
+ };
1280
+ var statusBorderClasses2 = {
1281
+ error: "border-destructive focus-visible:ring-destructive",
1282
+ success: "border-success-500 focus-visible:ring-success-500",
1283
+ warning: "border-warning-500 focus-visible:ring-warning-500",
1284
+ default: ""
1285
+ };
1286
+ var Textarea2 = forwardRef(function Textarea3({
1287
+ size = "default",
1288
+ allowClear = false,
1289
+ status = "default",
1290
+ autoSize = false,
1291
+ disabled,
1292
+ className,
1293
+ name,
1294
+ touched,
1295
+ error,
1296
+ externalLabel,
1297
+ help,
1298
+ errorMessage,
1299
+ onChange,
1300
+ value,
1301
+ defaultValue,
1302
+ rows = 3,
1303
+ ...rest
1304
+ }, ref) {
1305
+ const [internalValue, setInternalValue] = useState(defaultValue ?? "");
1306
+ const isControlled = value !== void 0;
1307
+ const currentValue = isControlled ? value : internalValue;
1308
+ const innerRef = useRef(null);
1309
+ const setRefs = useCallback(
1310
+ (node) => {
1311
+ innerRef.current = node;
1312
+ if (typeof ref === "function") ref(node);
1313
+ else if (ref) ref.current = node;
1314
+ },
1315
+ [ref]
1316
+ );
1317
+ useEffect(() => {
1318
+ if (autoSize && innerRef.current) {
1319
+ innerRef.current.style.height = "auto";
1320
+ innerRef.current.style.height = `${innerRef.current.scrollHeight}px`;
1321
+ }
1322
+ }, [currentValue, autoSize]);
1323
+ const showClearButton = allowClear && !disabled && Boolean(currentValue);
1324
+ const messageColor2 = status === "error" ? "text-destructive" : status === "warning" ? "text-warning-700" : "";
1325
+ const handleChange = (e) => {
1326
+ if (!isControlled) setInternalValue(e.target.value);
1327
+ onChange?.(e);
1328
+ };
1329
+ const handleClear = () => {
1330
+ if (!isControlled) setInternalValue("");
1331
+ onChange?.({ target: { value: "" } });
1332
+ innerRef.current?.focus();
1333
+ };
1334
+ return /* @__PURE__ */ jsxs(
1335
+ FormItem,
1336
+ {
1337
+ help: touched || error ? help : "",
1338
+ validateStatus: touched && error ? "error" : "default",
1339
+ label: externalLabel,
1340
+ children: [
1341
+ /* @__PURE__ */ jsxs("div", { className: cn("relative w-full", className), children: [
1342
+ /* @__PURE__ */ jsx(
1343
+ Textarea,
1344
+ {
1345
+ ref: setRefs,
1346
+ name,
1347
+ disabled,
1348
+ rows,
1349
+ value: currentValue,
1350
+ onChange: handleChange,
1351
+ "aria-invalid": status === "error" || touched && Boolean(error) || void 0,
1352
+ className: cn(
1353
+ sizeClasses3[size],
1354
+ statusBorderClasses2[status],
1355
+ autoSize && "resize-none overflow-hidden",
1356
+ showClearButton && "pr-9"
1357
+ ),
1358
+ ...rest
1359
+ }
1360
+ ),
1361
+ showClearButton && /* @__PURE__ */ jsx(
1362
+ "button",
1363
+ {
1364
+ type: "button",
1365
+ onClick: handleClear,
1366
+ "aria-label": "Limpiar",
1367
+ className: "absolute right-2 top-2 inline-flex items-center justify-center text-muted-foreground hover:text-foreground",
1368
+ children: /* @__PURE__ */ jsx(X, { className: "h-3.5 w-3.5" })
1369
+ }
1370
+ )
1371
+ ] }),
1372
+ errorMessage && /* @__PURE__ */ jsx(
1373
+ "p",
1374
+ {
1375
+ className: cn("mt-1 text-xs", messageColor2),
1376
+ role: status === "error" ? "alert" : void 0,
1377
+ children: errorMessage
1378
+ }
1379
+ )
1380
+ ]
1381
+ }
1382
+ );
1383
+ });
1384
+ function mapSize(size) {
1385
+ if (size === "sm") return "sm";
1386
+ if (size === "lg") return "lg";
1387
+ return "default";
1388
+ }
1389
+ var Toggle = React5.forwardRef(
1390
+ ({
1391
+ pressed,
1392
+ defaultPressed,
1393
+ onChange,
1394
+ variant = "default",
1395
+ size = "md",
1396
+ disabled,
1397
+ className,
1398
+ children,
1399
+ ...rest
1400
+ }, ref) => /* @__PURE__ */ jsx(
1401
+ TogglePrimitive.Root,
1402
+ {
1403
+ ref,
1404
+ pressed,
1405
+ defaultPressed,
1406
+ onPressedChange: onChange,
1407
+ disabled,
1408
+ className: cn(toggleVariants({ variant, size: mapSize(size) }), className),
1409
+ ...rest,
1410
+ children
1411
+ }
1412
+ )
1413
+ );
1414
+ Toggle.displayName = "Toggle";
1415
+ function mapSize2(size) {
1416
+ if (size === "sm") return "sm";
1417
+ if (size === "lg") return "lg";
1418
+ return "default";
1419
+ }
1420
+ var ToggleGroup2 = React5.forwardRef((props, ref) => {
1421
+ const { options, variant = "default", size = "md", disabled, className } = props;
1422
+ const sharedItems = options.map((opt) => /* @__PURE__ */ jsx(ToggleGroupItem, { value: opt.value, disabled: opt.disabled || disabled, children: opt.label }, opt.value));
1423
+ if (props.type === "single") {
1424
+ return /* @__PURE__ */ jsx(
1425
+ ToggleGroup,
1426
+ {
1427
+ ref,
1428
+ type: "single",
1429
+ value: props.value,
1430
+ defaultValue: props.defaultValue,
1431
+ onValueChange: (v) => props.onChange?.(v),
1432
+ variant,
1433
+ size: mapSize2(size),
1434
+ disabled,
1435
+ className: cn(className),
1436
+ children: sharedItems
1437
+ }
1438
+ );
1439
+ }
1440
+ return /* @__PURE__ */ jsx(
1441
+ ToggleGroup,
1442
+ {
1443
+ ref,
1444
+ type: "multiple",
1445
+ value: props.value,
1446
+ defaultValue: props.defaultValue,
1447
+ onValueChange: (v) => props.onChange?.(v),
1448
+ variant,
1449
+ size: mapSize2(size),
1450
+ disabled,
1451
+ className: cn(className),
1452
+ children: sharedItems
1453
+ }
1454
+ );
1455
+ });
1456
+ ToggleGroup2.displayName = "ToggleGroup";
1457
+
1458
+ export { Avatar2 as Avatar, Checkbox2 as Checkbox, Descriptions, Input2 as Input, InputNumber, MultiSelect, Progress, Radio, Rate, Select, Separator2 as Separator, Skeleton2 as Skeleton, Slider, Switch, Tag, Textarea2 as Textarea, Toggle, ToggleGroup2 as ToggleGroup };
1459
+ //# sourceMappingURL=chunk-X43C5OJD.js.map
1460
+ //# sourceMappingURL=chunk-X43C5OJD.js.map