tldraw 3.16.0-canary.ed8bd30c0f28 → 3.16.0-canary.f293c3bb58f5

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 (363) hide show
  1. package/dist-cjs/index.d.ts +203 -6
  2. package/dist-cjs/index.js +18 -1
  3. package/dist-cjs/index.js.map +2 -2
  4. package/dist-cjs/lib/canvas/TldrawScribble.js +1 -1
  5. package/dist-cjs/lib/canvas/TldrawScribble.js.map +2 -2
  6. package/dist-cjs/lib/shapes/arrow/ArrowShapeUtil.js +3 -3
  7. package/dist-cjs/lib/shapes/arrow/ArrowShapeUtil.js.map +2 -2
  8. package/dist-cjs/lib/shapes/arrow/arrowTargetState.js +1 -1
  9. package/dist-cjs/lib/shapes/arrow/arrowTargetState.js.map +2 -2
  10. package/dist-cjs/lib/shapes/arrow/elbow/ElbowArrowDebug.js +3 -3
  11. package/dist-cjs/lib/shapes/arrow/elbow/ElbowArrowDebug.js.map +1 -1
  12. package/dist-cjs/lib/shapes/draw/DrawShapeUtil.js +3 -3
  13. package/dist-cjs/lib/shapes/draw/DrawShapeUtil.js.map +2 -2
  14. package/dist-cjs/lib/shapes/embed/EmbedShapeUtil.js +1 -1
  15. package/dist-cjs/lib/shapes/embed/EmbedShapeUtil.js.map +1 -1
  16. package/dist-cjs/lib/shapes/frame/FrameShapeUtil.js +12 -12
  17. package/dist-cjs/lib/shapes/frame/FrameShapeUtil.js.map +2 -2
  18. package/dist-cjs/lib/shapes/frame/components/FrameHeading.js +1 -1
  19. package/dist-cjs/lib/shapes/frame/components/FrameHeading.js.map +2 -2
  20. package/dist-cjs/lib/shapes/geo/GeoShapeUtil.js +2 -2
  21. package/dist-cjs/lib/shapes/geo/GeoShapeUtil.js.map +2 -2
  22. package/dist-cjs/lib/shapes/geo/components/GeoShapeBody.js +2 -1
  23. package/dist-cjs/lib/shapes/geo/components/GeoShapeBody.js.map +2 -2
  24. package/dist-cjs/lib/shapes/highlight/HighlightShapeUtil.js +5 -1
  25. package/dist-cjs/lib/shapes/highlight/HighlightShapeUtil.js.map +2 -2
  26. package/dist-cjs/lib/shapes/image/ImageShapeUtil.js +3 -3
  27. package/dist-cjs/lib/shapes/image/ImageShapeUtil.js.map +1 -1
  28. package/dist-cjs/lib/shapes/line/LineShapeUtil.js +5 -1
  29. package/dist-cjs/lib/shapes/line/LineShapeUtil.js.map +2 -2
  30. package/dist-cjs/lib/shapes/note/NoteShapeUtil.js +4 -4
  31. package/dist-cjs/lib/shapes/note/NoteShapeUtil.js.map +2 -2
  32. package/dist-cjs/lib/shapes/shared/ShapeFill.js +4 -4
  33. package/dist-cjs/lib/shapes/shared/ShapeFill.js.map +2 -2
  34. package/dist-cjs/lib/shapes/shared/freehand/svg.js.map +2 -2
  35. package/dist-cjs/lib/shapes/shared/usePrefersReducedMotion.js +10 -1
  36. package/dist-cjs/lib/shapes/shared/usePrefersReducedMotion.js.map +2 -2
  37. package/dist-cjs/lib/shapes/text/TextShapeUtil.js +2 -2
  38. package/dist-cjs/lib/shapes/text/TextShapeUtil.js.map +2 -2
  39. package/dist-cjs/lib/shapes/video/VideoShapeUtil.js +3 -3
  40. package/dist-cjs/lib/shapes/video/VideoShapeUtil.js.map +1 -1
  41. package/dist-cjs/lib/tools/EraserTool/childStates/Erasing.js +25 -1
  42. package/dist-cjs/lib/tools/EraserTool/childStates/Erasing.js.map +2 -2
  43. package/dist-cjs/lib/tools/EraserTool/childStates/Pointing.js +12 -0
  44. package/dist-cjs/lib/tools/EraserTool/childStates/Pointing.js.map +2 -2
  45. package/dist-cjs/lib/tools/SelectTool/childStates/Translating.js.map +2 -2
  46. package/dist-cjs/lib/ui/TldrawUi.js +14 -0
  47. package/dist-cjs/lib/ui/TldrawUi.js.map +3 -3
  48. package/dist-cjs/lib/ui/assetUrls.js +13 -10
  49. package/dist-cjs/lib/ui/assetUrls.js.map +2 -2
  50. package/dist-cjs/lib/ui/components/AccessibilityMenu.js +35 -0
  51. package/dist-cjs/lib/ui/components/AccessibilityMenu.js.map +7 -0
  52. package/dist-cjs/lib/ui/components/ActionsMenu/DefaultActionsMenu.js +12 -3
  53. package/dist-cjs/lib/ui/components/ActionsMenu/DefaultActionsMenu.js.map +2 -2
  54. package/dist-cjs/lib/ui/components/DefaultMenuPanel.js +3 -2
  55. package/dist-cjs/lib/ui/components/DefaultMenuPanel.js.map +2 -2
  56. package/dist-cjs/lib/ui/components/KeyboardShortcutsDialog/DefaultKeyboardShortcutsDialogContent.js +1 -1
  57. package/dist-cjs/lib/ui/components/KeyboardShortcutsDialog/DefaultKeyboardShortcutsDialogContent.js.map +1 -1
  58. package/dist-cjs/lib/ui/components/MainMenu/DefaultMainMenuContent.js +3 -3
  59. package/dist-cjs/lib/ui/components/MainMenu/DefaultMainMenuContent.js.map +2 -2
  60. package/dist-cjs/lib/ui/components/Minimap/MinimapManager.js +4 -4
  61. package/dist-cjs/lib/ui/components/Minimap/MinimapManager.js.map +2 -2
  62. package/dist-cjs/lib/ui/components/MobileStylePanel.js +5 -3
  63. package/dist-cjs/lib/ui/components/MobileStylePanel.js.map +2 -2
  64. package/dist-cjs/lib/ui/components/NavigationPanel/DefaultNavigationPanel.js +1 -1
  65. package/dist-cjs/lib/ui/components/NavigationPanel/DefaultNavigationPanel.js.map +2 -2
  66. package/dist-cjs/lib/ui/components/PageMenu/DefaultPageMenu.js +2 -1
  67. package/dist-cjs/lib/ui/components/PageMenu/DefaultPageMenu.js.map +2 -2
  68. package/dist-cjs/lib/ui/components/SharePanel/PeopleMenuItem.js +3 -2
  69. package/dist-cjs/lib/ui/components/SharePanel/PeopleMenuItem.js.map +2 -2
  70. package/dist-cjs/lib/ui/components/SharePanel/UserPresenceColorPicker.js +2 -2
  71. package/dist-cjs/lib/ui/components/SharePanel/UserPresenceColorPicker.js.map +2 -2
  72. package/dist-cjs/lib/ui/components/StylePanel/DefaultStylePanel.js +2 -0
  73. package/dist-cjs/lib/ui/components/StylePanel/DefaultStylePanel.js.map +2 -2
  74. package/dist-cjs/lib/ui/components/StylePanel/DefaultStylePanelContent.js +171 -140
  75. package/dist-cjs/lib/ui/components/StylePanel/DefaultStylePanelContent.js.map +2 -2
  76. package/dist-cjs/lib/ui/components/StylePanel/DoubleDropdownPicker.js +3 -3
  77. package/dist-cjs/lib/ui/components/StylePanel/DoubleDropdownPicker.js.map +2 -2
  78. package/dist-cjs/lib/ui/components/StylePanel/DropdownPicker.js +26 -25
  79. package/dist-cjs/lib/ui/components/StylePanel/DropdownPicker.js.map +3 -3
  80. package/dist-cjs/lib/ui/components/Toolbar/DefaultImageToolbarContent.js +1 -1
  81. package/dist-cjs/lib/ui/components/Toolbar/DefaultImageToolbarContent.js.map +2 -2
  82. package/dist-cjs/lib/ui/components/Toolbar/DefaultToolbar.js +66 -21
  83. package/dist-cjs/lib/ui/components/Toolbar/DefaultToolbar.js.map +3 -3
  84. package/dist-cjs/lib/ui/components/Toolbar/OverflowingToolbar.js +189 -80
  85. package/dist-cjs/lib/ui/components/Toolbar/OverflowingToolbar.js.map +3 -3
  86. package/dist-cjs/lib/ui/components/Toolbar/ToggleToolLockedButton.js +5 -4
  87. package/dist-cjs/lib/ui/components/Toolbar/ToggleToolLockedButton.js.map +2 -2
  88. package/dist-cjs/lib/ui/components/menu-items.js +6 -0
  89. package/dist-cjs/lib/ui/components/menu-items.js.map +2 -2
  90. package/dist-cjs/lib/ui/components/primitives/TldrawUiButtonPicker.js +5 -16
  91. package/dist-cjs/lib/ui/components/primitives/TldrawUiButtonPicker.js.map +3 -3
  92. package/dist-cjs/lib/ui/components/primitives/TldrawUiContextualToolbar.js +1 -1
  93. package/dist-cjs/lib/ui/components/primitives/TldrawUiContextualToolbar.js.map +2 -2
  94. package/dist-cjs/lib/ui/components/primitives/TldrawUiPopover.js +3 -2
  95. package/dist-cjs/lib/ui/components/primitives/TldrawUiPopover.js.map +3 -3
  96. package/dist-cjs/lib/ui/components/primitives/TldrawUiToolbar.js +30 -7
  97. package/dist-cjs/lib/ui/components/primitives/TldrawUiToolbar.js.map +2 -2
  98. package/dist-cjs/lib/ui/components/primitives/TldrawUiTooltip.js +262 -0
  99. package/dist-cjs/lib/ui/components/primitives/TldrawUiTooltip.js.map +7 -0
  100. package/dist-cjs/lib/ui/components/primitives/layout.js +76 -0
  101. package/dist-cjs/lib/ui/components/primitives/layout.js.map +7 -0
  102. package/dist-cjs/lib/ui/components/primitives/menus/TldrawUiMenuContext.js.map +2 -2
  103. package/dist-cjs/lib/ui/components/primitives/menus/TldrawUiMenuGroup.js +25 -12
  104. package/dist-cjs/lib/ui/components/primitives/menus/TldrawUiMenuGroup.js.map +2 -2
  105. package/dist-cjs/lib/ui/components/primitives/menus/TldrawUiMenuItem.js +154 -20
  106. package/dist-cjs/lib/ui/components/primitives/menus/TldrawUiMenuItem.js.map +2 -2
  107. package/dist-cjs/lib/ui/context/TldrawUiContextProvider.js +3 -2
  108. package/dist-cjs/lib/ui/context/TldrawUiContextProvider.js.map +2 -2
  109. package/dist-cjs/lib/ui/context/actions.js +31 -2
  110. package/dist-cjs/lib/ui/context/actions.js.map +2 -2
  111. package/dist-cjs/lib/ui/context/events.js.map +2 -2
  112. package/dist-cjs/lib/ui/hooks/useTools.js +94 -9
  113. package/dist-cjs/lib/ui/hooks/useTools.js.map +2 -2
  114. package/dist-cjs/lib/ui/hooks/useTranslation/TLUiTranslationKey.js.map +1 -1
  115. package/dist-cjs/lib/ui/hooks/useTranslation/defaultTranslation.js +3 -0
  116. package/dist-cjs/lib/ui/hooks/useTranslation/defaultTranslation.js.map +2 -2
  117. package/dist-cjs/lib/ui/version.js +3 -3
  118. package/dist-cjs/lib/ui/version.js.map +1 -1
  119. package/dist-esm/index.d.mts +203 -6
  120. package/dist-esm/index.mjs +29 -1
  121. package/dist-esm/index.mjs.map +2 -2
  122. package/dist-esm/lib/canvas/TldrawScribble.mjs +1 -1
  123. package/dist-esm/lib/canvas/TldrawScribble.mjs.map +2 -2
  124. package/dist-esm/lib/shapes/arrow/ArrowShapeUtil.mjs +4 -3
  125. package/dist-esm/lib/shapes/arrow/ArrowShapeUtil.mjs.map +2 -2
  126. package/dist-esm/lib/shapes/arrow/arrowTargetState.mjs +1 -1
  127. package/dist-esm/lib/shapes/arrow/arrowTargetState.mjs.map +2 -2
  128. package/dist-esm/lib/shapes/arrow/elbow/ElbowArrowDebug.mjs +3 -3
  129. package/dist-esm/lib/shapes/arrow/elbow/ElbowArrowDebug.mjs.map +1 -1
  130. package/dist-esm/lib/shapes/draw/DrawShapeUtil.mjs +4 -3
  131. package/dist-esm/lib/shapes/draw/DrawShapeUtil.mjs.map +2 -2
  132. package/dist-esm/lib/shapes/embed/EmbedShapeUtil.mjs +1 -1
  133. package/dist-esm/lib/shapes/embed/EmbedShapeUtil.mjs.map +1 -1
  134. package/dist-esm/lib/shapes/frame/FrameShapeUtil.mjs +13 -12
  135. package/dist-esm/lib/shapes/frame/FrameShapeUtil.mjs.map +2 -2
  136. package/dist-esm/lib/shapes/frame/components/FrameHeading.mjs +1 -1
  137. package/dist-esm/lib/shapes/frame/components/FrameHeading.mjs.map +2 -2
  138. package/dist-esm/lib/shapes/geo/GeoShapeUtil.mjs +3 -2
  139. package/dist-esm/lib/shapes/geo/GeoShapeUtil.mjs.map +2 -2
  140. package/dist-esm/lib/shapes/geo/components/GeoShapeBody.mjs +2 -1
  141. package/dist-esm/lib/shapes/geo/components/GeoShapeBody.mjs.map +2 -2
  142. package/dist-esm/lib/shapes/highlight/HighlightShapeUtil.mjs +6 -1
  143. package/dist-esm/lib/shapes/highlight/HighlightShapeUtil.mjs.map +2 -2
  144. package/dist-esm/lib/shapes/image/ImageShapeUtil.mjs +3 -3
  145. package/dist-esm/lib/shapes/image/ImageShapeUtil.mjs.map +1 -1
  146. package/dist-esm/lib/shapes/line/LineShapeUtil.mjs +6 -1
  147. package/dist-esm/lib/shapes/line/LineShapeUtil.mjs.map +2 -2
  148. package/dist-esm/lib/shapes/note/NoteShapeUtil.mjs +5 -4
  149. package/dist-esm/lib/shapes/note/NoteShapeUtil.mjs.map +2 -2
  150. package/dist-esm/lib/shapes/shared/ShapeFill.mjs +5 -4
  151. package/dist-esm/lib/shapes/shared/ShapeFill.mjs.map +2 -2
  152. package/dist-esm/lib/shapes/shared/freehand/svg.mjs.map +2 -2
  153. package/dist-esm/lib/shapes/shared/usePrefersReducedMotion.mjs +10 -1
  154. package/dist-esm/lib/shapes/shared/usePrefersReducedMotion.mjs.map +2 -2
  155. package/dist-esm/lib/shapes/text/TextShapeUtil.mjs +3 -2
  156. package/dist-esm/lib/shapes/text/TextShapeUtil.mjs.map +2 -2
  157. package/dist-esm/lib/shapes/video/VideoShapeUtil.mjs +3 -3
  158. package/dist-esm/lib/shapes/video/VideoShapeUtil.mjs.map +1 -1
  159. package/dist-esm/lib/tools/EraserTool/childStates/Erasing.mjs +26 -1
  160. package/dist-esm/lib/tools/EraserTool/childStates/Erasing.mjs.map +2 -2
  161. package/dist-esm/lib/tools/EraserTool/childStates/Pointing.mjs +13 -0
  162. package/dist-esm/lib/tools/EraserTool/childStates/Pointing.mjs.map +2 -2
  163. package/dist-esm/lib/tools/SelectTool/childStates/Translating.mjs.map +2 -2
  164. package/dist-esm/lib/ui/TldrawUi.mjs +16 -2
  165. package/dist-esm/lib/ui/TldrawUi.mjs.map +3 -3
  166. package/dist-esm/lib/ui/assetUrls.mjs +13 -10
  167. package/dist-esm/lib/ui/assetUrls.mjs.map +2 -2
  168. package/dist-esm/lib/ui/components/AccessibilityMenu.mjs +19 -0
  169. package/dist-esm/lib/ui/components/AccessibilityMenu.mjs.map +7 -0
  170. package/dist-esm/lib/ui/components/ActionsMenu/DefaultActionsMenu.mjs +12 -3
  171. package/dist-esm/lib/ui/components/ActionsMenu/DefaultActionsMenu.mjs.map +2 -2
  172. package/dist-esm/lib/ui/components/DefaultMenuPanel.mjs +3 -2
  173. package/dist-esm/lib/ui/components/DefaultMenuPanel.mjs.map +2 -2
  174. package/dist-esm/lib/ui/components/KeyboardShortcutsDialog/DefaultKeyboardShortcutsDialogContent.mjs +1 -1
  175. package/dist-esm/lib/ui/components/KeyboardShortcutsDialog/DefaultKeyboardShortcutsDialogContent.mjs.map +1 -1
  176. package/dist-esm/lib/ui/components/MainMenu/DefaultMainMenuContent.mjs +3 -5
  177. package/dist-esm/lib/ui/components/MainMenu/DefaultMainMenuContent.mjs.map +2 -2
  178. package/dist-esm/lib/ui/components/Minimap/MinimapManager.mjs +4 -4
  179. package/dist-esm/lib/ui/components/Minimap/MinimapManager.mjs.map +2 -2
  180. package/dist-esm/lib/ui/components/MobileStylePanel.mjs +6 -3
  181. package/dist-esm/lib/ui/components/MobileStylePanel.mjs.map +2 -2
  182. package/dist-esm/lib/ui/components/NavigationPanel/DefaultNavigationPanel.mjs +1 -1
  183. package/dist-esm/lib/ui/components/NavigationPanel/DefaultNavigationPanel.mjs.map +2 -2
  184. package/dist-esm/lib/ui/components/PageMenu/DefaultPageMenu.mjs +2 -1
  185. package/dist-esm/lib/ui/components/PageMenu/DefaultPageMenu.mjs.map +2 -2
  186. package/dist-esm/lib/ui/components/SharePanel/PeopleMenuItem.mjs +3 -2
  187. package/dist-esm/lib/ui/components/SharePanel/PeopleMenuItem.mjs.map +2 -2
  188. package/dist-esm/lib/ui/components/SharePanel/UserPresenceColorPicker.mjs +2 -2
  189. package/dist-esm/lib/ui/components/SharePanel/UserPresenceColorPicker.mjs.map +2 -2
  190. package/dist-esm/lib/ui/components/StylePanel/DefaultStylePanel.mjs +3 -1
  191. package/dist-esm/lib/ui/components/StylePanel/DefaultStylePanel.mjs.map +2 -2
  192. package/dist-esm/lib/ui/components/StylePanel/DefaultStylePanelContent.mjs +171 -140
  193. package/dist-esm/lib/ui/components/StylePanel/DefaultStylePanelContent.mjs.map +2 -2
  194. package/dist-esm/lib/ui/components/StylePanel/DoubleDropdownPicker.mjs +3 -3
  195. package/dist-esm/lib/ui/components/StylePanel/DoubleDropdownPicker.mjs.map +2 -2
  196. package/dist-esm/lib/ui/components/StylePanel/DropdownPicker.mjs +26 -25
  197. package/dist-esm/lib/ui/components/StylePanel/DropdownPicker.mjs.map +2 -2
  198. package/dist-esm/lib/ui/components/Toolbar/DefaultImageToolbarContent.mjs +1 -1
  199. package/dist-esm/lib/ui/components/Toolbar/DefaultImageToolbarContent.mjs.map +2 -2
  200. package/dist-esm/lib/ui/components/Toolbar/DefaultToolbar.mjs +56 -21
  201. package/dist-esm/lib/ui/components/Toolbar/DefaultToolbar.mjs.map +2 -2
  202. package/dist-esm/lib/ui/components/Toolbar/OverflowingToolbar.mjs +192 -81
  203. package/dist-esm/lib/ui/components/Toolbar/OverflowingToolbar.mjs.map +3 -3
  204. package/dist-esm/lib/ui/components/Toolbar/ToggleToolLockedButton.mjs +5 -4
  205. package/dist-esm/lib/ui/components/Toolbar/ToggleToolLockedButton.mjs.map +2 -2
  206. package/dist-esm/lib/ui/components/menu-items.mjs +6 -0
  207. package/dist-esm/lib/ui/components/menu-items.mjs.map +2 -2
  208. package/dist-esm/lib/ui/components/primitives/TldrawUiButtonPicker.mjs +6 -6
  209. package/dist-esm/lib/ui/components/primitives/TldrawUiButtonPicker.mjs.map +2 -2
  210. package/dist-esm/lib/ui/components/primitives/TldrawUiContextualToolbar.mjs +1 -1
  211. package/dist-esm/lib/ui/components/primitives/TldrawUiContextualToolbar.mjs.map +2 -2
  212. package/dist-esm/lib/ui/components/primitives/TldrawUiPopover.mjs +3 -2
  213. package/dist-esm/lib/ui/components/primitives/TldrawUiPopover.mjs.map +2 -2
  214. package/dist-esm/lib/ui/components/primitives/TldrawUiToolbar.mjs +30 -7
  215. package/dist-esm/lib/ui/components/primitives/TldrawUiToolbar.mjs.map +2 -2
  216. package/dist-esm/lib/ui/components/primitives/TldrawUiTooltip.mjs +239 -0
  217. package/dist-esm/lib/ui/components/primitives/TldrawUiTooltip.mjs.map +7 -0
  218. package/dist-esm/lib/ui/components/primitives/layout.mjs +46 -0
  219. package/dist-esm/lib/ui/components/primitives/layout.mjs.map +7 -0
  220. package/dist-esm/lib/ui/components/primitives/menus/TldrawUiMenuContext.mjs.map +2 -2
  221. package/dist-esm/lib/ui/components/primitives/menus/TldrawUiMenuGroup.mjs +25 -12
  222. package/dist-esm/lib/ui/components/primitives/menus/TldrawUiMenuGroup.mjs.map +2 -2
  223. package/dist-esm/lib/ui/components/primitives/menus/TldrawUiMenuItem.mjs +162 -22
  224. package/dist-esm/lib/ui/components/primitives/menus/TldrawUiMenuItem.mjs.map +2 -2
  225. package/dist-esm/lib/ui/context/TldrawUiContextProvider.mjs +3 -2
  226. package/dist-esm/lib/ui/context/TldrawUiContextProvider.mjs.map +2 -2
  227. package/dist-esm/lib/ui/context/actions.mjs +31 -2
  228. package/dist-esm/lib/ui/context/actions.mjs.map +2 -2
  229. package/dist-esm/lib/ui/context/events.mjs.map +2 -2
  230. package/dist-esm/lib/ui/hooks/useTools.mjs +102 -10
  231. package/dist-esm/lib/ui/hooks/useTools.mjs.map +2 -2
  232. package/dist-esm/lib/ui/hooks/useTranslation/defaultTranslation.mjs +3 -0
  233. package/dist-esm/lib/ui/hooks/useTranslation/defaultTranslation.mjs.map +2 -2
  234. package/dist-esm/lib/ui/version.mjs +3 -3
  235. package/dist-esm/lib/ui/version.mjs.map +1 -1
  236. package/package.json +11 -34
  237. package/src/index.ts +23 -0
  238. package/src/lib/canvas/TldrawScribble.tsx +1 -1
  239. package/src/lib/shapes/arrow/ArrowShapeOptions.test.ts +2 -1
  240. package/src/lib/shapes/arrow/ArrowShapeTool.test.ts +4 -3
  241. package/src/lib/shapes/arrow/ArrowShapeUtil.test.ts +7 -6
  242. package/src/lib/shapes/arrow/ArrowShapeUtil.tsx +4 -3
  243. package/src/lib/shapes/arrow/arrowTargetState.ts +2 -1
  244. package/src/lib/shapes/arrow/elbow/ElbowArrowDebug.tsx +3 -3
  245. package/src/lib/shapes/draw/DrawShapeTool.test.ts +0 -5
  246. package/src/lib/shapes/draw/DrawShapeUtil.tsx +4 -3
  247. package/src/lib/shapes/embed/EmbedShapeUtil.tsx +1 -1
  248. package/src/lib/shapes/frame/FrameShapeUtil.tsx +21 -14
  249. package/src/lib/shapes/frame/components/FrameHeading.tsx +1 -1
  250. package/src/lib/shapes/geo/GeoShapeUtil.tsx +3 -2
  251. package/src/lib/shapes/geo/components/GeoShapeBody.tsx +2 -2
  252. package/src/lib/shapes/highlight/HighlightShapeUtil.tsx +7 -1
  253. package/src/lib/shapes/image/ImageShapeUtil.tsx +3 -3
  254. package/src/lib/shapes/line/LineShapeUtil.test.tsx +4 -3
  255. package/src/lib/shapes/line/LineShapeUtil.tsx +6 -1
  256. package/src/lib/shapes/line/__snapshots__/LineShapeUtil.test.tsx.snap +2 -2
  257. package/src/lib/shapes/note/NoteShapeUtil.tsx +9 -4
  258. package/src/lib/shapes/shared/ShapeFill.tsx +5 -4
  259. package/src/lib/shapes/shared/freehand/svg.ts +2 -0
  260. package/src/lib/shapes/shared/usePrefersReducedMotion.tsx +11 -1
  261. package/src/lib/shapes/text/TextShapeTool.test.ts +6 -5
  262. package/src/lib/shapes/text/TextShapeUtil.tsx +3 -2
  263. package/src/lib/shapes/video/VideoShapeUtil.tsx +3 -3
  264. package/src/lib/tools/EraserTool/childStates/Erasing.ts +34 -1
  265. package/src/lib/tools/EraserTool/childStates/Pointing.ts +20 -0
  266. package/src/lib/tools/SelectTool/childStates/Translating.ts +0 -1
  267. package/src/lib/ui/TldrawUi.tsx +17 -2
  268. package/src/lib/ui/assetUrls.ts +13 -10
  269. package/src/lib/ui/components/AccessibilityMenu.tsx +20 -0
  270. package/src/lib/ui/components/ActionsMenu/DefaultActionsMenu.tsx +15 -3
  271. package/src/lib/ui/components/DefaultMenuPanel.tsx +4 -3
  272. package/src/lib/ui/components/KeyboardShortcutsDialog/DefaultKeyboardShortcutsDialogContent.tsx +1 -1
  273. package/src/lib/ui/components/MainMenu/DefaultMainMenuContent.tsx +4 -4
  274. package/src/lib/ui/components/Minimap/MinimapManager.ts +4 -4
  275. package/src/lib/ui/components/MobileStylePanel.tsx +9 -6
  276. package/src/lib/ui/components/NavigationPanel/DefaultNavigationPanel.tsx +1 -1
  277. package/src/lib/ui/components/PageMenu/DefaultPageMenu.tsx +3 -2
  278. package/src/lib/ui/components/SharePanel/PeopleMenuItem.tsx +4 -3
  279. package/src/lib/ui/components/SharePanel/UserPresenceColorPicker.tsx +3 -3
  280. package/src/lib/ui/components/StylePanel/DefaultStylePanel.tsx +3 -1
  281. package/src/lib/ui/components/StylePanel/DefaultStylePanelContent.tsx +146 -107
  282. package/src/lib/ui/components/StylePanel/DoubleDropdownPicker.tsx +3 -3
  283. package/src/lib/ui/components/StylePanel/DropdownPicker.tsx +7 -6
  284. package/src/lib/ui/components/Toolbar/DefaultImageToolbarContent.tsx +1 -1
  285. package/src/lib/ui/components/Toolbar/DefaultToolbar.tsx +55 -23
  286. package/src/lib/ui/components/Toolbar/OverflowingToolbar.tsx +212 -61
  287. package/src/lib/ui/components/Toolbar/ToggleToolLockedButton.tsx +14 -11
  288. package/src/lib/ui/components/menu-items.tsx +8 -0
  289. package/src/lib/ui/components/primitives/TldrawUiButtonPicker.tsx +40 -37
  290. package/src/lib/ui/components/primitives/TldrawUiContextualToolbar.tsx +1 -1
  291. package/src/lib/ui/components/primitives/TldrawUiPopover.tsx +4 -2
  292. package/src/lib/ui/components/primitives/TldrawUiToolbar.tsx +51 -12
  293. package/src/lib/ui/components/primitives/TldrawUiTooltip.tsx +325 -0
  294. package/src/lib/ui/components/primitives/layout.tsx +107 -0
  295. package/src/lib/ui/components/primitives/menus/TldrawUiMenuContext.tsx +0 -1
  296. package/src/lib/ui/components/primitives/menus/TldrawUiMenuGroup.tsx +29 -16
  297. package/src/lib/ui/components/primitives/menus/TldrawUiMenuItem.tsx +221 -19
  298. package/src/lib/ui/context/TldrawUiContextProvider.tsx +23 -20
  299. package/src/lib/ui/context/actions.tsx +31 -2
  300. package/src/lib/ui/context/events.tsx +2 -0
  301. package/src/lib/ui/hooks/useTools.tsx +140 -10
  302. package/src/lib/ui/hooks/useTranslation/TLUiTranslationKey.ts +3 -0
  303. package/src/lib/ui/hooks/useTranslation/defaultTranslation.ts +3 -0
  304. package/src/lib/ui/version.ts +3 -3
  305. package/src/lib/ui.css +409 -292
  306. package/src/lib/utils/excalidraw/__snapshots__/putExcalidrawContent.test.tsx.snap +5 -5
  307. package/src/lib/utils/tldr/__snapshots__/buildFromV1Document.test.ts.snap +4 -4
  308. package/src/test/A11y.test.tsx +3 -2
  309. package/src/test/ClickManager.test.ts +7 -6
  310. package/src/test/Editor.test.tsx +20 -19
  311. package/src/test/EraserTool.test.ts +184 -13
  312. package/src/test/HandTool.test.ts +10 -9
  313. package/src/test/HighlightShape.test.ts +2 -1
  314. package/src/test/SelectTool.test.ts +3 -2
  315. package/src/test/TLUserPreferences.test.ts +4 -3
  316. package/src/test/TestEditor.ts +13 -15
  317. package/src/test/TldrawEditor.test.tsx +11 -10
  318. package/src/test/ZoomTool.test.ts +7 -6
  319. package/src/test/__snapshots__/drawing.test.ts.snap +2 -2
  320. package/src/test/__snapshots__/groups.test.tsx.snap +6 -6
  321. package/src/test/__snapshots__/resizing.test.ts.snap +2 -2
  322. package/src/test/arrows-megabus.test.tsx +17 -10
  323. package/src/test/bindings.test.tsx +24 -37
  324. package/src/test/bookmark-shapes.test.ts +1 -8
  325. package/src/test/commands/__snapshots__/getSvgString.test.ts.snap +23 -7
  326. package/src/test/commands/__snapshots__/packShapes.test.ts.snap +8 -8
  327. package/src/test/commands/__snapshots__/zoomToFit.test.ts.snap +2 -2
  328. package/src/test/commands/alignShapes.test.tsx +25 -24
  329. package/src/test/commands/animationSpeed.test.ts +2 -1
  330. package/src/test/commands/centerOnPoint.test.ts +3 -2
  331. package/src/test/commands/clipboard.test.ts +3 -2
  332. package/src/test/commands/createShapes.test.ts +2 -1
  333. package/src/test/commands/deleteShapes.test.ts +2 -1
  334. package/src/test/commands/distributeShapes.test.tsx +11 -10
  335. package/src/test/commands/getSvgString.test.ts +2 -1
  336. package/src/test/commands/packShapes.test.ts +5 -4
  337. package/src/test/commands/resizeShape.test.ts +2 -1
  338. package/src/test/commands/rotateShapes.test.ts +7 -6
  339. package/src/test/commands/setCamera.test.ts +4 -3
  340. package/src/test/commands/setCurrentPage.test.ts +3 -2
  341. package/src/test/commands/stackShapes.test.ts +11 -10
  342. package/src/test/commands/stretch.test.tsx +13 -12
  343. package/src/test/createDeepLink.test.tsx +2 -1
  344. package/src/test/cropping.test.ts +3 -2
  345. package/src/test/drawing.test.ts +2 -1
  346. package/src/test/flipShapes.test.ts +4 -3
  347. package/src/test/frames.test.ts +25 -24
  348. package/src/test/getCulledShapes.test.tsx +3 -2
  349. package/src/test/groups.test.tsx +1 -1
  350. package/src/test/handleDeepLink.test.tsx +2 -1
  351. package/src/test/inner-outer-margin.test.ts +315 -0
  352. package/src/test/maxShapes.test.ts +3 -2
  353. package/src/test/modifiers.test.ts +5 -4
  354. package/src/test/navigation.test.ts +12 -11
  355. package/src/test/panning.test.ts +2 -1
  356. package/src/test/perf/perf.test.ts +2 -1
  357. package/src/test/registerDeepLinkListener.test.tsx +10 -9
  358. package/src/test/resizing.test.ts +39 -38
  359. package/src/test/select.test.tsx +4 -3
  360. package/src/test/selection-omnibus.test.ts +11 -10
  361. package/src/test/shapeutils.test.ts +4 -3
  362. package/src/test/translating.test.ts +9 -8
  363. package/tldraw.css +702 -580
