@vesture/react 0.2.0 → 0.2.2

package/dist/index.js

@@ -1712,6 +1712,1492 @@ function DataGrid({
   ] });
 }
 
+// src/components/Calendar/Calendar.tsx
+import { useEffect as useEffect2, useMemo as useMemo3, useRef as useRef4, useState as useState9 } from "react";
+
+// src/components/Calendar/Calendar.css.ts
+var dayButton = "Calendar_dayButton__1uy43my8";
+var dayCell = "Calendar_dayCell__1uy43my7";
+var grid = "Calendar_grid__1uy43my4";
+var header = "Calendar_header__1uy43my1";
+var monthLabel = "Calendar_monthLabel__1uy43my2";
+var navButton = "Calendar_navButton__1uy43my3";
+var root2 = "Calendar_root__1uy43my0";
+var weekRow = "Calendar_weekRow__1uy43my5";
+var weekdayCell = "Calendar_weekdayCell__1uy43my6";
+
+// src/components/Calendar/Calendar.tsx
+import { jsx as jsx35, jsxs as jsxs18 } from "react/jsx-runtime";
+function startOfMonth(date) {
+  return new Date(date.getFullYear(), date.getMonth(), 1);
+}
+function endOfMonth(date) {
+  return new Date(date.getFullYear(), date.getMonth() + 1, 0);
+}
+function addDays(date, amount) {
+  const next = new Date(date);
+  next.setDate(next.getDate() + amount);
+  return next;
+}
+function addMonths(date, amount) {
+  const next = new Date(date);
+  next.setMonth(next.getMonth() + amount);
+  return next;
+}
+function isSameDay(a, b) {
+  return a.getFullYear() === b.getFullYear() && a.getMonth() === b.getMonth() && a.getDate() === b.getDate();
+}
+function isSameMonth(a, b) {
+  return a.getFullYear() === b.getFullYear() && a.getMonth() === b.getMonth();
+}
+function clampToMidnight(date) {
+  return new Date(date.getFullYear(), date.getMonth(), date.getDate());
+}
+function startOfWeek(date, weekStartsOn) {
+  const diff = (date.getDay() - weekStartsOn + 7) % 7;
+  return addDays(date, -diff);
+}
+function endOfWeek(date, weekStartsOn) {
+  return addDays(startOfWeek(date, weekStartsOn), 6);
+}
+function dateKey(date) {
+  return `${date.getFullYear()}-${date.getMonth()}-${date.getDate()}`;
+}
+function getCalendarWeeks(month, weekStartsOn) {
+  const gridStart = startOfWeek(startOfMonth(month), weekStartsOn);
+  const gridEnd = endOfWeek(endOfMonth(month), weekStartsOn);
+  const weeks = [];
+  let cursor = gridStart;
+  while (cursor <= gridEnd) {
+    const week = [];
+    for (let i = 0; i < 7; i++) {
+      week.push(cursor);
+      cursor = addDays(cursor, 1);
+    }
+    weeks.push(week);
+  }
+  return weeks;
+}
+function isDateDisabledBy(date, minDate, maxDate, isDateDisabled) {
+  const target = clampToMidnight(date);
+  if (minDate && target < clampToMidnight(minDate)) return true;
+  if (maxDate && target > clampToMidnight(maxDate)) return true;
+  if (isDateDisabled?.(target)) return true;
+  return false;
+}
+function findEnabledDate(date, direction2, minDate, maxDate, isDateDisabled) {
+  let cursor = date;
+  for (let i = 0; i < 366; i++) {
+    if (!isDateDisabledBy(cursor, minDate, maxDate, isDateDisabled)) {
+      return cursor;
+    }
+    cursor = addDays(cursor, direction2);
+  }
+  return null;
+}
+function getFocusableDate(month, value, minDate, maxDate, isDateDisabled) {
+  if (value && isSameMonth(value, month) && !isDateDisabledBy(value, minDate, maxDate, isDateDisabled)) {
+    return clampToMidnight(value);
+  }
+  const today = clampToMidnight(/* @__PURE__ */ new Date());
+  if (isSameMonth(today, month) && !isDateDisabledBy(today, minDate, maxDate, isDateDisabled)) {
+    return today;
+  }
+  const firstEnabled = findEnabledDate(
+    startOfMonth(month),
+    1,
+    minDate,
+    maxDate,
+    isDateDisabled
+  );
+  if (firstEnabled && isSameMonth(firstEnabled, month)) {
+    return firstEnabled;
+  }
+  return startOfMonth(month);
+}
+function Calendar({
+  value: controlledValue,
+  defaultValue = null,
+  onChange,
+  month: controlledMonth,
+  onMonthChange,
+  minDate,
+  maxDate,
+  isDateDisabled,
+  weekStartsOn = 1,
+  locale = "en-US",
+  rangeEnd
+}) {
+  const [uncontrolledValue, setUncontrolledValue] = useState9(
+    defaultValue
+  );
+  const value = controlledValue !== void 0 ? controlledValue : uncontrolledValue;
+  const setValue = (next) => {
+    if (controlledValue === void 0) {
+      setUncontrolledValue(next);
+    }
+    onChange?.(next);
+  };
+  const [uncontrolledMonth, setUncontrolledMonth] = useState9(
+    () => startOfMonth(controlledMonth ?? value ?? /* @__PURE__ */ new Date())
+  );
+  const month = controlledMonth !== void 0 ? startOfMonth(controlledMonth) : uncontrolledMonth;
+  const setMonth = (next) => {
+    const normalized = startOfMonth(next);
+    if (controlledMonth === void 0) {
+      setUncontrolledMonth(normalized);
+    }
+    onMonthChange?.(normalized);
+  };
+  const [rovingDate, setRovingDate] = useState9(
+    () => getFocusableDate(month, value, minDate, maxDate, isDateDisabled)
+  );
+  const shouldFocusRef = useRef4(false);
+  const dayRefs = useRef4(/* @__PURE__ */ new Map());
+  useEffect2(() => {
+    setRovingDate((prev) => {
+      if (isSameMonth(prev, month)) return prev;
+      return getFocusableDate(month, value, minDate, maxDate, isDateDisabled);
+    });
+  }, [month]);
+  useEffect2(() => {
+    if (!shouldFocusRef.current) return;
+    shouldFocusRef.current = false;
+    dayRefs.current.get(dateKey(rovingDate))?.focus();
+  }, [rovingDate, month]);
+  const weeks = useMemo3(
+    () => getCalendarWeeks(month, weekStartsOn),
+    [month, weekStartsOn]
+  );
+  const today = useMemo3(() => clampToMidnight(/* @__PURE__ */ new Date()), []);
+  const monthLabelFormatter = useMemo3(
+    () => new Intl.DateTimeFormat(locale, { month: "long", year: "numeric" }),
+    [locale]
+  );
+  const weekdayFormatter = useMemo3(
+    () => new Intl.DateTimeFormat(locale, { weekday: "short" }),
+    [locale]
+  );
+  const handleDayClick = (date, disabled, inMonth) => {
+    if (disabled) return;
+    if (!inMonth) {
+      setMonth(startOfMonth(date));
+      return;
+    }
+    const normalized = clampToMidnight(date);
+    setValue(normalized);
+    setRovingDate(normalized);
+  };
+  const handleKeyDown = (event, date) => {
+    let targetRaw;
+    let direction2;
+    switch (event.key) {
+      case "ArrowLeft":
+        targetRaw = addDays(date, -1);
+        direction2 = -1;
+        break;
+      case "ArrowRight":
+        targetRaw = addDays(date, 1);
+        direction2 = 1;
+        break;
+      case "ArrowUp":
+        targetRaw = addDays(date, -7);
+        direction2 = -1;
+        break;
+      case "ArrowDown":
+        targetRaw = addDays(date, 7);
+        direction2 = 1;
+        break;
+      case "Home":
+        targetRaw = startOfWeek(date, weekStartsOn);
+        direction2 = -1;
+        break;
+      case "End":
+        targetRaw = endOfWeek(date, weekStartsOn);
+        direction2 = 1;
+        break;
+      case "PageUp":
+        targetRaw = addMonths(date, -1);
+        direction2 = -1;
+        break;
+      case "PageDown":
+        targetRaw = addMonths(date, 1);
+        direction2 = 1;
+        break;
+      default:
+        return;
+    }
+    event.preventDefault();
+    const target = findEnabledDate(
+      targetRaw,
+      direction2,
+      minDate,
+      maxDate,
+      isDateDisabled
+    );
+    if (!target) return;
+    shouldFocusRef.current = true;
+    setRovingDate(target);
+    if (!isSameMonth(target, month)) {
+      setMonth(startOfMonth(target));
+    }
+  };
+  const monthLabelText = monthLabelFormatter.format(month);
+  const clampedValue = value ? clampToMidnight(value) : null;
+  const clampedRangeEnd = rangeEnd ? clampToMidnight(rangeEnd) : null;
+  return /* @__PURE__ */ jsxs18("div", { className: root2, role: "application", "aria-label": monthLabelText, children: [
+    /* @__PURE__ */ jsxs18("div", { className: header, children: [
+      /* @__PURE__ */ jsx35(
+        "button",
+        {
+          type: "button",
+          className: navButton,
+          onClick: () => setMonth(addMonths(month, -1)),
+          "aria-label": "Previous month",
+          children: "\u2039"
+        }
+      ),
+      /* @__PURE__ */ jsx35("span", { className: monthLabel, children: monthLabelText }),
+      /* @__PURE__ */ jsx35(
+        "button",
+        {
+          type: "button",
+          className: navButton,
+          onClick: () => setMonth(addMonths(month, 1)),
+          "aria-label": "Next month",
+          children: "\u203A"
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsxs18("div", { className: grid, role: "grid", "aria-label": monthLabelText, children: [
+      /* @__PURE__ */ jsx35("div", { className: weekRow, role: "row", children: weeks[0].map((date) => /* @__PURE__ */ jsx35(
+        "div",
+        {
+          className: weekdayCell,
+          role: "columnheader",
+          children: weekdayFormatter.format(date)
+        },
+        dateKey(date)
+      )) }),
+      weeks.map((week, weekIndex) => /* @__PURE__ */ jsx35("div", { className: weekRow, role: "row", children: week.map((date) => {
+        const inMonth = isSameMonth(date, month);
+        const disabled = isDateDisabledBy(
+          date,
+          minDate,
+          maxDate,
+          isDateDisabled
+        );
+        const isRangeEndDay = clampedRangeEnd ? isSameDay(date, clampedRangeEnd) : false;
+        const selected = (clampedValue ? isSameDay(date, clampedValue) : false) || isRangeEndDay;
+        const inRange = Boolean(
+          clampedValue && clampedRangeEnd && date > clampedValue && date < clampedRangeEnd
+        );
+        const isToday = isSameDay(date, today);
+        const tabIndex = inMonth && !disabled && isSameDay(date, rovingDate) ? 0 : -1;
+        return /* @__PURE__ */ jsx35("div", { className: dayCell, role: "gridcell", children: /* @__PURE__ */ jsx35(
+          "button",
+          {
+            type: "button",
+            ref: (el) => {
+              if (el) {
+                dayRefs.current.set(dateKey(date), el);
+              } else {
+                dayRefs.current.delete(dateKey(date));
+              }
+            },
+            className: dayButton,
+            "data-outside": !inMonth || void 0,
+            "data-today": isToday || void 0,
+            "data-selected": selected || void 0,
+            "data-in-range": inRange || void 0,
+            disabled,
+            tabIndex,
+            "aria-selected": selected || void 0,
+            "aria-current": isToday ? "date" : void 0,
+            "aria-disabled": disabled || void 0,
+            "aria-label": date.toDateString(),
+            onClick: () => handleDayClick(date, disabled, inMonth),
+            onKeyDown: inMonth ? (e) => handleKeyDown(e, date) : void 0,
+            children: date.getDate()
+          }
+        ) }, dateKey(date));
+      }) }, weekIndex))
+    ] })
+  ] });
+}
+
+// src/components/DatePicker/DatePicker.tsx
+import { useEffect as useEffect3, useRef as useRef5, useState as useState10 } from "react";
+import {
+  FloatingFocusManager as FloatingFocusManager4,
+  FloatingPortal as FloatingPortal5,
+  autoUpdate as autoUpdate4,
+  flip as flip4,
+  offset as offset4,
+  shift as shift4,
+  useDismiss as useDismiss5,
+  useFloating as useFloating5,
+  useInteractions as useInteractions5,
+  useRole as useRole5
+} from "@floating-ui/react";
+
+// src/components/DatePicker/DatePicker.css.ts
+var dateInput = "DatePicker_dateInput__d7uy1a1";
+var iconButton2 = "DatePicker_iconButton__d7uy1a2";
+var popover2 = "DatePicker_popover__d7uy1a3";
+var wrapper6 = "DatePicker_wrapper__d7uy1a0";
+
+// src/components/DatePicker/DatePicker.tsx
+import { jsx as jsx36, jsxs as jsxs19 } from "react/jsx-runtime";
+function startOfMonth2(date) {
+  return new Date(date.getFullYear(), date.getMonth(), 1);
+}
+function clampToMidnight2(date) {
+  return new Date(date.getFullYear(), date.getMonth(), date.getDate());
+}
+function isDisabled(date, minDate, maxDate, isDateDisabled) {
+  const target = clampToMidnight2(date);
+  if (minDate && target < clampToMidnight2(minDate)) return true;
+  if (maxDate && target > clampToMidnight2(maxDate)) return true;
+  if (isDateDisabled?.(target)) return true;
+  return false;
+}
+function getDatePartOrder(locale) {
+  const parts = new Intl.DateTimeFormat(locale).formatToParts(
+    new Date(2e3, 0, 2)
+  );
+  return parts.filter(
+    (part) => part.type === "month" || part.type === "day" || part.type === "year"
+  ).map((part) => part.type);
+}
+function getDatePlaceholder(locale) {
+  const parts = new Intl.DateTimeFormat(locale).formatToParts(
+    new Date(2e3, 0, 2)
+  );
+  return parts.map((part) => {
+    switch (part.type) {
+      case "month":
+        return "MM";
+      case "day":
+        return "DD";
+      case "year":
+        return "YYYY";
+      default:
+        return part.value;
+    }
+  }).join("");
+}
+function formatDate(date, locale) {
+  return new Intl.DateTimeFormat(locale).format(date);
+}
+function parseDate(text, locale) {
+  const numbers = text.match(/\d+/g);
+  if (!numbers || numbers.length < 3) return null;
+  const order = getDatePartOrder(locale);
+  if (order.length < 3) return null;
+  const values = {};
+  order.forEach((type, i) => {
+    values[type] = Number.parseInt(numbers[i], 10);
+  });
+  const { month, day, year } = values;
+  if (!month || !day || !year) return null;
+  const fullYear = year < 100 ? 2e3 + year : year;
+  const date = new Date(fullYear, month - 1, day);
+  if (date.getFullYear() !== fullYear || date.getMonth() !== month - 1 || date.getDate() !== day) {
+    return null;
+  }
+  return date;
+}
+function DatePicker({
+  value: controlledValue,
+  defaultValue = null,
+  onChange,
+  minDate,
+  maxDate,
+  isDateDisabled,
+  weekStartsOn = 1,
+  locale = "en-US",
+  placeholder,
+  disabled = false,
+  open: controlledOpen,
+  onOpenChange
+}) {
+  const [uncontrolledValue, setUncontrolledValue] = useState10(
+    defaultValue
+  );
+  const value = controlledValue !== void 0 ? controlledValue : uncontrolledValue;
+  const setValue = (next) => {
+    if (controlledValue === void 0) {
+      setUncontrolledValue(next);
+    }
+    onChange?.(next);
+  };
+  const [uncontrolledOpen, setUncontrolledOpen] = useState10(false);
+  const open = controlledOpen ?? uncontrolledOpen;
+  const setOpen = onOpenChange ?? setUncontrolledOpen;
+  const [month, setMonth] = useState10(
+    () => startOfMonth2(value ?? /* @__PURE__ */ new Date())
+  );
+  const [inputText, setInputText] = useState10(
+    () => value ? formatDate(value, locale) : ""
+  );
+  const inputRef = useRef5(null);
+  useEffect3(() => {
+    setInputText(value ? formatDate(value, locale) : "");
+  }, [value, locale]);
+  useEffect3(() => {
+    if (open && value) {
+      setMonth(startOfMonth2(value));
+    }
+  }, [open]);
+  const { refs, floatingStyles, context } = useFloating5({
+    open,
+    onOpenChange: setOpen,
+    placement: "bottom-start",
+    whileElementsMounted: autoUpdate4,
+    middleware: [offset4(8), flip4(), shift4({ padding: 8 })]
+  });
+  const { getReferenceProps, getFloatingProps } = useInteractions5([
+    useDismiss5(context),
+    useRole5(context, { role: "dialog" })
+  ]);
+  const revertInputText = () => {
+    setInputText(value ? formatDate(value, locale) : "");
+  };
+  const commitTypedValue = () => {
+    const trimmed = inputText.trim();
+    if (!trimmed) {
+      if (value !== null) {
+        setValue(null);
+      }
+      return;
+    }
+    const parsed = parseDate(trimmed, locale);
+    if (!parsed || isDisabled(parsed, minDate, maxDate, isDateDisabled)) {
+      revertInputText();
+      return;
+    }
+    setValue(parsed);
+    setMonth(startOfMonth2(parsed));
+    setInputText(formatDate(parsed, locale));
+  };
+  const handleInputKeyDown = (event) => {
+    if (event.key === "Enter") {
+      event.preventDefault();
+      commitTypedValue();
+    }
+  };
+  const handleCalendarChange = (date) => {
+    setValue(date);
+    setMonth(startOfMonth2(date));
+    setOpen(false);
+  };
+  const placeholderText = placeholder ?? getDatePlaceholder(locale);
+  return /* @__PURE__ */ jsxs19("div", { className: wrapper6, ref: refs.setReference, children: [
+    /* @__PURE__ */ jsx36(
+      "input",
+      {
+        ref: inputRef,
+        type: "text",
+        className: dateInput,
+        value: inputText,
+        placeholder: placeholderText,
+        disabled,
+        onChange: (e) => setInputText(e.target.value),
+        onBlur: commitTypedValue,
+        onKeyDown: handleInputKeyDown,
+        "aria-label": "Date"
+      }
+    ),
+    /* @__PURE__ */ jsx36(
+      "button",
+      {
+        type: "button",
+        className: iconButton2,
+        disabled,
+        "aria-label": open ? "Close calendar" : "Open calendar",
+        ...getReferenceProps({
+          onClick: () => {
+            if (disabled) return;
+            setOpen(!open);
+          }
+        }),
+        children: /* @__PURE__ */ jsxs19(
+          "svg",
+          {
+            width: "16",
+            height: "16",
+            viewBox: "0 0 16 16",
+            fill: "none",
+            "aria-hidden": "true",
+            children: [
+              /* @__PURE__ */ jsx36(
+                "rect",
+                {
+                  x: "1.5",
+                  y: "2.5",
+                  width: "13",
+                  height: "12",
+                  rx: "1.5",
+                  stroke: "currentColor",
+                  strokeWidth: "1.3"
+                }
+              ),
+              /* @__PURE__ */ jsx36("path", { d: "M1.5 6h13", stroke: "currentColor", strokeWidth: "1.3" }),
+              /* @__PURE__ */ jsx36(
+                "path",
+                {
+                  d: "M4.5 1v3M11.5 1v3",
+                  stroke: "currentColor",
+                  strokeWidth: "1.3",
+                  strokeLinecap: "round"
+                }
+              )
+            ]
+          }
+        )
+      }
+    ),
+    open ? /* @__PURE__ */ jsx36(FloatingPortal5, { children: /* @__PURE__ */ jsx36(
+      FloatingFocusManager4,
+      {
+        context,
+        modal: false,
+        returnFocus: inputRef,
+        children: /* @__PURE__ */ jsx36(
+          "div",
+          {
+            ref: refs.setFloating,
+            className: popover2,
+            style: floatingStyles,
+            ...getFloatingProps(),
+            children: /* @__PURE__ */ jsx36(
+              Calendar,
+              {
+                value,
+                onChange: handleCalendarChange,
+                month,
+                onMonthChange: setMonth,
+                minDate,
+                maxDate,
+                isDateDisabled,
+                weekStartsOn,
+                locale
+              }
+            )
+          }
+        )
+      }
+    ) }) : null
+  ] });
+}
+
+// src/components/DateRangePicker/DateRangePicker.tsx
+import { useEffect as useEffect4, useState as useState11 } from "react";
+import {
+  FloatingFocusManager as FloatingFocusManager5,
+  FloatingPortal as FloatingPortal6,
+  autoUpdate as autoUpdate5,
+  flip as flip5,
+  offset as offset5,
+  shift as shift5,
+  useDismiss as useDismiss6,
+  useFloating as useFloating6,
+  useInteractions as useInteractions6,
+  useRole as useRole6
+} from "@floating-ui/react";
+
+// src/components/DateRangePicker/DateRangePicker.css.ts
+var dateInput2 = "DateRangePicker_dateInput__11t25r41";
+var iconButton3 = "DateRangePicker_iconButton__11t25r43";
+var popover3 = "DateRangePicker_popover__11t25r44";
+var separator2 = "DateRangePicker_separator__11t25r42";
+var wrapper7 = "DateRangePicker_wrapper__11t25r40";
+
+// src/components/DateRangePicker/DateRangePicker.tsx
+import { jsx as jsx37, jsxs as jsxs20 } from "react/jsx-runtime";
+function startOfMonth3(date) {
+  return new Date(date.getFullYear(), date.getMonth(), 1);
+}
+function clampToMidnight3(date) {
+  return new Date(date.getFullYear(), date.getMonth(), date.getDate());
+}
+function compareDates(a, b) {
+  const x = clampToMidnight3(a).getTime();
+  const y = clampToMidnight3(b).getTime();
+  if (x < y) return -1;
+  if (x > y) return 1;
+  return 0;
+}
+function isDisabled2(date, minDate, maxDate, isDateDisabled) {
+  const target = clampToMidnight3(date);
+  if (minDate && target < clampToMidnight3(minDate)) return true;
+  if (maxDate && target > clampToMidnight3(maxDate)) return true;
+  if (isDateDisabled?.(target)) return true;
+  return false;
+}
+function getDatePartOrder2(locale) {
+  const parts = new Intl.DateTimeFormat(locale).formatToParts(
+    new Date(2e3, 0, 2)
+  );
+  return parts.filter(
+    (part) => part.type === "month" || part.type === "day" || part.type === "year"
+  ).map((part) => part.type);
+}
+function getDatePlaceholder2(locale) {
+  const parts = new Intl.DateTimeFormat(locale).formatToParts(
+    new Date(2e3, 0, 2)
+  );
+  return parts.map((part) => {
+    switch (part.type) {
+      case "month":
+        return "MM";
+      case "day":
+        return "DD";
+      case "year":
+        return "YYYY";
+      default:
+        return part.value;
+    }
+  }).join("");
+}
+function formatDate2(date, locale) {
+  return new Intl.DateTimeFormat(locale).format(date);
+}
+function parseDate2(text, locale) {
+  const numbers = text.match(/\d+/g);
+  if (!numbers || numbers.length < 3) return null;
+  const order = getDatePartOrder2(locale);
+  if (order.length < 3) return null;
+  const values = {};
+  order.forEach((type, i) => {
+    values[type] = Number.parseInt(numbers[i], 10);
+  });
+  const { month, day, year } = values;
+  if (!month || !day || !year) return null;
+  const fullYear = year < 100 ? 2e3 + year : year;
+  const date = new Date(fullYear, month - 1, day);
+  if (date.getFullYear() !== fullYear || date.getMonth() !== month - 1 || date.getDate() !== day) {
+    return null;
+  }
+  return date;
+}
+var EMPTY_RANGE = { start: null, end: null };
+function DateRangePicker({
+  value: controlledValue,
+  defaultValue = EMPTY_RANGE,
+  onChange,
+  minDate,
+  maxDate,
+  isDateDisabled,
+  weekStartsOn = 1,
+  locale = "en-US",
+  startPlaceholder,
+  endPlaceholder,
+  disabled = false,
+  open: controlledOpen,
+  onOpenChange
+}) {
+  const [uncontrolledValue, setUncontrolledValue] = useState11(defaultValue);
+  const value = controlledValue !== void 0 ? controlledValue : uncontrolledValue;
+  const setValue = (next) => {
+    if (controlledValue === void 0) {
+      setUncontrolledValue(next);
+    }
+    onChange?.(next);
+  };
+  const [uncontrolledOpen, setUncontrolledOpen] = useState11(false);
+  const open = controlledOpen ?? uncontrolledOpen;
+  const setOpen = onOpenChange ?? setUncontrolledOpen;
+  const [month, setMonth] = useState11(
+    () => startOfMonth3(value.start ?? /* @__PURE__ */ new Date())
+  );
+  const [startText, setStartText] = useState11(
+    () => value.start ? formatDate2(value.start, locale) : ""
+  );
+  const [endText, setEndText] = useState11(
+    () => value.end ? formatDate2(value.end, locale) : ""
+  );
+  useEffect4(() => {
+    setStartText(value.start ? formatDate2(value.start, locale) : "");
+  }, [value.start, locale]);
+  useEffect4(() => {
+    setEndText(value.end ? formatDate2(value.end, locale) : "");
+  }, [value.end, locale]);
+  useEffect4(() => {
+    if (open && value.start) {
+      setMonth(startOfMonth3(value.start));
+    }
+  }, [open]);
+  const { refs, floatingStyles, context } = useFloating6({
+    open,
+    onOpenChange: setOpen,
+    placement: "bottom-start",
+    whileElementsMounted: autoUpdate5,
+    middleware: [offset5(8), flip5(), shift5({ padding: 8 })]
+  });
+  const { getReferenceProps, getFloatingProps } = useInteractions6([
+    useDismiss6(context),
+    useRole6(context, { role: "dialog" })
+  ]);
+  const revertStartText = () => {
+    setStartText(value.start ? formatDate2(value.start, locale) : "");
+  };
+  const revertEndText = () => {
+    setEndText(value.end ? formatDate2(value.end, locale) : "");
+  };
+  const commitStartText = () => {
+    const trimmed = startText.trim();
+    if (!trimmed) {
+      if (value.start !== null) {
+        setValue({ start: null, end: value.end });
+      }
+      return;
+    }
+    const parsed = parseDate2(trimmed, locale);
+    if (!parsed || isDisabled2(parsed, minDate, maxDate, isDateDisabled) || value.end && compareDates(parsed, value.end) > 0) {
+      revertStartText();
+      return;
+    }
+    setValue({ start: parsed, end: value.end });
+    setMonth(startOfMonth3(parsed));
+  };
+  const commitEndText = () => {
+    const trimmed = endText.trim();
+    if (!trimmed) {
+      if (value.end !== null) {
+        setValue({ start: value.start, end: null });
+      }
+      return;
+    }
+    const parsed = parseDate2(trimmed, locale);
+    if (!parsed || isDisabled2(parsed, minDate, maxDate, isDateDisabled) || value.start && compareDates(parsed, value.start) < 0) {
+      revertEndText();
+      return;
+    }
+    setValue({ start: value.start, end: parsed });
+    setMonth(startOfMonth3(parsed));
+  };
+  const handleStartKeyDown = (event) => {
+    if (event.key === "Enter") {
+      event.preventDefault();
+      commitStartText();
+    }
+  };
+  const handleEndKeyDown = (event) => {
+    if (event.key === "Enter") {
+      event.preventDefault();
+      commitEndText();
+    }
+  };
+  const handleCalendarChange = (date) => {
+    const { start, end } = value;
+    if (!start || start && end) {
+      setValue({ start: date, end: null });
+      setMonth(startOfMonth3(date));
+      return;
+    }
+    if (compareDates(date, start) < 0) {
+      setValue({ start: date, end: start });
+    } else {
+      setValue({ start, end: date });
+    }
+    setOpen(false);
+  };
+  const startPlaceholderText = startPlaceholder ?? getDatePlaceholder2(locale);
+  const endPlaceholderText = endPlaceholder ?? getDatePlaceholder2(locale);
+  return /* @__PURE__ */ jsxs20(
+    "div",
+    {
+      className: wrapper7,
+      "data-disabled": disabled || void 0,
+      ref: refs.setReference,
+      children: [
+        /* @__PURE__ */ jsx37(
+          "input",
+          {
+            type: "text",
+            className: dateInput2,
+            value: startText,
+            placeholder: startPlaceholderText,
+            disabled,
+            onChange: (e) => setStartText(e.target.value),
+            onBlur: commitStartText,
+            onKeyDown: handleStartKeyDown,
+            "aria-label": "Start date"
+          }
+        ),
+        /* @__PURE__ */ jsx37("span", { className: separator2, "aria-hidden": "true", children: "\u2013" }),
+        /* @__PURE__ */ jsx37(
+          "input",
+          {
+            type: "text",
+            className: dateInput2,
+            value: endText,
+            placeholder: endPlaceholderText,
+            disabled,
+            onChange: (e) => setEndText(e.target.value),
+            onBlur: commitEndText,
+            onKeyDown: handleEndKeyDown,
+            "aria-label": "End date"
+          }
+        ),
+        /* @__PURE__ */ jsx37(
+          "button",
+          {
+            type: "button",
+            className: iconButton3,
+            disabled,
+            "aria-label": open ? "Close calendar" : "Open calendar",
+            ...getReferenceProps({
+              onClick: () => {
+                if (disabled) return;
+                setOpen(!open);
+              }
+            }),
+            children: /* @__PURE__ */ jsxs20(
+              "svg",
+              {
+                width: "16",
+                height: "16",
+                viewBox: "0 0 16 16",
+                fill: "none",
+                "aria-hidden": "true",
+                children: [
+                  /* @__PURE__ */ jsx37(
+                    "rect",
+                    {
+                      x: "1.5",
+                      y: "2.5",
+                      width: "13",
+                      height: "12",
+                      rx: "1.5",
+                      stroke: "currentColor",
+                      strokeWidth: "1.3"
+                    }
+                  ),
+                  /* @__PURE__ */ jsx37("path", { d: "M1.5 6h13", stroke: "currentColor", strokeWidth: "1.3" }),
+                  /* @__PURE__ */ jsx37(
+                    "path",
+                    {
+                      d: "M4.5 1v3M11.5 1v3",
+                      stroke: "currentColor",
+                      strokeWidth: "1.3",
+                      strokeLinecap: "round"
+                    }
+                  )
+                ]
+              }
+            )
+          }
+        ),
+        open ? /* @__PURE__ */ jsx37(FloatingPortal6, { children: /* @__PURE__ */ jsx37(FloatingFocusManager5, { context, modal: false, children: /* @__PURE__ */ jsx37(
+          "div",
+          {
+            ref: refs.setFloating,
+            className: popover3,
+            style: floatingStyles,
+            ...getFloatingProps(),
+            children: /* @__PURE__ */ jsx37(
+              Calendar,
+              {
+                value: value.start,
+                rangeEnd: value.end,
+                onChange: handleCalendarChange,
+                month,
+                onMonthChange: setMonth,
+                minDate,
+                maxDate,
+                isDateDisabled,
+                weekStartsOn,
+                locale
+              }
+            )
+          }
+        ) }) }) : null
+      ]
+    }
+  );
+}
+
+// src/components/NumberInput/NumberInput.tsx
+import { forwardRef as forwardRef14, useEffect as useEffect5, useRef as useRef6, useState as useState12 } from "react";
+import { useMergeRefs as useMergeRefs5 } from "@floating-ui/react";
+
+// src/components/NumberInput/NumberInput.css.ts
+var input2 = "NumberInput_input__1vx30yr1";
+var stepButton = "NumberInput_stepButton__1vx30yr3";
+var stepperGroup = "NumberInput_stepperGroup__1vx30yr2";
+var wrapper8 = "NumberInput_wrapper__1vx30yr0";
+
+// src/components/NumberInput/NumberInput.tsx
+import { jsx as jsx38, jsxs as jsxs21 } from "react/jsx-runtime";
+function clamp(value, min, max) {
+  let result = value;
+  if (min !== void 0) result = Math.max(min, result);
+  if (max !== void 0) result = Math.min(max, result);
+  return result;
+}
+function formatValue(value) {
+  return value === null ? "" : String(value);
+}
+var NumberInput = forwardRef14(function NumberInput2({
+  value: controlledValue,
+  defaultValue = null,
+  onChange,
+  min,
+  max,
+  step = 1,
+  disabled = false,
+  invalid,
+  placeholder,
+  id,
+  name,
+  className,
+  ...rest
+}, ref) {
+  const [uncontrolledValue, setUncontrolledValue] = useState12(defaultValue);
+  const value = controlledValue !== void 0 ? controlledValue : uncontrolledValue;
+  const setValue = (next) => {
+    if (controlledValue === void 0) {
+      setUncontrolledValue(next);
+    }
+    onChange?.(next);
+  };
+  const [inputText, setInputText] = useState12(() => formatValue(value));
+  useEffect5(() => {
+    setInputText(formatValue(value));
+  }, [value]);
+  const inputRef = useRef6(null);
+  const mergedRef = useMergeRefs5([inputRef, ref]);
+  const commitTypedValue = () => {
+    const trimmed = inputText.trim();
+    if (!trimmed) {
+      if (value !== null) setValue(null);
+      return;
+    }
+    const parsed = Number(trimmed);
+    if (Number.isNaN(parsed)) {
+      setInputText(formatValue(value));
+      return;
+    }
+    const clamped = clamp(parsed, min, max);
+    setValue(clamped);
+    setInputText(formatValue(clamped));
+  };
+  const step2 = (direction2) => {
+    if (disabled) return;
+    const base2 = value ?? min ?? 0;
+    const next = clamp(base2 + direction2 * step, min, max);
+    setValue(next);
+    setInputText(formatValue(next));
+    inputRef.current?.focus();
+  };
+  const handleKeyDown = (event) => {
+    if (event.key === "Enter") {
+      event.preventDefault();
+      commitTypedValue();
+      return;
+    }
+    if (event.key === "ArrowUp") {
+      event.preventDefault();
+      step2(1);
+      return;
+    }
+    if (event.key === "ArrowDown") {
+      event.preventDefault();
+      step2(-1);
+      return;
+    }
+    if (event.key === "Home" && min !== void 0) {
+      event.preventDefault();
+      setValue(min);
+      setInputText(formatValue(min));
+      return;
+    }
+    if (event.key === "End" && max !== void 0) {
+      event.preventDefault();
+      setValue(max);
+      setInputText(formatValue(max));
+    }
+  };
+  const handleBlur = (_event) => {
+    commitTypedValue();
+  };
+  const classes = [wrapper8, className].filter(Boolean).join(" ");
+  return /* @__PURE__ */ jsxs21("span", { className: classes, "data-disabled": disabled || void 0, children: [
+    /* @__PURE__ */ jsx38(
+      "input",
+      {
+        ref: mergedRef,
+        id,
+        name,
+        type: "text",
+        inputMode: "decimal",
+        className: input2,
+        value: inputText,
+        placeholder,
+        disabled,
+        role: "spinbutton",
+        "aria-valuenow": value ?? void 0,
+        "aria-valuemin": min,
+        "aria-valuemax": max,
+        "aria-invalid": invalid || void 0,
+        onChange: (e) => setInputText(e.target.value),
+        onBlur: handleBlur,
+        onKeyDown: handleKeyDown,
+        ...rest
+      }
+    ),
+    /* @__PURE__ */ jsxs21("span", { className: stepperGroup, children: [
+      /* @__PURE__ */ jsx38(
+        "button",
+        {
+          type: "button",
+          tabIndex: -1,
+          className: stepButton,
+          disabled: disabled || max !== void 0 && value !== null && value >= max,
+          "aria-label": "Increment",
+          onClick: () => step2(1),
+          children: /* @__PURE__ */ jsx38("svg", { width: "8", height: "8", viewBox: "0 0 8 8", fill: "none", "aria-hidden": "true", children: /* @__PURE__ */ jsx38("path", { d: "M1 5l3-3 3 3", stroke: "currentColor", strokeWidth: "1.3", strokeLinecap: "round", strokeLinejoin: "round" }) })
+        }
+      ),
+      /* @__PURE__ */ jsx38(
+        "button",
+        {
+          type: "button",
+          tabIndex: -1,
+          className: stepButton,
+          disabled: disabled || min !== void 0 && value !== null && value <= min,
+          "aria-label": "Decrement",
+          onClick: () => step2(-1),
+          children: /* @__PURE__ */ jsx38("svg", { width: "8", height: "8", viewBox: "0 0 8 8", fill: "none", "aria-hidden": "true", children: /* @__PURE__ */ jsx38("path", { d: "M1 3l3 3 3-3", stroke: "currentColor", strokeWidth: "1.3", strokeLinecap: "round", strokeLinejoin: "round" }) })
+        }
+      )
+    ] })
+  ] });
+});
+
+// src/components/Slider/Slider.tsx
+import { useRef as useRef7, useState as useState13 } from "react";
+
+// src/components/Slider/Slider.css.ts
+var range2 = "Slider_range__2gl56i2";
+var root3 = "Slider_root__2gl56i0";
+var thumb = "Slider_thumb__2gl56i3";
+var track3 = "Slider_track__2gl56i1";
+
+// src/components/Slider/Slider.tsx
+import { jsx as jsx39, jsxs as jsxs22 } from "react/jsx-runtime";
+function isRange(value) {
+  return Array.isArray(value);
+}
+function clampToStep(raw, min, max, step) {
+  const stepped = Math.round((raw - min) / step) * step + min;
+  return Math.min(max, Math.max(min, Math.round(stepped * 1e6) / 1e6));
+}
+function percentOf(value, min, max) {
+  if (max === min) return 0;
+  return (value - min) / (max - min) * 100;
+}
+function Slider({
+  value: controlledValue,
+  defaultValue = 0,
+  onChange,
+  min = 0,
+  max = 100,
+  step = 1,
+  disabled = false,
+  className,
+  formatValue: formatValue2 = (v) => String(v),
+  ...rest
+}) {
+  const ariaLabel = rest["aria-label"];
+  const [uncontrolledValue, setUncontrolledValue] = useState13(defaultValue);
+  const value = controlledValue !== void 0 ? controlledValue : uncontrolledValue;
+  const setValue = (next) => {
+    if (controlledValue === void 0) {
+      setUncontrolledValue(next);
+    }
+    onChange?.(next);
+  };
+  const trackRef = useRef7(null);
+  const dragThumbIndex = useRef7(null);
+  const isDragging = useRef7(false);
+  const valueFromClientX = (clientX) => {
+    const trackEl = trackRef.current;
+    if (!trackEl) return min;
+    const rect = trackEl.getBoundingClientRect();
+    const ratio = rect.width === 0 ? 0 : (clientX - rect.left) / rect.width;
+    return clampToStep(min + ratio * (max - min), min, max, step);
+  };
+  const setThumbValue = (index, raw) => {
+    if (index === null) {
+      setValue(clampToStep(raw, min, max, step));
+      return;
+    }
+    if (!isRange(value)) return;
+    const [start, end] = value;
+    if (index === 0) {
+      setValue([Math.min(raw, end), end]);
+    } else {
+      setValue([start, Math.max(raw, start)]);
+    }
+  };
+  const handlePointerMove = (event) => {
+    if (!isDragging.current) return;
+    setThumbValue(dragThumbIndex.current, valueFromClientX(event.clientX));
+  };
+  const handlePointerUp = () => {
+    isDragging.current = false;
+    dragThumbIndex.current = null;
+    window.removeEventListener("pointermove", handlePointerMove);
+    window.removeEventListener("pointerup", handlePointerUp);
+  };
+  const startDrag = (index) => (event) => {
+    if (disabled) return;
+    event.preventDefault();
+    isDragging.current = true;
+    dragThumbIndex.current = index;
+    setThumbValue(index, valueFromClientX(event.clientX));
+    window.addEventListener("pointermove", handlePointerMove);
+    window.addEventListener("pointerup", handlePointerUp);
+  };
+  const handleTrackPointerDown = (event) => {
+    if (disabled) return;
+    if (!isRange(value)) {
+      startDrag(null)(event);
+      return;
+    }
+    const target = valueFromClientX(event.clientX);
+    const [start, end] = value;
+    const nearestIndex = Math.abs(target - start) <= Math.abs(target - end) ? 0 : 1;
+    startDrag(nearestIndex)(event);
+  };
+  const handleThumbKeyDown = (index) => (event) => {
+    if (disabled) return;
+    const current2 = index === null ? value : value[index];
+    let next = null;
+    switch (event.key) {
+      case "ArrowRight":
+      case "ArrowUp":
+        next = clampToStep(current2 + step, min, max, step);
+        break;
+      case "ArrowLeft":
+      case "ArrowDown":
+        next = clampToStep(current2 - step, min, max, step);
+        break;
+      case "Home":
+        next = min;
+        break;
+      case "End":
+        next = max;
+        break;
+      case "PageUp":
+        next = clampToStep(current2 + step * 10, min, max, step);
+        break;
+      case "PageDown":
+        next = clampToStep(current2 - step * 10, min, max, step);
+        break;
+      default:
+        return;
+    }
+    event.preventDefault();
+    setThumbValue(index, next);
+  };
+  const renderThumb = (index, current2, label3) => /* @__PURE__ */ jsx39(
+    "span",
+    {
+      role: "slider",
+      tabIndex: disabled ? -1 : 0,
+      "aria-label": label3,
+      "aria-valuemin": min,
+      "aria-valuemax": max,
+      "aria-valuenow": current2,
+      "aria-valuetext": formatValue2(current2),
+      "aria-disabled": disabled || void 0,
+      className: thumb,
+      style: { left: `${percentOf(current2, min, max)}%` },
+      onPointerDown: (event) => {
+        event.stopPropagation();
+        startDrag(index)(event);
+      },
+      onKeyDown: handleThumbKeyDown(index)
+    },
+    index ?? "single"
+  );
+  const classes = [root3, className].filter(Boolean).join(" ");
+  return /* @__PURE__ */ jsx39("span", { className: classes, "data-disabled": disabled || void 0, children: /* @__PURE__ */ jsxs22("span", { ref: trackRef, className: track3, onPointerDown: handleTrackPointerDown, children: [
+    isRange(value) ? /* @__PURE__ */ jsx39(
+      "span",
+      {
+        className: range2,
+        style: {
+          left: `${percentOf(value[0], min, max)}%`,
+          right: `${100 - percentOf(value[1], min, max)}%`
+        }
+      }
+    ) : /* @__PURE__ */ jsx39("span", { className: range2, style: { left: 0, right: `${100 - percentOf(value, min, max)}%` } }),
+    isRange(value) ? [
+      renderThumb(0, value[0], Array.isArray(ariaLabel) ? ariaLabel[0] : ariaLabel),
+      renderThumb(1, value[1], Array.isArray(ariaLabel) ? ariaLabel[1] : ariaLabel)
+    ] : renderThumb(null, value, typeof ariaLabel === "string" ? ariaLabel : void 0)
+  ] }) });
+}
+
+// src/components/Combobox/Combobox.tsx
+import { useEffect as useEffect6, useId as useId2, useRef as useRef8, useState as useState14 } from "react";
+import {
+  FloatingPortal as FloatingPortal7,
+  autoUpdate as autoUpdate6,
+  flip as flip6,
+  offset as offset6,
+  shift as shift6,
+  useDismiss as useDismiss7,
+  useFloating as useFloating7,
+  useInteractions as useInteractions7,
+  useRole as useRole7
+} from "@floating-ui/react";
+
+// src/components/Combobox/Combobox.css.ts
+var chip = "Combobox_chip__26nhic2";
+var chipRemove = "Combobox_chipRemove__26nhic3";
+var chipsWrapper = "Combobox_chipsWrapper__26nhic1";
+var emptyState2 = "Combobox_emptyState__26nhic7";
+var inputEl = "Combobox_inputEl__26nhic4";
+var listbox = "Combobox_listbox__26nhic5";
+var option = "Combobox_option__26nhic6";
+var wrapper9 = "Combobox_wrapper__26nhic0";
+
+// src/components/Combobox/Combobox.tsx
+import { jsx as jsx40, jsxs as jsxs23 } from "react/jsx-runtime";
+function defaultFilter(options, inputText) {
+  const query = inputText.trim().toLowerCase();
+  if (!query) return options;
+  return options.filter((opt) => opt.label.toLowerCase().includes(query));
+}
+function labelFor(options, value) {
+  if (!value) return "";
+  return options.find((opt) => opt.value === value)?.label ?? "";
+}
+function Combobox({
+  options,
+  multiple = false,
+  value: controlledValue,
+  defaultValue,
+  onChange,
+  onInputChange,
+  filterOptions = defaultFilter,
+  placeholder,
+  noOptionsMessage = "No options",
+  disabled = false,
+  invalid,
+  loading = false,
+  id,
+  className,
+  ...rest
+}) {
+  const fallbackDefault = multiple ? [] : null;
+  const [uncontrolledValue, setUncontrolledValue] = useState14(
+    defaultValue !== void 0 ? defaultValue : fallbackDefault
+  );
+  const value = controlledValue !== void 0 ? controlledValue : uncontrolledValue;
+  const setValue = (next) => {
+    if (controlledValue === void 0) {
+      setUncontrolledValue(next);
+    }
+    onChange?.(next);
+  };
+  const selectedValues = multiple ? value ?? [] : [];
+  const singleValue = multiple ? null : value;
+  const [open, setOpen] = useState14(false);
+  const [inputText, setInputText] = useState14(() => multiple ? "" : labelFor(options, singleValue));
+  const [activeIndex, setActiveIndex] = useState14(null);
+  useEffect6(() => {
+    if (!multiple) {
+      setInputText(labelFor(options, singleValue));
+    }
+  }, [singleValue, multiple]);
+  const inputRef = useRef8(null);
+  const listboxId = useId2();
+  const filteredOptions = filterOptions(options, multiple ? inputText : open ? inputText : "");
+  const { refs, floatingStyles, context } = useFloating7({
+    open,
+    onOpenChange: setOpen,
+    placement: "bottom-start",
+    whileElementsMounted: autoUpdate6,
+    middleware: [offset6(4), flip6(), shift6({ padding: 8 })]
+  });
+  const { getReferenceProps, getFloatingProps } = useInteractions7([
+    useDismiss7(context),
+    useRole7(context, { role: "listbox" })
+  ]);
+  const openList = () => {
+    if (disabled) return;
+    setOpen(true);
+    setActiveIndex(null);
+  };
+  const closeList = () => {
+    setOpen(false);
+    setActiveIndex(null);
+  };
+  const selectOption = (opt) => {
+    if (opt.disabled) return;
+    if (multiple) {
+      const next = selectedValues.includes(opt.value) ? selectedValues.filter((v) => v !== opt.value) : [...selectedValues, opt.value];
+      setValue(next);
+      setInputText("");
+      onInputChange?.("");
+      inputRef.current?.focus();
+      return;
+    }
+    setValue(opt.value);
+    setInputText(opt.label);
+    closeList();
+  };
+  const removeChip = (optionValue) => {
+    setValue(selectedValues.filter((v) => v !== optionValue));
+    inputRef.current?.focus();
+  };
+  const handleInputChange = (text) => {
+    setInputText(text);
+    onInputChange?.(text);
+    setOpen(true);
+    setActiveIndex(null);
+  };
+  const moveActiveIndex = (direction2) => {
+    if (filteredOptions.length === 0) return;
+    let next = activeIndex ?? (direction2 === 1 ? -1 : filteredOptions.length);
+    for (let step = 0; step < filteredOptions.length; step++) {
+      next = (next + direction2 + filteredOptions.length) % filteredOptions.length;
+      if (!filteredOptions[next]?.disabled) {
+        setActiveIndex(next);
+        return;
+      }
+    }
+  };
+  const handleKeyDown = (event) => {
+    if (disabled) return;
+    switch (event.key) {
+      case "ArrowDown":
+        event.preventDefault();
+        if (!open) {
+          openList();
+        } else {
+          moveActiveIndex(1);
+        }
+        return;
+      case "ArrowUp":
+        event.preventDefault();
+        if (open) moveActiveIndex(-1);
+        return;
+      case "Enter": {
+        if (!open) return;
+        event.preventDefault();
+        const active = activeIndex !== null ? filteredOptions[activeIndex] : void 0;
+        if (active) selectOption(active);
+        return;
+      }
+      case "Escape":
+        if (open) {
+          event.preventDefault();
+          closeList();
+          if (!multiple) setInputText(labelFor(options, singleValue));
+        }
+        return;
+      case "Backspace":
+        if (multiple && inputText === "" && selectedValues.length > 0) {
+          removeChip(selectedValues[selectedValues.length - 1]);
+        }
+        return;
+      default:
+    }
+  };
+  const handleBlur = () => {
+    if (!multiple) {
+      setInputText(labelFor(options, singleValue));
+    }
+    closeList();
+  };
+  const classes = [wrapper9, className].filter(Boolean).join(" ");
+  const activeOptionId = activeIndex !== null ? `${listboxId}-option-${activeIndex}` : void 0;
+  return /* @__PURE__ */ jsxs23("span", { className: classes, ref: refs.setReference, "data-disabled": disabled || void 0, children: [
+    multiple && selectedValues.length > 0 ? /* @__PURE__ */ jsx40("span", { className: chipsWrapper, children: selectedValues.map((val) => /* @__PURE__ */ jsxs23("span", { className: chip, children: [
+      labelFor(options, val),
+      /* @__PURE__ */ jsx40(
+        "button",
+        {
+          type: "button",
+          className: chipRemove,
+          "aria-label": `Remove ${labelFor(options, val)}`,
+          disabled,
+          onClick: () => removeChip(val),
+          children: "\xD7"
+        }
+      )
+    ] }, val)) }) : null,
+    /* @__PURE__ */ jsx40(
+      "input",
+      {
+        ref: inputRef,
+        id,
+        type: "text",
+        role: "combobox",
+        className: inputEl,
+        value: inputText,
+        placeholder,
+        disabled,
+        autoComplete: "off",
+        "aria-autocomplete": "list",
+        "aria-expanded": open,
+        "aria-controls": listboxId,
+        "aria-invalid": invalid || void 0,
+        "aria-activedescendant": activeOptionId,
+        ...getReferenceProps({
+          ...rest,
+          onFocus: openList,
+          onBlur: handleBlur,
+          onChange: (e) => handleInputChange(e.target.value),
+          onKeyDown: handleKeyDown
+        })
+      }
+    ),
+    open ? /* @__PURE__ */ jsx40(FloatingPortal7, { children: /* @__PURE__ */ jsx40(
+      "div",
+      {
+        ref: refs.setFloating,
+        id: listboxId,
+        role: "listbox",
+        "aria-multiselectable": multiple || void 0,
+        className: listbox,
+        style: floatingStyles,
+        ...getFloatingProps(),
+        children: loading ? /* @__PURE__ */ jsx40("div", { className: emptyState2, children: "Loading\u2026" }) : filteredOptions.length === 0 ? /* @__PURE__ */ jsx40("div", { className: emptyState2, children: noOptionsMessage }) : filteredOptions.map((opt, index) => {
+          const isSelected = multiple ? selectedValues.includes(opt.value) : opt.value === singleValue;
+          return /* @__PURE__ */ jsx40(
+            "div",
+            {
+              id: `${listboxId}-option-${index}`,
+              role: "option",
+              "aria-selected": isSelected,
+              "aria-disabled": opt.disabled || void 0,
+              "data-active": activeIndex === index || void 0,
+              className: option,
+              onMouseDown: (event) => {
+                event.preventDefault();
+                selectOption(opt);
+              },
+              onMouseEnter: () => setActiveIndex(index),
+              children: opt.label
+            },
+            opt.value
+          );
+        })
+      }
+    ) }) : null
+  ] });
+}
+
 // src/index.ts
 import { vars as vars2, defaultThemeClass, defaultThemeVars } from "@vesture/tokens";
 export {
@@ -1725,20 +3211,26 @@ export {
   Breadcrumbs2 as Breadcrumbs,
   BreadcrumbsItem,
   Button,
+  Calendar,
   Card,
   Checkbox,
+  Combobox,
   DataGrid,
+  DatePicker,
+  DateRangePicker,
   Divider,
   DropdownMenu2 as DropdownMenu,
   DropdownMenuItem,
   Input,
   Label,
   Modal,
+  NumberInput,
   Pagination,
   Popover,
   Progress,
   Radio,
   Select,
+  Slider,
   Spinner,
   Stack,
   Switch,