@stigmer/react 1.0.4 → 2.0.0

package/src/workflow/templates/__tests__/workflow-template-gallery.test.ts

@@ -0,0 +1,147 @@
+import { describe, it, expect } from "vitest";
+import { WORKFLOW_TEMPLATES } from "../../../resource-creation/templates/workflow-templates";
+import { deriveTemplateMeta } from "../derive-template-metadata";
+
+describe("WORKFLOW_TEMPLATES", () => {
+  it("has 8 templates", () => {
+    expect(WORKFLOW_TEMPLATES).toHaveLength(8);
+  });
+
+  it("every template has a unique id", () => {
+    const ids = WORKFLOW_TEMPLATES.map((t) => t.id);
+    expect(new Set(ids).size).toBe(ids.length);
+  });
+
+  it("every template has required fields", () => {
+    for (const template of WORKFLOW_TEMPLATES) {
+      expect(template.id).toBeTruthy();
+      expect(template.name).toBeTruthy();
+      expect(template.description).toBeTruthy();
+      expect(template.category).toBeTruthy();
+      expect(template.data.yaml).toBeTruthy();
+    }
+  });
+
+  it("every template YAML parses to non-zero task count", () => {
+    for (const template of WORKFLOW_TEMPLATES) {
+      const meta = deriveTemplateMeta(template.data.yaml ?? "");
+      expect(meta.taskCount).toBeGreaterThan(0);
+    }
+  });
+
+  it("every template has at least one detected pattern", () => {
+    for (const template of WORKFLOW_TEMPLATES) {
+      const meta = deriveTemplateMeta(template.data.yaml ?? "");
+      expect(meta.patterns.length).toBeGreaterThan(0);
+    }
+  });
+
+  it("templates cover expected categories", () => {
+    const categories = new Set(WORKFLOW_TEMPLATES.map((t) => t.category));
+    expect(categories.has("data-analysis")).toBe(true);
+    expect(categories.has("customer-support")).toBe(true);
+    expect(categories.has("content")).toBe(true);
+    expect(categories.has("integration")).toBe(true);
+  });
+
+  it("templates collectively cover key task kinds", () => {
+    const allKinds = new Set<string>();
+    for (const template of WORKFLOW_TEMPLATES) {
+      const meta = deriveTemplateMeta(template.data.yaml ?? "");
+      for (const kind of meta.taskKinds) allKinds.add(kind);
+    }
+
+    expect(allKinds.has("llm_call")).toBe(true);
+    expect(allKinds.has("agent_call")).toBe(true);
+    expect(allKinds.has("http_call")).toBe(true);
+    expect(allKinds.has("switch_case")).toBe(true);
+    expect(allKinds.has("fork")).toBe(true);
+    expect(allKinds.has("for_each")).toBe(true);
+    expect(allKinds.has("try_catch")).toBe(true);
+    expect(allKinds.has("transform")).toBe(true);
+    expect(allKinds.has("human_input")).toBe(true);
+    expect(allKinds.has("set_vars")).toBe(true);
+  });
+
+  it("templates collectively cover key patterns", () => {
+    const allPatterns = new Set<string>();
+    for (const template of WORKFLOW_TEMPLATES) {
+      const meta = deriveTemplateMeta(template.data.yaml ?? "");
+      for (const p of meta.patterns) allPatterns.add(p);
+    }
+
+    expect(allPatterns.has("parallel")).toBe(true);
+    expect(allPatterns.has("branching")).toBe(true);
+    expect(allPatterns.has("hitl")).toBe(true);
+    expect(allPatterns.has("loop")).toBe(true);
+    expect(allPatterns.has("error-handling")).toBe(true);
+    expect(allPatterns.has("batch")).toBe(true);
+    expect(allPatterns.has("ai-pipeline")).toBe(true);
+    expect(allPatterns.has("http-integration")).toBe(true);
+  });
+});
+
+describe("individual template metadata", () => {
+  it("research-and-summarize has parallel and hitl patterns", () => {
+    const template = WORKFLOW_TEMPLATES.find(
+      (t) => t.id === "research-and-summarize",
+    )!;
+    const meta = deriveTemplateMeta(template.data.yaml ?? "");
+    expect(meta.patterns).toContain("parallel");
+    expect(meta.patterns).toContain("hitl");
+    expect(meta.taskCount).toBe(5);
+  });
+
+  it("support-ticket-triage has branching and hitl patterns", () => {
+    const template = WORKFLOW_TEMPLATES.find(
+      (t) => t.id === "support-ticket-triage",
+    )!;
+    const meta = deriveTemplateMeta(template.data.yaml ?? "");
+    expect(meta.patterns).toContain("branching");
+    expect(meta.patterns).toContain("hitl");
+    expect(meta.taskCount).toBe(6);
+  });
+
+  it("content-review-pipeline has loop and hitl patterns", () => {
+    const template = WORKFLOW_TEMPLATES.find(
+      (t) => t.id === "content-review-pipeline",
+    )!;
+    const meta = deriveTemplateMeta(template.data.yaml ?? "");
+    expect(meta.patterns).toContain("loop");
+    expect(meta.patterns).toContain("hitl");
+  });
+
+  it("batch-data-enrichment has batch and http-integration patterns", () => {
+    const template = WORKFLOW_TEMPLATES.find(
+      (t) => t.id === "batch-data-enrichment",
+    )!;
+    const meta = deriveTemplateMeta(template.data.yaml ?? "");
+    expect(meta.patterns).toContain("batch");
+    expect(meta.patterns).toContain("http-integration");
+  });
+
+  it("multi-agent-pipeline has ai-pipeline pattern", () => {
+    const template = WORKFLOW_TEMPLATES.find(
+      (t) => t.id === "multi-agent-pipeline",
+    )!;
+    const meta = deriveTemplateMeta(template.data.yaml ?? "");
+    expect(meta.patterns).toContain("ai-pipeline");
+  });
+
+  it("error-resilient-integration has error-handling pattern", () => {
+    const template = WORKFLOW_TEMPLATES.find(
+      (t) => t.id === "error-resilient-integration",
+    )!;
+    const meta = deriveTemplateMeta(template.data.yaml ?? "");
+    expect(meta.patterns).toContain("error-handling");
+  });
+
+  it("webhook-event-processor has branching and http-integration", () => {
+    const template = WORKFLOW_TEMPLATES.find(
+      (t) => t.id === "webhook-event-processor",
+    )!;
+    const meta = deriveTemplateMeta(template.data.yaml ?? "");
+    expect(meta.patterns).toContain("branching");
+    expect(meta.patterns).toContain("http-integration");
+  });
+});

