tanmayairbase/narrow-react-prop-types

¿Qué hace narrow-react-prop-types?

Una habilidad para agentes de IA que reduce los tipos de propiedades de componentes React a las rutas de código activas.

¿Qué hace?

Reduce los tipos de props de un componente React a solo aquellos caminos de código que realmente se usan en el proyecto. Esto elimina tipos innecesarios y facilita el autocompletado y verificación de tipos.

¿Por qué es útil?

• Evita errores de tipo al limitar las opciones a las realmente disponibles.
• Mejora la legibilidad del código al mostrar solo props activas.
• Acelera el desarrollo al reducir la sobrecarga cognitiva.

Plataformas compatibles

• Claude Code
• Cursor
• Codex (OpenAI)
• Otros agentes que soporten habilidades en markdown

¿Cómo funciona?

1. El agente escanea el proyecto en busca de definiciones de tipos de props.
2. Compara con el uso real del componente en el código.
3. Genera una nueva definición de tipo con solo las props activas.
4. Reemplaza o sugiere la nueva definición en el archivo de tipos.

Uso

Incluye esta habilidad en la configuración de tu agente para que automáticamente aplique la reducción de tipos cuando se detecten componentes React con tipos amplios.

Ejemplo

// Antes de narrow-react-prop-types
interface ButtonProps {
  variant?: 'primary' | 'secondary' | 'danger' | 'warning';
  size?: 'small' | 'medium' | 'large';
  disabled?: boolean;
}

// Después de narrow-react-prop-types
interface ButtonProps {
  variant?: 'primary' | 'secondary';
  size?: 'medium';
  disabled?: boolean;
}

Notas

• Requiere acceso de lectura al proyecto.
• Solo afecta archivos TypeScript (.ts, .tsx).
• No modifica archivos sin autorización explícita del usuario.