aboutsummaryrefslogtreecommitdiff
path: root/input/example.ts
diff options
context:
space:
mode:
Diffstat (limited to 'input/example.ts')
-rw-r--r--input/example.ts66
1 files changed, 66 insertions, 0 deletions
diff --git a/input/example.ts b/input/example.ts
index f6a0647..1ca5736 100644
--- a/input/example.ts
+++ b/input/example.ts
@@ -1,6 +1,7 @@
import { WuiInputString, WuiInputStringOpts } from "./string.js"
import { WuiInputNumber, WuiInputNumberOpts } from "./number.js"
import { WuiInputSelect, WuiInputSelectOpts } from "./select.js"
+import { WuiInputCheckboxes, WuiInputCheckboxesOpts } from "./checkboxes.js"
function exampleInputString() {
let el_example = document.createElement("div")
@@ -149,6 +150,71 @@ function exampleInputSelect() {
el_example.appendChild(el_log)
}
+function exampleInputCheckboxes() {
+ let el_example = document.createElement("div")
+ document.body.appendChild(el_example)
+
+ let el_title = document.createElement("h3")
+ el_title.innerText = "Input checkboxes"
+ el_example.appendChild(el_title)
+
+ let el_log = document.createElement("div")
+
+ let opts: WuiInputCheckboxesOpts = {
+ name: "my_fruits",
+ label: "Input checkboxes",
+ options: {
+ mango: {
+ value: "1000",
+ selected: false,
+ },
+ papaya: {
+ value: "200",
+ selected: false,
+ },
+ rambutan: {
+ value: "100",
+ selected: true,
+ },
+ },
+ hint: "Select fruits.",
+ onChangeHandler: (values: string[]) => {
+ el_log.innerText = `You are selecting ${values}`
+ },
+ }
+ let input = new WuiInputCheckboxes(opts)
+ el_example.appendChild(input.el)
+
+ opts = {
+ name: "my_fruits",
+ label: "Input checkboxes",
+ options: {
+ mango: {
+ value: "1000",
+ selected: false,
+ },
+ papaya: {
+ value: "200",
+ selected: false,
+ },
+ rambutan: {
+ value: "100",
+ selected: true,
+ },
+ },
+ hint: "Select fruits.",
+ is_disabled: true,
+ onChangeHandler: (values: string[]) => {
+ el_log.innerText = `You are selecting ${values}`
+ },
+ }
+ input = new WuiInputCheckboxes(opts)
+ el_example.appendChild(input.el)
+
+ el_example.appendChild(el_log)
+}
+
exampleInputString()
exampleInputNumber()
exampleInputSelect()
+exampleInputCheckboxes()