NumberInput current format demo update

[Shreyag02]

Description

Clarifies how locale and format interact in NumberField and surfaces the previously undocumented locale prop. The currency demo was misleading: the same currency: 'USD' setting rendered differently across users' runtime locales (separators, symbol position, currency name vs. code), and the docs didn't explain that locale is the lever to pin output.

Type of Change

• Bug fix (non-breaking change that fixes an issue)
• Documentation update

How Has This Been Tested?

• Built the docs site locally and viewed the Number Field page:
  • The new locale row appears in the Root props table.
  • The "Formatted" section renders the new copy and the tabbed demo.
  • Switching between System locale, en-US, and de-DE tabs shows the rendered currency string change as expected ($1,000.00, 1.000,00 €, etc.).
• Verified the Examples page renders DatePicker / RangePicker without console warnings about unknown props.
• No code paths in packages/raystack/components/number-field/ were touched, so existing unit tests (tests/number-field.test.tsx) are unaffected.

Checklist:

• My code follows the style guidelines of this project
• I have performed a self-review of my own code
• I have commented my code, particularly in hard-to-understand areas
• I have made corresponding changes to the documentation (.mdx files)
• My changes generate no new warnings
• I have added tests that prove my fix is effective or that my feature works

Screenshots (if appropriate):

N/A

Related Issues

#736

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Actions	Updated (UTC)
apsara	Ready	Preview, Comment	May 7, 2026 9:35am

[coderabbitai]

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info

⚙️ Run configuration

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro

Run ID: 12190dcb-f41a-4190-baa0-f0d8c1cccef2

📥 Commits

Reviewing files that changed from the base of the PR and between 0ae3f82 and d1a741c.

📒 Files selected for processing (4)

• apps/www/src/app/examples/page.tsx
• apps/www/src/content/docs/components/number-field/demo.ts
• apps/www/src/content/docs/components/number-field/index.mdx
• apps/www/src/content/docs/components/number-field/props.ts

---

📝 Walkthrough

Walkthrough

This PR extends NumberField with internationalization support by adding an optional locale property that controls currency symbol placement and number separators via Intl.NumberFormat. The interface update is paired with expanded documentation explaining the feature and demo examples showing formatting output across system default, en-US, and de-DE locales. Additionally, DatePicker and RangePicker example components have their input configuration prop names updated for consistency.

Suggested reviewers

• rohanchkrabrty
• paanSinghCoder

🚥 Pre-merge checks | ✅ 4 | ❌ 1

❌ Failed checks (1 warning)

Check name	Status	Explanation	Resolution
Title check	⚠️ Warning	The title 'NumberInput current format demo update' refers to updating the format demo for NumberInput, which is partially related to the changeset. However, the primary focus of the PR is clarifying how locale and format interact and surfacing the locale prop—not just updating a demo. The title is too narrow and doesn't capture the main intent.	Revise the title to reflect the core change, such as 'Clarify NumberField locale and format interaction and surface locale prop' or 'Document NumberField locale prop and fix currency format demo'.

✅ Passed checks (4 passed)

Check name	Status	Explanation
Description check	✅ Passed	The description clearly explains the purpose: clarifying locale and format interaction, surfacing the locale prop, fixing misleading currency demo, and updating documentation. It is directly related to the changeset and provides relevant context.
Docstring Coverage	✅ Passed	No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.
Linked Issues check	✅ Passed	Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check	✅ Passed	Check skipped because no linked issues were found for this pull request.

_{✏️ Tip: You can configure your own custom pre-merge checks in the settings.}

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands and usage tips.}