@blocklet/pages-kit 0.2.215 → 0.2.216
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/lib/cjs/api/call.js +7 -2
- package/lib/cjs/api/pages-kit.js +2 -1
- package/lib/cjs/components/CustomComponentRenderer/index.js +27 -26
- package/lib/cjs/utils/preload.js +19 -15
- package/lib/cjs/utils/property.js +5 -4
- package/lib/esm/api/call.js +7 -2
- package/lib/esm/api/pages-kit.js +2 -1
- package/lib/esm/components/CustomComponentRenderer/index.js +29 -28
- package/lib/esm/utils/preload.js +19 -15
- package/lib/esm/utils/property.js +5 -4
- package/lib/types/api/call.d.ts +1 -1
- package/lib/types/api/pages-kit.d.ts +1 -1
- package/lib/types/components/CustomComponentRenderer/index.d.ts +1 -0
- package/lib/types/types/api.d.ts +14 -14
- package/lib/types/types/core.d.ts +13 -0
- package/lib/types/types/preload.d.ts +8 -11
- package/lib/types/utils/preload.d.ts +2 -2
- package/package.json +2 -2
package/lib/cjs/api/call.js
CHANGED
|
@@ -11,13 +11,18 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
|
|
|
11
11
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
12
12
|
exports.preloadComponents = void 0;
|
|
13
13
|
const component_1 = require("@blocklet/sdk/lib/component");
|
|
14
|
-
function preloadComponents({ mode, name, id }) {
|
|
14
|
+
function preloadComponents({ mode, name, id, locale, }) {
|
|
15
15
|
return __awaiter(this, void 0, void 0, function* () {
|
|
16
16
|
return (0, component_1.call)({
|
|
17
17
|
name: 'pages-kit',
|
|
18
18
|
method: 'GET',
|
|
19
19
|
path: '/api/components/preload',
|
|
20
|
-
params: {
|
|
20
|
+
params: {
|
|
21
|
+
mode,
|
|
22
|
+
id: Array.isArray(id) ? id.join(',') : id,
|
|
23
|
+
name: Array.isArray(name) ? name.join(',') : name,
|
|
24
|
+
locale,
|
|
25
|
+
},
|
|
21
26
|
}).then((res) => res.data);
|
|
22
27
|
});
|
|
23
28
|
}
|
package/lib/cjs/api/pages-kit.js
CHANGED
|
@@ -16,7 +16,7 @@ exports.preloadComponents = void 0;
|
|
|
16
16
|
const axios_1 = __importDefault(require("axios"));
|
|
17
17
|
const ufo_1 = require("ufo");
|
|
18
18
|
const PAGES_KIT_DID = 'z8iZiDFg3vkkrPwsiba1TLXy3H9XHzFERsP8o';
|
|
19
|
-
function preloadComponents({ mode, name, id }) {
|
|
19
|
+
function preloadComponents({ mode, name, id, locale, }) {
|
|
20
20
|
var _a, _b;
|
|
21
21
|
return __awaiter(this, void 0, void 0, function* () {
|
|
22
22
|
const prefix = ((_b = (_a = window.blocklet) === null || _a === void 0 ? void 0 : _a.componentMountPoints.find((i) => i.did === PAGES_KIT_DID)) === null || _b === void 0 ? void 0 : _b.mountPoint) || '/';
|
|
@@ -26,6 +26,7 @@ function preloadComponents({ mode, name, id }) {
|
|
|
26
26
|
mode,
|
|
27
27
|
id: Array.isArray(id) ? id.join(',') : id,
|
|
28
28
|
name: Array.isArray(name) ? name.join(',') : name,
|
|
29
|
+
locale,
|
|
29
30
|
},
|
|
30
31
|
})
|
|
31
32
|
.then((res) => res.data);
|
|
@@ -55,8 +55,9 @@ const property_1 = require("../../utils/property");
|
|
|
55
55
|
const builtin_module_transformer_1 = require("../../utils/typescript/builtin-module-transformer");
|
|
56
56
|
const MAXIMUM_RENDER_STACK_SIZE = 50;
|
|
57
57
|
function CustomComponentRenderer(_a) {
|
|
58
|
+
var _b;
|
|
58
59
|
var props = __rest(_a, []);
|
|
59
|
-
return ((0, jsx_runtime_1.jsx)(react_error_boundary_1.ErrorBoundary, { fallbackRender: E, resetKeys: [Date.now()], children: (0, jsx_runtime_1.jsx)(ComponentRenderer, Object.assign({}, props)) }));
|
|
60
|
+
return ((0, jsx_runtime_1.jsx)(react_error_boundary_1.ErrorBoundary, { fallbackRender: E, resetKeys: [Date.now()], children: (0, jsx_runtime_1.jsx)(ComponentRenderer, Object.assign({}, props, { instanceId: (_b = props.instanceId) !== null && _b !== void 0 ? _b : props.componentId })) }));
|
|
60
61
|
}
|
|
61
62
|
exports.default = CustomComponentRenderer;
|
|
62
63
|
function ComponentRenderer(_a) {
|
|
@@ -71,10 +72,12 @@ function Renderer(props) {
|
|
|
71
72
|
if (!component)
|
|
72
73
|
return null;
|
|
73
74
|
const { Component, AsyncComponent, properties } = component;
|
|
74
|
-
const componentProps = Object.fromEntries(Object.entries(Object.assign(Object.assign({}, properties), props.props)).map(([key, val]) =>
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
75
|
+
const componentProps = Object.fromEntries(Object.entries(Object.assign(Object.assign({}, properties), props.props)).map(([key, val]) => {
|
|
76
|
+
return [
|
|
77
|
+
key,
|
|
78
|
+
(val === null || val === void 0 ? void 0 : val.type) === property_1.RenderNestedComponent ? ((0, jsx_runtime_1.jsx)(ComponentRenderer, Object.assign({}, (0, lodash_1.pick)(props, 'components', 'locale', 'defaultLocale'), { instanceId: key, renderCount: props.renderCount, componentId: val.componentId, properties: val.properties, props: val.props }))) : (val),
|
|
79
|
+
];
|
|
80
|
+
}));
|
|
78
81
|
if (Component) {
|
|
79
82
|
return (0, jsx_runtime_1.jsx)(Component, Object.assign({}, componentProps));
|
|
80
83
|
}
|
|
@@ -101,29 +104,27 @@ function E({ error }) {
|
|
|
101
104
|
return ((0, jsx_runtime_1.jsx)(material_1.Box, { children: (0, jsx_runtime_1.jsx)(material_1.Alert, { severity: "error", children: error.message }) }));
|
|
102
105
|
}
|
|
103
106
|
const PRELOAD_COMPONENTS_STATE = window[preload_1.PreloadComponentsStateGlobalVariableName];
|
|
104
|
-
function useComponent({ componentId, components, locale, defaultLocale, properties: parameters, }) {
|
|
105
|
-
var _a, _b, _c, _d, _e;
|
|
106
|
-
const preloadRef = (0, react_1.useRef)();
|
|
107
|
+
function useComponent({ instanceId, componentId, components, locale, defaultLocale, properties: parameters, props, }) {
|
|
107
108
|
const scriptRef = (0, react_1.useRef)({});
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
if (!property)
|
|
116
|
-
return [];
|
|
117
|
-
return [property.key, (0, property_1.parsePropertyValue)(property, value, { locale, defaultLocale })];
|
|
118
|
-
}));
|
|
119
|
-
const mod = window[preload.preloadComponentModuleName];
|
|
120
|
-
if (typeof mod === 'function') {
|
|
121
|
-
preloadRef.current = {
|
|
122
|
-
Component: mod(),
|
|
123
|
-
properties: Object.assign(Object.assign({}, (0, property_1.assignNullableFields)(properties, (_c = (_b = (_a = preload.locales) === null || _a === void 0 ? void 0 : _a[locale]) === null || _b === void 0 ? void 0 : _b.properties) !== null && _c !== void 0 ? _c : (_e = (_d = preload.locales) === null || _d === void 0 ? void 0 : _d[PRELOAD_COMPONENTS_STATE.config.defaultLocale]) === null || _e === void 0 ? void 0 : _e.properties)), preload.serverSideProps),
|
|
124
|
-
};
|
|
125
|
-
return preloadRef.current;
|
|
109
|
+
const preloadComponent = (0, react_1.useMemo)(() => {
|
|
110
|
+
const preload = PRELOAD_COMPONENTS_STATE === null || PRELOAD_COMPONENTS_STATE === void 0 ? void 0 : PRELOAD_COMPONENTS_STATE.components[componentId];
|
|
111
|
+
if (preload) {
|
|
112
|
+
const mod = window[preload.preloadComponentModuleName];
|
|
113
|
+
if (typeof mod === 'function') {
|
|
114
|
+
return { component: preload.component, Component: mod() };
|
|
115
|
+
}
|
|
126
116
|
}
|
|
117
|
+
return null;
|
|
118
|
+
}, [componentId]);
|
|
119
|
+
const preloadState = (0, react_1.useMemo)(() => {
|
|
120
|
+
var _a;
|
|
121
|
+
return (_a = PRELOAD_COMPONENTS_STATE === null || PRELOAD_COMPONENTS_STATE === void 0 ? void 0 : PRELOAD_COMPONENTS_STATE.props[instanceId]) === null || _a === void 0 ? void 0 : _a[locale];
|
|
122
|
+
}, [instanceId, locale]);
|
|
123
|
+
if ((props || preloadState) && preloadComponent) {
|
|
124
|
+
return {
|
|
125
|
+
Component: preloadComponent.Component,
|
|
126
|
+
properties: preloadState,
|
|
127
|
+
};
|
|
127
128
|
}
|
|
128
129
|
const component = (0, property_1.mergeComponent)({
|
|
129
130
|
componentId,
|
package/lib/cjs/utils/preload.js
CHANGED
|
@@ -2,27 +2,31 @@
|
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
3
|
exports.injectPreloadComponents = void 0;
|
|
4
4
|
const types_1 = require("../types");
|
|
5
|
-
function injectPreloadComponents(
|
|
5
|
+
function injectPreloadComponents(...input) {
|
|
6
|
+
const list = input.flat();
|
|
7
|
+
const first = list[0];
|
|
8
|
+
if (!first)
|
|
9
|
+
return null;
|
|
10
|
+
const data = list.reduce((res, i) => {
|
|
11
|
+
Object.assign(res.config, i.config);
|
|
12
|
+
Object.assign(res.components, i.components);
|
|
13
|
+
Object.assign(res.props, i.props);
|
|
14
|
+
return res;
|
|
15
|
+
}, Object.assign({}, first));
|
|
6
16
|
const injectState = {
|
|
7
|
-
config,
|
|
8
|
-
components: Object.fromEntries(components.map(({ script, component
|
|
9
|
-
|
|
10
|
-
{
|
|
11
|
-
preloadComponentModuleName: script.umd.moduleName,
|
|
12
|
-
component,
|
|
13
|
-
locales,
|
|
14
|
-
serverSideProps,
|
|
15
|
-
},
|
|
17
|
+
config: data.config,
|
|
18
|
+
components: Object.fromEntries(Object.entries(data.components).map(([componentId, { script, component }]) => [
|
|
19
|
+
componentId,
|
|
20
|
+
{ preloadComponentModuleName: script.umd.moduleName, component },
|
|
16
21
|
])),
|
|
22
|
+
props: data.props,
|
|
17
23
|
};
|
|
18
|
-
if (!components.length)
|
|
19
|
-
return undefined;
|
|
20
24
|
return {
|
|
21
25
|
html: `\
|
|
22
|
-
${components
|
|
23
|
-
.map((
|
|
26
|
+
${Object.values(data.components)
|
|
27
|
+
.map(({ script }) => `\
|
|
24
28
|
<script>
|
|
25
|
-
${
|
|
29
|
+
${script.umd.script}
|
|
26
30
|
</script>
|
|
27
31
|
`)
|
|
28
32
|
.join('\n')}
|
|
@@ -59,7 +59,7 @@ function mergeComponent({ componentId, getComponent, locale, defaultLocale, prop
|
|
|
59
59
|
exports.mergeComponent = mergeComponent;
|
|
60
60
|
exports.RenderNestedComponent = '__RENDER_NESTED_COMPONENT__';
|
|
61
61
|
function parsePropertyValue(property, value, { locale, defaultLocale }) {
|
|
62
|
-
var _a, _b, _c;
|
|
62
|
+
var _a, _b, _c, _d, _e;
|
|
63
63
|
if (property.type === 'json') {
|
|
64
64
|
if (!value)
|
|
65
65
|
return undefined;
|
|
@@ -72,13 +72,14 @@ function parsePropertyValue(property, value, { locale, defaultLocale }) {
|
|
|
72
72
|
}
|
|
73
73
|
}
|
|
74
74
|
if (property.type === 'component') {
|
|
75
|
-
const
|
|
76
|
-
if (
|
|
75
|
+
const componentId = (value === null || value === void 0 ? void 0 : value.componentId) || property.componentId;
|
|
76
|
+
if (typeof componentId !== 'string')
|
|
77
77
|
return undefined;
|
|
78
|
+
const { locales } = property;
|
|
78
79
|
return {
|
|
79
80
|
type: exports.RenderNestedComponent,
|
|
80
81
|
componentId,
|
|
81
|
-
properties: (_b = (_a = locales === null || locales === void 0 ? void 0 : locales[locale]) === null || _a === void 0 ? void 0 : _a.defaultValue) !== null &&
|
|
82
|
+
properties: Object.assign(Object.assign({}, ((_c = (_b = (_a = locales === null || locales === void 0 ? void 0 : locales[locale]) === null || _a === void 0 ? void 0 : _a.defaultValue) === null || _b === void 0 ? void 0 : _b.properties) !== null && _c !== void 0 ? _c : (_e = (_d = locales === null || locales === void 0 ? void 0 : locales[defaultLocale]) === null || _d === void 0 ? void 0 : _d.defaultValue) === null || _e === void 0 ? void 0 : _e.properties)), value === null || value === void 0 ? void 0 : value.properties),
|
|
82
83
|
};
|
|
83
84
|
}
|
|
84
85
|
return value;
|
package/lib/esm/api/call.js
CHANGED
|
@@ -8,13 +8,18 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
|
|
|
8
8
|
});
|
|
9
9
|
};
|
|
10
10
|
import { call } from '@blocklet/sdk/lib/component';
|
|
11
|
-
export function preloadComponents({ mode, name, id }) {
|
|
11
|
+
export function preloadComponents({ mode, name, id, locale, }) {
|
|
12
12
|
return __awaiter(this, void 0, void 0, function* () {
|
|
13
13
|
return call({
|
|
14
14
|
name: 'pages-kit',
|
|
15
15
|
method: 'GET',
|
|
16
16
|
path: '/api/components/preload',
|
|
17
|
-
params: {
|
|
17
|
+
params: {
|
|
18
|
+
mode,
|
|
19
|
+
id: Array.isArray(id) ? id.join(',') : id,
|
|
20
|
+
name: Array.isArray(name) ? name.join(',') : name,
|
|
21
|
+
locale,
|
|
22
|
+
},
|
|
18
23
|
}).then((res) => res.data);
|
|
19
24
|
});
|
|
20
25
|
}
|
package/lib/esm/api/pages-kit.js
CHANGED
|
@@ -10,7 +10,7 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
|
|
|
10
10
|
import axios from 'axios';
|
|
11
11
|
import { joinURL } from 'ufo';
|
|
12
12
|
const PAGES_KIT_DID = 'z8iZiDFg3vkkrPwsiba1TLXy3H9XHzFERsP8o';
|
|
13
|
-
export function preloadComponents({ mode, name, id }) {
|
|
13
|
+
export function preloadComponents({ mode, name, id, locale, }) {
|
|
14
14
|
var _a, _b;
|
|
15
15
|
return __awaiter(this, void 0, void 0, function* () {
|
|
16
16
|
const prefix = ((_b = (_a = window.blocklet) === null || _a === void 0 ? void 0 : _a.componentMountPoints.find((i) => i.did === PAGES_KIT_DID)) === null || _b === void 0 ? void 0 : _b.mountPoint) || '/';
|
|
@@ -20,6 +20,7 @@ export function preloadComponents({ mode, name, id }) {
|
|
|
20
20
|
mode,
|
|
21
21
|
id: Array.isArray(id) ? id.join(',') : id,
|
|
22
22
|
name: Array.isArray(name) ? name.join(',') : name,
|
|
23
|
+
locale,
|
|
23
24
|
},
|
|
24
25
|
})
|
|
25
26
|
.then((res) => res.data);
|
|
@@ -22,15 +22,16 @@ import { jsx as _jsx } from "react/jsx-runtime";
|
|
|
22
22
|
import '../../utils/inject-global-components';
|
|
23
23
|
import { Alert, Box } from '@mui/material';
|
|
24
24
|
import { pick } from 'lodash';
|
|
25
|
-
import { useEffect, useRef, useState } from 'react';
|
|
25
|
+
import { useEffect, useMemo, useRef, useState } from 'react';
|
|
26
26
|
import { ErrorBoundary } from 'react-error-boundary';
|
|
27
27
|
import { PreloadComponentsStateGlobalVariableName } from '../../types/preload';
|
|
28
|
-
import { RenderNestedComponent,
|
|
28
|
+
import { RenderNestedComponent, mergeComponent } from '../../utils/property';
|
|
29
29
|
import { createBuiltinModuleTransformer } from '../../utils/typescript/builtin-module-transformer';
|
|
30
30
|
const MAXIMUM_RENDER_STACK_SIZE = 50;
|
|
31
31
|
export default function CustomComponentRenderer(_a) {
|
|
32
|
+
var _b;
|
|
32
33
|
var props = __rest(_a, []);
|
|
33
|
-
return (_jsx(ErrorBoundary, { fallbackRender: E, resetKeys: [Date.now()], children: _jsx(ComponentRenderer, Object.assign({}, props)) }));
|
|
34
|
+
return (_jsx(ErrorBoundary, { fallbackRender: E, resetKeys: [Date.now()], children: _jsx(ComponentRenderer, Object.assign({}, props, { instanceId: (_b = props.instanceId) !== null && _b !== void 0 ? _b : props.componentId })) }));
|
|
34
35
|
}
|
|
35
36
|
function ComponentRenderer(_a) {
|
|
36
37
|
var { renderCount = 0 } = _a, props = __rest(_a, ["renderCount"]);
|
|
@@ -44,10 +45,12 @@ function Renderer(props) {
|
|
|
44
45
|
if (!component)
|
|
45
46
|
return null;
|
|
46
47
|
const { Component, AsyncComponent, properties } = component;
|
|
47
|
-
const componentProps = Object.fromEntries(Object.entries(Object.assign(Object.assign({}, properties), props.props)).map(([key, val]) =>
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
48
|
+
const componentProps = Object.fromEntries(Object.entries(Object.assign(Object.assign({}, properties), props.props)).map(([key, val]) => {
|
|
49
|
+
return [
|
|
50
|
+
key,
|
|
51
|
+
(val === null || val === void 0 ? void 0 : val.type) === RenderNestedComponent ? (_jsx(ComponentRenderer, Object.assign({}, pick(props, 'components', 'locale', 'defaultLocale'), { instanceId: key, renderCount: props.renderCount, componentId: val.componentId, properties: val.properties, props: val.props }))) : (val),
|
|
52
|
+
];
|
|
53
|
+
}));
|
|
51
54
|
if (Component) {
|
|
52
55
|
return _jsx(Component, Object.assign({}, componentProps));
|
|
53
56
|
}
|
|
@@ -74,29 +77,27 @@ function E({ error }) {
|
|
|
74
77
|
return (_jsx(Box, { children: _jsx(Alert, { severity: "error", children: error.message }) }));
|
|
75
78
|
}
|
|
76
79
|
const PRELOAD_COMPONENTS_STATE = window[PreloadComponentsStateGlobalVariableName];
|
|
77
|
-
function useComponent({ componentId, components, locale, defaultLocale, properties: parameters, }) {
|
|
78
|
-
var _a, _b, _c, _d, _e;
|
|
79
|
-
const preloadRef = useRef();
|
|
80
|
+
function useComponent({ instanceId, componentId, components, locale, defaultLocale, properties: parameters, props, }) {
|
|
80
81
|
const scriptRef = useRef({});
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
if (!property)
|
|
89
|
-
return [];
|
|
90
|
-
return [property.key, parsePropertyValue(property, value, { locale, defaultLocale })];
|
|
91
|
-
}));
|
|
92
|
-
const mod = window[preload.preloadComponentModuleName];
|
|
93
|
-
if (typeof mod === 'function') {
|
|
94
|
-
preloadRef.current = {
|
|
95
|
-
Component: mod(),
|
|
96
|
-
properties: Object.assign(Object.assign({}, assignNullableFields(properties, (_c = (_b = (_a = preload.locales) === null || _a === void 0 ? void 0 : _a[locale]) === null || _b === void 0 ? void 0 : _b.properties) !== null && _c !== void 0 ? _c : (_e = (_d = preload.locales) === null || _d === void 0 ? void 0 : _d[PRELOAD_COMPONENTS_STATE.config.defaultLocale]) === null || _e === void 0 ? void 0 : _e.properties)), preload.serverSideProps),
|
|
97
|
-
};
|
|
98
|
-
return preloadRef.current;
|
|
82
|
+
const preloadComponent = useMemo(() => {
|
|
83
|
+
const preload = PRELOAD_COMPONENTS_STATE === null || PRELOAD_COMPONENTS_STATE === void 0 ? void 0 : PRELOAD_COMPONENTS_STATE.components[componentId];
|
|
84
|
+
if (preload) {
|
|
85
|
+
const mod = window[preload.preloadComponentModuleName];
|
|
86
|
+
if (typeof mod === 'function') {
|
|
87
|
+
return { component: preload.component, Component: mod() };
|
|
88
|
+
}
|
|
99
89
|
}
|
|
90
|
+
return null;
|
|
91
|
+
}, [componentId]);
|
|
92
|
+
const preloadState = useMemo(() => {
|
|
93
|
+
var _a;
|
|
94
|
+
return (_a = PRELOAD_COMPONENTS_STATE === null || PRELOAD_COMPONENTS_STATE === void 0 ? void 0 : PRELOAD_COMPONENTS_STATE.props[instanceId]) === null || _a === void 0 ? void 0 : _a[locale];
|
|
95
|
+
}, [instanceId, locale]);
|
|
96
|
+
if ((props || preloadState) && preloadComponent) {
|
|
97
|
+
return {
|
|
98
|
+
Component: preloadComponent.Component,
|
|
99
|
+
properties: preloadState,
|
|
100
|
+
};
|
|
100
101
|
}
|
|
101
102
|
const component = mergeComponent({
|
|
102
103
|
componentId,
|
package/lib/esm/utils/preload.js
CHANGED
|
@@ -1,25 +1,29 @@
|
|
|
1
1
|
import { PreloadComponentsStateGlobalVariableName } from '../types';
|
|
2
|
-
export function injectPreloadComponents(
|
|
2
|
+
export function injectPreloadComponents(...input) {
|
|
3
|
+
const list = input.flat();
|
|
4
|
+
const first = list[0];
|
|
5
|
+
if (!first)
|
|
6
|
+
return null;
|
|
7
|
+
const data = list.reduce((res, i) => {
|
|
8
|
+
Object.assign(res.config, i.config);
|
|
9
|
+
Object.assign(res.components, i.components);
|
|
10
|
+
Object.assign(res.props, i.props);
|
|
11
|
+
return res;
|
|
12
|
+
}, Object.assign({}, first));
|
|
3
13
|
const injectState = {
|
|
4
|
-
config,
|
|
5
|
-
components: Object.fromEntries(components.map(({ script, component
|
|
6
|
-
|
|
7
|
-
{
|
|
8
|
-
preloadComponentModuleName: script.umd.moduleName,
|
|
9
|
-
component,
|
|
10
|
-
locales,
|
|
11
|
-
serverSideProps,
|
|
12
|
-
},
|
|
14
|
+
config: data.config,
|
|
15
|
+
components: Object.fromEntries(Object.entries(data.components).map(([componentId, { script, component }]) => [
|
|
16
|
+
componentId,
|
|
17
|
+
{ preloadComponentModuleName: script.umd.moduleName, component },
|
|
13
18
|
])),
|
|
19
|
+
props: data.props,
|
|
14
20
|
};
|
|
15
|
-
if (!components.length)
|
|
16
|
-
return undefined;
|
|
17
21
|
return {
|
|
18
22
|
html: `\
|
|
19
|
-
${components
|
|
20
|
-
.map((
|
|
23
|
+
${Object.values(data.components)
|
|
24
|
+
.map(({ script }) => `\
|
|
21
25
|
<script>
|
|
22
|
-
${
|
|
26
|
+
${script.umd.script}
|
|
23
27
|
</script>
|
|
24
28
|
`)
|
|
25
29
|
.join('\n')}
|
|
@@ -54,7 +54,7 @@ export function mergeComponent({ componentId, getComponent, locale, defaultLocal
|
|
|
54
54
|
}
|
|
55
55
|
export const RenderNestedComponent = '__RENDER_NESTED_COMPONENT__';
|
|
56
56
|
export function parsePropertyValue(property, value, { locale, defaultLocale }) {
|
|
57
|
-
var _a, _b, _c;
|
|
57
|
+
var _a, _b, _c, _d, _e;
|
|
58
58
|
if (property.type === 'json') {
|
|
59
59
|
if (!value)
|
|
60
60
|
return undefined;
|
|
@@ -67,13 +67,14 @@ export function parsePropertyValue(property, value, { locale, defaultLocale }) {
|
|
|
67
67
|
}
|
|
68
68
|
}
|
|
69
69
|
if (property.type === 'component') {
|
|
70
|
-
const
|
|
71
|
-
if (
|
|
70
|
+
const componentId = (value === null || value === void 0 ? void 0 : value.componentId) || property.componentId;
|
|
71
|
+
if (typeof componentId !== 'string')
|
|
72
72
|
return undefined;
|
|
73
|
+
const { locales } = property;
|
|
73
74
|
return {
|
|
74
75
|
type: RenderNestedComponent,
|
|
75
76
|
componentId,
|
|
76
|
-
properties: (_b = (_a = locales === null || locales === void 0 ? void 0 : locales[locale]) === null || _a === void 0 ? void 0 : _a.defaultValue) !== null &&
|
|
77
|
+
properties: Object.assign(Object.assign({}, ((_c = (_b = (_a = locales === null || locales === void 0 ? void 0 : locales[locale]) === null || _a === void 0 ? void 0 : _a.defaultValue) === null || _b === void 0 ? void 0 : _b.properties) !== null && _c !== void 0 ? _c : (_e = (_d = locales === null || locales === void 0 ? void 0 : locales[defaultLocale]) === null || _d === void 0 ? void 0 : _d.defaultValue) === null || _e === void 0 ? void 0 : _e.properties)), value === null || value === void 0 ? void 0 : value.properties),
|
|
77
78
|
};
|
|
78
79
|
}
|
|
79
80
|
return value;
|
package/lib/types/api/call.d.ts
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
import { PreloadComponentQuery, PreloadComponentsResult } from '../types';
|
|
2
|
-
export declare function preloadComponents({ mode, name, id }: PreloadComponentQuery): Promise<PreloadComponentsResult>;
|
|
2
|
+
export declare function preloadComponents({ mode, name, id, locale, }: PreloadComponentQuery): Promise<PreloadComponentsResult>;
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
import { PreloadComponentQuery, PreloadComponentsResult } from '../types';
|
|
2
|
-
export declare function preloadComponents({ mode, name, id }: PreloadComponentQuery): Promise<PreloadComponentsResult>;
|
|
2
|
+
export declare function preloadComponents({ mode, name, id, locale, }: PreloadComponentQuery): Promise<PreloadComponentsResult>;
|
package/lib/types/types/api.d.ts
CHANGED
|
@@ -1,31 +1,31 @@
|
|
|
1
1
|
import { CustomComponent } from './core';
|
|
2
2
|
import { StateMode } from './state';
|
|
3
3
|
export interface PreloadComponentQuery {
|
|
4
|
+
locale?: string;
|
|
4
5
|
mode?: StateMode;
|
|
5
6
|
name?: string[] | string;
|
|
6
7
|
id?: string[] | string;
|
|
7
8
|
}
|
|
8
9
|
export interface PreloadComponentsResult {
|
|
9
10
|
config: {
|
|
10
|
-
defaultLocale
|
|
11
|
+
defaultLocale: string;
|
|
11
12
|
};
|
|
12
13
|
components: {
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
14
|
+
[componentId: string]: {
|
|
15
|
+
component: CustomComponent;
|
|
16
|
+
script: {
|
|
17
|
+
umd: {
|
|
18
|
+
script: string;
|
|
19
|
+
moduleName: string;
|
|
20
|
+
};
|
|
18
21
|
};
|
|
19
22
|
};
|
|
20
|
-
|
|
23
|
+
};
|
|
24
|
+
props: {
|
|
25
|
+
[instanceId: string]: {
|
|
21
26
|
[locale: string]: {
|
|
22
|
-
|
|
23
|
-
[key: string]: any;
|
|
24
|
-
};
|
|
27
|
+
[key: string]: any;
|
|
25
28
|
};
|
|
26
29
|
};
|
|
27
|
-
|
|
28
|
-
[key: string]: any;
|
|
29
|
-
};
|
|
30
|
-
}[];
|
|
30
|
+
};
|
|
31
31
|
}
|
|
@@ -53,4 +53,17 @@ export interface CustomComponentStringProperty extends CustomComponentPropertyBa
|
|
|
53
53
|
export interface CustomComponentComponentProperty extends CustomComponentPropertyBase {
|
|
54
54
|
type: 'component';
|
|
55
55
|
componentId?: string;
|
|
56
|
+
locales?: {
|
|
57
|
+
[locale: string]: {
|
|
58
|
+
name?: undefined;
|
|
59
|
+
defaultValue?: {
|
|
60
|
+
componentId?: string;
|
|
61
|
+
properties: {
|
|
62
|
+
[id: string]: {
|
|
63
|
+
value: any;
|
|
64
|
+
};
|
|
65
|
+
};
|
|
66
|
+
};
|
|
67
|
+
};
|
|
68
|
+
};
|
|
56
69
|
}
|
|
@@ -3,22 +3,19 @@ export declare const PreloadComponentsStateGlobalVariableName = "__PAGES_KIT_PRE
|
|
|
3
3
|
export interface PreloadComponent {
|
|
4
4
|
preloadComponentModuleName: string;
|
|
5
5
|
component: CustomComponent;
|
|
6
|
-
locales?: {
|
|
7
|
-
[locale: string]: {
|
|
8
|
-
properties?: {
|
|
9
|
-
[key: string]: any;
|
|
10
|
-
};
|
|
11
|
-
};
|
|
12
|
-
};
|
|
13
|
-
serverSideProps?: {
|
|
14
|
-
[key: string]: any;
|
|
15
|
-
};
|
|
16
6
|
}
|
|
17
7
|
export interface PreloadComponentsState {
|
|
18
8
|
config: {
|
|
19
9
|
defaultLocale?: string;
|
|
20
10
|
};
|
|
21
11
|
components: {
|
|
22
|
-
[
|
|
12
|
+
[componentId: string]: PreloadComponent;
|
|
13
|
+
};
|
|
14
|
+
props: {
|
|
15
|
+
[instanceId: string]: {
|
|
16
|
+
[locale: string]: {
|
|
17
|
+
[key: string]: any;
|
|
18
|
+
};
|
|
19
|
+
};
|
|
23
20
|
};
|
|
24
21
|
}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
import { PreloadComponentsResult } from '../types';
|
|
2
|
-
export declare function injectPreloadComponents(
|
|
2
|
+
export declare function injectPreloadComponents(...input: PreloadComponentsResult[] | PreloadComponentsResult[][]): {
|
|
3
3
|
html: string;
|
|
4
|
-
} |
|
|
4
|
+
} | null;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@blocklet/pages-kit",
|
|
3
|
-
"version": "0.2.
|
|
3
|
+
"version": "0.2.216",
|
|
4
4
|
"description": "Pages Kit components and utils",
|
|
5
5
|
"publishConfig": {
|
|
6
6
|
"access": "public"
|
|
@@ -120,7 +120,7 @@
|
|
|
120
120
|
"react-router-dom": "^6.16.0"
|
|
121
121
|
},
|
|
122
122
|
"devDependencies": {
|
|
123
|
-
"@arcblock/ux": "^2.9.
|
|
123
|
+
"@arcblock/ux": "^2.9.20",
|
|
124
124
|
"@emotion/cache": "^11.11.0",
|
|
125
125
|
"@emotion/css": "^11.11.2",
|
|
126
126
|
"@emotion/react": "^11.11.3",
|