Vue Language Plugin for type inference of defineMeta and args

[tobiasdiez]

At the moment, one needs to pass the meta object to the Story component to get the correct types for args etc. The idea would be to add a language plugin that does this automatically. So the following code would work and provide proper types for args

<script setup lang="ts">
import Button from "./b-button.vue";

defineMeta({
  component: Button,
  args: {
    label: 'Click',
    variant: 'primary',
  }
})

</script>

<template>
<Story v-slot="{ args }">
   <Button :label="args.label" /> <!-- the value here is "Click"-->
</Story>
<!-- Args can be overridden locally by passing them to the Story component   -->
<Story v-slot="{ args }" :args="{ label: 'Custom Label'}">
   <Button :label="args.label"/> <!-- the value here is "Custom Label"-->
</Story>
</template>

References:

• "Documentation" of VueLanguagePlugin: https://github.com/vuejs/language-tools/blob/67be01c444db79aa105a47ebca376c29f0e5e609/packages/language-core/lib/types.ts#L80-L88
• https://github.com/vue-macros/vue-macros as examples for defining vue language plugins