用途:在 Laravel 项目中使用 Flux UI 免费版组件构建界面。当创建 UI 组件或页面、处理表单、模态框或交互元素、查询可用 Flux 组件时激活。
主要能力:Flux UI 是面向 Livewire、基于 Tailwind CSS 的组件库,组件易用且可定制。免费版包含全部免费组件与变体,不含 Pro 组件。可用组件包括 avatar、badge、brand、breadcrumbs、button、callout、checkbox、dropdown、field、heading、icon、input、modal、navbar、otp-input、profile、radio、select、separator、skeleton、switch、text、textarea、tooltip。
使用方式:优先使用 Flux 组件,无对应组件时回退到标准 Blade 组件。示例:<flux:button variant="primary">Click me</flux:button>。表单字段示例:flux:fieldflux:labelEmail</flux:label><flux:input type="email" wire:model="email" /><flux:error name="email" /></flux:field>。模态框示例:<flux:modal wire:model="showModal">flux:headingTitle</flux:heading><p>Content</p></flux:modal>。图标默认使用 Heroicons,需在 Heroicons 官网查询准确名称,不要猜测或自造;Heroicons 中没有的图标可用 Lucide,通过命令导入:php artisan flux:icon crown grip-vertical github。详细模式与文档使用 search-docs 查询。
验证:检查组件渲染是否正确、测试交互状态、验证移动端响应式。
限制与常见问题:免费版不能使用 Pro 专属组件;创建自定义实现前应先确认是否已有 Flux 组件;应使用 search-docs 查询组件专属文档;需遵循项目已有的 Flux 使用模式。