Download the PHP package solution-forest/tab-layout-plugin without Composer
On this page you can find all versions of the php package solution-forest/tab-layout-plugin. It is possible to download/install these versions without Composer. Possible dependencies are resolved automatically.
Download solution-forest/tab-layout-plugin
More information about solution-forest/tab-layout-plugin
Files in solution-forest/tab-layout-plugin
Package tab-layout-plugin
Short Description This plugin provides a flexible tab layout system for Filament Admin panels, enabling you to organize content into clean, navigable tabbed interfaces.
License MIT
Homepage https://github.com/solution-forest/tab-layout-plugin
Informations about the package tab-layout-plugin
Tab Layout Plugin
This plugin provides a flexible tab layout system for Filament Admin panels, enabling you to organize content into clean, navigable tabbed interfaces.
Create simple tabs with individual Livewire components or build complex multi-content tabs containing HTML, strings, and multiple components. Features include customizable icons and badges, external link tabs, URL persistence, and full integration with Filament's widget system.
Demo site : https://filament-cms-website-demo.solutionforest.net/admin
Demo username : [email protected]
Demo password : 12345678 Auto Reset every hour.
Supported Filament versions
Filament Version | Plugin Version |
---|---|
v2 | <=1.x.x |
v3 | 2.x.x |
v4 | 3.x.x |
Installation
You can install the package via composer:
Optionally, you can publish the views using
Usage
Create a Simple Tab Widget
Create tabbed interfaces with individual Livewire components using the TabsWidget::make() method. This is the quickest way to get started with basic tab functionality.
This approach provides three ways to configure tabs:
- TabWidgetContentConfiguration object - Most explicit and type-safe
- Array syntax - Simpler for basic configurations
- Chain tab() method - Useful for adding tabs conditionally
Create a Advanced Tab Widget
You can also create multiple Livewire components, HTML, and strings inside each tab. You can even make a tab act as a redirect link by extending the TabsWidget
class.
To generate a Tab widget:
You will then define the child components in the schema()
method to display inside:
php
echo "This is a code block";
Customize the Icon and Badge
Tabs may have an icon and badge, which you can set using the icon()
and badge()
methods:
Assign Parameters to Components
Additionally, you have the option to pass an array of data to your component.
Then, add the tab widget to your page, e.g.:
Set Default Active Tab
Control which tab is active when the widget loads. You can set this either dynamically with a callback or with a static tab order.
Persist Active Tab in URL
Keep the selected tab active when users reload the page or share URLs by persisting the tab state in the query string.
Note: When using URL persistence, each tab must have a unique
id
and the tab group needs anid
attribute.
Removing the Styled Container
By default, tabs and their content are wrapped in a styled card container. You can remove this container styling using the contained()
method:
Create Your Own Tab Container
In addition to using the LivewireContainer
component, you can create your own custom tab layout components by extending the TabLayoutComponent
class or using the php artisan tab-layout:component
command.
For example, the following PHP code defines a FilamentInfoWidget class that extends TabLayoutComponent and specifies a ComponentTabComponent
as the tab component to use. The getData method can be used to populate the component with data.
You can also use the php artisan tab-layout:component
command to generate the code for a new tab layout component. For example, to generate a FilamentInfoWidget
component, you can run the following command:
After creating your custom tab layout component by extending the TabLayoutComponent
class, you can register it on the schema of a TabLayoutTab
instance.
Changelog
Please see CHANGELOG for more information on what has changed recently.
Security Vulnerabilities
If you discover any security related issues, please email [email protected] instead of using the issue tracker.
License
The MIT License (MIT). Please see License File for more information.
All versions of tab-layout-plugin with dependencies
filament/widgets Version ^4.0
filament/support Version ^4.0
filament/schemas Version ^4.0
spatie/laravel-package-tools Version ^1.15.0