diff options
| author | Shulhan <ms@kilabit.info> | 2021-09-19 01:14:33 +0700 |
|---|---|---|
| committer | Shulhan <ms@kilabit.info> | 2021-09-19 01:17:00 +0700 |
| commit | 19994275a9f238dbbb2d73702bba355faaa12a0d (patch) | |
| tree | b7e6a8b90f0b2c4472a044f278f4b6199c49478f /input/example.ts | |
| parent | 0db6b1d2f83b19a929889df2108de20f4d522066 (diff) | |
| download | pakakeh.ts-19994275a9f238dbbb2d73702bba355faaa12a0d.tar.xz | |
input: add option "is_hint_toggled"
If the "is_hint_toggled" is true, the hint text will be displayed
by default on first render, instead of hidden.
While at it, add 2px to the top margin of the hint element to make it
separatable from the input element.
Diffstat (limited to 'input/example.ts')
| -rw-r--r-- | input/example.ts | 8 |
1 files changed, 6 insertions, 2 deletions
diff --git a/input/example.ts b/input/example.ts index 3855347..d0ea9c4 100644 --- a/input/example.ts +++ b/input/example.ts @@ -29,6 +29,7 @@ function exampleInputString() { value: "Hello, disabled input string", is_disabled: true, hint: "The input string is disabled", + is_hint_toggled: true, onChangeHandler: (v: string) => { el_out.innerText = v }, @@ -90,6 +91,7 @@ function exampleInputNumber() { value: 1000, hint: "Input number with 'is_disabled' set to true", is_disabled: true, + is_hint_toggled: true, onChangeHandler: (val: number) => { el_out.innerText = ""+val }, @@ -155,7 +157,8 @@ function exampleInputSelect() { selected: true, }, }, - hint: "Select on of the option to see the price.", + hint: "Select one of the option to see the price.", + is_hint_toggled: true, onChangeHandler: (key: string, value: string) => { el_log.innerText = `The select input changes to '${key}' with price '${value}'` }, @@ -217,8 +220,9 @@ function exampleInputCheckboxes() { selected: true, }, }, - hint: "Select fruits.", + hint: "Input select with 'is_disabled' and 'is_hint_toggled' is set to 'true'.", is_disabled: true, + is_hint_toggled: true, onChangeHandler: (values: string[]) => { el_log.innerText = `You are selecting ${values}` }, |