tldraw 3.16.0-next.282b7be564ae → 3.16.0-next.6611943ca24a

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 (116) hide show
  1. package/dist-cjs/index.d.ts +71 -0
  2. package/dist-cjs/index.js +5 -1
  3. package/dist-cjs/index.js.map +2 -2
  4. package/dist-cjs/lib/shapes/shared/freehand/svg.js.map +2 -2
  5. package/dist-cjs/lib/tools/EraserTool/childStates/Erasing.js +25 -1
  6. package/dist-cjs/lib/tools/EraserTool/childStates/Erasing.js.map +2 -2
  7. package/dist-cjs/lib/tools/EraserTool/childStates/Pointing.js +12 -0
  8. package/dist-cjs/lib/tools/EraserTool/childStates/Pointing.js.map +2 -2
  9. package/dist-cjs/lib/ui/assetUrls.js +13 -10
  10. package/dist-cjs/lib/ui/assetUrls.js.map +2 -2
  11. package/dist-cjs/lib/ui/components/KeyboardShortcutsDialog/DefaultKeyboardShortcutsDialogContent.js +1 -1
  12. package/dist-cjs/lib/ui/components/KeyboardShortcutsDialog/DefaultKeyboardShortcutsDialogContent.js.map +1 -1
  13. package/dist-cjs/lib/ui/components/StylePanel/DropdownPicker.js +1 -1
  14. package/dist-cjs/lib/ui/components/StylePanel/DropdownPicker.js.map +2 -2
  15. package/dist-cjs/lib/ui/components/primitives/menus/TldrawUiMenuItem.js +2 -1
  16. package/dist-cjs/lib/ui/components/primitives/menus/TldrawUiMenuItem.js.map +2 -2
  17. package/dist-cjs/lib/ui/context/actions.js +16 -2
  18. package/dist-cjs/lib/ui/context/actions.js.map +2 -2
  19. package/dist-cjs/lib/ui/version.js +3 -3
  20. package/dist-cjs/lib/ui/version.js.map +1 -1
  21. package/dist-esm/index.d.mts +71 -0
  22. package/dist-esm/index.mjs +5 -1
  23. package/dist-esm/index.mjs.map +2 -2
  24. package/dist-esm/lib/shapes/shared/freehand/svg.mjs.map +2 -2
  25. package/dist-esm/lib/tools/EraserTool/childStates/Erasing.mjs +26 -1
  26. package/dist-esm/lib/tools/EraserTool/childStates/Erasing.mjs.map +2 -2
  27. package/dist-esm/lib/tools/EraserTool/childStates/Pointing.mjs +13 -0
  28. package/dist-esm/lib/tools/EraserTool/childStates/Pointing.mjs.map +2 -2
  29. package/dist-esm/lib/ui/assetUrls.mjs +13 -10
  30. package/dist-esm/lib/ui/assetUrls.mjs.map +2 -2
  31. package/dist-esm/lib/ui/components/KeyboardShortcutsDialog/DefaultKeyboardShortcutsDialogContent.mjs +1 -1
  32. package/dist-esm/lib/ui/components/KeyboardShortcutsDialog/DefaultKeyboardShortcutsDialogContent.mjs.map +1 -1
  33. package/dist-esm/lib/ui/components/StylePanel/DropdownPicker.mjs +1 -1
  34. package/dist-esm/lib/ui/components/StylePanel/DropdownPicker.mjs.map +2 -2
  35. package/dist-esm/lib/ui/components/primitives/menus/TldrawUiMenuItem.mjs +2 -1
  36. package/dist-esm/lib/ui/components/primitives/menus/TldrawUiMenuItem.mjs.map +2 -2
  37. package/dist-esm/lib/ui/context/actions.mjs +16 -2
  38. package/dist-esm/lib/ui/context/actions.mjs.map +2 -2
  39. package/dist-esm/lib/ui/version.mjs +3 -3
  40. package/dist-esm/lib/ui/version.mjs.map +1 -1
  41. package/package.json +11 -34
  42. package/src/index.ts +3 -0
  43. package/src/lib/shapes/arrow/ArrowShapeOptions.test.ts +2 -1
  44. package/src/lib/shapes/arrow/ArrowShapeTool.test.ts +4 -3
  45. package/src/lib/shapes/arrow/ArrowShapeUtil.test.ts +7 -6
  46. package/src/lib/shapes/draw/DrawShapeTool.test.ts +0 -5
  47. package/src/lib/shapes/line/LineShapeUtil.test.tsx +4 -3
  48. package/src/lib/shapes/line/__snapshots__/LineShapeUtil.test.tsx.snap +2 -2
  49. package/src/lib/shapes/shared/freehand/svg.ts +2 -0
  50. package/src/lib/shapes/text/TextShapeTool.test.ts +6 -5
  51. package/src/lib/tools/EraserTool/childStates/Erasing.ts +34 -1
  52. package/src/lib/tools/EraserTool/childStates/Pointing.ts +20 -0
  53. package/src/lib/ui/assetUrls.ts +13 -10
  54. package/src/lib/ui/components/KeyboardShortcutsDialog/DefaultKeyboardShortcutsDialogContent.tsx +1 -1
  55. package/src/lib/ui/components/StylePanel/DropdownPicker.tsx +1 -1
  56. package/src/lib/ui/components/primitives/menus/TldrawUiMenuItem.tsx +3 -2
  57. package/src/lib/ui/context/actions.tsx +16 -2
  58. package/src/lib/ui/version.ts +3 -3
  59. package/src/lib/ui.css +3 -0
  60. package/src/lib/utils/excalidraw/__snapshots__/putExcalidrawContent.test.tsx.snap +5 -5
  61. package/src/lib/utils/tldr/__snapshots__/buildFromV1Document.test.ts.snap +4 -4
  62. package/src/test/A11y.test.tsx +3 -2
  63. package/src/test/ClickManager.test.ts +7 -6
  64. package/src/test/Editor.test.tsx +20 -19
  65. package/src/test/EraserTool.test.ts +184 -13
  66. package/src/test/HandTool.test.ts +10 -9
  67. package/src/test/HighlightShape.test.ts +2 -1
  68. package/src/test/SelectTool.test.ts +3 -2
  69. package/src/test/TLUserPreferences.test.ts +4 -3
  70. package/src/test/TestEditor.ts +13 -15
  71. package/src/test/TldrawEditor.test.tsx +11 -10
  72. package/src/test/ZoomTool.test.ts +7 -6
  73. package/src/test/__snapshots__/drawing.test.ts.snap +2 -2
  74. package/src/test/__snapshots__/groups.test.tsx.snap +6 -6
  75. package/src/test/__snapshots__/resizing.test.ts.snap +2 -2
  76. package/src/test/arrows-megabus.test.tsx +5 -4
  77. package/src/test/bindings.test.tsx +24 -37
  78. package/src/test/bookmark-shapes.test.ts +1 -8
  79. package/src/test/commands/__snapshots__/getSvgString.test.ts.snap +23 -7
  80. package/src/test/commands/__snapshots__/packShapes.test.ts.snap +8 -8
  81. package/src/test/commands/__snapshots__/zoomToFit.test.ts.snap +2 -2
  82. package/src/test/commands/alignShapes.test.tsx +25 -24
  83. package/src/test/commands/animationSpeed.test.ts +2 -1
  84. package/src/test/commands/centerOnPoint.test.ts +3 -2
  85. package/src/test/commands/clipboard.test.ts +3 -2
  86. package/src/test/commands/createShapes.test.ts +2 -1
  87. package/src/test/commands/deleteShapes.test.ts +2 -1
  88. package/src/test/commands/distributeShapes.test.tsx +11 -10
  89. package/src/test/commands/getSvgString.test.ts +2 -1
  90. package/src/test/commands/packShapes.test.ts +5 -4
  91. package/src/test/commands/resizeShape.test.ts +2 -1
  92. package/src/test/commands/rotateShapes.test.ts +7 -6
  93. package/src/test/commands/setCamera.test.ts +4 -3
  94. package/src/test/commands/setCurrentPage.test.ts +3 -2
  95. package/src/test/commands/stackShapes.test.ts +11 -10
  96. package/src/test/commands/stretch.test.tsx +13 -12
  97. package/src/test/createDeepLink.test.tsx +2 -1
  98. package/src/test/cropping.test.ts +3 -2
  99. package/src/test/drawing.test.ts +2 -1
  100. package/src/test/flipShapes.test.ts +4 -3
  101. package/src/test/frames.test.ts +25 -24
  102. package/src/test/getCulledShapes.test.tsx +3 -2
  103. package/src/test/groups.test.tsx +1 -1
  104. package/src/test/handleDeepLink.test.tsx +2 -1
  105. package/src/test/maxShapes.test.ts +3 -2
  106. package/src/test/modifiers.test.ts +5 -4
  107. package/src/test/navigation.test.ts +12 -11
  108. package/src/test/panning.test.ts +2 -1
  109. package/src/test/perf/perf.test.ts +2 -1
  110. package/src/test/registerDeepLinkListener.test.tsx +10 -9
  111. package/src/test/resizing.test.ts +39 -38
  112. package/src/test/select.test.tsx +4 -3
  113. package/src/test/selection-omnibus.test.ts +11 -10
  114. package/src/test/shapeutils.test.ts +4 -3
  115. package/src/test/translating.test.ts +9 -8
  116. package/tldraw.css +3 -0
