@digital-b2c/coreui-kit 0.15.0 → 0.15.1

package/dist/index.cjs

@@ -3175,7 +3175,7 @@ var useIsAtTop = () => {
 
 // src/widgets/Navigation/Navigation.module.scss
 var Navigation_module_default = {
-  internalDropdownTitle: "Navigation_module_internalDropdownTitle",
+  dropdownTitle: "Navigation_module_dropdownTitle",
   mobileItemLink: "Navigation_module_mobileItemLink",
   mobileItemTrigger: "Navigation_module_mobileItemTrigger",
   mobileSubLink: "Navigation_module_mobileSubLink",
@@ -3203,6 +3203,7 @@ var Navigation_module_default = {
   Navigation: "Navigation_module_Navigation",
   mainBar: "Navigation_module_mainBar",
   navTabLink: "Navigation_module_navTabLink",
+  navTabActive: "Navigation_module_navTabActive",
   inner: "Navigation_module_inner",
   topRow: "Navigation_module_topRow",
   logoLink: "Navigation_module_logoLink",
@@ -3213,15 +3214,14 @@ var Navigation_module_default = {
   navTab: "Navigation_module_navTab",
   navTabTrigger: "Navigation_module_navTabTrigger",
   navTabTriggerOpen: "Navigation_module_navTabTriggerOpen",
-  navTabActive: "Navigation_module_navTabActive",
-  internalDropdownPanel: "Navigation_module_internalDropdownPanel",
-  internalDropdownInner: "Navigation_module_internalDropdownInner",
-  internalDropdownLinks: "Navigation_module_internalDropdownLinks",
+  dropdownPanel: "Navigation_module_dropdownPanel",
+  dropdownInner: "Navigation_module_dropdownInner",
+  dropdownLinks: "Navigation_module_dropdownLinks",
   dropdownLinkItem: "Navigation_module_dropdownLinkItem",
-  internalDropdownLink: "Navigation_module_internalDropdownLink",
+  dropdownLink: "Navigation_module_dropdownLink",
   dropdownDivider: "Navigation_module_dropdownDivider",
-  internalDropdownInfo: "Navigation_module_internalDropdownInfo",
-  internalDropdownDescription: "Navigation_module_internalDropdownDescription",
+  dropdownInfo: "Navigation_module_dropdownInfo",
+  dropdownDescription: "Navigation_module_dropdownDescription",
   brandBars: "Navigation_module_brandBars",
   brandBar: "Navigation_module_brandBar",
   brandBarsUnfolded: "Navigation_module_brandBarsUnfolded",
@@ -3411,11 +3411,11 @@ var NavigationDropdown = ({
     "div",
     {
       id: panelId,
-      className: clsx47__default.default(Navigation_module_default.internalDropdownPanel, Navigation_module_default.internalDropdownPanelOpen),
+      className: clsx47__default.default(Navigation_module_default.dropdownPanel, Navigation_module_default.dropdownPanelOpen),
       onMouseEnter,
       onMouseLeave,
-      children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: Navigation_module_default.internalDropdownInner, children: [
-        /* @__PURE__ */ jsxRuntime.jsx("ul", { className: Navigation_module_default.internalDropdownLinks, children: links.map((sub, i) => {
+      children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: Navigation_module_default.dropdownInner, children: [
+        /* @__PURE__ */ jsxRuntime.jsx("ul", { className: Navigation_module_default.dropdownLinks, children: links.map((sub, i) => {
           var _a, _b, _c, _d;
           return /* @__PURE__ */ jsxRuntime.jsx(
             "li",
@@ -3427,7 +3427,7 @@ var NavigationDropdown = ({
                 "a",
                 {
                   href: (_a = sub.cta) == null ? void 0 : _a.url,
-                  className: Navigation_module_default.internalDropdownLink,
+                  className: Navigation_module_default.dropdownLink,
                   target: ((_b = sub.cta) == null ? void 0 : _b.isExternal) ? "_blank" : void 0,
                   rel: ((_c = sub.cta) == null ? void 0 : _c.isExternal) ? "noopener noreferrer" : void 0,
                   onKeyDown: (e) => handleLinkKeyDown(e, i === 0, i === links.length - 1),
@@ -3439,9 +3439,9 @@ var NavigationDropdown = ({
           );
         }) }),
         /* @__PURE__ */ jsxRuntime.jsx("span", { className: Navigation_module_default.dropdownDivider, "aria-hidden": "true" }),
-        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: Navigation_module_default.internalDropdownInfo, children: [
-          /* @__PURE__ */ jsxRuntime.jsx("h2", { className: Navigation_module_default.internalDropdownTitle, children: title }),
-          description && /* @__PURE__ */ jsxRuntime.jsx("p", { className: Navigation_module_default.internalDropdownDescription, children: description })
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: Navigation_module_default.dropdownInfo, children: [
+          /* @__PURE__ */ jsxRuntime.jsx("h2", { className: Navigation_module_default.dropdownTitle, children: title }),
+          description && /* @__PURE__ */ jsxRuntime.jsx("div", { className: Navigation_module_default.dropdownDescription, children: description })
         ] })
       ] })
     }
@@ -3468,6 +3468,20 @@ var NavigationMobile = ({
   const toggleExpanded = (index) => {
     setExpanded((prev) => prev.includes(index) ? prev.filter((i) => i !== index) : [...prev, index]);
   };
+  const expandItem = (index) => {
+    setExpanded((prev) => prev.includes(index) ? prev : [...prev, index]);
+  };
+  const collapseItem = (index) => {
+    setExpanded((prev) => prev.filter((i) => i !== index));
+  };
+  const hoverFocusProps = (index) => ({
+    onMouseEnter: () => expandItem(index),
+    onMouseLeave: () => collapseItem(index),
+    onFocus: () => expandItem(index),
+    onBlur: (e) => {
+      if (!e.currentTarget.contains(e.relatedTarget)) collapseItem(index);
+    }
+  });
   const logo = mainLogo ? /* @__PURE__ */ jsxRuntime.jsx(Picture, { className: Navigation_module_default.logoMobile, src: mainLogo, alt: logoAlt }) : null;
   if (isExternal) {
     return /* @__PURE__ */ jsxRuntime.jsxs(
@@ -3506,7 +3520,7 @@ var NavigationMobile = ({
             var _a, _b;
             const subMenuId = `${baseId}-submenu-${index}`;
             const isExpanded = expanded.includes(index);
-            return item.type === "dropdown" ? /* @__PURE__ */ jsxRuntime.jsxs("li", { className: Navigation_module_default.mobileItem, children: [
+            return item.type === "dropdown" ? /* @__PURE__ */ jsxRuntime.jsxs("li", __spreadProps(__spreadValues({ className: Navigation_module_default.mobileItem }, hoverFocusProps(index)), { children: [
               /* @__PURE__ */ jsxRuntime.jsxs(
                 "button",
                 {
@@ -3552,7 +3566,7 @@ var NavigationMobile = ({
                   ) })
                 }
               )
-            ] }, index) : /* @__PURE__ */ jsxRuntime.jsx("li", { children: /* @__PURE__ */ jsxRuntime.jsx("a", { href: (_a = item.cta) == null ? void 0 : _a.url, className: Navigation_module_default.mobileItemLink, onClick: onClose, children: (_b = item.cta) == null ? void 0 : _b.label }) }, index);
+            ] }), index) : /* @__PURE__ */ jsxRuntime.jsx("li", { children: /* @__PURE__ */ jsxRuntime.jsx("a", { href: (_a = item.cta) == null ? void 0 : _a.url, className: Navigation_module_default.mobileItemLink, onClick: onClose, children: (_b = item.cta) == null ? void 0 : _b.label }) }, index);
           }) }),
           /* @__PURE__ */ jsxRuntime.jsx(
             NavigationCtas,
@@ -3614,7 +3628,7 @@ var NavigationMobile = ({
               }
             ) }, index);
           }
-          return /* @__PURE__ */ jsxRuntime.jsxs("li", { className: Navigation_module_default.internalMobileItem, children: [
+          return /* @__PURE__ */ jsxRuntime.jsxs("li", __spreadProps(__spreadValues({ className: Navigation_module_default.internalMobileItem }, hoverFocusProps(index)), { children: [
             /* @__PURE__ */ jsxRuntime.jsxs(
               "button",
               {
@@ -3665,7 +3679,7 @@ var NavigationMobile = ({
                 ) })
               }
             )
-          ] }, index);
+          ] }), index);
         }) }),
         /* @__PURE__ */ jsxRuntime.jsxs("div", { className: Navigation_module_default.mobileFooter, children: [
           /* @__PURE__ */ jsxRuntime.jsx(