@tensor_1/react 2.0.0

package/dist/index.cjs

@@ -0,0 +1,1040 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/index.ts
+var src_exports = {};
+__export(src_exports, {
+  Alert: () => Alert,
+  AppShell: () => AppShell,
+  Avatar: () => Avatar,
+  AvatarGroup: () => AvatarGroup,
+  Button: () => Button,
+  ButtonGroup: () => ButtonGroup,
+  Card: () => Card,
+  Checkbox: () => Checkbox,
+  CommandGroup: () => CommandGroup,
+  CommandItem: () => CommandItem,
+  CommandPalette: () => CommandPalette,
+  Comment: () => Comment,
+  Comments: () => Comments,
+  DetailLayout: () => DetailLayout,
+  Drawer: () => Drawer,
+  EmptyState: () => EmptyState,
+  ErrorState: () => ErrorState,
+  Field: () => Field,
+  Input: () => Input,
+  InputGroup: () => InputGroup,
+  Kanban: () => Kanban,
+  KanbanCard: () => KanbanCard,
+  KanbanColumn: () => KanbanColumn,
+  Label: () => Label,
+  List: () => List,
+  ListItem: () => ListItem,
+  LoadingState: () => LoadingState,
+  Modal: () => Modal,
+  NavGroup: () => NavGroup,
+  NavItem: () => NavItem,
+  Note: () => Note,
+  PageHeader: () => PageHeader,
+  Pagination: () => Pagination,
+  Peek: () => Peek,
+  Popover: () => Popover,
+  Progress: () => Progress,
+  Prose: () => Prose,
+  Radio: () => Radio,
+  RadioGroup: () => RadioGroup,
+  Select: () => Select,
+  Sidebar: () => Sidebar,
+  SidebarSection: () => SidebarSection,
+  Skeleton: () => Skeleton,
+  Spinner: () => Spinner,
+  Stat: () => Stat,
+  StatusPill: () => StatusPill,
+  SubNavItem: () => SubNavItem,
+  Switch: () => Switch,
+  Tab: () => Tab,
+  Table: () => Table,
+  TableWrap: () => TableWrap,
+  Tabs: () => Tabs,
+  Td: () => Td,
+  Textarea: () => Textarea,
+  Th: () => Th,
+  Timeline: () => Timeline,
+  TimelineItem: () => TimelineItem,
+  Toast: () => Toast,
+  Toaster: () => Toaster,
+  Tooltip: () => Tooltip,
+  Tr: () => Tr,
+  Tree: () => Tree,
+  UserChip: () => UserChip,
+  cx: () => cx,
+  useDialog: () => useDialog
+});
+module.exports = __toCommonJS(src_exports);
+
+// src/cx.ts
+function cx(...args) {
+  return args.filter(Boolean).join(" ");
+}
+
+// src/hooks/useDialog.ts
+var import_react = require("react");
+function useDialog(open) {
+  const ref = (0, import_react.useRef)(null);
+  (0, import_react.useEffect)(() => {
+    const el = ref.current;
+    if (!el) return;
+    if (open) {
+      if (!el.open) el.showModal();
+    } else {
+      if (el.open) el.close();
+    }
+    return () => {
+      if (el.open) el.close();
+    };
+  }, [open]);
+  return ref;
+}
+
+// src/components/Button.tsx
+var import_react2 = require("react");
+var import_jsx_runtime = require("react/jsx-runtime");
+var Button = (0, import_react2.forwardRef)(
+  ({ variant = "secondary", size = "md", icon = false, loading = false, className, children, disabled, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    "button",
+    {
+      ref,
+      className: cx(
+        "uix-btn",
+        `uix-btn--${variant}`,
+        size !== "md" && `uix-btn--${size}`,
+        icon && "uix-btn--icon",
+        className
+      ),
+      disabled: disabled || loading,
+      "data-loading": loading || void 0,
+      ...props,
+      children
+    }
+  )
+);
+Button.displayName = "Button";
+function ButtonGroup({ children, className }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: cx("uix-btn-group", className), children });
+}
+
+// src/components/Input.tsx
+var import_react3 = require("react");
+var import_jsx_runtime2 = require("react/jsx-runtime");
+var Input = (0, import_react3.forwardRef)(
+  ({ size = "md", invalid, valid, className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+    "input",
+    {
+      ref,
+      className: cx("uix-input", size === "sm" && "uix-input--sm", className),
+      "aria-invalid": invalid || void 0,
+      "data-valid": valid || void 0,
+      ...props
+    }
+  )
+);
+Input.displayName = "Input";
+function InputGroup({ children, leadingIcon, trailingIcon, className }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
+    "div",
+    {
+      className: cx(
+        "uix-input-group",
+        leadingIcon && "uix-input-group--has-leading",
+        trailingIcon && "uix-input-group--has-trailing",
+        className
+      ),
+      children: [
+        leadingIcon && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("span", { className: "uix-input-group__icon", children: leadingIcon }),
+        children,
+        trailingIcon && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("span", { className: "uix-input-group__icon uix-input-group__icon--trailing", children: trailingIcon })
+      ]
+    }
+  );
+}
+
+// src/components/Textarea.tsx
+var import_react4 = require("react");
+var import_jsx_runtime3 = require("react/jsx-runtime");
+var Textarea = (0, import_react4.forwardRef)(
+  ({ invalid, className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+    "textarea",
+    {
+      ref,
+      className: cx("uix-textarea", className),
+      "aria-invalid": invalid || void 0,
+      ...props
+    }
+  )
+);
+Textarea.displayName = "Textarea";
+
+// src/components/Select.tsx
+var import_react5 = require("react");
+var import_jsx_runtime4 = require("react/jsx-runtime");
+var Select = (0, import_react5.forwardRef)(
+  ({ size = "md", className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+    "select",
+    {
+      ref,
+      className: cx("uix-select", size === "sm" && "uix-select--sm", className),
+      ...props
+    }
+  )
+);
+Select.displayName = "Select";
+
+// src/components/Checkbox.tsx
+var import_react6 = require("react");
+var import_jsx_runtime5 = require("react/jsx-runtime");
+var CheckIcon = () => /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("svg", { viewBox: "0 0 12 12", fill: "none", stroke: "currentColor", strokeWidth: 2.5, strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("polyline", { points: "1.5,6 4.5,9 10.5,3" }) });
+var IndeterminateIcon = () => /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("svg", { viewBox: "0 0 12 12", "aria-hidden": "true", children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("rect", { x: "2", y: "5", width: "8", height: "2", rx: "1", fill: "currentColor" }) });
+var Checkbox = (0, import_react6.forwardRef)(
+  ({ label, indeterminate, className, ...props }, forwardedRef) => {
+    const innerRef = (0, import_react6.useRef)(null);
+    (0, import_react6.useEffect)(() => {
+      const el = innerRef.current;
+      if (el) el.indeterminate = !!indeterminate;
+    }, [indeterminate]);
+    return /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("label", { className: cx("uix-checkbox", className), children: [
+      /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
+        "input",
+        {
+          type: "checkbox",
+          ref: (node) => {
+            innerRef.current = node;
+            if (typeof forwardedRef === "function") forwardedRef(node);
+            else if (forwardedRef) forwardedRef.current = node;
+          },
+          ...props
+        }
+      ),
+      /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("span", { className: "uix-checkbox__box", children: indeterminate ? /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(IndeterminateIcon, {}) : /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(CheckIcon, {}) }),
+      label
+    ] });
+  }
+);
+Checkbox.displayName = "Checkbox";
+
+// src/components/Radio.tsx
+var import_react7 = require("react");
+var import_jsx_runtime6 = require("react/jsx-runtime");
+var Radio = (0, import_react7.forwardRef)(
+  ({ label, className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("label", { className: cx("uix-radio", className), children: [
+    /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("input", { type: "radio", ref, ...props }),
+    /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("span", { className: "uix-radio__dot" }),
+    label
+  ] })
+);
+Radio.displayName = "Radio";
+function RadioGroup({ children, className }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { className: cx("uix-radio-group", className), children });
+}
+
+// src/components/Switch.tsx
+var import_react8 = require("react");
+var import_jsx_runtime7 = require("react/jsx-runtime");
+var Switch = (0, import_react8.forwardRef)(
+  ({ label, className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("label", { className: cx("uix-switch", className), children: [
+    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("input", { type: "checkbox", role: "switch", ref, ...props }),
+    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "uix-switch__track" }),
+    label
+  ] })
+);
+Switch.displayName = "Switch";
+
+// src/components/Field.tsx
+var import_jsx_runtime8 = require("react/jsx-runtime");
+function Field({ label, hint, error, success, required, children, className, htmlFor }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: cx("uix-field", className), children: [
+    label && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("label", { className: "uix-field__label", htmlFor, "data-required": required || void 0, children: label }),
+    children,
+    error && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { className: "uix-field__error", children: error }),
+    success && !error && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { className: "uix-field__success", children: success }),
+    hint && !error && !success && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { className: "uix-field__hint", children: hint })
+  ] });
+}
+
+// src/components/Modal.tsx
+var import_jsx_runtime9 = require("react/jsx-runtime");
+var CloseIcon = () => /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", stroke: "currentColor", strokeWidth: 1.5, strokeLinecap: "round", "aria-hidden": "true", children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("path", { d: "M4 4l8 8M12 4l-8 8" }) });
+function Modal({ open, onClose, title, children, footer, className, style }) {
+  const ref = useDialog(open);
+  return /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("dialog", { ref, className: cx("uix-dialog", className), style, onClose, children: [
+    (title != null || onClose) && /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: "uix-dialog__header", children: [
+      title && /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("div", { className: "uix-dialog__title", children: title }),
+      onClose && /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("button", { className: "uix-dialog__close", onClick: onClose, "aria-label": "Close dialog", children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(CloseIcon, {}) })
+    ] }),
+    children != null && /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("div", { className: "uix-dialog__body", children }),
+    footer != null && /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("div", { className: "uix-dialog__footer", children: footer })
+  ] });
+}
+
+// src/components/Drawer.tsx
+var import_jsx_runtime10 = require("react/jsx-runtime");
+var CloseIcon2 = () => /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", stroke: "currentColor", strokeWidth: 1.5, strokeLinecap: "round", "aria-hidden": "true", children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("path", { d: "M4 4l8 8M12 4l-8 8" }) });
+function Drawer({ open, onClose, title, children, footer, className }) {
+  const ref = useDialog(open);
+  return /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("dialog", { ref, className: cx("uix-drawer", className), onClose, children: [
+    (title != null || onClose) && /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("div", { className: "uix-drawer__header", children: [
+      title && /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("div", { style: { fontWeight: 600, fontSize: "var(--uix-text-h3)" }, children: title }),
+      onClose && /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
+        "button",
+        {
+          style: { marginLeft: "auto", border: 0, background: "transparent", color: "var(--uix-text-muted)", cursor: "pointer", width: 30, height: 30, display: "grid", placeItems: "center", borderRadius: "var(--uix-radius-sm)" },
+          onClick: onClose,
+          "aria-label": "Close drawer",
+          children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(CloseIcon2, {})
+        }
+      )
+    ] }),
+    children != null && /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("div", { className: "uix-drawer__body", children }),
+    footer != null && /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("div", { className: "uix-drawer__footer", children: footer })
+  ] });
+}
+
+// src/components/Peek.tsx
+var import_jsx_runtime11 = require("react/jsx-runtime");
+var CloseIcon3 = () => /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", stroke: "currentColor", strokeWidth: 1.5, strokeLinecap: "round", "aria-hidden": "true", children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("path", { d: "M4 4l8 8M12 4l-8 8" }) });
+var ChevronUp = () => /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("svg", { width: "12", height: "12", viewBox: "0 0 12 12", fill: "none", stroke: "currentColor", strokeWidth: 1.5, strokeLinecap: "round", "aria-hidden": "true", children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("path", { d: "M2 8l4-4 4 4" }) });
+var ChevronDown = () => /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("svg", { width: "12", height: "12", viewBox: "0 0 12 12", fill: "none", stroke: "currentColor", strokeWidth: 1.5, strokeLinecap: "round", "aria-hidden": "true", children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("path", { d: "M2 4l4 4 4-4" }) });
+function Peek({ open, onClose, title, children, footer, onNavPrev, onNavNext, hint, className }) {
+  const ref = useDialog(open);
+  const hasNav = onNavPrev != null || onNavNext != null;
+  const onBackdropClick = (e) => {
+    if (!onClose || e.target !== e.currentTarget) return;
+    const r = e.currentTarget.getBoundingClientRect();
+    if (r.width === 0) return;
+    const outside = e.clientX < r.left || e.clientX > r.right || e.clientY < r.top || e.clientY > r.bottom;
+    if (outside) onClose();
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("dialog", { ref, className: cx("uix-peek", className), onClose, onClick: onBackdropClick, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("div", { className: "uix-peek__header", children: [
+      hasNav && /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("div", { className: "uix-peek__nav", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("button", { className: "uix-peek__navbtn", onClick: onNavPrev, disabled: !onNavPrev, "aria-label": "Previous record", children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(ChevronUp, {}) }),
+        /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("button", { className: "uix-peek__navbtn", onClick: onNavNext, disabled: !onNavNext, "aria-label": "Next record", children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(ChevronDown, {}) })
+      ] }),
+      title && /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("div", { className: "uix-peek__title", children: title }),
+      hint && /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("span", { className: "uix-peek__hint", children: hint }),
+      onClose && /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("button", { className: "uix-peek__close", onClick: onClose, "aria-label": "Close preview", children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(CloseIcon3, {}) })
+    ] }),
+    children != null && /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("div", { className: "uix-peek__body", children }),
+    footer != null && /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("div", { className: "uix-peek__footer", children: footer })
+  ] });
+}
+
+// src/components/Card.tsx
+var import_jsx_runtime12 = require("react/jsx-runtime");
+function Card({ title, subtitle, headerAction, footer, children, className, ...props }) {
+  const hasHeader = title != null || subtitle != null || headerAction != null;
+  return /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("div", { className: cx("uix-card", className), ...props, children: [
+    hasHeader && /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("div", { className: "uix-card__header", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("div", { style: { flex: 1 }, children: [
+        title && /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("div", { className: "uix-card__title", children: title }),
+        subtitle && /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("div", { className: "uix-card__subtitle", children: subtitle })
+      ] }),
+      headerAction
+    ] }),
+    children != null && /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("div", { className: "uix-card__body", children }),
+    footer != null && /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("div", { className: "uix-card__footer", children: footer })
+  ] });
+}
+
+// src/components/PageHeader.tsx
+var import_jsx_runtime13 = require("react/jsx-runtime");
+function PageHeader({ eyebrow, title, subtitle, actions, className, ...props }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("header", { className: cx("uix-page-header", className), ...props, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("div", { className: "uix-page-header__titles", children: [
+      eyebrow != null && /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("div", { className: "uix-page-header__eyebrow", children: eyebrow }),
+      /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("h1", { className: "uix-page-header__title", children: title }),
+      subtitle != null && /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("p", { className: "uix-page-header__subtitle", children: subtitle })
+    ] }),
+    actions != null && /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("div", { className: "uix-page-header__actions", children: actions })
+  ] });
+}
+
+// src/components/DetailLayout.tsx
+var import_jsx_runtime14 = require("react/jsx-runtime");
+function DetailLayout({ side, children, className, ...props }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("div", { className: cx("uix-detail", className), ...props, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("div", { className: "uix-detail__main", children }),
+    side != null && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("div", { className: "uix-detail__side", children: side })
+  ] });
+}
+
+// src/components/List.tsx
+var import_jsx_runtime15 = require("react/jsx-runtime");
+function List({ children, className, ...props }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("div", { className: cx("uix-list", className), ...props, children });
+}
+function ListItem({ title, meta, trail, leading, children, className, ...props }) {
+  const hasTitleBlock = title != null || meta != null;
+  return /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)("div", { className: cx("uix-list__item", className), ...props, children: [
+    leading,
+    hasTitleBlock && /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)("div", { style: { minWidth: 0 }, children: [
+      title != null && /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("div", { className: "uix-list__title", children: title }),
+      meta != null && /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("div", { className: "uix-list__meta", children: meta })
+    ] }),
+    children,
+    trail != null && /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("div", { className: "uix-list__trail", children: trail })
+  ] });
+}
+
+// src/components/Tabs.tsx
+var import_react9 = require("react");
+var import_jsx_runtime16 = require("react/jsx-runtime");
+var TabsCtx = (0, import_react9.createContext)({});
+function Tabs({ variant = "line", value, onChange, children, className }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(TabsCtx.Provider, { value: { value, onChange }, children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("div", { role: "tablist", className: cx("uix-tabs", `uix-tabs--${variant}`, className), children }) });
+}
+function Tab({ value, children, disabled, className, onClick, ...props }) {
+  const ctx = (0, import_react9.useContext)(TabsCtx);
+  const selected = ctx.value === value;
+  return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
+    "button",
+    {
+      role: "tab",
+      className: cx("uix-tab", className),
+      "aria-selected": selected,
+      disabled,
+      onClick: (e) => {
+        ctx.onChange?.(value);
+        onClick?.(e);
+      },
+      ...props,
+      children
+    }
+  );
+}
+
+// src/components/AppShell.tsx
+var import_jsx_runtime17 = require("react/jsx-runtime");
+function AppShell({ collapsed, sidebar, topbar, children, className, ...props }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)("div", { className: cx("uix-shell", className), "data-collapsed": collapsed || void 0, ...props, children: [
+    sidebar && /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("div", { className: "uix-shell__sidebar", children: sidebar }),
+    topbar && /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("div", { className: "uix-shell__topbar", children: topbar }),
+    /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("main", { className: "uix-shell__main", children })
+  ] });
+}
+
+// src/components/Sidebar.tsx
+var import_react10 = require("react");
+var import_jsx_runtime18 = require("react/jsx-runtime");
+var ChevronIcon = () => /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("svg", { className: "uix-navgroup__chevron", viewBox: "0 0 12 12", fill: "none", stroke: "currentColor", strokeWidth: 1.5, strokeLinecap: "round", "aria-hidden": "true", children: /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("path", { d: "M2 4l4 4 4-4" }) });
+function Sidebar({ collapsed, onToggle, brand, toggleIcon, children, className, ...props }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("nav", { className: cx("uix-sidebar", className), "data-collapsed": collapsed || void 0, ...props, children: [
+    (brand != null || onToggle) && /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("div", { className: "uix-sidebar__head", children: [
+      brand && /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("div", { className: "uix-sidebar__brand", children: brand }),
+      onToggle && /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("button", { className: "uix-sidebar__toggle", onClick: onToggle, "aria-label": collapsed ? "Expand sidebar" : "Collapse sidebar", children: toggleIcon ?? /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("svg", { width: "18", height: "18", viewBox: "0 0 18 18", fill: "none", stroke: "currentColor", strokeWidth: 1.5, "aria-hidden": "true", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("rect", { x: "3", y: "4", width: "12", height: "1.5", rx: ".75" }),
+        /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("rect", { x: "3", y: "8.25", width: "8", height: "1.5", rx: ".75" }),
+        /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("rect", { x: "3", y: "12.5", width: "12", height: "1.5", rx: ".75" })
+      ] }) })
+    ] }),
+    children
+  ] });
+}
+function SidebarSection({ label, children }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(import_jsx_runtime18.Fragment, { children: [
+    label && /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("div", { className: "uix-sidebar__eyebrow", children: label }),
+    children
+  ] });
+}
+function NavItem({ icon, badge, active, as: Tag = "a", children, className, ...props }) {
+  if (Tag === "button") {
+    const { href: _href, ...btnProps } = props;
+    return /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(
+      "button",
+      {
+        className: cx("uix-navitem", className),
+        "aria-current": active ? "page" : void 0,
+        ...btnProps,
+        children: [
+          icon && /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("span", { className: "uix-navitem__icon", "aria-hidden": "true", children: icon }),
+          /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("span", { className: "uix-navitem__label", children }),
+          badge != null && /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("span", { className: "uix-navitem__badge", children: badge })
+        ]
+      }
+    );
+  }
+  return /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(
+    "a",
+    {
+      className: cx("uix-navitem", className),
+      "aria-current": active ? "page" : void 0,
+      ...props,
+      children: [
+        icon && /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("span", { className: "uix-navitem__icon", "aria-hidden": "true", children: icon }),
+        /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("span", { className: "uix-navitem__label", children }),
+        badge != null && /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("span", { className: "uix-navitem__badge", children: badge })
+      ]
+    }
+  );
+}
+function NavGroup({ icon, label, children, defaultExpanded = true }) {
+  const [expanded, setExpanded] = (0, import_react10.useState)(defaultExpanded);
+  return /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("div", { className: "uix-navgroup", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(
+      "button",
+      {
+        className: "uix-navitem uix-navgroup__trigger",
+        "aria-expanded": expanded,
+        onClick: () => setExpanded((v) => !v),
+        children: [
+          icon && /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("span", { className: "uix-navitem__icon", "aria-hidden": "true", children: icon }),
+          /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("span", { className: "uix-navitem__label", children: label }),
+          /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(ChevronIcon, {})
+        ]
+      }
+    ),
+    /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("div", { className: "uix-navgroup__panel", children: /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("div", { children }) })
+  ] });
+}
+function SubNavItem({ active, as: Tag = "a", children, className, ...props }) {
+  const cls = cx("uix-navitem uix-subitem", className);
+  if (Tag === "button") {
+    const { href: _href, ...btnProps } = props;
+    return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("button", { className: cls, "aria-current": active ? "page" : void 0, ...btnProps, children: /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("span", { className: "uix-navitem__label", children }) });
+  }
+  return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("a", { className: cls, "aria-current": active ? "page" : void 0, ...props, children: /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("span", { className: "uix-navitem__label", children }) });
+}
+
+// src/components/Alert.tsx
+var import_jsx_runtime19 = require("react/jsx-runtime");
+function Alert({ tone, title, icon, children, className, ...props }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("div", { className: cx("uix-alert", tone && tone !== "neutral" && `uix-alert--${tone}`, className), ...props, children: [
+    icon && /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("div", { className: "uix-alert__icon", children: icon }),
+    /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("div", { children: [
+      title && /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("div", { className: "uix-alert__title", children: title }),
+      children && /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("div", { className: "uix-alert__body", children })
+    ] })
+  ] });
+}
+
+// src/components/Spinner.tsx
+var import_jsx_runtime20 = require("react/jsx-runtime");
+function Spinner({ size = "md", accent, className, ...props }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
+    "span",
+    {
+      className: cx("uix-spinner", accent && "uix-spinner--accent", size === "lg" && "uix-spinner--lg", className),
+      role: "status",
+      "aria-label": "Loading",
+      ...props
+    }
+  );
+}
+
+// src/components/Toast.tsx
+var import_jsx_runtime21 = require("react/jsx-runtime");
+function Toast({ title, message, tone, icon, onClose, leaving, className, ...props }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(
+    "div",
+    {
+      className: cx("uix-toast", tone && `uix-toast--${tone}`, className),
+      "data-leaving": leaving || void 0,
+      role: "status",
+      "aria-live": "polite",
+      ...props,
+      children: [
+        icon && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: "uix-toast__icon", children: icon }),
+        /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "uix-toast__body", children: [
+          title && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: "uix-toast__title", children: title }),
+          message && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: "uix-toast__msg", children: message })
+        ] }),
+        onClose && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("button", { className: "uix-toast__close", onClick: onClose, "aria-label": "Dismiss", children: "\xD7" })
+      ]
+    }
+  );
+}
+function Toaster({ children, className, ...props }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: cx("uix-toaster", className), "aria-live": "polite", "aria-atomic": "false", ...props, children });
+}
+
+// src/components/Table.tsx
+var import_jsx_runtime22 = require("react/jsx-runtime");
+function TableWrap({ children, className, ...props }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { className: cx("uix-table-wrap", className), ...props, children });
+}
+function Table({
+  density = "standard",
+  zebra = true,
+  pinnedCol,
+  rowPeek,
+  v2,
+  className,
+  children,
+  ...props
+}) {
+  return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+    "table",
+    {
+      className: cx("uix-table", !zebra && "uix-table--no-zebra", pinnedCol && "uix-table--pinned-col", className),
+      "data-density": density !== "standard" ? density : void 0,
+      "data-uix-rowpeek": rowPeek || void 0,
+      "data-uix-table-v2": v2 || void 0,
+      ...props,
+      children
+    }
+  );
+}
+function Th({ sortable, sortDirection, onSort, className, children, onClick, ...props }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+    "th",
+    {
+      className,
+      "data-sort": sortable || void 0,
+      "aria-sort": sortDirection && sortDirection !== "none" ? sortDirection : void 0,
+      onClick: sortable ? onSort ?? onClick : onClick,
+      ...props,
+      children
+    }
+  );
+}
+function Td({ pinned, className, children, ...props }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("td", { className, "data-pinned": pinned || void 0, ...props, children });
+}
+function Tr({ selected, pinned, className, children, ...props }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+    "tr",
+    {
+      className,
+      "aria-selected": selected || void 0,
+      "data-pinned": pinned || void 0,
+      ...props,
+      children
+    }
+  );
+}
+
+// src/components/Pagination.tsx
+var import_jsx_runtime23 = require("react/jsx-runtime");
+function getPageNumbers(page, total) {
+  if (total <= 7) return Array.from({ length: total }, (_, i) => i + 1);
+  const pages = [1];
+  if (page > 3) pages.push("ellipsis");
+  const start = Math.max(2, page - 1);
+  const end = Math.min(total - 1, page + 1);
+  for (let p = start; p <= end; p++) pages.push(p);
+  if (page < total - 2) pages.push("ellipsis");
+  pages.push(total);
+  return pages;
+}
+function Pagination({ page, pageCount, onChange, className, ...props }) {
+  const pages = getPageNumbers(page, pageCount);
+  return /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("nav", { "aria-label": "Pagination", className: cx("uix-pagination", className), ...props, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+      "button",
+      {
+        className: "uix-pagination__btn",
+        onClick: () => onChange(page - 1),
+        disabled: page <= 1,
+        "aria-label": "Previous page",
+        children: "\u2039"
+      }
+    ),
+    pages.map(
+      (p, i) => p === "ellipsis" ? /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("span", { className: "uix-pagination__ellipsis", children: "\u2026" }, `e${i}`) : /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+        "button",
+        {
+          className: "uix-pagination__btn",
+          "aria-current": p === page ? "page" : void 0,
+          onClick: () => onChange(p),
+          children: p
+        },
+        p
+      )
+    ),
+    /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+      "button",
+      {
+        className: "uix-pagination__btn",
+        onClick: () => onChange(page + 1),
+        disabled: page >= pageCount,
+        "aria-label": "Next page",
+        children: "\u203A"
+      }
+    )
+  ] });
+}
+
+// src/components/StatusPill.tsx
+var import_jsx_runtime24 = require("react/jsx-runtime");
+function StatusPill({ tone = "neutral", treatment = "filled", dot, children, className, ...props }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(
+    "span",
+    {
+      className: cx("uix-pill", `uix-pill--${tone}`, treatment === "outline" && "uix-pill--outline", className),
+      ...props,
+      children: [
+        dot && /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("span", { className: "uix-pill__dot", "aria-hidden": "true" }),
+        children
+      ]
+    }
+  );
+}
+
+// src/components/Progress.tsx
+var import_jsx_runtime25 = require("react/jsx-runtime");
+function Progress({ value = 0, max = 100, indeterminate, className, ...props }) {
+  const pct = Math.max(0, Math.min(100, value / (max || 100) * 100));
+  return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
+    "div",
+    {
+      role: "progressbar",
+      "aria-valuemin": 0,
+      "aria-valuemax": max,
+      "aria-valuenow": indeterminate ? void 0 : value,
+      className: cx("uix-progress", indeterminate && "uix-progress--indeterminate", className),
+      ...props,
+      children: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("div", { className: "uix-progress__bar", style: indeterminate ? void 0 : { width: `${pct}%` } })
+    }
+  );
+}
+
+// src/components/Stat.tsx
+var import_jsx_runtime26 = require("react/jsx-runtime");
+function Stat({ label, value, icon, meta, trend, className, ...props }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)("div", { className: cx("uix-stat", className), ...props, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)("div", { className: "uix-stat__label", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("span", { children: label }),
+      icon
+    ] }),
+    /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("div", { className: "uix-stat__value", children: value }),
+    (meta != null || trend != null) && /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)("div", { className: "uix-stat__meta", children: [
+      trend != null && /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("span", { className: cx("uix-stat__trend", `uix-stat__trend--${trend.direction}`), children: trend.label }),
+      meta
+    ] })
+  ] });
+}
+
+// src/components/Tooltip.tsx
+var import_jsx_runtime27 = require("react/jsx-runtime");
+function Tooltip({ label, children, ...props }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("span", { "data-uix-tip": label, ...props, children });
+}
+
+// src/components/States.tsx
+var import_jsx_runtime28 = require("react/jsx-runtime");
+function EmptyState({ icon, title, children, action, className, ...props }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("div", { className: cx("uix-empty", className), ...props, children: [
+    icon != null && /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("div", { className: "uix-empty__icon", children: icon }),
+    title != null && /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("div", { className: "uix-empty__title", children: title }),
+    children,
+    action
+  ] });
+}
+function ErrorState({ icon, title, detail, action, className, ...props }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("div", { className: cx("uix-empty", "uix-empty--danger", className), role: "alert", ...props, children: [
+    icon != null && /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("div", { className: "uix-empty__icon uix-empty__icon--danger", children: icon }),
+    title != null && /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("div", { className: "uix-empty__title", children: title }),
+    detail != null && /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("p", { children: detail }),
+    action
+  ] });
+}
+function Skeleton({ variant = "block", width, height, className, style, ...props }) {
+  const dims = { width, height, ...style };
+  return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
+    "div",
+    {
+      className: cx(
+        "uix-skeleton",
+        variant === "text" && "uix-skeleton--text",
+        variant === "circle" && "uix-skeleton--circle",
+        className
+      ),
+      style: dims,
+      ...props
+    }
+  );
+}
+function LoadingState({ rows = 3, className, ...props }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("div", { className: cx("uix-stack", className), role: "status", "aria-busy": "true", ...props, children: Array.from({ length: rows }, (_, i) => /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(Skeleton, { variant: "text", width: `${92 - i % 3 * 14}%` }, i)) });
+}
+
+// src/components/Label.tsx
+var import_jsx_runtime29 = require("react/jsx-runtime");
+function Label({ color, dot, children, className, style, ...props }) {
+  const merged = color ? { "--label-color": color, ...style } : style;
+  return /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)("span", { className: cx("uix-label", className), style: merged, ...props, children: [
+    dot && /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("span", { className: "uix-label__dot", "aria-hidden": "true" }),
+    children
+  ] });
+}
+
+// src/components/Avatar.tsx
+var import_jsx_runtime30 = require("react/jsx-runtime");
+function Avatar({ size = "md", src, alt, children, status, className, ...props }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)("span", { className: cx("uix-avatar", size !== "md" && `uix-avatar--${size}`, className), ...props, children: [
+    src ? /* @__PURE__ */ (0, import_jsx_runtime30.jsx)("img", { src, alt: alt ?? "" }) : children,
+    status && /* @__PURE__ */ (0, import_jsx_runtime30.jsx)("span", { className: "uix-avatar__status" })
+  ] });
+}
+function AvatarGroup({ children, className, ...props }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime30.jsx)("span", { className: cx("uix-avatar-group", className), ...props, children });
+}
+function UserChip({ avatar, name, sub, className, children, ...props }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)("span", { className: cx("uix-user-chip", className), ...props, children: [
+    avatar,
+    /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)("span", { children: [
+      name != null && /* @__PURE__ */ (0, import_jsx_runtime30.jsx)("span", { className: "uix-user-chip__name", children: name }),
+      sub != null && /* @__PURE__ */ (0, import_jsx_runtime30.jsx)("span", { className: "uix-user-chip__sub", style: { display: "block" }, children: sub })
+    ] }),
+    children
+  ] });
+}
+
+// src/components/Comments.tsx
+var import_jsx_runtime31 = require("react/jsx-runtime");
+function Comments({ children, className, ...props }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime31.jsx)("div", { className: cx("uix-comments", className), ...props, children });
+}
+function Comment({ avatar, author, meta, children, className, ...props }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)("div", { className: cx("uix-comment", className), ...props, children: [
+    avatar ?? /* @__PURE__ */ (0, import_jsx_runtime31.jsx)("span", { "aria-hidden": "true" }),
+    /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)("div", { className: "uix-comment__body", children: [
+      (author != null || meta != null) && /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)("div", { className: "uix-comment__meta", children: [
+        author != null && /* @__PURE__ */ (0, import_jsx_runtime31.jsx)("span", { className: "uix-comment__author", children: author }),
+        author != null && meta != null ? " \xB7 " : null,
+        meta
+      ] }),
+      children
+    ] })
+  ] });
+}
+
+// src/components/Timeline.tsx
+var import_jsx_runtime32 = require("react/jsx-runtime");
+function Timeline({ children, className, ...props }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime32.jsx)("div", { className: cx("uix-timeline", className), ...props, children });
+}
+function TimelineItem({ meta, children, className, ...props }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)("div", { className: cx("uix-timeline__item", className), ...props, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)("div", { className: "uix-timeline__rail", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime32.jsx)("span", { className: "uix-timeline__node" }),
+      /* @__PURE__ */ (0, import_jsx_runtime32.jsx)("span", { className: "uix-timeline__line" })
+    ] }),
+    /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)("div", { className: "uix-timeline__body", children: [
+      meta != null && /* @__PURE__ */ (0, import_jsx_runtime32.jsx)("div", { className: "uix-timeline__meta", children: meta }),
+      children
+    ] })
+  ] });
+}
+
+// src/components/Prose.tsx
+var import_jsx_runtime33 = require("react/jsx-runtime");
+function Prose({ children, className, ...props }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime33.jsx)("div", { className: cx("uix-prose", className), ...props, children });
+}
+function Note({ tone, icon, children, className, ...props }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)("div", { className: cx("uix-note", tone && `uix-note--${tone}`, className), ...props, children: [
+    icon != null && /* @__PURE__ */ (0, import_jsx_runtime33.jsx)("div", { className: "uix-note__icon", children: icon }),
+    /* @__PURE__ */ (0, import_jsx_runtime33.jsx)("div", { className: "uix-note__body", children })
+  ] });
+}
+
+// src/components/Popover.tsx
+var import_jsx_runtime34 = require("react/jsx-runtime");
+function Popover({ popover = "auto", children, className, ...props }) {
+  const popoverAttr = { popover };
+  return /* @__PURE__ */ (0, import_jsx_runtime34.jsx)("div", { className: cx("uix-popover", className), ...popoverAttr, ...props, children });
+}
+
+// src/components/CommandPalette.tsx
+var import_jsx_runtime35 = require("react/jsx-runtime");
+function CommandPalette({ inputProps, children, className, ...props }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)("div", { className: cx("uix-cmdk", className), ...props, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("input", { className: "uix-cmdk__input", ...inputProps }),
+    /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("div", { className: "uix-cmdk__list", children })
+  ] });
+}
+function CommandGroup({ label, children }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)(import_jsx_runtime35.Fragment, { children: [
+    label != null && /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("div", { className: "uix-cmdk__group", children: label }),
+    children
+  ] });
+}
+function CommandItem({ icon, shortcut, active, children, className, ...props }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)("div", { className: cx("uix-cmdk__item", className), "data-active": active || void 0, ...props, children: [
+    icon,
+    /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("span", { children }),
+    shortcut
+  ] });
+}
+
+// src/components/Kanban.tsx
+var import_jsx_runtime36 = require("react/jsx-runtime");
+function Kanban({ children, className, ...props }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("div", { className: cx("uix-kanban", className), ...props, children });
+}
+function KanbanColumn({ title, count, children, className, ...props }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)("div", { className: cx("uix-kanban__col", className), ...props, children: [
+    (title != null || count != null) && /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)("div", { className: "uix-kanban__head", children: [
+      title,
+      count != null && /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("span", { className: "uix-kanban__count", children: count })
+    ] }),
+    /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("div", { className: "uix-kanban__body", children })
+  ] });
+}
+function KanbanCard({ title, meta, children, className, ...props }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)("div", { className: cx("uix-kanban__card", className), ...props, children: [
+    title && /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("div", { className: "uix-kanban__card-title", children: title }),
+    meta && /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("div", { className: "uix-kanban__card-meta", children: meta }),
+    children
+  ] });
+}
+
+// src/components/Tree.tsx
+var import_react11 = require("react");
+var import_jsx_runtime37 = require("react/jsx-runtime");
+var ChevronIcon2 = () => /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("svg", { viewBox: "0 0 12 12", fill: "none", stroke: "currentColor", strokeWidth: 1.5, strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", children: /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("path", { d: "M2 4l4 4 4-4" }) });
+function TreeNode({ node, expanded, selected, onToggle, onSelect, level = 0 }) {
+  const hasChildren = Array.isArray(node.children) && node.children.length > 0;
+  const isExpanded = expanded.has(node.id);
+  return /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)("li", { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)(
+      "button",
+      {
+        className: "uix-tree__row",
+        "aria-expanded": hasChildren ? isExpanded : void 0,
+        "aria-selected": selected === node.id,
+        onClick: () => {
+          if (hasChildren) onToggle(node.id);
+          onSelect?.(node.id);
+        },
+        children: [
+          /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("span", { className: "uix-tree__toggle", children: hasChildren && /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(ChevronIcon2, {}) }),
+          node.icon && /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("span", { "aria-hidden": "true", children: node.icon }),
+          node.label
+        ]
+      }
+    ),
+    hasChildren && isExpanded && /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("ul", { children: node.children.map((child) => /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
+      TreeNode,
+      {
+        node: child,
+        expanded,
+        selected,
+        onToggle,
+        onSelect,
+        level: level + 1
+      },
+      child.id
+    )) })
+  ] });
+}
+function Tree({ nodes, expanded: controlledExpanded, defaultExpanded, selected, onToggle, onSelect, className, ...props }) {
+  const [internalExpanded, setInternalExpanded] = (0, import_react11.useState)(defaultExpanded ?? /* @__PURE__ */ new Set());
+  const expanded = controlledExpanded ?? internalExpanded;
+  function handleToggle(id) {
+    if (!controlledExpanded) {
+      setInternalExpanded((prev) => {
+        const next = new Set(prev);
+        if (next.has(id)) next.delete(id);
+        else next.add(id);
+        return next;
+      });
+    }
+    onToggle?.(id);
+  }
+  return /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("ul", { className: cx("uix-tree", className), role: "tree", ...props, children: nodes.map((node) => /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
+    TreeNode,
+    {
+      node,
+      expanded,
+      selected,
+      onToggle: handleToggle,
+      onSelect
+    },
+    node.id
+  )) });
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  Alert,
+  AppShell,
+  Avatar,
+  AvatarGroup,
+  Button,
+  ButtonGroup,
+  Card,
+  Checkbox,
+  CommandGroup,
+  CommandItem,
+  CommandPalette,
+  Comment,
+  Comments,
+  DetailLayout,
+  Drawer,
+  EmptyState,
+  ErrorState,
+  Field,
+  Input,
+  InputGroup,
+  Kanban,
+  KanbanCard,
+  KanbanColumn,
+  Label,
+  List,
+  ListItem,
+  LoadingState,
+  Modal,
+  NavGroup,
+  NavItem,
+  Note,
+  PageHeader,
+  Pagination,
+  Peek,
+  Popover,
+  Progress,
+  Prose,
+  Radio,
+  RadioGroup,
+  Select,
+  Sidebar,
+  SidebarSection,
+  Skeleton,
+  Spinner,
+  Stat,
+  StatusPill,
+  SubNavItem,
+  Switch,
+  Tab,
+  Table,
+  TableWrap,
+  Tabs,
+  Td,
+  Textarea,
+  Th,
+  Timeline,
+  TimelineItem,
+  Toast,
+  Toaster,
+  Tooltip,
+  Tr,
+  Tree,
+  UserChip,
+  cx,
+  useDialog
+});