@tangle-network/sandbox-ui 0.14.0 → 0.15.2

package/dist/pages.js

@@ -1,47 +1,20 @@
-import {
-  Dialog,
-  DialogContent,
-  DialogDescription,
-  DialogFooter,
-  DialogHeader,
-  DialogTitle
-} from "./chunk-US6JKJKH.js";
-import {
-  Tabs,
-  TabsContent,
-  TabsList,
-  TabsTrigger
-} from "./chunk-Q56BYXQF.js";
-import {
-  EmptyState,
-  Input
-} from "./chunk-MA7YKRUP.js";
-import {
-  InfoPanel,
-  TemplateCard
-} from "./chunk-VX3XOUEB.js";
 import {
   BillingDashboard,
+  InfoPanel,
+  ModelPicker,
   PricingPage,
-  UsageChart
-} from "./chunk-QMU2PWOU.js";
-import {
-  Skeleton,
-  SkeletonCard
-} from "./chunk-66EZOYZR.js";
-import {
-  Badge,
-  Card
-} from "./chunk-ZMNSRDMH.js";
-import {
-  Button
-} from "./chunk-MKTSMWVD.js";
+  TemplateCard,
+  UsageChart,
+  canonicalModelId
+} from "./chunk-ENMWGVDL.js";
 import {
   cn
-} from "./chunk-RQHJBTEU.js";
+} from "./chunk-EI44GEQ5.js";
 
 // src/pages/billing-page.tsx
 import * as React from "react";
