import { __rest } from "tslib";
import * as React from 'react';
import { View } from 'remax/one';
import { getPrefixCls } from './../common';
var prefixCls = getPrefixCls('progress');

var validProgress = function validProgress(progress) {
  if (!progress || progress < 0) {
    return 0;
  }

  if (progress > 100) {
    return 100;
  }

  return progress;
};

var sortGradient = function sortGradient(gradients) {
  var tempArr = [];
  Object.keys(gradients).forEach(function (key) {
    var formattedKey = parseFloat(key.replace(/%/g, ''));

    if (!isNaN(formattedKey)) {
      tempArr.push({
        key: formattedKey,
        value: gradients[key]
      });
    }
  });
  tempArr = tempArr.sort(function (a, b) {
    return a.key - b.key;
  });
  return tempArr.map(function (_ref) {
    var key = _ref.key,
        value = _ref.value;
    return "".concat(value, " ").concat(key, "%");
  }).join(', ');
};

var handleGradient = function handleGradient(color) {
  var _color$from = color.from,
      from = _color$from === void 0 ? '#1890ff' : _color$from,
      _color$to = color.to,
      to = _color$to === void 0 ? '#1890ff' : _color$to,
      _color$direction = color.direction,
      direction = _color$direction === void 0 ? 'to right' : _color$direction,
      rest = __rest(color, ["from", "to", "direction"]);

  if (Object.keys(rest).length !== 0) {
    var sortedGradients = sortGradient(rest);
    return {
      backgroundImage: "linear-gradient(".concat(direction, ", ").concat(sortedGradients, ")")
    };
  }

  return {
    backgroundImage: "linear-gradient(".concat(direction, ", ").concat(from, ", ").concat(to, ")")
  };
};

var Line = function Line(props) {
  var percent = props.percent,
      width = props.width,
      size = props.size,
      color = props.color,
      bgColor = props.bgColor,
      _props$shape = props.shape,
      shape = _props$shape === void 0 ? 'round' : _props$shape,
      successPercent = props.successPercent,
      children = props.children;
  var backgroundProps;

  if (color && typeof color !== 'string') {
    backgroundProps = handleGradient(color);
  } else {
    backgroundProps = {
      background: color
    };
  }

  var bgStyle;
  var borderRadius = null;

  if (shape === 'sharp') {
    borderRadius = 0;
  }

  if (shape === 'square') {
    borderRadius = '4px';
  }

  if (borderRadius || borderRadius === 0) {
    bgStyle = {
      borderRadius: borderRadius
    };
  }

  if (bgColor && typeof bgColor === 'string') {
    bgStyle = Object.assign(Object.assign({}, bgStyle), {
      backgroundColor: bgColor
    });
  }

  var sizeWidth = '16px';

  if (size === 'small') {
    sizeWidth = '12px';
  }

  if (size === 'large') {
    sizeWidth = '20px';
  }

  var percentStyle = Object.assign({
    width: "".concat(validProgress(percent), "%"),
    height: width || sizeWidth,
    borderRadius: borderRadius
  }, backgroundProps);
  var successPercentStyle = {
    width: "".concat(validProgress(successPercent), "%"),
    height: width || sizeWidth,
    borderRadius: borderRadius
  };
  var successSegment = successPercent !== undefined ? /*#__PURE__*/React.createElement(View, {
    className: "".concat(prefixCls, "-success-bg"),
    style: successPercentStyle
  }) : null;
  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(View, {
    className: "".concat(prefixCls, "-outer")
  }, /*#__PURE__*/React.createElement(View, {
    className: "".concat(prefixCls, "-inner"),
    style: bgStyle
  }, /*#__PURE__*/React.createElement(View, {
    className: "".concat(prefixCls, "-bg"),
    style: percentStyle
  }), successSegment)), children);
};

export default Line;