@tldraw/editor 5.1.1 → 5.2.0-canary.0878dbd31f0d

package/dist-cjs/lib/editor/overlays/ShapeIndicatorOverlayUtil.js

@@ -1,161 +0,0 @@
-"use strict";
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from))
-      if (!__hasOwnProp.call(to, key) && key !== except)
-        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
-  }
-  return to;
-};
-var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-var ShapeIndicatorOverlayUtil_exports = {};
-__export(ShapeIndicatorOverlayUtil_exports, {
-  ShapeIndicatorOverlayUtil: () => ShapeIndicatorOverlayUtil,
-  strokeShapeIndicators: () => strokeShapeIndicators
-});
-module.exports = __toCommonJS(ShapeIndicatorOverlayUtil_exports);
-var import_state = require("@tldraw/state");
-var import_store = require("@tldraw/store");
-var import_OverlayUtil = require("./OverlayUtil");
-const indicatorPathCache = (0, import_store.createComputedCache)(
-  "shapeIndicatorPath",
-  (editor, shape) => {
-    const util = editor.getShapeUtil(shape);
-    return util.getIndicatorPath(shape);
-  },
-  {
-    areRecordsEqual(a, b) {
-      return a.props === b.props;
-    }
-  }
-);
-function strokeShapeIndicators(editor, ctx, shapeIds) {
-  if (shapeIds.length === 0) return;
-  const batched = new Path2D();
-  for (const shapeId of shapeIds) {
-    const shape = editor.getShape(shapeId);
-    if (!shape || shape.isLocked) continue;
-    const pageTransform = editor.getShapePageTransform(shape);
-    if (!pageTransform) continue;
-    const indicatorPath = indicatorPathCache.get(editor, shape.id);
-    if (!indicatorPath) continue;
-    if (indicatorPath instanceof Path2D) {
-      batched.addPath(indicatorPath, pageTransform);
-      continue;
-    }
-    const { path, clipPath, additionalPaths } = indicatorPath;
-    if (!clipPath) {
-      batched.addPath(path, pageTransform);
-      if (additionalPaths) {
-        for (const p of additionalPaths) batched.addPath(p, pageTransform);
-      }
-      continue;
-    }
-    ctx.save();
-    ctx.transform(
-      pageTransform.a,
-      pageTransform.b,
-      pageTransform.c,
-      pageTransform.d,
-      pageTransform.e,
-      pageTransform.f
-    );
-    ctx.save();
-    ctx.clip(clipPath, "evenodd");
-    ctx.stroke(path);
-    ctx.restore();
-    if (additionalPaths) {
-      for (const p of additionalPaths) ctx.stroke(p);
-    }
-    ctx.restore();
-  }
-  ctx.stroke(batched);
-}
-class ShapeIndicatorOverlayUtil extends import_OverlayUtil.OverlayUtil {
-  static type = "shape_indicator";
-  options = { zIndex: 50, lineWidth: 1.5, hintedLineWidth: 2.5 };
-  // Narrow projection of instance state. Reading the full record would
-  // re-fire getOverlays on every cursor move / brush update; gating on these
-  // three booleans means we only re-fire when one of them actually flips.
-  _instanceFlags$ = (0, import_state.computed)(
-    "shape indicator instance flags",
-    () => {
-      const i = this.editor.getInstanceState();
-      return {
-        isChangingStyle: i.isChangingStyle,
-        isHoveringCanvas: i.isHoveringCanvas,
-        isCoarsePointer: i.isCoarsePointer
-      };
-    },
-    {
-      isEqual: (a, b) => a.isChangingStyle === b.isChangingStyle && a.isHoveringCanvas === b.isHoveringCanvas && a.isCoarsePointer === b.isCoarsePointer
-    }
-  );
-  isActive() {
-    return true;
-  }
-  getOverlays() {
-    const editor = this.editor;
-    const renderingShapeIds = new Set(editor.getRenderingShapes().map((s) => s.id));
-    const idsToDisplay = [];
-    const { isChangingStyle, isHoveringCanvas, isCoarsePointer } = this._instanceFlags$.get();
-    const isIdleOrEditing = editor.isInAny("select.idle", "select.editing_shape");
-    const isInSelectState = editor.isInAny(
-      "select.brushing",
-      "select.scribble_brushing",
-      "select.pointing_shape",
-      "select.pointing_selection",
-      "select.pointing_handle"
-    );
-    if (!isChangingStyle && (isIdleOrEditing || isInSelectState)) {
-      for (const id of editor.getSelectedShapeIds()) {
-        if (renderingShapeIds.has(id)) idsToDisplay.push(id);
-      }
-      if (isIdleOrEditing && isHoveringCanvas && !isCoarsePointer) {
-        const hovered = editor.getHoveredShapeId();
-        if (hovered && renderingShapeIds.has(hovered) && !idsToDisplay.includes(hovered)) {
-          idsToDisplay.push(hovered);
-        }
-      }
-    }
-    const hintingShapeIds = [];
-    for (const id of editor.getHintingShapeIds()) {
-      if (renderingShapeIds.has(id)) hintingShapeIds.push(id);
-    }
-    if (idsToDisplay.length === 0 && hintingShapeIds.length === 0) {
-      return [];
-    }
-    return [
-      {
-        id: "shape_indicator",
-        type: "shape_indicator",
-        props: { idsToDisplay, hintingShapeIds }
-      }
-    ];
-  }
-  render(ctx, overlays) {
-    const overlay = overlays[0];
-    if (!overlay) return;
-    const editor = this.editor;
-    const zoom = editor.getZoomLevel();
-    const { idsToDisplay, hintingShapeIds } = overlay.props;
-    ctx.lineCap = "round";
-    ctx.lineJoin = "round";
-    ctx.strokeStyle = editor.getCurrentTheme().colors[editor.getColorMode()].selectionStroke;
-    ctx.lineWidth = this.options.lineWidth / zoom;
-    strokeShapeIndicators(editor, ctx, idsToDisplay);
-    if (hintingShapeIds.length > 0) {
-      ctx.lineWidth = this.options.hintedLineWidth / zoom;
-      strokeShapeIndicators(editor, ctx, hintingShapeIds);
-    }
-  }
-}
-//# sourceMappingURL=ShapeIndicatorOverlayUtil.js.map

