LaravelPackages.net
Acme Inc.
Toggle sidebar
hirohitopg/blade-bootstrap-components

A set of Blade Components based on Boostrap-4 CSS Framework

16
0
v1.1.1
About hirohitopg/blade-bootstrap-components

hirohitopg/blade-bootstrap-components is a Laravel package for a set of blade components based on boostrap-4 css framework. It currently has 0 GitHub stars and 16 downloads on Packagist (latest version v1.1.1). Install it with composer require hirohitopg/blade-bootstrap-components. Discover more Laravel packages by hirohitopg or browse all Laravel packages to compare alternatives.

Last updated

Blade Bootstrap Components

Latest Version on Packagist Build Status Quality Score Total Downloads

A new set of Blade components to rapidly build forms with Bootstrap 5.

Features

  • Components for major Bootstrap components, including forms.
  • Component logic independent from Blade views.
  • Bind a target to a form (or a set of elements) to provide default values.
  • Re-populate forms with old input.
  • Validation errors.
  • Form method spoofing.
  • Components classes and Blade views fully customizable.
  • Support for prefixing the components.

Requirements

  • PHP 7.4 + Laravel 8+

Installation

You can install the package via composer:

composer require hostmoz/blade-bootstrap-components

Publishing Assets

For some components to work correctly(ex: date-picker) you will need to publish the package assets using the command below:

php artisan vendor:publish --tag=bootstrap-assets --force

Configuration

There is no configuration needed unless you want to customize the Blade views and components.

Quick example

<x-bootstrap::form.form>
    <div class="row">
        <div class="col-12 mb-3">
            <x-bootstrap::form.input name="name" label="Your Name" />
        </div>
        <div class="col-12 mb-3">
            <x-bootstrap::form.select name="country_code" :options="$countries" label="Select a Country"/>
        </div>
        <div class="col-12 mb-3">
            <x-bootstrap::form.date-picker name="teste" label="Pick a Date"/>
        </div>

    </div>
    <div class="row">
        <div class="col-6">
            <!-- Inline radio inputs -->
            <x-bootstrap::form.group name="newsletter_frequency" label="Newsletter frequency" inline>
                <x-bootstrap::form.radio name="newsletter_frequency" value="daily" label="Daily" />
                <x-bootstrap::form.radio name="newsletter_frequency" value="weekly" label="Weekly" />
            </x-bootstrap::form.group>
        </div>
        <div class="col-6">
            <x-bootstrap::form.group>
                <x-bootstrap::form.checkbox name="subscribe_to_newsletter" label="Subscribe to newsletter" />
                <x-bootstrap::form.checkbox name="agree_terms" label="Agree with terms" />
            </x-bootstrap::form.group>
        </div>
    </div>
</x-bootstrap::form.form>

Usage

Testing

composer test

Changelog

Please see CHANGELOG for more information what has changed recently.

Contributing

Please see CONTRIBUTING for details.

Security

If you discover any security related issues, please email [email protected] instead of using the issue tracker.

Credits

License

The MIT License (MIT). Please see License File for more information.

Star History Chart