@web-widget/vue2 0.0.7 → 0.0.9

package/dist/types-e1e66865.d.ts

@@ -0,0 +1,18 @@
+import Vue, { Component } from 'vue';
+import { RenderContext, ComponentProps } from '@web-widget/schema';
+
+declare function defineWebWidget(): void;
+
+type JSONValue = string | number | boolean | {
+    [x: string]: JSONValue;
+} | Array<JSONValue>;
+type JSONProps = {
+    [x: string]: JSONValue;
+};
+interface DefineVueRenderOptions {
+    onBeforeCreateApp?: (context: RenderContext, component: Component, props: ComponentProps) => any;
+    onCreatedApp?: (app: Vue, context: RenderContext, component: Component, props: ComponentProps) => void;
+    onPrefetchData?: (context: RenderContext, component: Component, props: ComponentProps) => Promise<JSONProps>;
+}
+
+export { DefineVueRenderOptions as D, defineWebWidget as d };

package/dist/vue2.client.d.ts

@@ -1,13 +1,10 @@
 import * as _web_widget_schema from '@web-widget/schema';
-import Vue from 'vue';
-import { RenderContext, ComponentProps } from '@web-widget/schema/client-helpers';
+import { D as DefineVueRenderOptions } from './types-e1e66865.js';
+export { d as defineWebWidget } from './types-e1e66865.js';
 export * from '@web-widget/schema/client-helpers';
+import 'vue';
 
