diff --git a/src/MainNavigation/MegaMenu.tsx b/src/MainNavigation/MegaMenu.tsx
index e82353151..5ccd80d8c 100644
--- a/src/MainNavigation/MegaMenu.tsx
+++ b/src/MainNavigation/MegaMenu.tsx
@@ -26,16 +26,24 @@ export namespace MegaMenuProps {
};
export type Category = {
- categoryMainLink: {
- text: ReactNode;
- linkProps: RegisteredLinkProps;
- };
links: {
text: ReactNode;
linkProps: RegisteredLinkProps;
isActive?: boolean;
}[];
- };
+ } & (
+ | {
+ categoryMainLink: {
+ text: ReactNode;
+ linkProps: RegisteredLinkProps;
+ };
+ categoryMainText?: never;
+ }
+ | {
+ categoryMainText: ReactNode;
+ categoryMainLink?: never;
+ }
+ );
}
export const MegaMenu = memo(
@@ -101,30 +109,42 @@ export const MegaMenu = memo(
)}
- {categories.map(({ categoryMainLink, links }, i) => (
+ {categories.map(({ categoryMainLink, categoryMainText, links }, i) => (
-
-
- {categoryMainLink.text}
-
-
+
+ {categoryMainLink.text}
+
+
+ )}
+ {categoryMainText !== undefined && (
+
+ {categoryMainText}
+
+ )}
{links.map(({ linkProps, text, isActive }, j) => (
-
diff --git a/stories/MainNavigation.stories.tsx b/stories/MainNavigation.stories.tsx
index 940737382..ddc20821a 100644
--- a/stories/MainNavigation.stories.tsx
+++ b/stories/MainNavigation.stories.tsx
@@ -9,8 +9,8 @@ const { meta, getStory } = getStoryFactory({
"wrappedComponent": { "MainNavigation": Header },
"description": `
- [See DSFR documentation](https://www.systeme-de-design.gouv.fr/elements-d-interface/composants/navigation-principale)
-- [See source code](https://github.com/codegouvfr/react-dsfr/tree/main/src/MainNavigation)
-
+- [See source code](https://github.com/codegouvfr/react-dsfr/tree/main/src/MainNavigation)
+
This component isn't meant to be used directly but via the [\\](https://components.react-dsfr.codegouv.studio/?path=/docs/components-header)`,
"argTypes": {
"brandTop": {
@@ -265,12 +265,7 @@ export const MegaMenu = getStory({
]
},
{
- "categoryMainLink": {
- "text": "Nom de catégorie",
- "linkProps": {
- "href": "#"
- }
- },
+ "categoryMainText": "Nom de catégorie sans lien",
"links": [
{
"text": "Lien de navigation",