@asante-org/atlascopco-vt-litesitegenerator 1.6.37 → 1.6.41

package/dist/index.esm.js

@@ -648,6 +648,7 @@ var LsgHeader = function (_a) {
   var mobileOpen = menuOpen || mobileLevel > 0;
   var columns = children ? [] : getMegaColumns(navItems, activePath);
   var mobileItems = getItemsAtLevel(navItems, activePath, mobileLevel || 1);
+  var mobileBackLabel = activePath[activePath.length - 1] || "menu";
   var dropdownOpen = variant === "dropdown" && hasOpenNavItem(navItems);
   useEffect(function () {
     if (!menuOpen && !dropdownOpen) {
@@ -766,35 +767,25 @@ var LsgHeader = function (_a) {
   var renderMobileMenu = function () {
     return /*#__PURE__*/React.createElement("div", {
       className: "lsg-header__mobile-panel"
-    }, mobileLevel > 1 && /*#__PURE__*/React.createElement("nav", {
-      className: "lsg-header__breadcrumb",
-      "aria-label": "Breadcrumb"
+    }, variant === "dropdown" ? /*#__PURE__*/React.createElement(LsgNavigation, {
+      items: navItems,
+      variant: "dropdown",
+      onItemClick: function (item, level) {
+        return onMobileItemClick === null || onMobileItemClick === void 0 ? void 0 : onMobileItemClick(item, level + 1);
+      }
+    }) : /*#__PURE__*/React.createElement(React.Fragment, null, variant === "mega" && mobileLevel > 1 && /*#__PURE__*/React.createElement("nav", {
+      className: "lsg-header__mobile-back",
+      "aria-label": "Menu navigation"
     }, /*#__PURE__*/React.createElement("button", {
       type: "button",
-      className: "lsg-header__breadcrumb-home",
-      "aria-label": "Back to top-level menu",
+      className: "lsg-header__mobile-back-button",
+      "aria-label": "Back to ".concat(mobileBackLabel),
       onClick: function () {
-        return onMobileBreadcrumbClick === null || onMobileBreadcrumbClick === void 0 ? void 0 : onMobileBreadcrumbClick(1);
+        return onMobileBreadcrumbClick === null || onMobileBreadcrumbClick === void 0 ? void 0 : onMobileBreadcrumbClick(Math.max(1, mobileLevel - 1));
       }
     }, /*#__PURE__*/React.createElement(LsgHeaderIcon, {
-      name: "home"
-    })), activePath.map(function (label, index) {
-      var isCurrent = index === activePath.length - 1;
-      var isMiddleBreadcrumb = index > 0 && !isCurrent;
-      return /*#__PURE__*/React.createElement(React.Fragment, {
-        key: "".concat(label, "-").concat(index)
-      }, /*#__PURE__*/React.createElement(LsgHeaderIcon, {
-        name: "chevronRight"
-      }), /*#__PURE__*/React.createElement("button", {
-        type: "button",
-        className: [isCurrent ? "lsg-header__breadcrumb-current" : "lsg-header__breadcrumb-ancestor", isMiddleBreadcrumb ? "lsg-header__breadcrumb-ancestor--ellipsis" : ""].filter(Boolean).join(" "),
-        "aria-label": isMiddleBreadcrumb ? label : undefined,
-        title: isMiddleBreadcrumb ? label : undefined,
-        onClick: function () {
-          return onMobileBreadcrumbClick === null || onMobileBreadcrumbClick === void 0 ? void 0 : onMobileBreadcrumbClick(index + 1);
-        }
-      }, isMiddleBreadcrumb ? "…" : label));
-    })), /*#__PURE__*/React.createElement("ul", {
+      name: "chevronRight"
+    }), /*#__PURE__*/React.createElement("span", null, "Back to ", mobileBackLabel))), /*#__PURE__*/React.createElement("ul", {
       className: "lsg-header__mobile-list",
       role: "list"
     }, mobileItems.map(function (item, index) {
@@ -816,7 +807,7 @@ var LsgHeader = function (_a) {
       }, /*#__PURE__*/React.createElement("span", null, item.label), hasChildren && /*#__PURE__*/React.createElement(LsgHeaderIcon, {
         name: "chevronRight"
       })));
-    })));
+    }))));
   };
   return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("header", {
     ref: headerRef,