@riil-frontend/component-topology 6.0.0-alpha.8 → 6.0.1

package/lib/core/editor/components/Toolbar/widgets/components/textStyleSetting/ElementTextStyleSetting/elements/groupTitle.js

@@ -0,0 +1,88 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+exports.__esModule = true;
+exports["default"] = void 0;
+exports.getEnabledFields = getEnabledFields;
+exports.getFieldDisabled = getFieldDisabled;
+exports.getTextStyle = getTextStyle;
+exports.setTextStyle = setTextStyle;
+
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+
+var _fontStyleUtil = _interopRequireDefault(require("../../../../../../settings/common/text/fontStyleUtil"));
+
+var _colorUtil = require("../colorUtil");
+
+var _nodeTag = _interopRequireDefault(require("./nodeTag"));
+
+function getTextStyle(element) {
+  if (!element.isExpanded()) {
+    // eslint-disable-next-line import/no-named-as-default-member
+    return _nodeTag["default"].getTextStyle(element);
+  }
+
+  var underline = element.s('text.decoration') === 'underline';
+
+  var font = _fontStyleUtil["default"].toMap(element.s('group.title.font'));
+
+  return (0, _extends2["default"])({
+    color: (0, _colorUtil.parseColor)(element.s('group.title.color')),
+    underline: underline
+  }, _fontStyleUtil["default"].toMap(element.s('group.title.font')), {
+    fontSize: font.fontSize || 12,
+    fontFamily: font.fontFamily || '微软雅黑'
+  }, (0, _colorUtil.parseBackground)(element.s('group.title.background')));
+}
+
+function setTextStyle(element, style, topo) {
+  if (!element.isExpanded()) {
+    // eslint-disable-next-line import/no-named-as-default-member
+    return _nodeTag["default"].setTextStyle(element, style, topo);
+  } // if ('underline' in style) {
+  // }
+
+
+  if ('color' in style) {
+    element.s('group.title.color', style.color.hex);
+  }
+
+  if ('background' in style || 'opacity' in style) {
+    // 背景颜色
+    var prevStyle = getTextStyle(element);
+    element.s('group.title.background', (0, _colorUtil.formatBackgroundRgbaColor)(prevStyle, style));
+  }
+
+  var fontStyle = (0, _extends2["default"])({}, getTextStyle(element), style);
+
+  var fontStr = _fontStyleUtil["default"].build(fontStyle);
+
+  element.s('group.title.font', fontStr);
+}
+
+function getEnabledFields(element) {
+  if (!element.isExpanded()) {
+    return ['fontFamily', 'fontSize', 'color', 'background', 'opacity'];
+  }
+
+  return ['fontFamily', 'fontSize', 'bold', 'italic', 'color', 'background', 'opacity'];
+}
+
+function getFieldDisabled(element) {
+  if (!element.isExpanded()) {
+    return {
+      fontSize: true
+    };
+  }
+
+  return {};
+}
+
+var _default = {
+  getTextStyle: getTextStyle,
+  setTextStyle: setTextStyle,
+  getEnabledFields: getEnabledFields,
+  getFieldDisabled: getFieldDisabled
+};
+exports["default"] = _default;

package/lib/core/editor/components/Toolbar/widgets/components/textStyleSetting/ElementTextStyleSetting/elements/index.js

@@ -0,0 +1,28 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+exports.__esModule = true;
+exports["default"] = void 0;
+
+var _text = _interopRequireDefault(require("./text"));
+
+var _nodeTag = _interopRequireDefault(require("./nodeTag"));
+
+var _edgeTag = _interopRequireDefault(require("./edgeTag"));
+
+var _groupTitle = _interopRequireDefault(require("./groupTitle"));
+
+var _layerTitle = _interopRequireDefault(require("./layerTitle"));
+
+var _box = _interopRequireDefault(require("./box"));
+
+var _default = {
+  nodeTag: _nodeTag["default"],
+  edgeTag: _edgeTag["default"],
+  text: _text["default"],
+  groupTitle: _groupTitle["default"],
+  layerTitle: _layerTitle["default"],
+  box: _box["default"]
+};
+exports["default"] = _default;

