Rule Proposal: vue/valid-v-slot

[mysticatea]

Please describe what the rule should do:

This rule reports wrong usage of v-slot directives.

This is v-slot version of existing vue/valid-v-* rules.

What category should the rule belong to?

• Enforces code style
• Warns about a potential error
• Suggests an alternate way of doing something
• Other (please specify:)

Provide 2-3 code examples that this rule should warn about:

<template>
    <div v-slot="foo"></div><!-- error: 'v-slot' directive must be owned by a custom element, but '<div>' is not.  -->
</template>

<template>
    <div>
        <template v-slot:header></template><!-- error: 'v-slot' directive must be owned by a custom element, but '<div>' is not.  -->
    </div>
</template>

<template>
    <template v-slot:header></template><!-- error: 'v-slot' directive must be owned by a custom element, but '<template>' is not.  -->
</template>

<template>
    <my-component v-slot:one="foo" v-slot:two="foo"></my-component><!-- error: an element cannot have multiple 'v-slot' directives.  -->
</template>

<template>
    <my-component><template v-slot:one="foo" v-slot:two="foo"></template></my-component><!-- error: an element cannot have multiple 'v-slot' directives.  -->
</template>

<template>
    <my-component v-slot.foo="foo"></my-component><!-- error: 'v-slot' doesn't have any modifiers.  -->
</template>

<template>
    <my-component v-slot:header="foo"></my-component><!-- error: Named slots must be on '<template>' elements on a custom element.  -->
</template>

<template>
    <my-component v-slot><!-- error: Default slot should be on '<template>' elements on a custom element when other named slots exist.  -->
        <template v-slot:header></template>
    </my-component>
</template>

<template>
    <my-component v-slot></my-component><!-- error: Default slot on a custom element directly requires attribute value.  -->
</template>

Are there other cases?

Additional context

[mysticatea]

🤔 v-for + v-slot ... https://jsfiddle.net/mysticatea/zuyjom9m/47/