livewire/flux

The official UI component library for Livewire.

Maintainers

Details

github.com/livewire/flux

Source

Issues

Installs: 112 364

Dependents: 5

Suggesters: 1

Security: 0

Stars: 529

Watchers: 12

Forks: 43

Open Issues: 37

Language:Blade

v1.1.0 2024-12-16 23:05 UTC

README

Flux is the official UI component library for Livewire.

You can view the components in action at https://fluxui.dev.

Installation

Run the following command from your project's root directory:

composer require livewire/flux --prefer-dist

Flux has built-in scripts and styles that are required to use the components. Add the following to your app template's head and body tags:

<head>
    ...

    @fluxStyles
</head>
<body>
    ...

    @fluxScripts
</body>

Flux uses Tailwind CSS for its styles.

To get started quickly, you can include the Tailwind Play CDN in your head tag:

<head>
    ...

    <script src="//cdn.tailwindcss.com"></script>

    @fluxStyles
</head>

Or, for a more robust setup, you can include Flux's Blade files as part of your build in your Tailwind config's content array:

export default {
    content: [
        ...,
        "./vendor/livewire/flux-pro/stubs/**/*.blade.php",
        "./vendor/livewire/flux/stubs/**/*.blade.php",
    ],
    ...
};

What's included?

The following components are included in the livewire/flux package:

The rest of the Flux components are part of the paid (Pro) tier of Flux.

Purchase a "Pro" license key here: https://fluxui.dev/pricing