Shortcut

Description

A React package that provides keyboard shortcut management through a context provider and hooks. This package makes it easy to handle keyboard shortcuts in your React applications.

Installation

npm install @brickly/shortcut
# or
yarn add @brickly/shortcut

Usage

import { Shortcut } from '@brickly/shortcut';

// import and use the component within your apps
function App() {
  return (
    <Shortcut
      keys={['ctrl', 's']}
      action={() => console.log('file saved')}>
      <YourComponents />
    </Shortcut>
  );
}

Features

• Easy-to-use React hook for keyboard shortcuts
• Global shortcut management through React Context
• Support for modifier keys (Ctrl, Alt, Shift)
• Prevent default browser shortcuts
• TypeScript support

API Reference

ShortcutProvider

A context provider component that manages keyboard shortcuts for your application.

useKeyboardShortcut(keys: string, action: () => void)

A hook to register keyboard shortcuts in your components.

Parameters:

• shortcut: A string representing the keyboard shortcut (e.g., 'ctrl+s', 'shift+a')
• callback: Function to execute when the shortcut is triggered

License

MIT