@bricks-toolkit/toolkit 0.1.19 → 0.1.21

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 (100) hide show
  1. package/dist/chunk-4PRNRENN.mjs +104 -0
  2. package/dist/chunk-62JXQJBD.cjs +533 -0
  3. package/dist/chunk-6LBTRQZD.mjs +806 -0
  4. package/dist/chunk-J53N2LAE.cjs +115 -0
  5. package/dist/chunk-M6XPQ5BE.cjs +808 -0
  6. package/dist/chunk-UPSMZISM.mjs +567 -0
  7. package/dist/chunk-YV3WWKQY.cjs +569 -0
  8. package/dist/chunk-Z5FRCULF.mjs +531 -0
  9. package/dist/date-picker/index.cjs +3 -2
  10. package/dist/date-picker/index.mjs +2 -1
  11. package/dist/date-time-picker/index.cjs +12 -0
  12. package/dist/date-time-picker/index.mjs +3 -0
  13. package/dist/index.cjs +27 -21
  14. package/dist/index.mjs +7 -5
  15. package/dist/time-picker/index.cjs +2 -2
  16. package/dist/time-picker/index.mjs +1 -1
  17. package/package.json +11 -1
  18. package/dist/Button.types-BsQYqZml.d.ts +0 -27
  19. package/dist/Button.types-D-srlWFf.d.mts +0 -27
  20. package/dist/TextInput.types-DRI8HQza.d.mts +0 -32
  21. package/dist/TextInput.types-DRI8HQza.d.ts +0 -32
  22. package/dist/Tooltip.types-PbUasE3C.d.mts +0 -36
  23. package/dist/Tooltip.types-PbUasE3C.d.ts +0 -36
  24. package/dist/avatar/index.d.mts +0 -29
  25. package/dist/avatar/index.d.ts +0 -29
  26. package/dist/badge/index.d.mts +0 -57
  27. package/dist/badge/index.d.ts +0 -57
  28. package/dist/breadcrumbs/index.d.mts +0 -32
  29. package/dist/breadcrumbs/index.d.ts +0 -32
  30. package/dist/button/index.d.mts +0 -8
  31. package/dist/button/index.d.ts +0 -8
  32. package/dist/card/index.d.mts +0 -42
  33. package/dist/card/index.d.ts +0 -42
  34. package/dist/checkbox/index.d.mts +0 -36
  35. package/dist/checkbox/index.d.ts +0 -36
  36. package/dist/chunk-7WNJ7L4Z.mjs +0 -335
  37. package/dist/chunk-DHC5LI2P.cjs +0 -338
  38. package/dist/chunk-VKQDW7C2.mjs +0 -336
  39. package/dist/chunk-W2ZAPLQH.cjs +0 -337
  40. package/dist/combo-box/index.d.mts +0 -62
  41. package/dist/combo-box/index.d.ts +0 -62
  42. package/dist/date-picker/index.d.mts +0 -32
  43. package/dist/date-picker/index.d.ts +0 -32
  44. package/dist/dialog/index.d.mts +0 -61
  45. package/dist/dialog/index.d.ts +0 -61
  46. package/dist/dropdown-menu/index.d.mts +0 -34
  47. package/dist/dropdown-menu/index.d.ts +0 -34
  48. package/dist/email/index.d.mts +0 -38
  49. package/dist/email/index.d.ts +0 -38
  50. package/dist/file-upload/index.d.mts +0 -27
  51. package/dist/file-upload/index.d.ts +0 -27
  52. package/dist/header/index.d.mts +0 -28
  53. package/dist/header/index.d.ts +0 -28
  54. package/dist/icon-button/index.d.mts +0 -16
  55. package/dist/icon-button/index.d.ts +0 -16
  56. package/dist/image/index.d.mts +0 -48
  57. package/dist/image/index.d.ts +0 -48
  58. package/dist/index.d.mts +0 -141
  59. package/dist/index.d.ts +0 -141
  60. package/dist/link/index.d.mts +0 -25
  61. package/dist/link/index.d.ts +0 -25
  62. package/dist/loader/index.d.mts +0 -21
  63. package/dist/loader/index.d.ts +0 -21
  64. package/dist/modal/index.d.mts +0 -116
  65. package/dist/modal/index.d.ts +0 -116
  66. package/dist/multi-select/index.d.mts +0 -59
  67. package/dist/multi-select/index.d.ts +0 -59
  68. package/dist/otp-input/index.d.mts +0 -57
  69. package/dist/otp-input/index.d.ts +0 -57
  70. package/dist/password-input/index.d.mts +0 -32
  71. package/dist/password-input/index.d.ts +0 -32
  72. package/dist/phone/index.d.mts +0 -41
  73. package/dist/phone/index.d.ts +0 -41
  74. package/dist/radio-button/index.d.mts +0 -56
  75. package/dist/radio-button/index.d.ts +0 -56
  76. package/dist/search-input/index.d.mts +0 -22
  77. package/dist/search-input/index.d.ts +0 -22
  78. package/dist/select/index.d.mts +0 -36
  79. package/dist/select/index.d.ts +0 -36
  80. package/dist/sidebar/index.d.mts +0 -96
  81. package/dist/sidebar/index.d.ts +0 -96
  82. package/dist/skeleton/index.d.mts +0 -76
  83. package/dist/skeleton/index.d.ts +0 -76
  84. package/dist/styles.d.mts +0 -2
  85. package/dist/styles.d.ts +0 -2
  86. package/dist/table/index.d.mts +0 -92
  87. package/dist/table/index.d.ts +0 -92
  88. package/dist/tabs/index.d.mts +0 -26
  89. package/dist/tabs/index.d.ts +0 -26
  90. package/dist/text-input/index.d.mts +0 -7
  91. package/dist/text-input/index.d.ts +0 -7
  92. package/dist/theme-provider/index.d.mts +0 -122
  93. package/dist/theme-provider/index.d.ts +0 -122
  94. package/dist/theme.css +0 -62
  95. package/dist/time-picker/index.d.mts +0 -32
  96. package/dist/time-picker/index.d.ts +0 -32
  97. package/dist/toaster/index.d.mts +0 -28
  98. package/dist/toaster/index.d.ts +0 -28
  99. package/dist/tooltip/index.d.mts +0 -7
  100. package/dist/tooltip/index.d.ts +0 -7