package/dist-cjs/lib/editor/overlays/ShapeIndicatorOverlayUtil.js.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../../../src/lib/editor/overlays/ShapeIndicatorOverlayUtil.ts"],
-  "sourcesContent": ["import { computed } from '@tldraw/state'\nimport { createComputedCache } from '@tldraw/store'\nimport { TLShape, TLShapeId } from '@tldraw/tlschema'\nimport type { Editor } from '../Editor'\nimport { OverlayUtil, TLOverlay } from './OverlayUtil'\n\ninterface RelevantInstanceFlags {\n\tisChangingStyle: boolean\n\tisHoveringCanvas: boolean | null\n\tisCoarsePointer: boolean\n}\n\n/** @public */\nexport interface TLShapeIndicatorOverlay extends TLOverlay {\n\tprops: {\n\t\tidsToDisplay: TLShapeId[]\n\t\thintingShapeIds: TLShapeId[]\n\t}\n}\n\nconst indicatorPathCache = createComputedCache(\n\t'shapeIndicatorPath',\n\t(editor: Editor, shape: TLShape) => {\n\t\tconst util = editor.getShapeUtil(shape)\n\t\treturn util.getIndicatorPath(shape)\n\t},\n\t{\n\t\tareRecordsEqual(a, b) {\n\t\t\treturn a.props === b.props\n\t\t},\n\t}\n)\n\n/**\n * Combine every batchable shape indicator into a single page-space `Path2D` and\n * emit one stroke call. Shapes whose indicator needs an evenodd clip (e.g.\n * arrows with labels or complex arrowheads) can't be batched \u2014 they still\n * stroke individually inside a save/restore with `ctx.clip` applied.\n *\n * Shared by {@link ShapeIndicatorOverlayUtil} and any overlay util that paints\n * shape indicators (e.g. collaborator selections).\n *\n * @public\n */\nexport function strokeShapeIndicators(\n\teditor: Editor,\n\tctx: CanvasRenderingContext2D,\n\tshapeIds: TLShapeId[]\n): void {\n\tif (shapeIds.length === 0) return\n\n\tconst batched = new Path2D()\n\n\tfor (const shapeId of shapeIds) {\n\t\tconst shape = editor.getShape(shapeId)\n\t\tif (!shape || shape.isLocked) continue\n\n\t\tconst pageTransform = editor.getShapePageTransform(shape)\n\t\tif (!pageTransform) continue\n\n\t\tconst indicatorPath = indicatorPathCache.get(editor, shape.id)\n\t\tif (!indicatorPath) continue\n\n\t\tif (indicatorPath instanceof Path2D) {\n\t\t\tbatched.addPath(indicatorPath, pageTransform)\n\t\t\tcontinue\n\t\t}\n\n\t\tconst { path, clipPath, additionalPaths } = indicatorPath\n\n\t\tif (!clipPath) {\n\t\t\tbatched.addPath(path, pageTransform)\n\t\t\tif (additionalPaths) {\n\t\t\t\tfor (const p of additionalPaths) batched.addPath(p, pageTransform)\n\t\t\t}\n\t\t\tcontinue\n\t\t}\n\n\t\t// Clipped case: fall back to an individual stroke. Rare (arrows with\n\t\t// labels / complex arrowheads), so the extra save/restore/stroke\n\t\t// pair per such shape isn't worth batching away.\n\t\tctx.save()\n\t\tctx.transform(\n\t\t\tpageTransform.a,\n\t\t\tpageTransform.b,\n\t\t\tpageTransform.c,\n\t\t\tpageTransform.d,\n\t\t\tpageTransform.e,\n\t\t\tpageTransform.f\n\t\t)\n\t\tctx.save()\n\t\tctx.clip(clipPath, 'evenodd')\n\t\tctx.stroke(path)\n\t\tctx.restore()\n\t\tif (additionalPaths) {\n\t\t\tfor (const p of additionalPaths) ctx.stroke(p)\n\t\t}\n\t\tctx.restore()\n\t}\n\n\tctx.stroke(batched)\n}\n\n/**\n * Overlay util for shape indicators \u2014 the selection / hover / hint outlines drawn\n * under the selection foreground. Paints local indicators in the theme's\n * selection color.\n *\n * Remote collaborator selection indicators are drawn by a separate overlay util\n * (e.g. `CollaboratorShapeIndicatorOverlayUtil` from `tldraw`) that runs at a\n * lower z-index so peer selections appear under the local indicators.\n *\n * Non-interactive: contributes no hit-test geometry.\n *\n * @public\n */\nexport class ShapeIndicatorOverlayUtil extends OverlayUtil<TLShapeIndicatorOverlay> {\n\tstatic override type = 'shape_indicator'\n\toverride options = { zIndex: 50, lineWidth: 1.5, hintedLineWidth: 2.5 }\n\n\t// Narrow projection of instance state. Reading the full record would\n\t// re-fire getOverlays on every cursor move / brush update; gating on these\n\t// three booleans means we only re-fire when one of them actually flips.\n\tprivate _instanceFlags$ = computed<RelevantInstanceFlags>(\n\t\t'shape indicator instance flags',\n\t\t() => {\n\t\t\tconst i = this.editor.getInstanceState()\n\t\t\treturn {\n\t\t\t\tisChangingStyle: i.isChangingStyle,\n\t\t\t\tisHoveringCanvas: i.isHoveringCanvas,\n\t\t\t\tisCoarsePointer: i.isCoarsePointer,\n\t\t\t}\n\t\t},\n\t\t{\n\t\t\tisEqual: (a, b) =>\n\t\t\t\ta.isChangingStyle === b.isChangingStyle &&\n\t\t\t\ta.isHoveringCanvas === b.isHoveringCanvas &&\n\t\t\t\ta.isCoarsePointer === b.isCoarsePointer,\n\t\t}\n\t)\n\n\toverride isActive(): boolean {\n\t\treturn true\n\t}\n\n\toverride getOverlays(): TLShapeIndicatorOverlay[] {\n\t\tconst editor = this.editor\n\t\tconst renderingShapeIds = new Set(editor.getRenderingShapes().map((s) => s.id))\n\n\t\t// Local selected / hovered indicators.\n\t\tconst idsToDisplay: TLShapeId[] = []\n\t\tconst { isChangingStyle, isHoveringCanvas, isCoarsePointer } = this._instanceFlags$.get()\n\t\tconst isIdleOrEditing = editor.isInAny('select.idle', 'select.editing_shape')\n\t\tconst isInSelectState = editor.isInAny(\n\t\t\t'select.brushing',\n\t\t\t'select.scribble_brushing',\n\t\t\t'select.pointing_shape',\n\t\t\t'select.pointing_selection',\n\t\t\t'select.pointing_handle'\n\t\t)\n\n\t\tif (!isChangingStyle && (isIdleOrEditing || isInSelectState)) {\n\t\t\tfor (const id of editor.getSelectedShapeIds()) {\n\t\t\t\tif (renderingShapeIds.has(id)) idsToDisplay.push(id)\n\t\t\t}\n\t\t\tif (isIdleOrEditing && isHoveringCanvas && !isCoarsePointer) {\n\t\t\t\tconst hovered = editor.getHoveredShapeId()\n\t\t\t\tif (hovered && renderingShapeIds.has(hovered) && !idsToDisplay.includes(hovered)) {\n\t\t\t\t\tidsToDisplay.push(hovered)\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\n\t\t// Hinted shapes (drawn thicker). Already deduped at write time in\n\t\t// `updateHintingShapeIds`, so no need to dedupe again here.\n\t\tconst hintingShapeIds: TLShapeId[] = []\n\t\tfor (const id of editor.getHintingShapeIds()) {\n\t\t\tif (renderingShapeIds.has(id)) hintingShapeIds.push(id)\n\t\t}\n\n\t\tif (idsToDisplay.length === 0 && hintingShapeIds.length === 0) {\n\t\t\treturn []\n\t\t}\n\n\t\treturn [\n\t\t\t{\n\t\t\t\tid: 'shape_indicator',\n\t\t\t\ttype: 'shape_indicator',\n\t\t\t\tprops: { idsToDisplay, hintingShapeIds },\n\t\t\t},\n\t\t]\n\t}\n\n\toverride render(ctx: CanvasRenderingContext2D, overlays: TLShapeIndicatorOverlay[]): void {\n\t\tconst overlay = overlays[0]\n\t\tif (!overlay) return\n\n\t\tconst editor = this.editor\n\t\tconst zoom = editor.getZoomLevel()\n\t\tconst { idsToDisplay, hintingShapeIds } = overlay.props\n\n\t\tctx.lineCap = 'round'\n\t\tctx.lineJoin = 'round'\n\n\t\t// Local selected / hovered indicators \u2014 one stroke call for the whole batch.\n\t\tctx.strokeStyle = editor.getCurrentTheme().colors[editor.getColorMode()].selectionStroke\n\t\tctx.lineWidth = this.options.lineWidth / zoom\n\t\tstrokeShapeIndicators(editor, ctx, idsToDisplay)\n\n\t\t// Hinted shapes \u2014 thicker stroke, one call for the whole batch.\n\t\tif (hintingShapeIds.length > 0) {\n\t\t\tctx.lineWidth = this.options.hintedLineWidth / zoom\n\t\t\tstrokeShapeIndicators(editor, ctx, hintingShapeIds)\n\t\t}\n\t}\n}\n"],
-  "mappings": "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",
-  "names": []
-}

