harrisonclewis/laravel-sleek

JSX-style component syntax for Laravel Blade

v0.0.4 2026-05-18 20:31 UTC

Requires

• php: ^8.1
• illuminate/contracts: ^10.0|^11.0|^12.0|^13.0
• spatie/laravel-package-tools: ^1.16

Requires (Dev)

• laravel/pint: ^1.14
• orchestra/testbench: ^9.0|^10.0|^11.0
• pestphp/pest: ^3.0
• pestphp/pest-plugin-laravel: ^3.0

MIT

• Harrison

• components
• view
• laravel
• compiler
• react
• blade

README

Introduction

JSX-style component syntax for Laravel Blade.

<Layouts.App>
    <Form method="POST" action="{{ route('login') }}">
        <Form.Group>
            <Form.Label>Email</Form.Label>
            <Form.Input type="email" name="email" />
        </Form.Group>

        <Button type="submit">Sign in</Button>
    </Form>
</Layouts.App>

Installation

composer require harrisonclewis/laravel-sleek

Usage

PascalCase tags are transformed to Laravel's x-component syntax at compile time.

<Button />               →  <x-button />
<UserProfile />          →  <x-user-profile />
<Form.Input />           →  <x-form.input />
<Card.Body class="p-4">  →  <x-card.body class="p-4">

Standard HTML tags (div, span, p, etc.) are never transformed.

Configuration

Publish the config file if you need to adjust defaults:

php artisan vendor:publish --tag=sleek-config

// config/sleek.php
return [
    'enabled'     => true,
    'ignore_tags' => [ /* additional tags to leave untouched */ ],
];

Requirements

• PHP ^8.1
• Laravel ^10.0|^11.0|^12.0|^13.0

License

MIT