@tldraw/editor 3.16.0-canary.f55016ece635 → 3.16.0-canary.f56a36d13420

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 (37) hide show
  1. package/dist-cjs/index.d.ts +31 -0
  2. package/dist-cjs/index.js +1 -1
  3. package/dist-cjs/lib/editor/Editor.js +11 -10
  4. package/dist-cjs/lib/editor/Editor.js.map +2 -2
  5. package/dist-cjs/lib/editor/shapes/ShapeUtil.js +13 -0
  6. package/dist-cjs/lib/editor/shapes/ShapeUtil.js.map +2 -2
  7. package/dist-cjs/lib/exports/getSvgJsx.js +34 -14
  8. package/dist-cjs/lib/exports/getSvgJsx.js.map +2 -2
  9. package/dist-cjs/lib/hooks/useCanvasEvents.js +7 -5
  10. package/dist-cjs/lib/hooks/useCanvasEvents.js.map +2 -2
  11. package/dist-cjs/lib/primitives/Box.js +3 -0
  12. package/dist-cjs/lib/primitives/Box.js.map +2 -2
  13. package/dist-cjs/version.js +3 -3
  14. package/dist-cjs/version.js.map +1 -1
  15. package/dist-esm/index.d.mts +31 -0
  16. package/dist-esm/index.mjs +1 -1
  17. package/dist-esm/lib/editor/Editor.mjs +11 -10
  18. package/dist-esm/lib/editor/Editor.mjs.map +2 -2
  19. package/dist-esm/lib/editor/shapes/ShapeUtil.mjs +13 -0
  20. package/dist-esm/lib/editor/shapes/ShapeUtil.mjs.map +2 -2
  21. package/dist-esm/lib/exports/getSvgJsx.mjs +34 -14
  22. package/dist-esm/lib/exports/getSvgJsx.mjs.map +2 -2
  23. package/dist-esm/lib/hooks/useCanvasEvents.mjs +7 -5
  24. package/dist-esm/lib/hooks/useCanvasEvents.mjs.map +2 -2
  25. package/dist-esm/lib/primitives/Box.mjs +4 -1
  26. package/dist-esm/lib/primitives/Box.mjs.map +2 -2
  27. package/dist-esm/version.mjs +3 -3
  28. package/dist-esm/version.mjs.map +1 -1
  29. package/package.json +7 -7
  30. package/src/lib/editor/Editor.ts +19 -21
  31. package/src/lib/editor/shapes/ShapeUtil.ts +35 -0
  32. package/src/lib/exports/getSvgJsx.test.ts +868 -0
  33. package/src/lib/exports/getSvgJsx.tsx +76 -19
  34. package/src/lib/hooks/useCanvasEvents.ts +6 -6
  35. package/src/lib/primitives/Box.test.ts +126 -0
  36. package/src/lib/primitives/Box.ts +10 -1
  37. package/src/version.ts +3 -3
