Syntax error entering spaces into number input

[nwhittaker]

Check existing issues

• I have checked for existing issues to avoid duplicates

Actual Behavior

Given a <calcite-input-number> element, type in a number, then hit the space key with increasing frequency (timing appears to be a factor) until a period appears after the number. At this point an Uncaught SyntaxError message should appear in the console. Also the number of spaces entered trails the period until the input is next focused.

Screen.Recording.2025-03-06.at.5.06.22.PM.mov

Expected Behavior

Space keys are ignored and do not impact the value of the input.

Reproduction Sample

https://developers.arcgis.com/calcite-design-system/components/input-number/

Reproduction Steps

1. Visit the doc page, open the devtools console.
2. Focus the input and type in a number (in my case, 1).
3. Rapidly hit the space key until a SyntaxError appears in the console.

Alternative reproduction steps

Programmatically setting a <calcite-input-number> element's value property to some number with a trailing space also triggers the exception.

const inputNumber = document.querySelector('calcite-input-number')
inputNumber.value = '1 '

Reproduction Version

3.0.3

Relevant Info

The . period is likely due to a platform keyboard shortcut where two spaces following a character translate to the end of a sentence.

Stack trace

Uncaught SyntaxError: Cannot convert 1   0000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000 to a BigInt (at DWSKOILM.js:4:288)
    at BigInt (<anonymous>)
    at new t (DWSKOILM.js:4:288)
    at T (DWSKOILM.js:4:2178)
    at DWSKOILM.js:4:2131
    at g (DWSKOILM.js:4:2488)
    at U (DWSKOILM.js:4:2047)
    at N.setNumberValue (YW6WV5X7.js:4:20681)
    at N.inputNumberInputHandler (YW6WV5X7.js:4:18051)
    at ft.handleEvent (74XIV7EB.js:6:6058)

Regression?

No response

Priority impact

impact - p2 - want for an upcoming milestone

Impact

It's an unlikely value for a user to enter, but more likely by QA for testing validation handling.

Calcite package

• @esri/calcite-components
• @esri/calcite-components-react
• @esri/calcite-design-tokens
• @esri/calcite-ui-icons
• @esri/eslint-plugin-calcite-components

Esri team

ArcGIS Field Apps