@tldraw/editor 4.6.0-next.fecc64eee134 → 5.0.0

package/dist-cjs/lib/components/default-components/DefaultShapeIndicators.js

@@ -1,101 +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 DefaultShapeIndicators_exports = {};
-__export(DefaultShapeIndicators_exports, {
-  DefaultShapeIndicators: () => DefaultShapeIndicators
-});
-module.exports = __toCommonJS(DefaultShapeIndicators_exports);
-var import_jsx_runtime = require("react/jsx-runtime");
-var import_state_react = require("@tldraw/state-react");
-var import_react = require("react");
-var import_EditorComponentsContext = require("../../hooks/EditorComponentsContext");
-var import_useEditor = require("../../hooks/useEditor");
-const DefaultShapeIndicators = (0, import_react.memo)(function DefaultShapeIndicators2({
-  hideAll,
-  showAll
-}) {
-  const editor = (0, import_useEditor.useEditor)();
-  if (hideAll && showAll)
-    throw Error("You cannot set both hideAll and showAll props to true, cmon now");
-  const rPreviousSelectedShapeIds = (0, import_react.useRef)(/* @__PURE__ */ new Set());
-  const idsToDisplay = (0, import_state_react.useValue)(
-    "should display selected ids",
-    () => {
-      const prev = rPreviousSelectedShapeIds.current;
-      const next = /* @__PURE__ */ new Set();
-      const instanceState = editor.getInstanceState();
-      const isChangingStyle = instanceState.isChangingStyle;
-      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)) {
-        rPreviousSelectedShapeIds.current = next;
-        return next;
-      }
-      for (const id of editor.getSelectedShapeIds()) {
-        next.add(id);
-      }
-      if (isIdleOrEditing && instanceState.isHoveringCanvas && !instanceState.isCoarsePointer) {
-        const hovered = editor.getHoveredShapeId();
-        if (hovered) next.add(hovered);
-      }
-      if (prev.size !== next.size) {
-        rPreviousSelectedShapeIds.current = next;
-        return next;
-      }
-      for (const id of next) {
-        if (!prev.has(id)) {
-          rPreviousSelectedShapeIds.current = next;
-          return next;
-        }
-      }
-      return prev;
-    },
-    [editor]
-  );
-  const renderingShapes = (0, import_state_react.useValue)("rendering shapes", () => editor.getRenderingShapes(), [editor]);
-  const { ShapeIndicator } = (0, import_EditorComponentsContext.useEditorComponents)();
-  const shapesToRender = (0, import_state_react.useValue)(
-    "shapes to render for svg indicators",
-    () => {
-      return renderingShapes.filter(({ id }) => {
-        const shape = editor.getShape(id);
-        if (!shape) return false;
-        const util = editor.getShapeUtil(shape);
-        return util.useLegacyIndicator();
-      });
-    },
-    [editor, renderingShapes]
-  );
-  if (!ShapeIndicator) return null;
-  return shapesToRender.map(({ id }) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-    ShapeIndicator,
-    {
-      shapeId: id,
-      hidden: !showAll && (hideAll || !idsToDisplay.has(id))
-    },
-    id + "_indicator"
-  ));
-});
-//# sourceMappingURL=DefaultShapeIndicators.js.map

