[Bug??] No intellisense for Vue FilePond component props in vscode

[natac13]

Is there an existing issue for this?

• [X] I have searched the existing issues

Have you updated Vue FilePond, FilePond, and all plugins?

• [X] I have updated FilePond and its plugins

Describe the bug

I am coming from using the react-filepond version of this to a new project that is forcing me to use vue.

I am having trouble with getting prop intellisense to show the available props on the FilePond component.

Is this expected or am I doing something wrong?

I dont get any red lines on the props. But I also can pass props which I know for sure do not exist and there is still no red warning.

Is this a bug / something with the vue-filepond package that is expected. Or am I the dummy who does not know how to get vue intellisense working? I do have volar vs code extension installed and for locally authored SFCs I have intellisense.

Thanks you for the help. Have a great day!

Reproduction

<script setup lang="ts">
import FilePondPluginFileEncode from 'filepond-plugin-file-encode';
import FilePondPluginMaxFileSize from 'filepond-plugin-file-validate-size';
import FilePondPluginFileValidateType from 'filepond-plugin-file-validate-type';
import FilePondPluginImageEdit from 'filepond-plugin-image-edit';
import FilePondPluginImageExifOrientation from 'filepond-plugin-image-exif-orientation';
import FilePondPluginImagePreview from 'filepond-plugin-image-preview';
import FilePondPluginImageResize from 'filepond-plugin-image-resize';
import FilePondPluginImageTransform from 'filepond-plugin-image-transform';
import createFilePond from 'vue-filepond';

import 'filepond-plugin-image-edit/dist/filepond-plugin-image-edit.css';
import 'filepond-plugin-image-preview/dist/filepond-plugin-image-preview.css';
import 'filepond/dist/filepond.min.css';

import { ref } from 'vue';

const FilePond = createFilePond(
  FilePondPluginFileEncode,
  FilePondPluginMaxFileSize,
  FilePondPluginFileValidateType,
  FilePondPluginImageEdit,
  FilePondPluginImageExifOrientation,
  FilePondPluginImagePreview,
  FilePondPluginImageResize,
  FilePondPluginImageTransform,
);

const props = withDefaults(
  defineProps<{
    id: string;
    label: string;
    name: string;
    required?: boolean;
    maxFileSize?: number;
    maxFiles?: number;
    disabled?: boolean;
    allowMultiple?: boolean;
    error?: string;
    description?: string;
  }>(),
  {
    required: false,
    maxFileSize: 5,
    maxFiles: 1,
    disabled: false,
    allowMultiple: false,
  },
);

const pondRef = ref<typeof FilePond>();
const error = ref<string | undefined>(props.error);
const files = ref<File[]>([]);

const onUpdateFiles = (fileItems: File[]) => {
  console.log('onUpdate');
  console.log(fileItems);
  files.value = fileItems.map((fileItem) => fileItem);
};
</script>

<template>
  <div>
    <label :for="props.id">{{ props.label }}</label>
    <file-pond
      ref="pondRef"
      :id="props.id"
      :name="props.name"
      :allowMultiple="props.allowMultiple"
      :disabled="props.disabled"
      :required="props.required"
      :instantUpload="false"
      :files="files"
      @updatefiles="onUpdateFiles"
    />
    <div
      v-if="props.description && !error"
      class="mt-2"
    >
      {{ props.description }}
    </div>
    <div
      v-if="error"
      class="mt-2 text-danger"
    >
      {{ error }}
    </div>
  </div>
</template>

Environment

- Device: Mac
- OS: Sonoma 14.0
- Broser: Chrome
- Vue version: 3.x.x