@@ -13,11 +13,13 @@ import { CSSProperties } from 'react';
13
13
  import { Editor } from '@tldraw/editor';
14
14
  import { Extension } from '@tiptap/core';
15
15
  import { Extensions } from '@tiptap/core';
16
+ import { ForwardRefExoticComponent } from 'react';
16
17
  import { Geometry2d } from '@tldraw/editor';
17
18
  import { Geometry2dFilters } from '@tldraw/editor';
18
19
  import { Geometry2dOptions } from '@tldraw/editor';
19
20
  import { Group2d } from '@tldraw/editor';
20
21
  import { HandleSnapGeometry } from '@tldraw/editor';
22
+ import { HTMLAttributes } from 'react';
21
23
  import { IndexKey } from '@tldraw/editor';
22
24
  import { JsonObject } from '@tldraw/editor';
23
25
  import { JSX as JSX_2 } from 'react/jsx-runtime';
@@ -37,6 +39,7 @@ import { ReadonlySharedStyleMap } from '@tldraw/editor';
37
39
  import { RecordProps } from '@tldraw/editor';
38
40
  import { Rectangle2d } from '@tldraw/editor';
39
41
  import { RecursivePartial } from '@tldraw/editor';
42
+ import { RefAttributes } from 'react';
40
43
  import { RefObject } from 'react';
