版本栏动作再分工:启停回到版本行上,新建·编辑·改名住顶条,编辑态行钮换删除

· 顶条只放**建改类**(作用于整条流/工作区):新建 · 编辑 · 改名。
    「编辑」从图卡题行迁来 —— 编辑态升成**工作区级受控状态**
    (FlowFigureBlock 的 editing 提升为受控 props):版本行的按钮语义都跟着它变,
    这不是图卡的私事。编辑中顶条示「编辑中」,收尾走画布里的 保存绘图/取消。
  · 停用/激活是**某一版**的运行时开关 —— 回到每条版本行的行尾
    (矮一号的小钮,行不发胖;行本身照旧点击切版,小钮拦冒泡)。
  · **编辑态下行钮换成删除**:正在改定义的人,手边该是版本管理,不是启停开关;
    生效版照旧禁删(先停用)。

实测:顶条 新建·编辑·改名;平时行钮 停用/激活;点编辑 → 画布进手绘、行钮变删除
(生效版灰);取消 → 行钮变回停用。五闸绿。

Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01KeDBx2PHLavbURXB8LJJ7m

apps/web/src/shared/gov/flow/FlowFigure.tsx

@@ -8,9 +8,7 @@
  *
  * `FlowFigure` 保留为只读便捷壳(任务页的流程图用它)。
  */
-import { useState } from 'react';
 import type { ProcessPackage } from '@contracts';
-import { Ico } from '@ui';
 import { FlowDiagram } from './FlowDiagram.tsx';
 import { FlowEditor } from './FlowEditor.tsx';
 import type { FlowEdge, FlowGraph } from './flow-layout.ts';
@@ -23,7 +21,8 @@ export function FlowFigureBlock({
   oneLiner,
   graph,
   drilledIds,
-  canEdit,
+  editing,
+  onEditingChange,
   onNodeClick,
   onEdgeClick,
   onEditNodeText,
@@ -34,7 +33,12 @@ export function FlowFigureBlock({
   graph: FlowGraph | null;
   /** 已建立下钻内容的节点 id(删除这些节点时编辑器会二次确认) */
   drilledIds: string[];
-  canEdit: boolean;
+  /**
+   * 编辑态**受控**(2026-07-30):「编辑」钮住版本卡顶部的动作条,不在图题上 ——
+   * 编辑与否是整个工作区的状态(版本行的按钮语义都跟着变),不是图卡的私事。
+   */
+  editing: boolean;
+  onEditingChange: (editing: boolean) => void;
   onNodeClick: (nodeId: string) => void;
   /** 点击连线选中边(属性卡随之切到该边);不传则边不可点 */
   onEdgeClick?: ((edge: FlowEdge) => void) | undefined;
@@ -43,22 +47,9 @@ export function FlowFigureBlock({
   /** 手工绘图:整图保存(idMap = 本次编辑会话 原id→现id,宿主用它重键下钻内容) */
   onSaveFlowGraph?: ((graph: FlowGraph, idMap: Record<string, string>) => Promise<void>) | undefined;
 }) {
-  const [editing, setEditing] = useState(false);
   return (
     <>
-      <div className="view-lbl">
-        流程图 · 顺序
-        {canEdit && onSaveFlowGraph !== undefined && !editing && (
-          <button
-            type="button"
-            className="g-ver-act"
-            title="手工绘图(珊格正交:活动点/审批点/起止,拖拽连线);画布内工具栏有 取消/保存绘图"
-            onClick={() => setEditing(true)}
-          >
-            <Ico name="pen-line" s={11} /> 编辑
-          </button>
-        )}
-      </div>
+      <div className="view-lbl">{editing ? '流程图 · 手工绘图' : '流程图 · 顺序'}</div>
       {editing && onSaveFlowGraph !== undefined ? (
         <div className="hero">
           <div className="cap">
@@ -70,9 +61,9 @@ export function FlowFigureBlock({
             drilledIds={drilledIds}
             onSave={async (next, idMap) => {
               await onSaveFlowGraph(next, idMap);
-              setEditing(false);
+              onEditingChange(false);
             }}
-            onCancel={() => setEditing(false)}
+            onCancel={() => onEditingChange(false)}
           />
           <Legend />
         </div>
@@ -88,7 +79,7 @@ export function FlowFigureBlock({
               variant="business"
               onNodeClick={onNodeClick}
               onEdgeClick={onEdgeClick}
-              onEditNode={canEdit ? onEditNodeText : undefined}
+              onEditNode={onEditNodeText}
               ariaLabel={`${title}业务流程图`}
             />
           </div>