Astro-keyboard-controls NPM

Astro Keyboard Controls

An Astro component that allows you to easily bind to specific keyboard keys and focus on a specific element based on a passed selector string.

Installation

npm install astro-keyboard-controls

Example

---
import KeyboardControls from 'astro-keyboard-controls';

---

<Layout {meta}>
	<KeyboardControls selector="div#search input" key="/" />
    <div id="search">
        <input type="text" />
    </div>
</Layout>

Available component props

Name	Type	Example	Description
`selector`	String	`div#search input`	A string specifying the selector that is passed to `document.querySelector()`
`site`	String	`/`	The keyboard key to bind with an event listener for `keydown`

Author

Liran Tal liran@lirantal.com

astro astrojs astro-component astro-plugin astro-keyboard-controls

@everything-registry/sub-chunk-1173

1.0.0

10 months ago