@yuzhouu/canvas-kit 0.1.2

package/_vendor/canvas-core/editor/managers/ShapeHierarchyManager.ts

@@ -0,0 +1,797 @@
+import type { ChangeSource } from "@land/store";
+import { Box } from "../../geometry/Box";
+import { Vec } from "../../geometry/Vec";
+import type {
+  PageId,
+  ShapeId,
+  ShapeParentId,
+  ShapeRecord,
+} from "../../schema/records";
+import type { Editor } from "../Editor";
+import type {
+  ContainerBoundsQueryOptions,
+  LayerOrderDirection,
+  LayerOrderEdge,
+  LayerTreeNode,
+  ReparentShapePlacementInput,
+  ReparentShapePlacementResult,
+  ShapeGroupState,
+  ShapeSelectionSiblingOrderState,
+  ShapeSiblingOrderDirection,
+  ShapeSiblingOrderEdge,
+  ShapeSiblingOrderState,
+} from "../Editor";
+import type { ShapeUpdate } from "../commands";
+import { getEditorStore } from "../internal";
+import { isValidBox } from "../editorComputedHelpers";
+import * as shapeOrder from "./shapeOrder";
+import * as shapeReparenting from "./shapeReparenting";
+
+/**
+ * Shape-tree structure operations for the editor: grouping/ungrouping, the layer
+ * tree, sibling/parent z-ordering, and reparent placement. These are cohesive
+ * mutations over the shape hierarchy carved out of the Editor facade so the
+ * editor can stay a thinner delegating surface. The Editor exposes thin wrappers
+ * that forward here.
+ */
+export class ShapeHierarchyManager {
+  constructor(private readonly editor: Editor) {}
+
+  private get store() {
+    return getEditorStore(this.editor);
+  }
+
+  getSelectionParentOrderState(): ShapeSelectionSiblingOrderState | null {
+    return shapeOrder.getSelectionParentOrderState(this.editor);
+  }
+
+  getSelectionGroupState(): ShapeGroupState | null {
+    const editor = this.editor;
+    const selectedShapes = editor.getSelectedShapes();
+    if (selectedShapes.length < 2) {
+      return null;
+    }
+    if (
+      selectedShapes.some(
+        (shape) => shape.isLocked || editor.hasLockedDescendant(shape.id),
+      )
+    ) {
+      return null;
+    }
+
+    const parentId = selectedShapes[0]?.parentId;
+    if (!parentId) {
+      return null;
+    }
+    if (selectedShapes.some((shape) => shape.parentId !== parentId)) {
+      return null;
+    }
+
+    const siblings = editor.getChildShapes(parentId);
+    const selectedIds = new Set(selectedShapes.map((shape) => shape.id));
+    const sortedShapeIds = siblings
+      .filter((shape) => selectedIds.has(shape.id))
+      .map((shape) => shape.id);
+    if (sortedShapeIds.length !== selectedShapes.length) {
+      return null;
+    }
+
+    const bounds = editor.getSelectionPageBounds();
+    if (!bounds || !isValidBox(bounds)) {
+      return null;
+    }
+
+    return {
+      parentId,
+      shapeIds: sortedShapeIds,
+      bounds,
+    };
+  }
+
+  canGroupSelection(): boolean {
+    return this.getSelectionGroupState() !== null;
+  }
+
+  private getGroupStateForShapeIds(
+    ids: readonly ShapeId[],
+  ): ShapeGroupState | null {
+    const editor = this.editor;
+    const uniqueIds = Array.from(new Set(ids));
+    const shapes = uniqueIds
+      .map((id) => editor.getShape(id))
+      .filter((shape): shape is ShapeRecord => !!shape);
+    if (shapes.length < 2 || shapes.length !== uniqueIds.length) {
+      return null;
+    }
+    if (
+      shapes.some(
+        (shape) =>
+          shape.isLocked ||
+          editor.hasLockedDescendant(shape.id) ||
+          editor.isShapeHidden(shape.id),
+      )
+    ) {
+      return null;
+    }
+
+    const parentId = shapes[0]?.parentId;
+    if (!parentId) {
+      return null;
+    }
+    if (shapes.some((shape) => shape.parentId !== parentId)) {
+      return null;
+    }
+
+    const siblings = editor.getChildShapes(parentId);
+    const groupedIds = new Set(uniqueIds);
+    const sortedShapeIds = siblings
+      .filter((shape) => groupedIds.has(shape.id))
+      .map((shape) => shape.id);
+    if (sortedShapeIds.length !== uniqueIds.length) {
+      return null;
+    }
+
+    const boundsPoints = sortedShapeIds
+      .map((id) => editor.getShapePageBounds(id))
+      .filter((box): box is Box => !!box)
+      .flatMap((box) => [
+        new Vec(box.minX, box.minY),
+        new Vec(box.maxX, box.minY),
+        new Vec(box.maxX, box.maxY),
+        new Vec(box.minX, box.maxY),
+      ]);
+    const bounds =
+      boundsPoints.length > 0 ? Box.FromPoints(boundsPoints) : null;
+    if (!bounds || !isValidBox(bounds)) {
+      return null;
+    }
+
+    return {
+      parentId,
+      shapeIds: sortedShapeIds,
+      bounds,
+    };
+  }
+
+  private groupShapesFromState(
+    state: ShapeGroupState,
+    source: ChangeSource,
+  ): ShapeRecord | null {
+    const editor = this.editor;
+    const siblings = editor.getChildShapes(state.parentId);
+    const groupedIds = new Set(state.shapeIds);
+    const firstGroupedIndex = siblings.findIndex((shape) =>
+      groupedIds.has(shape.id),
+    );
+    if (firstGroupedIndex < 0) {
+      return null;
+    }
+
+    editor.cancelInteractionForCommand();
+    const createdGroups: ShapeRecord[] = [];
+    this.store.atomic(() => {
+      const [createdGroup] = editor.commands.createShapes(
+        [
+          {
+            type: "group",
+            x: state.bounds.x,
+            y: state.bounds.y,
+            parentId: state.parentId,
+            index: editor.createShapeIndex(firstGroupedIndex + 1),
+            props: {
+              w: state.bounds.w,
+              h: state.bounds.h,
+            },
+          },
+        ],
+        { source },
+      );
+      if (!createdGroup) {
+        return;
+      }
+      createdGroups.push(createdGroup);
+
+      const nextParentSiblings: ShapeRecord[] = [];
+      let didInsertGroup = false;
+      for (const sibling of siblings) {
+        if (groupedIds.has(sibling.id)) {
+          if (!didInsertGroup) {
+            nextParentSiblings.push(createdGroup);
+            didInsertGroup = true;
+          }
+          continue;
+        }
+        nextParentSiblings.push(sibling);
+      }
+
+      const selectedChildren = state.shapeIds
+        .map((id) => editor.getShape(id))
+        .filter((shape): shape is ShapeRecord => !!shape);
+      editor.commands.updateShapes(
+        [
+          ...nextParentSiblings.map((shape, index) => ({
+            id: shape.id,
+            index: editor.createShapeIndex(index + 1),
+          })),
+          ...selectedChildren.map((shape, index) => ({
+            id: shape.id,
+            parentId: createdGroup.id,
+            index: editor.createShapeIndex(index + 1),
+          })),
+        ],
+        { source },
+      );
+    }, source);
+
+    return createdGroups[0] ?? null;
+  }
+
+  getLayerTree(
+    pageId: PageId = this.editor.getCurrentPageId(),
+  ): LayerTreeNode[] {
+    const editor = this.editor;
+    const nodes: LayerTreeNode[] = [];
+
+    const visit = (parentId: ShapeParentId, depth: number) => {
+      const children = editor.getChildShapes(parentId);
+      children.forEach((shape, index) => {
+        const childIds = editor.getChildShapeIds(shape.id);
+        nodes.push({
+          id: shape.id,
+          parentId: shape.parentId,
+          pageId,
+          type: shape.type,
+          childIds,
+          index,
+          depth,
+          isHidden: shape.isHidden,
+          isLocked: shape.isLocked,
+          isEffectivelyHidden: editor.isShapeHidden(shape.id),
+          isEffectivelyLocked: editor.isShapeOrAncestorLocked(shape.id),
+        });
+        visit(shape.id, depth + 1);
+      });
+    };
+
+    visit(pageId, 0);
+    return nodes;
+  }
+
+  getLayerNode(id: ShapeId): LayerTreeNode | null {
+    const editor = this.editor;
+    const shape = editor.getShape(id);
+    const pageId = shape ? editor.getShapePageId(shape.id) : null;
+    if (!shape || !pageId) {
+      return null;
+    }
+
+    const siblings = editor.getChildShapeIds(shape.parentId);
+    return {
+      id: shape.id,
+      parentId: shape.parentId,
+      pageId,
+      type: shape.type,
+      childIds: editor.getChildShapeIds(shape.id),
+      index: siblings.indexOf(shape.id),
+      depth: this.getLayerDepth(shape.id),
+      isHidden: shape.isHidden,
+      isLocked: shape.isLocked,
+      isEffectivelyHidden: editor.isShapeHidden(shape.id),
+      isEffectivelyLocked: editor.isShapeOrAncestorLocked(shape.id),
+    };
+  }
+
+  private getLayerDepth(id: ShapeId): number {
+    const editor = this.editor;
+    let depth = 0;
+    let shape = editor.getShape(id);
+    const seen = new Set<ShapeId>([id]);
+    while (shape?.parentId.startsWith("shape:")) {
+      const parentId = shape.parentId as ShapeId;
+      if (seen.has(parentId)) {
+        break;
+      }
+      seen.add(parentId);
+      shape = editor.getShape(parentId);
+      depth += 1;
+    }
+    return depth;
+  }
+
+  canGroupShapes(ids: readonly ShapeId[]): boolean {
+    return this.getGroupStateForShapeIds(ids) !== null;
+  }
+
+  groupShapes(
+    ids: readonly ShapeId[],
+    source: ChangeSource = "user",
+  ): ShapeRecord | null {
+    const state = this.getGroupStateForShapeIds(ids);
+    if (!state) {
+      return null;
+    }
+    return this.groupShapesFromState(state, source);
+  }
+
+  groupSelection(source: ChangeSource = "user"): ShapeRecord | null {
+    const editor = this.editor;
+    const group = this.groupShapes(editor.getSelectedShapeIds(), source);
+    if (group) {
+      editor.commands.setSelectedShapeIds([group.id], { source });
+    }
+    return group;
+  }
+
+  getUngroupableSelectedShapeIds(): ShapeId[] {
+    return this.getUngroupableShapeIds(this.editor.getSelectedShapeIds());
+  }
+
+  getUngroupableShapeIds(ids: readonly ShapeId[]): ShapeId[] {
+    const editor = this.editor;
+    return ids
+      .map((id) => editor.getShape(id))
+      .filter((shape): shape is ShapeRecord => !!shape)
+      .filter((shape) =>
+        editor.getShapeUtil(shape).shouldTransformDescendants(shape),
+      )
+      .filter(
+        (shape) =>
+          !shape.isLocked &&
+          !editor.hasLockedDescendant(shape.id) &&
+          editor.getChildShapeIds(shape.id).length > 0,
+      )
+      .map((shape) => shape.id);
+  }
+
+  canUngroupSelection(): boolean {
+    return this.getUngroupableSelectedShapeIds().length > 0;
+  }
+
+  canUngroupShapes(ids: readonly ShapeId[]): boolean {
+    return this.getUngroupableShapeIds(ids).length > 0;
+  }
+
+  ungroupShapes(
+    ids: readonly ShapeId[],
+    source: ChangeSource = "user",
+  ): ShapeId[] {
+    const editor = this.editor;
+    const selectedShapes = ids
+      .map((id) => editor.getShape(id))
+      .filter((shape): shape is ShapeRecord => !!shape);
+    const selectedGroupIds = new Set(this.getUngroupableShapeIds(ids));
+    if (selectedGroupIds.size === 0) {
+      return [];
+    }
+
+    editor.cancelInteractionForCommand();
+    const nextSelectedIds: ShapeId[] = [];
+    const nextSelectedIdSet = new Set<ShapeId>();
+
+    this.store.atomic(() => {
+      const updates: ShapeUpdate[] = [];
+      const groupsToDelete: ShapeId[] = [];
+
+      for (const selectedShape of selectedShapes) {
+        if (!selectedGroupIds.has(selectedShape.id)) {
+          if (!nextSelectedIdSet.has(selectedShape.id)) {
+            nextSelectedIdSet.add(selectedShape.id);
+            nextSelectedIds.push(selectedShape.id);
+          }
+          continue;
+        }
+
+        const group = editor.getShape(selectedShape.id);
+        if (!group) {
+          continue;
+        }
+
+        const children = editor.getChildShapes(group.id);
+        const parentSiblings = editor.getChildShapes(group.parentId);
+        const childIds = new Set(children.map((child) => child.id));
+        const nextParentSiblings: ShapeRecord[] = [];
+        let didInsertChildren = false;
+        for (const sibling of parentSiblings) {
+          if (sibling.id === group.id) {
+            nextParentSiblings.push(...children);
+            didInsertChildren = true;
+            continue;
+          }
+          if (childIds.has(sibling.id)) {
+            continue;
+          }
+          nextParentSiblings.push(sibling);
+        }
+        if (!didInsertChildren) {
+          nextParentSiblings.push(...children);
+        }
+
+        updates.push(
+          ...nextParentSiblings.map((shape, index) => ({
+            id: shape.id,
+            parentId: childIds.has(shape.id) ? group.parentId : shape.parentId,
+            index: editor.createShapeIndex(index + 1),
+          })),
+        );
+        for (const child of children) {
+          if (!nextSelectedIdSet.has(child.id)) {
+            nextSelectedIdSet.add(child.id);
+            nextSelectedIds.push(child.id);
+          }
+        }
+        groupsToDelete.push(group.id);
+      }
+
+      if (updates.length > 0) {
+        editor.commands.updateShapes(updates, { source });
+      }
+      if (groupsToDelete.length > 0) {
+        editor.bindings.cleanupBindingsForDeletedShapes(groupsToDelete, source);
+        this.store.remove(groupsToDelete, source);
+        editor.removeShapeIdsFromSelection(groupsToDelete, source);
+        editor.removeShapeIdsFromEditingSession(groupsToDelete, source);
+      }
+    }, source);
+
+    if (nextSelectedIds.length > 0) {
+      editor.commands.setSelectedShapeIds(nextSelectedIds, { source });
+    }
+    return nextSelectedIds;
+  }
+
+  ungroupSelection(source: ChangeSource = "user"): ShapeId[] {
+    return this.ungroupShapes(this.editor.getSelectedShapeIds(), source);
+  }
+
+  getSelectionSiblingOrderState(): ShapeSiblingOrderState | null {
+    return shapeOrder.getSelectionSiblingOrderState(this.editor);
+  }
+
+  canMoveSelectionWithinParent(
+    direction: ShapeSiblingOrderDirection,
+  ): boolean {
+    return shapeOrder.canMoveSelectionWithinParent(this.editor, direction);
+  }
+
+  canMoveSelectionInParentOrder(
+    direction: ShapeSiblingOrderDirection,
+  ): boolean {
+    return shapeOrder.canMoveSelectionInParentOrder(this.editor, direction);
+  }
+
+  canMoveShapesInParentOrder(
+    ids: readonly ShapeId[],
+    direction: LayerOrderDirection,
+  ): boolean {
+    return shapeOrder.canMoveShapesInParentOrder(this.editor, ids, direction);
+  }
+
+  moveShapesInParentOrder(
+    ids: readonly ShapeId[],
+    direction: LayerOrderDirection,
+    source: ChangeSource = "user",
+  ): boolean {
+    return shapeOrder.moveShapesInParentOrder(
+      this.editor,
+      ids,
+      direction,
+      source,
+    );
+  }
+
+  moveShapesToParentOrderEdge(
+    ids: readonly ShapeId[],
+    edge: LayerOrderEdge,
+    source: ChangeSource = "user",
+  ): boolean {
+    return shapeOrder.moveShapesToParentOrderEdge(
+      this.editor,
+      ids,
+      edge,
+      source,
+    );
+  }
+
+  moveSelectionWithinParent(
+    direction: ShapeSiblingOrderDirection,
+    source: ChangeSource = "user",
+  ): boolean {
+    return shapeOrder.moveSelectionWithinParent(
+      this.editor,
+      direction,
+      source,
+    );
+  }
+
+  moveShapesToParentPlacement(
+    input: ReparentShapePlacementInput,
+    source: ChangeSource = "user",
+  ): boolean {
+    return shapeReparenting.moveShapesToParentPlacement(
+      this.editor,
+      input,
+      source,
+    );
+  }
+
+  moveShapesToParentPlacementResult(
+    input: ReparentShapePlacementInput,
+    source: ChangeSource = "user",
+  ): ReparentShapePlacementResult {
+    return shapeReparenting.moveShapesToParentPlacementResult(
+      this.editor,
+      input,
+      source,
+    );
+  }
+
+  moveSelectionInParentOrder(
+    direction: ShapeSiblingOrderDirection,
+    source: ChangeSource = "user",
+  ): boolean {
+    return shapeOrder.moveSelectionInParentOrder(
+      this.editor,
+      direction,
+      source,
+    );
+  }
+
+  moveSelectionToParentOrderEdge(
+    edge: ShapeSiblingOrderEdge,
+    source: ChangeSource = "user",
+  ): boolean {
+    return shapeOrder.moveSelectionToParentOrderEdge(
+      this.editor,
+      edge,
+      source,
+    );
+  }
+
+  isShapeOrAncestorLocked(shapeId: ShapeId): boolean {
+    const editor = this.editor;
+    const seen = new Set<ShapeId>();
+    let shape = editor.getShape(shapeId);
+
+    while (shape) {
+      if (shape.isLocked) {
+        return true;
+      }
+      if (!shape.parentId.startsWith("shape:")) {
+        return false;
+      }
+
+      const parentId = shape.parentId as ShapeId;
+      if (seen.has(parentId)) {
+        return false;
+      }
+      seen.add(parentId);
+      shape = editor.getShape(parentId);
+    }
+
+    return false;
+  }
+
+  hasLockedDescendant(shapeId: ShapeId): boolean {
+    const editor = this.editor;
+    return editor.getDescendantShapeIds(shapeId).some(
+      (descendantId) => editor.getShape(descendantId)?.isLocked ?? false,
+    );
+  }
+
+  getOutermostSelectableShapeId(shapeId: ShapeId): ShapeId {
+    const editor = this.editor;
+    let selectableShapeId = shapeId;
+    let shape = editor.getShape(shapeId);
+    const seen = new Set<ShapeId>([shapeId]);
+
+    while (shape?.parentId.startsWith("shape:")) {
+      const parentId = shape.parentId as ShapeId;
+      if (seen.has(parentId)) {
+        break;
+      }
+      seen.add(parentId);
+
+      const parent = editor.getShape(parentId);
+      if (!parent) {
+        break;
+      }
+      if (editor.getShapeUtil(parent).shouldTransformDescendants(parent)) {
+        selectableShapeId = parent.id;
+      }
+      shape = parent;
+    }
+
+    return selectableShapeId;
+  }
+
+  getShapeIdsIncludingDescendants(shapeIds: Iterable<ShapeId>): ShapeId[] {
+    const ids: ShapeId[] = [];
+    const seen = new Set<ShapeId>();
+
+    for (const shapeId of shapeIds) {
+      if (seen.has(shapeId)) {
+        continue;
+      }
+      seen.add(shapeId);
+      ids.push(shapeId);
+
+      for (const descendantId of this.editor.getDescendantShapeIds(shapeId)) {
+        if (seen.has(descendantId)) {
+          continue;
+        }
+        seen.add(descendantId);
+        ids.push(descendantId);
+      }
+    }
+
+    return ids;
+  }
+
+  getShapeIdsForSelectionTransform(shapeIds: Iterable<ShapeId>): ShapeId[] {
+    return this.getShapeIdsForSelectionDescendantTransform(
+      shapeIds,
+      (shape) => this.editor.getShapeUtil(shape).shouldTransformDescendants(shape),
+    );
+  }
+
+  getShapeIdsForSelectionRotation(shapeIds: Iterable<ShapeId>): ShapeId[] {
+    return this.getShapeIdsForSelectionDescendantTransform(
+      shapeIds,
+      (shape) => this.editor.getShapeUtil(shape).shouldRotateDescendants(shape),
+    );
+  }
+
+  getSelectionTransformTargetShapes(): ShapeRecord[] {
+    return this.getShapeIdsForSelectionTransform(this.editor.getSelectedShapeIds())
+      .map((shapeId) => this.editor.getShape(shapeId))
+      .filter((shape): shape is ShapeRecord => !!shape);
+  }
+
+  getSelectionRotationTargetShapes(): ShapeRecord[] {
+    return this.getShapeIdsForSelectionRotation(this.editor.getSelectedShapeIds())
+      .map((shapeId) => this.editor.getShape(shapeId))
+      .filter((shape): shape is ShapeRecord => !!shape);
+  }
+
+  getShapeExportTraversalIds(shapeIds: Iterable<ShapeId>): ShapeId[] {
+    const editor = this.editor;
+    const ids = this.getShapeIdsIncludingDescendants(shapeIds).filter(
+      (shapeId) => !editor.isShapeHidden(shapeId),
+    );
+    const seen = new Set(ids);
+
+    for (const shapeId of ids) {
+      for (const binding of editor.getBindingsForShape(shapeId)) {
+        const exportShapeIds = editor.getBindingUtil(binding).getExportShapeIds?.(
+          editor,
+          binding as never,
+        );
+        for (const exportShapeId of exportShapeIds ?? []) {
+          for (const descendantId of this.getShapeIdsIncludingDescendants([
+            exportShapeId,
+          ])) {
+            if (seen.has(descendantId)) {
+              continue;
+            }
+            seen.add(descendantId);
+            ids.push(descendantId);
+          }
+        }
+      }
+    }
+
+    return ids;
+  }
+
+  getShapeIdsInContainerBounds(
+    containerId: ShapeId,
+    options: ContainerBoundsQueryOptions = {},
+  ): ShapeId[] {
+    const editor = this.editor;
+    const pageId = editor.getShapePageId(containerId);
+    const containerBounds = editor.getShapePageBounds(containerId);
+    if (!pageId || !containerBounds) {
+      return [];
+    }
+
+    return editor.getShapeIdsInBounds(containerBounds, { pageId }).filter(
+      (shapeId) => {
+        if (shapeId === containerId) {
+          return false;
+        }
+
+        const containment = editor.getShapeContainment(containerId, shapeId);
+        return (
+          containment === "inside" ||
+          (options.includeIntersecting && containment === "intersecting")
+        );
+      },
+    );
+  }
+
+  canUseShapeParent(parentId: ShapeParentId, childId?: ShapeId): boolean {
+    return shapeReparenting.canUseShapeParent(
+      this.editor,
+      parentId,
+      childId,
+    );
+  }
+
+  isShapeOrAncestorInSet(shapeId: ShapeId, ids: ReadonlySet<ShapeId>): boolean {
+    let shape = this.editor.getShape(shapeId);
+    const seen = new Set<ShapeId>();
+    while (shape) {
+      if (ids.has(shape.id)) {
+        return true;
+      }
+      if (!shape.parentId.startsWith("shape:")) {
+        return false;
+      }
+      const parentId = shape.parentId as ShapeId;
+      if (seen.has(parentId)) {
+        return false;
+      }
+      seen.add(parentId);
+      shape = this.editor.getShape(parentId);
+    }
+    return false;
+  }
+
+  isShapeDescendantOf(shapeId: ShapeId, ancestorId: ShapeId): boolean {
+    let shape = this.editor.getShape(shapeId);
+    const seen = new Set<ShapeId>();
+    while (shape?.parentId.startsWith("shape:")) {
+      const parentId = shape.parentId as ShapeId;
+      if (parentId === ancestorId) {
+        return true;
+      }
+      if (seen.has(parentId)) {
+        return false;
+      }
+      seen.add(parentId);
+      shape = this.editor.getShape(parentId);
+    }
+    return false;
+  }
+
+  private getShapeIdsForSelectionDescendantTransform(
+    shapeIds: Iterable<ShapeId>,
+    shouldIncludeDescendants: (shape: ShapeRecord) => boolean,
+  ): ShapeId[] {
+    const editor = this.editor;
+    const ids: ShapeId[] = [];
+    const seen = new Set<ShapeId>();
+
+    for (const shapeId of shapeIds) {
+      const shape = editor.getShape(shapeId);
+      if (!shape || seen.has(shape.id) || shape.isLocked) {
+        continue;
+      }
+      const includeDescendants = shouldIncludeDescendants(shape);
+      if (includeDescendants && this.hasLockedDescendant(shape.id)) {
+        continue;
+      }
+
+      seen.add(shape.id);
+      ids.push(shape.id);
+
+      if (!includeDescendants) {
+        continue;
+      }
+
+      for (const descendantId of editor.getDescendantShapeIds(shape.id)) {
+        if (seen.has(descendantId)) {
+          continue;
+        }
+        const descendant = editor.getShape(descendantId);
+        if (!descendant || descendant.isLocked) {
+          continue;
+        }
+        seen.add(descendant.id);
+        ids.push(descendant.id);
+      }
+    }
+
+    return ids;
+  }
+}