@conscia-labs/design-system 1.2.0 → 1.2.1

package/dist/chunk-OYJH5CVD.js

@@ -1,2574 +0,0 @@
-import {
-  appearanceOptions,
-  applyConsciaPreferences,
-  densityOptions
-} from "./chunk-YNQWIH6V.js";
-import {
-  AlertDialog,
-  AlertDialogAction,
-  AlertDialogBody,
-  AlertDialogCancel,
-  AlertDialogContent,
-  AlertDialogDescription,
-  AlertDialogFooter,
-  AlertDialogHeader,
-  AlertDialogTitle,
-  AlertDialogTrigger,
-  Button,
-  Card,
-  Checkbox,
-  Collapsible,
-  CollapsibleContent,
-  CollapsibleTrigger,
-  Dialog,
-  DialogBody,
-  DialogContent,
-  DialogDescription,
-  DialogHeader,
-  DialogTitle,
-  DialogTrigger,
-  DropdownMenu,
-  DropdownMenuContent,
-  DropdownMenuGroup,
-  DropdownMenuLabel,
-  DropdownMenuLinkItem,
-  DropdownMenuTrigger,
-  IconButton,
-  Input,
-  Select,
-  SelectContent,
-  SelectItem,
-  SelectTrigger,
-  SelectValue,
-  Separator,
-  Sheet,
-  SheetContent,
-  SheetDescription,
-  SheetHeader,
-  SheetTitle,
-  ShortcutHint,
-  Skeleton,
-  Table,
-  TableBody,
-  TableCaption,
-  TableCell,
-  TableHead,
-  TableHeader,
-  TableRow,
-  Tabs,
-  TabsContent,
-  TabsList,
-  TabsTrigger,
-  Tooltip,
-  TooltipContent,
-  TooltipProvider,
-  TooltipTrigger,
-  index_parts_exports,
-  useRender
-} from "./chunk-HWUUODVE.js";
-import {
-  cn
-} from "./chunk-JU5DQXFC.js";
-
-// src/patterns/pagination.tsx
-import { ChevronLeft, ChevronRight } from "lucide-react";
-import { jsx, jsxs } from "react/jsx-runtime";
-function PaginationControls({
-  currentPage,
-  pageCount,
-  totalLabel,
-  onPrevious,
-  onNext,
-  onPageChange,
-  pageSize,
-  pageSizeOptions = [10, 25, 50],
-  onPageSizeChange,
-  className,
-  ...props
-}) {
-  return /* @__PURE__ */ jsxs(
-    "div",
-    {
-      "data-slot": "pagination-controls",
-      className: cn("flex flex-col gap-2 border-t border-border-subtle px-5 py-3 text-sm text-text-supporting sm:flex-row sm:items-center sm:justify-between", className),
-      ...props,
-      children: [
-        /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap items-center gap-3", children: [
-          /* @__PURE__ */ jsx("span", { children: totalLabel }),
-          pageSize && onPageSizeChange ? /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
-            /* @__PURE__ */ jsx("span", { className: "text-[var(--ds-metadata)]", children: "Rows" }),
-            /* @__PURE__ */ jsxs(Select, { value: String(pageSize), onValueChange: (value) => onPageSizeChange(Number(value)), children: [
-              /* @__PURE__ */ jsx(SelectTrigger, { size: "sm", className: "w-[4.5rem]", "aria-label": "Rows per page", children: /* @__PURE__ */ jsx(SelectValue, {}) }),
-              /* @__PURE__ */ jsx(SelectContent, { children: pageSizeOptions.map((size) => /* @__PURE__ */ jsx(SelectItem, { value: String(size), children: size }, size)) })
-            ] })
-          ] }) : null
-        ] }),
-        /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1", children: [
-          /* @__PURE__ */ jsx(IconButton, { type: "button", variant: "outline", size: "sm", className: "size-8", "aria-label": "Previous page", onClick: onPrevious ?? (() => onPageChange?.(currentPage - 1)), disabled: currentPage <= 1, children: /* @__PURE__ */ jsx(ChevronLeft, {}) }),
-          onPageChange ? pageItems(currentPage, pageCount).map((item, index) => item === "ellipsis" ? /* @__PURE__ */ jsx("span", { className: "flex size-8 items-center justify-center text-text-supporting", "aria-hidden": "true", children: "\u2026" }, `ellipsis-${index}`) : /* @__PURE__ */ jsx(IconButton, { type: "button", variant: item === currentPage ? "secondary" : "ghost", size: "sm", className: "size-8", "aria-label": `Page ${item}`, "aria-current": item === currentPage ? "page" : void 0, onClick: () => onPageChange(item), children: item }, item)) : /* @__PURE__ */ jsxs("span", { className: "px-2 text-[var(--ds-metadata)]", children: [
-            "Page ",
-            currentPage,
-            " of ",
-            pageCount
-          ] }),
-          /* @__PURE__ */ jsx(IconButton, { type: "button", variant: "outline", size: "sm", className: "size-8", "aria-label": "Next page", onClick: onNext ?? (() => onPageChange?.(currentPage + 1)), disabled: currentPage >= pageCount, children: /* @__PURE__ */ jsx(ChevronRight, {}) })
-        ] })
-      ]
-    }
-  );
-}
-function pageItems(currentPage, pageCount) {
-  if (pageCount <= 7) return Array.from({ length: pageCount }, (_, index) => index + 1);
-  const pages = /* @__PURE__ */ new Set([1, pageCount, currentPage - 1, currentPage, currentPage + 1]);
-  const sorted = Array.from(pages).filter((page) => page > 0 && page <= pageCount).sort((a, b) => a - b);
-  const result = [];
-  sorted.forEach((page, index) => {
-    if (index && page - sorted[index - 1] > 1) result.push("ellipsis");
-    result.push(page);
-  });
-  return result;
-}
-
-// src/patterns/data-table.tsx
-import * as React from "react";
-import {
-  flexRender,
-  getCoreRowModel,
-  getPaginationRowModel,
-  getSortedRowModel,
-  useReactTable
-} from "@tanstack/react-table";
-import { ArrowDown, ArrowUp, ChevronsUpDown } from "lucide-react";
-import { Fragment, jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
-function DataTable({
-  data,
-  columns,
-  getRowId,
-  getRowLabel,
-  onRowClick,
-  isRowClickable,
-  rowActions,
-  selectedIds,
-  onSelectionChange,
-  sorting,
-  onSortingChange,
-  manualSorting = false,
-  pagination,
-  onPaginationChange,
-  manualPagination = false,
-  pageCount,
-  rowCount,
-  pageSizeOptions,
-  totalLabel,
-  mobileRow,
-  caption,
-  empty,
-  className
-}) {
-  const rowSelection = React.useMemo(() => {
-    const selection = {};
-    selectedIds?.forEach((id) => {
-      selection[id] = true;
-    });
-    return selection;
-  }, [selectedIds]);
-  const tableColumns = React.useMemo(() => {
-    const result = [];
-    if (onSelectionChange) {
-      result.push({
-        id: "select",
-        enableSorting: false,
-        header: ({ table: table2 }) => /* @__PURE__ */ jsx2(
-          Checkbox,
-          {
-            "aria-label": "Select all rows on this page",
-            checked: table2.getIsAllPageRowsSelected(),
-            indeterminate: table2.getIsSomePageRowsSelected() && !table2.getIsAllPageRowsSelected(),
-            onCheckedChange: (checked) => table2.toggleAllPageRowsSelected(Boolean(checked))
-          }
-        ),
-        cell: ({ row }) => /* @__PURE__ */ jsx2(
-          Checkbox,
-          {
-            "aria-label": `Select ${getRowLabel?.(row.original) ?? row.id}`,
-            checked: row.getIsSelected(),
-            onCheckedChange: (checked) => row.toggleSelected(Boolean(checked)),
-            onClick: (event) => event.stopPropagation()
-          }
-        ),
-        meta: { className: "w-10" }
-      });
-    }
-    result.push(...columns.map((column) => ({
-      id: column.id,
-      ...column.accessor ? { accessorFn: column.accessor } : {},
-      enableSorting: column.sortable ?? false,
-      header: () => column.header,
-      cell: ({ row }) => column.cell(row.original),
-      meta: { className: column.className, label: typeof column.header === "string" ? column.header : column.id }
-    })));
-    if (rowActions) {
-      result.push({
-        id: "actions",
-        enableSorting: false,
-        header: "Actions",
-        cell: ({ row }) => /* @__PURE__ */ jsx2(
-          "div",
-          {
-            onClick: (event) => event.stopPropagation(),
-            onKeyDown: (event) => event.stopPropagation(),
-            children: rowActions(row.original)
-          }
-        ),
-        meta: { className: "w-12 text-right" }
-      });
-    }
-    return result;
-  }, [columns, getRowLabel, onSelectionChange, rowActions]);
-  const table = useReactTable({
-    data,
-    columns: tableColumns,
-    getRowId: (row) => getRowId(row),
-    state: { rowSelection, ...sorting ? { sorting } : {}, ...pagination ? { pagination } : {} },
-    enableRowSelection: Boolean(onSelectionChange),
-    onRowSelectionChange: (updater) => {
-      if (!onSelectionChange) return;
-      const next = typeof updater === "function" ? updater(rowSelection) : updater;
-      onSelectionChange(new Set(Object.keys(next).filter((id) => next[id])));
-    },
-    onSortingChange: (updater) => {
-      if (!onSortingChange) return;
-      onSortingChange(typeof updater === "function" ? updater(sorting ?? []) : updater);
-    },
-    onPaginationChange: (updater) => {
-      if (!onPaginationChange || !pagination) return;
-      onPaginationChange(typeof updater === "function" ? updater(pagination) : updater);
-    },
-    manualSorting,
-    manualPagination,
-    pageCount,
-    rowCount,
-    getCoreRowModel: getCoreRowModel(),
-    getSortedRowModel: manualSorting ? void 0 : getSortedRowModel(),
-    getPaginationRowModel: pagination && !manualPagination ? getPaginationRowModel() : void 0
-  });
-  if (!data.length && empty) return /* @__PURE__ */ jsx2(Fragment, { children: empty });
-  const visibleRows = table.getRowModel().rows;
-  const showPagination = Boolean(pagination && onPaginationChange);
-  return /* @__PURE__ */ jsxs2("div", { "data-slot": "data-table", className: cn("bg-canvas", className), children: [
-    /* @__PURE__ */ jsx2("div", { className: mobileRow ? "hidden md:block" : void 0, children: /* @__PURE__ */ jsxs2(Table, { children: [
-      caption ? /* @__PURE__ */ jsx2(TableCaption, { children: caption }) : null,
-      /* @__PURE__ */ jsx2(TableHeader, { children: table.getHeaderGroups().map((headerGroup) => /* @__PURE__ */ jsx2(TableRow, { children: headerGroup.headers.map((header) => {
-        const meta = header.column.columnDef.meta;
-        const canSort = header.column.getCanSort();
-        const sorted = header.column.getIsSorted();
-        return /* @__PURE__ */ jsx2(
-          TableHead,
-          {
-            className: meta?.className,
-            "aria-sort": canSort ? sorted === "asc" ? "ascending" : sorted === "desc" ? "descending" : "none" : void 0,
-            children: header.isPlaceholder ? null : canSort ? /* @__PURE__ */ jsxs2(
-              Button,
-              {
-                type: "button",
-                variant: "ghost",
-                size: "sm",
-                className: "-ml-2 h-8 gap-1.5 px-2 text-[var(--ds-metadata)] font-semibold uppercase text-text-supporting hover:text-text-primary",
-                onClick: header.column.getToggleSortingHandler(),
-                "aria-label": `Sort by ${meta?.label ?? header.column.id}`,
-                children: [
-                  flexRender(header.column.columnDef.header, header.getContext()),
-                  sorted === "asc" ? /* @__PURE__ */ jsx2(ArrowUp, { className: "size-3.5" }) : sorted === "desc" ? /* @__PURE__ */ jsx2(ArrowDown, { className: "size-3.5" }) : /* @__PURE__ */ jsx2(ChevronsUpDown, { className: "size-3.5 opacity-60" })
-                ]
-              }
-            ) : flexRender(header.column.columnDef.header, header.getContext())
-          },
-          header.id
-        );
-      }) }, headerGroup.id)) }),
-      /* @__PURE__ */ jsx2(TableBody, { children: visibleRows.map((row) => {
-        const rowClickable = Boolean(
-          onRowClick && (isRowClickable?.(row.original) ?? true)
-        );
-        return /* @__PURE__ */ jsx2(
-          TableRow,
-          {
-            "data-selected": row.getIsSelected() ? "true" : void 0,
-            "aria-selected": row.getIsSelected() ? "true" : void 0,
-            tabIndex: rowClickable ? 0 : void 0,
-            "aria-label": rowClickable ? getRowLabel?.(row.original) ?? row.id : void 0,
-            className: cn(rowClickable && "cursor-pointer outline-none focus-visible:ring-[3px] focus-visible:ring-focus/45"),
-            onClick: () => {
-              if (rowClickable) onRowClick?.(row.original);
-            },
-            onKeyDown: (event) => {
-              if (!rowClickable || event.key !== "Enter" && event.key !== " ") return;
-              event.preventDefault();
-              onRowClick?.(row.original);
-            },
-            children: row.getVisibleCells().map((cell) => {
-              const meta = cell.column.columnDef.meta;
-              return /* @__PURE__ */ jsx2(TableCell, { className: meta?.className, children: flexRender(cell.column.columnDef.cell, cell.getContext()) }, cell.id);
-            })
-          },
-          row.id
-        );
-      }) })
-    ] }) }),
-    mobileRow ? /* @__PURE__ */ jsx2("div", { className: "divide-y divide-border-subtle md:hidden", role: "list", children: visibleRows.map((row) => /* @__PURE__ */ jsx2("div", { role: "listitem", children: mobileRow(row.original) }, row.id)) }) : null,
-    showPagination ? /* @__PURE__ */ jsx2(
-      PaginationControls,
-      {
-        currentPage: pagination.pageIndex + 1,
-        pageCount: Math.max(1, table.getPageCount()),
-        pageSize: pagination.pageSize,
-        pageSizeOptions,
-        totalLabel,
-        onPageChange: (nextPage) => table.setPageIndex(nextPage - 1),
-        onPageSizeChange: (nextSize) => table.setPageSize(nextSize)
-      }
-    ) : null
-  ] });
-}
-
-// src/patterns/entity-table.tsx
-import { jsx as jsx3 } from "react/jsx-runtime";
-function EntityTable({
-  items,
-  columns,
-  getRowId,
-  selectedIds,
-  onSelectionChange,
-  onRowClick,
-  getRowLabel,
-  rowActions,
-  caption,
-  className
-}) {
-  return /* @__PURE__ */ jsx3(
-    DataTable,
-    {
-      data: items,
-      columns: columns.map((column) => ({ ...column, id: column.key })),
-      getRowId,
-      selectedIds,
-      onSelectionChange,
-      onRowClick,
-      getRowLabel,
-      rowActions,
-      caption,
-      className
-    }
-  );
-}
-
-// src/patterns/command-palette.tsx
-import * as React2 from "react";
-import { SearchIcon } from "lucide-react";
-import { jsx as jsx4, jsxs as jsxs3 } from "react/jsx-runtime";
-function CommandPalette({
-  className,
-  closeOnSelect = true,
-  defaultOpen = false,
-  description,
-  emptyMessage = "No commands found.",
-  items,
-  onOpenChange,
-  onSelect,
-  open,
-  placeholder = "Search commands...",
-  title = "Command menu",
-  trigger,
-  ...props
-}) {
-  const [query, setQuery] = React2.useState("");
-  const [internalOpen, setInternalOpen] = React2.useState(defaultOpen);
-  const isControlled = open !== void 0;
-  const isOpen = open ?? internalOpen;
-  const filteredItems = React2.useMemo(() => {
-    const normalizedQuery = query.trim().toLocaleLowerCase();
-    if (!normalizedQuery) {
-      return items;
-    }
-    return items.filter(
-      (item) => [item.label, ...item.keywords ?? []].some(
-        (value) => value.toLocaleLowerCase().includes(normalizedQuery)
-      )
-    );
-  }, [items, query]);
-  const handleOpenChange = React2.useCallback(
-    (nextOpen) => {
-      if (!isControlled) {
-        setInternalOpen(nextOpen);
-      }
-      if (nextOpen) {
-        setQuery("");
-      }
-      onOpenChange?.(nextOpen);
-    },
-    [isControlled, onOpenChange]
-  );
-  const handleSelect = React2.useCallback(
-    (item) => {
-      onSelect(item);
-      if (closeOnSelect) {
-        handleOpenChange(false);
-      }
-    },
-    [closeOnSelect, handleOpenChange, onSelect]
-  );
-  return /* @__PURE__ */ jsx4("div", { "data-slot": "command-palette", className: cn("contents", className), ...props, children: /* @__PURE__ */ jsxs3(Dialog, { open: isOpen, onOpenChange: handleOpenChange, children: [
-    trigger ? /* @__PURE__ */ jsx4(DialogTrigger, { render: trigger }) : null,
-    /* @__PURE__ */ jsxs3(
-      DialogContent,
-      {
-        showCloseButton: false,
-        size: "small",
-        "aria-label": typeof title === "string" ? void 0 : "Command menu",
-        className: "max-w-xl gap-0 p-0",
-        children: [
-          /* @__PURE__ */ jsxs3(DialogHeader, { className: "sr-only", children: [
-            /* @__PURE__ */ jsx4(DialogTitle, { children: title }),
-            description ? /* @__PURE__ */ jsx4(DialogDescription, { children: description }) : null
-          ] }),
-          /* @__PURE__ */ jsx4(DialogBody, { className: "overflow-hidden", children: /* @__PURE__ */ jsxs3(
-            index_parts_exports.Root,
-            {
-              items: filteredItems,
-              filter: () => true,
-              open: true,
-              autoHighlight: true,
-              inputValue: query,
-              onInputValueChange: setQuery,
-              onValueChange: (item) => {
-                if (item) {
-                  handleSelect(item);
-                }
-              },
-              itemToStringLabel: (item) => [item.label, ...item.keywords ?? []].join(" "),
-              itemToStringValue: (item) => item.id,
-              children: [
-                /* @__PURE__ */ jsxs3("div", { className: "flex items-center gap-2 border-b border-border-subtle px-4", children: [
-                  /* @__PURE__ */ jsx4(SearchIcon, { "aria-hidden": "true", className: "size-4 shrink-0 text-text-supporting" }),
-                  /* @__PURE__ */ jsx4(
-                    index_parts_exports.Input,
-                    {
-                      "aria-label": "Search commands",
-                      autoFocus: true,
-                      className: "ds-type-control h-12 min-w-0 flex-1 bg-transparent outline-none placeholder:text-text-supporting",
-                      onKeyDown: (event) => {
-                        if (event.key === "Escape") {
-                          event.preventDefault();
-                          handleOpenChange(false);
-                        }
-                      },
-                      placeholder
-                    }
-                  )
-                ] }),
-                filteredItems.length === 0 ? /* @__PURE__ */ jsx4("div", { role: "status", className: "px-3 py-8 text-center text-sm text-text-supporting", children: emptyMessage }) : null,
-                /* @__PURE__ */ jsx4(
-                  index_parts_exports.List,
-                  {
-                    "aria-label": "Commands",
-                    className: "max-h-[min(24rem,calc(100vh-10rem))] overflow-y-auto p-2 outline-none",
-                    children: filteredItems.map((item, index) => /* @__PURE__ */ jsxs3(React2.Fragment, { children: [
-                      item.group && (index === 0 || filteredItems[index - 1]?.group !== item.group) ? /* @__PURE__ */ jsx4("div", { role: "presentation", className: "px-3 pb-1 pt-3 text-xs font-semibold uppercase tracking-wide text-text-supporting first:pt-1", children: item.group }) : null,
-                      /* @__PURE__ */ jsxs3(
-                        index_parts_exports.Item,
-                        {
-                          index,
-                          value: item,
-                          disabled: item.disabled,
-                          className: "data-highlighted:bg-surface-muted data-highlighted:text-text-primary relative flex min-w-0 items-start gap-3 rounded-md px-3 py-2.5 text-left outline-none data-disabled:pointer-events-none data-disabled:opacity-50",
-                          children: [
-                            item.icon ? /* @__PURE__ */ jsx4("span", { className: "mt-0.5 flex size-4 shrink-0 items-center justify-center text-text-supporting", children: item.icon }) : null,
-                            /* @__PURE__ */ jsxs3("span", { className: "min-w-0 flex-1", children: [
-                              /* @__PURE__ */ jsx4("span", { className: "block truncate text-sm font-medium", children: item.label }),
-                              item.description ? /* @__PURE__ */ jsx4("span", { className: "mt-0.5 block truncate text-xs text-text-supporting", children: item.description }) : null
-                            ] }),
-                            item.shortcut ? /* @__PURE__ */ jsx4("span", { className: "shrink-0 text-xs text-text-supporting", children: item.shortcut }) : null
-                          ]
-                        }
-                      )
-                    ] }, item.id))
-                  }
-                )
-              ]
-            }
-          ) })
-        ]
-      }
-    )
-  ] }) });
-}
-
-// src/patterns/data-panel.tsx
-import { jsx as jsx5, jsxs as jsxs4 } from "react/jsx-runtime";
-function DataPanel({ className, ...props }) {
-  return /* @__PURE__ */ jsx5("section", { "data-slot": "data-panel", className: cn("min-w-0 overflow-hidden rounded-[var(--ds-radius-surface)] border border-border-default bg-surface text-text-primary shadow-[var(--ds-shadow-raised)]", className), ...props });
-}
-function DataPanelHeader({ title, description, status, actions, className, ...props }) {
-  return /* @__PURE__ */ jsxs4("header", { "data-slot": "data-panel-header", className: cn("flex min-w-0 items-start justify-between gap-4 border-b border-border-subtle px-[var(--ds-surface-padding)] py-3", className), ...props, children: [
-    /* @__PURE__ */ jsxs4("div", { className: "min-w-0", children: [
-      /* @__PURE__ */ jsxs4("div", { className: "flex flex-wrap items-center gap-2", children: [
-        /* @__PURE__ */ jsx5("h2", { className: "ds-type-card-title", children: title }),
-        status
-      ] }),
-      description ? /* @__PURE__ */ jsx5("p", { className: "ds-type-metadata mt-0.5 text-text-supporting", children: description }) : null
-    ] }),
-    actions ? /* @__PURE__ */ jsx5("div", { className: "shrink-0", children: actions }) : null
-  ] });
-}
-function DataPanelContent({ padded = false, className, ...props }) {
-  return /* @__PURE__ */ jsx5("div", { "data-slot": "data-panel-content", "data-padded": padded ? "true" : void 0, className: cn(padded && "p-[var(--ds-surface-padding)]", className), ...props });
-}
-function DataPanelFooter({ className, ...props }) {
-  return /* @__PURE__ */ jsx5("footer", { "data-slot": "data-panel-footer", className: cn("border-t border-border-subtle px-[var(--ds-surface-padding)] py-3 ds-type-metadata text-text-supporting", className), ...props });
-}
-
-// src/patterns/detail-back-link.tsx
-import { ArrowLeft } from "lucide-react";
-import { jsx as jsx6, jsxs as jsxs5 } from "react/jsx-runtime";
-function DetailBackLink({ label, className, ...props }) {
-  return /* @__PURE__ */ jsxs5(
-    "a",
-    {
-      "data-slot": "detail-back-link",
-      className: cn(
-        "inline-flex h-8 w-fit items-center gap-2 rounded-md px-2 text-sm font-medium text-text-supporting outline-none transition-colors hover:bg-surface-muted hover:text-text-primary focus-visible:ring-[3px] focus-visible:ring-focus/45",
-        className
-      ),
-      ...props,
-      children: [
-        /* @__PURE__ */ jsx6(ArrowLeft, { className: "size-4", "aria-hidden": "true" }),
-        label
-      ]
-    }
-  );
-}
-
-// src/patterns/filter-bar.tsx
-import { jsx as jsx7, jsxs as jsxs6 } from "react/jsx-runtime";
-function FilterBar({
-  children,
-  clearAllLabel = "Clear all",
-  className,
-  onClearAll,
-  ...props
-}) {
-  return /* @__PURE__ */ jsxs6(
-    "div",
-    {
-      "data-slot": "filter-bar",
-      className: cn(
-        "flex min-w-0 flex-wrap items-center gap-2 rounded-[var(--ds-radius-control)] border border-border-subtle bg-surface-muted/60 px-2 py-1.5",
-        className
-      ),
-      role: "group",
-      "aria-label": props["aria-label"] ?? "Active filters",
-      ...props,
-      children: [
-        /* @__PURE__ */ jsx7("div", { className: "flex min-w-0 flex-1 flex-wrap items-center gap-1.5", children }),
-        onClearAll ? /* @__PURE__ */ jsx7(Button, { type: "button", variant: "ghost", size: "sm", onClick: onClearAll, className: "shrink-0", children: clearAllLabel }) : null
-      ]
-    }
-  );
-}
-
-// src/patterns/app-shell.tsx
-import * as React3 from "react";
-import { PanelLeftIcon, Search, X } from "lucide-react";
-import { Fragment as Fragment3, jsx as jsx8, jsxs as jsxs7 } from "react/jsx-runtime";
-var SIDEBAR_COOKIE_NAME = "conscia_sidebar_state";
-var SIDEBAR_COOKIE_MAX_AGE = 60 * 60 * 24 * 30;
-var SIDEBAR_KEYBOARD_SHORTCUT = "b";
-var SIDEBAR_STORAGE_KEY = "conscia-sidebar-open:v1";
-var SIDEBAR_STATE_CHANGE_EVENT = "conscia-sidebar-state-change";
-function parseSidebarOpen(value) {
-  return value === "true" ? true : value === "false" ? false : null;
-}
-function readPersistedSidebarOpen() {
-  if (typeof document === "undefined") {
-    return null;
-  }
-  try {
-    const storedValue = window.localStorage.getItem(SIDEBAR_STORAGE_KEY);
-    const storedSidebarOpen = parseSidebarOpen(storedValue);
-    if (storedSidebarOpen !== null) {
-      return storedSidebarOpen;
-    }
-  } catch {
-  }
-  const cookie = document.cookie.split("; ").find((entry) => entry.startsWith(`${SIDEBAR_COOKIE_NAME}=`));
-  if (!cookie) {
-    return null;
-  }
-  const value = cookie.slice(SIDEBAR_COOKIE_NAME.length + 1);
-  return parseSidebarOpen(value);
-}
-function persistSidebarOpen(open) {
-  try {
-    window.localStorage.setItem(SIDEBAR_STORAGE_KEY, String(open));
-  } catch {
-  }
-  document.cookie = `${SIDEBAR_COOKIE_NAME}=${open}; path=/; max-age=${SIDEBAR_COOKIE_MAX_AGE}`;
-  window.dispatchEvent(new Event(SIDEBAR_STATE_CHANGE_EVENT));
-}
-function subscribeToSidebarOpen(onStoreChange) {
-  function onStorage(event) {
-    if (event.key === SIDEBAR_STORAGE_KEY) {
-      onStoreChange();
-    }
-  }
-  window.addEventListener(SIDEBAR_STATE_CHANGE_EVENT, onStoreChange);
-  window.addEventListener("storage", onStorage);
-  return () => {
-    window.removeEventListener(SIDEBAR_STATE_CHANGE_EVENT, onStoreChange);
-    window.removeEventListener("storage", onStorage);
-  };
-}
-var AppShellContext = React3.createContext(null);
-function useAppShell() {
-  const context = React3.useContext(AppShellContext);
-  if (!context) {
-    throw new Error("useAppShell must be used within AppShell.");
-  }
-  return context;
-}
-function useMediaQuery(query) {
-  const [matches, setMatches] = React3.useState(false);
-  React3.useEffect(() => {
-    const media = window.matchMedia(query);
-    const sync = () => setMatches(media.matches);
-    sync();
-    media.addEventListener("change", sync);
-    return () => media.removeEventListener("change", sync);
-  }, [query]);
-  return matches;
-}
-function useSidebarOverflow() {
-  const contentRef = React3.useRef(null);
-  const subscribe = React3.useCallback((onStoreChange) => {
-    const element = contentRef.current;
-    if (!element) {
-      return () => void 0;
-    }
-    const handleScroll = () => onStoreChange();
-    element.addEventListener("scroll", handleScroll, { passive: true });
-    const resizeObserver = typeof ResizeObserver === "undefined" ? null : new ResizeObserver(onStoreChange);
-    resizeObserver?.observe(element);
-    window.addEventListener("resize", onStoreChange);
-    return () => {
-      element.removeEventListener("scroll", handleScroll);
-      resizeObserver?.disconnect();
-      window.removeEventListener("resize", onStoreChange);
-    };
-  }, []);
-  const getSnapshot = React3.useCallback(() => {
-    const element = contentRef.current;
-    if (!element) {
-      return 0;
-    }
-    const hasScrollBefore = element.scrollTop > 1;
-    const hasScrollAfter = element.scrollHeight - element.clientHeight - element.scrollTop > 1;
-    return (hasScrollBefore ? 1 : 0) | (hasScrollAfter ? 2 : 0);
-  }, []);
-  const scrollState = React3.useSyncExternalStore(
-    subscribe,
-    getSnapshot,
-    () => 0
-  );
-  return {
-    contentRef,
-    hasScrollBefore: Boolean(scrollState & 1),
-    hasScrollAfter: Boolean(scrollState & 2)
-  };
-}
-function AppShell({
-  defaultSidebarOpen = true,
-  headerLayout = "split",
-  children,
-  className,
-  style,
-  ...props
-}) {
-  const isMobile = useMediaQuery("(max-width: 1023px)");
-  const [sidebarOpen, setSidebarOpenState] = React3.useState(defaultSidebarOpen);
-  const [sidebarSide, setSidebarSide] = React3.useState("left");
-  const [mobileOpen, setMobileOpen] = React3.useState(false);
-  React3.useEffect(() => {
-    function syncSidebarOpen() {
-      setSidebarOpenState(readPersistedSidebarOpen() ?? defaultSidebarOpen);
-    }
-    const unsubscribe = subscribeToSidebarOpen(syncSidebarOpen);
-    queueMicrotask(syncSidebarOpen);
-    return unsubscribe;
-  }, [defaultSidebarOpen]);
-  const setSidebarOpen = React3.useCallback((open) => {
-    persistSidebarOpen(open);
-  }, []);
-  const toggleSidebar = React3.useCallback(() => {
-    if (isMobile) {
-      setMobileOpen((current) => !current);
-      return;
-    }
-    persistSidebarOpen(!sidebarOpen);
-  }, [isMobile, sidebarOpen]);
-  React3.useEffect(() => {
-    const onKeyDown = (event) => {
-      if (event.key.toLowerCase() === SIDEBAR_KEYBOARD_SHORTCUT && (event.metaKey || event.ctrlKey)) {
-        event.preventDefault();
-        toggleSidebar();
-      }
-    };
-    window.addEventListener("keydown", onKeyDown);
-    return () => window.removeEventListener("keydown", onKeyDown);
-  }, [toggleSidebar]);
-  const contextValue = React3.useMemo(
-    () => ({
-      sidebarState: sidebarOpen ? "expanded" : "collapsed",
-      sidebarSide,
-      setSidebarSide,
-      sidebarOpen,
-      setSidebarOpen,
-      mobileOpen,
-      setMobileOpen,
-      isMobile,
-      toggleSidebar
-    }),
-    [
-      isMobile,
-      mobileOpen,
-      setSidebarOpen,
-      sidebarOpen,
-      sidebarSide,
-      toggleSidebar
-    ]
-  );
-  return /* @__PURE__ */ jsx8(AppShellContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsx8(TooltipProvider, { delayDuration: 120, children: /* @__PURE__ */ jsx8(
-    "div",
-    {
-      "data-slot": "app-shell",
-      "data-sidebar-state": sidebarOpen ? "expanded" : "collapsed",
-      "data-sidebar-side": sidebarSide,
-      "data-header-layout": headerLayout,
-      suppressHydrationWarning: true,
-      className: cn(
-        "group/shell min-h-svh bg-canvas text-text-primary",
-        "[--ds-app-sidebar-width:var(--ds-sidebar-width)] [--ds-app-sidebar-width-mobile:var(--ds-sidebar-width-mobile)] data-[sidebar-state=collapsed]:[--ds-app-sidebar-width:3.5rem]",
-        className
-      ),
-      style,
-      ...props,
-      children
-    }
-  ) }) });
-}
-function AppSidebar({
-  side = "left",
-  variant = "auto",
-  className,
-  children,
-  title = "Application navigation",
-  description = "Primary product navigation.",
-  ...props
-}) {
-  const { mobileOpen, setMobileOpen, setSidebarSide } = useAppShell();
-  React3.useEffect(() => {
-    setSidebarSide(side);
-  }, [setSidebarSide, side]);
-  return /* @__PURE__ */ jsxs7(Fragment3, { children: [
-    /* @__PURE__ */ jsx8(Sheet, { side, open: mobileOpen, onOpenChange: setMobileOpen, children: /* @__PURE__ */ jsxs7(
-      SheetContent,
-      {
-        side,
-        "data-sidebar-variant": variant,
-        className: "w-[var(--ds-sidebar-width-mobile)] border-sidebar-border bg-sidebar-canvas p-0 text-sidebar-primary-text [&>[data-slot=sheet-close]]:right-3 [&>[data-slot=sheet-close]]:top-3 [&>[data-slot=sheet-close]]:text-sidebar-secondary-text [&>[data-slot=sheet-close]]:hover:text-sidebar-primary-text",
-        children: [
-          /* @__PURE__ */ jsxs7(SheetHeader, { className: "sr-only", children: [
-            /* @__PURE__ */ jsx8(SheetTitle, { children: title }),
-            /* @__PURE__ */ jsx8(SheetDescription, { children: description })
-          ] }),
-          /* @__PURE__ */ jsx8("div", { className: "flex h-full min-h-0 flex-col", children })
-        ]
-      }
-    ) }),
-    /* @__PURE__ */ jsx8(
-      "aside",
-      {
-        "data-slot": "app-sidebar",
-        "data-side": side,
-        "data-sidebar-variant": variant,
-        className: cn(
-          "fixed inset-y-0 z-20 hidden w-[var(--ds-app-sidebar-width)] shrink-0 flex-col border-sidebar-border bg-sidebar-canvas text-sidebar-primary-text transition-[width] duration-200 ease-linear lg:flex",
-          side === "left" ? "left-0 border-r" : "right-0 border-l",
-          "group-data-[sidebar-state=collapsed]/shell:w-[var(--ds-app-sidebar-width)]",
-          "group-data-[header-layout=integrated]/shell:top-[var(--ds-topbar-height)]",
-          className
-        ),
-        ...props,
-        children
-      }
-    )
-  ] });
-}
-function AppSidebarHeader({
-  className,
-  ...props
-}) {
-  return /* @__PURE__ */ jsx8(
-    "div",
-    {
-      "data-slot": "app-sidebar-header",
-      className: cn(
-        "flex min-h-[var(--ds-topbar-height)] min-w-0 shrink-0 items-center overflow-hidden border-b border-sidebar-border bg-sidebar-header px-3",
-        className
-      ),
-      ...props
-    }
-  );
-}
-function AppSidebarContent({
-  className,
-  ...props
-}) {
-  const { contentRef, hasScrollBefore, hasScrollAfter } = useSidebarOverflow();
-  return /* @__PURE__ */ jsx8(
-    "div",
-    {
-      "data-slot": "app-sidebar-content",
-      "data-scroll-before": hasScrollBefore ? "true" : void 0,
-      "data-scroll-after": hasScrollAfter ? "true" : void 0,
-      ref: contentRef,
-      className: cn(
-        "relative flex min-h-0 min-w-0 flex-1 flex-col gap-[var(--ds-sidebar-group-gap)] overflow-x-clip overflow-y-auto bg-sidebar-content px-[var(--ds-sidebar-content-padding-x)] py-[var(--ds-sidebar-content-padding-y)]",
-        className
-      ),
-      ...props
-    }
-  );
-}
-function AppSidebarFooter({
-  className,
-  ...props
-}) {
-  return /* @__PURE__ */ jsx8(
-    "div",
-    {
-      "data-slot": "app-sidebar-footer",
-      className: cn(
-        "mt-auto flex min-w-0 shrink-0 flex-col gap-2 overflow-hidden border-t border-sidebar-border bg-sidebar-footer p-[var(--ds-sidebar-footer-padding)]",
-        className
-      ),
-      ...props
-    }
-  );
-}
-function ProductIdentity({
-  label,
-  description,
-  icon,
-  collapsedLabel,
-  className
-}) {
-  return /* @__PURE__ */ jsxs7(
-    "div",
-    {
-      "data-slot": "product-identity",
-      className: cn("flex min-w-0 items-center gap-2", className),
-      children: [
-        icon ? /* @__PURE__ */ jsx8("div", { className: "flex size-7 shrink-0 items-center justify-center rounded-[var(--ds-radius-control)] bg-sidebar-hover text-sidebar-icon", children: icon }) : null,
-        collapsedLabel && !icon ? /* @__PURE__ */ jsx8("div", { className: "hidden shrink-0 items-center justify-center rounded-[var(--ds-radius-control)] bg-sidebar-hover px-2 py-1 text-xs font-semibold text-sidebar-primary-text group-data-[sidebar-state=collapsed]/shell:flex", children: collapsedLabel }) : null,
-        /* @__PURE__ */ jsxs7("div", { className: "min-w-0 group-data-[sidebar-state=collapsed]/shell:hidden", children: [
-          /* @__PURE__ */ jsx8("div", { className: "ds-type-navigation truncate font-semibold text-sidebar-primary-text", children: label }),
-          description ? /* @__PURE__ */ jsx8("div", { className: "ds-type-metadata truncate text-sidebar-metadata-text", children: description }) : null
-        ] })
-      ]
-    }
-  );
-}
-function SidebarSeparator({
-  className,
-  ...props
-}) {
-  return /* @__PURE__ */ jsx8(
-    Separator,
-    {
-      "data-slot": "app-sidebar-separator",
-      className: cn("bg-sidebar-border", className),
-      ...props
-    }
-  );
-}
-function NavigationGroup({
-  label,
-  count,
-  children,
-  className
-}) {
-  const labelId = React3.useId();
-  return /* @__PURE__ */ jsxs7(
-    "section",
-    {
-      "data-slot": "navigation-group",
-      "aria-labelledby": label ? labelId : void 0,
-      className: cn(
-        "flex min-w-0 flex-col gap-[var(--ds-sidebar-label-gap)]",
-        className
-      ),
-      children: [
-        label ? /* @__PURE__ */ jsxs7(
-          "div",
-          {
-            "data-slot": "navigation-group-label",
-            id: labelId,
-            className: "flex min-h-6 items-center gap-2 px-2 pb-0 pt-2 text-[length:var(--ds-sidebar-group-label-size)] font-semibold uppercase leading-[var(--ds-sidebar-group-label-line-height)] tracking-[0.04em] text-sidebar-group-label group-data-[sidebar-state=collapsed]/shell:hidden",
-            children: [
-              label,
-              count !== void 0 ? /* @__PURE__ */ jsx8("span", { className: "ds-type-metadata ml-auto shrink-0 font-medium normal-case tracking-normal text-sidebar-group-count", children: count }) : null
-            ]
-          }
-        ) : null,
-        /* @__PURE__ */ jsx8("div", { className: "flex min-w-0 flex-col gap-[var(--ds-sidebar-item-gap)]", children })
-      ]
-    }
-  );
-}
-function navigationItemClasses(active) {
-  return cn(
-    "ds-type-navigation flex min-h-[var(--ds-sidebar-item-height-touch)] min-w-0 cursor-pointer items-center gap-2 rounded-[var(--ds-radius-control)] px-2 font-medium text-sidebar-secondary-text outline-none transition-colors duration-150 lg:h-[var(--ds-sidebar-item-height)] lg:min-h-0",
-    "hover:bg-sidebar-hover hover:text-sidebar-primary-text",
-    "focus-visible:ring-[3px] focus-visible:ring-sidebar-focus-ring",
-    "disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 aria-disabled:pointer-events-none aria-disabled:cursor-not-allowed aria-disabled:opacity-50",
-    "group-data-[sidebar-state=collapsed]/shell:justify-center group-data-[sidebar-state=collapsed]/shell:px-0",
-    "[&>svg]:size-4 [&>svg]:shrink-0 [&>svg]:stroke-[1.75] [&>svg]:text-sidebar-icon",
-    active && "bg-sidebar-active-background font-semibold text-sidebar-active-foreground hover:bg-sidebar-active-background hover:text-sidebar-active-foreground [&>svg]:text-sidebar-active-foreground"
-  );
-}
-var NavigationItem = React3.forwardRef(
-  function NavigationItem2({
-    active = false,
-    tooltip,
-    render,
-    type,
-    "aria-expanded": ariaExpanded,
-    className,
-    children,
-    ...props
-  }, ref) {
-    const { sidebarState, sidebarSide, isMobile } = useAppShell();
-    const item = useRender({
-      defaultTagName: "button",
-      render,
-      ref,
-      props: {
-        "data-slot": "navigation-item",
-        "data-active": active ? "true" : void 0,
-        "aria-expanded": ariaExpanded,
-        type: render ? void 0 : type ?? "button",
-        className: cn(navigationItemClasses(active), className),
-        ...props,
-        ...render ? {} : { children }
-      }
-    });
-    if (!tooltip) {
-      return item;
-    }
-    return /* @__PURE__ */ jsxs7(Tooltip, { children: [
-      /* @__PURE__ */ jsx8(TooltipTrigger, { render: item }),
-      /* @__PURE__ */ jsx8(
-        TooltipContent,
-        {
-          side: sidebarSide === "left" ? "right" : "left",
-          align: "center",
-          hidden: sidebarState !== "collapsed" || isMobile,
-          children: tooltip
-        }
-      )
-    ] });
-  }
-);
-var NavigationSubItem = React3.forwardRef(
-  function NavigationSubItem2({
-    active = false,
-    render,
-    className,
-    ...props
-  }, ref) {
-    return useRender({
-      defaultTagName: "a",
-      render,
-      ref,
-      props: {
-        "data-slot": "navigation-sub-item",
-        "data-active": active ? "true" : void 0,
-        className: cn(
-          "ds-type-navigation flex min-h-[var(--ds-sidebar-item-height-touch)] min-w-0 cursor-pointer items-center gap-2 rounded-[var(--ds-radius-control)] px-2 text-sidebar-secondary-text outline-none transition-colors duration-150 lg:h-[calc(var(--ds-sidebar-item-height)-0.25rem)] lg:min-h-0",
-          "hover:bg-sidebar-hover hover:text-sidebar-primary-text focus-visible:ring-[3px] focus-visible:ring-sidebar-focus-ring",
-          "group-data-[sidebar-state=collapsed]/shell:hidden [&>svg]:size-4 [&>svg]:shrink-0 [&>svg]:stroke-[1.75] [&>svg]:text-sidebar-icon",
-          active && "bg-sidebar-active-background font-semibold text-sidebar-active-foreground hover:bg-sidebar-active-background hover:text-sidebar-active-foreground [&>svg]:text-sidebar-active-foreground",
-          className
-        ),
-        ...props
-      }
-    });
-  }
-);
-function NavigationSubList({
-  className,
-  ...props
-}) {
-  return /* @__PURE__ */ jsx8(
-    "div",
-    {
-      "data-slot": "navigation-sub-list",
-      className: cn(
-        "ml-4 flex min-w-0 flex-col gap-[var(--ds-sidebar-item-gap)] border-l border-sidebar-border pl-2 group-data-[sidebar-state=collapsed]/shell:hidden",
-        className
-      ),
-      ...props
-    }
-  );
-}
-function SidebarTrigger({
-  className,
-  "aria-label": ariaLabel,
-  onClick,
-  ...props
-}) {
-  const { isMobile, mobileOpen, sidebarOpen, toggleSidebar } = useAppShell();
-  const triggerProps = {
-    ...props,
-    "data-slot": "sidebar-trigger",
-    type: "button",
-    variant: "ghost",
-    className: cn(
-      "shrink-0 cursor-pointer text-text-supporting hover:bg-surface-muted hover:text-text-primary focus-visible:ring-focus",
-      className
-    ),
-    "aria-label": ariaLabel ?? "Toggle navigation",
-    "aria-expanded": isMobile ? mobileOpen : sidebarOpen,
-    onClick: (event) => {
-      onClick?.(event);
-      toggleSidebar();
-    }
-  };
-  return /* @__PURE__ */ jsxs7(IconButton, { ...triggerProps, children: [
-    /* @__PURE__ */ jsx8(PanelLeftIcon, {}),
-    /* @__PURE__ */ jsx8("span", { className: "sr-only", children: "Toggle navigation" })
-  ] });
-}
-function SidebarSearch({
-  expanded: expandedProp,
-  defaultExpanded = false,
-  onExpandedChange,
-  triggerLabel = "Search navigation",
-  shortcut,
-  className,
-  onKeyDown,
-  ...props
-}) {
-  const [expandedState, setExpandedState] = React3.useState(defaultExpanded);
-  const expanded = expandedProp ?? expandedState;
-  const inputRef = React3.useRef(null);
-  const triggerRef = React3.useRef(null);
-  const mountedRef = React3.useRef(false);
-  const setExpanded = React3.useCallback(
-    (nextExpanded) => {
-      if (expandedProp === void 0) {
-        setExpandedState(nextExpanded);
-      }
-      onExpandedChange?.(nextExpanded);
-    },
-    [expandedProp, onExpandedChange]
-  );
-  React3.useEffect(() => {
-    if (expanded) {
-      queueMicrotask(() => inputRef.current?.focus());
-    } else if (mountedRef.current) {
-      queueMicrotask(() => triggerRef.current?.focus());
-    }
-    mountedRef.current = true;
-  }, [expanded]);
-  if (!expanded) {
-    return /* @__PURE__ */ jsxs7(
-      "button",
-      {
-        ref: triggerRef,
-        type: "button",
-        "data-slot": "sidebar-search-trigger",
-        className: cn(
-          "ds-type-navigation flex min-h-[var(--ds-sidebar-item-height-touch)] w-full cursor-pointer items-center gap-2 rounded-[var(--ds-radius-control)] px-2 text-left font-medium text-sidebar-secondary-text outline-none transition-colors hover:bg-sidebar-hover hover:text-sidebar-primary-text focus-visible:ring-[3px] focus-visible:ring-sidebar-focus-ring lg:min-h-[var(--ds-sidebar-item-height)]",
-          "group-data-[sidebar-state=collapsed]/shell:justify-center group-data-[sidebar-state=collapsed]/shell:px-0",
-          className
-        ),
-        onClick: () => setExpanded(true),
-        "aria-label": triggerLabel,
-        children: [
-          /* @__PURE__ */ jsx8(Search, { className: "size-4 shrink-0 text-sidebar-icon" }),
-          /* @__PURE__ */ jsx8("span", { className: "truncate group-data-[sidebar-state=collapsed]/shell:hidden", children: triggerLabel }),
-          shortcut ? /* @__PURE__ */ jsx8(ShortcutHint, { className: "ds-type-metadata ml-auto border-sidebar-border bg-transparent text-sidebar-metadata-text group-data-[sidebar-state=collapsed]/shell:hidden", children: shortcut }) : null
-        ]
-      }
-    );
-  }
-  return /* @__PURE__ */ jsxs7(
-    "div",
-    {
-      "data-slot": "sidebar-search",
-      "data-expanded": "true",
-      className: cn(
-        "flex min-h-[var(--ds-sidebar-item-height-touch)] items-center gap-2 rounded-[var(--ds-radius-control)] border border-sidebar-border bg-sidebar-search px-2 text-sidebar-primary-text shadow-[var(--ds-shadow-raised)] lg:min-h-[var(--ds-sidebar-item-height)]",
-        className
-      ),
-      children: [
-        /* @__PURE__ */ jsx8(Search, { className: "size-4 shrink-0 text-sidebar-icon" }),
-        /* @__PURE__ */ jsx8(
-          Input,
-          {
-            ref: inputRef,
-            type: "search",
-            className: "ds-type-control h-auto min-w-0 flex-1 border-0 bg-transparent px-0 py-1 shadow-none focus-visible:border-0 focus-visible:ring-0",
-            onKeyDown: (event) => {
-              if (event.key === "Escape") {
-                event.preventDefault();
-                setExpanded(false);
-              }
-              onKeyDown?.(event);
-            },
-            ...props
-          }
-        ),
-        /* @__PURE__ */ jsx8(
-          "button",
-          {
-            type: "button",
-            "data-slot": "sidebar-search-close",
-            className: "grid size-7 shrink-0 cursor-pointer place-items-center rounded-[var(--ds-radius-control)] text-sidebar-secondary-text outline-none transition-colors hover:bg-sidebar-hover hover:text-sidebar-primary-text focus-visible:ring-2 focus-visible:ring-sidebar-focus-ring",
-            onClick: () => {
-              setExpanded(false);
-            },
-            "aria-label": "Close search",
-            children: /* @__PURE__ */ jsx8(X, { className: "size-4" })
-          }
-        )
-      ]
-    }
-  );
-}
-function MainRegion({
-  className,
-  ...props
-}) {
-  return /* @__PURE__ */ jsx8(
-    "div",
-    {
-      "data-slot": "main-region",
-      className: cn(
-        "flex min-h-svh min-w-0 w-full flex-1 flex-col transition-[padding] duration-200 ease-linear",
-        "group-data-[sidebar-side=left]/shell:lg:pl-[var(--ds-app-sidebar-width)] group-data-[sidebar-side=right]/shell:lg:pr-[var(--ds-app-sidebar-width)]",
-        "group-data-[header-layout=integrated]/shell:pt-[var(--ds-topbar-height)]",
-        className
-      ),
-      ...props
-    }
-  );
-}
-function AppHeader({
-  className,
-  ...props
-}) {
-  return /* @__PURE__ */ jsx8(
-    "header",
-    {
-      "data-slot": "app-header",
-      className: cn(
-        "fixed inset-x-0 top-0 z-30 flex h-[var(--ds-topbar-height)] min-h-[var(--ds-topbar-height)] items-center gap-2 border-b border-border-subtle bg-canvas/96 px-[var(--ds-topbar-padding-x)] backdrop-blur supports-[backdrop-filter]:bg-canvas/88 md:gap-3 md:px-[var(--ds-topbar-padding-x-wide)]",
-        className
-      ),
-      ...props
-    }
-  );
-}
-function AppHeaderStart({
-  className,
-  ...props
-}) {
-  return /* @__PURE__ */ jsx8(
-    "div",
-    {
-      "data-slot": "app-header-start",
-      className: cn("flex min-w-0 flex-1 items-center gap-2", className),
-      ...props
-    }
-  );
-}
-function AppHeaderSearch({
-  mobileTrigger,
-  children,
-  className,
-  ...props
-}) {
-  return /* @__PURE__ */ jsxs7(
-    "div",
-    {
-      "data-slot": "app-header-search",
-      className: cn("ml-auto flex shrink-0 items-center", className),
-      ...props,
-      children: [
-        /* @__PURE__ */ jsx8("div", { className: "hidden w-[min(22rem,32vw)] md:block", children }),
-        /* @__PURE__ */ jsx8("div", { className: "md:hidden", children: mobileTrigger })
-      ]
-    }
-  );
-}
-function AppHeaderActions({
-  className,
-  ...props
-}) {
-  return /* @__PURE__ */ jsx8(
-    "div",
-    {
-      "data-slot": "app-header-actions",
-      className: cn("flex shrink-0 items-center gap-1", className),
-      ...props
-    }
-  );
-}
-function TopBar({
-  className,
-  ...props
-}) {
-  return /* @__PURE__ */ jsx8(
-    "header",
-    {
-      "data-slot": "top-bar",
-      className: cn(
-        "sticky top-0 z-10 flex h-[var(--ds-topbar-height)] min-h-[var(--ds-topbar-height)] shrink-0 items-center justify-between gap-3 border-b border-border-subtle bg-canvas/96 px-[var(--ds-topbar-padding-x)] backdrop-blur md:px-[var(--ds-topbar-padding-x-wide)]",
-        "supports-[backdrop-filter]:bg-canvas/88",
-        className
-      ),
-      ...props
-    }
-  );
-}
-function PageFrame({
-  width = "full",
-  className,
-  ...props
-}) {
-  return /* @__PURE__ */ jsx8(
-    "main",
-    {
-      "data-slot": "page-frame",
-      "data-width": width,
-      className: cn(
-        "min-w-0 w-full flex-1 px-3 py-[var(--ds-space-section)] md:px-[var(--ds-space-page)]",
-        width === "wide" && "mx-auto w-full max-w-[86rem]",
-        width === "focused" && "mx-auto w-full max-w-[64rem]",
-        width === "reading" && "mx-auto w-full max-w-[48rem]",
-        className
-      ),
-      ...props
-    }
-  );
-}
-function PageContent({
-  className,
-  ...props
-}) {
-  return /* @__PURE__ */ jsx8(
-    "div",
-    {
-      "data-slot": "page-content",
-      className: cn("flex min-w-0 flex-col gap-[var(--ds-space-section)]", className),
-      ...props
-    }
-  );
-}
-function PageBoundary({
-  className,
-  ...props
-}) {
-  return /* @__PURE__ */ jsx8(
-    "div",
-    {
-      "data-slot": "page-boundary",
-      className: cn(
-        "rounded-[var(--ds-radius-surface)] border border-border-subtle bg-surface p-[var(--ds-surface-padding)]",
-        className
-      ),
-      ...props
-    }
-  );
-}
-function InspectorRegion({
-  className,
-  ...props
-}) {
-  return /* @__PURE__ */ jsx8(
-    "aside",
-    {
-      "data-slot": "inspector-region",
-      className: cn(
-        "w-full border-l border-border-subtle bg-surface md:w-[20rem] xl:w-[24rem]",
-        className
-      ),
-      ...props
-    }
-  );
-}
-
-// src/patterns/activity-list.tsx
-import { jsx as jsx9, jsxs as jsxs8 } from "react/jsx-runtime";
-function ActivityList({ className, ...props }) {
-  return /* @__PURE__ */ jsx9("div", { "data-slot": "activity-list", className: cn("divide-y divide-border-subtle", className), ...props });
-}
-function ActivityItem({
-  leading,
-  icon,
-  title,
-  description,
-  metadata,
-  trailing,
-  status,
-  layout = "standard",
-  className,
-  ...props
-}) {
-  const hasLeading = leading !== void 0 || icon !== void 0;
-  const resolvedTrailing = trailing ?? status;
-  return /* @__PURE__ */ jsxs8(
-    "div",
-    {
-      "data-slot": "activity-item",
-      "data-layout": layout,
-      className: cn(
-        "grid gap-3 py-3",
-        hasLeading && resolvedTrailing && "grid-cols-[auto_minmax(0,1fr)_auto]",
-        hasLeading && !resolvedTrailing && "grid-cols-[auto_minmax(0,1fr)]",
-        !hasLeading && resolvedTrailing && "grid-cols-[minmax(0,1fr)_auto]",
-        !hasLeading && !resolvedTrailing && "grid-cols-1",
-        layout === "compact" && "py-2",
-        className
-      ),
-      ...props,
-      children: [
-        leading !== void 0 ? /* @__PURE__ */ jsx9("div", { "data-slot": "activity-item-leading", className: "shrink-0", children: leading }) : icon !== void 0 ? /* @__PURE__ */ jsx9("div", { "data-slot": "activity-item-leading", className: "flex size-8 items-center justify-center rounded-md bg-neutral-background text-neutral-foreground [&_svg]:size-4", children: icon }) : null,
-        /* @__PURE__ */ jsxs8("div", { className: "min-w-0", children: [
-          /* @__PURE__ */ jsx9("div", { className: "ds-type-ui font-medium text-text-primary", children: title }),
-          description ? /* @__PURE__ */ jsx9("div", { className: "ds-type-ui mt-0.5 text-text-supporting", children: description }) : null,
-          metadata ? /* @__PURE__ */ jsx9("div", { className: "ds-type-metadata mt-1 text-text-supporting", children: metadata }) : null
-        ] }),
-        resolvedTrailing ? /* @__PURE__ */ jsx9("div", { "data-slot": "activity-item-trailing", className: "shrink-0", children: resolvedTrailing }) : null
-      ]
-    }
-  );
-}
-
-// src/patterns/attention-list.tsx
-import { CheckCircle2, CircleAlert, CircleX, Info } from "lucide-react";
-import { jsx as jsx10, jsxs as jsxs9 } from "react/jsx-runtime";
-function AttentionList({ className, ...props }) {
-  return /* @__PURE__ */ jsx10("ul", { "data-slot": "attention-list", className: cn("grid gap-2", className), ...props });
-}
-var toneClasses = {
-  neutral: "border-neutral-border bg-neutral-background text-neutral-foreground",
-  information: "border-information-border bg-information-background text-information-foreground",
-  success: "border-success-border bg-success-background text-success-foreground",
-  warning: "border-warning-border bg-warning-background text-warning-foreground",
-  danger: "border-danger-border bg-danger-background text-danger-foreground"
-};
-function AttentionItem({ title, description, metadata, action, tone = "neutral", severityLabel = `${tone[0].toUpperCase()}${tone.slice(1)}`, icon, className, ...props }) {
-  const Icon = tone === "danger" ? CircleX : tone === "warning" ? CircleAlert : tone === "success" ? CheckCircle2 : Info;
-  return /* @__PURE__ */ jsxs9("li", { "data-slot": "attention-item", "data-tone": tone, className: cn("grid grid-cols-[auto_minmax(0,1fr)_auto] items-start gap-3 rounded-[var(--ds-radius-control)] border px-3 py-2.5", toneClasses[tone], className), ...props, children: [
-    /* @__PURE__ */ jsx10("span", { className: "mt-0.5 [&>svg]:size-4", "aria-hidden": "true", children: icon ?? /* @__PURE__ */ jsx10(Icon, {}) }),
-    /* @__PURE__ */ jsxs9("div", { className: "min-w-0", children: [
-      /* @__PURE__ */ jsxs9("span", { className: "sr-only", children: [
-        severityLabel,
-        ": "
-      ] }),
-      /* @__PURE__ */ jsx10("div", { className: "ds-type-ui font-medium", children: title }),
-      description ? /* @__PURE__ */ jsx10("div", { className: "ds-type-metadata mt-0.5 opacity-85", children: description }) : null,
-      metadata ? /* @__PURE__ */ jsx10("div", { className: "ds-type-metadata mt-1 opacity-85", children: metadata }) : null
-    ] }),
-    action ? /* @__PURE__ */ jsx10("div", { className: "shrink-0", children: action }) : null
-  ] });
-}
-
-// src/patterns/confirmation-dialog.tsx
-import * as React4 from "react";
-import { jsx as jsx11, jsxs as jsxs10 } from "react/jsx-runtime";
-function ConfirmationDialog({ trigger, title, description, children, confirmLabel = "Confirm", cancelLabel = "Cancel", confirmVariant = "destructive", pending = false, onConfirm, onError }) {
-  const [open, setOpen] = React4.useState(false);
-  const [confirming, setConfirming] = React4.useState(false);
-  const isPending = pending || confirming;
-  async function confirm() {
-    if (isPending) {
-      return;
-    }
-    setConfirming(true);
-    try {
-      await onConfirm();
-      setOpen(false);
-    } catch (error) {
-      onError?.(error);
-    } finally {
-      setConfirming(false);
-    }
-  }
-  return /* @__PURE__ */ jsxs10(AlertDialog, { open, onOpenChange: setOpen, children: [
-    /* @__PURE__ */ jsx11(AlertDialogTrigger, { render: trigger, children: trigger }),
-    /* @__PURE__ */ jsxs10(AlertDialogContent, { children: [
-      /* @__PURE__ */ jsxs10(AlertDialogHeader, { children: [
-        /* @__PURE__ */ jsx11(AlertDialogTitle, { children: title }),
-        /* @__PURE__ */ jsx11(AlertDialogDescription, { children: description })
-      ] }),
-      /* @__PURE__ */ jsx11(AlertDialogBody, { children }),
-      /* @__PURE__ */ jsxs10(AlertDialogFooter, { children: [
-        /* @__PURE__ */ jsx11(AlertDialogCancel, { render: /* @__PURE__ */ jsx11(Button, { type: "button", variant: "outline", disabled: isPending }), children: cancelLabel }),
-        /* @__PURE__ */ jsx11(AlertDialogAction, { render: /* @__PURE__ */ jsx11(Button, { type: "button", variant: confirmVariant, disabled: isPending, onClick: confirm }), children: isPending ? "Working..." : confirmLabel })
-      ] })
-    ] })
-  ] });
-}
-
-// src/patterns/code-block.tsx
-import * as React5 from "react";
-import { Check, Copy } from "lucide-react";
-import { jsx as jsx12, jsxs as jsxs11 } from "react/jsx-runtime";
-function CodeBlock({
-  snippets,
-  defaultValue,
-  copyLabel = "Copy code",
-  className,
-  ...props
-}) {
-  const initialValue = defaultValue ?? snippets[0]?.value ?? "";
-  const [activeValue, setActiveValue] = React5.useState(initialValue);
-  const [copiedValue, setCopiedValue] = React5.useState(null);
-  const [copyError, setCopyError] = React5.useState(false);
-  const copyStatusId = React5.useId();
-  const activeSnippet = snippets.find((snippet) => snippet.value === activeValue) ?? snippets[0];
-  if (!activeSnippet) return null;
-  return /* @__PURE__ */ jsx12(
-    "div",
-    {
-      "data-slot": "code-block",
-      className: cn("overflow-hidden rounded-lg border border-border-subtle bg-surface", className),
-      ...props,
-      children: /* @__PURE__ */ jsxs11(Tabs, { value: activeSnippet.value, onValueChange: setActiveValue, variant: "segmented", className: "gap-0", children: [
-        /* @__PURE__ */ jsxs11("div", { className: "flex items-center justify-between gap-3 border-b border-border-subtle bg-surface-muted px-3 py-2", children: [
-          /* @__PURE__ */ jsx12(TabsList, { variant: "segmented", size: "compact", "aria-label": "Code language", children: snippets.map((snippet) => /* @__PURE__ */ jsx12(TabsTrigger, { value: snippet.value, children: snippet.label }, snippet.value)) }),
-          /* @__PURE__ */ jsxs11(
-            Button,
-            {
-              type: "button",
-              variant: "ghost",
-              size: "sm",
-              onClick: async () => {
-                try {
-                  await navigator.clipboard.writeText(activeSnippet.code);
-                  setCopiedValue(activeSnippet.value);
-                  setCopyError(false);
-                } catch {
-                  setCopiedValue(null);
-                  setCopyError(true);
-                }
-              },
-              "aria-describedby": copyStatusId,
-              children: [
-                copiedValue === activeSnippet.value ? /* @__PURE__ */ jsx12(Check, {}) : /* @__PURE__ */ jsx12(Copy, {}),
-                copiedValue === activeSnippet.value ? "Copied" : copyLabel
-              ]
-            }
-          ),
-          /* @__PURE__ */ jsx12("span", { id: copyStatusId, className: "sr-only", role: "status", "aria-live": "polite", children: copyError ? "Code could not be copied. Select the code and copy it manually." : copiedValue === activeSnippet.value ? "Code copied to clipboard." : "" })
-        ] }),
-        snippets.map((snippet) => /* @__PURE__ */ jsx12(TabsContent, { value: snippet.value, className: "m-0", children: /* @__PURE__ */ jsx12(
-          "pre",
-          {
-            "aria-label": `${snippet.label} code example`,
-            tabIndex: 0,
-            className: "max-h-[32rem] overflow-auto p-4 text-sm leading-6 outline-none focus-visible:ring-[3px] focus-visible:ring-inset focus-visible:ring-focus/50",
-            children: /* @__PURE__ */ jsx12("code", { children: snippet.code })
-          }
-        ) }, snippet.value))
-      ] })
-    }
-  );
-}
-
-// src/patterns/inventory-surface.tsx
-import { jsx as jsx13 } from "react/jsx-runtime";
-function InventorySurface({ className, ...props }) {
-  return /* @__PURE__ */ jsx13(
-    Card,
-    {
-      "data-slot": "inventory-surface",
-      className: cn("gap-0 overflow-hidden py-0", className),
-      ...props
-    }
-  );
-}
-function InventoryDesktop({ className, ...props }) {
-  return /* @__PURE__ */ jsx13("div", { "data-slot": "inventory-desktop", className: cn("hidden lg:block", className), ...props });
-}
-function InventoryMobile({ className, ...props }) {
-  return /* @__PURE__ */ jsx13("div", { "data-slot": "inventory-mobile", className: cn("divide-y divide-border-subtle lg:hidden", className), ...props });
-}
-
-// src/patterns/metric-band.tsx
-import { jsx as jsx14, jsxs as jsxs12 } from "react/jsx-runtime";
-function MetricBand({ columns = 4, className, ...props }) {
-  return /* @__PURE__ */ jsx14(
-    "div",
-    {
-      "data-slot": "metric-band",
-      "data-columns": columns,
-      className: cn(
-        "grid grid-cols-2 border-b border-border-subtle",
-        columns === 2 && "lg:grid-cols-2",
-        columns === 3 && "lg:grid-cols-3",
-        columns === 4 && "lg:grid-cols-4",
-        columns === 5 && "lg:grid-cols-5",
-        className
-      ),
-      ...props
-    }
-  );
-}
-function MetricBandItem({
-  label,
-  value,
-  detail,
-  icon,
-  iconClassName,
-  loading = false,
-  className,
-  ...props
-}) {
-  return /* @__PURE__ */ jsxs12(
-    "div",
-    {
-      "data-slot": "metric-band-item",
-      className: cn(
-        "flex min-h-28 flex-col items-start gap-3 border-r border-border-subtle p-4 last:border-r-0 sm:flex-row sm:items-center sm:gap-4 sm:p-5",
-        "[&:nth-child(-n+2)]:border-b lg:[&:nth-child(-n+2)]:border-b-0",
-        className
-      ),
-      ...props,
-      children: [
-        icon ? /* @__PURE__ */ jsx14(
-          "div",
-          {
-            className: cn(
-              "flex size-10 shrink-0 items-center justify-center rounded-md bg-neutral-background text-neutral-foreground [&_svg]:size-5",
-              iconClassName
-            ),
-            children: icon
-          }
-        ) : null,
-        /* @__PURE__ */ jsxs12("div", { className: "grid min-w-0 gap-1", children: [
-          /* @__PURE__ */ jsx14("div", { className: "ds-type-ui text-text-supporting", children: label }),
-          loading ? /* @__PURE__ */ jsx14(Skeleton, { className: "h-7 w-14" }) : /* @__PURE__ */ jsx14("div", { className: "text-2xl font-semibold tracking-tight", children: value ?? 0 }),
-          detail ? /* @__PURE__ */ jsx14("div", { className: "ds-type-metadata text-text-supporting", children: detail }) : null
-        ] })
-      ]
-    }
-  );
-}
-
-// src/patterns/metric-card.tsx
-import * as React6 from "react";
-import { ArrowDown as ArrowDown2, ArrowUp as ArrowUp2, Minus } from "lucide-react";
-import { Fragment as Fragment4, jsx as jsx15, jsxs as jsxs13 } from "react/jsx-runtime";
-function MetricTrend({
-  direction,
-  sentiment = "neutral",
-  value,
-  accessibleLabel,
-  className,
-  ...props
-}) {
-  const Icon = direction === "up" ? ArrowUp2 : direction === "down" ? ArrowDown2 : Minus;
-  return /* @__PURE__ */ jsxs13(
-    "span",
-    {
-      "data-slot": "metric-trend",
-      "data-direction": direction,
-      "data-sentiment": sentiment,
-      role: "img",
-      "aria-label": accessibleLabel,
-      className: cn(
-        "inline-flex items-center gap-1 ds-type-metadata font-medium text-trend-neutral",
-        sentiment === "positive" && "text-trend-positive",
-        sentiment === "negative" && "text-trend-negative",
-        className
-      ),
-      ...props,
-      children: [
-        /* @__PURE__ */ jsx15(Icon, { "aria-hidden": "true", className: "size-3.5 stroke-[2]" }),
-        /* @__PURE__ */ jsx15("span", { "aria-hidden": "true", children: value })
-      ]
-    }
-  );
-}
-function MetricCard({
-  label,
-  description,
-  value,
-  unit,
-  trend,
-  status,
-  emphasis = "supporting",
-  loading = false,
-  visualization,
-  visualizationSummary,
-  className,
-  ...props
-}) {
-  const labelId = React6.useId();
-  return /* @__PURE__ */ jsxs13(
-    "section",
-    {
-      "data-slot": "metric-card",
-      "data-emphasis": emphasis,
-      "aria-labelledby": labelId,
-      className: cn(
-        "flex min-w-0 flex-col overflow-hidden rounded-[var(--ds-radius-surface)] border border-border-default bg-surface text-text-primary shadow-[var(--ds-shadow-raised)]",
-        emphasis === "primary" ? "min-h-80" : "min-h-40",
-        className
-      ),
-      ...props,
-      children: [
-        /* @__PURE__ */ jsxs13("div", { className: "flex items-start justify-between gap-4 px-[var(--ds-surface-padding)] pt-[var(--ds-surface-padding)]", children: [
-          /* @__PURE__ */ jsxs13("div", { className: "min-w-0", children: [
-            /* @__PURE__ */ jsx15("h2", { id: labelId, className: "ds-type-card-title", children: label }),
-            description ? /* @__PURE__ */ jsx15("p", { className: "ds-type-metadata mt-0.5 text-text-supporting", children: description }) : null
-          ] }),
-          status ? /* @__PURE__ */ jsx15("div", { className: "shrink-0", children: status }) : null
-        ] }),
-        /* @__PURE__ */ jsxs13("div", { className: "flex flex-wrap items-baseline gap-x-2 gap-y-1 px-[var(--ds-surface-padding)] pt-3", children: [
-          loading ? /* @__PURE__ */ jsx15(Skeleton, { className: cn("h-8", emphasis === "primary" ? "w-24" : "w-16") }) : /* @__PURE__ */ jsxs13(Fragment4, { children: [
-            /* @__PURE__ */ jsx15("span", { className: cn("font-semibold tabular-nums tracking-tight", emphasis === "primary" ? "text-4xl" : "text-2xl"), children: value ?? 0 }),
-            unit ? /* @__PURE__ */ jsx15("span", { className: "ds-type-ui text-text-supporting", children: unit }) : null
-          ] }),
-          trend ? /* @__PURE__ */ jsx15("div", { className: "ml-1", children: trend }) : null
-        ] }),
-        visualization ? /* @__PURE__ */ jsxs13("figure", { className: "mt-auto min-h-0 flex-1 pt-4", children: [
-          /* @__PURE__ */ jsx15("div", { "data-slot": "metric-card-visualization", className: "h-full min-h-20 w-full", children: visualization }),
-          /* @__PURE__ */ jsx15("figcaption", { className: "sr-only", children: visualizationSummary })
-        ] }) : null
-      ]
-    }
-  );
-}
-
-// src/patterns/page-header.tsx
-import { jsx as jsx16, jsxs as jsxs14 } from "react/jsx-runtime";
-function PageHeader({
-  title,
-  description,
-  status,
-  metadata,
-  actions,
-  action,
-  actionNode,
-  className,
-  ...props
-}) {
-  const resolvedActions = actions ?? actionNode ?? (action ? /* @__PURE__ */ jsx16(
-    "a",
-    {
-      className: "ds-type-button inline-flex h-[var(--ds-control-height)] items-center justify-center gap-2 whitespace-nowrap rounded-md bg-action px-3 py-2 text-action-foreground shadow-xs outline-none transition-colors hover:bg-action-hover focus-visible:border-focus focus-visible:ring-3 focus-visible:ring-focus/50",
-      href: action.href,
-      children: action.label
-    }
-  ) : null);
-  return /* @__PURE__ */ jsxs14(
-    "header",
-    {
-      "data-slot": "page-header",
-      className: cn("flex flex-col gap-3 border-b border-border-subtle bg-canvas px-5 py-4 lg:flex-row lg:items-start lg:justify-between", className),
-      ...props,
-      children: [
-        /* @__PURE__ */ jsxs14("div", { className: "min-w-0", children: [
-          /* @__PURE__ */ jsxs14("div", { className: "flex min-w-0 flex-wrap items-center gap-2", children: [
-            /* @__PURE__ */ jsx16("h1", { className: "ds-type-page-title truncate", children: title }),
-            status
-          ] }),
-          description ? /* @__PURE__ */ jsx16("p", { className: "ds-type-ui mt-1 max-w-3xl text-text-supporting", children: description }) : null,
-          metadata ? /* @__PURE__ */ jsx16("div", { className: "ds-type-metadata mt-2 text-text-supporting", children: metadata }) : null
-        ] }),
-        resolvedActions ? /* @__PURE__ */ jsx16("div", { className: "flex shrink-0 flex-wrap items-center gap-2", children: resolvedActions }) : null
-      ]
-    }
-  );
-}
-
-// src/patterns/page-toolbar.tsx
-import { jsx as jsx17, jsxs as jsxs15 } from "react/jsx-runtime";
-function PageToolbar({
-  search,
-  filters,
-  viewControls,
-  bulkActions,
-  className,
-  children,
-  ...props
-}) {
-  return /* @__PURE__ */ jsxs15(
-    "div",
-    {
-      "data-slot": "page-toolbar",
-      className: cn("grid gap-2 border-b border-border-subtle bg-canvas px-5 py-3 lg:grid-cols-[minmax(0,1fr)_auto] lg:items-center", className),
-      ...props,
-      children: [
-        /* @__PURE__ */ jsxs15("div", { className: "flex min-w-0 flex-1 flex-col gap-2 sm:flex-row sm:items-center", children: [
-          search ? /* @__PURE__ */ jsx17("div", { className: "min-w-0 flex-1 sm:min-w-48 sm:max-w-sm", children: search }) : null,
-          filters ? /* @__PURE__ */ jsx17("div", { className: "flex w-full flex-col gap-2 sm:w-auto sm:flex-row sm:flex-wrap sm:items-center", children: filters }) : null
-        ] }),
-        /* @__PURE__ */ jsxs15("div", { className: "flex min-h-[var(--ds-control-height)] flex-wrap items-center gap-2 lg:justify-end", children: [
-          bulkActions ? /* @__PURE__ */ jsx17("div", { "data-slot": "page-toolbar-bulk-actions", className: "contents", children: bulkActions }) : null,
-          viewControls,
-          children
-        ] })
-      ]
-    }
-  );
-}
-
-// src/patterns/preference-controls.tsx
-import * as React7 from "react";
-import { jsx as jsx18, jsxs as jsxs16 } from "react/jsx-runtime";
-var APPEARANCE_KEY = "conscia-appearance:v1";
-var DENSITY_KEY = "conscia-density:v1";
-var PREFERENCE_EVENT = "conscia-preferences";
-var volatilePreferences = /* @__PURE__ */ new Map();
-function readPreference(key, fallback, allowedValues) {
-  if (typeof window === "undefined") {
-    return fallback;
-  }
-  try {
-    const value = window.localStorage.getItem(key) ?? volatilePreferences.get(key);
-    return value && allowedValues.includes(value) ? value : fallback;
-  } catch {
-    const value = volatilePreferences.get(key);
-    return value && allowedValues.includes(value) ? value : fallback;
-  }
-}
-function writePreference(key, value) {
-  volatilePreferences.set(key, value);
-  try {
-    window.localStorage.setItem(key, value);
-  } catch {
-  }
-  window.dispatchEvent(new Event(PREFERENCE_EVENT));
-}
-function useStoredPreference(key, fallback, allowedValues) {
-  return React7.useSyncExternalStore(
-    (onStoreChange) => {
-      window.addEventListener("storage", onStoreChange);
-      window.addEventListener(PREFERENCE_EVENT, onStoreChange);
-      return () => {
-        window.removeEventListener("storage", onStoreChange);
-        window.removeEventListener(PREFERENCE_EVENT, onStoreChange);
-      };
-    },
-    () => readPreference(key, fallback, allowedValues),
-    () => fallback
-  );
-}
-function useConsciaPreferences() {
-  const appearance = useStoredPreference(
-    APPEARANCE_KEY,
-    "system",
-    appearanceOptions
-  );
-  const density = useStoredPreference(
-    DENSITY_KEY,
-    "comfortable",
-    densityOptions
-  );
-  return { appearance, density };
-}
-function DesignSystemPreferenceSync() {
-  const { appearance, density } = useConsciaPreferences();
-  React7.useEffect(() => {
-    const media = window.matchMedia("(prefers-color-scheme: dark)");
-    const sync = () => applyConsciaPreferences(
-      document.documentElement,
-      appearance,
-      density,
-      media.matches
-    );
-    sync();
-    media.addEventListener("change", sync);
-    return () => media.removeEventListener("change", sync);
-  }, [appearance, density]);
-  return null;
-}
-function AppearanceControl({ className }) {
-  const { appearance } = useConsciaPreferences();
-  return /* @__PURE__ */ jsx18(
-    SegmentedControl,
-    {
-      className,
-      label: "Appearance",
-      value: appearance,
-      values: appearanceOptions,
-      onChange: (value) => writePreference(APPEARANCE_KEY, value)
-    }
-  );
-}
-function DensityControl({ className }) {
-  const { density } = useConsciaPreferences();
-  return /* @__PURE__ */ jsx18(
-    SegmentedControl,
-    {
-      className,
-      label: "Density",
-      value: density,
-      values: densityOptions,
-      onChange: (value) => writePreference(DENSITY_KEY, value)
-    }
-  );
-}
-function DesignPreferenceControls({ className }) {
-  return /* @__PURE__ */ jsxs16("div", { className: cn("flex flex-col gap-3 text-sm", className), children: [
-    /* @__PURE__ */ jsx18(AppearanceControl, {}),
-    /* @__PURE__ */ jsx18(DensityControl, {})
-  ] });
-}
-function SegmentedControl({
-  className,
-  label,
-  value,
-  values,
-  onChange
-}) {
-  return /* @__PURE__ */ jsxs16("fieldset", { className: cn("flex flex-col gap-2", className), children: [
-    /* @__PURE__ */ jsx18("legend", { className: "text-[var(--ds-metadata)] font-medium text-text-supporting", children: label }),
-    /* @__PURE__ */ jsx18("div", { className: "grid w-full grid-cols-3 rounded-[var(--ds-radius-control)] bg-surface-muted p-1", children: values.map((item) => /* @__PURE__ */ jsx18(
-      "button",
-      {
-        type: "button",
-        "aria-pressed": value === item,
-        suppressHydrationWarning: true,
-        onClick: () => onChange(item),
-        className: "min-w-0 h-7 rounded-[calc(var(--ds-radius-control)-2px)] px-1.5 text-[var(--ds-metadata)] font-medium capitalize text-text-supporting outline-none transition-colors hover:text-text-primary focus-visible:ring-[3px] focus-visible:ring-focus/50 aria-pressed:bg-canvas aria-pressed:text-text-primary aria-pressed:shadow-xs",
-        children: item
-      },
-      item
-    )) })
-  ] });
-}
-
-// src/patterns/provider-mark.tsx
-import { jsx as jsx19, jsxs as jsxs17 } from "react/jsx-runtime";
-function ProviderMark({ name, shortName, description, size = "default", className, ...props }) {
-  return /* @__PURE__ */ jsxs17("div", { "data-slot": "provider-mark", className: cn("flex min-w-0 items-center gap-3", className), ...props, children: [
-    /* @__PURE__ */ jsx19(
-      "div",
-      {
-        "aria-hidden": "true",
-        className: cn(
-          "flex shrink-0 items-center justify-center rounded-md border border-border-subtle bg-surface-muted font-semibold tracking-tight text-text-primary",
-          size === "sm" ? "size-8 text-[10px]" : "size-10 text-xs"
-        ),
-        children: shortName
-      }
-    ),
-    /* @__PURE__ */ jsxs17("div", { className: "min-w-0", children: [
-      /* @__PURE__ */ jsx19("div", { className: "ds-type-ui truncate font-medium text-text-primary", children: name }),
-      description ? /* @__PURE__ */ jsx19("div", { className: "ds-type-metadata mt-0.5 truncate text-text-supporting", children: description }) : null
-    ] })
-  ] });
-}
-
-// src/patterns/resource-detail.tsx
-import { jsx as jsx20, jsxs as jsxs18 } from "react/jsx-runtime";
-function ResourceSummary({
-  variant = "plain",
-  title,
-  description,
-  status,
-  metadata,
-  actions,
-  className,
-  children,
-  ...props
-}) {
-  return /* @__PURE__ */ jsxs18(
-    "section",
-    {
-      "data-slot": "resource-summary",
-      className: cn(
-        "px-5 py-4",
-        variant === "plain" && "border-b border-border-subtle bg-canvas",
-        variant === "surface" && "rounded-[var(--ds-radius-surface)] border border-border-subtle bg-surface",
-        className
-      ),
-      ...props,
-      children: [
-        /* @__PURE__ */ jsxs18("div", { className: "flex flex-col gap-3 lg:flex-row lg:items-start lg:justify-between", children: [
-          /* @__PURE__ */ jsxs18("div", { className: "min-w-0", children: [
-            title || status ? /* @__PURE__ */ jsxs18("div", { className: "flex min-w-0 flex-wrap items-center gap-2", children: [
-              title ? /* @__PURE__ */ jsx20("h2", { className: "ds-type-section-title truncate", children: title }) : null,
-              status
-            ] }) : null,
-            description ? /* @__PURE__ */ jsx20("p", { className: "ds-type-ui mt-1 max-w-3xl text-text-supporting", children: description }) : null,
-            metadata ? /* @__PURE__ */ jsx20("div", { className: "ds-type-metadata mt-2 text-text-supporting", children: metadata }) : null
-          ] }),
-          actions ? /* @__PURE__ */ jsx20("div", { className: "flex shrink-0 flex-wrap items-center gap-2", children: actions }) : null
-        ] }),
-        children ? /* @__PURE__ */ jsx20("div", { className: "mt-4", children }) : null
-      ]
-    }
-  );
-}
-function DetailSections({
-  className,
-  ...props
-}) {
-  return /* @__PURE__ */ jsx20(
-    "div",
-    {
-      "data-slot": "detail-sections",
-      className: cn("flex flex-col gap-[var(--ds-space-section)]", className),
-      ...props
-    }
-  );
-}
-function DetailSection({
-  variant = "surface",
-  title,
-  description,
-  actions,
-  className,
-  children,
-  ...props
-}) {
-  return /* @__PURE__ */ jsxs18(
-    "section",
-    {
-      "data-slot": "detail-section",
-      className: cn(
-        variant === "surface" && "rounded-[var(--ds-radius-surface)] border border-border-subtle bg-surface p-[var(--ds-surface-padding)]",
-        variant === "open" && "border-b border-border-subtle pb-[var(--ds-space-section)]",
-        className
-      ),
-      ...props,
-      children: [
-        /* @__PURE__ */ jsxs18("div", { className: "flex flex-col gap-2 sm:flex-row sm:items-start sm:justify-between", children: [
-          /* @__PURE__ */ jsxs18("div", { className: "min-w-0", children: [
-            /* @__PURE__ */ jsx20("h2", { className: "ds-type-section-title", children: title }),
-            description ? /* @__PURE__ */ jsx20("p", { className: "ds-type-ui mt-1 max-w-3xl text-text-supporting", children: description }) : null
-          ] }),
-          actions ? /* @__PURE__ */ jsx20("div", { className: "flex shrink-0 items-center gap-2", children: actions }) : null
-        ] }),
-        children ? /* @__PURE__ */ jsx20("div", { className: "mt-4", children }) : null
-      ]
-    }
-  );
-}
-function KeyValueList({
-  className,
-  ...props
-}) {
-  return /* @__PURE__ */ jsx20(
-    "dl",
-    {
-      "data-slot": "key-value-list",
-      className: cn("ds-type-ui grid gap-3", className),
-      ...props
-    }
-  );
-}
-function KeyValueItem({
-  label,
-  value,
-  breakValue = false
-}) {
-  return /* @__PURE__ */ jsxs18("div", { "data-slot": "key-value-item", className: "flex justify-between gap-4", children: [
-    /* @__PURE__ */ jsx20("dt", { className: "text-text-supporting", children: label }),
-    /* @__PURE__ */ jsx20(
-      "dd",
-      {
-        className: cn(
-          "text-right font-medium",
-          breakValue && "break-all"
-        ),
-        children: value
-      }
-    )
-  ] });
-}
-
-// src/patterns/sidebar-navigation.tsx
-import * as React8 from "react";
-import { ChevronRight as ChevronRight2 } from "lucide-react";
-import { Fragment as Fragment5, jsx as jsx21, jsxs as jsxs19 } from "react/jsx-runtime";
-function hasItems(entry) {
-  return "items" in entry;
-}
-function isStaticGroup(entry) {
-  return hasItems(entry) && entry.type === "group";
-}
-function isCollapsibleSection(entry) {
-  return hasItems(entry) && entry.type !== "group";
-}
-function getNavigationAccessibleLabel(item) {
-  const metadata = [item.badgeLabel, item.countLabel].filter(Boolean);
-  return metadata.length > 0 ? `${item.label}, ${metadata.join(", ")}` : item.label;
-}
-function NavigationMetadata({
-  badge,
-  count
-}) {
-  if (badge === void 0 && count === void 0) {
-    return null;
-  }
-  return /* @__PURE__ */ jsxs19(
-    "span",
-    {
-      "aria-hidden": "true",
-      className: "ml-auto flex min-w-0 shrink-0 items-center gap-1.5 text-sidebar-metadata-text",
-      children: [
-        badge !== void 0 ? /* @__PURE__ */ jsx21("span", { className: "max-w-28 truncate rounded-full bg-sidebar-hover px-1.5 py-0.5 text-[length:var(--ds-metadata)] font-semibold leading-none", children: badge }) : null,
-        count !== void 0 ? /* @__PURE__ */ jsx21("span", { className: "ds-type-metadata tabular-nums", children: count }) : null
-      ]
-    }
-  );
-}
-function NavigationItemContent({ item }) {
-  return /* @__PURE__ */ jsxs19(Fragment5, { children: [
-    item.icon,
-    !item.icon && item.collapsedLabel ? /* @__PURE__ */ jsx21("span", { className: "hidden shrink-0 font-semibold group-data-[sidebar-state=collapsed]/shell:inline", children: item.collapsedLabel }) : null,
-    /* @__PURE__ */ jsx21("span", { className: "truncate group-data-[sidebar-state=collapsed]/shell:hidden", children: item.label }),
-    /* @__PURE__ */ jsx21(NavigationMetadata, { badge: item.badge, count: item.count })
-  ] });
-}
-function readOpenSections(storageKey) {
-  if (!storageKey || typeof window === "undefined") {
-    return {};
-  }
-  try {
-    const storedValue = window.localStorage.getItem(storageKey);
-    if (!storedValue) {
-      return {};
-    }
-    const parsedValue = JSON.parse(storedValue);
-    return typeof parsedValue === "object" && parsedValue !== null ? parsedValue : {};
-  } catch {
-    return {};
-  }
-}
-function SidebarNavigation({
-  entries,
-  renderLink,
-  onNavigate,
-  storageKey,
-  className
-}) {
-  const { isMobile, setMobileOpen, sidebarSide, sidebarState } = useAppShell();
-  const [openSections, setOpenSections] = React8.useState({});
-  const storageReady = React8.useRef(false);
-  React8.useEffect(() => {
-    storageReady.current = false;
-    const storedSections = readOpenSections(storageKey);
-    queueMicrotask(() => {
-      storageReady.current = true;
-      setOpenSections(storedSections);
-    });
-  }, [storageKey]);
-  React8.useEffect(() => {
-    if (!storageReady.current || !storageKey || !entries.some(isCollapsibleSection)) {
-      return;
-    }
-    try {
-      window.localStorage.setItem(storageKey, JSON.stringify(openSections));
-    } catch {
-    }
-  }, [entries, openSections, storageKey]);
-  const handleNavigate = React8.useCallback(() => {
-    if (isMobile) {
-      setMobileOpen(false);
-    }
-    onNavigate?.();
-  }, [isMobile, onNavigate, setMobileOpen]);
-  return /* @__PURE__ */ jsx21(
-    "nav",
-    {
-      "data-slot": "sidebar-navigation",
-      "aria-label": "Primary navigation",
-      className: cn(
-        "flex flex-col gap-[var(--ds-sidebar-group-gap)]",
-        className
-      ),
-      children: entries.map((entry) => {
-        if (isStaticGroup(entry)) {
-          return /* @__PURE__ */ jsx21(NavigationGroup, { label: entry.label, count: entry.count, children: entry.items.map((item) => /* @__PURE__ */ jsx21(
-            NavigationItem,
-            {
-              active: item.active,
-              tooltip: item.label,
-              render: renderLink(item, {
-                "aria-current": item.active ? "page" : void 0,
-                "aria-label": getNavigationAccessibleLabel(item),
-                onClick: handleNavigate,
-                children: /* @__PURE__ */ jsx21(NavigationItemContent, { item })
-              })
-            },
-            item.id
-          )) }, entry.id);
-        }
-        if (!hasItems(entry)) {
-          return /* @__PURE__ */ jsx21(
-            NavigationGroup,
-            {
-              className: entry.startsSection ? "mt-[var(--ds-sidebar-group-gap)]" : void 0,
-              children: /* @__PURE__ */ jsx21(
-                NavigationItem,
-                {
-                  active: entry.active,
-                  tooltip: entry.label,
-                  render: renderLink(entry, {
-                    "aria-current": entry.active ? "page" : void 0,
-                    "aria-label": getNavigationAccessibleLabel(entry),
-                    onClick: handleNavigate,
-                    children: /* @__PURE__ */ jsx21(NavigationItemContent, { item: entry })
-                  })
-                }
-              )
-            },
-            entry.id
-          );
-        }
-        const activeChild = entry.items.some((item) => item.active);
-        const defaultOpen = entry.type === "submenu" ? entry.defaultOpen : false;
-        const legacyActive = entry.type === void 0 ? entry.active : false;
-        const sectionOpen = (openSections[entry.id] ?? defaultOpen) || activeChild || legacyActive;
-        if (sidebarState === "collapsed" && !isMobile) {
-          return /* @__PURE__ */ jsxs19(DropdownMenu, { children: [
-            /* @__PURE__ */ jsx21(
-              NavigationGroup,
-              {
-                className: entry.startsSection ? "mt-[var(--ds-sidebar-group-gap)]" : void 0,
-                children: /* @__PURE__ */ jsx21(
-                  DropdownMenuTrigger,
-                  {
-                    render: /* @__PURE__ */ jsxs19(
-                      NavigationItem,
-                      {
-                        "aria-label": `${getNavigationAccessibleLabel(entry)} menu`,
-                        className: activeChild ? "text-sidebar-primary-text" : void 0,
-                        children: [
-                          entry.icon,
-                          /* @__PURE__ */ jsx21("span", { className: "sr-only", children: entry.label })
-                        ]
-                      }
-                    )
-                  }
-                )
-              }
-            ),
-            /* @__PURE__ */ jsxs19(
-              DropdownMenuContent,
-              {
-                side: sidebarSide === "left" ? "right" : "left",
-                align: "start",
-                sideOffset: 8,
-                className: "min-w-56 rounded-[var(--ds-radius-surface)] p-1.5",
-                children: [
-                  /* @__PURE__ */ jsx21(DropdownMenuLabel, { className: "px-2 py-1.5 font-semibold text-text-supporting", children: entry.label }),
-                  /* @__PURE__ */ jsx21(DropdownMenuGroup, { children: entry.items.map((item) => /* @__PURE__ */ jsx21(
-                    DropdownMenuLinkItem,
-                    {
-                      closeOnClick: true,
-                      render: renderLink(item, {
-                        "aria-current": item.active ? "page" : void 0,
-                        "aria-label": getNavigationAccessibleLabel(item),
-                        onClick: handleNavigate,
-                        children: /* @__PURE__ */ jsxs19(Fragment5, { children: [
-                          item.icon,
-                          /* @__PURE__ */ jsx21("span", { className: "truncate", children: item.label }),
-                          /* @__PURE__ */ jsx21(NavigationMetadata, { badge: item.badge, count: item.count })
-                        ] })
-                      }),
-                      className: cn(
-                        "min-h-9 cursor-pointer rounded-[var(--ds-radius-control)] [&>svg]:size-4 [&>svg]:shrink-0 [&>svg]:stroke-[1.75]",
-                        item.active && "bg-selection-background font-semibold text-selection-foreground focus:bg-selection-background focus:text-selection-foreground"
-                      )
-                    },
-                    item.id
-                  )) })
-                ]
-              }
-            )
-          ] }, entry.id);
-        }
-        return /* @__PURE__ */ jsx21(
-          Collapsible,
-          {
-            open: sectionOpen,
-            onOpenChange: (open) => setOpenSections((current) => ({
-              ...current,
-              [entry.id]: open
-            })),
-            className: cn(
-              "group/collapsible",
-              entry.startsSection && "mt-2"
-            ),
-            children: /* @__PURE__ */ jsxs19(NavigationGroup, { children: [
-              /* @__PURE__ */ jsx21(
-                CollapsibleTrigger,
-                {
-                  render: /* @__PURE__ */ jsxs19(
-                    NavigationItem,
-                    {
-                      tooltip: entry.label,
-                      "aria-label": getNavigationAccessibleLabel(entry),
-                      className: activeChild ? "text-sidebar-primary-text" : void 0,
-                      children: [
-                        entry.icon,
-                        /* @__PURE__ */ jsx21("span", { className: "truncate group-data-[sidebar-state=collapsed]/shell:hidden", children: entry.label }),
-                        /* @__PURE__ */ jsx21(NavigationMetadata, { badge: entry.badge, count: entry.count }),
-                        /* @__PURE__ */ jsx21(ChevronRight2, { className: "ml-auto transition-transform duration-150 ease-out group-data-[sidebar-state=collapsed]/shell:hidden group-data-[open]/collapsible:rotate-90" })
-                      ]
-                    }
-                  )
-                }
-              ),
-              /* @__PURE__ */ jsx21(
-                CollapsibleContent,
-                {
-                  "data-slot": "sidebar-collapsible-content",
-                  className: "overflow-hidden",
-                  children: /* @__PURE__ */ jsx21(NavigationSubList, { children: entry.items.map((item) => /* @__PURE__ */ jsx21(
-                    NavigationSubItem,
-                    {
-                      active: item.active,
-                      render: renderLink(item, {
-                        "aria-current": item.active ? "page" : void 0,
-                        "aria-label": getNavigationAccessibleLabel(item),
-                        onClick: handleNavigate,
-                        children: /* @__PURE__ */ jsxs19(Fragment5, { children: [
-                          item.icon,
-                          /* @__PURE__ */ jsx21("span", { className: "truncate", children: item.label }),
-                          /* @__PURE__ */ jsx21(NavigationMetadata, { badge: item.badge, count: item.count })
-                        ] })
-                      })
-                    },
-                    item.id
-                  )) })
-                }
-              )
-            ] })
-          },
-          entry.id
-        );
-      })
-    }
-  );
-}
-
-// src/patterns/state-views.tsx
-import { jsx as jsx22, jsxs as jsxs20 } from "react/jsx-runtime";
-function StateView({ title, description, action, icon, className, ...props }) {
-  return /* @__PURE__ */ jsxs20(
-    "div",
-    {
-      "data-slot": "state-view",
-      className: cn("flex min-h-72 flex-col items-center justify-center gap-3 border-b px-6 py-12 text-center", className),
-      ...props,
-      children: [
-        icon ? /* @__PURE__ */ jsx22("div", { className: "flex size-10 items-center justify-center rounded-md bg-neutral-background text-neutral-foreground [&_svg]:size-5", children: icon }) : null,
-        /* @__PURE__ */ jsx22("h2", { className: "ds-type-section-title", children: title }),
-        description ? /* @__PURE__ */ jsx22("p", { className: "ds-type-ui max-w-md text-text-supporting", children: description }) : null,
-        action ? /* @__PURE__ */ jsx22("div", { className: "mt-1", children: action }) : null
-      ]
-    }
-  );
-}
-function LoadingRows({
-  rows = 6,
-  columns = 5
-}) {
-  return /* @__PURE__ */ jsx22("div", { "data-slot": "loading-rows", className: "border-b", children: Array.from({ length: rows }).map((_, index) => /* @__PURE__ */ jsx22(
-    "div",
-    {
-      className: "grid h-[var(--ds-row-height)] items-center gap-4 border-b px-5 last:border-b-0",
-      style: { gridTemplateColumns: `2fr repeat(${Math.max(columns - 1, 1)}, minmax(5rem, 1fr))` },
-      children: Array.from({ length: columns }).map((_2, columnIndex) => /* @__PURE__ */ jsx22(
-        "div",
-        {
-          className: cn(
-            "h-3 rounded bg-surface-muted",
-            columnIndex === 0 ? "w-44" : "w-24"
-          )
-        },
-        columnIndex
-      ))
-    },
-    index
-  )) });
-}
-function ErrorState({ title, description, action, className, ...props }) {
-  return /* @__PURE__ */ jsx22(
-    StateView,
-    {
-      title,
-      description,
-      action,
-      className: cn("bg-danger-background/60", className),
-      role: "alert",
-      "aria-live": "assertive",
-      ...props
-    }
-  );
-}
-
-// src/patterns/value-meter.tsx
-import * as React9 from "react";
-import { jsx as jsx23, jsxs as jsxs21 } from "react/jsx-runtime";
-function ValueMeter({
-  label,
-  value,
-  maximum,
-  valueLabel,
-  detail,
-  tone = "neutral",
-  className,
-  ...props
-}) {
-  const labelId = React9.useId();
-  const hasMaximum = typeof maximum === "number" && maximum > 0;
-  const boundedValue = hasMaximum ? Math.min(maximum, Math.max(0, value)) : value;
-  const percentage = hasMaximum ? boundedValue / maximum * 100 : null;
-  const resolvedValueLabel = valueLabel ?? (hasMaximum ? `${boundedValue} of ${maximum}` : String(boundedValue));
-  return /* @__PURE__ */ jsxs21(
-    "div",
-    {
-      "data-slot": "value-meter",
-      className: cn("grid gap-2", className),
-      ...props,
-      children: [
-        /* @__PURE__ */ jsxs21("div", { className: "flex items-baseline justify-between gap-4 text-sm", children: [
-          /* @__PURE__ */ jsx23("span", { id: labelId, className: "font-medium text-text-primary", children: label }),
-          /* @__PURE__ */ jsx23("span", { className: "text-text-supporting", children: resolvedValueLabel })
-        ] }),
-        percentage === null ? null : /* @__PURE__ */ jsx23(
-          "div",
-          {
-            role: "progressbar",
-            "aria-labelledby": labelId,
-            "aria-valuemin": 0,
-            "aria-valuemax": maximum ?? void 0,
-            "aria-valuenow": boundedValue,
-            className: "h-2 overflow-hidden rounded-full bg-surface-muted",
-            children: /* @__PURE__ */ jsx23(
-              "div",
-              {
-                className: cn(
-                  "h-full rounded-full bg-neutral-foreground transition-[width]",
-                  tone === "success" && "bg-success-foreground",
-                  tone === "warning" && "bg-warning-foreground",
-                  tone === "danger" && "bg-danger-foreground"
-                ),
-                style: { width: `${percentage}%` }
-              }
-            )
-          }
-        ),
-        detail ? /* @__PURE__ */ jsx23("div", { className: "text-xs text-text-supporting", children: detail }) : null
-      ]
-    }
-  );
-}
-
-// src/patterns/workbench.tsx
-import * as React10 from "react";
-import { jsx as jsx24, jsxs as jsxs22 } from "react/jsx-runtime";
-function WorkbenchShell({ className, ...props }) {
-  return /* @__PURE__ */ jsx24("div", { "data-slot": "workbench-shell", className: cn("min-w-0", className), ...props });
-}
-function WorkbenchRail({ variant = "secondary", open = true, className, ...props }) {
-  return /* @__PURE__ */ jsx24(
-    "aside",
-    {
-      "data-slot": "workbench-rail",
-      "data-variant": variant,
-      "data-open": open ? "true" : "false",
-      className: cn("min-w-0", className),
-      ...props
-    }
-  );
-}
-function WorkbenchMain({ className, ...props }) {
-  return /* @__PURE__ */ jsx24("main", { "data-slot": "workbench-main", className: cn("min-w-0", className), ...props });
-}
-function WorkbenchInspector({ className, ...props }) {
-  return /* @__PURE__ */ jsx24("aside", { "data-slot": "workbench-inspector", className: cn("min-w-0", className), ...props });
-}
-function WorkbenchMobileToolbar({ className, ...props }) {
-  return /* @__PURE__ */ jsx24("div", { "data-slot": "workbench-mobile-toolbar", className: cn(className), ...props });
-}
-function WorkbenchBackdrop({ open = true, className, ...props }) {
-  return /* @__PURE__ */ jsx24(
-    "button",
-    {
-      type: "button",
-      "data-slot": "workbench-backdrop",
-      "data-open": open ? "true" : "false",
-      className: cn(className),
-      ...props
-    }
-  );
-}
-function WorkbenchSection({ className, ...props }) {
-  return /* @__PURE__ */ jsx24("section", { "data-slot": "workbench-section", className: cn(className), ...props });
-}
-function WorkbenchSectionHeader({ title, metadata, action, className, ...props }) {
-  return /* @__PURE__ */ jsxs22("div", { "data-slot": "workbench-section-header", className: cn(className), ...props, children: [
-    /* @__PURE__ */ jsxs22("div", { "data-slot": "workbench-section-heading", children: [
-      /* @__PURE__ */ jsx24("h2", { children: title }),
-      metadata ? /* @__PURE__ */ jsx24("span", { children: metadata }) : null
-    ] }),
-    action ? /* @__PURE__ */ jsx24("div", { "data-slot": "workbench-section-action", children: action }) : null
-  ] });
-}
-function ResourceRow({ as = "div", href, selected = false, className, children, ...props }) {
-  return React10.createElement(
-    as,
-    {
-      ...props,
-      ...as === "a" && href ? { href } : {},
-      ...as === "button" ? { type: "button" } : {},
-      "data-slot": "resource-row",
-      "data-selected": selected ? "true" : "false",
-      className: cn(className)
-    },
-    children
-  );
-}
-function ResourceRowIcon({ className, ...props }) {
-  return /* @__PURE__ */ jsx24("span", { "data-slot": "resource-row-icon", className: cn(className), ...props });
-}
-function ResourceRowContent({ className, ...props }) {
-  return /* @__PURE__ */ jsx24("span", { "data-slot": "resource-row-content", className: cn(className), ...props });
-}
-function ResourceRowTitle({ className, ...props }) {
-  return /* @__PURE__ */ jsx24("strong", { "data-slot": "resource-row-title", className: cn(className), ...props });
-}
-function ResourceRowDescription({ className, ...props }) {
-  return /* @__PURE__ */ jsx24("span", { "data-slot": "resource-row-description", className: cn(className), ...props });
-}
-function ResourceRowMeta({ className, ...props }) {
-  return /* @__PURE__ */ jsx24("span", { "data-slot": "resource-row-meta", className: cn(className), ...props });
-}
-function WorkbenchInspectorSection({ label, action, className, children, ...props }) {
-  return /* @__PURE__ */ jsxs22("section", { "data-slot": "workbench-inspector-section", className: cn(className), ...props, children: [
-    /* @__PURE__ */ jsxs22("div", { "data-slot": "workbench-inspector-label", children: [
-      /* @__PURE__ */ jsx24("h3", { children: label }),
-      action ? /* @__PURE__ */ jsx24("div", { children: action }) : null
-    ] }),
-    children
-  ] });
-}
-function IdentityRow({ initials, name, detail, compact = false, className, ...props }) {
-  return /* @__PURE__ */ jsxs22("div", { "data-slot": "identity-row", "data-compact": compact ? "true" : "false", className: cn(className), ...props, children: [
-    /* @__PURE__ */ jsx24("span", { "data-slot": "identity-avatar", children: initials }),
-    /* @__PURE__ */ jsxs22("span", { "data-slot": "identity-copy", children: [
-      /* @__PURE__ */ jsx24("strong", { children: name }),
-      detail ? /* @__PURE__ */ jsx24("small", { children: detail }) : null
-    ] })
-  ] });
-}
-
-export {
-  PaginationControls,
-  DataTable,
-  EntityTable,
-  CommandPalette,
-  DataPanel,
-  DataPanelHeader,
-  DataPanelContent,
-  DataPanelFooter,
-  DetailBackLink,
-  FilterBar,
-  useAppShell,
-  AppShell,
-  AppSidebar,
-  AppSidebarHeader,
-  AppSidebarContent,
-  AppSidebarFooter,
-  ProductIdentity,
-  SidebarSeparator,
-  NavigationGroup,
-  NavigationItem,
-  NavigationSubItem,
-  NavigationSubList,
-  SidebarTrigger,
-  SidebarSearch,
-  MainRegion,
-  AppHeader,
-  AppHeaderStart,
-  AppHeaderSearch,
-  AppHeaderActions,
-  TopBar,
-  PageFrame,
-  PageContent,
-  PageBoundary,
-  InspectorRegion,
-  ActivityList,
-  ActivityItem,
-  AttentionList,
-  AttentionItem,
-  ConfirmationDialog,
-  CodeBlock,
-  InventorySurface,
-  InventoryDesktop,
-  InventoryMobile,
-  MetricBand,
-  MetricBandItem,
-  MetricTrend,
-  MetricCard,
-  PageHeader,
-  PageToolbar,
-  useConsciaPreferences,
-  DesignSystemPreferenceSync,
-  AppearanceControl,
-  DensityControl,
-  DesignPreferenceControls,
-  ProviderMark,
-  ResourceSummary,
-  DetailSections,
-  DetailSection,
-  KeyValueList,
-  KeyValueItem,
-  SidebarNavigation,
-  StateView,
-  LoadingRows,
-  ErrorState,
-  ValueMeter,
-  WorkbenchShell,
-  WorkbenchRail,
-  WorkbenchMain,
-  WorkbenchInspector,
-  WorkbenchMobileToolbar,
-  WorkbenchBackdrop,
-  WorkbenchSection,
-  WorkbenchSectionHeader,
-  ResourceRow,
-  ResourceRowIcon,
-  ResourceRowContent,
-  ResourceRowTitle,
-  ResourceRowDescription,
-  ResourceRowMeta,
-  WorkbenchInspectorSection,
-  IdentityRow
-};
-//# sourceMappingURL=chunk-OYJH5CVD.js.map