@tldraw/editor 3.14.0-canary.4255c71c8c87 → 3.14.0-canary.468bf700c42b

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 (69) 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 -10
  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/utils/dom.js +1 -1
  23. package/dist-cjs/lib/utils/dom.js.map +2 -2
  24. package/dist-cjs/version.js +3 -3
  25. package/dist-cjs/version.js.map +1 -1
  26. package/dist-esm/index.d.mts +50 -149
  27. package/dist-esm/index.mjs +1 -4
  28. package/dist-esm/index.mjs.map +2 -2
  29. package/dist-esm/lib/editor/Editor.mjs +25 -82
  30. package/dist-esm/lib/editor/Editor.mjs.map +2 -2
  31. package/dist-esm/lib/editor/managers/HistoryManager/HistoryManager.mjs +1 -3
  32. package/dist-esm/lib/editor/managers/HistoryManager/HistoryManager.mjs.map +2 -2
  33. package/dist-esm/lib/editor/managers/TextManager/TextManager.mjs +42 -73
  34. package/dist-esm/lib/editor/managers/TextManager/TextManager.mjs.map +2 -2
  35. package/dist-esm/lib/editor/shapes/ShapeUtil.mjs +10 -0
  36. package/dist-esm/lib/editor/shapes/ShapeUtil.mjs.map +2 -2
  37. package/dist-esm/lib/editor/tools/BaseBoxShapeTool/children/Pointing.mjs +6 -10
  38. package/dist-esm/lib/editor/tools/BaseBoxShapeTool/children/Pointing.mjs.map +3 -3
  39. package/dist-esm/lib/editor/tools/StateNode.mjs +3 -3
  40. package/dist-esm/lib/editor/tools/StateNode.mjs.map +2 -2
  41. package/dist-esm/lib/hooks/useCanvasEvents.mjs +2 -1
  42. package/dist-esm/lib/hooks/useCanvasEvents.mjs.map +2 -2
  43. package/dist-esm/lib/primitives/geometry/Geometry2d.mjs +2 -6
  44. package/dist-esm/lib/primitives/geometry/Geometry2d.mjs.map +2 -2
  45. package/dist-esm/lib/utils/dom.mjs +1 -1
  46. package/dist-esm/lib/utils/dom.mjs.map +2 -2
  47. package/dist-esm/version.mjs +3 -3
  48. package/dist-esm/version.mjs.map +1 -1
  49. package/editor.css +12 -49
  50. package/package.json +7 -7
  51. package/src/index.ts +0 -7
  52. package/src/lib/editor/Editor.ts +35 -102
  53. package/src/lib/editor/managers/HistoryManager/HistoryManager.ts +1 -3
  54. package/src/lib/editor/managers/TextManager/TextManager.test.ts +5 -1
  55. package/src/lib/editor/managers/TextManager/TextManager.ts +86 -118
  56. package/src/lib/editor/shapes/ShapeUtil.ts +15 -47
  57. package/src/lib/editor/tools/BaseBoxShapeTool/children/Pointing.ts +17 -22
  58. package/src/lib/editor/tools/StateNode.ts +3 -3
  59. package/src/lib/editor/types/emit-types.ts +0 -4
  60. package/src/lib/editor/types/external-content.ts +2 -11
  61. package/src/lib/hooks/useCanvasEvents.ts +1 -0
  62. package/src/lib/primitives/geometry/Geometry2d.ts +2 -7
  63. package/src/lib/utils/dom.ts +1 -1
  64. package/src/version.ts +3 -3
  65. package/dist-cjs/lib/utils/reparenting.js +0 -232
  66. package/dist-cjs/lib/utils/reparenting.js.map +0 -7
  67. package/dist-esm/lib/utils/reparenting.mjs +0 -216
  68. package/dist-esm/lib/utils/reparenting.mjs.map +0 -7
  69. package/src/lib/utils/reparenting.ts +0 -383
