SPFx-Projekte/Megamenu
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 3 Wiki Activity

feat: Update version to 2.2.2, enhance global navigation exclusion logic, and improve hover behavior in MegaMenu

Browse Source
This commit is contained in:
Torsten Brendgen
2026-08-18 20:20:20 +02:00
parent f58c6f6135
commit e977fd7365
12 changed files with 104 additions and 25 deletions
Download Patch File Download Diff File Expand all files Collapse all files
classic/megamenu-classic.css
+15 -5
View File
@@ -59,6 +59,15 @@
padding: 0;
}
.mega-menu-top-item:hover,
.mega-menu-top-item:focus-within,
.mega-menu-top-item:active,
.mega-menu-top-item.is-open,
.mega-menu-top-item.is-active {
background: #f3f2f1;
color: #323130;
}
.mega-menu-mode-flyout .mega-menu-top-item {
position: relative;
}
@@ -114,8 +123,8 @@
.menu-item-text:hover,
.menu-item-toggle:hover,
.menu-item-toggle[aria-expanded="true"] {
background: #f3f2f1;
color: #323130;
background: transparent;
color: inherit;
text-decoration: none;
}
@@ -258,8 +267,9 @@
outline: none;
}
.flyout-link:hover,
.flyout-item:focus-within > .flyout-link {
.flyout-item:hover > .flyout-link,
.flyout-item:focus-within > .flyout-link,
.flyout-item:active > .flyout-link {
background: #f3f2f1;
color: #323130;
}
@@ -368,7 +378,7 @@
border-bottom: 1px solid #edebe9;
}
.menu-item-toggle { width: 44px; margin: 0; border-left: 1px solid #edebe9; }
.menu-item-toggle { width: 44px; margin: 0; border-left: 0; }
.mega-menu {
position: static;
classic/megamenu-services-standalone.js
+20 -5
View File
@@ -122,7 +122,7 @@
_cacheKey() {
const normalize = value => encodeURIComponent(String(value || '').trim().toLowerCase());
return 'MegaMenu:TermSet:v3:' + normalize(this._siteCollectionUrl) + ':' + normalize(this.termSetIdentifier) + ':' + this._languageLcid + ':' + normalize(this._cacheVersion);
return 'MegaMenu:TermSet:v4:' + normalize(this._siteCollectionUrl) + ':' + normalize(this.termSetIdentifier) + ':' + this._languageLcid + ':' + normalize(this._cacheVersion);
}
_getCache(allowExpired) {
@@ -190,7 +190,9 @@
while (enumerator.moveNext()) {
const term = enumerator.get_current();
const properties = this._getCustomProperties(term);
if (!term.get_isAvailableForTagging() || term.get_isDeprecated() || this._asBoolean(properties['MegaMenu.Hidden'])) {
if (!term.get_isAvailableForTagging() || term.get_isDeprecated() ||
this._asBoolean(properties['MegaMenu.Hidden']) ||
this._isExcludedFromGlobalNavigation(properties)) {
continue;
}
processedTerms.push({
@@ -215,6 +217,7 @@
_Sys_Nav_SimpleLinkUrl: props._Sys_Nav_SimpleLinkUrl || null,
_Sys_Nav_TargetUrl: props._Sys_Nav_TargetUrl || null,
_Sys_Nav_HoverText: props._Sys_Nav_HoverText || null,
_Sys_Nav_ExcludedProviders: props._Sys_Nav_ExcludedProviders || null,
'MegaMenu.Hidden': props['MegaMenu.Hidden'] || null,
'MegaMenu.OpenInNewWindow': props['MegaMenu.OpenInNewWindow'] || null,
'MegaMenu.Description': props['MegaMenu.Description'] || null
@@ -228,13 +231,24 @@
return value === true || ['true', '1', 'yes', 'ja'].indexOf(String(value || '').toLowerCase()) >= 0;
}
_isExcludedFromGlobalNavigation(properties) {
const value = String((properties || {})._Sys_Nav_ExcludedProviders || '').replace(/["']/g, '');
return value.split(/[;,|]/).some(provider =>
provider.trim().toLowerCase() === 'globalnavigationtaxonomyprovider'
);
}
_processTerms(termsData) {
const itemsDict = new ItemDictionary();
const itemsByPath = {};
const menuItems = [];
const visibleTerms = termsData.filter(termData =>
!this._asBoolean((termData.LocalCustomProperties || {})['MegaMenu.Hidden']) &&
!this._isExcludedFromGlobalNavigation(termData.LocalCustomProperties)
);
// Create MenuItem objects
termsData.forEach(termData => {
visibleTerms.forEach(termData => {
const menuItem = new MenuItem(termData, 0, this._siteCollectionUrl);
itemsDict.Add(termData.Id, menuItem);
itemsByPath[termData.PathOfTerm] = menuItem;
@@ -245,7 +259,7 @@
});
// Build hierarchy
termsData.forEach(termData => {
visibleTerms.forEach(termData => {
if (termData.PathOfTerm && termData.PathOfTerm.split(';').length > 1) {
const menuItem = itemsDict.Get(termData.Id);
const pathParts = termData.PathOfTerm.split(';');
@@ -484,6 +498,7 @@
renderer.closeAll(panel);
toggle.setAttribute('aria-expanded', String(open));
toggle.setAttribute('aria-label', (open ? renderer.strings.closeSubmenu : renderer.strings.openSubmenu) + ' ' + renderer.getToggleLabel(toggle));
parent.classList.toggle('is-open', open);
panel.setAttribute('aria-expanded', String(open));
panel.classList.toggle('js-open', open);
};
@@ -499,7 +514,7 @@
});
let closeTimer;
parent.addEventListener('mouseenter', () => { window.clearTimeout(closeTimer); setOpen(true); });
parent.addEventListener('mouseleave', () => { closeTimer = window.setTimeout(() => setOpen(false), 180); });
parent.addEventListener('mouseleave', () => { closeTimer = window.setTimeout(() => setOpen(false), 0); });
});
const flyoutToggles = document.querySelectorAll('#Mega-Menu .flyout-toggle');