all: fix all linter warnings from tsc and eslint

In this changes we introduce eslint as our linter for TypeScript and
update our tsconfig to be more strict.

The ".eslintrc.yaml" and "tsconfig.json" is taken from golang/website
repository [1].

[1]: https://cs.opensource.google/go/x/website

10 files changed, 210 insertions, 211 deletions

diff --git a/input/checkboxes.d.ts b/input/checkboxes.d.ts
index dde0476..e0cced0 100644
--- a/input/checkboxes.d.ts
+++ b/input/checkboxes.d.ts
@@ -1,33 +1,33 @@
 import { WuiInputOption } from "./option.js";
 export interface WuiKeyValue {
-    [key: string]: string;
+  [key: string]: string;
 }
 export interface WuiKeySelectOption {
-    [key: string]: WuiInputOption;
+  [key: string]: WuiInputOption;
 }
 export interface WuiInputCheckboxesOpts {
-    label: string;
-    name: string;
-    options: WuiKeySelectOption;
-    id?: string;
-    hint?: string;
-    is_disabled?: boolean;
-    is_hint_toggled?: boolean;
-    onChangeHandler?: (values: string[]) => void;
+  label: string;
+  name: string;
+  options: WuiKeySelectOption;
+  id?: string;
+  hint?: string;
+  is_disabled?: boolean;
+  is_hint_toggled?: boolean;
+  onChangeHandler?: (values: string[]) => void;
 }
 export declare class WuiInputCheckboxes {
-    opts: WuiInputCheckboxesOpts;
-    el: HTMLElement;
-    private el_label;
-    private el_fieldset;
-    private el_hint;
-    private el_hint_toggler;
-    private values;
-    constructor(opts: WuiInputCheckboxesOpts);
-    private generateLabel;
-    private generateInput;
-    private generateHintToggler;
-    private generateHint;
-    private onClickHintToggler;
-    private onClickCheckbox;
+  opts: WuiInputCheckboxesOpts;
+  el: HTMLElement;
+  private el_label;
+  private el_fieldset;
+  private el_hint;
+  private el_hint_toggler;
+  private values;
+  constructor(opts: WuiInputCheckboxesOpts);
+  private generateLabel;
+  private generateInput;
+  private generateHintToggler;
+  private generateHint;
+  private onClickHintToggler;
+  private onClickCheckbox;
 }
