@adonisjs/inertia 1.0.0-2 → 1.0.0-22

package/build/src/types.d.ts

@@ -1,3 +1,4 @@
+import { Serialize } from '@tuyau/utils/types';
 import { HttpContext } from '@adonisjs/core/http';
 
 /**
@@ -44,9 +45,13 @@ type AssetsVersion = string | number | undefined;
 interface InertiaConfig {
     /**
      * Path to the Edge view that will be used as the root view for Inertia responses.
-     * @default root (resources/views/root.edge)
+     * @default root (resources/views/inertia_layout.edge)
      */
     rootView?: string;
+    /**
+     * Path to your client-side entrypoint file.
+     */
+    entrypoint?: string;
     /**
      * The version of your assets. Every client request will be checked against this version.
      * If the version is not the same, the client will do a full reload.
@@ -56,6 +61,27 @@ interface InertiaConfig {
      * Data that should be shared with all rendered pages
      */
     sharedData?: SharedData;
+    /**
+     * Options to configure SSR
+     */
+    ssr?: {
+        /**
+         * Enable or disable SSR
+         */
+        enabled: boolean;
+        /**
+         * List of components that should be rendered on the server
+         */
+        pages?: string[] | ((ctx: HttpContext, page: string) => MaybePromise<boolean>);
+        /**
+         * Path to the SSR entrypoint file
+         */
+        entrypoint?: string;
+        /**
+         * Path to the SSR bundled file that will be used in production
+         */
+        bundle?: string;
+    };
 }
 /**
  * Resolved inertia configuration
@@ -64,6 +90,39 @@ interface ResolvedConfig {
     rootView: string;
     versionCache: VersionCache;
     sharedData: SharedData;
+    entrypoint: string;
+    ssr: {
+        enabled: boolean;
+        entrypoint: string;
+        pages?: string[] | ((ctx: HttpContext, page: string) => MaybePromise<boolean>);
+        bundle: string;
+    };
+}
+interface PageObject<TPageProps extends PageProps = PageProps> {
+    component: string;
+    version: string | number;
+    props: TPageProps;
+    url: string;
+    ssrHead?: string;
+    ssrBody?: string;
 }
+/**
+ * Helper for infering the page props from a Controller method that returns
+ * inertia.render
+ *
+ * ```ts
+ * // Your Adonis Controller
+ * class MyController {
+ *  index() {
+ *   return inertia.render('foo', { foo: 1 })
+ *  }
+ * }
+ *
+ * // Your React component
+ * export default MyReactComponent(props: InferPageProps<Controller, 'index'>) {
+ * }
+ * ```
+ */
+type InferPageProps<Controller, Method extends keyof Controller> = Controller[Method] extends (...args: any[]) => any ? Serialize<Exclude<Awaited<ReturnType<Controller[Method]>>, string>['props']> : never;
 
-export type { AssetsVersion, Data, InertiaConfig, MaybePromise, PageProps, ResolvedConfig, SharedData, SharedDatumFactory };
+export type { AssetsVersion, Data, InertiaConfig, InferPageProps, MaybePromise, PageObject, PageProps, ResolvedConfig, SharedData, SharedDatumFactory };

package/build/svelte/app.ts.stub

