React: Erro "No overload matches this call." ao passar props direto para um atributo html.

Estou recebendo esse problema sempre que tento declarar a prop e passá-la diretamente para um atributo html do componente. No caso estou tentando passar o placeholder e o type via prop e apesar de funcionar, estou recebendo esse erro no VSCode "No overload matches this call."

const Input = ({ $marginBottom, $placeholder, $type }: InputProps) => (
  <StyledInput
    $marginBottom={$marginBottom}
    placeholder={$placeholder}
    type={$type}
  />
)

Se eu declarar o valor da prop antes de passar para o atributo html o erro some, porém não me parece a forma correta já que acaba gerando uma repetição de declarações.

const Input = ({ $marginBottom, $placeholder, $type }: InputProps) => (
  <StyledInput
    $marginBottom={$marginBottom}
    $placeholder={$placeholder}
    placeholder={$placeholder}
    $type={$type}
    type={$type}
  />
)

Já tentei de tudo e nada mais parece funcionar, não sei se estou errando algo na tipagem ou na declaração das props. Inclusive, sempre que crio uma prop preciso passar ela dentro do componente como um atributo justamente para não ter esse mesmo erro, no caso o $marginBottom não é um atributo html, mas preciso declarar $marginBottom={$marginBottom} dentro do componente por conta desse erro.