achery-ui 0.1.0 → 0.5.2

package/dist/index.cjs

@@ -1,6 +1,6 @@
 'use strict';
 
-var chunkSSWJ4EPA_cjs = require('./chunk-SSWJ4EPA.cjs');
+var chunkLJ24EJ3N_cjs = require('./chunk-LJ24EJ3N.cjs');
 var react = require('react');
 var jsxRuntime = require('react/jsx-runtime');
 var createRuntimeFn = require('@vanilla-extract/recipes/createRuntimeFn');
@@ -9,6 +9,8 @@ var RadixTabs = require('@radix-ui/react-tabs');
 var RadixTooltip = require('@radix-ui/react-tooltip');
 var RadixDialog = require('@radix-ui/react-dialog');
 var reactDom = require('react-dom');
+var RadixCheckbox = require('@radix-ui/react-checkbox');
+var RadixDropdownMenu = require('@radix-ui/react-dropdown-menu');
 
 function _interopNamespace(e) {
   if (e && e.__esModule) return e;
@@ -32,23 +34,61 @@ var RadixToggle__namespace = /*#__PURE__*/_interopNamespace(RadixToggle);
 var RadixTabs__namespace = /*#__PURE__*/_interopNamespace(RadixTabs);
 var RadixTooltip__namespace = /*#__PURE__*/_interopNamespace(RadixTooltip);
 var RadixDialog__namespace = /*#__PURE__*/_interopNamespace(RadixDialog);
+var RadixCheckbox__namespace = /*#__PURE__*/_interopNamespace(RadixCheckbox);
+var RadixDropdownMenu__namespace = /*#__PURE__*/_interopNamespace(RadixDropdownMenu);
 
+var STORAGE_KEY = "achery-theme-mode";
 var ThemeContext = react.createContext(null);
+function getSystemTheme() {
+  if (typeof window === "undefined") return "light";
+  return window.matchMedia("(prefers-color-scheme: dark)").matches ? "dark" : "light";
+}
+function resolveTheme(mode) {
+  return mode === "system" ? getSystemTheme() : mode;
+}
+function readStoredMode(fallback) {
+  try {
+    const stored = localStorage.getItem(STORAGE_KEY);
+    if (stored === "light" || stored === "dark" || stored === "system") return stored;
+  } catch {
+  }
+  return fallback;
+}
 function AcheryProvider({
   children,
-  defaultTheme = "light",
+  defaultTheme = "system",
   defaultAccent = "terracotta",
   className,
   style
 }) {
-  const [theme, setThemeState] = react.useState(defaultTheme);
+  const [mode, setModeState] = react.useState(() => readStoredMode(defaultTheme));
   const [accent, setAccentState] = react.useState(defaultAccent);
-  const setTheme = (next) => setThemeState(next);
-  const toggleTheme = () => setThemeState((t) => t === "light" ? "dark" : "light");
-  const setAccent = (next) => setAccentState(next);
+  const [resolvedTheme, setResolvedTheme] = react.useState(() => resolveTheme(readStoredMode(defaultTheme)));
+  const setTheme = react.useCallback((next) => {
+    setModeState(next);
+    setResolvedTheme(resolveTheme(next));
+    try {
+      localStorage.setItem(STORAGE_KEY, next);
+    } catch {
+    }
+  }, []);
+  const toggleTheme = react.useCallback(() => {
+    setTheme(resolvedTheme === "light" ? "dark" : "light");
+  }, [resolvedTheme, setTheme]);
+  const setAccent = react.useCallback((next) => setAccentState(next), []);
+  react.useEffect(() => {
+    if (mode !== "system") return;
+    const mq = window.matchMedia("(prefers-color-scheme: dark)");
+    const handler = (e) => {
+      setResolvedTheme(e.matches ? "dark" : "light");
+    };
+    mq.addEventListener("change", handler);
+    setResolvedTheme(mq.matches ? "dark" : "light");
+    return () => mq.removeEventListener("change", handler);
+  }, [mode]);
   react.useEffect(() => {
     const html = document.documentElement;
-    html.dataset["theme"] = theme;
+    html.dataset["theme"] = resolvedTheme;
     html.dataset["accent"] = accent;
     html.dataset["acheryRoot"] = "";
     return () => {
@@ -56,12 +96,12 @@ function AcheryProvider({
       delete html.dataset["accent"];
       delete html.dataset["acheryRoot"];
     };
-  }, [theme, accent]);
-  return /* @__PURE__ */ jsxRuntime.jsx(ThemeContext.Provider, { value: { theme, setTheme, toggleTheme, accent, setAccent }, children: /* @__PURE__ */ jsxRuntime.jsx(
+  }, [resolvedTheme, accent]);
+  return /* @__PURE__ */ jsxRuntime.jsx(ThemeContext.Provider, { value: { mode, theme: resolvedTheme, setTheme, toggleTheme, accent, setAccent }, children: /* @__PURE__ */ jsxRuntime.jsx(
     "div",
     {
       "data-achery-root": "",
-      "data-theme": theme,
+      "data-theme": resolvedTheme,
       "data-accent": accent,
       className,
       style,
@@ -286,6 +326,13 @@ function Wordmark(props) {
     /* @__PURE__ */ jsxRuntime.jsx("g", { transform: "translate(82,72)", fontFamily: "'Space Grotesk', sansSerif", fontWeight: "600", fontSize: "10", letterSpacing: "6", stroke: "none", children: /* @__PURE__ */ jsxRuntime.jsx("text", { x: "2", y: "0", children: "\u2014 W O R K S H O P \u2014" }) })
   ] });
 }
+function Menu(props) {
+  return /* @__PURE__ */ jsxRuntime.jsxs("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.8", strokeLinecap: "round", ...props, children: [
+    /* @__PURE__ */ jsxRuntime.jsx("line", { x1: "3", y1: "7", x2: "21", y2: "7" }),
+    /* @__PURE__ */ jsxRuntime.jsx("line", { x1: "3", y1: "12", x2: "21", y2: "12" }),
+    /* @__PURE__ */ jsxRuntime.jsx("line", { x1: "3", y1: "17", x2: "21", y2: "17" })
+  ] });
+}
 var glyphMap = {
   "arrow-right": ArrowRight,
   "arrow-up": ArrowUp,
@@ -304,6 +351,7 @@ var glyphMap = {
   "key": Key,
   "leaf": Leaf,
   "mark": Mark,
+  "menu": Menu,
   "mercury": Mercury,
   "minus": Minus,
   "moon": Moon,
@@ -457,7 +505,7 @@ function Toggle({
   defaultPressed,
   onPressedChange,
   disabled,
-  label: label3,
+  label: label4,
   className,
   "aria-label": ariaLabel
 }) {
@@ -474,7 +522,7 @@ function Toggle({
         children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: thumb })
       }
     ),
-    label3 && /* @__PURE__ */ jsxRuntime.jsx("span", { className: label, children: label3 })
+    label4 && /* @__PURE__ */ jsxRuntime.jsx("span", { className: label, children: label4 })
   ] });
 }
 
@@ -511,9 +559,9 @@ var searchInput = "Input_searchInput__6w3tiea Input_inputBase__6w3tie4";
 var searchWrapper = "Input_searchWrapper__6w3tie8";
 var selectInput = "Input_selectInput__6w3tie7 Input_inputBase__6w3tie4";
 var textarea = "Input_textarea__6w3tie6 Input_inputBase__6w3tie4";
-function Field({ label: label3, hint: hint2, error, children, className }) {
+function Field({ label: label4, hint: hint2, error, children, className }) {
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: [fieldRoot, className].filter(Boolean).join(" "), children: [
-    label3 && /* @__PURE__ */ jsxRuntime.jsx("label", { className: label2, children: label3 }),
+    label4 && /* @__PURE__ */ jsxRuntime.jsx("label", { className: label2, children: label4 }),
     children,
     error && /* @__PURE__ */ jsxRuntime.jsx("span", { className: errorText, children: error }),
     !error && hint2 && /* @__PURE__ */ jsxRuntime.jsx("span", { className: hint, children: hint2 })
@@ -590,34 +638,34 @@ function Card({
 var tab = "Tabs_tab__1b0xj9v1";
 var tabList = "Tabs_tabList__1b0xj9v0";
 var tabPanel = "Tabs_tabPanel__1b0xj9v2";
-function Tabs({ items, value, defaultValue, onValueChange, className }) {
+function Tabs({ items, value: value2, defaultValue, onValueChange, className }) {
   const resolvedDefault = defaultValue ?? items[0]?.value;
   return /* @__PURE__ */ jsxRuntime.jsxs(
     RadixTabs__namespace.Root,
     {
-      ...value !== void 0 ? { value } : {},
+      ...value2 !== void 0 ? { value: value2 } : {},
       ...resolvedDefault != null ? { defaultValue: resolvedDefault } : {},
       ...onValueChange !== void 0 ? { onValueChange } : {},
       ...className !== void 0 ? { className } : {},
       children: [
-        /* @__PURE__ */ jsxRuntime.jsx(RadixTabs__namespace.List, { className: tabList, children: items.map((item) => /* @__PURE__ */ jsxRuntime.jsx(
+        /* @__PURE__ */ jsxRuntime.jsx(RadixTabs__namespace.List, { className: tabList, children: items.map((item2) => /* @__PURE__ */ jsxRuntime.jsx(
           RadixTabs__namespace.Trigger,
           {
-            value: item.value,
-            disabled: item.disabled,
+            value: item2.value,
+            disabled: item2.disabled,
             className: tab,
-            children: item.label
+            children: item2.label
           },
-          item.value
+          item2.value
         )) }),
-        items.map((item) => /* @__PURE__ */ jsxRuntime.jsx(
+        items.map((item2) => /* @__PURE__ */ jsxRuntime.jsx(
           RadixTabs__namespace.Content,
           {
-            value: item.value,
+            value: item2.value,
             className: tabPanel,
-            children: item.content
+            children: item2.content
           },
-          item.value
+          item2.value
         ))
       ]
     }
@@ -658,71 +706,167 @@ function Tooltip({
 }
 
 // src/components/Sidebar/Sidebar.css.ts
-var footer = "Sidebar_footer__1n0xxfc5";
-var group = "Sidebar_group__1n0xxfc1";
-var groupLabel = "Sidebar_groupLabel__1n0xxfc2";
-var navItem = "Sidebar_navItem__1n0xxfc3";
-var navItemCount = "Sidebar_navItemCount__1n0xxfc4";
+var backdrop = "Sidebar_backdrop__1n0xxfc2";
+var collapseToggle = "Sidebar_collapseToggle__1n0xxfc3";
+var countAccent = "Sidebar_countAccent__1n0xxfc9";
+var footer = "Sidebar_footer__1n0xxfc8";
+var group = "Sidebar_group__1n0xxfc4";
+var groupLabel = "Sidebar_groupLabel__1n0xxfc5";
+var navItem = "Sidebar_navItem__1n0xxfc6";
+var navItemCount = "Sidebar_navItemCount__1n0xxfc7";
 var sidebar = "Sidebar_sidebar__1n0xxfc0";
-function Sidebar({ groups, activeId, onItemClick, footer: footer3, className }) {
-  return /* @__PURE__ */ jsxRuntime.jsxs("nav", { className: [sidebar, className].filter(Boolean).join(" "), children: [
-    groups.map((group2, i) => /* @__PURE__ */ jsxRuntime.jsx(
-      NavGroup,
-      {
-        label: group2.label,
-        items: group2.items,
-        activeId,
-        onItemClick
-      },
-      i
-    )),
-    footer3 && /* @__PURE__ */ jsxRuntime.jsx("div", { className: footer, children: footer3 })
-  ] });
+var sidebarMobile = "Sidebar_sidebarMobile__1n0xxfc1";
+function Sidebar({
+  groups,
+  activeId,
+  onItemClick,
+  renderLink,
+  footer: footer3,
+  collapsed,
+  onCollapsedChange,
+  mobileOpen,
+  onMobileOpenChange,
+  className
+}) {
+  const isMobileMode = mobileOpen !== void 0;
+  const nav = /* @__PURE__ */ jsxRuntime.jsxs(
+    "nav",
+    {
+      className: [
+        sidebar,
+        isMobileMode ? sidebarMobile : void 0,
+        className
+      ].filter(Boolean).join(" "),
+      "data-collapsed": collapsed ?? false,
+      "data-mobile-open": isMobileMode ? String(mobileOpen) : void 0,
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx(
+          "button",
+          {
+            className: collapseToggle,
+            onClick: () => onCollapsedChange?.(!collapsed),
+            "aria-label": collapsed ? "Expand sidebar" : "Collapse sidebar",
+            title: collapsed ? "Expand" : "Collapse",
+            children: collapsed ? "\u203A" : "\u2039"
+          }
+        ),
+        groups.map((group2, i) => /* @__PURE__ */ jsxRuntime.jsx(
+          NavGroup,
+          {
+            label: group2.label,
+            items: group2.items,
+            activeId,
+            onItemClick,
+            renderLink,
+            collapsed: collapsed ?? false
+          },
+          i
+        )),
+        footer3 && /* @__PURE__ */ jsxRuntime.jsx("div", { className: footer, children: footer3 })
+      ]
+    }
+  );
+  if (isMobileMode) {
+    return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+      mobileOpen && /* @__PURE__ */ jsxRuntime.jsx(
+        "div",
+        {
+          className: backdrop,
+          onClick: () => onMobileOpenChange?.(false),
+          "aria-hidden": "true"
+        }
+      ),
+      nav
+    ] });
+  }
+  return nav;
 }
-function NavGroup({ label: label3, items, activeId, onItemClick }) {
+function NavGroup({ label: label4, items, activeId, onItemClick, renderLink, collapsed }) {
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: group, children: [
-    label3 && /* @__PURE__ */ jsxRuntime.jsx("span", { className: groupLabel, children: label3 }),
-    items.map((item) => /* @__PURE__ */ jsxRuntime.jsx(
+    label4 && !collapsed && /* @__PURE__ */ jsxRuntime.jsx("span", { className: groupLabel, children: label4 }),
+    items.map((item2) => /* @__PURE__ */ jsxRuntime.jsx(
       NavItem,
       {
-        item,
-        active: item.id === activeId,
-        onClick: () => onItemClick?.(item.id)
+        item: item2,
+        active: item2.id === activeId,
+        onClick: () => onItemClick?.(item2.id),
+        renderLink,
+        collapsed
       },
-      item.id
+      item2.id
     ))
   ] });
 }
-function NavItem({ item, active, onClick }) {
+function NavItem({ item: item2, active, onClick, renderLink, collapsed }) {
   const glyphStyle = active ? { filter: "invert(1)" } : void 0;
-  if (item.href) {
-    return /* @__PURE__ */ jsxRuntime.jsxs(
-      "a",
+  const content3 = /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+    item2.glyph ? /* @__PURE__ */ jsxRuntime.jsx(Glyph, { name: item2.glyph, size: 14, style: glyphStyle, "aria-hidden": "true" }) : /* @__PURE__ */ jsxRuntime.jsx("span", {}),
+    !collapsed && /* @__PURE__ */ jsxRuntime.jsx("span", { children: item2.label }),
+    !collapsed && item2.count !== void 0 && /* @__PURE__ */ jsxRuntime.jsx("span", { className: item2.countTone === "accent" ? countAccent : navItemCount, children: item2.count })
+  ] });
+  const titleProp = collapsed ? { title: item2.label } : {};
+  if (item2.href) {
+    const LinkComponent = renderLink ?? "a";
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      LinkComponent,
       {
-        href: item.href,
+        href: item2.href,
         className: navItem,
         "data-active": active,
         "aria-current": active ? "page" : void 0,
-        children: [
-          item.glyph ? /* @__PURE__ */ jsxRuntime.jsx(Glyph, { name: item.glyph, size: 14, style: glyphStyle, "aria-hidden": "true" }) : /* @__PURE__ */ jsxRuntime.jsx("span", {}),
-          /* @__PURE__ */ jsxRuntime.jsx("span", { children: item.label }),
-          item.count !== void 0 && /* @__PURE__ */ jsxRuntime.jsx("span", { className: navItemCount, children: item.count })
-        ]
+        ...titleProp,
+        children: content3
       }
     );
   }
-  return /* @__PURE__ */ jsxRuntime.jsxs(
+  return /* @__PURE__ */ jsxRuntime.jsx(
     "button",
     {
       className: navItem,
       "data-active": active,
       onClick,
       "aria-current": active ? "page" : void 0,
-      children: [
-        item.glyph ? /* @__PURE__ */ jsxRuntime.jsx(Glyph, { name: item.glyph, size: 14, style: glyphStyle, "aria-hidden": "true" }) : /* @__PURE__ */ jsxRuntime.jsx("span", {}),
-        /* @__PURE__ */ jsxRuntime.jsx("span", { children: item.label }),
-        item.count !== void 0 && /* @__PURE__ */ jsxRuntime.jsx("span", { className: navItemCount, children: item.count })
-      ]
+      ...titleProp,
+      children: content3
+    }
+  );
+}
+
+// src/components/ProgressBar/ProgressBar.css.ts
+var fill = "ProgressBar_fill__1686i1k3";
+var fillTone = { neutral: "ProgressBar_fillTone_neutral__1686i1k4", accent: "ProgressBar_fillTone_accent__1686i1k5" };
+var track2 = "ProgressBar_track__1686i1k0";
+var trackSize = { sm: "ProgressBar_trackSize_sm__1686i1k1", md: "ProgressBar_trackSize_md__1686i1k2" };
+function ProgressBar({ value: value2, size = "md", tone = "neutral", className }) {
+  const pct = Math.min(100, Math.max(0, value2));
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      className: [track2, trackSize[size], className].filter(Boolean).join(" "),
+      role: "progressbar",
+      "aria-valuenow": pct,
+      "aria-valuemin": 0,
+      "aria-valuemax": 100,
+      children: /* @__PURE__ */ jsxRuntime.jsx(
+        "div",
+        {
+          className: [fill, fillTone[tone]].join(" "),
+          style: { width: `${pct}%` }
+        }
+      )
+    }
+  );
+}
+var avatar = createRuntimeFn.createRuntimeFn({ defaultClassName: "Avatar_avatar__16f6qlf0", variantClassNames: { size: { sm: "Avatar_avatar_size_sm__16f6qlf1", md: "Avatar_avatar_size_md__16f6qlf2", lg: "Avatar_avatar_size_lg__16f6qlf3" }, tone: { moss: "Avatar_avatar_tone_moss__16f6qlf4", neutral: "Avatar_avatar_tone_neutral__16f6qlf5" } }, defaultVariants: { size: "md", tone: "neutral" }, compoundVariants: [] });
+var initials = "Avatar_initials__16f6qlf6";
+function Avatar({ initials: initials2, size = "md", tone = "neutral", className }) {
+  const display2 = initials2.slice(0, 2).toUpperCase();
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "span",
+    {
+      className: [avatar({ size, tone }), className].filter(Boolean).join(" "),
+      "aria-label": `User: ${display2}`,
+      children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: initials, children: display2 })
     }
   );
 }
@@ -732,7 +876,6 @@ var accentPicker = "AppBar_accentPicker__uqki999";
 var accentSwatch = "AppBar_accentSwatch__uqki99a";
 var actions = "AppBar_actions__uqki998";
 var appBar = "AppBar_appBar__uqki990";
-var avatar = "AppBar_avatar__uqki99b";
 var brand = "AppBar_brand__uqki991";
 var brandDivider = "AppBar_brandDivider__uqki993";
 var brandName = "AppBar_brandName__uqki992";
@@ -753,9 +896,22 @@ function AppBar({
   isDark,
   avatarInitials,
   onNewClick,
+  onMenuClick,
+  onSearch,
+  onSearchFocus,
   className
 }) {
   return /* @__PURE__ */ jsxRuntime.jsxs("header", { className: [appBar, className].filter(Boolean).join(" "), children: [
+    onMenuClick && /* @__PURE__ */ jsxRuntime.jsx(
+      Button,
+      {
+        variant: "ghost",
+        size: "sm",
+        glyph: "menu",
+        onClick: onMenuClick,
+        "aria-label": "Open navigation menu"
+      }
+    ),
     /* @__PURE__ */ jsxRuntime.jsxs("div", { className: brand, children: [
       /* @__PURE__ */ jsxRuntime.jsx(Glyph, { name: "hex", size: 20, "aria-hidden": "true" }),
       /* @__PURE__ */ jsxRuntime.jsx("span", { className: brandName, children: brandName2 }),
@@ -772,13 +928,17 @@ function AppBar({
           type: "search",
           placeholder: searchPlaceholder,
           className: searchInput2,
-          "aria-label": "Search"
+          "aria-label": "Search",
+          onFocus: () => onSearchFocus?.(),
+          onKeyDown: (e) => {
+            if (e.key === "Enter") onSearch?.(e.target.value);
+          }
         }
       ),
       searchKbd2 && /* @__PURE__ */ jsxRuntime.jsx("span", { className: searchKbd, children: searchKbd2 })
     ] }),
     /* @__PURE__ */ jsxRuntime.jsxs("div", { className: actions, children: [
-      onAccentChange && /* @__PURE__ */ jsxRuntime.jsx("div", { className: accentPicker, role: "group", "aria-label": "Brand colour", children: chunkSSWJ4EPA_cjs.accentColorNames.map((name) => /* @__PURE__ */ jsxRuntime.jsx(
+      onAccentChange && /* @__PURE__ */ jsxRuntime.jsx("div", { className: accentPicker, role: "group", "aria-label": "Brand colour", children: chunkLJ24EJ3N_cjs.accentColorNames.map((name) => /* @__PURE__ */ jsxRuntime.jsx(
         "button",
         {
           className: accentSwatch,
@@ -786,7 +946,7 @@ function AppBar({
           onClick: () => onAccentChange(name),
           "aria-label": name,
           "aria-pressed": name === accent,
-          style: { background: chunkSSWJ4EPA_cjs.accentColors[name].main }
+          style: { background: chunkLJ24EJ3N_cjs.accentColors[name].main }
         },
         name
       )) }),
@@ -802,12 +962,14 @@ function AppBar({
       ),
       onNewClick && /* @__PURE__ */ jsxRuntime.jsx(Button, { variant: "accent", size: "sm", glyph: "plus", onClick: onNewClick, children: "New" }),
       actions2,
-      avatarInitials && /* @__PURE__ */ jsxRuntime.jsx("div", { className: avatar, "aria-label": `User: ${avatarInitials}`, children: avatarInitials.slice(0, 2).toUpperCase() })
+      avatarInitials && /* @__PURE__ */ jsxRuntime.jsx(Avatar, { initials: avatarInitials, size: "sm", tone: "neutral" })
     ] })
   ] });
 }
 
 // src/components/Table/Table.css.ts
+var emptyState = "Table_emptyState__1a2tbysa";
+var pagination = "Table_pagination__1a2tbysb";
 var sortIndicator = "Table_sortIndicator__1a2tbys5";
 var table = "Table_table__1a2tbys1";
 var tableWrapper = "Table_tableWrapper__1a2tbys0";
@@ -816,6 +978,7 @@ var tdMono = "Table_tdMono__1a2tbys8 Table_td__1a2tbys7";
 var th = "Table_th__1a2tbys3";
 var thSortable = "Table_thSortable__1a2tbys4 Table_th__1a2tbys3";
 var thead = "Table_thead__1a2tbys2";
+var toolbar = "Table_toolbar__1a2tbys9";
 var tr = "Table_tr__1a2tbys6";
 function Table({
   columns,
@@ -828,6 +991,12 @@ function Table({
   defaultSortKey,
   defaultSortDir = null,
   onSortChange,
+  pageIndex = 0,
+  pageSize,
+  totalRows,
+  onPageChange,
+  toolbar: toolbar2,
+  emptyState: emptyState2,
   className
 }) {
   const [internalSortKey, setInternalSortKey] = react.useState(defaultSortKey ?? null);
@@ -858,43 +1027,79 @@ function Table({
       return activeSortDir === "asc" ? cmp : -cmp;
     });
   }, [data, activeSortKey, activeSortDir]);
-  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: [tableWrapper, className].filter(Boolean).join(" "), children: /* @__PURE__ */ jsxRuntime.jsxs("table", { className: table, children: [
-    /* @__PURE__ */ jsxRuntime.jsx("thead", { className: thead, children: /* @__PURE__ */ jsxRuntime.jsx("tr", { children: columns.map((col) => /* @__PURE__ */ jsxRuntime.jsxs(
-      "th",
-      {
-        className: col.sortable ? thSortable : th,
-        style: col.width ? { width: col.width } : void 0,
-        onClick: col.sortable ? () => handleSort(col.key) : void 0,
-        "aria-sort": activeSortKey === col.key ? activeSortDir === "asc" ? "ascending" : "descending" : void 0,
-        children: [
-          col.label,
-          col.sortable && activeSortKey === col.key && activeSortDir && /* @__PURE__ */ jsxRuntime.jsx("span", { className: sortIndicator, "aria-hidden": "true", children: /* @__PURE__ */ jsxRuntime.jsx(Glyph, { name: activeSortDir === "asc" ? "arrow-up" : "arrow-right", size: 10 }) })
-        ]
-      },
-      col.key
-    )) }) }),
-    /* @__PURE__ */ jsxRuntime.jsx("tbody", { children: sortedData.map((row) => {
-      const key = rowKey(row);
-      const isSelected = selectedKeys?.includes(key) ?? false;
-      return /* @__PURE__ */ jsxRuntime.jsx(
-        "tr",
+  const totalPages = pageSize && totalRows ? Math.ceil(totalRows / pageSize) : null;
+  const isFirstPage = pageIndex === 0;
+  const isLastPage = totalPages !== null ? pageIndex >= totalPages - 1 : true;
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: [tableWrapper, className].filter(Boolean).join(" "), children: [
+    toolbar2 && /* @__PURE__ */ jsxRuntime.jsx("div", { className: toolbar, children: toolbar2 }),
+    /* @__PURE__ */ jsxRuntime.jsxs("table", { className: table, children: [
+      /* @__PURE__ */ jsxRuntime.jsx("thead", { className: thead, children: /* @__PURE__ */ jsxRuntime.jsx("tr", { children: columns.map((col) => /* @__PURE__ */ jsxRuntime.jsxs(
+        "th",
         {
-          className: tr,
-          "data-selected": isSelected,
-          onClick: onRowClick ? () => onRowClick(key, row) : void 0,
-          style: onRowClick ? { cursor: "pointer" } : void 0,
-          children: columns.map((col) => /* @__PURE__ */ jsxRuntime.jsx("td", { className: col.mono ? tdMono : td, children: col.render ? col.render(row) : String(row[col.key] ?? "") }, col.key))
+          className: col.sortable ? thSortable : th,
+          style: col.width ? { width: col.width } : void 0,
+          onClick: col.sortable ? () => handleSort(col.key) : void 0,
+          "aria-sort": activeSortKey === col.key ? activeSortDir === "asc" ? "ascending" : "descending" : void 0,
+          children: [
+            col.label,
+            col.sortable && activeSortKey === col.key && activeSortDir && /* @__PURE__ */ jsxRuntime.jsx("span", { className: sortIndicator, "aria-hidden": "true", children: /* @__PURE__ */ jsxRuntime.jsx(Glyph, { name: activeSortDir === "asc" ? "arrow-up" : "arrow-right", size: 10 }) })
+          ]
         },
-        key
-      );
-    }) })
-  ] }) });
+        col.key
+      )) }) }),
+      /* @__PURE__ */ jsxRuntime.jsx("tbody", { children: data.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("tr", { children: /* @__PURE__ */ jsxRuntime.jsx("td", { colSpan: columns.length, children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: emptyState, children: emptyState2 ?? "No data." }) }) }) : sortedData.map((row) => {
+        const key = rowKey(row);
+        const isSelected = selectedKeys?.includes(key) ?? false;
+        return /* @__PURE__ */ jsxRuntime.jsx(
+          "tr",
+          {
+            className: tr,
+            "data-selected": isSelected,
+            onClick: onRowClick ? () => onRowClick(key, row) : void 0,
+            style: onRowClick ? { cursor: "pointer" } : void 0,
+            children: columns.map((col) => /* @__PURE__ */ jsxRuntime.jsx("td", { className: col.mono ? tdMono : td, children: col.render ? col.render(row) : String(row[col.key] ?? "") }, col.key))
+          },
+          key
+        );
+      }) })
+    ] }),
+    pageSize && totalPages !== null && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: pagination, children: [
+      /* @__PURE__ */ jsxRuntime.jsx(
+        Button,
+        {
+          variant: "ghost",
+          size: "sm",
+          glyph: "arrow-right",
+          onClick: () => onPageChange?.(pageIndex - 1),
+          disabled: isFirstPage,
+          "aria-label": "Previous page",
+          style: { transform: "rotate(180deg)" }
+        }
+      ),
+      /* @__PURE__ */ jsxRuntime.jsxs("span", { children: [
+        "Page ",
+        pageIndex + 1,
+        " of ",
+        totalPages
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsx(
+        Button,
+        {
+          variant: "ghost",
+          size: "sm",
+          glyph: "arrow-right",
+          onClick: () => onPageChange?.(pageIndex + 1),
+          disabled: isLastPage,
+          "aria-label": "Next page"
+        }
+      )
+    ] })
+  ] });
 }
-
-// src/components/Modal/Modal.css.ts
 var body2 = "Modal_body__1kcb5si8";
+var bodyScrollable = "Modal_bodyScrollable__1kcb5sie";
 var closeButton = "Modal_closeButton__1kcb5si7";
-var content2 = "Modal_content__1kcb5si3";
+var contentSized = createRuntimeFn.createRuntimeFn({ defaultClassName: "Modal_contentSized__1kcb5sia", variantClassNames: { size: { sm: "Modal_contentSized_size_sm__1kcb5sib", md: "Modal_contentSized_size_md__1kcb5sic", lg: "Modal_contentSized_size_lg__1kcb5sid" } }, defaultVariants: { size: "sm" }, compoundVariants: [] });
 var description = "Modal_description__1kcb5si6";
 var footer2 = "Modal_footer__1kcb5si9";
 var header = "Modal_header__1kcb5si4";
@@ -908,7 +1113,9 @@ function Modal({
   description: description2,
   children,
   footer: footer3,
-  trigger,
+  trigger: trigger2,
+  size = "sm",
+  scrollable = false,
   className
 }) {
   return /* @__PURE__ */ jsxRuntime.jsxs(
@@ -918,13 +1125,13 @@ function Modal({
       ...defaultOpen !== void 0 ? { defaultOpen } : {},
       ...onOpenChange !== void 0 ? { onOpenChange } : {},
       children: [
-        trigger && /* @__PURE__ */ jsxRuntime.jsx(RadixDialog__namespace.Trigger, { asChild: true, children: trigger }),
+        trigger2 && /* @__PURE__ */ jsxRuntime.jsx(RadixDialog__namespace.Trigger, { asChild: true, children: trigger2 }),
         /* @__PURE__ */ jsxRuntime.jsxs(RadixDialog__namespace.Portal, { children: [
           /* @__PURE__ */ jsxRuntime.jsx(RadixDialog__namespace.Overlay, { className: overlay }),
           /* @__PURE__ */ jsxRuntime.jsxs(
             RadixDialog__namespace.Content,
             {
-              className: [content2, className].filter(Boolean).join(" "),
+              className: [contentSized({ size }), className].filter(Boolean).join(" "),
               "aria-describedby": description2 ? "modal-description" : void 0,
               children: [
                 /* @__PURE__ */ jsxRuntime.jsxs("div", { className: header, children: [
@@ -934,7 +1141,7 @@ function Modal({
                   ] }),
                   /* @__PURE__ */ jsxRuntime.jsx(RadixDialog__namespace.Close, { className: closeButton, "aria-label": "Close", children: /* @__PURE__ */ jsxRuntime.jsx(Glyph, { name: "cross", size: 14, "aria-hidden": "true" }) })
                 ] }),
-                /* @__PURE__ */ jsxRuntime.jsx("div", { className: body2, children }),
+                /* @__PURE__ */ jsxRuntime.jsx("div", { className: scrollable ? bodyScrollable : body2, children }),
                 footer3 && /* @__PURE__ */ jsxRuntime.jsx("div", { className: footer2, children: footer3 })
               ]
             }
@@ -995,30 +1202,621 @@ function ToastProvider({ children }) {
   ] });
 }
 
+// src/components/Checkbox/Checkbox.css.ts
+var indicator = "Checkbox_indicator__nnmycq2";
+var label3 = "Checkbox_label__nnmycq3";
+var root = "Checkbox_root__nnmycq1";
+var wrapper2 = "Checkbox_wrapper__nnmycq0";
+function Checkbox({
+  checked,
+  defaultChecked,
+  onChange,
+  disabled,
+  label: label4,
+  id,
+  className,
+  "aria-label": ariaLabel
+}) {
+  const resolvedId = id ?? (label4 ? `checkbox-${Math.random().toString(36).slice(2, 7)}` : void 0);
+  return /* @__PURE__ */ jsxRuntime.jsxs("span", { className: [wrapper2, className].filter(Boolean).join(" "), "data-disabled": disabled || void 0, children: [
+    /* @__PURE__ */ jsxRuntime.jsx(
+      RadixCheckbox__namespace.Root,
+      {
+        ...checked !== void 0 ? { checked } : {},
+        ...defaultChecked !== void 0 ? { defaultChecked } : {},
+        ...onChange !== void 0 ? { onCheckedChange: onChange } : {},
+        ...disabled !== void 0 ? { disabled } : {},
+        ...ariaLabel !== void 0 ? { "aria-label": ariaLabel } : {},
+        ...resolvedId !== void 0 ? { id: resolvedId } : {},
+        className: root,
+        children: /* @__PURE__ */ jsxRuntime.jsx(RadixCheckbox__namespace.Indicator, { className: indicator, children: checked === "indeterminate" ? /* @__PURE__ */ jsxRuntime.jsx("svg", { width: "10", height: "2", viewBox: "0 0 10 2", fill: "currentColor", children: /* @__PURE__ */ jsxRuntime.jsx("rect", { width: "10", height: "2", rx: "1" }) }) : /* @__PURE__ */ jsxRuntime.jsx("svg", { width: "10", height: "8", viewBox: "0 0 10 8", fill: "none", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round", children: /* @__PURE__ */ jsxRuntime.jsx("polyline", { points: "1,4 4,7 9,1" }) }) })
+      }
+    ),
+    label4 && /* @__PURE__ */ jsxRuntime.jsx("label", { htmlFor: resolvedId, className: label3, style: { cursor: disabled ? "not-allowed" : "pointer" }, children: label4 })
+  ] });
+}
+
+// src/components/Menu/Menu.css.ts
+var content2 = "Menu_content__wszp3g0";
+var item = "Menu_item__wszp3g1";
+var itemDanger = "Menu_itemDanger__wszp3g2";
+var itemGlyph = "Menu_itemGlyph__wszp3g4";
+var separator = "Menu_separator__wszp3g3";
+function Menu2({ trigger: trigger2, items, side = "bottom", align = "end", className }) {
+  return /* @__PURE__ */ jsxRuntime.jsxs(RadixDropdownMenu__namespace.Root, { children: [
+    /* @__PURE__ */ jsxRuntime.jsx(RadixDropdownMenu__namespace.Trigger, { asChild: true, children: trigger2 }),
+    /* @__PURE__ */ jsxRuntime.jsx(RadixDropdownMenu__namespace.Portal, { children: /* @__PURE__ */ jsxRuntime.jsx(
+      RadixDropdownMenu__namespace.Content,
+      {
+        side,
+        align,
+        sideOffset: 6,
+        className: [content2, className].filter(Boolean).join(" "),
+        children: items.map((item2) => {
+          if ("type" in item2 && item2.type === "separator") {
+            return /* @__PURE__ */ jsxRuntime.jsx(RadixDropdownMenu__namespace.Separator, { className: separator }, item2.id);
+          }
+          const def = item2;
+          return /* @__PURE__ */ jsxRuntime.jsxs(
+            RadixDropdownMenu__namespace.Item,
+            {
+              ...def.disabled !== void 0 ? { disabled: def.disabled } : {},
+              onSelect: def.onSelect,
+              className: [item, def.danger ? itemDanger : ""].filter(Boolean).join(" "),
+              children: [
+                def.glyph && /* @__PURE__ */ jsxRuntime.jsx(Glyph, { name: def.glyph, size: 14, className: itemGlyph }),
+                def.label
+              ]
+            },
+            def.id
+          );
+        })
+      }
+    ) })
+  ] });
+}
+
+// src/components/DatePicker/DatePicker.css.ts
+var input = "DatePicker_input__1etdrw70";
+function DatePicker({
+  type = "date",
+  value: value2,
+  onChange,
+  min,
+  max,
+  disabled,
+  error,
+  placeholder,
+  className,
+  ...rest
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "input",
+    {
+      type,
+      value: value2,
+      onChange,
+      min,
+      max,
+      disabled,
+      placeholder,
+      "data-error": error || void 0,
+      className: [input, className].filter(Boolean).join(" "),
+      ...rest
+    }
+  );
+}
+
+// src/components/Combobox/Combobox.css.ts
+var chip = "Combobox_chip__1irfr5o2";
+var chipRemove = "Combobox_chipRemove__1irfr5o3";
+var input2 = "Combobox_input__1irfr5o4";
+var option = "Combobox_option__1irfr5o7";
+var optionCheck = "Combobox_optionCheck__1irfr5o8";
+var popover = "Combobox_popover__1irfr5o6";
+var trigger = "Combobox_trigger__1irfr5o1";
+var wrapper3 = "Combobox_wrapper__1irfr5o0";
+function Combobox({
+  value: value2,
+  onChange,
+  options = [],
+  allowCustom = false,
+  placeholder,
+  disabled,
+  error,
+  className
+}) {
+  const [inputValue, setInputValue] = react.useState("");
+  const [open, setOpen] = react.useState(false);
+  const [activeIndex, setActiveIndex] = react.useState(-1);
+  const inputRef = react.useRef(null);
+  const id = react.useId();
+  const filteredOptions = options.filter((opt) => {
+    const lower = inputValue.toLowerCase();
+    return opt.toLowerCase().includes(lower) && !value2.includes(opt);
+  });
+  const customOption = allowCustom && inputValue.trim() && !options.includes(inputValue.trim()) && !value2.includes(inputValue.trim()) ? inputValue.trim() : null;
+  const visibleOptions = [...filteredOptions, ...customOption ? [customOption] : []];
+  const showDropdown = open && visibleOptions.length > 0;
+  function addValue(v) {
+    const trimmed = v.trim();
+    if (trimmed && !value2.includes(trimmed)) {
+      onChange([...value2, trimmed]);
+    }
+    setInputValue("");
+    setActiveIndex(-1);
+  }
+  function removeValue(v) {
+    onChange(value2.filter((x) => x !== v));
+  }
+  function handleKeyDown(e) {
+    if ((e.key === "Enter" || e.key === ",") && inputValue.trim()) {
+      e.preventDefault();
+      const active = activeIndex >= 0 ? visibleOptions[activeIndex] : void 0;
+      if (active) {
+        addValue(active);
+      } else if (allowCustom) {
+        addValue(inputValue);
+      } else if (filteredOptions[0]) {
+        addValue(filteredOptions[0]);
+      }
+      return;
+    }
+    if (e.key === "Backspace" && !inputValue && value2.length > 0) {
+      const last = value2[value2.length - 1];
+      if (last) removeValue(last);
+      return;
+    }
+    if (e.key === "ArrowDown") {
+      e.preventDefault();
+      setActiveIndex((i) => Math.min(i + 1, visibleOptions.length - 1));
+      return;
+    }
+    if (e.key === "ArrowUp") {
+      e.preventDefault();
+      setActiveIndex((i) => Math.max(i - 1, -1));
+      return;
+    }
+    if (e.key === "Escape") {
+      setOpen(false);
+      setActiveIndex(-1);
+    }
+  }
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "div",
+    {
+      className: [wrapper3, className].filter(Boolean).join(" "),
+      onClick: () => {
+        if (!disabled) inputRef.current?.focus();
+      },
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsxs(
+          "div",
+          {
+            className: trigger,
+            "data-open": showDropdown || void 0,
+            "data-error": error || void 0,
+            children: [
+              value2.map((v) => /* @__PURE__ */ jsxRuntime.jsxs("span", { className: chip, children: [
+                v,
+                !disabled && /* @__PURE__ */ jsxRuntime.jsx(
+                  "button",
+                  {
+                    type: "button",
+                    className: chipRemove,
+                    onClick: (e) => {
+                      e.stopPropagation();
+                      removeValue(v);
+                    },
+                    "aria-label": `Remove ${v}`,
+                    children: "\xD7"
+                  }
+                )
+              ] }, v)),
+              /* @__PURE__ */ jsxRuntime.jsx(
+                "input",
+                {
+                  ref: inputRef,
+                  id,
+                  className: input2,
+                  value: inputValue,
+                  disabled,
+                  placeholder: value2.length === 0 ? placeholder : void 0,
+                  autoComplete: "off",
+                  onChange: (e) => {
+                    setInputValue(e.target.value);
+                    setOpen(true);
+                    setActiveIndex(-1);
+                  },
+                  onFocus: () => setOpen(true),
+                  onBlur: () => {
+                    setTimeout(() => setOpen(false), 150);
+                  },
+                  onKeyDown: handleKeyDown,
+                  "aria-autocomplete": "list",
+                  "aria-expanded": showDropdown,
+                  "aria-controls": showDropdown ? `${id}-list` : void 0,
+                  "aria-activedescendant": activeIndex >= 0 ? `${id}-opt-${activeIndex}` : void 0
+                }
+              )
+            ]
+          }
+        ),
+        showDropdown && /* @__PURE__ */ jsxRuntime.jsx("div", { id: `${id}-list`, role: "listbox", className: popover, children: visibleOptions.map((opt, i) => {
+          const isSelected = value2.includes(opt);
+          const isCustom = opt === customOption;
+          return /* @__PURE__ */ jsxRuntime.jsxs(
+            "div",
+            {
+              id: `${id}-opt-${i}`,
+              role: "option",
+              "aria-selected": isSelected,
+              className: option,
+              "data-active": activeIndex === i || void 0,
+              "data-selected": isSelected || void 0,
+              onMouseDown: (e) => {
+                e.preventDefault();
+                addValue(opt);
+              },
+              onMouseEnter: () => setActiveIndex(i),
+              children: [
+                /* @__PURE__ */ jsxRuntime.jsx("span", { children: isCustom ? `Add "${opt}"` : opt }),
+                isSelected && /* @__PURE__ */ jsxRuntime.jsx("span", { className: optionCheck, children: "\u2713" })
+              ]
+            },
+            opt
+          );
+        }) })
+      ]
+    }
+  );
+}
+function SingleCombobox({
+  value: value2,
+  onChange,
+  options = [],
+  allowCustom = false,
+  placeholder,
+  disabled,
+  error,
+  className
+}) {
+  const [inputValue, setInputValue] = react.useState(value2 ?? "");
+  const [open, setOpen] = react.useState(false);
+  const [activeIndex, setActiveIndex] = react.useState(-1);
+  const inputRef = react.useRef(null);
+  const id = react.useId();
+  const filteredOptions = options.filter(
+    (opt) => opt.toLowerCase().includes(inputValue.toLowerCase())
+  );
+  const customOption = allowCustom && inputValue.trim() && !options.includes(inputValue.trim()) ? inputValue.trim() : null;
+  const visibleOptions = [...filteredOptions, ...customOption ? [customOption] : []];
+  const showDropdown = open && visibleOptions.length > 0;
+  function selectValue(v) {
+    onChange(v);
+    setInputValue(v);
+    setOpen(false);
+    setActiveIndex(-1);
+  }
+  function handleKeyDown(e) {
+    if (e.key === "Enter") {
+      e.preventDefault();
+      const active = activeIndex >= 0 ? visibleOptions[activeIndex] : void 0;
+      if (active) {
+        selectValue(active);
+      } else if (allowCustom && inputValue.trim()) {
+        selectValue(inputValue.trim());
+      } else if (filteredOptions[0]) {
+        selectValue(filteredOptions[0]);
+      }
+      return;
+    }
+    if ((e.key === "Backspace" || e.key === "Delete") && !inputValue) {
+      onChange(null);
+      return;
+    }
+    if (e.key === "ArrowDown") {
+      e.preventDefault();
+      setActiveIndex((i) => Math.min(i + 1, visibleOptions.length - 1));
+      return;
+    }
+    if (e.key === "ArrowUp") {
+      e.preventDefault();
+      setActiveIndex((i) => Math.max(i - 1, -1));
+      return;
+    }
+    if (e.key === "Escape") {
+      setOpen(false);
+      setActiveIndex(-1);
+    }
+  }
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "div",
+    {
+      className: [wrapper3, className].filter(Boolean).join(" "),
+      onClick: () => {
+        if (!disabled) inputRef.current?.focus();
+      },
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx(
+          "div",
+          {
+            className: trigger,
+            "data-open": showDropdown || void 0,
+            "data-error": error || void 0,
+            children: /* @__PURE__ */ jsxRuntime.jsx(
+              "input",
+              {
+                ref: inputRef,
+                id,
+                className: input2,
+                value: inputValue,
+                disabled,
+                placeholder,
+                autoComplete: "off",
+                onChange: (e) => {
+                  setInputValue(e.target.value);
+                  onChange(null);
+                  setOpen(true);
+                  setActiveIndex(-1);
+                },
+                onFocus: () => setOpen(true),
+                onBlur: () => {
+                  setTimeout(() => {
+                    setOpen(false);
+                    setInputValue(value2 ?? "");
+                  }, 150);
+                },
+                onKeyDown: handleKeyDown,
+                "aria-autocomplete": "list",
+                "aria-expanded": showDropdown,
+                "aria-controls": showDropdown ? `${id}-list` : void 0,
+                "aria-activedescendant": activeIndex >= 0 ? `${id}-opt-${activeIndex}` : void 0
+              }
+            )
+          }
+        ),
+        showDropdown && /* @__PURE__ */ jsxRuntime.jsx("div", { id: `${id}-list`, role: "listbox", className: popover, children: visibleOptions.map((opt, i) => {
+          const isSelected = value2 === opt;
+          const isCustom = opt === customOption;
+          return /* @__PURE__ */ jsxRuntime.jsxs(
+            "div",
+            {
+              id: `${id}-opt-${i}`,
+              role: "option",
+              "aria-selected": isSelected,
+              className: option,
+              "data-active": activeIndex === i || void 0,
+              "data-selected": isSelected || void 0,
+              onMouseDown: (e) => {
+                e.preventDefault();
+                selectValue(opt);
+              },
+              onMouseEnter: () => setActiveIndex(i),
+              children: [
+                /* @__PURE__ */ jsxRuntime.jsx("span", { children: isCustom ? `Add "${opt}"` : opt }),
+                isSelected && /* @__PURE__ */ jsxRuntime.jsx("span", { className: optionCheck, children: "\u2713" })
+              ]
+            },
+            opt
+          );
+        }) })
+      ]
+    }
+  );
+}
+var letter = "LetterStamp_letter__dy83u5c";
+var stamp = createRuntimeFn.createRuntimeFn({ defaultClassName: "LetterStamp_stamp__dy83u50", variantClassNames: { tone: { moss: "LetterStamp_stamp_tone_moss__dy83u51", rust: "LetterStamp_stamp_tone_rust__dy83u52", ochre: "LetterStamp_stamp_tone_ochre__dy83u53", plum: "LetterStamp_stamp_tone_plum__dy83u54", copper: "LetterStamp_stamp_tone_copper__dy83u55", neutral: "LetterStamp_stamp_tone_neutral__dy83u56" }, size: { "14": "LetterStamp_stamp_size_14__dy83u57", "20": "LetterStamp_stamp_size_20__dy83u58", "28": "LetterStamp_stamp_size_28__dy83u59", "36": "LetterStamp_stamp_size_36__dy83u5a", "48": "LetterStamp_stamp_size_48__dy83u5b" } }, defaultVariants: { tone: "neutral", size: 28 }, compoundVariants: [] });
+function LetterStamp({
+  letter: letter2,
+  glyph: glyph2,
+  size = 28,
+  tone = "neutral",
+  colour,
+  className
+}) {
+  const style = colour ? { background: colour } : {};
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "span",
+    {
+      className: [stamp({ tone, size }), className].filter(Boolean).join(" "),
+      style,
+      "aria-hidden": "true",
+      children: glyph2 ? /* @__PURE__ */ jsxRuntime.jsx(Glyph, { name: glyph2, size: Math.round(size * 0.55) }) : letter2 ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: letter, style: { fontSize: `${Math.round(size / 2)}px` }, children: letter2.slice(0, 1).toUpperCase() }) : null
+    }
+  );
+}
+var labelMd = "EntityPill_labelMd__59j8ted EntityPill_label__59j8teb";
+var labelSm = "EntityPill_labelSm__59j8tec EntityPill_label__59j8teb";
+var pill = createRuntimeFn.createRuntimeFn({ defaultClassName: "EntityPill_pill__59j8te0", variantClassNames: { tone: { moss: "EntityPill_pill_tone_moss__59j8te1", rust: "EntityPill_pill_tone_rust__59j8te2", ochre: "EntityPill_pill_tone_ochre__59j8te3", plum: "EntityPill_pill_tone_plum__59j8te4", copper: "EntityPill_pill_tone_copper__59j8te5", neutral: "EntityPill_pill_tone_neutral__59j8te6" }, size: { sm: "EntityPill_pill_size_sm__59j8te7", md: "EntityPill_pill_size_md__59j8te8" }, interactive: { true: "EntityPill_pill_interactive_true__59j8te9", false: "EntityPill_pill_interactive_false__59j8tea" } }, defaultVariants: { tone: "neutral", size: "md", interactive: false }, compoundVariants: [] });
+function EntityPill({
+  label: label4,
+  letter: letter2,
+  glyph: glyph2,
+  tone = "neutral",
+  colour,
+  size = "md",
+  onClick,
+  href,
+  className
+}) {
+  const stampSize = size === "sm" ? 20 : 28;
+  const isInteractive = Boolean(onClick || href);
+  const pillClass = [
+    pill({ tone, size, interactive: isInteractive }),
+    className
+  ].filter(Boolean).join(" ");
+  const labelClass = size === "sm" ? labelSm : labelMd;
+  const content3 = /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+    /* @__PURE__ */ jsxRuntime.jsx(
+      LetterStamp,
+      {
+        ...letter2 !== void 0 ? { letter: letter2 } : {},
+        ...glyph2 !== void 0 ? { glyph: glyph2 } : {},
+        ...colour !== void 0 ? { colour } : {},
+        tone,
+        size: stampSize
+      }
+    ),
+    /* @__PURE__ */ jsxRuntime.jsx("span", { className: labelClass, children: label4 })
+  ] });
+  if (href) {
+    return /* @__PURE__ */ jsxRuntime.jsx("a", { href, className: pillClass, children: content3 });
+  }
+  if (onClick) {
+    return /* @__PURE__ */ jsxRuntime.jsx("button", { type: "button", onClick, className: pillClass, children: content3 });
+  }
+  return /* @__PURE__ */ jsxRuntime.jsx("span", { className: pillClass, children: content3 });
+}
+
+// src/components/Sparkline/Sparkline.css.ts
+var root2 = "Sparkline_root__3i35240";
+var TONE_COLORS = {
+  positive: "var(--achery-color-success, #6ba03d)",
+  negative: "var(--achery-color-danger, #8a3a22)",
+  neutral: "var(--achery-color-accent, #c46a3a)"
+};
+function Sparkline({
+  data,
+  width = 80,
+  height = 28,
+  tone = "neutral",
+  className
+}) {
+  const PADDING = 2;
+  if (data.length < 2) {
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      "svg",
+      {
+        viewBox: `0 0 ${width} ${height}`,
+        width,
+        height,
+        className: [root2, className].filter(Boolean).join(" "),
+        "aria-hidden": "true"
+      }
+    );
+  }
+  const min = Math.min(...data);
+  const max = Math.max(...data);
+  const range = max - min || 1;
+  const xStep = (width - PADDING * 2) / (data.length - 1);
+  const yScale = (height - PADDING * 2) / range;
+  const points = data.map((v, i) => {
+    const x = PADDING + i * xStep;
+    const y = height - PADDING - (v - min) * yScale;
+    return `${x.toFixed(2)},${y.toFixed(2)}`;
+  }).join(" ");
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "svg",
+    {
+      viewBox: `0 0 ${width} ${height}`,
+      width,
+      height,
+      className: [root2, className].filter(Boolean).join(" "),
+      "aria-hidden": "true",
+      children: /* @__PURE__ */ jsxRuntime.jsx(
+        "polyline",
+        {
+          points,
+          fill: "none",
+          stroke: TONE_COLORS[tone],
+          strokeWidth: 1.4,
+          strokeLinejoin: "round",
+          strokeLinecap: "round"
+        }
+      )
+    }
+  );
+}
+
+// src/components/KpiTile/KpiTile.css.ts
+var inner = "KpiTile_inner__1yi98c61";
+var value = "KpiTile_value__1yi98c62";
+var wrapper4 = "KpiTile_wrapper__1yi98c60";
+var deltaToneToBadge = {
+  positive: "saved",
+  negative: "stopped",
+  neutral: "neutral"
+};
+function KpiTile({
+  label: label4,
+  value: value2,
+  delta,
+  deltaTone = "neutral",
+  sparkData,
+  onClick,
+  className
+}) {
+  const inner2 = /* @__PURE__ */ jsxRuntime.jsx(Card, { variant: "stamp", padding: "md", ...className !== void 0 ? { className } : {}, children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: inner, children: [
+    /* @__PURE__ */ jsxRuntime.jsx(Eyebrow, { children: label4 }),
+    /* @__PURE__ */ jsxRuntime.jsx("span", { className: value, children: value2 }),
+    delta && /* @__PURE__ */ jsxRuntime.jsx(Badge, { tone: deltaToneToBadge[deltaTone], dot: true, children: delta }),
+    sparkData && sparkData.length >= 2 && /* @__PURE__ */ jsxRuntime.jsx(Sparkline, { data: sparkData, tone: deltaTone, width: 80, height: 24 })
+  ] }) });
+  if (onClick) {
+    return /* @__PURE__ */ jsxRuntime.jsx("button", { type: "button", onClick, className: wrapper4, children: inner2 });
+  }
+  return inner2;
+}
+var stateMap = {
+  "stable": { tone: "neutral", label: "Stable" },
+  "drift-up": { tone: "stopped", label: "Drift up" },
+  "drift-down": { tone: "saved", label: "Drift down" },
+  "new-price": { tone: "drafting", label: "New price" },
+  "renewing": { tone: "drafting", label: "Renewing soon" }
+};
+function StatePill({ state, className }) {
+  const { tone, label: label4 } = stateMap[state];
+  return /* @__PURE__ */ jsxRuntime.jsx(Badge, { tone, dot: true, ...className !== void 0 ? { className } : {}, children: label4 });
+}
+var tag = createRuntimeFn.createRuntimeFn({ defaultClassName: "TypeTag_tag__1nf2zhb0", variantClassNames: { type: { basic: "TypeTag_tag_type_basic__1nf2zhb1", internal: "TypeTag_tag_type_internal__1nf2zhb2", exceptional: "TypeTag_tag_type_exceptional__1nf2zhb3", fee: "TypeTag_tag_type_fee__1nf2zhb4" } }, defaultVariants: { type: "basic" }, compoundVariants: [] });
+var labels = {
+  basic: "basic",
+  internal: "internal",
+  exceptional: "exceptional",
+  fee: "fee"
+};
+function TypeTag({ type, className }) {
+  return /* @__PURE__ */ jsxRuntime.jsx("span", { className: [tag({ type }), className].filter(Boolean).join(" "), children: labels[type] });
+}
+
 exports.AcheryProvider = AcheryProvider;
 exports.AppBar = AppBar;
+exports.Avatar = Avatar;
 exports.Badge = Badge;
 exports.Body = Body;
 exports.Button = Button;
 exports.Card = Card;
+exports.Checkbox = Checkbox;
+exports.Combobox = Combobox;
+exports.DatePicker = DatePicker;
 exports.Display = Display;
+exports.EntityPill = EntityPill;
 exports.Eyebrow = Eyebrow;
 exports.Field = Field;
 exports.Glyph = Glyph;
 exports.Heading = Heading;
 exports.Input = Input;
+exports.KpiTile = KpiTile;
+exports.LetterStamp = LetterStamp;
 exports.Marginalia = Marginalia;
+exports.Menu = Menu2;
 exports.Modal = Modal;
 exports.Mono = Mono;
+exports.ProgressBar = ProgressBar;
 exports.SearchInput = SearchInput;
 exports.Select = Select;
 exports.Sidebar = Sidebar;
+exports.SingleCombobox = SingleCombobox;
+exports.Sparkline = Sparkline;
+exports.StatePill = StatePill;
 exports.Table = Table;
 exports.Tabs = Tabs;
 exports.Textarea = Textarea;
 exports.ToastProvider = ToastProvider;
 exports.Toggle = Toggle;
 exports.Tooltip = Tooltip;
+exports.TypeTag = TypeTag;
 exports.useTheme = useTheme;
 exports.useToast = useToast;
 exports.vars = vars;