@@ -0,0 +1,531 @@
1
+ import { cn } from './chunk-OCPFOFJ4.mjs';
2
+ import { forwardRef, useId, useState, useEffect, useCallback, useRef } from 'react';
3
+ import { ClockIcon, XMarkIcon, ChevronUpIcon, ChevronDownIcon } from '@heroicons/react/24/outline';
4
+ import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
5
+
6
+ function parseTime(value) {
7
+ if (!value) return { hours: 0, minutes: 0 };
8
+ const numbers = value.split(":").map(Number);
9
+ const h = numbers[0];
10
+ const m = numbers[1];
11
+ return {
12
+ hours: h === void 0 || isNaN(h) ? 0 : h,
13
+ minutes: m === void 0 || isNaN(m) ? 0 : m
14
+ };
15
+ }
16
+ function toTimeString(hours, minutes) {
17
+ return `${String(hours).padStart(2, "0")}:${String(minutes).padStart(2, "0")}`;
18
+ }
19
+ function formatDisplay(value, use12Hour) {
20
+ if (!value) return "";
21
+ const { hours, minutes } = parseTime(value);
22
+ if (use12Hour) {
23
+ const ampm = hours >= 12 ? "PM" : "AM";
24
+ const h = hours % 12 || 12;
25
+ return `${String(h).padStart(2, "0")}:${String(minutes).padStart(2, "0")} ${ampm}`;
26
+ }
27
+ return toTimeString(hours, minutes);
28
+ }
29
+ var ITEM_HEIGHT = 36;
30
+ var sizeClasses = {
31
+ xs: "h-6 px-2 text-xs",
32
+ sm: "h-8 px-3 text-sm",
33
+ md: "h-10 px-3 text-sm",
34
+ lg: "h-11 px-4 text-base",
35
+ xl: "h-12 px-4 text-lg"
36
+ };
37
+ var labelSizeClasses = {
38
+ xs: "text-xs",
39
+ sm: "text-xs",
40
+ md: "text-sm",
41
+ lg: "text-sm",
42
+ xl: "text-base"
43
+ };
44
+ var variantClasses = {
45
+ default: "rounded-md border border-border bg-surface shadow-sm focus-within:outline-none focus-within:ring-2 focus-within:ring-primary/40 transition-all duration-200",
46
+ filled: "rounded-md border border-transparent bg-surface-secondary focus-within:bg-surface focus-within:ring-2 focus-within:ring-primary/40 transition-all duration-200",
47
+ flushed: "rounded-none border-0 border-b border-border bg-transparent",
48
+ unstyled: "border-0 bg-transparent p-0"
49
+ };
50
+ var stateVariantClasses = {
51
+ default: {
52
+ default: "border-border focus-within:border-primary",
53
+ filled: "focus-within:border-primary",
54
+ flushed: "border-border focus-within:border-primary",
55
+ unstyled: ""
56
+ },
57
+ error: {
58
+ default: "border-error focus-within:border-error focus-within:ring-error/20",
59
+ filled: "bg-error/5 focus-within:border-error focus-within:ring-error/20",
60
+ flushed: "border-error",
61
+ unstyled: ""
62
+ },
63
+ success: {
64
+ default: "border-success focus-within:border-success focus-within:ring-success/20",
65
+ filled: "bg-success/5 focus-within:border-success focus-within:ring-success/20",
66
+ flushed: "border-success",
67
+ unstyled: ""
68
+ },
69
+ warning: {
70
+ default: "border-warning focus-within:border-warning focus-within:ring-warning/20",
71
+ filled: "bg-warning/5 focus-within:border-warning focus-within:ring-warning/20",
72
+ flushed: "border-warning",
73
+ unstyled: ""
74
+ }
75
+ };
76
+ var stateMessageClasses = {
77
+ default: "text-text-muted",
78
+ error: "text-error font-medium",
79
+ success: "text-success font-medium",
80
+ warning: "text-warning font-medium"
81
+ };
82
+ function ScrollColumn({ items, selected, onSelect, label }) {
83
+ const listRef = useRef(null);
84
+ const scrollToSelected = useCallback(
85
+ (behavior = "smooth") => {
86
+ if (!listRef.current) return;
87
+ const idx = items.indexOf(selected);
88
+ if (idx < 0) return;
89
+ const top = idx * ITEM_HEIGHT - ITEM_HEIGHT * 2;
90
+ if (typeof listRef.current.scrollTo === "function") {
91
+ listRef.current.scrollTo({ top: Math.max(0, top), behavior });
92
+ }
93
+ },
94
+ [items, selected]
95
+ );
96
+ useEffect(() => {
97
+ scrollToSelected("instant");
98
+ }, []);
99
+ useEffect(() => {
100
+ scrollToSelected("smooth");
101
+ }, [scrollToSelected]);
102
+ const step = (dir) => {
103
+ const idx = items.indexOf(selected);
104
+ const next = items[(idx + dir + items.length) % items.length];
105
+ if (next) onSelect(next);
106
+ };
107
+ return /* @__PURE__ */ jsxs("div", { className: "flex flex-col items-center gap-0.5", "aria-label": label, role: "group", children: [
108
+ /* @__PURE__ */ jsx(
109
+ "button",
110
+ {
111
+ type: "button",
112
+ onClick: () => {
113
+ step(-1);
114
+ },
115
+ className: "p-1 rounded hover:bg-hover text-text-secondary hover:text-text transition-colors",
116
+ "aria-label": `Decrease ${label}`,
117
+ children: /* @__PURE__ */ jsx(ChevronUpIcon, { className: "w-4 h-4" })
118
+ }
119
+ ),
120
+ /* @__PURE__ */ jsxs("div", { className: "relative", children: [
121
+ /* @__PURE__ */ jsx(
122
+ "div",
123
+ {
124
+ className: "absolute inset-x-0 rounded-lg bg-primary/10 border-y border-primary/20 pointer-events-none",
125
+ style: { top: ITEM_HEIGHT * 2, height: ITEM_HEIGHT }
126
+ }
127
+ ),
128
+ /* @__PURE__ */ jsxs(
129
+ "div",
130
+ {
131
+ ref: listRef,
132
+ className: "overflow-y-auto scrollbar-none",
133
+ style: { height: ITEM_HEIGHT * 5, width: 56 },
134
+ children: [
135
+ /* @__PURE__ */ jsx("div", { style: { height: ITEM_HEIGHT * 2 } }),
136
+ items.map((item) => /* @__PURE__ */ jsx(
137
+ "button",
138
+ {
139
+ type: "button",
140
+ onClick: () => {
141
+ onSelect(item);
142
+ },
143
+ className: cn(
144
+ "w-full flex items-center justify-center rounded-lg text-sm font-medium transition-colors duration-150",
145
+ "hover:bg-hover",
146
+ selected === item ? "text-primary font-bold" : "text-text-secondary"
147
+ ),
148
+ style: { height: ITEM_HEIGHT },
149
+ "aria-pressed": selected === item,
150
+ "aria-label": `${label} ${item}`,
151
+ children: item
152
+ },
153
+ item
154
+ )),
155
+ /* @__PURE__ */ jsx("div", { style: { height: ITEM_HEIGHT * 2 } })
156
+ ]
157
+ }
158
+ )
159
+ ] }),
160
+ /* @__PURE__ */ jsx(
161
+ "button",
162
+ {
163
+ type: "button",
164
+ onClick: () => {
165
+ step(1);
166
+ },
167
+ className: "p-1 rounded hover:bg-hover text-text-secondary hover:text-text transition-colors",
168
+ "aria-label": `Increase ${label}`,
169
+ children: /* @__PURE__ */ jsx(ChevronDownIcon, { className: "w-4 h-4" })
170
+ }
171
+ )
172
+ ] });
173
+ }
174
+ function AddonIcon({ children, side, size, onClick, asButton = false, ariaLabel }) {
175
+ const iconSize = {
176
+ xs: "w-3.5 h-3.5",
177
+ sm: "w-4 h-4",
178
+ md: "w-4 h-4",
179
+ lg: "w-5 h-5",
180
+ xl: "w-5 h-5"
181
+ };
182
+ const base = cn(
183
+ "absolute top-1/2 -translate-y-1/2 text-text-secondary flex items-center justify-center",
184
+ side === "left" ? "left-3" : "right-3",
185
+ iconSize[size]
186
+ );
187
+ if (asButton && onClick) {
188
+ return /* @__PURE__ */ jsx(
189
+ "button",
190
+ {
191
+ type: "button",
192
+ onClick,
193
+ className: cn(base, "cursor-pointer hover:text-text transition-colors"),
194
+ tabIndex: -1,
195
+ "aria-label": ariaLabel,
196
+ children
197
+ }
198
+ );
199
+ }
200
+ return /* @__PURE__ */ jsx(
201
+ "span",
202
+ {
203
+ "aria-hidden": !ariaLabel,
204
+ className: cn(base, "pointer-events-none"),
205
+ "aria-label": ariaLabel,
206
+ children
207
+ }
208
+ );
209
+ }
210
+ function Addon({ children, side }) {
211
+ return /* @__PURE__ */ jsx(
212
+ "span",
213
+ {
214
+ "aria-hidden": "true",
215
+ className: cn(
216
+ "inline-flex items-center border border-border bg-surface-secondary px-3 text-sm text-text-secondary select-none",
217
+ side === "left" ? "rounded-l-md border-r-0" : "rounded-r-md border-l-0"
218
+ ),
219
+ children
220
+ }
221
+ );
222
+ }
223
+ var TimePicker = forwardRef(
224
+ ({
225
+ label,
226
+ required = false,
227
+ helperText,
228
+ errorMessage,
229
+ successMessage,
230
+ warningMessage,
231
+ variant = "default",
232
+ size = "md",
233
+ state = "default",
234
+ fullWidth = true,
235
+ leftElement,
236
+ rightElement,
237
+ prefix,
238
+ suffix,
239
+ wrapperClassName,
240
+ inputGroupClassName,
241
+ inputClassName,
242
+ labelClassName,
243
+ helperClassName,
244
+ id: idProp,
245
+ disabled,
246
+ className,
247
+ clearable,
248
+ isLoading,
249
+ value,
250
+ defaultValue,
251
+ onChange,
252
+ onTimeChange,
253
+ placeholder = "Select time",
254
+ minuteStep = 1,
255
+ use12Hour = false,
256
+ name,
257
+ "aria-label": ariaLabel,
258
+ "aria-describedby": ariaDescribedby
259
+ }, ref) => {
260
+ const generatedId = useId();
261
+ const inputId = idProp ?? generatedId;
262
+ const helperId = `${inputId}-helper`;
263
+ const stateMessageId = `${inputId}-state`;
264
+ const popoverId = `${inputId}-popover`;
265
+ const isControlled = value !== void 0;
266
+ const [internalValue, setInternalValue] = useState(defaultValue ?? "");
267
+ const displayValue = isControlled ? value : internalValue;
268
+ const { hours: selHours, minutes: selMinutes } = parseTime(displayValue);
269
+ const selAmpm = selHours >= 12 ? "PM" : "AM";
270
+ const selHours12 = selHours % 12 || 12;
271
+ const pickerHour = String(use12Hour ? selHours12 : selHours).padStart(2, "0");
272
+ const pickerMinute = String(selMinutes).padStart(2, "0");
273
+ const pickerAmpm = selAmpm;
274
+ const [isOpen, setIsOpen] = useState(false);
275
+ useEffect(() => {
276
+ if (!isOpen) return;
277
+ function handleClick(e) {
278
+ const wrapper = ref?.current;
279
+ if (wrapper && !wrapper.contains(e.target)) {
280
+ setIsOpen(false);
281
+ }
282
+ }
283
+ document.addEventListener("mousedown", handleClick);
284
+ return () => {
285
+ document.removeEventListener("mousedown", handleClick);
286
+ };
287
+ }, [isOpen]);
288
+ const hourItems = use12Hour ? Array.from({ length: 12 }, (_, i) => String(i + 1).padStart(2, "0")) : Array.from({ length: 24 }, (_, i) => String(i).padStart(2, "0"));
289
+ const minuteItems = Array.from(
290
+ { length: Math.ceil(60 / minuteStep) },
291
+ (_, i) => String(i * minuteStep).padStart(2, "0")
292
+ );
293
+ const applyTime = useCallback(
294
+ (h, m, ap) => {
295
+ let hours24 = parseInt(h, 10);
296
+ if (use12Hour) {
297
+ if (ap === "AM" && hours24 === 12) hours24 = 0;
298
+ if (ap === "PM" && hours24 !== 12) hours24 += 12;
299
+ }
300
+ const iso = toTimeString(hours24, parseInt(m, 10));
301
+ if (!isControlled) setInternalValue(iso);
302
+ onChange?.(iso);
303
+ onTimeChange?.(iso);
304
+ },
305
+ [isControlled, onChange, onTimeChange, use12Hour]
306
+ );
307
+ const handleHourSelect = (h) => {
308
+ applyTime(h, pickerMinute, pickerAmpm);
309
+ };
310
+ const handleMinuteSelect = (m) => {
311
+ applyTime(pickerHour, m, pickerAmpm);
312
+ };
313
+ const handleAmpmSelect = (ap) => {
314
+ const a = ap;
315
+ applyTime(pickerHour, pickerMinute, a);
316
+ };
317
+ const handleClear = () => {
318
+ if (!isControlled) setInternalValue("");
319
+ onChange?.("");
320
+ onTimeChange?.(null);
321
+ };
322
+ const toggleOpen = () => {
323
+ if (disabled || isLoading) return;
324
+ setIsOpen((prev) => !prev);
325
+ };
326
+ const showClear = clearable && displayValue.length > 0 && !disabled && !isLoading;
327
+ const rightPad = {
328
+ xs: "pr-6",
329
+ sm: "pr-8",
330
+ md: "pr-9",
331
+ lg: "pr-10",
332
+ xl: "pr-11"
333
+ };
334
+ const stateMessage = state === "error" ? errorMessage : state === "success" ? successMessage : state === "warning" ? warningMessage : void 0;
335
+ const describedBy = [helperText ? helperId : null, stateMessage ? stateMessageId : null, ariaDescribedby ?? null].filter(Boolean).join(" ") || void 0;
336
+ return /* @__PURE__ */ jsxs(
337
+ "div",
338
+ {
339
+ ref,
340
+ className: cn(
341
+ "flex flex-col gap-1 relative",
342
+ fullWidth ? "w-full" : "w-fit",
343
+ wrapperClassName,
344
+ className
345
+ ),
346
+ children: [
347
+ label !== void 0 && /* @__PURE__ */ jsxs(
348
+ "label",
349
+ {
350
+ htmlFor: inputId,
351
+ className: cn(
352
+ "font-black leading-none text-text uppercase tracking-widest",
353
+ labelSizeClasses[size],
354
+ labelClassName
355
+ ),
356
+ children: [
357
+ label,
358
+ required && /* @__PURE__ */ jsx("span", { "aria-hidden": "true", className: "ml-1 text-error", children: "*" })
359
+ ]
360
+ }
361
+ ),
362
+ /* @__PURE__ */ jsxs(
363
+ "div",
364
+ {
365
+ className: cn("flex items-stretch", fullWidth ? "w-full" : "w-fit", inputGroupClassName),
366
+ children: [
367
+ prefix !== void 0 && /* @__PURE__ */ jsx(Addon, { side: "left", children: prefix }),
368
+ /* @__PURE__ */ jsxs("div", { className: "relative flex flex-1 items-center", children: [
369
+ /* @__PURE__ */ jsx(AddonIcon, { side: "left", size, children: leftElement ?? /* @__PURE__ */ jsx(ClockIcon, { className: "w-full h-full" }) }),
370
+ /* @__PURE__ */ jsx(
371
+ "button",
372
+ {
373
+ id: inputId,
374
+ type: "button",
375
+ role: "combobox",
376
+ "aria-expanded": isOpen,
377
+ "aria-haspopup": "dialog",
378
+ "aria-controls": popoverId,
379
+ "aria-label": ariaLabel ?? label ?? "Time picker",
380
+ "aria-describedby": describedBy,
381
+ "aria-required": required,
382
+ "aria-invalid": state === "error" ? true : void 0,
383
+ disabled: Boolean(disabled) || Boolean(isLoading),
384
+ onClick: toggleOpen,
385
+ name,
386
+ className: cn(
387
+ "w-full flex items-center text-left transition-colors duration-150 cursor-pointer",
388
+ "disabled:cursor-not-allowed disabled:opacity-50",
389
+ sizeClasses[size],
390
+ variantClasses[variant],
391
+ stateVariantClasses[state][variant],
392
+ "pl-9",
393
+ showClear || rightElement ? rightPad[size] : "",
394
+ prefix !== void 0 && suffix !== void 0 ? "rounded-none" : prefix !== void 0 ? "rounded-l-none" : suffix !== void 0 ? "rounded-r-none" : "",
395
+ inputClassName
396
+ ),
397
+ children: displayValue ? /* @__PURE__ */ jsx("span", { className: "text-text", children: formatDisplay(displayValue, use12Hour) }) : /* @__PURE__ */ jsx("span", { className: "text-text-muted", children: placeholder })
398
+ }
399
+ ),
400
+ isLoading ? /* @__PURE__ */ jsx(AddonIcon, { side: "right", size, children: /* @__PURE__ */ jsxs(
401
+ "svg",
402
+ {
403
+ className: "animate-spin h-full w-full text-text-muted",
404
+ xmlns: "http://www.w3.org/2000/svg",
405
+ fill: "none",
406
+ viewBox: "0 0 24 24",
407
+ children: [
408
+ /* @__PURE__ */ jsx(
409
+ "circle",
410
+ {
411
+ className: "opacity-25",
412
+ cx: "12",
413
+ cy: "12",
414
+ r: "10",
415
+ stroke: "currentColor",
416
+ strokeWidth: "4"
417
+ }
418
+ ),
419
+ /* @__PURE__ */ jsx(
420
+ "path",
421
+ {
422
+ className: "opacity-75",
423
+ fill: "currentColor",
424
+ d: "M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"
425
+ }
426
+ )
427
+ ]
428
+ }
429
+ ) }) : showClear ? /* @__PURE__ */ jsx(
430
+ AddonIcon,
431
+ {
432
+ side: "right",
433
+ size,
434
+ asButton: true,
435
+ onClick: handleClear,
436
+ ariaLabel: "Clear time",
437
+ children: /* @__PURE__ */ jsx(XMarkIcon, { className: "w-full h-full", strokeWidth: 2.5 })
438
+ }
439
+ ) : rightElement ? /* @__PURE__ */ jsx(AddonIcon, { side: "right", size, children: rightElement }) : null
440
+ ] }),
441
+ suffix !== void 0 && /* @__PURE__ */ jsx(Addon, { side: "right", children: suffix })
442
+ ]
443
+ }
444
+ ),
445
+ helperText !== void 0 && /* @__PURE__ */ jsx(
446
+ "p",
447
+ {
448
+ id: helperId,
449
+ className: cn("text-xs leading-tight text-text-muted font-medium", helperClassName),
450
+ children: helperText
451
+ }
452
+ ),
453
+ stateMessage !== void 0 && /* @__PURE__ */ jsx(
454
+ "p",
455
+ {
456
+ id: stateMessageId,
457
+ role: state === "error" ? "alert" : void 0,
458
+ className: cn(
459
+ "text-xs leading-tight mt-0.5 font-medium",
460
+ stateMessageClasses[state],
461
+ helperClassName
462
+ ),
463
+ children: stateMessage
464
+ }
465
+ ),
466
+ /* @__PURE__ */ jsx(
467
+ "div",
468
+ {
469
+ id: popoverId,
470
+ role: "dialog",
471
+ "aria-label": "Time picker",
472
+ "aria-modal": "true",
473
+ className: cn(
474
+ "absolute top-full left-0 z-50 mt-1",
475
+ "bg-surface border border-border rounded-xl shadow-xl",
476
+ "transition-all duration-200 origin-top",
477
+ isOpen ? "opacity-100 scale-100 pointer-events-auto" : "opacity-0 scale-95 pointer-events-none"
478
+ ),
479
+ children: /* @__PURE__ */ jsxs("div", { className: "p-4", children: [
480
+ /* @__PURE__ */ jsx("p", { className: "text-xs font-bold text-text-muted uppercase tracking-widest mb-3 text-center", children: "Select Time" }),
481
+ /* @__PURE__ */ jsxs("div", { className: "flex items-start gap-1", children: [
482
+ /* @__PURE__ */ jsx(
483
+ ScrollColumn,
484
+ {
485
+ items: hourItems,
486
+ selected: pickerHour,
487
+ onSelect: handleHourSelect,
488
+ label: "Hour"
489
+ }
490
+ ),
491
+ /* @__PURE__ */ jsx(
492
+ "div",
493
+ {
494
+ className: "flex items-center self-center pb-2 text-text-muted font-bold text-lg select-none",
495
+ style: { height: ITEM_HEIGHT },
496
+ children: ":"
497
+ }
498
+ ),
499
+ /* @__PURE__ */ jsx(
500
+ ScrollColumn,
501
+ {
502
+ items: minuteItems,
503
+ selected: pickerMinute,
504
+ onSelect: handleMinuteSelect,
505
+ label: "Minute"
506
+ }
507
+ ),
508
+ use12Hour && /* @__PURE__ */ jsxs(Fragment, { children: [
509
+ /* @__PURE__ */ jsx("div", { className: "w-px self-stretch bg-border mx-1" }),
510
+ /* @__PURE__ */ jsx(
511
+ ScrollColumn,
512
+ {
513
+ items: ["AM", "PM"],
514
+ selected: pickerAmpm,
515
+ onSelect: handleAmpmSelect,
516
+ label: "AM/PM"
517
+ }
518
+ )
519
+ ] })
520
+ ] }),
521
+ /* @__PURE__ */ jsx("div", { className: "mt-3 pt-3 border-t border-border text-center", children: /* @__PURE__ */ jsx("span", { className: "text-sm font-bold text-primary font-mono", children: displayValue ? formatDisplay(displayValue, use12Hour) : "\u2013\u2013:\u2013\u2013" }) })
522
+ ] })
523
+ }
524
+ )
525
+ ]
526
+ }
527
+ );
528
+ }
529
+ );
530
+
531
+ export { TimePicker };
@@ -1,11 +1,12 @@
1
1
  'use strict';