package/src/workflow/templates/derive-template-metadata.ts

@@ -0,0 +1,150 @@
+import { parse as parseYaml } from "yaml";
+import type { WorkflowTemplateMeta, WorkflowPattern } from "./types";
+
+/**
+ * Derive display metadata from a workflow template's YAML string.
+ *
+ * This is a pure function with no React or SDK dependencies — it parses
+ * the YAML, walks the task list, and returns counts, kinds, and detected
+ * structural patterns. Used by the gallery card and preview dialog.
+ *
+ * If the YAML fails to parse, returns a safe zero-value result so the
+ * gallery card still renders (graceful degradation).
+ */
+export function deriveTemplateMeta(yaml: string): WorkflowTemplateMeta {
+  try {
+    const doc = parseYaml(yaml);
+    const spec = doc?.spec;
+    if (!spec) return EMPTY_META;
+
+    const tasks: RawTask[] = Array.isArray(spec.tasks) ? spec.tasks : [];
+    const taskKinds = new Set<string>();
+    for (const task of tasks) {
+      if (typeof task.kind === "string") {
+        taskKinds.add(task.kind);
+      }
+      collectNestedKinds(task, taskKinds);
+    }
+
+    const envMap = spec.env;
+    const envVarCount =
+      envMap && typeof envMap === "object" ? Object.keys(envMap).length : 0;
+
+    const hasBudget = spec.budget != null && typeof spec.budget === "object";
+
+    const patterns = detectPatterns(tasks, taskKinds);
+
+    return {
+      taskCount: tasks.length,
+      taskKinds: [...taskKinds].sort(),
+      patterns,
+      envVarCount,
+      hasBudget,
+    };
+  } catch {
+    return EMPTY_META;
+  }
+}
+
+const EMPTY_META: WorkflowTemplateMeta = {
+  taskCount: 0,
+  taskKinds: [],
+  patterns: [],
+  envVarCount: 0,
+  hasBudget: false,
+};
+
+interface RawTask {
+  name?: string;
+  kind?: string;
+  task_config?: Record<string, unknown>;
+  flow?: { then?: string };
+}
+
+/**
+ * Collect task kinds from nested structures (fork branches,
+ * try_catch do/catch blocks, for_each do lists).
+ */
+function collectNestedKinds(task: RawTask, kinds: Set<string>): void {
+  const config = task.task_config;
+  if (!config) return;
+
+  // fork branches
+  const branches = config.branches;
+  if (Array.isArray(branches)) {
+    for (const branch of branches) {
+      const doTasks = branch?.do;
+      if (Array.isArray(doTasks)) {
+        for (const nested of doTasks) {
+          if (typeof nested?.kind === "string") kinds.add(nested.kind);
+          collectNestedKinds(nested as RawTask, kinds);
+        }
+      }
+    }
+  }
+
+  // try_catch: do / catch
+  const tryDo = config.do;
+  if (Array.isArray(tryDo)) {
+    for (const nested of tryDo) {
+      if (typeof nested?.kind === "string") kinds.add(nested.kind);
+      collectNestedKinds(nested as RawTask, kinds);
+    }
+  }
+  const catchBlocks = config.catch;
+  if (Array.isArray(catchBlocks)) {
+    for (const block of catchBlocks) {
+      const catchDo = (block as Record<string, unknown>)?.do;
+      if (Array.isArray(catchDo)) {
+        for (const nested of catchDo) {
+          if (typeof nested?.kind === "string") kinds.add(nested.kind);
+          collectNestedKinds(nested as RawTask, kinds);
+        }
+      }
+    }
+  }
+
+  // for_each: do
+  const forDo = config.do;
+  if (Array.isArray(forDo) && task.kind === "for_each") {
+    for (const nested of forDo) {
+      if (typeof nested?.kind === "string") kinds.add(nested.kind);
+      collectNestedKinds(nested as RawTask, kinds);
+    }
+  }
+}
+
+function detectPatterns(
+  tasks: RawTask[],
+  kinds: Set<string>,
+): WorkflowPattern[] {
+  const patterns: WorkflowPattern[] = [];
+
+  if (kinds.has("fork")) patterns.push("parallel");
+  if (kinds.has("switch_case")) patterns.push("branching");
+  if (kinds.has("human_input")) patterns.push("hitl");
+  if (kinds.has("for_each")) patterns.push("batch");
+  if (kinds.has("try_catch")) patterns.push("error-handling");
+
+  if (kinds.has("http_call") || kinds.has("grpc_call")) {
+    patterns.push("http-integration");
+  }
+
+  const aiKinds = ["agent_call", "llm_call", "eval"];
+  const aiCount = aiKinds.filter((k) => kinds.has(k)).length;
+  if (aiCount >= 2 || (kinds.has("agent_call") && tasks.filter((t) => t.kind === "agent_call").length >= 2)) {
+    patterns.push("ai-pipeline");
+  }
+
+  // Detect loops: any task's flow.then references an earlier task
+  const taskNames = tasks.map((t) => t.name).filter(Boolean);
+  for (let i = 0; i < tasks.length; i++) {
+    const thenTarget = tasks[i]?.flow?.then;
+    if (thenTarget && taskNames.indexOf(thenTarget) < i) {
+      patterns.push("loop");
+      break;
+    }
+  }
+
+  return patterns;
+}

