asheeui 0.6.14 → 0.7.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 (184) hide show
  1. package/README.md +1 -14
  2. package/dist/AsheeUIProvider.js +22 -24
  3. package/dist/components/accordion/Accordion.js +79 -173
  4. package/dist/components/accordion/accordion-config.js +12 -13
  5. package/dist/components/accordion/accordion-styles.js +21 -24
  6. package/dist/components/autocomplete/Autocomplete.js +78 -136
  7. package/dist/components/autocomplete/autocomplete-config.js +7 -12
  8. package/dist/components/button/Button.d.ts +29 -1
  9. package/dist/components/button/Button.d.ts.map +1 -1
  10. package/dist/components/button/Button.js +47 -108
  11. package/dist/components/button/button-config.js +16 -17
  12. package/dist/components/button/button-styles.js +10 -11
  13. package/dist/components/card/Card.d.ts +36 -16
  14. package/dist/components/card/Card.d.ts.map +1 -1
  15. package/dist/components/card/Card.js +115 -205
  16. package/dist/components/card/card-config.js +24 -21
  17. package/dist/components/card/card-styles.js +19 -22
  18. package/dist/components/carousel/Carousel.js +123 -248
  19. package/dist/components/carousel/carousel-config.js +24 -25
  20. package/dist/components/carousel/carousel-styles.js +14 -16
  21. package/dist/components/chip/Chip.js +84 -191
  22. package/dist/components/chip/chip-config.js +13 -14
  23. package/dist/components/chip/chip-styles.js +22 -26
  24. package/dist/components/date-picker/Calendar.d.ts +3 -3
  25. package/dist/components/date-picker/Calendar.d.ts.map +1 -1
  26. package/dist/components/date-picker/Calendar.js +141 -222
  27. package/dist/components/date-picker/DatePicker.d.ts +5 -5
  28. package/dist/components/date-picker/DatePicker.d.ts.map +1 -1
  29. package/dist/components/date-picker/DatePicker.js +122 -220
  30. package/dist/components/date-picker/TimeSpinner.js +58 -82
  31. package/dist/components/date-picker/date-picker-config.d.ts +4 -4
  32. package/dist/components/date-picker/date-picker-config.d.ts.map +1 -1
  33. package/dist/components/date-picker/date-picker-config.js +10 -11
  34. package/dist/components/date-picker/date-picker-styles.js +44 -45
  35. package/dist/components/date-picker/date-picker.helpers.d.ts +4 -4
  36. package/dist/components/date-picker/date-picker.helpers.d.ts.map +1 -1
  37. package/dist/components/date-picker/date-picker.helpers.js +74 -102
  38. package/dist/components/drawer/Drawer.d.ts +26 -8
  39. package/dist/components/drawer/Drawer.d.ts.map +1 -1
  40. package/dist/components/drawer/Drawer.js +54 -131
  41. package/dist/components/drawer/drawer-config.js +14 -15
  42. package/dist/components/drawer/drawer-styles.js +38 -42
  43. package/dist/components/field/FieldShell.js +49 -56
  44. package/dist/components/field/field-config.js +17 -18
  45. package/dist/components/field/field-styles.js +8 -8
  46. package/dist/components/image/Image.d.ts +7 -7
  47. package/dist/components/image/Image.d.ts.map +1 -1
  48. package/dist/components/image/Image.js +65 -132
  49. package/dist/components/image/image-config.js +17 -18
  50. package/dist/components/image/image-styles.js +14 -15
  51. package/dist/components/input/Input.js +65 -150
  52. package/dist/components/input/PasswordInput.js +30 -49
  53. package/dist/components/input/input-config.js +7 -7
  54. package/dist/components/input/input-styles.js +9 -10
  55. package/dist/components/keyboard/KeyboardContext.js +10 -11
  56. package/dist/components/keyboard/KeyboardProvider.js +100 -181
  57. package/dist/components/keyboard/OnScreenKeyboard.d.ts.map +1 -1
  58. package/dist/components/keyboard/OnScreenKeyboard.js +159 -166
  59. package/dist/components/keyboard/keyboard-config.js +59 -57
  60. package/dist/components/keyboard/keyboard-styles.js +10 -11
  61. package/dist/components/keyboard/use-keyboard-field.js +29 -21
  62. package/dist/components/link/Link.js +47 -137
  63. package/dist/components/link/link-config.js +14 -15
  64. package/dist/components/link/link-styles.js +25 -29
  65. package/dist/components/marquee/Marquee.js +55 -144
  66. package/dist/components/marquee/marquee-config.js +18 -19
  67. package/dist/components/marquee/marquee-styles.js +13 -15
  68. package/dist/components/modal/Modal.d.ts +26 -10
  69. package/dist/components/modal/Modal.d.ts.map +1 -1
  70. package/dist/components/modal/Modal.js +56 -136
  71. package/dist/components/modal/modal-config.js +15 -16
  72. package/dist/components/modal/modal-styles.js +13 -14
  73. package/dist/components/multi-select/MultiSelect.d.ts +18 -2
  74. package/dist/components/multi-select/MultiSelect.d.ts.map +1 -1
  75. package/dist/components/multi-select/MultiSelect.js +149 -283
  76. package/dist/components/multi-select/multi-select-config.d.ts +23 -18
  77. package/dist/components/multi-select/multi-select-config.d.ts.map +1 -1
  78. package/dist/components/multi-select/multi-select-config.js +18 -21
  79. package/dist/components/multi-select/multi-select-styles.js +17 -20
  80. package/dist/components/radio/Radio.js +43 -80
  81. package/dist/components/radio/RadioGroup.js +57 -155
  82. package/dist/components/radio/radio-config.js +15 -16
  83. package/dist/components/radio/radio-context.js +6 -6
  84. package/dist/components/radio/radio-styles.js +55 -60
  85. package/dist/components/resizable-screen/ResizableScreen.js +87 -177
  86. package/dist/components/resizable-screen/resizable-screen-config.js +16 -17
  87. package/dist/components/select/Select.d.ts +3 -2
  88. package/dist/components/select/Select.d.ts.map +1 -1
  89. package/dist/components/select/Select.js +97 -195
  90. package/dist/components/select/select-config.js +8 -9
  91. package/dist/components/select/select-styles.js +5 -5
  92. package/dist/components/select-menu/SelectMenu.d.ts.map +1 -1
  93. package/dist/components/select-menu/SelectMenu.js +102 -196
  94. package/dist/components/select-menu/select-menu-config.js +12 -12
  95. package/dist/components/select-menu/use-select-floating.d.ts +11 -1
  96. package/dist/components/select-menu/use-select-floating.d.ts.map +1 -1
  97. package/dist/components/select-menu/use-select-floating.js +41 -48
  98. package/dist/components/sidebar/Sidebar.d.ts +43 -22
  99. package/dist/components/sidebar/Sidebar.d.ts.map +1 -1
  100. package/dist/components/sidebar/Sidebar.js +146 -331
  101. package/dist/components/sidebar/sidebar-config.d.ts +98 -31
  102. package/dist/components/sidebar/sidebar-config.d.ts.map +1 -1
  103. package/dist/components/sidebar/sidebar-config.js +47 -33
  104. package/dist/components/sidebar/sidebar-styles.js +27 -32
  105. package/dist/components/spinner/spinner-config.js +12 -13
  106. package/dist/components/spinner/spinner-styles.js +13 -14
  107. package/dist/components/spinner/spinner.js +39 -82
  108. package/dist/components/switch/Switch.js +62 -154
  109. package/dist/components/switch/switch-config.js +11 -12
  110. package/dist/components/switch/switch-styles.js +14 -16
  111. package/dist/components/table/Table.js +64 -186
  112. package/dist/components/table/table-config.js +17 -18
  113. package/dist/components/table/table-styles.js +48 -52
  114. package/dist/components/tabs/Tabs.d.ts +16 -8
  115. package/dist/components/tabs/Tabs.d.ts.map +1 -1
  116. package/dist/components/tabs/Tabs.js +93 -208
  117. package/dist/components/tabs/tabs-config.d.ts +42 -20
  118. package/dist/components/tabs/tabs-config.d.ts.map +1 -1
  119. package/dist/components/tabs/tabs-config.js +26 -18
  120. package/dist/components/tabs/tabs-styles.js +15 -17
  121. package/dist/components/textarea/Textarea.js +52 -138
  122. package/dist/components/textarea/textarea-config.js +10 -11
  123. package/dist/components/textarea/textarea-styles.js +9 -10
  124. package/dist/components/toast/ToastContext.js +22 -26
  125. package/dist/components/toast/ToastItem.js +82 -144
  126. package/dist/components/toast/ToastProvider.d.ts.map +1 -1
  127. package/dist/components/toast/ToastProvider.js +128 -190
  128. package/dist/components/toast/toast-config.js +23 -24
  129. package/dist/components/toast/toast-styles.js +50 -55
  130. package/dist/components/toast/use-pausable-timeout.js +17 -13
  131. package/dist/components/tooltip/Tooltip.d.ts +5 -0
  132. package/dist/components/tooltip/Tooltip.d.ts.map +1 -1
  133. package/dist/components/tooltip/Tooltip.js +68 -158
  134. package/dist/components/tooltip/tooltip-config.d.ts +25 -0
  135. package/dist/components/tooltip/tooltip-config.d.ts.map +1 -1
  136. package/dist/components/tooltip/tooltip-config.js +26 -22
  137. package/dist/components/tooltip/tooltip-styles.js +15 -17
  138. package/dist/config/default-config.js +11 -34
  139. package/dist/config/resolve-color.js +23 -23
  140. package/dist/config/resolve-config.d.ts.map +1 -1
  141. package/dist/config/resolve-config.js +14 -12
  142. package/dist/icons/ArrowLeftIcon.js +16 -19
  143. package/dist/icons/CalendarIcon.js +43 -24
  144. package/dist/icons/CheckIcon.js +16 -19
  145. package/dist/icons/ChevronDownIcon.js +15 -21
  146. package/dist/icons/ChevronLeftIcon.js +16 -19
  147. package/dist/icons/ChevronRightIcon.js +16 -19
  148. package/dist/icons/ChevronUpIcon.js +16 -19
  149. package/dist/icons/ClearIcon.js +26 -22
  150. package/dist/icons/ClockIcon.js +20 -22
  151. package/dist/icons/CloseIcon.js +26 -22
  152. package/dist/icons/ErrorIcon.js +16 -19
  153. package/dist/icons/ExternalLinkIcon.js +25 -23
  154. package/dist/icons/EyeIcon.js +20 -22
  155. package/dist/icons/EyeOffIcon.js +21 -22
  156. package/dist/icons/InfoIcon.js +16 -19
  157. package/dist/icons/SearchIcon.js +25 -22
  158. package/dist/icons/WarningIcon.js +16 -19
  159. package/dist/index.js +65 -163
  160. package/dist/libs/context.js +10 -13
  161. package/dist/libs/index.js +1 -0
  162. package/dist/libs/registry.js +10 -12
  163. package/dist/libs/use-floating-z-index.d.ts +32 -0
  164. package/dist/libs/use-floating-z-index.d.ts.map +1 -0
  165. package/dist/libs/use-floating-z-index.js +16 -0
  166. package/dist/libs/use-isomorphic-layout-effect.js +5 -5
  167. package/dist/scripts/AsheeThemeScript.js +35 -44
  168. package/dist/shared/radius.d.ts.map +1 -1
  169. package/dist/shared/radius.js +12 -13
  170. package/dist/shared/variant.js +46 -134
  171. package/dist/theme/color.js +28 -28
  172. package/dist/theme/controller.d.ts.map +1 -1
  173. package/dist/theme/controller.js +65 -178
  174. package/dist/theme/useTheme.js +13 -44
  175. package/dist/utils/cn.js +7 -7
  176. package/dist/utils/index.d.ts +1 -0
  177. package/dist/utils/index.d.ts.map +1 -1
  178. package/dist/utils/index.js +1 -0
  179. package/dist/utils/merge-object.js +13 -14
  180. package/dist/utils/resolve-token.js +11 -14
  181. package/dist/utils/stacking.d.ts +76 -0
  182. package/dist/utils/stacking.d.ts.map +1 -0
  183. package/dist/utils/stacking.js +34 -0
  184. package/package.json +12 -11
