PHPackages                             mantix/livewire-bootstrap-components - PHPackages - PHPackages  [Skip to content](#main-content)[PHPackages](/)[Directory](/)[Categories](/categories)[Trending](/trending)[Leaderboard](/leaderboard)[Changelog](/changelog)[Analyze](/analyze)[Collections](/collections)[Log in](/login)[Sign up](/register)

1. [Directory](/)
2. /
3. [Templating & Views](/categories/templating)
4. /
5. mantix/livewire-bootstrap-components

ActiveLibrary[Templating & Views](/categories/templating)

mantix/livewire-bootstrap-components
====================================

Reusable Livewire Bootstrap components by Mantix BV

v1.23(3mo ago)1412MITBladePHP ^8.0

Since Jul 30Pushed 3mo agoCompare

[ Source](https://github.com/Mantix/livewire-bootstrap-components)[ Packagist](https://packagist.org/packages/mantix/livewire-bootstrap-components)[ RSS](/packages/mantix-livewire-bootstrap-components/feed)WikiDiscussions main Synced 1mo ago

READMEChangelog (10)Dependencies (1)Versions (25)Used By (0)

Livewire Bootstrap Components
=============================

[](#livewire-bootstrap-components)

Reusable Livewire Bootstrap components by Mantix BV.

Installation
------------

[](#installation)

```
composer require mantix/livewire-bootstrap-components
```

Usage
-----

[](#usage)

Publish the views and styles (optional):

```
# Publish views
php artisan vendor:publish --provider="Mantix\\LivewireBootstrapComponents\\LivewireBootstrapComponentsServiceProvider" --tag=views

# Publish SCSS files
php artisan vendor:publish --provider="Mantix\\LivewireBootstrapComponents\\LivewireBootstrapComponentsServiceProvider" --tag=scss
```

Components
----------

[](#components)

### Card Component

[](#card-component)

A flexible card component with customizable styling and optional header/footer.

```

    Card content here.

```

**Attributes:**

- `title` (string, optional): Card header title
- `square` (boolean, default: false): Apply square styling
- `background_image` (string, optional): Background image URL
- `background_color` (string, optional): Bootstrap background color class
- `text_color` (string, optional): Bootstrap text color class
- `footer` (string, optional): Footer content
- `actions` (array, optional): Array of action configurations (see Actions Component)

### Form Group Component

[](#form-group-component)

A form group wrapper with label, icon support, and automatic error handling.

```

```

**Attributes:**

- `label` (string, optional): Form field label
- `icon` (string, optional): FontAwesome icon name (without 'fa-' prefix)
- `required` (boolean, default: false): Show required asterisk

**Features:**

- Automatically detects `wire:model` and displays validation errors
- Supports input groups with icons
- Responsive design with proper spacing

### List Row Component

[](#list-row-component)

A list item component with flexible action buttons for CRUD operations.

```

    Item content here

```

**Attributes:**

- `class` (string, optional): Additional CSS classes
- `background_color` (string, optional): Bootstrap background color
- `text_color` (string, optional): Bootstrap text color
- `actions` (array, optional): Array of action configurations (see Actions Component)

**Action Configuration:**Each action in the `actions` array can have:

- `href` (string, optional): URL for regular links (use either `href` or `wire:click`)
- `wire:click` (string, optional): Livewire method name (use either `href` or `wire:click`)
- `icon` (string, optional, default: 'circle'): FontAwesome icon name (without 'fa-' prefix)
- `color` (string, optional, default: 'light'): Bootstrap button color class
- `label` (string, optional): Text label to display next to the icon
- `confirm` (string, optional): Confirmation message for `wire:click` actions

**Features:**

- Double-click to view or edit (automatically detects 'view' or 'edit' in wire:click methods)
- Responsive design: button group on desktop (md and up), dropdown menu on mobile
- Supports both regular links (`href`) and Livewire actions (`wire:click`)
- Confirmation dialogs for destructive actions

### Actions Component

[](#actions-component)

Shared action renderer used by cards and list rows. It accepts the same `actions` array format shown above and automatically builds responsive button groups (desktop) and dropdowns (mobile). You can also use it directly:

```

```

### Modal Component

[](#modal-component)

A complete modal component with form support and multiple levels.

```

    Modal content here

```

**Attributes:**

- `id` (string, required): Modal ID
- `size` (string, optional): Modal size (sm, lg, xl)
- `title` (string, required): Modal title
- `close_function` (string, optional): Livewire method to close modal
- `submit_function` (string, optional): Livewire method for form submission
- `submit_color` (string, optional): Submit button color (default: primary)
- `submit_text` (string, optional): Submit button text
- `submit_icon` (string, optional): Submit button icon
- `level` (integer, optional): Modal z-index level (1-5)

**Features:**

- ESC key support for closing
- Loading states on submit button
- Multiple z-index levels for nested modals
- Automatic form wrapper when submit function is provided

### Session Message Component

[](#session-message-component)

Displays session flash messages with different types.

```

```

**Features:**

- Displays `message` (info), `success`, and `danger` session messages
- Dismissible alerts with close buttons
- Automatic error display integration

### Errors Component

[](#errors-component)

Displays validation errors in a dismissible alert.

```

```

**Features:**

- Shows all validation errors in a single alert
- Dismissible with close button
- Automatically included in modal

Styles
------

[](#styles)

The package includes SCSS files for modal z-index management. After publishing the SCSS files, you can import them in your main SCSS file:

```
@import '../../vendor/mantix/livewire-bootstrap-components/resources/scss/livewire-bootstrap-components';
```

### Modal Z-Index Levels

[](#modal-z-index-levels)

The package provides 5 levels of modal z-index management:

- Level 1: Default Bootstrap modal (z-index: 1055)
- Level 2: z-index: 1065 (backdrop: 1060)
- Level 3: z-index: 1075 (backdrop: 1070)
- Level 4: z-index: 1085 (backdrop: 1080)
- Level 5: z-index: 1095 (backdrop: 1090)

Requirements
------------

[](#requirements)

- Laravel 8+
- Livewire 3.x
- Bootstrap 5.x
- FontAwesome 6.x

License
-------

[](#license)

MIT © Mantix BV

###  Health Score

41

—

FairBetter than 89% of packages

Maintenance82

Actively maintained with recent releases

Popularity15

Limited adoption so far

Community6

Small or concentrated contributor base

Maturity51

Maturing project, gaining track record

 Bus Factor1

Top contributor holds 100% of commits — single point of failure

How is this calculated?**Maintenance (25%)** — Last commit recency, latest release date, and issue-to-star ratio. Uses a 2-year decay window.

**Popularity (30%)** — Total and monthly downloads, GitHub stars, and forks. Logarithmic scaling prevents top-heavy scores.

**Community (15%)** — Contributors, dependents, forks, watchers, and maintainers. Measures real ecosystem engagement.

**Maturity (30%)** — Project age, version count, PHP version support, and release stability.

###  Release Activity

Cadence

Every ~8 days

Recently: every ~16 days

Total

24

Last Release

95d ago

### Community

Maintainers

![](https://www.gravatar.com/avatar/a0220f88ffeeccee7e027b2e4ead4f10938594fe48d2e15d802b1f7b12be64b4?d=identicon)[Mantix](/maintainers/Mantix)

---

Top Contributors

[![Mantix](https://avatars.githubusercontent.com/u/5512138?v=4)](https://github.com/Mantix "Mantix (29 commits)")

### Embed Badge

![Health badge](/badges/mantix-livewire-bootstrap-components/health.svg)

```
[![Health](https://phpackages.com/badges/mantix-livewire-bootstrap-components/health.svg)](https://phpackages.com/packages/mantix-livewire-bootstrap-components)
```

###  Alternatives

[tallstackui/tallstackui

TallStackUI is a powerful suite of Blade components that elevate your workflow of Livewire applications.

703141.0k7](/packages/tallstackui-tallstackui)[laravel-views/laravel-views

Laravel package to create beautiful common views like tables using only PHP code

63891.6k](/packages/laravel-views-laravel-views)[tanthammar/tall-forms

A dynamic, responsive Laravel Livewire form generator with realtime validation, file uploads, array fields, and more.

68138.3k1](/packages/tanthammar-tall-forms)[vildanbina/livewire-wizard

Laravel Livewire Wizard (Multi-Step Form) component

34919.4k](/packages/vildanbina-livewire-wizard)[victorybiz/laravel-simple-select

Laravel Simple Select inputs component for Blade and Livewire.

13721.1k](/packages/victorybiz-laravel-simple-select)[dasundev/livewire-quill-text-editor

A powerful livewire rich text editor component built top of Quill.

3833.9k](/packages/dasundev-livewire-quill-text-editor)

PHPackages © 2026

[Directory](/)[Categories](/categories)[Trending](/trending)[Changelog](/changelog)[Analyze](/analyze)