From 10380099e6a3fd793feea68164d49f48d9875bda Mon Sep 17 00:00:00 2001 From: Armno Date: Wed, 28 Nov 2018 11:20:32 +0700 Subject: [PATCH] add more types --- src/lib/@types/index.d.ts | 255 ++++++++++++++++++++------------------ 1 file changed, 135 insertions(+), 120 deletions(-) diff --git a/src/lib/@types/index.d.ts b/src/lib/@types/index.d.ts index 0cc55e51..3e4dbe24 100644 --- a/src/lib/@types/index.d.ts +++ b/src/lib/@types/index.d.ts @@ -1,6 +1,129 @@ -declare module "simple-keyboard" { - class SimpleKeyboard { - constructor(selector: string, options: SimpleKeyboardOptions); +declare module 'simple-keyboard' { + interface KeyboardLayoutObject { + default: string[]; + shift?: string[]; + } + + interface KeyboardButtonTheme { + class: string; + buttons: string; + } + + export interface KeyboardOptions { + /** + * Modify the keyboard layout. + */ + layout?: KeyboardLayoutObject; + + /** + * Specifies which layout should be used. + */ + layoutName?: string; + + /** + * Replaces variable buttons (such as `{bksp}`) with a human-friendly name (e.g.: `backspace`). + */ + display?: { [button: string]: string }; + + /** + * By default, when you set the display property, you replace the default one. This setting merges them instead. + */ + mergeDisplay?: boolean; + + /** + * A prop to add your own css classes to the keyboard wrapper. You can add multiple classes separated by a space. + */ + theme?: string; + + /** + * A prop to add your own css classes to one or several buttons. + */ + buttonTheme?: KeyboardButtonTheme[]; + + /** + * Runs a `console.log` every time a key is pressed. Displays the buttons pressed and the current input. + */ + debug?: boolean; + + /** + * Specifies whether clicking the "ENTER" button will input a newline (`\n`) or not. + */ + newLineOnEnter?: boolean; + + /** + * Specifies whether clicking the "TAB" button will input a tab character (`\t`) or not. + */ + tabCharOnTab?: boolean; + + /** + * Allows you to use a single simple-keyboard instance for several inputs. + */ + inputName?: string; + + /** + * `number`: Restrains all of simple-keyboard inputs to a certain length. This should be used in addition to the input element’s maxlengthattribute. + * + * `{ [inputName: string]: number }`: Restrains simple-keyboard’s individual inputs to a certain length. This should be used in addition to the input element’s maxlengthattribute. + */ + maxLength?: + | number + | { + [inputName: string]: number; + }; + + /** + * When set to true, this option synchronizes the internal input of every simple-keyboard instance. + */ + syncInstanceInputs?: boolean; + + /** + * Enable highlighting of keys pressed on physical keyboard. + */ + physicalKeyboardHighlight?: boolean; + + /** + * Calling preventDefault for the mousedown events keeps the focus on the input. + */ + preventMouseDownDefault?: boolean; + + /** + * Define the text color that the physical keyboard highlighted key should have. + */ + physicalKeyboardHighlightTextColor?: string; + + /** + * Define the background color that the physical keyboard highlighted key should have. + */ + physicalKeyboardHighlightBgColor?: string; + + /** + * Executes the callback function on key press. Returns button layout name (i.e.: "{shift}"). + */ + onKeyPress?: (button: string) => string; + + /** + * Executes the callback function on input change. Returns the current input's string. + */ + onChange?: (input: string) => string; + + /** + * Executes the callback function every time simple-keyboard is rendered (e.g: when you change layouts). + */ + onRender?: () => void; + + /** + * Executes the callback function once simple-keyboard is rendered for the first time (on initialization). + */ + onInit?: () => void; + + /** + * Executes the callback function on input change. Returns the input object with all defined inputs. + */ + onChangeAll?: (inputs: any) => any; + } + + export class Keyboard { + constructor(selector: string, options: KeyboardOptions); /** * Adds/Modifies an entry to the `buttonTheme`. Basically a way to add a class to a button. @@ -17,29 +140,30 @@ declare module "simple-keyboard" { removeButtonTheme(buttons: string, className: string): void; /** - * Clear the keyboard’s input. + * Clear the keyboard's input. + * * @param {string} [inputName] optional - the internal input to select */ - clearInput(inputName: string): void; + clearInput(inputName?: string): void; /** * Get the keyboard’s input (You can also get it from the onChange prop). * @param {string} [inputName] optional - the internal input to select */ - getInput(inputName: string): void; + getInput(inputName?: string): void; /** * Set the keyboard’s input. * @param {string} input the input value * @param {string} inputName optional - the internal input to select */ - setInput(input: string, inputName: string): void; + setInput(input: string, inputName?: string): void; /** * Set new option or modify existing ones after initialization. - * @param {SimpleKeyboardOptions} option The option to set + * @param {KeyboardOptions} option The option to set */ - setOptions(options: SimpleKeyboardOptions): void; + setOptions(options: KeyboardOptions): void; /** * Send a command to all simple-keyboard instances at once (if you have multiple instances). @@ -51,117 +175,8 @@ declare module "simple-keyboard" { * Get the DOM Element of a button. If there are several buttons with the same name, an array of the DOM Elements is returned. * @param {string} button The button layout name to select */ - getButtonElement(button: string); + getButtonElement(button: string): void; } - interface SimpleKeyboardOptions { - /** - * Modify the keyboard layout. - */ - layout: any; - - /** - * Specifies which layout should be used. - */ - layoutName: string; - - /** - * Replaces variable buttons (such as {bksp}) with a human-friendly name (e.g.: “backspace”). - */ - display: any; - - /** - * By default, when you set the display property, you replace the default one. This setting merges them instead. - */ - mergeDisplay: boolean; - - /** - * A prop to add your own css classes to the keyboard wrapper. You can add multiple classes separated by a space. - */ - theme: string; - - /** - * A prop to add your own css classes to one or several buttons. - */ - buttonTheme: any[]; - - /** - * Runs a console.log every time a key is pressed. Displays the buttons pressed and the current input. - */ - debug: boolean; - - /** - * Specifies whether clicking the “ENTER” button will input a newline (\n) or not. - */ - newLineOnEnter: boolean; - - /** - * Specifies whether clicking the “TAB” button will input a tab character (\t) or not. - */ - tabCharOnTab: boolean; - - /** - * Allows you to use a single simple-keyboard instance for several inputs. - */ - inputName: string; - - /** - * number: Restrains all of simple-keyboard inputs to a certain length. This should be used in addition to the input element’s maxlengthattribute. - * any: Restrains simple-keyboard’s individual inputs to a certain length. This should be used in addition to the input element’s maxlengthattribute. - */ - // @TODO: specify type for `any`; - maxLength: number | any; - - /** - * When set to true, this option synchronizes the internal input of every simple-keyboard instance. - */ - syncInstanceInputs: boolean; - - /** - * Enable highlighting of keys pressed on physical keyboard. - */ - physicalKeyboardHighlight: boolean; - - /** - * Calling preventDefault for the mousedown events keeps the focus on the input. - */ - preventMouseDownDefault: boolean; - - /** - * Define the text color that the physical keyboard highlighted key should have. - */ - physicalKeyboardHighlightTextColor: string; - - /** - * Define the background color that the physical keyboard highlighted key should have. - */ - physicalKeyboardHighlightBgColor: string; - - /** - * Executes the callback function on key press. Returns button layout name (i.e.: “{shift}”). - */ - onKeyPress: (button: string) => string; - - /** - * Executes the callback function on input change. Returns the current input’s string. - */ - onChange: (input: string) => string; - - /** - * Executes the callback function every time simple-keyboard is rendered (e.g: when you change layouts). - */ - onRender: () => any; - - /** - * Executes the callback function once simple-keyboard is rendered for the first time (on initialization). - */ - onInit: () => any; - - /** - * Executes the callback function on input change. Returns the input object with all defined inputs. - */ - onChangeAll: (inputs: any) => any; - } - - export default SimpleKeyboard; + export default Keyboard; }