@mx-sose-front/mx-sose-graph 1.1.4 → 1.1.6

package/dist/index.esm.js

@@ -4,7 +4,7 @@ var __publicField = (obj, key, value) => {
   __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
   return value;
 };
-import { ref, shallowReactive, computed, nextTick, defineComponent, openBlock, createElementBlock, normalizeStyle, withDirectives, createElementVNode, Fragment, renderList, unref, normalizeClass, withModifiers, vShow, watch, createCommentVNode, withKeys, vModelText, onMounted, onUnmounted, resolveComponent, createBlock, Teleport, createVNode, withCtx, useCssVars, resolveDynamicComponent, toDisplayString, onBeforeUnmount, isMemoSame } from "vue";
+import { ref, shallowReactive, computed, shallowRef, nextTick, triggerRef, defineComponent, openBlock, createElementBlock, normalizeStyle, withDirectives, createElementVNode, Fragment, renderList, unref, normalizeClass, withModifiers, vShow, watch, createCommentVNode, withKeys, vModelText, onMounted, onUnmounted, resolveComponent, createBlock, Teleport, createVNode, withCtx, useCssVars, resolveDynamicComponent, toDisplayString, onBeforeUnmount, isMemoSame } from "vue";
 import { defineStore, storeToRefs, setActivePinia } from "pinia";
 import ElementPlus, { ElMessage } from "element-plus";
 var v = false, o, f, s, u, d, N, l, p, m, w, D, x, E, M, F;
@@ -6435,11 +6435,13 @@ const resolveParentAfterDrag = (shapes, s2, finalRect, draggingIds, diagramId, u
 };
 const pointInRect = (pt, r, margin = 0) => pt.x >= r.x + margin && pt.x <= r.x + r.width - margin && pt.y >= r.y + margin && pt.y <= r.y + r.height - margin;
 const depthOf = (shapes, id) => {
+  const graphStore = useGraphStore();
+  const byId = graphStore.shapeMap;
   let d2 = 0;
-  let p2 = shapes.find((s2) => s2.id === id)?.parenShapeId ?? null;
+  let p2 = byId.get(id)?.parenShapeId ?? null;
   while (p2) {
     d2++;
-    p2 = shapes.find((s2) => s2.id === p2)?.parenShapeId ?? null;
+    p2 = byId.get(p2)?.parenShapeId ?? null;
   }
   return d2;
 };
