improve editor mask label

packages/arco-lib/src/generated/types/Table.ts

@@ -51,7 +51,6 @@ export const ColumnSchema = Type.Object({
 export const TablePropsSchema = Type.Object({
   data: Type.Array(Type.Any(), {
     title: 'Data',
-    widget: 'expression',
     category: Category.Data,
     weight: 0,
   }),

packages/editor/src/components/Editor.tsx

@@ -139,25 +139,27 @@ export const Editor: React.FC<Props> = observer(
 
     const renderMain = () => {
       const appBox = (
-        <Box
-          id="editor-main"
-          display="flex"
-          flexDirection="column"
-          width="full"
-          height="full"
-          overflow="auto"
-          p={1}
-          transform={`scale(${scale / 100})`}
-          position="relative"
-        >
-          <EditorMaskWrapper services={services}>
-            {appComponent}
-            <Box id={DIALOG_CONTAINER_ID} />
-          </EditorMaskWrapper>
+        <Flex flexDirection="column" width="full" height="full">
+          <Box
+            id="editor-main"
+            display="flex"
+            flexDirection="column"
+            width="full"
+            height="full"
+            overflow="auto"
+            padding="20px"
+            transform={`scale(${scale / 100})`}
+            position="relative"
+          >
+            <EditorMaskWrapper services={services}>
+              {appComponent}
+              <Box id={DIALOG_CONTAINER_ID} />
+            </EditorMaskWrapper>
+          </Box>
           <Box id="warning-area" height="48px" position="relative" flex="0 0 auto">
             <WarningArea services={services} />
           </Box>
-        </Box>
+        </Flex>
       );
 
       if (codeMode) {

packages/editor/src/components/EditorMaskWrapper/EditorMask.tsx

@@ -12,9 +12,15 @@ const outlineMaskTextStyle = css`
   z-index: 1;
   right: 0px;
   padding: 0 4px;
-  font-size: 14px;
-  font-weight: black;
+  height: 20px;
+  right: 0;
+  max-width: 100%;
   color: white;
+  font-size: 14px;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+  overflow: hidden;
+  transform: translateY(-100%);
 `;
 
 const outlineMaskStyle = css`

packages/editor/src/components/EditorMaskWrapper/EditorMaskWrapper.tsx

@@ -74,7 +74,7 @@ export const EditorMaskWrapper: React.FC<Props> = observer(props => {
       width="full"
       height="0"
       flex="1"
-      overflow="auto"
+      overflow="visible"
       position="relative"
       // some components stop click event propagation, so here we should capture onClick
       onClickCapture={onClick}