fix(GovAlta#1957): date picker year selection not appearing

syedszeeshan · Jun 26, 2024 · 725d6a1 · 725d6a1
1 parent b23d6f9
commit 725d6a1
Showing 1 changed file with 11 additions and 9 deletions.
diff --git a/libs/web-components/src/components/dropdown/Dropdown.svelte b/libs/web-components/src/components/dropdown/Dropdown.svelte
@@ -137,7 +137,7 @@
   }
 
   function setSelected() {
-    _selectedOption = _options.find(o => o.value == _values[0])  
+    _selectedOption = _options.find((o) => o.value == _values[0]);
   }
 
   // parse and convert values to strings to avoid later type comparison issues
@@ -212,7 +212,9 @@
 
   function syncFilteredOptions() {
     _filteredOptions = _filterable
-      ? _options.filter((option) => isFilterMatch(option, _inputEl?.value ?? ""))
+      ? _options.filter((option) =>
+          isFilterMatch(option, _inputEl?.value ?? ""),
+        )
       : _options;
   }
 
@@ -263,7 +265,7 @@
 
   function onSelect(option: Option) {
     if (_disabled) return;
-  
+
     if (!_native) {
       hideMenu();
       _selectedOption = option;
@@ -355,7 +357,7 @@
 
     onEscape(e: KeyboardEvent) {
       reset();
-      // FIXME: on escape should allow the next tab click to move to the next element, currently 
+      // FIXME: on escape should allow the next tab click to move to the next element, currently
       // clicking tab after esc will refocus onto the Dropdown
 
       // _inputEl.focus();
@@ -564,7 +566,7 @@
             `}
             data-testid="input"
             bind:this={_inputEl}
-            value={_selectedOption?.label ?? _selectedOption?.value ?? ""}
+            value={_selectedOption?.label || _selectedOption?.value || ""}
             type="text"
             role="combobox"
             autocomplete="off"
@@ -638,8 +640,10 @@
             <!-- svelte-ignore a11y-click-events-have-key-events -->
             <li
               id={option.value}
-              aria-selected={_selectedOption?.value === (option.label || option.value)}
-              class:selected={_selectedOption?.value === (option.label || option.value)}
+              aria-selected={_selectedOption?.value ===
+                (option.label || option.value)}
+              class:selected={_selectedOption?.value ===
+                (option.label || option.value)}
               class="dropdown-item"
               class:dropdown-item--highlighted={index === _highlightedIndex}
               data-index={index}
@@ -688,7 +692,6 @@
     }
   }
 
-
   .dropdown-input-group {
     box-sizing: border-box;
     outline: none;
@@ -725,7 +728,6 @@
     }
   }
 
-
   .dropdown-icon--arrow,
   .dropdown-icon--clear {
     margin-right: var(--goa-space-s);