@yuzhouu/canvas-kit 0.1.2 → 0.1.3

package/_vendor/plugin-arrow/ArrowTool.ts

@@ -1,208 +0,0 @@
-import {
-  StateNode,
-  Vec,
-  getEdgeScrollDelta,
-  reparentShapeToContainingParent,
-  type Editor,
-  type PointerEditorEvent,
-  type ShapeId,
-  type TickEditorEvent,
-} from "@land/canvas-core";
-import {
-  applyResolvedArrowTerminalBinding,
-  createArrow,
-} from "./arrowTerminalCommands";
-import {
-  resolveArrowTerminalBindingAtPoint,
-  resolveArrowTerminalBindingAtStartPoint,
-  resolveArrowTerminalBindingForArrow,
-} from "./arrowTerminalBindingResolver";
-import { isArrowShapeRecord, type ArrowShapeProps } from "./types";
-
-interface CreatingArrowInfo {
-  startPagePoint: Vec;
-  currentPagePoint: Vec;
-  shapeId: ShapeId | null;
-  startBinding: ReturnType<typeof resolveArrowTerminalBindingAtPoint>["binding"];
-  props: ArrowShapeProps;
-}
-
-const ARROW_CREATE_HISTORY_MARK = "arrow.create";
-const DRAG_CREATE_THRESHOLD = 4;
-
-export class ArrowTool extends StateNode {
-  constructor(editor: Editor) {
-    super(editor, "arrow");
-    this.initial = "idle";
-    this.addChild(new ArrowIdleState(editor, this));
-    this.addChild(new CreatingArrowState(editor, this));
-  }
-}
-
-class ArrowIdleState extends StateNode {
-  constructor(editor: Editor, parent: StateNode) {
-    super(editor, "idle", parent);
-  }
-
-  protected onEnter(): void {
-    this.editor.clearSelectionTransients();
-  }
-
-  protected onPointerDown(event: PointerEditorEvent): void {
-    const defaults = this.editor.getDefaultShapeProps<ArrowShapeProps>("arrow");
-    const startBinding = resolveArrowTerminalBindingAtStartPoint(this.editor, {
-      terminal: "start",
-      rawPagePoint: event.pagePoint,
-      ignoreTargets: event.accelKey,
-    });
-
-    this.transition("creating", {
-      startPagePoint: startBinding.pagePoint,
-      currentPagePoint: startBinding.pagePoint.clone(),
-      shapeId: null,
-      startBinding: startBinding.binding,
-      props: defaults,
-    } satisfies CreatingArrowInfo);
-  }
-}
-
-class CreatingArrowState extends StateNode {
-  private info: CreatingArrowInfo | null = null;
-
-  constructor(editor: Editor, parent: StateNode) {
-    super(editor, "creating", parent);
-  }
-
-  protected onEnter(info?: unknown): void {
-    this.info = info as CreatingArrowInfo;
-    if (!this.info) {
-      return;
-    }
-
-    this.editor.history.mark(ARROW_CREATE_HISTORY_MARK);
-    const created = createArrow(
-      this.editor,
-      {
-        startPagePoint: this.info.startPagePoint,
-        endPagePoint: this.info.startPagePoint,
-        startBinding: this.info.startBinding,
-        props: {
-          stroke: this.info.props.stroke,
-          strokeWidth: this.info.props.strokeWidth,
-          headStart: this.info.props.headStart,
-          headEnd: this.info.props.headEnd,
-        },
-      },
-      "user",
-    );
-    this.info.shapeId = created.id;
-
-    this.editor.commands.setSelectedShapeIds([created.id], {
-      source: "system",
-    });
-    this.editor.setBindingPreview(null);
-  }
-
-  protected onPointerMove(event: PointerEditorEvent): void {
-    this.updateShape(event.pagePoint);
-  }
-
-  protected onTick(event: TickEditorEvent): void {
-    if (!this.info) {
-      return;
-    }
-
-    const inputs = this.editor.inputs.state.get();
-    if (
-      inputs.dragPhase !== "dragging" ||
-      !inputs.currentPagePoint ||
-      !inputs.currentScreenPoint
-    ) {
-      return;
-    }
-
-    const edgeScrollDelta = getEdgeScrollDelta(
-      inputs.currentScreenPoint,
-      this.editor.viewportScreenSizeSignal.get(),
-      event.elapsed,
-    );
-    if (edgeScrollDelta.x === 0 && edgeScrollDelta.y === 0) {
-      return;
-    }
-
-    this.editor.panCamera(edgeScrollDelta);
-    this.updateShape(this.editor.screenToPage(inputs.currentScreenPoint));
-  }
-
-  protected onPointerUp(event: PointerEditorEvent): void {
-    if (!this.info) {
-      this.transition("idle");
-      return;
-    }
-
-    this.updateShape(event.pagePoint);
-
-    if (
-      !this.info.shapeId ||
-      this.info.startPagePoint.dist(this.info.currentPagePoint) <
-        DRAG_CREATE_THRESHOLD
-    ) {
-      this.editor.history.bailToMark(ARROW_CREATE_HISTORY_MARK);
-      this.transition("idle");
-      return;
-    }
-
-    reparentShapeToContainingParent(this.editor, this.info.shapeId, {
-      source: "user",
-    });
-    this.editor.history.squashToMark(ARROW_CREATE_HISTORY_MARK);
-
-    if (this.editor.isToolLocked()) {
-      this.transition("idle");
-      return;
-    }
-
-    this.editor.commands.setActiveTool("select", { source: "system" });
-  }
-
-  protected onCancel(): void {
-    this.editor.history.bailToMark(ARROW_CREATE_HISTORY_MARK);
-    this.transition("idle");
-  }
-
-  protected onExit(): void {
-    this.info = null;
-  }
-
-  private updateShape(rawPagePoint: Vec): void {
-    if (!this.info) {
-      return;
-    }
-
-    this.info.currentPagePoint = rawPagePoint.clone();
-    const shapeId = this.info.shapeId;
-    const arrow = shapeId ? this.editor.getShape(shapeId) : null;
-    const endBinding =
-      isArrowShapeRecord(arrow)
-        ? resolveArrowTerminalBindingForArrow(this.editor, {
-            arrow,
-            terminal: "end",
-            rawPagePoint,
-            ignoreTargets: this.editor.inputs.state.get().accelKey,
-          })
-        : resolveArrowTerminalBindingAtPoint(this.editor, {
-            terminal: "end",
-            rawPagePoint,
-            oppositePagePoint: this.info.startPagePoint,
-            ignoreTargets: this.editor.inputs.state.get().accelKey,
-          });
-
-    applyResolvedArrowTerminalBinding(
-      this.editor,
-      shapeId,
-      "end",
-      endBinding,
-      "user",
-    );
-  }
-}

