import styled from "@emotion/styled";
import { applyEllipsis } from "../../../../../../mixins";
import { component, mergeConfig } from "../../../../../../engines";
import { buttonConfig, buttonTokens } from "../../../../../Button";
import { IconDisclosureDownCentered } from "../../../../../_Icon";
import { tokens, classes, constants } from "../../../../Select.tokens";
var mergedButtonConfig = mergeConfig(buttonConfig);
var Button = component(mergedButtonConfig);
export var StyledButton = /*#__PURE__*/ styled(Button, {
    target: "e1b8amja0",
    label: "StyledButton"
})(buttonTokens.buttonColor, ":var(", tokens.buttonColor, ");", buttonTokens.buttonColorHover, ":var(", tokens.buttonColorHover, ");", buttonTokens.buttonColorActive, ":var(", tokens.buttonColorActive, ");", buttonTokens.buttonBackgroundColor, ":var(", tokens.buttonBackgroundColor, ");", buttonTokens.buttonBackgroundColorHover, ":var(", tokens.buttonBackgroundColorHover, ");", buttonTokens.buttonBackgroundColorActive, ":var(", tokens.buttonBackgroundColorActive, ");", buttonTokens.buttonRightContentMargin, ":var(", tokens.buttonArrowMargin, ");", buttonTokens.buttonHeight, ":var(", tokens.targetHeight, ");", buttonTokens.buttonWidth, ":100%;", buttonTokens.buttonPadding, ":var(", tokens.buttonPadding, ");", buttonTokens.buttonRadius, ":var(", tokens.borderRadius, ");", buttonTokens.buttonFontFamily, ":var(", tokens.fontFamily, ");", buttonTokens.buttonFontSize, ":var(", tokens.fontSize, ");", buttonTokens.buttonFontStyle, ":var(", tokens.fontStyle, ");", buttonTokens.buttonFontWeight, ":var(", tokens.fontWeight, ");", buttonTokens.buttonLetterSpacing, ":var(", tokens.fontLetterSpacing, ");", buttonTokens.buttonLineHeight, ":var(", tokens.fontLineHeight, ");", buttonTokens.buttonDisabledOpacity, ":", constants.opacity, ";", buttonTokens.buttonFocusColor, ":var(", constants.focusColor, ");text-align:left;");
export var IconArrowWrapper = /*#__PURE__*/ styled("div", {
    target: "e1b8amja1",
    label: "IconArrowWrapper"
})("line-height:0;color:var(", tokens.buttonArrowColor, ");&:hover{color:var(", tokens.buttonArrowColorHover, ");}&:active{color:var(", tokens.buttonArrowColorActive, ");}");
// TODO: Удалить после поддержки JS переменных в конфиге компонент
export var sizeMap = {
    xs: '1rem',
    s: '1.5rem'
};
export var StyledArrow = /*#__PURE__*/ styled(IconDisclosureDownCentered, {
    target: "e1b8amja2",
    label: "StyledArrow"
})("transition:color 0.3s ease-in,transform 0.15s ease-in;pointer-events:none;user-select:none;width:", function(param) {
    var _param_size = param.size, size = _param_size === void 0 ? 'xs' : _param_size;
    return "var(".concat(tokens.disclosureIconSize, ", ").concat(sizeMap[size], ")");
}, ";height:", function(param) {
    var _param_size = param.size, size = _param_size === void 0 ? 'xs' : _param_size;
    return "var(".concat(tokens.disclosureIconSize, ", ").concat(sizeMap[size], ")");
}, ";");
export var ButtonWrapper = /*#__PURE__*/ styled("div", {
    target: "e1b8amja3",
    label: "ButtonWrapper"
})("display:inline;.", classes.selectWithoutBoxShadow, "::before{box-shadow:none !important;}.", classes.arrowInverse, "{transform:rotate(-180deg);}");
export var Label = /*#__PURE__*/ styled("div", {
    target: "e1b8amja4",
    label: "Label"
})("display:inline;width:100%;text-align:left;", applyEllipsis());
