npm - tldraw - Versions diffs - 3.16.0-canary.0ff72188cd53 → 3.16.0-canary.13ee933ed97f - Mend

tldraw 3.16.0-canary.0ff72188cd53 → 3.16.0-canary.13ee933ed97f

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (110) hide show

package/dist-cjs/lib/shapes/frame/components/FrameLabelInput.js.map CHANGED Viewed

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../src/lib/shapes/frame/components/FrameLabelInput.tsx"],
-  "sourcesContent": ["import { TLFrameShape, TLShapeId, stopEventPropagation, useEditor } from '@tldraw/editor'\nimport { forwardRef, useCallback } from 'react'\nimport { defaultEmptyAs } from '../FrameShapeUtil'\n\nexport const FrameLabelInput = forwardRef<\n\tHTMLInputElement,\n\t{ id: TLShapeId; name: string; isEditing: boolean }\n>(({ id, name, isEditing }, ref) => {\n\tconst editor = useEditor()\n\n\tconst handleKeyDown = useCallback(\n\t\t(e: React.KeyboardEvent<HTMLInputElement>) => {\n\t\t\tif (e.key === 'Enter' && !e.nativeEvent.isComposing) {\n\t\t\t\t// need to prevent the enter keydown making it's way up to the Idle state\n\t\t\t\t// and sending us back into edit mode\n\t\t\t\tstopEventPropagation(e)\n\t\t\t\te.currentTarget.blur()\n\t\t\t\teditor.setEditingShape(null)\n\t\t\t}\n\t\t},\n\t\t[editor]\n\t)\n\n\tconst handleBlur = useCallback(\n\t\t(e: React.FocusEvent<HTMLInputElement>) => {\n\t\t\tconst shape = editor.getShape<TLFrameShape>(id)\n\t\t\tif (!shape) return\n\n\t\t\tconst name = shape.props.name\n\t\t\tconst value = e.currentTarget.value.trim()\n\t\t\tif (name === value) return\n\n\t\t\teditor.updateShapes([\n\t\t\t\t{\n\t\t\t\t\tid,\n\t\t\t\t\ttype: 'frame',\n\t\t\t\t\tprops: { name: value },\n\t\t\t\t},\n\t\t\t])\n\t\t},\n\t\t[id, editor]\n\t)\n\n\tconst handleChange = useCallback(\n\t\t(e: React.ChangeEvent<HTMLInputElement>) => {\n\t\t\tconst shape = editor.getShape<TLFrameShape>(id)\n\t\t\tif (!shape) return\n\n\t\t\tconst name = shape.props.name\n\t\t\tconst value = e.currentTarget.value\n\t\t\tif (name === value) return\n\n\t\t\teditor.updateShapes([\n\t\t\t\t{\n\t\t\t\t\tid,\n\t\t\t\t\ttype: 'frame',\n\t\t\t\t\tprops: { name: value },\n\t\t\t\t},\n\t\t\t])\n\t\t},\n\t\t[id, editor]\n\t)\n\n\treturn (\n\t\t<div className={`tl-frame-label ${isEditing ? 'tl-frame-label__editing' : ''}`}>\n\t\t\t<input\n\t\t\t\tclassName=\"tl-frame-name-input\"\n\t\t\t\tref={ref}\n\t\t\t\tdisabled={!isEditing}\n\t\t\t\treadOnly={!isEditing}\n\t\t\t\tstyle={{ display: isEditing ? undefined : 'none' }}\n\t\t\t\tvalue={name}\n\t\t\t\tautoFocus\n\t\t\t\tonKeyDown={handleKeyDown}\n\t\t\t\tonBlur={handleBlur}\n\t\t\t\tonChange={handleChange}\n\t\t\t\tonPointerDown={isEditing ? stopEventPropagation : undefined}\n\t\t\t\tdraggable={false}\n\t\t\t/>\n\t\t\t{defaultEmptyAs(name, 'Frame') + String.fromCharCode(8203)}\n\t\t</div>\n\t)\n})\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAgEE;AAhEF,oBAAyE;AACzE,mBAAwC;AACxC,4BAA+B;AAExB,MAAM,sBAAkB,yBAG7B,CAAC,EAAE,IAAI,MAAM,UAAU,GAAG,QAAQ;AACnC,QAAM,aAAS,yBAAU;AAEzB,QAAM,oBAAgB;AAAA,IACrB,CAAC,MAA6C;AAC7C,UAAI,EAAE,QAAQ,WAAW,CAAC,EAAE,YAAY,aAAa;AAGpD,gDAAqB,CAAC;AACtB,UAAE,cAAc,KAAK;AACrB,eAAO,gBAAgB,IAAI;AAAA,MAC5B;AAAA,IACD;AAAA,IACA,CAAC,MAAM;AAAA,EACR;AAEA,QAAM,iBAAa;AAAA,IAClB,CAAC,MAA0C;AAC1C,YAAM,QAAQ,OAAO,SAAuB,EAAE;AAC9C,UAAI,CAAC,MAAO;AAEZ,YAAMA,QAAO,MAAM,MAAM;AACzB,YAAM,QAAQ,EAAE,cAAc,MAAM,KAAK;AACzC,UAAIA,UAAS,MAAO;AAEpB,aAAO,aAAa;AAAA,QACnB;AAAA,UACC;AAAA,UACA,MAAM;AAAA,UACN,OAAO,EAAE,MAAM,MAAM;AAAA,QACtB;AAAA,MACD,CAAC;AAAA,IACF;AAAA,IACA,CAAC,IAAI,MAAM;AAAA,EACZ;AAEA,QAAM,mBAAe;AAAA,IACpB,CAAC,MAA2C;AAC3C,YAAM,QAAQ,OAAO,SAAuB,EAAE;AAC9C,UAAI,CAAC,MAAO;AAEZ,YAAMA,QAAO,MAAM,MAAM;AACzB,YAAM,QAAQ,EAAE,cAAc;AAC9B,UAAIA,UAAS,MAAO;AAEpB,aAAO,aAAa;AAAA,QACnB;AAAA,UACC;AAAA,UACA,MAAM;AAAA,UACN,OAAO,EAAE,MAAM,MAAM;AAAA,QACtB;AAAA,MACD,CAAC;AAAA,IACF;AAAA,IACA,CAAC,IAAI,MAAM;AAAA,EACZ;AAEA,SACC,6CAAC,SAAI,WAAW,kBAAkB,YAAY,4BAA4B,EAAE,IAC3E;AAAA;AAAA,MAAC;AAAA;AAAA,QACA,WAAU;AAAA,QACV;AAAA,QACA,UAAU,CAAC;AAAA,QACX,UAAU,CAAC;AAAA,QACX,OAAO,EAAE,SAAS,YAAY,SAAY,OAAO;AAAA,QACjD,OAAO;AAAA,QACP,WAAS;AAAA,QACT,WAAW;AAAA,QACX,QAAQ;AAAA,QACR,UAAU;AAAA,QACV,eAAe,YAAY,qCAAuB;AAAA,QAClD,WAAW;AAAA;AAAA,IACZ;AAAA,QACC,sCAAe,MAAM,OAAO,IAAI,OAAO,aAAa,IAAI;AAAA,KAC1D;AAEF,CAAC;",
+  "sourcesContent": ["import { TLFrameShape, TLShapeId, markEventAsHandled, useEditor } from '@tldraw/editor'\nimport { forwardRef, useCallback } from 'react'\nimport { defaultEmptyAs } from '../FrameShapeUtil'\n\nexport const FrameLabelInput = forwardRef<\n\tHTMLInputElement,\n\t{ id: TLShapeId; name: string; isEditing: boolean }\n>(({ id, name, isEditing }, ref) => {\n\tconst editor = useEditor()\n\n\tconst handleKeyDown = useCallback(\n\t\t(e: React.KeyboardEvent<HTMLInputElement>) => {\n\t\t\tif (e.key === 'Enter' && !e.nativeEvent.isComposing) {\n\t\t\t\t// need to prevent the enter keydown making it's way up to the Idle state\n\t\t\t\t// and sending us back into edit mode\n\t\t\t\tmarkEventAsHandled(e)\n\t\t\t\te.currentTarget.blur()\n\t\t\t\teditor.setEditingShape(null)\n\t\t\t}\n\t\t},\n\t\t[editor]\n\t)\n\n\tconst handleBlur = useCallback(\n\t\t(e: React.FocusEvent<HTMLInputElement>) => {\n\t\t\tconst shape = editor.getShape<TLFrameShape>(id)\n\t\t\tif (!shape) return\n\n\t\t\tconst name = shape.props.name\n\t\t\tconst value = e.currentTarget.value.trim()\n\t\t\tif (name === value) return\n\n\t\t\teditor.updateShapes([\n\t\t\t\t{\n\t\t\t\t\tid,\n\t\t\t\t\ttype: 'frame',\n\t\t\t\t\tprops: { name: value },\n\t\t\t\t},\n\t\t\t])\n\t\t},\n\t\t[id, editor]\n\t)\n\n\tconst handleChange = useCallback(\n\t\t(e: React.ChangeEvent<HTMLInputElement>) => {\n\t\t\tconst shape = editor.getShape<TLFrameShape>(id)\n\t\t\tif (!shape) return\n\n\t\t\tconst name = shape.props.name\n\t\t\tconst value = e.currentTarget.value\n\t\t\tif (name === value) return\n\n\t\t\teditor.updateShapes([\n\t\t\t\t{\n\t\t\t\t\tid,\n\t\t\t\t\ttype: 'frame',\n\t\t\t\t\tprops: { name: value },\n\t\t\t\t},\n\t\t\t])\n\t\t},\n\t\t[id, editor]\n\t)\n\n\treturn (\n\t\t<div className={`tl-frame-label ${isEditing ? 'tl-frame-label__editing' : ''}`}>\n\t\t\t<input\n\t\t\t\tclassName=\"tl-frame-name-input\"\n\t\t\t\tref={ref}\n\t\t\t\tdisabled={!isEditing}\n\t\t\t\treadOnly={!isEditing}\n\t\t\t\tstyle={{ display: isEditing ? undefined : 'none' }}\n\t\t\t\tvalue={name}\n\t\t\t\tautoFocus\n\t\t\t\tonKeyDown={handleKeyDown}\n\t\t\t\tonBlur={handleBlur}\n\t\t\t\tonChange={handleChange}\n\t\t\t\tonPointerDown={isEditing ? markEventAsHandled : undefined}\n\t\t\t\tdraggable={false}\n\t\t\t/>\n\t\t\t{defaultEmptyAs(name, 'Frame') + String.fromCharCode(8203)}\n\t\t</div>\n\t)\n})\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAgEE;AAhEF,oBAAuE;AACvE,mBAAwC;AACxC,4BAA+B;AAExB,MAAM,sBAAkB,yBAG7B,CAAC,EAAE,IAAI,MAAM,UAAU,GAAG,QAAQ;AACnC,QAAM,aAAS,yBAAU;AAEzB,QAAM,oBAAgB;AAAA,IACrB,CAAC,MAA6C;AAC7C,UAAI,EAAE,QAAQ,WAAW,CAAC,EAAE,YAAY,aAAa;AAGpD,8CAAmB,CAAC;AACpB,UAAE,cAAc,KAAK;AACrB,eAAO,gBAAgB,IAAI;AAAA,MAC5B;AAAA,IACD;AAAA,IACA,CAAC,MAAM;AAAA,EACR;AAEA,QAAM,iBAAa;AAAA,IAClB,CAAC,MAA0C;AAC1C,YAAM,QAAQ,OAAO,SAAuB,EAAE;AAC9C,UAAI,CAAC,MAAO;AAEZ,YAAMA,QAAO,MAAM,MAAM;AACzB,YAAM,QAAQ,EAAE,cAAc,MAAM,KAAK;AACzC,UAAIA,UAAS,MAAO;AAEpB,aAAO,aAAa;AAAA,QACnB;AAAA,UACC;AAAA,UACA,MAAM;AAAA,UACN,OAAO,EAAE,MAAM,MAAM;AAAA,QACtB;AAAA,MACD,CAAC;AAAA,IACF;AAAA,IACA,CAAC,IAAI,MAAM;AAAA,EACZ;AAEA,QAAM,mBAAe;AAAA,IACpB,CAAC,MAA2C;AAC3C,YAAM,QAAQ,OAAO,SAAuB,EAAE;AAC9C,UAAI,CAAC,MAAO;AAEZ,YAAMA,QAAO,MAAM,MAAM;AACzB,YAAM,QAAQ,EAAE,cAAc;AAC9B,UAAIA,UAAS,MAAO;AAEpB,aAAO,aAAa;AAAA,QACnB;AAAA,UACC;AAAA,UACA,MAAM;AAAA,UACN,OAAO,EAAE,MAAM,MAAM;AAAA,QACtB;AAAA,MACD,CAAC;AAAA,IACF;AAAA,IACA,CAAC,IAAI,MAAM;AAAA,EACZ;AAEA,SACC,6CAAC,SAAI,WAAW,kBAAkB,YAAY,4BAA4B,EAAE,IAC3E;AAAA;AAAA,MAAC;AAAA;AAAA,QACA,WAAU;AAAA,QACV;AAAA,QACA,UAAU,CAAC;AAAA,QACX,UAAU,CAAC;AAAA,QACX,OAAO,EAAE,SAAS,YAAY,SAAY,OAAO;AAAA,QACjD,OAAO;AAAA,QACP,WAAS;AAAA,QACT,WAAW;AAAA,QACX,QAAQ;AAAA,QACR,UAAU;AAAA,QACV,eAAe,YAAY,mCAAqB;AAAA,QAChD,WAAW;AAAA;AAAA,IACZ;AAAA,QACC,sCAAe,MAAM,OAAO,IAAI,OAAO,aAAa,IAAI;AAAA,KAC1D;AAEF,CAAC;",
   "names": ["name"]
 }

package/dist-cjs/lib/shapes/geo/GeoShapeUtil.js CHANGED Viewed

@@ -90,6 +90,7 @@ class GeoShapeUtil extends import_editor.BaseBoxShapeUtil {
           height: unscaledLabelHeight * shape.props.scale,
           isFilled: true,
           isLabel: true,
+          excludeFromShapeBounds: true,
           isEmptyLabel: (0, import_richText.isEmptyRichText)(shape.props.richText)
         })
       ]