@@ -6601,9 +6603,11 @@ function normalizeZOrder(shapes, diagramId, updateShape, baseZ = 1, step = 1) {
   }
 }
 const buildDragSnapshot = (shapes, ids) => {
+  const graphStore = useGraphStore();
+  const byId = graphStore.shapeMap;
   const dragBase = {};
   ids.forEach((id) => {
-    const s2 = shapes.find((x2) => x2.id === id);
+    const s2 = byId.get(id);
     if (!s2)
       return;
     const b2 = getBounds(s2);
@@ -6621,7 +6625,8 @@ const buildDragSnapshot = (shapes, ids) => {
   return { dragBase, groupBaseBox };
 };
 const stepSingleDrag = (shapes, id, pointer, dragOffset, dragBase, diagramId, constrainEdges, hitPointer) => {
-  const s2 = shapes.find((x2) => x2.id === id);
+  const graphStore = useGraphStore();
+  const s2 = graphStore.shapeMap.get(id);
   if (!s2)
     return { ghost: {}, hover: null };
   const base = dragBase[id];
@@ -6649,6 +6654,8 @@ const stepSingleDrag = (shapes, id, pointer, dragOffset, dragBase, diagramId, co
   };
 };
 const stepGroupDrag = (shapes, draggingIds, primaryId, pointer, dragAnchor, groupBaseBox) => {
+  const graphStore = useGraphStore();
+  const byId = graphStore.shapeMap;
   const diagramRect = getDiagramRect(shapes);
   const dxRaw = pointer.x - dragAnchor.x;
   const dyRaw = pointer.y - dragAnchor.y;
@@ -6662,13 +6669,13 @@ const stepGroupDrag = (shapes, draggingIds, primaryId, pointer, dragAnchor, grou
   const dy = gy - groupBaseBox.y;
   const ghost = {};
   for (const id of draggingIds) {
-    const s2 = shapes.find((x2) => x2.id === id);
+    const s2 = byId.get(id);
     if (!s2)
       continue;
     const b2 = getBounds(s2);
     ghost[id] = { x: b2.x + dx, y: b2.y + dy, width: b2.width, height: b2.height };
   }
-  const priShape = shapes.find((x2) => x2.id === primaryId);
+  const priShape = byId.get(primaryId);
   const diagramId = priShape?.diagramId || "";
   const hoverShape = pickContainerByPointerTopmost(
     shapes,
@@ -6682,7 +6689,18 @@ const stepGroupDrag = (shapes, draggingIds, primaryId, pointer, dragAnchor, grou
   return { ghost, hover };
 };
 const commitDrag = (shapes, draggingIds, ghost, _currentDiagramId, updateShape, baseMap) => {
+  const graphStore = useGraphStore();
+  const parentChildMap = graphStore.parentChildMap;
   const changedIds = /* @__PURE__ */ new Set();
+  const collectAllDescendants = (parentId) => {
+    const result = [];
+    const children = parentChildMap.get(parentId) || [];
+    for (const childId of children) {
+      result.push(childId);
+      result.push(...collectAllDescendants(childId));
+    }
+    return result;
+  };
   for (const id of draggingIds) {
     const s2 = shapes.find((x2) => x2.id === id);
     const r = ghost[id];
@@ -6695,10 +6713,32 @@ const commitDrag = (shapes, draggingIds, ghost, _currentDiagramId, updateShape,
       height: Math.round(r.height)
     };
     const pb = baseMap?.[id] ?? s2.bounds;
-    const same = pb.x === nb.x && pb.y === nb.y && pb.width === nb.width && pb.height === nb.height;
+    const dx = nb.x - pb.x;
+    const dy = nb.y - pb.y;
+    const same = dx === 0 && dy === 0 && nb.width === pb.width && nb.height === pb.height;
     if (!same) {
       updateShape(id, { bounds: nb });
       changedIds.add(id);
+      if (dx !== 0 || dy !== 0) {
+        const descendants = collectAllDescendants(id);
+        for (const descId of descendants) {
+          if (draggingIds.includes(descId))
+            continue;
+          const descShape = shapes.find((x2) => x2.id === descId);
+          if (!descShape?.bounds)
+            continue;
+          const descBounds = descShape.bounds;
+          updateShape(descId, {
+            bounds: {
+              x: Math.round(descBounds.x + dx),
+              y: Math.round(descBounds.y + dy),
+              width: descBounds.width,
+              height: descBounds.height
+            }
+          });
+          changedIds.add(descId);
+        }
+      }
     }
   }
   return Array.from(changedIds);
@@ -8260,7 +8300,13 @@ async function applyReparentAndClone(options) {
   const graphStore = useGraphStore();
   let ownerPayload = null;
   const clonedIds = [];
-  for (const id of changedIds) {
+  const changedSet = new Set(changedIds);
+  const topLevelChangedIds = changedIds.filter((id) => {
+    const beforePid = prevParentById[id] ?? null;
+    const afterPid = shapes.find((s2) => s2.id === id)?.parenShapeId ?? null;
+    return !(beforePid && changedSet.has(beforePid)) && !(afterPid && changedSet.has(afterPid));
+  });
+  for (const id of topLevelChangedIds) {
     const after = shapes.find((s2) => s2.id === id);
     if (!after)
       continue;
@@ -8417,18 +8463,40 @@ const createOnNestDoneCallback = (options) => {
     const afterParent = JSON.stringify(parent.bounds ?? {});
     if (afterParent == beforeParent)
       return;
+    return { id: parent.id, bounds: afterParent };
   };
 };
 function createShapeOperator() {
   const indexMap = /* @__PURE__ */ new Map();
-  const ensureIndex = (list) => {
-    if (indexMap.size === list.length)
-      return;
+  const rebuildIndexAndDedupe = (list) => {
+    const seen = /* @__PURE__ */ new Set();
+    for (let i = list.length - 1; i >= 0; i--) {
+      const id = list[i]?.id;
+      if (id == null)
+        continue;
+      if (seen.has(id)) {
+        list.splice(i, 1);
+      } else {
+        seen.add(id);
+      }
+    }
     indexMap.clear();
     for (let i = 0; i < list.length; i++) {
       indexMap.set(list[i].id, i);
     }
   };
+  const ensureIndex = (list) => {
+    if (indexMap.size !== list.length) {
+      rebuildIndexAndDedupe(list);
+      return;
+    }
+    for (const [id, idx] of indexMap) {
+      if (list[idx]?.id !== id) {
+        rebuildIndexAndDedupe(list);
+        return;
+      }
+    }
+  };
   const extractIds = (payload) => {
     const ids = [];
     for (const item of payload) {
@@ -8445,10 +8513,11 @@ function createShapeOperator() {
   const removeByIdFast = (list, id) => {
     const idx = indexMap.get(id);
     if (idx == null)
-      return false;
+      return null;
     const lastIdx = list.length - 1;
     if (lastIdx < 0)
-      return false;
+      return null;
+    const removed = list[idx];
     if (idx !== lastIdx) {
       const moved = list[lastIdx];
       list[idx] = moved;
@@ -8456,46 +8525,52 @@ function createShapeOperator() {
     }
     list.pop();
     indexMap.delete(id);
-    return true;
+    return removed;
   };
   const upsertOne = (list, incoming) => {
     const id = incoming?.id;
     if (id == null)
-      return false;
+      return { changed: false, isAdd: false };
     const idx = indexMap.get(id);
     if (idx == null) {
       list.push(incoming);
       indexMap.set(id, list.length - 1);
+      return { changed: true, isAdd: true };
     } else {
+      const oldShape = list[idx];
       list[idx] = incoming;
+      return { changed: true, isAdd: false, oldShape };
     }
-    return true;
   };
   const updateOne = (list, incoming) => {
     const id = incoming?.id;
     if (id == null)
-      return false;
+      return { changed: false };
     const idx = indexMap.get(id);
     if (idx == null)
-      return false;
+      return { changed: false };
+    const oldShape = list[idx];
     list[idx] = incoming;
-    return true;
+    return { changed: true, oldShape };
   };
   const addOne = (list, incoming) => {
     const id = incoming?.id;
     if (id == null)
-      return false;
+      return { changed: false, isAdd: false };
     const idx = indexMap.get(id);
     if (idx == null) {
       list.push(incoming);
       indexMap.set(id, list.length - 1);
+      return { changed: true, isAdd: true };
     } else {
+      const oldShape = list[idx];
       list[idx] = incoming;
+      return { changed: true, isAdd: false, oldShape };
     }
-    return true;
   };
   const applyShapeOp = (args) => {
     const { list, payload, op } = args;
+    const changeDetails = [];
     if (op === "replace") {
       const incomingShapes2 = payload;
       list.length = 0;
@@ -8508,33 +8583,57 @@ function createShapeOperator() {
       for (let i = 0; i < list.length; i++) {
         indexMap.set(list[i].id, i);
       }
-      return { changedShapes: incomingShapes2 };
+      return { changedShapes: incomingShapes2, changeDetails: [] };
     }
     ensureIndex(list);
     const changedShapes = [];
     if (op === "delete") {
       const ids = extractIds(payload);
       for (const id of ids) {
-        removeByIdFast(list, id);
+        const removed = removeByIdFast(list, id);
+        if (removed) {
+          changeDetails.push({ type: "delete", shape: removed });
+        }
       }
-      return { changedShapes };
+      return { changedShapes, changeDetails };
     }
     const incomingShapes = payload;
     for (const incoming of incomingShapes) {
       if (!incoming)
         continue;
       if (op === "upsert") {
-        if (upsertOne(list, incoming))
+        const result = upsertOne(list, incoming);
+        if (result.changed) {
           changedShapes.push(incoming);
+          changeDetails.push({
+            type: result.isAdd ? "add" : "update",
+            shape: incoming,
+            oldShape: result.oldShape
+          });
+        }
       } else if (op === "update") {
-        if (updateOne(list, incoming))
+        const result = updateOne(list, incoming);
+        if (result.changed) {
           changedShapes.push(incoming);
+          changeDetails.push({
+            type: "update",
+            shape: incoming,
+            oldShape: result.oldShape
+          });
+        }
       } else if (op === "add") {
-        if (addOne(list, incoming))
+        const result = addOne(list, incoming);
+        if (result.changed) {
           changedShapes.push(incoming);
+          changeDetails.push({
+            type: result.isAdd ? "add" : "update",
+            shape: incoming,
+            oldShape: result.oldShape
+          });
+        }
       }
     }
-    return { changedShapes };
+    return { changedShapes, changeDetails };
   };
   return {
     applyShapeOp
@@ -8571,27 +8670,95 @@ const useGraphStore = defineStore(
     const externalCreatingId = ref(null);
     const cutShapeIds = ref(/* @__PURE__ */ new Set());
     const copiedShapesCount = ref(0);
+    const dragDescendantsSnapshot = ref(/* @__PURE__ */ new Map());
     const shapeCount = computed(() => shapes.value.length);
     const hasSelectedShape = computed(() => selectedShape.value !== null);
-    const parentChildMap = computed(() => {
-      const map = /* @__PURE__ */ new Map();
+    const _shapeMapRef = shallowRef(/* @__PURE__ */ new Map());
+    const shapeMap = computed(() => _shapeMapRef.value);
+    const _parentChildMapRef = shallowRef(/* @__PURE__ */ new Map());
+    const parentChildMap = computed(() => _parentChildMapRef.value);
+    function _indexAdd(shape) {
+      _shapeMapRef.value.set(shape.id, shape);
+      if (shape.parenShapeId) {
+        const children = _parentChildMapRef.value.get(shape.parenShapeId);
+        if (children) {
+          if (!children.includes(shape.id)) {
+            children.push(shape.id);
+          }
+        } else {
+          _parentChildMapRef.value.set(shape.parenShapeId, [shape.id]);
+        }
+      }
+    }
+    function _indexRemove(shapeId) {
+      const shape = _shapeMapRef.value.get(shapeId);
+      if (!shape)
+        return;
+      _shapeMapRef.value.delete(shapeId);
+      if (shape.parenShapeId) {
+        const children = _parentChildMapRef.value.get(shape.parenShapeId);
+        if (children) {
+          const idx = children.indexOf(shapeId);
+          if (idx !== -1)
+            children.splice(idx, 1);
+          if (children.length === 0) {
+            _parentChildMapRef.value.delete(shape.parenShapeId);
+          }
+        }
+      }
+      _parentChildMapRef.value.delete(shapeId);
+    }
+    function _indexUpdate(shape, oldParentId) {
+      _shapeMapRef.value.set(shape.id, shape);
+      const newParentId = shape.parenShapeId ?? null;
+      const normalizedOldParent = oldParentId ?? null;
+      if (normalizedOldParent !== newParentId) {
+        if (normalizedOldParent) {
+          const oldChildren = _parentChildMapRef.value.get(normalizedOldParent);
+          if (oldChildren) {
+            const idx = oldChildren.indexOf(shape.id);
+            if (idx !== -1)
+              oldChildren.splice(idx, 1);
+            if (oldChildren.length === 0) {
+              _parentChildMapRef.value.delete(normalizedOldParent);
+            }
+          }
+        }
+        if (newParentId) {
+          const newChildren = _parentChildMapRef.value.get(newParentId);
+          if (newChildren) {
+            if (!newChildren.includes(shape.id)) {
+              newChildren.push(shape.id);
+            }
+          } else {
+            _parentChildMapRef.value.set(newParentId, [shape.id]);
+          }
+        }
+      }
+    }
+    function _rebuildIndex() {
+      const newShapeMap = /* @__PURE__ */ new Map();
+      const newParentChildMap = /* @__PURE__ */ new Map();
       shapes.value.forEach((shape) => {
+        newShapeMap.set(shape.id, shape);
         if (shape.parenShapeId) {
-          if (!map.has(shape.parenShapeId)) {
-            map.set(shape.parenShapeId, []);
+          const children = newParentChildMap.get(shape.parenShapeId);
+          if (children) {
+            children.push(shape.id);
+          } else {
+            newParentChildMap.set(shape.parenShapeId, [shape.id]);
           }
-          map.get(shape.parenShapeId).push(shape.id);
         }
       });
-      return map;
-    });
-    const shapeMap = computed(() => {
-      const map = /* @__PURE__ */ new Map();
-      shapes.value.forEach((shape) => {
-        map.set(shape.id, shape);
-      });
-      return map;
-    });
+      _shapeMapRef.value = newShapeMap;
+      _parentChildMapRef.value = newParentChildMap;
+      triggerRef(_shapeMapRef);
+      triggerRef(_parentChildMapRef);
+    }
+    function _triggerIndexUpdate() {
+      triggerRef(_shapeMapRef);
+      triggerRef(_parentChildMapRef);
+    }
     const taggedValueLabels = ref([]);
     const packagesTypes = ref([]);
     const classMetaTypes = ref([]);
@@ -8611,7 +8778,8 @@ const useGraphStore = defineStore(
         }
       }
       shapes.value.push(shape);
-      eventBus.emit("shape-added", shape);
+      _indexAdd(shape);
+      _triggerIndexUpdate();
       const shouldAutoExpand = options?.autoExpandParent !== false;
       if (shouldAutoExpand && shape.parenShapeId && shape.bounds) {
         nextTick(() => {
@@ -8622,7 +8790,9 @@ const useGraphStore = defineStore(
     const removeShape = (shapeId) => {
       const index = shapes.value.findIndex((s2) => s2.id == shapeId);
       if (index > -1) {
-        shapes.value.splice(index, 1)[0];
+        _indexRemove(shapeId);
+        shapes.value.splice(index, 1);
+        _triggerIndexUpdate();
         if (selectedShape.value?.id === shapeId) {
           selectedShape.value = null;
           eventBus.emit("shape-deselected");
@@ -8647,6 +8817,7 @@ const useGraphStore = defineStore(
     const updateShapeRaw = (shapeId, updates, id = "id") => {
       const shape = shapes.value.find((s2) => s2[id] === shapeId);
       if (shape) {
+        const oldParentId = shape.parenShapeId;
         if (shape.shapeType === "pin" && "parenShapeId" in updates) {
           const v2 = updates.parenShapeId;
           if (v2 == null || v2 === "") {
@@ -8660,6 +8831,8 @@ const useGraphStore = defineStore(
         const nextBounds = updates.bounds ? { ...shape.bounds, ...updates.bounds } : shape.bounds;
         const nextStyle = updates.style ? { ...shape.style || {}, ...updates.style } : shape.style;
         Object.assign(shape, updates, { bounds: nextBounds, style: nextStyle });
+        _indexUpdate(shape, oldParentId);
+        _triggerIndexUpdate();
         eventBus.emit("shape-updated", shape, updates);
       }
     };
@@ -8688,25 +8861,37 @@ const useGraphStore = defineStore(
       eventBus.emit("shape-selected", shape);
     };
     const marqueeShapes = computed(() => {
-      const byId2 = (id) => shapes.value.find((s2) => s2.id === id);
-      const isShape2 = (x2) => !!x2;
       const pending = new Set(pendingNestedIds.value);
-      return selectedIds.value.map(byId2).filter(isShape2).filter((s2) => !pending.has(s2.id));
+      const result = [];
+      for (const id of selectedIds.value) {
+        if (pending.has(id))
+          continue;
+        const shape = shapeMap.value.get(id);
+        if (shape)
+          result.push(shape);
+      }
+      return result;
     });
     const ghostShadow = computed(() => {
+      if (!isDragging.value || draggingIds.value.length === 0)
+        return [];
       const out = [];
       const pendingList = Array.isArray(pendingNestedIds.value) ? pendingNestedIds.value : [];
       const pendingSet = new Set(pendingList);
+      const directDragSet = new Set(dragSelectionSnapshot.value.length > 0 ? dragSelectionSnapshot.value : draggingIds.value.slice(0, 1));
       const map = shapeMap.value;
-      for (const id in dragGhost) {
+      for (const id of directDragSet) {
         if (pendingSet.has(id))
           continue;
+        const ghostRect = dragGhost[id];
+        if (!ghostRect)
+          continue;
         const orig = map.get(id);
         if (!orig)
           continue;
         out.push({
           ...orig,
-          bounds: { ...dragGhost[id] },
+          bounds: { ...ghostRect },
           meta: { ...orig.meta, isGhost: true }
         });
       }
@@ -8714,11 +8899,16 @@ const useGraphStore = defineStore(
     });
     const selectMany = (ids) => {
       selectedIds.value = Array.from(new Set(ids));
-      selectedShape.value = ids.length ? shapes.value.find((s2) => s2.id === ids[0]) ?? null : null;
+      selectedShape.value = ids.length ? shapeMap.value.get(ids[0]) ?? null : null;
     };
     const clearSelection = () => selectShape(null);
     const selectAll = () => {
-      const allShapeIds = shapes.value.filter((shape) => shape.shapeType?.toLowerCase() !== "diagram").map((shape) => shape.id);
+      const allShapeIds = [];
+      for (const shape of shapes.value) {
+        if (shape.shapeType?.toLowerCase() !== "diagram") {
+          allShapeIds.push(shape.id);
+        }
+      }
       selectMany(allShapeIds);
     };
     const setTitle = (title) => {
@@ -8726,12 +8916,40 @@ const useGraphStore = defineStore(
       eventBus.emit("title-changed", title);
     };
     const updateShapes = (payload, op = "upsert", options) => {
-      const { changedShapes } = applyShapeOp({
+      const { changedShapes, changeDetails } = applyShapeOp({
         list: shapes.value,
         payload,
         // delete 时是 id[]，其余是 Shape[]
         op
       });
+      if (op === "replace" || changeDetails.length === 0) {
+        _rebuildIndex();
+      } else {
+        for (const detail of changeDetails) {
+          if (detail.type === "add") {
+            _indexAdd(detail.shape);
+          } else if (detail.type === "delete") {
+            _shapeMapRef.value.delete(detail.shape.id);
+            const parentId = detail.shape.parenShapeId;
+            if (parentId) {
+              const children = _parentChildMapRef.value.get(parentId);
+              if (children) {
+                const idx = children.indexOf(detail.shape.id);
+                if (idx !== -1)
+                  children.splice(idx, 1);
+                if (children.length === 0) {
+                  _parentChildMapRef.value.delete(parentId);
+                }
+              }
+            }
+            _parentChildMapRef.value.delete(detail.shape.id);
+          } else if (detail.type === "update") {
+            const oldParentId = detail.oldShape?.parenShapeId;
+            _indexUpdate(detail.shape, oldParentId);
+          }
+        }
+        _triggerIndexUpdate();
+      }
       pendingNestedIds.value = [];
       const shouldAutoExpand = options?.autoExpandParents !== false;
       if (shouldAutoExpand && changedShapes.length > 0) {
@@ -8745,6 +8963,10 @@ const useGraphStore = defineStore(
     };
     const clearAll = () => {
       shapes.value = [];
+      _shapeMapRef.value = /* @__PURE__ */ new Map();
+      _parentChildMapRef.value = /* @__PURE__ */ new Map();
+      triggerRef(_shapeMapRef);
+      triggerRef(_parentChildMapRef);
       diagrams.value = [];
       selectedShape.value = null;
       pendingNestedIds.value = [];
@@ -8757,12 +8979,7 @@ const useGraphStore = defineStore(
     const startDrag = (ids, pointer) => {
       dragSelectionSnapshot.value = selectedIds.value.length ? [...selectedIds.value] : [ids[0]];
       primaryDragId.value = ids[0] || null;
-      const expanded = [];
-      ids.forEach((id) => {
-        expanded.push(id);
-        collectDescendantIds(shapes.value, id).forEach((cid) => expanded.push(cid));
-      });
-      const validIds = Array.from(new Set(expanded)).filter((id) => {
+      const validIds = ids.filter((id) => {
         const s2 = byId(id);
         return s2 && getPolicy(s2).draggable;
       });
@@ -8777,6 +8994,29 @@ const useGraphStore = defineStore(
         dragGhost[k] = snap.dragBase[k];
       draggingIds.value = validIds;
       dragAnchor.value = { x: pointer.x, y: pointer.y };
+      const newSnapshot = /* @__PURE__ */ new Map();
+      for (const parentId of validIds) {
+        const descendants = [];
+        const collectDescendants = (pid) => {
+          const childIds = _parentChildMapRef.value.get(pid) || [];
+          for (const childId of childIds) {
+            const childShape = _shapeMapRef.value.get(childId);
+            if (childShape?.bounds) {
+              descendants.push({
+                id: childId,
+                x: childShape.bounds.x ?? 0,
+                y: childShape.bounds.y ?? 0,
+                width: childShape.bounds.width ?? 0,
+                height: childShape.bounds.height ?? 0
+              });
+            }
+            collectDescendants(childId);
+          }
+        };
+        collectDescendants(parentId);
+        newSnapshot.set(parentId, descendants);
+      }
+      dragDescendantsSnapshot.value = newSnapshot;
       const currentDiagram = shapes.value.find((s2) => s2.shapeType === "diagram");
       if (currentDiagram) {
         dragBaseCanvasSize.value = {
@@ -8989,12 +9229,28 @@ const useGraphStore = defineStore(
         updateShape(shape.id, shape);
       });
       autoExpandMovedCompartmentsAfterDrag(shapes.value, changedIds, updateShape);
+      const allReparentIds = [...changedIds, ...clonedIds];
+      const prevMapForComparents = { ...prevParentById };
+      for (const cid of clonedIds) {
+        prevMapForComparents[cid] = null;
+      }
       syncShowComparentsByReparent(
         shapes.value,
-        changedIds,
-        prevParentById,
+        allReparentIds,
+        prevMapForComparents,
         (id, u2) => updateShapeRaw(id, u2)
       );
+      const shapeId = ownerPayload?.shapeId;
+      if (shapeId != null) {
+        const child = shapes.value.find((s2) => s2.id == shapeId);
+        if (child) {
+          expandParentByChild({
+            shapes: shapes.value,
+            child,
+            updateShape
+          });
+        }
+      }
       const affectedIds = collectAffectedShapeIds$1(shapes.value, changedIds, clonedIds);
       const payloads = buildDragEndPayloads(affectedIds, shapes.value);
       const onNestDone = createOnNestDoneCallback({
@@ -9015,7 +9271,6 @@ const useGraphStore = defineStore(
           }
         }
       }
-      console.log("drag end payloads:", payloads, ownerPayload);
       eventBus.emit("shape-drag-end", payloads, ownerPayload, onNestDone);
       cleanupAfterDrag();
     };
@@ -9064,6 +9319,7 @@ const useGraphStore = defineStore(
       dragSelectionSnapshot.value = [];
       primaryDragId.value = null;
       dragBaseCanvasSize.value = null;
+      dragDescendantsSnapshot.value = /* @__PURE__ */ new Map();
       for (const k in dragGhost)
         delete dragGhost[k];
     };
@@ -9182,6 +9438,10 @@ const useGraphStore = defineStore(
       // 图元ID索引映射 (性能优化)
       marqueeShapes,
       ghostShadow,
+      dragDescendantsSnapshot,
+      // 拖动时的后代坐标快照
+      dragBase,
+      // 拖动开始时的坐标快照
       scales,
       activeDiagramId,
       // 当前活动画布的缩放比例
@@ -9234,388 +9494,19 @@ const useGraphStore = defineStore(
   }
 );
 const _imports_0 = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADwAAAA8CAYAAAA6/NlyAAAAAXNSR0IArs4c6QAAAARzQklUCAgICHwIZIgAAACbSURBVGiB7dfRCYAwDEXRVhxIcRJncC5ncBLRjXQCaSRS9eWeb4VeAqFNCQAAoJLs+fmYxuO5o/jleSn2NHWO8h0EqyNYnWtLe1xteMum9Qg3YYLVEayOYHXhglvLR10/FJ+B+7a+dom5I9yECVZHsDqC1YULNl08/nKpsAg3YYLVEayO56E6gtURrI5gdeGCeR6qCxcMAABQzQn/mxU1UF28jAAAAABJRU5ErkJggg==";
-const BlockKeyMap = {
-  "ArchitecturalDescription": "Package",
-  //体系架构
-  "Capability": "Block",
-  //能力
-  "StrategicPhase": "Block",
-  //战略阶段
-  "ActualEnterprisePhase": "Block",
-  //实际企业阶段
-  "WholeLifeEnterprise": "Block",
-  //全企业生命周期
-  "EnterpriseMission": "Block",
-  //企业使命
-  "ActualEnduringTask": "Block",
-  //实际持续任务
-  "ValueStream": "Block",
-  //价值流
-  "StrategicInformation": "Block",
-  //战略信息
-  "GeoPoliticalExtentType": "Block",
-  //地理政治范围类型
-  "CapabilityConfiguration": "Block",
-  //能力配置
-  "EnterpriseGoal": "DividingLine",
-  //企业目标
-  "EnterpriseVision": "Block",
-  //企业愿景
-  "ActualOrganization": "Block",
-  //实际组织
-  "VisionStatement": "Block",
-  //愿景宣言
-  "ActualCondition": "Block",
-  //实际情况
-  "ActualEnvironment": "Block",
-  //实际环境
-  "ActualLocation": "Block",
-  //实际位置
-  "Location": "Block",
-  //位置
-  "Condition": "Block",
-  //状况条件
-  "Environment": "Block",
-  //环境
-  "Concern": "Block",
-  //涉及
-  "ActualPost": "Block",
-  //实际职责,
-  "Strategic": "Package",
-  // 战略层
-  "StrategicTaxonomyDiagram": "Diagram",
-  //战略概念图
-  "StrategicInformationDiagram": "Diagram",
-  //战略信息图
-  "StrategicStructureDiagram": "Diagram",
-  //战略结构图
-  "StrategicConnectivityDiagram": "Diagram",
-  //战略连通图
-  // 'StrategicConnectivityMatrixDiagram':'StrategicTaxonomyDiagram', //战略连通矩阵
-  "StrategicStatesDiagram": "Diagram",
-  //战略状态图
-  "StrategicProcessesDiagram": "Diagram",
-  //战略流程图
-  "StrategicParametersDiagram": "Diagram",
-  //战略参数图
-  "StrategicConstraintsDiagram": "Diagram",
-  //战略约束图
-  "StrategicConstraintsDefinitionDiagram": "Diagram",
-  //战略约束定义图
-  // 'ActualStrategicPhasesGanttChart': 'StrategicTaxonomyDiagram', //实际战略阶段甘特图
-  // 'StrategicActualDeploymentDiagram': 'StrategicTaxonomyDiagram', //战略实际部署图
-  // 'ActualStrategicPhasesToCapabilitiesMappingMatrix': 'StrategicTaxonomyDiagram', //实际战略阶段与能力映射矩阵
-  "OperationalTaxonomyDiagram": "Diagram",
-  //业务概念图
-  "HighLevelOperationalConceptDiagram": "Diagram",
-  //顶级业务概念图
-  "OperationalFreeFormTaxonomyDiagram": "Diagram",
-  //业务自由分类图
-  "OperationalStructureDiagram": "Diagram",
-  //业务结构图
-  "OperationalConnectivityDiagram": "Diagram",
-  //业务连通图
-  "OperationalInternalConnectivityDiagram": "Diagram",
-  //业务内部连通图
-  "OperationalProcessesDiagram": "Diagram",
-  //业务流程图
-  "OperationalProcessesFlowDiagram": "Diagram",
-  //业务内部流程图
-  "OperationalStatesDiagram": "Diagram",
-  //业务状态图
-  "OperationalInformationDiagram": "Diagram",
-  //业务信息图
-  "OperationalParametricDiagram": "Diagram",
-  //业务参数图
-  "OperationalConstraintsDiagram": "Diagram",
-  //业务约束图
-  "OperationalConstraintsDefinitionDiagram": "Diagram",
-  //业务约束定义图
-  "StrategicTaxonomyTable": "Diagram",
-  //战略概念表
-  "StrategicConnectivityMatrixDiagram": "Diagram",
-  //战略连通矩阵图
-  "StrategicActualStrategicPhaseTaxonomyTable": "Diagram",
-  //战略实际战略阶段分类表
-  "ActualStrategicPhasesGanttChart": "Diagram",
-  //实际战略阶段甘特图
-  "StrategicActualDeploymentDiagram": "Diagram",
-  //战略实际部署图
-  "ActualStrategicPhasesToCapabilitiesMappingMatrix": "Diagram",
-  //实际战略阶段与能力映射矩阵
-  "OperationalConnectivityTable": "Diagram",
-  //业务连通表
-  "OperationalActivitiesToCapabilitiesMappingMatrix": "Diagram",
-  //业务活动与能力映射矩阵
-  "OperationalPerformersToCapabilitiesMappingMatrix": "Diagram",
-  //业务执行者与能力映射矩阵
-  "ServicesTaxonomyDiagram": "Diagram",
-  //服务概念图
-  "ServicesTaxonomyTable": "Diagram",
-  //服务概念表
-  "ServicesStructureDiagram": "Diagram",
-  //服务结构图
-  "ServicesConnectivityDiagram": "Diagram",
-  //服务连通图
-  "ServicesConnectivityMatrixDiagram": "Diagram",
-  //服务连通矩阵图
-  "ServicesConnectivityTable": "Diagram",
-  //服务连通表
-  "ServicesInternalConnectivityDiagram": "Diagram",
-  //服务内部连通图
-  "ServicesProcessesDiagram": "Diagram",
-  //服务流程图
-  "ServicesProcessesFlowDiagram": "Diagram",
-  //服务内部流程图
-  "ServicesStatesDiagram": "Diagram",
-  //服务状态图
-  "ServicesParametricDiagram": "Diagram",
-  //服务参数图
-  "ServicesConstraintsDiagram": "Diagram",
-  //服务约束图
-  "ServicesConstraintsDefinitionDiagram": "Diagram",
-  //服务约束定义图
-  "ServicesRoadmapDiagram": "Diagram",
-  //服务路线图
-  "ServicesToCapabilitiesMappingMatrix": "Diagram",
-  //服务与能力映射矩阵
-  "ServicesToOperationalActivitiesMappingMatrix": "Diagram",
-  //服务与业务活动映射矩阵
-  "ServicesToServiceContractsMappingMatrix": "Diagram",
-  //服务与服务合同映射矩阵
-  "PersonnelTaxonomyDiagram": "Diagram",
-  //人员概念图
-  "PersonnelTaxonomyTable": "Diagram",
-  //人员概念表
-  "PersonnelStructureDiagram": "Diagram",
-  //人员结构图
-  "PersonnelConnectivityDiagram": "Diagram",
-  //人员连通图
-  "PersonnelConnectivityTable": "Diagram",
-  //人员连通表
-  "PersonnelInternalConnectivityDiagram": "Diagram",
-  //人员内部连通图
-  "PersonnelProcessesDiagram": "Diagram",
-  //人员流程图
-  "PersonnelProcessesFlowDiagram": "Diagram",
-  //人员内部流程图
-  "PersonnelStatesDiagram": "Diagram",
-  //人员状态图
-  "PersonnelParametricDiagram": "Diagram",
-  //人员参数图
-  "PersonnelConstraintsDiagram": "Diagram",
-  //人员约束图
-  "PersonnelConstraintsDefinitionDiagram": "Diagram",
-  //人员约束定义图
-  "ResourcesTaxonomyDiagram": "Diagram",
-  //资源概念图
-  "ResourcesTaxonomyTable": "Diagram",
-  //资源概念表
-  "ResourcesStructureDiagram": "Diagram",
-  //资源结构图
-  "ResourcesConnectivityDiagram": "Diagram",
-  //资源连通图
-  "ResourcesConnectivityTable": "Diagram",
-  //资源连通表
-  "ResourcesInternalConnectivityDiagram": "Diagram",
-  //资源内部连通图
-  "ResourcesProcessesDiagram": "Diagram",
-  //资源流程图
-  "ResourcesProcessesFlowDiagram": "Diagram",
-  //资源内部流程图
-  "ResourcesStatesDiagram": "Diagram",
-  //资源状态图
-  "ResourcesInformationDiagram": "Diagram",
-  //资源信息图
-  "ResourcesParametricDiagram": "Diagram",
-  //资源参数图
-  "FunctionsToOperationalActivitiesMappingMatrix": "Diagram",
-  //功能与业务活动映射矩阵
-  "ResourcesToCapabilitiesMappingMatrix": "Diagram",
-  //资源与能力映射矩阵
-  "ResourcesToOperationalActivitiesMappingMatrix": "Diagram",
-  //资源与业务活动映射矩阵
-  "SecurityTaxonomyDiagram": "Diagram",
-  //安全概念图
-  "SecurityTaxonomyTable": "Diagram",
-  //安全概念表
-  "SecurityStructureDiagram": "Diagram",
-  //安全结构图
-  "SecurityConnectivityDiagram": "Diagram",
-  //安全连通图
-  "SecurityConnectivityTable": "Diagram",
-  //安全连通表
-  "SecurityProcessesDiagram": "Diagram",
-  //安全流程图
-  "SecurityProcessFlowDiagram": "Diagram",
-  //安全内部流程图
-  "SecurityConstraintsDiagram": "Diagram",
-  //安全约束图
-  "SecurityConstraintsDefinitionDiagram": "Diagram",
-  //安全约束定义图
-  "RisksToAssetsMappingMatrix": "Diagram",
-  //资产风险映射矩阵
-  "SecurityControlsToRisksMappingMatrix": "Diagram",
-  //风险与安全控制映射矩阵
-  "ProjectsTaxonomyDiagram": "Diagram",
-  //项目概念图
-  "ProjectsTaxonomyTable": "Diagram",
-  //项目概念表
-  "ProjectsStructureDiagram": "Diagram",
-  //项目结构图
-  "ProjectsConnectivityDiagram": "Diagram",
-  //项目连通图
-  "ProjectsProcessesDiagram": "Diagram",
-  //项目流程图
-  "ProjectsProcessesFlowDiagram": "Diagram",
-  //项目内部流程图
-  "ActualProjectMilestoneSummaryTable": "Diagram",
-  //实际项目里程碑汇总表
-  "ProjectsRoadmapDiagram": "Diagram",
-  //项目路线图
-  "ActualProjectsToCapabilitiesMappingMatrix": "Diagram",
-  //实际项目与能力映射矩阵
-  "ActualResponsibleResourcesToActualProjectsMappingMatrix": "Diagram",
-  //实际资源与实际项目对应关系矩阵
-  "ProjectActivitiesToCapabilitiesMappingMatrix": "Diagram",
-  //项目活动与能力映射矩阵
-  "StandardsTaxonomyDiagram": "Diagram",
-  //标准概念图
-  "StandardsTaxonomyTable": "Diagram",
-  //标准概念表
-  "StandardsStructureDiagram": "Diagram",
-  //标准结构图
-  "StandardsRoadmapDiagram": "Diagram",
-  //标准路线图
-  "StandardsTraceabilityDiagram": "Diagram",
-  //标准追溯图
-  "ActualResourcesTaxonomyMatrix": "Diagram",
-  //实际资源概念矩阵
-  "ActualResourcesStructureDiagram": "Diagram",
-  //实际资源结构图
-  "ActualResourcesConnectivityDiagram": "Diagram",
-  //实际资源连通图
-  "OperationalInformation": "Block",
-  //业务信息
-  "ResourceInformation": "Block",
-  //资源信息
-  "ActualResource": "Block",
-  //实际资源
-  "InformationModel": "Package",
-  //信息模型
-  "Opportunity": "DividingLine",
-  //时机
-  "OperationalRole": "Block",
-  //业务角色
-  "StandardOperationalActivity": "Block",
-  //标准业务活动
-  "OperationalParameter": "Block",
-  //业务参数
-  "OperationalPerformer": "Block",
-  //业务执行者
-  "OperationalArchitecture": "Block",
-  //业务结构
-  "KnownResource": "Block",
-  //已知资源
-  "NaturalResource": "Block",
-  //自然资源
-  "ResourceArchitecture": "Block",
-  //资源架构
-  "ResourceArtifact": "Block",
-  //资源工件
-  "Software": "Block",
-  //软件
-  "Technology": "Block",
-  //技术
-  "ResourceService": "Block",
-  //资源服务
-  "ResourceInterface": "Block",
-  //资源接口
-  "Function": "Block",
-  //方法
-  "ServiceArchitecture": "Block",
-  //服务架构
-  "ServiceInterface": "Block",
-  //服务接口
-  "ServiceFunction": "Block",
-  //服务功能
-  "ServiceSignal": "Block",
-  //服务信号
-  "ServiceRole": "Block",
-  //服务角色
-  "FunctionAction": "ActivityAction",
-  //功能动作
-  "ServiceFunctionAction": "ActivityAction",
-  //服务功能动作
-  "ServiceParameter": "Block",
-  //服务参数
-  "OperationalActivity": "Block",
-  //业务活动
-  "HighLevelOperationalConcept": "Block",
-  //高级业务概念
-  "ActualProject": "Block",
-  //实际项目
-  "ActualRisk": "Block",
-  //实际风险
-  "ActualPropertySet": "Block",
-  //实际属性设置
-  "Organization": "Block",
-  //组织
-  "ActualPerson": "Block",
-  //实际人员
-  "CapabilityRole": "Block",
-  //能力职责
-  "OperationalSignal": "Block",
-  //业务信号
-  "OperationalInterface": "Block",
-  //业务接口
-  "Service": "Block",
-  //服务
-  "ActualService": "Block",
-  //实际服务
-  "Property": "Block",
-  //引用属性
-  "Projectes": "Block",
-  //项目
-  "ProjectMilestone": "Block",
-  //项目里程碑
-  "ActualProjectMilestone": "Block",
-  //实际项目里程碑
-  "ProjectActivity": "Block",
-  //项目活动
-  "ProjectRole": "Block",
-  //项目角色
-  "ProjectMilestoneRole": "Block",
-  //项目里程碑角色
-  "SecurityRisk": "Block",
-  //安全风险
-  "StatusIndicators": "Block",
-  //状态指标
-  "SecurityEnclave": "Block",
-  //安全隔离
-  "SecurityControl": "DividingLine",
-  //安全控制
-  "Risk": "Block",
-  //风险
-  "Post": "Block",
-  //职位
-  "Responsibility": "Block",
-  //责任
-  "ActualResponsibility": "Block",
-  //实际责任
-  "System": "Block",
-  //系统
-  "Competence": "Block",
-  //权限
-  "Person": "Block",
-  //人员
-  "SecurityProcess": "Block",
-  //安全流程
-  "ResourceMitigation": "Block",
-  // 资源缓解措施
-  "OperationalMitigation": "Block",
-  //  业务缓解措施
-  // 线
+const PinKeyMap = {
+  "OutputPin": "Pin",
+  //输出引脚
+  "InputPin": "Pin",
+  //输入引脚
+  "OperationalPort": "Port",
+  //业务端口
+  "ServicePort": "Port",
+  //服务端口
+  "ResourcePort": "Port"
+  //资源端口
+};
+const EdgeKeyMap = {
   "Association": "Edge",
   //双向关联
   "DirectedAggregation": "Edge",
@@ -9706,9 +9597,227 @@ const BlockKeyMap = {
   //里程碑依赖
   "DirectedAssociation": "Edge",
   //定向关联
-  "ResourceConnector": "Edge",
+  "ResourceConnector": "Edge"
   //资源连接器
-  //包
+};
+const DiagramKeyMap = {
+  "StrategicTaxonomyDiagram": "StrategicTaxonomyDiagram",
+  //战略概念图
+  "StrategicInformationDiagram": "StrategicTaxonomyDiagram",
+  //战略信息图
+  "StrategicStructureDiagram": "StrategicTaxonomyDiagram",
+  //战略结构图
+  "StrategicConnectivityDiagram": "StrategicTaxonomyDiagram",
+  //战略连通图
+  "StrategicStatesDiagram": "StrategicTaxonomyDiagram",
+  //战略状态图
+  "StrategicProcessesDiagram": "StrategicTaxonomyDiagram",
+  //战略流程图
+  "StrategicParametersDiagram": "StrategicTaxonomyDiagram",
+  //战略参数图
+  "StrategicConstraintsDiagram": "StrategicTaxonomyDiagram",
+  //战略约束图
+  "StrategicConstraintsDefinitionDiagram": "StrategicTaxonomyDiagram",
+  //战略约束定义图
+  "OperationalTaxonomyDiagram": "StrategicTaxonomyDiagram",
+  //业务概念图
+  "HighLevelOperationalConceptDiagram": "StrategicTaxonomyDiagram",
+  //顶级业务概念图
+  "OperationalFreeFormTaxonomyDiagram": "StrategicTaxonomyDiagram",
+  //业务自由分类图
+  "OperationalStructureDiagram": "StrategicTaxonomyDiagram",
+  //业务结构图
+  "OperationalConnectivityDiagram": "StrategicTaxonomyDiagram",
+  //业务连通图
+  "OperationalInternalConnectivityDiagram": "StrategicTaxonomyDiagram",
+  //业务内部连通图
+  "OperationalProcessesDiagram": "StrategicTaxonomyDiagram",
+  //业务流程图
+  "OperationalProcessesFlowDiagram": "StrategicTaxonomyDiagram",
+  //业务内部流程图
+  "OperationalStatesDiagram": "StrategicTaxonomyDiagram",
+  //业务状态图
+  "OperationalInformationDiagram": "StrategicTaxonomyDiagram",
+  //业务信息图
+  "OperationalParametricDiagram": "StrategicTaxonomyDiagram",
+  //业务参数图
+  "OperationalConstraintsDiagram": "StrategicTaxonomyDiagram",
+  //业务约束图
+  "OperationalConstraintsDefinitionDiagram": "StrategicTaxonomyDiagram",
+  //业务约束定义图
+  "StrategicTaxonomyTable": "StrategicTaxonomyDiagram",
+  //战略概念表
+  "StrategicConnectivityMatrixDiagram": "StrategicTaxonomyDiagram",
+  //战略连通矩阵图
+  "StrategicActualStrategicPhaseTaxonomyTable": "StrategicTaxonomyDiagram",
+  //战略实际战略阶段概念表
+  "ActualStrategicPhasesGanttChart": "StrategicTaxonomyDiagram",
+  //战略实际战略阶段甘特图
+  "StrategicActualDeploymentDiagram": "StrategicTaxonomyDiagram",
+  //战略实际部署图
+  "ActualStrategicPhasesToCapabilitiesMappingMatrix": "StrategicTaxonomyDiagram",
+  //战略实际战略阶段到能力映射矩阵图
+  "OperationalConnectivityTable": "StrategicTaxonomyDiagram",
+  //业务连通表
+  "OperationalActivitiesToCapabilitiesMappingMatrix": "StrategicTaxonomyDiagram",
+  //业务活动与能力映射矩阵
+  "OperationalPerformersToCapabilitiesMappingMatrix": "StrategicTaxonomyDiagram",
+  //业务执行者与能力映射矩阵
+  "ServicesTaxonomyDiagram": "StrategicTaxonomyDiagram",
+  //服务概念图
+  "ServicesTaxonomyTable": "StrategicTaxonomyDiagram",
+  //服务概念表
+  "ServicesStructureDiagram": "StrategicTaxonomyDiagram",
+  //服务结构图
+  "ServicesConnectivityDiagram": "StrategicTaxonomyDiagram",
+  //服务连通图
+  "ServicesConnectivityMatrixDiagram": "StrategicTaxonomyDiagram",
+  //服务连通矩阵图
+  "ServicesConnectivityTable": "StrategicTaxonomyDiagram",
+  //服务连通表
+  "ServicesInternalConnectivityDiagram": "StrategicTaxonomyDiagram",
+  //服务内部连通图
+  "ServicesProcessesDiagram": "StrategicTaxonomyDiagram",
+  //服务流程图
+  "ServicesProcessesFlowDiagram": "StrategicTaxonomyDiagram",
+  //服务内部流程图
+  "ServicesStatesDiagram": "StrategicTaxonomyDiagram",
+  //服务状态图
+  "ServicesParametricDiagram": "StrategicTaxonomyDiagram",
+  //服务参数图
+  "ServicesConstraintsDiagram": "StrategicTaxonomyDiagram",
+  //服务约束图
+  "ServicesConstraintsDefinitionDiagram": "StrategicTaxonomyDiagram",
+  //服务约束定义图
+  "ServicesRoadmapDiagram": "StrategicTaxonomyDiagram",
+  //服务路线图
+  "ServicesToCapabilitiesMappingMatrix": "StrategicTaxonomyDiagram",
+  //服务与能力映射矩阵
+  "ServicesToOperationalActivitiesMappingMatrix": "StrategicTaxonomyDiagram",
+  //服务与业务活动映射矩阵
+  "ServicesToServiceContractsMappingMatrix": "StrategicTaxonomyDiagram",
+  //服务与服务合同映射矩阵
+  "PersonnelTaxonomyDiagram": "StrategicTaxonomyDiagram",
+  //人员概念图
+  "PersonnelTaxonomyTable": "StrategicTaxonomyDiagram",
+  //人员概念表
+  "PersonnelStructureDiagram": "StrategicTaxonomyDiagram",
+  //人员结构图
+  "PersonnelConnectivityDiagram": "StrategicTaxonomyDiagram",
+  //人员连通图
+  "PersonnelConnectivityTable": "StrategicTaxonomyDiagram",
+  //人员连通表
+  "PersonnelInternalConnectivityDiagram": "StrategicTaxonomyDiagram",
+  //人员内部连通图
+  "PersonnelProcessesDiagram": "StrategicTaxonomyDiagram",
+  //人员流程图
+  "PersonnelProcessesFlowDiagram": "StrategicTaxonomyDiagram",
+  //人员内部流程图
+  "PersonnelStatesDiagram": "StrategicTaxonomyDiagram",
+  //人员状态图
+  "PersonnelParametricDiagram": "StrategicTaxonomyDiagram",
+  //人员参数图
+  "PersonnelConstraintsDiagram": "StrategicTaxonomyDiagram",
+  //人员约束图
+  "PersonnelConstraintsDefinitionDiagram": "StrategicTaxonomyDiagram",
+  //人员约束定义图
+  "ResourcesTaxonomyDiagram": "StrategicTaxonomyDiagram",
+  //资源概念图
+  "ResourcesTaxonomyTable": "StrategicTaxonomyDiagram",
+  //资源概念表
+  "ResourcesStructureDiagram": "StrategicTaxonomyDiagram",
+  //资源结构图
+  "ResourcesConnectivityDiagram": "StrategicTaxonomyDiagram",
+  //资源连通图
+  "ResourcesConnectivityTable": "StrategicTaxonomyDiagram",
+  //资源连通表
+  "ResourcesInternalConnectivityDiagram": "StrategicTaxonomyDiagram",
+  //资源内部连通图
+  "ResourcesProcessesDiagram": "StrategicTaxonomyDiagram",
+  //资源流程图
+  "ResourcesProcessesFlowDiagram": "StrategicTaxonomyDiagram",
+  //资源内部流程图
+  "ResourcesStatesDiagram": "StrategicTaxonomyDiagram",
+  //资源状态图
+  "ResourcesInformationDiagram": "StrategicTaxonomyDiagram",
+  //资源信息图
+  "ResourcesParametricDiagram": "StrategicTaxonomyDiagram",
+  //资源参数图
+  "FunctionsToOperationalActivitiesMappingMatrix": "StrategicTaxonomyDiagram",
+  //资源功能到业务活动映射矩阵
+  "ResourcesToCapabilitiesMappingMatrix": "StrategicTaxonomyDiagram",
+  //资源与能力映射矩阵
+  "ResourcesToOperationalActivitiesMappingMatrix": "StrategicTaxonomyDiagram",
+  //资源与业务活动映射矩阵
+  "SecurityTaxonomyDiagram": "StrategicTaxonomyDiagram",
+  //安全概念图
+  "SecurityTaxonomyTable": "StrategicTaxonomyDiagram",
+  //安全概念表
+  "SecurityStructureDiagram": "StrategicTaxonomyDiagram",
+  //安全结构图
+  "SecurityConnectivityDiagram": "StrategicTaxonomyDiagram",
+  //安全连通图
+  "SecurityConnectivityTable": "StrategicTaxonomyDiagram",
+  //安全连通表
+  "SecurityProcessesDiagram": "StrategicTaxonomyDiagram",
+  //安全流程图
+  "SecurityProcessFlowDiagram": "StrategicTaxonomyDiagram",
+  //安全内部流程图
+  "SecurityConstraintsDiagram": "StrategicTaxonomyDiagram",
+  //安全约束图
+  "SecurityConstraintsDefinitionDiagram": "StrategicTaxonomyDiagram",
+  //安全约束定义图
+  "RisksToAssetsMappingMatrix": "StrategicTaxonomyDiagram",
+  //风险与资产映射矩阵
+  "SecurityControlsToRisksMappingMatrix": "StrategicTaxonomyDiagram",
+  //安全控制与风险映射矩阵
+  "ProjectsTaxonomyDiagram": "StrategicTaxonomyDiagram",
+  //项目概念图
+  "ProjectsTaxonomyTable": "StrategicTaxonomyDiagram",
+  //项目概念表
+  "ProjectsStructureDiagram": "StrategicTaxonomyDiagram",
+  //项目结构图
+  "ProjectsConnectivityDiagram": "StrategicTaxonomyDiagram",
+  //项目连通图
+  "ProjectsProcessesDiagram": "StrategicTaxonomyDiagram",
+  //项目流程图
+  "ProjectsProcessesFlowDiagram": "StrategicTaxonomyDiagram",
+  //项目内部流程图
+  "ActualProjectMilestoneSummaryTable": "StrategicTaxonomyDiagram",
+  //实际项目里程碑摘要表
+  "ProjectsRoadmapDiagram": "StrategicTaxonomyDiagram",
+  //项目路线图
+  "ActualProjectsToCapabilitiesMappingMatrix": "StrategicTaxonomyDiagram",
+  //实际项目与能力映射矩阵
+  "ActualResponsibleResourcesToActualProjectsMappingMatrix": "StrategicTaxonomyDiagram",
+  //实际负责资源与实际项目映射矩阵
+  "ProjectActivitiesToCapabilitiesMappingMatrix": "StrategicTaxonomyDiagram",
+  //项目活动到能力映射矩阵
+  "StandardsTaxonomyDiagram": "StrategicTaxonomyDiagram",
+  //标准概念图
+  "StandardsTaxonomyTable": "StrategicTaxonomyDiagram",
+  //标准概念表
+  "StandardsStructureDiagram": "StrategicTaxonomyDiagram",
+  //标准结构图
+  "StandardsRoadmapDiagram": "StrategicTaxonomyDiagram",
+  //标准路线图
+  "StandardsTraceabilityDiagram": "StrategicTaxonomyDiagram",
+  //标准可追溯图
+  "ActualResourcesTaxonomyMatrix": "StrategicTaxonomyDiagram",
+  //实际资源概念矩阵
+  "ActualResourcesStructureDiagram": "StrategicTaxonomyDiagram",
+  //实际资源结构图
+  "ActualResourcesConnectivityDiagram": "StrategicTaxonomyDiagram"
+  //实际资源连通图
+};
+const ShapeKeyMap = {
+  // Package 类型
+  "ArchitecturalDescription": "Package",
+  //体系架构
+  "InformationModel": "Package",
+  //信息模型
+  "Strategic": "Package",
+  // 战略层
   "Operational": "Package",
   // 业务层
   "Services": "Package",
@@ -9849,16 +9958,179 @@ const BlockKeyMap = {
   //实际资源结构包
   "ActualResourcesConnectivityPackage": "Package",
   //实际资源连通包
-  "ConceptRole": "ConceptualRole",
-  //概念角色
-  "OperationalActivityAction": "ActivityAction",
-  //业务活动动作
+  // Block 类型
+  "Capability": "Block",
+  //能力
+  "StrategicPhase": "Block",
+  //战略阶段
+  "ActualEnterprisePhase": "Block",
+  //实际企业阶段
+  "WholeLifeEnterprise": "Block",
+  //全企业生命周期
+  "EnterpriseMission": "Block",
+  //企业使命
+  "ActualEnduringTask": "Block",
+  //实际持续任务
+  "ValueStream": "Block",
+  //价值流
+  "StrategicInformation": "Block",
+  //战略信息
+  "GeoPoliticalExtentType": "Block",
+  //地理政治范围类型
+  "CapabilityConfiguration": "Block",
+  //能力配置
+  "EnterpriseVision": "Block",
+  //企业愿景
+  "ActualOrganization": "Block",
+  //实际组织
+  "VisionStatement": "Block",
+  //愿景宣言
+  "ActualCondition": "Block",
+  //实际情况
+  "ActualEnvironment": "Block",
+  //实际环境
+  "ActualLocation": "Block",
+  //实际位置
+  "Location": "Block",
+  //位置
+  "Condition": "Block",
+  //状况条件
+  "Environment": "Block",
+  //环境
+  "Concern": "Block",
+  //涉及
+  "ActualPost": "Block",
+  //实际职责
+  "OperationalInformation": "Block",
+  //业务信息
+  "ResourceInformation": "Block",
+  //资源信息
+  "ActualResource": "Block",
+  //实际资源
+  "OperationalRole": "Block",
+  //业务角色
+  "StandardOperationalActivity": "Block",
+  //标准业务活动
+  "OperationalParameter": "Block",
+  //业务参数
+  "OperationalPerformer": "Block",
+  //业务执行者
+  "OperationalArchitecture": "Block",
+  //业务结构
+  "KnownResource": "Block",
+  //已知资源
+  "NaturalResource": "Block",
+  //自然资源
+  "ResourceArchitecture": "Block",
+  //资源架构
+  "ResourceArtifact": "Block",
+  //资源工件
+  "Software": "Block",
+  //软件
+  "Technology": "Block",
+  //技术
+  "ResourceService": "Block",
+  //资源服务
+  "ResourceInterface": "Block",
+  //资源接口
+  "Function": "Block",
+  //方法
+  "ServiceArchitecture": "Block",
+  //服务架构
+  "ServiceInterface": "Block",
+  //服务接口
+  "ServiceFunction": "Block",
+  //服务功能
+  "ServiceSignal": "Block",
+  //服务信号
+  "ServiceRole": "Block",
+  //服务角色
+  "ServiceParameter": "Block",
+  //服务参数
+  "OperationalActivity": "Block",
+  //业务活动
+  "HighLevelOperationalConcept": "Block",
+  //高级业务概念
+  "ActualProject": "Block",
+  //实际项目
+  "ActualRisk": "Block",
+  //实际风险
+  "ActualPropertySet": "Block",
+  //实际属性设置
+  "Organization": "Block",
+  //组织
+  "ActualPerson": "Block",
+  //实际人员
+  "CapabilityRole": "Block",
+  //能力职责
+  "OperationalSignal": "Block",
+  //业务信号
+  "OperationalInterface": "Block",
+  //业务接口
+  "Service": "Block",
+  //服务
+  "ActualService": "Block",
+  //实际服务
+  "Property": "Block",
+  //引用属性
+  "Projectes": "Block",
+  //项目
+  "ProjectMilestone": "Block",
+  //项目里程碑
+  "ActualProjectMilestone": "Block",
+  //实际项目里程碑
+  "ProjectActivity": "Block",
+  //项目活动
+  "ProjectRole": "Block",
+  //项目角色
+  "ProjectMilestoneRole": "Block",
+  //项目里程碑角色
+  "SecurityRisk": "Block",
+  //安全风险
+  "StatusIndicators": "Block",
+  //状态指标
+  "SecurityEnclave": "Block",
+  //安全隔离
+  "Risk": "Block",
+  //风险
+  "Post": "Block",
+  //职位
+  "Responsibility": "Block",
+  //责任
+  "ActualResponsibility": "Block",
+  //实际责任
+  "System": "Block",
+  //系统
+  "Competence": "Block",
+  //权限
+  "Person": "Block",
+  //人员
+  "SecurityProcess": "Block",
+  //安全流程
+  "ResourceMitigation": "Block",
+  // 资源缓解措施
+  "OperationalMitigation": "Block",
+  //  业务缓解措施
   "ResourceParameter": "Block",
   //资源参数
   "ResourceRole": "Block",
   //资源角色
   "ResourceSignal": "Block",
   //资源信号
+  // DividingLine 类型
+  "EnterpriseGoal": "DividingLine",
+  //企业目标
+  "Opportunity": "DividingLine",
+  //时机
+  "SecurityControl": "DividingLine",
+  //安全控制
+  // ActivityAction 类型
+  "FunctionAction": "ActivityAction",
+  //功能动作
+  "ServiceFunctionAction": "ActivityAction",
+  //服务功能动作
+  "OperationalActivityAction": "ActivityAction",
+  //业务活动动作
   "OperationalAction": "ActivityAction",
   //业务动作
   "ServiceAction": "ActivityAction",
@@ -9867,237 +10139,227 @@ const BlockKeyMap = {
   //资源动作
   "ProjectActivityAction": "ActivityAction",
   //项目活动动作
-  "SecurityProcessAction": "ActivityAction"
+  "SecurityProcessAction": "ActivityAction",
   //安全流程动作
-};
-const resizeHandles = [
-  { position: "nw" },
-  { position: "ne" },
-  { position: "sw" },
-  { position: "se" }
-];
-const DiagramKeyMap = {
-  "StrategicTaxonomyDiagram": "StrategicTaxonomyDiagram",
+  // ConceptualRole 类型
+  "ConceptRole": "ConceptualRole",
+  //概念角色
+  // Diagram 类型
+  "StrategicTaxonomyDiagram": "Diagram",
   //战略概念图
-  "StrategicInformationDiagram": "StrategicTaxonomyDiagram",
+  "StrategicInformationDiagram": "Diagram",
   //战略信息图
-  "StrategicStructureDiagram": "StrategicTaxonomyDiagram",
+  "StrategicStructureDiagram": "Diagram",
   //战略结构图
-  "StrategicConnectivityDiagram": "StrategicTaxonomyDiagram",
+  "StrategicConnectivityDiagram": "Diagram",
   //战略连通图
-  "StrategicStatesDiagram": "StrategicTaxonomyDiagram",
+  "StrategicStatesDiagram": "Diagram",
   //战略状态图
-  "StrategicProcessesDiagram": "StrategicTaxonomyDiagram",
+  "StrategicProcessesDiagram": "Diagram",
   //战略流程图
-  "StrategicParametersDiagram": "StrategicTaxonomyDiagram",
+  "StrategicParametersDiagram": "Diagram",
   //战略参数图
-  "StrategicConstraintsDiagram": "StrategicTaxonomyDiagram",
+  "StrategicConstraintsDiagram": "Diagram",
   //战略约束图
-  "StrategicConstraintsDefinitionDiagram": "StrategicTaxonomyDiagram",
+  "StrategicConstraintsDefinitionDiagram": "Diagram",
   //战略约束定义图
-  "OperationalTaxonomyDiagram": "StrategicTaxonomyDiagram",
+  "OperationalTaxonomyDiagram": "Diagram",
   //业务概念图
-  "HighLevelOperationalConceptDiagram": "StrategicTaxonomyDiagram",
+  "HighLevelOperationalConceptDiagram": "Diagram",
   //顶级业务概念图
-  "OperationalFreeFormTaxonomyDiagram": "StrategicTaxonomyDiagram",
+  "OperationalFreeFormTaxonomyDiagram": "Diagram",
   //业务自由分类图
-  "OperationalStructureDiagram": "StrategicTaxonomyDiagram",
+  "OperationalStructureDiagram": "Diagram",
   //业务结构图
-  "OperationalConnectivityDiagram": "StrategicTaxonomyDiagram",
+  "OperationalConnectivityDiagram": "Diagram",
   //业务连通图
-  "OperationalInternalConnectivityDiagram": "StrategicTaxonomyDiagram",
+  "OperationalInternalConnectivityDiagram": "Diagram",
   //业务内部连通图
-  "OperationalProcessesDiagram": "StrategicTaxonomyDiagram",
+  "OperationalProcessesDiagram": "Diagram",
   //业务流程图
-  "OperationalProcessesFlowDiagram": "StrategicTaxonomyDiagram",
+  "OperationalProcessesFlowDiagram": "Diagram",
   //业务内部流程图
-  "OperationalStatesDiagram": "StrategicTaxonomyDiagram",
+  "OperationalStatesDiagram": "Diagram",
   //业务状态图
-  "OperationalInformationDiagram": "StrategicTaxonomyDiagram",
+  "OperationalInformationDiagram": "Diagram",
   //业务信息图
-  "OperationalParametricDiagram": "StrategicTaxonomyDiagram",
+  "OperationalParametricDiagram": "Diagram",
   //业务参数图
-  "OperationalConstraintsDiagram": "StrategicTaxonomyDiagram",
+  "OperationalConstraintsDiagram": "Diagram",
   //业务约束图
-  "OperationalConstraintsDefinitionDiagram": "StrategicTaxonomyDiagram",
+  "OperationalConstraintsDefinitionDiagram": "Diagram",
   //业务约束定义图
-  "StrategicTaxonomyTable": "StrategicTaxonomyDiagram",
+  "StrategicTaxonomyTable": "Diagram",
   //战略概念表
-  "StrategicConnectivityMatrixDiagram": "StrategicTaxonomyDiagram",
+  "StrategicConnectivityMatrixDiagram": "Diagram",
   //战略连通矩阵图
-  "StrategicActualStrategicPhaseTaxonomyTable": "StrategicTaxonomyDiagram",
-  //战略实际战略阶段概念表
-  "ActualStrategicPhasesGanttChart": "StrategicTaxonomyDiagram",
-  //战略实际战略阶段甘特图
-  "StrategicActualDeploymentDiagram": "StrategicTaxonomyDiagram",
+  "StrategicActualStrategicPhaseTaxonomyTable": "Diagram",
+  //战略实际战略阶段分类表
+  "ActualStrategicPhasesGanttChart": "Diagram",
+  //实际战略阶段甘特图
+  "StrategicActualDeploymentDiagram": "Diagram",
   //战略实际部署图
-  "ActualStrategicPhasesToCapabilitiesMappingMatrix": "StrategicTaxonomyDiagram",
-  //战略实际战略阶段到能力映射矩阵图
-  "OperationalConnectivityTable": "StrategicTaxonomyDiagram",
+  "ActualStrategicPhasesToCapabilitiesMappingMatrix": "Diagram",
+  //实际战略阶段与能力映射矩阵
+  "OperationalConnectivityTable": "Diagram",
   //业务连通表
-  "OperationalActivitiesToCapabilitiesMappingMatrix": "StrategicTaxonomyDiagram",
+  "OperationalActivitiesToCapabilitiesMappingMatrix": "Diagram",
   //业务活动与能力映射矩阵
-  "OperationalPerformersToCapabilitiesMappingMatrix": "StrategicTaxonomyDiagram",
+  "OperationalPerformersToCapabilitiesMappingMatrix": "Diagram",
   //业务执行者与能力映射矩阵
-  "ServicesTaxonomyDiagram": "StrategicTaxonomyDiagram",
+  "ServicesTaxonomyDiagram": "Diagram",
   //服务概念图
-  "ServicesTaxonomyTable": "StrategicTaxonomyDiagram",
+  "ServicesTaxonomyTable": "Diagram",
   //服务概念表
-  "ServicesStructureDiagram": "StrategicTaxonomyDiagram",
+  "ServicesStructureDiagram": "Diagram",
   //服务结构图
-  "ServicesConnectivityDiagram": "StrategicTaxonomyDiagram",
+  "ServicesConnectivityDiagram": "Diagram",
   //服务连通图
-  "ServicesConnectivityMatrixDiagram": "StrategicTaxonomyDiagram",
+  "ServicesConnectivityMatrixDiagram": "Diagram",
   //服务连通矩阵图
-  "ServicesConnectivityTable": "StrategicTaxonomyDiagram",
+  "ServicesConnectivityTable": "Diagram",
   //服务连通表
-  "ServicesInternalConnectivityDiagram": "StrategicTaxonomyDiagram",
+  "ServicesInternalConnectivityDiagram": "Diagram",
   //服务内部连通图
-  "ServicesProcessesDiagram": "StrategicTaxonomyDiagram",
+  "ServicesProcessesDiagram": "Diagram",
   //服务流程图
-  "ServicesProcessesFlowDiagram": "StrategicTaxonomyDiagram",
+  "ServicesProcessesFlowDiagram": "Diagram",
   //服务内部流程图
-  "ServicesStatesDiagram": "StrategicTaxonomyDiagram",
+  "ServicesStatesDiagram": "Diagram",
   //服务状态图
-  "ServicesParametricDiagram": "StrategicTaxonomyDiagram",
+  "ServicesParametricDiagram": "Diagram",
   //服务参数图
-  "ServicesConstraintsDiagram": "StrategicTaxonomyDiagram",
+  "ServicesConstraintsDiagram": "Diagram",
   //服务约束图
-  "ServicesConstraintsDefinitionDiagram": "StrategicTaxonomyDiagram",
+  "ServicesConstraintsDefinitionDiagram": "Diagram",
   //服务约束定义图
-  "ServicesRoadmapDiagram": "StrategicTaxonomyDiagram",
+  "ServicesRoadmapDiagram": "Diagram",
   //服务路线图
-  "ServicesToCapabilitiesMappingMatrix": "StrategicTaxonomyDiagram",
+  "ServicesToCapabilitiesMappingMatrix": "Diagram",
   //服务与能力映射矩阵
-  "ServicesToOperationalActivitiesMappingMatrix": "StrategicTaxonomyDiagram",
+  "ServicesToOperationalActivitiesMappingMatrix": "Diagram",
   //服务与业务活动映射矩阵
-  "ServicesToServiceContractsMappingMatrix": "StrategicTaxonomyDiagram",
+  "ServicesToServiceContractsMappingMatrix": "Diagram",
   //服务与服务合同映射矩阵
-  "PersonnelTaxonomyDiagram": "StrategicTaxonomyDiagram",
+  "PersonnelTaxonomyDiagram": "Diagram",
   //人员概念图
-  "PersonnelTaxonomyTable": "StrategicTaxonomyDiagram",
+  "PersonnelTaxonomyTable": "Diagram",
   //人员概念表
-  "PersonnelStructureDiagram": "StrategicTaxonomyDiagram",
+  "PersonnelStructureDiagram": "Diagram",
   //人员结构图
-  "PersonnelConnectivityDiagram": "StrategicTaxonomyDiagram",
+  "PersonnelConnectivityDiagram": "Diagram",
   //人员连通图
-  "PersonnelConnectivityTable": "StrategicTaxonomyDiagram",
+  "PersonnelConnectivityTable": "Diagram",
   //人员连通表
-  "PersonnelInternalConnectivityDiagram": "StrategicTaxonomyDiagram",
+  "PersonnelInternalConnectivityDiagram": "Diagram",
   //人员内部连通图
-  "PersonnelProcessesDiagram": "StrategicTaxonomyDiagram",
+  "PersonnelProcessesDiagram": "Diagram",
   //人员流程图
-  "PersonnelProcessesFlowDiagram": "StrategicTaxonomyDiagram",
+  "PersonnelProcessesFlowDiagram": "Diagram",
   //人员内部流程图
-  "PersonnelStatesDiagram": "StrategicTaxonomyDiagram",
+  "PersonnelStatesDiagram": "Diagram",
   //人员状态图
-  "PersonnelParametricDiagram": "StrategicTaxonomyDiagram",
+  "PersonnelParametricDiagram": "Diagram",
   //人员参数图
-  "PersonnelConstraintsDiagram": "StrategicTaxonomyDiagram",
+  "PersonnelConstraintsDiagram": "Diagram",
   //人员约束图
-  "PersonnelConstraintsDefinitionDiagram": "StrategicTaxonomyDiagram",
+  "PersonnelConstraintsDefinitionDiagram": "Diagram",
   //人员约束定义图
-  "ResourcesTaxonomyDiagram": "StrategicTaxonomyDiagram",
+  "ResourcesTaxonomyDiagram": "Diagram",
   //资源概念图
-  "ResourcesTaxonomyTable": "StrategicTaxonomyDiagram",
+  "ResourcesTaxonomyTable": "Diagram",
   //资源概念表
-  "ResourcesStructureDiagram": "StrategicTaxonomyDiagram",
+  "ResourcesStructureDiagram": "Diagram",
   //资源结构图
-  "ResourcesConnectivityDiagram": "StrategicTaxonomyDiagram",
+  "ResourcesConnectivityDiagram": "Diagram",
   //资源连通图
-  "ResourcesConnectivityTable": "StrategicTaxonomyDiagram",
+  "ResourcesConnectivityTable": "Diagram",
   //资源连通表
-  "ResourcesInternalConnectivityDiagram": "StrategicTaxonomyDiagram",
+  "ResourcesInternalConnectivityDiagram": "Diagram",
   //资源内部连通图
-  "ResourcesProcessesDiagram": "StrategicTaxonomyDiagram",
+  "ResourcesProcessesDiagram": "Diagram",
   //资源流程图
-  "ResourcesProcessesFlowDiagram": "StrategicTaxonomyDiagram",
+  "ResourcesProcessesFlowDiagram": "Diagram",
   //资源内部流程图
-  "ResourcesStatesDiagram": "StrategicTaxonomyDiagram",
+  "ResourcesStatesDiagram": "Diagram",
   //资源状态图
-  "ResourcesInformationDiagram": "StrategicTaxonomyDiagram",
+  "ResourcesInformationDiagram": "Diagram",
   //资源信息图
-  "ResourcesParametricDiagram": "StrategicTaxonomyDiagram",
+  "ResourcesParametricDiagram": "Diagram",
   //资源参数图
-  "FunctionsToOperationalActivitiesMappingMatrix": "StrategicTaxonomyDiagram",
-  //资源功能到业务活动映射矩阵
-  "ResourcesToCapabilitiesMappingMatrix": "StrategicTaxonomyDiagram",
+  "FunctionsToOperationalActivitiesMappingMatrix": "Diagram",
+  //功能与业务活动映射矩阵
+  "ResourcesToCapabilitiesMappingMatrix": "Diagram",
   //资源与能力映射矩阵
-  "ResourcesToOperationalActivitiesMappingMatrix": "StrategicTaxonomyDiagram",
+  "ResourcesToOperationalActivitiesMappingMatrix": "Diagram",
   //资源与业务活动映射矩阵
-  "SecurityTaxonomyDiagram": "StrategicTaxonomyDiagram",
+  "SecurityTaxonomyDiagram": "Diagram",
   //安全概念图
-  "SecurityTaxonomyTable": "StrategicTaxonomyDiagram",
+  "SecurityTaxonomyTable": "Diagram",
   //安全概念表
-  "SecurityStructureDiagram": "StrategicTaxonomyDiagram",
+  "SecurityStructureDiagram": "Diagram",
   //安全结构图
-  "SecurityConnectivityDiagram": "StrategicTaxonomyDiagram",
+  "SecurityConnectivityDiagram": "Diagram",
   //安全连通图
-  "SecurityConnectivityTable": "StrategicTaxonomyDiagram",
+  "SecurityConnectivityTable": "Diagram",
   //安全连通表
-  "SecurityProcessesDiagram": "StrategicTaxonomyDiagram",
+  "SecurityProcessesDiagram": "Diagram",
   //安全流程图
-  "SecurityProcessFlowDiagram": "StrategicTaxonomyDiagram",
+  "SecurityProcessFlowDiagram": "Diagram",
   //安全内部流程图
-  "SecurityConstraintsDiagram": "StrategicTaxonomyDiagram",
+  "SecurityConstraintsDiagram": "Diagram",
   //安全约束图
-  "SecurityConstraintsDefinitionDiagram": "StrategicTaxonomyDiagram",
+  "SecurityConstraintsDefinitionDiagram": "Diagram",
   //安全约束定义图
-  "RisksToAssetsMappingMatrix": "StrategicTaxonomyDiagram",
-  //风险与资产映射矩阵
-  "SecurityControlsToRisksMappingMatrix": "StrategicTaxonomyDiagram",
-  //安全控制与风险映射矩阵
-  "ProjectsTaxonomyDiagram": "StrategicTaxonomyDiagram",
+  "RisksToAssetsMappingMatrix": "Diagram",
+  //资产风险映射矩阵
+  "SecurityControlsToRisksMappingMatrix": "Diagram",
+  //风险与安全控制映射矩阵
+  "ProjectsTaxonomyDiagram": "Diagram",
   //项目概念图
-  "ProjectsTaxonomyTable": "StrategicTaxonomyDiagram",
+  "ProjectsTaxonomyTable": "Diagram",
   //项目概念表
-  "ProjectsStructureDiagram": "StrategicTaxonomyDiagram",
+  "ProjectsStructureDiagram": "Diagram",
   //项目结构图
-  "ProjectsConnectivityDiagram": "StrategicTaxonomyDiagram",
+  "ProjectsConnectivityDiagram": "Diagram",
   //项目连通图
-  "ProjectsProcessesDiagram": "StrategicTaxonomyDiagram",
+  "ProjectsProcessesDiagram": "Diagram",
   //项目流程图
-  "ProjectsProcessesFlowDiagram": "StrategicTaxonomyDiagram",
+  "ProjectsProcessesFlowDiagram": "Diagram",
   //项目内部流程图
-  "ActualProjectMilestoneSummaryTable": "StrategicTaxonomyDiagram",
-  //实际项目里程碑摘要表
-  "ProjectsRoadmapDiagram": "StrategicTaxonomyDiagram",
+  "ActualProjectMilestoneSummaryTable": "Diagram",
+  //实际项目里程碑汇总表
+  "ProjectsRoadmapDiagram": "Diagram",
   //项目路线图
-  "ActualProjectsToCapabilitiesMappingMatrix": "StrategicTaxonomyDiagram",
+  "ActualProjectsToCapabilitiesMappingMatrix": "Diagram",
   //实际项目与能力映射矩阵
-  "ActualResponsibleResourcesToActualProjectsMappingMatrix": "StrategicTaxonomyDiagram",
-  //实际负责资源与实际项目映射矩阵
-  "ProjectActivitiesToCapabilitiesMappingMatrix": "StrategicTaxonomyDiagram",
-  //项目活动到能力映射矩阵
-  "StandardsTaxonomyDiagram": "StrategicTaxonomyDiagram",
+  "ActualResponsibleResourcesToActualProjectsMappingMatrix": "Diagram",
+  //实际资源与实际项目对应关系矩阵
+  "ProjectActivitiesToCapabilitiesMappingMatrix": "Diagram",
+  //项目活动与能力映射矩阵
+  "StandardsTaxonomyDiagram": "Diagram",
   //标准概念图
-  "StandardsTaxonomyTable": "StrategicTaxonomyDiagram",
+  "StandardsTaxonomyTable": "Diagram",
   //标准概念表
-  "StandardsStructureDiagram": "StrategicTaxonomyDiagram",
+  "StandardsStructureDiagram": "Diagram",
   //标准结构图
-  "StandardsRoadmapDiagram": "StrategicTaxonomyDiagram",
+  "StandardsRoadmapDiagram": "Diagram",
   //标准路线图
-  "StandardsTraceabilityDiagram": "StrategicTaxonomyDiagram",
-  //标准可追溯图
-  "ActualResourcesTaxonomyMatrix": "StrategicTaxonomyDiagram",
+  "StandardsTraceabilityDiagram": "Diagram",
+  //标准追溯图
+  "ActualResourcesTaxonomyMatrix": "Diagram",
   //实际资源概念矩阵
-  "ActualResourcesStructureDiagram": "StrategicTaxonomyDiagram",
+  "ActualResourcesStructureDiagram": "Diagram",
   //实际资源结构图
-  "ActualResourcesConnectivityDiagram": "StrategicTaxonomyDiagram"
+  "ActualResourcesConnectivityDiagram": "Diagram"
   //实际资源连通图
 };
-const PinKeyMap = {
-  "OutputPin": "Pin",
-  //输出引脚
-  "InputPin": "Pin",
-  //输入引脚
-  "OperationalPort": "Port",
-  //业务端口
-  "ServicePort": "Port",
-  //服务端口
-  "ResourcePort": "Port"
-  //资源端口
-};
+const resizeHandles = [
+  { position: "nw" },
+  { position: "ne" },
+  { position: "sw" },
+  { position: "se" }
+];
 const __vite_glob_3_0 = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEgAAABICAYAAABV7bNHAAAAAXNSR0IArs4c6QAAAARzQklUCAgICHwIZIgAAAZ9SURBVHic7ZtPTNtWHMd/79lp0rWjoWVbp6rANFZNmkRSytB6AA6NtFsrZXcqbcdJHJg0VdOUrhGquJQDEschlXsjsTM7pGjaWtGWcGKFaQHRdX9ol3VdG7D9fjvENi8h9nvPo5Cs/pxix89+/vr3+76fn22CiBqEeEL3uwONTiiQgFAgAaFAAkKBBIQCCdCDNkyn0/H19V/Om4x17m6XdheNkNLJkyemc7lcKUj7wAIV19YzyNhw0PZ7hVnpawIAPgnSPnCKIWPng7bda5CxC0HbkiCVdDqdjv9cXNtwd0JpNmgHXiR2hMcBAI4djb89Ozu7qrqPQCn24MFvCec3ASjcnb/dkAL19Lw/iICDAABPnvyTBABlgQKlGGOmKxBQuhBkH3sCJQXnp8mshP/GHrsI0shCdA+mke1ONBo61fLuAqtEkiqBBELG3IPpB6N5/633Dy0WKTq/EXBvIiidTscBwKl9St/fvNmwEWT3zal/4mcHBpRFUhaoxqCVTW+vIbBtAVbZUC5qlUexGoOWTq9kdnnIRLyAgHEAgIMRbWT+iy6p6Ou9upIoG2yqskQWKIH868esb2Y/fVdcHVNScPzHZNYgAMzI9hmCCGQh5z8SI1hydPmCYeK17bQkAADw3LDGAeCczDHLBssggn1hMGEhXHz4By0mR5c/W/jyHd8T1qmWN5yKn6n7kHKKIXeQaMth3wjqvnI/Y5h4g/MsF41o0leSkrqR2mmYeKP7yv2MX9uWlkPuRQxi1EqVdE0FXbp3d77Na9tkdnnIYDjFrSoSAtNRDfOtrViQSg+O/rG1jr/NzaRpYQIR3AoZACCik4/8Iul0T++Gs33s8CtnVAYWpRRbX3/ophdvfrWkJpfiBqPj7rYECq3RWHruUntgU7fbrgLATP/Y2vU/N8s5J+0ME6+lJpfyXqITIAWnoraNWlogpRSzTc5u6S3Q74/oEHeFS/9VnFrmLrWvtkZjaQBw6pzOjUea980zJW6KVp2DBIoehB3OLz+DthDdu2dCYGI3xXGYu9S+GqHEvQc0kF302lan2vbFVDRqpRRDrlz3NWgkrpCxCN3hDd3ZlWGLsQzvIwJKGqXZxUzXBL9S10nB2MIdx6ylpeXQwqPHlexTNWrpCOpPpTr4tJnznzpwR634EXPHdqxytWXFAQCIW3Um52rqKM8i0J7mcNJRqaKWFmjzyVMpg7ZxzbL0l77jylJCr8se10EjMF27rvfqCn+ixdr/eQgNVlFLp5jJWNJd8DHoSm+wAEgq1auJidpRw06VCc/2kmyZXLoQFPgcKQBUvFGlopY3ac7cqqYR6hDhIsRgmOkfW/P0h6CkJpfiFkO3SCRA/PukRfipj91PMd7colx1Wo9XD0Tz/BD8ePP5VGpyScVzfOkfW+v4dYN+zc8qHG9jvhF54sQbbhSrGLVUJd2fSnU8fVz6yemMXwXtYI9U49yqokZh4oBO8/Ej5qpqJQ0AcGb0x0GDkYTFYJg3ZY3SkdoRrh6ne3pXnHayFbVUBFUZNPUPZYfFTNeERoCfq+60GIw/32J3Hv5BN5Kjy9JPGrqzK8PvfXXfLJvkW4vBeJU4BHYM/15UG/WWVBRJCVRl0OIRzGXx8qmsRukIP6q5+7RwSHY/jJtB4ChqlI4sXj6l8MCAn6Pmz8kbOQ+qNmilGcTFTNfEm6+xLo3CCCEwY9+0FmIR+UdFukambU8rAsF8hJKPj8Zi52QjxyGIUUt5EH83/FZne1vQx7j7Te3zvHt354VljjCC7KrTGYGKzSoOAEAulysRriaTqaiFAvFmRkQFYjNAiVtxyxi1UCDezLT6M3tNBX8OJqtr/lWITZrbCaV600dQ1TlIjGS+AqXT6TgCuLcJfDXarFRX1CBMMd9R7OzAQKL89Nkde3Ejouuf71ZH9xPTNK8iwHEAgAOR6Llbt77ztA7fYc54Vv6QW2wzTHPKZ/OmxH7O5ymQb4oxgNgL6VUDYSH63kSrTLkWSCO/6qIAVsxZqpKWFohQOtOoL0qp0tPbl0HGdu9m9WUmFEhAKJCAUCABoUACQoEEhAIJCAUSEAokIBRIQCiQgFAgAaFAAuSnOxgO9vT2+b5y2zQofNgiLRACDgb9YqaZ8U0xnVLft7b+D4jOUfjoua/vg6FG/7I5KDqlxdu3f9jxah9PoG9WXybCUUxAKJCAUCABoUACQoEEhAIJCAUSEAokIBRIwL9jGpoMstHI7QAAAABJRU5ErkJggg==";
 const __vite_glob_3_1 = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAFoAAABaCAYAAAA4qEECAAAAAXNSR0IArs4c6QAAAARzQklUCAgICHwIZIgAAAJhSURBVHic7ds9SgNBGIfxV9FCIRKwMjZWSSts0nsAI55CBY9gIR5CEE+xmAOYPllIq1UaP0pJoYVFLCQSP5JNnNlnh+z/V62w2YwPw/j6tTQcDocmmVvOewFFodAQhYYoNEShIQoNUWiIQkMUGqLQEIWGKDREoSEKDVFoiEJDFBqi0BCFhig0RKEhCg1RaIhCQ1Z8POSm1bLHx6d/v75S2bKDZtPHUn4JZW3OoW9aLTs/v3BeiJl5jx3S2pyPDpfdksVzsnimj+d4OTpG6lFkUT2a+f6km1g3SXwuYaK81+Y1dFSP7OT4aOb7r+waC5332jR1QLzuaBdJN7Eru/b+zFAEE7qbcOd1HnR0QILZ0fNOBbMgp5o0wYSedyqYBTnVpNHRAfG6o+edHMipIO+1OYculUpf1y6TQ6Wy5bqUX0Jam/PRcdDct1q16vSMWrVq9cjvF0ILbG1Lvv7P8Lbdtru7+7lfV6t9fiLju8+3ENbmLbRMp6kDotAQhYYoNKSwoePewOLeAHu/YH7WQYp7AzuLn78+PtzdyPw9C7mjH17e/7zOUiFD50GhIQoNUWiIQkMUGrKQc3TcG0wd2zr912/Xl+3Jz9our3qZsxcu9M9vRtJ0+m/W6b+l3ucaW0cHZOF29GjnpR0do13c2Fmzxs76xHt1dEyRFuaybWOh1+10bzPzNenogCg0RKEhCg1RaIhCQwoZeru8+ud1lhZyjk4zPmcTvy80/UkYp5BHRx4UGqLQEIWGKDREoSEKDVFoiEJDFBqi0BCFhig0RKEhCg1RaIhCQxQaotAQhYYoNOQDM128k0dpjyAAAAAASUVORK5CYII=";
 const __vite_glob_3_2 = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEgAAABICAYAAABV7bNHAAAAAXNSR0IArs4c6QAAAARzQklUCAgICHwIZIgAAALxSURBVHic7Zsxb9NQEMf/Z4PERpDYKQyUZuHSZGIh3ZhoUT8AfIR2R01b2MM3oGVgQ2o3mFoWFqjykFCjMqCwAANSwwz2MSRN06rxOY6fVdD9Jr/o+d7LT362fL4HGIZhGIbxn0JFDcTMJSCsA8JFjXk2dAjQR+c+7Kbq7X9CAHOtDpLnAKaKGC8VhA3E0bJzrpvULfQ9D2aeAlELQMn3WGPCCMJLP75/e5PUyfsVxJXqDoB6v+kgsu17zEQCugbBo0Fbgopz792o7hcKmNLxPUeiB865TgFjJsJc64JkqdeK7wIYKSgoYD6DpXUe5PSIfx0fy5WknkUI+qcxQQomSMEEKZggBROkYIIUTJCCCVIwQQomSCHVyyozTyEImxDUs6YtoulFlO+/bJ14ec2Gk1g2209uPZswTirUK4i5ugAKWxAsZJXz+85jRNOLyEEOADAF1JxpfN7JIZZKoqBesgvNSZJd0Y17kKvlrKePhCD18kp7NffAp1CWWMhDadIOJKpoKcrTnFhWEq/tr89M9KfKK+1VUNAAAFAwD8CrJGWJDSXYRTbHldNnEGNSOWfE8P4BwJ5iCiZIwQQpmCAFE6RgghRMkIIJUjBBCiZIwQQpmCAFE6RgghRMkEIRggbFSXlkAE/FGFn4NApmLoHo4fEvlBjDf4WZxNugoJfYoqBRbhw08godfnrBXKnKBCE6QJQoyPsVtL8+syqgVCW340A/9xF+eT1JiC4Ey1rVWyH3oPbazTmJZTnLkjgDFx68wsV3T7Oe3wVhq5df39vSOhdRxAkA6H/HyuVb1vCycq09r5W69hRTMEEKJkjBBCmYIAUTpGCCFEyQgglSMEEKJkhBEUSHQ10ve59NCph5eN9rlnqlsVBeVoO3QNw7JFni2WoJsXz1PalEiOaHWnlkB5KH0zrwbK0JOdq+eM6Q6LrvXYz6PSj+swbChs9JZKADobkitnimzqUw1+qA3Nb2ePqHHBDtZqyXNAzDMAzDOOIvySvHLTagE98AAAAASUVORK5CYII=";
@@ -10970,13 +11232,17 @@ function getShapeComponentByKey(key) {
   return registry[key] ?? null;
 }
 function getComponentByShapeKey(shapeKey) {
-  const componentName = BlockKeyMap[shapeKey] || shapeKey;
+  const componentName = ShapeKeyMap[shapeKey] || shapeKey;
   return getShapeComponentByKey(componentName) || componentName;
 }
 function getComponentByPinKey(shapeKey) {
   const componentName = PinKeyMap[shapeKey] || shapeKey;
   return getShapeComponentByKey(componentName) || componentName;
 }
+function getComponentByEdgeKey(shapeKey) {
+  const componentName = EdgeKeyMap[shapeKey] || shapeKey;
+  return getShapeComponentByKey(componentName) || componentName;
+}
 function getComponentByDiagramKey(shapeKey) {
   const componentName = DiagramKeyMap[shapeKey] || shapeKey;
   return getShapeComponentByKey(componentName) || componentName;
@@ -10991,7 +11257,7 @@ const getShapeComponent = (shape) => {
     case "diagram":
       return getComponentByDiagramKey(shapeKey);
     case "edge":
-      return getComponentByShapeKey(shapeKey);
+      return getComponentByEdgeKey(shapeKey);
     default:
       return "ShapeComponent";
   }
@@ -11195,10 +11461,36 @@ const _ContextMenuUtils = class _ContextMenuUtils {
     return this.copiedShapes;
   }
   /**
-   * 清除剪切状态
-   * 当按 ESC 取消或其他需要清除剪切状态的场景调用
+   * 检查剪贴板是否有内容
+   */
+  static hasClipboardContent() {
+    return this.copiedShapes.length > 0;
+  }
+  /**
+   * 清空剪贴板（粘贴完成后调用）
+   */
+  static clearClipboard() {
+    this.copiedShapes = [];
+    this.operationType = "copy";
+    const graphStore = useGraphStore();
+    graphStore.setCopiedShapesCount(0);
+    console.log("剪贴板已清空");
+  }
+  /**
+   * 清除剪切状态（只清除SVG遮盖层，不清除剪贴板数据）
+   * 当点击空白处时调用
    */
   static clearCutState() {
+    if (this.operationType === "cut") {
+      const graphStore = useGraphStore();
+      graphStore.clearCutShapeIds();
+    }
+  }
+  /**
+   * 完全清除剪切状态和剪贴板数据
+   * 当需要完全重置时调用（如按ESC取消操作）
+   */
+  static clearAll() {
     if (this.operationType === "cut") {
       const graphStore2 = useGraphStore();
       graphStore2.clearCutShapeIds();
@@ -11243,7 +11535,7 @@ const _ContextMenuUtils = class _ContextMenuUtils {
   /**
    * 处理粘贴
    */
-  static handlePaste(target) {
+  static handlePaste(_target) {
     if (this.copiedShapes.length === 0) {
       return;
     }
@@ -11255,10 +11547,8 @@ const _ContextMenuUtils = class _ContextMenuUtils {
     if (this.operationType === "cut") {
       const graphStore = useGraphStore();
       graphStore.clearCutShapeIds();
-      graphStore.setCopiedShapesCount(0);
-      this.copiedShapes = [];
-      this.operationType = "copy";
     }
+    this.clearClipboard();
     console.log("已粘贴的图元:", pastedShapes, "操作类型:", this.operationType);
   }
   /**
@@ -11709,7 +11999,8 @@ const DASHED_EDGE_SHAPES = [
   "Mitigates",
   "Protects",
   "MapsToCapability",
-  "ActualResourceRelationship"
+  "ActualResourceRelationship",
+  "ProjectSequence"
 ];
 const EDGES_WITH_KEYWORDS = [
   "Phases",
@@ -11738,7 +12029,8 @@ const EDGES_WITH_KEYWORDS = [
   "Mitigates",
   "Protects",
   "MapsToCapability",
-  "Exhibits"
+  "Exhibits",
+  "ProjectSequence"
 ];
 const EDGES_WITH_ARROWHEADS = [
   ...DASHED_EDGE_SHAPES,
@@ -12021,9 +12313,10 @@ let keyboardMovingShapeIds = /* @__PURE__ */ new Set();
 const KEYBOARD_MOVE_DEBOUNCE_DELAY = 1e3;
 const collectAffectedShapeIds = (graphStore, movedIds) => {
   const affectedIds = /* @__PURE__ */ new Set();
+  const shapeMap = graphStore.shapeMap;
   movedIds.forEach((id) => {
     affectedIds.add(id);
-    const shape = graphStore.shapes.find((s2) => s2.id === id);
+    const shape = shapeMap.get(id);
     if (!shape)
       return;
     if (shape.parenShapeId) {
@@ -12041,7 +12334,7 @@ const collectAffectedShapeIds = (graphStore, movedIds) => {
     let guard = 0;
     while (currentParentId && guard++ < 100) {
       affectedIds.add(currentParentId);
-      const parent = graphStore.shapes.find((s2) => s2.id === currentParentId);
+      const parent = shapeMap.get(currentParentId);
       currentParentId = parent?.parenShapeId;
     }
   });
@@ -12051,7 +12344,8 @@ const emitKeyboardMoveEnd = (graphStore) => {
   if (keyboardMovingShapeIds.size === 0)
     return;
   const affectedIds = collectAffectedShapeIds(graphStore, keyboardMovingShapeIds);
-  const payloads = Array.from(affectedIds).map((id) => graphStore.shapes.find((s2) => s2.id === id)).filter(Boolean).map((s2) => _.cloneDeep(s2));
+  const shapeMap = graphStore.shapeMap;
+  const payloads = Array.from(affectedIds).map((id) => shapeMap.get(id)).filter(Boolean).map((s2) => _.cloneDeep(s2));
   if (payloads.length > 0) {
     eventBus.emit("shape-drag-end", payloads);
   }
@@ -12188,7 +12482,13 @@ const createKeyboardHandler = (config) => {
       }
       e.preventDefault();
       const step = 1;
-      const canvas = graphStore.shapes.find((shape) => shape.shapeType === "diagram");
+      let canvas = null;
+      for (const shape of graphStore.shapes) {
+        if (shape.shapeType === "diagram") {
+          canvas = shape;
+          break;
+        }
+      }
       const canvasX = canvas?.bounds?.x || 0;
       const canvasY = canvas?.bounds?.y || 0;
       const canvasWidth = canvas?.bounds?.width || 300;
@@ -12197,7 +12497,13 @@ const createKeyboardHandler = (config) => {
       const canvasMinY = canvasY;
       const canvasMaxX = canvasWidth + canvasX;
       const canvasMaxY = canvasHeight + canvasY;
-      const selectedShapes = graphStore.selectedIds.map((id) => graphStore.shapes.find((s2) => s2.id === id)).filter((shape) => shape != null);
+      const shapeMap = graphStore.shapeMap;
+      const selectedShapes = [];
+      for (const id of graphStore.selectedIds) {
+        const shape = shapeMap.get(id);
+        if (shape)
+          selectedShapes.push(shape);
+      }
       selectedShapes.forEach((shape) => {
         if (!keyboardMoveInitialBounds.has(shape.id)) {
           keyboardMoveInitialBounds.set(shape.id, { ...shape.bounds });
@@ -12241,7 +12547,7 @@ const createKeyboardHandler = (config) => {
           });
           const childIds = graphStore.parentChildMap.get(shape.id) || [];
           childIds.forEach((childId) => {
-            const child = graphStore.shapes.find((s2) => s2.id === childId);
+            const child = shapeMap.get(childId);
             if (child && child.bounds) {
               if (graphStore.selectedIds.includes(child.id)) {
                 return;
@@ -12691,7 +12997,7 @@ const _sfc_main$e = /* @__PURE__ */ defineComponent({
   emits: InteractionLayerEmits,
   setup(__props, { expose: __expose, emit: __emit }) {
     useCssVars((_ctx) => ({
-      "65f24407": unref(graphStore).currentScale
+      "c994dcd8": unref(graphStore).currentScale
     }));
     const props = __props;
     const emit = __emit;
@@ -12723,7 +13029,56 @@ const _sfc_main$e = /* @__PURE__ */ defineComponent({
       const b2 = getBounds(s2);
       return { x: b2.x, y: b2.y, width: b2.width, height: b2.height };
     });
-    const allGhosts = computed(() => {
+    const dragGhostRects = computed(() => {
+      if (!graphStore.isDragging || isExternalCreateDragging.value)
+        return [];
+      const rects = [];
+      const dragBase = graphStore.dragBase;
+      const descendantsSnapshot = graphStore.dragDescendantsSnapshot;
+      for (const ghost of graphStore.ghostShadow) {
+        if (!ghost.bounds)
+          continue;
+        const baseBounds = dragBase[ghost.id];
+        if (!baseBounds)
+          continue;
+        const dx = (ghost.bounds.x ?? 0) - baseBounds.x;
+        const dy = (ghost.bounds.y ?? 0) - baseBounds.y;
+        rects.push({
+          id: ghost.id,
+          x: ghost.bounds.x ?? 0,
+          y: ghost.bounds.y ?? 0,
+          width: ghost.bounds.width ?? 0,
+          height: ghost.bounds.height ?? 0
+        });
+        const cachedDescendants = descendantsSnapshot.get(ghost.id);
+        if (cachedDescendants && cachedDescendants.length > 0) {
+          for (const desc of cachedDescendants) {
+            rects.push({
+              id: desc.id,
+              x: desc.x + dx,
+              y: desc.y + dy,
+              width: desc.width,
+              height: desc.height
+            });
+          }
+        }
+      }
+      return rects;
+    });
+    const resizeGhosts = computed(() => resizeGhostShadow.value);
+    const highlightedGhost = computed(() => {
+      if (!highlightedShape.value)
+        return null;
+      return {
+        ...highlightedShape.value,
+        meta: {
+          ...highlightedShape.value.meta,
+          isHighlighted: true,
+          isGhost: true
+        }
+      };
+    });
+    computed(() => {
       const byId = /* @__PURE__ */ new Map();
       if (!isExternalCreateDragging.value) {
         graphStore.ghostShadow.forEach((g) => byId.set(g.id, g));
@@ -13864,7 +14219,19 @@ const _sfc_main$e = /* @__PURE__ */ defineComponent({
         }, null, 4), [
           [vShow, marqueeRect.value]
         ]),
-        (openBlock(true), createElementBlock(Fragment, null, renderList(allGhosts.value, (g) => {
+        (openBlock(true), createElementBlock(Fragment, null, renderList(dragGhostRects.value, (g) => {
+          return openBlock(), createElementBlock("div", {
+            key: g.id,
+            class: "ghost-outline",
+            style: normalizeStyle({
+              left: g.x + "px",
+              top: g.y + "px",
+              width: g.width + "px",
+              height: g.height + "px"
+            })
+          }, null, 4);
+        }), 128)),
+        (openBlock(true), createElementBlock(Fragment, null, renderList(resizeGhosts.value, (g) => {
           return openBlock(), createBlock(resolveDynamicComponent(unref(getShapeComponent)(g)), {
             key: g.id,
             class: "ghost-shape",
@@ -13872,6 +14239,12 @@ const _sfc_main$e = /* @__PURE__ */ defineComponent({
             style: normalizeStyle(getGhostShapeStyle(g))
           }, null, 8, ["shape", "style"]);
         }), 128)),
+        highlightedGhost.value ? (openBlock(), createBlock(resolveDynamicComponent(unref(getShapeComponent)(highlightedGhost.value)), {
+          key: highlightedGhost.value.id,
+          class: "ghost-shape",
+          shape: highlightedGhost.value,
+          style: normalizeStyle(getGhostShapeStyle(highlightedGhost.value))
+        }, null, 8, ["shape", "style"])) : createCommentVNode("", true),
         createVNode(NameEditor, {
           "selected-shape": unref(graphStore).selectedShape,
           "can-edit": !unref(graphStore).pendingNestedIds.includes(
@@ -13882,7 +14255,7 @@ const _sfc_main$e = /* @__PURE__ */ defineComponent({
           "name-edit-manager": unref(nameEditManager)
         }, null, 8, ["selected-shape", "can-edit", "is-editing-name", "editing-name", "name-edit-manager"]),
         unref(selectedShape) && !isMultiSelected.value ? (openBlock(), createBlock(ContextMenu, {
-          key: 2,
+          key: 3,
           visible: showContextMenu.value,
           "selected-shape": unref(selectedShape),
           position: contextMenuPosition.value,
@@ -13890,7 +14263,7 @@ const _sfc_main$e = /* @__PURE__ */ defineComponent({
           onShowPropertyPanel: _cache[1] || (_cache[1] = ($event) => onLayerDblClick(true))
         }, null, 8, ["visible", "selected-shape", "position"])) : createCommentVNode("", true),
         _ctx.connectShapeData && _ctx.diagramBounds ? (openBlock(), createElementBlock("div", {
-          key: 3,
+          key: 4,
           class: "connect-layer",
           style: normalizeStyle(layerStyle.value)
         }, [
@@ -13910,7 +14283,7 @@ const _sfc_main$e = /* @__PURE__ */ defineComponent({
           ])
         ], 4)) : createCommentVNode("", true),
         unref(highlightOverlayBounds) ? (openBlock(), createElementBlock("div", {
-          key: 4,
+          key: 5,
           class: normalizeClass(["highlight-overlay", unref(highlightOverlayColor)]),
           style: normalizeStyle({
             left: unref(highlightOverlayBounds).x + "px",
@@ -13923,8 +14296,8 @@ const _sfc_main$e = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const InteractionLayer_vue_vue_type_style_index_0_scoped_24a22c8c_lang = "";
-const InteractionLayer = /* @__PURE__ */ _export_sfc(_sfc_main$e, [["__scopeId", "data-v-24a22c8c"]]);
+const InteractionLayer_vue_vue_type_style_index_0_scoped_a7475c72_lang = "";
+const InteractionLayer = /* @__PURE__ */ _export_sfc(_sfc_main$e, [["__scopeId", "data-v-a7475c72"]]);
 const _hoisted_1$d = { class: "diagram-header" };
 const _hoisted_2$d = { class: "diagram-title" };
 const _sfc_main$d = /* @__PURE__ */ defineComponent({
@@ -16574,8 +16947,8 @@ const _sfc_main$1 = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const DiagramListTooltip_vue_vue_type_style_index_0_scoped_57913d2d_lang = "";
-const DiagramListTooltip = /* @__PURE__ */ _export_sfc(_sfc_main$1, [["__scopeId", "data-v-57913d2d"]]);
+const DiagramListTooltip_vue_vue_type_style_index_0_scoped_4e4791fa_lang = "";
+const DiagramListTooltip = /* @__PURE__ */ _export_sfc(_sfc_main$1, [["__scopeId", "data-v-4e4791fa"]]);
 class ViewportCulling {
   constructor(options = {}) {
     __publicField(this, "viewportBounds");
@@ -16731,7 +17104,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
   emits: ["shapes-property", "shapes-edit-name", "connect-end", "object-flow-connect-end", "action-button-click", "diagramDoubleClick", "model-type-property-id-button-click", "action-button-add", "scale-changed"],
   setup(__props, { expose: __expose, emit: __emit }) {
     useCssVars((_ctx) => ({
-      "18ea7fc8": currentScale.value
+      "478247fa": currentScale.value
     }));
     registerShapes({
       StrategicTaxonomyDiagram,
@@ -16902,7 +17275,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
         return 0;
       });
       clearEdgeStyleCache();
-      graphStore.shapes = [];
+      graphStore.clearAll();
       graphStore.updateShapes(shapes2, "replace");
       nextTick(() => {
         graphStore.initializeAllEdgeEndpoints();
@@ -16925,7 +17298,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       let removed = 0;
       for (let i = arr.length - 1; i >= 0; i--) {
         if ("inert" in arr[i]) {
-          arr.splice(i, 1);
+          graphStore.removeShape(arr[i].id);
           removed++;
         }
       }
@@ -17111,8 +17484,8 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const graph_vue_vue_type_style_index_0_scoped_d4982c78_lang = "";
-const GraphView = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-d4982c78"]]);
+const graph_vue_vue_type_style_index_0_scoped_f90f1704_lang = "";
+const GraphView = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-f90f1704"]]);
 const MxSoseGraphPlugin = {
   install(app, options) {
     const externalPinia = options?.pinia || // 优先使用显式传入的