import { __makeTemplateObject } from "tslib";
import styled, { css } from "styled-components";
import { LIGHT_THEME } from "../../../Pallette/themes";
import { getTheme } from "../../../utils/theme/getTheme";
import { defaultThemeInput } from "../../../InputBase/themes";
export var ValueContainerStyle = styled.div.attrs(function (props) { return ({
    theme: getTheme({
        theme: props.theme,
        componentName: "input",
        defaultTheme: defaultThemeInput
    })
}); })(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n  -webkit-overflow-scrolling: touch;\n  align-items: ", ";\n  box-sizing: border-box;\n  display: flex;\n  flex: 1;\n  flex-wrap: nowrap;\n  overflow-x: auto;\n  position: relative;\n\n  ::-webkit-scrollbar {\n    display: none;\n  }\n\n  ", ";\n\n  div:not(:last-child) {\n    margin-right: 4px;\n  }\n\n  input {\n    width: 1px;\n  }\n\n  .text-readonly {\n    color: ", ";\n  }\n\n  ", "\n"], ["\n  -webkit-overflow-scrolling: touch;\n  align-items: ", ";\n  box-sizing: border-box;\n  display: flex;\n  flex: 1;\n  flex-wrap: nowrap;\n  overflow-x: auto;\n  position: relative;\n\n  ::-webkit-scrollbar {\n    display: none;\n  }\n\n  ", ";\n\n  div:not(:last-child) {\n    margin-right: 4px;\n  }\n\n  input {\n    width: 1px;\n  }\n\n  .text-readonly {\n    color: ", ";\n  }\n\n  ", "\n"])), function (_a) {
    var size = _a.size;
    return (size === "l" ? "center" : "end");
}, function (_a) {
    var isReadOnly = _a.isReadOnly, isDisabled = _a.isDisabled;
    return isReadOnly || isDisabled
        ? css(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n          margin-right: 16px;\n        "], ["\n          margin-right: 16px;\n        "]))) : css(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n          margin-right: 19px;\n        "], ["\n          margin-right: 19px;\n        "])));
}, function (_a) {
    var theme = _a.theme;
    return theme.components.input.colorReadOnly;
}, function (_a) {
    var isFocused = _a.isFocused, isHasValue = _a.isHasValue, isMulti = _a.isMulti, isReadOnly = _a.isReadOnly, size = _a.size;
    return (isFocused || isHasValue || isReadOnly) &&
        isMulti &&
        (size === "m"
            ? css(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n          margin-top: 7px;\n        "], ["\n          margin-top: 7px;\n        "]))) : css(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n          margin-top: 11px;\n        "], ["\n          margin-top: 11px;\n        "]))));
});
ValueContainerStyle.defaultProps = {
    theme: LIGHT_THEME
};
var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5;
