@tangle-network/sandbox-ui 0.79.0 → 0.81.0

package/dist/{WorkflowGraph-SJ2SG5TP.js → WorkflowGraph-472MC3ML.js}

@@ -11,7 +11,12 @@ import {
   fmtTokens,
   providerLabel,
   shortModel
-} from "./chunk-UEMWLVVY.js";
+} from "./chunk-2NS724P4.js";
+import {
+  ModelBrandStack,
+  modelBrandFor
+} from "./chunk-I3G23XHN.js";
+import "./chunk-EI44GEQ5.js";
 import "./chunk-U67V476Y.js";
 
 // src/workflows/WorkflowGraph.tsx
@@ -341,16 +346,18 @@ var KIND_ICON = {
 function NodeMark({
   kind,
   provider,
+  model,
   accent,
   tile
 }) {
   const Icon = kind && KIND_ICON[kind] || Circle;
+  const brand = !provider && model ? modelBrandFor(model) : null;
   const mark = Math.round(tile * (provider ? 0.58 : 0.5));
   return /* @__PURE__ */ jsx2(
     "span",
     {
       "aria-hidden": "true",
-      className: "flex shrink-0 items-center justify-center rounded-lg border border-border",
+      className: "flex shrink-0 items-center justify-center overflow-hidden rounded-lg border border-border",
       style: {
         width: tile,
         height: tile,
@@ -364,6 +371,19 @@ function NodeMark({
           size: mark,
           className: "rounded-[3px]"
         }
+      ) : brand ? (
+        // One lab's own model draws ONE mark (28px at `md`) and fills the tile. A
+        // HOSTED model draws two — host behind, lab in front — and that stack is
+        // 36px wide, which would push the lab chip past the border of an expanded
+        // card's 34px tile. So the stacked pair steps down unless the tile can hold
+        // it; the single mark never has to.
+        /* @__PURE__ */ jsx2(
+          ModelBrandStack,
+          {
+            identity: brand,
+            size: brand.combined || tile >= 38 ? "md" : "sm"
+          }
+        )
       ) : /* @__PURE__ */ jsx2(Icon, { size: mark, strokeWidth: 1.75, style: { color: accent } })
     }
   );
@@ -373,6 +393,10 @@ function NodeMark({
 import { Fragment, jsx as jsx3, jsxs as jsxs2 } from "react/jsx-runtime";
 var MUTED_TRACK = "color-mix(in srgb, hsl(var(--muted-foreground)) 22%, transparent)";
 var FIT_VIEW = { padding: 0.16, minZoom: 0.55, maxZoom: 1 };
+function fitViewOnLayoutChange() {
+  const moves = typeof window !== "undefined" && window.matchMedia?.("(prefers-reduced-motion: reduce)").matches === false;
+  return moves ? { ...FIT_VIEW, duration: 220 } : FIT_VIEW;
+}
 function useColorMode() {
   const [mode, setMode] = useState(
     () => typeof document !== "undefined" && document.documentElement.classList.contains("dark") ? "dark" : "light"
@@ -475,6 +499,7 @@ function WorkflowNode({ data }) {
   const accent = TONE_ACCENT[d.tone];
   const isAgent = d.kind === "agent.run";
   const subtitle = isAgent && state?.model ? shortModel(state.model) : d.subtitle;
+  const markModel = isAgent && state?.model ? state.model : d.model;
   const runBands = state !== void 0 && d.tone !== "trigger";
   const duration = fmtDuration(state?.durationMs);
   const cost = fmtCost(state?.costUsd);
@@ -538,6 +563,7 @@ function WorkflowNode({ data }) {
                   {
                     kind: d.kind,
                     provider: d.provider,
+                    model: markModel,
                     accent,
                     tile: Math.round(COMPACT_TILE * 0.62)
                   }
@@ -602,6 +628,7 @@ function WorkflowNode({ data }) {
               {
                 kind: d.kind,
                 provider: d.provider,
+                model: markModel,
                 accent,
                 tile: 34
               }
@@ -726,7 +753,7 @@ function WorkflowGraph({
     }
     const inst = rfRef.current;
     if (!inst || typeof requestAnimationFrame === "undefined") return;
-    const raf = requestAnimationFrame(() => inst.fitView(FIT_VIEW));
+    const raf = requestAnimationFrame(() => inst.fitView(fitViewOnLayoutChange()));
     return () => cancelAnimationFrame(raf);
   }, [structural]);
   const handleNodeClick = useCallback(
@@ -801,5 +828,6 @@ export {
   DirectionContext,
   WorkflowGraph,
   WorkflowNode,
-  buildStyledEdges
+  buildStyledEdges,
+  fitViewOnLayoutChange
 };

package/dist/chat.d.ts

@@ -5,7 +5,7 @@ import { ReasoningEffort, HarnessType } from '@tangle-network/agent-interface';
 export { modelProvider, snapHarnessToModel } from '@tangle-network/agent-interface';
 import * as Popover from '@radix-ui/react-dropdown-menu';
 import * as React from 'react';
-import { M as ModelInfo } from './model-picker-COjPVMzg.js';
+import { b as ModelInfo } from './model-brand-CsFykzMA.js';
 
 /**
  * A reasoning selection: `auto` is a UI-only sentinel ("let the harness/model default decide",
@@ -269,6 +269,44 @@ interface AgentSessionControlsProps {
  */
 declare function AgentSessionControls({ harness, profile, model, reasoning, filterModelsToHarness, trailing, className, context, layout, menuPlacement, }: AgentSessionControlsProps): react_jsx_runtime.JSX.Element | null;
 
+/** Limits applied when staging files onto a composer. */
+interface ComposerFileValidationConfig {
+    /** Reject any single file larger than this. */
+    maxSizeBytes?: number;
+    /** Reject files once the staged count would exceed this. */
+    maxCount?: number;
+    /** Files already staged, counted against `maxCount` before this batch. */
+    currentCount?: number;
+    /**
+     * Comma-separated accept list, same grammar as the native `<input accept>`
+     * attribute: file extensions (`.png`), exact MIME types (`image/png`), and
+     * MIME wildcards (`image/*`).
+     */
+    accept?: string;
+}
+/** A file that failed validation, paired with a human-readable reason. */
+interface ComposerFileRejection {
+    file: File;
+    reason: string;
+}
+/**
+ * Checks a single file against a comma-separated `accept` list using the same
+ * grammar as the native `<input accept>` attribute. An undefined or empty
+ * `accept` accepts everything.
+ */
+declare function isAcceptedType(file: File, accept?: string): boolean;
+/**
+ * Splits a batch of files into what's safe to stage and what's rejected,
+ * checking accept type, then size, then the running count against
+ * `currentCount` + `maxCount`. Each rejection carries a reason naming the
+ * file and the limit it broke. Pure data in, pure data out — no throwing,
+ * no console noise, so callers decide how to surface rejections.
+ */
+declare function validateComposerFiles(files: File[] | FileList, config: ComposerFileValidationConfig): {
+    accepted: File[];
+    rejected: ComposerFileRejection[];
+};
+
 /** A staged attachment shown as a chip above the input. */
 interface ComposerFile {
     id: string;
@@ -278,6 +316,14 @@ interface ComposerFile {
     /** File count for a folder chip. */
     fileCount?: number;
     status: "pending" | "uploading" | "ready" | "error";
+    /**
+     * Object URL for an image thumbnail. The app owns creation and revocation
+     * (e.g. `URL.createObjectURL` on stage, `URL.revokeObjectURL` on remove) —
+     * the composer only ever reads it.
+     */
+    previewUrl?: string;
+    /** Shown on the chip when `status === "error"`. */
+    errorMessage?: string;
 }
 interface AgentComposerProps {
     /** Composer text (controlled). */
@@ -324,9 +370,42 @@ interface AgentComposerProps {
     onAttachFolder?: (files: FileList) => void;
     attachments?: ReadonlyArray<ComposerFile>;
     onRemoveFile?: (id: string) => void;
+    /** When set, chips with `status === "error"` render a retry button. */
+    onRetryFile?: (id: string) => void;
+    /**
+     * File types the composer takes, in the native `<input accept>` grammar.
+     * Enforced on every ingress path — the picker dialog, drag-and-drop, and
+     * clipboard paste — so a type the picker won't offer can't arrive by another
+     * route. Non-matching files go to `onRejectFiles` and never reach
+     * `onAttach`. Folder attach is exempt (directory selection has no native
+     * accept semantics); size/count limits are the app's job in `onAttach`.
+     */
     accept?: string;
+    /**
+     * Called with the files `accept` filtered out of a drop/paste/pick, each
+     * with a human-readable reason. Without it rejection is silent — the same
+     * feedback the native picker gives for a type it won't offer.
+     */
+    onRejectFiles?: (rejections: ComposerFileRejection[]) => void;
     dropTitle?: string;
     dropDescription?: string;
+    /**
+     * `canSend` ignores `busy` so Enter/onSubmit keep firing while a turn is
+     * streaming. For composers that queue the next turn instead of blocking on
+     * the current one — the Stop-button rendering rule (`busy && onCancel`) is
+     * unaffected, so the button still flips to Stop while this is set. Default
+     * false.
+     */
+    canSubmitWhileBusy?: boolean;
+    /**
+     * Allow submitting with empty text when at least one attachment is staged
+     * (an image-only message). Counts attachments of ANY status — a gate on
+     * `ready` would make Enter silently dead while an upload is in flight,
+     * with no way for the app to explain why. The app's onSubmit owns the send
+     * policy (block, queue, or toast on pending/errored files) and what the
+     * message body becomes. Default false.
+     */
+    canSubmitAttachmentsOnly?: boolean;
     /** Cmd/Ctrl+L focuses the input and shows a hint. Default false. */
     focusShortcut?: boolean;
     /** Minimum textarea rows before it grows. Default 2. */
@@ -346,11 +425,13 @@ interface AgentComposerProps {
  * router-backed composer (no harness) and the sandbox-backed one (with harness).
  *
  * Opt-in extras make it the superset of every app's hand-rolled composer:
- * file/folder attachments with drag-and-drop + chips, a streaming Stop button
- * (`busy` + `onCancel`), a `controls` override slot for bespoke picker rows, and
- * a Cmd/Ctrl+L focus shortcut.
+ * file/folder attachments with drag-and-drop + chips + clipboard paste
+ * (`onAttach` also gates pasting files onto the textarea, auto-naming
+ * generic clipboard image blobs `pasted-image-<n>.<ext>`), a streaming Stop
+ * button (`busy` + `onCancel`), a `controls` override slot for bespoke
+ * picker rows, and a Cmd/Ctrl+L focus shortcut.
  */
-declare function AgentComposer({ value, onChange, onSubmit, placeholder, disabled, busy, onCancel, harness, profile, model, reasoning, context, controls, trailing, onAttach, onAttachFolder, attachments, onRemoveFile, accept, dropTitle, dropDescription, focusShortcut, minRows, maxHeight, className, sendLabel, autoFocus, }: AgentComposerProps): react_jsx_runtime.JSX.Element;
+declare function AgentComposer({ value, onChange, onSubmit, placeholder, disabled, busy, onCancel, harness, profile, model, reasoning, context, controls, trailing, onAttach, onAttachFolder, attachments, onRemoveFile, onRetryFile, accept, onRejectFiles, dropTitle, dropDescription, canSubmitWhileBusy, canSubmitAttachmentsOnly, focusShortcut, minRows, maxHeight, className, sendLabel, autoFocus, }: AgentComposerProps): react_jsx_runtime.JSX.Element;
 
 /**
  * Whether `harness` can run `modelId`. Router-backed harnesses, and provider-less
@@ -464,4 +545,4 @@ declare function createFetchTransport(opts: {
     fetchImpl?: typeof fetch;
 }): ArtifactAgentDockTransport;
 
-export { AgentComposer, type AgentComposerProps, type AgentProfileCapability, type AgentProfileDraft, type AgentProfileOption, AgentProfilePicker, type AgentProfilePickerProps, AgentSessionControls, type AgentSessionControlsProps, type AgentSessionHarnessControl, type AgentSessionModelControl, type AgentSessionProfileControl, type AgentSessionReasoningControl, ArtifactAgentDock, type ArtifactAgentDockProps, type ArtifactAgentDockTransport, type ArtifactDockMessage, type ArtifactDockStreamEvent, type ArtifactKind, type ArtifactScope, type ComposerFile, DEFAULT_REASONING_LEVEL_OPTIONS, HARNESS_REASONING_OPTIONS, type ReasoningLevel, type ReasoningLevelOption, ReasoningLevelPicker, type ReasoningLevelPickerProps, createFetchTransport, isModelCompatibleWithHarness, snapModelToHarness };
+export { AgentComposer, type AgentComposerProps, type AgentProfileCapability, type AgentProfileDraft, type AgentProfileOption, AgentProfilePicker, type AgentProfilePickerProps, AgentSessionControls, type AgentSessionControlsProps, type AgentSessionHarnessControl, type AgentSessionModelControl, type AgentSessionProfileControl, type AgentSessionReasoningControl, ArtifactAgentDock, type ArtifactAgentDockProps, type ArtifactAgentDockTransport, type ArtifactDockMessage, type ArtifactDockStreamEvent, type ArtifactKind, type ArtifactScope, type ComposerFile, type ComposerFileRejection, type ComposerFileValidationConfig, DEFAULT_REASONING_LEVEL_OPTIONS, HARNESS_REASONING_OPTIONS, type ReasoningLevel, type ReasoningLevelOption, ReasoningLevelPicker, type ReasoningLevelPickerProps, createFetchTransport, isAcceptedType, isModelCompatibleWithHarness, snapModelToHarness, validateComposerFiles };

package/dist/chat.js

@@ -13,13 +13,17 @@ import {
   ThinkingIndicator,
   UserMessage,
   createFetchTransport,
+  isAcceptedType,
   isModelCompatibleWithHarness,
   modelProvider,
   snapHarnessToModel,
-  snapModelToHarness
-} from "./chunk-UQXDIQWD.js";
-import "./chunk-IWIZ7RZE.js";
-import "./chunk-L62ZT6RS.js";
+  snapModelToHarness,
+  validateComposerFiles
+} from "./chunk-YBFGWPUF.js";
+import "./chunk-TK46XFLM.js";
+import "./chunk-2T6KBMLN.js";
+import "./chunk-R4AR3TKR.js";
+import "./chunk-I3G23XHN.js";
 import "./chunk-EI44GEQ5.js";
 import "./chunk-U67V476Y.js";
 export {
@@ -37,8 +41,10 @@ export {
   ThinkingIndicator,
   UserMessage,
   createFetchTransport,
+  isAcceptedType,
   isModelCompatibleWithHarness,
   modelProvider,
   snapHarnessToModel,
-  snapModelToHarness
+  snapModelToHarness,
+  validateComposerFiles
 };

package/dist/{chunk-UEMWLVVY.js → chunk-2NS724P4.js}

@@ -279,9 +279,11 @@ var CONTROL_FLOW = new Set(CONTROL_FLOW_KEYS);
 function actionKind(rec) {
   return Object.keys(rec).find((k) => !CONTROL_FLOW.has(k));
 }
+var MINTED_PROFILE_ID = /^ap_[A-Za-z0-9_-]{16}$/;
 function agentTitle(profile) {
   const named = str(profile);
-  return named ? humanizeIdentifier(named) : "AI Agent";
+  if (!named || MINTED_PROFILE_ID.test(named)) return "AI Agent";
+  return humanizeIdentifier(named);
 }
 function describeActionBase(action) {
   const rec = asRecord(action);

package/dist/{chunk-IWIZ7RZE.js → chunk-2T6KBMLN.js}

@@ -1,6 +1,6 @@
 import {
   moonshot_default
-} from "./chunk-L62ZT6RS.js";
+} from "./chunk-I3G23XHN.js";
 import {
   cn
 } from "./chunk-EI44GEQ5.js";