tldraw 3.16.0-canary.acb40a76700b → 3.16.0-canary.b2da39015a73

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 (353) hide show
  1. package/dist-cjs/index.d.ts +230 -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/ui/TldrawUi.js +13 -12
  36. package/dist-cjs/lib/ui/TldrawUi.js.map +2 -2
  37. package/dist-cjs/lib/ui/assetUrls.js +13 -10
  38. package/dist-cjs/lib/ui/assetUrls.js.map +2 -2
  39. package/dist-cjs/lib/ui/components/A11y.js +1 -1
  40. package/dist-cjs/lib/ui/components/A11y.js.map +2 -2
  41. package/dist-cjs/lib/ui/components/{FollowingIndicator.js → DefaultFollowingIndicator.js} +6 -6
  42. package/dist-cjs/lib/ui/components/DefaultFollowingIndicator.js.map +7 -0
  43. package/dist-cjs/lib/ui/components/KeyboardShortcutsDialog/DefaultKeyboardShortcutsDialogContent.js +6 -6
  44. package/dist-cjs/lib/ui/components/KeyboardShortcutsDialog/DefaultKeyboardShortcutsDialogContent.js.map +1 -1
  45. package/dist-cjs/lib/ui/components/LanguageMenu.js +1 -0
  46. package/dist-cjs/lib/ui/components/LanguageMenu.js.map +2 -2
  47. package/dist-cjs/lib/ui/components/Minimap/DefaultMinimap.js +1 -0
  48. package/dist-cjs/lib/ui/components/Minimap/DefaultMinimap.js.map +2 -2
  49. package/dist-cjs/lib/ui/components/PageMenu/DefaultPageMenu.js +1 -1
  50. package/dist-cjs/lib/ui/components/PageMenu/DefaultPageMenu.js.map +2 -2
  51. package/dist-cjs/lib/ui/components/StylePanel/DefaultStylePanel.js +9 -4
  52. package/dist-cjs/lib/ui/components/StylePanel/DefaultStylePanel.js.map +2 -2
  53. package/dist-cjs/lib/ui/components/StylePanel/DefaultStylePanelContent.js +255 -316
  54. package/dist-cjs/lib/ui/components/StylePanel/DefaultStylePanelContent.js.map +2 -2
  55. package/dist-cjs/lib/ui/components/StylePanel/StylePanelButtonPicker.js +147 -0
  56. package/dist-cjs/lib/ui/components/StylePanel/StylePanelButtonPicker.js.map +7 -0
  57. package/dist-cjs/lib/ui/components/StylePanel/StylePanelContext.js +68 -0
  58. package/dist-cjs/lib/ui/components/StylePanel/StylePanelContext.js.map +7 -0
  59. package/dist-cjs/lib/ui/components/StylePanel/{DoubleDropdownPicker.js → StylePanelDoubleDropdownPicker.js} +23 -22
  60. package/dist-cjs/lib/ui/components/StylePanel/StylePanelDoubleDropdownPicker.js.map +7 -0
  61. package/dist-cjs/lib/ui/components/StylePanel/{DropdownPicker.js → StylePanelDropdownPicker.js} +24 -21
  62. package/dist-cjs/lib/ui/components/StylePanel/StylePanelDropdownPicker.js.map +7 -0
  63. package/dist-cjs/lib/ui/components/StylePanel/StylePanelSubheading.js +28 -0
  64. package/dist-cjs/lib/ui/components/StylePanel/StylePanelSubheading.js.map +7 -0
  65. package/dist-cjs/lib/ui/components/Toolbar/AltTextEditor.js +4 -2
  66. package/dist-cjs/lib/ui/components/Toolbar/AltTextEditor.js.map +2 -2
  67. package/dist-cjs/lib/ui/components/Toolbar/DefaultImageToolbarContent.js +38 -9
  68. package/dist-cjs/lib/ui/components/Toolbar/DefaultImageToolbarContent.js.map +2 -2
  69. package/dist-cjs/lib/ui/components/Toolbar/DefaultVideoToolbarContent.js +15 -3
  70. package/dist-cjs/lib/ui/components/Toolbar/DefaultVideoToolbarContent.js.map +2 -2
  71. package/dist-cjs/lib/ui/components/Toolbar/LinkEditor.js +5 -4
  72. package/dist-cjs/lib/ui/components/Toolbar/LinkEditor.js.map +2 -2
  73. package/dist-cjs/lib/ui/components/primitives/TldrawUiContextualToolbar.js +11 -2
  74. package/dist-cjs/lib/ui/components/primitives/TldrawUiContextualToolbar.js.map +2 -2
  75. package/dist-cjs/lib/ui/components/primitives/TldrawUiInput.js +2 -2
  76. package/dist-cjs/lib/ui/components/primitives/TldrawUiInput.js.map +2 -2
  77. package/dist-cjs/lib/ui/components/primitives/TldrawUiSlider.js +18 -5
  78. package/dist-cjs/lib/ui/components/primitives/TldrawUiSlider.js.map +2 -2
  79. package/dist-cjs/lib/ui/components/primitives/TldrawUiToolbar.js +3 -0
  80. package/dist-cjs/lib/ui/components/primitives/TldrawUiToolbar.js.map +2 -2
  81. package/dist-cjs/lib/ui/components/primitives/TldrawUiTooltip.js +73 -36
  82. package/dist-cjs/lib/ui/components/primitives/TldrawUiTooltip.js.map +2 -2
  83. package/dist-cjs/lib/ui/components/primitives/menus/TldrawUiMenuCheckboxItem.js +3 -0
  84. package/dist-cjs/lib/ui/components/primitives/menus/TldrawUiMenuCheckboxItem.js.map +2 -2
  85. package/dist-cjs/lib/ui/components/primitives/menus/TldrawUiMenuItem.js +7 -6
  86. package/dist-cjs/lib/ui/components/primitives/menus/TldrawUiMenuItem.js.map +2 -2
  87. package/dist-cjs/lib/ui/context/actions.js +29 -10
  88. package/dist-cjs/lib/ui/context/actions.js.map +2 -2
  89. package/dist-cjs/lib/ui/context/components.js +2 -0
  90. package/dist-cjs/lib/ui/context/components.js.map +2 -2
  91. package/dist-cjs/lib/ui/context/events.js.map +1 -1
  92. package/dist-cjs/lib/ui/hooks/useClipboardEvents.js +1 -1
  93. package/dist-cjs/lib/ui/hooks/useClipboardEvents.js.map +2 -2
  94. package/dist-cjs/lib/ui/hooks/useExportAs.js +3 -2
  95. package/dist-cjs/lib/ui/hooks/useExportAs.js.map +2 -2
  96. package/dist-cjs/lib/ui/hooks/useTools.js +1 -1
  97. package/dist-cjs/lib/ui/hooks/useTools.js.map +2 -2
  98. package/dist-cjs/lib/ui/hooks/useTranslation/TLUiTranslationKey.js.map +1 -1
  99. package/dist-cjs/lib/ui/hooks/useTranslation/defaultTranslation.js +6 -2
  100. package/dist-cjs/lib/ui/hooks/useTranslation/defaultTranslation.js.map +2 -2
  101. package/dist-cjs/lib/ui/kbd-utils.js +9 -3
  102. package/dist-cjs/lib/ui/kbd-utils.js.map +2 -2
  103. package/dist-cjs/lib/ui/version.js +3 -3
  104. package/dist-cjs/lib/ui/version.js.map +1 -1
  105. package/dist-cjs/lib/utils/export/copyAs.js +1 -2
  106. package/dist-cjs/lib/utils/export/copyAs.js.map +2 -2
  107. package/dist-cjs/lib/utils/export/export.js +0 -20
  108. package/dist-cjs/lib/utils/export/export.js.map +2 -2
  109. package/dist-cjs/lib/utils/export/exportAs.js +1 -2
  110. package/dist-cjs/lib/utils/export/exportAs.js.map +2 -2
  111. package/dist-esm/index.d.mts +230 -107
  112. package/dist-esm/index.mjs +61 -29
  113. package/dist-esm/index.mjs.map +2 -2
  114. package/dist-esm/lib/Tldraw.mjs +14 -4
  115. package/dist-esm/lib/Tldraw.mjs.map +2 -2
  116. package/dist-esm/lib/defaultExternalContentHandlers.mjs +15 -4
  117. package/dist-esm/lib/defaultExternalContentHandlers.mjs.map +2 -2
  118. package/dist-esm/lib/shapes/arrow/arrowLabel.mjs +6 -0
  119. package/dist-esm/lib/shapes/arrow/arrowLabel.mjs.map +3 -3
  120. package/dist-esm/lib/shapes/bookmark/BookmarkShapeUtil.mjs +5 -5
  121. package/dist-esm/lib/shapes/bookmark/BookmarkShapeUtil.mjs.map +2 -2
  122. package/dist-esm/lib/shapes/frame/FrameShapeUtil.mjs +8 -1
  123. package/dist-esm/lib/shapes/frame/FrameShapeUtil.mjs.map +2 -2
  124. package/dist-esm/lib/shapes/frame/components/FrameLabelInput.mjs +3 -3
  125. package/dist-esm/lib/shapes/frame/components/FrameLabelInput.mjs.map +2 -2
  126. package/dist-esm/lib/shapes/geo/GeoShapeUtil.mjs +1 -0
  127. package/dist-esm/lib/shapes/geo/GeoShapeUtil.mjs.map +2 -2
  128. package/dist-esm/lib/shapes/image/ImageShapeUtil.mjs +3 -0
  129. package/dist-esm/lib/shapes/image/ImageShapeUtil.mjs.map +2 -2
  130. package/dist-esm/lib/shapes/note/NoteShapeUtil.mjs +2 -1
  131. package/dist-esm/lib/shapes/note/NoteShapeUtil.mjs.map +2 -2
  132. package/dist-esm/lib/shapes/shared/HyperlinkButton.mjs +5 -5
  133. package/dist-esm/lib/shapes/shared/HyperlinkButton.mjs.map +2 -2
  134. package/dist-esm/lib/shapes/shared/PlainTextLabel.mjs +1 -3
  135. package/dist-esm/lib/shapes/shared/PlainTextLabel.mjs.map +2 -2
  136. package/dist-esm/lib/shapes/shared/freehand/svg.mjs.map +2 -2
  137. package/dist-esm/lib/shapes/shared/useEditablePlainText.mjs +4 -5
  138. package/dist-esm/lib/shapes/shared/useEditablePlainText.mjs.map +2 -2
  139. package/dist-esm/lib/shapes/shared/useImageOrVideoAsset.mjs +0 -2
  140. package/dist-esm/lib/shapes/shared/useImageOrVideoAsset.mjs.map +2 -2
  141. package/dist-esm/lib/shapes/text/PlainTextArea.mjs +3 -3
  142. package/dist-esm/lib/shapes/text/PlainTextArea.mjs.map +2 -2
  143. package/dist-esm/lib/shapes/text/RichTextArea.mjs +3 -4
  144. package/dist-esm/lib/shapes/text/RichTextArea.mjs.map +2 -2
  145. package/dist-esm/lib/ui/TldrawUi.mjs +13 -12
  146. package/dist-esm/lib/ui/TldrawUi.mjs.map +2 -2
  147. package/dist-esm/lib/ui/assetUrls.mjs +13 -10
  148. package/dist-esm/lib/ui/assetUrls.mjs.map +2 -2
  149. package/dist-esm/lib/ui/components/A11y.mjs +2 -2
  150. package/dist-esm/lib/ui/components/A11y.mjs.map +2 -2
  151. package/dist-esm/lib/ui/components/{FollowingIndicator.mjs → DefaultFollowingIndicator.mjs} +3 -3
  152. package/dist-esm/lib/ui/components/DefaultFollowingIndicator.mjs.map +7 -0
  153. package/dist-esm/lib/ui/components/KeyboardShortcutsDialog/DefaultKeyboardShortcutsDialogContent.mjs +6 -6
  154. package/dist-esm/lib/ui/components/KeyboardShortcutsDialog/DefaultKeyboardShortcutsDialogContent.mjs.map +1 -1
  155. package/dist-esm/lib/ui/components/LanguageMenu.mjs +1 -0
  156. package/dist-esm/lib/ui/components/LanguageMenu.mjs.map +2 -2
  157. package/dist-esm/lib/ui/components/Minimap/DefaultMinimap.mjs +1 -0
  158. package/dist-esm/lib/ui/components/Minimap/DefaultMinimap.mjs.map +2 -2
  159. package/dist-esm/lib/ui/components/PageMenu/DefaultPageMenu.mjs +2 -2
  160. package/dist-esm/lib/ui/components/PageMenu/DefaultPageMenu.mjs.map +2 -2
  161. package/dist-esm/lib/ui/components/StylePanel/DefaultStylePanel.mjs +14 -5
  162. package/dist-esm/lib/ui/components/StylePanel/DefaultStylePanel.mjs.map +2 -2
  163. package/dist-esm/lib/ui/components/StylePanel/DefaultStylePanelContent.mjs +257 -320
  164. package/dist-esm/lib/ui/components/StylePanel/DefaultStylePanelContent.mjs.map +2 -2
  165. package/dist-esm/lib/ui/components/StylePanel/StylePanelButtonPicker.mjs +135 -0
  166. package/dist-esm/lib/ui/components/StylePanel/StylePanelButtonPicker.mjs.map +7 -0
  167. package/dist-esm/lib/ui/components/StylePanel/StylePanelContext.mjs +48 -0
  168. package/dist-esm/lib/ui/components/StylePanel/StylePanelContext.mjs.map +7 -0
  169. package/dist-esm/lib/ui/components/StylePanel/{DoubleDropdownPicker.mjs → StylePanelDoubleDropdownPicker.mjs} +20 -19
  170. package/dist-esm/lib/ui/components/StylePanel/StylePanelDoubleDropdownPicker.mjs.map +7 -0
  171. package/dist-esm/lib/ui/components/StylePanel/{DropdownPicker.mjs → StylePanelDropdownPicker.mjs} +21 -18
  172. package/dist-esm/lib/ui/components/StylePanel/StylePanelDropdownPicker.mjs.map +7 -0
  173. package/dist-esm/lib/ui/components/StylePanel/StylePanelSubheading.mjs +8 -0
  174. package/dist-esm/lib/ui/components/StylePanel/StylePanelSubheading.mjs.map +7 -0
  175. package/dist-esm/lib/ui/components/Toolbar/AltTextEditor.mjs +4 -2
  176. package/dist-esm/lib/ui/components/Toolbar/AltTextEditor.mjs.map +2 -2
  177. package/dist-esm/lib/ui/components/Toolbar/DefaultImageToolbarContent.mjs +38 -9
  178. package/dist-esm/lib/ui/components/Toolbar/DefaultImageToolbarContent.mjs.map +2 -2
  179. package/dist-esm/lib/ui/components/Toolbar/DefaultVideoToolbarContent.mjs +15 -3
  180. package/dist-esm/lib/ui/components/Toolbar/DefaultVideoToolbarContent.mjs.map +2 -2
  181. package/dist-esm/lib/ui/components/Toolbar/LinkEditor.mjs +5 -4
  182. package/dist-esm/lib/ui/components/Toolbar/LinkEditor.mjs.map +2 -2
  183. package/dist-esm/lib/ui/components/primitives/TldrawUiContextualToolbar.mjs +12 -3
  184. package/dist-esm/lib/ui/components/primitives/TldrawUiContextualToolbar.mjs.map +2 -2
  185. package/dist-esm/lib/ui/components/primitives/TldrawUiInput.mjs +3 -3
  186. package/dist-esm/lib/ui/components/primitives/TldrawUiInput.mjs.map +2 -2
  187. package/dist-esm/lib/ui/components/primitives/TldrawUiSlider.mjs +18 -5
  188. package/dist-esm/lib/ui/components/primitives/TldrawUiSlider.mjs.map +2 -2
  189. package/dist-esm/lib/ui/components/primitives/TldrawUiToolbar.mjs +3 -0
  190. package/dist-esm/lib/ui/components/primitives/TldrawUiToolbar.mjs.map +2 -2
  191. package/dist-esm/lib/ui/components/primitives/TldrawUiTooltip.mjs +74 -36
  192. package/dist-esm/lib/ui/components/primitives/TldrawUiTooltip.mjs.map +2 -2
  193. package/dist-esm/lib/ui/components/primitives/menus/TldrawUiMenuCheckboxItem.mjs +3 -0
  194. package/dist-esm/lib/ui/components/primitives/menus/TldrawUiMenuCheckboxItem.mjs.map +2 -2
  195. package/dist-esm/lib/ui/components/primitives/menus/TldrawUiMenuItem.mjs +7 -6
  196. package/dist-esm/lib/ui/components/primitives/menus/TldrawUiMenuItem.mjs.map +2 -2
  197. package/dist-esm/lib/ui/context/actions.mjs +29 -10
  198. package/dist-esm/lib/ui/context/actions.mjs.map +2 -2
  199. package/dist-esm/lib/ui/context/components.mjs +2 -0
  200. package/dist-esm/lib/ui/context/components.mjs.map +2 -2
  201. package/dist-esm/lib/ui/context/events.mjs.map +1 -1
  202. package/dist-esm/lib/ui/hooks/useClipboardEvents.mjs +2 -2
  203. package/dist-esm/lib/ui/hooks/useClipboardEvents.mjs.map +2 -2
  204. package/dist-esm/lib/ui/hooks/useExportAs.mjs +3 -2
  205. package/dist-esm/lib/ui/hooks/useExportAs.mjs.map +2 -2
  206. package/dist-esm/lib/ui/hooks/useTools.mjs +1 -1
  207. package/dist-esm/lib/ui/hooks/useTools.mjs.map +2 -2
  208. package/dist-esm/lib/ui/hooks/useTranslation/defaultTranslation.mjs +6 -2
  209. package/dist-esm/lib/ui/hooks/useTranslation/defaultTranslation.mjs.map +2 -2
  210. package/dist-esm/lib/ui/kbd-utils.mjs +9 -3
  211. package/dist-esm/lib/ui/kbd-utils.mjs.map +2 -2
  212. package/dist-esm/lib/ui/version.mjs +3 -3
  213. package/dist-esm/lib/ui/version.mjs.map +1 -1
  214. package/dist-esm/lib/utils/export/copyAs.mjs +1 -2
  215. package/dist-esm/lib/utils/export/copyAs.mjs.map +2 -2
  216. package/dist-esm/lib/utils/export/export.mjs +0 -20
  217. package/dist-esm/lib/utils/export/export.mjs.map +2 -2
  218. package/dist-esm/lib/utils/export/exportAs.mjs +1 -2
  219. package/dist-esm/lib/utils/export/exportAs.mjs.map +2 -2
  220. package/package.json +11 -34
  221. package/src/index.ts +44 -22
  222. package/src/lib/Tldraw.tsx +15 -2
  223. package/src/lib/defaultExternalContentHandlers.ts +26 -4
  224. package/src/lib/shapes/arrow/ArrowShapeOptions.test.ts +2 -1
  225. package/src/lib/shapes/arrow/ArrowShapeTool.test.ts +6 -5
  226. package/src/lib/shapes/arrow/ArrowShapeUtil.test.ts +48 -6
  227. package/src/lib/shapes/arrow/arrowLabel.ts +8 -0
  228. package/src/lib/shapes/bookmark/BookmarkShapeUtil.tsx +5 -5
  229. package/src/lib/shapes/draw/DrawShapeTool.test.ts +0 -5
  230. package/src/lib/shapes/frame/FrameShapeUtil.tsx +9 -0
  231. package/src/lib/shapes/frame/components/FrameLabelInput.tsx +3 -3
  232. package/src/lib/shapes/geo/GeoShapeUtil.tsx +1 -0
  233. package/src/lib/shapes/image/ImageShapeUtil.tsx +3 -0
  234. package/src/lib/shapes/line/LineShapeUtil.test.tsx +4 -3
  235. package/src/lib/shapes/line/__snapshots__/LineShapeUtil.test.tsx.snap +2 -2
  236. package/src/lib/shapes/note/NoteShapeUtil.tsx +1 -0
  237. package/src/lib/shapes/shared/HyperlinkButton.tsx +5 -5
  238. package/src/lib/shapes/shared/PlainTextLabel.tsx +0 -6
  239. package/src/lib/shapes/shared/freehand/svg.ts +2 -0
  240. package/src/lib/shapes/shared/useEditablePlainText.ts +5 -9
  241. package/src/lib/shapes/shared/useImageOrVideoAsset.ts +0 -7
  242. package/src/lib/shapes/text/PlainTextArea.tsx +3 -3
  243. package/src/lib/shapes/text/RichTextArea.tsx +3 -4
  244. package/src/lib/shapes/text/TextShapeTool.test.ts +6 -5
  245. package/src/lib/ui/TldrawUi.tsx +16 -10
  246. package/src/lib/ui/assetUrls.ts +13 -10
  247. package/src/lib/ui/components/A11y.tsx +2 -2
  248. package/src/lib/ui/components/{FollowingIndicator.tsx → DefaultFollowingIndicator.tsx} +2 -1
  249. package/src/lib/ui/components/KeyboardShortcutsDialog/DefaultKeyboardShortcutsDialogContent.tsx +6 -6
  250. package/src/lib/ui/components/LanguageMenu.tsx +1 -0
  251. package/src/lib/ui/components/Minimap/DefaultMinimap.tsx +1 -0
  252. package/src/lib/ui/components/PageMenu/DefaultPageMenu.tsx +2 -2
  253. package/src/lib/ui/components/StylePanel/DefaultStylePanel.tsx +27 -13
  254. package/src/lib/ui/components/StylePanel/DefaultStylePanelContent.tsx +260 -381
  255. package/src/lib/ui/components/{primitives/TldrawUiButtonPicker.tsx → StylePanel/StylePanelButtonPicker.tsx} +70 -50
  256. package/src/lib/ui/components/StylePanel/StylePanelContext.tsx +63 -0
  257. package/src/lib/ui/components/StylePanel/{DoubleDropdownPicker.tsx → StylePanelDoubleDropdownPicker.tsx} +28 -19
  258. package/src/lib/ui/components/StylePanel/StylePanelDropdownPicker.tsx +119 -0
  259. package/src/lib/ui/components/StylePanel/StylePanelSubheading.tsx +9 -0
  260. package/src/lib/ui/components/Toolbar/AltTextEditor.tsx +5 -3
  261. package/src/lib/ui/components/Toolbar/DefaultImageToolbarContent.tsx +32 -15
  262. package/src/lib/ui/components/Toolbar/DefaultVideoToolbarContent.tsx +12 -4
  263. package/src/lib/ui/components/Toolbar/LinkEditor.tsx +6 -5
  264. package/src/lib/ui/components/primitives/TldrawUiContextualToolbar.tsx +8 -3
  265. package/src/lib/ui/components/primitives/TldrawUiInput.tsx +3 -3
  266. package/src/lib/ui/components/primitives/TldrawUiSlider.tsx +52 -32
  267. package/src/lib/ui/components/primitives/TldrawUiToolbar.tsx +5 -1
  268. package/src/lib/ui/components/primitives/TldrawUiTooltip.tsx +80 -29
  269. package/src/lib/ui/components/primitives/menus/TldrawUiMenuCheckboxItem.tsx +4 -0
  270. package/src/lib/ui/components/primitives/menus/TldrawUiMenuItem.tsx +9 -8
  271. package/src/lib/ui/context/actions.tsx +36 -10
  272. package/src/lib/ui/context/components.tsx +3 -0
  273. package/src/lib/ui/context/events.tsx +1 -1
  274. package/src/lib/ui/hooks/useClipboardEvents.ts +2 -2
  275. package/src/lib/ui/hooks/useExportAs.ts +3 -2
  276. package/src/lib/ui/hooks/useTools.tsx +1 -1
  277. package/src/lib/ui/hooks/useTranslation/TLUiTranslationKey.ts +4 -0
  278. package/src/lib/ui/hooks/useTranslation/defaultTranslation.ts +6 -2
  279. package/src/lib/ui/kbd-utils.ts +10 -3
  280. package/src/lib/ui/version.ts +3 -3
  281. package/src/lib/ui.css +29 -2
  282. package/src/lib/utils/excalidraw/__snapshots__/putExcalidrawContent.test.tsx.snap +5 -5
  283. package/src/lib/utils/export/copyAs.ts +1 -24
  284. package/src/lib/utils/export/export.ts +0 -36
  285. package/src/lib/utils/export/exportAs.ts +1 -32
  286. package/src/lib/utils/tldr/__snapshots__/buildFromV1Document.test.ts.snap +4 -4
  287. package/src/test/A11y.test.tsx +3 -2
  288. package/src/test/ClickManager.test.ts +7 -6
  289. package/src/test/Editor.test.tsx +20 -19
  290. package/src/test/EraserTool.test.ts +12 -11
  291. package/src/test/HandTool.test.ts +10 -9
  292. package/src/test/HighlightShape.test.ts +2 -1
  293. package/src/test/SelectTool.test.ts +3 -2
  294. package/src/test/TLUserPreferences.test.ts +4 -3
  295. package/src/test/TestEditor.ts +13 -15
  296. package/src/test/TldrawEditor.test.tsx +11 -10
  297. package/src/test/ZoomTool.test.ts +7 -6
  298. package/src/test/__snapshots__/drawing.test.ts.snap +2 -2
  299. package/src/test/__snapshots__/groups.test.tsx.snap +6 -6
  300. package/src/test/__snapshots__/resizing.test.ts.snap +2 -2
  301. package/src/test/arrows-megabus.test.tsx +5 -4
  302. package/src/test/bindings.test.tsx +24 -37
  303. package/src/test/bookmark-shapes.test.ts +1 -8
  304. package/src/test/commands/__snapshots__/getSvgString.test.ts.snap +23 -7
  305. package/src/test/commands/__snapshots__/packShapes.test.ts.snap +8 -8
  306. package/src/test/commands/__snapshots__/zoomToFit.test.ts.snap +2 -2
  307. package/src/test/commands/alignShapes.test.tsx +25 -24
  308. package/src/test/commands/animationSpeed.test.ts +2 -1
  309. package/src/test/commands/centerOnPoint.test.ts +3 -2
  310. package/src/test/commands/clipboard.test.ts +3 -2
  311. package/src/test/commands/createShapes.test.ts +2 -1
  312. package/src/test/commands/deleteShapes.test.ts +2 -1
  313. package/src/test/commands/distributeShapes.test.tsx +11 -10
  314. package/src/test/commands/getSvgString.test.ts +2 -1
  315. package/src/test/commands/packShapes.test.ts +5 -4
  316. package/src/test/commands/resizeShape.test.ts +2 -1
  317. package/src/test/commands/rotateShapes.test.ts +7 -6
  318. package/src/test/commands/setCamera.test.ts +4 -3
  319. package/src/test/commands/setCurrentPage.test.ts +3 -2
  320. package/src/test/commands/stackShapes.test.ts +11 -10
  321. package/src/test/commands/stretch.test.tsx +13 -12
  322. package/src/test/createDeepLink.test.tsx +2 -1
  323. package/src/test/cropping.test.ts +3 -2
  324. package/src/test/custom-clipping.test.ts +436 -0
  325. package/src/test/drawing.test.ts +2 -1
  326. package/src/test/flipShapes.test.ts +4 -3
  327. package/src/test/frames.test.ts +25 -24
  328. package/src/test/getCulledShapes.test.tsx +74 -4
  329. package/src/test/groups.test.tsx +1 -1
  330. package/src/test/handleDeepLink.test.tsx +2 -1
  331. package/src/test/maxShapes.test.ts +3 -2
  332. package/src/test/modifiers.test.ts +5 -4
  333. package/src/test/navigation.test.ts +12 -11
  334. package/src/test/panning.test.ts +2 -1
  335. package/src/test/perf/perf.test.ts +2 -1
  336. package/src/test/registerDeepLinkListener.test.tsx +10 -9
  337. package/src/test/resizing.test.ts +39 -38
  338. package/src/test/select.test.tsx +4 -3
  339. package/src/test/selection-omnibus.test.ts +11 -10
  340. package/src/test/shapeutils.test.ts +4 -3
  341. package/src/test/translating.test.ts +9 -8
  342. package/tldraw.css +45 -5
  343. package/dist-cjs/lib/ui/components/FollowingIndicator.js.map +0 -7
  344. package/dist-cjs/lib/ui/components/StylePanel/DoubleDropdownPicker.js.map +0 -7
  345. package/dist-cjs/lib/ui/components/StylePanel/DropdownPicker.js.map +0 -7
  346. package/dist-cjs/lib/ui/components/primitives/TldrawUiButtonPicker.js +0 -131
  347. package/dist-cjs/lib/ui/components/primitives/TldrawUiButtonPicker.js.map +0 -7
  348. package/dist-esm/lib/ui/components/FollowingIndicator.mjs.map +0 -7
  349. package/dist-esm/lib/ui/components/StylePanel/DoubleDropdownPicker.mjs.map +0 -7
  350. package/dist-esm/lib/ui/components/StylePanel/DropdownPicker.mjs.map +0 -7
  351. package/dist-esm/lib/ui/components/primitives/TldrawUiButtonPicker.mjs +0 -115
  352. package/dist-esm/lib/ui/components/primitives/TldrawUiButtonPicker.mjs.map +0 -7
  353. 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;
