构建与 Mantine 主题、样式 API 及核心功能集成的自定义组件。在以下场景使用此技能：(1) 使用 factory()、polymorphicFactory() 或 genericFactory() 创建新组件；(2) 添加样式 API 支持（classNames、styles、vars、unstyled）；(3) 通过 createVarsResolver 实现 CSS 变量；(4) 构建包含子组件和共享上下文的复合组件；(5) 通过 Component.extend() 向 MantineProvider 注册组件；(6) 任何涉及 @mantine/core 中 Factory、useProps、useStyles、BoxProps、StylesApiProps 或 ElementProps 的任务。
此技能旨在指导开发者构建与 Mantine v7 主题系统、样式 API 及核心功能紧密集成的自定义组件。它详细说明如何利用 factory()、polymorphicFactory() 或 genericFactory() 创建组件，并为其添加样式 API 支持（包括 classNames、styles、vars 和 unstyled 属性）。此外，还涵盖通过 createVarsResolver 实现 CSS 变量、构建包含子组件和共享上下文的复合组件，以及通过 Component.extend() 向 MantineProvider 注册组件的完整流程。该技能适用于所有需要将自定义组件深度融入 Mantine 生态的开发者，支持在 React 项目中使用 @mantine/core 库。通过遵循其指导，开发者能确保自定义组件在样式、主题和上下文方面与 Mantine 现有组件行为一致。
npx skills add https://github.com/mantinedev/skills/tree/main/skills/mantine-custom-componentsInstalled? Explore more 编程与开发 skills: steipete/bluebubbles, steipete/eightctl, steipete/blucli · View all 6 →
构建与 Mantine 主题、样式 API 及核心功能集成的自定义组件。在以下场景使用此技能：(1) 使用 factory()、polymorphicFactory() 或 genericFactory() 创建新组件；(2) 添加样式 API 支持（classNames、styles、vars、unstyled）；(3) 通过 createVarsResolver 实现 CSS 变量；(4) 构建包含子组件和共享上下文的复合组件；(5) 通过 Component.extend() 向 MantineProvider 注册组件；(6) 任何涉及 @mantine/core 中 Factory、useProps、useStyles、BoxProps、StylesApiProps 或 ElementProps 的任务。
This repo contains 2 individual skills — each has its own dedicated page.
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.
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.
Send and manage iMessages via BlueBubbles, including attachments, tapbacks, edits, replies, and groups.
Control Eight Sleep pods (status, temperature, alarms, schedules).
BluOS CLI (blu) for discovery, playback, grouping, and volume.
Create, search, and manage Bear notes via grizzly CLI.
Capture frames or clips from RTSP/ONVIF cameras.
Search GIF providers with CLI/TUI, download results, and extract stills/sheets.