Laravel Blade Components

Opinionated Laravel Blade component library organised in ten families.

Families

Family	Description
content	Typography and inline content elements
data	Tables of data
display	Cards, badges, avatars, accordions and other blocks that show information
feedback	Alerts, banners, progress and placeholders
form	Form controls, wrappers and validation
layout	Structural and semantic page elements
medias	Images, video, audio and embeds
navigation	Steps, shortcuts and the bars of an application
overlay	Modal, drawer, popover, dropdown and tooltip, on native HTML
utility	The one script of the library, with a CSP nonce, and what uses it

Aliases

Every component is registered under two aliases:

Alias	Example	Purpose
x-zk-*	<x-zk-input>	Public usage in consumer apps
x-[family].*	<x-form.input>	Internal usage inside package templates

Attribute Forwarding

All components forward undeclared attributes to their root HTML element via $attributes. Any attribute not listed in a component's prop table passes through directly.

<x-zk-input name="q" wire:model="query" x-bind:disabled="loading" data-tracking="search" />

Boolean Props

Boolean props accept PHP booleans (:prop="true") or bare HTML attributes (prop). Passing string "false" is also handled correctly via internal filter_var casting.

{{-- All equivalent --}}
<x-zk-input name="email" required />
<x-zk-input name="email" :required="true" />
<x-zk-input name="email" required="true" />

Installation

composer require zairakai/laravel-blade-components

Publish assets optionally:

# Views only
php artisan vendor:publish --tag=zairakai-components

# Translations only
php artisan vendor:publish --tag=zairakai-lang

# Config only
php artisan vendor:publish --tag=zairakai-config

# Everything
php artisan vendor:publish --tag=zairakai-all