@@ -3318,18 +3456,6 @@ export declare interface TLUiButtonLabelProps {
3318
3456
  children?: ReactNode;
3319
3457
  }
3320
3458
 
3321
- /** @public */
3322
- export declare interface TLUiButtonPickerProps<T extends string> {
3323
- title: string;
3324
- uiType: string;
3325
- style: StyleProp<T>;
3326
- value: SharedStyle<T>;
3327
- items: StyleValuesForUi<T>;
3328
- theme: TLDefaultColorTheme;
3329
- onValueChange(style: StyleProp<T>, value: T): void;
3330
- onHistoryMark?(id: string): void;
3331
- }
3332
-
3333
3459
  /** @public */
3334
3460
  export declare interface TLUiButtonProps extends React_2.HTMLAttributes<HTMLButtonElement> {
3335
3461
  disabled?: boolean;
@@ -3364,6 +3490,7 @@ export declare interface TLUiComponents {
3364
3490
  Dialogs?: ComponentType | null;
3365
3491
  Toasts?: ComponentType | null;
3366
3492
  A11y?: ComponentType | null;
3493
+ FollowingIndicator?: ComponentType | null;
3367
3494
  }
3368
3495
 
3369
3496
  /** @public */
@@ -3689,7 +3816,7 @@ export declare interface TLUiEventMap {
3689
3816
  'flatten-to-image': null;
3690
3817
  'a11y-repeat-shape-announce': null;
3691
3818
  'open-url': {
3692
- url: string;
3819
+ destinationUrl: string;
3693
3820
  };
3694
3821
  'open-context-menu': null;
3695
3822
  'adjust-shape-styles': null;
@@ -3814,6 +3941,7 @@ export declare interface TLUiMenuCheckboxItemProps<TranslationKey extends string
3814
3941
  label?: {
3815
3942
  [key: string]: TranslationKey;
3816
3943
  } | TranslationKey;
3944
+ lang?: string;
3817
3945
  readonlyOk?: boolean;
3818
3946
  onSelect(source: TLUiEventSource): Promise<void> | void;
3819
3947
  toggle?: boolean;
@@ -3964,19 +4092,15 @@ export declare interface TLUiSliderProps {
3964
4092
  label: string;
3965
4093
  title: string;
3966
4094
  onValueChange(value: number): void;
3967
- onHistoryMark(id: string): void;
4095
+ onHistoryMark?(id: string): void;
3968
4096
  'data-testid'?: string;
3969
4097
  ariaValueModifier?: number;
3970
4098
  }
3971
4099
 
3972
- /** @public */
3973
- export declare interface TLUiStylePanelContentProps {
3974
- styles: ReturnType<typeof useRelevantStyles>;
3975
- }
3976
-
3977
4100
  /** @public */
3978
4101
  export declare interface TLUiStylePanelProps {
3979
4102
  isMobile?: boolean;
4103
+ styles?: null | ReadonlySharedStyleMap;
3980
4104
  children?: ReactNode;
3981
4105
  }
3982
4106
 
@@ -4045,6 +4169,7 @@ export declare interface TLUiToolbarToggleGroupProps extends React_3.HTMLAttribu
4045
4169
  value: any;
4046
4170
  defaultValue?: any;
4047
4171
  type: 'multiple' | 'single';
4172
+ asChild?: boolean;
4048
4173
  }
4049
4174
 
4050
4175
  /** @public */
@@ -4053,7 +4178,7 @@ export declare interface TLUiToolbarToggleItemProps extends React_3.HTMLAttribut
4053
4178
  className?: string;
4054
4179
  type: 'icon' | 'tool';
4055
4180
  value: string;
4056
- tooltip?: string;
4181
+ tooltip?: React_3.ReactNode;
4057
4182
  }
