fix: set the outer div's props tabindex to -1, and when value change open the panel

packages/semi-foundation/autoComplete/foundation.ts

@@ -153,6 +153,9 @@ class AutoCompleteFoundation<P = Record<string, any>, S = Record<string, any>> e
         this._adapter.notifySearch(inputValue);
         this._adapter.notifyChange(inputValue);
         this._modifyFocusIndex(inputValue);
+        if (!this.isPanelOpen){
+            this.openDropdown();
+        }
     }
 
     handleSelect(option: StateOptionItem, optionIndex?: number): void {
@@ -389,7 +392,7 @@ class AutoCompleteFoundation<P = Record<string, any>, S = Record<string, any>> e
         if (!visible){
             this.openDropdown();
         } else {
-            if (focusIndex !== undefined  && focusIndex !== -1 && options.length !== 0) {
+            if (focusIndex !== undefined && focusIndex !== -1 && options.length !== 0) {
                 const visibleOptions = options.filter((item: StateOptionItem) => item.show);
                 const selectedOption = visibleOptions[focusIndex];
                 this.handleSelect(selectedOption, focusIndex);

packages/semi-ui/autoComplete/index.tsx

@@ -361,6 +361,8 @@ class AutoComplete<T extends AutoCompleteItems> extends BaseComponent<AutoComple
             ref: this.triggerRef,
             id,
             ...keyboardEventSet,
+            // tooltip give tabindex 0 to children by default, autoComplete just need the input get focus, so outer div's tabindex set to -1
+            tabIndex: -1
         };
 
         const innerProps = {