@primate/vue 0.10.4 → 0.12.0

package/lib/private/Default.d.ts

@@ -0,0 +1,16 @@
+import Runtime from "#Runtime";
+import type BuildApp from "@primate/core/BuildApp";
+import type NextBuild from "@primate/core/NextBuild";
+export default class Default extends Runtime {
+    compile: {
+        client: (text: string, _: unknown, root: boolean) => {
+            js: string;
+        };
+        server: (text: string) => string;
+    };
+    root: {
+        create: (depth: number, i18n_active: boolean) => string;
+    };
+    build(app: BuildApp, next: NextBuild): Promise<BuildApp>;
+}
+//# sourceMappingURL=Default.d.ts.map

package/lib/private/Default.js

@@ -0,0 +1,23 @@
+import compile from "#compile";
+import create_root from "#create-root";
+import Runtime from "#Runtime";
+export default class Default extends Runtime {
+    compile = {
+        client: (text, _, root) => ({ js: root ? text : compile.server(text) }),
+        server: (text) => compile.server(text),
+    };
+    root = {
+        create: create_root,
+    };
+    async build(app, next) {
+        const filename = `${this.rootname}.js`;
+        const rootCode = this.root.create(app.depth(), app.i18n_active);
+        // Write directly without passing through compile.server
+        const path = app.runpath("server", filename);
+        await path.write(rootCode);
+        app.addRoot(path);
+        this.publish(app);
+        return next(app);
+    }
+}
+//# sourceMappingURL=Default.js.map

package/lib/private/Runtime.d.ts

@@ -0,0 +1,11 @@
+import FrontendModule from "@primate/core/frontend/Module";
+import type Render from "@primate/core/frontend/Render";
+import { type Renderer } from "vue";
+export default class Runtime extends FrontendModule<Renderer> {
+    name: string;
+    defaultExtensions: string[];
+    layouts: boolean;
+    client: boolean;
+    render: Render<Renderer>;
+}
+//# sourceMappingURL=Runtime.d.ts.map

package/lib/private/Runtime.js

@@ -0,0 +1,16 @@
+import FrontendModule from "@primate/core/frontend/Module";
+import { createSSRApp } from "vue";
+import { renderToString } from "vue/server-renderer";
+export default class Runtime extends FrontendModule {
+    name = "vue";
+    defaultExtensions = [".vue"];
+    layouts = true;
+    client = true;
+    render = async (component, props) => {
+        const app = createSSRApp(component, { p: { ...props } });
+        const html = await renderToString(app);
+        return { body: `<div id="app">${html}</div>` };
+    };
+}
+;
+//# sourceMappingURL=Runtime.js.map

package/lib/private/client/Validated.d.ts

@@ -0,0 +1,11 @@
+import type ValidateUpdater from "@primate/core/client/ValidateUpdater";
+import type ValidationError from "@primate/core/client/ValidationError";
+import { type Ref } from "vue";
+type Validated<T> = {
+    error: Ref<null | ValidationError>;
+    loading: Ref<boolean>;
+    update: (updater: ValidateUpdater<T>) => Promise<void>;
+    value: Ref<T>;
+};
+export type { Validated as default };
+//# sourceMappingURL=Validated.d.ts.map

package/lib/private/client/Validated.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=Validated.js.map

package/lib/private/client/index.d.ts

@@ -0,0 +1,11 @@
+import type ClientData from "@primate/core/client/Data";
+import type Dict from "@rcompat/type/Dict";
+type Data = ClientData<{
+    components: string[];
+    props: Dict[];
+}>;
+export default class VueClient {
+    static mount(_component: string, data: ClientData<Data>): void;
+}
+export {};
+//# sourceMappingURL=index.d.ts.map

package/lib/private/client/index.js

@@ -0,0 +1,34 @@
+import spa from "@primate/core/client/spa";
+import { createSSRApp } from "vue";
+import * as components from "vue:components";
+import root from "vue:root";
+export default class VueClient {
+    static mount(_component, data) {
+        const resolve = (names) => names.map((n) => components[n]);
+        let app = createSSRApp(root, {
+            p: {
+                components: resolve(data.components),
+                props: data.props,
+                request: data.request,
+                update: undefined,
+            },
+        });
+        app.mount("#app");
+        if (data.spa) {
+            window.addEventListener("DOMContentLoaded", () => spa((next, update) => {
+                app.unmount();
+                app = createSSRApp(root, {
+                    p: {
+                        components: resolve(next.components),
+                        props: next.props,
+                        request: next.request,
+                        update,
+                    },
+                });
+                app.mount("#app");
+                update?.();
+            }));
+        }
+    }
+}
+//# sourceMappingURL=index.js.map

