[Issue]: How to format number in NumberInput

[alamenai]

Tremor Version

latest

Link to minimal reproduction

.

Steps to reproduce

I have a NumberInput and I want the German number format. In German, they use comma , instead of . fr their float numbers.

Code

 const handleNumberInputChange = (property: string, value: number) => {

   // Currently, the user enters numbers in this format 1.1 | 2.2
  // However, I want him that format 1,1 | 2,2
    dispatch(updatePanelMeasures({ ...measures, [property]: value }))
  }

 <NumberInput
          icon={TextQuote}
          placeholder='1.1'
          max={1}
          min={0.1}
          step={0.1}
          className='mt-2 min-h-11'
          value={measures.border}
          onValueChange={(border) => handleNumberInputChange("border", border)}
        />

What is expected?

.

What is actually happening?

.

What browsers are you seeing the problem on?

No response

Any additional comments?

No response

[CoHarsh]

This looks interesting.
I am wondering whether to extend this to German number format or make this general. @christopherkindl

[hikinine]

Would be awesome if we receive as optional props an "formatter" which represents Intl.NumberFormat constructor
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/NumberFormat/NumberFormat

So we separate the render value from the reference value

return (
   <NumberInput  
        defaultValue={123456.79}
        formatter={ new Intl.NumberFormat('en-US', { style: 'currency', currency: "USD" }) } 
    />
)

  DISPLAY VALUE:  '$123,456.79'
  REF VALUE:   123456.79

I am available to work on this if needed.