@tldraw/editor 5.5.0-next.f9308d324e1c → 5.5.0

package/dist-esm/lib/editor/managers/SnapManager/HandleSnaps.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../src/lib/editor/managers/SnapManager/HandleSnaps.ts"],
-  "sourcesContent": ["import { computed } from '@tldraw/state'\nimport { TLHandle, TLShape, TLShapeId, VecModel } from '@tldraw/tlschema'\nimport { assertExists, uniqueId } from '@tldraw/utils'\nimport { Geometry2d } from '../../../primitives/geometry/Geometry2d'\nimport { Vec } from '../../../primitives/Vec'\nimport type { Editor } from '../../Editor'\nimport type { PointsSnapIndicator, SnapData, SnapManager } from './SnapManager'\n\n/**\n * When dragging a handle, users can snap the handle to key geometry on other nearby shapes.\n * Customize how handles snap to a shape by returning this from\n * {@link ShapeUtil.getHandleSnapGeometry}.\n *\n * Any co-ordinates here should be in the shape's local space.\n *\n * @public\n */\nexport interface HandleSnapGeometry {\n\t/**\n\t * A `Geometry2d` that describe the outline of the shape that the handle will snap to - fills\n\t * are ignored. By default, this is the same geometry returned by {@link ShapeUtil.getGeometry}.\n\t * Set this to `null` to disable handle snapping to this shape's outline.\n\t */\n\toutline?: Geometry2d | null\n\t/**\n\t * Key points on the shape that the handle will snap to. For example, the corners of a\n\t * rectangle, or the centroid of a triangle. By default, no points are used.\n\t */\n\tpoints?: VecModel[]\n\t/**\n\t * By default, handles can't snap to their own shape because moving the handle might change the\n\t * snapping location which can cause feedback loops. You can override this by returning a\n\t * version of `outline` that won't be affected by the current handle's position to use for\n\t * self-snapping.\n\t */\n\tgetSelfSnapOutline?(handle: TLHandle): Geometry2d | null\n\t/**\n\t * By default, handles can't snap to their own shape because moving the handle might change the\n\t * snapping location which can cause feedback loops. You can override this by returning a\n\t * version of `points` that won't be affected by the current handle's position to use for\n\t * self-snapping.\n\t */\n\tgetSelfSnapPoints?(handle: TLHandle): VecModel[]\n}\n\ninterface AlignPointsSnap {\n\tsnaps: PointsSnapIndicator[]\n\tnudge: Vec\n}\n\nconst defaultGetSelfSnapOutline = () => null\nconst defaultGetSelfSnapPoints = () => []\n/** @public */\nexport class HandleSnaps {\n\treadonly editor: Editor\n\tconstructor(readonly manager: SnapManager) {\n\t\tthis.editor = manager.editor\n\t}\n\n\t@computed private getSnapGeometryCache() {\n\t\tconst { editor } = this\n\t\treturn editor.store.createComputedCache('handle snap geometry', (shape: TLShape) => {\n\t\t\tconst snapGeometry = editor.getShapeUtil(shape).getHandleSnapGeometry(shape)\n\t\t\tconst getSelfSnapOutline = snapGeometry.getSelfSnapOutline\n\t\t\t\t? snapGeometry.getSelfSnapOutline.bind(snapGeometry)\n\t\t\t\t: defaultGetSelfSnapOutline\n\t\t\tconst getSelfSnapPoints = snapGeometry.getSelfSnapPoints\n\t\t\t\t? snapGeometry.getSelfSnapPoints.bind(snapGeometry)\n\t\t\t\t: defaultGetSelfSnapPoints\n\n\t\t\treturn {\n\t\t\t\toutline:\n\t\t\t\t\tsnapGeometry.outline === undefined\n\t\t\t\t\t\t? editor.getShapeGeometry(shape)\n\t\t\t\t\t\t: snapGeometry.outline,\n\n\t\t\t\tpoints: snapGeometry.points ?? [],\n\t\t\t\tgetSelfSnapOutline,\n\t\t\t\tgetSelfSnapPoints,\n\t\t\t}\n\t\t})\n\t}\n\n\tprivate *iterateSnapPointsInPageSpace(currentShapeId: TLShapeId, currentHandle: TLHandle) {\n\t\tconst selfSnapPoints = this.getSnapGeometryCache()\n\t\t\t.get(currentShapeId)\n\t\t\t?.getSelfSnapPoints(currentHandle)\n\t\tif (selfSnapPoints && selfSnapPoints.length) {\n\t\t\tconst shapePageTransform = assertExists(this.editor.getShapePageTransform(currentShapeId))\n\t\t\tfor (const point of selfSnapPoints) {\n\t\t\t\tyield shapePageTransform.applyToPoint(point)\n\t\t\t}\n\t\t}\n\n\t\tfor (const shapeId of this.manager.getSnappableShapes()) {\n\t\t\tif (shapeId === currentShapeId) continue\n\t\t\tconst snapPoints = this.getSnapGeometryCache().get(shapeId)?.points\n\t\t\tif (!snapPoints || !snapPoints.length) continue\n\n\t\t\tconst shapePageTransform = assertExists(this.editor.getShapePageTransform(shapeId))\n\t\t\tfor (const point of snapPoints) {\n\t\t\t\tyield shapePageTransform.applyToPoint(point)\n\t\t\t}\n\t\t}\n\t}\n\n\tprivate *iterateSnapOutlines(currentShapeId: TLShapeId, currentHandle: TLHandle) {\n\t\tconst selfSnapOutline = this.getSnapGeometryCache()\n\t\t\t.get(currentShapeId)\n\t\t\t?.getSelfSnapOutline(currentHandle)\n\t\tif (selfSnapOutline) {\n\t\t\tyield { shapeId: currentShapeId, outline: selfSnapOutline }\n\t\t}\n\n\t\tfor (const shapeId of this.manager.getSnappableShapes()) {\n\t\t\tif (shapeId === currentShapeId) continue\n\n\t\t\tconst snapOutline = this.getSnapGeometryCache().get(shapeId)?.outline\n\t\t\tif (!snapOutline) continue\n\n\t\t\tyield { shapeId, outline: snapOutline }\n\t\t}\n\t}\n\n\tprivate getHandleSnapPosition({\n\t\tcurrentShapeId,\n\t\thandle,\n\t\thandleInPageSpace,\n\t}: {\n\t\tcurrentShapeId: TLShapeId\n\t\thandle: TLHandle\n\t\thandleInPageSpace: Vec\n\t}): Vec | null {\n\t\tconst snapThreshold = this.manager.getSnapThreshold()\n\n\t\t// We snap to two different parts of the shape's handle snap geometry:\n\t\t// 1. The `points`. These are handles or other key points that we want to snap to with a\n\t\t//    higher priority than the normal outline snapping.\n\t\t// 2. The `outline`. This describes the outline of the shape, and we just snap to the\n\t\t//    nearest point on that outline.\n\n\t\t// Start with the points:\n\t\tlet minDistanceForSnapPoint = snapThreshold\n\t\tlet nearestSnapPoint: Vec | null = null\n\t\tfor (const snapPoint of this.iterateSnapPointsInPageSpace(currentShapeId, handle)) {\n\t\t\tif (Vec.DistMin(handleInPageSpace, snapPoint, minDistanceForSnapPoint)) {\n\t\t\t\tminDistanceForSnapPoint = Vec.Dist(handleInPageSpace, snapPoint)\n\t\t\t\tnearestSnapPoint = snapPoint\n\t\t\t}\n\t\t}\n\n\t\t// if we found a snap point, return it - we don't need to check the outlines because points\n\t\t// have a higher priority\n\t\tif (nearestSnapPoint) return nearestSnapPoint\n\n\t\tlet minDistanceForOutline = snapThreshold\n\t\tlet nearestPointOnOutline: Vec | null = null\n\n\t\tfor (const { shapeId, outline } of this.iterateSnapOutlines(currentShapeId, handle)) {\n\t\t\tconst shapePageTransform = assertExists(this.editor.getShapePageTransform(shapeId))\n\t\t\tconst pointInShapeSpace = this.editor.getPointInShapeSpace(shapeId, handleInPageSpace)\n\n\t\t\tconst nearestShapePointInShapeSpace = outline.nearestPoint(pointInShapeSpace)\n\t\t\tconst nearestInPageSpace = shapePageTransform.applyToPoint(nearestShapePointInShapeSpace)\n\n\t\t\tif (Vec.DistMin(handleInPageSpace, nearestInPageSpace, minDistanceForOutline)) {\n\t\t\t\tminDistanceForOutline = Vec.Dist(handleInPageSpace, nearestInPageSpace)\n\t\t\t\tnearestPointOnOutline = nearestInPageSpace\n\t\t\t}\n\t\t}\n\n\t\t// if we found a point on the outline, return it\n\t\tif (nearestPointOnOutline) return nearestPointOnOutline\n\n\t\t// if not, there's no nearby snap point\n\t\treturn null\n\t}\n\n\tprivate getHandleSnapData({\n\t\thandle,\n\t\tcurrentShapeId,\n\t}: {\n\t\thandle: TLHandle\n\t\tcurrentShapeId: TLShapeId\n\t}): AlignPointsSnap | null {\n\t\tconst snapThreshold = this.manager.getSnapThreshold()\n\t\tconst currentShapeTransform = assertExists(this.editor.getShapePageTransform(currentShapeId))\n\t\tconst handleInPageSpace = currentShapeTransform.applyToPoint(handle)\n\n\t\tlet nearestXSnap: Vec | null = null\n\t\tlet nearestYSnap: Vec | null = null\n\t\tlet minOffsetX = snapThreshold\n\t\tlet minOffsetY = snapThreshold\n\n\t\tfor (const snapPoint of this.iterateSnapPointsInPageSpace(currentShapeId, handle)) {\n\t\t\tconst offsetX = Math.abs(handleInPageSpace.x - snapPoint.x)\n\t\t\tconst offsetY = Math.abs(handleInPageSpace.y - snapPoint.y)\n\t\t\tif (offsetX < minOffsetX) {\n\t\t\t\tminOffsetX = offsetX\n\t\t\t\tnearestXSnap = snapPoint\n\t\t\t}\n\t\t\tif (offsetY < minOffsetY) {\n\t\t\t\tminOffsetY = offsetY\n\t\t\t\tnearestYSnap = snapPoint\n\t\t\t}\n\t\t}\n\n\t\tif (!nearestXSnap && !nearestYSnap) {\n\t\t\treturn null\n\t\t}\n\n\t\tconst nudge = new Vec(\n\t\t\tnearestXSnap ? nearestXSnap.x - handleInPageSpace.x : 0,\n\t\t\tnearestYSnap ? nearestYSnap.y - handleInPageSpace.y : 0\n\t\t)\n\n\t\tconst snappedHandle = Vec.Add(handleInPageSpace, nudge)\n\t\tconst snaps: PointsSnapIndicator[] = []\n\n\t\tif (nearestXSnap) {\n\t\t\tconst snappedHandleOnX = new Vec(nearestXSnap.x, snappedHandle.y)\n\t\t\tsnaps.push({\n\t\t\t\tid: uniqueId(),\n\t\t\t\ttype: 'points',\n\t\t\t\tpoints: [nearestXSnap, snappedHandleOnX],\n\t\t\t})\n\t\t}\n\t\tif (nearestYSnap) {\n\t\t\tconst snappedHandleOnY = new Vec(snappedHandle.x, nearestYSnap.y)\n\t\t\tsnaps.push({\n\t\t\t\tid: uniqueId(),\n\t\t\t\ttype: 'points',\n\t\t\t\tpoints: [nearestYSnap, snappedHandleOnY],\n\t\t\t})\n\t\t}\n\n\t\treturn { snaps, nudge }\n\t}\n\n\tsnapHandle({\n\t\tcurrentShapeId,\n\t\thandle,\n\t}: {\n\t\tcurrentShapeId: TLShapeId\n\t\thandle: TLHandle\n\t}): SnapData | null {\n\t\tconst currentShapeTransform = assertExists(this.editor.getShapePageTransform(currentShapeId))\n\t\tconst handleInPageSpace = currentShapeTransform.applyToPoint(handle)\n\t\t// eslint-disable-next-line @typescript-eslint/no-deprecated\n\t\tconst snapType = handle.canSnap ? 'point' : handle.snapType\n\n\t\tif (snapType === 'point') {\n\t\t\tconst snapPosition = this.getHandleSnapPosition({ currentShapeId, handle, handleInPageSpace })\n\n\t\t\tif (!snapPosition) {\n\t\t\t\treturn null\n\t\t\t}\n\n\t\t\tthis.manager.setIndicators([\n\t\t\t\t{\n\t\t\t\t\tid: uniqueId(),\n\t\t\t\t\ttype: 'points',\n\t\t\t\t\tpoints: [snapPosition],\n\t\t\t\t},\n\t\t\t])\n\n\t\t\treturn { nudge: Vec.Sub(snapPosition, handleInPageSpace) }\n\t\t}\n\n\t\tif (snapType === 'align') {\n\t\t\tconst snapData = this.getHandleSnapData({\n\t\t\t\thandle,\n\t\t\t\tcurrentShapeId,\n\t\t\t})\n\n\t\t\tif (!snapData) {\n\t\t\t\treturn null\n\t\t\t}\n\n\t\t\tthis.manager.setIndicators(snapData.snaps)\n\n\t\t\treturn { nudge: snapData.nudge }\n\t\t}\n\n\t\treturn null\n\t}\n}\n"],
-  "mappings": "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",
+  "sourcesContent": ["import { computed } from '@tldraw/state'\nimport { TLHandle, TLShape, TLShapeId, VecModel } from '@tldraw/tlschema'\nimport { assertExists, uniqueId } from '@tldraw/utils'\nimport { Geometry2d, Geometry2dFilters } from '../../../primitives/geometry/Geometry2d'\nimport { Group2d } from '../../../primitives/geometry/Group2d'\nimport { Vec } from '../../../primitives/Vec'\nimport type { Editor } from '../../Editor'\nimport type { PointsSnapIndicator, SnapData, SnapManager } from './SnapManager'\n\n/**\n * When dragging a handle, users can snap the handle to key geometry on other nearby shapes.\n * Customize how handles snap to a shape by returning this from\n * {@link ShapeUtil.getHandleSnapGeometry}.\n *\n * Any co-ordinates here should be in the shape's local space.\n *\n * @public\n */\nexport interface HandleSnapGeometry {\n\t/**\n\t * A `Geometry2d` that describe the outline of the shape that the handle will snap to - fills\n\t * are ignored. By default, this is the same geometry returned by {@link ShapeUtil.getGeometry}.\n\t * Set this to `null` to disable handle snapping to this shape's outline.\n\t */\n\toutline?: Geometry2d | null\n\t/**\n\t * Key points on the shape that the handle will snap to. For example, the corners of a\n\t * rectangle, or the centroid of a triangle. By default, no points are used.\n\t */\n\tpoints?: VecModel[]\n\t/**\n\t * By default, handles can't snap to their own shape because moving the handle might change the\n\t * snapping location which can cause feedback loops. You can override this by returning a\n\t * version of `outline` that won't be affected by the current handle's position to use for\n\t * self-snapping.\n\t */\n\tgetSelfSnapOutline?(handle: TLHandle): Geometry2d | null\n\t/**\n\t * By default, handles can't snap to their own shape because moving the handle might change the\n\t * snapping location which can cause feedback loops. You can override this by returning a\n\t * version of `points` that won't be affected by the current handle's position to use for\n\t * self-snapping.\n\t */\n\tgetSelfSnapPoints?(handle: TLHandle): VecModel[]\n}\n\ninterface AlignPointsSnap {\n\tsnaps: PointsSnapIndicator[]\n\tnudge: Vec\n}\n\nconst defaultGetSelfSnapOutline = () => null\nconst defaultGetSelfSnapPoints = () => []\n/** @public */\nexport class HandleSnaps {\n\treadonly editor: Editor\n\tconstructor(readonly manager: SnapManager) {\n\t\tthis.editor = manager.editor\n\t}\n\n\t@computed private getSnapGeometryCache() {\n\t\tconst { editor } = this\n\t\treturn editor.store.createComputedCache('handle snap geometry', (shape: TLShape) => {\n\t\t\tconst snapGeometry = editor.getShapeUtil(shape).getHandleSnapGeometry(shape)\n\t\t\tconst getSelfSnapOutline = snapGeometry.getSelfSnapOutline\n\t\t\t\t? snapGeometry.getSelfSnapOutline.bind(snapGeometry)\n\t\t\t\t: defaultGetSelfSnapOutline\n\t\t\tconst getSelfSnapPoints = snapGeometry.getSelfSnapPoints\n\t\t\t\t? snapGeometry.getSelfSnapPoints.bind(snapGeometry)\n\t\t\t\t: defaultGetSelfSnapPoints\n\n\t\t\treturn {\n\t\t\t\toutline:\n\t\t\t\t\tsnapGeometry.outline === undefined\n\t\t\t\t\t\t? editor.getShapeGeometry(shape)\n\t\t\t\t\t\t: snapGeometry.outline,\n\n\t\t\t\tpoints: snapGeometry.points ?? [],\n\t\t\t\tgetSelfSnapOutline,\n\t\t\t\tgetSelfSnapPoints,\n\t\t\t}\n\t\t})\n\t}\n\n\tprivate *iterateSnapPointsInPageSpace(currentShapeId: TLShapeId, currentHandle: TLHandle) {\n\t\tconst selfSnapPoints = this.getSnapGeometryCache()\n\t\t\t.get(currentShapeId)\n\t\t\t?.getSelfSnapPoints(currentHandle)\n\t\tif (selfSnapPoints && selfSnapPoints.length) {\n\t\t\tconst shapePageTransform = assertExists(this.editor.getShapePageTransform(currentShapeId))\n\t\t\tfor (const point of selfSnapPoints) {\n\t\t\t\tyield shapePageTransform.applyToPoint(point)\n\t\t\t}\n\t\t}\n\n\t\tfor (const shapeId of this.manager.getSnappableShapes()) {\n\t\t\tif (shapeId === currentShapeId) continue\n\t\t\tconst snapPoints = this.getSnapGeometryCache().get(shapeId)?.points\n\t\t\tif (!snapPoints || !snapPoints.length) continue\n\n\t\t\tconst shapePageTransform = assertExists(this.editor.getShapePageTransform(shapeId))\n\t\t\tfor (const point of snapPoints) {\n\t\t\t\tyield shapePageTransform.applyToPoint(point)\n\t\t\t}\n\t\t}\n\t}\n\n\tprivate *iterateSnapOutlines(currentShapeId: TLShapeId, currentHandle: TLHandle) {\n\t\tconst selfSnapOutline = this.getSnapGeometryCache()\n\t\t\t.get(currentShapeId)\n\t\t\t?.getSelfSnapOutline(currentHandle)\n\t\tif (selfSnapOutline) {\n\t\t\tyield { shapeId: currentShapeId, outline: selfSnapOutline }\n\t\t}\n\n\t\tfor (const shapeId of this.manager.getSnappableShapes()) {\n\t\t\tif (shapeId === currentShapeId) continue\n\n\t\t\tconst snapOutline = this.getSnapGeometryCache().get(shapeId)?.outline\n\t\t\tif (!snapOutline) continue\n\n\t\t\tyield { shapeId, outline: snapOutline }\n\t\t}\n\t}\n\n\tprivate getHandleSnapPosition({\n\t\tcurrentShapeId,\n\t\thandle,\n\t\thandleInPageSpace,\n\t}: {\n\t\tcurrentShapeId: TLShapeId\n\t\thandle: TLHandle\n\t\thandleInPageSpace: Vec\n\t}): Vec | null {\n\t\tconst snapThreshold = this.manager.getSnapThreshold()\n\n\t\t// We snap to two different parts of the shape's handle snap geometry:\n\t\t// 1. The `points`. These are handles or other key points that we want to snap to with a\n\t\t//    higher priority than the normal outline snapping.\n\t\t// 2. The `outline`. This describes the outline of the shape, and we just snap to the\n\t\t//    nearest point on that outline.\n\n\t\t// Start with the points:\n\t\tlet minDistanceForSnapPoint = snapThreshold\n\t\tlet nearestSnapPoint: Vec | null = null\n\t\tfor (const snapPoint of this.iterateSnapPointsInPageSpace(currentShapeId, handle)) {\n\t\t\tif (Vec.DistMin(handleInPageSpace, snapPoint, minDistanceForSnapPoint)) {\n\t\t\t\tminDistanceForSnapPoint = Vec.Dist(handleInPageSpace, snapPoint)\n\t\t\t\tnearestSnapPoint = snapPoint\n\t\t\t}\n\t\t}\n\n\t\t// if we found a snap point, return it - we don't need to check the outlines because points\n\t\t// have a higher priority\n\t\tif (nearestSnapPoint) return nearestSnapPoint\n\n\t\tlet minDistanceForOutline = snapThreshold\n\t\tlet nearestPointOnOutline: Vec | null = null\n\n\t\t// Labels and internal detail (a note's label, a geo check mark) are not outlines\n\t\t// to snap to. Group2d.nearestPoint throws when the filter leaves no child, so\n\t\t// skip those groups.\n\t\tconst filters = Geometry2dFilters.EXCLUDE_NON_STANDARD\n\t\tfor (const { shapeId, outline } of this.iterateSnapOutlines(currentShapeId, handle)) {\n\t\t\tif (\n\t\t\t\toutline instanceof Group2d &&\n\t\t\t\toutline.children.every((child) => child.isExcludedByFilter(filters))\n\t\t\t) {\n\t\t\t\tcontinue\n\t\t\t}\n\t\t\tconst shapePageTransform = assertExists(this.editor.getShapePageTransform(shapeId))\n\t\t\tconst pointInShapeSpace = this.editor.getPointInShapeSpace(shapeId, handleInPageSpace)\n\n\t\t\tconst nearestShapePointInShapeSpace = outline.nearestPoint(pointInShapeSpace, filters)\n\t\t\tconst nearestInPageSpace = shapePageTransform.applyToPoint(nearestShapePointInShapeSpace)\n\n\t\t\tif (Vec.DistMin(handleInPageSpace, nearestInPageSpace, minDistanceForOutline)) {\n\t\t\t\tminDistanceForOutline = Vec.Dist(handleInPageSpace, nearestInPageSpace)\n\t\t\t\tnearestPointOnOutline = nearestInPageSpace\n\t\t\t}\n\t\t}\n\n\t\t// if we found a point on the outline, return it\n\t\tif (nearestPointOnOutline) return nearestPointOnOutline\n\n\t\t// if not, there's no nearby snap point\n\t\treturn null\n\t}\n\n\tprivate getHandleSnapData({\n\t\thandle,\n\t\tcurrentShapeId,\n\t}: {\n\t\thandle: TLHandle\n\t\tcurrentShapeId: TLShapeId\n\t}): AlignPointsSnap | null {\n\t\tconst snapThreshold = this.manager.getSnapThreshold()\n\t\tconst currentShapeTransform = assertExists(this.editor.getShapePageTransform(currentShapeId))\n\t\tconst handleInPageSpace = currentShapeTransform.applyToPoint(handle)\n\n\t\tlet nearestXSnap: Vec | null = null\n\t\tlet nearestYSnap: Vec | null = null\n\t\tlet minOffsetX = snapThreshold\n\t\tlet minOffsetY = snapThreshold\n\n\t\tfor (const snapPoint of this.iterateSnapPointsInPageSpace(currentShapeId, handle)) {\n\t\t\tconst offsetX = Math.abs(handleInPageSpace.x - snapPoint.x)\n\t\t\tconst offsetY = Math.abs(handleInPageSpace.y - snapPoint.y)\n\t\t\tif (offsetX < minOffsetX) {\n\t\t\t\tminOffsetX = offsetX\n\t\t\t\tnearestXSnap = snapPoint\n\t\t\t}\n\t\t\tif (offsetY < minOffsetY) {\n\t\t\t\tminOffsetY = offsetY\n\t\t\t\tnearestYSnap = snapPoint\n\t\t\t}\n\t\t}\n\n\t\tif (!nearestXSnap && !nearestYSnap) {\n\t\t\treturn null\n\t\t}\n\n\t\tconst nudge = new Vec(\n\t\t\tnearestXSnap ? nearestXSnap.x - handleInPageSpace.x : 0,\n\t\t\tnearestYSnap ? nearestYSnap.y - handleInPageSpace.y : 0\n\t\t)\n\n\t\tconst snappedHandle = Vec.Add(handleInPageSpace, nudge)\n\t\tconst snaps: PointsSnapIndicator[] = []\n\n\t\tif (nearestXSnap) {\n\t\t\tconst snappedHandleOnX = new Vec(nearestXSnap.x, snappedHandle.y)\n\t\t\tsnaps.push({\n\t\t\t\tid: uniqueId(),\n\t\t\t\ttype: 'points',\n\t\t\t\tpoints: [nearestXSnap, snappedHandleOnX],\n\t\t\t})\n\t\t}\n\t\tif (nearestYSnap) {\n\t\t\tconst snappedHandleOnY = new Vec(snappedHandle.x, nearestYSnap.y)\n\t\t\tsnaps.push({\n\t\t\t\tid: uniqueId(),\n\t\t\t\ttype: 'points',\n\t\t\t\tpoints: [nearestYSnap, snappedHandleOnY],\n\t\t\t})\n\t\t}\n\n\t\treturn { snaps, nudge }\n\t}\n\n\tsnapHandle({\n\t\tcurrentShapeId,\n\t\thandle,\n\t}: {\n\t\tcurrentShapeId: TLShapeId\n\t\thandle: TLHandle\n\t}): SnapData | null {\n\t\tconst currentShapeTransform = assertExists(this.editor.getShapePageTransform(currentShapeId))\n\t\tconst handleInPageSpace = currentShapeTransform.applyToPoint(handle)\n\t\t// eslint-disable-next-line @typescript-eslint/no-deprecated\n\t\tconst snapType = handle.canSnap ? 'point' : handle.snapType\n\n\t\tif (snapType === 'point') {\n\t\t\tconst snapPosition = this.getHandleSnapPosition({ currentShapeId, handle, handleInPageSpace })\n\n\t\t\tif (!snapPosition) {\n\t\t\t\treturn null\n\t\t\t}\n\n\t\t\tthis.manager.setIndicators([\n\t\t\t\t{\n\t\t\t\t\tid: uniqueId(),\n\t\t\t\t\ttype: 'points',\n\t\t\t\t\tpoints: [snapPosition],\n\t\t\t\t},\n\t\t\t])\n\n\t\t\treturn { nudge: Vec.Sub(snapPosition, handleInPageSpace) }\n\t\t}\n\n\t\tif (snapType === 'align') {\n\t\t\tconst snapData = this.getHandleSnapData({\n\t\t\t\thandle,\n\t\t\t\tcurrentShapeId,\n\t\t\t})\n\n\t\t\tif (!snapData) {\n\t\t\t\treturn null\n\t\t\t}\n\n\t\t\tthis.manager.setIndicators(snapData.snaps)\n\n\t\t\treturn { nudge: snapData.nudge }\n\t\t}\n\n\t\treturn null\n\t}\n}\n"],
+  "mappings": "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",
   "names": []
 }

