@tldraw/editor 3.14.0-canary.744f8a453221 → 3.14.0-canary.766a02a82239

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (74) hide show
  1. package/dist-cjs/index.d.ts +50 -149
  2. package/dist-cjs/index.js +1 -4
  3. package/dist-cjs/index.js.map +2 -2
  4. package/dist-cjs/lib/editor/Editor.js +25 -82
  5. package/dist-cjs/lib/editor/Editor.js.map +2 -2
  6. package/dist-cjs/lib/editor/managers/HistoryManager/HistoryManager.js +1 -3
  7. package/dist-cjs/lib/editor/managers/HistoryManager/HistoryManager.js.map +2 -2
  8. package/dist-cjs/lib/editor/managers/TextManager/TextManager.js +42 -73
  9. package/dist-cjs/lib/editor/managers/TextManager/TextManager.js.map +2 -2
  10. package/dist-cjs/lib/editor/shapes/ShapeUtil.js +10 -0
  11. package/dist-cjs/lib/editor/shapes/ShapeUtil.js.map +2 -2
  12. package/dist-cjs/lib/editor/tools/BaseBoxShapeTool/children/Pointing.js +6 -13
  13. package/dist-cjs/lib/editor/tools/BaseBoxShapeTool/children/Pointing.js.map +3 -3
  14. package/dist-cjs/lib/editor/tools/StateNode.js +3 -3
  15. package/dist-cjs/lib/editor/tools/StateNode.js.map +2 -2
  16. package/dist-cjs/lib/editor/types/emit-types.js.map +1 -1
  17. package/dist-cjs/lib/editor/types/external-content.js.map +1 -1
  18. package/dist-cjs/lib/hooks/useCanvasEvents.js +2 -1
  19. package/dist-cjs/lib/hooks/useCanvasEvents.js.map +2 -2
  20. package/dist-cjs/lib/primitives/geometry/Geometry2d.js +2 -6
  21. package/dist-cjs/lib/primitives/geometry/Geometry2d.js.map +2 -2
  22. package/dist-cjs/lib/primitives/geometry/Group2d.js +6 -11
  23. package/dist-cjs/lib/primitives/geometry/Group2d.js.map +2 -2
  24. package/dist-cjs/lib/utils/dom.js +1 -1
  25. package/dist-cjs/lib/utils/dom.js.map +2 -2
  26. package/dist-cjs/version.js +3 -3
  27. package/dist-cjs/version.js.map +1 -1
  28. package/dist-esm/index.d.mts +50 -149
  29. package/dist-esm/index.mjs +1 -4
  30. package/dist-esm/index.mjs.map +2 -2
  31. package/dist-esm/lib/editor/Editor.mjs +25 -82
  32. package/dist-esm/lib/editor/Editor.mjs.map +2 -2
  33. package/dist-esm/lib/editor/managers/HistoryManager/HistoryManager.mjs +1 -3
  34. package/dist-esm/lib/editor/managers/HistoryManager/HistoryManager.mjs.map +2 -2
  35. package/dist-esm/lib/editor/managers/TextManager/TextManager.mjs +42 -73
  36. package/dist-esm/lib/editor/managers/TextManager/TextManager.mjs.map +2 -2
  37. package/dist-esm/lib/editor/shapes/ShapeUtil.mjs +10 -0
  38. package/dist-esm/lib/editor/shapes/ShapeUtil.mjs.map +2 -2
  39. package/dist-esm/lib/editor/tools/BaseBoxShapeTool/children/Pointing.mjs +6 -13
  40. package/dist-esm/lib/editor/tools/BaseBoxShapeTool/children/Pointing.mjs.map +3 -3
  41. package/dist-esm/lib/editor/tools/StateNode.mjs +3 -3
  42. package/dist-esm/lib/editor/tools/StateNode.mjs.map +2 -2
  43. package/dist-esm/lib/hooks/useCanvasEvents.mjs +2 -1
  44. package/dist-esm/lib/hooks/useCanvasEvents.mjs.map +2 -2
  45. package/dist-esm/lib/primitives/geometry/Geometry2d.mjs +2 -6
  46. package/dist-esm/lib/primitives/geometry/Geometry2d.mjs.map +2 -2
  47. package/dist-esm/lib/primitives/geometry/Group2d.mjs +6 -11
  48. package/dist-esm/lib/primitives/geometry/Group2d.mjs.map +2 -2
  49. package/dist-esm/lib/utils/dom.mjs +1 -1
  50. package/dist-esm/lib/utils/dom.mjs.map +2 -2
  51. package/dist-esm/version.mjs +3 -3
  52. package/dist-esm/version.mjs.map +1 -1
  53. package/editor.css +483 -440
  54. package/package.json +7 -7
  55. package/src/index.ts +0 -7
  56. package/src/lib/editor/Editor.ts +36 -103
  57. package/src/lib/editor/managers/HistoryManager/HistoryManager.ts +1 -3
  58. package/src/lib/editor/managers/TextManager/TextManager.test.ts +5 -1
  59. package/src/lib/editor/managers/TextManager/TextManager.ts +86 -118
  60. package/src/lib/editor/shapes/ShapeUtil.ts +15 -47
  61. package/src/lib/editor/tools/BaseBoxShapeTool/children/Pointing.ts +17 -25
  62. package/src/lib/editor/tools/StateNode.ts +3 -3
  63. package/src/lib/editor/types/emit-types.ts +0 -4
  64. package/src/lib/editor/types/external-content.ts +2 -11
  65. package/src/lib/hooks/useCanvasEvents.ts +1 -0
  66. package/src/lib/primitives/geometry/Geometry2d.ts +2 -7
  67. package/src/lib/primitives/geometry/Group2d.ts +5 -11
  68. package/src/lib/utils/dom.ts +1 -1
  69. package/src/version.ts +3 -3
  70. package/dist-cjs/lib/utils/reparenting.js +0 -232
  71. package/dist-cjs/lib/utils/reparenting.js.map +0 -7
  72. package/dist-esm/lib/utils/reparenting.mjs +0 -216
  73. package/dist-esm/lib/utils/reparenting.mjs.map +0 -7
  74. package/src/lib/utils/reparenting.ts +0 -383
