<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<base data-ice="baseUrl" href="../../../../">
<title data-ice="title">SimpleKeyboard | simple-keyboard</title>
<link type="text/css" rel="stylesheet" href="css/style.css">
<link type="text/css" rel="stylesheet" href="css/prettify-tomorrow.css">
<script src="script/prettify/prettify.js"></script>
<script src="script/manual.js"></script>
<meta name="description" content="On-screen Javascript Virtual Keyboard"><meta property="twitter:card" content="summary"><meta property="twitter:title" content="simple-keyboard"><meta property="twitter:description" content="On-screen Javascript Virtual Keyboard"></head>
<body class="layout-container" data-ice="rootContainer">
<header>
<a href="./">Home</a>
<a href="identifiers.html">Reference</a>
<a href="source.html">Source</a>
<div class="search-box">
<span>
<img src="./image/search.png">
<span class="search-input-edge"></span><input class="search-input"><span class="search-input-edge"></span>
</span>
<ul class="search-result"></ul>
</div>
<a style="position:relative; top:3px;" href="https://github.com/hodgef/simple-keyboard"><img width="20px" src="./image/github.png"></a></header>
<nav class="navigation" data-ice="nav"><div>
<ul>
<li data-ice="doc"><a data-ice="dirPath" class="nav-dir-path" href="identifiers.html#demo">demo</a><span data-ice="kind" class="kind-class">C</span><span data-ice="name"><span><a href="class/src/demo/App.js~App.html">App</a></span></span></li>
<li data-ice="doc"><a data-ice="dirPath" class="nav-dir-path" href="identifiers.html#lib-components">lib/components</a><span data-ice="kind" class="kind-class">C</span><span data-ice="name"><span><a href="class/src/lib/components/Keyboard.js~SimpleKeyboard.html">SimpleKeyboard</a></span></span></li>
<li data-ice="doc"><a data-ice="dirPath" class="nav-dir-path" href="identifiers.html#lib-services">lib/services</a><span data-ice="kind" class="kind-class">C</span><span data-ice="name"><span><a href="class/src/lib/services/KeyboardLayout.js~KeyboardLayout.html">KeyboardLayout</a></span></span></li>
<li data-ice="doc"><span data-ice="kind" class="kind-class">C</span><span data-ice="name"><span><a href="class/src/lib/services/PhysicalKeyboard.js~PhysicalKeyboard.html">PhysicalKeyboard</a></span></span></li>
<li data-ice="doc"><span data-ice="kind" class="kind-class">C</span><span data-ice="name"><span><a href="class/src/lib/services/Utilities.js~Utilities.html">Utilities</a></span></span></li>
<li data-ice="doc"><a data-ice="dirPath" class="nav-dir-path" href="identifiers.html#lib-tests">lib/tests</a><span data-ice="kind" class="kind-class">C</span><span data-ice="name"><span><a href="class/src/lib/tests/TestUtility.js~TestUtility.html">TestUtility</a></span></span></li>
</ul>
</div>
</nav>
<div class="content" data-ice="content"><div class="header-notice">
<div data-ice="importPath" class="import-path"><pre class="prettyprint"><code data-ice="importPathCode">import SimpleKeyboard from '<span><a href="file/src/lib/components/Keyboard.js.html#lineNumber15">simple-keyboard/src/lib/components/Keyboard.js</a></span>'</code></pre></div>
<span data-ice="access">public</span>
<span data-ice="kind">class</span>
<span data-ice="source">| <span><a href="file/src/lib/components/Keyboard.js.html#lineNumber15">source</a></span></span>
</div>
<div class="self-detail detail">
<h1 data-ice="name">SimpleKeyboard</h1>
<div class="description" data-ice="description"><p>Root class for simple-keyboard
This class:</p>
<ul>
<li>Parses the options</li>
<li>Renders the rows and buttons</li>
<li>Handles button functionality</li>
</ul>
</div>
</div>
<div data-ice="constructorSummary"><h2>Constructor Summary</h2><table class="summary" data-ice="summary">
<thead><tr><td data-ice="title" colspan="3">Public Constructor</td></tr></thead>
<tbody>
<tr data-ice="target">
<td>
<span class="access" data-ice="access">public</span>
<span class="override" data-ice="override"></span>
</td>
<td>
<div>
<p>
<span class="code" data-ice="name"><span><a href="class/src/lib/components/Keyboard.js~SimpleKeyboard.html#instance-constructor-constructor">constructor</a></span></span><span class="code" data-ice="signature">(params: <span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array">Array</a></span>)</span>
</p>
</div>
<div>
<div data-ice="description"><p>Creates an instance of SimpleKeyboard</p>
</div>
</div>
</td>
<td>
</td>
</tr>
</tbody>
</table>
</div>
<div data-ice="memberSummary"><h2>Member Summary</h2><table class="summary" data-ice="summary">
<thead><tr><td data-ice="title" colspan="3">Public Members</td></tr></thead>
<tbody>
<tr data-ice="target">
<td>
<span class="access" data-ice="access">public</span>
<span class="override" data-ice="override"></span>
</td>
<td>
<div>
<p>
<span class="code" data-ice="name"><span><a href="class/src/lib/components/Keyboard.js~SimpleKeyboard.html#instance-member-buttonElements">buttonElements</a></span></span><span class="code" data-ice="signature">: <span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object">object</a></span></span>
</p>
</div>
<div>
</div>
</td>
<td>
</td>
</tr>
<tr data-ice="target">
<td>
<span class="access" data-ice="access">public</span>
<span class="override" data-ice="override"></span>
</td>
<td>
<div>
<p>
<span class="code" data-ice="name"><span><a href="class/src/lib/components/Keyboard.js~SimpleKeyboard.html#instance-member-caretPosition">caretPosition</a></span></span><span class="code" data-ice="signature">: <span>*</span></span>
</p>
</div>
<div>
<div data-ice="description"><p>Only first instance should insall the caret handling events</p>
</div>
</div>
</td>
<td>
</td>
</tr>
<tr data-ice="target">
<td>
<span class="access" data-ice="access">public</span>
<span class="override" data-ice="override"></span>
</td>
<td>
<div>
<p>
<span class="code" data-ice="name"><span><a href="class/src/lib/components/Keyboard.js~SimpleKeyboard.html#instance-member-getModuleProp">getModuleProp</a></span></span><span class="code" data-ice="signature">: <span>*</span></span>
</p>
</div>
<div>
<div data-ice="description"><p>Get module prop</p>
</div>
</div>
</td>
<td>
</td>
</tr>
<tr data-ice="target">
<td>
<span class="access" data-ice="access">public</span>
<span class="override" data-ice="override"></span>
</td>
<td>
<div>
<p>
<span class="code" data-ice="name"><span><a href="class/src/lib/components/Keyboard.js~SimpleKeyboard.html#instance-member-getModulesList">getModulesList</a></span></span><span class="code" data-ice="signature">: <span>*</span></span>
</p>
</div>
<div>
<div data-ice="description"><p>getModulesList</p>
</div>
</div>
</td>
<td>
</td>
</tr>
<tr data-ice="target">
<td>
<span class="access" data-ice="access">public</span>
<span class="override" data-ice="override"></span>
</td>
<td>
<div>
<p>
<span class="code" data-ice="name"><span><a href="class/src/lib/components/Keyboard.js~SimpleKeyboard.html#instance-member-holdInteractionTimeout">holdInteractionTimeout</a></span></span><span class="code" data-ice="signature">: <span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object">object</a></span></span>
</p>
</div>
<div>
</div>
</td>
<td>
</td>
</tr>
<tr data-ice="target">
<td>
<span class="access" data-ice="access">public</span>
<span class="override" data-ice="override"></span>
</td>
<td>
<div>
<p>
<span class="code" data-ice="name"><span><a href="class/src/lib/components/Keyboard.js~SimpleKeyboard.html#instance-member-holdTimeout">holdTimeout</a></span></span><span class="code" data-ice="signature">: <span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object">object</a></span></span>
</p>
</div>
<div>
</div>
</td>
<td>
</td>
</tr>
<tr data-ice="target">
<td>
<span class="access" data-ice="access">public</span>
<span class="override" data-ice="override"></span>
</td>
<td>
<div>
<p>
<span class="code" data-ice="name"><span><a href="class/src/lib/components/Keyboard.js~SimpleKeyboard.html#instance-member-initialized">initialized</a></span></span><span class="code" data-ice="signature">: <span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Boolean">boolean</a></span></span>
</p>
</div>
<div>
<div data-ice="description"><p>Ensures that onInit is only called once per instantiation</p>
</div>
</div>
</td>
<td>
</td>
</tr>
<tr data-ice="target">
<td>
<span class="access" data-ice="access">public</span>
<span class="override" data-ice="override"></span>
</td>
<td>
<div>
<p>
<span class="code" data-ice="name"><span><a href="class/src/lib/components/Keyboard.js~SimpleKeyboard.html#instance-member-input">input</a></span></span><span class="code" data-ice="signature">: <span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object">object</a></span></span>
</p>
</div>
<div>
<div data-ice="description"><p>simple-keyboard uses a non-persistent internal input to keep track of the entered string (the variable <code>keyboard.input</code>).</p>
</div>
</div>
</td>
<td>
</td>
</tr>
<tr data-ice="target">
<td>
<span class="access" data-ice="access">public</span>
<span class="override" data-ice="override"></span>
</td>
<td>
<div>
<p>
<span class="code" data-ice="name"><span><a href="class/src/lib/components/Keyboard.js~SimpleKeyboard.html#instance-member-isMouseHold">isMouseHold</a></span></span><span class="code" data-ice="signature">: <span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Boolean">boolean</a></span></span>
</p>
</div>
<div>
</div>
</td>
<td>
</td>
</tr>
<tr data-ice="target">
<td>
<span class="access" data-ice="access">public</span>
<span class="override" data-ice="override"></span>
</td>
<td>
<div>
<p>
<span class="code" data-ice="name"><span><a href="class/src/lib/components/Keyboard.js~SimpleKeyboard.html#instance-member-keyboardDOM">keyboardDOM</a></span></span><span class="code" data-ice="signature">: <span>*</span></span>
</p>
</div>
<div>
<div data-ice="description"><p>Processing options</p>
</div>
</div>
</td>
<td>
</td>
</tr>
<tr data-ice="target">
<td>
<span class="access" data-ice="access">public</span>
<span class="override" data-ice="override"></span>
</td>
<td>
<div>
<p>
<span class="code" data-ice="name"><span><a href="class/src/lib/components/Keyboard.js~SimpleKeyboard.html#instance-member-keyboardDOMClass">keyboardDOMClass</a></span></span><span class="code" data-ice="signature">: <span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String">string</a></span></span>
</p>
</div>
<div>
</div>
</td>
<td>
</td>
</tr>
<tr data-ice="target">
<td>
<span class="access" data-ice="access">public</span>
<span class="override" data-ice="override"></span>
</td>
<td>
<div>
<p>
<span class="code" data-ice="name"><span><a href="class/src/lib/components/Keyboard.js~SimpleKeyboard.html#instance-member-keyboardPluginClasses">keyboardPluginClasses</a></span></span><span class="code" data-ice="signature">: <span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object">object</a></span></span>
</p>
</div>
<div>
</div>
</td>
<td>
</td>
</tr>
<tr data-ice="target">
<td>
<span class="access" data-ice="access">public</span>
<span class="override" data-ice="override"></span>
</td>
<td>
<div>
<p>
<span class="code" data-ice="name"><span><a href="class/src/lib/components/Keyboard.js~SimpleKeyboard.html#instance-member-modules">modules</a></span></span><span class="code" data-ice="signature">: {}</span>
</p>
</div>
<div>
<div data-ice="description"><p>Modules</p>
</div>
</div>
</td>
<td>
</td>
</tr>
<tr data-ice="target">
<td>
<span class="access" data-ice="access">public</span>
<span class="override" data-ice="override"></span>
</td>
<td>
<div>
<p>
<span class="code" data-ice="name"><span><a href="class/src/lib/components/Keyboard.js~SimpleKeyboard.html#instance-member-options">options</a></span></span><span class="code" data-ice="signature">: <span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object">object</a></span></span>
</p>
</div>
<div>
</div>
</td>
<td>
</td>
</tr>
<tr data-ice="target">
<td>
<span class="access" data-ice="access">public</span>
<span class="override" data-ice="override"></span>
</td>
<td>
<div>
<p>
<span class="code" data-ice="name"><span><a href="class/src/lib/components/Keyboard.js~SimpleKeyboard.html#instance-member-physicalKeyboardInterface">physicalKeyboardInterface</a></span></span><span class="code" data-ice="signature">: <span>*</span></span>
</p>
</div>
<div>
<div data-ice="description"><p>Physical Keyboard support</p>
</div>
</div>
</td>
<td>
</td>
</tr>
<tr data-ice="target">
<td>
<span class="access" data-ice="access">public</span>
<span class="override" data-ice="override"></span>
</td>
<td>
<div>
<p>
<span class="code" data-ice="name"><span><a href="class/src/lib/components/Keyboard.js~SimpleKeyboard.html#instance-member-registerModule">registerModule</a></span></span><span class="code" data-ice="signature">: <span>*</span></span>
</p>
</div>
<div>
<div data-ice="description"><p>Register module</p>
</div>
</div>
</td>
<td>
</td>
</tr>
<tr data-ice="target">
<td>
<span class="access" data-ice="access">public</span>
<span class="override" data-ice="override"></span>
</td>
<td>
<div>
<p>
<span class="code" data-ice="name"><span><a href="class/src/lib/components/Keyboard.js~SimpleKeyboard.html#instance-member-setOptions">setOptions</a></span></span><span class="code" data-ice="signature">(option: <span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object">object</a></span>): <span>*</span></span>
</p>
</div>
<div>
<div data-ice="description"><p>Set new option or modify existing ones after initialization.</p>
</div>
</div>
</td>
<td>
</td>
</tr>
<tr data-ice="target">
<td>
<span class="access" data-ice="access">public</span>
<span class="override" data-ice="override"></span>
</td>
<td>
<div>
<p>
<span class="code" data-ice="name"><span><a href="class/src/lib/components/Keyboard.js~SimpleKeyboard.html#instance-member-utilities">utilities</a></span></span><span class="code" data-ice="signature">: <span>*</span></span>
</p>
</div>
<div>
<div data-ice="description"><p>Initializing Utilities</p>
</div>
</div>
</td>
<td>
</td>
</tr>
</tbody>
</table>
</div>
<div data-ice="methodSummary"><h2>Method Summary</h2><table class="summary" data-ice="summary">
<thead><tr><td data-ice="title" colspan="3">Public Methods</td></tr></thead>
<tbody>
<tr data-ice="target">
<td>
<span class="access" data-ice="access">public</span>
<span class="override" data-ice="override"></span>
</td>
<td>
<div>
<p>
<span class="code" data-ice="name"><span><a href="class/src/lib/components/Keyboard.js~SimpleKeyboard.html#instance-method-addButtonTheme">addButtonTheme</a></span></span><span class="code" data-ice="signature">(buttons: <span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String">string</a></span>, className: <span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String">string</a></span>): <span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Boolean">boolean</a></span></span>
</p>
</div>
<div>
<div data-ice="description"><p>Adds/Modifies an entry to the <code>buttonTheme</code>.</p>
</div>
</div>
</td>
<td>
</td>
</tr>
<tr data-ice="target">
<td>
<span class="access" data-ice="access">public</span>
<span class="override" data-ice="override"></span>
</td>
<td>
<div>
<p>
<span class="code" data-ice="name"><span><a href="class/src/lib/components/Keyboard.js~SimpleKeyboard.html#instance-method-caretEventHandler">caretEventHandler</a></span></span><span class="code" data-ice="signature">(event: <span>*</span>)</span>
</p>
</div>
<div>
<div data-ice="description"><p>Called by <span><a href="class/src/lib/components/Keyboard.js~SimpleKeyboard.html#instance-method-handleCaret">handleCaret</a></span> when an event that warrants a cursor position update is triggered</p>
</div>
</div>
</td>
<td>
</td>
</tr>
<tr data-ice="target">
<td>
<span class="access" data-ice="access">public</span>
<span class="override" data-ice="override"></span>
</td>
<td>
<div>
<p>
<span class="code" data-ice="name"><span><a href="class/src/lib/components/Keyboard.js~SimpleKeyboard.html#instance-method-clear">clear</a></span></span><span class="code" data-ice="signature">()</span>
</p>
</div>
<div>
<div data-ice="description"><p>Remove all keyboard rows and reset keyboard values.</p>
</div>
</div>
</td>
<td>
</td>
</tr>
<tr data-ice="target">
<td>
<span class="access" data-ice="access">public</span>
<span class="override" data-ice="override"></span>
</td>
<td>
<div>
<p>
<span class="code" data-ice="name"><span><a href="class/src/lib/components/Keyboard.js~SimpleKeyboard.html#instance-method-clearInput">clearInput</a></span></span><span class="code" data-ice="signature">(inputName: <span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String">string</a></span>)</span>
</p>
</div>
<div>
<div data-ice="description"><p>Clear the keyboard’s input.</p>
</div>
</div>
</td>
<td>
</td>
</tr>
<tr data-ice="target">
<td>
<span class="access" data-ice="access">public</span>
<span class="override" data-ice="override"></span>
</td>
<td>
<div>
<p>
<span class="code" data-ice="name"><span><a href="class/src/lib/components/Keyboard.js~SimpleKeyboard.html#instance-method-dispatch">dispatch</a></span></span><span class="code" data-ice="signature">(callback: <span><span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Function">function</a></span><span>(instance: <span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object">object</a></span>, key: <span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String">string</a></span>)</span></span>): <span>*</span></span>
</p>
</div>
<div>
<div data-ice="description"><p>Send a command to all simple-keyboard instances at once (if you have multiple instances).</p>
</div>
</div>
</td>
<td>
</td>
</tr>
<tr data-ice="target">
<td>
<span class="access" data-ice="access">public</span>
<span class="override" data-ice="override"></span>
</td>
<td>
<div>
<p>
<span class="code" data-ice="name"><span><a href="class/src/lib/components/Keyboard.js~SimpleKeyboard.html#instance-method-getButtonElement">getButtonElement</a></span></span><span class="code" data-ice="signature">(button: <span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String">string</a></span>): <span>*</span></span>
</p>
</div>
<div>
<div data-ice="description"><p>Get the DOM Element of a button.</p>
</div>
</div>
</td>
<td>
</td>
</tr>
<tr data-ice="target">
<td>
<span class="access" data-ice="access">public</span>
<span class="override" data-ice="override"></span>
</td>
<td>
<div>
<p>
<span class="code" data-ice="name"><span><a href="class/src/lib/components/Keyboard.js~SimpleKeyboard.html#instance-method-getInput">getInput</a></span></span><span class="code" data-ice="signature">(inputName: <span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String">string</a></span>): <span>*</span></span>
</p>
</div>
<div>
<div data-ice="description"><p>Get the keyboard’s input (You can also get it from the onChange prop).</p>
</div>
</div>
</td>
<td>
</td>
</tr>
<tr data-ice="target">
<td>
<span class="access" data-ice="access">public</span>
<span class="override" data-ice="override"></span>
</td>
<td>
<div>
<p>
<span class="code" data-ice="name"><span><a href="class/src/lib/components/Keyboard.js~SimpleKeyboard.html#instance-method-handleButtonClicked">handleButtonClicked</a></span></span><span class="code" data-ice="signature">(button: <span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String">string</a></span>): <span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Boolean">boolean</a></span></span>
</p>
</div>
<div>
<div data-ice="description"><p>Handles clicks made to keyboard buttons</p>
</div>
</div>
</td>
<td>
</td>
</tr>
<tr data-ice="target">
<td>
<span class="access" data-ice="access">public</span>
<span class="override" data-ice="override"></span>
</td>
<td>
<div>
<p>
<span class="code" data-ice="name"><span><a href="class/src/lib/components/Keyboard.js~SimpleKeyboard.html#instance-method-handleButtonHold">handleButtonHold</a></span></span><span class="code" data-ice="signature">(button: <span>*</span>)</span>
</p>
</div>
<div>
<div data-ice="description"><p>Handles button hold</p>
</div>
</div>
</td>
<td>
</td>
</tr>
<tr data-ice="target">
<td>
<span class="access" data-ice="access">public</span>
<span class="override" data-ice="override"></span>
</td>
<td>
<div>
<p>
<span class="code" data-ice="name"><span><a href="class/src/lib/components/Keyboard.js~SimpleKeyboard.html#instance-method-handleButtonMouseDown">handleButtonMouseDown</a></span></span><span class="code" data-ice="signature">(button: <span>*</span>, e: <span>*</span>)</span>
</p>
</div>
<div>
<div data-ice="description"><p>Handles button mousedown</p>
</div>
</div>
</td>
<td>
</td>
</tr>
<tr data-ice="target">
<td>
<span class="access" data-ice="access">public</span>
<span class="override" data-ice="override"></span>
</td>
<td>
<div>
<p>
<span class="code" data-ice="name"><span><a href="class/src/lib/components/Keyboard.js~SimpleKeyboard.html#instance-method-handleButtonMouseUp">handleButtonMouseUp</a></span></span><span class="code" data-ice="signature">()</span>
</p>
</div>
<div>
<div data-ice="description"><p>Handles button mouseup</p>
</div>
</div>
</td>
<td>
</td>
</tr>
<tr data-ice="target">
<td>
<span class="access" data-ice="access">public</span>
<span class="override" data-ice="override"></span>
</td>
<td>
<div>
<p>
<span class="code" data-ice="name"><span><a href="class/src/lib/components/Keyboard.js~SimpleKeyboard.html#instance-method-handleCaret">handleCaret</a></span></span><span class="code" data-ice="signature">()</span>
</p>
</div>
<div>
<div data-ice="description"><p>Retrieves the current cursor position within a input or textarea (if any)</p>
</div>
</div>
</td>
<td>
</td>
</tr>
<tr data-ice="target">
<td>
<span class="access" data-ice="access">public</span>
<span class="override" data-ice="override"></span>
</td>
<td>
<div>
<p>
<span class="code" data-ice="name"><span><a href="class/src/lib/components/Keyboard.js~SimpleKeyboard.html#instance-method-loadModules">loadModules</a></span></span><span class="code" data-ice="signature">()</span>
</p>
</div>
<div>
<div data-ice="description"><p>Load modules</p>
</div>
</div>
</td>
<td>
</td>
</tr>
<tr data-ice="target">
<td>
<span class="access" data-ice="access">public</span>
<span class="override" data-ice="override"></span>
</td>
<td>
<div>
<p>
<span class="code" data-ice="name"><span><a href="class/src/lib/components/Keyboard.js~SimpleKeyboard.html#instance-method-onInit">onInit</a></span></span><span class="code" data-ice="signature">()</span>
</p>
</div>
<div>
<div data-ice="description"><p>Executes the callback function once simple-keyboard is rendered for the first time (on initialization).</p>
</div>
</div>
</td>
<td>
</td>
</tr>
<tr data-ice="target">
<td>
<span class="access" data-ice="access">public</span>
<span class="override" data-ice="override"></span>
</td>
<td>
<div>
<p>
<span class="code" data-ice="name"><span><a href="class/src/lib/components/Keyboard.js~SimpleKeyboard.html#instance-method-onModulesLoaded">onModulesLoaded</a></span></span><span class="code" data-ice="signature">()</span>
</p>
</div>
<div>
<div data-ice="description"><p>Executes the callback function once all modules have been loaded</p>
</div>
</div>
</td>
<td>
</td>
</tr>
<tr data-ice="target">
<td>
<span class="access" data-ice="access">public</span>
<span class="override" data-ice="override"></span>
</td>
<td>
<div>
<p>
<span class="code" data-ice="name"><span><a href="class/src/lib/components/Keyboard.js~SimpleKeyboard.html#instance-method-onRender">onRender</a></span></span><span class="code" data-ice="signature">()</span>
</p>
</div>
<div>
<div data-ice="description"><p>Executes the callback function every time simple-keyboard is rendered (e.g: when you change layouts).</p>
</div>
</div>
</td>
<td>
</td>
</tr>
<tr data-ice="target">
<td>
<span class="access" data-ice="access">public</span>
<span class="override" data-ice="override"></span>
</td>
<td>
<div>
<p>
<span class="code" data-ice="name"><span><a href="class/src/lib/components/Keyboard.js~SimpleKeyboard.html#instance-method-removeButtonTheme">removeButtonTheme</a></span></span><span class="code" data-ice="signature">(buttons: <span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String">string</a></span>, className: <span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String">string</a></span>): <span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Boolean">boolean</a></span></span>
</p>
</div>
<div>
<div data-ice="description"><p>Removes/Amends an entry to the <code>buttonTheme</code>.</p>
</div>
</div>
</td>
<td>
</td>
</tr>
<tr data-ice="target">
<td>
<span class="access" data-ice="access">public</span>
<span class="override" data-ice="override"></span>
</td>
<td>
<div>
<p>
<span class="code" data-ice="name"><span><a href="class/src/lib/components/Keyboard.js~SimpleKeyboard.html#instance-method-render">render</a></span></span><span class="code" data-ice="signature">()</span>
</p>
</div>
<div>
<div data-ice="description"><p>Renders rows and buttons as per options</p>
</div>
</div>
</td>
<td>
</td>
</tr>
<tr data-ice="target">
<td>
<span class="access" data-ice="access">public</span>
<span class="override" data-ice="override"></span>
</td>
<td>
<div>
<p>
<span class="code" data-ice="name"><span><a href="class/src/lib/components/Keyboard.js~SimpleKeyboard.html#instance-method-replaceInput">replaceInput</a></span></span><span class="code" data-ice="signature">(inputObj: <span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object">object</a></span>)</span>
</p>
</div>
<div>
<div data-ice="description"><p>Replace the input object (<code>keyboard.input</code>)</p>
</div>
</div>
</td>
<td>
</td>
</tr>
<tr data-ice="target">
<td>
<span class="access" data-ice="access">public</span>
<span class="override" data-ice="override"></span>
</td>
<td>
<div>
<p>
<span class="code" data-ice="name"><span><a href="class/src/lib/components/Keyboard.js~SimpleKeyboard.html#instance-method-setInput">setInput</a></span></span><span class="code" data-ice="signature">(input: <span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String">string</a></span>, inputName: <span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String">string</a></span>)</span>
</p>
</div>
<div>
<div data-ice="description"><p>Set the keyboard’s input.</p>
</div>
</div>
</td>
<td>
</td>
</tr>
<tr data-ice="target">
<td>
<span class="access" data-ice="access">public</span>
<span class="override" data-ice="override"></span>
</td>
<td>
<div>
<p>
<span class="code" data-ice="name"><span><a href="class/src/lib/components/Keyboard.js~SimpleKeyboard.html#instance-method-syncInstanceInputs">syncInstanceInputs</a></span></span><span class="code" data-ice="signature">()</span>
</p>
</div>
<div>
<div data-ice="description"><p>Send a command to all simple-keyboard instances (if you have several instances).</p>
</div>
</div>
</td>
<td>
</td>
</tr>
</tbody>
</table>
</div>
<div data-ice="constructorDetails"><h2 data-ice="title">Public Constructors</h2>
<div class="detail" data-ice="detail">
<h3 data-ice="anchor" id="instance-constructor-constructor">
<span class="access" data-ice="access">public</span>
<span class="code" data-ice="name">constructor</span><span class="code" data-ice="signature">(params: <span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array">Array</a></span>)</span>
<span class="right-info">
<span data-ice="source"><span><a href="file/src/lib/components/Keyboard.js.html#lineNumber20">source</a></span></span>
</span>
</h3>
<div data-ice="description"><p>Creates an instance of SimpleKeyboard</p>
</div>
<div data-ice="properties"><div data-ice="properties">
<h4 data-ice="title">Params:</h4>
<table class="params">
<thead>
<tr><td>Name</td><td>Type</td><td>Attribute</td><td>Description</td></tr>
</thead>
<tbody>
<tr data-ice="property" data-depth="0">
<td data-ice="name" class="code" data-depth="0">params</td>
<td data-ice="type" class="code"><span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array">Array</a></span></td>
<td data-ice="appendix"></td>
<td data-ice="description"><p>If first parameter is a string, it is considered the container class. The second parameter is then considered the options object. If first parameter is an object, it is considered the options object.</p>
</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</div>
<div data-ice="memberDetails"><h2 data-ice="title">Public Members</h2>
<div class="detail" data-ice="detail">
<h3 data-ice="anchor" id="instance-member-buttonElements">
<span class="access" data-ice="access">public</span>
<span class="code" data-ice="name">buttonElements</span><span class="code" data-ice="signature">: <span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object">object</a></span></span>
<span class="right-info">
<span data-ice="source"><span><a href="file/src/lib/components/Keyboard.js.html#lineNumber123">source</a></span></span>
</span>
</h3>
<div data-ice="properties">
</div>
</div>
<div class="detail" data-ice="detail">
<h3 data-ice="anchor" id="instance-member-caretPosition">
<span class="access" data-ice="access">public</span>
<span class="code" data-ice="name">caretPosition</span><span class="code" data-ice="signature">: <span>*</span></span>
<span class="right-info">
<span data-ice="source"><span><a href="file/src/lib/components/Keyboard.js.html#lineNumber512">source</a></span></span>
</span>
</h3>
<div data-ice="description"><p>Only first instance should insall the caret handling events</p>
</div>
<div data-ice="properties">
</div>
</div>
<div class="detail" data-ice="detail">
<h3 data-ice="anchor" id="instance-member-getModuleProp">
<span class="access" data-ice="access">public</span>
<span class="code" data-ice="name">getModuleProp</span><span class="code" data-ice="signature">: <span>*</span></span>
<span class="right-info">
<span data-ice="source"><span><a href="file/src/lib/components/Keyboard.js.html#lineNumber634">source</a></span></span>
</span>
</h3>
<div data-ice="description"><p>Get module prop</p>
</div>
<div data-ice="properties">
</div>
</div>
<div class="detail" data-ice="detail">
<h3 data-ice="anchor" id="instance-member-getModulesList">
<span class="access" data-ice="access">public</span>
<span class="code" data-ice="name">getModulesList</span><span class="code" data-ice="signature">: <span>*</span></span>
<span class="right-info">
<span data-ice="source"><span><a href="file/src/lib/components/Keyboard.js.html#lineNumber644">source</a></span></span>
</span>
</h3>
<div data-ice="description"><p>getModulesList</p>
</div>
<div data-ice="properties">
</div>
</div>
<div class="detail" data-ice="detail">
<h3 data-ice="anchor" id="instance-member-holdInteractionTimeout">
<span class="access" data-ice="access">public</span>
<span class="code" data-ice="name">holdInteractionTimeout</span><span class="code" data-ice="signature">: <span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object">object</a></span></span>
<span class="right-info">
<span data-ice="source"><span><a href="file/src/lib/components/Keyboard.js.html#lineNumber274">source</a></span></span>
</span>
</h3>
<div data-ice="properties">
</div>
</div>
<div class="detail" data-ice="detail">
<h3 data-ice="anchor" id="instance-member-holdTimeout">
<span class="access" data-ice="access">public</span>
<span class="code" data-ice="name">holdTimeout</span><span class="code" data-ice="signature">: <span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object">object</a></span></span>
<span class="right-info">
<span data-ice="source"><span><a href="file/src/lib/components/Keyboard.js.html#lineNumber235">source</a></span></span>
</span>
</h3>
<div data-ice="properties">
</div>
</div>
<div class="detail" data-ice="detail">
<h3 data-ice="anchor" id="instance-member-initialized">
<span class="access" data-ice="access">public</span>
<span class="code" data-ice="name">initialized</span><span class="code" data-ice="signature">: <span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Boolean">boolean</a></span></span>
<span class="right-info">
<span data-ice="source"><span><a href="file/src/lib/components/Keyboard.js.html#lineNumber798">source</a></span></span>
</span>
</h3>
<div data-ice="description"><p>Ensures that onInit is only called once per instantiation</p>
</div>
<div data-ice="properties">
</div>
</div>
<div class="detail" data-ice="detail">
<h3 data-ice="anchor" id="instance-member-input">
<span class="access" data-ice="access">public</span>
<span class="code" data-ice="name">input</span><span class="code" data-ice="signature">: <span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object">object</a></span></span>
<span class="right-info">
<span data-ice="source"><span><a href="file/src/lib/components/Keyboard.js.html#lineNumber112">source</a></span></span>
</span>
</h3>
<div data-ice="description"><p>simple-keyboard uses a non-persistent internal input to keep track of the entered string (the variable <code>keyboard.input</code>).
This removes any dependency to input DOM elements. You can type and directly display the value in a div element, for example.</p>
</div>
<div data-ice="properties"><div data-ice="properties">
<h4 data-ice="title">Properties:</h4>
<table class="params">
<thead>
<tr><td>Name</td><td>Type</td><td>Attribute</td><td>Description</td></tr>
</thead>
<tbody>
<tr data-ice="property" data-depth="0">
<td data-ice="name" class="code" data-depth="0">default</td>
<td data-ice="type" class="code"><span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object">object</a></span></td>
<td data-ice="appendix"></td>
<td data-ice="description"><p>Default SimpleKeyboard internal input.</p>
</td>
</tr>
<tr data-ice="property" data-depth="0">
<td data-ice="name" class="code" data-depth="0">myInputName</td>
<td data-ice="type" class="code"><span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object">object</a></span></td>
<td data-ice="appendix"></td>
<td data-ice="description"><p>Example input that can be set through <code>options.inputName:"myInputName"</code>.</p>
</td>
</tr>
</tbody>
</table>
</div>
</div>
<div data-ice="example">
<h4>Example:</h4>
<div class="example-doc" data-ice="exampleDoc">
<pre class="prettyprint source-code"><code data-ice="exampleCode">// To get entered input
let input = keyboard.getInput();
// To clear entered input.
keyboard.clearInput();</code></pre>
</div>
</div>
</div>
<div class="detail" data-ice="detail">
<h3 data-ice="anchor" id="instance-member-isMouseHold">
<span class="access" data-ice="access">public</span>
<span class="code" data-ice="name">isMouseHold</span><span class="code" data-ice="signature">: <span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Boolean">boolean</a></span></span>
<span class="right-info">
<span data-ice="source"><span><a href="file/src/lib/components/Keyboard.js.html#lineNumber224">source</a></span></span>
</span>
</h3>
<div data-ice="properties">
</div>
</div>
<div class="detail" data-ice="detail">
<h3 data-ice="anchor" id="instance-member-keyboardDOM">
<span class="access" data-ice="access">public</span>
<span class="code" data-ice="name">keyboardDOM</span><span class="code" data-ice="signature">: <span>*</span></span>
<span class="right-info">
<span data-ice="source"><span><a href="file/src/lib/components/Keyboard.js.html#lineNumber35">source</a></span></span>
</span>
</h3>
<div data-ice="description"><p>Processing options</p>
</div>
<div data-ice="properties">
</div>
</div>
<div class="detail" data-ice="detail">
<h3 data-ice="anchor" id="instance-member-keyboardDOMClass">
<span class="access" data-ice="access">public</span>
<span class="code" data-ice="name">keyboardDOMClass</span><span class="code" data-ice="signature">: <span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String">string</a></span></span>
<span class="right-info">
<span data-ice="source"><span><a href="file/src/lib/components/Keyboard.js.html#lineNumber118">source</a></span></span>
</span>
</h3>
<div data-ice="properties">
</div>
</div>
<div class="detail" data-ice="detail">
<h3 data-ice="anchor" id="instance-member-keyboardPluginClasses">
<span class="access" data-ice="access">public</span>
<span class="code" data-ice="name">keyboardPluginClasses</span><span class="code" data-ice="signature">: <span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object">object</a></span></span>
<span class="right-info">
<span data-ice="source"><span><a href="file/src/lib/components/Keyboard.js.html#lineNumber71">source</a></span></span>
</span>
</h3>
<div data-ice="properties">
</div>
</div>
<div class="detail" data-ice="detail">
<h3 data-ice="anchor" id="instance-member-modules">
<span class="access" data-ice="access">public</span>
<span class="code" data-ice="name">modules</span><span class="code" data-ice="signature">: {}</span>
<span class="right-info">
<span data-ice="source"><span><a href="file/src/lib/components/Keyboard.js.html#lineNumber152">source</a></span></span>
</span>
</h3>
<div data-ice="description"><p>Modules</p>
</div>
<div data-ice="properties">
</div>
</div>
<div class="detail" data-ice="detail">
<h3 data-ice="anchor" id="instance-member-options">
<span class="access" data-ice="access">public</span>
<span class="code" data-ice="name">options</span><span class="code" data-ice="signature">: <span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object">object</a></span></span>
<span class="right-info">
<span data-ice="source"><span><a href="file/src/lib/components/Keyboard.js.html#lineNumber62">source</a></span></span>
</span>
</h3>
<div data-ice="properties"><div data-ice="properties">
<h4 data-ice="title">Properties:</h4>
<table class="params">
<thead>
<tr><td>Name</td><td>Type</td><td>Attribute</td><td>Description</td></tr>
</thead>
<tbody>
<tr data-ice="property" data-depth="0">
<td data-ice="name" class="code" data-depth="0">layout</td>
<td data-ice="type" class="code"><span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object">object</a></span></td>
<td data-ice="appendix"></td>
<td data-ice="description"><p>Modify the keyboard layout.</p>
</td>
</tr>
<tr data-ice="property" data-depth="0">
<td data-ice="name" class="code" data-depth="0">layoutName</td>
<td data-ice="type" class="code"><span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String">string</a></span></td>
<td data-ice="appendix"></td>
<td data-ice="description"><p>Specifies which layout should be used.</p>
</td>
</tr>
<tr data-ice="property" data-depth="0">
<td data-ice="name" class="code" data-depth="0">display</td>
<td data-ice="type" class="code"><span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object">object</a></span></td>
<td data-ice="appendix"></td>
<td data-ice="description"><p>Replaces variable buttons (such as {bksp}) with a human-friendly name (e.g.: “backspace”).</p>
</td>
</tr>
<tr data-ice="property" data-depth="0">
<td data-ice="name" class="code" data-depth="0">mergeDisplay</td>
<td data-ice="type" class="code"><span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Boolean">boolean</a></span></td>
<td data-ice="appendix"></td>
<td data-ice="description"><p>By default, when you set the display property, you replace the default one. This setting merges them instead.</p>
</td>
</tr>
<tr data-ice="property" data-depth="0">
<td data-ice="name" class="code" data-depth="0">theme</td>
<td data-ice="type" class="code"><span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String">string</a></span></td>
<td data-ice="appendix"></td>
<td data-ice="description"><p>A prop to add your own css classes to the keyboard wrapper. You can add multiple classes separated by a space.</p>
</td>
</tr>
<tr data-ice="property" data-depth="0">
<td data-ice="name" class="code" data-depth="0">buttonTheme</td>
<td data-ice="type" class="code"><span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array">Array</a></span></td>
<td data-ice="appendix"></td>
<td data-ice="description"><p>A prop to add your own css classes to one or several buttons.</p>
</td>
</tr>
<tr data-ice="property" data-depth="0">
<td data-ice="name" class="code" data-depth="0">debug</td>
<td data-ice="type" class="code"><span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Boolean">boolean</a></span></td>
<td data-ice="appendix"></td>
<td data-ice="description"><p>Runs a console.log every time a key is pressed. Displays the buttons pressed and the current input.</p>
</td>
</tr>
<tr data-ice="property" data-depth="0">
<td data-ice="name" class="code" data-depth="0">newLineOnEnter</td>
<td data-ice="type" class="code"><span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Boolean">boolean</a></span></td>
<td data-ice="appendix"></td>
<td data-ice="description"><p>Specifies whether clicking the “ENTER” button will input a newline (\n) or not.</p>
</td>
</tr>
<tr data-ice="property" data-depth="0">
<td data-ice="name" class="code" data-depth="0">tabCharOnTab</td>
<td data-ice="type" class="code"><span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Boolean">boolean</a></span></td>
<td data-ice="appendix"></td>
<td data-ice="description"><p>Specifies whether clicking the “TAB” button will input a tab character (\t) or not.</p>
</td>
</tr>
<tr data-ice="property" data-depth="0">
<td data-ice="name" class="code" data-depth="0">inputName</td>
<td data-ice="type" class="code"><span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String">string</a></span></td>
<td data-ice="appendix"></td>
<td data-ice="description"><p>Allows you to use a single simple-keyboard instance for several inputs.</p>
</td>
</tr>
<tr data-ice="property" data-depth="0">
<td data-ice="name" class="code" data-depth="0">maxLength</td>
<td data-ice="type" class="code"><span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Number">number</a></span></td>
<td data-ice="appendix"></td>
<td data-ice="description"><p>Restrains all of simple-keyboard inputs to a certain length. This should be used in addition to the input element’s maxlengthattribute.</p>
</td>
</tr>
<tr data-ice="property" data-depth="0">
<td data-ice="name" class="code" data-depth="0">maxLength</td>
<td data-ice="type" class="code"><span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object">object</a></span></td>
<td data-ice="appendix"></td>
<td data-ice="description"><p>Restrains simple-keyboard’s individual inputs to a certain length. This should be used in addition to the input element’s maxlengthattribute.</p>
</td>
</tr>
<tr data-ice="property" data-depth="0">
<td data-ice="name" class="code" data-depth="0">syncInstanceInputs</td>
<td data-ice="type" class="code"><span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Boolean">boolean</a></span></td>
<td data-ice="appendix"></td>
<td data-ice="description"><p>When set to true, this option synchronizes the internal input of every simple-keyboard instance.</p>
</td>
</tr>
<tr data-ice="property" data-depth="0">
<td data-ice="name" class="code" data-depth="0">physicalKeyboardHighlight</td>
<td data-ice="type" class="code"><span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Boolean">boolean</a></span></td>
<td data-ice="appendix"></td>
<td data-ice="description"><p>Enable highlighting of keys pressed on physical keyboard.</p>
</td>
</tr>
<tr data-ice="property" data-depth="0">
<td data-ice="name" class="code" data-depth="0">preventMouseDownDefault</td>
<td data-ice="type" class="code"><span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Boolean">boolean</a></span></td>
<td data-ice="appendix"></td>
<td data-ice="description"><p>Calling preventDefault for the mousedown events keeps the focus on the input.</p>
</td>
</tr>
<tr data-ice="property" data-depth="0">
<td data-ice="name" class="code" data-depth="0">physicalKeyboardHighlightTextColor</td>
<td data-ice="type" class="code"><span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String">string</a></span></td>
<td data-ice="appendix"></td>
<td data-ice="description"><p>Define the text color that the physical keyboard highlighted key should have.</p>
</td>
</tr>
<tr data-ice="property" data-depth="0">
<td data-ice="name" class="code" data-depth="0">physicalKeyboardHighlightBgColor</td>
<td data-ice="type" class="code"><span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String">string</a></span></td>
<td data-ice="appendix"></td>
<td data-ice="description"><p>Define the background color that the physical keyboard highlighted key should have.</p>
</td>
</tr>
<tr data-ice="property" data-depth="0">
<td data-ice="name" class="code" data-depth="0">onKeyPress</td>
<td data-ice="type" class="code"><span><span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Function">function</a></span><span>(button: <span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String">string</a></span>)</span>: <span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String">string</a></span></span></td>
<td data-ice="appendix"></td>
<td data-ice="description"><p>Executes the callback function on key press. Returns button layout name (i.e.: “{shift}”).</p>
</td>
</tr>
<tr data-ice="property" data-depth="0">
<td data-ice="name" class="code" data-depth="0">onChange</td>
<td data-ice="type" class="code"><span><span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Function">function</a></span><span>(input: <span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String">string</a></span>)</span>: <span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String">string</a></span></span></td>
<td data-ice="appendix"></td>
<td data-ice="description"><p>Executes the callback function on input change. Returns the current input’s string.</p>
</td>
</tr>
<tr data-ice="property" data-depth="0">
<td data-ice="name" class="code" data-depth="0">onRender</td>
<td data-ice="type" class="code"><span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Function">function</a></span></td>
<td data-ice="appendix"></td>
<td data-ice="description"><p>Executes the callback function every time simple-keyboard is rendered (e.g: when you change layouts).</p>
</td>
</tr>
<tr data-ice="property" data-depth="0">
<td data-ice="name" class="code" data-depth="0">onInit</td>
<td data-ice="type" class="code"><span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Function">function</a></span></td>
<td data-ice="appendix"></td>
<td data-ice="description"><p>Executes the callback function once simple-keyboard is rendered for the first time (on initialization).</p>
</td>
</tr>
<tr data-ice="property" data-depth="0">
<td data-ice="name" class="code" data-depth="0">onChangeAll</td>
<td data-ice="type" class="code"><span><span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Function">function</a></span><span>(inputs: <span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object">object</a></span>)</span>: <span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object">object</a></span></span></td>
<td data-ice="appendix"></td>
<td data-ice="description"><p>Executes the callback function on input change. Returns the input object with all defined inputs.</p>
</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
<div class="detail" data-ice="detail">
<h3 data-ice="anchor" id="instance-member-physicalKeyboardInterface">
<span class="access" data-ice="access">public</span>
<span class="code" data-ice="name">physicalKeyboardInterface</span><span class="code" data-ice="signature">: <span>*</span></span>
<span class="right-info">
<span data-ice="source"><span><a href="file/src/lib/components/Keyboard.js.html#lineNumber147">source</a></span></span>
</span>
</h3>
<div data-ice="description"><p>Physical Keyboard support</p>
</div>
<div data-ice="properties">
</div>
</div>
<div class="detail" data-ice="detail">
<h3 data-ice="anchor" id="instance-member-registerModule">
<span class="access" data-ice="access">public</span>
<span class="code" data-ice="name">registerModule</span><span class="code" data-ice="signature">: <span>*</span></span>
<span class="right-info">
<span data-ice="source"><span><a href="file/src/lib/components/Keyboard.js.html#lineNumber600">source</a></span></span>
</span>
</h3>
<div data-ice="description"><p>Register module</p>
</div>
<div data-ice="properties">
</div>
</div>
<div class="detail" data-ice="detail">
<h3 data-ice="anchor" id="instance-member-setOptions">
<span class="access" data-ice="access">public</span>
<span class="code" data-ice="name">setOptions</span><span class="code" data-ice="signature">(option: <span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object">object</a></span>): <span>*</span></span>
<span class="right-info">
<span data-ice="source"><span><a href="file/src/lib/components/Keyboard.js.html#lineNumber352">source</a></span></span>
</span>
</h3>
<div data-ice="description"><p>Set new option or modify existing ones after initialization. </p>
</div>
<div data-ice="properties">
</div>
</div>
<div class="detail" data-ice="detail">
<h3 data-ice="anchor" id="instance-member-utilities">
<span class="access" data-ice="access">public</span>
<span class="code" data-ice="name">utilities</span><span class="code" data-ice="signature">: <span>*</span></span>
<span class="right-info">
<span data-ice="source"><span><a href="file/src/lib/components/Keyboard.js.html#lineNumber30">source</a></span></span>
</span>
</h3>
<div data-ice="description"><p>Initializing Utilities</p>
</div>
<div data-ice="properties">
</div>
</div>
</div>
<div data-ice="methodDetails"><h2 data-ice="title">Public Methods</h2>
<div class="detail" data-ice="detail">
<h3 data-ice="anchor" id="instance-method-addButtonTheme">
<span class="access" data-ice="access">public</span>
<span class="code" data-ice="name">addButtonTheme</span><span class="code" data-ice="signature">(buttons: <span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String">string</a></span>, className: <span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String">string</a></span>): <span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Boolean">boolean</a></span></span>
<span class="right-info">
<span data-ice="source"><span><a href="file/src/lib/components/Keyboard.js.html#lineNumber388">source</a></span></span>
</span>
</h3>
<div data-ice="description"><p>Adds/Modifies an entry to the <code>buttonTheme</code>. Basically a way to add a class to a button.</p>
</div>
<div data-ice="properties"><div data-ice="properties">
<h4 data-ice="title">Params:</h4>
<table class="params">
<thead>
<tr><td>Name</td><td>Type</td><td>Attribute</td><td>Description</td></tr>
</thead>
<tbody>
<tr data-ice="property" data-depth="0">
<td data-ice="name" class="code" data-depth="0">buttons</td>
<td data-ice="type" class="code"><span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String">string</a></span></td>
<td data-ice="appendix"></td>
<td data-ice="description"><p>List of buttons to select (separated by a space).</p>
</td>
</tr>
<tr data-ice="property" data-depth="0">
<td data-ice="name" class="code" data-depth="0">className</td>
<td data-ice="type" class="code"><span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String">string</a></span></td>
<td data-ice="appendix"></td>
<td data-ice="description"><p>Classes to give to the selected buttons (separated by space).</p>
</td>
</tr>
</tbody>
</table>
</div>
</div>
<div class="return-params" data-ice="returnParams">
<h4>Return:</h4>
<table>
<tbody>
<tr>
<td class="return-type code" data-ice="returnType"><span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Boolean">boolean</a></span></td>
</tr>
</tbody>
</table>
<div data-ice="returnProperties">
</div>
</div>
</div>
<div class="detail" data-ice="detail">
<h3 data-ice="anchor" id="instance-method-caretEventHandler">
<span class="access" data-ice="access">public</span>
<span class="code" data-ice="name">caretEventHandler</span><span class="code" data-ice="signature">(event: <span>*</span>)</span>
<span class="right-info">
<span data-ice="source"><span><a href="file/src/lib/components/Keyboard.js.html#lineNumber535">source</a></span></span>
</span>
</h3>
<div data-ice="description"><p>Called by <span><a href="class/src/lib/components/Keyboard.js~SimpleKeyboard.html#instance-method-handleCaret">handleCaret</a></span> when an event that warrants a cursor position update is triggered</p>
</div>
<div data-ice="properties"><div data-ice="properties">
<h4 data-ice="title">Params:</h4>
<table class="params">
<thead>
<tr><td>Name</td><td>Type</td><td>Attribute</td><td>Description</td></tr>
</thead>
<tbody>
<tr data-ice="property" data-depth="0">
<td data-ice="name" class="code" data-depth="0">event</td>
<td data-ice="type" class="code"><span>*</span></td>
<td data-ice="appendix"></td>
<td data-ice="description"></td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
<div class="detail" data-ice="detail">
<h3 data-ice="anchor" id="instance-method-clear">
<span class="access" data-ice="access">public</span>
<span class="code" data-ice="name">clear</span><span class="code" data-ice="signature">()</span>
<span class="right-info">
<span data-ice="source"><span><a href="file/src/lib/components/Keyboard.js.html#lineNumber362">source</a></span></span>
</span>
</h3>
<div data-ice="description"><p>Remove all keyboard rows and reset keyboard values.
Used interally between re-renders.</p>
</div>
<div data-ice="properties">
</div>
</div>
<div class="detail" data-ice="detail">
<h3 data-ice="anchor" id="instance-method-clearInput">
<span class="access" data-ice="access">public</span>
<span class="code" data-ice="name">clearInput</span><span class="code" data-ice="signature">(inputName: <span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String">string</a></span>)</span>
<span class="right-info">
<span data-ice="source"><span><a href="file/src/lib/components/Keyboard.js.html#lineNumber297">source</a></span></span>
</span>
</h3>
<div data-ice="description"><p>Clear the keyboard’s input.</p>
</div>
<div data-ice="properties"><div data-ice="properties">
<h4 data-ice="title">Params:</h4>
<table class="params">
<thead>
<tr><td>Name</td><td>Type</td><td>Attribute</td><td>Description</td></tr>
</thead>
<tbody>
<tr data-ice="property" data-depth="0">
<td data-ice="name" class="code" data-depth="0">inputName</td>
<td data-ice="type" class="code"><span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String">string</a></span></td>
<td data-ice="appendix"><ul><li>optional</li></ul></td>
<td data-ice="description"><p>optional - the internal input to select</p>
</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
<div class="detail" data-ice="detail">
<h3 data-ice="anchor" id="instance-method-dispatch">
<span class="access" data-ice="access">public</span>
<span class="code" data-ice="name">dispatch</span><span class="code" data-ice="signature">(callback: <span><span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Function">function</a></span><span>(instance: <span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object">object</a></span>, key: <span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String">string</a></span>)</span></span>): <span>*</span></span>
<span class="right-info">
<span data-ice="source"><span><a href="file/src/lib/components/Keyboard.js.html#lineNumber372">source</a></span></span>
</span>
</h3>
<div data-ice="description"><p>Send a command to all simple-keyboard instances at once (if you have multiple instances).</p>
</div>
<div data-ice="properties"><div data-ice="properties">
<h4 data-ice="title">Params:</h4>
<table class="params">
<thead>
<tr><td>Name</td><td>Type</td><td>Attribute</td><td>Description</td></tr>
</thead>
<tbody>
<tr data-ice="property" data-depth="0">
<td data-ice="name" class="code" data-depth="0">callback</td>
<td data-ice="type" class="code"><span><span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Function">function</a></span><span>(instance: <span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object">object</a></span>, key: <span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String">string</a></span>)</span></span></td>
<td data-ice="appendix"></td>
<td data-ice="description"><p>Function to run on every instance</p>
</td>
</tr>
</tbody>
</table>
</div>
</div>
<div class="return-params" data-ice="returnParams">
<h4>Return:</h4>
<table>
<tbody>
<tr>
<td class="return-type code" data-ice="returnType"><span>*</span></td>
</tr>
</tbody>
</table>
<div data-ice="returnProperties">
</div>
</div>
</div>
<div class="detail" data-ice="detail">
<h3 data-ice="anchor" id="instance-method-getButtonElement">
<span class="access" data-ice="access">public</span>
<span class="code" data-ice="name">getButtonElement</span><span class="code" data-ice="signature">(button: <span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String">string</a></span>): <span>*</span></span>
<span class="right-info">
<span data-ice="source"><span><a href="file/src/lib/components/Keyboard.js.html#lineNumber490">source</a></span></span>
</span>
</h3>
<div data-ice="description"><p>Get the DOM Element of a button. If there are several buttons with the same name, an array of the DOM Elements is returned.</p>
</div>
<div data-ice="properties"><div data-ice="properties">
<h4 data-ice="title">Params:</h4>
<table class="params">
<thead>
<tr><td>Name</td><td>Type</td><td>Attribute</td><td>Description</td></tr>
</thead>
<tbody>
<tr data-ice="property" data-depth="0">
<td data-ice="name" class="code" data-depth="0">button</td>
<td data-ice="type" class="code"><span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String">string</a></span></td>
<td data-ice="appendix"></td>
<td data-ice="description"><p>The button layout name to select</p>
</td>
</tr>
</tbody>
</table>
</div>
</div>
<div class="return-params" data-ice="returnParams">
<h4>Return:</h4>
<table>
<tbody>
<tr>
<td class="return-type code" data-ice="returnType"><span>*</span></td>
</tr>
</tbody>
</table>
<div data-ice="returnProperties">
</div>
</div>
</div>
<div class="detail" data-ice="detail">
<h3 data-ice="anchor" id="instance-method-getInput">
<span class="access" data-ice="access">public</span>
<span class="code" data-ice="name">getInput</span><span class="code" data-ice="signature">(inputName: <span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String">string</a></span>): <span>*</span></span>
<span class="right-info">
<span data-ice="source"><span><a href="file/src/lib/components/Keyboard.js.html#lineNumber312">source</a></span></span>
</span>
</h3>
<div data-ice="description"><p>Get the keyboard’s input (You can also get it from the onChange prop).</p>
</div>
<div data-ice="properties"><div data-ice="properties">
<h4 data-ice="title">Params:</h4>
<table class="params">
<thead>
<tr><td>Name</td><td>Type</td><td>Attribute</td><td>Description</td></tr>
</thead>
<tbody>
<tr data-ice="property" data-depth="0">
<td data-ice="name" class="code" data-depth="0">inputName</td>
<td data-ice="type" class="code"><span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String">string</a></span></td>
<td data-ice="appendix"><ul><li>optional</li></ul></td>
<td data-ice="description"><p>optional - the internal input to select</p>
</td>
</tr>
</tbody>
</table>
</div>
</div>
<div class="return-params" data-ice="returnParams">
<h4>Return:</h4>
<table>
<tbody>
<tr>
<td class="return-type code" data-ice="returnType"><span>*</span></td>
</tr>
</tbody>
</table>
<div data-ice="returnProperties">
</div>
</div>
</div>
<div class="detail" data-ice="detail">
<h3 data-ice="anchor" id="instance-method-handleButtonClicked">
<span class="access" data-ice="access">public</span>
<span class="code" data-ice="name">handleButtonClicked</span><span class="code" data-ice="signature">(button: <span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String">string</a></span>): <span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Boolean">boolean</a></span></span>
<span class="right-info">
<span data-ice="source"><span><a href="file/src/lib/components/Keyboard.js.html#lineNumber160">source</a></span></span>
</span>
</h3>
<div data-ice="description"><p>Handles clicks made to keyboard buttons</p>
</div>
<div data-ice="properties"><div data-ice="properties">
<h4 data-ice="title">Params:</h4>
<table class="params">
<thead>
<tr><td>Name</td><td>Type</td><td>Attribute</td><td>Description</td></tr>
</thead>
<tbody>
<tr data-ice="property" data-depth="0">
<td data-ice="name" class="code" data-depth="0">button</td>
<td data-ice="type" class="code"><span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String">string</a></span></td>
<td data-ice="appendix"></td>
<td data-ice="description"><p>The button's layout name.</p>
</td>
</tr>
</tbody>
</table>
</div>
</div>
<div class="return-params" data-ice="returnParams">
<h4>Return:</h4>
<table>
<tbody>
<tr>
<td class="return-type code" data-ice="returnType"><span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Boolean">boolean</a></span></td>
</tr>
</tbody>
</table>
<div data-ice="returnProperties">
</div>
</div>
</div>
<div class="detail" data-ice="detail">
<h3 data-ice="anchor" id="instance-method-handleButtonHold">
<span class="access" data-ice="access">public</span>
<span class="code" data-ice="name">handleButtonHold</span><span class="code" data-ice="signature">(button: <span>*</span>)</span>
<span class="right-info">
<span data-ice="source"><span><a href="file/src/lib/components/Keyboard.js.html#lineNumber267">source</a></span></span>
</span>
</h3>
<div data-ice="description"><p>Handles button hold</p>
</div>
<div data-ice="properties"><div data-ice="properties">
<h4 data-ice="title">Params:</h4>
<table class="params">
<thead>
<tr><td>Name</td><td>Type</td><td>Attribute</td><td>Description</td></tr>
</thead>
<tbody>
<tr data-ice="property" data-depth="0">
<td data-ice="name" class="code" data-depth="0">button</td>
<td data-ice="type" class="code"><span>*</span></td>
<td data-ice="appendix"></td>
<td data-ice="description"></td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
<div class="detail" data-ice="detail">
<h3 data-ice="anchor" id="instance-method-handleButtonMouseDown">
<span class="access" data-ice="access">public</span>
<span class="code" data-ice="name">handleButtonMouseDown</span><span class="code" data-ice="signature">(button: <span>*</span>, e: <span>*</span>)</span>
<span class="right-info">
<span data-ice="source"><span><a href="file/src/lib/components/Keyboard.js.html#lineNumber220">source</a></span></span>
</span>
</h3>
<div data-ice="description"><p>Handles button mousedown</p>
</div>
<div data-ice="properties"><div data-ice="properties">
<h4 data-ice="title">Params:</h4>
<table class="params">
<thead>
<tr><td>Name</td><td>Type</td><td>Attribute</td><td>Description</td></tr>
</thead>
<tbody>
<tr data-ice="property" data-depth="0">
<td data-ice="name" class="code" data-depth="0">button</td>
<td data-ice="type" class="code"><span>*</span></td>
<td data-ice="appendix"></td>
<td data-ice="description"></td>
</tr>
<tr data-ice="property" data-depth="0">
<td data-ice="name" class="code" data-depth="0">e</td>
<td data-ice="type" class="code"><span>*</span></td>
<td data-ice="appendix"></td>
<td data-ice="description"></td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
<div class="detail" data-ice="detail">
<h3 data-ice="anchor" id="instance-method-handleButtonMouseUp">
<span class="access" data-ice="access">public</span>
<span class="code" data-ice="name">handleButtonMouseUp</span><span class="code" data-ice="signature">()</span>
<span class="right-info">
<span data-ice="source"><span><a href="file/src/lib/components/Keyboard.js.html#lineNumber257">source</a></span></span>
</span>
</h3>
<div data-ice="description"><p>Handles button mouseup</p>
</div>
<div data-ice="properties">
</div>
</div>
<div class="detail" data-ice="detail">
<h3 data-ice="anchor" id="instance-method-handleCaret">
<span class="access" data-ice="access">public</span>
<span class="code" data-ice="name">handleCaret</span><span class="code" data-ice="signature">()</span>
<span class="right-info">
<span data-ice="source"><span><a href="file/src/lib/components/Keyboard.js.html#lineNumber508">source</a></span></span>
</span>
</h3>
<div data-ice="description"><p>Retrieves the current cursor position within a input or textarea (if any)</p>
</div>
<div data-ice="properties">
</div>
</div>
<div class="detail" data-ice="detail">
<h3 data-ice="anchor" id="instance-method-loadModules">
<span class="access" data-ice="access">public</span>
<span class="code" data-ice="name">loadModules</span><span class="code" data-ice="signature">()</span>
<span class="right-info">
<span data-ice="source"><span><a href="file/src/lib/components/Keyboard.js.html#lineNumber610">source</a></span></span>
</span>
</h3>
<div data-ice="description"><p>Load modules</p>
</div>
<div data-ice="properties">
</div>
</div>
<div class="detail" data-ice="detail">
<h3 data-ice="anchor" id="instance-method-onInit">
<span class="access" data-ice="access">public</span>
<span class="code" data-ice="name">onInit</span><span class="code" data-ice="signature">()</span>
<span class="right-info">
<span data-ice="source"><span><a href="file/src/lib/components/Keyboard.js.html#lineNumber567">source</a></span></span>
</span>
</h3>
<div data-ice="description"><p>Executes the callback function once simple-keyboard is rendered for the first time (on initialization).</p>
</div>
<div data-ice="properties">
</div>
</div>
<div class="detail" data-ice="detail">
<h3 data-ice="anchor" id="instance-method-onModulesLoaded">
<span class="access" data-ice="access">public</span>
<span class="code" data-ice="name">onModulesLoaded</span><span class="code" data-ice="signature">()</span>
<span class="right-info">
<span data-ice="source"><span><a href="file/src/lib/components/Keyboard.js.html#lineNumber592">source</a></span></span>
</span>
</h3>
<div data-ice="description"><p>Executes the callback function once all modules have been loaded</p>
</div>
<div data-ice="properties">
</div>
</div>
<div class="detail" data-ice="detail">
<h3 data-ice="anchor" id="instance-method-onRender">
<span class="access" data-ice="access">public</span>
<span class="code" data-ice="name">onRender</span><span class="code" data-ice="signature">()</span>
<span class="right-info">
<span data-ice="source"><span><a href="file/src/lib/components/Keyboard.js.html#lineNumber584">source</a></span></span>
</span>
</h3>
<div data-ice="description"><p>Executes the callback function every time simple-keyboard is rendered (e.g: when you change layouts).</p>
</div>
<div data-ice="properties">
</div>
</div>
<div class="detail" data-ice="detail">
<h3 data-ice="anchor" id="instance-method-removeButtonTheme">
<span class="access" data-ice="access">public</span>
<span class="code" data-ice="name">removeButtonTheme</span><span class="code" data-ice="signature">(buttons: <span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String">string</a></span>, className: <span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String">string</a></span>): <span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Boolean">boolean</a></span></span>
<span class="right-info">
<span data-ice="source"><span><a href="file/src/lib/components/Keyboard.js.html#lineNumber438">source</a></span></span>
</span>
</h3>
<div data-ice="description"><p>Removes/Amends an entry to the <code>buttonTheme</code>. Basically a way to remove a class previously added to a button through buttonTheme or addButtonTheme.</p>
</div>
<div data-ice="properties"><div data-ice="properties">
<h4 data-ice="title">Params:</h4>
<table class="params">
<thead>
<tr><td>Name</td><td>Type</td><td>Attribute</td><td>Description</td></tr>
</thead>
<tbody>
<tr data-ice="property" data-depth="0">
<td data-ice="name" class="code" data-depth="0">buttons</td>
<td data-ice="type" class="code"><span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String">string</a></span></td>
<td data-ice="appendix"></td>
<td data-ice="description"><p>List of buttons to select (separated by a space).</p>
</td>
</tr>
<tr data-ice="property" data-depth="0">
<td data-ice="name" class="code" data-depth="0">className</td>
<td data-ice="type" class="code"><span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String">string</a></span></td>
<td data-ice="appendix"></td>
<td data-ice="description"><p>Classes to give to the selected buttons (separated by space).</p>
</td>
</tr>
</tbody>
</table>
</div>
</div>
<div class="return-params" data-ice="returnParams">
<h4>Return:</h4>
<table>
<tbody>
<tr>
<td class="return-type code" data-ice="returnType"><span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Boolean">boolean</a></span></td>
</tr>
</tbody>
</table>
<div data-ice="returnProperties">
</div>
</div>
</div>
<div class="detail" data-ice="detail">
<h3 data-ice="anchor" id="instance-method-render">
<span class="access" data-ice="access">public</span>
<span class="code" data-ice="name">render</span><span class="code" data-ice="signature">()</span>
<span class="right-info">
<span data-ice="source"><span><a href="file/src/lib/components/Keyboard.js.html#lineNumber651">source</a></span></span>
</span>
</h3>
<div data-ice="description"><p>Renders rows and buttons as per options</p>
</div>
<div data-ice="properties">
</div>
</div>
<div class="detail" data-ice="detail">
<h3 data-ice="anchor" id="instance-method-replaceInput">
<span class="access" data-ice="access">public</span>
<span class="code" data-ice="name">replaceInput</span><span class="code" data-ice="signature">(inputObj: <span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object">object</a></span>)</span>
<span class="right-info">
<span data-ice="source"><span><a href="file/src/lib/components/Keyboard.js.html#lineNumber344">source</a></span></span>
</span>
</h3>
<div data-ice="description"><p>Replace the input object (<code>keyboard.input</code>)</p>
</div>
<div data-ice="properties"><div data-ice="properties">
<h4 data-ice="title">Params:</h4>
<table class="params">
<thead>
<tr><td>Name</td><td>Type</td><td>Attribute</td><td>Description</td></tr>
</thead>
<tbody>
<tr data-ice="property" data-depth="0">
<td data-ice="name" class="code" data-depth="0">inputObj</td>
<td data-ice="type" class="code"><span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object">object</a></span></td>
<td data-ice="appendix"></td>
<td data-ice="description"><p>The input object</p>
</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
<div class="detail" data-ice="detail">
<h3 data-ice="anchor" id="instance-method-setInput">
<span class="access" data-ice="access">public</span>
<span class="code" data-ice="name">setInput</span><span class="code" data-ice="signature">(input: <span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String">string</a></span>, inputName: <span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String">string</a></span>)</span>
<span class="right-info">
<span data-ice="source"><span><a href="file/src/lib/components/Keyboard.js.html#lineNumber329">source</a></span></span>
</span>
</h3>
<div data-ice="description"><p>Set the keyboard’s input.</p>
</div>
<div data-ice="properties"><div data-ice="properties">
<h4 data-ice="title">Params:</h4>
<table class="params">
<thead>
<tr><td>Name</td><td>Type</td><td>Attribute</td><td>Description</td></tr>
</thead>
<tbody>
<tr data-ice="property" data-depth="0">
<td data-ice="name" class="code" data-depth="0">input</td>
<td data-ice="type" class="code"><span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String">string</a></span></td>
<td data-ice="appendix"></td>
<td data-ice="description"><p>the input value</p>
</td>
</tr>
<tr data-ice="property" data-depth="0">
<td data-ice="name" class="code" data-depth="0">inputName</td>
<td data-ice="type" class="code"><span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String">string</a></span></td>
<td data-ice="appendix"></td>
<td data-ice="description"><p>optional - the internal input to select</p>
</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
<div class="detail" data-ice="detail">
<h3 data-ice="anchor" id="instance-method-syncInstanceInputs">
<span class="access" data-ice="access">public</span>
<span class="code" data-ice="name">syncInstanceInputs</span><span class="code" data-ice="signature">()</span>
<span class="right-info">
<span data-ice="source"><span><a href="file/src/lib/components/Keyboard.js.html#lineNumber287">source</a></span></span>
</span>
</h3>
<div data-ice="description"><p>Send a command to all simple-keyboard instances (if you have several instances).</p>
</div>
<div data-ice="properties">
</div>
</div>
</div>
</div>
<footer class="footer">
Generated by <a href="https://esdoc.org">ESDoc<span data-ice="esdocVersion">(1.1.0)</span><img src="./image/esdoc-logo-mini-black.png"></a>
</footer>
<script src="script/search_index.js"></script>
<script src="script/search.js"></script>
<script src="script/pretty-print.js"></script>
<script src="script/inherited-summary.js"></script>
<script src="script/test-summary.js"></script>
<script src="script/inner-link.js"></script>
<script src="script/patch-for-local.js"></script>
</body>
</html>