package/lib/private/client/validate.d.ts

@@ -0,0 +1,25 @@
+import type Validated from "#client/Validated";
+declare const _default: <T>(initial: T) => {
+    delete: (url: string, options?: {
+        headers?: import("@rcompat/type/Dict").default<string>;
+        map?: ((v: T) => import("@rcompat/type/JSONValue").default) | undefined;
+        path?: import("@rcompat/type/JSONPointer").default;
+    } | undefined) => Validated<T>;
+    patch: (url: string, options?: {
+        headers?: import("@rcompat/type/Dict").default<string>;
+        map?: ((v: T) => import("@rcompat/type/JSONValue").default) | undefined;
+        path?: import("@rcompat/type/JSONPointer").default;
+    } | undefined) => Validated<T>;
+    post: (url: string, options?: {
+        headers?: import("@rcompat/type/Dict").default<string>;
+        map?: ((v: T) => import("@rcompat/type/JSONValue").default) | undefined;
+        path?: import("@rcompat/type/JSONPointer").default;
+    } | undefined) => Validated<T>;
+    put: (url: string, options?: {
+        headers?: import("@rcompat/type/Dict").default<string>;
+        map?: ((v: T) => import("@rcompat/type/JSONValue").default) | undefined;
+        path?: import("@rcompat/type/JSONPointer").default;
+    } | undefined) => Validated<T>;
+};
+export default _default;
+//# sourceMappingURL=validate.d.ts.map

package/lib/private/client/validate.js

@@ -0,0 +1,29 @@
+import toValidated from "@primate/core/client/toValidated";
+import validate from "@primate/core/client/validate";
+import { ref } from "vue";
+function useValidate(init) {
+    const value = ref(init.initial);
+    const loading = ref(false);
+    const error = ref(null);
+    async function update(updater) {
+        const previous = value.value;
+        const next = updater(previous);
+        value.value = next;
+        loading.value = true;
+        error.value = null;
+        try {
+            await validate(init, next);
+        }
+        catch (e) {
+            // rollback
+            value.value = previous;
+            error.value = e;
+        }
+        finally {
+            loading.value = false;
+        }
+    }
+    return { error, loading, update, value };
+}
+export default toValidated(useValidate);
+//# sourceMappingURL=validate.js.map

package/lib/private/compile.d.ts

@@ -0,0 +1,5 @@
+declare const _default: {
+    server(text: string): string;
+};
+export default _default;
+//# sourceMappingURL=compile.d.ts.map

package/lib/private/compile.js

@@ -0,0 +1,50 @@
+import typescript from "@rcompat/build/preset/typescript";
+import transform from "@rcompat/build/sync/transform";
+import { compileScript, compileTemplate, parse, } from "vue/compiler-sfc";
+const genDefaultAs = "__SCRIPT__";
+const id_size = 8;
+const analyze = ({ script, scriptSetup }) => {
+    return {
+        has_script: script !== null || scriptSetup !== null,
+        inline: scriptSetup !== null,
+        is_typescript: script?.lang === "ts" || scriptSetup?.lang === "ts",
+    };
+};
+export default {
+    server(text) {
+        const id = crypto.randomUUID().slice(0, id_size);
+        const { descriptor } = parse(text);
+        const { has_script, inline, is_typescript } = analyze(descriptor);
+        let module;
+        if (inline) {
+            // For <script setup>, compile with inlineTemplate to get both script and render
+            const script = compileScript(descriptor, {
+                genDefaultAs,
+                id,
+                inlineTemplate: true,
+            });
+            module = `
+        ${script.content}
+        export default { ...__SCRIPT__ };
+      `;
+        }
+        else {
+            // For regular components, compile template and script separately
+            const template = compileTemplate({
+                filename: "",
+                id,
+                source: descriptor.template?.content ?? "",
+            });
+            const script = has_script
+                ? compileScript(descriptor, { genDefaultAs, id, inlineTemplate: false })
+                : { content: `const ${genDefaultAs} = {}` };
+            module = `
+        ${template.code}
+        ${script.content}
+        export default { ...__SCRIPT__, render };
+      `;
+        }
+        return is_typescript ? transform(module, typescript).code : module;
+    },
+};
+//# sourceMappingURL=compile.js.map

