@web-widget/vue2 0.0.11 → 0.0.14

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -0,0 +1,147 @@
1
+ import * as vue_types_v3_component_options_js from 'vue/types/v3-component-options.js';
2
+ import * as vue from 'vue';
3
+ import vue__default, { PropType, Component } from 'vue';
4
+ import * as _web_widget_schema from '@web-widget/schema';
5
+ import { RenderContext, ComponentProps } from '@web-widget/schema';
6
+ import { Loader, WebWidgetContainerOptions } from '@web-widget/web-widget';
7
+
8
+ declare const __ENV__: {
9
+ server: boolean;
10
+ };
11
+ declare const WebWidget: vue.DefineComponent<{
12
+ base: {
13
+ type: PropType<string | undefined>;
14
+ };
15
+ data: {
16
+ type: PropType<{
17
+ [x: string]: string | number | boolean | {
18
+ [x: string]: string | number | boolean | any | (string | number | boolean | any | (string | number | boolean | any | (string | number | boolean | any | (string | number | boolean | any | (string | number | boolean | any | (string | number | boolean | any | (string | number | boolean | any | (string | number | boolean | any | (string | number | boolean | any | (string | number | boolean | any | (string | number | boolean | any | any)[])[])[])[])[])[])[])[])[])[])[];
19
+ } | (string | number | boolean | any | (string | number | boolean | any | (string | number | boolean | any | (string | number | boolean | any | (string | number | boolean | any | (string | number | boolean | any | (string | number | boolean | any | (string | number | boolean | any | (string | number | boolean | any | (string | number | boolean | any | (string | number | boolean | any | any)[])[])[])[])[])[])[])[])[])[])[];
20
+ } | undefined>;
21
+ default: {};
22
+ };
23
+ import: {
24
+ type: PropType<string | undefined>;
25
+ };
26
+ inactive: {
27
+ type: PropType<boolean | undefined>;
28
+ default: undefined;
29
+ };
30
+ loader: {
31
+ type: PropType<Loader>;
32
+ required: true;
33
+ };
34
+ loading: {
35
+ type: PropType<"lazy" | "eager" | undefined>;
36
+ };
37
+ meta: {
38
+ type: PropType<_web_widget_schema.Meta | undefined>;
39
+ };
40
+ name: {
41
+ type: PropType<string | undefined>;
42
+ };
43
+ renderStage: {
44
+ type: PropType<"server" | "client" | undefined>;
45
+ };
46
+ renderTarget: {
47
+ type: PropType<"light" | "shadow" | undefined>;
48
+ default: string;
49
+ };
50
+ fallback: {
51
+ type: PropType<Component>;
52
+ default: undefined;
53
+ };
54
+ }, () => vue.VNode, {}, {}, {}, vue_types_v3_component_options_js.ComponentOptionsMixin, vue_types_v3_component_options_js.ComponentOptionsMixin, {}, string, Readonly<vue.ExtractPropTypes<{
55
+ base: {
56
+ type: PropType<string | undefined>;
57
+ };
58
+ data: {
59
+ type: PropType<{
60
+ [x: string]: string | number | boolean | {
61
+ [x: string]: string | number | boolean | any | (string | number | boolean | any | (string | number | boolean | any | (string | number | boolean | any | (string | number | boolean | any | (string | number | boolean | any | (string | number | boolean | any | (string | number | boolean | any | (string | number | boolean | any | (string | number | boolean | any | (string | number | boolean | any | (string | number | boolean | any | any)[])[])[])[])[])[])[])[])[])[])[];
62
+ } | (string | number | boolean | any | (string | number | boolean | any | (string | number | boolean | any | (string | number | boolean | any | (string | number | boolean | any | (string | number | boolean | any | (string | number | boolean | any | (string | number | boolean | any | (string | number | boolean | any | (string | number | boolean | any | (string | number | boolean | any | any)[])[])[])[])[])[])[])[])[])[])[];
63
+ } | undefined>;
64
+ default: {};
65
+ };
66
+ import: {
67
+ type: PropType<string | undefined>;
68
+ };
69
+ inactive: {
70
+ type: PropType<boolean | undefined>;
71
+ default: undefined;
72
+ };
73
+ loader: {
74
+ type: PropType<Loader>;
75
+ required: true;
76
+ };
77
+ loading: {
78
+ type: PropType<"lazy" | "eager" | undefined>;
79
+ };
80
+ meta: {
81
+ type: PropType<_web_widget_schema.Meta | undefined>;
82
+ };
83
+ name: {
84
+ type: PropType<string | undefined>;
85
+ };
86
+ renderStage: {
87
+ type: PropType<"server" | "client" | undefined>;
88
+ };
89
+ renderTarget: {
90
+ type: PropType<"light" | "shadow" | undefined>;
91
+ default: string;
92
+ };
93
+ fallback: {
94
+ type: PropType<Component>;
95
+ default: undefined;
96
+ };
97
+ }>>, {
98
+ data: {
99
+ [x: string]: string | number | boolean | {
100
+ [x: string]: string | number | boolean | any | (string | number | boolean | any | (string | number | boolean | any | (string | number | boolean | any | (string | number | boolean | any | (string | number | boolean | any | (string | number | boolean | any | (string | number | boolean | any | (string | number | boolean | any | (string | number | boolean | any | (string | number | boolean | any | (string | number | boolean | any | any)[])[])[])[])[])[])[])[])[])[])[];
101
+ } | (string | number | boolean | any | (string | number | boolean | any | (string | number | boolean | any | (string | number | boolean | any | (string | number | boolean | any | (string | number | boolean | any | (string | number | boolean | any | (string | number | boolean | any | (string | number | boolean | any | (string | number | boolean | any | (string | number | boolean | any | any)[])[])[])[])[])[])[])[])[])[])[];
102
+ } | undefined;
103
+ inactive: boolean | undefined;
104
+ renderTarget: "light" | "shadow" | undefined;
105
+ fallback: Component;
106
+ }>;
107
+ interface DefineWebWidgetOptions {
108
+ base?: WebWidgetContainerOptions["base"];
109
+ import?: WebWidgetContainerOptions["import"];
110
+ loading?: WebWidgetContainerOptions["loading"];
111
+ name?: WebWidgetContainerOptions["name"];
112
+ renderStage?: WebWidgetContainerOptions["renderStage"];
113
+ renderTarget?: WebWidgetContainerOptions["renderTarget"];
114
+ }
115
+ declare function defineWebWidget(loader: Loader, options: DefineWebWidgetOptions): vue.DefineComponent<{
116
+ renderStage: {
117
+ type: PropType<"server" | "client" | undefined>;
118
+ default: "server" | "client" | undefined;
119
+ };
120
+ fallback: {
121
+ type: PropType<Component>;
122
+ };
123
+ }, () => vue.VNode, {}, {}, {}, vue_types_v3_component_options_js.ComponentOptionsMixin, vue_types_v3_component_options_js.ComponentOptionsMixin, {}, string, Readonly<vue.ExtractPropTypes<{
124
+ renderStage: {
125
+ type: PropType<"server" | "client" | undefined>;
126
+ default: "server" | "client" | undefined;
127
+ };
128
+ fallback: {
129
+ type: PropType<Component>;
130
+ };
131
+ }>>, {
132
+ renderStage: "server" | "client" | undefined;
133
+ }>;
134
+
135
+ type JSONValue = string | number | boolean | {
136
+ [x: string]: JSONValue;
137
+ } | Array<JSONValue>;
138
+ type JSONProps = {
139
+ [x: string]: JSONValue;
140
+ };
141
+ interface DefineVueRenderOptions {
142
+ onBeforeCreateApp?: (context: RenderContext, component: Component, props: ComponentProps) => any;
143
+ onCreatedApp?: (app: vue__default, context: RenderContext, component: Component, props: ComponentProps) => void;
144
+ onPrefetchData?: (context: RenderContext, component: Component, props: ComponentProps) => Promise<JSONProps>;
145
+ }
146
+
147
+ export { DefineVueRenderOptions as D, WebWidget as W, __ENV__ as _, DefineWebWidgetOptions as a, defineWebWidget as d };
package/dist/vite.d.ts ADDED
@@ -0,0 +1,8 @@
1
+ import { Plugin } from 'vite';
2
+ import { WebWidgetPluginOptions } from '@web-widget/vite';
3
+
4
+ interface Vue2WebWidgetPluginOptions extends WebWidgetPluginOptions {
5
+ }
6
+ declare function vue2WebWidgetPlugin({ provide, toWebWidgets, toComponents, }?: Vue2WebWidgetPluginOptions): Plugin[];
7
+
8
+ export { Vue2WebWidgetPluginOptions, vue2WebWidgetPlugin as default };
package/dist/vite.js ADDED
@@ -0,0 +1,25 @@
1
+ // src/vite.ts
2
+ import { webWidgetPlugin } from "@web-widget/vite";
3
+ function vue2WebWidgetPlugin({
4
+ provide = "@web-widget/vue2",
5
+ toWebWidgets = {
6
+ include: [
7
+ /\b(routes|widgets).*\.vue(\?.*\.(ts|js))?$/,
8
+ /(\.route|widget).*\.vue(\?.*\.(ts|js))?$/
9
+ ]
10
+ },
11
+ toComponents = {
12
+ include: ["widgets/**/*", "**/*.widget.*"],
13
+ exclude: /.vue\?.*$/,
14
+ includeImporter: /.*\.vue(\?.*\.(ts|js))?$/
15
+ }
16
+ } = {}) {
17
+ return webWidgetPlugin({
18
+ provide,
19
+ toWebWidgets,
20
+ toComponents
21
+ });
22
+ }
23
+ export {
24
+ vue2WebWidgetPlugin as default
25
+ };
@@ -1,8 +1,10 @@
1
1
  import * as _web_widget_schema from '@web-widget/schema';
