@tldraw/editor 4.6.0-canary.ab4e1d4fd85b → 4.6.0-canary.acde31ad92ca

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 (325) hide show
  1. package/dist-cjs/index.d.ts +754 -161
  2. package/dist-cjs/index.js +16 -21
  3. package/dist-cjs/index.js.map +2 -2
  4. package/dist-cjs/lib/TldrawEditor.js +3 -0
  5. package/dist-cjs/lib/TldrawEditor.js.map +2 -2
  6. package/dist-cjs/lib/components/MenuClickCapture.js +99 -38
  7. package/dist-cjs/lib/components/MenuClickCapture.js.map +2 -2
  8. package/dist-cjs/lib/components/default-components/CanvasOverlays.js +180 -0
  9. package/dist-cjs/lib/components/default-components/CanvasOverlays.js.map +7 -0
  10. package/dist-cjs/lib/components/default-components/DefaultCanvas.js +33 -236
  11. package/dist-cjs/lib/components/default-components/DefaultCanvas.js.map +3 -3
  12. package/dist-cjs/lib/editor/Editor.js +157 -33
  13. package/dist-cjs/lib/editor/Editor.js.map +2 -2
  14. package/dist-cjs/lib/editor/assets/AssetUtil.js +1 -0
  15. package/dist-cjs/lib/editor/assets/AssetUtil.js.map +1 -1
  16. package/dist-cjs/lib/editor/bindings/BindingUtil.js +1 -0
  17. package/dist-cjs/lib/editor/bindings/BindingUtil.js.map +1 -1
  18. package/dist-cjs/lib/editor/managers/ClickManager/ClickManager.js +1 -0
  19. package/dist-cjs/lib/editor/managers/ClickManager/ClickManager.js.map +1 -1
  20. package/dist-cjs/lib/editor/managers/CollaboratorsManager/CollaboratorsManager.js +98 -0
  21. package/dist-cjs/lib/editor/managers/CollaboratorsManager/CollaboratorsManager.js.map +7 -0
  22. package/dist-cjs/lib/editor/managers/EdgeScrollManager/EdgeScrollManager.js +1 -0
  23. package/dist-cjs/lib/editor/managers/EdgeScrollManager/EdgeScrollManager.js.map +1 -1
  24. package/dist-cjs/lib/editor/managers/FocusManager/FocusManager.js +1 -0
  25. package/dist-cjs/lib/editor/managers/FocusManager/FocusManager.js.map +1 -1
  26. package/dist-cjs/lib/editor/managers/FontManager/FontManager.js +2 -0
  27. package/dist-cjs/lib/editor/managers/FontManager/FontManager.js.map +1 -1
  28. package/dist-cjs/lib/editor/managers/HistoryManager/HistoryManager.js +2 -0
  29. package/dist-cjs/lib/editor/managers/HistoryManager/HistoryManager.js.map +1 -1
  30. package/dist-cjs/lib/editor/managers/InputsManager/InputsManager.js +12 -0
  31. package/dist-cjs/lib/editor/managers/InputsManager/InputsManager.js.map +2 -2
  32. package/dist-cjs/lib/editor/managers/PerformanceManager/PerformanceApiAdapter.js +80 -0
  33. package/dist-cjs/lib/editor/managers/PerformanceManager/PerformanceApiAdapter.js.map +7 -0
  34. package/dist-cjs/lib/editor/managers/PerformanceManager/PerformanceManager.js +466 -0
  35. package/dist-cjs/lib/editor/managers/PerformanceManager/PerformanceManager.js.map +7 -0
  36. package/dist-cjs/lib/{components/default-components/DefaultHandles.js → editor/managers/PerformanceManager/perf-types.js} +3 -14
  37. package/dist-cjs/lib/editor/managers/PerformanceManager/perf-types.js.map +7 -0
  38. package/dist-cjs/lib/editor/managers/ScribbleManager/ScribbleManager.js +1 -0
  39. package/dist-cjs/lib/editor/managers/ScribbleManager/ScribbleManager.js.map +1 -1
  40. package/dist-cjs/lib/editor/managers/SnapManager/BoundsSnaps.js +1 -0
  41. package/dist-cjs/lib/editor/managers/SnapManager/BoundsSnaps.js.map +1 -1
  42. package/dist-cjs/lib/editor/managers/SnapManager/HandleSnaps.js +1 -0
  43. package/dist-cjs/lib/editor/managers/SnapManager/HandleSnaps.js.map +1 -1
  44. package/dist-cjs/lib/editor/managers/SnapManager/SnapManager.js +2 -1
  45. package/dist-cjs/lib/editor/managers/SnapManager/SnapManager.js.map +2 -2
  46. package/dist-cjs/lib/editor/managers/SpatialIndexManager/SpatialIndexManager.js +1 -0
  47. package/dist-cjs/lib/editor/managers/SpatialIndexManager/SpatialIndexManager.js.map +1 -1
  48. package/dist-cjs/lib/editor/managers/TextManager/TextManager.js +1 -0
  49. package/dist-cjs/lib/editor/managers/TextManager/TextManager.js.map +1 -1
  50. package/dist-cjs/lib/editor/managers/ThemeManager/ThemeManager.js +1 -0
  51. package/dist-cjs/lib/editor/managers/ThemeManager/ThemeManager.js.map +1 -1
  52. package/dist-cjs/lib/editor/managers/ThemeManager/defaultThemes.js +14 -0
  53. package/dist-cjs/lib/editor/managers/ThemeManager/defaultThemes.js.map +2 -2
  54. package/dist-cjs/lib/editor/managers/TickManager/TickManager.js +1 -0
  55. package/dist-cjs/lib/editor/managers/TickManager/TickManager.js.map +1 -1
  56. package/dist-cjs/lib/editor/managers/UserPreferencesManager/UserPreferencesManager.js +2 -0
  57. package/dist-cjs/lib/editor/managers/UserPreferencesManager/UserPreferencesManager.js.map +1 -1
  58. package/dist-cjs/lib/editor/overlays/OverlayManager.js +154 -0
  59. package/dist-cjs/lib/editor/overlays/OverlayManager.js.map +7 -0
  60. package/dist-cjs/lib/editor/overlays/OverlayUtil.js +92 -0
  61. package/dist-cjs/lib/editor/overlays/OverlayUtil.js.map +7 -0
  62. package/dist-cjs/lib/editor/overlays/ShapeIndicatorOverlayUtil.js +161 -0
  63. package/dist-cjs/lib/editor/overlays/ShapeIndicatorOverlayUtil.js.map +7 -0
  64. package/dist-cjs/lib/editor/shapes/BaseFrameLikeShapeUtil.js +76 -0
  65. package/dist-cjs/lib/editor/shapes/BaseFrameLikeShapeUtil.js.map +7 -0
  66. package/dist-cjs/lib/editor/shapes/ShapeUtil.js +20 -24
  67. package/dist-cjs/lib/editor/shapes/ShapeUtil.js.map +2 -2
  68. package/dist-cjs/lib/editor/shapes/group/GroupShapeUtil.js +33 -3
  69. package/dist-cjs/lib/editor/shapes/group/GroupShapeUtil.js.map +2 -2
  70. package/dist-cjs/lib/editor/shapes/shared/getPerfectDashProps.js +6 -0
  71. package/dist-cjs/lib/editor/shapes/shared/getPerfectDashProps.js.map +2 -2
  72. package/dist-cjs/lib/editor/tools/StateNode.js +15 -17
  73. package/dist-cjs/lib/editor/tools/StateNode.js.map +2 -2
  74. package/dist-cjs/lib/editor/types/event-types.js.map +2 -2
  75. package/dist-cjs/lib/exports/ExportDelay.js +1 -0
  76. package/dist-cjs/lib/exports/ExportDelay.js.map +1 -1
  77. package/dist-cjs/lib/exports/StyleEmbedder.js +1 -0
  78. package/dist-cjs/lib/exports/StyleEmbedder.js.map +1 -1
  79. package/dist-cjs/lib/exports/fetchCache.js +1 -1
  80. package/dist-cjs/lib/exports/fetchCache.js.map +2 -2
  81. package/dist-cjs/lib/exports/getSvgJsx.js +2 -1
  82. package/dist-cjs/lib/exports/getSvgJsx.js.map +2 -2
  83. package/dist-cjs/lib/hooks/EditorComponentsContext.js.map +2 -2
  84. package/dist-cjs/lib/hooks/useCanvasEvents.js +25 -4
  85. package/dist-cjs/lib/hooks/useCanvasEvents.js.map +2 -2
  86. package/dist-cjs/lib/hooks/useEditorComponents.js +0 -28
  87. package/dist-cjs/lib/hooks/useEditorComponents.js.map +2 -2
  88. package/dist-cjs/lib/hooks/usePeerIds.js +1 -36
  89. package/dist-cjs/lib/hooks/usePeerIds.js.map +2 -2
  90. package/dist-cjs/lib/hooks/useShapeCulling.js +2 -1
  91. package/dist-cjs/lib/hooks/useShapeCulling.js.map +2 -2
  92. package/dist-cjs/lib/options.js +1 -0
  93. package/dist-cjs/lib/options.js.map +2 -2
  94. package/dist-cjs/lib/primitives/Vec.js +3 -0
  95. package/dist-cjs/lib/primitives/Vec.js.map +1 -1
  96. package/dist-cjs/lib/primitives/geometry/Circle2d.js +1 -0
  97. package/dist-cjs/lib/primitives/geometry/Circle2d.js.map +1 -1
  98. package/dist-cjs/lib/primitives/geometry/Ellipse2d.js +1 -0
  99. package/dist-cjs/lib/primitives/geometry/Ellipse2d.js.map +1 -1
  100. package/dist-cjs/lib/primitives/geometry/Geometry2d.js +2 -0
  101. package/dist-cjs/lib/primitives/geometry/Geometry2d.js.map +1 -1
  102. package/dist-cjs/lib/primitives/geometry/Stadium2d.js +1 -0
  103. package/dist-cjs/lib/primitives/geometry/Stadium2d.js.map +1 -1
  104. package/dist-cjs/lib/utils/EditorAtom.js +2 -0
  105. package/dist-cjs/lib/utils/EditorAtom.js.map +1 -1
  106. package/dist-cjs/lib/utils/runtime.js +2 -1
  107. package/dist-cjs/lib/utils/runtime.js.map +2 -2
  108. package/dist-cjs/lib/utils/sync/TLLocalSyncClient.js +5 -0
  109. package/dist-cjs/lib/utils/sync/TLLocalSyncClient.js.map +2 -2
  110. package/dist-cjs/lib/utils/sync/hardReset.js +0 -8
  111. package/dist-cjs/lib/utils/sync/hardReset.js.map +2 -2
  112. package/dist-cjs/version.js +3 -3
  113. package/dist-cjs/version.js.map +1 -1
  114. package/dist-esm/index.d.mts +754 -161
  115. package/dist-esm/index.mjs +21 -39
  116. package/dist-esm/index.mjs.map +2 -2
  117. package/dist-esm/lib/TldrawEditor.mjs +3 -0
  118. package/dist-esm/lib/TldrawEditor.mjs.map +2 -2
  119. package/dist-esm/lib/components/MenuClickCapture.mjs +100 -39
  120. package/dist-esm/lib/components/MenuClickCapture.mjs.map +2 -2
  121. package/dist-esm/lib/components/default-components/CanvasOverlays.mjs +160 -0
  122. package/dist-esm/lib/components/default-components/CanvasOverlays.mjs.map +7 -0
  123. package/dist-esm/lib/components/default-components/DefaultCanvas.mjs +34 -237
  124. package/dist-esm/lib/components/default-components/DefaultCanvas.mjs.map +3 -3
  125. package/dist-esm/lib/editor/Editor.mjs +158 -35
  126. package/dist-esm/lib/editor/Editor.mjs.map +2 -2
  127. package/dist-esm/lib/editor/assets/AssetUtil.mjs +1 -0
  128. package/dist-esm/lib/editor/assets/AssetUtil.mjs.map +1 -1
  129. package/dist-esm/lib/editor/bindings/BindingUtil.mjs +1 -0
  130. package/dist-esm/lib/editor/bindings/BindingUtil.mjs.map +1 -1
  131. package/dist-esm/lib/editor/managers/ClickManager/ClickManager.mjs +1 -0
  132. package/dist-esm/lib/editor/managers/ClickManager/ClickManager.mjs.map +1 -1
  133. package/dist-esm/lib/editor/managers/CollaboratorsManager/CollaboratorsManager.mjs +83 -0
  134. package/dist-esm/lib/editor/managers/CollaboratorsManager/CollaboratorsManager.mjs.map +7 -0
  135. package/dist-esm/lib/editor/managers/EdgeScrollManager/EdgeScrollManager.mjs +1 -0
  136. package/dist-esm/lib/editor/managers/EdgeScrollManager/EdgeScrollManager.mjs.map +1 -1
  137. package/dist-esm/lib/editor/managers/FocusManager/FocusManager.mjs +1 -0
  138. package/dist-esm/lib/editor/managers/FocusManager/FocusManager.mjs.map +1 -1
  139. package/dist-esm/lib/editor/managers/FontManager/FontManager.mjs +2 -0
  140. package/dist-esm/lib/editor/managers/FontManager/FontManager.mjs.map +1 -1
  141. package/dist-esm/lib/editor/managers/HistoryManager/HistoryManager.mjs +2 -0
  142. package/dist-esm/lib/editor/managers/HistoryManager/HistoryManager.mjs.map +1 -1
  143. package/dist-esm/lib/editor/managers/InputsManager/InputsManager.mjs +12 -0
  144. package/dist-esm/lib/editor/managers/InputsManager/InputsManager.mjs.map +2 -2
  145. package/dist-esm/lib/editor/managers/PerformanceManager/PerformanceApiAdapter.mjs +60 -0
  146. package/dist-esm/lib/editor/managers/PerformanceManager/PerformanceApiAdapter.mjs.map +7 -0
  147. package/dist-esm/lib/editor/managers/PerformanceManager/PerformanceManager.mjs +438 -0
  148. package/dist-esm/lib/editor/managers/PerformanceManager/PerformanceManager.mjs.map +7 -0
  149. package/dist-esm/lib/editor/managers/PerformanceManager/perf-types.mjs +1 -0
  150. package/dist-esm/lib/editor/managers/PerformanceManager/perf-types.mjs.map +7 -0
  151. package/dist-esm/lib/editor/managers/ScribbleManager/ScribbleManager.mjs +1 -0
  152. package/dist-esm/lib/editor/managers/ScribbleManager/ScribbleManager.mjs.map +1 -1
  153. package/dist-esm/lib/editor/managers/SnapManager/BoundsSnaps.mjs +1 -0
  154. package/dist-esm/lib/editor/managers/SnapManager/BoundsSnaps.mjs.map +1 -1
  155. package/dist-esm/lib/editor/managers/SnapManager/HandleSnaps.mjs +1 -0
  156. package/dist-esm/lib/editor/managers/SnapManager/HandleSnaps.mjs.map +1 -1
  157. package/dist-esm/lib/editor/managers/SnapManager/SnapManager.mjs +2 -1
  158. package/dist-esm/lib/editor/managers/SnapManager/SnapManager.mjs.map +2 -2
  159. package/dist-esm/lib/editor/managers/SpatialIndexManager/SpatialIndexManager.mjs +1 -0
  160. package/dist-esm/lib/editor/managers/SpatialIndexManager/SpatialIndexManager.mjs.map +1 -1
  161. package/dist-esm/lib/editor/managers/TextManager/TextManager.mjs +1 -0
  162. package/dist-esm/lib/editor/managers/TextManager/TextManager.mjs.map +1 -1
  163. package/dist-esm/lib/editor/managers/ThemeManager/ThemeManager.mjs +1 -0
  164. package/dist-esm/lib/editor/managers/ThemeManager/ThemeManager.mjs.map +1 -1
  165. package/dist-esm/lib/editor/managers/ThemeManager/defaultThemes.mjs +14 -0
  166. package/dist-esm/lib/editor/managers/ThemeManager/defaultThemes.mjs.map +2 -2
  167. package/dist-esm/lib/editor/managers/TickManager/TickManager.mjs +1 -0
  168. package/dist-esm/lib/editor/managers/TickManager/TickManager.mjs.map +1 -1
  169. package/dist-esm/lib/editor/managers/UserPreferencesManager/UserPreferencesManager.mjs +2 -0
  170. package/dist-esm/lib/editor/managers/UserPreferencesManager/UserPreferencesManager.mjs.map +1 -1
  171. package/dist-esm/lib/editor/overlays/OverlayManager.mjs +136 -0
  172. package/dist-esm/lib/editor/overlays/OverlayManager.mjs.map +7 -0
  173. package/dist-esm/lib/editor/overlays/OverlayUtil.mjs +72 -0
  174. package/dist-esm/lib/editor/overlays/OverlayUtil.mjs.map +7 -0
  175. package/dist-esm/lib/editor/overlays/ShapeIndicatorOverlayUtil.mjs +141 -0
  176. package/dist-esm/lib/editor/overlays/ShapeIndicatorOverlayUtil.mjs.map +7 -0
  177. package/dist-esm/lib/editor/shapes/BaseFrameLikeShapeUtil.mjs +56 -0
  178. package/dist-esm/lib/editor/shapes/BaseFrameLikeShapeUtil.mjs.map +7 -0
  179. package/dist-esm/lib/editor/shapes/ShapeUtil.mjs +20 -24
  180. package/dist-esm/lib/editor/shapes/ShapeUtil.mjs.map +2 -2
  181. package/dist-esm/lib/editor/shapes/group/GroupShapeUtil.mjs +33 -3
  182. package/dist-esm/lib/editor/shapes/group/GroupShapeUtil.mjs.map +2 -2
  183. package/dist-esm/lib/editor/shapes/shared/getPerfectDashProps.mjs +6 -0
  184. package/dist-esm/lib/editor/shapes/shared/getPerfectDashProps.mjs.map +2 -2
  185. package/dist-esm/lib/editor/tools/StateNode.mjs +15 -17
  186. package/dist-esm/lib/editor/tools/StateNode.mjs.map +2 -2
  187. package/dist-esm/lib/editor/types/event-types.mjs.map +2 -2
  188. package/dist-esm/lib/exports/ExportDelay.mjs +1 -0
  189. package/dist-esm/lib/exports/ExportDelay.mjs.map +1 -1
  190. package/dist-esm/lib/exports/StyleEmbedder.mjs +1 -0
  191. package/dist-esm/lib/exports/StyleEmbedder.mjs.map +1 -1
  192. package/dist-esm/lib/exports/fetchCache.mjs +2 -2
  193. package/dist-esm/lib/exports/fetchCache.mjs.map +2 -2
  194. package/dist-esm/lib/exports/getSvgJsx.mjs +2 -1
  195. package/dist-esm/lib/exports/getSvgJsx.mjs.map +2 -2
  196. package/dist-esm/lib/hooks/EditorComponentsContext.mjs.map +2 -2
  197. package/dist-esm/lib/hooks/useCanvasEvents.mjs +25 -4
  198. package/dist-esm/lib/hooks/useCanvasEvents.mjs.map +2 -2
  199. package/dist-esm/lib/hooks/useEditorComponents.mjs +0 -28
  200. package/dist-esm/lib/hooks/useEditorComponents.mjs.map +2 -2
  201. package/dist-esm/lib/hooks/usePeerIds.mjs +2 -40
  202. package/dist-esm/lib/hooks/usePeerIds.mjs.map +2 -2
  203. package/dist-esm/lib/hooks/useShapeCulling.mjs +2 -1
  204. package/dist-esm/lib/hooks/useShapeCulling.mjs.map +2 -2
  205. package/dist-esm/lib/options.mjs +1 -0
  206. package/dist-esm/lib/options.mjs.map +2 -2
  207. package/dist-esm/lib/primitives/Vec.mjs +3 -0
  208. package/dist-esm/lib/primitives/Vec.mjs.map +1 -1
  209. package/dist-esm/lib/primitives/geometry/Circle2d.mjs +1 -0
  210. package/dist-esm/lib/primitives/geometry/Circle2d.mjs.map +1 -1
  211. package/dist-esm/lib/primitives/geometry/Ellipse2d.mjs +1 -0
  212. package/dist-esm/lib/primitives/geometry/Ellipse2d.mjs.map +1 -1
  213. package/dist-esm/lib/primitives/geometry/Geometry2d.mjs +2 -0
  214. package/dist-esm/lib/primitives/geometry/Geometry2d.mjs.map +1 -1
  215. package/dist-esm/lib/primitives/geometry/Stadium2d.mjs +1 -0
  216. package/dist-esm/lib/primitives/geometry/Stadium2d.mjs.map +1 -1
  217. package/dist-esm/lib/utils/EditorAtom.mjs +2 -0
  218. package/dist-esm/lib/utils/EditorAtom.mjs.map +1 -1
  219. package/dist-esm/lib/utils/runtime.mjs +2 -1
  220. package/dist-esm/lib/utils/runtime.mjs.map +2 -2
  221. package/dist-esm/lib/utils/sync/TLLocalSyncClient.mjs +5 -0
  222. package/dist-esm/lib/utils/sync/TLLocalSyncClient.mjs.map +2 -2
  223. package/dist-esm/lib/utils/sync/hardReset.mjs +0 -8
  224. package/dist-esm/lib/utils/sync/hardReset.mjs.map +2 -2
  225. package/dist-esm/version.mjs +3 -3
  226. package/dist-esm/version.mjs.map +1 -1
  227. package/editor.css +3 -223
  228. package/package.json +7 -7
  229. package/src/index.ts +29 -38
  230. package/src/lib/TldrawEditor.tsx +9 -0
  231. package/src/lib/components/MenuClickCapture.tsx +129 -49
  232. package/src/lib/components/default-components/CanvasOverlays.tsx +208 -0
  233. package/src/lib/components/default-components/DefaultCanvas.tsx +38 -310
  234. package/src/lib/editor/Editor.test.ts +3 -1
  235. package/src/lib/editor/Editor.ts +183 -38
  236. package/src/lib/editor/managers/CollaboratorsManager/CollaboratorsManager.ts +98 -0
  237. package/src/lib/editor/managers/InputsManager/InputsManager.ts +12 -0
  238. package/src/lib/editor/managers/PerformanceManager/PerformanceApiAdapter.ts +82 -0
  239. package/src/lib/editor/managers/PerformanceManager/PerformanceManager.test.ts +522 -0
  240. package/src/lib/editor/managers/PerformanceManager/PerformanceManager.ts +583 -0
  241. package/src/lib/editor/managers/PerformanceManager/perf-types.ts +196 -0
  242. package/src/lib/editor/managers/SnapManager/SnapManager.test.ts +13 -2
  243. package/src/lib/editor/managers/SnapManager/SnapManager.ts +1 -1
  244. package/src/lib/editor/managers/ThemeManager/defaultThemes.ts +14 -0
  245. package/src/lib/editor/overlays/OverlayManager.ts +183 -0
  246. package/src/lib/editor/overlays/OverlayUtil.ts +143 -0
  247. package/src/lib/editor/overlays/ShapeIndicatorOverlayUtil.ts +216 -0
  248. package/src/lib/editor/shapes/BaseFrameLikeShapeUtil.tsx +123 -0
  249. package/src/lib/editor/shapes/ShapeUtil.ts +28 -27
  250. package/src/lib/editor/shapes/group/GroupShapeUtil.tsx +41 -4
  251. package/src/lib/editor/shapes/shared/getPerfectDashProps.ts +7 -0
  252. package/src/lib/editor/tools/StateNode.ts +16 -18
  253. package/src/lib/editor/types/event-types.ts +2 -0
  254. package/src/lib/exports/fetchCache.ts +2 -4
  255. package/src/lib/exports/getSvgJsx.test.ts +3 -1
  256. package/src/lib/exports/getSvgJsx.tsx +2 -1
  257. package/src/lib/hooks/EditorComponentsContext.tsx +0 -27
  258. package/src/lib/hooks/useCanvasEvents.ts +40 -3
  259. package/src/lib/hooks/useEditorComponents.tsx +0 -28
  260. package/src/lib/hooks/usePeerIds.ts +6 -55
  261. package/src/lib/hooks/useShapeCulling.tsx +3 -1
  262. package/src/lib/options.ts +7 -0
  263. package/src/lib/utils/runtime.ts +3 -1
  264. package/src/lib/utils/sync/TLLocalSyncClient.ts +3 -0
  265. package/src/lib/utils/sync/hardReset.ts +0 -8
  266. package/src/version.ts +3 -3
  267. package/dist-cjs/lib/components/LiveCollaborators.js +0 -151
  268. package/dist-cjs/lib/components/LiveCollaborators.js.map +0 -7
  269. package/dist-cjs/lib/components/default-components/CanvasShapeIndicators.js +0 -227
  270. package/dist-cjs/lib/components/default-components/CanvasShapeIndicators.js.map +0 -7
  271. package/dist-cjs/lib/components/default-components/DefaultBrush.js +0 -38
  272. package/dist-cjs/lib/components/default-components/DefaultBrush.js.map +0 -7
  273. package/dist-cjs/lib/components/default-components/DefaultCollaboratorHint.js +0 -71
  274. package/dist-cjs/lib/components/default-components/DefaultCollaboratorHint.js.map +0 -7
  275. package/dist-cjs/lib/components/default-components/DefaultHandle.js +0 -56
  276. package/dist-cjs/lib/components/default-components/DefaultHandle.js.map +0 -7
  277. package/dist-cjs/lib/components/default-components/DefaultHandles.js.map +0 -7
  278. package/dist-cjs/lib/components/default-components/DefaultScribble.js +0 -51
  279. package/dist-cjs/lib/components/default-components/DefaultScribble.js.map +0 -7
  280. package/dist-cjs/lib/components/default-components/DefaultSelectionForeground.js +0 -69
  281. package/dist-cjs/lib/components/default-components/DefaultSelectionForeground.js.map +0 -7
  282. package/dist-cjs/lib/components/default-components/DefaultShapeIndicator.js +0 -107
  283. package/dist-cjs/lib/components/default-components/DefaultShapeIndicator.js.map +0 -7
  284. package/dist-cjs/lib/components/default-components/DefaultShapeIndicatorErrorFallback.js +0 -28
  285. package/dist-cjs/lib/components/default-components/DefaultShapeIndicatorErrorFallback.js.map +0 -7
  286. package/dist-cjs/lib/components/default-components/DefaultShapeIndicators.js +0 -101
  287. package/dist-cjs/lib/components/default-components/DefaultShapeIndicators.js.map +0 -7
  288. package/dist-cjs/lib/components/default-components/DefaultSnapIndictor.js +0 -170
  289. package/dist-cjs/lib/components/default-components/DefaultSnapIndictor.js.map +0 -7
  290. package/dist-esm/lib/components/LiveCollaborators.mjs +0 -134
  291. package/dist-esm/lib/components/LiveCollaborators.mjs.map +0 -7
  292. package/dist-esm/lib/components/default-components/CanvasShapeIndicators.mjs +0 -207
  293. package/dist-esm/lib/components/default-components/CanvasShapeIndicators.mjs.map +0 -7
  294. package/dist-esm/lib/components/default-components/DefaultBrush.mjs +0 -18
  295. package/dist-esm/lib/components/default-components/DefaultBrush.mjs.map +0 -7
  296. package/dist-esm/lib/components/default-components/DefaultCollaboratorHint.mjs +0 -41
  297. package/dist-esm/lib/components/default-components/DefaultCollaboratorHint.mjs.map +0 -7
  298. package/dist-esm/lib/components/default-components/DefaultHandle.mjs +0 -26
  299. package/dist-esm/lib/components/default-components/DefaultHandle.mjs.map +0 -7
  300. package/dist-esm/lib/components/default-components/DefaultHandles.mjs +0 -8
  301. package/dist-esm/lib/components/default-components/DefaultHandles.mjs.map +0 -7
  302. package/dist-esm/lib/components/default-components/DefaultScribble.mjs +0 -21
  303. package/dist-esm/lib/components/default-components/DefaultScribble.mjs.map +0 -7
  304. package/dist-esm/lib/components/default-components/DefaultSelectionForeground.mjs +0 -39
  305. package/dist-esm/lib/components/default-components/DefaultSelectionForeground.mjs.map +0 -7
  306. package/dist-esm/lib/components/default-components/DefaultShapeIndicator.mjs +0 -77
  307. package/dist-esm/lib/components/default-components/DefaultShapeIndicator.mjs.map +0 -7
  308. package/dist-esm/lib/components/default-components/DefaultShapeIndicatorErrorFallback.mjs +0 -8
  309. package/dist-esm/lib/components/default-components/DefaultShapeIndicatorErrorFallback.mjs.map +0 -7
  310. package/dist-esm/lib/components/default-components/DefaultShapeIndicators.mjs +0 -81
  311. package/dist-esm/lib/components/default-components/DefaultShapeIndicators.mjs.map +0 -7
  312. package/dist-esm/lib/components/default-components/DefaultSnapIndictor.mjs +0 -142
  313. package/dist-esm/lib/components/default-components/DefaultSnapIndictor.mjs.map +0 -7
  314. package/src/lib/components/LiveCollaborators.tsx +0 -174
  315. package/src/lib/components/default-components/CanvasShapeIndicators.tsx +0 -289
  316. package/src/lib/components/default-components/DefaultBrush.tsx +0 -35
  317. package/src/lib/components/default-components/DefaultCollaboratorHint.tsx +0 -52
  318. package/src/lib/components/default-components/DefaultHandle.tsx +0 -42
  319. package/src/lib/components/default-components/DefaultHandles.tsx +0 -15
  320. package/src/lib/components/default-components/DefaultScribble.tsx +0 -31
  321. package/src/lib/components/default-components/DefaultSelectionForeground.tsx +0 -50
  322. package/src/lib/components/default-components/DefaultShapeIndicator.tsx +0 -104
  323. package/src/lib/components/default-components/DefaultShapeIndicatorErrorFallback.tsx +0 -9
  324. package/src/lib/components/default-components/DefaultShapeIndicators.tsx +0 -116
  325. package/src/lib/components/default-components/DefaultSnapIndictor.tsx +0 -174