package/lib/private/create-root.d.ts

@@ -0,0 +1,3 @@
+declare const _default: (depth: number, i18n_active: boolean) => string;
+export default _default;
+//# sourceMappingURL=create-root.d.ts.map

package/lib/private/create-root.js

@@ -0,0 +1,56 @@
+export default (depth, i18n_active) => {
+    const n = depth - 1;
+    // Build the nested component structure more carefully
+    const buildComponent = (index) => {
+        if (index === n) {
+            // Base case: render the deepest component
+            return `h(p.components[${index}], p.props[${index}] || {})`;
+        }
+        else {
+            // Recursive case: render component with child
+            const child = buildComponent(index + 1);
+            return `h(p.components[${index}], p.props[${index}] || {}, () => [${child}])`;
+        }
+    };
+    const body = depth > 0 ? buildComponent(0) : "h(\"div\")";
+    const vueImports = `import {
+    defineComponent, h${i18n_active ? ", ref, onMounted, onUnmounted" : ""}
+    } from "vue";`;
+    const i18nImports = i18n_active
+        ? `
+import t from "#i18n";
+import sInternal from "primate/s/internal";`
+        : "";
+    const i18nSetup = i18n_active
+        ? `
+const initialLocale = props.p?.request?.context?.i18n?.locale;
+if (initialLocale) t[sInternal].init(initialLocale);
+
+onMounted(() => { t[sInternal].restore(); });
+
+if (typeof window !== "undefined") {
+  const version = ref(t[sInternal].version);
+  const removeDepend = t[sInternal].depend(() => { void version.value; });
+  const unsubscribe = t.onChange(() => {
+    version.value = t[sInternal].version;
+  });
+  onUnmounted(() => { unsubscribe?.(); removeDepend?.(); });
+}`
+        : "";
+    return `
+${vueImports}
+${i18nImports}
+export default defineComponent({
+  name: "root",
+  props: { p: { type: Object, required: true } },
+  setup(props) {
+    ${i18nSetup}
+    return () => {
+      const p = props.p;
+      return ${body};
+    };
+  },
+});
+`;
+};
+//# sourceMappingURL=create-root.js.map

package/lib/public/Validated.d.ts

@@ -0,0 +1,2 @@
+export { default } from "#client/Validated";
+//# sourceMappingURL=Validated.d.ts.map

package/lib/public/Validated.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=Validated.js.map

package/lib/public/browser.d.ts

@@ -0,0 +1,2 @@
+export { default } from "#client/index";
+//# sourceMappingURL=browser.d.ts.map

package/lib/public/browser.js

@@ -0,0 +1,2 @@
+export { default } from "#client/index";
+//# sourceMappingURL=browser.js.map

package/lib/public/default.d.ts

@@ -0,0 +1,4 @@
+import Default from "#Default";
+declare const _default: (options?: typeof Default.input) => Default;
+export default _default;
+//# sourceMappingURL=default.d.ts.map

package/lib/public/default.js

@@ -0,0 +1,3 @@
+import Default from "#Default";
+export default (options) => new Default(options);
+//# sourceMappingURL=default.js.map

package/lib/public/runtime.d.ts

@@ -0,0 +1,4 @@
+import Runtime from "#Runtime";
+declare const _default: (options?: typeof Runtime.input) => Runtime;
+export default _default;
+//# sourceMappingURL=runtime.d.ts.map

package/lib/public/runtime.js

@@ -0,0 +1,3 @@
+import Runtime from "#Runtime";
+export default (options) => new Runtime(options);
+//# sourceMappingURL=runtime.js.map

package/lib/public/validate.d.ts

@@ -0,0 +1,2 @@
+export { default } from "#client/validate";
+//# sourceMappingURL=validate.d.ts.map

package/lib/public/validate.js

@@ -0,0 +1,2 @@
+export { default } from "#client/validate";
+//# sourceMappingURL=validate.js.map

package/package.json

