Skip to content

fix: Tab draggable from full area including padding#1315

Merged
bdlukaa merged 4 commits intomasterfrom
copilot/fix-tab-draggable-padding-area
Mar 27, 2026
Merged

fix: Tab draggable from full area including padding#1315
bdlukaa merged 4 commits intomasterfrom
copilot/fix-tab-draggable-padding-area

Conversation

Copy link
Copy Markdown
Contributor

Copilot AI commented Mar 21, 2026

Tabs in TabView could not be drag-reordered from their padding area — only the inner content region responded to drag gestures, despite the full tab area being clickable.

Root cause: ReorderableDragStartListener was placed as the child of the Container (inside the padding), so pointer events landing in the padding were consumed by the Container without reaching the listener.

Fix (tab.dart): Moved ReorderableDragStartListener to wrap the entire Container (including its padding) rather than its interior content:

Before: FocusBorder > Container (padding) > ReorderableDragStartListener > ClipRect > content
After:  FocusBorder > ReorderableDragStartListener > Container (padding) > ClipRect > content
Original prompt

This section details on the original issue you should resolve

<issue_title>🐛 Tab is not draggable in its padding area</issue_title>
<issue_description>Describe the bug
The red padding area of a tab in the screenshot is not draggable to reorder the tab. Only the inner part of the tab is draggable. This is unexpected and doesn't match the interactive area that makes you able to click on a tab (whole area, including the red part).

To Reproduce
Steps to reproduce the behavior:

  1. Grab and try to drag a tab in the red area (padding) of a tab.
  2. You can click to make the tab active there, but not grab and reorder it.

The issue is reproduceable in the Tab example in the official docs https://bdlukaa.github.io/fluent_ui/

Expected behavior
If you can hover and click in the red padding area to navigate to the tab, you should also be able to use this area to grab and drag to reorder the tab.

Screenshots
Image
</issue_description>

<agent_instructions>Update the changelog at the end.</agent_instructions>

Comments on the Issue (you are @copilot in this section)


🔒 GitHub Advanced Security automatically protects Copilot coding agent pull requests. You can protect all pull requests by enabling Advanced Security for your repositories. Learn more about Advanced Security.

Copilot AI changed the title [WIP] Fix tab not draggable in its padding area fix: Tab draggable from full area including padding Mar 21, 2026
Copilot AI requested a review from bdlukaa March 21, 2026 02:59
@bdlukaa bdlukaa marked this pull request as ready for review March 27, 2026 22:34
@bdlukaa bdlukaa merged commit 12712a1 into master Mar 27, 2026
1 of 3 checks passed
@bdlukaa bdlukaa deleted the copilot/fix-tab-draggable-padding-area branch March 27, 2026 22:35
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

🐛 Tab is not draggable in its padding area

2 participants