@yuzhouu/canvas-kit 0.1.2 → 0.1.4

package/_vendor/canvas-core/tools/select/states/PointingShapeState.ts

@@ -1,140 +0,0 @@
-import type { Editor } from "../../../editor/Editor";
-import { Vec } from "../../../geometry/Vec";
-import { StateNode } from "../../../editor/StateNode";
-import type { PointerEditorEvent } from "../../../editor/events";
-import {
-  createTranslatingUpdates,
-  getTranslateShapeSnapshots,
-  isAdditiveSelectionActive,
-  isQuickClick,
-  type PointingShapeInfo,
-  type TranslatingInfo,
-} from "../selectToolHelpers";
-import { PointingStateNode } from "./SelectStateNode";
-
-export class PointingShapeState extends PointingStateNode<PointingShapeInfo> {
-  constructor(editor: Editor, parent: StateNode) {
-    super(editor, "pointing_shape", parent);
-  }
-
-  protected onInfoEnter(): void {
-    if (!this.info) {
-      return;
-    }
-
-    if (this.info.quickClickSelectionTargetId) {
-      return;
-    }
-
-    if (this.info.additiveSelection) {
-      if (!this.info.wasSelected) {
-        this.editor.commands.setSelectedShapeIds(
-          [...this.info.previousSelection, this.info.shapeId],
-          { source: "system" },
-        );
-      }
-      return;
-    }
-
-    if (!this.info.wasSelected) {
-      this.editor.commands.setSelectedShapeIds([this.info.shapeId], {
-        source: "system",
-      });
-    }
-  }
-
-  protected onDragThresholdExceeded(): void {
-    if (!this.info) {
-      return;
-    }
-
-    const selectedShapes = this.editor.getSelectedShapes();
-    const selectedShapeIds = this.info.wasSelected
-      ? selectedShapes.map((shape) => shape.id)
-      : [this.info.translateTargetId];
-    if (
-      !this.info.wasSelected &&
-      selectedShapeIds.length === 1 &&
-      selectedShapeIds[0] !== this.info.shapeId
-    ) {
-      this.editor.commands.setSelectedShapeIds(selectedShapeIds, {
-        source: "system",
-      });
-    }
-    const selectionFrame = this.editor.getSelectionFrame();
-    const selectedShapeSnapshots = getTranslateShapeSnapshots(
-      this.editor,
-      selectedShapeIds,
-    );
-    const movingShapeIds = selectedShapeSnapshots.map((shape) => shape.id);
-    const snapRotation = selectionFrame?.hasCompatibleRotation
-      ? selectionFrame.rotation
-      : 0;
-    const snapRotationCenter =
-      selectionFrame?.rotationCenter.clone() ?? Vec.Zero();
-    const startBounds = selectionFrame?.hasCompatibleRotation
-      ? selectionFrame.bounds.clone()
-      : this.editor.getSelectionPageBounds();
-    this.transition("translating", {
-      originPagePoint: this.info.originPagePoint,
-      previousSelection: this.info.previousSelection,
-      selectedShapeIds,
-      startBounds,
-      snapSnapshot: this.editor.snaps.createTranslateSnapshot({
-        movingShapeIds,
-        coordinateSpace: {
-          rotation: snapRotation,
-          rotationCenter: snapRotationCenter,
-        },
-      }),
-      snapRotation,
-      selectedShapes: selectedShapeSnapshots,
-      updates: createTranslatingUpdates(selectedShapeSnapshots),
-      lockedAxis: null,
-      lastDeltaX: Number.NaN,
-      lastDeltaY: Number.NaN,
-    } satisfies TranslatingInfo);
-  }
-
-  protected onPointerUp(event: PointerEditorEvent): void {
-    if (this.info?.quickClickSelectionTargetId) {
-      const quickClick = isQuickClick(this.info, event);
-      if (quickClick) {
-        this.editor.commands.setSelectedShapeIds(
-          [this.info.quickClickSelectionTargetId],
-          { source: "system" },
-        );
-      }
-      const shouldForwardDoubleClick =
-        quickClick && (event.clickCount ?? 1) >= 2;
-      if (!shouldForwardDoubleClick) {
-        this.editor.resetPointerClickTracking();
-      }
-    } else if (isAdditiveSelectionActive(event) && this.info?.wasSelected) {
-      this.editor.commands.setSelectedShapeIds(
-        this.info.previousSelection.filter((id) => id !== this.info?.shapeId),
-        { source: "system" },
-      );
-    } else if (
-      this.info &&
-      !this.info.additiveSelection &&
-      this.info.wasSelected &&
-      !this.info.fromSelectionBounds &&
-      this.info.previousSelection.length > 1
-    ) {
-      this.editor.commands.setSelectedShapeIds([this.info.shapeId], {
-        source: "system",
-      });
-    }
-    this.transition("idle");
-  }
-
-  protected onCancel(): void {
-    if (this.info) {
-      this.editor.commands.setSelectedShapeIds(this.info.previousSelection, {
-        source: "system",
-      });
-    }
-    this.transition("idle");
-  }
-}

