import React from "react";
import { Slider as AntSlider } from "antd";
import { SliderBaseProps, SliderSingleProps } from "antd/es/slider";
import { grayLighter } from "../constants";
import { SliderContainer } from "./AntSliderStyles";

export interface AntSliderProps extends SliderBaseProps, SliderSingleProps {}
export const Slider: React.FC<AntSliderProps> = (props) => {
  return (
    <SliderContainer>
      <AntSlider
        {...props}
        trackStyle={{ backgroundColor: "transparent" }}
        railStyle={{ backgroundColor: grayLighter, height: "2px" }}
        tooltip={{ open: false }}
      />
    </SliderContainer>
  );
};
