@blocklet/pages-kit 0.4.31 → 0.4.33

package/lib/cjs/api/call.js

@@ -1,23 +1,12 @@
 "use strict";
-var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
-    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
-    return new (P || (P = Promise))(function (resolve, reject) {
-        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
-        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
-        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
-        step((generator = generator.apply(thisArg, _arguments || [])).next());
-    });
-};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.preloadComponents = preloadComponents;
 const component_1 = require("@blocklet/sdk/lib/component");
-function preloadComponents(input) {
-    return __awaiter(this, void 0, void 0, function* () {
-        return (0, component_1.call)({
-            name: 'pages-kit',
-            method: 'POST',
-            path: '/api/components/preload',
-            data: input,
-        }).then((res) => res.data);
-    });
+async function preloadComponents(input) {
+    return (0, component_1.call)({
+        name: 'pages-kit',
+        method: 'POST',
+        path: '/api/components/preload',
+        data: input,
+    }).then((res) => res.data);
 }

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

@@ -1,13 +1,4 @@
 "use strict";
-var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
-    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
-    return new (P || (P = Promise))(function (resolve, reject) {
-        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
-        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
-        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
-        step((generator = generator.apply(thisArg, _arguments || [])).next());
-    });
-};
 var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
@@ -16,12 +7,9 @@ exports.preloadComponents = preloadComponents;
 const axios_1 = __importDefault(require("axios"));
 const ufo_1 = require("ufo");
 const PAGES_KIT_DID = 'z8iZiDFg3vkkrPwsiba1TLXy3H9XHzFERsP8o';
-function preloadComponents(input) {
-    return __awaiter(this, void 0, void 0, function* () {
-        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_1.default.post((0, ufo_1.joinURL)(prefix, '/api/components/preload'), input).then((res) => res.data);
-    });
+async function preloadComponents(input) {
+    const prefix = window.blocklet?.componentMountPoints.find((i) => i.did === PAGES_KIT_DID && i.status === 'running')?.mountPoint ||
+        window?.blocklet?.prefix ||
+        '/';
+    return axios_1.default.post((0, ufo_1.joinURL)(prefix, '/api/components/preload'), input).then((res) => res.data);
 }

package/lib/cjs/builtin/async/react-scroll-to-bottom.js

@@ -29,4 +29,8 @@ exports.default = () => Promise.all([
         ? // @ts-ignore
          Promise.resolve().then(() => __importStar(require('react-scroll-to-bottom/lib/esm/hooks/internal/useInternalContext'))) : // @ts-ignore
      Promise.resolve().then(() => __importStar(require('react-scroll-to-bottom/lib/hooks/internal/useInternalContext'))),
-]).then(([mod, { default: useInternalContext }]) => (Object.assign(Object.assign({}, mod), { Composer: mod.Composer, useInternalContext })));
+]).then(([mod, { default: useInternalContext }]) => ({
+    ...mod,
+    Composer: mod.Composer,
+    useInternalContext,
+}));

package/lib/cjs/builtin/components/LanguageField/index.js

@@ -1,15 +1,4 @@
 "use strict";
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
 var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
@@ -30,18 +19,17 @@ const filter = (options, state) => {
         return true;
     });
 };
