• PasswordInput now supports setting toggle button tabIndex to prevent focusing with tab key #131
• DatePicker and DateRangePicker components no longer trigger form submit once clicked #130
• Tabs component now supports tabPadding prop to add spacing to tab content #126
• Autocomplete component no longer hides dropdown if data includes items with similar values #129
• Fix controlled Select not updating when external value changes #134
• Select component now supports clearing – https://mantine.dev/core/select/#clearable

Mantine 2.0.0

View changelog with demos on Mantine website

Breaking changes

• All inputs no longer support inputStyle and inputClassName props, this feature was replaced by Styles API
• Burger component no longer uses colors from theme, use
  hex color value instead
• Select component was renamed to NativeSelect
• ElementsGroup, Hr and CardsGrid components are replaced and no longer exported from @mantine/core package
• All inputs variant is set by default to filled in dark theme

New theming options

• @mantine/core package now exports GlobalStyles and NormalizeCSS components to include global styles
• New Styles API allows you to style any part of Mantine components with inline styles or classes

New @mantine/dates package

@mantine/dates s a new package that includes date pickers and calendars, it includes components:

• DatePicker
• DateRangePicker
• TimeInput
• Calendar
• RangeCalendar
• Month

New @mantine/prism package

New @mantine/prism package exports Prism component that allows you to highlight code with prism-react-renderer and your theme colors just like in Mantine docs.

New @mantine/hooks hooks

• use-did-update – useEffect replacement when you do not want hook to be called on mount
• use-isomorphic-effect – switch between useEffect during server side rendering and useLayoutEffect after hydration
• use-force-update – force component to rerender
• use-toggle – switch state between two values
• use-uncontrolled – manage state for both controlled and uncontrolled components
• use-window-scroll – get current scroll position and handler to scroll to given position

New @mantine/core components

• Select – custom searchable select with option to use custom option component
• Affix
• Accordion
• Autocomplete
• JsonInput
• Slider and RangeSlider

@mantine/core changes

• Tabs component now supports unstyled and pills variants
• All inputs now support size prop
• Drawer component now support title and close button
• Tooltip component now displays tooltip on focus by default
• Menu component now closes on scroll to prevent incorrect focus handling
• Menu component now supports hover trigger
• 3 new premade transitions were added to Transition component: scale-y, scale-x and scale
• @mantine/core now exports new UnstyledButton component that can be used to create custom buttons

Fix incorrectly published @mantine/core types

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

• RingProgress component
• Tabs component now supports outline variant
• Badge component now supports dot variant
• New Center component centers content vertically and horizontally
• All packages are now published with cjs and es modules – this enables better tree shaking
• @mantine/core components now export component props types

Dark theme adjustments for @mantine/core components

Release demos

June 2021 changelog demos

New features and components

• SegmentedControl
• Popover
• Divider
• Group
• Grid
• use-debounced-value

API changes

• Prop typo fix in Checkbox component (intermediate -> indeterminate)
• Hr component replaced with Divider to support more options
• ElementsGroup component replaced with Group to support all elements positioning
• Custom component is now supported by ActionIcon and MenuItem components
• Modal and Drawer components are wrapped with Portal by default
• LoadingOverlay now supports custom loaders
• @mantine/core components types are now exported from package, import it with Props suffix: import { ButtonProps } from '@mantine/core'

Bug fixes and improvements

• Significant performance improvements with react-jss parameters memoization
• Dark theme improvements, all components now use more balanced transparent colors in dark theme
• Portal component now does not show warning during server side rendering
• @mantine/notifications – useNotifications hook now returns queue

Remove & > * selector from ElementsGroup, Table and TypographyStylesProvider components – it is not working with react-jss during ssr and components appear without initial styles

Fix Portal component breaking react-jss styles during server side rendering

Bug fixes:

• @mantine/core: Input – add option to use tooltip inside rightSection
• @mantine/core: Modal – add option to set static modal id to avoid hydration issue
• @mantine/notifications: Fix notification onClose callback not fired when notification was closed programatically

Docs updates:

• Notifications interactive elements examples
• Tooltip with Input in right section
• Props table for all components are now sorted alphabetically

Environment updates:

• Storybook now works locally on Windows 10

Hot fix: incorrect typescript definitions for @mantine/hooks

• Fix incorrect ActionIcon appearance on mobile devices after prerendering with gatsby
• Fix use-scroll-lock hook behavior on mobile devices
• Add option to use any react node with Notification component in Notifications system

First stable release. Includes full documentation and packages:

• @mantine/core
• @mantine/hooks
• @mantine/notifications
• @mantine/tag-picker