@lukeashford/aurelius 2.2.0 → 2.3.0

package/dist/index.mjs

@@ -1,8 +1,12 @@
 // src/components/Button.tsx
 import React from "react";
+
+// src/utils/cx.ts
 function cx(...classes) {
   return classes.filter(Boolean).join(" ");
 }
+
+// src/components/Button.tsx
 var Button = React.forwardRef(
   ({ variant = "primary", size = "md", loading = false, className, disabled, children, ...rest }, ref) => {
     const isDisabled = disabled || loading;
@@ -12,7 +16,7 @@ var Button = React.forwardRef(
       important: "bg-gold text-obsidian border border-gold hover:bg-gold-light hover:text-obsidian active:bg-gold-bright focus-visible:ring-2 focus-visible:ring-gold focus-visible:ring-offset-2 focus-visible:ring-offset-obsidian",
       elevated: "bg-charcoal text-white border-0 shadow-lg hover:shadow-xl hover:text-gold-light active:bg-white/5 focus-visible:ring-2 focus-visible:ring-gold focus-visible:ring-offset-2 focus-visible:ring-offset-obsidian",
       outlined: "bg-transparent text-white border border-ash hover:border-white hover:text-white active:bg-white/5 focus-visible:ring-2 focus-visible:ring-gold focus-visible:ring-offset-2 focus-visible:ring-offset-obsidian",
-      featured: "bg-charcoal text-white border border-gold shadow-[0_0_10px_rgba(201,162,39,0.2)] hover:shadow-[0_0_15px_rgba(201,162,39,0.4)] hover:text-gold-light active:bg-white/5 focus-visible:ring-2 focus-visible:ring-gold focus-visible:ring-offset-2 focus-visible:ring-offset-obsidian",
+      featured: "bg-charcoal text-white border border-gold glow-sm hover:glow-md hover:text-gold-light active:bg-white/5 focus-visible:ring-2 focus-visible:ring-gold focus-visible:ring-offset-2 focus-visible:ring-offset-obsidian",
       ghost: "bg-transparent text-gold border-0 hover:text-gold-light active:text-gold-bright focus-visible:ring-2 focus-visible:ring-gold focus-visible:ring-offset-2 focus-visible:ring-offset-obsidian",
       danger: "bg-error text-white border-0 hover:bg-error/90 active:bg-error/80 focus-visible:ring-2 focus-visible:ring-error focus-visible:ring-offset-2 focus-visible:ring-offset-obsidian"
     };
@@ -47,21 +51,19 @@ Button.displayName = "Button";
 
 // src/components/Input.tsx
 import React2 from "react";
-function cx2(...classes) {
-  return classes.filter(Boolean).join(" ");
-}
 var Input = React2.forwardRef(
   ({ error = false, className, leadingIcon, trailingIcon, disabled, ...rest }, ref) => {
     const base = "w-full h-10 px-3 bg-graphite border border-ash rounded-none text-white placeholder:text-zinc transition-all duration-fast focus:border-gold focus:ring-1 focus:ring-gold focus:outline-none disabled:bg-slate disabled:text-dim disabled:cursor-not-allowed";
     const errorCls = error ? "border-error focus:border-error focus:ring-error" : "";
-    return /* @__PURE__ */ React2.createElement("div", { className: cx2("relative", disabled && "opacity-90") }, leadingIcon && /* @__PURE__ */ React2.createElement("span", { className: "pointer-events-none absolute inset-y-0 left-3 flex items-center text-silver" }, leadingIcon), /* @__PURE__ */ React2.createElement(
+    return /* @__PURE__ */ React2.createElement("div", { className: cx("relative", disabled && "opacity-90") }, leadingIcon && /* @__PURE__ */ React2.createElement("span", { className: "pointer-events-none absolute inset-y-0 left-3 flex items-center text-silver" }, leadingIcon), /* @__PURE__ */ React2.createElement(
       "input",
       {
         ref,
-        className: cx2(
+        className: cx(
           base,
           errorCls,
-          leadingIcon || trailingIcon ? "pl-9 pr-9" : false,
+          leadingIcon ? "pl-9" : false,
+          trailingIcon ? "pr-9" : false,
           className
         ),
         disabled,
@@ -80,19 +82,25 @@ var VARIANT_STYLES = {
   elevated: "bg-charcoal shadow-lg border-0",
   outlined: "bg-charcoal shadow-none border border-ash",
   ghost: "bg-transparent shadow-none border-0",
-  featured: "bg-charcoal border border-gold shadow-glow-sm"
+  featured: "bg-charcoal border border-gold glow-sm"
 };
-function cx3(...classes) {
-  return classes.filter(Boolean).join(" ");
-}
-var Card = React3.forwardRef(
-  ({ variant = "default", interactive = false, selected = false, className, children, ...props }, ref) => {
+var CardBase = React3.forwardRef(
+  ({
+    variant = "default",
+    interactive = false,
+    selected = false,
+    noPadding = false,
+    className,
+    children,
+    ...props
+  }, ref) => {
     return /* @__PURE__ */ React3.createElement(
       "div",
       {
         ref,
-        className: cx3(
-          "rounded-none p-6 relative",
+        className: cx(
+          "rounded-none relative",
+          !noPadding && "p-6",
           VARIANT_STYLES[variant],
           interactive && "transition-all duration-200 hover:border-gold hover:shadow-glow cursor-pointer",
           selected && "border-gold shadow-glow-md",
@@ -101,23 +109,364 @@ var Card = React3.forwardRef(
         ...props
       },
       children,
-      selected && /* @__PURE__ */ React3.createElement(
+      selected && /* @__PURE__ */ React3.createElement("div", { className: "absolute top-3 right-3 flex items-center justify-center h-6 w-6 rounded-full bg-gold text-obsidian" }, /* @__PURE__ */ React3.createElement(Check, { className: "h-4 w-4" }))
+    );
+  }
+);
+CardBase.displayName = "Card";
+var CardHeader = React3.forwardRef(
+  ({ title, subtitle, action, className, children, ...props }, ref) => {
+    return /* @__PURE__ */ React3.createElement(
+      "div",
+      {
+        ref,
+        className: cx("px-6 py-4 border-b border-ash", className),
+        ...props
+      },
+      title || subtitle || action ? /* @__PURE__ */ React3.createElement("div", { className: "flex items-start justify-between gap-4" }, /* @__PURE__ */ React3.createElement("div", { className: "flex-1 min-w-0" }, title && /* @__PURE__ */ React3.createElement("h3", { className: "text-lg font-semibold text-white m-0" }, title), subtitle && /* @__PURE__ */ React3.createElement("p", { className: "text-sm text-silver mt-1 m-0" }, subtitle)), action && /* @__PURE__ */ React3.createElement("div", { className: "shrink-0" }, action)) : children
+    );
+  }
+);
+CardHeader.displayName = "CardHeader";
+var CardBody = React3.forwardRef(
+  ({ className, children, ...props }, ref) => {
+    return /* @__PURE__ */ React3.createElement("div", { ref, className: cx("px-6 py-4", className), ...props }, children);
+  }
+);
+CardBody.displayName = "CardBody";
+var CardFooter = React3.forwardRef(
+  ({ align = "end", className, children, ...props }, ref) => {
+    const alignClass = {
+      start: "justify-start",
+      center: "justify-center",
+      end: "justify-end",
+      between: "justify-between"
+    }[align];
+    return /* @__PURE__ */ React3.createElement(
+      "div",
+      {
+        ref,
+        className: cx(
+          "px-6 py-4 border-t border-ash flex items-center gap-3",
+          alignClass,
+          className
+        ),
+        ...props
+      },
+      children
+    );
+  }
+);
+CardFooter.displayName = "CardFooter";
+var CardMedia = React3.forwardRef(
+  ({ src, alt = "", aspect = "video", position = "top", className, children, ...props }, ref) => {
+    const aspectClass = {
+      video: "aspect-video",
+      square: "aspect-square",
+      wide: "aspect-wide"
+    }[aspect];
+    return /* @__PURE__ */ React3.createElement(
+      "div",
+      {
+        ref,
+        className: cx(
+          "overflow-hidden",
+          aspectClass,
+          position === "top" && "border-b border-ash",
+          position === "bottom" && "border-t border-ash",
+          className
+        ),
+        ...props
+      },
+      src ? /* @__PURE__ */ React3.createElement("img", { src, alt, className: "w-full h-full object-cover" }) : children
+    );
+  }
+);
+CardMedia.displayName = "CardMedia";
+var Card = Object.assign(CardBase, {
+  Header: CardHeader,
+  Body: CardBody,
+  Footer: CardFooter,
+  Media: CardMedia
+});
+
+// src/components/Container.tsx
+import React4 from "react";
+var SIZE_CLASSES = {
+  sm: "container-sm",
+  md: "container-md",
+  lg: "container-lg",
+  xl: "container-xl",
+  fluid: "container-fluid",
+  responsive: "container"
+};
+var Container = React4.forwardRef(
+  ({ size = "responsive", className, children, ...props }, ref) => {
+    return /* @__PURE__ */ React4.createElement("div", { ref, className: cx(SIZE_CLASSES[size], className), ...props }, children);
+  }
+);
+Container.displayName = "Container";
+
+// src/components/Row.tsx
+import React5 from "react";
+var JUSTIFY_MAP = {
+  start: "justify-start",
+  center: "justify-center",
+  end: "justify-end",
+  between: "justify-between",
+  around: "justify-around",
+  evenly: "justify-evenly"
+};
+var ALIGN_MAP = {
+  start: "items-start",
+  center: "items-center",
+  end: "items-end",
+  stretch: "items-stretch",
+  baseline: "items-baseline"
+};
+function getGapClass(value) {
+  return `gap-${value}`;
+}
+function getGapXClass(value) {
+  return `gap-x-${value}`;
+}
+function getGapYClass(value) {
+  return `gap-y-${value}`;
+}
+var Row = React5.forwardRef(
+  ({ gutter = 4, gutterX, gutterY, justify, align, className, children, ...props }, ref) => {
+    const gapClass = gutterX === void 0 && gutterY === void 0 ? getGapClass(gutter) : "";
+    const gapXClass = gutterX !== void 0 ? getGapXClass(gutterX) : "";
+    const gapYClass = gutterY !== void 0 ? getGapYClass(gutterY) : "";
+    return /* @__PURE__ */ React5.createElement(
+      "div",
+      {
+        ref,
+        className: cx(
+          "row",
+          gapClass,
+          gapXClass,
+          gapYClass,
+          justify && JUSTIFY_MAP[justify],
+          align && ALIGN_MAP[align],
+          className
+        ),
+        ...props
+      },
+      children
+    );
+  }
+);
+Row.displayName = "Row";
+
+// src/components/Col.tsx
+import React6 from "react";
+var BREAKPOINT_PREFIXES = {
+  base: "",
+  sm: "sm:",
+  md: "md:",
+  lg: "lg:",
+  xl: "xl:",
+  "2xl": "2xl:"
+};
+function getSpanClass(value, prefix) {
+  if (value === "auto") return `${prefix}col-auto`;
+  if (value === "full") return `${prefix}col-span-full`;
+  return `${prefix}col-span-${value}`;
+}
+function getOffsetClass(value, prefix) {
+  if (value === 0) return "";
+  return `${prefix}col-start-${value + 1}`;
+}
+function getOrderClass(value, prefix) {
+  if (value === "first") return `${prefix}order-first`;
+  if (value === "last") return `${prefix}order-last`;
+  if (value === "none") return `${prefix}order-none`;
+  return `${prefix}order-${value}`;
+}
+function isResponsiveValue(value) {
+  return typeof value === "object" && value !== null && !Array.isArray(value);
+}
+function buildResponsiveClasses(value, getClass) {
+  if (value === void 0) return [];
+  if (!isResponsiveValue(value)) {
+    const cls = getClass(value, "");
+    return cls ? [cls] : [];
+  }
+  const classes = [];
+  for (const [breakpoint, val] of Object.entries(value)) {
+    if (val !== void 0) {
+      const prefix = BREAKPOINT_PREFIXES[breakpoint] ?? "";
+      const cls = getClass(val, prefix);
+      if (cls) classes.push(cls);
+    }
+  }
+  return classes;
+}
+var Col = React6.forwardRef(
+  ({ span, offset, order, className, children, ...props }, ref) => {
+    const spanClasses = buildResponsiveClasses(span, getSpanClass);
+    const offsetClasses = buildResponsiveClasses(offset, getOffsetClass);
+    const orderClasses = buildResponsiveClasses(order, getOrderClass);
+    const hasSpan = span !== void 0;
+    const defaultSpan = hasSpan ? "" : "col-span-12";
+    return /* @__PURE__ */ React6.createElement(
+      "div",
+      {
+        ref,
+        className: cx(
+          defaultSpan,
+          ...spanClasses,
+          ...offsetClasses,
+          ...orderClasses,
+          className
+        ),
+        ...props
+      },
+      children
+    );
+  }
+);
+Col.displayName = "Col";
+
+// src/components/Stack.tsx
+import React7 from "react";
+var ALIGN_MAP2 = {
+  start: "items-start",
+  center: "items-center",
+  end: "items-end",
+  stretch: "items-stretch",
+  baseline: "items-baseline"
+};
+var JUSTIFY_MAP2 = {
+  start: "justify-start",
+  center: "justify-center",
+  end: "justify-end",
+  between: "justify-between",
+  around: "justify-around",
+  evenly: "justify-evenly"
+};
+var GAP_MAP = {
+  0: "gap-0",
+  1: "gap-1",
+  2: "gap-2",
+  3: "gap-3",
+  4: "gap-4",
+  5: "gap-5",
+  6: "gap-6",
+  8: "gap-8",
+  10: "gap-10",
+  12: "gap-12"
+};
+var Stack = React7.forwardRef(
+  ({
+    direction = "vertical",
+    align,
+    justify,
+    gap = 4,
+    wrap = false,
+    as: Component = "div",
+    className,
+    children,
+    ...props
+  }, ref) => {
+    return /* @__PURE__ */ React7.createElement(
+      Component,
+      {
+        ref,
+        className: cx(
+          "flex",
+          direction === "horizontal" ? "flex-row" : "flex-col",
+          align && ALIGN_MAP2[align],
+          justify && JUSTIFY_MAP2[justify],
+          GAP_MAP[gap],
+          wrap && "flex-wrap",
+          className
+        ),
+        ...props
+      },
+      children
+    );
+  }
+);
+Stack.displayName = "Stack";
+
+// src/components/Divider.tsx
+import React8 from "react";
+var COLOR_MAP = {
+  default: "border-ash",
+  gold: "border-gold/50",
+  muted: "border-slate"
+};
+var VARIANT_MAP = {
+  solid: "border-solid",
+  dashed: "border-dashed",
+  dotted: "border-dotted"
+};
+var Divider = React8.forwardRef(
+  ({
+    orientation = "horizontal",
+    variant = "solid",
+    label,
+    color = "default",
+    className,
+    ...props
+  }, ref) => {
+    const isHorizontal = orientation === "horizontal";
+    if (label && isHorizontal) {
+      return /* @__PURE__ */ React8.createElement(
         "div",
         {
-          className: "absolute top-3 right-3 flex items-center justify-center h-6 w-6 rounded-full bg-gold text-obsidian"
+          className: cx("flex items-center gap-4", className),
+          role: "separator",
+          "aria-orientation": orientation
         },
-        /* @__PURE__ */ React3.createElement(Check, { className: "h-4 w-4" })
-      )
+        /* @__PURE__ */ React8.createElement(
+          "div",
+          {
+            className: cx(
+              "flex-1 border-t",
+              VARIANT_MAP[variant],
+              COLOR_MAP[color]
+            )
+          }
+        ),
+        /* @__PURE__ */ React8.createElement("span", { className: "text-sm text-silver shrink-0" }, label),
+        /* @__PURE__ */ React8.createElement(
+          "div",
+          {
+            className: cx(
+              "flex-1 border-t",
+              VARIANT_MAP[variant],
+              COLOR_MAP[color]
+            )
+          }
+        )
+      );
+    }
+    return /* @__PURE__ */ React8.createElement(
+      "hr",
+      {
+        ref,
+        role: "separator",
+        "aria-orientation": orientation,
+        className: cx(
+          isHorizontal ? "border-t w-full" : "border-l h-full",
+          VARIANT_MAP[variant],
+          COLOR_MAP[color],
+          "border-0",
+          isHorizontal ? "border-t" : "border-l",
+          className
+        ),
+        ...props
+      }
     );
   }
 );
-Card.displayName = "Card";
+Divider.displayName = "Divider";
 
 // src/components/Avatar.tsx
-import React4 from "react";
-function cx4(...classes) {
-  return classes.filter(Boolean).join(" ");
-}
+import React9 from "react";
 var sizeMap = {
   xs: "h-6 w-6 text-[10px]",
   sm: "h-8 w-8 text-[11px]",
@@ -131,25 +480,25 @@ function initials(name) {
   const parts = name.trim().split(/\s+/);
   return parts.slice(0, 2).map((p) => p[0].toUpperCase()).join("");
 }
-var Avatar = React4.forwardRef(
+var Avatar = React9.forwardRef(
   ({ src, alt = "", name, size = "md", status, className, ...rest }, ref) => {
     const statusColor = status === "online" ? "bg-success" : status === "busy" ? "bg-warning" : "bg-zinc";
-    return /* @__PURE__ */ React4.createElement(
+    return /* @__PURE__ */ React9.createElement(
       "div",
       {
         ref,
-        className: cx4(
+        className: cx(
           "relative inline-flex items-center justify-center rounded-full border-2 border-ash bg-slate text-silver font-semibold select-none overflow-hidden",
           sizeMap[size],
           className
         ),
         ...rest
       },
-      src ? /* @__PURE__ */ React4.createElement("img", { src, alt: alt || name || "Avatar", className: "h-full w-full object-cover" }) : /* @__PURE__ */ React4.createElement("span", { "aria-hidden": true }, initials(name) || "\xB7"),
-      status && /* @__PURE__ */ React4.createElement(
+      src ? /* @__PURE__ */ React9.createElement("img", { src, alt: alt || name || "Avatar", className: "h-full w-full object-cover" }) : /* @__PURE__ */ React9.createElement("span", { "aria-hidden": true }, initials(name) || "\xB7"),
+      status && /* @__PURE__ */ React9.createElement(
         "span",
         {
-          className: cx4(
+          className: cx(
             "absolute bottom-0 right-0 rounded-full ring-2 ring-charcoal",
             // 25% of avatar size
             size === "xs" ? "h-1.5 w-1.5" : size === "sm" ? "h-2 w-2" : size === "md" ? "h-2.5 w-2.5" : size === "lg" ? "h-3 w-3" : size === "xl" ? "h-4 w-4" : "h-5 w-5",
@@ -163,11 +512,8 @@ var Avatar = React4.forwardRef(
 Avatar.displayName = "Avatar";
 
 // src/components/Badge.tsx
-import React5 from "react";
-function cx5(...classes) {
-  return classes.filter(Boolean).join(" ");
-}
-var Badge = React5.forwardRef(
+import React10 from "react";
+var Badge = React10.forwardRef(
   ({ variant = "default", className, ...rest }, ref) => {
     const base = "inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium border";
     const variantClasses = {
@@ -179,22 +525,19 @@ var Badge = React5.forwardRef(
       info: "bg-info/20 text-info border-info/30"
     };
     const variantClass = variantClasses[variant];
-    return /* @__PURE__ */ React5.createElement("span", { ref, className: cx5(base, variantClass, className), ...rest });
+    return /* @__PURE__ */ React10.createElement("span", { ref, className: cx(base, variantClass, className), ...rest });
   }
 );
 Badge.displayName = "Badge";
 
 // src/components/Tooltip.tsx
-import React6 from "react";
-function cx6(...classes) {
-  return classes.filter(Boolean).join(" ");
-}
+import React11 from "react";
 var Tooltip = ({ content, children, open = false, side = "top" }) => {
-  return /* @__PURE__ */ React6.createElement("span", { className: "relative inline-block" }, children, /* @__PURE__ */ React6.createElement(
+  return /* @__PURE__ */ React11.createElement("span", { className: "relative inline-block" }, children, /* @__PURE__ */ React11.createElement(
     "span",
     {
       role: "tooltip",
-      className: cx6(
+      className: cx(
         "pointer-events-none absolute z-50 whitespace-nowrap rounded-md border border-ash bg-graphite px-3 py-1.5 text-sm text-white shadow-lg transition-opacity duration-200 ease-out",
         open ? "opacity-100" : "opacity-0",
         side === "top" && "left-1/2 -translate-x-1/2 -top-2 -translate-y-full",
@@ -207,39 +550,231 @@ var Tooltip = ({ content, children, open = false, side = "top" }) => {
   ));
 };
 
+// src/components/Table.tsx
+import React12 from "react";
+var Table = React12.forwardRef(
+  ({ responsive = true, className, children, ...props }, ref) => {
+    const table = /* @__PURE__ */ React12.createElement(
+      "table",
+      {
+        ref,
+        className: cx("w-full text-sm", className),
+        ...props
+      },
+      children
+    );
+    if (responsive) {
+      return /* @__PURE__ */ React12.createElement("div", { className: "w-full overflow-x-auto" }, table);
+    }
+    return table;
+  }
+);
+Table.displayName = "Table";
+var TableHeader = React12.forwardRef(
+  ({ className, children, ...props }, ref) => /* @__PURE__ */ React12.createElement(
+    "thead",
+    {
+      ref,
+      className: cx("bg-graphite", className),
+      ...props
+    },
+    children
+  )
+);
+TableHeader.displayName = "TableHeader";
+var TableBody = React12.forwardRef(
+  ({ className, children, ...props }, ref) => /* @__PURE__ */ React12.createElement(
+    "tbody",
+    {
+      ref,
+      className: cx("divide-y divide-ash", className),
+      ...props
+    },
+    children
+  )
+);
+TableBody.displayName = "TableBody";
+var TableFooter = React12.forwardRef(
+  ({ className, children, ...props }, ref) => /* @__PURE__ */ React12.createElement(
+    "tfoot",
+    {
+      ref,
+      className: cx("bg-graphite font-medium", className),
+      ...props
+    },
+    children
+  )
+);
+TableFooter.displayName = "TableFooter";
+var TableRow = React12.forwardRef(
+  ({ hoverable = true, selected = false, className, children, ...props }, ref) => /* @__PURE__ */ React12.createElement(
+    "tr",
+    {
+      ref,
+      className: cx(
+        "transition-colors duration-fast",
+        hoverable && "hover:bg-graphite/50",
+        selected && "bg-gold/10",
+        className
+      ),
+      ...props
+    },
+    children
+  )
+);
+TableRow.displayName = "TableRow";
+var TableHead = React12.forwardRef(
+  ({ sortable, sortDirection, className, children, ...props }, ref) => /* @__PURE__ */ React12.createElement(
+    "th",
+    {
+      ref,
+      className: cx(
+        "px-4 py-3 text-left font-semibold text-silver",
+        sortable && "cursor-pointer hover:text-white select-none",
+        className
+      ),
+      ...props
+    },
+    /* @__PURE__ */ React12.createElement("div", { className: "flex items-center gap-2" }, children, sortable && sortDirection && /* @__PURE__ */ React12.createElement("span", { className: "text-gold" }, sortDirection === "asc" ? "\u2191" : "\u2193"))
+  )
+);
+TableHead.displayName = "TableHead";
+var TableCell = React12.forwardRef(
+  ({ className, children, ...props }, ref) => /* @__PURE__ */ React12.createElement(
+    "td",
+    {
+      ref,
+      className: cx("px-4 py-3 text-white", className),
+      ...props
+    },
+    children
+  )
+);
+TableCell.displayName = "TableCell";
+var TableCaption = React12.forwardRef(
+  ({ className, children, ...props }, ref) => /* @__PURE__ */ React12.createElement(
+    "caption",
+    {
+      ref,
+      className: cx("mt-4 text-sm text-silver", className),
+      ...props
+    },
+    children
+  )
+);
+TableCaption.displayName = "TableCaption";
+
+// src/components/List.tsx
+import React13 from "react";
+var List = React13.forwardRef(
+  ({ variant = "default", ordered = false, className, children, ...props }, ref) => {
+    const Component = ordered ? "ol" : "ul";
+    return /* @__PURE__ */ React13.createElement(
+      Component,
+      {
+        ref,
+        className: cx(
+          "list-none m-0 p-0",
+          variant === "bordered" && "border border-ash",
+          variant === "divided" && "divide-y divide-ash",
+          className
+        ),
+        ...props
+      },
+      children
+    );
+  }
+);
+List.displayName = "List";
+var ListItem = React13.forwardRef(
+  ({
+    leading,
+    trailing,
+    interactive = false,
+    selected = false,
+    disabled = false,
+    className,
+    children,
+    onClick,
+    ...props
+  }, ref) => {
+    const handleClick = (e) => {
+      if (disabled) return;
+      onClick?.(e);
+    };
+    return /* @__PURE__ */ React13.createElement(
+      "li",
+      {
+        ref,
+        onClick: handleClick,
+        className: cx(
+          "flex items-center gap-3 px-4 py-3",
+          interactive && "cursor-pointer transition-colors duration-fast",
+          interactive && !disabled && "hover:bg-graphite",
+          selected && "bg-gold/10",
+          disabled && "opacity-50 cursor-not-allowed",
+          className
+        ),
+        ...props
+      },
+      leading && /* @__PURE__ */ React13.createElement("div", { className: "shrink-0" }, leading),
+      /* @__PURE__ */ React13.createElement("div", { className: "flex-1 min-w-0" }, children),
+      trailing && /* @__PURE__ */ React13.createElement("div", { className: "shrink-0" }, trailing)
+    );
+  }
+);
+ListItem.displayName = "ListItem";
+var ListItemText = React13.forwardRef(
+  ({ primary, secondary, className, ...props }, ref) => {
+    return /* @__PURE__ */ React13.createElement("div", { ref, className: cx("flex flex-col", className), ...props }, /* @__PURE__ */ React13.createElement("span", { className: "text-sm font-medium text-white" }, primary), secondary && /* @__PURE__ */ React13.createElement("span", { className: "text-xs text-silver mt-0.5" }, secondary));
+  }
+);
+ListItemText.displayName = "ListItemText";
+var ListSubheader = React13.forwardRef(
+  ({ className, children, ...props }, ref) => {
+    return /* @__PURE__ */ React13.createElement(
+      "li",
+      {
+        ref,
+        className: cx(
+          "px-4 py-2 text-xs font-semibold text-gold uppercase tracking-wider bg-graphite",
+          className
+        ),
+        ...props
+      },
+      children
+    );
+  }
+);
+ListSubheader.displayName = "ListSubheader";
+
 // src/components/Label.tsx
-import React7 from "react";
-function cx7(...classes) {
-  return classes.filter(Boolean).join(" ");
-}
-var Label = React7.forwardRef(
+import React14 from "react";
+var Label = React14.forwardRef(
   ({ className, required, children, ...rest }, ref) => {
-    return /* @__PURE__ */ React7.createElement(
+    return /* @__PURE__ */ React14.createElement(
       "label",
       {
         ref,
-        className: cx7("block text-sm font-medium text-silver mb-1.5", className),
+        className: cx("block text-sm font-medium text-silver mb-1.5", className),
         ...rest
       },
       children,
-      required && /* @__PURE__ */ React7.createElement("span", { className: "text-error ml-1" }, "*")
+      required && /* @__PURE__ */ React14.createElement("span", { className: "text-error ml-1" }, "*")
     );
   }
 );
 Label.displayName = "Label";
 
 // src/components/HelperText.tsx
-import React8 from "react";
-function cx8(...classes) {
-  return classes.filter(Boolean).join(" ");
-}
-var HelperText = React8.forwardRef(
+import React15 from "react";
+var HelperText = React15.forwardRef(
   ({ className, error, children, ...rest }, ref) => {
-    return /* @__PURE__ */ React8.createElement(
+    return /* @__PURE__ */ React15.createElement(
       "p",
       {
         ref,
-        className: cx8("mt-1.5 text-xs", error ? "text-error" : "text-silver", className),
+        className: cx("mt-1.5 text-xs", error ? "text-error" : "text-silver", className),
         ...rest
       },
       children
@@ -249,19 +784,16 @@ var HelperText = React8.forwardRef(
 HelperText.displayName = "HelperText";
 
 // src/components/Textarea.tsx
-import React9 from "react";
-function cx9(...classes) {
-  return classes.filter(Boolean).join(" ");
-}
-var Textarea = React9.forwardRef(
+import React16 from "react";
+var Textarea = React16.forwardRef(
   ({ error = false, className, disabled, ...rest }, ref) => {
     const base = "w-full px-3 py-2 bg-graphite border border-ash rounded-none text-white placeholder:text-zinc min-h-[80px] transition-all duration-fast focus:border-gold focus:ring-1 focus:ring-gold focus:outline-none disabled:bg-slate disabled:text-dim disabled:cursor-not-allowed";
     const errorCls = error ? "border-error focus:border-error focus:ring-error" : "";
-    return /* @__PURE__ */ React9.createElement(
+    return /* @__PURE__ */ React16.createElement(
       "textarea",
       {
         ref,
-        className: cx9(base, errorCls, disabled && "opacity-90", className),
+        className: cx(base, errorCls, disabled && "opacity-90", className),
         disabled,
         ...rest
       }
@@ -271,18 +803,15 @@ var Textarea = React9.forwardRef(
 Textarea.displayName = "Textarea";
 
 // src/components/Select.tsx
-import React10 from "react";
-function cx10(...classes) {
-  return classes.filter(Boolean).join(" ");
-}
+import React17 from "react";
 var selectBgImage = `url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%23C9A227' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M6 8l4 4 4-4'/%3e%3c/svg%3e")`;
-var Select = React10.forwardRef(
+var Select = React17.forwardRef(
   ({ error = false, className, disabled, options, children, ...rest }, ref) => {
-    return /* @__PURE__ */ React10.createElement(
+    return /* @__PURE__ */ React17.createElement(
       "select",
       {
         ref,
-        className: cx10(
+        className: cx(
           "appearance-none bg-graphite border border-ash rounded-none text-white px-3 py-2 pr-8",
           "focus:border-gold focus:ring-1 focus:ring-gold focus:outline-none",
           "disabled:opacity-50 disabled:cursor-not-allowed",
@@ -298,19 +827,16 @@ var Select = React10.forwardRef(
         disabled,
         ...rest
       },
-      options ? options.map((opt) => /* @__PURE__ */ React10.createElement("option", { key: opt.value, value: opt.value }, opt.label)) : children
+      options ? options.map((opt) => /* @__PURE__ */ React17.createElement("option", { key: opt.value, value: opt.value }, opt.label)) : children
     );
   }
 );
 Select.displayName = "Select";
 
 // src/components/Checkbox.tsx
-import React11, { useCallback } from "react";
-function cx11(...classes) {
-  return classes.filter(Boolean).join(" ");
-}
+import React18, { useCallback } from "react";
 var checkmarkSvg = `url("data:image/svg+xml,%3csvg viewBox='0 0 16 16' fill='%231A1A1A' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M12.207 4.793a1 1 0 010 1.414l-5 5a1 1 0 01-1.414 0l-2-2a1 1 0 011.414-1.414L6.5 9.086l4.293-4.293a1 1 0 011.414 0z'/%3e%3c/svg%3e")`;
-var Checkbox = React11.forwardRef(
+var Checkbox = React18.forwardRef(
   ({ className, label, id, ...rest }, ref) => {
     const inputId = id || rest.name || Math.random().toString(36).substr(2, 9);
     const setRef = useCallback((node) => {
@@ -325,13 +851,13 @@ var Checkbox = React11.forwardRef(
         ref.current = node;
       }
     }, [ref]);
-    return /* @__PURE__ */ React11.createElement("div", { className: "flex items-center" }, /* @__PURE__ */ React11.createElement(
+    return /* @__PURE__ */ React18.createElement("div", { className: "flex items-center" }, /* @__PURE__ */ React18.createElement(
       "input",
       {
         type: "checkbox",
         id: inputId,
         ref: setRef,
-        className: cx11(
+        className: cx(
           "appearance-none h-4 w-4 border border-ash rounded-sm bg-graphite",
           "checked:bg-gold checked:border-gold",
           "focus:ring-1 focus:ring-gold focus:ring-offset-1 focus:ring-offset-obsidian",
@@ -355,18 +881,15 @@ var Checkbox = React11.forwardRef(
         },
         ...rest
       }
-    ), label && /* @__PURE__ */ React11.createElement("label", { htmlFor: inputId, className: "ml-2 text-sm text-silver cursor-pointer select-none" }, label));
+    ), label && /* @__PURE__ */ React18.createElement("label", { htmlFor: inputId, className: "ml-2 text-sm text-silver cursor-pointer select-none" }, label));
   }
 );
 Checkbox.displayName = "Checkbox";
 
 // src/components/Radio.tsx
-import React12, { useCallback as useCallback2 } from "react";
-function cx12(...classes) {
-  return classes.filter(Boolean).join(" ");
-}
+import React19, { useCallback as useCallback2 } from "react";
 var radioDotSvg = `url("data:image/svg+xml,%3csvg viewBox='0 0 16 16' fill='%231A1A1A' xmlns='http://www.w3.org/2000/svg'%3e%3ccircle cx='8' cy='8' r='3'/%3e%3c/svg%3e")`;
-var Radio = React12.forwardRef(
+var Radio = React19.forwardRef(
   ({ className, label, id, ...rest }, ref) => {
     const inputId = id || rest.name || Math.random().toString(36).substr(2, 9);
     const setRef = useCallback2((node) => {
@@ -381,13 +904,13 @@ var Radio = React12.forwardRef(
         ref.current = node;
       }
     }, [ref]);
-    return /* @__PURE__ */ React12.createElement("div", { className: "flex items-center" }, /* @__PURE__ */ React12.createElement(
+    return /* @__PURE__ */ React19.createElement("div", { className: "flex items-center" }, /* @__PURE__ */ React19.createElement(
       "input",
       {
         type: "radio",
         id: inputId,
         ref: setRef,
-        className: cx12(
+        className: cx(
           "appearance-none h-4 w-4 border border-ash rounded-full bg-graphite",
           "checked:bg-gold checked:border-gold",
           "focus:ring-1 focus:ring-gold focus:ring-offset-1 focus:ring-offset-obsidian",
@@ -419,17 +942,14 @@ var Radio = React12.forwardRef(
         },
         ...rest
       }
-    ), label && /* @__PURE__ */ React12.createElement("label", { htmlFor: inputId, className: "ml-2 text-sm text-silver cursor-pointer select-none" }, label));
+    ), label && /* @__PURE__ */ React19.createElement("label", { htmlFor: inputId, className: "ml-2 text-sm text-silver cursor-pointer select-none" }, label));
   }
 );
 Radio.displayName = "Radio";
 
 // src/components/Switch.tsx
-import React13, { useCallback as useCallback3, useRef, useState } from "react";
-function cx13(...classes) {
-  return classes.filter(Boolean).join(" ");
-}
-var Switch = React13.forwardRef(
+import React20, { useCallback as useCallback3, useRef, useState } from "react";
+var Switch = React20.forwardRef(
   ({ checked: controlledChecked, defaultChecked = false, onCheckedChange, disabled, className, label, ...rest }, ref) => {
     const [internalChecked, setInternalChecked] = useState(defaultChecked);
     const isControlled = controlledChecked !== void 0;
@@ -455,196 +975,1661 @@ var Switch = React13.forwardRef(
       onCheckedChange?.(newChecked);
       rest.onClick?.(e);
     };
-    return /* @__PURE__ */ React13.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ React13.createElement(
+    return /* @__PURE__ */ React20.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ React20.createElement(
+      "button",
+      {
+        type: "button",
+        role: "switch",
+        "aria-checked": checked,
+        "data-state": checked ? "checked" : "unchecked",
+        disabled,
+        ref: setRefs,
+        onClick: handleClick,
+        className: cx(
+          "relative inline-flex h-6 w-11 shrink-0 cursor-pointer rounded-full border-2 border-transparent",
+          "transition-colors duration-200 ease-in-out",
+          "focus:outline-none focus-visible:ring-2 focus-visible:ring-gold focus-visible:ring-offset-2 focus-visible:ring-offset-obsidian",
+          "disabled:opacity-50 disabled:cursor-not-allowed",
+          checked ? "bg-gold" : "bg-charcoal",
+          className
+        ),
+        ...rest
+      },
+      /* @__PURE__ */ React20.createElement(
+        "span",
+        {
+          className: cx(
+            "pointer-events-none inline-block h-5 w-5 transform rounded-full bg-white shadow ring-0",
+            "transition duration-200 ease-in-out",
+            checked ? "translate-x-5" : "translate-x-0"
+          )
+        }
+      )
+    ), label && /* @__PURE__ */ React20.createElement(
+      "span",
+      {
+        className: "text-sm text-silver cursor-pointer",
+        onClick: () => {
+          if (disabled) return;
+          buttonRef.current?.click();
+        }
+      },
+      label
+    ));
+  }
+);
+Switch.displayName = "Switch";
+
+// src/components/Slider.tsx
+import React21, { useState as useState2, useRef as useRef2, useCallback as useCallback4 } from "react";
+var SIZE_TRACK = {
+  sm: "h-1",
+  md: "h-2",
+  lg: "h-3"
+};
+var SIZE_THUMB = {
+  sm: "h-3 w-3",
+  md: "h-4 w-4",
+  lg: "h-5 w-5"
+};
+var Slider = React21.forwardRef(
+  ({
+    value: controlledValue,
+    defaultValue = 0,
+    min = 0,
+    max = 100,
+    step = 1,
+    onChange,
+    onChangeEnd,
+    disabled = false,
+    showTooltip = false,
+    formatValue = (v) => String(v),
+    size = "md",
+    className,
+    ...props
+  }, ref) => {
+    const [internalValue, setInternalValue] = useState2(defaultValue);
+    const [isDragging, setIsDragging] = useState2(false);
+    const trackRef = useRef2(null);
+    const isControlled = controlledValue !== void 0;
+    const value = isControlled ? controlledValue : internalValue;
+    const percentage = (value - min) / (max - min) * 100;
+    const updateValue = useCallback4(
+      (clientX) => {
+        if (!trackRef.current || disabled) return;
+        const rect = trackRef.current.getBoundingClientRect();
+        const percent = Math.max(0, Math.min(1, (clientX - rect.left) / rect.width));
+        const rawValue = min + percent * (max - min);
+        const steppedValue = Math.round(rawValue / step) * step;
+        const clampedValue = Math.max(min, Math.min(max, steppedValue));
+        if (!isControlled) {
+          setInternalValue(clampedValue);
+        }
+        onChange?.(clampedValue);
+      },
+      [min, max, step, disabled, isControlled, onChange]
+    );
+    const handleMouseDown = (e) => {
+      if (disabled) return;
+      setIsDragging(true);
+      updateValue(e.clientX);
+      const handleMouseMove = (e2) => {
+        updateValue(e2.clientX);
+      };
+      const handleMouseUp = (e2) => {
+        setIsDragging(false);
+        document.removeEventListener("mousemove", handleMouseMove);
+        document.removeEventListener("mouseup", handleMouseUp);
+        if (trackRef.current) {
+          const rect = trackRef.current.getBoundingClientRect();
+          const percent = Math.max(0, Math.min(1, (e2.clientX - rect.left) / rect.width));
+          const rawValue = min + percent * (max - min);
+          const steppedValue = Math.round(rawValue / step) * step;
+          const clampedValue = Math.max(min, Math.min(max, steppedValue));
+          onChangeEnd?.(clampedValue);
+        }
+      };
+      document.addEventListener("mousemove", handleMouseMove);
+      document.addEventListener("mouseup", handleMouseUp);
+    };
+    const handleKeyDown = (e) => {
+      if (disabled) return;
+      let newValue = value;
+      switch (e.key) {
+        case "ArrowRight":
+        case "ArrowUp":
+          newValue = Math.min(max, value + step);
+          break;
+        case "ArrowLeft":
+        case "ArrowDown":
+          newValue = Math.max(min, value - step);
+          break;
+        case "Home":
+          newValue = min;
+          break;
+        case "End":
+          newValue = max;
+          break;
+        default:
+          return;
+      }
+      e.preventDefault();
+      if (!isControlled) {
+        setInternalValue(newValue);
+      }
+      onChange?.(newValue);
+      onChangeEnd?.(newValue);
+    };
+    return /* @__PURE__ */ React21.createElement(
+      "div",
+      {
+        ref,
+        className: cx("relative w-full py-2", disabled && "opacity-50", className),
+        ...props
+      },
+      /* @__PURE__ */ React21.createElement(
+        "div",
+        {
+          ref: trackRef,
+          className: cx(
+            "relative w-full bg-charcoal border border-ash cursor-pointer",
+            SIZE_TRACK[size]
+          ),
+          onMouseDown: handleMouseDown
+        },
+        /* @__PURE__ */ React21.createElement(
+          "div",
+          {
+            className: cx("absolute inset-y-0 left-0 bg-gold", SIZE_TRACK[size]),
+            style: { width: `${percentage}%` }
+          }
+        ),
+        /* @__PURE__ */ React21.createElement(
+          "div",
+          {
+            role: "slider",
+            tabIndex: disabled ? -1 : 0,
+            "aria-valuemin": min,
+            "aria-valuemax": max,
+            "aria-valuenow": value,
+            "aria-disabled": disabled,
+            onKeyDown: handleKeyDown,
+            className: cx(
+              "absolute top-1/2 -translate-y-1/2 -translate-x-1/2",
+              "bg-gold border-2 border-gold-light rounded-full",
+              "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-gold focus-visible:ring-offset-2 focus-visible:ring-offset-obsidian",
+              "transition-transform duration-fast",
+              isDragging && "scale-110",
+              !disabled && "cursor-grab active:cursor-grabbing",
+              SIZE_THUMB[size]
+            ),
+            style: { left: `${percentage}%` }
+          },
+          showTooltip && isDragging && /* @__PURE__ */ React21.createElement("div", { className: "absolute bottom-full left-1/2 -translate-x-1/2 mb-2 px-2 py-1 bg-graphite border border-ash text-xs text-white whitespace-nowrap" }, formatValue(value))
+        )
+      )
+    );
+  }
+);
+Slider.displayName = "Slider";
+
+// src/components/InputGroup.tsx
+import React22 from "react";
+var InputGroup = React22.forwardRef(
+  ({ className, children, ...props }, ref) => {
+    return /* @__PURE__ */ React22.createElement(
+      "div",
+      {
+        ref,
+        className: cx("flex", className),
+        ...props
+      },
+      children
+    );
+  }
+);
+InputGroup.displayName = "InputGroup";
+var InputLeftAddon = React22.forwardRef(
+  ({ className, children, ...props }, ref) => {
+    return /* @__PURE__ */ React22.createElement(
+      "div",
+      {
+        ref,
+        className: cx(
+          "flex items-center px-3 bg-slate border border-r-0 border-ash",
+          "text-sm text-silver whitespace-nowrap",
+          className
+        ),
+        ...props
+      },
+      children
+    );
+  }
+);
+InputLeftAddon.displayName = "InputLeftAddon";
+var InputRightAddon = React22.forwardRef(
+  ({ className, children, ...props }, ref) => {
+    return /* @__PURE__ */ React22.createElement(
+      "div",
+      {
+        ref,
+        className: cx(
+          "flex items-center px-3 bg-slate border border-l-0 border-ash",
+          "text-sm text-silver whitespace-nowrap",
+          className
+        ),
+        ...props
+      },
+      children
+    );
+  }
+);
+InputRightAddon.displayName = "InputRightAddon";
+var InputLeftElement = React22.forwardRef(
+  ({ className, children, ...props }, ref) => {
+    return /* @__PURE__ */ React22.createElement(
+      "div",
+      {
+        ref,
+        className: cx(
+          "absolute left-0 inset-y-0 flex items-center pl-3",
+          "pointer-events-none text-silver",
+          className
+        ),
+        ...props
+      },
+      children
+    );
+  }
+);
+InputLeftElement.displayName = "InputLeftElement";
+var InputRightElement = React22.forwardRef(
+  ({ className, children, ...props }, ref) => {
+    return /* @__PURE__ */ React22.createElement(
+      "div",
+      {
+        ref,
+        className: cx(
+          "absolute right-0 inset-y-0 flex items-center pr-3",
+          className
+        ),
+        ...props
+      },
+      children
+    );
+  }
+);
+InputRightElement.displayName = "InputRightElement";
+var InputWrapper = React22.forwardRef(
+  ({ className, children, ...props }, ref) => {
+    return /* @__PURE__ */ React22.createElement(
+      "div",
+      {
+        ref,
+        className: cx("relative flex-1", className),
+        ...props
+      },
+      children
+    );
+  }
+);
+InputWrapper.displayName = "InputWrapper";
+
+// src/components/Alert.tsx
+import React23 from "react";
+import { Info, CheckCircle, AlertTriangle, XCircle } from "lucide-react";
+var icons = {
+  info: Info,
+  success: CheckCircle,
+  warning: AlertTriangle,
+  error: XCircle
+};
+var variantStyles = {
+  info: "bg-info/10 border-info text-info",
+  success: "bg-success/10 border-success text-success",
+  warning: "bg-warning/10 border-warning text-warning",
+  error: "bg-error/10 border-error text-error"
+};
+var Alert = React23.forwardRef(
+  ({ variant = "info", title, children, className, ...rest }, ref) => {
+    const Icon = icons[variant];
+    return /* @__PURE__ */ React23.createElement(
+      "div",
+      {
+        ref,
+        role: "alert",
+        className: cx(
+          "relative w-full p-4 rounded-none border border-l-4 flex gap-3",
+          variantStyles[variant],
+          className
+        ),
+        ...rest
+      },
+      /* @__PURE__ */ React23.createElement(Icon, { className: "h-5 w-5 shrink-0" }),
+      /* @__PURE__ */ React23.createElement("div", { className: "flex-1" }, title && /* @__PURE__ */ React23.createElement("h5", { className: "mb-1 font-medium leading-none tracking-tight text-current" }, title), /* @__PURE__ */ React23.createElement("div", { className: "text-sm opacity-90" }, children))
+    );
+  }
+);
+Alert.displayName = "Alert";
+
+// src/components/Spinner.tsx
+import React24 from "react";
+var Spinner = ({ className, size = "md", ...rest }) => {
+  const sizeClass = size === "sm" ? "h-4 w-4" : size === "lg" ? "h-8 w-8" : "h-6 w-6";
+  return /* @__PURE__ */ React24.createElement(
+    "svg",
+    {
+      xmlns: "http://www.w3.org/2000/svg",
+      viewBox: "0 0 24 24",
+      fill: "none",
+      stroke: "currentColor",
+      strokeWidth: "2",
+      strokeLinecap: "round",
+      strokeLinejoin: "round",
+      className: cx("animate-spin text-gold", sizeClass, className),
+      ...rest
+    },
+    /* @__PURE__ */ React24.createElement("path", { d: "M21 12a9 9 0 1 1-6.219-8.56" })
+  );
+};
+Spinner.displayName = "Spinner";
+
+// src/components/Skeleton.tsx
+import React25 from "react";
+var Skeleton = React25.forwardRef(
+  ({ className, ...rest }, ref) => {
+    return /* @__PURE__ */ React25.createElement(
+      "div",
+      {
+        ref,
+        className: cx("animate-pulse bg-ash rounded-sm", className),
+        ...rest
+      }
+    );
+  }
+);
+Skeleton.displayName = "Skeleton";
+
+// src/components/Progress.tsx
+import React26 from "react";
+var SIZE_MAP = {
+  sm: "h-1",
+  md: "h-2",
+  lg: "h-3"
+};
+var VARIANT_MAP2 = {
+  default: "bg-gold",
+  success: "bg-success",
+  warning: "bg-warning",
+  error: "bg-error"
+};
+var Progress = React26.forwardRef(
+  ({
+    value = 0,
+    max = 100,
+    size = "md",
+    variant = "default",
+    showValue = false,
+    formatValue,
+    indeterminate = false,
+    className,
+    ...props
+  }, ref) => {
+    const percentage = Math.min(100, Math.max(0, value / max * 100));
+    const displayValue = formatValue ? formatValue(value, max) : `${Math.round(percentage)}%`;
+    return /* @__PURE__ */ React26.createElement("div", { ref, className: cx("w-full", className), ...props }, showValue && /* @__PURE__ */ React26.createElement("div", { className: "flex justify-between mb-1" }, /* @__PURE__ */ React26.createElement("span", { className: "text-sm text-silver" }, "Progress"), /* @__PURE__ */ React26.createElement("span", { className: "text-sm text-white font-medium" }, displayValue)), /* @__PURE__ */ React26.createElement(
+      "div",
+      {
+        className: cx(
+          "w-full bg-charcoal border border-ash overflow-hidden rounded-none",
+          SIZE_MAP[size]
+        ),
+        role: "progressbar",
+        "aria-valuenow": indeterminate ? void 0 : value,
+        "aria-valuemin": 0,
+        "aria-valuemax": max
+      },
+      /* @__PURE__ */ React26.createElement(
+        "div",
+        {
+          className: cx(
+            "h-full transition-all duration-300 ease-out",
+            VARIANT_MAP2[variant],
+            indeterminate && "animate-pulse"
+          ),
+          style: {
+            width: indeterminate ? "100%" : `${percentage}%`
+          }
+        }
+      )
+    ));
+  }
+);
+Progress.displayName = "Progress";
+
+// src/components/Toast.tsx
+import React27, { createContext, useContext, useState as useState3, useCallback as useCallback5, useEffect } from "react";
+import { createPortal } from "react-dom";
+import { X, CheckCircle as CheckCircle2, AlertCircle, AlertTriangle as AlertTriangle2, Info as Info2 } from "lucide-react";
+var ToastContext = createContext(null);
+function useToast() {
+  const context = useContext(ToastContext);
+  if (!context) {
+    throw new Error("useToast must be used within a ToastProvider");
+  }
+  const toast = useCallback5(
+    (options) => {
+      return context.addToast(options);
+    },
+    [context]
+  );
+  return {
+    toast,
+    dismiss: context.removeToast
+  };
+}
+var ToastProvider = ({
+  children,
+  position = "bottom-right",
+  defaultDuration = 5e3
+}) => {
+  const [toasts, setToasts] = useState3([]);
+  const [mounted, setMounted] = useState3(false);
+  useEffect(() => {
+    setMounted(true);
+  }, []);
+  const addToast = useCallback5(
+    (toast) => {
+      const id = Math.random().toString(36).substr(2, 9);
+      const newToast = {
+        ...toast,
+        id,
+        duration: toast.duration ?? defaultDuration
+      };
+      setToasts((prev) => [...prev, newToast]);
+      return id;
+    },
+    [defaultDuration]
+  );
+  const removeToast = useCallback5((id) => {
+    setToasts((prev) => prev.filter((t) => t.id !== id));
+  }, []);
+  return /* @__PURE__ */ React27.createElement(ToastContext.Provider, { value: { toasts, addToast, removeToast, position } }, children, mounted && /* @__PURE__ */ React27.createElement(ToastViewport, null));
+};
+ToastProvider.displayName = "ToastProvider";
+var ToastViewport = () => {
+  const context = useContext(ToastContext);
+  if (!context) return null;
+  const { toasts, position } = context;
+  const positionClasses = {
+    "top-right": "top-4 right-4",
+    "top-left": "top-4 left-4",
+    "bottom-right": "bottom-4 right-4",
+    "bottom-left": "bottom-4 left-4",
+    "top-center": "top-4 left-1/2 -translate-x-1/2",
+    "bottom-center": "bottom-4 left-1/2 -translate-x-1/2"
+  };
+  return createPortal(
+    /* @__PURE__ */ React27.createElement(
+      "div",
+      {
+        className: cx(
+          "fixed z-50 flex flex-col gap-2 pointer-events-none",
+          positionClasses[position]
+        )
+      },
+      toasts.map((toast) => /* @__PURE__ */ React27.createElement(Toast, { key: toast.id, ...toast }))
+    ),
+    document.body
+  );
+};
+var VARIANT_STYLES2 = {
+  default: "bg-charcoal border-ash",
+  success: "bg-charcoal border-success/50",
+  error: "bg-charcoal border-error/50",
+  warning: "bg-charcoal border-warning/50",
+  info: "bg-charcoal border-info/50"
+};
+var VARIANT_ICONS = {
+  default: null,
+  success: /* @__PURE__ */ React27.createElement(CheckCircle2, { className: "h-5 w-5 text-success" }),
+  error: /* @__PURE__ */ React27.createElement(AlertCircle, { className: "h-5 w-5 text-error" }),
+  warning: /* @__PURE__ */ React27.createElement(AlertTriangle2, { className: "h-5 w-5 text-warning" }),
+  info: /* @__PURE__ */ React27.createElement(Info2, { className: "h-5 w-5 text-info" })
+};
+var Toast = ({
+  id,
+  title,
+  description,
+  variant = "default",
+  duration,
+  action
+}) => {
+  const context = useContext(ToastContext);
+  useEffect(() => {
+    if (duration && duration > 0) {
+      const timer = setTimeout(() => {
+        context?.removeToast(id);
+      }, duration);
+      return () => clearTimeout(timer);
+    }
+  }, [id, duration, context]);
+  const icon = VARIANT_ICONS[variant];
+  return /* @__PURE__ */ React27.createElement(
+    "div",
+    {
+      role: "alert",
+      className: cx(
+        "pointer-events-auto w-80 p-4 border shadow-lg animate-slide-in-right",
+        VARIANT_STYLES2[variant]
+      )
+    },
+    /* @__PURE__ */ React27.createElement("div", { className: "flex gap-3" }, icon && /* @__PURE__ */ React27.createElement("div", { className: "shrink-0 mt-0.5" }, icon), /* @__PURE__ */ React27.createElement("div", { className: "flex-1 min-w-0" }, title && /* @__PURE__ */ React27.createElement("p", { className: "text-sm font-medium text-white" }, title), description && /* @__PURE__ */ React27.createElement("p", { className: "text-sm text-silver mt-1" }, description), action && /* @__PURE__ */ React27.createElement("div", { className: "mt-3" }, action)), /* @__PURE__ */ React27.createElement(
+      "button",
+      {
+        onClick: () => context?.removeToast(id),
+        className: "shrink-0 text-silver hover:text-white transition-colors"
+      },
+      /* @__PURE__ */ React27.createElement(X, { className: "h-4 w-4" }),
+      /* @__PURE__ */ React27.createElement("span", { className: "sr-only" }, "Dismiss")
+    ))
+  );
+};
+Toast.displayName = "Toast";
+
+// src/components/Modal.tsx
+import React28, { useEffect as useEffect2, useState as useState4 } from "react";
+import { createPortal as createPortal2 } from "react-dom";
+import { X as X2 } from "lucide-react";
+var Modal = ({ isOpen, onClose, title, children, className }) => {
+  const [mounted, setMounted] = useState4(false);
+  useEffect2(() => {
+    setMounted(true);
+  }, []);
+  useEffect2(() => {
+    if (isOpen) {
+      const scrollbarWidth = window.innerWidth - document.documentElement.clientWidth;
+      document.body.style.overflow = "hidden";
+      document.body.style.paddingRight = `${scrollbarWidth}px`;
+    } else {
+      document.body.style.overflow = "unset";
+      document.body.style.paddingRight = "0px";
+    }
+    return () => {
+      document.body.style.overflow = "unset";
+      document.body.style.paddingRight = "0px";
+    };
+  }, [isOpen]);
+  useEffect2(() => {
+    const handleEsc = (e) => {
+      if (e.key === "Escape") onClose();
+    };
+    window.addEventListener("keydown", handleEsc);
+    return () => window.removeEventListener("keydown", handleEsc);
+  }, [onClose]);
+  if (!mounted) return null;
+  if (!isOpen) return null;
+  const content = /* @__PURE__ */ React28.createElement("div", { className: "fixed inset-0 z-50 flex items-center justify-center p-4 sm:p-6", onClick: onClose }, /* @__PURE__ */ React28.createElement("div", { className: "fixed inset-0 z-40 bg-obsidian/80 backdrop-blur-sm", "aria-hidden": "true" }), /* @__PURE__ */ React28.createElement(
+    "div",
+    {
+      role: "dialog",
+      "aria-modal": "true",
+      className: cx(
+        "bg-charcoal border border-gold/30 shadow-2xl z-50 w-full max-w-lg p-6 rounded-none relative",
+        className
+      ),
+      "data-state": "open",
+      onClick: (e) => e.stopPropagation()
+    },
+    /* @__PURE__ */ React28.createElement("div", { className: "flex items-center justify-between mb-2" }, title ? /* @__PURE__ */ React28.createElement("h3", { className: "text-xl font-semibold text-white m-0" }, title) : /* @__PURE__ */ React28.createElement("div", null), /* @__PURE__ */ React28.createElement("button", { onClick: onClose, className: "text-silver hover:text-white transition-colors ml-auto" }, /* @__PURE__ */ React28.createElement(X2, { className: "h-5 w-5" }), /* @__PURE__ */ React28.createElement("span", { className: "sr-only" }, "Close"))),
+    /* @__PURE__ */ React28.createElement("div", null, children)
+  ));
+  return createPortal2(content, document.body);
+};
+Modal.displayName = "Modal";
+
+// src/components/Drawer.tsx
+import React29, { useEffect as useEffect3, useState as useState5 } from "react";
+import { createPortal as createPortal3 } from "react-dom";
+import { X as X3 } from "lucide-react";
+var SIZE_MAP2 = {
+  sm: {
+    left: "w-64",
+    right: "w-64",
+    top: "h-48",
+    bottom: "h-48"
+  },
+  md: {
+    left: "w-80",
+    right: "w-80",
+    top: "h-64",
+    bottom: "h-64"
+  },
+  lg: {
+    left: "w-96",
+    right: "w-96",
+    top: "h-80",
+    bottom: "h-80"
+  },
+  xl: {
+    left: "w-[32rem]",
+    right: "w-[32rem]",
+    top: "h-96",
+    bottom: "h-96"
+  },
+  full: {
+    left: "w-full",
+    right: "w-full",
+    top: "h-full",
+    bottom: "h-full"
+  }
+};
+var POSITION_CLASSES = {
+  left: "left-0 top-0 h-full",
+  right: "right-0 top-0 h-full",
+  top: "top-0 left-0 w-full",
+  bottom: "bottom-0 left-0 w-full"
+};
+var TRANSFORM_CLASSES = {
+  left: { open: "translate-x-0", closed: "-translate-x-full" },
+  right: { open: "translate-x-0", closed: "translate-x-full" },
+  top: { open: "translate-y-0", closed: "-translate-y-full" },
+  bottom: { open: "translate-y-0", closed: "translate-y-full" }
+};
+var Drawer = ({
+  isOpen,
+  onClose,
+  position = "right",
+  title,
+  size = "md",
+  children,
+  className
+}) => {
+  const [mounted, setMounted] = useState5(false);
+  useEffect3(() => {
+    setMounted(true);
+  }, []);
+  useEffect3(() => {
+    if (isOpen) {
+      const scrollbarWidth = window.innerWidth - document.documentElement.clientWidth;
+      document.body.style.overflow = "hidden";
+      document.body.style.paddingRight = `${scrollbarWidth}px`;
+    } else {
+      document.body.style.overflow = "unset";
+      document.body.style.paddingRight = "0px";
+    }
+    return () => {
+      document.body.style.overflow = "unset";
+      document.body.style.paddingRight = "0px";
+    };
+  }, [isOpen]);
+  useEffect3(() => {
+    const handleEsc = (e) => {
+      if (e.key === "Escape") onClose();
+    };
+    window.addEventListener("keydown", handleEsc);
+    return () => window.removeEventListener("keydown", handleEsc);
+  }, [onClose]);
+  if (!mounted) return null;
+  const content = /* @__PURE__ */ React29.createElement(
+    "div",
+    {
+      className: cx(
+        "fixed inset-0 z-50",
+        isOpen ? "pointer-events-auto" : "pointer-events-none"
+      )
+    },
+    /* @__PURE__ */ React29.createElement(
+      "div",
+      {
+        className: cx(
+          "fixed inset-0 bg-obsidian/80 backdrop-blur-sm transition-opacity duration-300",
+          isOpen ? "opacity-100" : "opacity-0"
+        ),
+        onClick: onClose,
+        "aria-hidden": "true"
+      }
+    ),
+    /* @__PURE__ */ React29.createElement(
+      "div",
+      {
+        role: "dialog",
+        "aria-modal": "true",
+        className: cx(
+          "fixed bg-charcoal border-ash shadow-2xl flex flex-col",
+          "transition-transform duration-300 ease-out",
+          POSITION_CLASSES[position],
+          SIZE_MAP2[size][position],
+          position === "left" && "border-r",
+          position === "right" && "border-l",
+          position === "top" && "border-b",
+          position === "bottom" && "border-t",
+          isOpen ? TRANSFORM_CLASSES[position].open : TRANSFORM_CLASSES[position].closed,
+          className
+        )
+      },
+      /* @__PURE__ */ React29.createElement("div", { className: "flex items-center justify-between px-4 py-3 border-b border-ash" }, title ? /* @__PURE__ */ React29.createElement("h2", { className: "text-lg font-semibold text-white m-0" }, title) : /* @__PURE__ */ React29.createElement("div", null), /* @__PURE__ */ React29.createElement(
+        "button",
+        {
+          onClick: onClose,
+          className: "text-silver hover:text-white transition-colors"
+        },
+        /* @__PURE__ */ React29.createElement(X3, { className: "h-5 w-5" }),
+        /* @__PURE__ */ React29.createElement("span", { className: "sr-only" }, "Close")
+      )),
+      /* @__PURE__ */ React29.createElement("div", { className: "flex-1 overflow-auto p-4" }, children)
+    )
+  );
+  return createPortal3(content, document.body);
+};
+Drawer.displayName = "Drawer";
+
+// src/components/Popover.tsx
+import React30, { useState as useState6, useRef as useRef3, useEffect as useEffect4, useCallback as useCallback6, useId } from "react";
+var POSITION_CLASSES2 = {
+  top: {
+    start: "bottom-full left-0 mb-2",
+    center: "bottom-full left-1/2 -translate-x-1/2 mb-2",
+    end: "bottom-full right-0 mb-2"
+  },
+  bottom: {
+    start: "top-full left-0 mt-2",
+    center: "top-full left-1/2 -translate-x-1/2 mt-2",
+    end: "top-full right-0 mt-2"
+  },
+  left: {
+    start: "right-full top-0 mr-2",
+    center: "right-full top-1/2 -translate-y-1/2 mr-2",
+    end: "right-full bottom-0 mr-2"
+  },
+  right: {
+    start: "left-full top-0 ml-2",
+    center: "left-full top-1/2 -translate-y-1/2 ml-2",
+    end: "left-full bottom-0 ml-2"
+  }
+};
+var Popover = ({
+  children,
+  trigger,
+  position = "bottom",
+  align = "center",
+  open: controlledOpen,
+  onOpenChange,
+  closeOnClickOutside = true
+}) => {
+  const [internalOpen, setInternalOpen] = useState6(false);
+  const isControlled = controlledOpen !== void 0;
+  const isOpen = isControlled ? controlledOpen : internalOpen;
+  const containerRef = useRef3(null);
+  const baseId = useId();
+  const setIsOpen = useCallback6(
+    (newOpen) => {
+      if (!isControlled) {
+        setInternalOpen(newOpen);
+      }
+      onOpenChange?.(newOpen);
+    },
+    [isControlled, onOpenChange]
+  );
+  useEffect4(() => {
+    if (!isOpen || !closeOnClickOutside) return;
+    const handleClickOutside = (e) => {
+      if (containerRef.current && !containerRef.current.contains(e.target)) {
+        setIsOpen(false);
+      }
+    };
+    document.addEventListener("mousedown", handleClickOutside);
+    return () => document.removeEventListener("mousedown", handleClickOutside);
+  }, [isOpen, closeOnClickOutside, setIsOpen]);
+  useEffect4(() => {
+    if (!isOpen) return;
+    const handleEscape = (e) => {
+      if (e.key === "Escape") {
+        setIsOpen(false);
+      }
+    };
+    document.addEventListener("keydown", handleEscape);
+    return () => document.removeEventListener("keydown", handleEscape);
+  }, [isOpen, setIsOpen]);
+  const handleTriggerClick = () => {
+    setIsOpen(!isOpen);
+  };
+  const triggerElement = React30.cloneElement(trigger, {
+    onClick: handleTriggerClick,
+    "aria-haspopup": "dialog",
+    "aria-expanded": isOpen,
+    "aria-controls": `${baseId}-popover`,
+    id: `${baseId}-trigger`
+  });
+  return /* @__PURE__ */ React30.createElement("div", { ref: containerRef, className: "relative inline-block" }, triggerElement, isOpen && /* @__PURE__ */ React30.createElement(
+    "div",
+    {
+      id: `${baseId}-popover`,
+      role: "dialog",
+      "aria-labelledby": `${baseId}-trigger`,
+      className: cx(
+        "absolute z-50 min-w-48 p-4",
+        "bg-charcoal border border-ash shadow-lg",
+        "animate-fade-in",
+        POSITION_CLASSES2[position][align]
+      )
+    },
+    children
+  ));
+};
+Popover.displayName = "Popover";
+
+// src/components/Dialog.tsx
+import React31, { useCallback as useCallback7 } from "react";
+var ConfirmDialog = ({
+  title = "Confirm",
+  description,
+  confirmText = "Confirm",
+  cancelText = "Cancel",
+  onConfirm,
+  onCancel,
+  onClose,
+  confirmVariant = "important",
+  isLoading = false,
+  ...props
+}) => {
+  const handleCancel = useCallback7(() => {
+    onCancel?.();
+    onClose();
+  }, [onCancel, onClose]);
+  const handleConfirm = useCallback7(async () => {
+    await onConfirm();
+    onClose();
+  }, [onConfirm, onClose]);
+  return /* @__PURE__ */ React31.createElement(Modal, { title, onClose, ...props }, description && /* @__PURE__ */ React31.createElement("p", { className: "text-sm text-silver mb-6" }, description), /* @__PURE__ */ React31.createElement("div", { className: "flex justify-end gap-3" }, /* @__PURE__ */ React31.createElement(Button, { variant: "outlined", onClick: handleCancel, disabled: isLoading }, cancelText), /* @__PURE__ */ React31.createElement(
+    Button,
+    {
+      variant: confirmVariant,
+      onClick: handleConfirm,
+      loading: isLoading
+    },
+    confirmText
+  )));
+};
+ConfirmDialog.displayName = "ConfirmDialog";
+var AlertDialog = ({
+  title = "Alert",
+  description,
+  acknowledgeText = "OK",
+  variant = "default",
+  onClose,
+  ...props
+}) => {
+  const titleClass = cx(
+    variant === "warning" && "text-warning",
+    variant === "error" && "text-error"
+  );
+  return /* @__PURE__ */ React31.createElement(Modal, { onClose, ...props }, /* @__PURE__ */ React31.createElement("h3", { className: cx("text-xl font-semibold mb-2", titleClass) }, title), description && /* @__PURE__ */ React31.createElement("p", { className: "text-sm text-silver mb-6" }, description), /* @__PURE__ */ React31.createElement("div", { className: "flex justify-end" }, /* @__PURE__ */ React31.createElement(Button, { variant: "primary", onClick: onClose }, acknowledgeText)));
+};
+AlertDialog.displayName = "AlertDialog";
+var PromptDialog = ({
+  title = "Enter Value",
+  description,
+  placeholder,
+  defaultValue = "",
+  submitText = "Submit",
+  cancelText = "Cancel",
+  onSubmit,
+  onCancel,
+  onClose,
+  isLoading = false,
+  ...props
+}) => {
+  const [value, setValue] = React31.useState(defaultValue);
+  const handleCancel = useCallback7(() => {
+    onCancel?.();
+    onClose();
+  }, [onCancel, onClose]);
+  const handleSubmit = useCallback7(
+    async (e) => {
+      e.preventDefault();
+      await onSubmit(value);
+      onClose();
+    },
+    [onSubmit, value, onClose]
+  );
+  return /* @__PURE__ */ React31.createElement(Modal, { title, onClose, ...props }, /* @__PURE__ */ React31.createElement("form", { onSubmit: handleSubmit }, description && /* @__PURE__ */ React31.createElement("p", { className: "text-sm text-silver mb-4" }, description), /* @__PURE__ */ React31.createElement(
+    "input",
+    {
+      type: "text",
+      value,
+      onChange: (e) => setValue(e.target.value),
+      placeholder,
+      className: cx(
+        "w-full px-3 py-2 bg-graphite border border-ash",
+        "text-white placeholder:text-zinc",
+        "focus:border-gold focus:ring-1 focus:ring-gold focus:outline-none",
+        "mb-6"
+      ),
+      autoFocus: true
+    }
+  ), /* @__PURE__ */ React31.createElement("div", { className: "flex justify-end gap-3" }, /* @__PURE__ */ React31.createElement(
+    Button,
+    {
+      type: "button",
+      variant: "outlined",
+      onClick: handleCancel,
+      disabled: isLoading
+    },
+    cancelText
+  ), /* @__PURE__ */ React31.createElement(Button, { type: "submit", variant: "important", loading: isLoading }, submitText))));
+};
+PromptDialog.displayName = "PromptDialog";
+
+// src/components/Tabs.tsx
+import React32, { createContext as createContext2, useContext as useContext2, useState as useState7, useCallback as useCallback8, useId as useId2 } from "react";
+var TabsContext = createContext2(null);
+function useTabsContext() {
+  const context = useContext2(TabsContext);
+  if (!context) {
+    throw new Error("Tabs components must be used within a Tabs provider");
+  }
+  return context;
+}
+var Tabs = React32.forwardRef(
+  ({ defaultValue, value, onValueChange, children, className, ...props }, ref) => {
+    const [internalValue, setInternalValue] = useState7(defaultValue ?? "");
+    const isControlled = value !== void 0;
+    const activeTab = isControlled ? value : internalValue;
+    const baseId = useId2();
+    const setActiveTab = useCallback8(
+      (id) => {
+        if (!isControlled) {
+          setInternalValue(id);
+        }
+        onValueChange?.(id);
+      },
+      [isControlled, onValueChange]
+    );
+    return /* @__PURE__ */ React32.createElement(TabsContext.Provider, { value: { activeTab, setActiveTab, baseId } }, /* @__PURE__ */ React32.createElement("div", { ref, className: cx("w-full", className), ...props }, children));
+  }
+);
+Tabs.displayName = "Tabs";
+var TabList = React32.forwardRef(
+  ({ children, className, ...props }, ref) => {
+    return /* @__PURE__ */ React32.createElement(
+      "div",
+      {
+        ref,
+        role: "tablist",
+        className: cx(
+          "flex border-b border-ash",
+          className
+        ),
+        ...props
+      },
+      children
+    );
+  }
+);
+TabList.displayName = "TabList";
+var Tab = React32.forwardRef(
+  ({ value, children, className, disabled, ...props }, ref) => {
+    const { activeTab, setActiveTab, baseId } = useTabsContext();
+    const isActive = activeTab === value;
+    const panelId = `${baseId}-panel-${value}`;
+    const tabId = `${baseId}-tab-${value}`;
+    return /* @__PURE__ */ React32.createElement(
+      "button",
+      {
+        ref,
+        id: tabId,
+        type: "button",
+        role: "tab",
+        "aria-selected": isActive,
+        "aria-controls": panelId,
+        tabIndex: isActive ? 0 : -1,
+        disabled,
+        onClick: () => setActiveTab(value),
+        className: cx(
+          "px-4 py-2 text-sm font-medium transition-all duration-fast",
+          "border-b-2 -mb-px",
+          "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-gold focus-visible:ring-inset",
+          isActive ? "border-gold text-gold" : "border-transparent text-silver hover:text-white hover:border-ash",
+          disabled && "opacity-50 cursor-not-allowed",
+          className
+        ),
+        ...props
+      },
+      children
+    );
+  }
+);
+Tab.displayName = "Tab";
+var TabPanel = React32.forwardRef(
+  ({ value, forceMount = false, children, className, ...props }, ref) => {
+    const { activeTab, baseId } = useTabsContext();
+    const isActive = activeTab === value;
+    const panelId = `${baseId}-panel-${value}`;
+    const tabId = `${baseId}-tab-${value}`;
+    if (!isActive && !forceMount) {
+      return null;
+    }
+    return /* @__PURE__ */ React32.createElement(
+      "div",
+      {
+        ref,
+        id: panelId,
+        role: "tabpanel",
+        "aria-labelledby": tabId,
+        tabIndex: 0,
+        hidden: !isActive,
+        className: cx(
+          "pt-4 focus-visible:outline-none",
+          !isActive && "hidden",
+          className
+        ),
+        ...props
+      },
+      children
+    );
+  }
+);
+TabPanel.displayName = "TabPanel";
+
+// src/components/Accordion.tsx
+import React33, { createContext as createContext3, useContext as useContext3, useState as useState8, useCallback as useCallback9, useId as useId3 } from "react";
+import { ChevronDown } from "lucide-react";
+var AccordionContext = createContext3(null);
+function useAccordionContext() {
+  const context = useContext3(AccordionContext);
+  if (!context) {
+    throw new Error("Accordion components must be used within an Accordion provider");
+  }
+  return context;
+}
+var Accordion = React33.forwardRef(
+  ({ type = "single", defaultValue, value, onValueChange, children, className, ...props }, ref) => {
+    const [internalValue, setInternalValue] = useState8(() => {
+      if (defaultValue) {
+        return new Set(Array.isArray(defaultValue) ? defaultValue : [defaultValue]);
+      }
+      return /* @__PURE__ */ new Set();
+    });
+    const isControlled = value !== void 0;
+    const expandedItems = isControlled ? new Set(Array.isArray(value) ? value : [value]) : internalValue;
+    const toggleItem = useCallback9(
+      (id) => {
+        const newSet = new Set(expandedItems);
+        if (newSet.has(id)) {
+          newSet.delete(id);
+        } else {
+          if (type === "single") {
+            newSet.clear();
+          }
+          newSet.add(id);
+        }
+        if (!isControlled) {
+          setInternalValue(newSet);
+        }
+        const newValue = Array.from(newSet);
+        onValueChange?.(type === "single" ? newValue[0] ?? "" : newValue);
+      },
+      [expandedItems, type, isControlled, onValueChange]
+    );
+    return /* @__PURE__ */ React33.createElement(AccordionContext.Provider, { value: { expandedItems, toggleItem, type } }, /* @__PURE__ */ React33.createElement(
+      "div",
+      {
+        ref,
+        className: cx("divide-y divide-ash border border-ash", className),
+        ...props
+      },
+      children
+    ));
+  }
+);
+Accordion.displayName = "Accordion";
+var AccordionItemContext = createContext3(null);
+var AccordionItem = React33.forwardRef(
+  ({ value, disabled = false, children, className, ...props }, ref) => {
+    return /* @__PURE__ */ React33.createElement(AccordionItemContext.Provider, { value: { value, disabled } }, /* @__PURE__ */ React33.createElement(
+      "div",
+      {
+        ref,
+        "data-state": useAccordionContext().expandedItems.has(value) ? "open" : "closed",
+        className: cx("bg-charcoal", className),
+        ...props
+      },
+      children
+    ));
+  }
+);
+AccordionItem.displayName = "AccordionItem";
+var AccordionTrigger = React33.forwardRef(
+  ({ children, className, ...props }, ref) => {
+    const { expandedItems, toggleItem } = useAccordionContext();
+    const itemContext = useContext3(AccordionItemContext);
+    const baseId = useId3();
+    if (!itemContext) {
+      throw new Error("AccordionTrigger must be used within an AccordionItem");
+    }
+    const { value, disabled } = itemContext;
+    const isExpanded = expandedItems.has(value);
+    return /* @__PURE__ */ React33.createElement("h3", { className: "m-0" }, /* @__PURE__ */ React33.createElement(
+      "button",
+      {
+        ref,
+        type: "button",
+        id: `${baseId}-trigger-${value}`,
+        "aria-expanded": isExpanded,
+        "aria-controls": `${baseId}-content-${value}`,
+        disabled,
+        onClick: () => toggleItem(value),
+        className: cx(
+          "flex w-full items-center justify-between px-4 py-3",
+          "text-left text-sm font-medium text-white",
+          "transition-colors duration-fast",
+          "hover:bg-graphite",
+          "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-gold focus-visible:ring-inset",
+          disabled && "opacity-50 cursor-not-allowed",
+          className
+        ),
+        ...props
+      },
+      /* @__PURE__ */ React33.createElement("span", null, children),
+      /* @__PURE__ */ React33.createElement(
+        ChevronDown,
+        {
+          className: cx(
+            "h-4 w-4 text-silver transition-transform duration-200",
+            isExpanded && "rotate-180"
+          )
+        }
+      )
+    ));
+  }
+);
+AccordionTrigger.displayName = "AccordionTrigger";
+var AccordionContent = React33.forwardRef(
+  ({ children, className, ...props }, ref) => {
+    const { expandedItems } = useAccordionContext();
+    const itemContext = useContext3(AccordionItemContext);
+    const baseId = useId3();
+    if (!itemContext) {
+      throw new Error("AccordionContent must be used within an AccordionItem");
+    }
+    const { value } = itemContext;
+    const isExpanded = expandedItems.has(value);
+    return /* @__PURE__ */ React33.createElement(
+      "div",
+      {
+        ref,
+        id: `${baseId}-content-${value}`,
+        role: "region",
+        "aria-labelledby": `${baseId}-trigger-${value}`,
+        hidden: !isExpanded,
+        className: cx(
+          "overflow-hidden transition-all duration-200",
+          isExpanded ? "animate-fade-in" : "hidden",
+          className
+        ),
+        ...props
+      },
+      /* @__PURE__ */ React33.createElement("div", { className: "px-4 pb-4 text-sm text-silver" }, children)
+    );
+  }
+);
+AccordionContent.displayName = "AccordionContent";
+
+// src/components/Menu.tsx
+import React34, {
+  createContext as createContext4,
+  useContext as useContext4,
+  useState as useState9,
+  useCallback as useCallback10,
+  useRef as useRef4,
+  useEffect as useEffect5,
+  useId as useId4
+} from "react";
+var MenuContext = createContext4(null);
+function useMenuContext() {
+  const context = useContext4(MenuContext);
+  if (!context) {
+    throw new Error("Menu components must be used within a Menu provider");
+  }
+  return context;
+}
+var Menu = ({ children, open, onOpenChange }) => {
+  const [internalOpen, setInternalOpen] = useState9(false);
+  const isControlled = open !== void 0;
+  const isOpen = isControlled ? open : internalOpen;
+  const baseId = useId4();
+  const setIsOpen = useCallback10(
+    (newOpen) => {
+      if (!isControlled) {
+        setInternalOpen(newOpen);
+      }
+      onOpenChange?.(newOpen);
+    },
+    [isControlled, onOpenChange]
+  );
+  return /* @__PURE__ */ React34.createElement(
+    MenuContext.Provider,
+    {
+      value: {
+        isOpen,
+        setIsOpen,
+        triggerId: `${baseId}-trigger`,
+        menuId: `${baseId}-menu`
+      }
+    },
+    /* @__PURE__ */ React34.createElement("div", { className: "relative inline-block" }, children)
+  );
+};
+Menu.displayName = "Menu";
+var MenuTrigger = React34.forwardRef(
+  ({ children, className, asChild, ...props }, ref) => {
+    const { isOpen, setIsOpen, triggerId, menuId } = useMenuContext();
+    const handleClick = (e) => {
+      e.preventDefault();
+      setIsOpen(!isOpen);
+      props.onClick?.(e);
+    };
+    return /* @__PURE__ */ React34.createElement(
+      "button",
+      {
+        ref,
+        id: triggerId,
+        type: "button",
+        "aria-haspopup": "menu",
+        "aria-expanded": isOpen,
+        "aria-controls": menuId,
+        onClick: handleClick,
+        className: cx(
+          "inline-flex items-center justify-center",
+          className
+        ),
+        ...props
+      },
+      children
+    );
+  }
+);
+MenuTrigger.displayName = "MenuTrigger";
+var MenuContent = React34.forwardRef(
+  ({ children, className, align = "start", side = "bottom", ...props }, ref) => {
+    const { isOpen, setIsOpen, triggerId, menuId } = useMenuContext();
+    const menuRef = useRef4(null);
+    useEffect5(() => {
+      if (!isOpen) return;
+      const handleClickOutside = (e) => {
+        const trigger = document.getElementById(triggerId);
+        if (menuRef.current && !menuRef.current.contains(e.target) && trigger && !trigger.contains(e.target)) {
+          setIsOpen(false);
+        }
+      };
+      const handleEscape = (e) => {
+        if (e.key === "Escape") {
+          setIsOpen(false);
+        }
+      };
+      document.addEventListener("mousedown", handleClickOutside);
+      document.addEventListener("keydown", handleEscape);
+      return () => {
+        document.removeEventListener("mousedown", handleClickOutside);
+        document.removeEventListener("keydown", handleEscape);
+      };
+    }, [isOpen, setIsOpen, triggerId]);
+    if (!isOpen) return null;
+    const alignmentClasses = {
+      start: "left-0",
+      center: "left-1/2 -translate-x-1/2",
+      end: "right-0"
+    };
+    const sideClasses = {
+      top: "bottom-full mb-1",
+      bottom: "top-full mt-1"
+    };
+    return /* @__PURE__ */ React34.createElement(
+      "div",
+      {
+        ref: (node) => {
+          menuRef.current = node;
+          if (typeof ref === "function") ref(node);
+          else if (ref) ref.current = node;
+        },
+        id: menuId,
+        role: "menu",
+        "aria-labelledby": triggerId,
+        className: cx(
+          "absolute z-50 min-w-40 py-1",
+          "bg-charcoal border border-ash shadow-lg",
+          "animate-fade-in",
+          alignmentClasses[align],
+          sideClasses[side],
+          className
+        ),
+        ...props
+      },
+      children
+    );
+  }
+);
+MenuContent.displayName = "MenuContent";
+var MenuItem = React34.forwardRef(
+  ({ children, className, icon, destructive, disabled, onClick, ...props }, ref) => {
+    const { setIsOpen } = useMenuContext();
+    const handleClick = (e) => {
+      if (disabled) return;
+      onClick?.(e);
+      setIsOpen(false);
+    };
+    return /* @__PURE__ */ React34.createElement(
       "button",
       {
+        ref,
         type: "button",
-        role: "switch",
-        "aria-checked": checked,
-        "data-state": checked ? "checked" : "unchecked",
+        role: "menuitem",
         disabled,
-        ref: setRefs,
         onClick: handleClick,
-        className: cx13(
-          "relative inline-flex h-6 w-11 shrink-0 cursor-pointer rounded-full border-2 border-transparent",
-          "transition-colors duration-200 ease-in-out",
-          "focus:outline-none focus-visible:ring-2 focus-visible:ring-gold focus-visible:ring-offset-2 focus-visible:ring-offset-obsidian",
-          "disabled:opacity-50 disabled:cursor-not-allowed",
-          checked ? "bg-gold" : "bg-charcoal",
+        className: cx(
+          "flex w-full items-center gap-2 px-3 py-2 text-sm text-left",
+          "transition-colors duration-fast",
+          destructive ? "text-error hover:bg-error/10" : "text-white hover:bg-graphite",
+          "focus-visible:outline-none focus-visible:bg-graphite",
+          disabled && "opacity-50 cursor-not-allowed",
           className
         ),
-        ...rest
+        ...props
       },
-      /* @__PURE__ */ React13.createElement(
-        "span",
-        {
-          className: cx13(
-            "pointer-events-none inline-block h-5 w-5 transform rounded-full bg-white shadow ring-0",
-            "transition duration-200 ease-in-out",
-            checked ? "translate-x-5" : "translate-x-0"
-          )
-        }
-      )
-    ), label && /* @__PURE__ */ React13.createElement(
-      "span",
+      icon && /* @__PURE__ */ React34.createElement("span", { className: "w-4 h-4 shrink-0" }, icon),
+      children
+    );
+  }
+);
+MenuItem.displayName = "MenuItem";
+var MenuSeparator = React34.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React34.createElement(
+  "div",
+  {
+    ref,
+    role: "separator",
+    className: cx("my-1 h-px bg-ash", className),
+    ...props
+  }
+));
+MenuSeparator.displayName = "MenuSeparator";
+var MenuLabel = React34.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ React34.createElement(
+  "div",
+  {
+    ref,
+    className: cx("px-3 py-1.5 text-xs font-medium text-silver", className),
+    ...props
+  },
+  children
+));
+MenuLabel.displayName = "MenuLabel";
+
+// src/components/Navbar.tsx
+import React35 from "react";
+var Navbar = React35.forwardRef(
+  ({ fixed = false, bordered = true, className, children, ...props }, ref) => {
+    return /* @__PURE__ */ React35.createElement(
+      "nav",
       {
-        className: "text-sm text-silver cursor-pointer",
-        onClick: () => {
-          if (disabled) return;
-          buttonRef.current?.click();
-        }
+        ref,
+        className: cx(
+          "w-full bg-charcoal px-4 py-3",
+          bordered && "border-b border-ash",
+          fixed && "fixed top-0 left-0 right-0 z-40",
+          className
+        ),
+        ...props
       },
-      label
-    ));
+      /* @__PURE__ */ React35.createElement("div", { className: "flex items-center justify-between" }, children)
+    );
   }
 );
-Switch.displayName = "Switch";
-
-// src/components/Alert.tsx
-import React14 from "react";
-import { Info, CheckCircle, AlertTriangle, XCircle } from "lucide-react";
-function cx14(...classes) {
-  return classes.filter(Boolean).join(" ");
-}
-var icons = {
-  info: Info,
-  success: CheckCircle,
-  warning: AlertTriangle,
-  error: XCircle
-};
-var variantStyles = {
-  info: "bg-info/10 border-info text-info",
-  success: "bg-success/10 border-success text-success",
-  warning: "bg-warning/10 border-warning text-warning",
-  error: "bg-error/10 border-error text-error"
-};
-var Alert = React14.forwardRef(
-  ({ variant = "info", title, children, className, ...rest }, ref) => {
-    const Icon = icons[variant];
-    return /* @__PURE__ */ React14.createElement(
+Navbar.displayName = "Navbar";
+var NavbarBrand = React35.forwardRef(
+  ({ className, children, ...props }, ref) => {
+    return /* @__PURE__ */ React35.createElement(
       "div",
       {
         ref,
-        role: "alert",
-        className: cx14(
-          "relative w-full p-4 rounded-none border border-l-4 flex gap-3",
-          variantStyles[variant],
+        className: cx("flex items-center gap-2", className),
+        ...props
+      },
+      children
+    );
+  }
+);
+NavbarBrand.displayName = "NavbarBrand";
+var NavbarContent = React35.forwardRef(
+  ({ position = "center", className, children, ...props }, ref) => {
+    const positionClasses = {
+      start: "mr-auto",
+      center: "mx-auto",
+      end: "ml-auto"
+    };
+    return /* @__PURE__ */ React35.createElement(
+      "div",
+      {
+        ref,
+        className: cx(
+          "flex items-center gap-4",
+          positionClasses[position],
           className
         ),
-        ...rest
+        ...props
       },
-      /* @__PURE__ */ React14.createElement(Icon, { className: "h-5 w-5 shrink-0" }),
-      /* @__PURE__ */ React14.createElement("div", { className: "flex-1" }, title && /* @__PURE__ */ React14.createElement("h5", { className: "mb-1 font-medium leading-none tracking-tight text-current" }, title), /* @__PURE__ */ React14.createElement("div", { className: "text-sm opacity-90" }, children))
+      children
     );
   }
 );
-Alert.displayName = "Alert";
-
-// src/components/Spinner.tsx
-import React15 from "react";
-function cx15(...classes) {
-  return classes.filter(Boolean).join(" ");
-}
-var Spinner = ({ className, size = "md", ...rest }) => {
-  const sizeClass = size === "sm" ? "h-4 w-4" : size === "lg" ? "h-8 w-8" : "h-6 w-6";
-  return /* @__PURE__ */ React15.createElement(
-    "svg",
-    {
-      xmlns: "http://www.w3.org/2000/svg",
-      viewBox: "0 0 24 24",
-      fill: "none",
-      stroke: "currentColor",
-      strokeWidth: "2",
-      strokeLinecap: "round",
-      strokeLinejoin: "round",
-      className: cx15("animate-spin text-gold", sizeClass, className),
-      ...rest
-    },
-    /* @__PURE__ */ React15.createElement("path", { d: "M21 12a9 9 0 1 1-6.219-8.56" })
-  );
-};
-Spinner.displayName = "Spinner";
-
-// src/components/Skeleton.tsx
-import React16 from "react";
-function cx16(...classes) {
-  return classes.filter(Boolean).join(" ");
-}
-var Skeleton = React16.forwardRef(
-  ({ className, ...rest }, ref) => {
-    return /* @__PURE__ */ React16.createElement(
+NavbarContent.displayName = "NavbarContent";
+var NavbarItem = React35.forwardRef(
+  ({ active = false, className, children, ...props }, ref) => {
+    return /* @__PURE__ */ React35.createElement(
       "div",
       {
         ref,
-        className: cx16("animate-pulse bg-ash rounded-sm", className),
-        ...rest
-      }
+        className: cx(
+          "flex items-center",
+          className
+        ),
+        ...props
+      },
+      children
     );
   }
 );
-Skeleton.displayName = "Skeleton";
+NavbarItem.displayName = "NavbarItem";
+var NavbarLink = React35.forwardRef(
+  ({ active = false, className, children, ...props }, ref) => {
+    return /* @__PURE__ */ React35.createElement(
+      "a",
+      {
+        ref,
+        className: cx(
+          "text-sm font-medium transition-colors duration-fast",
+          active ? "text-gold" : "text-silver hover:text-white",
+          className
+        ),
+        ...props
+      },
+      children
+    );
+  }
+);
+NavbarLink.displayName = "NavbarLink";
+var NavbarDivider = React35.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React35.createElement(
+  "div",
+  {
+    ref,
+    className: cx("h-6 w-px bg-ash mx-2", className),
+    ...props
+  }
+));
+NavbarDivider.displayName = "NavbarDivider";
 
-// src/components/Modal.tsx
-import React17, { useEffect, useState as useState2 } from "react";
-import { createPortal } from "react-dom";
-import { X } from "lucide-react";
-function cx17(...classes) {
-  return classes.filter(Boolean).join(" ");
+// src/components/Breadcrumb.tsx
+import React36 from "react";
+import { ChevronRight } from "lucide-react";
+var Breadcrumb = React36.forwardRef(
+  ({ separator, className, children, ...props }, ref) => {
+    const items = React36.Children.toArray(children);
+    const defaultSeparator = /* @__PURE__ */ React36.createElement(ChevronRight, { className: "h-4 w-4 text-ash" });
+    return /* @__PURE__ */ React36.createElement("nav", { ref, "aria-label": "Breadcrumb", className, ...props }, /* @__PURE__ */ React36.createElement("ol", { className: "flex items-center gap-2" }, items.map((child, index) => /* @__PURE__ */ React36.createElement("li", { key: index, className: "flex items-center gap-2" }, child, index < items.length - 1 && /* @__PURE__ */ React36.createElement("span", { "aria-hidden": "true" }, separator ?? defaultSeparator)))));
+  }
+);
+Breadcrumb.displayName = "Breadcrumb";
+var BreadcrumbItem = React36.forwardRef(
+  ({ current = false, className, children, ...props }, ref) => {
+    return /* @__PURE__ */ React36.createElement(
+      "span",
+      {
+        ref,
+        "aria-current": current ? "page" : void 0,
+        className: cx(
+          "text-sm",
+          current ? "text-white font-medium" : "text-silver",
+          className
+        ),
+        ...props
+      },
+      children
+    );
+  }
+);
+BreadcrumbItem.displayName = "BreadcrumbItem";
+var BreadcrumbLink = React36.forwardRef(
+  ({ className, children, ...props }, ref) => {
+    return /* @__PURE__ */ React36.createElement(
+      "a",
+      {
+        ref,
+        className: cx(
+          "text-sm text-silver hover:text-gold transition-colors duration-fast",
+          className
+        ),
+        ...props
+      },
+      children
+    );
+  }
+);
+BreadcrumbLink.displayName = "BreadcrumbLink";
+
+// src/components/Pagination.tsx
+import React37 from "react";
+import { ChevronLeft, ChevronRight as ChevronRight2, MoreHorizontal } from "lucide-react";
+function generatePagination(currentPage, totalPages, siblingCount) {
+  const totalSlots = siblingCount * 2 + 5;
+  if (totalPages <= totalSlots) {
+    return Array.from({ length: totalPages }, (_, i) => i + 1);
+  }
+  const leftSiblingIndex = Math.max(currentPage - siblingCount, 1);
+  const rightSiblingIndex = Math.min(currentPage + siblingCount, totalPages);
+  const showLeftEllipsis = leftSiblingIndex > 2;
+  const showRightEllipsis = rightSiblingIndex < totalPages - 1;
+  if (!showLeftEllipsis && showRightEllipsis) {
+    const leftItemCount = 3 + 2 * siblingCount;
+    const leftRange = Array.from({ length: leftItemCount }, (_, i) => i + 1);
+    return [...leftRange, "ellipsis", totalPages];
+  }
+  if (showLeftEllipsis && !showRightEllipsis) {
+    const rightItemCount = 3 + 2 * siblingCount;
+    const rightRange = Array.from(
+      { length: rightItemCount },
+      (_, i) => totalPages - rightItemCount + i + 1
+    );
+    return [1, "ellipsis", ...rightRange];
+  }
+  const middleRange = Array.from(
+    { length: rightSiblingIndex - leftSiblingIndex + 1 },
+    (_, i) => leftSiblingIndex + i
+  );
+  return [1, "ellipsis", ...middleRange, "ellipsis", totalPages];
 }
-var Modal = ({ isOpen, onClose, title, children, className }) => {
-  const [mounted, setMounted] = useState2(false);
-  useEffect(() => {
-    setMounted(true);
-  }, []);
-  useEffect(() => {
-    if (isOpen) {
-      const scrollbarWidth = window.innerWidth - document.documentElement.clientWidth;
-      document.body.style.overflow = "hidden";
-      document.body.style.paddingRight = `${scrollbarWidth}px`;
-    } else {
-      document.body.style.overflow = "unset";
-      document.body.style.paddingRight = "0px";
-    }
-    return () => {
-      document.body.style.overflow = "unset";
-      document.body.style.paddingRight = "0px";
-    };
-  }, [isOpen]);
-  useEffect(() => {
-    const handleEsc = (e) => {
-      if (e.key === "Escape") onClose();
-    };
-    window.addEventListener("keydown", handleEsc);
-    return () => window.removeEventListener("keydown", handleEsc);
-  }, [onClose]);
-  if (!mounted) return null;
-  if (!isOpen) return null;
-  const content = /* @__PURE__ */ React17.createElement("div", { className: "fixed inset-0 z-50 flex items-center justify-center p-4 sm:p-6", onClick: onClose }, /* @__PURE__ */ React17.createElement("div", { className: "fixed inset-0 z-40 bg-obsidian/80 backdrop-blur-sm", "aria-hidden": "true" }), /* @__PURE__ */ React17.createElement(
-    "div",
-    {
-      role: "dialog",
-      "aria-modal": "true",
-      className: cx17(
-        "bg-charcoal border border-gold/30 shadow-2xl z-50 w-full max-w-lg p-6 rounded-none relative",
-        className
+var Pagination = React37.forwardRef(
+  ({
+    page,
+    totalPages,
+    onPageChange,
+    siblingCount = 1,
+    showEdges = true,
+    className,
+    ...props
+  }, ref) => {
+    const pages = generatePagination(page, totalPages, siblingCount);
+    const buttonBaseClass = "flex items-center justify-center h-8 min-w-8 px-2 text-sm border border-ash transition-colors duration-fast focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-gold";
+    return /* @__PURE__ */ React37.createElement(
+      "nav",
+      {
+        ref,
+        role: "navigation",
+        "aria-label": "Pagination",
+        className: cx("flex items-center gap-1", className),
+        ...props
+      },
+      /* @__PURE__ */ React37.createElement(
+        "button",
+        {
+          type: "button",
+          onClick: () => onPageChange(page - 1),
+          disabled: page <= 1,
+          "aria-label": "Go to previous page",
+          className: cx(
+            buttonBaseClass,
+            "text-silver hover:text-white hover:border-gold",
+            page <= 1 && "opacity-50 cursor-not-allowed hover:border-ash"
+          )
+        },
+        /* @__PURE__ */ React37.createElement(ChevronLeft, { className: "h-4 w-4" })
       ),
-      "data-state": "open",
-      onClick: (e) => e.stopPropagation()
-    },
-    /* @__PURE__ */ React17.createElement("div", { className: "flex items-center justify-between mb-2" }, title ? /* @__PURE__ */ React17.createElement("h3", { className: "text-xl font-semibold text-white m-0" }, title) : /* @__PURE__ */ React17.createElement("div", null), /* @__PURE__ */ React17.createElement("button", { onClick: onClose, className: "text-silver hover:text-white transition-colors ml-auto" }, /* @__PURE__ */ React17.createElement(X, { className: "h-5 w-5" }), /* @__PURE__ */ React17.createElement("span", { className: "sr-only" }, "Close"))),
-    /* @__PURE__ */ React17.createElement("div", null, children)
-  ));
-  return createPortal(content, document.body);
-};
-Modal.displayName = "Modal";
+      pages.map(
+        (pageNum, index) => pageNum === "ellipsis" ? /* @__PURE__ */ React37.createElement(
+          "span",
+          {
+            key: `ellipsis-${index}`,
+            className: "flex items-center justify-center h-8 w-8 text-silver"
+          },
+          /* @__PURE__ */ React37.createElement(MoreHorizontal, { className: "h-4 w-4" })
+        ) : /* @__PURE__ */ React37.createElement(
+          "button",
+          {
+            key: pageNum,
+            type: "button",
+            onClick: () => onPageChange(pageNum),
+            "aria-label": `Go to page ${pageNum}`,
+            "aria-current": page === pageNum ? "page" : void 0,
+            className: cx(
+              buttonBaseClass,
+              page === pageNum ? "bg-gold text-obsidian border-gold font-medium" : "text-silver hover:text-white hover:border-gold"
+            )
+          },
+          pageNum
+        )
+      ),
+      /* @__PURE__ */ React37.createElement(
+        "button",
+        {
+          type: "button",
+          onClick: () => onPageChange(page + 1),
+          disabled: page >= totalPages,
+          "aria-label": "Go to next page",
+          className: cx(
+            buttonBaseClass,
+            "text-silver hover:text-white hover:border-gold",
+            page >= totalPages && "opacity-50 cursor-not-allowed hover:border-ash"
+          )
+        },
+        /* @__PURE__ */ React37.createElement(ChevronRight2, { className: "h-4 w-4" })
+      )
+    );
+  }
+);
+Pagination.displayName = "Pagination";
 
 // src/components/Stepper.tsx
-import React18 from "react";
+import React38 from "react";
 import { Check as Check2 } from "lucide-react";
-function cx18(...classes) {
-  return classes.filter(Boolean).join(" ");
-}
-var Stepper = React18.forwardRef(
+var Stepper = React38.forwardRef(
   ({ steps, currentStep, status, className, ...rest }, ref) => {
     const currentIndex = steps.findIndex((step) => step.id === currentStep);
     const getStepState = (index) => {
@@ -656,20 +2641,20 @@ var Stepper = React18.forwardRef(
       }
       return "future";
     };
-    return /* @__PURE__ */ React18.createElement(
+    return /* @__PURE__ */ React38.createElement(
       "div",
       {
         ref,
-        className: cx18("flex items-center w-full", className),
+        className: cx("flex items-center w-full", className),
         ...rest
       },
       steps.map((step, index) => {
         const state = getStepState(index);
         const isLast = index === steps.length - 1;
-        return /* @__PURE__ */ React18.createElement(React18.Fragment, { key: step.id }, /* @__PURE__ */ React18.createElement("div", { className: "flex flex-col items-center" }, /* @__PURE__ */ React18.createElement(
+        return /* @__PURE__ */ React38.createElement(React38.Fragment, { key: step.id }, /* @__PURE__ */ React38.createElement("div", { className: "flex flex-col items-center" }, /* @__PURE__ */ React38.createElement(
           "div",
           {
-            className: cx18(
+            className: cx(
               "flex items-center justify-center w-10 h-10 rounded-full border-2 font-semibold text-sm transition-all duration-200",
               state === "complete" && "bg-gold border-gold text-obsidian",
               state === "current" && "bg-charcoal border-gold text-gold",
@@ -677,11 +2662,11 @@ var Stepper = React18.forwardRef(
               state === "future" && "bg-charcoal border-ash text-silver"
             )
           },
-          state === "complete" ? /* @__PURE__ */ React18.createElement(Check2, { className: "h-5 w-5" }) : /* @__PURE__ */ React18.createElement("span", null, index + 1)
-        ), /* @__PURE__ */ React18.createElement(
+          state === "complete" ? /* @__PURE__ */ React38.createElement(Check2, { className: "h-5 w-5" }) : /* @__PURE__ */ React38.createElement("span", null, index + 1)
+        ), /* @__PURE__ */ React38.createElement(
           "span",
           {
-            className: cx18(
+            className: cx(
               "mt-2 text-xs font-medium",
               state === "complete" && "text-gold",
               state === "current" && "text-white",
@@ -690,10 +2675,10 @@ var Stepper = React18.forwardRef(
             )
           },
           step.label
-        )), !isLast && /* @__PURE__ */ React18.createElement(
+        )), !isLast && /* @__PURE__ */ React38.createElement(
           "div",
           {
-            className: cx18(
+            className: cx(
               "flex-1 h-0.5 mx-4 transition-all duration-200",
               index < currentIndex ? "bg-gold" : "bg-ash"
             )
@@ -706,14 +2691,11 @@ var Stepper = React18.forwardRef(
 Stepper.displayName = "Stepper";
 
 // src/components/Message.tsx
-import React21 from "react";
+import React41 from "react";
 
 // src/components/MarkdownContent.tsx
-import React19, { useMemo } from "react";
+import React39, { useMemo } from "react";
 import DOMPurify from "dompurify";
-function cx19(...classes) {
-  return classes.filter(Boolean).join(" ");
-}
 var DEFAULT_SANITIZE_CONFIG = {
   ALLOWED_TAGS: [
     "h1",
@@ -791,7 +2773,7 @@ function useDOMPurifySetup() {
     });
   }, []);
 }
-var MarkdownContent = React19.forwardRef(
+var MarkdownContent = React39.forwardRef(
   ({ className, content, sanitizeConfig, ...rest }, ref) => {
     useDOMPurifySetup();
     const sanitizedHtml = useMemo(() => {
@@ -801,11 +2783,11 @@ var MarkdownContent = React19.forwardRef(
       const config = sanitizeConfig ?? DEFAULT_SANITIZE_CONFIG;
       return DOMPurify.sanitize(content, config);
     }, [content, sanitizeConfig]);
-    return /* @__PURE__ */ React19.createElement(
+    return /* @__PURE__ */ React39.createElement(
       "div",
       {
         ref,
-        className: cx19("prose", className),
+        className: cx("prose", className),
         dangerouslySetInnerHTML: { __html: sanitizedHtml },
         ...rest
       }
@@ -815,22 +2797,19 @@ var MarkdownContent = React19.forwardRef(
 MarkdownContent.displayName = "MarkdownContent";
 
 // src/components/StreamingCursor.tsx
-import React20 from "react";
-function cx20(...classes) {
-  return classes.filter(Boolean).join(" ");
-}
-var StreamingCursor = React20.forwardRef(
+import React40 from "react";
+var StreamingCursor = React40.forwardRef(
   ({ className, variant = "line", ...rest }, ref) => {
     const variantStyles3 = {
       block: "w-2.5 h-cursor translate-y-cursor-offset",
       line: "w-0.5 h-cursor translate-y-cursor-offset",
       underscore: "w-2.5 h-0.5 self-end mb-0.5"
     };
-    return /* @__PURE__ */ React20.createElement(
+    return /* @__PURE__ */ React40.createElement(
       "span",
       {
         ref,
-        className: cx20(
+        className: cx(
           "inline-block bg-current animate-cursor-blink",
           variantStyles3[variant],
           className
@@ -844,55 +2823,49 @@ var StreamingCursor = React20.forwardRef(
 StreamingCursor.displayName = "StreamingCursor";
 
 // src/components/Message.tsx
-function cx21(...classes) {
-  return classes.filter(Boolean).join(" ");
-}
 var variantStyles2 = {
   user: "bg-gold text-obsidian ml-auto",
   assistant: "bg-charcoal border border-ash text-white mr-auto"
 };
-var Message = React21.forwardRef(
+var Message = React41.forwardRef(
   ({ variant = "assistant", className, content, isStreaming, ...rest }, ref) => {
     const isUser = variant === "user";
-    return /* @__PURE__ */ React21.createElement(
+    return /* @__PURE__ */ React41.createElement(
       "div",
       {
         ref,
-        className: cx21(
+        className: cx(
           "px-3 py-2 w-fit",
           variantStyles2[variant],
           className
         ),
         ...rest
       },
-      /* @__PURE__ */ React21.createElement(
+      /* @__PURE__ */ React41.createElement(
         MarkdownContent,
         {
           content,
-          className: cx21("prose-sm", isUser ? "prose-inherit" : "prose-invert")
+          className: cx("prose-sm", isUser ? "prose-inherit" : "prose-invert")
         }
       ),
-      isStreaming && /* @__PURE__ */ React21.createElement(StreamingCursor, { className: "ml-0.5" })
+      isStreaming && /* @__PURE__ */ React41.createElement(StreamingCursor, { className: "ml-0.5" })
     );
   }
 );
 Message.displayName = "Message";
 
 // src/components/ChatHistory.tsx
-import React22 from "react";
-function cx22(...classes) {
-  return classes.filter(Boolean).join(" ");
-}
-var ChatHistory = React22.forwardRef(
+import React42 from "react";
+var ChatHistory = React42.forwardRef(
   ({ messages, className, ...rest }, ref) => {
-    return /* @__PURE__ */ React22.createElement(
+    return /* @__PURE__ */ React42.createElement(
       "div",
       {
         ref,
-        className: cx22("flex flex-col gap-3 w-full", className),
+        className: cx("flex flex-col gap-3 w-full", className),
         ...rest
       },
-      messages.map(({ id, variant, className: messageClassName, ...messageProps }, index) => /* @__PURE__ */ React22.createElement(
+      messages.map(({ id, variant, className: messageClassName, ...messageProps }, index) => /* @__PURE__ */ React42.createElement(
         Message,
         {
           key: id ?? index,
@@ -907,23 +2880,20 @@ var ChatHistory = React22.forwardRef(
 ChatHistory.displayName = "ChatHistory";
 
 // src/components/BrandIcon.tsx
-import React23 from "react";
-function cx23(...classes) {
-  return classes.filter(Boolean).join(" ");
-}
+import React43 from "react";
 var sizeMap2 = {
   sm: "h-8 w-8 text-sm",
   md: "h-12 w-12 text-base",
   lg: "h-16 w-16 text-lg"
 };
-var BrandIcon = React23.forwardRef(
+var BrandIcon = React43.forwardRef(
   ({ size = "md", variant = "solid", children, className, ...rest }, ref) => {
     const variantClasses = variant === "solid" ? "bg-gold text-obsidian border-2 border-gold" : "bg-transparent text-gold border-2 border-gold";
-    return /* @__PURE__ */ React23.createElement(
+    return /* @__PURE__ */ React43.createElement(
       "div",
       {
         ref,
-        className: cx23(
+        className: cx(
           "inline-flex items-center justify-center rounded-none font-bold select-none overflow-hidden",
           sizeMap2[size],
           variantClasses,
@@ -938,20 +2908,17 @@ var BrandIcon = React23.forwardRef(
 BrandIcon.displayName = "BrandIcon";
 
 // src/components/ColorSwatch.tsx
-import React24 from "react";
-function cx24(...classes) {
-  return classes.filter(Boolean).join(" ");
-}
-var ColorSwatch = React24.forwardRef(
+import React44 from "react";
+var ColorSwatch = React44.forwardRef(
   ({ color, label, className, ...rest }, ref) => {
-    return /* @__PURE__ */ React24.createElement(
+    return /* @__PURE__ */ React44.createElement(
       "div",
       {
         ref,
-        className: cx24("flex flex-col items-center gap-2", className),
+        className: cx("flex flex-col items-center gap-2", className),
         ...rest
       },
-      /* @__PURE__ */ React24.createElement(
+      /* @__PURE__ */ React44.createElement(
         "div",
         {
           className: "h-16 w-16 border-2 border-ash rounded-none shadow-sm",
@@ -959,14 +2926,14 @@ var ColorSwatch = React24.forwardRef(
           "aria-label": label || color
         }
       ),
-      label && /* @__PURE__ */ React24.createElement("span", { className: "text-xs text-silver font-medium" }, label)
+      label && /* @__PURE__ */ React44.createElement("span", { className: "text-xs text-silver font-medium" }, label)
     );
   }
 );
 ColorSwatch.displayName = "ColorSwatch";
 
 // src/components/ImageCard.tsx
-import React25 from "react";
+import React45 from "react";
 var ASPECT_RATIO_PRESETS = {
   landscape: "3 / 2",
   portrait: "2 / 3",
@@ -978,10 +2945,7 @@ function resolveAspectRatio(ratio) {
   }
   return ratio.replace("/", " / ");
 }
-function cx25(...classes) {
-  return classes.filter(Boolean).join(" ");
-}
-var ImageCard = React25.forwardRef(
+var ImageCard = React45.forwardRef(
   ({
     src,
     alt,
@@ -998,22 +2962,22 @@ var ImageCard = React25.forwardRef(
   }, ref) => {
     const hasAspectRatio = aspectRatio !== void 0;
     const isContain = objectFit === "contain";
-    return /* @__PURE__ */ React25.createElement(Card, { ref, className: cx25("p-0 overflow-hidden group w-fit", className), ...props }, /* @__PURE__ */ React25.createElement(
+    return /* @__PURE__ */ React45.createElement(Card, { ref, className: cx("p-0 overflow-hidden group w-fit", className), ...props }, /* @__PURE__ */ React45.createElement(
       "div",
       {
-        className: cx25(
+        className: cx(
           "relative",
           hasAspectRatio && "overflow-hidden",
           mediaClassName
         ),
         style: hasAspectRatio ? { aspectRatio: resolveAspectRatio(aspectRatio) } : void 0
       },
-      /* @__PURE__ */ React25.createElement(
+      /* @__PURE__ */ React45.createElement(
         "img",
         {
           src,
           alt,
-          className: cx25(
+          className: cx(
             "block max-w-full",
             hasAspectRatio && "w-full h-full",
             hasAspectRatio && (isContain ? "object-contain" : "object-cover"),
@@ -1021,35 +2985,32 @@ var ImageCard = React25.forwardRef(
           )
         }
       ),
-      overlay && /* @__PURE__ */ React25.createElement(
+      overlay && /* @__PURE__ */ React45.createElement(
         "div",
         {
           className: "absolute inset-0 bg-obsidian/80 opacity-0 group-hover:opacity-100 transition-opacity duration-200 flex items-center justify-center"
         },
         overlay
       )
-    ), (title || subtitle || children) && /* @__PURE__ */ React25.createElement("div", { className: cx25("px-4 pt-4", contentClassName) }, title && /* @__PURE__ */ React25.createElement("h4", { className: "text-lg font-semibold leading-tight" }, title), subtitle && /* @__PURE__ */ React25.createElement("p", { className: "text-sm text-silver leading-normal" }, subtitle), children));
+    ), (title || subtitle || children) && /* @__PURE__ */ React45.createElement("div", { className: cx("px-4 pt-4", contentClassName) }, title && /* @__PURE__ */ React45.createElement("h4", { className: "text-lg font-semibold leading-tight" }, title), subtitle && /* @__PURE__ */ React45.createElement("p", { className: "text-sm text-silver leading-normal" }, subtitle), children));
   }
 );
 ImageCard.displayName = "ImageCard";
 
 // src/components/SectionHeading.tsx
-import React26 from "react";
-function cx26(...classes) {
-  return classes.filter(Boolean).join(" ");
-}
+import React46 from "react";
 var levelStyles = {
   h2: "text-2xl mb-4",
   h3: "text-xl mb-3"
 };
-var SectionHeading = React26.forwardRef(
+var SectionHeading = React46.forwardRef(
   ({ level = "h2", children, className, ...rest }, ref) => {
     const Component = level;
-    return /* @__PURE__ */ React26.createElement(
+    return /* @__PURE__ */ React46.createElement(
       Component,
       {
         ref,
-        className: cx26(
+        className: cx(
           "text-gold font-semibold tracking-tight",
           levelStyles[level],
           className
@@ -1065,32 +3026,88 @@ SectionHeading.displayName = "SectionHeading";
 // src/index.ts
 var version = "2.0.0";
 export {
+  Accordion,
+  AccordionContent,
+  AccordionItem,
+  AccordionTrigger,
   Alert,
+  AlertDialog,
   Avatar,
   Badge,
   BrandIcon,
+  Breadcrumb,
+  BreadcrumbItem,
+  BreadcrumbLink,
   Button,
   Card,
   ChatHistory,
   Checkbox,
+  Col,
   ColorSwatch,
+  ConfirmDialog,
+  Container,
+  Divider,
+  Drawer,
   HelperText,
   ImageCard,
   Input,
+  InputGroup,
+  InputLeftAddon,
+  InputLeftElement,
+  InputRightAddon,
+  InputRightElement,
+  InputWrapper,
   Label,
+  List,
+  ListItem,
+  ListItemText,
+  ListSubheader,
   MarkdownContent,
+  Menu,
+  MenuContent,
+  MenuItem,
+  MenuLabel,
+  MenuSeparator,
+  MenuTrigger,
   Message,
   Modal,
+  Navbar,
+  NavbarBrand,
+  NavbarContent,
+  NavbarDivider,
+  NavbarItem,
+  NavbarLink,
+  Pagination,
+  Popover,
+  Progress,
+  PromptDialog,
   Radio,
+  Row,
   SectionHeading,
   Select,
   Skeleton,
+  Slider,
   Spinner,
+  Stack,
   Stepper,
   StreamingCursor,
   Switch,
+  Tab,
+  TabList,
+  TabPanel,
+  Table,
+  TableBody,
+  TableCaption,
+  TableCell,
+  TableFooter,
+  TableHead,
+  TableHeader,
+  TableRow,
+  Tabs,
   Textarea,
+  ToastProvider,
   Tooltip,
+  useToast,
   version
 };
 //# sourceMappingURL=index.mjs.map