@tldraw/editor 3.15.0-canary.21bb6b44433a → 3.15.0-canary.24182c470c85

package/src/lib/editor/Editor.test.ts

@@ -425,3 +425,410 @@ describe('getShapesAtPoint', () => {
 		expect(hollowShapesWithHitInside[0].id).toBe(ids.hollowShape)
 	})
 })
+
+describe('selectAll', () => {
+	const selectAllIds = {
+		pageShape1: createShapeId('pageShape1'),
+		pageShape2: createShapeId('pageShape2'),
+		pageShape3: createShapeId('pageShape3'),
+		container1: createShapeId('container1'),
+		containerChild1: createShapeId('containerChild1'),
+		containerChild2: createShapeId('containerChild2'),
+		containerChild3: createShapeId('containerChild3'),
+		containerGrandchild1: createShapeId('containerGrandchild1'),
+		container2: createShapeId('container2'),
+		container2Child1: createShapeId('container2Child1'),
+		container2Child2: createShapeId('container2Child2'),
+		container2Grandchild1: createShapeId('container2Grandchild1'),
+		lockedShape: createShapeId('lockedShape'),
+	}
+
+	beforeEach(() => {
+		// Clear any existing shapes
+		editor.selectAll().deleteShapes(editor.getSelectedShapeIds())
+
+		// Create shapes directly on the page (no parentId means they're children of the page)
+		editor.createShapes([
+			{
+				id: selectAllIds.pageShape1,
+				type: 'my-custom-shape',
+				x: 100,
+				y: 100,
+				props: { w: 100, h: 100 },
+			},
+			{
+				id: selectAllIds.pageShape2,
+				type: 'my-custom-shape',
+				x: 300,
+				y: 100,
+				props: { w: 100, h: 100 },
+			},
+			{
+				id: selectAllIds.pageShape3,
+				type: 'my-custom-shape',
+				x: 500,
+				y: 100,
+				props: { w: 100, h: 100 },
+			},
+			{
+				id: selectAllIds.lockedShape,
+				type: 'my-custom-shape',
+				x: 700,
+				y: 100,
+				props: { w: 100, h: 100 },
+				isLocked: true,
+			},
+		])
+
+		// Create a container shape (simulating a frame or group)
+		editor.createShape({
+			id: selectAllIds.container1,
+			type: 'my-custom-shape',
+			x: 100,
+			y: 300,
+			props: { w: 400, h: 200 },
+		})
+
+		// Create children inside the container (parentId set to container1)
+		editor.createShapes([
+			{
+				id: selectAllIds.containerChild1,
+				type: 'my-custom-shape',
+				parentId: selectAllIds.container1,
+				x: 120,
+				y: 320,
+				props: { w: 50, h: 50 },
+			},
+			{
+				id: selectAllIds.containerChild2,
+				type: 'my-custom-shape',
+				parentId: selectAllIds.container1,
+				x: 200,
+				y: 320,
+				props: { w: 50, h: 50 },
+			},
+			{
+				id: selectAllIds.containerChild3,
+				type: 'my-custom-shape',
+				parentId: selectAllIds.container1,
+				x: 280,
+				y: 320,
+				props: { w: 50, h: 50 },
+			},
+		])
+
+		// Create a grandchild inside one of the container children
+		editor.createShape({
+			id: selectAllIds.containerGrandchild1,
+			type: 'my-custom-shape',
+			parentId: selectAllIds.containerChild3,
+			x: 290,
+			y: 330,
+			props: { w: 30, h: 30 },
+		})
+
+		// Create a second container (simulating a group)
+		editor.createShape({
+			id: selectAllIds.container2,
+			type: 'my-custom-shape',
+			x: 600,
+			y: 300,
+			props: { w: 200, h: 200 },
+		})
+
+		// Create children inside the second container
+		editor.createShapes([
+			{
+				id: selectAllIds.container2Child1,
+				type: 'my-custom-shape',
+				parentId: selectAllIds.container2,
+				x: 620,
+				y: 320,
+				props: { w: 50, h: 50 },
+			},
+			{
+				id: selectAllIds.container2Child2,
+				type: 'my-custom-shape',
+				parentId: selectAllIds.container2,
+				x: 680,
+				y: 320,
+				props: { w: 50, h: 50 },
+			},
+		])
+
+		// Create a grandchild in the second container
+		editor.createShape({
+			id: selectAllIds.container2Grandchild1,
+			type: 'my-custom-shape',
+			parentId: selectAllIds.container2Child1,
+			x: 630,
+			y: 330,
+			props: { w: 30, h: 30 },
+		})
+
+		// Clear selection
+		editor.selectNone()
+	})
+
+	it('when no shapes are selected, selects all page-level shapes (excluding locked ones)', () => {
+		// Initially no shapes selected
+		expect(editor.getSelectedShapeIds()).toEqual([])
+
+		// Call selectAll
+		editor.selectAll()
+
+		// Should select all page-level shapes (excluding locked ones)
+		const selectedIds = editor.getSelectedShapeIds()
+		expect(Array.from(selectedIds).sort()).toEqual(
+			[
+				selectAllIds.pageShape1,
+				selectAllIds.pageShape2,
+				selectAllIds.pageShape3,
+				selectAllIds.container1,
+				selectAllIds.container2,
+			].sort()
+		)
+
+		// Should NOT include locked shape or children/grandchildren
+		expect(selectedIds).not.toContain(selectAllIds.lockedShape)
+		expect(selectedIds).not.toContain(selectAllIds.containerChild1)
+		expect(selectedIds).not.toContain(selectAllIds.containerChild2)
+		expect(selectedIds).not.toContain(selectAllIds.containerChild3)
+		expect(selectedIds).not.toContain(selectAllIds.containerGrandchild1)
+		expect(selectedIds).not.toContain(selectAllIds.container2Child1)
+		expect(selectedIds).not.toContain(selectAllIds.container2Child2)
+		expect(selectedIds).not.toContain(selectAllIds.container2Grandchild1)
+	})
+
+	it('when shapes are selected only on the page, all children of the page should be selected (but not their descendants)', () => {
+		// Select some page-level shapes
+		editor.select(selectAllIds.pageShape1, selectAllIds.pageShape2)
+
+		// Call selectAll
+		editor.selectAll()
+
+		// Should select all page-level shapes (excluding locked ones), but not descendants
+		const selectedIds = editor.getSelectedShapeIds()
+		expect(Array.from(selectedIds).sort()).toEqual(
+			[
+				selectAllIds.pageShape1,
+				selectAllIds.pageShape2,
+				selectAllIds.pageShape3,
+				selectAllIds.container1,
+				selectAllIds.container2,
+			].sort()
+		)
+
+		// Should NOT include children or grandchildren or locked shapes
+		expect(selectedIds).not.toContain(selectAllIds.containerChild1)
+		expect(selectedIds).not.toContain(selectAllIds.containerChild2)
+		expect(selectedIds).not.toContain(selectAllIds.containerChild3)
+		expect(selectedIds).not.toContain(selectAllIds.containerGrandchild1)
+		expect(selectedIds).not.toContain(selectAllIds.container2Child1)
+		expect(selectedIds).not.toContain(selectAllIds.container2Child2)
+		expect(selectedIds).not.toContain(selectAllIds.container2Grandchild1)
+		expect(selectedIds).not.toContain(selectAllIds.lockedShape)
+	})
+
+	it('when shapes are selected within a container, only children of the container should be selected (not their descendants)', () => {
+		// Select some container children
+		editor.select(selectAllIds.containerChild1, selectAllIds.containerChild2)
+
+		// Call selectAll
+		editor.selectAll()
+
+		// Should select all container children (but not their descendants)
+		const selectedIds = editor.getSelectedShapeIds()
+		expect(Array.from(selectedIds).sort()).toEqual(
+			[
+				selectAllIds.containerChild1,
+				selectAllIds.containerChild2,
+				selectAllIds.containerChild3,
+			].sort()
+		)
+
+		// Should NOT include page-level shapes or grandchildren
+		expect(selectedIds).not.toContain(selectAllIds.pageShape1)
+		expect(selectedIds).not.toContain(selectAllIds.pageShape2)
+		expect(selectedIds).not.toContain(selectAllIds.pageShape3)
+		expect(selectedIds).not.toContain(selectAllIds.container1)
+		expect(selectedIds).not.toContain(selectAllIds.container2)
+		expect(selectedIds).not.toContain(selectAllIds.containerGrandchild1)
+		expect(selectedIds).not.toContain(selectAllIds.container2Child1)
+		expect(selectedIds).not.toContain(selectAllIds.container2Child2)
+		expect(selectedIds).not.toContain(selectAllIds.container2Grandchild1)
+	})
+
+	it('when shapes are selected within a second container, only children of that container should be selected', () => {
+		// Select some second container children
+		editor.select(selectAllIds.container2Child1)
+
+		// Call selectAll
+		editor.selectAll()
+
+		// Should select all second container children (but not their descendants)
+		const selectedIds = editor.getSelectedShapeIds()
+		expect(Array.from(selectedIds).sort()).toEqual(
+			[selectAllIds.container2Child1, selectAllIds.container2Child2].sort()
+		)
+
+		// Should NOT include page-level shapes or other container's children or grandchildren
+		expect(selectedIds).not.toContain(selectAllIds.pageShape1)
+		expect(selectedIds).not.toContain(selectAllIds.pageShape2)
+		expect(selectedIds).not.toContain(selectAllIds.pageShape3)
+		expect(selectedIds).not.toContain(selectAllIds.container1)
+		expect(selectedIds).not.toContain(selectAllIds.container2)
+		expect(selectedIds).not.toContain(selectAllIds.containerChild1)
+		expect(selectedIds).not.toContain(selectAllIds.containerChild2)
+		expect(selectedIds).not.toContain(selectAllIds.containerChild3)
+		expect(selectedIds).not.toContain(selectAllIds.containerGrandchild1)
+		expect(selectedIds).not.toContain(selectAllIds.container2Grandchild1)
+	})
+
+	it('when shapes are selected that belong to different parents, no change/history entry should be made', () => {
+		// Select shapes from different parents (page and container)
+		editor.select(selectAllIds.pageShape1, selectAllIds.containerChild1)
+
+		const initialSelectedIds = editor.getSelectedShapeIds()
+
+		// Spy on setSelectedShapes to verify it's not called
+		const setSelectedShapesSpy = jest.spyOn(editor, 'setSelectedShapes')
+
+		// Call selectAll
+		editor.selectAll()
+
+		// Selection should remain unchanged
+		expect(editor.getSelectedShapeIds()).toEqual(initialSelectedIds)
+
+		// setSelectedShapes should not have been called (the method returns early)
+		expect(setSelectedShapesSpy).not.toHaveBeenCalled()
+
+		setSelectedShapesSpy.mockRestore()
+	})
+
+	it('when shapes are selected that belong to different containers, no change/history entry should be made', () => {
+		// Select shapes from different containers
+		editor.select(selectAllIds.containerChild1, selectAllIds.container2Child1)
+
+		const initialSelectedIds = editor.getSelectedShapeIds()
+
+		// Spy on setSelectedShapes to verify it's not called
+		const setSelectedShapesSpy = jest.spyOn(editor, 'setSelectedShapes')
+
+		// Call selectAll
+		editor.selectAll()
+
+		// Selection should remain unchanged
+		expect(editor.getSelectedShapeIds()).toEqual(initialSelectedIds)
+
+		// setSelectedShapes should not have been called
+		expect(setSelectedShapesSpy).not.toHaveBeenCalled()
+
+		setSelectedShapesSpy.mockRestore()
+	})
+
+	it('should not select locked shapes', () => {
+		// Select a page-level shape
+		editor.select(selectAllIds.pageShape1)
+
+		// Call selectAll
+		editor.selectAll()
+
+		// Should select all page-level shapes except locked ones
+		const selectedIds = editor.getSelectedShapeIds()
+		expect(selectedIds).not.toContain(selectAllIds.lockedShape)
+		expect(selectedIds).toContain(selectAllIds.pageShape1)
+		expect(selectedIds).toContain(selectAllIds.pageShape2)
+		expect(selectedIds).toContain(selectAllIds.pageShape3)
+		expect(selectedIds).toContain(selectAllIds.container1)
+		expect(selectedIds).toContain(selectAllIds.container2)
+	})
+
+	it('should handle empty container by selecting all siblings at the same level', () => {
+		// Create an empty container
+		const emptyContainerId = createShapeId('emptyContainer')
+		editor.createShape({
+			id: emptyContainerId,
+			type: 'my-custom-shape',
+			x: 800,
+			y: 400,
+			props: { w: 100, h: 100 },
+		})
+
+		// Clear selection first
+		editor.selectNone()
+
+		// Select the empty container
+		editor.select(emptyContainerId)
+
+		// Call selectAll - since the empty container has no children, it should select all siblings (page-level shapes)
+		editor.selectAll()
+
+		// Should select all page-level shapes (including the empty container itself)
+		const selectedIds = editor.getSelectedShapeIds()
+		expect(Array.from(selectedIds).sort()).toEqual(
+			[
+				selectAllIds.pageShape1,
+				selectAllIds.pageShape2,
+				selectAllIds.pageShape3,
+				selectAllIds.container1,
+				selectAllIds.container2,
+				emptyContainerId,
+			].sort()
+		)
+
+		// Should NOT include locked shapes or children/grandchildren
+		expect(selectedIds).not.toContain(selectAllIds.lockedShape)
+		expect(selectedIds).not.toContain(selectAllIds.containerChild1)
+		expect(selectedIds).not.toContain(selectAllIds.containerChild2)
+		expect(selectedIds).not.toContain(selectAllIds.containerChild3)
+		expect(selectedIds).not.toContain(selectAllIds.containerGrandchild1)
+		expect(selectedIds).not.toContain(selectAllIds.container2Child1)
+		expect(selectedIds).not.toContain(selectAllIds.container2Child2)
+		expect(selectedIds).not.toContain(selectAllIds.container2Grandchild1)
+	})
+
+	it('should work correctly when selecting all shapes of same parent type', () => {
+		// Select all container children
+		editor.select(
+			selectAllIds.containerChild1,
+			selectAllIds.containerChild2,
+			selectAllIds.containerChild3
+		)
+
+		// Call selectAll - should maintain the same selection since all children are already selected
+		editor.selectAll()
+
+		// Should still have all container children selected
+		const selectedIds = editor.getSelectedShapeIds()
+		expect(Array.from(selectedIds).sort()).toEqual(
+			[
+				selectAllIds.containerChild1,
+				selectAllIds.containerChild2,
+				selectAllIds.containerChild3,
+			].sort()
+		)
+	})
+
+	it('should handle mixed selection levels gracefully by doing nothing', () => {
+		// Select a mix: page shape (parent=page), container (parent=page), and container child (parent=container1)
+		// These all have different parent IDs so selectAll should do nothing
+		editor.select(selectAllIds.pageShape1, selectAllIds.containerChild1)
+
+		const initialSelectedIds = Array.from(editor.getSelectedShapeIds())
+
+		// Spy on setSelectedShapes to verify it's not called
+		const setSelectedShapesSpy = jest.spyOn(editor, 'setSelectedShapes')
+
+		// Call selectAll
+		editor.selectAll()
+
+		// Selection should remain unchanged since shapes have different parents
+		expect(Array.from(editor.getSelectedShapeIds())).toEqual(initialSelectedIds)
+
+		// setSelectedShapes should not have been called
+		expect(setSelectedShapesSpy).not.toHaveBeenCalled()
+
+		setSelectedShapesSpy.mockRestore()
+	})
+})

