@web-widget/vue2 3.0.0-beta.0 → 3.0.0-beta.3
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/chunk-B5NQMGE5.js +76 -0
- package/dist/chunk-F3PTQ2OL.js +10 -0
- package/dist/types-DSyp4jjz.d.ts +60 -0
- package/dist/vue2.adapter.client.d.ts +19 -0
- package/dist/{vue2.client.js → vue2.adapter.client.js} +20 -21
- package/dist/vue2.adapter.server.d.ts +19 -0
- package/dist/{vue2.server.js → vue2.adapter.server.js} +7 -8
- package/dist/vue2.d.ts +19 -0
- package/dist/vue2.js +8 -0
- package/package.json +35 -19
- package/dist/chunk-IXPFJTZD.js +0 -73
- package/dist/types-CBBNnd_v.d.ts +0 -86
- package/dist/vite.d.ts +0 -9
- package/dist/vite.js +0 -62
- package/dist/vue2.client.d.ts +0 -19
- package/dist/vue2.server.d.ts +0 -19
|
@@ -0,0 +1,76 @@
|
|
|
1
|
+
// src/components.ts
|
|
2
|
+
import { WebWidgetRenderer } from "@web-widget/web-widget";
|
|
3
|
+
import Vue, { h, defineComponent, useAttrs, getCurrentInstance } from "vue";
|
|
4
|
+
var globalConfigInitialized = false;
|
|
5
|
+
function ensureGlobalVueConfig() {
|
|
6
|
+
if (globalConfigInitialized) return;
|
|
7
|
+
globalConfigInitialized = true;
|
|
8
|
+
Vue.config.ignoredElements = ["web-widget"];
|
|
9
|
+
const prevWarnHandler = Vue.config.warnHandler;
|
|
10
|
+
Vue.config.warnHandler = (msg, _vm, trace) => {
|
|
11
|
+
if (msg.includes(`[object Promise]`)) {
|
|
12
|
+
return;
|
|
13
|
+
}
|
|
14
|
+
if (prevWarnHandler) {
|
|
15
|
+
prevWarnHandler.call(null, msg, _vm, trace);
|
|
16
|
+
} else {
|
|
17
|
+
console.error("[Vue warn]: ".concat(msg).concat(trace));
|
|
18
|
+
}
|
|
19
|
+
};
|
|
20
|
+
}
|
|
21
|
+
function container(loader, options = {}) {
|
|
22
|
+
if (!loader) {
|
|
23
|
+
throw new TypeError(`Missing loader.`);
|
|
24
|
+
}
|
|
25
|
+
ensureGlobalVueConfig();
|
|
26
|
+
return defineComponent({
|
|
27
|
+
name: "VueWidget",
|
|
28
|
+
inheritAttrs: false,
|
|
29
|
+
props: {
|
|
30
|
+
widget: {
|
|
31
|
+
type: Object,
|
|
32
|
+
default: () => ({})
|
|
33
|
+
}
|
|
34
|
+
},
|
|
35
|
+
async serverPrefetch() {
|
|
36
|
+
const widget = this.$widget;
|
|
37
|
+
this.$innerHTML = await widget.renderInnerHTMLToString();
|
|
38
|
+
},
|
|
39
|
+
setup(props, { slots }) {
|
|
40
|
+
var _a, _b;
|
|
41
|
+
if (Object.keys(slots).length > 0) {
|
|
42
|
+
throw new TypeError(`Slot not supported.`);
|
|
43
|
+
}
|
|
44
|
+
if (props.widget && "fallback" in props.widget) {
|
|
45
|
+
throw new TypeError(`fallback is not supported in Vue2 (no Suspense).`);
|
|
46
|
+
}
|
|
47
|
+
const {
|
|
48
|
+
loading = (_a = options.loading) != null ? _a : "lazy",
|
|
49
|
+
serverOnly,
|
|
50
|
+
clientOnly
|
|
51
|
+
} = props.widget;
|
|
52
|
+
const renderStage = serverOnly ? "server" : clientOnly ? "client" : options.renderStage;
|
|
53
|
+
const data = useAttrs();
|
|
54
|
+
const widget = new WebWidgetRenderer(loader, {
|
|
55
|
+
...options,
|
|
56
|
+
data,
|
|
57
|
+
loading,
|
|
58
|
+
renderStage,
|
|
59
|
+
renderTarget: (_b = options.renderTarget) != null ? _b : "light"
|
|
60
|
+
});
|
|
61
|
+
const instance = getCurrentInstance();
|
|
62
|
+
instance.proxy.$widget = widget;
|
|
63
|
+
return () => {
|
|
64
|
+
const innerHTML = instance.proxy.$innerHTML;
|
|
65
|
+
return h(widget.localName, {
|
|
66
|
+
attrs: widget.attributes,
|
|
67
|
+
domProps: { innerHTML }
|
|
68
|
+
});
|
|
69
|
+
};
|
|
70
|
+
}
|
|
71
|
+
});
|
|
72
|
+
}
|
|
73
|
+
|
|
74
|
+
export {
|
|
75
|
+
container
|
|
76
|
+
};
|
|
@@ -0,0 +1,60 @@
|
|
|
1
|
+
import { WebWidgetRendererOptions, Loader } from '@web-widget/web-widget';
|
|
2
|
+
import { ExtractWidgetProps } from '@web-widget/schema';
|
|
3
|
+
import Vue, { DefineComponent, Component } from 'vue';
|
|
4
|
+
import { SerializableValue } from '@web-widget/helpers';
|
|
5
|
+
|
|
6
|
+
/**
|
|
7
|
+
* A Vue2 component wrapping a widget, with props `T` plus container config.
|
|
8
|
+
*/
|
|
9
|
+
type VueWidgetComponent<T = unknown> = DefineComponent<{
|
|
10
|
+
widget?: WidgetContainerConfig;
|
|
11
|
+
}> & {
|
|
12
|
+
attrs: T;
|
|
13
|
+
};
|
|
14
|
+
interface DefineWebWidgetOptions {
|
|
15
|
+
base?: WebWidgetRendererOptions['base'];
|
|
16
|
+
import?: WebWidgetRendererOptions['import'];
|
|
17
|
+
loading?: WebWidgetRendererOptions['loading'];
|
|
18
|
+
name?: WebWidgetRendererOptions['name'];
|
|
19
|
+
renderStage?: WebWidgetRendererOptions['renderStage'];
|
|
20
|
+
renderTarget?: WebWidgetRendererOptions['renderTarget'];
|
|
21
|
+
}
|
|
22
|
+
interface WidgetContainerConfig {
|
|
23
|
+
/** Client-side module loading strategy */
|
|
24
|
+
loading?: WebWidgetRendererOptions['loading'];
|
|
25
|
+
/** Widget renders only on the server, not mounted on the client. Mutually exclusive with `clientOnly`. */
|
|
26
|
+
serverOnly?: true;
|
|
27
|
+
/** Widget renders only on the client, producing no server HTML. Mutually exclusive with `serverOnly`. */
|
|
28
|
+
clientOnly?: true;
|
|
29
|
+
}
|
|
30
|
+
/**
|
|
31
|
+
* Container function (WebWidgetAdapter protocol).
|
|
32
|
+
*
|
|
33
|
+
* Wraps a widget module loader into a Vue2 component with best-effort
|
|
34
|
+
* props type inference from the source module's default export.
|
|
35
|
+
*/
|
|
36
|
+
declare function container<M>(loader: () => Promise<M>, options?: DefineWebWidgetOptions): VueWidgetComponent<ExtractWidgetProps<M>>;
|
|
37
|
+
declare function container<Props>(loader: Loader, options?: DefineWebWidgetOptions): VueWidgetComponent<Props>;
|
|
38
|
+
|
|
39
|
+
interface SerializableObject {
|
|
40
|
+
[key: string]: SerializableValue;
|
|
41
|
+
}
|
|
42
|
+
interface CreateVueRenderOptions {
|
|
43
|
+
onBeforeCreateApp?: (context: {
|
|
44
|
+
container?: Element | DocumentFragment;
|
|
45
|
+
data: any;
|
|
46
|
+
progressive?: boolean;
|
|
47
|
+
recovering?: boolean;
|
|
48
|
+
}, component: Component, props: any) => Promise<any>;
|
|
49
|
+
onCreatedApp?: (app: Vue, context: {
|
|
50
|
+
data: any;
|
|
51
|
+
}, component: Component, props: any) => Promise<void>;
|
|
52
|
+
/**@deprecated*/
|
|
53
|
+
onPrefetchData?: (context: {
|
|
54
|
+
data: any;
|
|
55
|
+
}, component: Component,
|
|
56
|
+
/**@deprecated*/
|
|
57
|
+
props: any) => Promise<SerializableObject>;
|
|
58
|
+
}
|
|
59
|
+
|
|
60
|
+
export { type CreateVueRenderOptions as C, type DefineWebWidgetOptions as D, type VueWidgetComponent as V, type WidgetContainerConfig as W, container as c };
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
import * as _web_widget_schema from '@web-widget/schema';
|
|
2
|
+
import { Component } from 'vue';
|
|
3
|
+
import { C as CreateVueRenderOptions } from './types-DSyp4jjz.js';
|
|
4
|
+
export { D as DefineWebWidgetOptions, V as VueWidgetComponent, W as WidgetContainerConfig, c as container } from './types-DSyp4jjz.js';
|
|
5
|
+
export { asReactWidget, toReact } from './vue2.js';
|
|
6
|
+
import '@web-widget/web-widget';
|
|
7
|
+
import '@web-widget/helpers';
|
|
8
|
+
import 'vue/types/options';
|
|
9
|
+
import '@web-widget/react/adapter';
|
|
10
|
+
|
|
11
|
+
type EnhancedComponent = Component & {
|
|
12
|
+
__name?: string;
|
|
13
|
+
};
|
|
14
|
+
declare const createVueRender: ({ onBeforeCreateApp, onCreatedApp, onPrefetchData, }?: CreateVueRenderOptions) => _web_widget_schema.ClientRender<EnhancedComponent, unknown, _web_widget_schema.ClientRenderOptions, void | _web_widget_schema.ClientRenderResult<unknown>>;
|
|
15
|
+
/**@deprecated Please use `createVueRender` instead.*/
|
|
16
|
+
declare const defineVueRender: ({ onBeforeCreateApp, onCreatedApp, onPrefetchData, }?: CreateVueRenderOptions) => _web_widget_schema.ClientRender<EnhancedComponent, unknown, _web_widget_schema.ClientRenderOptions, void | _web_widget_schema.ClientRenderResult<unknown>>;
|
|
17
|
+
declare const render: _web_widget_schema.ClientRender<EnhancedComponent, unknown, _web_widget_schema.ClientRenderOptions, void | _web_widget_schema.ClientRenderResult<unknown>>;
|
|
18
|
+
|
|
19
|
+
export { createVueRender, defineVueRender, render };
|
|
@@ -1,21 +1,21 @@
|
|
|
1
|
+
import {
|
|
2
|
+
container
|
|
3
|
+
} from "./chunk-B5NQMGE5.js";
|
|
1
4
|
import {
|
|
2
5
|
asReactWidget,
|
|
3
|
-
defineWebWidget,
|
|
4
6
|
toReact
|
|
5
|
-
} from "./chunk-
|
|
7
|
+
} from "./chunk-F3PTQ2OL.js";
|
|
6
8
|
|
|
7
|
-
// src/client.ts
|
|
9
|
+
// src/adapter.client.ts
|
|
8
10
|
import { defineClientRender } from "@web-widget/helpers";
|
|
9
11
|
import { cacheProviderIsLoading } from "@web-widget/helpers/cache";
|
|
10
12
|
import Vue from "vue";
|
|
11
|
-
export * from "@web-widget/helpers";
|
|
12
|
-
import { useWidgetSyncState } from "@web-widget/helpers/state";
|
|
13
13
|
function sanitizeComponentName(name) {
|
|
14
|
-
return name.replace("@", "
|
|
14
|
+
return name.replace("@", "-");
|
|
15
15
|
}
|
|
16
|
-
function clearContainerContent(
|
|
17
|
-
if ("innerHTML" in
|
|
18
|
-
|
|
16
|
+
function clearContainerContent(container2) {
|
|
17
|
+
if ("innerHTML" in container2) {
|
|
18
|
+
container2.innerHTML = "";
|
|
19
19
|
}
|
|
20
20
|
}
|
|
21
21
|
var createVueRender = ({
|
|
@@ -25,27 +25,27 @@ var createVueRender = ({
|
|
|
25
25
|
onPrefetchData
|
|
26
26
|
} = {}) => {
|
|
27
27
|
return defineClientRender(
|
|
28
|
-
async (component, data, { recovering, container }) => {
|
|
28
|
+
async (component, data, { recovering, container: container2 }) => {
|
|
29
29
|
data = data != null ? data : {};
|
|
30
30
|
if (!component) {
|
|
31
31
|
throw new TypeError(`Missing component.`);
|
|
32
32
|
}
|
|
33
|
-
if (!
|
|
33
|
+
if (!container2) {
|
|
34
34
|
throw new Error(`Missing container.`);
|
|
35
35
|
}
|
|
36
36
|
if (component.__name) {
|
|
37
37
|
component.__name = sanitizeComponentName(component.__name);
|
|
38
38
|
}
|
|
39
39
|
let app;
|
|
40
|
-
const context = { data, recovering, container };
|
|
40
|
+
const context = { data, recovering, container: container2 };
|
|
41
41
|
return {
|
|
42
42
|
async mount() {
|
|
43
|
-
let ssrRoot =
|
|
43
|
+
let ssrRoot = container2;
|
|
44
44
|
let mergedProps = data;
|
|
45
45
|
if (recovering) {
|
|
46
46
|
const vue2ssrAttrSelector = `[data-server-rendered="true"]`;
|
|
47
|
-
const root =
|
|
48
|
-
const state =
|
|
47
|
+
const root = container2.querySelector(vue2ssrAttrSelector) || container2.firstElementChild;
|
|
48
|
+
const state = container2.querySelector(
|
|
49
49
|
"script[as=state]"
|
|
50
50
|
);
|
|
51
51
|
const stateContent = state ? JSON.parse(state.textContent) : onPrefetchData ? await onPrefetchData(context, component, data) : void 0;
|
|
@@ -79,17 +79,17 @@ var createVueRender = ({
|
|
|
79
79
|
if (recovering) {
|
|
80
80
|
app.$mount(ssrRoot, recovering);
|
|
81
81
|
} else {
|
|
82
|
-
|
|
82
|
+
container2.appendChild(app.$mount().$el);
|
|
83
83
|
}
|
|
84
84
|
if (loading) {
|
|
85
85
|
recovering = false;
|
|
86
|
-
clearContainerContent(
|
|
86
|
+
clearContainerContent(container2);
|
|
87
87
|
throw loading;
|
|
88
88
|
}
|
|
89
89
|
},
|
|
90
90
|
async unmount() {
|
|
91
91
|
app == null ? void 0 : app.$destroy();
|
|
92
|
-
clearContainerContent(
|
|
92
|
+
clearContainerContent(container2);
|
|
93
93
|
app = null;
|
|
94
94
|
}
|
|
95
95
|
};
|
|
@@ -100,10 +100,9 @@ var defineVueRender = createVueRender;
|
|
|
100
100
|
var render = createVueRender();
|
|
101
101
|
export {
|
|
102
102
|
asReactWidget,
|
|
103
|
+
container,
|
|
103
104
|
createVueRender,
|
|
104
105
|
defineVueRender,
|
|
105
|
-
defineWebWidget,
|
|
106
106
|
render,
|
|
107
|
-
toReact
|
|
108
|
-
useWidgetSyncState as useWidgetState
|
|
107
|
+
toReact
|
|
109
108
|
};
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
import * as _web_widget_schema from '@web-widget/schema';
|
|
2
|
+
import { Component } from 'vue';
|
|
3
|
+
import { C as CreateVueRenderOptions } from './types-DSyp4jjz.js';
|
|
4
|
+
export { D as DefineWebWidgetOptions, V as VueWidgetComponent, W as WidgetContainerConfig, c as container } from './types-DSyp4jjz.js';
|
|
5
|
+
export { asReactWidget, toReact } from './vue2.js';
|
|
6
|
+
import '@web-widget/web-widget';
|
|
7
|
+
import '@web-widget/helpers';
|
|
8
|
+
import 'vue/types/options';
|
|
9
|
+
import '@web-widget/react/adapter';
|
|
10
|
+
|
|
11
|
+
type BuildedComponent = Component & {
|
|
12
|
+
__name?: string;
|
|
13
|
+
};
|
|
14
|
+
declare const createVueRender: ({ onBeforeCreateApp, onCreatedApp, onPrefetchData, }?: CreateVueRenderOptions) => _web_widget_schema.ServerRender<BuildedComponent, unknown, _web_widget_schema.ServerRenderOptions, _web_widget_schema.ServerRenderResult>;
|
|
15
|
+
/**@deprecated Please use `createVueRender` instead.*/
|
|
16
|
+
declare const defineVueRender: ({ onBeforeCreateApp, onCreatedApp, onPrefetchData, }?: CreateVueRenderOptions) => _web_widget_schema.ServerRender<BuildedComponent, unknown, _web_widget_schema.ServerRenderOptions, _web_widget_schema.ServerRenderResult>;
|
|
17
|
+
declare const render: _web_widget_schema.ServerRender<BuildedComponent, unknown, _web_widget_schema.ServerRenderOptions, _web_widget_schema.ServerRenderResult>;
|
|
18
|
+
|
|
19
|
+
export { createVueRender, defineVueRender, render };
|
|
@@ -1,16 +1,16 @@
|
|
|
1
|
+
import {
|
|
2
|
+
container
|
|
3
|
+
} from "./chunk-B5NQMGE5.js";
|
|
1
4
|
import {
|
|
2
5
|
asReactWidget,
|
|
3
|
-
defineWebWidget,
|
|
4
6
|
toReact
|
|
5
|
-
} from "./chunk-
|
|
7
|
+
} from "./chunk-F3PTQ2OL.js";
|
|
6
8
|
|
|
7
|
-
// src/server.ts
|
|
9
|
+
// src/adapter.server.ts
|
|
8
10
|
import { defineServerRender } from "@web-widget/helpers";
|
|
9
11
|
import { escapeJson } from "@web-widget/helpers/purify";
|
|
10
12
|
import Vue from "vue";
|
|
11
13
|
import { createRenderer } from "vue-server-renderer";
|
|
12
|
-
export * from "@web-widget/helpers";
|
|
13
|
-
import { useWidgetSyncState } from "@web-widget/helpers/state";
|
|
14
14
|
function sanitizeComponentName(name) {
|
|
15
15
|
return name.replace("@", "-");
|
|
16
16
|
}
|
|
@@ -60,10 +60,9 @@ var defineVueRender = createVueRender;
|
|
|
60
60
|
var render = createVueRender();
|
|
61
61
|
export {
|
|
62
62
|
asReactWidget,
|
|
63
|
+
container,
|
|
63
64
|
createVueRender,
|
|
64
65
|
defineVueRender,
|
|
65
|
-
defineWebWidget,
|
|
66
66
|
render,
|
|
67
|
-
toReact
|
|
68
|
-
useWidgetSyncState as useWidgetState
|
|
67
|
+
toReact
|
|
69
68
|
};
|
package/dist/vue2.d.ts
ADDED
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
import { Component, ComponentPublicInstance } from 'vue';
|
|
2
|
+
import { DefaultProps } from 'vue/types/options';
|
|
3
|
+
import { ReactWidgetComponent } from '@web-widget/react/adapter';
|
|
4
|
+
|
|
5
|
+
/**
|
|
6
|
+
* Adapt Vue component types to React widget component types.
|
|
7
|
+
*
|
|
8
|
+
* @deprecated Use `container()` from `@web-widget/react/adapter` instead.
|
|
9
|
+
* The build tool automatically infers props types for both static imports
|
|
10
|
+
* and explicit `container(() => import(...))` calls.
|
|
11
|
+
*
|
|
12
|
+
* This is a type-level cast only — the actual cross-framework rendering
|
|
13
|
+
* is handled by the `@widget` system.
|
|
14
|
+
*/
|
|
15
|
+
declare function asReactWidget<T extends DefaultProps>(component: Component<never, never, never, T, never>): ReactWidgetComponent<Omit<T, keyof ComponentPublicInstance | "$route" | "$router">>;
|
|
16
|
+
/** @deprecated Use `container()` from `@web-widget/react/adapter` instead. */
|
|
17
|
+
declare const toReact: typeof asReactWidget;
|
|
18
|
+
|
|
19
|
+
export { asReactWidget, toReact };
|
package/dist/vue2.js
ADDED
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@web-widget/vue2",
|
|
3
3
|
"description": "Vue2 adapter",
|
|
4
|
-
"version": "3.0.0-beta.
|
|
4
|
+
"version": "3.0.0-beta.3",
|
|
5
5
|
"homepage": "https://github.com/web-widget/web-widget#readme",
|
|
6
6
|
"repository": {
|
|
7
7
|
"type": "git",
|
|
@@ -13,51 +13,67 @@
|
|
|
13
13
|
},
|
|
14
14
|
"license": "MIT",
|
|
15
15
|
"dependencies": {
|
|
16
|
-
"@
|
|
17
|
-
"@web-widget/
|
|
18
|
-
"@web-widget/
|
|
19
|
-
"@web-widget/web-widget": "3.0.0-beta.
|
|
20
|
-
"@web-widget/react": "3.0.0-beta.0"
|
|
16
|
+
"@web-widget/helpers": "3.0.0-beta.3",
|
|
17
|
+
"@web-widget/schema": "3.0.0-beta.3",
|
|
18
|
+
"@web-widget/react": "3.0.0-beta.3",
|
|
19
|
+
"@web-widget/web-widget": "3.0.0-beta.3"
|
|
21
20
|
},
|
|
22
21
|
"devDependencies": {
|
|
23
22
|
"@types/node": "^22.2.0",
|
|
24
23
|
"tsup": "^8.3.4",
|
|
25
|
-
"typescript": "^5.
|
|
26
|
-
"vite": "^8.0.12",
|
|
24
|
+
"typescript": "^5.9.3",
|
|
27
25
|
"vue": "^2.7.16",
|
|
28
26
|
"vue-server-renderer": "^2.7.16"
|
|
29
27
|
},
|
|
30
28
|
"exports": {
|
|
31
29
|
".": {
|
|
30
|
+
"types": "./dist/vue2.d.ts",
|
|
31
|
+
"default": "./dist/vue2.js"
|
|
32
|
+
},
|
|
33
|
+
"./adapter": {
|
|
32
34
|
"worker": {
|
|
33
|
-
"types": "./dist/vue2.server.d.ts",
|
|
34
|
-
"default": "./dist/vue2.server.js"
|
|
35
|
+
"types": "./dist/vue2.adapter.server.d.ts",
|
|
36
|
+
"default": "./dist/vue2.adapter.server.js"
|
|
35
37
|
},
|
|
36
38
|
"browser": {
|
|
37
|
-
"types": "./dist/vue2.client.d.ts",
|
|
38
|
-
"default": "./dist/vue2.client.js"
|
|
39
|
+
"types": "./dist/vue2.adapter.client.d.ts",
|
|
40
|
+
"default": "./dist/vue2.adapter.client.js"
|
|
39
41
|
},
|
|
40
42
|
"default": {
|
|
41
|
-
"types": "./dist/vue2.server.d.ts",
|
|
42
|
-
"default": "./dist/vue2.server.js"
|
|
43
|
+
"types": "./dist/vue2.adapter.server.d.ts",
|
|
44
|
+
"default": "./dist/vue2.adapter.server.js"
|
|
43
45
|
}
|
|
44
|
-
},
|
|
45
|
-
"./vite": {
|
|
46
|
-
"types": "./dist/vite.d.ts",
|
|
47
|
-
"default": "./dist/vite.js"
|
|
48
46
|
}
|
|
49
47
|
},
|
|
48
|
+
"webWidgetAdapter": {
|
|
49
|
+
"version": "1.0.0",
|
|
50
|
+
"name": "vue2",
|
|
51
|
+
"extensions": [
|
|
52
|
+
".vue"
|
|
53
|
+
],
|
|
54
|
+
"adapter": "./adapter",
|
|
55
|
+
"deriveExports": [
|
|
56
|
+
{
|
|
57
|
+
"name": "handler",
|
|
58
|
+
"default": "{GET({render}){return render()}}"
|
|
59
|
+
},
|
|
60
|
+
{
|
|
61
|
+
"name": "meta",
|
|
62
|
+
"default": "{}"
|
|
63
|
+
}
|
|
64
|
+
]
|
|
65
|
+
},
|
|
50
66
|
"files": [
|
|
51
67
|
"dist"
|
|
52
68
|
],
|
|
53
69
|
"peerDependencies": {
|
|
54
|
-
"vite": "^8.0.12",
|
|
55
70
|
"vue": "^2.7.16",
|
|
56
71
|
"vue-server-renderer": "^2.7.16"
|
|
57
72
|
},
|
|
58
73
|
"publishConfig": {
|
|
59
74
|
"access": "public"
|
|
60
75
|
},
|
|
76
|
+
"sideEffects": false,
|
|
61
77
|
"type": "module",
|
|
62
78
|
"scripts": {
|
|
63
79
|
"build": "pnpm exec tsup",
|
package/dist/chunk-IXPFJTZD.js
DELETED
|
@@ -1,73 +0,0 @@
|
|
|
1
|
-
// src/components.ts
|
|
2
|
-
import { WebWidgetRenderer } from "@web-widget/web-widget";
|
|
3
|
-
import Vue, { h, defineComponent, useAttrs, getCurrentInstance } from "vue";
|
|
4
|
-
Vue.config.ignoredElements = ["web-widget"];
|
|
5
|
-
Vue.config.warnHandler = (msg, _vm, trace) => {
|
|
6
|
-
if (msg.includes(`[object Promise]`)) {
|
|
7
|
-
return;
|
|
8
|
-
}
|
|
9
|
-
console.error("[Vue warn]: ".concat(msg).concat(trace));
|
|
10
|
-
};
|
|
11
|
-
function defineWebWidget(loader, options) {
|
|
12
|
-
var _a, _b;
|
|
13
|
-
if (!loader) {
|
|
14
|
-
throw new TypeError(`Missing loader.`);
|
|
15
|
-
}
|
|
16
|
-
return defineComponent({
|
|
17
|
-
name: "WebWidgetRoot",
|
|
18
|
-
inheritAttrs: false,
|
|
19
|
-
props: {
|
|
20
|
-
fallback: {
|
|
21
|
-
type: Object
|
|
22
|
-
},
|
|
23
|
-
experimental_loading: {
|
|
24
|
-
type: String,
|
|
25
|
-
default: (_a = options.loading) != null ? _a : "lazy"
|
|
26
|
-
},
|
|
27
|
-
renderStage: {
|
|
28
|
-
type: String,
|
|
29
|
-
default: options.renderStage
|
|
30
|
-
},
|
|
31
|
-
experimental_renderTarget: {
|
|
32
|
-
type: String,
|
|
33
|
-
default: (_b = options.renderTarget) != null ? _b : "light"
|
|
34
|
-
}
|
|
35
|
-
},
|
|
36
|
-
async serverPrefetch() {
|
|
37
|
-
const widget = this.$widget;
|
|
38
|
-
this.$innerHTML = await widget.renderInnerHTMLToString();
|
|
39
|
-
},
|
|
40
|
-
setup(props, { slots }) {
|
|
41
|
-
if (Object.keys(slots).length > 0) {
|
|
42
|
-
throw new TypeError(`Slot not supported.`);
|
|
43
|
-
}
|
|
44
|
-
const data = useAttrs();
|
|
45
|
-
const widget = new WebWidgetRenderer(loader, {
|
|
46
|
-
...options,
|
|
47
|
-
data,
|
|
48
|
-
loading: props.experimental_loading,
|
|
49
|
-
renderStage: props.renderStage,
|
|
50
|
-
renderTarget: props.experimental_renderTarget
|
|
51
|
-
});
|
|
52
|
-
const instance = getCurrentInstance();
|
|
53
|
-
instance.proxy.$widget = widget;
|
|
54
|
-
return () => {
|
|
55
|
-
const innerHTML = instance.proxy.$innerHTML;
|
|
56
|
-
return h(widget.localName, {
|
|
57
|
-
attrs: widget.attributes,
|
|
58
|
-
domProps: { innerHTML }
|
|
59
|
-
});
|
|
60
|
-
};
|
|
61
|
-
}
|
|
62
|
-
});
|
|
63
|
-
}
|
|
64
|
-
function asReactWidget(component) {
|
|
65
|
-
return component;
|
|
66
|
-
}
|
|
67
|
-
var toReact = asReactWidget;
|
|
68
|
-
|
|
69
|
-
export {
|
|
70
|
-
defineWebWidget,
|
|
71
|
-
asReactWidget,
|
|
72
|
-
toReact
|
|
73
|
-
};
|
package/dist/types-CBBNnd_v.d.ts
DELETED
|
@@ -1,86 +0,0 @@
|
|
|
1
|
-
import * as vue from 'vue';
|
|
2
|
-
import vue__default, { Component, ComponentPublicInstance, PropType } from 'vue';
|
|
3
|
-
import { WebWidgetRendererOptions, Loader } from '@web-widget/web-widget';
|
|
4
|
-
import { ReactWidgetComponent } from '@web-widget/react';
|
|
5
|
-
import { DefaultProps } from 'vue/types/options';
|
|
6
|
-
import { SerializableValue } from '@web-widget/helpers';
|
|
7
|
-
|
|
8
|
-
interface DefineWebWidgetOptions {
|
|
9
|
-
base?: WebWidgetRendererOptions['base'];
|
|
10
|
-
import?: WebWidgetRendererOptions['import'];
|
|
11
|
-
loading?: WebWidgetRendererOptions['loading'];
|
|
12
|
-
name?: WebWidgetRendererOptions['name'];
|
|
13
|
-
renderStage?: WebWidgetRendererOptions['renderStage'];
|
|
14
|
-
renderTarget?: WebWidgetRendererOptions['renderTarget'];
|
|
15
|
-
}
|
|
16
|
-
declare function defineWebWidget(loader: Loader, options: DefineWebWidgetOptions): vue.DefineComponent<{
|
|
17
|
-
fallback: {
|
|
18
|
-
type: PropType<Component>;
|
|
19
|
-
};
|
|
20
|
-
experimental_loading: {
|
|
21
|
-
type: PropType<WebWidgetRendererOptions["loading"]>;
|
|
22
|
-
default: "lazy" | "eager" | "idle";
|
|
23
|
-
};
|
|
24
|
-
renderStage: {
|
|
25
|
-
type: PropType<WebWidgetRendererOptions["renderStage"]>;
|
|
26
|
-
default: "server" | "client" | undefined;
|
|
27
|
-
};
|
|
28
|
-
experimental_renderTarget: {
|
|
29
|
-
type: PropType<WebWidgetRendererOptions["renderTarget"]>;
|
|
30
|
-
default: "light" | "shadow";
|
|
31
|
-
};
|
|
32
|
-
}, () => vue.VNode, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, Readonly<vue.ExtractPropTypes<{
|
|
33
|
-
fallback: {
|
|
34
|
-
type: PropType<Component>;
|
|
35
|
-
};
|
|
36
|
-
experimental_loading: {
|
|
37
|
-
type: PropType<WebWidgetRendererOptions["loading"]>;
|
|
38
|
-
default: "lazy" | "eager" | "idle";
|
|
39
|
-
};
|
|
40
|
-
renderStage: {
|
|
41
|
-
type: PropType<WebWidgetRendererOptions["renderStage"]>;
|
|
42
|
-
default: "server" | "client" | undefined;
|
|
43
|
-
};
|
|
44
|
-
experimental_renderTarget: {
|
|
45
|
-
type: PropType<WebWidgetRendererOptions["renderTarget"]>;
|
|
46
|
-
default: "light" | "shadow";
|
|
47
|
-
};
|
|
48
|
-
}>>, {
|
|
49
|
-
renderStage: "server" | "client" | undefined;
|
|
50
|
-
experimental_loading: "lazy" | "eager" | "idle" | undefined;
|
|
51
|
-
experimental_renderTarget: "light" | "shadow" | undefined;
|
|
52
|
-
}>;
|
|
53
|
-
/**
|
|
54
|
-
* Adapt Vue component types to React widget component types.
|
|
55
|
-
*
|
|
56
|
-
* This is a type-level cast only — the actual cross-framework rendering
|
|
57
|
-
* is handled by the `@widget` system. Use this when importing a Vue
|
|
58
|
-
* widget (e.g. `Counter@widget.vue`) into a React/JSX file so that
|
|
59
|
-
* TypeScript treats it as a React component.
|
|
60
|
-
*/
|
|
61
|
-
declare function asReactWidget<T extends DefaultProps>(component: Component<never, never, never, T, never>): ReactWidgetComponent<Omit<T, keyof ComponentPublicInstance | "$route" | "$router">>;
|
|
62
|
-
/** @deprecated Use `asReactWidget` instead. */
|
|
63
|
-
declare const toReact: typeof asReactWidget;
|
|
64
|
-
|
|
65
|
-
interface SerializableObject {
|
|
66
|
-
[key: string]: SerializableValue;
|
|
67
|
-
}
|
|
68
|
-
interface CreateVueRenderOptions {
|
|
69
|
-
onBeforeCreateApp?: (context: {
|
|
70
|
-
container?: Element | DocumentFragment;
|
|
71
|
-
data: any;
|
|
72
|
-
progressive?: boolean;
|
|
73
|
-
recovering?: boolean;
|
|
74
|
-
}, component: Component, props: any) => Promise<any>;
|
|
75
|
-
onCreatedApp?: (app: vue__default, context: {
|
|
76
|
-
data: any;
|
|
77
|
-
}, component: Component, props: any) => Promise<void>;
|
|
78
|
-
/**@deprecated*/
|
|
79
|
-
onPrefetchData?: (context: {
|
|
80
|
-
data: any;
|
|
81
|
-
}, component: Component,
|
|
82
|
-
/**@deprecated*/
|
|
83
|
-
props: any) => Promise<SerializableObject>;
|
|
84
|
-
}
|
|
85
|
-
|
|
86
|
-
export { type CreateVueRenderOptions as C, type DefineWebWidgetOptions as D, asReactWidget as a, defineWebWidget as d, toReact as t };
|
package/dist/vite.d.ts
DELETED
|
@@ -1,9 +0,0 @@
|
|
|
1
|
-
import * as vite from 'vite';
|
|
2
|
-
import { WebWidgetUserConfig } from '@web-widget/vite-plugin';
|
|
3
|
-
|
|
4
|
-
interface Vue2WebWidgetPluginOptions extends Partial<WebWidgetUserConfig> {
|
|
5
|
-
workspace?: string;
|
|
6
|
-
}
|
|
7
|
-
declare function vue2WebWidgetPlugin(options?: Vue2WebWidgetPluginOptions): vite.Plugin<any>[];
|
|
8
|
-
|
|
9
|
-
export { type Vue2WebWidgetPluginOptions, vue2WebWidgetPlugin as default };
|
package/dist/vite.js
DELETED
|
@@ -1,62 +0,0 @@
|
|
|
1
|
-
// src/vite.ts
|
|
2
|
-
import { webWidgetPlugin } from "@web-widget/vite-plugin";
|
|
3
|
-
import { posix } from "path";
|
|
4
|
-
import { normalizePath } from "@rollup/pluginutils";
|
|
5
|
-
function escapeRegExp(path) {
|
|
6
|
-
return path.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
|
|
7
|
-
}
|
|
8
|
-
function appendSlash(path) {
|
|
9
|
-
return path.endsWith(posix.sep) ? path : `${path}${posix.sep}`;
|
|
10
|
-
}
|
|
11
|
-
function vue2WebWidgetPlugin(options) {
|
|
12
|
-
const {
|
|
13
|
-
manifest,
|
|
14
|
-
provide = "@web-widget/vue2",
|
|
15
|
-
workspace = "",
|
|
16
|
-
export: exportWidget = {},
|
|
17
|
-
import: importWidget = {}
|
|
18
|
-
} = options != null ? options : {};
|
|
19
|
-
const workspacePattern = workspace ? escapeRegExp(normalizePath(appendSlash(workspace))) : workspace;
|
|
20
|
-
const widgetPattern = `[.@]widget`;
|
|
21
|
-
const routePattern = `[.@]route`;
|
|
22
|
-
const modulesPattern = `[.@](?:route|widget)`;
|
|
23
|
-
const extensionPattern = `\\.vue`;
|
|
24
|
-
const vueBuildModeQueryPattern = `(?:\\?vue&type=script\\b.*)`;
|
|
25
|
-
const routeRegExp = new RegExp(
|
|
26
|
-
`^${workspacePattern}.*${routePattern}${extensionPattern}$`
|
|
27
|
-
);
|
|
28
|
-
return webWidgetPlugin({
|
|
29
|
-
manifest,
|
|
30
|
-
provide,
|
|
31
|
-
export: {
|
|
32
|
-
include: new RegExp(
|
|
33
|
-
`^${workspacePattern}[^?]*${modulesPattern}${extensionPattern}$`
|
|
34
|
-
),
|
|
35
|
-
extractFromExportDefault: [
|
|
36
|
-
{
|
|
37
|
-
name: "handler",
|
|
38
|
-
default: "{GET({render}){return render()}}",
|
|
39
|
-
include: routeRegExp
|
|
40
|
-
},
|
|
41
|
-
{
|
|
42
|
-
name: "meta",
|
|
43
|
-
default: "{}",
|
|
44
|
-
include: routeRegExp
|
|
45
|
-
}
|
|
46
|
-
],
|
|
47
|
-
...exportWidget
|
|
48
|
-
},
|
|
49
|
-
import: {
|
|
50
|
-
include: new RegExp(`^[^?]*${widgetPattern}\\.[^?]*$`),
|
|
51
|
-
includeImporter: new RegExp(
|
|
52
|
-
// vite dev mode: .vue
|
|
53
|
-
// vite build mode: .vue?vue&type=script&setup=true&lang.ts
|
|
54
|
-
`^${workspacePattern}[^?]*${extensionPattern}${vueBuildModeQueryPattern}?$`
|
|
55
|
-
),
|
|
56
|
-
...importWidget
|
|
57
|
-
}
|
|
58
|
-
});
|
|
59
|
-
}
|
|
60
|
-
export {
|
|
61
|
-
vue2WebWidgetPlugin as default
|
|
62
|
-
};
|
package/dist/vue2.client.d.ts
DELETED
|
@@ -1,19 +0,0 @@
|
|
|
1
|
-
import * as _web_widget_helpers from '@web-widget/helpers';
|
|
2
|
-
export * from '@web-widget/helpers';
|
|
3
|
-
import { Component } from 'vue';
|
|
4
|
-
import { C as CreateVueRenderOptions } from './types-CBBNnd_v.js';
|
|
5
|
-
export { D as DefineWebWidgetOptions, a as asReactWidget, d as defineWebWidget, t as toReact } from './types-CBBNnd_v.js';
|
|
6
|
-
export { useWidgetSyncState as useWidgetState } from '@web-widget/helpers/state';
|
|
7
|
-
import '@web-widget/web-widget';
|
|
8
|
-
import '@web-widget/react';
|
|
9
|
-
import 'vue/types/options';
|
|
10
|
-
|
|
11
|
-
type EnhancedComponent = Component & {
|
|
12
|
-
__name?: string;
|
|
13
|
-
};
|
|
14
|
-
declare const createVueRender: ({ onBeforeCreateApp, onCreatedApp, onPrefetchData, }?: CreateVueRenderOptions) => _web_widget_helpers.ClientRender<EnhancedComponent, unknown, _web_widget_helpers.ClientRenderOptions, void | _web_widget_helpers.ClientRenderResult<unknown>>;
|
|
15
|
-
/**@deprecated Please use `createVueRender` instead.*/
|
|
16
|
-
declare const defineVueRender: ({ onBeforeCreateApp, onCreatedApp, onPrefetchData, }?: CreateVueRenderOptions) => _web_widget_helpers.ClientRender<EnhancedComponent, unknown, _web_widget_helpers.ClientRenderOptions, void | _web_widget_helpers.ClientRenderResult<unknown>>;
|
|
17
|
-
declare const render: _web_widget_helpers.ClientRender<EnhancedComponent, unknown, _web_widget_helpers.ClientRenderOptions, void | _web_widget_helpers.ClientRenderResult<unknown>>;
|
|
18
|
-
|
|
19
|
-
export { createVueRender, defineVueRender, render };
|
package/dist/vue2.server.d.ts
DELETED
|
@@ -1,19 +0,0 @@
|
|
|
1
|
-
import * as _web_widget_helpers from '@web-widget/helpers';
|
|
2
|
-
export * from '@web-widget/helpers';
|
|
3
|
-
import { Component } from 'vue';
|
|
4
|
-
import { C as CreateVueRenderOptions } from './types-CBBNnd_v.js';
|
|
5
|
-
export { D as DefineWebWidgetOptions, a as asReactWidget, d as defineWebWidget, t as toReact } from './types-CBBNnd_v.js';
|
|
6
|
-
export { useWidgetSyncState as useWidgetState } from '@web-widget/helpers/state';
|
|
7
|
-
import '@web-widget/web-widget';
|
|
8
|
-
import '@web-widget/react';
|
|
9
|
-
import 'vue/types/options';
|
|
10
|
-
|
|
11
|
-
type BuildedComponent = Component & {
|
|
12
|
-
__name?: string;
|
|
13
|
-
};
|
|
14
|
-
declare const createVueRender: ({ onBeforeCreateApp, onCreatedApp, onPrefetchData, }?: CreateVueRenderOptions) => _web_widget_helpers.ServerRender<BuildedComponent, unknown, _web_widget_helpers.ServerRenderOptions, _web_widget_helpers.ServerRenderResult>;
|
|
15
|
-
/**@deprecated Please use `createVueRender` instead.*/
|
|
16
|
-
declare const defineVueRender: ({ onBeforeCreateApp, onCreatedApp, onPrefetchData, }?: CreateVueRenderOptions) => _web_widget_helpers.ServerRender<BuildedComponent, unknown, _web_widget_helpers.ServerRenderOptions, _web_widget_helpers.ServerRenderResult>;
|
|
17
|
-
declare const render: _web_widget_helpers.ServerRender<BuildedComponent, unknown, _web_widget_helpers.ServerRenderOptions, _web_widget_helpers.ServerRenderResult>;
|
|
18
|
-
|
|
19
|
-
export { createVueRender, defineVueRender, render };
|