tldraw 3.15.0-canary.cc3205a8ac6d → 3.15.0-canary.d251cd98b4e1

package/src/lib/ui/context/events.tsx

@@ -107,6 +107,7 @@ export interface TLUiEventMap {
 	'toggle-paste-at-cursor': null
 	'toggle-lock': null
 	'toggle-reduce-motion': null
+	'toggle-keyboard-shortcuts': null
 	'toggle-edge-scrolling': null
 	'color-scheme': { value: string }
 	'exit-pen-mode': null
@@ -127,6 +128,7 @@ export interface TLUiEventMap {
 	'copy-link': null
 	'image-replace': null
 	'video-replace': null
+	'open-kbd-shortcuts': null
 	'rich-text': {
 		operation:
 			| 'bold'

package/src/lib/ui/hooks/useKeyboardShortcuts.ts

@@ -61,7 +61,7 @@ export function useKeyboardShortcuts() {
 			if (SKIP_KBDS.includes(action.id)) continue
 
 			hot(getHotkeysStringFromKbd(action.kbd), (event) => {
-				if (areShortcutsDisabled(editor)) return
+				if (areShortcutsDisabled(editor) && !action.isRequiredA11yAction) return
 				preventDefault(event)
 				action.onSelect('kbd')
 			})
@@ -149,7 +149,8 @@ export function areShortcutsDisabled(editor: Editor) {
 	return (
 		editor.menus.hasAnyOpenMenus() ||
 		editor.getEditingShapeId() !== null ||
-		editor.getCrashingError()
+		editor.getCrashingError() ||
+		!editor.user.getAreKeyboardShortcutsEnabled()
 	)
 }
 

package/src/lib/ui/hooks/useTranslation/TLUiTranslationKey.ts

@@ -55,6 +55,7 @@ export type TLUiTranslationKey =
 	| 'action.new-project'
 	| 'action.new-shared-project'
 	| 'action.open-cursor-chat'
+	| 'action.open-kbd-shortcuts'
 	| 'action.open-file'
 	| 'action.pack'
 	| 'action.paste'
@@ -90,6 +91,8 @@ export type TLUiTranslationKey =
 	| 'action.toggle-wrap-mode'
 	| 'action.toggle-reduce-motion.menu'
 	| 'action.toggle-reduce-motion'
+	| 'action.toggle-keyboard-shortcuts.menu'
+	| 'action.toggle-keyboard-shortcuts'
 	| 'action.toggle-edge-scrolling.menu'
 	| 'action.toggle-edge-scrolling'
 	| 'action.toggle-debug-mode.menu'
@@ -288,6 +291,7 @@ export type TLUiTranslationKey =
 	| 'a11y.pan-camera'
 	| 'a11y.adjust-shape-styles'
 	| 'a11y.open-context-menu'
+	| 'a11y.open-keyboard-shortcuts'
 	| 'menu.title'
 	| 'menu.theme'
 	| 'menu.copy-as'

package/src/lib/ui/hooks/useTranslation/defaultTranslation.ts

@@ -55,6 +55,7 @@ export const DEFAULT_TRANSLATION = {
 	'action.new-project': 'New project',
 	'action.new-shared-project': 'New shared project',
 	'action.open-cursor-chat': 'Cursor chat',
+	'action.open-kbd-shortcuts': 'Open keyboard shortcuts',
 	'action.open-file': 'Open file',
 	'action.pack': 'Pack',
 	'action.paste': 'Paste',
@@ -91,6 +92,8 @@ export const DEFAULT_TRANSLATION = {
 	'action.toggle-wrap-mode': 'Toggle Select on wrap',
 	'action.toggle-reduce-motion.menu': 'Reduce motion',
 	'action.toggle-reduce-motion': 'Toggle reduce motion',
+	'action.toggle-keyboard-shortcuts.menu': 'Keyboard shortcuts',
+	'action.toggle-keyboard-shortcuts': 'Toggle keyboard shortcuts',
 	'action.toggle-edge-scrolling.menu': 'Edge scrolling',
 	'action.toggle-edge-scrolling': 'Toggle edge scrolling',
 	'action.toggle-debug-mode.menu': 'Debug mode',
@@ -289,6 +292,7 @@ export const DEFAULT_TRANSLATION = {
 	'a11y.pan-camera': 'Pan camera',
 	'a11y.adjust-shape-styles': 'Adjust shape styles',
 	'a11y.open-context-menu': 'Open context menu',
+	'a11y.open-keyboard-shortcuts': 'Open keyboard shortcuts',
 	'menu.title': 'Menu',
 	'menu.theme': 'Theme',
 	'menu.copy-as': 'Copy as',

package/src/lib/ui/version.ts

@@ -1,9 +1,9 @@
 // This file is automatically generated by internal/scripts/refresh-assets.ts.
 // Do not edit manually. Or do, I'm a comment, not a cop.
 
-export const version = '3.15.0-canary.cc3205a8ac6d'
+export const version = '3.15.0-canary.d251cd98b4e1'
 export const publishDates = {
 	major: '2024-09-13T14:36:29.063Z',
-	minor: '2025-07-03T10:53:28.807Z',
-	patch: '2025-07-03T10:53:28.807Z',
+	minor: '2025-07-09T14:00:46.148Z',
+	patch: '2025-07-09T14:00:46.148Z',
 }

package/src/test/Editor.test.tsx

@@ -49,7 +49,7 @@ beforeEach(() => {
 })
 
 const moveShapesToPage2 = () => {
-	// directly maniuplate parentId like would happen in multiplayer situations
+	// directly manipulate parentId like would happen in multiplayer situations
 
 	editor.updateShapes([
 		{ id: ids.box1, type: 'geo', parentId: ids.page2 },
@@ -899,3 +899,70 @@ describe('the geometry cache', () => {
 		expect(editor.getShapePageBounds(A)!.width).toBe(200)
 	})
 })
+describe('editor.getShapePageBounds', () => {
+	it('calculates axis aligned bounds correctly', () => {
+		editor.createShape({
+			type: 'geo',
+			x: 99,
+			y: 88,
+			props: {
+				w: 199,
+				h: 188,
+			},
+		})
+		const shape = editor.getLastCreatedShape()
+		expect(editor.getShapePageBounds(shape)!).toMatchInlineSnapshot(`
+	Box {
+	  "h": 188,
+	  "w": 199,
+	  "x": 99,
+	  "y": 88,
+	}
+`)
+	})
+
+	it('calculates rotated bounds correctly', () => {
+		editor.createShape({
+			type: 'geo',
+			x: 99,
+			y: 88,
+			rotation: Math.PI / 4,
+			props: {
+				w: 199,
+				h: 188,
+			},
+		})
+		const shape = editor.getLastCreatedShape()
+		expect(editor.getShapePageBounds(shape)!).toMatchInlineSnapshot(`
+	Box {
+	  "h": 273.65032431919394,
+	  "w": 273.6503243191939,
+	  "x": -33.93607486307093,
+	  "y": 88,
+	}
+`)
+	})
+
+	it('calculates bounds based on vertices, not corners', () => {
+		editor.createShape({
+			type: 'geo',
+			x: 99,
+			y: 88,
+			rotation: Math.PI / 4,
+			props: {
+				geo: 'ellipse',
+				w: 199,
+				h: 188,
+			},
+		})
+		const shape = editor.getLastCreatedShape()
+		expect(editor.getShapePageBounds(shape)!).toMatchInlineSnapshot(`
+	Box {
+	  "h": 193.49999999999997,
+	  "w": 193.50000000000003,
+	  "x": 6.139087296526014,
+	  "y": 128.07516215959694,
+	}
+`)
+	})
+})

package/src/test/commands/clipboard.test.ts

@@ -33,7 +33,7 @@ const doMockClipboard = () => {
 		},
 	})
 
-	globalThis.ClipboardItem = jest.fn((payload: any) => payload)
+	globalThis.ClipboardItem = jest.fn((payload: any) => payload) as any
 
 	return context
 }

package/src/test/editor.test.ts

@@ -1,77 +0,0 @@
-import { TestEditor } from './TestEditor'
-
-describe('editor', () => {
-	let editor: TestEditor
-
-	beforeEach(() => {
-		editor = new TestEditor()
-	})
-
-	describe('editor.getShapePageBounds', () => {
-		it('calculates axis aligned bounds correctly', () => {
-			editor.createShape({
-				type: 'geo',
-				x: 99,
-				y: 88,
-				props: {
-					w: 199,
-					h: 188,
-				},
-			})
-			const shape = editor.getLastCreatedShape()
-			expect(editor.getShapePageBounds(shape)!).toMatchInlineSnapshot(`
-		Box {
-		  "h": 188,
-		  "w": 199,
-		  "x": 99,
-		  "y": 88,
-		}
-	`)
-		})
-
-		it('calculates rotated bounds correctly', () => {
-			editor.createShape({
-				type: 'geo',
-				x: 99,
-				y: 88,
-				rotation: Math.PI / 4,
-				props: {
-					w: 199,
-					h: 188,
-				},
-			})
-			const shape = editor.getLastCreatedShape()
-			expect(editor.getShapePageBounds(shape)!).toMatchInlineSnapshot(`
-		Box {
-		  "h": 273.65032431919394,
-		  "w": 273.6503243191939,
-		  "x": -33.93607486307093,
-		  "y": 88,
-		}
-	`)
-		})
-
-		it('calculates bounds based on vertices, not corners', () => {
-			editor.createShape({
-				type: 'geo',
-				x: 99,
-				y: 88,
-				rotation: Math.PI / 4,
-				props: {
-					geo: 'ellipse',
-					w: 199,
-					h: 188,
-				},
-			})
-			const shape = editor.getLastCreatedShape()
-			expect(editor.getShapePageBounds(shape)!).toMatchInlineSnapshot(`
-		Box {
-		  "h": 193.49999999999997,
-		  "w": 193.50000000000003,
-		  "x": 6.139087296526014,
-		  "y": 128.07516215959694,
-		}
-	`)
-		})
-	})
-})