1.3.0

[rtivital]

Release demos

June 2021 release demos

New components, hooks and features

• New RingProgress component – display circular progress with multiple sections
• Tabs component now support outline variant
• Badge component now supports new dot variant
• NumberInput component now exposes increment/decrement handlers via ref
• New Center component – simple wrapper to center element horizontally and vertically
• New use-interval hook provides simple wrapper around window.setInterval
• use-focus-trap hook now allows to change element that will initially receive focus

Project core changes

• New documentation design with tabs and less cluttered packages index pages
• All packages are now published in 3 formats: esm (ECMAScript modules export { Button } from './Button';), cjs (commonjs export.Button = Button;) and umd (default for browser). These changes will allow webpack and similar bundlers to perform better tree shacking.
• All components now export related types: import { ButtonProps } from '@mantine/core';

Design changes

• Button component label is no longer uppercased by default, to replicate old design use <Button uppercase />
• Colors saturation and text shadows adjusted for Button and Badge components for better contrast

---

This discussion was created from the release 1.3.0.

[rtivital]

Special thanks:

• @cstrat for providing lots of feedback
• @blackcater for refactoring mantine build scripts
• @khushal87 for working on RingProgress component and Badge dot variant

Thank you! Your contributions are really valuable to the project

[cstrat]

Fantastic update - thanks @rtivital !

@khushal87 I love the dot variant on the badge. Nice work!

[khushal87]

Thanks @cstrat 🎊