diff --git a/packages/@headlessui-react/CHANGELOG.md b/packages/@headlessui-react/CHANGELOG.md index 7b77146cd5..5017d60533 100644 --- a/packages/@headlessui-react/CHANGELOG.md +++ b/packages/@headlessui-react/CHANGELOG.md @@ -29,6 +29,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0 - Deprecate the `entered` prop on the `Transition` component ([#3089](https://github.com/tailwindlabs/headlessui/pull/3089)) - Use native `useId` and `useSyncExternalStore` hooks ([#3092](https://github.com/tailwindlabs/headlessui/pull/3092)) - Use `absolute` as the default Floating UI strategy ([#3097](https://github.com/tailwindlabs/headlessui/pull/3097)) +- Change default tags for `ListboxOptions`, `ListboxOption`, `ComboboxOptions`, `ComboboxOption` and `TabGroup` components ([#3109](https://github.com/tailwindlabs/headlessui/pull/3109)) ### Added diff --git a/packages/@headlessui-react/src/components/combobox/combobox.tsx b/packages/@headlessui-react/src/components/combobox/combobox.tsx index cacee2b0a2..5968604349 100644 --- a/packages/@headlessui-react/src/components/combobox/combobox.tsx +++ b/packages/@headlessui-react/src/components/combobox/combobox.tsx @@ -1519,7 +1519,7 @@ function ButtonFn( // --- -let DEFAULT_OPTIONS_TAG = 'ul' as const +let DEFAULT_OPTIONS_TAG = 'div' as const type OptionsRenderPropArg = { open: boolean option: unknown @@ -1630,7 +1630,7 @@ function OptionsFn( // --- -let DEFAULT_OPTION_TAG = 'li' as const +let DEFAULT_OPTION_TAG = 'div' as const type OptionRenderPropArg = { focus: boolean /** @deprecated use `focus` instead */ diff --git a/packages/@headlessui-react/src/components/listbox/listbox.tsx b/packages/@headlessui-react/src/components/listbox/listbox.tsx index 177eace09e..e2c032bc5d 100644 --- a/packages/@headlessui-react/src/components/listbox/listbox.tsx +++ b/packages/@headlessui-react/src/components/listbox/listbox.tsx @@ -849,7 +849,7 @@ function ButtonFn( let SelectedOptionContext = createContext(false) -let DEFAULT_OPTIONS_TAG = 'ul' as const +let DEFAULT_OPTIONS_TAG = 'div' as const type OptionsRenderPropArg = { open: boolean } @@ -1100,7 +1100,7 @@ function OptionsFn( // --- -let DEFAULT_OPTION_TAG = 'li' as const +let DEFAULT_OPTION_TAG = 'div' as const type OptionRenderPropArg = { /** @deprecated use `focus` instead */ active: boolean diff --git a/packages/@headlessui-react/src/components/tabs/tabs.tsx b/packages/@headlessui-react/src/components/tabs/tabs.tsx index 3b0159294d..1e1e3d4a7a 100644 --- a/packages/@headlessui-react/src/components/tabs/tabs.tsx +++ b/packages/@headlessui-react/src/components/tabs/tabs.tsx @@ -3,7 +3,6 @@ import { useFocusRing } from '@react-aria/focus' import { useHover } from '@react-aria/interactions' import React, { - Fragment, createContext, useContext, useMemo, @@ -220,7 +219,7 @@ function stateReducer(state: StateDefinition, action: Actions) { // --- -let DEFAULT_TABS_TAG = Fragment +let DEFAULT_TABS_TAG = 'div' as const type TabsRenderPropArg = { selectedIndex: number }