@@ -0,0 +1,30 @@
+{{{
+  exports({ to: app.makePath('inertia/app/app.ts') })
+}}}
+import '../css/app.css';
+
+import { createInertiaApp } from '@inertiajs/svelte'
+import { resolvePageComponent } from '@adonisjs/inertia/helpers'
+
+const appName = import.meta.env.VITE_APP_NAME || 'AdonisJS'
+
+createInertiaApp({
+  progress: { color: '#5468FF' },
+
+  title: (title) => {{ '`${title} - ${appName}`' }},
+
+  resolve: (name) => {
+    return resolvePageComponent(
+      {{ '`../pages/${name}.svelte`' }},
+      import.meta.glob('../pages/**/*.svelte'),
+    )
+  },
+
+  setup({ el, App, props }) {
+    {{#if ssr}}
+    new App({ target: el, props, hydrate: true })
+    {{#else}}
+    new App({ target: el, props })
+    {{/if}}
+  },
+})

package/build/svelte/errors/not_found.svelte.stub

@@ -0,0 +1,10 @@
+{{{
+  exports({ to: app.makePath('inertia/pages/errors/not_found.svelte') })
+}}}
+<div>
+  <div class="container">
+    <div class="title">Page not found</div>
+
+    <span>This page does not exist.</span>
+  </div>
+</div>

package/build/svelte/errors/server_error.svelte.stub

@@ -0,0 +1,14 @@
+{{{
+  exports({ to: app.makePath('inertia/pages/errors/server_error.svelte') })
+}}}
+<script>
+export let error
+</script>
+
+<div>
+  <div class="container">
+    <div class="title">Server Error</div>
+
+    <span>{error.message}</span>
+  </div>
+</div>

package/build/svelte/home.svelte.stub

@@ -0,0 +1,19 @@
+{{{
+  exports({ to: app.makePath('inertia/pages/home.svelte') })
+}}}
+<script>
+export let version
+</script>
+
+<svelte:head>
+  <title>Homepage</title>
+</svelte:head>
+
+<div class="container">
+  <div class="title">AdonisJS \{ version \} x Inertia x Svelte</div>
+
+  <span>
+    Learn more about AdonisJS and Inertia.js by visiting the
+    <a href="https://docs.adonisjs.com/guides/inertia">AdonisJS documentation</a>.
+  </span>
+</div>

package/build/svelte/root.edge.stub

@@ -0,0 +1,21 @@
+{{{
+  exports({ to: app.makePath('resources/views/inertia_layout.edge') })
+}}}
+<!DOCTYPE html>
+<html>
+
+<head>
+  <meta charset="utf-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1">
+
+  <title inertia>AdonisJS x Inertia x Svelte</title>
+
+  {{ "@vite(['inertia/app/app.ts', `inertia/pages/${page.component}.svelte`])" }}
+  @inertiaHead()
+</head>
+
+<body>
+  @inertia()
+</body>
+
+</html>

package/build/svelte/ssr.ts.stub

@@ -0,0 +1,15 @@
+{{{
+  exports({ to: app.makePath('inertia/app/ssr.ts') })
+}}}
+
+import { createInertiaApp } from '@inertiajs/svelte'
+
+export default function render(page: any) {
+  return createInertiaApp({
+    page,
+    resolve: (name) => {
+      const pages = import.meta.glob('../pages/**/*.svelte', { eager: true })
+      {{ 'return pages[`../pages/${name}.svelte`]' }}
+    }
+  })
+}

package/build/svelte/tsconfig.json.stub

@@ -0,0 +1,14 @@
+{{{
+  exports({ to: app.makePath('inertia/tsconfig.json') })
+}}}
+{
+  "extends": "@adonisjs/tsconfig/tsconfig.client.json",
+  "compilerOptions": {
+    "baseUrl": ".",
+    "module": "ESNext",
+    "paths": {
+      "~/*": ["./*"],
+    },
+  },
+  "include": ["./**/*.ts", "./**/*.svelte"],
+}

package/build/vue/app.ts.stub

@@ -0,0 +1,38 @@
+{{{
+  exports({ to: app.makePath('inertia/app/app.ts') })
+}}}
+import '../css/app.css';
+
+{{#if ssr}}
+import { createSSRApp, h } from 'vue'
+{{#else}}
+import { createApp, h } from 'vue'
+{{/if}}
+import type { DefineComponent } from 'vue'
+import { createInertiaApp } from '@inertiajs/vue3'
+import { resolvePageComponent } from '@adonisjs/inertia/helpers'
+
+const appName = import.meta.env.VITE_APP_NAME || 'AdonisJS'
+
+createInertiaApp({
+  progress: { color: '#5468FF' },
+
+  title: (title) => {{ '`${title} - ${appName}`' }},
+
+  resolve: (name) => {
+    return resolvePageComponent(
+      {{ '`../pages/${name}.vue`' }},
+      import.meta.glob<DefineComponent>('../pages/**/*.vue'),
+    )
+  },
+
+  setup({ el, App, props, plugin }) {
+    {{#if ssr}}
+    createSSRApp({ render: () => h(App, props) })
+    {{#else}}
+    createApp({ render: () => h(App, props) })
+    {{/if}}
+      .use(plugin)
+      .mount(el)
+  },
+})

package/build/vue/errors/not_found.vue.stub

@@ -0,0 +1,10 @@
+{{{
+  exports({ to: app.makePath('inertia/pages/errors/not_found.vue') })
+}}}
+<template>
+  <div class="container">
+    <div class="title">Page not found</div>
+
+    <span>This page does not exist.</span>
+  </div>
+</template>

package/build/vue/errors/server_error.vue.stub

@@ -0,0 +1,14 @@
+{{{
+  exports({ to: app.makePath('inertia/pages/errors/server_error.vue') })
+}}}
+<script setup lang="ts">
+defineProps<{ error: any }>();
+</script>
+
+<template>
+  <div class="container">
+    <div class="title">Server Error</div>
+
+    <span>\{\{ error.message \}\}</span>
+  </div>
+</template>

package/build/vue/home.vue.stub

@@ -0,0 +1,21 @@
+{{{
+  exports({ to: app.makePath('inertia/pages/home.vue') })
+}}}
+<script setup lang="ts">
+import { Head } from '@inertiajs/vue3'
+
+defineProps<{ version: number }>()
+</script>
+
+<template>
+  <Head title="Homepage" />
+
+  <div class="container">
+    <div class="title">AdonisJS \{\{ version \}\} x Inertia x Vue.js</div>
+
+    <span>
+      Learn more about AdonisJS and Inertia.js by visiting the
+      <a href="https://docs.adonisjs.com/guides/inertia">AdonisJS documentation</a>.
+    </span>
+  </div>
+</template>

package/build/vue/root.edge.stub

@@ -0,0 +1,21 @@
+{{{
+  exports({ to: app.makePath('resources/views/inertia_layout.edge') })
+}}}
+<!DOCTYPE html>
+<html>
+
+<head>
+  <meta charset="utf-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1">
+
+  <title inertia>AdonisJS x Inertia x VueJS</title>
+
+  {{ "@vite(['inertia/app/app.ts', `inertia/pages/${page.component}.vue`])" }}
+  @inertiaHead()
+</head>
+
+<body>
+  @inertia()
+</body>
+
+</html>

package/build/vue/ssr.ts.stub

@@ -0,0 +1,22 @@
+{{{
+  exports({ to: app.makePath('inertia/app/ssr.ts') })
+}}}
+
+import { createInertiaApp } from '@inertiajs/vue3'
+import { renderToString } from '@vue/server-renderer'
+import { createSSRApp, h, type DefineComponent } from 'vue'
+
+export default function render(page: any) {
+  return createInertiaApp({
+    page,
+    render: renderToString,
+    resolve: (name) => {
+      const pages = import.meta.glob<DefineComponent>('../pages/**/*.vue', { eager: true })
+      {{ 'return pages[`../pages/${name}.vue`]' }}
+    },
+
+    setup({ App, props, plugin }) {
+      return createSSRApp({ render: () => h(App, props) }).use(plugin)
+    },
+  })
+}

package/build/vue/tsconfig.json.stub

@@ -0,0 +1,16 @@
+{{{
+  exports({ to: app.makePath('inertia/tsconfig.json') })
+}}}
+{
+  "extends": "@adonisjs/tsconfig/tsconfig.client.json",
+  "compilerOptions": {
+    "baseUrl": ".",
+    "jsx": "preserve",
+    "module": "ESNext",
+    "jsxImportSource": "vue",
+    "paths": {
+      "~/*": ["./*"],
+    },
+  },
+  "include": ["./**/*.ts", "./**/*.vue"],
+}

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@adonisjs/inertia",
   "description": "Official Inertia.js adapter for AdonisJS",
-  "version": "1.0.0-2",
+  "version": "1.0.0-22",
   "engines": {
     "node": ">=18.16.0"
   },
@@ -16,12 +16,14 @@
     "./services/main": "./build/services/inertia.js",
     "./inertia_middleware": "./build/src/inertia_middleware.js",
     "./inertia_provider": "./build/providers/inertia_provider.js",
-    "./plugins/edge": "./build/src/plugins/edge.js",
-    "./plugins/api_client": "./build/src/plugins/api_client.js"
+    "./plugins/edge": "./build/src/plugins/edge/plugin.js",
+    "./plugins/api_client": "./build/src/plugins/japa/api_client.js",
+    "./client": "./build/src/plugins/vite.js",
+    "./helpers": "./build/src/helpers.js"
   },
   "scripts": {
     "clean": "del-cli build",
-    "copy:templates": "copyfiles \"stubs/**/*.stub\" build",
+    "copy:templates": "copyfiles --up 1 \"stubs/**/*.stub\" build",
     "typecheck": "tsc --noEmit",
     "lint": "eslint . --ext=.ts",
     "format": "prettier --write .",
@@ -36,55 +38,60 @@
     "prepublishOnly": "npm run build"
   },
   "devDependencies": {
-    "@adonisjs/assembler": "6.1.3-25",
-    "@adonisjs/core": "6.1.5-31",
-    "@adonisjs/eslint-config": "^1.1.8",
-    "@adonisjs/prettier-config": "^1.1.8",
-    "@adonisjs/session": "7.0.0-13",
-    "@adonisjs/tsconfig": "^1.1.8",
-    "@japa/api-client": "^2.0.1",
-    "@japa/assert": "2.0.1",
-    "@japa/expect-type": "^2.0.0",
-    "@japa/file-system": "^2.0.1",
-    "@japa/plugin-adonisjs": "^2.0.1",
-    "@japa/runner": "3.0.5",
-    "@swc/core": "^1.3.96",
-    "@types/node": "^20.9.0",
-    "@types/qs": "^6.9.10",
-    "@types/supertest": "^2.0.16",
-    "c8": "^8.0.1",
+    "@adonisjs/assembler": "^7.2.3",
+    "@adonisjs/core": "6.3.1",
+    "@adonisjs/eslint-config": "^1.3.0",
+    "@adonisjs/prettier-config": "^1.3.0",
+    "@adonisjs/session": "7.3.0",
+    "@adonisjs/tsconfig": "^1.3.0",
+    "@adonisjs/vite": "^3.0.0-8",
+    "@japa/api-client": "^2.0.2",
+    "@japa/assert": "2.1.0",
+    "@japa/expect-type": "^2.0.1",
+    "@japa/file-system": "^2.2.0",
+    "@japa/plugin-adonisjs": "^3.0.0",
+    "@japa/runner": "3.1.1",
+    "@japa/snapshot": "^2.0.4",
+    "@swc/core": "^1.4.8",
+    "@tuyau/utils": "^0.0.1",
+    "@types/node": "^20.11.30",
+    "@types/qs": "^6.9.14",
+    "@types/supertest": "^6.0.2",
+    "@vavite/multibuild": "^4.1.1",
+    "c8": "^9.1.0",
     "copyfiles": "^2.4.1",
     "del-cli": "^5.1.0",
-    "edge.js": "^6.0.0",
-    "eslint": "^8.53.0",
-    "get-port": "^7.0.0",
-    "np": "^8.0.4",
-    "prettier": "^3.0.3",
-    "supertest": "^6.3.3",
-    "tinybench": "^2.5.1",
-    "ts-node": "^10.9.1",
-    "tsup": "^7.3.0",
-    "typescript": "~5.2.2"
+    "edge-parser": "^9.0.2",
+    "edge.js": "^6.0.2",
+    "eslint": "^8.57.0",
+    "get-port": "^7.1.0",
+    "np": "^10.0.2",
+    "prettier": "^3.2.5",
+    "supertest": "^6.3.4",
+    "tinybench": "^2.6.0",
+    "ts-node": "^10.9.2",
+    "tsup": "^8.0.2",
+    "typescript": "~5.4.3",
+    "vite": "^5.2.6"
   },
   "dependencies": {
-    "@poppinss/utils": "^6.5.1",
+    "@poppinss/utils": "^6.7.2",
     "crc-32": "^1.2.2",
-    "html-entities": "^2.4.0",
+    "edge-error": "^4.0.1",
+    "html-entities": "^2.5.2",
+    "locate-path": "^7.2.0",
     "qs": "^6.11.2"
   },
   "peerDependencies": {
-    "@adonisjs/assembler": "6.1.3-25",
-    "@adonisjs/core": "6.1.5-31",
-    "@adonisjs/session": "7.0.0-13",
-    "@japa/api-client": "^2.0.1",
+    "@adonisjs/core": "^6.2.0",
+    "@adonisjs/session": "^7.0.0",
+    "@adonisjs/vite": "^3.0.0-8",
+    "@japa/api-client": "^2.0.0",
     "edge.js": "^6.0.0"
   },
   "peerDependenciesMeta": {
-    "@adonisjs/assembler": {
-      "optional": false
-    },
     "@japa/api-client": {
-      "optional": false
+      "optional": true
     }
   },
   "author": "Julien Ripouteau <julien@ripouteau.com>,adonisjs",
@@ -121,11 +128,13 @@
     "entry": [
       "./index.ts",
       "./src/types.ts",
+      "./src/helpers.ts",
+      "./src/plugins/vite.ts",
       "./services/inertia.ts",
       "./src/inertia_middleware.ts",
       "./providers/inertia_provider.ts",
-      "./src/plugins/edge.ts",
-      "./src/plugins/api_client.ts"
+      "./src/plugins/edge/plugin.ts",
+      "./src/plugins/japa/api_client.ts"
     ],
     "outDir": "./build",
     "clean": true,

package/build/chunk-GDULL3NT.js

@@ -1,123 +0,0 @@
-// src/inertia.ts
-var kLazySymbol = Symbol("lazy");
-var Inertia = class {
-  constructor(ctx, config) {
-    this.ctx = ctx;
-    this.config = config;
-  }
-  /**
-   * Check if a value is a lazy prop
-   */
-  #isLazyProps(value) {
-    return typeof value === "object" && value && kLazySymbol in value;
-  }
-  /**
-   * Pick props to resolve based on x-inertia-partial-data header
-   *
-   * If header is not present, resolve all props except lazy props
-   * If header is present, resolve only the props that are listed in the header
-   */
-  #pickPropsToResolve(component, props) {
-    const partialData = this.ctx.request.header("x-inertia-partial-data")?.split(",").filter(Boolean);
-    const partialComponent = this.ctx.request.header("x-inertia-partial-component");
-    let entriesToResolve = Object.entries(props);
-    if (partialData && partialComponent === component) {
-      entriesToResolve = entriesToResolve.filter(([key]) => partialData.includes(key));
-    } else {
-      entriesToResolve = entriesToResolve.filter(([key]) => !this.#isLazyProps(props[key]));
-    }
-    return entriesToResolve;
-  }
-  /**
-   * Resolve the props that will be sent to the client
-   */
-  async #resolvePageProps(component, props) {
-    const entriesToResolve = this.#pickPropsToResolve(component, props);
-    const entries = entriesToResolve.map(async ([key, value]) => {
-      if (typeof value === "function") {
-        return [key, await value(this.ctx)];
-      }
-      if (this.#isLazyProps(value)) {
-        const lazyValue = value[kLazySymbol];
-        return [key, await lazyValue()];
-      }
-      return [key, value];
-    });
-    return Object.fromEntries(await Promise.all(entries));
-  }
-  /**
-   * Build the page object that will be returned to the client
-   *
-   * See https://inertiajs.com/the-protocol#the-page-object
-   */
-  async #buildPageObject(component, pageProps) {
-    return {
-      component,
-      version: this.config.versionCache.getVersion(),
-      props: await this.#resolvePageProps(component, { ...this.config.sharedData, ...pageProps }),
-      url: this.ctx.request.url(true)
-    };
-  }
-  /**
-   * Render a page using Inertia
-   */
-  async render(component, pageProps, viewProps) {
-    const pageObject = await this.#buildPageObject(component, pageProps);
-    const isInertiaRequest = !!this.ctx.request.header("x-inertia");
-    if (!isInertiaRequest) {
-      return this.ctx.view.render(this.config.rootView, { ...viewProps, page: pageObject });
-    }
-    return pageObject;
-  }
-  /**
-   * Create a lazy prop
-   *
-   * Lazy props are never resolved on first visit, but only when the client
-   * request a partial reload explicitely with this value.
-   *
-   * See https://inertiajs.com/partial-reloads#lazy-data-evaluation
-   */
-  lazy(callback) {
-    return { [kLazySymbol]: callback };
-  }
-  /**
-   * This method can be used to redirect the user to an external website
-   * or even a non-inertia route of your application.
-   *
-   * See https://inertiajs.com/redirects#external-redirects
-   */
-  async location(url) {
-    this.ctx.response.header("X-Inertia-Location", url);
-    this.ctx.response.status(409);
-  }
-};
-
-// src/inertia_middleware.ts
-var InertiaMiddleware = class {
-  constructor(config) {
-    this.config = config;
-  }
-  async handle(ctx, next) {
-    const { response, request } = ctx;
-    ctx.inertia = new Inertia(ctx, this.config);
-    await next();
-    const isInertiaRequest = !!request.header("x-inertia");
-    if (!isInertiaRequest)
-      return;
-    response.header("Vary", "Accept");
-    response.header("X-Inertia", "true");
-    const method = request.method();
-    if (response.getStatus() === 302 && ["PUT", "PATCH", "DELETE"].includes(method)) {
-      response.status(303);
-    }
-    const version = this.config.versionCache.getVersion().toString();
-    if (method === "GET" && request.header("x-inertia-version", "") !== version) {
-      response.header("x-inertia-location", request.url());
-      response.status(409);
-    }
-  }
-};
-
-export {
-  InertiaMiddleware
-};