tldraw 3.16.0-next.282b7be564ae → 3.16.0-next.2f9d39693e4c

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 (291) hide show
  1. package/dist-cjs/index.d.ts +224 -102
  2. package/dist-cjs/index.js +33 -14
  3. package/dist-cjs/index.js.map +2 -2
  4. package/dist-cjs/lib/Tldraw.js +12 -2
  5. package/dist-cjs/lib/Tldraw.js.map +2 -2
  6. package/dist-cjs/lib/defaultExternalContentHandlers.js +5 -4
  7. package/dist-cjs/lib/defaultExternalContentHandlers.js.map +2 -2
  8. package/dist-cjs/lib/shapes/arrow/arrowLabel.js +6 -0
  9. package/dist-cjs/lib/shapes/arrow/arrowLabel.js.map +3 -3
  10. package/dist-cjs/lib/shapes/frame/FrameShapeUtil.js +6 -0
  11. package/dist-cjs/lib/shapes/frame/FrameShapeUtil.js.map +2 -2
  12. package/dist-cjs/lib/shapes/image/ImageShapeUtil.js +3 -0
  13. package/dist-cjs/lib/shapes/image/ImageShapeUtil.js.map +2 -2
  14. package/dist-cjs/lib/shapes/shared/PlainTextLabel.js +1 -3
  15. package/dist-cjs/lib/shapes/shared/PlainTextLabel.js.map +2 -2
  16. package/dist-cjs/lib/shapes/shared/freehand/svg.js.map +2 -2
  17. package/dist-cjs/lib/shapes/shared/useEditablePlainText.js +0 -2
  18. package/dist-cjs/lib/shapes/shared/useEditablePlainText.js.map +2 -2
  19. package/dist-cjs/lib/shapes/shared/useImageOrVideoAsset.js +0 -2
  20. package/dist-cjs/lib/shapes/shared/useImageOrVideoAsset.js.map +2 -2
  21. package/dist-cjs/lib/tools/EraserTool/childStates/Erasing.js +25 -1
  22. package/dist-cjs/lib/tools/EraserTool/childStates/Erasing.js.map +2 -2
  23. package/dist-cjs/lib/tools/EraserTool/childStates/Pointing.js +12 -0
  24. package/dist-cjs/lib/tools/EraserTool/childStates/Pointing.js.map +2 -2
  25. package/dist-cjs/lib/ui/TldrawUi.js +13 -12
  26. package/dist-cjs/lib/ui/TldrawUi.js.map +2 -2
  27. package/dist-cjs/lib/ui/assetUrls.js +13 -10
  28. package/dist-cjs/lib/ui/assetUrls.js.map +2 -2
  29. package/dist-cjs/lib/ui/components/{FollowingIndicator.js → DefaultFollowingIndicator.js} +6 -6
  30. package/dist-cjs/lib/ui/components/DefaultFollowingIndicator.js.map +7 -0
  31. package/dist-cjs/lib/ui/components/KeyboardShortcutsDialog/DefaultKeyboardShortcutsDialogContent.js +6 -6
  32. package/dist-cjs/lib/ui/components/KeyboardShortcutsDialog/DefaultKeyboardShortcutsDialogContent.js.map +1 -1
  33. package/dist-cjs/lib/ui/components/StylePanel/DefaultStylePanel.js +9 -4
  34. package/dist-cjs/lib/ui/components/StylePanel/DefaultStylePanel.js.map +2 -2
  35. package/dist-cjs/lib/ui/components/StylePanel/DefaultStylePanelContent.js +255 -316
  36. package/dist-cjs/lib/ui/components/StylePanel/DefaultStylePanelContent.js.map +2 -2
  37. package/dist-cjs/lib/ui/components/{primitives/TldrawUiButtonPicker.js → StylePanel/StylePanelButtonPicker.js} +52 -45
  38. package/dist-cjs/lib/ui/components/StylePanel/StylePanelButtonPicker.js.map +7 -0
  39. package/dist-cjs/lib/ui/components/StylePanel/StylePanelContext.js +68 -0
  40. package/dist-cjs/lib/ui/components/StylePanel/StylePanelContext.js.map +7 -0
  41. package/dist-cjs/lib/ui/components/StylePanel/{DoubleDropdownPicker.js → StylePanelDoubleDropdownPicker.js} +23 -22
  42. package/dist-cjs/lib/ui/components/StylePanel/StylePanelDoubleDropdownPicker.js.map +7 -0
  43. package/dist-cjs/lib/ui/components/StylePanel/{DropdownPicker.js → StylePanelDropdownPicker.js} +24 -21
  44. package/dist-cjs/lib/ui/components/StylePanel/StylePanelDropdownPicker.js.map +7 -0
  45. package/dist-cjs/lib/ui/components/StylePanel/StylePanelSubheading.js +28 -0
  46. package/dist-cjs/lib/ui/components/StylePanel/StylePanelSubheading.js.map +7 -0
  47. package/dist-cjs/lib/ui/components/Toolbar/AltTextEditor.js +3 -2
  48. package/dist-cjs/lib/ui/components/Toolbar/AltTextEditor.js.map +2 -2
  49. package/dist-cjs/lib/ui/components/Toolbar/DefaultImageToolbarContent.js +38 -9
  50. package/dist-cjs/lib/ui/components/Toolbar/DefaultImageToolbarContent.js.map +2 -2
  51. package/dist-cjs/lib/ui/components/Toolbar/DefaultVideoToolbarContent.js +15 -3
  52. package/dist-cjs/lib/ui/components/Toolbar/DefaultVideoToolbarContent.js.map +2 -2
  53. package/dist-cjs/lib/ui/components/Toolbar/LinkEditor.js +3 -3
  54. package/dist-cjs/lib/ui/components/Toolbar/LinkEditor.js.map +2 -2
  55. package/dist-cjs/lib/ui/components/primitives/TldrawUiContextualToolbar.js +10 -1
  56. package/dist-cjs/lib/ui/components/primitives/TldrawUiContextualToolbar.js.map +2 -2
  57. package/dist-cjs/lib/ui/components/primitives/TldrawUiSlider.js +17 -4
  58. package/dist-cjs/lib/ui/components/primitives/TldrawUiSlider.js.map +2 -2
  59. package/dist-cjs/lib/ui/components/primitives/TldrawUiToolbar.js +2 -0
  60. package/dist-cjs/lib/ui/components/primitives/TldrawUiToolbar.js.map +2 -2
  61. package/dist-cjs/lib/ui/components/primitives/TldrawUiTooltip.js +37 -36
  62. package/dist-cjs/lib/ui/components/primitives/TldrawUiTooltip.js.map +2 -2
  63. package/dist-cjs/lib/ui/components/primitives/menus/TldrawUiMenuItem.js +2 -1
  64. package/dist-cjs/lib/ui/components/primitives/menus/TldrawUiMenuItem.js.map +2 -2
  65. package/dist-cjs/lib/ui/context/actions.js +23 -10
  66. package/dist-cjs/lib/ui/context/actions.js.map +2 -2
  67. package/dist-cjs/lib/ui/context/components.js +2 -0
  68. package/dist-cjs/lib/ui/context/components.js.map +2 -2
  69. package/dist-cjs/lib/ui/context/events.js.map +1 -1
  70. package/dist-cjs/lib/ui/hooks/useExportAs.js +3 -2
  71. package/dist-cjs/lib/ui/hooks/useExportAs.js.map +2 -2
  72. package/dist-cjs/lib/ui/hooks/useTools.js +1 -1
  73. package/dist-cjs/lib/ui/hooks/useTools.js.map +2 -2
  74. package/dist-cjs/lib/ui/hooks/useTranslation/TLUiTranslationKey.js.map +1 -1
  75. package/dist-cjs/lib/ui/hooks/useTranslation/defaultTranslation.js +2 -0
  76. package/dist-cjs/lib/ui/hooks/useTranslation/defaultTranslation.js.map +2 -2
  77. package/dist-cjs/lib/ui/kbd-utils.js +9 -3
  78. package/dist-cjs/lib/ui/kbd-utils.js.map +2 -2
  79. package/dist-cjs/lib/ui/version.js +3 -3
  80. package/dist-cjs/lib/ui/version.js.map +1 -1
  81. package/dist-cjs/lib/utils/export/copyAs.js +1 -2
  82. package/dist-cjs/lib/utils/export/copyAs.js.map +2 -2
  83. package/dist-cjs/lib/utils/export/export.js +0 -20
  84. package/dist-cjs/lib/utils/export/export.js.map +2 -2
  85. package/dist-cjs/lib/utils/export/exportAs.js +1 -2
  86. package/dist-cjs/lib/utils/export/exportAs.js.map +2 -2
  87. package/dist-esm/index.d.mts +224 -102
  88. package/dist-esm/index.mjs +61 -29
  89. package/dist-esm/index.mjs.map +2 -2
  90. package/dist-esm/lib/Tldraw.mjs +14 -4
  91. package/dist-esm/lib/Tldraw.mjs.map +2 -2
  92. package/dist-esm/lib/defaultExternalContentHandlers.mjs +5 -4
  93. package/dist-esm/lib/defaultExternalContentHandlers.mjs.map +2 -2
  94. package/dist-esm/lib/shapes/arrow/arrowLabel.mjs +6 -0
  95. package/dist-esm/lib/shapes/arrow/arrowLabel.mjs.map +3 -3
  96. package/dist-esm/lib/shapes/frame/FrameShapeUtil.mjs +6 -0
  97. package/dist-esm/lib/shapes/frame/FrameShapeUtil.mjs.map +2 -2
  98. package/dist-esm/lib/shapes/image/ImageShapeUtil.mjs +3 -0
  99. package/dist-esm/lib/shapes/image/ImageShapeUtil.mjs.map +2 -2
  100. package/dist-esm/lib/shapes/shared/PlainTextLabel.mjs +1 -3
  101. package/dist-esm/lib/shapes/shared/PlainTextLabel.mjs.map +2 -2
  102. package/dist-esm/lib/shapes/shared/freehand/svg.mjs.map +2 -2
  103. package/dist-esm/lib/shapes/shared/useEditablePlainText.mjs +0 -2
  104. package/dist-esm/lib/shapes/shared/useEditablePlainText.mjs.map +2 -2
  105. package/dist-esm/lib/shapes/shared/useImageOrVideoAsset.mjs +0 -2
  106. package/dist-esm/lib/shapes/shared/useImageOrVideoAsset.mjs.map +2 -2
  107. package/dist-esm/lib/tools/EraserTool/childStates/Erasing.mjs +26 -1
  108. package/dist-esm/lib/tools/EraserTool/childStates/Erasing.mjs.map +2 -2
  109. package/dist-esm/lib/tools/EraserTool/childStates/Pointing.mjs +13 -0
  110. package/dist-esm/lib/tools/EraserTool/childStates/Pointing.mjs.map +2 -2
  111. package/dist-esm/lib/ui/TldrawUi.mjs +13 -12
  112. package/dist-esm/lib/ui/TldrawUi.mjs.map +2 -2
  113. package/dist-esm/lib/ui/assetUrls.mjs +13 -10
  114. package/dist-esm/lib/ui/assetUrls.mjs.map +2 -2
  115. package/dist-esm/lib/ui/components/{FollowingIndicator.mjs → DefaultFollowingIndicator.mjs} +3 -3
  116. package/dist-esm/lib/ui/components/DefaultFollowingIndicator.mjs.map +7 -0
  117. package/dist-esm/lib/ui/components/KeyboardShortcutsDialog/DefaultKeyboardShortcutsDialogContent.mjs +6 -6
  118. package/dist-esm/lib/ui/components/KeyboardShortcutsDialog/DefaultKeyboardShortcutsDialogContent.mjs.map +1 -1
  119. package/dist-esm/lib/ui/components/StylePanel/DefaultStylePanel.mjs +14 -5
  120. package/dist-esm/lib/ui/components/StylePanel/DefaultStylePanel.mjs.map +2 -2
  121. package/dist-esm/lib/ui/components/StylePanel/DefaultStylePanelContent.mjs +257 -320
  122. package/dist-esm/lib/ui/components/StylePanel/DefaultStylePanelContent.mjs.map +2 -2
  123. package/dist-esm/lib/ui/components/{primitives/TldrawUiButtonPicker.mjs → StylePanel/StylePanelButtonPicker.mjs} +54 -43
  124. package/dist-esm/lib/ui/components/StylePanel/StylePanelButtonPicker.mjs.map +7 -0
  125. package/dist-esm/lib/ui/components/StylePanel/StylePanelContext.mjs +48 -0
  126. package/dist-esm/lib/ui/components/StylePanel/StylePanelContext.mjs.map +7 -0
  127. package/dist-esm/lib/ui/components/StylePanel/{DoubleDropdownPicker.mjs → StylePanelDoubleDropdownPicker.mjs} +20 -19
  128. package/dist-esm/lib/ui/components/StylePanel/StylePanelDoubleDropdownPicker.mjs.map +7 -0
  129. package/dist-esm/lib/ui/components/StylePanel/{DropdownPicker.mjs → StylePanelDropdownPicker.mjs} +21 -18
  130. package/dist-esm/lib/ui/components/StylePanel/StylePanelDropdownPicker.mjs.map +7 -0
  131. package/dist-esm/lib/ui/components/StylePanel/StylePanelSubheading.mjs +8 -0
  132. package/dist-esm/lib/ui/components/StylePanel/StylePanelSubheading.mjs.map +7 -0
  133. package/dist-esm/lib/ui/components/Toolbar/AltTextEditor.mjs +3 -2
  134. package/dist-esm/lib/ui/components/Toolbar/AltTextEditor.mjs.map +2 -2
  135. package/dist-esm/lib/ui/components/Toolbar/DefaultImageToolbarContent.mjs +38 -9
  136. package/dist-esm/lib/ui/components/Toolbar/DefaultImageToolbarContent.mjs.map +2 -2
  137. package/dist-esm/lib/ui/components/Toolbar/DefaultVideoToolbarContent.mjs +15 -3
  138. package/dist-esm/lib/ui/components/Toolbar/DefaultVideoToolbarContent.mjs.map +2 -2
  139. package/dist-esm/lib/ui/components/Toolbar/LinkEditor.mjs +3 -3
  140. package/dist-esm/lib/ui/components/Toolbar/LinkEditor.mjs.map +2 -2
  141. package/dist-esm/lib/ui/components/primitives/TldrawUiContextualToolbar.mjs +10 -1
  142. package/dist-esm/lib/ui/components/primitives/TldrawUiContextualToolbar.mjs.map +2 -2
  143. package/dist-esm/lib/ui/components/primitives/TldrawUiSlider.mjs +17 -4
  144. package/dist-esm/lib/ui/components/primitives/TldrawUiSlider.mjs.map +2 -2
  145. package/dist-esm/lib/ui/components/primitives/TldrawUiToolbar.mjs +2 -0
  146. package/dist-esm/lib/ui/components/primitives/TldrawUiToolbar.mjs.map +2 -2
  147. package/dist-esm/lib/ui/components/primitives/TldrawUiTooltip.mjs +37 -36
  148. package/dist-esm/lib/ui/components/primitives/TldrawUiTooltip.mjs.map +2 -2
  149. package/dist-esm/lib/ui/components/primitives/menus/TldrawUiMenuItem.mjs +2 -1
  150. package/dist-esm/lib/ui/components/primitives/menus/TldrawUiMenuItem.mjs.map +2 -2
  151. package/dist-esm/lib/ui/context/actions.mjs +23 -10
  152. package/dist-esm/lib/ui/context/actions.mjs.map +2 -2
  153. package/dist-esm/lib/ui/context/components.mjs +2 -0
  154. package/dist-esm/lib/ui/context/components.mjs.map +2 -2
  155. package/dist-esm/lib/ui/context/events.mjs.map +1 -1
  156. package/dist-esm/lib/ui/hooks/useExportAs.mjs +3 -2
  157. package/dist-esm/lib/ui/hooks/useExportAs.mjs.map +2 -2
  158. package/dist-esm/lib/ui/hooks/useTools.mjs +1 -1
  159. package/dist-esm/lib/ui/hooks/useTools.mjs.map +2 -2
  160. package/dist-esm/lib/ui/hooks/useTranslation/defaultTranslation.mjs +2 -0
  161. package/dist-esm/lib/ui/hooks/useTranslation/defaultTranslation.mjs.map +2 -2
  162. package/dist-esm/lib/ui/kbd-utils.mjs +9 -3
  163. package/dist-esm/lib/ui/kbd-utils.mjs.map +2 -2
  164. package/dist-esm/lib/ui/version.mjs +3 -3
  165. package/dist-esm/lib/ui/version.mjs.map +1 -1
  166. package/dist-esm/lib/utils/export/copyAs.mjs +1 -2
  167. package/dist-esm/lib/utils/export/copyAs.mjs.map +2 -2
  168. package/dist-esm/lib/utils/export/export.mjs +0 -20
  169. package/dist-esm/lib/utils/export/export.mjs.map +2 -2
  170. package/dist-esm/lib/utils/export/exportAs.mjs +1 -2
  171. package/dist-esm/lib/utils/export/exportAs.mjs.map +2 -2
  172. package/package.json +11 -34
  173. package/src/index.ts +44 -22
  174. package/src/lib/Tldraw.tsx +15 -2
  175. package/src/lib/defaultExternalContentHandlers.ts +12 -4
  176. package/src/lib/shapes/arrow/ArrowShapeOptions.test.ts +2 -1
  177. package/src/lib/shapes/arrow/ArrowShapeTool.test.ts +4 -3
  178. package/src/lib/shapes/arrow/ArrowShapeUtil.test.ts +7 -6
  179. package/src/lib/shapes/arrow/arrowLabel.ts +8 -0
  180. package/src/lib/shapes/draw/DrawShapeTool.test.ts +0 -5
  181. package/src/lib/shapes/frame/FrameShapeUtil.tsx +8 -0
  182. package/src/lib/shapes/image/ImageShapeUtil.tsx +3 -0
  183. package/src/lib/shapes/line/LineShapeUtil.test.tsx +4 -3
  184. package/src/lib/shapes/line/__snapshots__/LineShapeUtil.test.tsx.snap +2 -2
  185. package/src/lib/shapes/shared/PlainTextLabel.tsx +0 -6
  186. package/src/lib/shapes/shared/freehand/svg.ts +2 -0
  187. package/src/lib/shapes/shared/useEditablePlainText.ts +0 -6
  188. package/src/lib/shapes/shared/useImageOrVideoAsset.ts +0 -7
  189. package/src/lib/shapes/text/TextShapeTool.test.ts +6 -5
  190. package/src/lib/tools/EraserTool/childStates/Erasing.ts +34 -1
  191. package/src/lib/tools/EraserTool/childStates/Pointing.ts +20 -0
  192. package/src/lib/ui/TldrawUi.tsx +16 -10
  193. package/src/lib/ui/assetUrls.ts +13 -10
  194. package/src/lib/ui/components/{FollowingIndicator.tsx → DefaultFollowingIndicator.tsx} +2 -1
  195. package/src/lib/ui/components/KeyboardShortcutsDialog/DefaultKeyboardShortcutsDialogContent.tsx +6 -6
  196. package/src/lib/ui/components/StylePanel/DefaultStylePanel.tsx +27 -13
  197. package/src/lib/ui/components/StylePanel/DefaultStylePanelContent.tsx +260 -381
  198. package/src/lib/ui/components/{primitives/TldrawUiButtonPicker.tsx → StylePanel/StylePanelButtonPicker.tsx} +63 -50
  199. package/src/lib/ui/components/StylePanel/StylePanelContext.tsx +63 -0
  200. package/src/lib/ui/components/StylePanel/{DoubleDropdownPicker.tsx → StylePanelDoubleDropdownPicker.tsx} +28 -19
  201. package/src/lib/ui/components/StylePanel/StylePanelDropdownPicker.tsx +119 -0
  202. package/src/lib/ui/components/StylePanel/StylePanelSubheading.tsx +9 -0
  203. package/src/lib/ui/components/Toolbar/AltTextEditor.tsx +4 -3
  204. package/src/lib/ui/components/Toolbar/DefaultImageToolbarContent.tsx +32 -15
  205. package/src/lib/ui/components/Toolbar/DefaultVideoToolbarContent.tsx +12 -4
  206. package/src/lib/ui/components/Toolbar/LinkEditor.tsx +5 -5
  207. package/src/lib/ui/components/primitives/TldrawUiContextualToolbar.tsx +6 -1
  208. package/src/lib/ui/components/primitives/TldrawUiSlider.tsx +50 -30
  209. package/src/lib/ui/components/primitives/TldrawUiToolbar.tsx +3 -0
  210. package/src/lib/ui/components/primitives/TldrawUiTooltip.tsx +29 -21
  211. package/src/lib/ui/components/primitives/menus/TldrawUiMenuItem.tsx +3 -2
  212. package/src/lib/ui/context/actions.tsx +23 -10
  213. package/src/lib/ui/context/components.tsx +3 -0
  214. package/src/lib/ui/context/events.tsx +1 -1
  215. package/src/lib/ui/hooks/useExportAs.ts +3 -2
  216. package/src/lib/ui/hooks/useTools.tsx +1 -1
  217. package/src/lib/ui/hooks/useTranslation/TLUiTranslationKey.ts +2 -0
  218. package/src/lib/ui/hooks/useTranslation/defaultTranslation.ts +2 -0
  219. package/src/lib/ui/kbd-utils.ts +10 -3
  220. package/src/lib/ui/version.ts +3 -3
  221. package/src/lib/ui.css +19 -2
  222. package/src/lib/utils/excalidraw/__snapshots__/putExcalidrawContent.test.tsx.snap +5 -5
  223. package/src/lib/utils/export/copyAs.ts +1 -24
  224. package/src/lib/utils/export/export.ts +0 -36
  225. package/src/lib/utils/export/exportAs.ts +1 -32
  226. package/src/lib/utils/tldr/__snapshots__/buildFromV1Document.test.ts.snap +4 -4
  227. package/src/test/A11y.test.tsx +3 -2
  228. package/src/test/ClickManager.test.ts +7 -6
  229. package/src/test/Editor.test.tsx +20 -19
  230. package/src/test/EraserTool.test.ts +184 -13
  231. package/src/test/HandTool.test.ts +10 -9
  232. package/src/test/HighlightShape.test.ts +2 -1
  233. package/src/test/SelectTool.test.ts +3 -2
  234. package/src/test/TLUserPreferences.test.ts +4 -3
  235. package/src/test/TestEditor.ts +13 -15
  236. package/src/test/TldrawEditor.test.tsx +11 -10
  237. package/src/test/ZoomTool.test.ts +7 -6
  238. package/src/test/__snapshots__/drawing.test.ts.snap +2 -2
  239. package/src/test/__snapshots__/groups.test.tsx.snap +6 -6
  240. package/src/test/__snapshots__/resizing.test.ts.snap +2 -2
  241. package/src/test/arrows-megabus.test.tsx +5 -4
  242. package/src/test/bindings.test.tsx +24 -37
  243. package/src/test/bookmark-shapes.test.ts +1 -8
  244. package/src/test/commands/__snapshots__/getSvgString.test.ts.snap +23 -7
  245. package/src/test/commands/__snapshots__/packShapes.test.ts.snap +8 -8
  246. package/src/test/commands/__snapshots__/zoomToFit.test.ts.snap +2 -2
  247. package/src/test/commands/alignShapes.test.tsx +25 -24
  248. package/src/test/commands/animationSpeed.test.ts +2 -1
  249. package/src/test/commands/centerOnPoint.test.ts +3 -2
  250. package/src/test/commands/clipboard.test.ts +3 -2
  251. package/src/test/commands/createShapes.test.ts +2 -1
  252. package/src/test/commands/deleteShapes.test.ts +2 -1
  253. package/src/test/commands/distributeShapes.test.tsx +11 -10
  254. package/src/test/commands/getSvgString.test.ts +2 -1
  255. package/src/test/commands/packShapes.test.ts +5 -4
  256. package/src/test/commands/resizeShape.test.ts +2 -1
  257. package/src/test/commands/rotateShapes.test.ts +7 -6
  258. package/src/test/commands/setCamera.test.ts +4 -3
  259. package/src/test/commands/setCurrentPage.test.ts +3 -2
  260. package/src/test/commands/stackShapes.test.ts +11 -10
  261. package/src/test/commands/stretch.test.tsx +13 -12
  262. package/src/test/createDeepLink.test.tsx +2 -1
  263. package/src/test/cropping.test.ts +3 -2
  264. package/src/test/custom-clipping.test.ts +436 -0
  265. package/src/test/drawing.test.ts +2 -1
  266. package/src/test/flipShapes.test.ts +4 -3
  267. package/src/test/frames.test.ts +25 -24
  268. package/src/test/getCulledShapes.test.tsx +3 -2
  269. package/src/test/groups.test.tsx +1 -1
  270. package/src/test/handleDeepLink.test.tsx +2 -1
  271. package/src/test/maxShapes.test.ts +3 -2
  272. package/src/test/modifiers.test.ts +5 -4
  273. package/src/test/navigation.test.ts +12 -11
  274. package/src/test/panning.test.ts +2 -1
  275. package/src/test/perf/perf.test.ts +2 -1
  276. package/src/test/registerDeepLinkListener.test.tsx +10 -9
  277. package/src/test/resizing.test.ts +39 -38
  278. package/src/test/select.test.tsx +4 -3
  279. package/src/test/selection-omnibus.test.ts +11 -10
  280. package/src/test/shapeutils.test.ts +4 -3
  281. package/src/test/translating.test.ts +9 -8
  282. package/tldraw.css +27 -2
  283. package/dist-cjs/lib/ui/components/FollowingIndicator.js.map +0 -7
  284. package/dist-cjs/lib/ui/components/StylePanel/DoubleDropdownPicker.js.map +0 -7
  285. package/dist-cjs/lib/ui/components/StylePanel/DropdownPicker.js.map +0 -7
  286. package/dist-cjs/lib/ui/components/primitives/TldrawUiButtonPicker.js.map +0 -7
  287. package/dist-esm/lib/ui/components/FollowingIndicator.mjs.map +0 -7
  288. package/dist-esm/lib/ui/components/StylePanel/DoubleDropdownPicker.mjs.map +0 -7
  289. package/dist-esm/lib/ui/components/StylePanel/DropdownPicker.mjs.map +0 -7
  290. package/dist-esm/lib/ui/components/primitives/TldrawUiButtonPicker.mjs.map +0 -7
  291. package/src/lib/ui/components/StylePanel/DropdownPicker.tsx +0 -110