package/src/workflow/templates/index.ts

@@ -0,0 +1,20 @@
+// Types
+export type {
+  WorkflowTemplateData,
+  WorkflowTemplateCategory,
+  WorkflowTemplateMeta,
+  WorkflowPattern,
+  WorkflowTemplate,
+} from "./types";
+export { PATTERN_LABELS, WORKFLOW_CATEGORY_LABELS } from "./types";
+
+// Pure derivation
+export { deriveTemplateMeta } from "./derive-template-metadata";
+
+// Gallery components (added in Phase 2)
+export { WorkflowTemplateCard } from "./WorkflowTemplateCard";
+export type { WorkflowTemplateCardProps } from "./WorkflowTemplateCard";
+export { WorkflowTemplatePreview } from "./WorkflowTemplatePreview";
+export type { WorkflowTemplatePreviewProps } from "./WorkflowTemplatePreview";
+export { WorkflowTemplateGallery } from "./WorkflowTemplateGallery";
+export type { WorkflowTemplateGalleryProps } from "./WorkflowTemplateGallery";

package/src/workflow/templates/types.ts

@@ -0,0 +1,86 @@
+import type { ResourceTemplate, TemplateCategory } from "../../resource-creation/templates/types";
+
+/**
+ * Workflow-specific template categories for the gallery filter tabs.
+ *
+ * These extend the shared `TemplateCategory` type with workflow-specific
+ * use-case domains. The gallery renders them as filterable tabs alongside
+ * the generic categories.
+ */
+export type WorkflowTemplateCategory = TemplateCategory;
+
+/**
+ * Human-readable labels for workflow template categories.
+ */
+export const WORKFLOW_CATEGORY_LABELS: Record<WorkflowTemplateCategory, string> =
+  {
+    "customer-support": "Customer Support",
+    "code-review": "Code Review",
+    "data-analysis": "Data Analysis",
+    devops: "DevOps",
+    content: "Content",
+    integration: "Integration",
+    general: "General",
+  };
+
+/**
+ * The data payload carried by a workflow template.
+ *
+ * Unlike agent templates (which carry form fields for a wizard),
+ * workflow templates carry the full YAML string. Selecting a template
+ * opens the editor with this YAML as `initialYaml`.
+ */
+export interface WorkflowTemplateData {
+  /** Full workflow YAML including apiVersion/kind/metadata/spec envelope. */
+  readonly yaml: string;
+}
+
+/**
+ * A structural workflow pattern detected in a template's YAML.
+ *
+ * Pattern badges help users visually identify what a template
+ * demonstrates without reading the full YAML.
+ */
+export type WorkflowPattern =
+  | "parallel"
+  | "branching"
+  | "hitl"
+  | "loop"
+  | "error-handling"
+  | "batch"
+  | "ai-pipeline"
+  | "http-integration";
+
+/** Human-readable labels for pattern badges. */
+export const PATTERN_LABELS: Record<WorkflowPattern, string> = {
+  parallel: "Parallel",
+  branching: "Branching",
+  hitl: "Human-in-the-Loop",
+  loop: "Loop",
+  "error-handling": "Error Handling",
+  batch: "Batch Processing",
+  "ai-pipeline": "AI Pipeline",
+  "http-integration": "HTTP Integration",
+};
+
+/**
+ * Metadata derived from a workflow template's YAML content.
+ *
+ * Computed once at render time by `deriveTemplateMeta()` and displayed
+ * on template cards and preview dialogs.
+ */
+export interface WorkflowTemplateMeta {
+  /** Number of top-level tasks (excludes nested tasks inside fork/try_catch/for_each). */
+  readonly taskCount: number;
+  /** Unique task kind strings used in the template. */
+  readonly taskKinds: readonly string[];
+  /** Structural patterns detected in the template. */
+  readonly patterns: readonly WorkflowPattern[];
+  /** Number of environment variable declarations. */
+  readonly envVarCount: number;
+  /** Whether the template declares a budget. */
+  readonly hasBudget: boolean;
+}
+
+/** Workflow template = generic ResourceTemplate with workflow-specific data. */
+export type WorkflowTemplate = ResourceTemplate<WorkflowTemplateData>;

