@ceebee/ui 0.2.0

package/dist/client.js

@@ -0,0 +1,2104 @@
+"use client";
+import { createContext, forwardRef, useContext, useMemo, useState, useRef, useEffect, useCallback, useId, useReducer, Children } from 'react';
+import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
+import { motion } from 'motion/react';
+import { Select as Select$1 } from '@base-ui/react/select';
+import { ChevronLeft, ChevronRight, ChevronsUpDown, Check, Minus, X, CalendarDays, Clock, Upload, Plus, Search, PanelLeftOpen, PanelLeftClose, ArrowUp, ArrowDown, XCircle, AlertTriangle, CheckCircle2, Info } from 'lucide-react';
+import { Checkbox as Checkbox$1 } from '@base-ui/react/checkbox';
+import { Radio } from '@base-ui/react/radio';
+import { RadioGroup as RadioGroup$1 } from '@base-ui/react/radio-group';
+import { Switch as Switch$1 } from '@base-ui/react/switch';
+import { Combobox as Combobox$1 } from '@base-ui/react/combobox';
+import { Popover as Popover$1 } from '@base-ui/react/popover';
+import { Dialog as Dialog$1 } from '@base-ui/react/dialog';
+import { Tooltip as Tooltip$1 } from '@base-ui/react/tooltip';
+import { Toast } from '@base-ui/react/toast';
+import { Tabs as Tabs$1 } from '@base-ui/react/tabs';
+import { Menu } from '@base-ui/react/menu';
+import useEmblaCarousel from 'embla-carousel-react';
+
+var DEFAULT_LABELS = {
+  dismiss: "Dismiss",
+  close: "Close",
+  clear: "Clear",
+  open: "Open",
+  previousSlide: "Previous slide",
+  nextSlide: "Next slide",
+  goToSlide: (index) => `Go to slide ${index}`,
+  previousPage: "Previous page",
+  nextPage: "Next page",
+  page: (index) => `Page ${index}`,
+  pageSummary: (from, to, total) => `${from}\u2013${to} of ${total}`,
+  chooseDate: "Choose a date",
+  chooseTime: "Choose a time",
+  previousMonth: "Previous month",
+  nextMonth: "Next month",
+  chooseFiles: "Choose files",
+  chooseFile: "Choose a file",
+  dropFilesHere: "or drop them here",
+  dropFileHere: "or drop it here",
+  removeFile: (name) => `Remove ${name}`,
+  increase: "Increase",
+  decrease: "Decrease",
+  expandNavigation: "Expand navigation",
+  collapseNavigation: "Collapse navigation",
+  back: "Back",
+  next: "Next",
+  done: "Done",
+  skip: "Skip",
+  progress: (current, total) => `${current} of ${total}`
+};
+var LabelsContext = createContext(DEFAULT_LABELS);
+function LabelsProvider({ children, labels }) {
+  const value = useMemo(() => ({ ...DEFAULT_LABELS, ...labels }), [labels]);
+  return /* @__PURE__ */ jsx(LabelsContext.Provider, { value, children });
+}
+function useLabels() {
+  return useContext(LabelsContext);
+}
+var DURATIONS = {
+  instant: 0.08,
+  fast: 0.14,
+  base: 0.22,
+  slow: 0.38,
+  deliberate: 0.62
+};
+var SPRINGS = {
+  snappy: { type: "spring", stiffness: 520, damping: 34, mass: 0.8 },
+  soft: { type: "spring", stiffness: 220, damping: 30, mass: 1 },
+  bouncy: { type: "spring", stiffness: 420, damping: 16, mass: 0.9 }
+};
+var MotionContext = createContext({ enabled: true, scale: 1 });
+function MotionProvider({ children, enabled = true, scale = 1 }) {
+  const [systemReduced, setSystemReduced] = useState(false);
+  useEffect(() => {
+    const query = window.matchMedia("(prefers-reduced-motion: reduce)");
+    setSystemReduced(query.matches);
+    const onChange = (event) => setSystemReduced(event.matches);
+    query.addEventListener("change", onChange);
+    return () => query.removeEventListener("change", onChange);
+  }, []);
+  const value = useMemo(
+    () => ({ enabled: enabled && !systemReduced && scale > 0, scale: systemReduced ? 0 : scale }),
+    [enabled, scale, systemReduced]
+  );
+  return /* @__PURE__ */ jsx(MotionContext.Provider, { value, children: /* @__PURE__ */ jsx("div", { style: { display: "contents", ["--cb-motion-scale"]: String(value.scale) }, children }) });
+}
+function useMotionSettings() {
+  const settings = useContext(MotionContext);
+  return useMemo(
+    () => ({
+      ...settings,
+      duration: (token) => settings.enabled ? DURATIONS[token] * settings.scale : 0,
+      spring: (preset = "snappy") => settings.enabled ? SPRINGS[preset] : { duration: 0 }
+    }),
+    [settings]
+  );
+}
+var ThemeContext = createContext(null);
+var STORAGE_KEY = "cb-theme";
+function ThemeProvider({
+  children,
+  defaultChoice = "system",
+  persist = true
+}) {
+  const [choice, setChoiceState] = useState(defaultChoice);
+  const [systemDark, setSystemDark] = useState(false);
+  useEffect(() => {
+    const query = window.matchMedia("(prefers-color-scheme: dark)");
+    setSystemDark(query.matches);
+    const onChange = (event) => setSystemDark(event.matches);
+    query.addEventListener("change", onChange);
+    return () => query.removeEventListener("change", onChange);
+  }, []);
+  useEffect(() => {
+    if (!persist) return;
+    const stored = window.localStorage.getItem(STORAGE_KEY);
+    if (stored === "light" || stored === "dark" || stored === "system") setChoiceState(stored);
+  }, [persist]);
+  useEffect(() => {
+    const root = document.documentElement;
+    if (choice === "system") root.removeAttribute("data-theme");
+    else root.setAttribute("data-theme", choice);
+  }, [choice]);
+  const setChoice = useCallback(
+    (next) => {
+      setChoiceState(next);
+      if (persist) window.localStorage.setItem(STORAGE_KEY, next);
+    },
+    [persist]
+  );
+  const resolved = choice === "system" ? systemDark ? "dark" : "light" : choice;
+  return /* @__PURE__ */ jsx(ThemeContext.Provider, { value: { choice, setChoice, resolved }, children });
+}
+function useTheme() {
+  const value = useContext(ThemeContext);
+  if (!value) throw new Error("useTheme must be used inside <ThemeProvider>");
+  return value;
+}
+
+// src/lib/cn.ts
+function cn(...parts) {
+  return parts.filter(Boolean).join(" ");
+}
+var Button = forwardRef(function Button2({
+  variant = "solid",
+  tone = "brand",
+  size = "md",
+  loading = false,
+  iconStart,
+  iconEnd,
+  motion: motionProp = true,
+  className,
+  children,
+  disabled,
+  ...rest
+}, ref) {
+  const { enabled, spring } = useMotionSettings();
+  const animate = enabled && motionProp;
+  const iconOnly = children === void 0 || children === null || children === false || children === "";
+  return /* @__PURE__ */ jsxs(
+    motion.button,
+    {
+      ref,
+      className: cn(
+        "cb-button",
+        `cb-button--${variant}`,
+        `cb-button--${size}`,
+        iconOnly && "cb-button--icon",
+        className
+      ),
+      "data-tone": tone,
+      "data-loading": loading || void 0,
+      disabled: disabled ?? loading,
+      "aria-busy": loading || void 0,
+      whileTap: animate ? { scale: 0.97 } : void 0,
+      whileHover: animate ? { y: -1 } : void 0,
+      transition: spring("snappy"),
+      ...rest,
+      children: [
+        loading ? /* @__PURE__ */ jsx("span", { className: "cb-button__spinner", "aria-hidden": "true" }) : iconStart,
+        iconOnly ? null : /* @__PURE__ */ jsx("span", { className: "cb-button__label", children }),
+        loading || iconOnly ? null : iconEnd
+      ]
+    }
+  );
+});
+var FieldContext = createContext(null);
+function useFieldWiring() {
+  return useContext(FieldContext);
+}
+function Field({ label, hint, error, required = false, labelHidden = false, className, children }) {
+  const base = useId();
+  const controlId = `${base}-control`;
+  const hintId = hint ? `${base}-hint` : void 0;
+  const errorId = error && error !== true ? `${base}-error` : void 0;
+  const describedBy = [hintId, errorId].filter(Boolean).join(" ") || void 0;
+  return /* @__PURE__ */ jsx(FieldContext.Provider, { value: { controlId, describedBy, invalid: Boolean(error), required }, children: /* @__PURE__ */ jsxs("div", { className: cn("cb-field", className), "data-invalid": error ? "" : void 0, children: [
+    /* @__PURE__ */ jsxs("label", { className: cn("cb-field__label", labelHidden && "cb-visually-hidden"), htmlFor: controlId, children: [
+      label,
+      required ? /* @__PURE__ */ jsx("span", { className: "cb-field__required", "aria-hidden": "true", children: "*" }) : null
+    ] }),
+    children,
+    hint ? /* @__PURE__ */ jsx("p", { className: "cb-field__hint", id: hintId, children: hint }) : null,
+    error && error !== true ? /* @__PURE__ */ jsx("p", { className: "cb-field__error", id: errorId, role: "alert", children: error }) : null
+  ] }) });
+}
+var TextInput = forwardRef(function TextInput2({ size = "md", invalid, className, ...rest }, ref) {
+  const field = useFieldWiring();
+  return /* @__PURE__ */ jsx(
+    "input",
+    {
+      ref,
+      className: cn("cb-input", `cb-input--${size}`, className),
+      id: rest.id ?? field?.controlId,
+      "aria-describedby": rest["aria-describedby"] ?? field?.describedBy,
+      "aria-invalid": invalid ?? field?.invalid ? true : void 0,
+      required: rest.required ?? field?.required,
+      ...rest
+    }
+  );
+});
+var Textarea = forwardRef(function Textarea2({ invalid, className, ...rest }, ref) {
+  const field = useFieldWiring();
+  return /* @__PURE__ */ jsx(
+    "textarea",
+    {
+      ref,
+      className: cn("cb-input", "cb-input--textarea", className),
+      id: rest.id ?? field?.controlId,
+      "aria-describedby": rest["aria-describedby"] ?? field?.describedBy,
+      "aria-invalid": invalid ?? field?.invalid ? true : void 0,
+      required: rest.required ?? field?.required,
+      ...rest
+    }
+  );
+});
+function Select({
+  items,
+  value,
+  defaultValue,
+  onValueChange,
+  placeholder = "Select\u2026",
+  size = "md",
+  disabled,
+  invalid,
+  name,
+  id,
+  className
+}) {
+  const field = useFieldWiring();
+  return /* @__PURE__ */ jsxs(
+    Select$1.Root,
+    {
+      items,
+      value,
+      defaultValue,
+      onValueChange: (next) => onValueChange?.(next),
+      disabled,
+      name,
+      children: [
+        /* @__PURE__ */ jsxs(
+          Select$1.Trigger,
+          {
+            id: id ?? field?.controlId,
+            "aria-describedby": field?.describedBy,
+            "aria-invalid": invalid ?? field?.invalid ? true : void 0,
+            className: cn("cb-select", `cb-select--${size}`, className),
+            children: [
+              /* @__PURE__ */ jsx(Select$1.Value, { placeholder }),
+              /* @__PURE__ */ jsx(Select$1.Icon, { className: "cb-select__icon", children: /* @__PURE__ */ jsx(ChevronsUpDown, { size: 16 }) })
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsx(Select$1.Portal, { children: /* @__PURE__ */ jsx(Select$1.Positioner, { sideOffset: 6, alignItemWithTrigger: false, children: /* @__PURE__ */ jsx(Select$1.Popup, { className: "cb-select__popup", children: items.map((item) => /* @__PURE__ */ jsxs(Select$1.Item, { value: item.value, disabled: item.disabled, className: "cb-select__item", children: [
+          /* @__PURE__ */ jsx("span", { className: "cb-select__check", children: /* @__PURE__ */ jsx(Select$1.ItemIndicator, { children: /* @__PURE__ */ jsx(Check, { size: 14 }) }) }),
+          /* @__PURE__ */ jsx(Select$1.ItemText, { children: item.label })
+        ] }, item.value)) }) }) })
+      ]
+    }
+  );
+}
+function Checkbox({
+  label,
+  checked,
+  defaultChecked,
+  indeterminate,
+  onCheckedChange,
+  disabled,
+  name,
+  value,
+  description,
+  className
+}) {
+  const generated = useId();
+  const field = useFieldWiring();
+  const id = field?.controlId ?? generated;
+  const descriptionId = description ? `${id}-description` : void 0;
+  return /* @__PURE__ */ jsxs("div", { className: cn("cb-choice", className), children: [
+    /* @__PURE__ */ jsx(
+      Checkbox$1.Root,
+      {
+        id,
+        checked,
+        defaultChecked,
+        indeterminate,
+        onCheckedChange: (next) => onCheckedChange?.(next),
+        disabled,
+        name,
+        value,
+        "aria-describedby": [descriptionId, field?.describedBy].filter(Boolean).join(" ") || void 0,
+        className: "cb-checkbox",
+        children: /* @__PURE__ */ jsx(Checkbox$1.Indicator, { className: "cb-checkbox__indicator", children: indeterminate ? /* @__PURE__ */ jsx(Minus, { size: 12, strokeWidth: 3 }) : /* @__PURE__ */ jsx(Check, { size: 12, strokeWidth: 3 }) })
+      }
+    ),
+    /* @__PURE__ */ jsxs("div", { className: "cb-choice__text", children: [
+      /* @__PURE__ */ jsx("label", { htmlFor: id, className: "cb-choice__label", children: label }),
+      description ? /* @__PURE__ */ jsx("p", { className: "cb-choice__description", id: descriptionId, children: description }) : null
+    ] })
+  ] });
+}
+function RadioGroup({
+  options,
+  value,
+  defaultValue,
+  onValueChange,
+  name,
+  label,
+  direction = "column",
+  disabled,
+  className
+}) {
+  const groupId = useId();
+  const field = useFieldWiring();
+  return /* @__PURE__ */ jsx(
+    RadioGroup$1,
+    {
+      value,
+      defaultValue,
+      onValueChange: (next) => onValueChange?.(next),
+      name,
+      disabled,
+      "aria-label": label,
+      "aria-describedby": field?.describedBy,
+      className: cn("cb-radio-group", `cb-radio-group--${direction}`, className),
+      children: options.map((option) => {
+        const id = `${groupId}-${option.value}`;
+        const descriptionId = option.description ? `${id}-description` : void 0;
+        return /* @__PURE__ */ jsxs("div", { className: "cb-choice", children: [
+          /* @__PURE__ */ jsx(
+            Radio.Root,
+            {
+              id,
+              value: option.value,
+              disabled: option.disabled,
+              "aria-describedby": descriptionId,
+              className: "cb-radio",
+              children: /* @__PURE__ */ jsx(Radio.Indicator, { className: "cb-radio__indicator" })
+            }
+          ),
+          /* @__PURE__ */ jsxs("div", { className: "cb-choice__text", children: [
+            /* @__PURE__ */ jsx("label", { htmlFor: id, className: "cb-choice__label", children: option.label }),
+            option.description ? /* @__PURE__ */ jsx("p", { className: "cb-choice__description", id: descriptionId, children: option.description }) : null
+          ] })
+        ] }, option.value);
+      })
+    }
+  );
+}
+function Switch({
+  label,
+  checked,
+  defaultChecked,
+  onCheckedChange,
+  disabled,
+  name,
+  description,
+  justified = false,
+  className
+}) {
+  const generated = useId();
+  const field = useFieldWiring();
+  const id = field?.controlId ?? generated;
+  const descriptionId = description ? `${id}-description` : void 0;
+  return /* @__PURE__ */ jsxs("div", { className: cn("cb-choice", justified && "cb-choice--justified", className), children: [
+    justified ? null : /* @__PURE__ */ jsx(
+      Switch$1.Root,
+      {
+        id,
+        checked,
+        defaultChecked,
+        onCheckedChange: (next) => onCheckedChange?.(next),
+        disabled,
+        name,
+        "aria-describedby": [descriptionId, field?.describedBy].filter(Boolean).join(" ") || void 0,
+        className: "cb-switch",
+        children: /* @__PURE__ */ jsx(Switch$1.Thumb, { className: "cb-switch__thumb" })
+      }
+    ),
+    /* @__PURE__ */ jsxs("div", { className: "cb-choice__text", children: [
+      /* @__PURE__ */ jsx("label", { htmlFor: id, className: "cb-choice__label", children: label }),
+      description ? /* @__PURE__ */ jsx("p", { className: "cb-choice__description", id: descriptionId, children: description }) : null
+    ] }),
+    justified ? /* @__PURE__ */ jsx(
+      Switch$1.Root,
+      {
+        id,
+        checked,
+        defaultChecked,
+        onCheckedChange: (next) => onCheckedChange?.(next),
+        disabled,
+        name,
+        "aria-describedby": [descriptionId, field?.describedBy].filter(Boolean).join(" ") || void 0,
+        className: "cb-switch",
+        children: /* @__PURE__ */ jsx(Switch$1.Thumb, { className: "cb-switch__thumb" })
+      }
+    ) : null
+  ] });
+}
+function Combobox({
+  items,
+  value,
+  defaultValue,
+  onValueChange,
+  placeholder = "Search\u2026",
+  emptyMessage = "Nothing matched",
+  size = "md",
+  disabled,
+  invalid,
+  name,
+  className
+}) {
+  const field = useFieldWiring();
+  const labels = useLabels();
+  const optionFor = (candidate) => items.find((item) => item.value === candidate) ?? null;
+  return /* @__PURE__ */ jsxs(
+    Combobox$1.Root,
+    {
+      items,
+      value: value === void 0 ? void 0 : optionFor(value),
+      defaultValue: defaultValue === void 0 ? void 0 : optionFor(defaultValue),
+      onValueChange: (next) => onValueChange?.(next?.value ?? null),
+      isItemEqualToValue: (a, b) => a?.value === b?.value,
+      itemToStringLabel: (item) => typeof item === "string" ? item : item.label,
+      disabled,
+      name,
+      children: [
+        /* @__PURE__ */ jsxs("div", { className: cn("cb-combobox", `cb-combobox--${size}`, className), "data-disabled": disabled || void 0, children: [
+          /* @__PURE__ */ jsx(
+            Combobox$1.Input,
+            {
+              className: "cb-combobox__input",
+              placeholder,
+              id: field?.controlId,
+              "aria-describedby": field?.describedBy,
+              "aria-invalid": invalid ?? field?.invalid ? true : void 0
+            }
+          ),
+          /* @__PURE__ */ jsx(Combobox$1.Clear, { className: "cb-combobox__clear", "aria-label": labels.clear, children: /* @__PURE__ */ jsx(X, { size: 14 }) }),
+          /* @__PURE__ */ jsx(Combobox$1.Trigger, { className: "cb-combobox__trigger", "aria-label": labels.open, children: /* @__PURE__ */ jsx(ChevronsUpDown, { size: 16 }) })
+        ] }),
+        /* @__PURE__ */ jsx(Combobox$1.Portal, { children: /* @__PURE__ */ jsx(Combobox$1.Positioner, { sideOffset: 6, children: /* @__PURE__ */ jsxs(Combobox$1.Popup, { className: "cb-combobox__popup", children: [
+          /* @__PURE__ */ jsx(Combobox$1.Empty, { className: "cb-combobox__empty", children: emptyMessage }),
+          /* @__PURE__ */ jsx(Combobox$1.List, { children: (item) => /* @__PURE__ */ jsxs(Combobox$1.Item, { value: item, className: "cb-combobox__item", children: [
+            /* @__PURE__ */ jsx("span", { className: "cb-combobox__check", children: /* @__PURE__ */ jsx(Combobox$1.ItemIndicator, { children: /* @__PURE__ */ jsx(Check, { size: 14 }) }) }),
+            /* @__PURE__ */ jsxs("span", { className: "cb-combobox__text", children: [
+              /* @__PURE__ */ jsx("span", { className: "cb-combobox__label", children: item.label }),
+              item.description ? /* @__PURE__ */ jsx("span", { className: "cb-combobox__description", children: item.description }) : null
+            ] })
+          ] }, item.value) })
+        ] }) }) })
+      ]
+    }
+  );
+}
+
+// src/form/date.util.ts
+function isSameDay(a, b) {
+  if (!a || !b) return false;
+  return a.getFullYear() === b.getFullYear() && a.getMonth() === b.getMonth() && a.getDate() === b.getDate();
+}
+function startOfDay(date) {
+  return new Date(date.getFullYear(), date.getMonth(), date.getDate());
+}
+function monthMatrix(year, month, weekStartsOn = 1) {
+  const first = new Date(year, month, 1);
+  const offset = (first.getDay() - weekStartsOn + 7) % 7;
+  const start = new Date(year, month, 1 - offset);
+  const weeks = [];
+  for (let week = 0; week < 6; week += 1) {
+    const cells = [];
+    for (let day = 0; day < 7; day += 1) {
+      const date = new Date(start.getFullYear(), start.getMonth(), start.getDate() + week * 7 + day);
+      cells.push({ date, inMonth: date.getMonth() === month });
+    }
+    weeks.push(cells);
+  }
+  return weeks;
+}
+function parseDateInput(input) {
+  const text2 = input.trim();
+  if (!text2) return null;
+  const iso = /^(\d{4})-(\d{1,2})-(\d{1,2})$/.exec(text2);
+  if (iso) return build(Number(iso[1]), Number(iso[2]), Number(iso[3]));
+  const dayFirst = /^(\d{1,2})[/.-](\d{1,2})[/.-](\d{2,4})$/.exec(text2);
+  if (dayFirst) {
+    const year = Number(dayFirst[3]);
+    return build(year < 100 ? 2e3 + year : year, Number(dayFirst[2]), Number(dayFirst[1]));
+  }
+  return null;
+}
+function build(year, month, day) {
+  if (month < 1 || month > 12 || day < 1 || day > 31) return null;
+  const date = new Date(year, month - 1, day);
+  if (date.getMonth() !== month - 1 || date.getDate() !== day) return null;
+  return date;
+}
+function formatISO(date) {
+  if (!date) return "";
+  const month = String(date.getMonth() + 1).padStart(2, "0");
+  const day = String(date.getDate()).padStart(2, "0");
+  return `${date.getFullYear()}-${month}-${day}`;
+}
+function isOutOfRange(date, min, max) {
+  if (min && startOfDay(date) < startOfDay(min)) return true;
+  if (max && startOfDay(date) > startOfDay(max)) return true;
+  return false;
+}
+var WEEKDAYS = ["Mo", "Tu", "We", "Th", "Fr", "Sa", "Su"];
+function DateInput({
+  value,
+  defaultValue = null,
+  onValueChange,
+  min,
+  max,
+  format,
+  weekStartsOn = 1,
+  size = "md",
+  disabled,
+  invalid,
+  placeholder = "dd/mm/yyyy",
+  className
+}) {
+  const field = useFieldWiring();
+  const labels = useLabels();
+  const controlled = value !== void 0;
+  const [internal, setInternal] = useState(defaultValue);
+  const current = controlled ? value ?? null : internal;
+  const display = (date) => format ? format(date) : date.toLocaleDateString(void 0, { day: "2-digit", month: "short", year: "numeric" });
+  const [text2, setText] = useState(() => current ? display(current) : "");
+  const [open, setOpen] = useState(false);
+  const [cursor, setCursor] = useState(() => current ?? /* @__PURE__ */ new Date());
+  const fieldRef = useRef(null);
+  const commit = (next) => {
+    if (!controlled) setInternal(next);
+    setText(next ? display(next) : "");
+    onValueChange?.(next);
+  };
+  const weeks = monthMatrix(cursor.getFullYear(), cursor.getMonth(), weekStartsOn);
+  const weekdays = weekStartsOn === 1 ? WEEKDAYS : [WEEKDAYS[6], ...WEEKDAYS.slice(0, 6)];
+  return /* @__PURE__ */ jsxs(Popover$1.Root, { open, onOpenChange: setOpen, children: [
+    /* @__PURE__ */ jsxs(
+      "div",
+      {
+        ref: fieldRef,
+        className: cn("cb-date", `cb-date--${size}`, className),
+        "data-disabled": disabled || void 0,
+        children: [
+          /* @__PURE__ */ jsx(
+            "input",
+            {
+              className: "cb-date__input",
+              id: field?.controlId,
+              value: controlled ? current ? display(current) : text2 : text2,
+              placeholder,
+              disabled,
+              "aria-describedby": field?.describedBy,
+              "aria-invalid": invalid ?? field?.invalid ? true : void 0,
+              onClick: () => !disabled && setOpen(true),
+              onChange: (event) => setText(event.target.value),
+              onBlur: () => {
+                const parsed = parseDateInput(text2);
+                if (parsed && !isOutOfRange(parsed, min, max)) {
+                  commit(parsed);
+                  setCursor(parsed);
+                } else {
+                  commit(null);
+                }
+              }
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            Popover$1.Trigger,
+            {
+              className: "cb-date__trigger",
+              "aria-label": labels.chooseDate,
+              disabled,
+              render: /* @__PURE__ */ jsx("button", { type: "button" }),
+              children: /* @__PURE__ */ jsx(CalendarDays, { size: 16 })
+            }
+          )
+        ]
+      }
+    ),
+    /* @__PURE__ */ jsx(Popover$1.Portal, { children: /* @__PURE__ */ jsx(Popover$1.Positioner, { anchor: fieldRef, side: "bottom", align: "start", sideOffset: 6, children: /* @__PURE__ */ jsxs(Popover$1.Popup, { className: "cb-calendar", children: [
+      /* @__PURE__ */ jsxs("div", { className: "cb-calendar__head", children: [
+        /* @__PURE__ */ jsx(
+          "button",
+          {
+            type: "button",
+            className: "cb-calendar__nav",
+            "aria-label": labels.previousMonth,
+            onClick: () => setCursor(new Date(cursor.getFullYear(), cursor.getMonth() - 1, 1)),
+            children: /* @__PURE__ */ jsx(ChevronLeft, { size: 16 })
+          }
+        ),
+        /* @__PURE__ */ jsx("p", { className: "cb-calendar__month", "aria-live": "polite", children: cursor.toLocaleDateString(void 0, { month: "long", year: "numeric" }) }),
+        /* @__PURE__ */ jsx(
+          "button",
+          {
+            type: "button",
+            className: "cb-calendar__nav",
+            "aria-label": labels.nextMonth,
+            onClick: () => setCursor(new Date(cursor.getFullYear(), cursor.getMonth() + 1, 1)),
+            children: /* @__PURE__ */ jsx(ChevronRight, { size: 16 })
+          }
+        )
+      ] }),
+      /* @__PURE__ */ jsxs("table", { className: "cb-calendar__grid", children: [
+        /* @__PURE__ */ jsx("thead", { children: /* @__PURE__ */ jsx("tr", { children: weekdays.map((day) => /* @__PURE__ */ jsx("th", { scope: "col", abbr: day, children: day }, day)) }) }),
+        /* @__PURE__ */ jsx("tbody", { children: weeks.map((week, weekIndex) => /* @__PURE__ */ jsx("tr", { children: week.map((cell) => {
+          const selected = isSameDay(cell.date, current);
+          const outside = isOutOfRange(cell.date, min, max);
+          return /* @__PURE__ */ jsx("td", { children: /* @__PURE__ */ jsx(
+            "button",
+            {
+              type: "button",
+              className: "cb-calendar__day",
+              "data-outside": !cell.inMonth || void 0,
+              "data-selected": selected || void 0,
+              "data-today": isSameDay(cell.date, /* @__PURE__ */ new Date()) || void 0,
+              disabled: outside,
+              "aria-pressed": selected,
+              "aria-label": formatISO(cell.date),
+              onClick: () => {
+                commit(cell.date);
+                setCursor(cell.date);
+                setOpen(false);
+              },
+              children: cell.date.getDate()
+            }
+          ) }, cell.date.toISOString());
+        }) }, weekIndex)) })
+      ] })
+    ] }) }) })
+  ] });
+}
+
+// src/form/time.util.ts
+function parseTime(input) {
+  const text2 = input.trim().toLowerCase().replace(/\s+/g, "");
+  if (!text2) return null;
+  const suffix = text2.endsWith("am") ? "am" : text2.endsWith("pm") ? "pm" : null;
+  const body = suffix ? text2.slice(0, -2) : text2;
+  let hours;
+  let minutes = 0;
+  const separated = /^(\d{1,2})[:.](\d{1,2})$/.exec(body);
+  const compact = /^(\d{3,4})$/.exec(body);
+  const hourOnly = /^(\d{1,2})$/.exec(body);
+  if (separated) {
+    hours = Number(separated[1]);
+    minutes = Number(separated[2]);
+  } else if (compact) {
+    const digits = compact[1].padStart(4, "0");
+    hours = Number(digits.slice(0, 2));
+    minutes = Number(digits.slice(2));
+  } else if (hourOnly) {
+    hours = Number(hourOnly[1]);
+  } else {
+    return null;
+  }
+  if (suffix === "pm" && hours < 12) hours += 12;
+  if (suffix === "am" && hours === 12) hours = 0;
+  if (hours > 23 || minutes > 59) return null;
+  return { hours, minutes };
+}
+function formatTime({ hours, minutes }) {
+  return `${String(hours).padStart(2, "0")}:${String(minutes).padStart(2, "0")}`;
+}
+function timeToMinutes({ hours, minutes }) {
+  return hours * 60 + minutes;
+}
+function timeOptions(step, min, max) {
+  const safeStep = step > 0 ? step : 30;
+  const from = min ? timeToMinutes(min) : 0;
+  const to = max ? timeToMinutes(max) : 24 * 60 - 1;
+  const options = [];
+  for (let value = from; value <= to; value += safeStep) {
+    options.push({ hours: Math.floor(value / 60) % 24, minutes: value % 60 });
+  }
+  return options;
+}
+function isTimeOutOfRange(value, min, max) {
+  const minutes = timeToMinutes(value);
+  if (min && minutes < timeToMinutes(min)) return true;
+  if (max && minutes > timeToMinutes(max)) return true;
+  return false;
+}
+function TimeInput({
+  value,
+  defaultValue = null,
+  onValueChange,
+  min,
+  max,
+  step = 30,
+  size = "md",
+  disabled,
+  invalid,
+  placeholder = "hh:mm",
+  className
+}) {
+  const field = useFieldWiring();
+  const labels = useLabels();
+  const controlled = value !== void 0;
+  const [internal, setInternal] = useState(defaultValue);
+  const current = controlled ? value ?? null : internal;
+  const [text2, setText] = useState(() => current ? formatTime(current) : "");
+  const [open, setOpen] = useState(false);
+  const fieldRef = useRef(null);
+  const commit = (next) => {
+    if (!controlled) setInternal(next);
+    setText(next ? formatTime(next) : "");
+    onValueChange?.(next);
+  };
+  const options = timeOptions(step, min, max);
+  return /* @__PURE__ */ jsxs(Popover$1.Root, { open, onOpenChange: setOpen, children: [
+    /* @__PURE__ */ jsxs(
+      "div",
+      {
+        ref: fieldRef,
+        className: cn("cb-date", `cb-date--${size}`, className),
+        "data-disabled": disabled || void 0,
+        children: [
+          /* @__PURE__ */ jsx(
+            "input",
+            {
+              className: "cb-date__input",
+              id: field?.controlId,
+              value: controlled ? current ? formatTime(current) : text2 : text2,
+              placeholder,
+              disabled,
+              inputMode: "numeric",
+              "aria-describedby": field?.describedBy,
+              "aria-invalid": invalid ?? field?.invalid ? true : void 0,
+              onClick: () => !disabled && setOpen(true),
+              onChange: (event) => setText(event.target.value),
+              onBlur: () => {
+                const parsed = parseTime(text2);
+                commit(parsed && !isTimeOutOfRange(parsed, min, max) ? parsed : null);
+              }
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            Popover$1.Trigger,
+            {
+              className: "cb-date__trigger",
+              "aria-label": labels.chooseTime,
+              disabled,
+              render: /* @__PURE__ */ jsx("button", { type: "button" }),
+              children: /* @__PURE__ */ jsx(Clock, { size: 16 })
+            }
+          )
+        ]
+      }
+    ),
+    /* @__PURE__ */ jsx(Popover$1.Portal, { children: /* @__PURE__ */ jsx(Popover$1.Positioner, { anchor: fieldRef, side: "bottom", align: "start", sideOffset: 6, children: /* @__PURE__ */ jsx(Popover$1.Popup, { className: "cb-times", children: /* @__PURE__ */ jsx("ul", { className: "cb-times__list", children: options.map((option) => {
+      const selected = current ? timeToMinutes(current) === timeToMinutes(option) : false;
+      return /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx(
+        "button",
+        {
+          type: "button",
+          className: "cb-times__option",
+          "data-selected": selected || void 0,
+          "aria-pressed": selected,
+          onClick: () => {
+            commit(option);
+            setOpen(false);
+          },
+          children: formatTime(option)
+        }
+      ) }, formatTime(option));
+    }) }) }) }) })
+  ] });
+}
+
+// src/form/file-drop.util.ts
+function matchesAccept(file, accept) {
+  if (!accept || accept.length === 0) return true;
+  const name = file.name.toLowerCase();
+  return accept.some((pattern) => {
+    const rule = pattern.trim().toLowerCase();
+    if (rule.startsWith(".")) return name.endsWith(rule);
+    if (rule.endsWith("/*")) return file.type.startsWith(rule.slice(0, -1));
+    return file.type === rule;
+  });
+}
+function partitionFiles(incoming, existing, rules) {
+  const accepted = [];
+  const rejected = [];
+  const limit = rules.multiple === false ? 1 : rules.maxFiles;
+  for (const file of incoming) {
+    if (!matchesAccept(file, rules.accept)) {
+      rejected.push({ file, reason: "type" });
+      continue;
+    }
+    if (typeof rules.maxSize === "number" && file.size > rules.maxSize) {
+      rejected.push({ file, reason: "size" });
+      continue;
+    }
+    if (typeof limit === "number" && existing.length + accepted.length >= limit) {
+      rejected.push({ file, reason: "count" });
+      continue;
+    }
+    accepted.push(file);
+  }
+  return { accepted, rejected };
+}
+function describeAccept(rules) {
+  const parts = [];
+  if (rules.accept?.length) parts.push(rules.accept.join(", "));
+  if (typeof rules.maxSize === "number") parts.push(`up to ${Math.round(rules.maxSize / (1024 * 1024))} MB`);
+  return parts.length > 0 ? ` \u2014 ${parts.join(" ")}` : "";
+}
+function FileDrop({
+  onFilesChange,
+  files = [],
+  onReject,
+  accept,
+  maxSize,
+  maxFiles,
+  multiple = true,
+  disabled,
+  children,
+  className
+}) {
+  const [over, setOver] = useState(false);
+  const field = useFieldWiring();
+  const labels = useLabels();
+  const rules = { accept, maxSize, maxFiles, multiple };
+  const take = (incoming) => {
+    if (!incoming) return;
+    const { accepted, rejected } = partitionFiles(Array.from(incoming), files, rules);
+    if (accepted.length > 0) onFilesChange([...files, ...accepted]);
+    if (rejected.length > 0) onReject?.(rejected);
+  };
+  const onDrop = (event) => {
+    event.preventDefault();
+    setOver(false);
+    if (!disabled) take(event.dataTransfer.files);
+  };
+  return /* @__PURE__ */ jsxs("div", { className: cn("cb-filedrop", className), children: [
+    /* @__PURE__ */ jsxs(
+      "label",
+      {
+        className: "cb-filedrop__zone",
+        "data-over": over || void 0,
+        "data-disabled": disabled || void 0,
+        onDragOver: (event) => {
+          event.preventDefault();
+          if (!disabled) setOver(true);
+        },
+        onDragLeave: () => setOver(false),
+        onDrop,
+        children: [
+          /* @__PURE__ */ jsx(
+            "input",
+            {
+              type: "file",
+              className: "cb-visually-hidden",
+              id: field?.controlId,
+              accept: accept?.join(","),
+              multiple,
+              disabled,
+              "aria-describedby": field?.describedBy,
+              onChange: (event) => {
+                take(event.target.files);
+                event.target.value = "";
+              }
+            }
+          ),
+          /* @__PURE__ */ jsx("span", { className: "cb-filedrop__icon", "aria-hidden": "true", children: /* @__PURE__ */ jsx(Upload, { size: 20 }) }),
+          /* @__PURE__ */ jsx("span", { className: "cb-filedrop__button", children: multiple ? labels.chooseFiles : labels.chooseFile }),
+          /* @__PURE__ */ jsxs("p", { className: "cb-filedrop__hint", children: [
+            multiple ? labels.dropFilesHere : labels.dropFileHere,
+            describeAccept(rules)
+          ] }),
+          children
+        ]
+      }
+    ),
+    files.length > 0 ? /* @__PURE__ */ jsx("ul", { className: "cb-filedrop__list", children: files.map((file, index) => /* @__PURE__ */ jsxs("li", { className: "cb-filedrop__file", children: [
+      /* @__PURE__ */ jsx("span", { className: "cb-filedrop__name", children: file.name }),
+      /* @__PURE__ */ jsx("span", { className: "cb-filedrop__size", children: formatSize(file.size) }),
+      /* @__PURE__ */ jsx(
+        "button",
+        {
+          type: "button",
+          className: "cb-filedrop__remove",
+          "aria-label": labels.removeFile(file.name),
+          onClick: () => onFilesChange(files.filter((_, i) => i !== index)),
+          children: /* @__PURE__ */ jsx(X, { size: 14 })
+        }
+      )
+    ] }, `${file.name}-${index}`)) }) : null
+  ] });
+}
+function formatSize(bytes) {
+  if (bytes < 1024) return `${bytes} B`;
+  if (bytes < 1024 * 1024) return `${Math.round(bytes / 1024)} KB`;
+  return `${(bytes / (1024 * 1024)).toFixed(1)} MB`;
+}
+
+// src/form/number.ts
+function parseNumber(input) {
+  const trimmed = input.trim().replace(/\s/g, "").replace(",", ".");
+  if (trimmed === "" || trimmed === "-" || trimmed === ".") return null;
+  const parsed = Number(trimmed);
+  return Number.isFinite(parsed) ? parsed : null;
+}
+function clamp(value, { min, max }) {
+  let next = value;
+  if (typeof min === "number") next = Math.max(next, min);
+  if (typeof max === "number") next = Math.min(next, max);
+  return next;
+}
+function stepBy(value, direction, bounds) {
+  const step = bounds.step ?? 1;
+  const base = value ?? bounds.min ?? 0;
+  const next = base + direction * step;
+  const decimals = decimalPlaces(step);
+  const rounded = Number(next.toFixed(decimals));
+  return clamp(rounded, bounds);
+}
+function decimalPlaces(step) {
+  const text2 = String(step);
+  const dot = text2.indexOf(".");
+  return dot === -1 ? 0 : text2.length - dot - 1;
+}
+function canStep(value, direction, bounds) {
+  if (value === null) return true;
+  if (direction === 1) return typeof bounds.max !== "number" || value < bounds.max;
+  return typeof bounds.min !== "number" || value > bounds.min;
+}
+function NumberInput({
+  value,
+  defaultValue = null,
+  onValueChange,
+  min,
+  max,
+  step = 1,
+  size = "md",
+  disabled,
+  invalid,
+  name,
+  placeholder,
+  suffix,
+  className
+}) {
+  const field = useFieldWiring();
+  const labels = useLabels();
+  const controlled = value !== void 0;
+  const [internal, setInternal] = useState(defaultValue);
+  const [text2, setText] = useState(() => formatValue(controlled ? value ?? null : defaultValue));
+  const current = controlled ? value ?? null : internal;
+  const bounds = { min, max, step };
+  const commit = (next) => {
+    if (!controlled) setInternal(next);
+    setText(formatValue(next));
+    onValueChange?.(next);
+  };
+  const onType = (event) => {
+    setText(event.target.value);
+    const parsed = parseNumber(event.target.value);
+    if (parsed === null) {
+      onValueChange?.(null);
+      if (!controlled) setInternal(null);
+      return;
+    }
+    if (!controlled) setInternal(parsed);
+    onValueChange?.(parsed);
+  };
+  return /* @__PURE__ */ jsxs("div", { className: cn("cb-number", `cb-number--${size}`, className), "data-disabled": disabled || void 0, children: [
+    /* @__PURE__ */ jsx(
+      "input",
+      {
+        className: "cb-number__input",
+        inputMode: "decimal",
+        id: field?.controlId,
+        name,
+        value: controlled ? formatValue(value ?? null) : text2,
+        placeholder,
+        disabled,
+        "aria-describedby": field?.describedBy,
+        "aria-invalid": invalid ?? field?.invalid ? true : void 0,
+        onChange: onType,
+        onBlur: () => {
+          const parsed = parseNumber(text2);
+          commit(parsed === null ? null : clamp(parsed, bounds));
+        }
+      }
+    ),
+    suffix ? /* @__PURE__ */ jsx("span", { className: "cb-number__suffix", "aria-hidden": "true", children: suffix }) : null,
+    /* @__PURE__ */ jsxs("span", { className: "cb-number__steppers", children: [
+      /* @__PURE__ */ jsx(
+        "button",
+        {
+          type: "button",
+          className: "cb-number__step",
+          "aria-label": labels.decrease,
+          disabled: disabled || !canStep(current, -1, bounds),
+          onClick: () => commit(stepBy(current, -1, bounds)),
+          children: /* @__PURE__ */ jsx(Minus, { size: 14 })
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        "button",
+        {
+          type: "button",
+          className: "cb-number__step",
+          "aria-label": labels.increase,
+          disabled: disabled || !canStep(current, 1, bounds),
+          onClick: () => commit(stepBy(current, 1, bounds)),
+          children: /* @__PURE__ */ jsx(Plus, { size: 14 })
+        }
+      )
+    ] })
+  ] });
+}
+function formatValue(value) {
+  return value === null ? "" : String(value);
+}
+function Dialog({
+  open,
+  defaultOpen,
+  onOpenChange,
+  title,
+  description,
+  children,
+  footer,
+  size = "md",
+  placement = "center",
+  trigger,
+  className
+}) {
+  return /* @__PURE__ */ jsxs(Dialog$1.Root, { open, defaultOpen, onOpenChange, children: [
+    trigger ? /* @__PURE__ */ jsx(Dialog$1.Trigger, { render: trigger }) : null,
+    /* @__PURE__ */ jsxs(Dialog$1.Portal, { children: [
+      /* @__PURE__ */ jsx(Dialog$1.Backdrop, { className: "cb-dialog__backdrop" }),
+      /* @__PURE__ */ jsxs(
+        Dialog$1.Popup,
+        {
+          className: cn("cb-dialog", `cb-dialog--${size}`, `cb-dialog--${placement}`, className),
+          children: [
+            /* @__PURE__ */ jsx(Dialog$1.Title, { className: "cb-dialog__title", children: title }),
+            description ? /* @__PURE__ */ jsx(Dialog$1.Description, { className: "cb-dialog__description", children: description }) : null,
+            children ? /* @__PURE__ */ jsx("div", { className: "cb-dialog__body", children }) : null,
+            footer ? /* @__PURE__ */ jsx("div", { className: "cb-dialog__footer", children: footer }) : null
+          ]
+        }
+      )
+    ] })
+  ] });
+}
+var DialogClose = Dialog$1.Close;
+
+// src/overlay/command.util.ts
+function rankCommand(command, query) {
+  const needle = query.trim().toLowerCase();
+  if (!needle) return 1;
+  const label = command.label.toLowerCase();
+  if (label === needle) return 100;
+  if (label.startsWith(needle)) return 80;
+  if (label.split(/\s+/).some((word) => word.startsWith(needle))) return 60;
+  if (label.includes(needle)) return 40;
+  if (command.keywords?.some((keyword) => keyword.toLowerCase().includes(needle))) return 20;
+  return 0;
+}
+function filterCommands(commands, query) {
+  return commands.map((command, index) => ({ command, score: rankCommand(command, query), index })).filter((entry) => entry.score > 0).sort((a, b) => b.score === a.score ? a.index - b.index : b.score - a.score).map((entry) => entry.command);
+}
+function groupCommands(commands) {
+  const groups = [];
+  for (const command of commands) {
+    const existing = groups.find((entry) => entry.group === command.group);
+    if (existing) existing.items.push(command);
+    else groups.push({ group: command.group, items: [command] });
+  }
+  return groups;
+}
+function CommandPalette({
+  open,
+  onOpenChange,
+  commands,
+  placeholder = "Type a command\u2026",
+  emptyMessage = "No matching command",
+  className
+}) {
+  const [query, setQuery] = useState("");
+  const [active, setActive] = useState(0);
+  const results = useMemo(() => filterCommands(commands, query), [commands, query]);
+  const groups = useMemo(() => groupCommands(results), [results]);
+  useEffect(() => {
+    if (!open) {
+      setQuery("");
+      setActive(0);
+    }
+  }, [open]);
+  useEffect(() => setActive(0), [query]);
+  const run = (command) => {
+    onOpenChange(false);
+    command.onRun();
+  };
+  return /* @__PURE__ */ jsx(Dialog$1.Root, { open, onOpenChange, children: /* @__PURE__ */ jsxs(Dialog$1.Portal, { children: [
+    /* @__PURE__ */ jsx(Dialog$1.Backdrop, { className: "cb-dialog__backdrop" }),
+    /* @__PURE__ */ jsxs(Dialog$1.Popup, { className: cn("cb-palette", className), "aria-label": "Command palette", children: [
+      /* @__PURE__ */ jsxs("div", { className: "cb-palette__search", children: [
+        /* @__PURE__ */ jsx(Search, { size: 16, className: "cb-palette__search-icon" }),
+        /* @__PURE__ */ jsx(
+          "input",
+          {
+            className: "cb-palette__input",
+            value: query,
+            placeholder,
+            autoFocus: true,
+            role: "combobox",
+            "aria-expanded": true,
+            "aria-controls": "cb-palette-list",
+            "aria-activedescendant": results[active] ? `cb-palette-${results[active].id}` : void 0,
+            onChange: (event) => setQuery(event.target.value),
+            onKeyDown: (event) => {
+              if (event.key === "ArrowDown") {
+                setActive((index) => Math.min(index + 1, results.length - 1));
+                event.preventDefault();
+              }
+              if (event.key === "ArrowUp") {
+                setActive((index) => Math.max(index - 1, 0));
+                event.preventDefault();
+              }
+              if (event.key === "Enter" && results[active]) {
+                run(results[active]);
+                event.preventDefault();
+              }
+            }
+          }
+        )
+      ] }),
+      /* @__PURE__ */ jsx("div", { className: "cb-palette__list", id: "cb-palette-list", role: "listbox", children: results.length === 0 ? /* @__PURE__ */ jsx("p", { className: "cb-palette__empty", children: emptyMessage }) : groups.map((group) => /* @__PURE__ */ jsxs("div", { className: "cb-palette__group", children: [
+        group.group ? /* @__PURE__ */ jsx("p", { className: "cb-palette__group-label", children: group.group }) : null,
+        group.items.map((command) => {
+          const index = results.indexOf(command);
+          return /* @__PURE__ */ jsxs(
+            "div",
+            {
+              id: `cb-palette-${command.id}`,
+              role: "option",
+              "aria-selected": index === active,
+              className: "cb-palette__item",
+              "data-active": index === active || void 0,
+              onMouseMove: () => setActive(index),
+              onClick: () => run(command),
+              children: [
+                /* @__PURE__ */ jsx("span", { className: "cb-palette__icon", children: command.icon }),
+                /* @__PURE__ */ jsx("span", { className: "cb-palette__label", children: command.label }),
+                command.shortcut ? /* @__PURE__ */ jsx("kbd", { className: "cb-palette__shortcut", children: command.shortcut }) : null
+              ]
+            },
+            command.id
+          );
+        })
+      ] }, group.group ?? "ungrouped")) })
+    ] })
+  ] }) });
+}
+function ProgressBar({ value, max = 100, tone = "brand", size = "md", label, showValue, className }) {
+  const indeterminate = value === void 0;
+  const clamped = indeterminate ? 0 : Math.min(Math.max(value, 0), max);
+  const percent = max > 0 ? Math.round(clamped / max * 100) : 0;
+  return /* @__PURE__ */ jsxs("div", { className: cn("cb-progress", className), "data-tone": tone, "data-size": size, children: [
+    /* @__PURE__ */ jsx(
+      "div",
+      {
+        className: "cb-progress__track",
+        role: "progressbar",
+        "aria-label": label,
+        "aria-valuemin": indeterminate ? void 0 : 0,
+        "aria-valuemax": indeterminate ? void 0 : max,
+        "aria-valuenow": indeterminate ? void 0 : clamped,
+        children: /* @__PURE__ */ jsx(
+          "div",
+          {
+            className: "cb-progress__fill",
+            "data-indeterminate": indeterminate || void 0,
+            style: indeterminate ? void 0 : { width: `${percent}%` }
+          }
+        )
+      }
+    ),
+    showValue && !indeterminate ? /* @__PURE__ */ jsxs("span", { className: "cb-progress__value", children: [
+      percent,
+      "%"
+    ] }) : null
+  ] });
+}
+function Checklist({ title = "Get started", tasks, completeSlot, className }) {
+  const done = tasks.filter((task) => task.done).length;
+  const complete = tasks.length > 0 && done === tasks.length;
+  return /* @__PURE__ */ jsxs("section", { className: cn("cb-checklist", className), "aria-label": typeof title === "string" ? title : "Checklist", children: [
+    /* @__PURE__ */ jsxs("header", { className: "cb-checklist__head", children: [
+      /* @__PURE__ */ jsx("p", { className: "cb-checklist__title", children: title }),
+      /* @__PURE__ */ jsxs("span", { className: "cb-checklist__count", children: [
+        done,
+        " of ",
+        tasks.length
+      ] })
+    ] }),
+    /* @__PURE__ */ jsx(ProgressBar, { value: done, max: Math.max(tasks.length, 1), size: "sm", label: `${done} of ${tasks.length} tasks done` }),
+    complete && completeSlot ? /* @__PURE__ */ jsx("div", { className: "cb-checklist__complete", children: completeSlot }) : /* @__PURE__ */ jsx("ul", { className: "cb-checklist__list", children: tasks.map((task) => /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsxs(
+      "button",
+      {
+        type: "button",
+        className: "cb-checklist__task",
+        "data-done": task.done || void 0,
+        onClick: task.onSelect,
+        disabled: !task.onSelect,
+        children: [
+          /* @__PURE__ */ jsx("span", { className: "cb-checklist__marker", "aria-hidden": "true", children: task.done ? /* @__PURE__ */ jsx(Check, { size: 12, strokeWidth: 3 }) : null }),
+          /* @__PURE__ */ jsxs("span", { className: "cb-checklist__text", children: [
+            /* @__PURE__ */ jsxs("span", { className: "cb-checklist__label", children: [
+              task.label,
+              /* @__PURE__ */ jsx("span", { className: "cb-visually-hidden", children: task.done ? " (done)" : "" })
+            ] }),
+            task.description ? /* @__PURE__ */ jsx("span", { className: "cb-checklist__description", children: task.description }) : null
+          ] }),
+          task.onSelect && !task.done ? /* @__PURE__ */ jsx(ChevronRight, { size: 16, className: "cb-checklist__chevron" }) : null
+        ]
+      }
+    ) }, task.id)) })
+  ] });
+}
+function Popover({
+  trigger,
+  children,
+  side = "bottom",
+  align = "center",
+  sideOffset = 8,
+  showArrow = true,
+  open,
+  onOpenChange,
+  className
+}) {
+  return /* @__PURE__ */ jsxs(Popover$1.Root, { open, onOpenChange, children: [
+    /* @__PURE__ */ jsx(Popover$1.Trigger, { render: trigger }),
+    /* @__PURE__ */ jsx(Popover$1.Portal, { children: /* @__PURE__ */ jsx(Popover$1.Positioner, { side, align, sideOffset, children: /* @__PURE__ */ jsxs(Popover$1.Popup, { className: cn("cb-popover", className), children: [
+      showArrow ? /* @__PURE__ */ jsx(Popover$1.Arrow, { className: "cb-popover__arrow", children: /* @__PURE__ */ jsx(ArrowShape, {}) }) : null,
+      children
+    ] }) }) })
+  ] });
+}
+function Tooltip({ children, label, side = "top", delay = 400 }) {
+  return /* @__PURE__ */ jsx(Tooltip$1.Provider, { delay, children: /* @__PURE__ */ jsxs(Tooltip$1.Root, { children: [
+    /* @__PURE__ */ jsx(Tooltip$1.Trigger, { render: children }),
+    /* @__PURE__ */ jsx(Tooltip$1.Portal, { children: /* @__PURE__ */ jsx(Tooltip$1.Positioner, { side, sideOffset: 6, children: /* @__PURE__ */ jsx(Tooltip$1.Popup, { className: "cb-tooltip", children: label }) }) })
+  ] }) });
+}
+function ArrowShape() {
+  return /* @__PURE__ */ jsx("span", { className: "cb-arrow", "aria-hidden": "true" });
+}
+var ICONS = {
+  neutral: /* @__PURE__ */ jsx(Info, { size: 18 }),
+  brand: /* @__PURE__ */ jsx(Info, { size: 18 }),
+  info: /* @__PURE__ */ jsx(Info, { size: 18 }),
+  success: /* @__PURE__ */ jsx(CheckCircle2, { size: 18 }),
+  warning: /* @__PURE__ */ jsx(AlertTriangle, { size: 18 }),
+  danger: /* @__PURE__ */ jsx(XCircle, { size: 18 })
+};
+function Alert({ title, children, tone = "info", icon, actions, onDismiss, className }) {
+  const labels = useLabels();
+  const assertive = tone === "danger" || tone === "warning";
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: cn("cb-alert", className),
+      "data-tone": tone,
+      role: assertive ? "alert" : "status",
+      "aria-live": assertive ? "assertive" : "polite",
+      children: [
+        icon === null ? null : /* @__PURE__ */ jsx("span", { className: "cb-alert__icon", children: icon ?? ICONS[tone] }),
+        /* @__PURE__ */ jsxs("div", { className: "cb-alert__body", children: [
+          title ? /* @__PURE__ */ jsx("p", { className: "cb-alert__title", children: title }) : null,
+          children ? /* @__PURE__ */ jsx("div", { className: "cb-alert__text", children }) : null,
+          actions ? /* @__PURE__ */ jsx("div", { className: "cb-alert__actions", children: actions }) : null
+        ] }),
+        onDismiss ? /* @__PURE__ */ jsx("button", { type: "button", className: "cb-alert__close", "aria-label": labels.dismiss, onClick: onDismiss, children: /* @__PURE__ */ jsx(X, { size: 16 }) }) : null
+      ]
+    }
+  );
+}
+function ToastProvider({
+  children,
+  timeout = 5e3,
+  limit = 4,
+  position = "bottom-end"
+}) {
+  return /* @__PURE__ */ jsxs(Toast.Provider, { timeout, limit, children: [
+    children,
+    /* @__PURE__ */ jsx(Toast.Portal, { children: /* @__PURE__ */ jsx(Toast.Viewport, { className: "cb-toast__viewport", "data-position": position, children: /* @__PURE__ */ jsx(ToastList, {}) }) })
+  ] });
+}
+var ICONS2 = {
+  success: /* @__PURE__ */ jsx(CheckCircle2, { size: 16 }),
+  warning: /* @__PURE__ */ jsx(AlertTriangle, { size: 16 }),
+  danger: /* @__PURE__ */ jsx(XCircle, { size: 16 }),
+  error: /* @__PURE__ */ jsx(XCircle, { size: 16 }),
+  info: /* @__PURE__ */ jsx(Info, { size: 16 })
+};
+function ToastList() {
+  const { toasts } = Toast.useToastManager();
+  const labels = useLabels();
+  return toasts.map((toast) => /* @__PURE__ */ jsxs(Toast.Root, { toast, className: cn("cb-toast"), "data-tone": toast.type ?? "neutral", children: [
+    /* @__PURE__ */ jsx("span", { className: "cb-toast__icon", children: ICONS2[toast.type ?? "info"] ?? ICONS2.info }),
+    /* @__PURE__ */ jsxs(Toast.Content, { className: "cb-toast__content", children: [
+      /* @__PURE__ */ jsx(Toast.Title, { className: "cb-toast__title" }),
+      /* @__PURE__ */ jsx(Toast.Description, { className: "cb-toast__description" })
+    ] }),
+    /* @__PURE__ */ jsx(Toast.Action, { className: "cb-toast__action" }),
+    /* @__PURE__ */ jsx(Toast.Close, { className: "cb-toast__close", "aria-label": labels.dismiss, children: /* @__PURE__ */ jsx(X, { size: 14 }) })
+  ] }, toast.id));
+}
+function useToast() {
+  const manager = Toast.useToastManager();
+  return {
+    show: ({ title, description, tone = "info", timeout, action }) => manager.add({
+      title,
+      description,
+      type: tone,
+      // Errors do not time out: something went wrong is not a thing to miss by looking away.
+      timeout: timeout ?? (tone === "danger" ? 0 : void 0),
+      ...action ? { actionProps: { children: action.label, onClick: action.onClick } } : {}
+    }),
+    close: (id) => manager.close(id),
+    promise: manager.promise
+  };
+}
+function Tabs({ items, value, defaultValue, onValueChange, variant = "underline", className }) {
+  return /* @__PURE__ */ jsxs(
+    Tabs$1.Root,
+    {
+      value,
+      defaultValue: defaultValue ?? items[0]?.value,
+      onValueChange: (next) => onValueChange?.(String(next)),
+      className: cn("cb-tabs", `cb-tabs--${variant}`, className),
+      children: [
+        /* @__PURE__ */ jsxs(Tabs$1.List, { className: "cb-tabs__list", children: [
+          items.map((item) => /* @__PURE__ */ jsxs(Tabs$1.Tab, { value: item.value, disabled: item.disabled, className: "cb-tabs__tab", children: [
+            item.label,
+            item.adornment ? /* @__PURE__ */ jsx("span", { className: "cb-tabs__adornment", children: item.adornment }) : null
+          ] }, item.value)),
+          /* @__PURE__ */ jsx(Tabs$1.Indicator, { className: "cb-tabs__indicator" })
+        ] }),
+        items.map((item) => /* @__PURE__ */ jsx(Tabs$1.Panel, { value: item.value, className: "cb-tabs__panel", children: item.content }, item.value))
+      ]
+    }
+  );
+}
+function DropdownMenu({ trigger, items, align = "end", side = "bottom", className }) {
+  return /* @__PURE__ */ jsxs(Menu.Root, { children: [
+    /* @__PURE__ */ jsx(Menu.Trigger, { render: trigger }),
+    /* @__PURE__ */ jsx(Menu.Portal, { children: /* @__PURE__ */ jsx(Menu.Positioner, { side, align, sideOffset: 6, children: /* @__PURE__ */ jsx(Menu.Popup, { className: cn("cb-menu", className), children: items.map(
+      (item, index) => item.separator ? /* @__PURE__ */ jsx(Menu.Separator, { className: "cb-menu__separator" }, `separator-${index}`) : /* @__PURE__ */ jsxs(
+        Menu.Item,
+        {
+          className: "cb-menu__item",
+          "data-tone": item.tone,
+          disabled: item.disabled,
+          onClick: item.onSelect,
+          children: [
+            /* @__PURE__ */ jsx("span", { className: "cb-menu__icon", children: item.checked ? /* @__PURE__ */ jsx(Check, { size: 14 }) : item.icon }),
+            /* @__PURE__ */ jsx("span", { className: "cb-menu__label", children: item.label }),
+            item.shortcut ? /* @__PURE__ */ jsx("kbd", { className: "cb-menu__shortcut", children: item.shortcut }) : null
+          ]
+        },
+        `${String(item.label)}-${index}`
+      )
+    ) }) }) })
+  ] });
+}
+var hasActiveChild = (item) => Boolean(item.items?.some((child) => child.active));
+function Sidebar({ sections, header, footer, collapsed = false, onCollapsedChange, className }) {
+  const labels = useLabels();
+  return /* @__PURE__ */ jsxs(
+    "nav",
+    {
+      className: cn("cb-sidebar", collapsed && "cb-sidebar--collapsed", className),
+      "aria-label": "Main",
+      "data-collapsed": collapsed || void 0,
+      children: [
+        header ? /* @__PURE__ */ jsx("div", { className: "cb-sidebar__header", children: header }) : null,
+        /* @__PURE__ */ jsx("div", { className: "cb-sidebar__body", children: sections.map((section, index) => /* @__PURE__ */ jsxs("div", { className: "cb-sidebar__section", children: [
+          section.title && !collapsed ? /* @__PURE__ */ jsx("p", { className: "cb-sidebar__title", children: section.title }) : null,
+          section.items.map((item, itemIndex) => /* @__PURE__ */ jsx(SidebarEntry, { item, collapsed }, itemIndex))
+        ] }, index)) }),
+        footer ? /* @__PURE__ */ jsx("div", { className: "cb-sidebar__footer", children: footer }) : null,
+        onCollapsedChange ? /* @__PURE__ */ jsx(
+          "button",
+          {
+            type: "button",
+            className: "cb-sidebar__toggle",
+            "aria-label": collapsed ? labels.expandNavigation : labels.collapseNavigation,
+            "aria-expanded": !collapsed,
+            onClick: () => onCollapsedChange(!collapsed),
+            children: collapsed ? /* @__PURE__ */ jsx(PanelLeftOpen, { size: 16 }) : /* @__PURE__ */ jsx(PanelLeftClose, { size: 16 })
+          }
+        ) : null
+      ]
+    }
+  );
+}
+function SidebarEntry({ item, collapsed }) {
+  const children = item.items ?? [];
+  const [open, setOpen] = useState(() => hasActiveChild(item));
+  if (children.length === 0) {
+    const row = /* @__PURE__ */ jsx(SidebarRow, { item, collapsed });
+    return collapsed ? /* @__PURE__ */ jsx(Flyout, { label: item.label, children: row }) : row;
+  }
+  if (collapsed) {
+    return /* @__PURE__ */ jsx(Flyout, { label: item.label, items: children, children: /* @__PURE__ */ jsx(SidebarRow, { item: { ...item, active: item.active || hasActiveChild(item) }, collapsed: true }) });
+  }
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsxs(
+      "button",
+      {
+        type: "button",
+        className: "cb-sidebar__item",
+        "data-active": item.active || hasActiveChild(item) || void 0,
+        "aria-expanded": open,
+        onClick: () => setOpen((value) => !value),
+        children: [
+          item.icon ? /* @__PURE__ */ jsx("span", { className: "cb-sidebar__icon", children: item.icon }) : null,
+          /* @__PURE__ */ jsx("span", { className: "cb-sidebar__label", children: item.label }),
+          item.adornment ? /* @__PURE__ */ jsx("span", { className: "cb-sidebar__adornment", children: item.adornment }) : null,
+          /* @__PURE__ */ jsx(ChevronRight, { size: 14, className: "cb-sidebar__chevron", "data-open": open || void 0 })
+        ]
+      }
+    ),
+    open ? /* @__PURE__ */ jsx("div", { className: "cb-sidebar__children", children: children.map((child, index) => /* @__PURE__ */ jsx(SidebarRow, { item: child, collapsed: false, nested: true }, index)) }) : null
+  ] });
+}
+function SidebarRow({ item, collapsed, nested }) {
+  const content = /* @__PURE__ */ jsxs(Fragment, { children: [
+    item.icon ? /* @__PURE__ */ jsx("span", { className: "cb-sidebar__icon", children: item.icon }) : null,
+    /* @__PURE__ */ jsx("span", { className: "cb-sidebar__label", children: item.label }),
+    item.adornment && !collapsed ? /* @__PURE__ */ jsx("span", { className: "cb-sidebar__adornment", children: item.adornment }) : null
+  ] });
+  const props = {
+    className: cn("cb-sidebar__item", nested && "cb-sidebar__item--nested"),
+    "data-active": item.active || void 0,
+    "aria-current": item.active ? "page" : void 0
+  };
+  return item.href ? /* @__PURE__ */ jsx("a", { href: item.href, ...props, children: content }) : /* @__PURE__ */ jsx("button", { type: "button", onClick: item.onClick, ...props, children: content });
+}
+function Flyout({ label, items, children }) {
+  return /* @__PURE__ */ jsxs(Popover$1.Root, { children: [
+    /* @__PURE__ */ jsx(
+      Popover$1.Trigger,
+      {
+        openOnHover: true,
+        delay: 120,
+        nativeButton: false,
+        render: /* @__PURE__ */ jsx("span", { className: "cb-sidebar__flyout-trigger", children })
+      }
+    ),
+    /* @__PURE__ */ jsx(Popover$1.Portal, { children: /* @__PURE__ */ jsx(Popover$1.Positioner, { side: "right", align: "start", sideOffset: 8, className: "cb-sidebar__flyout-positioner", children: /* @__PURE__ */ jsxs(Popover$1.Popup, { className: "cb-sidebar__flyout", children: [
+      /* @__PURE__ */ jsx("p", { className: "cb-sidebar__flyout-title", children: label }),
+      items?.length ? /* @__PURE__ */ jsx("div", { className: "cb-sidebar__flyout-items", children: items.map((child, index) => /* @__PURE__ */ jsx(SidebarRow, { item: child, collapsed: false }, index)) }) : null
+    ] }) }) })
+  ] });
+}
+function TopBar({ title, subtitle, center, actions, sticky = true, className }) {
+  return /* @__PURE__ */ jsxs("header", { className: cn("cb-topbar", sticky && "cb-topbar--sticky", className), children: [
+    /* @__PURE__ */ jsxs("div", { className: "cb-topbar__lead", children: [
+      title ? /* @__PURE__ */ jsx("div", { className: "cb-topbar__title", children: title }) : null,
+      subtitle ? /* @__PURE__ */ jsx("p", { className: "cb-topbar__subtitle", children: subtitle }) : null
+    ] }),
+    center ? /* @__PURE__ */ jsx("div", { className: "cb-topbar__center", children: center }) : null,
+    actions ? /* @__PURE__ */ jsx("div", { className: "cb-topbar__actions", children: actions }) : null
+  ] });
+}
+function box({ width = "100%", height = "1rem", radius = "md", className }) {
+  const style = { "--cb-skeleton-w": width, "--cb-skeleton-h": height };
+  return /* @__PURE__ */ jsx("span", { "aria-hidden": "true", className: cn("cb-skeleton", `cb-radius--${radius}`, className), style });
+}
+function text({ lines = 3, lastLineWidth = "62%", className }) {
+  return /* @__PURE__ */ jsx("span", { className: cn("cb-skeleton-text", className), children: Array.from({ length: lines }, (_, i) => /* @__PURE__ */ jsx(SkeletonBox, { height: "0.75rem", width: i === lines - 1 ? lastLineWidth : "100%" }, i)) });
+}
+function circle({ size = "2.5rem", className }) {
+  return /* @__PURE__ */ jsx(SkeletonBox, { width: size, height: size, radius: "full", className });
+}
+var SkeletonBox = box;
+var Skeleton = Object.assign(box, {
+  Text: text,
+  Circle: circle,
+  Rect: box
+});
+
+// src/data/table-sort.ts
+function nextSort(current, column) {
+  if (!current || current.column !== column) return { column, direction: "asc" };
+  if (current.direction === "asc") return { column, direction: "desc" };
+  return null;
+}
+function ariaSortFor(current, column) {
+  if (!current || current.column !== column) return "none";
+  return current.direction === "asc" ? "ascending" : "descending";
+}
+function pageRange(page, pageSize, total, siblings = 1) {
+  const totalPages = Math.max(Math.ceil(total / Math.max(pageSize, 1)), 1);
+  const current = Math.min(Math.max(page, 1), totalPages);
+  const from = total === 0 ? 0 : (current - 1) * pageSize + 1;
+  const to = Math.min(current * pageSize, total);
+  const pages = /* @__PURE__ */ new Set([1, totalPages]);
+  for (let offset = -siblings; offset <= siblings; offset += 1) {
+    const candidate = current + offset;
+    if (candidate >= 1 && candidate <= totalPages) pages.add(candidate);
+  }
+  const sorted = [...pages].sort((a, b) => a - b);
+  const items = [];
+  sorted.forEach((value, index) => {
+    const previous = sorted[index - 1];
+    if (previous !== void 0 && value - previous === 2) items.push(previous + 1);
+    else if (previous !== void 0 && value - previous > 2) items.push(null);
+    items.push(value);
+  });
+  return { items, totalPages, from, to };
+}
+function DataTable({
+  columns,
+  rows,
+  rowKey,
+  label,
+  sort = null,
+  onSortChange,
+  onRowClick,
+  empty,
+  className
+}) {
+  if (rows.length === 0 && empty) {
+    return /* @__PURE__ */ jsx("div", { className: cn("cb-table__empty", className), children: empty });
+  }
+  return /* @__PURE__ */ jsx("div", { className: cn("cb-table__scroll", className), children: /* @__PURE__ */ jsxs("table", { className: "cb-table", "aria-label": label, children: [
+    /* @__PURE__ */ jsx("thead", { children: /* @__PURE__ */ jsx("tr", { children: columns.map((column) => /* @__PURE__ */ jsx(
+      "th",
+      {
+        scope: "col",
+        style: column.width ? { width: column.width } : void 0,
+        "data-align": column.align,
+        "data-secondary": column.secondary || void 0,
+        "aria-sort": column.sortable ? ariaSortFor(sort, column.key) : void 0,
+        children: column.sortable && onSortChange ? /* @__PURE__ */ jsxs(
+          "button",
+          {
+            type: "button",
+            className: "cb-table__sort",
+            onClick: () => onSortChange(nextSort(sort, column.key)),
+            children: [
+              column.header,
+              /* @__PURE__ */ jsx(SortIcon, { state: sort, column: column.key })
+            ]
+          }
+        ) : column.header
+      },
+      column.key
+    )) }) }),
+    /* @__PURE__ */ jsx("tbody", { children: rows.map((row) => /* @__PURE__ */ jsx(
+      "tr",
+      {
+        "data-clickable": onRowClick ? "" : void 0,
+        onClick: onRowClick ? () => onRowClick(row) : void 0,
+        children: columns.map((column) => /* @__PURE__ */ jsx(
+          "td",
+          {
+            "data-align": column.align,
+            "data-secondary": column.secondary || void 0,
+            "data-truncate": column.truncate || void 0,
+            children: column.cell(row)
+          },
+          column.key
+        ))
+      },
+      rowKey(row)
+    )) })
+  ] }) });
+}
+function SortIcon({ state, column }) {
+  if (!state || state.column !== column) return /* @__PURE__ */ jsx(ChevronsUpDown, { size: 13, className: "cb-table__sort-idle" });
+  return state.direction === "asc" ? /* @__PURE__ */ jsx(ArrowUp, { size: 13 }) : /* @__PURE__ */ jsx(ArrowDown, { size: 13 });
+}
+function DataTableSkeleton({ columns, rows = 5, className }) {
+  return /* @__PURE__ */ jsx("div", { className: cn("cb-table__scroll", className), "aria-hidden": "true", children: /* @__PURE__ */ jsxs("table", { className: "cb-table", children: [
+    /* @__PURE__ */ jsx("thead", { children: /* @__PURE__ */ jsx("tr", { children: Array.from({ length: columns }, (_, index) => /* @__PURE__ */ jsx("th", { children: /* @__PURE__ */ jsx(Skeleton, { width: "60%", height: "0.75rem" }) }, index)) }) }),
+    /* @__PURE__ */ jsx("tbody", { children: Array.from({ length: rows }, (_, rowIndex) => /* @__PURE__ */ jsx("tr", { children: Array.from({ length: columns }, (_2, cellIndex) => /* @__PURE__ */ jsx("td", { children: /* @__PURE__ */ jsx(Skeleton, { width: cellIndex === 0 ? "70%" : "45%", height: "0.875rem" }) }, cellIndex)) }, rowIndex)) })
+  ] }) });
+}
+DataTable.Skeleton = DataTableSkeleton;
+function Pagination({
+  page,
+  pageSize,
+  total,
+  onPageChange,
+  showSummary = true,
+  siblings = 1,
+  className
+}) {
+  const labels = useLabels();
+  const { items, totalPages, from, to } = pageRange(page, pageSize, total, siblings);
+  const current = Math.min(Math.max(page, 1), totalPages);
+  return /* @__PURE__ */ jsxs("nav", { className: cn("cb-pagination", className), "aria-label": "Pagination", children: [
+    showSummary ? /* @__PURE__ */ jsx("p", { className: "cb-pagination__summary", children: labels.pageSummary(from, to, total) }) : null,
+    /* @__PURE__ */ jsxs("div", { className: "cb-pagination__controls", children: [
+      /* @__PURE__ */ jsx(
+        "button",
+        {
+          type: "button",
+          className: "cb-pagination__step",
+          "aria-label": labels.previousPage,
+          disabled: current <= 1,
+          onClick: () => onPageChange(current - 1),
+          children: /* @__PURE__ */ jsx(ChevronLeft, { size: 16 })
+        }
+      ),
+      items.map(
+        (item, index) => item === null ? /* @__PURE__ */ jsx("span", { className: "cb-pagination__gap", "aria-hidden": "true", children: "\u2026" }, `gap-${index}`) : /* @__PURE__ */ jsx(
+          "button",
+          {
+            type: "button",
+            className: "cb-pagination__page",
+            "data-active": item === current || void 0,
+            "aria-label": labels.page(item),
+            "aria-current": item === current ? "page" : void 0,
+            onClick: () => onPageChange(item),
+            children: item
+          },
+          item
+        )
+      ),
+      /* @__PURE__ */ jsx(
+        "button",
+        {
+          type: "button",
+          className: "cb-pagination__step",
+          "aria-label": labels.nextPage,
+          disabled: current >= totalPages,
+          onClick: () => onPageChange(current + 1),
+          children: /* @__PURE__ */ jsx(ChevronRight, { size: 16 })
+        }
+      )
+    ] })
+  ] });
+}
+function Image({
+  src,
+  alt,
+  aspectRatio,
+  blurDataUrl,
+  background,
+  fit = "cover",
+  radius = "md",
+  loading = "lazy",
+  className
+}) {
+  const [loaded, setLoaded] = useState(false);
+  const style = {
+    ...aspectRatio ? { aspectRatio: String(aspectRatio) } : {},
+    ...background ? { background } : {},
+    ...blurDataUrl ? { backgroundImage: `url(${blurDataUrl})` } : {}
+  };
+  return /* @__PURE__ */ jsx(
+    "span",
+    {
+      className: cn("cb-image", `cb-radius--${radius}`, className),
+      "data-loaded": loaded || void 0,
+      "data-blurred": blurDataUrl ? "" : void 0,
+      style,
+      children: /* @__PURE__ */ jsx(
+        "img",
+        {
+          className: "cb-image__img",
+          src,
+          alt,
+          loading,
+          decoding: "async",
+          style: { objectFit: fit },
+          onLoad: () => setLoaded(true),
+          ref: (node) => {
+            if (node?.complete) setLoaded(true);
+          }
+        }
+      )
+    }
+  );
+}
+
+// src/media/autoplay.ts
+function shouldAutoplay(conditions) {
+  if (!conditions.requested) return false;
+  if (conditions.reducedMotion) return false;
+  if (conditions.documentHidden) return false;
+  if (conditions.pointerInside) return false;
+  if (conditions.focusInside) return false;
+  return true;
+}
+function CarouselRoot({
+  children,
+  label,
+  slideWidth = "18rem",
+  gap = 4,
+  loop = false,
+  align = "start",
+  autoplay,
+  showArrows = true,
+  showDots = true,
+  className
+}) {
+  const { enabled: motionEnabled } = useMotionSettings();
+  const labels = useLabels();
+  const [emblaRef, embla] = useEmblaCarousel({ loop, align, containScroll: "trimSnaps" });
+  const [selected, setSelected] = useState(0);
+  const [snapCount, setSnapCount] = useState(0);
+  const [pointerInside, setPointerInside] = useState(false);
+  const [focusInside, setFocusInside] = useState(false);
+  const [documentHidden, setDocumentHidden] = useState(false);
+  const rootRef = useRef(null);
+  useEffect(() => {
+    if (!embla) return;
+    const sync = () => {
+      setSelected(embla.selectedScrollSnap());
+      setSnapCount(embla.scrollSnapList().length);
+    };
+    sync();
+    embla.on("select", sync).on("reInit", sync);
+    return () => {
+      embla.off("select", sync).off("reInit", sync);
+    };
+  }, [embla]);
+  useEffect(() => {
+    const onVisibility = () => setDocumentHidden(document.hidden);
+    onVisibility();
+    document.addEventListener("visibilitychange", onVisibility);
+    return () => document.removeEventListener("visibilitychange", onVisibility);
+  }, []);
+  const running = shouldAutoplay({
+    requested: Boolean(autoplay),
+    pointerInside,
+    focusInside,
+    documentHidden,
+    reducedMotion: !motionEnabled
+  });
+  useEffect(() => {
+    if (!embla || !running || !autoplay) return;
+    const timer = window.setInterval(() => {
+      if (embla.canScrollNext()) embla.scrollNext();
+      else embla.scrollTo(0);
+    }, autoplay);
+    return () => window.clearInterval(timer);
+  }, [embla, running, autoplay]);
+  const onKeyDown = useCallback(
+    (event) => {
+      if (!embla) return;
+      if (event.key === "ArrowRight") {
+        embla.scrollNext();
+        event.preventDefault();
+      }
+      if (event.key === "ArrowLeft") {
+        embla.scrollPrev();
+        event.preventDefault();
+      }
+    },
+    [embla]
+  );
+  const style = {
+    "--cb-carousel-slide": slideWidth,
+    "--cb-carousel-gap": `var(--cb-space-${gap})`
+  };
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      ref: rootRef,
+      className: cn("cb-carousel", className),
+      style,
+      role: "region",
+      "aria-roledescription": "carousel",
+      "aria-label": label,
+      tabIndex: 0,
+      onKeyDown,
+      onPointerEnter: () => setPointerInside(true),
+      onPointerLeave: () => setPointerInside(false),
+      onFocus: () => setFocusInside(true),
+      onBlur: (event) => {
+        if (!rootRef.current?.contains(event.relatedTarget)) setFocusInside(false);
+      },
+      children: [
+        /* @__PURE__ */ jsx("div", { className: "cb-carousel__viewport", ref: emblaRef, children: /* @__PURE__ */ jsx("div", { className: "cb-carousel__track", children }) }),
+        showArrows ? /* @__PURE__ */ jsxs("div", { className: "cb-carousel__arrows", children: [
+          /* @__PURE__ */ jsx(
+            "button",
+            {
+              type: "button",
+              className: "cb-carousel__arrow",
+              "aria-label": labels.previousSlide,
+              onClick: () => embla?.scrollPrev(),
+              disabled: !loop && selected === 0,
+              children: /* @__PURE__ */ jsx(ChevronLeft, { size: 18 })
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            "button",
+            {
+              type: "button",
+              className: "cb-carousel__arrow",
+              "aria-label": labels.nextSlide,
+              onClick: () => embla?.scrollNext(),
+              disabled: !loop && snapCount > 0 && selected === snapCount - 1,
+              children: /* @__PURE__ */ jsx(ChevronRight, { size: 18 })
+            }
+          )
+        ] }) : null,
+        showDots && snapCount > 1 ? /* @__PURE__ */ jsx("div", { className: "cb-carousel__dots", children: Array.from({ length: snapCount }, (_, index) => /* @__PURE__ */ jsx(
+          "button",
+          {
+            type: "button",
+            className: "cb-carousel__dot",
+            "data-active": index === selected || void 0,
+            "aria-label": labels.goToSlide(index + 1),
+            "aria-current": index === selected || void 0,
+            onClick: () => embla?.scrollTo(index)
+          },
+          index
+        )) }) : null
+      ]
+    }
+  );
+}
+function CarouselSlide({ children, className }) {
+  return /* @__PURE__ */ jsx("div", { className: cn("cb-carousel__slide", className), role: "group", "aria-roledescription": "slide", children });
+}
+function CarouselSkeleton({
+  slides = 3,
+  slideWidth = "18rem",
+  slideHeight = "10rem",
+  gap = 4
+}) {
+  const style = {
+    "--cb-carousel-slide": slideWidth,
+    "--cb-carousel-gap": `var(--cb-space-${gap})`
+  };
+  return /* @__PURE__ */ jsx("div", { className: "cb-carousel", style, "aria-hidden": "true", children: /* @__PURE__ */ jsx("div", { className: "cb-carousel__viewport", children: /* @__PURE__ */ jsx("div", { className: "cb-carousel__track", children: Array.from({ length: slides }, (_, index) => /* @__PURE__ */ jsx("div", { className: "cb-carousel__slide", children: /* @__PURE__ */ jsx(Skeleton, { height: slideHeight, radius: "lg" }) }, index)) }) }) });
+}
+var Carousel = Object.assign(CarouselRoot, {
+  Slide: CarouselSlide,
+  Skeleton: CarouselSkeleton
+});
+function Coachmark({
+  open,
+  anchor,
+  title,
+  children,
+  side = "bottom",
+  align = "center",
+  spotlight = true,
+  progress,
+  actions,
+  onDismiss,
+  className
+}) {
+  const labels = useLabels();
+  const rect = useAnchorRect(anchor, open && spotlight !== false);
+  const padding = typeof spotlight === "number" ? spotlight : 8;
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    rect ? /* @__PURE__ */ jsx(
+      "div",
+      {
+        className: "cb-spotlight",
+        "aria-hidden": "true",
+        onClick: onDismiss,
+        style: {
+          "--cb-spotlight-x": `${rect.left - padding}px`,
+          "--cb-spotlight-y": `${rect.top - padding}px`,
+          "--cb-spotlight-w": `${rect.width + padding * 2}px`,
+          "--cb-spotlight-h": `${rect.height + padding * 2}px`
+        }
+      }
+    ) : null,
+    /* @__PURE__ */ jsx(Popover$1.Root, { open: open && Boolean(anchor), onOpenChange: (next) => !next && onDismiss?.(), children: /* @__PURE__ */ jsx(Popover$1.Portal, { children: /* @__PURE__ */ jsx(
+      Popover$1.Positioner,
+      {
+        className: "cb-coachmark__positioner",
+        anchor,
+        side,
+        align,
+        sideOffset: 12,
+        children: /* @__PURE__ */ jsxs(Popover$1.Popup, { className: cn("cb-coachmark", className), children: [
+          /* @__PURE__ */ jsx(Popover$1.Arrow, { className: "cb-popover__arrow", children: /* @__PURE__ */ jsx(ArrowShape, {}) }),
+          /* @__PURE__ */ jsxs("div", { className: "cb-coachmark__head", children: [
+            /* @__PURE__ */ jsx("p", { className: "cb-coachmark__title", children: title }),
+            onDismiss ? /* @__PURE__ */ jsx(
+              "button",
+              {
+                type: "button",
+                className: "cb-coachmark__close",
+                "aria-label": labels.dismiss,
+                onClick: onDismiss,
+                children: /* @__PURE__ */ jsx(X, { size: 16 })
+              }
+            ) : null
+          ] }),
+          children ? /* @__PURE__ */ jsx("div", { className: "cb-coachmark__body", children }) : null,
+          progress || actions ? /* @__PURE__ */ jsxs("div", { className: "cb-coachmark__foot", children: [
+            progress ? /* @__PURE__ */ jsx("span", { className: "cb-coachmark__progress", children: labels.progress(progress.current, progress.total) }) : /* @__PURE__ */ jsx("span", {}),
+            actions ? /* @__PURE__ */ jsx("div", { className: "cb-coachmark__actions", children: actions }) : null
+          ] }) : null
+        ] })
+      }
+    ) }) })
+  ] });
+}
+function useAnchorRect(anchor, active) {
+  const [rect, setRect] = useState(null);
+  useEffect(() => {
+    if (!anchor || !active) {
+      setRect(null);
+      return;
+    }
+    const measure = () => setRect(anchor.getBoundingClientRect());
+    measure();
+    const observer = new ResizeObserver(measure);
+    observer.observe(anchor);
+    window.addEventListener("scroll", measure, true);
+    window.addEventListener("resize", measure);
+    return () => {
+      observer.disconnect();
+      window.removeEventListener("scroll", measure, true);
+      window.removeEventListener("resize", measure);
+    };
+  }, [anchor, active]);
+  return rect;
+}
+
+// src/onboarding/tour-machine.ts
+var initialTourState = { index: 0, status: "idle" };
+function tourReducer(state, action, stepCount) {
+  const lastIndex = Math.max(stepCount - 1, 0);
+  switch (action.type) {
+    case "start":
+      return stepCount === 0 ? { index: 0, status: "finished" } : { index: 0, status: "running" };
+    case "next":
+      if (state.status !== "running") return state;
+      return state.index >= lastIndex ? { index: state.index, status: "finished" } : { index: state.index + 1, status: "running" };
+    case "prev":
+      if (state.status !== "running") return state;
+      return { index: Math.max(state.index - 1, 0), status: "running" };
+    case "goto":
+      if (state.status !== "running") return state;
+      return { index: Math.min(Math.max(action.index, 0), lastIndex), status: "running" };
+    case "skip":
+      return { index: state.index, status: "skipped" };
+    case "finish":
+      return { index: state.index, status: "finished" };
+    default:
+      return state;
+  }
+}
+function hasEnded(status) {
+  return status === "finished" || status === "skipped";
+}
+function resolveTarget(target, root) {
+  if (!target) return null;
+  if (typeof target === "string") return root.querySelector(target);
+  if (typeof target === "function") return target();
+  if (target instanceof Element) return target;
+  if ("current" in target) return target.current;
+  return null;
+}
+function Tour({ id, steps, open = false, onOpenChange, seenStore, onFinish, onSkip, labels }) {
+  const [state, rawDispatch] = useReducer(
+    (current, action) => tourReducer(current, action, steps.length),
+    initialTourState
+  );
+  const [anchor, setAnchor] = useState(null);
+  const { enabled: motionEnabled } = useMotionSettings();
+  const provided = useLabels();
+  const [allowed, setAllowed] = useState(seenStore ? null : true);
+  const marked = useRef(false);
+  const text2 = { back: provided.back, next: provided.next, done: provided.done, skip: provided.skip, ...labels };
+  useEffect(() => {
+    if (!seenStore) return;
+    let cancelled = false;
+    void Promise.resolve(seenStore.has(id)).then((seen) => {
+      if (!cancelled) setAllowed(!seen);
+    });
+    return () => {
+      cancelled = true;
+    };
+  }, [seenStore, id]);
+  useEffect(() => {
+    if (open && allowed && state.status === "idle") rawDispatch({ type: "start" });
+  }, [open, allowed, state.status]);
+  useEffect(() => {
+    if (state.status !== "running") {
+      setAnchor(null);
+      return;
+    }
+    const step2 = steps[state.index];
+    if (!step2) return;
+    let frame = 0;
+    let raf = 0;
+    const look = () => {
+      const found = resolveTarget(step2.target, document);
+      if (found) {
+        setAnchor(found);
+        found.scrollIntoView?.({ block: "center", behavior: motionEnabled ? "smooth" : "auto" });
+        return;
+      }
+      if (frame++ < 30) raf = requestAnimationFrame(look);
+      else setAnchor(null);
+    };
+    look();
+    return () => cancelAnimationFrame(raf);
+  }, [state.status, state.index, steps, motionEnabled]);
+  useEffect(() => {
+    if (!hasEnded(state.status) || marked.current) return;
+    marked.current = true;
+    void Promise.resolve(seenStore?.mark(id));
+    onOpenChange?.(false);
+    if (state.status === "finished") onFinish?.();
+    else onSkip?.();
+  }, [state.status, seenStore, id, onOpenChange, onFinish, onSkip]);
+  const skip = useCallback(() => rawDispatch({ type: "skip" }), []);
+  if (state.status !== "running" || !allowed) return null;
+  const step = steps[state.index];
+  if (!step) return null;
+  const isLast = state.index === steps.length - 1;
+  return /* @__PURE__ */ jsx(
+    Coachmark,
+    {
+      open: true,
+      anchor,
+      title: step.title,
+      side: step.side,
+      align: step.align,
+      spotlight: step.spotlight,
+      progress: { current: state.index + 1, total: steps.length },
+      onDismiss: skip,
+      actions: /* @__PURE__ */ jsxs(Fragment, { children: [
+        state.index > 0 ? /* @__PURE__ */ jsx(Button, { size: "sm", variant: "ghost", tone: "neutral", onClick: () => rawDispatch({ type: "prev" }), children: text2.back }) : /* @__PURE__ */ jsx(Button, { size: "sm", variant: "ghost", tone: "neutral", onClick: skip, children: text2.skip }),
+        /* @__PURE__ */ jsx(Button, { size: "sm", onClick: () => rawDispatch({ type: "next" }), children: isLast ? text2.done : text2.next })
+      ] }),
+      children: step.content
+    }
+  );
+}
+var OFFSETS = {
+  below: (d) => ({ y: d }),
+  above: (d) => ({ y: -d }),
+  left: (d) => ({ x: -d }),
+  right: (d) => ({ x: d }),
+  none: () => ({})
+};
+function Reveal({
+  children,
+  from = "below",
+  distance = 12,
+  delay = 0,
+  spring = "soft",
+  onView = false,
+  className
+}) {
+  const { enabled, spring: transition } = useMotionSettings();
+  const offset = enabled ? OFFSETS[from](distance) : {};
+  const hidden = { opacity: 0, ...offset };
+  const shown = { opacity: 1, x: 0, y: 0 };
+  return /* @__PURE__ */ jsx(
+    motion.div,
+    {
+      className,
+      initial: hidden,
+      ...onView ? { whileInView: shown, viewport: { once: true, margin: "-10% 0px" } } : { animate: shown },
+      transition: { ...transition(spring), delay: enabled ? delay : 0 },
+      children
+    }
+  );
+}
+function Stagger({ children, step = 0.06, from = "below", onView = false, className }) {
+  return /* @__PURE__ */ jsx("div", { className, children: Children.map(children, (child, index) => /* @__PURE__ */ jsx(Reveal, { from, delay: index * step, onView, children: child })) });
+}
+
+export { Alert, Button, Carousel, Checkbox, Checklist, Coachmark, Combobox, CommandPalette, DEFAULT_LABELS, DataTable, DateInput, Dialog, DialogClose, DropdownMenu, Field, FileDrop, Image, LabelsProvider, MotionProvider, NumberInput, Pagination, Popover, RadioGroup, Reveal, Select, Sidebar, Stagger, Switch, Tabs, TextInput, Textarea, ThemeProvider, TimeInput, ToastProvider, Tooltip, TopBar, Tour, ariaSortFor, canStep, clamp, decimalPlaces, describeAccept, filterCommands, formatISO, formatTime, groupCommands, hasEnded, initialTourState, isOutOfRange, isSameDay, isTimeOutOfRange, matchesAccept, monthMatrix, nextSort, pageRange, parseDateInput, parseNumber, parseTime, partitionFiles, rankCommand, resolveTarget, shouldAutoplay, startOfDay, stepBy, timeOptions, timeToMinutes, tourReducer, useFieldWiring, useLabels, useMotionSettings, useTheme, useToast };