@riil-frontend/component-topology 6.0.0-alpha.6 → 6.0.0-alpha.60

package/es/core/editor/components/settings/core/edgePropertyViewAdapter.js

@@ -0,0 +1,22 @@
+import { isEdge } from "../../../../../utils/htElementUtils";
+import addEdgeProps from "../propertyViews/edge/addEdgeProps";
+export function adapterGetEdgePropertyViewType(selection, editorProps) {
+  var fn = editorProps.getEdgePropertyViewType;
+
+  if (selection.length === 1 && isEdge(selection[0]) && fn) {
+    var type = fn({
+      edge: selection[0]
+    });
+    return type;
+  }
+
+  return null;
+}
+export function addEdgePropertyViews(propertyViewManager, editorProps) {
+  var oldMap = editorProps.edgePropertyViews || {};
+  var map = {};
+  Object.keys(oldMap).forEach(function (name) {
+    map[name] = addEdgeProps(oldMap[name]);
+  });
+  propertyViewManager.updateViews(map);
+}

package/es/core/editor/components/settings/core/getPropertyViewType.js

@@ -0,0 +1,34 @@
+import { isEdge, isEdgeGroupAgent, isGroup, isLayer, isNode, isText } from "../../../../../utils/htElementUtils";
+
+function getPropertyViewType(selection) {
+  var selectionElement = selection[0];
+  var selectionSize = selection.length;
+  var viewType;
+
+  if (!selectionSize) {
+    // 未选
+    viewType = 'view';
+  } else if (selectionSize >= 2) {
+    // 多选
+    viewType = 'multiple';
+  } else if (isText(selectionElement)) {
+    viewType = 'text';
+  } else if (isGroup(selectionElement)) {
+    viewType = 'group';
+  } else if (selectionElement.a('type') === 'box') {
+    viewType = 'box';
+  } else if (isNode(selectionElement)) {
+    viewType = 'node';
+  } else if (isEdgeGroupAgent(selectionElement)) {
+    viewType = 'edgeGroup';
+  } else if (isEdge(selectionElement)) {
+    viewType = 'edge';
+  } else if (isLayer(selectionElement)) {
+    // 分层
+    viewType = 'layer';
+  }
+
+  return viewType;
+}
+
+export default getPropertyViewType;

package/es/core/editor/components/settings/core/updateElementProperty.js

@@ -0,0 +1,21 @@
+export default function updateElementProperty(topo, name, value) {
+  // const element = topo.getDataModel().getDataById(selection[0].id);
+  var element = topo.getSelectionModel().getFirstData(); // console.info("updateElementProperty",topo.getSelectionModel().getSelection(), { selection, element, name, value });
+
+  if (name.startsWith('attrObject.')) {
+    element.setAttr(name.replace('attrObject.', ''), value);
+  } else if (name.startsWith('position.')) {
+    element.setPosition(name.replace('position.', ''), value);
+  } else if (name.startsWith('styleMap.')) {
+    element.setStyle(name.replace('styleMap.', ''), value);
+  } else if (name === 'name') {
+    element.setName(value);
+  } else if (name === 'width') {
+    element.setWidth(value);
+  } else if (name === 'height') {
+    element.setHeight(value);
+  } else if (name === 'image') {
+    element.setImage(value);
+  }
+}
+;

package/es/core/editor/components/settings/propertyViews/box/BoxPropertyView.js

