Auto-wrap desktop session tabs to a second row on overflow

When desktop session tabs overflow one row, wrap them to a second row instead
of horizontal scroll — unless the user has pinned the manual two-row layout
(tabTwoRows). Mobile/tablet keep horizontal scroll. The wrap policy
(shouldAutoWrapTabs) lives in constants.js as a pure, unit-testable function;
updateTabOverflowMode() measures overflow after each tab render and toggles
.tabs-auto-wrap.

Test: test/tab-overflow.test.ts (vm-loads constants.js, asserts the policy).
This commit is contained in:
Aamer Akhter
2026-06-14 15:49:12 -04:00
parent e742d00c98
commit a5263b3252
4 changed files with 106 additions and 0 deletions
+7
View File
@@ -312,6 +312,13 @@ body {
max-height: 120px;
}
.session-tabs.tabs-auto-wrap {
flex-wrap: wrap;
overflow-x: hidden;
overflow-y: auto;
max-height: 96px;
}
.session-tabs::-webkit-scrollbar {
width: 4px;
height: 0;