4058
4183
 
4059
4184
  /** @public */
@@ -4099,7 +4224,7 @@ export declare interface TLUiTranslation {
4099
4224
  export declare type TLUiTranslationContextType = TLUiTranslation;
4100
4225
 
4101
4226
  /** @public */
4102
- 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';
4103
4228
 
4104
4229
  /** @public */
4105
4230
  export declare interface TLUiTranslationProviderProps {
@@ -4281,13 +4406,6 @@ export declare function useA11y(): TLUiA11yContextType;
4281
4406
  /** @public */
4282
4407
  export declare function useActions(): TLUiActionsContextType;
4283
4408
 
4284
- /**
4285
- * @deprecated Use {@link useImageOrVideoAsset} instead.
4286
- *
4287
- * @public
4288
- */
4289
- export declare const useAsset: typeof useImageOrVideoAsset;
4290
-
4291
4409
  /* Excluded from this release type: useAssetUrls */
4292
4410
 
4293
4411
  /** @public */
@@ -4342,7 +4460,11 @@ export declare function useDefaultHelpers(): {
4342
4460
  copy: (source: TLUiEventSource) => Promise<void>;
4343
4461
  copyAs: (ids: TLShapeId[], format?: TLCopyType) => void;
4344
4462
  cut: (source: TLUiEventSource) => Promise<void>;
4345
- 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;
4346
4468
  getEmbedDefinition: (url: string) => TLEmbedResult;
4347
4469
  insertMedia: () => Promise<void>;
4348
4470
  isMobile: boolean;
@@ -4364,7 +4486,7 @@ export declare function useEditablePlainText(shapeId: TLShapeId, type: string, t
4364
4486
  handleChange: ({ plaintext }: {
4365
4487
  plaintext: string;
4366
4488
  }) => void;
4367
- handleDoubleClick: (e: any) => any;
4489
+ handleDoubleClick: (e: React_3.MouseEvent) => void;
4368
4490
  handleFocus: () => void;
4369
4491
  handleInputPointerDown: (e: React_3.PointerEvent) => void;
4370
4492
  handleKeyDown: (e: KeyboardEvent) => void;
@@ -4381,7 +4503,7 @@ export declare function useEditableRichText(shapeId: TLShapeId, type: string, ri
4381
4503
  handleChange: ({ richText }: {
4382
4504
  richText: TLRichText;
4383
4505
  }) => void;
4384
- handleDoubleClick: (e: any) => any;
4506
+ handleDoubleClick: (e: React.MouseEvent) => void;
4385
4507
  handleFocus: () => void;
4386
4508
  handleInputPointerDown: (e: React.PointerEvent) => void;
4387
4509
  handleKeyDown: (e: KeyboardEvent) => void;
@@ -4392,14 +4514,12 @@ export declare function useEditableRichText(shapeId: TLShapeId, type: string, ri
4392
4514
  rInput: RefObject<HTMLDivElement>;
4393
4515
  };
4394
4516
 
4395
- /**
4396
- * @deprecated Use `useEditablePlainText` instead.
4397
- * @public
4398
- */
4399
- export declare const useEditableText: typeof useEditablePlainText;
4400
-
4401
4517
  /** @public */
4402
- 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;
4403
4523
 
4404
4524
  /**
4405
4525
  * This is a handy helper hook that resolves an asset to an optimized URL for a given shape, or its
@@ -4473,6 +4593,9 @@ export declare const useSelectedShapesAnnouncer: () => void;
4473
4593
  /** @public */
4474
4594
  export declare function useShowCollaborationUi(): boolean;
4475
4595
 
4596
+ /** @public */
4597
+ export declare function useStylePanelContext(): StylePanelContext;
4598
+
4476
4599
  /** @public */
4477
4600
  export declare function useTldrawUiComponents(): TLUiComponents;
4478
4601