@@ -14,11 +14,9 @@ function parseValues(values) {
 export default function BoxPropertyView(props) {
   var topo = props.topo,
       values = props.values,
-      _onChange = props.onChange;
-  var boxNode = useHtElement({
-    topo: topo,
-    id: values.id
-  });
+      _onChange = props.onChange,
+      selectionElement = props.selectionElement;
+  var boxNode = selectionElement;
 
   var field = _Field.useField({
     autoUnmount: false,
@@ -40,19 +38,14 @@ export default function BoxPropertyView(props) {
   }, [values]);
   return /*#__PURE__*/React.createElement(_Form, {
     field: field,
-    labelAlign: "top"
-  }, /*#__PURE__*/React.createElement(_Form.Item, null, /*#__PURE__*/React.createElement(_Collapse, {
-    defaultExpandedKeys: ['标题区'],
+    labelAlign: "top",
     style: {
-      border: 'none'
+      margin: '12px 16px 0 32px'
     }
-  }, /*#__PURE__*/React.createElement(CollapsePanel, {
-    key: "\u6807\u9898\u533A",
-    title: "\u6807\u9898\u533A"
   }, /*#__PURE__*/React.createElement(_Form.Item, {
     label: "\u6807\u9898\u540D\u79F0"
   }, /*#__PURE__*/React.createElement(NameInput, {
     name: "attrObject.topLeftText",
     topo: topo
-  }))))));
+  })));
 }

package/es/core/editor/components/settings/propertyViews/box/BoxPropertyViewV1.js

@@ -0,0 +1,58 @@
+import _Form from "@alifd/next/es/form";
+import _Field from "@alifd/next/es/field";
+import _extends from "@babel/runtime/helpers/extends";
+import _Collapse from "@alifd/next/es/collapse";
+import React, { useEffect } from 'react';
+import useHtElement from "../../../../../common/hooks/useHtElement";
+import NameInput from "./NameInput";
+var CollapsePanel = _Collapse.Panel;
+
+function parseValues(values) {
+  return _extends({}, values);
+}
+
+export default function BoxPropertyView(props) {
+  var topo = props.topo,
+      values = props.values,
+      _onChange = props.onChange;
+  var boxNode = useHtElement({
+    topo: topo,
+    id: values.id
+  });
+
+  var field = _Field.useField({
+    autoUnmount: false,
+    values: parseValues(values),
+    onChange: function onChange(name, value) {
+      var newValues = field.getValues();
+
+      _onChange(name, value, newValues);
+
+      if (name === 'attrObject.topLeftText') {
+        // 修改框名称改变名称背景块大小
+        topo.getHtTopo().setRectangleText(boxNode);
+      }
+    }
+  });
+
+  useEffect(function () {
+    field.setValues(parseValues(values));
+  }, [values]);
+  return /*#__PURE__*/React.createElement(_Form, {
+    field: field,
+    labelAlign: "top"
+  }, /*#__PURE__*/React.createElement(_Form.Item, null, /*#__PURE__*/React.createElement(_Collapse, {
+    defaultExpandedKeys: ['标题区'],
+    style: {
+      border: 'none'
+    }
+  }, /*#__PURE__*/React.createElement(CollapsePanel, {
+    key: "\u6807\u9898\u533A",
+    title: "\u6807\u9898\u533A"
+  }, /*#__PURE__*/React.createElement(_Form.Item, {
+    label: "\u6807\u9898\u540D\u79F0"
+  }, /*#__PURE__*/React.createElement(NameInput, {
+    name: "attrObject.topLeftText",
+    topo: topo
+  }))))));
+}

package/es/core/editor/components/settings/propertyViews/box/NameInput.js

@@ -1,7 +1,7 @@
-import _Input from "@alifd/next/es/input";
 import _extends from "@babel/runtime/helpers/extends";
 import React, { useEffect, useState } from 'react';
