Defining fallthrough attributes

[MichelJonkman]

What problem does this feature solve?

Currently when you make a component that is made to accept fallthrough attributes it's not possible to define what those attributes are. A big use case is for "extending" existing components for instance:

<!-- MyButton.vue -->
<script lang="ts" setup>
const props = defineProps<{
    loading?: boolean;
}>();
</script>

<template>
    <button><slot/><div v-if="props.loading"> Loading...</div></button>
</template>

<!-- SaveButton.vue -->
<script lang="ts" setup>
import {useAttrs} from "vue";

defineOptions({
    inheritAttrs: false
});

const attrs = useAttrs();
</script>

<template>
    <div class="align-right">
        <MyButton v-bind="attrs">Save</MyButton>
    </div>
</template>

<!-- MyForm.vue -->
<template>
    <div>
        <!-- No typings available for loading attribute -->
        <SaveButton loading/>
    </div>
</template>

This can be very annoying when an underlying component accepts a lot of different attributes. Of course if Volar implemented something for root elements it would help, but I believe a more declarative way would be a very good addition for when it's very hard or impossible for Volar to get the correct component.

What does the proposed API look like?

Following naming conventions I feel like adding a new function would be the best way, it would return the attributes just like useAttrs().

const attrs = defineAttrs<MyButton>();
// Or
const attrs = defineAttrs(MyButton);

Alternatively something like this, but I'm not sure if something like PropsOf in the example exists already.

const attrs = defineAttrs<PropsOf<MyButton>>();

While this post focusses on fallthrough attributes, something to make the DX better for slots in the same use case would also be greatly appreciated!

[jods4]

Duplicate of #479?

[MichelJonkman]

It's similar but this proposal is much more focussed on the addition of defineAttrs() or something similar, I chose to create a new discussion for this since the one you linked has gotten hard to follow and very unfocussed.

Together with your comment this would be absolutely perfect, but I feel like that part is more fitting for the Volar repository.