[fix] zoom shortcuts (#323)

* Adds overrides for zoom in / out / reset commands

* Add reset command, numpad keys

* Remove unused shortcuts

* Update package.json

apps/vscode/extension/package.json

@@ -51,10 +51,47 @@
 				]
 			}
 		],
+		"keybindings": [
+			{
+				"key": "cmd+numpad_add",
+				"title": "Zoom In",
+				"command": "tldraw.tldr.zoomIn",
+				"category": "tldraw",
+				"enablement": "resourceExtname == .tldr"
+			},
+			{
+				"key": "cmd+=",
+				"title": "Zoom In",
+				"command": "tldraw.tldr.zoomIn",
+				"category": "tldraw",
+				"enablement": "resourceExtname == .tldr"
+			},
+			{
+				"key": "cmd+numpad_subtract",
+				"title": "Zoom Out",
+				"command": "tldraw.tldr.zoomOut",
+				"category": "tldraw",
+				"enablement": "resourceExtname == .tldr"
+			},
+			{
+				"key": "cmd+-",
+				"title": "Zoom Out",
+				"command": "tldraw.tldr.zoomOut",
+				"category": "tldraw",
+				"enablement": "resourceExtname == .tldr"
+			},
+			{
+				"key": "cmd+numpad0",
+				"title": "Zoom Out",
+				"command": "tldraw.tldr.resetZoom",
+				"category": "tldraw",
+				"enablement": "resourceExtname == .tldr"
+			}
+		],
 		"commands": [
 			{
 				"command": "tldraw.tldr.new",
-				"title": "New tldraw File",
+				"title": "New File",
 				"category": "tldraw"
 			}
 		]
@@ -82,4 +119,4 @@
 		"vsce": "^2.2.0"
 	},
 	"gitHead": "325008ff82bd27b63d625ad1b760f8871fb71af9"
-}
+}

apps/vscode/extension/src/TldrawEditorProvider.ts

@@ -31,6 +31,18 @@ export class TldrawEditorProvider implements vscode.CustomTextEditorProvider {
       )
     })
 
+    vscode.commands.registerCommand('tldraw.tldr.zoomIn', () => {
+      // Noop
+    })
+
+    vscode.commands.registerCommand('tldraw.tldr.zoomOut', () => {
+      // Noop
+    })
+
+    vscode.commands.registerCommand('tldraw.tldr.resetZoom', () => {
+      // Noop
+    })
+
     // Register our editor provider, indicating to VS Code that we can
     // handle files with the .tldr extension.
     return vscode.window.registerCustomEditorProvider(

packages/tldraw/src/hooks/useKeyboardShortcuts.tsx

@@ -226,10 +226,9 @@ export function useKeyboardShortcuts(ref: React.RefObject<HTMLDivElement>) {
   // Camera
 
   useHotkeys(
-    'ctrl+=,⌘+=',
+    'ctrl+=,⌘+=,ctrl+num_subtract,⌘+num_subtract',
     (e) => {
       if (!canHandleEvent()) return
-
       app.zoomIn()
       e.preventDefault()
     },
@@ -238,7 +237,7 @@ export function useKeyboardShortcuts(ref: React.RefObject<HTMLDivElement>) {
   )
 
   useHotkeys(
-    'ctrl+-,⌘+-',
+    'ctrl+-,⌘+-,ctrl+num_add,⌘+num_add',
     (e) => {
       if (!canHandleEvent()) return
 
@@ -250,30 +249,30 @@ export function useKeyboardShortcuts(ref: React.RefObject<HTMLDivElement>) {
   )
 
   useHotkeys(
-    'shift+1',
+    'shift+0,ctrl+numpad_0,⌘+numpad_0',
     () => {
       if (!canHandleEvent()) return
-      app.zoomToFit()
+      app.resetZoom()
     },
     undefined,
     [app]
   )
 
   useHotkeys(
-    'shift+2',
+    'shift+1',
     () => {
       if (!canHandleEvent()) return
-      app.zoomToSelection()
+      app.zoomToFit()
     },
     undefined,
     [app]
   )
 
   useHotkeys(
-    'shift+0',
+    'shift+2',
     () => {
       if (!canHandleEvent()) return
-      app.resetZoom()
+      app.zoomToSelection()
     },
     undefined,
     [app]