{
  "markdown": "# Livewire Flux MCP\n\n[![Npm](https://img.shields.io/npm/v/livewire-flux-mcp?style=flat-square)](https://www.npmjs.com/package/livewire-flux-mcp)\n[![CodeQL](https://img.shields.io/github/actions/workflow/status/lemaur/livewire-flux-mcp/github-code-scanning%2Fcodeql?style=flat-square)](https://github.com/leMaur/livewire-flux-mcp/actions/workflows/github-code-scanning/codeql)\n[![License](https://img.shields.io/github/license/lemaur/livewire-flux-mcp?style=flat-square&color=yellow)](https://github.com/leMaur/livewire-flux-mcp/blob/main/LICENSE.md)\n[![Downloads](https://img.shields.io/npm/d18m/livewire-flux-mcp?style=flat-square)](https://www.npmjs.com/package/livewire-flux-mcp)\n[![Sponsor](https://img.shields.io/github/sponsors/lemaur?style=flat-square&color=pink)](https://github.com/sponsors/leMaur)\n\nAn MCP (Model Context Protocol) server that provides access to Livewire Flux Components and Layouts from [Livewire&nbsp;Flux](https://fluxui.dev). This server allows AI assistants to fetch and search through Flux component and layout documentation on demand.\n\n> **⚠️ Disclaimer**\n> \n> This is a personal project and is not affiliated with Livewire Flux.\n\n## What it does\n\nThis MCP server scrapes and provides structured access to the Livewire Flux documentation, enabling AI assistants to:\n\n- Fetch documentation for specific Flux components from `https://fluxui.dev/components/`\n- Fetch documentation for specific Flux layouts from `https://fluxui.dev/layouts/`\n- Access component and layout reference sections with API details, props, and usage patterns\n- Search through component and layout documentation content\n- List all available Flux components\n- Browse and search all available Heroicons for use with flux:icon component\n- Access up-to-date documentation directly from the official Flux website\n- **High-performance caching** with 24-hour expiration for optimal response times\n\n## Why not just Laravel Boost?\n\nBoost already indexes Flux through its `search-docs` tool, and for a lot of questions that is\nenough. Two things it does not do:\n\n- **Scoped answers.** `search-docs` is a semantic search over a 17k-document corpus, so a broad Flux\n  question can come back as a several-thousand-token dump ([laravel/boost#290](https://github.com/laravel/boost/issues/290)).\n  This server fetches the one component page you asked for, plus its reference section.\n- **Pro-tier awareness.** Boost's bundled `fluxui-development` skill carries a hardcoded component\n  list and does not tell your agent which components need a paid Flux license. This server reads the\n  tier live and flags it, so your agent stops writing markup you cannot ship.\n\nIf you are on Boost, `npx livewire-flux-mcp install` wires both together — see\n[AI Guidelines & Skills](#ai-guidelines--skills). The two are complementary: keep Boost for\nLaravel, Livewire, Pest and the rest; let this server answer Flux.\n\n## Set Up Your Agents\n\nThe server runs over stdio and is launched with `npx`, so there is nothing to install\nglobally. Every agent stores that differently — pick yours below.\n\n<details>\n<summary><b>Cursor</b></summary>\n\nOne-click install:\n\n[Add `flux-docs` to Cursor](cursor://anysphere.cursor-deeplink/mcp/install?name=flux-docs&config=eyJjb21tYW5kIjoibnB4IiwiYXJncyI6WyIteSIsImxpdmV3aXJlLWZsdXgtbWNwIl19)\n\nOr add it by hand to `.cursor/mcp.json` (this project) or `~/.cursor/mcp.json` (every project):\n\n```json\n{\n    \"mcpServers\": {\n        \"flux-docs\": {\n            \"command\": \"npx\",\n            \"args\": [\"-y\", \"livewire-flux-mcp\"]\n        }\n    }\n}\n```\n\nCursor has no `cursor mcp add` command — the deeplink and the config file are the two supported routes.\n\n</details>\n\n<details>\n<summary><b>Claude Code</b></summary>\n\n```shell\nclaude mcp add --transport stdio --scope project flux-docs -- npx -y livewire-flux-mcp\n```\n\nEverything after `--` is passed to the server verbatim. `--scope project` writes `.mcp.json`\nin the project root so the whole team gets it:\n\n```json\n{\n    \"mcpServers\": {\n        \"flux-docs\": {\n            \"command\": \"npx\",\n            \"args\": [\"-y\", \"livewire-flux-mcp\"]\n        }\n    }\n}\n```\n\nUse `--scope local` (the default) to keep it to yourself, or `--scope user` for every project.\nA project-scoped server needs approving the first time you open the project. On Windows, wrap\nthe command: `-- cmd /c npx -y livewire-flux-mcp`.\n\n</details>\n\n<details>\n<summary><b>Codex</b></summary>\n\n```shell\ncodex mcp add flux-docs -- npx -y livewire-flux-mcp\n```\n\nThis writes to `~/.codex/config.toml`:\n\n```toml\n[mcp_servers.flux-docs]\ncommand = \"npx\"\nargs = [\"-y\", \"livewire-flux-mcp\"]\n```\n\nA project-level `.codex/config.toml` is only read once you have trusted the project.\nVerify with `codex mcp list`.\n\n</details>\n\n<details>\n<summary><b>Gemini CLI</b></summary>\n\n```shell\ngemini mcp add --scope project flux-docs npx -y livewire-flux-mcp\n```\n\nNote there is no `--` separator: the command and its arguments follow the server name\ndirectly. This writes `.gemini/settings.json` (use `--scope user` for `~/.gemini/settings.json`):\n\n```json\n{\n    \"mcpServers\": {\n        \"flux-docs\": {\n            \"command\": \"npx\",\n            \"args\": [\"-y\", \"livewire-flux-mcp\"]\n        }\n    }\n}\n```\n\n`gemini mcp list` reports the server as disconnected until the folder is trusted.\n\n</details>\n\n<details>\n<summary><b>GitHub Copilot (VS Code)</b></summary>\n\nCreate `.vscode/mcp.json`. Copilot uses `servers`, not `mcpServers`, and each entry declares its type:\n\n```json\n{\n    \"servers\": {\n        \"flux-docs\": {\n            \"type\": \"stdio\",\n            \"command\": \"npx\",\n            \"args\": [\"-y\", \"livewire-flux-mcp\"]\n        }\n    }\n}\n```\n\nOr run **MCP: Add Server** from the command palette (`Cmd+Shift+P` / `Ctrl+Shift+P`) and choose\nthe Workspace scope. The CLI equivalent writes to your user profile rather than the workspace:\n\n```shell\ncode --add-mcp '{\"name\":\"flux-docs\",\"command\":\"npx\",\"args\":[\"-y\",\"livewire-flux-mcp\"]}'\n```\n\nRequires VS Code 1.102+ with GitHub Copilot Chat enabled.\n\n</details>\n\n<details>\n<summary><b>Junie</b></summary>\n\nOpen **Settings → Tools → Junie → MCP Settings** and add the server, or edit\n`.junie/mcp/mcp.json` in the project (`~/.junie/mcp/mcp.json` for every project) directly:\n\n```json\n{\n    \"mcpServers\": {\n        \"flux-docs\": {\n            \"command\": \"npx\",\n            \"args\": [\"-y\", \"livewire-flux-mcp\"]\n        }\n    }\n}\n```\n\nJunie registers MCP servers by editing JSON — there is no CLI command. Project-level servers\nare ignored in untrusted projects.\n\n</details>\n\n## AI Guidelines & Skills\n\nRegistering the server tells your agent the tools *exist*. It does not tell it *when to reach\nfor them* — and in a Laravel Boost project it actively will not, because Boost ships a\n`fluxui-development` skill that sends Flux lookups to its own `search-docs` tool and carries a\nhardcoded component list. This package ships guidance that fixes that:\n\n```shell\nnpx livewire-flux-mcp install\n```\n\n| File | What it is |\n| --- | --- |\n| `.ai/skills/fluxui-development/SKILL.md` | On-demand skill: the Flux workflow, driven by this server's tools. **Replaces Boost's bundled skill of the same name.** |\n| `.ai/guidelines/fluxui-{free,pro}/core.blade.php` | Always-loaded guideline establishing that Flux questions are resolved through `flux-docs`. |\n| `.claude/agents/flux-ui-builder.md` | A Claude Code subagent that builds Flux interfaces and looks every component up before writing markup. |\n\nThe installer detects what applies: `livewire/flux-pro` in `composer.json` selects the `fluxui-pro`\nguideline key, `livewire/flux` selects `fluxui-free`, and a `.claude/` directory adds the subagent.\nRestrict it with `--boost` or `--claude`, point it elsewhere with `--path <dir>`, or preview with\n`--dry-run`. Afterwards run `php artisan boost:update` so Boost picks the files up.\n\n**On overwriting.** The skill is a deliberate replacement — Boost resolves custom skills last and\nkeys them on the frontmatter `name`, so `fluxui-development` has to match for the override to\nland. The guideline is never clobbered: an existing file at that path, or the guideline shipped\ninside the Flux package itself, is preserved below our block, which is delimited by\n`{{-- livewire-flux-mcp:begin --}}` markers so re-running only refreshes that section. Any file\nthe installer did not write is left alone unless you pass `--force`.\n\nTo undo, delete the installed files and run `php artisan boost:update` — Boost restores its own\nversions.\n\n> Laravel Boost only auto-discovers guidelines and skills from Composer packages, so an npm\n> package cannot register them automatically. This installer writes to the paths Boost documents\n> for custom guidelines and skills, which is why it works and survives `boost:update`.\n\n## Support Me\n\nHey folks,\n\nDo you like this package? Do you find it useful, and it fits well in your project?\n\nI am glad to help you, and I would be so grateful if you considered supporting my work.\n\nYou can even choose 😃:\n* You can [sponsor me 😎](https://github.com/sponsors/leMaur)\n* You can [buy me a coffee ☕ or a pizza 🍕](https://github.com/sponsors/leMaur?frequency=one-time&sponsor=leMaur)\n* You can \"Star ⭐\" this repository (it's free BTW 😉)\n\n## Available MCP Tools\n\nThe server provides four MCP tools:\n\n1. **`fetch_flux_docs`** - Fetches documentation for components or layouts\n   - `component` (optional): Specific component name to fetch docs for\n   - `layout` (optional): Specific layout name to fetch docs for (e.g., \"header\", \"sidebar\")\n   - `version` (optional): Flux major version to target — `'v1'` or `'v2'` (default `'v2'`)\n   - Automatically includes reference sections when available\n   - Fetches from `https://fluxui.dev/components/{component}` or `https://fluxui.dev/layouts/{layout}` (v2); routes to `https://v1.fluxui.dev/components/{component}` when `version='v1'`\n   - When the page is a paid Flux component, a `[NOTICE] This is a Flux Pro component …` line is prepended to the response\n\n2. **`list_flux_components`** - Lists all available Flux components\n   - `version` (optional): `'v1'` or `'v2'` (default `'v2'`)\n   - `tier` (optional): `'free'`, `'pro'`, or `'all'` (default `'all'`). On `'all'`, each component is annotated `[Pro]` or `[Free]`. On v1, the tier argument is ignored (v1 has no Pro tier).\n   - Provides component names and their documentation paths\n\n3. **`list_flux_layouts`** - Lists all available Flux layouts\n   - `version` (optional): `'v1'` or `'v2'` (default `'v2'`). On v1 the tool returns a brief \"layouts are not available in v1\" notice without making any HTTP request.\n   - Provides layout names and their documentation paths\n   - Layout names are read from `fluxui.dev/layouts`, falling back to the site-wide navigation on `fluxui.dev/components` when that index is unavailable — the individual `/layouts/{name}` pages are unaffected either way\n\n4. **`list_flux_component_icons`** - Lists all available Heroicons for flux:icon component\n   - `variant` (optional): Filter by icon variant (`outline`, `solid`, `mini`, `micro`)\n   - `search` (optional): Search term to filter icon names\n   - Fetches actual icon names from Heroicons GitHub repository\n   - Provides usage examples, dimensions, and GitHub links for each variant\n   - Returns comprehensive list of all available icons with proper Flux syntax\n\n### Example Usage\n\nOnce the MCP server is running, AI assistants can use it to:\n\n- Get documentation for a specific component: \"Show me the Button component docs\"\n- Get documentation for a specific layout: \"Show me the header layout docs\"\n- List available components: \"What Flux components are available?\"\n- List available layouts: \"What Flux layouts are available?\"\n- Browse all available icons: \"Show me all Heroicons available for flux:icon\"\n- Search for specific icons: \"Find all arrow icons in the outline variant\"\n- Get icon usage examples: \"How do I use the user icon in solid variant?\"\n\nThe server automatically fetches the latest documentation from fluxui.dev/components, fluxui.dev/layouts, and Heroicons from GitHub, presenting everything in a structured format for easy consumption by AI assistants. When fetching component or layout documentation, it includes both the main content and the reference section with detailed API information.\n\n### Versions\n\nFlux ships in two major versions, and the MCP server supports both:\n\n- **v2** (default) — the current host at `fluxui.dev`. Used when `version` is omitted or set to `'v2'`. Supports components, layouts, and Pro-tier awareness.\n- **v1** — the legacy host at `v1.fluxui.dev`. Used when `version='v1'`. Components only — Flux v1 has no `/layouts` route and no Pro tier. `list_flux_layouts` returns a friendly notice on v1 without making any HTTP request; `tier` is ignored on `list_flux_components` for v1.\n\nThe `version` argument is accepted on `fetch_flux_docs`, `list_flux_components`, and `list_flux_layouts`. `list_flux_component_icons` is version-independent (Heroicons are not part of Flux versioning).\n\n### Pro tier awareness\n\nA subset of Flux v2 components is only available with a paid Flux Pro license. The MCP server surfaces this in two ways:\n\n- **Notice on fetch.** When `fetch_flux_docs` retrieves a component that is Pro, the response is prepended with a single `[NOTICE] This is a Flux Pro component — requires a paid Flux license.` line.\n- **Tier filter on listing.** `list_flux_components` accepts `tier='free'` to hide Pro components, `tier='pro'` to show only Pro ones, or `tier='all'` (default) to list everything with `[Pro]` / `[Free]` annotations next to each name.\n\nThe list of Pro components is derived from `fluxui.dev/pricing` with a hardcoded fallback baked into the server, so tier filtering still works correctly if the pricing page is unreachable.\n\n## Manually Registering the MCP Server\n\nIf your editor is not one of the six covered in [Set Up Your Agents](#set-up-your-agents), register\nthe server manually using the following details:\n\n<table>\n<tr><td><strong>Command</strong></td><td><code>npx</code></td></tr>\n<tr><td><strong>Args</strong></td><td><code>-y livewire-flux-mcp</code></td></tr>\n</table>\n\n```json\n{\n    \"mcpServers\": {\n        \"flux-docs\": {\n            \"command\": \"npx\",\n            \"args\": [\"-y\", \"livewire-flux-mcp\"]\n        }\n    }\n}\n```\n\n`-y` skips the install confirmation on first launch, which a stdio server cannot answer.\n\n## Performance & Caching\n\nThe MCP server includes intelligent caching to provide optimal performance:\n\n- **24-hour cache expiration** - Content is cached for 1 day to balance freshness with performance\n- **Automatic cache management** - Expired entries are automatically cleaned up\n- **Intelligent cache keys** - Different cache entries for different parameters (component, layout, version, tier, variant)\n- **GitHub API rate limit protection** - Prevents hitting GitHub API limits when fetching Heroicons\n- **Instant responses** - Cached requests return in milliseconds instead of seconds\n\n### Cache Behavior\n\n- **Documentation requests**: Cached per component/layout and version combination\n- **Component listings**: Cached globally (refreshed daily)\n- **Layout listings**: Cached globally (refreshed daily)\n- **Icon listings**: Cached per variant and search combination\n- **Cache storage**: In-memory (resets when server restarts)\n\nThe caching system is particularly beneficial for the `list_flux_component_icons` tool, which can make up to 4 GitHub API calls per request without caching.\n\n## Changelog\n\nPlease see [CHANGELOG](CHANGELOG.md) for more information on what has changed recently.\n\n## Contributing\n\nPlease see [CONTRIBUTING](.github/CONTRIBUTING.md) for details.\n\n## Security Vulnerabilities\n\nPlease review [our security policy](../../security/policy) on how to report security vulnerabilities.\n\n## Credits\n\n- [Maurizio](https://github.com/lemaur)\n- [All Contributors](../../contributors)\n\n## License\n\nThe MIT License (MIT). Please see [License File](LICENSE.md) for more information.\n",
  "bytes": 15943,
  "sha": "38b03225aa5a8e889f4c81e6e72d5da8ff66b4fa2624b5ff2ded99001ed795d5",
  "repo_slug": "lemaur/livewire-flux-mcp",
  "fonte": "repo",
  "truncated": false,
  "api": "https://agentalog.com/api/listings/mcp_io_github_lemaur_livewire_flux_mcp_706d661f/readme"
}