package/dist-cjs/lib/components/default-components/DefaultShapeIndicators.js.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../../../src/lib/components/default-components/DefaultShapeIndicators.tsx"],
-  "sourcesContent": ["import { useValue } from '@tldraw/state-react'\nimport { TLShapeId } from '@tldraw/tlschema'\nimport { memo, useRef } from 'react'\nimport { useEditorComponents } from '../../hooks/EditorComponentsContext'\nimport { useEditor } from '../../hooks/useEditor'\n\n/** @public */\nexport interface TLShapeIndicatorsProps {\n\t/** Whether to hide all of the indicators */\n\thideAll?: boolean\n\t/** Whether to show all of the indicators */\n\tshowAll?: boolean\n}\n\n/** @public @react */\nexport const DefaultShapeIndicators = memo(function DefaultShapeIndicators({\n\thideAll,\n\tshowAll,\n}: TLShapeIndicatorsProps) {\n\tconst editor = useEditor()\n\n\tif (hideAll && showAll)\n\t\tthrow Error('You cannot set both hideAll and showAll props to true, cmon now')\n\n\tconst rPreviousSelectedShapeIds = useRef<Set<TLShapeId>>(new Set())\n\n\tconst idsToDisplay = useValue(\n\t\t'should display selected ids',\n\t\t() => {\n\t\t\tconst prev = rPreviousSelectedShapeIds.current\n\t\t\tconst next = new Set<TLShapeId>()\n\n\t\t\tconst instanceState = editor.getInstanceState()\n\n\t\t\tconst isChangingStyle = instanceState.isChangingStyle\n\n\t\t\t// todo: this is tldraw specific and is duplicated at the tldraw layer. What should we do here instead?\n\n\t\t\tconst isIdleOrEditing = editor.isInAny('select.idle', 'select.editing_shape')\n\n\t\t\tconst isInSelectState = editor.isInAny(\n\t\t\t\t'select.brushing',\n\t\t\t\t'select.scribble_brushing',\n\t\t\t\t'select.pointing_shape',\n\t\t\t\t'select.pointing_selection',\n\t\t\t\t'select.pointing_handle'\n\t\t\t)\n\n\t\t\t// We hide all indicators if we're changing style or in certain interactions\n\t\t\t// todo: move this to some kind of Tool.hideIndicators property\n\t\t\tif (isChangingStyle || !(isIdleOrEditing || isInSelectState)) {\n\t\t\t\trPreviousSelectedShapeIds.current = next\n\t\t\t\treturn next\n\t\t\t}\n\n\t\t\t// We always want to show indicators for the selected shapes, if any\n\t\t\tfor (const id of editor.getSelectedShapeIds()) {\n\t\t\t\tnext.add(id)\n\t\t\t}\n\n\t\t\t// If we're idle or editing a shape, we want to also show an indicator for the hovered shape, if any\n\t\t\tif (isIdleOrEditing && instanceState.isHoveringCanvas && !instanceState.isCoarsePointer) {\n\t\t\t\tconst hovered = editor.getHoveredShapeId()\n\t\t\t\tif (hovered) next.add(hovered)\n\t\t\t}\n\n\t\t\t// Ok, has anything changed?\n\n\t\t\t// If the number of items in the set is different, then the selection has changed. This catches most changes.\n\t\t\tif (prev.size !== next.size) {\n\t\t\t\trPreviousSelectedShapeIds.current = next\n\t\t\t\treturn next\n\t\t\t}\n\n\t\t\t// Set difference check\n\t\t\tfor (const id of next) {\n\t\t\t\tif (!prev.has(id)) {\n\t\t\t\t\trPreviousSelectedShapeIds.current = next\n\t\t\t\t\treturn next\n\t\t\t\t}\n\t\t\t}\n\n\t\t\treturn prev\n\t\t},\n\t\t[editor]\n\t)\n\n\t// Show indicators only for the shapes that are currently being rendered (ie that are on screen)\n\tconst renderingShapes = useValue('rendering shapes', () => editor.getRenderingShapes(), [editor])\n\n\tconst { ShapeIndicator } = useEditorComponents()\n\n\t// Filter out shapes that have canvas indicator support - only render shapes that use legacy SVG indicators\n\tconst shapesToRender = useValue(\n\t\t'shapes to render for svg indicators',\n\t\t() => {\n\t\t\treturn renderingShapes.filter(({ id }) => {\n\t\t\t\tconst shape = editor.getShape(id)\n\t\t\t\tif (!shape) return false\n\t\t\t\tconst util = editor.getShapeUtil(shape)\n\t\t\t\treturn util.useLegacyIndicator()\n\t\t\t})\n\t\t},\n\t\t[editor, renderingShapes]\n\t)\n\n\tif (!ShapeIndicator) return null\n\n\treturn shapesToRender.map(({ id }) => (\n\t\t<ShapeIndicator\n\t\t\tkey={id + '_indicator'}\n\t\t\tshapeId={id}\n\t\t\thidden={!showAll && (hideAll || !idsToDisplay.has(id))}\n\t\t/>\n\t))\n})\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AA6GE;AA7GF,yBAAyB;AAEzB,mBAA6B;AAC7B,qCAAoC;AACpC,uBAA0B;AAWnB,MAAM,6BAAyB,mBAAK,SAASA,wBAAuB;AAAA,EAC1E;AAAA,EACA;AACD,GAA2B;AAC1B,QAAM,aAAS,4BAAU;AAEzB,MAAI,WAAW;AACd,UAAM,MAAM,iEAAiE;AAE9E,QAAM,gCAA4B,qBAAuB,oBAAI,IAAI,CAAC;AAElE,QAAM,mBAAe;AAAA,IACpB;AAAA,IACA,MAAM;AACL,YAAM,OAAO,0BAA0B;AACvC,YAAM,OAAO,oBAAI,IAAe;AAEhC,YAAM,gBAAgB,OAAO,iBAAiB;AAE9C,YAAM,kBAAkB,cAAc;AAItC,YAAM,kBAAkB,OAAO,QAAQ,eAAe,sBAAsB;AAE5E,YAAM,kBAAkB,OAAO;AAAA,QAC9B;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,MACD;AAIA,UAAI,mBAAmB,EAAE,mBAAmB,kBAAkB;AAC7D,kCAA0B,UAAU;AACpC,eAAO;AAAA,MACR;AAGA,iBAAW,MAAM,OAAO,oBAAoB,GAAG;AAC9C,aAAK,IAAI,EAAE;AAAA,MACZ;AAGA,UAAI,mBAAmB,cAAc,oBAAoB,CAAC,cAAc,iBAAiB;AACxF,cAAM,UAAU,OAAO,kBAAkB;AACzC,YAAI,QAAS,MAAK,IAAI,OAAO;AAAA,MAC9B;AAKA,UAAI,KAAK,SAAS,KAAK,MAAM;AAC5B,kCAA0B,UAAU;AACpC,eAAO;AAAA,MACR;AAGA,iBAAW,MAAM,MAAM;AACtB,YAAI,CAAC,KAAK,IAAI,EAAE,GAAG;AAClB,oCAA0B,UAAU;AACpC,iBAAO;AAAA,QACR;AAAA,MACD;AAEA,aAAO;AAAA,IACR;AAAA,IACA,CAAC,MAAM;AAAA,EACR;AAGA,QAAM,sBAAkB,6BAAS,oBAAoB,MAAM,OAAO,mBAAmB,GAAG,CAAC,MAAM,CAAC;AAEhG,QAAM,EAAE,eAAe,QAAI,oDAAoB;AAG/C,QAAM,qBAAiB;AAAA,IACtB;AAAA,IACA,MAAM;AACL,aAAO,gBAAgB,OAAO,CAAC,EAAE,GAAG,MAAM;AACzC,cAAM,QAAQ,OAAO,SAAS,EAAE;AAChC,YAAI,CAAC,MAAO,QAAO;AACnB,cAAM,OAAO,OAAO,aAAa,KAAK;AACtC,eAAO,KAAK,mBAAmB;AAAA,MAChC,CAAC;AAAA,IACF;AAAA,IACA,CAAC,QAAQ,eAAe;AAAA,EACzB;AAEA,MAAI,CAAC,eAAgB,QAAO;AAE5B,SAAO,eAAe,IAAI,CAAC,EAAE,GAAG,MAC/B;AAAA,IAAC;AAAA;AAAA,MAEA,SAAS;AAAA,MACT,QAAQ,CAAC,YAAY,WAAW,CAAC,aAAa,IAAI,EAAE;AAAA;AAAA,IAF/C,KAAK;AAAA,EAGX,CACA;AACF,CAAC;",
-  "names": ["DefaultShapeIndicators"]
-}

package/dist-cjs/lib/components/default-components/DefaultSnapIndictor.js

