Agent skill

components-generators

Guidance for writing `@kubb/react-fabric` components and generators (React-based and function-based).

Stars 163
Forks 31

Install this agent skill to your Project

npx add-skill https://github.com/majiayu000/claude-skill-registry/tree/main/skills/data/components-generators

SKILL.md

Components & Generators Skill

This skill helps agents answer questions about authoring components and generators using @kubb/react-fabric.

When to Use

  • When asked where to place components/generators
  • When guiding authors to write React-based generators

What It Does

  • Lists common react-fabric components and where to place them
  • Explains generator types and recommended patterns
  • Provides a small conceptual example for authors

Conceptual Example

tsx
import { File, Function } from '@kubb/react-fabric'
export function Query({ name }: Props): FabricReactNode {
  return (
    <File.Source name={name} isExportable isIndexable>
      <Function name={name} export>
        // Generated code
      </Function>
    </File.Source>
  )
}

Tips for Agents

  • Recommend small, composable components
  • Encourage use of usePluginManager(), useOas(), useOperationManager() in components
  • Recommend deterministic output to avoid noisy diffs

Related Skills

Skill Use For
../plugin-architecture/SKILL.md For lifecycle and plugin registration details

Didn't find tool you were looking for?

Be as detailed as possible for better results