import { __makeTemplateObject } from "tslib";
import styled from "styled-components";
import P2 from "../typography/P2";
import { LIGHT_THEME } from "../Pallette/themes";
import { getTheme } from "../utils/theme/getTheme";
import { defaultThemeInput } from "../InputBase/themes";
import { defineResponsibleWidth } from "../utils/defineResponsibleSize";
import InputDate from "./components/InputDate";
export var DatePickerWrapper = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  position: relative;\n  display: block;\n  ", ";\n"], ["\n  position: relative;\n  display: block;\n  ", ";\n"])), function (_a) {
    var width = _a.width;
    return defineResponsibleWidth(width);
});
export var InputDateWrapper = styled.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  display: block;\n"], ["\n  display: block;\n"])));
InputDateWrapper.defaultProps = {
    theme: LIGHT_THEME
};
export var CalendarWrapper = styled.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  position: absolute;\n  left: 0;\n  margin-top: 4px;\n  z-index: 3;\n"], ["\n  position: absolute;\n  left: 0;\n  margin-top: 4px;\n  z-index: 3;\n"])));
export var StyledInputDate = styled(InputDate)(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n  pointer-events: ", ";\n"], ["\n  pointer-events: ", ";\n"])), function (p) { return (p.isReadOnly || p.isDisabled ? "none" : "auto"); });
StyledInputDate.defaultProps = {
    theme: LIGHT_THEME
};
export var Error = styled(P2).attrs(function (props) { return ({
    theme: getTheme({
        theme: props.theme,
        defaultTheme: defaultThemeInput,
        componentName: "input"
    })
}); })(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n  display: inline-flex;\n  margin-top: 9px;\n  margin-left: 20px;\n  max-height: max-content;\n  overflow: hidden;\n  ", "\n"], ["\n  display: inline-flex;\n  margin-top: 9px;\n  margin-left: 20px;\n  max-height: max-content;\n  overflow: hidden;\n  ", "\n"])), function (_a) {
    var theme = _a.theme;
    return "\n    color: " + theme.components.input.colorError + ";\n  ";
});
Error.defaultProps = {
    theme: LIGHT_THEME
};
var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5;
