ui-currency-input

Use a controlled input that formats the number with Intl.NumberFormat and the ro-RO locale when not focused, and switches to a raw editable string on focus. On blur, parse the input by removing dot thousand separators and converting the comma decimal separator before calling parseFloat.

Define the field as z.number() in the Zod schema and wire the component through the field value and onChange props. The component emits number or null, so the form state stays numeric and validation rules like positive() or min() apply directly.

Store currency values as number in both form state and the database, never as formatted strings. Formatting with thousand and decimal separators should happen only at display time, keeping calculations and validation reliable.

Yes, Intl.NumberFormat with the ro-RO locale produces the 1.234,56 format with dot thousand separators and comma decimals natively. It also supports compact notation for abbreviated large values.

Formatting on every keystroke breaks cursor position and editing. Keep a raw string state while focused and only apply locale formatting on blur, which is the standard ERP editing pattern.