mirror of
https://github.com/zen-browser/desktop.git
synced 2025-07-09 19:05:29 +02:00
Initial development for folders
This commit is contained in:
parent
9762d74256
commit
b4575de026
6 changed files with 308 additions and 100 deletions
2
l10n
2
l10n
|
@ -1 +1 @@
|
|||
Subproject commit 950562cd71c8a6cbc196234620055dfecbe082d0
|
||||
Subproject commit 3aef56c134be9fa88b7e77f8f3c3a1b28a072735
|
|
@ -160,14 +160,6 @@ tab-group:not([split-view-group]) {
|
|||
display: none !important;
|
||||
}
|
||||
|
||||
&[collapsed] .tabbrowser-tab {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
&:not([collapsed]) .tabbrowser-tab {
|
||||
margin-left: 10px;
|
||||
}
|
||||
|
||||
&:not([collapsed]) .tabbrowser-tab::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
|
@ -182,3 +174,96 @@ tab-group:not([split-view-group]) {
|
|||
.tab-group-line {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
tab-group:not([split-view-group]) {
|
||||
display: flex !important;
|
||||
flex-direction: column !important;
|
||||
@media not (-moz-bool-pref: 'zen.view.sidebar-expanded') {
|
||||
width: var(--tab-min-width) !important;
|
||||
margin: var(--tab-block-margin) auto !important;
|
||||
}
|
||||
|
||||
& .tab-group-container {
|
||||
overflow-y: hidden;
|
||||
|
||||
& > tab::before {
|
||||
background: none !important;
|
||||
}
|
||||
}
|
||||
|
||||
border-radius: calc(var(--border-radius-medium) + 2px) !important;
|
||||
margin: 2px 2px 2px 2px;
|
||||
transition: max-height 0.75s cubic-bezier(0.4, 0, 0.2, 1);
|
||||
overflow: hidden !important;
|
||||
|
||||
& .tab-group-label-container {
|
||||
flex: 0 0 auto !important;
|
||||
position: sticky !important;
|
||||
top: 0 !important;
|
||||
z-index: 1000 !important;
|
||||
--tab-group-color-pale: transparent !important;
|
||||
--tab-group-color: transparent !important;
|
||||
margin: 0 !important;
|
||||
height: 36px !important;
|
||||
border-radius: calc(var(--border-radius-medium) + 2px) !important;
|
||||
transition: transform 0.2s ease;
|
||||
transition:
|
||||
background-color 0.2s ease,
|
||||
border-radius 0.2s ease-in-out;
|
||||
@media not (-moz-bool-pref: 'zen.view.sidebar-expanded') {
|
||||
width: var(--tab-min-width) !important;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
background-color: var(--tab-hover-background-color) !important;
|
||||
}
|
||||
|
||||
&:after {
|
||||
display: none;
|
||||
}
|
||||
|
||||
& > label {
|
||||
width: 100% !important;
|
||||
background: transparent !important;
|
||||
border: none !important;
|
||||
font-weight: 400 !important;
|
||||
text-align: center !important;
|
||||
color: var(--sidebar-text-color) !important;
|
||||
margin: 0 !important;
|
||||
display: flex !important;
|
||||
justify-content: flex-start !important;
|
||||
align-content: flex-start !important;
|
||||
padding-left: 34.5px !important;
|
||||
font-size: 12px !important;
|
||||
margin-top: 6px !important;
|
||||
}
|
||||
& > label::before {
|
||||
content: '' !important;
|
||||
position: absolute !important;
|
||||
left: var(--tab-inline-padding) !important;
|
||||
|
||||
top: 50% !important;
|
||||
width: 16px !important;
|
||||
height: 16px !important;
|
||||
transform: translateY(-50%);
|
||||
|
||||
content: url("data:image/svg+xml,%3Csvg width='23' height='18' viewBox='0 0 23 18' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1.44411 3.36858C1.21333 2.13775 2.15758 1 3.40985 1H7.81325C8.40681 1 8.96971 1.26365 9.34969 1.71963L9.40031 1.78037C9.7803 2.23635 10.3432 2.5 10.9367 2.5H15.3153C16.2888 2.5 17.1208 3.20088 17.2862 4.16019L19.0966 14.6602C19.3073 15.8826 18.3661 17 17.1257 17H5.65985C4.69742 17 3.87147 16.3145 3.69411 15.3686L1.44411 3.36858Z' fill='%233139FB'/%3E%3Cpath d='M1.44411 3.36858C1.21333 2.13775 2.15758 1 3.40985 1H7.81325C8.40681 1 8.96971 1.26365 9.34969 1.71963L9.40031 1.78037C9.7803 2.23635 10.3432 2.5 10.9367 2.5H15.3153C16.2888 2.5 17.1208 3.20088 17.2862 4.16019L19.0966 14.6602C19.3073 15.8826 18.3661 17 17.1257 17H5.65985C4.69742 17 3.87147 16.3145 3.69411 15.3686L1.44411 3.36858Z' fill='white' fill-opacity='0.7'/%3E%3Cpath d='M1.44411 3.36858C1.21333 2.13775 2.15758 1 3.40985 1H7.81325C8.40681 1 8.96971 1.26365 9.34969 1.71963L9.40031 1.78037C9.7803 2.23635 10.3432 2.5 10.9367 2.5H15.3153C16.2888 2.5 17.1208 3.20088 17.2862 4.16019L19.0966 14.6602C19.3073 15.8826 18.3661 17 17.1257 17H5.65985C4.69742 17 3.87147 16.3145 3.69411 15.3686L1.44411 3.36858Z' fill='url(%23paint0_linear_204_3644)' fill-opacity='0.15'/%3E%3Cpath d='M1.44411 3.36858C1.21333 2.13775 2.15758 1 3.40985 1H7.81325C8.40681 1 8.96971 1.26365 9.34969 1.71963L9.40031 1.78037C9.7803 2.23635 10.3432 2.5 10.9367 2.5H15.3153C16.2888 2.5 17.1208 3.20088 17.2862 4.16019L19.0966 14.6602C19.3073 15.8826 18.3661 17 17.1257 17H5.65985C4.69742 17 3.87147 16.3145 3.69411 15.3686L1.44411 3.36858Z' stroke='%233139FB' stroke-width='1.5'/%3E%3Cpath d='M5.59806 7.47376C5.83537 6.60364 6.62569 6 7.52759 6H19.3815C20.7002 6 21.658 7.25396 21.311 8.52623L19.4019 15.5262C19.1646 16.3964 18.3743 17 17.4724 17H5.6185C4.29975 17 3.34199 15.746 3.68897 14.4738L5.59806 7.47376Z' fill='white'/%3E%3Cpath d='M5.59806 7.47376C5.83537 6.60364 6.62569 6 7.52759 6H19.3815C20.7002 6 21.658 7.25396 21.311 8.52623L19.4019 15.5262C19.1646 16.3964 18.3743 17 17.4724 17H5.6185C4.29975 17 3.34199 15.746 3.68897 14.4738L5.59806 7.47376Z' fill='url(%23paint1_linear_204_3644)' fill-opacity='0.15'/%3E%3Cpath d='M5.59806 7.47376C5.83537 6.60364 6.62569 6 7.52759 6H19.3815C20.7002 6 21.658 7.25396 21.311 8.52623L19.4019 15.5262C19.1646 16.3964 18.3743 17 17.4724 17H5.6185C4.29975 17 3.34199 15.746 3.68897 14.4738L5.59806 7.47376Z' stroke='%233139FB' stroke-width='1.5'/%3E%3Cdefs%3E%3ClinearGradient id='paint0_linear_204_3644' x1='13.5' y1='5.3125' x2='13.5' y2='17' gradientUnits='userSpaceOnUse'%3E%3Cstop stop-opacity='0'/%3E%3Cstop offset='1'/%3E%3C/linearGradient%3E%3ClinearGradient id='paint1_linear_204_3644' x1='12.5' y1='4.99404' x2='12.5' y2='17' gradientUnits='userSpaceOnUse'%3E%3Cstop stop-color='%233139FB' stop-opacity='0'/%3E%3Cstop offset='1' stop-color='%233139FB'/%3E%3C/linearGradient%3E%3C/defs%3E%3C/svg%3E ") !important;
|
||||
}
|
||||
}
|
||||
|
||||
&[collapsed] {
|
||||
& .tab-group-label-container > label::before {
|
||||
content: url("data:image/svg+xml,%3Csvg width='18' height='18' viewBox='0 0 18 18' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 3C1 1.89543 1.89543 1 3 1H8L10 3H15C16.1046 3 17 3.89543 17 5V15C17 16.1046 16.1046 17 15 17H3C1.89543 17 1 16.1046 1 15V3Z' fill='%233139FB'/%3E%3Cpath d='M1 3C1 1.89543 1.89543 1 3 1H8L10 3H15C16.1046 3 17 3.89543 17 5V15C17 16.1046 16.1046 17 15 17H3C1.89543 17 1 16.1046 1 15V3Z' fill='white' fill-opacity='0.7'/%3E%3Cpath d='M1 3C1 1.89543 1.89543 1 3 1H8L10 3H15C16.1046 3 17 3.89543 17 5V15C17 16.1046 16.1046 17 15 17H3C1.89543 17 1 16.1046 1 15V3Z' stroke='%233139FB' stroke-width='1.5'/%3E%3Cpath d='M1 8C1 6.89543 1.89543 6 3 6H15C16.1046 6 17 6.89543 17 8V15C17 16.1046 16.1046 17 15 17H3C1.89543 17 1 16.1046 1 15V8Z' fill='white' stroke='%233139FB' stroke-width='1.5'/%3E%3C/svg%3E ") !important;
|
||||
}
|
||||
|
||||
& .tabbrowser-tab:not([hidden]) {
|
||||
display: flex;
|
||||
}
|
||||
}
|
||||
|
||||
/* Expand when NOT collapsed */
|
||||
&:not([collapsed]) {
|
||||
overflow: scroll !important;
|
||||
scrollbar-width: none !important;
|
||||
}
|
||||
}
|
||||
|
|
|
@ -1,16 +1,27 @@
|
|||
{
|
||||
class ZenFolders {
|
||||
constructor() {
|
||||
class ZenFolders extends ZenPreloadedFeature {
|
||||
init() {
|
||||
this.#initContextMenu();
|
||||
this.#initEventListeners();
|
||||
}
|
||||
|
||||
#initEventListeners() {
|
||||
document.addEventListener('TabGrouped', this.#onTabGrouped.bind(this));
|
||||
document.addEventListener('TabUngrouped', this.#onTabUngrouped.bind(this));
|
||||
document.addEventListener('TabGroupRemoved', this.#onTabGroupRemoved.bind(this));
|
||||
document.addEventListener('TabGroupCreate', this.#onTabGroupCreate.bind(this));
|
||||
document.addEventListener('TabPinned', this.#onTabPinned.bind(this));
|
||||
document.addEventListener('TabUnpinned', this.#onTabUnpinned.bind(this));
|
||||
window.addEventListener('TabGrouped', this.#onTabGrouped.bind(this));
|
||||
window.addEventListener('TabUngrouped', this.#onTabUngrouped.bind(this));
|
||||
window.addEventListener('TabGroupRemoved', this.#onTabGroupRemoved.bind(this));
|
||||
window.addEventListener('TabGroupCreate', this.#onTabGroupCreate.bind(this));
|
||||
window.addEventListener('TabPinned', this.#onTabPinned.bind(this));
|
||||
window.addEventListener('TabUnpinned', this.#onTabUnpinned.bind(this));
|
||||
window.addEventListener('TabGroupExpand', this.#onTabGroupExpand.bind(this));
|
||||
window.addEventListener('TabGroupCollapse', this.#onTabGroupCollapse.bind(this));
|
||||
document.getElementById('zen-context-menu-new-folder').addEventListener('command', this.#onNewFolder.bind(this));
|
||||
}
|
||||
|
||||
#initContextMenu() {
|
||||
const contextMenuItems = window.MozXULElement.parseXULToFragment(`
|
||||
<menuitem id="zen-context-menu-new-folder" data-l10n-id="zen-toolbar-context-new-folder"/>
|
||||
`);
|
||||
document.getElementById('toolbarNavigatorItemsMenuSeparator').before(contextMenuItems);
|
||||
}
|
||||
|
||||
#onTabGrouped(event) {
|
||||
|
@ -114,6 +125,61 @@
|
|||
}
|
||||
return this._piningFolder;
|
||||
}
|
||||
|
||||
#onNewFolder(event) {
|
||||
const group = gBrowser.addTabGroup([gBrowser.selectedTab], {
|
||||
insertBefore: ZenWorkspaces.pinnedTabsContainer.querySelector('.vertical-pinned-tabs-container-separator'),
|
||||
label: 'New Folder',
|
||||
});
|
||||
group.pinned = true;
|
||||
}
|
||||
|
||||
#onTabGroupExpand(event) {}
|
||||
|
||||
async #onTabGroupCollapse(event) {
|
||||
const group = event.target;
|
||||
const groupRect = group.getBoundingClientRect();
|
||||
const tabsContainer = group.querySelector('.tab-group-container');
|
||||
const animations = [];
|
||||
let selectedTabHeight = 0;
|
||||
for (const item of group.querySelector('.tab-group-container').children) {
|
||||
if (item.hasAttribute('visuallyselected')) {
|
||||
selectedTabHeight = item.getBoundingClientRect().height;
|
||||
continue;
|
||||
}
|
||||
const rect = item.getBoundingClientRect();
|
||||
// Calculate distance between the group label and the tab in order to animate
|
||||
// the tab translating into it vertically
|
||||
const translateY = groupRect.top - rect.top;
|
||||
animations.push(
|
||||
gZenUIManager.motion.animate(
|
||||
item,
|
||||
{
|
||||
y: [0, translateY],
|
||||
},
|
||||
{
|
||||
duration: 0.2,
|
||||
type: 'spring',
|
||||
bounce: 0,
|
||||
}
|
||||
)
|
||||
);
|
||||
}
|
||||
animations.push(
|
||||
gZenUIManager.motion.animate(
|
||||
tabsContainer,
|
||||
{
|
||||
height: [groupRect.height, selectedTabHeight],
|
||||
},
|
||||
{
|
||||
duration: 0.2,
|
||||
type: 'spring',
|
||||
bounce: 0,
|
||||
}
|
||||
)
|
||||
);
|
||||
await Promise.all(animations);
|
||||
}
|
||||
}
|
||||
|
||||
window.gZenFolders = new ZenFolders();
|
||||
|
|
|
@ -1,5 +1,5 @@
|
|||
diff --git a/browser/components/tabbrowser/content/tabbrowser.js b/browser/components/tabbrowser/content/tabbrowser.js
|
||||
index 5f406ea5d09273c9b70b84eee24c6267f88692f8..70cde185cb560a325f894c0ce79f1344b86e2a7c 100644
|
||||
index 5f406ea5d09273c9b70b84eee24c6267f88692f8..949533237ded4ede7b446b1740b63013937f222e 100644
|
||||
--- a/browser/components/tabbrowser/content/tabbrowser.js
|
||||
+++ b/browser/components/tabbrowser/content/tabbrowser.js
|
||||
@@ -424,11 +424,67 @@
|
||||
|
@ -280,15 +280,20 @@ index 5f406ea5d09273c9b70b84eee24c6267f88692f8..70cde185cb560a325f894c0ce79f1344
|
|||
return group;
|
||||
}
|
||||
|
||||
@@ -2937,6 +3032,7 @@
|
||||
@@ -2937,11 +3032,9 @@
|
||||
insertBefore = null,
|
||||
isUserCreated = false,
|
||||
telemetryUserCreateSource = "unknown",
|
||||
+ forSplitView = false,
|
||||
} = {}
|
||||
) {
|
||||
if (!tabs?.length) {
|
||||
@@ -2951,7 +3047,12 @@
|
||||
- if (!tabs?.length) {
|
||||
- throw new Error("Cannot create tab group with zero tabs");
|
||||
- }
|
||||
|
||||
if (!color) {
|
||||
color = this.tabGroupMenu.nextUnusedColor;
|
||||
@@ -2951,7 +3044,12 @@
|
||||
id = `${Date.now()}-${Math.round(Math.random() * 100)}`;
|
||||
}
|
||||
let group = this._createTabGroup(id, color, false, label);
|
||||
|
@ -302,7 +307,18 @@ index 5f406ea5d09273c9b70b84eee24c6267f88692f8..70cde185cb560a325f894c0ce79f1344
|
|||
group,
|
||||
insertBefore?.group ?? insertBefore
|
||||
);
|
||||
@@ -3268,6 +3369,7 @@
|
||||
@@ -2959,10 +3057,6 @@
|
||||
|
||||
// Bail out if the group is empty at this point. This can happen if all
|
||||
// provided tabs are pinned and therefore cannot be grouped.
|
||||
- if (!group.tabs.length) {
|
||||
- group.remove();
|
||||
- return null;
|
||||
- }
|
||||
|
||||
if (this._smartTabGroupsEnabled) {
|
||||
gBrowser.getGroupTitleForTabs(tabs).then(newLabel => {
|
||||
@@ -3268,6 +3362,7 @@
|
||||
initialBrowsingContextGroupId,
|
||||
openWindowInfo,
|
||||
skipLoad,
|
||||
|
@ -310,7 +326,7 @@ index 5f406ea5d09273c9b70b84eee24c6267f88692f8..70cde185cb560a325f894c0ce79f1344
|
|||
}
|
||||
) {
|
||||
// If we don't have a preferred remote type, and we have a remote
|
||||
@@ -3331,6 +3433,7 @@
|
||||
@@ -3331,6 +3426,7 @@
|
||||
openWindowInfo,
|
||||
name,
|
||||
skipLoad,
|
||||
|
@ -318,7 +334,7 @@ index 5f406ea5d09273c9b70b84eee24c6267f88692f8..70cde185cb560a325f894c0ce79f1344
|
|||
});
|
||||
}
|
||||
|
||||
@@ -3509,6 +3612,27 @@
|
||||
@@ -3509,6 +3605,27 @@
|
||||
) {
|
||||
tabWasReused = true;
|
||||
tab = this.selectedTab;
|
||||
|
@ -346,7 +362,7 @@ index 5f406ea5d09273c9b70b84eee24c6267f88692f8..70cde185cb560a325f894c0ce79f1344
|
|||
if (!tabData.pinned) {
|
||||
this.unpinTab(tab);
|
||||
} else {
|
||||
@@ -3522,6 +3646,7 @@
|
||||
@@ -3522,6 +3639,7 @@
|
||||
restoreTabsLazily && !select && !tabData.pinned;
|
||||
|
||||
let url = "about:blank";
|
||||
|
@ -354,7 +370,7 @@ index 5f406ea5d09273c9b70b84eee24c6267f88692f8..70cde185cb560a325f894c0ce79f1344
|
|||
if (tabData.entries?.length) {
|
||||
let activeIndex = (tabData.index || tabData.entries.length) - 1;
|
||||
// Ensure the index is in bounds.
|
||||
@@ -3557,7 +3682,27 @@
|
||||
@@ -3557,7 +3675,27 @@
|
||||
skipLoad: true,
|
||||
preferredRemoteType,
|
||||
});
|
||||
|
@ -383,7 +399,7 @@ index 5f406ea5d09273c9b70b84eee24c6267f88692f8..70cde185cb560a325f894c0ce79f1344
|
|||
if (select) {
|
||||
tabToSelect = tab;
|
||||
}
|
||||
@@ -3570,8 +3715,8 @@
|
||||
@@ -3570,8 +3708,8 @@
|
||||
// inserted in the DOM. If the tab is not yet in the DOM,
|
||||
// just insert it in the right place from the start.
|
||||
if (!tab.parentNode) {
|
||||
|
@ -394,7 +410,7 @@ index 5f406ea5d09273c9b70b84eee24c6267f88692f8..70cde185cb560a325f894c0ce79f1344
|
|||
tab.toggleAttribute("pinned", true);
|
||||
this.tabContainer._invalidateCachedTabs();
|
||||
// Then ensure all the tab open/pinning information is sent.
|
||||
@@ -3581,7 +3726,8 @@
|
||||
@@ -3581,7 +3719,8 @@
|
||||
// needs calling:
|
||||
shouldUpdateForPinnedTabs = true;
|
||||
}
|
||||
|
@ -404,7 +420,7 @@ index 5f406ea5d09273c9b70b84eee24c6267f88692f8..70cde185cb560a325f894c0ce79f1344
|
|||
let { groupId } = tabData;
|
||||
const tabGroup = tabGroupWorkingData.get(groupId);
|
||||
// if a tab refers to a tab group we don't know, skip any group
|
||||
@@ -3595,7 +3741,10 @@
|
||||
@@ -3595,7 +3734,10 @@
|
||||
tabGroup.stateData.id,
|
||||
tabGroup.stateData.color,
|
||||
tabGroup.stateData.collapsed,
|
||||
|
@ -416,7 +432,7 @@ index 5f406ea5d09273c9b70b84eee24c6267f88692f8..70cde185cb560a325f894c0ce79f1344
|
|||
);
|
||||
tabsFragment.appendChild(tabGroup.node);
|
||||
}
|
||||
@@ -3646,6 +3795,9 @@
|
||||
@@ -3646,6 +3788,9 @@
|
||||
this.selectedTab = tabToSelect;
|
||||
this.removeTab(leftoverTab);
|
||||
}
|
||||
|
@ -426,7 +442,7 @@ index 5f406ea5d09273c9b70b84eee24c6267f88692f8..70cde185cb560a325f894c0ce79f1344
|
|||
|
||||
if (tabs.length > 1 || !tabs[0].selected) {
|
||||
this._updateTabsAfterInsert();
|
||||
@@ -3830,7 +3982,7 @@
|
||||
@@ -3830,7 +3975,7 @@
|
||||
// Ensure we have an index if one was not provided.
|
||||
if (typeof index != "number") {
|
||||
// Move the new tab after another tab if needed, to the end otherwise.
|
||||
|
@ -435,7 +451,7 @@ index 5f406ea5d09273c9b70b84eee24c6267f88692f8..70cde185cb560a325f894c0ce79f1344
|
|||
if (
|
||||
!bulkOrderedOpen &&
|
||||
((openerTab &&
|
||||
@@ -3876,18 +4028,18 @@
|
||||
@@ -3876,18 +4021,18 @@
|
||||
|
||||
// Ensure index is within bounds.
|
||||
if (tab.pinned) {
|
||||
|
@ -458,7 +474,7 @@ index 5f406ea5d09273c9b70b84eee24c6267f88692f8..70cde185cb560a325f894c0ce79f1344
|
|||
if (tabAfter && tabAfter.group == tabGroup) {
|
||||
// Place at the front of, or between tabs in, the same tab group
|
||||
this.tabContainer.insertBefore(tab, tabAfter);
|
||||
@@ -4199,6 +4351,9 @@
|
||||
@@ -4199,6 +4344,9 @@
|
||||
return;
|
||||
}
|
||||
|
||||
|
@ -468,7 +484,7 @@ index 5f406ea5d09273c9b70b84eee24c6267f88692f8..70cde185cb560a325f894c0ce79f1344
|
|||
this.removeTabs(selectedTabs);
|
||||
}
|
||||
|
||||
@@ -4556,6 +4711,7 @@
|
||||
@@ -4556,6 +4704,7 @@
|
||||
skipSessionStore,
|
||||
} = {}
|
||||
) {
|
||||
|
@ -476,7 +492,7 @@ index 5f406ea5d09273c9b70b84eee24c6267f88692f8..70cde185cb560a325f894c0ce79f1344
|
|||
if (UserInteraction.running("browser.tabs.opening", window)) {
|
||||
UserInteraction.finish("browser.tabs.opening", window);
|
||||
}
|
||||
@@ -4572,6 +4728,12 @@
|
||||
@@ -4572,6 +4721,12 @@
|
||||
TelemetryStopwatch.start("FX_TAB_CLOSE_TIME_NO_ANIM_MS", aTab);
|
||||
}
|
||||
|
||||
|
@ -489,7 +505,7 @@ index 5f406ea5d09273c9b70b84eee24c6267f88692f8..70cde185cb560a325f894c0ce79f1344
|
|||
// Handle requests for synchronously removing an already
|
||||
// asynchronously closing tab.
|
||||
if (!animate && aTab.closing) {
|
||||
@@ -4586,7 +4748,9 @@
|
||||
@@ -4586,7 +4741,9 @@
|
||||
// frame created for it (for example, by updating the visually selected
|
||||
// state).
|
||||
let tabWidth = window.windowUtils.getBoundsWithoutFlushing(aTab).width;
|
||||
|
@ -500,7 +516,7 @@ index 5f406ea5d09273c9b70b84eee24c6267f88692f8..70cde185cb560a325f894c0ce79f1344
|
|||
if (
|
||||
!this._beginRemoveTab(aTab, {
|
||||
closeWindowFastpath: true,
|
||||
@@ -4600,7 +4764,6 @@
|
||||
@@ -4600,7 +4757,6 @@
|
||||
TelemetryStopwatch.cancel("FX_TAB_CLOSE_TIME_NO_ANIM_MS", aTab);
|
||||
return;
|
||||
}
|
||||
|
@ -508,7 +524,7 @@ index 5f406ea5d09273c9b70b84eee24c6267f88692f8..70cde185cb560a325f894c0ce79f1344
|
|||
let lockTabSizing =
|
||||
!this.tabContainer.verticalMode &&
|
||||
!aTab.pinned &&
|
||||
@@ -4739,14 +4902,14 @@
|
||||
@@ -4739,14 +4895,14 @@
|
||||
!!this.tabsInCollapsedTabGroups.length;
|
||||
if (
|
||||
aTab.visible &&
|
||||
|
@ -525,7 +541,7 @@ index 5f406ea5d09273c9b70b84eee24c6267f88692f8..70cde185cb560a325f894c0ce79f1344
|
|||
|
||||
if (closeWindow) {
|
||||
// We've already called beforeunload on all the relevant tabs if we get here,
|
||||
@@ -4770,6 +4933,7 @@
|
||||
@@ -4770,6 +4926,7 @@
|
||||
|
||||
newTab = true;
|
||||
}
|
||||
|
@ -533,7 +549,7 @@ index 5f406ea5d09273c9b70b84eee24c6267f88692f8..70cde185cb560a325f894c0ce79f1344
|
|||
aTab._endRemoveArgs = [closeWindow, newTab];
|
||||
|
||||
// swapBrowsersAndCloseOther will take care of closing the window without animation.
|
||||
@@ -4810,9 +4974,7 @@
|
||||
@@ -4810,9 +4967,7 @@
|
||||
aTab._mouseleave();
|
||||
|
||||
if (newTab) {
|
||||
|
@ -544,7 +560,7 @@ index 5f406ea5d09273c9b70b84eee24c6267f88692f8..70cde185cb560a325f894c0ce79f1344
|
|||
} else {
|
||||
TabBarVisibility.update();
|
||||
}
|
||||
@@ -4941,6 +5103,8 @@
|
||||
@@ -4941,6 +5096,8 @@
|
||||
this.tabs[i]._tPos = i;
|
||||
}
|
||||
|
||||
|
@ -553,7 +569,7 @@ index 5f406ea5d09273c9b70b84eee24c6267f88692f8..70cde185cb560a325f894c0ce79f1344
|
|||
if (!this._windowIsClosing) {
|
||||
if (wasPinned) {
|
||||
this.tabContainer._positionPinnedTabs();
|
||||
@@ -5064,8 +5228,8 @@
|
||||
@@ -5064,8 +5221,8 @@
|
||||
return closedCount;
|
||||
}
|
||||
|
||||
|
@ -564,7 +580,7 @@ index 5f406ea5d09273c9b70b84eee24c6267f88692f8..70cde185cb560a325f894c0ce79f1344
|
|||
if (unloadBlocked) {
|
||||
return;
|
||||
}
|
||||
@@ -5159,7 +5323,7 @@
|
||||
@@ -5159,7 +5316,7 @@
|
||||
!excludeTabs.has(aTab.owner) &&
|
||||
Services.prefs.getBoolPref("browser.tabs.selectOwnerOnClose")
|
||||
) {
|
||||
|
@ -573,7 +589,7 @@ index 5f406ea5d09273c9b70b84eee24c6267f88692f8..70cde185cb560a325f894c0ce79f1344
|
|||
}
|
||||
|
||||
// Try to find a remaining tab that comes after the given tab
|
||||
@@ -5181,7 +5345,7 @@
|
||||
@@ -5181,7 +5338,7 @@
|
||||
}
|
||||
|
||||
if (tab) {
|
||||
|
@ -582,7 +598,7 @@ index 5f406ea5d09273c9b70b84eee24c6267f88692f8..70cde185cb560a325f894c0ce79f1344
|
|||
}
|
||||
|
||||
// If no qualifying visible tab was found, see if there is a tab in
|
||||
@@ -5599,10 +5763,10 @@
|
||||
@@ -5599,10 +5756,10 @@
|
||||
SessionStore.deleteCustomTabValue(aTab, "hiddenBy");
|
||||
}
|
||||
|
||||
|
@ -595,7 +611,7 @@ index 5f406ea5d09273c9b70b84eee24c6267f88692f8..70cde185cb560a325f894c0ce79f1344
|
|||
aTab.selected ||
|
||||
aTab.closing ||
|
||||
// Tabs that are sharing the screen, microphone or camera cannot be hidden.
|
||||
@@ -5838,7 +6002,7 @@
|
||||
@@ -5838,7 +5995,7 @@
|
||||
moveTabTo(aTab, aIndex, { forceStandaloneTab = false } = {}) {
|
||||
// Don't allow mixing pinned and unpinned tabs.
|
||||
if (aTab.pinned) {
|
||||
|
@ -604,7 +620,7 @@ index 5f406ea5d09273c9b70b84eee24c6267f88692f8..70cde185cb560a325f894c0ce79f1344
|
|||
} else {
|
||||
aIndex = Math.max(aIndex, this.pinnedTabCount);
|
||||
}
|
||||
@@ -5848,10 +6012,17 @@
|
||||
@@ -5848,10 +6005,17 @@
|
||||
|
||||
this.#handleTabMove(aTab, () => {
|
||||
let neighbor = this.tabs[aIndex];
|
||||
|
@ -624,7 +640,7 @@ index 5f406ea5d09273c9b70b84eee24c6267f88692f8..70cde185cb560a325f894c0ce79f1344
|
|||
neighbor.after(aTab);
|
||||
} else {
|
||||
this.tabContainer.insertBefore(aTab, neighbor);
|
||||
@@ -5901,13 +6072,22 @@
|
||||
@@ -5901,13 +6065,22 @@
|
||||
* Bug 1955388 - prevent pinned tabs from commingling with non-pinned tabs
|
||||
* when there are hidden tabs present
|
||||
*/
|
||||
|
@ -648,7 +664,7 @@ index 5f406ea5d09273c9b70b84eee24c6267f88692f8..70cde185cb560a325f894c0ce79f1344
|
|||
if (tab.pinned && this.tabContainer.verticalMode) {
|
||||
return this.tabContainer.verticalPinnedTabsContainer;
|
||||
}
|
||||
@@ -5937,7 +6117,7 @@
|
||||
@@ -5937,7 +6110,7 @@
|
||||
}
|
||||
|
||||
moveTabToGroup(aTab, aGroup) {
|
||||
|
@ -657,7 +673,16 @@ index 5f406ea5d09273c9b70b84eee24c6267f88692f8..70cde185cb560a325f894c0ce79f1344
|
|||
return;
|
||||
}
|
||||
if (aTab.group && aTab.group.id === aGroup.id) {
|
||||
@@ -5961,6 +6141,10 @@
|
||||
@@ -5945,7 +6118,7 @@
|
||||
}
|
||||
|
||||
aGroup.collapsed = false;
|
||||
- this.#handleTabMove(aTab, () => aGroup.appendChild(aTab));
|
||||
+ this.#handleTabMove(aTab, () => aGroup.querySelector(".tab-group-container").appendChild(aTab));
|
||||
this.removeFromMultiSelectedTabs(aTab);
|
||||
this.tabContainer._notifyBackgroundTab(aTab);
|
||||
}
|
||||
@@ -5961,6 +6134,10 @@
|
||||
|
||||
moveActionCallback();
|
||||
|
||||
|
@ -668,7 +693,7 @@ index 5f406ea5d09273c9b70b84eee24c6267f88692f8..70cde185cb560a325f894c0ce79f1344
|
|||
// Clear tabs cache after moving nodes because the order of tabs may have
|
||||
// changed.
|
||||
this.tabContainer._invalidateCachedTabs();
|
||||
@@ -6015,7 +6199,7 @@
|
||||
@@ -6015,7 +6192,7 @@
|
||||
createLazyBrowser,
|
||||
};
|
||||
|
||||
|
@ -677,7 +702,7 @@ index 5f406ea5d09273c9b70b84eee24c6267f88692f8..70cde185cb560a325f894c0ce79f1344
|
|||
if (aIndex < numPinned || (aTab.pinned && aIndex == numPinned)) {
|
||||
params.pinned = true;
|
||||
}
|
||||
@@ -6765,7 +6949,7 @@
|
||||
@@ -6765,7 +6942,7 @@
|
||||
// preventDefault(). It will still raise the window if appropriate.
|
||||
break;
|
||||
}
|
||||
|
@ -686,7 +711,7 @@ index 5f406ea5d09273c9b70b84eee24c6267f88692f8..70cde185cb560a325f894c0ce79f1344
|
|||
window.focus();
|
||||
aEvent.preventDefault();
|
||||
break;
|
||||
@@ -7671,6 +7855,7 @@
|
||||
@@ -7671,6 +7848,7 @@
|
||||
aWebProgress.isTopLevel
|
||||
) {
|
||||
this.mTab.setAttribute("busy", "true");
|
||||
|
@ -694,7 +719,7 @@ index 5f406ea5d09273c9b70b84eee24c6267f88692f8..70cde185cb560a325f894c0ce79f1344
|
|||
gBrowser._tabAttrModified(this.mTab, ["busy"]);
|
||||
this.mTab._notselectedsinceload = !this.mTab.selected;
|
||||
}
|
||||
@@ -8640,7 +8825,7 @@ var TabContextMenu = {
|
||||
@@ -8640,7 +8818,7 @@ var TabContextMenu = {
|
||||
);
|
||||
contextUnpinSelectedTabs.hidden =
|
||||
!this.contextTab.pinned || !this.multiselected;
|
||||
|
@ -703,7 +728,7 @@ index 5f406ea5d09273c9b70b84eee24c6267f88692f8..70cde185cb560a325f894c0ce79f1344
|
|||
// Move Tab items
|
||||
let contextMoveTabOptions = document.getElementById(
|
||||
"context_moveTabOptions"
|
||||
@@ -8674,7 +8859,7 @@ var TabContextMenu = {
|
||||
@@ -8674,7 +8852,7 @@ var TabContextMenu = {
|
||||
let isFirstTab =
|
||||
!this.contextTabs[0].group &&
|
||||
(this.contextTabs[0] == visibleTabs[0] ||
|
||||
|
@ -712,7 +737,7 @@ index 5f406ea5d09273c9b70b84eee24c6267f88692f8..70cde185cb560a325f894c0ce79f1344
|
|||
contextMoveTabToStart.disabled = isFirstTab && allSelectedTabsAdjacent;
|
||||
|
||||
document.getElementById("context_openTabInWindow").disabled =
|
||||
@@ -8904,6 +9089,7 @@ var TabContextMenu = {
|
||||
@@ -8904,6 +9082,7 @@ var TabContextMenu = {
|
||||
if (this.contextTab.multiselected) {
|
||||
gBrowser.removeMultiSelectedTabs();
|
||||
} else {
|
||||
|
|
24
src/browser/components/tabbrowser/content/tabgroup-js.patch
Normal file
24
src/browser/components/tabbrowser/content/tabgroup-js.patch
Normal file
|
@ -0,0 +1,24 @@
|
|||
diff --git a/browser/components/tabbrowser/content/tabgroup.js b/browser/components/tabbrowser/content/tabgroup.js
|
||||
index 670fe2b309863102f63246e26194c8958e28bbb7..4cf64a3f4b04542ae8c792cf526b823e8c967953 100644
|
||||
--- a/browser/components/tabbrowser/content/tabgroup.js
|
||||
+++ b/browser/components/tabbrowser/content/tabgroup.js
|
||||
@@ -12,7 +12,9 @@
|
||||
<vbox class="tab-group-label-container" pack="center">
|
||||
<label class="tab-group-label" role="button"/>
|
||||
</vbox>
|
||||
- <html:slot/>
|
||||
+ <vbox class="tab-group-container">
|
||||
+ <html:slot/>
|
||||
+ </vbox>
|
||||
`;
|
||||
|
||||
/** @type {string} */
|
||||
@@ -213,7 +215,7 @@
|
||||
}
|
||||
|
||||
get tabs() {
|
||||
- return Array.from(this.children).filter(node => node.matches("tab"));
|
||||
+ return Array.from(this.querySelector('.tab-group-container').children).filter(node => node.matches("tab"));
|
||||
}
|
||||
|
||||
/**
|
|
@ -1,5 +1,5 @@
|
|||
diff --git a/browser/components/tabbrowser/content/tabs.js b/browser/components/tabbrowser/content/tabs.js
|
||||
index 0fbdbf3aefc467880e6b0bae2615cb145735cb0f..0d3919b288afefb05e3ec54ddfa90f001dd4c3b1 100644
|
||||
index 0fbdbf3aefc467880e6b0bae2615cb145735cb0f..7fc101549947718ed2624a5d673227fecfb4db0a 100644
|
||||
--- a/browser/components/tabbrowser/content/tabs.js
|
||||
+++ b/browser/components/tabbrowser/content/tabs.js
|
||||
@@ -93,7 +93,7 @@
|
||||
|
@ -11,7 +11,15 @@ index 0fbdbf3aefc467880e6b0bae2615cb145735cb0f..0d3919b288afefb05e3ec54ddfa90f00
|
|||
}
|
||||
return true;
|
||||
};
|
||||
@@ -347,7 +347,7 @@
|
||||
@@ -291,6 +291,7 @@
|
||||
on_TabGroupCollapse(event) {
|
||||
this._invalidateCachedVisibleTabs();
|
||||
this._unlockTabSizing();
|
||||
+ return;
|
||||
|
||||
// If the user's selected tab is in the collapsing group, kick them off
|
||||
// the tab. If no tabs exist outside the group, create a new one and
|
||||
@@ -347,7 +348,7 @@
|
||||
// and we're not hitting the scroll buttons.
|
||||
if (
|
||||
event.button != 0 ||
|
||||
|
@ -20,7 +28,7 @@ index 0fbdbf3aefc467880e6b0bae2615cb145735cb0f..0d3919b288afefb05e3ec54ddfa90f00
|
|||
event.composedTarget.localName == "toolbarbutton"
|
||||
) {
|
||||
return;
|
||||
@@ -396,6 +396,7 @@
|
||||
@@ -396,6 +397,7 @@
|
||||
// Reset the "ignored click" flag
|
||||
target._ignoredCloseButtonClicks = false;
|
||||
}
|
||||
|
@ -28,7 +36,7 @@ index 0fbdbf3aefc467880e6b0bae2615cb145735cb0f..0d3919b288afefb05e3ec54ddfa90f00
|
|||
}
|
||||
|
||||
/* Protects from close-tab-button errant doubleclick:
|
||||
@@ -693,7 +694,7 @@
|
||||
@@ -693,7 +695,7 @@
|
||||
if (this.#isContainerVerticalPinnedExpanded(tab)) {
|
||||
// In expanded vertical mode, the max number of pinned tabs per row is dynamic
|
||||
// Set this before adjusting dragged tab's position
|
||||
|
@ -37,7 +45,7 @@ index 0fbdbf3aefc467880e6b0bae2615cb145735cb0f..0d3919b288afefb05e3ec54ddfa90f00
|
|||
let tabsPerRow = 0;
|
||||
let position = 0;
|
||||
for (let pinnedTab of pinnedTabs) {
|
||||
@@ -899,6 +900,10 @@
|
||||
@@ -899,6 +901,10 @@
|
||||
}
|
||||
|
||||
let draggedTab = event.dataTransfer.mozGetDataAt(TAB_DROP_TYPE, 0);
|
||||
|
@ -48,7 +56,7 @@ index 0fbdbf3aefc467880e6b0bae2615cb145735cb0f..0d3919b288afefb05e3ec54ddfa90f00
|
|||
if (
|
||||
(effects == "move" || effects == "copy") &&
|
||||
this == draggedTab.container &&
|
||||
@@ -1012,6 +1017,18 @@
|
||||
@@ -1012,6 +1018,18 @@
|
||||
|
||||
this._tabDropIndicator.hidden = true;
|
||||
event.stopPropagation();
|
||||
|
@ -67,7 +75,7 @@ index 0fbdbf3aefc467880e6b0bae2615cb145735cb0f..0d3919b288afefb05e3ec54ddfa90f00
|
|||
if (draggedTab && dropEffect == "copy") {
|
||||
// copy the dropped tab (wherever it's from)
|
||||
let newIndex = this._getDropIndex(event);
|
||||
@@ -1050,10 +1067,11 @@
|
||||
@@ -1050,10 +1068,11 @@
|
||||
}
|
||||
} else {
|
||||
let isPinned = draggedTab.pinned;
|
||||
|
@ -83,7 +91,7 @@ index 0fbdbf3aefc467880e6b0bae2615cb145735cb0f..0d3919b288afefb05e3ec54ddfa90f00
|
|||
);
|
||||
let size = this.verticalMode ? "height" : "width";
|
||||
let screenAxis = this.verticalMode ? "screenY" : "screenX";
|
||||
@@ -1129,7 +1147,7 @@
|
||||
@@ -1129,7 +1148,7 @@
|
||||
tab.removeAttribute("tabdrop-samewindow");
|
||||
resolve();
|
||||
};
|
||||
|
@ -92,7 +100,7 @@ index 0fbdbf3aefc467880e6b0bae2615cb145735cb0f..0d3919b288afefb05e3ec54ddfa90f00
|
|||
postTransitionCleanup();
|
||||
} else {
|
||||
let onTransitionEnd = transitionendEvent => {
|
||||
@@ -1246,7 +1264,7 @@
|
||||
@@ -1246,7 +1265,7 @@
|
||||
return;
|
||||
}
|
||||
}
|
||||
|
@ -101,7 +109,7 @@ index 0fbdbf3aefc467880e6b0bae2615cb145735cb0f..0d3919b288afefb05e3ec54ddfa90f00
|
|||
gBrowser.loadTabs(urls, {
|
||||
inBackground,
|
||||
replace,
|
||||
@@ -1276,13 +1294,23 @@
|
||||
@@ -1276,13 +1295,23 @@
|
||||
return;
|
||||
}
|
||||
|
||||
|
@ -127,7 +135,7 @@ index 0fbdbf3aefc467880e6b0bae2615cb145735cb0f..0d3919b288afefb05e3ec54ddfa90f00
|
|||
) {
|
||||
delete draggedTab._dragData;
|
||||
return;
|
||||
@@ -1504,7 +1532,7 @@
|
||||
@@ -1504,7 +1533,7 @@
|
||||
}
|
||||
|
||||
get newTabButton() {
|
||||
|
@ -136,7 +144,7 @@ index 0fbdbf3aefc467880e6b0bae2615cb145735cb0f..0d3919b288afefb05e3ec54ddfa90f00
|
|||
}
|
||||
|
||||
get verticalMode() {
|
||||
@@ -1524,29 +1552,41 @@
|
||||
@@ -1524,29 +1553,41 @@
|
||||
if (this.#allTabs) {
|
||||
return this.#allTabs;
|
||||
}
|
||||
|
@ -186,7 +194,7 @@ index 0fbdbf3aefc467880e6b0bae2615cb145735cb0f..0d3919b288afefb05e3ec54ddfa90f00
|
|||
}
|
||||
|
||||
/**
|
||||
@@ -1566,7 +1606,7 @@
|
||||
@@ -1566,7 +1607,7 @@
|
||||
*/
|
||||
get visibleTabs() {
|
||||
if (!this.#visibleTabs) {
|
||||
|
@ -195,7 +203,7 @@ index 0fbdbf3aefc467880e6b0bae2615cb145735cb0f..0d3919b288afefb05e3ec54ddfa90f00
|
|||
}
|
||||
return this.#visibleTabs;
|
||||
}
|
||||
@@ -1601,23 +1641,18 @@
|
||||
@@ -1601,23 +1642,18 @@
|
||||
}
|
||||
|
||||
let elementIndex = 0;
|
||||
|
@ -223,7 +231,7 @@ index 0fbdbf3aefc467880e6b0bae2615cb145735cb0f..0d3919b288afefb05e3ec54ddfa90f00
|
|||
let visibleTabsInGroup = child.tabs.filter(tab => tab.visible);
|
||||
visibleTabsInGroup.forEach(tab => {
|
||||
tab.elementIndex = elementIndex++;
|
||||
@@ -1627,10 +1662,7 @@
|
||||
@@ -1627,10 +1663,7 @@
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -235,7 +243,7 @@ index 0fbdbf3aefc467880e6b0bae2615cb145735cb0f..0d3919b288afefb05e3ec54ddfa90f00
|
|||
|
||||
return this.#focusableItems;
|
||||
}
|
||||
@@ -1638,6 +1670,7 @@
|
||||
@@ -1638,6 +1671,7 @@
|
||||
_invalidateCachedTabs() {
|
||||
this.#allTabs = null;
|
||||
this._invalidateCachedVisibleTabs();
|
||||
|
@ -243,7 +251,7 @@ index 0fbdbf3aefc467880e6b0bae2615cb145735cb0f..0d3919b288afefb05e3ec54ddfa90f00
|
|||
}
|
||||
|
||||
_invalidateCachedVisibleTabs() {
|
||||
@@ -1652,8 +1685,8 @@
|
||||
@@ -1652,8 +1686,8 @@
|
||||
#isContainerVerticalPinnedExpanded(tab) {
|
||||
return (
|
||||
this.verticalMode &&
|
||||
|
@ -254,7 +262,7 @@ index 0fbdbf3aefc467880e6b0bae2615cb145735cb0f..0d3919b288afefb05e3ec54ddfa90f00
|
|||
);
|
||||
}
|
||||
|
||||
@@ -1668,7 +1701,7 @@
|
||||
@@ -1668,7 +1702,7 @@
|
||||
|
||||
if (node == null) {
|
||||
// We have a container for non-tab elements at the end of the scrollbox.
|
||||
|
@ -263,7 +271,7 @@ index 0fbdbf3aefc467880e6b0bae2615cb145735cb0f..0d3919b288afefb05e3ec54ddfa90f00
|
|||
}
|
||||
|
||||
node.before(tab);
|
||||
@@ -1763,7 +1796,7 @@
|
||||
@@ -1763,7 +1797,7 @@
|
||||
// There are separate "new tab" buttons for horizontal tabs toolbar, vertical tabs and
|
||||
// for when the tab strip is overflowed (which is shared by vertical and horizontal tabs);
|
||||
// Attach the long click popup to all of them.
|
||||
|
@ -272,7 +280,7 @@ index 0fbdbf3aefc467880e6b0bae2615cb145735cb0f..0d3919b288afefb05e3ec54ddfa90f00
|
|||
const newTab2 = this.newTabButton;
|
||||
const newTabVertical = document.getElementById(
|
||||
"vertical-tabs-newtab-button"
|
||||
@@ -1846,7 +1879,7 @@
|
||||
@@ -1846,7 +1880,7 @@
|
||||
let rect = ele => {
|
||||
return window.windowUtils.getBoundsWithoutFlushing(ele);
|
||||
};
|
||||
|
@ -281,7 +289,7 @@ index 0fbdbf3aefc467880e6b0bae2615cb145735cb0f..0d3919b288afefb05e3ec54ddfa90f00
|
|||
if (tab && rect(tab).width <= this._tabClipWidth) {
|
||||
this.setAttribute("closebuttons", "activetab");
|
||||
} else {
|
||||
@@ -1858,10 +1891,12 @@
|
||||
@@ -1858,10 +1892,12 @@
|
||||
|
||||
_handleTabSelect(aInstant) {
|
||||
let selectedTab = this.selectedItem;
|
||||
|
@ -294,7 +302,7 @@ index 0fbdbf3aefc467880e6b0bae2615cb145735cb0f..0d3919b288afefb05e3ec54ddfa90f00
|
|||
selectedTab._notselectedsinceload = false;
|
||||
}
|
||||
|
||||
@@ -1873,7 +1908,7 @@
|
||||
@@ -1873,7 +1909,7 @@
|
||||
return;
|
||||
}
|
||||
|
||||
|
@ -303,7 +311,7 @@ index 0fbdbf3aefc467880e6b0bae2615cb145735cb0f..0d3919b288afefb05e3ec54ddfa90f00
|
|||
if (!tabs.length) {
|
||||
return;
|
||||
}
|
||||
@@ -1909,7 +1944,7 @@
|
||||
@@ -1909,7 +1945,7 @@
|
||||
if (isEndTab && !this._hasTabTempMaxWidth) {
|
||||
return;
|
||||
}
|
||||
|
@ -312,7 +320,7 @@ index 0fbdbf3aefc467880e6b0bae2615cb145735cb0f..0d3919b288afefb05e3ec54ddfa90f00
|
|||
// Force tabs to stay the same width, unless we're closing the last tab,
|
||||
// which case we need to let them expand just enough so that the overall
|
||||
// tabbar width is the same.
|
||||
@@ -1924,7 +1959,7 @@
|
||||
@@ -1924,7 +1960,7 @@
|
||||
let tabsToReset = [];
|
||||
for (let i = numPinned; i < tabs.length; i++) {
|
||||
let tab = tabs[i];
|
||||
|
@ -321,7 +329,7 @@ index 0fbdbf3aefc467880e6b0bae2615cb145735cb0f..0d3919b288afefb05e3ec54ddfa90f00
|
|||
if (!isEndTab) {
|
||||
// keep tabs the same width
|
||||
tab.style.transition = "none";
|
||||
@@ -1990,16 +2025,15 @@
|
||||
@@ -1990,16 +2026,15 @@
|
||||
// Move pinned tabs to another container when the tabstrip is toggled to vertical
|
||||
// and when session restore code calls _positionPinnedTabs; update styling whenever
|
||||
// the number of pinned tabs changes.
|
||||
|
@ -344,7 +352,7 @@ index 0fbdbf3aefc467880e6b0bae2615cb145735cb0f..0d3919b288afefb05e3ec54ddfa90f00
|
|||
}
|
||||
}
|
||||
|
||||
@@ -2007,9 +2041,7 @@
|
||||
@@ -2007,9 +2042,7 @@
|
||||
}
|
||||
|
||||
_resetVerticalPinnedTabs() {
|
||||
|
@ -355,7 +363,7 @@ index 0fbdbf3aefc467880e6b0bae2615cb145735cb0f..0d3919b288afefb05e3ec54ddfa90f00
|
|||
|
||||
if (!verticalTabsContainer.children.length) {
|
||||
return;
|
||||
@@ -2022,8 +2054,8 @@
|
||||
@@ -2022,8 +2055,8 @@
|
||||
}
|
||||
|
||||
_positionPinnedTabs() {
|
||||
|
@ -366,7 +374,7 @@ index 0fbdbf3aefc467880e6b0bae2615cb145735cb0f..0d3919b288afefb05e3ec54ddfa90f00
|
|||
let absPositionHorizontalTabs =
|
||||
this.overflowing && tabs.length > numPinned && numPinned > 0;
|
||||
|
||||
@@ -2032,7 +2064,7 @@
|
||||
@@ -2032,7 +2065,7 @@
|
||||
|
||||
if (this.verticalMode) {
|
||||
this._updateVerticalPinnedTabs();
|
||||
|
@ -375,7 +383,7 @@ index 0fbdbf3aefc467880e6b0bae2615cb145735cb0f..0d3919b288afefb05e3ec54ddfa90f00
|
|||
let layoutData = this._pinnedTabsLayoutCache;
|
||||
let uiDensity = document.documentElement.getAttribute("uidensity");
|
||||
if (!layoutData || layoutData.uiDensity != uiDensity) {
|
||||
@@ -2104,7 +2136,7 @@
|
||||
@@ -2104,7 +2137,7 @@
|
||||
return;
|
||||
}
|
||||
|
||||
|
@ -384,7 +392,7 @@ index 0fbdbf3aefc467880e6b0bae2615cb145735cb0f..0d3919b288afefb05e3ec54ddfa90f00
|
|||
|
||||
let directionX = screenX > dragData.animLastScreenX;
|
||||
let directionY = screenY > dragData.animLastScreenY;
|
||||
@@ -2112,7 +2144,7 @@
|
||||
@@ -2112,7 +2145,7 @@
|
||||
dragData.animLastScreenX = screenX;
|
||||
|
||||
let { width: tabWidth, height: tabHeight } =
|
||||
|
@ -393,7 +401,7 @@ index 0fbdbf3aefc467880e6b0bae2615cb145735cb0f..0d3919b288afefb05e3ec54ddfa90f00
|
|||
let shiftSizeX = tabWidth * movingTabs.length;
|
||||
let shiftSizeY = tabHeight;
|
||||
dragData.tabWidth = tabWidth;
|
||||
@@ -2296,11 +2328,15 @@
|
||||
@@ -2296,11 +2329,15 @@
|
||||
this.#clearDragOverCreateGroupTimer();
|
||||
|
||||
let isPinned = draggedTab.pinned;
|
||||
|
@ -413,7 +421,7 @@ index 0fbdbf3aefc467880e6b0bae2615cb145735cb0f..0d3919b288afefb05e3ec54ddfa90f00
|
|||
|
||||
if (this.#rtlMode) {
|
||||
tabs.reverse();
|
||||
@@ -2314,7 +2350,7 @@
|
||||
@@ -2314,7 +2351,7 @@
|
||||
let size = this.verticalMode ? "height" : "width";
|
||||
let translateAxis = this.verticalMode ? "translateY" : "translateX";
|
||||
let scrollDirection = this.verticalMode ? "scrollTop" : "scrollLeft";
|
||||
|
@ -422,7 +430,7 @@ index 0fbdbf3aefc467880e6b0bae2615cb145735cb0f..0d3919b288afefb05e3ec54ddfa90f00
|
|||
let translateX = event.screenX - dragData.screenX;
|
||||
let translateY = event.screenY - dragData.screenY;
|
||||
|
||||
@@ -2328,6 +2364,12 @@
|
||||
@@ -2328,6 +2365,12 @@
|
||||
let lastTab = tabs.at(-1);
|
||||
let lastMovingTab = movingTabs.at(-1);
|
||||
let firstMovingTab = movingTabs[0];
|
||||
|
@ -435,7 +443,7 @@ index 0fbdbf3aefc467880e6b0bae2615cb145735cb0f..0d3919b288afefb05e3ec54ddfa90f00
|
|||
let endEdge = ele => ele[screenAxis] + bounds(ele)[size];
|
||||
let lastMovingTabScreen = endEdge(lastMovingTab);
|
||||
let firstMovingTabScreen = firstMovingTab[screenAxis];
|
||||
@@ -2348,7 +2390,11 @@
|
||||
@@ -2348,7 +2391,11 @@
|
||||
translate = Math.min(Math.max(translate, firstBound), lastBound);
|
||||
|
||||
for (let tab of movingTabs) {
|
||||
|
@ -448,7 +456,7 @@ index 0fbdbf3aefc467880e6b0bae2615cb145735cb0f..0d3919b288afefb05e3ec54ddfa90f00
|
|||
}
|
||||
|
||||
dragData.translatePos = translate;
|
||||
@@ -2485,6 +2531,9 @@
|
||||
@@ -2485,6 +2532,9 @@
|
||||
break;
|
||||
}
|
||||
let element = tabs[mid];
|
||||
|
@ -458,7 +466,7 @@ index 0fbdbf3aefc467880e6b0bae2615cb145735cb0f..0d3919b288afefb05e3ec54ddfa90f00
|
|||
let elementForSize = isTabGroupLabel(element)
|
||||
? element.parentElement
|
||||
: element;
|
||||
@@ -2507,6 +2556,10 @@
|
||||
@@ -2507,6 +2557,10 @@
|
||||
if (!dropElement) {
|
||||
dropElement = this.ariaFocusableItems[oldDropElementIndex];
|
||||
}
|
||||
|
@ -469,7 +477,7 @@ index 0fbdbf3aefc467880e6b0bae2615cb145735cb0f..0d3919b288afefb05e3ec54ddfa90f00
|
|||
let newDropElementIndex = dropElement
|
||||
? dropElement.elementIndex
|
||||
: oldDropElementIndex;
|
||||
@@ -2515,7 +2568,7 @@
|
||||
@@ -2515,7 +2569,7 @@
|
||||
let shouldCreateGroupOnDrop;
|
||||
let dropBefore;
|
||||
if (dropElement) {
|
||||
|
@ -478,7 +486,7 @@ index 0fbdbf3aefc467880e6b0bae2615cb145735cb0f..0d3919b288afefb05e3ec54ddfa90f00
|
|||
? dropElement.parentElement
|
||||
: dropElement;
|
||||
|
||||
@@ -2566,12 +2619,12 @@
|
||||
@@ -2566,12 +2620,12 @@
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -493,7 +501,7 @@ index 0fbdbf3aefc467880e6b0bae2615cb145735cb0f..0d3919b288afefb05e3ec54ddfa90f00
|
|||
dropElement != draggedTab &&
|
||||
isTab(dropElement) &&
|
||||
!dropElement?.group &&
|
||||
@@ -2639,7 +2692,7 @@
|
||||
@@ -2639,7 +2693,7 @@
|
||||
// Shift background tabs to leave a gap where the dragged tab
|
||||
// would currently be dropped.
|
||||
for (let item of tabs) {
|
||||
|
@ -502,7 +510,7 @@ index 0fbdbf3aefc467880e6b0bae2615cb145735cb0f..0d3919b288afefb05e3ec54ddfa90f00
|
|||
continue;
|
||||
}
|
||||
|
||||
@@ -2648,6 +2701,9 @@
|
||||
@@ -2648,6 +2702,9 @@
|
||||
if (isTabGroupLabel(item)) {
|
||||
// Shift the `.tab-group-label-container` to shift the label element.
|
||||
item = item.parentElement;
|
||||
|
@ -512,7 +520,7 @@ index 0fbdbf3aefc467880e6b0bae2615cb145735cb0f..0d3919b288afefb05e3ec54ddfa90f00
|
|||
}
|
||||
item.style.transform = transform;
|
||||
}
|
||||
@@ -2697,8 +2753,9 @@
|
||||
@@ -2697,8 +2754,9 @@
|
||||
);
|
||||
}
|
||||
|
||||
|
@ -524,7 +532,7 @@ index 0fbdbf3aefc467880e6b0bae2615cb145735cb0f..0d3919b288afefb05e3ec54ddfa90f00
|
|||
return;
|
||||
}
|
||||
|
||||
@@ -2711,6 +2768,12 @@
|
||||
@@ -2711,6 +2769,12 @@
|
||||
item = item.parentElement;
|
||||
}
|
||||
item.style.transform = "";
|
||||
|
@ -537,7 +545,7 @@ index 0fbdbf3aefc467880e6b0bae2615cb145735cb0f..0d3919b288afefb05e3ec54ddfa90f00
|
|||
item.removeAttribute("dragover-createGroup");
|
||||
}
|
||||
this.removeAttribute("movingtab-createGroup");
|
||||
@@ -2754,7 +2817,7 @@
|
||||
@@ -2754,7 +2818,7 @@
|
||||
let postTransitionCleanup = () => {
|
||||
movingTab._moveTogetherSelectedTabsData.animate = false;
|
||||
};
|
||||
|
@ -546,7 +554,7 @@ index 0fbdbf3aefc467880e6b0bae2615cb145735cb0f..0d3919b288afefb05e3ec54ddfa90f00
|
|||
postTransitionCleanup();
|
||||
} else {
|
||||
let onTransitionEnd = transitionendEvent => {
|
||||
@@ -2924,7 +2987,7 @@
|
||||
@@ -2924,7 +2988,7 @@
|
||||
}
|
||||
|
||||
_notifyBackgroundTab(aTab) {
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue