fix(vue): fix type errors & remove invalid type assignments

packages/vue/src/app.ts

@@ -1,17 +1,18 @@
-// @ts-nocheck
 import {
   type HeadManager,
   type HeadManagerOnUpdate,
   type HeadManagerTitleCallback,
   type Page,
   type PageProps,
+  type PageResolver,
   createHeadManager,
   router,
 } from '@inertiajs-revamped/core'
 import {
   type DefineComponent,
   type Plugin,
   type PropType,
+  type Ref,
   computed,
   defineComponent,
   h,
@@ -21,49 +22,41 @@ import {
   shallowRef,
 } from 'vue'
 import remember from './remember'
-import type { VuePageHandlerArgs } from './types'
+import type { InertiaComponentType } from './types'
 import useForm from './useForm'
 
 export interface InertiaAppProps {
   initialPage: Page
   initialComponent?: object
-  resolveComponent?: (
-    name: string
-  ) => DefineComponent | Promise<DefineComponent>
+  resolveComponent: PageResolver<InertiaComponentType>
   titleCallback?: HeadManagerTitleCallback
   onHeadUpdate?: HeadManagerOnUpdate | null
 }
 
-export type InertiaApp = DefineComponent<InertiaAppProps>
-
-const component = ref(null)
-const page = ref<Page<any>>(null)
+const page = ref({}) as Ref<Page<PageProps>>
 const layout = shallowRef(null)
-const key = ref(null)
 
 let headManager: HeadManager | null = null
 
-const App: InertiaApp = defineComponent({
+const App = defineComponent({
   name: 'Inertia',
   props: {
     initialPage: {
-      type: Object as PropType<Page>,
+      type: Object as PropType<Page<PageProps>>,
       required: true,
     },
     initialComponent: {
       type: Object,
       required: false,
     },
     resolveComponent: {
-      type: Function as PropType<
-        (name: string) => DefineComponent | Promise<DefineComponent>
-      >,
-      required: false,
+      type: Function as PropType<PageResolver<InertiaComponentType>>,
+      required: true,
     },
     titleCallback: {
       type: Function as PropType<HeadManagerTitleCallback>,
       required: false,
-      default: (title: string) => title,
+      default: ((title) => title) as HeadManagerTitleCallback,
     },
     onHeadUpdate: {
       type: Function as PropType<HeadManagerOnUpdate> | null,
@@ -78,9 +71,11 @@ const App: InertiaApp = defineComponent({
     titleCallback,
     onHeadUpdate,
   }) {
-    component.value = initialComponent ? markRaw(initialComponent) : null
+    const component = ref(
+      initialComponent ? markRaw(initialComponent) : null
+    ) as Ref<DefineComponent<any, any, any> | null>
     page.value = initialPage
-    key.value = null
+    const key = ref<number | string | undefined>(undefined)
 
     const isServer = typeof window === 'undefined'
     headManager = createHeadManager(isServer, titleCallback, onHeadUpdate)
@@ -89,14 +84,18 @@ const App: InertiaApp = defineComponent({
       router.init({
         initialPage,
         resolveComponent,
-        swapComponent: async (args: VuePageHandlerArgs) => {
-          component.value = markRaw(args.component)
-          page.value = args.page
-          key.value = args.preserveState ? key.value : Date.now()
+        swapComponent: async ({
+          component: Comp,
+          page: NextPage,
+          preserveState,
+        }) => {
+          component.value = markRaw(Comp as InertiaComponentType)
+          page.value = NextPage
+          key.value = preserveState ? key.value : Date.now()
         },
       })
 
-      router.on('navigate', () => headManager.forceUpdate())
+      router.on('navigate', () => headManager?.forceUpdate())
     }
 
     return () => {
@@ -158,7 +157,7 @@ export const plugin: Plugin = {
 
 export function usePage<SharedProps extends PageProps>(): Page<SharedProps> {
   return reactive({
-    props: computed(() => page.value?.props),
+    props: computed(() => (page.value as Page<SharedProps & PageProps>).props),
     url: computed(() => page.value?.url),
     component: computed(() => page.value?.component),
     version: computed(() => page.value?.version),

packages/vue/src/createInertiaApp.ts

@@ -1,22 +1,19 @@
-// @ts-nocheck
-import { type Page, setupProgress } from '@inertiajs-revamped/core'
 import {
-  type DefineComponent,
-  type Plugin,
-  type App as VueApp,
-  createSSRApp,
-  h,
-} from 'vue'
-import App, { type InertiaApp, type InertiaAppProps, plugin } from './app'
+  type Page,
+  type PageProps,
+  type PageResolver,
+  setupProgress,
+} from '@inertiajs-revamped/core'
+import { type Plugin, type App as VueApp, createSSRApp, h } from 'vue'
+import App, { type InertiaAppProps, plugin } from './app'
+import type { InertiaComponentType } from './types'
 
-interface CreateInertiaAppProps {
+export interface CreateInertiaAppProps {
   id?: string
-  resolve: (
-    name: string
-  ) => DefineComponent | Promise<DefineComponent> | { default: DefineComponent }
+  resolve: PageResolver<InertiaComponentType>
   setup: (props: {
-    el: Element
-    App: InertiaApp
+    el: HTMLElement | null
+    App: typeof App
     props: InertiaAppProps
     plugin: Plugin
   }) => void | VueApp
@@ -41,14 +38,24 @@ export default async function createInertiaApp({
   progress = {},
   page,
   render,
-}: CreateInertiaAppProps): Promise<{ head: string[]; body: string }> {
+}: CreateInertiaAppProps): Promise<
+  { head: string[]; body: string } | undefined
+> {
   const isServer = typeof window === 'undefined'
-  const el = isServer ? null : document.getElementById(id)
-  const initialPage = page || JSON.parse(el.dataset.page)
-  const resolveComponent = (name) =>
-    Promise.resolve(resolve(name)).then((module) => module.default || module)
+  const el: HTMLElement | null = isServer
+    ? null
+    : <HTMLElement>document.getElementById(id)
+  const initialPage: Page<PageProps> =
+    page || JSON.parse(el?.dataset.page as string)
 
-  let head = []
+  const resolveComponent = (name: string) =>
+    Promise.resolve(resolve(name)).then((module) => {
+      return typeof module === 'object' && !!module && 'default' in module
+        ? module.default
+        : module
+    })
+
+  let head: string[] = []
 
   const vueApp = await resolveComponent(initialPage.component).then(
     (initialComponent) => {
@@ -71,7 +78,7 @@ export default async function createInertiaApp({
     setupProgress(progress)
   }
 
-  if (isServer) {
+  if (isServer && render) {
     const body = await render(
       createSSRApp({
         render: () =>