package/src/workflow/topologyFromTasks.ts

@@ -0,0 +1,134 @@
+import { WorkflowTaskKind } from "@stigmer/protos/ai/stigmer/agentic/workflow/v1/enum_pb";
+import type { WorkflowTask } from "@stigmer/protos/ai/stigmer/agentic/workflow/v1/spec_pb";
+import type {
+  TopologyNode,
+  TopologyEdge,
+  UseWorkflowTopologyReturn,
+} from "./useWorkflowTopology";
+import { categorizeKind } from "./kind-metadata";
+
+const NODE_WIDTH = 180;
+const NODE_HEIGHT = 40;
+
+const EMPTY: UseWorkflowTopologyReturn = { nodes: [], edges: [] };
+
+/**
+ * Builds a DAG topology directly from proto `WorkflowTask[]`.
+ *
+ * Mirrors the logic in {@link useWorkflowTopology} but operates on
+ * typed proto objects instead of parsed YAML, eliminating the need
+ * for a round-trip through YAML serialization and re-parsing.
+ *
+ * Handles sequential flow, explicit `flow.then` directives, and
+ * `switch_case` branching edges.
+ */
+export function topologyFromTasks(
+  tasks: readonly WorkflowTask[],
+): UseWorkflowTopologyReturn {
+  if (tasks.length === 0) return EMPTY;
+
+  const nodes: TopologyNode[] = [];
+  const edges: TopologyEdge[] = [];
+  const taskNameSet = new Set(tasks.map((t) => t.name));
+
+  nodes.push({
+    id: "__start__",
+    label: "Start",
+    kind: "start",
+    category: "start",
+    x: 0,
+    y: 0,
+    width: NODE_WIDTH,
+    height: NODE_HEIGHT,
+  });
+
+  for (const task of tasks) {
+    const kindStr = kindToString(task.kind);
+    nodes.push({
+      id: task.name,
+      label: task.name,
+      kind: kindStr,
+      category: categorizeKind(kindStr),
+      x: 0,
+      y: 0,
+      width: NODE_WIDTH,
+      height: NODE_HEIGHT,
+    });
+  }
+
+  edges.push({ source: "__start__", target: tasks[0].name });
+
+  const tasksWithEndFlow = new Set<string>();
+
+  for (let i = 0; i < tasks.length; i++) {
+    const task = tasks[i];
+    const thenTarget = task.flow?.then;
+
+    if (thenTarget === "end") {
+      tasksWithEndFlow.add(task.name);
+      continue;
+    }
+
+    if (thenTarget && taskNameSet.has(thenTarget)) {
+      edges.push({ source: task.name, target: thenTarget });
+      continue;
+    }
+
+    if (task.kind === WorkflowTaskKind.switch_case && task.taskConfig) {
+      const cases = task.taskConfig.cases;
+      if (Array.isArray(cases)) {
+        let hasDefault = false;
+        for (const c of cases) {
+          if (c && typeof c === "object") {
+            const caseObj = c as Record<string, unknown>;
+            const caseThen = caseObj.then as string | undefined;
+            if (caseThen && taskNameSet.has(caseThen)) {
+              edges.push({
+                source: task.name,
+                target: caseThen,
+                label: (caseObj.name as string) || undefined,
+              });
+              if (!(caseObj.when as string)) hasDefault = true;
+            }
+          }
+        }
+        if (!hasDefault && i < tasks.length - 1) {
+          edges.push({ source: task.name, target: tasks[i + 1].name });
+        }
+        continue;
+      }
+    }
+
+    if (i < tasks.length - 1) {
+      edges.push({ source: task.name, target: tasks[i + 1].name });
+    } else {
+      tasksWithEndFlow.add(task.name);
+    }
+  }
+
+  if (tasksWithEndFlow.size > 0) {
+    nodes.push({
+      id: "__end__",
+      label: "End",
+      kind: "end",
+      category: "end",
+      x: 0,
+      y: 0,
+      width: NODE_WIDTH,
+      height: NODE_HEIGHT,
+    });
+
+    for (const name of tasksWithEndFlow) {
+      edges.push({ source: name, target: "__end__" });
+    }
+  }
+
+  return { nodes, edges };
+}
+
+function kindToString(kind: WorkflowTaskKind): string {
+  const entry = Object.entries(WorkflowTaskKind).find(
+    ([, v]) => v === kind && typeof v === "number",
+  );
+  return entry?.[0] ?? "unspecified";
+}

