Skip to content

Conversation

@siriwatknp
Copy link
Member

@siriwatknp siriwatknp commented Nov 3, 2025

closes #19154
closes #44284

Preview: https://deploy-preview-47165--material-ui.netlify.app/material-ui/react-number-field/

For reviewer

For context and decision, see https://mui-org.slack.com/archives/C061V6JNZ9Q/p1762158626169409

  • Demonstrate 2 visual design, NumberField and NumberSpinner
  • The goal is to let user copy the code and paste into their project (let's not involve CLI code load in this PR)
  • Each demo contains 2 files, the core component (for copy) and the demo file (for showing scenarios like error, sizes)

@mui-bot
Copy link

mui-bot commented Nov 3, 2025

Netlify deploy preview

Bundle size report

Bundle Parsed size Gzip size
@mui/material 0B(0.00%) 0B(0.00%)
@mui/lab 0B(0.00%) 0B(0.00%)
@mui/system 0B(0.00%) 0B(0.00%)
@mui/utils 0B(0.00%) 0B(0.00%)

Details of bundle changes

Generated by 🚫 dangerJS against 8a067a1

@siriwatknp siriwatknp added docs Improvements or additions to the documentation. proof of concept labels Nov 3, 2025
@siriwatknp siriwatknp changed the title [docs] Add Base UI integration [docs][material-ui] Add Number Field component page Nov 5, 2025
components: Button, IconButton, InputLabel, FormControl, FormLabel, FormHelperText, OutlinedInput
---

# Number Field
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@mapache-salvaje would love to have your opinion about the structure of this page before moving on to the details of the content. I decided to start this page based on the discussion to showcase Base UI with Material UI.

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I think what you've outlined makes sense! I added one comment about moving the info callout up higher but otherwise the structure looks good to me.

Copy link
Contributor

@sai6855 sai6855 left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@siriwatknp I think it's good to include base-ui NumberField api reference in this section. https://base-ui.com/react/components/number-field#api-reference

Image

3. Select the file that starts with `./components/`
4. Click the copy icon from the toolbar and paste it into your project.

:::info
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I think this callout should be part of the introduction to make it more immediately clear what this page is all about.

components: Button, IconButton, InputLabel, FormControl, FormLabel, FormHelperText, OutlinedInput
---

# Number Field
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I think what you've outlined makes sense! I added one comment about moving the info callout up higher but otherwise the structure looks good to me.

@siriwatknp siriwatknp marked this pull request as ready for review November 7, 2025 09:13
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

docs Improvements or additions to the documentation.

Projects

None yet

Development

Successfully merging this pull request may close these issues.

[number field] Add Number Input component [material-ui] Finally add number input component

5 participants