Claude-skill-registry state-lifting

install

source · Clone the upstream repo

git clone https://github.com/majiayu000/claude-skill-registry

Claude Code · Install into ~/.claude/skills/

T=$(mktemp -d) && git clone --depth=1 https://github.com/majiayu000/claude-skill-registry "$T" && mkdir -p ~/.claude/skills && cp -r "$T/skills/devops/state-lifting" ~/.claude/skills/majiayu000-claude-skill-registry-state-lifting && rm -rf "$T"

manifest: skills/devops/state-lifting/SKILL.md

状態リフティング

概要

共有状態の配置と伝播設計を整理し、最小限の状態リフティングで一貫したデータフローを維持するスキル。 Reactにおける状態管理の基本原則から高度なパターンまでをカバーする。

ワークフロー

analyze-requirements → design-state-placement → implement-lifting → evaluate-context → apply-patterns

Phase 1: 状態共有の要件整理

目的: 共有状態と共通親の候補を特定する

アクション:

コンポーネントツリーを把握する
状態を使用するコンポーネントを列挙する
最も近い共通親を特定する

参照:

references/state-placement-guide.md

Task:

agents/sl-001-analyze-requirements.md

を参照

Phase 2: Props経由の状態伝播

目的: 状態と更新関数をpropsで一方向に伝播する

アクション:

親コンポーネントに状態を集約する
子コンポーネントへpropsで伝播する
更新関数をメモ化し依存関係を整理する

参照:

references/colocation-principles.md

Task:

agents/sl-003-props-state-passing.md

を参照

Phase 3: Context導入判断

目的: Prop Drillingが過剰な場合にContext導入を判断する

アクション:

Props伝播階層と頻度を確認する
Prop Drillingの負荷を評価する
Context導入のメリット/デメリットを整理する

参照:

references/prop-drilling-solutions.md

references/context-patterns.md

Task:

agents/sl-005-context-api-introduction.md

を参照

Phase 4: 複合コンポーネント設計

目的: Compound Componentで共有状態を局所化する

アクション:

共有状態を局所化する構成を決める
子コンポーネントの役割を定義する
APIと使用例を設計する

テンプレート:

assets/compound-component-template.md

Task:

agents/sl-007-compound-component-pattern.md

を参照

Task仕様ナビ

Task	起動タイミング	入力	出力
sl-001-analyze-requirements	Phase 1開始時	コンポーネント情報、状態一覧	状態共有要件レポート
sl-003-props-state-passing	Phase 2開始時	状態共有要件、既存コード	Props伝播設計
sl-005-context-api-introduction	Phase 3開始時	Props伝播設計	Context導入判断
sl-007-compound-component-pattern	Phase 4開始時	Context判断、設計要件	Compound Component設計

詳細仕様: 各Taskの詳細は

agents/

ディレクトリを参照

ベストプラクティス

すべきこと

推奨事項	理由
共通親が最小の箇所に状態を配置する	過度なリフティングを避けられる
Props経由の一方向フローを維持する	デバッグ容易性が高まる
Context導入は必要最小限に留める	依存範囲が広がり過ぎるのを防ぐ
派生状態は計算で済ませる	状態重複を避けられる
コンポジションパターンを検討する	Prop Drillingを根本解決できる

避けるべきこと

禁止事項	問題点
深いProp Drillingを放置	保守性と可読性が低下する
不要なグローバル化	影響範囲が拡大する
状態の重複管理	不整合が発生する
Contextの乱用	再レンダリングを誘発する
高頻度更新データをContext化	パフォーマンスが劣化する

リソース参照

references/（詳細知識）

リソース	パス	読込条件
状態配置ガイド	references/state-placement-guide.md	共有状態の配置判断時
Prop Drilling対策	references/prop-drilling-solutions.md	Prop Drilling対策検討時
Contextパターン	references/context-patterns.md	Context導入判断時
Colocation原則	references/colocation-principles.md	状態と利用箇所の距離判断時

scripts/（決定論的処理）

スクリプト	機能	使用例
`analyze-state-structure.mjs`	状態構造の分析	`node scripts/analyze-state-structure.mjs <file.tsx>`
`log_usage.mjs`	使用記録の保存	`node scripts/log_usage.mjs --result success`
`validate-skill.mjs`	スキル構造検証	`node scripts/validate-skill.mjs`

assets/（テンプレート）

アセット	用途
`compound-component-template.md`	Compound Component概要・索引
`select-template.md`	Selectコンポーネント
`accordion-template.md`	アコーディオンコンポーネント
`tabs-template.md`	タブコンポーネント
`modal-template.md`	モーダルコンポーネント
`context-provider-template.md`	Context Providerテンプレート

変更履歴

Version	Date	Changes
2.2.0	2026-01-06	compound-component-template分割、実装事例追加
2.1.0	2026-01-03	18-skills.md仕様に完全準拠、構造整理
2.0.0	2026-01-02	ワークフロー再編
1.0.0	2025-12-28	初版作成