41
44
  import { Result } from '@tldraw/editor';
42
45
  import { RichTextFontVisitorState } from '@tldraw/editor';
@@ -148,6 +151,9 @@ export declare interface A11yProviderProps {
148
151
  children: React.ReactNode;
149
152
  }
150
153
 
154
+ /** @public @react */
155
+ export declare function AccessibilityMenu(): JSX_2.Element;
156
+
151
157
  /** @public */
152
158
  export declare interface ActionsProviderProps {
153
159
  overrides?(editor: Editor, actions: TLUiActionsContextType, helpers: TLUiOverrideHelpers): TLUiActionsContextType;
@@ -1011,6 +1017,11 @@ export declare function DefaultToolbarContent(): JSX_2.Element;
1011
1017
  /** @public */
1012
1018
  export declare interface DefaultToolbarProps {
1013
1019
  children?: ReactNode;
1020
+ orientation?: 'horizontal' | 'vertical';
1021
+ minItems?: number;
1022
+ minSizePx?: number;
1023
+ maxItems?: number;
1024
+ maxSizePx?: number;
1014
1025
  }
1015
1026
 
1016
1027
  /** @public */
@@ -1769,6 +1780,29 @@ export declare function getHitShapeOnCanvasPointerDown(editor: Editor, hitLabels
1769
1780
  /** @public */
1770
1781
  export declare function getMediaAssetInfoPartial(file: File, assetId: TLAssetId, isImageType: boolean, isVideoType: boolean, maxImageDimension?: number): Promise<TLImageAsset | TLVideoAsset>;
1771
1782
 
1783
+ /**
1784
+ * ## getStrokePoints
1785
+ *
1786
+ * Get an array of points as objects with an adjusted point, pressure, vector, distance, and
1787
+ * runningLength.
1788
+ *
1789
+ * @param points - An array of points (as `[x, y, pressure]` or `{x, y, pressure}`). Pressure is
1790
+ * optional in both cases.
1791
+ * @param options - An object with options.
1792
+ * @public
1793
+ */
1794
+ export declare function getStrokePoints(rawInputPoints: VecLike[], options?: StrokeOptions): StrokePoint[];
1795
+
1796
+ /**
1797
+ * Turn an array of stroke points into a path of quadradic curves.
1798
+ *
1799
+ * @param points - The stroke points returned from perfect-freehand
1800
+ * @param closed - Whether the shape is closed
1801
+ *
1802
+ * @public
1803
+ */
1804
+ export declare function getSvgPathFromStrokePoints(points: StrokePoint[], closed?: boolean): string;
1805
+
1772
1806
  /**
1773
1807
  * Original (uncropped) width and height of shape.
1774
1808
  *
@@ -2117,6 +2151,29 @@ export declare function NoteToolbarItem(): JSX_2.Element;
2117
2151
  /** @public @react */
2118
2152
  export declare function OfflineIndicator(): JSX_2.Element;
2119
2153
 
2154
+ /**
2155
+ * A helper method to use in {@link TLUiToolItem#onDragStart} to create a shape by dragging it from
2156
+ * the toolbar.
2157
+ * @public
2158
+ */
2159
+ export declare function onDragFromToolbarToCreateShape(editor: Editor, info: TLPointerEventInfo, opts: OnDragFromToolbarToCreateShapesOpts): void;
2160
+
2161
+ /**
2162
+ * Options for {@link onDragFromToolbarToCreateShape}.
2163
+ * @public
2164
+ */
2165
+ export declare interface OnDragFromToolbarToCreateShapesOpts {
2166
+ /**
2167
+ * Create the shape being dragged. You don't need to worry about positioning it, as it'll be
2168
+ * immediately updated with the correct position.
2169
+ */
2170
+ createShape(id: TLShapeId): void;
2171
+ /**
2172
+ * Called once the drag interaction has finished.
2173
+ */
2174
+ onDragEnd?(id: TLShapeId): void;
2175
+ }
2176
+
2120
2177
  /** @public @react */
2121
2178
  export declare function OpacitySlider(): JSX_2.Element | null;
2122
2179
 
@@ -2124,11 +2181,17 @@ export declare function OpacitySlider(): JSX_2.Element | null;
2124
2181
  export declare function OvalToolbarItem(): JSX_2.Element;
2125
2182
 
2126
2183
  /** @public @react */
2127
- export declare function OverflowingToolbar({ children }: OverflowingToolbarProps): JSX_2.Element;
2184
+ export declare function OverflowingToolbar({ children, orientation, sizingParentClassName, minItems, minSizePx, maxItems, maxSizePx, }: OverflowingToolbarProps): JSX_2.Element;
2128
2185
 
2129
2186
  /** @public */
2130
2187
  export declare interface OverflowingToolbarProps {
2131
2188
  children: React.ReactNode;
2189
+ orientation: 'horizontal' | 'vertical';
2190
+ sizingParentClassName: string;
2191
+ minItems: number;
2192
+ minSizePx: number;
2193
+ maxItems: number;
2194
+ maxSizePx: number;
2132
2195
  }
2133
2196
 
2134
2197
  /** @public @react */
@@ -2517,6 +2580,54 @@ export declare function StarToolbarItem(): JSX_2.Element;
2517
2580
  /** @public */
2518
2581
  export declare const STROKE_SIZES: Record<TLDefaultSizeStyle, number>;
2519
2582
 
2583
+ /**
2584
+ * The options object for `getStroke` or `getStrokePoints`.
2585
+ *
2586
+ * @public
2587
+ */
2588
+ export declare interface StrokeOptions {
2589
+ /** The base size (diameter) of the stroke. */
2590
+ size?: number;
2591
+ /** The effect of pressure on the stroke's size. */
2592
+ thinning?: number;
2593
+ /** How much to soften the stroke's edges. */
2594
+ smoothing?: number;
2595
+ streamline?: number;
2596
+ /** An easing function to apply to each point's pressure. */
2597
+ easing?(pressure: number): number;
2598
+ /** Whether to simulate pressure based on velocity. */
2599
+ simulatePressure?: boolean;
2600
+ /** Cap, taper and easing for the start of the line. */
2601
+ start?: {
2602
+ cap?: boolean;
2603
+ easing?(distance: number): number;
2604
+ taper?: boolean | number;
2605
+ };
2606
+ /** Cap, taper and easing for the end of the line. */
2607
+ end?: {
2608
+ cap?: boolean;
2609
+ easing?(distance: number): number;
2610
+ taper?: boolean | number;
2611
+ };
2612
+ /** Whether to handle the points as a completed stroke. */
2613
+ last?: boolean;
2614
+ }
2615
+
2616
+ /**
2617
+ * The points returned by `getStrokePoints`, and the input for `getStrokeOutlinePoints`
2618
+ *
2619
+ * @public
2620
+ */
2621
+ export declare interface StrokePoint {
2622
+ point: Vec;
2623
+ input: Vec;
2624
+ vector: Vec;
2625
+ pressure: number;
2626
+ distance: number;
2627
+ runningLength: number;
2628
+ radius: number;
2629
+ }
2630
+
2520
2631
  /** @public */
2521
2632
  export declare interface StylePickerSetProps {
2522
2633
  styles: ReadonlySharedStyleMap;
@@ -2915,6 +3026,13 @@ export declare function TldrawUiButtonLabel({ children }: TLUiButtonLabelProps):
2915
3026
  /** @public */
2916
3027
  export declare const TldrawUiButtonPicker: <T extends string>(props: TLUiButtonPickerProps<T>) => ReactElement;
2917
3028
 
3029
+ /**
3030
+ * A column, usually of UI controls like buttons, select dropdown, checkboxes, etc.
3031
+ *
3032
+ * @public @react
3033
+ */
3034
+ export declare const TldrawUiColumn: ForwardRefExoticComponent<TLUiLayoutProps & RefAttributes<HTMLDivElement>>;
3035
+
2918
3036
  /** @public @react */
2919
3037
  export declare function TldrawUiComponentsProvider({ overrides, children, }: TLUiComponentsProviderProps): JSX_2.Element;
2920
3038
 
@@ -2977,6 +3095,13 @@ export declare function TldrawUiDropdownMenuTrigger({ children, ...rest }: TLUiD
2977
3095
  /** @public @react */
2978
3096
  export declare function TldrawUiEventsProvider({ onEvent, children }: EventsProviderProps): JSX_2.Element;
2979
3097
 
3098
+ /**
3099
+ * A tight grid 4 elements wide, usually of UI controls like buttons, select dropdown, checkboxes,
3100
+ * etc.
3101
+ *
3102
+ * @public @react */
3103
+ export declare const TldrawUiGrid: ForwardRefExoticComponent<TLUiLayoutProps & RefAttributes<HTMLDivElement>>;
3104
+
2980
3105
  /** @public @react */
2981
3106
  export declare const TldrawUiIcon: NamedExoticComponent<TLUiIconProps>;
2982
3107
 
@@ -3002,7 +3127,7 @@ export declare function TldrawUiMenuContextProvider({ type, sourceId, children,
3002
3127
  export declare function TldrawUiMenuGroup({ id, label, className, children }: TLUiMenuGroupProps): boolean | JSX_2.Element | Iterable<ReactNode> | null | number | string | undefined;
3003
3128
 
3004
3129
  /** @public @react */
3005
- export declare function TldrawUiMenuItem<TranslationKey extends string = string, IconType extends string = string>({ disabled, spinner, readonlyOk, id, kbd, label, icon, iconLeft, onSelect, noClose, isSelected, }: TLUiMenuItemProps<TranslationKey, IconType>): JSX_2.Element | null;
3130
+ export declare function TldrawUiMenuItem<TranslationKey extends string = string, IconType extends string = string>({ disabled, spinner, readonlyOk, id, kbd, label, icon, iconLeft, onSelect, noClose, isSelected, onDragStart, }: TLUiMenuItemProps<TranslationKey, IconType>): JSX_2.Element | null;
3006
3131
 
3007
3132
  /** @public @react */
3008
3133
  export declare function TldrawUiMenuSubmenu<Translation extends string = string>({ id, disabled, label, size, children, }: TLUiMenuSubmenuProps<Translation>): boolean | JSX_2.Element | Iterable<ReactNode> | null | number | string | undefined;
@@ -3010,8 +3135,24 @@ export declare function TldrawUiMenuSubmenu<Translation extends string = string>
3010
3135
  /** @public @react */
3011
3136
  export declare function TldrawUiMenuToolItem({ toolId, ...rest }: TLUiMenuToolItemProps): JSX_2.Element | null;
3012
3137
 
3138
+ /** @public */
3139
+ export declare interface TldrawUiOrientationContext {
3140
+ orientation: 'horizontal' | 'vertical';
3141
+ tooltipSide: 'bottom' | 'left' | 'right' | 'top';
3142
+ }
3143
+
3144
+ /** @public @react */
3145
+ export declare function TldrawUiOrientationProvider({ children, orientation, tooltipSide, }: TldrawUiOrientationProviderProps): JSX_2.Element;
3146
+
3147
+ /** @public */
3148
+ export declare interface TldrawUiOrientationProviderProps {
3149
+ children: ReactNode;
3150
+ orientation: 'horizontal' | 'vertical';
3151
+ tooltipSide?: 'bottom' | 'left' | 'right' | 'top';
3152
+ }
3153
+
3013
3154
  /** @public @react */
3014
- export declare function TldrawUiPopover({ id, children, onOpenChange, open }: TLUiPopoverProps): JSX_2.Element;
3155
+ export declare function TldrawUiPopover({ id, children, onOpenChange, open, className }: TLUiPopoverProps): JSX_2.Element;
3015
3156
 
3016
3157
  /** @public @react */
3017
3158
  export declare function TldrawUiPopoverContent({ side, children, align, sideOffset, alignOffset, disableEscapeKeyDown, autoFocusFirstButton, }: TLUiPopoverContentProps): JSX_2.Element;
@@ -3041,6 +3182,13 @@ export declare interface TldrawUiProps extends TLUiContextProviderProps {
3041
3182
  assetUrls?: TLUiAssetUrlOverrides;
3042
3183
  }
3043
3184
 
3185
+ /**
3186
+ * A row, usually of UI controls like buttons, select dropdown, checkboxes, etc.
3187
+ *
3188
+ * @public @react
3189
+ */
3190
+ export declare const TldrawUiRow: ForwardRefExoticComponent<TLUiLayoutProps & RefAttributes<HTMLDivElement>>;
3191
+
3044
3192
  /** @public @react */
3045
3193
  export declare const TldrawUiSlider: React_3.ForwardRefExoticComponent<TLUiSliderProps & React_3.RefAttributes<HTMLDivElement>>;
3046
3194
 
@@ -3057,7 +3205,29 @@ export declare const TldrawUiToolbarButton: React_3.ForwardRefExoticComponent<TL
3057
3205
  export declare const TldrawUiToolbarToggleGroup: ({ children, className, type, ...props }: TLUiToolbarToggleGroupProps) => JSX_2.Element;
3058
3206
 
3059
3207
  /** @public @react */
3060
- export declare const TldrawUiToolbarToggleItem: ({ children, className, type, value, ...props }: TLUiToolbarToggleItemProps) => JSX_2.Element;
3208
+ export declare const TldrawUiToolbarToggleItem: ({ children, className, type, value, tooltip, ...props }: TLUiToolbarToggleItemProps) => JSX_2.Element;
3209
+
3210
+ /** @public @react */
3211
+ export declare const TldrawUiTooltip: React_3.ForwardRefExoticComponent<TldrawUiTooltipProps & React_3.RefAttributes<HTMLButtonElement>>;
3212
+
3213
+ /** @public */
3214
+ export declare interface TldrawUiTooltipProps {
3215
+ children: React_3.ReactNode;
3216
+ content?: React_3.ReactNode | string;
3217
+ side?: 'bottom' | 'left' | 'right' | 'top';
3218
+ sideOffset?: number;
3219
+ disabled?: boolean;
3220
+ showOnMobile?: boolean;
3221
+ delayDuration?: number;
3222
+ }
3223
+
3224
+ /** @public @react */
3225
+ export declare function TldrawUiTooltipProvider({ children }: TldrawUiTooltipProviderProps): JSX_2.Element;
3226
+
3227
+ /** @public */
3228
+ export declare interface TldrawUiTooltipProviderProps {
3229
+ children: React_3.ReactNode;
3230
+ }
3061
3231
 
3062
3232
  /* Excluded from this release type: TldrawUiTranslationProvider */
3063
3233
 
@@ -3572,6 +3742,7 @@ export declare interface TLUiEventMap {
3572
3742
  'toggle-lock': null;
3573
3743
  'toggle-reduce-motion': null;
3574
3744
  'toggle-keyboard-shortcuts': null;
3745
+ 'toggle-ui-labels': null;
3575
3746
  'toggle-edge-scrolling': null;
3576
3747
  'color-scheme': {
3577
3748
  value: string;
@@ -3594,6 +3765,9 @@ export declare interface TLUiEventMap {
3594
3765
  'open-context-menu': null;
3595
3766
  'adjust-shape-styles': null;
3596
3767
  'copy-link': null;
3768
+ 'drag-tool': {
3769
+ id: string;
3770
+ };
3597
3771
  'image-replace': null;
3598
3772
  'video-replace': null;
3599
3773
  'open-kbd-shortcuts': null;
@@ -3680,6 +3854,13 @@ export declare type TLUiKeyboardShortcutsDialogProps = TLUiDialogProps & {
3680
3854
  children?: ReactNode;
3681
3855
  };
3682
3856
 
3857
+ /** @public */
3858
+ export declare interface TLUiLayoutProps extends HTMLAttributes<HTMLDivElement> {
3859
+ children: ReactNode;
3860
+ tooltipSide?: 'bottom' | 'left' | 'right' | 'top';
3861
+ asChild?: boolean;
3862
+ }
3863
+
3683
3864
  /** @public */
3684
3865
  export declare interface TLUiMainMenuProps {
3685
3866
  children?: ReactNode;
@@ -3719,7 +3900,7 @@ export declare interface TLUiMenuContextProviderProps {
3719
3900
  }
3720
3901
 
3721
3902
  /** @public */
3722
- export declare type TLUiMenuContextType = 'context-menu' | 'helper-buttons' | 'icons' | 'keyboard-shortcuts' | 'menu' | 'panel' | 'small-icons' | 'toolbar-overflow' | 'toolbar';
3903
+ export declare type TLUiMenuContextType = 'context-menu' | 'helper-buttons' | 'icons' | 'keyboard-shortcuts' | 'menu' | 'small-icons' | 'toolbar-overflow' | 'toolbar';
3723
3904
 
3724
3905
  /** @public */
3725
3906
  export declare interface TLUiMenuGroupProps<TranslationKey extends string = string> {
@@ -3779,6 +3960,10 @@ export declare interface TLUiMenuItemProps<TranslationKey extends string = strin
3779
3960
  * Whether the item is selected.
3780
3961
  */
3781
3962
  isSelected?: boolean;
3963
+ /**
3964
+ * The function to call when the item is dragged. If this is provided, the item will be draggable.
3965
+ */
3966
+ onDragStart?(source: TLUiEventSource, info: TLPointerEventInfo): void;
3782
3967
  }
3783
3968
 
3784
3969
  /** @public */
@@ -3824,6 +4009,7 @@ export declare interface TLUiPopoverProps {
3824
4009
  open?: boolean;
3825
4010
  children: React_3.ReactNode;
3826
4011
  onOpenChange?(isOpen: boolean): void;
4012
+ className?: string;
3827
4013
  }
3828
4014
 
3829
4015
  /** @public */
@@ -3909,6 +4095,7 @@ export declare interface TLUiToolbarButtonProps extends React_3.HTMLAttributes<H
3909
4095
  disabled?: boolean;
3910
4096
  isActive?: boolean;
3911
4097
  type: 'icon' | 'menu' | 'tool';
4098
+ tooltip?: string;
3912
4099
  }
3913
4100
 
3914
4101
  /** @public */
@@ -3917,6 +4104,8 @@ export declare interface TLUiToolbarProps extends React_3.HTMLAttributes<HTMLDiv
3917
4104
  className?: string;
3918
4105
  dir?: 'ltr' | 'rtl';
3919
4106
  label: string;
4107
+ orientation?: 'grid' | 'horizontal' | 'vertical';
4108
+ tooltipSide?: 'bottom' | 'left' | 'right' | 'top';
3920
4109
  }
3921
4110
 
3922
4111
  /** @public */
@@ -3935,6 +4124,7 @@ export declare interface TLUiToolbarToggleItemProps extends React_3.HTMLAttribut
3935
4124
  className?: string;
3936
4125
  type: 'icon' | 'tool';
3937
4126
  value: string;
4127
+ tooltip?: string;
3938
4128
  }
3939
4129
 
3940
4130
  /** @public */
@@ -3944,6 +4134,7 @@ export declare interface TLUiToolItem<TranslationKey extends string = string, Ic
3944
4134
  shortcutsLabel?: TranslationKey;
3945
4135
  icon: IconType | TLUiIconJsx;
3946
4136
  onSelect(source: TLUiEventSource): void;
4137
+ onDragStart?(source: TLUiEventSource, info: TLPointerEventInfo): void;
3947
4138
  /**
3948
4139
  * The keyboard shortcut for this tool. This is a string that can be a single key,
3949
4140
  * or a combination of keys.
@@ -3979,7 +4170,7 @@ export declare interface TLUiTranslation {
3979
4170
  export declare type TLUiTranslationContextType = TLUiTranslation;
3980
4171
 
3981
4172
  /** @public */
3982
- 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-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.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';
4173
+ 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';
3983
4174
 
3984
4175
  /** @public */
3985
4176
  export declare interface TLUiTranslationProviderProps {
@@ -4120,6 +4311,9 @@ export declare function ToggleToolLockItem(): JSX_2.Element;
4120
4311
  /** @public @react */
4121
4312
  export declare function ToggleTransparentBgMenuItem(): JSX_2.Element;
4122
4313
 
4314
+ /** @public @react */
4315
+ export declare function ToggleUiLabelsItem(): JSX_2.Element;
4316
+
4123
4317
  /** @public @react */
4124
4318
  export declare function ToggleWrapModeItem(): JSX_2.Element;
4125
4319
 
@@ -4353,6 +4547,9 @@ export declare function useShowCollaborationUi(): boolean;
4353
4547
  /** @public */
4354
4548
  export declare function useTldrawUiComponents(): TLUiComponents;
4355
4549
 
4550
+ /** @public */
4551
+ export declare function useTldrawUiOrientation(): TldrawUiOrientationContext;
4552
+
4356
4553
  /** @public */
4357
4554
  export declare function useToasts(): TLUiToastsContextType;
4358
4555
 
package/dist-cjs/index.js CHANGED
@@ -22,6 +22,7 @@ __export(index_exports, {
22
22
  ARROW_LABEL_FONT_SIZES: () => import_default_shape_constants.ARROW_LABEL_FONT_SIZES,
23
23
  ASPECT_RATIO_OPTIONS: () => import_crop.ASPECT_RATIO_OPTIONS,
24
24
  ASPECT_RATIO_TO_VALUE: () => import_crop.ASPECT_RATIO_TO_VALUE,
25
+ AccessibilityMenu: () => import_AccessibilityMenu.AccessibilityMenu,
25
26
  AlignMenuItems: () => import_DefaultActionsMenuContent.AlignMenuItems,
26
27
  ArrangeMenuSubmenu: () => import_menu_items.ArrangeMenuSubmenu,
27
28
  ArrowBindingUtil: () => import_ArrowBindingUtil.ArrowBindingUtil,
@@ -210,6 +211,7 @@ __export(index_exports, {
210
211
  TldrawUiButtonIcon: () => import_TldrawUiButtonIcon.TldrawUiButtonIcon,
211
212
  TldrawUiButtonLabel: () => import_TldrawUiButtonLabel.TldrawUiButtonLabel,
212
213
  TldrawUiButtonPicker: () => import_TldrawUiButtonPicker.TldrawUiButtonPicker,
214
+ TldrawUiColumn: () => import_layout.TldrawUiColumn,
213
215
  TldrawUiComponentsProvider: () => import_components.TldrawUiComponentsProvider,
214
216
  TldrawUiContextProvider: () => import_TldrawUiContextProvider.TldrawUiContextProvider,
215
217
  TldrawUiContextualToolbar: () => import_TldrawUiContextualToolbar.TldrawUiContextualToolbar,
@@ -229,6 +231,7 @@ __export(index_exports, {
229
231
  TldrawUiDropdownMenuSubTrigger: () => import_TldrawUiDropdownMenu.TldrawUiDropdownMenuSubTrigger,
230
232
  TldrawUiDropdownMenuTrigger: () => import_TldrawUiDropdownMenu.TldrawUiDropdownMenuTrigger,
231
233
  TldrawUiEventsProvider: () => import_events.TldrawUiEventsProvider,
234
+ TldrawUiGrid: () => import_layout.TldrawUiGrid,
232
235
  TldrawUiIcon: () => import_TldrawUiIcon.TldrawUiIcon,
233
236
  TldrawUiInput: () => import_TldrawUiInput.TldrawUiInput,
234
237
  TldrawUiKbd: () => import_TldrawUiKbd.TldrawUiKbd,
@@ -240,15 +243,19 @@ __export(index_exports, {
240
243
  TldrawUiMenuItem: () => import_TldrawUiMenuItem.TldrawUiMenuItem,
241
244
  TldrawUiMenuSubmenu: () => import_TldrawUiMenuSubmenu.TldrawUiMenuSubmenu,
242
245
  TldrawUiMenuToolItem: () => import_TldrawUiMenuToolItem.TldrawUiMenuToolItem,
246
+ TldrawUiOrientationProvider: () => import_layout.TldrawUiOrientationProvider,
243
247
  TldrawUiPopover: () => import_TldrawUiPopover.TldrawUiPopover,
244
248
  TldrawUiPopoverContent: () => import_TldrawUiPopover.TldrawUiPopoverContent,
245
249
  TldrawUiPopoverTrigger: () => import_TldrawUiPopover.TldrawUiPopoverTrigger,
250
+ TldrawUiRow: () => import_layout.TldrawUiRow,
246
251
  TldrawUiSlider: () => import_TldrawUiSlider.TldrawUiSlider,
247
252
  TldrawUiToastsProvider: () => import_toasts.TldrawUiToastsProvider,
248
253
  TldrawUiToolbar: () => import_TldrawUiToolbar.TldrawUiToolbar,
249
254
  TldrawUiToolbarButton: () => import_TldrawUiToolbar.TldrawUiToolbarButton,
250
255
  TldrawUiToolbarToggleGroup: () => import_TldrawUiToolbar.TldrawUiToolbarToggleGroup,
251
256
  TldrawUiToolbarToggleItem: () => import_TldrawUiToolbar.TldrawUiToolbarToggleItem,
257
+ TldrawUiTooltip: () => import_TldrawUiTooltip.TldrawUiTooltip,
258
+ TldrawUiTooltipProvider: () => import_TldrawUiTooltip.TldrawUiTooltipProvider,
252
259
  TldrawUiTranslationProvider: () => import_useTranslation.TldrawUiTranslationProvider,
253
260
  ToggleAutoSizeMenuItem: () => import_menu_items.ToggleAutoSizeMenuItem,
254
261
  ToggleDebugModeItem: () => import_menu_items.ToggleDebugModeItem,
@@ -264,6 +271,7 @@ __export(index_exports, {
264
271
  ToggleToolLockItem: () => import_menu_items.ToggleToolLockItem,
265
272
  ToggleToolLockedButton: () => import_ToggleToolLockedButton.ToggleToolLockedButton,
266
273
  ToggleTransparentBgMenuItem: () => import_menu_items.ToggleTransparentBgMenuItem,
274
+ ToggleUiLabelsItem: () => import_menu_items.ToggleUiLabelsItem,
267
275
  ToggleWrapModeItem: () => import_menu_items.ToggleWrapModeItem,
268
276
  ToolbarItem: () => import_DefaultToolbarContent.ToolbarItem,
269
277
  TrapezoidToolbarItem: () => import_DefaultToolbarContent.TrapezoidToolbarItem,
@@ -316,7 +324,10 @@ __export(index_exports, {
316
324
  getEmbedInfo: () => import_embeds.getEmbedInfo,
317
325
  getHitShapeOnCanvasPointerDown: () => import_getHitShapeOnCanvasPointerDown.getHitShapeOnCanvasPointerDown,
318
326
  getMediaAssetInfoPartial: () => import_defaultExternalContentHandlers.getMediaAssetInfoPartial,
327
+ getStrokePoints: () => import_getStrokePoints.getStrokePoints,
328
+ getSvgPathFromStrokePoints: () => import_svg.getSvgPathFromStrokePoints,
319
329
  getUncroppedSize: () => import_crop.getUncroppedSize,
330
+ onDragFromToolbarToCreateShape: () => import_useTools.onDragFromToolbarToCreateShape,
320
331
  parseAndLoadDocument: () => import_file.parseAndLoadDocument,
321
332
  parseTldrawJsonFile: () => import_file.parseTldrawJsonFile,
322
333
  preloadFont: () => import_preload_font.preloadFont,
@@ -365,6 +376,7 @@ __export(index_exports, {
365
376
  useSelectedShapesAnnouncer: () => import_A11y.useSelectedShapesAnnouncer,
366
377
  useShowCollaborationUi: () => import_useCollaborationStatus.useShowCollaborationUi,
367
378
  useTldrawUiComponents: () => import_components.useTldrawUiComponents,
379
+ useTldrawUiOrientation: () => import_layout.useTldrawUiOrientation,
368
380
  useToasts: () => import_toasts.useToasts,
369
381
  useTools: () => import_useTools.useTools,
370
382
  useTranslation: () => import_useTranslation2.useTranslation,
@@ -376,8 +388,10 @@ var import_editor = require("@tldraw/editor");
376
388
  var import_PathBuilder = require("./lib/shapes/shared/PathBuilder");
377
389
  var import_usePrefersReducedMotion = require("./lib/shapes/shared/usePrefersReducedMotion");
378
390
  var import_A11y = require("./lib/ui/components/A11y");
391
+ var import_AccessibilityMenu = require("./lib/ui/components/AccessibilityMenu");
379
392
  var import_ColorSchemeMenu = require("./lib/ui/components/ColorSchemeMenu");
380
393
  var import_Dialogs = require("./lib/ui/components/Dialogs");
394
+ var import_layout = require("./lib/ui/components/primitives/layout");
381
395
  var import_TldrawUiMenuActionCheckboxItem = require("./lib/ui/components/primitives/menus/TldrawUiMenuActionCheckboxItem");
382
396
  var import_TldrawUiMenuActionItem = require("./lib/ui/components/primitives/menus/TldrawUiMenuActionItem");
383
397
  var import_TldrawUiMenuToolItem = require("./lib/ui/components/primitives/menus/TldrawUiMenuToolItem");
@@ -419,6 +433,8 @@ var import_NoteShapeUtil = require("./lib/shapes/note/NoteShapeUtil");
419
433
  var import_crop = require("./lib/shapes/shared/crop");
420
434
  var import_default_shape_constants = require("./lib/shapes/shared/default-shape-constants");
421
435
  var import_defaultFonts = require("./lib/shapes/shared/defaultFonts");
436
+ var import_getStrokePoints = require("./lib/shapes/shared/freehand/getStrokePoints");
437
+ var import_svg = require("./lib/shapes/shared/freehand/svg");
422
438
  var import_PlainTextLabel = require("./lib/shapes/shared/PlainTextLabel");
423
439
  var import_RichTextLabel = require("./lib/shapes/shared/RichTextLabel");
424
440
  var import_useDefaultColorTheme = require("./lib/shapes/shared/useDefaultColorTheme");
@@ -482,6 +498,7 @@ var import_TldrawUiKbd = require("./lib/ui/components/primitives/TldrawUiKbd");
482
498
  var import_TldrawUiPopover = require("./lib/ui/components/primitives/TldrawUiPopover");
483
499
  var import_TldrawUiSlider = require("./lib/ui/components/primitives/TldrawUiSlider");
484
500
  var import_TldrawUiToolbar = require("./lib/ui/components/primitives/TldrawUiToolbar");
501
+ var import_TldrawUiTooltip = require("./lib/ui/components/primitives/TldrawUiTooltip");
485
502
  var import_DefaultQuickActions = require("./lib/ui/components/QuickActions/DefaultQuickActions");
486
503
  var import_DefaultQuickActionsContent = require("./lib/ui/components/QuickActions/DefaultQuickActionsContent");
487
504
  var import_DefaultSharePanel = require("./lib/ui/components/SharePanel/DefaultSharePanel");
@@ -543,7 +560,7 @@ var import_buildFromV1Document = require("./lib/utils/tldr/buildFromV1Document")
543
560
  var import_file = require("./lib/utils/tldr/file");
544
561
  (0, import_editor.registerTldrawLibraryVersion)(
545
562
  "tldraw",
546
- "3.16.0-canary.ed8bd30c0f28",
563
+ "3.16.0-canary.f293c3bb58f5",
547
564
  "cjs"
548
565
  );
549
566
  //# sourceMappingURL=index.js.map