package/lib/core/editor/components/Toolbar/widgets/components/textStyleSetting/ElementTextStyleSetting/elements/layerTitle.js

@@ -0,0 +1,90 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+exports.__esModule = true;
+exports["default"] = void 0;
+exports.getEnabledFields = getEnabledFields;
+exports.getTextStyle = getTextStyle;
+exports.setTextStyle = setTextStyle;
+
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+
+var _fontStyleUtil = _interopRequireDefault(require("../../../../../../settings/common/text/fontStyleUtil"));
+
+var _colorUtil = require("../colorUtil");
+
+var defaultStyle = {
+  color: '#4D6277',
+  font: '10px 微软雅黑',
+  background: '#E4E9EE'
+};
+
+function getLabelStyle(element) {
+  var background = element.s('layer.label.background');
+
+  if (background === undefined) {
+    background = defaultStyle.background;
+  }
+
+  return {
+    color: element.s('layer.label.color') || defaultStyle.color,
+    font: element.s('layer.label.font') || defaultStyle.font,
+    background: background
+  };
+}
+
+function setLabelStyle(element, style) {
+  var map = {};
+  Object.keys(style).forEach(function (name) {
+    map["layer.label." + name] = style[name];
+  });
+  element.s(map);
+} // 分层标题文字样式
+
+
+function getTextStyle(element) {
+  var style = getLabelStyle(element);
+  var underline = null;
+  return (0, _extends2["default"])({
+    color: (0, _colorUtil.parseColor)(style.color),
+    underline: underline
+  }, _fontStyleUtil["default"].toMap(style.font), (0, _colorUtil.parseBackground)(style.background));
+}
+
+function setTextStyle(element, style) {
+  // if ('underline' in style) {
+  // }
+  var labelStyle = {};
+
+  if ('color' in style) {
+    labelStyle.color = style.color.hex;
+  } // 背景颜色
+
+
+  var prevStyle = getTextStyle(element);
+  labelStyle.background = (0, _colorUtil.formatBackgroundRgbaColor)(prevStyle, style);
+  var fontStyle = (0, _extends2["default"])({}, getTextStyle(element), style);
+
+  var fontStr = _fontStyleUtil["default"].build(fontStyle);
+
+  labelStyle.font = fontStr;
+  setLabelStyle(element, labelStyle);
+}
+/**
+ * 
+ * @param {*} element 
+ * @returns {Array}
+ */
+
+
+function getEnabledFields(element) {
+  return ['fontFamily', 'fontSize', 'bold', 'italic', 'color', 'background', 'opacity'];
+}
+
+var _default = {
+  getTextStyle: getTextStyle,
+  setTextStyle: setTextStyle,
+  getEnabledFields: getEnabledFields
+};
+exports["default"] = _default;

package/lib/core/editor/components/Toolbar/widgets/components/textStyleSetting/ElementTextStyleSetting/elements/nodeTag.js