@@ -1,170 +0,0 @@
-"use strict";
-var __create = Object.create;
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getProtoOf = Object.getPrototypeOf;
-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 __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
-  // If the importer is in node compatibility mode or this is not an ESM
-  // file that has been converted to a CommonJS file using a Babel-
-  // compatible transform (i.e. "__esModule" has not been set), then set
-  // "default" to the CommonJS "module.exports" for node compatibility.
-  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
-  mod
-));
-var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-var DefaultSnapIndictor_exports = {};
-__export(DefaultSnapIndictor_exports, {
-  DefaultSnapIndicator: () => DefaultSnapIndicator
-});
-module.exports = __toCommonJS(DefaultSnapIndictor_exports);
-var import_jsx_runtime = require("react/jsx-runtime");
-var import_classnames = __toESM(require("classnames"), 1);
-var React = __toESM(require("react"), 1);
-var import_utils = require("../../primitives/utils");
-function PointsSnapIndicator({ points, zoom }) {
-  const l = 2.5 / zoom;
-  const minX = points.reduce((acc, p) => Math.min(acc, p.x), Infinity);
-  const maxX = points.reduce((acc, p) => Math.max(acc, p.x), -Infinity);
-  const minY = points.reduce((acc, p) => Math.min(acc, p.y), Infinity);
-  const maxY = points.reduce((acc, p) => Math.max(acc, p.y), -Infinity);
-  const useNWtoSEdireciton = points.some((p) => p.x === minX && p.y === minY);
-  let firstX, firstY, secondX, secondY;
-  if (useNWtoSEdireciton) {
-    firstX = minX;
-    firstY = minY;
-    secondX = maxX;
-    secondY = maxY;
-  } else {
-    firstX = minX;
-    firstY = maxY;
-    secondX = maxX;
-    secondY = minY;
-  }
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("g", { className: "tl-snap-indicator", stroke: "lime", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("line", { x1: firstX, y1: firstY, x2: secondX, y2: secondY }),
-    points.map((p, i) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)("g", { transform: `translate(${p.x},${p.y})`, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-      "path",
-      {
-        className: "tl-snap-point",
-        d: `M ${-l},${-l} L ${l},${l} M ${-l},${l} L ${l},${-l}`
-      }
-    ) }, i))
-  ] });
-}
-function GapsSnapIndicator({ gaps, direction, zoom }) {
-  const l = 3.5 / zoom;
-  let edgeIntersection = [-Infinity, Infinity];
-  let nextEdgeIntersection = null;
-  const horizontal = direction === "horizontal";
-  for (const gap of gaps) {
-    nextEdgeIntersection = (0, import_utils.rangeIntersection)(
-      edgeIntersection[0],
-      edgeIntersection[1],
-      horizontal ? gap.startEdge[0].y : gap.startEdge[0].x,
-      horizontal ? gap.startEdge[1].y : gap.startEdge[1].x
-    );
-    if (nextEdgeIntersection) {
-      edgeIntersection = nextEdgeIntersection;
-    } else {
-      continue;
-    }
-    nextEdgeIntersection = (0, import_utils.rangeIntersection)(
-      edgeIntersection[0],
-      edgeIntersection[1],
-      horizontal ? gap.endEdge[0].y : gap.endEdge[0].x,
-      horizontal ? gap.endEdge[1].y : gap.endEdge[1].x
-    );
-    if (nextEdgeIntersection) {
-      edgeIntersection = nextEdgeIntersection;
-    } else {
-      continue;
-    }
-  }
-  if (edgeIntersection === null) {
-    return null;
-  }
-  const midPoint = (edgeIntersection[0] + edgeIntersection[1]) / 2;
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("g", { className: "tl-snap-indicator", stroke: "cyan", children: gaps.map(({ startEdge, endEdge }, i) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(React.Fragment, { children: horizontal ? (
-    // horizontal gap
-    /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
-      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-        "line",
-        {
-          x1: startEdge[0].x,
-          y1: midPoint - 2 * l,
-          x2: startEdge[1].x,
-          y2: midPoint + 2 * l
-        }
-      ),
-      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-        "line",
-        {
-          x1: endEdge[0].x,
-          y1: midPoint - 2 * l,
-          x2: endEdge[1].x,
-          y2: midPoint + 2 * l
-        }
-      ),
-      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("line", { x1: startEdge[0].x, y1: midPoint, x2: endEdge[0].x, y2: midPoint }),
-      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-        "line",
-        {
-          x1: (startEdge[0].x + endEdge[0].x) / 2,
-          y1: midPoint - l,
-          x2: (startEdge[0].x + endEdge[0].x) / 2,
-          y2: midPoint + l
-        }
-      )
-    ] })
-  ) : (
-    // vertical gap
-    /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
-      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-        "line",
-        {
-          x1: midPoint - 2 * l,
-          y1: startEdge[0].y,
-          x2: midPoint + 2 * l,
-          y2: startEdge[1].y
-        }
-      ),
-      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-        "line",
-        {
-          x1: midPoint - 2 * l,
-          y1: endEdge[0].y,
-          x2: midPoint + 2 * l,
-          y2: endEdge[1].y
-        }
-      ),
-      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("line", { x1: midPoint, y1: startEdge[0].y, x2: midPoint, y2: endEdge[0].y }),
-      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-        "line",
-        {
-          x1: midPoint - l,
-          y1: (startEdge[0].y + endEdge[0].y) / 2,
-          x2: midPoint + l,
-          y2: (startEdge[0].y + endEdge[0].y) / 2
-        }
-      )
-    ] })
-  ) }, i)) });
-}
-function DefaultSnapIndicator({ className, line, zoom }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("svg", { className: (0, import_classnames.default)("tl-overlays__item", className), "aria-hidden": "true", children: line.type === "points" ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(PointsSnapIndicator, { ...line, zoom }) : line.type === "gaps" ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(GapsSnapIndicator, { ...line, zoom }) : null });
-}
-//# sourceMappingURL=DefaultSnapIndictor.js.map