package/src/workflow/useActiveTaskName.ts

@@ -0,0 +1,80 @@
+"use client";
+
+import { useMemo } from "react";
+import type { DerivedTaskState } from "../internal/store/workflow-execution-event-store";
+
+/**
+ * Active task status returned by {@link useActiveTaskName}.
+ *
+ * `null` when no task is actively running or awaiting action.
+ */
+export interface ActiveTaskInfo {
+  /** The task name that is currently active. */
+  readonly taskName: string;
+  /** The specific status: "running" or "waiting_approval". */
+  readonly status: "running" | "waiting_approval";
+  /** Duration in milliseconds (from DerivedTaskState). */
+  readonly durationMs: number;
+  /** Agent slug if this is an agent_call task. */
+  readonly agentSlug: string;
+  /** Current tool name if agent is using a tool. */
+  readonly currentToolName: string;
+  /** Number of concurrently running tasks (>1 for fork branches). */
+  readonly concurrentCount: number;
+}
+
+/**
+ * Pure derivation hook that selects the currently active task from the
+ * task states map. Returns referentially stable output (string comparison,
+ * not array/object reference) to avoid downstream re-renders.
+ *
+ * "Active" means either `running` or `waiting_approval` — both represent
+ * states where the execution is at a specific task and the user cares
+ * about its identity.
+ *
+ * When multiple tasks are running simultaneously (fork branches), returns
+ * the first one found with a `concurrentCount` indicating parallelism.
+ * The indicator UI can use this to show "N tasks running in parallel".
+ */
+export function useActiveTaskName(
+  taskStates: ReadonlyMap<string, DerivedTaskState>,
+): ActiveTaskInfo | null {
+  return useMemo(() => {
+    let firstRunning: ActiveTaskInfo | null = null;
+    let runningCount = 0;
+
+    for (const [name, state] of taskStates) {
+      if (state.status === "waiting_approval") {
+        // Waiting approval takes priority — it's an actionable state
+        return {
+          taskName: name,
+          status: "waiting_approval",
+          durationMs: state.durationMs,
+          agentSlug: state.agentSlug,
+          currentToolName: state.currentToolName,
+          concurrentCount: 1,
+        };
+      }
+
+      if (state.status === "running") {
+        runningCount++;
+        if (!firstRunning) {
+          firstRunning = {
+            taskName: name,
+            status: "running",
+            durationMs: state.durationMs,
+            agentSlug: state.agentSlug,
+            currentToolName: state.currentToolName,
+            concurrentCount: 1,
+          };
+        }
+      }
+    }
+
+    if (firstRunning && runningCount > 1) {
+      return { ...firstRunning, concurrentCount: runningCount };
+    }
+
+    return firstRunning;
+  }, [taskStates]);
+}