@@ -0,0 +1,90 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+exports.__esModule = true;
+exports["default"] = void 0;
+exports.getEnabledFields = getEnabledFields;
+exports.getFieldDisabled = getFieldDisabled;
+exports.getTextStyle = getTextStyle;
+exports.setTextStyle = setTextStyle;
+
+var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
+
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+
+var _fontStyleUtil = _interopRequireDefault(require("../../../../../../settings/common/text/fontStyleUtil"));
+
+var _colorUtil = require("../colorUtil");
+
+var _excluded = ["color", "background", "opacity", "bold", "italic"];
+
+function getTextStyle(element) {
+  var underline = null;
+  return (0, _extends2["default"])({
+    color: (0, _colorUtil.parseColor)(element.a('ht.color')),
+    underline: underline
+  }, _fontStyleUtil["default"].toMap(element.a('ht.font')), (0, _colorUtil.parseBackground)(element.a('ht.background')));
+}
+
+function setTextStyle(element, style, topo) {
+  var _fontStyleUtil$remove = _fontStyleUtil["default"].removeBoldItalic(style),
+      color = _fontStyleUtil$remove.color,
+      background = _fontStyleUtil$remove.background,
+      opacity = _fontStyleUtil$remove.opacity,
+      bold = _fontStyleUtil$remove.bold,
+      italic = _fontStyleUtil$remove.italic,
+      otherStyle = (0, _objectWithoutPropertiesLoose2["default"])(_fontStyleUtil$remove, _excluded);
+
+  var tagStyle = (0, _extends2["default"])({}, otherStyle);
+
+  if ('color' in style) {
+    tagStyle.color = color.hex;
+  }
+
+  if ('bold' in style) {
+    tagStyle.fontBold = bold;
+  }
+
+  if ('italic' in style) {
+    tagStyle.fontItalic = italic;
+  }
+
+  if ('background' in style || 'opacity' in style) {
+    // 背景颜色
+    var prevStyle = getTextStyle(element);
+    tagStyle.background = (0, _colorUtil.formatBackgroundRgbaColor)(prevStyle, style);
+  }
+
+  if (Object.keys(tagStyle).length) {
+    topo.getHtTopo().setNodeLabelStyle(element, tagStyle);
+  }
+}
+
+function getEnabledFields(element) {
+  return ['fontFamily', 'color', 'background', 'opacity'];
+}
+/**
+ * 获得字段是否禁用
+ * 
+ * @param {*} element 
+ * @returns 
+ */
+
+
+function getFieldDisabled(element) {
+  return {
+    fontSize: true,
+    bold: true,
+    italic: true,
+    underline: true
+  };
+}
+
+var _default = {
+  getTextStyle: getTextStyle,
+  setTextStyle: setTextStyle,
+  getEnabledFields: getEnabledFields,
+  getFieldDisabled: getFieldDisabled
+};
+exports["default"] = _default;

package/lib/core/editor/components/Toolbar/widgets/components/textStyleSetting/ElementTextStyleSetting/elements/text.js

@@ -0,0 +1,54 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+exports.__esModule = true;
+exports["default"] = void 0;
+exports.getEnabledFields = getEnabledFields;
+exports.getTextStyle = getTextStyle;
+exports.setTextStyle = setTextStyle;
+
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+
+var _fontStyleUtil = _interopRequireDefault(require("../../../../../../settings/common/text/fontStyleUtil"));
+
+var _colorUtil = require("../colorUtil");
+
+function getTextStyle(element) {
+  var underline = element.s('text.decoration') === 'underline';
+  return (0, _extends2["default"])({
+    color: (0, _colorUtil.parseColor)(element.s('text.color')),
+    underline: underline
+  }, _fontStyleUtil["default"].toMap(element.s('text.font')), (0, _colorUtil.parseBackground)(element.s('textBackground')));
+}
+
+function setTextStyle(element, style) {
+  if ('underline' in style) {
+    element.s('text.decoration', style.underline ? 'underline' : null);
+  }
+
+  if ('color' in style) {
+    element.s('text.color', style.color.hex);
+  } // 背景颜色
+
+
+  var prevStyle = getTextStyle(element);
+  var background = (0, _colorUtil.formatBackgroundRgbaColor)(prevStyle, style);
+  element.s('textBackground', background);
+  var fontStyle = (0, _extends2["default"])({}, getTextStyle(element), style);
+
+  var fontStr = _fontStyleUtil["default"].build(fontStyle);
+
+  element.s('text.font', fontStr);
+}
+
+function getEnabledFields(element) {
+  return ['fontFamily', 'fontSize', 'bold', 'italic', 'underline', 'color', 'background', 'opacity'];
+}
+
+var _default = {
+  getTextStyle: getTextStyle,
+  setTextStyle: setTextStyle,
+  getEnabledFields: getEnabledFields
+};
+exports["default"] = _default;

