diff --git a/docs/pagination/available-methods.md b/docs/pagination/available-methods.md index eae078132..b57b846c2 100644 --- a/docs/pagination/available-methods.md +++ b/docs/pagination/available-methods.md @@ -229,40 +229,6 @@ public function configure(): void } ``` -## setPerPageFieldAttributes -Allows for customisation of the appearance of the "Per Page" dropdown - -Note that this utilises a refreshed approach for attributes, and allows for appending to, or replacing the styles and colors independently, via the below methods. - -### default-colors -Setting to false will disable the default colors for the Per Page dropdown, the default colors are: -Bootstrap: -None - -Tailwind: -border-gray-300 focus:border-indigo-300 focus:ring-indigo-200 dark:bg-gray-700 dark:text-white dark:border-gray-600 - -### default-styling -Setting to false will disable the default styling for the Per Page dropdown, the default styling is: -Bootstrap 4: -form-control - -Bootstrap 5: -form-select - -Tailwind: -block w-full rounded-md shadow-sm transition duration-150 ease-in-out sm:text-sm sm:leading-5 focus:ring focus:ring-opacity-50 - -```php -public function configure(): void -{ - $this->setPerPageFieldAttributes([ - 'class' => 'border-red-300 focus:border-indigo-300 focus:ring-indigo-200 dark:bg-red-700 dark:text-white dark:border-red-600', // Add these classes to the dropdown - 'default-colors' => false, // Do not output the default colors - 'default-styles' => true, // Output the default styling - ]); -} -``` ## setShouldRetrieveTotalItemCountStatus @@ -296,14 +262,3 @@ public function configure(): void $this->setShouldRetrieveTotalItemCountDisabled(); } ``` - -## setPaginationWrapperAttributes - -Used to set attributes for the "div" that wraps the pagination section - -```php -public function configure(): void -{ - $this->setPaginationWrapperAttributes(['class' => 'text-lg']); -} -``` diff --git a/docs/pagination/styling.md b/docs/pagination/styling.md new file mode 100644 index 000000000..8d047263a --- /dev/null +++ b/docs/pagination/styling.md @@ -0,0 +1,65 @@ +--- +title: Styling +weight: 2 +--- + + +## setPaginationWrapperAttributes + +Used to set attributes for the "div" that wraps the pagination section (typically in the footer) + +```php +public function configure(): void +{ + $this->setPaginationWrapperAttributes(['class' => 'text-lg']); +} +``` + +## setPerPageFieldAttributes +Allows for customisation of the appearance of the "Per Page" dropdown + +Note that this utilises a refreshed approach for attributes, and allows for appending to, or replacing the styles and colors independently, via the below methods. + +### default-colors +Setting to false will disable the default colors for the Per Page dropdown, the default colors are: +Bootstrap: +None + +Tailwind: +border-gray-300 focus:border-indigo-300 focus:ring-indigo-200 dark:bg-gray-700 dark:text-white dark:border-gray-600 + +### default-styling +Setting to false will disable the default styling for the Per Page dropdown, the default styling is: +Bootstrap 4: +form-control + +Bootstrap 5: +form-select + +Tailwind: +block w-full rounded-md shadow-sm transition duration-150 ease-in-out sm:text-sm sm:leading-5 focus:ring focus:ring-opacity-50 + +```php +public function configure(): void +{ + $this->setPerPageFieldAttributes([ + 'class' => 'border-red-300 focus:border-indigo-300 focus:ring-indigo-200 dark:bg-red-700 dark:text-white dark:border-red-600', // Add these classes to the dropdown + 'default-colors' => false, // Do not output the default colors + 'default-styles' => true, // Output the default styling + ]); +} +``` + +## setPerPageWrapperAttributes +Allows for customisation of the appearance of the wrapper for the "Per Page" dropdown + +```php +public function configure(): void +{ + $this->setPerPageWrapperAttributes([ + 'class' => 'bg-blue-500 text-black dark:bg-red-700 dark:text-white ', + 'default-colors' => false, // Do not output the default colors + 'default-styles' => true, // Output the default styling + ]); +} +``` diff --git a/resources/views/components/pagination.blade.php b/resources/views/components/pagination.blade.php index 836609b67..2dc417992 100644 --- a/resources/views/components/pagination.blade.php +++ b/resources/views/components/pagination.blade.php @@ -7,49 +7,63 @@ ) @if ($this->isTailwind) -
getPaginationWrapperAttributesBag() }}> +
getPaginationWrapperAttributesBag()->class([ + 'mt-4 px-4 md:p-0 sm:flex justify-between items-center space-y-4 sm:space-y-0' => $this->getPaginationWrapperAttributesBag()->getAttributes()['default'] ?? true + ]) + ->except([ + 'default', + 'default-colors', + 'default-styling' + ]) + }}> @if ($this->paginationVisibilityIsEnabled()) -
-
- @if ($this->paginationIsEnabled() && $this->isPaginationMethod('standard') && $this->getRows->lastPage() > 1) -