@@ -1,221 +1,123 @@
1
1
  "use client";
2
- import { jsx as r, jsxs as B, Fragment as fo } from "react/jsx-runtime";
3
- import { FloatingFocusManager as yo, FloatingPortal as po } from "@floating-ui/react";
4
- import { forwardRef as vo, useId as bo, useState as G, useRef as So, useEffect as U, useCallback as f } from "react";
5
- import { CalendarIcon as wo } from "../../icons/CalendarIcon.js";
6
- import { ClearIcon as Io } from "../../icons/ClearIcon.js";
7
- import { ClockIcon as Po } from "../../icons/ClockIcon.js";
8
- import { useAsheeConfig as Ro } from "../../libs/context.js";
9
- import { resolveCascade as c, resolveRadiusKey as Fo, resolveClassKey as xo } from "../../utils/resolve-token.js";
10
- import { Input as go } from "../input/Input.js";
11
- import { Calendar as No } from "./Calendar.js";
12
- import { formatDisplay as b, parseDateString as ho, getNewCursorPosition as Ao, getDefaultPlaceholder as Do } from "./date-picker.helpers.js";
13
- import { FALLBACK_DATE_PICKER_CONFIG as y } from "./date-picker-config.js";
14
- import { RADIUS_CLASS as Lo } from "../../shared/radius.js";
15
- import { useSelectFloating as To } from "../select-menu/use-select-floating.js";
16
- import { cn as Ko } from "../../utils/cn.js";
17
- import { FALLBACK_SELECT_MENU_CONFIG as _o } from "../select-menu/select-menu-config.js";
18
- const Eo = vo(
19
- ({
20
- selected: n,
21
- onChange: e,
22
- mode: W,
23
- isClearable: N = !1,
24
- disableFuture: Y = !1,
25
- placeholder: q,
26
- size: h,
27
- radius: S,
28
- color: A,
29
- disabled: w,
30
- picker: l,
31
- ...D
32
- }, u) => {
33
- var E, O, z, M;
34
- const I = Ro(), o = (E = I.components) == null ? void 0 : E.datePicker, $ = bo(), H = D.id ?? $, [i, p] = G(!1), [P, a] = G(""), L = So(null), s = c(
35
- W,
36
- o == null ? void 0 : o.mode,
37
- void 0,
38
- y.mode
39
- ), J = c(
40
- l == null ? void 0 : l.portal,
41
- (O = o == null ? void 0 : o.picker) == null ? void 0 : O.portal,
42
- void 0,
43
- _o.portal
44
- ), Q = c(
45
- l == null ? void 0 : l.portalTarget,
46
- (z = o == null ? void 0 : o.picker) == null ? void 0 : z.portalTarget,
47
- void 0,
48
- null
49
- ), T = c(
50
- l == null ? void 0 : l.lockScroll,
51
- (M = o == null ? void 0 : o.picker) == null ? void 0 : M.lockScroll,
52
- void 0,
53
- !0
54
- ), X = c(
55
- h,
56
- o == null ? void 0 : o.size,
57
- void 0,
58
- y.size
59
- ), Z = c(
60
- A,
61
- o == null ? void 0 : o.color,
62
- I.defaultColor,
63
- y.color
64
- ), K = Fo(
65
- typeof S == "string" ? S : void 0,
66
- typeof (o == null ? void 0 : o.radius) == "string" ? o.radius : void 0,
67
- I.defaultRadius,
68
- y.radius
69
- ), C = xo(
70
- K === "full" ? "xl" : K,
71
- Lo,
72
- y.radius
73
- ), {
74
- refs: R,
75
- context: k,
76
- floatingStyles: oo,
77
- isPositioned: to,
78
- getReferenceProps: eo,
79
- getFloatingProps: lo
80
- } = To({
81
- isOpen: i,
82
- onOpenChange: p,
83
- disabled: w,
84
- matchReferenceWidth: !1,
85
- // Allow calendar to size naturally side-by-side
86
- role: "dialog"
87
- });
88
- U(() => {
89
- if (!i || !T) return;
90
- const t = window.scrollY, d = document.body.style.position, F = document.body.style.top, x = document.body.style.left, g = document.body.style.right, v = document.body.style.width, m = document.body.style.overflow;
91
- return document.body.style.position = "fixed", document.body.style.top = `-${t}px`, document.body.style.left = "0", document.body.style.right = "0", document.body.style.width = "100%", document.body.style.overflow = "hidden", () => {
92
- document.body.style.position = d, document.body.style.top = F, document.body.style.left = x, document.body.style.right = g, document.body.style.width = v, document.body.style.overflow = m, window.scrollTo(0, t);
93
- };
94
- }, [i, T]), U(() => {
95
- a(n ? b(n, s) : "");
96
- }, [n, s]);
97
- const so = f(
98
- (t) => {
99
- e == null || e(t), a(t ? b(t, s) : ""), (s === "date" || t === null) && p(!1);
100
- },
101
- [e, s]
102
- ), ro = f(() => p(!1), []), no = f(
103
- (t) => {
104
- var d;
105
- t.stopPropagation(), e == null || e(null), a(""), p(!1), (d = L.current) == null || d.focus();
106
- },
107
- [e]
108
- ), ao = f(
109
- (t) => {
110
- const d = t.target, F = d.value, x = P, g = d.selectionStart ?? 0, v = F.replace(/\D/g, "");
111
- if (v.length === 0) {
112
- a(""), e == null || e(null);
113
- return;
114
- }
115
- const m = ho(
116
- v,
117
- s,
118
- n ?? void 0
119
- );
120
- if (m) {
121
- e == null || e(m);
122
- const V = b(m, s);
123
- a(V);
124
- const j = Ao(
125
- x,
126
- V,
127
- g
128
- );
129
- requestAnimationFrame(() => {
130
- d.setSelectionRange(j, j);
131
- });
132
- } else
133
- a(n ? b(n, s) : "");
134
- },
135
- [s, n, e, P]
136
- ), io = q ?? Do(s), co = /* @__PURE__ */ B(fo, { children: [
137
- N && n && !w && /* @__PURE__ */ r(
138
- "button",
139
- {
140
- type: "button",
141
- onClick: no,
142
- "aria-label": "Clear selection",
143
- className: "p-0.5 rounded text-foreground/70 hover:text-foreground transition-colors",
144
- children: /* @__PURE__ */ r(Io, { className: "size-3.5" })
145
- }
146
- ),
147
- /* @__PURE__ */ r("span", { className: "text-foreground/70 pointer-events-none", children: s === "time" ? /* @__PURE__ */ r(Po, {}) : /* @__PURE__ */ r(wo, {}) })
148
- ] }), _ = i ? /* @__PURE__ */ r(
149
- yo,
150
- {
151
- context: k,
152
- modal: !1,
153
- initialFocus: -1,
154
- returnFocus: !1,
155
- children: /* @__PURE__ */ r(
156
- "div",
157
- {
158
- ref: R.setFloating,
159
- style: { ...oo },
160
- className: Ko(
161
- "z-100 outline-none w-max",
162
- // Disable transitions on the floating node. Floating UI applies
163
- // position via `transform` on every scroll tick, and any inherited
164
- // transform transition would ease toward each new position instead
165
- // of snapping, producing a spring/bounce effect.
166
- "transition-none",
167
- to ? "animate-in fade-in-0 zoom-in-95 duration-150 ease-out" : "invisible opacity-0 pointer-events-none",
168
- l == null ? void 0 : l.className
169
- ),
170
- ...lo(),
171
- children: /* @__PURE__ */ r(
172
- No,
173
- {
174
- selected: n,
175
- mode: s,
176
- isClearable: N,
177
- resolvedSizeKey: X,
178
- onSelect: so,
179
- onClose: ro,
180
- disableFuture: Y,
181
- resolvedColor: Z,
182
- radiusClass: C
183
- }
184
- )
185
- }
186
- )
187
- }
188
- ) : null, uo = Q ?? (typeof document < "u" ? document.body : null), mo = f(
189
- (t) => {
190
- t && (R.setReference(t), L.current = t, typeof u == "function" ? u(t) : u && (u.current = t));
191
- },
192
- [R, u]
193
- );
194
- return /* @__PURE__ */ B("div", { className: "w-full relative inline-block", children: [
195
- /* @__PURE__ */ r(
196
- go,
197
- {
198
- ...D,
199
- ref: mo,
200
- id: H,
201
- size: h,
202
- radius: S,
203
- color: A,
204
- placeholder: io,
205
- value: P,
206
- onChange: ao,
207
- endContent: co,
208
- disabled: w,
209
- "aria-expanded": i,
210
- "aria-haspopup": "dialog",
211
- ...eo()
212
- }
213
- ),
214
- i && (J ? /* @__PURE__ */ r(po, { root: uo, children: _ }) : _)
215
- ] });
216
- }
217
- );
218
- Eo.displayName = "DatePicker";
219
- export {
220
- Eo as DatePicker
221
- };
2
+ "use client";
3
+ import { cn as e } from "../../utils/cn.js";
4
+ import { ASHEE_LAYER as t } from "../../utils/stacking.js";
5
+ import { useAsheeConfig as n } from "../../libs/context.js";
6
+ import { RADIUS_CLASS as r } from "../../shared/radius.js";
7
+ import { resolveCascade as i, resolveClassKey as a, resolveRadiusKey as o } from "../../utils/resolve-token.js";
8
+ import { Input as s } from "../input/Input.js";
9
+ import { FALLBACK_SELECT_MENU_CONFIG as c } from "../select-menu/select-menu-config.js";
10
+ import { useSelectFloating as l } from "../select-menu/use-select-floating.js";
11
+ import { CalendarIcon as u } from "../../icons/CalendarIcon.js";
12
+ import { ClearIcon as d } from "../../icons/ClearIcon.js";
13
+ import { ClockIcon as ee } from "../../icons/ClockIcon.js";
14
+ import { formatDisplay as f, getDefaultPlaceholder as p, getNewCursorPosition as m, parseDateString as h } from "./date-picker.helpers.js";
15
+ import { Calendar as g } from "./Calendar.js";
16
+ import { FALLBACK_DATE_PICKER_CONFIG as _ } from "./date-picker-config.js";
17
+ import { forwardRef as v, useCallback as y, useEffect as b, useId as x, useRef as S, useState as C } from "react";
18
+ import { Fragment as te, jsx as w, jsxs as T } from "react/jsx-runtime";
19
+ import { FloatingFocusManager as E, FloatingPortal as D } from "@floating-ui/react";
20
+ //#region src/components/date-picker/DatePicker.tsx
21
+ var O = v(({ selected: v, onChange: O, mode: k, isClearable: A = !1, disableFuture: j = !1, placeholder: ne, size: M, radius: N, color: P, disabled: F, picker: I, ...L }, R) => {
22
+ let z = n(), B = z.components?.datePicker, V = x(), H = L.id ?? V, [U, W] = C(!1), [G, K] = C(""), q = S(null), J = i(k, B?.mode, void 0, _.mode), Y = i(I?.portal, B?.picker?.portal, void 0, c.portal), re = i(I?.portalTarget, B?.picker?.portalTarget, void 0, null), X = i(I?.lockScroll, B?.picker?.lockScroll, void 0, !0), ie = i(M, B?.size, void 0, _.size), ae = i(P, B?.color, z.defaultColor, _.color), Z = o(typeof N == "string" ? N : void 0, typeof B?.radius == "string" ? B.radius : void 0, z.defaultRadius, _.radius), oe = a(Z === "full" ? "xl" : Z, r, _.radius), { refs: Q, context: se, floatingStyles: ce, isPositioned: le, getReferenceProps: ue, getFloatingProps: de } = l({
23
+ isOpen: U,
24
+ onOpenChange: W,
25
+ disabled: F,
26
+ matchReferenceWidth: !1,
27
+ role: "dialog",
28
+ zIndex: t.popover
29
+ });
30
+ b(() => {
31
+ if (!U || !X) return;
32
+ let e = window.scrollY, t = document.body.style.position, n = document.body.style.top, r = document.body.style.left, i = document.body.style.right, a = document.body.style.width, o = document.body.style.overflow;
33
+ return document.body.style.position = "fixed", document.body.style.top = `-${e}px`, document.body.style.left = "0", document.body.style.right = "0", document.body.style.width = "100%", document.body.style.overflow = "hidden", () => {
34
+ document.body.style.position = t, document.body.style.top = n, document.body.style.left = r, document.body.style.right = i, document.body.style.width = a, document.body.style.overflow = o, window.scrollTo(0, e);
35
+ };
36
+ }, [U, X]), b(() => {
37
+ K(v ? f(v, J) : "");
38
+ }, [v, J]);
39
+ let fe = y((e) => {
40
+ O?.(e), K(e ? f(e, J) : ""), (J === "date" || e === null) && W(!1);
41
+ }, [O, J]), pe = y(() => W(!1), []), me = y((e) => {
42
+ e.stopPropagation(), O?.(null), K(""), W(!1), q.current?.focus();
43
+ }, [O]), he = y((e) => {
44
+ let t = e.target, n = t.value, r = G, i = t.selectionStart ?? 0, a = n.replace(/\D/g, "");
45
+ if (a.length === 0) {
46
+ K(""), O?.(null);
47
+ return;
48
+ }
49
+ let o = h(a, J, v ?? void 0);
50
+ if (o) {
51
+ O?.(o);
52
+ let e = f(o, J);
53
+ K(e);
54
+ let n = m(r, e, i);
55
+ requestAnimationFrame(() => {
56
+ t.setSelectionRange(n, n);
57
+ });
58
+ } else K(v ? f(v, J) : "");
59
+ }, [
60
+ J,
61
+ v,
62
+ O,
63
+ G
64
+ ]), ge = ne ?? p(J), _e = /* @__PURE__ */ T(te, { children: [A && v && !F && /* @__PURE__ */ w("button", {
65
+ type: "button",
66
+ onClick: me,
67
+ "aria-label": "Clear selection",
68
+ className: "p-0.5 rounded text-foreground/70 hover:text-foreground transition-colors",
69
+ children: /* @__PURE__ */ w(d, { className: "size-3.5" })
70
+ }), /* @__PURE__ */ w("span", {
71
+ className: "text-foreground/70 pointer-events-none",
72
+ children: w(J === "time" ? ee : u, {})
73
+ })] }), $ = U ? /* @__PURE__ */ w(E, {
74
+ context: se,
75
+ modal: !1,
76
+ initialFocus: -1,
77
+ returnFocus: !1,
78
+ children: /* @__PURE__ */ w("div", {
79
+ ref: Q.setFloating,
80
+ style: { ...ce },
81
+ className: e("outline-none w-max", "transition-none", le ? "animate-in fade-in-0 zoom-in-95 duration-150 ease-out" : "invisible opacity-0 pointer-events-none", I?.className),
82
+ ...de(),
83
+ children: /* @__PURE__ */ w(g, {
84
+ selected: v,
85
+ mode: J,
86
+ isClearable: A,
87
+ resolvedSizeKey: ie,
88
+ onSelect: fe,
89
+ onClose: pe,
90
+ disableFuture: j,
91
+ resolvedColor: ae,
92
+ radiusClass: oe
93
+ })
94
+ })
95
+ }) : null, ve = re ?? (typeof document < "u" ? document.body : null), ye = y((e) => {
96
+ e && (Q.setReference(e), q.current = e, typeof R == "function" ? R(e) : R && (R.current = e));
97
+ }, [Q, R]);
98
+ return /* @__PURE__ */ T("div", {
99
+ className: "w-full relative inline-block",
100
+ children: [/* @__PURE__ */ w(s, {
101
+ ...L,
102
+ ref: ye,
103
+ id: H,
104
+ size: M,
105
+ radius: N,
106
+ color: P,
107
+ placeholder: ge,
108
+ value: G,
109
+ onChange: he,
110
+ endContent: _e,
111
+ disabled: F,
112
+ "aria-expanded": U,
113
+ "aria-haspopup": "dialog",
114
+ ...ue()
115
+ }), U && (Y ? /* @__PURE__ */ w(D, {
116
+ root: ve,
117
+ children: $
118
+ }) : $)]
119
+ });
120
+ });
121
+ O.displayName = "DatePicker";
122
+ //#endregion
123
+ export { O as DatePicker };
@@ -1,84 +1,60 @@
1
1
  "use client";
