@blocklet/pages-kit 0.4.8 → 0.4.9

package/lib/esm/api/pages-kit.js

@@ -12,8 +12,10 @@ import { joinURL } from 'ufo';
 const PAGES_KIT_DID = 'z8iZiDFg3vkkrPwsiba1TLXy3H9XHzFERsP8o';
 export function preloadComponents(input) {
     return __awaiter(this, void 0, void 0, function* () {
-        var _a, _b;
-        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) || '/';
+        var _a, _b, _c;
+        const prefix = ((_b = (_a = window.blocklet) === null || _a === void 0 ? void 0 : _a.componentMountPoints.find((i) => i.did === PAGES_KIT_DID && i.status === '"running"')) === null || _b === void 0 ? void 0 : _b.mountPoint) ||
+            ((_c = window === null || window === void 0 ? void 0 : window.blocklet) === null || _c === void 0 ? void 0 : _c.prefix) ||
+            '/';
         return axios.post(joinURL(prefix, '/api/components/preload'), input).then((res) => res.data);
     });
 }

package/lib/esm/components/CustomComponentRenderer/index.js

@@ -25,7 +25,7 @@ export default function CustomComponentRenderer(_a) {
     var { dev } = _a, props = __rest(_a, ["dev"]);
     const inheritedDev = useDev();
     const BuiltinComponent = BuiltinComponents[props.componentId];
-    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 }))) }) }));
+    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, renderType: props.renderType }))) }) }));
 }
 const BuiltinComponents = {
     'blocklet-react-component': BlockletReactComponentRenderer,
@@ -35,20 +35,25 @@ function ErrorView({ error }) {
 }
 function ComponentRenderer(_a) {
     var _b;
-    var { renderCount = 0, blockletId, blockletTitle, componentName } = _a, props = __rest(_a, ["renderCount", "blockletId", "blockletTitle", "componentName"]);
+    var { renderCount = 0, blockletId, blockletTitle, componentName, renderType = 'view' } = _a, props = __rest(_a, ["renderCount", "blockletId", "blockletTitle", "componentName", "renderType"]);
     const dev = useDev();
     if (renderCount > MAXIMUM_RENDER_STACK_SIZE) {
         throw new Error('Maximum render stack size exceeded');
     }
     const component = useComponent(Object.assign(Object.assign({}, props), { dev }));
+    const ctx = useCustomComponentRenderer();
     if (component === null || component === void 0 ? void 0 : component.error) {
-        // throw to outer error boundary
         throw component.error;
     }
-    const ctx = useCustomComponentRenderer();
-    if (component === null || component === void 0 ? void 0 : component.Component) {
-        const children = (_jsx(Renderer, Object.assign({ renderCount: renderCount + 1 }, props, { Component: component.Component, props: Object.assign(Object.assign({}, component.props), props.props) })));
-        return (ctx === null || ctx === void 0 ? void 0 : ctx.customRendererComponent) ? (_jsx(ctx.customRendererComponent, { Component: component.Component, children: children })) : (children);
+    const renderComponentChildren = (Component) => {
+        const children = (_jsx(Renderer, Object.assign({ renderCount: renderCount + 1 }, props, { Component: Component, props: Object.assign(Object.assign({}, component === null || component === void 0 ? void 0 : component.props), props.props) })));
+        return (ctx === null || ctx === void 0 ? void 0 : ctx.customRendererComponent) ? (_jsx(ctx.customRendererComponent, { Component: Component, children: children })) : (children);
+    };
+    if ((component === null || component === void 0 ? void 0 : component.Component) && renderType === 'view') {
+        return renderComponentChildren(component.Component);
+    }
+    if ((component === null || component === void 0 ? void 0 : component.EditComponent) && renderType === 'setting') {
+        return renderComponentChildren(component.EditComponent);
     }
     // if the component is not in the dev.components, it means the component is not loaded
     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) {

package/lib/esm/components/CustomComponentRenderer/state.js

@@ -160,6 +160,7 @@ export function useComponent({ instanceId, componentId, properties, locale, dev
     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;
     return {
         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,
+        EditComponent: transpile === null || transpile === void 0 ? void 0 : transpile.EditComponent,
         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 : {})
             .map(([key, { value }]) => {
             var _a;
@@ -202,7 +203,7 @@ function usePreloadComponent({ instanceId, componentId, properties, locale, dev
 }
 function useTranspileComponent({ componentId, locale, properties, dev: { defaultLocale, components } = {}, }) {
     var _a, _b;
-    const [{ error, Component, propertiesFromCode }, setComponent] = useState({});
+    const [{ error, Component, EditComponent, propertiesFromCode }, setComponent] = useState({});
     const component = mergeComponent({
         componentId,
         getComponent: (componentId) => {
@@ -224,7 +225,7 @@ function useTranspileComponent({ componentId, locale, properties, dev: { default
                 .then((m) => {
                 // get properties from code
                 const propertiesFromCode = getPropertiesFromCode(m);
-                setComponent({ Component: m.default, propertiesFromCode });
+                setComponent({ Component: m.default, EditComponent: m.EditComponent || undefined, propertiesFromCode });
             })
                 .catch((error) => {
                 setComponent({ error });
@@ -234,6 +235,7 @@ function useTranspileComponent({ componentId, locale, properties, dev: { default
     return {
         error,
         Component,
+        EditComponent,
         props: component === null || component === void 0 ? void 0 : component.properties,
         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,
     };