package/dist-cjs/lib/components/default-components/DefaultSnapIndictor.js.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../../../src/lib/components/default-components/DefaultSnapIndictor.tsx"],
-  "sourcesContent": ["import classNames from 'classnames'\nimport * as React from 'react'\nimport {\n\ttype GapsSnapIndicator,\n\ttype PointsSnapIndicator,\n\ttype SnapIndicator,\n} from '../../editor/managers/SnapManager/SnapManager'\nimport { rangeIntersection } from '../../primitives/utils'\n\nfunction PointsSnapIndicator({ points, zoom }: { zoom: number } & PointsSnapIndicator) {\n\tconst l = 2.5 / zoom\n\n\tconst minX = points.reduce((acc, p) => Math.min(acc, p.x), Infinity)\n\tconst maxX = points.reduce((acc, p) => Math.max(acc, p.x), -Infinity)\n\tconst minY = points.reduce((acc, p) => Math.min(acc, p.y), Infinity)\n\tconst maxY = points.reduce((acc, p) => Math.max(acc, p.y), -Infinity)\n\n\tconst useNWtoSEdireciton = points.some((p) => p.x === minX && p.y === minY)\n\tlet firstX: number, firstY: number, secondX: number, secondY: number\n\tif (useNWtoSEdireciton) {\n\t\tfirstX = minX\n\t\tfirstY = minY\n\t\tsecondX = maxX\n\t\tsecondY = maxY\n\t} else {\n\t\tfirstX = minX\n\t\tfirstY = maxY\n\t\tsecondX = maxX\n\t\tsecondY = minY\n\t}\n\n\treturn (\n\t\t<g className=\"tl-snap-indicator\" stroke=\"lime\">\n\t\t\t<line x1={firstX} y1={firstY} x2={secondX} y2={secondY} />\n\t\t\t{points.map((p, i) => (\n\t\t\t\t<g transform={`translate(${p.x},${p.y})`} key={i}>\n\t\t\t\t\t<path\n\t\t\t\t\t\tclassName=\"tl-snap-point\"\n\t\t\t\t\t\td={`M ${-l},${-l} L ${l},${l} M ${-l},${l} L ${l},${-l}`}\n\t\t\t\t\t/>\n\t\t\t\t</g>\n\t\t\t))}\n\t\t</g>\n\t)\n}\n\nfunction GapsSnapIndicator({ gaps, direction, zoom }: { zoom: number } & GapsSnapIndicator) {\n\tconst l = 3.5 / zoom\n\n\tlet edgeIntersection: number[] | null = [-Infinity, +Infinity]\n\tlet nextEdgeIntersection: number[] | null = null\n\n\tconst horizontal = direction === 'horizontal'\n\n\t// find intersection of all gaps so we can render a straight line through it;\n\t// some range intersections may return null, in which case we skip that gap.\n\tfor (const gap of gaps) {\n\t\tnextEdgeIntersection = rangeIntersection(\n\t\t\tedgeIntersection[0],\n\t\t\tedgeIntersection[1],\n\t\t\thorizontal ? gap.startEdge[0].y : gap.startEdge[0].x,\n\t\t\thorizontal ? gap.startEdge[1].y : gap.startEdge[1].x\n\t\t)\n\n\t\tif (nextEdgeIntersection) {\n\t\t\tedgeIntersection = nextEdgeIntersection\n\t\t} else {\n\t\t\tcontinue\n\t\t}\n\n\t\tnextEdgeIntersection = rangeIntersection(\n\t\t\tedgeIntersection[0],\n\t\t\tedgeIntersection[1],\n\t\t\thorizontal ? gap.endEdge[0].y : gap.endEdge[0].x,\n\t\t\thorizontal ? gap.endEdge[1].y : gap.endEdge[1].x\n\t\t)\n\n\t\tif (nextEdgeIntersection) {\n\t\t\tedgeIntersection = nextEdgeIntersection\n\t\t} else {\n\t\t\tcontinue\n\t\t}\n\t}\n\n\tif (edgeIntersection === null) {\n\t\treturn null\n\t}\n\n\tconst midPoint = (edgeIntersection[0] + edgeIntersection[1]) / 2\n\n\treturn (\n\t\t<g className=\"tl-snap-indicator\" stroke=\"cyan\">\n\t\t\t{gaps.map(({ startEdge, endEdge }, i) => (\n\t\t\t\t<React.Fragment key={i}>\n\t\t\t\t\t{horizontal ? (\n\t\t\t\t\t\t// horizontal gap\n\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t{/* start edge */}\n\t\t\t\t\t\t\t<line\n\t\t\t\t\t\t\t\tx1={startEdge[0].x}\n\t\t\t\t\t\t\t\ty1={midPoint - 2 * l}\n\t\t\t\t\t\t\t\tx2={startEdge[1].x}\n\t\t\t\t\t\t\t\ty2={midPoint + 2 * l}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t{/* end edge */}\n\t\t\t\t\t\t\t<line\n\t\t\t\t\t\t\t\tx1={endEdge[0].x}\n\t\t\t\t\t\t\t\ty1={midPoint - 2 * l}\n\t\t\t\t\t\t\t\tx2={endEdge[1].x}\n\t\t\t\t\t\t\t\ty2={midPoint + 2 * l}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t{/* joining line */}\n\t\t\t\t\t\t\t<line x1={startEdge[0].x} y1={midPoint} x2={endEdge[0].x} y2={midPoint} />\n\t\t\t\t\t\t\t{/* center point marker */}\n\t\t\t\t\t\t\t<line\n\t\t\t\t\t\t\t\tx1={(startEdge[0].x + endEdge[0].x) / 2}\n\t\t\t\t\t\t\t\ty1={midPoint - l}\n\t\t\t\t\t\t\t\tx2={(startEdge[0].x + endEdge[0].x) / 2}\n\t\t\t\t\t\t\t\ty2={midPoint + l}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</>\n\t\t\t\t\t) : (\n\t\t\t\t\t\t// vertical gap\n\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t{/* start edge */}\n\t\t\t\t\t\t\t<line\n\t\t\t\t\t\t\t\tx1={midPoint - 2 * l}\n\t\t\t\t\t\t\t\ty1={startEdge[0].y}\n\t\t\t\t\t\t\t\tx2={midPoint + 2 * l}\n\t\t\t\t\t\t\t\ty2={startEdge[1].y}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t{/* end edge */}\n\t\t\t\t\t\t\t<line\n\t\t\t\t\t\t\t\tx1={midPoint - 2 * l}\n\t\t\t\t\t\t\t\ty1={endEdge[0].y}\n\t\t\t\t\t\t\t\tx2={midPoint + 2 * l}\n\t\t\t\t\t\t\t\ty2={endEdge[1].y}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t{/* joining line */}\n\t\t\t\t\t\t\t<line x1={midPoint} y1={startEdge[0].y} x2={midPoint} y2={endEdge[0].y} />\n\t\t\t\t\t\t\t{/* center point marker */}\n\t\t\t\t\t\t\t<line\n\t\t\t\t\t\t\t\tx1={midPoint - l}\n\t\t\t\t\t\t\t\ty1={(startEdge[0].y + endEdge[0].y) / 2}\n\t\t\t\t\t\t\t\tx2={midPoint + l}\n\t\t\t\t\t\t\t\ty2={(startEdge[0].y + endEdge[0].y) / 2}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</>\n\t\t\t\t\t)}\n\t\t\t\t</React.Fragment>\n\t\t\t))}\n\t\t</g>\n\t)\n}\n\n/** @public */\nexport interface TLSnapIndicatorProps {\n\tclassName?: string\n\tline: SnapIndicator\n\tzoom: number\n}\n\n/** @public @react */\nexport function DefaultSnapIndicator({ className, line, zoom }: TLSnapIndicatorProps) {\n\treturn (\n\t\t<svg className={classNames('tl-overlays__item', className)} aria-hidden=\"true\">\n\t\t\t{line.type === 'points' ? (\n\t\t\t\t<PointsSnapIndicator {...line} zoom={zoom} />\n\t\t\t) : line.type === 'gaps' ? (\n\t\t\t\t<GapsSnapIndicator {...line} zoom={zoom} />\n\t\t\t) : null}\n\t\t</svg>\n\t)\n}\n"],
-  "mappings": "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",
-  "names": ["classNames"]
-}

