AI & Agent Tooling

WireKit is designed to be legible to large language models and AI coding agents. Every component shares one predictable <x-wirekit::*> namespace, every prop and slot is published in a machine-readable schema, and every documentation page is downloadable as raw Markdown — so whatever assistant you work with can discover the full component library, suggest the right tag, and write correct Blade the first time.

This page is the single reference for that surface: the public manifests served from docs.wirekit.app, the project-side Artisan exports you run inside your own app, and the editor and agent integrations that tie them together. Everything here is additive — none of it changes how your app builds or ships.

Quick start: onboard your assistant

Paste this into your AI assistant (Cursor, Claude Code, ChatGPT, GitHub Copilot Chat, or any other) to point it at WireKit's full surface in one shot:

WireKit is a free, MIT-licensed UI component library for Laravel Livewire.
Every component is a Blade tag of the form <x-wirekit::name>.

- Machine-readable component index (every component, prop, slot, category):
  https://docs.wirekit.app/components.json
- Concise LLM overview:
  https://docs.wirekit.app/llms.txt
- Raw Markdown for any page: append .md to its URL, e.g.
  https://docs.wirekit.app/components/modal.md

Use these to write correct WireKit Blade. Prefer composing existing
WireKit components over hand-rolling raw HTML.

The assistant now knows where to look up any component instead of guessing prop names — the single biggest win for accuracy.

Why WireKit works well with AI

One namespace, zero guesswork. Every component is <x-wirekit::*>. An assistant that learns the pattern once can compose the entire library — no per-component import lines, no ambiguous class names to disambiguate.
A machine-readable schema. components.json lists every component with its exact prop names, types, defaults, and slots — so an agent reads the contract instead of hallucinating it.
Raw Markdown per page. Append .md to any docs URL to get the original source, ready to drop into a context window. The examples are guaranteed to match what a developer sees because it is the same source that renders the page.
Project-side exports. Artisan commands emit the same schema from inside your app, so an agent working in your repository understands WireKit with no network access at all.
A ready-made rules file. php artisan wirekit:cursor-rules drops a Cursor rules file into your project so the editor's assistant follows WireKit conventions automatically.
A live MCP server. php artisan wirekit:mcp-serve lets an MCP-capable editor query the component catalog as live tools while you author — so it reads the real props and design tokens instead of recalling them.

Machine-readable manifests

Two manifests are published at the root of docs.wirekit.app and regenerated on every docs deploy, so they always describe the current release. Fetch them directly — no authentication, no rate limit.

Manifest	URL	What it contains
Component index	`components.json`	Every component with its props, slots, category, and docs URL
LLM overview	`llms.txt`	A concise, plain-text overview written for language models

components.json — the component index

The canonical machine-readable description of the library. Each entry carries the component's tag name, its category, every prop with its type and default, its slots, and a link to the human docs page. An agent fetches it once and writes against the real contract:

# 1. Pull the full component index (props, slots, categories for every component).
curl -s https://docs.wirekit.app/components.json

# 2. Or pipe it through jq to list just the tag names.
curl -s https://docs.wirekit.app/components.json | jq -r '.components[].name'

llms.txt — the LLM overview

A short, plain-text orientation file describing what WireKit is, the <x-wirekit::*> namespace, and where to find the deeper manifests. It follows the emerging llms.txt convention for exposing a site to language models, and it is the smallest possible file to seed an assistant's context before it dives into components.json.

Raw Markdown for any page

Every documentation page is available as raw Markdown — append .md to its URL:

https://docs.wirekit.app/components/button       → the rendered page
https://docs.wirekit.app/components/button.md    → the raw Markdown source

Drop the Markdown straight into a chat context window or a retrieval index. Because it is the exact source that renders the page, the code examples an assistant reads are the same ones a developer sees — no drift between what the model learns and what actually ships.

Project-side exports

Prefer to keep everything local? Three Artisan commands emit the same machine-readable data from inside your own app — ideal for an agent working in your repository without network access, or for committing a schema snapshot your whole team shares. Full flag documentation lives in the CLI Reference.

`wirekit:export-json` — the schema manifest