-var NameInput = /*#__PURE__*/React.forwardRef(function (props, ref) {
+import NameInput from "../../common/NameInput";
+var BoxNameInput = /*#__PURE__*/React.forwardRef(function (props, ref) {
   var onChange = props.onChange,
       topo = props.topo;
 
@@ -33,12 +33,13 @@ var NameInput = /*#__PURE__*/React.forwardRef(function (props, ref) {
     topo.historyManager.endTransaction();
   };
 
-  return /*#__PURE__*/React.createElement(_Input, _extends({}, props, {
+  return /*#__PURE__*/React.createElement(NameInput, _extends({}, props, {
     ref: ref,
     value: value,
+    multipleLine: true,
     onChange: handleChange,
     onFocus: handleFocus,
     onBlur: handleBlur
   }));
 });
-export default NameInput;
+export default BoxNameInput;

package/es/core/editor/components/settings/propertyViews/edge/CommonEdgePropertyView.js

@@ -7,6 +7,7 @@ import rlog from "@riil-frontend/component-topology-utils/es/rlog";
 import React, { useEffect, useState } from "react";
 import ColorPicker from "../../../../../../common/components/ColorPicker";
 import LineType from "../../common/LineType";
+import addEdgeProps from "./addEdgeProps";
 var CollapsePanel = _Collapse.Panel;
 
 function parseValues(values, edge) {
@@ -16,7 +17,7 @@ function parseValues(values, edge) {
   });
 }
 
-export default function CommonEdgePropertyView(props) {
+function CommonEdgePropertyView(props) {
   var topo = props.topo,
       edge = props.edge,
       values = props.values,
@@ -41,8 +42,10 @@ export default function CommonEdgePropertyView(props) {
   }, [values]);
 
   var setLineColor = function setLineColor(color) {
-    var style = edge.a("styles") || {};
+    // 同时修改实线、虚线
     edge.s("edge.color", color);
+    edge.s("edge.dash.color", color);
+    var style = edge.a("styles") || {};
     edge.a("styles", _extends({}, style, {
       color: color
     }));
@@ -93,6 +96,10 @@ export default function CommonEdgePropertyView(props) {
     style: {
       width: "100%"
     },
+    onChange: function onChange(val) {
+      // 同时修改实线、虚线的线宽
+      edge.s('edge.dash.width', val);
+    },
     onFocus: function onFocus() {
       topo.historyManager.beginTransaction();
     },
@@ -121,4 +128,6 @@ export default function CommonEdgePropertyView(props) {
       }
     }
   })))), extraDisplaySetting))));
-}
+}
+
+export default addEdgeProps(CommonEdgePropertyView);

package/es/core/editor/components/settings/propertyViews/edge/EdgeGroupPropertyView.js

@@ -1,10 +1,9 @@
-import React, { useState, useEffect } from 'react';
+import React from 'react';
+import addEdgeProps from "./addEdgeProps";
 import EdgeGroupSetting from "./edgeGroup/EdgeGroupSetting";
-export default function EdgeGroupPropertyView(props) {
-  var topo = props.topo,
-      edge = props.edge,
-      values = props.values,
-      onChange = props.onChange,
-      editorProps = props.editorProps;
+
+function EdgeGroupPropertyView(props) {
   return /*#__PURE__*/React.createElement(EdgeGroupSetting, props);
-}
+}
+
+export default addEdgeProps(EdgeGroupPropertyView);

package/es/core/editor/components/settings/propertyViews/edge/EdgePropertyView.js

@@ -1,10 +1,8 @@
 import _extends from "@babel/runtime/helpers/extends";
-import React, { useState, useEffect, useRef, useCallback } from "react";
+import React, { useState, useEffect, useRef, useCallback } from 'react';
 import useHtElement from "../../../../../common/hooks/useHtElement";
