@tangle-network/sandbox-ui 0.16.2 → 0.16.3

package/dist/globals.css

@@ -591,6 +591,9 @@
   .h-\[500px\] {
     height: 500px;
   }
+  .h-auto {
+    height: auto;
+  }
   .h-full {
     height: 100%;
   }
@@ -615,6 +618,9 @@
   .min-h-0 {
     min-height: calc(var(--spacing) * 0);
   }
+  .min-h-24 {
+    min-height: calc(var(--spacing) * 24);
+  }
   .min-h-\[2px\] {
     min-height: 2px;
   }

package/dist/pages.d.ts

@@ -59,6 +59,19 @@ interface PlanTierInfo {
     ramMaxGB: number;
     storageMaxGB: number;
 }
+interface SshKeyOption {
+    id: string;
+    name: string;
+    fingerprint: string;
+    keyType: string;
+}
+interface SshAccessConfig {
+    keys?: SshKeyOption[];
+    selectedKeyIds: string[];
+    inlinePublicKeys: string;
+    onSelectedKeyIdsChange: (keyIds: string[]) => void;
+    onInlinePublicKeysChange: (publicKeys: string) => void;
+}
 interface ProvisioningWizardProps {
     environments?: EnvironmentOption[];
     onLoadEnvironments?: () => Promise<EnvironmentEntry[]>;
@@ -107,6 +120,7 @@ interface ProvisioningWizardProps {
      * persistence (e.g. localStorage, account settings API).
      */
     onSetDefault?: (modelId: string) => void;
+    sshAccess?: SshAccessConfig;
     /** Real pricing rates from the API for accurate cost calculation */
     pricingRates?: PricingRates;
     /**
@@ -141,7 +155,7 @@ interface ProvisioningConfig {
     startupScriptIds?: string[];
 }
 declare function resolveEnvironment(env: EnvironmentEntry): EnvironmentOption;
-declare function ProvisioningWizard({ environments: environmentsProp, onLoadEnvironments, onSubmit, onBack, className, variant, defaultEnvironment, defaultConfig, skipToReview, onLoadStartupScripts, resourceLimits, models, popular, defaultModel, onSetDefault, pricingRates, planTiers, }: ProvisioningWizardProps): react_jsx_runtime.JSX.Element;
+declare function ProvisioningWizard({ environments: environmentsProp, onLoadEnvironments, onSubmit, onBack, className, variant, defaultEnvironment, defaultConfig, skipToReview, onLoadStartupScripts, resourceLimits, models, popular, defaultModel, onSetDefault, sshAccess, pricingRates, planTiers, }: ProvisioningWizardProps): react_jsx_runtime.JSX.Element;
 
 type ProductVariant = "sandbox";
 interface StandalonePricingPageProps {
@@ -307,4 +321,4 @@ type TemplateCategory = "blockchain" | "ai-ml" | "frontend" | "infrastructure" |
 type TemplatePreset = Omit<ProvisioningConfig, "name" | "gitUrl" | "envVars" | "driver" | "startupScriptIds" | "modelTier">;
 declare function getPresetForTemplate(id: string): TemplatePreset;
 
-export { BillingPage, type BillingPageData, type BillingPageProps, type EnvironmentEntry, type EnvironmentOption, ModelInfo, type PlanTierInfo, type PricingRates, PricingTier, type ProductVariant$1 as ProductVariant, type Profile, type ProfileFormData, type ProfileMetrics, ProfilesPage, type ProfilesPageProps, type ProvisioningConfig, ProvisioningWizard, type ProvisioningWizardProps, type ResourceLimits, type ScriptType, type Secret, type SecretsApiClient, SecretsPage, type SecretsPageProps, StandalonePricingPage, type StandalonePricingPageProps, type StartupScript, type StartupScriptEntry, type StartupScriptFormData, type StartupScriptsApiClient, StartupScriptsPage, type StartupScriptsPageProps, type TemplateCategory, type TemplatePreset, TemplatesPage, type TemplatesPageProps, getPresetForTemplate, resolveEnvironment };
+export { BillingPage, type BillingPageData, type BillingPageProps, type EnvironmentEntry, type EnvironmentOption, ModelInfo, type PlanTierInfo, type PricingRates, PricingTier, type ProductVariant$1 as ProductVariant, type Profile, type ProfileFormData, type ProfileMetrics, ProfilesPage, type ProfilesPageProps, type ProvisioningConfig, ProvisioningWizard, type ProvisioningWizardProps, type ResourceLimits, type ScriptType, type Secret, type SecretsApiClient, SecretsPage, type SecretsPageProps, type SshAccessConfig, type SshKeyOption, StandalonePricingPage, type StandalonePricingPageProps, type StartupScript, type StartupScriptEntry, type StartupScriptFormData, type StartupScriptsApiClient, StartupScriptsPage, type StartupScriptsPageProps, type TemplateCategory, type TemplatePreset, TemplatesPage, type TemplatesPageProps, getPresetForTemplate, resolveEnvironment };

package/dist/pages.js

@@ -7,6 +7,11 @@ import {
   UsageChart,
   canonicalModelId
 } from "./chunk-27X3DWMO.js";
+import {
+  Badge,
+  Button,
+  Textarea
+} from "./chunk-7ZA5SEK3.js";
 import {
   cn
 } from "./chunk-EI44GEQ5.js";
@@ -439,6 +444,59 @@ function computeHourlyCost(cpu, ram, storage, rates) {
     total: Math.max(floor, lineSum)
   };
 }
+function SshAccessStep({ config }) {
+  const keys = config.keys ?? [];
+  const inlineKeyCount = config.inlinePublicKeys.split(/\r?\n/).map((key) => key.trim()).filter(Boolean).length;
+  const totalKeyCount = config.selectedKeyIds.length + inlineKeyCount;
+  return /* @__PURE__ */ jsxs2("div", { className: "space-y-4", children: [
+    /* @__PURE__ */ jsxs2("div", { className: "flex items-start justify-between gap-4", children: [
+      /* @__PURE__ */ jsxs2("div", { children: [
+        /* @__PURE__ */ jsx2("p", { className: "font-medium text-foreground text-sm", children: "SSH Access" }),
+        /* @__PURE__ */ jsx2("p", { className: "mt-1 text-muted-foreground text-xs", children: "Select stored keys or paste public keys for authorized_keys." })
+      ] }),
+      /* @__PURE__ */ jsxs2(Badge, { variant: "outline", children: [
+        totalKeyCount,
+        " key",
+        totalKeyCount === 1 ? "" : "s"
+      ] })
+    ] }),
+    keys.length > 0 && /* @__PURE__ */ jsx2("div", { className: "grid gap-2 sm:grid-cols-2", children: keys.map((key) => {
+      const selected = config.selectedKeyIds.includes(key.id);
+      return /* @__PURE__ */ jsx2(
+        Button,
+        {
+          type: "button",
+          variant: selected ? "sandbox" : "outline",
+          className: "h-auto justify-start p-3 text-left",
+          "aria-pressed": selected,
+          onClick: () => {
+            config.onSelectedKeyIdsChange(
+              selected ? config.selectedKeyIds.filter((id) => id !== key.id) : [...config.selectedKeyIds, key.id]
+            );
+          },
+          children: /* @__PURE__ */ jsxs2("span", { className: "min-w-0", children: [
+            /* @__PURE__ */ jsx2("span", { className: "block font-medium text-foreground", children: key.name }),
+            /* @__PURE__ */ jsxs2("span", { className: "block truncate font-mono text-muted-foreground text-xs", children: [
+              key.keyType,
+              " \xB7 ",
+              key.fingerprint
+            ] })
+          ] })
+        },
+        key.id
+      );
+    }) }),
+    /* @__PURE__ */ jsx2(
+      Textarea,
+      {
+        className: "min-h-24 font-mono text-xs",
+        placeholder: "Paste one public key per line",
+        value: config.inlinePublicKeys,
+        onChange: (event) => config.onInlinePublicKeysChange(event.target.value)
+      }
+    )
+  ] });
+}
 function ProvisioningWizard({
   environments: environmentsProp,
   onLoadEnvironments,
@@ -455,6 +513,7 @@ function ProvisioningWizard({
   popular,
   defaultModel,
   onSetDefault,
+  sshAccess,
   pricingRates,
   planTiers
 }) {
@@ -585,8 +644,10 @@ function ProvisioningWizard({
     };
   }, []);
   const isMultistep = variant === "multistep";
+  const stepLabels = sshAccess ? ["Environment", "Resources", "AI Agent", "Access"] : ["Environment", "Resources", "AI Agent"];
+  const finalStep = stepLabels.length;
   const [currentStep, setCurrentStep] = React2.useState(
-    skipToReview && dc && isMultistep ? 3 : 1
+    skipToReview && dc && isMultistep ? finalStep : 1
   );
   const [isDeploying, setIsDeploying] = React2.useState(false);
   const [deployError, setDeployError] = React2.useState(null);
@@ -700,41 +761,40 @@ function ProvisioningWizard({
     ] }),
     /* @__PURE__ */ jsxs2("div", { className: "grid grid-cols-12 gap-6 flex-1 min-h-0", children: [
       /* @__PURE__ */ jsxs2("div", { className: "col-span-12 xl:col-span-8 flex flex-col min-h-0", children: [
-        isMultistep && /* @__PURE__ */ jsx2("div", { className: "flex items-center gap-2 mb-4 bg-card border border-border p-3 rounded-2xl mx-auto max-w-2xl justify-between shrink-0", children: [1, 2, 3].map((s) => /* @__PURE__ */ jsxs2("div", { className: "flex items-center", children: [
-          /* @__PURE__ */ jsx2(
-            "div",
-            {
-              className: cn(
-                "w-7 h-7 rounded-full flex items-center justify-center font-bold text-xs shrink-0 transition-all duration-200",
-                currentStep === s ? "bg-primary text-primary-foreground ring-2 ring-primary/30 ring-offset-2 ring-offset-card shadow-sm" : currentStep > s ? "bg-primary text-primary-foreground" : "bg-muted border border-border text-muted-foreground"
-              ),
-              children: currentStep > s ? /* @__PURE__ */ jsx2(Check, { className: "h-3.5 w-3.5" }) : s
-            }
-          ),
-          /* @__PURE__ */ jsxs2(
-            "span",
-            {
-              className: cn(
-                "ml-2 sm:ml-3 font-bold text-sm tracking-tight hidden sm:inline transition-colors duration-200",
-                currentStep === s ? "text-foreground" : currentStep > s ? "text-primary" : "text-muted-foreground"
-              ),
-              children: [
-                s === 1 && "Environment",
-                s === 2 && "Resources",
-                s === 3 && "AI Agent"
-              ]
-            }
-          ),
-          s < 3 && /* @__PURE__ */ jsx2(
-            "div",
-            {
-              className: cn(
-                "w-4 sm:w-8 h-0.5 mx-2 sm:mx-4 rounded-full transition-colors duration-300",
-                currentStep > s ? "bg-primary" : "bg-border"
-              )
-            }
-          )
-        ] }, s)) }),
+        isMultistep && /* @__PURE__ */ jsx2("div", { className: "flex items-center gap-2 mb-4 bg-card border border-border p-3 rounded-2xl mx-auto max-w-2xl justify-between shrink-0", children: stepLabels.map((label, index) => {
+          const s = index + 1;
+          return /* @__PURE__ */ jsxs2("div", { className: "flex items-center", children: [
+            /* @__PURE__ */ jsx2(
+              "div",
+              {
+                className: cn(
+                  "w-7 h-7 rounded-full flex items-center justify-center font-bold text-xs shrink-0 transition-all duration-200",
+                  currentStep === s ? "bg-primary text-primary-foreground ring-2 ring-primary/30 ring-offset-2 ring-offset-card shadow-sm" : currentStep > s ? "bg-primary text-primary-foreground" : "bg-muted border border-border text-muted-foreground"
+                ),
+                children: currentStep > s ? /* @__PURE__ */ jsx2(Check, { className: "h-3.5 w-3.5" }) : s
+              }
+            ),
+            /* @__PURE__ */ jsx2(
+              "span",
+              {
+                className: cn(
+                  "ml-2 sm:ml-3 font-bold text-sm tracking-tight hidden sm:inline transition-colors duration-200",
+                  currentStep === s ? "text-foreground" : currentStep > s ? "text-primary" : "text-muted-foreground"
+                ),
+                children: label
+              }
+            ),
+            s < finalStep && /* @__PURE__ */ jsx2(
+              "div",
+              {
+                className: cn(
+                  "w-4 sm:w-8 h-0.5 mx-2 sm:mx-4 rounded-full transition-colors duration-300",
+                  currentStep > s ? "bg-primary" : "bg-border"
+                )
+              }
+            )
+          ] }, s);
+        }) }),
         dc && isMultistep && /* @__PURE__ */ jsxs2("div", { className: "flex items-center justify-between bg-card border border-border rounded-2xl px-4 py-3 shrink-0", children: [
           /* @__PURE__ */ jsxs2("div", { className: "flex items-center gap-2 text-sm", children: [
             /* @__PURE__ */ jsx2(Info, { className: "h-4 w-4 text-primary shrink-0" }),
@@ -1206,6 +1266,13 @@ function ProvisioningWizard({
                 ] })
               ] })
             ] })
+          ] }) }),
+          sshAccess && (!isMultistep || currentStep === 4) && /* @__PURE__ */ jsx2(React2.Fragment, { children: /* @__PURE__ */ jsxs2("section", { className: "bg-card border border-border rounded-[24px] p-6 shadow-2xl relative overflow-hidden animate-in fade-in slide-in-from-bottom-4 duration-300", children: [
+            /* @__PURE__ */ jsxs2("div", { className: "flex items-center gap-3 mb-5", children: [
+              /* @__PURE__ */ jsx2("div", { className: "flex h-9 w-9 shrink-0 items-center justify-center rounded-xl bg-primary/10 border border-primary/20 text-primary", children: /* @__PURE__ */ jsx2(Settings, { className: "h-5 w-5" }) }),
+              /* @__PURE__ */ jsx2("h2", { className: "text-lg font-bold text-foreground tracking-tight", children: "Access Configuration" })
+            ] }),
+            /* @__PURE__ */ jsx2(SshAccessStep, { config: sshAccess })
           ] }) })
         ] })
       ] }),