package/dist-cjs/lib/hooks/useHandleEvents.js

@@ -1,100 +0,0 @@
-"use strict";
-var __create = Object.create;
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getProtoOf = Object.getPrototypeOf;
-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 __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
-  // If the importer is in node compatibility mode or this is not an ESM
-  // file that has been converted to a CommonJS file using a Babel-
-  // compatible transform (i.e. "__esModule" has not been set), then set
-  // "default" to the CommonJS "module.exports" for node compatibility.
-  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
-  mod
-));
-var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-var useHandleEvents_exports = {};
-__export(useHandleEvents_exports, {
-  useHandleEvents: () => useHandleEvents
-});
-module.exports = __toCommonJS(useHandleEvents_exports);
-var React = __toESM(require("react"), 1);
-var import_dom = require("../utils/dom");
-var import_getPointerInfo = require("../utils/getPointerInfo");
-var import_useEditor = require("./useEditor");
-function getHandle(editor, id, handleId) {
-  const shape = editor.getShape(id);
-  const handles = editor.getShapeHandles(shape);
-  return { shape, handle: handles.find((h) => h.id === handleId) };
-}
-function useHandleEvents(id, handleId) {
-  const editor = (0, import_useEditor.useEditor)();
-  return React.useMemo(() => {
-    const onPointerDown = (e) => {
-      if (editor.wasEventAlreadyHandled(e)) return;
-      const target = (0, import_dom.loopToHtmlElement)(e.currentTarget);
-      (0, import_dom.setPointerCapture)(target, e);
-      const { shape, handle } = getHandle(editor, id, handleId);
-      if (!handle) return;
-      editor.dispatch({
-        type: "pointer",
-        target: "handle",
-        handle,
-        shape,
-        name: "pointer_down",
-        ...(0, import_getPointerInfo.getPointerInfo)(editor, e)
-      });
-    };
-    let lastX, lastY;
-    const onPointerMove = (e) => {
-      if (editor.wasEventAlreadyHandled(e)) return;
-      if (e.clientX === lastX && e.clientY === lastY) return;
-      lastX = e.clientX;
-      lastY = e.clientY;
-      const { shape, handle } = getHandle(editor, id, handleId);
-      if (!handle) return;
-      editor.dispatch({
-        type: "pointer",
-        target: "handle",
-        handle,
-        shape,
-        name: "pointer_move",
-        ...(0, import_getPointerInfo.getPointerInfo)(editor, e)
-      });
-    };
-    const onPointerUp = (e) => {
-      if (editor.wasEventAlreadyHandled(e)) return;
-      const target = (0, import_dom.loopToHtmlElement)(e.currentTarget);
-      (0, import_dom.releasePointerCapture)(target, e);
-      const { shape, handle } = getHandle(editor, id, handleId);
-      if (!handle) return;
-      editor.dispatch({
-        type: "pointer",
-        target: "handle",
-        handle,
-        shape,
-        name: "pointer_up",
-        ...(0, import_getPointerInfo.getPointerInfo)(editor, e)
-      });
-    };
-    return {
-      onPointerDown,
-      onPointerMove,
-      onPointerUp
-    };
-  }, [editor, id, handleId]);
-}
-//# sourceMappingURL=useHandleEvents.js.map

