@tldraw/editor 3.16.0-canary.ca347c5375a5 → 3.16.0-canary.cf24aedcd577

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 (67) hide show
  1. package/dist-cjs/index.d.ts +80 -9
  2. package/dist-cjs/index.js +3 -1
  3. package/dist-cjs/index.js.map +2 -2
  4. package/dist-cjs/lib/TldrawEditor.js +3 -1
  5. package/dist-cjs/lib/TldrawEditor.js.map +2 -2
  6. package/dist-cjs/lib/components/MenuClickCapture.js +0 -5
  7. package/dist-cjs/lib/components/MenuClickCapture.js.map +2 -2
  8. package/dist-cjs/lib/config/TLUserPreferences.js +8 -2
  9. package/dist-cjs/lib/config/TLUserPreferences.js.map +2 -2
  10. package/dist-cjs/lib/editor/Editor.js +36 -23
  11. package/dist-cjs/lib/editor/Editor.js.map +2 -2
  12. package/dist-cjs/lib/editor/managers/UserPreferencesManager/UserPreferencesManager.js +8 -3
  13. package/dist-cjs/lib/editor/managers/UserPreferencesManager/UserPreferencesManager.js.map +2 -2
  14. package/dist-cjs/lib/editor/types/misc-types.js.map +1 -1
  15. package/dist-cjs/lib/exports/getSvgJsx.js +1 -2
  16. package/dist-cjs/lib/exports/getSvgJsx.js.map +2 -2
  17. package/dist-cjs/lib/hooks/useCanvasEvents.js +24 -20
  18. package/dist-cjs/lib/hooks/useCanvasEvents.js.map +2 -2
  19. package/dist-cjs/lib/hooks/useStateAttribute.js +35 -0
  20. package/dist-cjs/lib/hooks/useStateAttribute.js.map +7 -0
  21. package/dist-cjs/lib/options.js +1 -0
  22. package/dist-cjs/lib/options.js.map +2 -2
  23. package/dist-cjs/lib/utils/EditorAtom.js +45 -0
  24. package/dist-cjs/lib/utils/EditorAtom.js.map +7 -0
  25. package/dist-cjs/version.js +3 -3
  26. package/dist-cjs/version.js.map +1 -1
  27. package/dist-esm/index.d.mts +80 -9
  28. package/dist-esm/index.mjs +3 -1
  29. package/dist-esm/index.mjs.map +2 -2
  30. package/dist-esm/lib/TldrawEditor.mjs +3 -1
  31. package/dist-esm/lib/TldrawEditor.mjs.map +2 -2
  32. package/dist-esm/lib/components/MenuClickCapture.mjs +0 -5
  33. package/dist-esm/lib/components/MenuClickCapture.mjs.map +2 -2
  34. package/dist-esm/lib/config/TLUserPreferences.mjs +8 -2
  35. package/dist-esm/lib/config/TLUserPreferences.mjs.map +2 -2
  36. package/dist-esm/lib/editor/Editor.mjs +36 -23
  37. package/dist-esm/lib/editor/Editor.mjs.map +2 -2
  38. package/dist-esm/lib/editor/managers/UserPreferencesManager/UserPreferencesManager.mjs +8 -3
  39. package/dist-esm/lib/editor/managers/UserPreferencesManager/UserPreferencesManager.mjs.map +2 -2
  40. package/dist-esm/lib/exports/getSvgJsx.mjs +2 -2
  41. package/dist-esm/lib/exports/getSvgJsx.mjs.map +2 -2
  42. package/dist-esm/lib/hooks/useCanvasEvents.mjs +25 -21
  43. package/dist-esm/lib/hooks/useCanvasEvents.mjs.map +2 -2
  44. package/dist-esm/lib/hooks/useStateAttribute.mjs +15 -0
  45. package/dist-esm/lib/hooks/useStateAttribute.mjs.map +7 -0
  46. package/dist-esm/lib/options.mjs +1 -0
  47. package/dist-esm/lib/options.mjs.map +2 -2
  48. package/dist-esm/lib/utils/EditorAtom.mjs +25 -0
  49. package/dist-esm/lib/utils/EditorAtom.mjs.map +7 -0
  50. package/dist-esm/version.mjs +3 -3
  51. package/dist-esm/version.mjs.map +1 -1
  52. package/editor.css +2 -0
  53. package/package.json +7 -7
  54. package/src/index.ts +2 -0
  55. package/src/lib/TldrawEditor.tsx +7 -5
  56. package/src/lib/components/MenuClickCapture.tsx +0 -8
  57. package/src/lib/config/TLUserPreferences.ts +7 -0
  58. package/src/lib/editor/Editor.ts +59 -46
  59. package/src/lib/editor/managers/UserPreferencesManager/UserPreferencesManager.test.ts +13 -0
  60. package/src/lib/editor/managers/UserPreferencesManager/UserPreferencesManager.ts +5 -0
  61. package/src/lib/editor/types/misc-types.ts +54 -1
  62. package/src/lib/exports/getSvgJsx.tsx +2 -2
  63. package/src/lib/hooks/useCanvasEvents.ts +39 -32
  64. package/src/lib/hooks/useStateAttribute.ts +15 -0
  65. package/src/lib/options.ts +2 -0
  66. package/src/lib/utils/EditorAtom.ts +37 -0
  67. package/src/version.ts +3 -3
