From 50eb1f3a43998be9d4dd97f1e48c6a6d38513ea8 Mon Sep 17 00:00:00 2001
From: Vegard Haugstvedt <it.vegard@gmail.com>
Date: Wed, 20 Sep 2023 15:11:25 +0200
Subject: [PATCH 1/4] Remove tabIndex="-1" for Popover component, to fix
 VoiceOver bug where navigation inside the Popover doesn't work.

This affects Datepicker, Dropdown, Timeline and the Popover components, but appears to cause no bugs.

Ref: https://nav-it.slack.com/archives/C7NE7A8UF/p1694158816166729
---
 @navikt/core/react/src/popover/Popover.tsx | 1 -
 1 file changed, 1 deletion(-)

diff --git a/@navikt/core/react/src/popover/Popover.tsx b/@navikt/core/react/src/popover/Popover.tsx
index 764209c2c7..96fe6e76d9 100644
--- a/@navikt/core/react/src/popover/Popover.tsx
+++ b/@navikt/core/react/src/popover/Popover.tsx
@@ -210,7 +210,6 @@ export const Popover = forwardRef<HTMLDivElement, PopoverProps>(
         })}
         data-placement={flPlacement}
         aria-hidden={!open || !anchorEl}
-        tabIndex={-1}
         {...getFloatingProps({
           ref: floatingRef,
           style: {

From f95ae8342fcbde7bf1dff7c99ede13fd433cc22b Mon Sep 17 00:00:00 2001
From: Vegard Haugstvedt <it.vegard@gmail.com>
Date: Wed, 20 Sep 2023 15:13:02 +0200
Subject: [PATCH 2/4] Add changeset

---
 .changeset/slimy-rocks-talk.md | 5 +++++
 1 file changed, 5 insertions(+)
 create mode 100644 .changeset/slimy-rocks-talk.md

diff --git a/.changeset/slimy-rocks-talk.md b/.changeset/slimy-rocks-talk.md
new file mode 100644
index 0000000000..12d8591216
--- /dev/null
+++ b/.changeset/slimy-rocks-talk.md
@@ -0,0 +1,5 @@
+---
+"@navikt/ds-react": patch
+---
+
+Remove tabIndex="-1" on Popover to fix VoiceOver navigation issue inside Popover

From a5241968965213b97a4ffac82f446314064834ad Mon Sep 17 00:00:00 2001
From: Vegard Haugstvedt <it.vegard@gmail.com>
Date: Wed, 20 Sep 2023 15:53:32 +0200
Subject: [PATCH 3/4] Might not be the best way, but it works. getFloatingProps
 added it's own tabIndex="-1", which we need to get rid of.

---
 @navikt/core/react/src/popover/Popover.tsx | 19 +++++++++++--------
 1 file changed, 11 insertions(+), 8 deletions(-)

diff --git a/@navikt/core/react/src/popover/Popover.tsx b/@navikt/core/react/src/popover/Popover.tsx
index 96fe6e76d9..4a668bc092 100644
--- a/@navikt/core/react/src/popover/Popover.tsx
+++ b/@navikt/core/react/src/popover/Popover.tsx
@@ -203,6 +203,16 @@ export const Popover = forwardRef<HTMLDivElement, PopoverProps>(
       left: "right",
     }[flPlacement.split("-")[0]];
 
+    const floatingProps = getFloatingProps({
+      ref: floatingRef,
+      style: {
+        position: strategy,
+        top: y ?? 0,
+        left: x ?? 0,
+      },
+    });
+    delete floatingProps.tabIndex;
+
     return (
       <div
         className={cl("navds-popover", className, {
@@ -210,14 +220,7 @@ export const Popover = forwardRef<HTMLDivElement, PopoverProps>(
         })}
         data-placement={flPlacement}
         aria-hidden={!open || !anchorEl}
-        {...getFloatingProps({
-          ref: floatingRef,
-          style: {
-            position: strategy,
-            top: y ?? 0,
-            left: x ?? 0,
-          },
-        })}
+        {...floatingProps}
         {...rest}
       >
         {children}

From 3d04aef902f1a4a42b7adeaf279ab0130a1c9e51 Mon Sep 17 00:00:00 2001
From: Vegard Haugstvedt <it.vegard@gmail.com>
Date: Fri, 22 Sep 2023 12:43:11 +0200
Subject: [PATCH 4/4] Seems like getFloatingProps can take "tabIndex:
 undefined" as an option, reducing the amount of code we need to change.

---
 @navikt/core/react/src/popover/Popover.tsx | 20 +++++++++-----------
 1 file changed, 9 insertions(+), 11 deletions(-)

diff --git a/@navikt/core/react/src/popover/Popover.tsx b/@navikt/core/react/src/popover/Popover.tsx
index 4a668bc092..70a8fc9325 100644
--- a/@navikt/core/react/src/popover/Popover.tsx
+++ b/@navikt/core/react/src/popover/Popover.tsx
@@ -203,16 +203,6 @@ export const Popover = forwardRef<HTMLDivElement, PopoverProps>(
       left: "right",
     }[flPlacement.split("-")[0]];
 
-    const floatingProps = getFloatingProps({
-      ref: floatingRef,
-      style: {
-        position: strategy,
-        top: y ?? 0,
-        left: x ?? 0,
-      },
-    });
-    delete floatingProps.tabIndex;
-
     return (
       <div
         className={cl("navds-popover", className, {
@@ -220,7 +210,15 @@ export const Popover = forwardRef<HTMLDivElement, PopoverProps>(
         })}
         data-placement={flPlacement}
         aria-hidden={!open || !anchorEl}
-        {...floatingProps}
+        {...getFloatingProps({
+          ref: floatingRef,
+          style: {
+            position: strategy,
+            top: y ?? 0,
+            left: x ?? 0,
+          },
+          tabIndex: undefined,
+        })}
         {...rest}
       >
         {children}