Changeset 59035

Timestamp:

09/17/2024 09:56:43 PM (4 weeks ago)

Author:

antpb

Message:

Media: Add Ctrl/Command + Enter shortcut to insert selected Media Library items.

Adds a Ctrl/Command + Enter keyboard shortcut to insert the currently selected single media or multiple media items when selecting in the Media Library modal.

Props poena, hirschferkel, antpb, joedolson, skobe, rcreators, plaidharper.
Fixes #60369.

Location:

trunk/src/js/media/views

Files:

• attachment.js (modified) (1 diff)
• modal.js (modified) (2 diffs)

trunk/src/js/media/views/attachment.js

@@ -200 +200 @@
         }
 
+        // Avoid toggles when the command or control key is pressed with the enter key to prevent deselecting the last selected attachment.
+        if ( ( event.metaKey || event.ctrlKey ) && ( 13 === event.keyCode || 10 === event.keyCode ) ) {
+            return;
+        }
+
         this.toggleSelection({
             method: method

trunk/src/js/media/views/modal.js

@@ -182 +182 @@
 
     /**
+     * Handles the selection of attachments when the command or control key is pressed with the enter key.
+     *
+     * @since 6.7
+     *
+     * @param {Object} event The keydown event object.
+     */
+    selectHandler: function( event ) {
+        var selection = this.controller.state().get( 'selection' );
+
+        if ( ! selection.length > 0 ) {
+            return;
+        }
+
+        if ( 'insert' === this.controller.options.state ) {
+            this.controller.trigger( 'insert', selection );
+        } else {
+            this.controller.trigger( 'select', selection );
+            event.preventDefault();
+            this.escape();
+        }
+    },
+
+    /**
      * @param {Array|Object} content Views to register to '.media-modal-content'
      * @return {wp.media.view.Modal} Returns itself to allow chaining.
@@ -215 +238 @@
             event.stopImmediatePropagation();
         }
+
+        // Select the attachment when command or control and enter are pressed.
+        if ( ( 13 === event.which || 10 === event.which ) && ( event.metaKey || event.ctrlKey ) ) {
+            this.selectHandler( event );
+            event.stopImmediatePropagation();
+        }
+
     }
 });