-const LanguageField = (0, react_2.forwardRef)((_a, ref) => {
-    var { readOnly, parameter, onChange } = _a, props = __rest(_a, ["readOnly", "parameter", "onChange"]);
+const LanguageField = (0, react_2.forwardRef)(({ readOnly, parameter, onChange, ...props }, ref) => {
     const { locale } = (0, context_1.useLocaleContext)();
-    const value = (props === null || props === void 0 ? void 0 : props.value) ? languages_1.languages.find((o) => o.en === props.value) : null;
-    return ((0, jsx_runtime_1.jsx)(material_1.Autocomplete, Object.assign({ size: "small", ref: ref }, (0, pick_1.default)(props, 'autoFocus', 'fullWidth', 'sx', 'className', 'style'), { renderInput: (params) => ((0, jsx_runtime_1.jsx)(material_1.TextField, Object.assign({}, (0, pick_1.default)(props, 'inputRef', 'size', 'hiddenLabel', 'helperText', 'error', 'placeholder', 'InputProps', 'inputProps'), params))), options: languages_1.languages, getOptionKey: (i) => i.en, getOptionLabel: (o) => {
+    const value = props?.value ? languages_1.languages.find((o) => o.en === props.value) : null;
+    return ((0, jsx_runtime_1.jsx)(material_1.Autocomplete, { size: "small", ref: ref, ...(0, pick_1.default)(props, 'autoFocus', 'fullWidth', 'sx', 'className', 'style'), renderInput: (params) => ((0, jsx_runtime_1.jsx)(material_1.TextField, { ...(0, pick_1.default)(props, 'inputRef', 'size', 'hiddenLabel', 'helperText', 'error', 'placeholder', 'InputProps', 'inputProps'), ...params })), options: languages_1.languages, getOptionKey: (i) => i.en, getOptionLabel: (o) => {
             return locale === 'zh' ? o.cn : o.en;
         }, autoHighlight: true, value: value, filterOptions: filter, onChange: (_e, newValue) => {
-            onChange === null || onChange === void 0 ? void 0 : onChange(newValue === null || newValue === void 0 ? void 0 : newValue.en);
+            onChange?.(newValue?.en);
         }, renderOption: (props, option) => {
-            return ((0, react_1.createElement)(material_1.MenuItem, Object.assign({}, props, { key: option.name }),
+            return ((0, react_1.createElement)(material_1.MenuItem, { ...props, key: option.name },
                 (0, jsx_runtime_1.jsx)(material_1.ListItemIcon, { children: (0, jsx_runtime_1.jsx)(option.flag, {}) }),
                 (0, jsx_runtime_1.jsx)(material_1.ListItemText, { primary: `${option.name} ${locale === 'zh' ? option.cn : option.en} (${option.abbr})` })));
-        } })));
+        } }));
 });
 exports.default = LanguageField;

package/lib/cjs/builtin/iconify/react.js

@@ -5,6 +5,6 @@ const jsx_runtime_1 = require("react/jsx-runtime");
 const react_1 = require("@iconify/react");
 const material_1 = require("@mui/material");
 function Icon(props) {
-    return (0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ component: react_1.Icon }, props));
+    return (0, jsx_runtime_1.jsx)(material_1.Box, { component: react_1.Icon, ...props });
 }
 exports.default = Icon;

package/lib/cjs/builtin/page/header.js

@@ -26,12 +26,15 @@ exports.useHeaderState = (0, zustand_1.create)()((0, immer_2.immer)((set, get) =
         for (const i of get().stack) {
             widgets.push(i());
         }
-        const r = widgets.reduce((res, i) => (Object.assign(Object.assign(Object.assign({}, res), i), { addons: (exists) => {
-                var _a, _b, _c, _d;
-                const a = (_b = (_a = res.addons) === null || _a === void 0 ? void 0 : _a.call(res, exists)) !== null && _b !== void 0 ? _b : exists;
-                const b = (_d = (_c = i.addons) === null || _c === void 0 ? void 0 : _c.call(i, a)) !== null && _d !== void 0 ? _d : a;
+        const r = widgets.reduce((res, i) => ({
+            ...res,
+            ...i,
+            addons: (exists) => {
+                const a = res.addons?.(exists) ?? exists;
+                const b = i.addons?.(a) ?? a;
                 return b;
-            } })), {});
+            },
+        }), {});
         set((state) => {
             state.logo = r.logo;
             state.description = r.description;

package/lib/cjs/builtin/session.js

@@ -14,4 +14,10 @@ var __exportStar = (this && this.__exportStar) || function(m, exports) {
     for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
 };
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.useSessionContext = useSessionContext;
+const Session_1 = require("@arcblock/did-connect/lib/Session");
+const react_1 = require("react");
 __exportStar(require("@arcblock/did-connect/lib/Session"), exports);
+function useSessionContext() {
+    return (0, react_1.useContext)(Session_1.SessionContext);
+}

package/lib/cjs/builtin/stream.js

@@ -24,7 +24,7 @@ class EventSourceParserStream extends TransformStream {
                 });
             },
             transform(chunk) {
-                parser === null || parser === void 0 ? void 0 : parser.feed(chunk);
+                parser?.feed(chunk);
             },
         });
     }

package/lib/cjs/builtin/utils.js

@@ -9,18 +9,16 @@ Object.defineProperty(exports, "joinURL", { enumerable: true, get: function () {
 Object.defineProperty(exports, "withQuery", { enumerable: true, get: function () { return ufo_2.withQuery; } });
 Object.defineProperty(exports, "getQuery", { enumerable: true, get: function () { return ufo_2.getQuery; } });
 function getComponentMountPoint(name) {
-    var _a, _b;
     if (typeof window === 'undefined') {
         // eslint-disable-next-line global-require
         return require('@blocklet/sdk/lib/component').getComponentMountPoint(name);
     }
-    return (_b = (_a = globalThis.blocklet) === null || _a === void 0 ? void 0 : _a.componentMountPoints.find((i) => i.name === name || i.did === name)) === null || _b === void 0 ? void 0 : _b.mountPoint;
+    return globalThis.blocklet?.componentMountPoints.find((i) => i.name === name || i.did === name)?.mountPoint;
 }
 function getMediaKitAbsoluteUrl(url) {
-    var _a, _b;
-    const PREFIX = ((_a = window.blocklet) === null || _a === void 0 ? void 0 : _a.prefix) || '/';
+    const PREFIX = window.blocklet?.prefix || '/';
     const IMAGE_BIN_DID = 'z8ia1mAXo8ZE7ytGF36L5uBf9kD2kenhqFGp9';
-    const IMAGE_BIN_PREFIX = ((_b = blocklet === null || blocklet === void 0 ? void 0 : blocklet.componentMountPoints.find((i) => i.did === IMAGE_BIN_DID)) === null || _b === void 0 ? void 0 : _b.mountPoint) || (0, ufo_1.joinURL)(PREFIX, '/image-bin');
+    const IMAGE_BIN_PREFIX = blocklet?.componentMountPoints.find((i) => i.did === IMAGE_BIN_DID)?.mountPoint || (0, ufo_1.joinURL)(PREFIX, '/image-bin');
     if (url && url.startsWith('mediakit://')) {
         return window.location.origin + (0, ufo_1.joinURL)(IMAGE_BIN_PREFIX, 'uploads', url.replace('mediakit://', ''));
     }

package/lib/cjs/components/CustomComponentRenderer/BlockletReactComponentRenderer.js

@@ -22,28 +22,15 @@ var __importStar = (this && this.__importStar) || function (mod) {
     __setModuleDefault(result, mod);
     return result;
 };
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.default = BlockletReactComponentRenderer;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const react_1 = __importStar(require("react"));
 const utils_1 = require("../../builtin/utils");
-function BlockletReactComponentRenderer(_a) {
-    var props = __rest(_a, []);
+function BlockletReactComponentRenderer({ ...props }) {
     const url = (0, react_1.useMemo)(() => {
-        var _a, _b, _c, _d;
-        const did = (_b = (_a = props.properties) === null || _a === void 0 ? void 0 : _a.blockletDid) === null || _b === void 0 ? void 0 : _b.value;
-        const path = (_d = (_c = props.properties) === null || _c === void 0 ? void 0 : _c.componentPath) === null || _d === void 0 ? void 0 : _d.value;
+        const did = props.properties?.blockletDid?.value;
+        const path = props.properties?.componentPath?.value;
         if (!did || !path)
             return null;
         return (0, utils_1.joinURL)(window.location.origin, (0, utils_1.getComponentMountPoint)(did), path);
@@ -52,11 +39,10 @@ function BlockletReactComponentRenderer(_a) {
         throw new Error('Missing required properties `blockletDid` or `componentPath`');
     }
     const C = loadComponent(url);
-    return (0, jsx_runtime_1.jsx)(C, Object.assign({}, props.props));
+    return (0, jsx_runtime_1.jsx)(C, { ...props.props });
 }
 const COMPONENTS_CACHE = {};
 function loadComponent(url) {
-    var _a;
-    (_a = COMPONENTS_CACHE[url]) !== null && _a !== void 0 ? _a : (COMPONENTS_CACHE[url] = react_1.default.lazy(() => Promise.resolve(`${url}`).then(s => __importStar(require(s)))));
+    COMPONENTS_CACHE[url] ??= react_1.default.lazy(() => Promise.resolve(`${url}`).then(s => __importStar(require(s))));
     return COMPONENTS_CACHE[url];
 }

package/lib/cjs/components/CustomComponentRenderer/DevProvider.js

@@ -1,24 +1,12 @@
 "use strict";
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.DevProvider = DevProvider;
 exports.useDev = useDev;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const react_1 = require("react");
 const devContext = (0, react_1.createContext)(undefined);
-function DevProvider(_a) {
-    var { dev } = _a, props = __rest(_a, ["dev"]);
-    return (0, jsx_runtime_1.jsx)(devContext.Provider, Object.assign({ value: dev }, props));
+function DevProvider({ dev, ...props }) {
+    return (0, jsx_runtime_1.jsx)(devContext.Provider, { value: dev, ...props });
 }
 function useDev() {
     return (0, react_1.useContext)(devContext);

package/lib/cjs/components/CustomComponentRenderer/ErrorComponent.js

@@ -1,21 +1,9 @@
 "use strict";
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.ComponentError = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const material_1 = require("@mui/material");
-const ComponentError = (_a) => {
-    var { title = 'Component Failed to Load', message, componentId, componentName, blockletId, blockletTitle, showHints = false, error, resetErrorBoundary } = _a, rest = __rest(_a, ["title", "message", "componentId", "componentName", "blockletId", "blockletTitle", "showHints", "error", "resetErrorBoundary"]);
+const ComponentError = ({ title = 'Component Failed to Load', message, componentId, componentName, blockletId, blockletTitle, showHints = false, error, resetErrorBoundary, ...rest }) => {
     // 如果提供了error但没有message，使用error.message
     const displayMessage = message || (error ? error.message : 'Unknown error');
     console.warn(rest);
@@ -35,6 +23,6 @@ const ComponentError = (_a) => {
                     fontSize: '0.75rem',
                     overflow: 'auto',
                     maxHeight: '200px',
-                }, children: error.stack })), showHints && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, { variant: "body2", sx: { color: 'text.secondary' }, children: "Please try the following:" }), (0, jsx_runtime_1.jsxs)(material_1.Box, { component: "ul", sx: { m: 0, pl: 2 }, children: [componentId && ((0, jsx_runtime_1.jsxs)(material_1.Typography, { component: "li", variant: "body2", sx: { color: 'text.secondary' }, children: ["Select component", ' ', (0, jsx_runtime_1.jsx)(material_1.Box, { component: "span", sx: { fontWeight: 500 }, children: componentName !== null && componentName !== void 0 ? componentName : componentId }), ' ', "in settings or create this component."] })), (blockletId || blockletTitle) && ((0, jsx_runtime_1.jsxs)(material_1.Typography, { component: "li", variant: "body2", sx: { color: 'text.secondary' }, children: ["Contact administrator to install", ' ', (0, jsx_runtime_1.jsx)(material_1.Box, { component: "span", sx: { fontWeight: 500 }, children: blockletTitle !== null && blockletTitle !== void 0 ? blockletTitle : blockletId }), ' ', "Blocklet"] }))] })] })), resetErrorBoundary && ((0, jsx_runtime_1.jsx)(material_1.Box, { sx: { mt: 2 }, children: (0, jsx_runtime_1.jsx)(material_1.Button, { variant: "outlined", color: "error", size: "small", onClick: resetErrorBoundary, children: "Try Again" }) }))] }));
+                }, children: error.stack })), showHints && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, { variant: "body2", sx: { color: 'text.secondary' }, children: "Please try the following:" }), (0, jsx_runtime_1.jsxs)(material_1.Box, { component: "ul", sx: { m: 0, pl: 2 }, children: [componentId && ((0, jsx_runtime_1.jsxs)(material_1.Typography, { component: "li", variant: "body2", sx: { color: 'text.secondary' }, children: ["Select component", ' ', (0, jsx_runtime_1.jsx)(material_1.Box, { component: "span", sx: { fontWeight: 500 }, children: componentName ?? componentId }), ' ', "in settings or create this component."] })), (blockletId || blockletTitle) && ((0, jsx_runtime_1.jsxs)(material_1.Typography, { component: "li", variant: "body2", sx: { color: 'text.secondary' }, children: ["Contact administrator to install", ' ', (0, jsx_runtime_1.jsx)(material_1.Box, { component: "span", sx: { fontWeight: 500 }, children: blockletTitle ?? blockletId }), ' ', "Blocklet"] }))] })] })), resetErrorBoundary && ((0, jsx_runtime_1.jsx)(material_1.Box, { sx: { mt: 2 }, children: (0, jsx_runtime_1.jsx)(material_1.Button, { variant: "outlined", color: "error", size: "small", onClick: resetErrorBoundary, children: "Try Again" }) }))] }));
 };
 exports.ComponentError = ComponentError;

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

