Skip to main content
Module

x/tui/src/components/mod.ts>Input

🦕 Deno module for creating Terminal User Interfaces
Im-Beast/deno_tui
Go to Latest
class Input
extends Box
import { Input } from "https://deno.land/x/tui@2.1.4/src/components/mod.ts";

Component for creating interactive text input

This component is 1 character high only!

If you need multiline input use TextBox component.

Examples

Example 1

new Input({
 parent: tui,
 placeholder: "type here",
 theme: {
   base: crayon.bgGreen,
   focused: crayon.bgLightGreen,
   active: crayon.bgYellow,
 },
 rectangle: {
   column: 1,
   row: 1,
   width: 10,
 },
 zIndex: 0,
});

It supports validating input, e.g. number input would look like this:

Example 2

new Input({
 ...,
 validator: /\d+/,
});

You can also define whether text should be censored with * character by specifying password property.

Example 3

new Input({
 ...,
 password: true,
});

If you need to use emojis or other multi codepoint characters set multiCodePointSupport property to true.

Example 4

new Input({
 ...,
 placeholder: "🧡",
 multiCodePointCharacter: true,
});

Constructors

new
Input(options: InputOptions)

Properties

cursorPosition: Signal<number>
drawnObjects: { box: BoxObject; text: TextObject; cursor: TextObject; }
multiCodePointSupport: Signal<boolean>
password: Signal<boolean>
placeholder: Signal<string | undefined>
text: Signal<string>
theme: InputTheme
validator: Signal<RegExp | undefined>

Methods

draw(): void
interact(method: "keyboard" | "mouse"): void