Neoanthropic Preternatural Murmurings
Get unlimited public & private packages + package-based permissions with npm Pro.Get started »

react-touch-device-keyboard

0.1.0 • Public • Published

React virtual keyboard for touch devices. It can be used with native input/text-area element, without touching the existing code. Click here to see it in action

install

$ npm i react-touch-device-keyboard --save

use

import Keyboard from "react-touch-device-keyboard"
 
<Keyboard mountAt={document.getElementById("keyboard-container")}/>

APIS

API Type Description
mountAt dom element dom element where the keyboard should mount
marginFromInput number margin top in px, from the focused input element (default 10px)
alwaysOpen boolean if true keyboard will be alway open (default false)
width number width of keyboard (defualt 900), this won't work if fullScreen is true
fullScreen boolean if true, keyboard will take full width of the window
focusNextOnTab boolean if true, on press of tab focus will go to next focusable element
disabled array[<string>] array of keys which should be disabled (key name should be in lowecase eg. - ['tab', 'a'])
stickToBottom boolean if true keyboard will alway be in bottom of the page
onKeyPress function receives character pressed in keyboard as argument

There are some life hooks also if needed -

beforeOpen - gets triggered every time focus changes afterOpen - gets triggered every time focus changes beforeClose, afterClose

Install

npm i react-touch-device-keyboard

DownloadsWeekly Downloads

1

Version

0.1.0

License

MIT

Unpacked Size

55.4 kB

Total Files

23

Last publish

Collaborators

  • avatar