LS25001091 - fix: AML focus on first element

packages/ketchup/src/components.d.ts

@@ -3202,6 +3202,10 @@ export namespace Components {
         "selectable": boolean;
         "setBlur": () => Promise<void>;
         "setFocus": () => Promise<void>;
+        /**
+          * Focuses the first element of the list.
+         */
+        "setFocusOnFirstEl": () => Promise<void>;
         /**
           * Sets the props to the component.
           * @param props - Object containing props that will be set to the component.

packages/ketchup/src/components/kup-autocomplete/kup-autocomplete.tsx

@@ -509,6 +509,7 @@ export class KupAutocomplete {
         const topOffset = hasError || hasAlert ? -20 : 0;
         this.#textfieldWrapper.classList.add('toggled');
         this.#listEl.menuVisible = true;
+        this.#listEl.setFocusOnFirstEl();
         const elStyle = this.#listEl.style;
         elStyle.height = 'auto';
         elStyle.minWidth = this.#textfieldWrapper.clientWidth + 'px';

packages/ketchup/src/components/kup-list/kup-list.tsx

@@ -202,6 +202,14 @@ export class KupList {
     /*           P u b l i c   M e t h o d s           */
     /*-------------------------------------------------*/
 
+    /**
+     * Focuses the first element of the list.
+     */
+    @Method()
+    async setFocusOnFirstEl() {
+        this.focused = 0;
+    }
+
     /**
      * Focuses the next element of the list.
      */

packages/ketchup/src/components/kup-list/readme.md

@@ -125,6 +125,16 @@ Type: `Promise<void>`
 
 
 
+### `setFocusOnFirstEl() => Promise<void>`
+
+Focuses the first element of the list.
+
+#### Returns
+
+Type: `Promise<void>`
+
+
+
 ### `setProps(props: GenericObject) => Promise<void>`
 
 Sets the props to the component.