mantine-v9

Migrate Mantine projects from 8.x to 9.x with breaking changes and API updates.

Updated Mar 31, 2026
One-click install
npx skills add https://github.com/thewillmoss/mantine-v9-skill --skill mantine-v9
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: mantine-v9
Source: https://github.com/thewillmoss/mantine-v9-skill/tree/main
Command: npx skills add https://github.com/thewillmoss/mantine-v9-skill --skill mantine-v9

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This Skill helps engineers upgrade Mantine-based projects from 8.x to 9.x by addressing breaking changes, API migrations, and theming considerations, so teams can modernize their stack with confidence.

Core Features & Use Cases

  • Migration planning and changelog guidance to map 8.x-to-9.x changes (renamed props, removed hooks, and core API shifts).
  • Automated package upgrades, code refactors, and compatibility checks across a Vite/TS React project.
  • Real-world scenarios including updating forms to use schemaResolver, adapting TypographyStylesProvider to Typography, and removing positionDependencies on Popover/Tooltip.

Quick Start

Guide me through migrating a Mantine 8.x project to Mantine 9.x, including package upgrades, prop changes, and testing.

Frequently Asked Questions about mantine-v9

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I migrate Mantine 8.x to 9.x in a React TypeScript project?

To migrate Mantine 8.x to 9.x, update your packages and apply official breaking changes like renaming the color prop to c and gutter to gap. This process ensures a safe, testable upgrade plan with concrete steps for Vite and TypeScript environments.

What are the breaking changes when upgrading Mantine to version 9?

Breaking changes when upgrading Mantine to version 9 include prop renames like color to c and gutter to gap, TypographyStylesProvider changes to Typography, removing positionDependencies on Popover/Tooltip, and migrating form resolvers to Standard Schema.

How do I migrate Mantine form resolvers to Standard Schema?

To migrate Mantine form resolvers to Standard Schema, update your forms to use the schemaResolver property. This API migration is a core part of moving from Mantine 8.x to 9.x and ensures your form validation remains compatible.

Does the Mantine 9.x upgrade guide cover Vite and TypeScript toolchains?

Yes, the Mantine 9.x upgrade guide covers React and TypeScript apps using Vite or similar toolchains. It provides automated package upgrades, code refactors, and compatibility checks tailored for this specific development stack.

Why does my Mantine TypographyStylesProvider break after upgrading to 9.x?

Your Mantine TypographyStylesProvider breaks after upgrading to 9.x because the API has shifted to use Typography instead. Adapting this provider change is a required step in the Mantine 8.x to 9.x migration process.

What is the best way to handle Mantine prop renames during a 9.x migration?

The best way to handle Mantine prop renames during a 9.x migration is to apply the official changelog guidance, systematically refactoring props like color to c and gutter to gap across your codebase to ensure full compatibility.