(function (factory) {
    if (typeof module === "object" && typeof module.exports === "object") {
        var v = factory(require, exports);
        if (v !== undefined) module.exports = v;
    }
    else if (typeof define === "function" && define.amd) {
        define(["require", "exports", "tslib", "styled-components", "../Pallette/themes", "../utils/theme/getTheme", "../Tag", "./themes"], factory);
    }
})(function (require, exports) {
    "use strict";
    Object.defineProperty(exports, "__esModule", { value: true });
    exports.SliderTrailTextWrapper = exports.SliderLeadTextWrapper = exports.SliderInputStyled = exports.SliderWrapper = exports.TagStyled = void 0;
    var tslib_1 = require("tslib");
    var styled_components_1 = (0, tslib_1.__importStar)(require("styled-components"));
    var themes_1 = require("../Pallette/themes");
    var getTheme_1 = require("../utils/theme/getTheme");
    var Tag_1 = (0, tslib_1.__importDefault)(require("../Tag"));
    var themes_2 = require("./themes");
    var COMPONENT_NAME = "slider";
    exports.TagStyled = (0, styled_components_1.default)(Tag_1.default)(templateObject_3 || (templateObject_3 = (0, tslib_1.__makeTemplateObject)(["\n  position: absolute;\n  z-index: 3;\n  transition: none;\n  user-select: none;\n\n  ", ";\n"], ["\n  position: absolute;\n  z-index: 3;\n  transition: none;\n  user-select: none;\n\n  ", ";\n"])), function (_a) {
        var direction = _a.direction, sizeSlider = _a.sizeSlider;
        return direction === "horizontal"
            ? (0, styled_components_1.css)(templateObject_1 || (templateObject_1 = (0, tslib_1.__makeTemplateObject)(["\n          margin-top: ", "px;\n          margin-left: -11px;\n        "], ["\n          margin-top: ", "px;\n          margin-left: -11px;\n        "])), sizeSlider === "m" ? 20 : 11) : (0, styled_components_1.css)(templateObject_2 || (templateObject_2 = (0, tslib_1.__makeTemplateObject)([""], [""])));
    });
    exports.SliderWrapper = styled_components_1.default.div(templateObject_10 || (templateObject_10 = (0, tslib_1.__makeTemplateObject)(["\n  padding: ", ";\n  position: relative;\n  display: flex;\n  flex-direction: column;\n  ", "\n\n  .sliders_control {\n    position: relative;\n    ", "\n  }\n\n  #fromSlider {\n    height: 0;\n    z-index: 1;\n    margin-top: ", "px;\n  }\n"], ["\n  padding: ", ";\n  position: relative;\n  display: flex;\n  flex-direction: column;\n  ", "\n\n  .sliders_control {\n    position: relative;\n    ", "\n  }\n\n  #fromSlider {\n    height: 0;\n    z-index: 1;\n    margin-top: ", "px;\n  }\n"])), function (_a) {
        var size = _a.size;
        return size === "m" ? "12px 8px 8px 8px" : "10px 4px 4px 4px";
    }, function (_a) {
        var direction = _a.direction, height = _a.height, width = _a.width;
        return direction === "horizontal"
            ? (0, styled_components_1.css)(templateObject_5 || (templateObject_5 = (0, tslib_1.__makeTemplateObject)(["\n          width: ", ";\n          ", ";\n          min-width: 150px;\n        "], ["\n          width: ", ";\n          ", ";\n          min-width: 150px;\n        "])), width || "100%", height && (0, styled_components_1.css)(templateObject_4 || (templateObject_4 = (0, tslib_1.__makeTemplateObject)(["\n            height: ", ";\n          "], ["\n            height: ", ";\n          "])), height)) : (0, styled_components_1.css)(templateObject_7 || (templateObject_7 = (0, tslib_1.__makeTemplateObject)(["\n          height: ", ";\n          max-width: 100%;\n          ", "\n        "], ["\n          height: ", ";\n          max-width: 100%;\n          ", "\n        "])), height || "100%", width && (0, styled_components_1.css)(templateObject_6 || (templateObject_6 = (0, tslib_1.__makeTemplateObject)(["\n            width: ", ";\n          "], ["\n            width: ", ";\n          "])), width));
    }, function (_a) {
        var direction = _a.direction, size = _a.size;
        return direction === "horizontal"
            ? (0, styled_components_1.css)(templateObject_8 || (templateObject_8 = (0, tslib_1.__makeTemplateObject)(["\n            height: ", "px;\n          "], ["\n            height: ", "px;\n          "])), size === "m" ? 8 : 4) : (0, styled_components_1.css)(templateObject_9 || (templateObject_9 = (0, tslib_1.__makeTemplateObject)(["\n            height: 100%;\n          "], ["\n            height: 100%;\n          "])));
    }, function (_a) {
        var size = _a.size;
        return (size === "m" ? 4 : 2);
    });
    exports.SliderInputStyled = styled_components_1.default.input.attrs(function (props) { return ({
        theme: (0, getTheme_1.getTheme)({
            theme: props.theme,
            defaultTheme: themes_2.defaultThemeSlider,
            componentName: COMPONENT_NAME
        })
    }); })(templateObject_21 || (templateObject_21 = (0, tslib_1.__makeTemplateObject)(["\n  -webkit-appearance: none;\n  appearance: none;\n  height: ", "px;\n  width: 100%;\n  position: absolute;\n  pointer-events: none;\n  border-radius: 4px;\n  ", "\n\n  ", ";\n\n  &::-webkit-slider-thumb {\n    -webkit-appearance: none;\n    pointer-events: all;\n    ", "\n    ", ";\n    border-radius: 6px;\n    cursor: pointer;\n  }\n\n  &::-moz-range-thumb {\n    -webkit-appearance: none;\n    pointer-events: all;\n    ", "\n    ", ";\n    border-radius: 4px;\n    cursor: pointer;\n  }\n\n  &::-webkit-slider-thumb:hover {\n    ", ";\n  }\n\n  &::-webkit-slider-thumb:active {\n    ", ";\n  }\n\n  &:disabled {\n    &::-webkit-slider-thumb {\n      background-color: ", ";\n    }\n\n    &::-moz-range-thumb {\n      background-color: ", ";\n    }\n  }\n"], ["\n  -webkit-appearance: none;\n  appearance: none;\n  height: ", "px;\n  width: 100%;\n  position: absolute;\n  pointer-events: none;\n  border-radius: 4px;\n  ", "\n\n  ", ";\n\n  &::-webkit-slider-thumb {\n    -webkit-appearance: none;\n    pointer-events: all;\n    ", "\n    ", ";\n    border-radius: 6px;\n    cursor: pointer;\n  }\n\n  &::-moz-range-thumb {\n    -webkit-appearance: none;\n    pointer-events: all;\n    ", "\n    ", ";\n    border-radius: 4px;\n    cursor: pointer;\n  }\n\n  &::-webkit-slider-thumb:hover {\n    ", ";\n  }\n\n  &::-webkit-slider-thumb:active {\n    ", ";\n  }\n\n  &:disabled {\n    &::-webkit-slider-thumb {\n      background-color: ", ";\n    }\n\n    &::-moz-range-thumb {\n      background-color: ", ";\n    }\n  }\n"])), function (_a) {
        var sizeS = _a.sizeS;
        return (sizeS === "m" ? 8 : 4);
    }, function (_a) {
        var theme = _a.theme;
        return (0, styled_components_1.css)(templateObject_11 || (templateObject_11 = (0, tslib_1.__makeTemplateObject)(["\n    background-color: ", ";\n  "], ["\n    background-color: ", ";\n  "])), theme.components[COMPONENT_NAME].background);
    }, function (_a) {
        var direction = _a.direction;
        return direction === "vertical" && (0, styled_components_1.css)(templateObject_12 || (templateObject_12 = (0, tslib_1.__makeTemplateObject)(["\n      transform: rotate(-90deg) translateX(-96%) translateY(40px);\n      transform-origin: left;\n    "], ["\n      transform: rotate(-90deg) translateX(-96%) translateY(40px);\n      transform-origin: left;\n    "])));
    }, function (_a) {
        var sizeS = _a.sizeS;
        return sizeS === "m"
            ? (0, styled_components_1.css)(templateObject_13 || (templateObject_13 = (0, tslib_1.__makeTemplateObject)(["\n            width: 16px;\n            height: 16px;\n          "], ["\n            width: 16px;\n            height: 16px;\n          "]))) : (0, styled_components_1.css)(templateObject_14 || (templateObject_14 = (0, tslib_1.__makeTemplateObject)(["\n            width: 10px;\n            height: 10px;\n          "], ["\n            width: 10px;\n            height: 10px;\n          "])));
    }, function (_a) {
        var theme = _a.theme, status = _a.status;
        return (0, styled_components_1.css)(templateObject_15 || (templateObject_15 = (0, tslib_1.__makeTemplateObject)(["\n      background-color: ", ";\n      border: 2px solid ", ";\n    "], ["\n      background-color: ", ";\n      border: 2px solid ", ";\n    "])), theme.components[COMPONENT_NAME]["background" + (status.charAt(0).toUpperCase() + status.slice(1))], theme.components[COMPONENT_NAME].borderColor);
    }, function (_a) {
        var sizeS = _a.sizeS;
        return sizeS === "m"
            ? (0, styled_components_1.css)(templateObject_16 || (templateObject_16 = (0, tslib_1.__makeTemplateObject)(["\n            width: 12px;\n            height: 12px;\n          "], ["\n            width: 12px;\n            height: 12px;\n          "]))) : (0, styled_components_1.css)(templateObject_17 || (templateObject_17 = (0, tslib_1.__makeTemplateObject)(["\n            width: 8px;\n            height: 8px;\n          "], ["\n            width: 8px;\n            height: 8px;\n          "])));
    }, function (_a) {
        var theme = _a.theme, status = _a.status;
        return (0, styled_components_1.css)(templateObject_18 || (templateObject_18 = (0, tslib_1.__makeTemplateObject)(["\n      background-color: ", ";\n      border: 2px solid ", ";\n    "], ["\n      background-color: ", ";\n      border: 2px solid ", ";\n    "])), theme.components[COMPONENT_NAME]["background" + (status.charAt(0).toUpperCase() + status.slice(1))], theme.components[COMPONENT_NAME].borderColor);
    }, function (_a) {
        var theme = _a.theme, status = _a.status;
        return (0, styled_components_1.css)(templateObject_19 || (templateObject_19 = (0, tslib_1.__makeTemplateObject)(["\n      background-color: ", ";\n    "], ["\n      background-color: ", ";\n    "])), theme.components[COMPONENT_NAME]["background" + (status.charAt(0).toUpperCase() + status.slice(1)) + "Hover"]);
    }, function (_a) {
        var theme = _a.theme, status = _a.status;
        return (0, styled_components_1.css)(templateObject_20 || (templateObject_20 = (0, tslib_1.__makeTemplateObject)(["\n      background-color: ", ";\n    "], ["\n      background-color: ", ";\n    "])), theme.components[COMPONENT_NAME]["background" + (status.charAt(0).toUpperCase() + status.slice(1)) + "Pressed"]);
    }, function (_a) {
        var theme = _a.theme;
        return theme.components[COMPONENT_NAME].backgroundThumbDisabled;
    }, function (_a) {
        var theme = _a.theme;
        return theme.components[COMPONENT_NAME].backgroundThumbDisabled;
    });
    exports.SliderInputStyled.defaultProps = {
        theme: themes_1.LIGHT_THEME
    };
    exports.SliderLeadTextWrapper = styled_components_1.default.div.attrs(function (props) { return ({
        theme: (0, getTheme_1.getTheme)({
            theme: props.theme,
            defaultTheme: themes_2.defaultThemeSlider,
            componentName: COMPONENT_NAME
        })
    }); })(templateObject_22 || (templateObject_22 = (0, tslib_1.__makeTemplateObject)(["\n  margin-bottom: ", "px;\n  display: flex;\n  width: 100%;\n\n  color: ", ";\n\n  .slider__lead-text {\n    margin-right: 8px;\n  }\n\n  .slider__trail-text {\n    margin-right: 0;\n    margin-left: auto;\n  }\n\n  span {\n    text-overflow: ellipsis;\n    overflow: hidden;\n  }\n"], ["\n  margin-bottom: ", "px;\n  display: flex;\n  width: 100%;\n\n  color: ", ";\n\n  .slider__lead-text {\n    margin-right: 8px;\n  }\n\n  .slider__trail-text {\n    margin-right: 0;\n    margin-left: auto;\n  }\n\n  span {\n    text-overflow: ellipsis;\n    overflow: hidden;\n  }\n"])), function (_a) {
        var size = _a.size;
        return (size === "m" ? "16" : "10");
    }, function (_a) {
        var theme = _a.theme;
        return theme.components[COMPONENT_NAME].color;
    });
    exports.SliderLeadTextWrapper.defaultProps = {
        theme: themes_1.LIGHT_THEME
    };
    exports.SliderTrailTextWrapper = styled_components_1.default.div.attrs(function (props) { return ({
        theme: (0, getTheme_1.getTheme)({
            theme: props.theme,
            defaultTheme: themes_2.defaultThemeSlider,
            componentName: COMPONENT_NAME
        })
    }); })(templateObject_23 || (templateObject_23 = (0, tslib_1.__makeTemplateObject)(["\n  margin-bottom: ", "px;\n  display: flex;\n  width: 100%;\n  justify-content: ", ";\n\n  color: ", ";\n\n  span {\n    text-overflow: ellipsis;\n    overflow: hidden;\n  }\n"], ["\n  margin-bottom: ", "px;\n  display: flex;\n  width: 100%;\n  justify-content: ", ";\n\n  color: ", ";\n\n  span {\n    text-overflow: ellipsis;\n    overflow: hidden;\n  }\n"])), function (_a) {
        var size = _a.size;
        return (size === "m" ? "16" : "10");
    }, function (_a) {
        var direction = _a.direction;
        return direction === "horizontal" ? "right" : "flex-start";
    }, function (_a) {
        var theme = _a.theme;
        return theme.components[COMPONENT_NAME].color;
    });
    exports.SliderTrailTextWrapper.defaultProps = {
        theme: themes_1.LIGHT_THEME
    };
    var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7, templateObject_8, templateObject_9, templateObject_10, templateObject_11, templateObject_12, templateObject_13, templateObject_14, templateObject_15, templateObject_16, templateObject_17, templateObject_18, templateObject_19, templateObject_20, templateObject_21, templateObject_22, templateObject_23;
});