-interface DefineVueRenderOptions {
-    onBeforeCreateApp?: (context: RenderContext, component: Vue.Component, props: ComponentProps) => any;
-    onCreatedApp?: (app: Vue, context: RenderContext, component: Vue.Component, props: ComponentProps) => void;
-}
-declare const defineVueRender: ({ onBeforeCreateApp, onCreatedApp, }?: DefineVueRenderOptions) => (context: _web_widget_schema.ClientWidgetRenderContext<unknown> | _web_widget_schema.ClientRouteRenderContext<unknown, Record<string, string>>) => Promise<void | {
+declare const defineVueRender: ({ onBeforeCreateApp, onCreatedApp, onPrefetchData, }?: DefineVueRenderOptions) => (context: _web_widget_schema.ClientWidgetRenderContext<unknown> | _web_widget_schema.ClientRouteRenderContext<unknown, Record<string, string>>) => Promise<void | {
     mount?: (() => void | Promise<void>) | undefined;
     unmount?: (() => void | Promise<void>) | undefined;
     update?: (({ data }: {
@@ -34,4 +31,4 @@ declare const render: (context: _web_widget_schema.ClientWidgetRenderContext<unk
     }) => void | Promise<void>) | undefined;
 }>;
 
-export { DefineVueRenderOptions, defineVueRender, render };
+export { defineVueRender, render };

package/dist/vue2.client.js

@@ -19,33 +19,48 @@ var __spreadValues = (a, b) => {
 import Vue from "vue";
 import { defineRender as defineRenderHelper } from "@web-widget/schema/client-helpers";
 export * from "@web-widget/schema/client-helpers";
+
+// src/web-widget.ts
+function defineWebWidget() {
+  throw new TypeError(`Not yet implemented.`);
+}
+
+// src/client.ts
 var defineVueRender = ({
   onBeforeCreateApp = () => ({}),
   onCreatedApp = () => {
-  }
+  },
+  onPrefetchData
 } = {}) => {
   return defineRenderHelper(async (context, component, props) => {
     if (!context.container) {
       throw new Error(`Container required.`);
     }
     let app;
-    const vNodeData = {
-      props
-    };
     return {
       async mount() {
-        const shell = (context.recovering ? context.container.querySelector("[data-vue2-shell]") : null) || context.container.appendChild(document.createElement("div"));
+        const shell = context.recovering && context.container.querySelector("[webwidgetshell]") || context.container.appendChild(document.createElement("div"));
+        const state = context.recovering ? context.container.querySelector(
+          "[webwidgetstate]"
+        ) : null;
+        const stateContent = context.recovering && state ? JSON.parse(state.textContent) : onPrefetchData ? await onPrefetchData(context, component, props) : void 0;
+        const mergedProps = stateContent ? Object.assign({}, stateContent, props) : props;
+        const vNodeData = {
+          props: mergedProps
+        };
         app = new Vue(__spreadValues({
           render(h) {
             return h(component, vNodeData);
           }
-        }, onBeforeCreateApp(context, component, props)));
-        onCreatedApp(app, context, component, props);
+        }, onBeforeCreateApp(context, component, mergedProps)));
+        onCreatedApp(app, context, component, mergedProps);
         app.$mount(shell);
       },
       async unmount() {
         app == null ? void 0 : app.$destroy();
-        context.container.innerHTML = "";
+        if (context.container instanceof Element) {
+          context.container.innerHTML = "";
+        }
         app = null;
       }
     };
@@ -54,5 +69,6 @@ var defineVueRender = ({
 var render = defineVueRender();
 export {
   defineVueRender,
+  defineWebWidget,
   render
 };

package/dist/vue2.server.d.ts

@@ -1,13 +1,10 @@
 import * as _web_widget_schema from '@web-widget/schema';
-import Vue from 'vue';
-import { RenderContext, ComponentProps } from '@web-widget/schema/server-helpers';
+import { D as DefineVueRenderOptions } from './types-e1e66865.js';
+export { d as defineWebWidget } from './types-e1e66865.js';
 export * from '@web-widget/schema/server-helpers';
+import 'vue';
 
-interface DefineVueRenderOptions {
-    onBeforeCreateApp?: (context: RenderContext, component: Vue.Component, props: ComponentProps) => any;
-    onCreatedApp?: (app: Vue, context: RenderContext, component: Vue.Component, props: ComponentProps) => void;
-}
-declare const defineVueRender: ({ onBeforeCreateApp, onCreatedApp, }?: DefineVueRenderOptions) => (context: _web_widget_schema.ServerWidgetRenderContext<unknown> | _web_widget_schema.ServerRouteRenderContext<unknown, Record<string, string>>) => Promise<string | ReadableStream<any>>;
+declare const defineVueRender: ({ onBeforeCreateApp, onCreatedApp, onPrefetchData, }?: DefineVueRenderOptions) => (context: _web_widget_schema.ServerWidgetRenderContext<unknown> | _web_widget_schema.ServerRouteRenderContext<unknown, Record<string, string>>) => Promise<string | ReadableStream<any>>;
 declare const render: (context: _web_widget_schema.ServerWidgetRenderContext<unknown> | _web_widget_schema.ServerRouteRenderContext<unknown, Record<string, string>>) => Promise<string | ReadableStream<any>>;
 
-export { DefineVueRenderOptions, defineVueRender, render };
+export { defineVueRender, render };

package/dist/vue2.server.js

@@ -17,31 +17,56 @@ var __spreadValues = (a, b) => {
 
 // src/server.ts
 import Vue from "vue";
-import { createRenderer } from "vue-server-renderer/build.prod.js";
+import { createRenderer } from "vue-server-renderer";
 import { defineRender } from "@web-widget/schema/server-helpers";
 export * from "@web-widget/schema/server-helpers";
+
+// src/web-widget.ts
+function defineWebWidget() {
+  throw new TypeError(`Not yet implemented.`);
+}
+
+// src/server.ts
+var ESCAPE_LOOKUP = {
+  ">": "\\u003e",
+  "<": "\\u003c",
+  "\u2028": "\\u2028",
+  "\u2029": "\\u2029"
+};
+var ESCAPE_REGEX = /[><\u2028\u2029]/g;
+function htmlEscapeJsonString(str) {
+  return str.replace(ESCAPE_REGEX, (match) => ESCAPE_LOOKUP[match]);
+}
 var defineVueRender = ({
   onBeforeCreateApp = () => ({}),
   onCreatedApp = () => {
-  }
+  },
+  onPrefetchData
 } = {}) => {
   return defineRender(async (context, component, props) => {
+    const state = onPrefetchData ? await onPrefetchData(context, component, props) : void 0;
+    const mergedProps = state ? Object.assign({}, state, props) : props;
     const vNodeData = {
-      props
+      props: mergedProps
     };
     const renderer = createRenderer();
     const app = new Vue(__spreadValues({
       render(h) {
         return h(component, vNodeData);
       }
-    }, onBeforeCreateApp(context, component, props)));
-    onCreatedApp(app, context, component, props);
+    }, onBeforeCreateApp(context, component, mergedProps)));
+    onCreatedApp(app, context, component, mergedProps);
     const content = await renderer.renderToString(app);
-    return `<div data-vue2-shell>` + content + "</div>";
+    const stateStringify = state ? htmlEscapeJsonString(JSON.stringify(state)) : void 0;
+    return [
+      `<div webwidgetshell>${content}</div>`,
+      stateStringify ? `<script webwidgetstate type="application/json">${stateStringify}</script>` : ""
+    ].join("");
   });
 };
 var render = defineVueRender();
 export {
   defineVueRender,
+  defineWebWidget,
   render
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@web-widget/vue2",
-  "version": "0.0.7",
+  "version": "0.0.9",
   "type": "module",
   "exports": {
     ".": {
@@ -10,7 +10,6 @@
       },
       "default": {
         "types": "./dist/vue2.server.d.ts",
-        "development": "./dist/vue2.server.dev.js",
         "default": "./dist/vue2.server.js"
       }
     }
@@ -19,7 +18,7 @@
     "dist"
   ],
   "dependencies": {
-    "@web-widget/schema": "0.0.7"
+    "@web-widget/schema": "0.0.9"
   },
   "peerDependencies": {
     "vue": "^2.7.14",

package/dist/vue2.server.dev.d.ts

@@ -1,13 +0,0 @@
-import * as _web_widget_schema from '@web-widget/schema';
-import Vue from 'vue';
-import { RenderContext, ComponentProps } from '@web-widget/schema/server-helpers';
-export * from '@web-widget/schema/server-helpers';
-
-interface DefineVueRenderOptions {
-    onBeforeCreateApp?: (context: RenderContext, component: Vue.Component, props: ComponentProps) => any;
-    onCreatedApp?: (app: Vue, context: RenderContext, component: Vue.Component, props: ComponentProps) => void;
-}
-declare const defineVueRender: ({ onBeforeCreateApp, onCreatedApp, }?: DefineVueRenderOptions) => (context: _web_widget_schema.ServerWidgetRenderContext<unknown> | _web_widget_schema.ServerRouteRenderContext<unknown, Record<string, string>>) => Promise<string | ReadableStream<any>>;
-declare const render: (context: _web_widget_schema.ServerWidgetRenderContext<unknown> | _web_widget_schema.ServerRouteRenderContext<unknown, Record<string, string>>) => Promise<string | ReadableStream<any>>;
-
-export { DefineVueRenderOptions, defineVueRender, render };

package/dist/vue2.server.dev.js

@@ -1,47 +0,0 @@
-var __defProp = Object.defineProperty;
-var __getOwnPropSymbols = Object.getOwnPropertySymbols;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __propIsEnum = Object.prototype.propertyIsEnumerable;
-var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues = (a, b) => {
-  for (var prop in b || (b = {}))
-    if (__hasOwnProp.call(b, prop))
-      __defNormalProp(a, prop, b[prop]);
-  if (__getOwnPropSymbols)
-    for (var prop of __getOwnPropSymbols(b)) {
-      if (__propIsEnum.call(b, prop))
-        __defNormalProp(a, prop, b[prop]);
-    }
-  return a;
-};
-
-// src/server.dev.ts
-import Vue from "vue";
-import { createRenderer } from "vue-server-renderer/build.dev.js";
-import { defineRender } from "@web-widget/schema/server-helpers";
-export * from "@web-widget/schema/server-helpers";
-var defineVueRender = ({
-  onBeforeCreateApp = () => ({}),
-  onCreatedApp = () => {
-  }
-} = {}) => {
-  return defineRender(async (context, component, props) => {
-    const vNodeData = {
-      props
-    };
-    const renderer = createRenderer();
-    const app = new Vue(__spreadValues({
-      render(h) {
-        return h(component, vNodeData);
-      }
-    }, onBeforeCreateApp(context, component, props)));
-    onCreatedApp(app, context, component, props);
-    const content = await renderer.renderToString(app);
-    return `<div data-vue2-shell>` + content + "</div>";
-  });
-};
-var render = defineVueRender();
-export {
-  defineVueRender,
-  render
-};