2
- import { D as DefineVueRenderOptions } from './types-e1e66865.js';
3
- export { d as defineWebWidget } from './types-e1e66865.js';
2
+ import { D as DefineVueRenderOptions } from './types-000d9dee.js';
3
+ export { a as DefineWebWidgetOptions, W as WebWidget, _ as __ENV__, d as defineWebWidget } from './types-000d9dee.js';
4
4
  export * from '@web-widget/schema/client-helpers';
5
+ import 'vue/types/v3-component-options.js';
5
6
  import 'vue';
7
+ import '@web-widget/web-widget';
6
8
 
7
9
  declare const defineVueRender: ({ onBeforeCreateApp, onCreatedApp, onPrefetchData, }?: DefineVueRenderOptions) => (context: _web_widget_schema.ClientWidgetRenderContext<unknown> | _web_widget_schema.ClientRouteRenderContext<unknown, Record<string, string>>) => Promise<void | {
8
10
  mount?: (() => void | Promise<void>) | undefined;
@@ -1,4 +1,6 @@
1
1
  var __defProp = Object.defineProperty;
2
+ var __defProps = Object.defineProperties;
3
+ var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
2
4
  var __getOwnPropSymbols = Object.getOwnPropertySymbols;
3
5
  var __hasOwnProp = Object.prototype.hasOwnProperty;
4
6
  var __propIsEnum = Object.prototype.propertyIsEnumerable;
@@ -14,6 +16,19 @@ var __spreadValues = (a, b) => {
14
16
  }
15
17
  return a;
16
18
  };
