@wow-two-beta/ui 0.0.68 → 0.0.70

package/dist/{chunk-HPA5BHDK.js → chunk-KD6MJOL5.js}

@@ -1,6 +1,6 @@
+import { startOfMonth, today, isSameDay, isToday, isDateDisabled, parseISODate, formatISODate, parseISOTime, formatISOTime, Tag, addMonths, Kbd, addDays, sundayIndex, buildMonthGrid, MONTHS_LONG, WEEKDAYS_SHORT, isInRange, daysInMonth } from './chunk-SIAFOCT4.js';
 import { listboxItemVariants, listboxVariants, listboxGroupLabelVariants, listboxSeparatorVariants, listboxEmptyVariants } from './chunk-UMRRFZ4R.js';
 import { PopoverTrigger, Popover, PopoverContent } from './chunk-XFUD3RZK.js';
-import { startOfMonth, isSameDay, isToday, isDateDisabled, parseISODate, formatISODate, parseISOTime, Tag, addMonths, Kbd, addDays, buildMonthGrid, MONTHS_LONG, WEEKDAYS_SHORT, formatISOTime, startOfDay, isInRange } from './chunk-3BKZLK7D.js';
 import { useControlled, useTypeahead } from './chunk-RNHY33US.js';
 import { Icon } from './chunk-D7ZFCHX5.js';
 import { tv, CssExtensions, ColorExtensions, dataAttr, surfaceVariants, Equality } from './chunk-XSW3NZDD.js';
@@ -11,6 +11,7 @@ import * as React from 'react';
 import { forwardRef, useRef, useImperativeHandle, useState, useEffect, Children, isValidElement, cloneElement, useId as useId$1, createContext, useMemo, useCallback, Fragment as Fragment$1, useContext } from 'react';
 import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
 import { Minus, Plus, EyeOff, Eye, Search, X, Check, Upload, Loader2, ChevronDown, Calendar as Calendar$1, Clock, UploadCloud, ChevronRight, Copy, Zap, Wallet, Video, User, Trash, Tag as Tag$1, Sun, Star, ShoppingCart, Share2, Settings, Send, Play, Pin, Phone, Pencil, Paperclip, Music, Moon, Mic, MessageCircle, Map as Map$1, Mail, Lock, Link2, Lightbulb, Layers, Info, Inbox, Image, Home, Heart, Globe, Folder, File, ExternalLink, Edit, Download, Compass, Coffee, Code, Cloud, Camera, Bookmark, Bell, ChevronLeft, Heading1, Heading2, Bold, Italic, List, Quote } from 'lucide-react';
