Communityコーディング&開発github.com

tanmayairbase/narrow-react-prop-types

Reactコンポーネントのプロパティ(props)を実際のコードパスに限定するAIエージェントスキル。

narrow-react-prop-types とは?

このスキルは、Reactコンポーネントのプロパティ定義を、実際にコード内で使用されているパスに基づいて絞り込むためのものです。開発者はTypeScriptやFlowの型定義を手動で編集することなく、不要なプロパティを削除したり、より厳密な型に変更したりできます。主にClaude CodeやCursor、CodexなどのAIエージェント環境で動作し、コードベースの静的解析とAIによる推論を組み合わせて、安全かつ効率的なリファクタリングを支援します。具体的には、コンポーネントの使用箇所を分析し、実際に渡されているプロパティのみを抽出して型定義を更新します。

対応~Claude Code~Codex CLI~Cursor
Part ofReact
npx skills add tanmayairbase/narrow-react-prop-types

Installed? Explore more コーディング&開発 skills: steipete/bluebubbles, steipete/eightctl, steipete/blucli · View all 6 →

お気に入りのAIに質問する

このエージェントスキルを事前に読み込んだ状態で新しいチャットを開きます。

ドキュメント

narrow-react-prop-types は何をしますか?

Reactコンポーネントのプロパティ(props)を実際のコードパスに限定するAIエージェントスキル。

概要

このスキルは、Reactコンポーネントのプロパティ定義を、実際にコード内で使用されているパスに基づいて絞り込みます。開発者は手動で型定義を編集することなく、不要なプロパティを削除したり、より厳密な型に変更したりできます。

サポート環境

  • Claude Code
  • Cursor
  • Codex
  • その他のAIエージェント

使用方法

  1. 対象のReactコンポーネントファイルを開きます。
  2. AIエージェントに「narrow-react-prop-types」の適用を指示します。
  3. スキルが自動的にコンポーネントの使用箇所を解析し、実際に渡されているプロパティのみを抽出します。
  4. 型定義が更新され、不要なプロパティが削除されます。

注意事項

  • このスキルは静的な解析に基づいて動作するため、動的なプロパティの受け渡しには対応していない場合があります。
  • 適用前にバックアップを取ることを推奨します。
  • 型定義の変更後は、必ずテストを実行して動作を確認してください。

関連スキル