Vue 3 with TypeScript - JSX Error when Volar enabled

[kamnakis]

Reduced Test Case

Calendar.vue

<template>
  <FullCalendar :options="options" />
</template>

<script lang="ts" setup>
// Components
import FullCalendar, { CalendarOptions } from '@fullcalendar/vue3'

interface Props {
  options: CalendarOptions
}
defineProps<Props>()
</script>

Bug Description

Describe how to recreate the bug.

1. Create a Quasar v2 project (https://quasar.dev/quasar-cli/installation) with TypeScript
2. Open project with VSCode and install Volar plugin
3. npm i @fullcalendar/core @fullcalendar/vue3
4. Create a Calendar.vue component with the above code.

What do you expect to happen?
Even though it works. I expect typescript to not complain.

What happens instead?
TypeScript complains with this message

JSX element class does not support attributes because it does not have a 'props' property.ts(2607)

'__VLS_2' cannot be used as a JSX component.
  Its instance type '{ $: ComponentInternalInstance; $data: { renderId: number; }; $props: Partial<{}> & Omit<Readonly<{ options?: CalendarOptions | undefined; }> & VNodeProps & AllowedComponentProps & ComponentCustomProps, never>; ... 10 more ...; $watch(source: string | Function, cb: Function, options?: WatchOptions<...> | undefined):...' is not a valid JSX element.ts(2786)

Screenshots

[kamnakis]

Duplicate fullcalendar/fullcalendar-vue#173