- @if($this->showPaginationDetails()) - @lang('livewire-tables::Showing') - {{ $this->getRows->firstItem() }} - @lang('livewire-tables::to') - {{ $this->getRows->lastItem() }} - @lang('livewire-tables::of') - - @lang('livewire-tables::results') - @endif -

- @elseif ($this->paginationIsEnabled() && $this->isPaginationMethod('simple')) -

- @if($this->showPaginationDetails()) - @lang('livewire-tables::Showing') - {{ $this->getRows->firstItem() }} - @lang('livewire-tables::to') - {{ $this->getRows->lastItem() }} - @endif -

- @elseif ($this->paginationIsEnabled() && $this->isPaginationMethod('cursor')) - @else -

- @lang('livewire-tables::Showing') - {{ $this->getRows->count() }} - @lang('livewire-tables::results') -

- @endif -
- - @if ($this->paginationIsEnabled()) - {{ $this->getRows->links('livewire-tables::specific.tailwind.'.(!$this->isPaginationMethod('standard') ? 'simple-' : '').'pagination') }} +
+ @if ($this->paginationIsEnabled() && $this->isPaginationMethod('standard') && $this->getRows->lastPage() > 1) +

+ @if($this->showPaginationDetails()) + @lang('livewire-tables::Showing') + {{ $this->getRows->firstItem() }} + @lang('livewire-tables::to') + {{ $this->getRows->lastItem() }} + @lang('livewire-tables::of') + + @lang('livewire-tables::results') + @endif +

+ @elseif ($this->paginationIsEnabled() && $this->isPaginationMethod('simple')) +

+ @if($this->showPaginationDetails()) + @lang('livewire-tables::Showing') + {{ $this->getRows->firstItem() }} + @lang('livewire-tables::to') + {{ $this->getRows->lastItem() }} + @endif +

+ @elseif ($this->paginationIsEnabled() && $this->isPaginationMethod('cursor')) + @else +

+ @lang('livewire-tables::Showing') + {{ $this->getRows->count() }} + @lang('livewire-tables::results') +

