Contributing to Mantine
First of all, thank you for showing interest in contributing to Mantine! All your contributions are extremely valuable to the project!
Ways to contribute
- Improve documentation: Fix incomplete or missing docs, bad wording, examples or explanations.
- Give feedback: We are constantly working on making Mantine better. Please share how you use Mantine, what features are missing and what is done well via GitHub Discussions or Discord.
- Share Mantine: Share links to the Mantine docs with everyone who might be interested! Share Mantine on X here.
- Contribute to the codebase: Propose new features via GitHub Issues, or find an existing issue that you are interested in and work on it!
- Give us a code review: Help us identify problems with the source code or make Mantine more performant.
Contributing workflow
- Decide on what you want to contribute.
- If you would like to implement a new feature, discuss it with the maintainer (GitHub Discussions or Discord) before jumping into coding.
- After finalizing issue details, you can begin working on the code.
- Run tests with npm testand submit a PR once all tests have passed.
- Get a code review and fix all issues noticed by the maintainer.
- If you cannot finish your task or if you change your mind – that's totally fine! Just let us know in the GitHub issue that you created during the first step of this process. The Mantine community is friendly – we won't judge or ask any questions if you decide to cancel your submission.
- Your PR is merged. You are awesome ❤️!
Get started with Mantine locally
- Install the editorconfig extension for your editor.
- Fork the repository, then clone or download your fork.
- Run nvm useto switch to the Node version specified in.nvmrcfile (install nvm).
- Install dependencies with yarn – yarn
- Setup project – npm run setup
- Build local version of all packages – npm run build all
- To start storybook – npm run storybook
- To start docs – npm run docs
- To rebuild props descriptions – npm run docs:docgen
npm scripts
All npm scripts are located at main package.json. Individual packages do not have dedicated scripts.
Development scripts
- storybook– Starts the storybook development server. To start storybook for a specific component, use the- npm run storybook Tooltipcommand.
- docs– Starts the docs development server.
Testing scripts
- syncpack– runs syncpack
- typecheck– runs TypeScript typechecking with- tsc --noEmiton all packages and docs
- lint– runs ESLint on src folder
- jest– runs tests with jest
- test– runs all above testing scripts
Docs scripts
- docs:docgen– generates components types information with docgen script
- docs:build– builds docs for production
- docs:deploy– builds and deploys docs to the GitHub Pages