TL;DR

Mantine 9.3.0 introduces a new use-splitter hook (resizable pane component) and improves the Pagination component with a responsive layout option, and adds textWrap control to Text and Blockquote components.

New

• use-splitter hook: Enables creating resizable split-pane layouts with drag, keyboard, and size constraints.
• Responsive Pagination: The Pagination component now offers a layout="responsive" prop for adapting to smaller screens.
• textWrap prop: Text and Blockquote components can now control text wrapping with the textWrap prop (CSS text-wrap property).

Fixes Worth Knowing

• Fixed issues with Pill, TimePicker, use-mask, Input, Select, Modal, Drawer, Spotlight, and tiptap components to address incorrect overflow handling, am/pm switching, keyboard shortcuts, direction issues, clear button visibility, and errors when the editor is destroyed.
• Menu component now supports safe area polygon options.

TL;DR

Mantine 8.x is ending with this release; consider testing the 9.0 alpha (next major version) for upcoming changes.

Fixes Worth Knowing

• PasswordInput: Resolved styling issues when using theme API props.
• Stepper: Improved compatibility with Google Translate.
• use-list-state (state management hook): Performance improved with memoization.

TL;DR

Mantine 9.0 is a major alpha release introducing a new @mantine/schedule package for comprehensive calendar scheduling, alongside significant updates to existing components and hooks for improved flexibility and performance.

Breaking

• React 19+ is now required for all @mantine/* packages.
• Tiptap 3+ is required for @mantine/tiptap – migration is needed.
• @mantine/form schema resolvers are removed; use dedicated packages instead.
• use-tree callback state setters are removed.
• use-fullscreen is split into useFullscreenElement and useFullscreenDocument.
• use-mouse functionality is split into use-mouse and use-mouse-position.
• use-mutation-observer now uses callback refs, potentially breaking existing implementations.

New

• @mantine/schedule: A complete set of calendar scheduling components (views, drag-and-drop, customization).
• use-floating-window hook & FloatingWindow component: Create draggable, floating elements.

TL;DR

Mantine components received numerous bug fixes, improving stability and reliability across the library.

Breaking

• Collapse: The inert prop is now compatible with React 18 (accessibility feature).

New

No new features were introduced in this release.

Fixes Worth Knowing

• DateInput: Escape key now correctly closes the dropdown (date picker).
• MultiSelect: The onPaste prop now functions as expected (data input).
• Form: Corrected an issue where reordering only affected the first item (form management).
• Table: Added scrollAreaProps for more customization of the scroll container (data display).

Before You Upgrade

No specific action is needed for this upgrade.

TL;DR

Mantine 6 received quality-of-life improvements, resolving issues with Popovers, Menus, and Switches to enhance usability and accessibility.

Fixes Worth Knowing

• Popover dropdowns now handle content overflow correctly.
• Menu focus behavior is fixed when keepMounted is enabled.
• Switch component accessibility issues are resolved.
• TypeScript 5.5 compatibility is restored.

Before You Upgrade

No specific action is needed for this patch release.

TL;DR

Mantine’s date and time inputs, popovers, tooltips, and table components have been updated with several fixes to improve their visual behavior and correct prop handling.

Fixes Worth Knowing

• Date/Time inputs now correctly support inputWrapperOrder.
• Modals no longer jump when closed.
• Popovers now correctly follow their target element within scrollable containers.
• Tooltips respect the disabled prop.
• Table header styles are corrected when inside the table body.

TL;DR

Mantine users will see improved input and date selection experiences, with fixes for autocomplete, keyboard navigation, and IME support across several components.

Fixes Worth Knowing

• Spotlight and Autocomplete components now handle Japanese IME correctly.
• DatePicker and Calendar components have improved keyboard navigation, even when some days are disabled.
• NumberInput component’s “hold” functionality (repeated input) now works as expected.
• Spotlight component no longer displays unexpected browser autocomplete in Chrome.

Before You Upgrade

No specific action is needed; these fixes apply automatically with the update.

TL;DR

DatePicker and DateRangePicker components are more reliable, with fixes for event handling, modal/drawer integration, and locale settings, improving usability for date selection.

Breaking

• PasswordInput now requires a required attribute. (HTML form validation)

New

• Portal component allows overriding its position. (Positions elements outside DOM)
• DatePicker and DateRangePicker allow configuring the modal zIndex. (Layering order of elements)

Fixes Worth Knowing

• Resolved issues with MultiSelect text cutoff and RichTextEditor tooltip visibility.
• Fixed Select and MultiSelect behavior when using disabled and clearable props together.
• Corrected font size application to the body element.

Before You Upgrade

• Ensure your PasswordInput components include the required attribute if appropriate for your form validation.

TL;DR

Mantine 2.5 introduces a new Rich Text Editor (@mantine/rte), simplifies theming with createStyles (styling function) and built-in server-side rendering support, and adds several new UI components like Timeline, Pagination, and TimeRangeInput.

Breaking

• UMD Builds Deprecated: UMD builds are no longer the default; this won’t impact modern bundlers (Webpack, Next.js, Vite, CRA).
• react-jss Peer Dependency Removed: react-jss is now installed automatically with @mantine/core. Use createStyles for styling.

New

• Rich Text Editor: New @mantine/rte package provides a fully-featured Rich Text Editor component.
• Styling with createStyles: A new function for creating styles with access to the Mantine theme.
• Server-Side Rendering: Simplified SSR setup with new components for Next.js and other environments.

Fixes Worth Knowing

• Pagination: Resolved rendering issues in Next.js production and with large datasets.
• TimeRangeInput: Fixed demo usage issues.

TL;DR

Mantine now offers more flexible component styling and improved module bundling, alongside new components like RingProgress and Center to enhance UI creation.

Breaking

• Button labels are now lowercase by default (previously uppercase).
• Component types are now exported directly (requires import updates).

New

• RingProgress component – displays circular progress.
• Center component – simplifies centering elements.
• use-interval hook – provides a wrapper for setInterval.

Fixes Worth Knowing

• Corrected published types for @mantine/core.

Before You Upgrade

• Update your import statements to directly import types from @mantine/core (e.g., import { ButtonProps } from '@mantine/core';).
• If you rely on the default uppercase button label, add the uppercase prop to your <Button> components.

TL;DR

Mantine now includes RingProgress for displaying progress, Center for easy alignment, and improved module support for smaller bundle sizes (code optimization).

New

• RingProgress: New component for visually representing progress.
• Center: Simplifies centering content both vertically and horizontally.
• Module Support: Packages now publish both CommonJS and ES modules for better tree shaking.

Fixes Worth Knowing

• Tabs component now supports an outline variant.
• Badge component now supports a dot variant for notifications.

Before You Upgrade

No action needed.