@endif +
+ + @if ($this->paginationIsEnabled()) + {{ $this->getRows->links('livewire-tables::specific.tailwind.'.(!$this->isPaginationMethod('standard') ? 'simple-' : '').'pagination') }} + @endif + @endif
@elseif ($this->isBootstrap4) -
getPaginationWrapperAttributesBag() }}> +
getPaginationWrapperAttributesBag() + ->except([ + 'default', + 'default-colors', + 'default-styling' + ]) + }}> @if ($this->paginationVisibilityIsEnabled()) @if ($this->paginationIsEnabled() && $this->isPaginationMethod('standard') && $this->getRows->lastPage() > 1)
@@ -102,7 +116,13 @@ @endif
@elseif ($this->isBootstrap5) -
getPaginationWrapperAttributesBag() }} > +
getPaginationWrapperAttributesBag() + ->except([ + 'default', + 'default-colors', + 'default-styling' + ]) + }} > @if ($this->paginationVisibilityIsEnabled()) @if ($this->paginationIsEnabled() && $this->isPaginationMethod('standard') && $this->getRows->lastPage() > 1)
@@ -158,4 +178,4 @@ $this->hasConfigurableAreaFor('after-pagination'), $this->getConfigurableAreaFor('after-pagination'), $this->getParametersForConfigurableArea('after-pagination') -) +) \ No newline at end of file diff --git a/resources/views/components/tools/toolbar/items/pagination-dropdown.blade.php b/resources/views/components/tools/toolbar/items/pagination-dropdown.blade.php index 5a2ae1845..6d3014a76 100644 --- a/resources/views/components/tools/toolbar/items/pagination-dropdown.blade.php +++ b/resources/views/components/tools/toolbar/items/pagination-dropdown.blade.php @@ -1,26 +1,25 @@ -@aware(['component', 'tableName','isTailwind','isBootstrap','isBootstrap4','isBootstrap5']) -
$this->isBootstrap4, - 'ms-0 ms-md-2' => $this->isBootstrap5, - ]) -> - merge($this->getPerPageFieldAttributes()) ->class([ - 'form-control' => $this->isBootstrap4 && $component->getPerPageFieldAttributes()['default-styling'], - 'form-select' => $this->isBootstrap5 && $component->getPerPageFieldAttributes()['default-styling'], - 'block w-full rounded-md shadow-sm transition duration-150 ease-in-out sm:text-sm sm:leading-5 focus:ring focus:ring-opacity-50' => $this->isTailwind && $component->getPerPageFieldAttributes()['default-styling'], - 'border-gray-300 focus:border-indigo-300 focus:ring-indigo-200 dark:bg-gray-700 dark:text-white dark:border-gray-600' => $this->isTailwind && $component->getPerPageFieldAttributes()['default-colors'], + 'form-control' => $this->isBootstrap4 && ($this->getPerPageFieldAttributes()['default-styling'] ?? true), + 'form-select' => $this->isBootstrap5 && ($this->getPerPageFieldAttributes()['default-styling'] ?? true), + 'block w-full rounded-md shadow-sm transition duration-150 ease-in-out sm:text-sm sm:leading-5 focus:ring focus:ring-opacity-50' => $this->isTailwind && (($this->getPerPageFieldAttributes()['default'] ?? false) || ($this->getPerPageFieldAttributes()['default-styling'] ?? true)), + 'border-gray-300 focus:border-indigo-300 focus:ring-indigo-200 dark:bg-gray-700 dark:text-white dark:border-gray-600' => $this->isTailwind && (($this->getPerPageFieldAttributes()['default'] ?? false) || ($this->getPerPageFieldAttributes()['default-colors'] ?? true)), ]) ->except(['default','default-styling','default-colors']) - }} - > - @foreach ($component->getPerPageAccepted() as $item) - @endforeach diff --git a/resources/views/datatable.blade.php b/resources/views/datatable.blade.php index e92119d9b..9b8f9c38e 100644 --- a/resources/views/datatable.blade.php +++ b/resources/views/datatable.blade.php @@ -125,8 +125,12 @@ @endif - - + @if($this->hasCustomPaginationBlade) + @include($this->getCustomPaginationBlade) + @else + + @endif + @includeIf($customView) diff --git a/resources/views/specific/bootstrap-4/pagination.blade.php b/resources/views/specific/bootstrap-4/pagination.blade.php index 35f76cd59..5d07b5a3c 100644 --- a/resources/views/specific/bootstrap-4/pagination.blade.php +++ b/resources/views/specific/bootstrap-4/pagination.blade.php @@ -2,7 +2,7 @@ @if ($paginator->hasPages()) @php(isset($this->numberOfPaginatorsRendered[$paginator->getPageName()]) ? $this->numberOfPaginatorsRendered[$paginator->getPageName()]++ : $this->numberOfPaginatorsRendered[$paginator->getPageName()] = 1) -