Inertia.js types are broken after importing anything from `vue-final-modal`

[mrleblanc101]

Version

vue-final-modal: 5.0.0-beta.5 (also happen with v4)
vue: 3.5.22
package manager: pnpm
os: macOS 26.1

Reproduction Link

https://github.com/mrleblanc101/vue-starter-kit/tree/bug/vue-final-modal

What is actually happening?

Hi,
I'm observing a very strange behavior with Types when I import vue-final-modal inside an Inertia.js app (using Vue.js). As soon as I import anything from vue-final-modal, some global types seem to stop working.

For example, in Inertia you can access $page, $inertia and route() globally in the templates, but with vue-final-modal imported I get errors in VS Code.

Property '$page' does not exist on type '{ Link: InertiaLink; AvatarImage: DefineComponent<__VLS_Props, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, ... 12 more ..., any>; ... 22 more ...; $vfm: Vfm; }'.ts-plugin(2339)

Property '$inertia' does not exist on type '{ Link: InertiaLink; Multiselect: typeof Multiselect; OnClickOutside: DefineSetupFnComponent<OnClickOutsideProps, OnClickOutsideEmits, {}, OnClickOutsideProps & { ...; }, PublicProps>; ... 27 more ...; $vfm: Vfm; }'.ts-plugin(2339)

Property 'route' does not exist on type '{ Link: InertiaLink; Multiselect: typeof Multiselect; OnClickOutside: DefineSetupFnComponent<OnClickOutsideProps, OnClickOutsideEmits, {}, OnClickOutsideProps & { ...; }, PublicProps>; ... 27 more ...; $vfm: Vfm; }'.ts-plugin(2339)

If I remove any vue-final-modal imports, everything is back to normal:

Here are the types, pretty much unchanged from the Laravel https://github.com/laravel/vue-starter-kit, which is what their CLI use to scafold a new Inertia.js (using Vue.js) project.

import { route } from 'ziggy-js';

declare module '@inertiajs/core' {
    interface PageProps extends InertiaPageProps, AppPageProps {}
}

declare module 'vue' {
    interface ComponentCustomProperties {
        $inertia: typeof Router;
        $page: Page;
        $headManager: ReturnType<typeof createHeadManager>;
    }
}

export type AppPageProps<T extends Record<string, unknown> = Record<string, unknown>> = T & {
    auth: Auth;
    ziggy: Config & { location: string };
    subsidiaries: Subsidiary[];
    subsidiary: Subsidiary;
    version: {
        commitTag: string;
        commitShortSha: string;
    };
};

declare global {
    let route: typeof route;
}

declare module 'vue' {
    interface ComponentCustomProperties {
        route: typeof route;
    }
}

[mrleblanc101]

What gave me a hint is the $vfm: Vfm at the end of the type preview

[mrleblanc101]

I've added the reproduction: https://github.com/mrleblanc101/vue-starter-kit/tree/bug/vue-final-modal

[mrleblanc101]

Wait, could it be related to the import order ? :O

This works:

import { createVfm } from 'vue-final-modal';
import { createInertiaApp } from '@inertiajs/vue3';

This gives error:

import { createInertiaApp } from '@inertiajs/vue3';
import { createVfm } from 'vue-final-modal';

But ESLint / Prettier are sorting the import in alphabetical order or something...