@@ -3944,6 +3944,7 @@ class Editor extends (_a = EventEmitter, _getIsShapeHiddenCache_dec = [computed]
3944
3944
  hitInside = false,
3945
3945
  hitFrameInside = false
3946
3946
  } = opts;
3947
+ const [innerMargin, outerMargin] = Array.isArray(margin) ? margin : [margin, margin];
3947
3948
  let inHollowSmallestArea = Infinity;
3948
3949
  let inHollowSmallestAreaHit = null;
3949
3950
  let inMarginClosestToEdgeDistance = Infinity;
@@ -3953,7 +3954,7 @@ class Editor extends (_a = EventEmitter, _getIsShapeHiddenCache_dec = [computed]
3953
3954
  return false;
3954
3955
  const pageMask = this.getShapeMask(shape);
3955
3956
  if (pageMask && !pointInPolygon(point, pageMask)) return false;
3956
- if (filter) return filter(shape);
3957
+ if (filter && !filter(shape)) return false;
3957
3958
  return true;
3958
3959
  });
3959
3960
  for (let i = shapesToCheck.length - 1; i >= 0; i--) {
@@ -3969,8 +3970,8 @@ class Editor extends (_a = EventEmitter, _getIsShapeHiddenCache_dec = [computed]
3969
3970
  }
3970
3971
  }
