fix: Board item visibility issue when moving using keyboard arrows

[georgylobko]

Description

Fix Board Item z-index inconsistency between mouse and keyboard interactions (AWSUI-61346)

Related links, issue #, if available: n/a

How has this been tested?

Review checklist

The following items are to be evaluated by the author(s) and the reviewer(s).

Correctness

• Changes include appropriate documentation updates.
• Changes are backward-compatible if not indicated, see CONTRIBUTING.md.
• Changes do not include unsupported browser features, see CONTRIBUTING.md.
• Changes were manually tested for accessibility, see accessibility guidelines.

Security

• If the code handles URLs: all URLs are validated through the checkSafeUrl function.

Testing

• Changes are covered with new/existing unit tests?
• Changes are covered with new/existing integration tests?

---

By submitting this pull request, I confirm that you can use, modify, copy, and redistribute this contribution, under the terms of your choice.

[codecov]

Codecov Report

✅ All modified and coverable lines are covered by tests.
✅ Project coverage is 95.54%. Comparing base (0ce808b) to head (7278e47).
⚠️ Report is 1 commits behind head on main.

Additional details and impacted files

@@            Coverage Diff             @@
##             main     #379      +/-   ##
==========================================
+ Coverage   95.11%   95.54%   +0.43%     
==========================================
  Files          67       67              
  Lines        3275     3278       +3     
  Branches      703      706       +3     
==========================================
+ Hits         3115     3132      +17     
+ Misses        160      146      -14     

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

🚀 New features to boost your workflow:

• ❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
• 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

[pan-kot]

nit: why do we define it as .transformed.keyboardDragged and not just .keyboardDragged? That is not an issue, but is asymmetrical to the .dragged style above.

[georgylobko]

Because transformed is applied for all board items, not only for the one which is being moved by keyboard. So combining these classes gives you a way to distinguish the active one

[pan-kot]

the .transformed style that we add already defines position: absolute, so there is no need to define it again

[pan-kot]

Idea: what if we add some class .active when the condition if (transition) {} applies? Inside we can define z-index: 2000, so we'd need no separate class and condition for keyboard.

[georgylobko]

This is a bit more difficult. We need to separate keyboard and mouse interactions. There is a difference between keyboard and mouse dragging:
Mouse dragging makes the board item position: fixed and assigns a new width right away
Keyboard interaction keeps the board item position: absolute and does not assign a width right away, and the item should keep its place on the board while scrolling

But the point about defining position: absolute is valid. Addressed