fix device

packages/editor-skeleton/src/layouts/workbench.less

@@ -232,6 +232,7 @@ body {
       flex-shrink: 0;
       flex-direction: column;
       justify-content: space-between;
+      overflow: hidden;
       &.lc-area-visible {
         display: flex;
       }

packages/react-simulator-renderer/src/renderer-view.tsx

@@ -47,22 +47,23 @@ export default class SimulatorRendererView extends Component<{ renderer: Simulat
   }
 }
 
-function getDeviceView(view: any, device: string) {
-  if (!view || typeof view === 'string' || device === 'default') {
+function ucfirst(s: string) {
+  return s.charAt(0).toUpperCase() + s.substring(1);
+}
+function getDeviceView(view: any, device: string, mode: string) {
+  if (!view || typeof view === 'string') {
     return view;
   }
 
-  /*
-  const viewport = Viewport.getViewport();
-  if (viewport) {
-    if (view.hasOwnProperty(device)) {
-      view = view[device];
-    }
-
-    if (view.hasOwnProperty(mode)) {
-      view = view[mode];
-    }
-  }*/
+  // compatible vision Mobile | Preview
+  device = ucfirst(device);
+  if (device === 'Mobile' && view.hasOwnProperty(device)) {
+    view = view[device];
+  }
+  mode = ucfirst(mode);
+  if (mode === 'Preview' && view.hasOwnProperty(mode)) {
+    view = view[mode];
+  }
   return view;
 }
 
@@ -91,14 +92,14 @@ class Renderer extends Component<{ renderer: SimulatorRenderer }> {
   }
   render() {
     const { renderer } = this.props;
-    const device = renderer.designMode
+    const { device, designMode } = renderer;
     return (
       <LowCodeRenderer
         schema={renderer.schema}
         components={renderer.components}
         appHelper={renderer.context}
         // context={renderer.context}
-        designMode={renderer.designMode}
+        designMode={designMode}
         suspended={renderer.suspended}
         self={renderer.scope}
         customCreateElement={(Component: any, props: any, children: any) => {
@@ -107,7 +108,7 @@ class Renderer extends Component<{ renderer: SimulatorRenderer }> {
           viewProps._leaf = host.document.getNode(__id);
 
           return createElement(
-            getDeviceView(Component, device),
+            getDeviceView(Component, device, designMode),
             viewProps,
             children == null ? [] : Array.isArray(children) ? children : [children],
           );

packages/react-simulator-renderer/src/renderer.ts

@@ -35,6 +35,7 @@ export class SimulatorRenderer implements BuiltinSimulatorRenderer {
       }
 
       // sync designMode
+      this._designMode = host.designMode;
 
       // sync suspended
 
@@ -84,8 +85,9 @@ export class SimulatorRenderer implements BuiltinSimulatorRenderer {
   @computed get context(): any {
     return this._appContext;
   }
+  @obx.ref private _designMode: string = 'design';
   @computed get designMode(): any {
-    return 'preview';
+    return this._designMode;
   }
   @obx.ref private _device: string = 'default';
   @computed get device() {