3971
3972
  if (this.isShapeOfType(shape, "frame")) {
3972
- const distance2 = geometry.distanceToPoint(pointInShapeSpace, hitInside);
3973
- if (Math.abs(distance2) <= margin) {
3973
+ const distance2 = geometry.distanceToPoint(pointInShapeSpace, hitFrameInside);
3974
+ if (hitFrameInside ? distance2 > 0 && distance2 <= outerMargin || distance2 <= 0 && distance2 > -innerMargin : distance2 > 0 && distance2 <= outerMargin) {
3974
3975
  return inMarginClosestToEdgeHit || shape;
3975
3976
  }
3976
3977
  if (geometry.hitTestPoint(pointInShapeSpace, 0, true)) {
@@ -3990,10 +3991,10 @@ class Editor extends (_a = EventEmitter, _getIsShapeHiddenCache_dec = [computed]
3990
3991
  }
3991
3992
  distance = minDistance;
3992
3993
  } else {
3993
- if (margin === 0 && (geometry.bounds.w < 1 || geometry.bounds.h < 1)) {
3994
+ if (outerMargin === 0 && (geometry.bounds.w < 1 || geometry.bounds.h < 1)) {
3994
3995
  distance = geometry.distanceToPoint(pointInShapeSpace, hitInside);
3995
3996
  } else {
3996
- if (geometry.bounds.containsPoint(pointInShapeSpace, margin)) {
3997
+ if (geometry.bounds.containsPoint(pointInShapeSpace, outerMargin)) {
3997
3998
  distance = geometry.distanceToPoint(pointInShapeSpace, hitInside);
3998
3999
  } else {
3999
4000
  distance = Infinity;
@@ -4001,12 +4002,22 @@ class Editor extends (_a = EventEmitter, _getIsShapeHiddenCache_dec = [computed]
4001
4002
  }
4002
4003
  }
4003
4004
  if (geometry.isClosed) {
4004
- if (distance <= margin) {
4005
+ if (distance <= outerMargin || hitInside && distance <= 0 && distance > -innerMargin) {
4005
4006
  if (geometry.isFilled || isGroup && geometry.children[0].isFilled) {
4006
4007
  return inMarginClosestToEdgeHit || shape;
4007
4008
  } else {
4008
4009
  if (this.getShapePageBounds(shape).contains(viewportPageBounds)) continue;
4009
- if (Math.abs(distance) < margin) {
4010
+ if (hitInside ? (
4011
+ // On hitInside, the distance will be negative for hits inside
4012
+ // If the distance is positive, check against the outer margin
4013
+ (// If the distance is negative, check against the inner margin
4014
+ distance > 0 && distance <= outerMargin || distance <= 0 && distance > -innerMargin)
4015
+ ) : (
4016
+ // If hitInside is false, then sadly _we do not know_ whether the
4017
+ // point is inside or outside of the shape, so we check against
4018
+ // the max of the two margins
4019
+ (Math.abs(distance) <= Math.max(innerMargin, outerMargin))
4020
+ )) {
4010
4021
  if (Math.abs(distance) < inMarginClosestToEdgeDistance) {
4011
4022
  inMarginClosestToEdgeDistance = Math.abs(distance);
4012
4023
  inMarginClosestToEdgeHit = shape;
@@ -5525,8 +5536,7 @@ class Editor extends (_a = EventEmitter, _getIsShapeHiddenCache_dec = [computed]
5525
5536
  const shapesMovingTogether = [shape];
5526
5537
  const boundsOfShapesMovingTogether = [shapePageBounds];
5527
5538
  if (!this.getShapeUtil(shape).canBeLaidOut?.(shape, {
5528
- type: "stretch",
5529
- shapes: shapesToStretchFirstPass
5539
+ type: "stretch"
5530
5540
  })) {
5531
5541
  continue;
5532
5542
  }
@@ -5851,21 +5861,24 @@ class Editor extends (_a = EventEmitter, _getIsShapeHiddenCache_dec = [computed]
5851
5861
  }
5852
5862
  if (!partial.parentId || !(this.store.has(partial.parentId) || shapes.some((p) => p.id === partial.parentId))) {
5853
5863
  let parentId = this.getFocusedGroupId();
5854
- for (let i = currentPageShapesSorted.length - 1; i >= 0; i--) {
5855
- const parent = currentPageShapesSorted[i];
5856
- const util = this.getShapeUtil(parent);
5857
- if (util.canReceiveNewChildrenOfType(parent, partial.type) && !this.isShapeHidden(parent) && this.isPointInShape(
5858
- parent,
5859
- // If no parent is provided, then we can treat the
5860
- // shape's provided x/y as being in the page's space.
5861
- { x: partial.x ?? 0, y: partial.y ?? 0 },
5862
- {
5863
- margin: 0,
5864
- hitInside: true
5864
+ const isPositioned = partial.x !== void 0 && partial.y !== void 0;
5865
+ if (isPositioned) {
5866
+ for (let i = currentPageShapesSorted.length - 1; i >= 0; i--) {
5867
+ const parent = currentPageShapesSorted[i];
5868
+ const util = this.getShapeUtil(parent);
5869
+ if (util.canReceiveNewChildrenOfType(parent, partial.type) && !this.isShapeHidden(parent) && this.isPointInShape(
5870
+ parent,
5871
+ // If no parent is provided, then we can treat the
5872
+ // shape's provided x/y as being in the page's space.
5873
+ { x: partial.x ?? 0, y: partial.y ?? 0 },
5874
+ {
5875
+ margin: 0,
5876
+ hitInside: true
5877
+ }
5878
+ )) {
5879
+ parentId = parent.id;
5880
+ break;
5865
5881
  }
5866
- )) {
5867
- parentId = parent.id;
5868
- break;
5869
5882
  }
5870
5883
  }
5871
5884
  const prevParentId = partial.parentId;