2
2
 
3
- var chunkW2ZAPLQH_cjs = require('../chunk-W2ZAPLQH.cjs');
3
+ var chunkYV3WWKQY_cjs = require('../chunk-YV3WWKQY.cjs');
4
+ require('../chunk-J53N2LAE.cjs');
4
5
  require('../chunk-L5VQZZVR.cjs');
5
6
 
6
7
 
7
8
 
8
9
  Object.defineProperty(exports, "DatePicker", {
9
10
  enumerable: true,
10
- get: function () { return chunkW2ZAPLQH_cjs.DatePicker; }
11
+ get: function () { return chunkYV3WWKQY_cjs.DatePicker; }
11
12
  });
@@ -1,2 +1,3 @@
1
- export { DatePicker } from '../chunk-7WNJ7L4Z.mjs';
1
+ export { DatePicker } from '../chunk-UPSMZISM.mjs';
2
+ import '../chunk-4PRNRENN.mjs';
2
3
  import '../chunk-OCPFOFJ4.mjs';
@@ -0,0 +1,12 @@
1
+ 'use strict';
2
+
3
+ var chunkM6XPQ5BE_cjs = require('../chunk-M6XPQ5BE.cjs');
4
+ require('../chunk-J53N2LAE.cjs');
5
+ require('../chunk-L5VQZZVR.cjs');
6
+
7
+
8
+
9
+ Object.defineProperty(exports, "DateTimePicker", {
10
+ enumerable: true,
11
+ get: function () { return chunkM6XPQ5BE_cjs.DateTimePicker; }
12
+ });
@@ -0,0 +1,3 @@
1
+ export { DateTimePicker } from '../chunk-6LBTRQZD.mjs';
2
+ import '../chunk-4PRNRENN.mjs';
3
+ import '../chunk-OCPFOFJ4.mjs';
package/dist/index.cjs CHANGED
@@ -4,14 +4,16 @@ var chunkPCYGJNEQ_cjs = require('./chunk-PCYGJNEQ.cjs');
4
4
  var chunk7DDDQ3RH_cjs = require('./chunk-7DDDQ3RH.cjs');
