tldraw 3.16.0-canary.6f3aedaa1c01 → 3.16.0-canary.7cd3b8a5bfd6

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 (123) hide show
  1. package/dist-cjs/index.d.ts +45 -4
  2. package/dist-cjs/index.js +4 -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/elbow/ElbowArrowDebug.js +3 -3
  7. package/dist-cjs/lib/shapes/arrow/elbow/ElbowArrowDebug.js.map +1 -1
  8. package/dist-cjs/lib/shapes/embed/EmbedShapeUtil.js +1 -1
  9. package/dist-cjs/lib/shapes/embed/EmbedShapeUtil.js.map +1 -1
  10. package/dist-cjs/lib/shapes/frame/FrameShapeUtil.js +4 -4
  11. package/dist-cjs/lib/shapes/frame/FrameShapeUtil.js.map +2 -2
  12. package/dist-cjs/lib/shapes/frame/components/FrameHeading.js +1 -1
  13. package/dist-cjs/lib/shapes/frame/components/FrameHeading.js.map +2 -2
  14. package/dist-cjs/lib/shapes/image/ImageShapeUtil.js +3 -3
  15. package/dist-cjs/lib/shapes/image/ImageShapeUtil.js.map +1 -1
  16. package/dist-cjs/lib/shapes/shared/ShapeFill.js +1 -1
  17. package/dist-cjs/lib/shapes/shared/ShapeFill.js.map +2 -2
  18. package/dist-cjs/lib/shapes/video/VideoShapeUtil.js +3 -3
  19. package/dist-cjs/lib/shapes/video/VideoShapeUtil.js.map +1 -1
  20. package/dist-cjs/lib/ui/TldrawUi.js +14 -0
  21. package/dist-cjs/lib/ui/TldrawUi.js.map +3 -3
  22. package/dist-cjs/lib/ui/components/ActionsMenu/DefaultActionsMenu.js +10 -2
  23. package/dist-cjs/lib/ui/components/ActionsMenu/DefaultActionsMenu.js.map +2 -2
  24. package/dist-cjs/lib/ui/components/Minimap/MinimapManager.js +4 -4
  25. package/dist-cjs/lib/ui/components/Minimap/MinimapManager.js.map +2 -2
  26. package/dist-cjs/lib/ui/components/MobileStylePanel.js +4 -2
  27. package/dist-cjs/lib/ui/components/MobileStylePanel.js.map +2 -2
  28. package/dist-cjs/lib/ui/components/Toolbar/DefaultImageToolbarContent.js +1 -1
  29. package/dist-cjs/lib/ui/components/Toolbar/DefaultImageToolbarContent.js.map +2 -2
  30. package/dist-cjs/lib/ui/components/Toolbar/DefaultToolbar.js +66 -22
  31. package/dist-cjs/lib/ui/components/Toolbar/DefaultToolbar.js.map +3 -3
  32. package/dist-cjs/lib/ui/components/Toolbar/OverflowingToolbar.js +188 -78
  33. package/dist-cjs/lib/ui/components/Toolbar/OverflowingToolbar.js.map +3 -3
  34. package/dist-cjs/lib/ui/components/primitives/TldrawUiToolbar.js +15 -3
  35. package/dist-cjs/lib/ui/components/primitives/TldrawUiToolbar.js.map +2 -2
  36. package/dist-cjs/lib/ui/components/primitives/TldrawUiTooltip.js +144 -160
  37. package/dist-cjs/lib/ui/components/primitives/TldrawUiTooltip.js.map +2 -2
  38. package/dist-cjs/lib/ui/components/primitives/layout.js +30 -5
  39. package/dist-cjs/lib/ui/components/primitives/layout.js.map +2 -2
  40. package/dist-cjs/lib/ui/components/primitives/menus/TldrawUiMenuContext.js.map +2 -2
  41. package/dist-cjs/lib/ui/components/primitives/menus/TldrawUiMenuGroup.js +25 -12
  42. package/dist-cjs/lib/ui/components/primitives/menus/TldrawUiMenuGroup.js.map +2 -2
  43. package/dist-cjs/lib/ui/components/primitives/menus/TldrawUiMenuItem.js +1 -18
  44. package/dist-cjs/lib/ui/components/primitives/menus/TldrawUiMenuItem.js.map +2 -2
  45. package/dist-cjs/lib/ui/hooks/useTools.js +21 -3
  46. package/dist-cjs/lib/ui/hooks/useTools.js.map +2 -2
  47. package/dist-cjs/lib/ui/version.js +3 -3
  48. package/dist-cjs/lib/ui/version.js.map +1 -1
  49. package/dist-esm/index.d.mts +45 -4
  50. package/dist-esm/index.mjs +8 -2
  51. package/dist-esm/index.mjs.map +2 -2
  52. package/dist-esm/lib/canvas/TldrawScribble.mjs +1 -1
  53. package/dist-esm/lib/canvas/TldrawScribble.mjs.map +2 -2
  54. package/dist-esm/lib/shapes/arrow/elbow/ElbowArrowDebug.mjs +3 -3
  55. package/dist-esm/lib/shapes/arrow/elbow/ElbowArrowDebug.mjs.map +1 -1
  56. package/dist-esm/lib/shapes/embed/EmbedShapeUtil.mjs +1 -1
  57. package/dist-esm/lib/shapes/embed/EmbedShapeUtil.mjs.map +1 -1
  58. package/dist-esm/lib/shapes/frame/FrameShapeUtil.mjs +4 -4
  59. package/dist-esm/lib/shapes/frame/FrameShapeUtil.mjs.map +2 -2
  60. package/dist-esm/lib/shapes/frame/components/FrameHeading.mjs +1 -1
  61. package/dist-esm/lib/shapes/frame/components/FrameHeading.mjs.map +2 -2
  62. package/dist-esm/lib/shapes/image/ImageShapeUtil.mjs +3 -3
  63. package/dist-esm/lib/shapes/image/ImageShapeUtil.mjs.map +1 -1
  64. package/dist-esm/lib/shapes/shared/ShapeFill.mjs +1 -1
  65. package/dist-esm/lib/shapes/shared/ShapeFill.mjs.map +2 -2
  66. package/dist-esm/lib/shapes/video/VideoShapeUtil.mjs +3 -3
  67. package/dist-esm/lib/shapes/video/VideoShapeUtil.mjs.map +1 -1
  68. package/dist-esm/lib/ui/TldrawUi.mjs +16 -2
  69. package/dist-esm/lib/ui/TldrawUi.mjs.map +3 -3
  70. package/dist-esm/lib/ui/components/ActionsMenu/DefaultActionsMenu.mjs +10 -2
  71. package/dist-esm/lib/ui/components/ActionsMenu/DefaultActionsMenu.mjs.map +2 -2
  72. package/dist-esm/lib/ui/components/Minimap/MinimapManager.mjs +4 -4
  73. package/dist-esm/lib/ui/components/Minimap/MinimapManager.mjs.map +2 -2
  74. package/dist-esm/lib/ui/components/MobileStylePanel.mjs +4 -2
  75. package/dist-esm/lib/ui/components/MobileStylePanel.mjs.map +2 -2
  76. package/dist-esm/lib/ui/components/Toolbar/DefaultImageToolbarContent.mjs +1 -1
  77. package/dist-esm/lib/ui/components/Toolbar/DefaultImageToolbarContent.mjs.map +2 -2
  78. package/dist-esm/lib/ui/components/Toolbar/DefaultToolbar.mjs +56 -22
  79. package/dist-esm/lib/ui/components/Toolbar/DefaultToolbar.mjs.map +2 -2
  80. package/dist-esm/lib/ui/components/Toolbar/OverflowingToolbar.mjs +192 -80
  81. package/dist-esm/lib/ui/components/Toolbar/OverflowingToolbar.mjs.map +3 -3
  82. package/dist-esm/lib/ui/components/primitives/TldrawUiToolbar.mjs +16 -4
  83. package/dist-esm/lib/ui/components/primitives/TldrawUiToolbar.mjs.map +2 -2
  84. package/dist-esm/lib/ui/components/primitives/TldrawUiTooltip.mjs +153 -162
  85. package/dist-esm/lib/ui/components/primitives/TldrawUiTooltip.mjs.map +2 -2
  86. package/dist-esm/lib/ui/components/primitives/layout.mjs +31 -6
  87. package/dist-esm/lib/ui/components/primitives/layout.mjs.map +2 -2
  88. package/dist-esm/lib/ui/components/primitives/menus/TldrawUiMenuContext.mjs.map +2 -2
  89. package/dist-esm/lib/ui/components/primitives/menus/TldrawUiMenuGroup.mjs +25 -12
  90. package/dist-esm/lib/ui/components/primitives/menus/TldrawUiMenuGroup.mjs.map +2 -2
  91. package/dist-esm/lib/ui/components/primitives/menus/TldrawUiMenuItem.mjs +1 -18
  92. package/dist-esm/lib/ui/components/primitives/menus/TldrawUiMenuItem.mjs.map +2 -2
  93. package/dist-esm/lib/ui/hooks/useTools.mjs +22 -3
  94. package/dist-esm/lib/ui/hooks/useTools.mjs.map +2 -2
  95. package/dist-esm/lib/ui/version.mjs +3 -3
  96. package/dist-esm/lib/ui/version.mjs.map +1 -1
  97. package/package.json +3 -3
  98. package/src/index.ts +5 -0
  99. package/src/lib/canvas/TldrawScribble.tsx +1 -1
  100. package/src/lib/shapes/arrow/elbow/ElbowArrowDebug.tsx +3 -3
  101. package/src/lib/shapes/embed/EmbedShapeUtil.tsx +1 -1
  102. package/src/lib/shapes/frame/FrameShapeUtil.tsx +12 -4
  103. package/src/lib/shapes/frame/components/FrameHeading.tsx +1 -1
  104. package/src/lib/shapes/image/ImageShapeUtil.tsx +3 -3
  105. package/src/lib/shapes/shared/ShapeFill.tsx +1 -1
  106. package/src/lib/shapes/video/VideoShapeUtil.tsx +3 -3
  107. package/src/lib/ui/TldrawUi.tsx +17 -2
  108. package/src/lib/ui/components/ActionsMenu/DefaultActionsMenu.tsx +13 -2
  109. package/src/lib/ui/components/Minimap/MinimapManager.ts +4 -4
  110. package/src/lib/ui/components/MobileStylePanel.tsx +4 -3
  111. package/src/lib/ui/components/Toolbar/DefaultImageToolbarContent.tsx +1 -1
  112. package/src/lib/ui/components/Toolbar/DefaultToolbar.tsx +55 -24
  113. package/src/lib/ui/components/Toolbar/OverflowingToolbar.tsx +208 -56
  114. package/src/lib/ui/components/primitives/TldrawUiToolbar.tsx +22 -5
  115. package/src/lib/ui/components/primitives/TldrawUiTooltip.tsx +175 -180
  116. package/src/lib/ui/components/primitives/layout.tsx +79 -5
  117. package/src/lib/ui/components/primitives/menus/TldrawUiMenuContext.tsx +0 -1
  118. package/src/lib/ui/components/primitives/menus/TldrawUiMenuGroup.tsx +29 -16
  119. package/src/lib/ui/components/primitives/menus/TldrawUiMenuItem.tsx +2 -16
  120. package/src/lib/ui/hooks/useTools.tsx +25 -3
  121. package/src/lib/ui/version.ts +3 -3
  122. package/src/lib/ui.css +346 -243
  123. package/tldraw.css +639 -533
