⬅️ Back to Table of Contents

📄 onKeyStroke

📊 Analysis Summary

Metric	Count
🔧 Functions	6
📦 Imports	4
📐 Interfaces	1
📑 Type Aliases	3

📚 Table of Contents

• Imports
• Functions
• Interfaces
• Type Aliases

🛠️ File Location:

📂 packages/core/onKeyStroke/index.ts

📦 Imports

Name	Source
MaybeRefOrGetter	vue
toValue	vue
defaultWindow	../_configurable
useEventListener	../useEventListener

---

Functions

onKeyStroke(key: KeyFilter, handler: (event: KeyboardEvent) => void, options: OnKeyStrokeOptions): () => void

Listen for keyboard keystrokes.

See: https://vueuse.org/onKeyStroke

Raw JSDoc

/**
 * Listen for keyboard keystrokes.
 *
 * @see https://vueuse.org/onKeyStroke
 */

Code

export function onKeyStroke(key: KeyFilter, handler: (event: KeyboardEvent) => void, options?: OnKeyStrokeOptions): () => void

onKeyDown(key: KeyFilter, handler: (event: KeyboardEvent) => void, options: Omit<OnKeyStrokeOptions, 'eventName'>): () => void

Listen to the keydown event of the given key.

Parameters:

• key any: No description
• handler any: No description
• options any: No description

See: https://vueuse.org/onKeyStroke

Raw JSDoc

/**
 * Listen to the keydown event of the given key.
 *
 * @see https://vueuse.org/onKeyStroke
 * @param key
 * @param handler
 * @param options
 */

Calls:

• onKeyStroke

Code

export function onKeyDown(key: KeyFilter, handler: (event: KeyboardEvent) => void, options: Omit<OnKeyStrokeOptions, 'eventName'> = {}) {
  return onKeyStroke(key, handler, { ...options, eventName: 'keydown' })
}

onKeyPressed(key: KeyFilter, handler: (event: KeyboardEvent) => void, options: Omit<OnKeyStrokeOptions, 'eventName'>): () => void

Listen to the keypress event of the given key.

Parameters:

• key any: No description
• handler any: No description
• options any: No description

See: https://vueuse.org/onKeyStroke

Raw JSDoc

/**
 * Listen to the keypress event of the given key.
 *
 * @see https://vueuse.org/onKeyStroke
 * @param key
 * @param handler
 * @param options
 */

Calls:

• onKeyStroke

Code

export function onKeyPressed(key: KeyFilter, handler: (event: KeyboardEvent) => void, options: Omit<OnKeyStrokeOptions, 'eventName'> = {}) {
  return onKeyStroke(key, handler, { ...options, eventName: 'keypress' })
}

onKeyUp(key: KeyFilter, handler: (event: KeyboardEvent) => void, options: Omit<OnKeyStrokeOptions, 'eventName'>): () => void

Listen to the keyup event of the given key.

Parameters:

• key any: No description
• handler any: No description
• options any: No description

See: https://vueuse.org/onKeyStroke

Raw JSDoc

/**
 * Listen to the keyup event of the given key.
 *
 * @see https://vueuse.org/onKeyStroke
 * @param key
 * @param handler
 * @param options
 */

Calls:

• onKeyStroke

Code

export function onKeyUp(key: KeyFilter, handler: (event: KeyboardEvent) => void, options: Omit<OnKeyStrokeOptions, 'eventName'> = {}) {
  return onKeyStroke(key, handler, { ...options, eventName: 'keyup' })
}

createKeyPredicate(keyFilter: KeyFilter): KeyPredicate

Parameters:

• keyFilter KeyFilter

Returns: KeyPredicate

Calls:

• Array.isArray
• keyFilter.includes

Code

function createKeyPredicate(keyFilter: KeyFilter): KeyPredicate {
  if (typeof keyFilter === 'function')
    return keyFilter

  else if (typeof keyFilter === 'string')
    return (event: KeyboardEvent) => event.key === keyFilter

  else if (Array.isArray(keyFilter))
    return (event: KeyboardEvent) => keyFilter.includes(event.key)

  return () => true
}

Internal helpers

Declared inside another function in this file.

listener(e: KeyboardEvent): void

Parameters:

• e KeyboardEvent

Returns: void

Calls:

• toValue (from vue)
• predicate
• handler

Code

(e: KeyboardEvent) => {
    if (e.repeat && toValue(dedupe))
      return

    if (predicate(e))
      handler(e)
  }

---

Interfaces

OnKeyStrokeOptions

Interface Code

export interface OnKeyStrokeOptions {
  eventName?: KeyStrokeEventName
  target?: MaybeRefOrGetter<EventTarget | null | undefined>
  passive?: boolean
  /**
   * Set to `true` to ignore repeated events when the key is being held down.
   *
   * @default false
   */
  dedupe?: MaybeRefOrGetter<boolean>
}

Properties

Name	Type	Optional	Description
eventName	KeyStrokeEventName	✓	not shown
target	MaybeRefOrGetter<EventTarget \| null \| undefined>	✓	not shown
passive	boolean	✓	not shown
dedupe	MaybeRefOrGetter<boolean>	✓	not shown

---

Type Aliases

KeyPredicate

type KeyPredicate = (event: KeyboardEvent) => boolean;

KeyFilter

type KeyFilter = true | string | string[] | KeyPredicate;

KeyStrokeEventName

type KeyStrokeEventName = 'keydown' | 'keypress' | 'keyup';

---

Generated by Syntax Scribe