tldraw 3.16.0-canary.e9c30b532b82 → 3.16.0-canary.eb473ba53051

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 (368) hide show
  1. package/dist-cjs/index.d.ts +233 -107
  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 +15 -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/bookmark/BookmarkShapeUtil.js +4 -4
  11. package/dist-cjs/lib/shapes/bookmark/BookmarkShapeUtil.js.map +2 -2
  12. package/dist-cjs/lib/shapes/frame/FrameShapeUtil.js +8 -1
  13. package/dist-cjs/lib/shapes/frame/FrameShapeUtil.js.map +2 -2
  14. package/dist-cjs/lib/shapes/frame/components/FrameLabelInput.js +2 -2
  15. package/dist-cjs/lib/shapes/frame/components/FrameLabelInput.js.map +2 -2
  16. package/dist-cjs/lib/shapes/geo/GeoShapeUtil.js +1 -0
  17. package/dist-cjs/lib/shapes/geo/GeoShapeUtil.js.map +2 -2
  18. package/dist-cjs/lib/shapes/image/ImageShapeUtil.js +3 -0
  19. package/dist-cjs/lib/shapes/image/ImageShapeUtil.js.map +2 -2
  20. package/dist-cjs/lib/shapes/note/NoteShapeUtil.js +2 -1
  21. package/dist-cjs/lib/shapes/note/NoteShapeUtil.js.map +2 -2
  22. package/dist-cjs/lib/shapes/shared/HyperlinkButton.js +4 -4
  23. package/dist-cjs/lib/shapes/shared/HyperlinkButton.js.map +2 -2
  24. package/dist-cjs/lib/shapes/shared/PlainTextLabel.js +1 -3
  25. package/dist-cjs/lib/shapes/shared/PlainTextLabel.js.map +2 -2
  26. package/dist-cjs/lib/shapes/shared/freehand/svg.js.map +2 -2
  27. package/dist-cjs/lib/shapes/shared/useEditablePlainText.js +3 -4
  28. package/dist-cjs/lib/shapes/shared/useEditablePlainText.js.map +2 -2
  29. package/dist-cjs/lib/shapes/shared/useImageOrVideoAsset.js +0 -2
  30. package/dist-cjs/lib/shapes/shared/useImageOrVideoAsset.js.map +2 -2
  31. package/dist-cjs/lib/shapes/text/PlainTextArea.js +2 -2
  32. package/dist-cjs/lib/shapes/text/PlainTextArea.js.map +2 -2
  33. package/dist-cjs/lib/shapes/text/RichTextArea.js +3 -3
  34. package/dist-cjs/lib/shapes/text/RichTextArea.js.map +2 -2
  35. package/dist-cjs/lib/tools/EraserTool/childStates/Erasing.js +25 -1
  36. package/dist-cjs/lib/tools/EraserTool/childStates/Erasing.js.map +2 -2
  37. package/dist-cjs/lib/tools/EraserTool/childStates/Pointing.js +12 -0
  38. package/dist-cjs/lib/tools/EraserTool/childStates/Pointing.js.map +2 -2
  39. package/dist-cjs/lib/ui/TldrawUi.js +13 -12
  40. package/dist-cjs/lib/ui/TldrawUi.js.map +2 -2
  41. package/dist-cjs/lib/ui/assetUrls.js +13 -10
  42. package/dist-cjs/lib/ui/assetUrls.js.map +2 -2
  43. package/dist-cjs/lib/ui/components/A11y.js +1 -1
  44. package/dist-cjs/lib/ui/components/A11y.js.map +2 -2
  45. package/dist-cjs/lib/ui/components/{FollowingIndicator.js → DefaultFollowingIndicator.js} +6 -6
  46. package/dist-cjs/lib/ui/components/DefaultFollowingIndicator.js.map +7 -0
  47. package/dist-cjs/lib/ui/components/KeyboardShortcutsDialog/DefaultKeyboardShortcutsDialogContent.js +6 -6
  48. package/dist-cjs/lib/ui/components/KeyboardShortcutsDialog/DefaultKeyboardShortcutsDialogContent.js.map +1 -1
  49. package/dist-cjs/lib/ui/components/LanguageMenu.js +1 -0
  50. package/dist-cjs/lib/ui/components/LanguageMenu.js.map +2 -2
  51. package/dist-cjs/lib/ui/components/Minimap/DefaultMinimap.js +1 -0
  52. package/dist-cjs/lib/ui/components/Minimap/DefaultMinimap.js.map +2 -2
  53. package/dist-cjs/lib/ui/components/PageMenu/DefaultPageMenu.js +1 -1
  54. package/dist-cjs/lib/ui/components/PageMenu/DefaultPageMenu.js.map +2 -2
  55. package/dist-cjs/lib/ui/components/StylePanel/DefaultStylePanel.js +9 -4
  56. package/dist-cjs/lib/ui/components/StylePanel/DefaultStylePanel.js.map +2 -2
  57. package/dist-cjs/lib/ui/components/StylePanel/DefaultStylePanelContent.js +255 -316
  58. package/dist-cjs/lib/ui/components/StylePanel/DefaultStylePanelContent.js.map +2 -2
  59. package/dist-cjs/lib/ui/components/StylePanel/StylePanelButtonPicker.js +147 -0
  60. package/dist-cjs/lib/ui/components/StylePanel/StylePanelButtonPicker.js.map +7 -0
  61. package/dist-cjs/lib/ui/components/StylePanel/StylePanelContext.js +68 -0
  62. package/dist-cjs/lib/ui/components/StylePanel/StylePanelContext.js.map +7 -0
  63. package/dist-cjs/lib/ui/components/StylePanel/{DoubleDropdownPicker.js → StylePanelDoubleDropdownPicker.js} +23 -22
  64. package/dist-cjs/lib/ui/components/StylePanel/StylePanelDoubleDropdownPicker.js.map +7 -0
  65. package/dist-cjs/lib/ui/components/StylePanel/{DropdownPicker.js → StylePanelDropdownPicker.js} +24 -21
  66. package/dist-cjs/lib/ui/components/StylePanel/StylePanelDropdownPicker.js.map +7 -0
  67. package/dist-cjs/lib/ui/components/StylePanel/StylePanelSubheading.js +28 -0
  68. package/dist-cjs/lib/ui/components/StylePanel/StylePanelSubheading.js.map +7 -0
  69. package/dist-cjs/lib/ui/components/Toolbar/AltTextEditor.js +2 -0
  70. package/dist-cjs/lib/ui/components/Toolbar/AltTextEditor.js.map +2 -2
  71. package/dist-cjs/lib/ui/components/Toolbar/DefaultImageToolbarContent.js +38 -9
  72. package/dist-cjs/lib/ui/components/Toolbar/DefaultImageToolbarContent.js.map +2 -2
  73. package/dist-cjs/lib/ui/components/Toolbar/DefaultVideoToolbarContent.js +15 -3
  74. package/dist-cjs/lib/ui/components/Toolbar/DefaultVideoToolbarContent.js.map +2 -2
  75. package/dist-cjs/lib/ui/components/Toolbar/LinkEditor.js +2 -1
  76. package/dist-cjs/lib/ui/components/Toolbar/LinkEditor.js.map +2 -2
  77. package/dist-cjs/lib/ui/components/Toolbar/OverflowingToolbar.js +1 -1
  78. package/dist-cjs/lib/ui/components/Toolbar/OverflowingToolbar.js.map +2 -2
  79. package/dist-cjs/lib/ui/components/primitives/TldrawUiContextualToolbar.js +11 -2
  80. package/dist-cjs/lib/ui/components/primitives/TldrawUiContextualToolbar.js.map +2 -2
  81. package/dist-cjs/lib/ui/components/primitives/TldrawUiInput.js +5 -3
  82. package/dist-cjs/lib/ui/components/primitives/TldrawUiInput.js.map +2 -2
  83. package/dist-cjs/lib/ui/components/primitives/TldrawUiSlider.js +18 -5
  84. package/dist-cjs/lib/ui/components/primitives/TldrawUiSlider.js.map +2 -2
  85. package/dist-cjs/lib/ui/components/primitives/TldrawUiToolbar.js +3 -0
  86. package/dist-cjs/lib/ui/components/primitives/TldrawUiToolbar.js.map +2 -2
  87. package/dist-cjs/lib/ui/components/primitives/TldrawUiTooltip.js +96 -43
  88. package/dist-cjs/lib/ui/components/primitives/TldrawUiTooltip.js.map +2 -2
  89. package/dist-cjs/lib/ui/components/primitives/menus/TldrawUiMenuCheckboxItem.js +3 -0
  90. package/dist-cjs/lib/ui/components/primitives/menus/TldrawUiMenuCheckboxItem.js.map +2 -2
  91. package/dist-cjs/lib/ui/components/primitives/menus/TldrawUiMenuItem.js +7 -6
  92. package/dist-cjs/lib/ui/components/primitives/menus/TldrawUiMenuItem.js.map +2 -2
  93. package/dist-cjs/lib/ui/context/actions.js +29 -10
  94. package/dist-cjs/lib/ui/context/actions.js.map +2 -2
  95. package/dist-cjs/lib/ui/context/components.js +2 -0
  96. package/dist-cjs/lib/ui/context/components.js.map +2 -2
  97. package/dist-cjs/lib/ui/context/events.js.map +1 -1
  98. package/dist-cjs/lib/ui/hooks/useClipboardEvents.js +1 -1
  99. package/dist-cjs/lib/ui/hooks/useClipboardEvents.js.map +2 -2
  100. package/dist-cjs/lib/ui/hooks/useExportAs.js +3 -2
  101. package/dist-cjs/lib/ui/hooks/useExportAs.js.map +2 -2
  102. package/dist-cjs/lib/ui/hooks/useTools.js +1 -1
  103. package/dist-cjs/lib/ui/hooks/useTools.js.map +2 -2
  104. package/dist-cjs/lib/ui/hooks/useTranslation/TLUiTranslationKey.js.map +1 -1
  105. package/dist-cjs/lib/ui/hooks/useTranslation/defaultTranslation.js +6 -2
  106. package/dist-cjs/lib/ui/hooks/useTranslation/defaultTranslation.js.map +2 -2
  107. package/dist-cjs/lib/ui/kbd-utils.js +9 -3
  108. package/dist-cjs/lib/ui/kbd-utils.js.map +2 -2
  109. package/dist-cjs/lib/ui/version.js +3 -3
  110. package/dist-cjs/lib/ui/version.js.map +1 -1
  111. package/dist-cjs/lib/utils/export/copyAs.js +1 -2
  112. package/dist-cjs/lib/utils/export/copyAs.js.map +2 -2
  113. package/dist-cjs/lib/utils/export/export.js +0 -20
  114. package/dist-cjs/lib/utils/export/export.js.map +2 -2
  115. package/dist-cjs/lib/utils/export/exportAs.js +1 -2
  116. package/dist-cjs/lib/utils/export/exportAs.js.map +2 -2
  117. package/dist-esm/index.d.mts +233 -107
  118. package/dist-esm/index.mjs +61 -29
  119. package/dist-esm/index.mjs.map +2 -2
  120. package/dist-esm/lib/Tldraw.mjs +14 -4
  121. package/dist-esm/lib/Tldraw.mjs.map +2 -2
  122. package/dist-esm/lib/defaultExternalContentHandlers.mjs +15 -4
  123. package/dist-esm/lib/defaultExternalContentHandlers.mjs.map +2 -2
  124. package/dist-esm/lib/shapes/arrow/arrowLabel.mjs +6 -0
  125. package/dist-esm/lib/shapes/arrow/arrowLabel.mjs.map +3 -3
  126. package/dist-esm/lib/shapes/bookmark/BookmarkShapeUtil.mjs +5 -5
  127. package/dist-esm/lib/shapes/bookmark/BookmarkShapeUtil.mjs.map +2 -2
  128. package/dist-esm/lib/shapes/frame/FrameShapeUtil.mjs +8 -1
  129. package/dist-esm/lib/shapes/frame/FrameShapeUtil.mjs.map +2 -2
  130. package/dist-esm/lib/shapes/frame/components/FrameLabelInput.mjs +3 -3
  131. package/dist-esm/lib/shapes/frame/components/FrameLabelInput.mjs.map +2 -2
  132. package/dist-esm/lib/shapes/geo/GeoShapeUtil.mjs +1 -0
  133. package/dist-esm/lib/shapes/geo/GeoShapeUtil.mjs.map +2 -2
  134. package/dist-esm/lib/shapes/image/ImageShapeUtil.mjs +3 -0
  135. package/dist-esm/lib/shapes/image/ImageShapeUtil.mjs.map +2 -2
  136. package/dist-esm/lib/shapes/note/NoteShapeUtil.mjs +2 -1
  137. package/dist-esm/lib/shapes/note/NoteShapeUtil.mjs.map +2 -2
  138. package/dist-esm/lib/shapes/shared/HyperlinkButton.mjs +5 -5
  139. package/dist-esm/lib/shapes/shared/HyperlinkButton.mjs.map +2 -2
  140. package/dist-esm/lib/shapes/shared/PlainTextLabel.mjs +1 -3
  141. package/dist-esm/lib/shapes/shared/PlainTextLabel.mjs.map +2 -2
  142. package/dist-esm/lib/shapes/shared/freehand/svg.mjs.map +2 -2
  143. package/dist-esm/lib/shapes/shared/useEditablePlainText.mjs +4 -5
  144. package/dist-esm/lib/shapes/shared/useEditablePlainText.mjs.map +2 -2
  145. package/dist-esm/lib/shapes/shared/useImageOrVideoAsset.mjs +0 -2
  146. package/dist-esm/lib/shapes/shared/useImageOrVideoAsset.mjs.map +2 -2
  147. package/dist-esm/lib/shapes/text/PlainTextArea.mjs +3 -3
  148. package/dist-esm/lib/shapes/text/PlainTextArea.mjs.map +2 -2
  149. package/dist-esm/lib/shapes/text/RichTextArea.mjs +3 -4
  150. package/dist-esm/lib/shapes/text/RichTextArea.mjs.map +2 -2
  151. package/dist-esm/lib/tools/EraserTool/childStates/Erasing.mjs +26 -1
  152. package/dist-esm/lib/tools/EraserTool/childStates/Erasing.mjs.map +2 -2
  153. package/dist-esm/lib/tools/EraserTool/childStates/Pointing.mjs +13 -0
  154. package/dist-esm/lib/tools/EraserTool/childStates/Pointing.mjs.map +2 -2
  155. package/dist-esm/lib/ui/TldrawUi.mjs +13 -12
  156. package/dist-esm/lib/ui/TldrawUi.mjs.map +2 -2
  157. package/dist-esm/lib/ui/assetUrls.mjs +13 -10
  158. package/dist-esm/lib/ui/assetUrls.mjs.map +2 -2
  159. package/dist-esm/lib/ui/components/A11y.mjs +2 -2
  160. package/dist-esm/lib/ui/components/A11y.mjs.map +2 -2
  161. package/dist-esm/lib/ui/components/{FollowingIndicator.mjs → DefaultFollowingIndicator.mjs} +3 -3
  162. package/dist-esm/lib/ui/components/DefaultFollowingIndicator.mjs.map +7 -0
  163. package/dist-esm/lib/ui/components/KeyboardShortcutsDialog/DefaultKeyboardShortcutsDialogContent.mjs +6 -6
  164. package/dist-esm/lib/ui/components/KeyboardShortcutsDialog/DefaultKeyboardShortcutsDialogContent.mjs.map +1 -1
  165. package/dist-esm/lib/ui/components/LanguageMenu.mjs +1 -0
  166. package/dist-esm/lib/ui/components/LanguageMenu.mjs.map +2 -2
  167. package/dist-esm/lib/ui/components/Minimap/DefaultMinimap.mjs +1 -0
  168. package/dist-esm/lib/ui/components/Minimap/DefaultMinimap.mjs.map +2 -2
  169. package/dist-esm/lib/ui/components/PageMenu/DefaultPageMenu.mjs +2 -2
  170. package/dist-esm/lib/ui/components/PageMenu/DefaultPageMenu.mjs.map +2 -2
  171. package/dist-esm/lib/ui/components/StylePanel/DefaultStylePanel.mjs +14 -5
  172. package/dist-esm/lib/ui/components/StylePanel/DefaultStylePanel.mjs.map +2 -2
  173. package/dist-esm/lib/ui/components/StylePanel/DefaultStylePanelContent.mjs +257 -320
  174. package/dist-esm/lib/ui/components/StylePanel/DefaultStylePanelContent.mjs.map +2 -2
  175. package/dist-esm/lib/ui/components/StylePanel/StylePanelButtonPicker.mjs +135 -0
  176. package/dist-esm/lib/ui/components/StylePanel/StylePanelButtonPicker.mjs.map +7 -0
  177. package/dist-esm/lib/ui/components/StylePanel/StylePanelContext.mjs +48 -0
  178. package/dist-esm/lib/ui/components/StylePanel/StylePanelContext.mjs.map +7 -0
  179. package/dist-esm/lib/ui/components/StylePanel/{DoubleDropdownPicker.mjs → StylePanelDoubleDropdownPicker.mjs} +20 -19
  180. package/dist-esm/lib/ui/components/StylePanel/StylePanelDoubleDropdownPicker.mjs.map +7 -0
  181. package/dist-esm/lib/ui/components/StylePanel/{DropdownPicker.mjs → StylePanelDropdownPicker.mjs} +21 -18
  182. package/dist-esm/lib/ui/components/StylePanel/StylePanelDropdownPicker.mjs.map +7 -0
  183. package/dist-esm/lib/ui/components/StylePanel/StylePanelSubheading.mjs +8 -0
  184. package/dist-esm/lib/ui/components/StylePanel/StylePanelSubheading.mjs.map +7 -0
  185. package/dist-esm/lib/ui/components/Toolbar/AltTextEditor.mjs +2 -0
  186. package/dist-esm/lib/ui/components/Toolbar/AltTextEditor.mjs.map +2 -2
  187. package/dist-esm/lib/ui/components/Toolbar/DefaultImageToolbarContent.mjs +38 -9
  188. package/dist-esm/lib/ui/components/Toolbar/DefaultImageToolbarContent.mjs.map +2 -2
  189. package/dist-esm/lib/ui/components/Toolbar/DefaultVideoToolbarContent.mjs +15 -3
  190. package/dist-esm/lib/ui/components/Toolbar/DefaultVideoToolbarContent.mjs.map +2 -2
  191. package/dist-esm/lib/ui/components/Toolbar/LinkEditor.mjs +2 -1
  192. package/dist-esm/lib/ui/components/Toolbar/LinkEditor.mjs.map +2 -2
  193. package/dist-esm/lib/ui/components/Toolbar/OverflowingToolbar.mjs +1 -1
  194. package/dist-esm/lib/ui/components/Toolbar/OverflowingToolbar.mjs.map +2 -2
  195. package/dist-esm/lib/ui/components/primitives/TldrawUiContextualToolbar.mjs +12 -3
  196. package/dist-esm/lib/ui/components/primitives/TldrawUiContextualToolbar.mjs.map +2 -2
  197. package/dist-esm/lib/ui/components/primitives/TldrawUiInput.mjs +6 -4
  198. package/dist-esm/lib/ui/components/primitives/TldrawUiInput.mjs.map +2 -2
  199. package/dist-esm/lib/ui/components/primitives/TldrawUiSlider.mjs +18 -5
  200. package/dist-esm/lib/ui/components/primitives/TldrawUiSlider.mjs.map +2 -2
  201. package/dist-esm/lib/ui/components/primitives/TldrawUiToolbar.mjs +3 -0
  202. package/dist-esm/lib/ui/components/primitives/TldrawUiToolbar.mjs.map +2 -2
  203. package/dist-esm/lib/ui/components/primitives/TldrawUiTooltip.mjs +97 -43
  204. package/dist-esm/lib/ui/components/primitives/TldrawUiTooltip.mjs.map +2 -2
  205. package/dist-esm/lib/ui/components/primitives/menus/TldrawUiMenuCheckboxItem.mjs +3 -0
  206. package/dist-esm/lib/ui/components/primitives/menus/TldrawUiMenuCheckboxItem.mjs.map +2 -2
  207. package/dist-esm/lib/ui/components/primitives/menus/TldrawUiMenuItem.mjs +7 -6
  208. package/dist-esm/lib/ui/components/primitives/menus/TldrawUiMenuItem.mjs.map +2 -2
  209. package/dist-esm/lib/ui/context/actions.mjs +29 -10
  210. package/dist-esm/lib/ui/context/actions.mjs.map +2 -2
  211. package/dist-esm/lib/ui/context/components.mjs +2 -0
  212. package/dist-esm/lib/ui/context/components.mjs.map +2 -2
  213. package/dist-esm/lib/ui/context/events.mjs.map +1 -1
  214. package/dist-esm/lib/ui/hooks/useClipboardEvents.mjs +2 -2
  215. package/dist-esm/lib/ui/hooks/useClipboardEvents.mjs.map +2 -2
  216. package/dist-esm/lib/ui/hooks/useExportAs.mjs +3 -2
  217. package/dist-esm/lib/ui/hooks/useExportAs.mjs.map +2 -2
  218. package/dist-esm/lib/ui/hooks/useTools.mjs +1 -1
  219. package/dist-esm/lib/ui/hooks/useTools.mjs.map +2 -2
  220. package/dist-esm/lib/ui/hooks/useTranslation/defaultTranslation.mjs +6 -2
  221. package/dist-esm/lib/ui/hooks/useTranslation/defaultTranslation.mjs.map +2 -2
  222. package/dist-esm/lib/ui/kbd-utils.mjs +9 -3
  223. package/dist-esm/lib/ui/kbd-utils.mjs.map +2 -2
  224. package/dist-esm/lib/ui/version.mjs +3 -3
  225. package/dist-esm/lib/ui/version.mjs.map +1 -1
  226. package/dist-esm/lib/utils/export/copyAs.mjs +1 -2
  227. package/dist-esm/lib/utils/export/copyAs.mjs.map +2 -2
  228. package/dist-esm/lib/utils/export/export.mjs +0 -20
  229. package/dist-esm/lib/utils/export/export.mjs.map +2 -2
  230. package/dist-esm/lib/utils/export/exportAs.mjs +1 -2
  231. package/dist-esm/lib/utils/export/exportAs.mjs.map +2 -2
  232. package/package.json +11 -34
  233. package/src/index.ts +44 -22
  234. package/src/lib/Tldraw.tsx +15 -2
  235. package/src/lib/defaultExternalContentHandlers.ts +26 -4
  236. package/src/lib/shapes/arrow/ArrowShapeOptions.test.ts +2 -1
  237. package/src/lib/shapes/arrow/ArrowShapeTool.test.ts +6 -5
  238. package/src/lib/shapes/arrow/ArrowShapeUtil.test.ts +48 -6
  239. package/src/lib/shapes/arrow/arrowLabel.ts +8 -0
  240. package/src/lib/shapes/bookmark/BookmarkShapeUtil.tsx +5 -5
  241. package/src/lib/shapes/draw/DrawShapeTool.test.ts +0 -5
  242. package/src/lib/shapes/frame/FrameShapeUtil.tsx +9 -0
  243. package/src/lib/shapes/frame/components/FrameLabelInput.tsx +3 -3
  244. package/src/lib/shapes/geo/GeoShapeUtil.tsx +1 -0
  245. package/src/lib/shapes/image/ImageShapeUtil.tsx +3 -0
  246. package/src/lib/shapes/line/LineShapeUtil.test.tsx +4 -3
  247. package/src/lib/shapes/line/__snapshots__/LineShapeUtil.test.tsx.snap +2 -2
  248. package/src/lib/shapes/note/NoteShapeUtil.tsx +1 -0
  249. package/src/lib/shapes/shared/HyperlinkButton.tsx +5 -5
  250. package/src/lib/shapes/shared/PlainTextLabel.tsx +0 -6
  251. package/src/lib/shapes/shared/freehand/svg.ts +2 -0
  252. package/src/lib/shapes/shared/useEditablePlainText.ts +5 -9
  253. package/src/lib/shapes/shared/useImageOrVideoAsset.ts +0 -7
  254. package/src/lib/shapes/text/PlainTextArea.tsx +3 -3
  255. package/src/lib/shapes/text/RichTextArea.tsx +3 -4
  256. package/src/lib/shapes/text/TextShapeTool.test.ts +6 -5
  257. package/src/lib/tools/EraserTool/childStates/Erasing.ts +34 -1
  258. package/src/lib/tools/EraserTool/childStates/Pointing.ts +20 -0
  259. package/src/lib/ui/TldrawUi.tsx +16 -10
  260. package/src/lib/ui/assetUrls.ts +13 -10
  261. package/src/lib/ui/components/A11y.tsx +2 -2
  262. package/src/lib/ui/components/{FollowingIndicator.tsx → DefaultFollowingIndicator.tsx} +2 -1
  263. package/src/lib/ui/components/KeyboardShortcutsDialog/DefaultKeyboardShortcutsDialogContent.tsx +6 -6
  264. package/src/lib/ui/components/LanguageMenu.tsx +1 -0
  265. package/src/lib/ui/components/Minimap/DefaultMinimap.tsx +1 -0
  266. package/src/lib/ui/components/PageMenu/DefaultPageMenu.tsx +2 -2
  267. package/src/lib/ui/components/StylePanel/DefaultStylePanel.tsx +27 -13
  268. package/src/lib/ui/components/StylePanel/DefaultStylePanelContent.tsx +260 -381
  269. package/src/lib/ui/components/{primitives/TldrawUiButtonPicker.tsx → StylePanel/StylePanelButtonPicker.tsx} +70 -50
  270. package/src/lib/ui/components/StylePanel/StylePanelContext.tsx +63 -0
  271. package/src/lib/ui/components/StylePanel/{DoubleDropdownPicker.tsx → StylePanelDoubleDropdownPicker.tsx} +28 -19
  272. package/src/lib/ui/components/StylePanel/StylePanelDropdownPicker.tsx +119 -0
  273. package/src/lib/ui/components/StylePanel/StylePanelSubheading.tsx +9 -0
  274. package/src/lib/ui/components/Toolbar/AltTextEditor.tsx +2 -0
  275. package/src/lib/ui/components/Toolbar/DefaultImageToolbarContent.tsx +32 -15
  276. package/src/lib/ui/components/Toolbar/DefaultVideoToolbarContent.tsx +12 -4
  277. package/src/lib/ui/components/Toolbar/LinkEditor.tsx +1 -0
  278. package/src/lib/ui/components/Toolbar/OverflowingToolbar.tsx +1 -1
  279. package/src/lib/ui/components/primitives/TldrawUiContextualToolbar.tsx +8 -3
  280. package/src/lib/ui/components/primitives/TldrawUiInput.tsx +6 -3
  281. package/src/lib/ui/components/primitives/TldrawUiSlider.tsx +52 -32
  282. package/src/lib/ui/components/primitives/TldrawUiToolbar.tsx +5 -1
  283. package/src/lib/ui/components/primitives/TldrawUiTooltip.tsx +109 -31
  284. package/src/lib/ui/components/primitives/menus/TldrawUiMenuCheckboxItem.tsx +4 -0
  285. package/src/lib/ui/components/primitives/menus/TldrawUiMenuItem.tsx +9 -8
  286. package/src/lib/ui/context/actions.tsx +36 -10
  287. package/src/lib/ui/context/components.tsx +3 -0
  288. package/src/lib/ui/context/events.tsx +1 -1
  289. package/src/lib/ui/hooks/useClipboardEvents.ts +2 -2
  290. package/src/lib/ui/hooks/useExportAs.ts +3 -2
  291. package/src/lib/ui/hooks/useTools.tsx +1 -1
  292. package/src/lib/ui/hooks/useTranslation/TLUiTranslationKey.ts +4 -0
  293. package/src/lib/ui/hooks/useTranslation/defaultTranslation.ts +6 -2
  294. package/src/lib/ui/kbd-utils.ts +10 -3
  295. package/src/lib/ui/version.ts +3 -3
  296. package/src/lib/ui.css +29 -2
  297. package/src/lib/utils/excalidraw/__snapshots__/putExcalidrawContent.test.tsx.snap +5 -5
  298. package/src/lib/utils/export/copyAs.ts +1 -24
  299. package/src/lib/utils/export/export.ts +0 -36
  300. package/src/lib/utils/export/exportAs.ts +1 -32
  301. package/src/lib/utils/tldr/__snapshots__/buildFromV1Document.test.ts.snap +4 -4
  302. package/src/test/A11y.test.tsx +3 -2
  303. package/src/test/ClickManager.test.ts +7 -6
  304. package/src/test/Editor.test.tsx +20 -19
  305. package/src/test/EraserTool.test.ts +184 -13
  306. package/src/test/HandTool.test.ts +10 -9
  307. package/src/test/HighlightShape.test.ts +2 -1
  308. package/src/test/SelectTool.test.ts +3 -2
  309. package/src/test/TLUserPreferences.test.ts +4 -3
  310. package/src/test/TestEditor.ts +13 -15
  311. package/src/test/TldrawEditor.test.tsx +11 -10
  312. package/src/test/ZoomTool.test.ts +7 -6
  313. package/src/test/__snapshots__/drawing.test.ts.snap +2 -2
  314. package/src/test/__snapshots__/groups.test.tsx.snap +6 -6
  315. package/src/test/__snapshots__/resizing.test.ts.snap +2 -2
  316. package/src/test/arrows-megabus.test.tsx +5 -4
  317. package/src/test/bindings.test.tsx +24 -37
  318. package/src/test/bookmark-shapes.test.ts +1 -8
  319. package/src/test/commands/__snapshots__/getSvgString.test.ts.snap +23 -7
  320. package/src/test/commands/__snapshots__/packShapes.test.ts.snap +8 -8
  321. package/src/test/commands/__snapshots__/zoomToFit.test.ts.snap +2 -2
  322. package/src/test/commands/alignShapes.test.tsx +25 -24
  323. package/src/test/commands/animationSpeed.test.ts +2 -1
  324. package/src/test/commands/centerOnPoint.test.ts +3 -2
  325. package/src/test/commands/clipboard.test.ts +3 -2
  326. package/src/test/commands/createShapes.test.ts +2 -1
  327. package/src/test/commands/deleteShapes.test.ts +2 -1
  328. package/src/test/commands/distributeShapes.test.tsx +11 -10
  329. package/src/test/commands/getSvgString.test.ts +2 -1
  330. package/src/test/commands/packShapes.test.ts +5 -4
  331. package/src/test/commands/resizeShape.test.ts +2 -1
  332. package/src/test/commands/rotateShapes.test.ts +7 -6
  333. package/src/test/commands/setCamera.test.ts +4 -3
  334. package/src/test/commands/setCurrentPage.test.ts +3 -2
  335. package/src/test/commands/stackShapes.test.ts +11 -10
  336. package/src/test/commands/stretch.test.tsx +13 -12
  337. package/src/test/createDeepLink.test.tsx +2 -1
  338. package/src/test/cropping.test.ts +3 -2
  339. package/src/test/custom-clipping.test.ts +436 -0
  340. package/src/test/drawing.test.ts +2 -1
  341. package/src/test/flipShapes.test.ts +4 -3
  342. package/src/test/frames.test.ts +25 -24
  343. package/src/test/getCulledShapes.test.tsx +74 -4
  344. package/src/test/groups.test.tsx +1 -1
  345. package/src/test/handleDeepLink.test.tsx +2 -1
  346. package/src/test/maxShapes.test.ts +3 -2
  347. package/src/test/modifiers.test.ts +5 -4
  348. package/src/test/navigation.test.ts +12 -11
  349. package/src/test/panning.test.ts +2 -1
  350. package/src/test/perf/perf.test.ts +2 -1
  351. package/src/test/registerDeepLinkListener.test.tsx +10 -9
  352. package/src/test/resizing.test.ts +39 -38
  353. package/src/test/select.test.tsx +4 -3
  354. package/src/test/selection-omnibus.test.ts +11 -10
  355. package/src/test/shapeutils.test.ts +4 -3
  356. package/src/test/translating.test.ts +9 -8
  357. package/tldraw.css +45 -5
  358. package/dist-cjs/lib/ui/components/FollowingIndicator.js.map +0 -7
  359. package/dist-cjs/lib/ui/components/StylePanel/DoubleDropdownPicker.js.map +0 -7
  360. package/dist-cjs/lib/ui/components/StylePanel/DropdownPicker.js.map +0 -7
  361. package/dist-cjs/lib/ui/components/primitives/TldrawUiButtonPicker.js +0 -131
  362. package/dist-cjs/lib/ui/components/primitives/TldrawUiButtonPicker.js.map +0 -7
  363. package/dist-esm/lib/ui/components/FollowingIndicator.mjs.map +0 -7
  364. package/dist-esm/lib/ui/components/StylePanel/DoubleDropdownPicker.mjs.map +0 -7
  365. package/dist-esm/lib/ui/components/StylePanel/DropdownPicker.mjs.map +0 -7
  366. package/dist-esm/lib/ui/components/primitives/TldrawUiButtonPicker.mjs +0 -115
  367. package/dist-esm/lib/ui/components/primitives/TldrawUiButtonPicker.mjs.map +0 -7
  368. 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