-import CommonEdgePropertyView from "./CommonEdgePropertyView";
 import EdgeGroupPropertyView from "./EdgeGroupPropertyView";
 var commonViews = {
-  edge: CommonEdgePropertyView,
   edgeGroup: EdgeGroupPropertyView
 };
 /**
@@ -14,31 +12,19 @@ var commonViews = {
 export default function EdgePropertyViewRoute(props) {
   var topo = props.topo,
       values = props.values,
+      selectionElement = props.selectionElement,
       editorProps = props.editorProps;
-  var edge = useHtElement({
-    topo: topo,
-    id: values.id
-  });
+  var edge = selectionElement;
   var type;
 
-  if (edge.isEdgeGroupAgent()) {
-    if (editorProps.getEdgeGroupPropertyViewType) {
-      type = editorProps.getEdgeGroupPropertyViewType(_extends({}, props, {
-        edge: edge
-      }));
-    }
-
-    type = type || "edgeGroup";
-  } else {
-    if (editorProps.getEdgePropertyViewType) {
-      type = editorProps.getEdgePropertyViewType(_extends({}, props, {
-        edge: edge
-      }));
-    }
-
-    type = type || "edge";
+  if (editorProps.getEdgePropertyViewType) {
+    type = editorProps.getEdgePropertyViewType(_extends({}, props, {
+      edge: edge
+    }));
   }
 
+  type = type || 'edge';
+
   var views = _extends({}, commonViews, editorProps.edgePropertyViews || {});
 
   var View = views[type];

package/es/core/editor/components/settings/propertyViews/edge/addEdgeProps.js

@@ -0,0 +1,10 @@
+import _extends from "@babel/runtime/helpers/extends";
+import React from 'react';
+export default function addEdgeProps(Component) {
+  return function AdapterEdgeProps(props) {
+    var selectionElement = props.selectionElement;
+    return /*#__PURE__*/React.createElement(Component, _extends({}, props, {
+      edge: selectionElement
+    }));
+  };
+}

package/es/core/editor/components/settings/propertyViews/edge/edgeGroup/EdgeGroupSetting.js

