@roy-ui/ui 0.0.7 → 0.0.8

package/dist/index.js

@@ -1,2522 +1,15 @@
 "use client";
-import { forwardRef, useState, useRef, useEffect, Children, isValidElement, cloneElement, useMemo, useCallback } from 'react';
-import './Button-XBBWB5ZT.css';
-import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
-import './GradientButton-TX2GJRIQ.css';
-import './Popover-LSYVKT4M.css';
-import './MadeBy-JCYGHWSD.css';
-import './TextMorph-RX2BX25F.css';
-import './TreeNav-22DY7TP5.css';
-import './Table-YTEWR635.css';
-import './TableSearch-UZO4ZJVE.css';
-import './Pagination-LLKV7XXI.css';
-import './DateRangePicker-BCP26AOC.css';
-import './TimePicker-44EKHQEJ.css';
-import './DataTable-TQ5OBNZF.css';
-
-// src/components/button/Button.tsx
-var DefaultSpinner = () => /* @__PURE__ */ jsx("span", { className: "royui-btn__spinner", "aria-hidden": "true", children: /* @__PURE__ */ jsxs("svg", { viewBox: "0 0 24 24", width: "16", height: "16", fill: "none", children: [
-  /* @__PURE__ */ jsx(
-    "circle",
-    {
-      cx: "12",
-      cy: "12",
-      r: "9",
-      stroke: "currentColor",
-      strokeOpacity: "0.3",
-      strokeWidth: "2.5"
-    }
-  ),
-  /* @__PURE__ */ jsx(
-    "path",
-    {
-      d: "M21 12a9 9 0 0 0-9-9",
-      stroke: "currentColor",
-      strokeWidth: "2.5",
-      strokeLinecap: "round"
-    }
-  )
-] }) });
-var Button = forwardRef(
-  ({
-    size = "md",
-    fullWidth = false,
-    loading = false,
-    loadingLabel,
-    disabled,
-    className = "",
-    children,
-    type = "button",
-    ...rest
-  }, ref) => {
-    const classes = [
-      "royui-btn",
-      `royui-btn--${size}`,
-      fullWidth ? "royui-btn--full" : "",
-      loading ? "royui-btn--loading" : "",
-      className
-    ].filter(Boolean).join(" ");
-    return /* @__PURE__ */ jsx(
-      "button",
-      {
-        ref,
-        type,
-        disabled: disabled || loading,
-        className: classes,
-        "aria-busy": loading || void 0,
-        ...rest,
-        children: loading ? loadingLabel ?? /* @__PURE__ */ jsx(DefaultSpinner, {}) : children
-      }
-    );
-  }
-);
-Button.displayName = "Button";
-var DefaultSpinner2 = () => /* @__PURE__ */ jsx("span", { className: "gradient-btn__spinner", "aria-hidden": "true", children: /* @__PURE__ */ jsxs("svg", { viewBox: "0 0 24 24", width: "18", height: "18", fill: "none", children: [
-  /* @__PURE__ */ jsx(
-    "circle",
-    {
-      cx: "12",
-      cy: "12",
-      r: "9",
-      stroke: "currentColor",
-      strokeOpacity: "0.3",
-      strokeWidth: "2.5"
-    }
-  ),
-  /* @__PURE__ */ jsx(
-    "path",
-    {
-      d: "M21 12a9 9 0 0 0-9-9",
-      stroke: "currentColor",
-      strokeWidth: "2.5",
-      strokeLinecap: "round"
-    }
-  )
-] }) });
-var GradientButton = forwardRef(
-  ({
-    loading = false,
-    loadingLabel,
-    fullWidth = true,
-    disabled,
-    className = "",
-    children,
-    type = "button",
-    ...rest
-  }, ref) => {
-    const classes = [
-      "gradient-btn",
-      fullWidth ? "gradient-btn--full" : "",
-      loading ? "gradient-btn--loading" : "",
-      className
-    ].filter(Boolean).join(" ");
-    return /* @__PURE__ */ jsx(
-      "button",
-      {
-        ref,
-        type,
-        disabled: disabled || loading,
-        className: classes,
-        "aria-busy": loading || void 0,
-        ...rest,
-        children: loading ? loadingLabel ?? /* @__PURE__ */ jsx(DefaultSpinner2, {}) : children
-      }
-    );
-  }
-);
-GradientButton.displayName = "GradientButton";
-var InfoIcon = () => /* @__PURE__ */ jsxs(
-  "svg",
-  {
-    width: "14",
-    height: "14",
-    viewBox: "0 0 24 24",
-    fill: "none",
-    stroke: "currentColor",
-    strokeWidth: "1.5",
-    strokeLinecap: "round",
-    strokeLinejoin: "round",
-    "aria-hidden": true,
-    children: [
-      /* @__PURE__ */ jsx("circle", { cx: "12", cy: "12", r: "9" }),
-      /* @__PURE__ */ jsx("path", { d: "M12 16v-5M12 8h.01" })
-    ]
-  }
-);
-function Popover({
-  children,
-  title,
-  align = "right",
-  width = "md",
-  label = "Open menu",
-  defaultOpen = false,
-  renderTrigger
-}) {
-  const [open, setOpen] = useState(defaultOpen);
-  const wrap2 = useRef(null);
-  const toggle = () => setOpen((o) => !o);
-  useEffect(() => {
-    if (!open) return;
-    function onDown(e) {
-      if (wrap2.current && !wrap2.current.contains(e.target)) {
-        setOpen(false);
-      }
-    }
-    function onKey(e) {
-      if (e.key === "Escape") setOpen(false);
-    }
-    document.addEventListener("mousedown", onDown);
-    document.addEventListener("keydown", onKey);
-    return () => {
-      document.removeEventListener("mousedown", onDown);
-      document.removeEventListener("keydown", onKey);
-    };
-  }, [open]);
-  const trigger = renderTrigger ? renderTrigger({ isOpen: open, toggle }) : /* @__PURE__ */ jsx(
-    "button",
-    {
-      type: "button",
-      onClick: toggle,
-      "aria-label": label,
-      "aria-expanded": open,
-      className: `royui-popover__trigger ${open ? "royui-popover__trigger--on" : ""}`,
-      children: /* @__PURE__ */ jsx(InfoIcon, {})
-    }
-  );
-  const widthClass = typeof width === "string" ? `royui-popover__panel--${width}` : "";
-  const customWidth = typeof width === "number" ? { width: `${width}px` } : void 0;
-  const alignClass = `royui-popover__panel--${align}`;
-  return /* @__PURE__ */ jsxs("div", { ref: wrap2, className: "royui-popover", children: [
-    trigger,
-    open && /* @__PURE__ */ jsxs(
-      "div",
-      {
-        className: `royui-popover__panel ${widthClass} ${alignClass}`,
-        style: customWidth,
-        role: "dialog",
-        children: [
-          title && /* @__PURE__ */ jsx("div", { className: "royui-popover__title", children: title }),
-          /* @__PURE__ */ jsx("div", { className: "royui-popover__body", children })
-        ]
-      }
-    )
-  ] });
-}
-var MadeBy = forwardRef(
-  ({
-    name,
-    href,
-    prefix = "Made by",
-    position = "bottom-right",
-    icon,
-    nameFont,
-    nameStyle,
-    className = "",
-    target = "_blank",
-    rel = "noopener noreferrer",
-    ...rest
-  }, ref) => {
-    const classes = [
-      "royui-madeby",
-      `royui-madeby--${position}`,
-      className
-    ].filter(Boolean).join(" ");
-    const nameStyles = {};
-    if (nameFont) nameStyles.fontFamily = nameFont;
-    if (nameStyle) nameStyles.fontStyle = nameStyle;
-    return /* @__PURE__ */ jsxs(
-      "a",
-      {
-        ref,
-        href,
-        target,
-        rel,
-        className: classes,
-        ...rest,
-        children: [
-          icon && /* @__PURE__ */ jsx("span", { className: "royui-madeby__icon", "aria-hidden": true, children: icon }),
-          /* @__PURE__ */ jsx("span", { className: "royui-madeby__prefix", children: prefix }),
-          /* @__PURE__ */ jsx(
-            "span",
-            {
-              className: "royui-madeby__name",
-              style: Object.keys(nameStyles).length ? nameStyles : void 0,
-              children: name
-            }
-          )
-        ]
-      }
-    );
-  }
-);
-MadeBy.displayName = "MadeBy";
-function sleep(ms) {
-  return new Promise((resolve) => setTimeout(resolve, ms));
-}
-function findDiff(from, to) {
-  let p = 0;
-  const maxP = Math.min(from.length, to.length);
-  while (p < maxP && from[p] === to[p]) p++;
-  let s = 0;
-  while (s < from.length - p && s < to.length - p && from[from.length - 1 - s] === to[to.length - 1 - s]) {
-    s++;
-  }
-  return {
-    prefix: from.slice(0, p),
-    suffix: from.slice(from.length - s),
-    oldMid: from.slice(p, from.length - s),
-    newMid: to.slice(p, to.length - s)
-  };
-}
-function rand(min, max) {
-  return min + Math.random() * (max - min);
-}
-var TextMorph = forwardRef(
-  function TextMorph2({
-    value,
-    renderText,
-    typeDelay = [30, 60],
-    backspaceDelay = [18, 30],
-    hardChars = /[\/{}\-_@]/,
-    hardCharExtraDelay = [30, 65],
-    pauseMs = 70,
-    disabled = false,
-    className = "",
-    ...rest
-  }, ref) {
-    const [displayed, setDisplayed] = useState(value);
-    const tokenRef = useRef(0);
-    const reducedRef = useRef(false);
-    const prevValueRef = useRef(value);
-    const displayedRef = useRef(value);
-    useEffect(() => {
-      if (typeof window !== "undefined") {
-        reducedRef.current = window.matchMedia(
-          "(prefers-reduced-motion: reduce)"
-        ).matches;
-      }
-    }, []);
-    useEffect(() => {
-      displayedRef.current = displayed;
-    }, [displayed]);
-    useEffect(() => {
-      if (value === prevValueRef.current) return;
-      const source = displayedRef.current;
-      prevValueRef.current = value;
-      if (disabled || reducedRef.current) {
-        setDisplayed(value);
-        return;
-      }
-      const myToken = ++tokenRef.current;
-      (async () => {
-        const { prefix, suffix, oldMid, newMid } = findDiff(source, value);
-        for (let i = oldMid.length - 1; i >= 0; i--) {
-          if (myToken !== tokenRef.current) return;
-          setDisplayed(prefix + oldMid.slice(0, i) + suffix);
-          await sleep(rand(backspaceDelay[0], backspaceDelay[1]));
-        }
-        if (myToken !== tokenRef.current) return;
-        await sleep(pauseMs);
-        for (let i = 1; i <= newMid.length; i++) {
-          if (myToken !== tokenRef.current) return;
-          setDisplayed(prefix + newMid.slice(0, i) + suffix);
-          const ch = newMid.charAt(i - 1);
-          const base = rand(typeDelay[0], typeDelay[1]);
-          const extra = hardChars.test(ch) ? rand(hardCharExtraDelay[0], hardCharExtraDelay[1]) : 0;
-          await sleep(base + extra);
-        }
-      })();
-    }, [
-      value,
-      disabled,
-      typeDelay,
-      backspaceDelay,
-      hardChars,
-      hardCharExtraDelay,
-      pauseMs
-    ]);
-    return /* @__PURE__ */ jsx(
-      "span",
-      {
-        ref,
-        className: `royui-textmorph ${className}`.trim(),
-        "aria-live": "polite",
-        ...rest,
-        children: renderText ? renderText(displayed) : displayed
-      }
-    );
-  }
-);
-var TreeNav = forwardRef(
-  ({ indent = 24, gap = 2, className = "", style, children, ...rest }, ref) => {
-    const mergedStyle = {
-      ...style,
-      ["--royui-treenav-indent"]: `${indent}px`,
-      ["--royui-treenav-gap"]: `${gap}px`
-    };
-    const classes = ["royui-treenav", className].filter(Boolean).join(" ");
-    return /* @__PURE__ */ jsx("ul", { ref, className: classes, style: mergedStyle, ...rest, children });
-  }
-);
-TreeNav.displayName = "TreeNav";
-var TreeNavItem = forwardRef(
-  ({
-    href,
-    active = false,
-    asChild = false,
-    hideTip = false,
-    icon,
-    children,
-    linkProps,
-    className = "",
-    ...rest
-  }, ref) => {
-    const itemClasses = [
-      "royui-treenav__item",
-      hideTip && "royui-treenav__item--no-tip",
-      className
-    ].filter(Boolean).join(" ");
-    const linkContent = /* @__PURE__ */ jsxs(Fragment, { children: [
-      icon && /* @__PURE__ */ jsx("span", { className: "royui-treenav__icon", "aria-hidden": true, children: icon }),
-      /* @__PURE__ */ jsx("span", { className: "royui-treenav__label", children })
-    ] });
-    let renderedLink;
-    if (asChild) {
-      const onlyChild = Children.only(children);
-      if (!isValidElement(onlyChild)) {
-        throw new Error(
-          "TreeNavItem: asChild requires a single React element child."
-        );
-      }
-      const childClassName = [
-        "royui-treenav__link",
-        onlyChild.props.className
-      ].filter(Boolean).join(" ");
-      renderedLink = cloneElement(onlyChild, {
-        className: childClassName,
-        ...active ? { "aria-current": "page" } : {}
-      });
-    } else {
-      const { className: linkClassName, ...linkRest } = linkProps ?? {};
-      const mergedLinkClass = ["royui-treenav__link", linkClassName].filter(Boolean).join(" ");
-      renderedLink = /* @__PURE__ */ jsx(
-        "a",
-        {
-          href,
-          className: mergedLinkClass,
-          ...active ? { "aria-current": "page" } : {},
-          ...linkRest,
-          children: linkContent
-        }
-      );
-    }
-    return /* @__PURE__ */ jsxs("li", { ref, className: itemClasses, ...rest, children: [
-      /* @__PURE__ */ jsx(
-        "svg",
-        {
-          className: "royui-treenav__connector",
-          viewBox: "0 0 20 30",
-          preserveAspectRatio: "xMinYMid meet",
-          "aria-hidden": true,
-          children: hideTip ? /* @__PURE__ */ jsx(
-            "path",
-            {
-              d: "M1.25 0 L1.25 7 Q1.25 15.75 11 15.75 L11 14.25 Q2.75 14.25 2.75 7 L2.75 0 Z",
-              fill: "currentColor"
-            }
-          ) : /* @__PURE__ */ jsx(
-            "path",
-            {
-              d: "M1.25 0 L1.25 7 Q1.25 15.75 10.33 15.75 L10.33 16.94 L14.22 15 L10.33 13.06 L10.33 14.25 Q2.75 14.25 2.75 7 L2.75 0 Z",
-              fill: "currentColor"
-            }
-          )
-        }
-      ),
-      renderedLink
-    ] });
-  }
-);
-TreeNavItem.displayName = "TreeNavItem";
-function Spinner({
-  size = 16,
-  strokeWidth = 2,
-  label = "Loading",
-  style,
-  className = ""
-}) {
-  const r = (size - strokeWidth) / 2;
-  const c = size / 2;
-  const circumference = 2 * Math.PI * r;
-  return /* @__PURE__ */ jsx(
-    "span",
-    {
-      role: "status",
-      "aria-label": label,
-      className: ["royui-spinner", className].filter(Boolean).join(" "),
-      style: { width: size, height: size, ...style },
-      children: /* @__PURE__ */ jsxs("svg", { width: size, height: size, viewBox: `0 0 ${size} ${size}`, "aria-hidden": true, children: [
-        /* @__PURE__ */ jsx(
-          "circle",
-          {
-            cx: c,
-            cy: c,
-            r,
-            fill: "none",
-            stroke: "currentColor",
-            strokeOpacity: 0.18,
-            strokeWidth
-          }
-        ),
-        /* @__PURE__ */ jsx(
-          "circle",
-          {
-            cx: c,
-            cy: c,
-            r,
-            fill: "none",
-            stroke: "currentColor",
-            strokeWidth,
-            strokeLinecap: "round",
-            strokeDasharray: circumference,
-            strokeDashoffset: circumference * 0.72,
-            transform: `rotate(-90 ${c} ${c})`
-          }
-        )
-      ] })
-    }
-  );
-}
-function fontVars(prefix, spec) {
-  if (!spec) return {};
-  const out = {};
-  if (typeof spec === "string") {
-    out[`${prefix}-font`] = spec;
-    return out;
-  }
-  if (spec.family) out[`${prefix}-font`] = spec.family;
-  if (spec.size != null)
-    out[`${prefix}-size`] = typeof spec.size === "number" ? `${spec.size}px` : spec.size;
-  if (spec.weight != null) out[`${prefix}-weight`] = String(spec.weight);
-  if (spec.letterSpacing) out[`${prefix}-tracking`] = spec.letterSpacing;
-  if (spec.featureSettings) out[`${prefix}-features`] = spec.featureSettings;
-  return out;
-}
-var Table = forwardRef(function Table2({
-  visibleRows = 7,
-  rowHeight = 44,
-  stickyHeader = true,
-  density = "cozy",
-  loading = false,
-  empty,
-  isEmpty = false,
-  fitColumns = false,
-  headerFont,
-  rowHeaderFont,
-  cellFont,
-  className = "",
-  style,
-  children,
-  tableProps,
-  ...rest
-}, ref) {
-  const headerH = 40;
-  const maxH = rowHeight * visibleRows + (stickyHeader ? headerH : 0);
-  const mergedStyle = {
-    ...style,
-    ["--royui-table-row-h"]: `${rowHeight}px`,
-    ["--royui-table-max-h"]: `${maxH}px`,
-    ...fontVars("--royui-table-header", headerFont),
-    ...fontVars("--royui-table-row-header", rowHeaderFont),
-    ...fontVars("--royui-table-cell", cellFont)
-  };
-  const classes = [
-    "royui-table",
-    `royui-table--${density}`,
-    stickyHeader && "royui-table--sticky",
-    loading && "royui-table--loading",
-    fitColumns && "royui-table--fit",
-    className
-  ].filter(Boolean).join(" ");
-  return /* @__PURE__ */ jsx("div", { ref, className: classes, style: mergedStyle, ...rest, children: /* @__PURE__ */ jsxs("div", { className: "royui-table__scroll", role: "region", "aria-label": "Table", children: [
-    /* @__PURE__ */ jsx("table", { className: "royui-table__table", ...tableProps, children }),
-    isEmpty && !loading && /* @__PURE__ */ jsx("div", { className: "royui-table__empty", role: "status", children: empty ?? /* @__PURE__ */ jsx("span", { children: "No results" }) }),
-    loading && /* @__PURE__ */ jsx("div", { className: "royui-table__loading", "aria-hidden": true, children: /* @__PURE__ */ jsx(Spinner, { size: 18 }) })
-  ] }) });
-});
-var TableHeader = forwardRef(function TableHeader2({ className = "", ...rest }, ref) {
-  return /* @__PURE__ */ jsx(
-    "thead",
-    {
-      ref,
-      className: ["royui-table__thead", className].filter(Boolean).join(" "),
-      ...rest
-    }
-  );
-});
-var TableBody = forwardRef(function TableBody2({ className = "", ...rest }, ref) {
-  return /* @__PURE__ */ jsx(
-    "tbody",
-    {
-      ref,
-      className: ["royui-table__tbody", className].filter(Boolean).join(" "),
-      ...rest
-    }
-  );
-});
-var TableRow = forwardRef(function TableRow2({ className = "", ...rest }, ref) {
-  return /* @__PURE__ */ jsx(
-    "tr",
-    {
-      ref,
-      className: ["royui-table__tr", className].filter(Boolean).join(" "),
-      ...rest
-    }
-  );
-});
-var TableHead = forwardRef(
-  function TableHead2({ className = "", align = "left", ...rest }, ref) {
-    return /* @__PURE__ */ jsx(
-      "th",
-      {
-        ref,
-        scope: "col",
-        className: [
-          "royui-table__th",
-          align !== "left" && `royui-table__th--${align}`,
-          className
-        ].filter(Boolean).join(" "),
-        ...rest
-      }
-    );
-  }
-);
-var TableCell = forwardRef(
-  function TableCell2({ className = "", align = "left", isRowHeader, ...rest }, ref) {
-    if (isRowHeader) {
-      return /* @__PURE__ */ jsx(
-        "th",
-        {
-          ref,
-          scope: "row",
-          className: [
-            "royui-table__row-header",
-            align !== "left" && `royui-table__td--${align}`,
-            className
-          ].filter(Boolean).join(" "),
-          ...rest
-        }
-      );
-    }
-    return /* @__PURE__ */ jsx(
-      "td",
-      {
-        ref,
-        className: [
-          "royui-table__td",
-          align !== "left" && `royui-table__td--${align}`,
-          className
-        ].filter(Boolean).join(" "),
-        ...rest
-      }
-    );
-  }
-);
-var TableSearch = forwardRef(
-  function TableSearch2({
-    value,
-    defaultValue,
-    onChange,
-    debounceMs = 0,
-    placeholder = "Search",
-    width = 260,
-    hideIndicator,
-    className = "",
-    style,
-    ...rest
-  }, ref) {
-    const controlled = value !== void 0;
-    const [internal, setInternal] = useState(defaultValue ?? "");
-    const current = controlled ? value : internal;
-    const timer = useRef(null);
-    useEffect(() => () => {
-      if (timer.current) clearTimeout(timer.current);
-    }, []);
-    const emit = (next) => {
-      if (!onChange) return;
-      if (debounceMs <= 0) {
-        onChange(next);
-        return;
-      }
-      if (timer.current) clearTimeout(timer.current);
-      timer.current = setTimeout(() => onChange(next), debounceMs);
-    };
-    const handle = (e) => {
-      const next = e.target.value;
-      if (!controlled) setInternal(next);
-      emit(next);
-    };
-    const clear = () => {
-      if (!controlled) setInternal("");
-      if (onChange) onChange("");
-    };
-    return /* @__PURE__ */ jsxs(
-      "div",
-      {
-        className: ["royui-tablesearch", className].filter(Boolean).join(" "),
-        style: { width, ...style },
-        children: [
-          !hideIndicator && /* @__PURE__ */ jsx("span", { className: "royui-tablesearch__dot", "aria-hidden": true }),
-          /* @__PURE__ */ jsx(
-            "input",
-            {
-              ref,
-              type: "text",
-              className: "royui-tablesearch__input",
-              placeholder,
-              value: current,
-              onChange: handle,
-              ...rest
-            }
-          ),
-          current.length > 0 && /* @__PURE__ */ jsx(
-            "button",
-            {
-              type: "button",
-              className: "royui-tablesearch__clear",
-              onClick: clear,
-              "aria-label": "Clear search",
-              children: "Clear"
-            }
-          )
-        ]
-      }
-    );
-  }
-);
-function buildRange(page, pageCount, sibling) {
-  if (pageCount <= 1) return [1];
-  const first = 1;
-  const last = pageCount;
-  const left = Math.max(page - sibling, first + 1);
-  const right = Math.min(page + sibling, last - 1);
-  const cells = [first];
-  if (left > first + 1) cells.push("gap");
-  for (let i = left; i <= right; i++) cells.push(i);
-  if (right < last - 1) cells.push("gap");
-  if (last > first) cells.push(last);
-  return cells;
-}
-function Pagination({
-  page,
-  pageCount,
-  onPageChange,
-  siblingCount = 1,
-  showPrevNext = true,
-  prevLabel = "Prev",
-  nextLabel = "Next",
-  showSummary = false,
-  summaryRender,
-  className = "",
-  style
-}) {
-  const cells = useMemo(
-    () => buildRange(page, pageCount, siblingCount),
-    [page, pageCount, siblingCount]
-  );
-  const canPrev = page > 1;
-  const canNext = page < pageCount;
-  const go = (n) => {
-    if (n < 1 || n > pageCount || n === page) return;
-    onPageChange(n);
-  };
-  return /* @__PURE__ */ jsxs(
-    "nav",
-    {
-      className: ["royui-pagination", className].filter(Boolean).join(" "),
-      style,
-      "aria-label": "Pagination",
-      children: [
-        showSummary && /* @__PURE__ */ jsx("span", { className: "royui-pagination__summary", children: summaryRender ? summaryRender(page, pageCount) : `Page ${page} of ${pageCount}` }),
-        /* @__PURE__ */ jsxs("div", { className: "royui-pagination__group", children: [
-          showPrevNext && /* @__PURE__ */ jsx(
-            "button",
-            {
-              type: "button",
-              className: "royui-pagination__step",
-              onClick: () => go(page - 1),
-              disabled: !canPrev,
-              "aria-label": "Previous page",
-              children: prevLabel
-            }
-          ),
-          /* @__PURE__ */ jsx("ul", { className: "royui-pagination__pages", children: cells.map(
-            (cell, i) => cell === "gap" ? /* @__PURE__ */ jsx("li", { className: "royui-pagination__gap", "aria-hidden": true, children: "\xB7" }, `gap-${i}`) : /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx(
-              "button",
-              {
-                type: "button",
-                className: [
-                  "royui-pagination__page",
-                  cell === page && "royui-pagination__page--current"
-                ].filter(Boolean).join(" "),
-                onClick: () => go(cell),
-                "aria-current": cell === page ? "page" : void 0,
-                "aria-label": `Page ${cell}`,
-                children: cell
-              }
-            ) }, cell)
-          ) }),
-          showPrevNext && /* @__PURE__ */ jsx(
-            "button",
-            {
-              type: "button",
-              className: "royui-pagination__step",
-              onClick: () => go(page + 1),
-              disabled: !canNext,
-              "aria-label": "Next page",
-              children: nextLabel
-            }
-          )
-        ] })
-      ]
-    }
-  );
-}
-
-// src/components/date-range-picker/dateUtils.ts
-var MONTHS = [
-  "January",
-  "February",
-  "March",
-  "April",
-  "May",
-  "June",
-  "July",
-  "August",
-  "September",
-  "October",
-  "November",
-  "December"
-];
-var SHORT_MONTHS = [
-  "Jan",
-  "Feb",
-  "Mar",
-  "Apr",
-  "May",
-  "Jun",
-  "Jul",
-  "Aug",
-  "Sep",
-  "Oct",
-  "Nov",
-  "Dec"
-];
-var WEEKDAYS = ["S", "M", "T", "W", "T", "F", "S"];
-function startOfDay(d) {
-  const n = new Date(d);
-  n.setHours(0, 0, 0, 0);
-  return n;
-}
-function isSameDay(a, b) {
-  if (!a || !b) return false;
-  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 addMonths(d, n) {
-  const x = new Date(d);
-  x.setDate(1);
-  x.setMonth(x.getMonth() + n);
-  return x;
-}
-function addDays(d, n) {
-  const x = new Date(d);
-  x.setDate(x.getDate() + n);
-  return x;
-}
-function isBefore(a, b) {
-  return a.getTime() < b.getTime();
-}
-function isAfter(a, b) {
-  return a.getTime() > b.getTime();
-}
-function isBetween(d, from, to) {
-  const t = d.getTime();
-  const a = Math.min(from.getTime(), to.getTime());
-  const b = Math.max(from.getTime(), to.getTime());
-  return t >= a && t <= b;
-}
-function clampToBounds(d, min, max) {
-  let r = d;
-  if (min && isBefore(r, min)) r = min;
-  if (max && isAfter(r, max)) r = max;
-  return r;
-}
-function getMonthGrid(year, month, weekStartsOn = 0) {
-  const first = new Date(year, month, 1);
-  const firstDow = first.getDay();
-  const offset = (firstDow - weekStartsOn + 7) % 7;
-  const gridStart = addDays(first, -offset);
-  const cells = [];
-  for (let i = 0; i < 42; i++) {
-    const date = addDays(gridStart, i);
-    cells.push({
-      date,
-      inMonth: date.getMonth() === month,
-      iso: date.toISOString().slice(0, 10)
-    });
-  }
-  return cells;
-}
-function getWeekdayLabels(weekStartsOn = 0) {
-  return Array.from({ length: 7 }, (_, i) => WEEKDAYS[(weekStartsOn + i) % 7] ?? "");
-}
-function formatMonthYear(d) {
-  return `${MONTHS[d.getMonth()] ?? ""} ${d.getFullYear()}`;
-}
-function formatShort(d) {
-  if (!d) return "";
-  const m = SHORT_MONTHS[d.getMonth()] ?? "";
-  const sameYear = d.getFullYear() === (/* @__PURE__ */ new Date()).getFullYear();
-  return sameYear ? `${m} ${d.getDate()}` : `${m} ${d.getDate()}, ${d.getFullYear()}`;
-}
-function formatRange(range) {
-  if (!range.from && !range.to) return "";
-  if (range.from && !range.to) return formatShort(range.from);
-  if (!range.from && range.to) return formatShort(range.to);
-  if (isSameDay(range.from, range.to)) return formatShort(range.from);
-  return `${formatShort(range.from)} \u2013 ${formatShort(range.to)}`;
-}
-var today = () => startOfDay(/* @__PURE__ */ new Date());
-var DEFAULT_PRESETS = [
-  { label: "Today", range: () => ({ from: today(), to: today() }) },
-  {
-    label: "Last 7 days",
-    range: () => ({ from: addDays(today(), -6), to: today() })
-  },
-  {
-    label: "Last 30 days",
-    range: () => ({ from: addDays(today(), -29), to: today() })
-  },
-  {
-    label: "This month",
-    range: () => {
-      const t = today();
-      return {
-        from: new Date(t.getFullYear(), t.getMonth(), 1),
-        to: t
-      };
-    }
-  },
-  {
-    label: "Last month",
-    range: () => {
-      const t = today();
-      const first = new Date(t.getFullYear(), t.getMonth() - 1, 1);
-      const last = new Date(t.getFullYear(), t.getMonth(), 0);
-      return { from: first, to: last };
-    }
-  }
-];
-function DateRangePicker({
-  value,
-  defaultValue,
-  onChange,
-  monthsVisible = 2,
-  weekStartsOn = 0,
-  minDate,
-  maxDate,
-  placeholder = "Pick a range",
-  presets = DEFAULT_PRESETS,
-  align = "left",
-  className = "",
-  style,
-  triggerLabel,
-  disabled
-}) {
-  const controlled = value !== void 0;
-  const [internal, setInternal] = useState(
-    defaultValue ?? { from: null, to: null }
-  );
-  const current = controlled ? value : internal;
-  const [open, setOpen] = useState(false);
-  const [draft, setDraft] = useState(current);
-  const [hover, setHover] = useState(null);
-  const [anchorMonth, setAnchorMonth] = useState(
-    () => startOfDay(current.from ?? today())
-  );
-  const wrap2 = useRef(null);
-  useEffect(() => {
-    if (!open) return;
-    function onDown(e) {
-      if (wrap2.current && !wrap2.current.contains(e.target)) {
-        setOpen(false);
-      }
-    }
-    function onKey(e) {
-      if (e.key === "Escape") setOpen(false);
-    }
-    document.addEventListener("mousedown", onDown);
-    document.addEventListener("keydown", onKey);
-    return () => {
-      document.removeEventListener("mousedown", onDown);
-      document.removeEventListener("keydown", onKey);
-    };
-  }, [open]);
-  useEffect(() => {
-    if (open) {
-      setDraft(current);
-      setHover(null);
-      setAnchorMonth(startOfDay(current.from ?? today()));
-    }
-  }, [open]);
-  const months = useMemo(() => {
-    return Array.from({ length: monthsVisible }, (_, i) => addMonths(anchorMonth, i));
-  }, [anchorMonth, monthsVisible]);
-  const commit = (next) => {
-    if (!controlled) setInternal(next);
-    onChange?.(next);
-  };
-  const apply = () => {
-    commit(draft);
-    setOpen(false);
-  };
-  const clear = () => {
-    setDraft({ from: null, to: null });
-    setHover(null);
-  };
-  const selectDay = (d) => {
-    const day = startOfDay(d);
-    const { from, to } = draft;
-    if (!from || from && to) {
-      setDraft({ from: day, to: null });
-      setHover(day);
-      return;
-    }
-    if (isBefore(day, from)) {
-      setDraft({ from: day, to: from });
-    } else {
-      setDraft({ from, to: day });
-    }
-  };
-  const isDisabled = (d) => {
-    if (minDate && isBefore(d, startOfDay(minDate))) return true;
-    if (maxDate && isAfter(d, startOfDay(maxDate))) return true;
-    return false;
-  };
-  const previewTo = !draft.to && draft.from && hover ? hover : draft.to;
-  const previewRange = { from: draft.from, to: previewTo };
-  return /* @__PURE__ */ jsxs(
-    "div",
-    {
-      ref: wrap2,
-      className: ["royui-drp", className].filter(Boolean).join(" "),
-      style,
-      children: [
-        /* @__PURE__ */ jsxs(
-          "button",
-          {
-            type: "button",
-            className: "royui-drp__trigger",
-            onClick: () => !disabled && setOpen((o) => !o),
-            "aria-haspopup": "dialog",
-            "aria-expanded": open,
-            disabled,
-            children: [
-              /* @__PURE__ */ jsx("span", { className: "royui-drp__trigger-dot", "aria-hidden": true }),
-              /* @__PURE__ */ jsx("span", { className: "royui-drp__trigger-label", children: triggerLabel ?? (formatRange(current) || placeholder) })
-            ]
-          }
-        ),
-        open && /* @__PURE__ */ jsxs(
-          "div",
-          {
-            className: `royui-drp__panel royui-drp__panel--${align}`,
-            role: "dialog",
-            "aria-label": "Choose date range",
-            children: [
-              presets.length > 0 && /* @__PURE__ */ jsx("div", { className: "royui-drp__presets", children: presets.map((p) => {
-                const r = p.range();
-                const isActive = isSameDay(draft.from, r.from) && isSameDay(draft.to, r.to);
-                return /* @__PURE__ */ jsx(
-                  "button",
-                  {
-                    type: "button",
-                    className: [
-                      "royui-drp__preset",
-                      isActive && "royui-drp__preset--active"
-                    ].filter(Boolean).join(" "),
-                    onClick: () => {
-                      const next = {
-                        from: r.from ? startOfDay(clampToBounds(r.from, minDate, maxDate)) : null,
-                        to: r.to ? startOfDay(clampToBounds(r.to, minDate, maxDate)) : null
-                      };
-                      setDraft(next);
-                      if (next.from) setAnchorMonth(next.from);
-                    },
-                    children: p.label
-                  },
-                  p.label
-                );
-              }) }),
-              /* @__PURE__ */ jsxs("div", { className: "royui-drp__main", children: [
-                /* @__PURE__ */ jsxs("div", { className: "royui-drp__nav", children: [
-                  /* @__PURE__ */ jsx(
-                    "button",
-                    {
-                      type: "button",
-                      className: "royui-drp__nav-btn",
-                      onClick: () => setAnchorMonth(addMonths(anchorMonth, -1)),
-                      "aria-label": "Previous month",
-                      children: "Prev"
-                    }
-                  ),
-                  /* @__PURE__ */ jsx(
-                    "button",
-                    {
-                      type: "button",
-                      className: "royui-drp__nav-btn",
-                      onClick: () => setAnchorMonth(addMonths(anchorMonth, 1)),
-                      "aria-label": "Next month",
-                      children: "Next"
-                    }
-                  )
-                ] }),
-                /* @__PURE__ */ jsx("div", { className: "royui-drp__months", children: months.map((m) => /* @__PURE__ */ jsx(
-                  MonthGrid,
-                  {
-                    month: m,
-                    range: previewRange,
-                    hover,
-                    weekStartsOn,
-                    isDisabled,
-                    onSelect: selectDay,
-                    onHover: (d) => setHover(d)
-                  },
-                  `${m.getFullYear()}-${m.getMonth()}`
-                )) }),
-                /* @__PURE__ */ jsxs("div", { className: "royui-drp__foot", children: [
-                  /* @__PURE__ */ jsx("div", { className: "royui-drp__readout", children: formatRange(draft) || "Select start and end" }),
-                  /* @__PURE__ */ jsxs("div", { className: "royui-drp__foot-actions", children: [
-                    /* @__PURE__ */ jsx(
-                      "button",
-                      {
-                        type: "button",
-                        className: "royui-drp__ghost",
-                        onClick: clear,
-                        children: "Clear"
-                      }
-                    ),
-                    /* @__PURE__ */ jsx(
-                      "button",
-                      {
-                        type: "button",
-                        className: "royui-drp__primary",
-                        onClick: apply,
-                        disabled: !draft.from,
-                        children: "Apply"
-                      }
-                    )
-                  ] })
-                ] })
-              ] })
-            ]
-          }
-        )
-      ]
-    }
-  );
-}
-function MonthGrid({
-  month,
-  range,
-  hover,
-  weekStartsOn,
-  isDisabled,
-  onSelect,
-  onHover
-}) {
-  const grid = useMemo(
-    () => getMonthGrid(month.getFullYear(), month.getMonth(), weekStartsOn),
-    [month, weekStartsOn]
-  );
-  const labels = useMemo(() => getWeekdayLabels(weekStartsOn), [weekStartsOn]);
-  const todayD = today();
-  return /* @__PURE__ */ jsxs("div", { className: "royui-drp__month", children: [
-    /* @__PURE__ */ jsx("div", { className: "royui-drp__month-title", children: formatMonthYear(month) }),
-    /* @__PURE__ */ jsx("div", { className: "royui-drp__weekdays", children: labels.map((l, i) => /* @__PURE__ */ jsx("span", { className: "royui-drp__weekday", children: l }, i)) }),
-    /* @__PURE__ */ jsx("div", { className: "royui-drp__grid", onMouseLeave: () => onHover(null), children: grid.map((c) => {
-      const inMonth = isSameMonth(c.date, month);
-      const disabled = isDisabled(c.date);
-      const isStart = isSameDay(c.date, range.from);
-      const isEnd = isSameDay(c.date, range.to);
-      const isInRange = range.from && range.to && isBetween(c.date, range.from, range.to);
-      const isPreview = range.from && !range.to && hover && isBetween(c.date, range.from, hover);
-      const isTodayCell = isSameDay(c.date, todayD);
-      const classes = [
-        "royui-drp__day",
-        !inMonth && "royui-drp__day--out",
-        disabled && "royui-drp__day--disabled",
-        (isStart || isEnd) && "royui-drp__day--edge",
-        isStart && "royui-drp__day--start",
-        isEnd && "royui-drp__day--end",
-        (isInRange || isPreview) && "royui-drp__day--in",
-        isTodayCell && "royui-drp__day--today"
-      ].filter(Boolean).join(" ");
-      return /* @__PURE__ */ jsx(
-        "button",
-        {
-          type: "button",
-          className: classes,
-          disabled,
-          tabIndex: inMonth ? 0 : -1,
-          onClick: () => inMonth && onSelect(c.date),
-          onMouseEnter: () => inMonth && onHover(c.date),
-          "aria-label": c.date.toDateString(),
-          children: /* @__PURE__ */ jsx("span", { children: c.date.getDate() })
-        },
-        c.iso
-      );
-    }) })
-  ] });
-}
-function angleFromCenter(cx, cy, px, py) {
-  const dx = px - cx;
-  const dy = py - cy;
-  const a = Math.atan2(dy, dx) * (180 / Math.PI) + 90;
-  return (a + 360) % 360;
-}
-function AnalogClock({
-  value,
-  onChange,
-  hourCycle = 24,
-  minuteStep = 1,
-  size = 220
-}) {
-  const ref = useRef(null);
-  const [mode, setMode] = useState("hours");
-  const [dragging, setDragging] = useState(false);
-  const updateFromPointer = useCallback(
-    (clientX, clientY, currentMode) => {
-      const svg = ref.current;
-      if (!svg) return;
-      const rect = svg.getBoundingClientRect();
-      const cx2 = rect.left + rect.width / 2;
-      const cy2 = rect.top + rect.height / 2;
-      const a = angleFromCenter(cx2, cy2, clientX, clientY);
-      if (currentMode === "hours") {
-        const hours122 = Math.round(a / 30) % 12;
-        const isAm2 = value.hours < 12;
-        const h24 = isAm2 ? hours122 : hours122 + 12;
-        onChange({ ...value, hours: h24 });
-      } else {
-        let m = Math.round(a / 6) % 60;
-        if (minuteStep > 1) m = Math.round(m / minuteStep) * minuteStep;
-        if (m === 60) m = 0;
-        onChange({ ...value, minutes: m });
-      }
-    },
-    [minuteStep, onChange, value]
-  );
-  const togglePeriod = () => {
-    const next = value.hours < 12 ? value.hours + 12 : value.hours - 12;
-    onChange({ ...value, hours: next });
-  };
-  const isAm = value.hours < 12;
-  useEffect(() => {
-    if (!dragging) return;
-    const onMove = (e) => updateFromPointer(e.clientX, e.clientY, mode);
-    const onUp = () => setDragging(false);
-    window.addEventListener("pointermove", onMove);
-    window.addEventListener("pointerup", onUp);
-    return () => {
-      window.removeEventListener("pointermove", onMove);
-      window.removeEventListener("pointerup", onUp);
-    };
-  }, [dragging, mode, updateFromPointer]);
-  const handlePointerDown = (e) => {
-    e.preventDefault();
-    setDragging(true);
-    updateFromPointer(e.clientX, e.clientY, mode);
-  };
-  const hours12 = hourCycle === 12 ? value.hours === 0 ? 12 : value.hours > 12 ? value.hours - 12 : value.hours : value.hours % 12 === 0 ? 12 : value.hours % 12;
-  const hourAngle = (hours12 % 12 + value.minutes / 60) * 30 - 90;
-  const minuteAngle = value.minutes / 60 * 360 - 90;
-  const r = size / 2;
-  const cx = r;
-  const cy = r;
-  const hourLen = r * 0.45;
-  const minuteLen = r * 0.7;
-  const tickOuter = r * 0.92;
-  const tickInner = r * 0.86;
-  const majorInner = r * 0.82;
-  const handX = (len, deg) => cx + len * Math.cos(deg * Math.PI / 180);
-  const handY = (len, deg) => cy + len * Math.sin(deg * Math.PI / 180);
-  return /* @__PURE__ */ jsxs("div", { className: "royui-tp-analog", children: [
-    /* @__PURE__ */ jsxs(
-      "svg",
-      {
-        ref,
-        width: size,
-        height: size,
-        viewBox: `0 0 ${size} ${size}`,
-        onPointerDown: handlePointerDown,
-        className: "royui-tp-analog__face",
-        role: "application",
-        "aria-label": "Analog clock",
-        children: [
-          /* @__PURE__ */ jsx(
-            "circle",
-            {
-              cx,
-              cy,
-              r: r - 1,
-              className: "royui-tp-analog__bezel"
-            }
-          ),
-          Array.from({ length: 60 }).map((_, i) => {
-            const angle = (i * 6 - 90) * (Math.PI / 180);
-            const isMajor = i % 5 === 0;
-            const inner = isMajor ? majorInner : tickInner;
-            return /* @__PURE__ */ jsx(
-              "line",
-              {
-                x1: cx + inner * Math.cos(angle),
-                y1: cy + inner * Math.sin(angle),
-                x2: cx + tickOuter * Math.cos(angle),
-                y2: cy + tickOuter * Math.sin(angle),
-                className: isMajor ? "royui-tp-analog__tick--major" : "royui-tp-analog__tick"
-              },
-              i
-            );
-          }),
-          [12, 3, 6, 9].map((n) => {
-            const idx = n % 12;
-            const angle = (idx * 30 - 90) * (Math.PI / 180);
-            const rr = r * 0.72;
-            return /* @__PURE__ */ jsx(
-              "text",
-              {
-                x: cx + rr * Math.cos(angle),
-                y: cy + rr * Math.sin(angle),
-                dy: "0.34em",
-                textAnchor: "middle",
-                className: "royui-tp-analog__numeral",
-                children: n
-              },
-              n
-            );
-          }),
-          /* @__PURE__ */ jsx(
-            "line",
-            {
-              x1: cx,
-              y1: cy,
-              x2: handX(hourLen, hourAngle),
-              y2: handY(hourLen, hourAngle),
-              className: `royui-tp-analog__hand royui-tp-analog__hand--hour ${mode === "hours" ? "royui-tp-analog__hand--active" : ""}`,
-              onPointerDown: (e) => {
-                e.stopPropagation();
-                setMode("hours");
-                setDragging(true);
-              }
-            }
-          ),
-          /* @__PURE__ */ jsx(
-            "line",
-            {
-              x1: cx,
-              y1: cy,
-              x2: handX(minuteLen, minuteAngle),
-              y2: handY(minuteLen, minuteAngle),
-              className: `royui-tp-analog__hand royui-tp-analog__hand--minute ${mode === "minutes" ? "royui-tp-analog__hand--active" : ""}`,
-              onPointerDown: (e) => {
-                e.stopPropagation();
-                setMode("minutes");
-                setDragging(true);
-              }
-            }
-          ),
-          /* @__PURE__ */ jsx("circle", { cx, cy, r: 3.5, className: "royui-tp-analog__pin" })
-        ]
-      }
-    ),
-    /* @__PURE__ */ jsxs("div", { className: "royui-tp-analog__modes", children: [
-      /* @__PURE__ */ jsx(
-        "button",
-        {
-          type: "button",
-          className: [
-            "royui-tp-analog__mode",
-            mode === "hours" && "royui-tp-analog__mode--on"
-          ].filter(Boolean).join(" "),
-          onClick: () => setMode("hours"),
-          children: "Hours"
-        }
-      ),
-      /* @__PURE__ */ jsx(
-        "button",
-        {
-          type: "button",
-          className: [
-            "royui-tp-analog__mode",
-            mode === "minutes" && "royui-tp-analog__mode--on"
-          ].filter(Boolean).join(" "),
-          onClick: () => setMode("minutes"),
-          children: "Minutes"
-        }
-      ),
-      /* @__PURE__ */ jsxs("div", { className: "royui-tp-analog__period", role: "group", "aria-label": "Day half", children: [
-        /* @__PURE__ */ jsx(
-          "button",
-          {
-            type: "button",
-            className: [
-              "royui-tp-analog__period-btn",
-              isAm && "royui-tp-analog__period-btn--on"
-            ].filter(Boolean).join(" "),
-            onClick: () => {
-              if (!isAm) togglePeriod();
-            },
-            "aria-pressed": isAm,
-            children: "AM"
-          }
-        ),
-        /* @__PURE__ */ jsx(
-          "button",
-          {
-            type: "button",
-            className: [
-              "royui-tp-analog__period-btn",
-              !isAm && "royui-tp-analog__period-btn--on"
-            ].filter(Boolean).join(" "),
-            onClick: () => {
-              if (isAm) togglePeriod();
-            },
-            "aria-pressed": !isAm,
-            children: "PM"
-          }
-        )
-      ] })
-    ] })
-  ] });
-}
-function pad(n) {
-  return String(n).padStart(2, "0");
-}
-function wrap(n, max) {
-  return (n % max + max) % max;
-}
-function DigitalClock({
-  value,
-  onChange,
-  hourCycle = 24,
-  minuteStep = 1
-}) {
-  const hourBoundary = hourCycle === 12 ? 12 : 24;
-  const displayHour = hourCycle === 12 ? value.hours % 12 === 0 ? 12 : value.hours % 12 : value.hours;
-  const isAm = value.hours < 12;
-  const setDisplayHour = (next) => {
-    if (hourCycle === 24) {
-      onChange({ ...value, hours: wrap(next, 24) });
-      return;
-    }
-    let h = next;
-    if (h <= 0) h = 12;
-    if (h > 12) h = 1;
-    const h24 = isAm ? h === 12 ? 0 : h : h === 12 ? 12 : h + 12;
-    onChange({ ...value, hours: h24 });
-  };
-  const setMinutes = (next) => {
-    const stepped = Math.round(next / minuteStep) * minuteStep;
-    onChange({ ...value, minutes: wrap(stepped, 60) });
-  };
-  const setAm = () => {
-    if (isAm) return;
-    onChange({ ...value, hours: value.hours - 12 });
-  };
-  const setPm = () => {
-    if (!isAm) return;
-    onChange({ ...value, hours: value.hours + 12 });
-  };
-  return /* @__PURE__ */ jsxs("div", { className: "royui-tp-digital", children: [
-    /* @__PURE__ */ jsxs("div", { className: "royui-tp-digital__row", children: [
-      /* @__PURE__ */ jsx(
-        Segment,
-        {
-          label: "Hours",
-          value: pad(displayHour),
-          onWheelStep: (d) => setDisplayHour(displayHour + d),
-          onArrow: (d) => setDisplayHour(displayHour + d),
-          max: hourBoundary
-        }
-      ),
-      /* @__PURE__ */ jsx("span", { className: "royui-tp-digital__sep", "aria-hidden": true, children: ":" }),
-      /* @__PURE__ */ jsx(
-        Segment,
-        {
-          label: "Minutes",
-          value: pad(value.minutes),
-          onWheelStep: (d) => setMinutes(value.minutes + d * minuteStep),
-          onArrow: (d) => setMinutes(value.minutes + d * minuteStep),
-          max: 60
-        }
-      )
-    ] }),
-    /* @__PURE__ */ jsxs("div", { className: "royui-tp-digital__period", role: "group", "aria-label": "Day half", children: [
-      /* @__PURE__ */ jsx(
-        "button",
-        {
-          type: "button",
-          className: [
-            "royui-tp-digital__period-btn",
-            isAm && "royui-tp-digital__period-btn--on"
-          ].filter(Boolean).join(" "),
-          onClick: setAm,
-          "aria-pressed": isAm,
-          children: "AM"
-        }
-      ),
-      /* @__PURE__ */ jsx(
-        "button",
-        {
-          type: "button",
-          className: [
-            "royui-tp-digital__period-btn",
-            !isAm && "royui-tp-digital__period-btn--on"
-          ].filter(Boolean).join(" "),
-          onClick: setPm,
-          "aria-pressed": !isAm,
-          children: "PM"
-        }
-      )
-    ] }),
-    /* @__PURE__ */ jsx("div", { className: "royui-tp-digital__hint", children: "Scroll or use arrow keys" })
-  ] });
-}
-function Segment({
-  label,
-  value,
-  onWheelStep,
-  onArrow,
-  max
-}) {
-  const ref = useRef(null);
-  const handleWheel = (e) => {
-    e.preventDefault();
-    onWheelStep(e.deltaY > 0 ? 1 : -1);
-  };
-  const handleKey = (e) => {
-    if (e.key === "ArrowUp" || e.key === "ArrowRight") {
-      e.preventDefault();
-      onArrow(1);
-    } else if (e.key === "ArrowDown" || e.key === "ArrowLeft") {
-      e.preventDefault();
-      onArrow(-1);
-    }
-  };
-  return /* @__PURE__ */ jsx(
-    "div",
-    {
-      ref,
-      role: "spinbutton",
-      tabIndex: 0,
-      "aria-label": label,
-      "aria-valuetext": value,
-      "aria-valuemax": max,
-      className: "royui-tp-digital__seg",
-      onWheel: handleWheel,
-      onKeyDown: handleKey,
-      children: value
-    }
-  );
-}
-function pad2(n) {
-  return String(n).padStart(2, "0");
-}
-function formatTime(t, hourCycle = 24) {
-  if (!t) return "";
-  if (hourCycle === 24) return `${pad2(t.hours)}:${pad2(t.minutes)}`;
-  const h = t.hours % 12 === 0 ? 12 : t.hours % 12;
-  const ampm = t.hours < 12 ? "AM" : "PM";
-  return `${pad2(h)}:${pad2(t.minutes)} ${ampm}`;
-}
-function TimePicker({
-  value,
-  defaultValue,
-  onChange,
-  variant = "analog",
-  switchable = true,
-  hourCycle = 24,
-  minuteStep = 1,
-  placeholder = "Pick a time",
-  align = "left",
-  className = "",
-  style,
-  triggerLabel,
-  disabled
-}) {
-  const controlled = value !== void 0;
-  const [internal, setInternal] = useState(defaultValue ?? null);
-  const current = controlled ? value : internal;
-  const [open, setOpen] = useState(false);
-  const [mode, setMode] = useState(variant);
-  const [draft, setDraft] = useState(current ?? { hours: 12, minutes: 0 });
-  const wrap2 = useRef(null);
-  useEffect(() => {
-    if (!open) return;
-    function onDown(e) {
-      if (wrap2.current && !wrap2.current.contains(e.target)) {
-        setOpen(false);
-      }
-    }
-    function onKey(e) {
-      if (e.key === "Escape") setOpen(false);
-    }
-    document.addEventListener("mousedown", onDown);
-    document.addEventListener("keydown", onKey);
-    return () => {
-      document.removeEventListener("mousedown", onDown);
-      document.removeEventListener("keydown", onKey);
-    };
-  }, [open]);
-  useEffect(() => {
-    if (open) setDraft(current ?? { hours: (/* @__PURE__ */ new Date()).getHours(), minutes: 0 });
-  }, [open]);
-  useEffect(() => {
-    setMode(variant);
-  }, [variant]);
-  const commit = (next) => {
-    if (!controlled) setInternal(next);
-    onChange?.(next);
-  };
-  const setNow = () => {
-    const now = /* @__PURE__ */ new Date();
-    setDraft({ hours: now.getHours(), minutes: now.getMinutes() });
-  };
-  const apply = () => {
-    commit(draft);
-    setOpen(false);
-  };
-  return /* @__PURE__ */ jsxs(
-    "div",
-    {
-      ref: wrap2,
-      className: ["royui-tp", className].filter(Boolean).join(" "),
-      style,
-      children: [
-        /* @__PURE__ */ jsxs(
-          "button",
-          {
-            type: "button",
-            className: "royui-tp__trigger",
-            onClick: () => !disabled && setOpen((o) => !o),
-            "aria-haspopup": "dialog",
-            "aria-expanded": open,
-            disabled,
-            children: [
-              /* @__PURE__ */ jsx("span", { className: "royui-tp__trigger-dot", "aria-hidden": true }),
-              /* @__PURE__ */ jsx("span", { className: "royui-tp__trigger-label", children: triggerLabel ?? (formatTime(current ?? null, hourCycle) || placeholder) })
-            ]
-          }
-        ),
-        open && /* @__PURE__ */ jsxs(
-          "div",
-          {
-            className: `royui-tp__panel royui-tp__panel--${align}`,
-            role: "dialog",
-            "aria-label": "Choose time",
-            children: [
-              /* @__PURE__ */ jsxs("div", { className: "royui-tp__head", children: [
-                /* @__PURE__ */ jsx("div", { className: "royui-tp__readout", children: formatTime(draft, hourCycle) }),
-                switchable && /* @__PURE__ */ jsxs("div", { className: "royui-tp__variants", role: "tablist", children: [
-                  /* @__PURE__ */ jsx(
-                    "button",
-                    {
-                      type: "button",
-                      role: "tab",
-                      "aria-selected": mode === "analog",
-                      className: [
-                        "royui-tp__variant",
-                        mode === "analog" && "royui-tp__variant--on"
-                      ].filter(Boolean).join(" "),
-                      onClick: () => setMode("analog"),
-                      children: "Analog"
-                    }
-                  ),
-                  /* @__PURE__ */ jsx(
-                    "button",
-                    {
-                      type: "button",
-                      role: "tab",
-                      "aria-selected": mode === "digital",
-                      className: [
-                        "royui-tp__variant",
-                        mode === "digital" && "royui-tp__variant--on"
-                      ].filter(Boolean).join(" "),
-                      onClick: () => setMode("digital"),
-                      children: "Digital"
-                    }
-                  )
-                ] })
-              ] }),
-              /* @__PURE__ */ jsx("div", { className: "royui-tp__body", children: mode === "analog" ? /* @__PURE__ */ jsx(
-                AnalogClock,
-                {
-                  value: draft,
-                  onChange: setDraft,
-                  hourCycle,
-                  minuteStep
-                }
-              ) : /* @__PURE__ */ jsx(
-                DigitalClock,
-                {
-                  value: draft,
-                  onChange: setDraft,
-                  hourCycle,
-                  minuteStep
-                }
-              ) }),
-              /* @__PURE__ */ jsxs("div", { className: "royui-tp__foot", children: [
-                /* @__PURE__ */ jsx("button", { type: "button", className: "royui-tp__ghost", onClick: setNow, children: "Now" }),
-                /* @__PURE__ */ jsx("button", { type: "button", className: "royui-tp__primary", onClick: apply, children: "Apply" })
-              ] })
-            ]
-          }
-        )
-      ]
-    }
-  );
-}
-function ColumnMenu({
-  columns,
-  layout,
-  onToggle,
-  onReset
-}) {
-  const [open, setOpen] = useState(false);
-  const wrap2 = useRef(null);
-  useEffect(() => {
-    if (!open) return;
-    function onDown(e) {
-      if (wrap2.current && !wrap2.current.contains(e.target)) {
-        setOpen(false);
-      }
-    }
-    function onKey(e) {
-      if (e.key === "Escape") setOpen(false);
-    }
-    document.addEventListener("mousedown", onDown);
-    document.addEventListener("keydown", onKey);
-    return () => {
-      document.removeEventListener("mousedown", onDown);
-      document.removeEventListener("keydown", onKey);
-    };
-  }, [open]);
-  const hiddenCount = layout.hidden.length;
-  return /* @__PURE__ */ jsxs("div", { className: "royui-dt-colmenu", ref: wrap2, children: [
-    /* @__PURE__ */ jsx(
-      "button",
-      {
-        type: "button",
-        className: "royui-dt-colmenu__trigger",
-        onClick: () => setOpen((o) => !o),
-        "aria-expanded": open,
-        "aria-haspopup": "menu",
-        children: "Columns"
-      }
-    ),
-    hiddenCount > 0 && /* @__PURE__ */ jsxs(
-      "button",
-      {
-        type: "button",
-        className: "royui-dt-colmenu__chip",
-        onClick: () => setOpen(true),
-        children: [
-          hiddenCount,
-          " hidden"
-        ]
-      }
-    ),
-    open && /* @__PURE__ */ jsxs("div", { className: "royui-dt-colmenu__panel", role: "menu", children: [
-      /* @__PURE__ */ jsxs("div", { className: "royui-dt-colmenu__head", children: [
-        /* @__PURE__ */ jsx("span", { className: "royui-dt-colmenu__title", children: "Columns" }),
-        /* @__PURE__ */ jsx(
-          "button",
-          {
-            type: "button",
-            className: "royui-dt-colmenu__reset",
-            onClick: () => {
-              onReset();
-            },
-            children: "Reset"
-          }
-        )
-      ] }),
-      /* @__PURE__ */ jsx("ul", { className: "royui-dt-colmenu__list", children: columns.map((c) => {
-        const isHidden = layout.hidden.includes(c.key);
-        const disabled = c.hideable === false;
-        return /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsxs(
-          "button",
-          {
-            type: "button",
-            role: "menuitemcheckbox",
-            "aria-checked": !isHidden,
-            className: [
-              "royui-dt-colmenu__row",
-              isHidden && "royui-dt-colmenu__row--off",
-              disabled && "royui-dt-colmenu__row--locked"
-            ].filter(Boolean).join(" "),
-            onClick: () => !disabled && onToggle(c.key),
-            disabled,
-            children: [
-              /* @__PURE__ */ jsx(
-                "span",
-                {
-                  className: [
-                    "royui-dt-colmenu__dot",
-                    !isHidden && "royui-dt-colmenu__dot--on"
-                  ].filter(Boolean).join(" "),
-                  "aria-hidden": true
-                }
-              ),
-              /* @__PURE__ */ jsx("span", { className: "royui-dt-colmenu__label", children: c.header })
-            ]
-          }
-        ) }, c.key);
-      }) })
-    ] })
-  ] });
-}
-function defaultLayout(columns) {
-  return {
-    order: columns.map((c) => c.key),
-    sizes: columns.reduce((acc, c) => {
-      if (c.defaultWidth != null) acc[c.key] = c.defaultWidth;
-      return acc;
-    }, {}),
-    hidden: columns.filter((c) => c.defaultHidden).map((c) => c.key)
-  };
-}
-function loadLayout(key) {
-  if (!key || typeof window === "undefined") return null;
-  try {
-    const raw = window.localStorage.getItem(key);
-    if (!raw) return null;
-    return JSON.parse(raw);
-  } catch {
-    return null;
-  }
-}
-function saveLayout(key, layout) {
-  if (!key || typeof window === "undefined") return;
-  try {
-    window.localStorage.setItem(key, JSON.stringify(layout));
-  } catch {
-  }
-}
-function useTableLayout(columns, storageKey) {
-  const initial = useMemo(() => {
-    return loadLayout(storageKey) ?? defaultLayout(columns);
-  }, []);
-  const [layout, setLayout] = useState(initial);
-  useEffect(() => {
-    setLayout((prev) => {
-      const known = new Set(columns.map((c) => c.key));
-      const order = prev.order.filter((k) => known.has(k));
-      columns.forEach((c) => {
-        if (!order.includes(c.key)) order.push(c.key);
-      });
-      const sizes = {};
-      Object.entries(prev.sizes).forEach(([k, v]) => {
-        if (known.has(k)) sizes[k] = v;
-      });
-      const hidden = prev.hidden.filter((k) => known.has(k));
-      return { order, sizes, hidden };
-    });
-  }, [columns]);
-  useEffect(() => {
-    saveLayout(storageKey, layout);
-  }, [layout, storageKey]);
-  const orderedColumns = useMemo(() => {
-    const pinnedLeft = columns.filter((c) => c.pinned === "left");
-    const pinnedRight = columns.filter((c) => c.pinned === "right");
-    const pinnedKeys = new Set(
-      [...pinnedLeft, ...pinnedRight].map((c) => c.key)
-    );
-    const rest = layout.order.filter((k) => !pinnedKeys.has(k)).map((k) => columns.find((c) => c.key === k)).filter(Boolean);
-    return [...pinnedLeft, ...rest, ...pinnedRight];
-  }, [columns, layout.order]);
-  const visibleColumns = useMemo(
-    () => orderedColumns.filter((c) => !layout.hidden.includes(c.key)),
-    [orderedColumns, layout.hidden]
-  );
-  const reorder = useCallback((key, toIndex) => {
-    setLayout((prev) => {
-      const order = [...prev.order];
-      const from = order.indexOf(key);
-      if (from === -1 || from === toIndex) return prev;
-      const item = order.splice(from, 1)[0];
-      if (item === void 0) return prev;
-      const insertAt = toIndex > from ? toIndex - 1 : toIndex;
-      order.splice(Math.max(0, Math.min(insertAt, order.length)), 0, item);
-      return { ...prev, order };
-    });
-  }, []);
-  const resize = useCallback((key, px) => {
-    setLayout((prev) => {
-      const sizes = { ...prev.sizes };
-      if (px == null) delete sizes[key];
-      else sizes[key] = Math.max(40, Math.round(px));
-      return { ...prev, sizes };
-    });
-  }, []);
-  const toggleHidden = useCallback((key) => {
-    setLayout((prev) => {
-      const hidden = prev.hidden.includes(key) ? prev.hidden.filter((k) => k !== key) : [...prev.hidden, key];
-      return { ...prev, hidden };
-    });
-  }, []);
-  const reset = useCallback(() => {
-    setLayout(defaultLayout(columns));
-  }, [columns]);
-  return {
-    layout,
-    orderedColumns,
-    visibleColumns,
-    reorder,
-    resize,
-    toggleHidden,
-    reset
-  };
-}
-
-// src/components/data-table/filters.ts
-function defaultSearchPredicate(row, query, columns) {
-  if (!query) return true;
-  const q = query.toLowerCase();
-  return columns.some((c) => {
-    const v = c.accessor(row);
-    if (v == null) return false;
-    const s = v instanceof Date ? v.toLocaleString() : String(v);
-    return s.toLowerCase().includes(q);
-  });
-}
-function applyFilters(rows, columns, filters, cfg) {
-  const searchFn = cfg.searchPredicate ?? defaultSearchPredicate;
-  return rows.filter((row) => {
-    if (filters.search && !searchFn(row, filters.search, columns)) return false;
-    if (cfg.dateColumn && (filters.dateRange.from || filters.dateRange.to)) {
-      const col = columns.find((c) => c.key === cfg.dateColumn);
-      if (col) {
-        const raw = col.accessor(row);
-        const d = raw instanceof Date ? raw : raw ? new Date(raw) : null;
-        if (!d || isNaN(d.getTime())) return false;
-        const day = startOfDay(d);
-        const from = filters.dateRange.from ?? day;
-        const to = filters.dateRange.to ?? filters.dateRange.from ?? day;
-        if (!isBetween(day, startOfDay(from), startOfDay(to))) return false;
-      }
-    }
-    if (cfg.timeColumn && filters.time) {
-      const col = columns.find((c) => c.key === cfg.timeColumn);
-      if (col) {
-        const raw = col.accessor(row);
-        const d = raw instanceof Date ? raw : raw ? new Date(raw) : null;
-        if (!d || isNaN(d.getTime())) return false;
-        const rowMin = d.getHours() * 60 + d.getMinutes();
-        const filterMin = filters.time.hours * 60 + filters.time.minutes;
-        const tol = cfg.timeTolerance ?? 0;
-        if (Math.abs(rowMin - filterMin) > tol) return false;
-      }
-    }
-    return true;
-  });
-}
-function applySort(rows, columns, sort) {
-  if (!sort || !sort.dir) return rows;
-  const col = columns.find((c) => c.key === sort.key);
-  if (!col) return rows;
-  const dirMul = sort.dir === "asc" ? 1 : -1;
-  const getter = col.sortBy ?? col.accessor;
-  return [...rows].sort((a, b) => {
-    const av = getter(a);
-    const bv = getter(b);
-    if (av == null && bv == null) return 0;
-    if (av == null) return 1;
-    if (bv == null) return -1;
-    if (av instanceof Date && bv instanceof Date) {
-      return (av.getTime() - bv.getTime()) * dirMul;
-    }
-    if (typeof av === "number" && typeof bv === "number") {
-      return (av - bv) * dirMul;
-    }
-    return String(av).localeCompare(String(bv)) * dirMul;
-  });
-}
-function paginate(rows, page, pageSize) {
-  const start = (page - 1) * pageSize;
-  return rows.slice(start, start + pageSize);
-}
-
-// src/components/data-table/io.ts
-function csvEscape(v) {
-  if (v == null) return "";
-  const s = typeof v === "string" ? v : v instanceof Date ? v.toISOString() : String(v);
-  if (/[",\n\r]/.test(s)) {
-    return `"${s.replace(/"/g, '""')}"`;
-  }
-  return s;
-}
-function toCsv(rows, cols) {
-  const visible = cols.filter((c) => !c.defaultHidden);
-  const header = visible.map((c) => csvEscape(c.header)).join(",");
-  const body = rows.map(
-    (row) => visible.map((c) => csvEscape(c.accessor(row))).join(",")
-  ).join("\n");
-  return body ? `${header}
-${body}` : header;
-}
-function fromCsv(text) {
-  const rows = [];
-  let cur = [];
-  let field = "";
-  let i = 0;
-  let inQuotes = false;
-  const len = text.length;
-  while (i < len) {
-    const ch = text[i];
-    if (inQuotes) {
-      if (ch === '"') {
-        if (text[i + 1] === '"') {
-          field += '"';
-          i += 2;
-          continue;
-        }
-        inQuotes = false;
-        i++;
-        continue;
-      }
-      field += ch;
-      i++;
-      continue;
-    }
-    if (ch === '"') {
-      inQuotes = true;
-      i++;
-      continue;
-    }
-    if (ch === ",") {
-      cur.push(field);
-      field = "";
-      i++;
-      continue;
-    }
-    if (ch === "\r") {
-      i++;
-      continue;
-    }
-    if (ch === "\n") {
-      cur.push(field);
-      rows.push(cur);
-      cur = [];
-      field = "";
-      i++;
-      continue;
-    }
-    field += ch;
-    i++;
-  }
-  if (field.length > 0 || cur.length > 0) {
-    cur.push(field);
-    rows.push(cur);
-  }
-  if (rows.length === 0) return [];
-  const head = rows[0] ?? [];
-  const body = rows.slice(1);
-  return body.map((r) => {
-    const obj = {};
-    head.forEach((h, idx) => {
-      obj[h] = r[idx] ?? "";
-    });
-    return obj;
-  });
-}
-function toJson(rows, cols) {
-  const visible = cols.filter((c) => !c.defaultHidden);
-  const out = rows.map((row) => {
-    const obj = {};
-    visible.forEach((c) => {
-      obj[c.key] = c.accessor(row);
-    });
-    return obj;
-  });
-  return JSON.stringify(out, null, 2);
-}
-function fromJson(text) {
-  const parsed = JSON.parse(text);
-  if (!Array.isArray(parsed)) {
-    throw new Error("Expected a JSON array of rows");
-  }
-  return parsed;
-}
-function downloadString(text, filename, mime) {
-  if (typeof window === "undefined") return;
-  const blob = new Blob([text], { type: mime });
-  const url = URL.createObjectURL(blob);
-  const a = document.createElement("a");
-  a.href = url;
-  a.download = filename;
-  document.body.appendChild(a);
-  a.click();
-  a.remove();
-  setTimeout(() => URL.revokeObjectURL(url), 1e3);
-}
-function fontStyleFor(spec) {
-  if (!spec) return void 0;
-  if (typeof spec === "string") return { fontFamily: spec };
-  const s = {};
-  if (spec.family) s.fontFamily = spec.family;
-  if (spec.size != null)
-    s.fontSize = typeof spec.size === "number" ? `${spec.size}px` : spec.size;
-  if (spec.weight != null) s.fontWeight = spec.weight;
-  if (spec.letterSpacing) s.letterSpacing = spec.letterSpacing;
-  if (spec.featureSettings) s.fontFeatureSettings = spec.featureSettings;
-  return s;
-}
-function renderCellValue(value, type) {
-  if (value == null) return "";
-  if (value instanceof Date) {
-    if (type === "time") {
-      return value.toLocaleTimeString([], {
-        hour: "2-digit",
-        minute: "2-digit"
-      });
-    }
-    if (type === "date") {
-      return value.toLocaleDateString();
-    }
-    return value.toLocaleString();
-  }
-  return String(value);
-}
-function DataTable({
-  data,
-  columns,
-  getRowId,
-  visibleRows = 7,
-  rowHeight = 44,
-  stickyHeader = true,
-  density = "cozy",
-  loading,
-  empty,
-  fitColumns = false,
-  search,
-  dateFilter,
-  timeFilter,
-  pagination,
-  reorderable = true,
-  resizable = true,
-  columnMenu = true,
-  dataIO,
-  headerFont,
-  rowHeaderFont,
-  cellFont,
-  storageKey,
-  className = "",
-  toolbarExtras
-}) {
-  const {
-    layout,
-    orderedColumns,
-    visibleColumns,
-    reorder,
-    resize,
-    toggleHidden,
-    reset
-  } = useTableLayout(columns, storageKey);
-  const [filters, setFilters] = useState({
-    search: "",
-    dateRange: { from: null, to: null },
-    time: null
-  });
-  const [sort, setSort] = useState(null);
-  const pageSize = pagination === false ? Infinity : pagination?.pageSize ?? 25;
-  const [page, setPage] = useState(1);
-  const filtered = useMemo(
-    () => applyFilters(data, columns, filters, {
-      dateColumn: dateFilter?.column,
-      timeColumn: timeFilter?.column,
-      timeTolerance: timeFilter?.toleranceMinutes,
-      searchPredicate: search?.predicate
-    }),
-    [data, columns, filters, dateFilter?.column, timeFilter?.column, timeFilter?.toleranceMinutes, search?.predicate]
-  );
-  const sorted = useMemo(() => applySort(filtered, columns, sort), [filtered, columns, sort]);
-  const pageCount = pagination === false ? 1 : Math.max(1, Math.ceil(sorted.length / pageSize));
-  const currentPage = Math.min(page, pageCount);
-  const pageRows = useMemo(
-    () => pagination === false ? sorted : paginate(sorted, currentPage, pageSize),
-    [pagination, sorted, currentPage, pageSize]
-  );
-  const [dragKey, setDragKey] = useState(null);
-  const [dropIndex, setDropIndex] = useState(null);
-  const onDragStart = (e, key) => {
-    if (!reorderable) return;
-    setDragKey(key);
-    e.dataTransfer.effectAllowed = "move";
-    try {
-      e.dataTransfer.setData("text/plain", key);
-    } catch {
-    }
-  };
-  const onDragOver = (e, idx) => {
-    if (!reorderable || !dragKey) return;
-    e.preventDefault();
-    e.dataTransfer.dropEffect = "move";
-    const rect = e.currentTarget.getBoundingClientRect();
-    const isRight = e.clientX - rect.left > rect.width / 2;
-    setDropIndex(idx + (isRight ? 1 : 0));
-  };
-  const onDrop = (e) => {
-    if (!reorderable || !dragKey || dropIndex == null) return;
-    e.preventDefault();
-    reorder(dragKey, dropIndex);
-    setDragKey(null);
-    setDropIndex(null);
-  };
-  const onDragEnd = () => {
-    setDragKey(null);
-    setDropIndex(null);
-  };
-  const resizingKey = useRef(null);
-  const resizeStartX = useRef(0);
-  const resizeStartW = useRef(0);
-  const beginResize = (e, key) => {
-    if (!resizable) return;
-    e.stopPropagation();
-    e.preventDefault();
-    const th = e.currentTarget.parentElement ?? null;
-    const startW = th ? th.getBoundingClientRect().width : 120;
-    resizingKey.current = key;
-    resizeStartX.current = e.clientX;
-    resizeStartW.current = startW;
-    window.addEventListener("pointermove", onResizeMove);
-    window.addEventListener("pointerup", endResize);
-  };
-  const onResizeMove = (e) => {
-    if (!resizingKey.current) return;
-    const dx = e.clientX - resizeStartX.current;
-    const col = columns.find((c) => c.key === resizingKey.current);
-    const min = col?.minWidth ?? 80;
-    const max = col?.maxWidth ?? 2e3;
-    const next = Math.max(min, Math.min(max, resizeStartW.current + dx));
-    resize(resizingKey.current, next);
-  };
-  const endResize = () => {
-    resizingKey.current = null;
-    window.removeEventListener("pointermove", onResizeMove);
-    window.removeEventListener("pointerup", endResize);
-  };
-  const doubleClickReset = (key) => resize(key, null);
-  const cycleSort = useCallback((key) => {
-    setSort((prev) => {
-      if (!prev || prev.key !== key) return { key, dir: "asc" };
-      if (prev.dir === "asc") return { key, dir: "desc" };
-      return null;
-    });
-  }, []);
-  const fileInput = useRef(null);
-  const [ioFlash, setIoFlash] = useState(null);
-  const flashTimer = useRef(null);
-  const flash = (text, ms = 1400) => {
-    if (flashTimer.current) clearTimeout(flashTimer.current);
-    setIoFlash(text);
-    flashTimer.current = setTimeout(() => setIoFlash(null), ms);
-  };
-  const exportRows = (format) => {
-    if (!dataIO?.export) return;
-    const scope = dataIO.export.scope ?? "filtered";
-    let rows;
-    if (scope === "all") rows = data;
-    else if (scope === "page") rows = pageRows;
-    else rows = sorted;
-    const cols = visibleColumns;
-    const text = dataIO.export.serialize ? dataIO.export.serialize(rows, cols, format) : format === "csv" ? toCsv(rows, cols) : toJson(rows, cols);
-    const baseName = typeof dataIO.export.filename === "function" ? dataIO.export.filename() : dataIO.export.filename ?? "table-export";
-    const filename = `${baseName}.${format}`;
-    const mime = format === "csv" ? "text/csv;charset=utf-8" : "application/json";
-    downloadString(text, filename, mime);
-    flash("Exported");
-  };
-  const onPickFile = async (file) => {
-    if (!dataIO?.import) return;
-    const text = await file.text();
-    try {
-      const parsed = dataIO.import.parse ? await dataIO.import.parse(text, file) : file.name.endsWith(".json") ? fromJson(text) : fromCsv(text);
-      dataIO.import.onImport(parsed, {
-        mode: dataIO.import.mode ?? "replace",
-        file
-      });
-      flash(`Imported ${parsed.length} ${parsed.length === 1 ? "row" : "rows"}`);
-    } catch (err) {
-      dataIO.import.onError?.(err, file);
-      flash("Couldn't read file", 2e3);
-    }
-  };
-  const showToolbar = search?.enabled || !!dateFilter || !!timeFilter || columnMenu || !!dataIO?.export?.enabled || !!dataIO?.import?.enabled || !!toolbarExtras;
-  const exportFormats = dataIO?.export?.formats ?? ["csv", "json"];
-  const [exportMenuOpen, setExportMenuOpen] = useState(false);
-  return /* @__PURE__ */ jsxs("div", { className: ["royui-dt", className].filter(Boolean).join(" "), children: [
-    showToolbar && /* @__PURE__ */ jsxs("div", { className: "royui-dt__toolbar", children: [
-      /* @__PURE__ */ jsxs("div", { className: "royui-dt__toolbar-left", children: [
-        search?.enabled && /* @__PURE__ */ jsx(
-          TableSearch,
-          {
-            value: filters.search,
-            onChange: (v) => {
-              setFilters((f) => ({ ...f, search: v }));
-              setPage(1);
-            },
-            placeholder: search.placeholder,
-            debounceMs: search.debounceMs
-          }
-        ),
-        dateFilter && /* @__PURE__ */ jsx(
-          DateRangePicker,
-          {
-            value: filters.dateRange,
-            onChange: (r) => {
-              setFilters((f) => ({ ...f, dateRange: r }));
-              setPage(1);
-            },
-            monthsVisible: dateFilter.monthsVisible ?? 2,
-            placeholder: dateFilter.placeholder ?? "Date range"
-          }
-        ),
-        timeFilter && /* @__PURE__ */ jsx(
-          TimePicker,
-          {
-            value: filters.time,
-            onChange: (t) => {
-              setFilters((f) => ({ ...f, time: t }));
-              setPage(1);
-            },
-            variant: timeFilter.variant ?? "analog",
-            hourCycle: timeFilter.hourCycle ?? 24,
-            placeholder: timeFilter.placeholder ?? "Time"
-          }
-        )
-      ] }),
-      /* @__PURE__ */ jsxs("div", { className: "royui-dt__toolbar-right", children: [
-        toolbarExtras,
-        columnMenu && /* @__PURE__ */ jsx(
-          ColumnMenu,
-          {
-            columns: orderedColumns,
-            layout,
-            onToggle: toggleHidden,
-            onReset: reset
-          }
-        ),
-        (dataIO?.export?.enabled || dataIO?.import?.enabled) && /* @__PURE__ */ jsx("span", { className: "royui-dt__sep", "aria-hidden": true, children: "\xB7" }),
-        dataIO?.export?.enabled && /* @__PURE__ */ jsxs("div", { className: "royui-dt-io", children: [
-          /* @__PURE__ */ jsx(
-            "button",
-            {
-              type: "button",
-              className: "royui-dt-io__btn",
-              onClick: () => {
-                const only = exportFormats[0];
-                if (exportFormats.length === 1 && only) {
-                  exportRows(only);
-                } else {
-                  setExportMenuOpen((o) => !o);
-                }
-              },
-              children: ioFlash && ioFlash.startsWith("Export") ? ioFlash : "Export"
-            }
-          ),
-          exportMenuOpen && exportFormats.length > 1 && /* @__PURE__ */ jsx(
-            "div",
-            {
-              className: "royui-dt-io__menu",
-              onMouseLeave: () => setExportMenuOpen(false),
-              children: exportFormats.map((f) => /* @__PURE__ */ jsx(
-                "button",
-                {
-                  type: "button",
-                  className: "royui-dt-io__menu-item",
-                  onClick: () => {
-                    exportRows(f);
-                    setExportMenuOpen(false);
-                  },
-                  children: f.toUpperCase()
-                },
-                f
-              ))
-            }
-          )
-        ] }),
-        dataIO?.import?.enabled && /* @__PURE__ */ jsxs(Fragment, { children: [
-          /* @__PURE__ */ jsx(
-            "button",
-            {
-              type: "button",
-              className: "royui-dt-io__btn",
-              onClick: () => fileInput.current?.click(),
-              children: ioFlash && (ioFlash.startsWith("Import") || ioFlash.startsWith("Couldn't")) ? ioFlash : "Import"
-            }
-          ),
-          /* @__PURE__ */ jsx(
-            "input",
-            {
-              ref: fileInput,
-              type: "file",
-              accept: dataIO.import.accept ?? ".csv,.json",
-              style: { display: "none" },
-              onChange: (e) => {
-                const f = e.target.files?.[0];
-                if (f) onPickFile(f);
-                e.target.value = "";
-              }
-            }
-          )
-        ] })
-      ] })
-    ] }),
-    /* @__PURE__ */ jsxs(
-      Table,
-      {
-        visibleRows,
-        rowHeight,
-        stickyHeader,
-        density,
-        loading,
-        empty,
-        isEmpty: pageRows.length === 0,
-        fitColumns,
-        headerFont,
-        rowHeaderFont,
-        cellFont,
-        children: [
-          /* @__PURE__ */ jsx("colgroup", { children: visibleColumns.map((c) => {
-            const w = fitColumns ? void 0 : layout.sizes[c.key];
-            return /* @__PURE__ */ jsx(
-              "col",
-              {
-                style: w ? { width: w } : void 0,
-                className: dragKey === c.key ? "royui-dt__col--dragging" : void 0
-              },
-              c.key
-            );
-          }) }),
-          /* @__PURE__ */ jsx(TableHeader, { children: /* @__PURE__ */ jsxs(TableRow, { children: [
-            visibleColumns.map((c, idx) => {
-              const isDragging = dragKey === c.key;
-              const showDropBefore = dropIndex === idx;
-              const sortDir = sort && sort.key === c.key && sort.dir ? sort.dir : null;
-              const canReorder = reorderable && c.reorderable !== false && !c.pinned;
-              const canResize = resizable && c.resizable !== false;
-              return /* @__PURE__ */ jsxs(
-                TableHead,
-                {
-                  align: c.align ?? (c.type === "number" ? "right" : "left"),
-                  className: [
-                    "royui-dt__th",
-                    canReorder && "royui-dt__th--reorderable",
-                    canResize && "royui-dt__th--resizable",
-                    isDragging && "royui-dt__th--dragging",
-                    showDropBefore && "royui-dt__th--drop-before"
-                  ].filter(Boolean).join(" "),
-                  draggable: canReorder,
-                  onDragStart: (e) => onDragStart(e, c.key),
-                  onDragOver: (e) => onDragOver(e, idx),
-                  onDrop,
-                  onDragEnd,
-                  title: canReorder && canResize ? "Drag to reorder \xB7 drag the right edge to resize" : canReorder ? "Drag to reorder" : canResize ? "Drag the right edge to resize" : void 0,
-                  children: [
-                    /* @__PURE__ */ jsxs(
-                      "span",
-                      {
-                        className: "royui-dt__th-inner",
-                        onClick: () => cycleSort(c.key),
-                        role: "button",
-                        tabIndex: 0,
-                        onKeyDown: (e) => {
-                          if (e.key === "Enter" || e.key === " ") {
-                            e.preventDefault();
-                            cycleSort(c.key);
-                          }
-                        },
-                        children: [
-                          /* @__PURE__ */ jsx("span", { className: "royui-dt__th-label", children: c.header }),
-                          sortDir && /* @__PURE__ */ jsx(
-                            "span",
-                            {
-                              className: `royui-dt__sort-indicator royui-dt__sort-indicator--${sortDir}`,
-                              "aria-hidden": true
-                            }
-                          )
-                        ]
-                      }
-                    ),
-                    canResize && /* @__PURE__ */ jsx(
-                      "span",
-                      {
-                        className: "royui-dt__resize",
-                        onPointerDown: (e) => beginResize(e, c.key),
-                        onDoubleClick: () => doubleClickReset(c.key),
-                        "aria-hidden": true,
-                        children: /* @__PURE__ */ jsx("span", { className: "royui-dt__resize-bar", "aria-hidden": true })
-                      }
-                    )
-                  ]
-                },
-                c.key
-              );
-            }),
-            dropIndex === visibleColumns.length && /* @__PURE__ */ jsx(TableHead, { className: "royui-dt__th--drop-end", "aria-hidden": true })
-          ] }) }),
-          /* @__PURE__ */ jsx(TableBody, { children: pageRows.map((row, i) => {
-            const id = getRowId ? getRowId(row, i) : row?.["id"] != null ? String(row["id"]) : i;
-            return /* @__PURE__ */ jsx(TableRow, { children: visibleColumns.map((c) => {
-              const value = c.accessor(row);
-              const display = c.cell ? c.cell(value, row) : renderCellValue(value, c.type);
-              const cellStyle = fontStyleFor(c.font);
-              const isNum = c.type === "number";
-              return /* @__PURE__ */ jsx(
-                TableCell,
-                {
-                  isRowHeader: c.isRowHeader,
-                  align: c.align ?? (isNum ? "right" : "left"),
-                  className: isNum ? "royui-table__td--num" : void 0,
-                  style: cellStyle,
-                  children: display
-                },
-                c.key
-              );
-            }) }, id);
-          }) })
-        ]
-      }
-    ),
-    pagination !== false && pageCount > 1 && /* @__PURE__ */ jsx("div", { className: "royui-dt__pagination", children: /* @__PURE__ */ jsx(
-      Pagination,
-      {
-        page: currentPage,
-        pageCount,
-        onPageChange: setPage,
-        siblingCount: pagination?.siblingCount ?? 1,
-        showSummary: pagination?.showSummary ?? true,
-        summaryRender: (p, pc) => `${(p - 1) * pageSize + 1}\u2013${Math.min(p * pageSize, sorted.length)} of ${sorted.length}`
-      }
-    ) })
-  ] });
-}
-
-export { AnalogClock, Button, ColumnMenu, DEFAULT_PRESETS, DataTable, DateRangePicker, DigitalClock, GradientButton, MadeBy, Pagination, Popover, Spinner, Table, TableBody, TableCell, TableHead, TableHeader, TableRow, TableSearch, TextMorph, TimePicker, TreeNav, TreeNavItem, addDays, addMonths, downloadString, formatMonthYear, formatRange, formatShort, formatTime, fromCsv, fromJson, isBetween, isSameDay, startOfDay, toCsv, toJson };
+export { TextMorph } from './chunk-PGV55XSZ.js';
+export { TreeNav, TreeNavItem } from './chunk-M6HB6BMA.js';
+export { Button } from './chunk-4SGMAZBG.js';
+export { ColumnMenu, DataTable, downloadString, fromCsv, fromJson, toCsv, toJson } from './chunk-HUCK7AM7.js';
+export { Spinner, Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from './chunk-XERZVDIT.js';
+export { TableSearch } from './chunk-KSHKVSNK.js';
+export { AnalogClock, DigitalClock, TimePicker, formatTime } from './chunk-75IGGPXL.js';
+export { DEFAULT_PRESETS, DateRangePicker, addDays, addMonths, formatMonthYear, formatRange, formatShort, isBetween, isSameDay, startOfDay } from './chunk-SFENGB5N.js';
+export { GradientButton } from './chunk-RLBVY3DG.js';
+export { MadeBy } from './chunk-MDPMEW4K.js';
+export { Pagination } from './chunk-5CIBIH7R.js';
+export { Popover } from './chunk-C5X3TE5U.js';
 //# sourceMappingURL=index.js.map
 //# sourceMappingURL=index.js.map