"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});

const tslib_1 = require("tslib");

const react_1 = tslib_1.__importDefault(require("react"));

const exotic_1 = require("exotic");

const styled_1 = require("./styled");

function defaultRangeValues(props, state) {
  const {
    currencyType,
    currencyOrder
  } = props;
  const minCount = currencyOrder === 'left' ? `${currencyType} ${state.selectedMinValue}` : `${state.selectedMinValue} ${currencyType}`;
  const maxCount = currencyOrder === 'left' ? `${currencyType} ${state.selectedMaxValue}` : `${state.selectedMaxValue} ${currencyType}`;
  return react_1.default.createElement(styled_1.FlexSpacing, null, react_1.default.createElement(styled_1.MinValue, null, minCount), react_1.default.createElement(styled_1.MaxValue, null, maxCount));
}

exports.defaultRangeValues = defaultRangeValues;

function defaultSliderInput(props, state) {
  const {
    maxValue,
    color,
    onMinChange,
    onMaxChange,
    selectedMinValue,
    selectedMaxValue
  } = props;
  const inputAttributes = {
    type: 'range',
    step: props.stepValue,
    min: state.minValue,
    max: maxValue,
    selectedMinValue: selectedMinValue,
    selectedMaxValue: selectedMaxValue,
    list: 'stepDots',
    state
  };

  const setTargetValue = event => {
    return event && event.target && exotic_1.isSafe(event.target.value) && parseInt(event.target.value, 10);
  };

  const handleMinChange = event => {
    state.setSelectedMin(setTargetValue(event));

    if (exotic_1.isFunction(onMinChange)) {
      onMinChange({
        selectedMinValue: state.selectedMinValue,
        selectedMaxValue: state.selectedMaxValue
      });
    }
  };

  const handleMaxChange = event => {
    state.setSelectedMax(setTargetValue(event));

    if (exotic_1.isFunction(onMaxChange)) {
      onMaxChange({
        selectedMinValue: state.selectedMinValue,
        selectedMaxValue: state.selectedMaxValue
      });
    }
  };

  const renderOption = args => {
    const {
      value,
      index
    } = args;
    return react_1.default.createElement(styled_1.StyledDataListBullets, {
      value: value,
      key: index
    });
  };

  return react_1.default.createElement(styled_1.SliderWrapper, null, react_1.default.createElement(styled_1.InputWrapper, Object.assign({}, inputAttributes, {
    color: color
  }), react_1.default.createElement(styled_1.StyledMinValueInput, Object.assign({
    className: 'minValue',
    id: 'minValue',
    value: state.selectedMinValue,
    onChange: handleMinChange
  }, inputAttributes, {
    color: color
  })), react_1.default.createElement(styled_1.StyledMaxValueInput, Object.assign({
    className: 'maxValue',
    id: 'maxValue',
    value: state.selectedMaxValue,
    onChange: handleMaxChange
  }, inputAttributes, {
    color: color
  }))), react_1.default.createElement(styled_1.StyledDataList, {
    id: 'stepDots'
  }, state.optionList.map(renderOption)));
}

exports.defaultSliderInput = defaultSliderInput;

function defaultRenderBox(props, state) {
  const {
    renderSliderInput,
    renderRangeValues
  } = props,
        remainingProps = tslib_1.__rest(props, ["renderSliderInput", "renderRangeValues"]);

  return react_1.default.createElement(react_1.default.Fragment, null, renderRangeValues(remainingProps, state), renderSliderInput(remainingProps, state));
}

exports.defaultRenderBox = defaultRenderBox;

function defaultRenderWrapper(props) {
  const {
    className,
    dataQa,
    children,
    ariaAttributes
  } = props;
  return react_1.default.createElement(styled_1.Wrapper, Object.assign({
    className: className,
    "data-qa": dataQa
  }, ariaAttributes), children);
}

exports.defaultRenderWrapper = defaultRenderWrapper; //# sourceMappingURL=renderProps.js.map