@@ -13,13 +13,12 @@ function parseValues(values) {
 export default function EdgeGroupSetting(props) {
   var topo = props.topo,
       edge = props.edge,
-      values = props.values,
       _onChange = props.onChange,
       editorProps = props.editorProps;
 
   var field = _Field.useField({
     autoUnmount: false,
-    values: parseValues(values),
+    values: {},
     onChange: function onChange(name, value) {
       var newValues = field.getValues();
 
@@ -27,10 +26,6 @@ export default function EdgeGroupSetting(props) {
     }
   });
 
-  useEffect(function () {
-    field.setValues(parseValues(values));
-  }, [values]);
-
   var setLineColor = function setLineColor(color) {
     var style = edge.a('styles') || {};
     edge.s('edge.color', color);

package/es/core/editor/components/settings/propertyViews/group/GroupPropertyView.js

@@ -1,34 +1,26 @@
-import _Tab from "@alifd/next/es/tab";
 import _extends from "@babel/runtime/helpers/extends";
 import React from 'react';
-import TabView from "../../common/tab/TabView";
-import styles from "./GroupPropertyView.module.scss";
-import useGroup from "./hooks/useGroup";
-import GroupSetting from "./SettingTab/Setting";
-import GroupRelateData from "./DataTab/RelateData";
 import ClusterGroupRelateData from "./cluster/ClusterGroupRelateData";
+import GroupRelateData from "./DataTab/RelateData";
+import GroupBasicSetting from "./SettingTab/GroupBasicSetting";
+import styles from "./GroupPropertyView.module.scss";
 export default function GroupPropertyView(props) {
   var topo = props.topo,
       topoEdit = props.topoEdit,
       values = props.values,
-      onChange = props.onChange,
-      settingRuntimeState = props.settingRuntimeState,
-      editorProps = props.editorProps;
-  var group = useGroup({
-    topo: topo,
-    id: values.id
-  });
+      selectionElement = props.selectionElement;
+  var group = selectionElement;
   var isCluster = group.a('cluster');
   var DataTabContent = isCluster ? ClusterGroupRelateData : GroupRelateData;
-  return /*#__PURE__*/React.createElement(TabView, null, /*#__PURE__*/React.createElement(_Tab.Item, {
-    title: "\u6570\u636E",
-    key: "1"
-  }, /*#__PURE__*/React.createElement(DataTabContent, _extends({
+  return /*#__PURE__*/React.createElement("div", {
+    className: styles.GroupPropertyView
+  }, /*#__PURE__*/React.createElement(GroupBasicSetting, _extends({
     group: group
-  }, props))), /*#__PURE__*/React.createElement(_Tab.Item, {
-    title: "\u8BBE\u7F6E",
-    key: "2"
-  }, /*#__PURE__*/React.createElement(GroupSetting, _extends({
+  }, props, {
+    isCluster: isCluster
+  })), /*#__PURE__*/React.createElement("div", {
+    className: styles.data
+  }, /*#__PURE__*/React.createElement(DataTabContent, _extends({
     group: group
   }, props))));
 }

package/es/core/editor/components/settings/propertyViews/group/GroupPropertyView.module.scss

@@ -1,3 +1,10 @@
 .GroupPropertyView {
-  
+  height: 100%;
+  display: flex;
+  flex-direction: column;
+
+  .data {
+    flex: 1;
+    overflow: auto;
+  }
 }

package/es/core/editor/components/settings/propertyViews/group/GroupPropertyViewV1.js

@@ -0,0 +1,28 @@
+import _Tab from "@alifd/next/es/tab";
+import _extends from "@babel/runtime/helpers/extends";
+import React from 'react';
+import TabView from "../../common/tab/TabView";
+import styles from "./GroupPropertyView.module.scss";
+import GroupSetting from "./SettingTab/Setting";
+import GroupRelateData from "./DataTab/RelateData";
+import ClusterGroupRelateData from "./cluster/ClusterGroupRelateData";
+export default function GroupPropertyView(props) {
+  var topo = props.topo,
+      topoEdit = props.topoEdit,
+      values = props.values,
+      selectionElement = props.selectionElement;
+  var group = selectionElement;
+  var isCluster = group.a('cluster');
+  var DataTabContent = isCluster ? ClusterGroupRelateData : GroupRelateData;
+  return /*#__PURE__*/React.createElement(TabView, null, /*#__PURE__*/React.createElement(_Tab.Item, {
+    title: "\u6570\u636E",
+    key: "1"
+  }, /*#__PURE__*/React.createElement(DataTabContent, _extends({
+    group: group
+  }, props))), /*#__PURE__*/React.createElement(_Tab.Item, {
+    title: "\u8BBE\u7F6E",
+    key: "2"
+  }, /*#__PURE__*/React.createElement(GroupSetting, _extends({
+    group: group
+  }, props))));
+}

package/es/core/editor/components/settings/propertyViews/group/SettingTab/GroupBasicSetting.js

@@ -0,0 +1,75 @@
+import _Form from "@alifd/next/es/form";
+import _extends from "@babel/runtime/helpers/extends";
+import _Field from "@alifd/next/es/field";
+import _Collapse from "@alifd/next/es/collapse";
+import React, { useEffect } from "react";
+import NodeSizeInput from "../../../common/NodeSizeInput/NodeSizeInput";
+import GroupIconSelect from "./GroupIconSelect";
+import GroupExpandStatus from "./GroupExpandStatus";
+import GroupExpandSetting from "./GroupExpandSetting";
+import { SPECIAL_CHARACTER_FORM_ITEM_VALIDATE_PROPS, validateSpecialCharacter } from "../../../../../../../utils/SpecialCharacterValidateUtil";
+import NameInput from "../../../common/NameInput";
+var CollapsePanel = _Collapse.Panel;
+export default function GroupBasicSetting(props) {
+  var topo = props.topo,
+      topoEdit = props.topoEdit,
+      values = props.values,
+      _onChange = props.onChange,
+      settingRuntimeState = props.settingRuntimeState,
+      editorProps = props.editorProps,
+      group = props.group,
+      isCluster = props.isCluster;
+  var expanded = values.expanded;
+  var id = values.id;
+
+  var field = _Field.useField({
+    autoUnmount: false,
+    values: values,
+    onChange: function onChange(name, value) {
+      if (name === 'attrObject.name' && !validateSpecialCharacter(value)) {
+        return;
+      }
+
+      var newValues = field.getValues();
+
+      _onChange(name, value, newValues);
+    }
+  });
+
+  useEffect(function () {
+    field.setValues(values);
+  }, [values]);
+  return /*#__PURE__*/React.createElement(_Form, {
+    field: field,
+    labelAlign: "top",
+    style: {
+      paddingLeft: 32,
+      paddingRight: 16,
+      marginTop: 12
+    }
+  }, /*#__PURE__*/React.createElement(_Form.Item, null, /*#__PURE__*/React.createElement(_Form.Item, _extends({
+    label: isCluster ? '集群名称' : '区域名称'
+  }, SPECIAL_CHARACTER_FORM_ITEM_VALIDATE_PROPS, {
+    patternTrigger: "onChange"
+  }), /*#__PURE__*/React.createElement(NameInput, {
+    name: "attrObject.name",
+    multipleLine: true,
+    maxLength: 30,
+    placeholder: "\u8BF7\u8F93\u5165",
+    onFocus: function onFocus() {
+      topo.historyManager.beginTransaction();
+    },
+    onBlur: function onBlur() {
+      topo.historyManager.endTransaction();
+    }
+  })), /*#__PURE__*/React.createElement(_Form.Item, {
+    label: "\u9ED8\u8BA4\u663E\u793A\u65B9\u5F0F"
+  }, /*#__PURE__*/React.createElement(GroupExpandStatus, {
+    topo: topo,
+    group: group,
+    expanded: expanded,
+    setExpanded: function setExpanded(val) {
+      return group.setExpanded(val);
+    }
+  }))));
+}

package/es/core/editor/components/settings/propertyViews/group/SettingTab/GroupExpandSetting.js

@@ -1,6 +1,6 @@
 import _Form from "@alifd/next/es/form";
 import _Collapse from "@alifd/next/es/collapse";
-import React, { useState, useEffect, useRef, useCallback } from "react";
+import React, { useState, useEffect, useRef, useCallback } from 'react';
 import GroupExpandStatus from "./GroupExpandStatus";
 import AlignSetting from "../../../common/AlignSetting";
 import LayoutSettings from "../../../common/LayoutSettings"; // import NodeIconSelect from '../../node/NodeIconSelect';
@@ -23,15 +23,17 @@ export default function GroupExpandSetting(props) {
     topo.historyManager.beginTransaction(); // console.log("setAlignmentBySelectionNodes", v);
     // topo.view.topoClient.htTopoClient.setAlignmentBySelectionNodes(v);
 
-    onChange("groupAlign", v); // topoEditApi.setAlignmentBySelectionNodes(v);
+    onChange('groupAlign', v); // topoEditApi.setAlignmentBySelectionNodes(v);
 
     topo.historyManager.endTransaction();
   };
 
-  var layoutOnChange = function layoutOnChange(v) {
+  var layoutOnChange = function layoutOnChange(value) {
     topo.historyManager.beginTransaction();
-    setLayout(v);
-    onChange("layout", v);
+    setLayout(value); // onChange("layout", v);
+
+    var layouType = value.id === 'toward' ? "" + value.id + value.options.subId : value.id;
+    topo.getHtTopo().layoutInContainer(layouType);
     topo.historyManager.endTransaction();
   };
 
@@ -40,9 +42,9 @@ export default function GroupExpandSetting(props) {
     setLayout({}); // onChange("layout", {});
   }, [id]);
   return /*#__PURE__*/React.createElement(_Collapse, {
-    defaultExpandedKeys: ["布局", "显示设置", "对齐方式"],
+    defaultExpandedKeys: ['布局', '显示设置', '对齐方式'],
     style: {
-      border: "none"
+      border: 'none'
     }
   }, /*#__PURE__*/React.createElement(CollapsePanel, {
     key: "\u5E03\u5C40",
@@ -71,13 +73,5 @@ export default function GroupExpandSetting(props) {
     setExpanded: function setExpanded(val) {
       return group.setExpanded(val);
     }
-  }))), /*#__PURE__*/React.createElement(CollapsePanel, {
-    key: "\u5BF9\u9F50\u65B9\u5F0F",
-    title: "\u5BF9\u9F50\u65B9\u5F0F"
-  }, /*#__PURE__*/React.createElement(_Form.Item, {
-    label: ""
-  }, /*#__PURE__*/React.createElement(AlignSetting, {
-    onChange: alignOnChange,
-    selected: "left"
   }))));
 }

package/es/core/editor/components/settings/propertyViews/group/cluster/ClusterGroupRelateData.js

@@ -1,10 +1,10 @@
 import _Collapse from "@alifd/next/es/collapse";
 import _Form from "@alifd/next/es/form";
 import React, { useEffect } from 'react';
+import NoDataPage from '@riil-frontend/component-no-data-page';
 import GroupNodeList from "../DataTab/GroupNodeList";
 import CollapsePanel from "../../../../../../../components/collapse/Panel";
 import NodeRelateResourceButton from "../../node/data/NodeRelateResourceButton";
-import NoDataPage from '@riil-frontend/component-no-data-page';
 import CollapseFullheightStyles from "../../../common/GroupNodeList/CollapseFullheight.module.scss";
 import textStyles from "../../../../../../common/text.module.scss";
 export default function ClusterGroupRelateData(props) {
@@ -44,12 +44,13 @@ export default function ClusterGroupRelateData(props) {
     key: "\u76F8\u5173\u8D44\u6E90",
     title: "\u76F8\u5173\u8D44\u6E90"
   }, /*#__PURE__*/React.createElement(_Form, {
-    labelAlign: "top"
-  }, /*#__PURE__*/React.createElement(_Form.Item, {
-    label: "\u5173\u8054\u8D44\u6E90",
+    labelAlign: "top",
     style: {
-      marginBottom: 4
+      marginTop: -4,
+      marginBottom: -12
     }
+  }, /*#__PURE__*/React.createElement(_Form.Item, {
+    label: "\u5173\u8054\u8D44\u6E90"
   }, /*#__PURE__*/React.createElement("div", {
     style: {
       display: 'flex'
@@ -59,7 +60,8 @@ export default function ClusterGroupRelateData(props) {
     style: {
       flex: 1,
       paddingRight: 16,
-      color: '#4D6277'
+      color: '#4D6277',
+      lineHeight: '20px'
     },
     title: values.tag ? values.name : null
   }, values.tag ? values.name : '—'), /*#__PURE__*/React.createElement(NodeRelateResourceButton, {

package/es/core/editor/components/settings/propertyViews/index.js

@@ -1,19 +1,17 @@
 import NodePropertyView from "./node/NodePropertyView";
 import LayerPropertyView from "./layer/LayerPropertyView";
 import TextPropertyView from "./text/TextPropertyView";
-import ViewPropertyView from "./view/ViewPropertyView";
 import GroupPropertyView from "./group/GroupPropertyView";
-import MultipleElementPropertyView from "./multipleElements/MultipleElementPropertyView";
-import EdgePropertyView from "./edge/EdgePropertyView";
 import BoxPropertyView from "./box/BoxPropertyView";
 var propertyPanelMap = {
-  view: ViewPropertyView,
+  // view: ViewPropertyView,
   group: GroupPropertyView,
   node: NodePropertyView,
-  edge: EdgePropertyView,
+  // edge: EdgePropertyView,
+  // edgeGroup: EdgeGroupPropertyView,
   layer: LayerPropertyView,
   text: TextPropertyView,
-  multiple: MultipleElementPropertyView,
+  // multiple: MultipleElementPropertyView,
   box: BoxPropertyView
 };