investigate-diagram
Generate dependency diagrams from code or architecture. Traces code-level dependencies (hooks, queries, providers, components) or maps high-level system architecture. Outputs Mermaid diagrams in markdown or FigJam via Figma MCP. Use when the user asks to map dependencies, visualize relationships, create a dependency diagram, diagram an architecture, or trace how systems connect.
npx skills add majiayu000/claude-skill-registry --skill investigate-diagram --agent claude-code
Same command for any agent — swap --agent for codex, cursor, copilot.
Weekly change comes from our own snapshots, not the repository page — it measures attention, not adoption.
# Dependency Diagram Generator Generate dependency diagrams at any level — from code-level hook/query tracing to high-level architecture maps. ## Phase 1 — Gather Requirements Use AskQuestion to collect: ### 1. Scope detection | Scope | When to use | Examples | |---|---|---| | **Code-level** | Tracing function/hook/component dependencies | "Map dependencies of useQueryUserAccounts", "What calls AccountProvider?" | | **Architecture-level** | Mapping services, teams, integrations | "Diagram the Payroll system", "Map Risk Engineering architecture" | If ambiguous, ask which scope the user intends. ### 2. Entry points - **Code-level**: function names, hook names, component names, or file paths - **Architecture-level**: system, team, or domain name ### 3. Tracing options (code-level only) Ask with multi-select: | Option | What it traces | |---|---| | Hook calls | `useX()` calls inside function bodies | | GraphQL queries | `useQuery`, `useSuspenseQuery`, `useMutation` with document imports | | Context providers | React context providers consumed | | HOC wrappers | `withX()` higher-order components | | All of the above | Everything | Default: **All of the above** ### 4. Depth (code-level o
- Phase 1 — Gather Requirements
- 1. Scope detection
- 2. Entry points
- 3. Tracing options (code-level only)
- 4. Depth (code-level only)
- 5. Output format
- 6. Output location
- Phase 2 — Research
- Code-level: Trace Dependencies
- Architecture-level: Research the System
- Phase 3 — Verify Terminology
- Phase 4 — Negotiate Scope
- Node count and arrow budget
- Layout
What does the investigate-diagram skill do?
Generate dependency diagrams from code or architecture. Traces code-level dependencies (hooks, queries, providers, components) or maps high-level system architecture. Outputs Mermaid diagrams in markdown or FigJam via Figma MCP. Use when the user asks to map dependencies, visualize relationships, create a dependency diagram, diagram an architecture, or trace how systems connect.
How do I install it?
Run `npx skills add majiayu000/claude-skill-registry --skill investigate-diagram --agent claude-code` — it drops the skill into your project so the agent can pick it up. Swap the --agent value for codex, cursor or copilot if you use one of those.
Where does this skill come from?
From majiayu000/claude-skill-registry, a repository with 534 stars. We read it straight from the repository tree rather than a submitted listing, so what you see here is what is actually published.
Is a popular skill a good skill?
Not necessarily. Stars measure attention, not adoption — a repository can trend for a week and be abandoned. That is why we show the weekly change from our own snapshots next to the total, instead of a single flattering number.