package/_vendor/canvas-core/tools/select/states/ResizingState.ts

@@ -1,171 +0,0 @@
-import type { Editor } from "../../../editor/Editor";
-import { getConstrainedSelectionResizeBoundsWithScale } from "../../../editor/resizeGeometry";
-import { StateNode } from "../../../editor/StateNode";
-import { selectionPagePointToLocalPoint } from "../../../editor/selection";
-import {
-  RESIZE_HISTORY_MARK,
-  RESIZE_SNAP_DISTANCE_SCREEN,
-  getResizedPagePointsUpdate,
-  getResizedShapeUpdate,
-  getSelectionTransform,
-  type ResizingInfo,
-} from "../selectToolHelpers";
-import { DraggingStateNode, type DragApplyInput } from "./SelectStateNode";
-
-export class ResizingState extends DraggingStateNode<ResizingInfo> {
-  protected readonly tickMode =
-    "apply_after_scroll_or_without_screen_point" as const;
-
-  constructor(editor: Editor, parent: StateNode) {
-    super(editor, "resizing", parent);
-  }
-
-  protected getHistoryMark(): string {
-    return RESIZE_HISTORY_MARK;
-  }
-
-  protected onDragStart(): void {
-    this.editor.setSnapIndicators(null);
-  }
-
-  protected onPointerUp(): void {
-    this.complete();
-  }
-
-  protected onCancel(): void {
-    if (this.info) {
-      this.editor.commands.setSelectedShapeIds(this.info.previousSelection, {
-        source: "system",
-      });
-    }
-    this.cancel();
-  }
-
-  protected onInfoExit(): void {
-    this.editor.setSnapIndicators(null);
-  }
-
-  protected apply({
-    pagePoint,
-    shiftKey,
-    altKey,
-    accelKey,
-  }: DragApplyInput): void {
-    if (!this.info) {
-      return;
-    }
-
-    if (
-      pagePoint.x === this.info.lastPagePointX &&
-      pagePoint.y === this.info.lastPagePointY &&
-      shiftKey === this.info.lastShiftKey &&
-      altKey === this.info.lastAltKey &&
-      accelKey === this.info.lastAccelKey
-    ) {
-      return;
-    }
-    this.info.lastPagePointX = pagePoint.x;
-    this.info.lastPagePointY = pagePoint.y;
-    this.info.lastShiftKey = shiftKey;
-    this.info.lastAltKey = altKey;
-    this.info.lastAccelKey = accelKey;
-
-    const selectionTransform = getSelectionTransform(
-      this.info.rotationCenter,
-      this.info.rotation,
-    );
-    const resizePagePoint = pagePoint.sub(this.info.cursorHandleOffset);
-    const localPagePoint = selectionPagePointToLocalPoint(
-      resizePagePoint,
-      selectionTransform,
-    );
-    const isAspectRatioLocked =
-      this.info.aspectRatioLockOverride ?? shiftKey;
-    const nextResize = getConstrainedSelectionResizeBoundsWithScale({
-      startBounds: this.info.startBounds,
-      handleId: this.info.handleId,
-      pagePoint: localPagePoint,
-      isAspectRatioLocked,
-      isResizingFromCenter: altKey,
-      aspectRatio: this.info.aspectRatio,
-    });
-    const canSnap =
-      !accelKey &&
-      this.info.snapSnapshot.points.length > 0;
-    const snappedResize = canSnap
-      ? this.editor.snaps.snapResize({
-          handleId: this.info.handleId,
-          initialSelectionBounds: this.info.startBounds,
-          resizedSelectionBounds: nextResize.bounds,
-          scaleX: nextResize.scaleX,
-          scaleY: nextResize.scaleY,
-          snapshot: this.info.snapSnapshot,
-          threshold:
-            RESIZE_SNAP_DISTANCE_SCREEN / this.editor.getCurrentCamera().z,
-          isAspectRatioLocked,
-          isResizingFromCenter: altKey,
-        })
-      : nextResize;
-
-    if (!canSnap) {
-      this.editor.snaps.clearIndicators();
-    }
-
-    for (let index = 0; index < this.info.shapes.length; index += 1) {
-      const shape = this.info.shapes[index];
-      const update = this.info.updates[index];
-      if (!shape || !update) {
-        continue;
-      }
-      getResizedShapeUpdate(
-        this.editor,
-        shape,
-        this.info.startBounds,
-        snappedResize.bounds,
-        snappedResize.scaleX,
-        snappedResize.scaleY,
-        this.info.handleId,
-        altKey,
-        this.info.rotationCenter,
-        this.info.rotation,
-        update,
-      );
-    }
-
-    for (let index = 0; index < this.info.pointShapes.length; index += 1) {
-      const shape = this.info.pointShapes[index];
-      const update = this.info.updates[this.info.shapes.length + index];
-      if (!shape || !update) {
-        continue;
-      }
-
-      getResizedPagePointsUpdate(
-        this.editor,
-        shape,
-        this.info.startBounds,
-        snappedResize.bounds,
-        snappedResize.scaleX,
-        snappedResize.scaleY,
-        this.info.handleId,
-        altKey,
-        this.info.rotationCenter,
-        this.info.rotation,
-        update,
-      );
-    }
-
-    this.editor.commands.updateShapes(this.info.updates);
-  }
-
-  private complete(): void {
-    this.editor.setSnapIndicators(null);
-    this.editor.history.squashToMark(RESIZE_HISTORY_MARK);
-    this.transition("idle");
-  }
-
-  private cancel(): void {
-    this.editor.setSnapIndicators(null);
-    this.editor.history.bailToMark(RESIZE_HISTORY_MARK);
-    this.transition("idle");
-  }
-}