package/dist-esm/lib/editor/overlays/ShapeIndicatorOverlayUtil.mjs

@@ -1,141 +0,0 @@
-import { computed } from "@tldraw/state";
-import { createComputedCache } from "@tldraw/store";
-import { OverlayUtil } from "./OverlayUtil.mjs";
-const indicatorPathCache = createComputedCache(
-  "shapeIndicatorPath",
-  (editor, shape) => {
-    const util = editor.getShapeUtil(shape);
-    return util.getIndicatorPath(shape);
-  },
-  {
-    areRecordsEqual(a, b) {
-      return a.props === b.props;
-    }
-  }
-);
-function strokeShapeIndicators(editor, ctx, shapeIds) {
-  if (shapeIds.length === 0) return;
-  const batched = new Path2D();
-  for (const shapeId of shapeIds) {
-    const shape = editor.getShape(shapeId);
-    if (!shape || shape.isLocked) continue;
-    const pageTransform = editor.getShapePageTransform(shape);
-    if (!pageTransform) continue;
-    const indicatorPath = indicatorPathCache.get(editor, shape.id);
-    if (!indicatorPath) continue;
-    if (indicatorPath instanceof Path2D) {
-      batched.addPath(indicatorPath, pageTransform);
-      continue;
-    }
-    const { path, clipPath, additionalPaths } = indicatorPath;
-    if (!clipPath) {
-      batched.addPath(path, pageTransform);
-      if (additionalPaths) {
-        for (const p of additionalPaths) batched.addPath(p, pageTransform);
-      }
-      continue;
-    }
-    ctx.save();
-    ctx.transform(
-      pageTransform.a,
-      pageTransform.b,
-      pageTransform.c,
-      pageTransform.d,
-      pageTransform.e,
-      pageTransform.f
-    );
-    ctx.save();
-    ctx.clip(clipPath, "evenodd");
-    ctx.stroke(path);
-    ctx.restore();
-    if (additionalPaths) {
-      for (const p of additionalPaths) ctx.stroke(p);
-    }
-    ctx.restore();
-  }
-  ctx.stroke(batched);
-}
-class ShapeIndicatorOverlayUtil extends OverlayUtil {
-  static type = "shape_indicator";
-  options = { zIndex: 50, lineWidth: 1.5, hintedLineWidth: 2.5 };
-  // Narrow projection of instance state. Reading the full record would
-  // re-fire getOverlays on every cursor move / brush update; gating on these
-  // three booleans means we only re-fire when one of them actually flips.
-  _instanceFlags$ = computed(
-    "shape indicator instance flags",
-    () => {
-      const i = this.editor.getInstanceState();
-      return {
-        isChangingStyle: i.isChangingStyle,
-        isHoveringCanvas: i.isHoveringCanvas,
-        isCoarsePointer: i.isCoarsePointer
-      };
-    },
-    {
-      isEqual: (a, b) => a.isChangingStyle === b.isChangingStyle && a.isHoveringCanvas === b.isHoveringCanvas && a.isCoarsePointer === b.isCoarsePointer
-    }
-  );
-  isActive() {
-    return true;
-  }
-  getOverlays() {
-    const editor = this.editor;
-    const renderingShapeIds = new Set(editor.getRenderingShapes().map((s) => s.id));
-    const idsToDisplay = [];
-    const { isChangingStyle, isHoveringCanvas, isCoarsePointer } = this._instanceFlags$.get();
-    const isIdleOrEditing = editor.isInAny("select.idle", "select.editing_shape");
-    const isInSelectState = editor.isInAny(
-      "select.brushing",
-      "select.scribble_brushing",
-      "select.pointing_shape",
-      "select.pointing_selection",
-      "select.pointing_handle"
-    );
-    if (!isChangingStyle && (isIdleOrEditing || isInSelectState)) {
-      for (const id of editor.getSelectedShapeIds()) {
-        if (renderingShapeIds.has(id)) idsToDisplay.push(id);
-      }
-      if (isIdleOrEditing && isHoveringCanvas && !isCoarsePointer) {
-        const hovered = editor.getHoveredShapeId();
-        if (hovered && renderingShapeIds.has(hovered) && !idsToDisplay.includes(hovered)) {
-          idsToDisplay.push(hovered);
-        }
-      }
-    }
-    const hintingShapeIds = [];
-    for (const id of editor.getHintingShapeIds()) {
-      if (renderingShapeIds.has(id)) hintingShapeIds.push(id);
-    }
-    if (idsToDisplay.length === 0 && hintingShapeIds.length === 0) {
-      return [];
-    }
-    return [
-      {
-        id: "shape_indicator",
-        type: "shape_indicator",
-        props: { idsToDisplay, hintingShapeIds }
-      }
-    ];
-  }
-  render(ctx, overlays) {
-    const overlay = overlays[0];
-    if (!overlay) return;
-    const editor = this.editor;
-    const zoom = editor.getZoomLevel();
-    const { idsToDisplay, hintingShapeIds } = overlay.props;
-    ctx.lineCap = "round";
-    ctx.lineJoin = "round";
-    ctx.strokeStyle = editor.getCurrentTheme().colors[editor.getColorMode()].selectionStroke;
-    ctx.lineWidth = this.options.lineWidth / zoom;
-    strokeShapeIndicators(editor, ctx, idsToDisplay);
-    if (hintingShapeIds.length > 0) {
-      ctx.lineWidth = this.options.hintedLineWidth / zoom;
-      strokeShapeIndicators(editor, ctx, hintingShapeIds);
-    }
-  }
-}
-export {
-  ShapeIndicatorOverlayUtil,
-  strokeShapeIndicators
-};
-//# sourceMappingURL=ShapeIndicatorOverlayUtil.mjs.map

