@yuzhouu/canvas-kit 0.1.2 → 0.1.4

package/_vendor/plugin-eraser/canvas.tsx

@@ -1,616 +0,0 @@
-import { memo, useEffect, useRef, useState } from "react";
-import { type LandCanvasPlugin } from "@land/canvas-plugin-api";
-import { type Vec } from "@land/canvas-core";
-import { PageSpace, useEditor, useValue } from "@land/canvas-react";
-
-export function createEraserCanvasPlugin(): LandCanvasPlugin {
-  return {
-    id: "land.eraser.react",
-    canvasComponents: [
-      {
-        id: "land.eraser.trail-overlay",
-        component: EraserTrailOverlay,
-      },
-    ],
-    setup() {
-      // Eraser does not render shape records.
-    },
-  };
-}
-
-const EraserTrailOverlay = memo(function EraserTrailOverlay() {
-  const editor = useEditor();
-  const isTrailActive = useValue(editor.eraserTrailActiveSignal);
-
-  if (!isTrailActive) {
-    return null;
-  }
-
-  return (
-    <PageSpace
-      dataUi="eraser-trail-page-space"
-      className="pointer-events-none absolute inset-0"
-    >
-      <svg
-        width="100%"
-        height="100%"
-        style={{
-          display: "block",
-          width: "100%",
-          height: "100%",
-          overflow: "visible",
-        }}
-      >
-        <EraserTrailContent />
-      </svg>
-    </PageSpace>
-  );
-});
-
-const EraserTrailContent = memo(function EraserTrailContent() {
-  const editor = useEditor();
-  const trail = useValue(editor.eraserTrailSignal);
-  const zoom = useValue(editor.cameraZoomSignal);
-  const safeZoom = Math.max(zoom, 0.0001);
-  const clockTime = useAnimationClock();
-  const sampleState = useRef<EraserTrailSampleState>({
-    samples: [],
-    sourceLength: 0,
-  });
-  const renderTime = Math.max(clockTime, getNowMs());
-  syncEraserTrailSampleState(
-    sampleState.current,
-    trail,
-    safeZoom,
-    renderTime,
-  );
-  const trailPoints = getRenderableEraserTrailPoints(
-    sampleState.current.samples,
-    renderTime,
-  );
-
-  if (trailPoints.length === 0) {
-    return null;
-  }
-
-  const path = getEraserScribblePath(
-    trailPoints,
-    ERASER_SCRIBBLE_SIZE / safeZoom,
-  );
-
-  if (!path) {
-    return null;
-  }
-
-  return (
-    <g data-ui="eraser-trail-overlay">
-      <path
-        data-ui="eraser-trail-scribble"
-        d={path}
-        fill={ERASER_SCRIBBLE_FILL}
-      />
-    </g>
-  );
-});
-
-interface TrailRenderPoint {
-  x: number;
-  y: number;
-}
-
-interface EraserTrailTimedPoint extends TrailRenderPoint {
-  time: number;
-  velocity: number;
-}
-
-interface EraserTrailSampleState {
-  samples: EraserTrailTimedPoint[];
-  sourceLength: number;
-}
-
-interface EraserScribbleSample {
-  point: TrailRenderPoint;
-  direction: TrailRenderPoint;
-  radius: number;
-  runningLength: number;
-}
-
-const ERASER_SCRIBBLE_FILL = "rgba(142, 142, 142, 0.16)";
-const ERASER_SCRIBBLE_MAX_POINTS = 48;
-const ERASER_SCRIBBLE_MIN_POINT_DISTANCE = 1;
-const ERASER_SCRIBBLE_SIZE = 12;
-const ERASER_SCRIBBLE_STREAMLINE = 0.32;
-const ERASER_SCRIBBLE_CAP_STEPS = 8;
-const ERASER_SCRIBBLE_DOT_STEPS = 13;
-const ERASER_SCRIBBLE_INITIAL_SAMPLE_INTERVAL = 16;
-const ERASER_SCRIBBLE_MIN_SAMPLE_INTERVAL = 8;
-const ERASER_SCRIBBLE_BASE_LIFETIME = 180;
-const ERASER_SCRIBBLE_SPEED_LIFETIME = 180;
-const ERASER_SCRIBBLE_MAX_LIFETIME = 680;
-
-function useAnimationClock(): number {
-  const [time, setTime] = useState(() => getNowMs());
-
-  useEffect(() => {
-    if (typeof window === "undefined") {
-      return;
-    }
-
-    let frame = 0;
-    const tick = (nextTime: number) => {
-      setTime(nextTime);
-      frame = window.requestAnimationFrame(tick);
-    };
-
-    frame = window.requestAnimationFrame(tick);
-    return () => {
-      window.cancelAnimationFrame(frame);
-    };
-  }, []);
-
-  return time;
-}
-
-function getNowMs(): number {
-  return typeof performance === "undefined" ? Date.now() : performance.now();
-}
-
-function syncEraserTrailSampleState(
-  state: EraserTrailSampleState,
-  points: readonly Vec[],
-  zoom: number,
-  now: number,
-): void {
-  pruneEraserTrailSamples(state, now);
-  if (points.length < state.sourceLength) {
-    state.samples = [];
-    state.sourceLength = 0;
-  }
-
-  if (points.length === state.sourceLength) {
-    return;
-  }
-
-  const firstNewIndex = state.sourceLength;
-  const newPointCount = points.length - firstNewIndex;
-  const previousTime =
-    state.samples[state.samples.length - 1]?.time ??
-    now - ERASER_SCRIBBLE_INITIAL_SAMPLE_INTERVAL * newPointCount;
-  for (let i = firstNewIndex; i < points.length; i++) {
-    const point = points[i];
-    const progress = (i - firstNewIndex + 1) / newPointCount;
-    appendEraserTrailSample(
-      state,
-      { x: point.x, y: point.y },
-      zoom,
-      lerpNumber(previousTime, now, progress),
-    );
-  }
-
-  state.sourceLength = points.length;
-  pruneEraserTrailSamples(state, now);
-}
-
-function appendEraserTrailSample(
-  state: EraserTrailSampleState,
-  point: TrailRenderPoint,
-  zoom: number,
-  time: number,
-): void {
-  const previous = state.samples[state.samples.length - 1];
-  if (!previous) {
-    state.samples.push({ ...point, time, velocity: 0 });
-    return;
-  }
-
-  const minDistance = ERASER_SCRIBBLE_MIN_POINT_DISTANCE / zoom;
-  const distance = getTrailPointDistance(previous, point);
-  if (distance < minDistance) {
-    state.samples[state.samples.length - 1] = {
-      ...previous,
-      ...point,
-      time,
-    };
-    return;
-  }
-
-  const elapsed = Math.max(
-    ERASER_SCRIBBLE_MIN_SAMPLE_INTERVAL,
-    time - previous.time,
-  );
-  const screenVelocity = (distance * zoom) / elapsed;
-  state.samples.push({
-    ...point,
-    time,
-    velocity: lerpNumber(previous.velocity, screenVelocity, 0.68),
-  });
-}
-
-function pruneEraserTrailSamples(
-  state: EraserTrailSampleState,
-  now: number,
-): void {
-  state.samples = getActiveEraserTrailSamples(state.samples, now);
-}
-
-function getRenderableEraserTrailPoints(
-  samples: readonly EraserTrailTimedPoint[],
-  now: number,
-): TrailRenderPoint[] {
-  const activeSamples = getActiveEraserTrailSamples(samples, now);
-  const activePoints =
-    activeSamples.length > ERASER_SCRIBBLE_MAX_POINTS
-      ? activeSamples.slice(-ERASER_SCRIBBLE_MAX_POINTS)
-      : activeSamples;
-  return getStreamlinedTrailPoints(activePoints, ERASER_SCRIBBLE_STREAMLINE);
-}
-
-function getActiveEraserTrailSamples(
-  samples: readonly EraserTrailTimedPoint[],
-  now: number,
-): EraserTrailTimedPoint[] {
-  const head = samples[samples.length - 1];
-  if (!head) {
-    return [];
-  }
-
-  const cutoffTime = now - getEraserTrailSampleLifetime(head);
-  if (head.time < cutoffTime) {
-    return [];
-  }
-
-  const firstActiveIndex = samples.findIndex(
-    (sample) => sample.time >= cutoffTime,
-  );
-  if (firstActiveIndex === -1) {
-    return [];
-  }
-
-  const activeSamples = samples.slice(firstActiveIndex);
-  const previous = samples[firstActiveIndex - 1];
-  const first = activeSamples[0];
-  if (previous && first.time > cutoffTime) {
-    const t = clamp(
-      (cutoffTime - previous.time) / (first.time - previous.time),
-      0,
-      1,
-    );
-    return [lerpEraserTrailSample(previous, first, t), ...activeSamples];
-  }
-
-  return activeSamples;
-}
-
-function lerpEraserTrailSample(
-  a: EraserTrailTimedPoint,
-  b: EraserTrailTimedPoint,
-  t: number,
-): EraserTrailTimedPoint {
-  return {
-    ...lerpTrailPoint(a, b, t),
-    time: lerpNumber(a.time, b.time, t),
-    velocity: lerpNumber(a.velocity, b.velocity, t),
-  };
-}
-
-function getEraserTrailSampleLifetime(sample: EraserTrailTimedPoint): number {
-  return clamp(
-    ERASER_SCRIBBLE_BASE_LIFETIME +
-      sample.velocity * ERASER_SCRIBBLE_SPEED_LIFETIME,
-    ERASER_SCRIBBLE_BASE_LIFETIME,
-    ERASER_SCRIBBLE_MAX_LIFETIME,
-  );
-}
-
-function getStreamlinedTrailPoints(
-  points: readonly TrailRenderPoint[],
-  streamline: number,
-): TrailRenderPoint[] {
-  if (points.length <= 1) {
-    return [...points];
-  }
-
-  const t = 0.15 + (1 - streamline) * 0.85;
-  const result: TrailRenderPoint[] = [points[0]];
-  for (let i = 1; i < points.length; i++) {
-    result.push(lerpTrailPoint(result[result.length - 1], points[i], t));
-  }
-  return result;
-}
-
-function getEraserScribblePath(
-  points: readonly TrailRenderPoint[],
-  size: number,
-): string | null {
-  if (points.length === 0 || size <= 0) {
-    return null;
-  }
-
-  if (points.length === 1) {
-    return getCircleTrailPath(points[0], size / 2);
-  }
-
-  const samples = getEraserScribbleSamples(points, size);
-  const outline = getEraserScribbleOutline(samples);
-  return getSmoothClosedTrailPathFromPoints(outline);
-}
-
-function getEraserScribbleSamples(
-  points: readonly TrailRenderPoint[],
-  size: number,
-): EraserScribbleSample[] {
-  const runningLengths = getTrailRunningLengths(points);
-  const totalLength = runningLengths[runningLengths.length - 1] ?? 0;
-  const taperLength = Math.max(size, totalLength);
-
-  return points.map((point, index) => {
-    const runningLength = runningLengths[index] ?? 0;
-    const taper = clamp(runningLength / taperLength, 0, 1);
-    return {
-      point,
-      direction: getTrailPointDirection(points, index),
-      radius: (size / 2) * taper,
-      runningLength,
-    };
-  });
-}
-
-function getEraserScribbleOutline(
-  samples: readonly EraserScribbleSample[],
-): TrailRenderPoint[] {
-  if (samples.length === 0) {
-    return [];
-  }
-
-  if (samples.length === 1) {
-    return getCircleTrailPoints(
-      samples[0].point,
-      Math.max(samples[0].radius, 0.01),
-      ERASER_SCRIBBLE_DOT_STEPS,
-    );
-  }
-
-  const leftPoints: TrailRenderPoint[] = [];
-  const rightPoints: TrailRenderPoint[] = [];
-
-  for (const sample of samples) {
-    const normal = getTrailPointPerpendicular(sample.direction);
-    appendDistinctTrailPoint(
-      leftPoints,
-      subtractTrailPoints(sample.point, multiplyTrailPoint(normal, sample.radius)),
-    );
-    appendDistinctTrailPoint(
-      rightPoints,
-      addTrailPoints(sample.point, multiplyTrailPoint(normal, sample.radius)),
-    );
-  }
-
-  const outline: TrailRenderPoint[] = [];
-  for (const point of leftPoints) {
-    appendDistinctTrailPoint(outline, point);
-  }
-
-  const lastSample = samples[samples.length - 1];
-  const lastNormal = getTrailPointPerpendicular(lastSample.direction);
-  const endCap = getRoundEndCapTrailPoints({
-    center: lastSample.point,
-    direction: lastSample.direction,
-    normal: lastNormal,
-    radius: lastSample.radius,
-  });
-  for (const point of endCap) {
-    appendDistinctTrailPoint(outline, point);
-  }
-
-  for (let i = rightPoints.length - 1; i >= 0; i--) {
-    appendDistinctTrailPoint(outline, rightPoints[i]);
-  }
-
-  return outline;
-}
-
-function getTrailRunningLengths(
-  points: readonly TrailRenderPoint[],
-): number[] {
-  const runningLengths = [0];
-  for (let i = 1; i < points.length; i++) {
-    runningLengths.push(
-      runningLengths[i - 1] + getTrailPointDistance(points[i - 1], points[i]),
-    );
-  }
-  return runningLengths;
-}
-
-function getTrailPointDirection(
-  points: readonly TrailRenderPoint[],
-  index: number,
-): TrailRenderPoint {
-  if (points.length <= 1) {
-    return { x: 1, y: 0 };
-  }
-
-  const previous = points[index - 1] ?? points[index];
-  const next = points[index + 1] ?? points[index];
-  const direction =
-    index === 0
-      ? subtractTrailPoints(next, points[index])
-      : index === points.length - 1
-        ? subtractTrailPoints(points[index], previous)
-        : subtractTrailPoints(next, previous);
-
-  return normalizeTrailPoint(direction);
-}
-
-function getRoundEndCapTrailPoints({
-  center,
-  direction,
-  normal,
-  radius,
-}: {
-  center: TrailRenderPoint;
-  direction: TrailRenderPoint;
-  normal: TrailRenderPoint;
-  radius: number;
-}): TrailRenderPoint[] {
-  if (radius <= 0) {
-    return [];
-  }
-
-  const points: TrailRenderPoint[] = [];
-  for (let step = 1; step < ERASER_SCRIBBLE_CAP_STEPS; step++) {
-    const t = step / ERASER_SCRIBBLE_CAP_STEPS;
-    points.push(
-      addTrailPoints(
-        center,
-        addTrailPoints(
-          multiplyTrailPoint(direction, Math.sin(Math.PI * t) * radius),
-          multiplyTrailPoint(normal, -Math.cos(Math.PI * t) * radius),
-        ),
-      ),
-    );
-  }
-  return points;
-}
-
-function getCircleTrailPath(center: TrailRenderPoint, radius: number): string {
-  const points = getCircleTrailPoints(
-    center,
-    radius,
-    ERASER_SCRIBBLE_DOT_STEPS,
-  );
-  return getSmoothClosedTrailPathFromPoints(points) ?? "";
-}
-
-function getCircleTrailPoints(
-  center: TrailRenderPoint,
-  radius: number,
-  steps: number,
-): TrailRenderPoint[] {
-  const points: TrailRenderPoint[] = [];
-  for (let step = 0; step < steps; step++) {
-    const angle = (Math.PI * 2 * step) / steps;
-    points.push({
-      x: center.x + Math.cos(angle) * radius,
-      y: center.y + Math.sin(angle) * radius,
-    });
-  }
-  return points;
-}
-
-function getTrailPointDistance(a: TrailRenderPoint, b: TrailRenderPoint): number {
-  return Math.sqrt(getTrailPointDistanceSquared(a, b));
-}
-
-function getTrailPointDistanceSquared(
-  a: TrailRenderPoint,
-  b: TrailRenderPoint,
-): number {
-  const dx = a.x - b.x;
-  const dy = a.y - b.y;
-  return dx * dx + dy * dy;
-}
-
-function getTrailPointPerpendicular(point: TrailRenderPoint): TrailRenderPoint {
-  return { x: -point.y, y: point.x };
-}
-
-function normalizeTrailPoint(point: TrailRenderPoint): TrailRenderPoint {
-  const length = Math.sqrt(point.x * point.x + point.y * point.y);
-  if (length <= 0) {
-    return { x: 1, y: 0 };
-  }
-  return { x: point.x / length, y: point.y / length };
-}
-
-function addTrailPoints(
-  a: TrailRenderPoint,
-  b: TrailRenderPoint,
-): TrailRenderPoint {
-  return { x: a.x + b.x, y: a.y + b.y };
-}
-
-function subtractTrailPoints(
-  a: TrailRenderPoint,
-  b: TrailRenderPoint,
-): TrailRenderPoint {
-  return { x: a.x - b.x, y: a.y - b.y };
-}
-
-function multiplyTrailPoint(
-  point: TrailRenderPoint,
-  scale: number,
-): TrailRenderPoint {
-  return { x: point.x * scale, y: point.y * scale };
-}
-
-function lerpTrailPoint(
-  a: TrailRenderPoint,
-  b: TrailRenderPoint,
-  t: number,
-): TrailRenderPoint {
-  return {
-    x: lerpNumber(a.x, b.x, t),
-    y: lerpNumber(a.y, b.y, t),
-  };
-}
-
-function lerpNumber(a: number, b: number, t: number): number {
-  return a + (b - a) * t;
-}
-
-function clamp(value: number, min: number, max: number): number {
-  return Math.max(min, Math.min(max, value));
-}
-
-function appendDistinctTrailPoint(
-  points: TrailRenderPoint[],
-  point: TrailRenderPoint,
-): void {
-  const previous = points[points.length - 1];
-  if (!previous || getTrailPointDistanceSquared(previous, point) > 0.04) {
-    points.push(point);
-  } else {
-    points[points.length - 1] = point;
-  }
-}
-
-function getSmoothClosedTrailPathFromPoints(
-  points: readonly TrailRenderPoint[],
-): string | null {
-  if (points.length < 2) {
-    return null;
-  }
-
-  if (points.length === 2) {
-    return `M ${formatTrailSvgPoint(points[0])} L ${formatTrailSvgPoint(points[1])} Z`;
-  }
-
-  const commands = [
-    `M ${formatTrailSvgPoint(getTrailMidpoint(points[0], points[1]))}`,
-  ];
-  for (let i = 1; i < points.length; i++) {
-    const current = points[i];
-    const next = points[(i + 1) % points.length];
-    commands.push(
-      `Q ${formatTrailSvgPoint(current)} ${formatTrailSvgPoint(getTrailMidpoint(current, next))}`,
-    );
-  }
-  commands.push("Z");
-
-  return commands.join(" ");
-}
-
-function getTrailMidpoint(
-  a: TrailRenderPoint,
-  b: TrailRenderPoint,
-): TrailRenderPoint {
-  return { x: (a.x + b.x) / 2, y: (a.y + b.y) / 2 };
-}
-
-function formatTrailSvgPoint(point: TrailRenderPoint): string {
-  return `${formatTrailSvgNumber(point.x)},${formatTrailSvgNumber(point.y)}`;
-}
-
-function formatTrailSvgNumber(value: number): string {
-  return Number.isInteger(value) ? `${value}` : value.toFixed(3);
-}

