@tldraw/editor 3.9.0 → 3.10.0-canary.15f6aaa3d2d3

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 (131) hide show
  1. package/dist-cjs/index.d.ts +232 -3
  2. package/dist-cjs/index.js +9 -1
  3. package/dist-cjs/index.js.map +2 -2
  4. package/dist-cjs/lib/TldrawEditor.js +32 -6
  5. package/dist-cjs/lib/TldrawEditor.js.map +2 -2
  6. package/dist-cjs/lib/components/LiveCollaborators.js +5 -0
  7. package/dist-cjs/lib/components/LiveCollaborators.js.map +2 -2
  8. package/dist-cjs/lib/components/Shape.js +7 -0
  9. package/dist-cjs/lib/components/Shape.js.map +2 -2
  10. package/dist-cjs/lib/components/default-components/DefaultBrush.js.map +2 -2
  11. package/dist-cjs/lib/components/default-components/DefaultCollaboratorHint.js.map +2 -2
  12. package/dist-cjs/lib/components/default-components/DefaultCursor.js.map +2 -2
  13. package/dist-cjs/lib/components/default-components/DefaultScribble.js.map +2 -2
  14. package/dist-cjs/lib/components/default-components/DefaultShapeIndicator.js.map +2 -2
  15. package/dist-cjs/lib/editor/Editor.js +63 -7
  16. package/dist-cjs/lib/editor/Editor.js.map +2 -2
  17. package/dist-cjs/lib/editor/managers/FontManager.js +166 -0
  18. package/dist-cjs/lib/editor/managers/FontManager.js.map +7 -0
  19. package/dist-cjs/lib/editor/managers/TextManager.js +23 -17
  20. package/dist-cjs/lib/editor/managers/TextManager.js.map +2 -2
  21. package/dist-cjs/lib/editor/shapes/ShapeUtil.js +11 -0
  22. package/dist-cjs/lib/editor/shapes/ShapeUtil.js.map +2 -2
  23. package/dist-cjs/lib/editor/types/emit-types.js.map +1 -1
  24. package/dist-cjs/lib/editor/types/external-content.js.map +1 -1
  25. package/dist-cjs/lib/exports/FontEmbedder.js +7 -2
  26. package/dist-cjs/lib/exports/FontEmbedder.js.map +2 -2
  27. package/dist-cjs/lib/exports/StyleEmbedder.js +1 -1
  28. package/dist-cjs/lib/exports/StyleEmbedder.js.map +2 -2
  29. package/dist-cjs/lib/exports/exportToSvg.js +3 -2
  30. package/dist-cjs/lib/exports/exportToSvg.js.map +2 -2
  31. package/dist-cjs/lib/exports/getSvgJsx.js +18 -1
  32. package/dist-cjs/lib/exports/getSvgJsx.js.map +2 -2
  33. package/dist-cjs/lib/exports/parseCss.js +1 -0
  34. package/dist-cjs/lib/exports/parseCss.js.map +2 -2
  35. package/dist-cjs/lib/hooks/useCanvasEvents.js +2 -2
  36. package/dist-cjs/lib/hooks/useCanvasEvents.js.map +2 -2
  37. package/dist-cjs/lib/hooks/useFixSafariDoubleTapZoomPencilEvents.js +1 -1
  38. package/dist-cjs/lib/hooks/useFixSafariDoubleTapZoomPencilEvents.js.map +2 -2
  39. package/dist-cjs/lib/hooks/usePassThroughMouseOverEvents.js +48 -0
  40. package/dist-cjs/lib/hooks/usePassThroughMouseOverEvents.js.map +7 -0
  41. package/dist-cjs/lib/hooks/usePassThroughWheelEvents.js.map +2 -2
  42. package/dist-cjs/lib/hooks/useViewportHeight.js +56 -0
  43. package/dist-cjs/lib/hooks/useViewportHeight.js.map +7 -0
  44. package/dist-cjs/lib/options.js +2 -1
  45. package/dist-cjs/lib/options.js.map +2 -2
  46. package/dist-cjs/lib/utils/dom.js +1 -1
  47. package/dist-cjs/lib/utils/dom.js.map +2 -2
  48. package/dist-cjs/lib/utils/richText.js +46 -0
  49. package/dist-cjs/lib/utils/richText.js.map +7 -0
  50. package/dist-cjs/version.js +3 -3
  51. package/dist-cjs/version.js.map +1 -1
  52. package/dist-esm/index.d.mts +232 -3
  53. package/dist-esm/index.mjs +13 -1
  54. package/dist-esm/index.mjs.map +2 -2
  55. package/dist-esm/lib/TldrawEditor.mjs +33 -7
  56. package/dist-esm/lib/TldrawEditor.mjs.map +2 -2
  57. package/dist-esm/lib/components/LiveCollaborators.mjs +5 -0
  58. package/dist-esm/lib/components/LiveCollaborators.mjs.map +2 -2
  59. package/dist-esm/lib/components/Shape.mjs +8 -1
  60. package/dist-esm/lib/components/Shape.mjs.map +2 -2
  61. package/dist-esm/lib/components/default-components/DefaultBrush.mjs.map +2 -2
  62. package/dist-esm/lib/components/default-components/DefaultCollaboratorHint.mjs.map +2 -2
  63. package/dist-esm/lib/components/default-components/DefaultCursor.mjs.map +2 -2
  64. package/dist-esm/lib/components/default-components/DefaultScribble.mjs.map +2 -2
  65. package/dist-esm/lib/components/default-components/DefaultShapeIndicator.mjs.map +2 -2
  66. package/dist-esm/lib/editor/Editor.mjs +71 -8
  67. package/dist-esm/lib/editor/Editor.mjs.map +2 -2
  68. package/dist-esm/lib/editor/managers/FontManager.mjs +152 -0
  69. package/dist-esm/lib/editor/managers/FontManager.mjs.map +7 -0
  70. package/dist-esm/lib/editor/managers/TextManager.mjs +23 -17
  71. package/dist-esm/lib/editor/managers/TextManager.mjs.map +2 -2
  72. package/dist-esm/lib/editor/shapes/ShapeUtil.mjs +11 -0
  73. package/dist-esm/lib/editor/shapes/ShapeUtil.mjs.map +2 -2
  74. package/dist-esm/lib/exports/FontEmbedder.mjs +7 -2
  75. package/dist-esm/lib/exports/FontEmbedder.mjs.map +2 -2
  76. package/dist-esm/lib/exports/StyleEmbedder.mjs +1 -1
  77. package/dist-esm/lib/exports/StyleEmbedder.mjs.map +2 -2
  78. package/dist-esm/lib/exports/exportToSvg.mjs +3 -2
  79. package/dist-esm/lib/exports/exportToSvg.mjs.map +2 -2
  80. package/dist-esm/lib/exports/getSvgJsx.mjs +19 -2
  81. package/dist-esm/lib/exports/getSvgJsx.mjs.map +2 -2
  82. package/dist-esm/lib/exports/parseCss.mjs +1 -0
  83. package/dist-esm/lib/exports/parseCss.mjs.map +2 -2
  84. package/dist-esm/lib/hooks/useCanvasEvents.mjs +2 -2
  85. package/dist-esm/lib/hooks/useCanvasEvents.mjs.map +2 -2
  86. package/dist-esm/lib/hooks/useFixSafariDoubleTapZoomPencilEvents.mjs +1 -1
  87. package/dist-esm/lib/hooks/useFixSafariDoubleTapZoomPencilEvents.mjs.map +2 -2
  88. package/dist-esm/lib/hooks/usePassThroughMouseOverEvents.mjs +28 -0
  89. package/dist-esm/lib/hooks/usePassThroughMouseOverEvents.mjs.map +7 -0
  90. package/dist-esm/lib/hooks/usePassThroughWheelEvents.mjs.map +2 -2
  91. package/dist-esm/lib/hooks/useViewportHeight.mjs +36 -0
  92. package/dist-esm/lib/hooks/useViewportHeight.mjs.map +7 -0
  93. package/dist-esm/lib/options.mjs +2 -1
  94. package/dist-esm/lib/options.mjs.map +2 -2
  95. package/dist-esm/lib/utils/dom.mjs +1 -1
  96. package/dist-esm/lib/utils/dom.mjs.map +2 -2
  97. package/dist-esm/lib/utils/richText.mjs +26 -0
  98. package/dist-esm/lib/utils/richText.mjs.map +7 -0
  99. package/dist-esm/version.mjs +3 -3
  100. package/dist-esm/version.mjs.map +1 -1
  101. package/editor.css +127 -13
  102. package/package.json +10 -7
  103. package/src/index.ts +15 -0
  104. package/src/lib/TldrawEditor.tsx +52 -4
  105. package/src/lib/components/LiveCollaborators.tsx +5 -0
  106. package/src/lib/components/Shape.tsx +9 -1
  107. package/src/lib/components/default-components/DefaultBrush.tsx +1 -0
  108. package/src/lib/components/default-components/DefaultCollaboratorHint.tsx +1 -0
  109. package/src/lib/components/default-components/DefaultCursor.tsx +1 -0
  110. package/src/lib/components/default-components/DefaultScribble.tsx +1 -0
  111. package/src/lib/components/default-components/DefaultShapeIndicator.tsx +1 -0
  112. package/src/lib/editor/Editor.ts +91 -6
  113. package/src/lib/editor/managers/FontManager.ts +251 -0
  114. package/src/lib/editor/managers/TextManager.ts +42 -17
  115. package/src/lib/editor/shapes/ShapeUtil.ts +13 -0
  116. package/src/lib/editor/types/emit-types.ts +1 -0
  117. package/src/lib/editor/types/external-content.ts +1 -0
  118. package/src/lib/exports/FontEmbedder.ts +13 -1
  119. package/src/lib/exports/StyleEmbedder.ts +1 -1
  120. package/src/lib/exports/exportToSvg.tsx +4 -3
  121. package/src/lib/exports/getSvgJsx.tsx +22 -2
  122. package/src/lib/exports/parseCss.ts +1 -0
  123. package/src/lib/hooks/useCanvasEvents.ts +2 -1
  124. package/src/lib/hooks/useFixSafariDoubleTapZoomPencilEvents.ts +1 -0
  125. package/src/lib/hooks/usePassThroughMouseOverEvents.ts +29 -0
  126. package/src/lib/hooks/usePassThroughWheelEvents.ts +0 -1
  127. package/src/lib/hooks/useViewportHeight.ts +37 -0
  128. package/src/lib/options.ts +7 -0
  129. package/src/lib/utils/dom.ts +1 -1
  130. package/src/lib/utils/richText.ts +72 -0
  131. package/src/version.ts +3 -3
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../src/lib/components/default-components/DefaultCollaboratorHint.tsx"],
4
- "sourcesContent": ["import { VecModel } from '@tldraw/tlschema'\nimport classNames from 'classnames'\nimport { useRef } from 'react'\nimport { useSharedSafeId } from '../../hooks/useSafeId'\nimport { useTransform } from '../../hooks/useTransform'\nimport { Box } from '../../primitives/Box'\nimport { Vec } from '../../primitives/Vec'\nimport { clamp } from '../../primitives/utils'\n\n/** @public */\nexport interface TLCollaboratorHintProps {\n\tclassName?: string\n\tpoint: VecModel\n\tviewport: Box\n\tzoom: number\n\topacity?: number\n\tcolor: string\n}\n\n/** @public @react */\nexport function DefaultCollaboratorHint({\n\tclassName,\n\tzoom,\n\tpoint,\n\tcolor,\n\tviewport,\n\topacity = 1,\n}: TLCollaboratorHintProps) {\n\tconst rSvg = useRef<SVGSVGElement>(null)\n\n\tuseTransform(\n\t\trSvg,\n\t\tclamp(point.x, viewport.minX + 5 / zoom, viewport.maxX - 5 / zoom),\n\t\tclamp(point.y, viewport.minY + 5 / zoom, viewport.maxY - 5 / zoom),\n\t\t1 / zoom,\n\t\tVec.Angle(viewport.center, point)\n\t)\n\tconst cursorHintId = useSharedSafeId('cursor_hint')\n\n\treturn (\n\t\t<svg ref={rSvg} className={classNames('tl-overlays__item', className)}>\n\t\t\t<use\n\t\t\t\thref={`#${cursorHintId}`}\n\t\t\t\tcolor={color}\n\t\t\t\tstrokeWidth={3}\n\t\t\t\tstroke=\"var(--color-background)\"\n\t\t\t/>\n\t\t\t<use href={`#${cursorHintId}`} color={color} opacity={opacity} />\n\t\t</svg>\n\t)\n}\n"],
5
- "mappings": "AAwCE,SACC,KADD;AAvCF,OAAO,gBAAgB;AACvB,SAAS,cAAc;AACvB,SAAS,uBAAuB;AAChC,SAAS,oBAAoB;AAE7B,SAAS,WAAW;AACpB,SAAS,aAAa;AAaf,SAAS,wBAAwB;AAAA,EACvC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,UAAU;AACX,GAA4B;AAC3B,QAAM,OAAO,OAAsB,IAAI;AAEvC;AAAA,IACC;AAAA,IACA,MAAM,MAAM,GAAG,SAAS,OAAO,IAAI,MAAM,SAAS,OAAO,IAAI,IAAI;AAAA,IACjE,MAAM,MAAM,GAAG,SAAS,OAAO,IAAI,MAAM,SAAS,OAAO,IAAI,IAAI;AAAA,IACjE,IAAI;AAAA,IACJ,IAAI,MAAM,SAAS,QAAQ,KAAK;AAAA,EACjC;AACA,QAAM,eAAe,gBAAgB,aAAa;AAElD,SACC,qBAAC,SAAI,KAAK,MAAM,WAAW,WAAW,qBAAqB,SAAS,GACnE;AAAA;AAAA,MAAC;AAAA;AAAA,QACA,MAAM,IAAI,YAAY;AAAA,QACtB;AAAA,QACA,aAAa;AAAA,QACb,QAAO;AAAA;AAAA,IACR;AAAA,IACA,oBAAC,SAAI,MAAM,IAAI,YAAY,IAAI,OAAc,SAAkB;AAAA,KAChE;AAEF;",
4
+ "sourcesContent": ["import { VecModel } from '@tldraw/tlschema'\nimport classNames from 'classnames'\nimport { useRef } from 'react'\nimport { useSharedSafeId } from '../../hooks/useSafeId'\nimport { useTransform } from '../../hooks/useTransform'\nimport { Box } from '../../primitives/Box'\nimport { Vec } from '../../primitives/Vec'\nimport { clamp } from '../../primitives/utils'\n\n/** @public */\nexport interface TLCollaboratorHintProps {\n\tuserId: string\n\tclassName?: string\n\tpoint: VecModel\n\tviewport: Box\n\tzoom: number\n\topacity?: number\n\tcolor: string\n}\n\n/** @public @react */\nexport function DefaultCollaboratorHint({\n\tclassName,\n\tzoom,\n\tpoint,\n\tcolor,\n\tviewport,\n\topacity = 1,\n}: TLCollaboratorHintProps) {\n\tconst rSvg = useRef<SVGSVGElement>(null)\n\n\tuseTransform(\n\t\trSvg,\n\t\tclamp(point.x, viewport.minX + 5 / zoom, viewport.maxX - 5 / zoom),\n\t\tclamp(point.y, viewport.minY + 5 / zoom, viewport.maxY - 5 / zoom),\n\t\t1 / zoom,\n\t\tVec.Angle(viewport.center, point)\n\t)\n\tconst cursorHintId = useSharedSafeId('cursor_hint')\n\n\treturn (\n\t\t<svg ref={rSvg} className={classNames('tl-overlays__item', className)}>\n\t\t\t<use\n\t\t\t\thref={`#${cursorHintId}`}\n\t\t\t\tcolor={color}\n\t\t\t\tstrokeWidth={3}\n\t\t\t\tstroke=\"var(--color-background)\"\n\t\t\t/>\n\t\t\t<use href={`#${cursorHintId}`} color={color} opacity={opacity} />\n\t\t</svg>\n\t)\n}\n"],
5
+ "mappings": "AAyCE,SACC,KADD;AAxCF,OAAO,gBAAgB;AACvB,SAAS,cAAc;AACvB,SAAS,uBAAuB;AAChC,SAAS,oBAAoB;AAE7B,SAAS,WAAW;AACpB,SAAS,aAAa;AAcf,SAAS,wBAAwB;AAAA,EACvC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,UAAU;AACX,GAA4B;AAC3B,QAAM,OAAO,OAAsB,IAAI;AAEvC;AAAA,IACC;AAAA,IACA,MAAM,MAAM,GAAG,SAAS,OAAO,IAAI,MAAM,SAAS,OAAO,IAAI,IAAI;AAAA,IACjE,MAAM,MAAM,GAAG,SAAS,OAAO,IAAI,MAAM,SAAS,OAAO,IAAI,IAAI;AAAA,IACjE,IAAI;AAAA,IACJ,IAAI,MAAM,SAAS,QAAQ,KAAK;AAAA,EACjC;AACA,QAAM,eAAe,gBAAgB,aAAa;AAElD,SACC,qBAAC,SAAI,KAAK,MAAM,WAAW,WAAW,qBAAqB,SAAS,GACnE;AAAA;AAAA,MAAC;AAAA;AAAA,QACA,MAAM,IAAI,YAAY;AAAA,QACtB;AAAA,QACA,aAAa;AAAA,QACb,QAAO;AAAA;AAAA,IACR;AAAA,IACA,oBAAC,SAAI,MAAM,IAAI,YAAY,IAAI,OAAc,SAAkB;AAAA,KAChE;AAEF;",
6
6
  "names": []