package/dist-esm/lib/editor/overlays/ShapeIndicatorOverlayUtil.mjs.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../../../src/lib/editor/overlays/ShapeIndicatorOverlayUtil.ts"],
-  "sourcesContent": ["import { computed } from '@tldraw/state'\nimport { createComputedCache } from '@tldraw/store'\nimport { TLShape, TLShapeId } from '@tldraw/tlschema'\nimport type { Editor } from '../Editor'\nimport { OverlayUtil, TLOverlay } from './OverlayUtil'\n\ninterface RelevantInstanceFlags {\n\tisChangingStyle: boolean\n\tisHoveringCanvas: boolean | null\n\tisCoarsePointer: boolean\n}\n\n/** @public */\nexport interface TLShapeIndicatorOverlay extends TLOverlay {\n\tprops: {\n\t\tidsToDisplay: TLShapeId[]\n\t\thintingShapeIds: TLShapeId[]\n\t}\n}\n\nconst indicatorPathCache = createComputedCache(\n\t'shapeIndicatorPath',\n\t(editor: Editor, shape: TLShape) => {\n\t\tconst util = editor.getShapeUtil(shape)\n\t\treturn util.getIndicatorPath(shape)\n\t},\n\t{\n\t\tareRecordsEqual(a, b) {\n\t\t\treturn a.props === b.props\n\t\t},\n\t}\n)\n\n/**\n * Combine every batchable shape indicator into a single page-space `Path2D` and\n * emit one stroke call. Shapes whose indicator needs an evenodd clip (e.g.\n * arrows with labels or complex arrowheads) can't be batched \u2014 they still\n * stroke individually inside a save/restore with `ctx.clip` applied.\n *\n * Shared by {@link ShapeIndicatorOverlayUtil} and any overlay util that paints\n * shape indicators (e.g. collaborator selections).\n *\n * @public\n */\nexport function strokeShapeIndicators(\n\teditor: Editor,\n\tctx: CanvasRenderingContext2D,\n\tshapeIds: TLShapeId[]\n): void {\n\tif (shapeIds.length === 0) return\n\n\tconst batched = new Path2D()\n\n\tfor (const shapeId of shapeIds) {\n\t\tconst shape = editor.getShape(shapeId)\n\t\tif (!shape || shape.isLocked) continue\n\n\t\tconst pageTransform = editor.getShapePageTransform(shape)\n\t\tif (!pageTransform) continue\n\n\t\tconst indicatorPath = indicatorPathCache.get(editor, shape.id)\n\t\tif (!indicatorPath) continue\n\n\t\tif (indicatorPath instanceof Path2D) {\n\t\t\tbatched.addPath(indicatorPath, pageTransform)\n\t\t\tcontinue\n\t\t}\n\n\t\tconst { path, clipPath, additionalPaths } = indicatorPath\n\n\t\tif (!clipPath) {\n\t\t\tbatched.addPath(path, pageTransform)\n\t\t\tif (additionalPaths) {\n\t\t\t\tfor (const p of additionalPaths) batched.addPath(p, pageTransform)\n\t\t\t}\n\t\t\tcontinue\n\t\t}\n\n\t\t// Clipped case: fall back to an individual stroke. Rare (arrows with\n\t\t// labels / complex arrowheads), so the extra save/restore/stroke\n\t\t// pair per such shape isn't worth batching away.\n\t\tctx.save()\n\t\tctx.transform(\n\t\t\tpageTransform.a,\n\t\t\tpageTransform.b,\n\t\t\tpageTransform.c,\n\t\t\tpageTransform.d,\n\t\t\tpageTransform.e,\n\t\t\tpageTransform.f\n\t\t)\n\t\tctx.save()\n\t\tctx.clip(clipPath, 'evenodd')\n\t\tctx.stroke(path)\n\t\tctx.restore()\n\t\tif (additionalPaths) {\n\t\t\tfor (const p of additionalPaths) ctx.stroke(p)\n\t\t}\n\t\tctx.restore()\n\t}\n\n\tctx.stroke(batched)\n}\n\n/**\n * Overlay util for shape indicators \u2014 the selection / hover / hint outlines drawn\n * under the selection foreground. Paints local indicators in the theme's\n * selection color.\n *\n * Remote collaborator selection indicators are drawn by a separate overlay util\n * (e.g. `CollaboratorShapeIndicatorOverlayUtil` from `tldraw`) that runs at a\n * lower z-index so peer selections appear under the local indicators.\n *\n * Non-interactive: contributes no hit-test geometry.\n *\n * @public\n */\nexport class ShapeIndicatorOverlayUtil extends OverlayUtil<TLShapeIndicatorOverlay> {\n\tstatic override type = 'shape_indicator'\n\toverride options = { zIndex: 50, lineWidth: 1.5, hintedLineWidth: 2.5 }\n\n\t// Narrow projection of instance state. Reading the full record would\n\t// re-fire getOverlays on every cursor move / brush update; gating on these\n\t// three booleans means we only re-fire when one of them actually flips.\n\tprivate _instanceFlags$ = computed<RelevantInstanceFlags>(\n\t\t'shape indicator instance flags',\n\t\t() => {\n\t\t\tconst i = this.editor.getInstanceState()\n\t\t\treturn {\n\t\t\t\tisChangingStyle: i.isChangingStyle,\n\t\t\t\tisHoveringCanvas: i.isHoveringCanvas,\n\t\t\t\tisCoarsePointer: i.isCoarsePointer,\n\t\t\t}\n\t\t},\n\t\t{\n\t\t\tisEqual: (a, b) =>\n\t\t\t\ta.isChangingStyle === b.isChangingStyle &&\n\t\t\t\ta.isHoveringCanvas === b.isHoveringCanvas &&\n\t\t\t\ta.isCoarsePointer === b.isCoarsePointer,\n\t\t}\n\t)\n\n\toverride isActive(): boolean {\n\t\treturn true\n\t}\n\n\toverride getOverlays(): TLShapeIndicatorOverlay[] {\n\t\tconst editor = this.editor\n\t\tconst renderingShapeIds = new Set(editor.getRenderingShapes().map((s) => s.id))\n\n\t\t// Local selected / hovered indicators.\n\t\tconst idsToDisplay: TLShapeId[] = []\n\t\tconst { isChangingStyle, isHoveringCanvas, isCoarsePointer } = this._instanceFlags$.get()\n\t\tconst isIdleOrEditing = editor.isInAny('select.idle', 'select.editing_shape')\n\t\tconst isInSelectState = editor.isInAny(\n\t\t\t'select.brushing',\n\t\t\t'select.scribble_brushing',\n\t\t\t'select.pointing_shape',\n\t\t\t'select.pointing_selection',\n\t\t\t'select.pointing_handle'\n\t\t)\n\n\t\tif (!isChangingStyle && (isIdleOrEditing || isInSelectState)) {\n\t\t\tfor (const id of editor.getSelectedShapeIds()) {\n\t\t\t\tif (renderingShapeIds.has(id)) idsToDisplay.push(id)\n\t\t\t}\n\t\t\tif (isIdleOrEditing && isHoveringCanvas && !isCoarsePointer) {\n\t\t\t\tconst hovered = editor.getHoveredShapeId()\n\t\t\t\tif (hovered && renderingShapeIds.has(hovered) && !idsToDisplay.includes(hovered)) {\n\t\t\t\t\tidsToDisplay.push(hovered)\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\n\t\t// Hinted shapes (drawn thicker). Already deduped at write time in\n\t\t// `updateHintingShapeIds`, so no need to dedupe again here.\n\t\tconst hintingShapeIds: TLShapeId[] = []\n\t\tfor (const id of editor.getHintingShapeIds()) {\n\t\t\tif (renderingShapeIds.has(id)) hintingShapeIds.push(id)\n\t\t}\n\n\t\tif (idsToDisplay.length === 0 && hintingShapeIds.length === 0) {\n\t\t\treturn []\n\t\t}\n\n\t\treturn [\n\t\t\t{\n\t\t\t\tid: 'shape_indicator',\n\t\t\t\ttype: 'shape_indicator',\n\t\t\t\tprops: { idsToDisplay, hintingShapeIds },\n\t\t\t},\n\t\t]\n\t}\n\n\toverride render(ctx: CanvasRenderingContext2D, overlays: TLShapeIndicatorOverlay[]): void {\n\t\tconst overlay = overlays[0]\n\t\tif (!overlay) return\n\n\t\tconst editor = this.editor\n\t\tconst zoom = editor.getZoomLevel()\n\t\tconst { idsToDisplay, hintingShapeIds } = overlay.props\n\n\t\tctx.lineCap = 'round'\n\t\tctx.lineJoin = 'round'\n\n\t\t// Local selected / hovered indicators \u2014 one stroke call for the whole batch.\n\t\tctx.strokeStyle = editor.getCurrentTheme().colors[editor.getColorMode()].selectionStroke\n\t\tctx.lineWidth = this.options.lineWidth / zoom\n\t\tstrokeShapeIndicators(editor, ctx, idsToDisplay)\n\n\t\t// Hinted shapes \u2014 thicker stroke, one call for the whole batch.\n\t\tif (hintingShapeIds.length > 0) {\n\t\t\tctx.lineWidth = this.options.hintedLineWidth / zoom\n\t\t\tstrokeShapeIndicators(editor, ctx, hintingShapeIds)\n\t\t}\n\t}\n}\n"],
-  "mappings": "AAAA,SAAS,gBAAgB;AACzB,SAAS,2BAA2B;AAGpC,SAAS,mBAA8B;AAgBvC,MAAM,qBAAqB;AAAA,EAC1B;AAAA,EACA,CAAC,QAAgB,UAAmB;AACnC,UAAM,OAAO,OAAO,aAAa,KAAK;AACtC,WAAO,KAAK,iBAAiB,KAAK;AAAA,EACnC;AAAA,EACA;AAAA,IACC,gBAAgB,GAAG,GAAG;AACrB,aAAO,EAAE,UAAU,EAAE;AAAA,IACtB;AAAA,EACD;AACD;AAaO,SAAS,sBACf,QACA,KACA,UACO;AACP,MAAI,SAAS,WAAW,EAAG;AAE3B,QAAM,UAAU,IAAI,OAAO;AAE3B,aAAW,WAAW,UAAU;AAC/B,UAAM,QAAQ,OAAO,SAAS,OAAO;AACrC,QAAI,CAAC,SAAS,MAAM,SAAU;AAE9B,UAAM,gBAAgB,OAAO,sBAAsB,KAAK;AACxD,QAAI,CAAC,cAAe;AAEpB,UAAM,gBAAgB,mBAAmB,IAAI,QAAQ,MAAM,EAAE;AAC7D,QAAI,CAAC,cAAe;AAEpB,QAAI,yBAAyB,QAAQ;AACpC,cAAQ,QAAQ,eAAe,aAAa;AAC5C;AAAA,IACD;AAEA,UAAM,EAAE,MAAM,UAAU,gBAAgB,IAAI;AAE5C,QAAI,CAAC,UAAU;AACd,cAAQ,QAAQ,MAAM,aAAa;AACnC,UAAI,iBAAiB;AACpB,mBAAW,KAAK,gBAAiB,SAAQ,QAAQ,GAAG,aAAa;AAAA,MAClE;AACA;AAAA,IACD;AAKA,QAAI,KAAK;AACT,QAAI;AAAA,MACH,cAAc;AAAA,MACd,cAAc;AAAA,MACd,cAAc;AAAA,MACd,cAAc;AAAA,MACd,cAAc;AAAA,MACd,cAAc;AAAA,IACf;AACA,QAAI,KAAK;AACT,QAAI,KAAK,UAAU,SAAS;AAC5B,QAAI,OAAO,IAAI;AACf,QAAI,QAAQ;AACZ,QAAI,iBAAiB;AACpB,iBAAW,KAAK,gBAAiB,KAAI,OAAO,CAAC;AAAA,IAC9C;AACA,QAAI,QAAQ;AAAA,EACb;AAEA,MAAI,OAAO,OAAO;AACnB;AAeO,MAAM,kCAAkC,YAAqC;AAAA,EACnF,OAAgB,OAAO;AAAA,EACd,UAAU,EAAE,QAAQ,IAAI,WAAW,KAAK,iBAAiB,IAAI;AAAA;AAAA;AAAA;AAAA,EAK9D,kBAAkB;AAAA,IACzB;AAAA,IACA,MAAM;AACL,YAAM,IAAI,KAAK,OAAO,iBAAiB;AACvC,aAAO;AAAA,QACN,iBAAiB,EAAE;AAAA,QACnB,kBAAkB,EAAE;AAAA,QACpB,iBAAiB,EAAE;AAAA,MACpB;AAAA,IACD;AAAA,IACA;AAAA,MACC,SAAS,CAAC,GAAG,MACZ,EAAE,oBAAoB,EAAE,mBACxB,EAAE,qBAAqB,EAAE,oBACzB,EAAE,oBAAoB,EAAE;AAAA,IAC1B;AAAA,EACD;AAAA,EAES,WAAoB;AAC5B,WAAO;AAAA,EACR;AAAA,EAES,cAAyC;AACjD,UAAM,SAAS,KAAK;AACpB,UAAM,oBAAoB,IAAI,IAAI,OAAO,mBAAmB,EAAE,IAAI,CAAC,MAAM,EAAE,EAAE,CAAC;AAG9E,UAAM,eAA4B,CAAC;AACnC,UAAM,EAAE,iBAAiB,kBAAkB,gBAAgB,IAAI,KAAK,gBAAgB,IAAI;AACxF,UAAM,kBAAkB,OAAO,QAAQ,eAAe,sBAAsB;AAC5E,UAAM,kBAAkB,OAAO;AAAA,MAC9B;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACD;AAEA,QAAI,CAAC,oBAAoB,mBAAmB,kBAAkB;AAC7D,iBAAW,MAAM,OAAO,oBAAoB,GAAG;AAC9C,YAAI,kBAAkB,IAAI,EAAE,EAAG,cAAa,KAAK,EAAE;AAAA,MACpD;AACA,UAAI,mBAAmB,oBAAoB,CAAC,iBAAiB;AAC5D,cAAM,UAAU,OAAO,kBAAkB;AACzC,YAAI,WAAW,kBAAkB,IAAI,OAAO,KAAK,CAAC,aAAa,SAAS,OAAO,GAAG;AACjF,uBAAa,KAAK,OAAO;AAAA,QAC1B;AAAA,MACD;AAAA,IACD;AAIA,UAAM,kBAA+B,CAAC;AACtC,eAAW,MAAM,OAAO,mBAAmB,GAAG;AAC7C,UAAI,kBAAkB,IAAI,EAAE,EAAG,iBAAgB,KAAK,EAAE;AAAA,IACvD;AAEA,QAAI,aAAa,WAAW,KAAK,gBAAgB,WAAW,GAAG;AAC9D,aAAO,CAAC;AAAA,IACT;AAEA,WAAO;AAAA,MACN;AAAA,QACC,IAAI;AAAA,QACJ,MAAM;AAAA,QACN,OAAO,EAAE,cAAc,gBAAgB;AAAA,MACxC;AAAA,IACD;AAAA,EACD;AAAA,EAES,OAAO,KAA+B,UAA2C;AACzF,UAAM,UAAU,SAAS,CAAC;AAC1B,QAAI,CAAC,QAAS;AAEd,UAAM,SAAS,KAAK;AACpB,UAAM,OAAO,OAAO,aAAa;AACjC,UAAM,EAAE,cAAc,gBAAgB,IAAI,QAAQ;AAElD,QAAI,UAAU;AACd,QAAI,WAAW;AAGf,QAAI,cAAc,OAAO,gBAAgB,EAAE,OAAO,OAAO,aAAa,CAAC,EAAE;AACzE,QAAI,YAAY,KAAK,QAAQ,YAAY;AACzC,0BAAsB,QAAQ,KAAK,YAAY;AAG/C,QAAI,gBAAgB,SAAS,GAAG;AAC/B,UAAI,YAAY,KAAK,QAAQ,kBAAkB;AAC/C,4BAAsB,QAAQ,KAAK,eAAe;AAAA,IACnD;AAAA,EACD;AACD;",
-  "names": []
-}

