What is petal-components-mcp?

petal-components-mcp is a server that helps AI coding assistants write correct code when building user interfaces with a component library called petal_components. The petal_components library is a set of pre-built UI components for Phoenix LiveView, which is a web framework for the Elixir programming language. Without this server, AI assistants writing Phoenix templates tend to invent their own styling from scratch and ignore the petal_components building blocks entirely, producing inconsistent output. With the server connected, the AI can look up exactly what each component accepts, its required and optional settings, and see a usage example before writing any code. The server follows the Model Context Protocol, a standard plug-in format that lets AI coding tools like Claude Code, Cursor, and Windsurf call out to external knowledge sources. It exposes two tools: list_components returns a catalogue of all available petal_components with a one-line description of each, and get_component returns the full specification for a single component, including all its accepted attributes, slots, named regions for child content, default values, and a working code example. The server is written in TypeScript and works by bundling a JSON snapshot of the entire petal_components library. That snapshot is generated automatically by a script that inspects the library's own component registry, so the schemas stay in sync with whatever version of petal_components is current. The hosted version runs at mcp.petal.build and can be added to Claude Code with a single command. Running it locally is also supported for development purposes, with the same extraction script pulling the latest petal_components release from Hex so nothing needs to be copied over by hand. Two more tools, a natural language search and a way to generate composed UI patterns from multiple components, are planned for a future release.