@tangle-network/sandbox-ui 0.2.2 → 0.3.4

package/dist/chunk-J4OADEUK.js

@@ -1,814 +0,0 @@
-import {
-  Logo
-} from "./chunk-OKCIKTXQ.js";
-import {
-  DropdownMenu,
-  DropdownMenuContent,
-  DropdownMenuItem,
-  DropdownMenuLabel,
-  DropdownMenuSeparator,
-  DropdownMenuTrigger
-} from "./chunk-MCGKDCOR.js";
-import {
-  Badge,
-  Skeleton
-} from "./chunk-2UHPE5T7.js";
-import {
-  Button
-} from "./chunk-E6FS7R4X.js";
-import {
-  cn
-} from "./chunk-RQHJBTEU.js";
-
-// src/primitives/theme-toggle.tsx
-import { useCallback, useEffect, useState } from "react";
-import { jsx, jsxs } from "react/jsx-runtime";
-function getSystemTheme() {
-  return window.matchMedia("(prefers-color-scheme: dark)").matches ? "dark" : "light";
-}
-function applyTheme(theme) {
-  const resolved = theme === "system" ? getSystemTheme() : theme;
-  document.documentElement.classList.toggle("dark", resolved === "dark");
-}
-function useTheme() {
-  const [theme, setThemeState] = useState(() => {
-    if (typeof window === "undefined") return "system";
-    return localStorage.getItem("theme") ?? "system";
-  });
-  const setTheme = useCallback((next) => {
-    setThemeState(next);
-    if (next === "system") {
-      localStorage.removeItem("theme");
-    } else {
-      localStorage.setItem("theme", next);
-    }
-    applyTheme(next);
-  }, []);
-  useEffect(() => {
-    applyTheme(theme);
-    if (theme !== "system") return;
-    const mq = window.matchMedia("(prefers-color-scheme: dark)");
-    const handler = () => applyTheme("system");
-    mq.addEventListener("change", handler);
-    return () => mq.removeEventListener("change", handler);
-  }, [theme]);
-  return { theme, setTheme };
-}
-var iconClass = "h-4 w-4";
-function SunIcon() {
-  return /* @__PURE__ */ jsxs(
-    "svg",
-    {
-      xmlns: "http://www.w3.org/2000/svg",
-      viewBox: "0 0 24 24",
-      fill: "none",
-      stroke: "currentColor",
-      strokeWidth: 2,
-      strokeLinecap: "round",
-      strokeLinejoin: "round",
-      className: iconClass,
-      children: [
-        /* @__PURE__ */ jsx("circle", { cx: 12, cy: 12, r: 5 }),
-        /* @__PURE__ */ jsx("path", { d: "M12 1v2M12 21v2M4.22 4.22l1.42 1.42M18.36 18.36l1.42 1.42M1 12h2M21 12h2M4.22 19.78l1.42-1.42M18.36 5.64l1.42-1.42" })
-      ]
-    }
-  );
-}
-function MoonIcon() {
-  return /* @__PURE__ */ jsx(
-    "svg",
-    {
-      xmlns: "http://www.w3.org/2000/svg",
-      viewBox: "0 0 24 24",
-      fill: "none",
-      stroke: "currentColor",
-      strokeWidth: 2,
-      strokeLinecap: "round",
-      strokeLinejoin: "round",
-      className: iconClass,
-      children: /* @__PURE__ */ jsx("path", { d: "M21 12.79A9 9 0 1 1 11.21 3 7 7 0 0 0 21 12.79z" })
-    }
-  );
-}
-function ThemeToggle() {
-  const { theme, setTheme } = useTheme();
-  const resolved = theme === "system" ? getSystemTheme() : theme;
-  return /* @__PURE__ */ jsx(
-    "button",
-    {
-      type: "button",
-      onClick: () => setTheme(resolved === "dark" ? "light" : "dark"),
-      className: "inline-flex items-center justify-center rounded-md p-2 text-muted-foreground hover:bg-accent hover:text-accent-foreground transition-colors",
-      "aria-label": `Switch to ${resolved === "dark" ? "light" : "dark"} mode`,
-      children: resolved === "dark" ? /* @__PURE__ */ jsx(SunIcon, {}) : /* @__PURE__ */ jsx(MoonIcon, {})
-    }
-  );
-}
-
-// src/dashboard/dashboard-layout.tsx
-import * as React from "react";
-import { Fragment, jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
-var variantStyles = {
-  sandbox: {
-    activeNav: "bg-purple-500/10 text-purple-400",
-    userGradient: "from-purple-500 to-violet-500"
-  }
-};
-function DefaultLink({
-  href,
-  to,
-  className,
-  children,
-  ...rest
-}) {
-  return /* @__PURE__ */ jsx2("a", { href: href ?? to, className, ...rest, children });
-}
-function UserIcon({ className }) {
-  return /* @__PURE__ */ jsxs2(
-    "svg",
-    {
-      xmlns: "http://www.w3.org/2000/svg",
-      viewBox: "0 0 24 24",
-      fill: "none",
-      stroke: "currentColor",
-      strokeWidth: "2",
-      strokeLinecap: "round",
-      strokeLinejoin: "round",
-      className,
-      children: [
-        /* @__PURE__ */ jsx2("title", { children: "User icon" }),
-        /* @__PURE__ */ jsx2("path", { d: "M19 21v-2a4 4 0 0 0-4-4H9a4 4 0 0 0-4 4v2" }),
-        /* @__PURE__ */ jsx2("circle", { cx: "12", cy: "7", r: "4" })
-      ]
-    }
-  );
-}
-function SettingsIcon({ className }) {
-  return /* @__PURE__ */ jsxs2(
-    "svg",
-    {
-      xmlns: "http://www.w3.org/2000/svg",
-      viewBox: "0 0 24 24",
-      fill: "none",
-      stroke: "currentColor",
-      strokeWidth: "2",
-      strokeLinecap: "round",
-      strokeLinejoin: "round",
-      className,
-      children: [
-        /* @__PURE__ */ jsx2("title", { children: "Settings icon" }),
-        /* @__PURE__ */ jsx2("path", { d: "M12.22 2h-.44a2 2 0 0 0-2 2v.18a2 2 0 0 1-1 1.73l-.43.25a2 2 0 0 1-2 0l-.15-.08a2 2 0 0 0-2.73.73l-.22.38a2 2 0 0 0 .73 2.73l.15.1a2 2 0 0 1 1 1.72v.51a2 2 0 0 1-1 1.74l-.15.09a2 2 0 0 0-.73 2.73l.22.38a2 2 0 0 0 2.73.73l.15-.08a2 2 0 0 1 2 0l.43.25a2 2 0 0 1 1 1.73V20a2 2 0 0 0 2 2h.44a2 2 0 0 0 2-2v-.18a2 2 0 0 1 1-1.73l.43-.25a2 2 0 0 1 2 0l.15.08a2 2 0 0 0 2.73-.73l.22-.39a2 2 0 0 0-.73-2.73l-.15-.08a2 2 0 0 1-1-1.74v-.5a2 2 0 0 1 1-1.74l.15-.09a2 2 0 0 0 .73-2.73l-.22-.38a2 2 0 0 0-2.73-.73l-.15.08a2 2 0 0 1-2 0l-.43-.25a2 2 0 0 1-1-1.73V4a2 2 0 0 0-2-2z" }),
-        /* @__PURE__ */ jsx2("circle", { cx: "12", cy: "12", r: "3" })
-      ]
-    }
-  );
-}
-function LogOutIcon({ className }) {
-  return /* @__PURE__ */ jsxs2(
-    "svg",
-    {
-      xmlns: "http://www.w3.org/2000/svg",
-      viewBox: "0 0 24 24",
-      fill: "none",
-      stroke: "currentColor",
-      strokeWidth: "2",
-      strokeLinecap: "round",
-      strokeLinejoin: "round",
-      className,
-      children: [
-        /* @__PURE__ */ jsx2("title", { children: "Log out icon" }),
-        /* @__PURE__ */ jsx2("path", { d: "M9 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h4" }),
-        /* @__PURE__ */ jsx2("polyline", { points: "16,17 21,12 16,7" }),
-        /* @__PURE__ */ jsx2("line", { x1: "21", x2: "9", y1: "12", y2: "12" })
-      ]
-    }
-  );
-}
-function ChevronRightIcon({ className }) {
-  return /* @__PURE__ */ jsxs2(
-    "svg",
-    {
-      xmlns: "http://www.w3.org/2000/svg",
-      viewBox: "0 0 24 24",
-      fill: "none",
-      stroke: "currentColor",
-      strokeWidth: "2",
-      strokeLinecap: "round",
-      strokeLinejoin: "round",
-      className,
-      children: [
-        /* @__PURE__ */ jsx2("title", { children: "Chevron right icon" }),
-        /* @__PURE__ */ jsx2("path", { d: "m9 18 6-6-6-6" })
-      ]
-    }
-  );
-}
-function MenuIcon({ className }) {
-  return /* @__PURE__ */ jsxs2(
-    "svg",
-    {
-      xmlns: "http://www.w3.org/2000/svg",
-      viewBox: "0 0 24 24",
-      fill: "none",
-      stroke: "currentColor",
-      strokeWidth: "2",
-      strokeLinecap: "round",
-      strokeLinejoin: "round",
-      className,
-      children: [
-        /* @__PURE__ */ jsx2("title", { children: "Menu icon" }),
-        /* @__PURE__ */ jsx2("line", { x1: "4", x2: "20", y1: "12", y2: "12" }),
-        /* @__PURE__ */ jsx2("line", { x1: "4", x2: "20", y1: "6", y2: "6" }),
-        /* @__PURE__ */ jsx2("line", { x1: "4", x2: "20", y1: "18", y2: "18" })
-      ]
-    }
-  );
-}
-function XIcon({ className }) {
-  return /* @__PURE__ */ jsxs2(
-    "svg",
-    {
-      xmlns: "http://www.w3.org/2000/svg",
-      viewBox: "0 0 24 24",
-      fill: "none",
-      stroke: "currentColor",
-      strokeWidth: "2",
-      strokeLinecap: "round",
-      strokeLinejoin: "round",
-      className,
-      children: [
-        /* @__PURE__ */ jsx2("title", { children: "Close icon" }),
-        /* @__PURE__ */ jsx2("path", { d: "M18 6 6 18" }),
-        /* @__PURE__ */ jsx2("path", { d: "m6 6 12 12" })
-      ]
-    }
-  );
-}
-function DashboardLayout({
-  children,
-  variant = "sandbox",
-  navItems,
-  activeNavId,
-  user,
-  isLoading = false,
-  onLogout,
-  onSettingsClick,
-  settingsHref = "/dashboard/settings",
-  LinkComponent = DefaultLink
-}) {
-  const styles = variantStyles[variant];
-  const Link = LinkComponent;
-  const [mobileMenuOpen, setMobileMenuOpen] = React.useState(false);
-  const handleNavClick = () => {
-    setMobileMenuOpen(false);
-  };
-  const SidebarContent = () => /* @__PURE__ */ jsxs2(Fragment, { children: [
-    /* @__PURE__ */ jsx2("div", { className: "border-border border-b p-6", children: /* @__PURE__ */ jsx2(Logo, { variant, size: "md" }) }),
-    /* @__PURE__ */ jsx2("nav", { className: "flex-1 space-y-1 p-4", "aria-label": "Main navigation", children: navItems.map((item) => {
-      const Icon = item.icon;
-      const isActive = activeNavId === item.id;
-      return /* @__PURE__ */ jsxs2(
-        Link,
-        {
-          href: item.href,
-          to: item.href,
-          onClick: handleNavClick,
-          "aria-current": isActive ? "page" : void 0,
-          className: cn(
-            "flex items-center gap-3 rounded-lg px-4 py-2.5 transition-colors focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-offset-background",
-            isActive ? styles.activeNav : "text-muted-foreground hover:bg-accent hover:text-foreground"
-          ),
-          children: [
-            /* @__PURE__ */ jsx2(Icon, { className: "h-5 w-5", "aria-hidden": "true" }),
-            /* @__PURE__ */ jsx2("span", { className: "font-medium", children: item.label })
-          ]
-        },
-        item.id
-      );
-    }) }),
-    /* @__PURE__ */ jsxs2("div", { className: "border-border border-t p-4", children: [
-      /* @__PURE__ */ jsx2("div", { className: "mb-2 flex justify-end", children: /* @__PURE__ */ jsx2(ThemeToggle, {}) }),
-      /* @__PURE__ */ jsxs2(DropdownMenu, { children: [
-        /* @__PURE__ */ jsx2(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ jsxs2(
-          "button",
-          {
-            type: "button",
-            className: "flex w-full items-center gap-3 rounded-lg p-3 transition-colors hover:bg-accent focus:outline-none focus:ring-2 focus:ring-offset-2",
-            "aria-label": "User menu",
-            children: [
-              /* @__PURE__ */ jsx2(
-                "div",
-                {
-                  className: cn(
-                    "flex h-8 w-8 items-center justify-center rounded-full bg-gradient-to-r",
-                    styles.userGradient
-                  ),
-                  children: /* @__PURE__ */ jsx2(UserIcon, { className: "h-4 w-4 text-white", "aria-hidden": "true" })
-                }
-              ),
-              /* @__PURE__ */ jsx2("div", { className: "flex-1 text-left", children: isLoading ? /* @__PURE__ */ jsxs2(Fragment, { children: [
-                /* @__PURE__ */ jsx2(Skeleton, { className: "mb-1 h-4 w-24" }),
-                /* @__PURE__ */ jsx2(Skeleton, { className: "h-3 w-16" })
-              ] }) : /* @__PURE__ */ jsxs2(Fragment, { children: [
-                /* @__PURE__ */ jsx2("p", { className: "truncate font-medium text-sm", children: user?.email ?? "Not logged in" }),
-                /* @__PURE__ */ jsxs2("p", { className: "text-muted-foreground text-xs capitalize", children: [
-                  user?.tier ?? "Free",
-                  " Plan"
-                ] })
-              ] }) }),
-              /* @__PURE__ */ jsx2(
-                ChevronRightIcon,
-                {
-                  className: "h-4 w-4 text-muted-foreground",
-                  "aria-hidden": "true"
-                }
-              )
-            ]
-          }
-        ) }),
-        /* @__PURE__ */ jsxs2(DropdownMenuContent, { align: "end", className: "w-56", children: [
-          /* @__PURE__ */ jsx2(DropdownMenuLabel, { children: "My Account" }),
-          /* @__PURE__ */ jsx2(DropdownMenuSeparator, {}),
-          onSettingsClick ? /* @__PURE__ */ jsxs2(DropdownMenuItem, { onClick: onSettingsClick, children: [
-            /* @__PURE__ */ jsx2(SettingsIcon, { className: "mr-2 h-4 w-4", "aria-hidden": "true" }),
-            "Settings"
-          ] }) : /* @__PURE__ */ jsx2(DropdownMenuItem, { asChild: true, children: /* @__PURE__ */ jsxs2(Link, { href: settingsHref, to: settingsHref, className: "flex items-center", children: [
-            /* @__PURE__ */ jsx2(SettingsIcon, { className: "mr-2 h-4 w-4", "aria-hidden": "true" }),
-            "Settings"
-          ] }) }),
-          onLogout && /* @__PURE__ */ jsxs2(DropdownMenuItem, { className: "text-red-400", onClick: onLogout, children: [
-            /* @__PURE__ */ jsx2(LogOutIcon, { className: "mr-2 h-4 w-4", "aria-hidden": "true" }),
-            "Sign Out"
-          ] })
-        ] })
-      ] })
-    ] })
-  ] });
-  return /* @__PURE__ */ jsxs2("div", { className: "flex min-h-screen bg-background", children: [
-    /* @__PURE__ */ jsxs2("header", { className: "fixed top-0 right-0 left-0 z-40 flex h-16 items-center justify-between border-border border-b bg-card/95 px-4 backdrop-blur-xl md:hidden", children: [
-      /* @__PURE__ */ jsx2(Logo, { variant, size: "sm" }),
-      /* @__PURE__ */ jsx2(
-        "button",
-        {
-          type: "button",
-          onClick: () => setMobileMenuOpen(!mobileMenuOpen),
-          className: "rounded-md p-2 hover:bg-accent focus:outline-none focus:ring-2 focus:ring-offset-2",
-          "aria-label": mobileMenuOpen ? "Close menu" : "Open menu",
-          "aria-expanded": mobileMenuOpen,
-          children: mobileMenuOpen ? /* @__PURE__ */ jsx2(XIcon, { className: "h-6 w-6" }) : /* @__PURE__ */ jsx2(MenuIcon, { className: "h-6 w-6" })
-        }
-      )
-    ] }),
-    mobileMenuOpen && /* @__PURE__ */ jsx2(
-      "div",
-      {
-        className: "fixed inset-0 z-30 bg-black/50 md:hidden",
-        onClick: () => setMobileMenuOpen(false),
-        "aria-hidden": "true"
-      }
-    ),
-    /* @__PURE__ */ jsx2(
-      "aside",
-      {
-        className: cn(
-          "fixed top-16 bottom-0 left-0 z-30 flex w-64 flex-col border-border border-r bg-card/95 backdrop-blur-xl transition-transform duration-200 md:hidden",
-          mobileMenuOpen ? "translate-x-0" : "-translate-x-full"
-        ),
-        children: /* @__PURE__ */ jsx2(SidebarContent, {})
-      }
-    ),
-    /* @__PURE__ */ jsx2("aside", { className: "fixed top-0 bottom-0 left-0 hidden w-64 flex-col border-border border-r bg-card/50 backdrop-blur-xl md:flex", children: /* @__PURE__ */ jsx2(SidebarContent, {}) }),
-    /* @__PURE__ */ jsx2("main", { className: "flex-1 pt-16 md:ml-64 md:pt-0", children: /* @__PURE__ */ jsx2("div", { className: "p-4 md:p-8", children: /* @__PURE__ */ jsx2("div", { className: "mx-auto max-w-6xl", children }) }) })
-  ] });
-}
-
-// src/dashboard/backend-selector.tsx
-import { jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
-function BackendSelector({
-  backends,
-  selected,
-  onChange,
-  label = "Models",
-  hint,
-  multiSelect = true,
-  className
-}) {
-  const toggle = (type) => {
-    if (multiSelect) {
-      onChange(
-        selected.includes(type) ? selected.filter((b) => b !== type) : [...selected, type]
-      );
-    } else {
-      onChange([type]);
-    }
-  };
-  return /* @__PURE__ */ jsxs3("div", { className, children: [
-    /* @__PURE__ */ jsxs3("label", { className: "mb-2 block font-medium text-sm", children: [
-      label,
-      multiSelect && /* @__PURE__ */ jsx3("span", { className: "ml-2 font-normal text-muted-foreground", children: "(select multiple to compare)" })
-    ] }),
-    /* @__PURE__ */ jsx3("div", { className: "flex flex-wrap gap-2", children: backends.map((backend) => {
-      const isSelected = selected.includes(backend.type);
-      return /* @__PURE__ */ jsx3(
-        "button",
-        {
-          type: "button",
-          onClick: () => toggle(backend.type),
-          className: `rounded-lg border px-3 py-2 text-sm transition-colors ${isSelected ? "border-blue-500 bg-blue-500/10 text-blue-400" : "border-border bg-background text-muted-foreground hover:border-muted-foreground/50"}`,
-          title: backend.description,
-          children: backend.label
-        },
-        backend.type
-      );
-    }) }),
-    multiSelect && selected.length > 1 && /* @__PURE__ */ jsx3("p", { className: "mt-2 text-muted-foreground text-xs", children: hint || `Will run on ${selected.length} variants in parallel for comparison` })
-  ] });
-}
-
-// src/dashboard/profile-selector.tsx
-import { Check, ChevronDown, Plus, Settings } from "lucide-react";
-import { Fragment as Fragment2, jsx as jsx4, jsxs as jsxs4 } from "react/jsx-runtime";
-function ProfileSelector({
-  profiles,
-  selectedId,
-  onSelect,
-  onCreateClick,
-  onManageClick,
-  label = "Profile",
-  placeholder = "Default (no custom profile)",
-  showMetrics = true,
-  className
-}) {
-  const selected = profiles.find((p) => p.id === selectedId);
-  const builtinProfiles = profiles.filter((p) => p.is_builtin);
-  const customProfiles = profiles.filter((p) => !p.is_builtin);
-  return /* @__PURE__ */ jsxs4("div", { className, children: [
-    label && /* @__PURE__ */ jsx4("label", { className: "mb-2 block font-medium text-sm", children: label }),
-    /* @__PURE__ */ jsxs4(DropdownMenu, { children: [
-      /* @__PURE__ */ jsx4(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ jsxs4(Button, { variant: "outline", className: "w-full justify-between", children: [
-        /* @__PURE__ */ jsx4("span", { className: "truncate", children: selected ? selected.name : placeholder }),
-        /* @__PURE__ */ jsx4(ChevronDown, { className: "ml-2 h-4 w-4 shrink-0 opacity-50" })
-      ] }) }),
-      /* @__PURE__ */ jsxs4(DropdownMenuContent, { className: "w-[300px]", align: "start", children: [
-        /* @__PURE__ */ jsxs4(
-          DropdownMenuItem,
-          {
-            onClick: () => onSelect(null),
-            className: "flex items-center justify-between",
-            children: [
-              /* @__PURE__ */ jsx4("span", { children: placeholder }),
-              !selectedId && /* @__PURE__ */ jsx4(Check, { className: "h-4 w-4 text-green-400" })
-            ]
-          }
-        ),
-        builtinProfiles.length > 0 && /* @__PURE__ */ jsxs4(Fragment2, { children: [
-          /* @__PURE__ */ jsx4(DropdownMenuSeparator, {}),
-          /* @__PURE__ */ jsx4(DropdownMenuLabel, { children: "Built-in Profiles" }),
-          builtinProfiles.map((profile) => /* @__PURE__ */ jsxs4(
-            DropdownMenuItem,
-            {
-              onClick: () => onSelect(profile),
-              className: "flex flex-col items-start gap-1",
-              children: [
-                /* @__PURE__ */ jsxs4("div", { className: "flex w-full items-center justify-between", children: [
-                  /* @__PURE__ */ jsxs4("div", { className: "flex items-center gap-2", children: [
-                    /* @__PURE__ */ jsx4("span", { className: "font-medium", children: profile.name }),
-                    profile.extends && /* @__PURE__ */ jsxs4(Badge, { variant: "secondary", className: "border-0 text-xs", children: [
-                      "extends ",
-                      profile.extends
-                    ] })
-                  ] }),
-                  selectedId === profile.id && /* @__PURE__ */ jsx4(Check, { className: "h-4 w-4 text-green-400" })
-                ] }),
-                profile.description && /* @__PURE__ */ jsx4("span", { className: "line-clamp-1 text-muted-foreground text-xs", children: profile.description })
-              ]
-            },
-            profile.id
-          ))
-        ] }),
-        customProfiles.length > 0 && /* @__PURE__ */ jsxs4(Fragment2, { children: [
-          /* @__PURE__ */ jsx4(DropdownMenuSeparator, {}),
-          /* @__PURE__ */ jsx4(DropdownMenuLabel, { children: "Custom Profiles" }),
-          customProfiles.map((profile) => /* @__PURE__ */ jsxs4(
-            DropdownMenuItem,
-            {
-              onClick: () => onSelect(profile),
-              className: "flex flex-col items-start gap-1",
-              children: [
-                /* @__PURE__ */ jsxs4("div", { className: "flex w-full items-center justify-between", children: [
-                  /* @__PURE__ */ jsxs4("div", { className: "flex items-center gap-2", children: [
-                    /* @__PURE__ */ jsx4("span", { className: "font-medium", children: profile.name }),
-                    profile.model && /* @__PURE__ */ jsx4(Badge, { variant: "secondary", className: "border-0 text-xs", children: profile.model.split("/").pop() })
-                  ] }),
-                  selectedId === profile.id && /* @__PURE__ */ jsx4(Check, { className: "h-4 w-4 text-green-400" })
-                ] }),
-                profile.description && /* @__PURE__ */ jsx4("span", { className: "line-clamp-1 text-muted-foreground text-xs", children: profile.description }),
-                showMetrics && profile.metrics && profile.metrics.total_runs > 0 && /* @__PURE__ */ jsxs4("div", { className: "flex gap-3 text-muted-foreground text-xs", children: [
-                  /* @__PURE__ */ jsxs4("span", { children: [
-                    profile.metrics.total_runs,
-                    " runs"
-                  ] }),
-                  /* @__PURE__ */ jsxs4("span", { children: [
-                    profile.metrics.success_rate.toFixed(0),
-                    "% success"
-                  ] }),
-                  /* @__PURE__ */ jsxs4("span", { children: [
-                    "~",
-                    (profile.metrics.avg_duration_ms / 1e3).toFixed(1),
-                    "s avg"
-                  ] })
-                ] })
-              ]
-            },
-            profile.id
-          ))
-        ] }),
-        (onCreateClick || onManageClick) && /* @__PURE__ */ jsxs4(Fragment2, { children: [
-          /* @__PURE__ */ jsx4(DropdownMenuSeparator, {}),
-          onCreateClick && /* @__PURE__ */ jsxs4(
-            DropdownMenuItem,
-            {
-              onClick: onCreateClick,
-              className: "text-blue-400",
-              children: [
-                /* @__PURE__ */ jsx4(Plus, { className: "mr-2 h-4 w-4" }),
-                "Create New Profile"
-              ]
-            }
-          ),
-          onManageClick && /* @__PURE__ */ jsxs4(
-            DropdownMenuItem,
-            {
-              onClick: onManageClick,
-              className: "text-muted-foreground",
-              children: [
-                /* @__PURE__ */ jsx4(Settings, { className: "mr-2 h-4 w-4" }),
-                "Manage Profiles"
-              ]
-            }
-          )
-        ] })
-      ] })
-    ] })
-  ] });
-}
-function ProfileComparison({
-  profiles,
-  className
-}) {
-  const profilesWithMetrics = profiles.filter(
-    (p) => p.metrics && p.metrics.total_runs > 0
-  );
-  if (profilesWithMetrics.length === 0) {
-    return null;
-  }
-  const bestSuccess = profilesWithMetrics.reduce(
-    (best, p) => (p.metrics?.success_rate ?? 0) > (best.metrics?.success_rate ?? 0) ? p : best
-  );
-  const fastestProfile = profilesWithMetrics.reduce(
-    (best, p) => (p.metrics?.avg_duration_ms ?? Number.POSITIVE_INFINITY) < (best.metrics?.avg_duration_ms ?? Number.POSITIVE_INFINITY) ? p : best
-  );
-  return /* @__PURE__ */ jsxs4("div", { className: `rounded-lg border border-border p-4 ${className ?? ""}`, children: [
-    /* @__PURE__ */ jsx4("h4", { className: "mb-3 font-medium text-sm", children: "Profile Performance" }),
-    /* @__PURE__ */ jsx4("div", { className: "space-y-3", children: profilesWithMetrics.map((profile) => {
-      const isBestSuccess = profile.id === bestSuccess.id;
-      const isFastest = profile.id === fastestProfile.id;
-      return /* @__PURE__ */ jsxs4(
-        "div",
-        {
-          className: "flex items-center justify-between gap-4",
-          children: [
-            /* @__PURE__ */ jsxs4("div", { className: "flex items-center gap-2", children: [
-              /* @__PURE__ */ jsx4("span", { className: "font-medium", children: profile.name }),
-              isBestSuccess && /* @__PURE__ */ jsx4(Badge, { className: "border-0 bg-green-500/10 text-green-400 text-xs", children: "Best Success" }),
-              isFastest && !isBestSuccess && /* @__PURE__ */ jsx4(Badge, { className: "border-0 bg-blue-500/10 text-blue-400 text-xs", children: "Fastest" })
-            ] }),
-            /* @__PURE__ */ jsxs4("div", { className: "flex items-center gap-4 text-sm", children: [
-              /* @__PURE__ */ jsxs4("span", { children: [
-                /* @__PURE__ */ jsx4("span", { className: "text-muted-foreground", children: "Success:" }),
-                " ",
-                /* @__PURE__ */ jsxs4(
-                  "span",
-                  {
-                    className: (profile.metrics?.success_rate ?? 0) >= 80 ? "text-green-400" : (profile.metrics?.success_rate ?? 0) >= 50 ? "text-yellow-400" : "text-red-400",
-                    children: [
-                      profile.metrics?.success_rate.toFixed(0),
-                      "%"
-                    ]
-                  }
-                )
-              ] }),
-              /* @__PURE__ */ jsxs4("span", { children: [
-                /* @__PURE__ */ jsx4("span", { className: "text-muted-foreground", children: "Avg:" }),
-                " ",
-                ((profile.metrics?.avg_duration_ms ?? 0) / 1e3).toFixed(1),
-                "s"
-              ] }),
-              /* @__PURE__ */ jsxs4("span", { className: "text-muted-foreground", children: [
-                profile.metrics?.total_runs,
-                " runs"
-              ] })
-            ] })
-          ]
-        },
-        profile.id
-      );
-    }) })
-  ] });
-}
-
-// src/dashboard/variant-list.tsx
-import {
-  Check as Check2,
-  CheckCircle2,
-  Clock,
-  ExternalLink,
-  Loader2,
-  Timer,
-  X,
-  XCircle
-} from "lucide-react";
-import { jsx as jsx5, jsxs as jsxs5 } from "react/jsx-runtime";
-var statusConfig = {
-  pending: {
-    icon: Clock,
-    color: "text-yellow-400",
-    bg: "bg-yellow-500/10",
-    label: "Pending",
-    animate: false
-  },
-  running: {
-    icon: Loader2,
-    color: "text-blue-400",
-    bg: "bg-blue-500/10",
-    label: "Running",
-    animate: true
-  },
-  completed: {
-    icon: CheckCircle2,
-    color: "text-green-400",
-    bg: "bg-green-500/10",
-    label: "Completed",
-    animate: false
-  },
-  failed: {
-    icon: XCircle,
-    color: "text-red-400",
-    bg: "bg-red-500/10",
-    label: "Failed",
-    animate: false
-  },
-  cancelled: {
-    icon: XCircle,
-    color: "text-gray-400",
-    bg: "bg-gray-500/10",
-    label: "Cancelled",
-    animate: false
-  }
-};
-var outcomeConfig = {
-  pending_review: {
-    color: "text-amber-400",
-    bg: "bg-amber-500/10",
-    label: "Pending Review"
-  },
-  accepted: {
-    color: "text-green-400",
-    bg: "bg-green-500/10",
-    label: "Accepted"
-  },
-  rejected: {
-    color: "text-red-400",
-    bg: "bg-red-500/10",
-    label: "Rejected"
-  },
-  merged_with_conflicts: {
-    color: "text-orange-400",
-    bg: "bg-orange-500/10",
-    label: "Merged (conflicts)"
-  },
-  expired: {
-    color: "text-gray-400",
-    bg: "bg-gray-500/10",
-    label: "Expired"
-  }
-};
-function VariantList({
-  variants,
-  selectedId,
-  onSelect,
-  onAccept,
-  onReject,
-  isActioning,
-  className
-}) {
-  return /* @__PURE__ */ jsx5("div", { className: `space-y-3 ${className || ""}`, children: variants.map((variant) => {
-    const status = statusConfig[variant.status];
-    const StatusIcon = status.icon;
-    const isSelected = variant.id === selectedId;
-    return /* @__PURE__ */ jsxs5(
-      "div",
-      {
-        className: `cursor-pointer rounded-lg border p-4 transition-colors ${isSelected ? "border-blue-500 bg-blue-500/5" : "border-border hover:border-muted-foreground/50"}`,
-        onClick: () => onSelect?.(variant.id),
-        children: [
-          /* @__PURE__ */ jsxs5("div", { className: "flex items-center justify-between", children: [
-            /* @__PURE__ */ jsxs5("div", { className: "flex items-center gap-3", children: [
-              /* @__PURE__ */ jsxs5(Badge, { className: `${status.bg} ${status.color} border-0`, children: [
-                /* @__PURE__ */ jsx5(
-                  StatusIcon,
-                  {
-                    className: `mr-1 h-3 w-3 ${status.animate ? "animate-spin" : ""}`
-                  }
-                ),
-                status.label
-              ] }),
-              /* @__PURE__ */ jsx5("span", { className: "font-medium", children: variant.label }),
-              variant.sublabel && /* @__PURE__ */ jsxs5("span", { className: "text-muted-foreground text-sm", children: [
-                "(",
-                variant.sublabel,
-                ")"
-              ] }),
-              variant.durationMs && /* @__PURE__ */ jsxs5("span", { className: "flex items-center gap-1 text-muted-foreground text-sm", children: [
-                /* @__PURE__ */ jsx5(Timer, { className: "h-3 w-3" }),
-                (variant.durationMs / 1e3).toFixed(2),
-                "s"
-              ] })
-            ] }),
-            /* @__PURE__ */ jsxs5("div", { className: "flex items-center gap-2", children: [
-              variant.outcome && /* @__PURE__ */ jsx5(
-                Badge,
-                {
-                  className: `${outcomeConfig[variant.outcome].bg} ${outcomeConfig[variant.outcome].color} border-0`,
-                  children: outcomeConfig[variant.outcome].label
-                }
-              ),
-              variant.status === "completed" && variant.outcome === "pending_review" && onAccept && onReject && /* @__PURE__ */ jsxs5("div", { className: "flex items-center gap-2", children: [
-                /* @__PURE__ */ jsxs5(
-                  Button,
-                  {
-                    variant: "outline",
-                    size: "sm",
-                    className: "text-green-400 hover:bg-green-500/10",
-                    onClick: (e) => {
-                      e.stopPropagation();
-                      onAccept(variant.id);
-                    },
-                    disabled: isActioning === variant.id,
-                    children: [
-                      /* @__PURE__ */ jsx5(Check2, { className: "mr-1 h-4 w-4" }),
-                      "Accept"
-                    ]
-                  }
-                ),
-                /* @__PURE__ */ jsxs5(
-                  Button,
-                  {
-                    variant: "outline",
-                    size: "sm",
-                    className: "text-red-400 hover:bg-red-500/10",
-                    onClick: (e) => {
-                      e.stopPropagation();
-                      onReject(variant.id);
-                    },
-                    disabled: isActioning === variant.id,
-                    children: [
-                      /* @__PURE__ */ jsx5(X, { className: "mr-1 h-4 w-4" }),
-                      "Reject"
-                    ]
-                  }
-                )
-              ] }),
-              variant.detailsUrl && /* @__PURE__ */ jsx5(
-                Button,
-                {
-                  variant: "ghost",
-                  size: "sm",
-                  className: "text-muted-foreground",
-                  onClick: (e) => {
-                    e.stopPropagation();
-                    window.open(variant.detailsUrl, "_blank");
-                  },
-                  children: /* @__PURE__ */ jsx5(ExternalLink, { className: "h-4 w-4" })
-                }
-              )
-            ] })
-          ] }),
-          variant.error && /* @__PURE__ */ jsx5("p", { className: "mt-2 text-red-400 text-sm", children: variant.error }),
-          variant.summary && /* @__PURE__ */ jsx5("p", { className: "mt-2 line-clamp-2 text-muted-foreground text-sm", children: variant.summary })
-        ]
-      },
-      variant.id
-    );
-  }) });
-}
-
-export {
-  useTheme,
-  ThemeToggle,
-  DashboardLayout,
-  BackendSelector,
-  ProfileSelector,
-  ProfileComparison,
-  VariantList
-};