Fixed autofocus not working on modal inputs

refs https://github.com/TryGhost/Ghost/issues/7132
- apply generic `autofocus` support to anything rendered through `liquid-wormhole`
    - overrides `liquid-wormhole`'s default `wormhole` transition, adding a check for a `<input autofocus>` element and calling focus on it once the default transition and liquid-wormhole element swap has completed
- autofocus search input in Unsplash modal

app/templates/components/gh-unsplash.hbs

@@ -15,6 +15,7 @@
                             name="searchKeyword"
                             placeholder="Search free high-resolution photos"
                             tabindex="1"
+                            autofocus="autofocus"
                             autocorrect="off"
                             value=(readonly unsplash.searchTerm)
                             input=(action "updateSearch" target=unsplash value="target.value")
@@ -72,4 +73,4 @@
         </div>
     {{/if}}
 
-{{/liquid-wormhole}}
+{{/liquid-wormhole}}

app/transitions/wormhole.js

@@ -0,0 +1,21 @@
+import wormhole from 'liquid-wormhole/transitions/wormhole';
+
+// override liquid-wormhole's default `wormhole` transition to focus the first
+// autofocus element after the transition and element swap happens
+
+export default function () {
+    let newWormholeElement;
+
+    if (this.newElement) {
+        newWormholeElement = this.newElement.find('.liquid-wormhole-element:last-child');
+    }
+
+    return wormhole.apply(this, arguments).finally(() => {
+        if (this.newElement && newWormholeElement) {
+            let autofocusElem = newWormholeElement[0].querySelector('[autofocus]');
+            if (autofocusElem) {
+                autofocusElem.focus();
+            }
+        }
+    });
+}