fix: Fixed when TreeSelect is disabled, clicking on the trigger would… (#2969)

* fix: Fixed when TreeSelect is disabled, clicking on the trigger would cause unexpected focus styles

* Update treeSelect.spec.js

---------

Co-authored-by: YannLynn <[email protected]>

cypress/e2e/treeSelect.spec.js

@@ -225,5 +225,12 @@ describe('treeSelect', () => {
         cy.get('.semi-tree-option-expand-icon').eq(0).trigger('click');
         cy.get('.semi-tree-option-label-text').eq(0).contains('Asia');
     })
+
+    it('disabled treeSelect can have focus border', () => {
+        cy.visit('http://127.0.0.1:6006/iframe.html?id=treeselect--fixed-2968');
+        cy.get('.semi-tree-select').focus();
+        // semi-tree-select 层级的元素的 border 应该存在，并且 border color 应该是 transparent
+        cy.get('.semi-tree-select').should('have.css', 'border-color', 'rgba(0, 0, 0, 0)');  
+    })
 });
 

packages/semi-foundation/treeSelect/treeSelect.scss

@@ -22,11 +22,11 @@ $module: #{$prefix}-tree-select;
         border: $width-treeSelect_hover-border solid $color-treeSelect_default-border-hover;
     }
 
-    &:focus {
-        border: $width-treeSelect_focus-border solid $color-treeSelect_default-border-focus;
-        background-color: $color-treeSelect_default-bg-focus;
-        outline: 0;
-    }
+    // &:focus {
+    //     border: $width-treeSelect_focus-border solid $color-treeSelect_default-border-focus;
+    //     background-color: $color-treeSelect_default-bg-focus;
+    //     outline: 0;
+    // }
 
     &:active{
         background-color: $color-treeSelect_default-bg-active;

packages/semi-ui/treeSelect/_story/treeSelect.stories.jsx

@@ -2994,4 +2994,18 @@ export const CustomExpandIcon = () => {
       />
     </>
   );
-}
+}
+
+export const Fixed2968 = () => {
+    return ( 
+        <>
+        <TreeSelect
+            disabled
+            style={{ width: 300 }}
+            dropdownStyle={{ maxHeight: 400, overflow: 'auto' }}
+            treeData={treeData1}
+            placeholder="请选择"
+        />
+        </>
+    );
+}