How mantinedev/mantine works
Mantine is a React component and UI library monorepo, with documentation and developer-facing AI access alongside its packages. A typical workflow is that an application developer selects a package, uses its UI/state capability in an application, and consults the documentation when needed. The graph preserves the README’s package capabilities and the sampled storage, schedule-drag, Styles API, and MCP internals. Some package internals and documentation wiring are unsampled, so their links are omitted rather than inferred.
Main entry points: schedule Schedule component · hooks Hooks library · server.ts MCP server · create-storage.ts Storage hooks
Components 24
UI libraries
- Core components
packages/@mantine/core - Form management
packages/@mantine/form
UI extensions
- Charts
packages/@mantine/charts - Notifications
packages/@mantine/notifications - Command center
packages/@mantine/spotlight - Code highlighting
packages/@mantine/code-highlight - Rich text editor
packages/@mantine/tiptap - File dropzone
packages/@mantine/dropzone - Carousel
packages/@mantine/carousel - Navigation progress
packages/@mantine/nprogress - Modal manager
packages/@mantine/modals - Schedule component
packages/@mantine/schedule
Documentation
- Styles API data
packages/@docs/styles-api/src/data - Styles API exports
packages/@docs/styles-api/src/index.ts - Mantine documentation
apps/mantine.dev/src - Help and questions
apps/help.mantine.dev/src
State and interaction
- Hooks library
packages/@mantine/hooks - Storage hooks
packages/@mantine/hooks/src/use-local-storage/create-storage.ts - Drag handlers
packages/@mantine/schedule/src/hooks/use-drag-drop-handlers.ts
AI access
- MCP server
packages/@mantine/mcp-server/src/server.ts - Documentation data client
packages/@mantine/mcp-server/src/data-client.ts
Other components
- Application developer
- Application UI
- AI coding agent
Connections 21
- Application developer → Core components: uses components
README.md - Application developer → Hooks library: uses hooks
README.md - Application developer → Form management: manages forms
README.md - Application developer → Charts: uses charts
README.md - Application developer → Notifications: uses notifications
README.md - Application developer → Command center: uses command center
README.md - Application developer → Code highlighting: highlights code
README.md - Application developer → Rich text editor: edits rich text
README.md - Application developer → File dropzone: handles file drops
README.md - Application developer → Carousel: uses carousel
README.md - Application developer → Navigation progress: shows progress
README.md - Application developer → Modal manager: manages modals
README.md - Application developer → Schedule component: displays events
README.md - Application UI → Storage hooks: persists state
packages/@mantine/hooks/src/use-local-storage/create-storage.ts - Hooks library → Storage hooks: provides storage hooks
packages/@mantine/hooks/src/use-session-storage/use-session-storage.ts - Schedule component → Drag handlers: supports dragging
packages/@mantine/schedule/src/hooks/use-drag-drop-handlers.ts - Styles API exports → Styles API data: exports API data
packages/@docs/styles-api/src/index.ts - Application developer → Mantine documentation: consults docs
README.md - Application developer → Help and questions: asks questions
README.md - AI coding agent → MCP server: queries library
- MCP server → Documentation data client: uses data client
packages/@mantine/mcp-server/src/server.ts