@@ -19,7 +19,6 @@ import { JsonObject } from '@tldraw/utils';
19
19
  import { JSX } from 'react/jsx-runtime';
20
20
  import { LegacyMigrations } from '@tldraw/store';
21
21
  import { MigrationSequence } from '@tldraw/store';
22
- import { NamedExoticComponent } from 'react';
23
22
  import { Node as Node_2 } from '@tiptap/pm/model';
24
23
  import { PerformanceTracker } from '@tldraw/utils';
25
24
  import { PointerEvent as PointerEvent_2 } from 'react';
@@ -220,6 +219,56 @@ export declare abstract class BaseBoxShapeUtil<Shape extends TLBaseBoxShape> ext
220
219
  getInterpolatedProps(startShape: Shape, endShape: Shape, t: number): Shape['props'];
221
220
  }
222
221
 
222
+ /**
223
+ * A base class for frame-like shapes — containers that clip their children,
224
+ * require full-brush selection, block erasure from inside, and support
225
+ * drag-and-drop reparenting.
226
+ *
227
+ * Extending this class is the easiest way to create a custom frame-like shape.
228
+ * It provides sensible defaults for all frame-like behaviors:
229
+ *
230
+ * - `isFrameLike()` returns `true`
231
+ * - `providesBackgroundForChildren()` returns `true`
232
+ * - `canReceiveNewChildrenOfType()` returns `true` unless the container is locked
233
+ * - `getClipPath()` returns the shape geometry's vertices
234
+ * - `onDragShapesIn()` reparents shapes into the frame (with index restoration)
235
+ * - `onDragShapesOut()` reparents shapes back to the page
236
+ *
237
+ * All methods can be overridden for custom behavior.
238
+ *
239
+ * @example
240
+ * ```ts
241
+ * class MyContainerUtil extends BaseFrameLikeShapeUtil<MyContainerShape> {
242
+ * static override type = 'my-container' as const
243
+ * static override props = myContainerShapeProps
244
+ *
245
+ * override getDefaultProps() {
246
+ * return { w: 300, h: 200 }
247
+ * }
248
+ *
249
+ * override component(shape: MyContainerShape) {
250
+ * return <SVGContainer>...</SVGContainer>
251
+ * }
252
+ *
253
+ * override getIndicatorPath(shape: MyContainerShape) {
254
+ * const path = new Path2D()
255
+ * path.rect(0, 0, shape.props.w, shape.props.h)
256
+ * return path
257
+ * }
258
+ * }
259
+ * ```
260
+ *
261
+ * @public
262
+ */
263
+ export declare abstract class BaseFrameLikeShapeUtil<Shape extends TLBaseBoxShape> extends BaseBoxShapeUtil<Shape> {
264
+ isFrameLike(_shape: Shape): boolean;
265
+ providesBackgroundForChildren(): boolean;
266
+ canReceiveNewChildrenOfType(shape: Shape, _type: TLShape['type']): boolean;
267
+ getClipPath(shape: Shape): undefined | Vec[];
268
+ onDragShapesIn(shape: Shape, draggingShapes: TLShape[], { initialParentIds, initialIndices }: TLDragShapesInInfo): void;
269
+ onDragShapesOut(shape: Shape, draggingShapes: TLShape[], info: TLDragShapesOutInfo): void;
270
+ }
271
+
223
272
  /** @public */