package/lib/core/editor/components/Toolbar/widgets/components/textStyleSetting/ElementTextStyleSetting/textStyleUtil.js

@@ -0,0 +1,141 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+exports.__esModule = true;
+exports.getElementTextStyle = getElementTextStyle;
+exports.getElementTextStyleEnabledFields = getElementTextStyleEnabledFields;
+exports.getElementTextStyleFieldDisabled = getElementTextStyleFieldDisabled;
+exports.getTextStyle = getTextStyle;
+exports.setTextStyle = setTextStyle;
+
+var _extends3 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+
+var _htElementUtils = require("../../../../../../../../utils/htElementUtils");
+
+var _elements = _interopRequireDefault(require("./elements"));
+
+function getElementType(element) {
+  if ((0, _htElementUtils.isText)(element)) {
+    return 'text';
+  } else if (element.a('type') === 'box') {
+    return 'box';
+  } else if ((0, _htElementUtils.isGroup)(element)) {
+    return 'groupTitle';
+  } else if ((0, _htElementUtils.isNode)(element)) {
+    return 'nodeTag';
+  } else if ((0, _htElementUtils.isEdge)(element)) {
+    return 'edgeTag';
+  } else if ((0, _htElementUtils.isLayer)(element)) {
+    return 'layerTitle';
+  }
+
+  return null;
+}
+
+function getElementTextStyle(element) {
+  var type = getElementType(element);
+  var handler = _elements["default"][type];
+
+  if (handler) {
+    return handler.getTextStyle(element);
+  }
+
+  return null;
+}
+
+function getElementTextStyleFieldDisabled(element) {
+  var type = getElementType(element);
+  var handler = _elements["default"][type];
+
+  if (handler) {
+    if (handler.getFieldDisabled) {
+      return handler.getFieldDisabled(element) || {};
+    }
+
+    return {};
+  }
+
+  return null;
+}
+
+function getElementTextStyleEnabledFields(element) {
+  var type = getElementType(element);
+  var handler = _elements["default"][type];
+
+  if (handler && handler.getEnabledFields) {
+    return handler.getEnabledFields(element);
+  }
+
+  return null;
+}
+
+function getTextStyle(htSelection, styleNames) {
+  var elementValues = [];
+  var elementEnabledFieldsMap = {};
+  var enabledFields = [];
+  htSelection.forEach(function (element) {
+    var id = element.getId();
+    var elementTextStyle = getElementTextStyle(element);
+    elementValues.push({
+      id: id,
+      values: elementTextStyle
+    });
+    var elementEnabledFields = getElementTextStyleEnabledFields(element) || [];
+    elementEnabledFieldsMap[id] = elementEnabledFields;
+    enabledFields.push.apply(enabledFields, elementEnabledFields);
+  }); // 多选时值相同返回，排除元素禁用的字段值
+
+  var value = {};
+  styleNames.forEach(function (styleName) {
+    // 查询该字段多元素的值列表，排除元素禁用的字段值
+    var fieldValueList = elementValues.reduce(function (result, item) {
+      // 元素字段是否禁用
+      var disabled = !elementEnabledFieldsMap[item.id].includes(styleName);
+
+      if (!item.values || disabled) {
+        return result;
+      }
+
+      return [].concat(result, [item.values[styleName]]);
+    }, []); // 对比是否一样，如果一样则使用
+
+    var val = fieldValueList[0];
+    var different = fieldValueList.filter(function (item) {
+      return item !== val;
+    });
+
+    if (!different.length) {
+      value[styleName] = val;
+    }
+  });
+  var disabled = true; // 字段如果没有元素启用则禁用
+
+  var fieldDisabled = styleNames.reduce(function (result, fieldName) {
+    var _extends2;
+
+    if (enabledFields.includes(fieldName)) {
+      disabled = false;
+    }
+
+    return (0, _extends3["default"])({}, result, (_extends2 = {}, _extends2[fieldName] = !enabledFields.includes(fieldName), _extends2));
+  }, {});
+  return {
+    disabled: disabled,
+    style: value,
+    fieldDisabled: fieldDisabled,
+    debugData: {
+      elementValues: elementValues,
+      elementEnabledFieldsMap: elementEnabledFieldsMap
+    }
+  };
+}
+
+function setTextStyle(element, style, topo) {
+  var type = getElementType(element);
+  var handler = _elements["default"][type];
+
+  if (handler) {
+    handler.setTextStyle(element, style, topo);
+  }
+}