package/src/workflow/useCanvasKeyboardShortcuts.ts

@@ -16,6 +16,9 @@ export interface UseCanvasKeyboardShortcutsOptions {
     sourceNodeId?: string,
   ) => void;
   readonly onDismiss: () => void;
+  readonly copySelection?: () => void;
+  readonly pasteAtCenter?: () => void;
+  readonly cutSelection?: () => void;
 }
 
 function isTextInput(target: EventTarget | null): boolean {
@@ -44,6 +47,9 @@ function isFocusInsideContainer(container: HTMLElement): boolean {
  * |-------------------|---------------------------------------|
  * | `Ctrl/Cmd+D`      | Duplicate selected node               |
  * | `Ctrl/Cmd+A`      | Select all non-sentinel nodes         |
+ * | `Ctrl/Cmd+C`      | Copy selected node(s) to clipboard    |
+ * | `Ctrl/Cmd+V`      | Paste from clipboard                  |
+ * | `Ctrl/Cmd+X`      | Cut (copy + delete)                   |
  * | `N` (bare key)    | Open task picker                      |
  * | `Escape`          | Clear selection / close open overlays |
  *
@@ -57,6 +63,9 @@ export function useCanvasKeyboardShortcuts({
   clearSelection,
   onRequestTaskPicker,
   onDismiss,
+  copySelection,
+  pasteAtCenter,
+  cutSelection,
 }: UseCanvasKeyboardShortcutsOptions): void {
   useEffect(() => {
     const container = containerRef.current;
@@ -86,6 +95,33 @@ export function useCanvasKeyboardShortcuts({
         return;
       }
 
+      // Ctrl/Cmd+C — copy selection
+      if (isMod && !e.shiftKey && !e.altKey && e.key.toLowerCase() === "c") {
+        if (isTextInput(e.target)) return;
+        e.preventDefault();
+        e.stopPropagation();
+        copySelection?.();
+        return;
+      }
+
+      // Ctrl/Cmd+V — paste
+      if (isMod && !e.shiftKey && !e.altKey && e.key.toLowerCase() === "v") {
+        if (isTextInput(e.target)) return;
+        e.preventDefault();
+        e.stopPropagation();
+        pasteAtCenter?.();
+        return;
+      }
+
+      // Ctrl/Cmd+X — cut
+      if (isMod && !e.shiftKey && !e.altKey && e.key.toLowerCase() === "x") {
+        if (isTextInput(e.target)) return;
+        e.preventDefault();
+        e.stopPropagation();
+        cutSelection?.();
+        return;
+      }
+
       // Bare-key shortcuts — skip when typing in a text field
       if (isMod || e.altKey) return;
 
@@ -130,5 +166,8 @@ export function useCanvasKeyboardShortcuts({
     clearSelection,
     onRequestTaskPicker,
     onDismiss,
+    copySelection,
+    pasteAtCenter,
+    cutSelection,
   ]);
 }