fix: [Transfer] Fixed Transfer in Popover causing Popover to close wh…

[YyumeiZhang]

…en dragged

中文模板 / 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

Fixes #1149 #1226

Changelog

🇨🇳 Chinese

• Fix: 修复 Popover 中的 Transfer 在拖拽时导致 Popover 意外关闭问题 [BUG] Popover 中的 Transfer 无法拖拽排序 #1226
• Fix: 修复弹出层中的 Transfer/ TagInput 在拖拽时被拖拽项消失问题 [BUG] Transfer用在弹出层组件中， 可拖拽 item 在被拖拽时会消失 #1149

---

🇺🇸 English

• Fix: fix Transfer in Popover caused Popover to close unexpectedly when dragging [BUG] Popover 中的 Transfer 无法拖拽排序 #1226
• Fix: fix the dragged item disappears when the Transfer/ TagInput in the pop-up layer is dragged [BUG] Transfer用在弹出层组件中， 可拖拽 item 在被拖拽时会消失 #1149

Checklist

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

Other

• Skip Changelog

Additional information

1. 修复 Popover 中的 Transfer 在拖拽时导致 Popover 意外关闭问题:
   Transfer原来将 SortableItem 和 SortableList定义在 render 相关的函数中，导致在点击拖拽 handler icon 时候，弹层挂载在 window 上的 mouseDown 事件中（semi-ui/tooltip/index）判断该点击的位置在非trigger 且非弹出层内部，因此关闭弹出层。弹出层关闭后，鼠标松开，正在被拖拽的 item （helper）走放下的逻辑，由于弹出层已经消失，此时会导致 helper找不到父元素，报TypeError错误
   
   修改方法：将 SortableItem 和 SortableList 放在 Transfer 外部进行定义， 参考Cannot read property 'removeChild' of null clauderic/react-sortable-hoc#549

2. 修复弹出层中的 Transfer/ TagInput 在拖拽时被拖拽项消失问题
   参考https://github.com/clauderic/react-sortable-hoc/issues/87， 通过 SortableList 的 helperClass 参数设置正在被拖拽元素的 helper（克隆的被拖拽 item）的样式，使得其 z-index高于 semi 中的所有弹出层的 z-index

[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 409917a:

Sandbox	Source
pr-story	Configuration
Semi Design: Simple Story	Configuration
elated-pond-hipd1e	Issue #1149

[codecov-commenter]

Codecov Report

Base: 88.82% // Head: 88.81% // Decreases project coverage by -0.01% ⚠️

Coverage data is based on head (409917a) compared to base (f5a753a).
Patch coverage: 87.50% of modified lines in pull request are covered.

Additional details and impacted files

@@            Coverage Diff             @@
##             main    #1247      +/-   ##
==========================================
- Coverage   88.82%   88.81%   -0.02%     
==========================================
  Files         429      429              
  Lines       24327    24328       +1     
  Branches     6048     6048              
==========================================
- Hits        21609    21606       -3     
- Misses       2718     2722       +4     

Impacted Files	Coverage Δ
packages/semi-ui/tagInput/index.tsx	88.38% <0.00%> (ø)
packages/semi-ui/transfer/index.tsx	90.45% <100.00%> (+0.04%)	⬆️
packages/semi-ui/tabs/TabBar.tsx	88.37% <0.00%> (-8.14%)	⬇️
packages/semi-ui/progress/index.tsx	93.61% <0.00%> (+3.19%)	⬆️

Help us with your feedback. Take ten seconds to tell us how you rate us. Have a feature suggestion? Share it here.

☔ View full report at Codecov.
📢 Do you have feedback about the report comment? Let us know in this issue.