Conventions de composants React de LobeHub. À utiliser lors de l'édition de l'interface utilisateur en TSX, du choix entre base-ui, @lobehub/ui ou antd, du style avec antd-style, du routage, des variantes de bureau, des mises en page ou de l'état des composants.
Cette compétence fournit les conventions de composants React spécifiques à LobeHub pour guider les développeurs travaillant sur les projets de l'interface utilisateur de LobeHub. Elle est conçue pour aider à choisir la bibliothèque de composants appropriée (base-ui pour les besoins fondamentaux, @lobehub/ui pour les composants spécifiques à LobeHub, ou antd comme solution générique), à appliquer des styles cohérents en utilisant antd-style, à gérer le routage, à implémenter des variantes de bureau, à structurer les mises en page et à gérer l'état des composants. Basée sur les pratiques de développement de LobeHub, cette compétence est utile pour tout développeur éditiant des fichiers TSX dans le contexte des applications LobeHub, garantissant une expérience de développement uniforme et efficace. Elle prend en charge les plateformes web modernes et s'intègre parfaitement à l'écosystème React.
npx skills add https://github.com/lobehub/lobe-chat/tree/main/skills/reactConventions de composants React de LobeHub. À utiliser lors de l'édition de l'interface utilisateur en TSX, du choix entre base-ui, @lobehub/ui ou antd, du style avec antd-style, du routage, des variantes de bureau, des mises en page ou de l'état des composants.
This repo contains 4 individual skills — each has its own dedicated page.
LobeHub Drizzle ORM schema and query style. Use for pgTable schemas, indexes, joins, inferred types, db.select/db.query, schema fields, foreign keys, junction tables, or postgres query patterns.
LobeHub i18n with react-i18next. Use for user-facing strings, locale keys, namespaces, useTranslation, t(), interpolation, zh-CN/en-US previews, hardcoded UI copy, or pnpm i18n.
LobeHub TypeScript style and type-safety guide. Use when editing TS/TSX/MTS, fixing types, choosing interface vs type, avoiding any/object, import type, async flow, or ts-expect-error.
LobeHub Zustand store conventions. Use when editing src/store, store slices, public/internal actions, dispatch actions, flattenActions, optimistic updates, selectors, maps, or class action migration.
ElevenLabs text-to-speech with mac-style say UX.
Oracle CLI second-model review/debug/refactor/design with selected files, dry-run token checks, API or browser engine.
Capture and automate macOS UI with the Peekaboo CLI.
Generate multiple radically different interface designs for a module using parallel sub-agents. Use when user wants to design an API, explore interface options, compare module shapes, or mentions "design it twice".
Build a throwaway prototype to flesh out a design — a runnable terminal app for state/business-logic questions, or several radically different UI variations toggleable from one route.
Interview the user relentlessly about a plan or design until reaching shared understanding, resolving each branch of the decision tree. Use when user wants to stress-test a plan, get grilled on their design, or mentions "grill me".