@tldraw/editor 4.1.0-canary.4f9226a36e7e → 4.1.0-canary.533dd6427b33

package/dist-cjs/index.d.ts

@@ -4432,6 +4432,7 @@ export declare class HandleSnaps {
     private iterateSnapPointsInPageSpace;
     private iterateSnapOutlines;
     private getHandleSnapPosition;
+    private getHandleSnapData;
     snapHandle({ currentShapeId, handle, }: {
         currentShapeId: TLShapeId;
         handle: TLHandle;

package/dist-cjs/index.js

@@ -369,7 +369,7 @@ var import_uniq = require("./lib/utils/uniq");
 var import_window_open = require("./lib/utils/window-open");
 (0, import_utils.registerTldrawLibraryVersion)(
   "@tldraw/editor",
-  "4.1.0-canary.4f9226a36e7e",
+  "4.1.0-canary.533dd6427b33",
   "cjs"
 );
 //# sourceMappingURL=index.js.map

package/dist-cjs/lib/components/MenuClickCapture.js

@@ -27,6 +27,7 @@ var import_react = require("react");
 var import_useCanvasEvents = require("../hooks/useCanvasEvents");
 var import_useEditor = require("../hooks/useEditor");
 var import_Vec = require("../primitives/Vec");
+var import_getPointerInfo = require("../utils/getPointerInfo");
 function MenuClickCapture() {
   const editor = (0, import_useEditor.useEditor)();
   const isMenuOpen = (0, import_state_react.useValue)("is menu open", () => editor.menus.hasAnyOpenMenus(), [editor]);
@@ -47,29 +48,42 @@ function MenuClickCapture() {
           isDragging: false,
           start: new import_Vec.Vec(e.clientX, e.clientY)
         };
+        rDidAPointerDownAndDragWhileMenuWasOpen.current = false;
       }
       editor.menus.clearOpenMenus();
     },
     [editor]
   );
+  const rDidAPointerDownAndDragWhileMenuWasOpen = (0, import_react.useRef)(false);
   const handlePointerMove = (0, import_react.useCallback)(
     (e) => {
       if (!rPointerState.current.isDown) return;
-      if (
-        // We're pointing, but are we dragging?
-        import_Vec.Vec.Dist2(rPointerState.current.start, new import_Vec.Vec(e.clientX, e.clientY)) > editor.options.dragDistanceSquared
-      ) {
-        rPointerState.current = {
-          ...rPointerState.current,
-          isDown: true,
-          isDragging: true
-        };
-        const { x, y } = rPointerState.current.start;
-        canvasEvents.onPointerDown?.({
-          ...e,
-          clientX: x,
-          clientY: y,
-          button: 0
+      const { x, y } = rPointerState.current.start;
+      if (!rDidAPointerDownAndDragWhileMenuWasOpen.current) {
+        if (
+          // We're pointing, but are we dragging?
+          import_Vec.Vec.Dist2(rPointerState.current.start, new import_Vec.Vec(e.clientX, e.clientY)) > editor.options.dragDistanceSquared
+        ) {
+          rDidAPointerDownAndDragWhileMenuWasOpen.current = true;
+          rPointerState.current = {
+            ...rPointerState.current,
+            isDown: true,
+            isDragging: true
+          };
+          canvasEvents.onPointerDown?.({
+            ...e,
+            clientX: x,
+            clientY: y,
+            button: 0
+          });
+        }
+      }
+      if (rDidAPointerDownAndDragWhileMenuWasOpen.current) {
+        editor.dispatch({
+          type: "pointer",
+          target: "canvas",
+          name: "pointer_move",
+          ...(0, import_getPointerInfo.getPointerInfo)(editor, e)
         });
       }
     },
@@ -84,6 +98,7 @@ function MenuClickCapture() {
         isDragging: false,
         start: new import_Vec.Vec(e.clientX, e.clientY)
       };
+      rDidAPointerDownAndDragWhileMenuWasOpen.current = false;
     },
     [canvasEvents]
   );

package/dist-cjs/lib/components/MenuClickCapture.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/lib/components/MenuClickCapture.tsx"],
-  "sourcesContent": ["import { useValue } from '@tldraw/state-react'\nimport { PointerEvent, useCallback, useRef, useState } from 'react'\nimport { useCanvasEvents } from '../hooks/useCanvasEvents'\nimport { useEditor } from '../hooks/useEditor'\nimport { Vec } from '../primitives/Vec'\n\n/**\n * When a menu is open, this component prevents the user from interacting with the canvas.\n *\n * @public @react\n */\nexport function MenuClickCapture() {\n\tconst editor = useEditor()\n\n\t// Whether any menus are open\n\tconst isMenuOpen = useValue('is menu open', () => editor.menus.hasAnyOpenMenus(), [editor])\n\n\t// Whether we're pointing or not\u2014keep this component visible if we're pointing\n\tconst [isPointing, setIsPointing] = useState(false)\n\n\tconst showElement = isMenuOpen || isPointing\n\n\t// Get the same events that we use on the canvas\n\tconst canvasEvents = useCanvasEvents()\n\n\t// Keep track of the pointer state\n\tconst rPointerState = useRef({\n\t\tisDown: false,\n\t\tisDragging: false,\n\t\tstart: new Vec(),\n\t})\n\n\tconst handlePointerDown = useCallback(\n\t\t(e: PointerEvent) => {\n\t\t\tif (e.button === 0) {\n\t\t\t\tsetIsPointing(true)\n\t\t\t\trPointerState.current = {\n\t\t\t\t\tisDown: true,\n\t\t\t\t\tisDragging: false,\n\t\t\t\t\tstart: new Vec(e.clientX, e.clientY),\n\t\t\t\t}\n\t\t\t}\n\t\t\teditor.menus.clearOpenMenus()\n\t\t},\n\t\t[editor]\n\t)\n\n\tconst handlePointerMove = useCallback(\n\t\t(e: PointerEvent) => {\n\t\t\t// Do nothing unless we're pointing\n\t\t\tif (!rPointerState.current.isDown) return\n\n\t\t\tif (\n\t\t\t\t// We're pointing, but are we dragging?\n\t\t\t\tVec.Dist2(rPointerState.current.start, new Vec(e.clientX, e.clientY)) >\n\t\t\t\teditor.options.dragDistanceSquared\n\t\t\t) {\n\t\t\t\t// Wehaddaeventitsadrag\n\t\t\t\trPointerState.current = {\n\t\t\t\t\t...rPointerState.current,\n\t\t\t\t\tisDown: true,\n\t\t\t\t\tisDragging: true,\n\t\t\t\t}\n\t\t\t\t// call the onPointerDown with the original pointer position\n\t\t\t\tconst { x, y } = rPointerState.current.start\n\t\t\t\tcanvasEvents.onPointerDown?.({\n\t\t\t\t\t...e,\n\t\t\t\t\tclientX: x,\n\t\t\t\t\tclientY: y,\n\t\t\t\t\tbutton: 0,\n\t\t\t\t})\n\t\t\t}\n\t\t},\n\t\t[canvasEvents, editor]\n\t)\n\n\tconst handlePointerUp = useCallback(\n\t\t(e: PointerEvent) => {\n\t\t\t// Run the pointer up\n\t\t\tcanvasEvents.onPointerUp?.(e)\n\t\t\t// Then turn off pointing\n\t\t\tsetIsPointing(false)\n\t\t\t// Reset the pointer state\n\t\t\trPointerState.current = {\n\t\t\t\tisDown: false,\n\t\t\t\tisDragging: false,\n\t\t\t\tstart: new Vec(e.clientX, e.clientY),\n\t\t\t}\n\t\t},\n\t\t[canvasEvents]\n\t)\n\n\treturn (\n\t\tshowElement && (\n\t\t\t<div\n\t\t\t\tclassName=\"tlui-menu-click-capture\"\n\t\t\t\tdata-testid=\"menu-click-capture.content\"\n\t\t\t\t{...canvasEvents}\n\t\t\t\tonPointerDown={handlePointerDown}\n\t\t\t\tonPointerMove={handlePointerMove}\n\t\t\t\tonPointerUp={handlePointerUp}\n\t\t\t/>\n\t\t)\n\t)\n}\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AA8FG;AA9FH,yBAAyB;AACzB,mBAA4D;AAC5D,6BAAgC;AAChC,uBAA0B;AAC1B,iBAAoB;AAOb,SAAS,mBAAmB;AAClC,QAAM,aAAS,4BAAU;AAGzB,QAAM,iBAAa,6BAAS,gBAAgB,MAAM,OAAO,MAAM,gBAAgB,GAAG,CAAC,MAAM,CAAC;AAG1F,QAAM,CAAC,YAAY,aAAa,QAAI,uBAAS,KAAK;AAElD,QAAM,cAAc,cAAc;AAGlC,QAAM,mBAAe,wCAAgB;AAGrC,QAAM,oBAAgB,qBAAO;AAAA,IAC5B,QAAQ;AAAA,IACR,YAAY;AAAA,IACZ,OAAO,IAAI,eAAI;AAAA,EAChB,CAAC;AAED,QAAM,wBAAoB;AAAA,IACzB,CAAC,MAAoB;AACpB,UAAI,EAAE,WAAW,GAAG;AACnB,sBAAc,IAAI;AAClB,sBAAc,UAAU;AAAA,UACvB,QAAQ;AAAA,UACR,YAAY;AAAA,UACZ,OAAO,IAAI,eAAI,EAAE,SAAS,EAAE,OAAO;AAAA,QACpC;AAAA,MACD;AACA,aAAO,MAAM,eAAe;AAAA,IAC7B;AAAA,IACA,CAAC,MAAM;AAAA,EACR;AAEA,QAAM,wBAAoB;AAAA,IACzB,CAAC,MAAoB;AAEpB,UAAI,CAAC,cAAc,QAAQ,OAAQ;AAEnC;AAAA;AAAA,QAEC,eAAI,MAAM,cAAc,QAAQ,OAAO,IAAI,eAAI,EAAE,SAAS,EAAE,OAAO,CAAC,IACpE,OAAO,QAAQ;AAAA,QACd;AAED,sBAAc,UAAU;AAAA,UACvB,GAAG,cAAc;AAAA,UACjB,QAAQ;AAAA,UACR,YAAY;AAAA,QACb;AAEA,cAAM,EAAE,GAAG,EAAE,IAAI,cAAc,QAAQ;AACvC,qBAAa,gBAAgB;AAAA,UAC5B,GAAG;AAAA,UACH,SAAS;AAAA,UACT,SAAS;AAAA,UACT,QAAQ;AAAA,QACT,CAAC;AAAA,MACF;AAAA,IACD;AAAA,IACA,CAAC,cAAc,MAAM;AAAA,EACtB;AAEA,QAAM,sBAAkB;AAAA,IACvB,CAAC,MAAoB;AAEpB,mBAAa,cAAc,CAAC;AAE5B,oBAAc,KAAK;AAEnB,oBAAc,UAAU;AAAA,QACvB,QAAQ;AAAA,QACR,YAAY;AAAA,QACZ,OAAO,IAAI,eAAI,EAAE,SAAS,EAAE,OAAO;AAAA,MACpC;AAAA,IACD;AAAA,IACA,CAAC,YAAY;AAAA,EACd;AAEA,SACC,eACC;AAAA,IAAC;AAAA;AAAA,MACA,WAAU;AAAA,MACV,eAAY;AAAA,MACX,GAAG;AAAA,MACJ,eAAe;AAAA,MACf,eAAe;AAAA,MACf,aAAa;AAAA;AAAA,EACd;AAGH;",
+  "sourcesContent": ["import { useValue } from '@tldraw/state-react'\nimport { PointerEvent, useCallback, useRef, useState } from 'react'\nimport { useCanvasEvents } from '../hooks/useCanvasEvents'\nimport { useEditor } from '../hooks/useEditor'\nimport { Vec } from '../primitives/Vec'\nimport { getPointerInfo } from '../utils/getPointerInfo'\n\n/**\n * When a menu is open, this component prevents the user from interacting with the canvas.\n *\n * @public @react\n */\nexport function MenuClickCapture() {\n\tconst editor = useEditor()\n\n\t// Whether any menus are open\n\tconst isMenuOpen = useValue('is menu open', () => editor.menus.hasAnyOpenMenus(), [editor])\n\n\t// Whether we're pointing or not\u2014keep this component visible if we're pointing\n\tconst [isPointing, setIsPointing] = useState(false)\n\n\tconst showElement = isMenuOpen || isPointing\n\n\t// Get the same events that we use on the canvas\n\tconst canvasEvents = useCanvasEvents()\n\n\t// Keep track of the pointer state\n\tconst rPointerState = useRef({\n\t\tisDown: false,\n\t\tisDragging: false,\n\t\tstart: new Vec(),\n\t})\n\n\tconst handlePointerDown = useCallback(\n\t\t(e: PointerEvent) => {\n\t\t\tif (e.button === 0) {\n\t\t\t\tsetIsPointing(true)\n\t\t\t\trPointerState.current = {\n\t\t\t\t\tisDown: true,\n\t\t\t\t\tisDragging: false,\n\t\t\t\t\tstart: new Vec(e.clientX, e.clientY),\n\t\t\t\t}\n\t\t\t\trDidAPointerDownAndDragWhileMenuWasOpen.current = false\n\t\t\t}\n\t\t\teditor.menus.clearOpenMenus()\n\t\t},\n\t\t[editor]\n\t)\n\n\tconst rDidAPointerDownAndDragWhileMenuWasOpen = useRef(false)\n\n\tconst handlePointerMove = useCallback(\n\t\t(e: PointerEvent) => {\n\t\t\t// Do nothing unless we're pointing\n\t\t\tif (!rPointerState.current.isDown) return\n\n\t\t\t// call the onPointerDown with the original pointer position\n\t\t\tconst { x, y } = rPointerState.current.start\n\n\t\t\tif (!rDidAPointerDownAndDragWhileMenuWasOpen.current) {\n\t\t\t\tif (\n\t\t\t\t\t// We're pointing, but are we dragging?\n\t\t\t\t\tVec.Dist2(rPointerState.current.start, new Vec(e.clientX, e.clientY)) >\n\t\t\t\t\teditor.options.dragDistanceSquared\n\t\t\t\t) {\n\t\t\t\t\trDidAPointerDownAndDragWhileMenuWasOpen.current = true\n\t\t\t\t\t// Wehaddaeventitsadrag\n\t\t\t\t\trPointerState.current = {\n\t\t\t\t\t\t...rPointerState.current,\n\t\t\t\t\t\tisDown: true,\n\t\t\t\t\t\tisDragging: true,\n\t\t\t\t\t}\n\t\t\t\t\tcanvasEvents.onPointerDown?.({\n\t\t\t\t\t\t...e,\n\t\t\t\t\t\tclientX: x,\n\t\t\t\t\t\tclientY: y,\n\t\t\t\t\t\tbutton: 0,\n\t\t\t\t\t})\n\t\t\t\t}\n\t\t\t}\n\n\t\t\tif (rDidAPointerDownAndDragWhileMenuWasOpen.current) {\n\t\t\t\teditor.dispatch({\n\t\t\t\t\ttype: 'pointer',\n\t\t\t\t\ttarget: 'canvas',\n\t\t\t\t\tname: 'pointer_move',\n\t\t\t\t\t...getPointerInfo(editor, e),\n\t\t\t\t})\n\t\t\t}\n\t\t},\n\t\t[canvasEvents, editor]\n\t)\n\n\tconst handlePointerUp = useCallback(\n\t\t(e: PointerEvent) => {\n\t\t\t// Run the pointer up\n\t\t\tcanvasEvents.onPointerUp?.(e)\n\t\t\t// Then turn off pointing\n\t\t\tsetIsPointing(false)\n\t\t\t// Reset the pointer state\n\t\t\trPointerState.current = {\n\t\t\t\tisDown: false,\n\t\t\t\tisDragging: false,\n\t\t\t\tstart: new Vec(e.clientX, e.clientY),\n\t\t\t}\n\t\t\trDidAPointerDownAndDragWhileMenuWasOpen.current = false\n\t\t},\n\t\t[canvasEvents]\n\t)\n\n\treturn (\n\t\tshowElement && (\n\t\t\t<div\n\t\t\t\tclassName=\"tlui-menu-click-capture\"\n\t\t\t\tdata-testid=\"menu-click-capture.content\"\n\t\t\t\t{...canvasEvents}\n\t\t\t\tonPointerDown={handlePointerDown}\n\t\t\t\tonPointerMove={handlePointerMove}\n\t\t\t\tonPointerUp={handlePointerUp}\n\t\t\t/>\n\t\t)\n\t)\n}\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAgHG;AAhHH,yBAAyB;AACzB,mBAA4D;AAC5D,6BAAgC;AAChC,uBAA0B;AAC1B,iBAAoB;AACpB,4BAA+B;AAOxB,SAAS,mBAAmB;AAClC,QAAM,aAAS,4BAAU;AAGzB,QAAM,iBAAa,6BAAS,gBAAgB,MAAM,OAAO,MAAM,gBAAgB,GAAG,CAAC,MAAM,CAAC;AAG1F,QAAM,CAAC,YAAY,aAAa,QAAI,uBAAS,KAAK;AAElD,QAAM,cAAc,cAAc;AAGlC,QAAM,mBAAe,wCAAgB;AAGrC,QAAM,oBAAgB,qBAAO;AAAA,IAC5B,QAAQ;AAAA,IACR,YAAY;AAAA,IACZ,OAAO,IAAI,eAAI;AAAA,EAChB,CAAC;AAED,QAAM,wBAAoB;AAAA,IACzB,CAAC,MAAoB;AACpB,UAAI,EAAE,WAAW,GAAG;AACnB,sBAAc,IAAI;AAClB,sBAAc,UAAU;AAAA,UACvB,QAAQ;AAAA,UACR,YAAY;AAAA,UACZ,OAAO,IAAI,eAAI,EAAE,SAAS,EAAE,OAAO;AAAA,QACpC;AACA,gDAAwC,UAAU;AAAA,MACnD;AACA,aAAO,MAAM,eAAe;AAAA,IAC7B;AAAA,IACA,CAAC,MAAM;AAAA,EACR;AAEA,QAAM,8CAA0C,qBAAO,KAAK;AAE5D,QAAM,wBAAoB;AAAA,IACzB,CAAC,MAAoB;AAEpB,UAAI,CAAC,cAAc,QAAQ,OAAQ;AAGnC,YAAM,EAAE,GAAG,EAAE,IAAI,cAAc,QAAQ;AAEvC,UAAI,CAAC,wCAAwC,SAAS;AACrD;AAAA;AAAA,UAEC,eAAI,MAAM,cAAc,QAAQ,OAAO,IAAI,eAAI,EAAE,SAAS,EAAE,OAAO,CAAC,IACpE,OAAO,QAAQ;AAAA,UACd;AACD,kDAAwC,UAAU;AAElD,wBAAc,UAAU;AAAA,YACvB,GAAG,cAAc;AAAA,YACjB,QAAQ;AAAA,YACR,YAAY;AAAA,UACb;AACA,uBAAa,gBAAgB;AAAA,YAC5B,GAAG;AAAA,YACH,SAAS;AAAA,YACT,SAAS;AAAA,YACT,QAAQ;AAAA,UACT,CAAC;AAAA,QACF;AAAA,MACD;AAEA,UAAI,wCAAwC,SAAS;AACpD,eAAO,SAAS;AAAA,UACf,MAAM;AAAA,UACN,QAAQ;AAAA,UACR,MAAM;AAAA,UACN,OAAG,sCAAe,QAAQ,CAAC;AAAA,QAC5B,CAAC;AAAA,MACF;AAAA,IACD;AAAA,IACA,CAAC,cAAc,MAAM;AAAA,EACtB;AAEA,QAAM,sBAAkB;AAAA,IACvB,CAAC,MAAoB;AAEpB,mBAAa,cAAc,CAAC;AAE5B,oBAAc,KAAK;AAEnB,oBAAc,UAAU;AAAA,QACvB,QAAQ;AAAA,QACR,YAAY;AAAA,QACZ,OAAO,IAAI,eAAI,EAAE,SAAS,EAAE,OAAO;AAAA,MACpC;AACA,8CAAwC,UAAU;AAAA,IACnD;AAAA,IACA,CAAC,YAAY;AAAA,EACd;AAEA,SACC,eACC;AAAA,IAAC;AAAA;AAAA,MACA,WAAU;AAAA,MACV,eAAY;AAAA,MACX,GAAG;AAAA,MACJ,eAAe;AAAA,MACf,eAAe;AAAA,MACf,aAAa;AAAA;AAAA,EACd;AAGH;",
   "names": []
 }

package/dist-cjs/lib/editor/Editor.js

@@ -4233,7 +4233,7 @@ class Editor extends (_a = import_eventemitter3.default, _getIsShapeHiddenCache_
     const parentId = typeof parent === "string" ? parent : parent.id;
     const children = this._parentIdsToChildIds.get()[parentId];
     if (!children || children.length === 0) {
-      return "a1";
+      return (0, import_utils.getIndexAbove)(import_utils.ZERO_INDEX_KEY);
     }
     const shape = this.getShape(children[children.length - 1]);
     return (0, import_utils.getIndexAbove)(shape.index);