New DonutChart component:
New PieChart component:
valueFormatter is a more powerful alternative to
It allows formatting value label with a custom function.
The function is the same for all component types (
– you need to perform additional checks inside the function to handle different types.
Example of using a custom formatter function with
You can now force each month to have 6 weeks by setting
consistentWeeks: true on
DatesProvider. This is useful if you want to avoid layout
shifts when month changes.
@mantine/charts components now support
valueFormatter prop, which allows
formatting value that is displayed on the y axis and inside the tooltip.
Lorem, ipsum dolor sit amet consectetur adipisicing elit. Quasi voluptatibus inventore iusto cum dolore molestiae perspiciatis! Totam repudiandae impedit maxime!
You can also set
textWrap on theme:
If set on theme,
textWrap is also applied to headings in TypographyStylesProvider
All components now support
mod prop, which allows adding data attributes to
the root element:
- New testing with Vitest guide
- NativeSelect with dividers demo
- Combobox props related to Popover documentation
- Loading styles from CDN guide
- Anchor now includes additional documentation on how to use Text props
- Pagination now includes props tables for all compound components
- A more detailed breakdown of browser support has been added to the about page
New articles added to the help center:
- Can I use Mantine with Astro?
- How can I contribute to the library?
- How can I add dynamic CSS styles?
- How can I load fonts in Next.js?
- How can I load fonts in Vite?
- Is there a floating action button component?
- How to change inputs placeholder color?
- I do not have styles in my dates components...
- Checkbox.Group, Radio.Group and Switch.Group now support
- ActionIcon now has
- SegmentedControl now supports
withItemsBorderprop which allows removing border between items
- Progress now supports
transitionDurationprop which controls section width animation duration
- Textarea and JsonInput components now support
resizeprop, which allows setting
resizeCSS property on the input
@mantine/hookspackage now exports readLocalStorageValue and readSessionStorageValue function to get value from storage outside of React components