"use strict";
var __importDefault = (this && this.__importDefault) || function (mod) {
    return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.ExampleFilterSlider = void 0;
const react_1 = __importDefault(require("react"));
const react_slider_1 = __importDefault(require("react-slider"));
const ExampleFilterSlider = (props) => {
    const trackStyleEnds = {
        top: "10px",
        height: "8px",
        background: "rgb(239, 239, 239)",
        border: "1px solid rgb(179, 179, 179)",
        borderRadius: "4px",
    };
    const trackStyleMiddle = Object.assign(Object.assign({}, trackStyleEnds), { background: "rgb(2, 117, 255)", border: "1px solid rgb(74, 117, 187)" });
    return (react_1.default.createElement("div", { className: "rs__filter" },
        react_1.default.createElement("h3", { className: "rs__filter__name" }, props.filter.name),
        react_1.default.createElement("div", { className: "rs__filter__slider", style: {
                maxWidth: "300px",
                height: "26px",
                margin: "auto",
                top: "6px",
            } },
            react_1.default.createElement(react_slider_1.default, Object.assign({ thumbClassName: "rs__filter__slider__thumb" }, props.reactSliderProps, { renderTrack: (props, state) => (react_1.default.createElement("div", Object.assign({}, props, { style: Object.assign(Object.assign({}, (state.index === 1 ? trackStyleMiddle : trackStyleEnds)), props.style) }))), renderThumb: (renderProps, state) => (react_1.default.createElement("div", Object.assign({}, renderProps, { style: Object.assign({ cursor: "grab", background: "rgb(2, 117, 255)", top: "6px", width: "16px", height: "16px", borderRadius: "100%", outline: "none" }, renderProps.style) }),
                    react_1.default.createElement("span", { style: {
                            position: "absolute",
                            top: "-24px",
                            left: "-50%",
                        } },
                        props.filter.displaySliderPrefix,
                        state.valueNow,
                        props.filter.displaySliderSuffix))) })))));
};
exports.ExampleFilterSlider = ExampleFilterSlider;
//# sourceMappingURL=ExampleFilterSlider.js.map