From 5054d06a375f895483bd29b07df39c2027010ed0 Mon Sep 17 00:00:00 2001
From: YJSON <jiasong.yjs@alibaba-inc.com>
Date: Wed, 29 Jul 2020 17:29:15 +0800
Subject: [PATCH] =?UTF-8?q?fix:=20=F0=9F=90=9B=20mainArea=20=E7=94=BB?=
 =?UTF-8?q?=E5=B8=83=E5=88=87=E6=8D=A2=EF=BC=8CMainArea=20=E9=87=8D?=
 =?UTF-8?q?=E6=96=B0=E5=88=9D=E5=A7=8B=E5=8C=96=E5=AF=BC=E8=87=B4=20iframe?=
 =?UTF-8?q?=20=E5=88=9D=E5=A7=8B=E5=8C=96=E6=8A=A5=E9=94=99?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../src/components/widget-views/index.less    |  8 +++++++
 .../index.tsx}                                | 21 +++++++++----------
 2 files changed, 18 insertions(+), 11 deletions(-)
 create mode 100644 packages/editor-skeleton/src/components/widget-views/index.less
 rename packages/editor-skeleton/src/components/{widget-views.tsx => widget-views/index.tsx} (93%)

diff --git a/packages/editor-skeleton/src/components/widget-views/index.less b/packages/editor-skeleton/src/components/widget-views/index.less
new file mode 100644
index 000000000..1241b0dde
--- /dev/null
+++ b/packages/editor-skeleton/src/components/widget-views/index.less
@@ -0,0 +1,8 @@
+.lc-widget-view-container {
+  height: 100%;
+  width: 100%;
+
+  &.hidden {
+    display: none;
+  }
+}
diff --git a/packages/editor-skeleton/src/components/widget-views.tsx b/packages/editor-skeleton/src/components/widget-views/index.tsx
similarity index 93%
rename from packages/editor-skeleton/src/components/widget-views.tsx
rename to packages/editor-skeleton/src/components/widget-views/index.tsx
index e14b2e2df..cb29ce451 100644
--- a/packages/editor-skeleton/src/components/widget-views.tsx
+++ b/packages/editor-skeleton/src/components/widget-views/index.tsx
@@ -2,13 +2,15 @@ import { Component, ReactElement } from 'react';
 import { Icon } from '@alifd/next';
 import classNames from 'classnames';
 import { Title, observer, Tip, globalContext, Editor } from '@ali/lowcode-editor-core';
-import { DockProps } from '../types';
-import PanelDock from '../widget/panel-dock';
-import { composeTitle } from '../widget/utils';
-import WidgetContainer from '../widget/widget-container';
-import Panel from '../widget/panel';
-import { IWidget } from '../widget/widget';
-import { SkeletonEvents } from '../skeleton';
+import { DockProps } from '../../types';
+import PanelDock from '../../widget/panel-dock';
+import { composeTitle } from '../../widget/utils';
+import WidgetContainer from '../../widget/widget-container';
+import Panel from '../../widget/panel';
+import { IWidget } from '../../widget/widget';
+import { SkeletonEvents } from '../../skeleton';
+
+import './index.less';
 
 export function DockView({ title, icon, description, size, className, onClick }: DockProps) {
   return (
@@ -262,9 +264,6 @@ export class WidgetView extends Component<{ widget: IWidget }> {
   }
   render() {
     const { widget } = this.props;
-    if (!widget.visible) {
-      return null;
-    }
-    return widget.body;
+    return <div className={classNames('lc-widget-view-container', { hidden: !widget.visible })}>{widget.body}</div>;
   }
 }