+
2606
+ /** @public */
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
+
2560
2623
  /** @public */
2561
- export declare interface StylePickerSetProps {
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;
2563
2629
  }
2564
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;
2713
+ }
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
 
@@ -3047,7 +3185,7 @@ export declare function TldrawUiMenuActionCheckboxItem({ actionId, ...rest }: TL
3047
3185
  export declare function TldrawUiMenuActionItem({ actionId, ...rest }: TLUiMenuActionItemProps): JSX_2.Element | null;
3048
3186
 
3049
3187
  /** @public @react */
3050
- export declare function TldrawUiMenuCheckboxItem<TranslationKey extends string = string, IconType extends string = string>({ id, kbd, label, readonlyOk, onSelect, toggle, disabled, checked, }: TLUiMenuCheckboxItemProps<TranslationKey, IconType>): JSX_2.Element | null;
3188
+ export declare function TldrawUiMenuCheckboxItem<TranslationKey extends string = string, IconType extends string = string>({ id, kbd, label, lang, readonlyOk, onSelect, toggle, disabled, checked, }: TLUiMenuCheckboxItemProps<TranslationKey, IconType>): JSX_2.Element | null;
3051
3189
 
3052
3190
  /** @public @react */
3053
3191
  export declare function TldrawUiMenuContextProvider({ type, sourceId, children, }: TLUiMenuContextProviderProps): JSX_2.Element;
@@ -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;
@@ -3768,6 +3897,7 @@ export declare interface TLUiInputProps {
3768
3897
  shouldManuallyMaintainScrollPositionWhenFocused?: boolean;
3769
3898
  value?: string;
3770
3899
  'data-testid'?: string;
3900
+ 'aria-label'?: string;
3771
3901
  }
3772
3902
 
3773
3903
  /** @public */
@@ -3812,6 +3942,7 @@ export declare interface TLUiMenuCheckboxItemProps<TranslationKey extends string
3812
3942
  label?: {
3813
3943
  [key: string]: TranslationKey;
3814
3944
  } | TranslationKey;
3945
+ lang?: string;
3815
3946
  readonlyOk?: boolean;
3816
3947
  onSelect(source: TLUiEventSource): Promise<void> | void;
3817
3948
  toggle?: boolean;
@@ -3962,19 +4093,15 @@ export declare interface TLUiSliderProps {
3962
4093
  label: string;
3963
4094
  title: string;
3964
4095
  onValueChange(value: number): void;
3965
- onHistoryMark(id: string): void;
4096
+ onHistoryMark?(id: string): void;
3966
4097
  'data-testid'?: string;
3967
4098
  ariaValueModifier?: number;
3968
4099
  }
3969
4100
 
3970
- /** @public */
3971
- export declare interface TLUiStylePanelContentProps {
3972
- styles: ReturnType<typeof useRelevantStyles>;
3973
- }
3974
-
3975
4101
  /** @public */
3976
4102
  export declare interface TLUiStylePanelProps {
3977
4103
  isMobile?: boolean;
4104
+ styles?: null | ReadonlySharedStyleMap;
3978
4105
  children?: ReactNode;
3979
4106
  }
3980
4107
 
@@ -4043,6 +4170,7 @@ export declare interface TLUiToolbarToggleGroupProps extends React_3.HTMLAttribu
4043
4170
  value: any;
4044
4171
  defaultValue?: any;
4045
4172
  type: 'multiple' | 'single';
4173
+ asChild?: boolean;
4046
4174
  }
