mantinedev / mantine

A fully featured React components library
https://mantine.dev
MIT License
26.39k stars 1.87k forks source link

NumberInput onChange vs onBlur With prefix Prop #6954

Closed amvFrontendMonkey closed 3 hours ago

amvFrontendMonkey commented 3 hours ago

Dependencies check up

What version of @mantine/* packages do you have in package.json?

7.11.2

What package has an issue?

@mantine/core

What framework do you use?

Next.js

In which browsers you can reproduce the issue?

Chrome

Describe the bug

The argument supplied to onChange or onBlur is different if a prefix prop is supplied

When called like this:

const inputProps = form.getInputProps()
<MantineNumberInput
            onBlur={(evt) => {console.log(evt.target.value)}} // includes the prefix '€'. e.g. '€777'
            onChange={(evt) => {console.log(evt.target.value)}} // does not include the prefix '€'. e.g. '777'
            suffix={'€'}
        />

I would expect the event value to remain as a numeric-string without the prefixing for both handlers

If possible, include a link to a codesandbox with a minimal reproduction

No response

Possible fix

No response

Self-service

rtivital commented 3 hours ago

It is intended behavior. onChange function is not called with the event, it is called with the component value, as there are multiple sources of changes, for example increment/decrement buttons. onBlur function is called with the event associated with the input, it is aware only of the value in the DOM. It is not planned to change this behavior.