package/dist-cjs/lib/hooks/useHandleEvents.js.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../../src/lib/hooks/useHandleEvents.ts"],
-  "sourcesContent": ["import { TLArrowShape, TLLineShape, TLShapeId } from '@tldraw/tlschema'\nimport * as React from 'react'\nimport { Editor } from '../editor/Editor'\nimport { loopToHtmlElement, releasePointerCapture, setPointerCapture } from '../utils/dom'\nimport { getPointerInfo } from '../utils/getPointerInfo'\nimport { useEditor } from './useEditor'\n\nfunction getHandle(editor: Editor, id: TLShapeId, handleId: string) {\n\tconst shape = editor.getShape<TLArrowShape | TLLineShape>(id)!\n\tconst handles = editor.getShapeHandles(shape)!\n\treturn { shape, handle: handles.find((h) => h.id === handleId) }\n}\n\nexport function useHandleEvents(id: TLShapeId, handleId: string) {\n\tconst editor = useEditor()\n\n\treturn React.useMemo(() => {\n\t\tconst onPointerDown = (e: React.PointerEvent) => {\n\t\t\tif (editor.wasEventAlreadyHandled(e)) return\n\n\t\t\t// Must set pointer capture on an HTML element!\n\t\t\tconst target = loopToHtmlElement(e.currentTarget)\n\t\t\tsetPointerCapture(target, e)\n\n\t\t\tconst { shape, handle } = getHandle(editor, id, handleId)\n\n\t\t\tif (!handle) return\n\n\t\t\teditor.dispatch({\n\t\t\t\ttype: 'pointer',\n\t\t\t\ttarget: 'handle',\n\t\t\t\thandle,\n\t\t\t\tshape,\n\t\t\t\tname: 'pointer_down',\n\t\t\t\t...getPointerInfo(editor, e),\n\t\t\t})\n\t\t}\n\n\t\t// Track the last screen point\n\t\tlet lastX: number, lastY: number\n\n\t\tconst onPointerMove = (e: React.PointerEvent) => {\n\t\t\tif (editor.wasEventAlreadyHandled(e)) return\n\t\t\tif (e.clientX === lastX && e.clientY === lastY) return\n\t\t\tlastX = e.clientX\n\t\t\tlastY = e.clientY\n\n\t\t\tconst { shape, handle } = getHandle(editor, id, handleId)\n\n\t\t\tif (!handle) return\n\n\t\t\teditor.dispatch({\n\t\t\t\ttype: 'pointer',\n\t\t\t\ttarget: 'handle',\n\t\t\t\thandle,\n\t\t\t\tshape,\n\t\t\t\tname: 'pointer_move',\n\t\t\t\t...getPointerInfo(editor, e),\n\t\t\t})\n\t\t}\n\n\t\tconst onPointerUp = (e: React.PointerEvent) => {\n\t\t\tif (editor.wasEventAlreadyHandled(e)) return\n\n\t\t\tconst target = loopToHtmlElement(e.currentTarget)\n\t\t\treleasePointerCapture(target, e)\n\n\t\t\tconst { shape, handle } = getHandle(editor, id, handleId)\n\n\t\t\tif (!handle) return\n\n\t\t\teditor.dispatch({\n\t\t\t\ttype: 'pointer',\n\t\t\t\ttarget: 'handle',\n\t\t\t\thandle,\n\t\t\t\tshape,\n\t\t\t\tname: 'pointer_up',\n\t\t\t\t...getPointerInfo(editor, e),\n\t\t\t})\n\t\t}\n\n\t\treturn {\n\t\t\tonPointerDown,\n\t\t\tonPointerMove,\n\t\t\tonPointerUp,\n\t\t}\n\t}, [editor, id, handleId])\n}\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AACA,YAAuB;AAEvB,iBAA4E;AAC5E,4BAA+B;AAC/B,uBAA0B;AAE1B,SAAS,UAAU,QAAgB,IAAe,UAAkB;AACnE,QAAM,QAAQ,OAAO,SAAqC,EAAE;AAC5D,QAAM,UAAU,OAAO,gBAAgB,KAAK;AAC5C,SAAO,EAAE,OAAO,QAAQ,QAAQ,KAAK,CAAC,MAAM,EAAE,OAAO,QAAQ,EAAE;AAChE;AAEO,SAAS,gBAAgB,IAAe,UAAkB;AAChE,QAAM,aAAS,4BAAU;AAEzB,SAAO,MAAM,QAAQ,MAAM;AAC1B,UAAM,gBAAgB,CAAC,MAA0B;AAChD,UAAI,OAAO,uBAAuB,CAAC,EAAG;AAGtC,YAAM,aAAS,8BAAkB,EAAE,aAAa;AAChD,wCAAkB,QAAQ,CAAC;AAE3B,YAAM,EAAE,OAAO,OAAO,IAAI,UAAU,QAAQ,IAAI,QAAQ;AAExD,UAAI,CAAC,OAAQ;AAEb,aAAO,SAAS;AAAA,QACf,MAAM;AAAA,QACN,QAAQ;AAAA,QACR;AAAA,QACA;AAAA,QACA,MAAM;AAAA,QACN,OAAG,sCAAe,QAAQ,CAAC;AAAA,MAC5B,CAAC;AAAA,IACF;AAGA,QAAI,OAAe;AAEnB,UAAM,gBAAgB,CAAC,MAA0B;AAChD,UAAI,OAAO,uBAAuB,CAAC,EAAG;AACtC,UAAI,EAAE,YAAY,SAAS,EAAE,YAAY,MAAO;AAChD,cAAQ,EAAE;AACV,cAAQ,EAAE;AAEV,YAAM,EAAE,OAAO,OAAO,IAAI,UAAU,QAAQ,IAAI,QAAQ;AAExD,UAAI,CAAC,OAAQ;AAEb,aAAO,SAAS;AAAA,QACf,MAAM;AAAA,QACN,QAAQ;AAAA,QACR;AAAA,QACA;AAAA,QACA,MAAM;AAAA,QACN,OAAG,sCAAe,QAAQ,CAAC;AAAA,MAC5B,CAAC;AAAA,IACF;AAEA,UAAM,cAAc,CAAC,MAA0B;AAC9C,UAAI,OAAO,uBAAuB,CAAC,EAAG;AAEtC,YAAM,aAAS,8BAAkB,EAAE,aAAa;AAChD,4CAAsB,QAAQ,CAAC;AAE/B,YAAM,EAAE,OAAO,OAAO,IAAI,UAAU,QAAQ,IAAI,QAAQ;AAExD,UAAI,CAAC,OAAQ;AAEb,aAAO,SAAS;AAAA,QACf,MAAM;AAAA,QACN,QAAQ;AAAA,QACR;AAAA,QACA;AAAA,QACA,MAAM;AAAA,QACN,OAAG,sCAAe,QAAQ,CAAC;AAAA,MAC5B,CAAC;AAAA,IACF;AAEA,WAAO;AAAA,MACN;AAAA,MACA;AAAA,MACA;AAAA,IACD;AAAA,EACD,GAAG,CAAC,QAAQ,IAAI,QAAQ,CAAC;AAC1B;",
-  "names": []
-}

package/dist-cjs/lib/hooks/useSelectionEvents.js

@@ -1,98 +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 useSelectionEvents_exports = {};
-__export(useSelectionEvents_exports, {
-  useSelectionEvents: () => useSelectionEvents
-});
-module.exports = __toCommonJS(useSelectionEvents_exports);
-var import_react = require("react");
-var import_constants = require("../constants");
-var import_dom = require("../utils/dom");
-var import_getPointerInfo = require("../utils/getPointerInfo");
-var import_useEditor = require("./useEditor");
-function useSelectionEvents(handle) {
-  const editor = (0, import_useEditor.useEditor)();
-  const events = (0, import_react.useMemo)(
-    function selectionEvents() {
-      const onPointerDown = (e) => {
-        if (editor.wasEventAlreadyHandled(e)) return;
-        if (e.button === import_constants.RIGHT_MOUSE_BUTTON) {
-          editor.dispatch({
-            type: "pointer",
-            target: "selection",
-            handle,
-            name: "right_click",
-            ...(0, import_getPointerInfo.getPointerInfo)(editor, e)
-          });
-          return;
-        }
-        if (e.button !== 0) return;
-        const elm = (0, import_dom.loopToHtmlElement)(e.currentTarget);
-        function releaseCapture() {
-          elm.removeEventListener("pointerup", releaseCapture);
-          (0, import_dom.releasePointerCapture)(elm, e);
-        }
-        (0, import_dom.setPointerCapture)(elm, e);
-        elm.addEventListener("pointerup", releaseCapture);
-        editor.dispatch({
-          name: "pointer_down",
-          type: "pointer",
-          target: "selection",
-          handle,
-          ...(0, import_getPointerInfo.getPointerInfo)(editor, e)
-        });
-        editor.markEventAsHandled(e);
-      };
-      let lastX, lastY;
-      function onPointerMove(e) {
-        if (editor.wasEventAlreadyHandled(e)) return;
-        if (e.button !== 0) return;
-        if (e.clientX === lastX && e.clientY === lastY) return;
-        lastX = e.clientX;
-        lastY = e.clientY;
-        editor.dispatch({
-          name: "pointer_move",
-          type: "pointer",
-          target: "selection",
-          handle,
-          ...(0, import_getPointerInfo.getPointerInfo)(editor, e)
-        });
-      }
-      const onPointerUp = (e) => {
-        if (editor.wasEventAlreadyHandled(e)) return;
-        if (e.button !== 0) return;
-        editor.dispatch({
-          name: "pointer_up",
-          type: "pointer",
-          target: "selection",
-          handle,
-          ...(0, import_getPointerInfo.getPointerInfo)(editor, e)
-        });
-      };
-      return {
-        onPointerDown,
-        onPointerMove,
-        onPointerUp
-      };
-    },
-    [editor, handle]
-  );
-  return events;
-}
-//# sourceMappingURL=useSelectionEvents.js.map

