From e4e33742027e4ec29658135d78a379b0f6035568 Mon Sep 17 00:00:00 2001 From: Robin Malfait Date: Thu, 3 Aug 2023 11:54:26 +0200 Subject: [PATCH 1/2] only set the next index when tabs are available Currently we were assuming that the `tabs` were always there, but this --- .../@headlessui-react/src/components/tabs/tabs.tsx | 10 ++++++---- packages/@headlessui-vue/src/components/tabs/tabs.ts | 5 ++++- 2 files changed, 10 insertions(+), 5 deletions(-) diff --git a/packages/@headlessui-react/src/components/tabs/tabs.tsx b/packages/@headlessui-react/src/components/tabs/tabs.tsx index 21976565b5..15f554c383 100644 --- a/packages/@headlessui-react/src/components/tabs/tabs.tsx +++ b/packages/@headlessui-react/src/components/tabs/tabs.tsx @@ -114,12 +114,14 @@ let reducers: { return nextState } + let nextSelectedIndex = match(direction, { + [Direction.Forwards]: () => tabs.indexOf(focusableTabs[0]), + [Direction.Backwards]: () => tabs.indexOf(focusableTabs[focusableTabs.length - 1]), + }) + return { ...nextState, - selectedIndex: match(direction, { - [Direction.Forwards]: () => tabs.indexOf(focusableTabs[0]), - [Direction.Backwards]: () => tabs.indexOf(focusableTabs[focusableTabs.length - 1]), - }), + selectedIndex: nextSelectedIndex === -1 ? state.selectedIndex : nextSelectedIndex, } } diff --git a/packages/@headlessui-vue/src/components/tabs/tabs.ts b/packages/@headlessui-vue/src/components/tabs/tabs.ts index a33b9916ac..a12afc5253 100644 --- a/packages/@headlessui-vue/src/components/tabs/tabs.ts +++ b/packages/@headlessui-vue/src/components/tabs/tabs.ts @@ -130,10 +130,13 @@ export let TabGroup = defineComponent({ } ) - selectedIndex.value = match(direction, { + let nextSelectedIndex = match(direction, { [Direction.Forwards]: () => tabs.indexOf(focusableTabs[0]), [Direction.Backwards]: () => tabs.indexOf(focusableTabs[focusableTabs.length - 1]), }) + if (nextSelectedIndex !== -1) { + selectedIndex.value = nextSelectedIndex + } api.tabs.value = tabs api.panels.value = panels } From fbc902a764402c3ac002e62e56939ebb9e58cbdf Mon Sep 17 00:00:00 2001 From: Robin Malfait Date: Thu, 3 Aug 2023 11:58:34 +0200 Subject: [PATCH 2/2] 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 1e327693ea..09d29090b7 100644 --- a/packages/@headlessui-react/CHANGELOG.md +++ b/packages/@headlessui-react/CHANGELOG.md @@ -12,6 +12,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0 - Use correct value when resetting `` and `` ([#2626](https://github.com/tailwindlabs/headlessui/pull/2626)) - Render `` in `Popover.Group` component only ([#2634](https://github.com/tailwindlabs/headlessui/pull/2634)) - Disable smooth scrolling when opening/closing `Dialog` components on iOS ([#2635](https://github.com/tailwindlabs/headlessui/pull/2635)) +- Don't assume `` components are available when setting the next index ([#2642](https://github.com/tailwindlabs/headlessui/pull/2642)) ## [1.7.16] - 2023-07-27 diff --git a/packages/@headlessui-vue/CHANGELOG.md b/packages/@headlessui-vue/CHANGELOG.md index 50b50b49db..ae8176bfa4 100644 --- a/packages/@headlessui-vue/CHANGELOG.md +++ b/packages/@headlessui-vue/CHANGELOG.md @@ -13,6 +13,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0 - Use correct value when resetting `` and `` ([#2626](https://github.com/tailwindlabs/headlessui/pull/2626)) - Render `` in `PopoverGroup` component only ([#2634](https://github.com/tailwindlabs/headlessui/pull/2634)) - Disable smooth scrolling when opening/closing `Dialog` components on iOS ([#2635](https://github.com/tailwindlabs/headlessui/pull/2635)) +- Don't assume `` components are available when setting the next index ([#2642](https://github.com/tailwindlabs/headlessui/pull/2642)) ## [1.7.15] - 2023-07-27