Installation

Require the runtime package with Composer, then run ui:install. The installer detects your Laravel version, Tailwind, Vite, Alpine, and Livewire setup, writes the asset entrypoints and configuration files into your project, and prints manual steps only when an automatic edit would be unsafe.

Requirements

• Laravel — any supported version; the installer reads app()->version() and reports it at setup time.
• Tailwind CSS v4 — detected via package.json dependencies, tailwind.config.js / tailwind.config.ts, or the string tailwindcss anywhere in your CSS entrypoint (e.g. @import 'tailwindcss').
• Vite — detected via vite.config.js / vite.config.ts or a vite entry in package.json. The installer wires imports automatically when a standard entrypoint is found.
• Alpine.js 3.x — required by interactive components (dialog, dropdown, tabs, …); Blade-only components work without it. Detected via package.json, reported at install time, and recorded in ui.json.
• Livewire (optional) — detected via composer.lock or composer.json; recorded in ui.json.

Quick start

composer require jml/brok

php artisan ui:install

php artisan ui:add button

php artisan ui:doctor

Pre-launch install

{
    "require": {
        "jml/brok": "^0.2"
    },
    "repositories": {
        "brok": {
            "type": "path",
            "url": "../../packages/ui",
            "options": { "versions": { "jml/brok": "0.2.4" } }
        }
    }
}

composer require jml/brok:^0.2

php artisan ui:install

Once the package is published, the path repository is no longer needed — the install collapses to the composer require jml/brok quick-start above.

Registry endpoint

The CLI reads the hosted registry at https://brokui.dev/r/open by default. Set BROK_REGISTRY_URL only to point at a self-hosted mirror or a locally built apps/docs-registry serving /r/open:

# Optional — only for a self-hosted or local registry
BROK_REGISTRY_URL=http://localhost:8080/r/open

Prerequisite details

• Tailwind CSS 4.x is required. Brok ships v4-only design-token CSS. Tailwind v3, v5, or an unconfirmable version renders copied components unstyled. ui:install and ui:doctor warn loudly when v4 cannot be confirmed — see the Tailwind upgrade guide. ui:doctor is advisory on a fresh project and fails once components are actually installed against a non-v4 Tailwind.
• Alpine.js 3.x is required for interactive components. Anything with an x-data="uiX(...)" (e.g. dialog, dropdown, tabs) needs Alpine; Blade-only components work without it. If Alpine isn't installed or your JS entrypoint never calls Alpine.start(), ui:install warns and can wire the bootstrap for you:
  terminal Copy terminal to clipboard

  npm install alpinejs
  php artisan ui:install --alpine

  Or add the three bootstrap lines yourself if you prefer to control your entrypoint:
  resources/js/app.js JS Copy resources/js/app.js to clipboard

  import Alpine from 'alpinejs';
  window.Alpine = Alpine;
  Alpine.start();

What ui:install generates

Every file is written only if it does not already exist, so rerunning the command is always safe. Files that differ from the package template are flagged with a warning rather than overwritten.

Use block and page tags

<brok:*> and <x-ui.*> components need no setup. To use an installed block or page as <x-blocks.hero-centered> or <x-pages.app-shell-inset>, register the anonymous component path once in AppServiceProvider::boot(). Livewire views work the same way.

use Illuminate\Support\Facades\Blade;

public function boot(): void
{
    Blade::anonymousComponentPath(resource_path('views'));
}

The prefixed form, Blade::anonymousComponentPath(resource_path('views/blocks'), 'blocks') and the same for pages, gives <x-blocks::name> tags instead. @include('blocks.name') works without any registration. php artisan ui:doctor warns when the path is missing.