@@ -13,17 +13,6 @@ var __createBinding = (this && this.__createBinding) || (Object.create ? (functi
 var __exportStar = (this && this.__exportStar) || function(m, exports) {
     for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
 };
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
 var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
@@ -40,40 +29,36 @@ const state_1 = require("./state");
 __exportStar(require("./state"), exports);
 __exportStar(require("./context"), exports);
 const MAXIMUM_RENDER_STACK_SIZE = 20;
-function CustomComponentRenderer(_a) {
-    var _b;
-    var { dev } = _a, props = __rest(_a, ["dev"]);
+function CustomComponentRenderer({ dev, ...props }) {
     const inheritedDev = (0, DevProvider_1.useDev)();
     const BuiltinComponent = BuiltinComponents[props.componentId];
-    return ((0, jsx_runtime_1.jsx)(react_error_boundary_1.ErrorBoundary, { FallbackComponent: (props === null || props === void 0 ? void 0 : props.fallbackRender) || ErrorComponent_1.ComponentError, resetKeys: [Date.now()], children: (0, jsx_runtime_1.jsx)(DevProvider_1.DevProvider, { dev: dev !== null && dev !== void 0 ? dev : inheritedDev, children: BuiltinComponent ? ((0, jsx_runtime_1.jsx)(BuiltinComponent, Object.assign({}, props))) : ((0, jsx_runtime_1.jsx)(ComponentRenderer, Object.assign({}, props, { instanceId: (_b = props.instanceId) !== null && _b !== void 0 ? _b : props.componentId, renderType: props.renderType }))) }) }));
+    return ((0, jsx_runtime_1.jsx)(react_error_boundary_1.ErrorBoundary, { FallbackComponent: props?.fallbackRender || ErrorComponent_1.ComponentError, resetKeys: [Date.now()], children: (0, jsx_runtime_1.jsx)(DevProvider_1.DevProvider, { dev: dev ?? inheritedDev, children: BuiltinComponent ? ((0, jsx_runtime_1.jsx)(BuiltinComponent, { ...props })) : ((0, jsx_runtime_1.jsx)(ComponentRenderer, { ...props, instanceId: props.instanceId ?? props.componentId, renderType: props.renderType })) }) }));
 }
 const BuiltinComponents = {
     'blocklet-react-component': BlockletReactComponentRenderer_1.default,
 };
-function ComponentRenderer(_a) {
-    var _b;
-    var { renderCount = 0, blockletId, blockletTitle, componentName, renderType = 'view' } = _a, props = __rest(_a, ["renderCount", "blockletId", "blockletTitle", "componentName", "renderType"]);
+function ComponentRenderer({ renderCount = 0, blockletId, blockletTitle, componentName, renderType = 'view', ...props }) {
     const dev = (0, DevProvider_1.useDev)();
     if (renderCount > MAXIMUM_RENDER_STACK_SIZE) {
         throw new Error('Maximum render stack size exceeded');
     }
-    const component = (0, state_1.useComponent)(Object.assign(Object.assign({}, props), { dev }));
+    const component = (0, state_1.useComponent)({ ...props, dev });
     const ctx = (0, context_1.useCustomComponentRenderer)();
-    if (component === null || component === void 0 ? void 0 : component.error) {
+    if (component?.error) {
         throw component.error;
     }
     const renderComponentChildren = (Component) => {
-        const children = ((0, jsx_runtime_1.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) ? ((0, jsx_runtime_1.jsx)(ctx.customRendererComponent, { Component: Component, children: children })) : (children);
+        const children = ((0, jsx_runtime_1.jsx)(Renderer, { renderCount: renderCount + 1, ...props, Component: Component, props: { ...component?.props, ...props.props } }));
+        return ctx?.customRendererComponent ? ((0, jsx_runtime_1.jsx)(ctx.customRendererComponent, { Component: Component, children: children })) : (children);
     };
-    if ((component === null || component === void 0 ? void 0 : component.Component) && renderType === 'view') {
+    if (component?.Component && renderType === 'view') {
         return renderComponentChildren(component.Component);
     }
-    if ((component === null || component === void 0 ? void 0 : component.EditComponent) && renderType === 'setting') {
+    if (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) {
+    if (dev?.mode === 'draft' && dev && dev.components?.[props.componentId] === undefined) {
         return ((0, jsx_runtime_1.jsx)(ErrorComponent_1.ComponentError, { componentId: props.componentId, componentName: componentName, blockletId: blockletId, blockletTitle: blockletTitle, message: "Component not found in available components", showHints: true }));
     }
     return null;
@@ -82,8 +67,8 @@ function Renderer({ renderCount, Component, locale, props, }) {
     const componentProps = Object.fromEntries(Object.entries(props).map(([key, val]) => {
         return [
             key,
-            (val === null || val === void 0 ? void 0 : val.type) === property_1.RenderNestedComponent ? ((0, jsx_runtime_1.jsx)(ComponentRenderer, { locale: locale, renderCount: renderCount, componentId: val.componentId, properties: val.properties, props: val.props })) : (val),
+            val?.type === property_1.RenderNestedComponent ? ((0, jsx_runtime_1.jsx)(ComponentRenderer, { locale: locale, renderCount: renderCount, componentId: val.componentId, properties: val.properties, props: val.props })) : (val),
         ];
     }));
-    return (0, jsx_runtime_1.jsx)(Component, Object.assign({ locale: locale }, componentProps));
+    return (0, jsx_runtime_1.jsx)(Component, { locale: locale, ...componentProps });
 }