Formatting numbers without affecting value

[viveleroi]

Is there a way to provide a number formatter? We're moving away from rc-number-inout which accepted a formatter function that would format the value for display, but wouldn't change the "raw" value held in the form.

I'm wanting to comma-separate the values so if a use types 1000 it turns into 1,000. I tried using the locale option thinking that would work via toLocaleString but it doesn't appear to have made a difference.

My goal is for the value in the form to remain a number but the displayed value should be a string with commas.

  <NumericInput
    allowNumericCharactersOnly
    className={styles.numberInput}
    disabled={disabled}
    inputClassName={classNames}
    leftElement={<CurrencySymbol enabled={currency} />}
    locale='en-US'
    minorStepSize={minorStepSize}
    name={name}
    readOnly={readOnly}
    required={required}
    value={value as string}
    {...props}
    onBlur={onBlur}
    onValueChange={(valueAsNumber, valueAsString): void => {
      onChange(valueAsString)
    }}
  />

I tried formatting it on change but I've realized that's way to finnicky because I have constantly convert to/from strings/numbers.