optimized-react-component-library-xyz123 2.8.7 → 2.8.9
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.js +102 -105
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +103 -106
- package/dist/index.mjs.map +1 -1
- package/package.json +1 -1
package/dist/index.js
CHANGED
|
@@ -3807,6 +3807,7 @@ var Navigation = ({
|
|
|
3807
3807
|
}) => {
|
|
3808
3808
|
const closeMenuText = activatedLanguage === "sv" ? "St\xE4ng meny" : "Close menu";
|
|
3809
3809
|
const navRef = (0, import_react16.useRef)(null);
|
|
3810
|
+
const firstVisitRef = (0, import_react16.useRef)(true);
|
|
3810
3811
|
const [openSubMenu, setOpenSubMenu] = (0, import_react16.useState)(null);
|
|
3811
3812
|
const handleSubMenu = (label) => {
|
|
3812
3813
|
setOpenSubMenu(openSubMenu === label ? null : label);
|
|
@@ -3864,85 +3865,98 @@ var Navigation = ({
|
|
|
3864
3865
|
}
|
|
3865
3866
|
return "\xD6ppna undermeny f\xF6r " + label["sv"];
|
|
3866
3867
|
};
|
|
3867
|
-
|
|
3868
|
-
|
|
3869
|
-
{
|
|
3870
|
-
|
|
3871
|
-
|
|
3872
|
-
|
|
3873
|
-
|
|
3874
|
-
|
|
3875
|
-
|
|
3876
|
-
|
|
3877
|
-
|
|
3878
|
-
|
|
3879
|
-
|
|
3880
|
-
|
|
3881
|
-
|
|
3882
|
-
|
|
3883
|
-
|
|
3884
|
-
|
|
3885
|
-
|
|
3886
|
-
|
|
3887
|
-
|
|
3888
|
-
|
|
3889
|
-
|
|
3890
|
-
|
|
3891
|
-
|
|
3892
|
-
|
|
3893
|
-
|
|
3894
|
-
|
|
3895
|
-
|
|
3896
|
-
|
|
3897
|
-
|
|
3898
|
-
|
|
3899
|
-
|
|
3900
|
-
|
|
3901
|
-
|
|
3902
|
-
|
|
3903
|
-
|
|
3904
|
-
|
|
3868
|
+
const [instruction, setInstruction] = (0, import_react16.useState)("");
|
|
3869
|
+
(0, import_react16.useEffect)(() => {
|
|
3870
|
+
if (firstVisitRef.current) {
|
|
3871
|
+
firstVisitRef.current = false;
|
|
3872
|
+
return;
|
|
3873
|
+
}
|
|
3874
|
+
if (isOpen)
|
|
3875
|
+
requestAnimationFrame(() => {
|
|
3876
|
+
setInstruction(
|
|
3877
|
+
activatedLanguage === "sv" ? "Navigationsmenyn \xF6ppnades" : "Navigation menu opened"
|
|
3878
|
+
);
|
|
3879
|
+
});
|
|
3880
|
+
}, [isOpen, activatedLanguage]);
|
|
3881
|
+
return /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)(import_jsx_runtime28.Fragment, { children: [
|
|
3882
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsx)("div", { "aria-live": "polite", className: "sr-only", children: instruction }),
|
|
3883
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsxs)(
|
|
3884
|
+
"nav",
|
|
3885
|
+
{
|
|
3886
|
+
id: "main-navigation",
|
|
3887
|
+
ref: navRef,
|
|
3888
|
+
"aria-label": activatedLanguage === "sv" ? "Huvudnavigation" : "Main navigation",
|
|
3889
|
+
className: `pts-navigation-menu-container ${isOpen ? "open" : ""}`,
|
|
3890
|
+
inert: !isOpen,
|
|
3891
|
+
"aria-expanded": isOpen,
|
|
3892
|
+
children: [
|
|
3893
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsx)("div", { className: "pts-navigation-close-container ", id: "menu-close", children: /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)(
|
|
3894
|
+
"button",
|
|
3895
|
+
{
|
|
3896
|
+
className: "pts-navigation-close-button",
|
|
3897
|
+
onClick: () => handleMenuClick("close"),
|
|
3898
|
+
type: "button",
|
|
3899
|
+
children: [
|
|
3900
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsx)("span", { "aria-hidden": "true", children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(CloseIcon, {}) }),
|
|
3901
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsx)("span", { className: "pts-navigation-close-text", children: closeMenuText })
|
|
3902
|
+
]
|
|
3903
|
+
}
|
|
3904
|
+
) }),
|
|
3905
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsx)("ul", { className: "pts-navigation-link-list", lang: activatedLanguage, children: menuLinks && menuLinks.map(({ label, href, children }, index) => /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)(
|
|
3906
|
+
"li",
|
|
3907
|
+
{
|
|
3908
|
+
className: `pts-navigation-link ${openSubMenu === label[activatedLanguage] ? "open" : ""}`,
|
|
3909
|
+
lang: activatedLanguage,
|
|
3910
|
+
children: [
|
|
3911
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsx)("div", { children: /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("div", { className: "pts-navigation-button", children: [
|
|
3912
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsx)("span", { children: href && href.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("span", { children: label[activatedLanguage] }) : /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
|
|
3913
|
+
LinkComponent,
|
|
3914
|
+
{
|
|
3915
|
+
onClick: () => handleMenuClick("link"),
|
|
3916
|
+
href,
|
|
3917
|
+
children: label[activatedLanguage]
|
|
3918
|
+
}
|
|
3919
|
+
) }),
|
|
3920
|
+
children && /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
|
|
3921
|
+
"button",
|
|
3922
|
+
{
|
|
3923
|
+
className: `pts-navigation-link-expand-button`,
|
|
3924
|
+
onClick: () => handleSubMenu(label[activatedLanguage]),
|
|
3925
|
+
"aria-label": getSubMenuAriaLabel(label),
|
|
3926
|
+
"aria-expanded": openSubMenu === label[activatedLanguage],
|
|
3927
|
+
"aria-controls": "sub-menu-" + index,
|
|
3928
|
+
type: "button",
|
|
3929
|
+
id: "menu-button-" + index,
|
|
3930
|
+
children: openSubMenu === label[activatedLanguage] ? /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("span", { "aria-hidden": true, className: "pts-contract-icon", children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(MinusIcon, {}) }) : /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("span", { "aria-hidden": true, className: "pts-expand-icon", children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(AddIcon, {}) })
|
|
3931
|
+
}
|
|
3932
|
+
)
|
|
3933
|
+
] }) }),
|
|
3905
3934
|
children && /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
|
|
3906
|
-
"
|
|
3935
|
+
"div",
|
|
3907
3936
|
{
|
|
3908
|
-
|
|
3909
|
-
|
|
3910
|
-
"
|
|
3911
|
-
"
|
|
3912
|
-
|
|
3913
|
-
|
|
3914
|
-
|
|
3915
|
-
|
|
3937
|
+
hidden: openSubMenu !== label[activatedLanguage],
|
|
3938
|
+
"aria-hidden": openSubMenu !== label[activatedLanguage],
|
|
3939
|
+
className: "pts-sub-navigation-container",
|
|
3940
|
+
id: "sub-menu-" + index,
|
|
3941
|
+
role: "region",
|
|
3942
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("ul", { className: "pts-sub-navigation-list", lang: activatedLanguage, children: children.map(({ label: label2, href: href2 }, index2) => /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("li", { className: "pts-sub-navigation-item", lang: activatedLanguage, children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
|
|
3943
|
+
LinkComponent,
|
|
3944
|
+
{
|
|
3945
|
+
onClick: () => handleMenuClick("link"),
|
|
3946
|
+
href: href2,
|
|
3947
|
+
children: label2[activatedLanguage]
|
|
3948
|
+
}
|
|
3949
|
+
) }, "nav-child-" + index2)) })
|
|
3916
3950
|
}
|
|
3917
3951
|
)
|
|
3918
|
-
]
|
|
3919
|
-
|
|
3920
|
-
|
|
3921
|
-
|
|
3922
|
-
|
|
3923
|
-
|
|
3924
|
-
|
|
3925
|
-
|
|
3926
|
-
role: "region",
|
|
3927
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("ul", { className: "pts-sub-navigation-list", lang: activatedLanguage, children: children.map(({ label: label2, href: href2 }, index2) => /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("li", { className: "pts-sub-navigation-item", lang: activatedLanguage, children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
|
|
3928
|
-
LinkComponent,
|
|
3929
|
-
{
|
|
3930
|
-
onClick: () => {
|
|
3931
|
-
handleMenuClick("link");
|
|
3932
|
-
},
|
|
3933
|
-
href: href2,
|
|
3934
|
-
children: label2[activatedLanguage]
|
|
3935
|
-
}
|
|
3936
|
-
) }, "nav-child-" + index2)) })
|
|
3937
|
-
}
|
|
3938
|
-
)
|
|
3939
|
-
]
|
|
3940
|
-
},
|
|
3941
|
-
"nav-" + index
|
|
3942
|
-
)) })
|
|
3943
|
-
]
|
|
3944
|
-
}
|
|
3945
|
-
) });
|
|
3952
|
+
]
|
|
3953
|
+
},
|
|
3954
|
+
"nav-" + index
|
|
3955
|
+
)) })
|
|
3956
|
+
]
|
|
3957
|
+
}
|
|
3958
|
+
)
|
|
3959
|
+
] });
|
|
3946
3960
|
};
|
|
3947
3961
|
var NavigationStandard_default = Navigation;
|
|
3948
3962
|
|
|
@@ -4025,24 +4039,10 @@ var NavigationHeader = ({
|
|
|
4025
4039
|
else return "Svenska";
|
|
4026
4040
|
};
|
|
4027
4041
|
const [isMenuOpen, setIsMenuOpen] = (0, import_react18.useState)(false);
|
|
4028
|
-
const [hasBeenOpen, setHasBeenOpen] = (0, import_react18.useState)(false);
|
|
4029
4042
|
const menuButtonFocusRef = (0, import_react18.useRef)(null);
|
|
4030
4043
|
const handleMenuClick = () => {
|
|
4031
|
-
setIsMenuOpen((prev) =>
|
|
4032
|
-
const open = !prev;
|
|
4033
|
-
if (open) {
|
|
4034
|
-
setHasBeenOpen(true);
|
|
4035
|
-
}
|
|
4036
|
-
return open;
|
|
4037
|
-
});
|
|
4044
|
+
setIsMenuOpen((prev) => !prev);
|
|
4038
4045
|
};
|
|
4039
|
-
const [instruction, setInstruction] = (0, import_react18.useState)("");
|
|
4040
|
-
(0, import_react18.useEffect)(() => {
|
|
4041
|
-
if (!isMenuOpen)
|
|
4042
|
-
return;
|
|
4043
|
-
const message = activatedLanguage === "sv" ? "Navigationsmenyn \xF6ppnades" : "Navigation menu opened";
|
|
4044
|
-
setInstruction(message);
|
|
4045
|
-
}, [isMenuOpen, activatedLanguage]);
|
|
4046
4046
|
const getMenuLabel = () => {
|
|
4047
4047
|
const labels = {
|
|
4048
4048
|
sv: isMenuOpen ? "St\xE4ng meny" : "Meny",
|
|
@@ -4119,21 +4119,18 @@ var NavigationHeader = ({
|
|
|
4119
4119
|
)
|
|
4120
4120
|
] }) })
|
|
4121
4121
|
] }) }),
|
|
4122
|
-
useNavigationMenu && /* @__PURE__ */ (0, import_jsx_runtime31.
|
|
4123
|
-
|
|
4124
|
-
|
|
4125
|
-
|
|
4126
|
-
|
|
4127
|
-
|
|
4128
|
-
|
|
4129
|
-
|
|
4130
|
-
|
|
4131
|
-
|
|
4132
|
-
|
|
4133
|
-
|
|
4134
|
-
}
|
|
4135
|
-
)
|
|
4136
|
-
] }),
|
|
4122
|
+
useNavigationMenu && /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_jsx_runtime31.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
|
|
4123
|
+
NavigationStandard_default,
|
|
4124
|
+
{
|
|
4125
|
+
activatedLanguage,
|
|
4126
|
+
setIsMenyOpen: setIsMenuOpen,
|
|
4127
|
+
menuLinks,
|
|
4128
|
+
isOpen: isMenuOpen,
|
|
4129
|
+
openButtonRef: menuButtonFocusRef,
|
|
4130
|
+
linkComponent: LinkComponent,
|
|
4131
|
+
navigationCloseFocusId
|
|
4132
|
+
}
|
|
4133
|
+
) }),
|
|
4137
4134
|
isMenuOpen && /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
|
|
4138
4135
|
"div",
|
|
4139
4136
|
{
|