@wow-two-beta/ui 0.0.10 → 0.0.11

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 (38) hide show
  1. package/dist/{chunk-6KCV4GOI.js → chunk-PFM3IQKM.js} +881 -5
  2. package/dist/chunk-PFM3IQKM.js.map +1 -0
  3. package/dist/forms/_dateUtils.d.ts +36 -0
  4. package/dist/forms/_dateUtils.d.ts.map +1 -0
  5. package/dist/forms/calendar/Calendar.d.ts +21 -0
  6. package/dist/forms/calendar/Calendar.d.ts.map +1 -0
  7. package/dist/forms/calendar/index.d.ts +2 -0
  8. package/dist/forms/calendar/index.d.ts.map +1 -0
  9. package/dist/forms/dateField/DateField.d.ts +11 -0
  10. package/dist/forms/dateField/DateField.d.ts.map +1 -0
  11. package/dist/forms/dateField/index.d.ts +2 -0
  12. package/dist/forms/dateField/index.d.ts.map +1 -0
  13. package/dist/forms/datePicker/DatePicker.d.ts +17 -0
  14. package/dist/forms/datePicker/DatePicker.d.ts.map +1 -0
  15. package/dist/forms/datePicker/index.d.ts +2 -0
  16. package/dist/forms/datePicker/index.d.ts.map +1 -0
  17. package/dist/forms/dateRangePicker/DateRangePicker.d.ts +18 -0
  18. package/dist/forms/dateRangePicker/DateRangePicker.d.ts.map +1 -0
  19. package/dist/forms/dateRangePicker/index.d.ts +2 -0
  20. package/dist/forms/dateRangePicker/index.d.ts.map +1 -0
  21. package/dist/forms/index.d.ts +7 -0
  22. package/dist/forms/index.d.ts.map +1 -1
  23. package/dist/forms/index.js +1 -1
  24. package/dist/forms/rangeCalendar/RangeCalendar.d.ts +17 -0
  25. package/dist/forms/rangeCalendar/RangeCalendar.d.ts.map +1 -0
  26. package/dist/forms/rangeCalendar/index.d.ts +2 -0
  27. package/dist/forms/rangeCalendar/index.d.ts.map +1 -0
  28. package/dist/forms/timeField/TimeField.d.ts +13 -0
  29. package/dist/forms/timeField/TimeField.d.ts.map +1 -0
  30. package/dist/forms/timeField/index.d.ts +2 -0
  31. package/dist/forms/timeField/index.d.ts.map +1 -0
  32. package/dist/forms/timePicker/TimePicker.d.ts +16 -0
  33. package/dist/forms/timePicker/TimePicker.d.ts.map +1 -0
  34. package/dist/forms/timePicker/index.d.ts +2 -0
  35. package/dist/forms/timePicker/index.d.ts.map +1 -0
  36. package/dist/index.js +1 -1
  37. package/package.json +1 -1
  38. package/dist/chunk-6KCV4GOI.js.map +0 -1
@@ -7,8 +7,8 @@ import { composeRefs } from './chunk-DN7WBRIV.js';
7
7
  import { cn } from './chunk-KZ4VFY2T.js';
8
8
  import * as React from 'react';
9
9
  import { forwardRef, useRef, useImperativeHandle, useState, Children, isValidElement, cloneElement, useId as useId$1, createContext, useMemo, useCallback, useEffect, useContext } from 'react';
10
- import { jsxs, jsx } from 'react/jsx-runtime';
11
- import { Minus, Plus, EyeOff, Eye, Search, X, Check, Upload, ChevronDown } from 'lucide-react';
10
+ import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
11
+ import { Minus, Plus, EyeOff, Eye, Search, X, Check, Upload, ChevronDown, ChevronLeft, ChevronRight, Calendar as Calendar$1, Clock } from 'lucide-react';
12
12
  import { FocusScope } from '@radix-ui/react-focus-scope';
13
13
 