Emits the same component schema as components.json, generated from the package installed in your app:

# 1. Print the schema to stdout (machine-minified JSON).
php artisan wirekit:export-json

# 2. Add --pretty for a human-readable, diff-friendly file you can commit.
php artisan wirekit:export-json --pretty > .wirekit-schema.json

php artisan wirekit:install already writes a .wirekit-schema.json to your project root for exactly this purpose — a zero-configuration feeder file for IDE extensions and AI tools. Commit it for stable autocomplete across your team, or add it to .gitignore to keep it fresh on every install. It is regenerated on every wirekit:install run.

`wirekit:export-api-map` — an AI-friendly sitemap

Emits a hierarchical, machine-readable sitemap of every WireKit surface — components, Alpine plugins, and docs routes. It is built specifically for MCP servers, Claude Code, ChatGPT Codex, Cursor, Aider, and other AI tooling that wants to know which surfaces exist and where to read more:

# 1. Emit the AI-friendly sitemap of every WireKit surface.
php artisan wirekit:export-api-map

Editor & agent integration

Cursor

wirekit:cursor-rules publishes WireKit's Cursor rules file to .cursor/rules/wirekit.mdc in your project. The file teaches Cursor's assistant the <x-wirekit::*> namespace, the composition conventions, and the house rules — so completions follow WireKit patterns from the start:

# 1. Publish the WireKit rules file into .cursor/rules/wirekit.mdc.
php artisan wirekit:cursor-rules

# 2. Re-run with --force to overwrite an existing copy after an upgrade.
php artisan wirekit:cursor-rules --force

Commit .cursor/rules/wirekit.mdc so every teammate's editor shares the same rules.

MCP server (live, local)

php artisan wirekit:mcp-serve runs a local Model Context Protocol server over stdio (JSON-RPC 2.0). An MCP-capable editor spawns it as a child process and queries the component catalog live while you author — so the assistant reads real prop signatures and design tokens instead of recalling them. It is local and read-only: no port, no daemon, no network, and always version-matched to the WireKit installed in your app. It exposes four tools:

search_components — find components by name or description
list_components — every component, grouped by category
get_component — one component's props, slots, sub-components, and docs URL
get_tokens — the design-token reference (colors, spacing, radii, and the rest)

Point your editor's MCP settings at the command. The universal stdio form (works in a project-local .cursor/mcp.json and most MCP clients):

{
  "mcpServers": {
    "wirekit": {
      "command": "php",
      "args": ["artisan", "wirekit:mcp-serve"]
    }
  }
}

The server must run from your Laravel project root (where artisan lives) — a project-local .cursor/mcp.json does this automatically. For Claude Code, register it from the project root:

# 1. Register the WireKit MCP server (run from your project root).
claude mcp add wirekit -- php artisan wirekit:mcp-serve

It is not meant to be run by hand — the editor manages its lifecycle.

No MCP client? Any agent that runs in your repository works just as well against the project-side exports: point it at the committed .wirekit-schema.json (or run wirekit:export-api-map) so it resolves component names and props locally, with no network round-trip. The api-map's hierarchical shape lets a tool suggest the right surface and then fetch the matching docs page on demand.

GitHub Copilot and other assistants

Any assistant that reads your workspace benefits from a committed .wirekit-schema.json at the project root — it surfaces every component and prop as the model indexes your repository. Pair it with the published components.json for the always-current release schema.

CLI introspection

For an agent that can run shell commands, two read-only commands expose the library without leaving the terminal:

# 1. List every component — optionally filtered by category.
php artisan wirekit:list
php artisan wirekit:list --category=Forms

# 2. Reveal one component's props, slots, and usage.
php artisan wirekit:show button

Prompting tips

Anchor the assistant first. Give it the quick-start block above before asking for components, so it looks up components.json instead of guessing prop names.
Ask for composition, not raw HTML. WireKit's value is in composing <x-wirekit::row>, <x-wirekit::card>, <x-wirekit::stat>, and friends — prompt for those rather than <div> scaffolding.
Pin the version. If you committed .wirekit-schema.json, tell the assistant to treat it as the source of truth so it matches your installed release exactly.