5
5
  var chunkLTG6YP5I_cjs = require('./chunk-LTG6YP5I.cjs');
6
6
  require('./chunk-NMJ5CVZH.cjs');
7
+ var chunkOEU5VG3D_cjs = require('./chunk-OEU5VG3D.cjs');
7
8
  var chunkY6AN7AWX_cjs = require('./chunk-Y6AN7AWX.cjs');
8
9
  var chunkXFNRKHHF_cjs = require('./chunk-XFNRKHHF.cjs');
9
- var chunkDHC5LI2P_cjs = require('./chunk-DHC5LI2P.cjs');
10
+ var chunk62JXQJBD_cjs = require('./chunk-62JXQJBD.cjs');
10
11
  var chunkYMMNWJT6_cjs = require('./chunk-YMMNWJT6.cjs');
11
12
  var chunkQ3IFXFFD_cjs = require('./chunk-Q3IFXFFD.cjs');
12
13
  var chunkYK7IS7JL_cjs = require('./chunk-YK7IS7JL.cjs');
13
- var chunkPJWELBN2_cjs = require('./chunk-PJWELBN2.cjs');
14
14
  var chunkTNGW5YHA_cjs = require('./chunk-TNGW5YHA.cjs');
15
+ var chunkPJWELBN2_cjs = require('./chunk-PJWELBN2.cjs');
16
+ var chunkMVUNJPGH_cjs = require('./chunk-MVUNJPGH.cjs');
15
17
  var chunkS7VEND5Z_cjs = require('./chunk-S7VEND5Z.cjs');
