How UIQuarter analyzes UI codebases and what it finds

I've been working on a CLI tool called UIQuarter that does static analysis on UI codebases. It uses AST parsing to understand component structures, map dependencies, detect styling patterns, and find architectural issues. Then it can generate context files for AI coding tools, but the analysis itself is useful on its own. I wanted to write about what the tool actually detects and how, since "static analysis for UI codebases" is pretty vague. What it analyzes UIQuarter has 20 analyzers. When you run uiquarter init on a project, here's what happens under the hood. Component detection The ComponentAnalyzer uses ts-morph to parse the AST of every file. For React, it finds functional components by looking for functions that return JSX. For each one it extracts: Component name and file path Props (with TypeScript types if available) Hooks used ( useState , useEffect , custom hooks) Whether it's a default or named export On Vue it parses Single File Components — <script setup> and Options API