Download the PHP package moonbaselabs/blade-components without Composer
On this page you can find all versions of the php package moonbaselabs/blade-components. It is possible to download/install these versions without Composer. Possible dependencies are resolved automatically.
Download moonbaselabs/blade-components
More information about moonbaselabs/blade-components
Files in moonbaselabs/blade-components
Package blade-components
Short Description A set of themeable components built with Tailwind CSS and AlpineJS for use with Laravel Blade.
License MIT
Homepage https://github.com/moonbaselabs/blade-components
Informations about the package blade-components
Blade Components
A set of themeable components built with Tailwind CSS and AlpineJS for use with Laravel Blade.
This project is still in Beta some APIs might change.
Installation
Setup Through Artisan
This command will overwrite asset files. It's best to run this in a fresh Laravel project after optionally installing Laravel Breeze. If you are installing this package in an existing project use the Manual Setup steps below.
Setup Manually
Publish the components configuration file:
Add the configuration file to the purge array in your Tailwind config:
Include the AlpineJS components in your JavaScript before loading AplineJS
Your're all set! You may customize your component themes in config/blade-components.php
.
Components
- Badge
- Button
- Checkbox
- Description
- Error
- Field
- Form
- Input
- Label
- Legend
- Menu
- Menu Item
- Radio
- Select
- Textarea
Badge
Renders a colored badge. Use the theme
attribute to customize the look and feel:
Output:
Button
Renders a form button:
Output:
When the href
attribute is set this component will render as a link:
Output:
Checkbox
Renders a form checkbox:
Output:
Checkboxes will maintain their checked
value after validation errors. If this field contains an error it's class attribute be set to the CSS classes specified for the invalid
key in your config file.
Description
Renders a form field description text to be used along with a label:
Output:
To make form fields accessible you should add aria-describedby="FIELD_NAME_description
to corresponding form elements, exp: <input type="password" aria-describedby="password_description">
Error
Renders an error message when a field fails server-side validation:
`
Output:
You may override server-side validation messages using the value
attribute or setting text content:
Use the bag
attribute to pull errors from a specific error bag:
Field
Renders a simple container for grouped form elements:
Output:
Form
Renders a form element with appropriate method and CSRF directives:
Output:
Add the has-files
attribute to support file uploads:
Output:
Input
Documentation coming soon.
Label
Documentation coming soon.
Legend
Documentation coming soon.
Menu
Documentation coming soon.
Menu Item
Documentation coming soon.
Radio
Documentation coming soon.
Select
Documentation coming soon.
Textarea
Documentation coming soon.
All versions of blade-components with dependencies
illuminate/support Version ^8.0|^9.0|^10.0
illuminate/view Version ^8.0|^9.0|^10.0