@@ -510,6 +510,7 @@ export declare class Box {
510
510
  static ExpandBy(A: Box, n: number): Box;
511
511
  static Collides(A: Box, B: Box): boolean;
512
512
  static Contains(A: Box, B: Box): boolean;
513
+ static ContainsApproximately(A: Box, B: Box, precision?: number): boolean;
513
514
  static Includes(A: Box, B: Box): boolean;
514
515
  static ContainsPoint(A: Box, B: VecLike, margin?: number): boolean;
515
516
  static Common(boxes: Box[]): Box;
@@ -5249,6 +5250,25 @@ export declare abstract class ShapeUtil<Shape extends TLUnknownShape = TLUnknown
5249
5250
  */
5250
5251
  canBeLaidOut(_shape: Shape, _info: TLShapeUtilCanBeLaidOutOpts): boolean;
5251
5252
  /* Excluded from this release type: providesBackgroundForChildren */
5253
+ /**
5254
+ * Get the clip path to apply to this shape's children.
5255
+ *
5256
+ * @param shape - The shape to get the clip path for
5257
+ * @returns Array of points defining the clipping polygon in local coordinates, or undefined if no clipping
5258
+ * @public
5259
+ */
5260
+ getClipPath?(shape: Shape): undefined | Vec[];
5261
+ /**
5262
+ * Whether a specific child shape should be clipped by this shape.
5263
+ * Only called if getClipPath returns a valid polygon.
5264
+ *
5265
+ * If not defined, the default behavior is to clip all children.
5266
+ *
5267
+ * @param child - The child shape to check
5268
+ * @returns boolean indicating if this child should be clipped
5269
+ * @public
5270
+ */
5271
+ shouldClipChild?(child: TLShape): boolean;
5252
5272
  /**
5253
5273
  * Whether the shape should hide its resize handles when selected.
5254
5274
  *
@@ -5279,6 +5299,17 @@ export declare abstract class ShapeUtil<Shape extends TLUnknownShape = TLUnknown
5279
5299
  * @public
5280
5300
  */
5281
5301
  isAspectRatioLocked(_shape: Shape): boolean;
5302
+ /**
5303
+ * By default, the bounds of an image export are the bounds of all the shapes it contains, plus
5304
+ * some padding. If an export includes a shape where `isExportBoundsContainer` is true, then the
5305
+ * padding is skipped _if the bounds of that shape contains all the other shapes_. This is
5306
+ * useful in cases like annotating on top of an image, where you usually want to avoid extra
5307
+ * padding around the image if you don't need it.
5308
+ *
5309
+ * @param _shape - The shape to check
5310
+ * @returns True if this shape should be treated as an export bounds container
5311
+ */
5312
+ isExportBoundsContainer(_shape: Shape): boolean;
5282
5313
  /* Excluded from this release type: backgroundComponent */
5283
5314
  /**
5284
5315
  * Get the interpolated props for an animating shape. This is an optional method.
package/dist-cjs/index.js CHANGED
@@ -371,7 +371,7 @@ function debugEnableLicensing() {
371
371
  }
372
372
  (0, import_utils.registerTldrawLibraryVersion)(
373
373
  "@tldraw/editor",
374
- "3.16.0-canary.f55016ece635",
374
+ "3.16.0-canary.f56a36d13420",
375
375
  "cjs"
376
376
  );
377
377
  //# sourceMappingURL=index.js.map
@@ -3666,16 +3666,17 @@ class Editor extends (_a = import_eventemitter3.default, _getIsShapeHiddenCache_
3666
3666
  _getShapeMaskCache() {
3667
3667
  return this.store.createComputedCache("pageMaskCache", (shape) => {
3668
3668
  if ((0, import_tlschema.isPageId)(shape.parentId)) return void 0;
3669
- const frameAncestors = this.getShapeAncestors(shape.id).filter(
3670
- (shape2) => this.isShapeOfType(shape2, "frame")
3671
- );
3672
- if (frameAncestors.length === 0) return void 0;
3673
- const pageMask = frameAncestors.map((s) => {
3674
- const geometry = this.getShapeGeometry(s.id);
3675
- const pageTransform = this.getShapePageTransform(s.id);
3676
- return pageTransform.applyToPoints(geometry.vertices);
3677
- }).reduce((acc, b) => {
3678
- if (!(b && acc)) return void 0;
3669
+ const clipPaths = [];
3670
+ for (const ancestor of this.getShapeAncestors(shape.id)) {
3671
+ const util = this.getShapeUtil(ancestor);
3672
+ const clipPath = util.getClipPath?.(ancestor);
3673
+ if (!clipPath) continue;
3674
+ if (util.shouldClipChild?.(shape) === false) continue;
3675
+ const pageTransform = this.getShapePageTransform(ancestor.id);
3676
+ clipPaths.push(pageTransform.applyToPoints(clipPath));
3677
+ }
3678
+ if (clipPaths.length === 0) return void 0;
3679
+ const pageMask = clipPaths.reduce((acc, b) => {
3679
3680
  const intersection = (0, import_intersect.intersectPolygonPolygon)(acc, b);
3680
3681
  if (intersection) {
3681
3682
  return intersection.map(import_Vec.Vec.Cast);