package/dist-cjs/lib/shapes/geo/GeoShapeUtil.js.map CHANGED Viewed

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/lib/shapes/geo/GeoShapeUtil.tsx"],
-  "sourcesContent": ["/* eslint-disable react-hooks/rules-of-hooks */\nimport {\n\tBaseBoxShapeUtil,\n\tBox,\n\tEMPTY_ARRAY,\n\tEditor,\n\tGroup2d,\n\tHTMLContainer,\n\tHandleSnapGeometry,\n\tRectangle2d,\n\tSVGContainer,\n\tSvgExportContext,\n\tTLGeoShape,\n\tTLGeoShapeProps,\n\tTLResizeInfo,\n\tTLShapeUtilCanvasSvgDef,\n\tVec,\n\texhaustiveSwitchError,\n\tgeoShapeMigrations,\n\tgeoShapeProps,\n\tgetColorValue,\n\tgetDefaultColorTheme,\n\tgetFontsFromRichText,\n\tisEqual,\n\tlerp,\n\ttoRichText,\n\tuseValue,\n} from '@tldraw/editor'\nimport {\n\tisEmptyRichText,\n\trenderHtmlFromRichTextForMeasurement,\n\trenderPlaintextFromRichText,\n} from '../../utils/text/richText'\nimport { HyperlinkButton } from '../shared/HyperlinkButton'\nimport { RichTextLabel, RichTextSVG } from '../shared/RichTextLabel'\nimport {\n\tFONT_FAMILIES,\n\tLABEL_FONT_SIZES,\n\tLABEL_PADDING,\n\tSTROKE_SIZES,\n\tTEXT_PROPS,\n} from '../shared/default-shape-constants'\nimport { getFillDefForCanvas, getFillDefForExport } from '../shared/defaultStyleDefs'\nimport { useDefaultColorTheme } from '../shared/useDefaultColorTheme'\nimport { useIsReadyForEditing } from '../shared/useEditablePlainText'\nimport { GeoShapeBody } from './components/GeoShapeBody'\nimport { getGeoShapePath } from './getGeoShapePath'\n\nconst MIN_SIZE_WITH_LABEL = 17 * 3\n\n/** @public */\nexport class GeoShapeUtil extends BaseBoxShapeUtil<TLGeoShape> {\n\tstatic override type = 'geo' as const\n\tstatic override props = geoShapeProps\n\tstatic override migrations = geoShapeMigrations\n\n\toverride canEdit() {\n\t\treturn true\n\t}\n\n\toverride getDefaultProps(): TLGeoShape['props'] {\n\t\treturn {\n\t\t\tw: 100,\n\t\t\th: 100,\n\t\t\tgeo: 'rectangle',\n\t\t\tdash: 'draw',\n\t\t\tgrowY: 0,\n\t\t\turl: '',\n\t\t\tscale: 1,\n\n\t\t\t// Text properties\n\t\t\tcolor: 'black',\n\t\t\tlabelColor: 'black',\n\t\t\tfill: 'none',\n\t\t\tsize: 'm',\n\t\t\tfont: 'draw',\n\t\t\talign: 'middle',\n\t\t\tverticalAlign: 'middle',\n\t\t\trichText: toRichText(''),\n\t\t}\n\t}\n\n\toverride getGeometry(shape: TLGeoShape) {\n\t\tconst w = Math.max(1, shape.props.w)\n\t\tconst h = Math.max(1, shape.props.h + shape.props.growY)\n\n\t\tconst path = getGeoShapePath(shape)\n\t\tconst unscaledlabelSize = getUnscaledLabelSize(this.editor, shape)\n\t\t// unscaled w and h\n\t\tconst unscaledW = w / shape.props.scale\n\t\tconst unscaledH = h / shape.props.scale\n\t\tconst unscaledminWidth = Math.min(100, unscaledW / 2)\n\t\tconst unscaledMinHeight = Math.min(\n\t\t\tLABEL_FONT_SIZES[shape.props.size] * TEXT_PROPS.lineHeight + LABEL_PADDING * 2,\n\t\t\tunscaledH / 2\n\t\t)\n\n\t\tconst unscaledLabelWidth = Math.min(\n\t\t\tunscaledW,\n\t\t\tMath.max(unscaledlabelSize.w, Math.min(unscaledminWidth, Math.max(1, unscaledW - 8)))\n\t\t)\n\t\tconst unscaledLabelHeight = Math.min(\n\t\t\tunscaledH,\n\t\t\tMath.max(unscaledlabelSize.h, Math.min(unscaledMinHeight, Math.max(1, unscaledH - 8)))\n\t\t)\n\n\t\t// todo: use centroid for label position\n\n\t\treturn new Group2d({\n\t\t\tchildren: [\n\t\t\t\tpath.toGeometry(),\n\t\t\t\tnew Rectangle2d({\n\t\t\t\t\tx:\n\t\t\t\t\t\tshape.props.align === 'start'\n\t\t\t\t\t\t\t? 0\n\t\t\t\t\t\t\t: shape.props.align === 'end'\n\t\t\t\t\t\t\t\t? (unscaledW - unscaledLabelWidth) * shape.props.scale\n\t\t\t\t\t\t\t\t: ((unscaledW - unscaledLabelWidth) / 2) * shape.props.scale,\n\t\t\t\t\ty:\n\t\t\t\t\t\tshape.props.verticalAlign === 'start'\n\t\t\t\t\t\t\t? 0\n\t\t\t\t\t\t\t: shape.props.verticalAlign === 'end'\n\t\t\t\t\t\t\t\t? (unscaledH - unscaledLabelHeight) * shape.props.scale\n\t\t\t\t\t\t\t\t: ((unscaledH - unscaledLabelHeight) / 2) * shape.props.scale,\n\t\t\t\t\twidth: unscaledLabelWidth * shape.props.scale,\n\t\t\t\t\theight: unscaledLabelHeight * shape.props.scale,\n\t\t\t\t\tisFilled: true,\n\t\t\t\t\tisLabel: true,\n\t\t\t\t\tisEmptyLabel: isEmptyRichText(shape.props.richText),\n\t\t\t\t}),\n\t\t\t],\n\t\t})\n\t}\n\n\toverride getHandleSnapGeometry(shape: TLGeoShape): HandleSnapGeometry {\n\t\tconst geometry = this.getGeometry(shape)\n\t\t// we only want to snap handles to the outline of the shape - not to its label etc.\n\t\tconst outline = geometry.children[0]\n\t\tswitch (shape.props.geo) {\n\t\t\tcase 'arrow-down':\n\t\t\tcase 'arrow-left':\n\t\t\tcase 'arrow-right':\n\t\t\tcase 'arrow-up':\n\t\t\tcase 'check-box':\n\t\t\tcase 'diamond':\n\t\t\tcase 'hexagon':\n\t\t\tcase 'octagon':\n\t\t\tcase 'pentagon':\n\t\t\tcase 'rectangle':\n\t\t\tcase 'rhombus':\n\t\t\tcase 'rhombus-2':\n\t\t\tcase 'star':\n\t\t\tcase 'trapezoid':\n\t\t\tcase 'triangle':\n\t\t\tcase 'x-box':\n\t\t\t\t// poly-line type shapes hand snap points for each vertex & the center\n\t\t\t\treturn { outline: outline, points: [...outline.vertices, geometry.bounds.center] }\n\t\t\tcase 'cloud':\n\t\t\tcase 'ellipse':\n\t\t\tcase 'heart':\n\t\t\tcase 'oval':\n\t\t\t\t// blobby shapes only have a snap point in their center\n\t\t\t\treturn { outline: outline, points: [geometry.bounds.center] }\n\t\t\tdefault:\n\t\t\t\texhaustiveSwitchError(shape.props.geo)\n\t\t}\n\t}\n\n\toverride getText(shape: TLGeoShape) {\n\t\treturn renderPlaintextFromRichText(this.editor, shape.props.richText)\n\t}\n\n\toverride getFontFaces(shape: TLGeoShape) {\n\t\tif (isEmptyRichText(shape.props.richText)) {\n\t\t\treturn EMPTY_ARRAY\n\t\t}\n\t\treturn getFontsFromRichText(this.editor, shape.props.richText, {\n\t\t\tfamily: `tldraw_${shape.props.font}`,\n\t\t\tweight: 'normal',\n\t\t\tstyle: 'normal',\n\t\t})\n\t}\n\n\tcomponent(shape: TLGeoShape) {\n\t\tconst { id, type, props } = shape\n\t\tconst { fill, font, align, verticalAlign, size, richText } = props\n\t\tconst theme = useDefaultColorTheme()\n\t\tconst { editor } = this\n\t\tconst isOnlySelected = useValue(\n\t\t\t'isGeoOnlySelected',\n\t\t\t() => shape.id === editor.getOnlySelectedShapeId(),\n\t\t\t[editor]\n\t\t)\n\t\tconst isReadyForEditing = useIsReadyForEditing(editor, shape.id)\n\t\tconst isEmpty = isEmptyRichText(shape.props.richText)\n\t\tconst showHtmlContainer = isReadyForEditing || !isEmpty\n\t\tconst isForceSolid = useValue('force solid', () => editor.getZoomLevel() < 0.2, [editor])\n\n\t\treturn (\n\t\t\t<>\n\t\t\t\t<SVGContainer>\n\t\t\t\t\t<GeoShapeBody shape={shape} shouldScale={true} forceSolid={isForceSolid} />\n\t\t\t\t</SVGContainer>\n\t\t\t\t{showHtmlContainer && (\n\t\t\t\t\t<HTMLContainer\n\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\toverflow: 'hidden',\n\t\t\t\t\t\t\twidth: shape.props.w,\n\t\t\t\t\t\t\theight: shape.props.h + props.growY,\n\t\t\t\t\t\t}}\n\t\t\t\t\t>\n\t\t\t\t\t\t<RichTextLabel\n\t\t\t\t\t\t\tshapeId={id}\n\t\t\t\t\t\t\ttype={type}\n\t\t\t\t\t\t\tfont={font}\n\t\t\t\t\t\t\tfontSize={LABEL_FONT_SIZES[size] * shape.props.scale}\n\t\t\t\t\t\t\tlineHeight={TEXT_PROPS.lineHeight}\n\t\t\t\t\t\t\tpadding={LABEL_PADDING * shape.props.scale}\n\t\t\t\t\t\t\tfill={fill}\n\t\t\t\t\t\t\talign={align}\n\t\t\t\t\t\t\tverticalAlign={verticalAlign}\n\t\t\t\t\t\t\trichText={richText}\n\t\t\t\t\t\t\tisSelected={isOnlySelected}\n\t\t\t\t\t\t\tlabelColor={getColorValue(theme, props.labelColor, 'solid')}\n\t\t\t\t\t\t\twrap\n\t\t\t\t\t\t/>\n\t\t\t\t\t</HTMLContainer>\n\t\t\t\t)}\n\t\t\t\t{shape.props.url && <HyperlinkButton url={shape.props.url} />}\n\t\t\t</>\n\t\t)\n\t}\n\n\tindicator(shape: TLGeoShape) {\n\t\tconst isZoomedOut = useValue('isZoomedOut', () => this.editor.getZoomLevel() < 0.25, [\n\t\t\tthis.editor,\n\t\t])\n\n\t\tconst { size, dash, scale } = shape.props\n\t\tconst strokeWidth = STROKE_SIZES[size]\n\n\t\tconst path = getGeoShapePath(shape)\n\n\t\treturn path.toSvg({\n\t\t\tstyle: dash === 'draw' ? 'draw' : 'solid',\n\t\t\tstrokeWidth: 1,\n\t\t\tpasses: 1,\n\t\t\trandomSeed: shape.id,\n\t\t\toffset: 0,\n\t\t\troundness: strokeWidth * 2 * scale,\n\t\t\tprops: { strokeWidth: undefined },\n\t\t\tforceSolid: isZoomedOut,\n\t\t})\n\t}\n\n\toverride toSvg(shape: TLGeoShape, ctx: SvgExportContext) {\n\t\tconst scale = shape.props.scale\n\t\t// We need to scale the shape to 1x for export\n\t\tconst newShape = {\n\t\t\t...shape,\n\t\t\tprops: {\n\t\t\t\t...shape.props,\n\t\t\t\tw: shape.props.w / scale,\n\t\t\t\th: (shape.props.h + shape.props.growY) / scale,\n\t\t\t\tgrowY: 0, // growY throws off the path calculations, so we set it to 0\n\t\t\t},\n\t\t}\n\t\tconst props = newShape.props\n\t\tctx.addExportDef(getFillDefForExport(props.fill))\n\n\t\tlet textEl\n\t\tif (!isEmptyRichText(props.richText)) {\n\t\t\tconst theme = getDefaultColorTheme(ctx)\n\t\t\tconst bounds = new Box(0, 0, props.w, (shape.props.h + shape.props.growY) / scale)\n\t\t\ttextEl = (\n\t\t\t\t<RichTextSVG\n\t\t\t\t\tfontSize={LABEL_FONT_SIZES[props.size]}\n\t\t\t\t\tfont={props.font}\n\t\t\t\t\talign={props.align}\n\t\t\t\t\tverticalAlign={props.verticalAlign}\n\t\t\t\t\trichText={props.richText}\n\t\t\t\t\tlabelColor={getColorValue(theme, props.labelColor, 'solid')}\n\t\t\t\t\tbounds={bounds}\n\t\t\t\t\tpadding={LABEL_PADDING}\n\t\t\t\t/>\n\t\t\t)\n\t\t}\n\n\t\treturn (\n\t\t\t<>\n\t\t\t\t<GeoShapeBody shouldScale={false} shape={newShape} forceSolid={false} />\n\t\t\t\t{textEl}\n\t\t\t</>\n\t\t)\n\t}\n\n\toverride getCanvasSvgDefs(): TLShapeUtilCanvasSvgDef[] {\n\t\treturn [getFillDefForCanvas()]\n\t}\n\n\toverride onResize(\n\t\tshape: TLGeoShape,\n\t\t{ handle, newPoint, scaleX, scaleY, initialShape }: TLResizeInfo<TLGeoShape>\n\t) {\n\t\tconst unscaledInitialW = initialShape.props.w / initialShape.props.scale\n\t\tconst unscaledInitialH = initialShape.props.h / initialShape.props.scale\n\t\tconst unscaledGrowY = initialShape.props.growY / initialShape.props.scale\n\t\t// use the w/h from props here instead of the initialBounds here,\n\t\t// since cloud shapes calculated bounds can differ from the props w/h.\n\t\tlet unscaledW = unscaledInitialW * scaleX\n\t\tlet unscaledH = (unscaledInitialH + unscaledGrowY) * scaleY\n\t\tlet overShrinkX = 0\n\t\tlet overShrinkY = 0\n\n\t\tconst min = MIN_SIZE_WITH_LABEL\n\n\t\tif (!isEmptyRichText(shape.props.richText)) {\n\t\t\tlet newW = Math.max(Math.abs(unscaledW), min)\n\t\t\tlet newH = Math.max(Math.abs(unscaledH), min)\n\n\t\t\tif (newW < min && newH === min) newW = min\n\t\t\tif (newW === min && newH < min) newH = min\n\n\t\t\tconst unscaledLabelSize = getUnscaledLabelSize(this.editor, {\n\t\t\t\t...shape,\n\t\t\t\tprops: {\n\t\t\t\t\t...shape.props,\n\t\t\t\t\tw: newW * shape.props.scale,\n\t\t\t\t\th: newH * shape.props.scale,\n\t\t\t\t},\n\t\t\t})\n\n\t\t\tconst nextW = Math.max(Math.abs(unscaledW), unscaledLabelSize.w) * Math.sign(unscaledW)\n\t\t\tconst nextH = Math.max(Math.abs(unscaledH), unscaledLabelSize.h) * Math.sign(unscaledH)\n\t\t\toverShrinkX = Math.abs(nextW) - Math.abs(unscaledW)\n\t\t\toverShrinkY = Math.abs(nextH) - Math.abs(unscaledH)\n\n\t\t\tunscaledW = nextW\n\t\t\tunscaledH = nextH\n\t\t}\n\n\t\tconst scaledW = unscaledW * shape.props.scale\n\t\tconst scaledH = unscaledH * shape.props.scale\n\n\t\tconst offset = new Vec(0, 0)\n\n\t\t// x offsets\n\n\t\tif (scaleX < 0) {\n\t\t\toffset.x += scaledW\n\t\t}\n\n\t\tif (handle === 'left' || handle === 'top_left' || handle === 'bottom_left') {\n\t\t\toffset.x += scaleX < 0 ? overShrinkX : -overShrinkX\n\t\t}\n\n\t\t// y offsets\n\n\t\tif (scaleY < 0) {\n\t\t\toffset.y += scaledH\n\t\t}\n\n\t\tif (handle === 'top' || handle === 'top_left' || handle === 'top_right') {\n\t\t\toffset.y += scaleY < 0 ? overShrinkY : -overShrinkY\n\t\t}\n\n\t\tconst { x, y } = offset.rot(shape.rotation).add(newPoint)\n\n\t\treturn {\n\t\t\tx,\n\t\t\ty,\n\t\t\tprops: {\n\t\t\t\tw: Math.max(Math.abs(scaledW), 1),\n\t\t\t\th: Math.max(Math.abs(scaledH), 1),\n\t\t\t\tgrowY: 0,\n\t\t\t},\n\t\t}\n\t}\n\n\toverride onBeforeCreate(shape: TLGeoShape) {\n\t\tif (isEmptyRichText(shape.props.richText)) {\n\t\t\tif (shape.props.growY) {\n\t\t\t\t// No text / some growY, set growY to 0\n\t\t\t\treturn {\n\t\t\t\t\t...shape,\n\t\t\t\t\tprops: {\n\t\t\t\t\t\t...shape.props,\n\t\t\t\t\t\tgrowY: 0,\n\t\t\t\t\t},\n\t\t\t\t}\n\t\t\t} else {\n\t\t\t\t// No text / no growY, nothing to change\n\t\t\t\treturn\n\t\t\t}\n\t\t}\n\n\t\tconst unscaledPrevHeight = shape.props.h / shape.props.scale\n\t\tconst unscaledNextHeight = getUnscaledLabelSize(this.editor, shape).h\n\n\t\tlet growY: number | null = null\n\n\t\tif (unscaledNextHeight > unscaledPrevHeight) {\n\t\t\tgrowY = unscaledNextHeight - unscaledPrevHeight\n\t\t} else {\n\t\t\tif (shape.props.growY) {\n\t\t\t\tgrowY = 0\n\t\t\t}\n\t\t}\n\n\t\tif (growY !== null) {\n\t\t\treturn {\n\t\t\t\t...shape,\n\t\t\t\tprops: {\n\t\t\t\t\t...shape.props,\n\t\t\t\t\t// scale the growY\n\t\t\t\t\tgrowY: growY * shape.props.scale,\n\t\t\t\t},\n\t\t\t}\n\t\t}\n\t}\n\n\toverride onBeforeUpdate(prev: TLGeoShape, next: TLGeoShape) {\n\t\t// No change to text, font, or size, no need to update update\n\t\tif (\n\t\t\tisEqual(prev.props.richText, next.props.richText) &&\n\t\t\tprev.props.font === next.props.font &&\n\t\t\tprev.props.size === next.props.size\n\t\t) {\n\t\t\treturn\n\t\t}\n\n\t\t// If we got rid of the text, cancel out any growY from the prev text\n\t\tconst wasEmpty = isEmptyRichText(prev.props.richText)\n\t\tconst isEmpty = isEmptyRichText(next.props.richText)\n\t\tif (!wasEmpty && isEmpty) {\n\t\t\treturn {\n\t\t\t\t...next,\n\t\t\t\tprops: {\n\t\t\t\t\t...next.props,\n\t\t\t\t\tgrowY: 0,\n\t\t\t\t},\n\t\t\t}\n\t\t}\n\n\t\t// Get the prev width and height in unscaled values\n\t\tconst unscaledPrevWidth = prev.props.w / prev.props.scale\n\t\tconst unscaledPrevHeight = prev.props.h / prev.props.scale\n\t\tconst unscaledPrevGrowY = prev.props.growY / prev.props.scale\n\n\t\t// Get the next width and height in unscaled values\n\t\tconst unscaledNextLabelSize = getUnscaledLabelSize(this.editor, next)\n\n\t\t// When entering the first character in a label (not pasting in multiple characters...)\n\t\tif (wasEmpty && !isEmpty && renderPlaintextFromRichText(this.editor, next.props.richText)) {\n\t\t\tlet unscaledW = Math.max(unscaledPrevWidth, unscaledNextLabelSize.w)\n\t\t\tlet unscaledH = Math.max(unscaledPrevHeight, unscaledNextLabelSize.h)\n\n\t\t\tconst min = MIN_SIZE_WITH_LABEL\n\n\t\t\t// If both the width and height were less than the minimum size, make the shape square\n\t\t\tif (unscaledPrevWidth < min && unscaledPrevHeight < min) {\n\t\t\t\tunscaledW = Math.max(unscaledW, min)\n\t\t\t\tunscaledH = Math.max(unscaledH, min)\n\t\t\t\tunscaledW = Math.max(unscaledW, unscaledH)\n\t\t\t\tunscaledH = Math.max(unscaledW, unscaledH)\n\t\t\t}\n\n\t\t\t// Don't set a growY\u2014at least, not until we've implemented a growX property\n\t\t\treturn {\n\t\t\t\t...next,\n\t\t\t\tprops: {\n\t\t\t\t\t...next.props,\n\t\t\t\t\t// Scale the results\n\t\t\t\t\tw: unscaledW * next.props.scale,\n\t\t\t\t\th: unscaledH * next.props.scale,\n\t\t\t\t\tgrowY: 0,\n\t\t\t\t},\n\t\t\t}\n\t\t}\n\n\t\tlet growY: number | null = null\n\n\t\tif (unscaledNextLabelSize.h > unscaledPrevHeight) {\n\t\t\tgrowY = unscaledNextLabelSize.h - unscaledPrevHeight\n\t\t} else {\n\t\t\tif (unscaledPrevGrowY) {\n\t\t\t\tgrowY = 0\n\t\t\t}\n\t\t}\n\n\t\tif (growY !== null) {\n\t\t\tconst unscaledNextWidth = next.props.w / next.props.scale\n\t\t\treturn {\n\t\t\t\t...next,\n\t\t\t\tprops: {\n\t\t\t\t\t...next.props,\n\t\t\t\t\t// Scale the results\n\t\t\t\t\tgrowY: growY * next.props.scale,\n\t\t\t\t\tw: Math.max(unscaledNextWidth, unscaledNextLabelSize.w) * next.props.scale,\n\t\t\t\t},\n\t\t\t}\n\t\t}\n\n\t\tif (unscaledNextLabelSize.w > unscaledPrevWidth) {\n\t\t\treturn {\n\t\t\t\t...next,\n\t\t\t\tprops: {\n\t\t\t\t\t...next.props,\n\t\t\t\t\t// Scale the results\n\t\t\t\t\tw: unscaledNextLabelSize.w * next.props.scale,\n\t\t\t\t},\n\t\t\t}\n\t\t}\n\n\t\t// otherwise, no update needed\n\t}\n\n\toverride onDoubleClick(shape: TLGeoShape) {\n\t\t// Little easter egg: double-clicking a rectangle / checkbox while\n\t\t// holding alt will toggle between check-box and rectangle\n\t\tif (this.editor.inputs.altKey) {\n\t\t\tswitch (shape.props.geo) {\n\t\t\t\tcase 'rectangle': {\n\t\t\t\t\treturn {\n\t\t\t\t\t\t...shape,\n\t\t\t\t\t\tprops: {\n\t\t\t\t\t\t\tgeo: 'check-box' as const,\n\t\t\t\t\t\t},\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t\tcase 'check-box': {\n\t\t\t\t\treturn {\n\t\t\t\t\t\t...shape,\n\t\t\t\t\t\tprops: {\n\t\t\t\t\t\t\tgeo: 'rectangle' as const,\n\t\t\t\t\t\t},\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\n\t\treturn\n\t}\n\toverride getInterpolatedProps(\n\t\tstartShape: TLGeoShape,\n\t\tendShape: TLGeoShape,\n\t\tt: number\n\t): TLGeoShapeProps {\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\tscale: lerp(startShape.props.scale, endShape.props.scale, t),\n\t\t}\n\t}\n}\n\n// imperfect but good enough, should be the width of the W in the font / size combo\nconst minWidths = {\n\ts: 12,\n\tm: 14,\n\tl: 16,\n\txl: 20,\n}\n\nconst extraPaddings = {\n\ts: 2,\n\tm: 3.5,\n\tl: 5,\n\txl: 10,\n}\n\nfunction getUnscaledLabelSize(editor: Editor, shape: TLGeoShape) {\n\tconst { richText, font, size, w } = shape.props\n\n\tif (!richText || isEmptyRichText(richText)) {\n\t\treturn { w: 0, h: 0 }\n\t}\n\n\t// way too expensive to be recomputing on every update\n\tconst minWidth = minWidths[size]\n\n\tconst html = renderHtmlFromRichTextForMeasurement(editor, richText)\n\tconst textSize = editor.textMeasure.measureHtml(html, {\n\t\t...TEXT_PROPS,\n\t\tfontFamily: FONT_FAMILIES[font],\n\t\tfontSize: LABEL_FONT_SIZES[size],\n\t\tminWidth: minWidth,\n\t\tmaxWidth: Math.max(\n\t\t\t// Guard because a DOM nodes can't be less 0\n\t\t\t0,\n\t\t\t// A 'w' width that we're setting as the min-width\n\t\t\tMath.ceil(minWidth + extraPaddings[size]),\n\t\t\t// The actual text size\n\t\t\tMath.ceil(w / shape.props.scale - LABEL_PADDING * 2)\n\t\t),\n\t})\n\n\treturn {\n\t\tw: textSize.w + LABEL_PADDING * 2,\n\t\th: textSize.h + LABEL_PADDING * 2,\n\t}\n}\n"],
-  "mappings": "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",
+  "sourcesContent": ["/* eslint-disable react-hooks/rules-of-hooks */\nimport {\n\tBaseBoxShapeUtil,\n\tBox,\n\tEMPTY_ARRAY,\n\tEditor,\n\tGroup2d,\n\tHTMLContainer,\n\tHandleSnapGeometry,\n\tRectangle2d,\n\tSVGContainer,\n\tSvgExportContext,\n\tTLGeoShape,\n\tTLGeoShapeProps,\n\tTLResizeInfo,\n\tTLShapeUtilCanvasSvgDef,\n\tVec,\n\texhaustiveSwitchError,\n\tgeoShapeMigrations,\n\tgeoShapeProps,\n\tgetColorValue,\n\tgetDefaultColorTheme,\n\tgetFontsFromRichText,\n\tisEqual,\n\tlerp,\n\ttoRichText,\n\tuseValue,\n} from '@tldraw/editor'\nimport {\n\tisEmptyRichText,\n\trenderHtmlFromRichTextForMeasurement,\n\trenderPlaintextFromRichText,\n} from '../../utils/text/richText'\nimport { HyperlinkButton } from '../shared/HyperlinkButton'\nimport { RichTextLabel, RichTextSVG } from '../shared/RichTextLabel'\nimport {\n\tFONT_FAMILIES,\n\tLABEL_FONT_SIZES,\n\tLABEL_PADDING,\n\tSTROKE_SIZES,\n\tTEXT_PROPS,\n} from '../shared/default-shape-constants'\nimport { getFillDefForCanvas, getFillDefForExport } from '../shared/defaultStyleDefs'\nimport { useDefaultColorTheme } from '../shared/useDefaultColorTheme'\nimport { useIsReadyForEditing } from '../shared/useEditablePlainText'\nimport { GeoShapeBody } from './components/GeoShapeBody'\nimport { getGeoShapePath } from './getGeoShapePath'\n\nconst MIN_SIZE_WITH_LABEL = 17 * 3\n\n/** @public */\nexport class GeoShapeUtil extends BaseBoxShapeUtil<TLGeoShape> {\n\tstatic override type = 'geo' as const\n\tstatic override props = geoShapeProps\n\tstatic override migrations = geoShapeMigrations\n\n\toverride canEdit() {\n\t\treturn true\n\t}\n\n\toverride getDefaultProps(): TLGeoShape['props'] {\n\t\treturn {\n\t\t\tw: 100,\n\t\t\th: 100,\n\t\t\tgeo: 'rectangle',\n\t\t\tdash: 'draw',\n\t\t\tgrowY: 0,\n\t\t\turl: '',\n\t\t\tscale: 1,\n\n\t\t\t// Text properties\n\t\t\tcolor: 'black',\n\t\t\tlabelColor: 'black',\n\t\t\tfill: 'none',\n\t\t\tsize: 'm',\n\t\t\tfont: 'draw',\n\t\t\talign: 'middle',\n\t\t\tverticalAlign: 'middle',\n\t\t\trichText: toRichText(''),\n\t\t}\n\t}\n\n\toverride getGeometry(shape: TLGeoShape) {\n\t\tconst w = Math.max(1, shape.props.w)\n\t\tconst h = Math.max(1, shape.props.h + shape.props.growY)\n\n\t\tconst path = getGeoShapePath(shape)\n\t\tconst unscaledlabelSize = getUnscaledLabelSize(this.editor, shape)\n\t\t// unscaled w and h\n\t\tconst unscaledW = w / shape.props.scale\n\t\tconst unscaledH = h / shape.props.scale\n\t\tconst unscaledminWidth = Math.min(100, unscaledW / 2)\n\t\tconst unscaledMinHeight = Math.min(\n\t\t\tLABEL_FONT_SIZES[shape.props.size] * TEXT_PROPS.lineHeight + LABEL_PADDING * 2,\n\t\t\tunscaledH / 2\n\t\t)\n\n\t\tconst unscaledLabelWidth = Math.min(\n\t\t\tunscaledW,\n\t\t\tMath.max(unscaledlabelSize.w, Math.min(unscaledminWidth, Math.max(1, unscaledW - 8)))\n\t\t)\n\t\tconst unscaledLabelHeight = Math.min(\n\t\t\tunscaledH,\n\t\t\tMath.max(unscaledlabelSize.h, Math.min(unscaledMinHeight, Math.max(1, unscaledH - 8)))\n\t\t)\n\n\t\t// todo: use centroid for label position\n\n\t\treturn new Group2d({\n\t\t\tchildren: [\n\t\t\t\tpath.toGeometry(),\n\t\t\t\tnew Rectangle2d({\n\t\t\t\t\tx:\n\t\t\t\t\t\tshape.props.align === 'start'\n\t\t\t\t\t\t\t? 0\n\t\t\t\t\t\t\t: shape.props.align === 'end'\n\t\t\t\t\t\t\t\t? (unscaledW - unscaledLabelWidth) * shape.props.scale\n\t\t\t\t\t\t\t\t: ((unscaledW - unscaledLabelWidth) / 2) * shape.props.scale,\n\t\t\t\t\ty:\n\t\t\t\t\t\tshape.props.verticalAlign === 'start'\n\t\t\t\t\t\t\t? 0\n\t\t\t\t\t\t\t: shape.props.verticalAlign === 'end'\n\t\t\t\t\t\t\t\t? (unscaledH - unscaledLabelHeight) * shape.props.scale\n\t\t\t\t\t\t\t\t: ((unscaledH - unscaledLabelHeight) / 2) * shape.props.scale,\n\t\t\t\t\twidth: unscaledLabelWidth * shape.props.scale,\n\t\t\t\t\theight: unscaledLabelHeight * shape.props.scale,\n\t\t\t\t\tisFilled: true,\n\t\t\t\t\tisLabel: true,\n\t\t\t\t\texcludeFromShapeBounds: true,\n\t\t\t\t\tisEmptyLabel: isEmptyRichText(shape.props.richText),\n\t\t\t\t}),\n\t\t\t],\n\t\t})\n\t}\n\n\toverride getHandleSnapGeometry(shape: TLGeoShape): HandleSnapGeometry {\n\t\tconst geometry = this.getGeometry(shape)\n\t\t// we only want to snap handles to the outline of the shape - not to its label etc.\n\t\tconst outline = geometry.children[0]\n\t\tswitch (shape.props.geo) {\n\t\t\tcase 'arrow-down':\n\t\t\tcase 'arrow-left':\n\t\t\tcase 'arrow-right':\n\t\t\tcase 'arrow-up':\n\t\t\tcase 'check-box':\n\t\t\tcase 'diamond':\n\t\t\tcase 'hexagon':\n\t\t\tcase 'octagon':\n\t\t\tcase 'pentagon':\n\t\t\tcase 'rectangle':\n\t\t\tcase 'rhombus':\n\t\t\tcase 'rhombus-2':\n\t\t\tcase 'star':\n\t\t\tcase 'trapezoid':\n\t\t\tcase 'triangle':\n\t\t\tcase 'x-box':\n\t\t\t\t// poly-line type shapes hand snap points for each vertex & the center\n\t\t\t\treturn { outline: outline, points: [...outline.vertices, geometry.bounds.center] }\n\t\t\tcase 'cloud':\n\t\t\tcase 'ellipse':\n\t\t\tcase 'heart':\n\t\t\tcase 'oval':\n\t\t\t\t// blobby shapes only have a snap point in their center\n\t\t\t\treturn { outline: outline, points: [geometry.bounds.center] }\n\t\t\tdefault:\n\t\t\t\texhaustiveSwitchError(shape.props.geo)\n\t\t}\n\t}\n\n\toverride getText(shape: TLGeoShape) {\n\t\treturn renderPlaintextFromRichText(this.editor, shape.props.richText)\n\t}\n\n\toverride getFontFaces(shape: TLGeoShape) {\n\t\tif (isEmptyRichText(shape.props.richText)) {\n\t\t\treturn EMPTY_ARRAY\n\t\t}\n\t\treturn getFontsFromRichText(this.editor, shape.props.richText, {\n\t\t\tfamily: `tldraw_${shape.props.font}`,\n\t\t\tweight: 'normal',\n\t\t\tstyle: 'normal',\n\t\t})\n\t}\n\n\tcomponent(shape: TLGeoShape) {\n\t\tconst { id, type, props } = shape\n\t\tconst { fill, font, align, verticalAlign, size, richText } = props\n\t\tconst theme = useDefaultColorTheme()\n\t\tconst { editor } = this\n\t\tconst isOnlySelected = useValue(\n\t\t\t'isGeoOnlySelected',\n\t\t\t() => shape.id === editor.getOnlySelectedShapeId(),\n\t\t\t[editor]\n\t\t)\n\t\tconst isReadyForEditing = useIsReadyForEditing(editor, shape.id)\n\t\tconst isEmpty = isEmptyRichText(shape.props.richText)\n\t\tconst showHtmlContainer = isReadyForEditing || !isEmpty\n\t\tconst isForceSolid = useValue('force solid', () => editor.getZoomLevel() < 0.2, [editor])\n\n\t\treturn (\n\t\t\t<>\n\t\t\t\t<SVGContainer>\n\t\t\t\t\t<GeoShapeBody shape={shape} shouldScale={true} forceSolid={isForceSolid} />\n\t\t\t\t</SVGContainer>\n\t\t\t\t{showHtmlContainer && (\n\t\t\t\t\t<HTMLContainer\n\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\toverflow: 'hidden',\n\t\t\t\t\t\t\twidth: shape.props.w,\n\t\t\t\t\t\t\theight: shape.props.h + props.growY,\n\t\t\t\t\t\t}}\n\t\t\t\t\t>\n\t\t\t\t\t\t<RichTextLabel\n\t\t\t\t\t\t\tshapeId={id}\n\t\t\t\t\t\t\ttype={type}\n\t\t\t\t\t\t\tfont={font}\n\t\t\t\t\t\t\tfontSize={LABEL_FONT_SIZES[size] * shape.props.scale}\n\t\t\t\t\t\t\tlineHeight={TEXT_PROPS.lineHeight}\n\t\t\t\t\t\t\tpadding={LABEL_PADDING * shape.props.scale}\n\t\t\t\t\t\t\tfill={fill}\n\t\t\t\t\t\t\talign={align}\n\t\t\t\t\t\t\tverticalAlign={verticalAlign}\n\t\t\t\t\t\t\trichText={richText}\n\t\t\t\t\t\t\tisSelected={isOnlySelected}\n\t\t\t\t\t\t\tlabelColor={getColorValue(theme, props.labelColor, 'solid')}\n\t\t\t\t\t\t\twrap\n\t\t\t\t\t\t/>\n\t\t\t\t\t</HTMLContainer>\n\t\t\t\t)}\n\t\t\t\t{shape.props.url && <HyperlinkButton url={shape.props.url} />}\n\t\t\t</>\n\t\t)\n\t}\n\n\tindicator(shape: TLGeoShape) {\n\t\tconst isZoomedOut = useValue('isZoomedOut', () => this.editor.getZoomLevel() < 0.25, [\n\t\t\tthis.editor,\n\t\t])\n\n\t\tconst { size, dash, scale } = shape.props\n\t\tconst strokeWidth = STROKE_SIZES[size]\n\n\t\tconst path = getGeoShapePath(shape)\n\n\t\treturn path.toSvg({\n\t\t\tstyle: dash === 'draw' ? 'draw' : 'solid',\n\t\t\tstrokeWidth: 1,\n\t\t\tpasses: 1,\n\t\t\trandomSeed: shape.id,\n\t\t\toffset: 0,\n\t\t\troundness: strokeWidth * 2 * scale,\n\t\t\tprops: { strokeWidth: undefined },\n\t\t\tforceSolid: isZoomedOut,\n\t\t})\n\t}\n\n\toverride toSvg(shape: TLGeoShape, ctx: SvgExportContext) {\n\t\tconst scale = shape.props.scale\n\t\t// We need to scale the shape to 1x for export\n\t\tconst newShape = {\n\t\t\t...shape,\n\t\t\tprops: {\n\t\t\t\t...shape.props,\n\t\t\t\tw: shape.props.w / scale,\n\t\t\t\th: (shape.props.h + shape.props.growY) / scale,\n\t\t\t\tgrowY: 0, // growY throws off the path calculations, so we set it to 0\n\t\t\t},\n\t\t}\n\t\tconst props = newShape.props\n\t\tctx.addExportDef(getFillDefForExport(props.fill))\n\n\t\tlet textEl\n\t\tif (!isEmptyRichText(props.richText)) {\n\t\t\tconst theme = getDefaultColorTheme(ctx)\n\t\t\tconst bounds = new Box(0, 0, props.w, (shape.props.h + shape.props.growY) / scale)\n\t\t\ttextEl = (\n\t\t\t\t<RichTextSVG\n\t\t\t\t\tfontSize={LABEL_FONT_SIZES[props.size]}\n\t\t\t\t\tfont={props.font}\n\t\t\t\t\talign={props.align}\n\t\t\t\t\tverticalAlign={props.verticalAlign}\n\t\t\t\t\trichText={props.richText}\n\t\t\t\t\tlabelColor={getColorValue(theme, props.labelColor, 'solid')}\n\t\t\t\t\tbounds={bounds}\n\t\t\t\t\tpadding={LABEL_PADDING}\n\t\t\t\t/>\n\t\t\t)\n\t\t}\n\n\t\treturn (\n\t\t\t<>\n\t\t\t\t<GeoShapeBody shouldScale={false} shape={newShape} forceSolid={false} />\n\t\t\t\t{textEl}\n\t\t\t</>\n\t\t)\n\t}\n\n\toverride getCanvasSvgDefs(): TLShapeUtilCanvasSvgDef[] {\n\t\treturn [getFillDefForCanvas()]\n\t}\n\n\toverride onResize(\n\t\tshape: TLGeoShape,\n\t\t{ handle, newPoint, scaleX, scaleY, initialShape }: TLResizeInfo<TLGeoShape>\n\t) {\n\t\tconst unscaledInitialW = initialShape.props.w / initialShape.props.scale\n\t\tconst unscaledInitialH = initialShape.props.h / initialShape.props.scale\n\t\tconst unscaledGrowY = initialShape.props.growY / initialShape.props.scale\n\t\t// use the w/h from props here instead of the initialBounds here,\n\t\t// since cloud shapes calculated bounds can differ from the props w/h.\n\t\tlet unscaledW = unscaledInitialW * scaleX\n\t\tlet unscaledH = (unscaledInitialH + unscaledGrowY) * scaleY\n\t\tlet overShrinkX = 0\n\t\tlet overShrinkY = 0\n\n\t\tconst min = MIN_SIZE_WITH_LABEL\n\n\t\tif (!isEmptyRichText(shape.props.richText)) {\n\t\t\tlet newW = Math.max(Math.abs(unscaledW), min)\n\t\t\tlet newH = Math.max(Math.abs(unscaledH), min)\n\n\t\t\tif (newW < min && newH === min) newW = min\n\t\t\tif (newW === min && newH < min) newH = min\n\n\t\t\tconst unscaledLabelSize = getUnscaledLabelSize(this.editor, {\n\t\t\t\t...shape,\n\t\t\t\tprops: {\n\t\t\t\t\t...shape.props,\n\t\t\t\t\tw: newW * shape.props.scale,\n\t\t\t\t\th: newH * shape.props.scale,\n\t\t\t\t},\n\t\t\t})\n\n\t\t\tconst nextW = Math.max(Math.abs(unscaledW), unscaledLabelSize.w) * Math.sign(unscaledW)\n\t\t\tconst nextH = Math.max(Math.abs(unscaledH), unscaledLabelSize.h) * Math.sign(unscaledH)\n\t\t\toverShrinkX = Math.abs(nextW) - Math.abs(unscaledW)\n\t\t\toverShrinkY = Math.abs(nextH) - Math.abs(unscaledH)\n\n\t\t\tunscaledW = nextW\n\t\t\tunscaledH = nextH\n\t\t}\n\n\t\tconst scaledW = unscaledW * shape.props.scale\n\t\tconst scaledH = unscaledH * shape.props.scale\n\n\t\tconst offset = new Vec(0, 0)\n\n\t\t// x offsets\n\n\t\tif (scaleX < 0) {\n\t\t\toffset.x += scaledW\n\t\t}\n\n\t\tif (handle === 'left' || handle === 'top_left' || handle === 'bottom_left') {\n\t\t\toffset.x += scaleX < 0 ? overShrinkX : -overShrinkX\n\t\t}\n\n\t\t// y offsets\n\n\t\tif (scaleY < 0) {\n\t\t\toffset.y += scaledH\n\t\t}\n\n\t\tif (handle === 'top' || handle === 'top_left' || handle === 'top_right') {\n\t\t\toffset.y += scaleY < 0 ? overShrinkY : -overShrinkY\n\t\t}\n\n\t\tconst { x, y } = offset.rot(shape.rotation).add(newPoint)\n\n\t\treturn {\n\t\t\tx,\n\t\t\ty,\n\t\t\tprops: {\n\t\t\t\tw: Math.max(Math.abs(scaledW), 1),\n\t\t\t\th: Math.max(Math.abs(scaledH), 1),\n\t\t\t\tgrowY: 0,\n\t\t\t},\n\t\t}\n\t}\n\n\toverride onBeforeCreate(shape: TLGeoShape) {\n\t\tif (isEmptyRichText(shape.props.richText)) {\n\t\t\tif (shape.props.growY) {\n\t\t\t\t// No text / some growY, set growY to 0\n\t\t\t\treturn {\n\t\t\t\t\t...shape,\n\t\t\t\t\tprops: {\n\t\t\t\t\t\t...shape.props,\n\t\t\t\t\t\tgrowY: 0,\n\t\t\t\t\t},\n\t\t\t\t}\n\t\t\t} else {\n\t\t\t\t// No text / no growY, nothing to change\n\t\t\t\treturn\n\t\t\t}\n\t\t}\n\n\t\tconst unscaledPrevHeight = shape.props.h / shape.props.scale\n\t\tconst unscaledNextHeight = getUnscaledLabelSize(this.editor, shape).h\n\n\t\tlet growY: number | null = null\n\n\t\tif (unscaledNextHeight > unscaledPrevHeight) {\n\t\t\tgrowY = unscaledNextHeight - unscaledPrevHeight\n\t\t} else {\n\t\t\tif (shape.props.growY) {\n\t\t\t\tgrowY = 0\n\t\t\t}\n\t\t}\n\n\t\tif (growY !== null) {\n\t\t\treturn {\n\t\t\t\t...shape,\n\t\t\t\tprops: {\n\t\t\t\t\t...shape.props,\n\t\t\t\t\t// scale the growY\n\t\t\t\t\tgrowY: growY * shape.props.scale,\n\t\t\t\t},\n\t\t\t}\n\t\t}\n\t}\n\n\toverride onBeforeUpdate(prev: TLGeoShape, next: TLGeoShape) {\n\t\t// No change to text, font, or size, no need to update update\n\t\tif (\n\t\t\tisEqual(prev.props.richText, next.props.richText) &&\n\t\t\tprev.props.font === next.props.font &&\n\t\t\tprev.props.size === next.props.size\n\t\t) {\n\t\t\treturn\n\t\t}\n\n\t\t// If we got rid of the text, cancel out any growY from the prev text\n\t\tconst wasEmpty = isEmptyRichText(prev.props.richText)\n\t\tconst isEmpty = isEmptyRichText(next.props.richText)\n\t\tif (!wasEmpty && isEmpty) {\n\t\t\treturn {\n\t\t\t\t...next,\n\t\t\t\tprops: {\n\t\t\t\t\t...next.props,\n\t\t\t\t\tgrowY: 0,\n\t\t\t\t},\n\t\t\t}\n\t\t}\n\n\t\t// Get the prev width and height in unscaled values\n\t\tconst unscaledPrevWidth = prev.props.w / prev.props.scale\n\t\tconst unscaledPrevHeight = prev.props.h / prev.props.scale\n\t\tconst unscaledPrevGrowY = prev.props.growY / prev.props.scale\n\n\t\t// Get the next width and height in unscaled values\n\t\tconst unscaledNextLabelSize = getUnscaledLabelSize(this.editor, next)\n\n\t\t// When entering the first character in a label (not pasting in multiple characters...)\n\t\tif (wasEmpty && !isEmpty && renderPlaintextFromRichText(this.editor, next.props.richText)) {\n\t\t\tlet unscaledW = Math.max(unscaledPrevWidth, unscaledNextLabelSize.w)\n\t\t\tlet unscaledH = Math.max(unscaledPrevHeight, unscaledNextLabelSize.h)\n\n\t\t\tconst min = MIN_SIZE_WITH_LABEL\n\n\t\t\t// If both the width and height were less than the minimum size, make the shape square\n\t\t\tif (unscaledPrevWidth < min && unscaledPrevHeight < min) {\n\t\t\t\tunscaledW = Math.max(unscaledW, min)\n\t\t\t\tunscaledH = Math.max(unscaledH, min)\n\t\t\t\tunscaledW = Math.max(unscaledW, unscaledH)\n\t\t\t\tunscaledH = Math.max(unscaledW, unscaledH)\n\t\t\t}\n\n\t\t\t// Don't set a growY\u2014at least, not until we've implemented a growX property\n\t\t\treturn {\n\t\t\t\t...next,\n\t\t\t\tprops: {\n\t\t\t\t\t...next.props,\n\t\t\t\t\t// Scale the results\n\t\t\t\t\tw: unscaledW * next.props.scale,\n\t\t\t\t\th: unscaledH * next.props.scale,\n\t\t\t\t\tgrowY: 0,\n\t\t\t\t},\n\t\t\t}\n\t\t}\n\n\t\tlet growY: number | null = null\n\n\t\tif (unscaledNextLabelSize.h > unscaledPrevHeight) {\n\t\t\tgrowY = unscaledNextLabelSize.h - unscaledPrevHeight\n\t\t} else {\n\t\t\tif (unscaledPrevGrowY) {\n\t\t\t\tgrowY = 0\n\t\t\t}\n\t\t}\n\n\t\tif (growY !== null) {\n\t\t\tconst unscaledNextWidth = next.props.w / next.props.scale\n\t\t\treturn {\n\t\t\t\t...next,\n\t\t\t\tprops: {\n\t\t\t\t\t...next.props,\n\t\t\t\t\t// Scale the results\n\t\t\t\t\tgrowY: growY * next.props.scale,\n\t\t\t\t\tw: Math.max(unscaledNextWidth, unscaledNextLabelSize.w) * next.props.scale,\n\t\t\t\t},\n\t\t\t}\n\t\t}\n\n\t\tif (unscaledNextLabelSize.w > unscaledPrevWidth) {\n\t\t\treturn {\n\t\t\t\t...next,\n\t\t\t\tprops: {\n\t\t\t\t\t...next.props,\n\t\t\t\t\t// Scale the results\n\t\t\t\t\tw: unscaledNextLabelSize.w * next.props.scale,\n\t\t\t\t},\n\t\t\t}\n\t\t}\n\n\t\t// otherwise, no update needed\n\t}\n\n\toverride onDoubleClick(shape: TLGeoShape) {\n\t\t// Little easter egg: double-clicking a rectangle / checkbox while\n\t\t// holding alt will toggle between check-box and rectangle\n\t\tif (this.editor.inputs.altKey) {\n\t\t\tswitch (shape.props.geo) {\n\t\t\t\tcase 'rectangle': {\n\t\t\t\t\treturn {\n\t\t\t\t\t\t...shape,\n\t\t\t\t\t\tprops: {\n\t\t\t\t\t\t\tgeo: 'check-box' as const,\n\t\t\t\t\t\t},\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t\tcase 'check-box': {\n\t\t\t\t\treturn {\n\t\t\t\t\t\t...shape,\n\t\t\t\t\t\tprops: {\n\t\t\t\t\t\t\tgeo: 'rectangle' as const,\n\t\t\t\t\t\t},\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\n\t\treturn\n\t}\n\toverride getInterpolatedProps(\n\t\tstartShape: TLGeoShape,\n\t\tendShape: TLGeoShape,\n\t\tt: number\n\t): TLGeoShapeProps {\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\tscale: lerp(startShape.props.scale, endShape.props.scale, t),\n\t\t}\n\t}\n}\n\n// imperfect but good enough, should be the width of the W in the font / size combo\nconst minWidths = {\n\ts: 12,\n\tm: 14,\n\tl: 16,\n\txl: 20,\n}\n\nconst extraPaddings = {\n\ts: 2,\n\tm: 3.5,\n\tl: 5,\n\txl: 10,\n}\n\nfunction getUnscaledLabelSize(editor: Editor, shape: TLGeoShape) {\n\tconst { richText, font, size, w } = shape.props\n\n\tif (!richText || isEmptyRichText(richText)) {\n\t\treturn { w: 0, h: 0 }\n\t}\n\n\t// way too expensive to be recomputing on every update\n\tconst minWidth = minWidths[size]\n\n\tconst html = renderHtmlFromRichTextForMeasurement(editor, richText)\n\tconst textSize = editor.textMeasure.measureHtml(html, {\n\t\t...TEXT_PROPS,\n\t\tfontFamily: FONT_FAMILIES[font],\n\t\tfontSize: LABEL_FONT_SIZES[size],\n\t\tminWidth: minWidth,\n\t\tmaxWidth: Math.max(\n\t\t\t// Guard because a DOM nodes can't be less 0\n\t\t\t0,\n\t\t\t// A 'w' width that we're setting as the min-width\n\t\t\tMath.ceil(minWidth + extraPaddings[size]),\n\t\t\t// The actual text size\n\t\t\tMath.ceil(w / shape.props.scale - LABEL_PADDING * 2)\n\t\t),\n\t})\n\n\treturn {\n\t\tw: textSize.w + LABEL_PADDING * 2,\n\t\th: textSize.h + LABEL_PADDING * 2,\n\t}\n}\n"],
+  "mappings": "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",
   "names": []
 }