+import { Temporal } from '@js-temporal/polyfill';
 import { Marked } from 'marked';
 
 var SIZE = {
@@ -2683,7 +2684,7 @@ function MonthGrid({
   useEffect(() => {
     if (!interactedRef.current) return;
     const cell = gridRef.current?.querySelector(
-      `[data-date="${focusedDate.toDateString()}"]`
+      `[data-date="${focusedDate.toString()}"]`
     );
     cell?.focus();
   }, [focusedDate]);
@@ -2714,7 +2715,7 @@ function MonthGrid({
         if (isDayDisabled(target)) return;
       }
       interactedRef.current = true;
-      if (target.getMonth() !== viewMonth.getMonth() || target.getFullYear() !== viewMonth.getFullYear()) {
+      if (target.month !== viewMonth.month || target.year !== viewMonth.year) {
         onViewMonthChange(startOfMonth(target));
       }
       onFocusedDateChange(target);
@@ -2742,11 +2743,11 @@ function MonthGrid({
           break;
         case "Home":
           e.preventDefault();
-          moveFocus(addDays(date, -date.getDay()), 1);
+          moveFocus(addDays(date, -sundayIndex(date)), 1);
           break;
         case "End":
           e.preventDefault();
-          moveFocus(addDays(date, 6 - date.getDay()), -1);
+          moveFocus(addDays(date, 6 - sundayIndex(date)), -1);
           break;
         case "PageDown":
           e.preventDefault();
@@ -2766,7 +2767,7 @@ function MonthGrid({
     [moveFocus, onDayActivate, isDayDisabled]
   );
   const dayDisabled = (date) => isDayDisabled?.(date) ?? false;
-  const cells = buildMonthGrid(viewMonth.getFullYear(), viewMonth.getMonth());
+  const cells = buildMonthGrid(viewMonth.year, viewMonth.month);
   const weeks = Array.from({ length: 6 }, (_, w) => cells.slice(w * 7, w * 7 + 7));
   let tabStopDate = focusedDate;
   if (dayDisabled(focusedDate)) {
@@ -2794,9 +2795,9 @@ function MonthGrid({
             }
           ),
           /* @__PURE__ */ jsxs("div", { className: "text-sm font-medium", "aria-live": "polite", children: [
-            MONTHS_LONG[viewMonth.getMonth()],
+            MONTHS_LONG[viewMonth.month - 1],
             " ",
-            viewMonth.getFullYear()
+            viewMonth.year
           ] }),
           /* @__PURE__ */ jsx(
             "button",
@@ -2827,7 +2828,7 @@ function MonthGrid({
             {
               type: "button",
               role: "gridcell",
-              "data-date": date.toDateString(),
+              "data-date": date.toString(),
               "aria-disabled": disabled || void 0,
               "data-today": isToday(date) ? "" : void 0,
               "data-out-of-month": outOfMonth ? "" : void 0,
@@ -2850,9 +2851,9 @@ function MonthGrid({
                 disabled && "pointer-events-none opacity-40",
                 cellClassName
               ),
-              children: date.getDate()
+              children: date.day
             },
-            date.toDateString()
+            date.toString()
           );
         }) }, weekIndex)) })
       ]
@@ -2877,9 +2878,9 @@ var Calendar = forwardRef(function Calendar2({
     onChange: onValueChange
   });
   const [viewMonth, setViewMonth] = useState(
-    () => startOfMonth(defaultMonth ?? selected ?? /* @__PURE__ */ new Date())
+    () => startOfMonth(defaultMonth ?? selected ?? today())
   );
-  const [focusedDate, setFocusedDate] = useState(() => selected ?? /* @__PURE__ */ new Date());
+  const [focusedDate, setFocusedDate] = useState(() => selected ?? today());
   return /* @__PURE__ */ jsx("div", { ref, className: cn(className), ...rest, children: /* @__PURE__ */ jsx(
     MonthGrid,
     {
@@ -2931,12 +2932,6 @@ var DateField = forwardRef(function DateField2({ value, defaultValue, onValueCha
     }
   );
 });
-function timeToString(t) {
-  if (!t) return "";
-  const date = /* @__PURE__ */ new Date();
-  date.setHours(t.hours, t.minutes, 0, 0);
-  return formatISOTime(date);
-}
 var TimeField = forwardRef(function TimeField2({ value, defaultValue, onValueChange, size, state, className, id, disabled, required, ...rest }, ref) {
   const ctx = useFormControl();
   const [current, setCurrent] = useControlled({
@@ -2954,7 +2949,7 @@ var TimeField = forwardRef(function TimeField2({ value, defaultValue, onValueCha
       required: required ?? ctx?.isRequired,
       "aria-invalid": ctx?.isInvalid || void 0,
       "aria-describedby": ctx ? `${ctx.helperId} ${ctx.errorId}` : void 0,
-      value: timeToString(current),
+      value: formatISOTime(current),
       onChange: (e) => setCurrent(parseISOTime(e.target.value)),
       className: cn(inputBaseVariants({ size, state: state ?? (ctx?.isInvalid ? "invalid" : "default") }), className),
       ...rest
@@ -2980,28 +2975,29 @@ var RangeCalendar = forwardRef(
       onChange: onValueChange
     });
     const [viewMonth, setViewMonth] = useState(
-      () => startOfMonth(defaultMonth ?? range?.start ?? /* @__PURE__ */ new Date())
+      () => startOfMonth(defaultMonth ?? range?.start ?? today())
+    );
+    const [focusedDate, setFocusedDate] = useState(
+      () => range?.start ?? today()
     );
-    const [focusedDate, setFocusedDate] = useState(() => range?.start ?? /* @__PURE__ */ new Date());
     const [hoveredDate, setHoveredDate] = useState(null);
     const [pendingStart, setPendingStart] = useState(null);
     const handleActivate = (date) => {
       if (!pendingStart) {
         setPendingStart(date);
-        setRange({ start: date, end: null });
+        setRange(null);
         return;
       }
-      const startTime = startOfDay(pendingStart).getTime();
-      const endTime = startOfDay(date).getTime();
-      const finalStart = startTime <= endTime ? pendingStart : date;
-      const finalEnd = startTime <= endTime ? date : pendingStart;
+      const forward = Temporal.PlainDate.compare(pendingStart, date) <= 0;
+      const finalStart = forward ? pendingStart : date;
+      const finalEnd = forward ? date : pendingStart;
       setRange({ start: finalStart, end: finalEnd });
       setPendingStart(null);
     };
-    const previewEnd = pendingStart ? hoveredDate : range?.end;
+    const previewEnd = pendingStart ? hoveredDate : range?.end ?? null;
     const isStart = (d) => isSameDay(d, range?.start ?? null) || isSameDay(d, pendingStart);
     const isEnd = (d) => isSameDay(d, range?.end ?? null);
-    const inRange = (d) => isInRange(d, pendingStart ?? range?.start, previewEnd ?? null);
+    const inRange = (d) => isInRange(d, pendingStart ?? range?.start, previewEnd);
     return /* @__PURE__ */ jsx("div", { ref, className: cn(className), ...rest, children: /* @__PURE__ */ jsx(
       MonthGrid,
       {
@@ -3037,7 +3033,7 @@ var RangeCalendar = forwardRef(
     ) });
   }
 );
-var defaultFormat = (d) => d.toLocaleDateString(void 0, { year: "numeric", month: "short", day: "numeric" });
+var defaultFormat = (d) => d.toLocaleString(void 0, { year: "numeric", month: "short", day: "numeric" });
 var DatePicker = forwardRef(function DatePicker2({
   value,
   defaultValue,
@@ -3088,7 +3084,7 @@ var DatePicker = forwardRef(function DatePicker2({
           setDate(d);
           setOpen(false);
         },
-        defaultMonth: date ?? /* @__PURE__ */ new Date(),
+        defaultMonth: date ?? today(),
         min,
         max,
         isDisabled: dayDisabled
@@ -3097,7 +3093,7 @@ var DatePicker = forwardRef(function DatePicker2({
     name && /* @__PURE__ */ jsx("input", { type: "hidden", name, value: formatISODate(date) })
   ] });
 });
-var defaultFormat2 = (t) => `${String(t.hours).padStart(2, "0")}:${String(t.minutes).padStart(2, "0")}`;
+var defaultFormat2 = (t) => t.toString({ smallestUnit: "minute" });
 var HOURS = Array.from({ length: 24 }, (_, i) => i);
 var TimePicker = forwardRef(function TimePicker2({
   value,
@@ -3139,10 +3135,10 @@ var TimePicker = forwardRef(function TimePicker2({
   }, [open]);
   const triggerState = state ?? (isInvalid ? "invalid" : "default");
   const update = (next) => {
-    const merged = {
-      hours: next.hours ?? time?.hours ?? 0,
-      minutes: next.minutes ?? time?.minutes ?? 0
-    };
+    const merged = Temporal.PlainTime.from({
+      hour: next.hour ?? time?.hour ?? 0,
+      minute: next.minute ?? time?.minute ?? 0
+    });
     setTime(merged);
   };
   return /* @__PURE__ */ jsxs(Popover, { open, onOpenChange: setOpen, placement: "bottom-start", offset: 6, children: [
@@ -3169,7 +3165,7 @@ var TimePicker = forwardRef(function TimePicker2({
           "aria-label": "Hours",
           className: "flex max-h-56 flex-col gap-0.5 overflow-y-auto pr-1",
           children: HOURS.map((h) => {
-            const selected = time?.hours === h;
+            const selected = time?.hour === h;
             return /* @__PURE__ */ jsx(
               "button",
               {
@@ -3177,7 +3173,7 @@ var TimePicker = forwardRef(function TimePicker2({
                 role: "option",
                 "aria-selected": selected,
                 "data-selected": selected ? "" : void 0,
-                onClick: () => update({ hours: h }),
+                onClick: () => update({ hour: h }),
                 className: cn(
                   "grid h-8 w-12 place-items-center rounded-sm text-sm transition-colors hover:bg-muted",
                   selected && "bg-primary text-primary-foreground hover:bg-primary"
@@ -3198,7 +3194,7 @@ var TimePicker = forwardRef(function TimePicker2({
           "aria-label": "Minutes",
           className: "flex max-h-56 flex-col gap-0.5 overflow-y-auto pl-1",
           children: minutes.map((m) => {
-            const selected = time?.minutes === m;
+            const selected = time?.minute === m;
             return /* @__PURE__ */ jsx(
               "button",
               {
@@ -3206,7 +3202,7 @@ var TimePicker = forwardRef(function TimePicker2({
                 role: "option",
                 "aria-selected": selected,
                 "data-selected": selected ? "" : void 0,
-                onClick: () => update({ minutes: m }),
+                onClick: () => update({ minute: m }),
                 className: cn(
                   "grid h-8 w-12 place-items-center rounded-sm text-sm transition-colors hover:bg-muted",
                   selected && "bg-primary text-primary-foreground hover:bg-primary"
@@ -3219,17 +3215,10 @@ var TimePicker = forwardRef(function TimePicker2({
         }
       )
     ] }) }),
-    name && time && /* @__PURE__ */ jsx(
-      "input",
-      {
-        type: "hidden",
-        name,
-        value: `${String(time.hours).padStart(2, "0")}:${String(time.minutes).padStart(2, "0")}`
-      }
-    )
+    name && time && /* @__PURE__ */ jsx("input", { type: "hidden", name, value: time.toString({ smallestUnit: "minute" }) })
   ] });
 });
-var defaultFormat3 = (d) => d.toLocaleDateString(void 0, { year: "numeric", month: "short", day: "numeric" });
+var defaultFormat3 = (d) => d.toLocaleString(void 0, { year: "numeric", month: "short", day: "numeric" });
 var DateRangePicker = forwardRef(
   function DateRangePicker2({
     value,
@@ -3287,7 +3276,7 @@ var DateRangePicker = forwardRef(
         {
           value: range,
           onValueChange: setRange,
-          defaultMonth: range?.start ?? /* @__PURE__ */ new Date(),
+          defaultMonth: range?.start ?? today(),
           min,
           max,
           isDisabled: dayDisabled
@@ -4052,6 +4041,8 @@ function ColorSwatchPicker({
   );
 }
 var FALLBACK_HSV = { h: 217, s: 0.91, v: 0.96, a: 1 };
+var NOOP = () => {
+};
 var ColorPicker = forwardRef(function ColorPicker2({
   value,
   defaultValue = "#3b82f6",
@@ -4059,6 +4050,7 @@ var ColorPicker = forwardRef(function ColorPicker2({
   hasAlpha = false,
   presets,
   triggerSize = "md",
+  triggerVariant = "full",
   isDisabled = false,
   name,
   className,
@@ -4085,7 +4077,22 @@ var ColorPicker = forwardRef(function ColorPicker2({
     setHex(hsvToHex(next, { withAlpha: hasAlpha }));
   };
   return /* @__PURE__ */ jsxs(Popover, { children: [
-    /* @__PURE__ */ jsx(PopoverTrigger, { asChild: true, children: trigger ?? /* @__PURE__ */ jsxs(
+    /* @__PURE__ */ jsx(PopoverTrigger, { asChild: true, children: trigger ?? (triggerVariant === "swatch" ? (
+      // Bare interactive swatch — ColorSwatch is a real <button> here (given onClick),
+      // so it becomes the popover trigger via Slot with no wrapper chrome.
+      /* @__PURE__ */ jsx(
+        ColorSwatch,
+        {
+          ref,
+          color: hex ?? "#00000000",
+          size: triggerSize,
+          onClick: NOOP,
+          "aria-label": ariaLabel,
+          isDisabled,
+          className
+        }
+      )
+    ) : /* @__PURE__ */ jsxs(
       "button",
       {
         ref,
@@ -4097,11 +4104,11 @@ var ColorPicker = forwardRef(function ColorPicker2({
           className
         ),
         children: [
-          /* @__PURE__ */ jsx(ColorSwatch, { color: hex ?? "#00000000", size: triggerSize }),
+          triggerVariant === "full" && /* @__PURE__ */ jsx(ColorSwatch, { color: hex ?? "#00000000", size: triggerSize }),
           /* @__PURE__ */ jsx("span", { className: "font-mono uppercase", children: hex ?? "\u2014" })
         ]
       }
-    ) }),
+    )) }),
     /* @__PURE__ */ jsxs(PopoverContent, { className: "flex w-64 flex-col gap-3", children: [
       /* @__PURE__ */ jsx(
         ColorArea,
@@ -5762,13 +5769,13 @@ function nextOccurrence(rule, prev) {
       if (!rule.byDay || rule.byDay.length === 0) return addDays(prev, 7 * rule.interval);
       const allowed = new Set(rule.byDay);
       let cursor = addDays(prev, 1);
-      while (cursor.getDay() !== 0) {
-        if (allowed.has(JS_TO_RRULE[cursor.getDay()])) return cursor;
+      while (sundayIndex(cursor) !== 0) {
+        if (allowed.has(JS_TO_RRULE[sundayIndex(cursor)])) return cursor;
         cursor = addDays(cursor, 1);
       }
       cursor = addDays(cursor, 7 * (rule.interval - 1));
       for (let i = 0; i < 7; i++) {
-        if (allowed.has(JS_TO_RRULE[cursor.getDay()])) return cursor;
+        if (allowed.has(JS_TO_RRULE[sundayIndex(cursor)])) return cursor;
         cursor = addDays(cursor, 1);
       }
       return null;
@@ -5776,25 +5783,23 @@ function nextOccurrence(rule, prev) {
     case "MONTHLY": {
       const next = addMonths(prev, rule.interval);
       if (rule.byMonthDay) {
-        next.setDate(rule.byMonthDay);
+        const day = Math.min(rule.byMonthDay, daysInMonth(next.year, next.month));
+        return next.with({ day });
       }
       return next;
     }
-    case "YEARLY": {
-      const c = new Date(prev);
-      c.setFullYear(c.getFullYear() + rule.interval);
-      return c;
-    }
+    case "YEARLY":
+      return prev.add({ years: rule.interval });
   }
 }
 function buildPreview(rule, from, count) {
   const out = [];
   let cursor = from;
-  out.push(new Date(cursor));
+  out.push(cursor);
   for (let i = 0; i < count - 1; i++) {
     const next = nextOccurrence(rule, cursor);
     if (!next) break;
-    if (rule.until && next > rule.until) break;
+    if (rule.until && Temporal.PlainDate.compare(next, rule.until) > 0) break;
     if (rule.count && out.length >= rule.count) break;
     out.push(next);
     cursor = next;
@@ -5807,7 +5812,7 @@ var RecurrenceEditor = forwardRef(
     value,
     defaultValue,
     onValueChange,
-    from = /* @__PURE__ */ new Date(),
+    from = today(),
     previewCount = 5,
     isDisabled,
     isReadOnly,
@@ -5908,7 +5913,7 @@ var RecurrenceEditor = forwardRef(
                 type: "number",
                 min: 1,
                 max: 31,
-                value: rule.byMonthDay ?? from.getDate(),
+                value: rule.byMonthDay ?? from.day,
                 disabled: isDisabled,
                 readOnly: isReadOnly,
                 onChange: (e) => update({ byMonthDay: Math.min(31, Math.max(1, Number(e.target.value) || 1)) }),
@@ -7790,5 +7795,5 @@ var ChatComposer = forwardRef(
 ChatComposer.displayName = "ChatComposer";
 
 export { ADDRESS_COUNTRIES, AddressForm, BUILT_IN_EMOJI, BUILT_IN_FONTS, Calendar, CharacterCount, ChatComposer, Checkbox, CheckboxField, CheckboxGroup, ChoiceCard, CodeEditor, ColorArea, ColorField, ColorPicker, ColorSlider, ColorSwatch, ColorSwatchPicker, ColorWheel, Combobox, ComboboxContent, ComboboxEmpty, ComboboxGroup, ComboboxInput, ComboboxItem, ComboboxSeparator, CronInput, CurrencyInput, DateField, DatePicker, DateRangePicker, Editable, EditableCancel, EditableInput, EditablePreview, EditableSubmit, EmailInput, EmojiPicker, Field, Fieldset, FilePicker, FileUpload, FontPicker, FormErrorMessage, FormHelperText, GradientPicker, IconPicker, InputAddon, InputGroup, JSONEditor, KeyboardShortcutPicker, Knob, Label, LabeledInput, Legend, Listbox, ListboxEmpty, ListboxGroup, ListboxItem, ListboxSeparator, MarkdownEditor, MaskedInput, MultiSelect, MultiSelectContent, MultiSelectItem, MultiSelectTags, MultiSelectTrigger, NumberInput, PHONE_COUNTRIES, PasswordInput, PasswordStrength, PercentInput, PhoneInput, PinInput, Radio, RadioField, RadioGroup, RangeCalendar, ReactionPicker, RecurrenceEditor, SearchInput, Select, SelectContent, SelectItem, SelectTrigger, SelectValue, Slider, Stepper2 as Stepper, StepperList, StepperPanel, StepperStep, Switch, SwitchField, TagsInput, TelInput, TextInput, TextareaInput, TimeField, TimePicker, UrlInput, Wizard2 as Wizard, WizardFooter, WizardStep, WizardSteps, colorSwatchVariants, gradientToCss, useWizard };
-//# sourceMappingURL=chunk-HPA5BHDK.js.map
-//# sourceMappingURL=chunk-HPA5BHDK.js.map
+//# sourceMappingURL=chunk-KD6MJOL5.js.map
+//# sourceMappingURL=chunk-KD6MJOL5.js.map