@@ -323,7 +323,6 @@ class Editor extends (_a = import_eventemitter3.default, _getIsShapeHiddenCache_
323
323
  __publicField(this, "externalContentHandlers", {
324
324
  text: null,
325
325
  files: null,
326
- "file-replace": null,
327
326
  embed: null,
328
327
  "svg-text": null,
329
328
  url: null,
@@ -440,7 +439,6 @@ class Editor extends (_a = import_eventemitter3.default, _getIsShapeHiddenCache_
440
439
  this.disposables.add(() => this.user.dispose());
441
440
  this.getContainer = getContainer;
442
441
  this.textMeasure = new import_TextManager.TextManager(this);
443
- this.disposables.add(() => this.textMeasure.dispose());
444
442
  this.fonts = new import_FontManager.FontManager(this, fontAssetUrls);
445
443
  this._tickManager = new import_TickManager.TickManager(this);
446
444
  class NewRoot extends import_RootState.RootState {
@@ -1642,19 +1640,6 @@ class Editor extends (_a = import_eventemitter3.default, _getIsShapeHiddenCache_
1642
1640
  getSelectionPageBounds() {
1643
1641
  return this.getShapesPageBounds(this.getSelectedShapeIds());
1644
1642
  }
1645
- /**
1646
- * The bounds of the selection bounding box in the current page space.
1647
- *
1648
- * @readonly
1649
- * @public
1650
- */
1651
- getSelectionScreenBounds() {
1652
- const bounds = this.getSelectionPageBounds();
1653
- if (!bounds) return void 0;
1654
- const { x, y } = this.pageToScreen(bounds.point);
1655
- const zoom = this.getZoomLevel();
1656
- return new import_Box.Box(x, y, bounds.width * zoom, bounds.height * zoom);
1657
- }
1658
1643
  /**
1659
1644
  * @internal
1660
1645
  */
@@ -2788,7 +2773,7 @@ class Editor extends (_a = import_eventemitter3.default, _getIsShapeHiddenCache_
2788
2773
  * @public
2789
2774
  */
2790
2775
  updateViewportScreenBounds(screenBounds, center = false) {
2791
- if (!(screenBounds instanceof import_Box.Box)) {
2776
+ if (screenBounds instanceof HTMLElement) {
2792
2777
  const rect = screenBounds.getBoundingClientRect();
2793
2778
  screenBounds = new import_Box.Box(
2794
2779
  rect.left || rect.x,
@@ -4131,7 +4116,7 @@ class Editor extends (_a = import_eventemitter3.default, _getIsShapeHiddenCache_
4131
4116
  if (!id) return void 0;
4132
4117
  const freshShape = this.getShape(id);
4133
4118
  if (freshShape === void 0 || !(0, import_tlschema.isShapeId)(freshShape.parentId)) return void 0;
4134
- return this.getShape(freshShape.parentId);
4119
+ return this.store.get(freshShape.parentId);
4135
4120
  }
4136
4121
  /**
4137
4122
  * If siblingShape and targetShape are siblings, this returns targetShape. If targetShape has an
@@ -4263,9 +4248,6 @@ class Editor extends (_a = import_eventemitter3.default, _getIsShapeHiddenCache_
4263
4248
  if (!pagePoint) continue;
4264
4249
  const newPoint = invertedParentTransform.applyToPoint(pagePoint);
4265
4250
  const newRotation = pageTransform.rotation() - parentPageRotation;
4266
- if (shape.id === parentId) {
4267
- throw Error("Attempted to reparent a shape to itself!");
4268
- }
4269
4251
  changes.push({
4270
4252
  id: shape.id,
4271
4253
  type: shape.type,
@@ -4358,10 +4340,6 @@ class Editor extends (_a = import_eventemitter3.default, _getIsShapeHiddenCache_
4358
4340
  }
4359
4341
  return shapeIds;
4360
4342
  }
4361
- /** @deprecated Use {@link Editor.getDraggingOverShape} instead */
4362
- getDroppingOverShape(point, droppingShapes) {
4363
- return this.getDraggingOverShape(point, droppingShapes);
4364
- }
4365
4343
  /**
4366
4344
  * Get the shape that some shapes should be dropped on at a given point.
4367
4345
  *
@@ -4372,20 +4350,22 @@ class Editor extends (_a = import_eventemitter3.default, _getIsShapeHiddenCache_
4372
4350
  *
4373
4351
  * @public
4374
4352
  */
4375
- getDraggingOverShape(point, droppingShapes) {
4376
- const draggingShapes = (0, import_utils.compact)(droppingShapes.map((s) => this.getShape(s))).filter(
4377
- (s) => !s.isLocked && !this.isShapeHidden(s)
4378
- );
4379
- const maybeDraggingOverShapes = this.getShapesAtPoint(point, {
4380
- hitInside: true,
4381
- margin: 0
4382
- }).filter(
4383
- (s) => !droppingShapes.includes(s) && !s.isLocked && !this.isShapeHidden(s) && !draggingShapes.includes(s)
4384
- );
4385
- for (const maybeDraggingOverShape of maybeDraggingOverShapes) {
4386
- const shapeUtil = this.getShapeUtil(maybeDraggingOverShape);
4387
- if (shapeUtil.onDragShapesOver || shapeUtil.onDragShapesIn || shapeUtil.onDragShapesOut || shapeUtil.onDropShapesOver) {
4388
- return maybeDraggingOverShape;
4353
+ getDroppingOverShape(point, droppingShapes = []) {
4354
+ const currentPageShapesSorted = this.getCurrentPageShapesSorted();
4355
+ for (let i = currentPageShapesSorted.length - 1; i >= 0; i--) {
4356
+ const shape = currentPageShapesSorted[i];
4357
+ if (
4358
+ // ignore hidden shapes
4359
+ this.isShapeHidden(shape) || // don't allow dropping on selected shapes
4360
+ this.getSelectedShapeIds().includes(shape.id) || // only allow shapes that can receive children
4361
+ !this.getShapeUtil(shape).canDropShapes(shape, droppingShapes) || // don't allow dropping a shape on itself or one of it's children
4362
+ droppingShapes.find((s) => s.id === shape.id || this.hasAncestor(shape, s.id))
4363
+ ) {
4364
+ continue;
4365
+ }
4366
+ const maskedPageBounds = this.getShapeMaskedPageBounds(shape.id);
4367
+ if (maskedPageBounds && maskedPageBounds.containsPoint(point) && this.getShapeGeometry(shape).hitTestPoint(this.getPointInShapeSpace(shape, point), 0, true)) {
4368
+ return shape;
4389
4369
  }
4390
4370
  }
4391
4371
  }
@@ -4662,8 +4642,7 @@ class Editor extends (_a = import_eventemitter3.default, _getIsShapeHiddenCache_
4662
4642
  */
4663
4643
  duplicateShapes(shapes, offset) {
4664
4644
  this.run(() => {
4665
- const _ids = typeof shapes[0] === "string" ? shapes : shapes.map((s) => s.id);
4666
- const ids = this._shouldIgnoreShapeLock ? _ids : this._getUnlockedShapeIds(_ids);
4645
+ const ids = typeof shapes[0] === "string" ? shapes : shapes.map((s) => s.id);
4667
4646
  if (ids.length <= 0) return this;
4668
4647
  const initialIds = new Set(ids);
4669
4648
  const shapeIdSet = this.getShapeAndDescendantIds(ids);
@@ -4727,7 +4706,8 @@ class Editor extends (_a = import_eventemitter3.default, _getIsShapeHiddenCache_
4727
4706
  shape.index = index;
4728
4707
  });
4729
4708
  const shapesToCreate = shapesToCreateWithOriginals.map(({ shape }) => shape);
4730
- if (!this.canCreateShapes(shapesToCreate)) {
4709
+ const maxShapesReached = shapesToCreate.length + this.getCurrentPageShapeIds().size > this.options.maxShapesPerPage;
4710
+ if (maxShapesReached) {
4731
4711
  alertMaxShapes(this);
4732
4712
  return;
4733
4713
  }
@@ -5742,26 +5722,6 @@ class Editor extends (_a = import_eventemitter3.default, _getIsShapeHiddenCache_
5742
5722
  getInitialMetaForShape(_shape) {
5743
5723
  return {};
5744
5724
  }
5745
- /**
5746
- * Get whether the provided shape can be created.
5747
- *
5748
- * @param shape - The shape or shape IDs to check.
5749
- *
5750
- * @public
5751
- */
5752
- canCreateShape(shape) {
5753
- return this.canCreateShapes([shape]);
5754
- }
5755
- /**
5756
- * Get whether the provided shapes can be created.
5757
- *
5758
- * @param shapes - The shapes or shape IDs to create.
5759
- *
5760
- * @public
5761
- */
5762
- canCreateShapes(shapes) {
5763
- return shapes.length + this.getCurrentPageShapeIds().size <= this.options.maxShapesPerPage;
5764
- }
5765
5725
  /**
5766
5726
  * Create a single shape.
5767
5727
  *
@@ -5815,8 +5775,7 @@ class Editor extends (_a = import_eventemitter3.default, _getIsShapeHiddenCache_
5815
5775
  let parentId = this.getFocusedGroupId();
5816
5776
  for (let i = currentPageShapesSorted.length - 1; i >= 0; i--) {
5817
5777
  const parent = currentPageShapesSorted[i];
5818
- const util = this.getShapeUtil(parent);
5819
- if (util.canReceiveNewChildrenOfType(parent, partial.type) && !this.isShapeHidden(parent) && this.isPointInShape(
5778
+ if (!this.isShapeHidden(parent) && this.getShapeUtil(parent).canReceiveNewChildrenOfType(parent, partial.type) && this.isPointInShape(
5820
5779
  parent,
5821
5780
  // If no parent is provided, then we can treat the
5822
5781
  // shape's provided x/y as being in the page's space.
@@ -5891,8 +5850,6 @@ class Editor extends (_a = import_eventemitter3.default, _getIsShapeHiddenCache_
5891
5850
  ...shape.meta
5892
5851
  };
5893
5852
  });
5894
- this.emit("created-shapes", shapeRecordsToCreate);
5895
- this.emit("edit");
5896
5853
  this.store.put(shapeRecordsToCreate);
5897
5854
  });
5898
5855
  return this;
@@ -6134,8 +6091,6 @@ class Editor extends (_a = import_eventemitter3.default, _getIsShapeHiddenCache_
6134
6091
  updated = this.getShapeUtil(shape).onBeforeUpdate?.(shape, updated) ?? updated;
6135
6092
  updates.push(updated);
6136
6093
  }
6137
- this.emit("edited-shapes", updates);
6138
- this.emit("edit");
6139
6094
  this.store.put(updates);
6140
6095
  });
6141
6096
  }
@@ -6157,8 +6112,6 @@ class Editor extends (_a = import_eventemitter3.default, _getIsShapeHiddenCache_
6157
6112
  allShapeIdsToDelete.add(childId);
6158
6113
  });
6159
6114
  }
6160
- this.emit("deleted-shapes", [...allShapeIdsToDelete]);
6161
- this.emit("edit");
6162
6115
  return this.run(() => this.store.remove([...allShapeIdsToDelete]));
6163
6116
  }
6164
6117
  deleteShape(_id) {
@@ -6502,14 +6455,6 @@ class Editor extends (_a = import_eventemitter3.default, _getIsShapeHiddenCache_
6502
6455
  async putExternalContent(info) {
6503
6456
  return this.externalContentHandlers[info.type]?.(info);
6504
6457
  }
6505
- /**
6506
- * Handle replacing external content.
6507
- *
6508
- * @param info - Info about the external content.
6509
- */
6510
- async replaceExternalContent(info) {
6511
- return this.externalContentHandlers[info.type]?.(info);
6512
- }
6513
6458
  /**
6514
6459
  * Get content that can be exported for the given shape ids.
6515
6460
  *
@@ -6927,9 +6872,7 @@ class Editor extends (_a = import_eventemitter3.default, _getIsShapeHiddenCache_
6927
6872
  previousScreenPoint,
6928
6873
  previousPagePoint,
6929
6874
  currentScreenPoint,
6930
- currentPagePoint,
6931
- originScreenPoint,
6932
- originPagePoint
6875
+ currentPagePoint
6933
6876
  } = this.inputs;
6934
6877
  const { screenBounds } = this.store.unsafeGetWithoutCapture(import_tlschema.TLINSTANCE_ID);
6935
6878
  const { x: cx, y: cy, z: cz } = (0, import_state.unsafe__withoutCapture)(() => this.getCamera());
@@ -6947,8 +6890,8 @@ class Editor extends (_a = import_eventemitter3.default, _getIsShapeHiddenCache_
6947
6890
  this.inputs.isPen = info.type === "pointer" && info.isPen;
6948
6891
  if (info.name === "pointer_down" || this.inputs.isPinching) {
6949
6892
  pointerVelocity.set(0, 0);
6950
- originScreenPoint.setTo(currentScreenPoint);
6951
- originPagePoint.setTo(currentPagePoint);
6893
+ this.inputs.originScreenPoint.setTo(currentScreenPoint);
6894
+ this.inputs.originPagePoint.setTo(currentPagePoint);
6952
6895
  }
6953
6896
  this.run(
6954
6897
  () => {