package/dist-cjs/lib/hooks/useSelectionEvents.js.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../../src/lib/hooks/useSelectionEvents.ts"],
-  "sourcesContent": ["import { useMemo } from 'react'\nimport { RIGHT_MOUSE_BUTTON } from '../constants'\nimport { TLSelectionHandle } from '../editor/types/selection-types'\nimport { loopToHtmlElement, releasePointerCapture, setPointerCapture } from '../utils/dom'\nimport { getPointerInfo } from '../utils/getPointerInfo'\nimport { useEditor } from './useEditor'\n\n/** @public */\nexport function useSelectionEvents(handle: TLSelectionHandle) {\n\tconst editor = useEditor()\n\n\tconst events = useMemo(\n\t\tfunction selectionEvents() {\n\t\t\tconst onPointerDown: React.PointerEventHandler = (e) => {\n\t\t\t\tif (editor.wasEventAlreadyHandled(e)) return\n\n\t\t\t\tif (e.button === RIGHT_MOUSE_BUTTON) {\n\t\t\t\t\teditor.dispatch({\n\t\t\t\t\t\ttype: 'pointer',\n\t\t\t\t\t\ttarget: 'selection',\n\t\t\t\t\t\thandle,\n\t\t\t\t\t\tname: 'right_click',\n\t\t\t\t\t\t...getPointerInfo(editor, e),\n\t\t\t\t\t})\n\t\t\t\t\treturn\n\t\t\t\t}\n\n\t\t\t\tif (e.button !== 0) return\n\n\t\t\t\t// Because the events are probably set on SVG elements,\n\t\t\t\t// we need to instead place pointer capture on the first HTML\n\t\t\t\t// element above the event's target; and set a listener to\n\t\t\t\t// remove pointer capture when the pointer is released.\n\n\t\t\t\tconst elm = loopToHtmlElement(e.currentTarget)\n\n\t\t\t\tfunction releaseCapture() {\n\t\t\t\t\telm.removeEventListener('pointerup', releaseCapture)\n\t\t\t\t\treleasePointerCapture(elm, e)\n\t\t\t\t}\n\n\t\t\t\tsetPointerCapture(elm, e)\n\t\t\t\telm.addEventListener('pointerup', releaseCapture)\n\n\t\t\t\teditor.dispatch({\n\t\t\t\t\tname: 'pointer_down',\n\t\t\t\t\ttype: 'pointer',\n\t\t\t\t\ttarget: 'selection',\n\t\t\t\t\thandle,\n\t\t\t\t\t...getPointerInfo(editor, e),\n\t\t\t\t})\n\t\t\t\teditor.markEventAsHandled(e)\n\t\t\t}\n\n\t\t\t// Track the last screen point\n\t\t\tlet lastX: number, lastY: number\n\n\t\t\tfunction onPointerMove(e: React.PointerEvent) {\n\t\t\t\tif (editor.wasEventAlreadyHandled(e)) return\n\t\t\t\tif (e.button !== 0) return\n\t\t\t\tif (e.clientX === lastX && e.clientY === lastY) return\n\t\t\t\tlastX = e.clientX\n\t\t\t\tlastY = e.clientY\n\n\t\t\t\teditor.dispatch({\n\t\t\t\t\tname: 'pointer_move',\n\t\t\t\t\ttype: 'pointer',\n\t\t\t\t\ttarget: 'selection',\n\t\t\t\t\thandle,\n\t\t\t\t\t...getPointerInfo(editor, e),\n\t\t\t\t})\n\t\t\t}\n\n\t\t\tconst onPointerUp: React.PointerEventHandler = (e) => {\n\t\t\t\tif (editor.wasEventAlreadyHandled(e)) return\n\t\t\t\tif (e.button !== 0) return\n\n\t\t\t\teditor.dispatch({\n\t\t\t\t\tname: 'pointer_up',\n\t\t\t\t\ttype: 'pointer',\n\t\t\t\t\ttarget: 'selection',\n\t\t\t\t\thandle,\n\t\t\t\t\t...getPointerInfo(editor, e),\n\t\t\t\t})\n\t\t\t}\n\n\t\t\treturn {\n\t\t\t\tonPointerDown,\n\t\t\t\tonPointerMove,\n\t\t\t\tonPointerUp,\n\t\t\t}\n\t\t},\n\t\t[editor, handle]\n\t)\n\n\treturn events\n}\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mBAAwB;AACxB,uBAAmC;AAEnC,iBAA4E;AAC5E,4BAA+B;AAC/B,uBAA0B;AAGnB,SAAS,mBAAmB,QAA2B;AAC7D,QAAM,aAAS,4BAAU;AAEzB,QAAM,aAAS;AAAA,IACd,SAAS,kBAAkB;AAC1B,YAAM,gBAA2C,CAAC,MAAM;AACvD,YAAI,OAAO,uBAAuB,CAAC,EAAG;AAEtC,YAAI,EAAE,WAAW,qCAAoB;AACpC,iBAAO,SAAS;AAAA,YACf,MAAM;AAAA,YACN,QAAQ;AAAA,YACR;AAAA,YACA,MAAM;AAAA,YACN,OAAG,sCAAe,QAAQ,CAAC;AAAA,UAC5B,CAAC;AACD;AAAA,QACD;AAEA,YAAI,EAAE,WAAW,EAAG;AAOpB,cAAM,UAAM,8BAAkB,EAAE,aAAa;AAE7C,iBAAS,iBAAiB;AACzB,cAAI,oBAAoB,aAAa,cAAc;AACnD,gDAAsB,KAAK,CAAC;AAAA,QAC7B;AAEA,0CAAkB,KAAK,CAAC;AACxB,YAAI,iBAAiB,aAAa,cAAc;AAEhD,eAAO,SAAS;AAAA,UACf,MAAM;AAAA,UACN,MAAM;AAAA,UACN,QAAQ;AAAA,UACR;AAAA,UACA,OAAG,sCAAe,QAAQ,CAAC;AAAA,QAC5B,CAAC;AACD,eAAO,mBAAmB,CAAC;AAAA,MAC5B;AAGA,UAAI,OAAe;AAEnB,eAAS,cAAc,GAAuB;AAC7C,YAAI,OAAO,uBAAuB,CAAC,EAAG;AACtC,YAAI,EAAE,WAAW,EAAG;AACpB,YAAI,EAAE,YAAY,SAAS,EAAE,YAAY,MAAO;AAChD,gBAAQ,EAAE;AACV,gBAAQ,EAAE;AAEV,eAAO,SAAS;AAAA,UACf,MAAM;AAAA,UACN,MAAM;AAAA,UACN,QAAQ;AAAA,UACR;AAAA,UACA,OAAG,sCAAe,QAAQ,CAAC;AAAA,QAC5B,CAAC;AAAA,MACF;AAEA,YAAM,cAAyC,CAAC,MAAM;AACrD,YAAI,OAAO,uBAAuB,CAAC,EAAG;AACtC,YAAI,EAAE,WAAW,EAAG;AAEpB,eAAO,SAAS;AAAA,UACf,MAAM;AAAA,UACN,MAAM;AAAA,UACN,QAAQ;AAAA,UACR;AAAA,UACA,OAAG,sCAAe,QAAQ,CAAC;AAAA,QAC5B,CAAC;AAAA,MACF;AAEA,aAAO;AAAA,QACN;AAAA,QACA;AAAA,QACA;AAAA,MACD;AAAA,IACD;AAAA,IACA,CAAC,QAAQ,MAAM;AAAA,EAChB;AAEA,SAAO;AACR;",
-  "names": []
-}

