Flux UI
Live component index, Blade‑to‑Flux converter, and a full page generator.
@elyracode/flux-ui gives the agent up‑to‑date knowledge of every Flux UI component by fetching livewire/flux directly from GitHub. It also converts existing Blade views and scaffolds new pages with Livewire 4 best practices.
Install
elyra install npm:@elyracode/flux-ui
Tools
| Tool | Description |
|---|---|
flux_component_index |
Fetch the live Flux UI component library from GitHub. Always up to date, cached for 24h. |
blade_to_flux |
Analyze a Blade file and suggest Flux UI component replacements |
flux_generate_page |
Generate a complete page scaffold: Blade view, Livewire component, migration, route |
Commands
| Command | Description |
|---|---|
/flux |
Interactive selector for all Flux UI tools |
Examples
Live component reference
> Show me all available Flux UI components
> What props does flux:table support?
> Show me the flux:modal component API
Convert existing views
> Convert resources/views/users/index.blade.php to use Flux UI
> Analyze my dashboard view for Flux conversion opportunities
The agent identifies HTML/Tailwind patterns (tables, forms, modals, buttons) and suggests specific Flux replacements.
Generate new pages
> Generate a products CRUD page with Flux UI
> Create a user settings page with profile form and password change
> Build a dashboard with stats cards and a recent orders table
The agent generates all four files: Blade view with Flux components, Livewire class with #[Validate] / #[Computed] / #[Url], migration, and route.
How it works
- Component index — fetches
livewire/fluxfrom GitHub, filters component files, extracts props and slots - Blade converter — pattern‑matches 15+ HTML elements against Flux equivalents (button, input, select, table, modal, tabs, card, dropdown, breadcrumb, tooltip, switch, sidebar, header, …)
- Page generator — fetches the component index for accurate API usage, then produces structured generation instructions with Livewire 4 best practices
All GitHub fetches are cached at ~/.elyra/cache/github/ for 24 hours.