This package has been deprecated

Author message:

Package no longer supported. Contact Support at https://www.npmjs.com/support for more info.

react-virtual-keyboard
DefinitelyTyped icon, indicating that this package has TypeScript declarations provided by the separate @types/react-virtual-keyboard package

1.0.2 • Public • Published

React Virtual Keyboard

A on-screen keyboard (OSK) Component that works in the browser for reactJS. Useful for Kiosk Touchscreens.

Based on the Virtual Keyboard using jQuery: https://mottie.github.io/Keyboard/

Usage

Installation

npm install react-virtual-keyboard

Import Keyboard

import Keyboard from 'react-virtual-keyboard';

Use Keyboard Element

<Keyboard 
  value={this.state.input}
  name='keyboard'
  options={{
    type:"input",
    layout: "qwerty",
    alwaysOpen: true,
    usePreview: false,
    useWheel: false,
    stickyShift: false,
    appendLocally: true,
    color: "light",
    updateOnChange: true,
    initialFocus: true,
    display: {
      "accept" : "Submit"
    }
  }}
  onChange={this.onInputChanged}
  onAccepted={this.onInputSubmitted}
  ref={k => this.keyboard = k}
/>

Return updated values

onInputChanged = (data) => {
  this.setState({ input: data });
}
 
onInputSubmitted = (data) => {
  console.log("Input submitted:", data);
}

Listen for button presses

this.keyboard.interface.keyaction.enter = (base) => {
  // Enter button pressed
  // Accepting content, as an example:
  return this.keyboard.interface.keyaction.accept(base);
};

For more information, check out the API documentation: https://github.com/Mottie/Keyboard/wiki/Options

Dependencies

Package Sidebar

Install

npm i react-virtual-keyboard

Weekly Downloads

2,211

Version

1.0.2

License

MIT

Last publish

Collaborators

  • polyxo