@@ -120,7 +120,6 @@ export function TldrawUiMenuItem<
120
120
  type="menu"
121
121
  data-testid={`${sourceId}.${id}`}
122
122
  disabled={disabled}
123
- title={titleStr}
124
123
  onClick={(e) => {
125
124
  if (noClose) {
126
125
  preventDefault(e)
@@ -146,7 +145,6 @@ export function TldrawUiMenuItem<
146
145
  return (
147
146
  <_ContextMenu.Item
148
147
  dir="ltr"
149
- title={titleStr}
150
148
  draggable={false}
151
149
  className="tlui-button tlui-button__menu"
152
150
  data-testid={`${sourceId}.${id}`}
@@ -168,20 +166,6 @@ export function TldrawUiMenuItem<
168
166
  </_ContextMenu.Item>
169
167
  )
170
168
  }
171
- case 'panel': {
172
- return (
173
- <TldrawUiButton
174
- data-testid={`${sourceId}.${id}`}
175
- type="menu"
176
- title={titleStr}
177
- disabled={disabled}
178
- onClick={() => onSelect(sourceId)}
179
- >
180
- <TldrawUiButtonLabel>{labelStr}</TldrawUiButtonLabel>
181
- {spinner ? <Spinner /> : icon && <TldrawUiButtonIcon icon={icon} />}
182
- </TldrawUiButton>
183
- )
184
- }
185
169
  case 'small-icons':
186
170
  case 'icons': {
187
171
  return (
@@ -342,6 +326,8 @@ function useDraggableEvents(
342
326
  }
343
327
 
344
328
  editor.run(() => {
329
+ editor.setCurrentTool('select')
330
+
345
331
  // Set origin point
346
332
  editor.dispatch({
347
333
  type: 'pointer',
@@ -3,6 +3,8 @@ import {
3
3
  createShapeId,
4
4
  Editor,
5
5
  GeoShapeGeoStyle,
6
+ getIndicesBetween,
7
+ TLLineShape,
6
8
  TLPointerEventInfo,
7
9
  TLShapeId,
8
10
  toRichText,
@@ -153,7 +155,8 @@ export function ToolsProvider({ overrides, children }: TLUiToolsProviderProps) {
153
155
  },
154
156
  onDragStart(source: TLUiEventSource, info: TLPointerEventInfo) {
155
157
  onDragFromToolbarToCreateShape(editor, info, {
156
- createShape: (id) => editor.createShape({ id, type: 'geo', props: { geo } }),
158
+ createShape: (id) =>
159
+ editor.createShape({ id, type: 'geo', props: { w: 200, h: 200, geo } }),
157
160
  })
158
161
  trackEvent('drag-tool', { source, id: 'geo' })
159
162
  },
@@ -188,6 +191,24 @@ export function ToolsProvider({ overrides, children }: TLUiToolsProviderProps) {
188
191
  editor.setCurrentTool('line')
189
192
  onToolSelect(source, this)
190
193
  },
194
+ onDragStart(source, info) {
195
+ onDragFromToolbarToCreateShape(editor, info, {
196
+ createShape: (id) => {
197
+ const [start, end] = getIndicesBetween(null, null, 2)
198
+ editor.createShape<TLLineShape>({
199
+ id,
200
+ type: 'line',
201
+ props: {
202
+ points: {
203
+ [start]: { id: start, index: start, x: 0, y: 200 },
204
+ [end]: { id: end, index: end, x: 200, y: 0 },
205
+ },
206
+ },
207
+ })
208
+ },
209
+ })
210
+ trackEvent('drag-tool', { source, id: 'line' })
211
+ },
191
212
  },
192
213
  {
193
214
  id: 'frame',
@@ -219,8 +240,8 @@ export function ToolsProvider({ overrides, children }: TLUiToolsProviderProps) {
219
240
  createShape: (id) =>
220
241
  editor.createShape({ id, type: 'text', props: { richText: toRichText('Text') } }),
221
242
  onDragEnd: (id) => {
222
- editor.emit('select-all-text', { shapeId: id })
223
243
  editor.setEditingShape(id)
244
+ editor.emit('select-all-text', { shapeId: id })
224
245
  },
225
246
  })
226
247
  trackEvent('drag-tool', { source, id: 'text' })
@@ -249,8 +270,8 @@ export function ToolsProvider({ overrides, children }: TLUiToolsProviderProps) {
249
270
  onDragFromToolbarToCreateShape(editor, info, {
250
271
  createShape: (id) => editor.createShape({ id, type: 'note' }),
251
272
  onDragEnd: (id) => {
252
- editor.emit('select-all-text', { shapeId: id })
253
273
  editor.setEditingShape(id)
274
+ editor.emit('select-all-text', { shapeId: id })
254
275
  },
255
276
  })
256
277
  trackEvent('drag-tool', { source, id: 'note' })
@@ -365,5 +386,6 @@ export function onDragFromToolbarToCreateShape(
365
386
  opts.onDragEnd?.(id)
366
387
  },
367
388
  })
389
+
368
390
  editor.getCurrentTool().setCurrentToolIdMask(shape.type)
369
391
  }
@@ -1,9 +1,9 @@
1
1
  // This file is automatically generated by internal/scripts/refresh-assets.ts.
2
2
  // Do not edit manually. Or do, I'm a comment, not a cop.
3
3
 
4
- export const version = '3.16.0-canary.6f3aedaa1c01'
4
+ export const version = '3.16.0-canary.7cd3b8a5bfd6'
5
5
  export const publishDates = {
6
6
  major: '2024-09-13T14:36:29.063Z',
7
- minor: '2025-08-11T09:05:51.468Z',
8
- patch: '2025-08-11T09:05:51.468Z',
7
+ minor: '2025-08-14T11:59:40.260Z',
8
+ patch: '2025-08-14T11:59:40.260Z',
9
9
  }