package/src/lib/editor/Editor.ts

@@ -178,6 +178,7 @@ import {
 	TLCameraOptions,
 	TLImageExportOptions,
 	TLSvgExportOptions,
+	TLUpdatePointerOptions,
 } from './types/misc-types'
 import { TLAdjacentDirection, TLResizeHandle } from './types/selection-types'
 
@@ -1803,7 +1804,9 @@ export class Editor extends EventEmitter<TLEventMap> {
 	}
 
 	/**
-	 * Select all direct children of the current page.
+	 * Select all shapes. If the user has selected shapes that share a parent,
+	 * select all shapes within that parent. If the user has not selected any shapes,
+	 * or if the shapes shapes are only on select all shapes on the current page.
 	 *
 	 * @example
 	 * ```ts
@@ -1813,11 +1816,34 @@ export class Editor extends EventEmitter<TLEventMap> {
 	 * @public
 	 */
 	selectAll(): this {
-		const ids = this.getSortedChildIdsForParent(this.getCurrentPageId())
-		// page might have no shapes
+		let parentToSelectWithinId: TLParentId | null = null
+
+		const selectedShapeIds = this.getSelectedShapeIds()
+
+		// If we have selected shapes, try to find a parent to select within
+		if (selectedShapeIds.length > 0) {
+			for (const id of selectedShapeIds) {
+				const shape = this.getShape(id)
+				if (!shape) continue
+				if (parentToSelectWithinId === null) {
+					// If we haven't found a parent yet, set this parent as the parent to select within
+					parentToSelectWithinId = shape.parentId
+				} else if (parentToSelectWithinId !== shape.parentId) {
+					// If we've found two different parents, we can't select all, do nothing
+					return this
+				}
+			}
+		}
+
+		// If we haven't found a parent from our selected shapes, select the current page
+		if (!parentToSelectWithinId) {
+			parentToSelectWithinId = this.getCurrentPageId()
+		}
+
+		// Select all the unlocked shapes within the parent
+		const ids = this.getSortedChildIdsForParent(parentToSelectWithinId)
 		if (ids.length <= 0) return this
 		this.setSelectedShapes(this._getUnlockedShapeIds(ids))
-
 		return this
 	}
 