@@ -1,45 +1,49 @@
 {
   "name": "@primate/vue",
-  "version": "0.10.4",
+  "version": "0.12.0",
   "description": "Primate Vue frontend",
-  "homepage": "https://primatejs.com/modules/vue",
-  "bugs": "https://github.com/primatejs/primate/issues",
+  "homepage": "https://primate.run/docs/frontend/vue",
+  "bugs": "https://github.com/primate-run/primate/issues",
   "license": "MIT",
   "files": [
-    "src/**/*.js",
-    "!src/**/*.spec.js"
+    "/lib/**/*.js",
+    "/lib/**/*.d.ts",
+    "!/**/*.spec.*"
   ],
   "repository": {
     "type": "git",
-    "url": "https://github.com/primatejs/primate",
+    "url": "https://github.com/primate-run/primate",
     "directory": "packages/vue"
   },
   "dependencies": {
-    "@primate/frontend": "^0.16.3"
+    "@rcompat/build": "^0.14.0",
+    "@primate/core": "^0.2.0"
   },
   "peerDependencies": {
     "vue": "3",
-    "primate": "^0.32.5"
+    "primate": "^0.33.0"
   },
   "type": "module",
   "imports": {
     "#*": {
-      "livetypes": "./src/private/*.js",
-      "default": "./src/private/*.js"
-    },
-    "#build": {
-      "livetypes": "./src/private/build/index.js",
-      "default": "./src/private/build/index.js"
-    },
-    "#serve": {
-      "livetypes": "./src/private/serve/index.js",
-      "default": "./src/private/serve/index.js"
+      "apekit": "./src/private/*.ts",
+      "default": "./lib/private/*.js"
     }
   },
   "exports": {
     ".": {
-      "runtime": "./src/public/runtime.js",
-      "default": "./src/public/default.js"
+      "browser": "./lib/public/browser.js",
+      "runtime": "./lib/public/runtime.js",
+      "default": "./lib/public/default.js"
+    },
+    "./*": {
+      "apekit": "./src/public/*.ts",
+      "default": "./lib/public/*.js"
     }
+  },
+  "scripts": {
+    "build": "npm run clean && tsc",
+    "clean": "rm -rf ./lib",
+    "lint": "eslint ."
   }
 }

package/src/private/build/index.js

@@ -1,18 +0,0 @@
-import name from "#name";
-import compile from "@primate/frontend/core/compile";
-import server from "./server.js";
-
-export default extension => async (app, next) => {
-  app.register(extension, {
-    ...await compile({
-      app,
-      extension,
-      name,
-      compile: { server },
-    }),
-    // no support for hydration
-    client: _ => _,
-  });
-
-  return next(app);
-};

package/src/private/build/server.js

@@ -1,6 +0,0 @@
-import { parse, compileTemplate } from "vue/compiler-sfc";
-
-export default text => compileTemplate({
-  source: parse(text).descriptor.template.content,
-  id: "1",
-}).code;

package/src/private/extension.js

@@ -1 +0,0 @@
-export default ".vue";

package/src/private/name.js

@@ -1 +0,0 @@
-export default "vue";

package/src/private/pkgname.js

@@ -1 +0,0 @@
-export default "@primate/vue";

package/src/private/serve/handler.js

@@ -1,11 +0,0 @@
-import { createSSRApp } from "vue";
-import render from "./render.js";
-
-export default (name, props = {}, options = {}) => async app => {
-  const component = createSSRApp({
-    render: (await app.get_component(name)).render,
-    data: () => props,
-  });
-
-  return app.view({ body: await render(component), ...options });
-};

package/src/private/serve/index.js

@@ -1,7 +0,0 @@
-import handler from "./handler.js";
-
-export default extension => (app, next) => {
-  app.register(extension, handler);
-
-  return next(app);
-};

package/src/private/serve/render.js

@@ -1 +0,0 @@
-export { renderToString as default } from "vue/server-renderer";

package/src/public/default.js

@@ -1,10 +0,0 @@
-import build from "#build";
-import default_extension from "#extension";
-import pkgname from "#name";
-import serve from "#serve";
-
-export default ({ extension = default_extension } = {}) => ({
-  name: pkgname,
-  build: build(extension),
-  serve: serve(extension),
-});

package/src/public/runtime.js

@@ -1,8 +0,0 @@
-import pkgname from "#pkgname";
-import serve from "#serve";
-import default_extension from "#extension";
-
-export default ({ extension = default_extension } = {}) => ({
-  name: pkgname,
-  serve: serve(extension),
-});