@@ -137,7 +137,7 @@ function DefaultKeyboardShortcutsDialogContent() {
137
137
  {
138
138
  id: "text-header",
139
139
  label: "tool.rich-text-header",
140
- kbd: "cmd+shift+[[1-6]]",
140
+ kbd: "cmd+alt+[[1-6]]",
141
141
  onSelect: () => {
142
142
  }
143
143
  }
@@ -179,7 +179,7 @@ function DefaultKeyboardShortcutsDialogContent() {
179
179
  {
180
180
  id: "a11y-select-next-shape-direction",
181
181
  label: "a11y.select-shape-direction",
182
- kbd: "cmd+\u2191\u2192\u2193\u2190",
182
+ kbd: "cmd+[[\u2191\u2192\u2193\u2190]]",
183
183
  onSelect: () => {
184
184
  }
185
185
  }
@@ -189,7 +189,7 @@ function DefaultKeyboardShortcutsDialogContent() {
189
189
  {
190
190
  id: "a11y-select-next-shape-container",
191
191
  label: "a11y.enter-leave-container",
192
- kbd: "cmd+shift+\u2191\u2192",
192
+ kbd: "cmd+shift+[[\u2191\u2192]]",
193
193
  onSelect: () => {
194
194
  }
195
195
  }
@@ -199,7 +199,7 @@ function DefaultKeyboardShortcutsDialogContent() {
199
199
  {
200
200
  id: "a11y-pan-camera",
201
201
  label: "a11y.pan-camera",
202
- kbd: "[[Space]]+\u2191\u2192\u2193\u2190",
202
+ kbd: "[[Space]]+[[\u2191\u2192\u2193\u2190]]",
203
203
  onSelect: () => {
204
204
  }
205
205
  }
@@ -229,7 +229,7 @@ function DefaultKeyboardShortcutsDialogContent() {
229
229
  {
230
230
  id: "a11y-move-shape",
231
231
  label: "a11y.move-shape",
232
- kbd: "\u2191\u2192\u2193\u2190",
232
+ kbd: "[[\u2191\u2192\u2193\u2190]]",
233
233
  onSelect: () => {
234
234
  }
235
235
  }
@@ -239,7 +239,7 @@ function DefaultKeyboardShortcutsDialogContent() {
239
239
  {
240
240
  id: "a11y-move-shape-faster",
241
241
  label: "a11y.move-shape-faster",
242
- kbd: "shift+\u2191\u2192\u2193\u2190",
242
+ kbd: "shift+[[\u2191\u2192\u2193\u2190]]",
243
243
  onSelect: () => {
244
244
  }
245
245
  }
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../../src/lib/ui/components/KeyboardShortcutsDialog/DefaultKeyboardShortcutsDialogContent.tsx"],
4
- "sourcesContent": ["import { useShowCollaborationUi } from '../../hooks/useCollaborationStatus'\nimport { TldrawUiMenuActionItem } from '../primitives/menus/TldrawUiMenuActionItem'\nimport { TldrawUiMenuGroup } from '../primitives/menus/TldrawUiMenuGroup'\nimport { TldrawUiMenuItem } from '../primitives/menus/TldrawUiMenuItem'\nimport { TldrawUiMenuToolItem } from '../primitives/menus/TldrawUiMenuToolItem'\n\n/** @public @react */\nexport function DefaultKeyboardShortcutsDialogContent() {\n\tconst showCollaborationUi = useShowCollaborationUi()\n\treturn (\n\t\t<>\n\t\t\t<TldrawUiMenuGroup label=\"shortcuts-dialog.tools\" id=\"tools\">\n\t\t\t\t<TldrawUiMenuActionItem actionId=\"toggle-tool-lock\" />\n\t\t\t\t<TldrawUiMenuActionItem actionId=\"insert-media\" />\n\t\t\t\t<TldrawUiMenuToolItem toolId=\"select\" />\n\t\t\t\t<TldrawUiMenuToolItem toolId=\"draw\" />\n\t\t\t\t<TldrawUiMenuToolItem toolId=\"eraser\" />\n\t\t\t\t<TldrawUiMenuToolItem toolId=\"hand\" />\n\t\t\t\t<TldrawUiMenuToolItem toolId=\"rectangle\" />\n\t\t\t\t<TldrawUiMenuToolItem toolId=\"ellipse\" />\n\t\t\t\t<TldrawUiMenuToolItem toolId=\"arrow\" />\n\t\t\t\t<TldrawUiMenuToolItem toolId=\"line\" />\n\t\t\t\t<TldrawUiMenuToolItem toolId=\"text\" />\n\t\t\t\t<TldrawUiMenuToolItem toolId=\"frame\" />\n\t\t\t\t<TldrawUiMenuToolItem toolId=\"note\" />\n\t\t\t\t<TldrawUiMenuToolItem toolId=\"laser\" />\n\t\t\t\t<TldrawUiMenuItem\n\t\t\t\t\tid=\"pointer-down\"\n\t\t\t\t\tlabel=\"tool.pointer-down\"\n\t\t\t\t\tkbd=\",\"\n\t\t\t\t\tonSelect={() => {\n\t\t\t\t\t\t/* do nothing */\n\t\t\t\t\t}}\n\t\t\t\t/>\n\t\t\t</TldrawUiMenuGroup>\n\t\t\t<TldrawUiMenuGroup label=\"shortcuts-dialog.preferences\" id=\"preferences\">\n\t\t\t\t<TldrawUiMenuActionItem actionId=\"toggle-dark-mode\" />\n\t\t\t\t<TldrawUiMenuActionItem actionId=\"toggle-focus-mode\" />\n\t\t\t\t<TldrawUiMenuActionItem actionId=\"toggle-grid\" />\n\t\t\t</TldrawUiMenuGroup>\n\t\t\t<TldrawUiMenuGroup label=\"shortcuts-dialog.edit\" id=\"edit\">\n\t\t\t\t<TldrawUiMenuActionItem actionId=\"undo\" />\n\t\t\t\t<TldrawUiMenuActionItem actionId=\"redo\" />\n\t\t\t\t<TldrawUiMenuActionItem actionId=\"cut\" />\n\t\t\t\t<TldrawUiMenuActionItem actionId=\"copy\" />\n\t\t\t\t<TldrawUiMenuActionItem actionId=\"paste\" />\n\t\t\t\t<TldrawUiMenuActionItem actionId=\"select-all\" />\n\t\t\t\t<TldrawUiMenuActionItem actionId=\"delete\" />\n\t\t\t\t<TldrawUiMenuActionItem actionId=\"duplicate\" />\n\t\t\t</TldrawUiMenuGroup>\n\t\t\t<TldrawUiMenuGroup label=\"shortcuts-dialog.view\" id=\"view\">\n\t\t\t\t<TldrawUiMenuActionItem actionId=\"zoom-in\" />\n\t\t\t\t<TldrawUiMenuActionItem actionId=\"zoom-out\" />\n\t\t\t\t<TldrawUiMenuActionItem actionId=\"zoom-to-100\" />\n\t\t\t\t<TldrawUiMenuActionItem actionId=\"zoom-to-fit\" />\n\t\t\t\t<TldrawUiMenuActionItem actionId=\"zoom-to-selection\" />\n\t\t\t</TldrawUiMenuGroup>\n\t\t\t<TldrawUiMenuGroup label=\"shortcuts-dialog.transform\" id=\"transform\">\n\t\t\t\t<TldrawUiMenuActionItem actionId=\"bring-to-front\" />\n\t\t\t\t<TldrawUiMenuActionItem actionId=\"bring-forward\" />\n\t\t\t\t<TldrawUiMenuActionItem actionId=\"send-backward\" />\n\t\t\t\t<TldrawUiMenuActionItem actionId=\"send-to-back\" />\n\t\t\t\t<TldrawUiMenuActionItem actionId=\"group\" />\n\t\t\t\t<TldrawUiMenuActionItem actionId=\"ungroup\" />\n\t\t\t\t<TldrawUiMenuActionItem actionId=\"flip-horizontal\" />\n\t\t\t\t<TldrawUiMenuActionItem actionId=\"flip-vertical\" />\n\t\t\t\t<TldrawUiMenuActionItem actionId=\"align-top\" />\n\t\t\t\t<TldrawUiMenuActionItem actionId=\"align-center-vertical\" />\n\t\t\t\t<TldrawUiMenuActionItem actionId=\"align-bottom\" />\n\t\t\t\t<TldrawUiMenuActionItem actionId=\"align-left\" />\n\t\t\t\t<TldrawUiMenuActionItem actionId=\"align-center-horizontal\" />\n\t\t\t\t<TldrawUiMenuActionItem actionId=\"align-right\" />\n\t\t\t</TldrawUiMenuGroup>\n\t\t\t<TldrawUiMenuGroup label=\"shortcuts-dialog.text-formatting\" id=\"text\">\n\t\t\t\t<TldrawUiMenuItem\n\t\t\t\t\tid=\"text-bold\"\n\t\t\t\t\tlabel=\"tool.rich-text-bold\"\n\t\t\t\t\tkbd=\"cmd+b\"\n\t\t\t\t\tonSelect={() => {\n\t\t\t\t\t\t/* do nothing */\n\t\t\t\t\t}}\n\t\t\t\t/>\n\t\t\t\t<TldrawUiMenuItem\n\t\t\t\t\tid=\"text-italic\"\n\t\t\t\t\tlabel=\"tool.rich-text-italic\"\n\t\t\t\t\tkbd=\"cmd+i\"\n\t\t\t\t\tonSelect={() => {\n\t\t\t\t\t\t/* do nothing */\n\t\t\t\t\t}}\n\t\t\t\t/>\n\t\t\t\t<TldrawUiMenuItem\n\t\t\t\t\tid=\"text-code\"\n\t\t\t\t\tlabel=\"tool.rich-text-code\"\n\t\t\t\t\tkbd=\"cmd+e\"\n\t\t\t\t\tonSelect={() => {\n\t\t\t\t\t\t/* do nothing */\n\t\t\t\t\t}}\n\t\t\t\t/>\n\t\t\t\t<TldrawUiMenuItem\n\t\t\t\t\tid=\"text-highlight\"\n\t\t\t\t\tlabel=\"tool.rich-text-highlight\"\n\t\t\t\t\tkbd=\"cmd+shift+h\"\n\t\t\t\t\tonSelect={() => {\n\t\t\t\t\t\t/* do nothing */\n\t\t\t\t\t}}\n\t\t\t\t/>\n\t\t\t\t<TldrawUiMenuItem\n\t\t\t\t\tid=\"text-strikethrough\"\n\t\t\t\t\tlabel=\"tool.rich-text-strikethrough\"\n\t\t\t\t\tkbd=\"cmd+shift+s\"\n\t\t\t\t\tonSelect={() => {\n\t\t\t\t\t\t/* do nothing */\n\t\t\t\t\t}}\n\t\t\t\t/>\n\t\t\t\t<TldrawUiMenuItem\n\t\t\t\t\tid=\"text-link\"\n\t\t\t\t\tlabel=\"tool.rich-text-link\"\n\t\t\t\t\tkbd=\"cmd+shift+k\"\n\t\t\t\t\tonSelect={() => {\n\t\t\t\t\t\t/* do nothing */\n\t\t\t\t\t}}\n\t\t\t\t/>\n\t\t\t\t<TldrawUiMenuItem\n\t\t\t\t\tid=\"text-header\"\n\t\t\t\t\tlabel=\"tool.rich-text-header\"\n\t\t\t\t\tkbd=\"cmd+shift+[[1-6]]\"\n\t\t\t\t\tonSelect={() => {\n\t\t\t\t\t\t/* do nothing */\n\t\t\t\t\t}}\n\t\t\t\t/>\n\t\t\t\t<TldrawUiMenuItem\n\t\t\t\t\tid=\"text-orderedList\"\n\t\t\t\t\tlabel=\"tool.rich-text-orderedList\"\n\t\t\t\t\tkbd=\"cmd+shift+7\"\n\t\t\t\t\tonSelect={() => {\n\t\t\t\t\t\t/* do nothing */\n\t\t\t\t\t}}\n\t\t\t\t/>\n\t\t\t\t<TldrawUiMenuItem\n\t\t\t\t\tid=\"text-bulletedlist\"\n\t\t\t\t\tlabel=\"tool.rich-text-bulletList\"\n\t\t\t\t\tkbd=\"cmd+shift+8\"\n\t\t\t\t\tonSelect={() => {\n\t\t\t\t\t\t/* do nothing */\n\t\t\t\t\t}}\n\t\t\t\t/>\n\t\t\t</TldrawUiMenuGroup>\n\t\t\t<TldrawUiMenuGroup label=\"shortcuts-dialog.a11y\" id=\"a11y\">\n\t\t\t\t<TldrawUiMenuItem\n\t\t\t\t\tid=\"a11y-select-next-shape\"\n\t\t\t\t\tlabel=\"a11y.select-shape\"\n\t\t\t\t\tkbd=\"[[Tab]]\"\n\t\t\t\t\tonSelect={() => {\n\t\t\t\t\t\t/* do nothing */\n\t\t\t\t\t}}\n\t\t\t\t/>\n\t\t\t\t<TldrawUiMenuItem\n\t\t\t\t\tid=\"a11y-select-next-shape-direction\"\n\t\t\t\t\tlabel=\"a11y.select-shape-direction\"\n\t\t\t\t\tkbd=\"cmd+\u2191\u2192\u2193\u2190\"\n\t\t\t\t\tonSelect={() => {\n\t\t\t\t\t\t/* do nothing */\n\t\t\t\t\t}}\n\t\t\t\t/>\n\t\t\t\t<TldrawUiMenuItem\n\t\t\t\t\tid=\"a11y-select-next-shape-container\"\n\t\t\t\t\tlabel=\"a11y.enter-leave-container\"\n\t\t\t\t\tkbd=\"cmd+shift+\u2191\u2192\"\n\t\t\t\t\tonSelect={() => {\n\t\t\t\t\t\t/* do nothing */\n\t\t\t\t\t}}\n\t\t\t\t/>\n\t\t\t\t<TldrawUiMenuItem\n\t\t\t\t\tid=\"a11y-pan-camera\"\n\t\t\t\t\tlabel=\"a11y.pan-camera\"\n\t\t\t\t\tkbd=\"[[Space]]+\u2191\u2192\u2193\u2190\"\n\t\t\t\t\tonSelect={() => {\n\t\t\t\t\t\t/* do nothing */\n\t\t\t\t\t}}\n\t\t\t\t/>\n\t\t\t\t<TldrawUiMenuItem\n\t\t\t\t\tid=\"adjust-shape-styles\"\n\t\t\t\t\tlabel=\"a11y.adjust-shape-styles\"\n\t\t\t\t\tkbd=\"cmd+[[Enter]]\"\n\t\t\t\t\tonSelect={() => {\n\t\t\t\t\t\t/* do nothing */\n\t\t\t\t\t}}\n\t\t\t\t/>\n\t\t\t\t<TldrawUiMenuItem\n\t\t\t\t\tid=\"open-context-menu\"\n\t\t\t\t\tlabel=\"a11y.open-context-menu\"\n\t\t\t\t\tkbd=\"cmd+shift+[[Enter]]\"\n\t\t\t\t\tonSelect={() => {\n\t\t\t\t\t\t/* do nothing */\n\t\t\t\t\t}}\n\t\t\t\t/>\n\t\t\t\t<TldrawUiMenuItem\n\t\t\t\t\tid=\"a11y-move-shape\"\n\t\t\t\t\tlabel=\"a11y.move-shape\"\n\t\t\t\t\tkbd=\"\u2191\u2192\u2193\u2190\"\n\t\t\t\t\tonSelect={() => {\n\t\t\t\t\t\t/* do nothing */\n\t\t\t\t\t}}\n\t\t\t\t/>\n\t\t\t\t<TldrawUiMenuItem\n\t\t\t\t\tid=\"a11y-move-shape-faster\"\n\t\t\t\t\tlabel=\"a11y.move-shape-faster\"\n\t\t\t\t\tkbd=\"shift+\u2191\u2192\u2193\u2190\"\n\t\t\t\t\tonSelect={() => {\n\t\t\t\t\t\t/* do nothing */\n\t\t\t\t\t}}\n\t\t\t\t/>\n\t\t\t\t<TldrawUiMenuItem\n\t\t\t\t\tid=\"a11y-rotate-shape-cw\"\n\t\t\t\t\tlabel=\"a11y.rotate-shape-cw\"\n\t\t\t\t\tkbd=\"shift+\uFE65\"\n\t\t\t\t\tonSelect={() => {\n\t\t\t\t\t\t/* do nothing */\n\t\t\t\t\t}}\n\t\t\t\t/>\n\t\t\t\t<TldrawUiMenuItem\n\t\t\t\t\tid=\"a11y-rotate-shape-cw-fine\"\n\t\t\t\t\tlabel=\"a11y.rotate-shape-cw-fine\"\n\t\t\t\t\tkbd=\"shift+alt+\uFE65\"\n\t\t\t\t\tonSelect={() => {\n\t\t\t\t\t\t/* do nothing */\n\t\t\t\t\t}}\n\t\t\t\t/>\n\t\t\t\t<TldrawUiMenuItem\n\t\t\t\t\tid=\"a11y-rotate-shape-ccw\"\n\t\t\t\t\tlabel=\"a11y.rotate-shape-ccw\"\n\t\t\t\t\tkbd=\"shift+\uFE64\"\n\t\t\t\t\tonSelect={() => {\n\t\t\t\t\t\t/* do nothing */\n\t\t\t\t\t}}\n\t\t\t\t/>\n\t\t\t\t<TldrawUiMenuItem\n\t\t\t\t\tid=\"a11y-rotate-shape-ccw-fine\"\n\t\t\t\t\tlabel=\"a11y.rotate-shape-ccw-fine\"\n\t\t\t\t\tkbd=\"shift+alt+\uFE64\"\n\t\t\t\t\tonSelect={() => {\n\t\t\t\t\t\t/* do nothing */\n\t\t\t\t\t}}\n\t\t\t\t/>\n\t\t\t\t<TldrawUiMenuActionItem actionId=\"enlarge-shapes\" />\n\t\t\t\t<TldrawUiMenuActionItem actionId=\"shrink-shapes\" />\n\t\t\t\t<TldrawUiMenuActionItem actionId=\"a11y-repeat-shape-announce\" />\n\t\t\t\t<TldrawUiMenuItem\n\t\t\t\t\tid=\"a11y-open-keyboard-shortcuts\"\n\t\t\t\t\tlabel=\"a11y.open-keyboard-shortcuts\"\n\t\t\t\t\tkbd=\"cmd+alt+/\"\n\t\t\t\t\tonSelect={() => {\n\t\t\t\t\t\t/* do nothing */\n\t\t\t\t\t}}\n\t\t\t\t/>\n\t\t\t</TldrawUiMenuGroup>\n\t\t\t{showCollaborationUi && (\n\t\t\t\t<TldrawUiMenuGroup label=\"shortcuts-dialog.collaboration\" id=\"collaboration\">\n\t\t\t\t\t<TldrawUiMenuActionItem actionId=\"open-cursor-chat\" />\n\t\t\t\t</TldrawUiMenuGroup>\n\t\t\t)}\n\t\t</>\n\t)\n}\n"],
4
+ "sourcesContent": ["import { useShowCollaborationUi } from '../../hooks/useCollaborationStatus'\nimport { TldrawUiMenuActionItem } from '../primitives/menus/TldrawUiMenuActionItem'\nimport { TldrawUiMenuGroup } from '../primitives/menus/TldrawUiMenuGroup'\nimport { TldrawUiMenuItem } from '../primitives/menus/TldrawUiMenuItem'\nimport { TldrawUiMenuToolItem } from '../primitives/menus/TldrawUiMenuToolItem'\n\n/** @public @react */\nexport function DefaultKeyboardShortcutsDialogContent() {\n\tconst showCollaborationUi = useShowCollaborationUi()\n\treturn (\n\t\t<>\n\t\t\t<TldrawUiMenuGroup label=\"shortcuts-dialog.tools\" id=\"tools\">\n\t\t\t\t<TldrawUiMenuActionItem actionId=\"toggle-tool-lock\" />\n\t\t\t\t<TldrawUiMenuActionItem actionId=\"insert-media\" />\n\t\t\t\t<TldrawUiMenuToolItem toolId=\"select\" />\n\t\t\t\t<TldrawUiMenuToolItem toolId=\"draw\" />\n\t\t\t\t<TldrawUiMenuToolItem toolId=\"eraser\" />\n\t\t\t\t<TldrawUiMenuToolItem toolId=\"hand\" />\n\t\t\t\t<TldrawUiMenuToolItem toolId=\"rectangle\" />\n\t\t\t\t<TldrawUiMenuToolItem toolId=\"ellipse\" />\n\t\t\t\t<TldrawUiMenuToolItem toolId=\"arrow\" />\n\t\t\t\t<TldrawUiMenuToolItem toolId=\"line\" />\n\t\t\t\t<TldrawUiMenuToolItem toolId=\"text\" />\n\t\t\t\t<TldrawUiMenuToolItem toolId=\"frame\" />\n\t\t\t\t<TldrawUiMenuToolItem toolId=\"note\" />\n\t\t\t\t<TldrawUiMenuToolItem toolId=\"laser\" />\n\t\t\t\t<TldrawUiMenuItem\n\t\t\t\t\tid=\"pointer-down\"\n\t\t\t\t\tlabel=\"tool.pointer-down\"\n\t\t\t\t\tkbd=\",\"\n\t\t\t\t\tonSelect={() => {\n\t\t\t\t\t\t/* do nothing */\n\t\t\t\t\t}}\n\t\t\t\t/>\n\t\t\t</TldrawUiMenuGroup>\n\t\t\t<TldrawUiMenuGroup label=\"shortcuts-dialog.preferences\" id=\"preferences\">\n\t\t\t\t<TldrawUiMenuActionItem actionId=\"toggle-dark-mode\" />\n\t\t\t\t<TldrawUiMenuActionItem actionId=\"toggle-focus-mode\" />\n\t\t\t\t<TldrawUiMenuActionItem actionId=\"toggle-grid\" />\n\t\t\t</TldrawUiMenuGroup>\n\t\t\t<TldrawUiMenuGroup label=\"shortcuts-dialog.edit\" id=\"edit\">\n\t\t\t\t<TldrawUiMenuActionItem actionId=\"undo\" />\n\t\t\t\t<TldrawUiMenuActionItem actionId=\"redo\" />\n\t\t\t\t<TldrawUiMenuActionItem actionId=\"cut\" />\n\t\t\t\t<TldrawUiMenuActionItem actionId=\"copy\" />\n\t\t\t\t<TldrawUiMenuActionItem actionId=\"paste\" />\n\t\t\t\t<TldrawUiMenuActionItem actionId=\"select-all\" />\n\t\t\t\t<TldrawUiMenuActionItem actionId=\"delete\" />\n\t\t\t\t<TldrawUiMenuActionItem actionId=\"duplicate\" />\n\t\t\t</TldrawUiMenuGroup>\n\t\t\t<TldrawUiMenuGroup label=\"shortcuts-dialog.view\" id=\"view\">\n\t\t\t\t<TldrawUiMenuActionItem actionId=\"zoom-in\" />\n\t\t\t\t<TldrawUiMenuActionItem actionId=\"zoom-out\" />\n\t\t\t\t<TldrawUiMenuActionItem actionId=\"zoom-to-100\" />\n\t\t\t\t<TldrawUiMenuActionItem actionId=\"zoom-to-fit\" />\n\t\t\t\t<TldrawUiMenuActionItem actionId=\"zoom-to-selection\" />\n\t\t\t</TldrawUiMenuGroup>\n\t\t\t<TldrawUiMenuGroup label=\"shortcuts-dialog.transform\" id=\"transform\">\n\t\t\t\t<TldrawUiMenuActionItem actionId=\"bring-to-front\" />\n\t\t\t\t<TldrawUiMenuActionItem actionId=\"bring-forward\" />\n\t\t\t\t<TldrawUiMenuActionItem actionId=\"send-backward\" />\n\t\t\t\t<TldrawUiMenuActionItem actionId=\"send-to-back\" />\n\t\t\t\t<TldrawUiMenuActionItem actionId=\"group\" />\n\t\t\t\t<TldrawUiMenuActionItem actionId=\"ungroup\" />\n\t\t\t\t<TldrawUiMenuActionItem actionId=\"flip-horizontal\" />\n\t\t\t\t<TldrawUiMenuActionItem actionId=\"flip-vertical\" />\n\t\t\t\t<TldrawUiMenuActionItem actionId=\"align-top\" />\n\t\t\t\t<TldrawUiMenuActionItem actionId=\"align-center-vertical\" />\n\t\t\t\t<TldrawUiMenuActionItem actionId=\"align-bottom\" />\n\t\t\t\t<TldrawUiMenuActionItem actionId=\"align-left\" />\n\t\t\t\t<TldrawUiMenuActionItem actionId=\"align-center-horizontal\" />\n\t\t\t\t<TldrawUiMenuActionItem actionId=\"align-right\" />\n\t\t\t</TldrawUiMenuGroup>\n\t\t\t<TldrawUiMenuGroup label=\"shortcuts-dialog.text-formatting\" id=\"text\">\n\t\t\t\t<TldrawUiMenuItem\n\t\t\t\t\tid=\"text-bold\"\n\t\t\t\t\tlabel=\"tool.rich-text-bold\"\n\t\t\t\t\tkbd=\"cmd+b\"\n\t\t\t\t\tonSelect={() => {\n\t\t\t\t\t\t/* do nothing */\n\t\t\t\t\t}}\n\t\t\t\t/>\n\t\t\t\t<TldrawUiMenuItem\n\t\t\t\t\tid=\"text-italic\"\n\t\t\t\t\tlabel=\"tool.rich-text-italic\"\n\t\t\t\t\tkbd=\"cmd+i\"\n\t\t\t\t\tonSelect={() => {\n\t\t\t\t\t\t/* do nothing */\n\t\t\t\t\t}}\n\t\t\t\t/>\n\t\t\t\t<TldrawUiMenuItem\n\t\t\t\t\tid=\"text-code\"\n\t\t\t\t\tlabel=\"tool.rich-text-code\"\n\t\t\t\t\tkbd=\"cmd+e\"\n\t\t\t\t\tonSelect={() => {\n\t\t\t\t\t\t/* do nothing */\n\t\t\t\t\t}}\n\t\t\t\t/>\n\t\t\t\t<TldrawUiMenuItem\n\t\t\t\t\tid=\"text-highlight\"\n\t\t\t\t\tlabel=\"tool.rich-text-highlight\"\n\t\t\t\t\tkbd=\"cmd+shift+h\"\n\t\t\t\t\tonSelect={() => {\n\t\t\t\t\t\t/* do nothing */\n\t\t\t\t\t}}\n\t\t\t\t/>\n\t\t\t\t<TldrawUiMenuItem\n\t\t\t\t\tid=\"text-strikethrough\"\n\t\t\t\t\tlabel=\"tool.rich-text-strikethrough\"\n\t\t\t\t\tkbd=\"cmd+shift+s\"\n\t\t\t\t\tonSelect={() => {\n\t\t\t\t\t\t/* do nothing */\n\t\t\t\t\t}}\n\t\t\t\t/>\n\t\t\t\t<TldrawUiMenuItem\n\t\t\t\t\tid=\"text-link\"\n\t\t\t\t\tlabel=\"tool.rich-text-link\"\n\t\t\t\t\tkbd=\"cmd+shift+k\"\n\t\t\t\t\tonSelect={() => {\n\t\t\t\t\t\t/* do nothing */\n\t\t\t\t\t}}\n\t\t\t\t/>\n\t\t\t\t<TldrawUiMenuItem\n\t\t\t\t\tid=\"text-header\"\n\t\t\t\t\tlabel=\"tool.rich-text-header\"\n\t\t\t\t\tkbd=\"cmd+alt+[[1-6]]\"\n\t\t\t\t\tonSelect={() => {\n\t\t\t\t\t\t/* do nothing */\n\t\t\t\t\t}}\n\t\t\t\t/>\n\t\t\t\t<TldrawUiMenuItem\n\t\t\t\t\tid=\"text-orderedList\"\n\t\t\t\t\tlabel=\"tool.rich-text-orderedList\"\n\t\t\t\t\tkbd=\"cmd+shift+7\"\n\t\t\t\t\tonSelect={() => {\n\t\t\t\t\t\t/* do nothing */\n\t\t\t\t\t}}\n\t\t\t\t/>\n\t\t\t\t<TldrawUiMenuItem\n\t\t\t\t\tid=\"text-bulletedlist\"\n\t\t\t\t\tlabel=\"tool.rich-text-bulletList\"\n\t\t\t\t\tkbd=\"cmd+shift+8\"\n\t\t\t\t\tonSelect={() => {\n\t\t\t\t\t\t/* do nothing */\n\t\t\t\t\t}}\n\t\t\t\t/>\n\t\t\t</TldrawUiMenuGroup>\n\t\t\t<TldrawUiMenuGroup label=\"shortcuts-dialog.a11y\" id=\"a11y\">\n\t\t\t\t<TldrawUiMenuItem\n\t\t\t\t\tid=\"a11y-select-next-shape\"\n\t\t\t\t\tlabel=\"a11y.select-shape\"\n\t\t\t\t\tkbd=\"[[Tab]]\"\n\t\t\t\t\tonSelect={() => {\n\t\t\t\t\t\t/* do nothing */\n\t\t\t\t\t}}\n\t\t\t\t/>\n\t\t\t\t<TldrawUiMenuItem\n\t\t\t\t\tid=\"a11y-select-next-shape-direction\"\n\t\t\t\t\tlabel=\"a11y.select-shape-direction\"\n\t\t\t\t\tkbd=\"cmd+[[\u2191\u2192\u2193\u2190]]\"\n\t\t\t\t\tonSelect={() => {\n\t\t\t\t\t\t/* do nothing */\n\t\t\t\t\t}}\n\t\t\t\t/>\n\t\t\t\t<TldrawUiMenuItem\n\t\t\t\t\tid=\"a11y-select-next-shape-container\"\n\t\t\t\t\tlabel=\"a11y.enter-leave-container\"\n\t\t\t\t\tkbd=\"cmd+shift+[[\u2191\u2192]]\"\n\t\t\t\t\tonSelect={() => {\n\t\t\t\t\t\t/* do nothing */\n\t\t\t\t\t}}\n\t\t\t\t/>\n\t\t\t\t<TldrawUiMenuItem\n\t\t\t\t\tid=\"a11y-pan-camera\"\n\t\t\t\t\tlabel=\"a11y.pan-camera\"\n\t\t\t\t\tkbd=\"[[Space]]+[[\u2191\u2192\u2193\u2190]]\"\n\t\t\t\t\tonSelect={() => {\n\t\t\t\t\t\t/* do nothing */\n\t\t\t\t\t}}\n\t\t\t\t/>\n\t\t\t\t<TldrawUiMenuItem\n\t\t\t\t\tid=\"adjust-shape-styles\"\n\t\t\t\t\tlabel=\"a11y.adjust-shape-styles\"\n\t\t\t\t\tkbd=\"cmd+[[Enter]]\"\n\t\t\t\t\tonSelect={() => {\n\t\t\t\t\t\t/* do nothing */\n\t\t\t\t\t}}\n\t\t\t\t/>\n\t\t\t\t<TldrawUiMenuItem\n\t\t\t\t\tid=\"open-context-menu\"\n\t\t\t\t\tlabel=\"a11y.open-context-menu\"\n\t\t\t\t\tkbd=\"cmd+shift+[[Enter]]\"\n\t\t\t\t\tonSelect={() => {\n\t\t\t\t\t\t/* do nothing */\n\t\t\t\t\t}}\n\t\t\t\t/>\n\t\t\t\t<TldrawUiMenuItem\n\t\t\t\t\tid=\"a11y-move-shape\"\n\t\t\t\t\tlabel=\"a11y.move-shape\"\n\t\t\t\t\tkbd=\"[[\u2191\u2192\u2193\u2190]]\"\n\t\t\t\t\tonSelect={() => {\n\t\t\t\t\t\t/* do nothing */\n\t\t\t\t\t}}\n\t\t\t\t/>\n\t\t\t\t<TldrawUiMenuItem\n\t\t\t\t\tid=\"a11y-move-shape-faster\"\n\t\t\t\t\tlabel=\"a11y.move-shape-faster\"\n\t\t\t\t\tkbd=\"shift+[[\u2191\u2192\u2193\u2190]]\"\n\t\t\t\t\tonSelect={() => {\n\t\t\t\t\t\t/* do nothing */\n\t\t\t\t\t}}\n\t\t\t\t/>\n\t\t\t\t<TldrawUiMenuItem\n\t\t\t\t\tid=\"a11y-rotate-shape-cw\"\n\t\t\t\t\tlabel=\"a11y.rotate-shape-cw\"\n\t\t\t\t\tkbd=\"shift+\uFE65\"\n\t\t\t\t\tonSelect={() => {\n\t\t\t\t\t\t/* do nothing */\n\t\t\t\t\t}}\n\t\t\t\t/>\n\t\t\t\t<TldrawUiMenuItem\n\t\t\t\t\tid=\"a11y-rotate-shape-cw-fine\"\n\t\t\t\t\tlabel=\"a11y.rotate-shape-cw-fine\"\n\t\t\t\t\tkbd=\"shift+alt+\uFE65\"\n\t\t\t\t\tonSelect={() => {\n\t\t\t\t\t\t/* do nothing */\n\t\t\t\t\t}}\n\t\t\t\t/>\n\t\t\t\t<TldrawUiMenuItem\n\t\t\t\t\tid=\"a11y-rotate-shape-ccw\"\n\t\t\t\t\tlabel=\"a11y.rotate-shape-ccw\"\n\t\t\t\t\tkbd=\"shift+\uFE64\"\n\t\t\t\t\tonSelect={() => {\n\t\t\t\t\t\t/* do nothing */\n\t\t\t\t\t}}\n\t\t\t\t/>\n\t\t\t\t<TldrawUiMenuItem\n\t\t\t\t\tid=\"a11y-rotate-shape-ccw-fine\"\n\t\t\t\t\tlabel=\"a11y.rotate-shape-ccw-fine\"\n\t\t\t\t\tkbd=\"shift+alt+\uFE64\"\n\t\t\t\t\tonSelect={() => {\n\t\t\t\t\t\t/* do nothing */\n\t\t\t\t\t}}\n\t\t\t\t/>\n\t\t\t\t<TldrawUiMenuActionItem actionId=\"enlarge-shapes\" />\n\t\t\t\t<TldrawUiMenuActionItem actionId=\"shrink-shapes\" />\n\t\t\t\t<TldrawUiMenuActionItem actionId=\"a11y-repeat-shape-announce\" />\n\t\t\t\t<TldrawUiMenuItem\n\t\t\t\t\tid=\"a11y-open-keyboard-shortcuts\"\n\t\t\t\t\tlabel=\"a11y.open-keyboard-shortcuts\"\n\t\t\t\t\tkbd=\"cmd+alt+/\"\n\t\t\t\t\tonSelect={() => {\n\t\t\t\t\t\t/* do nothing */\n\t\t\t\t\t}}\n\t\t\t\t/>\n\t\t\t</TldrawUiMenuGroup>\n\t\t\t{showCollaborationUi && (\n\t\t\t\t<TldrawUiMenuGroup label=\"shortcuts-dialog.collaboration\" id=\"collaboration\">\n\t\t\t\t\t<TldrawUiMenuActionItem actionId=\"open-cursor-chat\" />\n\t\t\t\t</TldrawUiMenuGroup>\n\t\t\t)}\n\t\t</>\n\t)\n}\n"],
5
5
  "mappings": "AAUE,mBAEE,KADD,YADD;AAVF,SAAS,8BAA8B;AACvC,SAAS,8BAA8B;AACvC,SAAS,yBAAyB;AAClC,SAAS,wBAAwB;AACjC,SAAS,4BAA4B;AAG9B,SAAS,wCAAwC;AACvD,QAAM,sBAAsB,uBAAuB;AACnD,SACC,iCACC;AAAA,yBAAC,qBAAkB,OAAM,0BAAyB,IAAG,SACpD;AAAA,0BAAC,0BAAuB,UAAS,oBAAmB;AAAA,MACpD,oBAAC,0BAAuB,UAAS,gBAAe;AAAA,MAChD,oBAAC,wBAAqB,QAAO,UAAS;AAAA,MACtC,oBAAC,wBAAqB,QAAO,QAAO;AAAA,MACpC,oBAAC,wBAAqB,QAAO,UAAS;AAAA,MACtC,oBAAC,wBAAqB,QAAO,QAAO;AAAA,MACpC,oBAAC,wBAAqB,QAAO,aAAY;AAAA,MACzC,oBAAC,wBAAqB,QAAO,WAAU;AAAA,MACvC,oBAAC,wBAAqB,QAAO,SAAQ;AAAA,MACrC,oBAAC,wBAAqB,QAAO,QAAO;AAAA,MACpC,oBAAC,wBAAqB,QAAO,QAAO;AAAA,MACpC,oBAAC,wBAAqB,QAAO,SAAQ;AAAA,MACrC,oBAAC,wBAAqB,QAAO,QAAO;AAAA,MACpC,oBAAC,wBAAqB,QAAO,SAAQ;AAAA,MACrC;AAAA,QAAC;AAAA;AAAA,UACA,IAAG;AAAA,UACH,OAAM;AAAA,UACN,KAAI;AAAA,UACJ,UAAU,MAAM;AAAA,UAEhB;AAAA;AAAA,MACD;AAAA,OACD;AAAA,IACA,qBAAC,qBAAkB,OAAM,gCAA+B,IAAG,eAC1D;AAAA,0BAAC,0BAAuB,UAAS,oBAAmB;AAAA,MACpD,oBAAC,0BAAuB,UAAS,qBAAoB;AAAA,MACrD,oBAAC,0BAAuB,UAAS,eAAc;AAAA,OAChD;AAAA,IACA,qBAAC,qBAAkB,OAAM,yBAAwB,IAAG,QACnD;AAAA,0BAAC,0BAAuB,UAAS,QAAO;AAAA,MACxC,oBAAC,0BAAuB,UAAS,QAAO;AAAA,MACxC,oBAAC,0BAAuB,UAAS,OAAM;AAAA,MACvC,oBAAC,0BAAuB,UAAS,QAAO;AAAA,MACxC,oBAAC,0BAAuB,UAAS,SAAQ;AAAA,MACzC,oBAAC,0BAAuB,UAAS,cAAa;AAAA,MAC9C,oBAAC,0BAAuB,UAAS,UAAS;AAAA,MAC1C,oBAAC,0BAAuB,UAAS,aAAY;AAAA,OAC9C;AAAA,IACA,qBAAC,qBAAkB,OAAM,yBAAwB,IAAG,QACnD;AAAA,0BAAC,0BAAuB,UAAS,WAAU;AAAA,MAC3C,oBAAC,0BAAuB,UAAS,YAAW;AAAA,MAC5C,oBAAC,0BAAuB,UAAS,eAAc;AAAA,MAC/C,oBAAC,0BAAuB,UAAS,eAAc;AAAA,MAC/C,oBAAC,0BAAuB,UAAS,qBAAoB;AAAA,OACtD;AAAA,IACA,qBAAC,qBAAkB,OAAM,8BAA6B,IAAG,aACxD;AAAA,0BAAC,0BAAuB,UAAS,kBAAiB;AAAA,MAClD,oBAAC,0BAAuB,UAAS,iBAAgB;AAAA,MACjD,oBAAC,0BAAuB,UAAS,iBAAgB;AAAA,MACjD,oBAAC,0BAAuB,UAAS,gBAAe;AAAA,MAChD,oBAAC,0BAAuB,UAAS,SAAQ;AAAA,MACzC,oBAAC,0BAAuB,UAAS,WAAU;AAAA,MAC3C,oBAAC,0BAAuB,UAAS,mBAAkB;AAAA,MACnD,oBAAC,0BAAuB,UAAS,iBAAgB;AAAA,MACjD,oBAAC,0BAAuB,UAAS,aAAY;AAAA,MAC7C,oBAAC,0BAAuB,UAAS,yBAAwB;AAAA,MACzD,oBAAC,0BAAuB,UAAS,gBAAe;AAAA,MAChD,oBAAC,0BAAuB,UAAS,cAAa;AAAA,MAC9C,oBAAC,0BAAuB,UAAS,2BAA0B;AAAA,MAC3D,oBAAC,0BAAuB,UAAS,eAAc;AAAA,OAChD;AAAA,IACA,qBAAC,qBAAkB,OAAM,oCAAmC,IAAG,QAC9D;AAAA;AAAA,QAAC;AAAA;AAAA,UACA,IAAG;AAAA,UACH,OAAM;AAAA,UACN,KAAI;AAAA,UACJ,UAAU,MAAM;AAAA,UAEhB;AAAA;AAAA,MACD;AAAA,MACA;AAAA,QAAC;AAAA;AAAA,UACA,IAAG;AAAA,UACH,OAAM;AAAA,UACN,KAAI;AAAA,UACJ,UAAU,MAAM;AAAA,UAEhB;AAAA;AAAA,MACD;AAAA,MACA;AAAA,QAAC;AAAA;AAAA,UACA,IAAG;AAAA,UACH,OAAM;AAAA,UACN,KAAI;AAAA,UACJ,UAAU,MAAM;AAAA,UAEhB;AAAA;AAAA,MACD;AAAA,MACA;AAAA,QAAC;AAAA;AAAA,UACA,IAAG;AAAA,UACH,OAAM;AAAA,UACN,KAAI;AAAA,UACJ,UAAU,MAAM;AAAA,UAEhB;AAAA;AAAA,MACD;AAAA,MACA;AAAA,QAAC;AAAA;AAAA,UACA,IAAG;AAAA,UACH,OAAM;AAAA,UACN,KAAI;AAAA,UACJ,UAAU,MAAM;AAAA,UAEhB;AAAA;AAAA,MACD;AAAA,MACA;AAAA,QAAC;AAAA;AAAA,UACA,IAAG;AAAA,UACH,OAAM;AAAA,UACN,KAAI;AAAA,UACJ,UAAU,MAAM;AAAA,UAEhB;AAAA;AAAA,MACD;AAAA,MACA;AAAA,QAAC;AAAA;AAAA,UACA,IAAG;AAAA,UACH,OAAM;AAAA,UACN,KAAI;AAAA,UACJ,UAAU,MAAM;AAAA,UAEhB;AAAA;AAAA,MACD;AAAA,MACA;AAAA,QAAC;AAAA;AAAA,UACA,IAAG;AAAA,UACH,OAAM;AAAA,UACN,KAAI;AAAA,UACJ,UAAU,MAAM;AAAA,UAEhB;AAAA;AAAA,MACD;AAAA,MACA;AAAA,QAAC;AAAA;AAAA,UACA,IAAG;AAAA,UACH,OAAM;AAAA,UACN,KAAI;AAAA,UACJ,UAAU,MAAM;AAAA,UAEhB;AAAA;AAAA,MACD;AAAA,OACD;AAAA,IACA,qBAAC,qBAAkB,OAAM,yBAAwB,IAAG,QACnD;AAAA;AAAA,QAAC;AAAA;AAAA,UACA,IAAG;AAAA,UACH,OAAM;AAAA,UACN,KAAI;AAAA,UACJ,UAAU,MAAM;AAAA,UAEhB;AAAA;AAAA,MACD;AAAA,MACA;AAAA,QAAC;AAAA;AAAA,UACA,IAAG;AAAA,UACH,OAAM;AAAA,UACN,KAAI;AAAA,UACJ,UAAU,MAAM;AAAA,UAEhB;AAAA;AAAA,MACD;AAAA,MACA;AAAA,QAAC;AAAA;AAAA,UACA,IAAG;AAAA,UACH,OAAM;AAAA,UACN,KAAI;AAAA,UACJ,UAAU,MAAM;AAAA,UAEhB;AAAA;AAAA,MACD;AAAA,MACA;AAAA,QAAC;AAAA;AAAA,UACA,IAAG;AAAA,UACH,OAAM;AAAA,UACN,KAAI;AAAA,UACJ,UAAU,MAAM;AAAA,UAEhB;AAAA;AAAA,MACD;AAAA,MACA;AAAA,QAAC;AAAA;AAAA,UACA,IAAG;AAAA,UACH,OAAM;AAAA,UACN,KAAI;AAAA,UACJ,UAAU,MAAM;AAAA,UAEhB;AAAA;AAAA,MACD;AAAA,MACA;AAAA,QAAC;AAAA;AAAA,UACA,IAAG;AAAA,UACH,OAAM;AAAA,UACN,KAAI;AAAA,UACJ,UAAU,MAAM;AAAA,UAEhB;AAAA;AAAA,MACD;AAAA,MACA;AAAA,QAAC;AAAA;AAAA,UACA,IAAG;AAAA,UACH,OAAM;AAAA,UACN,KAAI;AAAA,UACJ,UAAU,MAAM;AAAA,UAEhB;AAAA;AAAA,MACD;AAAA,MACA;AAAA,QAAC;AAAA;AAAA,UACA,IAAG;AAAA,UACH,OAAM;AAAA,UACN,KAAI;AAAA,UACJ,UAAU,MAAM;AAAA,UAEhB;AAAA;AAAA,MACD;AAAA,MACA;AAAA,QAAC;AAAA;AAAA,UACA,IAAG;AAAA,UACH,OAAM;AAAA,UACN,KAAI;AAAA,UACJ,UAAU,MAAM;AAAA,UAEhB;AAAA;AAAA,MACD;AAAA,MACA;AAAA,QAAC;AAAA;AAAA,UACA,IAAG;AAAA,UACH,OAAM;AAAA,UACN,KAAI;AAAA,UACJ,UAAU,MAAM;AAAA,UAEhB;AAAA;AAAA,MACD;AAAA,MACA;AAAA,QAAC;AAAA;AAAA,UACA,IAAG;AAAA,UACH,OAAM;AAAA,UACN,KAAI;AAAA,UACJ,UAAU,MAAM;AAAA,UAEhB;AAAA;AAAA,MACD;AAAA,MACA;AAAA,QAAC;AAAA;AAAA,UACA,IAAG;AAAA,UACH,OAAM;AAAA,UACN,KAAI;AAAA,UACJ,UAAU,MAAM;AAAA,UAEhB;AAAA;AAAA,MACD;AAAA,MACA,oBAAC,0BAAuB,UAAS,kBAAiB;AAAA,MAClD,oBAAC,0BAAuB,UAAS,iBAAgB;AAAA,MACjD,oBAAC,0BAAuB,UAAS,8BAA6B;AAAA,MAC9D;AAAA,QAAC;AAAA;AAAA,UACA,IAAG;AAAA,UACH,OAAM;AAAA,UACN,KAAI;AAAA,UACJ,UAAU,MAAM;AAAA,UAEhB;AAAA;AAAA,MACD;AAAA,OACD;AAAA,IACC,uBACA,oBAAC,qBAAkB,OAAM,kCAAiC,IAAG,iBAC5D,8BAAC,0BAAuB,UAAS,oBAAmB,GACrD;AAAA,KAEF;AAEF;",
6
6
  "names": []
7
7
  }
@@ -1,24 +1,32 @@
1
1
  import { jsx } from "react/jsx-runtime";
2
- import { useEditor, usePassThroughWheelEvents, useValue } from "@tldraw/editor";
2
+ import {
3
+ useEditor,
4
+ usePassThroughWheelEvents,
5
+ useValue
6
+ } from "@tldraw/editor";
3
7
  import classNames from "classnames";
4
8
  import { memo, useCallback, useEffect, useRef } from "react";
5
9
  import { useRelevantStyles } from "../../hooks/useRelevantStyles.mjs";
6
10
  import { DefaultStylePanelContent } from "./DefaultStylePanelContent.mjs";
11
+ import { StylePanelContextProvider } from "./StylePanelContext.mjs";
7
12
  const DefaultStylePanel = memo(function DefaultStylePanel2({
8
13
  isMobile,
14
+ styles,
9
15
  children
10
16
  }) {
11
17
  const editor = useEditor();
12
18
  const showUiLabels = useValue("showUiLabels", () => editor.user.getShowUiLabels(), [editor]);
13
19
  const ref = useRef(null);
14
20
  usePassThroughWheelEvents(ref);
15
- const styles = useRelevantStyles();
16
21
  const handlePointerOut = useCallback(() => {
17
22
  if (!isMobile) {
18
23
  editor.updateInstanceState({ isChangingStyle: false });
19
24
  }
20
25
  }, [editor, isMobile]);
21
- const content = children ?? /* @__PURE__ */ jsx(DefaultStylePanelContent, { styles });
26
+ const defaultStyles = useRelevantStyles();
27
+ if (styles === void 0) {
28
+ styles = defaultStyles;
29
+ }
22
30
  useEffect(() => {
23
31
  function handleKeyDown(event) {
24
32
  if (event.key === "Escape" && ref.current?.contains(document.activeElement)) {
@@ -32,15 +40,16 @@ const DefaultStylePanel = memo(function DefaultStylePanel2({
32
40
  stylePanelContainerEl?.removeEventListener("keydown", handleKeyDown, { capture: true });
33
41
  };
34
42
  }, [editor]);
35
- return /* @__PURE__ */ jsx(
43
+ return styles && /* @__PURE__ */ jsx(
36
44
  "div",
37
45
  {
38
46
  ref,
47
+ "data-testid": "style.panel",
39
48
  className: classNames("tlui-style-panel", { "tlui-style-panel__wrapper": !isMobile }),
40
49
  "data-ismobile": isMobile,
41
50
  "data-show-ui-labels": showUiLabels,
42
51
  onPointerLeave: handlePointerOut,
43
- children: content
52
+ children: /* @__PURE__ */ jsx(StylePanelContextProvider, { styles, children: children ?? /* @__PURE__ */ jsx(DefaultStylePanelContent, {}) })
44
53
  }
45
54
  );
46
55
  });
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../../src/lib/ui/components/StylePanel/DefaultStylePanel.tsx"],
4
- "sourcesContent": ["import { useEditor, usePassThroughWheelEvents, useValue } from '@tldraw/editor'\nimport classNames from 'classnames'\nimport { ReactNode, memo, useCallback, useEffect, useRef } from 'react'\nimport { useRelevantStyles } from '../../hooks/useRelevantStyles'\nimport { DefaultStylePanelContent } from './DefaultStylePanelContent'\n\n/** @public */\nexport interface TLUiStylePanelProps {\n\tisMobile?: boolean\n\tchildren?: ReactNode\n}\n\n/** @public @react */\nexport const DefaultStylePanel = memo(function DefaultStylePanel({\n\tisMobile,\n\tchildren,\n}: TLUiStylePanelProps) {\n\tconst editor = useEditor()\n\tconst showUiLabels = useValue('showUiLabels', () => editor.user.getShowUiLabels(), [editor])\n\n\tconst ref = useRef<HTMLDivElement>(null)\n\tusePassThroughWheelEvents(ref)\n\n\tconst styles = useRelevantStyles()\n\n\tconst handlePointerOut = useCallback(() => {\n\t\tif (!isMobile) {\n\t\t\teditor.updateInstanceState({ isChangingStyle: false })\n\t\t}\n\t}, [editor, isMobile])\n\n\tconst content = children ?? <DefaultStylePanelContent styles={styles} />\n\n\tuseEffect(() => {\n\t\tfunction handleKeyDown(event: KeyboardEvent) {\n\t\t\tif (event.key === 'Escape' && ref.current?.contains(document.activeElement)) {\n\t\t\t\tevent.stopPropagation()\n\t\t\t\teditor.getContainer().focus()\n\t\t\t}\n\t\t}\n\n\t\tconst stylePanelContainerEl = ref.current\n\t\tstylePanelContainerEl?.addEventListener('keydown', handleKeyDown, { capture: true })\n\t\treturn () => {\n\t\t\tstylePanelContainerEl?.removeEventListener('keydown', handleKeyDown, { capture: true })\n\t\t}\n\t}, [editor])\n\n\treturn (\n\t\t<div\n\t\t\tref={ref}\n\t\t\tclassName={classNames('tlui-style-panel', { 'tlui-style-panel__wrapper': !isMobile })}\n\t\t\tdata-ismobile={isMobile}\n\t\t\tdata-show-ui-labels={showUiLabels}\n\t\t\tonPointerLeave={handlePointerOut}\n\t\t>\n\t\t\t{content}\n\t\t</div>\n\t)\n})\n"],
5
- "mappings": "AA+B6B;AA/B7B,SAAS,WAAW,2BAA2B,gBAAgB;AAC/D,OAAO,gBAAgB;AACvB,SAAoB,MAAM,aAAa,WAAW,cAAc;AAChE,SAAS,yBAAyB;AAClC,SAAS,gCAAgC;AASlC,MAAM,oBAAoB,KAAK,SAASA,mBAAkB;AAAA,EAChE;AAAA,EACA;AACD,GAAwB;AACvB,QAAM,SAAS,UAAU;AACzB,QAAM,eAAe,SAAS,gBAAgB,MAAM,OAAO,KAAK,gBAAgB,GAAG,CAAC,MAAM,CAAC;AAE3F,QAAM,MAAM,OAAuB,IAAI;AACvC,4BAA0B,GAAG;AAE7B,QAAM,SAAS,kBAAkB;AAEjC,QAAM,mBAAmB,YAAY,MAAM;AAC1C,QAAI,CAAC,UAAU;AACd,aAAO,oBAAoB,EAAE,iBAAiB,MAAM,CAAC;AAAA,IACtD;AAAA,EACD,GAAG,CAAC,QAAQ,QAAQ,CAAC;AAErB,QAAM,UAAU,YAAY,oBAAC,4BAAyB,QAAgB;AAEtE,YAAU,MAAM;AACf,aAAS,cAAc,OAAsB;AAC5C,UAAI,MAAM,QAAQ,YAAY,IAAI,SAAS,SAAS,SAAS,aAAa,GAAG;AAC5E,cAAM,gBAAgB;AACtB,eAAO,aAAa,EAAE,MAAM;AAAA,MAC7B;AAAA,IACD;AAEA,UAAM,wBAAwB,IAAI;AAClC,2BAAuB,iBAAiB,WAAW,eAAe,EAAE,SAAS,KAAK,CAAC;AACnF,WAAO,MAAM;AACZ,6BAAuB,oBAAoB,WAAW,eAAe,EAAE,SAAS,KAAK,CAAC;AAAA,IACvF;AAAA,EACD,GAAG,CAAC,MAAM,CAAC;AAEX,SACC;AAAA,IAAC;AAAA;AAAA,MACA;AAAA,MACA,WAAW,WAAW,oBAAoB,EAAE,6BAA6B,CAAC,SAAS,CAAC;AAAA,MACpF,iBAAe;AAAA,MACf,uBAAqB;AAAA,MACrB,gBAAgB;AAAA,MAEf;AAAA;AAAA,EACF;AAEF,CAAC;",
4
+ "sourcesContent": ["import {\n\tReadonlySharedStyleMap,\n\tuseEditor,\n\tusePassThroughWheelEvents,\n\tuseValue,\n} from '@tldraw/editor'\nimport classNames from 'classnames'\nimport { ReactNode, memo, useCallback, useEffect, useRef } from 'react'\nimport { useRelevantStyles } from '../../hooks/useRelevantStyles'\nimport { DefaultStylePanelContent } from './DefaultStylePanelContent'\nimport { StylePanelContextProvider } from './StylePanelContext'\n\n/** @public */\nexport interface TLUiStylePanelProps {\n\tisMobile?: boolean\n\tstyles?: ReadonlySharedStyleMap | null\n\tchildren?: ReactNode\n}\n\n/** @public @react */\nexport const DefaultStylePanel = memo(function DefaultStylePanel({\n\tisMobile,\n\tstyles,\n\tchildren,\n}: TLUiStylePanelProps) {\n\tconst editor = useEditor()\n\tconst showUiLabels = useValue('showUiLabels', () => editor.user.getShowUiLabels(), [editor])\n\n\tconst ref = useRef<HTMLDivElement>(null)\n\tusePassThroughWheelEvents(ref)\n\n\tconst handlePointerOut = useCallback(() => {\n\t\tif (!isMobile) {\n\t\t\teditor.updateInstanceState({ isChangingStyle: false })\n\t\t}\n\t}, [editor, isMobile])\n\n\tconst defaultStyles = useRelevantStyles()\n\tif (styles === undefined) {\n\t\tstyles = defaultStyles\n\t}\n\n\tuseEffect(() => {\n\t\tfunction handleKeyDown(event: KeyboardEvent) {\n\t\t\tif (event.key === 'Escape' && ref.current?.contains(document.activeElement)) {\n\t\t\t\tevent.stopPropagation()\n\t\t\t\teditor.getContainer().focus()\n\t\t\t}\n\t\t}\n\n\t\tconst stylePanelContainerEl = ref.current\n\t\tstylePanelContainerEl?.addEventListener('keydown', handleKeyDown, { capture: true })\n\t\treturn () => {\n\t\t\tstylePanelContainerEl?.removeEventListener('keydown', handleKeyDown, { capture: true })\n\t\t}\n\t}, [editor])\n\n\treturn (\n\t\tstyles && (\n\t\t\t<div\n\t\t\t\tref={ref}\n\t\t\t\tdata-testid=\"style.panel\"\n\t\t\t\tclassName={classNames('tlui-style-panel', { 'tlui-style-panel__wrapper': !isMobile })}\n\t\t\t\tdata-ismobile={isMobile}\n\t\t\t\tdata-show-ui-labels={showUiLabels}\n\t\t\t\tonPointerLeave={handlePointerOut}\n\t\t\t>\n\t\t\t\t<StylePanelContextProvider styles={styles}>\n\t\t\t\t\t{children ?? <DefaultStylePanelContent />}\n\t\t\t\t</StylePanelContextProvider>\n\t\t\t</div>\n\t\t)\n\t)\n})\n"],
5
+ "mappings": "AAoEkB;AApElB;AAAA,EAEC;AAAA,EACA;AAAA,EACA;AAAA,OACM;AACP,OAAO,gBAAgB;AACvB,SAAoB,MAAM,aAAa,WAAW,cAAc;AAChE,SAAS,yBAAyB;AAClC,SAAS,gCAAgC;AACzC,SAAS,iCAAiC;AAUnC,MAAM,oBAAoB,KAAK,SAASA,mBAAkB;AAAA,EAChE;AAAA,EACA;AAAA,EACA;AACD,GAAwB;AACvB,QAAM,SAAS,UAAU;AACzB,QAAM,eAAe,SAAS,gBAAgB,MAAM,OAAO,KAAK,gBAAgB,GAAG,CAAC,MAAM,CAAC;AAE3F,QAAM,MAAM,OAAuB,IAAI;AACvC,4BAA0B,GAAG;AAE7B,QAAM,mBAAmB,YAAY,MAAM;AAC1C,QAAI,CAAC,UAAU;AACd,aAAO,oBAAoB,EAAE,iBAAiB,MAAM,CAAC;AAAA,IACtD;AAAA,EACD,GAAG,CAAC,QAAQ,QAAQ,CAAC;AAErB,QAAM,gBAAgB,kBAAkB;AACxC,MAAI,WAAW,QAAW;AACzB,aAAS;AAAA,EACV;AAEA,YAAU,MAAM;AACf,aAAS,cAAc,OAAsB;AAC5C,UAAI,MAAM,QAAQ,YAAY,IAAI,SAAS,SAAS,SAAS,aAAa,GAAG;AAC5E,cAAM,gBAAgB;AACtB,eAAO,aAAa,EAAE,MAAM;AAAA,MAC7B;AAAA,IACD;AAEA,UAAM,wBAAwB,IAAI;AAClC,2BAAuB,iBAAiB,WAAW,eAAe,EAAE,SAAS,KAAK,CAAC;AACnF,WAAO,MAAM;AACZ,6BAAuB,oBAAoB,WAAW,eAAe,EAAE,SAAS,KAAK,CAAC;AAAA,IACvF;AAAA,EACD,GAAG,CAAC,MAAM,CAAC;AAEX,SACC,UACC;AAAA,IAAC;AAAA;AAAA,MACA;AAAA,MACA,eAAY;AAAA,MACZ,WAAW,WAAW,oBAAoB,EAAE,6BAA6B,CAAC,SAAS,CAAC;AAAA,MACpF,iBAAe;AAAA,MACf,uBAAqB;AAAA,MACrB,gBAAgB;AAAA,MAEhB,8BAAC,6BAA0B,QACzB,sBAAY,oBAAC,4BAAyB,GACxC;AAAA;AAAA,EACD;AAGH,CAAC;",
6
6
  "names": ["DefaultStylePanel"]
7
7
  }