[myfaces-tobago] branch master updated: fix: listbox deselection

[hn...@apache.org]

This is an automated email from the ASF dual-hosted git repository.

hnoeth pushed a commit to branch master
in repository https://gitbox.apache.org/repos/asf/myfaces-tobago.git


The following commit(s) were added to refs/heads/master by this push:
     new 5a1ca43  fix: listbox deselection
5a1ca43 is described below

commit 5a1ca4369618c15a091b3127fa3742d93192226d
Author: Henning Noeth <hn...@apache.org>
AuthorDate: Sat Jan 30 14:56:14 2021 +0100

    fix: listbox deselection
    
    * tc:selectOneListbox (and tc:selectManyListbox) are now deselectable by mouse click
---
 .../npm/ts/tobago-select-one-listbox.ts            | 24 +++++++++++++++++++---
 1 file changed, 21 insertions(+), 3 deletions(-)

diff --git a/tobago-theme/tobago-theme-standard/npm/ts/tobago-select-one-listbox.ts b/tobago-theme/tobago-theme-standard/npm/ts/tobago-select-one-listbox.ts
index 756527c..0e679fe 100644
--- a/tobago-theme/tobago-theme-standard/npm/ts/tobago-select-one-listbox.ts
+++ b/tobago-theme/tobago-theme-standard/npm/ts/tobago-select-one-listbox.ts
@@ -15,21 +15,39 @@
  * limitations under the License.
  */
 
-import {DomUtils} from "./tobago-utils";
 import {Focus} from "./tobago-focus";
 
 export class SelectOneListbox extends HTMLElement {
+
+  private oldselectedIndex: number;
+
   constructor() {
     super();
   }
 
   connectedCallback(): void {
+    this.saveSelection();
+    this.field.addEventListener("click", this.clickSelection.bind(this));
     this.field.addEventListener("focus", Focus.setLastFocusId);
   }
 
-  get field(): HTMLInputElement {
+  private clickSelection(event: MouseEvent): void {
+    const select = event.currentTarget as HTMLSelectElement;
+
+    if (!select.required && this.field.selectedIndex === this.oldselectedIndex) {
+      this.field.selectedIndex = -1;
+    }
+
+    this.saveSelection();
+  }
+
+  private saveSelection(): void {
+    this.oldselectedIndex = this.field.selectedIndex;
+  }
+
+  get field(): HTMLSelectElement {
     const rootNode = this.getRootNode() as ShadowRoot | Document;
-    return rootNode.getElementById(this.id + "::field") as HTMLInputElement;
+    return rootNode.getElementById(this.id + "::field") as HTMLSelectElement;
   }
 }