tldraw 3.16.0-next.c30b1b5e551a → 3.16.0-next.e57e478c23e0

package/dist-esm/lib/shapes/arrow/arrowLabel.mjs

@@ -165,6 +165,12 @@ function getArrowLabelRange(editor, shape, info) {
   return { start: startRelative, end: endRelative, dbg };
 }
 function getArrowLabelPosition(editor, shape) {
+  const isEditing = editor.getEditingShapeId() === shape.id;
+  if (!isEditing && isEmptyRichText(shape.props.richText)) {
+    const bodyGeom2 = getArrowBodyGeometry(editor, shape);
+    const labelCenter2 = bodyGeom2.interpolateAlongEdge(0.5);
+    return { box: Box.FromCenter(labelCenter2, new Vec(0, 0)), debugGeom: [] };
+  }
   const debugGeom = [];
   const info = getArrowInfo(editor, shape);
   const arrowheadInfo = {

package/dist-esm/lib/shapes/arrow/arrowLabel.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/lib/shapes/arrow/arrowLabel.ts"],
-  "sourcesContent": ["import {\n\tArc2d,\n\tBox,\n\tCircle2d,\n\tEdge2d,\n\tEditor,\n\tGeometry2d,\n\tGroup2d,\n\tPolygon2d,\n\tPolyline2d,\n\tTLArrowShape,\n\tTLShape,\n\tVec,\n\tVecLike,\n\tclamp,\n\tcreateComputedCache,\n\texhaustiveSwitchError,\n\tgetChangedKeys,\n\tpointInPolygon,\n\ttoRichText,\n} from '@tldraw/editor'\nimport { isEmptyRichText, renderHtmlFromRichTextForMeasurement } from '../../utils/text/richText'\nimport {\n\tARROW_LABEL_FONT_SIZES,\n\tARROW_LABEL_PADDING,\n\tFONT_FAMILIES,\n\tLABEL_TO_ARROW_PADDING,\n\tSTROKE_SIZES,\n\tTEXT_PROPS,\n} from '../shared/default-shape-constants'\nimport { TLArrowInfo } from './arrow-types'\nimport { getArrowInfo } from './shared'\n\nexport function getArrowBodyGeometry(editor: Editor, shape: TLArrowShape) {\n\tconst info = getArrowInfo(editor, shape)!\n\tswitch (info.type) {\n\t\tcase 'straight':\n\t\t\treturn new Edge2d({\n\t\t\t\tstart: Vec.From(info.start.point),\n\t\t\t\tend: Vec.From(info.end.point),\n\t\t\t})\n\t\tcase 'arc':\n\t\t\treturn new Arc2d({\n\t\t\t\tcenter: Vec.Cast(info.handleArc.center),\n\t\t\t\tstart: Vec.Cast(info.start.point),\n\t\t\t\tend: Vec.Cast(info.end.point),\n\t\t\t\tsweepFlag: info.bodyArc.sweepFlag,\n\t\t\t\tlargeArcFlag: info.bodyArc.largeArcFlag,\n\t\t\t})\n\t\tcase 'elbow':\n\t\t\treturn new Polyline2d({ points: info.route.points })\n\t\tdefault:\n\t\t\texhaustiveSwitchError(info, 'type')\n\t}\n}\n\nconst labelSizeCache = createComputedCache(\n\t'arrow label size',\n\t(editor: Editor, shape: TLArrowShape) => {\n\t\teditor.fonts.trackFontsForShape(shape)\n\t\tlet width = 0\n\t\tlet height = 0\n\n\t\tconst bodyGeom = getArrowBodyGeometry(editor, shape)\n\t\t// We use 'i' as a default label to measure against as a minimum width.\n\t\tconst isEmpty = isEmptyRichText(shape.props.richText)\n\t\tconst html = renderHtmlFromRichTextForMeasurement(\n\t\t\teditor,\n\t\t\tisEmpty ? toRichText('i') : shape.props.richText\n\t\t)\n\n\t\tconst bodyBounds = bodyGeom.bounds\n\n\t\tconst fontSize = getArrowLabelFontSize(shape)\n\n\t\t// First we measure the text with no constraints\n\t\tconst { w, h } = editor.textMeasure.measureHtml(html, {\n\t\t\t...TEXT_PROPS,\n\t\t\tfontFamily: FONT_FAMILIES[shape.props.font],\n\t\t\tfontSize,\n\t\t\tmaxWidth: null,\n\t\t})\n\n\t\twidth = w\n\t\theight = h\n\n\t\tlet shouldSquish = false\n\n\t\t// If the text is wider than the body, we need to squish it\n\t\tconst info = getArrowInfo(editor, shape)!\n\t\tconst labelToArrowPadding = getLabelToArrowPadding(shape)\n\t\tconst margin =\n\t\t\tinfo.type === 'elbow'\n\t\t\t\t? Math.max(info.elbow.A.arrowheadOffset + labelToArrowPadding, 32) +\n\t\t\t\t\tMath.max(info.elbow.B.arrowheadOffset + labelToArrowPadding, 32)\n\t\t\t\t: 64\n\n\t\tif (bodyBounds.width > bodyBounds.height) {\n\t\t\twidth = Math.max(Math.min(w, margin), Math.min(bodyBounds.width - margin, w))\n\t\t\tshouldSquish = true\n\t\t} else if (width > 16 * fontSize) {\n\t\t\twidth = 16 * fontSize\n\t\t\tshouldSquish = true\n\t\t}\n\n\t\tif (shouldSquish) {\n\t\t\tconst { w: squishedWidth, h: squishedHeight } = editor.textMeasure.measureHtml(html, {\n\t\t\t\t...TEXT_PROPS,\n\t\t\t\tfontFamily: FONT_FAMILIES[shape.props.font],\n\t\t\t\tfontSize,\n\t\t\t\tmaxWidth: width,\n\t\t\t})\n\n\t\t\twidth = squishedWidth\n\t\t\theight = squishedHeight\n\t\t}\n\n\t\treturn new Vec(width, height).addScalar(ARROW_LABEL_PADDING * 2 * shape.props.scale)\n\t},\n\t{\n\t\tareRecordsEqual: (a, b) => {\n\t\t\tif (a.props === b.props) return true\n\n\t\t\t// If the only thing that has changed is the label position, we can skip recalculating the size\n\t\t\tconst changedKeys = getChangedKeys(a.props, b.props)\n\t\t\treturn changedKeys.length === 1 && changedKeys[0] === 'labelPosition'\n\t\t},\n\t}\n)\n\nfunction getArrowLabelSize(editor: Editor, shape: TLArrowShape) {\n\treturn labelSizeCache.get(editor, shape.id) ?? new Vec(0, 0)\n}\n\nfunction getLabelToArrowPadding(shape: TLArrowShape) {\n\tconst strokeWidth = STROKE_SIZES[shape.props.size]\n\tconst labelToArrowPadding =\n\t\t(LABEL_TO_ARROW_PADDING +\n\t\t\t(strokeWidth - STROKE_SIZES.s) * 2 +\n\t\t\t(strokeWidth === STROKE_SIZES.xl ? 20 : 0)) *\n\t\tshape.props.scale\n\n\treturn labelToArrowPadding\n}\n\n/**\n * Return the range of possible label positions for an arrow. The full possible range is 0 to 1, but\n * as the label itself takes up space the usable range is smaller.\n */\nfunction getArrowLabelRange(editor: Editor, shape: TLArrowShape, info: TLArrowInfo) {\n\tconst bodyGeom = getArrowBodyGeometry(editor, shape)\n\tconst dbgPoints: VecLike[] = []\n\tconst dbg: Geometry2d[] = [new Group2d({ children: [bodyGeom], debugColor: 'lime' })]\n\n\tconst labelSize = getArrowLabelSize(editor, shape)\n\tconst labelToArrowPadding = getLabelToArrowPadding(shape)\n\tconst paddingRelative = labelToArrowPadding / bodyGeom.length\n\n\t// we can calculate the range by sticking the center of the label at the very start/end of the\n\t// arrow, and seeing where the label intersects with the arrow. Then, if we move the label's\n\t// center to that point, that'll be the start/end of the range.\n\n\tlet startBox, endBox\n\tif (info.type === 'elbow') {\n\t\t// for elbow arrows, because they have multiple segments but are always axis-aligned, we can use\n\t\t// an expanded box. This helps keep the box from partially covering the first segment when it's\n\t\t// very small.\n\t\tdbgPoints.push(info.start.point, info.end.point)\n\t\tstartBox = Box.FromCenter(info.start.point, labelSize).expandBy(labelToArrowPadding)\n\t\tendBox = Box.FromCenter(info.end.point, labelSize).expandBy(labelToArrowPadding)\n\t} else {\n\t\t// for other arrows, we move along the arrow by the padding amount to find the start/end points\n\t\tconst startPoint = bodyGeom.interpolateAlongEdge(paddingRelative)\n\t\tconst endPoint = bodyGeom.interpolateAlongEdge(1 - paddingRelative)\n\t\tdbgPoints.push(startPoint, endPoint)\n\t\tstartBox = Box.FromCenter(startPoint, labelSize)\n\t\tendBox = Box.FromCenter(endPoint, labelSize)\n\t}\n\tconst startIntersections = bodyGeom.intersectPolygon(startBox.corners)\n\tconst endIntersections = bodyGeom.intersectPolygon(endBox.corners)\n\n\tconst startConstrained = furthest(info.start.point, startIntersections)\n\tconst endConstrained = furthest(info.end.point, endIntersections)\n\n\tlet startRelative = startConstrained ? bodyGeom.uninterpolateAlongEdge(startConstrained) : 0.5\n\tlet endRelative = endConstrained ? bodyGeom.uninterpolateAlongEdge(endConstrained) : 0.5\n\n\tif (startRelative > endRelative) {\n\t\tstartRelative = 0.5\n\t\tendRelative = 0.5\n\t}\n\n\tfor (const pt of [...startIntersections, ...endIntersections, ...dbgPoints]) {\n\t\tdbg.push(\n\t\t\tnew Circle2d({\n\t\t\t\tx: pt.x - 3,\n\t\t\t\ty: pt.y - 3,\n\t\t\t\tradius: 3,\n\t\t\t\tisFilled: false,\n\t\t\t\tdebugColor: 'magenta',\n\t\t\t\tignore: true,\n\t\t\t})\n\t\t)\n\t}\n\tdbg.push(\n\t\tnew Polygon2d({\n\t\t\tpoints: startBox.corners,\n\t\t\tdebugColor: 'lime',\n\t\t\tisFilled: false,\n\t\t\tignore: true,\n\t\t}),\n\t\tnew Polygon2d({\n\t\t\tpoints: endBox.corners,\n\t\t\tdebugColor: 'lime',\n\t\t\tisFilled: false,\n\t\t\tignore: true,\n\t\t})\n\t)\n\n\treturn { start: startRelative, end: endRelative, dbg }\n}\n\ninterface ArrowheadInfo {\n\thasStartBinding: boolean\n\thasEndBinding: boolean\n\thasStartArrowhead: boolean\n\thasEndArrowhead: boolean\n}\nexport function getArrowLabelPosition(editor: Editor, shape: TLArrowShape) {\n\tconst debugGeom: Geometry2d[] = []\n\tconst info = getArrowInfo(editor, shape)!\n\n\tconst arrowheadInfo: ArrowheadInfo = {\n\t\thasStartBinding: !!info.bindings.start,\n\t\thasEndBinding: !!info.bindings.end,\n\t\thasStartArrowhead: info.start.arrowhead !== 'none',\n\t\thasEndArrowhead: info.end.arrowhead !== 'none',\n\t}\n\n\tconst range = getArrowLabelRange(editor, shape, info)\n\tif (range.dbg) debugGeom.push(...range.dbg)\n\n\tconst clampedPosition = getClampedPosition(shape, range, arrowheadInfo)\n\tconst bodyGeom = getArrowBodyGeometry(editor, shape)\n\tconst labelCenter = bodyGeom.interpolateAlongEdge(clampedPosition)\n\tconst labelSize = getArrowLabelSize(editor, shape)\n\n\treturn { box: Box.FromCenter(labelCenter, labelSize), debugGeom }\n}\n\nfunction getClampedPosition(\n\tshape: TLArrowShape,\n\trange: { start: number; end: number },\n\tarrowheadInfo: ArrowheadInfo\n) {\n\tconst { hasEndArrowhead, hasEndBinding, hasStartBinding, hasStartArrowhead } = arrowheadInfo\n\tconst clampedPosition = clamp(\n\t\tshape.props.labelPosition,\n\t\thasStartArrowhead || hasStartBinding ? range.start : 0,\n\t\thasEndArrowhead || hasEndBinding ? range.end : 1\n\t)\n\n\treturn clampedPosition\n}\n\nfunction furthest(from: VecLike, candidates: VecLike[]): VecLike | null {\n\tlet furthest: VecLike | null = null\n\tlet furthestDist = -Infinity\n\n\tfor (const candidate of candidates) {\n\t\tconst dist = Vec.Dist2(from, candidate)\n\t\tif (dist > furthestDist) {\n\t\t\tfurthest = candidate\n\t\t\tfurthestDist = dist\n\t\t}\n\t}\n\n\treturn furthest\n}\n\nexport function getArrowLabelFontSize(shape: TLArrowShape) {\n\treturn ARROW_LABEL_FONT_SIZES[shape.props.size] * shape.props.scale\n}\n\nexport function getArrowLabelDefaultPosition(editor: Editor, shape: TLArrowShape) {\n\tconst info = getArrowInfo(editor, shape)!\n\tswitch (info.type) {\n\t\tcase 'straight':\n\t\tcase 'arc':\n\t\t\treturn 0.5\n\t\tcase 'elbow': {\n\t\t\tconst midpointHandle = info.route.midpointHandle\n\t\t\tconst bodyGeom = getArrowBodyGeometry(editor, shape)\n\t\t\tif (midpointHandle && bodyGeom) {\n\t\t\t\treturn bodyGeom.uninterpolateAlongEdge(midpointHandle.point)\n\t\t\t}\n\t\t\treturn 0.5\n\t\t}\n\t\tdefault:\n\t\t\texhaustiveSwitchError(info, 'type')\n\t}\n}\n\n/** @internal */\nexport function isOverArrowLabel(editor: Editor, shape: TLShape) {\n\tif (!editor.isShapeOfType<TLArrowShape>(shape, 'arrow')) return false\n\n\tconst pointInShapeSpace = editor.getPointInShapeSpace(shape, editor.inputs.currentPagePoint)\n\t// How should we handle multiple labels? Do shapes ever have multiple labels?\n\tconst labelGeometry = editor.getShapeGeometry<Group2d>(shape).children[1]\n\t// Knowing what we know about arrows... if the shape has no text in its label,\n\t// then the label geometry should not be there.\n\treturn labelGeometry && pointInPolygon(pointInShapeSpace, labelGeometry.vertices)\n}\n"],
-  "mappings": "AAAA;AAAA,EACC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EAGA;AAAA,EACA;AAAA,EACA;AAAA,EAGA;AAAA,EAEA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACM;AACP,SAAS,iBAAiB,4CAA4C;AACtE;AAAA,EACC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACM;AAEP,SAAS,oBAAoB;AAEtB,SAAS,qBAAqB,QAAgB,OAAqB;AACzE,QAAM,OAAO,aAAa,QAAQ,KAAK;AACvC,UAAQ,KAAK,MAAM;AAAA,IAClB,KAAK;AACJ,aAAO,IAAI,OAAO;AAAA,QACjB,OAAO,IAAI,KAAK,KAAK,MAAM,KAAK;AAAA,QAChC,KAAK,IAAI,KAAK,KAAK,IAAI,KAAK;AAAA,MAC7B,CAAC;AAAA,IACF,KAAK;AACJ,aAAO,IAAI,MAAM;AAAA,QAChB,QAAQ,IAAI,KAAK,KAAK,UAAU,MAAM;AAAA,QACtC,OAAO,IAAI,KAAK,KAAK,MAAM,KAAK;AAAA,QAChC,KAAK,IAAI,KAAK,KAAK,IAAI,KAAK;AAAA,QAC5B,WAAW,KAAK,QAAQ;AAAA,QACxB,cAAc,KAAK,QAAQ;AAAA,MAC5B,CAAC;AAAA,IACF,KAAK;AACJ,aAAO,IAAI,WAAW,EAAE,QAAQ,KAAK,MAAM,OAAO,CAAC;AAAA,IACpD;AACC,4BAAsB,MAAM,MAAM;AAAA,EACpC;AACD;AAEA,MAAM,iBAAiB;AAAA,EACtB;AAAA,EACA,CAAC,QAAgB,UAAwB;AACxC,WAAO,MAAM,mBAAmB,KAAK;AACrC,QAAI,QAAQ;AACZ,QAAI,SAAS;AAEb,UAAM,WAAW,qBAAqB,QAAQ,KAAK;AAEnD,UAAM,UAAU,gBAAgB,MAAM,MAAM,QAAQ;AACpD,UAAM,OAAO;AAAA,MACZ;AAAA,MACA,UAAU,WAAW,GAAG,IAAI,MAAM,MAAM;AAAA,IACzC;AAEA,UAAM,aAAa,SAAS;AAE5B,UAAM,WAAW,sBAAsB,KAAK;AAG5C,UAAM,EAAE,GAAG,EAAE,IAAI,OAAO,YAAY,YAAY,MAAM;AAAA,MACrD,GAAG;AAAA,MACH,YAAY,cAAc,MAAM,MAAM,IAAI;AAAA,MAC1C;AAAA,MACA,UAAU;AAAA,IACX,CAAC;AAED,YAAQ;AACR,aAAS;AAET,QAAI,eAAe;AAGnB,UAAM,OAAO,aAAa,QAAQ,KAAK;AACvC,UAAM,sBAAsB,uBAAuB,KAAK;AACxD,UAAM,SACL,KAAK,SAAS,UACX,KAAK,IAAI,KAAK,MAAM,EAAE,kBAAkB,qBAAqB,EAAE,IAChE,KAAK,IAAI,KAAK,MAAM,EAAE,kBAAkB,qBAAqB,EAAE,IAC9D;AAEJ,QAAI,WAAW,QAAQ,WAAW,QAAQ;AACzC,cAAQ,KAAK,IAAI,KAAK,IAAI,GAAG,MAAM,GAAG,KAAK,IAAI,WAAW,QAAQ,QAAQ,CAAC,CAAC;AAC5E,qBAAe;AAAA,IAChB,WAAW,QAAQ,KAAK,UAAU;AACjC,cAAQ,KAAK;AACb,qBAAe;AAAA,IAChB;AAEA,QAAI,cAAc;AACjB,YAAM,EAAE,GAAG,eAAe,GAAG,eAAe,IAAI,OAAO,YAAY,YAAY,MAAM;AAAA,QACpF,GAAG;AAAA,QACH,YAAY,cAAc,MAAM,MAAM,IAAI;AAAA,QAC1C;AAAA,QACA,UAAU;AAAA,MACX,CAAC;AAED,cAAQ;AACR,eAAS;AAAA,IACV;AAEA,WAAO,IAAI,IAAI,OAAO,MAAM,EAAE,UAAU,sBAAsB,IAAI,MAAM,MAAM,KAAK;AAAA,EACpF;AAAA,EACA;AAAA,IACC,iBAAiB,CAAC,GAAG,MAAM;AAC1B,UAAI,EAAE,UAAU,EAAE,MAAO,QAAO;AAGhC,YAAM,cAAc,eAAe,EAAE,OAAO,EAAE,KAAK;AACnD,aAAO,YAAY,WAAW,KAAK,YAAY,CAAC,MAAM;AAAA,IACvD;AAAA,EACD;AACD;AAEA,SAAS,kBAAkB,QAAgB,OAAqB;AAC/D,SAAO,eAAe,IAAI,QAAQ,MAAM,EAAE,KAAK,IAAI,IAAI,GAAG,CAAC;AAC5D;AAEA,SAAS,uBAAuB,OAAqB;AACpD,QAAM,cAAc,aAAa,MAAM,MAAM,IAAI;AACjD,QAAM,uBACJ,0BACC,cAAc,aAAa,KAAK,KAChC,gBAAgB,aAAa,KAAK,KAAK,MACzC,MAAM,MAAM;AAEb,SAAO;AACR;AAMA,SAAS,mBAAmB,QAAgB,OAAqB,MAAmB;AACnF,QAAM,WAAW,qBAAqB,QAAQ,KAAK;AACnD,QAAM,YAAuB,CAAC;AAC9B,QAAM,MAAoB,CAAC,IAAI,QAAQ,EAAE,UAAU,CAAC,QAAQ,GAAG,YAAY,OAAO,CAAC,CAAC;AAEpF,QAAM,YAAY,kBAAkB,QAAQ,KAAK;AACjD,QAAM,sBAAsB,uBAAuB,KAAK;AACxD,QAAM,kBAAkB,sBAAsB,SAAS;AAMvD,MAAI,UAAU;AACd,MAAI,KAAK,SAAS,SAAS;AAI1B,cAAU,KAAK,KAAK,MAAM,OAAO,KAAK,IAAI,KAAK;AAC/C,eAAW,IAAI,WAAW,KAAK,MAAM,OAAO,SAAS,EAAE,SAAS,mBAAmB;AACnF,aAAS,IAAI,WAAW,KAAK,IAAI,OAAO,SAAS,EAAE,SAAS,mBAAmB;AAAA,EAChF,OAAO;AAEN,UAAM,aAAa,SAAS,qBAAqB,eAAe;AAChE,UAAM,WAAW,SAAS,qBAAqB,IAAI,eAAe;AAClE,cAAU,KAAK,YAAY,QAAQ;AACnC,eAAW,IAAI,WAAW,YAAY,SAAS;AAC/C,aAAS,IAAI,WAAW,UAAU,SAAS;AAAA,EAC5C;AACA,QAAM,qBAAqB,SAAS,iBAAiB,SAAS,OAAO;AACrE,QAAM,mBAAmB,SAAS,iBAAiB,OAAO,OAAO;AAEjE,QAAM,mBAAmB,SAAS,KAAK,MAAM,OAAO,kBAAkB;AACtE,QAAM,iBAAiB,SAAS,KAAK,IAAI,OAAO,gBAAgB;AAEhE,MAAI,gBAAgB,mBAAmB,SAAS,uBAAuB,gBAAgB,IAAI;AAC3F,MAAI,cAAc,iBAAiB,SAAS,uBAAuB,cAAc,IAAI;AAErF,MAAI,gBAAgB,aAAa;AAChC,oBAAgB;AAChB,kBAAc;AAAA,EACf;AAEA,aAAW,MAAM,CAAC,GAAG,oBAAoB,GAAG,kBAAkB,GAAG,SAAS,GAAG;AAC5E,QAAI;AAAA,MACH,IAAI,SAAS;AAAA,QACZ,GAAG,GAAG,IAAI;AAAA,QACV,GAAG,GAAG,IAAI;AAAA,QACV,QAAQ;AAAA,QACR,UAAU;AAAA,QACV,YAAY;AAAA,QACZ,QAAQ;AAAA,MACT,CAAC;AAAA,IACF;AAAA,EACD;AACA,MAAI;AAAA,IACH,IAAI,UAAU;AAAA,MACb,QAAQ,SAAS;AAAA,MACjB,YAAY;AAAA,MACZ,UAAU;AAAA,MACV,QAAQ;AAAA,IACT,CAAC;AAAA,IACD,IAAI,UAAU;AAAA,MACb,QAAQ,OAAO;AAAA,MACf,YAAY;AAAA,MACZ,UAAU;AAAA,MACV,QAAQ;AAAA,IACT,CAAC;AAAA,EACF;AAEA,SAAO,EAAE,OAAO,eAAe,KAAK,aAAa,IAAI;AACtD;AAQO,SAAS,sBAAsB,QAAgB,OAAqB;AAC1E,QAAM,YAA0B,CAAC;AACjC,QAAM,OAAO,aAAa,QAAQ,KAAK;AAEvC,QAAM,gBAA+B;AAAA,IACpC,iBAAiB,CAAC,CAAC,KAAK,SAAS;AAAA,IACjC,eAAe,CAAC,CAAC,KAAK,SAAS;AAAA,IAC/B,mBAAmB,KAAK,MAAM,cAAc;AAAA,IAC5C,iBAAiB,KAAK,IAAI,cAAc;AAAA,EACzC;AAEA,QAAM,QAAQ,mBAAmB,QAAQ,OAAO,IAAI;AACpD,MAAI,MAAM,IAAK,WAAU,KAAK,GAAG,MAAM,GAAG;AAE1C,QAAM,kBAAkB,mBAAmB,OAAO,OAAO,aAAa;AACtE,QAAM,WAAW,qBAAqB,QAAQ,KAAK;AACnD,QAAM,cAAc,SAAS,qBAAqB,eAAe;AACjE,QAAM,YAAY,kBAAkB,QAAQ,KAAK;AAEjD,SAAO,EAAE,KAAK,IAAI,WAAW,aAAa,SAAS,GAAG,UAAU;AACjE;AAEA,SAAS,mBACR,OACA,OACA,eACC;AACD,QAAM,EAAE,iBAAiB,eAAe,iBAAiB,kBAAkB,IAAI;AAC/E,QAAM,kBAAkB;AAAA,IACvB,MAAM,MAAM;AAAA,IACZ,qBAAqB,kBAAkB,MAAM,QAAQ;AAAA,IACrD,mBAAmB,gBAAgB,MAAM,MAAM;AAAA,EAChD;AAEA,SAAO;AACR;AAEA,SAAS,SAAS,MAAe,YAAuC;AACvE,MAAIA,YAA2B;AAC/B,MAAI,eAAe;AAEnB,aAAW,aAAa,YAAY;AACnC,UAAM,OAAO,IAAI,MAAM,MAAM,SAAS;AACtC,QAAI,OAAO,cAAc;AACxB,MAAAA,YAAW;AACX,qBAAe;AAAA,IAChB;AAAA,EACD;AAEA,SAAOA;AACR;AAEO,SAAS,sBAAsB,OAAqB;AAC1D,SAAO,uBAAuB,MAAM,MAAM,IAAI,IAAI,MAAM,MAAM;AAC/D;AAEO,SAAS,6BAA6B,QAAgB,OAAqB;AACjF,QAAM,OAAO,aAAa,QAAQ,KAAK;AACvC,UAAQ,KAAK,MAAM;AAAA,IAClB,KAAK;AAAA,IACL,KAAK;AACJ,aAAO;AAAA,IACR,KAAK,SAAS;AACb,YAAM,iBAAiB,KAAK,MAAM;AAClC,YAAM,WAAW,qBAAqB,QAAQ,KAAK;AACnD,UAAI,kBAAkB,UAAU;AAC/B,eAAO,SAAS,uBAAuB,eAAe,KAAK;AAAA,MAC5D;AACA,aAAO;AAAA,IACR;AAAA,IACA;AACC,4BAAsB,MAAM,MAAM;AAAA,EACpC;AACD;AAGO,SAAS,iBAAiB,QAAgB,OAAgB;AAChE,MAAI,CAAC,OAAO,cAA4B,OAAO,OAAO,EAAG,QAAO;AAEhE,QAAM,oBAAoB,OAAO,qBAAqB,OAAO,OAAO,OAAO,gBAAgB;AAE3F,QAAM,gBAAgB,OAAO,iBAA0B,KAAK,EAAE,SAAS,CAAC;AAGxE,SAAO,iBAAiB,eAAe,mBAAmB,cAAc,QAAQ;AACjF;",
-  "names": ["furthest"]
+  "sourcesContent": ["import {\n\tArc2d,\n\tBox,\n\tCircle2d,\n\tEdge2d,\n\tEditor,\n\tGeometry2d,\n\tGroup2d,\n\tPolygon2d,\n\tPolyline2d,\n\tTLArrowShape,\n\tTLShape,\n\tVec,\n\tVecLike,\n\tclamp,\n\tcreateComputedCache,\n\texhaustiveSwitchError,\n\tgetChangedKeys,\n\tpointInPolygon,\n\ttoRichText,\n} from '@tldraw/editor'\nimport { isEmptyRichText, renderHtmlFromRichTextForMeasurement } from '../../utils/text/richText'\nimport {\n\tARROW_LABEL_FONT_SIZES,\n\tARROW_LABEL_PADDING,\n\tFONT_FAMILIES,\n\tLABEL_TO_ARROW_PADDING,\n\tSTROKE_SIZES,\n\tTEXT_PROPS,\n} from '../shared/default-shape-constants'\nimport { TLArrowInfo } from './arrow-types'\nimport { getArrowInfo } from './shared'\n\nexport function getArrowBodyGeometry(editor: Editor, shape: TLArrowShape) {\n\tconst info = getArrowInfo(editor, shape)!\n\tswitch (info.type) {\n\t\tcase 'straight':\n\t\t\treturn new Edge2d({\n\t\t\t\tstart: Vec.From(info.start.point),\n\t\t\t\tend: Vec.From(info.end.point),\n\t\t\t})\n\t\tcase 'arc':\n\t\t\treturn new Arc2d({\n\t\t\t\tcenter: Vec.Cast(info.handleArc.center),\n\t\t\t\tstart: Vec.Cast(info.start.point),\n\t\t\t\tend: Vec.Cast(info.end.point),\n\t\t\t\tsweepFlag: info.bodyArc.sweepFlag,\n\t\t\t\tlargeArcFlag: info.bodyArc.largeArcFlag,\n\t\t\t})\n\t\tcase 'elbow':\n\t\t\treturn new Polyline2d({ points: info.route.points })\n\t\tdefault:\n\t\t\texhaustiveSwitchError(info, 'type')\n\t}\n}\n\nconst labelSizeCache = createComputedCache(\n\t'arrow label size',\n\t(editor: Editor, shape: TLArrowShape) => {\n\t\teditor.fonts.trackFontsForShape(shape)\n\t\tlet width = 0\n\t\tlet height = 0\n\n\t\tconst bodyGeom = getArrowBodyGeometry(editor, shape)\n\t\t// We use 'i' as a default label to measure against as a minimum width.\n\t\tconst isEmpty = isEmptyRichText(shape.props.richText)\n\t\tconst html = renderHtmlFromRichTextForMeasurement(\n\t\t\teditor,\n\t\t\tisEmpty ? toRichText('i') : shape.props.richText\n\t\t)\n\n\t\tconst bodyBounds = bodyGeom.bounds\n\n\t\tconst fontSize = getArrowLabelFontSize(shape)\n\n\t\t// First we measure the text with no constraints\n\t\tconst { w, h } = editor.textMeasure.measureHtml(html, {\n\t\t\t...TEXT_PROPS,\n\t\t\tfontFamily: FONT_FAMILIES[shape.props.font],\n\t\t\tfontSize,\n\t\t\tmaxWidth: null,\n\t\t})\n\n\t\twidth = w\n\t\theight = h\n\n\t\tlet shouldSquish = false\n\n\t\t// If the text is wider than the body, we need to squish it\n\t\tconst info = getArrowInfo(editor, shape)!\n\t\tconst labelToArrowPadding = getLabelToArrowPadding(shape)\n\t\tconst margin =\n\t\t\tinfo.type === 'elbow'\n\t\t\t\t? Math.max(info.elbow.A.arrowheadOffset + labelToArrowPadding, 32) +\n\t\t\t\t\tMath.max(info.elbow.B.arrowheadOffset + labelToArrowPadding, 32)\n\t\t\t\t: 64\n\n\t\tif (bodyBounds.width > bodyBounds.height) {\n\t\t\twidth = Math.max(Math.min(w, margin), Math.min(bodyBounds.width - margin, w))\n\t\t\tshouldSquish = true\n\t\t} else if (width > 16 * fontSize) {\n\t\t\twidth = 16 * fontSize\n\t\t\tshouldSquish = true\n\t\t}\n\n\t\tif (shouldSquish) {\n\t\t\tconst { w: squishedWidth, h: squishedHeight } = editor.textMeasure.measureHtml(html, {\n\t\t\t\t...TEXT_PROPS,\n\t\t\t\tfontFamily: FONT_FAMILIES[shape.props.font],\n\t\t\t\tfontSize,\n\t\t\t\tmaxWidth: width,\n\t\t\t})\n\n\t\t\twidth = squishedWidth\n\t\t\theight = squishedHeight\n\t\t}\n\n\t\treturn new Vec(width, height).addScalar(ARROW_LABEL_PADDING * 2 * shape.props.scale)\n\t},\n\t{\n\t\tareRecordsEqual: (a, b) => {\n\t\t\tif (a.props === b.props) return true\n\n\t\t\t// If the only thing that has changed is the label position, we can skip recalculating the size\n\t\t\tconst changedKeys = getChangedKeys(a.props, b.props)\n\t\t\treturn changedKeys.length === 1 && changedKeys[0] === 'labelPosition'\n\t\t},\n\t}\n)\n\nfunction getArrowLabelSize(editor: Editor, shape: TLArrowShape) {\n\treturn labelSizeCache.get(editor, shape.id) ?? new Vec(0, 0)\n}\n\nfunction getLabelToArrowPadding(shape: TLArrowShape) {\n\tconst strokeWidth = STROKE_SIZES[shape.props.size]\n\tconst labelToArrowPadding =\n\t\t(LABEL_TO_ARROW_PADDING +\n\t\t\t(strokeWidth - STROKE_SIZES.s) * 2 +\n\t\t\t(strokeWidth === STROKE_SIZES.xl ? 20 : 0)) *\n\t\tshape.props.scale\n\n\treturn labelToArrowPadding\n}\n\n/**\n * Return the range of possible label positions for an arrow. The full possible range is 0 to 1, but\n * as the label itself takes up space the usable range is smaller.\n */\nfunction getArrowLabelRange(editor: Editor, shape: TLArrowShape, info: TLArrowInfo) {\n\tconst bodyGeom = getArrowBodyGeometry(editor, shape)\n\tconst dbgPoints: VecLike[] = []\n\tconst dbg: Geometry2d[] = [new Group2d({ children: [bodyGeom], debugColor: 'lime' })]\n\n\tconst labelSize = getArrowLabelSize(editor, shape)\n\tconst labelToArrowPadding = getLabelToArrowPadding(shape)\n\tconst paddingRelative = labelToArrowPadding / bodyGeom.length\n\n\t// we can calculate the range by sticking the center of the label at the very start/end of the\n\t// arrow, and seeing where the label intersects with the arrow. Then, if we move the label's\n\t// center to that point, that'll be the start/end of the range.\n\n\tlet startBox, endBox\n\tif (info.type === 'elbow') {\n\t\t// for elbow arrows, because they have multiple segments but are always axis-aligned, we can use\n\t\t// an expanded box. This helps keep the box from partially covering the first segment when it's\n\t\t// very small.\n\t\tdbgPoints.push(info.start.point, info.end.point)\n\t\tstartBox = Box.FromCenter(info.start.point, labelSize).expandBy(labelToArrowPadding)\n\t\tendBox = Box.FromCenter(info.end.point, labelSize).expandBy(labelToArrowPadding)\n\t} else {\n\t\t// for other arrows, we move along the arrow by the padding amount to find the start/end points\n\t\tconst startPoint = bodyGeom.interpolateAlongEdge(paddingRelative)\n\t\tconst endPoint = bodyGeom.interpolateAlongEdge(1 - paddingRelative)\n\t\tdbgPoints.push(startPoint, endPoint)\n\t\tstartBox = Box.FromCenter(startPoint, labelSize)\n\t\tendBox = Box.FromCenter(endPoint, labelSize)\n\t}\n\tconst startIntersections = bodyGeom.intersectPolygon(startBox.corners)\n\tconst endIntersections = bodyGeom.intersectPolygon(endBox.corners)\n\n\tconst startConstrained = furthest(info.start.point, startIntersections)\n\tconst endConstrained = furthest(info.end.point, endIntersections)\n\n\tlet startRelative = startConstrained ? bodyGeom.uninterpolateAlongEdge(startConstrained) : 0.5\n\tlet endRelative = endConstrained ? bodyGeom.uninterpolateAlongEdge(endConstrained) : 0.5\n\n\tif (startRelative > endRelative) {\n\t\tstartRelative = 0.5\n\t\tendRelative = 0.5\n\t}\n\n\tfor (const pt of [...startIntersections, ...endIntersections, ...dbgPoints]) {\n\t\tdbg.push(\n\t\t\tnew Circle2d({\n\t\t\t\tx: pt.x - 3,\n\t\t\t\ty: pt.y - 3,\n\t\t\t\tradius: 3,\n\t\t\t\tisFilled: false,\n\t\t\t\tdebugColor: 'magenta',\n\t\t\t\tignore: true,\n\t\t\t})\n\t\t)\n\t}\n\tdbg.push(\n\t\tnew Polygon2d({\n\t\t\tpoints: startBox.corners,\n\t\t\tdebugColor: 'lime',\n\t\t\tisFilled: false,\n\t\t\tignore: true,\n\t\t}),\n\t\tnew Polygon2d({\n\t\t\tpoints: endBox.corners,\n\t\t\tdebugColor: 'lime',\n\t\t\tisFilled: false,\n\t\t\tignore: true,\n\t\t})\n\t)\n\n\treturn { start: startRelative, end: endRelative, dbg }\n}\n\ninterface ArrowheadInfo {\n\thasStartBinding: boolean\n\thasEndBinding: boolean\n\thasStartArrowhead: boolean\n\thasEndArrowhead: boolean\n}\nexport function getArrowLabelPosition(editor: Editor, shape: TLArrowShape) {\n\tconst isEditing = editor.getEditingShapeId() === shape.id\n\tif (!isEditing && isEmptyRichText(shape.props.richText)) {\n\t\t// Short-circuit for empty labels.\n\t\tconst bodyGeom = getArrowBodyGeometry(editor, shape)\n\t\tconst labelCenter = bodyGeom.interpolateAlongEdge(0.5)\n\t\treturn { box: Box.FromCenter(labelCenter, new Vec(0, 0)), debugGeom: [] }\n\t}\n\n\tconst debugGeom: Geometry2d[] = []\n\tconst info = getArrowInfo(editor, shape)!\n\n\tconst arrowheadInfo: ArrowheadInfo = {\n\t\thasStartBinding: !!info.bindings.start,\n\t\thasEndBinding: !!info.bindings.end,\n\t\thasStartArrowhead: info.start.arrowhead !== 'none',\n\t\thasEndArrowhead: info.end.arrowhead !== 'none',\n\t}\n\n\tconst range = getArrowLabelRange(editor, shape, info)\n\tif (range.dbg) debugGeom.push(...range.dbg)\n\n\tconst clampedPosition = getClampedPosition(shape, range, arrowheadInfo)\n\tconst bodyGeom = getArrowBodyGeometry(editor, shape)\n\tconst labelCenter = bodyGeom.interpolateAlongEdge(clampedPosition)\n\tconst labelSize = getArrowLabelSize(editor, shape)\n\n\treturn { box: Box.FromCenter(labelCenter, labelSize), debugGeom }\n}\n\nfunction getClampedPosition(\n\tshape: TLArrowShape,\n\trange: { start: number; end: number },\n\tarrowheadInfo: ArrowheadInfo\n) {\n\tconst { hasEndArrowhead, hasEndBinding, hasStartBinding, hasStartArrowhead } = arrowheadInfo\n\tconst clampedPosition = clamp(\n\t\tshape.props.labelPosition,\n\t\thasStartArrowhead || hasStartBinding ? range.start : 0,\n\t\thasEndArrowhead || hasEndBinding ? range.end : 1\n\t)\n\n\treturn clampedPosition\n}\n\nfunction furthest(from: VecLike, candidates: VecLike[]): VecLike | null {\n\tlet furthest: VecLike | null = null\n\tlet furthestDist = -Infinity\n\n\tfor (const candidate of candidates) {\n\t\tconst dist = Vec.Dist2(from, candidate)\n\t\tif (dist > furthestDist) {\n\t\t\tfurthest = candidate\n\t\t\tfurthestDist = dist\n\t\t}\n\t}\n\n\treturn furthest\n}\n\nexport function getArrowLabelFontSize(shape: TLArrowShape) {\n\treturn ARROW_LABEL_FONT_SIZES[shape.props.size] * shape.props.scale\n}\n\nexport function getArrowLabelDefaultPosition(editor: Editor, shape: TLArrowShape) {\n\tconst info = getArrowInfo(editor, shape)!\n\tswitch (info.type) {\n\t\tcase 'straight':\n\t\tcase 'arc':\n\t\t\treturn 0.5\n\t\tcase 'elbow': {\n\t\t\tconst midpointHandle = info.route.midpointHandle\n\t\t\tconst bodyGeom = getArrowBodyGeometry(editor, shape)\n\t\t\tif (midpointHandle && bodyGeom) {\n\t\t\t\treturn bodyGeom.uninterpolateAlongEdge(midpointHandle.point)\n\t\t\t}\n\t\t\treturn 0.5\n\t\t}\n\t\tdefault:\n\t\t\texhaustiveSwitchError(info, 'type')\n\t}\n}\n\n/** @internal */\nexport function isOverArrowLabel(editor: Editor, shape: TLShape) {\n\tif (!editor.isShapeOfType<TLArrowShape>(shape, 'arrow')) return false\n\n\tconst pointInShapeSpace = editor.getPointInShapeSpace(shape, editor.inputs.currentPagePoint)\n\t// How should we handle multiple labels? Do shapes ever have multiple labels?\n\tconst labelGeometry = editor.getShapeGeometry<Group2d>(shape).children[1]\n\t// Knowing what we know about arrows... if the shape has no text in its label,\n\t// then the label geometry should not be there.\n\treturn labelGeometry && pointInPolygon(pointInShapeSpace, labelGeometry.vertices)\n}\n"],
+  "mappings": "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",
+  "names": ["bodyGeom", "labelCenter", "furthest"]
 }

package/dist-esm/lib/shapes/arrow/arrowTargetState.mjs

@@ -44,7 +44,7 @@ function updateArrowTargetState({
   const target = editor.getShapeAtPoint(pointInPageSpace, {
     hitInside: true,
     hitFrameInside: true,
-    margin: arrowKind === "elbow" ? 8 : 0,
+    margin: arrowKind === "elbow" ? 8 : [8, 0],
     filter: (targetShape) => {
       return !targetShape.isLocked && editor.canBindShapes({
         fromShape: arrow ?? targetFilterFallback,

package/dist-esm/lib/shapes/arrow/arrowTargetState.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/lib/shapes/arrow/arrowTargetState.ts"],
-  "sourcesContent": ["import {\n\tArrowShapeKindStyle,\n\tatom,\n\tAtom,\n\tBox,\n\tclamp,\n\tEditor,\n\tElbowArrowSnap,\n\tGeometry2dFilters,\n\tinvLerp,\n\tmapObjectMapValues,\n\tobjectMapEntries,\n\tobjectMapKeys,\n\tTLArrowBinding,\n\tTLArrowShape,\n\tTLArrowShapeKind,\n\tTLShape,\n\tVec,\n\tVecLike,\n\tWeakCache,\n} from '@tldraw/editor'\nimport { ArrowShapeUtil } from './ArrowShapeUtil'\nimport {\n\tElbowArrowAxes,\n\tElbowArrowSide,\n\tElbowArrowSideAxes,\n\tElbowArrowSideDeltas,\n} from './elbow/definitions'\n\nexport interface UpdateArrowTargetStateOpts {\n\teditor: Editor\n\tpointInPageSpace: VecLike\n\tarrow: TLArrowShape | undefined\n\tisPrecise: boolean\n\tcurrentBinding: TLArrowBinding | undefined\n\t/** The binding from the opposite end of the arrow, if one exists. */\n\toppositeBinding: TLArrowBinding | undefined\n}\n\nexport interface ArrowTargetState {\n\ttarget: TLShape\n\tarrowKind: TLArrowShapeKind\n\n\thandlesInPageSpace: {\n\t\ttop: { point: VecLike; isEnabled: boolean }\n\t\tbottom: { point: VecLike; isEnabled: boolean }\n\t\tleft: { point: VecLike; isEnabled: boolean }\n\t\tright: { point: VecLike; isEnabled: boolean }\n\t}\n\n\tisExact: boolean\n\tisPrecise: boolean\n\n\tcenterInPageSpace: VecLike\n\tanchorInPageSpace: VecLike\n\tsnap: ElbowArrowSnap\n\tnormalizedAnchor: VecLike\n}\n\nconst arrowTargetStore = new WeakCache<Editor, Atom<ArrowTargetState | null>>()\n\nfunction getArrowTargetAtom(editor: Editor) {\n\treturn arrowTargetStore.get(editor, () => atom('arrowTarget', null))\n}\n\nexport function getArrowTargetState(editor: Editor) {\n\treturn getArrowTargetAtom(editor).get()\n}\n\nexport function clearArrowTargetState(editor: Editor) {\n\tgetArrowTargetAtom(editor).set(null)\n}\n\nexport function updateArrowTargetState({\n\teditor,\n\tpointInPageSpace,\n\tarrow,\n\tisPrecise,\n\tcurrentBinding,\n\toppositeBinding,\n}: UpdateArrowTargetStateOpts): ArrowTargetState | null {\n\tconst util = editor.getShapeUtil<ArrowShapeUtil>('arrow')\n\n\t// no target picking when ctrl is held:\n\tif (util.options.shouldIgnoreTargets(editor)) {\n\t\tgetArrowTargetAtom(editor).set(null)\n\t\treturn null\n\t}\n\n\tconst isExact = util.options.shouldBeExact(editor)\n\n\tconst arrowKind = arrow ? arrow.props.kind : editor.getStyleForNextShape(ArrowShapeKindStyle)\n\n\tconst target = editor.getShapeAtPoint(pointInPageSpace, {\n\t\thitInside: true,\n\t\thitFrameInside: true,\n\t\tmargin: arrowKind === 'elbow' ? 8 : 0,\n\t\tfilter: (targetShape) => {\n\t\t\treturn (\n\t\t\t\t!targetShape.isLocked &&\n\t\t\t\teditor.canBindShapes({\n\t\t\t\t\tfromShape: arrow ?? targetFilterFallback,\n\t\t\t\t\ttoShape: targetShape,\n\t\t\t\t\tbinding: 'arrow',\n\t\t\t\t})\n\t\t\t)\n\t\t},\n\t})\n\n\tif (!target) {\n\t\tgetArrowTargetAtom(editor).set(null)\n\t\treturn null\n\t}\n\n\tconst targetGeometryInTargetSpace = editor.getShapeGeometry(target)\n\tconst targetBoundsInTargetSpace = Box.ZeroFix(targetGeometryInTargetSpace.bounds)\n\tconst targetCenterInTargetSpace = targetGeometryInTargetSpace.center\n\tconst targetTransform = editor.getShapePageTransform(target)\n\tconst pointInTargetSpace = editor.getPointInShapeSpace(target, pointInPageSpace)\n\n\tconst castDistance = Math.max(\n\t\ttargetGeometryInTargetSpace.bounds.width,\n\t\ttargetGeometryInTargetSpace.bounds.height\n\t)\n\n\tconst handlesInPageSpace = mapObjectMapValues(ElbowArrowSideDeltas, (side, delta) => {\n\t\tconst axis = ElbowArrowAxes[ElbowArrowSideAxes[side]]\n\n\t\tconst farPoint = Vec.Mul(delta, castDistance).add(targetCenterInTargetSpace)\n\n\t\tlet isEnabled = false\n\t\tlet handlePointInTargetSpace: VecLike = axis.v(\n\t\t\ttargetBoundsInTargetSpace[side],\n\t\t\ttargetBoundsInTargetSpace[axis.crossMid]\n\t\t)\n\t\tlet furthestDistance = 0\n\n\t\tconst intersections = targetGeometryInTargetSpace.intersectLineSegment(\n\t\t\ttargetCenterInTargetSpace,\n\t\t\tfarPoint,\n\t\t\tGeometry2dFilters.EXCLUDE_NON_STANDARD\n\t\t)\n\t\tfor (const intersection of intersections) {\n\t\t\tconst distance = Vec.Dist2(intersection, targetCenterInTargetSpace)\n\t\t\tif (distance > furthestDistance) {\n\t\t\t\tfurthestDistance = distance\n\t\t\t\thandlePointInTargetSpace = intersection\n\t\t\t\tisEnabled = targetGeometryInTargetSpace.isClosed\n\t\t\t}\n\t\t}\n\n\t\tconst handlePointInPageSpace = targetTransform.applyToPoint(handlePointInTargetSpace)\n\n\t\treturn { point: handlePointInPageSpace, isEnabled, far: targetTransform.applyToPoint(farPoint) }\n\t})\n\n\tconst zoomLevel = editor.getZoomLevel()\n\tconst minDistScaled = util.options.minElbowHandleDistance / zoomLevel\n\n\tconst targetCenterInPageSpace = targetTransform.applyToPoint(targetCenterInTargetSpace)\n\tfor (const side of objectMapKeys(handlesInPageSpace)) {\n\t\tconst handle = handlesInPageSpace[side]\n\t\tif (Vec.DistMin(handle.point, targetCenterInPageSpace, minDistScaled)) {\n\t\t\thandle.isEnabled = false\n\t\t}\n\t}\n\n\tlet precise = isPrecise || isExact\n\n\tif (!precise) {\n\t\t// If we're switching to a new bound shape, then precise only if moving slowly\n\t\tif (!currentBinding || (currentBinding && target.id !== currentBinding.toId)) {\n\t\t\tprecise = editor.inputs.pointerVelocity.len() < 0.5\n\t\t}\n\t}\n\n\tif (!isPrecise) {\n\t\tif (!targetGeometryInTargetSpace.isClosed) {\n\t\t\tprecise = true\n\t\t}\n\n\t\t// Double check that we're not going to be doing an imprecise snap on\n\t\t// the same shape twice, as this would result in a zero length line\n\t\tif (oppositeBinding && target.id === oppositeBinding.toId && oppositeBinding.props.isPrecise) {\n\t\t\tprecise = true\n\t\t}\n\t}\n\n\tconst shouldSnapCenter = !isExact && precise && targetGeometryInTargetSpace.isClosed\n\tconst shouldSnapEdges =\n\t\t!isExact && ((precise && arrowKind === 'elbow') || !targetGeometryInTargetSpace.isClosed)\n\tconst shouldSnapEdgePoints =\n\t\t!isExact && precise && arrowKind === 'elbow' && targetGeometryInTargetSpace.isClosed\n\tconst shouldSnapNone = precise && (targetGeometryInTargetSpace.isClosed || isExact)\n\tconst shouldSnapCenterAxis =\n\t\t!isExact && precise && arrowKind === 'elbow' && targetGeometryInTargetSpace.isClosed\n\n\t// we run through all the snapping options from least to most specific:\n\tlet snap: ElbowArrowSnap = 'none'\n\tlet anchorInPageSpace: VecLike = pointInPageSpace\n\n\tif (!shouldSnapNone) {\n\t\tsnap = 'center'\n\t\tanchorInPageSpace = targetCenterInPageSpace\n\t}\n\n\tif (shouldSnapEdges) {\n\t\tconst snapDistance = shouldSnapNone\n\t\t\t? calculateSnapDistance(\n\t\t\t\t\teditor,\n\t\t\t\t\ttargetBoundsInTargetSpace,\n\t\t\t\t\tutil.options.elbowArrowEdgeSnapDistance\n\t\t\t\t)\n\t\t\t: Infinity\n\n\t\tconst nearestPointOnEdgeInTargetSpace = targetGeometryInTargetSpace.nearestPoint(\n\t\t\tpointInTargetSpace,\n\t\t\t{\n\t\t\t\tincludeLabels: false,\n\t\t\t\tincludeInternal: false,\n\t\t\t}\n\t\t)\n\n\t\tconst nearestPointOnEdgeInPageSpace = targetTransform.applyToPoint(\n\t\t\tnearestPointOnEdgeInTargetSpace\n\t\t)\n\n\t\tconst distance = Vec.Dist(nearestPointOnEdgeInPageSpace, pointInPageSpace)\n\n\t\tif (distance < snapDistance) {\n\t\t\tsnap = 'edge'\n\t\t\tanchorInPageSpace = nearestPointOnEdgeInPageSpace\n\t\t}\n\t}\n\n\tif (shouldSnapCenterAxis) {\n\t\tconst snapDistance = calculateSnapDistance(\n\t\t\teditor,\n\t\t\ttargetBoundsInTargetSpace,\n\t\t\tutil.options.elbowArrowAxisSnapDistance\n\t\t)\n\n\t\tconst distanceFromXAxis = Vec.DistanceToLineSegment(\n\t\t\thandlesInPageSpace.left.far,\n\t\t\thandlesInPageSpace.right.far,\n\t\t\tpointInPageSpace\n\t\t)\n\t\tconst distanceFromYAxis = Vec.DistanceToLineSegment(\n\t\t\thandlesInPageSpace.top.far,\n\t\t\thandlesInPageSpace.bottom.far,\n\t\t\tpointInPageSpace\n\t\t)\n\n\t\tconst snapAxis =\n\t\t\tdistanceFromXAxis < distanceFromYAxis && distanceFromXAxis < snapDistance\n\t\t\t\t? 'x'\n\t\t\t\t: distanceFromYAxis < snapDistance\n\t\t\t\t\t? 'y'\n\t\t\t\t\t: null\n\n\t\tif (snapAxis) {\n\t\t\tconst axis = ElbowArrowAxes[snapAxis]\n\n\t\t\tconst loDist2 = Vec.Dist2(handlesInPageSpace[axis.loEdge].far, pointInPageSpace)\n\t\t\tconst hiDist2 = Vec.Dist2(handlesInPageSpace[axis.hiEdge].far, pointInPageSpace)\n\n\t\t\tconst side = loDist2 < hiDist2 ? axis.loEdge : axis.hiEdge\n\n\t\t\tif (handlesInPageSpace[side].isEnabled) {\n\t\t\t\tsnap = 'edge-point'\n\t\t\t\tanchorInPageSpace = handlesInPageSpace[side].point\n\t\t\t}\n\t\t}\n\t}\n\n\tif (shouldSnapEdgePoints) {\n\t\tconst snapDistance = calculateSnapDistance(\n\t\t\teditor,\n\t\t\ttargetBoundsInTargetSpace,\n\t\t\tutil.options.elbowArrowPointSnapDistance\n\t\t)\n\n\t\tlet closestSide: ElbowArrowSide | null = null\n\t\tlet closestDistance = Infinity\n\n\t\tfor (const [side, handle] of objectMapEntries(handlesInPageSpace)) {\n\t\t\tif (!handle.isEnabled) continue\n\t\t\tconst distance = Vec.Dist(handle.point, pointInPageSpace)\n\t\t\tif (distance < snapDistance && distance < closestDistance) {\n\t\t\t\tclosestDistance = distance\n\t\t\t\tclosestSide = side\n\t\t\t}\n\t\t}\n\n\t\tif (closestSide) {\n\t\t\tsnap = 'edge-point'\n\t\t\tanchorInPageSpace = handlesInPageSpace[closestSide].point\n\t\t}\n\t}\n\n\tif (shouldSnapCenter) {\n\t\tconst snapDistance = calculateSnapDistance(\n\t\t\teditor,\n\t\t\ttargetBoundsInTargetSpace,\n\t\t\tarrowKind === 'elbow'\n\t\t\t\t? util.options.elbowArrowCenterSnapDistance\n\t\t\t\t: util.options.arcArrowCenterSnapDistance\n\t\t)\n\n\t\tif (Vec.Dist(pointInTargetSpace, targetBoundsInTargetSpace.center) < snapDistance) {\n\t\t\tsnap = 'center'\n\t\t\tanchorInPageSpace = targetCenterInPageSpace\n\t\t}\n\t}\n\n\tconst snapPointInTargetSpace = editor.getPointInShapeSpace(target, anchorInPageSpace)\n\n\tconst normalizedAnchor = {\n\t\tx: invLerp(\n\t\t\ttargetBoundsInTargetSpace.minX,\n\t\t\ttargetBoundsInTargetSpace.maxX,\n\t\t\tsnapPointInTargetSpace.x\n\t\t),\n\t\ty: invLerp(\n\t\t\ttargetBoundsInTargetSpace.minY,\n\t\t\ttargetBoundsInTargetSpace.maxY,\n\t\t\tsnapPointInTargetSpace.y\n\t\t),\n\t}\n\n\tconst result: ArrowTargetState = {\n\t\ttarget,\n\t\tarrowKind,\n\t\thandlesInPageSpace,\n\t\tcenterInPageSpace: targetCenterInPageSpace,\n\t\tanchorInPageSpace,\n\t\tisExact,\n\t\tisPrecise: precise,\n\t\tsnap,\n\t\tnormalizedAnchor,\n\t}\n\n\tgetArrowTargetAtom(editor).set(result)\n\n\treturn result\n}\n\nconst targetFilterFallback = { type: 'arrow' }\n\n/**\n * Funky math but we want the snap distance to be 4 at the minimum and either 16 or 15% of the\n * smaller dimension of the target shape, whichever is smaller\n */\nfunction calculateSnapDistance(\n\teditor: Editor,\n\ttargetBoundsInTargetSpace: Box,\n\tidealSnapDistance: number\n) {\n\treturn (\n\t\tclamp(\n\t\t\tMath.min(targetBoundsInTargetSpace.width, targetBoundsInTargetSpace.height) * 0.15,\n\t\t\t4,\n\t\t\tidealSnapDistance\n\t\t) / editor.getZoomLevel()\n\t)\n}\n"],
-  "mappings": "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",
+  "sourcesContent": ["import {\n\tArrowShapeKindStyle,\n\tatom,\n\tAtom,\n\tBox,\n\tclamp,\n\tEditor,\n\tElbowArrowSnap,\n\tGeometry2dFilters,\n\tinvLerp,\n\tmapObjectMapValues,\n\tobjectMapEntries,\n\tobjectMapKeys,\n\tTLArrowBinding,\n\tTLArrowShape,\n\tTLArrowShapeKind,\n\tTLShape,\n\tVec,\n\tVecLike,\n\tWeakCache,\n} from '@tldraw/editor'\nimport { ArrowShapeUtil } from './ArrowShapeUtil'\nimport {\n\tElbowArrowAxes,\n\tElbowArrowSide,\n\tElbowArrowSideAxes,\n\tElbowArrowSideDeltas,\n} from './elbow/definitions'\n\nexport interface UpdateArrowTargetStateOpts {\n\teditor: Editor\n\tpointInPageSpace: VecLike\n\tarrow: TLArrowShape | undefined\n\tisPrecise: boolean\n\tcurrentBinding: TLArrowBinding | undefined\n\t/** The binding from the opposite end of the arrow, if one exists. */\n\toppositeBinding: TLArrowBinding | undefined\n}\n\nexport interface ArrowTargetState {\n\ttarget: TLShape\n\tarrowKind: TLArrowShapeKind\n\n\thandlesInPageSpace: {\n\t\ttop: { point: VecLike; isEnabled: boolean }\n\t\tbottom: { point: VecLike; isEnabled: boolean }\n\t\tleft: { point: VecLike; isEnabled: boolean }\n\t\tright: { point: VecLike; isEnabled: boolean }\n\t}\n\n\tisExact: boolean\n\tisPrecise: boolean\n\n\tcenterInPageSpace: VecLike\n\tanchorInPageSpace: VecLike\n\tsnap: ElbowArrowSnap\n\tnormalizedAnchor: VecLike\n}\n\nconst arrowTargetStore = new WeakCache<Editor, Atom<ArrowTargetState | null>>()\n\nfunction getArrowTargetAtom(editor: Editor) {\n\treturn arrowTargetStore.get(editor, () => atom('arrowTarget', null))\n}\n\nexport function getArrowTargetState(editor: Editor) {\n\treturn getArrowTargetAtom(editor).get()\n}\n\nexport function clearArrowTargetState(editor: Editor) {\n\tgetArrowTargetAtom(editor).set(null)\n}\n\nexport function updateArrowTargetState({\n\teditor,\n\tpointInPageSpace,\n\tarrow,\n\tisPrecise,\n\tcurrentBinding,\n\toppositeBinding,\n}: UpdateArrowTargetStateOpts): ArrowTargetState | null {\n\tconst util = editor.getShapeUtil<ArrowShapeUtil>('arrow')\n\n\t// no target picking when ctrl is held:\n\tif (util.options.shouldIgnoreTargets(editor)) {\n\t\tgetArrowTargetAtom(editor).set(null)\n\t\treturn null\n\t}\n\n\tconst isExact = util.options.shouldBeExact(editor)\n\n\tconst arrowKind = arrow ? arrow.props.kind : editor.getStyleForNextShape(ArrowShapeKindStyle)\n\n\tconst target = editor.getShapeAtPoint(pointInPageSpace, {\n\t\thitInside: true,\n\t\thitFrameInside: true,\n\t\tmargin: arrowKind === 'elbow' ? 8 : [8, 0],\n\t\tfilter: (targetShape) => {\n\t\t\treturn (\n\t\t\t\t!targetShape.isLocked &&\n\t\t\t\teditor.canBindShapes({\n\t\t\t\t\tfromShape: arrow ?? targetFilterFallback,\n\t\t\t\t\ttoShape: targetShape,\n\t\t\t\t\tbinding: 'arrow',\n\t\t\t\t})\n\t\t\t)\n\t\t},\n\t})\n\n\tif (!target) {\n\t\tgetArrowTargetAtom(editor).set(null)\n\t\treturn null\n\t}\n\n\tconst targetGeometryInTargetSpace = editor.getShapeGeometry(target)\n\tconst targetBoundsInTargetSpace = Box.ZeroFix(targetGeometryInTargetSpace.bounds)\n\tconst targetCenterInTargetSpace = targetGeometryInTargetSpace.center\n\tconst targetTransform = editor.getShapePageTransform(target)\n\tconst pointInTargetSpace = editor.getPointInShapeSpace(target, pointInPageSpace)\n\n\tconst castDistance = Math.max(\n\t\ttargetGeometryInTargetSpace.bounds.width,\n\t\ttargetGeometryInTargetSpace.bounds.height\n\t)\n\n\tconst handlesInPageSpace = mapObjectMapValues(ElbowArrowSideDeltas, (side, delta) => {\n\t\tconst axis = ElbowArrowAxes[ElbowArrowSideAxes[side]]\n\n\t\tconst farPoint = Vec.Mul(delta, castDistance).add(targetCenterInTargetSpace)\n\n\t\tlet isEnabled = false\n\t\tlet handlePointInTargetSpace: VecLike = axis.v(\n\t\t\ttargetBoundsInTargetSpace[side],\n\t\t\ttargetBoundsInTargetSpace[axis.crossMid]\n\t\t)\n\t\tlet furthestDistance = 0\n\n\t\tconst intersections = targetGeometryInTargetSpace.intersectLineSegment(\n\t\t\ttargetCenterInTargetSpace,\n\t\t\tfarPoint,\n\t\t\tGeometry2dFilters.EXCLUDE_NON_STANDARD\n\t\t)\n\t\tfor (const intersection of intersections) {\n\t\t\tconst distance = Vec.Dist2(intersection, targetCenterInTargetSpace)\n\t\t\tif (distance > furthestDistance) {\n\t\t\t\tfurthestDistance = distance\n\t\t\t\thandlePointInTargetSpace = intersection\n\t\t\t\tisEnabled = targetGeometryInTargetSpace.isClosed\n\t\t\t}\n\t\t}\n\n\t\tconst handlePointInPageSpace = targetTransform.applyToPoint(handlePointInTargetSpace)\n\n\t\treturn { point: handlePointInPageSpace, isEnabled, far: targetTransform.applyToPoint(farPoint) }\n\t})\n\n\tconst zoomLevel = editor.getZoomLevel()\n\tconst minDistScaled = util.options.minElbowHandleDistance / zoomLevel\n\n\tconst targetCenterInPageSpace = targetTransform.applyToPoint(targetCenterInTargetSpace)\n\tfor (const side of objectMapKeys(handlesInPageSpace)) {\n\t\tconst handle = handlesInPageSpace[side]\n\t\tif (Vec.DistMin(handle.point, targetCenterInPageSpace, minDistScaled)) {\n\t\t\thandle.isEnabled = false\n\t\t}\n\t}\n\n\tlet precise = isPrecise || isExact\n\n\tif (!precise) {\n\t\t// If we're switching to a new bound shape, then precise only if moving slowly\n\t\tif (!currentBinding || (currentBinding && target.id !== currentBinding.toId)) {\n\t\t\tprecise = editor.inputs.pointerVelocity.len() < 0.5\n\t\t}\n\t}\n\n\tif (!isPrecise) {\n\t\tif (!targetGeometryInTargetSpace.isClosed) {\n\t\t\tprecise = true\n\t\t}\n\n\t\t// Double check that we're not going to be doing an imprecise snap on\n\t\t// the same shape twice, as this would result in a zero length line\n\t\tif (oppositeBinding && target.id === oppositeBinding.toId && oppositeBinding.props.isPrecise) {\n\t\t\tprecise = true\n\t\t}\n\t}\n\n\tconst shouldSnapCenter = !isExact && precise && targetGeometryInTargetSpace.isClosed\n\t// const shouldSnapEdges = !isExact && (precise || !targetGeometryInTargetSpace.isClosed)\n\tconst shouldSnapEdges =\n\t\t!isExact && ((precise && arrowKind === 'elbow') || !targetGeometryInTargetSpace.isClosed)\n\tconst shouldSnapEdgePoints =\n\t\t!isExact && precise && arrowKind === 'elbow' && targetGeometryInTargetSpace.isClosed\n\tconst shouldSnapNone = precise && (targetGeometryInTargetSpace.isClosed || isExact)\n\tconst shouldSnapCenterAxis =\n\t\t!isExact && precise && arrowKind === 'elbow' && targetGeometryInTargetSpace.isClosed\n\n\t// we run through all the snapping options from least to most specific:\n\tlet snap: ElbowArrowSnap = 'none'\n\tlet anchorInPageSpace: VecLike = pointInPageSpace\n\n\tif (!shouldSnapNone) {\n\t\tsnap = 'center'\n\t\tanchorInPageSpace = targetCenterInPageSpace\n\t}\n\n\tif (shouldSnapEdges) {\n\t\tconst snapDistance = shouldSnapNone\n\t\t\t? calculateSnapDistance(\n\t\t\t\t\teditor,\n\t\t\t\t\ttargetBoundsInTargetSpace,\n\t\t\t\t\tutil.options.elbowArrowEdgeSnapDistance\n\t\t\t\t)\n\t\t\t: Infinity\n\n\t\tconst nearestPointOnEdgeInTargetSpace = targetGeometryInTargetSpace.nearestPoint(\n\t\t\tpointInTargetSpace,\n\t\t\t{\n\t\t\t\tincludeLabels: false,\n\t\t\t\tincludeInternal: false,\n\t\t\t}\n\t\t)\n\n\t\tconst nearestPointOnEdgeInPageSpace = targetTransform.applyToPoint(\n\t\t\tnearestPointOnEdgeInTargetSpace\n\t\t)\n\n\t\tconst distance = Vec.Dist(nearestPointOnEdgeInPageSpace, pointInPageSpace)\n\n\t\tif (distance < snapDistance) {\n\t\t\tsnap = 'edge'\n\t\t\tanchorInPageSpace = nearestPointOnEdgeInPageSpace\n\t\t}\n\t}\n\n\tif (shouldSnapCenterAxis) {\n\t\tconst snapDistance = calculateSnapDistance(\n\t\t\teditor,\n\t\t\ttargetBoundsInTargetSpace,\n\t\t\tutil.options.elbowArrowAxisSnapDistance\n\t\t)\n\n\t\tconst distanceFromXAxis = Vec.DistanceToLineSegment(\n\t\t\thandlesInPageSpace.left.far,\n\t\t\thandlesInPageSpace.right.far,\n\t\t\tpointInPageSpace\n\t\t)\n\t\tconst distanceFromYAxis = Vec.DistanceToLineSegment(\n\t\t\thandlesInPageSpace.top.far,\n\t\t\thandlesInPageSpace.bottom.far,\n\t\t\tpointInPageSpace\n\t\t)\n\n\t\tconst snapAxis =\n\t\t\tdistanceFromXAxis < distanceFromYAxis && distanceFromXAxis < snapDistance\n\t\t\t\t? 'x'\n\t\t\t\t: distanceFromYAxis < snapDistance\n\t\t\t\t\t? 'y'\n\t\t\t\t\t: null\n\n\t\tif (snapAxis) {\n\t\t\tconst axis = ElbowArrowAxes[snapAxis]\n\n\t\t\tconst loDist2 = Vec.Dist2(handlesInPageSpace[axis.loEdge].far, pointInPageSpace)\n\t\t\tconst hiDist2 = Vec.Dist2(handlesInPageSpace[axis.hiEdge].far, pointInPageSpace)\n\n\t\t\tconst side = loDist2 < hiDist2 ? axis.loEdge : axis.hiEdge\n\n\t\t\tif (handlesInPageSpace[side].isEnabled) {\n\t\t\t\tsnap = 'edge-point'\n\t\t\t\tanchorInPageSpace = handlesInPageSpace[side].point\n\t\t\t}\n\t\t}\n\t}\n\n\tif (shouldSnapEdgePoints) {\n\t\tconst snapDistance = calculateSnapDistance(\n\t\t\teditor,\n\t\t\ttargetBoundsInTargetSpace,\n\t\t\tutil.options.elbowArrowPointSnapDistance\n\t\t)\n\n\t\tlet closestSide: ElbowArrowSide | null = null\n\t\tlet closestDistance = Infinity\n\n\t\tfor (const [side, handle] of objectMapEntries(handlesInPageSpace)) {\n\t\t\tif (!handle.isEnabled) continue\n\t\t\tconst distance = Vec.Dist(handle.point, pointInPageSpace)\n\t\t\tif (distance < snapDistance && distance < closestDistance) {\n\t\t\t\tclosestDistance = distance\n\t\t\t\tclosestSide = side\n\t\t\t}\n\t\t}\n\n\t\tif (closestSide) {\n\t\t\tsnap = 'edge-point'\n\t\t\tanchorInPageSpace = handlesInPageSpace[closestSide].point\n\t\t}\n\t}\n\n\tif (shouldSnapCenter) {\n\t\tconst snapDistance = calculateSnapDistance(\n\t\t\teditor,\n\t\t\ttargetBoundsInTargetSpace,\n\t\t\tarrowKind === 'elbow'\n\t\t\t\t? util.options.elbowArrowCenterSnapDistance\n\t\t\t\t: util.options.arcArrowCenterSnapDistance\n\t\t)\n\n\t\tif (Vec.Dist(pointInTargetSpace, targetBoundsInTargetSpace.center) < snapDistance) {\n\t\t\tsnap = 'center'\n\t\t\tanchorInPageSpace = targetCenterInPageSpace\n\t\t}\n\t}\n\n\tconst snapPointInTargetSpace = editor.getPointInShapeSpace(target, anchorInPageSpace)\n\n\tconst normalizedAnchor = {\n\t\tx: invLerp(\n\t\t\ttargetBoundsInTargetSpace.minX,\n\t\t\ttargetBoundsInTargetSpace.maxX,\n\t\t\tsnapPointInTargetSpace.x\n\t\t),\n\t\ty: invLerp(\n\t\t\ttargetBoundsInTargetSpace.minY,\n\t\t\ttargetBoundsInTargetSpace.maxY,\n\t\t\tsnapPointInTargetSpace.y\n\t\t),\n\t}\n\n\tconst result: ArrowTargetState = {\n\t\ttarget,\n\t\tarrowKind,\n\t\thandlesInPageSpace,\n\t\tcenterInPageSpace: targetCenterInPageSpace,\n\t\tanchorInPageSpace,\n\t\tisExact,\n\t\tisPrecise: precise,\n\t\tsnap,\n\t\tnormalizedAnchor,\n\t}\n\n\tgetArrowTargetAtom(editor).set(result)\n\n\treturn result\n}\n\nconst targetFilterFallback = { type: 'arrow' }\n\n/**\n * Funky math but we want the snap distance to be 4 at the minimum and either 16 or 15% of the\n * smaller dimension of the target shape, whichever is smaller\n */\nfunction calculateSnapDistance(\n\teditor: Editor,\n\ttargetBoundsInTargetSpace: Box,\n\tidealSnapDistance: number\n) {\n\treturn (\n\t\tclamp(\n\t\t\tMath.min(targetBoundsInTargetSpace.width, targetBoundsInTargetSpace.height) * 0.15,\n\t\t\t4,\n\t\t\tidealSnapDistance\n\t\t) / editor.getZoomLevel()\n\t)\n}\n"],
+  "mappings": "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",
   "names": []
 }

package/dist-esm/lib/shapes/arrow/elbow/ElbowArrowDebug.mjs

@@ -96,7 +96,7 @@ function ElbowArrowDebug({ arrow }) {
         y: fullBox.minY - 3,
         fontSize: 10,
         fill: "black",
-        stroke: "var(--color-background)",
+        stroke: "var(--tl-color-background)",
         strokeWidth: 2,
         paintOrder: "stroke",
         children: label
@@ -109,7 +109,7 @@ function ElbowArrowDebug({ arrow }) {
         y: info.A.expanded.y,
         fontSize: 10,
         fill: "black",
-        stroke: "var(--color-background)",
+        stroke: "var(--tl-color-background)",
         strokeWidth: 2,
         paintOrder: "stroke",
         children: [
@@ -126,7 +126,7 @@ function ElbowArrowDebug({ arrow }) {
         y: info.B.expanded.y,
         fontSize: 10,
         fill: "black",
-        stroke: "var(--color-background)",
+        stroke: "var(--tl-color-background)",
         strokeWidth: 2,
         paintOrder: "stroke",
         children: [

package/dist-esm/lib/shapes/arrow/elbow/ElbowArrowDebug.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../src/lib/shapes/arrow/elbow/ElbowArrowDebug.tsx"],
-  "sourcesContent": ["import { Box, TLArrowShape, useEditor, useValue, VecLike } from '@tldraw/editor'\nimport { SVGProps } from 'react'\nimport { getArrowBindings } from '../shared'\nimport { ElbowArrowEdge } from './definitions'\nimport { getElbowArrowInfo } from './getElbowArrowInfo'\n\nexport function ElbowArrowDebug({ arrow }: { arrow: TLArrowShape }) {\n\tconst editor = useEditor()\n\tconst info = useValue(\n\t\t'elbow arrow grid',\n\t\t() => {\n\t\t\ttry {\n\t\t\t\tconst info = getElbowArrowInfo(\n\t\t\t\t\teditor,\n\t\t\t\t\teditor.getShape(arrow.id)!,\n\t\t\t\t\tgetArrowBindings(editor, arrow)\n\t\t\t\t)\n\t\t\t\treturn info\n\t\t\t} catch (err) {\n\t\t\t\tconsole.error(err)\n\t\t\t\treturn undefined\n\t\t\t}\n\t\t},\n\t\t[editor, arrow.id]\n\t)\n\n\tif (!info) return null\n\n\tconst fullBox = Box.Common([info.A.original, info.B.original]).expandBy(50)\n\n\tconst label = info.route?.name ?? ''\n\n\tconst midPoint = info.route?.midpointHandle\n\n\treturn (\n\t\t<>\n\t\t\t{info.midX !== null && (\n\t\t\t\t<DebugLine\n\t\t\t\t\ta={{ x: info.midX, y: fullBox.minY }}\n\t\t\t\t\tb={{ x: info.midX, y: fullBox.maxY }}\n\t\t\t\t\tstroke=\"red\"\n\t\t\t\t/>\n\t\t\t)}\n\t\t\t{info.midY !== null && (\n\t\t\t\t<DebugLine\n\t\t\t\t\ta={{ x: fullBox.minX, y: info.midY }}\n\t\t\t\t\tb={{ x: fullBox.maxX, y: info.midY }}\n\t\t\t\t\tstroke=\"blue\"\n\t\t\t\t/>\n\t\t\t)}\n\n\t\t\t{midPoint?.axis === 'x' && info.midXRange && (\n\t\t\t\t<DebugLine\n\t\t\t\t\ta={{ x: info.midXRange.lo, y: midPoint.point.y }}\n\t\t\t\t\tb={{ x: info.midXRange.hi, y: midPoint.point.y }}\n\t\t\t\t\tstroke=\"red\"\n\t\t\t\t\tstrokeDasharray={'0 2'}\n\t\t\t\t/>\n\t\t\t)}\n\n\t\t\t{midPoint?.axis === 'y' && info.midYRange && (\n\t\t\t\t<DebugLine\n\t\t\t\t\ta={{ x: midPoint.point.x, y: info.midYRange.lo }}\n\t\t\t\t\tb={{ x: midPoint.point.x, y: info.midYRange.hi }}\n\t\t\t\t\tstroke=\"blue\"\n\t\t\t\t\tstrokeDasharray={'0 2'}\n\t\t\t\t/>\n\t\t\t)}\n\n\t\t\t<DebugBox box={info.A.original} stroke=\"orange\" />\n\t\t\t<DebugBox box={info.A.expanded} stroke=\"orange\" strokeWidth={0.5} />\n\t\t\t<DebugBox\n\t\t\t\tbox={info.A.original.clone().expandBy(info.options.minElbowLegLength)}\n\t\t\t\tstroke=\"orange\"\n\t\t\t\tstrokeWidth={0.5}\n\t\t\t/>\n\t\t\t<DebugBox box={info.B.original} stroke=\"lightskyblue\" />\n\t\t\t<DebugBox box={info.B.expanded} stroke=\"lightskyblue\" strokeWidth={0.5} />\n\t\t\t<DebugBox\n\t\t\t\tbox={info.B.original.clone().expandBy(info.options.minElbowLegLength)}\n\t\t\t\tstroke=\"lightskyblue\"\n\t\t\t\tstrokeWidth={0.5}\n\t\t\t/>\n\n\t\t\t<DebugEdge edge={info.A.edges.top} axis=\"x\" stroke=\"orange\" />\n\t\t\t<DebugEdge edge={info.B.edges.top} axis=\"x\" stroke=\"lightskyblue\" />\n\t\t\t<DebugEdge edge={info.A.edges.right} axis=\"y\" stroke=\"orange\" />\n\t\t\t<DebugEdge edge={info.B.edges.right} axis=\"y\" stroke=\"lightskyblue\" />\n\t\t\t<DebugEdge edge={info.A.edges.bottom} axis=\"x\" stroke=\"orange\" />\n\t\t\t<DebugEdge edge={info.B.edges.bottom} axis=\"x\" stroke=\"lightskyblue\" />\n\t\t\t<DebugEdge edge={info.A.edges.left} axis=\"y\" stroke=\"orange\" />\n\t\t\t<DebugEdge edge={info.B.edges.left} axis=\"y\" stroke=\"lightskyblue\" />\n\n\t\t\t{info.route && <DebugRoute route={info.route.points} strokeWidth={10} />}\n\n\t\t\t<text\n\t\t\t\tx={fullBox.minX + 5}\n\t\t\t\ty={fullBox.minY - 3}\n\t\t\t\tfontSize={10}\n\t\t\t\tfill=\"black\"\n\t\t\t\tstroke=\"var(--color-background)\"\n\t\t\t\tstrokeWidth={2}\n\t\t\t\tpaintOrder=\"stroke\"\n\t\t\t>\n\t\t\t\t{label}\n\t\t\t</text>\n\t\t\t<text\n\t\t\t\tx={info.A.expanded.x}\n\t\t\t\ty={info.A.expanded.y}\n\t\t\t\tfontSize={10}\n\t\t\t\tfill=\"black\"\n\t\t\t\tstroke=\"var(--color-background)\"\n\t\t\t\tstrokeWidth={2}\n\t\t\t\tpaintOrder=\"stroke\"\n\t\t\t>\n\t\t\t\tA{info.route && `, ${info.route.aEdgePicking}`}\n\t\t\t\t{info.A.isPoint && `, point`}\n\t\t\t</text>\n\t\t\t<text\n\t\t\t\tx={info.B.expanded.x}\n\t\t\t\ty={info.B.expanded.y}\n\t\t\t\tfontSize={10}\n\t\t\t\tfill=\"black\"\n\t\t\t\tstroke=\"var(--color-background)\"\n\t\t\t\tstrokeWidth={2}\n\t\t\t\tpaintOrder=\"stroke\"\n\t\t\t>\n\t\t\t\tB{info.route && `, ${info.route.bEdgePicking}`}\n\t\t\t\t{info.B.isPoint && `, point`}\n\t\t\t</text>\n\t\t</>\n\t)\n}\n\nfunction DebugLine({ a, b, ...props }: { a: VecLike; b: VecLike } & SVGProps<SVGLineElement>) {\n\treturn (\n\t\t<line\n\t\t\tfill=\"none\"\n\t\t\tstrokeWidth={1}\n\t\t\tstrokeDasharray=\"4,4\"\n\t\t\tstroke=\"green\"\n\t\t\tx1={a.x}\n\t\t\ty1={a.y}\n\t\t\tx2={b.x}\n\t\t\ty2={b.y}\n\t\t\t{...props}\n\t\t/>\n\t)\n}\n\nfunction DebugRoute({ route, ...props }: { route: VecLike[] } & SVGProps<SVGPolylineElement>) {\n\treturn (\n\t\t<polyline\n\t\t\tfill=\"none\"\n\t\t\tstroke=\"darkorchid\"\n\t\t\tstrokeWidth={3}\n\t\t\topacity={0.5}\n\t\t\tpoints={route.map((r) => `${r.x},${r.y}`).join(' ')}\n\t\t\t{...props}\n\t\t/>\n\t)\n}\n\nfunction DebugEdge({\n\tedge,\n\taxis,\n\t...props\n}: {\n\tedge: ElbowArrowEdge | null\n\taxis: 'x' | 'y'\n} & Omit<SVGProps<SVGLineElement>, 'scale'>) {\n\tif (!edge || edge.expanded === null) return null\n\tconst vec = (vec: VecLike) => (axis === 'x' ? { x: vec.y, y: vec.x } : vec)\n\n\treturn (\n\t\t<g>\n\t\t\t<DebugLine\n\t\t\t\ta={vec({ x: edge.expanded, y: edge.cross.min })}\n\t\t\t\tb={vec({ x: edge.expanded, y: edge.cross.max })}\n\t\t\t\tstrokeDasharray=\"0\"\n\t\t\t\tstrokeWidth={1.5}\n\t\t\t\t{...props}\n\t\t\t/>\n\t\t\t<DebugLine\n\t\t\t\ta={vec({ x: edge.expanded - 4, y: edge.cross.min })}\n\t\t\t\tb={vec({ x: edge.expanded + 4, y: edge.cross.min })}\n\t\t\t\tstrokeDasharray=\"0\"\n\t\t\t\tstrokeWidth={1.5}\n\t\t\t\t{...props}\n\t\t\t/>\n\t\t\t<DebugLine\n\t\t\t\ta={vec({ x: edge.expanded - 4, y: edge.cross.max })}\n\t\t\t\tb={vec({ x: edge.expanded + 4, y: edge.cross.max })}\n\t\t\t\tstrokeDasharray=\"0\"\n\t\t\t\tstrokeWidth={1.5}\n\t\t\t\t{...props}\n\t\t\t/>\n\t\t</g>\n\t)\n}\n\nfunction DebugBox({ box, ...props }: { box: Box } & SVGProps<SVGRectElement>) {\n\treturn (\n\t\t<rect\n\t\t\tx={box.minX}\n\t\t\ty={box.minY}\n\t\t\twidth={box.width}\n\t\t\theight={box.height}\n\t\t\tstrokeDasharray=\"4,4\"\n\t\t\tstrokeWidth={1}\n\t\t\tfill=\"none\"\n\t\t\t{...props}\n\t\t/>\n\t)\n}\n"],
+  "sourcesContent": ["import { Box, TLArrowShape, useEditor, useValue, VecLike } from '@tldraw/editor'\nimport { SVGProps } from 'react'\nimport { getArrowBindings } from '../shared'\nimport { ElbowArrowEdge } from './definitions'\nimport { getElbowArrowInfo } from './getElbowArrowInfo'\n\nexport function ElbowArrowDebug({ arrow }: { arrow: TLArrowShape }) {\n\tconst editor = useEditor()\n\tconst info = useValue(\n\t\t'elbow arrow grid',\n\t\t() => {\n\t\t\ttry {\n\t\t\t\tconst info = getElbowArrowInfo(\n\t\t\t\t\teditor,\n\t\t\t\t\teditor.getShape(arrow.id)!,\n\t\t\t\t\tgetArrowBindings(editor, arrow)\n\t\t\t\t)\n\t\t\t\treturn info\n\t\t\t} catch (err) {\n\t\t\t\tconsole.error(err)\n\t\t\t\treturn undefined\n\t\t\t}\n\t\t},\n\t\t[editor, arrow.id]\n\t)\n\n\tif (!info) return null\n\n\tconst fullBox = Box.Common([info.A.original, info.B.original]).expandBy(50)\n\n\tconst label = info.route?.name ?? ''\n\n\tconst midPoint = info.route?.midpointHandle\n\n\treturn (\n\t\t<>\n\t\t\t{info.midX !== null && (\n\t\t\t\t<DebugLine\n\t\t\t\t\ta={{ x: info.midX, y: fullBox.minY }}\n\t\t\t\t\tb={{ x: info.midX, y: fullBox.maxY }}\n\t\t\t\t\tstroke=\"red\"\n\t\t\t\t/>\n\t\t\t)}\n\t\t\t{info.midY !== null && (\n\t\t\t\t<DebugLine\n\t\t\t\t\ta={{ x: fullBox.minX, y: info.midY }}\n\t\t\t\t\tb={{ x: fullBox.maxX, y: info.midY }}\n\t\t\t\t\tstroke=\"blue\"\n\t\t\t\t/>\n\t\t\t)}\n\n\t\t\t{midPoint?.axis === 'x' && info.midXRange && (\n\t\t\t\t<DebugLine\n\t\t\t\t\ta={{ x: info.midXRange.lo, y: midPoint.point.y }}\n\t\t\t\t\tb={{ x: info.midXRange.hi, y: midPoint.point.y }}\n\t\t\t\t\tstroke=\"red\"\n\t\t\t\t\tstrokeDasharray={'0 2'}\n\t\t\t\t/>\n\t\t\t)}\n\n\t\t\t{midPoint?.axis === 'y' && info.midYRange && (\n\t\t\t\t<DebugLine\n\t\t\t\t\ta={{ x: midPoint.point.x, y: info.midYRange.lo }}\n\t\t\t\t\tb={{ x: midPoint.point.x, y: info.midYRange.hi }}\n\t\t\t\t\tstroke=\"blue\"\n\t\t\t\t\tstrokeDasharray={'0 2'}\n\t\t\t\t/>\n\t\t\t)}\n\n\t\t\t<DebugBox box={info.A.original} stroke=\"orange\" />\n\t\t\t<DebugBox box={info.A.expanded} stroke=\"orange\" strokeWidth={0.5} />\n\t\t\t<DebugBox\n\t\t\t\tbox={info.A.original.clone().expandBy(info.options.minElbowLegLength)}\n\t\t\t\tstroke=\"orange\"\n\t\t\t\tstrokeWidth={0.5}\n\t\t\t/>\n\t\t\t<DebugBox box={info.B.original} stroke=\"lightskyblue\" />\n\t\t\t<DebugBox box={info.B.expanded} stroke=\"lightskyblue\" strokeWidth={0.5} />\n\t\t\t<DebugBox\n\t\t\t\tbox={info.B.original.clone().expandBy(info.options.minElbowLegLength)}\n\t\t\t\tstroke=\"lightskyblue\"\n\t\t\t\tstrokeWidth={0.5}\n\t\t\t/>\n\n\t\t\t<DebugEdge edge={info.A.edges.top} axis=\"x\" stroke=\"orange\" />\n\t\t\t<DebugEdge edge={info.B.edges.top} axis=\"x\" stroke=\"lightskyblue\" />\n\t\t\t<DebugEdge edge={info.A.edges.right} axis=\"y\" stroke=\"orange\" />\n\t\t\t<DebugEdge edge={info.B.edges.right} axis=\"y\" stroke=\"lightskyblue\" />\n\t\t\t<DebugEdge edge={info.A.edges.bottom} axis=\"x\" stroke=\"orange\" />\n\t\t\t<DebugEdge edge={info.B.edges.bottom} axis=\"x\" stroke=\"lightskyblue\" />\n\t\t\t<DebugEdge edge={info.A.edges.left} axis=\"y\" stroke=\"orange\" />\n\t\t\t<DebugEdge edge={info.B.edges.left} axis=\"y\" stroke=\"lightskyblue\" />\n\n\t\t\t{info.route && <DebugRoute route={info.route.points} strokeWidth={10} />}\n\n\t\t\t<text\n\t\t\t\tx={fullBox.minX + 5}\n\t\t\t\ty={fullBox.minY - 3}\n\t\t\t\tfontSize={10}\n\t\t\t\tfill=\"black\"\n\t\t\t\tstroke=\"var(--tl-color-background)\"\n\t\t\t\tstrokeWidth={2}\n\t\t\t\tpaintOrder=\"stroke\"\n\t\t\t>\n\t\t\t\t{label}\n\t\t\t</text>\n\t\t\t<text\n\t\t\t\tx={info.A.expanded.x}\n\t\t\t\ty={info.A.expanded.y}\n\t\t\t\tfontSize={10}\n\t\t\t\tfill=\"black\"\n\t\t\t\tstroke=\"var(--tl-color-background)\"\n\t\t\t\tstrokeWidth={2}\n\t\t\t\tpaintOrder=\"stroke\"\n\t\t\t>\n\t\t\t\tA{info.route && `, ${info.route.aEdgePicking}`}\n\t\t\t\t{info.A.isPoint && `, point`}\n\t\t\t</text>\n\t\t\t<text\n\t\t\t\tx={info.B.expanded.x}\n\t\t\t\ty={info.B.expanded.y}\n\t\t\t\tfontSize={10}\n\t\t\t\tfill=\"black\"\n\t\t\t\tstroke=\"var(--tl-color-background)\"\n\t\t\t\tstrokeWidth={2}\n\t\t\t\tpaintOrder=\"stroke\"\n\t\t\t>\n\t\t\t\tB{info.route && `, ${info.route.bEdgePicking}`}\n\t\t\t\t{info.B.isPoint && `, point`}\n\t\t\t</text>\n\t\t</>\n\t)\n}\n\nfunction DebugLine({ a, b, ...props }: { a: VecLike; b: VecLike } & SVGProps<SVGLineElement>) {\n\treturn (\n\t\t<line\n\t\t\tfill=\"none\"\n\t\t\tstrokeWidth={1}\n\t\t\tstrokeDasharray=\"4,4\"\n\t\t\tstroke=\"green\"\n\t\t\tx1={a.x}\n\t\t\ty1={a.y}\n\t\t\tx2={b.x}\n\t\t\ty2={b.y}\n\t\t\t{...props}\n\t\t/>\n\t)\n}\n\nfunction DebugRoute({ route, ...props }: { route: VecLike[] } & SVGProps<SVGPolylineElement>) {\n\treturn (\n\t\t<polyline\n\t\t\tfill=\"none\"\n\t\t\tstroke=\"darkorchid\"\n\t\t\tstrokeWidth={3}\n\t\t\topacity={0.5}\n\t\t\tpoints={route.map((r) => `${r.x},${r.y}`).join(' ')}\n\t\t\t{...props}\n\t\t/>\n\t)\n}\n\nfunction DebugEdge({\n\tedge,\n\taxis,\n\t...props\n}: {\n\tedge: ElbowArrowEdge | null\n\taxis: 'x' | 'y'\n} & Omit<SVGProps<SVGLineElement>, 'scale'>) {\n\tif (!edge || edge.expanded === null) return null\n\tconst vec = (vec: VecLike) => (axis === 'x' ? { x: vec.y, y: vec.x } : vec)\n\n\treturn (\n\t\t<g>\n\t\t\t<DebugLine\n\t\t\t\ta={vec({ x: edge.expanded, y: edge.cross.min })}\n\t\t\t\tb={vec({ x: edge.expanded, y: edge.cross.max })}\n\t\t\t\tstrokeDasharray=\"0\"\n\t\t\t\tstrokeWidth={1.5}\n\t\t\t\t{...props}\n\t\t\t/>\n\t\t\t<DebugLine\n\t\t\t\ta={vec({ x: edge.expanded - 4, y: edge.cross.min })}\n\t\t\t\tb={vec({ x: edge.expanded + 4, y: edge.cross.min })}\n\t\t\t\tstrokeDasharray=\"0\"\n\t\t\t\tstrokeWidth={1.5}\n\t\t\t\t{...props}\n\t\t\t/>\n\t\t\t<DebugLine\n\t\t\t\ta={vec({ x: edge.expanded - 4, y: edge.cross.max })}\n\t\t\t\tb={vec({ x: edge.expanded + 4, y: edge.cross.max })}\n\t\t\t\tstrokeDasharray=\"0\"\n\t\t\t\tstrokeWidth={1.5}\n\t\t\t\t{...props}\n\t\t\t/>\n\t\t</g>\n\t)\n}\n\nfunction DebugBox({ box, ...props }: { box: Box } & SVGProps<SVGRectElement>) {\n\treturn (\n\t\t<rect\n\t\t\tx={box.minX}\n\t\t\ty={box.minY}\n\t\t\twidth={box.width}\n\t\t\theight={box.height}\n\t\t\tstrokeDasharray=\"4,4\"\n\t\t\tstrokeWidth={1}\n\t\t\tfill=\"none\"\n\t\t\t{...props}\n\t\t/>\n\t)\n}\n"],
   "mappings": "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",
   "names": ["info", "vec"]
 }

package/dist-esm/lib/shapes/draw/DrawShapeUtil.mjs

@@ -8,6 +8,7 @@ import {
   ShapeUtil,
   drawShapeMigrations,
   drawShapeProps,
+  getColorValue,
   last,
   lerp,
   rng,
@@ -206,7 +207,7 @@ function DrawShapeSvg({ shape, zoomOverride }) {
         {
           d: svgInk(allPointsFromSegments, options),
           strokeLinecap: "round",
-          fill: theme[shape.props.color].solid
+          fill: getColorValue(theme, shape.props.color, "solid")
         }
       )
     ] });
@@ -230,8 +231,8 @@ function DrawShapeSvg({ shape, zoomOverride }) {
       {
         d: solidStrokePath,
         strokeLinecap: "round",
-        fill: isDot ? theme[shape.props.color].solid : "none",
-        stroke: theme[shape.props.color].solid,
+        fill: isDot ? getColorValue(theme, shape.props.color, "solid") : "none",
+        stroke: getColorValue(theme, shape.props.color, "solid"),
         strokeWidth: sw,
         strokeDasharray: isDot ? "none" : getDrawShapeStrokeDashArray(shape, sw, dotAdjustment),
         strokeDashoffset: "0"

package/dist-esm/lib/shapes/draw/DrawShapeUtil.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/lib/shapes/draw/DrawShapeUtil.tsx"],
-  "sourcesContent": ["import {\n\tBox,\n\tCircle2d,\n\tPolygon2d,\n\tPolyline2d,\n\tSVGContainer,\n\tShapeUtil,\n\tSvgExportContext,\n\tTLDrawShape,\n\tTLDrawShapeProps,\n\tTLDrawShapeSegment,\n\tTLResizeInfo,\n\tTLShapeUtilCanvasSvgDef,\n\tVecLike,\n\tdrawShapeMigrations,\n\tdrawShapeProps,\n\tlast,\n\tlerp,\n\trng,\n\ttoFixed,\n\tuseEditor,\n\tuseValue,\n} from '@tldraw/editor'\n\nimport { ShapeFill } from '../shared/ShapeFill'\nimport { STROKE_SIZES } from '../shared/default-shape-constants'\nimport { getFillDefForCanvas, getFillDefForExport } from '../shared/defaultStyleDefs'\nimport { getStrokePoints } from '../shared/freehand/getStrokePoints'\nimport { getSvgPathFromStrokePoints } from '../shared/freehand/svg'\nimport { svgInk } from '../shared/freehand/svgInk'\nimport { interpolateSegments } from '../shared/interpolate-props'\nimport { useDefaultColorTheme } from '../shared/useDefaultColorTheme'\nimport { getDrawShapeStrokeDashArray, getFreehandOptions, getPointsFromSegments } from './getPath'\n\n/** @public */\nexport interface DrawShapeOptions {\n\t/**\n\t * The maximum number of points in a line before the draw tool will begin a new shape.\n\t * A higher number will lead to poor performance while drawing very long lines.\n\t */\n\treadonly maxPointsPerShape: number\n}\n\n/** @public */\nexport class DrawShapeUtil extends ShapeUtil<TLDrawShape> {\n\tstatic override type = 'draw' as const\n\tstatic override props = drawShapeProps\n\tstatic override migrations = drawShapeMigrations\n\n\toverride options: DrawShapeOptions = {\n\t\tmaxPointsPerShape: 600,\n\t}\n\n\toverride hideResizeHandles(shape: TLDrawShape) {\n\t\treturn getIsDot(shape)\n\t}\n\toverride hideRotateHandle(shape: TLDrawShape) {\n\t\treturn getIsDot(shape)\n\t}\n\toverride hideSelectionBoundsFg(shape: TLDrawShape) {\n\t\treturn getIsDot(shape)\n\t}\n\n\toverride getDefaultProps(): TLDrawShape['props'] {\n\t\treturn {\n\t\t\tsegments: [],\n\t\t\tcolor: 'black',\n\t\t\tfill: 'none',\n\t\t\tdash: 'draw',\n\t\t\tsize: 'm',\n\t\t\tisComplete: false,\n\t\t\tisClosed: false,\n\t\t\tisPen: false,\n\t\t\tscale: 1,\n\t\t}\n\t}\n\n\tgetGeometry(shape: TLDrawShape) {\n\t\tconst points = getPointsFromSegments(shape.props.segments)\n\n\t\tconst sw = (STROKE_SIZES[shape.props.size] + 1) * shape.props.scale\n\n\t\t// A dot\n\t\tif (shape.props.segments.length === 1) {\n\t\t\tconst box = Box.FromPoints(points)\n\t\t\tif (box.width < sw * 2 && box.height < sw * 2) {\n\t\t\t\treturn new Circle2d({\n\t\t\t\t\tx: -sw,\n\t\t\t\t\ty: -sw,\n\t\t\t\t\tradius: sw,\n\t\t\t\t\tisFilled: true,\n\t\t\t\t})\n\t\t\t}\n\t\t}\n\n\t\tconst strokePoints = getStrokePoints(\n\t\t\tpoints,\n\t\t\tgetFreehandOptions(shape.props, sw, shape.props.isPen, true)\n\t\t).map((p) => p.point)\n\n\t\t// A closed draw stroke\n\t\tif (shape.props.isClosed && strokePoints.length > 2) {\n\t\t\treturn new Polygon2d({\n\t\t\t\tpoints: strokePoints,\n\t\t\t\tisFilled: shape.props.fill !== 'none',\n\t\t\t})\n\t\t}\n\n\t\tif (strokePoints.length === 1) {\n\t\t\treturn new Circle2d({\n\t\t\t\tx: -sw,\n\t\t\t\ty: -sw,\n\t\t\t\tradius: sw,\n\t\t\t\tisFilled: true,\n\t\t\t})\n\t\t}\n\n\t\t// An open draw stroke\n\t\treturn new Polyline2d({\n\t\t\tpoints: strokePoints,\n\t\t})\n\t}\n\n\tcomponent(shape: TLDrawShape) {\n\t\treturn (\n\t\t\t<SVGContainer>\n\t\t\t\t<DrawShapeSvg shape={shape} />\n\t\t\t</SVGContainer>\n\t\t)\n\t}\n\n\tindicator(shape: TLDrawShape) {\n\t\tconst allPointsFromSegments = getPointsFromSegments(shape.props.segments)\n\n\t\tlet sw = (STROKE_SIZES[shape.props.size] + 1) * shape.props.scale\n\n\t\t// eslint-disable-next-line react-hooks/rules-of-hooks\n\t\tconst forceSolid = useValue(\n\t\t\t'force solid',\n\t\t\t() => {\n\t\t\t\tconst zoomLevel = this.editor.getZoomLevel()\n\t\t\t\treturn zoomLevel < 0.5 && zoomLevel < 1.5 / sw\n\t\t\t},\n\t\t\t[this.editor, sw]\n\t\t)\n\n\t\tif (\n\t\t\t!forceSolid &&\n\t\t\t!shape.props.isPen &&\n\t\t\tshape.props.dash === 'draw' &&\n\t\t\tallPointsFromSegments.length === 1\n\t\t) {\n\t\t\tsw += rng(shape.id)() * (sw / 6)\n\t\t}\n\n\t\tconst showAsComplete = shape.props.isComplete || last(shape.props.segments)?.type === 'straight'\n\t\tconst options = getFreehandOptions(shape.props, sw, showAsComplete, true)\n\t\tconst strokePoints = getStrokePoints(allPointsFromSegments, options)\n\t\tconst solidStrokePath =\n\t\t\tstrokePoints.length > 1\n\t\t\t\t? getSvgPathFromStrokePoints(strokePoints, shape.props.isClosed)\n\t\t\t\t: getDot(allPointsFromSegments[0], sw)\n\n\t\treturn <path d={solidStrokePath} />\n\t}\n\n\toverride toSvg(shape: TLDrawShape, ctx: SvgExportContext) {\n\t\tctx.addExportDef(getFillDefForExport(shape.props.fill))\n\t\tconst scaleFactor = 1 / shape.props.scale\n\t\treturn (\n\t\t\t<g transform={`scale(${scaleFactor})`}>\n\t\t\t\t<DrawShapeSvg shape={shape} zoomOverride={1} />\n\t\t\t</g>\n\t\t)\n\t}\n\n\toverride getCanvasSvgDefs(): TLShapeUtilCanvasSvgDef[] {\n\t\treturn [getFillDefForCanvas()]\n\t}\n\n\toverride onResize(shape: TLDrawShape, info: TLResizeInfo<TLDrawShape>) {\n\t\tconst { scaleX, scaleY } = info\n\n\t\tconst newSegments: TLDrawShapeSegment[] = []\n\n\t\tfor (const segment of shape.props.segments) {\n\t\t\tnewSegments.push({\n\t\t\t\t...segment,\n\t\t\t\tpoints: segment.points.map(({ x, y, z }) => {\n\t\t\t\t\treturn {\n\t\t\t\t\t\tx: toFixed(scaleX * x),\n\t\t\t\t\t\ty: toFixed(scaleY * y),\n\t\t\t\t\t\tz,\n\t\t\t\t\t}\n\t\t\t\t}),\n\t\t\t})\n\t\t}\n\n\t\treturn {\n\t\t\tprops: {\n\t\t\t\tsegments: newSegments,\n\t\t\t},\n\t\t}\n\t}\n\n\toverride expandSelectionOutlinePx(shape: TLDrawShape): number {\n\t\tconst multiplier = shape.props.dash === 'draw' ? 1.6 : 1\n\t\treturn ((STROKE_SIZES[shape.props.size] * multiplier) / 2) * shape.props.scale\n\t}\n\toverride getInterpolatedProps(\n\t\tstartShape: TLDrawShape,\n\t\tendShape: TLDrawShape,\n\t\tt: number\n\t): TLDrawShapeProps {\n\t\treturn {\n\t\t\t...(t > 0.5 ? endShape.props : startShape.props),\n\t\t\tsegments: interpolateSegments(startShape.props.segments, endShape.props.segments, t),\n\t\t\tscale: lerp(startShape.props.scale, endShape.props.scale, t),\n\t\t}\n\t}\n}\n\nfunction getDot(point: VecLike, sw: number) {\n\tconst r = (sw + 1) * 0.5\n\treturn `M ${point.x} ${point.y} m -${r}, 0 a ${r},${r} 0 1,0 ${r * 2},0 a ${r},${r} 0 1,0 -${\n\t\tr * 2\n\t},0`\n}\n\nfunction getIsDot(shape: TLDrawShape) {\n\treturn shape.props.segments.length === 1 && shape.props.segments[0].points.length < 2\n}\n\nfunction DrawShapeSvg({ shape, zoomOverride }: { shape: TLDrawShape; zoomOverride?: number }) {\n\tconst theme = useDefaultColorTheme()\n\tconst editor = useEditor()\n\n\tconst allPointsFromSegments = getPointsFromSegments(shape.props.segments)\n\n\tconst showAsComplete = shape.props.isComplete || last(shape.props.segments)?.type === 'straight'\n\n\tlet sw = (STROKE_SIZES[shape.props.size] + 1) * shape.props.scale\n\tconst forceSolid = useValue(\n\t\t'force solid',\n\t\t() => {\n\t\t\tconst zoomLevel = zoomOverride ?? editor.getZoomLevel()\n\t\t\treturn zoomLevel < 0.5 && zoomLevel < 1.5 / sw\n\t\t},\n\t\t[editor, sw, zoomOverride]\n\t)\n\n\tconst dotAdjustment = useValue(\n\t\t'dot adjustment',\n\t\t() => {\n\t\t\tconst zoomLevel = zoomOverride ?? editor.getZoomLevel()\n\t\t\t// If we're zoomed way out (10%), then we need to make the dotted line go to 9 instead 0.1\n\t\t\t// Chrome doesn't render anything otherwise.\n\t\t\treturn zoomLevel < 0.2 ? 0 : 0.1\n\t\t},\n\t\t[editor, zoomOverride]\n\t)\n\n\tif (\n\t\t!forceSolid &&\n\t\t!shape.props.isPen &&\n\t\tshape.props.dash === 'draw' &&\n\t\tallPointsFromSegments.length === 1\n\t) {\n\t\tsw += rng(shape.id)() * (sw / 6)\n\t}\n\n\tconst options = getFreehandOptions(shape.props, sw, showAsComplete, forceSolid)\n\n\tif (!forceSolid && shape.props.dash === 'draw') {\n\t\treturn (\n\t\t\t<>\n\t\t\t\t{shape.props.isClosed && shape.props.fill && allPointsFromSegments.length > 1 ? (\n\t\t\t\t\t<ShapeFill\n\t\t\t\t\t\td={getSvgPathFromStrokePoints(\n\t\t\t\t\t\t\tgetStrokePoints(allPointsFromSegments, options),\n\t\t\t\t\t\t\tshape.props.isClosed\n\t\t\t\t\t\t)}\n\t\t\t\t\t\ttheme={theme}\n\t\t\t\t\t\tcolor={shape.props.color}\n\t\t\t\t\t\tfill={shape.props.isClosed ? shape.props.fill : 'none'}\n\t\t\t\t\t\tscale={shape.props.scale}\n\t\t\t\t\t/>\n\t\t\t\t) : null}\n\t\t\t\t<path\n\t\t\t\t\td={svgInk(allPointsFromSegments, options)}\n\t\t\t\t\tstrokeLinecap=\"round\"\n\t\t\t\t\tfill={theme[shape.props.color].solid}\n\t\t\t\t/>\n\t\t\t</>\n\t\t)\n\t}\n\n\tconst strokePoints = getStrokePoints(allPointsFromSegments, options)\n\tconst isDot = strokePoints.length < 2\n\tconst solidStrokePath = isDot\n\t\t? getDot(allPointsFromSegments[0], 0)\n\t\t: getSvgPathFromStrokePoints(strokePoints, shape.props.isClosed)\n\n\treturn (\n\t\t<>\n\t\t\t<ShapeFill\n\t\t\t\td={solidStrokePath}\n\t\t\t\ttheme={theme}\n\t\t\t\tcolor={shape.props.color}\n\t\t\t\tfill={isDot || shape.props.isClosed ? shape.props.fill : 'none'}\n\t\t\t\tscale={shape.props.scale}\n\t\t\t/>\n\t\t\t<path\n\t\t\t\td={solidStrokePath}\n\t\t\t\tstrokeLinecap=\"round\"\n\t\t\t\tfill={isDot ? theme[shape.props.color].solid : 'none'}\n\t\t\t\tstroke={theme[shape.props.color].solid}\n\t\t\t\tstrokeWidth={sw}\n\t\t\t\tstrokeDasharray={isDot ? 'none' : getDrawShapeStrokeDashArray(shape, sw, dotAdjustment)}\n\t\t\t\tstrokeDashoffset=\"0\"\n\t\t\t/>\n\t\t</>\n\t)\n}\n"],
-  "mappings": "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",
+  "sourcesContent": ["import {\n\tBox,\n\tCircle2d,\n\tPolygon2d,\n\tPolyline2d,\n\tSVGContainer,\n\tShapeUtil,\n\tSvgExportContext,\n\tTLDrawShape,\n\tTLDrawShapeProps,\n\tTLDrawShapeSegment,\n\tTLResizeInfo,\n\tTLShapeUtilCanvasSvgDef,\n\tVecLike,\n\tdrawShapeMigrations,\n\tdrawShapeProps,\n\tgetColorValue,\n\tlast,\n\tlerp,\n\trng,\n\ttoFixed,\n\tuseEditor,\n\tuseValue,\n} from '@tldraw/editor'\n\nimport { ShapeFill } from '../shared/ShapeFill'\nimport { STROKE_SIZES } from '../shared/default-shape-constants'\nimport { getFillDefForCanvas, getFillDefForExport } from '../shared/defaultStyleDefs'\nimport { getStrokePoints } from '../shared/freehand/getStrokePoints'\nimport { getSvgPathFromStrokePoints } from '../shared/freehand/svg'\nimport { svgInk } from '../shared/freehand/svgInk'\nimport { interpolateSegments } from '../shared/interpolate-props'\nimport { useDefaultColorTheme } from '../shared/useDefaultColorTheme'\nimport { getDrawShapeStrokeDashArray, getFreehandOptions, getPointsFromSegments } from './getPath'\n\n/** @public */\nexport interface DrawShapeOptions {\n\t/**\n\t * The maximum number of points in a line before the draw tool will begin a new shape.\n\t * A higher number will lead to poor performance while drawing very long lines.\n\t */\n\treadonly maxPointsPerShape: number\n}\n\n/** @public */\nexport class DrawShapeUtil extends ShapeUtil<TLDrawShape> {\n\tstatic override type = 'draw' as const\n\tstatic override props = drawShapeProps\n\tstatic override migrations = drawShapeMigrations\n\n\toverride options: DrawShapeOptions = {\n\t\tmaxPointsPerShape: 600,\n\t}\n\n\toverride hideResizeHandles(shape: TLDrawShape) {\n\t\treturn getIsDot(shape)\n\t}\n\toverride hideRotateHandle(shape: TLDrawShape) {\n\t\treturn getIsDot(shape)\n\t}\n\toverride hideSelectionBoundsFg(shape: TLDrawShape) {\n\t\treturn getIsDot(shape)\n\t}\n\n\toverride getDefaultProps(): TLDrawShape['props'] {\n\t\treturn {\n\t\t\tsegments: [],\n\t\t\tcolor: 'black',\n\t\t\tfill: 'none',\n\t\t\tdash: 'draw',\n\t\t\tsize: 'm',\n\t\t\tisComplete: false,\n\t\t\tisClosed: false,\n\t\t\tisPen: false,\n\t\t\tscale: 1,\n\t\t}\n\t}\n\n\tgetGeometry(shape: TLDrawShape) {\n\t\tconst points = getPointsFromSegments(shape.props.segments)\n\n\t\tconst sw = (STROKE_SIZES[shape.props.size] + 1) * shape.props.scale\n\n\t\t// A dot\n\t\tif (shape.props.segments.length === 1) {\n\t\t\tconst box = Box.FromPoints(points)\n\t\t\tif (box.width < sw * 2 && box.height < sw * 2) {\n\t\t\t\treturn new Circle2d({\n\t\t\t\t\tx: -sw,\n\t\t\t\t\ty: -sw,\n\t\t\t\t\tradius: sw,\n\t\t\t\t\tisFilled: true,\n\t\t\t\t})\n\t\t\t}\n\t\t}\n\n\t\tconst strokePoints = getStrokePoints(\n\t\t\tpoints,\n\t\t\tgetFreehandOptions(shape.props, sw, shape.props.isPen, true)\n\t\t).map((p) => p.point)\n\n\t\t// A closed draw stroke\n\t\tif (shape.props.isClosed && strokePoints.length > 2) {\n\t\t\treturn new Polygon2d({\n\t\t\t\tpoints: strokePoints,\n\t\t\t\tisFilled: shape.props.fill !== 'none',\n\t\t\t})\n\t\t}\n\n\t\tif (strokePoints.length === 1) {\n\t\t\treturn new Circle2d({\n\t\t\t\tx: -sw,\n\t\t\t\ty: -sw,\n\t\t\t\tradius: sw,\n\t\t\t\tisFilled: true,\n\t\t\t})\n\t\t}\n\n\t\t// An open draw stroke\n\t\treturn new Polyline2d({\n\t\t\tpoints: strokePoints,\n\t\t})\n\t}\n\n\tcomponent(shape: TLDrawShape) {\n\t\treturn (\n\t\t\t<SVGContainer>\n\t\t\t\t<DrawShapeSvg shape={shape} />\n\t\t\t</SVGContainer>\n\t\t)\n\t}\n\n\tindicator(shape: TLDrawShape) {\n\t\tconst allPointsFromSegments = getPointsFromSegments(shape.props.segments)\n\n\t\tlet sw = (STROKE_SIZES[shape.props.size] + 1) * shape.props.scale\n\n\t\t// eslint-disable-next-line react-hooks/rules-of-hooks\n\t\tconst forceSolid = useValue(\n\t\t\t'force solid',\n\t\t\t() => {\n\t\t\t\tconst zoomLevel = this.editor.getZoomLevel()\n\t\t\t\treturn zoomLevel < 0.5 && zoomLevel < 1.5 / sw\n\t\t\t},\n\t\t\t[this.editor, sw]\n\t\t)\n\n\t\tif (\n\t\t\t!forceSolid &&\n\t\t\t!shape.props.isPen &&\n\t\t\tshape.props.dash === 'draw' &&\n\t\t\tallPointsFromSegments.length === 1\n\t\t) {\n\t\t\tsw += rng(shape.id)() * (sw / 6)\n\t\t}\n\n\t\tconst showAsComplete = shape.props.isComplete || last(shape.props.segments)?.type === 'straight'\n\t\tconst options = getFreehandOptions(shape.props, sw, showAsComplete, true)\n\t\tconst strokePoints = getStrokePoints(allPointsFromSegments, options)\n\t\tconst solidStrokePath =\n\t\t\tstrokePoints.length > 1\n\t\t\t\t? getSvgPathFromStrokePoints(strokePoints, shape.props.isClosed)\n\t\t\t\t: getDot(allPointsFromSegments[0], sw)\n\n\t\treturn <path d={solidStrokePath} />\n\t}\n\n\toverride toSvg(shape: TLDrawShape, ctx: SvgExportContext) {\n\t\tctx.addExportDef(getFillDefForExport(shape.props.fill))\n\t\tconst scaleFactor = 1 / shape.props.scale\n\t\treturn (\n\t\t\t<g transform={`scale(${scaleFactor})`}>\n\t\t\t\t<DrawShapeSvg shape={shape} zoomOverride={1} />\n\t\t\t</g>\n\t\t)\n\t}\n\n\toverride getCanvasSvgDefs(): TLShapeUtilCanvasSvgDef[] {\n\t\treturn [getFillDefForCanvas()]\n\t}\n\n\toverride onResize(shape: TLDrawShape, info: TLResizeInfo<TLDrawShape>) {\n\t\tconst { scaleX, scaleY } = info\n\n\t\tconst newSegments: TLDrawShapeSegment[] = []\n\n\t\tfor (const segment of shape.props.segments) {\n\t\t\tnewSegments.push({\n\t\t\t\t...segment,\n\t\t\t\tpoints: segment.points.map(({ x, y, z }) => {\n\t\t\t\t\treturn {\n\t\t\t\t\t\tx: toFixed(scaleX * x),\n\t\t\t\t\t\ty: toFixed(scaleY * y),\n\t\t\t\t\t\tz,\n\t\t\t\t\t}\n\t\t\t\t}),\n\t\t\t})\n\t\t}\n\n\t\treturn {\n\t\t\tprops: {\n\t\t\t\tsegments: newSegments,\n\t\t\t},\n\t\t}\n\t}\n\n\toverride expandSelectionOutlinePx(shape: TLDrawShape): number {\n\t\tconst multiplier = shape.props.dash === 'draw' ? 1.6 : 1\n\t\treturn ((STROKE_SIZES[shape.props.size] * multiplier) / 2) * shape.props.scale\n\t}\n\toverride getInterpolatedProps(\n\t\tstartShape: TLDrawShape,\n\t\tendShape: TLDrawShape,\n\t\tt: number\n\t): TLDrawShapeProps {\n\t\treturn {\n\t\t\t...(t > 0.5 ? endShape.props : startShape.props),\n\t\t\tsegments: interpolateSegments(startShape.props.segments, endShape.props.segments, t),\n\t\t\tscale: lerp(startShape.props.scale, endShape.props.scale, t),\n\t\t}\n\t}\n}\n\nfunction getDot(point: VecLike, sw: number) {\n\tconst r = (sw + 1) * 0.5\n\treturn `M ${point.x} ${point.y} m -${r}, 0 a ${r},${r} 0 1,0 ${r * 2},0 a ${r},${r} 0 1,0 -${\n\t\tr * 2\n\t},0`\n}\n\nfunction getIsDot(shape: TLDrawShape) {\n\treturn shape.props.segments.length === 1 && shape.props.segments[0].points.length < 2\n}\n\nfunction DrawShapeSvg({ shape, zoomOverride }: { shape: TLDrawShape; zoomOverride?: number }) {\n\tconst theme = useDefaultColorTheme()\n\tconst editor = useEditor()\n\n\tconst allPointsFromSegments = getPointsFromSegments(shape.props.segments)\n\n\tconst showAsComplete = shape.props.isComplete || last(shape.props.segments)?.type === 'straight'\n\n\tlet sw = (STROKE_SIZES[shape.props.size] + 1) * shape.props.scale\n\tconst forceSolid = useValue(\n\t\t'force solid',\n\t\t() => {\n\t\t\tconst zoomLevel = zoomOverride ?? editor.getZoomLevel()\n\t\t\treturn zoomLevel < 0.5 && zoomLevel < 1.5 / sw\n\t\t},\n\t\t[editor, sw, zoomOverride]\n\t)\n\n\tconst dotAdjustment = useValue(\n\t\t'dot adjustment',\n\t\t() => {\n\t\t\tconst zoomLevel = zoomOverride ?? editor.getZoomLevel()\n\t\t\t// If we're zoomed way out (10%), then we need to make the dotted line go to 9 instead 0.1\n\t\t\t// Chrome doesn't render anything otherwise.\n\t\t\treturn zoomLevel < 0.2 ? 0 : 0.1\n\t\t},\n\t\t[editor, zoomOverride]\n\t)\n\n\tif (\n\t\t!forceSolid &&\n\t\t!shape.props.isPen &&\n\t\tshape.props.dash === 'draw' &&\n\t\tallPointsFromSegments.length === 1\n\t) {\n\t\tsw += rng(shape.id)() * (sw / 6)\n\t}\n\n\tconst options = getFreehandOptions(shape.props, sw, showAsComplete, forceSolid)\n\n\tif (!forceSolid && shape.props.dash === 'draw') {\n\t\treturn (\n\t\t\t<>\n\t\t\t\t{shape.props.isClosed && shape.props.fill && allPointsFromSegments.length > 1 ? (\n\t\t\t\t\t<ShapeFill\n\t\t\t\t\t\td={getSvgPathFromStrokePoints(\n\t\t\t\t\t\t\tgetStrokePoints(allPointsFromSegments, options),\n\t\t\t\t\t\t\tshape.props.isClosed\n\t\t\t\t\t\t)}\n\t\t\t\t\t\ttheme={theme}\n\t\t\t\t\t\tcolor={shape.props.color}\n\t\t\t\t\t\tfill={shape.props.isClosed ? shape.props.fill : 'none'}\n\t\t\t\t\t\tscale={shape.props.scale}\n\t\t\t\t\t/>\n\t\t\t\t) : null}\n\t\t\t\t<path\n\t\t\t\t\td={svgInk(allPointsFromSegments, options)}\n\t\t\t\t\tstrokeLinecap=\"round\"\n\t\t\t\t\tfill={getColorValue(theme, shape.props.color, 'solid')}\n\t\t\t\t/>\n\t\t\t</>\n\t\t)\n\t}\n\n\tconst strokePoints = getStrokePoints(allPointsFromSegments, options)\n\tconst isDot = strokePoints.length < 2\n\tconst solidStrokePath = isDot\n\t\t? getDot(allPointsFromSegments[0], 0)\n\t\t: getSvgPathFromStrokePoints(strokePoints, shape.props.isClosed)\n\n\treturn (\n\t\t<>\n\t\t\t<ShapeFill\n\t\t\t\td={solidStrokePath}\n\t\t\t\ttheme={theme}\n\t\t\t\tcolor={shape.props.color}\n\t\t\t\tfill={isDot || shape.props.isClosed ? shape.props.fill : 'none'}\n\t\t\t\tscale={shape.props.scale}\n\t\t\t/>\n\t\t\t<path\n\t\t\t\td={solidStrokePath}\n\t\t\t\tstrokeLinecap=\"round\"\n\t\t\t\tfill={isDot ? getColorValue(theme, shape.props.color, 'solid') : 'none'}\n\t\t\t\tstroke={getColorValue(theme, shape.props.color, 'solid')}\n\t\t\t\tstrokeWidth={sw}\n\t\t\t\tstrokeDasharray={isDot ? 'none' : getDrawShapeStrokeDashArray(shape, sw, dotAdjustment)}\n\t\t\t\tstrokeDashoffset=\"0\"\n\t\t\t/>\n\t\t</>\n\t)\n}\n"],
+  "mappings": "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",
   "names": []
 }

package/dist-esm/lib/shapes/embed/EmbedShapeUtil.mjs

@@ -108,7 +108,7 @@ class EmbedShapeUtil extends BaseBoxShapeUtil {
             border: 0,
             boxShadow: getRotatedBoxShadow(pageRotation),
             borderRadius: embedInfo?.definition.overrideOutlineRadius ?? 8,
-            background: embedInfo?.definition.backgroundColor ?? "var(--color-background)",
+            background: embedInfo?.definition.backgroundColor ?? "var(--tl-color-background)",
             width: w,
             height: h
           }

package/dist-esm/lib/shapes/embed/EmbedShapeUtil.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/lib/shapes/embed/EmbedShapeUtil.tsx"],
-  "sourcesContent": ["/* eslint-disable react-hooks/rules-of-hooks */\n\nimport {\n\tBaseBoxShapeUtil,\n\tHTMLContainer,\n\tTLEmbedShape,\n\tTLEmbedShapeProps,\n\tTLResizeInfo,\n\tembedShapeMigrations,\n\tembedShapeProps,\n\tlerp,\n\tresizeBox,\n\ttoDomPrecision,\n\tuseIsEditing,\n\tuseSvgExportContext,\n\tuseValue,\n} from '@tldraw/editor'\n\nimport {\n\tDEFAULT_EMBED_DEFINITIONS,\n\tEmbedDefinition,\n\tTLEmbedDefinition,\n\tTLEmbedShapePermissions,\n\tembedShapePermissionDefaults,\n} from '../../defaultEmbedDefinitions'\nimport { TLEmbedResult, getEmbedInfo } from '../../utils/embeds/embeds'\nimport { getRotatedBoxShadow } from '../shared/rotated-box-shadow'\n\nconst getSandboxPermissions = (permissions: TLEmbedShapePermissions) => {\n\treturn Object.entries(permissions)\n\t\t.filter(([_perm, isEnabled]) => isEnabled)\n\t\t.map(([perm]) => perm)\n\t\t.join(' ')\n}\n\n/** @public */\nexport class EmbedShapeUtil extends BaseBoxShapeUtil<TLEmbedShape> {\n\tstatic override type = 'embed' as const\n\tstatic override props = embedShapeProps\n\tstatic override migrations = embedShapeMigrations\n\tprivate static embedDefinitions: readonly EmbedDefinition[] = DEFAULT_EMBED_DEFINITIONS\n\n\tstatic setEmbedDefinitions(embedDefinitions: readonly TLEmbedDefinition[]) {\n\t\tEmbedShapeUtil.embedDefinitions = embedDefinitions\n\t}\n\n\tgetEmbedDefinitions(): readonly TLEmbedDefinition[] {\n\t\treturn EmbedShapeUtil.embedDefinitions\n\t}\n\n\tgetEmbedDefinition(url: string): TLEmbedResult {\n\t\treturn getEmbedInfo(EmbedShapeUtil.embedDefinitions, url)\n\t}\n\n\toverride getText(shape: TLEmbedShape) {\n\t\treturn shape.props.url\n\t}\n\n\toverride getAriaDescriptor(shape: TLEmbedShape) {\n\t\tconst embedInfo = this.getEmbedDefinition(shape.props.url)\n\t\treturn embedInfo?.definition.title\n\t}\n\n\toverride hideSelectionBoundsFg(shape: TLEmbedShape) {\n\t\treturn !this.canResize(shape)\n\t}\n\toverride canEdit() {\n\t\treturn true\n\t}\n\toverride canResize(shape: TLEmbedShape) {\n\t\treturn !!this.getEmbedDefinition(shape.props.url)?.definition?.doesResize\n\t}\n\toverride canEditInReadonly() {\n\t\treturn true\n\t}\n\n\toverride getDefaultProps(): TLEmbedShape['props'] {\n\t\treturn {\n\t\t\tw: 300,\n\t\t\th: 300,\n\t\t\turl: '',\n\t\t}\n\t}\n\n\toverride isAspectRatioLocked(shape: TLEmbedShape) {\n\t\tconst embedInfo = this.getEmbedDefinition(shape.props.url)\n\t\treturn embedInfo?.definition.isAspectRatioLocked ?? false\n\t}\n\n\toverride onResize(shape: TLEmbedShape, info: TLResizeInfo<TLEmbedShape>) {\n\t\tconst isAspectRatioLocked = this.isAspectRatioLocked(shape)\n\t\tconst embedInfo = this.getEmbedDefinition(shape.props.url)\n\t\tlet minWidth = embedInfo?.definition.minWidth ?? 200\n\t\tlet minHeight = embedInfo?.definition.minHeight ?? 200\n\t\tif (isAspectRatioLocked) {\n\t\t\t// Enforce aspect ratio\n\t\t\t// Neither the width or height can be less than 200\n\t\t\tconst aspectRatio = shape.props.w / shape.props.h\n\t\t\tif (aspectRatio > 1) {\n\t\t\t\t// Landscape\n\t\t\t\tminWidth *= aspectRatio\n\t\t\t} else {\n\t\t\t\t// Portrait\n\t\t\t\tminHeight /= aspectRatio\n\t\t\t}\n\t\t}\n\n\t\treturn resizeBox(shape, info, { minWidth, minHeight })\n\t}\n\n\toverride component(shape: TLEmbedShape) {\n\t\tconst svgExport = useSvgExportContext()\n\t\tconst { w, h, url } = shape.props\n\t\tconst isEditing = useIsEditing(shape.id)\n\n\t\tconst embedInfo = this.getEmbedDefinition(url)\n\n\t\tconst isHoveringWhileEditingSameShape = useValue(\n\t\t\t'is hovering',\n\t\t\t() => {\n\t\t\t\tconst { editingShapeId, hoveredShapeId } = this.editor.getCurrentPageState()\n\n\t\t\t\tif (editingShapeId && hoveredShapeId !== editingShapeId) {\n\t\t\t\t\tconst editingShape = this.editor.getShape(editingShapeId)\n\t\t\t\t\tif (editingShape && this.editor.isShapeOfType<TLEmbedShape>(editingShape, 'embed')) {\n\t\t\t\t\t\treturn true\n\t\t\t\t\t}\n\t\t\t\t}\n\n\t\t\t\treturn false\n\t\t\t},\n\t\t\t[]\n\t\t)\n\n\t\tconst pageRotation = this.editor.getShapePageTransform(shape)!.rotation()\n\n\t\tif (svgExport) {\n\t\t\t// for SVG exports, we show a blank embed\n\t\t\treturn (\n\t\t\t\t<HTMLContainer className=\"tl-embed-container\" id={shape.id}>\n\t\t\t\t\t<div\n\t\t\t\t\t\tclassName=\"tl-embed\"\n\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\tborder: 0,\n\t\t\t\t\t\t\tboxShadow: getRotatedBoxShadow(pageRotation),\n\t\t\t\t\t\t\tborderRadius: embedInfo?.definition.overrideOutlineRadius ?? 8,\n\t\t\t\t\t\t\tbackground: embedInfo?.definition.backgroundColor ?? 'var(--color-background)',\n\t\t\t\t\t\t\twidth: w,\n\t\t\t\t\t\t\theight: h,\n\t\t\t\t\t\t}}\n\t\t\t\t\t/>\n\t\t\t\t</HTMLContainer>\n\t\t\t)\n\t\t}\n\n\t\tconst isInteractive = isEditing || isHoveringWhileEditingSameShape\n\n\t\t// Prevent nested embedding of tldraw\n\t\tconst isIframe =\n\t\t\ttypeof window !== 'undefined' && (window !== window.top || window.self !== window.parent)\n\t\tif (isIframe && embedInfo?.definition.type === 'tldraw') return null\n\n\t\tif (embedInfo?.definition.type === 'github_gist') {\n\t\t\tconst idFromGistUrl = embedInfo.url.split('/').pop()\n\t\t\tif (!idFromGistUrl) throw Error('No gist id!')\n\n\t\t\treturn (\n\t\t\t\t<HTMLContainer className=\"tl-embed-container\" id={shape.id}>\n\t\t\t\t\t<Gist\n\t\t\t\t\t\tid={idFromGistUrl}\n\t\t\t\t\t\twidth={toDomPrecision(w)!}\n\t\t\t\t\t\theight={toDomPrecision(h)!}\n\t\t\t\t\t\tisInteractive={isInteractive}\n\t\t\t\t\t\tpageRotation={pageRotation}\n\t\t\t\t\t/>\n\t\t\t\t</HTMLContainer>\n\t\t\t)\n\t\t}\n\n\t\tconst sandbox = getSandboxPermissions({\n\t\t\t...embedShapePermissionDefaults,\n\t\t\t...(embedInfo?.definition.overridePermissions ?? {}),\n\t\t})\n\n\t\treturn (\n\t\t\t<HTMLContainer className=\"tl-embed-container\" id={shape.id}>\n\t\t\t\t{embedInfo?.definition ? (\n\t\t\t\t\t<iframe\n\t\t\t\t\t\tclassName=\"tl-embed\"\n\t\t\t\t\t\tsandbox={sandbox}\n\t\t\t\t\t\tsrc={embedInfo.embedUrl}\n\t\t\t\t\t\twidth={toDomPrecision(w)}\n\t\t\t\t\t\theight={toDomPrecision(h)}\n\t\t\t\t\t\tdraggable={false}\n\t\t\t\t\t\t// eslint-disable-next-line @typescript-eslint/no-deprecated\n\t\t\t\t\t\tframeBorder=\"0\"\n\t\t\t\t\t\treferrerPolicy=\"no-referrer-when-downgrade\"\n\t\t\t\t\t\ttabIndex={isEditing ? 0 : -1}\n\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\tborder: 0,\n\t\t\t\t\t\t\tpointerEvents: isInteractive ? 'auto' : 'none',\n\t\t\t\t\t\t\t// Fix for safari <https://stackoverflow.com/a/49150908>\n\t\t\t\t\t\t\tzIndex: isInteractive ? '' : '-1',\n\t\t\t\t\t\t\tboxShadow: getRotatedBoxShadow(pageRotation),\n\t\t\t\t\t\t\tborderRadius: embedInfo?.definition.overrideOutlineRadius ?? 8,\n\t\t\t\t\t\t\tbackground: embedInfo?.definition.backgroundColor,\n\t\t\t\t\t\t}}\n\t\t\t\t\t/>\n\t\t\t\t) : null}\n\t\t\t</HTMLContainer>\n\t\t)\n\t}\n\n\toverride indicator(shape: TLEmbedShape) {\n\t\tconst embedInfo = this.getEmbedDefinition(shape.props.url)\n\t\treturn (\n\t\t\t<rect\n\t\t\t\twidth={toDomPrecision(shape.props.w)}\n\t\t\t\theight={toDomPrecision(shape.props.h)}\n\t\t\t\trx={embedInfo?.definition.overrideOutlineRadius ?? 8}\n\t\t\t\try={embedInfo?.definition.overrideOutlineRadius ?? 8}\n\t\t\t/>\n\t\t)\n\t}\n\toverride getInterpolatedProps(\n\t\tstartShape: TLEmbedShape,\n\t\tendShape: TLEmbedShape,\n\t\tt: number\n\t): TLEmbedShapeProps {\n\t\treturn {\n\t\t\t...(t > 0.5 ? endShape.props : startShape.props),\n\t\t\tw: lerp(startShape.props.w, endShape.props.w, t),\n\t\t\th: lerp(startShape.props.h, endShape.props.h, t),\n\t\t}\n\t}\n}\n\nfunction Gist({\n\tid,\n\tisInteractive,\n\twidth,\n\theight,\n\tstyle,\n\tpageRotation,\n}: {\n\tid: string\n\tisInteractive: boolean\n\twidth: number\n\theight: number\n\tpageRotation: number\n\tstyle?: React.CSSProperties\n}) {\n\t// Security warning:\n\t// Gists allow adding .json extensions to the URL which return JSONP.\n\t// Furthermore, the JSONP can include callbacks that execute arbitrary JavaScript.\n\t// It _is_ sandboxed by the iframe but we still want to disable it nonetheless.\n\t// We restrict the id to only allow hexdecimal characters to prevent this.\n\t// Read more:\n\t//   https://github.com/bhaveshk90/Content-Security-Policy-CSP-Bypass-Techniques\n\t//   https://github.com/renniepak/CSPBypass\n\tif (!id.match(/^[0-9a-f]+$/)) throw Error('No gist id!')\n\n\treturn (\n\t\t<iframe\n\t\t\tclassName=\"tl-embed\"\n\t\t\tdraggable={false}\n\t\t\twidth={toDomPrecision(width)}\n\t\t\theight={toDomPrecision(height)}\n\t\t\t// eslint-disable-next-line @typescript-eslint/no-deprecated\n\t\t\tframeBorder=\"0\"\n\t\t\t// eslint-disable-next-line @typescript-eslint/no-deprecated\n\t\t\tscrolling=\"no\"\n\t\t\treferrerPolicy=\"no-referrer-when-downgrade\"\n\t\t\ttabIndex={isInteractive ? 0 : -1}\n\t\t\tstyle={{\n\t\t\t\t...style,\n\t\t\t\tpointerEvents: isInteractive ? 'all' : 'none',\n\t\t\t\t// Fix for safari <https://stackoverflow.com/a/49150908>\n\t\t\t\tzIndex: isInteractive ? '' : '-1',\n\t\t\t\tboxShadow: getRotatedBoxShadow(pageRotation),\n\t\t\t}}\n\t\t\tsrcDoc={`\n\t\t\t<html>\n\t\t\t\t<head>\n\t\t\t\t\t<base target=\"_blank\">\n\t\t\t\t</head>\n\t\t\t\t<body>\n\t\t\t\t\t<script src=${`https://gist.github.com/${id}.js`}></script>\n\t\t\t\t\t<style type=\"text/css\">\n\t\t\t\t\t\t* { margin: 0px; }\n\t\t\t\t\t\ttable { height: 100%; background-color: red; }\n\t\t\t\t\t\t.gist { background-color: none; height: 100%;  }\n\t\t\t\t\t\t.gist .gist-file { height: calc(100vh - 2px); padding: 0px; display: grid; grid-template-rows: 1fr auto; }\n\t\t\t\t\t</style>\n\t\t\t\t</body>\n\t\t\t</html>`}\n\t\t/>\n\t)\n}\n"],
+  "sourcesContent": ["/* eslint-disable react-hooks/rules-of-hooks */\n\nimport {\n\tBaseBoxShapeUtil,\n\tHTMLContainer,\n\tTLEmbedShape,\n\tTLEmbedShapeProps,\n\tTLResizeInfo,\n\tembedShapeMigrations,\n\tembedShapeProps,\n\tlerp,\n\tresizeBox,\n\ttoDomPrecision,\n\tuseIsEditing,\n\tuseSvgExportContext,\n\tuseValue,\n} from '@tldraw/editor'\n\nimport {\n\tDEFAULT_EMBED_DEFINITIONS,\n\tEmbedDefinition,\n\tTLEmbedDefinition,\n\tTLEmbedShapePermissions,\n\tembedShapePermissionDefaults,\n} from '../../defaultEmbedDefinitions'\nimport { TLEmbedResult, getEmbedInfo } from '../../utils/embeds/embeds'\nimport { getRotatedBoxShadow } from '../shared/rotated-box-shadow'\n\nconst getSandboxPermissions = (permissions: TLEmbedShapePermissions) => {\n\treturn Object.entries(permissions)\n\t\t.filter(([_perm, isEnabled]) => isEnabled)\n\t\t.map(([perm]) => perm)\n\t\t.join(' ')\n}\n\n/** @public */\nexport class EmbedShapeUtil extends BaseBoxShapeUtil<TLEmbedShape> {\n\tstatic override type = 'embed' as const\n\tstatic override props = embedShapeProps\n\tstatic override migrations = embedShapeMigrations\n\tprivate static embedDefinitions: readonly EmbedDefinition[] = DEFAULT_EMBED_DEFINITIONS\n\n\tstatic setEmbedDefinitions(embedDefinitions: readonly TLEmbedDefinition[]) {\n\t\tEmbedShapeUtil.embedDefinitions = embedDefinitions\n\t}\n\n\tgetEmbedDefinitions(): readonly TLEmbedDefinition[] {\n\t\treturn EmbedShapeUtil.embedDefinitions\n\t}\n\n\tgetEmbedDefinition(url: string): TLEmbedResult {\n\t\treturn getEmbedInfo(EmbedShapeUtil.embedDefinitions, url)\n\t}\n\n\toverride getText(shape: TLEmbedShape) {\n\t\treturn shape.props.url\n\t}\n\n\toverride getAriaDescriptor(shape: TLEmbedShape) {\n\t\tconst embedInfo = this.getEmbedDefinition(shape.props.url)\n\t\treturn embedInfo?.definition.title\n\t}\n\n\toverride hideSelectionBoundsFg(shape: TLEmbedShape) {\n\t\treturn !this.canResize(shape)\n\t}\n\toverride canEdit() {\n\t\treturn true\n\t}\n\toverride canResize(shape: TLEmbedShape) {\n\t\treturn !!this.getEmbedDefinition(shape.props.url)?.definition?.doesResize\n\t}\n\toverride canEditInReadonly() {\n\t\treturn true\n\t}\n\n\toverride getDefaultProps(): TLEmbedShape['props'] {\n\t\treturn {\n\t\t\tw: 300,\n\t\t\th: 300,\n\t\t\turl: '',\n\t\t}\n\t}\n\n\toverride isAspectRatioLocked(shape: TLEmbedShape) {\n\t\tconst embedInfo = this.getEmbedDefinition(shape.props.url)\n\t\treturn embedInfo?.definition.isAspectRatioLocked ?? false\n\t}\n\n\toverride onResize(shape: TLEmbedShape, info: TLResizeInfo<TLEmbedShape>) {\n\t\tconst isAspectRatioLocked = this.isAspectRatioLocked(shape)\n\t\tconst embedInfo = this.getEmbedDefinition(shape.props.url)\n\t\tlet minWidth = embedInfo?.definition.minWidth ?? 200\n\t\tlet minHeight = embedInfo?.definition.minHeight ?? 200\n\t\tif (isAspectRatioLocked) {\n\t\t\t// Enforce aspect ratio\n\t\t\t// Neither the width or height can be less than 200\n\t\t\tconst aspectRatio = shape.props.w / shape.props.h\n\t\t\tif (aspectRatio > 1) {\n\t\t\t\t// Landscape\n\t\t\t\tminWidth *= aspectRatio\n\t\t\t} else {\n\t\t\t\t// Portrait\n\t\t\t\tminHeight /= aspectRatio\n\t\t\t}\n\t\t}\n\n\t\treturn resizeBox(shape, info, { minWidth, minHeight })\n\t}\n\n\toverride component(shape: TLEmbedShape) {\n\t\tconst svgExport = useSvgExportContext()\n\t\tconst { w, h, url } = shape.props\n\t\tconst isEditing = useIsEditing(shape.id)\n\n\t\tconst embedInfo = this.getEmbedDefinition(url)\n\n\t\tconst isHoveringWhileEditingSameShape = useValue(\n\t\t\t'is hovering',\n\t\t\t() => {\n\t\t\t\tconst { editingShapeId, hoveredShapeId } = this.editor.getCurrentPageState()\n\n\t\t\t\tif (editingShapeId && hoveredShapeId !== editingShapeId) {\n\t\t\t\t\tconst editingShape = this.editor.getShape(editingShapeId)\n\t\t\t\t\tif (editingShape && this.editor.isShapeOfType<TLEmbedShape>(editingShape, 'embed')) {\n\t\t\t\t\t\treturn true\n\t\t\t\t\t}\n\t\t\t\t}\n\n\t\t\t\treturn false\n\t\t\t},\n\t\t\t[]\n\t\t)\n\n\t\tconst pageRotation = this.editor.getShapePageTransform(shape)!.rotation()\n\n\t\tif (svgExport) {\n\t\t\t// for SVG exports, we show a blank embed\n\t\t\treturn (\n\t\t\t\t<HTMLContainer className=\"tl-embed-container\" id={shape.id}>\n\t\t\t\t\t<div\n\t\t\t\t\t\tclassName=\"tl-embed\"\n\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\tborder: 0,\n\t\t\t\t\t\t\tboxShadow: getRotatedBoxShadow(pageRotation),\n\t\t\t\t\t\t\tborderRadius: embedInfo?.definition.overrideOutlineRadius ?? 8,\n\t\t\t\t\t\t\tbackground: embedInfo?.definition.backgroundColor ?? 'var(--tl-color-background)',\n\t\t\t\t\t\t\twidth: w,\n\t\t\t\t\t\t\theight: h,\n\t\t\t\t\t\t}}\n\t\t\t\t\t/>\n\t\t\t\t</HTMLContainer>\n\t\t\t)\n\t\t}\n\n\t\tconst isInteractive = isEditing || isHoveringWhileEditingSameShape\n\n\t\t// Prevent nested embedding of tldraw\n\t\tconst isIframe =\n\t\t\ttypeof window !== 'undefined' && (window !== window.top || window.self !== window.parent)\n\t\tif (isIframe && embedInfo?.definition.type === 'tldraw') return null\n\n\t\tif (embedInfo?.definition.type === 'github_gist') {\n\t\t\tconst idFromGistUrl = embedInfo.url.split('/').pop()\n\t\t\tif (!idFromGistUrl) throw Error('No gist id!')\n\n\t\t\treturn (\n\t\t\t\t<HTMLContainer className=\"tl-embed-container\" id={shape.id}>\n\t\t\t\t\t<Gist\n\t\t\t\t\t\tid={idFromGistUrl}\n\t\t\t\t\t\twidth={toDomPrecision(w)!}\n\t\t\t\t\t\theight={toDomPrecision(h)!}\n\t\t\t\t\t\tisInteractive={isInteractive}\n\t\t\t\t\t\tpageRotation={pageRotation}\n\t\t\t\t\t/>\n\t\t\t\t</HTMLContainer>\n\t\t\t)\n\t\t}\n\n\t\tconst sandbox = getSandboxPermissions({\n\t\t\t...embedShapePermissionDefaults,\n\t\t\t...(embedInfo?.definition.overridePermissions ?? {}),\n\t\t})\n\n\t\treturn (\n\t\t\t<HTMLContainer className=\"tl-embed-container\" id={shape.id}>\n\t\t\t\t{embedInfo?.definition ? (\n\t\t\t\t\t<iframe\n\t\t\t\t\t\tclassName=\"tl-embed\"\n\t\t\t\t\t\tsandbox={sandbox}\n\t\t\t\t\t\tsrc={embedInfo.embedUrl}\n\t\t\t\t\t\twidth={toDomPrecision(w)}\n\t\t\t\t\t\theight={toDomPrecision(h)}\n\t\t\t\t\t\tdraggable={false}\n\t\t\t\t\t\t// eslint-disable-next-line @typescript-eslint/no-deprecated\n\t\t\t\t\t\tframeBorder=\"0\"\n\t\t\t\t\t\treferrerPolicy=\"no-referrer-when-downgrade\"\n\t\t\t\t\t\ttabIndex={isEditing ? 0 : -1}\n\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\tborder: 0,\n\t\t\t\t\t\t\tpointerEvents: isInteractive ? 'auto' : 'none',\n\t\t\t\t\t\t\t// Fix for safari <https://stackoverflow.com/a/49150908>\n\t\t\t\t\t\t\tzIndex: isInteractive ? '' : '-1',\n\t\t\t\t\t\t\tboxShadow: getRotatedBoxShadow(pageRotation),\n\t\t\t\t\t\t\tborderRadius: embedInfo?.definition.overrideOutlineRadius ?? 8,\n\t\t\t\t\t\t\tbackground: embedInfo?.definition.backgroundColor,\n\t\t\t\t\t\t}}\n\t\t\t\t\t/>\n\t\t\t\t) : null}\n\t\t\t</HTMLContainer>\n\t\t)\n\t}\n\n\toverride indicator(shape: TLEmbedShape) {\n\t\tconst embedInfo = this.getEmbedDefinition(shape.props.url)\n\t\treturn (\n\t\t\t<rect\n\t\t\t\twidth={toDomPrecision(shape.props.w)}\n\t\t\t\theight={toDomPrecision(shape.props.h)}\n\t\t\t\trx={embedInfo?.definition.overrideOutlineRadius ?? 8}\n\t\t\t\try={embedInfo?.definition.overrideOutlineRadius ?? 8}\n\t\t\t/>\n\t\t)\n\t}\n\toverride getInterpolatedProps(\n\t\tstartShape: TLEmbedShape,\n\t\tendShape: TLEmbedShape,\n\t\tt: number\n\t): TLEmbedShapeProps {\n\t\treturn {\n\t\t\t...(t > 0.5 ? endShape.props : startShape.props),\n\t\t\tw: lerp(startShape.props.w, endShape.props.w, t),\n\t\t\th: lerp(startShape.props.h, endShape.props.h, t),\n\t\t}\n\t}\n}\n\nfunction Gist({\n\tid,\n\tisInteractive,\n\twidth,\n\theight,\n\tstyle,\n\tpageRotation,\n}: {\n\tid: string\n\tisInteractive: boolean\n\twidth: number\n\theight: number\n\tpageRotation: number\n\tstyle?: React.CSSProperties\n}) {\n\t// Security warning:\n\t// Gists allow adding .json extensions to the URL which return JSONP.\n\t// Furthermore, the JSONP can include callbacks that execute arbitrary JavaScript.\n\t// It _is_ sandboxed by the iframe but we still want to disable it nonetheless.\n\t// We restrict the id to only allow hexdecimal characters to prevent this.\n\t// Read more:\n\t//   https://github.com/bhaveshk90/Content-Security-Policy-CSP-Bypass-Techniques\n\t//   https://github.com/renniepak/CSPBypass\n\tif (!id.match(/^[0-9a-f]+$/)) throw Error('No gist id!')\n\n\treturn (\n\t\t<iframe\n\t\t\tclassName=\"tl-embed\"\n\t\t\tdraggable={false}\n\t\t\twidth={toDomPrecision(width)}\n\t\t\theight={toDomPrecision(height)}\n\t\t\t// eslint-disable-next-line @typescript-eslint/no-deprecated\n\t\t\tframeBorder=\"0\"\n\t\t\t// eslint-disable-next-line @typescript-eslint/no-deprecated\n\t\t\tscrolling=\"no\"\n\t\t\treferrerPolicy=\"no-referrer-when-downgrade\"\n\t\t\ttabIndex={isInteractive ? 0 : -1}\n\t\t\tstyle={{\n\t\t\t\t...style,\n\t\t\t\tpointerEvents: isInteractive ? 'all' : 'none',\n\t\t\t\t// Fix for safari <https://stackoverflow.com/a/49150908>\n\t\t\t\tzIndex: isInteractive ? '' : '-1',\n\t\t\t\tboxShadow: getRotatedBoxShadow(pageRotation),\n\t\t\t}}\n\t\t\tsrcDoc={`\n\t\t\t<html>\n\t\t\t\t<head>\n\t\t\t\t\t<base target=\"_blank\">\n\t\t\t\t</head>\n\t\t\t\t<body>\n\t\t\t\t\t<script src=${`https://gist.github.com/${id}.js`}></script>\n\t\t\t\t\t<style type=\"text/css\">\n\t\t\t\t\t\t* { margin: 0px; }\n\t\t\t\t\t\ttable { height: 100%; background-color: red; }\n\t\t\t\t\t\t.gist { background-color: none; height: 100%;  }\n\t\t\t\t\t\t.gist .gist-file { height: calc(100vh - 2px); padding: 0px; display: grid; grid-template-rows: 1fr auto; }\n\t\t\t\t\t</style>\n\t\t\t\t</body>\n\t\t\t</html>`}\n\t\t/>\n\t)\n}\n"],
   "mappings": "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",
   "names": []
 }

package/dist-esm/lib/shapes/frame/FrameShapeUtil.mjs

@@ -9,6 +9,7 @@ import {
   compact,
   frameShapeMigrations,
   frameShapeProps,
+  getColorValue,
   getDefaultColorTheme,
   lerp,
   resizeBox,
@@ -67,6 +68,9 @@ class FrameShapeUtil extends BaseBoxShapeUtil {
   canResizeChildren() {
     return false;
   }
+  isExportBoundsContainer() {
+    return true;
+  }
   getDefaultProps() {
     return { w: 160 * 2, h: 90 * 2, name: "", color: "black" };
   }
@@ -151,12 +155,12 @@ class FrameShapeUtil extends BaseBoxShapeUtil {
       [shape.id]
     );
     const showFrameColors = this.options.showColors;
-    const color = theme[shape.props.color];
-    const frameFill = showFrameColors ? color.frame.fill : theme.black.frame.fill;
-    const frameStroke = showFrameColors ? color.frame.stroke : theme.black.frame.stroke;
-    const frameHeadingStroke = showFrameColors ? color.frame.headingStroke : theme.background;
-    const frameHeadingFill = showFrameColors ? color.frame.headingFill : theme.background;
-    const frameHeadingText = showFrameColors ? color.frame.text : theme.text;
+    const colorToUse = showFrameColors ? shape.props.color : "black";
+    const frameFill = getColorValue(theme, colorToUse, "frameFill");
+    const frameStroke = getColorValue(theme, colorToUse, "frameStroke");
+    const frameHeadingStroke = showFrameColors ? getColorValue(theme, colorToUse, "frameHeadingStroke") : theme.background;
+    const frameHeadingFill = showFrameColors ? getColorValue(theme, colorToUse, "frameHeadingFill") : theme.background;
+    const frameHeadingText = getColorValue(theme, colorToUse, "frameText");
     return /* @__PURE__ */ jsxs(Fragment, { children: [
       /* @__PURE__ */ jsx(SVGContainer, { children: /* @__PURE__ */ jsx(
         "rect",
@@ -199,12 +203,12 @@ class FrameShapeUtil extends BaseBoxShapeUtil {
     const spans = this.editor.textMeasure.measureTextSpans(frameTitle, opts);
     const text = createTextJsxFromSpans(this.editor, spans, opts);
     const showFrameColors = this.options.showColors;
-    const color = theme[shape.props.color];
-    const frameFill = showFrameColors ? color.frame.fill : theme.black.frame.fill;
-    const frameStroke = showFrameColors ? color.frame.stroke : theme.black.frame.stroke;
-    const frameHeadingStroke = showFrameColors ? color.frame.headingStroke : theme.background;
-    const frameHeadingFill = showFrameColors ? color.frame.headingFill : theme.background;
-    const frameHeadingText = showFrameColors ? color.frame.text : theme.text;
+    const colorToUse = showFrameColors ? shape.props.color : "black";
+    const frameFill = getColorValue(theme, colorToUse, "frameFill");
+    const frameStroke = getColorValue(theme, colorToUse, "frameStroke");
+    const frameHeadingStroke = showFrameColors ? getColorValue(theme, colorToUse, "frameHeadingStroke") : theme.background;
+    const frameHeadingFill = showFrameColors ? getColorValue(theme, colorToUse, "frameHeadingFill") : theme.background;
+    const frameHeadingText = getColorValue(theme, colorToUse, "frameText");
     return /* @__PURE__ */ jsxs(Fragment, { children: [
       /* @__PURE__ */ jsx(
         "rect",
@@ -250,6 +254,9 @@ class FrameShapeUtil extends BaseBoxShapeUtil {
   providesBackgroundForChildren() {
     return true;
   }
+  getClipPath(shape) {
+    return this.editor.getShapeGeometry(shape.id).vertices;
+  }
   canReceiveNewChildrenOfType(shape) {
     return !shape.isLocked;
   }