"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.Content = exports.Wrapper = void 0;
const styled_1 = require("../../styled");
const getBorderColor = (theme, isLoading, isError) => {
    if (isLoading) {
        return 'transparent';
    }
    if (isError) {
        return theme.palette.error[400];
    }
    return theme.palette.components.border.default;
};
exports.Wrapper = (0, styled_1.styled)('div', {
    shouldForwardProp: (prop) => !['$isLoading', '$isError'].includes(prop),
}) `
  display: grid;
  grid-template-columns: ${({ $isLoading }) => $isLoading ? '1fr 32px' : '1fr 96px'};
  gap: ${({ theme }) => theme.spacing(2)};
  align-items: center;

  min-height: 56px;
  padding: ${({ theme }) => theme.spacing(2, 4)};

  border: ${({ theme, $isLoading, $isError }) => `1px solid ${getBorderColor(theme, $isLoading, $isError)}`};
  border-radius: ${({ theme }) => theme.shape.medium};

  &:not(:last-of-type) {
    margin-bottom: ${({ theme }) => theme.spacing(2)};
  }
`;
exports.Content = styled_1.styled.div `
  overflow: hidden;
`;
