fix: review

sbb-design-systems · Mar 28, 2024 · 1276487 · 1276487
1 parent e26e72e
commit 1276487
Show file tree

Hide file tree

Showing 3 changed files with 22 additions and 37 deletions.
diff --git a/src/components/autocomplete-grid/autocomplete-grid-option/autocomplete-grid-option.ts b/src/components/autocomplete-grid/autocomplete-grid-option/autocomplete-grid-option.ts
@@ -79,25 +79,6 @@ export class SbbAutocompleteGridOptionElement extends SbbOptionBaseElement {
     this.setSelectedViaUserInteraction(true);
   }
 
-  protected setupHighlightHandler(event: Event): void {
-    const slotNodes = (event.target as HTMLSlotElement).assignedNodes();
-    const labelNodes = slotNodes.filter((el) => el.nodeType === Node.TEXT_NODE) as Text[];
-
-    // Disable the highlight if the slot contains more than just text nodes
-    if (
-      labelNodes.length === 0 ||
-      slotNodes.filter((n) => !(n instanceof Element) || n.localName !== 'template').length !==
-        labelNodes.length
-    ) {
-      this.disableLabelHighlight = true;
-      return;
-    }
-    this.label = labelNodes
-      .map((l) => l.wholeText)
-      .filter((l) => l.trim())
-      .join();
-  }
-
   protected override render(): TemplateResult {
     return super.render();
   }

diff --git a/src/components/core/common-behaviors/option-base-element.ts b/src/components/core/common-behaviors/option-base-element.ts
@@ -59,7 +59,7 @@ export abstract class SbbOptionBaseElement extends SbbDisabledMixin(SbbIconNameM
 
   private _abort = new ConnectedAbortController(this);
   protected abstract selectByClick(event: MouseEvent): void;
-  protected abstract setupHighlightHandler(event: Event): void;
+  // protected abstract setupHighlightHandler(event: Event): void;
   protected abstract setAttributeFromParent(): void;
 
   /**
@@ -126,6 +126,25 @@ export abstract class SbbOptionBaseElement extends SbbDisabledMixin(SbbIconNameM
     }
   }
 
+  protected setupHighlightHandler(event: Event): void {
+    const slotNodes = (event.target as HTMLSlotElement).assignedNodes();
+    const labelNodes = slotNodes.filter((el) => el.nodeType === Node.TEXT_NODE) as Text[];
+
+    // Disable the highlight if the slot contains more than just text nodes
+    if (
+      labelNodes.length === 0 ||
+      slotNodes.filter((n) => !(n instanceof Element) || n.localName !== 'template').length !==
+        labelNodes.length
+    ) {
+      this.disableLabelHighlight = true;
+      return;
+    }
+    this.label = labelNodes
+      .map((l) => l.wholeText)
+      .filter((l) => l.trim())
+      .join();
+  }
+
   protected getHighlightedLabel(): TemplateResult {
     if (!this._highlightString || !this._highlightString.trim()) {
       return html`${this.label}`;

diff --git a/src/components/option/option/option.ts b/src/components/option/option/option.ts
@@ -102,28 +102,13 @@ export class SbbOptionElement extends SbbOptionBaseElement {
     }
   }
 
-  protected setupHighlightHandler(event: Event): void {
+  protected override setupHighlightHandler(event: Event): void {
     if (!this._isAutocomplete) {
       this.disableLabelHighlight = true;
       return;
     }
 
-    const slotNodes = (event.target as HTMLSlotElement).assignedNodes();
-    const labelNodes = slotNodes.filter((el) => el.nodeType === Node.TEXT_NODE) as Text[];
-
-    // Disable the highlight if the slot contains more than just text nodes
-    if (
-      labelNodes.length === 0 ||
-      slotNodes.filter((n) => !(n instanceof Element) || n.localName !== 'template').length !==
-        labelNodes.length
-    ) {
-      this.disableLabelHighlight = true;
-      return;
-    }
-    this.label = labelNodes
-      .map((l) => l.wholeText)
-      .filter((l) => l.trim())
-      .join();
+    super.setupHighlightHandler(event);
   }
 
   protected override renderIcon(): TemplateResult {