@stigmer/react 3.12.1 → 3.12.2

package/src/composer/SessionComposer.tsx

@@ -7,9 +7,14 @@ import { useComposer } from "./useComposer.js";
 import { ComposerToolbar } from "./ComposerToolbar.js";
 import { type ConfigureMenuItem } from "./ConfigureMenu.js";
 import type { HarnessOption } from "../models/harness.js";
-import type { ServiceTierOption } from "../models/service-tier.js";
+import { FAST_SERVICE_TIER, type ServiceTierOption } from "../models/service-tier.js";
 import type { InteractionModeOption } from "./InteractionModePicker.js";
 import { parseModelKey } from "../models/registry.js";
+import { useModelRegistry } from "../models/useModelRegistry.js";
+import {
+  assessVisionPreflight,
+  visionPreflightMessage,
+} from "../attachment/vision-preflight.js";
 import { WorkspaceEditor } from "../workspace/WorkspaceEditor.js";
 import { AgentPicker } from "../agent/AgentPicker.js";
 import { AgentEnvForm, type AgentEnvFormSubmitOptions } from "../agent/AgentEnvForm.js";
@@ -654,9 +659,23 @@ const SessionComposerInner = forwardRef<SessionComposerHandle, SessionComposerPr
 
   // Service tier (#357): composer-local state like modelId. "standard" is
   // the resting default; the ModelSelector's fail-safe resets it when the
-  // user switches to a model without a fast tier.
+  // user switches to a model without a fast tier. Whether an armed "fast"
+  // actually rides the submit is decided by the derived effective run
+  // selection below (#663) — state here records the user's intent only.
   const [serviceTier, setServiceTier] = useState<ServiceTierOption>("standard");
 
+  // Active harness mirror: controlled hosts (both viewers) keep the
+  // `harness` prop current, but with `showHarnessSelector` the dropdown
+  // lives inside ModelSelector and an uncontrolled host would leave the
+  // prop stale — the mirror keeps the effective-model resolution scoped
+  // to the harness the picker is actually showing.
+  const [activeHarness, setActiveHarness] = useState<HarnessOption>(
+    harness ?? "native",
+  );
+  useEffect(() => {
+    if (harness !== undefined) setActiveHarness(harness);
+  }, [harness]);
+
   const [displayNames, setDisplayNames] = useState<Map<string, string>>(
     () => new Map(),
   );
@@ -753,6 +772,107 @@ const SessionComposerInner = forwardRef<SessionComposerHandle, SessionComposerPr
       ? { onValidationError: onAttachmentValidationError }
       : undefined,
   );