package/lib/core/editor/components/Toolbar/widgets/components/textStyleSetting/GlobalTagStyleSetting/GlobalTagStyleSetting.js

@@ -0,0 +1,46 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+exports.__esModule = true;
+exports["default"] = void 0;
+
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+
+var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _globalTag = require("./globalTag");
+
+var _excluded = ["Component"];
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+var fieldDisabled = {
+  fontSize: true
+};
+
+function GlobalTagStyleSetting(props) {
+  var topo = props.topo;
+  var Component = props.Component,
+      widgetProps = (0, _objectWithoutPropertiesLoose2["default"])(props, _excluded);
+  var values = (0, _globalTag.useValues)(topo); // const values = useMemo(() => ({}), [])
+
+  var setStyle = (0, _react.useMemo)(function () {
+    return function (style) {
+      return (0, _globalTag.setGlobalTagStyle)(topo, style);
+    };
+  }, []);
+  return /*#__PURE__*/_react["default"].createElement(Component, (0, _extends2["default"])({
+    disabled: true,
+    style: values,
+    setStyle: setStyle,
+    fieldDisabled: fieldDisabled
+  }, widgetProps));
+}
+
+var _default = GlobalTagStyleSetting;
+exports["default"] = _default;

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

@@ -0,0 +1,111 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+exports.__esModule = true;
+exports.setGlobalTagStyle = void 0;
+exports.setStyle = setStyle;
+exports.useValues = useValues;
+
+var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
+
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+
+var _fontStyleUtil = _interopRequireDefault(require("../../../../../settings/common/text/fontStyleUtil"));
+
+var _colorUtil = require("../ElementTextStyleSetting/colorUtil");
+
+var _excluded = ["color", "background", "opacity"],
+    _excluded2 = ["color", "background", "opacity", "bold", "italic"];
+var defaultStyle = {
+  color: '#AFB9C2',
+  fontFamily: '微软雅黑'
+};
+
+function useValues(topo) {
+  var displayConfigState = topo.store.useModelState('displayConfig');
+  var nodeLabelStyle = displayConfigState.nodeLabelStyle,
+      defaultEdgeLabelStyle = displayConfigState.defaultEdgeLabelStyle;
+  return (0, _extends2["default"])({
+    color: (nodeLabelStyle === null || nodeLabelStyle === void 0 ? void 0 : nodeLabelStyle.color) || defaultStyle.color,
+    fontFamily: (nodeLabelStyle === null || nodeLabelStyle === void 0 ? void 0 : nodeLabelStyle.fontFamily) || defaultStyle.fontFamily,
+    fontSize: nodeLabelStyle === null || nodeLabelStyle === void 0 ? void 0 : nodeLabelStyle.fontSize
+  }, (0, _colorUtil.parseBackground)(nodeLabelStyle === null || nodeLabelStyle === void 0 ? void 0 : nodeLabelStyle.background));
+}
+
+var setGlobalTagStyle = function setGlobalTagStyle(topo, styleData) {
+  var _topo$store$getModel = topo.store.getModel('displayConfig'),
+      displayConfigState = _topo$store$getModel[0],
+      displayConfigDispatchers = _topo$store$getModel[1];
+
+  var nodeLabelStyle = displayConfigState.nodeLabelStyle,
+      defaultEdgeLabelStyle = displayConfigState.defaultEdgeLabelStyle;
+  var style = buildStyle(styleData, nodeLabelStyle);
+  var globalNodeLabelStyle = (0, _extends2["default"])({}, nodeLabelStyle, style);
+  var globalEdgeTagStyle = (0, _extends2["default"])({}, nodeLabelStyle, defaultEdgeLabelStyle, style);
+  displayConfigDispatchers.update({
+    nodeLabelStyle: globalNodeLabelStyle,
+    defaultEdgeLabelStyle: globalEdgeTagStyle
+  });
+  var styles = buildGlobalStyle(styleData);
+  topo.getHtTopo().setGlobalNodeLabelStyle(styles);
+  topo.getHtTopo().setGlobalEdgeTagStyle(styles);
+};
+
+exports.setGlobalTagStyle = setGlobalTagStyle;
+
+function buildStyle(styleData, prevTagStyle) {
+  var color = styleData.color,
+      background = styleData.background,
+      opacity = styleData.opacity,
+      otherStyle = (0, _objectWithoutPropertiesLoose2["default"])(styleData, _excluded);
+  var style = (0, _extends2["default"])({}, prevTagStyle, otherStyle);
+
+  if ('color' in styleData) {
+    style.color = color.hex;
+  }
+
+  if ('background' in styleData || 'opacity' in styleData) {
+    var prevBackgroundStyle = (0, _colorUtil.parseBackground)(prevTagStyle === null || prevTagStyle === void 0 ? void 0 : prevTagStyle.background);
+    style.background = (0, _colorUtil.formatBackgroundRgbaColor)(prevBackgroundStyle, styleData);
+  }
+
+  return style;
+}
+
+function buildGlobalStyle(styleData) {
+  var _fontStyleUtil$remove = _fontStyleUtil["default"].removeBoldItalic(styleData),
+      color = _fontStyleUtil$remove.color,
+      background = _fontStyleUtil$remove.background,
+      opacity = _fontStyleUtil$remove.opacity,
+      bold = _fontStyleUtil$remove.bold,
+      italic = _fontStyleUtil$remove.italic,
+      otherStyle = (0, _objectWithoutPropertiesLoose2["default"])(_fontStyleUtil$remove, _excluded2);
+
+  var tagStyle = (0, _extends2["default"])({}, otherStyle);
+
+  if ('color' in styleData) {
+    tagStyle.color = color.hex;
+  }
+
+  if ('bold' in styleData) {
+    tagStyle.fontBold = bold;
+  }
+
+  if ('italic' in styleData) {
+    tagStyle.fontItalic = italic;
+  }
+
+  if ('background' in styleData) {
+    // 背景颜色
+    tagStyle.background = (0, _colorUtil.formatRgbaColor)(background);
+  }
+
+  if ('opacity' in styleData) {
+    tagStyle.opacity = opacity;
+  }
+
+  return tagStyle;
+}
+
+function setStyle() {}

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

@@ -0,0 +1,31 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+exports.__esModule = true;
+exports["default"] = void 0;
+
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+
+var _react = _interopRequireDefault(require("react"));
+
+var _ElementTextStyleSetting = _interopRequireDefault(require("./ElementTextStyleSetting/ElementTextStyleSetting"));
+
+var _GlobalTagStyleSetting = _interopRequireDefault(require("./GlobalTagStyleSetting/GlobalTagStyleSetting"));
+
+function textStyleSettingRouter(Component, options) {
+  var names = (options === null || options === void 0 ? void 0 : options.names) || [];
+  return function TextStyleSettingButton(props) {
+    var topo = props.topo;
+    var selection = topo.selectionModel.useHtSelection();
+    var Widget = !selection.length ? _GlobalTagStyleSetting["default"] : _ElementTextStyleSetting["default"];
+    return /*#__PURE__*/_react["default"].createElement(Widget, (0, _extends2["default"])({
+      Component: Component
+    }, props, {
+      styleNames: names
+    }));
+  };
+}
+
+var _default = textStyleSettingRouter;
+exports["default"] = _default;