package/dist-esm/lib/editor/managers/SnapManager/SnapManager.mjs

@@ -39,18 +39,18 @@ class SnapManager {
   getSnappableShapes() {
     const { editor } = this;
     const renderingBounds = editor.getViewportPageBounds();
-    const selectedShapeIds = editor.getSelectedShapeIds();
+    const selectedShapeIds = new Set(editor.getSelectedShapeIds());
     const snappableShapes = /* @__PURE__ */ new Set();
     const collectSnappableShapesFromParent = (parentId) => {
       if (isShapeId(parentId)) {
         const parent = editor.getShape(parentId);
-        if (parent && editor.isShapeFrameLike(parent)) {
+        if (parent && editor.isShapeFrameLike(parent) && !editor.isShapeHidden(parent)) {
           snappableShapes.add(parentId);
         }
       }
       const sortedChildIds = editor.getSortedChildIdsForParent(parentId);
       for (const childId of sortedChildIds) {
-        if (selectedShapeIds.includes(childId)) continue;
+        if (selectedShapeIds.has(childId)) continue;
         const childShape = editor.getShape(childId);
         if (!childShape) continue;
         const util = editor.getShapeUtil(childShape);
@@ -61,6 +61,7 @@ class SnapManager {
           collectSnappableShapesFromParent(childId);
           continue;
         }
+        if (editor.isShapeHidden(childShape)) continue;
         snappableShapes.add(childId);
       }
     };

package/dist-esm/lib/editor/managers/SnapManager/SnapManager.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../src/lib/editor/managers/SnapManager/SnapManager.ts"],
-  "sourcesContent": ["import { EMPTY_ARRAY, atom, computed } from '@tldraw/state'\nimport { TLParentId, TLShapeId, isShapeId } from '@tldraw/tlschema'\nimport { Vec, VecLike } from '../../../primitives/Vec'\nimport type { Editor } from '../../Editor'\nimport { BoundsSnaps } from './BoundsSnaps'\nimport { HandleSnaps } from './HandleSnaps'\n\n/** @public */\nexport interface PointsSnapIndicator {\n\tid: string\n\ttype: 'points'\n\tpoints: VecLike[]\n}\n\n/** @public */\nexport interface GapsSnapIndicator {\n\tid: string\n\ttype: 'gaps'\n\tdirection: 'horizontal' | 'vertical'\n\tgaps: Array<{\n\t\tstartEdge: [VecLike, VecLike]\n\t\tendEdge: [VecLike, VecLike]\n\t}>\n}\n\n/** @public */\nexport type SnapIndicator = PointsSnapIndicator | GapsSnapIndicator\n\n/** @public */\nexport interface SnapData {\n\tnudge: Vec\n}\n\n/** @public */\nexport class SnapManager {\n\treadonly shapeBounds: BoundsSnaps\n\treadonly handles: HandleSnaps\n\n\tprivate _snapIndicators = atom<SnapIndicator[] | undefined>('snapLines', undefined)\n\n\tconstructor(public readonly editor: Editor) {\n\t\tthis.shapeBounds = new BoundsSnaps(this)\n\t\tthis.handles = new HandleSnaps(this)\n\t}\n\n\tgetIndicators() {\n\t\treturn this._snapIndicators.get() ?? (EMPTY_ARRAY as SnapIndicator[])\n\t}\n\n\tclearIndicators() {\n\t\tif (this.getIndicators().length) {\n\t\t\tthis._snapIndicators.set(undefined)\n\t\t}\n\t}\n\n\tsetIndicators(indicators: SnapIndicator[]) {\n\t\tthis._snapIndicators.set(indicators)\n\t}\n\n\t@computed getSnapThreshold() {\n\t\treturn this.editor.options.snapThreshold / this.editor.getZoomLevel()\n\t}\n\n\t// TODO: make this an incremental derivation\n\t@computed getSnappableShapes(): Set<TLShapeId> {\n\t\tconst { editor } = this\n\t\tconst renderingBounds = editor.getViewportPageBounds()\n\t\tconst selectedShapeIds = editor.getSelectedShapeIds()\n\n\t\tconst snappableShapes: Set<TLShapeId> = new Set()\n\n\t\tconst collectSnappableShapesFromParent = (parentId: TLParentId) => {\n\t\t\tif (isShapeId(parentId)) {\n\t\t\t\tconst parent = editor.getShape(parentId)\n\t\t\t\tif (parent && editor.isShapeFrameLike(parent)) {\n\t\t\t\t\tsnappableShapes.add(parentId)\n\t\t\t\t}\n\t\t\t}\n\t\t\tconst sortedChildIds = editor.getSortedChildIdsForParent(parentId)\n\t\t\tfor (const childId of sortedChildIds) {\n\t\t\t\t// Skip any selected ids\n\t\t\t\tif (selectedShapeIds.includes(childId)) continue\n\t\t\t\tconst childShape = editor.getShape(childId)\n\t\t\t\tif (!childShape) continue\n\t\t\t\tconst util = editor.getShapeUtil(childShape)\n\t\t\t\t// Skip any shapes that don't allow snapping\n\t\t\t\tif (!util.canSnap(childShape)) continue\n\t\t\t\t// Only consider shapes if they're inside of the viewport page bounds\n\t\t\t\tconst pageBounds = editor.getShapePageBounds(childId)\n\t\t\t\tif (!(pageBounds && renderingBounds.includes(pageBounds))) continue\n\t\t\t\t// Snap to children of groups but not group itself\n\t\t\t\tif (editor.isShapeOfType(childShape, 'group')) {\n\t\t\t\t\tcollectSnappableShapesFromParent(childId)\n\t\t\t\t\tcontinue\n\t\t\t\t}\n\t\t\t\tsnappableShapes.add(childId)\n\t\t\t}\n\t\t}\n\n\t\tcollectSnappableShapesFromParent(this.getCurrentCommonAncestor() ?? editor.getCurrentPageId())\n\n\t\treturn snappableShapes\n\t}\n\n\t// This needs to be external from any expensive work\n\t@computed getCurrentCommonAncestor() {\n\t\treturn this.editor.findCommonAncestor(this.editor.getSelectedShapes())\n\t}\n}\n"],
-  "mappings": ";;;;;;;;;;AAAA,SAAS,aAAa,MAAM,gBAAgB;AAC5C,SAAgC,iBAAiB;AAGjD,SAAS,mBAAmB;AAC5B,SAAS,mBAAmB;AA6BrB,MAAM,YAAY;AAAA,EAMxB,YAA4B,QAAgB;AAAhB;AAC3B,SAAK,cAAc,IAAI,YAAY,IAAI;AACvC,SAAK,UAAU,IAAI,YAAY,IAAI;AAAA,EACpC;AAAA,EAH4B;AAAA,EALnB;AAAA,EACA;AAAA,EAED,kBAAkB,KAAkC,aAAa,MAAS;AAAA,EAOlF,gBAAgB;AACf,WAAO,KAAK,gBAAgB,IAAI,KAAM;AAAA,EACvC;AAAA,EAEA,kBAAkB;AACjB,QAAI,KAAK,cAAc,EAAE,QAAQ;AAChC,WAAK,gBAAgB,IAAI,MAAS;AAAA,IACnC;AAAA,EACD;AAAA,EAEA,cAAc,YAA6B;AAC1C,SAAK,gBAAgB,IAAI,UAAU;AAAA,EACpC;AAAA,EAEU,mBAAmB;AAC5B,WAAO,KAAK,OAAO,QAAQ,gBAAgB,KAAK,OAAO,aAAa;AAAA,EACrE;AAAA,EAGU,qBAAqC;AAC9C,UAAM,EAAE,OAAO,IAAI;AACnB,UAAM,kBAAkB,OAAO,sBAAsB;AACrD,UAAM,mBAAmB,OAAO,oBAAoB;AAEpD,UAAM,kBAAkC,oBAAI,IAAI;AAEhD,UAAM,mCAAmC,CAAC,aAAyB;AAClE,UAAI,UAAU,QAAQ,GAAG;AACxB,cAAM,SAAS,OAAO,SAAS,QAAQ;AACvC,YAAI,UAAU,OAAO,iBAAiB,MAAM,GAAG;AAC9C,0BAAgB,IAAI,QAAQ;AAAA,QAC7B;AAAA,MACD;AACA,YAAM,iBAAiB,OAAO,2BAA2B,QAAQ;AACjE,iBAAW,WAAW,gBAAgB;AAErC,YAAI,iBAAiB,SAAS,OAAO,EAAG;AACxC,cAAM,aAAa,OAAO,SAAS,OAAO;AAC1C,YAAI,CAAC,WAAY;AACjB,cAAM,OAAO,OAAO,aAAa,UAAU;AAE3C,YAAI,CAAC,KAAK,QAAQ,UAAU,EAAG;AAE/B,cAAM,aAAa,OAAO,mBAAmB,OAAO;AACpD,YAAI,EAAE,cAAc,gBAAgB,SAAS,UAAU,GAAI;AAE3D,YAAI,OAAO,cAAc,YAAY,OAAO,GAAG;AAC9C,2CAAiC,OAAO;AACxC;AAAA,QACD;AACA,wBAAgB,IAAI,OAAO;AAAA,MAC5B;AAAA,IACD;AAEA,qCAAiC,KAAK,yBAAyB,KAAK,OAAO,iBAAiB,CAAC;AAE7F,WAAO;AAAA,EACR;AAAA,EAGU,2BAA2B;AACpC,WAAO,KAAK,OAAO,mBAAmB,KAAK,OAAO,kBAAkB,CAAC;AAAA,EACtE;AACD;AAjDW;AAAA,EAAT;AAAA,GAzBW,YAyBF;AAKA;AAAA,EAAT;AAAA,GA9BW,YA8BF;AAyCA;AAAA,EAAT;AAAA,GAvEW,YAuEF;",
+  "sourcesContent": ["import { EMPTY_ARRAY, atom, computed } from '@tldraw/state'\nimport { TLParentId, TLShapeId, isShapeId } from '@tldraw/tlschema'\nimport { Vec, VecLike } from '../../../primitives/Vec'\nimport type { Editor } from '../../Editor'\nimport { BoundsSnaps } from './BoundsSnaps'\nimport { HandleSnaps } from './HandleSnaps'\n\n/** @public */\nexport interface PointsSnapIndicator {\n\tid: string\n\ttype: 'points'\n\tpoints: VecLike[]\n}\n\n/** @public */\nexport interface GapsSnapIndicator {\n\tid: string\n\ttype: 'gaps'\n\tdirection: 'horizontal' | 'vertical'\n\tgaps: Array<{\n\t\tstartEdge: [VecLike, VecLike]\n\t\tendEdge: [VecLike, VecLike]\n\t}>\n}\n\n/** @public */\nexport type SnapIndicator = PointsSnapIndicator | GapsSnapIndicator\n\n/** @public */\nexport interface SnapData {\n\tnudge: Vec\n}\n\n/** @public */\nexport class SnapManager {\n\treadonly shapeBounds: BoundsSnaps\n\treadonly handles: HandleSnaps\n\n\tprivate _snapIndicators = atom<SnapIndicator[] | undefined>('snapLines', undefined)\n\n\tconstructor(public readonly editor: Editor) {\n\t\tthis.shapeBounds = new BoundsSnaps(this)\n\t\tthis.handles = new HandleSnaps(this)\n\t}\n\n\tgetIndicators() {\n\t\treturn this._snapIndicators.get() ?? (EMPTY_ARRAY as SnapIndicator[])\n\t}\n\n\tclearIndicators() {\n\t\tif (this.getIndicators().length) {\n\t\t\tthis._snapIndicators.set(undefined)\n\t\t}\n\t}\n\n\tsetIndicators(indicators: SnapIndicator[]) {\n\t\tthis._snapIndicators.set(indicators)\n\t}\n\n\t@computed getSnapThreshold() {\n\t\treturn this.editor.options.snapThreshold / this.editor.getZoomLevel()\n\t}\n\n\t// TODO: make this an incremental derivation\n\t@computed getSnappableShapes(): Set<TLShapeId> {\n\t\tconst { editor } = this\n\t\tconst renderingBounds = editor.getViewportPageBounds()\n\t\tconst selectedShapeIds = new Set(editor.getSelectedShapeIds())\n\n\t\tconst snappableShapes: Set<TLShapeId> = new Set()\n\n\t\tconst collectSnappableShapesFromParent = (parentId: TLParentId) => {\n\t\t\tif (isShapeId(parentId)) {\n\t\t\t\tconst parent = editor.getShape(parentId)\n\t\t\t\tif (parent && editor.isShapeFrameLike(parent) && !editor.isShapeHidden(parent)) {\n\t\t\t\t\tsnappableShapes.add(parentId)\n\t\t\t\t}\n\t\t\t}\n\t\t\tconst sortedChildIds = editor.getSortedChildIdsForParent(parentId)\n\t\t\tfor (const childId of sortedChildIds) {\n\t\t\t\t// Skip any selected ids\n\t\t\t\tif (selectedShapeIds.has(childId)) continue\n\t\t\t\tconst childShape = editor.getShape(childId)\n\t\t\t\tif (!childShape) continue\n\t\t\t\tconst util = editor.getShapeUtil(childShape)\n\t\t\t\t// Skip any shapes that don't allow snapping\n\t\t\t\tif (!util.canSnap(childShape)) continue\n\t\t\t\t// Only consider shapes if they're inside of the viewport page bounds\n\t\t\t\tconst pageBounds = editor.getShapePageBounds(childId)\n\t\t\t\tif (!(pageBounds && renderingBounds.includes(pageBounds))) continue\n\t\t\t\t// Snap to children of groups but not group itself. A hidden group's\n\t\t\t\t// children may still override to visible, so recurse before the check.\n\t\t\t\tif (editor.isShapeOfType(childShape, 'group')) {\n\t\t\t\t\tcollectSnappableShapesFromParent(childId)\n\t\t\t\t\tcontinue\n\t\t\t\t}\n\t\t\t\tif (editor.isShapeHidden(childShape)) continue\n\t\t\t\tsnappableShapes.add(childId)\n\t\t\t}\n\t\t}\n\n\t\tcollectSnappableShapesFromParent(this.getCurrentCommonAncestor() ?? editor.getCurrentPageId())\n\n\t\treturn snappableShapes\n\t}\n\n\t// This needs to be external from any expensive work\n\t@computed getCurrentCommonAncestor() {\n\t\treturn this.editor.findCommonAncestor(this.editor.getSelectedShapes())\n\t}\n}\n"],
+  "mappings": ";;;;;;;;;;AAAA,SAAS,aAAa,MAAM,gBAAgB;AAC5C,SAAgC,iBAAiB;AAGjD,SAAS,mBAAmB;AAC5B,SAAS,mBAAmB;AA6BrB,MAAM,YAAY;AAAA,EAMxB,YAA4B,QAAgB;AAAhB;AAC3B,SAAK,cAAc,IAAI,YAAY,IAAI;AACvC,SAAK,UAAU,IAAI,YAAY,IAAI;AAAA,EACpC;AAAA,EAH4B;AAAA,EALnB;AAAA,EACA;AAAA,EAED,kBAAkB,KAAkC,aAAa,MAAS;AAAA,EAOlF,gBAAgB;AACf,WAAO,KAAK,gBAAgB,IAAI,KAAM;AAAA,EACvC;AAAA,EAEA,kBAAkB;AACjB,QAAI,KAAK,cAAc,EAAE,QAAQ;AAChC,WAAK,gBAAgB,IAAI,MAAS;AAAA,IACnC;AAAA,EACD;AAAA,EAEA,cAAc,YAA6B;AAC1C,SAAK,gBAAgB,IAAI,UAAU;AAAA,EACpC;AAAA,EAEU,mBAAmB;AAC5B,WAAO,KAAK,OAAO,QAAQ,gBAAgB,KAAK,OAAO,aAAa;AAAA,EACrE;AAAA,EAGU,qBAAqC;AAC9C,UAAM,EAAE,OAAO,IAAI;AACnB,UAAM,kBAAkB,OAAO,sBAAsB;AACrD,UAAM,mBAAmB,IAAI,IAAI,OAAO,oBAAoB,CAAC;AAE7D,UAAM,kBAAkC,oBAAI,IAAI;AAEhD,UAAM,mCAAmC,CAAC,aAAyB;AAClE,UAAI,UAAU,QAAQ,GAAG;AACxB,cAAM,SAAS,OAAO,SAAS,QAAQ;AACvC,YAAI,UAAU,OAAO,iBAAiB,MAAM,KAAK,CAAC,OAAO,cAAc,MAAM,GAAG;AAC/E,0BAAgB,IAAI,QAAQ;AAAA,QAC7B;AAAA,MACD;AACA,YAAM,iBAAiB,OAAO,2BAA2B,QAAQ;AACjE,iBAAW,WAAW,gBAAgB;AAErC,YAAI,iBAAiB,IAAI,OAAO,EAAG;AACnC,cAAM,aAAa,OAAO,SAAS,OAAO;AAC1C,YAAI,CAAC,WAAY;AACjB,cAAM,OAAO,OAAO,aAAa,UAAU;AAE3C,YAAI,CAAC,KAAK,QAAQ,UAAU,EAAG;AAE/B,cAAM,aAAa,OAAO,mBAAmB,OAAO;AACpD,YAAI,EAAE,cAAc,gBAAgB,SAAS,UAAU,GAAI;AAG3D,YAAI,OAAO,cAAc,YAAY,OAAO,GAAG;AAC9C,2CAAiC,OAAO;AACxC;AAAA,QACD;AACA,YAAI,OAAO,cAAc,UAAU,EAAG;AACtC,wBAAgB,IAAI,OAAO;AAAA,MAC5B;AAAA,IACD;AAEA,qCAAiC,KAAK,yBAAyB,KAAK,OAAO,iBAAiB,CAAC;AAE7F,WAAO;AAAA,EACR;AAAA,EAGU,2BAA2B;AACpC,WAAO,KAAK,OAAO,mBAAmB,KAAK,OAAO,kBAAkB,CAAC;AAAA,EACtE;AACD;AAnDW;AAAA,EAAT;AAAA,GAzBW,YAyBF;AAKA;AAAA,EAAT;AAAA,GA9BW,YA8BF;AA2CA;AAAA,EAAT;AAAA,GAzEW,YAyEF;",
   "names": []
 }

package/dist-esm/lib/editor/managers/TextManager/TextManager.mjs

@@ -178,18 +178,18 @@ class TextManager extends EditorManager {
     const offsetX = -elmBounds.left;
     const offsetY = -elmBounds.top;
     const range = new Range();
-    const textNode = element.childNodes[0];
-    let idx = 0;
     let currentSpan = null;
     let prevCharWasSpaceCharacter = null;
     let prevCharTop = 0;
     let prevCharLeftForRTLTest = 0;
     let didTruncate = false;
     for (const childNode of element.childNodes) {
+      if (didTruncate) break;
       if (childNode.nodeType !== Node.TEXT_NODE) continue;
+      let idx = 0;
       for (const segment of iterateGraphemes(childNode.textContent ?? "")) {
-        range.setStart(textNode, idx);
-        range.setEnd(textNode, idx + segment.length);
+        range.setStart(childNode, idx);
+        range.setEnd(childNode, idx + segment.length);
         const rects = range.getClientRects();
         const rect = rects[rects.length - 1];
         if (!rect) {

package/dist-esm/lib/editor/managers/TextManager/TextManager.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../src/lib/editor/managers/TextManager/TextManager.ts"],
-  "sourcesContent": ["import { BoxModel, TLDefaultHorizontalAlignStyle } from '@tldraw/tlschema'\nimport { iterateGraphemes, objectMapKeys } from '@tldraw/utils'\nimport type { Editor } from '../../Editor'\nimport { EditorManager } from '../EditorManager'\n\n/**\n * The whole-pixel line-height for a given font size and tldraw's unitless line-height\n * multiplier. tldraw's theme stores line-height as a multiplier (e.g. 1.35); resolving it\n * to a whole pixel keeps line spacing identical across rendering engines, which otherwise\n * disagree on fractional line boxes (WebKit snaps them to whole pixels, Blink keeps the\n * fraction) and let multi-line text drift apart. Apply it everywhere line-height is used \u2014\n * measurement, on-canvas render, and export \u2014 so geometry and rendering agree.\n * See https://github.com/tldraw/tldraw/issues/8970.\n *\n * @public\n */\nexport function resolveLineHeightPx(fontSize: number, lineHeight: number): number {\n\treturn Math.round(fontSize * lineHeight)\n}\n\nconst fixNewLines = /\\r?\\n|\\r/g\n\nfunction normalizeTextForDom(text: string) {\n\treturn text\n\t\t.replace(fixNewLines, '\\n')\n\t\t.split('\\n')\n\t\t.map((x) => x || ' ')\n\t\t.join('\\n')\n}\n\nconst textAlignmentsForLtr = {\n\tstart: 'left',\n\t'start-legacy': 'left',\n\tmiddle: 'center',\n\t'middle-legacy': 'center',\n\tend: 'right',\n\t'end-legacy': 'right',\n}\n\ninterface PoolItem {\n\tel: HTMLDivElement\n\thtml: string\n\tappliedStyleKeys: string[]\n}\n\n/** @public */\nexport interface BatchMeasurementRequest {\n\thtml: string\n\topts: TLMeasureTextOpts\n}\n\n/** @public */\nexport type TLMeasuredTextSize = BoxModel & {\n\tscrollWidth: number\n}\n\n/** @public */\nexport interface TLMeasureTextOpts {\n\tfontStyle: string\n\tfontWeight: string\n\tfontFamily: string\n\tfontSize: number\n\t/** This must be a number, e.g. 1.35, not a pixel value. */\n\tlineHeight: number\n\t/**\n\t * When maxWidth is a number, the text will be wrapped to that maxWidth. When maxWidth\n\t * is null, the text will be measured without wrapping, but explicit line breaks and\n\t * space are preserved.\n\t */\n\tmaxWidth: null | number\n\tminWidth?: null | number\n\t// todo: make this a number so that it is consistent with other TLMeasureTextSpanOpts\n\tpadding: string\n\totherStyles?: Record<string, string>\n\tdisableOverflowWrapBreaking?: boolean\n\tmeasureScrollWidth?: boolean\n}\n\n/** @public */\nexport interface TLMeasureTextSpanOpts {\n\toverflow: 'wrap' | 'truncate-ellipsis' | 'truncate-clip'\n\twidth: number\n\theight: number\n\tpadding: number\n\tfontSize: number\n\tfontWeight: string\n\tfontFamily: string\n\tfontStyle: string\n\tlineHeight: number\n\ttextAlign: TLDefaultHorizontalAlignStyle\n\totherStyles?: Record<string, string>\n\tmeasureScrollWidth?: boolean\n}\n\nconst spaceCharacterRegex = /\\s/\n\nconst initialDefaultStyles = Object.freeze({\n\t'overflow-wrap': 'break-word',\n\t'word-break': 'auto',\n\twidth: null,\n\theight: null,\n\t'max-width': null,\n\t'min-width': null,\n})\n\n/** @public */\nexport class TextManager extends EditorManager {\n\tprivate elm: HTMLDivElement\n\tprivate poolElms: PoolItem[] = []\n\n\tconstructor(editor: Editor) {\n\t\tsuper(editor)\n\t\tthis.elm = this.createMeasurementEl()\n\t\tthis.editor.getContainer().appendChild(this.elm)\n\t\tthis.register(() => {\n\t\t\tthis.elm.remove()\n\t\t\tfor (const { el } of this.poolElms) {\n\t\t\t\tel.remove()\n\t\t\t}\n\t\t\tthis.poolElms.length = 0\n\t\t})\n\t}\n\n\tprivate createMeasurementEl(): HTMLDivElement {\n\t\tconst elm = this.editor.getContainerDocument().createElement('div')\n\t\telm.classList.add('tl-text')\n\t\telm.classList.add('tl-text-measure')\n\t\telm.setAttribute('dir', 'auto')\n\t\telm.tabIndex = -1\n\t\tfor (const key of objectMapKeys(initialDefaultStyles)) {\n\t\t\telm.style.setProperty(key, initialDefaultStyles[key])\n\t\t}\n\n\t\treturn elm\n\t}\n\n\tprivate resetElementStyles(el: HTMLElement, appliedStyleKeys: string[]) {\n\t\tfor (const key of appliedStyleKeys) {\n\t\t\tif (key in initialDefaultStyles) {\n\t\t\t\tel.style.setProperty(key, initialDefaultStyles[key as keyof typeof initialDefaultStyles])\n\t\t\t} else {\n\t\t\t\tel.style.removeProperty(key)\n\t\t\t}\n\t\t}\n\t}\n\n\tprivate setElementStyles(el: HTMLElement, styles: Record<string, string | undefined | null>) {\n\t\ttype StyleValue = string | null\n\t\ttype RestoreEntry = [prop: string, value: StyleValue]\n\n\t\tconst restore: RestoreEntry[] = []\n\n\t\tfor (const [key, nextValue] of Object.entries(styles)) {\n\t\t\tconst oldValue = el.style.getPropertyValue(key)\n\n\t\t\tif (typeof nextValue === 'string') {\n\t\t\t\tif (oldValue === nextValue) continue\n\t\t\t\trestore.push([key, oldValue || null])\n\t\t\t\tel.style.setProperty(key, nextValue)\n\t\t\t} else {\n\t\t\t\tif (!oldValue) continue\n\t\t\t\trestore.push([key, oldValue])\n\t\t\t\tel.style.removeProperty(key)\n\t\t\t}\n\t\t}\n\n\t\treturn () => {\n\t\t\tfor (const [key, value] of restore) {\n\t\t\t\tif (value === null || value === '') el.style.removeProperty(key)\n\t\t\t\telse el.style.setProperty(key, value)\n\t\t\t}\n\t\t}\n\t}\n\n\tprivate getMeasureStyles(opts: TLMeasureTextOpts): Record<string, string | undefined> {\n\t\treturn {\n\t\t\t'font-family': opts.fontFamily,\n\t\t\t'font-style': opts.fontStyle,\n\t\t\t'font-weight': opts.fontWeight,\n\t\t\t'font-size': opts.fontSize + 'px',\n\t\t\t'line-height': `${resolveLineHeightPx(opts.fontSize, opts.lineHeight)}px`,\n\t\t\t// Unitless multiplier consumed by the .tl-rich-text h1\u2013h6 rule (see editor.css),\n\t\t\t// so heading measurement matches on-canvas rendering.\n\t\t\t'--tl-rich-text-heading-line-height': `${opts.lineHeight}`,\n\t\t\tpadding: opts.padding,\n\t\t\t'max-width': opts.maxWidth ? opts.maxWidth + 'px' : undefined,\n\t\t\t'min-width': opts.minWidth ? opts.minWidth + 'px' : undefined,\n\t\t\t'overflow-wrap': opts.disableOverflowWrapBreaking ? 'normal' : 'break-word',\n\t\t\t...opts.otherStyles,\n\t\t}\n\t}\n\n\tprivate ensurePoolSize(size: number) {\n\t\tif (this.poolElms.length >= size) return\n\n\t\tconst fragment = this.editor.getContainerDocument().createDocumentFragment()\n\t\twhile (this.poolElms.length < size) {\n\t\t\tconst el = this.createMeasurementEl()\n\t\t\tthis.poolElms.push({ el, html: '', appliedStyleKeys: [] })\n\t\t\tfragment.appendChild(el)\n\t\t}\n\t\tthis.editor.getContainer().appendChild(fragment)\n\t}\n\n\tprivate getPoolItem(index: number): PoolItem {\n\t\tthis.ensurePoolSize(index + 1)\n\t\treturn this.poolElms[index]\n\t}\n\n\tmeasureHtmlBatch(requests: BatchMeasurementRequest[]): TLMeasuredTextSize[] {\n\t\tif (requests.length === 0) return []\n\n\t\twhile (this.poolElms.length > requests.length) {\n\t\t\tconst { el } = this.poolElms.pop()!\n\t\t\tel.remove()\n\t\t}\n\n\t\tfor (let i = 0; i < requests.length; i++) {\n\t\t\tconst { html, opts } = requests[i]\n\t\t\tconst poolItem = this.getPoolItem(i)\n\n\t\t\tconst { el } = poolItem\n\t\t\tthis.resetElementStyles(el, poolItem.appliedStyleKeys)\n\t\t\tconst styles = this.getMeasureStyles(opts)\n\t\t\tthis.setElementStyles(el, styles)\n\t\t\tpoolItem.appliedStyleKeys = Object.keys(styles)\n\t\t\t// Skip innerHTML parsing if the content hasn't changed\n\t\t\tif (poolItem.html !== html) {\n\t\t\t\tel.innerHTML = html\n\t\t\t\tpoolItem.html = html\n\t\t\t}\n\t\t}\n\n\t\tconst results: TLMeasuredTextSize[] = []\n\t\tfor (let i = 0; i < requests.length; i++) {\n\t\t\tconst el = this.getPoolItem(i).el\n\t\t\tconst scrollWidth = requests[i].opts.measureScrollWidth ? el.scrollWidth : 0\n\t\t\tconst rect = el.getBoundingClientRect()\n\t\t\tresults.push({\n\t\t\t\tx: 0,\n\t\t\t\ty: 0,\n\t\t\t\tw: rect.width,\n\t\t\t\th: rect.height,\n\t\t\t\tscrollWidth,\n\t\t\t})\n\t\t}\n\n\t\treturn results\n\t}\n\n\tmeasureText(textToMeasure: string, opts: TLMeasureTextOpts): TLMeasuredTextSize {\n\t\tconst div = this.editor.getContainerDocument().createElement('div')\n\t\tdiv.textContent = normalizeTextForDom(textToMeasure)\n\t\treturn this.measureHtml(div.innerHTML, opts)\n\t}\n\n\tmeasureHtml(html: string, opts: TLMeasureTextOpts): TLMeasuredTextSize {\n\t\tconst { elm } = this\n\n\t\tconst restoreStyles = this.setElementStyles(elm, this.getMeasureStyles(opts))\n\n\t\ttry {\n\t\t\telm.innerHTML = html\n\n\t\t\tconst scrollWidth = opts.measureScrollWidth ? elm.scrollWidth : 0\n\t\t\tconst rect = elm.getBoundingClientRect()\n\n\t\t\treturn {\n\t\t\t\tx: 0,\n\t\t\t\ty: 0,\n\t\t\t\tw: rect.width,\n\t\t\t\th: rect.height,\n\t\t\t\tscrollWidth,\n\t\t\t}\n\t\t} finally {\n\t\t\trestoreStyles()\n\t\t}\n\t}\n\n\t/**\n\t * Given an html element, measure the position of each span of unbroken\n\t * word/white-space characters within any text nodes it contains.\n\t */\n\tmeasureElementTextNodeSpans(\n\t\telement: HTMLElement,\n\t\t{ shouldTruncateToFirstLine = false }: { shouldTruncateToFirstLine?: boolean } = {}\n\t): { spans: { box: BoxModel; text: string }[]; didTruncate: boolean } {\n\t\tconst spans = []\n\n\t\t// Measurements of individual spans are relative to the containing element\n\t\tconst elmBounds = element.getBoundingClientRect()\n\t\tconst offsetX = -elmBounds.left\n\t\tconst offsetY = -elmBounds.top\n\n\t\t// we measure by creating a range that spans each character in the elements text node\n\t\tconst range = new Range()\n\t\tconst textNode = element.childNodes[0]\n\t\tlet idx = 0\n\n\t\tlet currentSpan = null\n\t\tlet prevCharWasSpaceCharacter = null\n\t\tlet prevCharTop = 0\n\t\tlet prevCharLeftForRTLTest = 0\n\t\tlet didTruncate = false\n\t\tfor (const childNode of element.childNodes) {\n\t\t\tif (childNode.nodeType !== Node.TEXT_NODE) continue\n\n\t\t\tfor (const segment of iterateGraphemes(childNode.textContent ?? '')) {\n\t\t\t\t// place the range around the grapheme we're interested in\n\t\t\t\trange.setStart(textNode, idx)\n\t\t\t\trange.setEnd(textNode, idx + segment.length)\n\t\t\t\t// measure the range. some browsers return multiple rects for the\n\t\t\t\t// first char in a new line - one for the line break, and one for\n\t\t\t\t// the character itself. we're only interested in the character.\n\t\t\t\tconst rects = range.getClientRects()\n\t\t\t\tconst rect = rects[rects.length - 1]\n\n\t\t\t\t// some graphemes produce no layout rectangle (e.g. zero-width\n\t\t\t\t// spaces or newlines). skip them rather than crashing, but keep\n\t\t\t\t// advancing the index so later graphemes stay aligned.\n\t\t\t\t// See https://github.com/tldraw/tldraw/issues/9112.\n\t\t\t\tif (!rect) {\n\t\t\t\t\tidx += segment.length\n\t\t\t\t\tcontinue\n\t\t\t\t}\n\n\t\t\t\t// calculate the position of the character relative to the element\n\t\t\t\tconst top = rect.top + offsetY\n\t\t\t\tconst left = rect.left + offsetX\n\t\t\t\tconst right = rect.right + offsetX\n\t\t\t\tconst isRTL = left < prevCharLeftForRTLTest\n\n\t\t\t\tconst isSpaceCharacter = spaceCharacterRegex.test(segment)\n\t\t\t\tif (\n\t\t\t\t\t// If we're at a word boundary...\n\t\t\t\t\tisSpaceCharacter !== prevCharWasSpaceCharacter ||\n\t\t\t\t\t// ...or we're on a different line...\n\t\t\t\t\ttop !== prevCharTop ||\n\t\t\t\t\t// ...or we're at the start of the text and haven't created a span yet...\n\t\t\t\t\t!currentSpan\n\t\t\t\t) {\n\t\t\t\t\t// ...then we're at a span boundary!\n\n\t\t\t\t\tif (currentSpan) {\n\t\t\t\t\t\t// if we're truncating to a single line & we just finished the first line, stop there\n\t\t\t\t\t\tif (shouldTruncateToFirstLine && top !== prevCharTop) {\n\t\t\t\t\t\t\tdidTruncate = true\n\t\t\t\t\t\t\tbreak\n\t\t\t\t\t\t}\n\t\t\t\t\t\t// otherwise add the span to the list ready to start a new one\n\t\t\t\t\t\tspans.push(currentSpan)\n\t\t\t\t\t}\n\n\t\t\t\t\t// start a new span\n\t\t\t\t\tcurrentSpan = {\n\t\t\t\t\t\tbox: { x: left, y: top, w: rect.width, h: rect.height },\n\t\t\t\t\t\ttext: segment,\n\t\t\t\t\t}\n\t\t\t\t\tprevCharLeftForRTLTest = left\n\t\t\t\t} else {\n\t\t\t\t\t// Looks like we're in RTL mode, so we need to adjust the left position.\n\t\t\t\t\tif (isRTL) {\n\t\t\t\t\t\tcurrentSpan.box.x = left\n\t\t\t\t\t}\n\n\t\t\t\t\t// otherwise we just need to extend the current span with the next character\n\t\t\t\t\tcurrentSpan.box.w = isRTL ? currentSpan.box.w + rect.width : right - currentSpan.box.x\n\t\t\t\t\tcurrentSpan.text += segment\n\t\t\t\t}\n\n\t\t\t\tif (segment === '\\n') {\n\t\t\t\t\tprevCharLeftForRTLTest = 0\n\t\t\t\t}\n\n\t\t\t\tprevCharWasSpaceCharacter = isSpaceCharacter\n\t\t\t\tprevCharTop = top\n\t\t\t\tidx += segment.length\n\t\t\t}\n\t\t}\n\n\t\t// Add the last span\n\t\tif (currentSpan) {\n\t\t\tspans.push(currentSpan)\n\t\t}\n\n\t\treturn { spans, didTruncate }\n\t}\n\n\t/**\n\t * Measure text into individual spans. Spans are created by rendering the\n\t * text, then dividing it up according to line breaks and word boundaries.\n\t *\n\t * It works by having the browser render the text, then measuring the\n\t * position of each character. You can use this to replicate the text-layout\n\t * algorithm of the current browser in e.g. an SVG export.\n\t */\n\tmeasureTextSpans(\n\t\ttextToMeasure: string,\n\t\topts: TLMeasureTextSpanOpts\n\t): { text: string; box: BoxModel }[] {\n\t\tif (textToMeasure === '') return []\n\n\t\tconst { elm } = this\n\n\t\tconst shouldTruncateToFirstLine =\n\t\t\topts.overflow === 'truncate-ellipsis' || opts.overflow === 'truncate-clip'\n\t\tconst elementWidth = Math.ceil(opts.width - opts.padding * 2)\n\t\tconst newStyles = {\n\t\t\t'font-family': opts.fontFamily,\n\t\t\t'font-style': opts.fontStyle,\n\t\t\t'font-weight': opts.fontWeight,\n\t\t\t'font-size': opts.fontSize + 'px',\n\t\t\t'line-height': `${resolveLineHeightPx(opts.fontSize, opts.lineHeight)}px`,\n\t\t\twidth: `${elementWidth}px`,\n\t\t\theight: 'min-content',\n\t\t\t'text-align': textAlignmentsForLtr[opts.textAlign],\n\t\t\t'overflow-wrap': shouldTruncateToFirstLine ? 'anywhere' : 'break-word',\n\t\t\t'word-break': shouldTruncateToFirstLine ? 'break-all' : 'normal',\n\t\t\t...opts.otherStyles,\n\t\t}\n\t\tconst restoreStyles = this.setElementStyles(elm, newStyles)\n\n\t\ttry {\n\t\t\tconst normalizedText = normalizeTextForDom(textToMeasure)\n\n\t\t\t// Render the text into the measurement element:\n\t\t\telm.textContent = normalizedText\n\n\t\t\t// actually measure the text:\n\t\t\tconst { spans, didTruncate } = this.measureElementTextNodeSpans(elm, {\n\t\t\t\tshouldTruncateToFirstLine,\n\t\t\t})\n\n\t\t\tif (opts.overflow === 'truncate-ellipsis' && didTruncate) {\n\t\t\t\t// we need to measure the ellipsis to know how much space it takes up\n\t\t\t\telm.textContent = '\u2026'\n\t\t\t\tconst ellipsisSpan = this.measureElementTextNodeSpans(elm).spans[0]\n\t\t\t\tconst ellipsisWidth = ellipsisSpan ? Math.ceil(ellipsisSpan.box.w) : 0\n\n\t\t\t\t// then, we need to subtract that space from the width we have and measure again:\n\t\t\t\telm.style.setProperty('width', `${elementWidth - ellipsisWidth}px`)\n\t\t\t\telm.textContent = normalizedText\n\t\t\t\tconst truncatedSpans = this.measureElementTextNodeSpans(elm, {\n\t\t\t\t\tshouldTruncateToFirstLine: true,\n\t\t\t\t}).spans\n\n\t\t\t\t// Finally, we add in our ellipsis at the end of the last span. We\n\t\t\t\t// have to do this after measuring, not before, because adding the\n\t\t\t\t// ellipsis changes how whitespace might be getting collapsed by the\n\t\t\t\t// browser.\n\t\t\t\tconst lastSpan = truncatedSpans[truncatedSpans.length - 1]\n\t\t\t\t// If nothing measurable remained, return the (possibly empty)\n\t\t\t\t// spans as-is rather than dereferencing a missing last span.\n\t\t\t\tif (!lastSpan) {\n\t\t\t\t\treturn truncatedSpans\n\t\t\t\t}\n\t\t\t\ttruncatedSpans.push({\n\t\t\t\t\ttext: '\u2026',\n\t\t\t\t\tbox: {\n\t\t\t\t\t\tx: Math.min(lastSpan.box.x + lastSpan.box.w, opts.width - opts.padding - ellipsisWidth),\n\t\t\t\t\t\ty: lastSpan.box.y,\n\t\t\t\t\t\tw: ellipsisWidth,\n\t\t\t\t\t\th: lastSpan.box.h,\n\t\t\t\t\t},\n\t\t\t\t})\n\n\t\t\t\treturn truncatedSpans\n\t\t\t}\n\n\t\t\treturn spans\n\t\t} finally {\n\t\t\trestoreStyles()\n\t\t}\n\t}\n}\n"],
-  "mappings": "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",
+  "sourcesContent": ["import { BoxModel, TLDefaultHorizontalAlignStyle } from '@tldraw/tlschema'\nimport { iterateGraphemes, objectMapKeys } from '@tldraw/utils'\nimport type { Editor } from '../../Editor'\nimport { EditorManager } from '../EditorManager'\n\n/**\n * The whole-pixel line-height for a given font size and tldraw's unitless line-height\n * multiplier. tldraw's theme stores line-height as a multiplier (e.g. 1.35); resolving it\n * to a whole pixel keeps line spacing identical across rendering engines, which otherwise\n * disagree on fractional line boxes (WebKit snaps them to whole pixels, Blink keeps the\n * fraction) and let multi-line text drift apart. Apply it everywhere line-height is used \u2014\n * measurement, on-canvas render, and export \u2014 so geometry and rendering agree.\n * See https://github.com/tldraw/tldraw/issues/8970.\n *\n * @public\n */\nexport function resolveLineHeightPx(fontSize: number, lineHeight: number): number {\n\treturn Math.round(fontSize * lineHeight)\n}\n\nconst fixNewLines = /\\r?\\n|\\r/g\n\nfunction normalizeTextForDom(text: string) {\n\treturn text\n\t\t.replace(fixNewLines, '\\n')\n\t\t.split('\\n')\n\t\t.map((x) => x || ' ')\n\t\t.join('\\n')\n}\n\nconst textAlignmentsForLtr = {\n\tstart: 'left',\n\t'start-legacy': 'left',\n\tmiddle: 'center',\n\t'middle-legacy': 'center',\n\tend: 'right',\n\t'end-legacy': 'right',\n}\n\ninterface PoolItem {\n\tel: HTMLDivElement\n\thtml: string\n\tappliedStyleKeys: string[]\n}\n\n/** @public */\nexport interface BatchMeasurementRequest {\n\thtml: string\n\topts: TLMeasureTextOpts\n}\n\n/** @public */\nexport type TLMeasuredTextSize = BoxModel & {\n\tscrollWidth: number\n}\n\n/** @public */\nexport interface TLMeasureTextOpts {\n\tfontStyle: string\n\tfontWeight: string\n\tfontFamily: string\n\tfontSize: number\n\t/** This must be a number, e.g. 1.35, not a pixel value. */\n\tlineHeight: number\n\t/**\n\t * When maxWidth is a number, the text will be wrapped to that maxWidth. When maxWidth\n\t * is null, the text will be measured without wrapping, but explicit line breaks and\n\t * space are preserved.\n\t */\n\tmaxWidth: null | number\n\tminWidth?: null | number\n\t// todo: make this a number so that it is consistent with other TLMeasureTextSpanOpts\n\tpadding: string\n\totherStyles?: Record<string, string>\n\tdisableOverflowWrapBreaking?: boolean\n\tmeasureScrollWidth?: boolean\n}\n\n/** @public */\nexport interface TLMeasureTextSpanOpts {\n\toverflow: 'wrap' | 'truncate-ellipsis' | 'truncate-clip'\n\twidth: number\n\theight: number\n\tpadding: number\n\tfontSize: number\n\tfontWeight: string\n\tfontFamily: string\n\tfontStyle: string\n\tlineHeight: number\n\ttextAlign: TLDefaultHorizontalAlignStyle\n\totherStyles?: Record<string, string>\n\tmeasureScrollWidth?: boolean\n}\n\nconst spaceCharacterRegex = /\\s/\n\nconst initialDefaultStyles = Object.freeze({\n\t'overflow-wrap': 'break-word',\n\t'word-break': 'auto',\n\twidth: null,\n\theight: null,\n\t'max-width': null,\n\t'min-width': null,\n})\n\n/** @public */\nexport class TextManager extends EditorManager {\n\tprivate elm: HTMLDivElement\n\tprivate poolElms: PoolItem[] = []\n\n\tconstructor(editor: Editor) {\n\t\tsuper(editor)\n\t\tthis.elm = this.createMeasurementEl()\n\t\tthis.editor.getContainer().appendChild(this.elm)\n\t\tthis.register(() => {\n\t\t\tthis.elm.remove()\n\t\t\tfor (const { el } of this.poolElms) {\n\t\t\t\tel.remove()\n\t\t\t}\n\t\t\tthis.poolElms.length = 0\n\t\t})\n\t}\n\n\tprivate createMeasurementEl(): HTMLDivElement {\n\t\tconst elm = this.editor.getContainerDocument().createElement('div')\n\t\telm.classList.add('tl-text')\n\t\telm.classList.add('tl-text-measure')\n\t\telm.setAttribute('dir', 'auto')\n\t\telm.tabIndex = -1\n\t\tfor (const key of objectMapKeys(initialDefaultStyles)) {\n\t\t\telm.style.setProperty(key, initialDefaultStyles[key])\n\t\t}\n\n\t\treturn elm\n\t}\n\n\tprivate resetElementStyles(el: HTMLElement, appliedStyleKeys: string[]) {\n\t\tfor (const key of appliedStyleKeys) {\n\t\t\tif (key in initialDefaultStyles) {\n\t\t\t\tel.style.setProperty(key, initialDefaultStyles[key as keyof typeof initialDefaultStyles])\n\t\t\t} else {\n\t\t\t\tel.style.removeProperty(key)\n\t\t\t}\n\t\t}\n\t}\n\n\tprivate setElementStyles(el: HTMLElement, styles: Record<string, string | undefined | null>) {\n\t\ttype StyleValue = string | null\n\t\ttype RestoreEntry = [prop: string, value: StyleValue]\n\n\t\tconst restore: RestoreEntry[] = []\n\n\t\tfor (const [key, nextValue] of Object.entries(styles)) {\n\t\t\tconst oldValue = el.style.getPropertyValue(key)\n\n\t\t\tif (typeof nextValue === 'string') {\n\t\t\t\tif (oldValue === nextValue) continue\n\t\t\t\trestore.push([key, oldValue || null])\n\t\t\t\tel.style.setProperty(key, nextValue)\n\t\t\t} else {\n\t\t\t\tif (!oldValue) continue\n\t\t\t\trestore.push([key, oldValue])\n\t\t\t\tel.style.removeProperty(key)\n\t\t\t}\n\t\t}\n\n\t\treturn () => {\n\t\t\tfor (const [key, value] of restore) {\n\t\t\t\tif (value === null || value === '') el.style.removeProperty(key)\n\t\t\t\telse el.style.setProperty(key, value)\n\t\t\t}\n\t\t}\n\t}\n\n\tprivate getMeasureStyles(opts: TLMeasureTextOpts): Record<string, string | undefined> {\n\t\treturn {\n\t\t\t'font-family': opts.fontFamily,\n\t\t\t'font-style': opts.fontStyle,\n\t\t\t'font-weight': opts.fontWeight,\n\t\t\t'font-size': opts.fontSize + 'px',\n\t\t\t'line-height': `${resolveLineHeightPx(opts.fontSize, opts.lineHeight)}px`,\n\t\t\t// Unitless multiplier consumed by the .tl-rich-text h1\u2013h6 rule (see editor.css),\n\t\t\t// so heading measurement matches on-canvas rendering.\n\t\t\t'--tl-rich-text-heading-line-height': `${opts.lineHeight}`,\n\t\t\tpadding: opts.padding,\n\t\t\t'max-width': opts.maxWidth ? opts.maxWidth + 'px' : undefined,\n\t\t\t'min-width': opts.minWidth ? opts.minWidth + 'px' : undefined,\n\t\t\t'overflow-wrap': opts.disableOverflowWrapBreaking ? 'normal' : 'break-word',\n\t\t\t...opts.otherStyles,\n\t\t}\n\t}\n\n\tprivate ensurePoolSize(size: number) {\n\t\tif (this.poolElms.length >= size) return\n\n\t\tconst fragment = this.editor.getContainerDocument().createDocumentFragment()\n\t\twhile (this.poolElms.length < size) {\n\t\t\tconst el = this.createMeasurementEl()\n\t\t\tthis.poolElms.push({ el, html: '', appliedStyleKeys: [] })\n\t\t\tfragment.appendChild(el)\n\t\t}\n\t\tthis.editor.getContainer().appendChild(fragment)\n\t}\n\n\tprivate getPoolItem(index: number): PoolItem {\n\t\tthis.ensurePoolSize(index + 1)\n\t\treturn this.poolElms[index]\n\t}\n\n\tmeasureHtmlBatch(requests: BatchMeasurementRequest[]): TLMeasuredTextSize[] {\n\t\tif (requests.length === 0) return []\n\n\t\twhile (this.poolElms.length > requests.length) {\n\t\t\tconst { el } = this.poolElms.pop()!\n\t\t\tel.remove()\n\t\t}\n\n\t\tfor (let i = 0; i < requests.length; i++) {\n\t\t\tconst { html, opts } = requests[i]\n\t\t\tconst poolItem = this.getPoolItem(i)\n\n\t\t\tconst { el } = poolItem\n\t\t\tthis.resetElementStyles(el, poolItem.appliedStyleKeys)\n\t\t\tconst styles = this.getMeasureStyles(opts)\n\t\t\tthis.setElementStyles(el, styles)\n\t\t\tpoolItem.appliedStyleKeys = Object.keys(styles)\n\t\t\t// Skip innerHTML parsing if the content hasn't changed\n\t\t\tif (poolItem.html !== html) {\n\t\t\t\tel.innerHTML = html\n\t\t\t\tpoolItem.html = html\n\t\t\t}\n\t\t}\n\n\t\tconst results: TLMeasuredTextSize[] = []\n\t\tfor (let i = 0; i < requests.length; i++) {\n\t\t\tconst el = this.getPoolItem(i).el\n\t\t\tconst scrollWidth = requests[i].opts.measureScrollWidth ? el.scrollWidth : 0\n\t\t\tconst rect = el.getBoundingClientRect()\n\t\t\tresults.push({\n\t\t\t\tx: 0,\n\t\t\t\ty: 0,\n\t\t\t\tw: rect.width,\n\t\t\t\th: rect.height,\n\t\t\t\tscrollWidth,\n\t\t\t})\n\t\t}\n\n\t\treturn results\n\t}\n\n\tmeasureText(textToMeasure: string, opts: TLMeasureTextOpts): TLMeasuredTextSize {\n\t\tconst div = this.editor.getContainerDocument().createElement('div')\n\t\tdiv.textContent = normalizeTextForDom(textToMeasure)\n\t\treturn this.measureHtml(div.innerHTML, opts)\n\t}\n\n\tmeasureHtml(html: string, opts: TLMeasureTextOpts): TLMeasuredTextSize {\n\t\tconst { elm } = this\n\n\t\tconst restoreStyles = this.setElementStyles(elm, this.getMeasureStyles(opts))\n\n\t\ttry {\n\t\t\telm.innerHTML = html\n\n\t\t\tconst scrollWidth = opts.measureScrollWidth ? elm.scrollWidth : 0\n\t\t\tconst rect = elm.getBoundingClientRect()\n\n\t\t\treturn {\n\t\t\t\tx: 0,\n\t\t\t\ty: 0,\n\t\t\t\tw: rect.width,\n\t\t\t\th: rect.height,\n\t\t\t\tscrollWidth,\n\t\t\t}\n\t\t} finally {\n\t\t\trestoreStyles()\n\t\t}\n\t}\n\n\t/**\n\t * Given an html element, measure the position of each span of unbroken\n\t * word/white-space characters within any text nodes it contains.\n\t */\n\tmeasureElementTextNodeSpans(\n\t\telement: HTMLElement,\n\t\t{ shouldTruncateToFirstLine = false }: { shouldTruncateToFirstLine?: boolean } = {}\n\t): { spans: { box: BoxModel; text: string }[]; didTruncate: boolean } {\n\t\tconst spans = []\n\n\t\t// Measurements of individual spans are relative to the containing element\n\t\tconst elmBounds = element.getBoundingClientRect()\n\t\tconst offsetX = -elmBounds.left\n\t\tconst offsetY = -elmBounds.top\n\n\t\t// we measure by creating a range that spans each character in the elements text nodes\n\t\tconst range = new Range()\n\n\t\tlet currentSpan = null\n\t\tlet prevCharWasSpaceCharacter = null\n\t\tlet prevCharTop = 0\n\t\tlet prevCharLeftForRTLTest = 0\n\t\tlet didTruncate = false\n\t\tfor (const childNode of element.childNodes) {\n\t\t\tif (didTruncate) break\n\t\t\tif (childNode.nodeType !== Node.TEXT_NODE) continue\n\n\t\t\t// offsets are per text node, or the range would index past the node's end\n\t\t\tlet idx = 0\n\t\t\tfor (const segment of iterateGraphemes(childNode.textContent ?? '')) {\n\t\t\t\t// place the range around the grapheme we're interested in\n\t\t\t\trange.setStart(childNode, idx)\n\t\t\t\trange.setEnd(childNode, idx + segment.length)\n\t\t\t\t// measure the range. some browsers return multiple rects for the\n\t\t\t\t// first char in a new line - one for the line break, and one for\n\t\t\t\t// the character itself. we're only interested in the character.\n\t\t\t\tconst rects = range.getClientRects()\n\t\t\t\tconst rect = rects[rects.length - 1]\n\n\t\t\t\t// some graphemes produce no layout rectangle (e.g. zero-width\n\t\t\t\t// spaces or newlines). skip them rather than crashing, but keep\n\t\t\t\t// advancing the index so later graphemes stay aligned.\n\t\t\t\t// See https://github.com/tldraw/tldraw/issues/9112.\n\t\t\t\tif (!rect) {\n\t\t\t\t\tidx += segment.length\n\t\t\t\t\tcontinue\n\t\t\t\t}\n\n\t\t\t\t// calculate the position of the character relative to the element\n\t\t\t\tconst top = rect.top + offsetY\n\t\t\t\tconst left = rect.left + offsetX\n\t\t\t\tconst right = rect.right + offsetX\n\t\t\t\tconst isRTL = left < prevCharLeftForRTLTest\n\n\t\t\t\tconst isSpaceCharacter = spaceCharacterRegex.test(segment)\n\t\t\t\tif (\n\t\t\t\t\t// If we're at a word boundary...\n\t\t\t\t\tisSpaceCharacter !== prevCharWasSpaceCharacter ||\n\t\t\t\t\t// ...or we're on a different line...\n\t\t\t\t\ttop !== prevCharTop ||\n\t\t\t\t\t// ...or we're at the start of the text and haven't created a span yet...\n\t\t\t\t\t!currentSpan\n\t\t\t\t) {\n\t\t\t\t\t// ...then we're at a span boundary!\n\n\t\t\t\t\tif (currentSpan) {\n\t\t\t\t\t\t// if we're truncating to a single line & we just finished the first line, stop there\n\t\t\t\t\t\tif (shouldTruncateToFirstLine && top !== prevCharTop) {\n\t\t\t\t\t\t\tdidTruncate = true\n\t\t\t\t\t\t\tbreak\n\t\t\t\t\t\t}\n\t\t\t\t\t\t// otherwise add the span to the list ready to start a new one\n\t\t\t\t\t\tspans.push(currentSpan)\n\t\t\t\t\t}\n\n\t\t\t\t\t// start a new span\n\t\t\t\t\tcurrentSpan = {\n\t\t\t\t\t\tbox: { x: left, y: top, w: rect.width, h: rect.height },\n\t\t\t\t\t\ttext: segment,\n\t\t\t\t\t}\n\t\t\t\t\tprevCharLeftForRTLTest = left\n\t\t\t\t} else {\n\t\t\t\t\t// Looks like we're in RTL mode, so we need to adjust the left position.\n\t\t\t\t\tif (isRTL) {\n\t\t\t\t\t\tcurrentSpan.box.x = left\n\t\t\t\t\t}\n\n\t\t\t\t\t// otherwise we just need to extend the current span with the next character\n\t\t\t\t\tcurrentSpan.box.w = isRTL ? currentSpan.box.w + rect.width : right - currentSpan.box.x\n\t\t\t\t\tcurrentSpan.text += segment\n\t\t\t\t}\n\n\t\t\t\tif (segment === '\\n') {\n\t\t\t\t\tprevCharLeftForRTLTest = 0\n\t\t\t\t}\n\n\t\t\t\tprevCharWasSpaceCharacter = isSpaceCharacter\n\t\t\t\tprevCharTop = top\n\t\t\t\tidx += segment.length\n\t\t\t}\n\t\t}\n\n\t\t// Add the last span\n\t\tif (currentSpan) {\n\t\t\tspans.push(currentSpan)\n\t\t}\n\n\t\treturn { spans, didTruncate }\n\t}\n\n\t/**\n\t * Measure text into individual spans. Spans are created by rendering the\n\t * text, then dividing it up according to line breaks and word boundaries.\n\t *\n\t * It works by having the browser render the text, then measuring the\n\t * position of each character. You can use this to replicate the text-layout\n\t * algorithm of the current browser in e.g. an SVG export.\n\t */\n\tmeasureTextSpans(\n\t\ttextToMeasure: string,\n\t\topts: TLMeasureTextSpanOpts\n\t): { text: string; box: BoxModel }[] {\n\t\tif (textToMeasure === '') return []\n\n\t\tconst { elm } = this\n\n\t\tconst shouldTruncateToFirstLine =\n\t\t\topts.overflow === 'truncate-ellipsis' || opts.overflow === 'truncate-clip'\n\t\tconst elementWidth = Math.ceil(opts.width - opts.padding * 2)\n\t\tconst newStyles = {\n\t\t\t'font-family': opts.fontFamily,\n\t\t\t'font-style': opts.fontStyle,\n\t\t\t'font-weight': opts.fontWeight,\n\t\t\t'font-size': opts.fontSize + 'px',\n\t\t\t'line-height': `${resolveLineHeightPx(opts.fontSize, opts.lineHeight)}px`,\n\t\t\twidth: `${elementWidth}px`,\n\t\t\theight: 'min-content',\n\t\t\t'text-align': textAlignmentsForLtr[opts.textAlign],\n\t\t\t'overflow-wrap': shouldTruncateToFirstLine ? 'anywhere' : 'break-word',\n\t\t\t'word-break': shouldTruncateToFirstLine ? 'break-all' : 'normal',\n\t\t\t...opts.otherStyles,\n\t\t}\n\t\tconst restoreStyles = this.setElementStyles(elm, newStyles)\n\n\t\ttry {\n\t\t\tconst normalizedText = normalizeTextForDom(textToMeasure)\n\n\t\t\t// Render the text into the measurement element:\n\t\t\telm.textContent = normalizedText\n\n\t\t\t// actually measure the text:\n\t\t\tconst { spans, didTruncate } = this.measureElementTextNodeSpans(elm, {\n\t\t\t\tshouldTruncateToFirstLine,\n\t\t\t})\n\n\t\t\tif (opts.overflow === 'truncate-ellipsis' && didTruncate) {\n\t\t\t\t// we need to measure the ellipsis to know how much space it takes up\n\t\t\t\telm.textContent = '\u2026'\n\t\t\t\tconst ellipsisSpan = this.measureElementTextNodeSpans(elm).spans[0]\n\t\t\t\tconst ellipsisWidth = ellipsisSpan ? Math.ceil(ellipsisSpan.box.w) : 0\n\n\t\t\t\t// then, we need to subtract that space from the width we have and measure again:\n\t\t\t\telm.style.setProperty('width', `${elementWidth - ellipsisWidth}px`)\n\t\t\t\telm.textContent = normalizedText\n\t\t\t\tconst truncatedSpans = this.measureElementTextNodeSpans(elm, {\n\t\t\t\t\tshouldTruncateToFirstLine: true,\n\t\t\t\t}).spans\n\n\t\t\t\t// Finally, we add in our ellipsis at the end of the last span. We\n\t\t\t\t// have to do this after measuring, not before, because adding the\n\t\t\t\t// ellipsis changes how whitespace might be getting collapsed by the\n\t\t\t\t// browser.\n\t\t\t\tconst lastSpan = truncatedSpans[truncatedSpans.length - 1]\n\t\t\t\t// If nothing measurable remained, return the (possibly empty)\n\t\t\t\t// spans as-is rather than dereferencing a missing last span.\n\t\t\t\tif (!lastSpan) {\n\t\t\t\t\treturn truncatedSpans\n\t\t\t\t}\n\t\t\t\ttruncatedSpans.push({\n\t\t\t\t\ttext: '\u2026',\n\t\t\t\t\tbox: {\n\t\t\t\t\t\tx: Math.min(lastSpan.box.x + lastSpan.box.w, opts.width - opts.padding - ellipsisWidth),\n\t\t\t\t\t\ty: lastSpan.box.y,\n\t\t\t\t\t\tw: ellipsisWidth,\n\t\t\t\t\t\th: lastSpan.box.h,\n\t\t\t\t\t},\n\t\t\t\t})\n\n\t\t\t\treturn truncatedSpans\n\t\t\t}\n\n\t\t\treturn spans\n\t\t} finally {\n\t\t\trestoreStyles()\n\t\t}\n\t}\n}\n"],
+  "mappings": "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",
   "names": []
 }

package/dist-esm/lib/editor/shapes/group/GroupShapeUtil.mjs

@@ -30,12 +30,20 @@ class GroupShapeUtil extends ShapeUtil {
     if (children.length === 0) {
       return new Rectangle2d({ width: 1, height: 1, isFilled: false });
     }
-    return new Group2d({
-      children: children.map((childId) => {
-        const shape2 = this.editor.getShape(childId);
-        return this.editor.getShapeGeometry(childId).transform(this.editor.getShapeLocalTransform(shape2), { isLabel: false });
-      })
-    });
+    const geometries = [];
+    for (const childId of children) {
+      const child = this.editor.getShape(childId);
+      if (!child) continue;
+      const geometry = this.editor.getShapeGeometry(childId);
+      if (!geometry) continue;
+      const transform = this.editor.getShapeLocalTransform(child);
+      if (!transform) continue;
+      geometries.push(geometry.transform(transform, { isLabel: false }));
+    }
+    if (geometries.length === 0) {
+      return new Rectangle2d({ width: 1, height: 1, isFilled: false });
+    }
+    return new Group2d({ children: geometries });
   }
   component(shape) {
     const isErasing = this.editor.getErasingShapeIds().includes(shape.id);

package/dist-esm/lib/editor/shapes/group/GroupShapeUtil.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../src/lib/editor/shapes/group/GroupShapeUtil.tsx"],
-  "sourcesContent": ["import { TLGroupShape, groupShapeMigrations, groupShapeProps } from '@tldraw/tlschema'\nimport { SVGContainer } from '../../../components/SVGContainer'\nimport { Geometry2d } from '../../../primitives/geometry/Geometry2d'\nimport { Group2d } from '../../../primitives/geometry/Group2d'\nimport { Rectangle2d } from '../../../primitives/geometry/Rectangle2d'\nimport { ShapeUtil } from '../ShapeUtil'\nimport { getPerfectDashProps } from '../shared/getPerfectDashProps'\nimport { DashedOutlineBox } from './DashedOutlineBox'\n\n/** @public */\nexport class GroupShapeUtil extends ShapeUtil<TLGroupShape> {\n\tstatic override type = 'group' as const\n\tstatic override props = groupShapeProps\n\tstatic override migrations = groupShapeMigrations\n\n\toverride hideSelectionBoundsFg(shape: TLGroupShape) {\n\t\treturn true\n\t}\n\n\toverride canBind() {\n\t\treturn false\n\t}\n\n\tcanResize() {\n\t\treturn true\n\t}\n\n\tcanResizeChildren() {\n\t\treturn true\n\t}\n\n\tgetDefaultProps(): TLGroupShape['props'] {\n\t\treturn {}\n\t}\n\n\tgetGeometry(shape: TLGroupShape): Geometry2d {\n\t\tconst children = this.editor.getSortedChildIdsForParent(shape.id)\n\t\tif (children.length === 0) {\n\t\t\treturn new Rectangle2d({ width: 1, height: 1, isFilled: false })\n\t\t}\n\n\t\treturn new Group2d({\n\t\t\tchildren: children.map((childId) => {\n\t\t\t\tconst shape = this.editor.getShape(childId)!\n\t\t\t\treturn this.editor\n\t\t\t\t\t.getShapeGeometry(childId)\n\t\t\t\t\t.transform(this.editor.getShapeLocalTransform(shape)!, { isLabel: false })\n\t\t\t}),\n\t\t})\n\t}\n\n\tcomponent(shape: TLGroupShape) {\n\t\tconst isErasing = this.editor.getErasingShapeIds().includes(shape.id)\n\n\t\tconst { hintingShapeIds } = this.editor.getCurrentPageState()\n\t\tconst isHintingOtherGroup =\n\t\t\thintingShapeIds.length > 0 &&\n\t\t\thintingShapeIds.some(\n\t\t\t\t(id) => id !== shape.id && this.editor.isShapeOfType(this.editor.getShape(id)!, 'group')\n\t\t\t)\n\n\t\tconst isFocused = this.editor.getCurrentPageState().focusedGroupId !== shape.id\n\n\t\tif (\n\t\t\t!isErasing && // always show the outline while we're erasing the group\n\t\t\t// show the outline while the group is focused unless something outside of the group is being hinted\n\t\t\t// this happens dropping shapes from a group onto some outside group\n\t\t\t(isFocused || isHintingOtherGroup)\n\t\t) {\n\t\t\treturn null\n\t\t}\n\n\t\tconst bounds = this.editor.getShapeGeometry(shape).bounds\n\n\t\treturn (\n\t\t\t<SVGContainer>\n\t\t\t\t<DashedOutlineBox className=\"tl-group\" bounds={bounds} />\n\t\t\t</SVGContainer>\n\t\t)\n\t}\n\n\toverride getIndicatorPath(shape: TLGroupShape): Path2D {\n\t\tconst bounds = this.editor.getShapeGeometry(shape).bounds\n\t\tconst zoomLevel = this.editor.getEfficientZoomLevel()\n\t\tconst path = new Path2D()\n\n\t\tfor (const side of bounds.sides) {\n\t\t\tconst [start, end] = side\n\t\t\tconst length = start.dist(end)\n\t\t\tif (length <= 0) continue\n\n\t\t\tconst { strokeDasharray, strokeDashoffset } = getPerfectDashProps(length, 1 / zoomLevel, {\n\t\t\t\tstyle: 'dashed',\n\t\t\t\tlengthRatio: 4,\n\t\t\t})\n\n\t\t\tif (strokeDasharray === 'none') {\n\t\t\t\tpath.moveTo(start.x, start.y)\n\t\t\t\tpath.lineTo(end.x, end.y)\n\t\t\t\tcontinue\n\t\t\t}\n\n\t\t\tconst [dashLength, gapLength] = strokeDasharray.split(' ').map(Number)\n\t\t\tconst dashOffset = Number(strokeDashoffset)\n\t\t\tconst period = dashLength + gapLength\n\t\t\tif (!Number.isFinite(period) || period <= 0) continue\n\n\t\t\tconst dx = (end.x - start.x) / length\n\t\t\tconst dy = (end.y - start.y) / length\n\n\t\t\tfor (let dashStart = -dashOffset; dashStart < length; dashStart += period) {\n\t\t\t\tconst dashEnd = Math.min(length, dashStart + dashLength)\n\t\t\t\tconst clippedDashStart = Math.max(0, dashStart)\n\t\t\t\tif (dashEnd <= clippedDashStart) continue\n\n\t\t\t\tpath.moveTo(start.x + dx * clippedDashStart, start.y + dy * clippedDashStart)\n\t\t\t\tpath.lineTo(start.x + dx * dashEnd, start.y + dy * dashEnd)\n\t\t\t}\n\t\t}\n\n\t\treturn path\n\t}\n\n\toverride onChildrenChange(group: TLGroupShape) {\n\t\tconst children = this.editor.getSortedChildIdsForParent(group.id)\n\t\tif (children.length === 0) {\n\t\t\tif (this.editor.getCurrentPageState().focusedGroupId === group.id) {\n\t\t\t\tthis.editor.popFocusedGroupId()\n\t\t\t}\n\t\t\tthis.editor.deleteShapes([group.id])\n\t\t\treturn\n\t\t} else if (children.length === 1) {\n\t\t\tif (this.editor.getCurrentPageState().focusedGroupId === group.id) {\n\t\t\t\tthis.editor.popFocusedGroupId()\n\t\t\t}\n\t\t\tthis.editor.reparentShapes(children, group.parentId, group.index)\n\t\t\tthis.editor.deleteShapes([group.id])\n\t\t\treturn\n\t\t}\n\t}\n}\n"],
-  "mappings": "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",
-  "names": ["shape"]
+  "sourcesContent": ["import { TLGroupShape, groupShapeMigrations, groupShapeProps } from '@tldraw/tlschema'\nimport { SVGContainer } from '../../../components/SVGContainer'\nimport { Geometry2d } from '../../../primitives/geometry/Geometry2d'\nimport { Group2d } from '../../../primitives/geometry/Group2d'\nimport { Rectangle2d } from '../../../primitives/geometry/Rectangle2d'\nimport { ShapeUtil } from '../ShapeUtil'\nimport { getPerfectDashProps } from '../shared/getPerfectDashProps'\nimport { DashedOutlineBox } from './DashedOutlineBox'\n\n/** @public */\nexport class GroupShapeUtil extends ShapeUtil<TLGroupShape> {\n\tstatic override type = 'group' as const\n\tstatic override props = groupShapeProps\n\tstatic override migrations = groupShapeMigrations\n\n\toverride hideSelectionBoundsFg(shape: TLGroupShape) {\n\t\treturn true\n\t}\n\n\toverride canBind() {\n\t\treturn false\n\t}\n\n\tcanResize() {\n\t\treturn true\n\t}\n\n\tcanResizeChildren() {\n\t\treturn true\n\t}\n\n\tgetDefaultProps(): TLGroupShape['props'] {\n\t\treturn {}\n\t}\n\n\tgetGeometry(shape: TLGroupShape): Geometry2d {\n\t\tconst children = this.editor.getSortedChildIdsForParent(shape.id)\n\t\tif (children.length === 0) {\n\t\t\treturn new Rectangle2d({ width: 1, height: 1, isFilled: false })\n\t\t}\n\n\t\t// A child id can outlive its record. The children index and the geometry cache are separate\n\t\t// derivations, so inside a transaction that removes a child the index can still name it while\n\t\t// `getShapeGeometry` already answers nothing \u2014 its `!` hides that it returns `undefined` for a\n\t\t// record the store no longer holds. Asserting instead of checking threw a `TypeError` out of a\n\t\t// reactive recompute, where no caller could catch it.\n\t\tconst geometries: Geometry2d[] = []\n\t\tfor (const childId of children) {\n\t\t\tconst child = this.editor.getShape(childId)\n\t\t\tif (!child) continue\n\t\t\tconst geometry = this.editor.getShapeGeometry(childId)\n\t\t\tif (!geometry) continue\n\t\t\tconst transform = this.editor.getShapeLocalTransform(child)\n\t\t\tif (!transform) continue\n\t\t\tgeometries.push(geometry.transform(transform, { isLabel: false }))\n\t\t}\n\n\t\t// Every child resolved to nothing, so there is no meaningful extent to report. Matches the\n\t\t// no-children case above rather than building an empty `Group2d`, whose bounds are `NaN`.\n\t\tif (geometries.length === 0) {\n\t\t\treturn new Rectangle2d({ width: 1, height: 1, isFilled: false })\n\t\t}\n\n\t\treturn new Group2d({ children: geometries })\n\t}\n\n\tcomponent(shape: TLGroupShape) {\n\t\tconst isErasing = this.editor.getErasingShapeIds().includes(shape.id)\n\n\t\tconst { hintingShapeIds } = this.editor.getCurrentPageState()\n\t\tconst isHintingOtherGroup =\n\t\t\thintingShapeIds.length > 0 &&\n\t\t\thintingShapeIds.some(\n\t\t\t\t(id) => id !== shape.id && this.editor.isShapeOfType(this.editor.getShape(id)!, 'group')\n\t\t\t)\n\n\t\tconst isFocused = this.editor.getCurrentPageState().focusedGroupId !== shape.id\n\n\t\tif (\n\t\t\t!isErasing && // always show the outline while we're erasing the group\n\t\t\t// show the outline while the group is focused unless something outside of the group is being hinted\n\t\t\t// this happens dropping shapes from a group onto some outside group\n\t\t\t(isFocused || isHintingOtherGroup)\n\t\t) {\n\t\t\treturn null\n\t\t}\n\n\t\tconst bounds = this.editor.getShapeGeometry(shape).bounds\n\n\t\treturn (\n\t\t\t<SVGContainer>\n\t\t\t\t<DashedOutlineBox className=\"tl-group\" bounds={bounds} />\n\t\t\t</SVGContainer>\n\t\t)\n\t}\n\n\toverride getIndicatorPath(shape: TLGroupShape): Path2D {\n\t\tconst bounds = this.editor.getShapeGeometry(shape).bounds\n\t\tconst zoomLevel = this.editor.getEfficientZoomLevel()\n\t\tconst path = new Path2D()\n\n\t\tfor (const side of bounds.sides) {\n\t\t\tconst [start, end] = side\n\t\t\tconst length = start.dist(end)\n\t\t\tif (length <= 0) continue\n\n\t\t\tconst { strokeDasharray, strokeDashoffset } = getPerfectDashProps(length, 1 / zoomLevel, {\n\t\t\t\tstyle: 'dashed',\n\t\t\t\tlengthRatio: 4,\n\t\t\t})\n\n\t\t\tif (strokeDasharray === 'none') {\n\t\t\t\tpath.moveTo(start.x, start.y)\n\t\t\t\tpath.lineTo(end.x, end.y)\n\t\t\t\tcontinue\n\t\t\t}\n\n\t\t\tconst [dashLength, gapLength] = strokeDasharray.split(' ').map(Number)\n\t\t\tconst dashOffset = Number(strokeDashoffset)\n\t\t\tconst period = dashLength + gapLength\n\t\t\tif (!Number.isFinite(period) || period <= 0) continue\n\n\t\t\tconst dx = (end.x - start.x) / length\n\t\t\tconst dy = (end.y - start.y) / length\n\n\t\t\tfor (let dashStart = -dashOffset; dashStart < length; dashStart += period) {\n\t\t\t\tconst dashEnd = Math.min(length, dashStart + dashLength)\n\t\t\t\tconst clippedDashStart = Math.max(0, dashStart)\n\t\t\t\tif (dashEnd <= clippedDashStart) continue\n\n\t\t\t\tpath.moveTo(start.x + dx * clippedDashStart, start.y + dy * clippedDashStart)\n\t\t\t\tpath.lineTo(start.x + dx * dashEnd, start.y + dy * dashEnd)\n\t\t\t}\n\t\t}\n\n\t\treturn path\n\t}\n\n\toverride onChildrenChange(group: TLGroupShape) {\n\t\tconst children = this.editor.getSortedChildIdsForParent(group.id)\n\t\tif (children.length === 0) {\n\t\t\tif (this.editor.getCurrentPageState().focusedGroupId === group.id) {\n\t\t\t\tthis.editor.popFocusedGroupId()\n\t\t\t}\n\t\t\tthis.editor.deleteShapes([group.id])\n\t\t\treturn\n\t\t} else if (children.length === 1) {\n\t\t\tif (this.editor.getCurrentPageState().focusedGroupId === group.id) {\n\t\t\t\tthis.editor.popFocusedGroupId()\n\t\t\t}\n\t\t\tthis.editor.reparentShapes(children, group.parentId, group.index)\n\t\t\tthis.editor.deleteShapes([group.id])\n\t\t\treturn\n\t\t}\n\t}\n}\n"],
+  "mappings": "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",
+  "names": []
 }

package/dist-esm/lib/exports/ExportDelay.mjs

@@ -8,14 +8,19 @@ var __decorateClass = (decorators, target, key, kind) => {
   if (kind && result) __defProp(target, key, result);
   return result;
 };
-import { bind, sleep } from "@tldraw/utils";
+import { bind, noop, promiseWithResolve, sleep } from "@tldraw/utils";
 class ExportDelay {
   constructor(maxDelayTimeMs) {
     this.maxDelayTimeMs = maxDelayTimeMs;
+    this.failure.catch(noop);
   }
   maxDelayTimeMs;
   isResolved = false;
   promisesToWaitFor = [];
+  failure = promiseWithResolve();
+  fail(error) {
+    this.failure.reject(error);
+  }
   waitUntil(promise) {
     if (this.isResolved) {
       throw new Error(
@@ -37,13 +42,16 @@ class ExportDelay {
   async resolve() {
     const timeoutPromise = sleep(this.maxDelayTimeMs).then(() => "timeout");
     const resolvePromise = this.resolvePromises().then(() => "resolved");
-    const result = await Promise.race([timeoutPromise, resolvePromise]);
+    const result = await Promise.race([timeoutPromise, resolvePromise, this.failure]);
     if (result === "timeout") {
-      console.warn("[tldraw] Export delay timed out after ${this.maxDelayTimeMs}ms");
+      console.warn(`[tldraw] Export delay timed out after ${this.maxDelayTimeMs}ms`);
     }
     this.isResolved = true;
   }
 }
+__decorateClass([
+  bind
+], ExportDelay.prototype, "fail", 1);
 __decorateClass([
   bind
 ], ExportDelay.prototype, "waitUntil", 1);

package/dist-esm/lib/exports/ExportDelay.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/lib/exports/ExportDelay.tsx"],
-  "sourcesContent": ["import { bind, sleep } from '@tldraw/utils'\n\n/**\n * Export delay is a helper class that allows you to wait for a set of promises to resolve before\n * proceeding with an export. Over time, promises can be added by calling `waitUntil`.\n *\n * When `resolve` is called, we'll wait for all the promises already added (and any new ones added\n * in the mean time) to resolve before proceeding. The class is designed to be used once: after\n * `resolve` has been called and finished, new promises cannot be added.\n */\nexport class ExportDelay {\n\tprivate isResolved = false\n\tprivate readonly promisesToWaitFor: Promise<void>[] = []\n\n\tconstructor(private readonly maxDelayTimeMs: number) {}\n\n\t@bind waitUntil(promise: Promise<void>): void {\n\t\tif (this.isResolved) {\n\t\t\tthrow new Error(\n\t\t\t\t'Cannot `waitUntil` - the export has already been resolved. Make sure to call `waitUntil` as soon as possible during an export - ie within the first react effect after rendering.'\n\t\t\t)\n\t\t}\n\t\tthis.promisesToWaitFor.push(\n\t\t\tpromise.catch((err) => console.error('Error while waiting for export:', err))\n\t\t)\n\t}\n\n\tprivate async resolvePromises() {\n\t\tlet lastLength = null\n\t\twhile (this.promisesToWaitFor.length !== lastLength) {\n\t\t\tlastLength = this.promisesToWaitFor.length\n\t\t\tawait Promise.allSettled(this.promisesToWaitFor)\n\n\t\t\t// wait for a cycle of the event loop to allow any of those promises to add more if needed.\n\t\t\tawait sleep(0)\n\t\t}\n\t}\n\n\tasync resolve() {\n\t\tconst timeoutPromise = sleep(this.maxDelayTimeMs).then(() => 'timeout' as const)\n\t\tconst resolvePromise = this.resolvePromises().then(() => 'resolved' as const)\n\n\t\tconst result = await Promise.race([timeoutPromise, resolvePromise])\n\t\tif (result === 'timeout') {\n\t\t\tconsole.warn('[tldraw] Export delay timed out after ${this.maxDelayTimeMs}ms')\n\t\t}\n\n\t\tthis.isResolved = true\n\t}\n}\n"],
-  "mappings": ";;;;;;;;;;AAAA,SAAS,MAAM,aAAa;AAUrB,MAAM,YAAY;AAAA,EAIxB,YAA6B,gBAAwB;AAAxB;AAAA,EAAyB;AAAA,EAAzB;AAAA,EAHrB,aAAa;AAAA,EACJ,oBAAqC,CAAC;AAAA,EAIjD,UAAU,SAA8B;AAC7C,QAAI,KAAK,YAAY;AACpB,YAAM,IAAI;AAAA,QACT;AAAA,MACD;AAAA,IACD;AACA,SAAK,kBAAkB;AAAA,MACtB,QAAQ,MAAM,CAAC,QAAQ,QAAQ,MAAM,mCAAmC,GAAG,CAAC;AAAA,IAC7E;AAAA,EACD;AAAA,EAEA,MAAc,kBAAkB;AAC/B,QAAI,aAAa;AACjB,WAAO,KAAK,kBAAkB,WAAW,YAAY;AACpD,mBAAa,KAAK,kBAAkB;AACpC,YAAM,QAAQ,WAAW,KAAK,iBAAiB;AAG/C,YAAM,MAAM,CAAC;AAAA,IACd;AAAA,EACD;AAAA,EAEA,MAAM,UAAU;AACf,UAAM,iBAAiB,MAAM,KAAK,cAAc,EAAE,KAAK,MAAM,SAAkB;AAC/E,UAAM,iBAAiB,KAAK,gBAAgB,EAAE,KAAK,MAAM,UAAmB;AAE5E,UAAM,SAAS,MAAM,QAAQ,KAAK,CAAC,gBAAgB,cAAc,CAAC;AAClE,QAAI,WAAW,WAAW;AACzB,cAAQ,KAAK,gEAAgE;AAAA,IAC9E;AAEA,SAAK,aAAa;AAAA,EACnB;AACD;AAjCO;AAAA,EAAL;AAAA,GANW,YAMN;",
+  "sourcesContent": ["import { bind, noop, promiseWithResolve, sleep } from '@tldraw/utils'\n\n/**\n * Export delay is a helper class that allows you to wait for a set of promises to resolve before\n * proceeding with an export. Over time, promises can be added by calling `waitUntil`.\n *\n * When `resolve` is called, we'll wait for all the promises already added (and any new ones added\n * in the mean time) to resolve before proceeding. The class is designed to be used once: after\n * `resolve` has been called and finished, new promises cannot be added.\n */\nexport class ExportDelay {\n\tprivate isResolved = false\n\tprivate readonly promisesToWaitFor: Promise<void>[] = []\n\tprivate readonly failure = promiseWithResolve<never>()\n\n\tconstructor(private readonly maxDelayTimeMs: number) {\n\t\t// only observed inside `resolve`, so a `fail` before then would otherwise be an unhandled rejection\n\t\tthis.failure.catch(noop)\n\t}\n\n\t/**\n\t * Abort the export: `resolve` rejects with this error instead of waiting out the delay and\n\t * snapshotting a broken svg.\n\t */\n\t@bind fail(error: unknown): void {\n\t\tthis.failure.reject(error)\n\t}\n\n\t@bind waitUntil(promise: Promise<void>): void {\n\t\tif (this.isResolved) {\n\t\t\tthrow new Error(\n\t\t\t\t'Cannot `waitUntil` - the export has already been resolved. Make sure to call `waitUntil` as soon as possible during an export - ie within the first react effect after rendering.'\n\t\t\t)\n\t\t}\n\t\tthis.promisesToWaitFor.push(\n\t\t\tpromise.catch((err) => console.error('Error while waiting for export:', err))\n\t\t)\n\t}\n\n\tprivate async resolvePromises() {\n\t\tlet lastLength = null\n\t\twhile (this.promisesToWaitFor.length !== lastLength) {\n\t\t\tlastLength = this.promisesToWaitFor.length\n\t\t\tawait Promise.allSettled(this.promisesToWaitFor)\n\n\t\t\t// wait for a cycle of the event loop to allow any of those promises to add more if needed.\n\t\t\tawait sleep(0)\n\t\t}\n\t}\n\n\tasync resolve() {\n\t\tconst timeoutPromise = sleep(this.maxDelayTimeMs).then(() => 'timeout' as const)\n\t\tconst resolvePromise = this.resolvePromises().then(() => 'resolved' as const)\n\n\t\tconst result = await Promise.race([timeoutPromise, resolvePromise, this.failure])\n\t\tif (result === 'timeout') {\n\t\t\tconsole.warn(`[tldraw] Export delay timed out after ${this.maxDelayTimeMs}ms`)\n\t\t}\n\n\t\tthis.isResolved = true\n\t}\n}\n"],
+  "mappings": ";;;;;;;;;;AAAA,SAAS,MAAM,MAAM,oBAAoB,aAAa;AAU/C,MAAM,YAAY;AAAA,EAKxB,YAA6B,gBAAwB;AAAxB;AAE5B,SAAK,QAAQ,MAAM,IAAI;AAAA,EACxB;AAAA,EAH6B;AAAA,EAJrB,aAAa;AAAA,EACJ,oBAAqC,CAAC;AAAA,EACtC,UAAU,mBAA0B;AAAA,EAW/C,KAAK,OAAsB;AAChC,SAAK,QAAQ,OAAO,KAAK;AAAA,EAC1B;AAAA,EAEM,UAAU,SAA8B;AAC7C,QAAI,KAAK,YAAY;AACpB,YAAM,IAAI;AAAA,QACT;AAAA,MACD;AAAA,IACD;AACA,SAAK,kBAAkB;AAAA,MACtB,QAAQ,MAAM,CAAC,QAAQ,QAAQ,MAAM,mCAAmC,GAAG,CAAC;AAAA,IAC7E;AAAA,EACD;AAAA,EAEA,MAAc,kBAAkB;AAC/B,QAAI,aAAa;AACjB,WAAO,KAAK,kBAAkB,WAAW,YAAY;AACpD,mBAAa,KAAK,kBAAkB;AACpC,YAAM,QAAQ,WAAW,KAAK,iBAAiB;AAG/C,YAAM,MAAM,CAAC;AAAA,IACd;AAAA,EACD;AAAA,EAEA,MAAM,UAAU;AACf,UAAM,iBAAiB,MAAM,KAAK,cAAc,EAAE,KAAK,MAAM,SAAkB;AAC/E,UAAM,iBAAiB,KAAK,gBAAgB,EAAE,KAAK,MAAM,UAAmB;AAE5E,UAAM,SAAS,MAAM,QAAQ,KAAK,CAAC,gBAAgB,gBAAgB,KAAK,OAAO,CAAC;AAChF,QAAI,WAAW,WAAW;AACzB,cAAQ,KAAK,yCAAyC,KAAK,cAAc,IAAI;AAAA,IAC9E;AAEA,SAAK,aAAa;AAAA,EACnB;AACD;AArCO;AAAA,EAAL;AAAA,GAdW,YAcN;AAIA;AAAA,EAAL;AAAA,GAlBW,YAkBN;",
   "names": []
 }

package/dist-esm/lib/exports/FontEmbedder.mjs

@@ -16,6 +16,9 @@ class FontEmbedder {
   fontFacesPromise = null;
   foundFontNames = /* @__PURE__ */ new Set();
   fontFacesToEmbed = /* @__PURE__ */ new Set();
+  // per export, keyed by resolved url: parsed font faces are shared across exports through the
+  // fetch cache, so a failed fetch stored on them would never be retried
+  embeddedUrls = /* @__PURE__ */ new Map();
   pendingPromises = [];
   startFindingDocumentFontFaces(doc) {
     assert(!this.fontFacesPromise, "FontEmbedder already started");
@@ -25,7 +28,7 @@ class FontEmbedder {
     assert(this.fontFacesPromise, "FontEmbedder not started");
     const fonts = parseCssFontFamilyValue(fontFamilyValue);
     for (const font of fonts) {
-      if (this.foundFontNames.has(font)) return;
+      if (this.foundFontNames.has(font)) continue;
       this.foundFontNames.add(font);
       this.pendingPromises.push(
         this.fontFacesPromise.then((fontFaces) => {
@@ -34,8 +37,8 @@ class FontEmbedder {
             if (this.fontFacesToEmbed.has(fontFace)) continue;
             this.fontFacesToEmbed.add(fontFace);
             for (const url of fontFace.urls) {
-              if (!url.resolved || url.embedded) continue;
-              url.embedded = resourceToDataUrl(url.resolved);
+              if (!url.resolved || this.embeddedUrls.has(url.resolved)) continue;
+              this.embeddedUrls.set(url.resolved, resourceToDataUrl(url.resolved));
             }
           }
         })
@@ -48,10 +51,10 @@ class FontEmbedder {
     for (const fontFace of this.fontFacesToEmbed) {
       let fontFaceString = `@font-face {${fontFace.fontFace}}`;
       for (const url of fontFace.urls) {
-        if (!url.embedded) continue;
-        const dataUrl = await url.embedded;
+        if (!url.resolved) continue;
+        const dataUrl = await this.embeddedUrls.get(url.resolved);
         if (!dataUrl) continue;
-        fontFaceString = fontFaceString.replace(url.original, dataUrl);
+        fontFaceString = fontFaceString.replace(url.original, () => dataUrl);
       }
       css += fontFaceString;
     }
@@ -88,15 +91,26 @@ async function getDocumentFontFaces(doc) {
   }
   return compact(await Promise.all(fontFaces)).flat();
 }
-const fetchCssFontFaces = fetchCache(async (response) => {
+const fetchParsedCss = fetchCache(async (response) => {
   const parsed = parseCss(await response.text(), response.url);
+  return {
+    fontFaces: parsed.fontFaces,
+    importUrls: parsed.imports.map(({ url }) => new URL(url, response.url).href)
+  };
+});
+async function fetchCssFontFaces(url, seen = /* @__PURE__ */ new Set()) {
+  if (seen.has(url)) return [];
+  seen.add(url);
+  const parsed = await fetchParsedCss(url);
+  if (!parsed) return [];
   const importedFontFaces = await Promise.all(
-    parsed.imports.map(({ url }) => fetchCssFontFaces(new URL(url, response.url).href))
+    parsed.importUrls.map((importUrl) => fetchCssFontFaces(importUrl, new Set(seen)))
   );
-  return [...parsed.fontFaces, ...compact(importedFontFaces).flat()];
-});
+  return [...parsed.fontFaces, ...importedFontFaces.flat()];
+}
 export {
   FontEmbedder,
-  SVG_EXPORT_CLASSNAME
+  SVG_EXPORT_CLASSNAME,
+  fetchCssFontFaces
 };
 //# sourceMappingURL=FontEmbedder.mjs.map

package/dist-esm/lib/exports/FontEmbedder.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/lib/exports/FontEmbedder.ts"],
-  "sourcesContent": ["import { assert, bind, compact } from '@tldraw/utils'\nimport { fetchCache, resourceToDataUrl } from './fetchCache'\nimport { ParsedFontFace, parseCss, parseCssFontFaces, parseCssFontFamilyValue } from './parseCss'\n\nexport const SVG_EXPORT_CLASSNAME = 'tldraw-svg-export'\n\n/**\n * Because SVGs cannot refer to external CSS/font resources, any web fonts used in the SVG must be\n * embedded as data URLs in inlined @font-face declarations. This class is responsible for\n * collecting used font faces and creating a CSS string with embedded fonts that can be used in the\n * SVG.\n *\n * It works in three steps:\n * 1. `startFindingDocumentFontFaces` - this traverses the given document, finding all the\n *    stylesheets in use (including those imported via `@import` rules etc) and extracting the\n *    @font-face declarations from them.\n * 2. `onFontFamilyValue` - as `StyleEmbedder` traverses the SVG, it will call this method with the\n *    value of the `font-family` property for each element. We parse out the font names in use, and\n *    mark them as needing to be embedded.\n * 3. `createCss` - once all the font families have been collected, this method will return a CSS\n *    string with embedded fonts.\n */\nexport class FontEmbedder {\n\tprivate fontFacesPromise: Promise<ParsedFontFace[]> | null = null\n\tprivate readonly foundFontNames = new Set<string>()\n\tprivate readonly fontFacesToEmbed = new Set<ParsedFontFace>()\n\tprivate readonly pendingPromises: Promise<void>[] = []\n\n\tstartFindingDocumentFontFaces(doc: Document) {\n\t\tassert(!this.fontFacesPromise, 'FontEmbedder already started')\n\t\tthis.fontFacesPromise = getDocumentFontFaces(doc)\n\t}\n\n\t@bind onFontFamilyValue(fontFamilyValue: string) {\n\t\tassert(this.fontFacesPromise, 'FontEmbedder not started')\n\n\t\tconst fonts = parseCssFontFamilyValue(fontFamilyValue)\n\t\tfor (const font of fonts) {\n\t\t\tif (this.foundFontNames.has(font)) return\n\t\t\tthis.foundFontNames.add(font)\n\n\t\t\tthis.pendingPromises.push(\n\t\t\t\tthis.fontFacesPromise.then((fontFaces) => {\n\t\t\t\t\tconst relevantFontFaces = fontFaces.filter((fontFace) => fontFace.fontFamilies.has(font))\n\t\t\t\t\tfor (const fontFace of relevantFontFaces) {\n\t\t\t\t\t\tif (this.fontFacesToEmbed.has(fontFace)) continue\n\n\t\t\t\t\t\tthis.fontFacesToEmbed.add(fontFace)\n\t\t\t\t\t\tfor (const url of fontFace.urls) {\n\t\t\t\t\t\t\tif (!url.resolved || url.embedded) continue\n\t\t\t\t\t\t\t// kick off fetching this font\n\t\t\t\t\t\t\turl.embedded = resourceToDataUrl(url.resolved)\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t})\n\t\t\t)\n\t\t}\n\t}\n\n\tasync createCss() {\n\t\tawait Promise.all(this.pendingPromises)\n\n\t\tlet css = ''\n\n\t\tfor (const fontFace of this.fontFacesToEmbed) {\n\t\t\tlet fontFaceString = `@font-face {${fontFace.fontFace}}`\n\n\t\t\tfor (const url of fontFace.urls) {\n\t\t\t\tif (!url.embedded) continue\n\t\t\t\tconst dataUrl = await url.embedded\n\t\t\t\tif (!dataUrl) continue\n\n\t\t\t\tfontFaceString = fontFaceString.replace(url.original, dataUrl)\n\t\t\t}\n\n\t\t\tcss += fontFaceString\n\t\t}\n\n\t\treturn css\n\t}\n}\n\nasync function getDocumentFontFaces(doc: Document) {\n\tconst win = doc.defaultView ?? globalThis\n\tconst fontFaces: (ParsedFontFace[] | Promise<ParsedFontFace[] | null>)[] = []\n\n\t// In exportToSvg we add the exported node to the DOM temporarily.\n\t// Because of this, and because we do a setTimeout to delay removing that node from the\n\t// DOM, when looking at document.styleSheets the number of nodes and stylesheets\n\t// can grow unbounded (especially when using \"Debug svg\" and moving shapes around).\n\t// To avoid this, we filter out the stylesheets that are part of the SVG export.\n\tconst styleSheetsWithoutSvgExports = Array.from(doc.styleSheets).filter(\n\t\t(styleSheet) =>\n\t\t\t!(styleSheet.ownerNode as HTMLElement | null)?.closest(`.${SVG_EXPORT_CLASSNAME}`)\n\t)\n\n\tfor (const styleSheet of styleSheetsWithoutSvgExports) {\n\t\tlet cssRules\n\t\ttry {\n\t\t\tcssRules = styleSheet.cssRules\n\t\t} catch {\n\t\t\t// some stylesheets don't allow access through the DOM. We'll try to fetch them instead.\n\t\t}\n\n\t\tif (cssRules) {\n\t\t\tfor (const rule of styleSheet.cssRules) {\n\t\t\t\tif (rule instanceof win.CSSFontFaceRule) {\n\t\t\t\t\tfontFaces.push(parseCssFontFaces(rule.cssText, styleSheet.href ?? doc.baseURI))\n\t\t\t\t} else if (rule instanceof win.CSSImportRule) {\n\t\t\t\t\tconst absoluteUrl = new URL(rule.href, rule.parentStyleSheet?.href ?? doc.baseURI)\n\t\t\t\t\tfontFaces.push(fetchCssFontFaces(absoluteUrl.href))\n\t\t\t\t}\n\t\t\t}\n\t\t} else if (styleSheet.href) {\n\t\t\tfontFaces.push(fetchCssFontFaces(styleSheet.href))\n\t\t}\n\t}\n\n\treturn compact(await Promise.all(fontFaces)).flat()\n}\n\nconst fetchCssFontFaces = fetchCache(async (response: Response): Promise<ParsedFontFace[]> => {\n\tconst parsed = parseCss(await response.text(), response.url)\n\n\tconst importedFontFaces = await Promise.all(\n\t\tparsed.imports.map(({ url }) => fetchCssFontFaces(new URL(url, response.url).href))\n\t)\n\n\treturn [...parsed.fontFaces, ...compact(importedFontFaces).flat()]\n})\n"],
-  "mappings": "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",
+  "sourcesContent": ["import { assert, bind, compact } from '@tldraw/utils'\nimport { fetchCache, resourceToDataUrl } from './fetchCache'\nimport { ParsedFontFace, parseCss, parseCssFontFaces, parseCssFontFamilyValue } from './parseCss'\n\nexport const SVG_EXPORT_CLASSNAME = 'tldraw-svg-export'\n\n/**\n * Because SVGs cannot refer to external CSS/font resources, any web fonts used in the SVG must be\n * embedded as data URLs in inlined @font-face declarations. This class is responsible for\n * collecting used font faces and creating a CSS string with embedded fonts that can be used in the\n * SVG.\n *\n * It works in three steps:\n * 1. `startFindingDocumentFontFaces` - this traverses the given document, finding all the\n *    stylesheets in use (including those imported via `@import` rules etc) and extracting the\n *    @font-face declarations from them.\n * 2. `onFontFamilyValue` - as `StyleEmbedder` traverses the SVG, it will call this method with the\n *    value of the `font-family` property for each element. We parse out the font names in use, and\n *    mark them as needing to be embedded.\n * 3. `createCss` - once all the font families have been collected, this method will return a CSS\n *    string with embedded fonts.\n */\nexport class FontEmbedder {\n\tprivate fontFacesPromise: Promise<ParsedFontFace[]> | null = null\n\tprivate readonly foundFontNames = new Set<string>()\n\tprivate readonly fontFacesToEmbed = new Set<ParsedFontFace>()\n\t// per export, keyed by resolved url: parsed font faces are shared across exports through the\n\t// fetch cache, so a failed fetch stored on them would never be retried\n\tprivate readonly embeddedUrls = new Map<string, Promise<string | null>>()\n\tprivate readonly pendingPromises: Promise<void>[] = []\n\n\tstartFindingDocumentFontFaces(doc: Document) {\n\t\tassert(!this.fontFacesPromise, 'FontEmbedder already started')\n\t\tthis.fontFacesPromise = getDocumentFontFaces(doc)\n\t}\n\n\t@bind onFontFamilyValue(fontFamilyValue: string) {\n\t\tassert(this.fontFacesPromise, 'FontEmbedder not started')\n\n\t\tconst fonts = parseCssFontFamilyValue(fontFamilyValue)\n\t\tfor (const font of fonts) {\n\t\t\tif (this.foundFontNames.has(font)) continue\n\t\t\tthis.foundFontNames.add(font)\n\n\t\t\tthis.pendingPromises.push(\n\t\t\t\tthis.fontFacesPromise.then((fontFaces) => {\n\t\t\t\t\tconst relevantFontFaces = fontFaces.filter((fontFace) => fontFace.fontFamilies.has(font))\n\t\t\t\t\tfor (const fontFace of relevantFontFaces) {\n\t\t\t\t\t\tif (this.fontFacesToEmbed.has(fontFace)) continue\n\n\t\t\t\t\t\tthis.fontFacesToEmbed.add(fontFace)\n\t\t\t\t\t\tfor (const url of fontFace.urls) {\n\t\t\t\t\t\t\tif (!url.resolved || this.embeddedUrls.has(url.resolved)) continue\n\t\t\t\t\t\t\t// kick off fetching this font\n\t\t\t\t\t\t\tthis.embeddedUrls.set(url.resolved, resourceToDataUrl(url.resolved))\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t})\n\t\t\t)\n\t\t}\n\t}\n\n\tasync createCss() {\n\t\tawait Promise.all(this.pendingPromises)\n\n\t\tlet css = ''\n\n\t\tfor (const fontFace of this.fontFacesToEmbed) {\n\t\t\tlet fontFaceString = `@font-face {${fontFace.fontFace}}`\n\n\t\t\tfor (const url of fontFace.urls) {\n\t\t\t\tif (!url.resolved) continue\n\t\t\t\tconst dataUrl = await this.embeddedUrls.get(url.resolved)\n\t\t\t\tif (!dataUrl) continue\n\n\t\t\t\tfontFaceString = fontFaceString.replace(url.original, () => dataUrl)\n\t\t\t}\n\n\t\t\tcss += fontFaceString\n\t\t}\n\n\t\treturn css\n\t}\n}\n\nasync function getDocumentFontFaces(doc: Document) {\n\tconst win = doc.defaultView ?? globalThis\n\tconst fontFaces: (ParsedFontFace[] | Promise<ParsedFontFace[] | null>)[] = []\n\n\t// In exportToSvg we add the exported node to the DOM temporarily.\n\t// Because of this, and because we do a setTimeout to delay removing that node from the\n\t// DOM, when looking at document.styleSheets the number of nodes and stylesheets\n\t// can grow unbounded (especially when using \"Debug svg\" and moving shapes around).\n\t// To avoid this, we filter out the stylesheets that are part of the SVG export.\n\tconst styleSheetsWithoutSvgExports = Array.from(doc.styleSheets).filter(\n\t\t(styleSheet) =>\n\t\t\t!(styleSheet.ownerNode as HTMLElement | null)?.closest(`.${SVG_EXPORT_CLASSNAME}`)\n\t)\n\n\tfor (const styleSheet of styleSheetsWithoutSvgExports) {\n\t\tlet cssRules\n\t\ttry {\n\t\t\tcssRules = styleSheet.cssRules\n\t\t} catch {\n\t\t\t// some stylesheets don't allow access through the DOM. We'll try to fetch them instead.\n\t\t}\n\n\t\tif (cssRules) {\n\t\t\tfor (const rule of styleSheet.cssRules) {\n\t\t\t\tif (rule instanceof win.CSSFontFaceRule) {\n\t\t\t\t\tfontFaces.push(parseCssFontFaces(rule.cssText, styleSheet.href ?? doc.baseURI))\n\t\t\t\t} else if (rule instanceof win.CSSImportRule) {\n\t\t\t\t\tconst absoluteUrl = new URL(rule.href, rule.parentStyleSheet?.href ?? doc.baseURI)\n\t\t\t\t\tfontFaces.push(fetchCssFontFaces(absoluteUrl.href))\n\t\t\t\t}\n\t\t\t}\n\t\t} else if (styleSheet.href) {\n\t\t\tfontFaces.push(fetchCssFontFaces(styleSheet.href))\n\t\t}\n\t}\n\n\treturn compact(await Promise.all(fontFaces)).flat()\n}\n\nconst fetchParsedCss = fetchCache(async (response: Response) => {\n\tconst parsed = parseCss(await response.text(), response.url)\n\treturn {\n\t\tfontFaces: parsed.fontFaces,\n\t\timportUrls: parsed.imports.map(({ url }) => new URL(url, response.url).href),\n\t}\n})\n\n/** @internal */\nexport async function fetchCssFontFaces(\n\turl: string,\n\t// the chain of sheets that imported this one: sheets that @import each other would otherwise\n\t// await their own in-flight fetch forever. Each branch gets its own copy so a sheet imported by\n\t// two siblings lands under both in source order, not under whichever fetch resolved first.\n\tseen = new Set<string>()\n): Promise<ParsedFontFace[]> {\n\tif (seen.has(url)) return []\n\tseen.add(url)\n\n\tconst parsed = await fetchParsedCss(url)\n\tif (!parsed) return []\n\n\tconst importedFontFaces = await Promise.all(\n\t\tparsed.importUrls.map((importUrl) => fetchCssFontFaces(importUrl, new Set(seen)))\n\t)\n\treturn [...parsed.fontFaces, ...importedFontFaces.flat()]\n}\n"],
+  "mappings": "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",
   "names": []
 }

package/dist-esm/lib/exports/StyleEmbedder.mjs

@@ -68,10 +68,15 @@ class StyleEmbedder {
           const urlMatches = parseCssValueUrls(value);
           if (urlMatches.length === 0) continue;
           promises.push(
-            ...urlMatches.map(async ({ url, original }) => {
-              const dataUrl = (await resourceToDataUrl(url)) ?? "data:";
-              styles[property] = value.replace(original, `url("${dataUrl}")`);
-            })
+            (async () => {
+              const dataUrls = await Promise.all(
+                urlMatches.map(({ url }) => resourceToDataUrl(url))
+              );
+              styles[property] = urlMatches.reduce(
+                (result, { original }, i) => result.replace(original, () => `url("${dataUrls[i] ?? "data:"}")`),
+                value
+              );
+            })()
           );
         }
       }