import React from "react";
import { bool, func, node, number } from "prop-types";
import RcSlider from "rc-slider";
import "rc-slider/assets/index.css";
import "./slider.css";
var SliderWithTooltip = RcSlider.createSliderWithTooltip(RcSlider);
var Range = RcSlider.createSliderWithTooltip(RcSlider.Range);

var Slider = function Slider(_ref) {
  var min = _ref.min,
      max = _ref.max,
      onChange = _ref.onChange,
      showStepMarkers = _ref.showStepMarkers,
      step = _ref.step,
      value = _ref.value,
      SliderComponent = _ref.SliderComponent;
  return React.createElement("span", {
    className: "civic-slider-container"
  }, React.createElement(SliderComponent, {
    dots: showStepMarkers,
    min: min,
    max: max,
    step: step,
    value: value,
    onChange: onChange
  }));
};

Slider.SliderWithTooltip = function (props) {
  return React.createElement("span", {
    className: "civic-slider-container"
  }, React.createElement(SliderWithTooltip, props));
};

Slider.SliderWithRange = function (props) {
  return React.createElement("span", {
    className: "civic-slider-container"
  }, React.createElement(Range, props));
};

Slider.propTypes = {
  max: number.isRequired,
  min: number.isRequired,
  onChange: func.isRequired,
  showStepMarkers: bool,
  step: number,
  value: number.isRequired,
  SliderComponent: node
};
Slider.defaultProps = {
  showStepMarkers: false,
  step: 1,
  SliderComponent: RcSlider
};
export default Slider;