+
+  // -------------------------------------------------------------------------
+  // Vision preflight (stigmer/stigmer#365, #386) — predicts which attached
+  // images the runner will degrade to "not viewable inline" (per-image /
+  // per-turn byte budget from the registry document) or that the selected
+  // model is explicitly blind. Non-blocking by design: the files still
+  // upload and mount fine, they just won't reach the model as pixels — so
+  // this warns, it never gates the send.
+  // -------------------------------------------------------------------------
+
+  const {
+    getByKey: registryGetByKey,
+    getModel: registryGetModel,
+    visionLimits,
+    isLoading: isRegistryLoading,
+  } = useModelRegistry();
+  const { defaultModel: harnessDefaultModel } = useModelRegistry({
+    harness: activeHarness,
+  });
+
+  // -------------------------------------------------------------------------
+  // Effective run selection (stigmer/stigmer#663) — the ONE resolution of
+  // "which model and tier will this send actually run". The model pill,
+  // the fast-tier gate, the vision preflight, and the submit payload all
+  // read it, so the pill can never promise a selection the wire doesn't
+  // carry (the #663 failure: a fallback pill with an armed fast tier over
+  // an empty model — refused fail-closed at create).
+  //
+  // Adoption of the harness default is gated on `showModelSelector`: with
+  // no pill there is no displayed promise, and whoever hid the picker owns
+  // the model (the guest share profile server-side, a host pin) — the
+  // guest no-modelName invariant depends on this gate staying put.
+  // -------------------------------------------------------------------------
+
+  const effective = useMemo(() => {
+    // modelId may be a compound "harness/id" key (unified picker) or a
+    // plain id — resolve through the unambiguous compound lookup first,
+    // mirroring the submit path's parseModelKey handling.
+    const stateModel = modelId
+      ? (registryGetByKey(modelId) ?? registryGetModel(modelId))
+      : undefined;
+
+    let effectiveModelId = modelId;
+    let effectiveModel = stateModel;
+    if (showModelSelector && !isRegistryLoading && stateModel === undefined) {
+      // Empty state, or an id the registry no longer lists (e.g. a retired
+      // model carried over from the last execution): the pill falls back to
+      // the harness default, so the submission adopts it too. While the
+      // registry is still loading nothing can be classified — pass the raw
+      // id through unmodified rather than misadopting the default.
+      effectiveModelId = harnessDefaultModel?.modelId ?? modelId;
+      effectiveModel = harnessDefaultModel;
+    }
+
+    // "fast" rides the submit only while the effective model prices the
+    // variant — the same rule the trigger badge renders and the server
+    // enforces fail-closed (#357). An armed tier surviving onto a model
+    // with no fast variant (e.g. a prop-driven `defaultModelId` re-sync,
+    // which bypasses ModelSelector's user-pick reset) is thereby
+    // unsendable, not just unstyled.
+    const effectiveServiceTier: ServiceTierOption =
+      serviceTier === "fast"
+        && (effectiveModel?.serviceTiers.includes(FAST_SERVICE_TIER) ?? false)
+        ? "fast"
+        : "standard";
+
+    return { modelId: effectiveModelId, model: effectiveModel, serviceTier: effectiveServiceTier };
+  }, [
+    modelId,
+    serviceTier,
+    showModelSelector,
+    isRegistryLoading,
+    registryGetByKey,
+    registryGetModel,
+    harnessDefaultModel,
+  ]);
+
+  // Vision preflight consumes the effective model — previously it kept a
+  // third private resolution (unified-registry default) that could name a
+  // different model than both the pill and the payload.
+  const visionNotice = useMemo(() => {
+    if (!enableAttachments || attachments.entries.length === 0) return null;
+    const preflight = assessVisionPreflight(
+      attachments.entries.map((e) => ({
+        name: e.file.name,
+        sizeBytes: e.file.size,
+        contentType: e.contentType,
+      })),
+      { model: effective.model, limits: visionLimits },
+    );
+    return visionPreflightMessage(preflight, {
+      limits: visionLimits,
+      modelDisplayName: effective.model?.displayName,
+    });
+  }, [
+    enableAttachments,
+    attachments.entries,
+    effective.model,
+    visionLimits,
+  ]);
+
   const fileRefs = useFileReferences();
   const fileInputRef = useRef<HTMLInputElement>(null);
   const [isDragOver, setIsDragOver] = useState(false);
@@ -923,27 +1043,32 @@ const SessionComposerInner = forwardRef<SessionComposerHandle, SessionComposerPr
           : undefined);
       const hasFileRefs = enableFileReferences && fileRefs.hasRefs;
       const buildFromPlan = overrides?.buildFromPlan;
-      // Carried only when the user actively chose fast: an untouched
-      // tier means "platform default" (which resolves to standard in
-      // the runner), and the UNSPECIFIED-vs-explicit distinction is
-      // load-bearing telemetry (#357).
-      const effectiveServiceTier = serviceTier === "fast" ? serviceTier : undefined;
+      // Carried only when fast is actually in effect (armed by the user
+      // AND priced by the effective model — see the effective run
+      // selection): an untouched tier means "platform default" (which
+      // resolves to standard in the runner), and the UNSPECIFIED-vs-
+      // explicit distinction is load-bearing telemetry (#357).
+      const submitServiceTier =
+        effective.serviceTier === "fast" ? effective.serviceTier : undefined;
 
       const context: SessionComposerSubmitContext | undefined =
         hasEnv || hasAttachments || effectiveMode || hasFileRefs || buildFromPlan
-        || effectiveServiceTier
+        || submitServiceTier
           ? {
               runtimeEnv: hasEnv ? env : undefined,
               attachments: hasAttachments ? attachmentInputs : undefined,
               interactionMode: effectiveMode,
-              serviceTier: effectiveServiceTier,
+              serviceTier: submitServiceTier,
               workspaceFileRefs: hasFileRefs ? [...fileRefs.refs] : undefined,
               buildFromPlan,
             }
           : undefined;
 
