@blocklet/pages-kit 0.4.9 → 0.4.11
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/pages-kit.js +2 -4
- package/lib/cjs/components/CustomComponentRenderer/index.js +7 -12
- package/lib/cjs/components/CustomComponentRenderer/state.js +2 -4
- package/lib/cjs/tsconfig.tsbuildinfo +1 -1
- package/lib/esm/api/pages-kit.js +2 -4
- package/lib/esm/components/CustomComponentRenderer/index.js +7 -12
- package/lib/esm/components/CustomComponentRenderer/state.js +2 -4
- package/lib/esm/tsconfig.tsbuildinfo +1 -1
- package/lib/types/components/CustomComponentRenderer/index.d.ts +0 -1
- package/lib/types/components/CustomComponentRenderer/state.d.ts +0 -1
- package/lib/types/tsconfig.tsbuildinfo +1 -1
- package/lib/types/types/core.d.ts +1 -1
- package/package.json +6 -6
package/lib/esm/api/pages-kit.js
CHANGED
|
@@ -12,10 +12,8 @@ import { joinURL } from 'ufo';
|
|
|
12
12
|
const PAGES_KIT_DID = 'z8iZiDFg3vkkrPwsiba1TLXy3H9XHzFERsP8o';
|
|
13
13
|
export function preloadComponents(input) {
|
|
14
14
|
return __awaiter(this, void 0, void 0, function* () {
|
|
15
|
-
var _a, _b
|
|
16
|
-
const prefix = ((_b = (_a = window.blocklet) === null || _a === void 0 ? void 0 : _a.componentMountPoints.find((i) => i.did === PAGES_KIT_DID
|
|
17
|
-
((_c = window === null || window === void 0 ? void 0 : window.blocklet) === null || _c === void 0 ? void 0 : _c.prefix) ||
|
|
18
|
-
'/';
|
|
15
|
+
var _a, _b;
|
|
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) || '/';
|
|
19
17
|
return axios.post(joinURL(prefix, '/api/components/preload'), input).then((res) => res.data);
|
|
20
18
|
});
|
|
21
19
|
}
|
|
@@ -25,7 +25,7 @@ export default function CustomComponentRenderer(_a) {
|
|
|
25
25
|
var { dev } = _a, props = __rest(_a, ["dev"]);
|
|
26
26
|
const inheritedDev = useDev();
|
|
27
27
|
const BuiltinComponent = BuiltinComponents[props.componentId];
|
|
28
|
-
return (_jsx(ErrorBoundary, { FallbackComponent: (props === null || props === void 0 ? void 0 : props.fallbackRender) || ErrorView, resetKeys: [Date.now()], children: _jsx(DevProvider, { dev: dev !== null && dev !== void 0 ? dev : inheritedDev, children: BuiltinComponent ? (_jsx(BuiltinComponent, Object.assign({}, props))) : (_jsx(ComponentRenderer, Object.assign({}, props, { instanceId: (_b = props.instanceId) !== null && _b !== void 0 ? _b : props.componentId
|
|
28
|
+
return (_jsx(ErrorBoundary, { FallbackComponent: (props === null || props === void 0 ? void 0 : props.fallbackRender) || ErrorView, resetKeys: [Date.now()], children: _jsx(DevProvider, { dev: dev !== null && dev !== void 0 ? dev : inheritedDev, children: BuiltinComponent ? (_jsx(BuiltinComponent, Object.assign({}, props))) : (_jsx(ComponentRenderer, Object.assign({}, props, { instanceId: (_b = props.instanceId) !== null && _b !== void 0 ? _b : props.componentId }))) }) }));
|
|
29
29
|
}
|
|
30
30
|
const BuiltinComponents = {
|
|
31
31
|
'blocklet-react-component': BlockletReactComponentRenderer,
|
|
@@ -35,25 +35,20 @@ function ErrorView({ error }) {
|
|
|
35
35
|
}
|
|
36
36
|
function ComponentRenderer(_a) {
|
|
37
37
|
var _b;
|
|
38
|
-
var { renderCount = 0, blockletId, blockletTitle, componentName
|
|
38
|
+
var { renderCount = 0, blockletId, blockletTitle, componentName } = _a, props = __rest(_a, ["renderCount", "blockletId", "blockletTitle", "componentName"]);
|
|
39
39
|
const dev = useDev();
|
|
40
40
|
if (renderCount > MAXIMUM_RENDER_STACK_SIZE) {
|
|
41
41
|
throw new Error('Maximum render stack size exceeded');
|
|
42
42
|
}
|
|
43
43
|
const component = useComponent(Object.assign(Object.assign({}, props), { dev }));
|
|
44
|
-
const ctx = useCustomComponentRenderer();
|
|
45
44
|
if (component === null || component === void 0 ? void 0 : component.error) {
|
|
45
|
+
// throw to outer error boundary
|
|
46
46
|
throw component.error;
|
|
47
47
|
}
|
|
48
|
-
const
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
if ((component === null || component === void 0 ? void 0 : component.Component) && renderType === 'view') {
|
|
53
|
-
return renderComponentChildren(component.Component);
|
|
54
|
-
}
|
|
55
|
-
if ((component === null || component === void 0 ? void 0 : component.EditComponent) && renderType === 'setting') {
|
|
56
|
-
return renderComponentChildren(component.EditComponent);
|
|
48
|
+
const ctx = useCustomComponentRenderer();
|
|
49
|
+
if (component === null || component === void 0 ? void 0 : component.Component) {
|
|
50
|
+
const children = (_jsx(Renderer, Object.assign({ renderCount: renderCount + 1 }, props, { Component: component.Component, props: Object.assign(Object.assign({}, component.props), props.props) })));
|
|
51
|
+
return (ctx === null || ctx === void 0 ? void 0 : ctx.customRendererComponent) ? (_jsx(ctx.customRendererComponent, { Component: component.Component, children: children })) : (children);
|
|
57
52
|
}
|
|
58
53
|
// if the component is not in the dev.components, it means the component is not loaded
|
|
59
54
|
if ((dev === null || dev === void 0 ? void 0 : dev.mode) === 'draft' && dev && ((_b = dev.components) === null || _b === void 0 ? void 0 : _b[props.componentId]) === undefined) {
|
|
@@ -160,7 +160,6 @@ export function useComponent({ instanceId, componentId, properties, locale, dev
|
|
|
160
160
|
const componentProperties = (_a = transpile === null || transpile === void 0 ? void 0 : transpile.componentProperties) !== null && _a !== void 0 ? _a : preload === null || preload === void 0 ? void 0 : preload.componentProperties;
|
|
161
161
|
return {
|
|
162
162
|
Component: (_b = transpile === null || transpile === void 0 ? void 0 : transpile.Component) !== null && _b !== void 0 ? _b : preload === null || preload === void 0 ? void 0 : preload.Component,
|
|
163
|
-
EditComponent: transpile === null || transpile === void 0 ? void 0 : transpile.EditComponent,
|
|
164
163
|
props: Object.assign(Object.assign({}, ((_c = transpile === null || transpile === void 0 ? void 0 : transpile.props) !== null && _c !== void 0 ? _c : preload === null || preload === void 0 ? void 0 : preload.props)), Object.fromEntries(Object.entries(properties !== null && properties !== void 0 ? properties : {})
|
|
165
164
|
.map(([key, { value }]) => {
|
|
166
165
|
var _a;
|
|
@@ -203,7 +202,7 @@ function usePreloadComponent({ instanceId, componentId, properties, locale, dev
|
|
|
203
202
|
}
|
|
204
203
|
function useTranspileComponent({ componentId, locale, properties, dev: { defaultLocale, components } = {}, }) {
|
|
205
204
|
var _a, _b;
|
|
206
|
-
const [{ error, Component,
|
|
205
|
+
const [{ error, Component, propertiesFromCode }, setComponent] = useState({});
|
|
207
206
|
const component = mergeComponent({
|
|
208
207
|
componentId,
|
|
209
208
|
getComponent: (componentId) => {
|
|
@@ -225,7 +224,7 @@ function useTranspileComponent({ componentId, locale, properties, dev: { default
|
|
|
225
224
|
.then((m) => {
|
|
226
225
|
// get properties from code
|
|
227
226
|
const propertiesFromCode = getPropertiesFromCode(m);
|
|
228
|
-
setComponent({ Component: m.default,
|
|
227
|
+
setComponent({ Component: m.default, propertiesFromCode });
|
|
229
228
|
})
|
|
230
229
|
.catch((error) => {
|
|
231
230
|
setComponent({ error });
|
|
@@ -235,7 +234,6 @@ function useTranspileComponent({ componentId, locale, properties, dev: { default
|
|
|
235
234
|
return {
|
|
236
235
|
error,
|
|
237
236
|
Component,
|
|
238
|
-
EditComponent,
|
|
239
237
|
props: component === null || component === void 0 ? void 0 : component.properties,
|
|
240
238
|
componentProperties: (_b = (_a = components === null || components === void 0 ? void 0 : components[componentId]) === null || _a === void 0 ? void 0 : _a.data) === null || _b === void 0 ? void 0 : _b.properties,
|
|
241
239
|
};
|