@blocklet/pages-kit-block-studio 0.5.11 → 0.5.13

package/lib/esm/plugins/_theme.js

@@ -8,9 +8,12 @@ import { createAuthServiceSessionContext } from '@arcblock/did-connect/lib/Sessi
 import { useConfig } from '@arcblock/ux/lib/Config';
 import Empty from '@arcblock/ux/lib/Empty';
 import { LocaleProvider, useLocaleContext } from '@arcblock/ux/lib/Locale/context';
+import { ThemeProvider } from '@arcblock/ux/lib/Theme';
 import Toast, { ToastProvider } from '@arcblock/ux/lib/Toast';
 import { createAxios } from '@blocklet/js-sdk';
-import { PageProvider, DashboardProvider } from '@blocklet/pages-kit-inner-components/theme';
+import { 
+// PageProvider,
+DashboardProvider, } from '@blocklet/pages-kit-inner-components/theme';
 // @ts-ignore
 import { BasicInfo, ParametersConfig, PropertiesConfig } from '@blocklet/pages-kit-runtime/components';
 // @ts-ignore
@@ -114,7 +117,7 @@ function Layout({ loadState, loadedData }) {
         simulatorType: 'pc',
         iframeLoaded: false,
     });
-    const { theme, mode, toggleMode } = useConfig();
+    const { theme, mode, changeMode } = useConfig();
     // 添加renderComponentTrigger状态，用于触发组件重新渲染
     const [renderComponentTrigger, setRenderComponentTrigger] = useState(0);
     const [hSizes, setHSizes] = useLocalStorageState('BlockStudioHorizontalSizes', {
@@ -339,13 +342,13 @@ function Layout({ loadState, loadedData }) {
             }
             if (event.data && event.data.type === 'TOGGLE_MODE') {
                 if (mode !== event.data.data.mode) {
-                    toggleMode();
+                    changeMode(event.data.data.mode);
                 }
             }
         };
         window.addEventListener('message', handleMessage);
         return () => window.removeEventListener('message', handleMessage);
-    }, []);
+    }, [changeMode, mode]);
     const leftPanelContent = useMemo(() => {
         if (state.draggingSplitPane) {
             return DraggingSplitPlaceholder;
@@ -407,7 +410,7 @@ function Layout({ loadState, loadedData }) {
             const url = new URL(window.location.href);
             const initialComponentId = url.searchParams.get('componentId') || state.metadata.id;
             const initialLocale = url.searchParams.get('locale') || locale || 'en';
-            return (_jsx(Box, { className: "custom-component-root", sx: { height: '100%', width: '100%', overflow: 'auto' }, children: _jsx(PageProvider, { children: _jsx(Suspense, { fallback: _jsx(CircularProgress, {}), children: _jsx(CustomComponentRenderer, { locale: initialLocale, componentId: initialComponentId || state.metadata.id, dev: {
+            return (_jsx(Box, { className: "custom-component-root", sx: { height: '100%', width: '100%', overflow: 'auto' }, children: _jsx(ThemeProvider, { theme: theme, children: _jsx(Suspense, { fallback: _jsx(CircularProgress, {}), children: _jsx(CustomComponentRenderer, { locale: initialLocale, componentId: initialComponentId || state.metadata.id, dev: {
                                 mode: 'draft',
                                 components: mergedAllBlocks,
                                 defaultLocale,
@@ -574,6 +577,10 @@ function Layout({ loadState, loadedData }) {
         state.iframeLoaded,
         locale,
         mode,
+        theme,
+        JSON.stringify(state.metadata || {}),
+        JSON.stringify(mergedAllBlocks || []),
+        JSON.stringify(mergedPropertiesValues || {}),
     ]);
     const rightPanelContent = useMemo(() => {
         if (state.draggingSplitPane) {