@easyv/charts 1.4.21 → 1.4.24

package/lib/components/Band.js

@@ -1,34 +1,23 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 var _typeof = require("@babel/runtime/helpers/typeof");
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports["default"] = void 0;
-
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
-
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-
 var _react = _interopRequireWildcard(require("react"));
-
 var _d3v = require("d3v7");
-
 var _utils = require("../utils");
-
 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; }
-
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2["default"])(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2["default"])(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; } /**
+                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                             * （柱状/条形）图柱子
+                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                             */
 var getHighlightData = function getHighlightData(data, extent) {
   switch (extent) {
     case "min":
@@ -40,7 +29,6 @@ var getHighlightData = function getHighlightData(data, extent) {
           flag: minData == item.data.y ? "min" : ""
         });
       });
-
     case "max":
       var maxData = (0, _d3v.max)(data, function (d) {
         return d.data.y;
@@ -50,18 +38,16 @@ var getHighlightData = function getHighlightData(data, extent) {
           flag: maxData == item.data.y ? "max" : ""
         });
       });
-
     default:
       return data;
   }
 };
-
 var getAttr = function getAttr(_ref) {
   var isVertical = _ref.isVertical,
-      seriesWidth = _ref.seriesWidth,
-      length = _ref.length,
-      x = _ref.x,
-      y = _ref.y;
+    seriesWidth = _ref.seriesWidth,
+    length = _ref.length,
+    x = _ref.x,
+    y = _ref.y;
   if (isVertical) return {
     width: length,
     height: seriesWidth,
@@ -75,79 +61,80 @@ var getAttr = function getAttr(_ref) {
     height: length
   };
 };
-
 var getBorderRadius = function getBorderRadius(_ref2) {
   var isVertical = _ref2.isVertical,
-      positive = _ref2.positive,
-      seriesWidth = _ref2.seriesWidth;
+    positive = _ref2.positive,
+    seriesWidth = _ref2.seriesWidth;
   return isVertical ? positive ? "0px " + seriesWidth + "px " + seriesWidth + "px 0" : seriesWidth + "px 0 0 " + seriesWidth + "px" : positive ? seriesWidth / 2 + "px " + seriesWidth / 2 + "px 0 0" : "0 0 " + seriesWidth / 2 + "px " + seriesWidth / 2 + "px";
 };
-
 var _default = /*#__PURE__*/(0, _react.memo)(function (_ref3) {
   var triggerClick = _ref3.triggerClick,
-      _ref3$config = _ref3.config,
-      _ref3$config$pattern = _ref3$config.pattern,
-      pattern = _ref3$config$pattern === void 0 ? {} : _ref3$config$pattern,
-      _ref3$config$seriesIn = _ref3$config.seriesIntervalWidth,
-      paddingInner = _ref3$config$seriesIn === void 0 ? 0 : _ref3$config$seriesIn,
-      _ref3$config$paddingI = _ref3$config.paddingInner,
-      paddingOuter = _ref3$config$paddingI === void 0 ? 0 : _ref3$config$paddingI,
-      style = _ref3$config.style,
-      fillType = _ref3$config.fillType,
-      url = _ref3$config.url,
-      size = _ref3$config.size,
-      fill = _ref3$config.fill,
-      border = _ref3$config.border,
-      opacity = _ref3$config.opacity,
-      _ref3$config$highligh = _ref3$config.highlight,
-      showHighlight = _ref3$config$highligh.show,
-      extent = _ref3$config$highligh.extent,
-      highlightFill = _ref3$config$highligh.fill,
-      headDecorate = _ref3$config.headDecorate,
-      _ref3$bandLength = _ref3.bandLength,
-      bandLength = _ref3$bandLength === void 0 ? 0 : _ref3$bandLength,
-      data = _ref3.data,
-      _ref3$xAxis = _ref3.xAxis,
-      xScaler = _ref3$xAxis.scaler,
-      step = _ref3$xAxis.step,
-      direction = _ref3$xAxis.direction,
-      _ref3$yAxis = _ref3.yAxis,
-      yScaler = _ref3$yAxis.scaler,
-      isClipAxis = _ref3$yAxis.isClipAxis,
-      clipValue = _ref3$yAxis.clipValue;
+    indicatorWidth = _ref3.indicatorWidth,
+    setControlChartTooltipShow = _ref3.setControlChartTooltipShow,
+    setControlChartTooltipX = _ref3.setControlChartTooltipX,
+    setControlChartTooltipXName = _ref3.setControlChartTooltipXName,
+    _ref3$isControlChart = _ref3.isControlChart,
+    isControlChart = _ref3$isControlChart === void 0 ? false : _ref3$isControlChart,
+    setControlChartIndicatorList = _ref3.setControlChartIndicatorList,
+    _ref3$config = _ref3.config,
+    _ref3$config$pattern = _ref3$config.pattern,
+    pattern = _ref3$config$pattern === void 0 ? {} : _ref3$config$pattern,
+    _ref3$config$seriesIn = _ref3$config.seriesIntervalWidth,
+    paddingInner = _ref3$config$seriesIn === void 0 ? 0 : _ref3$config$seriesIn,
+    _ref3$config$paddingI = _ref3$config.paddingInner,
+    paddingOuter = _ref3$config$paddingI === void 0 ? 0 : _ref3$config$paddingI,
+    style = _ref3$config.style,
+    fillType = _ref3$config.fillType,
+    url = _ref3$config.url,
+    size = _ref3$config.size,
+    fill = _ref3$config.fill,
+    border = _ref3$config.border,
+    opacity = _ref3$config.opacity,
+    _ref3$config$highligh = _ref3$config.highlight,
+    showHighlight = _ref3$config$highligh.show,
+    extent = _ref3$config$highligh.extent,
+    highlightFill = _ref3$config$highligh.fill,
+    headDecorate = _ref3$config.headDecorate,
+    _ref3$bandLength = _ref3.bandLength,
+    bandLength = _ref3$bandLength === void 0 ? 0 : _ref3$bandLength,
+    data = _ref3.data,
+    _ref3$xAxis = _ref3.xAxis,
+    xScaler = _ref3$xAxis.scaler,
+    step = _ref3$xAxis.step,
+    direction = _ref3$xAxis.direction,
+    xAxis = _ref3.xAxis,
+    _ref3$yAxis = _ref3.yAxis,
+    yScaler = _ref3$yAxis.scaler,
+    isClipAxis = _ref3$yAxis.isClipAxis,
+    clipValue = _ref3$yAxis.clipValue;
   if (!data.length) return null;
-
   var _getSeriesInfo = (0, _utils.getSeriesInfo)({
-    step: step,
-    bandLength: bandLength,
-    paddingInner: paddingInner,
-    paddingOuter: paddingOuter
-  }),
-      seriesWidth = _getSeriesInfo.seriesWidth,
-      seriesStep = _getSeriesInfo.seriesStep,
-      seriesStart = _getSeriesInfo.seriesStart;
-
+      step: step,
+      bandLength: bandLength,
+      paddingInner: paddingInner,
+      paddingOuter: paddingOuter
+    }),
+    seriesWidth = _getSeriesInfo.seriesWidth,
+    seriesStep = _getSeriesInfo.seriesStep,
+    seriesStart = _getSeriesInfo.seriesStart;
   var _data = showHighlight ? getHighlightData(data, extent) : data;
-
   var isVertical = direction === "vertical";
   var borderStr = "".concat(border.borderColor, " solid ").concat(border.borderWidth, "px");
   return /*#__PURE__*/_react["default"].createElement("g", {
     className: "__easyv-band"
   }, _data.map(function (_ref4, i) {
     var flag = _ref4.flag,
-        index = _ref4.index,
-        _ref4$bound = (0, _slicedToArray2["default"])(_ref4.bound, 2),
-        start = _ref4$bound[0],
-        end = _ref4$bound[1],
-        data = _ref4.data,
-        _ref4$data = _ref4.data,
-        x = _ref4$data.x,
-        y = _ref4$data.y,
-        s = _ref4$data.s;
-
-    //todo 柱状中空设置
-    var y1, y2; //断轴图相关，断轴图的scaler是一个数组，内含上断轴下断轴的scaler
-
+      index = _ref4.index,
+      _ref4$bound = (0, _slicedToArray2["default"])(_ref4.bound, 2),
+      start = _ref4$bound[0],
+      end = _ref4$bound[1],
+      data = _ref4.data,
+      _ref4$data = _ref4.data,
+      x = _ref4$data.x,
+      y = _ref4$data.y,
+      s = _ref4$data.s;
+    var y1, y2;
+    //断轴图相关，断轴图的scaler是一个数组，内含上断轴下断轴的scaler
     if (isClipAxis) {
       if (end > +clipValue) {
         y1 = yScaler[1](start);
@@ -160,30 +147,25 @@ var _default = /*#__PURE__*/(0, _react.memo)(function (_ref3) {
       y1 = yScaler(isVertical ? end : start);
       y2 = yScaler(isVertical ? start : end);
     }
-
     var positionX = xScaler(x) - step / 2 + seriesStart + index * seriesStep;
     var showHead, headUrl, headWidth, headHeight, headTranslate;
-
     if (headDecorate) {
       showHead = headDecorate.show, headUrl = headDecorate.url, headWidth = headDecorate.size.width, headHeight = headDecorate.size.height, headTranslate = headDecorate.translate;
-    } //断轴图相关，将柱形在断轴处切开
-
-
+    }
+    //断轴图相关，将柱形在断轴处切开
     var setClipPath = function setClipPath() {
       if (isClipAxis && end > +clipValue) {
         var clipValueY2 = yScaler[0](clipValue); //上方
-
         var clipValueY1 = yScaler[1](clipValue); //下方
-
         var top = Math.abs((y2 - clipValueY2) / (y1 - y2)) * 100;
-        var bottom = Math.abs((y2 - clipValueY1) / (y1 - y2)) * 100; //clip path属性
+        var bottom = Math.abs((y2 - clipValueY1) / (y1 - y2)) * 100;
 
+        //clip path属性
         return "polygon(0% 0%, 0% 100%, 0 100%, 0 ".concat(top, "%, 100% ").concat(top, "%, 100% ").concat(bottom, "%, 0 ").concat(bottom, "%, 0 100%, 100% 100%, 100% 0%)");
       } else {
         return "none";
       }
     };
-
     if (isNaN(positionX)) return null;
     var positionY = y < 0 ? y1 : y2;
     var attr = getAttr({
@@ -201,7 +183,41 @@ var _default = /*#__PURE__*/(0, _react.memo)(function (_ref3) {
         cursor: "pointer"
       }
     }, attr, {
-      onClick: triggerClick,
+      onClick: triggerClick
+      //enter和leave事件，用于控制图的提示框
+      ,
+      onMouseEnter: function onMouseEnter() {
+        if (isControlChart) {
+          setControlChartIndicatorList(function (v) {
+            return v.map(function (item) {
+              if (item.tick === data.x) {
+                return _objectSpread(_objectSpread({}, item), {}, {
+                  isShow: true
+                });
+              } else {
+                return item;
+              }
+            });
+          });
+          setControlChartTooltipShow(true);
+          setControlChartTooltipX(xScaler(x) - indicatorWidth / 2);
+          setControlChartTooltipXName(data.x);
+        }
+      },
+      onMouseLeave: function onMouseLeave() {
+        if (isControlChart) {
+          setControlChartIndicatorList(function (v) {
+            return v.map(function (item) {
+              return _objectSpread(_objectSpread({}, item), {}, {
+                isShow: false
+              });
+            });
+          });
+          setControlChartTooltipShow(false);
+          setControlChartTooltipXName(undefined);
+          setControlChartTooltipX(undefined);
+        }
+      },
       "data-data": JSON.stringify(data)
     }), headUrl && showHead && /*#__PURE__*/_react["default"].createElement("div", {
       style: {
@@ -218,7 +234,6 @@ var _default = /*#__PURE__*/(0, _react.memo)(function (_ref3) {
       style: _objectSpread({
         width: "100%",
         height: "100%",
-
         /** Safari Bug **/
         position: "fixed",
         clipPath: setClipPath(),
@@ -241,5 +256,4 @@ var _default = /*#__PURE__*/(0, _react.memo)(function (_ref3) {
     }));
   }));
 });
-
 exports["default"] = _default;

package/lib/components/BaseLine.js

@@ -1,62 +1,52 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 var _typeof = require("@babel/runtime/helpers/typeof");
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports["default"] = void 0;
-
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-
 var _react = _interopRequireWildcard(require("react"));
-
 var _utils = require("../utils");
-
 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; }
-
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2["default"])(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2["default"])(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; } /**
+                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                             * 参考线
+                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                             */
 var _default = /*#__PURE__*/(0, _react.memo)(function (_ref) {
   var width = _ref.width,
-      height = _ref.height,
-      orientation = _ref.baseLineOri,
-      _ref$config = _ref.config,
-      _ref$config$dataStyle = _ref$config.dataStyle,
-      _ref$config$dataStyle2 = _ref$config$dataStyle.data,
-      dataShow = _ref$config$dataStyle2.show,
-      dataStyle = _ref$config$dataStyle2.dataStyle,
-      dataTranslate = _ref$config$dataStyle2.translate,
-      _ref$config$dataStyle3 = _ref$config$dataStyle.label,
-      label = _ref$config$dataStyle3.label,
-      labelShow = _ref$config$dataStyle3.show,
-      textStyle = _ref$config$dataStyle3.textStyle,
-      labelTranslate = _ref$config$dataStyle3.translate,
-      _ref$config$line = _ref$config.line,
-      color = _ref$config$line.color,
-      lineType = _ref$config$line.lineType,
-      lineWidth = _ref$config$line.lineWidth,
-      _ref$config$line$marg = _ref$config$line.margin,
-      marginLeft = _ref$config$line$marg.marginLeft,
-      marginRight = _ref$config$line$marg.marginRight,
-      strokeDasharray = _ref$config$line.strokeDasharray,
-      yOrZ = _ref.yOrZ,
-      _ref$yAxis = _ref.yAxis,
-      yScaler = _ref$yAxis.scaler,
-      clipValue = _ref$yAxis.clipValue,
-      isClipAxis = _ref$yAxis.isClipAxis,
-      scaler = _ref.axisX.scaler,
-      data = _ref.data;
-
+    height = _ref.height,
+    orientation = _ref.baseLineOri,
+    _ref$config = _ref.config,
+    _ref$config$dataStyle = _ref$config.dataStyle,
+    _ref$config$dataStyle2 = _ref$config$dataStyle.data,
+    dataShow = _ref$config$dataStyle2.show,
+    dataStyle = _ref$config$dataStyle2.dataStyle,
+    dataTranslate = _ref$config$dataStyle2.translate,
+    _ref$config$dataStyle3 = _ref$config$dataStyle.label,
+    label = _ref$config$dataStyle3.label,
+    labelShow = _ref$config$dataStyle3.show,
+    textStyle = _ref$config$dataStyle3.textStyle,
+    labelTranslate = _ref$config$dataStyle3.translate,
+    _ref$config$line = _ref$config.line,
+    color = _ref$config$line.color,
+    lineType = _ref$config$line.lineType,
+    lineWidth = _ref$config$line.lineWidth,
+    _ref$config$line$marg = _ref$config$line.margin,
+    marginLeft = _ref$config$line$marg.marginLeft,
+    marginRight = _ref$config$line$marg.marginRight,
+    strokeDasharray = _ref$config$line.strokeDasharray,
+    yOrZ = _ref.yOrZ,
+    _ref$yAxis = _ref.yAxis,
+    yScaler = _ref$yAxis.scaler,
+    clipValue = _ref$yAxis.clipValue,
+    isClipAxis = _ref$yAxis.isClipAxis,
+    scaler = _ref.axisX.scaler,
+    data = _ref.data;
   try {
     var x1, x2, y1, y2;
-
     if (isClipAxis) {
       if (data.value > +clipValue) {
         x1 = orientation == 'left' ? yScaler[0](data.value) : marginLeft, x2 = orientation == 'left' ? yScaler[0](data.value) : width - marginRight, y1 = orientation == 'left' ? marginLeft : yScaler[0](data.value), y2 = orientation == 'left' ? height - marginRight : yScaler[0](data.value);
@@ -69,15 +59,13 @@ var _default = /*#__PURE__*/(0, _react.memo)(function (_ref) {
       } else {
         x1 = orientation == 'left' ? yScaler(data.value) : marginLeft, x2 = orientation == 'left' ? yScaler(data.value) : width - marginRight, y1 = orientation == 'left' ? marginLeft : yScaler(data.value), y2 = orientation == 'left' ? height - marginRight : yScaler(data.value);
       }
-    } //当坐标值存在undefined时，返回null
-
-
+    }
+    //当坐标值存在undefined时，返回null
     if ([x1, x2, y1, y2].some(function (d) {
       return d == undefined;
     })) {
       return null;
     }
-
     return /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement("g", {
       className: "__easyv-baseLine"
     }, /*#__PURE__*/_react["default"].createElement("line", {
@@ -108,5 +96,4 @@ var _default = /*#__PURE__*/(0, _react.memo)(function (_ref) {
     return null;
   }
 });
-
 exports["default"] = _default;

package/lib/components/Brush.js

@@ -1,22 +1,17 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports["default"] = void 0;
-
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
-
 var _react = require("react");
-
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2["default"])(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2["default"])(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; } /**
+                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                             * 实现中
+                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                             */
 var left = {
   position: 'relative',
   width: 5,
@@ -41,66 +36,57 @@ var initialPosition = {
   end: 0,
   status: ''
 };
-
 var getValue = function getValue(x, min, max) {
   return Math.max(min, Math.min(x, max));
 };
-
 var _default = function _default(_ref) {
   var width = _ref.width,
-      _ref$config = _ref.config,
-      height = _ref$config.height,
-      background = _ref$config.background,
-      _ref$config$margin = _ref$config.margin,
-      marginLeft = _ref$config$margin.marginLeft,
-      marginRight = _ref$config$margin.marginRight,
-      _ref$config$detail = _ref$config.detail,
-      blockWidth = _ref$config$detail.width,
-      color = _ref$config$detail.color;
-
+    _ref$config = _ref.config,
+    height = _ref$config.height,
+    background = _ref$config.background,
+    _ref$config$margin = _ref$config.margin,
+    marginLeft = _ref$config$margin.marginLeft,
+    marginRight = _ref$config$margin.marginRight,
+    _ref$config$detail = _ref$config.detail,
+    blockWidth = _ref$config$detail.width,
+    color = _ref$config$detail.color;
   var _useState = (0, _react.useState)({
-    translateX: 0,
-    width: blockWidth
-  }),
-      _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
-      state = _useState2[0],
-      setState = _useState2[1];
-
+      translateX: 0,
+      width: blockWidth
+    }),
+    _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
+    state = _useState2[0],
+    setState = _useState2[1];
   var availableWidth = width - marginLeft - marginRight;
   var cache = (0, _react.useRef)(state);
   var move = (0, _react.useCallback)(function (_ref2) {
     var delta = _ref2.delta,
-        status = _ref2.status,
-        name = _ref2.name;
+      status = _ref2.status,
+      name = _ref2.name;
     var _cache$current = cache.current,
-        width = _cache$current.width,
-        translateX = _cache$current.translateX;
+      width = _cache$current.width,
+      translateX = _cache$current.translateX;
     var minWidth = 40;
     var minX = 0;
-
     switch (name) {
       case 'center':
         translateX = getValue(translateX + delta, minX, availableWidth - width);
         break;
-
       case 'left':
         var tempWidth = width;
         width = getValue(width + delta * -1, minWidth, translateX + width);
         translateX = getValue(translateX + delta, minX, translateX + tempWidth - width);
         break;
-
       case 'right':
         width = getValue(width + delta, minWidth, availableWidth - translateX);
         break;
     }
-
     if (status === 'up') {
       cache.current = {
         width: width,
         translateX: translateX
       };
     }
-
     setState({
       width: width,
       translateX: translateX
@@ -143,18 +129,15 @@ var _default = function _default(_ref) {
     name: "right"
   })));
 };
-
 exports["default"] = _default;
 var Move = /*#__PURE__*/(0, _react.memo)(function (_ref3) {
   var style = _ref3.style,
-      move = _ref3.move,
-      name = _ref3.name;
-
+    move = _ref3.move,
+    name = _ref3.name;
   var _useState3 = (0, _react.useState)(initialPosition),
-      _useState4 = (0, _slicedToArray2["default"])(_useState3, 2),
-      position = _useState4[0],
-      setPosition = _useState4[1];
-
+    _useState4 = (0, _slicedToArray2["default"])(_useState3, 2),
+    position = _useState4[0],
+    setPosition = _useState4[1];
   var documentOnMouseMove = (0, _react.useCallback)(function (e) {
     // console.log('documentOnMouseMove');
     setPosition(function (position) {
@@ -187,8 +170,8 @@ var Move = /*#__PURE__*/(0, _react.memo)(function (_ref3) {
   }, []);
   (0, _react.useEffect)(function () {
     var start = position.start,
-        end = position.end,
-        status = position.status;
+      end = position.end,
+      status = position.status;
     move({
       delta: end - start,
       status: status,