7
7
  }
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../src/lib/components/default-components/DefaultCursor.tsx"],
4
- "sourcesContent": ["import { VecModel } from '@tldraw/tlschema'\nimport classNames from 'classnames'\nimport { memo, useRef } from 'react'\nimport { useSharedSafeId } from '../../hooks/useSafeId'\nimport { useTransform } from '../../hooks/useTransform'\n\n/** @public */\nexport interface TLCursorProps {\n\tclassName?: string\n\tpoint: VecModel | null\n\tzoom: number\n\tcolor?: string\n\tname: string | null\n\tchatMessage: string\n}\n\n/** @public @react */\nexport const DefaultCursor = memo(function DefaultCursor({\n\tclassName,\n\tzoom,\n\tpoint,\n\tcolor,\n\tname,\n\tchatMessage,\n}: TLCursorProps) {\n\tconst rCursor = useRef<HTMLDivElement>(null)\n\tuseTransform(rCursor, point?.x, point?.y, 1 / zoom)\n\n\tconst cursorId = useSharedSafeId('cursor')\n\n\tif (!point) return null\n\n\treturn (\n\t\t<div ref={rCursor} className={classNames('tl-overlays__item', className)}>\n\t\t\t<svg className=\"tl-cursor\">\n\t\t\t\t<use href={`#${cursorId}`} color={color} />\n\t\t\t</svg>\n\t\t\t{chatMessage ? (\n\t\t\t\t<>\n\t\t\t\t\t{name && (\n\t\t\t\t\t\t<div className=\"tl-nametag-title\" style={{ color }}>\n\t\t\t\t\t\t\t{name}\n\t\t\t\t\t\t</div>\n\t\t\t\t\t)}\n\t\t\t\t\t<div className=\"tl-nametag-chat\" style={{ backgroundColor: color }}>\n\t\t\t\t\t\t{chatMessage}\n\t\t\t\t\t</div>\n\t\t\t\t</>\n\t\t\t) : (\n\t\t\t\tname && (\n\t\t\t\t\t<div className=\"tl-nametag\" style={{ backgroundColor: color }}>\n\t\t\t\t\t\t{name}\n\t\t\t\t\t</div>\n\t\t\t\t)\n\t\t\t)}\n\t\t</div>\n\t)\n})\n"],
5
- "mappings": "AAmCI,SAGA,UAHA,KAGA,YAHA;AAlCJ,OAAO,gBAAgB;AACvB,SAAS,MAAM,cAAc;AAC7B,SAAS,uBAAuB;AAChC,SAAS,oBAAoB;AAatB,MAAM,gBAAgB,KAAK,SAASA,eAAc;AAAA,EACxD;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACD,GAAkB;AACjB,QAAM,UAAU,OAAuB,IAAI;AAC3C,eAAa,SAAS,OAAO,GAAG,OAAO,GAAG,IAAI,IAAI;AAElD,QAAM,WAAW,gBAAgB,QAAQ;AAEzC,MAAI,CAAC,MAAO,QAAO;AAEnB,SACC,qBAAC,SAAI,KAAK,SAAS,WAAW,WAAW,qBAAqB,SAAS,GACtE;AAAA,wBAAC,SAAI,WAAU,aACd,8BAAC,SAAI,MAAM,IAAI,QAAQ,IAAI,OAAc,GAC1C;AAAA,IACC,cACA,iCACE;AAAA,cACA,oBAAC,SAAI,WAAU,oBAAmB,OAAO,EAAE,MAAM,GAC/C,gBACF;AAAA,MAED,oBAAC,SAAI,WAAU,mBAAkB,OAAO,EAAE,iBAAiB,MAAM,GAC/D,uBACF;AAAA,OACD,IAEA,QACC,oBAAC,SAAI,WAAU,cAAa,OAAO,EAAE,iBAAiB,MAAM,GAC1D,gBACF;AAAA,KAGH;AAEF,CAAC;",
4
+ "sourcesContent": ["import { VecModel } from '@tldraw/tlschema'\nimport classNames from 'classnames'\nimport { memo, useRef } from 'react'\nimport { useSharedSafeId } from '../../hooks/useSafeId'\nimport { useTransform } from '../../hooks/useTransform'\n\n/** @public */\nexport interface TLCursorProps {\n\tuserId: string\n\tclassName?: string\n\tpoint: VecModel | null\n\tzoom: number\n\tcolor?: string\n\tname: string | null\n\tchatMessage: string\n}\n\n/** @public @react */\nexport const DefaultCursor = memo(function DefaultCursor({\n\tclassName,\n\tzoom,\n\tpoint,\n\tcolor,\n\tname,\n\tchatMessage,\n}: TLCursorProps) {\n\tconst rCursor = useRef<HTMLDivElement>(null)\n\tuseTransform(rCursor, point?.x, point?.y, 1 / zoom)\n\n\tconst cursorId = useSharedSafeId('cursor')\n\n\tif (!point) return null\n\n\treturn (\n\t\t<div ref={rCursor} className={classNames('tl-overlays__item', className)}>\n\t\t\t<svg className=\"tl-cursor\">\n\t\t\t\t<use href={`#${cursorId}`} color={color} />\n\t\t\t</svg>\n\t\t\t{chatMessage ? (\n\t\t\t\t<>\n\t\t\t\t\t{name && (\n\t\t\t\t\t\t<div className=\"tl-nametag-title\" style={{ color }}>\n\t\t\t\t\t\t\t{name}\n\t\t\t\t\t\t</div>\n\t\t\t\t\t)}\n\t\t\t\t\t<div className=\"tl-nametag-chat\" style={{ backgroundColor: color }}>\n\t\t\t\t\t\t{chatMessage}\n\t\t\t\t\t</div>\n\t\t\t\t</>\n\t\t\t) : (\n\t\t\t\tname && (\n\t\t\t\t\t<div className=\"tl-nametag\" style={{ backgroundColor: color }}>\n\t\t\t\t\t\t{name}\n\t\t\t\t\t</div>\n\t\t\t\t)\n\t\t\t)}\n\t\t</div>\n\t)\n})\n"],
5
+ "mappings": "AAoCI,SAGA,UAHA,KAGA,YAHA;AAnCJ,OAAO,gBAAgB;AACvB,SAAS,MAAM,cAAc;AAC7B,SAAS,uBAAuB;AAChC,SAAS,oBAAoB;AActB,MAAM,gBAAgB,KAAK,SAASA,eAAc;AAAA,EACxD;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACD,GAAkB;AACjB,QAAM,UAAU,OAAuB,IAAI;AAC3C,eAAa,SAAS,OAAO,GAAG,OAAO,GAAG,IAAI,IAAI;AAElD,QAAM,WAAW,gBAAgB,QAAQ;AAEzC,MAAI,CAAC,MAAO,QAAO;AAEnB,SACC,qBAAC,SAAI,KAAK,SAAS,WAAW,WAAW,qBAAqB,SAAS,GACtE;AAAA,wBAAC,SAAI,WAAU,aACd,8BAAC,SAAI,MAAM,IAAI,QAAQ,IAAI,OAAc,GAC1C;AAAA,IACC,cACA,iCACE;AAAA,cACA,oBAAC,SAAI,WAAU,oBAAmB,OAAO,EAAE,MAAM,GAC/C,gBACF;AAAA,MAED,oBAAC,SAAI,WAAU,mBAAkB,OAAO,EAAE,iBAAiB,MAAM,GAC/D,uBACF;AAAA,OACD,IAEA,QACC,oBAAC,SAAI,WAAU,cAAa,OAAO,EAAE,iBAAiB,MAAM,GAC1D,gBACF;AAAA,KAGH;AAEF,CAAC;",
6
6
  "names": ["DefaultCursor"]
