Upgrade Guide โ
Upgrade From V5 โ
This page will provide you with important information to upgrade from version 5.x.
Dependency Upgrades โ
The following items have been updated in this release:
- PHP 8.2+
PowerGrid Facade namespace โ
php
use PowerComponents\LivewirePowerGrid\PowerGrid;
use PowerComponents\LivewirePowerGrid\Facades\PowerGrid;
$tableName
must be unique/required โ
Sets the $tableName
as unique and required for all existing tables.
INFO
New tables will have a pre-configured name via the powergrid:create
command.
php
public string $tableName = 'default';
public string $tableName = 'users-table';
// Ex: admin-users-table, dishes, category-table
JS Imports โ
js
import './../../vendor/power-components/livewire-powergrid/dist/powergrid.css'
import './../../vendor/power-components/livewire-powergrid/dist/tailwind.css'// bootstrap5.css
setUp method โ
php
use PowerComponents\LivewirePowerGrid\Facades\PowerGrid;
Header::make();
PowerGrid::header();
Footer::make();
PowerGrid::footer();
Responsive::make();
PowerGrid::responsive();
Exportable::make();
PowerGrid::exportable();
Lazy::make();
PowerGrid::lazy();
Cache::make();
PowerGrid::cache();
Detail::make();
PowerGrid::detail();
Custom Theme โ
- Rename
template
tocustomTemplateClass
method
php
public function template();
public function customThemeClass();
Change your theme class, and follow new template style โ
INFO
This change simplifies how PowerGrid handles theme changes dynamically and removes many classes and unnecessary things to reduce processing in PHP.
WARNING
โ ๏ธ Follow the example available in vendor/.../src/Themes/Tailwind.php
or vendor/.../src/Themes/Bootstrap5.php
as all methods follow this new standard.
5.x
php
public function table(): array
{
return Theme::table('min-w-full dark:!bg-primary-800')
->container('-my-2 overflow-x-auto sm:-mx-3 lg:-mx-8')
->base('p-3 align-middle inline-block min-w-full w-full sm:px-6 lg:px-8')
->div('rounded-t-lg relative border-x border-t border-pg-primary-200 dark:bg-pg-primary-700 dark:border-pg-primary-600')
->thead('shadow-sm rounded-t-lg bg-pg-primary-100 dark:bg-pg-primary-900')
->thAction('!font-bold')
->tdAction('')
->tr('')
->trFilters('bg-white shadow-sm dark:bg-pg-primary-800')
->th('font-extrabold px-2 pr-4 py-3 text-left text-xs text-pg-primary-700 tracking-wider whitespace-nowrap dark:text-pg-primary-300')
->tbody('text-pg-primary-800')
->trBody('border-b border-pg-primary-100 dark:border-pg-primary-600 hover:bg-pg-primary-50 dark:bg-pg-primary-800 dark:hover:bg-pg-primary-700')
->tdBody('p-2 whitespace-nowrap dark:text-pg-primary-200')
->tdBodyEmpty('p-2 whitespace-nowrap dark:text-pg-primary-200')
->trBodyClassTotalColumns('')
->tdBodyTotalColumns('p-2 whitespace-nowrap dark:text-pg-primary-200 text-sm text-pg-primary-600 text-right space-y-2')
}
6.x
php
public function table(): array
{
return [
'layout' => [
'base' => 'p-3 align-middle inline-block min-w-full w-full sm:px-6 lg:px-8',
'div' => 'rounded-t-lg relative border-x border-t border-pg-primary-200 dark:bg-pg-primary-700 dark:border-pg-primary-600',
'table' => 'min-w-full dark:!bg-primary-800',
'container' => '-my-2 overflow-x-auto sm:-mx-3 lg:-mx-8',
'actions' => 'flex gap-2',
],
'header' => [
'thead' => 'shadow-sm rounded-t-lg bg-pg-primary-100 dark:bg-pg-primary-900',
'tr' => '',
'th' => 'font-extrabold px-3 py-3 text-left text-xs text-pg-primary-700 tracking-wider whitespace-nowrap dark:text-pg-primary-300',
'thAction' => '!font-bold',
],
'body' => [
'tbody' => 'text-pg-primary-800',
'tbodyEmpty' => '',
'tr' => 'border-b border-pg-primary-100 dark:border-pg-primary-600 hover:bg-pg-primary-50 dark:bg-pg-primary-800 dark:hover:bg-pg-primary-700',
'td' => 'px-3 py-2 whitespace-nowrap dark:text-pg-primary-200',
'tdEmpty' => 'p-2 whitespace-nowrap dark:text-pg-primary-200',
'tdSummarize' => 'p-2 whitespace-nowrap dark:text-pg-primary-200 text-sm text-pg-primary-600 text-right space-y-2',
'trSummarize' => '',
'tdFilters' => '',
'trFilters' => '',
'tdActionsContainer' => 'flex gap-2',
],
];
}