@@ -1,4 +1,5 @@
1
1
  import { createBindingId, createShapeId } from '@tldraw/editor'
2
+ import { vi } from 'vitest'
2
3
  import { getArrowBindings } from '../../lib/shapes/arrow/shared'
3
4
  import { TestEditor } from '../TestEditor'
4
5
 
@@ -12,7 +13,7 @@ const ids = {
12
13
  arrow1: createShapeId('arrow1'),
13
14
  }
14
15
 
15
- jest.useFakeTimers()
16
+ vi.useFakeTimers()
16
17
 
17
18
  beforeEach(() => {
18
19
  editor = new TestEditor()
@@ -1,8 +1,9 @@
1
1
  import { PI, TLShapeId, createShapeId } from '@tldraw/editor'
2
+ import { vi } from 'vitest'
2
3
  import { TestEditor } from '../TestEditor'
3
4
  import { TL } from '../test-jsx'
4
5
 
5
- jest.useFakeTimers()
6
+ vi.useFakeTimers()
6
7
 
7
8
  let editor: TestEditor
8
9
 
@@ -46,10 +47,10 @@ describe('distributeShapes command', () => {
46
47
  describe('when less than three shapes are selected', () => {
47
48
  it('does nothing', () => {
48
49
  editor.setSelectedShapes([ids.boxA, ids.boxB])
49
- const fn = jest.fn()
50
+ const fn = vi.fn()
50
51
  editor.store.listen(fn)
51
52
  editor.distributeShapes(editor.getSelectedShapeIds(), 'horizontal')
52
- jest.advanceTimersByTime(1000)
53
+ vi.advanceTimersByTime(1000)
53
54
  expect(fn).not.toHaveBeenCalled()
54
55
  })
55
56
  })
@@ -58,7 +59,7 @@ describe('distributeShapes command', () => {
58
59
  it('distributeShapes horizontally', () => {
59
60
  editor.selectAll()
60
61
  editor.distributeShapes(editor.getSelectedShapeIds(), 'horizontal')
61
- jest.advanceTimersByTime(1000)
62
+ vi.advanceTimersByTime(1000)
62
63
  editor.expectShapeToMatch(
63
64
  { id: ids.boxA, x: 0 },
64
65
  { id: ids.boxB, x: 200 },
@@ -70,7 +71,7 @@ describe('distributeShapes command', () => {
70
71
  editor.updateShapes([{ id: ids.boxC, type: 'geo', x: 25 }])
71
72
  editor.selectAll()
72
73
  editor.distributeShapes(editor.getSelectedShapeIds(), 'horizontal')
73
- jest.advanceTimersByTime(1000)
74
+ vi.advanceTimersByTime(1000)
74
75
  editor.expectShapeToMatch(
75
76
  { id: ids.boxA, x: 0 },
76
77
  { id: ids.boxB, x: 100 },
@@ -81,7 +82,7 @@ describe('distributeShapes command', () => {
81
82
  it('distributeShapes vertically', () => {
82
83
  editor.selectAll()
83
84
  editor.distributeShapes(editor.getSelectedShapeIds(), 'vertical')
84
- jest.advanceTimersByTime(1000)
85
+ vi.advanceTimersByTime(1000)
85
86
  editor.expectShapeToMatch(
86
87
  { id: ids.boxA, y: 0 },
87
88
  { id: ids.boxB, y: 200 },
@@ -93,7 +94,7 @@ describe('distributeShapes command', () => {
93
94
  editor.updateShapes([{ id: ids.boxC, type: 'geo', y: 25 }])
94
95
  editor.selectAll()
95
96
  editor.distributeShapes(editor.getSelectedShapeIds(), 'vertical')
96
- jest.advanceTimersByTime(1000)
97
+ vi.advanceTimersByTime(1000)
97
98
  editor.expectShapeToMatch(
98
99
  { id: ids.boxA, y: 0 },
99
100
  { id: ids.boxB, y: 100 },
@@ -135,7 +136,7 @@ describe('distributeShapes command', () => {
135
136
  editor.setSelectedShapes([ids.boxB, ids.boxC, ids.boxD])
136
137
 
137
138
  editor.distributeShapes(editor.getSelectedShapeIds(), 'horizontal')
138
- jest.advanceTimersByTime(1000)
139
+ vi.advanceTimersByTime(1000)
139
140
 
140
141
  editor.expectShapeToMatch(
141
142
  { id: ids.boxB, x: 100 },
@@ -177,7 +178,7 @@ describe('distributeShapes command', () => {
177
178
  editor.setSelectedShapes([ids.boxB, ids.boxC, ids.boxD])
178
179
 
179
180
  editor.distributeShapes(editor.getSelectedShapeIds(), 'horizontal')
180
- jest.advanceTimersByTime(1000)
181
+ vi.advanceTimersByTime(1000)
181
182
 
182
183
  editor.expectShapeToMatch(
183
184
  { id: ids.boxB, x: 100 },
@@ -222,7 +223,7 @@ describe('distributeShapes command', () => {
222
223
  editor.setSelectedShapes([ids.boxB, ids.boxC, ids.boxD])
223
224
 
224
225
  editor.distributeShapes(editor.getSelectedShapeIds(), 'horizontal')
225
- jest.advanceTimersByTime(1000)
226
+ vi.advanceTimersByTime(1000)
226
227
 
227
228
  editor.expectShapeToMatch(
228
229
  { id: ids.boxB, x: 100 },
@@ -1,4 +1,5 @@
1
1
  import { DefaultDashStyle, TLGeoShape, createShapeId, toRichText } from '@tldraw/editor'
2
+ import { vi } from 'vitest'
2
3
  import { TestEditor } from '../TestEditor'
3
4
 
4
5
  let editor: TestEditor
@@ -14,7 +15,7 @@ function parseSvg({ svg }: { svg: string } = { svg: '' }) {
14
15
  return parser.parseFromString(svg, 'image/svg+xml').firstElementChild as SVGSVGElement
15
16
  }
16
17
 
17
- jest.useRealTimers()
18
+ vi.useRealTimers()
18
19
 
19
20
  beforeEach(() => {
20
21
  editor = new TestEditor()
@@ -1,4 +1,5 @@
1
1
  import { createShapeId } from '@tldraw/editor'
2
+ import { vi } from 'vitest'
2
3
  import { TestEditor } from '../TestEditor'
3
4
 
4
5
  let editor: TestEditor
@@ -10,7 +11,7 @@ const ids = {
10
11
  boxD: createShapeId('boxD'),
11
12
  }
12
13
 
13
- jest.useFakeTimers()
14
+ vi.useFakeTimers()
14
15
 
15
16
  beforeEach(() => {
16
17
  editor = new TestEditor()
@@ -45,7 +46,7 @@ describe('editor.packShapes', () => {
45
46
  editor.selectAll()
46
47
  const centerBefore = editor.getSelectionRotatedPageBounds()!.center.clone()
47
48
  editor.packShapes(editor.getSelectedShapeIds())
48
- jest.advanceTimersByTime(1000)
49
+ vi.advanceTimersByTime(1000)
49
50
  expect(
50
51
  editor.getCurrentPageShapes().map((s) => ({ ...s, parentId: 'wahtever' }))
51
52
  ).toMatchSnapshot('packed shapes')
@@ -57,7 +58,7 @@ describe('editor.packShapes', () => {
57
58
  editor.selectAll()
58
59
  const centerBefore = editor.getSelectionRotatedPageBounds()!.center.clone()
59
60
  editor.packShapes(editor.getSelectedShapeIds(), 16)
60
- jest.advanceTimersByTime(1000)
61
+ vi.advanceTimersByTime(1000)
61
62
  expect(
62
63
  editor.getCurrentPageShapes().map((s) => ({ ...s, parentId: 'wahtever' }))
63
64
  ).toMatchSnapshot('packed shapes')
@@ -68,7 +69,7 @@ describe('editor.packShapes', () => {
68
69
  it('packs rotated shapes', () => {
69
70
  editor.updateShapes([{ id: ids.boxA, type: 'geo', rotation: Math.PI }])
70
71
  editor.selectAll().packShapes(editor.getSelectedShapeIds(), 16)
71
- jest.advanceTimersByTime(1000)
72
+ vi.advanceTimersByTime(1000)
72
73
  expect(
73
74
  editor.getCurrentPageShapes().map((s) => ({ ...s, parentId: 'wahtever' }))
74
75
  ).toMatchSnapshot('packed shapes')
@@ -1,9 +1,10 @@
1
1
  import { createShapeId } from '@tldraw/editor'
2
+ import { vi } from 'vitest'
2
3
  import { TestEditor } from '../TestEditor'
3
4
 
4
5
  let editor: TestEditor
5
6
 
6
- jest.useFakeTimers()
7
+ vi.useFakeTimers()
7
8
 
8
9
  const ids = {
9
10
  boxA: createShapeId('boxA'),
@@ -1,4 +1,5 @@
1
1
  import { createShapeId } from '@tldraw/editor'
2
+ import { vi } from 'vitest'
2
3
  import { TestEditor } from '../TestEditor'
3
4
 
4
5
  let editor: TestEditor
@@ -40,20 +41,20 @@ beforeEach(() => {
40
41
  })
41
42
 
42
43
  describe('editor.rotateShapesBy', () => {
43
- let fnStart = jest.fn()
44
- let fnChange = jest.fn()
45
- let fnEnd = jest.fn()
44
+ let fnStart = vi.fn()
45
+ let fnChange = vi.fn()
46
+ let fnEnd = vi.fn()
46
47
 
47
48
  beforeEach(() => {
48
49
  // Set start / change / end events on only the geo shape
49
50
  const util = editor.getShapeUtil('geo')
50
51
 
51
52
  // Bad! who did this (did I do this)
52
- util.onRotateStart = fnStart = jest.fn()
53
+ util.onRotateStart = fnStart = vi.fn()
53
54
 
54
- util.onRotate = fnChange = jest.fn()
55
+ util.onRotate = fnChange = vi.fn()
55
56
 
56
- util.onRotateEnd = fnEnd = jest.fn()
57
+ util.onRotateEnd = fnEnd = vi.fn()
57
58
  })
58
59
  it('Rotates shapes and fires events', () => {
59
60
  // Select the shape...
@@ -1,4 +1,5 @@
1
1
  import { Box, DEFAULT_CAMERA_OPTIONS, Vec, createShapeId } from '@tldraw/editor'
2
+ import { vi } from 'vitest'
2
3
  import { TestEditor } from '../TestEditor'
3
4
 
4
5
  let editor: TestEditor
@@ -366,14 +367,14 @@ describe('CameraOptions.zoomSpeed', () => {
366
367
  editor.setCameraOptions({ ...DEFAULT_CAMERA_OPTIONS, zoomSpeed: 2 })
367
368
  expect(editor.getCamera()).toMatchObject({ x: 0, y: 0, z: 1 })
368
369
  editor.setCurrentTool('zoom').click()
369
- jest.advanceTimersByTime(300)
370
+ vi.advanceTimersByTime(300)
370
371
  expect(editor.getCamera()).toMatchObject({ x: 0, y: 0, z: 2 })
371
372
  })
372
373
  it('Does not affect zoom tool zooming (0.5x)', () => {
373
374
  editor.setCameraOptions({ ...DEFAULT_CAMERA_OPTIONS, zoomSpeed: 0.5 })
374
375
  expect(editor.getCamera()).toMatchObject({ x: 0, y: 0, z: 1 })
375
376
  editor.setCurrentTool('zoom').click()
376
- jest.advanceTimersByTime(300)
377
+ vi.advanceTimersByTime(300)
377
378
  expect(editor.getCamera()).toMatchObject({ x: 0, y: 0, z: 2 })
378
379
  })
379
380
  it('Does not affect editor zoom method (2x)', () => {
@@ -1028,7 +1029,7 @@ describe('Allows mixed values for x and y', () => {
1028
1029
 
1029
1030
  test('it animated towards the constrained viewport rather than the given viewport', () => {
1030
1031
  // @ts-expect-error
1031
- const mockAnimateToViewport = (editor._animateToViewport = jest.fn())
1032
+ const mockAnimateToViewport = (editor._animateToViewport = vi.fn())
1032
1033
  editor.setCameraOptions({
1033
1034
  ...DEFAULT_CAMERA_OPTIONS,
1034
1035
  constraints: {
@@ -1,4 +1,5 @@
1
1
  import { IndexKey, PageRecordType, TLPageId, createShapeId } from '@tldraw/editor'
2
+ import { vi } from 'vitest'
2
3
  import { TestEditor } from '../TestEditor'
3
4
 
4
5
  let editor: TestEditor
@@ -76,7 +77,7 @@ describe('setCurrentPage', () => {
76
77
  it('logs an error when trying to navigate to a page that does not exist', () => {
77
78
  const initialPageId = editor.getCurrentPageId()
78
79
  expect(editor.getCurrentPageId()).toBe(initialPageId)
79
- console.error = jest.fn()
80
+ console.error = vi.fn()
80
81
 
81
82
  expect(() => {
82
83
  editor.setCurrentPage('page:does-not-exist' as TLPageId)
@@ -105,7 +106,7 @@ describe('setCurrentPage', () => {
105
106
  })
106
107
 
107
108
  it('applies camera constraints', () => {
108
- const spy = jest.spyOn(editor, 'setCamera')
109
+ const spy = vi.spyOn(editor, 'setCamera')
109
110
 
110
111
  let currentPageId = editor.getCurrentPageId()
111
112
  expect(currentPageId).toMatchInlineSnapshot(`"page:page"`)
@@ -1,7 +1,8 @@
1
1
  import { createShapeId } from '@tldraw/editor'
2
+ import { vi } from 'vitest'
2
3
  import { TestEditor } from '../TestEditor'
3
4
 
4
- jest.useFakeTimers()
5
+ vi.useFakeTimers()
5
6
 
6
7
  let editor: TestEditor
7
8
 
@@ -51,10 +52,10 @@ describe('distributeShapes command', () => {
51
52
  describe('when less than three shapes are selected', () => {
52
53
  it('does nothing', () => {
53
54
  editor.setSelectedShapes([ids.boxA, ids.boxB])
54
- const fn = jest.fn()
55
+ const fn = vi.fn()
55
56
  editor.store.listen(fn)
56
57
  editor.stackShapes(editor.getSelectedShapeIds(), 'horizontal', 0)
57
- jest.advanceTimersByTime(1000)
58
+ vi.advanceTimersByTime(1000)
58
59
  expect(fn).not.toHaveBeenCalled()
59
60
  })
60
61
  })
@@ -65,7 +66,7 @@ describe('distributeShapes command', () => {
65
66
  // @ts-expect-error
66
67
  editor.options.adjacentShapeMargin = 1
67
68
  editor.stackShapes(editor.getSelectedShapeIds(), 'horizontal')
68
- jest.advanceTimersByTime(1000)
69
+ vi.advanceTimersByTime(1000)
69
70
  // 200 distance gap between c and d
70
71
  editor.expectShapeToMatch({
71
72
  id: ids.boxA,
@@ -92,7 +93,7 @@ describe('distributeShapes command', () => {
92
93
  it('stacks the shapes based on a given value', () => {
93
94
  editor.setSelectedShapes([ids.boxA, ids.boxB, ids.boxC, ids.boxD])
94
95
  editor.stackShapes(editor.getSelectedShapeIds(), 'horizontal', 10)
95
- jest.advanceTimersByTime(1000)
96
+ vi.advanceTimersByTime(1000)
96
97
  // 200 distance gap between c and d
97
98
  editor.expectShapeToMatch({
98
99
  id: ids.boxA,
@@ -119,7 +120,7 @@ describe('distributeShapes command', () => {
119
120
  it('stacks the shapes based on the most common gap', () => {
120
121
  editor.setSelectedShapes([ids.boxA, ids.boxB, ids.boxC, ids.boxD])
121
122
  editor.stackShapes(editor.getSelectedShapeIds(), 'horizontal', 0)
122
- jest.advanceTimersByTime(1000)
123
+ vi.advanceTimersByTime(1000)
123
124
  // 200 distance gap between c and d
124
125
  editor.expectShapeToMatch({
125
126
  id: ids.boxA,
@@ -147,7 +148,7 @@ describe('distributeShapes command', () => {
147
148
  editor.updateShapes([{ id: ids.boxD, type: 'geo', x: 540, y: 700 }])
148
149
  editor.setSelectedShapes([ids.boxA, ids.boxB, ids.boxC, ids.boxD])
149
150
  editor.stackShapes(editor.getSelectedShapeIds(), 'horizontal', 0)
150
- jest.advanceTimersByTime(1000)
151
+ vi.advanceTimersByTime(1000)
151
152
  editor.expectShapeToMatch({
152
153
  id: ids.boxA,
153
154
  x: 0,
@@ -175,7 +176,7 @@ describe('distributeShapes command', () => {
175
176
  it('stacks the shapes based on a given value', () => {
176
177
  editor.setSelectedShapes([ids.boxA, ids.boxB, ids.boxC, ids.boxD])
177
178
  editor.stackShapes(editor.getSelectedShapeIds(), 'vertical', 10)
178
- jest.advanceTimersByTime(1000)
179
+ vi.advanceTimersByTime(1000)
179
180
  // 200 distance gap between c and d
180
181
  editor.expectShapeToMatch({
181
182
  id: ids.boxA,
@@ -202,7 +203,7 @@ describe('distributeShapes command', () => {
202
203
  it('stacks the shapes based on the most common gap', () => {
203
204
  editor.setSelectedShapes([ids.boxA, ids.boxB, ids.boxC, ids.boxD])
204
205
  editor.stackShapes(editor.getSelectedShapeIds(), 'vertical', 0)
205
- jest.advanceTimersByTime(1000)
206
+ vi.advanceTimersByTime(1000)
206
207
  // 200 distance gap between c and d
207
208
  editor.expectShapeToMatch({
208
209
  id: ids.boxA,
@@ -230,7 +231,7 @@ describe('distributeShapes command', () => {
230
231
  editor.updateShapes([{ id: ids.boxD, type: 'geo', x: 700, y: 540 }])
231
232
  editor.setSelectedShapes([ids.boxA, ids.boxB, ids.boxC, ids.boxD])
232
233
  editor.stackShapes(editor.getSelectedShapeIds(), 'vertical', 0)
233
- jest.advanceTimersByTime(1000)
234
+ vi.advanceTimersByTime(1000)
234
235
  editor.expectShapeToMatch({
235
236
  id: ids.boxA,
236
237
  x: 0,
@@ -1,11 +1,12 @@
1
1
  import { PI, TLShapeId } from '@tldraw/editor'
2
+ import { vi } from 'vitest'
2
3
  import { TestEditor } from '../TestEditor'
3
4
  import { TL } from '../test-jsx'
4
5
 
5
6
  let editor: TestEditor
6
7
  let ids: Record<string, TLShapeId>
7
8
 
8
- jest.useFakeTimers()
9
+ vi.useFakeTimers()
9
10
 
10
11
  function createVideoShape() {
11
12
  return editor.createShapesFromJsx(<TL.video ref="video1" x={0} y={0} w={160} h={90} />).video1
@@ -26,10 +27,10 @@ beforeEach(() => {
26
27
  describe('when less than two shapes are selected', () => {
27
28
  it('does nothing', () => {
28
29
  editor.setSelectedShapes([ids.boxB])
29
- const fn = jest.fn()
30
+ const fn = vi.fn()
30
31
  editor.store.listen(fn)
31
32
  editor.stretchShapes(editor.getSelectedShapeIds(), 'horizontal')
32
- jest.advanceTimersByTime(1000)
33
+ vi.advanceTimersByTime(1000)
33
34
 
34
35
  expect(fn).not.toHaveBeenCalled()
35
36
  })
@@ -39,7 +40,7 @@ describe('when multiple shapes are selected', () => {
39
40
  it('stretches horizontally', () => {
40
41
  editor.selectAll()
41
42
  editor.stretchShapes(editor.getSelectedShapeIds(), 'horizontal')
42
- jest.advanceTimersByTime(1000)
43
+ vi.advanceTimersByTime(1000)
43
44
  editor.expectShapeToMatch(
44
45
  { id: ids.boxA, x: 0, y: 0, props: { w: 500 } },
45
46
  { id: ids.boxB, x: 0, y: 100, props: { w: 500 } },
@@ -52,7 +53,7 @@ describe('when multiple shapes are selected', () => {
52
53
  editor.selectAll()
53
54
  expect(editor.getSelectedShapes().length).toBe(4)
54
55
  editor.stretchShapes(editor.getSelectedShapeIds(), 'horizontal')
55
- jest.advanceTimersByTime(1000)
56
+ vi.advanceTimersByTime(1000)
56
57
  const newHeight = (500 * 9) / 16
57
58
  editor.expectShapeToMatch(
58
59
  { id: ids.boxA, x: 0, y: 0, props: { w: 500 } },
@@ -65,7 +66,7 @@ describe('when multiple shapes are selected', () => {
65
66
  it('stretches vertically', () => {
66
67
  editor.selectAll()
67
68
  editor.stretchShapes(editor.getSelectedShapeIds(), 'vertical')
68
- jest.advanceTimersByTime(1000)
69
+ vi.advanceTimersByTime(1000)
69
70
  editor.expectShapeToMatch(
70
71
  { id: ids.boxA, x: 0, y: 0, props: { h: 500 } },
71
72
  { id: ids.boxB, x: 100, y: 0, props: { h: 500 } },
@@ -78,7 +79,7 @@ describe('when multiple shapes are selected', () => {
78
79
  editor.selectAll()
79
80
  expect(editor.getSelectedShapes().length).toBe(4)
80
81
  editor.stretchShapes(editor.getSelectedShapeIds(), 'vertical')
81
- jest.advanceTimersByTime(1000)
82
+ vi.advanceTimersByTime(1000)
82
83
  const newWidth = (500 * 16) / 9
83
84
  editor.expectShapeToMatch(
84
85
  { id: ids.boxA, x: 0, y: 0, props: { h: 500 } },
@@ -91,7 +92,7 @@ describe('when multiple shapes are selected', () => {
91
92
  it('does, undoes and redoes command', () => {
92
93
  editor.markHistoryStoppingPoint('stretch')
93
94
  editor.stretchShapes(editor.getSelectedShapeIds(), 'horizontal')
94
- jest.advanceTimersByTime(1000)
95
+ vi.advanceTimersByTime(1000)
95
96
 
96
97
  editor.expectShapeToMatch({ id: ids.boxB, x: 0, props: { w: 500 } })
97
98
  editor.undo()
@@ -106,7 +107,7 @@ describe('When shapes are the child of another shape.', () => {
106
107
  editor.reparentShapes([ids.boxB], ids.boxA)
107
108
  editor.select(ids.boxB, ids.boxC)
108
109
  editor.stretchShapes(editor.getSelectedShapeIds(), 'horizontal')
109
- jest.advanceTimersByTime(1000)
110
+ vi.advanceTimersByTime(1000)
110
111
  editor.expectShapeToMatch(
111
112
  { id: ids.boxB, x: 100, y: 100, props: { w: 400 } },
112
113
  { id: ids.boxC, x: 100, y: 400, props: { w: 400 } }
@@ -117,7 +118,7 @@ describe('When shapes are the child of another shape.', () => {
117
118
  editor.reparentShapes([ids.boxB], ids.boxA)
118
119
  editor.select(ids.boxB, ids.boxC)
119
120
  editor.stretchShapes(editor.getSelectedShapeIds(), 'vertical')
120
- jest.advanceTimersByTime(1000)
121
+ vi.advanceTimersByTime(1000)
121
122
  editor.expectShapeToMatch(
122
123
  { id: ids.boxB, x: 100, y: 100, props: { h: 400 } },
123
124
  { id: ids.boxC, x: 400, y: 100, props: { h: 400 } }
@@ -140,7 +141,7 @@ describe('When shapes are the child of a rotated shape.', () => {
140
141
 
141
142
  editor.select(ids.boxA, ids.boxC)
142
143
  editor.stretchShapes(editor.getSelectedShapeIds(), 'horizontal')
143
- jest.advanceTimersByTime(1000)
144
+ vi.advanceTimersByTime(1000)
144
145
  editor.expectShapeToMatch(
145
146
  {
146
147
  id: ids.boxA,
@@ -184,7 +185,7 @@ describe('When shapes are the child of a rotated shape.', () => {
184
185
  editor.selectAll()
185
186
 
186
187
  editor.stretchShapes(editor.getSelectedShapeIds(), 'vertical')
187
- jest.advanceTimersByTime(1000)
188
+ vi.advanceTimersByTime(1000)
188
189
  editor.expectShapeToMatch(
189
190
  {
190
191
  id: ids.boxA,
@@ -1,7 +1,8 @@
1
1
  import { PageRecordType, createShapeId } from '@tldraw/editor'
2
+ import { vi } from 'vitest'
2
3
  import { TestEditor } from './TestEditor'
3
4
 
4
- jest.useFakeTimers()
5
+ vi.useFakeTimers()
5
6
 
6
7
  let editor: TestEditor
7
8
 
@@ -1,8 +1,9 @@
1
1
  import { createShapeId, TLImageShape } from '@tldraw/editor'
2
+ import { vi } from 'vitest'
2
3
  import { MIN_CROP_SIZE } from '../lib/shapes/shared/crop'
3
4
  import { TestEditor } from './TestEditor'
4
5
 
5
- jest.useFakeTimers()
6
+ vi.useFakeTimers()
6
7
 
7
8
  let editor: TestEditor
8
9
 
@@ -495,7 +496,7 @@ describe('When in the select.crop.translating_crop state', () => {
495
496
  })
496
497
 
497
498
  editor.keyUp('Shift')
498
- jest.advanceTimersByTime(500)
499
+ vi.advanceTimersByTime(500)
499
500
 
500
501
  const afterShiftUp = editor.getShape<TLImageShape>(ids.imageB)!.props.crop!
501
502
 
@@ -1,8 +1,9 @@
1
1
  import { TLDrawShape, TLHighlightShape, last } from '@tldraw/editor'
2
+ import { vi } from 'vitest'
2
3
  import { TestEditor } from './TestEditor'
3
4
  import { TEST_DRAW_SHAPE_SCREEN_POINTS } from './drawing.data'
4
5
 
5
- jest.useFakeTimers()
6
+ vi.useFakeTimers()
6
7
 
7
8
  let editor: TestEditor
8
9
 
@@ -10,12 +10,13 @@ import {
10
10
  createBindingId,
11
11
  createShapeId,
12
12
  } from '@tldraw/editor'
13
+ import { vi } from 'vitest'
13
14
  import { getArrowBindings } from '../lib/shapes/arrow/shared'
14
15
  import { TestEditor } from './TestEditor'
15
16
 
16
17
  let editor: TestEditor
17
18
 
18
- jest.useFakeTimers()
19
+ vi.useFakeTimers()
19
20
 
20
21
  const ids = {
21
22
  boxA: createShapeId('boxA'),
@@ -297,7 +298,7 @@ describe('When one shape is selected', () => {
297
298
  })
298
299
 
299
300
  it('Flips the direct child shape positions if the shape is a group', async () => {
300
- const fn = jest.fn()
301
+ const fn = vi.fn()
301
302
 
302
303
  editor.selectAll()
303
304
  editor.groupShapes(editor.getSelectedShapeIds()) // this will also select the new group
@@ -306,7 +307,7 @@ describe('When one shape is selected', () => {
306
307
  editor.flipShapes(editor.getSelectedShapeIds(), 'horizontal')
307
308
 
308
309
  // The change event should have been called
309
- jest.runOnlyPendingTimers()
310
+ vi.runOnlyPendingTimers()
310
311
  expect(fn).toHaveBeenCalled()
311
312
 
312
313
  editor.expectShapeToMatch(