7
7
  }
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../src/lib/components/default-components/DefaultScribble.tsx"],
4
- "sourcesContent": ["import { TLScribble } from '@tldraw/tlschema'\nimport classNames from 'classnames'\nimport { getSvgPathFromPoints } from '../../utils/getSvgPathFromPoints'\n\n/** @public */\nexport interface TLScribbleProps {\n\tscribble: TLScribble\n\tzoom: number\n\tcolor?: string\n\topacity?: number\n\tclassName?: string\n}\n\n/** @public @react */\nexport function DefaultScribble({ scribble, zoom, color, opacity, className }: TLScribbleProps) {\n\tif (!scribble.points.length) return null\n\n\treturn (\n\t\t<svg className={className ? classNames('tl-overlays__item', className) : className}>\n\t\t\t<path\n\t\t\t\tclassName=\"tl-scribble\"\n\t\t\t\td={getSvgPathFromPoints(scribble.points, false)}\n\t\t\t\tstroke={color ?? `var(--color-${scribble.color})`}\n\t\t\t\tfill=\"none\"\n\t\t\t\tstrokeWidth={8 / zoom}\n\t\t\t\topacity={opacity ?? scribble.opacity}\n\t\t\t/>\n\t\t</svg>\n\t)\n}\n"],
5
- "mappings": "AAmBG;AAlBH,OAAO,gBAAgB;AACvB,SAAS,4BAA4B;AAY9B,SAAS,gBAAgB,EAAE,UAAU,MAAM,OAAO,SAAS,UAAU,GAAoB;AAC/F,MAAI,CAAC,SAAS,OAAO,OAAQ,QAAO;AAEpC,SACC,oBAAC,SAAI,WAAW,YAAY,WAAW,qBAAqB,SAAS,IAAI,WACxE;AAAA,IAAC;AAAA;AAAA,MACA,WAAU;AAAA,MACV,GAAG,qBAAqB,SAAS,QAAQ,KAAK;AAAA,MAC9C,QAAQ,SAAS,eAAe,SAAS,KAAK;AAAA,MAC9C,MAAK;AAAA,MACL,aAAa,IAAI;AAAA,MACjB,SAAS,WAAW,SAAS;AAAA;AAAA,EAC9B,GACD;AAEF;",
4
+ "sourcesContent": ["import { TLScribble } from '@tldraw/tlschema'\nimport classNames from 'classnames'\nimport { getSvgPathFromPoints } from '../../utils/getSvgPathFromPoints'\n\n/** @public */\nexport interface TLScribbleProps {\n\tuserId?: string\n\tscribble: TLScribble\n\tzoom: number\n\tcolor?: string\n\topacity?: number\n\tclassName?: string\n}\n\n/** @public @react */\nexport function DefaultScribble({ scribble, zoom, color, opacity, className }: TLScribbleProps) {\n\tif (!scribble.points.length) return null\n\n\treturn (\n\t\t<svg className={className ? classNames('tl-overlays__item', className) : className}>\n\t\t\t<path\n\t\t\t\tclassName=\"tl-scribble\"\n\t\t\t\td={getSvgPathFromPoints(scribble.points, false)}\n\t\t\t\tstroke={color ?? `var(--color-${scribble.color})`}\n\t\t\t\tfill=\"none\"\n\t\t\t\tstrokeWidth={8 / zoom}\n\t\t\t\topacity={opacity ?? scribble.opacity}\n\t\t\t/>\n\t\t</svg>\n\t)\n}\n"],
5
+ "mappings": "AAoBG;AAnBH,OAAO,gBAAgB;AACvB,SAAS,4BAA4B;AAa9B,SAAS,gBAAgB,EAAE,UAAU,MAAM,OAAO,SAAS,UAAU,GAAoB;AAC/F,MAAI,CAAC,SAAS,OAAO,OAAQ,QAAO;AAEpC,SACC,oBAAC,SAAI,WAAW,YAAY,WAAW,qBAAqB,SAAS,IAAI,WACxE;AAAA,IAAC;AAAA;AAAA,MACA,WAAU;AAAA,MACV,GAAG,qBAAqB,SAAS,QAAQ,KAAK;AAAA,MAC9C,QAAQ,SAAS,eAAe,SAAS,KAAK;AAAA,MAC9C,MAAK;AAAA,MACL,aAAa,IAAI;AAAA,MACjB,SAAS,WAAW,SAAS;AAAA;AAAA,EAC9B,GACD;AAEF;",
6
6
  "names": []
