Nice Poodle, Mister

    usekey-event-manager
    TypeScript icon, indicating that this package has built-in type declarations

    1.0.0 • Public • Published

    usekey-event-manager

    npm npm bundle size (minified) npm A project badge feature text "PRs Welcome"

    🔑 Easily map window listeners to keyboard events in React

    Prerequisites

    useKey is a custom React hook, so you're project must be running React and ReactDOM versions 16.8+.

    Installation

    To install, use your package manager of choice. Here is the command for npm:

    npm i usekey-event-manager

    Usage

    Import useKey from usekey-event-manager and pass it a keyboard event map:

    import React from 'react'
    import useKey from 'usekey-event-manager'
     
    function Dialog(props) {
        useKey({ Escape: props.closeAndReturnFocus })
        return(
            <div role="alertdialog">
                {/* ... */}
            </div>
        )
    }
     
    export default Dialog

    API

    Version 1+ of usekey-event-manager comprises a single export: useKey.

    useKey()

    useKey is a custom React hook that assigns a window event listener on keydown. When an event is fired, the listener compares it to a set of selected keys, then calls the action and passes the event object if there is a match.

    useKey(Object<String, Function>)

    If there is a single key that you want to listen for, you can pass a map like so:

    useKey({ Escape: close })

    Contributing

    Pull requests are welcome. For major changes, please open an issue first to discuss what you would like to change.

    Please make sure to update tests as appropriate.

    Author

    Sean McPherson

    License

    MIT

    Install

    npm i usekey-event-manager

    DownloadsWeekly Downloads

    8

    Version

    1.0.0

    License

    ISC

    Unpacked Size

    6.85 kB

    Total Files

    7

    Last publish

    Collaborators

    • seanmcp