+import { Skeleton, SkeletonCard } from "@tangle-network/ui/primitives";
+import { Tabs, TabsContent, TabsList, TabsTrigger } from "@tangle-network/ui/primitives";
 import { jsx, jsxs } from "react/jsx-runtime";
 var defaultBillingData = {
   subscription: null,
@@ -316,10 +289,6 @@ var VALID_DRIVERS = /* @__PURE__ */ new Set([
   "firecracker",
   "tangle"
 ]);
-var DEFAULT_MODEL_OPTIONS = [
-  { value: "claude-sonnet", label: "Claude Sonnet 4.6 (Highly Capable)" }
-];
-var DEFAULT_MODEL_TIER = DEFAULT_MODEL_OPTIONS[0]?.value ?? "claude-sonnet";
 var STACK_DISPLAY = {
   universal: {
     name: "Default",
@@ -482,7 +451,7 @@ function ProvisioningWizard({
   skipToReview,
   onLoadStartupScripts,
   resourceLimits,
-  modelOptions,
+  models,
   pricingRates,
   planTiers
 }) {
@@ -568,23 +537,17 @@ function ProvisioningWizard({
       (prev) => snapSliderValue(prev, STORAGE_MIN, storageMax, storageStep)
     );
   }, [cpuMax, ramMax, storageMax, cpuStep, ramStep, storageStep]);
-  const [modelTier, setModelTier] = React2.useState(
-    dc?.modelTier ?? DEFAULT_MODEL_TIER
-  );
+  const [modelTier, setModelTier] = React2.useState(dc?.modelTier ?? "");
   const [systemPrompt, setSystemPrompt] = React2.useState(
     dc?.systemPrompt ?? ""
   );
   React2.useEffect(() => {
-    const options = modelOptions ?? DEFAULT_MODEL_OPTIONS;
-    if (options.length === 0) return;
-    const currentOption = options.find((o) => o.value === modelTier);
-    if (!currentOption || currentOption.disabled) {
-      const firstAvailable = options.find((o) => !o.disabled);
-      if (firstAvailable && firstAvailable.value !== modelTier) {
-        setModelTier(firstAvailable.value);
-      }
-    }
-  }, [modelOptions, modelTier]);
+    if (!models || models.length === 0) return;
+    const ids = models.map(canonicalModelId);
+    if (ids.includes(modelTier)) return;
+    const next = ids[0];
+    if (next && next !== modelTier) setModelTier(next);
+  }, [models, modelTier]);
   const [name, setName] = React2.useState(dc?.name ?? "");
   const [gitUrl, setGitUrl] = React2.useState(dc?.gitUrl ?? "");
   const [envVars, setEnvVars] = React2.useState(dc?.envVars ?? [{ key: "", value: "" }]);
@@ -784,11 +747,8 @@ function ProvisioningWizard({
                 setStorageGB(
                   snapSliderValue(128, STORAGE_MIN, storageMax, storageStep)
                 );
-                const resetOptions = modelOptions ?? DEFAULT_MODEL_OPTIONS;
-                const firstAvailable = resetOptions.find(
-                  (o) => !o.disabled
-                );
-                setModelTier(firstAvailable?.value ?? DEFAULT_MODEL_TIER);
+                const first = models?.[0];
+                setModelTier(first ? canonicalModelId(first) : "");
                 setSystemPrompt("");
                 setName("");
                 setGitUrl("");
@@ -983,27 +943,17 @@ function ProvisioningWizard({
               /* @__PURE__ */ jsxs2("div", { children: [
                 /* @__PURE__ */ jsx2("label", { className: "block font-label text-xs font-bold uppercase tracking-widest text-muted-foreground mb-2", children: "Model Engine" }),
                 /* @__PURE__ */ jsx2(
-                  "select",
+                  ModelPicker,
                   {
+                    label: "",
                     value: modelTier,
-                    onChange: (e) => setModelTier(e.target.value),
-                    disabled: modelOptions && modelOptions.filter((o) => !o.disabled).length === 0,
-                    className: "w-full bg-card border border-border rounded-xl h-12 px-4 font-bold text-sm text-foreground focus:outline-none focus:ring-2 focus:ring-primary focus:border-transparent appearance-none disabled:opacity-50 disabled:cursor-not-allowed",
-                    children: (modelOptions ?? DEFAULT_MODEL_OPTIONS).map(
-                      (option) => /* @__PURE__ */ jsx2(
-                        "option",
-                        {
-                          value: option.value,
-                          disabled: option.disabled,
-                          className: "bg-gray-900",
-                          children: option.label
-                        },
-                        option.value
-                      )
-                    )
+                    onChange: setModelTier,
+                    models: models ?? [],
+                    loading: !models,
+                    disabled: !models || models.length === 0,
+                    triggerClassName: "rounded-xl h-12 px-4 font-bold"
                   }
-                ),
-                modelOptions && modelOptions.length > 0 && modelOptions.every((o) => o.disabled) && /* @__PURE__ */ jsx2("p", { className: "text-xs text-muted-foreground mt-2", children: "All model options are currently disabled. Please upgrade your plan or contact support." })
+                )
               ] }),
               /* @__PURE__ */ jsxs2("div", { children: [
                 /* @__PURE__ */ jsx2("label", { className: "block font-label text-xs font-bold uppercase tracking-widest text-muted-foreground mb-2", children: "Core Directives (System Prompt)" }),
@@ -1363,7 +1313,7 @@ function ProvisioningWizard({
             {
               type: "button",
               onClick: handleDeploy,
-              disabled: isDeploying || !selectedEnv,
+              disabled: isDeploying || !selectedEnv || !modelTier && !bare,
               className: "w-full h-12 bg-primary text-primary-foreground font-extrabold text-sm rounded-2xl tracking-wide shadow-md disabled:opacity-50 hover:brightness-110 active:scale-[0.98] transition-all",
               children: isDeploying ? /* @__PURE__ */ jsxs2("span", { className: "flex items-center justify-center gap-2", children: [
                 /* @__PURE__ */ jsx2(Loader2, { className: "h-4 w-4 animate-spin" }),
@@ -1385,7 +1335,7 @@ function ProvisioningWizard({
           {
             type: "button",
             onClick: handleDeploy,
-            disabled: isDeploying || !selectedEnv,
+            disabled: isDeploying || !selectedEnv || !modelTier && !bare,
             className: "w-full h-12 bg-primary text-primary-foreground font-extrabold text-sm rounded-2xl tracking-wide shadow-md disabled:opacity-50 hover:brightness-110 active:scale-[0.98] transition-all",
             children: isDeploying ? /* @__PURE__ */ jsxs2("span", { className: "flex items-center justify-center gap-2", children: [
               /* @__PURE__ */ jsx2(Loader2, { className: "h-4 w-4 animate-spin" }),
@@ -1400,6 +1350,7 @@ function ProvisioningWizard({
 
 // src/pages/pricing-page.tsx
 import * as React3 from "react";
+import { Skeleton as Skeleton2, SkeletonCard as SkeletonCard2 } from "@tangle-network/ui/primitives";
 import { ChevronDown } from "lucide-react";
 import { jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
 async function fetchTiersFromApi(apiBasePath) {
@@ -1493,13 +1444,13 @@ function StandalonePricingPage({
     ] }),
     state.loading ? /* @__PURE__ */ jsxs3("div", { className: "space-y-8", children: [
       /* @__PURE__ */ jsxs3("div", { className: "flex items-center justify-center gap-4", children: [
-        /* @__PURE__ */ jsx3(Skeleton, { className: "h-10 w-24" }),
-        /* @__PURE__ */ jsx3(Skeleton, { className: "h-10 w-24" })
+        /* @__PURE__ */ jsx3(Skeleton2, { className: "h-10 w-24" }),
+        /* @__PURE__ */ jsx3(Skeleton2, { className: "h-10 w-24" })
       ] }),
       /* @__PURE__ */ jsxs3("div", { className: "grid grid-cols-1 gap-6 lg:grid-cols-3", children: [
-        /* @__PURE__ */ jsx3(SkeletonCard, { className: "h-[500px]" }),
-        /* @__PURE__ */ jsx3(SkeletonCard, { className: "h-[500px]" }),
-        /* @__PURE__ */ jsx3(SkeletonCard, { className: "h-[500px]" })
+        /* @__PURE__ */ jsx3(SkeletonCard2, { className: "h-[500px]" }),
+        /* @__PURE__ */ jsx3(SkeletonCard2, { className: "h-[500px]" }),
+        /* @__PURE__ */ jsx3(SkeletonCard2, { className: "h-[500px]" })
       ] })
     ] }) : state.error ? /* @__PURE__ */ jsxs3("div", { className: "flex flex-col items-center justify-center space-y-4 rounded-xl border border-destructive/20 bg-destructive/5 p-8 text-center", children: [
       /* @__PURE__ */ jsx3("p", { className: "text-destructive text-sm font-medium", children: state.error }),
@@ -1549,6 +1500,19 @@ import {
   Trash2 as Trash22
 } from "lucide-react";
 import * as React4 from "react";
+import { Button } from "@tangle-network/ui/primitives";
+import { Badge } from "@tangle-network/ui/primitives";
+import { Card } from "@tangle-network/ui/primitives";
+import {
+  Dialog,
+  DialogContent,
+  DialogDescription,
+  DialogFooter,
+  DialogHeader,
+  DialogTitle
+} from "@tangle-network/ui/primitives";
+import { EmptyState } from "@tangle-network/ui/primitives";
+import { Input } from "@tangle-network/ui/primitives";
 import { jsx as jsx4, jsxs as jsxs4 } from "react/jsx-runtime";
 var TIER_LIMITS = {
   free: 3,
@@ -2177,6 +2141,14 @@ function ProfileDetailDialog({
 // src/pages/secrets-page.tsx
 import * as React5 from "react";
 import { Lock, Plus as Plus3, Trash2 as Trash23, Eye, EyeOff, AlertCircle as AlertCircle2, Key, Shield, CheckCircle, Users, ArrowRight } from "lucide-react";
+import {
+  Dialog as Dialog2,
+  DialogContent as DialogContent2,
+  DialogDescription as DialogDescription2,
+  DialogFooter as DialogFooter2,
+  DialogHeader as DialogHeader2,
+  DialogTitle as DialogTitle2
+} from "@tangle-network/ui/primitives";
 import { jsx as jsx5, jsxs as jsxs5 } from "react/jsx-runtime";
 function SecretsPage({ apiClient, className, teamSecretsHint }) {
   const [secrets, setSecrets] = React5.useState([]);
@@ -2318,7 +2290,7 @@ function SecretsPage({ apiClient, className, teamSecretsHint }) {
       /* @__PURE__ */ jsx5(AlertCircle2, { className: "h-5 w-5 text-destructive shrink-0" }),
       /* @__PURE__ */ jsx5("p", { className: "text-destructive text-sm font-medium", children: error })
     ] }),
-    /* @__PURE__ */ jsx5(Dialog, { open: isCreateOpen, onOpenChange: (open) => {
+    /* @__PURE__ */ jsx5(Dialog2, { open: isCreateOpen, onOpenChange: (open) => {
       if (!open) {
         setIsCreateOpen(false);
         setNewName("");
@@ -2326,10 +2298,10 @@ function SecretsPage({ apiClient, className, teamSecretsHint }) {
         setCreateError(null);
         setShowValue(false);
       }
-    }, children: /* @__PURE__ */ jsxs5(DialogContent, { className: "max-w-md", children: [
-      /* @__PURE__ */ jsxs5(DialogHeader, { children: [
-        /* @__PURE__ */ jsx5(DialogTitle, { children: "Create Secret" }),
-        /* @__PURE__ */ jsx5(DialogDescription, { children: "Secrets are automatically exposed as environment variables across all your new sandboxes." })
+    }, children: /* @__PURE__ */ jsxs5(DialogContent2, { className: "max-w-md", children: [
+      /* @__PURE__ */ jsxs5(DialogHeader2, { children: [
+        /* @__PURE__ */ jsx5(DialogTitle2, { children: "Create Secret" }),
+        /* @__PURE__ */ jsx5(DialogDescription2, { children: "Secrets are automatically exposed as environment variables across all your new sandboxes." })
       ] }),
       /* @__PURE__ */ jsxs5(
         "form",
@@ -2390,7 +2362,7 @@ function SecretsPage({ apiClient, className, teamSecretsHint }) {
         }
       ),
       createError && /* @__PURE__ */ jsx5("p", { className: "mt-3 text-sm text-destructive", children: createError }),
-      /* @__PURE__ */ jsxs5(DialogFooter, { children: [
+      /* @__PURE__ */ jsxs5(DialogFooter2, { children: [
         /* @__PURE__ */ jsx5(
           "button",
           {
@@ -2417,18 +2389,18 @@ function SecretsPage({ apiClient, className, teamSecretsHint }) {
         )
       ] })
     ] }) }),
-    /* @__PURE__ */ jsx5(Dialog, { open: !!deleteTarget, onOpenChange: (open) => {
+    /* @__PURE__ */ jsx5(Dialog2, { open: !!deleteTarget, onOpenChange: (open) => {
       if (!open) setDeleteTarget(null);
-    }, children: /* @__PURE__ */ jsxs5(DialogContent, { className: "max-w-sm", children: [
-      /* @__PURE__ */ jsxs5(DialogHeader, { children: [
-        /* @__PURE__ */ jsx5(DialogTitle, { children: "Delete Secret?" }),
-        /* @__PURE__ */ jsxs5(DialogDescription, { children: [
+    }, children: /* @__PURE__ */ jsxs5(DialogContent2, { className: "max-w-sm", children: [
+      /* @__PURE__ */ jsxs5(DialogHeader2, { children: [
+        /* @__PURE__ */ jsx5(DialogTitle2, { children: "Delete Secret?" }),
+        /* @__PURE__ */ jsxs5(DialogDescription2, { children: [
           "This will permanently delete ",
           /* @__PURE__ */ jsx5("span", { className: "font-mono font-bold text-foreground", children: deleteTarget }),
           ". Sandboxes using this secret will lose access to it."
         ] })
       ] }),
-      /* @__PURE__ */ jsxs5(DialogFooter, { children: [
+      /* @__PURE__ */ jsxs5(DialogFooter2, { children: [
         /* @__PURE__ */ jsx5(
           "button",
           {
@@ -2524,6 +2496,7 @@ function SecretsPage({ apiClient, className, teamSecretsHint }) {
 
 // src/pages/templates-page.tsx
 import { Layers as Layers2 } from "lucide-react";
+import { Skeleton as Skeleton3 } from "@tangle-network/ui/primitives";
 import { jsx as jsx6, jsxs as jsxs6 } from "react/jsx-runtime";
 function TemplatesPage({ templates, loading = false, onUseTemplate, className }) {
   return /* @__PURE__ */ jsxs6("div", { className: cn("space-y-8", className), children: [
@@ -2531,7 +2504,7 @@ function TemplatesPage({ templates, loading = false, onUseTemplate, className })
       /* @__PURE__ */ jsx6("h1", { className: "font-bold text-3xl text-foreground", children: "Templates" }),
       /* @__PURE__ */ jsx6("p", { className: "mt-1 text-muted-foreground", children: "Pre-configured environments to get started quickly" })
     ] }),
-    loading || !templates ? /* @__PURE__ */ jsx6("div", { className: "grid grid-cols-1 gap-5 sm:grid-cols-2 lg:grid-cols-3", children: Array.from({ length: 6 }).map((_, i) => /* @__PURE__ */ jsx6(Skeleton, { className: "h-56 rounded-2xl" }, i)) }) : templates.length === 0 ? /* @__PURE__ */ jsxs6("div", { className: "rounded-2xl border border-border bg-card p-16 text-center", children: [
+    loading || !templates ? /* @__PURE__ */ jsx6("div", { className: "grid grid-cols-1 gap-5 sm:grid-cols-2 lg:grid-cols-3", children: Array.from({ length: 6 }).map((_, i) => /* @__PURE__ */ jsx6(Skeleton3, { className: "h-56 rounded-2xl" }, i)) }) : templates.length === 0 ? /* @__PURE__ */ jsxs6("div", { className: "rounded-2xl border border-border bg-card p-16 text-center", children: [
       /* @__PURE__ */ jsx6(Layers2, { className: "mx-auto mb-3 h-10 w-10 text-muted-foreground" }),
       /* @__PURE__ */ jsx6("p", { className: "text-sm font-medium text-foreground mb-1", children: "No templates available" }),
       /* @__PURE__ */ jsx6("p", { className: "text-sm text-muted-foreground", children: "Check back later for pre-configured environments." })
@@ -2567,6 +2540,14 @@ import {
   MemoryStick,
   Layers as Layers3
 } from "lucide-react";
+import {
+  Dialog as Dialog3,
+  DialogContent as DialogContent3,
+  DialogDescription as DialogDescription3,
+  DialogFooter as DialogFooter3,
+  DialogHeader as DialogHeader3,
+  DialogTitle as DialogTitle3
+} from "@tangle-network/ui/primitives";
 import { jsx as jsx7, jsxs as jsxs7 } from "react/jsx-runtime";
 var SCRIPT_TYPE_META = {
   bash: {
@@ -2937,7 +2918,7 @@ function StartupScriptsPage({ apiClient, className }) {
       /* @__PURE__ */ jsx7(AlertCircle3, { className: "h-5 w-5 shrink-0 text-destructive" }),
       /* @__PURE__ */ jsx7("p", { className: "text-sm font-medium text-destructive", children: error })
     ] }),
-    /* @__PURE__ */ jsx7(Dialog, { open: isDialogOpen, onOpenChange: setIsDialogOpen, children: /* @__PURE__ */ jsxs7(DialogContent, { className: "max-w-2xl max-h-[90vh] overflow-y-auto", children: [
+    /* @__PURE__ */ jsx7(Dialog3, { open: isDialogOpen, onOpenChange: setIsDialogOpen, children: /* @__PURE__ */ jsxs7(DialogContent3, { className: "max-w-2xl max-h-[90vh] overflow-y-auto", children: [
       dialogStep === "picker" && /* @__PURE__ */ jsxs7(
         "div",
         {
@@ -2946,9 +2927,9 @@ function StartupScriptsPage({ apiClient, className }) {
             transitionDir === "back" ? "slide-in-from-left-4" : "slide-in-from-right-4"
           ),
           children: [
-            /* @__PURE__ */ jsxs7(DialogHeader, { children: [
-              /* @__PURE__ */ jsx7(DialogTitle, { children: "New Startup Script" }),
-              /* @__PURE__ */ jsx7(DialogDescription, { children: "Start from a template or create a blank script." })
+            /* @__PURE__ */ jsxs7(DialogHeader3, { children: [
+              /* @__PURE__ */ jsx7(DialogTitle3, { children: "New Startup Script" }),
+              /* @__PURE__ */ jsx7(DialogDescription3, { children: "Start from a template or create a blank script." })
             ] }),
             /* @__PURE__ */ jsxs7("div", { className: "space-y-4 py-2", children: [
               /* @__PURE__ */ jsxs7("div", { children: [
@@ -3002,9 +2983,9 @@ function StartupScriptsPage({ apiClient, className }) {
             transitionDir === "forward" ? "slide-in-from-right-4" : "slide-in-from-left-4"
           ),
           children: [
-            /* @__PURE__ */ jsxs7(DialogHeader, { children: [
-              /* @__PURE__ */ jsx7(DialogTitle, { children: editingScript ? "Edit Script" : "Create Startup Script" }),
-              /* @__PURE__ */ jsx7(DialogDescription, { children: editingScript ? "Modify your startup script configuration." : "Define a shell script that runs when sandboxes start. Scripts execute before the AI agent." })
+            /* @__PURE__ */ jsxs7(DialogHeader3, { children: [
+              /* @__PURE__ */ jsx7(DialogTitle3, { children: editingScript ? "Edit Script" : "Create Startup Script" }),
+              /* @__PURE__ */ jsx7(DialogDescription3, { children: editingScript ? "Modify your startup script configuration." : "Define a shell script that runs when sandboxes start. Scripts execute before the AI agent." })
             ] }),
             /* @__PURE__ */ jsxs7("div", { className: "space-y-5 py-2", children: [
               /* @__PURE__ */ jsxs7("div", { children: [
@@ -3280,7 +3261,7 @@ function StartupScriptsPage({ apiClient, className }) {
                 /* @__PURE__ */ jsx7("p", { className: "text-sm text-destructive", children: formError })
               ] })
             ] }),
-            /* @__PURE__ */ jsxs7(DialogFooter, { className: "flex items-center justify-between sm:justify-between", children: [
+            /* @__PURE__ */ jsxs7(DialogFooter3, { className: "flex items-center justify-between sm:justify-between", children: [
               /* @__PURE__ */ jsx7("div", { children: !editingScript && /* @__PURE__ */ jsxs7(
                 "button",
                 {
@@ -3320,16 +3301,16 @@ function StartupScriptsPage({ apiClient, className }) {
         `form-${stepKey}`
       )
     ] }) }),
-    /* @__PURE__ */ jsx7(Dialog, { open: !!deleteTarget, onOpenChange: () => setDeleteTarget(null), children: /* @__PURE__ */ jsxs7(DialogContent, { className: "max-w-md", children: [
-      /* @__PURE__ */ jsxs7(DialogHeader, { children: [
-        /* @__PURE__ */ jsx7(DialogTitle, { children: "Delete Startup Script" }),
-        /* @__PURE__ */ jsxs7(DialogDescription, { children: [
+    /* @__PURE__ */ jsx7(Dialog3, { open: !!deleteTarget, onOpenChange: () => setDeleteTarget(null), children: /* @__PURE__ */ jsxs7(DialogContent3, { className: "max-w-md", children: [
+      /* @__PURE__ */ jsxs7(DialogHeader3, { children: [
+        /* @__PURE__ */ jsx7(DialogTitle3, { children: "Delete Startup Script" }),
+        /* @__PURE__ */ jsxs7(DialogDescription3, { children: [
           "Are you sure you want to delete \u201C",
           deleteTarget?.name,
           "\u201D? This action cannot be undone."
         ] })
       ] }),
-      /* @__PURE__ */ jsxs7(DialogFooter, { children: [
+      /* @__PURE__ */ jsxs7(DialogFooter3, { children: [
         /* @__PURE__ */ jsx7(
           "button",
           {
@@ -3574,7 +3555,6 @@ var CATEGORY_DEFAULTS = {
     cpuCores: 4,
     ramGB: 16,
     storageGB: 128,
-    modelTier: "claude-sonnet",
     systemPrompt: "You are a blockchain development assistant. Help with smart contract development, testing, and deployment. Follow security best practices and suggest gas optimizations where relevant.",
     bare: false
   },
@@ -3583,7 +3563,6 @@ var CATEGORY_DEFAULTS = {
     cpuCores: 8,
     ramGB: 32,
     storageGB: 256,
-    modelTier: "claude-sonnet",
     systemPrompt: "You are an AI/ML development assistant. Help with model training, data processing, and experiment management. Suggest efficient approaches for the available compute resources.",
     bare: false
   },
@@ -3592,7 +3571,6 @@ var CATEGORY_DEFAULTS = {
     cpuCores: 2,
     ramGB: 4,
     storageGB: 50,
-    modelTier: "claude-sonnet",
     systemPrompt: "You are a frontend development assistant. Help build modern, accessible, and performant user interfaces.",
     bare: false
   },
@@ -3601,7 +3579,6 @@ var CATEGORY_DEFAULTS = {
     cpuCores: 4,
     ramGB: 16,
     storageGB: 128,
-    modelTier: "claude-sonnet",
     systemPrompt: "You are an infrastructure and DevOps assistant. Help with service configuration, deployment, monitoring, and operational best practices.",
     bare: false
   },
@@ -3610,7 +3587,6 @@ var CATEGORY_DEFAULTS = {
     cpuCores: 4,
     ramGB: 16,
     storageGB: 128,
-    modelTier: "claude-sonnet",
     systemPrompt: "",
     bare: false
   }

package/dist/primitives.d.ts

@@ -1,54 +1,19 @@
-export { B as Button, a as ButtonProps, b as buttonVariants } from './button-CMQuQEW_.js';
-export { A as Avatar, a as AvatarFallback, b as AvatarImage, B as Badge, c as BadgeProps, C as Card, d as CardContent, e as CardDescription, f as CardFooter, g as CardHeader, h as CardTitle, D as Dialog, i as DialogClose, j as DialogContent, k as DialogDescription, l as DialogFooter, m as DialogHeader, n as DialogOverlay, o as DialogPortal, p as DialogTitle, q as DialogTrigger, r as DropZone, s as DropZoneProps, t as DropdownMenu, u as DropdownMenuCheckboxItem, v as DropdownMenuContent, w as DropdownMenuGroup, x as DropdownMenuItem, y as DropdownMenuLabel, z as DropdownMenuPortal, E as DropdownMenuRadioGroup, F as DropdownMenuRadioItem, G as DropdownMenuSeparator, H as DropdownMenuShortcut, I as DropdownMenuSub, J as DropdownMenuSubContent, K as DropdownMenuSubTrigger, L as DropdownMenuTrigger, M as EmptyState, N as EmptyStateProps, O as Input, P as InputProps, Q as Label, R as Logo, S as LogoProps, T as Progress, U as Select, V as SelectContent, W as SelectGroup, X as SelectItem, Y as SelectLabel, Z as SelectScrollDownButton, _ as SelectScrollUpButton, $ as SelectSeparator, a0 as SelectTrigger, a1 as SelectValue, a2 as SidebarDropZone, a3 as SidebarDropZoneProps, a4 as Skeleton, a5 as SkeletonCard, a6 as SkeletonTable, a7 as StatCard, a8 as StatCardProps, a9 as Switch, aa as Table, ab as TableBody, ac as TableCaption, ad as TableCell, ae as TableFooter, af as TableHead, ag as TableHeader, ah as TableRow, ai as Tabs, aj as TabsContent, ak as TabsList, al as TabsTrigger, am as TangleKnot, an as TerminalCursor, ao as TerminalDisplay, ap as TerminalInput, aq as TerminalLine, ar as Textarea, as as TextareaProps, at as Toast, au as ToastContainer, av as ToastProvider, aw as UploadFile, ax as UploadProgress, ay as UploadProgressProps, az as badgeVariants, aA as useToast } from './sidebar-drop-zone-tDBsuOH5.js';
+export { Avatar, AvatarFallback, AvatarImage, Badge, BadgeProps, Button, ButtonProps, Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, CodeBlock, CodeBlockProps, CopyButton, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, DropZone, DropZoneProps, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, EmptyState, EmptyStateProps, InlineCode, InlineCodeProps, Input, InputProps, Label, Progress, SegmentedControl, SegmentedControlOption, SegmentedControlProps, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, SidebarDropZone, SidebarDropZoneProps, Skeleton, SkeletonCard, SkeletonTable, StatCard, StatCardProps, Switch, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow, Tabs, TabsContent, TabsList, TabsTrigger, TerminalCursor, TerminalDisplay, TerminalInput, TerminalLine, Textarea, TextareaProps, ThemeToggle, Toast, ToastContainer, ToastProvider, UploadFile, UploadProgress, UploadProgressProps, badgeVariants, buttonVariants, useTheme, useToast } from '@tangle-network/ui/primitives';
 import * as react_jsx_runtime from 'react/jsx-runtime';
-import * as React from 'react';
-import 'class-variance-authority/types';
-import '@radix-ui/react-dialog';
-import 'class-variance-authority';
-import '@radix-ui/react-avatar';
-import '@radix-ui/react-dropdown-menu';
-import '@radix-ui/react-select';
-import '@radix-ui/react-tabs';
-import '@radix-ui/react-progress';
-import '@radix-ui/react-switch';
-import '@radix-ui/react-label';
 
-/**
- * Visually lightweight segmented control for single-value selection.
- *
- * Uses role="radiogroup" / role="radio" because this is a value-selector
- * with no associated panels — not a tab interface. Arrow keys navigate
- * between options (with wrapping), Home/End jump to first/last.
- *
- * **Accessibility:** Provide either `aria-label` or `aria-labelledby` — the
- * ARIA spec requires every radiogroup to have an accessible name. A dev-mode
- * console warning fires when both are omitted.
- *
- * Design rules baked into the default variant:
- *   - Only the SELECTED segment shows a surface colour + accent text.
- *   - Unselected segments have NO background — they're plain-text labels
- *     that darken on hover. This keeps the selected segment as the
- *     single visual anchor instead of the whole group competing with
- *     itself.
- */
-interface SegmentedControlOption<T extends string = string> {
-    value: T;
-    label: React.ReactNode;
-    /** Rendered right of the label, typically a count or status pill. */
-    adornment?: React.ReactNode;
+interface LogoProps {
+    variant?: "sandbox";
+    size?: "sm" | "md" | "lg" | "xl";
+    className?: string;
+    iconOnly?: boolean;
 }
-interface SegmentedControlProps<T extends string = string> extends Pick<React.HTMLAttributes<HTMLDivElement>, "id" | "className" | "aria-label" | "aria-labelledby"> {
-    value: T;
-    onValueChange: (value: T) => void;
-    options: SegmentedControlOption<T>[];
-    /**
-     * Layout:
-     *   - "row"   — horizontal pill bar (default, fits in a header region)
-     *   - "tabs"  — horizontal with a bottom border so the selected pill
-     *              reads as a classic tab (used on the Team page)
-     */
-    variant?: "row" | "tabs";
+declare function TangleKnot({ size, className }: {
+    size: number;
+    className?: string;
+}): react_jsx_runtime.JSX.Element;
+declare function Logo({ variant, size, className, iconOnly }: LogoProps): react_jsx_runtime.JSX.Element;
+declare namespace Logo {
+    var displayName: string;
 }
-declare function SegmentedControl<T extends string = string>({ value, onValueChange, options, variant, className, ...rest }: SegmentedControlProps<T>): react_jsx_runtime.JSX.Element;
 
-export { SegmentedControl, type SegmentedControlOption, type SegmentedControlProps };
+export { Logo, type LogoProps, TangleKnot };