Skip to content
UI Brok

Loading…

No results

Browse catalog

Introduction

Brok is a copy-into-your-app Blade UI registry for Laravel. Instead of installing a UI library as a black-box package dependency, a single Artisan command writes real, readable Blade and CSS directly into your project — code you own, can edit freely, and can still receive upstream improvements for safely.

It works like shadcn/ui but for Laravel: once the files land in your resources/ directory there is no runtime dependency on Brok itself — just plain Blade components and CSS custom-property tokens.

New here and weighing it against a runtime component package, an admin-panel builder or a Blade component kit? Why Brok is the honest take on when copy-in is the right call — and when it isn't.

How it works

Four commands, start to finish.

Require the package

Add the CLI and registry client to your project once.
terminal
composer require jml/brok

Run the installer

Detects your Tailwind, Vite, Alpine and Livewire setup and wires up asset entrypoints. Generates ui.json, ui-lock.json, and the CSS/JS entry files.
terminal
php artisan ui:install

Add a component

Fetches the component from the registry and writes it into resources/views/components/ui/. Resolves any sub-dependencies automatically.
terminal
php artisan ui:add button

Edit it — it's your code now

Open the copied Blade file and change whatever you like. Brok never touches the file again unless you explicitly run ui:update. The lock file records your installed version and hash so future updates are diff-aware.

Why copy the code in?

  • Fully editable. The component lives in your repo. Rename a class, swap markup, add Alpine state — no overrides or forks needed.
  • No runtime dependency. Once the files are copied, removing Brok from composer.json has zero effect on your running app.
  • Design-token theming. Every component reads from semantic CSS custom properties (bg-primary, border-input, …). Retheme by editing one CSS file, not every component.
  • Safe opt-in updates. php artisan ui:update --check shows a diff of what changed upstream without overwriting your edits. You decide what to merge.

FAQ

Note

Is Brok a runtime dependency of my app?
No. Once a component is copied in, the generated code is plain Blade + CSS. If you later remove jml/brok from Composer your app continues to work — only the ui:* CLI commands disappear.

Note

Can I still receive updates after editing a component?
Yes. Brok stores a compressed pristine copy in committed ui-lock.json and a fast local copy in .jml/cache at install time. Running php artisan ui:update --check diffs the upstream version against that baseline and shows you exactly what changed, without touching your edited files.

Next steps