7
7
  }
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../src/lib/components/default-components/DefaultShapeIndicator.tsx"],
4
- "sourcesContent": ["import { useQuickReactor, useStateTracking, useValue } from '@tldraw/state-react'\nimport { TLShape, TLShapeId } from '@tldraw/tlschema'\nimport classNames from 'classnames'\nimport { memo, useLayoutEffect, useRef } from 'react'\nimport type { Editor } from '../../editor/Editor'\nimport { ShapeUtil } from '../../editor/shapes/ShapeUtil'\nimport { useEditor } from '../../hooks/useEditor'\nimport { useEditorComponents } from '../../hooks/useEditorComponents'\nimport { OptionalErrorBoundary } from '../ErrorBoundary'\n\n// need an extra layer of indirection here to allow hooks to be used inside the indicator render\nconst EvenInnererIndicator = ({ shape, util }: { shape: TLShape; util: ShapeUtil<any> }) => {\n\treturn useStateTracking('Indicator: ' + shape.type, () =>\n\t\t// always fetch the latest shape from the store even if the props/meta have not changed, to avoid\n\t\t// calling the render method with stale data.\n\t\tutil.indicator(util.editor.store.unsafeGetWithoutCapture(shape.id) as TLShape)\n\t)\n}\n\nconst InnerIndicator = ({ editor, id }: { editor: Editor; id: TLShapeId }) => {\n\tconst shape = useValue('shape for indicator', () => editor.store.get(id), [editor, id])\n\n\tconst { ShapeIndicatorErrorFallback } = useEditorComponents()\n\n\tif (!shape || shape.isLocked) return null\n\n\treturn (\n\t\t<OptionalErrorBoundary\n\t\t\tfallback={ShapeIndicatorErrorFallback}\n\t\t\tonError={(error) =>\n\t\t\t\teditor.annotateError(error, { origin: 'react.shapeIndicator', willCrashApp: false })\n\t\t\t}\n\t\t>\n\t\t\t<EvenInnererIndicator key={shape.id} shape={shape} util={editor.getShapeUtil(shape)} />\n\t\t</OptionalErrorBoundary>\n\t)\n}\n\n/** @public */\nexport interface TLShapeIndicatorProps {\n\tshapeId: TLShapeId\n\tcolor?: string | undefined\n\topacity?: number\n\tclassName?: string\n\thidden?: boolean\n}\n\n/** @public @react */\nexport const DefaultShapeIndicator = memo(function DefaultShapeIndicator({\n\tshapeId,\n\tclassName,\n\tcolor,\n\thidden,\n\topacity,\n}: TLShapeIndicatorProps) {\n\tconst editor = useEditor()\n\n\tconst rIndicator = useRef<SVGSVGElement>(null)\n\n\tuseQuickReactor(\n\t\t'indicator transform',\n\t\t() => {\n\t\t\tconst elm = rIndicator.current\n\t\t\tif (!elm) return\n\t\t\tconst pageTransform = editor.getShapePageTransform(shapeId)\n\t\t\tif (!pageTransform) return\n\t\t\telm.style.setProperty('transform', pageTransform.toCssString())\n\t\t},\n\t\t[editor, shapeId]\n\t)\n\n\tuseLayoutEffect(() => {\n\t\tconst elm = rIndicator.current\n\t\tif (!elm) return\n\t\telm.style.setProperty('display', hidden ? 'none' : 'block')\n\t}, [hidden])\n\n\treturn (\n\t\t<svg ref={rIndicator} className={classNames('tl-overlays__item', className)}>\n\t\t\t<g className=\"tl-shape-indicator\" stroke={color ?? 'var(--color-selected)'} opacity={opacity}>\n\t\t\t\t<InnerIndicator editor={editor} id={shapeId} />\n\t\t\t</g>\n\t\t</svg>\n\t)\n})\n"],
5
- "mappings": "AAiCG;AAjCH,SAAS,iBAAiB,kBAAkB,gBAAgB;AAE5D,OAAO,gBAAgB;AACvB,SAAS,MAAM,iBAAiB,cAAc;AAG9C,SAAS,iBAAiB;AAC1B,SAAS,2BAA2B;AACpC,SAAS,6BAA6B;AAGtC,MAAM,uBAAuB,CAAC,EAAE,OAAO,KAAK,MAAgD;AAC3F,SAAO;AAAA,IAAiB,gBAAgB,MAAM;AAAA,IAAM;AAAA;AAAA;AAAA,MAGnD,KAAK,UAAU,KAAK,OAAO,MAAM,wBAAwB,MAAM,EAAE,CAAY;AAAA;AAAA,EAC9E;AACD;AAEA,MAAM,iBAAiB,CAAC,EAAE,QAAQ,GAAG,MAAyC;AAC7E,QAAM,QAAQ,SAAS,uBAAuB,MAAM,OAAO,MAAM,IAAI,EAAE,GAAG,CAAC,QAAQ,EAAE,CAAC;AAEtF,QAAM,EAAE,4BAA4B,IAAI,oBAAoB;AAE5D,MAAI,CAAC,SAAS,MAAM,SAAU,QAAO;AAErC,SACC;AAAA,IAAC;AAAA;AAAA,MACA,UAAU;AAAA,MACV,SAAS,CAAC,UACT,OAAO,cAAc,OAAO,EAAE,QAAQ,wBAAwB,cAAc,MAAM,CAAC;AAAA,MAGpF,8BAAC,wBAAoC,OAAc,MAAM,OAAO,aAAa,KAAK,KAAvD,MAAM,EAAoD;AAAA;AAAA,EACtF;AAEF;AAYO,MAAM,wBAAwB,KAAK,SAASA,uBAAsB;AAAA,EACxE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACD,GAA0B;AACzB,QAAM,SAAS,UAAU;AAEzB,QAAM,aAAa,OAAsB,IAAI;AAE7C;AAAA,IACC;AAAA,IACA,MAAM;AACL,YAAM,MAAM,WAAW;AACvB,UAAI,CAAC,IAAK;AACV,YAAM,gBAAgB,OAAO,sBAAsB,OAAO;AAC1D,UAAI,CAAC,cAAe;AACpB,UAAI,MAAM,YAAY,aAAa,cAAc,YAAY,CAAC;AAAA,IAC/D;AAAA,IACA,CAAC,QAAQ,OAAO;AAAA,EACjB;AAEA,kBAAgB,MAAM;AACrB,UAAM,MAAM,WAAW;AACvB,QAAI,CAAC,IAAK;AACV,QAAI,MAAM,YAAY,WAAW,SAAS,SAAS,OAAO;AAAA,EAC3D,GAAG,CAAC,MAAM,CAAC;AAEX,SACC,oBAAC,SAAI,KAAK,YAAY,WAAW,WAAW,qBAAqB,SAAS,GACzE,8BAAC,OAAE,WAAU,sBAAqB,QAAQ,SAAS,yBAAyB,SAC3E,8BAAC,kBAAe,QAAgB,IAAI,SAAS,GAC9C,GACD;AAEF,CAAC;",
4
+ "sourcesContent": ["import { useQuickReactor, useStateTracking, useValue } from '@tldraw/state-react'\nimport { TLShape, TLShapeId } from '@tldraw/tlschema'\nimport classNames from 'classnames'\nimport { memo, useLayoutEffect, useRef } from 'react'\nimport type { Editor } from '../../editor/Editor'\nimport { ShapeUtil } from '../../editor/shapes/ShapeUtil'\nimport { useEditor } from '../../hooks/useEditor'\nimport { useEditorComponents } from '../../hooks/useEditorComponents'\nimport { OptionalErrorBoundary } from '../ErrorBoundary'\n\n// need an extra layer of indirection here to allow hooks to be used inside the indicator render\nconst EvenInnererIndicator = ({ shape, util }: { shape: TLShape; util: ShapeUtil<any> }) => {\n\treturn useStateTracking('Indicator: ' + shape.type, () =>\n\t\t// always fetch the latest shape from the store even if the props/meta have not changed, to avoid\n\t\t// calling the render method with stale data.\n\t\tutil.indicator(util.editor.store.unsafeGetWithoutCapture(shape.id) as TLShape)\n\t)\n}\n\nconst InnerIndicator = ({ editor, id }: { editor: Editor; id: TLShapeId }) => {\n\tconst shape = useValue('shape for indicator', () => editor.store.get(id), [editor, id])\n\n\tconst { ShapeIndicatorErrorFallback } = useEditorComponents()\n\n\tif (!shape || shape.isLocked) return null\n\n\treturn (\n\t\t<OptionalErrorBoundary\n\t\t\tfallback={ShapeIndicatorErrorFallback}\n\t\t\tonError={(error) =>\n\t\t\t\teditor.annotateError(error, { origin: 'react.shapeIndicator', willCrashApp: false })\n\t\t\t}\n\t\t>\n\t\t\t<EvenInnererIndicator key={shape.id} shape={shape} util={editor.getShapeUtil(shape)} />\n\t\t</OptionalErrorBoundary>\n\t)\n}\n\n/** @public */\nexport interface TLShapeIndicatorProps {\n\tuserId?: string\n\tshapeId: TLShapeId\n\tcolor?: string | undefined\n\topacity?: number\n\tclassName?: string\n\thidden?: boolean\n}\n\n/** @public @react */\nexport const DefaultShapeIndicator = memo(function DefaultShapeIndicator({\n\tshapeId,\n\tclassName,\n\tcolor,\n\thidden,\n\topacity,\n}: TLShapeIndicatorProps) {\n\tconst editor = useEditor()\n\n\tconst rIndicator = useRef<SVGSVGElement>(null)\n\n\tuseQuickReactor(\n\t\t'indicator transform',\n\t\t() => {\n\t\t\tconst elm = rIndicator.current\n\t\t\tif (!elm) return\n\t\t\tconst pageTransform = editor.getShapePageTransform(shapeId)\n\t\t\tif (!pageTransform) return\n\t\t\telm.style.setProperty('transform', pageTransform.toCssString())\n\t\t},\n\t\t[editor, shapeId]\n\t)\n\n\tuseLayoutEffect(() => {\n\t\tconst elm = rIndicator.current\n\t\tif (!elm) return\n\t\telm.style.setProperty('display', hidden ? 'none' : 'block')\n\t}, [hidden])\n\n\treturn (\n\t\t<svg ref={rIndicator} className={classNames('tl-overlays__item', className)}>\n\t\t\t<g className=\"tl-shape-indicator\" stroke={color ?? 'var(--color-selected)'} opacity={opacity}>\n\t\t\t\t<InnerIndicator editor={editor} id={shapeId} />\n\t\t\t</g>\n\t\t</svg>\n\t)\n})\n"],
5
+ "mappings": "AAiCG;AAjCH,SAAS,iBAAiB,kBAAkB,gBAAgB;AAE5D,OAAO,gBAAgB;AACvB,SAAS,MAAM,iBAAiB,cAAc;AAG9C,SAAS,iBAAiB;AAC1B,SAAS,2BAA2B;AACpC,SAAS,6BAA6B;AAGtC,MAAM,uBAAuB,CAAC,EAAE,OAAO,KAAK,MAAgD;AAC3F,SAAO;AAAA,IAAiB,gBAAgB,MAAM;AAAA,IAAM;AAAA;AAAA;AAAA,MAGnD,KAAK,UAAU,KAAK,OAAO,MAAM,wBAAwB,MAAM,EAAE,CAAY;AAAA;AAAA,EAC9E;AACD;AAEA,MAAM,iBAAiB,CAAC,EAAE,QAAQ,GAAG,MAAyC;AAC7E,QAAM,QAAQ,SAAS,uBAAuB,MAAM,OAAO,MAAM,IAAI,EAAE,GAAG,CAAC,QAAQ,EAAE,CAAC;AAEtF,QAAM,EAAE,4BAA4B,IAAI,oBAAoB;AAE5D,MAAI,CAAC,SAAS,MAAM,SAAU,QAAO;AAErC,SACC;AAAA,IAAC;AAAA;AAAA,MACA,UAAU;AAAA,MACV,SAAS,CAAC,UACT,OAAO,cAAc,OAAO,EAAE,QAAQ,wBAAwB,cAAc,MAAM,CAAC;AAAA,MAGpF,8BAAC,wBAAoC,OAAc,MAAM,OAAO,aAAa,KAAK,KAAvD,MAAM,EAAoD;AAAA;AAAA,EACtF;AAEF;AAaO,MAAM,wBAAwB,KAAK,SAASA,uBAAsB;AAAA,EACxE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACD,GAA0B;AACzB,QAAM,SAAS,UAAU;AAEzB,QAAM,aAAa,OAAsB,IAAI;AAE7C;AAAA,IACC;AAAA,IACA,MAAM;AACL,YAAM,MAAM,WAAW;AACvB,UAAI,CAAC,IAAK;AACV,YAAM,gBAAgB,OAAO,sBAAsB,OAAO;AAC1D,UAAI,CAAC,cAAe;AACpB,UAAI,MAAM,YAAY,aAAa,cAAc,YAAY,CAAC;AAAA,IAC/D;AAAA,IACA,CAAC,QAAQ,OAAO;AAAA,EACjB;AAEA,kBAAgB,MAAM;AACrB,UAAM,MAAM,WAAW;AACvB,QAAI,CAAC,IAAK;AACV,QAAI,MAAM,YAAY,WAAW,SAAS,SAAS,OAAO;AAAA,EAC3D,GAAG,CAAC,MAAM,CAAC;AAEX,SACC,oBAAC,SAAI,KAAK,YAAY,WAAW,WAAW,qBAAqB,SAAS,GACzE,8BAAC,OAAE,WAAU,sBAAqB,QAAQ,SAAS,yBAAyB,SAC3E,8BAAC,kBAAe,QAAgB,IAAI,SAAS,GAC9C,GACD;AAEF,CAAC;",
6
6
  "names": ["DefaultShapeIndicator"]