2
- import { jsxs as w, jsx as r } from "react/jsx-runtime";
3
- import { useState as D, useEffect as v } from "react";
4
- import { pad2 as c } from "./date-picker.helpers.js";
5
- import { CALENDAR_COLOR_CLASSES as d } from "./date-picker-styles.js";
6
- import { ChevronUpIcon as N } from "../../icons/ChevronUpIcon.js";
7
- import { cn as f } from "../../utils/cn.js";
8
- import { ChevronDownIcon as k } from "../../icons/ChevronDownIcon.js";
9
- function V({
10
- value: t,
11
- max: i,
12
- label: n,
13
- onChange: s,
14
- resolvedColor: h,
15
- radiusClass: a
16
- }) {
17
- const [l, o] = D(c(t));
18
- v(() => {
19
- o(c(t));
20
- }, [t]);
21
- const u = () => s(t >= i ? 0 : t + 1), p = () => s(t <= 0 ? i : t - 1), x = (e) => {
22
- const y = e.target.value.replace(/\D/g, "");
23
- o(y);
24
- }, b = () => {
25
- const e = parseInt(l, 10);
26
- Number.isNaN(e) || e < 0 || e > i ? o(c(t)) : (s(e), o(c(e)));
27
- }, g = (e) => {
28
- e.key === "Enter" ? (e.preventDefault(), e.currentTarget.blur()) : e.key === "ArrowUp" ? (e.preventDefault(), u()) : e.key === "ArrowDown" && (e.preventDefault(), p());
29
- }, m = d[h] ?? d.primary;
30
- return /* @__PURE__ */ w("div", { className: "flex flex-col items-center gap-1 group", children: [
31
- /* @__PURE__ */ r("span", { className: "text-[10px] font-medium uppercase tracking-widest text-foreground/50 select-none mb-0.5", children: n }),
32
- /* @__PURE__ */ r(
33
- "button",
34
- {
35
- type: "button",
36
- className: f(
37
- "w-10 h-7 flex items-center justify-center text-foreground/50 transition-all",
38
- "hover:text-foreground active:scale-95",
39
- a,
40
- m.hover
41
- ),
42
- onClick: u,
43
- "aria-label": `Increment ${n}`,
44
- children: /* @__PURE__ */ r(N, {})
45
- }
46
- ),
47
- /* @__PURE__ */ r(
48
- "input",
49
- {
50
- type: "text",
51
- inputMode: "numeric",
52
- maxLength: 2,
53
- value: l,
54
- onChange: x,
55
- onBlur: b,
56
- onKeyDown: g,
57
- "aria-label": `${n} input`,
58
- className: f(
59
- "w-11 h-11 text-center text-base font-mono font-medium text-foreground bg-background transition-shadow",
60
- "border border-border/70 hover:border-border focus:outline-none focus:ring-2 focus:border-transparent focus:z-10",
61
- a
62
- )
63
- }
64
- ),
65
- /* @__PURE__ */ r(
66
- "button",
67
- {
68
- type: "button",
69
- className: f(
70
- "w-10 h-7 flex items-center justify-center text-foreground/50 transition-all",
71
- "hover:text-foreground active:scale-95",
72
- a,
73
- m.hover
74
- ),
75
- onClick: p,
76
- "aria-label": `Decrement ${n}`,
77
- children: /* @__PURE__ */ r(k, {})
78
- }
79
- )
80
- ] });
2
+ import { cn as e } from "../../utils/cn.js";
3
+ import { ChevronDownIcon as t } from "../../icons/ChevronDownIcon.js";
4
+ import { pad2 as n } from "./date-picker.helpers.js";
5
+ import { CALENDAR_COLOR_CLASSES as r } from "./date-picker-styles.js";
6
+ import { ChevronUpIcon as i } from "../../icons/ChevronUpIcon.js";
7
+ import { useEffect as a, useState as o } from "react";
8
+ import { jsx as s, jsxs as c } from "react/jsx-runtime";
9
+ //#region src/components/date-picker/TimeSpinner.tsx
10
+ function l({ value: l, max: u, label: d, onChange: f, resolvedColor: p, radiusClass: m }) {
11
+ let [h, g] = o(n(l));
12
+ a(() => {
13
+ g(n(l));
14
+ }, [l]);
15
+ let _ = () => f(l >= u ? 0 : l + 1), v = () => f(l <= 0 ? u : l - 1), y = (e) => {
16
+ let t = e.target.value.replace(/\D/g, "");
17
+ g(t);
18
+ }, b = () => {
19
+ let e = parseInt(h, 10);
20
+ Number.isNaN(e) || e < 0 || e > u ? g(n(l)) : (f(e), g(n(e)));
21
+ }, x = (e) => {
22
+ e.key === "Enter" ? (e.preventDefault(), e.currentTarget.blur()) : e.key === "ArrowUp" ? (e.preventDefault(), _()) : e.key === "ArrowDown" && (e.preventDefault(), v());
23
+ }, S = r[p] ?? r.primary;
24
+ return /* @__PURE__ */ c("div", {
25
+ className: "flex flex-col items-center gap-1 group",
26
+ children: [
27
+ /* @__PURE__ */ s("span", {
28
+ className: "text-[10px] font-medium uppercase tracking-widest text-foreground/50 select-none mb-0.5",
29
+ children: d
30
+ }),
31
+ /* @__PURE__ */ s("button", {
32
+ type: "button",
33
+ className: e("w-10 h-7 flex items-center justify-center text-foreground/50 transition-all", "hover:text-foreground active:scale-95", m, S.hover),
34
+ onClick: _,
35
+ "aria-label": `Increment ${d}`,
36
+ children: /* @__PURE__ */ s(i, {})
37
+ }),
38
+ /* @__PURE__ */ s("input", {
39
+ type: "text",
40
+ inputMode: "numeric",
41
+ maxLength: 2,
42
+ value: h,
43
+ onChange: y,
44
+ onBlur: b,
45
+ onKeyDown: x,
46
+ "aria-label": `${d} input`,
47
+ className: e("w-11 h-11 text-center text-base font-mono font-medium text-foreground bg-background transition-shadow", "border border-border/70 hover:border-border focus:outline-none focus:ring-2 focus:border-transparent focus:z-10", m)
48
+ }),
49
+ /* @__PURE__ */ s("button", {
50
+ type: "button",
51
+ className: e("w-10 h-7 flex items-center justify-center text-foreground/50 transition-all", "hover:text-foreground active:scale-95", m, S.hover),
52
+ onClick: v,
53
+ "aria-label": `Decrement ${d}`,
54
+ children: /* @__PURE__ */ s(t, {})
55
+ })
56
+ ]
57
+ });
81
58
  }
82
- export {
83
- V as TimeSpinner
84
- };
59
+ //#endregion
60
+ export { l as TimeSpinner };
@@ -6,7 +6,7 @@ import { InputConfig } from '../input';
6
6
  * - `time`: Select only a time.
7
7
  * - `datetime`: Select both date and time.
8
8
  */
9
- export type PickerMode = "date" | "time" | "datetime";
9
+ export type DatePickerMode = "date" | "time" | "datetime";
10
10
  /**
11
11
  * Size key for the date picker.
12
12
  * Maps to the FieldSizeKey type: "sm", "md", or "lg".
@@ -25,18 +25,18 @@ export interface DatePickerConfig extends InputConfig {
25
25
  *
26
26
  * @default "date"
27
27
  */
28
- mode?: PickerMode;
28
+ mode?: DatePickerMode;
29
29
  /**
30
30
  * Picker configuration for the calendar popover.
31
31
  * Controls portal behavior and other picker-specific settings.
32
32
  */
33
- picker?: PickerConfig;
33
+ picker?: DatePickerPickerConfig;
34
34
  }
