@blocklet/pages-kit-block-studio 0.4.64 → 0.4.66

package/lib/esm/plugins/_theme.js

@@ -1,4 +1,502 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-export default function Theme() {
-    return _jsx("div", { children: "Theme" });
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/* eslint-disable */
+// @ts-nocheck
+import { createAuthServiceSessionContext } from '@arcblock/did-connect/lib/Session';
+import { LocaleProvider, useLocaleContext } from '@arcblock/ux/lib/Locale/context';
+import Toast, { ToastProvider } from '@arcblock/ux/lib/Toast';
+import { createAxios } from '@blocklet/js-sdk';
+// @ts-ignore
+import { pagesTheme, theme } from '@blocklet/pages-kit-inner-components/theme';
+// @ts-ignore
+import { BasicInfo, ParametersConfig, PropertiesConfig } from '@blocklet/pages-kit-runtime/components';
+// @ts-ignore
+import { translations } from '@blocklet/pages-kit-runtime/locales';
+import { CustomComponentRenderer } from '@blocklet/pages-kit/components';
+// @ts-ignore
+import { Dashboard } from '@blocklet/studio-ui';
+import { BlockletStudio } from '@blocklet/ui-react';
+import AddIcon from '@mui/icons-material/Add';
+import { Alert, Box, Button, CircularProgress, Dialog, DialogContent, DialogTitle, Drawer, List, ListItem, ListItemButton, Stack, StyledEngineProvider, TextField, ThemeProvider, Tooltip, Typography, backdropClasses, circularProgressClasses, styled, } from '@mui/material';
+import { useDebounceFn, useReactive } from 'ahooks';
+import cloneDeep from 'lodash/cloneDeep';
+// eslint-disable-next-line @typescript-eslint/no-unused-vars
+import { Suspense, useCallback, useEffect, useMemo } from 'react';
+import { DndProvider } from 'react-dnd';
+import { HTML5Backend } from 'react-dnd-html5-backend';
+import { Navigate, useLocation, useNavigate } from 'react-router-dom';
+import { joinURL } from 'ufo';
+// eslint-disable-next-line import/no-extraneous-dependencies
+import { useStaticData } from 'vite-plugin-react-pages/client';
+// @ts-ignore
+const basename = window.blocklet?.prefix || '/';
+const PAGES_KIT_BLOCK_STUDIO_BLOCKLET_DID = 'z2qa7rr3eUyVnWp2PCxEVARuUfLFh6cE5V2xV';
+const api = createAxios({
+    timeout: 200000,
+}, {
+    componentDid: PAGES_KIT_BLOCK_STUDIO_BLOCKLET_DID,
+});
+const { SessionProvider, SessionContext, SessionConsumer, withSession } = createAuthServiceSessionContext();
+const LEFT_DRAWER_WIDTH = 200;
+const RIGHT_DRAWER_WIDTH = 300;
+const ComparisonPreviewDialog = ({ open, title, leftTitle, leftContent, rightTitle, rightContent, description = '确认后将更新配置。', loading, onConfirm, onClose, }) => {
+    const handleConfirm = async () => {
+        try {
+            await onConfirm();
+        }
+        catch (error) {
+            console.error('执行操作失败:', error);
+            Toast.error('执行操作失败');
+        }
+    };
+    return (_jsxs(Dialog, { open: open, onClose: onClose, maxWidth: "md", fullWidth: true, children: [_jsx(DialogTitle, { children: title }), _jsx(DialogContent, { children: _jsxs(Box, { children: [_jsxs(Box, { sx: { display: 'flex', flexDirection: 'row', mb: 2 }, children: [_jsxs(Box, { sx: { flex: 1, mr: 1 }, children: [_jsx(Typography, { variant: "subtitle2", sx: { mb: 1 }, children: leftTitle }), _jsx(TextField, { multiline: true, fullWidth: true, rows: 10, InputProps: {
+                                                readOnly: true,
+                                            }, value: leftContent, sx: {
+                                                '& .MuiOutlinedInput-root': {
+                                                    fontFamily: 'monospace',
+                                                    fontSize: '0.875rem',
+                                                },
+                                            } })] }), _jsxs(Box, { sx: { flex: 1, ml: 1 }, children: [_jsx(Typography, { variant: "subtitle2", sx: { mb: 1 }, children: rightTitle }), _jsx(TextField, { multiline: true, fullWidth: true, rows: 10, InputProps: {
+                                                readOnly: true,
+                                            }, value: rightContent, sx: {
+                                                '& .MuiOutlinedInput-root': {
+                                                    fontFamily: 'monospace',
+                                                    fontSize: '0.875rem',
+                                                },
+                                            } })] })] }), _jsx(Typography, { variant: "body2", sx: { mt: 2, color: 'text.secondary' }, children: description })] }) }), _jsxs(Box, { sx: { display: 'flex', justifyContent: 'flex-end', p: 2 }, children: [_jsx(Button, { variant: "outlined", onClick: onClose, sx: { mr: 1 }, children: "\u53D6\u6D88" }), _jsx(Button, { variant: "contained", onClick: handleConfirm, disabled: loading, children: loading ? _jsx(CircularProgress, { size: 24 }) : '确认更新' })] })] }));
+};
+function Layout({ loadState, loadedData }) {
+    const state = useReactive({
+        injectBlocks: [],
+        selectingParam: null,
+        componentSelectOpen: false,
+        createResourceOpen: false,
+        createBlockOpen: false,
+        metadata: {
+            id: '',
+            createdAt: '',
+            updatedAt: '',
+        },
+        data: {},
+        allBlocks: {},
+        searchValue: '',
+        newBlockParams: {
+            name: '',
+            description: '',
+        },
+        previewDialog: {
+            open: false,
+            title: '',
+            leftTitle: '',
+            leftContent: '',
+            rightTitle: '',
+            rightContent: '',
+            description: '',
+            loading: false,
+            onConfirm: async () => { },
+        },
+    });
+    const { locale } = useLocaleContext();
+    const location = useLocation();
+    const navigate = useNavigate();
+    const staticData = useStaticData();
+    const { routes, firstRoute, currentPage } = useMemo(() => {
+        const routes = Object.keys(staticData).sort((a, b) => a.localeCompare(b));
+        return {
+            routes,
+            firstRoute: routes.find((route) => route !== '404' && route !== '*'),
+            currentPage: {
+                ...staticData[location.pathname]?.main,
+                pageId: location.pathname,
+            },
+        };
+    }, [staticData, location.pathname]);
+    const getStaticData = useCallback(() => {
+        return staticData[location.pathname]?.main || {};
+    }, [staticData, location.pathname]);
+    const getBlockMetadata = async (metadataPath) => {
+        if (!metadataPath)
+            return {};
+        const response = await api.get(`/api/blocks?path=${encodeURIComponent(metadataPath)}`);
+        return response.data || {};
+    };
+    const getAllBlocks = async () => {
+        const response = await api.get('/api/blocks/all');
+        return response.data || [];
+    };
+    const debouncedUpdateMetadata = useDebounceFn(async (metadata) => {
+        const { metadataPath } = getStaticData() || {};
+        if (metadataPath) {
+            try {
+                const metdadataWithoutRenderer = cloneDeep(metadata);
+                delete metdadataWithoutRenderer.renderer;
+                await api.post('/api/blocks', {
+                    path: metadataPath,
+                    content: metdadataWithoutRenderer,
+                });
+            }
+            catch (error) {
+                console.error('Failed to write metadata:', error);
+            }
+        }
+    }, { wait: 500 });
+    useEffect(() => {
+        debouncedUpdateMetadata.run(state.metadata);
+    }, [state.metadata, debouncedUpdateMetadata]);
+    useEffect(() => {
+        if (currentPage && state.injectBlocks.length === 0) {
+            state.injectBlocks.push({
+                ...currentPage,
+                level: 0,
+            });
+        }
+    }, [currentPage]);
+    // Add new effect to fetch metadata when page changes
+    useEffect(() => {
+        const fetchMetadata = async () => {
+            const { metadataPath, code } = getStaticData() || {};
+            if (metadataPath) {
+                try {
+                    const metadata = await getBlockMetadata(metadataPath);
+                    state.metadata = {
+                        ...metadata,
+                        renderer: {
+                            script: code,
+                            type: 'react-component',
+                        },
+                    };
+                }
+                catch (error) {
+                    console.error('Failed to fetch metadata:', error);
+                }
+            }
+        };
+        const fetchAllBlocks = async () => {
+            const allBlocks = await getAllBlocks();
+            state.allBlocks = allBlocks;
+        };
+        fetchMetadata();
+        fetchAllBlocks();
+    }, [location.pathname]); // 当路由变化时重新获取
+    const mergedAllBlocks = useMemo(() => {
+        // Add all staticData code and importPath mappings
+        if (import.meta.env.DEV) {
+            const win = window;
+            win.__BLOCK_STUDIO__ = win.__BLOCK_STUDIO__ || {};
+            win.__BLOCK_STUDIO__.codeImportPathMap = win.__BLOCK_STUDIO__.codeImportPathMap || {};
+            Object.entries(staticData).forEach(([_, pageData]) => {
+                const { code, importPath } = pageData?.main || {};
+                if (code && importPath) {
+                    win.__BLOCK_STUDIO__.codeImportPathMap[code] = joinURL(window.blocklet?.prefix, importPath);
+                }
+            });
+            win.__BLOCK_STUDIO__.getCodeImportPath = (code) => {
+                return win.__BLOCK_STUDIO__?.codeImportPathMap?.[code];
+            };
+        }
+        return {
+            ...state.allBlocks,
+            [state.metadata.id]: {
+                ...state.allBlocks[state.metadata.id],
+                data: state.metadata,
+            },
+        };
+    }, [state.allBlocks, state.metadata, staticData]);
+    const onCloseCreateBlock = () => {
+        state.createBlockOpen = false;
+        state.newBlockParams = {
+            name: '',
+            description: '',
+        };
+    };
+    const getRenderContent = useCallback(() => {
+        if (loadState.type === '404') {
+            return null;
+        }
+        if (['load-error', 'loading'].includes(loadState.type)) {
+            return (_jsx(Box, { width: "100%", height: "100%", display: "flex", justifyContent: "center", alignItems: "center", children: loadState.type === 'load-error' ? (_jsx(Alert, { severity: "error", variant: "filled", children: "Failed to load component code" })) : (_jsx(CircularProgress, {})) }));
+        }
+        // const pageData = loadedData[loadState.routePath];
+        // const Component = pageData.main.default;
+        // return <Component {...state.data} />;
+        return [
+            _jsx(CustomComponentRenderer, { locale: locale, componentId: state.metadata.id, dev: { mode: 'draft', components: mergedAllBlocks, defaultLocale: 'en' }, props: state.data }, "custom"),
+            // <Component key="original" {...state.data} />,
+        ];
+    }, [loadedData, loadState, locale, state.injectBlocks, state.metadata, mergedAllBlocks]);
+    // add auto redirect to first route
+    if (loadState.type === '404' &&
+        !routes.includes(location.pathname) &&
+        !location.search.includes('no-redirect=true')) {
+        return _jsx(Navigate, { to: `${firstRoute ?? '/'}`, replace: true });
+    }
+    return (_jsx(StyledEngineProvider, { injectFirst: true, children: _jsx(ThemeProvider, { theme: theme, children: _jsx(SessionProvider, { serviceHost: basename, protectedRoutes: [`${basename}/*`], children: _jsx(DndProvider, { backend: HTML5Backend, children: _jsxs(StyledDashboard, { HeaderProps: {
+                            // @ts-ignore
+                            homeLink: joinURL(basename),
+                            addons: (addons) => {
+                                return [
+                                    _jsx(Button, { onClick: () => (state.createResourceOpen = true), children: "Create Resource" }, "logout"),
+                                    ...addons,
+                                ];
+                            },
+                        }, MenusDrawerProps: { sx: { [`.${backdropClasses.root}`]: { top: 64 } } }, children: [_jsxs(Drawer, { variant: "permanent", sx: {
+                                    width: LEFT_DRAWER_WIDTH,
+                                    flexShrink: 0,
+                                    zIndex: 1000,
+                                    '& .MuiDrawer-paper': {
+                                        width: LEFT_DRAWER_WIDTH,
+                                        boxSizing: 'border-box',
+                                        position: 'relative',
+                                        height: '100%',
+                                    },
+                                }, children: [_jsxs(Stack, { gap: 1, direction: "row", alignItems: "center", sx: { py: 2, pr: 1, pl: 0.5 }, children: [_jsx(TextField, { placeholder: "Search Blocks...", sx: { minWidth: 120 }, onChange: (e) => {
+                                                    state.searchValue = e.target.value;
+                                                } }), _jsx(Button, { variant: "contained", sx: { minWidth: 'auto' }, onClick: () => {
+                                                    state.createBlockOpen = true;
+                                                }, children: _jsx(AddIcon, { fontSize: "small" }) })] }), _jsx(List, { sx: { pr: 1, overflowY: 'auto' }, children: routes
+                                            .map((route) => {
+                                            const routeName = route;
+                                            const staticDataInRoute = staticData[route]?.main;
+                                            if (state.searchValue && !routeName?.toLowerCase().includes(state.searchValue?.toLowerCase())) {
+                                                return null;
+                                            }
+                                            return (_jsx(ListItem, { disablePadding: true, children: _jsx(ListItemButton, { selected: currentPage.pageId === route, onClick: () => {
+                                                        navigate(route);
+                                                    }, sx: {
+                                                        borderRadius: 1,
+                                                        mb: 1,
+                                                        width: '100%',
+                                                        textOverflow: 'ellipsis',
+                                                        whiteSpace: 'nowrap',
+                                                        overflowX: 'hidden',
+                                                        transition: 'all 0.3s ease',
+                                                        '&.Mui-selected': {
+                                                            backgroundColor: 'primary.main',
+                                                            color: 'white',
+                                                            '&:hover': {
+                                                                backgroundColor: 'primary.main',
+                                                            },
+                                                        },
+                                                        fontSize: '14px',
+                                                    }, children: _jsx(Tooltip, { title: staticDataInRoute.blockName || routeName, children: _jsx("div", { style: {
+                                                                width: '100%',
+                                                                overflow: 'hidden',
+                                                                textOverflow: 'ellipsis',
+                                                            }, children: staticDataInRoute.blockName || routeName }) }) }) }, route));
+                                        })
+                                            .filter(Boolean) })] }), _jsx(Box, { sx: { flex: 1, overflowX: 'hidden', overflowY: getStaticData()?.isHtml ? 'hidden' : 'auto' }, children: _jsx(ThemeProvider, { theme: pagesTheme, children: _jsx(Suspense, { children: getRenderContent() }) }) }), _jsx(Drawer, { variant: "permanent", anchor: "right", sx: {
+                                    width: RIGHT_DRAWER_WIDTH,
+                                    flexShrink: 0,
+                                    zIndex: 1000,
+                                    '& .MuiDrawer-paper': {
+                                        width: RIGHT_DRAWER_WIDTH,
+                                        boxSizing: 'border-box',
+                                        position: 'relative',
+                                        height: '100%',
+                                    },
+                                }, children: _jsxs(List, { sx: { display: 'flex', flexDirection: 'column', gap: 1 }, children: [_jsx(ListItem, { children: _jsx(Box, { sx: { width: '100%' }, children: _jsx(BasicInfo, { config: state.metadata }) }) }), _jsx(ListItem, { children: _jsxs(Box, { sx: { width: '100%' }, children: [_jsx(PropertiesConfig, { config: state.metadata, currentLocale: locale, defaultLocale: "en", allComponents: mergedAllBlocks, onUpdateConfig: (updater) => {
+                                                            updater(state.metadata);
+                                                        }, useI18nEditor: false }), _jsxs(Stack, { direction: "column", spacing: 1, sx: { mt: 1 }, children: [_jsx(Button, { variant: "contained", size: "small", color: "primary", onClick: async () => {
+                                                                    try {
+                                                                        const { dataPath } = getStaticData() || {};
+                                                                        if (!dataPath) {
+                                                                            Toast.error('无法找到组件路径');
+                                                                            return;
+                                                                        }
+                                                                        Toast.info('正在分析组件接口...');
+                                                                        const response = await api.post('/api/blocks/interface-to-properties', {
+                                                                            componentPath: dataPath,
+                                                                        });
+                                                                        if (response.data.success) {
+                                                                            const { currentProperties, newProperties } = response.data;
+                                                                            state.previewDialog = {
+                                                                                open: true,
+                                                                                title: 'Interface → Properties 预览',
+                                                                                leftTitle: '当前 Properties',
+                                                                                leftContent: JSON.stringify(currentProperties, null, 2),
+                                                                                rightTitle: '新 Properties',
+                                                                                rightContent: JSON.stringify(newProperties, null, 2),
+                                                                                description: '确认后将更新metadata文件。这将保留现有配置值，但可能更改属性结构。',
+                                                                                loading: false,
+                                                                                onConfirm: async () => {
+                                                                                    state.previewDialog.loading = true;
+                                                                                    try {
+                                                                                        const updateResponse = await api.post('/api/blocks/interface-to-properties', {
+                                                                                            componentPath: dataPath,
+                                                                                            write: true,
+                                                                                        });
+                                                                                        if (updateResponse.data.success) {
+                                                                                            Toast.success('Metadata生成成功！');
+                                                                                            // 更新当前的metadata状态
+                                                                                            state.metadata = {
+                                                                                                ...updateResponse.data.metadata,
+                                                                                                renderer: state.metadata.renderer,
+                                                                                            };
+                                                                                            state.previewDialog.open = false;
+                                                                                        }
+                                                                                        else {
+                                                                                            throw new Error(updateResponse.data.error || '生成失败');
+                                                                                        }
+                                                                                    }
+                                                                                    finally {
+                                                                                        state.previewDialog.loading = false;
+                                                                                    }
+                                                                                },
+                                                                            };
+                                                                        }
+                                                                        else {
+                                                                            Toast.error(response.data.error || '预览失败');
+                                                                        }
+                                                                    }
+                                                                    catch (error) {
+                                                                        console.error('生成预览失败:', error);
+                                                                        Toast.error('生成预览失败');
+                                                                    }
+                                                                }, children: "Interface \u2192 Properties" }), _jsx(Button, { variant: "outlined", size: "small", color: "primary", onClick: async () => {
+                                                                    try {
+                                                                        const { dataPath } = getStaticData() || {};
+                                                                        if (!dataPath) {
+                                                                            Toast.error('无法找到组件路径');
+                                                                            return;
+                                                                        }
+                                                                        Toast.info('正在生成TypeScript接口预览...');
+                                                                        const response = await api.post('/api/blocks/properties-to-interface', {
+                                                                            componentPath: dataPath,
+                                                                        });
+                                                                        if (response.data.success) {
+                                                                            const { currentInterface, newInterface } = response.data;
+                                                                            state.previewDialog = {
+                                                                                open: true,
+                                                                                title: 'Properties → Interface 预览',
+                                                                                leftTitle: '当前接口',
+                                                                                leftContent: currentInterface,
+                                                                                rightTitle: '新接口',
+                                                                                rightContent: newInterface,
+                                                                                description: '确认后将更新TypeScript接口。这将覆盖当前的接口定义。',
+                                                                                loading: false,
+                                                                                onConfirm: async () => {
+                                                                                    state.previewDialog.loading = true;
+                                                                                    try {
+                                                                                        const updateResponse = await api.post('/api/blocks/properties-to-interface', {
+                                                                                            componentPath: dataPath,
+                                                                                            write: true,
+                                                                                        });
+                                                                                        if (updateResponse.data.success) {
+                                                                                            Toast.success('TypeScript接口生成成功！');
+                                                                                            state.previewDialog.open = false;
+                                                                                        }
+                                                                                        else {
+                                                                                            throw new Error(updateResponse.data.error || '生成失败');
+                                                                                        }
+                                                                                    }
+                                                                                    finally {
+                                                                                        state.previewDialog.loading = false;
+                                                                                    }
+                                                                                },
+                                                                            };
+                                                                        }
+                                                                        else {
+                                                                            Toast.error(response.data.error || '预览失败');
+                                                                        }
+                                                                    }
+                                                                    catch (error) {
+                                                                        console.error('生成接口预览失败:', error);
+                                                                        Toast.error('生成接口预览失败');
+                                                                    }
+                                                                }, children: "Properties \u2192 Interface" })] })] }) }), state.metadata.id && (_jsx(ListItem, { children: _jsx(Box, { sx: { width: '100%' }, children: _jsx(ParametersConfig, { config: state.metadata, allComponents: mergedAllBlocks, defaultLocale: "en", locale: locale, 
+                                                    // 不需要 propertiesValue
+                                                    // propertiesValue={{}}
+                                                    onChange: ({ key, value }) => {
+                                                        state.data = {
+                                                            ...state.data,
+                                                            [key]: value.value,
+                                                        };
+                                                    }, props: {
+                                                        ...state.data,
+                                                    } }) }) }))] }) }), _jsx(CreateResource, { open: state.createResourceOpen, onClose: () => {
+                                    state.createResourceOpen = false;
+                                } }), _jsxs(Dialog, { open: state.createBlockOpen, onClose: onCloseCreateBlock, children: [_jsx(DialogTitle, { children: "Create New Block" }), _jsx(DialogContent, { children: _jsxs(Stack, { spacing: 2, sx: { pt: 1, minWidth: 300 }, children: [_jsx(TextField, { autoFocus: true, required: true, label: "Name", fullWidth: true, value: state.newBlockParams.name, onChange: (e) => {
+                                                        state.newBlockParams.name = e.target.value.replace(/[^a-zA-Z0-9-]/g, '');
+                                                    } }), _jsx(TextField, { label: "Description", fullWidth: true, multiline: true, rows: 3, value: state.newBlockParams.description, onChange: (e) => {
+                                                        state.newBlockParams.description = e.target.value;
+                                                    } }), _jsx(Button, { variant: "contained", fullWidth: true, onClick: async () => {
+                                                        if (!state.newBlockParams.name) {
+                                                            Toast.warning('Block name is required');
+                                                            return;
+                                                        }
+                                                        if (routes.some((route) => {
+                                                            const staticDataInRoute = staticData[route]?.main;
+                                                            return (staticDataInRoute?.blockName?.toLowerCase() === state.newBlockParams.name.toLowerCase());
+                                                        })) {
+                                                            Toast.warning('Block name already exists, please change it');
+                                                            return;
+                                                        }
+                                                        try {
+                                                            await api.post('/api/blocks/create', state.newBlockParams);
+                                                            navigate(`/${state.newBlockParams.name}?no-redirect=true`);
+                                                            // wait for the file to be created
+                                                            setTimeout(() => {
+                                                                window.location.reload();
+                                                            }, 100);
+                                                            onCloseCreateBlock();
+                                                        }
+                                                        catch (error) {
+                                                            console.error('Failed to create block:', error);
+                                                            Toast.error('Failed to create block');
+                                                        }
+                                                    }, children: "Create" })] }) })] }), _jsx(ComparisonPreviewDialog, { open: state.previewDialog.open, title: state.previewDialog.title, leftTitle: state.previewDialog.leftTitle, leftContent: state.previewDialog.leftContent, rightTitle: state.previewDialog.rightTitle, rightContent: state.previewDialog.rightContent, description: state.previewDialog.description, loading: state.previewDialog.loading, onConfirm: state.previewDialog.onConfirm, onClose: () => {
+                                    state.previewDialog.open = false;
+                                } })] }) }) }) }) }));
+}
+const StyledDashboard = styled(Dashboard) `
+  .dashboard-content {
+    display: flex;
+    flex-direction: row;
+    gap: ${({ theme }) => theme.spacing(1)};
+    padding: 0 ${({ theme }) => theme.spacing(1)};
+    width: 100vw;
+    height: calc(100vh - 64px - 1px);
+  }
+
+  .header-container {
+    padding-left: ${({ theme }) => theme.spacing(3)};
+    padding-right: ${({ theme }) => theme.spacing(3)};
+
+    ${({ theme }) => theme.breakpoints.down('md')} {
+      padding-left: ${({ theme }) => theme.spacing(2)};
+      padding-right: ${({ theme }) => theme.spacing(2)};
+
+      .header-addons {
+        button {
+          svg,
+          .${circularProgressClasses.root} {
+            font-size: 1.25rem !important;
+            width: 1.25rem !important;
+            height: 1.25rem !important;
+          }
+        }
+      }
+    }
+
+    .locales {
+      border-radius: ${({ theme }) => theme.shape.borderRadius}px;
+      box-shadow: ${({ theme }) => theme.shadows[1]};
+      margin-top: ${({ theme }) => theme.spacing(1.5)}px;
+    }
+  }
+`;
+function LayoutWrapper({ loadState, loadedData, ...rest }) {
+    return (_jsx(ToastProvider, { children: _jsx(LocaleProvider, { translations: translations, fallbackLocale: "en", children: _jsx(Layout, { loadState: loadState, loadedData: loadedData }) }) }));
+}
+export default LayoutWrapper;
+function CreateResource({ open, onClose }) {
+    if (!open) {
+        return null;
+    }
+    const tenantScope = 'pages-kit-block-studio';
+    return (_jsx(Suspense, { children: _jsx(BlockletStudio, { mode: "dialog", tenantScope: tenantScope, title: "Pages Kit Blocks", description: "", note: "", introduction: "", logo: "", componentDid: PAGES_KIT_BLOCK_STUDIO_BLOCKLET_DID, 
+            // 透传到 get blocklet resource 的参数
+            resourcesParams: {}, dependentComponentsMode: "readonly", open: true, setOpen: () => onClose(), onConnected: () => { }, onUploaded: () => { }, onReleased: () => { }, 
+            // onOpened={() => onOpened?.()}
+            // 默认选中的资源
+            resources: {} }) }));
 }

package/lib/esm/plugins/vite-plugin-block-studio.js

@@ -14,8 +14,8 @@ import { nodePolyfills } from 'vite-plugin-node-polyfills';
 import pages, { DefaultPageStrategy } from 'vite-plugin-react-pages';
 import { findComponentFiles, setBlockEntryFilesPattern, getBlockEntryFilesPattern, getBlockName, logger, } from '../utils/helper';
 import { initHtmlPreviewTransformPlugin, VIRTUAL_MODULE_ID, readHtmlFiles, generateComponent, } from './vite-plugin-html-transform';
-const BUILTIN_MODULES_VAR = '__PAGES_KIT_BUILTIN_MODULES__';
-logger.log('BUILTIN_MODULES_VAR', BUILTIN_MODULES_VAR);
+// const BUILTIN_MODULES_VAR = '__PAGES_KIT_BUILTIN_MODULES__';
+// logger.log('BUILTIN_MODULES_VAR', BUILTIN_MODULES_VAR);
 const defaultBlockExternals = {
     // 核心 React 相关
     react: '@blocklet/pages-kit/builtin/react',