7
7
  }
@@ -46,8 +46,15 @@ var __privateIn = (member, obj) => Object(obj) !== obj ? __typeError('Cannot use
46
46
  var __privateGet = (obj, member, getter) => (__accessCheck(obj, member, "read from private field"), getter ? getter.call(obj) : member.get(obj));
47
47
  var __privateSet = (obj, member, value, setter) => (__accessCheck(obj, member, "write to private field"), setter ? setter.call(obj, value) : member.set(obj, value), value);
48
48
  var __privateMethod = (obj, member, method) => (__accessCheck(obj, member, "access private method"), method);
49
- var __setMetaKeyTimeout_dec, __setCtrlKeyTimeout_dec, __setAltKeyTimeout_dec, __setShiftKeyTimeout_dec, _getIsReadonly_dec, _getIsFocused_dec, _getSharedOpacity_dec, _getSharedStyles_dec, __getSelectionSharedStyles_dec, __getBindingsIndexCache_dec, _getCurrentPageRenderingShapesSorted_dec, _getCurrentPageShapesSorted_dec, _getCurrentPageShapes_dec, _getCurrentPageBounds_dec, _getCulledShapes_dec, __notVisibleShapes_dec, __getShapeMaskedPageBoundsCache_dec, __getShapeMaskCache_dec, __getShapeClipPathCache_dec, __getShapePageBoundsCache_dec, __getShapePageTransformCache_dec, __getShapeHandlesCache_dec, __getAllAssetsQuery_dec, _getCurrentPageShapeIdsSorted_dec, _getCurrentPageId_dec, _getPages_dec, __getAllPagesQuery_dec, _getRenderingShapes_dec, _getCollaboratorsOnCurrentPage_dec, _getCollaborators_dec, __getCollaboratorsQuery_dec, _getViewportPageBounds_dec, _getViewportScreenCenter_dec, _getViewportScreenBounds_dec, _getZoomLevel_dec, _getCameraForFollowing_dec, _getViewportPageBoundsForFollowing_dec, _getCamera_dec, __unsafe_getCameraId_dec, _getErasingShapes_dec, _getErasingShapeIds_dec, _getHintingShape_dec, _getHintingShapeIds_dec, _getHoveredShape_dec, _getHoveredShapeId_dec, _getEditingShape_dec, _getEditingShapeId_dec, _getFocusedGroup_dec, _getFocusedGroupId_dec, _getSelectionRotatedScreenBounds_dec, _getSelectionRotatedPageBounds_dec, _getSelectionRotation_dec, _getSelectionPageBounds_dec, _getOnlySelectedShape_dec, _getOnlySelectedShapeId_dec, _getSelectedShapes_dec, _getSelectedShapeIds_dec, __getCurrentPageStateId_dec, _getCurrentPageState_dec, __getPageStatesQuery_dec, _getPageStates_dec, _getIsMenuOpen_dec, _getOpenMenus_dec, _getInstanceState_dec, _getDocumentSettings_dec, _getCurrentToolId_dec, _getCurrentTool_dec, _getPath_dec, _getCanRedo_dec, _getCanUndo_dec, _getIsShapeHiddenCache_dec, _a, _init;
50
- import { EMPTY_ARRAY, atom, computed, react, transact, unsafe__withoutCapture } from "@tldraw/state";
49
+ var __setMetaKeyTimeout_dec, __setCtrlKeyTimeout_dec, __setAltKeyTimeout_dec, __setShiftKeyTimeout_dec, _getIsReadonly_dec, _getIsFocused_dec, _getSharedOpacity_dec, _getSharedStyles_dec, __getSelectionSharedStyles_dec, __getBindingsIndexCache_dec, _getCurrentPageRenderingShapesSorted_dec, _getCurrentPageShapesSorted_dec, _getCurrentPageShapes_dec, _getCurrentPageBounds_dec, _getCulledShapes_dec, __notVisibleShapes_dec, __getShapeMaskedPageBoundsCache_dec, __getShapeMaskCache_dec, __getShapeClipPathCache_dec, __getShapePageBoundsCache_dec, __getShapePageTransformCache_dec, __getShapeHandlesCache_dec, __getAllAssetsQuery_dec, _getCurrentPageShapeIdsSorted_dec, _getCurrentPageId_dec, _getPages_dec, __getAllPagesQuery_dec, _getRenderingShapes_dec, _getCollaboratorsOnCurrentPage_dec, _getCollaborators_dec, __getCollaboratorsQuery_dec, _getViewportPageBounds_dec, _getViewportScreenCenter_dec, _getViewportScreenBounds_dec, _getZoomLevel_dec, _getCameraForFollowing_dec, _getViewportPageBoundsForFollowing_dec, _getCamera_dec, __unsafe_getCameraId_dec, _getErasingShapes_dec, _getErasingShapeIds_dec, _getHintingShape_dec, _getHintingShapeIds_dec, _getHoveredShape_dec, _getHoveredShapeId_dec, _getRichTextEditor_dec, _getEditingShape_dec, _getEditingShapeId_dec, _getFocusedGroup_dec, _getFocusedGroupId_dec, _getSelectionRotatedScreenBounds_dec, _getSelectionRotatedPageBounds_dec, _getSelectionRotation_dec, _getSelectionPageBounds_dec, _getOnlySelectedShape_dec, _getOnlySelectedShapeId_dec, _getSelectedShapes_dec, _getSelectedShapeIds_dec, __getCurrentPageStateId_dec, _getCurrentPageState_dec, __getPageStatesQuery_dec, _getPageStates_dec, _getIsMenuOpen_dec, _getOpenMenus_dec, _getInstanceState_dec, _getDocumentSettings_dec, _getCurrentToolId_dec, _getCurrentTool_dec, _getPath_dec, _getCanRedo_dec, _getCanUndo_dec, _getIsShapeHiddenCache_dec, _a, _init;
50
+ import {
51
+ EMPTY_ARRAY,
52
+ atom,
53
+ computed,
54
+ react,
55
+ transact,
56
+ unsafe__withoutCapture
57
+ } from "@tldraw/state";
51
58
  import {
52
59
  reverseRecordsDiff
53
60
  } from "@tldraw/store";
@@ -142,6 +149,7 @@ import { deriveShapeIdsInCurrentPage } from "./derivations/shapeIdsInCurrentPage
142
149
  import { ClickManager } from "./managers/ClickManager.mjs";
143
150
  import { EdgeScrollManager } from "./managers/EdgeScrollManager.mjs";
144
151
  import { FocusManager } from "./managers/FocusManager.mjs";
152
+ import { FontManager } from "./managers/FontManager.mjs";
145
153
  import { HistoryManager } from "./managers/HistoryManager.mjs";
146
154
  import { ScribbleManager } from "./managers/ScribbleManager.mjs";
147
155
  import { SnapManager } from "./managers/SnapManager/SnapManager.mjs";
@@ -149,7 +157,7 @@ import { TextManager } from "./managers/TextManager.mjs";
149
157
  import { TickManager } from "./managers/TickManager.mjs";
150
158
  import { UserPreferencesManager } from "./managers/UserPreferencesManager.mjs";
151
159
  import { RootState } from "./tools/RootState.mjs";
152
- class Editor extends (_a = EventEmitter, _getIsShapeHiddenCache_dec = [computed], _getCanUndo_dec = [computed], _getCanRedo_dec = [computed], _getPath_dec = [computed], _getCurrentTool_dec = [computed], _getCurrentToolId_dec = [computed], _getDocumentSettings_dec = [computed], _getInstanceState_dec = [computed], _getOpenMenus_dec = [computed], _getIsMenuOpen_dec = [computed], _getPageStates_dec = [computed], __getPageStatesQuery_dec = [computed], _getCurrentPageState_dec = [computed], __getCurrentPageStateId_dec = [computed], _getSelectedShapeIds_dec = [computed], _getSelectedShapes_dec = [computed], _getOnlySelectedShapeId_dec = [computed], _getOnlySelectedShape_dec = [computed], _getSelectionPageBounds_dec = [computed], _getSelectionRotation_dec = [computed], _getSelectionRotatedPageBounds_dec = [computed], _getSelectionRotatedScreenBounds_dec = [computed], _getFocusedGroupId_dec = [computed], _getFocusedGroup_dec = [computed], _getEditingShapeId_dec = [computed], _getEditingShape_dec = [computed], _getHoveredShapeId_dec = [computed], _getHoveredShape_dec = [computed], _getHintingShapeIds_dec = [computed], _getHintingShape_dec = [computed], _getErasingShapeIds_dec = [computed], _getErasingShapes_dec = [computed], __unsafe_getCameraId_dec = [computed], _getCamera_dec = [computed], _getViewportPageBoundsForFollowing_dec = [computed], _getCameraForFollowing_dec = [computed], _getZoomLevel_dec = [computed], _getViewportScreenBounds_dec = [computed], _getViewportScreenCenter_dec = [computed], _getViewportPageBounds_dec = [computed], __getCollaboratorsQuery_dec = [computed], _getCollaborators_dec = [computed], _getCollaboratorsOnCurrentPage_dec = [computed], _getRenderingShapes_dec = [computed], __getAllPagesQuery_dec = [computed], _getPages_dec = [computed], _getCurrentPageId_dec = [computed], _getCurrentPageShapeIdsSorted_dec = [computed], __getAllAssetsQuery_dec = [computed], __getShapeHandlesCache_dec = [computed], __getShapePageTransformCache_dec = [computed], __getShapePageBoundsCache_dec = [computed], __getShapeClipPathCache_dec = [computed], __getShapeMaskCache_dec = [computed], __getShapeMaskedPageBoundsCache_dec = [computed], __notVisibleShapes_dec = [computed], _getCulledShapes_dec = [computed], _getCurrentPageBounds_dec = [computed], _getCurrentPageShapes_dec = [computed], _getCurrentPageShapesSorted_dec = [computed], _getCurrentPageRenderingShapesSorted_dec = [computed], __getBindingsIndexCache_dec = [computed], __getSelectionSharedStyles_dec = [computed], _getSharedStyles_dec = [computed({ isEqual: (a, b) => a.equals(b) })], _getSharedOpacity_dec = [computed], _getIsFocused_dec = [computed], _getIsReadonly_dec = [computed], __setShiftKeyTimeout_dec = [bind], __setAltKeyTimeout_dec = [bind], __setCtrlKeyTimeout_dec = [bind], __setMetaKeyTimeout_dec = [bind], _a) {
160
+ class Editor extends (_a = EventEmitter, _getIsShapeHiddenCache_dec = [computed], _getCanUndo_dec = [computed], _getCanRedo_dec = [computed], _getPath_dec = [computed], _getCurrentTool_dec = [computed], _getCurrentToolId_dec = [computed], _getDocumentSettings_dec = [computed], _getInstanceState_dec = [computed], _getOpenMenus_dec = [computed], _getIsMenuOpen_dec = [computed], _getPageStates_dec = [computed], __getPageStatesQuery_dec = [computed], _getCurrentPageState_dec = [computed], __getCurrentPageStateId_dec = [computed], _getSelectedShapeIds_dec = [computed], _getSelectedShapes_dec = [computed], _getOnlySelectedShapeId_dec = [computed], _getOnlySelectedShape_dec = [computed], _getSelectionPageBounds_dec = [computed], _getSelectionRotation_dec = [computed], _getSelectionRotatedPageBounds_dec = [computed], _getSelectionRotatedScreenBounds_dec = [computed], _getFocusedGroupId_dec = [computed], _getFocusedGroup_dec = [computed], _getEditingShapeId_dec = [computed], _getEditingShape_dec = [computed], _getRichTextEditor_dec = [computed], _getHoveredShapeId_dec = [computed], _getHoveredShape_dec = [computed], _getHintingShapeIds_dec = [computed], _getHintingShape_dec = [computed], _getErasingShapeIds_dec = [computed], _getErasingShapes_dec = [computed], __unsafe_getCameraId_dec = [computed], _getCamera_dec = [computed], _getViewportPageBoundsForFollowing_dec = [computed], _getCameraForFollowing_dec = [computed], _getZoomLevel_dec = [computed], _getViewportScreenBounds_dec = [computed], _getViewportScreenCenter_dec = [computed], _getViewportPageBounds_dec = [computed], __getCollaboratorsQuery_dec = [computed], _getCollaborators_dec = [computed], _getCollaboratorsOnCurrentPage_dec = [computed], _getRenderingShapes_dec = [computed], __getAllPagesQuery_dec = [computed], _getPages_dec = [computed], _getCurrentPageId_dec = [computed], _getCurrentPageShapeIdsSorted_dec = [computed], __getAllAssetsQuery_dec = [computed], __getShapeHandlesCache_dec = [computed], __getShapePageTransformCache_dec = [computed], __getShapePageBoundsCache_dec = [computed], __getShapeClipPathCache_dec = [computed], __getShapeMaskCache_dec = [computed], __getShapeMaskedPageBoundsCache_dec = [computed], __notVisibleShapes_dec = [computed], _getCulledShapes_dec = [computed], _getCurrentPageBounds_dec = [computed], _getCurrentPageShapes_dec = [computed], _getCurrentPageShapesSorted_dec = [computed], _getCurrentPageRenderingShapesSorted_dec = [computed], __getBindingsIndexCache_dec = [computed], __getSelectionSharedStyles_dec = [computed], _getSharedStyles_dec = [computed({ isEqual: (a, b) => a.equals(b) })], _getSharedOpacity_dec = [computed], _getIsFocused_dec = [computed], _getIsReadonly_dec = [computed], __setShiftKeyTimeout_dec = [bind], __setAltKeyTimeout_dec = [bind], __setCtrlKeyTimeout_dec = [bind], __setMetaKeyTimeout_dec = [bind], _a) {
153
161
  constructor({
154
162
  store,
155
163
  user,
@@ -158,14 +166,17 @@ class Editor extends (_a = EventEmitter, _getIsShapeHiddenCache_dec = [computed]
158
166
  tools,
159
167
  getContainer,
160
168
  cameraOptions,
169
+ textOptions,
161
170
  initialState,
162
171
  autoFocus,
163
172
  inferDarkMode,
164
173
  options,
165
- isShapeHidden
174
+ isShapeHidden,
175
+ fontAssetUrls
166
176
  }) {
167
177
  super();
168
178
  __runInitializers(_init, 5, this);
179
+ __publicField(this, "id", uniqueId());
169
180
  __publicField(this, "_isShapeHiddenPredicate");
170
181
  __publicField(this, "options");
171
182
  __publicField(this, "contextId", uniqueId());
@@ -220,6 +231,12 @@ class Editor extends (_a = EventEmitter, _getIsShapeHiddenCache_dec = [computed]
220
231
  * @public
221
232
  */
222
233
  __publicField(this, "textMeasure");
234
+ /**
235
+ * A utility for managing the set of fonts that should be rendered in the document.
236
+ *
237
+ * @public
238
+ */
239
+ __publicField(this, "fonts");
223
240
  /**
224
241
  * A manager for the editor's environment.
225
242
  *
@@ -291,6 +308,9 @@ class Editor extends (_a = EventEmitter, _getIsShapeHiddenCache_dec = [computed]
291
308
  __publicField(this, "_isChangingStyleTimeout", -1);
292
309
  // Menus
293
310
  __publicField(this, "menus", tlmenus.forContext(this.contextId));
311
+ // Rich text editor
312
+ __publicField(this, "_currentRichTextEditor", atom("rich text editor", null));
313
+ __publicField(this, "_textOptions");
294
314
  __publicField(this, "_cameraOptions", atom("camera options", DEFAULT_CAMERA_OPTIONS));
295
315
  /** @internal */
296
316
  __publicField(this, "_viewportAnimation", null);
@@ -438,10 +458,12 @@ class Editor extends (_a = EventEmitter, _getIsShapeHiddenCache_dec = [computed]
438
458
  this.snaps = new SnapManager(this);
439
459
  this.disposables.add(this.timers.dispose);
440
460
  this._cameraOptions.set({ ...DEFAULT_CAMERA_OPTIONS, ...cameraOptions });
461
+ this._textOptions = atom("text options", textOptions ?? null);
441
462
  this.user = new UserPreferencesManager(user ?? createTLUser(), inferDarkMode ?? false);
442
463
  this.disposables.add(() => this.user.dispose());
443
464
  this.getContainer = getContainer;
444
465
  this.textMeasure = new TextManager(this);
466
+ this.fonts = new FontManager(this, fontAssetUrls);
445
467
  this._tickManager = new TickManager(this);
446
468
  class NewRoot extends RootState {
447
469
  static initial = initialState ?? "";
@@ -1613,6 +1635,7 @@ class Editor extends (_a = EventEmitter, _getIsShapeHiddenCache_dec = [computed]
1613
1635
  */
1614
1636
  setEditingShape(shape) {
1615
1637
  const id = typeof shape === "string" ? shape : shape?.id ?? null;
1638
+ this.setRichTextEditor(null);
1616
1639
  if (id !== this.getEditingShapeId()) {
1617
1640
  if (id) {
1618
1641
  const shape2 = this.getShape(id);
@@ -1629,12 +1652,36 @@ class Editor extends (_a = EventEmitter, _getIsShapeHiddenCache_dec = [computed]
1629
1652
  this.run(
1630
1653
  () => {
1631
1654
  this._updateCurrentPageState({ editingShapeId: null });
1655
+ this._currentRichTextEditor.set(null);
1632
1656
  },
1633
1657
  { history: "ignore" }
1634
1658
  );
1635
1659
  }
1636
1660
  return this;
1637
1661
  }
1662
+ getRichTextEditor() {
1663
+ return this._currentRichTextEditor.get();
1664
+ }
1665
+ /**
1666
+ * Set the current editing shape's rich text editor.
1667
+ *
1668
+ * @example
1669
+ * ```ts
1670
+ * editor.setRichTextEditor(richTextEditorView)
1671
+ * ```
1672
+ *
1673
+ * @param textEditor - The text editor to set as the current editing shape's text editor.
1674
+ *
1675
+ * @public
1676
+ */
1677
+ setRichTextEditor(textEditor) {
1678
+ const current = this._currentRichTextEditor.__unsafe__getWithoutCapture();
1679
+ if (current !== textEditor) {
1680
+ current?.destroy();
1681
+ }
1682
+ this._currentRichTextEditor.set(textEditor);
1683
+ return this;
1684
+ }
1638
1685
  getHoveredShapeId() {
1639
1686
  return this.getCurrentPageState().hoveredShapeId;
1640
1687
  }
@@ -1780,6 +1827,18 @@ class Editor extends (_a = EventEmitter, _getIsShapeHiddenCache_dec = [computed]
1780
1827
  }
1781
1828
  return this;
1782
1829
  }
1830
+ /**
1831
+ * Get the current text options.
1832
+ *
1833
+ * @example
1834
+ * ```ts
1835
+ * editor.getTextOptions()
1836
+ * ```
1837
+ *
1838
+ * @public */
1839
+ getTextOptions() {
1840
+ return assertExists(this._textOptions.get(), "Cannot use text without setting textOptions");
1841
+ }
1783
1842
  _unsafe_getCameraId() {
1784
1843
  return CameraRecordType.createId(this.getCurrentPageId());
1785
1844
  }
@@ -3244,7 +3303,10 @@ class Editor extends (_a = EventEmitter, _getIsShapeHiddenCache_dec = [computed]
3244
3303
  if (!this._shapeGeometryCaches[context]) {
3245
3304
  this._shapeGeometryCaches[context] = this.store.createComputedCache(
3246
3305
  "bounds",
3247
- (shape2) => this.getShapeUtil(shape2).getGeometry(shape2, opts),
3306
+ (shape2) => {
3307
+ this.fonts.trackFontsForShape(shape2);
3308
+ return this.getShapeUtil(shape2).getGeometry(shape2, opts);
3309
+ },
3248
3310
  { areRecordsEqual: (a, b) => a.props === b.props }
3249
3311
  );
3250
3312
  }
@@ -3652,7 +3714,7 @@ class Editor extends (_a = EventEmitter, _getIsShapeHiddenCache_dec = [computed]
3652
3714
  const geometry = this.getShapeGeometry(shape);
3653
3715
  const isGroup = geometry instanceof Group2d;
3654
3716
  const pointInShapeSpace = this.getPointInShapeSpace(shape, point);
3655
- if (this.isShapeOfType(shape, "frame") || (this.isShapeOfType(shape, "arrow") || this.isShapeOfType(shape, "geo") && shape.props.fill === "none") && shape.props.text.trim()) {
3717
+ if (this.isShapeOfType(shape, "frame") || this.isShapeOfType(shape, "arrow") && shape.props.text.trim() || (this.isShapeOfType(shape, "note") || this.isShapeOfType(shape, "geo") && shape.props.fill === "none") && this.getShapeUtil(shape).getText(shape)?.trim()) {
3656
3718
  for (const childGeometry of geometry.children) {
3657
3719
  if (childGeometry.isLabel && childGeometry.isPointInBounds(pointInShapeSpace)) {
3658
3720
  return shape;
@@ -5465,7 +5527,7 @@ class Editor extends (_a = EventEmitter, _getIsShapeHiddenCache_dec = [computed]
5465
5527
  * @example
5466
5528
  * ```ts
5467
5529
  * editor.createShape(myShape)
5468
- * editor.createShape({ id: 'box1', type: 'text', props: { text: "ok" } })
5530
+ * editor.createShape({ id: 'box1', type: 'text', props: { richText: toRichText("ok") } })
5469
5531
  * ```
5470
5532
  *
5471
5533
  * @param shape - The shape (or shape partial) to create.
@@ -5482,7 +5544,7 @@ class Editor extends (_a = EventEmitter, _getIsShapeHiddenCache_dec = [computed]
5482
5544
  * @example
5483
5545
  * ```ts
5484
5546
  * editor.createShapes([myShape])
5485
- * editor.createShapes([{ id: 'box1', type: 'text', props: { text: "ok" } }])
5547
+ * editor.createShapes([{ id: 'box1', type: 'text', props: { richText: toRichText("ok") } }])
5486
5548
  * ```
5487
5549
  *
5488
5550
  * @param shapes - The shapes (or shape partials) to create.
@@ -7487,6 +7549,7 @@ __decorateElement(_init, 1, "getFocusedGroupId", _getFocusedGroupId_dec, Editor)
7487
7549
  __decorateElement(_init, 1, "getFocusedGroup", _getFocusedGroup_dec, Editor);
7488
7550
  __decorateElement(_init, 1, "getEditingShapeId", _getEditingShapeId_dec, Editor);
7489
7551
  __decorateElement(_init, 1, "getEditingShape", _getEditingShape_dec, Editor);
7552
+ __decorateElement(_init, 1, "getRichTextEditor", _getRichTextEditor_dec, Editor);
7490
7553
  __decorateElement(_init, 1, "getHoveredShapeId", _getHoveredShapeId_dec, Editor);
7491
7554
  __decorateElement(_init, 1, "getHoveredShape", _getHoveredShape_dec, Editor);
7492
7555
  __decorateElement(_init, 1, "getHintingShapeIds", _getHintingShapeIds_dec, Editor);