package/dist-cjs/lib/shapes/note/NoteShapeUtil.js CHANGED Viewed

@@ -95,7 +95,8 @@ class NoteShapeUtil extends import_editor.ShapeUtil {
           width: lw,
           height: lh,
           isFilled: true,
-          isLabel: true
+          isLabel: true,
+          excludeFromShapeBounds: true
         })
       ]
     });

package/dist-cjs/lib/shapes/note/NoteShapeUtil.js.map CHANGED Viewed

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/lib/shapes/note/NoteShapeUtil.tsx"],
-  "sourcesContent": ["/* eslint-disable react-hooks/rules-of-hooks */\nimport {\n\tBox,\n\tEMPTY_ARRAY,\n\tEditor,\n\tGroup2d,\n\tIndexKey,\n\tRectangle2d,\n\tShapeUtil,\n\tSvgExportContext,\n\tTLHandle,\n\tTLNoteShape,\n\tTLNoteShapeProps,\n\tTLResizeInfo,\n\tTLShape,\n\tTLShapeId,\n\tVec,\n\tWeakCache,\n\texhaustiveSwitchError,\n\tgetColorValue,\n\tgetDefaultColorTheme,\n\tgetFontsFromRichText,\n\tisEqual,\n\tlerp,\n\tnoteShapeMigrations,\n\tnoteShapeProps,\n\tresizeScaled,\n\trng,\n\ttoDomPrecision,\n\ttoRichText,\n\tuseEditor,\n\tuseValue,\n} from '@tldraw/editor'\nimport { useCallback } from 'react'\nimport { startEditingShapeWithLabel } from '../../tools/SelectTool/selectHelpers'\nimport { useCurrentTranslation } from '../../ui/hooks/useTranslation/useTranslation'\nimport {\n\tisEmptyRichText,\n\trenderHtmlFromRichTextForMeasurement,\n\trenderPlaintextFromRichText,\n} from '../../utils/text/richText'\nimport { isRightToLeftLanguage } from '../../utils/text/text'\nimport { HyperlinkButton } from '../shared/HyperlinkButton'\nimport { RichTextLabel, RichTextSVG } from '../shared/RichTextLabel'\nimport {\n\tFONT_FAMILIES,\n\tLABEL_FONT_SIZES,\n\tLABEL_PADDING,\n\tTEXT_PROPS,\n} from '../shared/default-shape-constants'\nimport { useDefaultColorTheme } from '../shared/useDefaultColorTheme'\nimport { useIsReadyForEditing } from '../shared/useEditablePlainText'\nimport {\n\tCLONE_HANDLE_MARGIN,\n\tNOTE_CENTER_OFFSET,\n\tNOTE_SIZE,\n\tgetNoteShapeForAdjacentPosition,\n} from './noteHelpers'\n\n/** @public */\nexport interface NoteShapeOptions {\n\t/**\n\t * How should the note shape resize? By default it does not resize (except automatically based on its text content),\n\t * but you can set it to be user-resizable using scale.\n\t */\n\tresizeMode: 'none' | 'scale'\n}\n\n/** @public */\nexport class NoteShapeUtil extends ShapeUtil<TLNoteShape> {\n\tstatic override type = 'note' as const\n\tstatic override props = noteShapeProps\n\tstatic override migrations = noteShapeMigrations\n\n\toverride options: NoteShapeOptions = {\n\t\tresizeMode: 'none',\n\t}\n\n\toverride canEdit() {\n\t\treturn true\n\t}\n\toverride hideResizeHandles() {\n\t\tconst { resizeMode } = this.options\n\t\tswitch (resizeMode) {\n\t\t\tcase 'none': {\n\t\t\t\treturn true\n\t\t\t}\n\t\t\tcase 'scale': {\n\t\t\t\treturn false\n\t\t\t}\n\t\t\tdefault: {\n\t\t\t\tthrow exhaustiveSwitchError(resizeMode)\n\t\t\t}\n\t\t}\n\t}\n\n\toverride isAspectRatioLocked() {\n\t\treturn this.options.resizeMode === 'scale'\n\t}\n\n\toverride hideSelectionBoundsFg() {\n\t\treturn false\n\t}\n\n\tgetDefaultProps(): TLNoteShape['props'] {\n\t\treturn {\n\t\t\tcolor: 'black',\n\t\t\trichText: toRichText(''),\n\t\t\tsize: 'm',\n\t\t\tfont: 'draw',\n\t\t\talign: 'middle',\n\t\t\tverticalAlign: 'middle',\n\t\t\tlabelColor: 'black',\n\t\t\tgrowY: 0,\n\t\t\tfontSizeAdjustment: 0,\n\t\t\turl: '',\n\t\t\tscale: 1,\n\t\t}\n\t}\n\n\tgetGeometry(shape: TLNoteShape) {\n\t\tconst { labelHeight, labelWidth } = getLabelSize(this.editor, shape)\n\t\tconst { scale } = shape.props\n\n\t\tconst lh = labelHeight * scale\n\t\tconst lw = labelWidth * scale\n\t\tconst nw = NOTE_SIZE * scale\n\t\tconst nh = getNoteHeight(shape)\n\n\t\treturn new Group2d({\n\t\t\tchildren: [\n\t\t\t\tnew Rectangle2d({ width: nw, height: nh, isFilled: true }),\n\t\t\t\tnew Rectangle2d({\n\t\t\t\t\tx:\n\t\t\t\t\t\tshape.props.align === 'start'\n\t\t\t\t\t\t\t? 0\n\t\t\t\t\t\t\t: shape.props.align === 'end'\n\t\t\t\t\t\t\t\t? nw - lw\n\t\t\t\t\t\t\t\t: (nw - lw) / 2,\n\t\t\t\t\ty:\n\t\t\t\t\t\tshape.props.verticalAlign === 'start'\n\t\t\t\t\t\t\t? 0\n\t\t\t\t\t\t\t: shape.props.verticalAlign === 'end'\n\t\t\t\t\t\t\t\t? nh - lh\n\t\t\t\t\t\t\t\t: (nh - lh) / 2,\n\t\t\t\t\twidth: lw,\n\t\t\t\t\theight: lh,\n\t\t\t\t\tisFilled: true,\n\t\t\t\t\tisLabel: true,\n\t\t\t\t}),\n\t\t\t],\n\t\t})\n\t}\n\n\toverride getHandles(shape: TLNoteShape): TLHandle[] {\n\t\tconst { scale } = shape.props\n\t\tconst isCoarsePointer = this.editor.getInstanceState().isCoarsePointer\n\t\tif (isCoarsePointer) return []\n\n\t\tconst zoom = this.editor.getZoomLevel()\n\t\tif (zoom * scale < 0.25) return []\n\n\t\tconst nh = getNoteHeight(shape)\n\t\tconst nw = NOTE_SIZE * scale\n\t\tconst offset = (CLONE_HANDLE_MARGIN / zoom) * scale\n\n\t\tif (zoom * scale < 0.5) {\n\t\t\treturn [\n\t\t\t\t{\n\t\t\t\t\tid: 'bottom',\n\t\t\t\t\tindex: 'a3' as IndexKey,\n\t\t\t\t\ttype: 'clone',\n\t\t\t\t\tx: nw / 2,\n\t\t\t\t\ty: nh + offset,\n\t\t\t\t},\n\t\t\t]\n\t\t}\n\n\t\treturn [\n\t\t\t{\n\t\t\t\tid: 'top',\n\t\t\t\tindex: 'a1' as IndexKey,\n\t\t\t\ttype: 'clone',\n\t\t\t\tx: nw / 2,\n\t\t\t\ty: -offset,\n\t\t\t},\n\t\t\t{\n\t\t\t\tid: 'right',\n\t\t\t\tindex: 'a2' as IndexKey,\n\t\t\t\ttype: 'clone',\n\t\t\t\tx: nw + offset,\n\t\t\t\ty: nh / 2,\n\t\t\t},\n\t\t\t{\n\t\t\t\tid: 'bottom',\n\t\t\t\tindex: 'a3' as IndexKey,\n\t\t\t\ttype: 'clone',\n\t\t\t\tx: nw / 2,\n\t\t\t\ty: nh + offset,\n\t\t\t},\n\t\t\t{\n\t\t\t\tid: 'left',\n\t\t\t\tindex: 'a4' as IndexKey,\n\t\t\t\ttype: 'clone',\n\t\t\t\tx: -offset,\n\t\t\t\ty: nh / 2,\n\t\t\t},\n\t\t]\n\t}\n\n\toverride onResize(shape: any, info: TLResizeInfo<any>) {\n\t\tconst { resizeMode } = this.options\n\t\tswitch (resizeMode) {\n\t\t\tcase 'none': {\n\t\t\t\treturn undefined\n\t\t\t}\n\t\t\tcase 'scale': {\n\t\t\t\treturn resizeScaled(shape, info)\n\t\t\t}\n\t\t\tdefault: {\n\t\t\t\tthrow exhaustiveSwitchError(resizeMode)\n\t\t\t}\n\t\t}\n\t}\n\n\toverride getText(shape: TLNoteShape) {\n\t\treturn renderPlaintextFromRichText(this.editor, shape.props.richText)\n\t}\n\n\toverride getFontFaces(shape: TLNoteShape) {\n\t\tif (isEmptyRichText(shape.props.richText)) {\n\t\t\treturn EMPTY_ARRAY\n\t\t}\n\t\treturn getFontsFromRichText(this.editor, shape.props.richText, {\n\t\t\tfamily: `tldraw_${shape.props.font}`,\n\t\t\tweight: 'normal',\n\t\t\tstyle: 'normal',\n\t\t})\n\t}\n\n\tcomponent(shape: TLNoteShape) {\n\t\tconst {\n\t\t\tid,\n\t\t\ttype,\n\t\t\tprops: {\n\t\t\t\tlabelColor,\n\t\t\t\tscale,\n\t\t\t\tcolor,\n\t\t\t\tfont,\n\t\t\t\tsize,\n\t\t\t\talign,\n\t\t\t\trichText,\n\t\t\t\tverticalAlign,\n\t\t\t\tfontSizeAdjustment,\n\t\t\t},\n\t\t} = shape\n\n\t\tconst handleKeyDown = useNoteKeydownHandler(id)\n\n\t\tconst theme = useDefaultColorTheme()\n\t\tconst nw = NOTE_SIZE * scale\n\t\tconst nh = getNoteHeight(shape)\n\n\t\tconst rotation = useValue(\n\t\t\t'shape rotation',\n\t\t\t() => this.editor.getShapePageTransform(id)?.rotation() ?? 0,\n\t\t\t[this.editor]\n\t\t)\n\n\t\t// todo: consider hiding shadows on dark mode if they're invisible anyway\n\n\t\tconst hideShadows = useValue('zoom', () => this.editor.getZoomLevel() < 0.35 / scale, [\n\t\t\tscale,\n\t\t\tthis.editor,\n\t\t])\n\n\t\tconst isDarkMode = useValue('dark mode', () => this.editor.user.getIsDarkMode(), [this.editor])\n\n\t\tconst isSelected = shape.id === this.editor.getOnlySelectedShapeId()\n\n\t\tconst isReadyForEditing = useIsReadyForEditing(this.editor, shape.id)\n\t\tconst isEmpty = isEmptyRichText(richText)\n\n\t\treturn (\n\t\t\t<>\n\t\t\t\t<div\n\t\t\t\t\tid={id}\n\t\t\t\t\tclassName=\"tl-note__container\"\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\twidth: nw,\n\t\t\t\t\t\theight: nh,\n\t\t\t\t\t\tbackgroundColor: getColorValue(theme, color, 'noteFill'),\n\t\t\t\t\t\tborderBottom: hideShadows\n\t\t\t\t\t\t\t? isDarkMode\n\t\t\t\t\t\t\t\t? `${2 * scale}px solid rgb(20, 20, 20)`\n\t\t\t\t\t\t\t\t: `${2 * scale}px solid rgb(144, 144, 144)`\n\t\t\t\t\t\t\t: 'none',\n\t\t\t\t\t\tboxShadow: hideShadows ? 'none' : getNoteShadow(shape.id, rotation, scale),\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t{(isSelected || isReadyForEditing || !isEmpty) && (\n\t\t\t\t\t\t<RichTextLabel\n\t\t\t\t\t\t\tshapeId={id}\n\t\t\t\t\t\t\ttype={type}\n\t\t\t\t\t\t\tfont={font}\n\t\t\t\t\t\t\tfontSize={(fontSizeAdjustment || LABEL_FONT_SIZES[size]) * scale}\n\t\t\t\t\t\t\tlineHeight={TEXT_PROPS.lineHeight}\n\t\t\t\t\t\t\talign={align}\n\t\t\t\t\t\t\tverticalAlign={verticalAlign}\n\t\t\t\t\t\t\trichText={richText}\n\t\t\t\t\t\t\tisSelected={isSelected}\n\t\t\t\t\t\t\tlabelColor={\n\t\t\t\t\t\t\t\tlabelColor === 'black'\n\t\t\t\t\t\t\t\t\t? getColorValue(theme, color, 'noteText')\n\t\t\t\t\t\t\t\t\t: getColorValue(theme, labelColor, 'fill')\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\twrap\n\t\t\t\t\t\t\tpadding={LABEL_PADDING * scale}\n\t\t\t\t\t\t\thasCustomTabBehavior\n\t\t\t\t\t\t\tonKeyDown={handleKeyDown}\n\t\t\t\t\t\t/>\n\t\t\t\t\t)}\n\t\t\t\t</div>\n\t\t\t\t{'url' in shape.props && shape.props.url && <HyperlinkButton url={shape.props.url} />}\n\t\t\t</>\n\t\t)\n\t}\n\n\tindicator(shape: TLNoteShape) {\n\t\tconst { scale } = shape.props\n\t\treturn (\n\t\t\t<rect\n\t\t\t\trx={scale}\n\t\t\t\twidth={toDomPrecision(NOTE_SIZE * scale)}\n\t\t\t\theight={toDomPrecision(getNoteHeight(shape))}\n\t\t\t/>\n\t\t)\n\t}\n\n\toverride toSvg(shape: TLNoteShape, ctx: SvgExportContext) {\n\t\tconst theme = getDefaultColorTheme({ isDarkMode: ctx.isDarkMode })\n\t\tconst bounds = getBoundsForSVG(shape)\n\n\t\tconst textLabel = (\n\t\t\t<RichTextSVG\n\t\t\t\tfontSize={shape.props.fontSizeAdjustment || LABEL_FONT_SIZES[shape.props.size]}\n\t\t\t\tfont={shape.props.font}\n\t\t\t\talign={shape.props.align}\n\t\t\t\tverticalAlign={shape.props.verticalAlign}\n\t\t\t\trichText={shape.props.richText}\n\t\t\t\tlabelColor={getColorValue(theme, shape.props.color, 'noteText')}\n\t\t\t\tbounds={bounds}\n\t\t\t\tpadding={LABEL_PADDING}\n\t\t\t\tshowTextOutline={false}\n\t\t\t/>\n\t\t)\n\n\t\treturn (\n\t\t\t<>\n\t\t\t\t<rect x={5} y={5} rx={1} width={NOTE_SIZE - 10} height={bounds.h} fill=\"rgba(0,0,0,.1)\" />\n\t\t\t\t<rect\n\t\t\t\t\trx={1}\n\t\t\t\t\twidth={NOTE_SIZE}\n\t\t\t\t\theight={bounds.h}\n\t\t\t\t\tfill={getColorValue(theme, shape.props.color, 'noteFill')}\n\t\t\t\t/>\n\t\t\t\t{textLabel}\n\t\t\t</>\n\t\t)\n\t}\n\n\toverride onBeforeCreate(next: TLNoteShape) {\n\t\treturn getNoteSizeAdjustments(this.editor, next)\n\t}\n\n\toverride onBeforeUpdate(prev: TLNoteShape, next: TLNoteShape) {\n\t\tif (\n\t\t\tisEqual(prev.props.richText, next.props.richText) &&\n\t\t\tprev.props.font === next.props.font &&\n\t\t\tprev.props.size === next.props.size\n\t\t) {\n\t\t\treturn\n\t\t}\n\n\t\treturn getNoteSizeAdjustments(this.editor, next)\n\t}\n\n\toverride getInterpolatedProps(\n\t\tstartShape: TLNoteShape,\n\t\tendShape: TLNoteShape,\n\t\tt: number\n\t): TLNoteShapeProps {\n\t\treturn {\n\t\t\t...(t > 0.5 ? endShape.props : startShape.props),\n\t\t\tscale: lerp(startShape.props.scale, endShape.props.scale, t),\n\t\t}\n\t}\n}\n\n/**\n * Get the growY and fontSizeAdjustment for a shape.\n */\nfunction getNoteSizeAdjustments(editor: Editor, shape: TLNoteShape) {\n\tconst { labelHeight, fontSizeAdjustment } = getLabelSize(editor, shape)\n\t// When the label height is more than the height of the shape, we add extra height to it\n\tconst growY = Math.max(0, labelHeight - NOTE_SIZE)\n\n\tif (growY !== shape.props.growY || fontSizeAdjustment !== shape.props.fontSizeAdjustment) {\n\t\treturn {\n\t\t\t...shape,\n\t\t\tprops: {\n\t\t\t\t...shape.props,\n\t\t\t\tgrowY,\n\t\t\t\tfontSizeAdjustment,\n\t\t\t},\n\t\t}\n\t}\n}\n\n/**\n * Get the label size for a note.\n */\nfunction getNoteLabelSize(editor: Editor, shape: TLNoteShape) {\n\tconst { richText } = shape.props\n\n\tif (isEmptyRichText(richText)) {\n\t\tconst minHeight = LABEL_FONT_SIZES[shape.props.size] * TEXT_PROPS.lineHeight + LABEL_PADDING * 2\n\t\treturn { labelHeight: minHeight, labelWidth: 100, fontSizeAdjustment: 0 }\n\t}\n\n\tconst unadjustedFontSize = LABEL_FONT_SIZES[shape.props.size]\n\n\tlet fontSizeAdjustment = 0\n\tlet iterations = 0\n\tlet labelHeight = NOTE_SIZE\n\tlet labelWidth = NOTE_SIZE\n\n\t// N.B. For some note shapes with text like 'hjhjhjhjhjhjhjhj', you'll run into\n\t// some text measurement fuzziness where the browser swears there's no overflow (scrollWidth === width)\n\t// but really there is when you enable overflow-wrap again. This helps account for that little bit\n\t// of give.\n\tconst FUZZ = 1\n\n\t// We slightly make the font smaller if the text is too big for the note, width-wise.\n\tdo {\n\t\tfontSizeAdjustment = Math.min(unadjustedFontSize, unadjustedFontSize - iterations)\n\t\tconst html = renderHtmlFromRichTextForMeasurement(editor, richText)\n\t\tconst nextTextSize = editor.textMeasure.measureHtml(html, {\n\t\t\t...TEXT_PROPS,\n\t\t\tfontFamily: FONT_FAMILIES[shape.props.font],\n\t\t\tfontSize: fontSizeAdjustment,\n\t\t\tmaxWidth: NOTE_SIZE - LABEL_PADDING * 2 - FUZZ,\n\t\t\tdisableOverflowWrapBreaking: true,\n\t\t\tmeasureScrollWidth: true,\n\t\t})\n\n\t\tlabelHeight = nextTextSize.h + LABEL_PADDING * 2\n\t\tlabelWidth = nextTextSize.w + LABEL_PADDING * 2\n\n\t\tif (fontSizeAdjustment <= 14) {\n\t\t\t// Too small, just rely now on CSS `overflow-wrap: break-word`\n\t\t\t// We need to recalculate the text measurement here with break-word enabled.\n\t\t\tconst html = renderHtmlFromRichTextForMeasurement(editor, richText)\n\t\t\tconst nextTextSizeWithOverflowBreak = 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: fontSizeAdjustment,\n\t\t\t\tmaxWidth: NOTE_SIZE - LABEL_PADDING * 2 - FUZZ,\n\t\t\t})\n\t\t\tlabelHeight = nextTextSizeWithOverflowBreak.h + LABEL_PADDING * 2\n\t\t\tlabelWidth = nextTextSizeWithOverflowBreak.w + LABEL_PADDING * 2\n\t\t\tbreak\n\t\t}\n\n\t\tif (nextTextSize.scrollWidth.toFixed(0) === nextTextSize.w.toFixed(0)) {\n\t\t\tbreak\n\t\t}\n\t} while (iterations++ < 50)\n\n\treturn {\n\t\tlabelHeight: labelHeight,\n\t\tlabelWidth: labelWidth,\n\t\tfontSizeAdjustment: fontSizeAdjustment,\n\t}\n}\n\nconst labelSizesForNote = new WeakCache<TLShape, ReturnType<typeof getNoteLabelSize>>()\n\nfunction getLabelSize(editor: Editor, shape: TLNoteShape) {\n\treturn labelSizesForNote.get(shape, () => getNoteLabelSize(editor, shape))\n}\n\nfunction useNoteKeydownHandler(id: TLShapeId) {\n\tconst editor = useEditor()\n\tconst translation = useCurrentTranslation()\n\n\treturn useCallback(\n\t\t(e: KeyboardEvent) => {\n\t\t\tconst shape = editor.getShape<TLNoteShape>(id)\n\t\t\tif (!shape) return\n\n\t\t\tconst isTab = e.key === 'Tab'\n\t\t\tconst isCmdEnter = (e.metaKey || e.ctrlKey) && e.key === 'Enter'\n\t\t\tif (isTab || isCmdEnter) {\n\t\t\t\te.preventDefault()\n\n\t\t\t\tconst pageTransform = editor.getShapePageTransform(id)\n\t\t\t\tconst pageRotation = pageTransform.rotation()\n\n\t\t\t\t// Based on the inputs, calculate the offset to the next note\n\t\t\t\t// tab controls x axis (shift inverts direction set by RTL)\n\t\t\t\t// cmd enter is the y axis (shift inverts direction)\n\t\t\t\tconst isRTL = !!(\n\t\t\t\t\ttranslation.dir === 'rtl' ||\n\t\t\t\t\t// todo: can we check a partial of the text, so that we don't have to render the whole thing?\n\t\t\t\t\tisRightToLeftLanguage(renderPlaintextFromRichText(editor, shape.props.richText))\n\t\t\t\t)\n\n\t\t\t\tconst offsetLength =\n\t\t\t\t\t(NOTE_SIZE +\n\t\t\t\t\t\teditor.options.adjacentShapeMargin +\n\t\t\t\t\t\t// If we're growing down, we need to account for the current shape's growY\n\t\t\t\t\t\t(isCmdEnter && !e.shiftKey ? shape.props.growY : 0)) *\n\t\t\t\t\tshape.props.scale\n\n\t\t\t\tconst adjacentCenter = new Vec(\n\t\t\t\t\tisTab ? (e.shiftKey != isRTL ? -1 : 1) : 0,\n\t\t\t\t\tisCmdEnter ? (e.shiftKey ? -1 : 1) : 0\n\t\t\t\t)\n\t\t\t\t\t.mul(offsetLength)\n\t\t\t\t\t.add(NOTE_CENTER_OFFSET.clone().mul(shape.props.scale))\n\t\t\t\t\t.rot(pageRotation)\n\t\t\t\t\t.add(pageTransform.point())\n\n\t\t\t\tconst newNote = getNoteShapeForAdjacentPosition(editor, shape, adjacentCenter, pageRotation)\n\n\t\t\t\tif (newNote) {\n\t\t\t\t\tstartEditingShapeWithLabel(editor, newNote, true /* selectAll */)\n\t\t\t\t}\n\t\t\t}\n\t\t},\n\t\t[id, editor, translation.dir]\n\t)\n}\n\nfunction getNoteHeight(shape: TLNoteShape) {\n\treturn (NOTE_SIZE + shape.props.growY) * shape.props.scale\n}\n\nfunction getNoteShadow(id: string, rotation: number, scale: number) {\n\tconst random = rng(id) // seeded based on id\n\tconst lift = Math.abs(random()) + 0.5 // 0 to 1.5\n\tconst oy = Math.cos(rotation)\n\tconst a = 5 * scale\n\tconst b = 4 * scale\n\tconst c = 6 * scale\n\tconst d = 7 * scale\n\treturn `0px ${a - lift}px ${a}px -${a}px rgba(15, 23, 31, .6),\n\t0px ${(b + lift * d) * Math.max(0, oy)}px ${c + lift * d}px -${b + lift * c}px rgba(15, 23, 31, ${(0.3 + lift * 0.1).toFixed(2)}), \n\t0px ${48 * scale}px ${10 * scale}px -${10 * scale}px inset rgba(15, 23, 44, ${((0.022 + random() * 0.005) * ((1 + oy) / 2)).toFixed(2)})`\n}\n\nfunction getBoundsForSVG(shape: TLNoteShape) {\n\t// When rendering the SVG we don't want to adjust for scale\n\treturn new Box(0, 0, NOTE_SIZE, NOTE_SIZE + shape.props.growY)\n}\n"],
-  "mappings": "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",
+  "sourcesContent": ["/* eslint-disable react-hooks/rules-of-hooks */\nimport {\n\tBox,\n\tEMPTY_ARRAY,\n\tEditor,\n\tGroup2d,\n\tIndexKey,\n\tRectangle2d,\n\tShapeUtil,\n\tSvgExportContext,\n\tTLHandle,\n\tTLNoteShape,\n\tTLNoteShapeProps,\n\tTLResizeInfo,\n\tTLShape,\n\tTLShapeId,\n\tVec,\n\tWeakCache,\n\texhaustiveSwitchError,\n\tgetColorValue,\n\tgetDefaultColorTheme,\n\tgetFontsFromRichText,\n\tisEqual,\n\tlerp,\n\tnoteShapeMigrations,\n\tnoteShapeProps,\n\tresizeScaled,\n\trng,\n\ttoDomPrecision,\n\ttoRichText,\n\tuseEditor,\n\tuseValue,\n} from '@tldraw/editor'\nimport { useCallback } from 'react'\nimport { startEditingShapeWithLabel } from '../../tools/SelectTool/selectHelpers'\nimport { useCurrentTranslation } from '../../ui/hooks/useTranslation/useTranslation'\nimport {\n\tisEmptyRichText,\n\trenderHtmlFromRichTextForMeasurement,\n\trenderPlaintextFromRichText,\n} from '../../utils/text/richText'\nimport { isRightToLeftLanguage } from '../../utils/text/text'\nimport { HyperlinkButton } from '../shared/HyperlinkButton'\nimport { RichTextLabel, RichTextSVG } from '../shared/RichTextLabel'\nimport {\n\tFONT_FAMILIES,\n\tLABEL_FONT_SIZES,\n\tLABEL_PADDING,\n\tTEXT_PROPS,\n} from '../shared/default-shape-constants'\nimport { useDefaultColorTheme } from '../shared/useDefaultColorTheme'\nimport { useIsReadyForEditing } from '../shared/useEditablePlainText'\nimport {\n\tCLONE_HANDLE_MARGIN,\n\tNOTE_CENTER_OFFSET,\n\tNOTE_SIZE,\n\tgetNoteShapeForAdjacentPosition,\n} from './noteHelpers'\n\n/** @public */\nexport interface NoteShapeOptions {\n\t/**\n\t * How should the note shape resize? By default it does not resize (except automatically based on its text content),\n\t * but you can set it to be user-resizable using scale.\n\t */\n\tresizeMode: 'none' | 'scale'\n}\n\n/** @public */\nexport class NoteShapeUtil extends ShapeUtil<TLNoteShape> {\n\tstatic override type = 'note' as const\n\tstatic override props = noteShapeProps\n\tstatic override migrations = noteShapeMigrations\n\n\toverride options: NoteShapeOptions = {\n\t\tresizeMode: 'none',\n\t}\n\n\toverride canEdit() {\n\t\treturn true\n\t}\n\toverride hideResizeHandles() {\n\t\tconst { resizeMode } = this.options\n\t\tswitch (resizeMode) {\n\t\t\tcase 'none': {\n\t\t\t\treturn true\n\t\t\t}\n\t\t\tcase 'scale': {\n\t\t\t\treturn false\n\t\t\t}\n\t\t\tdefault: {\n\t\t\t\tthrow exhaustiveSwitchError(resizeMode)\n\t\t\t}\n\t\t}\n\t}\n\n\toverride isAspectRatioLocked() {\n\t\treturn this.options.resizeMode === 'scale'\n\t}\n\n\toverride hideSelectionBoundsFg() {\n\t\treturn false\n\t}\n\n\tgetDefaultProps(): TLNoteShape['props'] {\n\t\treturn {\n\t\t\tcolor: 'black',\n\t\t\trichText: toRichText(''),\n\t\t\tsize: 'm',\n\t\t\tfont: 'draw',\n\t\t\talign: 'middle',\n\t\t\tverticalAlign: 'middle',\n\t\t\tlabelColor: 'black',\n\t\t\tgrowY: 0,\n\t\t\tfontSizeAdjustment: 0,\n\t\t\turl: '',\n\t\t\tscale: 1,\n\t\t}\n\t}\n\n\tgetGeometry(shape: TLNoteShape) {\n\t\tconst { labelHeight, labelWidth } = getLabelSize(this.editor, shape)\n\t\tconst { scale } = shape.props\n\n\t\tconst lh = labelHeight * scale\n\t\tconst lw = labelWidth * scale\n\t\tconst nw = NOTE_SIZE * scale\n\t\tconst nh = getNoteHeight(shape)\n\n\t\treturn new Group2d({\n\t\t\tchildren: [\n\t\t\t\tnew Rectangle2d({ width: nw, height: nh, isFilled: true }),\n\t\t\t\tnew Rectangle2d({\n\t\t\t\t\tx:\n\t\t\t\t\t\tshape.props.align === 'start'\n\t\t\t\t\t\t\t? 0\n\t\t\t\t\t\t\t: shape.props.align === 'end'\n\t\t\t\t\t\t\t\t? nw - lw\n\t\t\t\t\t\t\t\t: (nw - lw) / 2,\n\t\t\t\t\ty:\n\t\t\t\t\t\tshape.props.verticalAlign === 'start'\n\t\t\t\t\t\t\t? 0\n\t\t\t\t\t\t\t: shape.props.verticalAlign === 'end'\n\t\t\t\t\t\t\t\t? nh - lh\n\t\t\t\t\t\t\t\t: (nh - lh) / 2,\n\t\t\t\t\twidth: lw,\n\t\t\t\t\theight: lh,\n\t\t\t\t\tisFilled: true,\n\t\t\t\t\tisLabel: true,\n\t\t\t\t\texcludeFromShapeBounds: true,\n\t\t\t\t}),\n\t\t\t],\n\t\t})\n\t}\n\n\toverride getHandles(shape: TLNoteShape): TLHandle[] {\n\t\tconst { scale } = shape.props\n\t\tconst isCoarsePointer = this.editor.getInstanceState().isCoarsePointer\n\t\tif (isCoarsePointer) return []\n\n\t\tconst zoom = this.editor.getZoomLevel()\n\t\tif (zoom * scale < 0.25) return []\n\n\t\tconst nh = getNoteHeight(shape)\n\t\tconst nw = NOTE_SIZE * scale\n\t\tconst offset = (CLONE_HANDLE_MARGIN / zoom) * scale\n\n\t\tif (zoom * scale < 0.5) {\n\t\t\treturn [\n\t\t\t\t{\n\t\t\t\t\tid: 'bottom',\n\t\t\t\t\tindex: 'a3' as IndexKey,\n\t\t\t\t\ttype: 'clone',\n\t\t\t\t\tx: nw / 2,\n\t\t\t\t\ty: nh + offset,\n\t\t\t\t},\n\t\t\t]\n\t\t}\n\n\t\treturn [\n\t\t\t{\n\t\t\t\tid: 'top',\n\t\t\t\tindex: 'a1' as IndexKey,\n\t\t\t\ttype: 'clone',\n\t\t\t\tx: nw / 2,\n\t\t\t\ty: -offset,\n\t\t\t},\n\t\t\t{\n\t\t\t\tid: 'right',\n\t\t\t\tindex: 'a2' as IndexKey,\n\t\t\t\ttype: 'clone',\n\t\t\t\tx: nw + offset,\n\t\t\t\ty: nh / 2,\n\t\t\t},\n\t\t\t{\n\t\t\t\tid: 'bottom',\n\t\t\t\tindex: 'a3' as IndexKey,\n\t\t\t\ttype: 'clone',\n\t\t\t\tx: nw / 2,\n\t\t\t\ty: nh + offset,\n\t\t\t},\n\t\t\t{\n\t\t\t\tid: 'left',\n\t\t\t\tindex: 'a4' as IndexKey,\n\t\t\t\ttype: 'clone',\n\t\t\t\tx: -offset,\n\t\t\t\ty: nh / 2,\n\t\t\t},\n\t\t]\n\t}\n\n\toverride onResize(shape: any, info: TLResizeInfo<any>) {\n\t\tconst { resizeMode } = this.options\n\t\tswitch (resizeMode) {\n\t\t\tcase 'none': {\n\t\t\t\treturn undefined\n\t\t\t}\n\t\t\tcase 'scale': {\n\t\t\t\treturn resizeScaled(shape, info)\n\t\t\t}\n\t\t\tdefault: {\n\t\t\t\tthrow exhaustiveSwitchError(resizeMode)\n\t\t\t}\n\t\t}\n\t}\n\n\toverride getText(shape: TLNoteShape) {\n\t\treturn renderPlaintextFromRichText(this.editor, shape.props.richText)\n\t}\n\n\toverride getFontFaces(shape: TLNoteShape) {\n\t\tif (isEmptyRichText(shape.props.richText)) {\n\t\t\treturn EMPTY_ARRAY\n\t\t}\n\t\treturn getFontsFromRichText(this.editor, shape.props.richText, {\n\t\t\tfamily: `tldraw_${shape.props.font}`,\n\t\t\tweight: 'normal',\n\t\t\tstyle: 'normal',\n\t\t})\n\t}\n\n\tcomponent(shape: TLNoteShape) {\n\t\tconst {\n\t\t\tid,\n\t\t\ttype,\n\t\t\tprops: {\n\t\t\t\tlabelColor,\n\t\t\t\tscale,\n\t\t\t\tcolor,\n\t\t\t\tfont,\n\t\t\t\tsize,\n\t\t\t\talign,\n\t\t\t\trichText,\n\t\t\t\tverticalAlign,\n\t\t\t\tfontSizeAdjustment,\n\t\t\t},\n\t\t} = shape\n\n\t\tconst handleKeyDown = useNoteKeydownHandler(id)\n\n\t\tconst theme = useDefaultColorTheme()\n\t\tconst nw = NOTE_SIZE * scale\n\t\tconst nh = getNoteHeight(shape)\n\n\t\tconst rotation = useValue(\n\t\t\t'shape rotation',\n\t\t\t() => this.editor.getShapePageTransform(id)?.rotation() ?? 0,\n\t\t\t[this.editor]\n\t\t)\n\n\t\t// todo: consider hiding shadows on dark mode if they're invisible anyway\n\n\t\tconst hideShadows = useValue('zoom', () => this.editor.getZoomLevel() < 0.35 / scale, [\n\t\t\tscale,\n\t\t\tthis.editor,\n\t\t])\n\n\t\tconst isDarkMode = useValue('dark mode', () => this.editor.user.getIsDarkMode(), [this.editor])\n\n\t\tconst isSelected = shape.id === this.editor.getOnlySelectedShapeId()\n\n\t\tconst isReadyForEditing = useIsReadyForEditing(this.editor, shape.id)\n\t\tconst isEmpty = isEmptyRichText(richText)\n\n\t\treturn (\n\t\t\t<>\n\t\t\t\t<div\n\t\t\t\t\tid={id}\n\t\t\t\t\tclassName=\"tl-note__container\"\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\twidth: nw,\n\t\t\t\t\t\theight: nh,\n\t\t\t\t\t\tbackgroundColor: getColorValue(theme, color, 'noteFill'),\n\t\t\t\t\t\tborderBottom: hideShadows\n\t\t\t\t\t\t\t? isDarkMode\n\t\t\t\t\t\t\t\t? `${2 * scale}px solid rgb(20, 20, 20)`\n\t\t\t\t\t\t\t\t: `${2 * scale}px solid rgb(144, 144, 144)`\n\t\t\t\t\t\t\t: 'none',\n\t\t\t\t\t\tboxShadow: hideShadows ? 'none' : getNoteShadow(shape.id, rotation, scale),\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t{(isSelected || isReadyForEditing || !isEmpty) && (\n\t\t\t\t\t\t<RichTextLabel\n\t\t\t\t\t\t\tshapeId={id}\n\t\t\t\t\t\t\ttype={type}\n\t\t\t\t\t\t\tfont={font}\n\t\t\t\t\t\t\tfontSize={(fontSizeAdjustment || LABEL_FONT_SIZES[size]) * scale}\n\t\t\t\t\t\t\tlineHeight={TEXT_PROPS.lineHeight}\n\t\t\t\t\t\t\talign={align}\n\t\t\t\t\t\t\tverticalAlign={verticalAlign}\n\t\t\t\t\t\t\trichText={richText}\n\t\t\t\t\t\t\tisSelected={isSelected}\n\t\t\t\t\t\t\tlabelColor={\n\t\t\t\t\t\t\t\tlabelColor === 'black'\n\t\t\t\t\t\t\t\t\t? getColorValue(theme, color, 'noteText')\n\t\t\t\t\t\t\t\t\t: getColorValue(theme, labelColor, 'fill')\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\twrap\n\t\t\t\t\t\t\tpadding={LABEL_PADDING * scale}\n\t\t\t\t\t\t\thasCustomTabBehavior\n\t\t\t\t\t\t\tonKeyDown={handleKeyDown}\n\t\t\t\t\t\t/>\n\t\t\t\t\t)}\n\t\t\t\t</div>\n\t\t\t\t{'url' in shape.props && shape.props.url && <HyperlinkButton url={shape.props.url} />}\n\t\t\t</>\n\t\t)\n\t}\n\n\tindicator(shape: TLNoteShape) {\n\t\tconst { scale } = shape.props\n\t\treturn (\n\t\t\t<rect\n\t\t\t\trx={scale}\n\t\t\t\twidth={toDomPrecision(NOTE_SIZE * scale)}\n\t\t\t\theight={toDomPrecision(getNoteHeight(shape))}\n\t\t\t/>\n\t\t)\n\t}\n\n\toverride toSvg(shape: TLNoteShape, ctx: SvgExportContext) {\n\t\tconst theme = getDefaultColorTheme({ isDarkMode: ctx.isDarkMode })\n\t\tconst bounds = getBoundsForSVG(shape)\n\n\t\tconst textLabel = (\n\t\t\t<RichTextSVG\n\t\t\t\tfontSize={shape.props.fontSizeAdjustment || LABEL_FONT_SIZES[shape.props.size]}\n\t\t\t\tfont={shape.props.font}\n\t\t\t\talign={shape.props.align}\n\t\t\t\tverticalAlign={shape.props.verticalAlign}\n\t\t\t\trichText={shape.props.richText}\n\t\t\t\tlabelColor={getColorValue(theme, shape.props.color, 'noteText')}\n\t\t\t\tbounds={bounds}\n\t\t\t\tpadding={LABEL_PADDING}\n\t\t\t\tshowTextOutline={false}\n\t\t\t/>\n\t\t)\n\n\t\treturn (\n\t\t\t<>\n\t\t\t\t<rect x={5} y={5} rx={1} width={NOTE_SIZE - 10} height={bounds.h} fill=\"rgba(0,0,0,.1)\" />\n\t\t\t\t<rect\n\t\t\t\t\trx={1}\n\t\t\t\t\twidth={NOTE_SIZE}\n\t\t\t\t\theight={bounds.h}\n\t\t\t\t\tfill={getColorValue(theme, shape.props.color, 'noteFill')}\n\t\t\t\t/>\n\t\t\t\t{textLabel}\n\t\t\t</>\n\t\t)\n\t}\n\n\toverride onBeforeCreate(next: TLNoteShape) {\n\t\treturn getNoteSizeAdjustments(this.editor, next)\n\t}\n\n\toverride onBeforeUpdate(prev: TLNoteShape, next: TLNoteShape) {\n\t\tif (\n\t\t\tisEqual(prev.props.richText, next.props.richText) &&\n\t\t\tprev.props.font === next.props.font &&\n\t\t\tprev.props.size === next.props.size\n\t\t) {\n\t\t\treturn\n\t\t}\n\n\t\treturn getNoteSizeAdjustments(this.editor, next)\n\t}\n\n\toverride getInterpolatedProps(\n\t\tstartShape: TLNoteShape,\n\t\tendShape: TLNoteShape,\n\t\tt: number\n\t): TLNoteShapeProps {\n\t\treturn {\n\t\t\t...(t > 0.5 ? endShape.props : startShape.props),\n\t\t\tscale: lerp(startShape.props.scale, endShape.props.scale, t),\n\t\t}\n\t}\n}\n\n/**\n * Get the growY and fontSizeAdjustment for a shape.\n */\nfunction getNoteSizeAdjustments(editor: Editor, shape: TLNoteShape) {\n\tconst { labelHeight, fontSizeAdjustment } = getLabelSize(editor, shape)\n\t// When the label height is more than the height of the shape, we add extra height to it\n\tconst growY = Math.max(0, labelHeight - NOTE_SIZE)\n\n\tif (growY !== shape.props.growY || fontSizeAdjustment !== shape.props.fontSizeAdjustment) {\n\t\treturn {\n\t\t\t...shape,\n\t\t\tprops: {\n\t\t\t\t...shape.props,\n\t\t\t\tgrowY,\n\t\t\t\tfontSizeAdjustment,\n\t\t\t},\n\t\t}\n\t}\n}\n\n/**\n * Get the label size for a note.\n */\nfunction getNoteLabelSize(editor: Editor, shape: TLNoteShape) {\n\tconst { richText } = shape.props\n\n\tif (isEmptyRichText(richText)) {\n\t\tconst minHeight = LABEL_FONT_SIZES[shape.props.size] * TEXT_PROPS.lineHeight + LABEL_PADDING * 2\n\t\treturn { labelHeight: minHeight, labelWidth: 100, fontSizeAdjustment: 0 }\n\t}\n\n\tconst unadjustedFontSize = LABEL_FONT_SIZES[shape.props.size]\n\n\tlet fontSizeAdjustment = 0\n\tlet iterations = 0\n\tlet labelHeight = NOTE_SIZE\n\tlet labelWidth = NOTE_SIZE\n\n\t// N.B. For some note shapes with text like 'hjhjhjhjhjhjhjhj', you'll run into\n\t// some text measurement fuzziness where the browser swears there's no overflow (scrollWidth === width)\n\t// but really there is when you enable overflow-wrap again. This helps account for that little bit\n\t// of give.\n\tconst FUZZ = 1\n\n\t// We slightly make the font smaller if the text is too big for the note, width-wise.\n\tdo {\n\t\tfontSizeAdjustment = Math.min(unadjustedFontSize, unadjustedFontSize - iterations)\n\t\tconst html = renderHtmlFromRichTextForMeasurement(editor, richText)\n\t\tconst nextTextSize = editor.textMeasure.measureHtml(html, {\n\t\t\t...TEXT_PROPS,\n\t\t\tfontFamily: FONT_FAMILIES[shape.props.font],\n\t\t\tfontSize: fontSizeAdjustment,\n\t\t\tmaxWidth: NOTE_SIZE - LABEL_PADDING * 2 - FUZZ,\n\t\t\tdisableOverflowWrapBreaking: true,\n\t\t\tmeasureScrollWidth: true,\n\t\t})\n\n\t\tlabelHeight = nextTextSize.h + LABEL_PADDING * 2\n\t\tlabelWidth = nextTextSize.w + LABEL_PADDING * 2\n\n\t\tif (fontSizeAdjustment <= 14) {\n\t\t\t// Too small, just rely now on CSS `overflow-wrap: break-word`\n\t\t\t// We need to recalculate the text measurement here with break-word enabled.\n\t\t\tconst html = renderHtmlFromRichTextForMeasurement(editor, richText)\n\t\t\tconst nextTextSizeWithOverflowBreak = 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: fontSizeAdjustment,\n\t\t\t\tmaxWidth: NOTE_SIZE - LABEL_PADDING * 2 - FUZZ,\n\t\t\t})\n\t\t\tlabelHeight = nextTextSizeWithOverflowBreak.h + LABEL_PADDING * 2\n\t\t\tlabelWidth = nextTextSizeWithOverflowBreak.w + LABEL_PADDING * 2\n\t\t\tbreak\n\t\t}\n\n\t\tif (nextTextSize.scrollWidth.toFixed(0) === nextTextSize.w.toFixed(0)) {\n\t\t\tbreak\n\t\t}\n\t} while (iterations++ < 50)\n\n\treturn {\n\t\tlabelHeight: labelHeight,\n\t\tlabelWidth: labelWidth,\n\t\tfontSizeAdjustment: fontSizeAdjustment,\n\t}\n}\n\nconst labelSizesForNote = new WeakCache<TLShape, ReturnType<typeof getNoteLabelSize>>()\n\nfunction getLabelSize(editor: Editor, shape: TLNoteShape) {\n\treturn labelSizesForNote.get(shape, () => getNoteLabelSize(editor, shape))\n}\n\nfunction useNoteKeydownHandler(id: TLShapeId) {\n\tconst editor = useEditor()\n\tconst translation = useCurrentTranslation()\n\n\treturn useCallback(\n\t\t(e: KeyboardEvent) => {\n\t\t\tconst shape = editor.getShape<TLNoteShape>(id)\n\t\t\tif (!shape) return\n\n\t\t\tconst isTab = e.key === 'Tab'\n\t\t\tconst isCmdEnter = (e.metaKey || e.ctrlKey) && e.key === 'Enter'\n\t\t\tif (isTab || isCmdEnter) {\n\t\t\t\te.preventDefault()\n\n\t\t\t\tconst pageTransform = editor.getShapePageTransform(id)\n\t\t\t\tconst pageRotation = pageTransform.rotation()\n\n\t\t\t\t// Based on the inputs, calculate the offset to the next note\n\t\t\t\t// tab controls x axis (shift inverts direction set by RTL)\n\t\t\t\t// cmd enter is the y axis (shift inverts direction)\n\t\t\t\tconst isRTL = !!(\n\t\t\t\t\ttranslation.dir === 'rtl' ||\n\t\t\t\t\t// todo: can we check a partial of the text, so that we don't have to render the whole thing?\n\t\t\t\t\tisRightToLeftLanguage(renderPlaintextFromRichText(editor, shape.props.richText))\n\t\t\t\t)\n\n\t\t\t\tconst offsetLength =\n\t\t\t\t\t(NOTE_SIZE +\n\t\t\t\t\t\teditor.options.adjacentShapeMargin +\n\t\t\t\t\t\t// If we're growing down, we need to account for the current shape's growY\n\t\t\t\t\t\t(isCmdEnter && !e.shiftKey ? shape.props.growY : 0)) *\n\t\t\t\t\tshape.props.scale\n\n\t\t\t\tconst adjacentCenter = new Vec(\n\t\t\t\t\tisTab ? (e.shiftKey != isRTL ? -1 : 1) : 0,\n\t\t\t\t\tisCmdEnter ? (e.shiftKey ? -1 : 1) : 0\n\t\t\t\t)\n\t\t\t\t\t.mul(offsetLength)\n\t\t\t\t\t.add(NOTE_CENTER_OFFSET.clone().mul(shape.props.scale))\n\t\t\t\t\t.rot(pageRotation)\n\t\t\t\t\t.add(pageTransform.point())\n\n\t\t\t\tconst newNote = getNoteShapeForAdjacentPosition(editor, shape, adjacentCenter, pageRotation)\n\n\t\t\t\tif (newNote) {\n\t\t\t\t\tstartEditingShapeWithLabel(editor, newNote, true /* selectAll */)\n\t\t\t\t}\n\t\t\t}\n\t\t},\n\t\t[id, editor, translation.dir]\n\t)\n}\n\nfunction getNoteHeight(shape: TLNoteShape) {\n\treturn (NOTE_SIZE + shape.props.growY) * shape.props.scale\n}\n\nfunction getNoteShadow(id: string, rotation: number, scale: number) {\n\tconst random = rng(id) // seeded based on id\n\tconst lift = Math.abs(random()) + 0.5 // 0 to 1.5\n\tconst oy = Math.cos(rotation)\n\tconst a = 5 * scale\n\tconst b = 4 * scale\n\tconst c = 6 * scale\n\tconst d = 7 * scale\n\treturn `0px ${a - lift}px ${a}px -${a}px rgba(15, 23, 31, .6),\n\t0px ${(b + lift * d) * Math.max(0, oy)}px ${c + lift * d}px -${b + lift * c}px rgba(15, 23, 31, ${(0.3 + lift * 0.1).toFixed(2)}), \n\t0px ${48 * scale}px ${10 * scale}px -${10 * scale}px inset rgba(15, 23, 44, ${((0.022 + random() * 0.005) * ((1 + oy) / 2)).toFixed(2)})`\n}\n\nfunction getBoundsForSVG(shape: TLNoteShape) {\n\t// When rendering the SVG we don't want to adjust for scale\n\treturn new Box(0, 0, NOTE_SIZE, NOTE_SIZE + shape.props.growY)\n}\n"],
+  "mappings": "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",
   "names": ["html"]
 }

