@riil-frontend/component-topology 11.0.29 → 11.0.30

package/es/core/editor/components/Toolbar/widgets/components/textStyleSetting/GlobalTagStyleSetting/globalTag.js

@@ -1,7 +1,7 @@
 import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/objectWithoutPropertiesLoose";
 import _extends from "@babel/runtime/helpers/extends";
 var _excluded = ["color", "background", "opacity"],
-  _excluded2 = ["color", "background", "opacity", "bold", "italic", "underline"];
+    _excluded2 = ["color", "background", "opacity", "bold", "italic", "underline"];
 import fontStyleUtil from "../../../../../settings/common/text/fontStyleUtil";
 import { formatBackgroundRgbaColor, parseBackground, formatRgbaColor } from "../ElementTextStyleSetting/colorUtil";
 var defaultStyle = {
@@ -22,13 +22,17 @@ export function useValues(topo) {
 }
 export var setGlobalTagStyle = function setGlobalTagStyle(topo, styleData) {
   var _topo$store$getModel = topo.store.getModel('displayConfig'),
-    displayConfigState = _topo$store$getModel[0],
-    displayConfigDispatchers = _topo$store$getModel[1];
+      displayConfigState = _topo$store$getModel[0],
+      displayConfigDispatchers = _topo$store$getModel[1];
+
   var nodeLabelStyle = displayConfigState.nodeLabelStyle,
-    defaultEdgeLabelStyle = displayConfigState.defaultEdgeLabelStyle;
+      defaultEdgeLabelStyle = displayConfigState.defaultEdgeLabelStyle;
   var style = buildStyle(styleData, nodeLabelStyle);
+
   var globalNodeLabelStyle = _extends({}, nodeLabelStyle, style);
+
   var globalEdgeTagStyle = _extends({}, nodeLabelStyle, defaultEdgeLabelStyle, style);
+
   displayConfigDispatchers.update({
     nodeLabelStyle: globalNodeLabelStyle,
     defaultEdgeLabelStyle: globalEdgeTagStyle
@@ -37,49 +41,64 @@ export var setGlobalTagStyle = function setGlobalTagStyle(topo, styleData) {
   topo.getHtTopo().setGlobalNodeLabelStyle(styles);
   topo.getHtTopo().setGlobalEdgeTagStyle(styles);
 };
+
 function buildStyle(styleData, prevTagStyle) {
   var color = styleData.color,
-    background = styleData.background,
-    opacity = styleData.opacity,
-    otherStyle = _objectWithoutPropertiesLoose(styleData, _excluded);
+      background = styleData.background,
+      opacity = styleData.opacity,
+      otherStyle = _objectWithoutPropertiesLoose(styleData, _excluded);
+
   var style = _extends({}, prevTagStyle, otherStyle);
+
   if ('color' in styleData) {
     style.color = color.hex;
   }
+
   if ('background' in styleData || 'opacity' in styleData) {
     var prevBackgroundStyle = parseBackground(prevTagStyle === null || prevTagStyle === void 0 ? void 0 : prevTagStyle.background);
     style.background = formatBackgroundRgbaColor(prevBackgroundStyle, styleData);
   }
+
   return style;
 }
+
 function buildGlobalStyle(styleData) {
   var color = styleData.color,
-    background = styleData.background,
-    opacity = styleData.opacity,
-    bold = styleData.bold,
-    italic = styleData.italic,
-    underline = styleData.underline,
-    otherStyle = _objectWithoutPropertiesLoose(styleData, _excluded2);
+      background = styleData.background,
+      opacity = styleData.opacity,
+      bold = styleData.bold,
+      italic = styleData.italic,
+      underline = styleData.underline,
+      otherStyle = _objectWithoutPropertiesLoose(styleData, _excluded2);
+
   var tagStyle = _extends({}, otherStyle);
+
   if ('color' in styleData) {
     tagStyle.color = color.hex;
   }
+
   if ('bold' in styleData) {
     tagStyle.fontBold = bold;
   }
+
   if ('italic' in styleData) {
     tagStyle.fontItalic = italic;
   }
+
   if ('underline' in styleData) {
     tagStyle.fontUnderline = underline;
   }
+
   if ('background' in styleData) {
     // 背景颜色
     tagStyle.background = formatRgbaColor(background);
   }
+
   if ('opacity' in styleData) {
     tagStyle.opacity = opacity;
   }
+
   return tagStyle;
 }
+
 export function setStyle() {}

package/es/core/editor/components/Toolbar/widgets/components/textStyleSetting/textStyleSettingRouter.js

@@ -2,6 +2,7 @@ import _extends from "@babel/runtime/helpers/extends";
 import React from 'react';
 import ElementTextStyleSetting from "./ElementTextStyleSetting/ElementTextStyleSetting";
 import GlobalTagStyleSetting from "./GlobalTagStyleSetting/GlobalTagStyleSetting";
+
 function textStyleSettingRouter(Component, options) {
   var names = (options === null || options === void 0 ? void 0 : options.names) || [];
   return function TextStyleSettingButton(props) {
@@ -15,4 +16,5 @@ function textStyleSettingRouter(Component, options) {
     }));
   };
 }
+
 export default textStyleSettingRouter;

package/es/core/editor/components/plugins/AddElementThemePlugin.js

@@ -1,9 +1,11 @@
 import React from 'react';
 import useNewElementTheme from "../../hooks/useNewElementTheme";
+
 function AddElementThemePlugin(props) {
   useNewElementTheme({
     topo: props.topo
   });
   return null;
 }
+
 export default AddElementThemePlugin;

package/es/core/editor/components/plugins/CorePlugin.js

@@ -1,11 +1,12 @@
 import React from 'react';
 import useKeyboardShortcut from "../../hooks/useKeyboardShortcut";
 import useUpdateHtTopoDefaultTagStyle from "../../hooks/useUpdateHtTopoDefaultTagStyle";
+
 function CorePlugin(props) {
   var topo = props.topo,
-    topoContext = props.topoContext,
-    topoEdit = props.topoEdit,
-    editorProps = props.editorProps;
+      topoContext = props.topoContext,
+      topoEdit = props.topoEdit,
+      editorProps = props.editorProps;
   useKeyboardShortcut({
     topo: topo,
     topoEdit: topoEdit
@@ -15,4 +16,5 @@ function CorePlugin(props) {
   });
   return null;
 }
+
 export default CorePlugin;

package/es/core/editor/components/plugins/SaveLoading.js

@@ -3,9 +3,11 @@ import React, { useState, useEffect, useRef, useCallback } from 'react';
 export default function SaveLoading(props) {
   var topo = props.topo;
   var store = topo.store;
+
   var _store$useModel = store.useModel('topoEdit'),
-    topoEditState = _store$useModel[0],
-    topoEditDispatchers = _store$useModel[1];
+      topoEditState = _store$useModel[0],
+      topoEditDispatchers = _store$useModel[1];
+
   return /*#__PURE__*/React.createElement(_Loading, {
     visible: topoEditState.saving,
     fullScreen: true

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

@@ -2,11 +2,12 @@ import _ConfigProvider from "@alifd/next/es/config-provider";
 import _Icon from "@alifd/next/es/icon";
 import React from 'react';
 import styles from "./CloseablePanel.module.scss";
+
 function CloseablePanel(props) {
   var prefix = props.prefix,
-    title = props.title,
-    onClose = props.onClose,
-    children = props.children;
+      title = props.title,
+      onClose = props.onClose,
+      children = props.children;
   return /*#__PURE__*/React.createElement("div", {
     className: styles.panel
   }, /*#__PURE__*/React.createElement("div", {
@@ -25,6 +26,7 @@ function CloseablePanel(props) {
     className: styles.body
   }, children));
 }
+
 CloseablePanel.defaultProps = {
   prefix: 'next-'
 };

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

@@ -5,48 +5,57 @@ import { adapterGetEdgePropertyViewType, addEdgePropertyViews } from "./core/edg
 import PropertyViewManager from "./core/PropertyViewManager";
 import Settings from "./Settings";
 import styles from "./Settings.module.scss";
+
 function PropertyViewProvider(props) {}
+
 export default function PropertyPanel(props) {
   var _editorProps$property, _editorProps$property2, _classNames;
+
   var topo = props.topo,
-    editorProps = props.editorProps;
+      editorProps = props.editorProps;
   var store = topo.store;
   var topoState = store.useModelState('topoMod');
   var topoShowType = topoState.type,
-    graphLoaded = topoState.graphLoaded;
+      graphLoaded = topoState.graphLoaded;
+
   var _store$useModelState = store.useModelState('selection'),
-    selection = _store$useModelState.selection;
+      selection = _store$useModelState.selection;
+
   var topoEditState = topo.store.useModelState('topoEdit');
   var propertyPanelVisible = topoEditState.propertyPanelVisible;
   var propertyViewManager = useMemo(function () {
     return new PropertyViewManager(topo);
   }, []);
   propertyViewManager.addViews((_editorProps$property = editorProps.propertyView) === null || _editorProps$property === void 0 ? void 0 : _editorProps$property.views);
+
   propertyViewManager.customGetViewType = ((_editorProps$property2 = editorProps.propertyView) === null || _editorProps$property2 === void 0 ? void 0 : _editorProps$property2.getPropertyViewType) || function (elements) {
     return adapterGetEdgePropertyViewType(elements, editorProps);
-  };
-  // 临时适配连线属性面板类型，后期组件支持自定义适配
+  }; // 临时适配连线属性面板类型，后期组件支持自定义适配
+
+
   addEdgePropertyViews(propertyViewManager, editorProps);
   var PropertyView = propertyViewManager.getPropertyView();
   useEffect(function () {
     if (graphLoaded) {
       propertyViewManager.init();
     }
+
     return function () {
       propertyViewManager.destroy();
     };
-  }, [graphLoaded, propertyViewManager]);
+  }, [graphLoaded, propertyViewManager]); // 没有视图关闭属性面板
 
-  // 没有视图关闭属性面板
   useEffect(function () {
     if (propertyPanelVisible && !PropertyView) {
       propertyViewManager.close();
     }
   }, [propertyPanelVisible, PropertyView, propertyViewManager]);
+
   var renderContent = function renderContent() {
     if (!propertyPanelVisible || !PropertyView) {
       return null;
     }
+
     return /*#__PURE__*/React.createElement(Settings, {
       topo: topo,
       selection: selection,
@@ -56,6 +65,7 @@ export default function PropertyPanel(props) {
       editorProps: editorProps
     });
   };
+
   return /*#__PURE__*/React.createElement("div", {
     className: classNames(styles.propertyPanel, (_classNames = {}, _classNames[styles.hide] = !propertyPanelVisible, _classNames))
   }, /*#__PURE__*/React.createElement(CloseablePanel, {

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

@@ -3,8 +3,10 @@ import React, { useEffect, useMemo, useState } from 'react';
 import useSettingRuntimeState from "./useSettingRuntimeState";
 import updateElementProperty from "./core/updateElementProperty";
 import { isEdge } from "../../../../utils/htElementUtils";
+
 function buildElementValues(selection) {
   var values = _extends({}, selection[0]);
+
   var attrTypes = ['attrObject', 'position', 'styleMap'];
   attrTypes.forEach(function (type) {
     Object.keys(values[type] || {}).forEach(function (key) {
@@ -13,22 +15,24 @@ function buildElementValues(selection) {
   });
   return values;
 }
+
 export default function PropertyViewContainer(props) {
   var topo = props.topo,
-    topoShowType = props.topoShowType,
-    topoEditApi = props.topoEditApi,
-    selection = props.selection,
-    editorProps = props.editorProps,
-    PropertyView = props.PropertyView;
+      topoShowType = props.topoShowType,
+      topoEditApi = props.topoEditApi,
+      selection = props.selection,
+      editorProps = props.editorProps,
+      PropertyView = props.PropertyView;
   var settingRuntimeState = useSettingRuntimeState();
   var selectionElements = useMemo(function () {
     return topo.selectionModel.getSelection();
-  }, [selection]);
-  // 不建议使用，直接使用ht元素对象。待优化
+  }, [selection]); // 不建议使用，直接使用ht元素对象。待优化
+
   var singleElementValues = useMemo(function () {
     return selection.length === 1 ? buildElementValues(selection) : undefined;
   }, [selection]);
   var elementProps = {};
+
   if (selection.length === 1) {
     var element = selectionElements[0];
     elementProps = {
@@ -36,10 +40,12 @@ export default function PropertyViewContainer(props) {
       selectionElement: element,
       values: singleElementValues
     };
+
     if (isEdge(element)) {
       elementProps.edge = element;
     }
   }
+
   return /*#__PURE__*/React.createElement(PropertyView, _extends({
     topo: topo,
     selection: selection,

package/es/core/editor/components/settings/common/AddResourceButton.js

@@ -2,9 +2,11 @@ import _Button from "@alifd/next/es/button";
 import React from 'react';
 export default function AddResourceButton(props) {
   var onClick = props.onClick;
+
   var handleClick = function handleClick(e) {
     onClick();
   };
+
   return /*#__PURE__*/React.createElement(_Button, {
     text: true,
     type: "primary",

package/es/core/editor/components/settings/common/AlignSetting/AlignTypeList.js

@@ -40,26 +40,29 @@ var TREE_LAYOUT_OPTIONS = [{
   label: '纵向分布',
   icon: 'tuopu_chuizhidengjianjuduiqi'
 }];
+
 var AlignTypeList = function AlignTypeList(props) {
   var _props$selected = props.selected,
-    selected = _props$selected === void 0 ? 'left' : _props$selected,
-    onChange = props.onChange,
-    distributionDisabled = props.distributionDisabled,
-    onMouseMove = props.onMouseMove,
-    onMouseLeave = props.onMouseLeave;
+      selected = _props$selected === void 0 ? 'left' : _props$selected,
+      onChange = props.onChange,
+      distributionDisabled = props.distributionDisabled,
+      onMouseMove = props.onMouseMove,
+      onMouseLeave = props.onMouseLeave;
+
   var _useState = useState(selected),
-    value = _useState[0],
-    setValue = _useState[1];
+      value = _useState[0],
+      setValue = _useState[1];
+
   var handleChange = function handleChange(data) {
     // console.log("handleChange", data);
     onChange && onChange(data.value);
-    setValue(data.value);
-    // setValue(data)
+    setValue(data.value); // setValue(data)
   };
 
   var onMouseMoveChange = function onMouseMoveChange(data) {
     onMouseMove && onMouseMove(data.value);
   };
+
   return /*#__PURE__*/React.createElement("div", {
     className: styles.AlignSetting
   }, TREE_LAYOUT_OPTIONS.map(function (item, index, array) {
@@ -77,8 +80,7 @@ var AlignTypeList = function AlignTypeList(props) {
         onMouseLeave: onMouseLeave,
         onClick: function onClick() {
           handleChange(item);
-        }
-        // eslint-disable-next-line no-unneeded-ternary
+        } // eslint-disable-next-line no-unneeded-ternary
         ,
         disabled: (item.value === 'distributeHorizontal' || item.value === 'distributeVertical') && distributionDisabled
       }, /*#__PURE__*/React.createElement(_Icon, {
@@ -91,4 +93,5 @@ var AlignTypeList = function AlignTypeList(props) {
     }, item.label);
   }));
 };
+
 export default AlignTypeList;

package/es/core/editor/components/settings/common/AlignSetting/index.js

@@ -3,13 +3,16 @@ import { isEdge, isLayer } from "../../../../../../utils/htElementUtils";
 import AlignTypeList from "./AlignTypeList";
 export default function AlignSetting(props) {
   var topo = props.topo,
-    distributionDisabled = props.distributionDisabled;
+      distributionDisabled = props.distributionDisabled;
+
   var _useState = useState(false),
-    ifMouseMove = _useState[0],
-    setIfMouseMove = _useState[1];
+      ifMouseMove = _useState[0],
+      setIfMouseMove = _useState[1];
+
   var onMouseMove = function onMouseMove(data) {
     if (!ifMouseMove) {
       var _topo$historyManager, _topo$historyManager2;
+
       var selection = topo.getHtTopo().getGraphView().getSelectionModel().getSelection().toArray();
       var nodes = selection.filter(function (ele) {
         return !isLayer(ele) && !isEdge(ele);
@@ -20,24 +23,27 @@ export default function AlignSetting(props) {
       setIfMouseMove(true);
     }
   };
+
   var onMouseLeave = function onMouseLeave() {
     var _topo$historyManager3, _topo$historyManager4;
+
     (_topo$historyManager3 = topo.historyManager) === null || _topo$historyManager3 === void 0 ? void 0 : _topo$historyManager3.setDisabled(true, '加载标注');
     topo.view.topoClient.htTopoClient.removePreviewAlignmentBySelectionNodes();
     (_topo$historyManager4 = topo.historyManager) === null || _topo$historyManager4 === void 0 ? void 0 : _topo$historyManager4.setDisabled(false, '加载标注');
     setIfMouseMove(false);
   };
+
   var alignOnChange = function alignOnChange(type) {
     topo.historyManager.beginTransaction();
     var selection = topo.getHtTopo().getGraphView().getSelectionModel().getSelection().toArray();
     var nodes = selection.filter(function (ele) {
       return !isLayer(ele) && !isEdge(ele);
-    });
+    }); // console.info("element--selectList", element, selectList);
 
-    // console.info("element--selectList", element, selectList);
     topo.view.topoClient.htTopoClient.setAlignmentBySelectionNodes(type, nodes);
     topo.historyManager.endTransaction();
   };
+
   return /*#__PURE__*/React.createElement(AlignTypeList, {
     onChange: alignOnChange,
     selected: "left",

package/es/core/editor/components/settings/common/GroupNodeList/ResourceList.js

@@ -5,10 +5,12 @@ import classNames from 'classnames';
 import NoDataPage from '@riil-frontend/component-no-data-page';
 import styles from "./ResourceList.module.scss";
 import textStyles from "../../../../../common/text.module.scss";
+
 function ResourceList(props) {
   var data = props.data,
-    showRemove = props.showRemove,
-    onRemove = props.onRemove;
+      showRemove = props.showRemove,
+      onRemove = props.onRemove;
+
   var renderIcon = function renderIcon(src) {
     return /*#__PURE__*/React.createElement("div", {
       style: {
@@ -18,6 +20,7 @@ function ResourceList(props) {
       }
     });
   };
+
   var renderIcon2 = function renderIcon2(src) {
     return /*#__PURE__*/React.createElement("div", {
       className: styles.iconWarp
@@ -27,10 +30,12 @@ function ResourceList(props) {
       alt: ""
     }));
   };
+
   var renderRemoveButton = function renderRemoveButton(data) {
     if (!showRemove) {
       return null;
     }
+
     return /*#__PURE__*/React.createElement("div", {
       className: styles.listItemExtra,
       onClick: function onClick() {
@@ -41,9 +46,11 @@ function ResourceList(props) {
       text: true
     }, "\u79FB\u51FA"));
   };
+
   if (!data.length) {
     return /*#__PURE__*/React.createElement(NoDataPage, null);
   }
+
   return /*#__PURE__*/React.createElement("div", {
     className: styles.list
   }, /*#__PURE__*/React.createElement(_List, {
@@ -61,4 +68,5 @@ function ResourceList(props) {
     }
   }));
 }
+
 export default ResourceList;

package/es/core/editor/components/settings/common/LayoutSettings.js

@@ -6,10 +6,9 @@ import styles from "./LayoutSettings.module.scss";
 var LAYOUTS = {
   circular: "星型布局",
   hierarchical: "均衡布局",
-  toward: "树形布局"
-  // rectangle: '矩形布局',
-};
+  toward: "树形布局" // rectangle: '矩形布局',
 
+};
 var TREE_LAYOUT_OPTIONS = [{
   value: "east",
   label: "横向"
@@ -17,34 +16,37 @@ var TREE_LAYOUT_OPTIONS = [{
   value: "south",
   label: "纵向"
 }];
+
 var LayoutSettings = function LayoutSettings(props) {
   var _props$layout = props.layout,
-    layout = _props$layout === void 0 ? {} : _props$layout,
-    onChange = props.onChange,
-    regionId = props.regionId,
-    size = props.size;
+      layout = _props$layout === void 0 ? {} : _props$layout,
+      onChange = props.onChange,
+      regionId = props.regionId,
+      size = props.size;
   var layoutId = layout.id,
-    layoutOptions = layout.options;
-
-  // const [value, setValue] = useState();
+      layoutOptions = layout.options; // const [value, setValue] = useState();
 
   var handleChange = function handleChange(data) {
     onChange && onChange(data);
   };
+
   var onLayoutSelect = function onLayoutSelect(id) {
     // console.log("onLayoutSelect", id, layout, value);
     var options;
+
     if (id === "toward") {
       options = {
         subId: TREE_LAYOUT_OPTIONS[0].value
       };
-    }
-    // setValue(id);
+    } // setValue(id);
+
+
     handleChange({
       id: id,
       options: options
     });
   };
+
   var layoutGroup = Object.keys(LAYOUTS).map(function (id) {
     return {
       id: id,
@@ -91,4 +93,5 @@ var LayoutSettings = function LayoutSettings(props) {
     }
   })) : null);
 };
+
 export default LayoutSettings;

package/es/core/editor/components/settings/common/LineType/index.js

@@ -3,10 +3,12 @@ import { getEdgesBySelection, setEdgesType } from "../../../../utils/edgeTypeSty
 import LineType from "../../../Toolbar/widgets/EdgeTypeButton/LineType";
 export default function LineTypeSetting(props) {
   var topo = props.topo;
+
   var setLineType = function setLineType(type) {
     var edges = getEdgesBySelection(topo);
     setEdgesType(edges, type, topo);
   };
+
   return /*#__PURE__*/React.createElement(LineType, {
     onChange: setLineType,
     topo: topo

package/es/core/editor/components/settings/common/NameInput.js

@@ -5,7 +5,8 @@ var _excluded = ["multipleLine"];
 import React from 'react';
 var NameInput = /*#__PURE__*/React.forwardRef(function (props, ref) {
   var multipleLine = props.multipleLine,
-    inputProps = _objectWithoutPropertiesLoose(props, _excluded);
+      inputProps = _objectWithoutPropertiesLoose(props, _excluded);
+
   if (multipleLine) {
     return /*#__PURE__*/React.createElement(_Input.TextArea, _extends({
       ref: ref,
@@ -15,6 +16,7 @@ var NameInput = /*#__PURE__*/React.forwardRef(function (props, ref) {
       }
     }, inputProps));
   }
+
   return /*#__PURE__*/React.createElement(_Input, _extends({
     ref: ref
   }, inputProps));