package/_vendor/plugin-eraser/core.ts

@@ -1,49 +0,0 @@
-import {
-  SET_ACTIVE_TOOL_TOOLBAR_ACTION_ID,
-  type LandCorePlugin,
-  type ToolbarContribution,
-} from "@land/canvas-core";
-import { EraserTool } from "./EraserTool";
-
-export function createEraserCorePlugin(): LandCorePlugin {
-  return {
-    id: "land.eraser",
-    toolbarContributions: [createEraserToolToolbarContribution()],
-    setup(editor) {
-      editor.tools.register(
-        "eraser",
-        (currentEditor) => new EraserTool(currentEditor),
-        { shortcut: "e" },
-      );
-    },
-  };
-}
-
-function createEraserToolToolbarContribution(): ToolbarContribution {
-  return {
-    id: "eraser.tool-toolbar",
-    surface: "tool",
-    placement: "chrome",
-    order: 50,
-    actionIds: [SET_ACTIVE_TOOL_TOOLBAR_ACTION_ID],
-    getGroups() {
-      return [
-        {
-          id: "eraser.tools",
-          items: [
-            {
-              kind: "button",
-              id: "eraser.tool.eraser",
-              actionId: SET_ACTIVE_TOOL_TOOLBAR_ACTION_ID,
-              value: "eraser",
-              label: "Eraser",
-              shortcut: "E",
-              icon: "eraser",
-              dataUi: "eraser-tool-button",
-            },
-          ],
-        },
-      ];
-    },
-  };
-}

package/_vendor/plugin-eraser/feature.ts

@@ -1,20 +0,0 @@
-import {
-  defineLandExtension,
-  type LandFeatureBundle,
-} from "@land/canvas-plugin-api";
-import { createEraserCanvasPlugin } from "./canvas";
-import { createEraserCorePlugin } from "./core";
-
-export function createEraserFeatureBundle(): LandFeatureBundle {
-  return {
-    id: "land.eraser.bundle",
-    corePlugins: [createEraserCorePlugin()],
-    canvasPlugins: [createEraserCanvasPlugin()],
-    shapeTypes: [],
-  };
-}
-
-export const Eraser = defineLandExtension({
-  name: "eraser",
-  createFeature: createEraserFeatureBundle,
-});