16
18
  var chunk56ILK7Y4_cjs = require('./chunk-56ILK7Y4.cjs');
17
19
  var chunkNRZIXK35_cjs = require('./chunk-NRZIXK35.cjs');
@@ -19,15 +21,15 @@ var chunk5RKET2JO_cjs = require('./chunk-5RKET2JO.cjs');
19
21
  var chunkBIKJK4L4_cjs = require('./chunk-BIKJK4L4.cjs');
20
22
  var chunkVRZFAKSV_cjs = require('./chunk-VRZFAKSV.cjs');
21
23
  var chunk7R5JRJ2W_cjs = require('./chunk-7R5JRJ2W.cjs');
22
- var chunkOEU5VG3D_cjs = require('./chunk-OEU5VG3D.cjs');
23
24
  var chunkKLBABQEJ_cjs = require('./chunk-KLBABQEJ.cjs');
24
- var chunkW2ZAPLQH_cjs = require('./chunk-W2ZAPLQH.cjs');
25
+ var chunkYV3WWKQY_cjs = require('./chunk-YV3WWKQY.cjs');
26
+ var chunkM6XPQ5BE_cjs = require('./chunk-M6XPQ5BE.cjs');
27
+ require('./chunk-J53N2LAE.cjs');
25
28
  var chunkOPOCCRJG_cjs = require('./chunk-OPOCCRJG.cjs');
