achery-ui 0.1.0

package/dist/index.js

@@ -0,0 +1,975 @@
+import { accentColorNames, accentColors } from './chunk-IARZATZY.js';
+import { createContext, useState, useEffect, useContext, useMemo, useCallback } from 'react';
+import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
+import { createRuntimeFn } from '@vanilla-extract/recipes/createRuntimeFn';
+import * as RadixToggle from '@radix-ui/react-toggle';
+import * as RadixTabs from '@radix-ui/react-tabs';
+import * as RadixTooltip from '@radix-ui/react-tooltip';
+import * as RadixDialog from '@radix-ui/react-dialog';
+import { createPortal } from 'react-dom';
+
+var ThemeContext = createContext(null);
+function AcheryProvider({
+  children,
+  defaultTheme = "light",
+  defaultAccent = "terracotta",
+  className,
+  style
+}) {
+  const [theme, setThemeState] = useState(defaultTheme);
+  const [accent, setAccentState] = useState(defaultAccent);
+  const setTheme = (next) => setThemeState(next);
+  const toggleTheme = () => setThemeState((t) => t === "light" ? "dark" : "light");
+  const setAccent = (next) => setAccentState(next);
+  useEffect(() => {
+    const html = document.documentElement;
+    html.dataset["theme"] = theme;
+    html.dataset["accent"] = accent;
+    html.dataset["acheryRoot"] = "";
+    return () => {
+      delete html.dataset["theme"];
+      delete html.dataset["accent"];
+      delete html.dataset["acheryRoot"];
+    };
+  }, [theme, accent]);
+  return /* @__PURE__ */ jsx(ThemeContext.Provider, { value: { theme, setTheme, toggleTheme, accent, setAccent }, children: /* @__PURE__ */ jsx(
+    "div",
+    {
+      "data-achery-root": "",
+      "data-theme": theme,
+      "data-accent": accent,
+      className,
+      style,
+      children
+    }
+  ) });
+}
+function useTheme() {
+  const ctx = useContext(ThemeContext);
+  if (!ctx) throw new Error("useTheme must be used within <AcheryProvider>");
+  return ctx;
+}
+
+// src/theme/vars.css.ts
+var vars = { color: { bg: "var(--color-bg__1acibxb0)", bg2: "var(--color-bg2__1acibxb1)", bgSunken: "var(--color-bgSunken__1acibxb2)", surface: "var(--color-surface__1acibxb3)", surface2: "var(--color-surface2__1acibxb4)", fg: "var(--color-fg__1acibxb5)", fg2: "var(--color-fg2__1acibxb6)", fg3: "var(--color-fg3__1acibxb7)", fgMute: "var(--color-fgMute__1acibxb8)", border: "var(--color-border__1acibxb9)", border2: "var(--color-border2__1acibxba)", borderMute: "var(--color-borderMute__1acibxbb)", rule: "var(--color-rule__1acibxbc)", accent: "var(--color-accent__1acibxbd)", accentFg: "var(--color-accentFg__1acibxbe)", accent2: "var(--color-accent2__1acibxbf)", accent3: "var(--color-accent3__1acibxbg)", success: "var(--color-success__1acibxbh)", warn: "var(--color-warn__1acibxbi)", danger: "var(--color-danger__1acibxbj)", info: "var(--color-info__1acibxbk)", selectionBg: "var(--color-selectionBg__1acibxbl)", selectionFg: "var(--color-selectionFg__1acibxbm)" }, font: { display: "var(--font-display__1acibxbn)", body: "var(--font-body__1acibxbo)", mono: "var(--font-mono__1acibxbp)" }, space: { sp1: "var(--space-sp1__1acibxbq)", sp2: "var(--space-sp2__1acibxbr)", sp3: "var(--space-sp3__1acibxbs)", sp4: "var(--space-sp4__1acibxbt)", sp5: "var(--space-sp5__1acibxbu)", sp6: "var(--space-sp6__1acibxbv)", sp7: "var(--space-sp7__1acibxbw)", sp8: "var(--space-sp8__1acibxbx)", sp9: "var(--space-sp9__1acibxby)", sp10: "var(--space-sp10__1acibxbz)", sp11: "var(--space-sp11__1acibxb10)", sp12: "var(--space-sp12__1acibxb11)" }, radius: { none: "var(--radius-none__1acibxb12)", hairline: "var(--radius-hairline__1acibxb13)", sm: "var(--radius-sm__1acibxb14)", pill: "var(--radius-pill__1acibxb15)" }, shadow: { stamp: "var(--shadow-stamp__1acibxb16)", stampLg: "var(--shadow-stampLg__1acibxb17)", press: "var(--shadow-press__1acibxb18)", soft: "var(--shadow-soft__1acibxb19)" }, duration: { fast: "var(--duration-fast__1acibxb1a)", base: "var(--duration-base__1acibxb1b)", slow: "var(--duration-slow__1acibxb1c)" }, ease: { out: "var(--ease-out__1acibxb1d)", snap: "var(--ease-snap__1acibxb1e)" } };
+
+// src/glyphs/Glyph.css.ts
+var glyph = "Glyph_glyph__kbvv420";
+function ArrowRight(props) {
+  return /* @__PURE__ */ jsxs("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.6", strokeLinecap: "round", strokeLinejoin: "round", ...props, children: [
+    /* @__PURE__ */ jsx("path", { d: "M3 12h18" }),
+    /* @__PURE__ */ jsx("polyline", { points: "15,6 21,12 15,18" })
+  ] });
+}
+function ArrowUp(props) {
+  return /* @__PURE__ */ jsxs("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.6", strokeLinecap: "round", strokeLinejoin: "round", ...props, children: [
+    /* @__PURE__ */ jsx("path", { d: "M12 3v18" }),
+    /* @__PURE__ */ jsx("polyline", { points: "6,9 12,3 18,9" })
+  ] });
+}
+function Asterism(props) {
+  return /* @__PURE__ */ jsxs("svg", { viewBox: "0 0 60 24", fill: "currentColor", ...props, children: [
+    /* @__PURE__ */ jsx("circle", { cx: "14", cy: "16", r: "2" }),
+    /* @__PURE__ */ jsx("circle", { cx: "30", cy: "8", r: "2" }),
+    /* @__PURE__ */ jsx("circle", { cx: "46", cy: "16", r: "2" })
+  ] });
+}
+function Book(props) {
+  return /* @__PURE__ */ jsxs("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.4", strokeLinejoin: "round", strokeLinecap: "round", ...props, children: [
+    /* @__PURE__ */ jsx("path", { d: "M4 5v14" }),
+    /* @__PURE__ */ jsx("path", { d: "M20 5v14" }),
+    /* @__PURE__ */ jsx("path", { d: "M4 5c4-1 8-1 8 1v14c0-2-4-2-8-1" }),
+    /* @__PURE__ */ jsx("path", { d: "M20 5c-4-1-8-1-8 1v14c0-2 4-2 8-1" })
+  ] });
+}
+function Circle(props) {
+  return /* @__PURE__ */ jsx("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.4", ...props, children: /* @__PURE__ */ jsx("circle", { cx: "12", cy: "12", r: "8" }) });
+}
+function Compass(props) {
+  return /* @__PURE__ */ jsxs("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.4", strokeLinejoin: "round", ...props, children: [
+    /* @__PURE__ */ jsx("circle", { cx: "12", cy: "12", r: "9" }),
+    /* @__PURE__ */ jsx("polygon", { points: "12,5 14,12 12,19 10,12", fill: "currentColor" })
+  ] });
+}
+function Cross(props) {
+  return /* @__PURE__ */ jsxs("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.4", strokeLinecap: "round", ...props, children: [
+    /* @__PURE__ */ jsx("line", { x1: "5", y1: "5", x2: "19", y2: "19" }),
+    /* @__PURE__ */ jsx("line", { x1: "19", y1: "5", x2: "5", y2: "19" })
+  ] });
+}
+function Eye(props) {
+  return /* @__PURE__ */ jsxs("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.4", strokeLinejoin: "round", strokeLinecap: "round", ...props, children: [
+    /* @__PURE__ */ jsx("path", { d: "M2 12c3-5 7-7 10-7s7 2 10 7c-3 5-7 7-10 7s-7-2-10-7z" }),
+    /* @__PURE__ */ jsx("circle", { cx: "12", cy: "12", r: "3" }),
+    /* @__PURE__ */ jsx("circle", { cx: "12", cy: "12", r: "1", fill: "currentColor" })
+  ] });
+}
+function Feather(props) {
+  return /* @__PURE__ */ jsxs("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.4", strokeLinecap: "round", strokeLinejoin: "round", ...props, children: [
+    /* @__PURE__ */ jsx("path", { d: "M20 4c-8 0-14 6-14 14v2h2c8 0 14-6 14-14V4z" }),
+    /* @__PURE__ */ jsx("path", { d: "M6 20L20 6" })
+  ] });
+}
+function Fern(props) {
+  return /* @__PURE__ */ jsxs("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.4", strokeLinecap: "round", ...props, children: [
+    /* @__PURE__ */ jsx("path", { d: "M12 21V4" }),
+    /* @__PURE__ */ jsx("path", { d: "M12 4c-2 1-3 3-3 5" }),
+    /* @__PURE__ */ jsx("path", { d: "M12 9c-2 1-3 3-3 5" }),
+    /* @__PURE__ */ jsx("path", { d: "M12 14c-2 1-3 3-3 5" }),
+    /* @__PURE__ */ jsx("path", { d: "M12 6c2 1 3 3 3 5" }),
+    /* @__PURE__ */ jsx("path", { d: "M12 11c2 1 3 3 3 5" })
+  ] });
+}
+function Flask(props) {
+  return /* @__PURE__ */ jsxs("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.4", strokeLinejoin: "round", strokeLinecap: "round", ...props, children: [
+    /* @__PURE__ */ jsx("path", { d: "M9 3h6" }),
+    /* @__PURE__ */ jsx("path", { d: "M10 3v6L5 19a2 2 0 0 0 2 3h10a2 2 0 0 0 2-3l-5-10V3" }),
+    /* @__PURE__ */ jsx("path", { d: "M7 15h10" })
+  ] });
+}
+function Flourish(props) {
+  return /* @__PURE__ */ jsxs("svg", { viewBox: "0 0 120 24", fill: "none", stroke: "currentColor", strokeWidth: "1.2", strokeLinecap: "round", ...props, children: [
+    /* @__PURE__ */ jsx("path", { d: "M2 12 H42" }),
+    /* @__PURE__ */ jsx("path", { d: "M42 12 c4 -6 10 -6 14 0 c4 6 10 6 14 0" }),
+    /* @__PURE__ */ jsx("circle", { cx: "60", cy: "12", r: "1.4", fill: "currentColor" }),
+    /* @__PURE__ */ jsx("path", { d: "M78 12 H118" })
+  ] });
+}
+function Hand(props) {
+  return /* @__PURE__ */ jsxs("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.4", strokeLinejoin: "round", strokeLinecap: "round", ...props, children: [
+    /* @__PURE__ */ jsx("path", { d: "M8 21v-6l-3-3v-3a1 1 0 0 1 2 0v3" }),
+    /* @__PURE__ */ jsx("path", { d: "M8 12V5a1 1 0 0 1 2 0v6" }),
+    /* @__PURE__ */ jsx("path", { d: "M10 11V4a1 1 0 0 1 2 0v8" }),
+    /* @__PURE__ */ jsx("path", { d: "M12 12V6a1 1 0 0 1 2 0v8" }),
+    /* @__PURE__ */ jsx("path", { d: "M14 12v-3a1 1 0 0 1 2 0v9c0 2-2 4-4 4" })
+  ] });
+}
+function Hex(props) {
+  return /* @__PURE__ */ jsx("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.4", strokeLinejoin: "round", ...props, children: /* @__PURE__ */ jsx("polygon", { points: "12,3 21,8 21,16 12,21 3,16 3,8" }) });
+}
+function Key(props) {
+  return /* @__PURE__ */ jsxs("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.4", strokeLinejoin: "round", strokeLinecap: "round", ...props, children: [
+    /* @__PURE__ */ jsx("circle", { cx: "7", cy: "12", r: "4" }),
+    /* @__PURE__ */ jsx("path", { d: "M11 12h11" }),
+    /* @__PURE__ */ jsx("path", { d: "M18 12v4" }),
+    /* @__PURE__ */ jsx("path", { d: "M22 12v3" })
+  ] });
+}
+function Leaf(props) {
+  return /* @__PURE__ */ jsxs("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.4", strokeLinecap: "round", strokeLinejoin: "round", ...props, children: [
+    /* @__PURE__ */ jsx("path", { d: "M4 20c0-9 7-16 16-16 0 9-7 16-16 16z" }),
+    /* @__PURE__ */ jsx("path", { d: "M4 20l8-8" })
+  ] });
+}
+function Mark(props) {
+  return /* @__PURE__ */ jsxs("svg", { viewBox: "0 0 80 80", fill: "currentColor", stroke: "currentColor", strokeLinejoin: "miter", strokeLinecap: "square", ...props, children: [
+    /* @__PURE__ */ jsx("polygon", { points: "40,4 72,22 72,58 40,76 8,58 8,22", fill: "none", strokeWidth: "6" }),
+    /* @__PURE__ */ jsx("polygon", { points: "40,12 56,32 24,32", stroke: "none" }),
+    /* @__PURE__ */ jsx("rect", { x: "33", y: "28", width: "14", height: "30", stroke: "none" }),
+    /* @__PURE__ */ jsx("polygon", { points: "24,50 33,58 33,52", stroke: "none" }),
+    /* @__PURE__ */ jsx("polygon", { points: "56,50 47,58 47,52", stroke: "none" })
+  ] });
+}
+function Mercury(props) {
+  return /* @__PURE__ */ jsxs("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.4", strokeLinecap: "round", strokeLinejoin: "round", ...props, children: [
+    /* @__PURE__ */ jsx("circle", { cx: "12", cy: "9", r: "5" }),
+    /* @__PURE__ */ jsx("path", { d: "M12 14v7" }),
+    /* @__PURE__ */ jsx("path", { d: "M8 18h8" }),
+    /* @__PURE__ */ jsx("path", { d: "M9 21h6" })
+  ] });
+}
+function Minus(props) {
+  return /* @__PURE__ */ jsx("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.6", strokeLinecap: "round", ...props, children: /* @__PURE__ */ jsx("line", { x1: "4", y1: "12", x2: "20", y2: "12" }) });
+}
+function Moon(props) {
+  return /* @__PURE__ */ jsx("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.4", strokeLinecap: "round", strokeLinejoin: "round", ...props, children: /* @__PURE__ */ jsx("path", { d: "M16 4a8 8 0 1 0 0 16 6 6 0 0 1 0-16z" }) });
+}
+function Plus(props) {
+  return /* @__PURE__ */ jsxs("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.6", strokeLinecap: "round", ...props, children: [
+    /* @__PURE__ */ jsx("line", { x1: "12", y1: "4", x2: "12", y2: "20" }),
+    /* @__PURE__ */ jsx("line", { x1: "4", y1: "12", x2: "20", y2: "12" })
+  ] });
+}
+function Salt(props) {
+  return /* @__PURE__ */ jsxs("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.4", strokeLinecap: "round", strokeLinejoin: "round", ...props, children: [
+    /* @__PURE__ */ jsx("circle", { cx: "12", cy: "12", r: "8" }),
+    /* @__PURE__ */ jsx("path", { d: "M4 12h16" })
+  ] });
+}
+function Scroll(props) {
+  return /* @__PURE__ */ jsxs("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.4", strokeLinejoin: "round", strokeLinecap: "round", ...props, children: [
+    /* @__PURE__ */ jsx("path", { d: "M5 6a2 2 0 0 1 4 0v12a2 2 0 0 0 4 0V8h6v10a3 3 0 0 1-3 3H7" }),
+    /* @__PURE__ */ jsx("path", { d: "M5 6v0a2 2 0 0 0 2 2h6" })
+  ] });
+}
+function Sigil(props) {
+  return /* @__PURE__ */ jsxs("svg", { viewBox: "0 0 48 48", fill: "none", stroke: "currentColor", strokeWidth: "1.2", ...props, children: [
+    /* @__PURE__ */ jsx("circle", { cx: "24", cy: "24", r: "20" }),
+    /* @__PURE__ */ jsx("circle", { cx: "24", cy: "24", r: "14" }),
+    /* @__PURE__ */ jsx("polygon", { points: "24,8 38,32 10,32" }),
+    /* @__PURE__ */ jsx("polygon", { points: "24,40 10,16 38,16" }),
+    /* @__PURE__ */ jsx("circle", { cx: "24", cy: "24", r: "3" })
+  ] });
+}
+function Sprig(props) {
+  return /* @__PURE__ */ jsxs("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.4", strokeLinecap: "round", ...props, children: [
+    /* @__PURE__ */ jsx("path", { d: "M12 3v18" }),
+    /* @__PURE__ */ jsx("path", { d: "M12 7c-2-1-3-1-5-1 0 2 1 3 5 4" }),
+    /* @__PURE__ */ jsx("path", { d: "M12 11c2-1 3-1 5-1 0 2-1 3-5 4" }),
+    /* @__PURE__ */ jsx("path", { d: "M12 15c-2-1-3-1-5-1 0 2 1 3 5 4" })
+  ] });
+}
+function Square(props) {
+  return /* @__PURE__ */ jsx("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.4", ...props, children: /* @__PURE__ */ jsx("rect", { x: "4", y: "4", width: "16", height: "16" }) });
+}
+function Star(props) {
+  return /* @__PURE__ */ jsx("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.4", strokeLinejoin: "round", ...props, children: /* @__PURE__ */ jsx("polygon", { points: "12,3 14,10 21,10 15.5,14 17.5,21 12,17 6.5,21 8.5,14 3,10 10,10" }) });
+}
+function Sulfur(props) {
+  return /* @__PURE__ */ jsxs("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.4", strokeLinecap: "round", strokeLinejoin: "round", ...props, children: [
+    /* @__PURE__ */ jsx("path", { d: "M12 3l4 6h-8z" }),
+    /* @__PURE__ */ jsx("circle", { cx: "12", cy: "14", r: "4" }),
+    /* @__PURE__ */ jsx("path", { d: "M12 18v3" }),
+    /* @__PURE__ */ jsx("path", { d: "M9 21h6" })
+  ] });
+}
+function Sun(props) {
+  return /* @__PURE__ */ jsxs("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.4", strokeLinecap: "round", ...props, children: [
+    /* @__PURE__ */ jsx("circle", { cx: "12", cy: "12", r: "7" }),
+    /* @__PURE__ */ jsx("circle", { cx: "12", cy: "12", r: "1.5", fill: "currentColor" })
+  ] });
+}
+function Tick(props) {
+  return /* @__PURE__ */ jsx("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.8", strokeLinecap: "round", strokeLinejoin: "round", ...props, children: /* @__PURE__ */ jsx("polyline", { points: "4,13 10,19 20,5" }) });
+}
+function TriangleDown(props) {
+  return /* @__PURE__ */ jsx("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.4", strokeLinejoin: "round", ...props, children: /* @__PURE__ */ jsx("polygon", { points: "12,20 21,4 3,4" }) });
+}
+function Triangle(props) {
+  return /* @__PURE__ */ jsx("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.4", strokeLinejoin: "round", ...props, children: /* @__PURE__ */ jsx("polygon", { points: "12,4 21,20 3,20" }) });
+}
+function Wordmark(props) {
+  return /* @__PURE__ */ jsxs("svg", { viewBox: "0 0 320 80", fill: "currentColor", stroke: "currentColor", strokeLinejoin: "miter", strokeLinecap: "square", ...props, children: [
+    /* @__PURE__ */ jsxs("g", { transform: "translate(40,40) scale(0.72) translate(-40,-40)", children: [
+      /* @__PURE__ */ jsx("polygon", { points: "40,4 72,22 72,58 40,76 8,58 8,22", fill: "none", strokeWidth: "6" }),
+      /* @__PURE__ */ jsx("polygon", { points: "40,12 56,32 24,32", stroke: "none" }),
+      /* @__PURE__ */ jsx("rect", { x: "33", y: "28", width: "14", height: "30", stroke: "none" }),
+      /* @__PURE__ */ jsx("polygon", { points: "24,50 33,58 33,52", stroke: "none" }),
+      /* @__PURE__ */ jsx("polygon", { points: "56,50 47,58 47,52", stroke: "none" })
+    ] }),
+    /* @__PURE__ */ jsx("g", { transform: "translate(82,52)", fontFamily: "'Roboto Slab', serif", fontWeight: "900", fontSize: "34", letterSpacing: "2", stroke: "none", children: /* @__PURE__ */ jsx("text", { x: "0", y: "0", children: "ACHERY" }) }),
+    /* @__PURE__ */ jsx("g", { transform: "translate(82,72)", fontFamily: "'Space Grotesk', sansSerif", fontWeight: "600", fontSize: "10", letterSpacing: "6", stroke: "none", children: /* @__PURE__ */ jsx("text", { x: "2", y: "0", children: "\u2014 W O R K S H O P \u2014" }) })
+  ] });
+}
+var glyphMap = {
+  "arrow-right": ArrowRight,
+  "arrow-up": ArrowUp,
+  "asterism": Asterism,
+  "book": Book,
+  "circle": Circle,
+  "compass": Compass,
+  "cross": Cross,
+  "eye": Eye,
+  "feather": Feather,
+  "fern": Fern,
+  "flask": Flask,
+  "flourish": Flourish,
+  "hand": Hand,
+  "hex": Hex,
+  "key": Key,
+  "leaf": Leaf,
+  "mark": Mark,
+  "mercury": Mercury,
+  "minus": Minus,
+  "moon": Moon,
+  "plus": Plus,
+  "salt": Salt,
+  "scroll": Scroll,
+  "sigil": Sigil,
+  "sprig": Sprig,
+  "square": Square,
+  "star": Star,
+  "sulfur": Sulfur,
+  "sun": Sun,
+  "tick": Tick,
+  "triangle": Triangle,
+  "triangle-down": TriangleDown,
+  "wordmark": Wordmark
+};
+function Glyph({ name, size = 16, title: title2, className, style, ...props }) {
+  const SvgComponent = glyphMap[name];
+  if (!SvgComponent) {
+    return /* @__PURE__ */ jsx(
+      "span",
+      {
+        className: [glyph, className].filter(Boolean).join(" "),
+        style: { width: size, height: size, display: "inline-block", ...style },
+        "aria-hidden": "true"
+      }
+    );
+  }
+  return /* @__PURE__ */ jsx(
+    SvgComponent,
+    {
+      width: size,
+      height: size,
+      "aria-hidden": title2 ? void 0 : true,
+      "aria-label": title2,
+      className: [glyph, className].filter(Boolean).join(" "),
+      style,
+      ...props
+    }
+  );
+}
+
+// src/components/Typography/Typography.css.ts
+var body = "Typography_body__1v4lwgr6";
+var bodyLead = "Typography_bodyLead__1v4lwgr7";
+var bodySmall = "Typography_bodySmall__1v4lwgr8";
+var display = "Typography_display__1v4lwgr0";
+var h1 = "Typography_h1__1v4lwgr1";
+var h2 = "Typography_h2__1v4lwgr2";
+var h3 = "Typography_h3__1v4lwgr3";
+var h4 = "Typography_h4__1v4lwgr4";
+var h5 = "Typography_h5__1v4lwgr5";
+var mono = "Typography_mono__1v4lwgr9";
+var monoSmall = "Typography_monoSmall__1v4lwgra";
+function Display({ as: Tag = "p", className, children, ...props }) {
+  return /* @__PURE__ */ jsx(Tag, { className: [display, className].filter(Boolean).join(" "), ...props, children });
+}
+var headingStyles = {
+  1: h1,
+  2: h2,
+  3: h3,
+  4: h4,
+  5: h5
+};
+function Heading({ level = 1, className, children, ...props }) {
+  const Tag = `h${level}`;
+  const style = headingStyles[level];
+  return /* @__PURE__ */ jsx(Tag, { className: [style, className].filter(Boolean).join(" "), ...props, children });
+}
+var bodyStyles = {
+  base: body,
+  lead: bodyLead,
+  small: bodySmall
+};
+function Body({ variant = "base", className, children, ...props }) {
+  return /* @__PURE__ */ jsx("p", { className: [bodyStyles[variant], className].filter(Boolean).join(" "), ...props, children });
+}
+function Mono({ variant = "base", as: Tag = "span", className, children, ...props }) {
+  const s = variant === "small" ? monoSmall : mono;
+  return /* @__PURE__ */ jsx(Tag, { className: [s, className].filter(Boolean).join(" "), ...props, children });
+}
+
+// src/components/Eyebrow/Eyebrow.css.ts
+var count = "Eyebrow_count__b8rlr31";
+var eyebrow = "Eyebrow_eyebrow__b8rlr30";
+function Eyebrow({ children, count: count2, after, className, ...props }) {
+  return /* @__PURE__ */ jsxs("span", { className: [eyebrow, className].filter(Boolean).join(" "), ...props, children: [
+    children,
+    count2 !== void 0 && /* @__PURE__ */ jsx("span", { className: count, children: count2 }),
+    after
+  ] });
+}
+var badge = createRuntimeFn({ defaultClassName: "Badge_badge__1ir6yu20", variantClassNames: { tone: { saved: "Badge_badge_tone_saved__1ir6yu21", drafting: "Badge_badge_tone_drafting__1ir6yu22", stopped: "Badge_badge_tone_stopped__1ir6yu23", archived: "Badge_badge_tone_archived__1ir6yu24", neutral: "Badge_badge_tone_neutral__1ir6yu25", success: "Badge_badge_tone_success__1ir6yu26", warn: "Badge_badge_tone_warn__1ir6yu27", danger: "Badge_badge_tone_danger__1ir6yu28", info: "Badge_badge_tone_info__1ir6yu29" }, variant: { outline: "Badge_badge_variant_outline__1ir6yu2a", solid: "Badge_badge_variant_solid__1ir6yu2b", pill: "Badge_badge_variant_pill__1ir6yu2c" } }, defaultVariants: { tone: "neutral", variant: "outline" }, compoundVariants: [[{ tone: "saved", variant: "outline" }, "Badge_badge_compound_0__1ir6yu2d"], [{ tone: "saved", variant: "solid" }, "Badge_badge_compound_1__1ir6yu2e"], [{ tone: "saved", variant: "pill" }, "Badge_badge_compound_2__1ir6yu2f"], [{ tone: "drafting", variant: "outline" }, "Badge_badge_compound_3__1ir6yu2g"], [{ tone: "drafting", variant: "solid" }, "Badge_badge_compound_4__1ir6yu2h"], [{ tone: "drafting", variant: "pill" }, "Badge_badge_compound_5__1ir6yu2i"], [{ tone: "stopped", variant: "outline" }, "Badge_badge_compound_6__1ir6yu2j"], [{ tone: "stopped", variant: "solid" }, "Badge_badge_compound_7__1ir6yu2k"], [{ tone: "stopped", variant: "pill" }, "Badge_badge_compound_8__1ir6yu2l"], [{ tone: "archived", variant: "outline" }, "Badge_badge_compound_9__1ir6yu2m"], [{ tone: "archived", variant: "solid" }, "Badge_badge_compound_10__1ir6yu2n"], [{ tone: "archived", variant: "pill" }, "Badge_badge_compound_11__1ir6yu2o"], [{ tone: "neutral", variant: "outline" }, "Badge_badge_compound_12__1ir6yu2p"], [{ tone: "neutral", variant: "solid" }, "Badge_badge_compound_13__1ir6yu2q"], [{ tone: "neutral", variant: "pill" }, "Badge_badge_compound_14__1ir6yu2r"], [{ tone: "success", variant: "outline" }, "Badge_badge_compound_15__1ir6yu2s"], [{ tone: "success", variant: "solid" }, "Badge_badge_compound_16__1ir6yu2t"], [{ tone: "success", variant: "pill" }, "Badge_badge_compound_17__1ir6yu2u"], [{ tone: "warn", variant: "outline" }, "Badge_badge_compound_18__1ir6yu2v"], [{ tone: "warn", variant: "solid" }, "Badge_badge_compound_19__1ir6yu2w"], [{ tone: "warn", variant: "pill" }, "Badge_badge_compound_20__1ir6yu2x"], [{ tone: "danger", variant: "outline" }, "Badge_badge_compound_21__1ir6yu2y"], [{ tone: "danger", variant: "solid" }, "Badge_badge_compound_22__1ir6yu2z"], [{ tone: "danger", variant: "pill" }, "Badge_badge_compound_23__1ir6yu210"], [{ tone: "info", variant: "outline" }, "Badge_badge_compound_24__1ir6yu211"], [{ tone: "info", variant: "solid" }, "Badge_badge_compound_25__1ir6yu212"], [{ tone: "info", variant: "pill" }, "Badge_badge_compound_26__1ir6yu213"]] });
+var dot = "Badge_dot__1ir6yu214";
+function Badge({
+  tone = "neutral",
+  variant = "outline",
+  dot: dot2 = false,
+  children,
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxs(
+    "span",
+    {
+      className: [badge({ tone, variant }), className].filter(Boolean).join(" "),
+      ...props,
+      children: [
+        dot2 && /* @__PURE__ */ jsx("span", { className: dot, "aria-hidden": "true" }),
+        children
+      ]
+    }
+  );
+}
+var button = createRuntimeFn({ defaultClassName: "Button_button__1torrqc0", variantClassNames: { variant: { primary: "Button_button_variant_primary__1torrqc1", secondary: "Button_button_variant_secondary__1torrqc2", accent: "Button_button_variant_accent__1torrqc3", ghost: "Button_button_variant_ghost__1torrqc4", danger: "Button_button_variant_danger__1torrqc5" }, size: { sm: "Button_button_size_sm__1torrqc6", md: "Button_button_size_md__1torrqc7" } }, defaultVariants: { variant: "secondary", size: "md" }, compoundVariants: [] });
+var kbdHint = "Button_kbdHint__1torrqc8";
+function Button({
+  variant = "secondary",
+  size = "md",
+  glyph: glyph2,
+  glyphPosition = "start",
+  kbd,
+  children,
+  className,
+  ...props
+}) {
+  const glyphSize = size === "sm" ? 12 : 14;
+  return /* @__PURE__ */ jsxs(
+    "button",
+    {
+      className: [button({ variant, size }), className].filter(Boolean).join(" "),
+      ...props,
+      children: [
+        glyph2 && glyphPosition === "start" && /* @__PURE__ */ jsx(Glyph, { name: glyph2, size: glyphSize, "aria-hidden": "true" }),
+        children,
+        glyph2 && glyphPosition === "end" && /* @__PURE__ */ jsx(Glyph, { name: glyph2, size: glyphSize, "aria-hidden": "true" }),
+        kbd && /* @__PURE__ */ jsx("span", { className: kbdHint, children: kbd })
+      ]
+    }
+  );
+}
+
+// src/components/Toggle/Toggle.css.ts
+var label = "Toggle_label__trpmwc3";
+var thumb = "Toggle_thumb__trpmwc1";
+var track = "Toggle_track__trpmwc0";
+var wrapper = "Toggle_wrapper__trpmwc2";
+function Toggle({
+  pressed,
+  defaultPressed,
+  onPressedChange,
+  disabled,
+  label: label3,
+  className,
+  "aria-label": ariaLabel
+}) {
+  return /* @__PURE__ */ jsxs("span", { className: [wrapper, className].filter(Boolean).join(" "), children: [
+    /* @__PURE__ */ jsx(
+      RadixToggle.Root,
+      {
+        ...pressed !== void 0 ? { pressed } : {},
+        ...defaultPressed !== void 0 ? { defaultPressed } : {},
+        ...onPressedChange !== void 0 ? { onPressedChange } : {},
+        ...disabled !== void 0 ? { disabled } : {},
+        ...ariaLabel !== void 0 ? { "aria-label": ariaLabel } : {},
+        className: track,
+        children: /* @__PURE__ */ jsx("span", { className: thumb })
+      }
+    ),
+    label3 && /* @__PURE__ */ jsx("span", { className: label, children: label3 })
+  ] });
+}
+
+// src/components/Marginalia/Marginalia.css.ts
+var marginalia = "Marginalia_marginalia__elc29z0";
+function Marginalia({
+  glyph: glyph2 = "fern",
+  size = 120,
+  opacity = 0.4,
+  className,
+  style
+}) {
+  return /* @__PURE__ */ jsx(
+    Glyph,
+    {
+      name: glyph2,
+      size,
+      className: [marginalia, className].filter(Boolean).join(" "),
+      style: { opacity, ...style },
+      "aria-hidden": "true"
+    }
+  );
+}
+
+// src/components/Input/Input.css.ts
+var errorText = "Input_errorText__6w3tie3";
+var fieldRoot = "Input_fieldRoot__6w3tie0";
+var hint = "Input_hint__6w3tie2";
+var inputBase = "Input_inputBase__6w3tie4";
+var inputError = "Input_inputError__6w3tie5";
+var label2 = "Input_label__6w3tie1";
+var searchIcon = "Input_searchIcon__6w3tie9";
+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 }) {
+  return /* @__PURE__ */ jsxs("div", { className: [fieldRoot, className].filter(Boolean).join(" "), children: [
+    label3 && /* @__PURE__ */ jsx("label", { className: label2, children: label3 }),
+    children,
+    error && /* @__PURE__ */ jsx("span", { className: errorText, children: error }),
+    !error && hint2 && /* @__PURE__ */ jsx("span", { className: hint, children: hint2 })
+  ] });
+}
+function Input({ error, className, ...props }) {
+  return /* @__PURE__ */ jsx(
+    "input",
+    {
+      className: [inputBase, error && inputError, className].filter(Boolean).join(" "),
+      ...props
+    }
+  );
+}
+function Textarea({ error, className, ...props }) {
+  return /* @__PURE__ */ jsx(
+    "textarea",
+    {
+      className: [textarea, error && inputError, className].filter(Boolean).join(" "),
+      ...props
+    }
+  );
+}
+function Select({ error, children, className, ...props }) {
+  return /* @__PURE__ */ jsx(
+    "select",
+    {
+      className: [selectInput, error && inputError, className].filter(Boolean).join(" "),
+      ...props,
+      children
+    }
+  );
+}
+function SearchInput({ className, ...props }) {
+  return /* @__PURE__ */ jsxs("div", { className: [searchWrapper, className].filter(Boolean).join(" "), children: [
+    /* @__PURE__ */ jsx(Glyph, { name: "compass", size: 12, className: searchIcon, "aria-hidden": "true" }),
+    /* @__PURE__ */ jsx(
+      "input",
+      {
+        type: "search",
+        className: searchInput,
+        ...props
+      }
+    )
+  ] });
+}
+var card = createRuntimeFn({ defaultClassName: "Card_card__1uprgrr0", variantClassNames: { variant: { flat: "Card_card_variant_flat__1uprgrr1", stamp: "Card_card_variant_stamp__1uprgrr2", stampLg: "Card_card_variant_stampLg__1uprgrr3" }, padding: { none: "Card_card_padding_none__1uprgrr4", sm: "Card_card_padding_sm__1uprgrr5", md: "Card_card_padding_md__1uprgrr6", lg: "Card_card_padding_lg__1uprgrr7" } }, defaultVariants: { variant: "flat", padding: "md" }, compoundVariants: [] });
+var cardHeader = "Card_cardHeader__1uprgrr8";
+function Card({
+  variant = "flat",
+  padding = "md",
+  header: header2,
+  marginalia: marginalia2,
+  marginaliaSize = 80,
+  children,
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: [card({ variant, padding }), className].filter(Boolean).join(" "),
+      ...props,
+      children: [
+        header2 && /* @__PURE__ */ jsx("div", { className: cardHeader, children: header2 }),
+        children,
+        marginalia2 && /* @__PURE__ */ jsx(Marginalia, { glyph: marginalia2, size: marginaliaSize })
+      ]
+    }
+  );
+}
+
+// src/components/Tabs/Tabs.css.ts
+var tab = "Tabs_tab__1b0xj9v1";
+var tabList = "Tabs_tabList__1b0xj9v0";
+var tabPanel = "Tabs_tabPanel__1b0xj9v2";
+function Tabs({ items, value, defaultValue, onValueChange, className }) {
+  const resolvedDefault = defaultValue ?? items[0]?.value;
+  return /* @__PURE__ */ jsxs(
+    RadixTabs.Root,
+    {
+      ...value !== void 0 ? { value } : {},
+      ...resolvedDefault != null ? { defaultValue: resolvedDefault } : {},
+      ...onValueChange !== void 0 ? { onValueChange } : {},
+      ...className !== void 0 ? { className } : {},
+      children: [
+        /* @__PURE__ */ jsx(RadixTabs.List, { className: tabList, children: items.map((item) => /* @__PURE__ */ jsx(
+          RadixTabs.Trigger,
+          {
+            value: item.value,
+            disabled: item.disabled,
+            className: tab,
+            children: item.label
+          },
+          item.value
+        )) }),
+        items.map((item) => /* @__PURE__ */ jsx(
+          RadixTabs.Content,
+          {
+            value: item.value,
+            className: tabPanel,
+            children: item.content
+          },
+          item.value
+        ))
+      ]
+    }
+  );
+}
+
+// src/components/Tooltip/Tooltip.css.ts
+var content = "Tooltip_content__o34woq1";
+function Tooltip({
+  content: tooltipContent,
+  children,
+  side = "top",
+  delayDuration = 400,
+  open,
+  defaultOpen,
+  onOpenChange
+}) {
+  return /* @__PURE__ */ jsx(RadixTooltip.Provider, { delayDuration, children: /* @__PURE__ */ jsxs(
+    RadixTooltip.Root,
+    {
+      ...open !== void 0 ? { open } : {},
+      ...defaultOpen !== void 0 ? { defaultOpen } : {},
+      ...onOpenChange !== void 0 ? { onOpenChange } : {},
+      children: [
+        /* @__PURE__ */ jsx(RadixTooltip.Trigger, { asChild: true, children }),
+        /* @__PURE__ */ jsx(RadixTooltip.Portal, { children: /* @__PURE__ */ jsx(
+          RadixTooltip.Content,
+          {
+            side,
+            sideOffset: 6,
+            className: content,
+            children: tooltipContent
+          }
+        ) })
+      ]
+    }
+  ) });
+}
+
+// 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 sidebar = "Sidebar_sidebar__1n0xxfc0";
+function Sidebar({ groups, activeId, onItemClick, footer: footer3, className }) {
+  return /* @__PURE__ */ jsxs("nav", { className: [sidebar, className].filter(Boolean).join(" "), children: [
+    groups.map((group2, i) => /* @__PURE__ */ jsx(
+      NavGroup,
+      {
+        label: group2.label,
+        items: group2.items,
+        activeId,
+        onItemClick
+      },
+      i
+    )),
+    footer3 && /* @__PURE__ */ jsx("div", { className: footer, children: footer3 })
+  ] });
+}
+function NavGroup({ label: label3, items, activeId, onItemClick }) {
+  return /* @__PURE__ */ jsxs("div", { className: group, children: [
+    label3 && /* @__PURE__ */ jsx("span", { className: groupLabel, children: label3 }),
+    items.map((item) => /* @__PURE__ */ jsx(
+      NavItem,
+      {
+        item,
+        active: item.id === activeId,
+        onClick: () => onItemClick?.(item.id)
+      },
+      item.id
+    ))
+  ] });
+}
+function NavItem({ item, active, onClick }) {
+  const glyphStyle = active ? { filter: "invert(1)" } : void 0;
+  if (item.href) {
+    return /* @__PURE__ */ jsxs(
+      "a",
+      {
+        href: item.href,
+        className: navItem,
+        "data-active": active,
+        "aria-current": active ? "page" : void 0,
+        children: [
+          item.glyph ? /* @__PURE__ */ jsx(Glyph, { name: item.glyph, size: 14, style: glyphStyle, "aria-hidden": "true" }) : /* @__PURE__ */ jsx("span", {}),
+          /* @__PURE__ */ jsx("span", { children: item.label }),
+          item.count !== void 0 && /* @__PURE__ */ jsx("span", { className: navItemCount, children: item.count })
+        ]
+      }
+    );
+  }
+  return /* @__PURE__ */ jsxs(
+    "button",
+    {
+      className: navItem,
+      "data-active": active,
+      onClick,
+      "aria-current": active ? "page" : void 0,
+      children: [
+        item.glyph ? /* @__PURE__ */ jsx(Glyph, { name: item.glyph, size: 14, style: glyphStyle, "aria-hidden": "true" }) : /* @__PURE__ */ jsx("span", {}),
+        /* @__PURE__ */ jsx("span", { children: item.label }),
+        item.count !== void 0 && /* @__PURE__ */ jsx("span", { className: navItemCount, children: item.count })
+      ]
+    }
+  );
+}
+
+// src/components/AppBar/AppBar.css.ts
+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";
+var brandSub = "AppBar_brandSub__uqki994";
+var searchArea = "AppBar_searchArea__uqki995";
+var searchInput2 = "AppBar_searchInput__uqki996";
+var searchKbd = "AppBar_searchKbd__uqki997";
+function AppBar({
+  brandName: brandName2 = "Achery",
+  brandSub: brandSub2,
+  showSearch = true,
+  searchPlaceholder = "Search\u2026",
+  searchKbd: searchKbd2,
+  actions: actions2,
+  accent = "terracotta",
+  onAccentChange,
+  onToggleTheme,
+  isDark,
+  avatarInitials,
+  onNewClick,
+  className
+}) {
+  return /* @__PURE__ */ jsxs("header", { className: [appBar, className].filter(Boolean).join(" "), children: [
+    /* @__PURE__ */ jsxs("div", { className: brand, children: [
+      /* @__PURE__ */ jsx(Glyph, { name: "hex", size: 20, "aria-hidden": "true" }),
+      /* @__PURE__ */ jsx("span", { className: brandName, children: brandName2 }),
+      brandSub2 && /* @__PURE__ */ jsxs(Fragment, { children: [
+        /* @__PURE__ */ jsx("span", { className: brandDivider }),
+        /* @__PURE__ */ jsx("span", { className: brandSub, children: brandSub2 })
+      ] })
+    ] }),
+    showSearch && /* @__PURE__ */ jsxs("div", { className: searchArea, children: [
+      /* @__PURE__ */ jsx(Glyph, { name: "compass", size: 12, "aria-hidden": "true" }),
+      /* @__PURE__ */ jsx(
+        "input",
+        {
+          type: "search",
+          placeholder: searchPlaceholder,
+          className: searchInput2,
+          "aria-label": "Search"
+        }
+      ),
+      searchKbd2 && /* @__PURE__ */ jsx("span", { className: searchKbd, children: searchKbd2 })
+    ] }),
+    /* @__PURE__ */ jsxs("div", { className: actions, children: [
+      onAccentChange && /* @__PURE__ */ jsx("div", { className: accentPicker, role: "group", "aria-label": "Brand colour", children: accentColorNames.map((name) => /* @__PURE__ */ jsx(
+        "button",
+        {
+          className: accentSwatch,
+          "data-active": name === accent,
+          onClick: () => onAccentChange(name),
+          "aria-label": name,
+          "aria-pressed": name === accent,
+          style: { background: accentColors[name].main }
+        },
+        name
+      )) }),
+      onToggleTheme && /* @__PURE__ */ jsx(
+        Button,
+        {
+          variant: "ghost",
+          size: "sm",
+          glyph: isDark ? "sun" : "moon",
+          onClick: onToggleTheme,
+          "aria-label": isDark ? "Switch to light mode" : "Switch to dark mode"
+        }
+      ),
+      onNewClick && /* @__PURE__ */ jsx(Button, { variant: "accent", size: "sm", glyph: "plus", onClick: onNewClick, children: "New" }),
+      actions2,
+      avatarInitials && /* @__PURE__ */ jsx("div", { className: avatar, "aria-label": `User: ${avatarInitials}`, children: avatarInitials.slice(0, 2).toUpperCase() })
+    ] })
+  ] });
+}
+
+// src/components/Table/Table.css.ts
+var sortIndicator = "Table_sortIndicator__1a2tbys5";
+var table = "Table_table__1a2tbys1";
+var tableWrapper = "Table_tableWrapper__1a2tbys0";
+var td = "Table_td__1a2tbys7";
+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 tr = "Table_tr__1a2tbys6";
+function Table({
+  columns,
+  data,
+  rowKey,
+  selectedKeys,
+  onRowClick,
+  sortKey: controlledSortKey,
+  sortDir: controlledSortDir,
+  defaultSortKey,
+  defaultSortDir = null,
+  onSortChange,
+  className
+}) {
+  const [internalSortKey, setInternalSortKey] = useState(defaultSortKey ?? null);
+  const [internalSortDir, setInternalSortDir] = useState(defaultSortDir);
+  const isControlled = controlledSortKey !== void 0;
+  const activeSortKey = isControlled ? controlledSortKey ?? null : internalSortKey;
+  const activeSortDir = isControlled ? controlledSortDir ?? null : internalSortDir;
+  const handleSort = (key) => {
+    let nextDir;
+    if (activeSortKey === key) {
+      nextDir = activeSortDir === "asc" ? "desc" : activeSortDir === "desc" ? null : "asc";
+    } else {
+      nextDir = "asc";
+    }
+    const nextKey = nextDir === null ? null : key;
+    if (!isControlled) {
+      setInternalSortKey(nextKey);
+      setInternalSortDir(nextDir);
+    }
+    onSortChange?.(key, nextDir);
+  };
+  const sortedData = useMemo(() => {
+    if (!activeSortKey || !activeSortDir) return data;
+    return [...data].sort((a, b) => {
+      const av = a[activeSortKey];
+      const bv = b[activeSortKey];
+      const cmp = String(av ?? "").localeCompare(String(bv ?? ""), void 0, { numeric: true });
+      return activeSortDir === "asc" ? cmp : -cmp;
+    });
+  }, [data, activeSortKey, activeSortDir]);
+  return /* @__PURE__ */ jsx("div", { className: [tableWrapper, className].filter(Boolean).join(" "), children: /* @__PURE__ */ jsxs("table", { className: table, children: [
+    /* @__PURE__ */ jsx("thead", { className: thead, children: /* @__PURE__ */ jsx("tr", { children: columns.map((col) => /* @__PURE__ */ 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__ */ jsx("span", { className: sortIndicator, "aria-hidden": "true", children: /* @__PURE__ */ jsx(Glyph, { name: activeSortDir === "asc" ? "arrow-up" : "arrow-right", size: 10 }) })
+        ]
+      },
+      col.key
+    )) }) }),
+    /* @__PURE__ */ jsx("tbody", { children: sortedData.map((row) => {
+      const key = rowKey(row);
+      const isSelected = selectedKeys?.includes(key) ?? false;
+      return /* @__PURE__ */ 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__ */ jsx("td", { className: col.mono ? tdMono : td, children: col.render ? col.render(row) : String(row[col.key] ?? "") }, col.key))
+        },
+        key
+      );
+    }) })
+  ] }) });
+}
+
+// src/components/Modal/Modal.css.ts
+var body2 = "Modal_body__1kcb5si8";
+var closeButton = "Modal_closeButton__1kcb5si7";
+var content2 = "Modal_content__1kcb5si3";
+var description = "Modal_description__1kcb5si6";
+var footer2 = "Modal_footer__1kcb5si9";
+var header = "Modal_header__1kcb5si4";
+var overlay = "Modal_overlay__1kcb5si2";
+var title = "Modal_title__1kcb5si5";
+function Modal({
+  open,
+  defaultOpen,
+  onOpenChange,
+  title: title2,
+  description: description2,
+  children,
+  footer: footer3,
+  trigger,
+  className
+}) {
+  return /* @__PURE__ */ jsxs(
+    RadixDialog.Root,
+    {
+      ...open !== void 0 ? { open } : {},
+      ...defaultOpen !== void 0 ? { defaultOpen } : {},
+      ...onOpenChange !== void 0 ? { onOpenChange } : {},
+      children: [
+        trigger && /* @__PURE__ */ jsx(RadixDialog.Trigger, { asChild: true, children: trigger }),
+        /* @__PURE__ */ jsxs(RadixDialog.Portal, { children: [
+          /* @__PURE__ */ jsx(RadixDialog.Overlay, { className: overlay }),
+          /* @__PURE__ */ jsxs(
+            RadixDialog.Content,
+            {
+              className: [content2, className].filter(Boolean).join(" "),
+              "aria-describedby": description2 ? "modal-description" : void 0,
+              children: [
+                /* @__PURE__ */ jsxs("div", { className: header, children: [
+                  /* @__PURE__ */ jsxs("div", { children: [
+                    title2 && /* @__PURE__ */ jsx(RadixDialog.Title, { className: title, children: title2 }),
+                    description2 && /* @__PURE__ */ jsx(RadixDialog.Description, { id: "modal-description", className: description, children: description2 })
+                  ] }),
+                  /* @__PURE__ */ jsx(RadixDialog.Close, { className: closeButton, "aria-label": "Close", children: /* @__PURE__ */ jsx(Glyph, { name: "cross", size: 14, "aria-hidden": "true" }) })
+                ] }),
+                /* @__PURE__ */ jsx("div", { className: body2, children }),
+                footer3 && /* @__PURE__ */ jsx("div", { className: footer2, children: footer3 })
+              ]
+            }
+          )
+        ] })
+      ]
+    }
+  );
+}
+
+// src/components/Toast/Toast.css.ts
+var toast = "Toast_toast__1btt01v3";
+var toastAction = "Toast_toastAction__1btt01v7";
+var toastClose = "Toast_toastClose__1btt01v6";
+var toastDescription = "Toast_toastDescription__1btt01v5";
+var toastTitle = "Toast_toastTitle__1btt01v4";
+var viewport = "Toast_viewport__1btt01v2";
+var ToastContext = createContext(null);
+function useToast() {
+  const ctx = useContext(ToastContext);
+  if (!ctx) throw new Error("useToast must be used within <ToastProvider>");
+  return ctx;
+}
+function ToastProvider({ children }) {
+  const [toasts, setToasts] = useState([]);
+  const toast2 = useCallback((data) => {
+    const id = String(Date.now());
+    setToasts((prev) => [...prev, { ...data, id }]);
+    const duration = data.duration ?? 4e3;
+    if (duration > 0) {
+      setTimeout(() => {
+        setToasts((prev) => prev.filter((t) => t.id !== id));
+      }, duration);
+    }
+  }, []);
+  const dismiss = (id) => setToasts((prev) => prev.filter((t) => t.id !== id));
+  return /* @__PURE__ */ jsxs(ToastContext.Provider, { value: { toast: toast2 }, children: [
+    children,
+    typeof document !== "undefined" && createPortal(
+      /* @__PURE__ */ jsx("ol", { className: viewport, "aria-live": "polite", "aria-label": "Notifications", children: toasts.map((t) => /* @__PURE__ */ jsxs("li", { className: toast, role: "status", children: [
+        /* @__PURE__ */ jsxs("div", { children: [
+          /* @__PURE__ */ jsx("div", { className: toastTitle, children: t.title }),
+          t.description && /* @__PURE__ */ jsx("div", { className: toastDescription, children: t.description }),
+          t.action && /* @__PURE__ */ jsx("div", { className: toastAction, children: t.action })
+        ] }),
+        /* @__PURE__ */ jsx(
+          "button",
+          {
+            className: toastClose,
+            onClick: () => dismiss(t.id),
+            "aria-label": "Dismiss",
+            children: /* @__PURE__ */ jsx(Glyph, { name: "cross", size: 12, "aria-hidden": "true" })
+          }
+        )
+      ] }, t.id)) }),
+      document.body
+    )
+  ] });
+}
+
+export { AcheryProvider, AppBar, Badge, Body, Button, Card, Display, Eyebrow, Field, Glyph, Heading, Input, Marginalia, Modal, Mono, SearchInput, Select, Sidebar, Table, Tabs, Textarea, ToastProvider, Toggle, Tooltip, useTheme, useToast, vars };
+//# sourceMappingURL=index.js.map
+//# sourceMappingURL=index.js.map