Css Zero Showcase
x
1
<form class="button_to" method="post" action="/lookbook/home/index"><button class="btn" data-controller="hotkey" data-action="keydown.w@document->hotkey#click" data-turbo-confirm="Are you sure?" type="submit">Click or press w</button><input type="hidden" name="authenticity_token" value="JX7zv-IL2owbwh2kPHre3rAvE4oK-U1Slo9oUahAMIg2D_c_yl34mxOoPjZ7YMO7JDpZZWc4-hJej31rIRJGNA" autocomplete="off" /></form>
1
<%= button_to "Click or press w", nil, class: "btn", data: { controller: "hotkey", action: "keydown.w@document->hotkey#click", turbo_confirm: "Are you sure?" } %>
CSS is not required or multiple files are needed, check the notes.
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
import { Controller } from "@hotwired/stimulus"
export default class extends Controller {
  click(event) {
    this.#isClickable && !this.#shouldIgnore(event) && this.element.click()
  }
  #shouldIgnore(event) {
    return event.defaultPrevented || event.target.closest("input, textarea")
  }
  get #isClickable() {
    return getComputedStyle(this.element).pointerEvents !== "none"
  }
}

No notes provided.