浏览代码

feat: cut command and shortcuts

Konstantinos Kaloutas 3 年之前
父节点
当前提交
f1d406f82a

+ 11 - 0
tldraw/apps/tldraw-logseq/src/components/ContextMenu/ContextMenu.tsx

@@ -38,6 +38,17 @@ export const ContextMenu = observer(function ContextMenu({
         <div>
           {app.selectedShapes?.size > 0 && (
             <>
+              <ReactContextMenu.Item
+                className="tl-context-menu-button"
+                onClick={() => runAndTransition(app.cut)}
+              >
+                Cut
+                <div className="tl-context-menu-right-slot">
+                  <span className="keyboard-shortcut">
+                    <code>{MOD_KEY}</code> <code>X</code>
+                  </span>
+                </div>
+              </ReactContextMenu.Item>
               <ReactContextMenu.Item
                 className="tl-context-menu-button"
                 onClick={() => runAndTransition(app.copy)}

+ 6 - 2
tldraw/apps/tldraw-logseq/src/components/ZoomMenu/ZoomMenu.tsx

@@ -25,7 +25,11 @@ export const ZoomMenu = observer(function ZoomMenu(): JSX.Element {
           onClick={app.api.zoomToFit}
         >
           Zoom to fit
-          <div className="tl-zoom-menu-right-slot"></div>
+          <div className="tl-zoom-menu-right-slot">
+            <span className="keyboard-shortcut">
+              <code>1</code>
+            </span>
+          </div>
         </DropdownMenuPrimitive.Item>
         <DropdownMenuPrimitive.Item
           className="menu-link tl-zoom-menu-dropdown-item"
@@ -35,7 +39,7 @@ export const ZoomMenu = observer(function ZoomMenu(): JSX.Element {
           Zoom to selection
           <div className="tl-zoom-menu-right-slot">
             <span className="keyboard-shortcut">
-              <code>{MOD_KEY}</code> <code>-</code>
+              <code>⇧</code> <code>1</code>
             </span>
           </div>
         </DropdownMenuPrimitive.Item>

+ 14 - 1
tldraw/packages/core/src/lib/TLApp/TLApp.ts

@@ -96,7 +96,11 @@ export class TLApp<
         fn: () => this.api.resetZoom(),
       },
       {
-        keys: 'mod+-',
+        keys: '1',
+        fn: () => this.api.zoomToFit(),
+      },
+      {
+        keys: 'shift+1',
         fn: () => this.api.zoomToSelection(),
       },
       {
@@ -111,6 +115,10 @@ export class TLApp<
         keys: 'mod+z',
         fn: () => this.undo(),
       },
+      {
+        keys: 'mod+x',
+        fn: () => this.cut(),
+      },
       {
         keys: 'mod+shift+z',
         fn: () => this.redo(),
@@ -437,6 +445,11 @@ export class TLApp<
     }
   }
 
+  cut = () => {
+    this.copy()
+    this.api.deleteShapes()
+  }
+
   dropFiles = (files: FileList, point?: number[]) => {
     this.notify('drop-files', {
       files: Array.from(files),