How to extend props types for a wrapper component with fallthrough attributes?

[ThomasKientz]

I am creating a wrapper around a Vuetify component with fallthrough attributes which are passed to the base component.

<v-autocomplete v-bind="$attrs" />

I would like the types of my wrapper to extends the type of the base component. I have tried with :

  import { computed, ref } from 'vue';
  import { type VAutocomplete } from 'vuetify/components';

  type VAutocompleteProps = InstanceType<typeof VAutocomplete>['$props'];

  type OAutocompleteProps = {
    searchIcon?: boolean;
  } & VAutocompleteProps;

  const props = defineProps<OAutocompleteProps>();

But it throws the following error in the node console, IDE types are good though.

[vite] Internal server error: [@vue/compiler-sfc] Unresolvable type reference or unsupported built-in utility type

Project/lib/components/OAutocomplete/OAutocomplete.vue
7 | type VAutocompleteProps = InstanceType['$props'];
| ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^

I am using vue 3.3.4 and typescript 5.1.6.

Any ideas ?

[Shyam-Chen]

type VAutocompleteProps = InstanceType<typeof VAutocomplete>['$props'];

[ThomasKientz]

Same issue with ['$props']

[ThomasKientz]

(in fact it was present originally but I paste the wrong code. I have edited my original post to include it, sorry).

[Shyam-Chen]

#8878 (comment)

[rudyxu1102]

See vuejs/rfcs#477. Discussion is welcome.