@@ -1838,10 +1864,11 @@ export class Editor extends EventEmitter<TLEventMap> {
 			firstParentId &&
 			selectedShapeIds.every((shapeId) => this.getShape(shapeId)?.parentId === firstParentId) &&
 			!isPageId(firstParentId)
+		const filteredShapes = isSelectedWithinContainer
+			? this.getCurrentPageShapes().filter((shape) => shape.parentId === firstParentId)
+			: this.getCurrentPageShapes().filter((shape) => isPageId(shape.parentId))
 		const readingOrderShapes = isSelectedWithinContainer
-			? this._getShapesInReadingOrder(
-					this.getCurrentPageShapes().filter((shape) => shape.parentId === firstParentId)
-				)
+			? this._getShapesInReadingOrder(filteredShapes)
 			: this.getCurrentPageShapesInReadingOrder()
 		const currentShapeId: TLShapeId | undefined =
 			selectedShapeIds.length === 1
@@ -1858,7 +1885,7 @@ export class Editor extends EventEmitter<TLEventMap> {
 			adjacentShapeId = shapeIds[adjacentIndex]
 		} else {
 			if (!currentShapeId) return
-			adjacentShapeId = this.getNearestAdjacentShape(currentShapeId, direction)
+			adjacentShapeId = this.getNearestAdjacentShape(filteredShapes, currentShapeId, direction)
 		}
 
 		const shape = this.getShape(adjacentShapeId)
@@ -1957,6 +1984,7 @@ export class Editor extends EventEmitter<TLEventMap> {
 	 * @public
 	 */
 	getNearestAdjacentShape(
+		shapes: TLShape[],
 		currentShapeId: TLShapeId,
 		direction: 'left' | 'right' | 'up' | 'down'
 	): TLShapeId {
@@ -1964,7 +1992,6 @@ export class Editor extends EventEmitter<TLEventMap> {
 		const currentShape = this.getShape(currentShapeId)
 		if (!currentShape) return currentShapeId
 
-		const shapes = this.getCurrentPageShapes()
 		const tabbableShapes = shapes.filter(
 			(shape) => this.getShapeUtil(shape).canTabTo(shape) && shape.id !== currentShapeId
 		)
@@ -3046,7 +3073,6 @@ export class Editor extends EventEmitter<TLEventMap> {
 			// Dispatch a new pointer move because the pointer's page will have changed
 			// (its screen position will compute to a new page position given the new camera position)
 			const { currentScreenPoint, currentPagePoint } = this.inputs
-			const { screenBounds } = this.store.unsafeGetWithoutCapture(TLINSTANCE_ID)!
 
 			// compare the next page point (derived from the current camera) to the current page point
 			if (
@@ -3054,27 +3080,10 @@ export class Editor extends EventEmitter<TLEventMap> {
 				currentScreenPoint.y / z - y !== currentPagePoint.y
 			) {
 				// If it's changed, dispatch a pointer event
-				const event: TLPointerEventInfo = {
-					type: 'pointer',
-					target: 'canvas',
-					name: 'pointer_move',
-					// weird but true: we need to put the screen point back into client space
-					point: Vec.AddXY(currentScreenPoint, screenBounds.x, screenBounds.y),
+				this.updatePointer({
+					immediate: opts?.immediate,
 					pointerId: INTERNAL_POINTER_IDS.CAMERA_MOVE,
-					ctrlKey: this.inputs.ctrlKey,
-					altKey: this.inputs.altKey,
-					shiftKey: this.inputs.shiftKey,
-					metaKey: this.inputs.metaKey,
-					accelKey: isAccelKey(this.inputs),
-					button: 0,
-					isPen: this.getInstanceState().isPenMode ?? false,
-				}
-
-				if (opts?.immediate) {
-					this._flushEventForTick(event)
-				} else {
-					this.dispatch(event)
-				}
+				})
 			}
 
 			this._tickCameraState()
@@ -4395,21 +4404,28 @@ export class Editor extends EventEmitter<TLEventMap> {
 	 */
 	deletePage(page: TLPageId | TLPage): this {
 		const id = typeof page === 'string' ? page : page.id
-		this.run(() => {
-			if (this.getIsReadonly()) return
-			const pages = this.getPages()
-			if (pages.length === 1) return
+		this.run(
+			() => {
+				if (this.getIsReadonly()) return
+				const pages = this.getPages()
+				if (pages.length === 1) return
 
-			const deletedPage = this.getPage(id)
-			if (!deletedPage) return
+				const deletedPage = this.getPage(id)
+				if (!deletedPage) return
 
-			if (id === this.getCurrentPageId()) {
-				const index = pages.findIndex((page) => page.id === id)
-				const next = pages[index - 1] ?? pages[index + 1]
-				this.setCurrentPage(next.id)
-			}
-			this.store.remove([deletedPage.id])
-		})
+				if (id === this.getCurrentPageId()) {
+					const index = pages.findIndex((page) => page.id === id)
+					const next = pages[index - 1] ?? pages[index + 1]
+					this.setCurrentPage(next.id)
+				}
+
+				const shapes = this.getSortedChildIdsForParent(deletedPage.id)
+				this.deleteShapes(shapes)
+
+				this.store.remove([deletedPage.id])
+			},
+			{ ignoreShapeLock: true }
+		)
 		return this
 	}
 
@@ -5196,8 +5212,8 @@ export class Editor extends EventEmitter<TLEventMap> {
 			// Check labels first
 			if (
 				this.isShapeOfType<TLFrameShape>(shape, 'frame') ||
-				(this.isShapeOfType<TLArrowShape>(shape, 'arrow') && shape.props.text.trim()) ||
 				((this.isShapeOfType<TLNoteShape>(shape, 'note') ||
+					this.isShapeOfType<TLArrowShape>(shape, 'arrow') ||
 					(this.isShapeOfType<TLGeoShape>(shape, 'geo') && shape.props.fill === 'none')) &&
 					this.getShapeUtil(shape).getText(shape)?.trim())
 			) {
@@ -9647,6 +9663,52 @@ export class Editor extends EventEmitter<TLEventMap> {
 		return this
 	}
 
+	/**
+	 * Dispatch a pointer move event in the current position of the pointer. This is useful when
+	 * external circumstances have changed (e.g. the camera moved or a shape was moved) and you want
+	 * the current interaction to respond to that change.
+	 *
+	 * @example
+	 * ```ts
+	 * editor.updatePointer()
+	 * ```
+	 *
+	 * @param options - The options for updating the pointer.
+	 * @returns The editor instance.
+	 * @public
+	 */
+	updatePointer(options?: TLUpdatePointerOptions): this {
+		const event: TLPointerEventInfo = {
+			type: 'pointer',
+			target: 'canvas',
+			name: 'pointer_move',
+			point:
+				options?.point ??
+				// weird but true: what `inputs` calls screen-space is actually viewport space. so
+				// we need to convert back into true screen space first. we should fix this...
+				Vec.Add(
+					this.inputs.currentScreenPoint,
+					this.store.unsafeGetWithoutCapture(TLINSTANCE_ID)!.screenBounds
+				),
+			pointerId: options?.pointerId ?? 0,
+			button: options?.button ?? 0,
+			isPen: options?.isPen ?? this.inputs.isPen,
+			shiftKey: options?.shiftKey ?? this.inputs.shiftKey,
+			altKey: options?.altKey ?? this.inputs.altKey,
+			ctrlKey: options?.ctrlKey ?? this.inputs.ctrlKey,
+			metaKey: options?.metaKey ?? this.inputs.metaKey,
+			accelKey: options?.accelKey ?? isAccelKey(this.inputs),
+		}
+
+		if (options?.immediate) {
+			this._flushEventForTick(event)
+		} else {
+			this.dispatch(event)
+		}
+
+		return this
+	}
+
 	/**
 	 * Puts the editor into focused mode.
 	 *