Skip to content

tab: Keep an icon-only tab's width instead of collapsing to the icon - #3792

Merged
madcodelife merged 1 commit into
mainfrom
fix/icon-tab-width
Nov 5, 2026
Merged

madcodelife merged 1 commit into
mainfrom
fix/icon-tab-width

Conversation

@ylinwind

@ylinwind ylinwind commented Nov 4, 2026 •

Copy link
Copy Markdown
Contributor

Description

An icon-only Tab (Tab::new().icon(..)) collapses to the width of its icon, so the icons of a segmented TabBar pack against each other and the selected segment's raised fill hugs the glyph with no inset.

The icon branch sizes its content box with w(inner_height * 1.25), but the same box also carries flex_1(). That zeroes the flex basis and allows shrinking, so the tab resolves to the icon's own width plus borders: a medium TabVariant::Tab icon tab measured 18px instead of 37.5px. The fix adds a matching min_w, so the box keeps the width it asks for while flex_1() tabs can still grow to fill the bar (#3032 is unaffected).

Regression

This worked until v0.8.1. Bisecting 288767cc..ae6a3fd with the new test lands on 99576db (Bump v0.8.1), which upgrades GPUI from gpui-pre 0.3.9 to 0.3.10 and with it taffy to 0.15. The tab code itself did not change there; the newer layout no longer keeps the w(..) width of a flex_1() box when its parent is sized by content, so the explicit min_w is now needed.

Screenshot

Found in an account menu that uses TabBar::new(..).segmented().small() with three icon tabs (Monitor / Sun / Moon).

Before After
Each segment is ~16px at small size; the icons touch and the selected fill is as wide as the glyph Each segment is 22.5px (small) as designed; icons are evenly spaced and the selected fill has its inset

Impact

  • Only tabs built with Tab::icon change; labelled tabs, prefix/suffix tabs and Folder tabs go through the other branch and are untouched.
  • Every variant is affected the same way: icon-only tabs grow from icon width to the designed inner_height * 1.25 content width (e.g. Segmented small 22.5px, medium 30px). A TabBar holding icon tabs becomes correspondingly wider; callers that relied on the collapsed width will see the bar grow.
  • Within this repository no component uses icon-only tabs (dock and story icons are Buttons), so no in-repo layout changes.
  • No event, focus or accessibility change; max_width still exempts icon-only tabs.

How to Test

  • cargo test -p gpui-component --features test-support --lib tab:: — adds icon_only_tabs_keep_their_width, which checks every variant; it fails before the fix (Tab: icon-only tab is 18px, narrower than its 37.5px content) and passes after.
  • Verified in a downstream app (Allsum account menu, segmented small icon tabs) in light and dark themes.

Checklist

  • I have read the CONTRIBUTING document and followed the guidelines.
  • Reviewed the changes in this PR and confirmed AI generated code (If any) is accurate. The fix and test were written with Claude Code.
  • Passed cargo run for story tests related to the changes.
  • Tested macOS, Windows and Linux platforms performance (if the change is platform-specific)

🤖 Generated with Claude Code

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
@madcodelife
madcodelife merged commit 0ebd729 into main Nov 5, 2026
18 checks passed
@madcodelife
madcodelife deleted the fix/icon-tab-width branch November 5, 2026 00:54
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.

2 participants