tldraw 3.16.0-canary.e9c30b532b82 → 3.16.0-canary.ea008b31887f

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 (301) hide show
  1. package/dist-cjs/index.d.ts +227 -103
  2. package/dist-cjs/index.js +33 -14
  3. package/dist-cjs/index.js.map +2 -2
  4. package/dist-cjs/lib/Tldraw.js +12 -2
  5. package/dist-cjs/lib/Tldraw.js.map +2 -2
  6. package/dist-cjs/lib/defaultExternalContentHandlers.js +5 -4
  7. package/dist-cjs/lib/defaultExternalContentHandlers.js.map +2 -2
  8. package/dist-cjs/lib/shapes/arrow/arrowLabel.js +6 -0
  9. package/dist-cjs/lib/shapes/arrow/arrowLabel.js.map +3 -3
  10. package/dist-cjs/lib/shapes/frame/FrameShapeUtil.js +8 -1
  11. package/dist-cjs/lib/shapes/frame/FrameShapeUtil.js.map +2 -2
  12. package/dist-cjs/lib/shapes/geo/GeoShapeUtil.js +1 -0
  13. package/dist-cjs/lib/shapes/geo/GeoShapeUtil.js.map +2 -2
  14. package/dist-cjs/lib/shapes/image/ImageShapeUtil.js +3 -0
  15. package/dist-cjs/lib/shapes/image/ImageShapeUtil.js.map +2 -2
  16. package/dist-cjs/lib/shapes/note/NoteShapeUtil.js +2 -1
  17. package/dist-cjs/lib/shapes/note/NoteShapeUtil.js.map +2 -2
  18. package/dist-cjs/lib/shapes/shared/PlainTextLabel.js +1 -3
  19. package/dist-cjs/lib/shapes/shared/PlainTextLabel.js.map +2 -2
  20. package/dist-cjs/lib/shapes/shared/freehand/svg.js.map +2 -2
  21. package/dist-cjs/lib/shapes/shared/useEditablePlainText.js +0 -2
  22. package/dist-cjs/lib/shapes/shared/useEditablePlainText.js.map +2 -2
  23. package/dist-cjs/lib/shapes/shared/useImageOrVideoAsset.js +0 -2
  24. package/dist-cjs/lib/shapes/shared/useImageOrVideoAsset.js.map +2 -2
  25. package/dist-cjs/lib/tools/EraserTool/childStates/Erasing.js +25 -1
  26. package/dist-cjs/lib/tools/EraserTool/childStates/Erasing.js.map +2 -2
  27. package/dist-cjs/lib/tools/EraserTool/childStates/Pointing.js +12 -0
  28. package/dist-cjs/lib/tools/EraserTool/childStates/Pointing.js.map +2 -2
  29. package/dist-cjs/lib/ui/TldrawUi.js +13 -12
  30. package/dist-cjs/lib/ui/TldrawUi.js.map +2 -2
  31. package/dist-cjs/lib/ui/assetUrls.js +13 -10
  32. package/dist-cjs/lib/ui/assetUrls.js.map +2 -2
  33. package/dist-cjs/lib/ui/components/{FollowingIndicator.js → DefaultFollowingIndicator.js} +6 -6
  34. package/dist-cjs/lib/ui/components/DefaultFollowingIndicator.js.map +7 -0
  35. package/dist-cjs/lib/ui/components/KeyboardShortcutsDialog/DefaultKeyboardShortcutsDialogContent.js +6 -6
  36. package/dist-cjs/lib/ui/components/KeyboardShortcutsDialog/DefaultKeyboardShortcutsDialogContent.js.map +1 -1
  37. package/dist-cjs/lib/ui/components/StylePanel/DefaultStylePanel.js +9 -4
  38. package/dist-cjs/lib/ui/components/StylePanel/DefaultStylePanel.js.map +2 -2
  39. package/dist-cjs/lib/ui/components/StylePanel/DefaultStylePanelContent.js +255 -316
  40. package/dist-cjs/lib/ui/components/StylePanel/DefaultStylePanelContent.js.map +2 -2
  41. package/dist-cjs/lib/ui/components/{primitives/TldrawUiButtonPicker.js → StylePanel/StylePanelButtonPicker.js} +52 -45
  42. package/dist-cjs/lib/ui/components/StylePanel/StylePanelButtonPicker.js.map +7 -0
  43. package/dist-cjs/lib/ui/components/StylePanel/StylePanelContext.js +68 -0
  44. package/dist-cjs/lib/ui/components/StylePanel/StylePanelContext.js.map +7 -0
  45. package/dist-cjs/lib/ui/components/StylePanel/{DoubleDropdownPicker.js → StylePanelDoubleDropdownPicker.js} +23 -22
  46. package/dist-cjs/lib/ui/components/StylePanel/StylePanelDoubleDropdownPicker.js.map +7 -0
  47. package/dist-cjs/lib/ui/components/StylePanel/{DropdownPicker.js → StylePanelDropdownPicker.js} +24 -21
  48. package/dist-cjs/lib/ui/components/StylePanel/StylePanelDropdownPicker.js.map +7 -0
  49. package/dist-cjs/lib/ui/components/StylePanel/StylePanelSubheading.js +28 -0
  50. package/dist-cjs/lib/ui/components/StylePanel/StylePanelSubheading.js.map +7 -0
  51. package/dist-cjs/lib/ui/components/Toolbar/AltTextEditor.js +3 -2
  52. package/dist-cjs/lib/ui/components/Toolbar/AltTextEditor.js.map +2 -2
  53. package/dist-cjs/lib/ui/components/Toolbar/DefaultImageToolbarContent.js +38 -9
  54. package/dist-cjs/lib/ui/components/Toolbar/DefaultImageToolbarContent.js.map +2 -2
  55. package/dist-cjs/lib/ui/components/Toolbar/DefaultVideoToolbarContent.js +15 -3
  56. package/dist-cjs/lib/ui/components/Toolbar/DefaultVideoToolbarContent.js.map +2 -2
  57. package/dist-cjs/lib/ui/components/Toolbar/LinkEditor.js +3 -3
  58. package/dist-cjs/lib/ui/components/Toolbar/LinkEditor.js.map +2 -2
  59. package/dist-cjs/lib/ui/components/primitives/TldrawUiContextualToolbar.js +10 -1
  60. package/dist-cjs/lib/ui/components/primitives/TldrawUiContextualToolbar.js.map +2 -2
  61. package/dist-cjs/lib/ui/components/primitives/TldrawUiSlider.js +18 -5
  62. package/dist-cjs/lib/ui/components/primitives/TldrawUiSlider.js.map +2 -2
  63. package/dist-cjs/lib/ui/components/primitives/TldrawUiToolbar.js +2 -0
  64. package/dist-cjs/lib/ui/components/primitives/TldrawUiToolbar.js.map +2 -2
  65. package/dist-cjs/lib/ui/components/primitives/TldrawUiTooltip.js +83 -42
  66. package/dist-cjs/lib/ui/components/primitives/TldrawUiTooltip.js.map +2 -2
  67. package/dist-cjs/lib/ui/components/primitives/menus/TldrawUiMenuItem.js +7 -6
  68. package/dist-cjs/lib/ui/components/primitives/menus/TldrawUiMenuItem.js.map +2 -2
  69. package/dist-cjs/lib/ui/context/actions.js +23 -10
  70. package/dist-cjs/lib/ui/context/actions.js.map +2 -2
  71. package/dist-cjs/lib/ui/context/components.js +2 -0
  72. package/dist-cjs/lib/ui/context/components.js.map +2 -2
  73. package/dist-cjs/lib/ui/context/events.js.map +1 -1
  74. package/dist-cjs/lib/ui/hooks/useExportAs.js +3 -2
  75. package/dist-cjs/lib/ui/hooks/useExportAs.js.map +2 -2
  76. package/dist-cjs/lib/ui/hooks/useTools.js +1 -1
  77. package/dist-cjs/lib/ui/hooks/useTools.js.map +2 -2
  78. package/dist-cjs/lib/ui/hooks/useTranslation/TLUiTranslationKey.js.map +1 -1
  79. package/dist-cjs/lib/ui/hooks/useTranslation/defaultTranslation.js +4 -2
  80. package/dist-cjs/lib/ui/hooks/useTranslation/defaultTranslation.js.map +2 -2
  81. package/dist-cjs/lib/ui/kbd-utils.js +9 -3
  82. package/dist-cjs/lib/ui/kbd-utils.js.map +2 -2
  83. package/dist-cjs/lib/ui/version.js +3 -3
  84. package/dist-cjs/lib/ui/version.js.map +1 -1
  85. package/dist-cjs/lib/utils/export/copyAs.js +1 -2
  86. package/dist-cjs/lib/utils/export/copyAs.js.map +2 -2
  87. package/dist-cjs/lib/utils/export/export.js +0 -20
  88. package/dist-cjs/lib/utils/export/export.js.map +2 -2
  89. package/dist-cjs/lib/utils/export/exportAs.js +1 -2
  90. package/dist-cjs/lib/utils/export/exportAs.js.map +2 -2
  91. package/dist-esm/index.d.mts +227 -103
  92. package/dist-esm/index.mjs +61 -29
  93. package/dist-esm/index.mjs.map +2 -2
  94. package/dist-esm/lib/Tldraw.mjs +14 -4
  95. package/dist-esm/lib/Tldraw.mjs.map +2 -2
  96. package/dist-esm/lib/defaultExternalContentHandlers.mjs +5 -4
  97. package/dist-esm/lib/defaultExternalContentHandlers.mjs.map +2 -2
  98. package/dist-esm/lib/shapes/arrow/arrowLabel.mjs +6 -0
  99. package/dist-esm/lib/shapes/arrow/arrowLabel.mjs.map +3 -3
  100. package/dist-esm/lib/shapes/frame/FrameShapeUtil.mjs +8 -1
  101. package/dist-esm/lib/shapes/frame/FrameShapeUtil.mjs.map +2 -2
  102. package/dist-esm/lib/shapes/geo/GeoShapeUtil.mjs +1 -0
  103. package/dist-esm/lib/shapes/geo/GeoShapeUtil.mjs.map +2 -2
  104. package/dist-esm/lib/shapes/image/ImageShapeUtil.mjs +3 -0
  105. package/dist-esm/lib/shapes/image/ImageShapeUtil.mjs.map +2 -2
  106. package/dist-esm/lib/shapes/note/NoteShapeUtil.mjs +2 -1
  107. package/dist-esm/lib/shapes/note/NoteShapeUtil.mjs.map +2 -2
  108. package/dist-esm/lib/shapes/shared/PlainTextLabel.mjs +1 -3
  109. package/dist-esm/lib/shapes/shared/PlainTextLabel.mjs.map +2 -2
  110. package/dist-esm/lib/shapes/shared/freehand/svg.mjs.map +2 -2
  111. package/dist-esm/lib/shapes/shared/useEditablePlainText.mjs +0 -2
  112. package/dist-esm/lib/shapes/shared/useEditablePlainText.mjs.map +2 -2
  113. package/dist-esm/lib/shapes/shared/useImageOrVideoAsset.mjs +0 -2
  114. package/dist-esm/lib/shapes/shared/useImageOrVideoAsset.mjs.map +2 -2
  115. package/dist-esm/lib/tools/EraserTool/childStates/Erasing.mjs +26 -1
  116. package/dist-esm/lib/tools/EraserTool/childStates/Erasing.mjs.map +2 -2
  117. package/dist-esm/lib/tools/EraserTool/childStates/Pointing.mjs +13 -0
  118. package/dist-esm/lib/tools/EraserTool/childStates/Pointing.mjs.map +2 -2
  119. package/dist-esm/lib/ui/TldrawUi.mjs +13 -12
  120. package/dist-esm/lib/ui/TldrawUi.mjs.map +2 -2
  121. package/dist-esm/lib/ui/assetUrls.mjs +13 -10
  122. package/dist-esm/lib/ui/assetUrls.mjs.map +2 -2
  123. package/dist-esm/lib/ui/components/{FollowingIndicator.mjs → DefaultFollowingIndicator.mjs} +3 -3
  124. package/dist-esm/lib/ui/components/DefaultFollowingIndicator.mjs.map +7 -0
  125. package/dist-esm/lib/ui/components/KeyboardShortcutsDialog/DefaultKeyboardShortcutsDialogContent.mjs +6 -6
  126. package/dist-esm/lib/ui/components/KeyboardShortcutsDialog/DefaultKeyboardShortcutsDialogContent.mjs.map +1 -1
  127. package/dist-esm/lib/ui/components/StylePanel/DefaultStylePanel.mjs +14 -5
  128. package/dist-esm/lib/ui/components/StylePanel/DefaultStylePanel.mjs.map +2 -2
  129. package/dist-esm/lib/ui/components/StylePanel/DefaultStylePanelContent.mjs +257 -320
  130. package/dist-esm/lib/ui/components/StylePanel/DefaultStylePanelContent.mjs.map +2 -2
  131. package/dist-esm/lib/ui/components/{primitives/TldrawUiButtonPicker.mjs → StylePanel/StylePanelButtonPicker.mjs} +54 -43
  132. package/dist-esm/lib/ui/components/StylePanel/StylePanelButtonPicker.mjs.map +7 -0
  133. package/dist-esm/lib/ui/components/StylePanel/StylePanelContext.mjs +48 -0
  134. package/dist-esm/lib/ui/components/StylePanel/StylePanelContext.mjs.map +7 -0
  135. package/dist-esm/lib/ui/components/StylePanel/{DoubleDropdownPicker.mjs → StylePanelDoubleDropdownPicker.mjs} +20 -19
  136. package/dist-esm/lib/ui/components/StylePanel/StylePanelDoubleDropdownPicker.mjs.map +7 -0
  137. package/dist-esm/lib/ui/components/StylePanel/{DropdownPicker.mjs → StylePanelDropdownPicker.mjs} +21 -18
  138. package/dist-esm/lib/ui/components/StylePanel/StylePanelDropdownPicker.mjs.map +7 -0
  139. package/dist-esm/lib/ui/components/StylePanel/StylePanelSubheading.mjs +8 -0
  140. package/dist-esm/lib/ui/components/StylePanel/StylePanelSubheading.mjs.map +7 -0
  141. package/dist-esm/lib/ui/components/Toolbar/AltTextEditor.mjs +3 -2
  142. package/dist-esm/lib/ui/components/Toolbar/AltTextEditor.mjs.map +2 -2
  143. package/dist-esm/lib/ui/components/Toolbar/DefaultImageToolbarContent.mjs +38 -9
  144. package/dist-esm/lib/ui/components/Toolbar/DefaultImageToolbarContent.mjs.map +2 -2
  145. package/dist-esm/lib/ui/components/Toolbar/DefaultVideoToolbarContent.mjs +15 -3
  146. package/dist-esm/lib/ui/components/Toolbar/DefaultVideoToolbarContent.mjs.map +2 -2
  147. package/dist-esm/lib/ui/components/Toolbar/LinkEditor.mjs +3 -3
  148. package/dist-esm/lib/ui/components/Toolbar/LinkEditor.mjs.map +2 -2
  149. package/dist-esm/lib/ui/components/primitives/TldrawUiContextualToolbar.mjs +10 -1
  150. package/dist-esm/lib/ui/components/primitives/TldrawUiContextualToolbar.mjs.map +2 -2
  151. package/dist-esm/lib/ui/components/primitives/TldrawUiSlider.mjs +18 -5
  152. package/dist-esm/lib/ui/components/primitives/TldrawUiSlider.mjs.map +2 -2
  153. package/dist-esm/lib/ui/components/primitives/TldrawUiToolbar.mjs +2 -0
  154. package/dist-esm/lib/ui/components/primitives/TldrawUiToolbar.mjs.map +2 -2
  155. package/dist-esm/lib/ui/components/primitives/TldrawUiTooltip.mjs +84 -42
  156. package/dist-esm/lib/ui/components/primitives/TldrawUiTooltip.mjs.map +2 -2
  157. package/dist-esm/lib/ui/components/primitives/menus/TldrawUiMenuItem.mjs +7 -6
  158. package/dist-esm/lib/ui/components/primitives/menus/TldrawUiMenuItem.mjs.map +2 -2
  159. package/dist-esm/lib/ui/context/actions.mjs +23 -10
  160. package/dist-esm/lib/ui/context/actions.mjs.map +2 -2
  161. package/dist-esm/lib/ui/context/components.mjs +2 -0
  162. package/dist-esm/lib/ui/context/components.mjs.map +2 -2
  163. package/dist-esm/lib/ui/context/events.mjs.map +1 -1
  164. package/dist-esm/lib/ui/hooks/useExportAs.mjs +3 -2
  165. package/dist-esm/lib/ui/hooks/useExportAs.mjs.map +2 -2
  166. package/dist-esm/lib/ui/hooks/useTools.mjs +1 -1
  167. package/dist-esm/lib/ui/hooks/useTools.mjs.map +2 -2
  168. package/dist-esm/lib/ui/hooks/useTranslation/defaultTranslation.mjs +4 -2
  169. package/dist-esm/lib/ui/hooks/useTranslation/defaultTranslation.mjs.map +2 -2
  170. package/dist-esm/lib/ui/kbd-utils.mjs +9 -3
  171. package/dist-esm/lib/ui/kbd-utils.mjs.map +2 -2
  172. package/dist-esm/lib/ui/version.mjs +3 -3
  173. package/dist-esm/lib/ui/version.mjs.map +1 -1
  174. package/dist-esm/lib/utils/export/copyAs.mjs +1 -2
  175. package/dist-esm/lib/utils/export/copyAs.mjs.map +2 -2
  176. package/dist-esm/lib/utils/export/export.mjs +0 -20
  177. package/dist-esm/lib/utils/export/export.mjs.map +2 -2
  178. package/dist-esm/lib/utils/export/exportAs.mjs +1 -2
  179. package/dist-esm/lib/utils/export/exportAs.mjs.map +2 -2
  180. package/package.json +11 -34
  181. package/src/index.ts +44 -22
  182. package/src/lib/Tldraw.tsx +15 -2
  183. package/src/lib/defaultExternalContentHandlers.ts +12 -4
  184. package/src/lib/shapes/arrow/ArrowShapeOptions.test.ts +2 -1
  185. package/src/lib/shapes/arrow/ArrowShapeTool.test.ts +6 -5
  186. package/src/lib/shapes/arrow/ArrowShapeUtil.test.ts +48 -6
  187. package/src/lib/shapes/arrow/arrowLabel.ts +8 -0
  188. package/src/lib/shapes/draw/DrawShapeTool.test.ts +0 -5
  189. package/src/lib/shapes/frame/FrameShapeUtil.tsx +9 -0
  190. package/src/lib/shapes/geo/GeoShapeUtil.tsx +1 -0
  191. package/src/lib/shapes/image/ImageShapeUtil.tsx +3 -0
  192. package/src/lib/shapes/line/LineShapeUtil.test.tsx +4 -3
  193. package/src/lib/shapes/line/__snapshots__/LineShapeUtil.test.tsx.snap +2 -2
  194. package/src/lib/shapes/note/NoteShapeUtil.tsx +1 -0
  195. package/src/lib/shapes/shared/PlainTextLabel.tsx +0 -6
  196. package/src/lib/shapes/shared/freehand/svg.ts +2 -0
  197. package/src/lib/shapes/shared/useEditablePlainText.ts +0 -6
  198. package/src/lib/shapes/shared/useImageOrVideoAsset.ts +0 -7
  199. package/src/lib/shapes/text/TextShapeTool.test.ts +6 -5
  200. package/src/lib/tools/EraserTool/childStates/Erasing.ts +34 -1
  201. package/src/lib/tools/EraserTool/childStates/Pointing.ts +20 -0
  202. package/src/lib/ui/TldrawUi.tsx +16 -10
  203. package/src/lib/ui/assetUrls.ts +13 -10
  204. package/src/lib/ui/components/{FollowingIndicator.tsx → DefaultFollowingIndicator.tsx} +2 -1
  205. package/src/lib/ui/components/KeyboardShortcutsDialog/DefaultKeyboardShortcutsDialogContent.tsx +6 -6
  206. package/src/lib/ui/components/StylePanel/DefaultStylePanel.tsx +27 -13
  207. package/src/lib/ui/components/StylePanel/DefaultStylePanelContent.tsx +260 -381
  208. package/src/lib/ui/components/{primitives/TldrawUiButtonPicker.tsx → StylePanel/StylePanelButtonPicker.tsx} +63 -50
  209. package/src/lib/ui/components/StylePanel/StylePanelContext.tsx +63 -0
  210. package/src/lib/ui/components/StylePanel/{DoubleDropdownPicker.tsx → StylePanelDoubleDropdownPicker.tsx} +28 -19
  211. package/src/lib/ui/components/StylePanel/StylePanelDropdownPicker.tsx +119 -0
  212. package/src/lib/ui/components/StylePanel/StylePanelSubheading.tsx +9 -0
  213. package/src/lib/ui/components/Toolbar/AltTextEditor.tsx +4 -3
  214. package/src/lib/ui/components/Toolbar/DefaultImageToolbarContent.tsx +32 -15
  215. package/src/lib/ui/components/Toolbar/DefaultVideoToolbarContent.tsx +12 -4
  216. package/src/lib/ui/components/Toolbar/LinkEditor.tsx +5 -5
  217. package/src/lib/ui/components/primitives/TldrawUiContextualToolbar.tsx +6 -1
  218. package/src/lib/ui/components/primitives/TldrawUiSlider.tsx +52 -32
  219. package/src/lib/ui/components/primitives/TldrawUiToolbar.tsx +3 -0
  220. package/src/lib/ui/components/primitives/TldrawUiTooltip.tsx +94 -30
  221. package/src/lib/ui/components/primitives/menus/TldrawUiMenuItem.tsx +9 -8
  222. package/src/lib/ui/context/actions.tsx +23 -10
  223. package/src/lib/ui/context/components.tsx +3 -0
  224. package/src/lib/ui/context/events.tsx +1 -1
  225. package/src/lib/ui/hooks/useExportAs.ts +3 -2
  226. package/src/lib/ui/hooks/useTools.tsx +1 -1
  227. package/src/lib/ui/hooks/useTranslation/TLUiTranslationKey.ts +2 -0
  228. package/src/lib/ui/hooks/useTranslation/defaultTranslation.ts +4 -2
  229. package/src/lib/ui/kbd-utils.ts +10 -3
  230. package/src/lib/ui/version.ts +3 -3
  231. package/src/lib/ui.css +19 -2
  232. package/src/lib/utils/excalidraw/__snapshots__/putExcalidrawContent.test.tsx.snap +5 -5
  233. package/src/lib/utils/export/copyAs.ts +1 -24
  234. package/src/lib/utils/export/export.ts +0 -36
  235. package/src/lib/utils/export/exportAs.ts +1 -32
  236. package/src/lib/utils/tldr/__snapshots__/buildFromV1Document.test.ts.snap +4 -4
  237. package/src/test/A11y.test.tsx +3 -2
  238. package/src/test/ClickManager.test.ts +7 -6
  239. package/src/test/Editor.test.tsx +20 -19
  240. package/src/test/EraserTool.test.ts +184 -13
  241. package/src/test/HandTool.test.ts +10 -9
  242. package/src/test/HighlightShape.test.ts +2 -1
  243. package/src/test/SelectTool.test.ts +3 -2
  244. package/src/test/TLUserPreferences.test.ts +4 -3
  245. package/src/test/TestEditor.ts +13 -15
  246. package/src/test/TldrawEditor.test.tsx +11 -10
  247. package/src/test/ZoomTool.test.ts +7 -6
  248. package/src/test/__snapshots__/drawing.test.ts.snap +2 -2
  249. package/src/test/__snapshots__/groups.test.tsx.snap +6 -6
  250. package/src/test/__snapshots__/resizing.test.ts.snap +2 -2
  251. package/src/test/arrows-megabus.test.tsx +5 -4
  252. package/src/test/bindings.test.tsx +24 -37
  253. package/src/test/bookmark-shapes.test.ts +1 -8
  254. package/src/test/commands/__snapshots__/getSvgString.test.ts.snap +23 -7
  255. package/src/test/commands/__snapshots__/packShapes.test.ts.snap +8 -8
  256. package/src/test/commands/__snapshots__/zoomToFit.test.ts.snap +2 -2
  257. package/src/test/commands/alignShapes.test.tsx +25 -24
  258. package/src/test/commands/animationSpeed.test.ts +2 -1
  259. package/src/test/commands/centerOnPoint.test.ts +3 -2
  260. package/src/test/commands/clipboard.test.ts +3 -2
  261. package/src/test/commands/createShapes.test.ts +2 -1
  262. package/src/test/commands/deleteShapes.test.ts +2 -1
  263. package/src/test/commands/distributeShapes.test.tsx +11 -10
  264. package/src/test/commands/getSvgString.test.ts +2 -1
  265. package/src/test/commands/packShapes.test.ts +5 -4
  266. package/src/test/commands/resizeShape.test.ts +2 -1
  267. package/src/test/commands/rotateShapes.test.ts +7 -6
  268. package/src/test/commands/setCamera.test.ts +4 -3
  269. package/src/test/commands/setCurrentPage.test.ts +3 -2
  270. package/src/test/commands/stackShapes.test.ts +11 -10
  271. package/src/test/commands/stretch.test.tsx +13 -12
  272. package/src/test/createDeepLink.test.tsx +2 -1
  273. package/src/test/cropping.test.ts +3 -2
  274. package/src/test/custom-clipping.test.ts +436 -0
  275. package/src/test/drawing.test.ts +2 -1
  276. package/src/test/flipShapes.test.ts +4 -3
  277. package/src/test/frames.test.ts +25 -24
  278. package/src/test/getCulledShapes.test.tsx +74 -4
  279. package/src/test/groups.test.tsx +1 -1
  280. package/src/test/handleDeepLink.test.tsx +2 -1
  281. package/src/test/maxShapes.test.ts +3 -2
  282. package/src/test/modifiers.test.ts +5 -4
  283. package/src/test/navigation.test.ts +12 -11
  284. package/src/test/panning.test.ts +2 -1
  285. package/src/test/perf/perf.test.ts +2 -1
  286. package/src/test/registerDeepLinkListener.test.tsx +10 -9
  287. package/src/test/resizing.test.ts +39 -38
  288. package/src/test/select.test.tsx +4 -3
  289. package/src/test/selection-omnibus.test.ts +11 -10
  290. package/src/test/shapeutils.test.ts +4 -3
  291. package/src/test/translating.test.ts +9 -8
  292. package/tldraw.css +35 -5
  293. package/dist-cjs/lib/ui/components/FollowingIndicator.js.map +0 -7
  294. package/dist-cjs/lib/ui/components/StylePanel/DoubleDropdownPicker.js.map +0 -7
  295. package/dist-cjs/lib/ui/components/StylePanel/DropdownPicker.js.map +0 -7
  296. package/dist-cjs/lib/ui/components/primitives/TldrawUiButtonPicker.js.map +0 -7
  297. package/dist-esm/lib/ui/components/FollowingIndicator.mjs.map +0 -7
  298. package/dist-esm/lib/ui/components/StylePanel/DoubleDropdownPicker.mjs.map +0 -7
  299. package/dist-esm/lib/ui/components/StylePanel/DropdownPicker.mjs.map +0 -7
  300. package/dist-esm/lib/ui/components/primitives/TldrawUiButtonPicker.mjs.map +0 -7
  301. package/src/lib/ui/components/StylePanel/DropdownPicker.tsx +0 -110
