From cab4e20a7e51a087fc56440addd7f8106922612b Mon Sep 17 00:00:00 2001
From: Sarka Chwastkova <chwastkova.s@gmail.com>
Date: Tue, 3 Dec 2024 16:30:51 +0100
Subject: [PATCH] feat(NavigationBar): add ariaLabel prop

---
 packages/orbit-components/src/NavigationBar/README.md  | 1 +
 packages/orbit-components/src/NavigationBar/index.tsx  | 4 +++-
 packages/orbit-components/src/NavigationBar/types.d.ts | 1 +
 3 files changed, 5 insertions(+), 1 deletion(-)

diff --git a/packages/orbit-components/src/NavigationBar/README.md b/packages/orbit-components/src/NavigationBar/README.md
index 5de3cb3803..4cd7975431 100644
--- a/packages/orbit-components/src/NavigationBar/README.md
+++ b/packages/orbit-components/src/NavigationBar/README.md
@@ -35,3 +35,4 @@ Table below contains all types of the props available in the NavigationBar compo
 | hideOnScroll | `boolean`               | `true`                   | Turn on or off hiding navigation bar on scroll                                                        |
 | openTitle    | `string`                | `"Open navigation menu"` | Property for passing translation string to open Button.                                               |
 | bottomStyle  | `"shadow" \| "border"`  | `"shadow"`               | Property for setting bottom style of NavigationBar.                                                   |
+| ariaLabel    | `string`                | `"navigation"`           | Optional prop for `aria-label` value (accessibility).                                                 |
diff --git a/packages/orbit-components/src/NavigationBar/index.tsx b/packages/orbit-components/src/NavigationBar/index.tsx
index 907bb9ee83..a0f6ca1a53 100644
--- a/packages/orbit-components/src/NavigationBar/index.tsx
+++ b/packages/orbit-components/src/NavigationBar/index.tsx
@@ -20,6 +20,7 @@ const NavigationBar = ({
   onHide,
   hideOnScroll = true,
   bottomStyle = "shadow",
+  ariaLabel = "navigation",
 }: Props) => {
   const resolveCallback = React.useCallback(
     state => {
@@ -67,10 +68,11 @@ const NavigationBar = ({
         "bg-white-normal p-300 z-navigation-bar fixed inset-x-0 top-0 box-border flex w-full translate-x-0 items-center",
         "duration-normal transform-gpu transition-transform ease-in-out",
         "tb:h-1600 h-[52px]", // As defined on the const above
-        shown ? "translate-y-0" : "tb:-translate-y-1600 translate-y-[-52px]", // As defined on the const above
+        shown ? "translate-y-0" : "tb:-translate-y-1600 -translate-y-xxxl", // As defined on the const above
         bottomStyle === "shadow" && "shadow-fixed",
         bottomStyle === "border" && "border-cloud-normal border-b",
       )}
+      aria-label={ariaLabel}
     >
       <div className="me-200 block w-full">{children}</div>
       {onMenuOpen && (
diff --git a/packages/orbit-components/src/NavigationBar/types.d.ts b/packages/orbit-components/src/NavigationBar/types.d.ts
index 50aa826ea4..75f3e0d4db 100644
--- a/packages/orbit-components/src/NavigationBar/types.d.ts
+++ b/packages/orbit-components/src/NavigationBar/types.d.ts
@@ -12,4 +12,5 @@ export interface Props extends Common.Globals {
   readonly openTitle?: string;
   readonly hideOnScroll?: boolean;
   readonly bottomStyle?: "shadow" | "border";
+  readonly ariaLabel?: string;
 }