-      const resolvedModelId = modelId
-        ? (parseModelKey(modelId)?.modelId ?? modelId)
+      // The payload carries the effective model — exactly what the pill
+      // displays (#663), stripped to a plain id when the state holds a
+      // compound "harness/id" key.
+      const resolvedModelId = effective.modelId
+        ? (parseModelKey(effective.modelId)?.modelId ?? effective.modelId)
         : undefined;
       onSubmit(message, resolvedModelId, context);
 
@@ -954,7 +1079,7 @@ const SessionComposerInner = forwardRef<SessionComposerHandle, SessionComposerPr
         fileRefs.clear();
       }
     },
-    [onSubmit, modelId, serviceTier, stigmer, agentSetup.state, mcpSetup.pendingRuntimeEnv, sessionVariables, enableAttachments, attachments, personalEnv, showInteractionModePicker, interactionMode],
+    [onSubmit, effective, stigmer, agentSetup.state, mcpSetup.pendingRuntimeEnv, sessionVariables, enableAttachments, attachments, personalEnv, showInteractionModePicker, interactionMode],
   );
 
   const composer = useComposer({
@@ -982,6 +1107,7 @@ const SessionComposerInner = forwardRef<SessionComposerHandle, SessionComposerPr
 
   const handleHarnessChange = useCallback(
     (h: HarnessOption) => {
+      setActiveHarness(h);
       onHarnessChange?.(h);
     },
     [onHarnessChange],
@@ -1636,6 +1762,25 @@ const SessionComposerInner = forwardRef<SessionComposerHandle, SessionComposerPr
           </div>
         )}
 
+        {/* Zone 2.65: Vision preflight warning (stigmer/stigmer#365, #386) —
+            derives from the attached entries, so it appears the moment an
+            image over the advertised budget lands (paste/drop/pick) or the
+            selected model is explicitly blind, and disappears when the
+            offending attachment is removed or the model changes. Warning
+            styling (not muted): unlike the upload wait, this is a problem
+            the user can fix BEFORE spending the turn. Non-blocking — the
+            files still upload and mount; they just won't reach the model
+            as pixels. */}
+        {visionNotice && (
+          <div
+            role="status"
+            className="stg:mx-3 stg:mb-2 stg:flex stg:items-center stg:gap-2 stg:rounded-md stg:bg-warning/10 stg:px-2.5 stg:py-1.5 stg:text-xs stg:text-warning"
+          >
+            <AlertTriangleIcon />
+            <span>{visionNotice}</span>
+          </div>
+        )}
+
         {/* Zone 2.7: Agent setup warning */}
         {showAgent &&
           agentSetup.state.status === "needsEnvVars" &&
@@ -1734,7 +1879,9 @@ const SessionComposerInner = forwardRef<SessionComposerHandle, SessionComposerPr
           interactionMode={interactionMode}
           onInteractionModeChange={handleInteractionModeChange}
           showModelSelector={showModelSelector}
-          modelId={modelId}
+          // The pill renders the effective selection — the same value the
+          // submit payload carries (#663), never a fallback of its own.
+          modelId={effective.modelId}
           onModelChange={handleModelChange}
           serviceTier={serviceTier}
           onServiceTierChange={setServiceTier}

package/src/composer/__tests__/SessionComposer-modelCoherence.test.tsx

@@ -0,0 +1,220 @@
+import { describe, it, expect, vi, afterEach, beforeAll } from "vitest";
+import { render, screen, cleanup, fireEvent, waitFor } from "@testing-library/react";
+import { type ReactNode } from "react";
+import type { Stigmer } from "@stigmer/sdk";
+import { StigmerContext } from "../../context";
+import { ModelRegistryContext } from "../../models/ModelRegistryContext";
+import type { ModelInfo } from "../../models/registry";
+import { SessionComposer } from "../SessionComposer";
+
+// Shim ResizeObserver for Base UI's positioner (the
+// scheduleCreation.test.tsx pattern).
+beforeAll(() => {
+  if (!("ResizeObserver" in globalThis)) {
+    (globalThis as unknown as { ResizeObserver: unknown }).ResizeObserver =
+      class {
+        observe() {}
+        unobserve() {}
+        disconnect() {}
+      };
+  }
+});
+
+/**
+ * Effective run selection coherence (stigmer/stigmer#663): the submission
+ * must carry exactly the model the pill displays, and "fast" must only
+ * ride the wire while the effective model prices it. The original defect:
+ * an empty composer displayed the registry fallback with a toggleable
+ * FAST badge, then sent `service_tier: fast` with NO model — refused
+ * fail-closed by the server ("Couldn't send." + a Retry that can never
+ * succeed).
+ */
+
+const AUTO: ModelInfo = {
+  modelId: "default",
+  provider: "cursor",
+  displayName: "Auto",
+  shortDescription: "Automatic model selection",
+  speedTier: "fast",
+  costTier: "standard",
+  harness: "cursor",
+  featured: true,
+  serviceTiers: [],
+};
+
+const FAST_CAPABLE: ModelInfo = {
+  modelId: "composer-2.5",
+  provider: "cursor",
+  displayName: "Composer 2.5",
+  shortDescription: "Fast agentic model",
+  speedTier: "fastest",
+  costTier: "economy",
+  harness: "cursor",
+  featured: true,
+  serviceTiers: ["fast"],
+};
+
+const NO_FAST: ModelInfo = {
+  modelId: "gpt-5.3-codex",
+  provider: "openai",
+  displayName: "GPT-5.3 Codex",
+  shortDescription: "No fast variant",
+  speedTier: "fast",
+  costTier: "standard",
+  harness: "cursor",
+  featured: true,
+  serviceTiers: [],
+};
+
+function createMinimalStigmerMock(): Stigmer {
+  return {
+    agentExecution: { uploadAttachment: vi.fn() },
+    environment: { getPersonal: vi.fn().mockResolvedValue(null) },
+    baseUrl: "http://localhost:8080",
+    getAuthCredential: vi.fn().mockResolvedValue("test-token"),
+    config: {
+      baseUrl: "http://localhost:8080",
+      getAccessToken: vi.fn().mockResolvedValue(""),
+    },
+  } as unknown as Stigmer;
+}
+
+function createWrapper(
+  client: Stigmer,
+  registry: { models: readonly ModelInfo[]; isLoading?: boolean },
+) {
+  return function Wrapper({ children }: { children: ReactNode }) {
+    return (
+      <StigmerContext.Provider value={client}>
+        <ModelRegistryContext.Provider
+          value={{
+            models: [...registry.models],
+            isLoading: registry.isLoading ?? false,
+            error: null,
+            refetch: vi.fn(),
+          }}
+        >
+          {children}
+        </ModelRegistryContext.Provider>
+      </StigmerContext.Provider>
+    );
+  };
+}
+
+function submitMessage(message: string) {
+  const textarea = screen.getByRole("textbox");
+  fireEvent.change(textarea, { target: { value: message } });
+  fireEvent.keyDown(textarea, { key: "Enter", shiftKey: false });
+}
+
+/** Open the picker and flip the fast-tier switch (Base UI portals mount
+ * asynchronously in jsdom — the switch is awaited). */
+async function toggleFastTier(triggerName: RegExp) {
+  fireEvent.click(screen.getByRole("button", { name: triggerName }));
+  const toggle = await screen.findByRole("switch", { name: "Fast tier" });
+  fireEvent.click(toggle);
+  fireEvent.keyDown(document.activeElement ?? document.body, { key: "Escape" });
+}
+
+afterEach(cleanup);
+
+describe("SessionComposer — effective run selection (#663)", () => {
+  it("adopts the displayed harness default when no model is selected", async () => {
+    const onSubmit = vi.fn();
+    render(
+      <SessionComposer onSubmit={onSubmit} harness="cursor" />,
+      { wrapper: createWrapper(createMinimalStigmerMock(), { models: [FAST_CAPABLE, AUTO, NO_FAST] }) },
+    );
+
+    // The pill displays the harness default (Auto for cursor)…
+    expect(screen.getByRole("button", { name: /Auto/ })).toBeTruthy();
+
+    submitMessage("hello");
+
+    // …and the submission carries exactly that model, never undefined.
+    await waitFor(() => expect(onSubmit).toHaveBeenCalledOnce());
+    expect(onSubmit.mock.calls[0][1]).toBe("default");
+  });
+
+  it("renders no fast-tier switch for a fresh cursor composer (Auto has no tier dimension)", async () => {
+    render(
+      <SessionComposer onSubmit={vi.fn()} harness="cursor" />,
+      { wrapper: createWrapper(createMinimalStigmerMock(), { models: [FAST_CAPABLE, AUTO, NO_FAST] }) },
+    );
+
+    fireEvent.click(screen.getByRole("button", { name: /Auto/ }));
+    // Popover content mounts async; settle on the options area appearing.
+    await screen.findByRole("dialog");
+    expect(screen.queryByRole("switch", { name: "Fast tier" })).toBeNull();
+  });
+
+  it("drops an armed fast tier when a prop-driven model change lands on a model without a fast variant", async () => {
+    const onSubmit = vi.fn();
+    const wrapper = createWrapper(createMinimalStigmerMock(), {
+      models: [FAST_CAPABLE, AUTO, NO_FAST],
+    });
+    const { rerender } = render(
+      <SessionComposer onSubmit={onSubmit} harness="cursor" defaultModelId="composer-2.5" />,
+      { wrapper },
+    );
+
+    // Arm fast on the fast-capable model (user-driven), then let the host
+    // re-sync `defaultModelId` onto a model with no fast variant — the
+    // path that bypasses ModelSelector's user-pick reset.
+    await toggleFastTier(/Composer 2\.5/);
+    rerender(
+      <SessionComposer onSubmit={onSubmit} harness="cursor" defaultModelId="gpt-5.3-codex" />,
+    );
+
+    submitMessage("resynced");
+
+    await waitFor(() => expect(onSubmit).toHaveBeenCalledOnce());
+    expect(onSubmit.mock.calls[0][1]).toBe("gpt-5.3-codex");
+    // The armed tier is unsendable, not just unstyled (#357 fail-closed rule).
+    expect(onSubmit.mock.calls[0][2]?.serviceTier).toBeUndefined();
+  });
+
+  it("never adopts a default while the model selector is hidden (the hider owns the model)", async () => {
+    const onSubmit = vi.fn();
+    render(
+      <SessionComposer onSubmit={onSubmit} harness="cursor" showModelSelector={false} />,
+      { wrapper: createWrapper(createMinimalStigmerMock(), { models: [FAST_CAPABLE, AUTO, NO_FAST] }) },
+    );
+
+    submitMessage("guest-shaped send");
+
+    // No pill, no promise: guests' server-side profile (and #664 pins)
+    // own the model — the composer must not invent one.
+    await waitFor(() => expect(onSubmit).toHaveBeenCalledOnce());
+    expect(onSubmit.mock.calls[0][1]).toBeUndefined();
+  });
+
+  it("adopts the displayed default over a model id the registry no longer lists", async () => {
+    const onSubmit = vi.fn();
+    render(
+      <SessionComposer onSubmit={onSubmit} harness="cursor" defaultModelId="retired-model" />,
+      { wrapper: createWrapper(createMinimalStigmerMock(), { models: [FAST_CAPABLE, AUTO, NO_FAST] }) },
+    );
+
+    submitMessage("stale id");
+
+    // The pill cannot display "retired-model" (unknown → falls back to the
+    // harness default), so the payload must not carry it either.
+    await waitFor(() => expect(onSubmit).toHaveBeenCalledOnce());
+    expect(onSubmit.mock.calls[0][1]).toBe("default");
+  });
+
+  it("passes the raw model id through while the registry is still loading", async () => {
+    const onSubmit = vi.fn();
+    render(
+      <SessionComposer onSubmit={onSubmit} harness="cursor" defaultModelId="composer-2.5" />,
+      { wrapper: createWrapper(createMinimalStigmerMock(), { models: [], isLoading: true }) },
+    );
+
+    submitMessage("early send");
+
+    // Nothing can be classified mid-load: adopt nothing, rewrite nothing.
+    await waitFor(() => expect(onSubmit).toHaveBeenCalledOnce());
+    expect(onSubmit.mock.calls[0][1]).toBe("composer-2.5");
+  });
+});

package/src/composer/__tests__/SessionComposer-visionPreflight.test.tsx

@@ -0,0 +1,222 @@
+import { describe, it, expect, vi, afterEach } from "vitest";
+import { render, screen, cleanup, fireEvent, act } from "@testing-library/react";
+import type { ReactNode } from "react";
+import type { Stigmer } from "@stigmer/sdk";
+import { StigmerContext } from "../../context";
+import { ModelRegistryContext } from "../../models/ModelRegistryContext";
+import type { ModelRegistryState } from "../../models/ModelRegistryContext";
+import { parseRegistryDocument } from "../../models/registry";
+import type { VisionLimits } from "../../models/registry";
+import { SessionComposer } from "../SessionComposer";
+
+// ---------------------------------------------------------------------------
+// Helpers
+// ---------------------------------------------------------------------------
+
+/** The production budget the registry advertises (3 MiB / 4 MiB / 10). */
+const LIMITS: VisionLimits = {
+  maxImageBytes: 3 * 1024 * 1024,
+  maxTotalBytes: 4 * 1024 * 1024,
+  maxImages: 10,
+};
+
+/**
+ * Registry fixture routed through the REAL document parser so this test
+ * also breaks if the parse contract drifts. kimi-k3 mirrors the live
+ * registry's explicitly-blind cursor model.
+ */
+const REGISTRY_DOCUMENT = parseRegistryDocument({
+  limits: { vision: { ...LIMITS } },
+  models: [
+    {
+      id: "claude-sonnet-4.6",
+      displayName: "Claude Sonnet 4.6",
+      provider: "anthropic",
+      harness: "native",
+      costTier: "standard",
+      featured: true,
+      capabilities: { toolUse: true, vision: true, streaming: true, thinking: true, adaptiveThinking: false },
+      pricing: { inputPricePerMillion: 3, outputPricePerMillion: 15, cacheWritePricePerMillion: 3.75, cacheReadPricePerMillion: 0.3 },
+    },
+    {
+      id: "kimi-k3",
+      displayName: "Kimi K3",
+      provider: "moonshot",
+      harness: "cursor",
+      costTier: "economy",
+      featured: false,
+      capabilities: { toolUse: true, vision: false, streaming: true, thinking: false, adaptiveThinking: false },
+      pricing: { inputPricePerMillion: 1, outputPricePerMillion: 3, cacheWritePricePerMillion: 1, cacheReadPricePerMillion: 0.1 },
+    },
+  ],
+});
+
+function createUploadMockClient(): Stigmer {
+  return {
+    agentExecution: {
+      uploadAttachment: vi.fn().mockResolvedValue({ storageKey: "attachments/test/file" }),
+    },
+    environment: { getPersonal: vi.fn().mockResolvedValue(null) },
+    baseUrl: "http://localhost:8080",
+    getAuthCredential: vi.fn().mockResolvedValue("test-token"),
+    config: {
+      baseUrl: "http://localhost:8080",
+      getAccessToken: vi.fn().mockResolvedValue(""),
+    },
+  } as unknown as Stigmer;
+}
+
+function createWrapper(registry?: Partial<ModelRegistryState>) {
+  const client = createUploadMockClient();
+  const state: ModelRegistryState = {
+    models: REGISTRY_DOCUMENT.models,
+    visionLimits: REGISTRY_DOCUMENT.visionLimits,
+    isLoading: false,
+    error: null,
+    refetch: vi.fn(),
+    ...registry,
+  };
+  return function Wrapper({ children }: { children: ReactNode }) {
+    return (
+      <StigmerContext.Provider value={client}>
+        <ModelRegistryContext.Provider value={state}>
+          {children}
+        </ModelRegistryContext.Provider>
+      </StigmerContext.Provider>
+    );
+  };
+}
+
+function pngFile(name: string, sizeBytes: number): File {
+  return new File([new Uint8Array(sizeBytes)], name, { type: "image/png" });
+}
+
+function pasteFiles(textarea: Element, files: File[]) {
+  fireEvent.paste(textarea, {
+    clipboardData: {
+      files: files as unknown as FileList,
+      getData: () => "",
+      types: ["Files"],
+    },
+  });
+}
+
+const OVERSIZED = Math.round(3.6 * 1024 * 1024);
+const SMALL = 64 * 1024;
+
+afterEach(cleanup);
+
+// ---------------------------------------------------------------------------
+// Tests
+// ---------------------------------------------------------------------------
+
+describe("SessionComposer — vision preflight notice (#365, #386)", () => {
+  it("warns at paste time when an image exceeds the advertised per-image cap", async () => {
+    render(<SessionComposer onSubmit={vi.fn()} />, { wrapper: createWrapper() });
+    const textarea = screen.getByRole("textbox");
+
+    await act(async () => {
+      pasteFiles(textarea, [pngFile("screenshot.png", OVERSIZED)]);
+    });
+
+    const notice = screen.getByText(
+      /screenshot\.png \(3\.6 MB\) exceeds the 3\.0 MB inline-image limit/,
+    );
+    expect(notice).toBeTruthy();
+    expect(notice.closest('[role="status"]')).toBeTruthy();
+  });
+
+  it("stays silent for images within the budget", async () => {
+    render(<SessionComposer onSubmit={vi.fn()} />, { wrapper: createWrapper() });
+    const textarea = screen.getByRole("textbox");
+
+    await act(async () => {
+      pasteFiles(textarea, [pngFile("small.png", SMALL)]);
+    });
+
+    expect(screen.queryByText(/inline-image/)).toBeNull();
+  });
+
+  it("stays silent when the server advertises no limits (older server, tri-state)", async () => {
+    render(<SessionComposer onSubmit={vi.fn()} />, {
+      wrapper: createWrapper({ visionLimits: undefined }),
+    });
+    const textarea = screen.getByRole("textbox");
+
+    await act(async () => {
+      pasteFiles(textarea, [pngFile("huge.png", OVERSIZED)]);
+    });
+
+    expect(screen.queryByText(/inline-image/)).toBeNull();
+  });
+
+  it("clears the warning when the offending attachment is removed", async () => {
+    render(<SessionComposer onSubmit={vi.fn()} />, { wrapper: createWrapper() });
+    const textarea = screen.getByRole("textbox");
+
+    await act(async () => {
+      pasteFiles(textarea, [pngFile("screenshot.png", OVERSIZED)]);
+    });
+    expect(screen.getByText(/exceeds the 3\.0 MB inline-image limit/)).toBeTruthy();
+
+    const removeButton = screen.getByRole("button", { name: /remove screenshot\.png/i });
+    await act(async () => {
+      fireEvent.click(removeButton);
+    });
+
+    expect(screen.queryByText(/inline-image/)).toBeNull();
+  });
+
+  it("leads with the model when the selected model is explicitly blind", async () => {
+    render(
+      <SessionComposer onSubmit={vi.fn()} defaultModelId="cursor/kimi-k3" />,
+      { wrapper: createWrapper() },
+    );
+    const textarea = screen.getByRole("textbox");
+
+    await act(async () => {
+      pasteFiles(textarea, [pngFile("tiny.png", SMALL)]);
+    });
+
+    expect(
+      screen.getByText(
+        "Kimi K3 can't view images — attached images will reach the agent as files only.",
+      ),
+    ).toBeTruthy();
+  });
+
+  it("never warns about non-image attachments on a blind model", async () => {
+    render(
+      <SessionComposer onSubmit={vi.fn()} defaultModelId="cursor/kimi-k3" />,
+      { wrapper: createWrapper() },
+    );
+    const textarea = screen.getByRole("textbox");
+
+    await act(async () => {
+      pasteFiles(textarea, [
+        new File([new Uint8Array(SMALL)], "notes.pdf", { type: "application/pdf" }),
+      ]);
+    });
+
+    expect(screen.queryByText(/can't view images/)).toBeNull();
+  });
+
+  it("does not gate the send — the warned message still submits with the attachment", async () => {
+    const onSubmit = vi.fn();
+    render(<SessionComposer onSubmit={onSubmit} />, { wrapper: createWrapper() });
+    const textarea = screen.getByRole("textbox");
+
+    await act(async () => {
+      pasteFiles(textarea, [pngFile("screenshot.png", OVERSIZED)]);
+    });
+    expect(screen.getByText(/exceeds the 3\.0 MB inline-image limit/)).toBeTruthy();
+
+    await act(async () => {
+      fireEvent.change(textarea, { target: { value: "look at this anyway" } });
+      fireEvent.keyDown(textarea, { key: "Enter", shiftKey: false });
+    });
+
+    expect(onSubmit).toHaveBeenCalledTimes(1);
+    expect(onSubmit.mock.calls[0][2]?.attachments).toHaveLength(1);
+  });
+});