diff --git a/CHANGELOG.md b/CHANGELOG.md index d0f2f13..deda179 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -11,7 +11,9 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0 ## [Unreleased - @headlessui/vue] -- Nothing yet! +### Fixed + +- Manually passthrough `attrs` for `Combobox`, `Listbox` and `TabsGroup` component ([#1372](https://github.com/tailwindlabs/headlessui/pull/1372)) ## [@headlessui/react@v1.6.0] - 2022-04-25 diff --git a/packages/@headlessui-vue/src/components/combobox/combobox.ts b/packages/@headlessui-vue/src/components/combobox/combobox.ts index 8312b61..587933f 100644 --- a/packages/@headlessui-vue/src/components/combobox/combobox.ts +++ b/packages/@headlessui-vue/src/components/combobox/combobox.ts @@ -115,6 +115,7 @@ export let Combobox = defineComponent({ nullable: { type: Boolean, default: false }, multiple: { type: [Boolean], default: false }, }, + inheritAttrs: false, setup(props, { slots, attrs, emit }) { let comboboxState = ref(ComboboxStates.Closed) let labelRef = ref(null) @@ -445,7 +446,10 @@ export let Combobox = defineComponent({ ) : []), render({ - props: omit(incomingProps, ['nullable', 'multiple', 'onUpdate:modelValue']), + props: { + ...attrs, + ...omit(incomingProps, ['nullable', 'multiple', 'onUpdate:modelValue']), + }, slot, slots, attrs, diff --git a/packages/@headlessui-vue/src/components/listbox/listbox.ts b/packages/@headlessui-vue/src/components/listbox/listbox.ts index 17e446e..e720810 100644 --- a/packages/@headlessui-vue/src/components/listbox/listbox.ts +++ b/packages/@headlessui-vue/src/components/listbox/listbox.ts @@ -115,6 +115,7 @@ export let Listbox = defineComponent({ name: { type: String, optional: true }, multiple: { type: [Boolean], default: false }, }, + inheritAttrs: false, setup(props, { slots, attrs, emit }) { let listboxState = ref(ListboxStates.Closed) let labelRef = ref(null) @@ -328,7 +329,10 @@ export let Listbox = defineComponent({ ) : []), render({ - props: omit(incomingProps, ['onUpdate:modelValue', 'horizontal', 'multiple']), + props: { + ...attrs, + ...omit(incomingProps, ['onUpdate:modelValue', 'horizontal', 'multiple']), + }, slot, slots, attrs, diff --git a/packages/@headlessui-vue/src/components/tabs/tabs.ts b/packages/@headlessui-vue/src/components/tabs/tabs.ts index a415aaf..72334d8 100644 --- a/packages/@headlessui-vue/src/components/tabs/tabs.ts +++ b/packages/@headlessui-vue/src/components/tabs/tabs.ts @@ -69,6 +69,7 @@ export let TabGroup = defineComponent({ vertical: { type: [Boolean], default: false }, manual: { type: [Boolean], default: false }, }, + inheritAttrs: false, setup(props, { slots, attrs, emit }) { let selectedIndex = ref(null) let tabs = ref([]) @@ -152,7 +153,10 @@ export let TabGroup = defineComponent({ }, }), render({ - props: omit(props, ['selectedIndex', 'defaultIndex', 'manual', 'vertical', 'onChange']), + props: { + ...attrs, + ...omit(props, ['selectedIndex', 'defaultIndex', 'manual', 'vertical', 'onChange']), + }, slot, slots, attrs,