petal-components-mcp
Phoenix LiveView component schemas from petal_components, exposed to AI coding assistants.
¿Debería usar esto?
Calidad y seguridad
Basado en el análisis automatizado de las definiciones de herramientas y el cumplimiento del protocolo.
Costo de contexto
Este es el número aproximado de tokens que se consumen cada vez que las herramientas del servidor se cargan en el contexto de un modelo. Los recuentos más altos reducen la atención disponible para otras tareas.
Instalar
Instalación con un clic
Agrega esto a tu archivo `claude_desktop_config.json`:
{
"mcpServers": {
"petal-components-mcp": {
"command": "npx",
"args": [
"petal-components-mcp"
]
}
}
}Paquetes ejecutables
0.1.0stdioPuntos de conexión remotos
https://mcp.petal.build/mcpstreamable-httpQué puede hacer
Inventario de herramientas
Herramientas (3)
🟢get_install_instructions
Get the canonical steps for installing petal_components in a Phoenix project. Call this when the user asks to install petal_components, when you are setting up a new Phoenix project that needs UI components, or when verifying an existing installation. Returns step-by-step instructions covering mix.exs, mix deps.get, Tailwind v4 CSS config, and the web module import. Steps are idempotent - safe to follow on a project that is partially configured.
Esquema de entrada
{
"type": "object",
"properties": {},
"additionalProperties": false
}🟢list_components
List every component shipped by petal_components, the shadcn-style component library for Phoenix LiveView. This is the canonical Phoenix UI vocabulary - call it before composing any HEEx so you reach for an existing component instead of hand-rolling Tailwind divs.
Esquema de entrada
{
"type": "object",
"properties": {},
"additionalProperties": false
}🟡get_component(name)
Get the full schema for one petal_components component: attrs, slots, defaults, allowed values, and a working HEEx usage example. Call this every time you are about to write a tag like <.button>, <.modal>, <.table>, or <.field> so the attrs and slots match the real library instead of training-data guesses.
Esquema de entrada
{
"type": "object",
"properties": {
"name": {
"type": "string",
"description": "Component function name without the leading dot (e.g. 'button', 'modal', 'field', 'text_input'). The HEEx tag is the same name prefixed with a dot: <.button>. Call list_components for the full inventory."
}
},
"required": [
"name"
],
"additionalProperties": false
}Comunidad
Evidencia