package/_vendor/canvas-core/tools/select/states/RotatingState.ts

@@ -1,124 +0,0 @@
-import type { Editor } from "../../../editor/Editor";
-import { Vec } from "../../../geometry/Vec";
-import { StateNode } from "../../../editor/StateNode";
-import {
-  ROTATE_HISTORY_MARK,
-  ROTATION_SNAP_STEP,
-  ROTATION_SOFT_SNAP_MAX_SCREEN_VELOCITY,
-  ROTATION_SOFT_SNAP_STEP,
-  ROTATION_SOFT_SNAP_THRESHOLD,
-  getRotatedPagePointsUpdate,
-  getRotatedShapeUpdate,
-  normalizeAngle,
-  snapAngle,
-  type RotatingInfo,
-} from "../selectToolHelpers";
-import { DraggingStateNode, type DragApplyInput } from "./SelectStateNode";
-
-export class RotatingState extends DraggingStateNode<RotatingInfo> {
-  protected readonly tickMode = "apply_after_scroll" as const;
-
-  constructor(editor: Editor, parent: StateNode) {
-    super(editor, "rotating", parent);
-  }
-
-  protected getHistoryMark(): string {
-    return ROTATE_HISTORY_MARK;
-  }
-
-  protected onPointerUp(): void {
-    this.complete();
-  }
-
-  protected onCancel(): void {
-    if (this.info) {
-      this.editor.commands.setSelectedShapeIds(this.info.previousSelection, {
-        source: "system",
-      });
-    }
-    this.cancel();
-  }
-
-  protected apply({ pagePoint, shiftKey, accelKey }: DragApplyInput): void {
-    if (!this.info) {
-      return;
-    }
-
-    if (
-      pagePoint.x === this.info.lastPointerX &&
-      pagePoint.y === this.info.lastPointerY &&
-      shiftKey === this.info.lastShiftKey &&
-      accelKey === this.info.lastAccelKey
-    ) {
-      return;
-    }
-    this.info.lastPointerX = pagePoint.x;
-    this.info.lastPointerY = pagePoint.y;
-    this.info.lastShiftKey = shiftKey;
-    this.info.lastAccelKey = accelKey;
-
-    let delta = normalizeAngle(
-      Vec.Angle(this.info.center, pagePoint) - this.info.startAngle,
-    );
-    if (shiftKey) {
-      delta = snapAngle(delta, ROTATION_SNAP_STEP);
-    } else {
-      const shouldSoftSnap =
-        !accelKey &&
-        this.editor.inputs.state.get().screenVelocity.len() <
-          ROTATION_SOFT_SNAP_MAX_SCREEN_VELOCITY;
-      if (shouldSoftSnap) {
-        const nextSelectionRotation =
-          this.info.initialSelectionRotation + delta;
-        const snappedSelectionRotation = snapAngle(
-          nextSelectionRotation,
-          ROTATION_SOFT_SNAP_STEP,
-        );
-        const snapOffset = normalizeAngle(
-          snappedSelectionRotation - nextSelectionRotation,
-        );
-        if (Math.abs(snapOffset) <= ROTATION_SOFT_SNAP_THRESHOLD) {
-          delta = normalizeAngle(
-            snappedSelectionRotation - this.info.initialSelectionRotation,
-          );
-        }
-      }
-    }
-
-    for (let index = 0; index < this.info.shapes.length; index += 1) {
-      const shape = this.info.shapes[index];
-      const update = this.info.updates[index];
-      if (!shape || !update) {
-        continue;
-      }
-      getRotatedShapeUpdate(shape, this.info.center, delta, update);
-    }
-
-    for (let index = 0; index < this.info.pointShapes.length; index += 1) {
-      const shape = this.info.pointShapes[index];
-      const update = this.info.updates[this.info.shapes.length + index];
-      if (!shape || !update) {
-        continue;
-      }
-      getRotatedPagePointsUpdate(
-        this.editor,
-        shape,
-        this.info.center,
-        delta,
-        update,
-      );
-    }
-
-    this.editor.commands.updateShapes(this.info.updates);
-  }
-
-  private complete(): void {
-    this.editor.history.squashToMark(ROTATE_HISTORY_MARK);
-    this.transition("idle");
-  }
-
-  private cancel(): void {
-    this.editor.history.bailToMark(ROTATE_HISTORY_MARK);
-    this.transition("idle");
-  }
-}