26
29
  var chunkAJXVELXK_cjs = require('./chunk-AJXVELXK.cjs');
27
30
  var chunkVC7MOPU6_cjs = require('./chunk-VC7MOPU6.cjs');
28
31
  var chunk6R3OYBQ6_cjs = require('./chunk-6R3OYBQ6.cjs');
29
32
  var chunkBBVWG5GH_cjs = require('./chunk-BBVWG5GH.cjs');
30
- var chunkMVUNJPGH_cjs = require('./chunk-MVUNJPGH.cjs');
31
33
  var chunkHIWJDLIS_cjs = require('./chunk-HIWJDLIS.cjs');
32
34
  var chunk5J3OMAO4_cjs = require('./chunk-5J3OMAO4.cjs');
33
35
  var chunkNRCNRHXL_cjs = require('./chunk-NRCNRHXL.cjs');
@@ -631,6 +633,14 @@ Object.defineProperty(exports, "useTheme", {
631
633
  enumerable: true,
632
634
  get: function () { return chunkLTG6YP5I_cjs.useTheme; }
633
635
  });
636
+ Object.defineProperty(exports, "Pagination", {
637
+ enumerable: true,
638
+ get: function () { return chunkOEU5VG3D_cjs.Pagination; }
639
+ });
640
+ Object.defineProperty(exports, "Table", {
641
+ enumerable: true,
642
+ get: function () { return chunkOEU5VG3D_cjs.Table; }
643
+ });
634
644
  Object.defineProperty(exports, "Tabs", {
635
645
  enumerable: true,
636
646
  get: function () { return chunkY6AN7AWX_cjs.Tabs; }
@@ -641,7 +651,7 @@ Object.defineProperty(exports, "TextInput", {
641
651
  });
642
652
  Object.defineProperty(exports, "TimePicker", {
643
653
  enumerable: true,
644
- get: function () { return chunkDHC5LI2P_cjs.TimePicker; }
654
+ get: function () { return chunk62JXQJBD_cjs.TimePicker; }
645
655
  });
646
656
  Object.defineProperty(exports, "Toaster", {
647
657
  enumerable: true,
@@ -655,13 +665,17 @@ Object.defineProperty(exports, "Header", {
655
665
  enumerable: true,
656
666
  get: function () { return chunkYK7IS7JL_cjs.Header; }
657
667
  });
668
+ Object.defineProperty(exports, "IconButton", {
669
+ enumerable: true,
670
+ get: function () { return chunkTNGW5YHA_cjs.IconButton; }
671
+ });
658
672
  Object.defineProperty(exports, "Image", {
659
673
  enumerable: true,
660
674
  get: function () { return chunkPJWELBN2_cjs.Image; }
661
675
  });
662
- Object.defineProperty(exports, "IconButton", {
676
+ Object.defineProperty(exports, "Loader", {
663
677
  enumerable: true,
664
- get: function () { return chunkTNGW5YHA_cjs.IconButton; }
678
+ get: function () { return chunkMVUNJPGH_cjs.Loader; }
665
679
  });
666
680
  Object.defineProperty(exports, "Skeleton", {
667
681
  enumerable: true,
@@ -707,21 +721,17 @@ Object.defineProperty(exports, "Select", {
707
721
  enumerable: true,
708
722
  get: function () { return chunk7R5JRJ2W_cjs.Select; }
709
723
  });
710
- Object.defineProperty(exports, "Pagination", {
711
- enumerable: true,
712
- get: function () { return chunkOEU5VG3D_cjs.Pagination; }
713
- });
714
- Object.defineProperty(exports, "Table", {
715
- enumerable: true,
716
- get: function () { return chunkOEU5VG3D_cjs.Table; }
717
- });
718
724
  Object.defineProperty(exports, "ComboBox", {
719
725
  enumerable: true,
720
726
  get: function () { return chunkKLBABQEJ_cjs.ComboBox; }
721
727
  });
722
728
  Object.defineProperty(exports, "DatePicker", {
723
729
  enumerable: true,
724
- get: function () { return chunkW2ZAPLQH_cjs.DatePicker; }
730
+ get: function () { return chunkYV3WWKQY_cjs.DatePicker; }
731
+ });
732
+ Object.defineProperty(exports, "DateTimePicker", {
733
+ enumerable: true,
734
+ get: function () { return chunkM6XPQ5BE_cjs.DateTimePicker; }
725
735
  });
726
736
  Object.defineProperty(exports, "Dialog", {
727
737
  enumerable: true,
@@ -775,10 +785,6 @@ Object.defineProperty(exports, "Link", {
775
785
  enumerable: true,
776
786
  get: function () { return chunkBBVWG5GH_cjs.Link; }
777
787
  });
778
- Object.defineProperty(exports, "Loader", {
779
- enumerable: true,
780
- get: function () { return chunkMVUNJPGH_cjs.Loader; }
781
- });
782
788
  Object.defineProperty(exports, "Avatar", {
783
789
  enumerable: true,
784
790
  get: function () { return chunkHIWJDLIS_cjs.Avatar; }