Export const Input = styled.input<{ isError: boolean | undefined

Question

Export const Input = styled.input<{ isError: boolean | undefined

| string;
width: number;
textAlign: string;
fontSize: {
m: number;
t: number;
};
division: {
m: number;
t: number;
};
sizeInput: number;
minWidth: number | undefined;
}>`
font-family: LiberGrotesqueBlack, sans-serif;
color: ${Colors.emperor};
font-size: ${({ fontSize }) => ${fontSize.m}px};
width: ${({ sizeInput, fontSize, division }) =>
${(sizeInput + 1) * (fontSize.m / division.m)}px};
text-align: ${({ textAlign }) => textAlign};
min-width: ${({ minWidth }) => (minWidth ? ${minWidth}px : 'auto')};
border-bottom: ${({ isError, width }) =>
${width}px solid ${isError ? Colors.burningOrange : Colors.dodgerBlue}};

${media.tablet`
font-size: ${({ fontSize }) => ${fontSize.t}px};
width: ${({ sizeInput, fontSize, division }) =>
${(sizeInput + 1) * (fontSize.t / division.t)}px};
`}
`;

Инпут расширяется при вводе символов, по идеи не должен создаваться новый класс на ввод, но создается