"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
var _typeof = require("@babel/runtime/helpers/typeof");
exports.__esModule = true;
exports["default"] = void 0;
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
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 = _interopRequireWildcard(require("react"));
var _rcSlider = _interopRequireDefault(require("rc-slider"));
var _constants = require("./constants");
var _generateId = require("../utils/generateId");
var _SliderHandle = _interopRequireDefault(require("./SliderHandle"));
var _Text = _interopRequireDefault(require("../Text"));
var _SliderSt = require("./Slider.st.css.js");
var _utils = require("./utils");
var _excluded = ["gradientColor", "onFocus", "onBlur", "pushable", "allowCross", "value", "displayMarks", "direction", "startPoint", "dataHook", "id", "ariaLabelForHandle", "rtl", "className", "disabled"];
var _jsxFileName = "/home/builduser/work/57e038ea7326c1ec/packages/wix-design-system/dist/cjs/Slider/Slider.jsx";
function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, "default": e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
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 range = function range(_ref) {
  var min = _ref.min,
    max = _ref.max,
    step = _ref.step;
  var arr = [];
  for (var i = min; i <= max; i += step) {
    arr.push(i);
  }
  return arr;
};

/**
 * A slider component with multi-range support
 */
var Slider = exports["default"] = /*#__PURE__*/function (_Component) {
  function Slider() {
    var _this;
    (0, _classCallCheck2["default"])(this, Slider);
    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
      args[_key] = arguments[_key];
    }
    _this = _callSuper(this, Slider, [].concat(args));
    _this._renderHandle = function (handleProps) {
      var _this$props = _this.props,
        gradientColor = _this$props.gradientColor,
        displayTooltip = _this$props.displayTooltip,
        disabled = _this$props.disabled,
        marks = _this$props.marks,
        dataHook = _this$props.dataHook,
        direction = _this$props.direction,
        onFocus = _this$props.onFocus,
        onBlur = _this$props.onBlur,
        formatValue = _this$props.formatValue;
      var index = handleProps.index,
        value = handleProps.value,
        min = handleProps.min,
        max = handleProps.max,
        offset = handleProps.offset,
        ref = handleProps.ref,
        ariaLabel = handleProps.ariaLabel,
        reverse = handleProps.reverse;
      var tooltipValue;
      if (_this._isCustomMarks()) {
        if (marks.hasOwnProperty(value)) {
          tooltipValue = marks[value].toString();
        }
      } else {
        tooltipValue = formatValue(value);
      }
      return /*#__PURE__*/_react["default"].createElement(_SliderHandle["default"], {
        key: index,
        gradientColor: gradientColor,
        disabled: disabled,
        displayTooltip: displayTooltip,
        tooltipValue: tooltipValue,
        handleProps: {
          ref: ref,
          offset: offset,
          min: min,
          max: max,
          value: value,
          reverse: reverse,
          ariaLabel: ariaLabel
        },
        index: index,
        dataHook: dataHook,
        direction: direction,
        onBlurCustom: onBlur,
        onFocusCustom: onFocus,
        __self: _this,
        __source: {
          fileName: _jsxFileName,
          lineNumber: 100,
          columnNumber: 7
        }
      });
    };
    _this._renderSlider = function () {
      var _this$props2 = _this.props,
        gradientColor = _this$props2.gradientColor,
        onFocus = _this$props2.onFocus,
        onBlur = _this$props2.onBlur,
        pushable = _this$props2.pushable,
        allowCross = _this$props2.allowCross,
        value = _this$props2.value,
        displayMarks = _this$props2.displayMarks,
        direction = _this$props2.direction,
        startPoint = _this$props2.startPoint,
        dataHook = _this$props2.dataHook,
        id = _this$props2.id,
        ariaLabelForHandle = _this$props2.ariaLabelForHandle,
        rtl = _this$props2.rtl,
        className = _this$props2.className,
        disabled = _this$props2.disabled,
        rest = (0, _objectWithoutProperties2["default"])(_this$props2, _excluded);
      return Array.isArray(value) && value.length > 1 ? /*#__PURE__*/_react["default"].createElement(_rcSlider["default"].Range, (0, _extends2["default"])({}, rest, {
        disabled: disabled,
        vertical: direction === 'vertical',
        railStyle: (0, _utils.getRailStyle)({
          gradientColor: gradientColor,
          disabled: disabled,
          direction: direction
        }),
        prefixCls: "wsr-slider",
        handle: _this._renderHandle,
        marks: displayMarks ? _this._getMarks() : {},
        value: value,
        pushable: pushable,
        allowCross: allowCross,
        reverse: rtl,
        ariaLabelGroupForHandles: ariaLabelForHandle,
        __self: _this,
        __source: {
          fileName: _jsxFileName,
          lineNumber: 145,
          columnNumber: 7
        }
      })) : /*#__PURE__*/_react["default"].createElement(_rcSlider["default"], (0, _extends2["default"])({}, rest, {
        disabled: disabled,
        vertical: direction === 'vertical',
        railStyle: (0, _utils.getRailStyle)({
          gradientColor: gradientColor,
          disabled: disabled,
          direction: direction
        }),
        prefixCls: "wsr-slider",
        startPoint: startPoint,
        handle: _this._renderHandle,
        marks: displayMarks ? _this._getMarks() : {},
        value: Array.isArray(value) ? value[0] : value,
        reverse: rtl,
        ariaLabelForHandle: Array.isArray(ariaLabelForHandle) ? ariaLabelForHandle[0] : ariaLabelForHandle,
        __self: _this,
        __source: {
          fileName: _jsxFileName,
          lineNumber: 160,
          columnNumber: 7
        }
      }));
    };
    return _this;
  }
  (0, _inherits2["default"])(Slider, _Component);
  return (0, _createClass2["default"])(Slider, [{
    key: "_getMarks",
    value: function _getMarks() {
      var _this2 = this;
      var marksLabels = {};
      if (this._isCustomMarks()) {
        var marks = this.props.marks;
        Object.entries(marks).forEach(function (_ref2) {
          var _ref3 = (0, _slicedToArray2["default"])(_ref2, 2),
            key = _ref3[0],
            value = _ref3[1];
          marksLabels[key] = {
            label: _this2._createMarkNode(value, true)
          };
        });
      } else {
        var _this$props3 = this.props,
          min = _this$props3.min,
          max = _this$props3.max,
          step = _this$props3.step,
          startPoint = _this$props3.startPoint;
        range({
          min: min,
          max: max,
          step: step
        }).forEach(function (entry) {
          var shouldRenderMarkLabel = entry === min || entry === max || entry === startPoint;
          marksLabels[entry] = {
            label: _this2._createMarkNode(entry, shouldRenderMarkLabel)
          };
        });
      }
      return marksLabels;
    }
  }, {
    key: "_isCustomMarks",
    value: function _isCustomMarks() {
      var marks = this.props.marks;
      return Object.entries(marks).length > 0;
    }
  }, {
    key: "_createMarkNode",
    value: function _createMarkNode(value, shouldRenderMarkLabel) {
      return /*#__PURE__*/_react["default"].createElement("div", {
        className: (0, _SliderSt.st)(_SliderSt.classes.mark, {
          direction: this.props.direction
        }),
        __self: this,
        __source: {
          fileName: _jsxFileName,
          lineNumber: 56,
          columnNumber: 7
        }
      }, /*#__PURE__*/_react["default"].createElement("div", {
        className: _SliderSt.classes.markLine,
        __self: this,
        __source: {
          fileName: _jsxFileName,
          lineNumber: 57,
          columnNumber: 9
        }
      }), /*#__PURE__*/_react["default"].createElement("div", {
        className: _SliderSt.classes.markValue,
        __self: this,
        __source: {
          fileName: _jsxFileName,
          lineNumber: 58,
          columnNumber: 9
        }
      }, shouldRenderMarkLabel && /*#__PURE__*/_react["default"].createElement(_Text["default"], {
        className: _SliderSt.classes.markLabel,
        dataHook: _constants.dataHooks.sliderMarkLabel,
        weight: "thin",
        size: "small",
        __self: this,
        __source: {
          fileName: _jsxFileName,
          lineNumber: 60,
          columnNumber: 13
        }
      }, value)));
    }
  }, {
    key: "render",
    value: function render() {
      var _this$props4 = this.props,
        dataHook = _this$props4.dataHook,
        id = _this$props4.id,
        direction = _this$props4.direction,
        className = _this$props4.className,
        gradientColor = _this$props4.gradientColor,
        marksLabelAlignment = _this$props4.marksLabelAlignment;
      var hasGradient = !!gradientColor;
      var horizontal = direction !== 'vertical';
      return /*#__PURE__*/_react["default"].createElement("div", {
        className: (0, _SliderSt.st)(_SliderSt.classes.root, {
          hasGradient: hasGradient,
          horizontal: horizontal,
          marksLabelAlignment: marksLabelAlignment
        }, className),
        id: id,
        "data-hook": dataHook,
        "data-direction": direction,
        __self: this,
        __source: {
          fileName: _jsxFileName,
          lineNumber: 194,
          columnNumber: 7
        }
      }, this._renderSlider());
    }
  }]);
}(_react.Component);
Slider.displayName = 'Slider';
Slider.defaultProps = {
  min: 1,
  max: 20,
  step: 1,
  value: 3,
  allowCross: true,
  id: (0, _generateId.generateID)(),
  displayTooltip: true,
  displayMarks: true,
  marks: {},
  rtl: false,
  disabled: false,
  direction: 'horizontal',
  startPoint: undefined,
  marksLabelAlignment: 'center',
  formatValue: function formatValue(value) {
    return value.toString();
  }
};