Style - select placeholder inactive

[pointhalo]

中文模板 / Chinese Template

• I have read and followed Pull Request Guidelines of the contributing guide.

What kind of change does this PR introduce? (check at least one)

• Bugfix
• Feature
• Code style update
• Refactor
• Test Case
• TypeScript definition update
• Document improve
• CI/CD improve
• Branch sync
• Other, please describe:

PR description

如下 Demo，点击选项然后点击 clearIcon后，state中的 showInput状态不正确，导致 placeholder 的 text 依然激活了 .semi-select-selection-text-inactive样式，opactiy为0.4，没有正确恢复到点击前的状态。
Ps：为了更明显观测到现象，这里覆盖了一下样式。

import React from 'react';
import { Select } from '@douyinfe/semi-ui';
() => {
  const data = [
    {
      label: 'Asia',
      children: [
        { value: 'a-1', label: 'China' },
        { value: 'a-2', label: 'Koera' },
      ]
    },
    {
      label: 'Europe',
      children: [
        { value: 'b-1', label: 'Germany' },
        { value: 'b-2', label: 'France' },
      ]
    },
    {
      label: 'South America',
      children: [
        { value: 'c-1', label: 'Peru' },
      ]
    }
  ];
  return (
    <> 
    <Select showClear placeholder="请选择" style={{ width: 180 }} filter>
      {
        data.map((group, index) => (
          <Select.OptGroup label={group.label} key={`${index}-${group.label}`}>
            {
              group.children.map((option, index2) => (
                <Select.Option value={option.value} key={`${index2}-${group.label}`}>
                  {option.label}
                </Select.Option>
              ))
            }
          </Select.OptGroup>
        ))
      }
    </Select>
    </>
  );
};

Changelog

🇨🇳 Chinese

• Style: 修复 Select 在 filter、showClear 开启，点击 clearIcon 且失焦后，placeholder 透明度不正确的问题

---

🇺🇸 English

• Style: Fix the issue where the placeholder transparency of Select is incorrect after filter and showClear are enabled, clearIcon is clicked, and the input loses focus.

Checklist

• Test or no need
• Document or no need
• Changelog or no need

Other

• Skip Changelog

Additional information

[codesandbox-ci]

This pull request is automatically built and testable in CodeSandbox.

To see build info of the built libraries, click here or the icon next to each commit SHA.

Latest deployment of this branch, based on commit 9951be9:

Sandbox	Source
pr-story	Configuration

[cypress]

semi-design    Run #2899

Run Properties:   Passed #2899  •  3c567edb9b ℹ️: Merge 9951be9b13fc6f5571c96bbf1d8cf6cdf15c54c3 into 37f1045d269228634e0815a677c8...

Project	semi-design
Branch Review	style-selectPlaceholderInactive
Run status	Passed #2899
Run duration	07m 42s
Commit	3c567edb9b ℹ️: Merge 9951be9b13fc6f5571c96bbf1d8cf6cdf15c54c3 into 37f1045d269228634e0815a677c8...
Committer	pointhalo
View all properties for this run ↗︎

---

Test results
Failures	0
Flaky	0
Pending	11
Skipped	0
Passing	267
⚠️ You've recorded test results over your free plan limit. Upgrade your plan to view test results.
View all changes introduced in this branch ↗︎

[pointhalo]

复现条件

• filter为true、showClear为true，且设置了 placeholder

原因

选中有值，点击 x后 input 会聚焦

此时再点击空白处，input失焦(仅在某些情况下负责更新 state.showInput)，Trigger也失焦了（handleTriggerBlur负责更新 state.isFocus），但是 state中的 inputValue 依然为true，导致这里的 className会为true

修复思路

this.handleInputBlur 中增加判断，input失焦后，如果 state.showInput 为true，那么应该将其改为false (input失焦后，input理论上也不需要再渲染出来，当需要时，trigger会负责更新 showInput 控制它出现)

    handleInputBlur(e: any) {
        const { filter, autoFocus } = this.getProps();
+      const { showInput } = this.getStates();
        const isMultiple = this._isMultiple();
        if (filter && !isMultiple ) {
-            if (autoFocus) {
+            if (showInput || autoFocus) {
                this.toggle2SearchInput(false);
            }
        }
    }

[cypress]

semi-design    Run #2901

Run Properties:   Passed #2901  •  92c65837a6: style: fix select placeholder inactive still remain when blur (#2547)

Project	semi-design
Branch Review	main
Run status	Passed #2901
Run duration	07m 36s
Commit	92c65837a6: style: fix select placeholder inactive still remain when blur (#2547)
Committer	pointhalo
View all properties for this run ↗︎

---

Test results
Failures	0
Flaky	0
Pending	11
Skipped	0
Passing	267
View all changes introduced in this branch ↗︎