tldraw 3.16.0-canary.b802b60e813f → 3.16.0-canary.ba3bc37d4418

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 (285) hide show
  1. package/dist-cjs/index.d.ts +149 -107
  2. package/dist-cjs/index.js +28 -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 +10 -0
  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/useEditablePlainText.js +3 -4
  27. package/dist-cjs/lib/shapes/shared/useEditablePlainText.js.map +2 -2
  28. package/dist-cjs/lib/shapes/shared/useImageOrVideoAsset.js +0 -2
  29. package/dist-cjs/lib/shapes/shared/useImageOrVideoAsset.js.map +2 -2
  30. package/dist-cjs/lib/shapes/text/PlainTextArea.js +2 -2
  31. package/dist-cjs/lib/shapes/text/PlainTextArea.js.map +2 -2
  32. package/dist-cjs/lib/shapes/text/RichTextArea.js +3 -3
  33. package/dist-cjs/lib/shapes/text/RichTextArea.js.map +2 -2
  34. package/dist-cjs/lib/ui/TldrawUi.js +13 -12
  35. package/dist-cjs/lib/ui/TldrawUi.js.map +2 -2
  36. package/dist-cjs/lib/ui/components/A11y.js +1 -1
  37. package/dist-cjs/lib/ui/components/A11y.js.map +2 -2
  38. package/dist-cjs/lib/ui/components/{FollowingIndicator.js → DefaultFollowingIndicator.js} +6 -6
  39. package/dist-cjs/lib/ui/components/DefaultFollowingIndicator.js.map +7 -0
  40. package/dist-cjs/lib/ui/components/KeyboardShortcutsDialog/DefaultKeyboardShortcutsDialogContent.js +5 -5
  41. package/dist-cjs/lib/ui/components/KeyboardShortcutsDialog/DefaultKeyboardShortcutsDialogContent.js.map +1 -1
  42. package/dist-cjs/lib/ui/components/LanguageMenu.js +1 -0
  43. package/dist-cjs/lib/ui/components/LanguageMenu.js.map +2 -2
  44. package/dist-cjs/lib/ui/components/Minimap/DefaultMinimap.js +1 -0
  45. package/dist-cjs/lib/ui/components/Minimap/DefaultMinimap.js.map +2 -2
  46. package/dist-cjs/lib/ui/components/PageMenu/DefaultPageMenu.js +1 -1
  47. package/dist-cjs/lib/ui/components/PageMenu/DefaultPageMenu.js.map +2 -2
  48. package/dist-cjs/lib/ui/components/StylePanel/DefaultStylePanel.js +9 -4
  49. package/dist-cjs/lib/ui/components/StylePanel/DefaultStylePanel.js.map +2 -2
  50. package/dist-cjs/lib/ui/components/StylePanel/DefaultStylePanelContent.js +255 -316
  51. package/dist-cjs/lib/ui/components/StylePanel/DefaultStylePanelContent.js.map +2 -2
  52. package/dist-cjs/lib/ui/components/StylePanel/StylePanelButtonPicker.js +147 -0
  53. package/dist-cjs/lib/ui/components/StylePanel/StylePanelButtonPicker.js.map +7 -0
  54. package/dist-cjs/lib/ui/components/StylePanel/StylePanelContext.js +68 -0
  55. package/dist-cjs/lib/ui/components/StylePanel/StylePanelContext.js.map +7 -0
  56. package/dist-cjs/lib/ui/components/StylePanel/{DoubleDropdownPicker.js → StylePanelDoubleDropdownPicker.js} +23 -22
  57. package/dist-cjs/lib/ui/components/StylePanel/StylePanelDoubleDropdownPicker.js.map +7 -0
  58. package/dist-cjs/lib/ui/components/StylePanel/{DropdownPicker.js → StylePanelDropdownPicker.js} +23 -20
  59. package/dist-cjs/lib/ui/components/StylePanel/StylePanelDropdownPicker.js.map +7 -0
  60. package/dist-cjs/lib/ui/components/StylePanel/StylePanelSubheading.js +28 -0
  61. package/dist-cjs/lib/ui/components/StylePanel/StylePanelSubheading.js.map +7 -0
  62. package/dist-cjs/lib/ui/components/Toolbar/AltTextEditor.js +4 -2
  63. package/dist-cjs/lib/ui/components/Toolbar/AltTextEditor.js.map +2 -2
  64. package/dist-cjs/lib/ui/components/Toolbar/DefaultImageToolbarContent.js +38 -9
  65. package/dist-cjs/lib/ui/components/Toolbar/DefaultImageToolbarContent.js.map +2 -2
  66. package/dist-cjs/lib/ui/components/Toolbar/DefaultVideoToolbarContent.js +15 -3
  67. package/dist-cjs/lib/ui/components/Toolbar/DefaultVideoToolbarContent.js.map +2 -2
  68. package/dist-cjs/lib/ui/components/Toolbar/LinkEditor.js +5 -4
  69. package/dist-cjs/lib/ui/components/Toolbar/LinkEditor.js.map +2 -2
  70. package/dist-cjs/lib/ui/components/primitives/TldrawUiContextualToolbar.js +11 -2
  71. package/dist-cjs/lib/ui/components/primitives/TldrawUiContextualToolbar.js.map +2 -2
  72. package/dist-cjs/lib/ui/components/primitives/TldrawUiInput.js +2 -2
  73. package/dist-cjs/lib/ui/components/primitives/TldrawUiInput.js.map +2 -2
  74. package/dist-cjs/lib/ui/components/primitives/TldrawUiSlider.js +18 -5
  75. package/dist-cjs/lib/ui/components/primitives/TldrawUiSlider.js.map +2 -2
  76. package/dist-cjs/lib/ui/components/primitives/TldrawUiToolbar.js +3 -0
  77. package/dist-cjs/lib/ui/components/primitives/TldrawUiToolbar.js.map +2 -2
  78. package/dist-cjs/lib/ui/components/primitives/TldrawUiTooltip.js +44 -1
  79. package/dist-cjs/lib/ui/components/primitives/TldrawUiTooltip.js.map +2 -2
  80. package/dist-cjs/lib/ui/components/primitives/menus/TldrawUiMenuCheckboxItem.js +3 -0
  81. package/dist-cjs/lib/ui/components/primitives/menus/TldrawUiMenuCheckboxItem.js.map +2 -2
  82. package/dist-cjs/lib/ui/components/primitives/menus/TldrawUiMenuItem.js +5 -5
  83. package/dist-cjs/lib/ui/components/primitives/menus/TldrawUiMenuItem.js.map +1 -1
  84. package/dist-cjs/lib/ui/context/actions.js +13 -8
  85. package/dist-cjs/lib/ui/context/actions.js.map +2 -2
  86. package/dist-cjs/lib/ui/context/components.js +2 -0
  87. package/dist-cjs/lib/ui/context/components.js.map +2 -2
  88. package/dist-cjs/lib/ui/context/events.js.map +1 -1
  89. package/dist-cjs/lib/ui/hooks/useClipboardEvents.js +1 -1
  90. package/dist-cjs/lib/ui/hooks/useClipboardEvents.js.map +2 -2
  91. package/dist-cjs/lib/ui/hooks/useExportAs.js +3 -2
  92. package/dist-cjs/lib/ui/hooks/useExportAs.js.map +2 -2
  93. package/dist-cjs/lib/ui/hooks/useTools.js +1 -1
  94. package/dist-cjs/lib/ui/hooks/useTools.js.map +2 -2
  95. package/dist-cjs/lib/ui/hooks/useTranslation/TLUiTranslationKey.js.map +1 -1
  96. package/dist-cjs/lib/ui/hooks/useTranslation/defaultTranslation.js +6 -2
  97. package/dist-cjs/lib/ui/hooks/useTranslation/defaultTranslation.js.map +2 -2
  98. package/dist-cjs/lib/ui/kbd-utils.js +9 -3
  99. package/dist-cjs/lib/ui/kbd-utils.js.map +2 -2
  100. package/dist-cjs/lib/ui/version.js +3 -3
  101. package/dist-cjs/lib/ui/version.js.map +1 -1
  102. package/dist-cjs/lib/utils/export/copyAs.js +1 -2
  103. package/dist-cjs/lib/utils/export/copyAs.js.map +2 -2
  104. package/dist-cjs/lib/utils/export/export.js +0 -20
  105. package/dist-cjs/lib/utils/export/export.js.map +2 -2
  106. package/dist-cjs/lib/utils/export/exportAs.js +1 -2
  107. package/dist-cjs/lib/utils/export/exportAs.js.map +2 -2
  108. package/dist-esm/index.d.mts +149 -107
  109. package/dist-esm/index.mjs +55 -29
  110. package/dist-esm/index.mjs.map +2 -2
  111. package/dist-esm/lib/Tldraw.mjs +14 -4
  112. package/dist-esm/lib/Tldraw.mjs.map +2 -2
  113. package/dist-esm/lib/defaultExternalContentHandlers.mjs +10 -0
  114. package/dist-esm/lib/defaultExternalContentHandlers.mjs.map +2 -2
  115. package/dist-esm/lib/shapes/arrow/arrowLabel.mjs +6 -0
  116. package/dist-esm/lib/shapes/arrow/arrowLabel.mjs.map +3 -3
  117. package/dist-esm/lib/shapes/bookmark/BookmarkShapeUtil.mjs +5 -5
  118. package/dist-esm/lib/shapes/bookmark/BookmarkShapeUtil.mjs.map +2 -2
  119. package/dist-esm/lib/shapes/frame/FrameShapeUtil.mjs +8 -1
  120. package/dist-esm/lib/shapes/frame/FrameShapeUtil.mjs.map +2 -2
  121. package/dist-esm/lib/shapes/frame/components/FrameLabelInput.mjs +3 -3
  122. package/dist-esm/lib/shapes/frame/components/FrameLabelInput.mjs.map +2 -2
  123. package/dist-esm/lib/shapes/geo/GeoShapeUtil.mjs +1 -0
  124. package/dist-esm/lib/shapes/geo/GeoShapeUtil.mjs.map +2 -2
  125. package/dist-esm/lib/shapes/image/ImageShapeUtil.mjs +3 -0
  126. package/dist-esm/lib/shapes/image/ImageShapeUtil.mjs.map +2 -2
  127. package/dist-esm/lib/shapes/note/NoteShapeUtil.mjs +2 -1
  128. package/dist-esm/lib/shapes/note/NoteShapeUtil.mjs.map +2 -2
  129. package/dist-esm/lib/shapes/shared/HyperlinkButton.mjs +5 -5
  130. package/dist-esm/lib/shapes/shared/HyperlinkButton.mjs.map +2 -2
  131. package/dist-esm/lib/shapes/shared/PlainTextLabel.mjs +1 -3
  132. package/dist-esm/lib/shapes/shared/PlainTextLabel.mjs.map +2 -2
  133. package/dist-esm/lib/shapes/shared/useEditablePlainText.mjs +4 -5
  134. package/dist-esm/lib/shapes/shared/useEditablePlainText.mjs.map +2 -2
  135. package/dist-esm/lib/shapes/shared/useImageOrVideoAsset.mjs +0 -2
  136. package/dist-esm/lib/shapes/shared/useImageOrVideoAsset.mjs.map +2 -2
  137. package/dist-esm/lib/shapes/text/PlainTextArea.mjs +3 -3
  138. package/dist-esm/lib/shapes/text/PlainTextArea.mjs.map +2 -2
  139. package/dist-esm/lib/shapes/text/RichTextArea.mjs +3 -4
  140. package/dist-esm/lib/shapes/text/RichTextArea.mjs.map +2 -2
  141. package/dist-esm/lib/ui/TldrawUi.mjs +13 -12
  142. package/dist-esm/lib/ui/TldrawUi.mjs.map +2 -2
  143. package/dist-esm/lib/ui/components/A11y.mjs +2 -2
  144. package/dist-esm/lib/ui/components/A11y.mjs.map +2 -2
  145. package/dist-esm/lib/ui/components/{FollowingIndicator.mjs → DefaultFollowingIndicator.mjs} +3 -3
  146. package/dist-esm/lib/ui/components/DefaultFollowingIndicator.mjs.map +7 -0
  147. package/dist-esm/lib/ui/components/KeyboardShortcutsDialog/DefaultKeyboardShortcutsDialogContent.mjs +5 -5
  148. package/dist-esm/lib/ui/components/KeyboardShortcutsDialog/DefaultKeyboardShortcutsDialogContent.mjs.map +1 -1
  149. package/dist-esm/lib/ui/components/LanguageMenu.mjs +1 -0
  150. package/dist-esm/lib/ui/components/LanguageMenu.mjs.map +2 -2
  151. package/dist-esm/lib/ui/components/Minimap/DefaultMinimap.mjs +1 -0
  152. package/dist-esm/lib/ui/components/Minimap/DefaultMinimap.mjs.map +2 -2
  153. package/dist-esm/lib/ui/components/PageMenu/DefaultPageMenu.mjs +2 -2
  154. package/dist-esm/lib/ui/components/PageMenu/DefaultPageMenu.mjs.map +2 -2
  155. package/dist-esm/lib/ui/components/StylePanel/DefaultStylePanel.mjs +14 -5
  156. package/dist-esm/lib/ui/components/StylePanel/DefaultStylePanel.mjs.map +2 -2
  157. package/dist-esm/lib/ui/components/StylePanel/DefaultStylePanelContent.mjs +257 -320
  158. package/dist-esm/lib/ui/components/StylePanel/DefaultStylePanelContent.mjs.map +2 -2
  159. package/dist-esm/lib/ui/components/StylePanel/StylePanelButtonPicker.mjs +135 -0
  160. package/dist-esm/lib/ui/components/StylePanel/StylePanelButtonPicker.mjs.map +7 -0
  161. package/dist-esm/lib/ui/components/StylePanel/StylePanelContext.mjs +48 -0
  162. package/dist-esm/lib/ui/components/StylePanel/StylePanelContext.mjs.map +7 -0
  163. package/dist-esm/lib/ui/components/StylePanel/{DoubleDropdownPicker.mjs → StylePanelDoubleDropdownPicker.mjs} +20 -19
  164. package/dist-esm/lib/ui/components/StylePanel/StylePanelDoubleDropdownPicker.mjs.map +7 -0
  165. package/dist-esm/lib/ui/components/StylePanel/{DropdownPicker.mjs → StylePanelDropdownPicker.mjs} +20 -17
  166. package/dist-esm/lib/ui/components/StylePanel/StylePanelDropdownPicker.mjs.map +7 -0
  167. package/dist-esm/lib/ui/components/StylePanel/StylePanelSubheading.mjs +8 -0
  168. package/dist-esm/lib/ui/components/StylePanel/StylePanelSubheading.mjs.map +7 -0
  169. package/dist-esm/lib/ui/components/Toolbar/AltTextEditor.mjs +4 -2
  170. package/dist-esm/lib/ui/components/Toolbar/AltTextEditor.mjs.map +2 -2
  171. package/dist-esm/lib/ui/components/Toolbar/DefaultImageToolbarContent.mjs +38 -9
  172. package/dist-esm/lib/ui/components/Toolbar/DefaultImageToolbarContent.mjs.map +2 -2
  173. package/dist-esm/lib/ui/components/Toolbar/DefaultVideoToolbarContent.mjs +15 -3
  174. package/dist-esm/lib/ui/components/Toolbar/DefaultVideoToolbarContent.mjs.map +2 -2
  175. package/dist-esm/lib/ui/components/Toolbar/LinkEditor.mjs +5 -4
  176. package/dist-esm/lib/ui/components/Toolbar/LinkEditor.mjs.map +2 -2
  177. package/dist-esm/lib/ui/components/primitives/TldrawUiContextualToolbar.mjs +12 -3
  178. package/dist-esm/lib/ui/components/primitives/TldrawUiContextualToolbar.mjs.map +2 -2
  179. package/dist-esm/lib/ui/components/primitives/TldrawUiInput.mjs +3 -3
  180. package/dist-esm/lib/ui/components/primitives/TldrawUiInput.mjs.map +2 -2
  181. package/dist-esm/lib/ui/components/primitives/TldrawUiSlider.mjs +18 -5
  182. package/dist-esm/lib/ui/components/primitives/TldrawUiSlider.mjs.map +2 -2
  183. package/dist-esm/lib/ui/components/primitives/TldrawUiToolbar.mjs +3 -0
  184. package/dist-esm/lib/ui/components/primitives/TldrawUiToolbar.mjs.map +2 -2
  185. package/dist-esm/lib/ui/components/primitives/TldrawUiTooltip.mjs +45 -1
  186. package/dist-esm/lib/ui/components/primitives/TldrawUiTooltip.mjs.map +2 -2
  187. package/dist-esm/lib/ui/components/primitives/menus/TldrawUiMenuCheckboxItem.mjs +3 -0
  188. package/dist-esm/lib/ui/components/primitives/menus/TldrawUiMenuCheckboxItem.mjs.map +2 -2
  189. package/dist-esm/lib/ui/components/primitives/menus/TldrawUiMenuItem.mjs +5 -5
  190. package/dist-esm/lib/ui/components/primitives/menus/TldrawUiMenuItem.mjs.map +1 -1
  191. package/dist-esm/lib/ui/context/actions.mjs +13 -8
  192. package/dist-esm/lib/ui/context/actions.mjs.map +2 -2
  193. package/dist-esm/lib/ui/context/components.mjs +2 -0
  194. package/dist-esm/lib/ui/context/components.mjs.map +2 -2
  195. package/dist-esm/lib/ui/context/events.mjs.map +1 -1
  196. package/dist-esm/lib/ui/hooks/useClipboardEvents.mjs +2 -2
  197. package/dist-esm/lib/ui/hooks/useClipboardEvents.mjs.map +2 -2
  198. package/dist-esm/lib/ui/hooks/useExportAs.mjs +3 -2
  199. package/dist-esm/lib/ui/hooks/useExportAs.mjs.map +2 -2
  200. package/dist-esm/lib/ui/hooks/useTools.mjs +1 -1
  201. package/dist-esm/lib/ui/hooks/useTools.mjs.map +2 -2
  202. package/dist-esm/lib/ui/hooks/useTranslation/defaultTranslation.mjs +6 -2
  203. package/dist-esm/lib/ui/hooks/useTranslation/defaultTranslation.mjs.map +2 -2
  204. package/dist-esm/lib/ui/kbd-utils.mjs +9 -3
  205. package/dist-esm/lib/ui/kbd-utils.mjs.map +2 -2
  206. package/dist-esm/lib/ui/version.mjs +3 -3
  207. package/dist-esm/lib/ui/version.mjs.map +1 -1
  208. package/dist-esm/lib/utils/export/copyAs.mjs +1 -2
  209. package/dist-esm/lib/utils/export/copyAs.mjs.map +2 -2
  210. package/dist-esm/lib/utils/export/export.mjs +0 -20
  211. package/dist-esm/lib/utils/export/export.mjs.map +2 -2
  212. package/dist-esm/lib/utils/export/exportAs.mjs +1 -2
  213. package/dist-esm/lib/utils/export/exportAs.mjs.map +2 -2
  214. package/package.json +3 -3
  215. package/src/index.ts +40 -22
  216. package/src/lib/Tldraw.tsx +15 -2
  217. package/src/lib/defaultExternalContentHandlers.ts +14 -0
  218. package/src/lib/shapes/arrow/ArrowShapeTool.test.ts +2 -2
  219. package/src/lib/shapes/arrow/ArrowShapeUtil.test.ts +41 -0
  220. package/src/lib/shapes/arrow/arrowLabel.ts +8 -0
  221. package/src/lib/shapes/bookmark/BookmarkShapeUtil.tsx +5 -5
  222. package/src/lib/shapes/frame/FrameShapeUtil.tsx +9 -0
  223. package/src/lib/shapes/frame/components/FrameLabelInput.tsx +3 -3
  224. package/src/lib/shapes/geo/GeoShapeUtil.tsx +1 -0
  225. package/src/lib/shapes/image/ImageShapeUtil.tsx +3 -0
  226. package/src/lib/shapes/note/NoteShapeUtil.tsx +1 -0
  227. package/src/lib/shapes/shared/HyperlinkButton.tsx +5 -5
  228. package/src/lib/shapes/shared/PlainTextLabel.tsx +0 -6
  229. package/src/lib/shapes/shared/useEditablePlainText.ts +5 -9
  230. package/src/lib/shapes/shared/useImageOrVideoAsset.ts +0 -7
  231. package/src/lib/shapes/text/PlainTextArea.tsx +3 -3
  232. package/src/lib/shapes/text/RichTextArea.tsx +3 -4
  233. package/src/lib/ui/TldrawUi.tsx +16 -10
  234. package/src/lib/ui/components/A11y.tsx +2 -2
  235. package/src/lib/ui/components/{FollowingIndicator.tsx → DefaultFollowingIndicator.tsx} +2 -1
  236. package/src/lib/ui/components/KeyboardShortcutsDialog/DefaultKeyboardShortcutsDialogContent.tsx +5 -5
  237. package/src/lib/ui/components/LanguageMenu.tsx +1 -0
  238. package/src/lib/ui/components/Minimap/DefaultMinimap.tsx +1 -0
  239. package/src/lib/ui/components/PageMenu/DefaultPageMenu.tsx +2 -2
  240. package/src/lib/ui/components/StylePanel/DefaultStylePanel.tsx +27 -13
  241. package/src/lib/ui/components/StylePanel/DefaultStylePanelContent.tsx +260 -381
  242. package/src/lib/ui/components/{primitives/TldrawUiButtonPicker.tsx → StylePanel/StylePanelButtonPicker.tsx} +70 -50
  243. package/src/lib/ui/components/StylePanel/StylePanelContext.tsx +63 -0
  244. package/src/lib/ui/components/StylePanel/{DoubleDropdownPicker.tsx → StylePanelDoubleDropdownPicker.tsx} +28 -19
  245. package/src/lib/ui/components/StylePanel/StylePanelDropdownPicker.tsx +119 -0
  246. package/src/lib/ui/components/StylePanel/StylePanelSubheading.tsx +9 -0
  247. package/src/lib/ui/components/Toolbar/AltTextEditor.tsx +5 -3
  248. package/src/lib/ui/components/Toolbar/DefaultImageToolbarContent.tsx +32 -15
  249. package/src/lib/ui/components/Toolbar/DefaultVideoToolbarContent.tsx +12 -4
  250. package/src/lib/ui/components/Toolbar/LinkEditor.tsx +6 -5
  251. package/src/lib/ui/components/primitives/TldrawUiContextualToolbar.tsx +8 -3
  252. package/src/lib/ui/components/primitives/TldrawUiInput.tsx +3 -3
  253. package/src/lib/ui/components/primitives/TldrawUiSlider.tsx +52 -32
  254. package/src/lib/ui/components/primitives/TldrawUiToolbar.tsx +5 -1
  255. package/src/lib/ui/components/primitives/TldrawUiTooltip.tsx +64 -11
  256. package/src/lib/ui/components/primitives/menus/TldrawUiMenuCheckboxItem.tsx +4 -0
  257. package/src/lib/ui/components/primitives/menus/TldrawUiMenuItem.tsx +6 -6
  258. package/src/lib/ui/context/actions.tsx +20 -8
  259. package/src/lib/ui/context/components.tsx +3 -0
  260. package/src/lib/ui/context/events.tsx +1 -1
  261. package/src/lib/ui/hooks/useClipboardEvents.ts +2 -2
  262. package/src/lib/ui/hooks/useExportAs.ts +3 -2
  263. package/src/lib/ui/hooks/useTools.tsx +1 -1
  264. package/src/lib/ui/hooks/useTranslation/TLUiTranslationKey.ts +4 -0
  265. package/src/lib/ui/hooks/useTranslation/defaultTranslation.ts +6 -2
  266. package/src/lib/ui/kbd-utils.ts +10 -3
  267. package/src/lib/ui/version.ts +3 -3
  268. package/src/lib/ui.css +26 -2
  269. package/src/lib/utils/export/copyAs.ts +1 -24
  270. package/src/lib/utils/export/export.ts +0 -36
  271. package/src/lib/utils/export/exportAs.ts +1 -32
  272. package/src/test/custom-clipping.test.ts +436 -0
  273. package/src/test/getCulledShapes.test.tsx +71 -2
  274. package/tldraw.css +42 -5
  275. package/dist-cjs/lib/ui/components/FollowingIndicator.js.map +0 -7
  276. package/dist-cjs/lib/ui/components/StylePanel/DoubleDropdownPicker.js.map +0 -7
  277. package/dist-cjs/lib/ui/components/StylePanel/DropdownPicker.js.map +0 -7
  278. package/dist-cjs/lib/ui/components/primitives/TldrawUiButtonPicker.js +0 -131
  279. package/dist-cjs/lib/ui/components/primitives/TldrawUiButtonPicker.js.map +0 -7
  280. package/dist-esm/lib/ui/components/FollowingIndicator.mjs.map +0 -7
  281. package/dist-esm/lib/ui/components/StylePanel/DoubleDropdownPicker.mjs.map +0 -7
  282. package/dist-esm/lib/ui/components/StylePanel/DropdownPicker.mjs.map +0 -7
  283. package/dist-esm/lib/ui/components/primitives/TldrawUiButtonPicker.mjs +0 -115
  284. package/dist-esm/lib/ui/components/primitives/TldrawUiButtonPicker.mjs.map +0 -7
  285. 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
 
