Keyboard Utilities

Keyboard Utilities

Helper functions for handling keyboard input and navigation.

resolveArrowDirection

Map arrow key events to directional values.

type Direction = 'up' | 'down' | 'left' | 'right'
resolveArrowDirection(event: KeyboardEvent): Direction | null

Returns the arrow direction or null if the key is not an arrow key.

bumpColorValue

Increment or decrement a color value based on arrow key direction.

bumpColorValue(
  value: number,
  direction: Direction,
  options?: {
    min?: number
    max?: number
    step?: number
    largeStep?: number
  }
): number

Adjusts values with keyboard controls:

• Arrow keys: increment/decrement by step (default: 1)
• Shift + Arrow keys: increment/decrement by largeStep (default: 10)

Examples

import { resolveArrowDirection, bumpColorValue } from 'huey/utils'

input.addEventListener('keydown', (e) => {
  const direction = resolveArrowDirection(e)
  if (direction) {
    const newValue = bumpColorValue(currentValue, direction, {
      min: 0,
      max: 360,
      step: 1,
      largeStep: 10
    })
  }
})