mui / material-ui

Material UI: Comprehensive React component library that implements Google's Material Design. Free forever.
https://mui.com/material-ui/
MIT License
93.61k stars 32.22k forks source link

[Unstable_NumberInput]: step incorrect with min #42814

Closed tonyhallett closed 3 months ago

tonyhallett commented 3 months ago

Steps to reproduce

https://codesandbox.io/s/eager-ully-9yvkfn

Steps:

  1. Press plus button - 3 => 4
  2. Press plus button - 4 => 6

Current behavior

Does not adhere to odd steps

Expected behavior

Should be odd stepped.

See https://developer.mozilla.org/en-US/docs/Web/API/ValidityState/stepMismatch Given <input type="number" min="20" max="40" step="2" /> - step 2

if (value - min) % 2 !== 0, stepMismatch will be true.

This is not an issue with the alpha version of NumberField mentioned in this issue https://github.com/mui/base-ui/issues/41#issuecomment-2069363038 https://codesandbox.io/p/sandbox/winter-meadow-p9x353

Context

No response

Your environment

System: OS: Windows 11 10.0.22631 Binaries: Node: 22.2.0 - C:\Program Files\nodejs\node.EXE npm: 10.8.1 - C:\Program Files\nodejs\npm.CMD pnpm: Not Found Browsers: Chrome: Not Found Edge: Chromium (126.0.2592.81) npmPackages: @emotion/react: ^11.11.4 => 11.11.4 @emotion/styled: ^11.11.5 => 11.11.5 @mui/base: 5.0.0-beta.40 @mui/core-downloads-tracker: 5.15.21 @mui/icons-material: ^5.15.20 => 5.15.20 @mui/material: ^5.15.20 => 5.15.21 @mui/private-theming: 5.15.20 @mui/styled-engine: 5.15.14 @mui/system: 5.15.20 @mui/types: 7.2.14 @mui/utils: 5.15.20 @mui/x-charts: ^7.7.1 => 7.7.1 @mui/x-data-grid: ^7.7.1 => 7.7.1 @types/react: ^18.3.3 => 18.3.3 react: ^18.3.1 => 18.3.1 react-dom: ^18.3.1 => 18.3.1 typescript: ^5.4.5 => 5.4.5

Search keywords: Unstable_NumberInput NumberInput

michaldudak commented 3 months ago

The NumberInput was rewritten in https://github.com/mui/base-ui/pull/186 and is available in a @base_ui/react package.

We support just the new version.

tonyhallett commented 3 months ago

When will the documentation link to the new component https://mui.com/base-ui/react-number-input/ ?

Base UI's Number Input component is a customizable replacement for the native HTML

The current component is most definitely not a replacement for the native HTML element.

michaldudak commented 3 months ago

We'll be setting up a new site for the docs of @base_ui/react. The current docs will continue to describe @mui/base for those who already use it.