Getting started

Get started with @mantine/schedule package

License

Mantine schedule

npm

@mantine/schedule package provides a set of components for building calendar scheduling interfaces – day, week, month, and year views with event display, drag-and-drop, and time slot interactions.

Installation

yarn add @mantine/schedule @mantine/dates dayjs

After installation, import package styles at the root of your application:

import '@mantine/core/styles.css';
import '@mantine/dates/styles.css';
// ‼️ import schedule styles after core and dates package styles
import '@mantine/schedule/styles.css';

Do not forget to import styles

Followed the installation instructions above but something is not working (schedule components have no styles and look broken)? You've fallen into the trap of not importing schedule styles! To fix the issue, import schedule styles at the root of your application:

import '@mantine/schedule/styles.css';

dayjs

@mantine/schedule components use dayjs under the hood for date manipulations and formatting. dayjs is a required dependency – you cannot change it to another date library. If you want to use a different date library in your application, you will need to install it separately.