Installation

Requirements

PHP 7.3 or higher
Laravel 8.64 or higher
Bootstrap 5.1.3 or higher

Because Laraloop UI take advantage of powerful @aware blade directive, which is available only from Laravel 8.64, we don't support any lower Laravel version.

Quick installation

composer require laraloop/ui
php artisan ui:install
npm install
npm run dev

Enable or disable components you need

Even though all components come enabled out-of-the-box, you may want to load only the components you need in your app for performance reasons. To do so, first publish the config file, then remove the components you don't need from the components settings.

return [
    'components' => [
        // Usage
        // 'component-alias' => 'ComponentClassName OR path.to.component-view',

        //
        // Accordion
        //

        'accordion'         => 'ui::accordion.index',
        'accordion.item'    => 'ui::accordion.item',

        //
        // Alert
        //

        'alert'  => \Laraloop\UI\Components\Alerts\Alert::class,

        // ...
    ],

    // ...
];

Prefixing

Components from this library might conflict with other ones from different libraries, or components from your own app. To prevent this, you can opt to add a prefix to the Blade UI Kit components. You can do this by setting the prefix option in the config file:

return [
    // ...
    'prefix' => 'ui',
    // ...
];

Now all components can be referenced as usual, but with the prefix before their name:

<x-ui-alert type="error" message="Hi, there! I'm an alert type danger component." />

For obvious reasons, the docs don't use any prefix in their code examples. So keep this in mind when setting a prefix and copy/pasting code snippets.