From 274f8b76d7e20bdd7ff62571c0ce4ccce69500e6 Mon Sep 17 00:00:00 2001
From: Robin Malfait <malfait.robin@gmail.com>
Date: Mon, 13 Jun 2022 13:09:05 +0200
Subject: [PATCH 1/4] prevent scrolling the page when using arrow keys in

---
 .../src/components/tabs/tabs.tsx              | 28 ++++++++++--------
 .../src/components/tabs/tabs.ts               | 29 +++++++++++--------
 2 files changed, 33 insertions(+), 24 deletions(-)

diff --git a/packages/@headlessui-react/src/components/tabs/tabs.tsx b/packages/@headlessui-react/src/components/tabs/tabs.tsx
index cf8334017..01ce338ca 100644
--- a/packages/@headlessui-react/src/components/tabs/tabs.tsx
+++ b/packages/@headlessui-react/src/components/tabs/tabs.tsx
@@ -366,18 +366,22 @@ let TabRoot = forwardRefWithAs(function Tab<TTag extends ElementType = typeof DE
         return focusIn(list, Focus.Last)
     }
 
-    return match(orientation, {
-      vertical() {
-        if (event.key === Keys.ArrowUp) return focusIn(list, Focus.Previous | Focus.WrapAround)
-        if (event.key === Keys.ArrowDown) return focusIn(list, Focus.Next | Focus.WrapAround)
-        return
-      },
-      horizontal() {
-        if (event.key === Keys.ArrowLeft) return focusIn(list, Focus.Previous | Focus.WrapAround)
-        if (event.key === Keys.ArrowRight) return focusIn(list, Focus.Next | Focus.WrapAround)
-        return
-      },
-    })
+    if (
+      match(orientation, {
+        vertical() {
+          if (event.key === Keys.ArrowUp) return focusIn(list, Focus.Previous | Focus.WrapAround)
+          if (event.key === Keys.ArrowDown) return focusIn(list, Focus.Next | Focus.WrapAround)
+          return
+        },
+        horizontal() {
+          if (event.key === Keys.ArrowLeft) return focusIn(list, Focus.Previous | Focus.WrapAround)
+          if (event.key === Keys.ArrowRight) return focusIn(list, Focus.Next | Focus.WrapAround)
+          return
+        },
+      })
+    ) {
+      return event.preventDefault()
+    }
   })
 
   let handleFocus = useEvent(() => {
diff --git a/packages/@headlessui-vue/src/components/tabs/tabs.ts b/packages/@headlessui-vue/src/components/tabs/tabs.ts
index afe6d4ea6..3699a3786 100644
--- a/packages/@headlessui-vue/src/components/tabs/tabs.ts
+++ b/packages/@headlessui-vue/src/components/tabs/tabs.ts
@@ -247,18 +247,23 @@ export let Tab = defineComponent({
           return focusIn(list, Focus.Last)
       }
 
-      return match(api.orientation.value, {
-        vertical() {
-          if (event.key === Keys.ArrowUp) return focusIn(list, Focus.Previous | Focus.WrapAround)
-          if (event.key === Keys.ArrowDown) return focusIn(list, Focus.Next | Focus.WrapAround)
-          return
-        },
-        horizontal() {
-          if (event.key === Keys.ArrowLeft) return focusIn(list, Focus.Previous | Focus.WrapAround)
-          if (event.key === Keys.ArrowRight) return focusIn(list, Focus.Next | Focus.WrapAround)
-          return
-        },
-      })
+      if (
+        match(api.orientation.value, {
+          vertical() {
+            if (event.key === Keys.ArrowUp) return focusIn(list, Focus.Previous | Focus.WrapAround)
+            if (event.key === Keys.ArrowDown) return focusIn(list, Focus.Next | Focus.WrapAround)
+            return
+          },
+          horizontal() {
+            if (event.key === Keys.ArrowLeft)
+              return focusIn(list, Focus.Previous | Focus.WrapAround)
+            if (event.key === Keys.ArrowRight) return focusIn(list, Focus.Next | Focus.WrapAround)
+            return
+          },
+        })
+      ) {
+        return event.preventDefault()
+      }
     }
 
     function handleFocus() {

From f5574e919eb972a3cf21410d9bfd1eed74f3cda5 Mon Sep 17 00:00:00 2001
From: Robin Malfait <malfait.robin@gmail.com>
Date: Mon, 13 Jun 2022 13:12:15 +0200
Subject: [PATCH 2/4] update changelog

---
 packages/@headlessui-react/CHANGELOG.md | 1 +
 packages/@headlessui-vue/CHANGELOG.md   | 1 +
 2 files changed, 2 insertions(+)

diff --git a/packages/@headlessui-react/CHANGELOG.md b/packages/@headlessui-react/CHANGELOG.md
index afb18d99c..b0bbeaa43 100644
--- a/packages/@headlessui-react/CHANGELOG.md
+++ b/packages/@headlessui-react/CHANGELOG.md
@@ -18,6 +18,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 - Improve outside click of `Dialog` component ([#1546](https://github.com/tailwindlabs/headlessui/pull/1546))
 - Detect outside clicks from within `<iframe>` elements ([#1552](https://github.com/tailwindlabs/headlessui/pull/1552))
 - Improve Combobox input cursor position ([#1574](https://github.com/tailwindlabs/headlessui/pull/1574))
+- Fix scrolling issue in `Tab` component when using arrow keys ([#1584](https://github.com/tailwindlabs/headlessui/pull/1584))
 
 ## [1.6.4] - 2022-05-29
 
diff --git a/packages/@headlessui-vue/CHANGELOG.md b/packages/@headlessui-vue/CHANGELOG.md
index 2cc90c4ce..3a84ef66f 100644
--- a/packages/@headlessui-vue/CHANGELOG.md
+++ b/packages/@headlessui-vue/CHANGELOG.md
@@ -19,6 +19,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 - Detect outside clicks from within `<iframe>` elements ([#1552](https://github.com/tailwindlabs/headlessui/pull/1552))
 - Only render the `Dialog` on the client ([#1566](https://github.com/tailwindlabs/headlessui/pull/1566))
 - Improve Combobox input cursor position ([#1574](https://github.com/tailwindlabs/headlessui/pull/1574))
+- Fix scrolling issue in `Tab` component when using arrow keys ([#1584](https://github.com/tailwindlabs/headlessui/pull/1584))
 
 ## [1.6.4] - 2022-05-29
 

From 10a0e0cf6012395b159b6032dec8be1a8e58cc8a Mon Sep 17 00:00:00 2001
From: Robin Malfait <malfait.robin@gmail.com>
Date: Mon, 13 Jun 2022 13:20:06 +0200
Subject: [PATCH 3/4] bump prettier

Does GitHub Actions have an incorrect cache somehow?
---
 package.json | 2 +-
 yarn.lock    | 8 ++++----
 2 files changed, 5 insertions(+), 5 deletions(-)

diff --git a/package.json b/package.json
index b249e00a1..ed0d5c173 100644
--- a/package.json
+++ b/package.json
@@ -47,7 +47,7 @@
     "jest": "26",
     "lint-staged": "^12.2.1",
     "npm-run-all": "^4.1.5",
-    "prettier": "^2.5.1",
+    "prettier": "^2.6.2",
     "prettier-plugin-tailwindcss": "^0.1.4",
     "rimraf": "^3.0.2",
     "tslib": "^2.3.1",
diff --git a/yarn.lock b/yarn.lock
index 5bf11e631..ca882f36e 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -4326,10 +4326,10 @@ prettier-plugin-tailwindcss@^0.1.4:
   resolved "https://registry.yarnpkg.com/prettier-plugin-tailwindcss/-/prettier-plugin-tailwindcss-0.1.8.tgz#ba0f606ed91959ede670303d905b99106e9e6293"
   integrity sha512-hwarSBCswAXa+kqYtaAkFr3Vop9o04WOyZs0qo3NyvW8L7f1rif61wRyq0+ArmVThOuRBcJF5hjGXYk86cwemg==
 
-prettier@^2.5.1:
-  version "2.5.1"
-  resolved "https://registry.yarnpkg.com/prettier/-/prettier-2.5.1.tgz#fff75fa9d519c54cf0fce328c1017d94546bc56a"
-  integrity sha512-vBZcPRUR5MZJwoyi3ZoyQlc1rXeEck8KgeC9AwwOn+exuxLxq5toTRDTSaVrXHxelDMHy9zlicw8u66yxoSUFg==
+prettier@^2.6.2:
+  version "2.6.2"
+  resolved "https://registry.yarnpkg.com/prettier/-/prettier-2.6.2.tgz#e26d71a18a74c3d0f0597f55f01fb6c06c206032"
+  integrity sha512-PkUpF+qoXTqhOeWL9fu7As8LXsIUZ1WYaJiY/a7McAQzxjk82OF0tibkFXVCDImZtWxbvojFjerkiLb0/q8mew==
 
 pretty-format@^26.1.0, pretty-format@^26.6.2:
   version "26.6.2"

From 90f3a8369f33eaee786739a5da4e9356341460ee Mon Sep 17 00:00:00 2001
From: Robin Malfait <malfait.robin@gmail.com>
Date: Mon, 13 Jun 2022 13:23:39 +0200
Subject: [PATCH 4/4] use Active LTS in CI

---
 .github/workflows/main.yml | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/.github/workflows/main.yml b/.github/workflows/main.yml
index 2122e992b..288ec97fc 100644
--- a/.github/workflows/main.yml
+++ b/.github/workflows/main.yml
@@ -7,7 +7,7 @@ concurrency:
   cancel-in-progress: true
 
 env:
-  NODE_VERSION: 12.x
+  NODE_VERSION: 16.x
 
 jobs:
   install: