CommunityCodierung & Entwicklunggithub.com

mantinedev/mantine-custom-components

Erstellen Sie benutzerdefinierte Komponenten, die sich nahtlos in Mantines Theming, Styles API und Kernfunktionen integrieren.

Was ist mantine-custom-components?

Diese Skill hilft Entwicklern, benutzerdefinierte Komponenten für das Mantine-UI-Framework zu erstellen, die vollständig in dessen Theming-System und Styles API eingebunden sind. Sie unterstützt die Verwendung von Fabrikmethoden wie `factory()`, `polymorphicFactory()` und `genericFactory()`, um Komponenten mit automatischer Typinferenz zu erzeugen. Darüber hinaus ermöglicht sie die Implementierung von Styles API-Features wie `classNames`, `styles`, `vars` und `unstyled` sowie die Erstellung von CSS-Variablen via `createVarsResolver`. Die Skill deckt auch den Bau von zusammengesetzten Komponenten mit Sub-Komponenten und gemeinsamem Kontext sowie die Registrierung von Komponenten mit `MantineProvider.extend()` ab. Sie ist speziell für Projekte gedacht, die `@mantine/core` mit Version 7+ verwenden und die volle Kontrolle über das Styling und die Anpassbarkeit ihrer Komponenten benötigen.

Funktioniert mit~Claude Code~Codex CLI~Cursor
Part ofReact
npx skills add https://github.com/mantinedev/skills/tree/main/skills/mantine-custom-components

Installed? Explore more Codierung & Entwicklung skills: steipete/bluebubbles, steipete/eightctl, steipete/blucli · View all 6 →

Original anzeigen→Alle Skills durchsuchen

In Ihrer bevorzugten KI fragen

Öffnet einen neuen Chat, in dem dieser Agent-Skill bereits geladen ist.

OpenAIChatGPTClaudeClaudeGeminiGeminiGrokGrokPerplexityPerplexityDeepSeekDeepSeek

Dokumentation

Was macht mantine-custom-components?

Erstellen Sie benutzerdefinierte Komponenten, die sich nahtlos in Mantines Theming, Styles API und Kernfunktionen integrieren. Nutzen Sie diesen Skill, wenn: (1) eine neue Komponente mit factory(), polymorphicFactory() oder genericFactory() erstellt wird, (2) Styles API-Unterstützung (classNames, styles, vars, unstyled) hinzugefügt wird, (3) CSS-Variablen via createVarsResolver implementiert werden, (4) zusammengesetzte Komponenten mit Sub-Komponenten und gemeinsamem Kontext entwickelt werden, (5) eine Komponente mit MantineProvider.extend() registriert wird oder (6) Aufgaben mit Factory, useProps, useStyles, BoxProps, StylesApiProps oder ElementProps in @mantine/core anfallen.

Individual skills in this repo

This repo contains 2 individual skills — each has its own dedicated page.

mantinedev/mantine-combobox

Build custom dropdown/select/autocomplete/multiselect components using Mantine's Combobox primitives. Use this skill when: (1) creating a new custom select-like component with Combobox primitives, (2) building a searchable dropdown, (3) implementing a multi-select or tags input variant, (4) customizing option rendering, (5) adding custom filtering logic, or (6) any task involving useCombobox, Combobox.Target, Combobox.Option, or Combobox.Dropdown.

mantinedev/mantine-form

Build forms using @mantine/form in the mantine-9 repository. Use this skill when: (1) setting up a form with useForm, (2) adding validation rules or async validation, (3) working with nested object or array fields, (4) sharing form state across components with createFormContext, (5) using uncontrolled mode for performance, (6) using the standalone useField hook, or (7) any task involving useForm, getInputProps, onSubmit, insertListItem, or form validation.

Verwandte Skills

steipete/bluebubbles

Send and manage iMessages via BlueBubbles, including attachments, tapbacks, edits, replies, and groups.

community

steipete/eightctl

Control Eight Sleep pods (status, temperature, alarms, schedules).

community

steipete/blucli

BluOS CLI (blu) for discovery, playback, grouping, and volume.

community

steipete/bear-notes

Create, search, and manage Bear notes via grizzly CLI.

community

steipete/camsnap

Capture frames or clips from RTSP/ONVIF cameras.

community

steipete/gifgrep

Search GIF providers with CLI/TUI, download results, and extract stills/sheets.

community
← More Codierung & Entwicklung skills