diff options
| author | Shulhan <ms@kilabit.info> | 2021-09-11 00:02:13 +0700 |
|---|---|---|
| committer | Shulhan <ms@kilabit.info> | 2021-09-11 00:02:13 +0700 |
| commit | af17111480d41f4770c7129733817e0dfd2d4f7c (patch) | |
| tree | 1e23764116048c9a9b57a5a5958e2b4d8dfe98a2 /input/select.ts | |
| parent | e3da79cf1adfb6dc2d9fed2e982bcde7fe7a7161 (diff) | |
| download | pakakeh.ts-af17111480d41f4770c7129733817e0dfd2d4f7c.tar.xz | |
input: allow label to be HTMLElement instead of only string
A label on input can be a string or another HTMLElement.
Diffstat (limited to 'input/select.ts')
| -rw-r--r-- | input/select.ts | 16 |
1 files changed, 12 insertions, 4 deletions
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 = " ℹ" this.el_hint_toggler.onmouseover = () => { |