package/dist-cjs/lib/shapes/shared/HyperlinkButton.js CHANGED Viewed

@@ -39,9 +39,9 @@ const LINK_ICON = "data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg'
 function HyperlinkButton({ url }) {
   const editor = (0, import_editor.useEditor)();
   const hideButton = (0, import_editor.useValue)("zoomLevel", () => editor.getZoomLevel() < 0.32, [editor]);
-  const useStopPropagationOnShiftKey = (0, import_react.useCallback)(
+  const markAsHandledOnShiftKey = (0, import_react.useCallback)(
     (e) => {
-      if (!editor.inputs.shiftKey) (0, import_editor.stopEventPropagation)(e);
+      if (!editor.inputs.shiftKey) (0, import_editor.markEventAsHandled)(e);
     },
     [editor]
   );
@@ -54,8 +54,8 @@ function HyperlinkButton({ url }) {
       href: url,
       target: "_blank",
       rel: "noopener noreferrer",
-      onPointerDown: useStopPropagationOnShiftKey,
-      onPointerUp: useStopPropagationOnShiftKey,
+      onPointerDown: markAsHandledOnShiftKey,
+      onPointerUp: markAsHandledOnShiftKey,
       title: url,
       draggable: false,
       children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(

package/dist-cjs/lib/shapes/shared/HyperlinkButton.js.map CHANGED Viewed

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/lib/shapes/shared/HyperlinkButton.tsx"],
-  "sourcesContent": ["import { stopEventPropagation, useEditor, useValue } from '@tldraw/editor'\nimport classNames from 'classnames'\nimport { PointerEventHandler, useCallback } from 'react'\n\nconst LINK_ICON =\n\t\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='30' height='30' fill='none'%3E%3Cpath stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M13 5H7a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2v-6M19 5h6m0 0v6m0-6L13 17'/%3E%3C/svg%3E\"\n\nexport function HyperlinkButton({ url }: { url: string }) {\n\tconst editor = useEditor()\n\tconst hideButton = useValue('zoomLevel', () => editor.getZoomLevel() < 0.32, [editor])\n\tconst useStopPropagationOnShiftKey = useCallback<PointerEventHandler>(\n\t\t(e) => {\n\t\t\tif (!editor.inputs.shiftKey) stopEventPropagation(e)\n\t\t},\n\t\t[editor]\n\t)\n\treturn (\n\t\t<a\n\t\t\tclassName={classNames('tl-hyperlink-button', {\n\t\t\t\t'tl-hyperlink-button__hidden': hideButton,\n\t\t\t})}\n\t\t\thref={url}\n\t\t\ttarget=\"_blank\"\n\t\t\trel=\"noopener noreferrer\"\n\t\t\tonPointerDown={useStopPropagationOnShiftKey}\n\t\t\tonPointerUp={useStopPropagationOnShiftKey}\n\t\t\ttitle={url}\n\t\t\tdraggable={false}\n\t\t>\n\t\t\t<div\n\t\t\t\tclassName=\"tl-hyperlink__icon\"\n\t\t\t\tstyle={{\n\t\t\t\t\tmask: `url(\"${LINK_ICON}\") center 100% / 100% no-repeat`,\n\t\t\t\t\tWebkitMask: `url(\"${LINK_ICON}\") center 100% / 100% no-repeat`,\n\t\t\t\t}}\n\t\t\t/>\n\t\t</a>\n\t)\n}\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AA6BG;AA7BH,oBAA0D;AAC1D,wBAAuB;AACvB,mBAAiD;AAEjD,MAAM,YACL;AAEM,SAAS,gBAAgB,EAAE,IAAI,GAAoB;AACzD,QAAM,aAAS,yBAAU;AACzB,QAAM,iBAAa,wBAAS,aAAa,MAAM,OAAO,aAAa,IAAI,MAAM,CAAC,MAAM,CAAC;AACrF,QAAM,mCAA+B;AAAA,IACpC,CAAC,MAAM;AACN,UAAI,CAAC,OAAO,OAAO,SAAU,yCAAqB,CAAC;AAAA,IACpD;AAAA,IACA,CAAC,MAAM;AAAA,EACR;AACA,SACC;AAAA,IAAC;AAAA;AAAA,MACA,eAAW,kBAAAA,SAAW,uBAAuB;AAAA,QAC5C,+BAA+B;AAAA,MAChC,CAAC;AAAA,MACD,MAAM;AAAA,MACN,QAAO;AAAA,MACP,KAAI;AAAA,MACJ,eAAe;AAAA,MACf,aAAa;AAAA,MACb,OAAO;AAAA,MACP,WAAW;AAAA,MAEX;AAAA,QAAC;AAAA;AAAA,UACA,WAAU;AAAA,UACV,OAAO;AAAA,YACN,MAAM,QAAQ,SAAS;AAAA,YACvB,YAAY,QAAQ,SAAS;AAAA,UAC9B;AAAA;AAAA,MACD;AAAA;AAAA,EACD;AAEF;",
+  "sourcesContent": ["import { markEventAsHandled, useEditor, useValue } from '@tldraw/editor'\nimport classNames from 'classnames'\nimport { PointerEventHandler, useCallback } from 'react'\n\nconst LINK_ICON =\n\t\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='30' height='30' fill='none'%3E%3Cpath stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M13 5H7a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2v-6M19 5h6m0 0v6m0-6L13 17'/%3E%3C/svg%3E\"\n\nexport function HyperlinkButton({ url }: { url: string }) {\n\tconst editor = useEditor()\n\tconst hideButton = useValue('zoomLevel', () => editor.getZoomLevel() < 0.32, [editor])\n\tconst markAsHandledOnShiftKey = useCallback<PointerEventHandler>(\n\t\t(e) => {\n\t\t\tif (!editor.inputs.shiftKey) markEventAsHandled(e)\n\t\t},\n\t\t[editor]\n\t)\n\treturn (\n\t\t<a\n\t\t\tclassName={classNames('tl-hyperlink-button', {\n\t\t\t\t'tl-hyperlink-button__hidden': hideButton,\n\t\t\t})}\n\t\t\thref={url}\n\t\t\ttarget=\"_blank\"\n\t\t\trel=\"noopener noreferrer\"\n\t\t\tonPointerDown={markAsHandledOnShiftKey}\n\t\t\tonPointerUp={markAsHandledOnShiftKey}\n\t\t\ttitle={url}\n\t\t\tdraggable={false}\n\t\t>\n\t\t\t<div\n\t\t\t\tclassName=\"tl-hyperlink__icon\"\n\t\t\t\tstyle={{\n\t\t\t\t\tmask: `url(\"${LINK_ICON}\") center 100% / 100% no-repeat`,\n\t\t\t\t\tWebkitMask: `url(\"${LINK_ICON}\") center 100% / 100% no-repeat`,\n\t\t\t\t}}\n\t\t\t/>\n\t\t</a>\n\t)\n}\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AA6BG;AA7BH,oBAAwD;AACxD,wBAAuB;AACvB,mBAAiD;AAEjD,MAAM,YACL;AAEM,SAAS,gBAAgB,EAAE,IAAI,GAAoB;AACzD,QAAM,aAAS,yBAAU;AACzB,QAAM,iBAAa,wBAAS,aAAa,MAAM,OAAO,aAAa,IAAI,MAAM,CAAC,MAAM,CAAC;AACrF,QAAM,8BAA0B;AAAA,IAC/B,CAAC,MAAM;AACN,UAAI,CAAC,OAAO,OAAO,SAAU,uCAAmB,CAAC;AAAA,IAClD;AAAA,IACA,CAAC,MAAM;AAAA,EACR;AACA,SACC;AAAA,IAAC;AAAA;AAAA,MACA,eAAW,kBAAAA,SAAW,uBAAuB;AAAA,QAC5C,+BAA+B;AAAA,MAChC,CAAC;AAAA,MACD,MAAM;AAAA,MACN,QAAO;AAAA,MACP,KAAI;AAAA,MACJ,eAAe;AAAA,MACf,aAAa;AAAA,MACb,OAAO;AAAA,MACP,WAAW;AAAA,MAEX;AAAA,QAAC;AAAA;AAAA,UACA,WAAU;AAAA,UACV,OAAO;AAAA,YACN,MAAM,QAAQ,SAAS;AAAA,YACvB,YAAY,QAAQ,SAAS;AAAA,UAC9B;AAAA;AAAA,MACD;AAAA;AAAA,EACD;AAEF;",
   "names": ["classNames"]
 }

package/dist-cjs/lib/shapes/shared/useEditablePlainText.js CHANGED Viewed

@@ -116,7 +116,7 @@ function useEditableTextCommon(shapeId) {
         target: "shape",
         shape: editor.getShape(shapeId)
       });
-      (0, import_editor.stopEventPropagation)(e);
+      e.stopPropagation();
     },
     [editor, shapeId]
   );
@@ -134,11 +134,12 @@ function useEditableTextCommon(shapeId) {
     },
     [editor, shapeId]
   );
+  const handleDoubleClick = import_editor.markEventAsHandled;
   return {
     handleFocus: import_editor.noop,
     handleBlur: import_editor.noop,
     handleInputPointerDown,
-    handleDoubleClick: import_editor.stopEventPropagation,
+    handleDoubleClick,
     handlePaste,
     isEditing,
     isReadyForEditing

package/dist-cjs/lib/shapes/shared/useEditablePlainText.js.map CHANGED Viewed

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/lib/shapes/shared/useEditablePlainText.ts"],
-  "sourcesContent": ["import {\n\tEditor,\n\tTLShapeId,\n\tTLUnknownShape,\n\tgetPointerInfo,\n\tnoop,\n\tpreventDefault,\n\tstopEventPropagation,\n\ttlenv,\n\tuseEditor,\n\tuseValue,\n} from '@tldraw/editor'\nimport React, { useCallback, useEffect, useRef } from 'react'\nimport { TextHelpers } from './TextHelpers'\n\n/** @public */\nexport function useEditablePlainText(shapeId: TLShapeId, type: string, text?: string) {\n\tconst commonUseEditableTextHandlers = useEditableTextCommon(shapeId)\n\tconst isEditing = commonUseEditableTextHandlers.isEditing\n\tconst editor = useEditor()\n\tconst rInput = useRef<HTMLTextAreaElement>(null)\n\tconst isEmpty = (text || '').trim().length === 0\n\n\tuseEffect(() => {\n\t\tfunction selectAllIfEditing(event: { shapeId: TLShapeId }) {\n\t\t\tif (event.shapeId === shapeId) {\n\t\t\t\trInput.current?.select?.()\n\t\t\t}\n\t\t}\n\n\t\teditor.on('select-all-text', selectAllIfEditing)\n\t\treturn () => {\n\t\t\teditor.off('select-all-text', selectAllIfEditing)\n\t\t}\n\t}, [editor, shapeId, isEditing])\n\n\tuseEffect(() => {\n\t\tif (!isEditing) return\n\n\t\tif (document.activeElement !== rInput.current) {\n\t\t\trInput.current?.focus()\n\t\t}\n\n\t\tif (editor.getInstanceState().isCoarsePointer) {\n\t\t\trInput.current?.select()\n\t\t}\n\n\t\t// XXX(mime): This fixes iOS not showing the caret sometimes.\n\t\t// This \"shakes\" the caret awake.\n\t\tif (tlenv.isSafari) {\n\t\t\trInput.current?.blur()\n\t\t\trInput.current?.focus()\n\t\t}\n\t}, [editor, isEditing])\n\n\t// When the user presses ctrl / meta enter, complete the editing state.\n\tconst handleKeyDown = useCallback(\n\t\t(e: KeyboardEvent) => {\n\t\t\tif (editor.getEditingShapeId() !== shapeId) return\n\n\t\t\tswitch (e.key) {\n\t\t\t\tcase 'Enter': {\n\t\t\t\t\tif (e.ctrlKey || e.metaKey) {\n\t\t\t\t\t\teditor.complete()\n\t\t\t\t\t}\n\t\t\t\t\tbreak\n\t\t\t\t}\n\t\t\t}\n\t\t},\n\t\t[editor, shapeId]\n\t)\n\n\t// When the text changes, update the text value.\n\tconst handleChange = useCallback(\n\t\t({ plaintext }: { plaintext: string }) => {\n\t\t\tif (editor.getEditingShapeId() !== shapeId) return\n\n\t\t\tconst normalizedPlaintext = TextHelpers.normalizeText(plaintext || '')\n\t\t\teditor.updateShape<TLUnknownShape & { props: { text: string } }>({\n\t\t\t\tid: shapeId,\n\t\t\t\ttype,\n\t\t\t\tprops: { text: normalizedPlaintext },\n\t\t\t})\n\t\t},\n\t\t[editor, shapeId, type]\n\t)\n\n\treturn {\n\t\trInput,\n\t\thandleKeyDown,\n\t\thandleChange,\n\t\tisEmpty,\n\t\t...commonUseEditableTextHandlers,\n\t}\n}\n\n/** @internal */\nexport function useIsReadyForEditing(editor: Editor, shapeId: TLShapeId) {\n\treturn useValue(\n\t\t'isReadyForEditing',\n\t\t() => {\n\t\t\tconst editingShapeId = editor.getEditingShapeId()\n\t\t\treturn (\n\t\t\t\t// something's being editing... and either it's this shape OR this shape is hovered\n\t\t\t\teditingShapeId !== null &&\n\t\t\t\t(editingShapeId === shapeId || editor.getHoveredShapeId() === shapeId)\n\t\t\t)\n\t\t},\n\t\t[editor, shapeId]\n\t)\n}\n\n/** @internal */\nexport function useEditableTextCommon(shapeId: TLShapeId) {\n\tconst editor = useEditor()\n\tconst isEditing = useValue('isEditing', () => editor.getEditingShapeId() === shapeId, [editor])\n\tconst isReadyForEditing = useIsReadyForEditing(editor, shapeId)\n\n\tconst handleInputPointerDown = useCallback(\n\t\t(e: React.PointerEvent) => {\n\t\t\t// N.B. We used to only do this only when isEditing to help\n\t\t\t// prevent an issue where you could drag a selected shape\n\t\t\t// behind another shape. That is addressed now by the CSS logic\n\t\t\t// looking at data-isselectinganything.\n\t\t\t//\n\t\t\t// We still need to follow this logic even if not isEditing\n\t\t\t// because otherwise there is some flakiness in selection.\n\t\t\t// When selecting text, it would sometimes select some text\n\t\t\t// partially if we didn't dispatch/stop below.\n\n\t\t\teditor.dispatch({\n\t\t\t\t...getPointerInfo(e),\n\t\t\t\ttype: 'pointer',\n\t\t\t\tname: 'pointer_down',\n\t\t\t\ttarget: 'shape',\n\t\t\t\tshape: editor.getShape(shapeId)!,\n\t\t\t})\n\n\t\t\tstopEventPropagation(e) // we need to prevent blurring the input\n\t\t},\n\t\t[editor, shapeId]\n\t)\n\n\tconst handlePaste = useCallback(\n\t\t(e: ClipboardEvent | React.ClipboardEvent<HTMLTextAreaElement>) => {\n\t\t\tif (editor.getEditingShapeId() !== shapeId) return\n\t\t\tif (e.clipboardData) {\n\t\t\t\t// find html in the clipboard and look for the tldraw data\n\t\t\t\tconst html = e.clipboardData.getData('text/html')\n\t\t\t\tif (html) {\n\t\t\t\t\tif (html.includes('<div data-tldraw')) {\n\t\t\t\t\t\tpreventDefault(e)\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t},\n\t\t[editor, shapeId]\n\t)\n\n\treturn {\n\t\thandleFocus: noop,\n\t\thandleBlur: noop,\n\t\thandleInputPointerDown,\n\t\thandleDoubleClick: stopEventPropagation,\n\t\thandlePaste,\n\t\tisEditing,\n\t\tisReadyForEditing,\n\t}\n}\n"],
-  "mappings": "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",
+  "sourcesContent": ["import {\n\tEditor,\n\tTLShapeId,\n\tTLUnknownShape,\n\tgetPointerInfo,\n\tmarkEventAsHandled,\n\tnoop,\n\tpreventDefault,\n\ttlenv,\n\tuseEditor,\n\tuseValue,\n} from '@tldraw/editor'\nimport React, { useCallback, useEffect, useRef } from 'react'\nimport { TextHelpers } from './TextHelpers'\n\n/** @public */\nexport function useEditablePlainText(shapeId: TLShapeId, type: string, text?: string) {\n\tconst commonUseEditableTextHandlers = useEditableTextCommon(shapeId)\n\tconst isEditing = commonUseEditableTextHandlers.isEditing\n\tconst editor = useEditor()\n\tconst rInput = useRef<HTMLTextAreaElement>(null)\n\tconst isEmpty = (text || '').trim().length === 0\n\n\tuseEffect(() => {\n\t\tfunction selectAllIfEditing(event: { shapeId: TLShapeId }) {\n\t\t\tif (event.shapeId === shapeId) {\n\t\t\t\trInput.current?.select?.()\n\t\t\t}\n\t\t}\n\n\t\teditor.on('select-all-text', selectAllIfEditing)\n\t\treturn () => {\n\t\t\teditor.off('select-all-text', selectAllIfEditing)\n\t\t}\n\t}, [editor, shapeId, isEditing])\n\n\tuseEffect(() => {\n\t\tif (!isEditing) return\n\n\t\tif (document.activeElement !== rInput.current) {\n\t\t\trInput.current?.focus()\n\t\t}\n\n\t\tif (editor.getInstanceState().isCoarsePointer) {\n\t\t\trInput.current?.select()\n\t\t}\n\n\t\t// XXX(mime): This fixes iOS not showing the caret sometimes.\n\t\t// This \"shakes\" the caret awake.\n\t\tif (tlenv.isSafari) {\n\t\t\trInput.current?.blur()\n\t\t\trInput.current?.focus()\n\t\t}\n\t}, [editor, isEditing])\n\n\t// When the user presses ctrl / meta enter, complete the editing state.\n\tconst handleKeyDown = useCallback(\n\t\t(e: KeyboardEvent) => {\n\t\t\tif (editor.getEditingShapeId() !== shapeId) return\n\n\t\t\tswitch (e.key) {\n\t\t\t\tcase 'Enter': {\n\t\t\t\t\tif (e.ctrlKey || e.metaKey) {\n\t\t\t\t\t\teditor.complete()\n\t\t\t\t\t}\n\t\t\t\t\tbreak\n\t\t\t\t}\n\t\t\t}\n\t\t},\n\t\t[editor, shapeId]\n\t)\n\n\t// When the text changes, update the text value.\n\tconst handleChange = useCallback(\n\t\t({ plaintext }: { plaintext: string }) => {\n\t\t\tif (editor.getEditingShapeId() !== shapeId) return\n\n\t\t\tconst normalizedPlaintext = TextHelpers.normalizeText(plaintext || '')\n\t\t\teditor.updateShape<TLUnknownShape & { props: { text: string } }>({\n\t\t\t\tid: shapeId,\n\t\t\t\ttype,\n\t\t\t\tprops: { text: normalizedPlaintext },\n\t\t\t})\n\t\t},\n\t\t[editor, shapeId, type]\n\t)\n\n\treturn {\n\t\trInput,\n\t\thandleKeyDown,\n\t\thandleChange,\n\t\tisEmpty,\n\t\t...commonUseEditableTextHandlers,\n\t}\n}\n\n/** @internal */\nexport function useIsReadyForEditing(editor: Editor, shapeId: TLShapeId) {\n\treturn useValue(\n\t\t'isReadyForEditing',\n\t\t() => {\n\t\t\tconst editingShapeId = editor.getEditingShapeId()\n\t\t\treturn (\n\t\t\t\t// something's being editing... and either it's this shape OR this shape is hovered\n\t\t\t\teditingShapeId !== null &&\n\t\t\t\t(editingShapeId === shapeId || editor.getHoveredShapeId() === shapeId)\n\t\t\t)\n\t\t},\n\t\t[editor, shapeId]\n\t)\n}\n\n/** @internal */\nexport function useEditableTextCommon(shapeId: TLShapeId) {\n\tconst editor = useEditor()\n\tconst isEditing = useValue('isEditing', () => editor.getEditingShapeId() === shapeId, [editor])\n\tconst isReadyForEditing = useIsReadyForEditing(editor, shapeId)\n\n\tconst handleInputPointerDown = useCallback(\n\t\t(e: React.PointerEvent) => {\n\t\t\t// N.B. We used to only do this only when isEditing to help\n\t\t\t// prevent an issue where you could drag a selected shape\n\t\t\t// behind another shape. That is addressed now by the CSS logic\n\t\t\t// looking at data-isselectinganything.\n\t\t\t//\n\t\t\t// We still need to follow this logic even if not isEditing\n\t\t\t// because otherwise there is some flakiness in selection.\n\t\t\t// When selecting text, it would sometimes select some text\n\t\t\t// partially if we didn't dispatch/stop below.\n\n\t\t\teditor.dispatch({\n\t\t\t\t...getPointerInfo(e),\n\t\t\t\ttype: 'pointer',\n\t\t\t\tname: 'pointer_down',\n\t\t\t\ttarget: 'shape',\n\t\t\t\tshape: editor.getShape(shapeId)!,\n\t\t\t})\n\n\t\t\te.stopPropagation() // we need to prevent blurring the input\n\t\t},\n\t\t[editor, shapeId]\n\t)\n\n\tconst handlePaste = useCallback(\n\t\t(e: ClipboardEvent | React.ClipboardEvent<HTMLTextAreaElement>) => {\n\t\t\tif (editor.getEditingShapeId() !== shapeId) return\n\t\t\tif (e.clipboardData) {\n\t\t\t\t// find html in the clipboard and look for the tldraw data\n\t\t\t\tconst html = e.clipboardData.getData('text/html')\n\t\t\t\tif (html) {\n\t\t\t\t\tif (html.includes('<div data-tldraw')) {\n\t\t\t\t\t\tpreventDefault(e)\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t},\n\t\t[editor, shapeId]\n\t)\n\n\tconst handleDoubleClick: (e: React.MouseEvent) => void = markEventAsHandled\n\n\treturn {\n\t\thandleFocus: noop,\n\t\thandleBlur: noop,\n\t\thandleInputPointerDown,\n\t\thandleDoubleClick,\n\t\thandlePaste,\n\t\tisEditing,\n\t\tisReadyForEditing,\n\t}\n}\n"],
+  "mappings": "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",
   "names": []
 }

package/dist-cjs/lib/shapes/text/PlainTextArea.js CHANGED Viewed

@@ -70,8 +70,8 @@ const PlainTextArea = import_react.default.forwardRef(function TextArea({
       onChange,
       onKeyDown: (e) => handleKeyDown(e.nativeEvent),
       onBlur: handleBlur,
-      onTouchEnd: import_editor.stopEventPropagation,
-      onContextMenu: isEditing ? import_editor.stopEventPropagation : void 0,
+      onTouchEnd: import_editor.markEventAsHandled,
+      onContextMenu: isEditing ? (e) => e.stopPropagation() : void 0,
       onPointerDown: handleInputPointerDown,
       onPaste: handlePaste,
       onDoubleClick: handleDoubleClick,

package/dist-cjs/lib/shapes/text/PlainTextArea.js.map CHANGED Viewed

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/lib/shapes/text/PlainTextArea.tsx"],
-  "sourcesContent": ["import { preventDefault, stopEventPropagation } from '@tldraw/editor'\nimport React from 'react'\nimport { TextAreaProps } from './RichTextArea'\n\n/**\n * A plain text area that can be used for basic editing text.\n *\n * @public @react\n */\nexport const PlainTextArea = React.forwardRef<HTMLTextAreaElement, TextAreaProps>(function TextArea(\n\t{\n\t\tisEditing,\n\t\ttext,\n\t\thandleFocus,\n\t\thandleChange,\n\t\thandleKeyDown,\n\t\thandlePaste,\n\t\thandleBlur,\n\t\thandleInputPointerDown,\n\t\thandleDoubleClick,\n\t},\n\tref\n) {\n\tconst onChange = (e: React.ChangeEvent<HTMLTextAreaElement>) => {\n\t\thandleChange({ plaintext: e.target.value })\n\t}\n\n\treturn (\n\t\t<textarea\n\t\t\tref={ref}\n\t\t\tclassName=\"tl-text tl-text-input\"\n\t\t\tname=\"text\"\n\t\t\ttabIndex={-1}\n\t\t\tdisabled={!isEditing}\n\t\t\treadOnly={!isEditing}\n\t\t\tautoComplete=\"off\"\n\t\t\tautoCapitalize=\"off\"\n\t\t\tautoCorrect=\"off\"\n\t\t\tautoSave=\"off\"\n\t\t\tplaceholder=\"\"\n\t\t\tspellCheck=\"true\"\n\t\t\twrap=\"off\"\n\t\t\tdir=\"auto\"\n\t\t\tdefaultValue={text}\n\t\t\tonFocus={handleFocus}\n\t\t\tonChange={onChange}\n\t\t\tonKeyDown={(e) => handleKeyDown(e.nativeEvent)}\n\t\t\tonBlur={handleBlur}\n\t\t\tonTouchEnd={stopEventPropagation}\n\t\t\tonContextMenu={isEditing ? stopEventPropagation : undefined}\n\t\t\tonPointerDown={handleInputPointerDown}\n\t\t\tonPaste={handlePaste}\n\t\t\tonDoubleClick={handleDoubleClick}\n\t\t\t// On FF, there's a behavior where dragging a selection will grab that selection into\n\t\t\t// the drag event. However, once the drag is over, and you select away from the textarea,\n\t\t\t// starting a drag over the textarea will restart a selection drag instead of a shape drag.\n\t\t\t// This prevents that default behavior in FF.\n\t\t\tonDragStart={preventDefault}\n\t\t/>\n\t)\n})\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AA4BE;AA5BF,oBAAqD;AACrD,mBAAkB;AAQX,MAAM,gBAAgB,aAAAA,QAAM,WAA+C,SAAS,SAC1F;AAAA,EACC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACD,GACA,KACC;AACD,QAAM,WAAW,CAAC,MAA8C;AAC/D,iBAAa,EAAE,WAAW,EAAE,OAAO,MAAM,CAAC;AAAA,EAC3C;AAEA,SACC;AAAA,IAAC;AAAA;AAAA,MACA;AAAA,MACA,WAAU;AAAA,MACV,MAAK;AAAA,MACL,UAAU;AAAA,MACV,UAAU,CAAC;AAAA,MACX,UAAU,CAAC;AAAA,MACX,cAAa;AAAA,MACb,gBAAe;AAAA,MACf,aAAY;AAAA,MACZ,UAAS;AAAA,MACT,aAAY;AAAA,MACZ,YAAW;AAAA,MACX,MAAK;AAAA,MACL,KAAI;AAAA,MACJ,cAAc;AAAA,MACd,SAAS;AAAA,MACT;AAAA,MACA,WAAW,CAAC,MAAM,cAAc,EAAE,WAAW;AAAA,MAC7C,QAAQ;AAAA,MACR,YAAY;AAAA,MACZ,eAAe,YAAY,qCAAuB;AAAA,MAClD,eAAe;AAAA,MACf,SAAS;AAAA,MACT,eAAe;AAAA,MAKf,aAAa;AAAA;AAAA,EACd;AAEF,CAAC;",
+  "sourcesContent": ["import { markEventAsHandled, preventDefault } from '@tldraw/editor'\nimport React from 'react'\nimport { TextAreaProps } from './RichTextArea'\n\n/**\n * A plain text area that can be used for basic editing text.\n *\n * @public @react\n */\nexport const PlainTextArea = React.forwardRef<HTMLTextAreaElement, TextAreaProps>(function TextArea(\n\t{\n\t\tisEditing,\n\t\ttext,\n\t\thandleFocus,\n\t\thandleChange,\n\t\thandleKeyDown,\n\t\thandlePaste,\n\t\thandleBlur,\n\t\thandleInputPointerDown,\n\t\thandleDoubleClick,\n\t},\n\tref\n) {\n\tconst onChange = (e: React.ChangeEvent<HTMLTextAreaElement>) => {\n\t\thandleChange({ plaintext: e.target.value })\n\t}\n\n\treturn (\n\t\t<textarea\n\t\t\tref={ref}\n\t\t\tclassName=\"tl-text tl-text-input\"\n\t\t\tname=\"text\"\n\t\t\ttabIndex={-1}\n\t\t\tdisabled={!isEditing}\n\t\t\treadOnly={!isEditing}\n\t\t\tautoComplete=\"off\"\n\t\t\tautoCapitalize=\"off\"\n\t\t\tautoCorrect=\"off\"\n\t\t\tautoSave=\"off\"\n\t\t\tplaceholder=\"\"\n\t\t\tspellCheck=\"true\"\n\t\t\twrap=\"off\"\n\t\t\tdir=\"auto\"\n\t\t\tdefaultValue={text}\n\t\t\tonFocus={handleFocus}\n\t\t\tonChange={onChange}\n\t\t\tonKeyDown={(e) => handleKeyDown(e.nativeEvent)}\n\t\t\tonBlur={handleBlur}\n\t\t\tonTouchEnd={markEventAsHandled}\n\t\t\tonContextMenu={isEditing ? (e) => e.stopPropagation() : undefined}\n\t\t\tonPointerDown={handleInputPointerDown}\n\t\t\tonPaste={handlePaste}\n\t\t\tonDoubleClick={handleDoubleClick}\n\t\t\t// On FF, there's a behavior where dragging a selection will grab that selection into\n\t\t\t// the drag event. However, once the drag is over, and you select away from the textarea,\n\t\t\t// starting a drag over the textarea will restart a selection drag instead of a shape drag.\n\t\t\t// This prevents that default behavior in FF.\n\t\t\tonDragStart={preventDefault}\n\t\t/>\n\t)\n})\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AA4BE;AA5BF,oBAAmD;AACnD,mBAAkB;AAQX,MAAM,gBAAgB,aAAAA,QAAM,WAA+C,SAAS,SAC1F;AAAA,EACC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACD,GACA,KACC;AACD,QAAM,WAAW,CAAC,MAA8C;AAC/D,iBAAa,EAAE,WAAW,EAAE,OAAO,MAAM,CAAC;AAAA,EAC3C;AAEA,SACC;AAAA,IAAC;AAAA;AAAA,MACA;AAAA,MACA,WAAU;AAAA,MACV,MAAK;AAAA,MACL,UAAU;AAAA,MACV,UAAU,CAAC;AAAA,MACX,UAAU,CAAC;AAAA,MACX,cAAa;AAAA,MACb,gBAAe;AAAA,MACf,aAAY;AAAA,MACZ,UAAS;AAAA,MACT,aAAY;AAAA,MACZ,YAAW;AAAA,MACX,MAAK;AAAA,MACL,KAAI;AAAA,MACJ,cAAc;AAAA,MACd,SAAS;AAAA,MACT;AAAA,MACA,WAAW,CAAC,MAAM,cAAc,EAAE,WAAW;AAAA,MAC7C,QAAQ;AAAA,MACR,YAAY;AAAA,MACZ,eAAe,YAAY,CAAC,MAAM,EAAE,gBAAgB,IAAI;AAAA,MACxD,eAAe;AAAA,MACf,SAAS;AAAA,MACT,eAAe;AAAA,MAKf,aAAa;AAAA;AAAA,EACd;AAEF,CAAC;",
   "names": ["React"]
 }

package/dist-cjs/lib/shapes/text/RichTextArea.js CHANGED Viewed

@@ -183,9 +183,9 @@ const RichTextArea = import_react2.default.forwardRef(function RichTextArea2({
       tabIndex: -1,
       "data-testid": "rich-text-area",
       className: "tl-rich-text tl-text tl-text-input",
-      onContextMenu: isEditing ? import_editor.stopEventPropagation : void 0,
-      onPointerDownCapture: import_editor.stopEventPropagation,
-      onTouchEnd: import_editor.stopEventPropagation,
+      onContextMenu: isEditing ? (e) => e.stopPropagation() : void 0,
+      onPointerDownCapture: (e) => e.stopPropagation(),
+      onTouchEnd: (e) => e.stopPropagation(),
       onDragStart: import_editor.preventDefault,
       children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "tl-rich-text", ref: rTextEditorEl })
     }

package/dist-cjs/lib/shapes/text/RichTextArea.js.map CHANGED Viewed

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/lib/shapes/text/RichTextArea.tsx"],
-  "sourcesContent": ["import { EditorView } from '@tiptap/pm/view'\nimport {\n\tEditorEvents,\n\tJSONContent,\n\tEditor as TextEditor,\n\ttype Editor as TTEditor,\n} from '@tiptap/react'\nimport {\n\tEditor,\n\tTLRichText,\n\tTLShapeId,\n\tpreventDefault,\n\tstopEventPropagation,\n\tuseEditor,\n\tuseEvent,\n\tuseUniqueSafeId,\n} from '@tldraw/editor'\nimport React, { useLayoutEffect, useRef } from 'react'\n\n/** @public */\nexport interface TextAreaProps {\n\tisEditing: boolean\n\ttext?: string\n\tshapeId: TLShapeId\n\trichText?: TLRichText\n\thandleFocus(): void\n\thandleBlur(): void\n\thandleKeyDown(e: KeyboardEvent): void\n\thandleChange(changeInfo: { plaintext?: string; richText?: TLRichText }): void\n\thandleInputPointerDown(e: React.PointerEvent<HTMLElement>): void\n\thandleDoubleClick(e: any): any\n\thandlePaste(e: ClipboardEvent | React.ClipboardEvent<HTMLTextAreaElement>): void\n\thasCustomTabBehavior?: boolean\n}\n\n/**\n * N.B. In Development mode you need to ensure you're testing this without StrictMode on.\n * Otherwise it's not gonna work as expected on iOS.\n * Specifically, it means that the virtual keyboard won't pop open sometimes\n * (iOS starts flipping out when you render multiple times when trying to focus something) .\n */\n\n/**\n * A rich text area that can be used for editing text with rich text formatting.\n * This component uses the TipTap editor under the hood.\n *\n * @public @react\n */\nexport const RichTextArea = React.forwardRef<HTMLDivElement, TextAreaProps>(function RichTextArea(\n\t{\n\t\tshapeId,\n\t\tisEditing,\n\t\trichText,\n\t\thandleFocus,\n\t\thandleChange,\n\t\thandleBlur,\n\t\thandleKeyDown,\n\t\thandleDoubleClick,\n\t\thasCustomTabBehavior,\n\t\thandlePaste,\n\t},\n\tref\n) {\n\tconst editor = useEditor()\n\tconst tipTapId = useUniqueSafeId('tip-tap-editor')\n\tconst tipTapConfig = editor.getTextOptions().tipTapConfig\n\n\tconst rInitialRichText = useRef(richText)\n\tconst rTextEditor = useRef<TTEditor | null>(null)\n\tconst rTextEditorEl = useRef<HTMLDivElement>(null)\n\n\tuseLayoutEffect(() => {\n\t\tif (!rTextEditor.current) {\n\t\t\trInitialRichText.current = richText\n\t\t} else if (rInitialRichText.current !== richText) {\n\t\t\trTextEditor.current.commands.setContent(richText as JSONContent)\n\t\t}\n\t}, [richText])\n\n\t// The order of events is:\n\t// - editor begins editing any shape\n\t// - we set listeners for select all / place caret events\n\t// - if the user is editing this shape, this component is rendered\n\t// - editor emits the select all event / place caret event\n\t// - the text editor is onCreate callback is called\n\tconst rCreateInfo = useRef({\n\t\tselectAll: false,\n\t\tcaretPosition: null as { x: number; y: number } | null,\n\t})\n\n\tuseLayoutEffect(() => {\n\t\tfunction selectAllIfEditing(event: { shapeId: TLShapeId }) {\n\t\t\tif (event.shapeId === editor.getEditingShapeId()) {\n\t\t\t\trCreateInfo.current.selectAll = true\n\t\t\t}\n\t\t}\n\n\t\tfunction placeCaret(event: { shapeId: TLShapeId; point: { x: number; y: number } }) {\n\t\t\tif (event.shapeId === editor.getEditingShapeId()) {\n\t\t\t\trCreateInfo.current.caretPosition = event.point\n\t\t\t}\n\t\t}\n\n\t\teditor.on('select-all-text', selectAllIfEditing)\n\t\teditor.on('place-caret', placeCaret)\n\t\treturn () => {\n\t\t\teditor.off('select-all-text', selectAllIfEditing)\n\t\t\teditor.off('place-caret', placeCaret)\n\t\t}\n\t}, [editor, isEditing])\n\n\tconst onChange = useEvent(handleChange)\n\tconst onKeyDown = useEvent(handleKeyDown)\n\tconst onFocus = useEvent(handleFocus)\n\tconst onBlur = useEvent(handleBlur)\n\tconst onDoubleClick = useEvent(handleDoubleClick)\n\tconst onPaste = useEvent(handlePaste)\n\tuseLayoutEffect(() => {\n\t\tif (!isEditing || !tipTapConfig || !rTextEditorEl.current) return\n\n\t\tconst { editorProps, ...restOfTipTapConfig } = tipTapConfig\n\n\t\t// Because React can double-render in Strict Mode, we need to make sure we're not setting\n\t\t// the text editor twice. This became more much more prevalent in React 19, but also it\n\t\t// started manifesting in some cases in Next 14.2 (which maybe patches React 18.3 in weird\n\t\t// ways). So we used to use EditorProvider but we into weird rendering issues.\n\t\tconst textEditorInstance = new TextEditor({\n\t\t\telement: rTextEditorEl.current,\n\t\t\tautofocus: true,\n\t\t\teditable: isEditing,\n\t\t\tonUpdate: (props: EditorEvents['update']) => {\n\t\t\t\tconst content: TLRichText = props.editor.state.doc.toJSON()\n\t\t\t\trInitialRichText.current = content\n\t\t\t\tonChange({ richText: content })\n\t\t\t},\n\t\t\tonFocus,\n\t\t\tonBlur,\n\t\t\t// onCreate is called after a `setTimeout(0)`\n\t\t\tonCreate: (props) => {\n\t\t\t\t// If we're not still editing the original shape, then don't do anything.\n\t\t\t\tif (editor.getEditingShapeId() !== shapeId) return\n\n\t\t\t\tconst textEditor = props.editor\n\t\t\t\teditor.setRichTextEditor(textEditor)\n\n\t\t\t\tconst { selectAll, caretPosition } = rCreateInfo.current\n\n\t\t\t\tif (selectAll) {\n\t\t\t\t\t// Select all of the text\n\t\t\t\t\ttextEditor.chain().focus().selectAll().run()\n\t\t\t\t} else if (caretPosition) {\n\t\t\t\t\t// Set the initial caret screen position\n\t\t\t\t\tconst pos = textEditor.view.posAtCoords({\n\t\t\t\t\t\tleft: caretPosition.x,\n\t\t\t\t\t\ttop: caretPosition.y,\n\t\t\t\t\t})?.pos\n\n\t\t\t\t\tif (pos) {\n\t\t\t\t\t\t// Focus to that position.\n\t\t\t\t\t\ttextEditor.chain().focus().setTextSelection(pos).run()\n\t\t\t\t\t} else {\n\t\t\t\t\t\t// If no position, default to select all.\n\t\t\t\t\t\ttextEditor.chain().focus().selectAll().run()\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t},\n\t\t\teditorProps: {\n\t\t\t\thandleKeyDown: (view: EditorView, event: KeyboardEvent) => {\n\t\t\t\t\tif (!hasCustomTabBehavior && event.key === 'Tab') {\n\t\t\t\t\t\thandleTab(editor, view, event)\n\t\t\t\t\t}\n\n\t\t\t\t\tonKeyDown(event)\n\t\t\t\t},\n\t\t\t\thandlePaste: (view: EditorView, event: ClipboardEvent) => {\n\t\t\t\t\tonPaste(event)\n\t\t\t\t\tif (event.defaultPrevented) return true\n\t\t\t\t},\n\t\t\t\thandleDoubleClick: (_view, _pos, event) => onDoubleClick(event),\n\t\t\t\t...editorProps,\n\t\t\t},\n\t\t\tcoreExtensionOptions: {\n\t\t\t\tclipboardTextSerializer: {\n\t\t\t\t\tblockSeparator: '\\n',\n\t\t\t\t},\n\t\t\t},\n\t\t\t...restOfTipTapConfig,\n\t\t\tcontent: rInitialRichText.current as JSONContent,\n\t\t})\n\n\t\t// XXX: When creating a brand new shape and double-clicking into it quickly to edit it,\n\t\t// there's some kind of race condition happening where the editor doesn't focus properly.\n\t\tconst timeout = editor.timers.setTimeout(() => {\n\t\t\tif (rCreateInfo.current.caretPosition || rCreateInfo.current.selectAll) {\n\t\t\t\ttextEditorInstance.commands.focus()\n\t\t\t} else {\n\t\t\t\ttextEditorInstance.commands.focus('end')\n\t\t\t}\n\n\t\t\trCreateInfo.current.selectAll = false\n\t\t\trCreateInfo.current.caretPosition = null\n\t\t}, 100)\n\n\t\trTextEditor.current = textEditorInstance\n\n\t\treturn () => {\n\t\t\trTextEditor.current = null\n\t\t\tclearTimeout(timeout)\n\t\t\ttextEditorInstance.destroy()\n\t\t}\n\t}, [\n\t\tisEditing,\n\t\ttipTapConfig,\n\t\tonFocus,\n\t\tonBlur,\n\t\tonDoubleClick,\n\t\tonChange,\n\t\tonPaste,\n\t\tonKeyDown,\n\t\teditor,\n\t\tshapeId,\n\t\thasCustomTabBehavior,\n\t])\n\n\tif (!isEditing || !tipTapConfig) {\n\t\treturn null\n\t}\n\n\treturn (\n\t\t<div\n\t\t\tid={tipTapId}\n\t\t\tref={ref}\n\t\t\ttabIndex={-1}\n\t\t\tdata-testid=\"rich-text-area\"\n\t\t\tclassName=\"tl-rich-text tl-text tl-text-input\"\n\t\t\tonContextMenu={isEditing ? stopEventPropagation : undefined}\n\t\t\t// N.B. When PointerStateExtension was introduced, this was moved there.\n\t\t\t// However, that caused selecting over list items to break.\n\t\t\t// The handleDOMEvents in TipTap don't seem to support the pointerDownCapture event.\n\t\t\tonPointerDownCapture={stopEventPropagation}\n\t\t\t// This onTouchEnd is important for Android to be able to change selection on text.\n\t\t\tonTouchEnd={stopEventPropagation}\n\t\t\t// On FF, there's a behavior where dragging a selection will grab that selection into\n\t\t\t// the drag event. However, once the drag is over, and you select away from the textarea,\n\t\t\t// starting a drag over the textarea will restart a selection drag instead of a shape drag.\n\t\t\t// This prevents that default behavior in FF.\n\t\t\tonDragStart={preventDefault}\n\t\t>\n\t\t\t<div className=\"tl-rich-text\" ref={rTextEditorEl} />\n\t\t</div>\n\t)\n})\n\n// Prevent exiting the editor when hitting Tab.\n// Also, insert a tab character at the front of the line if the shift key isn't pressed,\n// otherwise if shift is pressed, remove a tab character from the front of the line.\nfunction handleTab(editor: Editor, view: EditorView, event: KeyboardEvent) {\n\t// Don't exit the editor.\n\tevent.preventDefault()\n\n\tconst textEditor = editor.getRichTextEditor()\n\tif (textEditor?.isActive('bulletList') || textEditor?.isActive('orderedList')) return\n\n\tconst { state, dispatch } = view\n\tconst { $from, $to } = state.selection\n\tconst isShift = event.shiftKey\n\n\t// Create a new transaction\n\tlet tr = state.tr\n\n\t// Iterate over each line in the selection in reverse so that the positions\n\t// are stable as we modify the document.\n\tlet pos = $to.end()\n\twhile (pos >= $from.start()) {\n\t\tconst line = state.doc.resolve(pos).blockRange()\n\t\tif (!line) break\n\n\t\tconst lineStart = line.start\n\t\tconst lineEnd = line.end\n\t\tconst lineText = state.doc.textBetween(lineStart, lineEnd, '\\n')\n\n\t\t// Check if the current line or any of its parent nodes are part of a list\n\t\tlet isInList = false\n\t\tstate.doc.nodesBetween(lineStart, lineEnd, (node) => {\n\t\t\tif (node.type.name === 'bulletList' || node.type.name === 'orderedList') {\n\t\t\t\tisInList = true\n\t\t\t\treturn false // Stop iteration\n\t\t\t}\n\t\t})\n\n\t\t// TODO: for now skip over lists. Later, we might consider handling them using\n\t\t// sinkListItem and liftListItem from @tiptap/pm/schema-list\n\t\tif (!isInList) {\n\t\t\tif (!isShift) {\n\t\t\t\t// Insert a tab character at the start of the line\n\t\t\t\ttr = tr.insertText('\\t', lineStart + 1)\n\t\t\t} else {\n\t\t\t\t// Remove a tab character from the start of the line\n\t\t\t\tif (lineText.startsWith('\\t')) {\n\t\t\t\t\ttr = tr.delete(lineStart + 1, lineStart + 2)\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\n\t\tpos = lineStart - 1\n\t}\n\n\tconst mappedSelection = state.selection.map(tr.doc, tr.mapping)\n\ttr.setSelection(mappedSelection)\n\n\tif (tr.docChanged) {\n\t\tdispatch(tr)\n\t}\n}\n"],
-  "mappings": "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",
+  "sourcesContent": ["import { EditorView } from '@tiptap/pm/view'\nimport {\n\tEditorEvents,\n\tJSONContent,\n\tEditor as TextEditor,\n\ttype Editor as TTEditor,\n} from '@tiptap/react'\nimport {\n\tEditor,\n\tTLRichText,\n\tTLShapeId,\n\tpreventDefault,\n\tuseEditor,\n\tuseEvent,\n\tuseUniqueSafeId,\n} from '@tldraw/editor'\nimport React, { useLayoutEffect, useRef } from 'react'\n\n/** @public */\nexport interface TextAreaProps {\n\tisEditing: boolean\n\ttext?: string\n\tshapeId: TLShapeId\n\trichText?: TLRichText\n\thandleFocus(): void\n\thandleBlur(): void\n\thandleKeyDown(e: KeyboardEvent): void\n\thandleChange(changeInfo: { plaintext?: string; richText?: TLRichText }): void\n\thandleInputPointerDown(e: React.PointerEvent<HTMLElement>): void\n\thandleDoubleClick(e: any): any\n\thandlePaste(e: ClipboardEvent | React.ClipboardEvent<HTMLTextAreaElement>): void\n\thasCustomTabBehavior?: boolean\n}\n\n/**\n * N.B. In Development mode you need to ensure you're testing this without StrictMode on.\n * Otherwise it's not gonna work as expected on iOS.\n * Specifically, it means that the virtual keyboard won't pop open sometimes\n * (iOS starts flipping out when you render multiple times when trying to focus something) .\n */\n\n/**\n * A rich text area that can be used for editing text with rich text formatting.\n * This component uses the TipTap editor under the hood.\n *\n * @public @react\n */\nexport const RichTextArea = React.forwardRef<HTMLDivElement, TextAreaProps>(function RichTextArea(\n\t{\n\t\tshapeId,\n\t\tisEditing,\n\t\trichText,\n\t\thandleFocus,\n\t\thandleChange,\n\t\thandleBlur,\n\t\thandleKeyDown,\n\t\thandleDoubleClick,\n\t\thasCustomTabBehavior,\n\t\thandlePaste,\n\t},\n\tref\n) {\n\tconst editor = useEditor()\n\tconst tipTapId = useUniqueSafeId('tip-tap-editor')\n\tconst tipTapConfig = editor.getTextOptions().tipTapConfig\n\n\tconst rInitialRichText = useRef(richText)\n\tconst rTextEditor = useRef<TTEditor | null>(null)\n\tconst rTextEditorEl = useRef<HTMLDivElement>(null)\n\n\tuseLayoutEffect(() => {\n\t\tif (!rTextEditor.current) {\n\t\t\trInitialRichText.current = richText\n\t\t} else if (rInitialRichText.current !== richText) {\n\t\t\trTextEditor.current.commands.setContent(richText as JSONContent)\n\t\t}\n\t}, [richText])\n\n\t// The order of events is:\n\t// - editor begins editing any shape\n\t// - we set listeners for select all / place caret events\n\t// - if the user is editing this shape, this component is rendered\n\t// - editor emits the select all event / place caret event\n\t// - the text editor is onCreate callback is called\n\tconst rCreateInfo = useRef({\n\t\tselectAll: false,\n\t\tcaretPosition: null as { x: number; y: number } | null,\n\t})\n\n\tuseLayoutEffect(() => {\n\t\tfunction selectAllIfEditing(event: { shapeId: TLShapeId }) {\n\t\t\tif (event.shapeId === editor.getEditingShapeId()) {\n\t\t\t\trCreateInfo.current.selectAll = true\n\t\t\t}\n\t\t}\n\n\t\tfunction placeCaret(event: { shapeId: TLShapeId; point: { x: number; y: number } }) {\n\t\t\tif (event.shapeId === editor.getEditingShapeId()) {\n\t\t\t\trCreateInfo.current.caretPosition = event.point\n\t\t\t}\n\t\t}\n\n\t\teditor.on('select-all-text', selectAllIfEditing)\n\t\teditor.on('place-caret', placeCaret)\n\t\treturn () => {\n\t\t\teditor.off('select-all-text', selectAllIfEditing)\n\t\t\teditor.off('place-caret', placeCaret)\n\t\t}\n\t}, [editor, isEditing])\n\n\tconst onChange = useEvent(handleChange)\n\tconst onKeyDown = useEvent(handleKeyDown)\n\tconst onFocus = useEvent(handleFocus)\n\tconst onBlur = useEvent(handleBlur)\n\tconst onDoubleClick = useEvent(handleDoubleClick)\n\tconst onPaste = useEvent(handlePaste)\n\tuseLayoutEffect(() => {\n\t\tif (!isEditing || !tipTapConfig || !rTextEditorEl.current) return\n\n\t\tconst { editorProps, ...restOfTipTapConfig } = tipTapConfig\n\n\t\t// Because React can double-render in Strict Mode, we need to make sure we're not setting\n\t\t// the text editor twice. This became more much more prevalent in React 19, but also it\n\t\t// started manifesting in some cases in Next 14.2 (which maybe patches React 18.3 in weird\n\t\t// ways). So we used to use EditorProvider but we into weird rendering issues.\n\t\tconst textEditorInstance = new TextEditor({\n\t\t\telement: rTextEditorEl.current,\n\t\t\tautofocus: true,\n\t\t\teditable: isEditing,\n\t\t\tonUpdate: (props: EditorEvents['update']) => {\n\t\t\t\tconst content: TLRichText = props.editor.state.doc.toJSON()\n\t\t\t\trInitialRichText.current = content\n\t\t\t\tonChange({ richText: content })\n\t\t\t},\n\t\t\tonFocus,\n\t\t\tonBlur,\n\t\t\t// onCreate is called after a `setTimeout(0)`\n\t\t\tonCreate: (props) => {\n\t\t\t\t// If we're not still editing the original shape, then don't do anything.\n\t\t\t\tif (editor.getEditingShapeId() !== shapeId) return\n\n\t\t\t\tconst textEditor = props.editor\n\t\t\t\teditor.setRichTextEditor(textEditor)\n\n\t\t\t\tconst { selectAll, caretPosition } = rCreateInfo.current\n\n\t\t\t\tif (selectAll) {\n\t\t\t\t\t// Select all of the text\n\t\t\t\t\ttextEditor.chain().focus().selectAll().run()\n\t\t\t\t} else if (caretPosition) {\n\t\t\t\t\t// Set the initial caret screen position\n\t\t\t\t\tconst pos = textEditor.view.posAtCoords({\n\t\t\t\t\t\tleft: caretPosition.x,\n\t\t\t\t\t\ttop: caretPosition.y,\n\t\t\t\t\t})?.pos\n\n\t\t\t\t\tif (pos) {\n\t\t\t\t\t\t// Focus to that position.\n\t\t\t\t\t\ttextEditor.chain().focus().setTextSelection(pos).run()\n\t\t\t\t\t} else {\n\t\t\t\t\t\t// If no position, default to select all.\n\t\t\t\t\t\ttextEditor.chain().focus().selectAll().run()\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t},\n\t\t\teditorProps: {\n\t\t\t\thandleKeyDown: (view: EditorView, event: KeyboardEvent) => {\n\t\t\t\t\tif (!hasCustomTabBehavior && event.key === 'Tab') {\n\t\t\t\t\t\thandleTab(editor, view, event)\n\t\t\t\t\t}\n\n\t\t\t\t\tonKeyDown(event)\n\t\t\t\t},\n\t\t\t\thandlePaste: (view: EditorView, event: ClipboardEvent) => {\n\t\t\t\t\tonPaste(event)\n\t\t\t\t\tif (event.defaultPrevented) return true\n\t\t\t\t},\n\t\t\t\thandleDoubleClick: (_view, _pos, event) => onDoubleClick(event),\n\t\t\t\t...editorProps,\n\t\t\t},\n\t\t\tcoreExtensionOptions: {\n\t\t\t\tclipboardTextSerializer: {\n\t\t\t\t\tblockSeparator: '\\n',\n\t\t\t\t},\n\t\t\t},\n\t\t\t...restOfTipTapConfig,\n\t\t\tcontent: rInitialRichText.current as JSONContent,\n\t\t})\n\n\t\t// XXX: When creating a brand new shape and double-clicking into it quickly to edit it,\n\t\t// there's some kind of race condition happening where the editor doesn't focus properly.\n\t\tconst timeout = editor.timers.setTimeout(() => {\n\t\t\tif (rCreateInfo.current.caretPosition || rCreateInfo.current.selectAll) {\n\t\t\t\ttextEditorInstance.commands.focus()\n\t\t\t} else {\n\t\t\t\ttextEditorInstance.commands.focus('end')\n\t\t\t}\n\n\t\t\trCreateInfo.current.selectAll = false\n\t\t\trCreateInfo.current.caretPosition = null\n\t\t}, 100)\n\n\t\trTextEditor.current = textEditorInstance\n\n\t\treturn () => {\n\t\t\trTextEditor.current = null\n\t\t\tclearTimeout(timeout)\n\t\t\ttextEditorInstance.destroy()\n\t\t}\n\t}, [\n\t\tisEditing,\n\t\ttipTapConfig,\n\t\tonFocus,\n\t\tonBlur,\n\t\tonDoubleClick,\n\t\tonChange,\n\t\tonPaste,\n\t\tonKeyDown,\n\t\teditor,\n\t\tshapeId,\n\t\thasCustomTabBehavior,\n\t])\n\n\tif (!isEditing || !tipTapConfig) {\n\t\treturn null\n\t}\n\n\treturn (\n\t\t<div\n\t\t\tid={tipTapId}\n\t\t\tref={ref}\n\t\t\ttabIndex={-1}\n\t\t\tdata-testid=\"rich-text-area\"\n\t\t\tclassName=\"tl-rich-text tl-text tl-text-input\"\n\t\t\tonContextMenu={isEditing ? (e) => e.stopPropagation() : undefined}\n\t\t\t// N.B. When PointerStateExtension was introduced, this was moved there.\n\t\t\t// However, that caused selecting over list items to break.\n\t\t\t// The handleDOMEvents in TipTap don't seem to support the pointerDownCapture event.\n\t\t\tonPointerDownCapture={(e) => e.stopPropagation()}\n\t\t\t// This onTouchEnd is important for Android to be able to change selection on text.\n\t\t\tonTouchEnd={(e) => e.stopPropagation()}\n\t\t\t// On FF, there's a behavior where dragging a selection will grab that selection into\n\t\t\t// the drag event. However, once the drag is over, and you select away from the textarea,\n\t\t\t// starting a drag over the textarea will restart a selection drag instead of a shape drag.\n\t\t\t// This prevents that default behavior in FF.\n\t\t\tonDragStart={preventDefault}\n\t\t>\n\t\t\t<div className=\"tl-rich-text\" ref={rTextEditorEl} />\n\t\t</div>\n\t)\n})\n\n// Prevent exiting the editor when hitting Tab.\n// Also, insert a tab character at the front of the line if the shift key isn't pressed,\n// otherwise if shift is pressed, remove a tab character from the front of the line.\nfunction handleTab(editor: Editor, view: EditorView, event: KeyboardEvent) {\n\t// Don't exit the editor.\n\tevent.preventDefault()\n\n\tconst textEditor = editor.getRichTextEditor()\n\tif (textEditor?.isActive('bulletList') || textEditor?.isActive('orderedList')) return\n\n\tconst { state, dispatch } = view\n\tconst { $from, $to } = state.selection\n\tconst isShift = event.shiftKey\n\n\t// Create a new transaction\n\tlet tr = state.tr\n\n\t// Iterate over each line in the selection in reverse so that the positions\n\t// are stable as we modify the document.\n\tlet pos = $to.end()\n\twhile (pos >= $from.start()) {\n\t\tconst line = state.doc.resolve(pos).blockRange()\n\t\tif (!line) break\n\n\t\tconst lineStart = line.start\n\t\tconst lineEnd = line.end\n\t\tconst lineText = state.doc.textBetween(lineStart, lineEnd, '\\n')\n\n\t\t// Check if the current line or any of its parent nodes are part of a list\n\t\tlet isInList = false\n\t\tstate.doc.nodesBetween(lineStart, lineEnd, (node) => {\n\t\t\tif (node.type.name === 'bulletList' || node.type.name === 'orderedList') {\n\t\t\t\tisInList = true\n\t\t\t\treturn false // Stop iteration\n\t\t\t}\n\t\t})\n\n\t\t// TODO: for now skip over lists. Later, we might consider handling them using\n\t\t// sinkListItem and liftListItem from @tiptap/pm/schema-list\n\t\tif (!isInList) {\n\t\t\tif (!isShift) {\n\t\t\t\t// Insert a tab character at the start of the line\n\t\t\t\ttr = tr.insertText('\\t', lineStart + 1)\n\t\t\t} else {\n\t\t\t\t// Remove a tab character from the start of the line\n\t\t\t\tif (lineText.startsWith('\\t')) {\n\t\t\t\t\ttr = tr.delete(lineStart + 1, lineStart + 2)\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\n\t\tpos = lineStart - 1\n\t}\n\n\tconst mappedSelection = state.selection.map(tr.doc, tr.mapping)\n\ttr.setSelection(mappedSelection)\n\n\tif (tr.docChanged) {\n\t\tdispatch(tr)\n\t}\n}\n"],
+  "mappings": "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",
   "names": ["import_react", "React", "RichTextArea", "TextEditor"]
 }

package/dist-cjs/lib/ui/components/A11y.js CHANGED Viewed

@@ -36,7 +36,7 @@ function SkipToMainContent() {
   const button = (0, import_react.useRef)(null);
   const handleNavigateToFirstShape = (0, import_react.useCallback)(
     (e) => {
-      (0, import_editor.stopEventPropagation)(e);
+      (0, import_editor.markEventAsHandled)(e);
       button.current?.blur();
       const shapes = editor.getCurrentPageShapesInReadingOrder();
       if (!shapes.length) return;