optimized-react-component-library-xyz123 2.8.6 → 2.8.8

package/dist/index.mjs

@@ -3708,7 +3708,7 @@ var Header = ({
 var HeaderStandard_default = Header;
 
 // src/components/layout/NavigationHeaderStandard/NavigationHeaderStandard.tsx
-import { useEffect as useEffect14, useRef as useRef4, useState as useState11 } from "react";
+import { useRef as useRef4, useState as useState11 } from "react";
 
 // src/components/layout/NavigationStandard/NavigationStandard.tsx
 import { useEffect as useEffect13, useState as useState9, useRef as useRef3 } from "react";
@@ -3719,8 +3719,8 @@ var Navigation = ({
   activatedLanguage = "sv",
   menuLinks = [],
   openButtonRef = null,
-  linkComponent: LinkComponent = (props) => /* @__PURE__ */ jsx28("a", { ...props })
-  //setKeyboardNavigationClose,
+  linkComponent: LinkComponent = (props) => /* @__PURE__ */ jsx28("a", { ...props }),
+  navigationCloseFocusId
 }) => {
   const closeMenuText = activatedLanguage === "sv" ? "St\xE4ng meny" : "Close menu";
   const navRef = useRef3(null);
@@ -3728,10 +3728,10 @@ var Navigation = ({
   const handleSubMenu = (label) => {
     setOpenSubMenu(openSubMenu === label ? null : label);
   };
-  const handleCloseButton = (type) => {
+  const handleMenuClick = (typeOfInteraction) => {
     var _a, _b;
-    setIsMenyOpen && setIsMenyOpen(false);
-    type === "close" ? (_a = openButtonRef == null ? void 0 : openButtonRef.current) == null ? void 0 : _a.focus() : (_b = document.getElementById("page-start")) == null ? void 0 : _b.focus();
+    setIsMenyOpen == null ? void 0 : setIsMenyOpen(false);
+    typeOfInteraction === "close" ? (_a = openButtonRef == null ? void 0 : openButtonRef.current) == null ? void 0 : _a.focus() : navigationCloseFocusId && ((_b = document.getElementById(navigationCloseFocusId)) == null ? void 0 : _b.focus());
   };
   useEffect13(() => {
     if (!isOpen || !navRef.current) return;
@@ -3789,12 +3789,13 @@ var Navigation = ({
       "aria-label": activatedLanguage === "sv" ? "Huvudnavigation" : "Main navigation",
       className: `pts-navigation-menu-container ${isOpen ? "open" : ""}`,
       inert: !isOpen,
+      "aria-expanded": isOpen,
       children: [
         /* @__PURE__ */ jsx28("div", { className: "pts-navigation-close-container ", id: "menu-close", children: /* @__PURE__ */ jsxs24(
           "button",
           {
             className: "pts-navigation-close-button",
-            onClick: () => handleCloseButton("close"),
+            onClick: () => handleMenuClick("close"),
             type: "button",
             children: [
               /* @__PURE__ */ jsx28("span", { "aria-hidden": "true", children: /* @__PURE__ */ jsx28(CloseIcon, {}) }),
@@ -3812,9 +3813,7 @@ var Navigation = ({
                 /* @__PURE__ */ jsx28("span", { children: href && href.length === 0 ? /* @__PURE__ */ jsx28("span", { children: label[activatedLanguage] }) : /* @__PURE__ */ jsx28(
                   LinkComponent,
                   {
-                    onClick: () => {
-                      handleCloseButton("link");
-                    },
+                    onClick: () => handleMenuClick("link"),
                     href,
                     children: label[activatedLanguage]
                   }
@@ -3844,9 +3843,7 @@ var Navigation = ({
                   children: /* @__PURE__ */ jsx28("ul", { className: "pts-sub-navigation-list", lang: activatedLanguage, children: children.map(({ label: label2, href: href2 }, index2) => /* @__PURE__ */ jsx28("li", { className: "pts-sub-navigation-item", lang: activatedLanguage, children: /* @__PURE__ */ jsx28(
                     LinkComponent,
                     {
-                      onClick: () => {
-                        handleCloseButton("link");
-                      },
+                      onClick: () => handleMenuClick("link"),
                       href: href2,
                       children: label2[activatedLanguage]
                     }
@@ -3942,26 +3939,10 @@ var NavigationHeader = ({
     else return "Svenska";
   };
   const [isMenuOpen, setIsMenuOpen] = useState11(false);
-  const [hasBeenOpen, setHasBeenOpen] = useState11(false);
   const menuButtonFocusRef = useRef4(null);
   const handleMenuClick = () => {
-    setIsMenuOpen((prev) => {
-      const open = !prev;
-      if (open) {
-        setHasBeenOpen(true);
-      }
-      return open;
-    });
+    setIsMenuOpen((prev) => !prev);
   };
-  const [instruction, setInstruction] = useState11("");
-  useEffect14(() => {
-    if (!hasBeenOpen) {
-      return;
-    }
-    setInstruction(
-      isMenuOpen ? activatedLanguage === "sv" ? "Navigationsmenyn \xF6ppnades" : "Navigation menu opened" : activatedLanguage === "sv" ? "Navigationsmenyn st\xE4ngdes" : "Navigation menu closed"
-    );
-  }, [isMenuOpen, activatedLanguage]);
   const getMenuLabel = () => {
     const labels = {
       sv: isMenuOpen ? "St\xE4ng meny" : "Meny",
@@ -4038,22 +4019,18 @@ var NavigationHeader = ({
         )
       ] }) })
     ] }) }),
-    useNavigationMenu && /* @__PURE__ */ jsxs27(Fragment19, { children: [
-      /* @__PURE__ */ jsx31("div", { "aria-live": "polite", className: "sr-only", children: instruction }),
-      /* @__PURE__ */ jsx31(
-        NavigationStandard_default,
-        {
-          activatedLanguage,
-          setIsMenyOpen: setIsMenuOpen,
-          menuLinks,
-          isOpen: isMenuOpen,
-          openButtonRef: menuButtonFocusRef,
-          linkComponent: LinkComponent,
-          setKeyboardNavigationClose: () => {
-          }
-        }
-      )
-    ] }),
+    useNavigationMenu && /* @__PURE__ */ jsx31(Fragment19, { children: /* @__PURE__ */ jsx31(
+      NavigationStandard_default,
+      {
+        activatedLanguage,
+        setIsMenyOpen: setIsMenuOpen,
+        menuLinks,
+        isOpen: isMenuOpen,
+        openButtonRef: menuButtonFocusRef,
+        linkComponent: LinkComponent,
+        navigationCloseFocusId
+      }
+    ) }),
     isMenuOpen && /* @__PURE__ */ jsx31(
       "div",
       {