Variable "$input" got invalid value "1" at "input.sport"; Int cannot represent non-integer value: "1"

Question

I have a set of radio controls that allow you to choose a sport.

<RadioField name="sport" value={parseInt('1')} /> Basketball
<RadioField name="sport" value={parseInt('2')} /> Football
<RadioField name="sport" value={parseInt('3')} /> Baseball

When this form is submitted, it runs this snippet of GraphQL:

const CREATE_LEAGUE = gql`
  mutation CreateLeagueMutation($input: CreateLeagueInput!) {
    createLeague(input: $input) {
      id
    }
  }
`

For some reason, whenever this runs, I get a 400 HTTP error which then states:

api | GraphQLError: Variable "$input" got invalid value "2" at "input.sport"; Int cannot represent non-integer value: "2"api |     at createGraphQLError (A:\Node\profrec\node_modules\@graphql-tools\utils\cjs\errors.js:9:12)
api |     at A:\Node\profrec\node_modules\@graphql-tools\executor\cjs\execution\values.js:73:52
api |     at coerceInputValueImpl (A:\Node\profrec\node_modules\graphql\utilities\coerceInputValue.js:154:9)
api |     at coerceInputValueImpl (A:\Node\profrec\node_modules\graphql\utilities\coerceInputValue.js:49:14)
api |     at coerceInputValueImpl (A:\Node\profrec\node_modules\graphql\utilities\coerceInputValue.js:117:34)
api |     at coerceInputValueImpl (A:\Node\profrec\node_modules\graphql\utilities\coerceInputValue.js:49:14)
api |     at coerceInputValue (A:\Node\profrec\node_modules\graphql\utilities\coerceInputValue.js:32:10)
api |     at coerceVariableValues (A:\Node\profrec\node_modules\@graphql-tools\executor\cjs\execution\values.js:68:65)   
api |     at getVariableValues (A:\Node\profrec\node_modules\@graphql-tools\executor\cjs\execution\values.js:19:25)      
api |     at buildExecutionContext (A:\Node\profrec\node_modules\@graphql-tools\executor\cjs\execution\execute.js:165:69)

It seems that parseInt('2') somehow returns a string although it should be returning a number, which is why I believe this error is being caused.