@yuzhouu/canvas-kit 0.1.2

package/_vendor/plugin-draw/drawStrokeGeometry.ts

@@ -0,0 +1,454 @@
+import { Vec } from "@land/canvas-core";
+import { drawPointToVec } from "./drawPath";
+import type { DrawShapePoint } from "./types";
+
+const HALF_CAP_SEGMENTS = 8;
+const DOT_SEGMENTS = 16;
+const MIN_RADIUS = 0.6;
+const SIMULATED_PRESSURE_CHANGE_RATE = 0.275;
+const SIMULATED_PRESSURE_INITIAL = 0.5;
+const SIMULATED_PRESSURE_MIN = 0.08;
+const SIMULATED_PRESSURE_DISTANCE_SCALE = 1.5;
+const VISUAL_RADIUS_OFFSET = 1;
+const OUTLINE_VERTEX_MIN_DISTANCE_FACTOR = 0.38;
+
+export interface DrawStrokeDerivedPoint {
+  point: Vec;
+  direction: Vec;
+  pressure: number;
+  radius: number;
+  runningLength: number;
+}
+
+interface DrawStrokeStyleOptions {
+  baseRadius: number;
+  minRadius: number;
+  minRadiusScale: number;
+  maxRadiusScale: number;
+  startTaper: number;
+  endTaper: number;
+  simulatePressure: boolean;
+}
+
+function clamp(value: number, min: number, max: number): number {
+  return Math.max(min, Math.min(max, value));
+}
+
+function lerp(start: number, end: number, t: number): number {
+  return start + (end - start) * t;
+}
+
+function getDrawStrokeStyleOptions(
+  strokeWidth: number,
+  isPen: boolean,
+): DrawStrokeStyleOptions {
+  const baseRadius = Math.max(strokeWidth + VISUAL_RADIUS_OFFSET, 1.6);
+
+  return {
+    baseRadius,
+    minRadius: Math.max(MIN_RADIUS, baseRadius * 0.32),
+    minRadiusScale: isPen ? 0.5 : 0.48,
+    maxRadiusScale: isPen ? 1.22 : 1.24,
+    startTaper: Math.max(strokeWidth * 1.8, 2.5),
+    endTaper: Math.max(strokeWidth * 2.3, 3.5),
+    simulatePressure: !isPen,
+  };
+}
+
+function getPointDirection(
+  points: readonly Vec[],
+  index: number,
+  isClosed: boolean,
+): Vec {
+  if (points.length <= 1) {
+    return new Vec(1, 0);
+  }
+
+  if (isClosed && points.length >= 3) {
+    const current = points[index]!;
+    const previous = points[(index - 1 + points.length) % points.length]!;
+    const next = points[(index + 1) % points.length]!;
+    const incoming = current.sub(previous).uni();
+    const outgoing = next.sub(current).uni();
+    const combined = incoming.add(outgoing);
+
+    if (combined.len2() > 1e-6) {
+      return combined.uni();
+    }
+    if (outgoing.len2() > 0) {
+      return outgoing;
+    }
+    if (incoming.len2() > 0) {
+      return incoming;
+    }
+    return new Vec(1, 0);
+  }
+
+  const current = points[index]!;
+  const previous = points[index - 1] ?? current;
+  const next = points[index + 1] ?? current;
+  const incoming = current.sub(previous).uni();
+  const outgoing = next.sub(current).uni();
+
+  if (index === 0) {
+    return outgoing.len2() > 0 ? outgoing : new Vec(1, 0);
+  }
+
+  if (index === points.length - 1) {
+    return incoming.len2() > 0 ? incoming : new Vec(1, 0);
+  }
+
+  const combined = incoming.add(outgoing);
+  if (combined.len2() > 1e-6) {
+    return combined.uni();
+  }
+
+  if (outgoing.len2() > 0) {
+    return outgoing;
+  }
+
+  if (incoming.len2() > 0) {
+    return incoming;
+  }
+
+  return new Vec(1, 0);
+}
+
+function dot(a: Vec, b: Vec): number {
+  return a.x * b.x + a.y * b.y;
+}
+
+function getSimulatedPressure({
+  distanceFromPrevious,
+  previousPressure,
+  runningLength,
+  totalLength,
+  strokeWidth,
+  isClosed,
+}: {
+  distanceFromPrevious: number;
+  previousPressure: number | null;
+  runningLength: number;
+  totalLength: number;
+  strokeWidth: number;
+  isClosed: boolean;
+}): number {
+  const distanceRatio = clamp(
+    distanceFromPrevious /
+      Math.max(strokeWidth * SIMULATED_PRESSURE_DISTANCE_SCALE, 1),
+    0,
+    1,
+  );
+  const targetPressure = clamp(
+    1 - distanceRatio,
+    SIMULATED_PRESSURE_MIN,
+    1,
+  );
+  const basePressure =
+    previousPressure === null
+      ? lerp(
+          SIMULATED_PRESSURE_INITIAL,
+          targetPressure,
+          SIMULATED_PRESSURE_CHANGE_RATE,
+        )
+      : lerp(
+          previousPressure,
+          targetPressure,
+          Math.max(distanceRatio, 0.36) * SIMULATED_PRESSURE_CHANGE_RATE,
+        );
+
+  if (isClosed) {
+    return clamp(basePressure, SIMULATED_PRESSURE_MIN, 1);
+  }
+
+  const taperIn = clamp(runningLength / Math.max(strokeWidth * 1.8, 1), 0, 1);
+  const taperOut = clamp(
+    (totalLength - runningLength) / Math.max(strokeWidth * 2.6, 1),
+    0,
+    1,
+  );
+  const taper = Math.min(taperIn, taperOut);
+
+  return clamp(
+    basePressure * lerp(0.72, 1, taper),
+    SIMULATED_PRESSURE_MIN,
+    1,
+  );
+}
+
+function getStrokeSamplePressure(
+  point: DrawShapePoint,
+  previousPressure: number | null,
+  style: DrawStrokeStyleOptions,
+  strokeWidth: number,
+  distanceFromPrevious: number,
+  runningLength: number,
+  totalLength: number,
+  isClosed: boolean,
+): number {
+  if (style.simulatePressure) {
+    return getSimulatedPressure({
+      distanceFromPrevious,
+      previousPressure,
+      runningLength,
+      totalLength,
+      strokeWidth,
+      isClosed,
+    });
+  }
+
+  const inputPressure =
+    typeof point.pressure === "number" && Number.isFinite(point.pressure)
+      ? clamp(point.pressure, 0.05, 1)
+      : previousPressure ?? 0.55;
+
+  return previousPressure === null
+    ? inputPressure
+    : lerp(previousPressure, inputPressure, 0.68);
+}
+
+export function createStrokeDerivedPoints(
+  points: readonly DrawShapePoint[],
+  strokeWidth: number,
+  isPen: boolean,
+  isClosed: boolean,
+  options: { taperStart?: boolean; taperEnd?: boolean } = {},
+): DrawStrokeDerivedPoint[] {
+  if (points.length === 0) {
+    return [];
+  }
+
+  const style = getDrawStrokeStyleOptions(strokeWidth, isPen);
+  const pointVecs = points.map(drawPointToVec);
+  const runningLengths: number[] = [0];
+  let totalLength = 0;
+
+  for (let index = 1; index < pointVecs.length; index += 1) {
+    totalLength += pointVecs[index]!.dist(pointVecs[index - 1]!);
+    runningLengths.push(totalLength);
+  }
+
+  let previousPressure: number | null = null;
+  const derived = points.map((point, index) => {
+    const runningLength = runningLengths[index] ?? 0;
+    const distanceFromPrevious =
+      index === 0 ? 0 : pointVecs[index]!.dist(pointVecs[index - 1]!);
+    const pressure = getStrokeSamplePressure(
+      point,
+      previousPressure,
+      style,
+      strokeWidth,
+      distanceFromPrevious,
+      runningLength,
+      totalLength,
+      isClosed,
+    );
+    previousPressure = pressure;
+
+    const taperStart = options.taperStart ?? true;
+    const taperEnd = options.taperEnd ?? true;
+    const taper =
+      isClosed || pointVecs.length <= 1
+        ? 1
+        : Math.min(
+            taperStart ? clamp(runningLength / style.startTaper, 0, 1) : 1,
+            taperEnd
+              ? clamp((totalLength - runningLength) / style.endTaper, 0, 1)
+              : 1,
+          );
+    const radiusScale = lerp(
+      style.minRadiusScale,
+      style.maxRadiusScale,
+      pressure,
+    );
+    const radius = Math.max(
+      style.minRadius,
+      style.baseRadius * radiusScale * lerp(0.7, 1, taper),
+    );
+
+    return {
+      point: pointVecs[index]!,
+      direction: getPointDirection(pointVecs, index, isClosed),
+      pressure,
+      radius,
+      runningLength,
+    };
+  });
+
+  if (totalLength < style.baseRadius * 0.5) {
+    return derived.map((sample) => ({
+      ...sample,
+      radius: Math.max(sample.radius, style.baseRadius * 0.92),
+    }));
+  }
+
+  return derived;
+}
+
+function createCircleOutline(center: Vec, radius: number, segments: number): Vec[] {
+  const outline: Vec[] = [];
+  for (let index = 0; index < segments; index += 1) {
+    const angle = (Math.PI * 2 * index) / segments;
+    outline.push(
+      new Vec(
+        center.x + Math.cos(angle) * radius,
+        center.y + Math.sin(angle) * radius,
+      ),
+    );
+  }
+  return outline;
+}
+
+function appendDistinctPoint(points: Vec[], point: Vec): void {
+  const previous = points[points.length - 1];
+  if (!previous) {
+    points.push(point);
+    return;
+  }
+
+  if (previous.dist2(point) < 0.04) {
+    points[points.length - 1] = point;
+    return;
+  }
+
+  points.push(point);
+}
+
+function createClockwiseHalfArc(
+  center: Vec,
+  fromPoint: Vec,
+  steps: number,
+): Vec[] {
+  const radius = center.dist(fromPoint);
+  if (radius === 0) {
+    return [];
+  }
+
+  const startAngle = Vec.Angle(center, fromPoint);
+  const points: Vec[] = [];
+
+  for (let index = 1; index < steps; index += 1) {
+    const angle = startAngle - Math.PI * (index / steps);
+    points.push(
+      new Vec(
+        center.x + Math.cos(angle) * radius,
+        center.y + Math.sin(angle) * radius,
+      ),
+    );
+  }
+
+  return points;
+}
+
+export function getStrokeOutlineVertices(
+  points: readonly DrawStrokeDerivedPoint[],
+  isClosed: boolean,
+  options: { capStart?: boolean; capEnd?: boolean } = {},
+): Vec[] {
+  if (points.length === 0) {
+    return [];
+  }
+
+  if (points.length === 1) {
+    return createCircleOutline(points[0]!.point, points[0]!.radius, DOT_SEGMENTS);
+  }
+
+  const leftPoints: Vec[] = [];
+  const rightPoints: Vec[] = [];
+  let minOutlineVertexDistance = 0.12;
+  for (const sample of points) {
+    minOutlineVertexDistance = Math.max(
+      minOutlineVertexDistance,
+      sample.radius * OUTLINE_VERTEX_MIN_DISTANCE_FACTOR,
+    );
+  }
+  const minDistanceSquared = minOutlineVertexDistance ** 2;
+  let previousNormal: Vec | null = null;
+
+  for (let index = 0; index < points.length; index += 1) {
+    const sample = points[index]!;
+    const nextSample = points[index + 1] ?? sample;
+    const direction = sample.direction;
+    const nextDirection = nextSample.direction;
+    const directionBlend = dot(direction, nextDirection);
+    let normal =
+      index === 0 || index === points.length - 1
+        ? direction.per().uni()
+        : Vec.Lrp(nextDirection, direction, directionBlend).per().uni();
+    if (normal.len2() < 1e-6) {
+      normal = previousNormal ?? new Vec(0, 1);
+    }
+    previousNormal = normal;
+
+    appendDistinctPointWithThreshold(
+      leftPoints,
+      sample.point.add(normal.mul(sample.radius)),
+      minDistanceSquared,
+    );
+    appendDistinctPointWithThreshold(
+      rightPoints,
+      sample.point.sub(normal.mul(sample.radius)),
+      minDistanceSquared,
+    );
+  }
+
+  if (isClosed && points.length >= 3) {
+    const outline: Vec[] = [];
+    for (const point of leftPoints) {
+      appendDistinctPoint(outline, point);
+    }
+    for (let index = rightPoints.length - 1; index >= 0; index -= 1) {
+      const point = rightPoints[index]!;
+      appendDistinctPoint(outline, point);
+    }
+    return outline;
+  }
+
+  const outline: Vec[] = [];
+  for (const point of leftPoints) {
+    appendDistinctPoint(outline, point);
+  }
+
+  if (options.capEnd ?? true) {
+    const endSample = points[points.length - 1]!;
+    for (const point of createClockwiseHalfArc(
+      endSample.point,
+      leftPoints[leftPoints.length - 1]!,
+      HALF_CAP_SEGMENTS,
+    )) {
+      appendDistinctPoint(outline, point);
+    }
+  }
+
+  for (let index = rightPoints.length - 1; index >= 0; index -= 1) {
+    const point = rightPoints[index]!;
+    appendDistinctPoint(outline, point);
+  }
+
+  if (options.capStart ?? true) {
+    const startSample = points[0]!;
+    for (const point of createClockwiseHalfArc(
+      startSample.point,
+      rightPoints[0]!,
+      HALF_CAP_SEGMENTS,
+    )) {
+      appendDistinctPoint(outline, point);
+    }
+  }
+
+  return outline;
+}
+
+function appendDistinctPointWithThreshold(
+  points: Vec[],
+  point: Vec,
+  minDistanceSquared: number,
+): void {
+  const previous = points[points.length - 1];
+  if (!previous || previous.dist2(point) > minDistanceSquared) {
+    appendDistinctPoint(points, point);
+    return;
+  }
+
+  points[points.length - 1] = point;
+}