package/_vendor/canvas-core/tools/select/states/SelectStateNode.ts

@@ -1,128 +0,0 @@
-import type { Editor } from "../../../editor/Editor";
-import type { Vec } from "../../../geometry/Vec";
-import { StateNode } from "../../../editor/StateNode";
-import type {
-  PointerEditorEvent,
-  TickEditorEvent,
-} from "../../../editor/events";
-import {
-  applySelectionDragFromCurrentInputs,
-  getSelectionDragInputForTick,
-  hasExceededDragThreshold,
-  type EdgeScrollTickMode,
-} from "../selectToolHelpers";
-
-/**
- * Base for every select-tool state that carries a transient `info` payload.
- * Centralises the identical `info` lifecycle (assign on enter, clear on exit)
- * so concrete states only express their behaviour. Cleanup that must run while
- * `info` is still readable belongs in {@link onInfoExit}.
- */
-export abstract class InfoStateNode<T> extends StateNode {
-  protected info: T | null = null;
-
-  protected onEnter(info?: unknown): void {
-    this.info = info as T;
-    this.onInfoEnter();
-  }
-
-  protected onExit(): void {
-    this.onInfoExit();
-    this.info = null;
-  }
-
-  /** Runs after `info` is assigned. */
-  protected onInfoEnter(): void {}
-
-  /** Runs before `info` is cleared. */
-  protected onInfoExit(): void {}
-}
-
-/**
- * Base for the "pointing_*" states. They all wait for the pointer to exceed the
- * drag threshold before committing to a gesture; subclasses only implement what
- * happens once that threshold is crossed.
- */
-export abstract class PointingStateNode<
-  T extends { originPagePoint: Vec },
-> extends InfoStateNode<T> {
-  protected onPointerMove(event: PointerEditorEvent): void {
-    if (!this.info) {
-      return;
-    }
-    if (!hasExceededDragThreshold(this.info.originPagePoint, event.pagePoint)) {
-      return;
-    }
-    this.onDragThresholdExceeded(event);
-  }
-
-  protected abstract onDragThresholdExceeded(event: PointerEditorEvent): void;
-}
-
-/** Pointer/keyboard fields shared by pointer events and synthesized drag inputs. */
-export interface DragApplyInput {
-  pagePoint: Vec;
-  shiftKey: boolean;
-  altKey: boolean;
-  accelKey: boolean;
-}
-
-/**
- * Base for the active drag states (translate / resize / rotate / handle
- * interaction). Centralises the identical event wiring: mark history on enter,
- * apply on pointer-move, apply edge-scroll-aware input on tick, and re-apply the
- * current input on key changes. Subclasses implement {@link apply} plus their own
- * completion/cancellation and any extra cleanup.
- */
-export abstract class DraggingStateNode<T> extends InfoStateNode<T> {
-  /** Edge-scroll behaviour for this gesture's tick handling. */
-  protected abstract readonly tickMode: EdgeScrollTickMode;
-
-  /** History mark to open on enter (constant or derived from `info`). */
-  protected abstract getHistoryMark(info: T): string;
-
-  /** Apply one drag sample. Implementations must guard on `this.info`. */
-  protected abstract apply(input: DragApplyInput): void;
-
-  protected onInfoEnter(): void {
-    if (this.info) {
-      this.editor.history.mark(this.getHistoryMark(this.info));
-    }
-    this.onDragStart();
-  }
-
-  /** Extra setup after the history mark is opened (e.g. clearing indicators). */
-  protected onDragStart(): void {}
-
-  protected onPointerMove(event: PointerEditorEvent): void {
-    this.apply(event);
-  }
-
-  protected onTick(event: TickEditorEvent): void {
-    if (!this.info) {
-      return;
-    }
-    const input = getSelectionDragInputForTick(
-      this.editor,
-      event,
-      this.tickMode,
-    );
-    if (input) {
-      this.apply(input);
-    }
-  }
-
-  protected onKeyDown(): void {
-    this.applyFromInputs();
-  }
-
-  protected onKeyUp(): void {
-    this.applyFromInputs();
-  }
-
-  protected applyFromInputs(): void {
-    applySelectionDragFromCurrentInputs(this.editor, (input) =>
-      this.apply(input),
-    );
-  }
-}