@@ -1310,16 +1377,15 @@ function ProvisioningWizard({
           /* @__PURE__ */ jsx2("p", { className: "text-sm font-medium text-destructive", children: deployError })
         ] }),
         /* @__PURE__ */ jsx2("div", { className: "space-y-3", children: isMultistep ? /* @__PURE__ */ jsxs2(Fragment2, { children: [
-          currentStep < 3 ? /* @__PURE__ */ jsxs2(
+          currentStep < finalStep ? /* @__PURE__ */ jsxs2(
             "button",
             {
               type: "button",
               onClick: () => setCurrentStep((s) => s + 1),
               className: "w-full relative overflow-hidden h-12 bg-primary text-primary-foreground font-extrabold text-sm rounded-2xl hover:brightness-110 transition-all active:scale-[0.98] shadow-md",
               children: [
-                "Continue to",
-                " ",
-                currentStep === 1 ? "Resources" : "Agent Config"
+                "Continue to ",
+                stepLabels[currentStep]
               ]
             }
           ) : /* @__PURE__ */ jsx2(
@@ -1544,8 +1610,8 @@ 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 { Button as Button2 } from "@tangle-network/ui/primitives";
+import { Badge as Badge2 } from "@tangle-network/ui/primitives";
 import { Card } from "@tangle-network/ui/primitives";
 import {
   Dialog,
@@ -1618,7 +1684,7 @@ function ProfilesPage({
       ] }),
       /* @__PURE__ */ jsxs4("div", { className: "flex items-center gap-3", children: [
         onCompareClick && customProfiles.length >= 2 && /* @__PURE__ */ jsx4(
-          Button,
+          Button2,
           {
             variant: "outline",
             onClick: () => onCompareClick(customProfiles),
@@ -1626,7 +1692,7 @@ function ProfilesPage({
           }
         ),
         /* @__PURE__ */ jsxs4(
-          Button,
+          Button2,
           {
             onClick: () => setCreateDialogOpen(true),
             disabled: !canCreateMore,
@@ -1661,7 +1727,7 @@ function ProfilesPage({
     error && /* @__PURE__ */ jsxs4("div", { className: "flex items-center gap-2 rounded-lg border border-[var(--surface-danger-border)] bg-[var(--surface-danger-bg)] p-3 text-[var(--surface-danger-text)] text-sm", children: [
       /* @__PURE__ */ jsx4(AlertCircle, { className: "h-4 w-4" }),
       /* @__PURE__ */ jsx4("span", { children: error }),
-      /* @__PURE__ */ jsx4(Button, { variant: "ghost", size: "sm", onClick: loadProfiles, children: "Retry" })
+      /* @__PURE__ */ jsx4(Button2, { variant: "ghost", size: "sm", onClick: loadProfiles, children: "Retry" })
     ] }),
     loading && /* @__PURE__ */ jsx4("div", { className: "flex items-center justify-center py-12", children: /* @__PURE__ */ jsx4(Loader22, { className: "h-8 w-8 animate-spin text-muted-foreground" }) }),
     !loading && /* @__PURE__ */ jsxs4("div", { className: "space-y-8", children: [
@@ -1679,7 +1745,7 @@ function ProfilesPage({
             icon: /* @__PURE__ */ jsx4(Settings2, { className: "h-8 w-8" }),
             title: "No custom profiles yet",
             description: "Create a profile to customize agent behavior",
-            action: canCreateMore ? /* @__PURE__ */ jsxs4(Button, { onClick: () => setCreateDialogOpen(true), children: [
+            action: canCreateMore ? /* @__PURE__ */ jsxs4(Button2, { onClick: () => setCreateDialogOpen(true), children: [
               /* @__PURE__ */ jsx4(Plus2, { className: "mr-2 h-4 w-4" }),
               "Create Profile"
             ] }) : void 0
@@ -1781,14 +1847,14 @@ function ProfileCard({
           /* @__PURE__ */ jsxs4("div", { className: "flex-1", children: [
             /* @__PURE__ */ jsxs4("div", { className: "flex items-center gap-2", children: [
               /* @__PURE__ */ jsx4("h3", { className: "font-medium", children: profile.name }),
-              isBuiltin && /* @__PURE__ */ jsx4(Badge, { variant: "secondary", className: "border-0 text-xs", children: "Built-in" }),
-              profile.is_public && !isBuiltin && /* @__PURE__ */ jsx4(Badge, { className: "border border-[var(--surface-info-border)] bg-[var(--surface-info-bg)] text-[var(--surface-info-text)] text-xs", children: "Public" })
+              isBuiltin && /* @__PURE__ */ jsx4(Badge2, { variant: "secondary", className: "border-0 text-xs", children: "Built-in" }),
+              profile.is_public && !isBuiltin && /* @__PURE__ */ jsx4(Badge2, { className: "border border-[var(--surface-info-border)] bg-[var(--surface-info-bg)] text-[var(--surface-info-text)] text-xs", children: "Public" })
             ] }),
             profile.description && /* @__PURE__ */ jsx4("p", { className: "mt-1 line-clamp-2 text-muted-foreground text-sm", children: profile.description })
           ] }),
           !isBuiltin && /* @__PURE__ */ jsxs4("div", { className: "flex gap-1", onClick: (e) => e.stopPropagation(), children: [
             onEdit && /* @__PURE__ */ jsx4(
-              Button,
+              Button2,
               {
                 variant: "ghost",
                 size: "icon",
@@ -1798,7 +1864,7 @@ function ProfileCard({
               }
             ),
             onDelete && /* @__PURE__ */ jsx4(
-              Button,
+              Button2,
               {
                 variant: "ghost",
                 size: "icon",
@@ -1810,11 +1876,11 @@ function ProfileCard({
           ] })
         ] }),
         /* @__PURE__ */ jsxs4("div", { className: "mt-3 flex flex-wrap gap-2", children: [
-          profile.extends && /* @__PURE__ */ jsxs4(Badge, { variant: "outline", className: "text-xs", children: [
+          profile.extends && /* @__PURE__ */ jsxs4(Badge2, { variant: "outline", className: "text-xs", children: [
             "extends ",
             profile.extends
           ] }),
-          profile.model && /* @__PURE__ */ jsx4(Badge, { variant: "outline", className: "text-xs", children: profile.model.split("/").pop() })
+          profile.model && /* @__PURE__ */ jsx4(Badge2, { variant: "outline", className: "text-xs", children: profile.model.split("/").pop() })
         ] }),
         profile.metrics && profile.metrics.total_runs > 0 && /* @__PURE__ */ jsxs4("div", { className: "mt-3 flex gap-4 border-border border-t pt-3 text-muted-foreground text-xs", children: [
           /* @__PURE__ */ jsxs4("span", { children: [
@@ -2020,8 +2086,8 @@ function ProfileFormDialog({
         /* @__PURE__ */ jsx4("label", { htmlFor: "is_public", className: "text-sm", children: "Make this profile public (visible to other users)" })
       ] }),
       /* @__PURE__ */ jsxs4(DialogFooter, { children: [
-        /* @__PURE__ */ jsx4(Button, { type: "button", variant: "outline", onClick: onClose, children: "Cancel" }),
-        /* @__PURE__ */ jsxs4(Button, { type: "submit", disabled: saving || !formData.name, children: [
+        /* @__PURE__ */ jsx4(Button2, { type: "button", variant: "outline", onClick: onClose, children: "Cancel" }),
+        /* @__PURE__ */ jsxs4(Button2, { type: "submit", disabled: saving || !formData.name, children: [
           saving && /* @__PURE__ */ jsx4(Loader22, { className: "mr-2 h-4 w-4 animate-spin" }),
           isEditing ? "Save Changes" : "Create Profile"
         ] })
@@ -2069,9 +2135,9 @@ function DeleteProfileDialog({
       " recorded runs. Deleting it will lose all performance metrics."
     ] }),
     /* @__PURE__ */ jsxs4(DialogFooter, { children: [
-      /* @__PURE__ */ jsx4(Button, { variant: "outline", onClick: onClose, children: "Cancel" }),
+      /* @__PURE__ */ jsx4(Button2, { variant: "outline", onClick: onClose, children: "Cancel" }),
       /* @__PURE__ */ jsxs4(
-        Button,
+        Button2,
         {
           variant: "destructive",
           onClick: handleDelete,
@@ -2096,8 +2162,8 @@ function ProfileDetailDialog({
     /* @__PURE__ */ jsxs4(DialogHeader, { children: [
       /* @__PURE__ */ jsxs4("div", { className: "flex items-center gap-2", children: [
         /* @__PURE__ */ jsx4(DialogTitle, { children: profile.name }),
-        profile.is_builtin && /* @__PURE__ */ jsx4(Badge, { variant: "secondary", className: "border-0", children: "Built-in" }),
-        profile.is_public && !profile.is_builtin && /* @__PURE__ */ jsx4(Badge, { className: "border border-[var(--surface-info-border)] bg-[var(--surface-info-bg)] text-[var(--surface-info-text)]", children: "Public" })
+        profile.is_builtin && /* @__PURE__ */ jsx4(Badge2, { variant: "secondary", className: "border-0", children: "Built-in" }),
+        profile.is_public && !profile.is_builtin && /* @__PURE__ */ jsx4(Badge2, { className: "border border-[var(--surface-info-border)] bg-[var(--surface-info-bg)] text-[var(--surface-info-text)]", children: "Public" })
       ] }),
       profile.description && /* @__PURE__ */ jsx4(DialogDescription, { children: profile.description })
     ] }),
@@ -2114,14 +2180,14 @@ function ProfileDetailDialog({
       ] }),
       profile.tags && profile.tags.length > 0 && /* @__PURE__ */ jsxs4("div", { children: [
         /* @__PURE__ */ jsx4("label", { className: "font-medium text-muted-foreground text-xs", children: "Tags" }),
-        /* @__PURE__ */ jsx4("div", { className: "mt-1 flex flex-wrap gap-1", children: profile.tags.map((tag) => /* @__PURE__ */ jsx4(Badge, { variant: "outline", className: "text-xs", children: tag }, tag)) })
+        /* @__PURE__ */ jsx4("div", { className: "mt-1 flex flex-wrap gap-1", children: profile.tags.map((tag) => /* @__PURE__ */ jsx4(Badge2, { variant: "outline", className: "text-xs", children: tag }, tag)) })
       ] }),
       profile.system_prompt && /* @__PURE__ */ jsxs4("div", { children: [
         /* @__PURE__ */ jsx4("label", { className: "font-medium text-muted-foreground text-xs", children: "System Prompt" }),
         /* @__PURE__ */ jsxs4("div", { className: "relative mt-1", children: [
           /* @__PURE__ */ jsx4("pre", { className: "max-h-48 overflow-auto rounded-lg bg-muted p-3 font-mono text-sm", children: profile.system_prompt }),
           /* @__PURE__ */ jsx4(
-            Button,
+            Button2,
             {
               variant: "ghost",
               size: "icon",
@@ -2169,12 +2235,12 @@ function ProfileDetailDialog({
       ] })
     ] }),
     /* @__PURE__ */ jsxs4(DialogFooter, { children: [
-      /* @__PURE__ */ jsx4(Button, { variant: "outline", onClick: onClose, children: "Close" }),
-      onDuplicate && /* @__PURE__ */ jsxs4(Button, { variant: "outline", onClick: onDuplicate, children: [
+      /* @__PURE__ */ jsx4(Button2, { variant: "outline", onClick: onClose, children: "Close" }),
+      onDuplicate && /* @__PURE__ */ jsxs4(Button2, { variant: "outline", onClick: onDuplicate, children: [
         /* @__PURE__ */ jsx4(Copy, { className: "mr-2 h-4 w-4" }),
         "Duplicate"
       ] }),
-      onEdit && /* @__PURE__ */ jsxs4(Button, { onClick: onEdit, children: [
+      onEdit && /* @__PURE__ */ jsxs4(Button2, { onClick: onEdit, children: [
         /* @__PURE__ */ jsx4(Edit2, { className: "mr-2 h-4 w-4" }),
         "Edit"
       ] })

package/dist/styles.css

@@ -591,6 +591,9 @@
   .h-\[500px\] {
     height: 500px;
   }
+  .h-auto {
+    height: auto;
+  }
   .h-full {
     height: 100%;
   }
@@ -615,6 +618,9 @@
   .min-h-0 {
     min-height: calc(var(--spacing) * 0);
   }
+  .min-h-24 {
+    min-height: calc(var(--spacing) * 24);
+  }
   .min-h-\[2px\] {
     min-height: 2px;
   }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tangle-network/sandbox-ui",
-  "version": "0.16.2",
+  "version": "0.16.3",
   "description": "Unified UI component library for Tangle Sandbox — primitives, chat, dashboard, terminal, editor, and workspace components",
   "repository": {
     "type": "git",