package/_vendor/plugin-draw/feature.ts

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

package/_vendor/plugin-draw/index.ts

@@ -0,0 +1,31 @@
+export { DrawTool } from "./DrawTool";
+export { DrawShapeUtil } from "./DrawShapeUtil";
+export { DrawShapeSvgExporter, createDrawCorePlugin } from "./core";
+export { DrawShapeSvg } from "./DrawShapeRenderer";
+export { createDrawCanvasPlugin } from "./canvas";
+export { Draw, createDrawFeatureBundle } from "./feature";
+export {
+  flipDrawShapeInSelectionBounds,
+  getDrawShapeDiagnostics,
+  getDrawShapePageSegments,
+  getDrawShapePagePoints,
+  normalizeTransformedDrawShape,
+} from "./drawGeometry";
+export { interpolateDrawShapeRecords } from "./drawInterpolation";
+export type {
+  DrawShapePoint,
+  DrawShapeProps,
+  DrawShapeRecord,
+  DrawShapeSegment,
+} from "./types";
+export { isDrawShapeRecord } from "./types";
+export type {
+  DrawShapeDiagnostics,
+  DrawShapeSamplingStats,
+} from "./drawGeometry";
+export type { DrawShapeInterpolationOptions } from "./drawInterpolation";
+export type {
+  DrawSelectionFlipInput,
+  DrawSelectionResizeInput,
+  DrawSelectionRotationTransform,
+} from "./drawSelectionTransform";

package/_vendor/plugin-draw/types.ts

@@ -0,0 +1,36 @@
+import {
+  isShapeRecord,
+  type BaseRecord,
+  type ShapeRecordBase,
+} from "@land/canvas-core";
+
+export interface DrawShapePoint {
+  x: number;
+  y: number;
+  pressure?: number;
+  segment?: "straight";
+}
+
+export interface DrawShapeSegment {
+  points: DrawShapePoint[];
+}
+
+export interface DrawShapeProps {
+  segments: DrawShapeSegment[];
+  stroke: string;
+  strokeWidth: number;
+  fill: string;
+  isClosed: boolean;
+  isPen?: boolean;
+}
+
+export interface DrawShapeRecord extends ShapeRecordBase<"draw", DrawShapeProps> {
+  type: "draw";
+  props: DrawShapeProps;
+}
+
+export function isDrawShapeRecord(
+  record: BaseRecord | null | undefined,
+): record is DrawShapeRecord {
+  return isShapeRecord(record) && record.type === "draw";
+}