package/dist-esm/lib/components/GeometryDebuggingView.mjs

@@ -1,95 +0,0 @@
-import { jsx, jsxs } from "react/jsx-runtime";
-import { track } from "@tldraw/state-react";
-import { modulate } from "@tldraw/utils";
-import { useEditor } from "../hooks/useEditor.mjs";
-import { Group2d } from "../primitives/geometry/Group2d.mjs";
-const GeometryDebuggingView = track(function GeometryDebuggingView2({
-  showStroke = true,
-  showVertices = true,
-  showClosestPointOnOutline = true
-}) {
-  const editor = useEditor();
-  const zoomLevel = editor.getZoomLevel();
-  const renderingShapes = editor.getRenderingShapes();
-  const currentPagePoint = editor.inputs.getCurrentPagePoint();
-  return /* @__PURE__ */ jsx(
-    "svg",
-    {
-      style: {
-        position: "absolute",
-        pointerEvents: "none",
-        zIndex: 999999999,
-        top: 0,
-        left: 0,
-        overflow: "visible"
-      },
-      children: renderingShapes.map((result) => {
-        const shape = editor.getShape(result.id);
-        if (shape.type === "group") return null;
-        const geometry = editor.getShapeGeometry(shape);
-        const pageTransform = editor.getShapePageTransform(shape);
-        const pointInShapeSpace = editor.getPointInShapeSpace(shape, currentPagePoint);
-        const nearestPointOnShape = geometry.nearestPoint(pointInShapeSpace);
-        const distanceToPoint = geometry.distanceToPoint(pointInShapeSpace, true);
-        const dist = Math.abs(distanceToPoint) * zoomLevel;
-        const hitInside = distanceToPoint < 0;
-        const { vertices } = geometry;
-        return /* @__PURE__ */ jsxs(
-          "g",
-          {
-            transform: pageTransform.toCssString(),
-            strokeLinecap: "round",
-            strokeLinejoin: "round",
-            children: [
-              showStroke && /* @__PURE__ */ jsx(
-                "g",
-                {
-                  stroke: geometry.debugColor ?? "red",
-                  opacity: "1",
-                  strokeWidth: 2 / zoomLevel,
-                  fill: "none",
-                  children: /* @__PURE__ */ jsx(GeometryStroke, { geometry })
-                }
-              ),
-              showVertices && vertices.map((v, i) => /* @__PURE__ */ jsx(
-                "circle",
-                {
-                  cx: v.x,
-                  cy: v.y,
-                  r: 2 / zoomLevel,
-                  fill: `hsl(${modulate(i, [0, vertices.length - 1], [120, 200])}, 100%, 50%)`,
-                  stroke: "black",
-                  strokeWidth: 1 / zoomLevel
-                },
-                `v${i}`
-              )),
-              showClosestPointOnOutline && dist < 150 && /* @__PURE__ */ jsx(
-                "line",
-                {
-                  x1: nearestPointOnShape.x,
-                  y1: nearestPointOnShape.y,
-                  x2: pointInShapeSpace.x,
-                  y2: pointInShapeSpace.y,
-                  opacity: 1 - dist / 150,
-                  stroke: hitInside ? "goldenrod" : "dodgerblue",
-                  strokeWidth: 2 / zoomLevel
-                }
-              )
-            ]
-          },
-          result.id + "_outline"
-        );
-      })
-    }
-  );
-});
-function GeometryStroke({ geometry }) {
-  if (geometry instanceof Group2d) {
-    return /* @__PURE__ */ jsx("g", { stroke: geometry.debugColor, children: [...geometry.children, ...geometry.ignoredChildren].map((child, i) => /* @__PURE__ */ jsx(GeometryStroke, { geometry: child }, i)) });
-  }
-  return /* @__PURE__ */ jsx("path", { d: geometry.toSimpleSvgPath(), stroke: geometry.debugColor });
-}
-export {
-  GeometryDebuggingView
-};
-//# sourceMappingURL=GeometryDebuggingView.mjs.map