adobe / adobe/react-spectrum

Support for reordering Tabs by dragging

Open
#5,366 6 comments 4 reactions 0 assignees View on GitHub
enhancement
Dominant language
TypeScript
Stars
15.9k
Forks
1.6k
Avg merge
3d 9m
Merged PRs (30d)
59

Description

### Provide a general summary of the feature here

Currently reordering of tabs in Tab component is not possible although many drag&drop features already exist for other components (such as GridList). Could it be possible to add an option to allow dragging for tabs?

### 🤔 Expected Behavior?

If the reordering of tabs is allowed, you could start dragging the tab header and select its new position. Just like the browser tabs in Chrome, for example.

### 😯 Current Behavior

This behavior is not supported.

### 💁 Possible Solution

_No response_

### 🔦 Context

There are several use cases in which there are some documents opened by user etc. which are shown as tabs. User might like to reorganize the order of the tabs by dragging the tab headers as you can do for browser tabs, for example.

### 💻 Examples

_No response_

### 🧢 Your Company/Team

_No response_

### 🕷 Tracking Issue

_No response_

Contributor guide

Open the contributing guide

Research direction

Start by reviewing the Tab component and the existing drag-and-drop behavior in GridList. Define how dragging a tab header changes its position, including the API and interaction behavior, then verify that reordered tabs remain accessible and preserve the intended order.

Written by the indexing model from the issue text.

Assessment

Tech stack
react, typescript
Domain
frontend
Issue type
Feature
Difficulty
5/5
Estimated time
Over a week
Activity status
Stale
Clarity
Needs clarification
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.