[Bug]: There appears a ghost block icon while dragging and dropping for Component DetailsList - Drag & Drop

[juliafaneast]

Component

Other...

Package version

8.125.3

React version

19.2.3

Environment

System:
    OS: Windows 11 10.0.26100
    CPU: (8) x64 AMD EPYC 7763 64-Core Processor
    Memory: 15.60 GB / 31.95 GB
  Browsers:
    Chrome: 146.0.7680.153
    Edge: Chromium (142.0.3595.94)

Current Behavior

While dragging one row and trying to reorder the selected row, there appears the read block icon especially when the row is dragged at the middle position between other two rows. You can reproduce through the official demo details list in Edge or Chrome browser - https://developer.microsoft.com/en-us/fluentui#/controls/web/detailslist/draganddrop

Expected Behavior

No red block icon appears in detail list container

Reproduction

https://codepen.io/pen

Steps to reproduce

1. open this - https://codepen.io/pen
2. selected one row and drag, move slowly
3. Then you can see that red block icon appears and disappears frequently with your moving

Are you reporting an Accessibility issue?

None

Suggested severity

High - No workaround

Products/sites affected

No response

Are you willing to submit a PR to fix?

yes

Validations

• Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
• The provided reproduction is a minimal reproducible example of the bug.

[ValentinaKozlova]

Hello @juliafaneast , thanks for the issue report. The core team doesn't have the capacity to work on this now, but if you are willing to contribute, we are happy to assist