Add create cards with keyboard

CTRL+ENTER to create
CTRL+SHIFT+ENTER to create and add another

app/javascript/controllers/clicker_controller.js

@@ -6,6 +6,10 @@ export default class extends Controller {
 
   async click() {
     await nextFrame()
-    this.clickableTarget.click()
+    this.#clickable.click()
+  }
+
+  get #clickable() {
+    return this.hasClickableTarget ? this.clickableTarget : this.element
   }
 }

app/views/cards/container/footer/_draft.html.erb

@@ -1,12 +1,13 @@
 <div class="card-perma__notch card-perma__notch--bottom">
   <%= button_to card_publish_path(card), name: "creation_type", value: "add", class: "btn",
         form: { data: { controller: "form" } },
-        data: { form_target: "submit" } do %>
+        data: { form_target: "submit", controller: "clicker", action: "keydown.ctrl+enter@document->clicker#click keydown.meta+enter@document->clicker#click" } do %>
     <span>Create card</span>
   <% end %>
 
   <%= button_to card_publish_path(card), method: :post, class: "btn btn--reversed", name: "creation_type", value: "add_another",
-        title: "Create and add another (ctrl+shift+enter)", form: { data: { controller: "form" } }, data: { form_target: "submit" } do %>
+        title: "Create and add another (ctrl+shift+enter)", form: { data: { controller: "form" } },
+        data: { form_target: "submit", controller: "clicker", action: "keydown.ctrl+shift+enter@document->clicker#click keydown.meta+shift+enter@document->clicker#click" } do %>
     <span>Create and add another</span>
   <% end %>
 </div>