https://github.com/solutionforest/filament-tab-plugin
https://github.com/solutionforest/filament-tab-plugin
Last synced: 7 months ago
JSON representation
- Host: GitHub
- URL: https://github.com/solutionforest/filament-tab-plugin
- Owner: solutionforest
- License: mit
- Created: 2023-03-20T09:01:37.000Z (almost 3 years ago)
- Default Branch: master
- Last Pushed: 2023-12-01T02:10:50.000Z (about 2 years ago)
- Last Synced: 2025-04-06T21:34:49.427Z (10 months ago)
- Language: PHP
- Size: 56.6 KB
- Stars: 15
- Watchers: 2
- Forks: 1
- Open Issues: 1
-
Metadata Files:
- Readme: README.md
- License: LICENSE.md
Awesome Lists containing this project
README
> [!IMPORTANT]
> We will archive this project since filament3 supports tabs now.
> https://beta.filamentphp.com/docs/3.x/infolists/layout/tabs
# Tab Layout Plugin
[](https://packagist.org/packages/solution-forest/tab-layout-plugin)
[](https://github.com/solution-forest/tab-layout-plugin/actions?query=workflow%3Arun-tests+branch%3Amain)
[](https://github.com/solution-forest/tab-layout-plugin/actions?query=workflow%3A"Check+%26+fix+styling"+branch%3Amain)
[](https://packagist.org/packages/solution-forest/tab-layout-plugin)
This plugin creates widgets with tab layout for Filament Admin.
Demo site : https://filament-cms-website-demo.solutionforest.net/admin
Demo username : demo@solutionforest.net
Demo password : 12345678 Auto Reset every hour.
## Installation
You can install the package via composer:
```bash
composer require solution-forest/tab-layout-plugin
```
Optionally, you can publish the views using
```bash
php artisan vendor:publish --tag="tab-layout-plugin-views"
```
## Usage
To build `Tab` widget:
```php
php artisan make:filament-tab-widget DummyTabs
```
You will then define the child component 'schema()' to display inside:
```php
use SolutionForest\TabLayoutPlugin\Components\Tabs\Tab as TabLayoutTab;
use SolutionForest\TabLayoutPlugin\Components\Tabs\TabContainer;
use SolutionForest\TabLayoutPlugin\Widgets\TabsWidget as BaseWidget;
class DummyTabs extends BaseWidget
{
protected function schema(): array
{
return [
TabLayoutTab::make('Label 1')
->icon('heroicon-o-bell')
->badge('39')
->schema([
TabContainer::make(\Filament\Widgets\AccountWidget::class)
]),
TabLayoutTab::make('Label 2')
->schema([
TabContainer::make(\Filament\Widgets\AccountWidget::class)
->columnSpan(1),
TabContainer::make(\Filament\Widgets\AccountWidget::class)
->columnSpan(1),
])
->columns(2),
TabLayoutTab::make('Go To Filamentphp (Link)')->url("https://filamentphp.com/", true),
];
}
}
```
Tabs may have an icon and badge, which you can set using the `icon()` and `badge()` methods:
```php
Tab::make('Label 1')
->icon('heroicon-o-bell')
->badge('39')
->schema([
// ...
]),
```
## Assign parameters to component
Additionally, you have the option to pass an array of data to your component.
```php
protected function schema(): array
{
return [
TabLayoutTab::make('Label 1')
->icon('heroicon-o-bell')
->badge('39')
->schema([
TabContainer::make(\Filament\Widgets\AccountWidget::class)
TabContainer::make(ViewProductCategory::class) //TARGET COMPONENT
->data(['record' => 1]), // TARGET COMPONENT'S DATA
]),
TabLayoutTab::make('Label 2')
->schema([
TabContainer::make(\Filament\Widgets\FilamentInfoWidget::class),
]),
];
}
```
In addition to using the `TabContainer` component, you can create your own custom tab layout components by extending the `TabLayoutComponent` class or using command `php artisan tab-layout:component`.
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.
```php
schema([
App\Filament\Tabs\Components\FilamentInfoWidget::make()
// ->data([]), // Also can assign data here
]),
];
}
```
## Changelog
Please see [CHANGELOG](../../releases) for more information on what has changed recently.
## Security Vulnerabilities
If you discover any security related issues, please email info+package@solutionforest.net instead of using the issue tracker.
## License
The MIT License (MIT). Please see [License File](LICENSE.md) for more information.