14
14
  var Label = forwardRef(
@@ -2029,6 +2029,882 @@ Combobox.Group = ComboboxGroup;
2029
2029
  Combobox.Separator = ComboboxSeparator;
2030
2030
  Combobox.Empty = ComboboxEmpty;
2031
2031
 
2032
- export { CharacterCount, Checkbox, CheckboxField, CheckboxGroup, ChoiceCard, Combobox, ComboboxContent, ComboboxEmpty, ComboboxGroup, ComboboxInput, ComboboxItem, ComboboxSeparator, CurrencyInput, EmailInput, Fieldset, FilePicker, FormErrorMessage, FormField, FormHelperText, InputAddon, InputGroup, Label, LabeledInput, Legend, Listbox, ListboxEmpty, ListboxGroup, ListboxItem, ListboxSeparator, MaskedInput, MultiSelect, MultiSelectContent, MultiSelectItem, MultiSelectTags, MultiSelectTrigger, NumberInput, PasswordInput, PasswordStrength, PercentInput, PinInput, Radio, RadioField, RadioGroup, SearchInput, Select, SelectContent, SelectItem, SelectTrigger, SelectValue, Slider, Switch, SwitchField, TelInput, TextInput, Textarea, UrlInput };
2033
- //# sourceMappingURL=chunk-6KCV4GOI.js.map
2034
- //# sourceMappingURL=chunk-6KCV4GOI.js.map
2032
+ // src/forms/_dateUtils.ts
2033
+ var WEEKDAYS_SHORT = ["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"];
2034
+ var MONTHS_LONG = [
2035
+ "January",
2036
+ "February",
2037
+ "March",
2038
+ "April",
2039
+ "May",
2040
+ "June",
2041
+ "July",
2042
+ "August",
2043
+ "September",
2044
+ "October",
2045
+ "November",
2046
+ "December"
2047
+ ];
2048
+ function startOfDay(d) {
2049
+ const c = new Date(d);
2050
+ c.setHours(0, 0, 0, 0);
2051
+ return c;
2052
+ }
2053
+ function isSameDay(a, b) {
2054
+ if (!a || !b) return false;
2055
+ return a.getFullYear() === b.getFullYear() && a.getMonth() === b.getMonth() && a.getDate() === b.getDate();
2056
+ }
2057
+ function isToday(d) {
2058
+ return isSameDay(d, /* @__PURE__ */ new Date());
2059
+ }
2060
+ function addMonths(d, n) {
2061
+ const c = new Date(d);
2062
+ c.setMonth(c.getMonth() + n);
2063
+ return c;
2064
+ }
2065
+ function addDays(d, n) {
2066
+ const c = new Date(d);
2067
+ c.setDate(c.getDate() + n);
2068
+ return c;
2069
+ }
2070
+ function startOfMonth(d) {
2071
+ return new Date(d.getFullYear(), d.getMonth(), 1);
2072
+ }
2073
+ function buildMonthGrid(year, month) {
2074
+ const first = new Date(year, month, 1);
2075
+ const firstWeekday = first.getDay();
2076
+ const start = addDays(first, -firstWeekday);
2077
+ const cells = [];
2078
+ for (let i = 0; i < 42; i++) {
2079
+ const date = addDays(start, i);
2080
+ cells.push({ date, outOfMonth: date.getMonth() !== month });
2081
+ }
2082
+ return cells;
2083
+ }
2084
+ function formatISODate(d) {
2085
+ if (!d) return "";
2086
+ const year = d.getFullYear();
2087
+ const month = String(d.getMonth() + 1).padStart(2, "0");
2088
+ const day = String(d.getDate()).padStart(2, "0");
2089
+ return `${year}-${month}-${day}`;
2090
+ }
2091
+ function parseISODate(s) {
2092
+ if (!s) return null;
2093
+ const m = /^(\d{4})-(\d{2})-(\d{2})$/.exec(s);
2094
+ if (!m) return null;
2095
+ const [, y, mo, d] = m;
2096
+ if (!y || !mo || !d) return null;
2097
+ const date = new Date(Number(y), Number(mo) - 1, Number(d));
2098
+ if (isNaN(date.getTime())) return null;
2099
+ return date;
2100
+ }
2101
+ function formatISOTime(d) {
2102
+ if (!d) return "";
2103
+ const h = String(d.getHours()).padStart(2, "0");
2104
+ const m = String(d.getMinutes()).padStart(2, "0");
2105
+ return `${h}:${m}`;
2106
+ }
2107
+ function parseISOTime(s) {
2108
+ if (!s) return null;
2109
+ const m = /^(\d{2}):(\d{2})$/.exec(s);
2110
+ if (!m) return null;
2111
+ const [, h, mi] = m;
2112
+ if (!h || !mi) return null;
2113
+ const hours = Number(h);
2114
+ const minutes = Number(mi);
2115
+ if (hours < 0 || hours > 23 || minutes < 0 || minutes > 59) return null;
2116
+ return { hours, minutes };
2117
+ }
2118
+ function isDateDisabled(d, options) {
2119
+ const { min, max, isDisabled } = options;
2120
+ if (min && startOfDay(d) < startOfDay(min)) return true;
2121
+ if (max && startOfDay(d) > startOfDay(max)) return true;
2122
+ if (isDisabled?.(d)) return true;
2123
+ return false;
2124
+ }
2125
+ function isInRange(d, start, end) {
2126
+ if (!start || !end) return false;
2127
+ const t = startOfDay(d).getTime();
2128
+ const s = startOfDay(start).getTime();
2129
+ const e = startOfDay(end).getTime();
2130
+ return t >= Math.min(s, e) && t <= Math.max(s, e);
2131
+ }
2132
+ var Calendar = forwardRef(function Calendar2({
2133
+ value,
2134
+ defaultValue,
2135
+ onChange,
2136
+ defaultMonth,
2137
+ min,
2138
+ max,
2139
+ isDisabled,
2140
+ "aria-label": ariaLabel = "Calendar",
2141
+ className,
2142
+ ...rest
2143
+ }, ref) {
2144
+ const [selected, setSelected] = useControlled({
2145
+ controlled: value,
2146
+ default: defaultValue ?? null,
2147
+ onChange
2148
+ });
2149
+ const [viewMonth, setViewMonth] = useState(
2150
+ () => startOfMonth(defaultMonth ?? selected ?? /* @__PURE__ */ new Date())
2151
+ );
2152
+ const [focusedDate, setFocusedDate] = useState(
2153
+ () => selected ?? /* @__PURE__ */ new Date()
2154
+ );
2155
+ const gridRef = useRef(null);
2156
+ useEffect(() => {
2157
+ const cell = gridRef.current?.querySelector(
2158
+ `[data-date="${focusedDate.toDateString()}"]`
2159
+ );
2160
+ cell?.focus();
2161
+ }, [focusedDate]);
2162
+ const moveFocus = useCallback(
2163
+ (next) => {
2164
+ if (next.getMonth() !== viewMonth.getMonth() || next.getFullYear() !== viewMonth.getFullYear()) {
2165
+ setViewMonth(startOfMonth(next));
2166
+ }
2167
+ setFocusedDate(next);
2168
+ },
2169
+ [viewMonth]
2170
+ );
2171
+ const onCellKeyDown = useCallback(
2172
+ (e, date) => {
2173
+ switch (e.key) {
2174
+ case "ArrowRight":
2175
+ e.preventDefault();
2176
+ moveFocus(addDays(date, 1));
2177
+ break;
2178
+ case "ArrowLeft":
2179
+ e.preventDefault();
2180
+ moveFocus(addDays(date, -1));
2181
+ break;
2182
+ case "ArrowDown":
2183
+ e.preventDefault();
2184
+ moveFocus(addDays(date, 7));
2185
+ break;
2186
+ case "ArrowUp":
2187
+ e.preventDefault();
2188
+ moveFocus(addDays(date, -7));
2189
+ break;
2190
+ case "Home":
2191
+ e.preventDefault();
2192
+ moveFocus(addDays(date, -date.getDay()));
2193
+ break;
2194
+ case "End":
2195
+ e.preventDefault();
2196
+ moveFocus(addDays(date, 6 - date.getDay()));
2197
+ break;
2198
+ case "PageDown":
2199
+ e.preventDefault();
2200
+ moveFocus(addMonths(date, e.shiftKey ? 12 : 1));
2201
+ break;
2202
+ case "PageUp":
2203
+ e.preventDefault();
2204
+ moveFocus(addMonths(date, e.shiftKey ? -12 : -1));
2205
+ break;
2206
+ case "Enter":
2207
+ case " ":
2208
+ e.preventDefault();
2209
+ if (!isDateDisabled(date, { min, max, isDisabled })) {
2210
+ setSelected(date);
2211
+ }
2212
+ break;
2213
+ }
2214
+ },
2215
+ [moveFocus, setSelected, min, max, isDisabled]
2216
+ );
2217
+ const cells = buildMonthGrid(viewMonth.getFullYear(), viewMonth.getMonth());
2218
+ return /* @__PURE__ */ jsxs(
2219
+ "div",
2220
+ {
2221
+ ref,
2222
+ role: "application",
2223
+ "aria-label": ariaLabel,
2224
+ className: cn(
2225
+ "inline-flex flex-col gap-2 rounded-md border border-border bg-popover p-3 text-popover-foreground",
2226
+ className
2227
+ ),
2228
+ ...rest,
2229
+ children: [
2230
+ /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between gap-2 px-1", children: [
2231
+ /* @__PURE__ */ jsx(
2232
+ "button",
2233
+ {
2234
+ type: "button",
2235
+ "aria-label": "Previous month",
2236
+ onClick: () => setViewMonth((m) => addMonths(m, -1)),
2237
+ className: "grid h-7 w-7 place-items-center rounded-sm text-muted-foreground transition-colors hover:bg-muted hover:text-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring",
2238
+ children: /* @__PURE__ */ jsx(ChevronLeft, { className: "h-4 w-4" })
2239
+ }
2240
+ ),
2241
+ /* @__PURE__ */ jsxs("div", { className: "text-sm font-medium", "aria-live": "polite", children: [
2242
+ MONTHS_LONG[viewMonth.getMonth()],
2243
+ " ",
2244
+ viewMonth.getFullYear()
2245
+ ] }),
2246
+ /* @__PURE__ */ jsx(
2247
+ "button",
2248
+ {
2249
+ type: "button",
2250
+ "aria-label": "Next month",
2251
+ onClick: () => setViewMonth((m) => addMonths(m, 1)),
2252
+ className: "grid h-7 w-7 place-items-center rounded-sm text-muted-foreground transition-colors hover:bg-muted hover:text-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring",
2253
+ children: /* @__PURE__ */ jsx(ChevronRight, { className: "h-4 w-4" })
2254
+ }
2255
+ )
2256
+ ] }),
2257
+ /* @__PURE__ */ jsx("div", { className: "grid grid-cols-7 gap-0 px-1", children: WEEKDAYS_SHORT.map((w) => /* @__PURE__ */ jsx(
2258
+ "div",
2259
+ {
2260
+ className: "grid h-7 w-9 place-items-center text-xs font-medium text-muted-foreground",
2261
+ children: w
2262
+ },
2263
+ w
2264
+ )) }),
2265
+ /* @__PURE__ */ jsx("div", { ref: gridRef, className: "grid grid-cols-7 gap-0 px-1", role: "grid", children: cells.map(({ date, outOfMonth }) => {
2266
+ const disabled = isDateDisabled(date, { min, max, isDisabled });
2267
+ const isSelectedCell = isSameDay(selected, date);
2268
+ const isFocusedCell = isSameDay(focusedDate, date);
2269
+ return /* @__PURE__ */ jsx(
2270
+ "button",
2271
+ {
2272
+ type: "button",
2273
+ role: "gridcell",
2274
+ "data-date": date.toDateString(),
2275
+ "aria-selected": isSelectedCell,
2276
+ "aria-disabled": disabled || void 0,
2277
+ "data-selected": isSelectedCell ? "" : void 0,
2278
+ "data-today": isToday(date) ? "" : void 0,
2279
+ "data-out-of-month": outOfMonth ? "" : void 0,
2280
+ "data-disabled": disabled ? "" : void 0,
2281
+ tabIndex: isFocusedCell ? 0 : -1,
2282
+ disabled,
2283
+ onClick: () => {
2284
+ if (disabled) return;
2285
+ setSelected(date);
2286
+ setFocusedDate(date);
2287
+ if (outOfMonth) setViewMonth(startOfMonth(date));
2288
+ },
2289
+ onKeyDown: (e) => onCellKeyDown(e, date),
2290
+ className: cn(
2291
+ "grid h-9 w-9 place-items-center rounded-sm text-sm transition-colors",
2292
+ "hover:bg-muted hover:text-foreground",
2293
+ "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring",
2294
+ outOfMonth && "text-muted-foreground/60",
2295
+ isToday(date) && !isSelectedCell && "border border-border",
2296
+ isSelectedCell && "bg-primary text-primary-foreground hover:bg-primary",
2297
+ disabled && "pointer-events-none opacity-40"
2298
+ ),
2299
+ children: date.getDate()
2300
+ },
2301
+ date.toDateString()
2302
+ );
2303
+ }) })
2304
+ ]
2305
+ }
2306
+ );
2307
+ });
2308
+ var DateField = forwardRef(function DateField2({ value, defaultValue, onChange, min, max, size, state, className, id, disabled, required, ...rest }, ref) {
2309
+ const ctx = useFormControl();
2310
+ const [current, setCurrent] = useControlled({
2311
+ controlled: value,
2312
+ default: defaultValue ?? null,
2313
+ onChange
2314
+ });
2315
+ return /* @__PURE__ */ jsx(
2316
+ "input",
2317
+ {
2318
+ ref,
2319
+ type: "date",
2320
+ id: id ?? ctx?.id,
2321
+ disabled: disabled ?? ctx?.isDisabled,
2322
+ required: required ?? ctx?.isRequired,
2323
+ "aria-invalid": ctx?.isInvalid || void 0,
2324
+ "aria-describedby": ctx ? `${ctx.helperId} ${ctx.errorId}` : void 0,
2325
+ value: formatISODate(current),
2326
+ min: formatISODate(min),
2327
+ max: formatISODate(max),
2328
+ onChange: (e) => setCurrent(parseISODate(e.target.value)),
2329
+ className: cn(inputBaseVariants({ size, state: state ?? (ctx?.isInvalid ? "invalid" : "default") }), className),
2330
+ ...rest
2331
+ }
2332
+ );
2333
+ });
2334
+ function timeToString(t) {
2335
+ if (!t) return "";
2336
+ const date = /* @__PURE__ */ new Date();
2337
+ date.setHours(t.hours, t.minutes, 0, 0);
2338
+ return formatISOTime(date);
2339
+ }
2340
+ var TimeField = forwardRef(function TimeField2({ value, defaultValue, onChange, size, state, className, id, disabled, required, ...rest }, ref) {
2341
+ const ctx = useFormControl();
2342
+ const [current, setCurrent] = useControlled({
2343
+ controlled: value,
2344
+ default: defaultValue ?? null,
2345
+ onChange
2346
+ });
2347
+ return /* @__PURE__ */ jsx(
2348
+ "input",
2349
+ {
2350
+ ref,
2351
+ type: "time",
2352
+ id: id ?? ctx?.id,
2353
+ disabled: disabled ?? ctx?.isDisabled,
2354
+ required: required ?? ctx?.isRequired,
2355
+ "aria-invalid": ctx?.isInvalid || void 0,
2356
+ "aria-describedby": ctx ? `${ctx.helperId} ${ctx.errorId}` : void 0,
2357
+ value: timeToString(current),
2358
+ onChange: (e) => setCurrent(parseISOTime(e.target.value)),
2359
+ className: cn(inputBaseVariants({ size, state: state ?? (ctx?.isInvalid ? "invalid" : "default") }), className),
2360
+ ...rest
2361
+ }
2362
+ );
2363
+ });
2364
+ var RangeCalendar = forwardRef(
2365
+ function RangeCalendar2({
2366
+ value,
2367
+ defaultValue,
2368
+ onChange,
2369
+ defaultMonth,
2370
+ min,
2371
+ max,
2372
+ isDisabled,
2373
+ "aria-label": ariaLabel = "Date range",
2374
+ className,
2375
+ ...rest
2376
+ }, ref) {
2377
+ const [range, setRange] = useControlled({
2378
+ controlled: value,
2379
+ default: defaultValue ?? null,
2380
+ onChange
2381
+ });
2382
+ const [viewMonth, setViewMonth] = useState(
2383
+ () => startOfMonth(defaultMonth ?? range?.start ?? /* @__PURE__ */ new Date())
2384
+ );
2385
+ const [focusedDate, setFocusedDate] = useState(
2386
+ () => range?.start ?? /* @__PURE__ */ new Date()
2387
+ );
2388
+ const [hoveredDate, setHoveredDate] = useState(null);
2389
+ const [pendingStart, setPendingStart] = useState(null);
2390
+ const gridRef = useRef(null);
2391
+ useEffect(() => {
2392
+ const cell = gridRef.current?.querySelector(
2393
+ `[data-date="${focusedDate.toDateString()}"]`
2394
+ );
2395
+ cell?.focus();
2396
+ }, [focusedDate]);
2397
+ const moveFocus = useCallback(
2398
+ (next) => {
2399
+ if (next.getMonth() !== viewMonth.getMonth() || next.getFullYear() !== viewMonth.getFullYear()) {
2400
+ setViewMonth(startOfMonth(next));
2401
+ }
2402
+ setFocusedDate(next);
2403
+ },
2404
+ [viewMonth]
2405
+ );
2406
+ const onSelectDay = useCallback(
2407
+ (date) => {
2408
+ if (isDateDisabled(date, { min, max, isDisabled })) return;
2409
+ if (!pendingStart) {
2410
+ setPendingStart(date);
2411
+ setRange({ start: date, end: null });
2412
+ return;
2413
+ }
2414
+ const startTime = startOfDay(pendingStart).getTime();
2415
+ const endTime = startOfDay(date).getTime();
2416
+ const finalStart = startTime <= endTime ? pendingStart : date;
2417
+ const finalEnd = startTime <= endTime ? date : pendingStart;
2418
+ setRange({ start: finalStart, end: finalEnd });
2419
+ setPendingStart(null);
2420
+ },
2421
+ [pendingStart, setRange, min, max, isDisabled]
2422
+ );
2423
+ const onCellKeyDown = useCallback(
2424
+ (e, date) => {
2425
+ switch (e.key) {
2426
+ case "ArrowRight":
2427
+ e.preventDefault();
2428
+ moveFocus(addDays(date, 1));
2429
+ break;
2430
+ case "ArrowLeft":
2431
+ e.preventDefault();
2432
+ moveFocus(addDays(date, -1));
2433
+ break;
2434
+ case "ArrowDown":
2435
+ e.preventDefault();
2436
+ moveFocus(addDays(date, 7));
2437
+ break;
2438
+ case "ArrowUp":
2439
+ e.preventDefault();
2440
+ moveFocus(addDays(date, -7));
2441
+ break;
2442
+ case "Home":
2443
+ e.preventDefault();
2444
+ moveFocus(addDays(date, -date.getDay()));
2445
+ break;
2446
+ case "End":
2447
+ e.preventDefault();
2448
+ moveFocus(addDays(date, 6 - date.getDay()));
2449
+ break;
2450
+ case "PageDown":
2451
+ e.preventDefault();
2452
+ moveFocus(addMonths(date, e.shiftKey ? 12 : 1));
2453
+ break;
2454
+ case "PageUp":
2455
+ e.preventDefault();
2456
+ moveFocus(addMonths(date, e.shiftKey ? -12 : -1));
2457
+ break;
2458
+ case "Enter":
2459
+ case " ":
2460
+ e.preventDefault();
2461
+ onSelectDay(date);
2462
+ break;
2463
+ }
2464
+ },
2465
+ [moveFocus, onSelectDay]
2466
+ );
2467
+ const cells = buildMonthGrid(viewMonth.getFullYear(), viewMonth.getMonth());
2468
+ const previewEnd = pendingStart ? hoveredDate : range?.end;
2469
+ const isStart = (d) => isSameDay(d, range?.start ?? null) || isSameDay(d, pendingStart);
2470
+ const isEnd = (d) => isSameDay(d, range?.end ?? null);
2471
+ const inRange = (d) => isInRange(d, pendingStart ?? range?.start, previewEnd ?? null);
2472
+ return /* @__PURE__ */ jsxs(
2473
+ "div",
2474
+ {
2475
+ ref,
2476
+ role: "application",
2477
+ "aria-label": ariaLabel,
2478
+ className: cn(
2479
+ "inline-flex flex-col gap-2 rounded-md border border-border bg-popover p-3 text-popover-foreground",
2480
+ className
2481
+ ),
2482
+ ...rest,
2483
+ children: [
2484
+ /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between gap-2 px-1", children: [
2485
+ /* @__PURE__ */ jsx(
2486
+ "button",
2487
+ {
2488
+ type: "button",
2489
+ "aria-label": "Previous month",
2490
+ onClick: () => setViewMonth((m) => addMonths(m, -1)),
2491
+ className: "grid h-7 w-7 place-items-center rounded-sm text-muted-foreground transition-colors hover:bg-muted hover:text-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring",
2492
+ children: /* @__PURE__ */ jsx(ChevronLeft, { className: "h-4 w-4" })
2493
+ }
2494
+ ),
2495
+ /* @__PURE__ */ jsxs("div", { className: "text-sm font-medium", "aria-live": "polite", children: [
2496
+ MONTHS_LONG[viewMonth.getMonth()],
2497
+ " ",
2498
+ viewMonth.getFullYear()
2499
+ ] }),
2500
+ /* @__PURE__ */ jsx(
2501
+ "button",
2502
+ {
2503
+ type: "button",
2504
+ "aria-label": "Next month",
2505
+ onClick: () => setViewMonth((m) => addMonths(m, 1)),
2506
+ className: "grid h-7 w-7 place-items-center rounded-sm text-muted-foreground transition-colors hover:bg-muted hover:text-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring",
2507
+ children: /* @__PURE__ */ jsx(ChevronRight, { className: "h-4 w-4" })
2508
+ }
2509
+ )
2510
+ ] }),
2511
+ /* @__PURE__ */ jsx("div", { className: "grid grid-cols-7 gap-0 px-1", children: WEEKDAYS_SHORT.map((w) => /* @__PURE__ */ jsx(
2512
+ "div",
2513
+ {
2514
+ className: "grid h-7 w-9 place-items-center text-xs font-medium text-muted-foreground",
2515
+ children: w
2516
+ },
2517
+ w
2518
+ )) }),
2519
+ /* @__PURE__ */ jsx("div", { ref: gridRef, className: "grid grid-cols-7 gap-0 px-1", role: "grid", children: cells.map(({ date, outOfMonth }) => {
2520
+ const disabled = isDateDisabled(date, { min, max, isDisabled });
2521
+ const startCell = isStart(date);
2522
+ const endCell = isEnd(date);
2523
+ const rangeCell = inRange(date) && !startCell && !endCell;
2524
+ const isFocusedCell = isSameDay(focusedDate, date);
2525
+ return /* @__PURE__ */ jsx(
2526
+ "button",
2527
+ {
2528
+ type: "button",
2529
+ role: "gridcell",
2530
+ "data-date": date.toDateString(),
2531
+ "data-range-start": startCell ? "" : void 0,
2532
+ "data-range-end": endCell ? "" : void 0,
2533
+ "data-in-range": rangeCell ? "" : void 0,
2534
+ "data-today": isToday(date) ? "" : void 0,
2535
+ "data-out-of-month": outOfMonth ? "" : void 0,
2536
+ "data-disabled": disabled ? "" : void 0,
2537
+ "aria-selected": startCell || endCell,
2538
+ "aria-disabled": disabled || void 0,
2539
+ tabIndex: isFocusedCell ? 0 : -1,
2540
+ disabled,
2541
+ onPointerEnter: () => setHoveredDate(date),
2542
+ onPointerLeave: () => setHoveredDate((h) => isSameDay(h, date) ? null : h),
2543
+ onClick: () => {
2544
+ onSelectDay(date);
2545
+ setFocusedDate(date);
2546
+ if (outOfMonth) setViewMonth(startOfMonth(date));
2547
+ },
2548
+ onKeyDown: (e) => onCellKeyDown(e, date),
2549
+ className: cn(
2550
+ "grid h-9 w-9 place-items-center text-sm transition-colors",
2551
+ "hover:bg-muted hover:text-foreground",
2552
+ "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring",
2553
+ outOfMonth && "text-muted-foreground/60",
2554
+ isToday(date) && !startCell && !endCell && "border border-border rounded-sm",
2555
+ rangeCell && "bg-primary-soft text-primary-soft-foreground",
2556
+ startCell && "bg-primary text-primary-foreground rounded-l-sm",
2557
+ endCell && "bg-primary text-primary-foreground rounded-r-sm",
2558
+ !startCell && !endCell && !rangeCell && "rounded-sm",
2559
+ disabled && "pointer-events-none opacity-40"
2560
+ ),
2561
+ children: date.getDate()
2562
+ },
2563
+ date.toDateString()
2564
+ );
2565
+ }) })
2566
+ ]
2567
+ }
2568
+ );
2569
+ }
2570
+ );
2571
+ var defaultFormat = (d) => d.toLocaleDateString(void 0, { year: "numeric", month: "short", day: "numeric" });
2572
+ var DatePicker = forwardRef(function DatePicker2({
2573
+ value,
2574
+ defaultValue,
2575
+ onChange,
2576
+ placeholder = "Pick a date",
2577
+ format = defaultFormat,
2578
+ min,
2579
+ max,
2580
+ isDisabled: dayDisabled,
2581
+ invalid,
2582
+ name,
2583
+ size,
2584
+ state,
2585
+ className,
2586
+ disabled,
2587
+ onClick,
2588
+ ...rest
2589
+ }, forwardedRef) {
2590
+ const [date, setDate] = useControlled({
2591
+ controlled: value,
2592
+ default: defaultValue ?? null,
2593
+ onChange
2594
+ });
2595
+ const [open, setOpen] = useControlled({
2596
+ controlled: void 0,
2597
+ default: false
2598
+ });
2599
+ const triggerRef = useRef(null);
2600
+ const triggerState = state ?? (invalid ? "invalid" : "default");
2601
+ return /* @__PURE__ */ jsxs(Fragment, { children: [
2602
+ /* @__PURE__ */ jsxs(
2603
+ "button",
2604
+ {
2605
+ ref: composeRefs(forwardedRef, triggerRef),
2606
+ type: "button",
2607
+ "aria-haspopup": "dialog",
2608
+ "aria-expanded": open,
2609
+ "data-state": open ? "open" : "closed",
2610
+ disabled,
2611
+ onClick: (e) => {
2612
+ onClick?.(e);
2613
+ if (e.defaultPrevented) return;
2614
+ setOpen(!open);
2615
+ },
2616
+ className: cn(selectTriggerVariants({ size, state: triggerState }), className),
2617
+ ...rest,
2618
+ children: [
2619
+ /* @__PURE__ */ jsx("span", { className: cn("truncate", !date && "text-subtle-foreground"), children: date ? format(date) : placeholder }),
2620
+ /* @__PURE__ */ jsx(Calendar$1, { className: "h-4 w-4 shrink-0 text-muted-foreground" })
2621
+ ]
2622
+ }
2623
+ ),
2624
+ open && /* @__PURE__ */ jsx(Portal, { children: /* @__PURE__ */ jsx(AnchoredPositioner, { anchor: triggerRef.current, placement: "bottom-start", offset: 6, children: /* @__PURE__ */ jsx(FocusScope, { asChild: true, trapped: true, loop: true, children: /* @__PURE__ */ jsx(
2625
+ DismissableLayer,
2626
+ {
2627
+ onEscape: () => {
2628
+ setOpen(false);
2629
+ requestAnimationFrame(() => triggerRef.current?.focus());
2630
+ },
2631
+ onOutsidePointerDown: (e) => {
2632
+ if (triggerRef.current?.contains(e.target)) return;
2633
+ setOpen(false);
2634
+ },
2635
+ children: /* @__PURE__ */ jsx(
2636
+ Calendar,
2637
+ {
2638
+ value: date,
2639
+ onChange: (d) => {
2640
+ setDate(d);
2641
+ setOpen(false);
2642
+ requestAnimationFrame(() => triggerRef.current?.focus());
2643
+ },
2644
+ defaultMonth: date ?? /* @__PURE__ */ new Date(),
2645
+ min,
2646
+ max,
2647
+ isDisabled: dayDisabled,
2648
+ className: "shadow-md"
2649
+ }
2650
+ )
2651
+ }
2652
+ ) }) }) }),
2653
+ name && /* @__PURE__ */ jsx("input", { type: "hidden", name, value: formatISODate(date) })
2654
+ ] });
2655
+ });
2656
+ var defaultFormat2 = (t) => `${String(t.hours).padStart(2, "0")}:${String(t.minutes).padStart(2, "0")}`;
2657
+ var HOURS = Array.from({ length: 24 }, (_, i) => i);
2658
+ var TimePicker = forwardRef(function TimePicker2({
2659
+ value,
2660
+ defaultValue,
2661
+ onChange,
2662
+ minuteStep = 5,
2663
+ placeholder = "Pick a time",
2664
+ format = defaultFormat2,
2665
+ invalid,
2666
+ name,
2667
+ size,
2668
+ state,
2669
+ className,
2670
+ disabled,
2671
+ onClick,
2672
+ ...rest
2673
+ }, forwardedRef) {
2674
+ const [time, setTime] = useControlled({
2675
+ controlled: value,
2676
+ default: defaultValue ?? null,
2677
+ onChange
2678
+ });
2679
+ const [open, setOpen] = useControlled({
2680
+ controlled: void 0,
2681
+ default: false
2682
+ });
2683
+ const triggerRef = useRef(null);
2684
+ const hoursRef = useRef(null);
2685
+ const minutesRef = useRef(null);
2686
+ const minutes = useMemo(() => {
2687
+ const list = [];
2688
+ for (let m = 0; m < 60; m += minuteStep) list.push(m);
2689
+ return list;
2690
+ }, [minuteStep]);
2691
+ useEffect(() => {
2692
+ if (!open) return;
2693
+ requestAnimationFrame(() => {
2694
+ hoursRef.current?.querySelector("[data-selected]")?.scrollIntoView({ block: "center" });
2695
+ minutesRef.current?.querySelector("[data-selected]")?.scrollIntoView({ block: "center" });
2696
+ });
2697
+ }, [open]);
2698
+ const triggerState = state ?? (invalid ? "invalid" : "default");
2699
+ const update = (next) => {
2700
+ const merged = {
2701
+ hours: next.hours ?? time?.hours ?? 0,
2702
+ minutes: next.minutes ?? time?.minutes ?? 0
2703
+ };
2704
+ setTime(merged);
2705
+ };
2706
+ return /* @__PURE__ */ jsxs(Fragment, { children: [
2707
+ /* @__PURE__ */ jsxs(
2708
+ "button",
2709
+ {
2710
+ ref: composeRefs(forwardedRef, triggerRef),
2711
+ type: "button",
2712
+ "aria-haspopup": "dialog",
2713
+ "aria-expanded": open,
2714
+ "data-state": open ? "open" : "closed",
2715
+ disabled,
2716
+ onClick: (e) => {
2717
+ onClick?.(e);
2718
+ if (e.defaultPrevented) return;
2719
+ setOpen(!open);
2720
+ },
2721
+ className: cn(selectTriggerVariants({ size, state: triggerState }), className),
2722
+ ...rest,
2723
+ children: [
2724
+ /* @__PURE__ */ jsx("span", { className: cn("truncate", !time && "text-subtle-foreground"), children: time ? format(time) : placeholder }),
2725
+ /* @__PURE__ */ jsx(Clock, { className: "h-4 w-4 shrink-0 text-muted-foreground" })
2726
+ ]
2727
+ }
2728
+ ),
2729
+ open && /* @__PURE__ */ jsx(Portal, { children: /* @__PURE__ */ jsx(AnchoredPositioner, { anchor: triggerRef.current, placement: "bottom-start", offset: 6, children: /* @__PURE__ */ jsx(FocusScope, { asChild: true, trapped: true, loop: true, children: /* @__PURE__ */ jsx(
2730
+ DismissableLayer,
2731
+ {
2732
+ onEscape: () => {
2733
+ setOpen(false);
2734
+ requestAnimationFrame(() => triggerRef.current?.focus());
2735
+ },
2736
+ onOutsidePointerDown: (e) => {
2737
+ if (triggerRef.current?.contains(e.target)) return;
2738
+ setOpen(false);
2739
+ },
2740
+ children: /* @__PURE__ */ jsxs("div", { className: "z-50 flex gap-1 rounded-md border border-border bg-popover p-2 text-popover-foreground shadow-md outline-none animate-in fade-in-0 zoom-in-95", children: [
2741
+ /* @__PURE__ */ jsx(
2742
+ "div",
2743
+ {
2744
+ ref: hoursRef,
2745
+ role: "listbox",
2746
+ "aria-label": "Hours",
2747
+ className: "flex max-h-56 flex-col gap-0.5 overflow-y-auto pr-1",
2748
+ children: HOURS.map((h) => {
2749
+ const selected = time?.hours === h;
2750
+ return /* @__PURE__ */ jsx(
2751
+ "button",
2752
+ {
2753
+ type: "button",
2754
+ role: "option",
2755
+ "aria-selected": selected,
2756
+ "data-selected": selected ? "" : void 0,
2757
+ onClick: () => update({ hours: h }),
2758
+ className: cn(
2759
+ "grid h-8 w-12 place-items-center rounded-sm text-sm transition-colors hover:bg-muted",
2760
+ selected && "bg-primary text-primary-foreground hover:bg-primary"
2761
+ ),
2762
+ children: String(h).padStart(2, "0")
2763
+ },
2764
+ h
2765
+ );
2766
+ })
2767
+ }
2768
+ ),
2769
+ /* @__PURE__ */ jsx("div", { className: "w-px self-stretch bg-border" }),
2770
+ /* @__PURE__ */ jsx(
2771
+ "div",
2772
+ {
2773
+ ref: minutesRef,
2774
+ role: "listbox",
2775
+ "aria-label": "Minutes",
2776
+ className: "flex max-h-56 flex-col gap-0.5 overflow-y-auto pl-1",
2777
+ children: minutes.map((m) => {
2778
+ const selected = time?.minutes === m;
2779
+ return /* @__PURE__ */ jsx(
2780
+ "button",
2781
+ {
2782
+ type: "button",
2783
+ role: "option",
2784
+ "aria-selected": selected,
2785
+ "data-selected": selected ? "" : void 0,
2786
+ onClick: () => update({ minutes: m }),
2787
+ className: cn(
2788
+ "grid h-8 w-12 place-items-center rounded-sm text-sm transition-colors hover:bg-muted",
2789
+ selected && "bg-primary text-primary-foreground hover:bg-primary"
2790
+ ),
2791
+ children: String(m).padStart(2, "0")
2792
+ },
2793
+ m
2794
+ );
2795
+ })
2796
+ }
2797
+ )
2798
+ ] })
2799
+ }
2800
+ ) }) }) }),
2801
+ name && time && /* @__PURE__ */ jsx(
2802
+ "input",
2803
+ {
2804
+ type: "hidden",
2805
+ name,
2806
+ value: `${String(time.hours).padStart(2, "0")}:${String(time.minutes).padStart(2, "0")}`
2807
+ }
2808
+ )
2809
+ ] });
2810
+ });
2811
+ var defaultFormat3 = (d) => d.toLocaleDateString(void 0, { year: "numeric", month: "short", day: "numeric" });
2812
+ var DateRangePicker = forwardRef(
2813
+ function DateRangePicker2({
2814
+ value,
2815
+ defaultValue,
2816
+ onChange,
2817
+ placeholder = "Pick a range",
2818
+ format = defaultFormat3,
2819
+ min,
2820
+ max,
2821
+ isDisabled: dayDisabled,
2822
+ invalid,
2823
+ name,
2824
+ size,
2825
+ state,
2826
+ className,
2827
+ disabled,
2828
+ onClick,
2829
+ ...rest
2830
+ }, forwardedRef) {
2831
+ const [range, setRange] = useControlled({
2832
+ controlled: value,
2833
+ default: defaultValue ?? null,
2834
+ onChange
2835
+ });
2836
+ const [open, setOpen] = useControlled({
2837
+ controlled: void 0,
2838
+ default: false
2839
+ });
2840
+ const triggerRef = useRef(null);
2841
+ const triggerState = state ?? (invalid ? "invalid" : "default");
2842
+ const wasComplete = useRef(false);
2843
+ useEffect(() => {
2844
+ const complete = !!(range?.start && range?.end);
2845
+ if (complete && !wasComplete.current && open) {
2846
+ setOpen(false);
2847
+ requestAnimationFrame(() => triggerRef.current?.focus());
2848
+ }
2849
+ wasComplete.current = complete;
2850
+ }, [range, open, setOpen]);
2851
+ const display = range?.start ? range.end ? `${format(range.start)} \u2192 ${format(range.end)}` : `${format(range.start)} \u2192 \u2026` : null;
2852
+ return /* @__PURE__ */ jsxs(Fragment, { children: [
2853
+ /* @__PURE__ */ jsxs(
2854
+ "button",
2855
+ {
2856
+ ref: composeRefs(forwardedRef, triggerRef),
2857
+ type: "button",
2858
+ "aria-haspopup": "dialog",
2859
+ "aria-expanded": open,
2860
+ "data-state": open ? "open" : "closed",
2861
+ disabled,
2862
+ onClick: (e) => {
2863
+ onClick?.(e);
2864
+ if (e.defaultPrevented) return;
2865
+ setOpen(!open);
2866
+ },
2867
+ className: cn(selectTriggerVariants({ size, state: triggerState }), className),
2868
+ ...rest,
2869
+ children: [
2870
+ /* @__PURE__ */ jsx("span", { className: cn("truncate", !display && "text-subtle-foreground"), children: display ?? placeholder }),
2871
+ /* @__PURE__ */ jsx(Calendar$1, { className: "h-4 w-4 shrink-0 text-muted-foreground" })
2872
+ ]
2873
+ }
2874
+ ),
2875
+ open && /* @__PURE__ */ jsx(Portal, { children: /* @__PURE__ */ jsx(AnchoredPositioner, { anchor: triggerRef.current, placement: "bottom-start", offset: 6, children: /* @__PURE__ */ jsx(FocusScope, { asChild: true, trapped: true, loop: true, children: /* @__PURE__ */ jsx(
2876
+ DismissableLayer,
2877
+ {
2878
+ onEscape: () => {
2879
+ setOpen(false);
2880
+ requestAnimationFrame(() => triggerRef.current?.focus());
2881
+ },
2882
+ onOutsidePointerDown: (e) => {
2883
+ if (triggerRef.current?.contains(e.target)) return;
2884
+ setOpen(false);
2885
+ },
2886
+ children: /* @__PURE__ */ jsx(
2887
+ RangeCalendar,
2888
+ {
2889
+ value: range,
2890
+ onChange: setRange,
2891
+ defaultMonth: range?.start ?? /* @__PURE__ */ new Date(),
2892
+ min,
2893
+ max,
2894
+ isDisabled: dayDisabled,
2895
+ className: "shadow-md"
2896
+ }
2897
+ )
2898
+ }
2899
+ ) }) }) }),
2900
+ name && /* @__PURE__ */ jsxs(Fragment, { children: [
2901
+ /* @__PURE__ */ jsx("input", { type: "hidden", name: `${name}_start`, value: formatISODate(range?.start) }),
2902
+ /* @__PURE__ */ jsx("input", { type: "hidden", name: `${name}_end`, value: formatISODate(range?.end) })
2903
+ ] })
2904
+ ] });
2905
+ }
2906
+ );
2907
+
2908
+ export { Calendar, CharacterCount, Checkbox, CheckboxField, CheckboxGroup, ChoiceCard, Combobox, ComboboxContent, ComboboxEmpty, ComboboxGroup, ComboboxInput, ComboboxItem, ComboboxSeparator, CurrencyInput, DateField, DatePicker, DateRangePicker, EmailInput, Fieldset, FilePicker, FormErrorMessage, FormField, FormHelperText, InputAddon, InputGroup, Label, LabeledInput, Legend, Listbox, ListboxEmpty, ListboxGroup, ListboxItem, ListboxSeparator, MaskedInput, MultiSelect, MultiSelectContent, MultiSelectItem, MultiSelectTags, MultiSelectTrigger, NumberInput, PasswordInput, PasswordStrength, PercentInput, PinInput, Radio, RadioField, RadioGroup, RangeCalendar, SearchInput, Select, SelectContent, SelectItem, SelectTrigger, SelectValue, Slider, Switch, SwitchField, TelInput, TextInput, Textarea, TimeField, TimePicker, UrlInput };
2909
+ //# sourceMappingURL=chunk-PFM3IQKM.js.map
2910
+ //# sourceMappingURL=chunk-PFM3IQKM.js.map