19
+ var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
20
+ var __objRest = (source, exclude) => {
21
+ var target = {};
22
+ for (var prop in source)
23
+ if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
24
+ target[prop] = source[prop];
25
+ if (source != null && __getOwnPropSymbols)
26
+ for (var prop of __getOwnPropSymbols(source)) {
27
+ if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
28
+ target[prop] = source[prop];
29
+ }
30
+ return target;
31
+ };
17
32
 
18
33
  // src/client.ts
19
34
  import Vue from "vue";
@@ -21,8 +36,124 @@ import { defineRender as defineRenderHelper } from "@web-widget/schema/client-he
21
36
  export * from "@web-widget/schema/client-helpers";
22
37
 
23
38
  // src/web-widget.ts
24
- function defineWebWidget() {
25
- throw new TypeError(`Not yet implemented.`);
39
+ import { parse } from "@web-widget/web-widget";
40
+ import { h, defineComponent, defineAsyncComponent, useAttrs } from "vue";
41
+ var __ENV__ = {
42
+ server: true
43
+ };
44
+ var WebWidget = /* @__PURE__ */ defineComponent({
45
+ name: "WebWidget",
46
+ props: {
47
+ base: {
48
+ type: String
49
+ },
50
+ data: {
51
+ type: Object,
52
+ default: {}
53
+ },
54
+ import: {
55
+ type: String
56
+ },
57
+ inactive: {
58
+ type: Boolean,
59
+ // NOTE: If the default value is not set, it will be false here.
60
+ default: void 0
61
+ },
62
+ loader: {
63
+ type: Function,
64
+ required: true
65
+ },
66
+ loading: {
67
+ type: String
68
+ },
69
+ meta: {
70
+ type: Object
71
+ },
72
+ name: {
73
+ type: String
74
+ },
75
+ renderStage: {
76
+ type: String
77
+ },
78
+ renderTarget: {
79
+ type: String,
80
+ default: "light"
81
+ },
82
+ // -----
83
+ fallback: {
84
+ type: Object,
85
+ // NOTE: If the default value is not set, it will be false here.
86
+ default: void 0
87
+ }
88
+ },
89
+ setup(_a, { slots }) {
90
+ var _b = _a, { fallback, loader } = _b, props = __objRest(_b, ["fallback", "loader"]);
91
+ if (!loader) {
92
+ throw new TypeError(`Missing loader.`);
93
+ }
94
+ if (Object.keys(slots).length > 0) {
95
+ throw new TypeError(`No support slot.`);
96
+ }
97
+ const AsyncComponent = defineAsyncComponent({
98
+ loader: async () => {
99
+ const children = "";
100
+ const [tag, attrs, innerHTML] = await parse(loader, __spreadProps(__spreadValues({}, props), {
101
+ children
102
+ }));
103
+ if (!__ENV__.server) {
104
+ console.warn(`Client components are experimental.`);
105
+ await customElements.whenDefined(tag);
106
+ const element = Object.assign(document.createElement(tag), props);
107
+ await element.bootstrap();
108
+ }
109
+ return defineComponent({
110
+ render(h2) {
111
+ return h2(tag, {
112
+ attrs,
113
+ domProps: {
114
+ innerHTML
115
+ }
116
+ });
117
+ }
118
+ });
119
+ },
120
+ delay: 200,
121
+ timeout: 3e3,
122
+ errorComponent: fallback,
123
+ loadingComponent: fallback
124
+ });
125
+ return () => h(AsyncComponent);
126
+ }
127
+ });
128
+ function defineWebWidget(loader, options) {
129
+ console.warn(`defineWebWidget of vue2 is an experimental feature.`);
130
+ options.renderTarget = "light";
131
+ options.loading = "lazy";
132
+ return /* @__PURE__ */ defineComponent({
133
+ name: "WebWidgetSuspense",
134
+ props: {
135
+ renderStage: {
136
+ type: String,
137
+ default: options.renderStage
138
+ },
139
+ fallback: {
140
+ type: Object
141
+ }
142
+ },
143
+ setup({ fallback, renderStage }, { slots }) {
144
+ const data = useAttrs();
145
+ return () => h(WebWidget, {
146
+ props: __spreadProps(__spreadValues({}, options), {
147
+ data,
148
+ loader,
149
+ renderStage,
150
+ // -----
151
+ fallback
152
+ }),
153
+ scopedSlots: slots
154
+ });
155
+ }
156
+ });
26
157
  }
27
158
 
28
159
  // src/client.ts
@@ -40,19 +171,25 @@ var defineVueRender = ({
40
171
  return {
41
172
  async mount() {
42
173
  const shellTag = "web-widget.shell";
174
+ const vue2rootAttr = "data-vue2root";
175
+ const vue2ssrAttr = "data-server-rendered";
43
176
  const shell = context.recovering && context.container.querySelector(shellTag.replace(".", "\\.")) || context.container.appendChild(document.createElement(shellTag));
177
+ const componentRoot = context.recovering ? shell.querySelector(`[${vue2rootAttr}]`) : null;
44
178
  const state = context.recovering ? context.container.querySelector(
45
179
  "script[as=state]"
46
180
  ) : null;
47
181
  const stateContent = context.recovering && state ? JSON.parse(state.textContent) : onPrefetchData ? await onPrefetchData(context, component, props) : void 0;
48
182
  state == null ? void 0 : state.remove();
183
+ shell.removeAttribute(vue2ssrAttr);
184
+ componentRoot == null ? void 0 : componentRoot.removeAttribute(vue2rootAttr);
185
+ componentRoot == null ? void 0 : componentRoot.setAttribute(vue2ssrAttr, "true");
49
186
  const mergedProps = stateContent ? Object.assign(stateContent, props) : props;
50
187
  const vNodeData = {
51
188
  props: mergedProps
52
189
  };
53
190
  app = new Vue(__spreadValues({
54
- render(h) {
55
- return h(component, vNodeData);
191
+ render(h2) {
192
+ return h2(component, vNodeData);
56
193
  }
57
194
  }, onBeforeCreateApp(context, component, mergedProps)));
58
195
  onCreatedApp(app, context, component, mergedProps);
@@ -70,6 +207,8 @@ var defineVueRender = ({
70
207
  };
71
208
  var render = defineVueRender();
72
209
  export {
210
+ WebWidget,
211
+ __ENV__,
73
212
  defineVueRender,
74
213
  defineWebWidget,
75
214
  render
@@ -1,8 +1,10 @@
1
1
  import * as _web_widget_schema from '@web-widget/schema';
2
- import { D as DefineVueRenderOptions } from './types-e1e66865.js';
3
- export { d as defineWebWidget } from './types-e1e66865.js';
2
+ import { D as DefineVueRenderOptions } from './types-000d9dee.js';
3
+ export { a as DefineWebWidgetOptions, W as WebWidget, _ as __ENV__, d as defineWebWidget } from './types-000d9dee.js';
4
4
  export * from '@web-widget/schema/server-helpers';
5
+ import 'vue/types/v3-component-options.js';
5
6
  import 'vue';
7
+ import '@web-widget/web-widget';
6
8
 
7
9
  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>>;
8
10
  declare const render: (context: _web_widget_schema.ServerWidgetRenderContext<unknown> | _web_widget_schema.ServerRouteRenderContext<unknown, Record<string, string>>) => Promise<string | ReadableStream<any>>;
@@ -1,4 +1,6 @@
1
1
  var __defProp = Object.defineProperty;
2
+ var __defProps = Object.defineProperties;
3
+ var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
2
4
  var __getOwnPropSymbols = Object.getOwnPropertySymbols;
3
5
  var __hasOwnProp = Object.prototype.hasOwnProperty;
4
6
  var __propIsEnum = Object.prototype.propertyIsEnumerable;
@@ -14,16 +16,146 @@ var __spreadValues = (a, b) => {
14
16
  }
15
17
  return a;
16
18
  };
19
+ var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
20
+ var __objRest = (source, exclude) => {
21
+ var target = {};
22
+ for (var prop in source)
23
+ if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
24
+ target[prop] = source[prop];
25
+ if (source != null && __getOwnPropSymbols)
26
+ for (var prop of __getOwnPropSymbols(source)) {
27
+ if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
28
+ target[prop] = source[prop];
29
+ }
30
+ return target;
31
+ };
17
32
 
18
33
  // src/server.ts
34
+ import { defineRender } from "@web-widget/schema/server-helpers";
35
+ import { Readable } from "stream";
19
36
  import Vue from "vue";
20
37
  import { createRenderer } from "vue-server-renderer";
21
- import { defineRender } from "@web-widget/schema/server-helpers";
22
38
  export * from "@web-widget/schema/server-helpers";
23
39
 
24
40
  // src/web-widget.ts
25
- function defineWebWidget() {
26
- throw new TypeError(`Not yet implemented.`);
41
+ import { parse } from "@web-widget/web-widget";
42
+ import { h, defineComponent, defineAsyncComponent, useAttrs } from "vue";
43
+ var __ENV__ = {
44
+ server: true
45
+ };
46
+ var WebWidget = /* @__PURE__ */ defineComponent({
47
+ name: "WebWidget",
48
+ props: {
49
+ base: {
50
+ type: String
51
+ },
52
+ data: {
53
+ type: Object,
54
+ default: {}
55
+ },
56
+ import: {
57
+ type: String
58
+ },
59
+ inactive: {
60
+ type: Boolean,
61
+ // NOTE: If the default value is not set, it will be false here.
62
+ default: void 0
63
+ },
64
+ loader: {
65
+ type: Function,
66
+ required: true
67
+ },
68
+ loading: {
69
+ type: String
70
+ },
71
+ meta: {
72
+ type: Object
73
+ },
74
+ name: {
75
+ type: String
76
+ },
77
+ renderStage: {
78
+ type: String
79
+ },
80
+ renderTarget: {
81
+ type: String,
82
+ default: "light"
83
+ },
84
+ // -----
85
+ fallback: {
86
+ type: Object,
87
+ // NOTE: If the default value is not set, it will be false here.
88
+ default: void 0
89
+ }
90
+ },
91
+ setup(_a, { slots }) {
92
+ var _b = _a, { fallback, loader } = _b, props = __objRest(_b, ["fallback", "loader"]);
93
+ if (!loader) {
94
+ throw new TypeError(`Missing loader.`);
95
+ }
96
+ if (Object.keys(slots).length > 0) {
97
+ throw new TypeError(`No support slot.`);
98
+ }
99
+ const AsyncComponent = defineAsyncComponent({
100
+ loader: async () => {
101
+ const children = "";
102
+ const [tag, attrs, innerHTML] = await parse(loader, __spreadProps(__spreadValues({}, props), {
103
+ children
104
+ }));
105
+ if (!__ENV__.server) {
106
+ console.warn(`Client components are experimental.`);
107
+ await customElements.whenDefined(tag);
108
+ const element = Object.assign(document.createElement(tag), props);
109
+ await element.bootstrap();
110
+ }
111
+ return defineComponent({
112
+ render(h2) {
113
+ return h2(tag, {
114
+ attrs,
115
+ domProps: {
116
+ innerHTML
117
+ }
118
+ });
119
+ }
120
+ });
121
+ },
122
+ delay: 200,
123
+ timeout: 3e3,
124
+ errorComponent: fallback,
125
+ loadingComponent: fallback
126
+ });
127
+ return () => h(AsyncComponent);
128
+ }
129
+ });
130
+ function defineWebWidget(loader, options) {
131
+ console.warn(`defineWebWidget of vue2 is an experimental feature.`);
132
+ options.renderTarget = "light";
133
+ options.loading = "lazy";
134
+ return /* @__PURE__ */ defineComponent({
135
+ name: "WebWidgetSuspense",
136
+ props: {
137
+ renderStage: {
138
+ type: String,
139
+ default: options.renderStage
140
+ },
141
+ fallback: {
142
+ type: Object
143
+ }
144
+ },
145
+ setup({ fallback, renderStage }, { slots }) {
146
+ const data = useAttrs();
147
+ return () => h(WebWidget, {
148
+ props: __spreadProps(__spreadValues({}, options), {
149
+ data,
150
+ loader,
151
+ renderStage,
152
+ // -----
153
+ fallback
154
+ }),
155
+ scopedSlots: slots
156
+ });
157
+ }
158
+ });
27
159
  }
28
160
 
29
161
  // src/server.ts
@@ -44,28 +176,47 @@ var defineVueRender = ({
44
176
  onPrefetchData
45
177
  } = {}) => {
46
178
  return defineRender(async (context, component, props) => {
179
+ const shellTag = "web-widget.shell";
47
180
  const state = onPrefetchData ? await onPrefetchData(context, component, props) : void 0;
48
181
  const mergedProps = state ? Object.assign(state, props) : props;
182
+ const renderer = createRenderer();
49
183
  const vNodeData = {
184
+ attrs: {
185
+ "data-vue2root": "true"
186
+ },
50
187
  props: mergedProps
51
188
  };
52
- const renderer = createRenderer();
189
+ const shellTagVNodeData = {};
190
+ let render2;
191
+ if (state) {
192
+ const stateStringify = htmlEscapeJsonString(JSON.stringify(state));
193
+ render2 = (h2) => h2(shellTag, shellTagVNodeData, [
194
+ h2(component, vNodeData),
195
+ h2(
196
+ "script",
197
+ {
198
+ attrs: {
199
+ as: "state",
200
+ type: "application/json"
201
+ }
202
+ },
203
+ stateStringify
204
+ )
205
+ ]);
206
+ } else {
207
+ render2 = (h2) => h2(shellTag, shellTagVNodeData, [h2(component, vNodeData)]);
208
+ }
53
209
  const app = new Vue(__spreadValues({
54
- render(h) {
55
- return h(component, vNodeData);
56
- }
210
+ render: render2
57
211
  }, onBeforeCreateApp(context, component, mergedProps)));
58
212
  onCreatedApp(app, context, component, mergedProps);
59
- const content = await renderer.renderToString(app);
60
- const stateStringify = state ? htmlEscapeJsonString(JSON.stringify(state)) : void 0;
61
- return [
62
- `<web-widget.shell>${content}</web-widget.shell>`,
63
- stateStringify ? `<script as="state" type="application/json">${stateStringify}</script>` : ""
64
- ].join("");
213
+ return Readable.toWeb ? Readable.toWeb(renderer.renderToStream(app)) : renderer.renderToString(app);
65
214
  });
66
215
  };
67
216
  var render = defineVueRender();
68
217
  export {
218
+ WebWidget,
219
+ __ENV__,
69
220
  defineVueRender,
70
221
  defineWebWidget,
71
222
  render
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@web-widget/vue2",
3
- "version": "0.0.11",
3
+ "version": "0.0.14",
4
4
  "type": "module",
5
5
  "exports": {
6
6
  ".": {
@@ -12,21 +12,31 @@
12
12
  "types": "./dist/vue2.server.d.ts",
13
13
  "default": "./dist/vue2.server.js"
14
14
  }
15
+ },
16
+ "./vite": {
17
+ "types": "./dist/vite.d.ts",
18
+ "default": "./dist/vite.js"
15
19
  }
16
20
  },
17
21
  "files": [
18
22
  "dist"
19
23
  ],
20
24
  "dependencies": {
21
- "@web-widget/schema": "0.0.9"
22
- },
23
- "peerDependencies": {
25
+ "@web-widget/vite": "0.5.1",
26
+ "@web-widget/schema": "0.0.10",
27
+ "@web-widget/web-widget": "1.0.0-alpha.10",
24
28
  "vue": "^2.7.14",
25
29
  "vue-server-renderer": "^2.7.14"
26
30
  },
27
31
  "devDependencies": {
32
+ "@types/node": "^20.5.7",
28
33
  "tsup": "^7.0.0",
29
- "typescript": "^5.0.4"
34
+ "typescript": "^5.0.4",
35
+ "vite": "^4.4.9"
36
+ },
37
+ "peerDependencies": {
38
+ "vue": "^2.7.14",
39
+ "vue-server-renderer": "^2.7.14"
30
40
  },
31
41
  "publishConfig": {
32
42
  "access": "public"
@@ -1,18 +0,0 @@
1
- import Vue, { Component } from 'vue';
2
- import { RenderContext, ComponentProps } from '@web-widget/schema';
3
-
4
- declare function defineWebWidget(): void;
5
-
6
- type JSONValue = string | number | boolean | {
7
- [x: string]: JSONValue;
8
- } | Array<JSONValue>;
9
- type JSONProps = {
10
- [x: string]: JSONValue;
11
- };
12
- interface DefineVueRenderOptions {
13
- onBeforeCreateApp?: (context: RenderContext, component: Component, props: ComponentProps) => any;
14
- onCreatedApp?: (app: Vue, context: RenderContext, component: Component, props: ComponentProps) => void;
15
- onPrefetchData?: (context: RenderContext, component: Component, props: ComponentProps) => Promise<JSONProps>;
16
- }
17
-
18
- export { DefineVueRenderOptions as D, defineWebWidget as d };