"use strict";
var __importDefault = (this && this.__importDefault) || function (mod) {
    return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.StyledToggleButtonGroup = void 0;
const ToggleButtonGroup_1 = __importDefault(require("@mui/material/ToggleButtonGroup"));
const styled_1 = require("../styled");
exports.StyledToggleButtonGroup = (0, styled_1.styled)(ToggleButtonGroup_1.default, {
    shouldForwardProp: (prop) => !['$isError'].includes(prop),
}) `
  position: relative;
  
  /* Border для ToggleButtonGroup рисуется через ::after что бы не нарушать обводку кнопок внутри компонента и корректно отображать состояние ошибки */ 
  &::after {
    pointer-events: none;
    content: "";

    position: absolute;
    z-index: ${({ $isError }) => ($isError ? '1' : '0')};
    inset: 0;

    border: 1px solid ${({ $isError, theme }) => ($isError ? theme.palette.error[700] : 'transparent')};
    border-radius: ${({ theme }) => theme.shape.medium}
  }
`;