package/_vendor/canvas-core/tools/select/states/TranslatingState.ts

@@ -1,139 +0,0 @@
-import type { Editor } from "../../../editor/Editor";
-import { Vec } from "../../../geometry/Vec";
-import { StateNode } from "../../../editor/StateNode";
-import {
-  applyContainmentParent,
-  updateDropTarget,
-} from "../selectContainment";
-import {
-  TRANSLATE_HISTORY_MARK,
-  TRANSLATE_SNAP_DISTANCE_SCREEN,
-  TRANSLATE_SNAP_MAX_SCREEN_VELOCITY,
-  type TranslatingInfo,
-} from "../selectToolHelpers";
-import { DraggingStateNode, type DragApplyInput } from "./SelectStateNode";
-
-export class TranslatingState extends DraggingStateNode<TranslatingInfo> {
-  protected readonly tickMode = "always_apply" as const;
-
-  constructor(editor: Editor, parent: StateNode) {
-    super(editor, "translating", parent);
-  }
-
-  protected getHistoryMark(): string {
-    return TRANSLATE_HISTORY_MARK;
-  }
-
-  protected onDragStart(): void {
-    this.editor.setSnapIndicators(null);
-  }
-
-  protected onPointerUp(): void {
-    this.complete();
-  }
-
-  protected onCancel(): void {
-    if (this.info) {
-      this.editor.commands.setSelectedShapeIds(this.info.previousSelection, {
-        source: "system",
-      });
-    }
-    this.cancel();
-  }
-
-  protected onInfoExit(): void {
-    this.editor.setSnapIndicators(null);
-  }
-
-  protected apply({ pagePoint, shiftKey, accelKey }: DragApplyInput): void {
-    if (!this.info) {
-      return;
-    }
-
-    const rawDeltaX = pagePoint.x - this.info.originPagePoint.x;
-    const rawDeltaY = pagePoint.y - this.info.originPagePoint.y;
-    if (!shiftKey) {
-      this.info.lockedAxis = null;
-    } else if (!this.info.lockedAxis && (rawDeltaX !== 0 || rawDeltaY !== 0)) {
-      this.info.lockedAxis =
-        Math.abs(rawDeltaX) >= Math.abs(rawDeltaY) ? "x" : "y";
-    }
-
-    let deltaX = rawDeltaX;
-    let deltaY = rawDeltaY;
-    if (this.info.lockedAxis === "x") {
-      deltaY = 0;
-    } else if (this.info.lockedAxis === "y") {
-      deltaX = 0;
-    }
-
-    const startBounds = this.info.startBounds;
-    const canSnap =
-      !accelKey &&
-      !!startBounds &&
-      (this.info.snapSnapshot.points.length > 0 ||
-        this.info.snapSnapshot.nodes.length > 0) &&
-      this.editor.inputs.state.get().screenVelocity.len() <
-        TRANSLATE_SNAP_MAX_SCREEN_VELOCITY;
-
-    if (canSnap && startBounds) {
-      const snapRotation = this.info.snapRotation;
-      const snapThreshold =
-        TRANSLATE_SNAP_DISTANCE_SCREEN / this.editor.getCurrentCamera().z;
-      const translatedDelta =
-        snapRotation === 0
-          ? new Vec(deltaX, deltaY)
-          : new Vec(deltaX, deltaY).rot(-snapRotation);
-      const { nudge: snapOffset } = this.editor.snaps.snapTranslate({
-        lockedAxis: this.info.lockedAxis,
-        initialSelectionBounds: startBounds,
-        dragDelta: translatedDelta,
-        snapshot: this.info.snapSnapshot,
-        threshold: snapThreshold,
-      });
-      const pageSnapOffset =
-        snapRotation === 0 ? snapOffset : snapOffset.rot(snapRotation);
-
-      deltaX += this.info.lockedAxis === "y" ? 0 : pageSnapOffset.x;
-      deltaY += this.info.lockedAxis === "x" ? 0 : pageSnapOffset.y;
-    } else {
-      this.editor.snaps.clearIndicators();
-    }
-
-    if (deltaX === this.info.lastDeltaX && deltaY === this.info.lastDeltaY) {
-      return;
-    }
-    this.info.lastDeltaX = deltaX;
-    this.info.lastDeltaY = deltaY;
-
-    for (let index = 0; index < this.info.selectedShapes.length; index += 1) {
-      const shape = this.info.selectedShapes[index];
-      const update = this.info.updates[index];
-      if (!shape || !update) {
-        continue;
-      }
-      update.x = shape.x + deltaX;
-      update.y = shape.y + deltaY;
-    }
-
-    this.editor.commands.updateShapes(this.info.updates);
-    updateDropTarget(this.editor, this.info.selectedShapeIds);
-  }
-
-  private complete(): void {
-    if (this.info) {
-      applyContainmentParent(this.editor, this.info.selectedShapeIds);
-    }
-    this.editor.setDropTargetShapeId(null);
-    this.editor.setSnapIndicators(null);
-    this.editor.history.squashToMark(TRANSLATE_HISTORY_MARK);
-    this.transition("idle");
-  }
-
-  private cancel(): void {
-    this.editor.setDropTargetShapeId(null);
-    this.editor.setSnapIndicators(null);
-    this.editor.history.bailToMark(TRANSLATE_HISTORY_MARK);
-    this.transition("idle");
-  }
-}