diff --git a/input/checkboxes.ts b/input/checkboxes.ts
index 72d3da8..7226a7d 100644
--- a/input/checkboxes.ts
+++ b/input/checkboxes.ts
@@ -59,7 +59,7 @@ const WUI_INPUT_CHECKBOXES_CLASS_LABEL = "wui_input_checkboxes_label";
 //
 export class WuiInputCheckboxes {
   el: HTMLElement;
-  private el_label!: HTMLElement;
+  private elLabel!: HTMLElement;
   private el_fieldset!: HTMLFieldSetElement;
   private el_hint!: HTMLElement;
   private el_hint_toggler!: HTMLElement;
@@ -85,41 +85,39 @@ export class WuiInputCheckboxes {
   }
 
   private generateLabel(wrapper: HTMLElement) {
-    this.el_label = document.createElement("label");
-    this.el_label.classList.add(WUI_INPUT_CHECKBOXES_CLASS_LABEL);
-    this.el_label.innerHTML = `${this.opts.label} `;
-    wrapper.appendChild(this.el_label);
+    this.elLabel = document.createElement("label");
+    this.elLabel.classList.add(WUI_INPUT_CHECKBOXES_CLASS_LABEL);
+    this.elLabel.innerHTML = `${this.opts.label} `;
+    wrapper.appendChild(this.elLabel);
   }
 
   private generateInput(wrapper: HTMLElement) {
     this.el_fieldset = document.createElement("fieldset");
     this.el_fieldset.classList.add(WUI_INPUT_CHECKBOXES_CLASS_INPUT);
 
-    for (let key in this.opts.options) {
-      let option = this.opts.options[key];
-      let value = option.value;
+    Object.entries(this.opts.options).forEach(([key, option]) => {
+      const value = option.value;
+      const wrapper = document.createElement("div");
 
-      let wrapper = document.createElement("div");
-
-      let el_cb = document.createElement("input");
-      el_cb.type = "checkbox";
-      el_cb.name = this.opts.name;
-      el_cb.value = option.value;
+      const elCb = document.createElement("input");
+      elCb.type = "checkbox";
+      elCb.name = this.opts.name;
+      elCb.value = option.value;
       if (option.selected) {
-        el_cb.checked = true;
+        elCb.checked = true;
         this.values.push(value);
       }
-      el_cb.onclick = () => {
-        this.onClickCheckbox(el_cb.value, el_cb.checked);
+      elCb.onclick = () => {
+        this.onClickCheckbox(elCb.value, elCb.checked);
       };
-      wrapper.appendChild(el_cb);
+      wrapper.appendChild(elCb);
 
-      let el_label = document.createElement("label");
-      el_label.innerHTML = key;
-      wrapper.appendChild(el_label);
+      const elLabel = document.createElement("label");
+      elLabel.innerHTML = key;
+      wrapper.appendChild(elLabel);
 
       this.el_fieldset.appendChild(wrapper);
-    }
+    });
 
     if (this.opts.is_disabled) {
       this.el_fieldset.disabled = true;
diff --git a/input/example.ts b/input/example.ts
index 660ea20..2fbd5ad 100644
--- a/input/example.ts
+++ b/input/example.ts
@@ -7,13 +7,13 @@ import { WuiInputSelect, WuiInputSelectOpts } from "./select.js";
 import { WuiInputCheckboxes, WuiInputCheckboxesOpts } from "./checkboxes.js";
 
 function exampleInputString() {
-  let el_example = document.createElement("div");
+  const elExample = document.createElement("div");
 
-  let el_title = document.createElement("h3");
-  el_title.innerText = "Input string";
-  el_example.appendChild(el_title);
+  const elTitle = document.createElement("h3");
+  elTitle.innerText = "Input string";
+  elExample.appendChild(elTitle);
 
-  let el_out = document.createElement("span");
+  const elOut = document.createElement("span");
 
   let opts: WuiInputStringOpts = {
     id: "my_input_string",
@@ -21,11 +21,11 @@ function exampleInputString() {
     value: "Hello, input string",
     hint: "The input ID is 'my_input_string'",
     onChangeHandler: (v: string) => {
-      el_out.innerText = v;
+      elOut.innerText = v;
     },
   };
-  let el_input_string = new WuiInputString(opts);
-  el_example.appendChild(el_input_string.el);
+  let elInputString = new WuiInputString(opts);
+  elExample.appendChild(elInputString.el);
 
   opts = {
     label: "Input string disabled",
@@ -34,48 +34,48 @@ function exampleInputString() {
     hint: "The input string is disabled",
     is_hint_toggled: true,
     onChangeHandler: (v: string) => {
-      el_out.innerText = v;
+      elOut.innerText = v;
     },
   };
-  el_input_string = new WuiInputString(opts);
-  el_example.appendChild(el_input_string.el);
+  elInputString = new WuiInputString(opts);
+  elExample.appendChild(elInputString.el);
 
   opts = {
     label: "Input string without hint",
     value: "Hello, input string without hint",
     onChangeHandler: (v: string) => {
-      el_out.innerText = v;
+      elOut.innerText = v;
     },
   };
-  el_input_string = new WuiInputString(opts);
-  el_example.appendChild(el_input_string.el);
+  elInputString = new WuiInputString(opts);
+  elExample.appendChild(elInputString.el);
 
-  let el_out_label = document.createElement("div");
-  el_out_label.innerText = "Input string changes to ";
-  el_out_label.appendChild(el_out);
-  el_example.appendChild(el_out_label);
+  const elOutLabel = document.createElement("div");
+  elOutLabel.innerText = "Input string changes to ";
+  elOutLabel.appendChild(elOut);
+  elExample.appendChild(elOutLabel);
 
-  document.body.appendChild(el_example);
+  document.body.appendChild(elExample);
 }
 
 function exampleInputNumber() {
-  let el_example = document.createElement("div");
+  const elExample = document.createElement("div");
 
-  let el_title = document.createElement("h3");
-  el_title.innerText = "Input number";
-  el_example.appendChild(el_title);
+  const elTitle = document.createElement("h3");
+  elTitle.innerText = "Input number";
+  elExample.appendChild(elTitle);
 
-  let el_out = document.createElement("span");
+  const elOut = document.createElement("span");
 
   let opts: WuiInputNumberOpts = {
     label: "Input number",
     value: 1,
     onChangeHandler: (val: number) => {
-      el_out.innerText = "" + val;
+      elOut.innerText = "" + val;
     },
   };
-  let input_num = new WuiInputNumber(opts);
-  el_example.appendChild(input_num.el);
+  let inputNum = new WuiInputNumber(opts);
+  elExample.appendChild(inputNum.el);
 
   opts = {
     id: "my_input_number",
@@ -83,11 +83,11 @@ function exampleInputNumber() {
     value: 10,
     hint: "The ID for this input is 'my_input_number'",
     onChangeHandler: (val: number) => {
-      el_out.innerText = "" + val;
+      elOut.innerText = "" + val;
     },
   };
-  input_num = new WuiInputNumber(opts);
-  el_example.appendChild(input_num.el);
+  inputNum = new WuiInputNumber(opts);
+  elExample.appendChild(inputNum.el);
 
   opts = {
     label: "Input number disabled",
@@ -96,22 +96,22 @@ function exampleInputNumber() {
     is_disabled: true,
     is_hint_toggled: true,
     onChangeHandler: (val: number) => {
-      el_out.innerText = "" + val;
+      elOut.innerText = "" + val;
     },
   };
-  input_num = new WuiInputNumber(opts);
-  el_example.appendChild(input_num.el);
+  inputNum = new WuiInputNumber(opts);
+  elExample.appendChild(inputNum.el);
 
   opts = {
     label: "Input number with hint",
     value: 10000,
     hint: "This is the <b>hint</b>",
     onChangeHandler: (val: number) => {
-      el_out.innerText = "" + val;
+      elOut.innerText = "" + val;
     },
   };
-  input_num = new WuiInputNumber(opts);
-  el_example.appendChild(input_num.el);
+  inputNum = new WuiInputNumber(opts);
+  elExample.appendChild(inputNum.el);
 
   opts = {
     label: "Input number with max and min",
@@ -119,31 +119,31 @@ function exampleInputNumber() {
     max: 12,
     min: -20,
     onChangeHandler: (val: number) => {
-      el_out.innerText = "" + val;
+      elOut.innerText = "" + val;
     },
   };
-  input_num = new WuiInputNumber(opts);
-  el_example.appendChild(input_num.el);
+  inputNum = new WuiInputNumber(opts);
+  elExample.appendChild(inputNum.el);
 
-  let el_out_label = document.createElement("div");
-  el_out_label.innerText = "Input number changes to ";
-  el_out_label.appendChild(el_out);
-  el_example.appendChild(el_out_label);
+  const elOutLabel = document.createElement("div");
+  elOutLabel.innerText = "Input number changes to ";
+  elOutLabel.appendChild(elOut);
+  elExample.appendChild(elOutLabel);
 
-  document.body.appendChild(el_example);
+  document.body.appendChild(elExample);
 }
 
 function exampleInputSelect() {
-  let el_example = document.createElement("div");
-  document.body.appendChild(el_example);
+  const elExample = document.createElement("div");
+  document.body.appendChild(elExample);
 
-  let el_title = document.createElement("h3");
-  el_title.innerText = "Input select";
-  el_example.appendChild(el_title);
+  const elTitle = document.createElement("h3");
+  elTitle.innerText = "Input select";
+  elExample.appendChild(elTitle);
 
-  let el_log = document.createElement("div");
+  const elLog = document.createElement("div");
 
-  let opts: WuiInputSelectOpts = {
+  const opts: WuiInputSelectOpts = {
     name: "my_fruit_price",
     label: "Input select",
     options: {
@@ -163,23 +163,23 @@ function exampleInputSelect() {
     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}'`;
+      elLog.innerText = `The select input changes to '${key}' with price '${value}'`;
     },
   };
-  let input = new WuiInputSelect(opts);
-  el_example.appendChild(input.el);
-  el_example.appendChild(el_log);
+  const input = new WuiInputSelect(opts);
+  elExample.appendChild(input.el);
+  elExample.appendChild(elLog);
 }
 
 function exampleInputCheckboxes() {
-  let el_example = document.createElement("div");
-  document.body.appendChild(el_example);
+  const elExample = document.createElement("div");
+  document.body.appendChild(elExample);
 
-  let el_title = document.createElement("h3");
-  el_title.innerText = "Input checkboxes";
-  el_example.appendChild(el_title);
+  const elTitle = document.createElement("h3");
+  elTitle.innerText = "Input checkboxes";
+  elExample.appendChild(elTitle);
 
-  let el_log = document.createElement("div");
+  const elLog = document.createElement("div");
 
   let opts: WuiInputCheckboxesOpts = {
     name: "my_fruits",
@@ -200,11 +200,11 @@ function exampleInputCheckboxes() {
     },
     hint: "Select fruits.",
     onChangeHandler: (values: string[]) => {
-      el_log.innerText = `You are selecting ${values}`;
+      elLog.innerText = `You are selecting ${values}`;
     },
   };
   let input = new WuiInputCheckboxes(opts);
-  el_example.appendChild(input.el);
+  elExample.appendChild(input.el);
 
   opts = {
     name: "my_fruits",
@@ -227,13 +227,13 @@ function exampleInputCheckboxes() {
     is_disabled: true,
     is_hint_toggled: true,
     onChangeHandler: (values: string[]) => {
-      el_log.innerText = `You are selecting ${values}`;
+      elLog.innerText = `You are selecting ${values}`;
     },
   };
   input = new WuiInputCheckboxes(opts);
-  el_example.appendChild(input.el);
+  elExample.appendChild(input.el);
 
-  el_example.appendChild(el_log);
+  elExample.appendChild(elLog);
 }
 
 exampleInputString();
diff --git a/input/number.d.ts b/input/number.d.ts
index 34b4cf5..885f1cb 100644
--- a/input/number.d.ts
+++ b/input/number.d.ts
@@ -1,30 +1,30 @@
 export interface WuiInputNumberOpts {
-    label: string | HTMLElement;
-    value: number;
-    id?: string;
-    hint?: string;
-    max?: number;
-    min?: number;
-    class_label?: string;
-    class_input?: string;
-    is_disabled?: boolean;
-    is_hint_toggled?: boolean;
-    onChangeHandler: (new_value: number) => void;
+  label: string | HTMLElement;
+  value: number;
+  id?: string;
+  hint?: string;
+  max?: number;
+  min?: number;
+  class_label?: string;
+  class_input?: string;
+  is_disabled?: boolean;
+  is_hint_toggled?: boolean;
+  onChangeHandler: (new_value: number) => void;
 }
 export declare class WuiInputNumber {
-    opts: WuiInputNumberOpts;
-    el: HTMLElement;
-    private el_label;
-    private el_input;
-    private el_hint;
-    private el_hint_toggler;
-    private value;
-    constructor(opts: WuiInputNumberOpts);
-    private generateLabel;
-    private generateInput;
-    private generateHintToggler;
-    private generateHint;
-    private onClickHintToggler;
-    private onKeyUp;
-    Set(v: number): void;
+  opts: WuiInputNumberOpts;
+  el: HTMLElement;
+  private el_label;
+  private el_input;
+  private el_hint;
+  private el_hint_toggler;
+  private value;
+  constructor(opts: WuiInputNumberOpts);
+  private generateLabel;
+  private generateInput;
+  private generateHintToggler;
+  private generateHint;
+  private onClickHintToggler;
+  private onKeyUp;
+  Set(v: number): void;
 }
diff --git a/input/number.ts b/input/number.ts
index 0b59dbe..e5c22a1 100644
--- a/input/number.ts
+++ b/input/number.ts
@@ -67,7 +67,7 @@ export class WuiInputNumber {
     this.el.classList.add(WUI_INPUT_NUMBER_CLASS);
     this.el.style.padding = "2px";
 
-    let wrapper = document.createElement("div");
+    const wrapper = document.createElement("div");
     this.generateLabel(wrapper);
     this.generateInput(wrapper);
     if (opts.hint) {
@@ -151,7 +151,7 @@ export class WuiInputNumber {
   }
 
   private generateHint() {
-    let hint = this.opts.hint || "";
+    const hint = this.opts.hint || "";
 
     this.el_hint = document.createElement("div");
     this.el_hint.classList.add(WUI_INPUT_NUMBER_CLASS_HINT);
@@ -176,10 +176,10 @@ export class WuiInputNumber {
   }
 
   private onKeyUp(ev: KeyboardEvent) {
-    let target = ev.target as HTMLInputElement;
+    const target = ev.target as HTMLInputElement;
 
     ev.preventDefault();
-    let newValue = +target.value;
+    const newValue = +target.value;
     if (newValue === null) {
       this.el_input.style.backgroundColor = "lightsalmon";
       return false;
diff --git a/input/option.d.ts b/input/option.d.ts
index ac723d2..8077182 100644
--- a/input/option.d.ts
+++ b/input/option.d.ts
@@ -1,4 +1,4 @@
 export interface WuiInputOption {
-    value: string;
-    selected: boolean;
+  value: string;
+  selected: boolean;
 }
diff --git a/input/select.d.ts b/input/select.d.ts
index e92d82d..3f39184 100644
--- a/input/select.d.ts
+++ b/input/select.d.ts
@@ -1,37 +1,37 @@
 import { WuiInputOption } from "./option.js";
 export interface WuiKeyValue {
-    [key: string]: string;
+  [key: string]: string;
 }
 export interface WuiKeySelectOption {
-    [key: string]: WuiInputOption;
+  [key: string]: WuiInputOption;
 }
 export interface WuiInputSelectOpts {
-    label: string | HTMLElement;
-    name: string;
-    options: WuiKeySelectOption;
-    id?: string;
-    hint?: string;
-    class_label?: string;
-    class_input?: string;
-    is_disabled?: boolean;
-    is_hint_toggled?: boolean;
-    onChangeHandler?: (key: string, value: string) => void;
+  label: string | HTMLElement;
+  name: string;
+  options: WuiKeySelectOption;
+  id?: string;
+  hint?: string;
+  class_label?: string;
+  class_input?: string;
+  is_disabled?: boolean;
+  is_hint_toggled?: boolean;
+  onChangeHandler?: (key: string, value: string) => void;
 }
 export declare class WuiInputSelect {
-    opts: WuiInputSelectOpts;
-    el: HTMLElement;
-    private el_label;
-    private el_input;
-    private el_hint;
-    private el_hint_toggler;
-    private value_key;
-    private value;
-    constructor(opts: WuiInputSelectOpts);
-    private generateLabel;
-    private generateInput;
-    private generateHintToggler;
-    private generateHint;
-    private onClickHintToggler;
-    private onClickInput;
-    Set(v: string): void;
+  opts: WuiInputSelectOpts;
+  el: HTMLElement;
+  private el_label;
+  private el_input;
+  private el_hint;
+  private el_hint_toggler;
+  private value_key;
+  private value;
+  constructor(opts: WuiInputSelectOpts);
+  private generateLabel;
+  private generateInput;
+  private generateHintToggler;
+  private generateHint;
+  private onClickHintToggler;
+  private onClickInput;
+  Set(v: string): void;
 }
diff --git a/input/select.ts b/input/select.ts
index 6bf4810..e874a29 100644
--- a/input/select.ts
+++ b/input/select.ts
@@ -73,7 +73,7 @@ export class WuiInputSelect {
     this.el.classList.add(WUI_INPUT_SELECT_CLASS);
     this.el.style.padding = "2px";
 
-    let wrapper = document.createElement("div");
+    const wrapper = document.createElement("div");
     this.generateLabel(wrapper);
     this.generateInput(wrapper);
     if (opts.hint) {
@@ -109,21 +109,19 @@ export class WuiInputSelect {
       this.el_input.classList.add(this.opts.class_input);
     }
 
-    for (let key in this.opts.options) {
-      let option = this.opts.options[key];
-
-      let el_option = document.createElement("option");
-      el_option.value = option.value;
-      el_option.innerHTML = key;
+    Object.entries(this.opts.options).forEach(([key, option]) => {
+      const elOption = document.createElement("option");
+      elOption.value = option.value;
+      elOption.innerHTML = key;
 
       if (option.selected) {
-        el_option.selected = true;
+        elOption.selected = true;
       }
 
-      this.el_input.appendChild(el_option);
+      this.el_input.appendChild(elOption);
 
       this.value_key[option.value] = key;
-    }
+    });
 
     if (this.opts.is_disabled) {
       this.el_input.disabled = true;
@@ -182,12 +180,15 @@ export class WuiInputSelect {
       return false;
     }
 
-    let value = this.el_input.value;
-    let key = this.value_key[value];
+    const value = this.el_input.value;
     if (this.value !== value) {
-      this.opts.onChangeHandler(key, value);
-      this.value = value;
+      const key = this.value_key[value];
+      if (key) {
+        this.opts.onChangeHandler(key, value);
+        this.value = value;
+      }
     }
+    return true;
   }
 
   // Set the input value.
diff --git a/input/string.d.ts b/input/string.d.ts
index 747c4c6..e1b73ff 100644
--- a/input/string.d.ts
+++ b/input/string.d.ts
@@ -1,27 +1,27 @@
 export interface WuiInputStringOpts {
-    label: string | HTMLElement;
-    value: string;
-    id?: string;
-    hint?: string;
-    class_label?: string;
-    class_input?: string;
-    is_disabled?: boolean;
-    is_hint_toggled?: boolean;
-    onChangeHandler?: (new_value: string) => void;
+  label: string | HTMLElement;
+  value: string;
+  id?: string;
+  hint?: string;
+  class_label?: string;
+  class_input?: string;
+  is_disabled?: boolean;
+  is_hint_toggled?: boolean;
+  onChangeHandler?: (new_value: string) => void;
 }
 export declare class WuiInputString {
-    opts: WuiInputStringOpts;
-    el: HTMLElement;
-    private el_label;
-    private el_input;
-    private el_hint;
-    private el_hint_toggler;
-    private value;
-    constructor(opts: WuiInputStringOpts);
-    private generateLabel;
-    private generateInput;
-    private generateHintToggler;
-    private generateHint;
-    private onClickHintToggler;
-    Set(v: string): void;
+  opts: WuiInputStringOpts;
+  el: HTMLElement;
+  private el_label;
+  private el_input;
+  private el_hint;
+  private el_hint_toggler;
+  private value;
+  constructor(opts: WuiInputStringOpts);
+  private generateLabel;
+  private generateInput;
+  private generateHintToggler;
+  private generateHint;
+  private onClickHintToggler;
+  Set(v: string): void;
 }
diff --git a/input/string.ts b/input/string.ts
index d428c32..f37a68f 100644
--- a/input/string.ts
+++ b/input/string.ts
@@ -62,7 +62,7 @@ export class WuiInputString {
     this.el.classList.add(WUI_INPUT_STRING_CLASS);
     this.el.style.padding = "2px";
 
-    let wrapper = document.createElement("div");
+    const wrapper = document.createElement("div");
     this.generateLabel(wrapper);
     this.generateInput(wrapper);
     if (opts.hint) {
@@ -104,7 +104,7 @@ export class WuiInputString {
     }
 
     if (this.opts.onChangeHandler) {
-      this.el_input.onkeyup = (ev: Event) => {
+      this.el_input.onkeyup = () => {
         if (this.opts.onChangeHandler) {
           if (this.value !== this.el_input.value) {
             this.opts.onChangeHandler(this.el_input.value);