package/_vendor/plugin-arrow/arrowGeometry.ts

@@ -1,441 +0,0 @@
-import { Box, Vec } from "@land/canvas-core";
-import type { ArrowShapeProps, ArrowShapeRecord, ArrowTerminal } from "./types";
-
-const ARROW_CURVE_SAMPLE_COUNT = 24;
-const ARROW_CURVE_EPSILON = 1e-6;
-const MIN_ARROW_AXIS = 1;
-const PI2 = Math.PI * 2;
-
-export interface ArrowInfoTerminal {
-  terminal: ArrowTerminal;
-  point: Vec;
-  handle: Vec;
-}
-
-export interface StraightArrowInfo {
-  type: "straight";
-  start: ArrowInfoTerminal;
-  end: ArrowInfoTerminal;
-  middle: Vec;
-  arc: null;
-  bend: number;
-  points: Vec[];
-  bounds: Box;
-  path: string;
-}
-
-export interface CurvedArrowInfo {
-  type: "curved";
-  start: ArrowInfoTerminal;
-  end: ArrowInfoTerminal;
-  middle: Vec;
-  arc: ArrowArcInfo;
-  bend: number;
-  points: Vec[];
-  bounds: Box;
-  path: string;
-}
-
-export type ArrowInfo = StraightArrowInfo | CurvedArrowInfo;
-
-export interface ArrowArcInfo {
-  center: Vec;
-  radius: number;
-  largeArcFlag: 0 | 1;
-  sweepFlag: 0 | 1;
-  size: number;
-  length: number;
-}
-
-export function getArrowTerminalPagePoint(
-  shape: ArrowShapeRecord,
-  terminal: ArrowTerminal,
-): Vec {
-  const point = terminal === "start" ? shape.props.start : shape.props.end;
-  return transformArrowPoint(shape, new Vec(shape.x + point.x, shape.y + point.y));
-}
-
-export function getOppositeArrowTerminal(
-  terminal: ArrowTerminal,
-): ArrowTerminal {
-  return terminal === "start" ? "end" : "start";
-}
-
-export function withArrowPagePoints(
-  shape: ArrowShapeRecord,
-  start: Vec,
-  end: Vec,
-): ArrowShapeRecord {
-  const normalized = normalizeArrowShapePoints(start, end);
-  return {
-    ...shape,
-    x: normalized.x,
-    y: normalized.y,
-    rotation: 0,
-    scaleX: 1,
-    scaleY: 1,
-    props: {
-      ...shape.props,
-      w: normalized.w,
-      h: normalized.h,
-      start: normalized.start,
-      end: normalized.end,
-      bend: shape.props.bend,
-    },
-  };
-}
-
-export function setArrowTerminalPagePoint(
-  shape: ArrowShapeRecord,
-  terminal: ArrowTerminal,
-  pagePoint: Vec,
-): ArrowShapeRecord {
-  const start =
-    terminal === "start" ? pagePoint : getArrowTerminalPagePoint(shape, "start");
-  const end =
-    terminal === "end" ? pagePoint : getArrowTerminalPagePoint(shape, "end");
-  return withArrowPagePoints(shape, start, end);
-}
-
-export function normalizeArrowShapePoints(
-  start: Vec,
-  end: Vec,
-): Pick<ArrowShapeProps, "w" | "h" | "start" | "end"> & {
-  x: number;
-  y: number;
-} {
-  const normalizedX = normalizeAxis(start.x, end.x);
-  const normalizedY = normalizeAxis(start.y, end.y);
-
-  return {
-    x: normalizedX.origin,
-    y: normalizedY.origin,
-    w: normalizedX.size,
-    h: normalizedY.size,
-    start: {
-      x: normalizedX.startOffset,
-      y: normalizedY.startOffset,
-    },
-    end: {
-      x: normalizedX.endOffset,
-      y: normalizedY.endOffset,
-    },
-  };
-}
-
-export function getArrowInfo(shape: ArrowShapeRecord): ArrowInfo {
-  return getArrowInfoFromPoints(
-    new Vec(shape.props.start.x, shape.props.start.y).add(
-      new Vec(shape.x, shape.y),
-    ),
-    new Vec(shape.props.end.x, shape.props.end.y).add(
-      new Vec(shape.x, shape.y),
-    ),
-    shape.props.bend,
-  );
-}
-
-export function getArrowLocalInfo(shape: ArrowShapeRecord): ArrowInfo {
-  return getArrowInfoFromPoints(
-    new Vec(shape.props.start.x, shape.props.start.y),
-    new Vec(shape.props.end.x, shape.props.end.y),
-    shape.props.bend,
-  );
-}
-
-export function getArrowBendFromMiddlePagePoint(
-  start: Vec,
-  end: Vec,
-  point: Vec,
-): number {
-  const middle = Vec.Med(start, end);
-  const direction = end.sub(start);
-  if (direction.len() < 1e-6) {
-    return 0;
-  }
-
-  const perpendicular = direction.per().normalize();
-  const offset = point.sub(middle);
-  return -dot(offset, perpendicular);
-}
-
-export function getArrowHitDistance(info: ArrowInfo, point: Vec): number {
-  let minDistance = Infinity;
-  for (let index = 0; index < info.points.length - 1; index++) {
-    minDistance = Math.min(
-      minDistance,
-      getDistanceToSegment(point, info.points[index]!, info.points[index + 1]!),
-    );
-  }
-
-  return Number.isFinite(minDistance)
-    ? minDistance
-    : point.dist(info.start.point);
-}
-
-function clampFinite(value: unknown, fallback: number): number {
-  return typeof value === "number" && Number.isFinite(value) ? value : fallback;
-}
-
-function normalizeAxis(
-  start: number,
-  end: number,
-): {
-  origin: number;
-  size: number;
-  startOffset: number;
-  endOffset: number;
-} {
-  const min = Math.min(start, end);
-  const max = Math.max(start, end);
-  if (Math.abs(max - min) < 1e-6) {
-    return {
-      origin: min - MIN_ARROW_AXIS / 2,
-      size: MIN_ARROW_AXIS,
-      startOffset: MIN_ARROW_AXIS / 2,
-      endOffset: MIN_ARROW_AXIS / 2,
-    };
-  }
-
-  return {
-    origin: min,
-    size: max - min,
-    startOffset: start - min,
-    endOffset: end - min,
-  };
-}
-
-function transformArrowPoint(shape: ArrowShapeRecord, point: Vec): Vec {
-  if (shape.rotation === 0 && shape.scaleX === 1 && shape.scaleY === 1) {
-    return point;
-  }
-
-  const center = new Vec(
-    shape.x + shape.props.w / 2,
-    shape.y + shape.props.h / 2,
-  );
-  const offset = point.sub(center);
-  return center.add(
-    new Vec(offset.x * shape.scaleX, offset.y * shape.scaleY).rot(
-      shape.rotation,
-    ),
-  );
-}
-
-function formatPathNumber(value: number): string {
-  if (!Number.isFinite(value)) {
-    return "0";
-  }
-  return Number(value.toFixed(3)).toString();
-}
-
-function normalizeArrowBend(value: unknown, fallback = 0): number {
-  return clampFinite(value, fallback);
-}
-
-function getArrowInfoFromPoints(
-  start: Vec,
-  end: Vec,
-  rawBend: unknown,
-): ArrowInfo {
-  const bend = normalizeArrowBend(rawBend, 0);
-  const middle = getArrowMiddlePagePoint(start, end, bend);
-  const arc = getArrowArcInfo(start, middle, end);
-  const isStraight =
-    Math.abs(bend) < ARROW_CURVE_EPSILON ||
-    arc === null ||
-    arc.length === 0 ||
-    !Number.isFinite(arc.length) ||
-    !Number.isFinite(arc.radius);
-  const points = isStraight
-    ? [start, end]
-    : sampleArcCurve(start, end, arc, ARROW_CURVE_SAMPLE_COUNT);
-  const path =
-    isStraight || arc === null
-      ? `M ${formatPathNumber(start.x)} ${formatPathNumber(
-          start.y,
-        )} L ${formatPathNumber(end.x)} ${formatPathNumber(end.y)}`
-      : `M ${formatPathNumber(start.x)} ${formatPathNumber(
-          start.y,
-        )} A ${formatPathNumber(arc.radius)} ${formatPathNumber(
-          arc.radius,
-        )} 0 ${arc.largeArcFlag} ${arc.sweepFlag} ${formatPathNumber(
-          end.x,
-        )} ${formatPathNumber(end.y)}`;
-
-  const sharedBase = {
-    start: {
-      terminal: "start" as const,
-      point: start,
-      handle: start,
-    },
-    end: {
-      terminal: "end" as const,
-      point: end,
-      handle: end,
-    },
-    middle,
-    bend,
-    points,
-    bounds: Box.FromPoints(points),
-    path,
-  };
-
-  return isStraight
-    ? {
-        type: "straight",
-        ...sharedBase,
-        arc: null,
-      }
-    : {
-        type: "curved",
-        ...sharedBase,
-        arc: arc!,
-      };
-}
-
-function getArrowMiddlePagePoint(
-  start: Vec,
-  end: Vec,
-  bend: number,
-): Vec {
-  const middle = Vec.Med(start, end);
-  const direction = end.sub(start);
-  const perpendicular = direction.len()
-    ? direction.per().normalize()
-    : new Vec(0, -1);
-
-  return middle.add(perpendicular.mul(-bend));
-}
-
-function sampleArcCurve(
-  start: Vec,
-  end: Vec,
-  arc: ArrowArcInfo,
-  sampleCount: number,
-): Vec[] {
-  const points: Vec[] = [];
-  const startAngle = Vec.Angle(arc.center, start);
-  const measure = getArcMeasure(
-    startAngle,
-    Vec.Angle(arc.center, end),
-    arc.sweepFlag,
-    arc.largeArcFlag,
-  );
-  for (let index = 0; index <= sampleCount; index++) {
-    const t = index / sampleCount;
-    points.push(getPointOnCircle(arc.center, arc.radius, startAngle + measure * t));
-  }
-
-  return points;
-}
-
-function getArrowArcInfo(start: Vec, middle: Vec, end: Vec): ArrowArcInfo | null {
-  const center = getCircleCenterFromThreePoints(start, middle, end);
-  if (!center) {
-    return null;
-  }
-
-  const radius = center.dist(start);
-  if (radius < ARROW_CURVE_EPSILON) {
-    return null;
-  }
-
-  const sweepFlag = isClockwise(start, middle, end) ? 1 : 0;
-  const theta = getInscribedArcMeasure(start, middle, end);
-  if (!Number.isFinite(theta)) {
-    return null;
-  }
-  const largeArcFlag = Math.PI > theta ? 1 : 0;
-  const size = (PI2 - theta) * (sweepFlag ? 1 : -1);
-
-  return {
-    center,
-    radius,
-    largeArcFlag,
-    sweepFlag,
-    size,
-    length: Math.abs(size * radius),
-  };
-}
-
-function getInscribedArcMeasure(start: Vec, middle: Vec, end: Vec): number {
-  const ab = start.dist(end);
-  const bc = end.dist(middle);
-  const ca = middle.dist(start);
-  if (bc < ARROW_CURVE_EPSILON || ca < ARROW_CURVE_EPSILON) {
-    return 0;
-  }
-
-  const ratio = (bc * bc + ca * ca - ab * ab) / (2 * bc * ca);
-  return Math.acos(Math.max(-1, Math.min(1, ratio))) * 2;
-}
-
-function getCircleCenterFromThreePoints(
-  a: Vec,
-  b: Vec,
-  c: Vec,
-): Vec | null {
-  const denominator =
-    -2 *
-    (a.x * (b.y - c.y) -
-      a.y * (b.x - c.x) +
-      b.x * c.y -
-      c.x * b.y);
-  if (Math.abs(denominator) < ARROW_CURVE_EPSILON) {
-    return null;
-  }
-
-  const x =
-    ((a.x * a.x + a.y * a.y) * (c.y - b.y) +
-      (b.x * b.x + b.y * b.y) * (a.y - c.y) +
-      (c.x * c.x + c.y * c.y) * (b.y - a.y)) /
-    denominator;
-  const y =
-    ((a.x * a.x + a.y * a.y) * (b.x - c.x) +
-      (b.x * b.x + b.y * b.y) * (c.x - a.x) +
-      (c.x * c.x + c.y * c.y) * (a.x - b.x)) /
-    denominator;
-
-  return Number.isFinite(x) && Number.isFinite(y) ? new Vec(x, y) : null;
-}
-
-function getPointOnCircle(center: Vec, radius: number, angle: number): Vec {
-  return center.add(new Vec(Math.cos(angle) * radius, Math.sin(angle) * radius));
-}
-
-function getArcMeasure(
-  startAngle: number,
-  endAngle: number,
-  sweepFlag: 0 | 1,
-  largeArcFlag: 0 | 1,
-): number {
-  const delta = (endAngle - startAngle) % PI2;
-  const shortMeasure = ((2 * delta) % PI2) - delta;
-  if (!largeArcFlag) {
-    return shortMeasure;
-  }
-
-  return (PI2 - Math.abs(shortMeasure)) * (sweepFlag ? 1 : -1);
-}
-
-function isClockwise(a: Vec, b: Vec, c: Vec): boolean {
-  return (c.x - a.x) * (b.y - a.y) - (b.x - a.x) * (c.y - a.y) < 0;
-}
-
-function getDistanceToSegment(point: Vec, start: Vec, end: Vec): number {
-  const segment = end.sub(start);
-  const lengthSquared = segment.x * segment.x + segment.y * segment.y;
-  if (lengthSquared === 0) {
-    return point.dist(start);
-  }
-
-  const offset = point.sub(start);
-  const t = Math.max(0, Math.min(1, dot(offset, segment) / lengthSquared));
-  const projection = start.add(segment.mul(t));
-  return point.dist(projection);
-}
-
-function dot(a: Vec, b: Vec): number {
-  return a.x * b.x + a.y * b.y;
-}