@cytario/design 9.7.0 → 9.8.0

package/dist/index.js

@@ -1385,1135 +1385,1883 @@ function Select({
   );
 }
 
+// src/index.ts
+import { ListBox as ListBox2, ListBoxItem as ListBoxItem2 } from "react-aria-components";
+
 // src/components/Table/Table.tsx
 import {
-  Cell as AriaCell,
-  Column as AriaColumn,
-  Row as AriaRow,
-  Table as AriaTable,
-  TableBody as AriaTableBody,
-  TableHeader as AriaTableHeader
-} from "react-aria-components";
-import { twMerge as twMerge11 } from "tailwind-merge";
+  useReactTable,
+  getCoreRowModel,
+  getSortedRowModel,
+  getFilteredRowModel,
+  getFacetedUniqueValues
+} from "@tanstack/react-table";
+import { useCallback as useCallback8, useMemo as useMemo4, useRef as useRef5 } from "react";
+
+// src/components/EmptyState/EmptyState.tsx
 import { jsx as jsx17, jsxs as jsxs9 } from "react/jsx-runtime";
-var tableSizeClass = {
-  compact: "[--table-row-py:theme(spacing.1)]",
-  comfortable: "[--table-row-py:theme(spacing.3)]"
-};
-function Table2({
-  size = "comfortable",
-  className,
-  ...props
+function EmptyState({
+  icon,
+  title,
+  description,
+  action,
+  className
 }) {
-  return /* @__PURE__ */ jsx17(
-    AriaTable,
+  return /* @__PURE__ */ jsxs9(
+    "div",
     {
-      ...props,
-      className: twMerge11(
-        "w-full border-collapse text-sm text-foreground",
-        tableSizeClass[size],
+      className: [
+        "flex flex-col items-center text-center py-12 px-6",
         className
-      )
+      ].filter(Boolean).join(" "),
+      children: [
+        icon && /* @__PURE__ */ jsx17(Icon, { icon, size: "xl", className: "text-muted-foreground" }),
+        /* @__PURE__ */ jsx17("h3", { className: "text-lg font-semibold text-foreground mt-4", children: title }),
+        description && /* @__PURE__ */ jsx17("p", { className: "text-sm text-muted-foreground mt-2 max-w-sm", children: description }),
+        action && /* @__PURE__ */ jsx17("div", { className: "mt-6", children: action })
+      ]
     }
   );
 }
-function TableHeader(props) {
-  return /* @__PURE__ */ jsx17(AriaTableHeader, { ...props });
+
+// src/components/Table/useColumnFilters.ts
+import { useCallback as useCallback2 } from "react";
+import { useStore } from "zustand";
+
+// src/components/Table/state/createTableStore.ts
+import { createStore } from "zustand";
+import { devtools, persist } from "zustand/middleware";
+
+// src/components/Table/persistMigration.ts
+function createMigrate(migrations, fallbackState) {
+  return (persistedState, version) => {
+    try {
+      let state = persistedState;
+      const targetVersion = Math.max(...Object.keys(migrations).map(Number)) + 1;
+      for (let v = version; v < targetVersion; v++) {
+        const migration = migrations[v];
+        if (migration) {
+          state = migration(state);
+        }
+      }
+      return state;
+    } catch (error) {
+      console.warn("[persist] Migration failed, using fallback state:", error);
+      return fallbackState;
+    }
+  };
 }
-function Column({ className, ...props }) {
-  return /* @__PURE__ */ jsx17(
-    AriaColumn,
+
+// src/components/Table/state/createTableStore.ts
+var createTableStore = (tableId) => createStore()(
+  persist(
+    devtools(
+      (set) => ({
+        tableId,
+        columnWidths: {},
+        sorting: [],
+        columnVisibility: {},
+        columnFilters: [],
+        setColumnWidth: (columnId, width) => set(
+          (state) => ({
+            columnWidths: {
+              ...state.columnWidths,
+              [columnId]: width
+            }
+          }),
+          false,
+          "setColumnWidth"
+        ),
+        setSorting: (sorting) => set({ sorting }, false, "setSorting"),
+        setColumnVisibility: (columnVisibility) => set({ columnVisibility }, false, "setColumnVisibility"),
+        setColumnFilters: (columnFilters) => set({ columnFilters }, false, "setColumnFilters"),
+        reset: () => set(
+          {
+            columnWidths: {},
+            sorting: [],
+            columnVisibility: {},
+            columnFilters: []
+          },
+          false,
+          "reset"
+        )
+      }),
+      { name: `TableStore-${tableId}` }
+    ),
     {
-      ...props,
-      className: twMerge11(
-        "px-3 py-2 text-left font-semibold text-muted-foreground",
-        "border-b-2 border-border",
-        "cursor-default select-none outline-none",
-        "focus-visible:outline-2 focus-visible:outline-ring focus-visible:outline-offset-[-2px]",
-        className
+      name: `TableStore-${tableId}`,
+      version: 1,
+      migrate: createMigrate(
+        {
+          0: () => ({
+            columnWidths: {},
+            sorting: [],
+            columnVisibility: {},
+            columnFilters: []
+          })
+        },
+        {
+          columnWidths: {},
+          sorting: [],
+          columnVisibility: {},
+          columnFilters: []
+        }
       ),
-      children: ({ allowsSorting, sortDirection }) => /* @__PURE__ */ jsxs9("span", { className: "inline-flex items-center gap-1", children: [
-        props.children,
-        allowsSorting && /* @__PURE__ */ jsx17("span", { "aria-hidden": "true", className: "text-muted-foreground", children: sortDirection === "ascending" ? "\u25B2" : sortDirection === "descending" ? "\u25BC" : "\u25B4" })
-      ] })
+      onRehydrateStorage: () => (_state, error) => {
+        if (error) console.error(`[TableStore-${tableId}] Rehydration failed:`, error);
+      }
     }
+  )
+);
+
+// src/components/Table/state/useTableStore.ts
+var tableStores = /* @__PURE__ */ new Map();
+function useTableStore(tableId) {
+  let store = tableStores.get(tableId);
+  if (!store) {
+    store = createTableStore(tableId);
+    tableStores.set(tableId, store);
+  }
+  return store;
+}
+function getTableStore(tableId) {
+  return tableStores.get(tableId);
+}
+
+// src/components/Table/useColumnFilters.ts
+function useColumnFilters({ tableId }) {
+  const store = useTableStore(tableId);
+  const columnFilters = useStore(store, (s) => s.columnFilters);
+  const setFiltersStore = useStore(store, (s) => s.setColumnFilters);
+  const setColumnFilters = useCallback2(
+    (updaterOrValue) => {
+      const current = store.getState().columnFilters;
+      const next = typeof updaterOrValue === "function" ? updaterOrValue(current) : updaterOrValue;
+      setFiltersStore(next);
+    },
+    [store, setFiltersStore]
   );
+  const resetFilters = useCallback2(() => {
+    setFiltersStore([]);
+  }, [setFiltersStore]);
+  return { columnFilters, setColumnFilters, resetFilters };
 }
-function TableBody(props) {
-  return /* @__PURE__ */ jsx17(AriaTableBody, { ...props });
+
+// src/components/Table/NoFilterResults.tsx
+import { jsx as jsx18 } from "react/jsx-runtime";
+function NoFilterResults({ tableId }) {
+  const { resetFilters } = useColumnFilters({ tableId });
+  return /* @__PURE__ */ jsx18(
+    EmptyState,
+    {
+      icon: "SearchX",
+      title: "No results",
+      description: "No results match your filters",
+      action: /* @__PURE__ */ jsx18(Button, { variant: "secondary", iconLeft: "FilterX", onPress: resetFilters, children: "Clear all filters" })
+    }
+  );
 }
-function Row({
-  className,
-  ...props
-}) {
-  return /* @__PURE__ */ jsx17(
-    AriaRow,
+
+// src/components/Form/Checkbox/Checkbox.tsx
+import {
+  Checkbox as AriaCheckbox
+} from "react-aria-components";
+import { Check as Check3 } from "lucide-react";
+import { Fragment as Fragment2, jsx as jsx19, jsxs as jsxs10 } from "react/jsx-runtime";
+function stopToggleForInteractive(e) {
+  if (e.target instanceof Element && e.target.closest("a, button, input, select, textarea")) {
+    e.stopPropagation();
+  }
+}
+function Checkbox({ children, className, ...props }) {
+  return /* @__PURE__ */ jsx19(
+    AriaCheckbox,
     {
       ...props,
-      className: twMerge11(
-        "border-b border-border",
-        "even:bg-card",
-        "hover:bg-muted",
-        "data-[selected]:bg-accent",
-        "data-[selected]:ring-2 data-[selected]:ring-ring data-[selected]:ring-inset",
-        "outline-none",
-        "focus-visible:outline-2 focus-visible:outline-ring focus-visible:outline-offset-[-2px]",
-        "transition-colors",
+      className: [
+        "group flex items-center gap-2 text-sm text-foreground cursor-pointer",
+        "disabled:opacity-50 disabled:cursor-default",
         className
-      )
+      ].filter(Boolean).join(" "),
+      children: ({ isSelected, isIndeterminate }) => /* @__PURE__ */ jsxs10(Fragment2, { children: [
+        /* @__PURE__ */ jsxs10(
+          "div",
+          {
+            className: [
+              "flex items-center justify-center w-6 h-6 shrink-0",
+              "rounded-sm border transition-colors",
+              "group-focus-visible:ring-2 group-focus-visible:ring-ring group-focus-visible:ring-offset-2",
+              isSelected || isIndeterminate ? "bg-primary border-primary" : "bg-background border-border group-hover:border-border"
+            ].join(" "),
+            children: [
+              isSelected && /* @__PURE__ */ jsx19(Check3, { className: "w-4 h-4 text-primary-foreground", strokeWidth: 3 }),
+              isIndeterminate && /* @__PURE__ */ jsx19("div", { className: "w-3 h-0.5 bg-primary-foreground rounded-full" })
+            ]
+          }
+        ),
+        children && /* @__PURE__ */ jsx19(
+          "span",
+          {
+            onPointerDown: stopToggleForInteractive,
+            onPointerUp: stopToggleForInteractive,
+            onMouseDown: stopToggleForInteractive,
+            onClick: stopToggleForInteractive,
+            children
+          }
+        )
+      ] })
     }
   );
 }
-function Cell({ className, ...props }) {
-  return /* @__PURE__ */ jsx17(
-    AriaCell,
+
+// src/components/Table/TableBodyRow.tsx
+import { flexRender } from "@tanstack/react-table";
+import { useCallback as useCallback3 } from "react";
+import { twMerge as twMerge11 } from "tailwind-merge";
+import { jsx as jsx20, jsxs as jsxs11 } from "react/jsx-runtime";
+function TableBodyRow({
+  row,
+  rowIndex,
+  columns,
+  enableRowSelection,
+  className
+}) {
+  const handleKeyDown = useCallback3((event) => {
+    const tr = event.currentTarget;
+    if (event.key === "ArrowDown") {
+      event.preventDefault();
+      const next = tr.nextElementSibling;
+      next?.focus();
+    } else if (event.key === "ArrowUp") {
+      event.preventDefault();
+      const prev = tr.previousElementSibling;
+      prev?.focus();
+    } else if (event.key === "Enter") {
+      const link = tr.querySelector("a");
+      link?.click();
+    }
+  }, []);
+  return /* @__PURE__ */ jsx20(
+    "tr",
     {
-      ...props,
+      tabIndex: 0,
+      onKeyDown: handleKeyDown,
       className: twMerge11(
-        "px-3 py-(--table-row-py)",
-        "text-foreground",
-        "outline-none",
-        "focus-visible:outline-2 focus-visible:outline-ring focus-visible:outline-offset-[-2px]",
+        "w-full block border-b border-border",
+        "hover:bg-card transition-colors",
+        "focus-visible:outline-none focus-visible:bg-muted focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-ring",
+        row.getIsSelected() && "bg-accent",
         className
-      )
+      ),
+      children: row.getVisibleCells().map((cell) => {
+        const isIndexColumn = cell.column.id === "index";
+        const columnConfig = columns.find((col) => col.id === cell.column.id);
+        const isRight = columnConfig?.align === "right";
+        const alignClass = isRight ? "text-right" : columnConfig?.align === "center" ? "text-center" : "text-left";
+        const cxCell = twMerge11(
+          "px-4 py-2",
+          isIndexColumn ? "text-right" : alignClass,
+          columnConfig?.monospace && "font-mono font-light",
+          (isRight || isIndexColumn) && "tabular-nums",
+          !columnConfig?.anchor && !isIndexColumn && "text-sm"
+        );
+        const style = {
+          width: cell.column.getSize(),
+          minWidth: cell.column.getSize(),
+          maxWidth: cell.column.getSize()
+        };
+        const rawValue = cell.getValue();
+        const useRawString = columnConfig?.ellipsis === "middle" && typeof rawValue === "string";
+        const content = isIndexColumn ? rowIndex + 1 : useRawString ? rawValue : flexRender(cell.column.columnDef.cell, cell.getContext());
+        const copyValue = columnConfig?.copyable && typeof rawValue === "string" ? rawValue : void 0;
+        return isIndexColumn ? /* @__PURE__ */ jsx20("th", { className: "p-2", style, children: /* @__PURE__ */ jsxs11("div", { className: "flex items-center gap-1 text-sm text-muted-foreground tabular-nums justify-between", children: [
+          enableRowSelection && /* @__PURE__ */ jsx20(Checkbox, { isSelected: row.getIsSelected(), onChange: () => row.toggleSelected() }),
+          /* @__PURE__ */ jsx20("span", { children: rowIndex + 1 })
+        ] }) }, cell.id) : /* @__PURE__ */ jsx20("td", { className: cxCell, style, children: /* @__PURE__ */ jsx20(TruncatedText, { ellipsis: columnConfig?.ellipsis, copyValue, children: content }) }, cell.id);
+      })
     }
   );
 }
 
-// src/components/Dialog/Dialog.tsx
-import {
-  Modal,
-  ModalOverlay,
-  Dialog as AriaDialog,
-  Heading as Heading3
-} from "react-aria-components";
-import { X as X2 } from "lucide-react";
-import { Fragment as Fragment2, jsx as jsx18, jsxs as jsxs10 } from "react/jsx-runtime";
+// src/components/Table/TableHeaderRow.tsx
+import { flexRender as flexRender2 } from "@tanstack/react-table";
+import { twMerge as twMerge16 } from "tailwind-merge";
+
+// src/components/Badge/Badge.tsx
+import { twMerge as twMerge13 } from "tailwind-merge";
+
+// src/components/MetricText/MetricText.tsx
+import { twMerge as twMerge12 } from "tailwind-merge";
+import { jsx as jsx21 } from "react/jsx-runtime";
+function MetricText({ className, ...rest }) {
+  const cx = twMerge12(
+    "text-xs font-medium leading-none tracking-wider tabular-nums",
+    className
+  );
+  return /* @__PURE__ */ jsx21("span", { className: cx, ...rest });
+}
+
+// src/components/Badge/Badge.tsx
+import { jsx as jsx22, jsxs as jsxs12 } from "react/jsx-runtime";
+var colorStyles = {
+  purple: "bg-badge-purple-bg text-badge-purple-text border-badge-purple-text/20",
+  teal: "bg-badge-teal-bg text-badge-teal-text border-badge-teal-text/20",
+  rose: "bg-badge-rose-bg text-badge-rose-text border-badge-rose-text/20",
+  slate: "bg-badge-slate-bg text-badge-slate-text border-badge-slate-text/20",
+  green: "bg-badge-green-bg text-badge-green-text border-badge-green-text/20",
+  amber: "bg-badge-amber-bg text-badge-amber-text border-badge-amber-text/20"
+};
 var sizeStyles3 = {
-  sm: "max-w-md",
-  md: "max-w-lg",
-  lg: "max-w-2xl",
-  xl: "max-w-4xl"
+  xs: "px-1 py-0 text-[10px]",
+  sm: "px-1.5 py-0.5 text-xs",
+  md: "px-2 py-0.5 text-xs",
+  lg: "px-2.5 py-1 text-sm"
 };
-function Dialog({
-  isOpen,
-  onOpenChange,
-  title,
-  size = "md",
-  isDismissable = true,
+function Badge({
   children,
-  className
+  color = "slate",
+  size = "sm",
+  icon,
+  className,
+  ...rest
 }) {
-  return /* @__PURE__ */ jsx18(
-    ModalOverlay,
+  return /* @__PURE__ */ jsxs12(
+    MetricText,
     {
-      isOpen,
-      onOpenChange,
-      isDismissable,
-      className: [
-        "fixed inset-0 z-50 bg-backdrop backdrop-blur-sm",
-        "flex items-center justify-center",
-        "entering:animate-in entering:fade-in",
-        "exiting:animate-out exiting:fade-out"
-      ].join(" "),
-      children: /* @__PURE__ */ jsx18(
-        Modal,
-        {
-          className: [
-            "w-full mx-4",
-            sizeStyles3[size],
-            "bg-background rounded-lg shadow-xl max-h-[85vh] flex flex-col",
-            "entering:animate-in entering:zoom-in-95 entering:fade-in",
-            "exiting:animate-out exiting:zoom-out-95 exiting:fade-out",
-            className
-          ].filter(Boolean).join(" "),
-          children: /* @__PURE__ */ jsx18(AriaDialog, { className: "outline-none flex flex-col max-h-[85vh]", children: ({ close }) => /* @__PURE__ */ jsxs10(Fragment2, { children: [
-            /* @__PURE__ */ jsxs10("div", { className: "flex items-center justify-between px-6 py-4 border-b border-border", children: [
-              /* @__PURE__ */ jsx18(
-                Heading3,
-                {
-                  slot: "title",
-                  className: "text-lg font-semibold text-foreground",
-                  children: title
-                }
-              ),
-              /* @__PURE__ */ jsx18(
-                "button",
-                {
-                  type: "button",
-                  onClick: close,
-                  className: [
-                    "inline-flex items-center justify-center rounded-sm p-1",
-                    "text-muted-foreground hover:text-foreground hover:bg-muted",
-                    "outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2",
-                    "transition-colors"
-                  ].join(" "),
-                  "aria-label": "Close",
-                  children: /* @__PURE__ */ jsx18(X2, { size: 20, "aria-hidden": "true" })
-                }
-              )
-            ] }),
-            /* @__PURE__ */ jsx18("div", { className: "px-6 py-4 overflow-y-auto", children })
-          ] }) })
-        }
-      )
+      className: twMerge13(
+        "inline-flex items-center gap-1 rounded-full border",
+        colorStyles[color],
+        sizeStyles3[size],
+        className
+      ),
+      ...rest,
+      children: [
+        icon && /* @__PURE__ */ jsx22(Icon, { icon, size: "xs" }),
+        children
+      ]
     }
   );
 }
 
-// src/components/Dialog/DialogFooter.tsx
-import { jsx as jsx19 } from "react/jsx-runtime";
+// src/components/Table/ColumnFilterInput.tsx
+import { useMemo } from "react";
+import { jsx as jsx23, jsxs as jsxs13 } from "react/jsx-runtime";
+var ALL_KEY = "__all__";
+var ALL_OPTION = { id: ALL_KEY, name: "All" };
+var AllPill = () => /* @__PURE__ */ jsx23(Badge, { color: "slate", children: "All" });
+function ColumnFilterInput({
+  column,
+  filterType,
+  filterPlaceholder,
+  filterOptions,
+  filterRender
+}) {
+  const filterValue = column.getFilterValue() ?? "";
+  const selectItems = useMemo(() => {
+    if (filterType !== "select") return [];
+    if (filterOptions) {
+      return [
+        ALL_OPTION,
+        ...filterOptions.filter((o) => o.value !== "").map((o) => ({ id: o.value, name: o.label }))
+      ];
+    }
+    const facetedValues = column.getFacetedUniqueValues();
+    return [
+      ALL_OPTION,
+      ...Array.from(facetedValues.keys()).filter((v) => v != null && v !== "").map(String).sort().map((v) => ({ id: v, name: v }))
+    ];
+  }, [column, filterType, filterOptions]);
+  const selectedKey = filterValue || ALL_KEY;
+  const setFilter = (key) => column.setFilterValue(key === ALL_KEY ? void 0 : key);
+  const clearFilter = () => column.setFilterValue(void 0);
+  const renderItem = useMemo(() => {
+    if (!filterRender) return void 0;
+    const render = filterRender;
+    function FilterOption(item) {
+      return item.id === ALL_KEY ? /* @__PURE__ */ jsx23(AllPill, {}) : render({ label: item.name, value: item.id });
+    }
+    return FilterOption;
+  }, [filterRender]);
+  return /* @__PURE__ */ jsxs13("div", { className: "flex items-center gap-1 font-normal", children: [
+    filterType === "select" ? /* @__PURE__ */ jsx23(
+      Select,
+      {
+        size: "sm",
+        className: "w-full",
+        items: selectItems,
+        value: selectedKey,
+        onChange: (key) => setFilter(String(key)),
+        "aria-label": `Filter by ${column.columnDef.header}`,
+        renderItem
+      }
+    ) : /* @__PURE__ */ jsx23(
+      Input,
+      {
+        value: filterValue,
+        onChange: setFilter,
+        placeholder: filterPlaceholder ?? `Filter ${column.columnDef.header}...`,
+        "aria-label": `Filter by ${column.columnDef.header}`,
+        size: "sm"
+      }
+    ),
+    filterValue && /* @__PURE__ */ jsx23(IconButton, { icon: "X", size: "sm", variant: "ghost", onPress: clearFilter, label: "Clear filter" })
+  ] });
+}
 
-// src/components/Toast/Toast.tsx
-import {
-  createContext,
-  useCallback as useCallback2,
-  useContext,
-  useEffect as useEffect2,
-  useRef as useRef4,
-  useState as useState6
-} from "react";
-import { createPortal as createPortal2 } from "react-dom";
-import { CheckCircle as CheckCircle3, XCircle as XCircle2, Info as Info2, X as X3 } from "lucide-react";
-import { jsx as jsx20, jsxs as jsxs11 } from "react/jsx-runtime";
-var ToastContext = createContext(null);
-var toastCounter = 0;
-var defaultDuration = {
-  success: 5e3,
-  info: 5e3,
-  error: 1e4
+// src/components/Table/ColumnResizeHandle.tsx
+import { jsx as jsx24 } from "react/jsx-runtime";
+var ColumnResizeHandle = ({ header }) => {
+  return /* @__PURE__ */ jsx24(
+    "button",
+    {
+      type: "button",
+      onMouseDown: header.getResizeHandler(),
+      onTouchStart: header.getResizeHandler(),
+      "aria-label": `Resize ${header.column.columnDef.header} column`,
+      className: `
+        z-20 cursor-col-resize
+        absolute top-0 right-0 h-full w-2
+        flex justify-end
+        transition-colors duration-200
+        bg-transparent hover:bg-accent active:bg-secondary
+      `,
+      children: /* @__PURE__ */ jsx24("div", { className: "w-px h-full bg-border" })
+    }
+  );
 };
-var variantConfig = {
-  success: {
-    icon: CheckCircle3,
-    containerClass: "bg-success-surface border-success-border text-success",
-    iconClass: "text-success"
-  },
-  error: {
-    icon: XCircle2,
-    containerClass: "bg-destructive-surface border-destructive-border text-destructive",
-    iconClass: "text-destructive"
-  },
-  info: {
-    icon: Info2,
-    containerClass: "bg-info-surface border-info-border text-info",
-    iconClass: "text-info"
+
+// src/components/Table/ColumnSortButton.tsx
+import { jsx as jsx25 } from "react/jsx-runtime";
+function getStyle(sortDirection) {
+  switch (sortDirection) {
+    case "desc":
+    case "asc":
+      return "text-muted-foreground group-hover/header:text-foreground";
+    default:
+      return "text-muted-foreground opacity-0 group-hover/header:opacity-100";
   }
+}
+var ColumnSortButton = ({ header }) => {
+  const sortDirection = header.column.getIsSorted();
+  const cx = getStyle(sortDirection);
+  return sortDirection === "desc" ? /* @__PURE__ */ jsx25(Icon, { icon: "ChevronUp", size: "xs", className: cx }) : /* @__PURE__ */ jsx25(Icon, { icon: "ChevronDown", size: "xs", className: cx });
 };
-var PlacementContext = createContext("bottom-right");
-var exitAnimationByPlacement = {
-  "top-center": "-translate-y-full opacity-0",
-  "top-right": "translate-x-full opacity-0",
-  "bottom-center": "translate-y-full opacity-0",
-  "bottom-right": "translate-x-full opacity-0"
-};
-var enterAnimationByPlacement = {
-  "top-center": "translate-y-0 opacity-100 animate-in slide-in-from-top",
-  "top-right": "translate-x-0 opacity-100 animate-in slide-in-from-right",
-  "bottom-center": "translate-y-0 opacity-100 animate-in slide-in-from-bottom",
-  "bottom-right": "translate-x-0 opacity-100 animate-in slide-in-from-right"
-};
-function ToastItem({
-  toast,
-  onRemove
+
+// src/components/Menu/Menu.tsx
+import {
+  MenuTrigger,
+  Menu as AriaMenu,
+  MenuItem as AriaMenuItem,
+  Popover as Popover2
+} from "react-aria-components";
+import { twMerge as twMerge14 } from "tailwind-merge";
+
+// src/components/Menu/menuStyles.ts
+var popoverStyles = `
+  bg-background rounded-md shadow-lg
+  border border-border
+  py-1 min-w-48
+  entering:animate-in entering:fade-in entering:zoom-in-95
+  exiting:animate-out exiting:fade-out exiting:zoom-out-95
+`;
+
+// src/components/Menu/Menu.tsx
+import { jsx as jsx26, jsxs as jsxs14 } from "react/jsx-runtime";
+function Menu2({
+  items,
+  content,
+  children,
+  onAction,
+  selectionMode,
+  selectedKeys,
+  defaultSelectedKeys,
+  onSelectionChange,
+  className
 }) {
-  const [isExiting, setIsExiting] = useState6(false);
-  const timerRef = useRef4(null);
-  const placement = useContext(PlacementContext);
-  const config = variantConfig[toast.variant];
-  const IconComponent = config.icon;
-  const dismiss = useCallback2(() => {
-    setIsExiting(true);
-    setTimeout(() => onRemove(toast.id), 200);
-  }, [onRemove, toast.id]);
+  const selectionProps = selectionMode && selectionMode !== "none" ? { selectionMode, selectedKeys, defaultSelectedKeys, onSelectionChange } : {};
+  return /* @__PURE__ */ jsxs14(MenuTrigger, { children: [
+    children,
+    /* @__PURE__ */ jsx26(Popover2, { className: twMerge14(popoverStyles, className), children: items ? /* @__PURE__ */ jsx26(
+      AriaMenu,
+      {
+        items,
+        onAction: (key) => {
+          const item = items.find((i) => i.id === key);
+          item?.onAction?.();
+          onAction?.(key);
+        },
+        ...selectionProps,
+        className: "outline-none",
+        children: (item) => /* @__PURE__ */ jsxs14(
+          AriaMenuItem,
+          {
+            id: item.id,
+            href: item.href,
+            target: item.target,
+            isDisabled: item.isDisabled,
+            className: [
+              "flex items-center gap-2 px-3 py-2 text-sm outline-none cursor-default",
+              "transition-colors",
+              "focus:bg-muted",
+              "hover:bg-muted",
+              "disabled:opacity-50 disabled:pointer-events-none",
+              item.isDanger ? "text-destructive" : "text-foreground"
+            ].filter(Boolean).join(" "),
+            children: [
+              item.icon && /* @__PURE__ */ jsx26(Icon, { icon: item.icon, size: "sm" }),
+              /* @__PURE__ */ jsx26("span", { className: "flex-1", children: item.label }),
+              item.endContent && /* @__PURE__ */ jsx26("span", { className: "ml-auto flex items-center", children: item.endContent })
+            ]
+          }
+        )
+      }
+    ) : /* @__PURE__ */ jsx26(
+      AriaMenu,
+      {
+        onAction: (key) => onAction?.(key),
+        ...selectionProps,
+        className: "outline-none",
+        children: content
+      }
+    ) })
+  ] });
+}
+
+// src/components/Menu/useContextMenu.tsx
+import {
+  useCallback as useCallback4,
+  useEffect as useEffect2,
+  useId as useId2,
+  useRef as useRef4,
+  useState as useState6
+} from "react";
+import {
+  Menu as AriaMenu2,
+  MenuTrigger as MenuTrigger2,
+  Popover as Popover3
+} from "react-aria-components";
+import { twMerge as twMerge15 } from "tailwind-merge";
+import { jsx as jsx27, jsxs as jsxs15 } from "react/jsx-runtime";
+function useContextMenu({
+  content,
+  label,
+  onAction,
+  className
+}) {
+  const popoverId = useId2();
+  const [anchor, setAnchor] = useState6(null);
+  const anchorRef = useRef4(null);
+  const popoverRef = useRef4(null);
+  const isOpen = anchor !== null;
+  const close = useCallback4(() => setAnchor(null), []);
+  const onContextMenu = useCallback4((event) => {
+    event.preventDefault();
+    setAnchor({ x: event.clientX, y: event.clientY });
+  }, []);
+  const onPress = useCallback4((event) => {
+    const rect = event.target.getBoundingClientRect();
+    setAnchor({ x: rect.left, y: rect.bottom });
+  }, []);
   useEffect2(() => {
-    const duration = toast.duration ?? defaultDuration[toast.variant];
-    timerRef.current = setTimeout(dismiss, duration);
+    if (!isOpen) return;
+    const isInside = (target) => popoverRef.current?.contains(target) ?? false;
+    const onPointerDown = (event) => {
+      if (!isInside(event.target)) close();
+    };
+    const onOutsideContextMenu = (event) => {
+      if (isInside(event.target)) return;
+      event.preventDefault();
+      close();
+    };
+    const onKeyDown = (event) => {
+      if (event.key === "Escape") close();
+    };
+    document.addEventListener("pointerdown", onPointerDown, true);
+    document.addEventListener("contextmenu", onOutsideContextMenu, true);
+    document.addEventListener("keydown", onKeyDown, true);
     return () => {
-      if (timerRef.current) clearTimeout(timerRef.current);
+      document.removeEventListener("pointerdown", onPointerDown, true);
+      document.removeEventListener("contextmenu", onOutsideContextMenu, true);
+      document.removeEventListener("keydown", onKeyDown, true);
     };
-  }, [toast.duration, toast.variant, dismiss]);
-  return /* @__PURE__ */ jsxs11(
-    "div",
+  }, [isOpen, close]);
+  const menu = /* @__PURE__ */ jsxs15(
+    MenuTrigger2,
     {
-      role: "status",
-      "aria-live": "polite",
-      className: [
-        "flex items-start gap-3 rounded-lg border px-4 py-3 shadow-md",
-        "min-w-[320px] max-w-[420px]",
-        "transition-all duration-200",
-        isExiting ? exitAnimationByPlacement[placement] : enterAnimationByPlacement[placement],
-        config.containerClass
-      ].join(" "),
+      isOpen,
+      onOpenChange: (open) => {
+        if (!open) close();
+      },
       children: [
-        /* @__PURE__ */ jsx20(IconComponent, { size: 20, className: ["shrink-0 mt-0.5", config.iconClass].join(" "), "aria-hidden": "true" }),
-        /* @__PURE__ */ jsx20("p", { className: "flex-1 text-sm font-medium", children: toast.message }),
-        /* @__PURE__ */ jsx20(
-          "button",
+        /* @__PURE__ */ jsx27(
+          "span",
           {
-            type: "button",
-            onClick: dismiss,
-            className: "shrink-0 rounded-sm p-0.5 opacity-70 hover:opacity-100 transition-opacity outline-none focus-visible:ring-2 focus-visible:ring-current",
-            "aria-label": "Dismiss",
-            children: /* @__PURE__ */ jsx20(X3, { size: 16, "aria-hidden": "true" })
+            ref: anchorRef,
+            "aria-hidden": true,
+            tabIndex: -1,
+            className: "pointer-events-none fixed h-0 w-0",
+            style: { left: anchor?.x ?? 0, top: anchor?.y ?? 0 }
+          }
+        ),
+        /* @__PURE__ */ jsx27(
+          Popover3,
+          {
+            isNonModal: true,
+            triggerRef: anchorRef,
+            placement: "bottom start",
+            ref: popoverRef,
+            className: twMerge15(popoverStyles, className),
+            children: /* @__PURE__ */ jsx27(
+              AriaMenu2,
+              {
+                id: popoverId,
+                "aria-label": label,
+                autoFocus: "first",
+                onAction: (key) => {
+                  onAction?.(String(key));
+                  close();
+                },
+                className: "outline-none",
+                children: content
+              }
+            )
           }
         )
       ]
     }
   );
-}
-var containerPositionStyles = {
-  "top-center": "fixed top-4 left-1/2 -translate-x-1/2 z-50 flex flex-col-reverse gap-2 items-center",
-  "top-right": "fixed top-4 right-4 z-50 flex flex-col-reverse gap-2",
-  "bottom-center": "fixed bottom-4 left-1/2 -translate-x-1/2 z-50 flex flex-col gap-2 items-center",
-  "bottom-right": "fixed bottom-4 right-4 z-50 flex flex-col gap-2"
-};
-function ToastContainer({
-  toasts,
-  removeToast,
-  placement = "bottom-right"
-}) {
-  if (toasts.length === 0) return null;
-  return createPortal2(
-    /* @__PURE__ */ jsx20(PlacementContext.Provider, { value: placement, children: /* @__PURE__ */ jsx20("div", { className: containerPositionStyles[placement], children: toasts.map((toast) => /* @__PURE__ */ jsx20(ToastItem, { toast, onRemove: removeToast }, toast.id)) }) }),
-    document.body
-  );
-}
-function createToastBridge() {
-  const listeners = /* @__PURE__ */ new Set();
   return {
-    emit: (toast) => {
-      listeners.forEach((fn) => fn(toast));
+    targetProps: { onContextMenu },
+    triggerProps: {
+      onPress,
+      onClick: (e) => {
+        e.preventDefault();
+      },
+      "aria-haspopup": "menu",
+      "aria-expanded": isOpen,
+      "aria-controls": isOpen ? popoverId : void 0
     },
-    subscribe: (fn) => {
-      listeners.add(fn);
-      return () => {
-        listeners.delete(fn);
-      };
-    }
-  };
-}
-function ToastProvider({ children, bridge, placement = "bottom-right" }) {
-  const [toasts, setToasts] = useState6([]);
-  const addToast = useCallback2((toast) => {
-    const id = `toast-${++toastCounter}`;
-    setToasts((prev) => [...prev, { ...toast, id }]);
-  }, []);
-  const removeToast = useCallback2((id) => {
-    setToasts((prev) => prev.filter((t) => t.id !== id));
-  }, []);
-  useEffect2(() => {
-    if (!bridge) return;
-    return bridge.subscribe(addToast);
-  }, [bridge, addToast]);
-  return /* @__PURE__ */ jsxs11(ToastContext.Provider, { value: { toasts, addToast, removeToast }, children: [
-    children,
-    /* @__PURE__ */ jsx20(ToastContainer, { toasts, removeToast, placement })
-  ] });
-}
-function useToast() {
-  const context = useContext(ToastContext);
-  if (!context) {
-    throw new Error("useToast must be used within a ToastProvider");
-  }
-  return {
-    toast: context.addToast,
-    toasts: context.toasts,
-    removeToast: context.removeToast
+    menu,
+    isOpen,
+    close
   };
 }
 
-// src/components/EmptyState/EmptyState.tsx
-import { jsx as jsx21, jsxs as jsxs12 } from "react/jsx-runtime";
-function EmptyState({
+// src/components/Menu/MenuItem.tsx
+import { MenuItem as AriaMenuItem2 } from "react-aria-components";
+import { jsx as jsx28, jsxs as jsxs16 } from "react/jsx-runtime";
+function MenuItem({
+  id,
+  children,
   icon,
-  title,
-  description,
-  action,
+  endContent,
+  onAction,
+  href,
+  target,
+  isDisabled,
+  isDanger,
+  textValue,
   className
 }) {
-  return /* @__PURE__ */ jsxs12(
-    "div",
+  return /* @__PURE__ */ jsxs16(
+    AriaMenuItem2,
     {
+      id,
+      href,
+      target,
+      isDisabled,
+      onAction,
+      textValue,
       className: [
-        "flex flex-col items-center text-center py-12 px-6",
+        "flex items-center gap-2 px-3 py-2 text-sm outline-none cursor-default",
+        "transition-colors",
+        "focus:bg-muted",
+        "hover:bg-muted",
+        "disabled:opacity-50 disabled:pointer-events-none",
+        isDanger ? "text-destructive" : "text-foreground",
         className
       ].filter(Boolean).join(" "),
       children: [
-        icon && /* @__PURE__ */ jsx21(Icon, { icon, size: "xl", className: "text-muted-foreground" }),
-        /* @__PURE__ */ jsx21("h3", { className: "text-lg font-semibold text-foreground mt-4", children: title }),
-        description && /* @__PURE__ */ jsx21("p", { className: "text-sm text-muted-foreground mt-2 max-w-sm", children: description }),
-        action && /* @__PURE__ */ jsx21("div", { className: "mt-6", children: action })
+        icon && /* @__PURE__ */ jsx28(Icon, { icon, size: "sm" }),
+        /* @__PURE__ */ jsx28("span", { className: "flex-1", children }),
+        endContent && /* @__PURE__ */ jsx28("span", { className: "ml-auto flex items-center", children: endContent })
       ]
     }
   );
 }
 
-// src/components/Form/Checkbox/Checkbox.tsx
-import {
-  Checkbox as AriaCheckbox
-} from "react-aria-components";
-import { Check as Check3 } from "lucide-react";
-import { Fragment as Fragment3, jsx as jsx22, jsxs as jsxs13 } from "react/jsx-runtime";
-function stopToggleForInteractive(e) {
-  if (e.target instanceof Element && e.target.closest("a, button, input, select, textarea")) {
-    e.stopPropagation();
-  }
-}
-function Checkbox({ children, className, ...props }) {
-  return /* @__PURE__ */ jsx22(
-    AriaCheckbox,
+// src/components/Menu/MenuCheckboxItem.tsx
+import { MenuItem as AriaMenuItem3 } from "react-aria-components";
+import { Check as Check4 } from "lucide-react";
+import { Fragment as Fragment3, jsx as jsx29, jsxs as jsxs17 } from "react/jsx-runtime";
+function MenuCheckboxItem({
+  id,
+  children,
+  textValue,
+  isDisabled,
+  className
+}) {
+  return /* @__PURE__ */ jsx29(
+    AriaMenuItem3,
     {
-      ...props,
-      className: [
-        "group flex items-center gap-2 text-sm text-foreground cursor-pointer",
-        "disabled:opacity-50 disabled:cursor-default",
+      id,
+      textValue,
+      isDisabled,
+      className: ({ isSelected }) => [
+        "flex items-center gap-2 px-3 py-2 text-sm outline-none cursor-default",
+        "transition-colors",
+        "focus:bg-muted",
+        "hover:bg-muted",
+        "disabled:opacity-50 disabled:pointer-events-none",
+        "text-foreground",
+        isSelected ? "font-medium" : "",
         className
       ].filter(Boolean).join(" "),
-      children: ({ isSelected, isIndeterminate }) => /* @__PURE__ */ jsxs13(Fragment3, { children: [
-        /* @__PURE__ */ jsxs13(
-          "div",
-          {
-            className: [
-              "flex items-center justify-center w-6 h-6 shrink-0",
-              "rounded-sm border transition-colors",
-              "group-focus-visible:ring-2 group-focus-visible:ring-ring group-focus-visible:ring-offset-2",
-              isSelected || isIndeterminate ? "bg-primary border-primary" : "bg-background border-border group-hover:border-border"
-            ].join(" "),
-            children: [
-              isSelected && /* @__PURE__ */ jsx22(Check3, { className: "w-4 h-4 text-primary-foreground", strokeWidth: 3 }),
-              isIndeterminate && /* @__PURE__ */ jsx22("div", { className: "w-3 h-0.5 bg-primary-foreground rounded-full" })
-            ]
-          }
-        ),
-        children && /* @__PURE__ */ jsx22(
-          "span",
-          {
-            onPointerDown: stopToggleForInteractive,
-            onPointerUp: stopToggleForInteractive,
-            onMouseDown: stopToggleForInteractive,
-            onClick: stopToggleForInteractive,
-            children
-          }
-        )
+      children: ({ isSelected }) => /* @__PURE__ */ jsxs17(Fragment3, { children: [
+        /* @__PURE__ */ jsx29("span", { className: "flex items-center justify-center w-4 h-4 shrink-0", children: isSelected && /* @__PURE__ */ jsx29(Check4, { size: 14, className: "text-primary", "aria-hidden": "true" }) }),
+        /* @__PURE__ */ jsx29("span", { className: "flex-1", children })
       ] })
     }
   );
 }
 
-// src/components/Form/Switch/Switch.tsx
+// src/components/Menu/MenuSection.tsx
 import {
-  SwitchField,
-  SwitchButton
+  MenuSection as AriaMenuSection,
+  Header
 } from "react-aria-components";
-import { twMerge as twMerge12 } from "tailwind-merge";
-import { Fragment as Fragment4, jsx as jsx23, jsxs as jsxs14 } from "react/jsx-runtime";
-function Switch({
+import { jsx as jsx30, jsxs as jsxs18 } from "react/jsx-runtime";
+function MenuSection({
+  header,
   children,
-  color = "var(--color-primary)",
-  className,
-  ...props
+  "aria-label": ariaLabel,
+  className
 }) {
-  return /* @__PURE__ */ jsx23(SwitchField, { ...props, children: /* @__PURE__ */ jsx23(SwitchButton, { className: "relative cursor-pointer", children: ({ isSelected, isFocusVisible }) => /* @__PURE__ */ jsxs14(Fragment4, { children: [
-    /* @__PURE__ */ jsx23(
-      "div",
+  return /* @__PURE__ */ jsxs18(AriaMenuSection, { className, "aria-label": ariaLabel, children: [
+    header && /* @__PURE__ */ jsx30(
+      Header,
       {
-        className: twMerge12(
-          `
-                  flex items-center
-                  border-2 border-border
-                  w-9 h-5 rounded-full transition-colors shrink-0
-                `,
-          isFocusVisible && "ring-2 ring-ring ring-offset-2",
-          !isSelected && "bg-border"
-        ),
-        style: isSelected ? { backgroundColor: color } : void 0,
-        children: /* @__PURE__ */ jsx23(
-          "div",
-          {
-            className: twMerge12(
-              `
-                    absolute top-0 left-0 w-5 h-5
-                    rounded-full
-                    transition-transform
-                    border-2 border-border
-                    
-                  `,
-              isSelected ? "translate-x-4 bg-card" : "translate-x-0 bg-background"
-            )
-          }
-        )
+        className: [
+          "px-3 py-1.5",
+          "text-xs font-semibold",
+          "text-muted-foreground",
+          "uppercase tracking-wider",
+          "select-none"
+        ].join(" "),
+        children: header
       }
     ),
-    children && /* @__PURE__ */ jsx23("span", { children })
-  ] }) }) });
+    children
+  ] });
 }
 
-// src/components/Form/Radio/Radio.tsx
-import {
-  RadioGroup as AriaRadioGroup,
-  Radio as AriaRadio
-} from "react-aria-components";
-import { twMerge as twMerge13 } from "tailwind-merge";
-import { Fragment as Fragment5, jsx as jsx24, jsxs as jsxs15 } from "react/jsx-runtime";
-function RadioGroup({
-  children,
-  className,
-  orientation = "vertical",
-  ...props
-}) {
-  return /* @__PURE__ */ jsx24(
-    AriaRadioGroup,
+// src/components/Menu/MenuHeader.tsx
+import { Header as Header2 } from "react-aria-components";
+import { jsx as jsx31 } from "react/jsx-runtime";
+function MenuHeader({ children, className }) {
+  return /* @__PURE__ */ jsx31(Header2, { className, children });
+}
+
+// src/components/Menu/MenuSeparator.tsx
+import { Separator } from "react-aria-components";
+import { jsx as jsx32 } from "react/jsx-runtime";
+function MenuSeparator({ className }) {
+  return /* @__PURE__ */ jsx32(
+    Separator,
     {
-      ...props,
-      orientation,
-      className: twMerge13(
-        "flex gap-2 disabled:opacity-50",
-        orientation === "horizontal" ? "flex-row" : "flex-col",
+      className: [
+        "border-t border-border my-1",
         className
-      ),
-      children
+      ].filter(Boolean).join(" ")
     }
   );
 }
-function Radio({ children, className, ...props }) {
-  return /* @__PURE__ */ jsx24(
-    AriaRadio,
+
+// src/components/Table/TableMenu.tsx
+import { Fragment as Fragment4, jsx as jsx33, jsxs as jsxs19 } from "react/jsx-runtime";
+function TableMenu({
+  toggleableColumns,
+  columnVisibility,
+  toggleColumn,
+  tableId
+}) {
+  const store = useTableStore(tableId);
+  const selectedKeys = new Set(
+    toggleableColumns.filter((col) => columnVisibility[col.id] !== false).map((col) => col.id)
+  );
+  function handleSelectionChange(keys) {
+    const newKeys = keys === "all" ? new Set(toggleableColumns.map((c) => c.id)) : keys;
+    for (const col of toggleableColumns) {
+      const wasSelected = columnVisibility[col.id] !== false;
+      const isNowSelected = newKeys.has(col.id);
+      if (wasSelected !== isNowSelected) {
+        toggleColumn(col.id);
+      }
+    }
+  }
+  return /* @__PURE__ */ jsx33(
+    Menu2,
     {
-      ...props,
-      className: [
-        "group flex items-center gap-2 text-sm text-foreground cursor-pointer",
-        "disabled:opacity-50 disabled:cursor-default",
-        className
-      ].filter(Boolean).join(" "),
-      children: ({ isSelected }) => /* @__PURE__ */ jsxs15(Fragment5, { children: [
-        /* @__PURE__ */ jsx24(
-          "div",
-          {
-            className: [
-              "flex items-center justify-center w-5 h-5 shrink-0",
-              "rounded-full border-2 transition-colors",
-              "group-focus-visible:ring-2 group-focus-visible:ring-ring group-focus-visible:ring-offset-2",
-              isSelected ? "border-primary" : "border-border group-hover:border-border"
-            ].join(" "),
-            children: isSelected && /* @__PURE__ */ jsx24("div", { className: "w-2.5 h-2.5 rounded-full bg-primary" })
-          }
-        ),
-        children && /* @__PURE__ */ jsx24("span", { children })
-      ] })
+      selectionMode: "multiple",
+      selectedKeys,
+      onSelectionChange: handleSelectionChange,
+      content: /* @__PURE__ */ jsxs19(Fragment4, { children: [
+        toggleableColumns.map((col) => /* @__PURE__ */ jsx33(MenuCheckboxItem, { id: col.id, children: col.header }, col.id)),
+        /* @__PURE__ */ jsx33(MenuSeparator, {}),
+        /* @__PURE__ */ jsx33(MenuItem, { id: "reset-all", onAction: () => store.getState().reset(), children: "Reset all" })
+      ] }),
+      children: /* @__PURE__ */ jsx33(IconButton, { icon: "Columns3", variant: "ghost", size: "sm", label: "Column settings" })
     }
   );
 }
-function RadioButton({ children, className, ...props }) {
-  return /* @__PURE__ */ jsx24(
-    AriaRadio,
-    {
-      ...props,
-      className: [
-        "group cursor-pointer",
-        "disabled:opacity-50 disabled:cursor-default",
-        className
-      ].filter(Boolean).join(" "),
-      children: ({ isSelected }) => /* @__PURE__ */ jsx24(
-        "div",
-        {
-          className: [
-            "px-4 py-2 text-sm font-medium",
-            "rounded-md border transition-colors text-center",
-            "group-focus-visible:ring-2 group-focus-visible:ring-ring group-focus-visible:ring-offset-2",
-            isSelected ? "bg-primary border-primary text-primary-foreground" : "bg-background border-border text-foreground hover:border-border"
-          ].join(" "),
-          children
+
+// src/components/Table/TableHeaderRow.tsx
+import { jsx as jsx34, jsxs as jsxs20 } from "react/jsx-runtime";
+function TableHeaderRow({
+  headerGroup,
+  columns,
+  tableId,
+  toggleableColumns,
+  columnVisibility,
+  toggleColumn,
+  enableRowSelection,
+  hasFilters,
+  onClearAllFilters,
+  showFilters
+}) {
+  return /* @__PURE__ */ jsx34("tr", { className: "w-full block", children: headerGroup.headers.map((header) => {
+    const columnConfig = columns.find((col) => col.id === header.id);
+    const isIndexColumn = header.id === "index";
+    const isSorted = header.column.getIsSorted();
+    const baseClass = "relative pl-4 pr-4 group/header text-sm align-top";
+    const indexClass = "text-right tabular-nums text-center p-1 px-2";
+    const alignClasses2 = {
+      left: "text-left",
+      right: "text-right",
+      center: "text-center"
+    };
+    const alignClass = alignClasses2[columnConfig?.align ?? "left"];
+    const cxTh = twMerge16(baseClass, isIndexColumn ? indexClass : alignClass);
+    const style = {
+      width: header.getSize(),
+      minWidth: header.getSize(),
+      maxWidth: header.getSize()
+    };
+    const isRight = columnConfig?.align === "right";
+    const tableHeadCx = `
+          flex items-center justify-between gap-1 h-8 text-left
+          text-sm font-medium text-foreground
+        `;
+    const tableHeadToggleCx = `
+          cursor-pointer
+          hover:text-muted-foreground
+          focus-visible:outline-none
+          focus-visible:ring-2
+          focus-visible:ring-ring
+          focus-visible:ring-offset-1
+          rounded-sm
+        `;
+    return /* @__PURE__ */ jsxs20(
+      "th",
+      {
+        className: cxTh,
+        style,
+        "aria-sort": isSorted === "asc" ? "ascending" : isSorted === "desc" ? "descending" : void 0,
+        children: [
+          isIndexColumn ? /* @__PURE__ */ jsxs20("div", { className: "flex flex-col gap-2", children: [
+            /* @__PURE__ */ jsxs20("div", { className: "flex items-center gap-1", children: [
+              enableRowSelection && /* @__PURE__ */ jsx34(
+                Checkbox,
+                {
+                  isSelected: header.getContext().table.getIsAllRowsSelected(),
+                  isIndeterminate: header.getContext().table.getIsSomeRowsSelected() && !header.getContext().table.getIsAllRowsSelected(),
+                  onChange: () => header.getContext().table.toggleAllRowsSelected()
+                }
+              ),
+              /* @__PURE__ */ jsx34(
+                TableMenu,
+                {
+                  toggleableColumns,
+                  columnVisibility,
+                  toggleColumn,
+                  tableId
+                }
+              )
+            ] }),
+            hasFilters && /* @__PURE__ */ jsx34(
+              IconButton,
+              {
+                icon: "FilterX",
+                size: "sm",
+                variant: "secondary",
+                onPress: onClearAllFilters,
+                label: "Clear all filters"
+              }
+            )
+          ] }) : /* @__PURE__ */ jsxs20("div", { className: "flex flex-col gap-2 pb-2", children: [
+            header.column.getCanSort() ? (
+              // Sortable Header
+              /* @__PURE__ */ jsxs20(
+                "button",
+                {
+                  type: "button",
+                  className: twMerge16(
+                    tableHeadCx,
+                    tableHeadToggleCx,
+                    isRight && "flex-row-reverse",
+                    isSorted && "text-foreground"
+                  ),
+                  onClick: header.column.getToggleSortingHandler() ?? void 0,
+                  children: [
+                    /* @__PURE__ */ jsx34("div", { className: "min-w-0", children: /* @__PURE__ */ jsx34(TruncatedText, { children: flexRender2(header.column.columnDef.header, header.getContext()) }) }),
+                    /* @__PURE__ */ jsx34(ColumnSortButton, { header })
+                  ]
+                }
+              )
+            ) : (
+              // Non-Sortable Header
+              /* @__PURE__ */ jsx34("div", { className: tableHeadCx, children: /* @__PURE__ */ jsx34("div", { className: "min-w-0", children: /* @__PURE__ */ jsx34(TruncatedText, { children: flexRender2(header.column.columnDef.header, header.getContext()) }) }) })
+            ),
+            showFilters && header.column.getCanFilter() && columnConfig?.enableColumnFilter && /* @__PURE__ */ jsx34(
+              ColumnFilterInput,
+              {
+                column: header.column,
+                filterType: columnConfig.filterType ?? "text",
+                filterPlaceholder: columnConfig.filterPlaceholder,
+                filterOptions: columnConfig.filterOptions,
+                filterRender: columnConfig.filterRender
+              }
+            )
+          ] }),
+          !isIndexColumn && header.column.getCanResize() && /* @__PURE__ */ jsx34(ColumnResizeHandle, { header })
+        ]
+      },
+      header.id
+    );
+  }) }, headerGroup.id);
+}
+
+// src/components/Table/useColumnVisibility.ts
+import { useCallback as useCallback5, useMemo as useMemo2 } from "react";
+import { useStore as useStore2 } from "zustand";
+function useColumnVisibility(columns, tableId) {
+  const store = useTableStore(tableId);
+  const storedVisibility = useStore2(store, (s) => s.columnVisibility);
+  const setVisibilityStore = useStore2(store, (s) => s.setColumnVisibility);
+  const columnVisibility = useMemo2(() => {
+    const vis = {};
+    columns.forEach((col) => {
+      if (col.anchor) {
+        vis[col.id] = true;
+      } else {
+        vis[col.id] = storedVisibility[col.id] ?? col.defaultVisible !== false;
+      }
+    });
+    return vis;
+  }, [columns, storedVisibility]);
+  const setColumnVisibility = useCallback5(
+    (updaterOrValue) => {
+      const current = store.getState().columnVisibility;
+      const currentFull = {};
+      columns.forEach((col) => {
+        currentFull[col.id] = current[col.id] ?? col.defaultVisible !== false;
+      });
+      const next = typeof updaterOrValue === "function" ? updaterOrValue(currentFull) : updaterOrValue;
+      columns.forEach((col) => {
+        if (col.anchor) next[col.id] = true;
+      });
+      setVisibilityStore(next);
+    },
+    [store, columns, setVisibilityStore]
+  );
+  const toggleableColumns = useMemo2(() => columns.filter((col) => !col.anchor), [columns]);
+  const toggleColumn = useCallback5(
+    (columnId) => {
+      setColumnVisibility((prev) => ({
+        ...prev,
+        [columnId]: !prev[columnId]
+      }));
+    },
+    [setColumnVisibility]
+  );
+  return {
+    columnVisibility,
+    setColumnVisibility,
+    toggleableColumns,
+    toggleColumn
+  };
+}
+
+// src/components/Table/useColumnWidths.ts
+import { useCallback as useCallback6, useMemo as useMemo3 } from "react";
+import { useStore as useStore3 } from "zustand";
+function useColumnWidths(columns, tableId) {
+  const store = useTableStore(tableId);
+  const columnWidths = useStore3(store, (state) => state.columnWidths);
+  const setColumnWidth = useStore3(store, (state) => state.setColumnWidth);
+  const reset = useStore3(store, (state) => state.reset);
+  const columnSizing = useMemo3(() => {
+    const sizing = { index: 48 };
+    columns.forEach((col) => {
+      sizing[col.id] = columnWidths[col.id] ?? col.size;
+    });
+    return sizing;
+  }, [columns, columnWidths]);
+  const setColumnSizing = useCallback6(
+    (updaterOrValue) => {
+      const currentWidths = store.getState().columnWidths;
+      const currentSizing = { index: 48 };
+      columns.forEach((col) => {
+        currentSizing[col.id] = currentWidths[col.id] ?? col.size;
+      });
+      const next = typeof updaterOrValue === "function" ? updaterOrValue(currentSizing) : updaterOrValue;
+      Object.entries(next).forEach(([columnId, width]) => {
+        if (columnId !== "index" && currentSizing[columnId] !== width) {
+          setColumnWidth(columnId, width);
         }
-      )
+      });
+    },
+    [store, columns, setColumnWidth]
+  );
+  const resetWidths = useCallback6(() => {
+    reset();
+  }, [reset]);
+  return { columnSizing, setColumnSizing, resetWidths };
+}
+
+// src/components/Table/useTableSorting.ts
+import { useCallback as useCallback7 } from "react";
+import { useStore as useStore4 } from "zustand";
+function useTableSorting(tableId, defaultSorting = []) {
+  const store = useTableStore(tableId);
+  const storedSorting = useStore4(store, (state) => state.sorting);
+  const setSortingStore = useStore4(store, (state) => state.setSorting);
+  const sorting = storedSorting.length > 0 ? storedSorting : defaultSorting;
+  const setSorting = useCallback7(
+    (updaterOrValue) => {
+      const currentSorting = store.getState().sorting;
+      const current = currentSorting.length > 0 ? currentSorting : defaultSorting;
+      const next = typeof updaterOrValue === "function" ? updaterOrValue(current) : updaterOrValue;
+      setSortingStore(next);
+    },
+    [store, setSortingStore, defaultSorting]
+  );
+  return { sorting, setSorting };
+}
+
+// src/components/Table/Table.tsx
+import { Fragment as Fragment5, jsx as jsx35, jsxs as jsxs21 } from "react/jsx-runtime";
+function booleanSortingFn(rowA, rowB, columnId) {
+  const a = rowA.getValue(columnId) ? 1 : 0;
+  const b = rowB.getValue(columnId) ? 1 : 0;
+  return a - b;
+}
+function Table2({
+  columns,
+  data,
+  cellRenderers = {},
+  tableId = "default",
+  ariaLabel,
+  enableRowSelection,
+  rowSelection,
+  onRowSelectionChange,
+  getRowId,
+  showFilters = true,
+  defaultSorting
+}) {
+  const { columnSizing, setColumnSizing } = useColumnWidths(columns, tableId);
+  const anchorColumnId = columns.find((c) => c.anchor)?.id ?? columns[0]?.id;
+  const effectiveDefaultSorting = useMemo4(
+    () => defaultSorting ?? (anchorColumnId ? [{ id: anchorColumnId, desc: false }] : []),
+    [defaultSorting, anchorColumnId]
+  );
+  const { sorting, setSorting } = useTableSorting(tableId, effectiveDefaultSorting);
+  const { columnVisibility, setColumnVisibility, toggleableColumns, toggleColumn } = useColumnVisibility(columns, tableId);
+  const { columnFilters, setColumnFilters, resetFilters } = useColumnFilters({
+    tableId
+  });
+  const indexColumnSize = enableRowSelection ? 80 : 48;
+  const columnDefs = useMemo4(() => {
+    const indexColumn = {
+      id: "index",
+      header: "",
+      cell: (info) => info.row.index + 1,
+      enableResizing: false,
+      enableSorting: false,
+      enableColumnFilter: false,
+      size: indexColumnSize,
+      minSize: indexColumnSize,
+      maxSize: indexColumnSize
+    };
+    const dataColumns = columns.map((colConfig) => {
+      const renderer = cellRenderers[colConfig.id];
+      return {
+        id: colConfig.id,
+        accessorKey: colConfig.id,
+        header: colConfig.header,
+        cell: renderer ? (info) => renderer(info.row.original) : (info) => info.getValue(),
+        enableResizing: colConfig.enableResizing !== false,
+        enableSorting: colConfig.enableSorting ?? false,
+        enableColumnFilter: colConfig.enableColumnFilter ?? false,
+        ...colConfig.filterFn && { filterFn: colConfig.filterFn },
+        sortingFn: colConfig.sortingFn === "boolean" ? booleanSortingFn : colConfig.sortingFn ?? "alphanumeric",
+        size: colConfig.size ?? 150,
+        minSize: colConfig.minSize ?? 48,
+        maxSize: colConfig.maxSize ?? Number.MAX_SAFE_INTEGER
+      };
+    });
+    return [indexColumn, ...dataColumns];
+  }, [columns, cellRenderers, indexColumnSize]);
+  const table = useReactTable({
+    data,
+    columns: columnDefs,
+    getCoreRowModel: getCoreRowModel(),
+    getSortedRowModel: getSortedRowModel(),
+    getFilteredRowModel: getFilteredRowModel(),
+    getFacetedUniqueValues: getFacetedUniqueValues(),
+    enableSortingRemoval: false,
+    enableColumnResizing: true,
+    columnResizeMode: "onChange",
+    enableRowSelection: !!enableRowSelection,
+    state: {
+      columnSizing,
+      sorting,
+      columnVisibility,
+      columnFilters,
+      ...enableRowSelection && { rowSelection }
+    },
+    onColumnSizingChange: setColumnSizing,
+    onSortingChange: setSorting,
+    onColumnVisibilityChange: setColumnVisibility,
+    onColumnFiltersChange: setColumnFilters,
+    ...enableRowSelection && {
+      onRowSelectionChange,
+      getRowId
+    }
+  });
+  const headerRef = useRef5(null);
+  const bodyRef = useRef5(null);
+  const isSyncing = useRef5(false);
+  const handleHeaderScroll = useCallback8(() => {
+    if (isSyncing.current) return;
+    isSyncing.current = true;
+    if (headerRef.current && bodyRef.current) {
+      bodyRef.current.scrollLeft = headerRef.current.scrollLeft;
+    }
+    requestAnimationFrame(() => {
+      isSyncing.current = false;
+    });
+  }, []);
+  const handleBodyScroll = useCallback8(() => {
+    if (isSyncing.current) return;
+    isSyncing.current = true;
+    if (bodyRef.current && headerRef.current) {
+      headerRef.current.scrollLeft = bodyRef.current.scrollLeft;
+    }
+    requestAnimationFrame(() => {
+      isSyncing.current = false;
+    });
+  }, []);
+  const filteredCount = table.getRowModel().rows.length;
+  const totalCount = data.length;
+  const isFiltered = filteredCount !== totalCount;
+  return /* @__PURE__ */ jsxs21(Fragment5, { children: [
+    /* @__PURE__ */ jsx35("div", { className: "sr-only", "aria-live": "polite", "aria-atomic": "true", children: isFiltered ? `Showing ${filteredCount} of ${totalCount} rows` : "" }),
+    /* @__PURE__ */ jsx35(
+      "div",
+      {
+        ref: headerRef,
+        className: "sticky top-0 z-10 bg-white border-b border-border overflow-x-auto",
+        style: { scrollbarWidth: "none" },
+        onScroll: handleHeaderScroll,
+        children: /* @__PURE__ */ jsx35("table", { className: "min-w-full", "aria-label": ariaLabel, children: /* @__PURE__ */ jsx35("thead", { className: "w-full", children: table.getHeaderGroups().map((headerGroup) => /* @__PURE__ */ jsx35(
+          TableHeaderRow,
+          {
+            headerGroup,
+            columns,
+            tableId,
+            toggleableColumns,
+            columnVisibility,
+            toggleColumn,
+            enableRowSelection: !!enableRowSelection,
+            hasFilters: columnFilters.length > 0,
+            onClearAllFilters: resetFilters,
+            showFilters
+          },
+          headerGroup.id
+        )) }) })
+      }
+    ),
+    /* @__PURE__ */ jsx35("div", { ref: bodyRef, className: "overflow-x-auto", onScroll: handleBodyScroll, children: /* @__PURE__ */ jsx35("table", { className: "min-w-full", "aria-hidden": "true", children: /* @__PURE__ */ jsx35("tbody", { children: data.length === 0 ? /* @__PURE__ */ jsx35("tr", { children: /* @__PURE__ */ jsx35("td", { colSpan: columns.length + 1, children: /* @__PURE__ */ jsx35(EmptyState, { icon: "Inbox", title: "No results" }) }) }) : table.getRowModel().rows.length === 0 ? /* @__PURE__ */ jsx35("tr", { children: /* @__PURE__ */ jsx35("td", { colSpan: columns.length + 1, children: /* @__PURE__ */ jsx35(NoFilterResults, { tableId }) }) }) : table.getRowModel().rows.map((row, index) => /* @__PURE__ */ jsx35(
+      TableBodyRow,
+      {
+        row,
+        rowIndex: index,
+        columns,
+        enableRowSelection: !!enableRowSelection
+      },
+      row.id
+    )) }) }) })
+  ] });
+}
+
+// src/components/Table/SelectionFooter.tsx
+import { jsx as jsx36, jsxs as jsxs22 } from "react/jsx-runtime";
+function SelectionFooter({
+  selectedCount,
+  totalCount,
+  onReset,
+  children
+}) {
+  return /* @__PURE__ */ jsx36(
+    "div",
+    {
+      role: "toolbar",
+      "aria-label": `Bulk actions for ${selectedCount} selected items`,
+      className: "sticky bottom-0 z-20 border-t border-border bg-background/95 backdrop-blur px-6 py-3",
+      children: /* @__PURE__ */ jsxs22("div", { className: "container mx-auto flex items-center justify-between", children: [
+        /* @__PURE__ */ jsxs22("div", { className: "flex items-center gap-3", children: [
+          /* @__PURE__ */ jsxs22("span", { className: "text-sm text-muted-foreground", children: [
+            /* @__PURE__ */ jsx36("span", { className: "font-medium text-foreground", children: selectedCount }),
+            " of ",
+            totalCount,
+            " ",
+            "selected"
+          ] }),
+          /* @__PURE__ */ jsx36(Button, { variant: "secondary", size: "sm", onPress: onReset, children: "Clear selection" })
+        ] }),
+        children && /* @__PURE__ */ jsx36("div", { className: "flex items-center gap-2", children })
+      ] })
     }
   );
 }
 
-// src/components/Form/Slider/Slider.tsx
+// src/components/Dialog/Dialog.tsx
 import {
-  Slider as AriaSlider,
-  SliderTrack,
-  SliderFill,
-  SliderThumb
+  Modal,
+  ModalOverlay,
+  Dialog as AriaDialog,
+  Heading as Heading3
 } from "react-aria-components";
-import { twMerge as twMerge14 } from "tailwind-merge";
-import { Fragment as Fragment6, jsx as jsx25, jsxs as jsxs16 } from "react/jsx-runtime";
-function Slider({
-  label,
-  output,
-  description,
-  errorMessage,
+import { X as X2 } from "lucide-react";
+import { Fragment as Fragment6, jsx as jsx37, jsxs as jsxs23 } from "react/jsx-runtime";
+var sizeStyles4 = {
+  sm: "max-w-md",
+  md: "max-w-lg",
+  lg: "max-w-2xl",
+  xl: "max-w-4xl"
+};
+function Dialog({
+  isOpen,
+  onOpenChange,
+  title,
+  size = "md",
+  isDismissable = true,
   children,
-  className,
-  isDisabled,
-  ...props
+  className
 }) {
-  return /* @__PURE__ */ jsx25(
-    AriaSlider,
+  return /* @__PURE__ */ jsx37(
+    ModalOverlay,
     {
-      ...props,
-      isDisabled,
-      className: twMerge14(
-        // data-disabled lands on the root (tailwindcss-react-aria-components
-        // maps the disabled: variant onto it).
-        "w-full flex flex-col gap-2 disabled:opacity-50 disabled:cursor-default",
-        className
-      ),
-      children: ({ state }) => /* @__PURE__ */ jsxs16(Fragment6, { children: [
-        /* @__PURE__ */ jsxs16("div", { className: "flex items-center justify-between", children: [
-          label && /* @__PURE__ */ jsx25(Label, { children: label }),
-          output && /* @__PURE__ */ jsx25("span", { className: "text-sm font-medium text-foreground tabular-nums", children: output(state.values[0]) })
-        ] }),
-        /* @__PURE__ */ jsxs16(SliderTrack, { className: "flex h-6 w-full cursor-pointer items-center", children: [
-          /* @__PURE__ */ jsx25("div", { className: "relative h-1.5 w-full overflow-hidden rounded-full bg-border", children: /* @__PURE__ */ jsx25(SliderFill, { className: "h-full rounded-full bg-primary" }) }),
-          /* @__PURE__ */ jsx25(
-            SliderThumb,
-            {
-              className: twMerge14(
-                "top-1/2 h-4 w-4 rounded-full bg-background",
-                "border-2 border-primary",
-                "shadow-sm",
-                "transition-[box-shadow,border-color]",
-                "hovered:border-primary-hover",
-                "dragging:cursor-grabbing",
-                "focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2"
+      isOpen,
+      onOpenChange,
+      isDismissable,
+      className: [
+        "fixed inset-0 z-50 bg-backdrop backdrop-blur-sm",
+        "flex items-center justify-center",
+        "entering:animate-in entering:fade-in",
+        "exiting:animate-out exiting:fade-out"
+      ].join(" "),
+      children: /* @__PURE__ */ jsx37(
+        Modal,
+        {
+          className: [
+            "w-full mx-4",
+            sizeStyles4[size],
+            "bg-background rounded-lg shadow-xl max-h-[85vh] flex flex-col",
+            "entering:animate-in entering:zoom-in-95 entering:fade-in",
+            "exiting:animate-out exiting:zoom-out-95 exiting:fade-out",
+            className
+          ].filter(Boolean).join(" "),
+          children: /* @__PURE__ */ jsx37(AriaDialog, { className: "outline-none flex flex-col max-h-[85vh]", children: ({ close }) => /* @__PURE__ */ jsxs23(Fragment6, { children: [
+            /* @__PURE__ */ jsxs23("div", { className: "flex items-center justify-between px-6 py-4 border-b border-border", children: [
+              /* @__PURE__ */ jsx37(
+                Heading3,
+                {
+                  slot: "title",
+                  className: "text-lg font-semibold text-foreground",
+                  children: title
+                }
+              ),
+              /* @__PURE__ */ jsx37(
+                "button",
+                {
+                  type: "button",
+                  onClick: close,
+                  className: [
+                    "inline-flex items-center justify-center rounded-sm p-1",
+                    "text-muted-foreground hover:text-foreground hover:bg-muted",
+                    "outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2",
+                    "transition-colors"
+                  ].join(" "),
+                  "aria-label": "Close",
+                  children: /* @__PURE__ */ jsx37(X2, { size: 20, "aria-hidden": "true" })
+                }
               )
-            }
-          )
-        ] }),
-        (description || errorMessage) && /* @__PURE__ */ jsx25(
-          "p",
-          {
-            className: twMerge14(
-              "text-xs text-muted-foreground",
-              errorMessage && "text-destructive"
-            ),
-            children: errorMessage ?? description
-          }
-        ),
-        children
-      ] })
+            ] }),
+            /* @__PURE__ */ jsx37("div", { className: "px-6 py-4 overflow-y-auto", children })
+          ] }) })
+        }
+      )
     }
   );
 }
 
-// src/components/Form/Fieldset/Fieldset.tsx
-import { jsx as jsx26, jsxs as jsxs17 } from "react/jsx-runtime";
-function Fieldset({ legend, children, className }) {
-  return /* @__PURE__ */ jsxs17(
-    "fieldset",
+// src/components/Dialog/DialogFooter.tsx
+import { jsx as jsx38 } from "react/jsx-runtime";
+
+// src/components/Toast/Toast.tsx
+import {
+  createContext,
+  useCallback as useCallback9,
+  useContext,
+  useEffect as useEffect3,
+  useRef as useRef6,
+  useState as useState7
+} from "react";
+import { createPortal as createPortal2 } from "react-dom";
+import { CheckCircle as CheckCircle3, XCircle as XCircle2, Info as Info2, X as X3 } from "lucide-react";
+import { jsx as jsx39, jsxs as jsxs24 } from "react/jsx-runtime";
+var ToastContext = createContext(null);
+var toastCounter = 0;
+var defaultDuration = {
+  success: 5e3,
+  info: 5e3,
+  error: 1e4
+};
+var variantConfig = {
+  success: {
+    icon: CheckCircle3,
+    containerClass: "bg-success-surface border-success-border text-success",
+    iconClass: "text-success"
+  },
+  error: {
+    icon: XCircle2,
+    containerClass: "bg-destructive-surface border-destructive-border text-destructive",
+    iconClass: "text-destructive"
+  },
+  info: {
+    icon: Info2,
+    containerClass: "bg-info-surface border-info-border text-info",
+    iconClass: "text-info"
+  }
+};
+var PlacementContext = createContext("bottom-right");
+var exitAnimationByPlacement = {
+  "top-center": "-translate-y-full opacity-0",
+  "top-right": "translate-x-full opacity-0",
+  "bottom-center": "translate-y-full opacity-0",
+  "bottom-right": "translate-x-full opacity-0"
+};
+var enterAnimationByPlacement = {
+  "top-center": "translate-y-0 opacity-100 animate-in slide-in-from-top",
+  "top-right": "translate-x-0 opacity-100 animate-in slide-in-from-right",
+  "bottom-center": "translate-y-0 opacity-100 animate-in slide-in-from-bottom",
+  "bottom-right": "translate-x-0 opacity-100 animate-in slide-in-from-right"
+};
+function ToastItem({
+  toast,
+  onRemove
+}) {
+  const [isExiting, setIsExiting] = useState7(false);
+  const timerRef = useRef6(null);
+  const placement = useContext(PlacementContext);
+  const config = variantConfig[toast.variant];
+  const IconComponent = config.icon;
+  const dismiss = useCallback9(() => {
+    setIsExiting(true);
+    setTimeout(() => onRemove(toast.id), 200);
+  }, [onRemove, toast.id]);
+  useEffect3(() => {
+    const duration = toast.duration ?? defaultDuration[toast.variant];
+    timerRef.current = setTimeout(dismiss, duration);
+    return () => {
+      if (timerRef.current) clearTimeout(timerRef.current);
+    };
+  }, [toast.duration, toast.variant, dismiss]);
+  return /* @__PURE__ */ jsxs24(
+    "div",
     {
+      role: "status",
+      "aria-live": "polite",
       className: [
-        "flex flex-col gap-8",
-        "border-none p-0 m-0",
-        className
-      ].filter(Boolean).join(" "),
+        "flex items-start gap-3 rounded-lg border px-4 py-3 shadow-md",
+        "min-w-[320px] max-w-[420px]",
+        "transition-all duration-200",
+        isExiting ? exitAnimationByPlacement[placement] : enterAnimationByPlacement[placement],
+        config.containerClass
+      ].join(" "),
       children: [
-        legend && /* @__PURE__ */ jsx26(
-          "legend",
+        /* @__PURE__ */ jsx39(IconComponent, { size: 20, className: ["shrink-0 mt-0.5", config.iconClass].join(" "), "aria-hidden": "true" }),
+        /* @__PURE__ */ jsx39("p", { className: "flex-1 text-sm font-medium", children: toast.message }),
+        /* @__PURE__ */ jsx39(
+          "button",
           {
-            className: [
-              "text-lg",
-              "font-semibold",
-              "text-foreground",
-              "p-0"
-            ].join(" "),
-            children: legend
+            type: "button",
+            onClick: dismiss,
+            className: "shrink-0 rounded-sm p-0.5 opacity-70 hover:opacity-100 transition-opacity outline-none focus-visible:ring-2 focus-visible:ring-current",
+            "aria-label": "Dismiss",
+            children: /* @__PURE__ */ jsx39(X3, { size: 16, "aria-hidden": "true" })
           }
-        ),
-        children
+        )
       ]
     }
   );
 }
+var containerPositionStyles = {
+  "top-center": "fixed top-4 left-1/2 -translate-x-1/2 z-50 flex flex-col-reverse gap-2 items-center",
+  "top-right": "fixed top-4 right-4 z-50 flex flex-col-reverse gap-2",
+  "bottom-center": "fixed bottom-4 left-1/2 -translate-x-1/2 z-50 flex flex-col gap-2 items-center",
+  "bottom-right": "fixed bottom-4 right-4 z-50 flex flex-col gap-2"
+};
+function ToastContainer({
+  toasts,
+  removeToast,
+  placement = "bottom-right"
+}) {
+  if (toasts.length === 0) return null;
+  return createPortal2(
+    /* @__PURE__ */ jsx39(PlacementContext.Provider, { value: placement, children: /* @__PURE__ */ jsx39("div", { className: containerPositionStyles[placement], children: toasts.map((toast) => /* @__PURE__ */ jsx39(ToastItem, { toast, onRemove: removeToast }, toast.id)) }) }),
+    document.body
+  );
+}
+function createToastBridge() {
+  const listeners = /* @__PURE__ */ new Set();
+  return {
+    emit: (toast) => {
+      listeners.forEach((fn) => fn(toast));
+    },
+    subscribe: (fn) => {
+      listeners.add(fn);
+      return () => {
+        listeners.delete(fn);
+      };
+    }
+  };
+}
+function ToastProvider({ children, bridge, placement = "bottom-right" }) {
+  const [toasts, setToasts] = useState7([]);
+  const addToast = useCallback9((toast) => {
+    const id = `toast-${++toastCounter}`;
+    setToasts((prev) => [...prev, { ...toast, id }]);
+  }, []);
+  const removeToast = useCallback9((id) => {
+    setToasts((prev) => prev.filter((t) => t.id !== id));
+  }, []);
+  useEffect3(() => {
+    if (!bridge) return;
+    return bridge.subscribe(addToast);
+  }, [bridge, addToast]);
+  return /* @__PURE__ */ jsxs24(ToastContext.Provider, { value: { toasts, addToast, removeToast }, children: [
+    children,
+    /* @__PURE__ */ jsx39(ToastContainer, { toasts, removeToast, placement })
+  ] });
+}
+function useToast() {
+  const context = useContext(ToastContext);
+  if (!context) {
+    throw new Error("useToast must be used within a ToastProvider");
+  }
+  return {
+    toast: context.addToast,
+    toasts: context.toasts,
+    removeToast: context.removeToast
+  };
+}
 
-// src/components/Link/Link.tsx
+// src/components/Form/Switch/Switch.tsx
 import {
-  Link as AriaLink3
+  SwitchField,
+  SwitchButton
 } from "react-aria-components";
-import { jsx as jsx27 } from "react/jsx-runtime";
-var variantStyles2 = {
-  default: [
-    "text-teal-700 underline",
-    "hover:text-teal-800"
-  ].join(" "),
-  subtle: [
-    "text-muted-foreground no-underline",
-    "hover:underline hover:text-foreground"
-  ].join(" ")
-};
-function Link({
-  variant = "default",
+import { twMerge as twMerge17 } from "tailwind-merge";
+import { Fragment as Fragment7, jsx as jsx40, jsxs as jsxs25 } from "react/jsx-runtime";
+function Switch({
+  children,
+  color = "var(--color-primary)",
   className,
   ...props
 }) {
-  return /* @__PURE__ */ jsx27(
-    AriaLink3,
-    {
-      ...props,
-      className: [
-        "outline-none transition-colors",
-        "focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:rounded-sm",
-        variantStyles2[variant],
-        className
-      ].filter(Boolean).join(" ")
-    }
-  );
-}
-
-// src/components/Breadcrumbs/Breadcrumbs.tsx
-import {
-  Breadcrumbs as AriaBreadcrumbs,
-  Breadcrumb as AriaBreadcrumb,
-  Link as Link2
-} from "react-aria-components";
-import { ChevronRight as ChevronRight2 } from "lucide-react";
-import { Fragment as Fragment7, jsx as jsx28, jsxs as jsxs18 } from "react/jsx-runtime";
-function Breadcrumbs({ items, className }) {
-  return /* @__PURE__ */ jsx28(
-    "nav",
-    {
-      "aria-label": "Breadcrumb",
-      className,
-      children: /* @__PURE__ */ jsx28(
-        AriaBreadcrumbs,
-        {
-          className: "flex items-center gap-1 text-sm min-w-0",
-          children: items.map((item, index) => {
-            const isLast = index === items.length - 1;
-            return /* @__PURE__ */ jsx28(
-              AriaBreadcrumb,
-              {
-                id: item.id,
-                className: [
-                  "flex items-center gap-1",
-                  isLast ? "min-w-0" : "shrink-0"
-                ].join(" "),
-                children: isLast ? /* @__PURE__ */ jsx28("span", { className: "font-medium text-foreground truncate", children: item.label }) : /* @__PURE__ */ jsxs18(Fragment7, { children: [
-                  /* @__PURE__ */ jsx28(
-                    Link2,
-                    {
-                      href: item.href,
-                      className: "whitespace-nowrap text-muted-foreground outline-none transition-colors hover:text-foreground focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:rounded-sm",
-                      children: item.label
-                    }
-                  ),
-                  /* @__PURE__ */ jsx28(
-                    ChevronRight2,
-                    {
-                      className: "shrink-0 text-slate-400",
-                      size: 16,
-                      "aria-hidden": "true"
-                    }
-                  )
-                ] })
-              },
-              item.id
-            );
-          })
-        }
-      )
-    }
-  );
+  return /* @__PURE__ */ jsx40(SwitchField, { ...props, children: /* @__PURE__ */ jsx40(SwitchButton, { className: "relative cursor-pointer", children: ({ isSelected, isFocusVisible }) => /* @__PURE__ */ jsxs25(Fragment7, { children: [
+    /* @__PURE__ */ jsx40(
+      "div",
+      {
+        className: twMerge17(
+          `
+                  flex items-center
+                  border-2 border-border
+                  w-9 h-5 rounded-full transition-colors shrink-0
+                `,
+          isFocusVisible && "ring-2 ring-ring ring-offset-2",
+          !isSelected && "bg-border"
+        ),
+        style: isSelected ? { backgroundColor: color } : void 0,
+        children: /* @__PURE__ */ jsx40(
+          "div",
+          {
+            className: twMerge17(
+              `
+                    absolute top-0 left-0 w-5 h-5
+                    rounded-full
+                    transition-transform
+                    border-2 border-border
+                    
+                  `,
+              isSelected ? "translate-x-4 bg-card" : "translate-x-0 bg-background"
+            )
+          }
+        )
+      }
+    ),
+    children && /* @__PURE__ */ jsx40("span", { children })
+  ] }) }) });
 }
 
-// src/components/ToggleButton/ToggleButton.tsx
+// src/components/Form/Radio/Radio.tsx
 import {
-  ToggleButton as AriaToggleButton2
+  RadioGroup as AriaRadioGroup,
+  Radio as AriaRadio
 } from "react-aria-components";
-import { twMerge as twMerge15 } from "tailwind-merge";
-import { jsx as jsx29 } from "react/jsx-runtime";
-var squareSizeStyles2 = {
-  xs: "h-6 w-6 text-xs",
-  sm: "h-7 w-7 text-sm",
-  md: "h-8 w-8 text-base",
-  lg: "h-10 w-10 text-lg"
-};
-var variantStyles3 = {
-  default: {
-    base: [
-      "bg-transparent text-foreground",
-      "hover:bg-accent",
-      "pressed:bg-accent"
-    ].join(" "),
-    selected: "bg-accent text-foreground"
-  },
-  primary: {
-    base: [
-      "bg-transparent text-foreground",
-      "hover:bg-accent",
-      "pressed:bg-accent"
-    ].join(" "),
-    selected: "bg-primary-pressed text-primary-foreground"
-  },
-  outlined: {
-    base: [
-      "bg-background text-foreground",
-      "border border-border",
-      "hover:bg-card",
-      "pressed:bg-muted"
-    ].join(" "),
-    selected: [
-      "bg-slate-800 text-primary-foreground",
-      "border border-slate-800"
-    ].join(" ")
-  }
-};
-function ToggleButton({
-  variant = "default",
-  size = "md",
-  isSquare = false,
+import { twMerge as twMerge18 } from "tailwind-merge";
+import { Fragment as Fragment8, jsx as jsx41, jsxs as jsxs26 } from "react/jsx-runtime";
+function RadioGroup({
+  children,
   className,
+  orientation = "vertical",
   ...props
 }) {
-  const styles = variantStyles3[variant];
-  return /* @__PURE__ */ jsx29(
-    AriaToggleButton2,
+  return /* @__PURE__ */ jsx41(
+    AriaRadioGroup,
     {
       ...props,
-      className: ({ isSelected }) => twMerge15(
-        "inline-flex items-center justify-center gap-2 cursor-pointer",
-        isSquare ? "rounded-none" : "rounded-md",
-        "font-medium",
-        "leading-tight",
-        "outline-none transition-colors",
-        "focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2",
-        "disabled:opacity-50 disabled:pointer-events-none",
-        isSquare ? squareSizeStyles2[size] : sizeStyles[size],
-        isSelected ? styles.selected : styles.base,
+      orientation,
+      className: twMerge18(
+        "flex gap-2 disabled:opacity-50",
+        orientation === "horizontal" ? "flex-row" : "flex-col",
         className
-      )
+      ),
+      children
     }
   );
 }
-
-// src/components/Menu/Menu.tsx
-import {
-  MenuTrigger,
-  Menu as AriaMenu,
-  MenuItem as AriaMenuItem,
-  Popover as Popover2
-} from "react-aria-components";
-import { twMerge as twMerge16 } from "tailwind-merge";
-
-// src/components/Menu/menuStyles.ts
-var popoverStyles = `
-  bg-background rounded-md shadow-lg
-  border border-border
-  py-1 min-w-48
-  entering:animate-in entering:fade-in entering:zoom-in-95
-  exiting:animate-out exiting:fade-out exiting:zoom-out-95
-`;
-
-// src/components/Menu/Menu.tsx
-import { jsx as jsx30, jsxs as jsxs19 } from "react/jsx-runtime";
-function Menu2({
-  items,
-  content,
-  children,
-  onAction,
-  selectionMode,
-  selectedKeys,
-  defaultSelectedKeys,
-  onSelectionChange,
-  className
-}) {
-  const selectionProps = selectionMode && selectionMode !== "none" ? { selectionMode, selectedKeys, defaultSelectedKeys, onSelectionChange } : {};
-  return /* @__PURE__ */ jsxs19(MenuTrigger, { children: [
-    children,
-    /* @__PURE__ */ jsx30(Popover2, { className: twMerge16(popoverStyles, className), children: items ? /* @__PURE__ */ jsx30(
-      AriaMenu,
-      {
-        items,
-        onAction: (key) => {
-          const item = items.find((i) => i.id === key);
-          item?.onAction?.();
-          onAction?.(key);
-        },
-        ...selectionProps,
-        className: "outline-none",
-        children: (item) => /* @__PURE__ */ jsxs19(
-          AriaMenuItem,
-          {
-            id: item.id,
-            href: item.href,
-            target: item.target,
-            isDisabled: item.isDisabled,
-            className: [
-              "flex items-center gap-2 px-3 py-2 text-sm outline-none cursor-default",
-              "transition-colors",
-              "focus:bg-muted",
-              "hover:bg-muted",
-              "disabled:opacity-50 disabled:pointer-events-none",
-              item.isDanger ? "text-destructive" : "text-foreground"
-            ].filter(Boolean).join(" "),
-            children: [
-              item.icon && /* @__PURE__ */ jsx30(Icon, { icon: item.icon, size: "sm" }),
-              /* @__PURE__ */ jsx30("span", { className: "flex-1", children: item.label }),
-              item.endContent && /* @__PURE__ */ jsx30("span", { className: "ml-auto flex items-center", children: item.endContent })
-            ]
+function Radio({ children, className, ...props }) {
+  return /* @__PURE__ */ jsx41(
+    AriaRadio,
+    {
+      ...props,
+      className: [
+        "group flex items-center gap-2 text-sm text-foreground cursor-pointer",
+        "disabled:opacity-50 disabled:cursor-default",
+        className
+      ].filter(Boolean).join(" "),
+      children: ({ isSelected }) => /* @__PURE__ */ jsxs26(Fragment8, { children: [
+        /* @__PURE__ */ jsx41(
+          "div",
+          {
+            className: [
+              "flex items-center justify-center w-5 h-5 shrink-0",
+              "rounded-full border-2 transition-colors",
+              "group-focus-visible:ring-2 group-focus-visible:ring-ring group-focus-visible:ring-offset-2",
+              isSelected ? "border-primary" : "border-border group-hover:border-border"
+            ].join(" "),
+            children: isSelected && /* @__PURE__ */ jsx41("div", { className: "w-2.5 h-2.5 rounded-full bg-primary" })
           }
-        )
-      }
-    ) : /* @__PURE__ */ jsx30(
-      AriaMenu,
-      {
-        onAction: (key) => onAction?.(key),
-        ...selectionProps,
-        className: "outline-none",
-        children: content
-      }
-    ) })
-  ] });
+        ),
+        children && /* @__PURE__ */ jsx41("span", { children })
+      ] })
+    }
+  );
+}
+function RadioButton({ children, className, ...props }) {
+  return /* @__PURE__ */ jsx41(
+    AriaRadio,
+    {
+      ...props,
+      className: [
+        "group cursor-pointer",
+        "disabled:opacity-50 disabled:cursor-default",
+        className
+      ].filter(Boolean).join(" "),
+      children: ({ isSelected }) => /* @__PURE__ */ jsx41(
+        "div",
+        {
+          className: [
+            "px-4 py-2 text-sm font-medium",
+            "rounded-md border transition-colors text-center",
+            "group-focus-visible:ring-2 group-focus-visible:ring-ring group-focus-visible:ring-offset-2",
+            isSelected ? "bg-primary border-primary text-primary-foreground" : "bg-background border-border text-foreground hover:border-border"
+          ].join(" "),
+          children
+        }
+      )
+    }
+  );
 }
 
-// src/components/Menu/useContextMenu.tsx
-import {
-  useCallback as useCallback3,
-  useEffect as useEffect3,
-  useId as useId2,
-  useRef as useRef5,
-  useState as useState7
-} from "react";
+// src/components/Form/Slider/Slider.tsx
 import {
-  Menu as AriaMenu2,
-  MenuTrigger as MenuTrigger2,
-  Popover as Popover3
+  Slider as AriaSlider,
+  SliderTrack,
+  SliderFill,
+  SliderThumb
 } from "react-aria-components";
-import { twMerge as twMerge17 } from "tailwind-merge";
-import { jsx as jsx31, jsxs as jsxs20 } from "react/jsx-runtime";
-function useContextMenu({
-  content,
+import { twMerge as twMerge19 } from "tailwind-merge";
+import { Fragment as Fragment9, jsx as jsx42, jsxs as jsxs27 } from "react/jsx-runtime";
+function Slider({
   label,
-  onAction,
-  className
+  output,
+  description,
+  errorMessage,
+  children,
+  className,
+  isDisabled,
+  ...props
 }) {
-  const popoverId = useId2();
-  const [anchor, setAnchor] = useState7(null);
-  const anchorRef = useRef5(null);
-  const popoverRef = useRef5(null);
-  const isOpen = anchor !== null;
-  const close = useCallback3(() => setAnchor(null), []);
-  const onContextMenu = useCallback3((event) => {
-    event.preventDefault();
-    setAnchor({ x: event.clientX, y: event.clientY });
-  }, []);
-  const onPress = useCallback3((event) => {
-    const rect = event.target.getBoundingClientRect();
-    setAnchor({ x: rect.left, y: rect.bottom });
-  }, []);
-  useEffect3(() => {
-    if (!isOpen) return;
-    const isInside = (target) => popoverRef.current?.contains(target) ?? false;
-    const onPointerDown = (event) => {
-      if (!isInside(event.target)) close();
-    };
-    const onOutsideContextMenu = (event) => {
-      if (isInside(event.target)) return;
-      event.preventDefault();
-      close();
-    };
-    const onKeyDown = (event) => {
-      if (event.key === "Escape") close();
-    };
-    document.addEventListener("pointerdown", onPointerDown, true);
-    document.addEventListener("contextmenu", onOutsideContextMenu, true);
-    document.addEventListener("keydown", onKeyDown, true);
-    return () => {
-      document.removeEventListener("pointerdown", onPointerDown, true);
-      document.removeEventListener("contextmenu", onOutsideContextMenu, true);
-      document.removeEventListener("keydown", onKeyDown, true);
-    };
-  }, [isOpen, close]);
-  const menu = /* @__PURE__ */ jsxs20(
-    MenuTrigger2,
+  return /* @__PURE__ */ jsx42(
+    AriaSlider,
     {
-      isOpen,
-      onOpenChange: (open) => {
-        if (!open) close();
-      },
-      children: [
-        /* @__PURE__ */ jsx31(
-          "span",
+      ...props,
+      isDisabled,
+      className: twMerge19(
+        // data-disabled lands on the root (tailwindcss-react-aria-components
+        // maps the disabled: variant onto it).
+        "w-full flex flex-col gap-2 disabled:opacity-50 disabled:cursor-default",
+        className
+      ),
+      children: ({ state }) => /* @__PURE__ */ jsxs27(Fragment9, { children: [
+        /* @__PURE__ */ jsxs27("div", { className: "flex items-center justify-between", children: [
+          label && /* @__PURE__ */ jsx42(Label, { children: label }),
+          output && /* @__PURE__ */ jsx42("span", { className: "text-sm font-medium text-foreground tabular-nums", children: output(state.values[0]) })
+        ] }),
+        /* @__PURE__ */ jsxs27(SliderTrack, { className: "flex h-6 w-full cursor-pointer items-center", children: [
+          /* @__PURE__ */ jsx42("div", { className: "relative h-1.5 w-full overflow-hidden rounded-full bg-border", children: /* @__PURE__ */ jsx42(SliderFill, { className: "h-full rounded-full bg-primary" }) }),
+          /* @__PURE__ */ jsx42(
+            SliderThumb,
+            {
+              className: twMerge19(
+                "top-1/2 h-4 w-4 rounded-full bg-background",
+                "border-2 border-primary",
+                "shadow-sm",
+                "transition-[box-shadow,border-color]",
+                "hovered:border-primary-hover",
+                "dragging:cursor-grabbing",
+                "focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2"
+              )
+            }
+          )
+        ] }),
+        (description || errorMessage) && /* @__PURE__ */ jsx42(
+          "p",
           {
-            ref: anchorRef,
-            "aria-hidden": true,
-            tabIndex: -1,
-            className: "pointer-events-none fixed h-0 w-0",
-            style: { left: anchor?.x ?? 0, top: anchor?.y ?? 0 }
+            className: twMerge19(
+              "text-xs text-muted-foreground",
+              errorMessage && "text-destructive"
+            ),
+            children: errorMessage ?? description
           }
         ),
-        /* @__PURE__ */ jsx31(
-          Popover3,
-          {
-            isNonModal: true,
-            triggerRef: anchorRef,
-            placement: "bottom start",
-            ref: popoverRef,
-            className: twMerge17(popoverStyles, className),
-            children: /* @__PURE__ */ jsx31(
-              AriaMenu2,
-              {
-                id: popoverId,
-                "aria-label": label,
-                autoFocus: "first",
-                onAction: (key) => {
-                  onAction?.(String(key));
-                  close();
-                },
-                className: "outline-none",
-                children: content
-              }
-            )
-          }
-        )
-      ]
+        children
+      ] })
     }
   );
-  return {
-    targetProps: { onContextMenu },
-    triggerProps: {
-      onPress,
-      onClick: (e) => {
-        e.preventDefault();
-      },
-      "aria-haspopup": "menu",
-      "aria-expanded": isOpen,
-      "aria-controls": isOpen ? popoverId : void 0
-    },
-    menu,
-    isOpen,
-    close
-  };
 }
 
-// src/components/Menu/MenuItem.tsx
-import { MenuItem as AriaMenuItem2 } from "react-aria-components";
-import { jsx as jsx32, jsxs as jsxs21 } from "react/jsx-runtime";
-function MenuItem({
-  id,
-  children,
-  icon,
-  endContent,
-  onAction,
-  href,
-  target,
-  isDisabled,
-  isDanger,
-  textValue,
-  className
-}) {
-  return /* @__PURE__ */ jsxs21(
-    AriaMenuItem2,
+// src/components/Form/Fieldset/Fieldset.tsx
+import { jsx as jsx43, jsxs as jsxs28 } from "react/jsx-runtime";
+function Fieldset({ legend, children, className }) {
+  return /* @__PURE__ */ jsxs28(
+    "fieldset",
     {
-      id,
-      href,
-      target,
-      isDisabled,
-      onAction,
-      textValue,
       className: [
-        "flex items-center gap-2 px-3 py-2 text-sm outline-none cursor-default",
-        "transition-colors",
-        "focus:bg-muted",
-        "hover:bg-muted",
-        "disabled:opacity-50 disabled:pointer-events-none",
-        isDanger ? "text-destructive" : "text-foreground",
+        "flex flex-col gap-8",
+        "border-none p-0 m-0",
         className
       ].filter(Boolean).join(" "),
       children: [
-        icon && /* @__PURE__ */ jsx32(Icon, { icon, size: "sm" }),
-        /* @__PURE__ */ jsx32("span", { className: "flex-1", children }),
-        endContent && /* @__PURE__ */ jsx32("span", { className: "ml-auto flex items-center", children: endContent })
+        legend && /* @__PURE__ */ jsx43(
+          "legend",
+          {
+            className: [
+              "text-lg",
+              "font-semibold",
+              "text-foreground",
+              "p-0"
+            ].join(" "),
+            children: legend
+          }
+        ),
+        children
       ]
     }
   );
 }
 
-// src/components/Menu/MenuCheckboxItem.tsx
-import { MenuItem as AriaMenuItem3 } from "react-aria-components";
-import { Check as Check4 } from "lucide-react";
-import { Fragment as Fragment8, jsx as jsx33, jsxs as jsxs22 } from "react/jsx-runtime";
-function MenuCheckboxItem({
-  id,
-  children,
-  textValue,
-  isDisabled,
-  className
+// src/components/Link/Link.tsx
+import {
+  Link as AriaLink3
+} from "react-aria-components";
+import { jsx as jsx44 } from "react/jsx-runtime";
+var variantStyles2 = {
+  default: [
+    "text-teal-700 underline",
+    "hover:text-teal-800"
+  ].join(" "),
+  subtle: [
+    "text-muted-foreground no-underline",
+    "hover:underline hover:text-foreground"
+  ].join(" ")
+};
+function Link({
+  variant = "default",
+  className,
+  ...props
 }) {
-  return /* @__PURE__ */ jsx33(
-    AriaMenuItem3,
+  return /* @__PURE__ */ jsx44(
+    AriaLink3,
     {
-      id,
-      textValue,
-      isDisabled,
-      className: ({ isSelected }) => [
-        "flex items-center gap-2 px-3 py-2 text-sm outline-none cursor-default",
-        "transition-colors",
-        "focus:bg-muted",
-        "hover:bg-muted",
-        "disabled:opacity-50 disabled:pointer-events-none",
-        "text-foreground",
-        isSelected ? "font-medium" : "",
+      ...props,
+      className: [
+        "outline-none transition-colors",
+        "focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:rounded-sm",
+        variantStyles2[variant],
         className
-      ].filter(Boolean).join(" "),
-      children: ({ isSelected }) => /* @__PURE__ */ jsxs22(Fragment8, { children: [
-        /* @__PURE__ */ jsx33("span", { className: "flex items-center justify-center w-4 h-4 shrink-0", children: isSelected && /* @__PURE__ */ jsx33(Check4, { size: 14, className: "text-primary", "aria-hidden": "true" }) }),
-        /* @__PURE__ */ jsx33("span", { className: "flex-1", children })
-      ] })
+      ].filter(Boolean).join(" ")
     }
   );
 }
 
-// src/components/Menu/MenuSection.tsx
+// src/components/Breadcrumbs/Breadcrumbs.tsx
 import {
-  MenuSection as AriaMenuSection,
-  Header
+  Breadcrumbs as AriaBreadcrumbs,
+  Breadcrumb as AriaBreadcrumb,
+  Link as Link2
 } from "react-aria-components";
-import { jsx as jsx34, jsxs as jsxs23 } from "react/jsx-runtime";
-function MenuSection({
-  header,
-  children,
-  "aria-label": ariaLabel,
-  className
-}) {
-  return /* @__PURE__ */ jsxs23(AriaMenuSection, { className, "aria-label": ariaLabel, children: [
-    header && /* @__PURE__ */ jsx34(
-      Header,
-      {
-        className: [
-          "px-3 py-1.5",
-          "text-xs font-semibold",
-          "text-muted-foreground",
-          "uppercase tracking-wider",
-          "select-none"
-        ].join(" "),
-        children: header
-      }
-    ),
-    children
-  ] });
-}
-
-// src/components/Menu/MenuHeader.tsx
-import { Header as Header2 } from "react-aria-components";
-import { jsx as jsx35 } from "react/jsx-runtime";
-function MenuHeader({ children, className }) {
-  return /* @__PURE__ */ jsx35(Header2, { className, children });
+import { ChevronRight as ChevronRight2 } from "lucide-react";
+import { Fragment as Fragment10, jsx as jsx45, jsxs as jsxs29 } from "react/jsx-runtime";
+function Breadcrumbs({ items, className }) {
+  return /* @__PURE__ */ jsx45(
+    "nav",
+    {
+      "aria-label": "Breadcrumb",
+      className,
+      children: /* @__PURE__ */ jsx45(
+        AriaBreadcrumbs,
+        {
+          className: "flex items-center gap-1 text-sm min-w-0",
+          children: items.map((item, index) => {
+            const isLast = index === items.length - 1;
+            return /* @__PURE__ */ jsx45(
+              AriaBreadcrumb,
+              {
+                id: item.id,
+                className: [
+                  "flex items-center gap-1",
+                  isLast ? "min-w-0" : "shrink-0"
+                ].join(" "),
+                children: isLast ? /* @__PURE__ */ jsx45("span", { className: "font-medium text-foreground truncate", children: item.label }) : /* @__PURE__ */ jsxs29(Fragment10, { children: [
+                  /* @__PURE__ */ jsx45(
+                    Link2,
+                    {
+                      href: item.href,
+                      className: "whitespace-nowrap text-muted-foreground outline-none transition-colors hover:text-foreground focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:rounded-sm",
+                      children: item.label
+                    }
+                  ),
+                  /* @__PURE__ */ jsx45(
+                    ChevronRight2,
+                    {
+                      className: "shrink-0 text-slate-400",
+                      size: 16,
+                      "aria-hidden": "true"
+                    }
+                  )
+                ] })
+              },
+              item.id
+            );
+          })
+        }
+      )
+    }
+  );
 }
 
-// src/components/Menu/MenuSeparator.tsx
-import { Separator } from "react-aria-components";
-import { jsx as jsx36 } from "react/jsx-runtime";
-function MenuSeparator({ className }) {
-  return /* @__PURE__ */ jsx36(
-    Separator,
+// src/components/ToggleButton/ToggleButton.tsx
+import {
+  ToggleButton as AriaToggleButton2
+} from "react-aria-components";
+import { twMerge as twMerge20 } from "tailwind-merge";
+import { jsx as jsx46 } from "react/jsx-runtime";
+var squareSizeStyles2 = {
+  xs: "h-6 w-6 text-xs",
+  sm: "h-7 w-7 text-sm",
+  md: "h-8 w-8 text-base",
+  lg: "h-10 w-10 text-lg"
+};
+var variantStyles3 = {
+  default: {
+    base: [
+      "bg-transparent text-foreground",
+      "hover:bg-accent",
+      "pressed:bg-accent"
+    ].join(" "),
+    selected: "bg-accent text-foreground"
+  },
+  primary: {
+    base: [
+      "bg-transparent text-foreground",
+      "hover:bg-accent",
+      "pressed:bg-accent"
+    ].join(" "),
+    selected: "bg-primary-pressed text-primary-foreground"
+  },
+  outlined: {
+    base: [
+      "bg-background text-foreground",
+      "border border-border",
+      "hover:bg-card",
+      "pressed:bg-muted"
+    ].join(" "),
+    selected: [
+      "bg-slate-800 text-primary-foreground",
+      "border border-slate-800"
+    ].join(" ")
+  }
+};
+function ToggleButton({
+  variant = "default",
+  size = "md",
+  isSquare = false,
+  className,
+  ...props
+}) {
+  const styles = variantStyles3[variant];
+  return /* @__PURE__ */ jsx46(
+    AriaToggleButton2,
     {
-      className: [
-        "border-t border-border my-1",
+      ...props,
+      className: ({ isSelected }) => twMerge20(
+        "inline-flex items-center justify-center gap-2 cursor-pointer",
+        isSquare ? "rounded-none" : "rounded-md",
+        "font-medium",
+        "leading-tight",
+        "outline-none transition-colors",
+        "focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2",
+        "disabled:opacity-50 disabled:pointer-events-none",
+        isSquare ? squareSizeStyles2[size] : sizeStyles[size],
+        isSelected ? styles.selected : styles.base,
         className
-      ].filter(Boolean).join(" ")
+      )
     }
   );
 }
@@ -2524,17 +3272,17 @@ import {
   Popover as AriaPopover,
   Button as AriaButton3
 } from "react-aria-components";
-import { twMerge as twMerge18 } from "tailwind-merge";
-import { jsx as jsx37 } from "react/jsx-runtime";
+import { twMerge as twMerge21 } from "tailwind-merge";
+import { jsx as jsx47 } from "react/jsx-runtime";
 function Popover4({ children, isOpen, onOpenChange }) {
-  return /* @__PURE__ */ jsx37(DialogTrigger, { isOpen, onOpenChange, children });
+  return /* @__PURE__ */ jsx47(DialogTrigger, { isOpen, onOpenChange, children });
 }
 function PopoverTrigger({ children, className }) {
   const cx = `
     inline-flex items-center bg-transparent border-none p-0 outline-none cursor-pointer
     focus-visible:ring-2 focus-visible:ring-ring focus-visible:rounded-sm
   `;
-  return /* @__PURE__ */ jsx37(AriaButton3, { className: twMerge18(cx, className), children });
+  return /* @__PURE__ */ jsx47(AriaButton3, { className: twMerge21(cx, className), children });
 }
 function PopoverContent({
   placement = "bottom",
@@ -2555,13 +3303,13 @@ function PopoverContent({
     entering:placement-left:slide-in-from-right-1
     entering:placement-right:slide-in-from-left-1
   `;
-  return /* @__PURE__ */ jsx37(
+  return /* @__PURE__ */ jsx47(
     AriaPopover,
     {
       ...rest,
       placement,
       offset: offsetPx,
-      className: twMerge18(cx, className),
+      className: twMerge21(cx, className),
       children
     }
   );
@@ -2569,19 +3317,19 @@ function PopoverContent({
 
 // src/components/Tabs/Tabs.tsx
 import { createContext as createContext2, useContext as useContext2 } from "react";
-import { twMerge as twMerge19 } from "tailwind-merge";
+import { twMerge as twMerge22 } from "tailwind-merge";
 import {
   Tabs as AriaTabs,
   TabList as AriaTabList,
   Tab as AriaTab,
   TabPanel as AriaTabPanel
 } from "react-aria-components";
-import { jsx as jsx38 } from "react/jsx-runtime";
+import { jsx as jsx48 } from "react/jsx-runtime";
 var TabsContext = createContext2({
   variant: "underline",
   size: "md"
 });
-var sizeStyles4 = {
+var sizeStyles5 = {
   sm: "px-3 py-1.5 text-sm",
   md: "px-4 py-2 text-base",
   lg: "px-6 py-3 text-lg"
@@ -2594,12 +3342,12 @@ function Tabs({
   children,
   ...props
 }) {
-  return /* @__PURE__ */ jsx38(TabsContext.Provider, { value: { variant, size }, children: /* @__PURE__ */ jsx38(
+  return /* @__PURE__ */ jsx48(TabsContext.Provider, { value: { variant, size }, children: /* @__PURE__ */ jsx48(
     AriaTabs,
     {
       ...props,
       orientation,
-      className: twMerge19(
+      className: twMerge22(
         orientation === "vertical" ? "flex" : "",
         className
       ),
@@ -2614,11 +3362,11 @@ function TabList({
   const { variant } = useContext2(TabsContext);
   const baseStyles = variant === "unstyled" ? "flex items-center" : variant === "underline" ? "flex items-center border-b border-border" : "inline-flex items-center bg-muted rounded-lg p-1 gap-1";
   const verticalStyles = variant === "unstyled" ? "flex-col" : variant === "underline" ? "flex-col border-b-0 border-r border-border" : "flex-col";
-  return /* @__PURE__ */ jsx38(
+  return /* @__PURE__ */ jsx48(
     AriaTabList,
     {
       ...props,
-      className: ({ orientation }) => twMerge19(
+      className: ({ orientation }) => twMerge22(
         baseStyles,
         orientation === "vertical" ? verticalStyles : "",
         className
@@ -2628,20 +3376,20 @@ function TabList({
 }
 function Tab({ className, ...props }) {
   const { variant, size } = useContext2(TabsContext);
-  return /* @__PURE__ */ jsx38(
+  return /* @__PURE__ */ jsx48(
     AriaTab,
     {
       ...props,
       className: ({ isSelected, isDisabled, isHovered, isPressed }) => {
         if (variant === "unstyled") {
-          return twMerge19(
+          return twMerge22(
             "cursor-pointer outline-none",
             "focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2",
             isDisabled ? "opacity-50 pointer-events-none" : "",
             className
           );
         }
-        return twMerge19(
+        return twMerge22(
           // Base
           "cursor-pointer outline-none transition-colors",
           "font-medium",
@@ -2650,7 +3398,7 @@ function Tab({ className, ...props }) {
           // Disabled
           isDisabled ? "opacity-50 pointer-events-none" : "",
           // Size
-          sizeStyles4[size],
+          sizeStyles5[size],
           ...getTabVariantStyles(variant, {
             isSelected,
             isHovered,
@@ -2685,11 +3433,11 @@ function getTabVariantStyles(variant, state) {
 }
 function TabPanel({ className, ...props }) {
   const { variant } = useContext2(TabsContext);
-  return /* @__PURE__ */ jsx38(
+  return /* @__PURE__ */ jsx48(
     AriaTabPanel,
     {
       ...props,
-      className: twMerge19(
+      className: twMerge22(
         variant === "unstyled" ? "outline-none" : "mt-4 outline-none",
         className
       )
@@ -2707,16 +3455,16 @@ import {
 
 // src/components/SegmentedControl/SegmentedControl.tsx
 import { createContext as createContext3, useContext as useContext3 } from "react";
-import { twMerge as twMerge20 } from "tailwind-merge";
+import { twMerge as twMerge23 } from "tailwind-merge";
 import {
   ToggleButtonGroup as AriaToggleButtonGroup,
   ToggleButton as AriaToggleButton3
 } from "react-aria-components";
-import { jsx as jsx39 } from "react/jsx-runtime";
+import { jsx as jsx49 } from "react/jsx-runtime";
 var SegmentedControlContext = createContext3({
   size: "md"
 });
-var sizeStyles5 = {
+var sizeStyles6 = {
   sm: "px-2.5 py-1 text-xs",
   md: "px-3 py-1.5 text-sm",
   lg: "px-4 py-2 text-base"
@@ -2732,7 +3480,7 @@ function SegmentedControl({
   ...props
 }) {
   const isNoneMode = selectionMode === "none";
-  return /* @__PURE__ */ jsx39(SegmentedControlContext.Provider, { value: { size }, children: /* @__PURE__ */ jsx39(
+  return /* @__PURE__ */ jsx49(SegmentedControlContext.Provider, { value: { size }, children: /* @__PURE__ */ jsx49(
     AriaToggleButtonGroup,
     {
       ...props,
@@ -2740,7 +3488,7 @@ function SegmentedControl({
       selectedKeys: isNoneMode ? /* @__PURE__ */ new Set() : selectedKeys,
       defaultSelectedKeys: isNoneMode ? void 0 : defaultSelectedKeys,
       onSelectionChange: isNoneMode ? void 0 : onSelectionChange,
-      className: twMerge20(
+      className: twMerge23(
         "inline-flex items-center rounded-lg border border-border bg-muted p-0.5 gap-0.5",
         className
       ),
@@ -2753,11 +3501,11 @@ function SegmentedControlItem({
   ...props
 }) {
   const { size } = useContext3(SegmentedControlContext);
-  return /* @__PURE__ */ jsx39(
+  return /* @__PURE__ */ jsx49(
     AriaToggleButton3,
     {
       ...props,
-      className: ({ isSelected, isHovered, isPressed, isDisabled }) => twMerge20(
+      className: ({ isSelected, isHovered, isPressed, isDisabled }) => twMerge23(
         // Base layout
         "inline-flex items-center justify-center",
         "rounded-md",
@@ -2768,7 +3516,7 @@ function SegmentedControlItem({
         // Disabled
         isDisabled && "opacity-50 pointer-events-none",
         // Size
-        sizeStyles5[size],
+        sizeStyles6[size],
         // Selected state
         isSelected ? "bg-background text-foreground shadow-sm font-semibold" : isPressed ? "bg-card text-foreground" : isHovered ? "bg-card text-foreground" : "bg-transparent text-muted-foreground",
         className
@@ -2777,67 +3525,11 @@ function SegmentedControlItem({
   );
 }
 
-// src/components/Badge/Badge.tsx
-import { twMerge as twMerge22 } from "tailwind-merge";
-
-// src/components/MetricText/MetricText.tsx
-import { twMerge as twMerge21 } from "tailwind-merge";
-import { jsx as jsx40 } from "react/jsx-runtime";
-function MetricText({ className, ...rest }) {
-  const cx = twMerge21(
-    "text-xs font-medium leading-none tracking-wider tabular-nums",
-    className
-  );
-  return /* @__PURE__ */ jsx40("span", { className: cx, ...rest });
-}
-
-// src/components/Badge/Badge.tsx
-import { jsx as jsx41, jsxs as jsxs24 } from "react/jsx-runtime";
-var colorStyles = {
-  purple: "bg-badge-purple-bg text-badge-purple-text border-badge-purple-text/20",
-  teal: "bg-badge-teal-bg text-badge-teal-text border-badge-teal-text/20",
-  rose: "bg-badge-rose-bg text-badge-rose-text border-badge-rose-text/20",
-  slate: "bg-badge-slate-bg text-badge-slate-text border-badge-slate-text/20",
-  green: "bg-badge-green-bg text-badge-green-text border-badge-green-text/20",
-  amber: "bg-badge-amber-bg text-badge-amber-text border-badge-amber-text/20"
-};
-var sizeStyles6 = {
-  xs: "px-1 py-0 text-[10px]",
-  sm: "px-1.5 py-0.5 text-xs",
-  md: "px-2 py-0.5 text-xs",
-  lg: "px-2.5 py-1 text-sm"
-};
-function Badge({
-  children,
-  color = "slate",
-  size = "sm",
-  icon,
-  className,
-  ...rest
-}) {
-  return /* @__PURE__ */ jsxs24(
-    MetricText,
-    {
-      className: twMerge22(
-        "inline-flex items-center gap-1 rounded-full border",
-        colorStyles[color],
-        sizeStyles6[size],
-        className
-      ),
-      ...rest,
-      children: [
-        icon && /* @__PURE__ */ jsx41(Icon, { icon, size: "xs" }),
-        children
-      ]
-    }
-  );
-}
-
 // src/components/Card/Card.tsx
-import { twMerge as twMerge23 } from "tailwind-merge";
-import { jsx as jsx42, jsxs as jsxs25 } from "react/jsx-runtime";
+import { twMerge as twMerge24 } from "tailwind-merge";
+import { jsx as jsx50, jsxs as jsxs30 } from "react/jsx-runtime";
 function Card({ children, header, footer, className }) {
-  const cx = twMerge23(
+  const cx = twMerge24(
     `
       bg-card p-8
       border border-border
@@ -2846,17 +3538,17 @@ function Card({ children, header, footer, className }) {
     `,
     className
   );
-  return /* @__PURE__ */ jsxs25("div", { className: cx, children: [
-    header && /* @__PURE__ */ jsx42("div", { className: "border-b border-border", children: header }),
+  return /* @__PURE__ */ jsxs30("div", { className: cx, children: [
+    header && /* @__PURE__ */ jsx50("div", { className: "border-b border-border", children: header }),
     children,
-    footer && /* @__PURE__ */ jsx42("div", { className: "border-t border-border", children: footer })
+    footer && /* @__PURE__ */ jsx50("div", { className: "border-t border-border", children: footer })
   ] });
 }
 
 // src/components/DeltaIndicator/DeltaIndicator.tsx
 import { ArrowUp as ArrowUp2, ArrowDown as ArrowDown2, Minus as Minus2 } from "lucide-react";
-import { twMerge as twMerge24 } from "tailwind-merge";
-import { jsx as jsx43, jsxs as jsxs26 } from "react/jsx-runtime";
+import { twMerge as twMerge25 } from "tailwind-merge";
+import { jsx as jsx51, jsxs as jsxs31 } from "react/jsx-runtime";
 function getDirection(current, previous) {
   const diff = current - previous;
   if (diff > 0) return "increase";
@@ -2909,16 +3601,16 @@ function DeltaIndicator({
   className
 }) {
   if (unavailable) {
-    return /* @__PURE__ */ jsxs26(
+    return /* @__PURE__ */ jsxs31(
       "span",
       {
-        className: twMerge24(
+        className: twMerge25(
           "inline-flex items-center gap-1 font-medium",
           "text-muted-foreground",
           className
         ),
         children: [
-          label && /* @__PURE__ */ jsx43("span", { className: "text-sm text-muted-foreground mr-1", children: label }),
+          label && /* @__PURE__ */ jsx51("span", { className: "text-sm text-muted-foreground mr-1", children: label }),
           unavailableText
         ]
       }
@@ -2948,10 +3640,10 @@ function DeltaIndicator({
     }
   }
   const isPill = mode === "pill";
-  return /* @__PURE__ */ jsxs26(
+  return /* @__PURE__ */ jsxs31(
     "span",
     {
-      className: twMerge24(
+      className: twMerge25(
         "inline-flex items-center gap-1 font-medium",
         colorStyles2,
         isPill && [
@@ -2962,8 +3654,8 @@ function DeltaIndicator({
         className
       ),
       children: [
-        label && /* @__PURE__ */ jsx43("span", { className: "text-sm text-muted-foreground mr-1", children: label }),
-        /* @__PURE__ */ jsx43(IconComponent, { size: 14, "aria-hidden": true }),
+        label && /* @__PURE__ */ jsx51("span", { className: "text-sm text-muted-foreground mr-1", children: label }),
+        /* @__PURE__ */ jsx51(IconComponent, { size: 14, "aria-hidden": true }),
         valueText
       ]
     }
@@ -2971,8 +3663,8 @@ function DeltaIndicator({
 }
 
 // src/components/ProgressBar/ProgressBar.tsx
-import { twMerge as twMerge25 } from "tailwind-merge";
-import { jsx as jsx44, jsxs as jsxs27 } from "react/jsx-runtime";
+import { twMerge as twMerge26 } from "tailwind-merge";
+import { jsx as jsx52, jsxs as jsxs32 } from "react/jsx-runtime";
 var fillStyles = {
   brand: "bg-progress-fill",
   success: "bg-progress-fill-success",
@@ -2995,12 +3687,12 @@ function ProgressBar({
   className
 }) {
   const clampedValue = Math.min(100, Math.max(0, value));
-  return /* @__PURE__ */ jsxs27("div", { className: twMerge25("w-full", className), children: [
-    (label || description || showValue) && /* @__PURE__ */ jsxs27("div", { className: "flex items-center justify-between mb-2", children: [
-      /* @__PURE__ */ jsx44("span", { className: "text-sm font-medium text-foreground", children: label }),
-      /* @__PURE__ */ jsx44("span", { className: "text-sm text-muted-foreground", children: description ?? (showValue ? `${clampedValue}%` : null) })
+  return /* @__PURE__ */ jsxs32("div", { className: twMerge26("w-full", className), children: [
+    (label || description || showValue) && /* @__PURE__ */ jsxs32("div", { className: "flex items-center justify-between mb-2", children: [
+      /* @__PURE__ */ jsx52("span", { className: "text-sm font-medium text-foreground", children: label }),
+      /* @__PURE__ */ jsx52("span", { className: "text-sm text-muted-foreground", children: description ?? (showValue ? `${clampedValue}%` : null) })
     ] }),
-    /* @__PURE__ */ jsx44(
+    /* @__PURE__ */ jsx52(
       "div",
       {
         role: "progressbar",
@@ -3008,14 +3700,14 @@ function ProgressBar({
         "aria-valuemin": 0,
         "aria-valuemax": 100,
         "aria-label": label ?? "Progress",
-        className: twMerge25(
+        className: twMerge26(
           "w-full rounded-full bg-progress-track",
           sizeStyles7[size]
         ),
-        children: /* @__PURE__ */ jsx44(
+        children: /* @__PURE__ */ jsx52(
           "div",
           {
-            className: twMerge25(
+            className: twMerge26(
               "h-full rounded-full transition-all duration-300",
               fillStyles[variant]
             ),
@@ -3035,8 +3727,8 @@ import {
   AlertCircle as AlertCircle2,
   CheckCircle2 as CheckCircle22
 } from "lucide-react";
-import { twMerge as twMerge26 } from "tailwind-merge";
-import { jsx as jsx45, jsxs as jsxs28 } from "react/jsx-runtime";
+import { twMerge as twMerge27 } from "tailwind-merge";
+import { jsx as jsx53, jsxs as jsxs33 } from "react/jsx-runtime";
 var variantConfig2 = {
   info: {
     icon: Info3,
@@ -3080,40 +3772,40 @@ function Banner({
     setDismissed(true);
     onDismiss?.();
   };
-  return /* @__PURE__ */ jsxs28(
+  return /* @__PURE__ */ jsxs33(
     "div",
     {
       role: config.role,
-      className: twMerge26(
+      className: twMerge27(
         "flex items-start gap-3 rounded-lg border px-4 py-3",
         "text-sm",
         config.containerClass,
         className
       ),
       children: [
-        /* @__PURE__ */ jsx45(
+        /* @__PURE__ */ jsx53(
           Icon,
           {
             icon: resolvedIcon,
             size: "md",
-            className: twMerge26("mt-0.5", config.iconClass)
+            className: twMerge27("mt-0.5", config.iconClass)
           }
         ),
-        /* @__PURE__ */ jsxs28("div", { className: "flex-1", children: [
-          title && /* @__PURE__ */ jsxs28("span", { className: "font-medium", children: [
+        /* @__PURE__ */ jsxs33("div", { className: "flex-1", children: [
+          title && /* @__PURE__ */ jsxs33("span", { className: "font-medium", children: [
             title,
             " \u2014 "
           ] }),
           children
         ] }),
-        dismissible && /* @__PURE__ */ jsx45(
+        dismissible && /* @__PURE__ */ jsx53(
           "button",
           {
             type: "button",
             onClick: handleDismiss,
             className: "shrink-0 rounded-sm p-0.5 opacity-70 hover:opacity-100 transition-opacity outline-none focus-visible:ring-2 focus-visible:ring-current",
             "aria-label": "Dismiss",
-            children: /* @__PURE__ */ jsx45(Icon, { icon: "X", size: "sm" })
+            children: /* @__PURE__ */ jsx53(Icon, { icon: "X", size: "sm" })
           }
         )
       ]
@@ -3122,8 +3814,8 @@ function Banner({
 }
 
 // src/components/MetricCard/MetricCard.tsx
-import { twMerge as twMerge27 } from "tailwind-merge";
-import { Fragment as Fragment9, jsx as jsx46, jsxs as jsxs29 } from "react/jsx-runtime";
+import { twMerge as twMerge28 } from "tailwind-merge";
+import { Fragment as Fragment11, jsx as jsx54, jsxs as jsxs34 } from "react/jsx-runtime";
 var sizeConfig = {
   sm: {
     padding: "p-3",
@@ -3145,50 +3837,50 @@ function MetricCard({
   className
 }) {
   const config = sizeConfig[size];
-  const containerClass = twMerge27(
+  const containerClass = twMerge28(
     "bg-background border border-border rounded-lg shadow-sm",
     config.padding,
     href && "block transition-shadow hover:shadow-md hover:border-ring focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 outline-none",
     className
   );
-  const content = /* @__PURE__ */ jsxs29(Fragment9, { children: [
-    /* @__PURE__ */ jsx46("div", { className: twMerge27(config.labelClass, "text-muted-foreground"), children: label }),
-    /* @__PURE__ */ jsx46(
+  const content = /* @__PURE__ */ jsxs34(Fragment11, { children: [
+    /* @__PURE__ */ jsx54("div", { className: twMerge28(config.labelClass, "text-muted-foreground"), children: label }),
+    /* @__PURE__ */ jsx54(
       "div",
       {
-        className: twMerge27(
+        className: twMerge28(
           config.valueClass,
           "font-semibold text-foreground mt-1 tabular-nums"
         ),
         children: value
       }
     ),
-    secondary && /* @__PURE__ */ jsx46("div", { className: "mt-1 text-sm", children: secondary })
+    secondary && /* @__PURE__ */ jsx54("div", { className: "mt-1 text-sm", children: secondary })
   ] });
   if (href) {
-    return /* @__PURE__ */ jsx46("a", { href, className: containerClass, children: content });
+    return /* @__PURE__ */ jsx54("a", { href, className: containerClass, children: content });
   }
-  return /* @__PURE__ */ jsx46("div", { className: containerClass, children: content });
+  return /* @__PURE__ */ jsx54("div", { className: containerClass, children: content });
 }
 
 // src/components/SectionHeader/SectionHeader.tsx
 import { forwardRef as forwardRef7 } from "react";
-import { twMerge as twMerge28 } from "tailwind-merge";
-import { jsx as jsx47, jsxs as jsxs30 } from "react/jsx-runtime";
+import { twMerge as twMerge29 } from "tailwind-merge";
+import { jsx as jsx55, jsxs as jsxs35 } from "react/jsx-runtime";
 var SectionHeader = forwardRef7(
   function SectionHeader2({ title, as = "h2", children, className, ...rest }, ref) {
-    return /* @__PURE__ */ jsxs30(
+    return /* @__PURE__ */ jsxs35(
       "div",
       {
         ref,
-        className: twMerge28(
+        className: twMerge29(
           "flex flex-wrap items-center gap-3 pt-0 pb-4",
           className
         ),
         ...rest,
         children: [
-          /* @__PURE__ */ jsx47(Heading, { as, children: title }),
-          children && /* @__PURE__ */ jsx47("div", { className: "ml-auto flex flex-wrap items-center gap-2", children })
+          /* @__PURE__ */ jsx55(Heading, { as, children: title }),
+          children && /* @__PURE__ */ jsx55("div", { className: "ml-auto flex flex-wrap items-center gap-2", children })
         ]
       }
     );
@@ -3198,7 +3890,7 @@ var SectionHeader = forwardRef7(
 // src/components/DescriptionList/DescriptionList.tsx
 import { createContext as createContext4, useContext as useContext4 } from "react";
 import { Button as AriaButton4 } from "react-aria-components";
-import { jsx as jsx48, jsxs as jsxs31 } from "react/jsx-runtime";
+import { jsx as jsx56, jsxs as jsxs36 } from "react/jsx-runtime";
 var LayoutContext = createContext4("stacked");
 var listGapStyles = {
   stacked: "gap-4",
@@ -3209,7 +3901,7 @@ function DescriptionList({
   layout = "stacked",
   className
 }) {
-  return /* @__PURE__ */ jsx48(LayoutContext.Provider, { value: layout, children: /* @__PURE__ */ jsx48(
+  return /* @__PURE__ */ jsx56(LayoutContext.Provider, { value: layout, children: /* @__PURE__ */ jsx56(
     "dl",
     {
       className: ["flex flex-col", listGapStyles[layout], className].filter(Boolean).join(" "),
@@ -3233,17 +3925,17 @@ function DescriptionListItem({
     "text-sm m-0",
     muted ? "text-muted-foreground" : "text-foreground"
   ].join(" ");
-  const valueContent = /* @__PURE__ */ jsx48("dd", { className: valueClasses, children });
-  return /* @__PURE__ */ jsxs31("div", { className: itemLayoutStyles[layout], children: [
-    /* @__PURE__ */ jsx48("dt", { className: labelClasses, children: label }),
-    fullValue ? /* @__PURE__ */ jsx48(Tooltip, { content: fullValue, children: /* @__PURE__ */ jsx48(AriaButton4, { className: "text-left outline-none cursor-default", children: valueContent }) }) : valueContent
+  const valueContent = /* @__PURE__ */ jsx56("dd", { className: valueClasses, children });
+  return /* @__PURE__ */ jsxs36("div", { className: itemLayoutStyles[layout], children: [
+    /* @__PURE__ */ jsx56("dt", { className: labelClasses, children: label }),
+    fullValue ? /* @__PURE__ */ jsx56(Tooltip, { content: fullValue, children: /* @__PURE__ */ jsx56(AriaButton4, { className: "text-left outline-none cursor-default", children: valueContent }) }) : valueContent
   ] });
 }
 DescriptionList.Item = DescriptionListItem;
 
 // src/components/PathPill/PathPill.tsx
-import { twMerge as twMerge29 } from "tailwind-merge";
-import { jsx as jsx49 } from "react/jsx-runtime";
+import { twMerge as twMerge30 } from "tailwind-merge";
+import { jsx as jsx57 } from "react/jsx-runtime";
 var hashColors = [
   "purple",
   "teal",
@@ -3269,17 +3961,17 @@ function PathPill({
   const effectiveVisible = visibleCount ?? segments.length;
   const dotCount = Math.max(0, segments.length - effectiveVisible);
   const fullPath = segments.join(" / ");
-  return /* @__PURE__ */ jsx49(
+  return /* @__PURE__ */ jsx57(
     "div",
     {
-      className: twMerge29("relative flex", className),
+      className: twMerge30("relative flex", className),
       "aria-label": `Path: ${fullPath}`,
       children: segments.map((segment, i) => {
         const isCollapsed = i < dotCount;
         const isLast = i === segments.length - 1;
-        const cx = twMerge29(!isLast && "pr-5 -mr-4", isCollapsed && "pr-3");
+        const cx = twMerge30(!isLast && "pr-5 -mr-4", isCollapsed && "pr-3");
         const color = colorFn ? colorFn(segment, i) : pillColorFromName(segment);
-        return /* @__PURE__ */ jsx49(
+        return /* @__PURE__ */ jsx57(
           Badge,
           {
             className: cx,
@@ -3295,8 +3987,8 @@ function PathPill({
 }
 
 // src/components/FormWizard/FormWizard.tsx
-import { createContext as createContext5, useContext as useContext5, useCallback as useCallback4, useMemo } from "react";
-import { jsx as jsx50 } from "react/jsx-runtime";
+import { createContext as createContext5, useContext as useContext5, useCallback as useCallback10, useMemo as useMemo5 } from "react";
+import { jsx as jsx58 } from "react/jsx-runtime";
 var FormWizardContext = createContext5({
   currentStep: 0,
   totalSteps: 1,
@@ -3316,12 +4008,12 @@ function FormWizard({
 }) {
   const canGoBack = currentStep > 0;
   const isLastStep = currentStep >= totalSteps - 1;
-  const goBack = useCallback4(() => {
+  const goBack = useCallback10(() => {
     if (currentStep > 0) {
       onStepChange(currentStep - 1);
     }
   }, [currentStep, onStepChange]);
-  const value = useMemo(
+  const value = useMemo5(
     () => ({
       currentStep,
       totalSteps,
@@ -3331,13 +4023,13 @@ function FormWizard({
     }),
     [currentStep, totalSteps, canGoBack, goBack, isLastStep]
   );
-  return /* @__PURE__ */ jsx50(FormWizardContext.Provider, { value, children });
+  return /* @__PURE__ */ jsx58(FormWizardContext.Provider, { value, children });
 }
 
 // src/components/FormWizard/FormWizardProgress.tsx
-import { jsx as jsx51, jsxs as jsxs32 } from "react/jsx-runtime";
+import { jsx as jsx59, jsxs as jsxs37 } from "react/jsx-runtime";
 function CheckIcon() {
-  return /* @__PURE__ */ jsx51(
+  return /* @__PURE__ */ jsx59(
     "svg",
     {
       "aria-hidden": "true",
@@ -3348,24 +4040,24 @@ function CheckIcon() {
       strokeWidth: "2",
       strokeLinecap: "round",
       strokeLinejoin: "round",
-      children: /* @__PURE__ */ jsx51("path", { d: "M3 8.5l3.5 3.5 6.5-7" })
+      children: /* @__PURE__ */ jsx59("path", { d: "M3 8.5l3.5 3.5 6.5-7" })
     }
   );
 }
 function FormWizardProgress({ labels }) {
   const { currentStep, totalSteps } = useFormWizard();
-  return /* @__PURE__ */ jsx51("nav", { "aria-label": "Form progress", children: /* @__PURE__ */ jsx51("ol", { className: "flex items-start", role: "list", children: labels.map((label, index) => {
+  return /* @__PURE__ */ jsx59("nav", { "aria-label": "Form progress", children: /* @__PURE__ */ jsx59("ol", { className: "flex items-start", role: "list", children: labels.map((label, index) => {
     const isCompleted = index < currentStep;
     const isCurrent = index === currentStep;
     const isFuture = index > currentStep;
-    return /* @__PURE__ */ jsxs32(
+    return /* @__PURE__ */ jsxs37(
       "li",
       {
         className: "flex flex-1 flex-col items-center",
         "aria-current": isCurrent ? "step" : void 0,
         children: [
-          /* @__PURE__ */ jsxs32("div", { className: "flex w-full items-center", children: [
-            index > 0 ? /* @__PURE__ */ jsx51(
+          /* @__PURE__ */ jsxs37("div", { className: "flex w-full items-center", children: [
+            index > 0 ? /* @__PURE__ */ jsx59(
               "div",
               {
                 "aria-hidden": "true",
@@ -3374,8 +4066,8 @@ function FormWizardProgress({ labels }) {
                   index <= currentStep ? "bg-primary" : "bg-border"
                 ].join(" ")
               }
-            ) : /* @__PURE__ */ jsx51("div", { className: "flex-1", "aria-hidden": "true" }),
-            /* @__PURE__ */ jsx51(
+            ) : /* @__PURE__ */ jsx59("div", { className: "flex-1", "aria-hidden": "true" }),
+            /* @__PURE__ */ jsx59(
               "div",
               {
                 className: [
@@ -3387,10 +4079,10 @@ function FormWizardProgress({ labels }) {
                   isFuture ? "border-2 border-border bg-background text-muted-foreground" : ""
                 ].join(" "),
                 "aria-hidden": "true",
-                children: isCompleted ? /* @__PURE__ */ jsx51(CheckIcon, {}) : index + 1
+                children: isCompleted ? /* @__PURE__ */ jsx59(CheckIcon, {}) : index + 1
               }
             ),
-            index < totalSteps - 1 ? /* @__PURE__ */ jsx51(
+            index < totalSteps - 1 ? /* @__PURE__ */ jsx59(
               "div",
               {
                 "aria-hidden": "true",
@@ -3399,9 +4091,9 @@ function FormWizardProgress({ labels }) {
                   index < currentStep ? "bg-primary" : "bg-border"
                 ].join(" ")
               }
-            ) : /* @__PURE__ */ jsx51("div", { className: "flex-1", "aria-hidden": "true" })
+            ) : /* @__PURE__ */ jsx59("div", { className: "flex-1", "aria-hidden": "true" })
           ] }),
-          /* @__PURE__ */ jsx51(
+          /* @__PURE__ */ jsx59(
             "span",
             {
               className: [
@@ -3419,15 +4111,15 @@ function FormWizardProgress({ labels }) {
 }
 
 // src/components/FormWizard/FormWizardNav.tsx
-import { jsx as jsx52, jsxs as jsxs33 } from "react/jsx-runtime";
+import { jsx as jsx60, jsxs as jsxs38 } from "react/jsx-runtime";
 function FormWizardNav({
   onNext,
   isSubmitting = false,
   submitLabel = "Submit"
 }) {
   const { canGoBack, goBack, isLastStep } = useFormWizard();
-  return /* @__PURE__ */ jsxs33("div", { className: "flex items-center justify-end gap-3", children: [
-    canGoBack && /* @__PURE__ */ jsx52(
+  return /* @__PURE__ */ jsxs38("div", { className: "flex items-center justify-end gap-3", children: [
+    canGoBack && /* @__PURE__ */ jsx60(
       Button,
       {
         variant: "secondary",
@@ -3437,7 +4129,7 @@ function FormWizardNav({
         children: "Back"
       }
     ),
-    /* @__PURE__ */ jsx52(
+    /* @__PURE__ */ jsx60(
       Button,
       {
         variant: "primary",
@@ -3456,9 +4148,7 @@ export {
   Button,
   ButtonLink,
   Card,
-  Cell,
   Checkbox,
-  Column,
   DeltaIndicator,
   Description,
   DescriptionList,
@@ -3483,6 +4173,8 @@ export {
   InputPassword,
   Label,
   Link,
+  ListBox2 as ListBox,
+  ListBoxItem2 as ListBoxItem,
   Logo,
   Menu2 as Menu,
   MenuCheckboxItem,
@@ -3492,6 +4184,7 @@ export {
   MenuSeparator,
   MetricCard,
   MetricText,
+  NoFilterResults,
   PathPill,
   Popover4 as Popover,
   PopoverContent,
@@ -3502,11 +4195,11 @@ export {
   RadioButton,
   RadioGroup,
   RouterProvider,
-  Row,
   SectionHeader,
   SegmentedControl,
   SegmentedControlItem,
   Select,
+  SelectionFooter,
   Slider,
   Spinner,
   Switch,
@@ -3514,8 +4207,6 @@ export {
   TabList,
   TabPanel,
   Table2 as Table,
-  TableBody,
-  TableHeader,
   Tabs,
   ToastProvider,
   ToggleButton,
@@ -3527,11 +4218,17 @@ export {
   Tabs2 as UnstyledTabs,
   buttonBaseClass,
   createToastBridge,
+  getTableStore,
   iconRegistry,
   pillColorFromName,
   selectedStyles,
+  useColumnFilters,
+  useColumnVisibility,
+  useColumnWidths,
   useContextMenu,
   useFormWizard,
+  useTableSorting,
+  useTableStore,
   useToast,
   variantStyles
 };