224
273
  export declare interface BatchMeasurementRequest {
225
274
  html: string;
@@ -719,6 +768,49 @@ export declare class ClickManager {
719
768
  */
720
769
  export declare function clockwiseAngleDist(a0: number, a1: number): number;
721
770
 
771
+ /**
772
+ * Tracks remote peers and exposes the collaborator-related queries used by the
773
+ * editor and its overlays. Encapsulates the visibility clock that periodically
774
+ * re-evaluates which collaborators should be visible based on activity.
775
+ *
776
+ * Accessed via {@link Editor.collaborators}.
777
+ *
778
+ * @public
779
+ */
780
+ export declare class CollaboratorsManager {
781
+ private readonly editor;
782
+ constructor(editor: Editor);
783
+ /**
784
+ * Drives reactive re-evaluation of {@link CollaboratorsManager.getVisibleCollaborators}.
785
+ * Ticked on a fixed interval so callers don't need to manage their own activity timers.
786
+ */
787
+ private readonly _visibilityClock;
788
+ private _getCollaboratorsQuery;
789
+ /**
790
+ * Returns a list of presence records for all peer collaborators.
791
+ * This will return the latest presence record for each connected user.
792
+ */
793
+ getCollaborators(): TLInstancePresence[];
794
+ /**
795
+ * Returns a list of presence records for all peer collaborators on the current page.
796
+ * This will return the latest presence record for each connected user.
797
+ */
798
+ getCollaboratorsOnCurrentPage(): TLInstancePresence[];
799
+ /**
800
+ * Returns a list of presence records for peer collaborators who should currently be
801
+ * shown in the UI. Filters {@link CollaboratorsManager.getCollaborators} by activity
802
+ * state (active / idle / inactive) and visibility rules such as following and
803
+ * highlighted users. Re-evaluates on the visibility clock, so callers don't need to
804
+ * drive their own activity timer.
805
+ */
806
+ getVisibleCollaborators(): TLInstancePresence[];
807
+ /**
808
+ * Returns a list of presence records for peer collaborators who should currently be
809
+ * shown in the UI, filtered to those on the current page.
810
+ */
811
+ getVisibleCollaboratorsOnCurrentPage(): TLInstancePresence[];
812
+ }
813
+
722
814
  /**
723
815
  * @public
724
816
  * @react
@@ -881,51 +973,21 @@ export declare const DEFAULT_THEME: TLTheme;
881
973
  /** @public @react */
882
974
  export declare function DefaultBackground(): JSX.Element;
883
975
 
884
- /** @public @react */
885
- export declare const DefaultBrush: ({ brush, color, opacity, className }: TLBrushProps) => JSX.Element;
886
-
887
976
  /** @public @react */
888
977
  export declare function DefaultCanvas({ className }: TLCanvasComponentProps): JSX.Element;
889
978
 
890
- /** @public @react */
891
- export declare function DefaultCollaboratorHint({ className, zoom, point, color, viewport, opacity }: TLCollaboratorHintProps): JSX.Element;
892
-
893
- /** @public @react */
894
- export declare const DefaultCursor: NamedExoticComponent<TLCursorProps>;
895
-
896
979
  /** @public @react */
897
980
  export declare const DefaultErrorFallback: TLErrorFallbackComponent;
898
981
 
899
982
  /** @public @react */
900
983
  export declare function DefaultGrid({ x, y, z, size }: TLGridProps): JSX.Element;
901
984
 
902
- /** @public @react */
903
- export declare function DefaultHandle({ handle, isCoarse, className, zoom }: TLHandleProps): JSX.Element;
904
-
905
- /** @public @react */
906
- export declare const DefaultHandles: ({ children }: TLHandlesProps) => JSX.Element;
907
-
908
- /** @public @react */
909
- export declare function DefaultScribble({ scribble, zoom, color, opacity, className }: TLScribbleProps): JSX.Element | null;
910
-
911
985
  /** @public @react */
912
986
  export declare function DefaultSelectionBackground({ bounds, rotation }: TLSelectionBackgroundProps): JSX.Element;
913
987
 
914
- /** @public @react */
915
- export declare function DefaultSelectionForeground({ bounds, rotation }: TLSelectionForegroundProps): JSX.Element;
916
-
917
- /** @public @react */
918
- export declare const DefaultShapeIndicator: NamedExoticComponent<TLShapeIndicatorProps>;
919
-
920
- /** @public @react */
921
- export declare const DefaultShapeIndicators: NamedExoticComponent<TLShapeIndicatorsProps>;
922
-
923
988
  /** @public @react */
924
989
  export declare const DefaultShapeWrapper: ForwardRefExoticComponent<TLShapeWrapperProps & RefAttributes<HTMLDivElement>>;
925
990
 
926
- /** @public @react */
927
- export declare function DefaultSnapIndicator({ className, line, zoom }: TLSnapIndicatorProps): JSX.Element;
928
-
929
991
  /** @public @react */
930
992
  export declare function DefaultSpinner(props: React.SVGProps<SVGSVGElement>): JSX.Element;
931
993
 
@@ -996,6 +1058,7 @@ export declare const defaultTldrawOptions: {
996
1058
  readonly onBeforePasteFromClipboard: undefined;
997
1059
  readonly onClipboardPasteRaw: undefined;
998
1060
  readonly quickZoomPreservesScreenBounds: true;
1061
+ readonly rightClickPanning: true;
999
1062
  readonly snapThreshold: 8;
1000
1063
  readonly spacebarPanning: true;
1001
1064
  readonly temporaryAssetPreviewLifetimeMs: 180000;
@@ -1103,7 +1166,7 @@ export declare class EdgeScrollManager {
1103
1166
  /** @public */
1104
1167
  export declare class Editor extends EventEmitter<TLEventMap> {
1105
1168
  readonly id: string;
1106
- constructor({ store, user, shapeUtils, bindingUtils, assetUtils: assetUtilConstructors, tools, getContainer, cameraOptions, initialState, autoFocus, options: _options, textOptions: _textOptions, getShapeVisibility, colorScheme, fontAssetUrls, themes, initialTheme }: TLEditorOptions);
1169
+ constructor({ store, user, shapeUtils, bindingUtils, assetUtils: assetUtilConstructors, overlayUtils: overlayUtilConstructors, tools, getContainer, cameraOptions, initialState, autoFocus, options: _options, textOptions: _textOptions, getShapeVisibility, colorScheme, fontAssetUrls, themes, initialTheme }: TLEditorOptions);
1107
1170
  private readonly _getShapeVisibility?;
1108
1171
  private getIsShapeHiddenCache;
1109
1172
  isShapeHidden(shapeOrId: TLShape | TLShapeId): boolean;
@@ -1166,6 +1229,12 @@ export declare class Editor extends EventEmitter<TLEventMap> {
1166
1229
  * @public
1167
1230
  */
1168
1231
  readonly snaps: SnapManager;
1232
+ /**
1233
+ * A manager for performance measurement hooks.
1234
+ *
1235
+ * @public
1236
+ */
1237
+ readonly performance: PerformanceManager;
1169
1238
  /* Excluded from this release type: _spatialIndex */
1170
1239
  /**
1171
1240
  * A manager for the any asynchronous events and making sure they're
@@ -1179,6 +1248,12 @@ export declare class Editor extends EventEmitter<TLEventMap> {
1179
1248
  setInterval: (handler: TimerHandler, timeout?: number | undefined, ...args: any[]) => number;
1180
1249
  setTimeout: (handler: TimerHandler, timeout?: number | undefined, ...args: any[]) => number;
1181
1250
  };
1251
+ /**
1252
+ * A manager for remote peer collaborators connected to this editor.
1253
+ *
1254
+ * @public
1255
+ */
1256
+ readonly collaborators: CollaboratorsManager;
1182
1257
  /**
1183
1258
  * A manager for the user and their preferences.
1184
1259
  *
@@ -1204,6 +1279,12 @@ export declare class Editor extends EventEmitter<TLEventMap> {
1204
1279
  * @public
1205
1280
  */
1206
1281
  readonly scribbles: ScribbleManager;
1282
+ /**
1283
+ * A manager for canvas overlay UI elements (selection handles, shape handles, etc.).
1284
+ *
1285
+ * @public
1286
+ */
1287
+ readonly overlays: OverlayManager;
1207
1288
  /**
1208
1289
  * A manager for side effects and correct state enforcement. See {@link @tldraw/store#StoreSideEffects} for details.
1209
1290
  *
@@ -1682,6 +1763,11 @@ export declare class Editor extends EventEmitter<TLEventMap> {
1682
1763
  /**
1683
1764
  * Set the cursor.
1684
1765
  *
1766
+ * No-op when the partial wouldn't change the current cursor — `setCursor`
1767
+ * is called from pointer-move hot paths (see `updateHoveredOverlayId`,
1768
+ * various tool states) and skipping redundant writes avoids needlessly
1769
+ * dirtying instance state.
1770
+ *
1685
1771
  * @param cursor - The cursor to set.
1686
1772
  * @public
1687
1773
  */
@@ -2441,11 +2527,12 @@ export declare class Editor extends EventEmitter<TLEventMap> {
2441
2527
  * @public
2442
2528
  */
2443
2529
  pageToViewport(point: VecLike): Vec;
2444
- private _getCollaboratorsQuery;
2445
2530
  /**
2446
2531
  * Returns a list of presence records for all peer collaborators.
2447
2532
  * This will return the latest presence record for each connected user.
2448
2533
  *
2534
+ * Convenience wrapper for {@link CollaboratorsManager.getCollaborators}.
2535
+ *
2449
2536
  * @public
2450
2537
  */
2451
2538
  getCollaborators(): TLInstancePresence[];
@@ -2453,9 +2540,32 @@ export declare class Editor extends EventEmitter<TLEventMap> {
2453
2540
  * Returns a list of presence records for all peer collaborators on the current page.
2454
2541
  * This will return the latest presence record for each connected user.
2455
2542
  *
2543
+ * Convenience wrapper for {@link CollaboratorsManager.getCollaboratorsOnCurrentPage}.
2544
+ *
2456
2545
  * @public
2457
2546
  */
2458
2547
  getCollaboratorsOnCurrentPage(): TLInstancePresence[];
2548
+ /**
2549
+ * Returns a list of presence records for peer collaborators who should currently be
2550
+ * shown in the UI. Filters {@link Editor.getCollaborators} by activity state
2551
+ * (active / idle / inactive) and visibility rules such as following and highlighted
2552
+ * users. Re-evaluates on the collaborator visibility clock, so callers don't need to
2553
+ * drive their own activity timer.
2554
+ *
2555
+ * Convenience wrapper for {@link CollaboratorsManager.getVisibleCollaborators}.
2556
+ *
2557
+ * @public
2558
+ */
2559
+ getVisibleCollaborators(): TLInstancePresence[];
2560
+ /**
2561
+ * Returns a list of presence records for peer collaborators who should currently be
2562
+ * shown in the UI, filtered to those on the current page.
2563
+ *
2564
+ * Convenience wrapper for {@link CollaboratorsManager.getVisibleCollaboratorsOnCurrentPage}.
2565
+ *
2566
+ * @public
2567
+ */
2568
+ getVisibleCollaboratorsOnCurrentPage(): TLInstancePresence[];
2459
2569
  /**
2460
2570
  * Get the current user's ID for attribution purposes.
2461
2571
  * Also ensures a `user:` record exists in the store for the current user.
@@ -3116,6 +3226,20 @@ export declare class Editor extends EventEmitter<TLEventMap> {
3116
3226
  type: T['type'];
3117
3227
  }>;
3118
3228
  isShapeOfType<T extends TLShape = TLShape>(shapeId: TLShapeId, type: T['type']): boolean;
3229
+ /**
3230
+ * Get whether a shape behaves like a frame — a container that has child
3231
+ * shapes, requires full-brush selection, blocks erasure from inside, etc.
3232
+ *
3233
+ * @example
3234
+ * ```ts
3235
+ * const isFrameLike = editor.isShapeFrameLike(someShape)
3236
+ * ```
3237
+ *
3238
+ * @param shape - The shape (or shape id) to test.
3239
+ *
3240
+ * @public
3241
+ */
3242
+ isShapeFrameLike(shape: TLShape | TLShapeId): boolean;
3119
3243
  /**
3120
3244
  * Get a shape by its id.
3121
3245
  *
@@ -4775,14 +4899,14 @@ export declare class GroupShapeUtil extends ShapeUtil<TLGroupShape> {
4775
4899
  static type: "group";
4776
4900
  static props: RecordProps<TLGroupShape>;
4777
4901
  static migrations: TLPropsMigrations;
4778
- hideSelectionBoundsFg(): boolean;
4902
+ hideSelectionBoundsFg(shape: TLGroupShape): boolean;
4779
4903
  canBind(): boolean;
4780
4904
  canResize(): boolean;
4781
4905
  canResizeChildren(): boolean;
4782
4906
  getDefaultProps(): TLGroupShape['props'];
4783
4907
  getGeometry(shape: TLGroupShape): Geometry2d;
4784
4908
  component(shape: TLGroupShape): JSX.Element | null;
4785
- indicator(shape: TLGroupShape): JSX.Element;
4909
+ getIndicatorPath(shape: TLGroupShape): Path2D;
4786
4910
  onChildrenChange(group: TLGroupShape): void;
4787
4911
  }
4788
4912
 
@@ -5061,6 +5185,12 @@ export declare class InputsManager {
5061
5185
  get isPointing(): boolean;
5062
5186
  set isPointing(isPointing: boolean);
5063
5187
  /* Excluded from this release type: setIsPointing */
5188
+ private _isRightPointing;
5189
+ /**
5190
+ * Whether the user is right-click pointing (before drag threshold).
5191
+ */
5192
+ getIsRightPointing(): boolean;
5193
+ /* Excluded from this release type: setIsRightPointing */
5064
5194
  private _isPinching;
5065
5195
  /**
5066
5196
  * Whether the user is pinching.
@@ -5404,6 +5534,179 @@ export declare function openWindow(url: string, target?: string, allowReferrer?:
5404
5534
  /** @public */
5405
5535
  export declare type OptionalKeys<T, K extends keyof T> = Omit<T, K> & Partial<Pick<T, K>>;
5406
5536
 
5537
+ /** @public */
5538
+ export declare class OverlayManager {
5539
+ readonly editor: Editor;
5540
+ constructor(editor: Editor);
5541
+ /* Excluded from this release type: _overlayUtils */
5542
+ /* Excluded from this release type: registerUtil */
5543
+ /**
5544
+ * Get an overlay util by type string, overlay instance, or by passing
5545
+ * a util class as a generic parameter for type-safe lookup.
5546
+ *
5547
+ * @example
5548
+ * ```ts
5549
+ * const util = editor.overlays.getOverlayUtil('brush')
5550
+ * const util = editor.overlays.getOverlayUtil<BrushOverlayUtil>('brush')
5551
+ * const util = editor.overlays.getOverlayUtil(myOverlay)
5552
+ * ```
5553
+ *
5554
+ * @public
5555
+ */
5556
+ getOverlayUtil<T extends OverlayUtil>(type: T extends OverlayUtil<infer O> ? O['type'] : string): T;
5557
+ getOverlayUtil<O extends TLOverlay>(overlay: O): OverlayUtil<O>;
5558
+ /**
5559
+ * Returns all registered overlay utils in paint order (ascending zIndex).
5560
+ * Utils with the same zIndex preserve their registration order.
5561
+ *
5562
+ * @public
5563
+ */
5564
+ getOverlayUtilsInZOrder(): OverlayUtil[];
5565
+ /**
5566
+ * Reactive list of active overlay utils paired with the overlays they
5567
+ * produced for the current editor state, in paint order (ascending
5568
+ * zIndex). Both the hit-test and render paths read from this single
5569
+ * cached scan instead of each re-deriving the active set. Active utils
5570
+ * are included even when their `getOverlays()` returns an empty array,
5571
+ * since `render()` may still draw non-interactive UI (e.g. the selection
5572
+ * bounding box during brushing).
5573
+ *
5574
+ * @public
5575
+ */
5576
+ getActiveOverlayEntries(): TLOverlayEntry[];
5577
+ /**
5578
+ * Reactively computed list of all currently active overlays, in paint order.
5579
+ * @public
5580
+ */
5581
+ getCurrentOverlays(): TLOverlay[];
5582
+ private _geometryCache;
5583
+ /**
5584
+ * Get hit-test geometry for an overlay, cached by overlay identity. Lets
5585
+ * hit-testing on a pointermove storm skip the per-overlay geometry
5586
+ * allocation that {@link OverlayUtil.getGeometry} would otherwise do on
5587
+ * every call.
5588
+ *
5589
+ * @public
5590
+ */
5591
+ getOverlayGeometry(overlay: TLOverlay): Geometry2d | null;
5592
+ /**
5593
+ * The currently hovered overlay id.
5594
+ * @public
5595
+ */
5596
+ private _hoveredOverlayId;
5597
+ getHoveredOverlayId(): null | string;
5598
+ getHoveredOverlay(): null | TLOverlay;
5599
+ setHoveredOverlay(id: null | string): void;
5600
+ /**
5601
+ * Hit test all active overlays at a given page point.
5602
+ * Returns the topmost overlay whose geometry contains the point, or null.
5603
+ * Utils are walked from highest zIndex to lowest so the overlay painted on
5604
+ * top also wins the hit test. Within a util, overlays are walked in
5605
+ * array order: the first overlay whose geometry contains the point wins,
5606
+ * so utils should place highest-priority overlays first in `getOverlays`.
5607
+ * Interactive overlays (those with geometry) are checked; non-interactive are skipped.
5608
+ *
5609
+ * @param point - Point in page coordinates
5610
+ * @param margin - Hit test margin
5611
+ * @public
5612
+ */
5613
+ getOverlayAtPoint(point: VecLike, margin?: number): null | TLOverlay;
5614
+ }
5615
+
5616
+ /**
5617
+ * Base class for overlay utilities. Overlays are ephemeral UI elements rendered
5618
+ * on top of the canvas (selection handles, rotation corners, shape handles, etc.).
5619
+ *
5620
+ * Each OverlayUtil defines a type of overlay and knows how to:
5621
+ * - Determine when its overlays should be active (predicate)
5622
+ * - Produce overlay instances from current editor state
5623
+ * - Provide hit-test geometry for interactive overlays
5624
+ * - Provide cursor style on hover
5625
+ * - Render into a canvas 2D context
5626
+ *
5627
+ * @public
5628
+ */
5629
+ export declare abstract class OverlayUtil<T extends TLOverlay = TLOverlay> {
5630
+ editor: Editor;
5631
+ constructor(editor: Editor);
5632
+ static type: string;
5633
+ /**
5634
+ * Options for this overlay util. Override this to provide customization options.
5635
+ * Use {@link OverlayUtil.configure} to customize existing overlay utils.
5636
+ *
5637
+ * `zIndex` controls paint and hit-test order across utils — higher numbers
5638
+ * paint on top and are hit-tested first. Ties resolve by registration order.
5639
+ * Defaults to `0`; built-in utils use larger integers (100, 200, …) with
5640
+ * gaps so custom utils can slot between.
5641
+ *
5642
+ * @public
5643
+ */
5644
+ options: {
5645
+ zIndex?: number;
5646
+ };
5647
+ /**
5648
+ * Create a new overlay util class with the given options merged in.
5649
+ *
5650
+ * @example
5651
+ * ```ts
5652
+ * const MyBrush = BrushOverlayUtil.configure({ fill: 'rgba(0,0,255,0.1)' })
5653
+ * ```
5654
+ *
5655
+ * @public
5656
+ */
5657
+ static configure<T extends TLOverlayUtilConstructor<any>>(this: T, options: T extends new (...args: any[]) => {
5658
+ options: infer Options;
5659
+ } ? Partial<Options> : never): T;
5660
+ /**
5661
+ * Whether this overlay util's overlays should currently be active.
5662
+ * Checked reactively to determine which overlays exist at any given time.
5663
+ */
5664
+ abstract isActive(): boolean;
5665
+ /**
5666
+ * Returns the overlay instances that currently exist.
5667
+ * Called only when `isActive()` returns true.
5668
+ */
5669
+ abstract getOverlays(): T[];
5670
+ /**
5671
+ * Returns hit-test geometry for an overlay instance, in page coordinates.
5672
+ * Return null for non-interactive overlays (e.g. snap indicators, scribbles).
5673
+ */
5674
+ getGeometry(_overlay: T): Geometry2d | null;
5675
+ /**
5676
+ * Returns the cursor type to show when hovering this overlay.
5677
+ */
5678
+ getCursor(_overlay: T): TLCursorType | undefined;
5679
+ /**
5680
+ * Called when the user points down on this overlay, before the default
5681
+ * routing runs. Acts as an interrupt: define it to take over the event.
5682
+ *
5683
+ * Return `false` to continue with the default behavior (e.g. the
5684
+ * built-in rotate/resize handle transitions or shape-handle dispatch).
5685
+ * Return `true` — or nothing at all — to skip the default. In other
5686
+ * words, once you override this method you own the event unless you
5687
+ * explicitly opt back in by returning `false`.
5688
+ */
5689
+ onPointerDown?(overlay: T, info: TLPointerEventInfo): boolean | void;
5690
+ /**
5691
+ * Render all active overlays into the canvas context.
5692
+ * The context is already transformed to page space (camera transform applied).
5693
+ * Called reactively when overlays or editor state changes.
5694
+ */
5695
+ render(_ctx: CanvasRenderingContext2D, _overlays: T[]): void;
5696
+ /**
5697
+ * Optional: render all active overlays into the minimap canvas.
5698
+ * The context is already transformed to page space (minimap camera applied),
5699
+ * so overlays can use the same page-space coordinates as in {@link OverlayUtil.render}.
5700
+ *
5701
+ * `zoom` is the minimap's screen-pixels-per-page-unit, analogous to
5702
+ * `editor.getCamera().z`; use `1 / zoom` for one-minimap-pixel line widths.
5703
+ *
5704
+ * Most overlays should leave this blank — only overlays that are meaningful
5705
+ * at minimap scale (e.g. brushes, collaborator cursors) should opt in.
5706
+ */
5707
+ renderMinimap(_ctx: CanvasRenderingContext2D, _overlays: T[], _zoom: number): void;
5708
+ }
5709
+
5407
5710
  /**
5408
5711
  * Parses a string created by {@link createDeepLinkString} back into a deep link descriptor.
5409
5712
  *
@@ -5417,6 +5720,94 @@ export declare function parseDeepLinkString(deepLinkString: string): TLDeepLink;
5417
5720
  /** @public */
5418
5721
  export declare type PerfectDashTerminal = 'none' | 'outset' | 'skip';
5419
5722
 
5723
+ /**
5724
+ * Optional adapter that pipes PerformanceManager events into browser
5725
+ * `performance.mark()` / `performance.measure()` for DevTools integration.
5726
+ *
5727
+ * Tree-shakeable — only included if imported.
5728
+ *
5729
+ * @example
5730
+ * ```ts
5731
+ * const adapter = new PerformanceApiAdapter(editor.performance)
5732
+ * // ... later
5733
+ * adapter.dispose()
5734
+ * ```
5735
+ *
5736
+ * @public
5737
+ */
5738
+ export declare class PerformanceApiAdapter {
5739
+ private cleanups;
5740
+ constructor(perfManager: PerformanceManager);
5741
+ /** Remove all listeners and stop piping events. @public */
5742
+ dispose(): void;
5743
+ }
5744
+
5745
+ /**
5746
+ * Manages performance event subscriptions for the editor. Available as `editor.performance`.
5747
+ *
5748
+ * Listeners are lazy — internal editor hooks (frame, shape events) are only attached while
5749
+ * at least one subscriber exists, so there is zero overhead when unused.
5750
+ *
5751
+ * @example
5752
+ * ```ts
5753
+ * const unsub = editor.performance.on('interaction-end', (event) => {
5754
+ * console.log(`${event.name}: ${event.fps.toFixed(1)} fps, p95=${event.p95FrameTime.toFixed(1)}ms`)
5755
+ * })
5756
+ * ```
5757
+ *
5758
+ * @public
5759
+ */
5760
+ export declare class PerformanceManager {
5761
+ /* Excluded from this release type: emitter */
5762
+ private editor;
5763
+ private activeInteraction;
5764
+ private activeCamera;
5765
+ private frameCleanup;
5766
+ private shapeCreatedCleanup;
5767
+ private shapeEditedCleanup;
5768
+ private shapeDeletedCleanup;
5769
+ private loafObserver;
5770
+ constructor(editor: Editor);
5771
+ /**
5772
+ * Subscribe to a performance event. Returns an unsubscribe function.
5773
+ *
5774
+ * @example
5775
+ * ```ts
5776
+ * const unsub = editor.performance.on('interaction-end', (event) => {
5777
+ * sendToAnalytics({ name: event.name, fps: event.fps, p95: event.p95FrameTime })
5778
+ * })
5779
+ * // later: unsub()
5780
+ * ```
5781
+ *
5782
+ * @public
5783
+ */
5784
+ on<K extends keyof TLPerfEventMap>(event: K, fn: (...args: TLPerfEventMap[K]) => void): () => void;
5785
+ /**
5786
+ * Subscribe to a performance event once. The listener is removed after the first invocation.
5787
+ * Returns an unsubscribe function for early removal.
5788
+ *
5789
+ * @public
5790
+ */
5791
+ once<K extends keyof TLPerfEventMap>(event: K, fn: (...args: TLPerfEventMap[K]) => void): () => void;
5792
+ /* Excluded from this release type: dispose */
5793
+ /* Excluded from this release type: _notifyInteractionStart */
5794
+ /* Excluded from this release type: _notifyInteractionEnd */
5795
+ /* Excluded from this release type: _notifyCameraOperation */
5796
+ /* Excluded from this release type: _notifyUndoRedo */
5797
+ private _startCameraSession;
5798
+ private _endCameraSession;
5799
+ private _onFrame;
5800
+ private _onShapesCreated;
5801
+ private _onShapesEdited;
5802
+ private _onShapesDeleted;
5803
+ private _startLoafObserver;
5804
+ private _stopLoafObserver;
5805
+ private _needsFrameListener;
5806
+ private _needsLoafObserver;
5807
+ private _maybeAttachLazyListeners;
5808
+ private _maybeDetachLazyListeners;
5809
+ }
5810
+
5420
5811
  /**
5421
5812
  * Find the approximate perimeter of an ellipse.
5422
5813
  *
@@ -5848,6 +6239,32 @@ export declare function setRuntimeOverrides(input: Partial<typeof runtime>): voi
5848
6239
  /** @public */
5849
6240
  export declare function setUserPreferences(user: TLUserPreferences): void;
5850
6241
 
6242
+ /**
6243
+ * Overlay util for shape indicators — the selection / hover / hint outlines drawn
6244
+ * under the selection foreground. Paints local indicators in the theme's
6245
+ * selection color.
6246
+ *
6247
+ * Remote collaborator selection indicators are drawn by a separate overlay util
6248
+ * (e.g. `CollaboratorShapeIndicatorOverlayUtil` from `tldraw`) that runs at a
6249
+ * lower z-index so peer selections appear under the local indicators.
6250
+ *
6251
+ * Non-interactive: contributes no hit-test geometry.
6252
+ *
6253
+ * @public
6254
+ */
6255
+ export declare class ShapeIndicatorOverlayUtil extends OverlayUtil<TLShapeIndicatorOverlay> {
6256
+ static type: string;
6257
+ options: {
6258
+ hintedLineWidth: number;
6259
+ lineWidth: number;
6260
+ zIndex: number;
6261
+ };
6262
+ private _instanceFlags$;
6263
+ isActive(): boolean;
6264
+ getOverlays(): TLShapeIndicatorOverlay[];
6265
+ render(ctx: CanvasRenderingContext2D, overlays: TLShapeIndicatorOverlay[]): void;
6266
+ }
6267
+
5851
6268
  /** @public */
5852
6269
  export declare abstract class ShapeUtil<Shape extends TLShape = TLShape> {
5853
6270
  editor: Editor;
@@ -5944,37 +6361,30 @@ export declare abstract class ShapeUtil<Shape extends TLShape = TLShape> {
5944
6361
  */
5945
6362
  abstract component(shape: Shape): any;
5946
6363
  /**
5947
- * Get JSX describing the shape's indicator (as an SVG element).
6364
+ * Get a Path2D (or a richer object with clip/additional paths) for rendering the
6365
+ * shape's indicator on the canvas. Shapes that return `undefined` will not render
6366
+ * an indicator.
5948
6367
  *
5949
- * @param shape - The shape.
5950
- * @public
5951
- */
5952
- abstract indicator(shape: Shape): any;
5953
- /**
5954
- * Whether to use the legacy React-based indicator rendering.
5955
- *
5956
- * Override this to return `false` if your shape implements {@link ShapeUtil.getIndicatorPath}
5957
- * for canvas-based indicator rendering.
6368
+ * For complex indicators that need clipping (e.g., arrows with labels), return an
6369
+ * object with `path`, `clipPath`, and `additionalPaths` properties.
5958
6370
  *
5959
- * @returns `true` to use SVG indicators (default), `false` to use canvas indicators.
6371
+ * @param shape - The shape.
6372
+ * @returns A Path2D to stroke, or an object with clipping info, or undefined to skip.
5960
6373
  * @public
5961
6374
  */
5962
- useLegacyIndicator(): boolean;
6375
+ abstract getIndicatorPath(shape: Shape): TLIndicatorPath | undefined;
5963
6376
  /**
5964
- * Get a Path2D for rendering the shape's indicator on the canvas.
5965
- *
5966
- * When implemented, this is used instead of {@link ShapeUtil.indicator} for more
5967
- * efficient canvas-based indicator rendering. Shapes that return `undefined` will
5968
- * fall back to SVG-based rendering via {@link ShapeUtil.indicator}.
6377
+ * Get JSX describing the shape's indicator (as an SVG element).
5969
6378
  *
5970
- * For complex indicators that need clipping (e.g., arrows with labels), return an
5971
- * object with `path`, `clipPath`, and `additionalPaths` properties.
6379
+ * @deprecated SVG indicators are no longer rendered. Override
6380
+ * {@link ShapeUtil.getIndicatorPath} instead. This stub is retained so legacy
6381
+ * subclasses that still call `super.indicator()` keep type-checking; new shapes
6382
+ * should not implement it.
5972
6383
  *
5973
6384
  * @param shape - The shape.
5974
- * @returns A Path2D to stroke, or an object with clipping info, or undefined to use SVG fallback.
5975
6385
  * @public
5976
6386
  */
5977
- getIndicatorPath(shape: Shape): TLIndicatorPath | undefined;
6387
+ indicator(_shape: Shape): any;
5978
6388
  /**
5979
6389
  * Get the font faces that should be rendered in the document in order for this shape to render
5980
6390
  * correctly.
@@ -6008,7 +6418,7 @@ export declare abstract class ShapeUtil<Shape extends TLShape = TLShape> {
6008
6418
  *
6009
6419
  * @public
6010
6420
  */
6011
- canBind(_opts: TLShapeUtilCanBindOpts): boolean;
6421
+ canBind(opts: TLShapeUtilCanBindOpts): boolean;
6012
6422
  /**
6013
6423
  * Whether the shape can be double clicked to edit.
6014
6424
  *
@@ -6142,6 +6552,14 @@ export declare abstract class ShapeUtil<Shape extends TLShape = TLShape> {
6142
6552
  * @public
6143
6553
  */
6144
6554
  isAspectRatioLocked(shape: Shape): boolean;
6555
+ /**
6556
+ * Whether the shape behaves like a frame — a container that has child shapes,
6557
+ * requires full-brush selection, blocks erasure from inside, etc.
6558
+ *
6559
+ * @param shape - The shape.
6560
+ * @public
6561
+ */
6562
+ isFrameLike(_shape: Shape): boolean;
6145
6563
  /**
6146
6564
  * By default, the bounds of an image export are the bounds of all the shapes it contains, plus
6147
6565
  * some padding. If an export includes a shape where `isExportBoundsContainer` is true, then the
@@ -6189,7 +6607,7 @@ export declare abstract class ShapeUtil<Shape extends TLShape = TLShape> {
6189
6607
  * @param type - The shape type.
6190
6608
  * @public
6191
6609
  */
6192
- canReceiveNewChildrenOfType(shape: Shape, _type: TLShape['type']): boolean;
6610
+ canReceiveNewChildrenOfType(shape: Shape, type: TLShape['type']): boolean;
6193
6611
  /**
6194
6612
  * Get the shape as an SVG object.
6195
6613
  *
@@ -6632,6 +7050,8 @@ export declare abstract class StateNode implements Partial<TLEventHandlers> {
6632
7050
  static children?: () => TLStateNodeConstructor[];
6633
7051
  static isLockable: boolean;
6634
7052
  static useCoalescedEvents: boolean;
7053
+ /** Set to `true` in subclasses to emit interaction-start/end performance events when this state is entered/exited. */
7054
+ static trackPerformance: boolean;
6635
7055
  id: string;
6636
7056
  type: 'branch' | 'leaf' | 'root';
6637
7057
  shapeType?: string;
@@ -6731,6 +7151,19 @@ export declare const stopEventPropagation: (e: any) => any;
6731
7151
 
6732
7152
  /* Excluded from this release type: StoreName */
6733
7153
 
7154
+ /**
7155
+ * Combine every batchable shape indicator into a single page-space `Path2D` and
7156
+ * emit one stroke call. Shapes whose indicator needs an evenodd clip (e.g.
7157
+ * arrows with labels or complex arrowheads) can't be batched — they still
7158
+ * stroke individually inside a save/restore with `ctx.clip` applied.
7159
+ *
7160
+ * Shared by {@link ShapeIndicatorOverlayUtil} and any overlay util that paints
7161
+ * shape indicators (e.g. collaborator selections).
7162
+ *
7163
+ * @public
7164
+ */
7165
+ export declare function strokeShapeIndicators(editor: Editor, ctx: CanvasRenderingContext2D, shapeIds: TLShapeId[]): void;
7166
+
6734
7167
  /** @public */
6735
7168
  export declare function suffixSafeId(id: SafeId, suffix: string): SafeId;
6736
7169
 
@@ -6905,6 +7338,9 @@ export declare type TLAnyAssetUtilConstructor = TLAssetUtilConstructor<any>;
6905
7338
  /** @public */
6906
7339
  export declare type TLAnyBindingUtilConstructor = TLBindingUtilConstructor<any>;
6907
7340
 
7341
+ /** @public */
7342
+ export declare type TLAnyOverlayUtilConstructor = TLOverlayUtilConstructor<any>;
7343
+
6908
7344
  /** @public */
6909
7345
  export declare type TLAnyShapeUtilConstructor = TLShapeUtilConstructor<any>;
6910
7346
 
@@ -6948,15 +7384,6 @@ export declare interface TLBindingUtilConstructor<T extends TLBinding, U extends
6948
7384
  migrations?: TLPropsMigrations;
6949
7385
  }
6950
7386
 
6951
- /** @public */
6952
- export declare interface TLBrushProps {
6953
- userId?: string;
6954
- brush: BoxModel;
6955
- color?: string;
6956
- opacity?: number;
6957
- className?: string;
6958
- }
6959
-
6960
7387
  /** @public */
6961
7388
  export declare interface TLCameraConstraints {
6962
7389
  /** The bounds (in page space) of the constrained space */
@@ -7005,6 +7432,29 @@ export declare interface TLCameraConstraints {
7005
7432
  };
7006
7433
  }
7007
7434
 
7435
+ /**
7436
+ * Emitted when a camera operation ends (after a 50ms debounce), with aggregated frame time stats.
7437
+ * @public
7438
+ */
7439
+ export declare interface TLCameraEndPerfEvent extends TLPerfFrameTimeStats {
7440
+ /** Whether this was a pan or zoom operation. */
7441
+ type: 'panning' | 'zooming';
7442
+ /** Total shapes on the current page. */
7443
+ shapeCount: number;
7444
+ /** Number of shapes visible (not culled) in the viewport. */
7445
+ visibleShapeCount: number;
7446
+ /** Number of shapes culled (off-screen) from rendering. */
7447
+ culledShapeCount: number;
7448
+ /** Viewport width in screen pixels. */
7449
+ viewportWidth: number;
7450
+ /** Viewport height in screen pixels. */
7451
+ viewportHeight: number;
7452
+ /** Camera zoom level (`camera.z`) at session end. */
7453
+ zoomLevel: number;
7454
+ /** `performance.now()` when the camera session ended. */
7455
+ timestamp: number;
7456
+ }
7457
+
7008
7458
  /** @public */
7009
7459
  export declare interface TLCameraMoveOptions {
7010
7460
  /** Whether to move the camera immediately, rather than on the next tick. */
@@ -7043,6 +7493,17 @@ export declare interface TLCameraOptions {
7043
7493
  constraints?: TLCameraConstraints;
7044
7494
  }
7045
7495
 
7496
+ /**
7497
+ * Emitted when a camera operation (pan or zoom) begins.
7498
+ * @public
7499
+ */
7500
+ export declare interface TLCameraStartPerfEvent {
7501
+ /** Whether this is a pan or zoom operation. */
7502
+ type: 'panning' | 'zooming';
7503
+ /** `performance.now()` when the camera session started. */
7504
+ timestamp: number;
7505
+ }
7506
+
7046
7507
  /** @public */
7047
7508
  export declare type TLCancelEvent = (info: TLCancelEventInfo) => void;
7048
7509
 
@@ -7110,17 +7571,6 @@ export declare interface TLClipboardWriteInfo {
7110
7571
  readonly source: 'menu' | 'native';
7111
7572
  }
7112
7573
 
7113
- /** @public */
7114
- export declare interface TLCollaboratorHintProps {
7115
- userId: string;
7116
- className?: string;
7117
- point: VecModel;
7118
- viewport: Box;
7119
- zoom: number;
7120
- opacity?: number;
7121
- color: string;
7122
- }
7123
-
7124
7574
  /** @public */
7125
7575
  export declare type TLCompleteEvent = (info: TLCompleteEventInfo) => void;
7126
7576
 
@@ -7165,17 +7615,6 @@ export declare interface TLCurrentUser {
7165
7615
  readonly setUserPreferences: (userPreferences: TLUserPreferences) => void;
7166
7616
  }
7167
7617
 
7168
- /** @public */
7169
- export declare interface TLCursorProps {
7170
- userId: string;
7171
- className?: string;
7172
- point: null | VecModel;
7173
- zoom: number;
7174
- color?: string;
7175
- name: null | string;
7176
- chatMessage: string;
7177
- }
7178
-
7179
7618
  /** @public */
7180
7619
  export declare type TLDeepLink = {
7181
7620
  bounds: BoxModel;
@@ -7269,6 +7708,10 @@ export declare interface TldrawEditorBaseProps {
7269
7708
  * An array of asset utils to use in the editor.
7270
7709
  */
7271
7710
  assetUtils?: readonly TLAnyAssetUtilConstructor[];
7711
+ /**
7712
+ * An array of overlay utils to use in the editor for canvas overlay UI elements.
7713
+ */
7714
+ overlayUtils?: readonly TLAnyOverlayUtilConstructor[];
7272
7715
  /**
7273
7716
  * An array of tools to add to the editor's state chart.
7274
7717
  */
@@ -7530,6 +7973,12 @@ export declare interface TldrawOptions {
7530
7973
  * When false, the spacebar will not pan the camera.
7531
7974
  */
7532
7975
  readonly spacebarPanning: boolean;
7976
+ /**
7977
+ * Whether to allow right-click + drag to pan the camera. When true, right-click + drag pans the
7978
+ * camera and a static right-click opens the context menu at the release position. When false,
7979
+ * right-click opens the context menu on press (no drag-to-pan).
7980
+ */
7981
+ readonly rightClickPanning: boolean;
7533
7982
  /**
7534
7983
  * The default padding (in pixels) used when zooming to fit content in the viewport.
7535
7984
  * This affects methods like `zoomToFit()`, `zoomToSelection()`, and `zoomToBounds()`.
@@ -7659,34 +8108,17 @@ export declare interface TLDropShapesOverInfo {
7659
8108
  /** @public */
7660
8109
  export declare interface TLEditorComponents {
7661
8110
  Background?: ComponentType | null;
7662
- Brush?: ComponentType<TLBrushProps> | null;
7663
8111
  Canvas?: ComponentType<TLCanvasComponentProps> | null;
7664
- CollaboratorBrush?: ComponentType<TLBrushProps> | null;
7665
- CollaboratorCursor?: ComponentType<TLCursorProps> | null;
7666
- CollaboratorHint?: ComponentType<TLCollaboratorHintProps> | null;
7667
- CollaboratorScribble?: ComponentType<TLScribbleProps> | null;
7668
- CollaboratorShapeIndicator?: ComponentType<TLShapeIndicatorProps> | null;
7669
- Cursor?: ComponentType<TLCursorProps> | null;
7670
8112
  Grid?: ComponentType<TLGridProps> | null;
7671
- Handle?: ComponentType<TLHandleProps> | null;
7672
- Handles?: ComponentType<TLHandlesProps> | null;
7673
8113
  InFrontOfTheCanvas?: ComponentType | null;
7674
8114
  LoadingScreen?: ComponentType | null;
7675
8115
  OnTheCanvas?: ComponentType | null;
7676
- Overlays?: ComponentType | null;
7677
- Scribble?: ComponentType<TLScribbleProps> | null;
7678
8116
  SelectionBackground?: ComponentType<TLSelectionBackgroundProps> | null;
7679
- SelectionForeground?: ComponentType<TLSelectionForegroundProps> | null;
7680
- ShapeIndicator?: ComponentType<TLShapeIndicatorProps> | null;
7681
- ShapeIndicators?: ComponentType | null;
7682
8117
  ShapeWrapper?: ComponentType<TLShapeWrapperProps & RefAttributes<HTMLDivElement>> | null;
7683
- SnapIndicator?: ComponentType<TLSnapIndicatorProps> | null;
7684
8118
  Spinner?: ComponentType<React.SVGProps<SVGSVGElement>> | null;
7685
8119
  SvgDefs?: ComponentType | null;
7686
- ZoomBrush?: ComponentType<TLBrushProps> | null;
7687
8120
  ErrorFallback?: TLErrorFallbackComponent;
7688
8121
  ShapeErrorFallback?: TLShapeErrorFallbackComponent;
7689
- ShapeIndicatorErrorFallback?: TLShapeIndicatorErrorFallbackComponent;
7690
8122
  }
7691
8123
 
7692
8124
  /** @public */
@@ -7708,6 +8140,11 @@ export declare interface TLEditorOptions {
7708
8140
  * An array of asset utils to use in the editor. These will be used to handle asset-type-specific behavior.
7709
8141
  */
7710
8142
  assetUtils?: readonly TLAnyAssetUtilConstructor[];
8143
+ /**
8144
+ * An array of overlay utils to use in the editor. These define canvas overlay UI elements
8145
+ * like selection handles, rotation corners, shape handles, etc.
8146
+ */
8147
+ overlayUtils?: readonly TLAnyOverlayUtilConstructor[];
7711
8148
  /**
7712
8149
  * An array of tools to use in the editor. These will be used to handle events and manage user interactions in the editor.
7713
8150
  */
@@ -7981,6 +8418,21 @@ export declare interface TLFilesExternalContent extends TLBaseExternalContent {
7981
8418
  ignoreParent?: boolean;
7982
8419
  }
7983
8420
 
8421
+ /**
8422
+ * Emitted every animation frame when at least one `'frame'` listener is registered.
8423
+ * @public
8424
+ */
8425
+ export declare interface TLFramePerfEvent {
8426
+ /** Time since the last frame in ms. */
8427
+ elapsed: number;
8428
+ /** Total shapes on the current page. */
8429
+ shapeCount: number;
8430
+ /** Number of shapes culled (off-screen) from rendering. */
8431
+ culledShapeCount: number;
8432
+ /** Number of shapes visible (not culled) in the viewport. */
8433
+ visibleShapeCount: number;
8434
+ }
8435
+
7984
8436
  /** Additional options for the {@link ShapeUtil.getGeometry} method.
7985
8437
  *
7986
8438
  * @public
@@ -8059,20 +8511,6 @@ export declare interface TLHandleDragInfo<T extends TLShape> {
8059
8511
  initial?: T | undefined;
8060
8512
  }
8061
8513
 
8062
- /** @public */
8063
- export declare interface TLHandleProps {
8064
- shapeId: TLShapeId;
8065
- handle: TLHandle;
8066
- zoom: number;
8067
- isCoarse: boolean;
8068
- className?: string;
8069
- }
8070
-
8071
- /** @public */
8072
- export declare interface TLHandlesProps {
8073
- children: ReactNode;
8074
- }
8075
-
8076
8514
  /** @public */
8077
8515
  export declare interface TLHistoryBatchOptions {
8078
8516
  /**
@@ -8123,6 +8561,38 @@ export declare type TLIndicatorPath = {
8123
8561
  path: Path2D;
8124
8562
  } | Path2D;
8125
8563
 
8564
+ /**
8565
+ * Emitted when an interaction state is exited, with aggregated frame time stats.
8566
+ * @public
8567
+ */
8568
+ export declare interface TLInteractionEndPerfEvent extends TLPerfFrameTimeStats {
8569
+ /** The state node id (e.g. `'translating'`). */
8570
+ name: string;
8571
+ /** Full tool path (e.g. `'select.translating'`). */
8572
+ path: string;
8573
+ /** Total shapes on the current page. */
8574
+ shapeCount: number;
8575
+ /** Breakdown of selected shape types at interaction start (e.g. `{ geo: 2, draw: 1 }`). */
8576
+ selectedShapeTypes: Record<string, number>;
8577
+ /** Camera zoom level (`camera.z`) at interaction end. */
8578
+ zoomLevel: number;
8579
+ /** `performance.now()` when the interaction ended. */
8580
+ timestamp: number;
8581
+ }
8582
+
8583
+ /**
8584
+ * Emitted when an interaction state (e.g. translating, resizing) is entered.
8585
+ * @public
8586
+ */
8587
+ export declare interface TLInteractionStartPerfEvent {
8588
+ /** The state node id (e.g. `'translating'`). */
8589
+ name: string;
8590
+ /** Full tool path (e.g. `'select.translating'`). */
8591
+ path: string;
8592
+ /** `performance.now()` when the interaction started. */
8593
+ timestamp: number;
8594
+ }
8595
+
8126
8596
  /** @public */
8127
8597
  export declare type TLInterruptEvent = (info: TLInterruptEventInfo) => void;
8128
8598
 
@@ -8370,6 +8840,130 @@ export declare const tlmenus: {
8370
8840
  */
8371
8841
  export declare type TLOnMountHandler = (editor: Editor) => (() => undefined | void) | undefined | void;
8372
8842
 
8843
+ /** @public */
8844
+ export declare interface TLOverlay<Props = Record<string, unknown>> {
8845
+ /**
8846
+ * Globally unique id for this overlay instance across all overlay utils.
8847
+ * Hit-test and hover lookup key on `id` alone, so utils must namespace their
8848
+ * ids (e.g. `'selection_fg:top_left'`, `'handle:<shapeId>:<handleId>'`) to
8849
+ * avoid colliding with overlays from other utils.
8850
+ */
8851
+ id: string;
8852
+ /** The overlay util type that owns this instance */
8853
+ type: string;
8854
+ /** Arbitrary props for the overlay (handle id, corner name, etc.) */
8855
+ props: Props;
8856
+ }
8857
+
8858
+ /**
8859
+ * An active overlay util paired with the overlays it produced for the current
8860
+ * editor state. Returned by {@link OverlayManager.getActiveOverlayEntries} so
8861
+ * hit-test, render, and debug paths share a single scan per reactive tick.
8862
+ *
8863
+ * @public
8864
+ */
8865
+ export declare interface TLOverlayEntry {
8866
+ util: OverlayUtil;
8867
+ overlays: TLOverlay[];
8868
+ }
8869
+
8870
+ /** @public */
8871
+ export declare interface TLOverlayUtilConstructor<U extends OverlayUtil = OverlayUtil> {
8872
+ new (editor: Editor): U;
8873
+ type: string;
8874
+ configure<T extends TLOverlayUtilConstructor<any>>(this: T, options: T extends new (...args: any[]) => {
8875
+ options: infer Options;
8876
+ } ? Partial<Options> : never): T;
8877
+ }
8878
+
8879
+ /**
8880
+ * Map of all performance event names to their payload types.
8881
+ * Used with {@link PerformanceManager.on} and {@link PerformanceManager.once}.
8882
+ * @public
8883
+ */
8884
+ export declare interface TLPerfEventMap {
8885
+ /** An interaction state was entered. */
8886
+ 'interaction-start': [TLInteractionStartPerfEvent];
8887
+ /** An interaction state was exited, with aggregated frame time stats. */
8888
+ 'interaction-end': [TLInteractionEndPerfEvent];
8889
+ /** A camera operation (pan/zoom) began. */
8890
+ 'camera-start': [TLCameraStartPerfEvent];
8891
+ /** A camera operation ended (after debounce), with aggregated frame time stats. */
8892
+ 'camera-end': [TLCameraEndPerfEvent];
8893
+ /** Shapes were created. */
8894
+ 'shapes-created': [TLShapeOperationPerfEvent];
8895
+ /** Shapes were updated. */
8896
+ 'shapes-updated': [TLShapeOperationPerfEvent];
8897
+ /** Shapes were deleted. */
8898
+ 'shapes-deleted': [TLShapeOperationPerfEvent];
8899
+ /** An animation frame was rendered. Only fires when listeners are registered. */
8900
+ frame: [TLFramePerfEvent];
8901
+ /** An undo operation was performed. */
8902
+ undo: [TLUndoRedoPerfEvent];
8903
+ /** A redo operation was performed. */
8904
+ redo: [TLUndoRedoPerfEvent];
8905
+ }
8906
+
8907
+ /**
8908
+ * Common frame time statistics shared by interaction and camera end events.
8909
+ * @public
8910
+ */
8911
+ export declare interface TLPerfFrameTimeStats {
8912
+ /** Total duration of the session in ms. */
8913
+ duration: number;
8914
+ /** Average frames per second during the session. */
8915
+ fps: number;
8916
+ /** Total number of frames recorded. */
8917
+ frameCount: number;
8918
+ /** Mean frame duration in ms. */
8919
+ avgFrameTime: number;
8920
+ /** Median (p50) frame duration in ms. */
8921
+ medianFrameTime: number;
8922
+ /** 95th percentile frame duration in ms. */
8923
+ p95FrameTime: number;
8924
+ /** 99th percentile frame duration in ms. */
8925
+ p99FrameTime: number;
8926
+ /** Shortest frame duration in ms. */
8927
+ minFrameTime: number;
8928
+ /** Longest frame duration in ms. */
8929
+ maxFrameTime: number;
8930
+ /** Raw frame durations for local analysis. Exclude when sending to analytics. */
8931
+ frameTimes: number[];
8932
+ /**
8933
+ * Long animation frames observed during this period (Chromium 123+).
8934
+ * Only present when the browser supports the Long Animation Frames API and
8935
+ * at least one long frame was observed.
8936
+ * Exclude when sending to analytics — entries are large and contain script URLs.
8937
+ */
8938
+ longAnimationFrames?: TLPerfLongAnimationFrame[];
8939
+ }
8940
+
8941
+ /**
8942
+ * A long animation frame observed by the browser during an interaction.
8943
+ * Available only in browsers that support the Long Animation Frames API (Chromium 123+).
8944
+ * @public
8945
+ */
8946
+ export declare interface TLPerfLongAnimationFrame {
8947
+ /** Frame start time (relative to timeOrigin). */
8948
+ startTime: number;
8949
+ /** Total frame duration in ms. */
8950
+ duration: number;
8951
+ /** Time the main thread was blocked in ms. */
8952
+ blockingDuration: number;
8953
+ /** Scripts that contributed to the long frame. */
8954
+ scripts: TLPerfLongAnimationFrameScript[];
8955
+ }
8956
+
8957
+ /** A script attribution entry from a long animation frame. @public */
8958
+ export declare interface TLPerfLongAnimationFrameScript {
8959
+ /** The script source URL (may be empty for inline scripts). */
8960
+ sourceURL: string;
8961
+ /** The function name or invoker description. */
8962
+ invoker: string;
8963
+ /** Time spent in this script in ms. */
8964
+ duration: number;
8965
+ }
8966
+
8373
8967
  /** @public */
8374
8968
  export declare type TLPinchEvent = (info: TLPinchEventInfo) => void;
8375
8969
 
@@ -8409,6 +9003,10 @@ export declare type TLPointerEventTarget = {
8409
9003
  handle?: TLSelectionHandle;
8410
9004
  shape?: undefined;
8411
9005
  target: 'selection';
9006
+ } | {
9007
+ overlay: TLOverlay;
9008
+ shape?: undefined;
9009
+ target: 'overlay';
8412
9010
  } | {
8413
9011
  shape: TLShape;
8414
9012
  target: 'shape';
@@ -8479,28 +9077,12 @@ export declare type TLResizeShapeOptions = Partial<{
8479
9077
 
8480
9078
  /* Excluded from this release type: TLRotationSnapshot */
8481
9079
 
8482
- /** @public */
8483
- export declare interface TLScribbleProps {
8484
- userId?: string;
8485
- scribble: TLScribble;
8486
- zoom: number;
8487
- color?: string;
8488
- opacity?: number;
8489
- className?: string;
8490
- }
8491
-
8492
9080
  /** @public */
8493
9081
  export declare interface TLSelectionBackgroundProps {
8494
9082
  bounds: Box;
8495
9083
  rotation: number;
8496
9084
  }
8497
9085
 
8498
- /** @public */
8499
- export declare interface TLSelectionForegroundProps {
8500
- bounds: Box;
8501
- rotation: number;
8502
- }
8503
-
8504
9086
  /** @public */
8505
9087
  export declare type TLSelectionHandle = RotateCorner | SelectionCorner | SelectionEdge;
8506
9088
 
@@ -8535,26 +9117,26 @@ export declare type TLShapeErrorFallbackComponent = ComponentType<{
8535
9117
  }>;
8536
9118
 
8537
9119
  /** @public */
8538
- export declare type TLShapeIndicatorErrorFallbackComponent = ComponentType<{
8539
- error: unknown;
8540
- }>;
8541
-
8542
- /** @public */
8543
- export declare interface TLShapeIndicatorProps {
8544
- userId?: string;
8545
- shapeId: TLShapeId;
8546
- color?: string | undefined;
8547
- opacity?: number;
8548
- className?: string;
8549
- hidden?: boolean;
9120
+ export declare interface TLShapeIndicatorOverlay extends TLOverlay {
9121
+ props: {
9122
+ hintingShapeIds: TLShapeId[];
9123
+ idsToDisplay: TLShapeId[];
9124
+ };
8550
9125
  }
8551
9126
 
8552
- /** @public */
8553
- export declare interface TLShapeIndicatorsProps {
8554
- /** Whether to hide all of the indicators */
8555
- hideAll?: boolean;
8556
- /** Whether to show all of the indicators */
8557
- showAll?: boolean;
9127
+ /**
9128
+ * Emitted when shapes are created, updated, or deleted.
9129
+ * @public
9130
+ */
9131
+ export declare interface TLShapeOperationPerfEvent {
9132
+ /** The operation type. */
9133
+ operation: 'create' | 'delete' | 'update';
9134
+ /** Number of shapes affected. */
9135
+ count: number;
9136
+ /** Breakdown by shape type (e.g. `{ geo: 2, draw: 1 }`). */
9137
+ shapeTypes: Record<string, number>;
9138
+ /** `performance.now()` when the operation occurred. */
9139
+ timestamp: number;
8558
9140
  }
8559
9141
 
8560
9142
  /**
@@ -8627,13 +9209,6 @@ export declare interface TLShapeWrapperProps extends React.HTMLAttributes<HTMLDi
8627
9209
  children: ReactNode;
8628
9210
  }
8629
9211
 
8630
- /** @public */
8631
- export declare interface TLSnapIndicatorProps {
8632
- className?: string;
8633
- line: SnapIndicator;
8634
- zoom: number;
8635
- }
8636
-
8637
9212
  /** @public */
8638
9213
  export declare interface TLStateNodeConstructor {
8639
9214
  new (editor: Editor, parent?: StateNode): StateNode;
@@ -8642,6 +9217,7 @@ export declare interface TLStateNodeConstructor {
8642
9217
  children?(): TLStateNodeConstructor[];
8643
9218
  isLockable: boolean;
8644
9219
  useCoalescedEvents: boolean;
9220
+ trackPerformance: boolean;
8645
9221
  }
8646
9222
 
8647
9223
  /** @public */
@@ -8819,6 +9395,19 @@ export declare interface TLTldrawExternalContentSource {
8819
9395
  data: TLContent;
8820
9396
  }
8821
9397
 
9398
+ /**
9399
+ * Emitted after an undo or redo operation.
9400
+ * @public
9401
+ */
9402
+ export declare interface TLUndoRedoPerfEvent {
9403
+ /** Whether this was an undo or redo. */
9404
+ type: 'redo' | 'undo';
9405
+ /** Number of undo steps remaining. */
9406
+ undoDepth: number;
9407
+ /** Number of redo steps remaining. */
9408
+ redoDepth: number;
9409
+ }
9410
+
8822
9411
  /** @public */
8823
9412
  export declare interface TLUpdatePointerOptions {
8824
9413
  /** Whether to update the pointer immediately, rather than on the next tick. */
@@ -9008,6 +9597,10 @@ export declare function usePassThroughMouseOverEvents(ref: RefObject<HTMLElement
9008
9597
  export declare function usePassThroughWheelEvents(ref: RefObject<HTMLElement | null>): void;
9009
9598
 
9010
9599
  /**
9600
+ * Reactive list of peer user IDs for collaborators currently shown in the UI.
9601
+ * Mirrors {@link Editor.getVisibleCollaborators} — peers fade out as they
9602
+ * transition to idle/inactive, without requiring a manual re-render.
9603
+ *
9011
9604
  * @returns The list of peer UserIDs
9012
9605
  * @public
9013
9606
  */