@@ -68,7 +68,6 @@ import { TLClickEventInfo } from '@tldraw/editor';
68
68
  import { TLContent } from '@tldraw/editor';
69
69
  import { TLCropInfo } from '@tldraw/editor';
70
70
  import { TLDefaultColorStyle } from '@tldraw/editor';
71
- import { TLDefaultColorTheme } from '@tldraw/editor';
72
71
  import { TLDefaultColorThemeColor } from '@tldraw/editor';
73
72
  import { TLDefaultDashStyle } from '@tldraw/editor';
74
73
  import { TLDefaultFillStyle } from '@tldraw/editor';
@@ -193,9 +192,6 @@ export declare class ArrowBindingUtil extends BindingUtil<TLArrowBinding> {
193
192
  /** @public @react */
194
193
  export declare function ArrowDownToolbarItem(): JSX_2.Element;
195
194
 
196
- /** @public @react */
197
- export declare function ArrowheadStylePickerSet({ styles }: StylePickerSetProps): JSX_2.Element | null;
198
-
199
195
  /** @public @react */
200
196
  export declare function ArrowLeftToolbarItem(): JSX_2.Element;
201
197
 
@@ -500,9 +496,6 @@ export declare function CloudToolbarItem(): JSX_2.Element;
500
496
  /** @public @react */
501
497
  export declare function ColorSchemeMenu(): JSX_2.Element;
502
498
 
503
- /** @public @react */
504
- export declare function CommonStylePickerSet({ styles, theme }: ThemeStylePickerSetProps): JSX_2.Element;
505
-
506
499
  /**
507
500
  * Contains the size within the given box size
508
501
  *
@@ -534,14 +527,6 @@ export declare function ConvertToEmbedMenuItem(): JSX_2.Element | null;
534
527
  */
535
528
  export declare function copyAs(editor: Editor, ids: TLShapeId[], opts: CopyAsOptions): Promise<void>;
536
529
 
537
- /**
538
- * @deprecated The format parameter is now part of the opts object.
539
- * @public
540
- */
541
- export declare function copyAs(editor: Editor, ids: TLShapeId[], format: TLCopyType, opts?: TLImageExportOptions & {
542
- format?: undefined;
543
- }): Promise<void>;
544
-
545
530
  /** @public @react */
546
531
  export declare function CopyAsMenuGroup(): JSX_2.Element;
547
532
 
@@ -853,6 +838,9 @@ export declare let defaultEditorAssetUrls: TLEditorAssetUrls;
853
838
  /** @public */
854
839
  export declare type DefaultEmbedDefinitionType = (typeof DEFAULT_EMBED_DEFINITIONS)[number]['type'];
855
840
 
841
+ /** @public @react */
842
+ export declare function DefaultFollowingIndicator(): JSX_2.Element | null;
843
+
856
844
  /** @public */
857
845
  export declare const DefaultFontFaces: TLDefaultFonts;
858
846
 
@@ -996,7 +984,7 @@ export declare function DefaultSharePanel(): JSX_2.Element;
996
984
  export declare const DefaultStylePanel: NamedExoticComponent<TLUiStylePanelProps>;
997
985
 
998
986
  /** @public @react */
999
- export declare function DefaultStylePanelContent({ styles }: TLUiStylePanelContentProps): JSX_2.Element | null;
987
+ export declare function DefaultStylePanelContent(): JSX_2.Element;
1000
988
 
1001
989
  /** @public @react */
1002
990
  export declare const DefaultToasts: NamedExoticComponent<object>;
@@ -1489,12 +1477,6 @@ export declare interface ExampleDialogProps {
1489
1477
  */
1490
1478
  export declare function exportAs(editor: Editor, ids: TLShapeId[], opts: ExportAsOptions): Promise<void>;
1491
1479
 
1492
- /**
1493
- * @deprecated The format & name parameters are now part of the opts object.
1494
- * @public
1495
- */
1496
- export declare function exportAs(editor: Editor, ids: TLShapeId[], format?: TLExportType, name?: string, opts?: TLImageExportOptions): Promise<void>;
1497
-
1498
1480
  /** @public */
1499
1481
  export declare interface ExportAsOptions extends TLImageExportOptions {
1500
1482
  /** {@inheritdoc @tldraw/editor#TLImageExportOptions.format} */
@@ -1506,23 +1488,6 @@ export declare interface ExportAsOptions extends TLImageExportOptions {
1506
1488
  /** @public @react */
1507
1489
  export declare function ExportFileContentSubMenu(): JSX_2.Element;
1508
1490
 
1509
- /**
1510
- * Export the given shapes as a blob.
1511
- * @param editor - The editor instance.
1512
- * @param ids - The ids of the shapes to export.
1513
- * @param format - The format to export as.
1514
- * @param opts - Rendering options.
1515
- * @returns A promise that resolves to a blob.
1516
- * @deprecated Use {@link @tldraw/editor#Editor.toImage} instead.
1517
- * @public
1518
- */
1519
- export declare function exportToBlob({ editor, ids, format, opts, }: {
1520
- editor: Editor;
1521
- format: TLExportType;
1522
- ids: TLShapeId[];
1523
- opts?: TLImageExportOptions;
1524
- }): Promise<Blob>;
1525
-
1526
1491
  /** @public @react */
1527
1492
  export declare function ExtrasGroup(): JSX_2.Element;
1528
1493
 
@@ -1579,6 +1544,7 @@ export declare class FrameShapeUtil extends BaseBoxShapeUtil<TLFrameShape> {
1579
1544
  canEdit(): boolean;
1580
1545
  canResize(): boolean;
1581
1546
  canResizeChildren(): boolean;
1547
+ isExportBoundsContainer(): boolean;
1582
1548
  getDefaultProps(): TLFrameShape['props'];
1583
1549
  getAriaDescriptor(shape: TLFrameShape): string;
1584
1550
  getGeometry(shape: TLFrameShape): Geometry2d;
@@ -1587,6 +1553,7 @@ export declare class FrameShapeUtil extends BaseBoxShapeUtil<TLFrameShape> {
1587
1553
  toSvg(shape: TLFrameShape, ctx: SvgExportContext): JSX_2.Element;
1588
1554
  indicator(shape: TLFrameShape): JSX_2.Element;
1589
1555
  providesBackgroundForChildren(): boolean;
1556
+ getClipPath(shape: TLFrameShape): Vec[];
1590
1557
  canReceiveNewChildrenOfType(shape: TLShape): boolean;
1591
1558
  onResize(shape: any, info: TLResizeInfo<any>): any;
1592
1559
  getInterpolatedProps(startShape: TLFrameShape, endShape: TLFrameShape, t: number): TLFrameShapeProps;
@@ -1735,9 +1702,6 @@ export declare class GeoShapeUtil extends BaseBoxShapeUtil<TLGeoShape> {
1735
1702
  getInterpolatedProps(startShape: TLGeoShape, endShape: TLGeoShape, t: number): TLGeoShapeProps;
1736
1703
  }
1737
1704
 
1738
- /** @public @react */
1739
- export declare function GeoStylePickerSet({ styles }: StylePickerSetProps): JSX_2.Element | null;
1740
-
1741
1705
  /** @public */
1742
1706
  export declare function getArrowBindings(editor: Editor, shape: TLArrowShape): TLArrowBindings;
1743
1707
 
@@ -1780,6 +1744,29 @@ export declare function getHitShapeOnCanvasPointerDown(editor: Editor, hitLabels
1780
1744
  /** @public */
1781
1745
  export declare function getMediaAssetInfoPartial(file: File, assetId: TLAssetId, isImageType: boolean, isVideoType: boolean, maxImageDimension?: number): Promise<TLImageAsset | TLVideoAsset>;
1782
1746
 
1747
+ /**
1748
+ * ## getStrokePoints
1749
+ *
1750
+ * Get an array of points as objects with an adjusted point, pressure, vector, distance, and
1751
+ * runningLength.
1752
+ *
1753
+ * @param points - An array of points (as `[x, y, pressure]` or `{x, y, pressure}`). Pressure is
1754
+ * optional in both cases.
1755
+ * @param options - An object with options.
1756
+ * @public
1757
+ */
1758
+ export declare function getStrokePoints(rawInputPoints: VecLike[], options?: StrokeOptions): StrokePoint[];
1759
+
1760
+ /**
1761
+ * Turn an array of stroke points into a path of quadradic curves.
1762
+ *
1763
+ * @param points - The stroke points returned from perfect-freehand
1764
+ * @param closed - Whether the shape is closed
1765
+ *
1766
+ * @public
1767
+ */
1768
+ export declare function getSvgPathFromStrokePoints(points: StrokePoint[], closed?: boolean): string;
1769
+
1783
1770
  /**
1784
1771
  * Original (uncropped) width and height of shape.
1785
1772
  *
@@ -1875,6 +1862,7 @@ export declare class ImageShapeUtil extends BaseBoxShapeUtil<TLImageShape> {
1875
1862
  static migrations: TLPropsMigrations;
1876
1863
  isAspectRatioLocked(): boolean;
1877
1864
  canCrop(): boolean;
1865
+ isExportBoundsContainer(): boolean;
1878
1866
  getDefaultProps(): TLImageShape['props'];
1879
1867
  getGeometry(shape: TLImageShape): Geometry2d;
1880
1868
  getAriaDescriptor(shape: TLImageShape): string;
@@ -2125,6 +2113,16 @@ export declare class NoteShapeUtil extends ShapeUtil<TLNoteShape> {
2125
2113
  /** @public @react */
2126
2114
  export declare function NoteToolbarItem(): JSX_2.Element;
2127
2115
 
2116
+ /**
2117
+ * Checks if a file is allowed to be uploaded. If it is not, it will show a toast explaining why to the user.
2118
+ *
2119
+ * @param file - The file to check
2120
+ * @param options - The options for the external content handler
2121
+ * @returns True if the file is allowed, false otherwise
2122
+ * @public
2123
+ */
2124
+ export declare function notifyIfFileNotAllowed(file: File, options: TLDefaultExternalContentHandlerOpts): boolean;
2125
+
2128
2126
  /** @public @react */
2129
2127
  export declare function OfflineIndicator(): JSX_2.Element;
2130
2128
 
@@ -2151,9 +2149,6 @@ export declare interface OnDragFromToolbarToCreateShapesOpts {
2151
2149
  onDragEnd?(id: TLShapeId): void;
2152
2150
  }
2153
2151
 
2154
- /** @public @react */
2155
- export declare function OpacitySlider(): JSX_2.Element | null;
2156
-
2157
2152
  /** @public @react */
2158
2153
  export declare function OvalToolbarItem(): JSX_2.Element;
2159
2154
 
@@ -2545,9 +2540,6 @@ export declare interface SolidPathBuilderOpts extends BasePathBuilderOpts {
2545
2540
 
2546
2541
  /* Excluded from this release type: Spinner */
2547
2542
 
2548
- /** @public @react */
2549
- export declare function SplineStylePickerSet({ styles }: StylePickerSetProps): JSX_2.Element | null;
2550
-
2551
2543
  /** @public @react */
2552
2544
  export declare function StackMenuItems(): JSX_2.Element;
2553
2545
 
@@ -2557,11 +2549,172 @@ export declare function StarToolbarItem(): JSX_2.Element;
2557
2549
  /** @public */
2558
2550
  export declare const STROKE_SIZES: Record<TLDefaultSizeStyle, number>;
2559
2551
 
2552
+ /**
2553
+ * The options object for `getStroke` or `getStrokePoints`.
2554
+ *
2555
+ * @public
2556
+ */
2557
+ export declare interface StrokeOptions {
2558
+ /** The base size (diameter) of the stroke. */
2559
+ size?: number;
2560
+ /** The effect of pressure on the stroke's size. */
2561
+ thinning?: number;
2562
+ /** How much to soften the stroke's edges. */
2563
+ smoothing?: number;
2564
+ streamline?: number;
2565
+ /** An easing function to apply to each point's pressure. */
2566
+ easing?(pressure: number): number;
2567
+ /** Whether to simulate pressure based on velocity. */
2568
+ simulatePressure?: boolean;
2569
+ /** Cap, taper and easing for the start of the line. */
2570
+ start?: {
2571
+ cap?: boolean;
2572
+ easing?(distance: number): number;
2573
+ taper?: boolean | number;
2574
+ };
2575
+ /** Cap, taper and easing for the end of the line. */
2576
+ end?: {
2577
+ cap?: boolean;
2578
+ easing?(distance: number): number;
2579
+ taper?: boolean | number;
2580
+ };
2581
+ /** Whether to handle the points as a completed stroke. */
2582
+ last?: boolean;
2583
+ }
2584
+
2585
+ /**
2586
+ * The points returned by `getStrokePoints`, and the input for `getStrokeOutlinePoints`
2587
+ *
2588
+ * @public
2589
+ */
2590
+ export declare interface StrokePoint {
2591
+ point: Vec;
2592
+ input: Vec;
2593
+ vector: Vec;
2594
+ pressure: number;
2595
+ distance: number;
2596
+ runningLength: number;
2597
+ radius: number;
2598
+ }
2599
+
2600
+ /** @public @react */
2601
+ export declare function StylePanelArrowheadPicker(): JSX_2.Element | null;
2602
+
2603
+ /** @public @react */
2604
+ export declare function StylePanelArrowKindPicker(): JSX_2.Element | null;
2605
+
2560
2606
  /** @public */
2561
- export declare interface StylePickerSetProps {
2607
+ export declare const StylePanelButtonPicker: <T extends string>(props: StylePanelButtonPickerProps<T>) => ReactElement;
2608
+
2609
+ /** @public */
2610
+ export declare interface StylePanelButtonPickerProps<T extends string> {
2611
+ title: string;
2612
+ uiType: string;
2613
+ style: StyleProp<T>;
2614
+ value: SharedStyle<T>;
2615
+ items: StyleValuesForUi<T>;
2616
+ onValueChange?(style: StyleProp<T>, value: T): void;
2617
+ onHistoryMark?(id: string): void;
2618
+ }
2619
+
2620
+ /** @public @react */
2621
+ export declare function StylePanelColorPicker(): JSX_2.Element | null;
2622
+
2623
+ /** @public */
2624
+ export declare interface StylePanelContext {
2562
2625
  styles: ReadonlySharedStyleMap;
2626
+ showUiLabels: boolean;
2627
+ onHistoryMark(id: string): void;
2628
+ onValueChange<T>(style: StyleProp<T>, value: T): void;
2629
+ }
2630
+
2631
+ /** @public @react */
2632
+ export declare function StylePanelContextProvider({ children, styles }: StylePanelContextProviderProps): JSX_2.Element;
2633
+
2634
+ /** @public */
2635
+ export declare interface StylePanelContextProviderProps {
2636
+ children: React.ReactNode;
2637
+ styles: ReadonlySharedStyleMap;
2638
+ }
2639
+
2640
+ /** @public @react */
2641
+ export declare function StylePanelDashPicker(): JSX_2.Element | null;
2642
+
2643
+ /** @public @react */
2644
+ export declare const StylePanelDoubleDropdownPicker: <T extends string>(props: StylePanelDoubleDropdownPickerProps<T>) => React_2.JSX.Element;
2645
+
2646
+ /** @public */
2647
+ export declare interface StylePanelDoubleDropdownPickerProps<T extends string> {
2648
+ uiTypeA: string;
2649
+ uiTypeB: string;
2650
+ label: Exclude<string, TLUiTranslationKey> | TLUiTranslationKey;
2651
+ labelA: Exclude<string, TLUiTranslationKey> | TLUiTranslationKey;
2652
+ labelB: Exclude<string, TLUiTranslationKey> | TLUiTranslationKey;
2653
+ itemsA: StyleValuesForUi<T>;
2654
+ itemsB: StyleValuesForUi<T>;
2655
+ styleA: StyleProp<T>;
2656
+ styleB: StyleProp<T>;
2657
+ valueA: SharedStyle<T>;
2658
+ valueB: SharedStyle<T>;
2659
+ onValueChange?(style: StyleProp<T>, value: T): void;
2660
+ }
2661
+
2662
+ /** @public @react */
2663
+ export declare const StylePanelDropdownPicker: <T extends string>(props: StylePanelDropdownPickerProps<T>) => React_2.JSX.Element;
2664
+
2665
+ /** @public */
2666
+ export declare interface StylePanelDropdownPickerProps<T extends string> {
2667
+ id: string;
2668
+ label?: Exclude<string, TLUiTranslationKey> | TLUiTranslationKey;
2669
+ uiType: string;
2670
+ stylePanelType: string;
2671
+ style: StyleProp<T>;
2672
+ value: SharedStyle<T>;
2673
+ items: StyleValuesForUi<T>;
2674
+ type: 'icon' | 'menu' | 'tool';
2675
+ onValueChange?(style: StyleProp<T>, value: T): void;
2676
+ }
2677
+
2678
+ /** @public @react */
2679
+ export declare function StylePanelFillPicker(): JSX_2.Element | null;
2680
+
2681
+ /** @public @react */
2682
+ export declare function StylePanelFontPicker(): JSX_2.Element | null;
2683
+
2684
+ /** @public @react */
2685
+ export declare function StylePanelGeoShapePicker(): JSX_2.Element | null;
2686
+
2687
+ /** @public @react */
2688
+ export declare function StylePanelLabelAlignPicker(): JSX_2.Element | null;
2689
+
2690
+ /** @public @react */
2691
+ export declare function StylePanelOpacityPicker(): JSX_2.Element | null;
2692
+
2693
+ /** @public @react */
2694
+ export declare function StylePanelSection({ children }: StylePanelSectionProps): JSX_2.Element;
2695
+
2696
+ /** @public */
2697
+ export declare interface StylePanelSectionProps {
2698
+ children: React_3.ReactNode;
2699
+ }
2700
+
2701
+ /** @public @react */
2702
+ export declare function StylePanelSizePicker(): JSX_2.Element | null;
2703
+
2704
+ /** @public @react */
2705
+ export declare function StylePanelSplinePicker(): JSX_2.Element | null;
2706
+
2707
+ /** @public @react */
2708
+ export declare function StylePanelSubheading({ children }: StylePanelSubheadingProps): JSX_2.Element;
2709
+
2710
+ /** @public */
2711
+ export declare interface StylePanelSubheadingProps {
2712
+ children: React.ReactNode;
2563
2713
  }
2564
2714
 
2715
+ /** @public @react */
2716
+ export declare function StylePanelTextAlignPicker(): JSX_2.Element | null;
2717
+
2565
2718
  /** @public */
2566
2719
  export declare type StyleValuesForUi<T> = readonly {
2567
2720
  readonly icon: string | TLUiIconJsx;
@@ -2601,12 +2754,6 @@ export declare interface TextAreaProps {
2601
2754
  */
2602
2755
  export declare const TextDirection: Extension<any, any>;
2603
2756
 
2604
- /**
2605
- * @deprecated Use `PlainTextLabel` instead.
2606
- * @public
2607
- */
2608
- export declare const TextLabel: React_3.NamedExoticComponent<PlainTextLabelProps>;
2609
-
2610
2757
  /** @public */
2611
2758
  export declare interface TextShapeOptions {
2612
2759
  /** How much addition padding should be added to the horizontal geometry of the shape when binding to an arrow? */
@@ -2684,18 +2831,9 @@ export declare class TextShapeUtil extends ShapeUtil<TLTextShape> {
2684
2831
  } | undefined;
2685
2832
  }
2686
2833
 
2687
- /** @public @react */
2688
- export declare function TextStylePickerSet({ theme, styles }: ThemeStylePickerSetProps): JSX_2.Element | null;
2689
-
2690
2834
  /** @public @react */
2691
2835
  export declare function TextToolbarItem(): JSX_2.Element;
2692
2836
 
2693
- /** @public */
2694
- export declare interface ThemeStylePickerSetProps {
2695
- styles: ReadonlySharedStyleMap;
2696
- theme: TLDefaultColorTheme;
2697
- }
2698
-
2699
2837
  /**
2700
2838
  * Default extensions for the TipTap editor.
2701
2839
  *
@@ -2952,9 +3090,6 @@ export declare function TldrawUiButtonIcon({ icon, small, invertIcon }: TLUiButt
2952
3090
  /** @public @react */
2953
3091
  export declare function TldrawUiButtonLabel({ children }: TLUiButtonLabelProps): JSX_2.Element;
2954
3092
 
2955
- /** @public */
2956
- export declare const TldrawUiButtonPicker: <T extends string>(props: TLUiButtonPickerProps<T>) => ReactElement;
2957
-
2958
3093
  /**
2959
3094
  * A column, usually of UI controls like buttons, select dropdown, checkboxes, etc.
2960
3095
  *
@@ -3034,6 +3169,9 @@ export declare const TldrawUiGrid: ForwardRefExoticComponent<TLUiLayoutProps & R
3034
3169
  /** @public @react */
3035
3170
  export declare const TldrawUiIcon: NamedExoticComponent<TLUiIconProps>;
3036
3171
 
3172
+ /** @public @react */
3173
+ export declare function TldrawUiInFrontOfTheCanvas(): JSX_2.Element;
3174
+
3037
3175
  /** @public @react */
3038
3176
  export declare const TldrawUiInput: React_2.ForwardRefExoticComponent<TLUiInputProps & React_2.RefAttributes<HTMLInputElement>>;
3039
3177
 
@@ -3131,7 +3269,7 @@ export declare const TldrawUiToolbar: React_3.ForwardRefExoticComponent<TLUiTool
3131
3269
  export declare const TldrawUiToolbarButton: React_3.ForwardRefExoticComponent<TLUiToolbarButtonProps & React_3.RefAttributes<HTMLButtonElement>>;
3132
3270
 
3133
3271
  /** @public @react */
3134
- export declare const TldrawUiToolbarToggleGroup: ({ children, className, type, ...props }: TLUiToolbarToggleGroupProps) => JSX_2.Element;
3272
+ export declare const TldrawUiToolbarToggleGroup: ({ children, className, type, asChild, ...props }: TLUiToolbarToggleGroupProps) => JSX_2.Element;
3135
3273
 
3136
3274
  /** @public @react */
3137
3275
  export declare const TldrawUiToolbarToggleItem: ({ children, className, type, value, tooltip, ...props }: TLUiToolbarToggleItemProps) => JSX_2.Element;
@@ -3146,6 +3284,8 @@ export declare interface TldrawUiTooltipProps {
3146
3284
  side?: 'bottom' | 'left' | 'right' | 'top';
3147
3285
  sideOffset?: number;
3148
3286
  disabled?: boolean;
3287
+ showOnMobile?: boolean;
3288
+ delayDuration?: number;
3149
3289
  }
3150
3290
 
3151
3291
  /** @public @react */
@@ -3316,18 +3456,6 @@ export declare interface TLUiButtonLabelProps {
3316
3456
  children?: ReactNode;
3317
3457
  }
3318
3458
 
3319
- /** @public */
3320
- export declare interface TLUiButtonPickerProps<T extends string> {
3321
- title: string;
3322
- uiType: string;
3323
- style: StyleProp<T>;
3324
- value: SharedStyle<T>;
3325
- items: StyleValuesForUi<T>;
3326
- theme: TLDefaultColorTheme;
3327
- onValueChange(style: StyleProp<T>, value: T): void;
3328
- onHistoryMark?(id: string): void;
3329
- }
3330
-
3331
3459
  /** @public */
3332
3460
  export declare interface TLUiButtonProps extends React_2.HTMLAttributes<HTMLButtonElement> {
3333
3461
  disabled?: boolean;
@@ -3362,6 +3490,7 @@ export declare interface TLUiComponents {
3362
3490
  Dialogs?: ComponentType | null;
3363
3491
  Toasts?: ComponentType | null;
3364
3492
  A11y?: ComponentType | null;
3493
+ FollowingIndicator?: ComponentType | null;
3365
3494
  }
3366
3495
 
3367
3496
  /** @public */
@@ -3687,7 +3816,7 @@ export declare interface TLUiEventMap {
3687
3816
  'flatten-to-image': null;
3688
3817
  'a11y-repeat-shape-announce': null;
3689
3818
  'open-url': {
3690
- url: string;
3819
+ destinationUrl: string;
3691
3820
  };
3692
3821
  'open-context-menu': null;
3693
3822
  'adjust-shape-styles': null;
@@ -3962,19 +4091,15 @@ export declare interface TLUiSliderProps {
3962
4091
  label: string;
3963
4092
  title: string;
3964
4093
  onValueChange(value: number): void;
3965
- onHistoryMark(id: string): void;
4094
+ onHistoryMark?(id: string): void;
3966
4095
  'data-testid'?: string;
3967
4096
  ariaValueModifier?: number;
3968
4097
  }
3969
4098
 
3970
- /** @public */
3971
- export declare interface TLUiStylePanelContentProps {
3972
- styles: ReturnType<typeof useRelevantStyles>;
3973
- }
3974
-
3975
4099
  /** @public */
3976
4100
  export declare interface TLUiStylePanelProps {
3977
4101
  isMobile?: boolean;
4102
+ styles?: null | ReadonlySharedStyleMap;
3978
4103
  children?: ReactNode;
3979
4104
  }
3980
4105
 
@@ -4043,6 +4168,7 @@ export declare interface TLUiToolbarToggleGroupProps extends React_3.HTMLAttribu
4043
4168
  value: any;
4044
4169
  defaultValue?: any;
4045
4170
  type: 'multiple' | 'single';
4171
+ asChild?: boolean;
4046
4172
  }
4047
4173
 
4048
4174
  /** @public */
@@ -4097,7 +4223,7 @@ export declare interface TLUiTranslation {
4097
4223
  export declare type TLUiTranslationContextType = TLUiTranslation;
4098
4224
 
4099
4225
  /** @public */
4100
- export declare type TLUiTranslationKey = 'a11y.adjust-shape-styles' | 'a11y.enlarge-shape' | 'a11y.enter-leave-container' | 'a11y.move-shape-faster' | 'a11y.move-shape' | 'a11y.multiple-shapes' | 'a11y.open-context-menu' | 'a11y.open-keyboard-shortcuts' | 'a11y.pan-camera' | 'a11y.repeat-shape' | 'a11y.rotate-shape-ccw-fine' | 'a11y.rotate-shape-ccw' | 'a11y.rotate-shape-cw-fine' | 'a11y.rotate-shape-cw' | 'a11y.select-shape-direction' | 'a11y.select-shape' | 'a11y.shape-image' | 'a11y.shape-index' | 'a11y.shape-video' | 'a11y.shrink-shape' | 'a11y.skip-to-main-content' | 'a11y.status' | 'action.align-bottom' | 'action.align-center-horizontal.short' | 'action.align-center-horizontal' | 'action.align-center-vertical.short' | 'action.align-center-vertical' | 'action.align-left' | 'action.align-right' | 'action.align-top' | 'action.back-to-content' | 'action.bring-forward' | 'action.bring-to-front' | 'action.convert-to-bookmark' | 'action.convert-to-embed' | 'action.copy-as-png.short' | 'action.copy-as-png' | 'action.copy-as-svg.short' | 'action.copy-as-svg' | 'action.copy' | 'action.cut' | 'action.delete' | 'action.distribute-horizontal.short' | 'action.distribute-horizontal' | 'action.distribute-vertical.short' | 'action.distribute-vertical' | 'action.download-original' | 'action.duplicate' | 'action.edit-link' | 'action.exit-pen-mode' | 'action.export-all-as-png.short' | 'action.export-all-as-png' | 'action.export-all-as-svg.short' | 'action.export-all-as-svg' | 'action.export-as-png.short' | 'action.export-as-png' | 'action.export-as-svg.short' | 'action.export-as-svg' | 'action.fit-frame-to-content' | 'action.flatten-to-image' | 'action.flip-horizontal.short' | 'action.flip-horizontal' | 'action.flip-vertical.short' | 'action.flip-vertical' | 'action.fork-project-on-tldraw' | 'action.fork-project' | 'action.group' | 'action.insert-embed' | 'action.insert-media' | 'action.leave-shared-project' | 'action.new-project' | 'action.new-shared-project' | 'action.open-cursor-chat' | 'action.open-embed-link' | 'action.open-file' | 'action.open-kbd-shortcuts' | 'action.pack' | 'action.paste-error-description' | 'action.paste-error-title' | 'action.paste' | 'action.print' | 'action.redo' | 'action.remove-frame' | 'action.rename' | 'action.rotate-ccw' | 'action.rotate-cw' | 'action.save-copy' | 'action.select-all' | 'action.select-none' | 'action.send-backward' | 'action.send-to-back' | 'action.share-project' | 'action.stack-horizontal.short' | 'action.stack-horizontal' | 'action.stack-vertical.short' | 'action.stack-vertical' | 'action.stop-following' | 'action.stretch-horizontal.short' | 'action.stretch-horizontal' | 'action.stretch-vertical.short' | 'action.stretch-vertical' | 'action.toggle-auto-size' | 'action.toggle-dark-mode.menu' | 'action.toggle-dark-mode' | 'action.toggle-debug-mode.menu' | 'action.toggle-debug-mode' | 'action.toggle-dynamic-size-mode.menu' | 'action.toggle-dynamic-size-mode' | 'action.toggle-edge-scrolling.menu' | 'action.toggle-edge-scrolling' | 'action.toggle-focus-mode.menu' | 'action.toggle-focus-mode' | 'action.toggle-grid.menu' | 'action.toggle-grid' | 'action.toggle-keyboard-shortcuts.menu' | 'action.toggle-keyboard-shortcuts' | 'action.toggle-lock' | 'action.toggle-paste-at-cursor.menu' | 'action.toggle-paste-at-cursor' | 'action.toggle-reduce-motion.menu' | 'action.toggle-reduce-motion' | 'action.toggle-snap-mode.menu' | 'action.toggle-snap-mode' | 'action.toggle-tool-lock.menu' | 'action.toggle-tool-lock' | 'action.toggle-transparent.context-menu' | 'action.toggle-transparent.menu' | 'action.toggle-transparent' | 'action.toggle-ui-labels.menu' | 'action.toggle-ui-labels' | 'action.toggle-wrap-mode.menu' | 'action.toggle-wrap-mode' | 'action.undo' | 'action.ungroup' | 'action.unlock-all' | 'action.zoom-in' | 'action.zoom-out' | 'action.zoom-to-100' | 'action.zoom-to-fit' | 'action.zoom-to-selection' | 'actions-menu.title' | 'align-style.end' | 'align-style.justify' | 'align-style.middle' | 'align-style.start' | 'app.loading' | 'arrow-kind-style.arc' | 'arrow-kind-style.elbow' | 'arrowheadEnd-style.arrow' | 'arrowheadEnd-style.bar' | 'arrowheadEnd-style.diamond' | 'arrowheadEnd-style.dot' | 'arrowheadEnd-style.inverted' | 'arrowheadEnd-style.none' | 'arrowheadEnd-style.pipe' | 'arrowheadEnd-style.square' | 'arrowheadEnd-style.triangle' | 'arrowheadStart-style.arrow' | 'arrowheadStart-style.bar' | 'arrowheadStart-style.diamond' | 'arrowheadStart-style.dot' | 'arrowheadStart-style.inverted' | 'arrowheadStart-style.none' | 'arrowheadStart-style.pipe' | 'arrowheadStart-style.square' | 'arrowheadStart-style.triangle' | 'assets.files.amount-too-many' | 'assets.files.size-too-big' | 'assets.files.type-not-allowed' | 'assets.files.upload-failed' | 'assets.url.failed' | 'color-style.black' | 'color-style.blue' | 'color-style.green' | 'color-style.grey' | 'color-style.light-blue' | 'color-style.light-green' | 'color-style.light-red' | 'color-style.light-violet' | 'color-style.orange' | 'color-style.red' | 'color-style.violet' | 'color-style.white' | 'color-style.yellow' | 'context-menu.arrange' | 'context-menu.copy-as' | 'context-menu.edit' | 'context-menu.export-all-as' | 'context-menu.export-as' | 'context-menu.move-to-page' | 'context-menu.reorder' | 'context-menu.title' | 'context.pages.new-page' | 'cursor-chat.type-to-chat' | 'dash-style.dashed' | 'dash-style.dotted' | 'dash-style.draw' | 'dash-style.solid' | 'document-name-menu.copy-link' | 'document.default-name' | 'edit-link-dialog.cancel' | 'edit-link-dialog.clear' | 'edit-link-dialog.detail' | 'edit-link-dialog.external-link' | 'edit-link-dialog.invalid-url' | 'edit-link-dialog.save' | 'edit-link-dialog.title' | 'edit-link-dialog.url' | 'embed-dialog.back' | 'embed-dialog.cancel' | 'embed-dialog.create' | 'embed-dialog.instruction' | 'embed-dialog.invalid-url' | 'embed-dialog.title' | 'embed-dialog.url' | 'file-system.confirm-clear.cancel' | 'file-system.confirm-clear.continue' | 'file-system.confirm-clear.description' | 'file-system.confirm-clear.dont-show-again' | 'file-system.confirm-clear.title' | 'file-system.confirm-open.cancel' | 'file-system.confirm-open.description' | 'file-system.confirm-open.dont-show-again' | 'file-system.confirm-open.open' | 'file-system.confirm-open.title' | 'file-system.file-open-error.file-format-version-too-new' | 'file-system.file-open-error.generic-corrupted-file' | 'file-system.file-open-error.not-a-tldraw-file' | 'file-system.file-open-error.title' | 'file-system.shared-document-file-open-error.description' | 'file-system.shared-document-file-open-error.title' | 'fill-style.fill' | 'fill-style.none' | 'fill-style.pattern' | 'fill-style.semi' | 'fill-style.solid' | 'focus-mode.toggle-focus-mode' | 'font-style.draw' | 'font-style.mono' | 'font-style.sans' | 'font-style.serif' | 'geo-style.arrow-down' | 'geo-style.arrow-left' | 'geo-style.arrow-right' | 'geo-style.arrow-up' | 'geo-style.check-box' | 'geo-style.cloud' | 'geo-style.diamond' | 'geo-style.ellipse' | 'geo-style.heart' | 'geo-style.hexagon' | 'geo-style.octagon' | 'geo-style.oval' | 'geo-style.pentagon' | 'geo-style.rectangle' | 'geo-style.rhombus' | 'geo-style.star' | 'geo-style.trapezoid' | 'geo-style.triangle' | 'geo-style.x-box' | 'handle.crop.bottom-left' | 'handle.crop.bottom-right' | 'handle.crop.bottom' | 'handle.crop.left' | 'handle.crop.right' | 'handle.crop.top-left' | 'handle.crop.top-right' | 'handle.crop.top' | 'handle.resize-bottom-left' | 'handle.resize-bottom-right' | 'handle.resize-bottom' | 'handle.resize-left' | 'handle.resize-right' | 'handle.resize-top-left' | 'handle.resize-top-right' | 'handle.resize-top' | 'handle.rotate.bottom_left_rotate' | 'handle.rotate.bottom_right_rotate' | 'handle.rotate.mobile_rotate' | 'handle.rotate.top_left_rotate' | 'handle.rotate.top_right_rotate' | 'help-menu.about' | 'help-menu.discord' | 'help-menu.github' | 'help-menu.import-tldr-file' | 'help-menu.keyboard-shortcuts' | 'help-menu.privacy' | 'help-menu.terms' | 'help-menu.title' | 'help-menu.twitter' | 'menu.accessibility' | 'menu.copy-as' | 'menu.edit' | 'menu.export-as' | 'menu.file' | 'menu.language' | 'menu.preferences' | 'menu.theme' | 'menu.title' | 'menu.view' | 'navigation-zone.minimap' | 'navigation-zone.title' | 'navigation-zone.toggle-minimap' | 'navigation-zone.zoom' | 'opacity-style.0.1' | 'opacity-style.0.25' | 'opacity-style.0.5' | 'opacity-style.0.75' | 'opacity-style.1' | 'page-menu.create-new-page' | 'page-menu.edit-done' | 'page-menu.edit-start' | 'page-menu.go-to-page' | 'page-menu.max-page-count-reached' | 'page-menu.new-page-initial-name' | 'page-menu.submenu.delete' | 'page-menu.submenu.duplicate-page' | 'page-menu.submenu.move-down' | 'page-menu.submenu.move-up' | 'page-menu.submenu.rename' | 'page-menu.submenu.title' | 'page-menu.title' | 'people-menu.anonymous-user' | 'people-menu.avatar-color' | 'people-menu.change-color' | 'people-menu.change-name' | 'people-menu.follow' | 'people-menu.following' | 'people-menu.invite' | 'people-menu.leading' | 'people-menu.title' | 'people-menu.user' | 'share-menu.copied' | 'share-menu.copy-link-note' | 'share-menu.copy-link' | 'share-menu.copy-readonly-link-note' | 'share-menu.copy-readonly-link' | 'share-menu.create-snapshot-link' | 'share-menu.creating-project' | 'share-menu.fork-note' | 'share-menu.offline-note' | 'share-menu.project-too-large' | 'share-menu.save-note' | 'share-menu.share-project' | 'share-menu.snapshot-link-note' | 'share-menu.title' | 'share-menu.upload-failed' | 'sharing.confirm-leave.cancel' | 'sharing.confirm-leave.description' | 'sharing.confirm-leave.dont-show-again' | 'sharing.confirm-leave.leave' | 'sharing.confirm-leave.title' | 'shortcuts-dialog.a11y' | 'shortcuts-dialog.collaboration' | 'shortcuts-dialog.edit' | 'shortcuts-dialog.file' | 'shortcuts-dialog.preferences' | 'shortcuts-dialog.text-formatting' | 'shortcuts-dialog.title' | 'shortcuts-dialog.tools' | 'shortcuts-dialog.transform' | 'shortcuts-dialog.view' | 'size-style.l' | 'size-style.m' | 'size-style.s' | 'size-style.xl' | 'spline-style.cubic' | 'spline-style.line' | 'status.offline' | 'style-panel.align' | 'style-panel.arrow-kind' | 'style-panel.arrowhead-end' | 'style-panel.arrowhead-start' | 'style-panel.arrowheads' | 'style-panel.color' | 'style-panel.dash' | 'style-panel.fill' | 'style-panel.font' | 'style-panel.geo' | 'style-panel.label-align' | 'style-panel.mixed' | 'style-panel.opacity' | 'style-panel.position' | 'style-panel.size' | 'style-panel.spline' | 'style-panel.title' | 'style-panel.vertical-align' | 'theme.dark' | 'theme.light' | 'theme.system' | 'toast.close' | 'toast.error.copy-fail.desc' | 'toast.error.copy-fail.title' | 'toast.error.export-fail.desc' | 'toast.error.export-fail.title' | 'toast.error' | 'toast.info' | 'toast.success' | 'toast.warning' | 'tool-panel.more' | 'tool-panel.title' | 'tool.arrow-down' | 'tool.arrow-left' | 'tool.arrow-right' | 'tool.arrow-up' | 'tool.arrow' | 'tool.aspect-ratio.circle' | 'tool.aspect-ratio.landscape' | 'tool.aspect-ratio.original' | 'tool.aspect-ratio.portrait' | 'tool.aspect-ratio.square' | 'tool.aspect-ratio.wide' | 'tool.aspect-ratio' | 'tool.bookmark' | 'tool.check-box' | 'tool.cloud' | 'tool.diamond' | 'tool.draw' | 'tool.ellipse' | 'tool.embed' | 'tool.eraser' | 'tool.flip-horz' | 'tool.flip-vert' | 'tool.frame' | 'tool.hand' | 'tool.heart' | 'tool.hexagon' | 'tool.highlight' | 'tool.image-crop' | 'tool.image-toolbar-title' | 'tool.image-zoom' | 'tool.laser' | 'tool.line' | 'tool.media-alt-text-confirm' | 'tool.media-alt-text-desc' | 'tool.media-alt-text' | 'tool.media' | 'tool.note' | 'tool.octagon' | 'tool.oval' | 'tool.pentagon' | 'tool.pointer-down' | 'tool.rectangle' | 'tool.replace-media' | 'tool.rhombus' | 'tool.rich-text-bold' | 'tool.rich-text-bulletList' | 'tool.rich-text-code' | 'tool.rich-text-header' | 'tool.rich-text-highlight' | 'tool.rich-text-italic' | 'tool.rich-text-link-remove' | 'tool.rich-text-link-visit' | 'tool.rich-text-link' | 'tool.rich-text-orderedList' | 'tool.rich-text-strikethrough' | 'tool.rich-text-toolbar-title' | 'tool.rotate-cw' | 'tool.select' | 'tool.star' | 'tool.text' | 'tool.trapezoid' | 'tool.triangle' | 'tool.x-box' | 'ui.checked' | 'ui.close' | 'ui.unchecked' | 'verticalAlign-style.end' | 'verticalAlign-style.middle' | 'verticalAlign-style.start' | 'vscode.file-open.backup-failed' | 'vscode.file-open.backup-saved' | 'vscode.file-open.backup' | 'vscode.file-open.desc' | 'vscode.file-open.dont-show-again' | 'vscode.file-open.open';
4226
+ export declare type TLUiTranslationKey = 'a11y.adjust-shape-styles' | 'a11y.enlarge-shape' | 'a11y.enter-leave-container' | 'a11y.move-shape-faster' | 'a11y.move-shape' | 'a11y.multiple-shapes' | 'a11y.open-context-menu' | 'a11y.open-keyboard-shortcuts' | 'a11y.pan-camera' | 'a11y.repeat-shape' | 'a11y.rotate-shape-ccw-fine' | 'a11y.rotate-shape-ccw' | 'a11y.rotate-shape-cw-fine' | 'a11y.rotate-shape-cw' | 'a11y.select-shape-direction' | 'a11y.select-shape' | 'a11y.shape-image' | 'a11y.shape-index' | 'a11y.shape-video' | 'a11y.shrink-shape' | 'a11y.skip-to-main-content' | 'a11y.status' | 'action.align-bottom' | 'action.align-center-horizontal.short' | 'action.align-center-horizontal' | 'action.align-center-vertical.short' | 'action.align-center-vertical' | 'action.align-left' | 'action.align-right' | 'action.align-top' | 'action.back-to-content' | 'action.bring-forward' | 'action.bring-to-front' | 'action.convert-to-bookmark' | 'action.convert-to-embed' | 'action.copy-as-png.short' | 'action.copy-as-png' | 'action.copy-as-svg.short' | 'action.copy-as-svg' | 'action.copy' | 'action.cut' | 'action.delete' | 'action.distribute-horizontal.short' | 'action.distribute-horizontal' | 'action.distribute-vertical.short' | 'action.distribute-vertical' | 'action.download-original' | 'action.duplicate' | 'action.edit-link' | 'action.exit-pen-mode' | 'action.export-all-as-png.short' | 'action.export-all-as-png' | 'action.export-all-as-svg.short' | 'action.export-all-as-svg' | 'action.export-as-png.short' | 'action.export-as-png' | 'action.export-as-svg.short' | 'action.export-as-svg' | 'action.fit-frame-to-content' | 'action.flatten-to-image' | 'action.flip-horizontal.short' | 'action.flip-horizontal' | 'action.flip-vertical.short' | 'action.flip-vertical' | 'action.fork-project-on-tldraw' | 'action.fork-project' | 'action.group' | 'action.insert-embed' | 'action.insert-media' | 'action.leave-shared-project' | 'action.new-project' | 'action.new-shared-project' | 'action.open-cursor-chat' | 'action.open-embed-link' | 'action.open-file' | 'action.open-kbd-shortcuts' | 'action.pack' | 'action.paste-error-description' | 'action.paste-error-title' | 'action.paste' | 'action.print' | 'action.redo' | 'action.remove-frame' | 'action.rename' | 'action.rotate-ccw' | 'action.rotate-cw' | 'action.save-copy' | 'action.select-all' | 'action.select-none' | 'action.send-backward' | 'action.send-to-back' | 'action.share-project' | 'action.stack-horizontal.short' | 'action.stack-horizontal' | 'action.stack-vertical.short' | 'action.stack-vertical' | 'action.stop-following' | 'action.stretch-horizontal.short' | 'action.stretch-horizontal' | 'action.stretch-vertical.short' | 'action.stretch-vertical' | 'action.toggle-auto-size' | 'action.toggle-dark-mode.menu' | 'action.toggle-dark-mode' | 'action.toggle-debug-mode.menu' | 'action.toggle-debug-mode' | 'action.toggle-dynamic-size-mode.menu' | 'action.toggle-dynamic-size-mode' | 'action.toggle-edge-scrolling.menu' | 'action.toggle-edge-scrolling' | 'action.toggle-focus-mode.menu' | 'action.toggle-focus-mode' | 'action.toggle-grid.menu' | 'action.toggle-grid' | 'action.toggle-keyboard-shortcuts.menu' | 'action.toggle-keyboard-shortcuts' | 'action.toggle-lock' | 'action.toggle-paste-at-cursor.menu' | 'action.toggle-paste-at-cursor' | 'action.toggle-reduce-motion.menu' | 'action.toggle-reduce-motion' | 'action.toggle-snap-mode.menu' | 'action.toggle-snap-mode' | 'action.toggle-tool-lock.menu' | 'action.toggle-tool-lock' | 'action.toggle-transparent.context-menu' | 'action.toggle-transparent.menu' | 'action.toggle-transparent' | 'action.toggle-ui-labels.menu' | 'action.toggle-ui-labels' | 'action.toggle-wrap-mode.menu' | 'action.toggle-wrap-mode' | 'action.undo' | 'action.ungroup' | 'action.unlock-all' | 'action.zoom-in' | 'action.zoom-out' | 'action.zoom-to-100' | 'action.zoom-to-fit' | 'action.zoom-to-selection' | 'actions-menu.title' | 'align-style.end' | 'align-style.justify' | 'align-style.middle' | 'align-style.start' | 'app.loading' | 'arrow-kind-style.arc' | 'arrow-kind-style.elbow' | 'arrowheadEnd-style.arrow' | 'arrowheadEnd-style.bar' | 'arrowheadEnd-style.diamond' | 'arrowheadEnd-style.dot' | 'arrowheadEnd-style.inverted' | 'arrowheadEnd-style.none' | 'arrowheadEnd-style.pipe' | 'arrowheadEnd-style.square' | 'arrowheadEnd-style.triangle' | 'arrowheadStart-style.arrow' | 'arrowheadStart-style.bar' | 'arrowheadStart-style.diamond' | 'arrowheadStart-style.dot' | 'arrowheadStart-style.inverted' | 'arrowheadStart-style.none' | 'arrowheadStart-style.pipe' | 'arrowheadStart-style.square' | 'arrowheadStart-style.triangle' | 'assets.files.amount-too-many' | 'assets.files.size-too-big' | 'assets.files.type-not-allowed' | 'assets.files.upload-failed' | 'assets.url.failed' | 'color-style.black' | 'color-style.blue' | 'color-style.green' | 'color-style.grey' | 'color-style.light-blue' | 'color-style.light-green' | 'color-style.light-red' | 'color-style.light-violet' | 'color-style.orange' | 'color-style.red' | 'color-style.violet' | 'color-style.white' | 'color-style.yellow' | 'context-menu.arrange' | 'context-menu.copy-as' | 'context-menu.edit' | 'context-menu.export-all-as' | 'context-menu.export-as' | 'context-menu.move-to-page' | 'context-menu.reorder' | 'context-menu.title' | 'context.pages.new-page' | 'cursor-chat.type-to-chat' | 'dash-style.dashed' | 'dash-style.dotted' | 'dash-style.draw' | 'dash-style.solid' | 'document-name-menu.copy-link' | 'document.default-name' | 'edit-link-dialog.cancel' | 'edit-link-dialog.clear' | 'edit-link-dialog.detail' | 'edit-link-dialog.external-link' | 'edit-link-dialog.invalid-url' | 'edit-link-dialog.save' | 'edit-link-dialog.title' | 'edit-link-dialog.url' | 'embed-dialog.back' | 'embed-dialog.cancel' | 'embed-dialog.create' | 'embed-dialog.instruction' | 'embed-dialog.invalid-url' | 'embed-dialog.title' | 'embed-dialog.url' | 'file-system.confirm-clear.cancel' | 'file-system.confirm-clear.continue' | 'file-system.confirm-clear.description' | 'file-system.confirm-clear.dont-show-again' | 'file-system.confirm-clear.title' | 'file-system.confirm-open.cancel' | 'file-system.confirm-open.description' | 'file-system.confirm-open.dont-show-again' | 'file-system.confirm-open.open' | 'file-system.confirm-open.title' | 'file-system.file-open-error.file-format-version-too-new' | 'file-system.file-open-error.generic-corrupted-file' | 'file-system.file-open-error.not-a-tldraw-file' | 'file-system.file-open-error.title' | 'file-system.shared-document-file-open-error.description' | 'file-system.shared-document-file-open-error.title' | 'fill-style.fill' | 'fill-style.none' | 'fill-style.pattern' | 'fill-style.semi' | 'fill-style.solid' | 'focus-mode.toggle-focus-mode' | 'font-style.draw' | 'font-style.mono' | 'font-style.sans' | 'font-style.serif' | 'geo-style.arrow-down' | 'geo-style.arrow-left' | 'geo-style.arrow-right' | 'geo-style.arrow-up' | 'geo-style.check-box' | 'geo-style.cloud' | 'geo-style.diamond' | 'geo-style.ellipse' | 'geo-style.heart' | 'geo-style.hexagon' | 'geo-style.octagon' | 'geo-style.oval' | 'geo-style.pentagon' | 'geo-style.rectangle' | 'geo-style.rhombus-2' | 'geo-style.rhombus' | 'geo-style.star' | 'geo-style.trapezoid' | 'geo-style.triangle' | 'geo-style.x-box' | 'handle.crop.bottom-left' | 'handle.crop.bottom-right' | 'handle.crop.bottom' | 'handle.crop.left' | 'handle.crop.right' | 'handle.crop.top-left' | 'handle.crop.top-right' | 'handle.crop.top' | 'handle.resize-bottom-left' | 'handle.resize-bottom-right' | 'handle.resize-bottom' | 'handle.resize-left' | 'handle.resize-right' | 'handle.resize-top-left' | 'handle.resize-top-right' | 'handle.resize-top' | 'handle.rotate.bottom_left_rotate' | 'handle.rotate.bottom_right_rotate' | 'handle.rotate.mobile_rotate' | 'handle.rotate.top_left_rotate' | 'handle.rotate.top_right_rotate' | 'help-menu.about' | 'help-menu.discord' | 'help-menu.github' | 'help-menu.import-tldr-file' | 'help-menu.keyboard-shortcuts' | 'help-menu.privacy' | 'help-menu.terms' | 'help-menu.title' | 'help-menu.twitter' | 'menu.accessibility' | 'menu.copy-as' | 'menu.edit' | 'menu.export-as' | 'menu.file' | 'menu.language' | 'menu.preferences' | 'menu.theme' | 'menu.title' | 'menu.view' | 'navigation-zone.minimap' | 'navigation-zone.title' | 'navigation-zone.toggle-minimap' | 'navigation-zone.zoom' | 'opacity-style.0.1' | 'opacity-style.0.25' | 'opacity-style.0.5' | 'opacity-style.0.75' | 'opacity-style.1' | 'page-menu.create-new-page' | 'page-menu.edit-done' | 'page-menu.edit-start' | 'page-menu.go-to-page' | 'page-menu.max-page-count-reached' | 'page-menu.new-page-initial-name' | 'page-menu.submenu.delete' | 'page-menu.submenu.duplicate-page' | 'page-menu.submenu.move-down' | 'page-menu.submenu.move-up' | 'page-menu.submenu.rename' | 'page-menu.submenu.title' | 'page-menu.title' | 'people-menu.anonymous-user' | 'people-menu.avatar-color' | 'people-menu.change-color' | 'people-menu.change-name' | 'people-menu.follow' | 'people-menu.following' | 'people-menu.invite' | 'people-menu.leading' | 'people-menu.title' | 'people-menu.user' | 'share-menu.copied' | 'share-menu.copy-link-note' | 'share-menu.copy-link' | 'share-menu.copy-readonly-link-note' | 'share-menu.copy-readonly-link' | 'share-menu.create-snapshot-link' | 'share-menu.creating-project' | 'share-menu.fork-note' | 'share-menu.offline-note' | 'share-menu.project-too-large' | 'share-menu.save-note' | 'share-menu.share-project' | 'share-menu.snapshot-link-note' | 'share-menu.title' | 'share-menu.upload-failed' | 'sharing.confirm-leave.cancel' | 'sharing.confirm-leave.description' | 'sharing.confirm-leave.dont-show-again' | 'sharing.confirm-leave.leave' | 'sharing.confirm-leave.title' | 'shortcuts-dialog.a11y' | 'shortcuts-dialog.collaboration' | 'shortcuts-dialog.edit' | 'shortcuts-dialog.file' | 'shortcuts-dialog.preferences' | 'shortcuts-dialog.text-formatting' | 'shortcuts-dialog.title' | 'shortcuts-dialog.tools' | 'shortcuts-dialog.transform' | 'shortcuts-dialog.view' | 'size-style.l' | 'size-style.m' | 'size-style.s' | 'size-style.xl' | 'spline-style.cubic' | 'spline-style.line' | 'status.offline' | 'style-panel.align' | 'style-panel.arrow-kind' | 'style-panel.arrowhead-end' | 'style-panel.arrowhead-start' | 'style-panel.arrowheads' | 'style-panel.color' | 'style-panel.dash' | 'style-panel.fill' | 'style-panel.font' | 'style-panel.geo' | 'style-panel.label-align' | 'style-panel.mixed' | 'style-panel.opacity' | 'style-panel.position' | 'style-panel.size' | 'style-panel.spline' | 'style-panel.title' | 'style-panel.vertical-align' | 'theme.dark' | 'theme.light' | 'theme.system' | 'toast.close' | 'toast.error.copy-fail.desc' | 'toast.error.copy-fail.title' | 'toast.error.export-fail.desc' | 'toast.error.export-fail.title' | 'toast.error' | 'toast.info' | 'toast.success' | 'toast.warning' | 'tool-panel.more' | 'tool-panel.title' | 'tool.arrow-down' | 'tool.arrow-left' | 'tool.arrow-right' | 'tool.arrow-up' | 'tool.arrow' | 'tool.aspect-ratio.circle' | 'tool.aspect-ratio.landscape' | 'tool.aspect-ratio.original' | 'tool.aspect-ratio.portrait' | 'tool.aspect-ratio.square' | 'tool.aspect-ratio.wide' | 'tool.aspect-ratio' | 'tool.bookmark' | 'tool.check-box' | 'tool.cloud' | 'tool.diamond' | 'tool.draw' | 'tool.ellipse' | 'tool.embed' | 'tool.eraser' | 'tool.flip-horz' | 'tool.flip-vert' | 'tool.frame' | 'tool.hand' | 'tool.heart' | 'tool.hexagon' | 'tool.highlight' | 'tool.image-crop-confirm' | 'tool.image-crop' | 'tool.image-toolbar-title' | 'tool.image-zoom' | 'tool.laser' | 'tool.line' | 'tool.media-alt-text-confirm' | 'tool.media-alt-text-desc' | 'tool.media-alt-text' | 'tool.media' | 'tool.note' | 'tool.octagon' | 'tool.oval' | 'tool.pentagon' | 'tool.pointer-down' | 'tool.rectangle' | 'tool.replace-media' | 'tool.rhombus' | 'tool.rich-text-bold' | 'tool.rich-text-bulletList' | 'tool.rich-text-code' | 'tool.rich-text-header' | 'tool.rich-text-highlight' | 'tool.rich-text-italic' | 'tool.rich-text-link-remove' | 'tool.rich-text-link-visit' | 'tool.rich-text-link' | 'tool.rich-text-orderedList' | 'tool.rich-text-strikethrough' | 'tool.rich-text-toolbar-title' | 'tool.rotate-cw' | 'tool.select' | 'tool.star' | 'tool.text' | 'tool.trapezoid' | 'tool.triangle' | 'tool.x-box' | 'ui.checked' | 'ui.close' | 'ui.unchecked' | 'verticalAlign-style.end' | 'verticalAlign-style.middle' | 'verticalAlign-style.start' | 'vscode.file-open.backup-failed' | 'vscode.file-open.backup-saved' | 'vscode.file-open.backup' | 'vscode.file-open.desc' | 'vscode.file-open.dont-show-again' | 'vscode.file-open.open';
4101
4227
 
4102
4228
  /** @public */
4103
4229
  export declare interface TLUiTranslationProviderProps {
@@ -4279,13 +4405,6 @@ export declare function useA11y(): TLUiA11yContextType;
4279
4405
  /** @public */
4280
4406
  export declare function useActions(): TLUiActionsContextType;
4281
4407
 
4282
- /**
4283
- * @deprecated Use {@link useImageOrVideoAsset} instead.
4284
- *
4285
- * @public
4286
- */
4287
- export declare const useAsset: typeof useImageOrVideoAsset;
4288
-
4289
4408
  /* Excluded from this release type: useAssetUrls */
4290
4409
 
4291
4410
  /** @public */
@@ -4340,7 +4459,11 @@ export declare function useDefaultHelpers(): {
4340
4459
  copy: (source: TLUiEventSource) => Promise<void>;
4341
4460
  copyAs: (ids: TLShapeId[], format?: TLCopyType) => void;
4342
4461
  cut: (source: TLUiEventSource) => Promise<void>;
4343
- exportAs: (ids: TLShapeId[], format: TLExportType | undefined, name: string | undefined) => void;
4462
+ exportAs: (ids: TLShapeId[], opts?: {
4463
+ format?: TLExportType;
4464
+ name?: string;
4465
+ scale?: number;
4466
+ }) => void;
4344
4467
  getEmbedDefinition: (url: string) => TLEmbedResult;
4345
4468
  insertMedia: () => Promise<void>;
4346
4469
  isMobile: boolean;
@@ -4390,14 +4513,12 @@ export declare function useEditableRichText(shapeId: TLShapeId, type: string, ri
4390
4513
  rInput: RefObject<HTMLDivElement>;
4391
4514
  };
4392
4515
 
4393
- /**
4394
- * @deprecated Use `useEditablePlainText` instead.
4395
- * @public
4396
- */
4397
- export declare const useEditableText: typeof useEditablePlainText;
4398
-
4399
4516
  /** @public */
4400
- export declare function useExportAs(): (ids: TLShapeId[], format: TLExportType | undefined, name: string | undefined) => void;
4517
+ export declare function useExportAs(): (ids: TLShapeId[], opts?: {
4518
+ format?: TLExportType;
4519
+ name?: string;
4520
+ scale?: number;
4521
+ }) => void;
4401
4522
 
4402
4523
  /**
4403
4524
  * This is a handy helper hook that resolves an asset to an optimized URL for a given shape, or its
@@ -4471,6 +4592,9 @@ export declare const useSelectedShapesAnnouncer: () => void;
4471
4592
  /** @public */
4472
4593
  export declare function useShowCollaborationUi(): boolean;
4473
4594
 
4595
+ /** @public */
4596
+ export declare function useStylePanelContext(): StylePanelContext;
4597
+
4474
4598
  /** @public */
4475
4599
  export declare function useTldrawUiComponents(): TLUiComponents;
4476
4600