@@ -1898,6 +1862,7 @@ export declare class ImageShapeUtil extends BaseBoxShapeUtil<TLImageShape> {
1898
1862
  static migrations: TLPropsMigrations;
1899
1863
  isAspectRatioLocked(): boolean;
1900
1864
  canCrop(): boolean;
1865
+ isExportBoundsContainer(): boolean;
1901
1866
  getDefaultProps(): TLImageShape['props'];
1902
1867
  getGeometry(shape: TLImageShape): Geometry2d;
1903
1868
  getAriaDescriptor(shape: TLImageShape): string;
@@ -2184,9 +2149,6 @@ export declare interface OnDragFromToolbarToCreateShapesOpts {
2184
2149
  onDragEnd?(id: TLShapeId): void;
2185
2150
  }
2186
2151
 
2187
- /** @public @react */
2188
- export declare function OpacitySlider(): JSX_2.Element | null;
2189
-
2190
2152
  /** @public @react */
2191
2153
  export declare function OvalToolbarItem(): JSX_2.Element;
2192
2154
 
@@ -2578,9 +2540,6 @@ export declare interface SolidPathBuilderOpts extends BasePathBuilderOpts {
2578
2540
 
2579
2541
  /* Excluded from this release type: Spinner */
2580
2542
 
2581
- /** @public @react */
2582
- export declare function SplineStylePickerSet({ styles }: StylePickerSetProps): JSX_2.Element | null;
2583
-
2584
2543
  /** @public @react */
2585
2544
  export declare function StackMenuItems(): JSX_2.Element;
2586
2545
 
@@ -2638,11 +2597,124 @@ export declare interface StrokePoint {
2638
2597
  radius: number;
2639
2598
  }
2640
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
+
2623
+ /** @public */
2624
+ export declare interface StylePanelContext {
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
+
2641
2634
  /** @public */
2642
- export declare interface StylePickerSetProps {
2635
+ export declare interface StylePanelContextProviderProps {
2636
+ children: React.ReactNode;
2643
2637
  styles: ReadonlySharedStyleMap;
2644
2638
  }
2645
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
+
2646
2718
  /** @public */
2647
2719
  export declare type StyleValuesForUi<T> = readonly {
2648
2720
  readonly icon: string | TLUiIconJsx;
@@ -2682,12 +2754,6 @@ export declare interface TextAreaProps {
2682
2754
  */
2683
2755
  export declare const TextDirection: Extension<any, any>;
2684
2756
 
2685
- /**
2686
- * @deprecated Use `PlainTextLabel` instead.
2687
- * @public
2688
- */
2689
- export declare const TextLabel: React_3.NamedExoticComponent<PlainTextLabelProps>;
2690
-
2691
2757
  /** @public */
2692
2758
  export declare interface TextShapeOptions {
2693
2759
  /** How much addition padding should be added to the horizontal geometry of the shape when binding to an arrow? */
@@ -2765,18 +2831,9 @@ export declare class TextShapeUtil extends ShapeUtil<TLTextShape> {
2765
2831
  } | undefined;
2766
2832
  }
2767
2833
 
2768
- /** @public @react */
2769
- export declare function TextStylePickerSet({ theme, styles }: ThemeStylePickerSetProps): JSX_2.Element | null;
2770
-
2771
2834
  /** @public @react */
2772
2835
  export declare function TextToolbarItem(): JSX_2.Element;
2773
2836
 
2774
- /** @public */
2775
- export declare interface ThemeStylePickerSetProps {
2776
- styles: ReadonlySharedStyleMap;
2777
- theme: TLDefaultColorTheme;
2778
- }
2779
-
2780
2837
  /**
2781
2838
  * Default extensions for the TipTap editor.
2782
2839
  *
@@ -3033,9 +3090,6 @@ export declare function TldrawUiButtonIcon({ icon, small, invertIcon }: TLUiButt
3033
3090
  /** @public @react */
3034
3091
  export declare function TldrawUiButtonLabel({ children }: TLUiButtonLabelProps): JSX_2.Element;
3035
3092
 
3036
- /** @public */
3037
- export declare const TldrawUiButtonPicker: <T extends string>(props: TLUiButtonPickerProps<T>) => ReactElement;
3038
-
3039
3093
  /**
3040
3094
  * A column, usually of UI controls like buttons, select dropdown, checkboxes, etc.
3041
3095
  *
@@ -3115,6 +3169,9 @@ export declare const TldrawUiGrid: ForwardRefExoticComponent<TLUiLayoutProps & R
3115
3169
  /** @public @react */
3116
3170
  export declare const TldrawUiIcon: NamedExoticComponent<TLUiIconProps>;
3117
3171
 
3172
+ /** @public @react */
3173
+ export declare function TldrawUiInFrontOfTheCanvas(): JSX_2.Element;
3174
+
3118
3175
  /** @public @react */
3119
3176
  export declare const TldrawUiInput: React_2.ForwardRefExoticComponent<TLUiInputProps & React_2.RefAttributes<HTMLInputElement>>;
3120
3177
 
@@ -3128,7 +3185,7 @@ export declare function TldrawUiMenuActionCheckboxItem({ actionId, ...rest }: TL
3128
3185
  export declare function TldrawUiMenuActionItem({ actionId, ...rest }: TLUiMenuActionItemProps): JSX_2.Element | null;
3129
3186
 
3130
3187
  /** @public @react */
3131
- 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;
3132
3189
 
3133
3190
  /** @public @react */
3134
3191
  export declare function TldrawUiMenuContextProvider({ type, sourceId, children, }: TLUiMenuContextProviderProps): JSX_2.Element;
@@ -3212,7 +3269,7 @@ export declare const TldrawUiToolbar: React_3.ForwardRefExoticComponent<TLUiTool
3212
3269
  export declare const TldrawUiToolbarButton: React_3.ForwardRefExoticComponent<TLUiToolbarButtonProps & React_3.RefAttributes<HTMLButtonElement>>;
3213
3270
 
3214
3271
  /** @public @react */
3215
- 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;
3216
3273
 
3217
3274
  /** @public @react */
3218
3275
  export declare const TldrawUiToolbarToggleItem: ({ children, className, type, value, tooltip, ...props }: TLUiToolbarToggleItemProps) => JSX_2.Element;
@@ -3399,18 +3456,6 @@ export declare interface TLUiButtonLabelProps {
3399
3456
  children?: ReactNode;
3400
3457
  }
3401
3458
 
3402
- /** @public */
3403
- export declare interface TLUiButtonPickerProps<T extends string> {
3404
- title: string;
3405
- uiType: string;
3406
- style: StyleProp<T>;
3407
- value: SharedStyle<T>;
3408
- items: StyleValuesForUi<T>;
3409
- theme: TLDefaultColorTheme;
3410
- onValueChange(style: StyleProp<T>, value: T): void;
3411
- onHistoryMark?(id: string): void;
3412
- }
3413
-
3414
3459
  /** @public */
3415
3460
  export declare interface TLUiButtonProps extends React_2.HTMLAttributes<HTMLButtonElement> {
3416
3461
  disabled?: boolean;
@@ -3445,6 +3490,7 @@ export declare interface TLUiComponents {
3445
3490
  Dialogs?: ComponentType | null;
3446
3491
  Toasts?: ComponentType | null;
3447
3492
  A11y?: ComponentType | null;
3493
+ FollowingIndicator?: ComponentType | null;
3448
3494
  }
3449
3495
 
3450
3496
  /** @public */
@@ -3770,7 +3816,7 @@ export declare interface TLUiEventMap {
3770
3816
  'flatten-to-image': null;
3771
3817
  'a11y-repeat-shape-announce': null;
3772
3818
  'open-url': {
3773
- url: string;
3819
+ destinationUrl: string;
3774
3820
  };
3775
3821
  'open-context-menu': null;
3776
3822
  'adjust-shape-styles': null;
@@ -3895,6 +3941,7 @@ export declare interface TLUiMenuCheckboxItemProps<TranslationKey extends string
3895
3941
  label?: {
3896
3942
  [key: string]: TranslationKey;
3897
3943
  } | TranslationKey;
3944
+ lang?: string;
3898
3945
  readonlyOk?: boolean;
3899
3946
  onSelect(source: TLUiEventSource): Promise<void> | void;
3900
3947
  toggle?: boolean;
@@ -4045,19 +4092,15 @@ export declare interface TLUiSliderProps {
4045
4092
  label: string;
4046
4093
  title: string;
4047
4094
  onValueChange(value: number): void;
4048
- onHistoryMark(id: string): void;
4095
+ onHistoryMark?(id: string): void;
4049
4096
  'data-testid'?: string;
4050
4097
  ariaValueModifier?: number;
4051
4098
  }
4052
4099
 
4053
- /** @public */
4054
- export declare interface TLUiStylePanelContentProps {
4055
- styles: ReturnType<typeof useRelevantStyles>;
4056
- }
4057
-
4058
4100
  /** @public */
4059
4101
  export declare interface TLUiStylePanelProps {
4060
4102
  isMobile?: boolean;
4103
+ styles?: null | ReadonlySharedStyleMap;
4061
4104
  children?: ReactNode;
4062
4105
  }
4063
4106
 
@@ -4126,6 +4169,7 @@ export declare interface TLUiToolbarToggleGroupProps extends React_3.HTMLAttribu
4126
4169
  value: any;
4127
4170
  defaultValue?: any;
4128
4171
  type: 'multiple' | 'single';
4172
+ asChild?: boolean;
4129
4173
  }
4130
4174
 
4131
4175
  /** @public */
@@ -4134,7 +4178,7 @@ export declare interface TLUiToolbarToggleItemProps extends React_3.HTMLAttribut
4134
4178
  className?: string;
4135
4179
  type: 'icon' | 'tool';
4136
4180
  value: string;
4137
- tooltip?: string;
4181
+ tooltip?: React_3.ReactNode;
4138
4182
  }
4139
4183
 
4140
4184
  /** @public */
@@ -4180,7 +4224,7 @@ export declare interface TLUiTranslation {
4180
4224
  export declare type TLUiTranslationContextType = TLUiTranslation;
4181
4225
 
4182
4226
  /** @public */
4183
- 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';
4227
+ 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';
4184
4228
 
4185
4229
  /** @public */
4186
4230
  export declare interface TLUiTranslationProviderProps {
@@ -4362,13 +4406,6 @@ export declare function useA11y(): TLUiA11yContextType;
4362
4406
  /** @public */
4363
4407
  export declare function useActions(): TLUiActionsContextType;
4364
4408
 
4365
- /**
4366
- * @deprecated Use {@link useImageOrVideoAsset} instead.
4367
- *
4368
- * @public
4369
- */
4370
- export declare const useAsset: typeof useImageOrVideoAsset;
4371
-
4372
4409
  /* Excluded from this release type: useAssetUrls */
4373
4410
 
4374
4411
  /** @public */
@@ -4423,7 +4460,11 @@ export declare function useDefaultHelpers(): {
4423
4460
  copy: (source: TLUiEventSource) => Promise<void>;
4424
4461
  copyAs: (ids: TLShapeId[], format?: TLCopyType) => void;
4425
4462
  cut: (source: TLUiEventSource) => Promise<void>;
4426
- exportAs: (ids: TLShapeId[], format: TLExportType | undefined, name: string | undefined) => void;
4463
+ exportAs: (ids: TLShapeId[], opts?: {
4464
+ format?: TLExportType;
4465
+ name?: string;
4466
+ scale?: number;
4467
+ }) => void;
4427
4468
  getEmbedDefinition: (url: string) => TLEmbedResult;
4428
4469
  insertMedia: () => Promise<void>;
4429
4470
  isMobile: boolean;
@@ -4445,7 +4486,7 @@ export declare function useEditablePlainText(shapeId: TLShapeId, type: string, t
4445
4486
  handleChange: ({ plaintext }: {
4446
4487
  plaintext: string;
4447
4488
  }) => void;
4448
- handleDoubleClick: (e: any) => any;
4489
+ handleDoubleClick: (e: React_3.MouseEvent) => void;
4449
4490
  handleFocus: () => void;
4450
4491
  handleInputPointerDown: (e: React_3.PointerEvent) => void;
4451
4492
  handleKeyDown: (e: KeyboardEvent) => void;
@@ -4462,7 +4503,7 @@ export declare function useEditableRichText(shapeId: TLShapeId, type: string, ri
4462
4503
  handleChange: ({ richText }: {
4463
4504
  richText: TLRichText;
4464
4505
  }) => void;
4465
- handleDoubleClick: (e: any) => any;
4506
+ handleDoubleClick: (e: React.MouseEvent) => void;
4466
4507
  handleFocus: () => void;
4467
4508
  handleInputPointerDown: (e: React.PointerEvent) => void;
4468
4509
  handleKeyDown: (e: KeyboardEvent) => void;
@@ -4473,14 +4514,12 @@ export declare function useEditableRichText(shapeId: TLShapeId, type: string, ri
4473
4514
  rInput: RefObject<HTMLDivElement>;
4474
4515
  };
4475
4516
 
4476
- /**
4477
- * @deprecated Use `useEditablePlainText` instead.
4478
- * @public
4479
- */
4480
- export declare const useEditableText: typeof useEditablePlainText;
4481
-
4482
4517
  /** @public */
4483
- export declare function useExportAs(): (ids: TLShapeId[], format: TLExportType | undefined, name: string | undefined) => void;
4518
+ export declare function useExportAs(): (ids: TLShapeId[], opts?: {
4519
+ format?: TLExportType;
4520
+ name?: string;
4521
+ scale?: number;
4522
+ }) => void;
4484
4523
 
4485
4524
  /**
4486
4525
  * This is a handy helper hook that resolves an asset to an optimized URL for a given shape, or its
@@ -4554,6 +4593,9 @@ export declare const useSelectedShapesAnnouncer: () => void;
4554
4593
  /** @public */
4555
4594
  export declare function useShowCollaborationUi(): boolean;
4556
4595
 
4596
+ /** @public */
4597
+ export declare function useStylePanelContext(): StylePanelContext;
4598
+
4557
4599
  /** @public */
4558
4600
  export declare function useTldrawUiComponents(): TLUiComponents;
4559
4601