diff --git a/libs/react-components/src/lib/components/Header/Header.stories.tsx b/libs/react-components/src/lib/components/Header/Header.stories.tsx
index a1e156f..be98ec3 100644
--- a/libs/react-components/src/lib/components/Header/Header.stories.tsx
+++ b/libs/react-components/src/lib/components/Header/Header.stories.tsx
@@ -93,6 +93,24 @@ const meta = {
type: 'button',
},
],
+ announcementContent: (
+
+ ),
},
} satisfies Meta;
diff --git a/libs/react-components/src/lib/components/Header/index.tsx b/libs/react-components/src/lib/components/Header/index.tsx
index 0bc7954..d7837bb 100644
--- a/libs/react-components/src/lib/components/Header/index.tsx
+++ b/libs/react-components/src/lib/components/Header/index.tsx
@@ -54,6 +54,10 @@ interface HeaderProps {
* Secondary menu content for mobile view
*/
secondaryMenu?: { menuElement: JSX.Element; title: string };
+ /**
+ * Announcement content to be displayed in the header
+ */
+ announcementContent?: React.ReactNode;
}
const Header: React.FC = ({
@@ -65,6 +69,7 @@ const Header: React.FC = ({
onLanguageChange,
selectedLanguage,
secondaryMenu,
+ announcementContent,
}) => {
const [activeNavItem, setActiveNavItem] = useState(
navItems.findIndex((item) => item.active)
@@ -143,7 +148,12 @@ const Header: React.FC = ({
>
{/* Header utility bar with the language switcher begins */}
-
+
+ {announcementContent && announcementContent}