4047
4175
 
4048
4176
  /** @public */
@@ -4051,7 +4179,7 @@ export declare interface TLUiToolbarToggleItemProps extends React_3.HTMLAttribut
4051
4179
  className?: string;
4052
4180
  type: 'icon' | 'tool';
4053
4181
  value: string;
4054
- tooltip?: string;
4182
+ tooltip?: React_3.ReactNode;
4055
4183
  }
4056
4184
 
4057
4185
  /** @public */
@@ -4097,7 +4225,7 @@ export declare interface TLUiTranslation {
4097
4225
  export declare type TLUiTranslationContextType = TLUiTranslation;
4098
4226
 
4099
4227
  /** @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';
4228
+ 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.maximum-size' | '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.selected' | '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
4229
 
4102
4230
  /** @public */
4103
4231
  export declare interface TLUiTranslationProviderProps {
@@ -4279,13 +4407,6 @@ export declare function useA11y(): TLUiA11yContextType;
4279
4407
  /** @public */
4280
4408
  export declare function useActions(): TLUiActionsContextType;
4281
4409
 
4282
- /**
4283
- * @deprecated Use {@link useImageOrVideoAsset} instead.
4284
- *
4285
- * @public
4286
- */
4287
- export declare const useAsset: typeof useImageOrVideoAsset;
4288
-
4289
4410
  /* Excluded from this release type: useAssetUrls */
4290
4411
 
4291
4412
  /** @public */
@@ -4340,7 +4461,11 @@ export declare function useDefaultHelpers(): {
4340
4461
  copy: (source: TLUiEventSource) => Promise<void>;
4341
4462
  copyAs: (ids: TLShapeId[], format?: TLCopyType) => void;
4342
4463
  cut: (source: TLUiEventSource) => Promise<void>;
4343
- exportAs: (ids: TLShapeId[], format: TLExportType | undefined, name: string | undefined) => void;
4464
+ exportAs: (ids: TLShapeId[], opts?: {
4465
+ format?: TLExportType;
4466
+ name?: string;
4467
+ scale?: number;
4468
+ }) => void;
4344
4469
  getEmbedDefinition: (url: string) => TLEmbedResult;
4345
4470
  insertMedia: () => Promise<void>;
4346
4471
  isMobile: boolean;
@@ -4362,7 +4487,7 @@ export declare function useEditablePlainText(shapeId: TLShapeId, type: string, t
4362
4487
  handleChange: ({ plaintext }: {
4363
4488
  plaintext: string;
4364
4489
  }) => void;
4365
- handleDoubleClick: (e: any) => any;
4490
+ handleDoubleClick: (e: React_3.MouseEvent) => void;
4366
4491
  handleFocus: () => void;
4367
4492
  handleInputPointerDown: (e: React_3.PointerEvent) => void;
4368
4493
  handleKeyDown: (e: KeyboardEvent) => void;
@@ -4379,7 +4504,7 @@ export declare function useEditableRichText(shapeId: TLShapeId, type: string, ri
4379
4504
  handleChange: ({ richText }: {
4380
4505
  richText: TLRichText;
4381
4506
  }) => void;
4382
- handleDoubleClick: (e: any) => any;
4507
+ handleDoubleClick: (e: React.MouseEvent) => void;
4383
4508
  handleFocus: () => void;
4384
4509
  handleInputPointerDown: (e: React.PointerEvent) => void;
4385
4510
  handleKeyDown: (e: KeyboardEvent) => void;
@@ -4390,14 +4515,12 @@ export declare function useEditableRichText(shapeId: TLShapeId, type: string, ri
4390
4515
  rInput: RefObject<HTMLDivElement>;
4391
4516
  };
4392
4517
 
4393
- /**
4394
- * @deprecated Use `useEditablePlainText` instead.
4395
- * @public
4396
- */
4397
- export declare const useEditableText: typeof useEditablePlainText;
4398
-
4399
4518
  /** @public */
4400
- export declare function useExportAs(): (ids: TLShapeId[], format: TLExportType | undefined, name: string | undefined) => void;
4519
+ export declare function useExportAs(): (ids: TLShapeId[], opts?: {
4520
+ format?: TLExportType;
4521
+ name?: string;
4522
+ scale?: number;
4523
+ }) => void;
4401
4524
 
4402
4525
  /**
4403
4526
  * This is a handy helper hook that resolves an asset to an optimized URL for a given shape, or its
@@ -4471,6 +4594,9 @@ export declare const useSelectedShapesAnnouncer: () => void;
4471
4594
  /** @public */
4472
4595
  export declare function useShowCollaborationUi(): boolean;
4473
4596
 
4597
+ /** @public */
4598
+ export declare function useStylePanelContext(): StylePanelContext;
4599
+
4474
4600
  /** @public */
4475
4601
  export declare function useTldrawUiComponents(): TLUiComponents;
4476
4602