@web-widget/vue 0.0.4 → 0.1.0
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.
- package/dist/vue.client.d.ts +113 -2
- package/dist/vue.client.js +134 -0
- package/dist/vue.server.d.ts +113 -2
- package/dist/vue.server.js +134 -0
- package/package.json +4 -3
package/dist/vue.client.d.ts
CHANGED
|
@@ -1,7 +1,118 @@
|
|
|
1
1
|
import * as _web_widget_schema from '@web-widget/schema';
|
|
2
|
-
import
|
|
2
|
+
import * as vue from 'vue';
|
|
3
|
+
import { PropType, VNode, App, Component } from 'vue';
|
|
3
4
|
import { RenderContext, ComponentProps } from '@web-widget/schema/client-helpers';
|
|
4
5
|
export * from '@web-widget/schema/client-helpers';
|
|
6
|
+
import { Loader, WebWidgetContainerProps } 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
|
+
loader: {
|
|
27
|
+
type: PropType<Loader>;
|
|
28
|
+
required: true;
|
|
29
|
+
};
|
|
30
|
+
loading: {
|
|
31
|
+
type: PropType<string | undefined>;
|
|
32
|
+
};
|
|
33
|
+
name: {
|
|
34
|
+
type: PropType<string | undefined>;
|
|
35
|
+
};
|
|
36
|
+
recovering: {
|
|
37
|
+
type: PropType<boolean | undefined>;
|
|
38
|
+
};
|
|
39
|
+
renderTarget: {
|
|
40
|
+
type: PropType<"light" | "shadow" | undefined>;
|
|
41
|
+
default: string;
|
|
42
|
+
};
|
|
43
|
+
}, () => VNode<vue.RendererNode, vue.RendererElement, {
|
|
44
|
+
[key: string]: any;
|
|
45
|
+
}>, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps, Readonly<vue.ExtractPropTypes<{
|
|
46
|
+
base: {
|
|
47
|
+
type: PropType<string | undefined>;
|
|
48
|
+
};
|
|
49
|
+
data: {
|
|
50
|
+
type: PropType<{
|
|
51
|
+
[x: string]: string | number | boolean | {
|
|
52
|
+
[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)[])[])[])[])[])[])[])[])[])[])[];
|
|
53
|
+
} | (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)[])[])[])[])[])[])[])[])[])[])[];
|
|
54
|
+
} | undefined>;
|
|
55
|
+
default: {};
|
|
56
|
+
};
|
|
57
|
+
import: {
|
|
58
|
+
type: PropType<string | undefined>;
|
|
59
|
+
};
|
|
60
|
+
loader: {
|
|
61
|
+
type: PropType<Loader>;
|
|
62
|
+
required: true;
|
|
63
|
+
};
|
|
64
|
+
loading: {
|
|
65
|
+
type: PropType<string | undefined>;
|
|
66
|
+
};
|
|
67
|
+
name: {
|
|
68
|
+
type: PropType<string | undefined>;
|
|
69
|
+
};
|
|
70
|
+
recovering: {
|
|
71
|
+
type: PropType<boolean | undefined>;
|
|
72
|
+
};
|
|
73
|
+
renderTarget: {
|
|
74
|
+
type: PropType<"light" | "shadow" | undefined>;
|
|
75
|
+
default: string;
|
|
76
|
+
};
|
|
77
|
+
}>>, {
|
|
78
|
+
data: {
|
|
79
|
+
[x: string]: string | number | boolean | {
|
|
80
|
+
[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)[])[])[])[])[])[])[])[])[])[])[];
|
|
81
|
+
} | (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)[])[])[])[])[])[])[])[])[])[])[];
|
|
82
|
+
} | undefined;
|
|
83
|
+
renderTarget: "light" | "shadow" | undefined;
|
|
84
|
+
}, {}>;
|
|
85
|
+
interface DefineWebWidgetOptions {
|
|
86
|
+
base?: WebWidgetContainerProps["base"];
|
|
87
|
+
import?: WebWidgetContainerProps["import"];
|
|
88
|
+
loading?: WebWidgetContainerProps["loading"];
|
|
89
|
+
name?: WebWidgetContainerProps["name"];
|
|
90
|
+
recovering?: WebWidgetContainerProps["recovering"];
|
|
91
|
+
renderTarget?: WebWidgetContainerProps["renderTarget"];
|
|
92
|
+
}
|
|
93
|
+
declare function defineWebWidget(loader: Loader, options: DefineWebWidgetOptions): vue.DefineComponent<{
|
|
94
|
+
clientOnly: {
|
|
95
|
+
type: BooleanConstructor;
|
|
96
|
+
default: boolean;
|
|
97
|
+
};
|
|
98
|
+
fallback: {
|
|
99
|
+
type: ObjectConstructor;
|
|
100
|
+
required: false;
|
|
101
|
+
};
|
|
102
|
+
}, () => VNode<vue.RendererNode, vue.RendererElement, {
|
|
103
|
+
[key: string]: any;
|
|
104
|
+
}>, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps, Readonly<vue.ExtractPropTypes<{
|
|
105
|
+
clientOnly: {
|
|
106
|
+
type: BooleanConstructor;
|
|
107
|
+
default: boolean;
|
|
108
|
+
};
|
|
109
|
+
fallback: {
|
|
110
|
+
type: ObjectConstructor;
|
|
111
|
+
required: false;
|
|
112
|
+
};
|
|
113
|
+
}>>, {
|
|
114
|
+
clientOnly: boolean;
|
|
115
|
+
}, {}>;
|
|
5
116
|
|
|
6
117
|
interface DefineVueRenderOptions {
|
|
7
118
|
onCreatedApp?: (app: App, context: RenderContext, component: Component, props: ComponentProps) => void;
|
|
@@ -33,4 +144,4 @@ declare const render: (context: _web_widget_schema.ClientWidgetRenderContext<unk
|
|
|
33
144
|
}) => void | Promise<void>) | undefined;
|
|
34
145
|
}>;
|
|
35
146
|
|
|
36
|
-
export { DefineVueRenderOptions, defineVueRender, render };
|
|
147
|
+
export { DefineVueRenderOptions, DefineWebWidgetOptions, WebWidget, __ENV__, defineVueRender, defineWebWidget, render };
|
package/dist/vue.client.js
CHANGED
|
@@ -1,7 +1,138 @@
|
|
|
1
|
+
var __defProp = Object.defineProperty;
|
|
2
|
+
var __defProps = Object.defineProperties;
|
|
3
|
+
var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
|
|
4
|
+
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
|
|
5
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
6
|
+
var __propIsEnum = Object.prototype.propertyIsEnumerable;
|
|
7
|
+
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
8
|
+
var __spreadValues = (a, b) => {
|
|
9
|
+
for (var prop in b || (b = {}))
|
|
10
|
+
if (__hasOwnProp.call(b, prop))
|
|
11
|
+
__defNormalProp(a, prop, b[prop]);
|
|
12
|
+
if (__getOwnPropSymbols)
|
|
13
|
+
for (var prop of __getOwnPropSymbols(b)) {
|
|
14
|
+
if (__propIsEnum.call(b, prop))
|
|
15
|
+
__defNormalProp(a, prop, b[prop]);
|
|
16
|
+
}
|
|
17
|
+
return a;
|
|
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
|
+
};
|
|
32
|
+
|
|
33
|
+
// src/web-widget.ts
|
|
34
|
+
import { parse } from "@web-widget/web-widget";
|
|
35
|
+
import { h, defineComponent, Suspense } from "vue";
|
|
36
|
+
var __ENV__ = {
|
|
37
|
+
server: true
|
|
38
|
+
};
|
|
39
|
+
var WebWidget = /* @__PURE__ */ defineComponent({
|
|
40
|
+
name: "WebWidget",
|
|
41
|
+
props: {
|
|
42
|
+
base: {
|
|
43
|
+
type: String
|
|
44
|
+
},
|
|
45
|
+
data: {
|
|
46
|
+
type: Object,
|
|
47
|
+
default: {}
|
|
48
|
+
},
|
|
49
|
+
import: {
|
|
50
|
+
type: String
|
|
51
|
+
},
|
|
52
|
+
loader: {
|
|
53
|
+
type: Function,
|
|
54
|
+
required: true
|
|
55
|
+
},
|
|
56
|
+
loading: {
|
|
57
|
+
type: String
|
|
58
|
+
},
|
|
59
|
+
name: {
|
|
60
|
+
type: String
|
|
61
|
+
},
|
|
62
|
+
recovering: {
|
|
63
|
+
type: Boolean
|
|
64
|
+
},
|
|
65
|
+
renderTarget: {
|
|
66
|
+
type: String,
|
|
67
|
+
default: "light"
|
|
68
|
+
}
|
|
69
|
+
},
|
|
70
|
+
async setup(_a, { slots }) {
|
|
71
|
+
var _b = _a, { loader } = _b, props = __objRest(_b, ["loader"]);
|
|
72
|
+
if (props.recovering && !loader) {
|
|
73
|
+
throw new TypeError(`Missing loader.`);
|
|
74
|
+
}
|
|
75
|
+
if (Object.keys(slots).length > 0) {
|
|
76
|
+
throw new TypeError(`No support slot.`);
|
|
77
|
+
}
|
|
78
|
+
const children = "";
|
|
79
|
+
const [tag, attrs, innerHTML] = await parse(loader, __spreadProps(__spreadValues({}, props), {
|
|
80
|
+
children
|
|
81
|
+
}));
|
|
82
|
+
if (!__ENV__.server) {
|
|
83
|
+
console.warn(`Client components are experimental.`);
|
|
84
|
+
await customElements.whenDefined(tag);
|
|
85
|
+
const element = Object.assign(document.createElement(tag), props);
|
|
86
|
+
await element.bootstrap();
|
|
87
|
+
}
|
|
88
|
+
return () => h(tag, __spreadProps(__spreadValues({}, attrs), {
|
|
89
|
+
innerHTML
|
|
90
|
+
}));
|
|
91
|
+
}
|
|
92
|
+
});
|
|
93
|
+
function defineWebWidget(loader, options) {
|
|
94
|
+
options.renderTarget = "light";
|
|
95
|
+
return /* @__PURE__ */ defineComponent({
|
|
96
|
+
name: "WebWidgetSuspense",
|
|
97
|
+
props: {
|
|
98
|
+
clientOnly: {
|
|
99
|
+
type: Boolean,
|
|
100
|
+
default: !options.recovering
|
|
101
|
+
},
|
|
102
|
+
fallback: {
|
|
103
|
+
type: Object,
|
|
104
|
+
required: false
|
|
105
|
+
}
|
|
106
|
+
},
|
|
107
|
+
setup(_a, { slots }) {
|
|
108
|
+
var _b = _a, { clientOnly, fallback } = _b, data = __objRest(_b, ["clientOnly", "fallback"]);
|
|
109
|
+
return () => h(
|
|
110
|
+
Suspense,
|
|
111
|
+
{},
|
|
112
|
+
{
|
|
113
|
+
default: h(
|
|
114
|
+
WebWidget,
|
|
115
|
+
__spreadProps(__spreadValues({}, options), {
|
|
116
|
+
loader,
|
|
117
|
+
data,
|
|
118
|
+
recovering: !clientOnly
|
|
119
|
+
}),
|
|
120
|
+
slots
|
|
121
|
+
),
|
|
122
|
+
fallback
|
|
123
|
+
}
|
|
124
|
+
);
|
|
125
|
+
}
|
|
126
|
+
});
|
|
127
|
+
}
|
|
128
|
+
|
|
1
129
|
// src/client.ts
|
|
2
130
|
import { createApp, createSSRApp } from "vue";
|
|
3
131
|
import { defineRender } from "@web-widget/schema/client-helpers";
|
|
4
132
|
export * from "@web-widget/schema/client-helpers";
|
|
133
|
+
Reflect.defineProperty(__ENV__, "server", {
|
|
134
|
+
value: false
|
|
135
|
+
});
|
|
5
136
|
var defineVueRender = ({
|
|
6
137
|
onCreatedApp = () => {
|
|
7
138
|
}
|
|
@@ -31,6 +162,9 @@ var defineVueRender = ({
|
|
|
31
162
|
};
|
|
32
163
|
var render = defineVueRender();
|
|
33
164
|
export {
|
|
165
|
+
WebWidget,
|
|
166
|
+
__ENV__,
|
|
34
167
|
defineVueRender,
|
|
168
|
+
defineWebWidget,
|
|
35
169
|
render
|
|
36
170
|
};
|
package/dist/vue.server.d.ts
CHANGED
|
@@ -1,7 +1,118 @@
|
|
|
1
1
|
import * as _web_widget_schema from '@web-widget/schema';
|
|
2
|
-
import
|
|
2
|
+
import * as vue from 'vue';
|
|
3
|
+
import { PropType, VNode, App, Component } from 'vue';
|
|
3
4
|
import { RenderContext, ComponentProps } from '@web-widget/schema/server-helpers';
|
|
4
5
|
export * from '@web-widget/schema/server-helpers';
|
|
6
|
+
import { Loader, WebWidgetContainerProps } 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
|
+
loader: {
|
|
27
|
+
type: PropType<Loader>;
|
|
28
|
+
required: true;
|
|
29
|
+
};
|
|
30
|
+
loading: {
|
|
31
|
+
type: PropType<string | undefined>;
|
|
32
|
+
};
|
|
33
|
+
name: {
|
|
34
|
+
type: PropType<string | undefined>;
|
|
35
|
+
};
|
|
36
|
+
recovering: {
|
|
37
|
+
type: PropType<boolean | undefined>;
|
|
38
|
+
};
|
|
39
|
+
renderTarget: {
|
|
40
|
+
type: PropType<"light" | "shadow" | undefined>;
|
|
41
|
+
default: string;
|
|
42
|
+
};
|
|
43
|
+
}, () => VNode<vue.RendererNode, vue.RendererElement, {
|
|
44
|
+
[key: string]: any;
|
|
45
|
+
}>, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps, Readonly<vue.ExtractPropTypes<{
|
|
46
|
+
base: {
|
|
47
|
+
type: PropType<string | undefined>;
|
|
48
|
+
};
|
|
49
|
+
data: {
|
|
50
|
+
type: PropType<{
|
|
51
|
+
[x: string]: string | number | boolean | {
|
|
52
|
+
[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)[])[])[])[])[])[])[])[])[])[])[];
|
|
53
|
+
} | (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)[])[])[])[])[])[])[])[])[])[])[];
|
|
54
|
+
} | undefined>;
|
|
55
|
+
default: {};
|
|
56
|
+
};
|
|
57
|
+
import: {
|
|
58
|
+
type: PropType<string | undefined>;
|
|
59
|
+
};
|
|
60
|
+
loader: {
|
|
61
|
+
type: PropType<Loader>;
|
|
62
|
+
required: true;
|
|
63
|
+
};
|
|
64
|
+
loading: {
|
|
65
|
+
type: PropType<string | undefined>;
|
|
66
|
+
};
|
|
67
|
+
name: {
|
|
68
|
+
type: PropType<string | undefined>;
|
|
69
|
+
};
|
|
70
|
+
recovering: {
|
|
71
|
+
type: PropType<boolean | undefined>;
|
|
72
|
+
};
|
|
73
|
+
renderTarget: {
|
|
74
|
+
type: PropType<"light" | "shadow" | undefined>;
|
|
75
|
+
default: string;
|
|
76
|
+
};
|
|
77
|
+
}>>, {
|
|
78
|
+
data: {
|
|
79
|
+
[x: string]: string | number | boolean | {
|
|
80
|
+
[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)[])[])[])[])[])[])[])[])[])[])[];
|
|
81
|
+
} | (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)[])[])[])[])[])[])[])[])[])[])[];
|
|
82
|
+
} | undefined;
|
|
83
|
+
renderTarget: "light" | "shadow" | undefined;
|
|
84
|
+
}, {}>;
|
|
85
|
+
interface DefineWebWidgetOptions {
|
|
86
|
+
base?: WebWidgetContainerProps["base"];
|
|
87
|
+
import?: WebWidgetContainerProps["import"];
|
|
88
|
+
loading?: WebWidgetContainerProps["loading"];
|
|
89
|
+
name?: WebWidgetContainerProps["name"];
|
|
90
|
+
recovering?: WebWidgetContainerProps["recovering"];
|
|
91
|
+
renderTarget?: WebWidgetContainerProps["renderTarget"];
|
|
92
|
+
}
|
|
93
|
+
declare function defineWebWidget(loader: Loader, options: DefineWebWidgetOptions): vue.DefineComponent<{
|
|
94
|
+
clientOnly: {
|
|
95
|
+
type: BooleanConstructor;
|
|
96
|
+
default: boolean;
|
|
97
|
+
};
|
|
98
|
+
fallback: {
|
|
99
|
+
type: ObjectConstructor;
|
|
100
|
+
required: false;
|
|
101
|
+
};
|
|
102
|
+
}, () => VNode<vue.RendererNode, vue.RendererElement, {
|
|
103
|
+
[key: string]: any;
|
|
104
|
+
}>, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps, Readonly<vue.ExtractPropTypes<{
|
|
105
|
+
clientOnly: {
|
|
106
|
+
type: BooleanConstructor;
|
|
107
|
+
default: boolean;
|
|
108
|
+
};
|
|
109
|
+
fallback: {
|
|
110
|
+
type: ObjectConstructor;
|
|
111
|
+
required: false;
|
|
112
|
+
};
|
|
113
|
+
}>>, {
|
|
114
|
+
clientOnly: boolean;
|
|
115
|
+
}, {}>;
|
|
5
116
|
|
|
6
117
|
interface DefineVueRenderOptions {
|
|
7
118
|
onCreatedApp?: (app: App, context: RenderContext, component: Component, props: ComponentProps) => void;
|
|
@@ -9,4 +120,4 @@ interface DefineVueRenderOptions {
|
|
|
9
120
|
declare const defineVueRender: ({ onCreatedApp, }?: DefineVueRenderOptions) => (context: _web_widget_schema.ServerWidgetRenderContext<unknown> | _web_widget_schema.ServerRouteRenderContext<unknown, Record<string, string>>) => Promise<string | ReadableStream<any>>;
|
|
10
121
|
declare const render: (context: _web_widget_schema.ServerWidgetRenderContext<unknown> | _web_widget_schema.ServerRouteRenderContext<unknown, Record<string, string>>) => Promise<string | ReadableStream<any>>;
|
|
11
122
|
|
|
12
|
-
export { DefineVueRenderOptions, defineVueRender, render };
|
|
123
|
+
export { DefineVueRenderOptions, DefineWebWidgetOptions, WebWidget, __ENV__, defineVueRender, defineWebWidget, render };
|
package/dist/vue.server.js
CHANGED
|
@@ -1,8 +1,139 @@
|
|
|
1
|
+
var __defProp = Object.defineProperty;
|
|
2
|
+
var __defProps = Object.defineProperties;
|
|
3
|
+
var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
|
|
4
|
+
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
|
|
5
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
6
|
+
var __propIsEnum = Object.prototype.propertyIsEnumerable;
|
|
7
|
+
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
8
|
+
var __spreadValues = (a, b) => {
|
|
9
|
+
for (var prop in b || (b = {}))
|
|
10
|
+
if (__hasOwnProp.call(b, prop))
|
|
11
|
+
__defNormalProp(a, prop, b[prop]);
|
|
12
|
+
if (__getOwnPropSymbols)
|
|
13
|
+
for (var prop of __getOwnPropSymbols(b)) {
|
|
14
|
+
if (__propIsEnum.call(b, prop))
|
|
15
|
+
__defNormalProp(a, prop, b[prop]);
|
|
16
|
+
}
|
|
17
|
+
return a;
|
|
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
|
+
};
|
|
32
|
+
|
|
33
|
+
// src/web-widget.ts
|
|
34
|
+
import { parse } from "@web-widget/web-widget";
|
|
35
|
+
import { h, defineComponent, Suspense } from "vue";
|
|
36
|
+
var __ENV__ = {
|
|
37
|
+
server: true
|
|
38
|
+
};
|
|
39
|
+
var WebWidget = /* @__PURE__ */ defineComponent({
|
|
40
|
+
name: "WebWidget",
|
|
41
|
+
props: {
|
|
42
|
+
base: {
|
|
43
|
+
type: String
|
|
44
|
+
},
|
|
45
|
+
data: {
|
|
46
|
+
type: Object,
|
|
47
|
+
default: {}
|
|
48
|
+
},
|
|
49
|
+
import: {
|
|
50
|
+
type: String
|
|
51
|
+
},
|
|
52
|
+
loader: {
|
|
53
|
+
type: Function,
|
|
54
|
+
required: true
|
|
55
|
+
},
|
|
56
|
+
loading: {
|
|
57
|
+
type: String
|
|
58
|
+
},
|
|
59
|
+
name: {
|
|
60
|
+
type: String
|
|
61
|
+
},
|
|
62
|
+
recovering: {
|
|
63
|
+
type: Boolean
|
|
64
|
+
},
|
|
65
|
+
renderTarget: {
|
|
66
|
+
type: String,
|
|
67
|
+
default: "light"
|
|
68
|
+
}
|
|
69
|
+
},
|
|
70
|
+
async setup(_a, { slots }) {
|
|
71
|
+
var _b = _a, { loader } = _b, props = __objRest(_b, ["loader"]);
|
|
72
|
+
if (props.recovering && !loader) {
|
|
73
|
+
throw new TypeError(`Missing loader.`);
|
|
74
|
+
}
|
|
75
|
+
if (Object.keys(slots).length > 0) {
|
|
76
|
+
throw new TypeError(`No support slot.`);
|
|
77
|
+
}
|
|
78
|
+
const children = "";
|
|
79
|
+
const [tag, attrs, innerHTML] = await parse(loader, __spreadProps(__spreadValues({}, props), {
|
|
80
|
+
children
|
|
81
|
+
}));
|
|
82
|
+
if (!__ENV__.server) {
|
|
83
|
+
console.warn(`Client components are experimental.`);
|
|
84
|
+
await customElements.whenDefined(tag);
|
|
85
|
+
const element = Object.assign(document.createElement(tag), props);
|
|
86
|
+
await element.bootstrap();
|
|
87
|
+
}
|
|
88
|
+
return () => h(tag, __spreadProps(__spreadValues({}, attrs), {
|
|
89
|
+
innerHTML
|
|
90
|
+
}));
|
|
91
|
+
}
|
|
92
|
+
});
|
|
93
|
+
function defineWebWidget(loader, options) {
|
|
94
|
+
options.renderTarget = "light";
|
|
95
|
+
return /* @__PURE__ */ defineComponent({
|
|
96
|
+
name: "WebWidgetSuspense",
|
|
97
|
+
props: {
|
|
98
|
+
clientOnly: {
|
|
99
|
+
type: Boolean,
|
|
100
|
+
default: !options.recovering
|
|
101
|
+
},
|
|
102
|
+
fallback: {
|
|
103
|
+
type: Object,
|
|
104
|
+
required: false
|
|
105
|
+
}
|
|
106
|
+
},
|
|
107
|
+
setup(_a, { slots }) {
|
|
108
|
+
var _b = _a, { clientOnly, fallback } = _b, data = __objRest(_b, ["clientOnly", "fallback"]);
|
|
109
|
+
return () => h(
|
|
110
|
+
Suspense,
|
|
111
|
+
{},
|
|
112
|
+
{
|
|
113
|
+
default: h(
|
|
114
|
+
WebWidget,
|
|
115
|
+
__spreadProps(__spreadValues({}, options), {
|
|
116
|
+
loader,
|
|
117
|
+
data,
|
|
118
|
+
recovering: !clientOnly
|
|
119
|
+
}),
|
|
120
|
+
slots
|
|
121
|
+
),
|
|
122
|
+
fallback
|
|
123
|
+
}
|
|
124
|
+
);
|
|
125
|
+
}
|
|
126
|
+
});
|
|
127
|
+
}
|
|
128
|
+
|
|
1
129
|
// src/server.ts
|
|
2
130
|
import { createSSRApp } from "vue";
|
|
3
131
|
import { defineRender } from "@web-widget/schema/server-helpers";
|
|
4
132
|
import { renderToWebStream } from "vue/server-renderer";
|
|
5
133
|
export * from "@web-widget/schema/server-helpers";
|
|
134
|
+
Reflect.defineProperty(__ENV__, "server", {
|
|
135
|
+
value: true
|
|
136
|
+
});
|
|
6
137
|
var defineVueRender = ({
|
|
7
138
|
onCreatedApp = () => {
|
|
8
139
|
}
|
|
@@ -16,6 +147,9 @@ var defineVueRender = ({
|
|
|
16
147
|
};
|
|
17
148
|
var render = defineVueRender();
|
|
18
149
|
export {
|
|
150
|
+
WebWidget,
|
|
151
|
+
__ENV__,
|
|
19
152
|
defineVueRender,
|
|
153
|
+
defineWebWidget,
|
|
20
154
|
render
|
|
21
155
|
};
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@web-widget/vue",
|
|
3
|
-
"version": "0.0
|
|
3
|
+
"version": "0.1.0",
|
|
4
4
|
"type": "module",
|
|
5
5
|
"exports": {
|
|
6
6
|
".": {
|
|
@@ -22,10 +22,11 @@
|
|
|
22
22
|
"dist"
|
|
23
23
|
],
|
|
24
24
|
"dependencies": {
|
|
25
|
-
"@web-widget/schema": "0.0.
|
|
25
|
+
"@web-widget/schema": "0.0.8",
|
|
26
|
+
"@web-widget/web-widget": "1.0.0-alpha.6"
|
|
26
27
|
},
|
|
27
28
|
"peerDependencies": {
|
|
28
|
-
"vue": "
|
|
29
|
+
"vue": ">3.3.3"
|
|
29
30
|
},
|
|
30
31
|
"devDependencies": {
|
|
31
32
|
"tsup": "^7.0.0",
|