"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
exports.__esModule = true;
exports["default"] = void 0;
var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
var _react = _interopRequireDefault(require("react"));
var _Text = _interopRequireDefault(require("../Text"));
var _HorizontalTimelineSt = require("./HorizontalTimeline.st.css.js");
var _HorizontalTimelineIconsSt = require("./HorizontalTimelineIcons.st.css.js");
var _constants = require("./constants");
var _wixUiIconsCommon = require("@wix/wix-ui-icons-common");
var _jsxFileName = "/home/builduser/work/57e038ea7326c1ec/packages/wix-design-system/dist/cjs/HorizontalTimeline/HorizontalTimeline.jsx",
  _HorizontalTimeline;
function _callSuper(t, o, e) { return o = (0, _getPrototypeOf2["default"])(o), (0, _possibleConstructorReturn2["default"])(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], (0, _getPrototypeOf2["default"])(t).constructor) : o.apply(t, e)); }
function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
var HorizontalTimeline = /*#__PURE__*/function (_React$PureComponent) {
  function HorizontalTimeline() {
    var _this;
    (0, _classCallCheck2["default"])(this, HorizontalTimeline);
    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
      args[_key] = arguments[_key];
    }
    _this = _callSuper(this, HorizontalTimeline, [].concat(args));
    _this._renderLine = function (_ref) {
      var skin = _ref.skin,
        line = _ref.line;
      return /*#__PURE__*/_react["default"].createElement("div", {
        className: (0, _HorizontalTimelineSt.st)(_HorizontalTimelineSt.classes.line, {
          skin: skin,
          line: line
        }),
        __self: _this,
        __source: {
          fileName: _jsxFileName,
          lineNumber: 48,
          columnNumber: 5
        }
      });
    };
    _this._renderLabel = function (_ref2) {
      var label = _ref2.label,
        index = _ref2.index,
        labelEllipsis = _ref2.labelEllipsis;
      var alignLabel = _this.props.alignLabel;
      return /*#__PURE__*/_react["default"].createElement("div", {
        className: (0, _HorizontalTimelineSt.st)(_HorizontalTimelineSt.classes.label, {
          alignLabel: alignLabel
        }),
        __self: _this,
        __source: {
          fileName: _jsxFileName,
          lineNumber: 54,
          columnNumber: 7
        }
      }, /*#__PURE__*/_react["default"].createElement(_Text["default"], {
        size: "tiny",
        ellipsis: labelEllipsis,
        dataHook: "".concat(_constants.dataHooks.horizontalTimelineLabel, "-").concat(index),
        __self: _this,
        __source: {
          fileName: _jsxFileName,
          lineNumber: 55,
          columnNumber: 9
        }
      }, label));
    };
    return _this;
  }
  (0, _inherits2["default"])(HorizontalTimeline, _React$PureComponent);
  return (0, _createClass2["default"])(HorizontalTimeline, [{
    key: "render",
    value: function render() {
      var _this2 = this;
      var _this$props = this.props,
        items = _this$props.items,
        dataHook = _this$props.dataHook,
        className = _this$props.className,
        skin = _this$props.skin;
      return /*#__PURE__*/_react["default"].createElement("div", {
        className: (0, _HorizontalTimelineSt.st)(_HorizontalTimelineSt.classes.root, {
          skin: skin
        }, className),
        "data-hook": dataHook,
        "data-skin": skin,
        __self: this,
        __source: {
          fileName: _jsxFileName,
          lineNumber: 70,
          columnNumber: 7
        }
      }, items.map(function (_ref3, index) {
        var label = _ref3.label,
          _ref3$width = _ref3.width,
          width = _ref3$width === void 0 ? 'auto' : _ref3$width,
          deprecatedSkin = _ref3.skin,
          _ref3$icon = _ref3.icon,
          icon = _ref3$icon === void 0 ? /*#__PURE__*/_react["default"].createElement(HorizontalTimeline.DefaultIcon, {
            __self: _this2,
            __source: {
              fileName: _jsxFileName,
              lineNumber: 81,
              columnNumber: 22
            }
          }) : _ref3$icon,
          _ref3$line = _ref3.line,
          line = _ref3$line === void 0 ? 'dashed' : _ref3$line,
          _ref3$labelEllipsis = _ref3.labelEllipsis,
          labelEllipsis = _ref3$labelEllipsis === void 0 ? true : _ref3$labelEllipsis;
        var nextItemSkin = items[index + 1] && items[index + 1].skin || 'light';
        var nextItemLine = items[index + 1] && items[index + 1].line || 'dashed';
        return /*#__PURE__*/_react["default"].createElement("div", {
          className: _HorizontalTimelineSt.classes.column,
          key: index,
          style: {
            width: width
          },
          __self: _this2,
          __source: {
            fileName: _jsxFileName,
            lineNumber: 92,
            columnNumber: 15
          }
        }, /*#__PURE__*/_react["default"].createElement("div", {
          className: (0, _HorizontalTimelineSt.st)(_HorizontalTimelineSt.classes.item),
          __self: _this2,
          __source: {
            fileName: _jsxFileName,
            lineNumber: 93,
            columnNumber: 17
          }
        }, /*#__PURE__*/_react["default"].createElement("div", {
          className: _HorizontalTimelineSt.classes.lineIconLine,
          __self: _this2,
          __source: {
            fileName: _jsxFileName,
            lineNumber: 94,
            columnNumber: 19
          }
        }, _this2._renderLine({
          skin: deprecatedSkin,
          line: line
        }), /*#__PURE__*/_react["default"].createElement("div", {
          className: _HorizontalTimelineSt.classes.icon,
          __self: _this2,
          __source: {
            fileName: _jsxFileName,
            lineNumber: 96,
            columnNumber: 21
          }
        }, icon), _this2._renderLine({
          skin: nextItemSkin,
          line: nextItemLine
        })), _this2._renderLabel({
          label: label,
          index: index,
          labelEllipsis: labelEllipsis
        })));
      }));
    }
  }]);
}(_react["default"].PureComponent);
_HorizontalTimeline = HorizontalTimeline;
HorizontalTimeline.displayName = 'HorizontalTimeline';
HorizontalTimeline.DefaultIcon = function (_ref4) {
  var _ref4$skin = _ref4.skin,
    skin = _ref4$skin === void 0 ? 'dark' : _ref4$skin;
  return /*#__PURE__*/_react["default"].createElement("div", {
    className: (0, _HorizontalTimelineIconsSt.st)(_HorizontalTimelineIconsSt.classes.upcomingIcon, {
      skin: skin
    }),
    __self: _HorizontalTimeline,
    __source: {
      fileName: _jsxFileName,
      lineNumber: 18,
      columnNumber: 5
    }
  });
};
HorizontalTimeline.ActiveIcon = function (_ref5) {
  var _ref5$skin = _ref5.skin,
    skin = _ref5$skin === void 0 ? 'dark' : _ref5$skin;
  return /*#__PURE__*/_react["default"].createElement("div", {
    className: (0, _HorizontalTimelineIconsSt.st)(_HorizontalTimelineIconsSt.classes.activeIcon, {
      skin: skin
    }),
    __self: _HorizontalTimeline,
    __source: {
      fileName: _jsxFileName,
      lineNumber: 22,
      columnNumber: 5
    }
  });
};
HorizontalTimeline.BoundaryIcon = function (_ref6) {
  var _ref6$skin = _ref6.skin,
    skin = _ref6$skin === void 0 ? 'dark' : _ref6$skin;
  return /*#__PURE__*/_react["default"].createElement("div", {
    className: (0, _HorizontalTimelineIconsSt.st)(_HorizontalTimelineIconsSt.classes.boundaryIcon, {
      skin: skin
    }),
    __self: _HorizontalTimeline,
    __source: {
      fileName: _jsxFileName,
      lineNumber: 26,
      columnNumber: 5
    }
  });
};
HorizontalTimeline.DestructiveIcon = function () {
  return /*#__PURE__*/_react["default"].createElement(_wixUiIconsCommon.StatusAlertFilled, {
    className: _HorizontalTimelineIconsSt.classes.errorIcon,
    __self: _HorizontalTimeline,
    __source: {
      fileName: _jsxFileName,
      lineNumber: 30,
      columnNumber: 5
    }
  });
};
HorizontalTimeline.CompleteIcon = function (_ref7) {
  var _ref7$skin = _ref7.skin,
    skin = _ref7$skin === void 0 ? 'dark' : _ref7$skin;
  var className = (0, _HorizontalTimelineIconsSt.st)(_HorizontalTimelineIconsSt.classes.completeIcon, {
    skin: skin
  });
  var standardSkin = /*#__PURE__*/_react["default"].createElement("div", {
    className: className,
    __self: _HorizontalTimeline,
    __source: {
      fileName: _jsxFileName,
      lineNumber: 35,
      columnNumber: 26
    }
  });
  var darkSkin = /*#__PURE__*/_react["default"].createElement(_wixUiIconsCommon.StatusCompleteFilled, {
    className: className,
    __self: _HorizontalTimeline,
    __source: {
      fileName: _jsxFileName,
      lineNumber: 36,
      columnNumber: 22
    }
  });
  return skin === 'standard' ? standardSkin : darkSkin;
};
HorizontalTimeline.defaultProps = {
  skin: 'dark',
  alignLabel: 'center',
  items: []
};
var _default = exports["default"] = HorizontalTimeline;