@@ -357,7 +357,6 @@ class Editor extends (_a = EventEmitter, _getIsShapeHiddenCache_dec = [computed]
357
357
  __publicField(this, "externalContentHandlers", {
358
358
  text: null,
359
359
  files: null,
360
- "file-replace": null,
361
360
  embed: null,
362
361
  "svg-text": null,
363
362
  url: null,
@@ -474,7 +473,6 @@ class Editor extends (_a = EventEmitter, _getIsShapeHiddenCache_dec = [computed]
474
473
  this.disposables.add(() => this.user.dispose());
475
474
  this.getContainer = getContainer;
476
475
  this.textMeasure = new TextManager(this);
477
- this.disposables.add(() => this.textMeasure.dispose());
478
476
  this.fonts = new FontManager(this, fontAssetUrls);
479
477
  this._tickManager = new TickManager(this);
480
478
  class NewRoot extends RootState {
@@ -1676,19 +1674,6 @@ class Editor extends (_a = EventEmitter, _getIsShapeHiddenCache_dec = [computed]
1676
1674
  getSelectionPageBounds() {
1677
1675
  return this.getShapesPageBounds(this.getSelectedShapeIds());
1678
1676
  }
1679
- /**
1680
- * The bounds of the selection bounding box in the current page space.
1681
- *
1682
- * @readonly
1683
- * @public
1684
- */
1685
- getSelectionScreenBounds() {
1686
- const bounds = this.getSelectionPageBounds();
1687
- if (!bounds) return void 0;
1688
- const { x, y } = this.pageToScreen(bounds.point);
1689
- const zoom = this.getZoomLevel();
1690
- return new Box(x, y, bounds.width * zoom, bounds.height * zoom);
1691
- }
1692
1677
  /**
1693
1678
  * @internal
1694
1679
  */
@@ -2822,7 +2807,7 @@ class Editor extends (_a = EventEmitter, _getIsShapeHiddenCache_dec = [computed]
2822
2807
  * @public
2823
2808
  */
2824
2809
  updateViewportScreenBounds(screenBounds, center = false) {
2825
- if (!(screenBounds instanceof Box)) {
2810
+ if (screenBounds instanceof HTMLElement) {
2826
2811
  const rect = screenBounds.getBoundingClientRect();
2827
2812
  screenBounds = new Box(
2828
2813
  rect.left || rect.x,
@@ -4165,7 +4150,7 @@ class Editor extends (_a = EventEmitter, _getIsShapeHiddenCache_dec = [computed]
4165
4150
  if (!id) return void 0;
4166
4151
  const freshShape = this.getShape(id);
4167
4152
  if (freshShape === void 0 || !isShapeId(freshShape.parentId)) return void 0;
4168
- return this.getShape(freshShape.parentId);
4153
+ return this.store.get(freshShape.parentId);
4169
4154
  }
4170
4155
  /**
4171
4156
  * If siblingShape and targetShape are siblings, this returns targetShape. If targetShape has an
@@ -4297,9 +4282,6 @@ class Editor extends (_a = EventEmitter, _getIsShapeHiddenCache_dec = [computed]
4297
4282
  if (!pagePoint) continue;
4298
4283
  const newPoint = invertedParentTransform.applyToPoint(pagePoint);
4299
4284
  const newRotation = pageTransform.rotation() - parentPageRotation;
4300
- if (shape.id === parentId) {
4301
- throw Error("Attempted to reparent a shape to itself!");
4302
- }
4303
4285
  changes.push({
4304
4286
  id: shape.id,
4305
4287
  type: shape.type,
@@ -4392,10 +4374,6 @@ class Editor extends (_a = EventEmitter, _getIsShapeHiddenCache_dec = [computed]
4392
4374
  }
4393
4375
  return shapeIds;
4394
4376
  }
4395
- /** @deprecated Use {@link Editor.getDraggingOverShape} instead */
4396
- getDroppingOverShape(point, droppingShapes) {
4397
- return this.getDraggingOverShape(point, droppingShapes);
4398
- }
4399
4377
  /**
4400
4378
  * Get the shape that some shapes should be dropped on at a given point.
4401
4379
  *
@@ -4406,20 +4384,22 @@ class Editor extends (_a = EventEmitter, _getIsShapeHiddenCache_dec = [computed]
4406
4384
  *
4407
4385
  * @public
4408
4386
  */
4409
- getDraggingOverShape(point, droppingShapes) {
4410
- const draggingShapes = compact(droppingShapes.map((s) => this.getShape(s))).filter(
4411
- (s) => !s.isLocked && !this.isShapeHidden(s)
4412
- );
4413
- const maybeDraggingOverShapes = this.getShapesAtPoint(point, {
4414
- hitInside: true,
4415
- margin: 0
4416
- }).filter(
4417
- (s) => !droppingShapes.includes(s) && !s.isLocked && !this.isShapeHidden(s) && !draggingShapes.includes(s)
4418
- );
4419
- for (const maybeDraggingOverShape of maybeDraggingOverShapes) {
4420
- const shapeUtil = this.getShapeUtil(maybeDraggingOverShape);
4421
- if (shapeUtil.onDragShapesOver || shapeUtil.onDragShapesIn || shapeUtil.onDragShapesOut || shapeUtil.onDropShapesOver) {
4422
- return maybeDraggingOverShape;
4387
+ getDroppingOverShape(point, droppingShapes = []) {
4388
+ const currentPageShapesSorted = this.getCurrentPageShapesSorted();
4389
+ for (let i = currentPageShapesSorted.length - 1; i >= 0; i--) {
4390
+ const shape = currentPageShapesSorted[i];
4391
+ if (
4392
+ // ignore hidden shapes
4393
+ this.isShapeHidden(shape) || // don't allow dropping on selected shapes
4394
+ this.getSelectedShapeIds().includes(shape.id) || // only allow shapes that can receive children
4395
+ !this.getShapeUtil(shape).canDropShapes(shape, droppingShapes) || // don't allow dropping a shape on itself or one of it's children
4396
+ droppingShapes.find((s) => s.id === shape.id || this.hasAncestor(shape, s.id))
4397
+ ) {
4398
+ continue;
4399
+ }
4400
+ const maskedPageBounds = this.getShapeMaskedPageBounds(shape.id);
4401
+ if (maskedPageBounds && maskedPageBounds.containsPoint(point) && this.getShapeGeometry(shape).hitTestPoint(this.getPointInShapeSpace(shape, point), 0, true)) {
4402
+ return shape;
4423
4403
  }
4424
4404
  }
4425
4405
  }
@@ -4696,8 +4676,7 @@ class Editor extends (_a = EventEmitter, _getIsShapeHiddenCache_dec = [computed]
4696
4676
  */
4697
4677
  duplicateShapes(shapes, offset) {
4698
4678
  this.run(() => {
4699
- const _ids = typeof shapes[0] === "string" ? shapes : shapes.map((s) => s.id);
4700
- const ids = this._shouldIgnoreShapeLock ? _ids : this._getUnlockedShapeIds(_ids);
4679
+ const ids = typeof shapes[0] === "string" ? shapes : shapes.map((s) => s.id);
4701
4680
  if (ids.length <= 0) return this;
4702
4681
  const initialIds = new Set(ids);
4703
4682
  const shapeIdSet = this.getShapeAndDescendantIds(ids);
@@ -4761,7 +4740,8 @@ class Editor extends (_a = EventEmitter, _getIsShapeHiddenCache_dec = [computed]
4761
4740
  shape.index = index;
4762
4741
  });
4763
4742
  const shapesToCreate = shapesToCreateWithOriginals.map(({ shape }) => shape);
4764
- if (!this.canCreateShapes(shapesToCreate)) {
4743
+ const maxShapesReached = shapesToCreate.length + this.getCurrentPageShapeIds().size > this.options.maxShapesPerPage;
4744
+ if (maxShapesReached) {
4765
4745
  alertMaxShapes(this);
4766
4746
  return;
4767
4747
  }
@@ -5776,26 +5756,6 @@ class Editor extends (_a = EventEmitter, _getIsShapeHiddenCache_dec = [computed]
5776
5756
  getInitialMetaForShape(_shape) {
5777
5757
  return {};
5778
5758
  }
5779
- /**
5780
- * Get whether the provided shape can be created.
5781
- *
5782
- * @param shape - The shape or shape IDs to check.
5783
- *
5784
- * @public
5785
- */
5786
- canCreateShape(shape) {
5787
- return this.canCreateShapes([shape]);
5788
- }
5789
- /**
5790
- * Get whether the provided shapes can be created.
5791
- *
5792
- * @param shapes - The shapes or shape IDs to create.
5793
- *
5794
- * @public
5795
- */
5796
- canCreateShapes(shapes) {
5797
- return shapes.length + this.getCurrentPageShapeIds().size <= this.options.maxShapesPerPage;
5798
- }
5799
5759
  /**
5800
5760
  * Create a single shape.
5801
5761
  *
@@ -5849,8 +5809,7 @@ class Editor extends (_a = EventEmitter, _getIsShapeHiddenCache_dec = [computed]
5849
5809
  let parentId = this.getFocusedGroupId();
5850
5810
  for (let i = currentPageShapesSorted.length - 1; i >= 0; i--) {
5851
5811
  const parent = currentPageShapesSorted[i];
5852
- const util = this.getShapeUtil(parent);
5853
- if (util.canReceiveNewChildrenOfType(parent, partial.type) && !this.isShapeHidden(parent) && this.isPointInShape(
5812
+ if (!this.isShapeHidden(parent) && this.getShapeUtil(parent).canReceiveNewChildrenOfType(parent, partial.type) && this.isPointInShape(
5854
5813
  parent,
5855
5814
  // If no parent is provided, then we can treat the
5856
5815
  // shape's provided x/y as being in the page's space.
@@ -5925,8 +5884,6 @@ class Editor extends (_a = EventEmitter, _getIsShapeHiddenCache_dec = [computed]
5925
5884
  ...shape.meta
5926
5885
  };
5927
5886
  });
5928
- this.emit("created-shapes", shapeRecordsToCreate);
5929
- this.emit("edit");
5930
5887
  this.store.put(shapeRecordsToCreate);
5931
5888
  });
5932
5889
  return this;
@@ -6168,8 +6125,6 @@ class Editor extends (_a = EventEmitter, _getIsShapeHiddenCache_dec = [computed]
6168
6125
  updated = this.getShapeUtil(shape).onBeforeUpdate?.(shape, updated) ?? updated;
6169
6126
  updates.push(updated);
6170
6127
  }
6171
- this.emit("edited-shapes", updates);
6172
- this.emit("edit");
6173
6128
  this.store.put(updates);
6174
6129
  });
6175
6130
  }
@@ -6191,8 +6146,6 @@ class Editor extends (_a = EventEmitter, _getIsShapeHiddenCache_dec = [computed]
6191
6146
  allShapeIdsToDelete.add(childId);
6192
6147
  });
6193
6148
  }
6194
- this.emit("deleted-shapes", [...allShapeIdsToDelete]);
6195
- this.emit("edit");
6196
6149
  return this.run(() => this.store.remove([...allShapeIdsToDelete]));
6197
6150
  }
6198
6151
  deleteShape(_id) {
@@ -6536,14 +6489,6 @@ class Editor extends (_a = EventEmitter, _getIsShapeHiddenCache_dec = [computed]
6536
6489
  async putExternalContent(info) {
6537
6490
  return this.externalContentHandlers[info.type]?.(info);
6538
6491
  }
6539
- /**
6540
- * Handle replacing external content.
6541
- *
6542
- * @param info - Info about the external content.
6543
- */
6544
- async replaceExternalContent(info) {
6545
- return this.externalContentHandlers[info.type]?.(info);
6546
- }
6547
6492
  /**
6548
6493
  * Get content that can be exported for the given shape ids.
6549
6494
  *
@@ -6961,9 +6906,7 @@ class Editor extends (_a = EventEmitter, _getIsShapeHiddenCache_dec = [computed]
6961
6906
  previousScreenPoint,
6962
6907
  previousPagePoint,
6963
6908
  currentScreenPoint,
6964
- currentPagePoint,
6965
- originScreenPoint,
6966
- originPagePoint
6909
+ currentPagePoint
6967
6910
  } = this.inputs;
6968
6911
  const { screenBounds } = this.store.unsafeGetWithoutCapture(TLINSTANCE_ID);
6969
6912
  const { x: cx, y: cy, z: cz } = unsafe__withoutCapture(() => this.getCamera());
@@ -6981,8 +6924,8 @@ class Editor extends (_a = EventEmitter, _getIsShapeHiddenCache_dec = [computed]
6981
6924
  this.inputs.isPen = info.type === "pointer" && info.isPen;
6982
6925
  if (info.name === "pointer_down" || this.inputs.isPinching) {
6983
6926
  pointerVelocity.set(0, 0);
6984
- originScreenPoint.setTo(currentScreenPoint);
6985
- originPagePoint.setTo(currentPagePoint);
6927
+ this.inputs.originScreenPoint.setTo(currentScreenPoint);
6928
+ this.inputs.originPagePoint.setTo(currentPagePoint);
6986
6929
  }
6987
6930
  this.run(
6988
6931
  () => {