package/src/lib/editor/overlays/ShapeIndicatorOverlayUtil.ts

@@ -1,216 +0,0 @@
-import { computed } from '@tldraw/state'
-import { createComputedCache } from '@tldraw/store'
-import { TLShape, TLShapeId } from '@tldraw/tlschema'
-import type { Editor } from '../Editor'
-import { OverlayUtil, TLOverlay } from './OverlayUtil'
-
-interface RelevantInstanceFlags {
-	isChangingStyle: boolean
-	isHoveringCanvas: boolean | null
-	isCoarsePointer: boolean
-}
-
-/** @public */
-export interface TLShapeIndicatorOverlay extends TLOverlay {
-	props: {
-		idsToDisplay: TLShapeId[]
-		hintingShapeIds: TLShapeId[]
-	}
-}
-
-const indicatorPathCache = createComputedCache(
-	'shapeIndicatorPath',
-	(editor: Editor, shape: TLShape) => {
-		const util = editor.getShapeUtil(shape)
-		return util.getIndicatorPath(shape)
-	},
-	{
-		areRecordsEqual(a, b) {
-			return a.props === b.props
-		},
-	}
-)
-
-/**
- * Combine every batchable shape indicator into a single page-space `Path2D` and
- * emit one stroke call. Shapes whose indicator needs an evenodd clip (e.g.
- * arrows with labels or complex arrowheads) can't be batched — they still
- * stroke individually inside a save/restore with `ctx.clip` applied.
- *
- * Shared by {@link ShapeIndicatorOverlayUtil} and any overlay util that paints
- * shape indicators (e.g. collaborator selections).
- *
- * @public
- */
-export function strokeShapeIndicators(
-	editor: Editor,
-	ctx: CanvasRenderingContext2D,
-	shapeIds: TLShapeId[]
-): void {
-	if (shapeIds.length === 0) return
-
-	const batched = new Path2D()
-
-	for (const shapeId of shapeIds) {
-		const shape = editor.getShape(shapeId)
-		if (!shape || shape.isLocked) continue
-
-		const pageTransform = editor.getShapePageTransform(shape)
-		if (!pageTransform) continue
-
-		const indicatorPath = indicatorPathCache.get(editor, shape.id)
-		if (!indicatorPath) continue
-
-		if (indicatorPath instanceof Path2D) {
-			batched.addPath(indicatorPath, pageTransform)
-			continue
-		}
-
-		const { path, clipPath, additionalPaths } = indicatorPath
-
-		if (!clipPath) {
-			batched.addPath(path, pageTransform)
-			if (additionalPaths) {
-				for (const p of additionalPaths) batched.addPath(p, pageTransform)
-			}
-			continue
-		}
-
-		// Clipped case: fall back to an individual stroke. Rare (arrows with
-		// labels / complex arrowheads), so the extra save/restore/stroke
-		// pair per such shape isn't worth batching away.
-		ctx.save()
-		ctx.transform(
-			pageTransform.a,
-			pageTransform.b,
-			pageTransform.c,
-			pageTransform.d,
-			pageTransform.e,
-			pageTransform.f
-		)
-		ctx.save()
-		ctx.clip(clipPath, 'evenodd')
-		ctx.stroke(path)
-		ctx.restore()
-		if (additionalPaths) {
-			for (const p of additionalPaths) ctx.stroke(p)
-		}
-		ctx.restore()
-	}
-
-	ctx.stroke(batched)
-}
-
-/**
- * Overlay util for shape indicators — the selection / hover / hint outlines drawn
- * under the selection foreground. Paints local indicators in the theme's
- * selection color.
- *
- * Remote collaborator selection indicators are drawn by a separate overlay util
- * (e.g. `CollaboratorShapeIndicatorOverlayUtil` from `tldraw`) that runs at a
- * lower z-index so peer selections appear under the local indicators.
- *
- * Non-interactive: contributes no hit-test geometry.
- *
- * @public
- */
-export class ShapeIndicatorOverlayUtil extends OverlayUtil<TLShapeIndicatorOverlay> {
-	static override type = 'shape_indicator'
-	override options = { zIndex: 50, lineWidth: 1.5, hintedLineWidth: 2.5 }
-
-	// Narrow projection of instance state. Reading the full record would
-	// re-fire getOverlays on every cursor move / brush update; gating on these
-	// three booleans means we only re-fire when one of them actually flips.
-	private _instanceFlags$ = computed<RelevantInstanceFlags>(
-		'shape indicator instance flags',
-		() => {
-			const i = this.editor.getInstanceState()
-			return {
-				isChangingStyle: i.isChangingStyle,
-				isHoveringCanvas: i.isHoveringCanvas,
-				isCoarsePointer: i.isCoarsePointer,
-			}
-		},
-		{
-			isEqual: (a, b) =>
-				a.isChangingStyle === b.isChangingStyle &&
-				a.isHoveringCanvas === b.isHoveringCanvas &&
-				a.isCoarsePointer === b.isCoarsePointer,
-		}
-	)
-
-	override isActive(): boolean {
-		return true
-	}
-
-	override getOverlays(): TLShapeIndicatorOverlay[] {
-		const editor = this.editor
-		const renderingShapeIds = new Set(editor.getRenderingShapes().map((s) => s.id))
-
-		// Local selected / hovered indicators.
-		const idsToDisplay: TLShapeId[] = []
-		const { isChangingStyle, isHoveringCanvas, isCoarsePointer } = this._instanceFlags$.get()
-		const isIdleOrEditing = editor.isInAny('select.idle', 'select.editing_shape')
-		const isInSelectState = editor.isInAny(
-			'select.brushing',
-			'select.scribble_brushing',
-			'select.pointing_shape',
-			'select.pointing_selection',
-			'select.pointing_handle'
-		)
-
-		if (!isChangingStyle && (isIdleOrEditing || isInSelectState)) {
-			for (const id of editor.getSelectedShapeIds()) {
-				if (renderingShapeIds.has(id)) idsToDisplay.push(id)
-			}
-			if (isIdleOrEditing && isHoveringCanvas && !isCoarsePointer) {
-				const hovered = editor.getHoveredShapeId()
-				if (hovered && renderingShapeIds.has(hovered) && !idsToDisplay.includes(hovered)) {
-					idsToDisplay.push(hovered)
-				}
-			}
-		}
-
-		// Hinted shapes (drawn thicker). Already deduped at write time in
-		// `updateHintingShapeIds`, so no need to dedupe again here.
-		const hintingShapeIds: TLShapeId[] = []
-		for (const id of editor.getHintingShapeIds()) {
-			if (renderingShapeIds.has(id)) hintingShapeIds.push(id)
-		}
-
-		if (idsToDisplay.length === 0 && hintingShapeIds.length === 0) {
-			return []
-		}
-
-		return [
-			{
-				id: 'shape_indicator',
-				type: 'shape_indicator',
-				props: { idsToDisplay, hintingShapeIds },
-			},
-		]
-	}
-
-	override render(ctx: CanvasRenderingContext2D, overlays: TLShapeIndicatorOverlay[]): void {
-		const overlay = overlays[0]
-		if (!overlay) return
-
-		const editor = this.editor
-		const zoom = editor.getZoomLevel()
-		const { idsToDisplay, hintingShapeIds } = overlay.props
-
-		ctx.lineCap = 'round'
-		ctx.lineJoin = 'round'
-
-		// Local selected / hovered indicators — one stroke call for the whole batch.
-		ctx.strokeStyle = editor.getCurrentTheme().colors[editor.getColorMode()].selectionStroke
-		ctx.lineWidth = this.options.lineWidth / zoom
-		strokeShapeIndicators(editor, ctx, idsToDisplay)
-
-		// Hinted shapes — thicker stroke, one call for the whole batch.
-		if (hintingShapeIds.length > 0) {
-			ctx.lineWidth = this.options.hintedLineWidth / zoom
-			strokeShapeIndicators(editor, ctx, hintingShapeIds)
-		}
-	}
-}