aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
Diffstat
-rw-r--r--input/number.d.ts2
-rw-r--r--input/number.ts20
-rw-r--r--input/select.d.ts2
-rw-r--r--input/select.ts16
-rw-r--r--input/string.d.ts2
-rw-r--r--input/string.ts33
6 files changed, 55 insertions, 20 deletions
diff --git a/input/number.d.ts b/input/number.d.ts
index cbf847a..654b7e3 100644
--- a/input/number.d.ts
+++ b/input/number.d.ts
@@ -1,5 +1,5 @@
export interface WuiInputNumberOpts {
- label: string;
+ label: string | HTMLElement;
value: number;
id?: string;
hint?: string;
diff --git a/input/number.ts b/input/number.ts
index 11e561b..e2d1bc5 100644
--- a/input/number.ts
+++ b/input/number.ts
@@ -1,5 +1,5 @@
export interface WuiInputNumberOpts {
- label: string
+ label: string | HTMLElement
value: number
id?: string
hint?: string
@@ -24,7 +24,9 @@ const WUI_INPUT_NUMBER_CLASS_LABEL = "wui_input_number_label"
//
// <div [id=${id}] class="${WUI_INPUT_NUMBER_CLASS}">
// <div>
-// <label class="${WUI_INPUT_NUMBER_CLASS_LABEL}">${label}</label>
+// <label class="${WUI_INPUT_NUMBER_CLASS_LABEL}">
+// ${label} | HTMLElement
+// </label>
// <input
// class="${WUI_INPUT_NUMBER_CLASS_INPUT}"
// [max=${max}]
@@ -75,12 +77,18 @@ export class WuiInputNumber {
private generateLabel(wrapper: HTMLElement) {
this.el_label = document.createElement("label")
this.el_label.classList.add(WUI_INPUT_NUMBER_CLASS_LABEL)
- this.el_label.innerHTML = `${this.opts.label} `
+ if (typeof this.opts.label === "string") {
+ this.el_label.innerHTML = `${this.opts.label} `
+ } else {
+ this.el_label.appendChild(this.opts.label)
+ }
wrapper.appendChild(this.el_label)
}
private generateInput(wrapper: HTMLElement) {
- this.el_input = document.createElement("input") as HTMLInputElement
+ this.el_input = document.createElement(
+ "input",
+ ) as HTMLInputElement
this.el_input.classList.add(WUI_INPUT_NUMBER_CLASS_INPUT)
this.el_input.type = "number"
this.el_input.value = "" + this.opts.value
@@ -117,7 +125,9 @@ export class WuiInputNumber {
private generateHintToggler(wrapper: HTMLElement) {
this.el_hint_toggler = document.createElement("span")
- this.el_hint_toggler.classList.add(WUI_INPUT_NUMBER_CLASS_HINT_TOGGLER)
+ this.el_hint_toggler.classList.add(
+ WUI_INPUT_NUMBER_CLASS_HINT_TOGGLER,
+ )
this.el_hint_toggler.innerHTML = " &#x2139;"
this.el_hint_toggler.onmouseover = () => {
diff --git a/input/select.d.ts b/input/select.d.ts
index 6a568f3..88f1faa 100644
--- a/input/select.d.ts
+++ b/input/select.d.ts
@@ -6,7 +6,7 @@ export interface WuiKeySelectOption {
[key: string]: WuiInputOption;
}
export interface WuiInputSelectOpts {
- label: string;
+ label: string | HTMLElement;
name: string;
options: WuiKeySelectOption;
id?: string;
diff --git a/input/select.ts b/input/select.ts
index 1989c06..df6f450 100644
--- a/input/select.ts
+++ b/input/select.ts
@@ -9,7 +9,7 @@ export interface WuiKeySelectOption {
}
export interface WuiInputSelectOpts {
- label: string
+ label: string | HTMLElement
name: string
options: WuiKeySelectOption
id?: string
@@ -31,7 +31,9 @@ const WUI_INPUT_SELECT_CLASS_LABEL = "wui_input_select_label"
//
// <div [id=${id}] class="${WUI_INPUT_SELECT_CLASS}">
// <div>
-// <label class="${WUI_INPUT_SELECT_CLASS_LABEL}">${label}</label>
+// <label class="${WUI_INPUT_SELECT_CLASS_LABEL}">
+// ${label} | HTMLElement
+// </label>
// <select
// name=${name}
// class="${WUI_INPUT_SELECT_CLASS_INPUT}"
@@ -83,7 +85,11 @@ export class WuiInputSelect {
private generateLabel(wrapper: HTMLElement) {
this.el_label = document.createElement("label")
this.el_label.classList.add(WUI_INPUT_SELECT_CLASS_LABEL)
- this.el_label.innerHTML = `${this.opts.label} `
+ if (typeof this.opts.label === "string") {
+ this.el_label.innerHTML = `${this.opts.label} `
+ } else {
+ this.el_label.appendChild(this.opts.label)
+ }
wrapper.appendChild(this.el_label)
}
@@ -125,7 +131,9 @@ export class WuiInputSelect {
private generateHintToggler(wrapper: HTMLElement) {
this.el_hint_toggler = document.createElement("span")
- this.el_hint_toggler.classList.add(WUI_INPUT_SELECT_CLASS_HINT_TOGGLER)
+ this.el_hint_toggler.classList.add(
+ WUI_INPUT_SELECT_CLASS_HINT_TOGGLER,
+ )
this.el_hint_toggler.innerHTML = " &#x2139;"
this.el_hint_toggler.onmouseover = () => {
diff --git a/input/string.d.ts b/input/string.d.ts
index f0a36fe..a47f90d 100644
--- a/input/string.d.ts
+++ b/input/string.d.ts
@@ -1,5 +1,5 @@
export interface WuiInputStringOpts {
- label: string;
+ label: string | HTMLElement;
value: string;
id?: string;
hint?: string;
diff --git a/input/string.ts b/input/string.ts
index d8faf36..680c3a4 100644
--- a/input/string.ts
+++ b/input/string.ts
@@ -1,5 +1,5 @@
export interface WuiInputStringOpts {
- label: string
+ label: string | HTMLElement
value: string
id?: string
hint?: string
@@ -21,7 +21,9 @@ const WUI_INPUT_STRING_CLASS_LABEL = "wui_input_string_label"
//
// <div [id=${id}] class="${WUI_INPUT_STRING_CLASS}">
// <div>
-// <label class="${WUI_INPUT_STRING_CLASS_LABEL}">${label}</label>
+// <label class="${WUI_INPUT_STRING_CLASS_LABEL}">
+// ${label} | HTMLElement
+// </label>
// <input
// class="${WUI_INPUT_STRING_CLASS_INPUT}"
// [disabled=${is_disabled}]
@@ -72,12 +74,19 @@ export class WuiInputString {
private generateLabel(wrapper: HTMLElement) {
this.el_label = document.createElement("label")
this.el_label.classList.add(WUI_INPUT_STRING_CLASS_LABEL)
- this.el_label.innerHTML = `${this.opts.label} `
+
+ if (typeof this.opts.label === "string") {
+ this.el_label.innerHTML = `${this.opts.label} `
+ } else {
+ this.el_label.appendChild(this.opts.label)
+ }
wrapper.appendChild(this.el_label)
}
private generateInput(wrapper: HTMLElement) {
- this.el_input = document.createElement("input") as HTMLInputElement
+ this.el_input = document.createElement(
+ "input",
+ ) as HTMLInputElement
this.el_input.classList.add(WUI_INPUT_STRING_CLASS_INPUT)
this.el_input.value = "" + this.opts.value
@@ -89,9 +98,15 @@ export class WuiInputString {
console.log("register onchange")
this.el_input.onkeyup = (ev: Event) => {
if (this.opts.onChangeHandler) {
- if (this.value !== this.el_input.value) {
- this.opts.onChangeHandler(this.el_input.value)
- this.value = this.el_input.value
+ if (
+ this.value !==
+ this.el_input.value
+ ) {
+ this.opts.onChangeHandler(
+ this.el_input.value,
+ )
+ this.value =
+ this.el_input.value
}
}
}
@@ -102,7 +117,9 @@ export class WuiInputString {
private generateHintToggler(wrapper: HTMLElement) {
this.el_hint_toggler = document.createElement("span")
- this.el_hint_toggler.classList.add(WUI_INPUT_STRING_CLASS_HINT_TOGGLER)
+ this.el_hint_toggler.classList.add(
+ WUI_INPUT_STRING_CLASS_HINT_TOGGLER,
+ )
this.el_hint_toggler.innerHTML = " &#x2139;"
this.el_hint_toggler.onmouseover = () => {
generated by cgit v1.3 (git 2.53.0) at 2026-04-15 04:08:12 +0000