35
35
  /**
36
36
  * Picker configuration for the DatePicker component.
37
37
  * Extends DatePickerConfig to allow override of portal settings.
38
38
  */
39
- export interface PickerConfig {
39
+ export interface DatePickerPickerConfig {
40
40
  /**
41
41
  * Whether to render the calendar popover through Floating UI's
42
42
  * `FloatingPortal`.
@@ -1 +1 @@
1
- {"version":3,"file":"date-picker-config.d.ts","sourceRoot":"","sources":["../../../src/components/date-picker/date-picker-config.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAGH,OAAO,EAEL,KAAK,YAAY,EAClB,MAAM,uBAAuB,CAAC;AAC/B,OAAO,EAAsB,KAAK,WAAW,EAAE,MAAM,UAAU,CAAC;AAEhE;;;;;GAKG;AACH,MAAM,MAAM,UAAU,GAAG,MAAM,GAAG,MAAM,GAAG,UAAU,CAAC;AAEtD;;;GAGG;AACH,MAAM,MAAM,iBAAiB,GAAG,YAAY,CAAC;AAE7C;;;;;GAKG;AACH,MAAM,WAAW,gBAAiB,SAAQ,WAAW;IACnD;;;;;OAKG;IACH,IAAI,CAAC,EAAE,UAAU,CAAC;IAElB;;;OAGG;IACH,MAAM,CAAC,EAAE,YAAY,CAAC;CACvB;AAED;;;GAGG;AACH,MAAM,WAAW,YAAY;IAC3B;;;;;;;;;;OAUG;IACH,MAAM,CAAC,EAAE,OAAO,CAAC;IAEjB;;;;OAIG;IACH,YAAY,CAAC,EAAE,WAAW,GAAG,IAAI,CAAC;IAElC;;;;;;;OAOG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB;AAED;;;GAGG;AACH,eAAO,MAAM,uBAAuB,EAAE,gBAGrC,CAAC;AAEF;;;;GAIG;AACH,eAAO,MAAM,2BAA2B;;;;;;;;;CAG9B,CAAC;AAEX,OAAO,QAAQ,qBAAqB,CAAC;IACnC,UAAU,2BAA2B;QACnC,UAAU,EAAE,gBAAgB,CAAC;KAC9B;CACF"}
1
+ {"version":3,"file":"date-picker-config.d.ts","sourceRoot":"","sources":["../../../src/components/date-picker/date-picker-config.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAGH,OAAO,EAEL,KAAK,YAAY,EAClB,MAAM,uBAAuB,CAAC;AAC/B,OAAO,EAAsB,KAAK,WAAW,EAAE,MAAM,UAAU,CAAC;AAEhE;;;;;GAKG;AACH,MAAM,MAAM,cAAc,GAAG,MAAM,GAAG,MAAM,GAAG,UAAU,CAAC;AAE1D;;;GAGG;AACH,MAAM,MAAM,iBAAiB,GAAG,YAAY,CAAC;AAE7C;;;;;GAKG;AACH,MAAM,WAAW,gBAAiB,SAAQ,WAAW;IACnD;;;;;OAKG;IACH,IAAI,CAAC,EAAE,cAAc,CAAC;IAEtB;;;OAGG;IACH,MAAM,CAAC,EAAE,sBAAsB,CAAC;CACjC;AAED;;;GAGG;AACH,MAAM,WAAW,sBAAsB;IACrC;;;;;;;;;;OAUG;IACH,MAAM,CAAC,EAAE,OAAO,CAAC;IAEjB;;;;OAIG;IACH,YAAY,CAAC,EAAE,WAAW,GAAG,IAAI,CAAC;IAElC;;;;;;;OAOG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB;AAED;;;GAGG;AACH,eAAO,MAAM,uBAAuB,EAAE,gBAGrC,CAAC;AAEF;;;;GAIG;AACH,eAAO,MAAM,2BAA2B;;;;;;;;;CAG9B,CAAC;AAEX,OAAO,QAAQ,qBAAqB,CAAC;IACnC,UAAU,2BAA2B;QACnC,UAAU,EAAE,gBAAgB,CAAC;KAC9B;CACF"}
@@ -1,16 +1,15 @@
1
1
  "use client";
2
2
  import { registerComponentDefaults as e } from "../../libs/registry.js";
3
3
  import { FALLBACK_FIELD_CONFIG as t } from "../field/field-config.js";
4
- import { defaultInputConfig as o } from "../input/input-config.js";
5
- const r = {
6
- ...o,
7
- mode: "date"
8
- }, n = {
9
- ...t,
10
- mode: "date"
4
+ import { defaultInputConfig as n } from "../input/input-config.js";
5
+ //#region src/components/date-picker/date-picker-config.ts
6
+ var r = {
7
+ ...n,
8
+ mode: "date"
9
+ }, i = {
10
+ ...t,
11
+ mode: "date"
11
12
  };
12
13
  e("datePicker", r);
13
- export {
14
- n as FALLBACK_DATE_PICKER_CONFIG,
15
- r as defaultDatePickerConfig
16
- };
14
+ //#endregion
15
+ export { i as FALLBACK_DATE_PICKER_CONFIG, r as defaultDatePickerConfig };