fix: [select] remove option focus style when hover slot (#1370)

* fix: [select] remove option focus style when hover slot

packages/semi-foundation/select/foundation.ts

@@ -1114,4 +1114,9 @@ export default class SelectFoundation extends BaseFoundation<SelectAdapter> {
     handlePopoverClose() {
         this._adapter.emit('popoverClose');
     }
+
+    // need to remove focus style of option when user hover slot
+    handleSlotMouseEnter() {
+        this._adapter.updateFocusIndex(-1);
+    }
 }

packages/semi-ui/select/index.tsx

@@ -894,7 +894,7 @@ class Select extends BaseComponent<SelectProps, SelectState> {
                 ref={this.setOptionContainerEl} 
                 onKeyDown={e => this.foundation.handleContainerKeyDown(e)}
             >
-                {outerTopSlot}
+                {outerTopSlot ? <div className={`${prefixcls}-option-list-outer-top-slot`} onMouseEnter={() => this.foundation.handleSlotMouseEnter()}>{outerTopSlot}</div> : null }
                 <div
                     style={{ maxHeight: `${maxHeight}px` }}
                     className={optionListCls}
@@ -902,11 +902,11 @@ class Select extends BaseComponent<SelectProps, SelectState> {
                     aria-multiselectable={multiple}
                     onScroll={e => this.foundation.handleListScroll(e)}
                 >
-                    {innerTopSlot}
+                    {innerTopSlot ? <div className={`${prefixcls}-option-list-inner-top-slot`} onMouseEnter={() => this.foundation.handleSlotMouseEnter()}>{innerTopSlot}</div> : null }
                     {loading ? this.renderLoading() : isEmpty ? this.renderEmpty() : listContent}
-                    {innerBottomSlot}
+                    {innerBottomSlot ? <div className={`${prefixcls}-option-list-inner-bottom-slot`} onMouseEnter={() => this.foundation.handleSlotMouseEnter()}>{innerBottomSlot}</div> : null }
                 </div>
-                {outerBottomSlot}
+                {outerBottomSlot ? <div className={`${prefixcls}-option-list-outer-bottom-slot`} onMouseEnter={() => this.foundation.handleSlotMouseEnter()}>{outerBottomSlot}</div> : null }
             </div>
         );
     }