Skip to content

Commit

Permalink
Add Visual Test for PaginationWrapper
Browse files Browse the repository at this point in the history
  • Loading branch information
@lrljoe
lrljoe committed Oct 1, 2024
1 parent ca42680 commit 6bc6850
Show file tree
Hide file tree
Showing 4 changed files with 181 additions and 137 deletions.
256 changes: 127 additions & 129 deletions resources/views/components/pagination.blade.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,150 +6,148 @@
$this->getParametersForConfigurableArea('before-pagination')
)

@if ($this->isTailwind)
<div {{ $this->getPaginationWrapperAttributesBag() }}>
@if ($this->paginationVisibilityIsEnabled())
<div class="mt-4 px-4 md:p-0 sm:flex justify-between items-center space-y-4 sm:space-y-0">
<div>
@if ($this->paginationIsEnabled() && $this->isPaginationMethod('standard') && $this->getRows->lastPage() > 1)
<p class="paged-pagination-results text-sm text-gray-700 leading-5 dark:text-white">
@if($this->showPaginationDetails())
<span>@lang('livewire-tables::Showing')</span>
<span class="font-medium">{{ $this->getRows->firstItem() }}</span>
<span>@lang('livewire-tables::to')</span>
<span class="font-medium">{{ $this->getRows->lastItem() }}</span>
<span>@lang('livewire-tables::of')</span>
<span class="font-medium"><span x-text="paginationTotalItemCount"></span></span>
<span>@lang('livewire-tables::results')</span>
@endif
</p>
@elseif ($this->paginationIsEnabled() && $this->isPaginationMethod('simple'))
<p class="paged-pagination-results text-sm text-gray-700 leading-5 dark:text-white">
@if($this->showPaginationDetails())
<span>@lang('livewire-tables::Showing')</span>
<span class="font-medium">{{ $this->getRows->firstItem() }}</span>
<span>@lang('livewire-tables::to')</span>
<span class="font-medium">{{ $this->getRows->lastItem() }}</span>
@endif
</p>
@elseif ($this->paginationIsEnabled() && $this->isPaginationMethod('cursor'))
@else
<p class="total-pagination-results text-sm text-gray-700 leading-5 dark:text-white">
@lang('livewire-tables::Showing')
<span class="font-medium">{{ $this->getRows->count() }}</span>
@lang('livewire-tables::results')
</p>
@endif
</div>

@if ($this->paginationIsEnabled())
{{ $this->getRows->links('livewire-tables::specific.tailwind.'.(!$this->isPaginationMethod('standard') ? 'simple-' : '').'pagination') }}
@if ($this->isTailwind && $this->paginationIsEnabled() && $this->paginationVisibilityIsEnabled())
<div {{ $this->getPaginationWrapperAttributesBag()->class([
"mt-4 px-4 md:p-0 sm:flex justify-between items-center space-y-4 sm:space-y-0" => $this->isTailwind && ($this->getPaginationWrapperAttributes['default'] ?? true)
])
->except(['default', 'default-colors', 'default-styling'])
}}
>
@if ($this->isPaginationMethod('standard') && $this->getRows->lastPage() > 1)
<p class="paged-pagination-results text-sm text-gray-700 leading-5 dark:text-white">
@if($this->showPaginationDetails())
<span>@lang('livewire-tables::Showing')</span>
<span class="font-medium">{{ $this->getRows->firstItem() }}</span>
<span>@lang('livewire-tables::to')</span>
<span class="font-medium">{{ $this->getRows->lastItem() }}</span>
<span>@lang('livewire-tables::of')</span>
<span class="font-medium"><span x-text="paginationTotalItemCount"></span></span>
<span>@lang('livewire-tables::results')</span>
@endif
</div>
</p>
@elseif ($this->isPaginationMethod('simple'))
<p class="paged-pagination-results text-sm text-gray-700 leading-5 dark:text-white">
@if($this->showPaginationDetails())
<span>@lang('livewire-tables::Showing')</span>
<span class="font-medium">{{ $this->getRows->firstItem() }}</span>
<span>@lang('livewire-tables::to')</span>
<span class="font-medium">{{ $this->getRows->lastItem() }}</span>
@endif
</p>
@elseif ($this->isPaginationMethod('cursor'))
@else
<p class="total-pagination-results text-sm text-gray-700 leading-5 dark:text-white">
@lang('livewire-tables::Showing')
<span class="font-medium">{{ $this->getRows->count() }}</span>
@lang('livewire-tables::results')
</p>
@endif
{{ $this->getRows->links('livewire-tables::specific.tailwind.'.(!$this->isPaginationMethod('standard') ? 'simple-' : '').'pagination') }}
</div>
@elseif ($this->isBootstrap4)
<div {{ $this->getPaginationWrapperAttributesBag() }}>
@if ($this->paginationVisibilityIsEnabled())
@if ($this->paginationIsEnabled() && $this->isPaginationMethod('standard') && $this->getRows->lastPage() > 1)
<div class="row mt-3">
<div class="col-12 col-md-6 overflow-auto">
{{ $this->getRows->links('livewire-tables::specific.bootstrap-4.pagination') }}
</div>
@elseif ($this->isBootstrap4 && $this->paginationIsEnabled() && $this->paginationVisibilityIsEnabled())
<div {{ $this->getPaginationWrapperAttributesBag()
->except(['default', 'default-colors', 'default-styling'])
}}
>
@if ($this->isPaginationMethod('standard') && $this->getRows->lastPage() > 1)
<div class="row mt-3">
<div class="col-12 col-md-6 overflow-auto">
{{ $this->getRows->links('livewire-tables::specific.bootstrap-4.pagination') }}
</div>

<div class="col-12 col-md-6 text-center text-md-right text-muted">
@if($this->showPaginationDetails())
<span>@lang('livewire-tables::Showing')</span>
<strong>{{ $this->getRows->count() ? $this->getRows->firstItem() : 0 }}</strong>
<span>@lang('livewire-tables::to')</span>
<strong>{{ $this->getRows->count() ? $this->getRows->lastItem() : 0 }}</strong>
<span>@lang('livewire-tables::of')</span>
<strong><span x-text="paginationTotalItemCount"></span></strong>
<span>@lang('livewire-tables::results')</span>
@endif
</div>
<div class="col-12 col-md-6 text-center text-md-right text-muted">
@if($this->showPaginationDetails())
<span>@lang('livewire-tables::Showing')</span>
<strong>{{ $this->getRows->count() ? $this->getRows->firstItem() : 0 }}</strong>
<span>@lang('livewire-tables::to')</span>
<strong>{{ $this->getRows->count() ? $this->getRows->lastItem() : 0 }}</strong>
<span>@lang('livewire-tables::of')</span>
<strong><span x-text="paginationTotalItemCount"></span></strong>
<span>@lang('livewire-tables::results')</span>
@endif
</div>
</div>
@elseif ($this->isPaginationMethod('simple'))
<div class="row mt-3">
<div class="col-12 col-md-6 overflow-auto">
{{ $this->getRows->links('livewire-tables::specific.bootstrap-4.simple-pagination') }}
</div>
@elseif ($this->paginationIsEnabled() && $this->isPaginationMethod('simple'))
<div class="row mt-3">
<div class="col-12 col-md-6 overflow-auto">
{{ $this->getRows->links('livewire-tables::specific.bootstrap-4.simple-pagination') }}
</div>

<div class="col-12 col-md-6 text-center text-md-right text-muted">
@if($this->showPaginationDetails())
<span>@lang('livewire-tables::Showing')</span>
<strong>{{ $this->getRows->count() ? $this->getRows->firstItem() : 0 }}</strong>
<span>@lang('livewire-tables::to')</span>
<strong>{{ $this->getRows->count() ? $this->getRows->lastItem() : 0 }}</strong>
@endif
</div>
<div class="col-12 col-md-6 text-center text-md-right text-muted">
@if($this->showPaginationDetails())
<span>@lang('livewire-tables::Showing')</span>
<strong>{{ $this->getRows->count() ? $this->getRows->firstItem() : 0 }}</strong>
<span>@lang('livewire-tables::to')</span>
<strong>{{ $this->getRows->count() ? $this->getRows->lastItem() : 0 }}</strong>
@endif
</div>
@elseif ($this->paginationIsEnabled() && $this->isPaginationMethod('cursor'))
<div class="row mt-3">
<div class="col-12 col-md-6 overflow-auto">
{{ $this->getRows->links('livewire-tables::specific.bootstrap-4.simple-pagination') }}
</div>
</div>
@elseif ($this->isPaginationMethod('cursor'))
<div class="row mt-3">
<div class="col-12 col-md-6 overflow-auto">
{{ $this->getRows->links('livewire-tables::specific.bootstrap-4.simple-pagination') }}
</div>
@else
<div class="row mt-3">
<div class="col-12 text-muted">
@lang('livewire-tables::Showing')
<strong>{{ $this->getRows->count() }}</strong>
@lang('livewire-tables::results')
</div>
</div>
@else
<div class="row mt-3">
<div class="col-12 text-muted">
@lang('livewire-tables::Showing')
<strong>{{ $this->getRows->count() }}</strong>
@lang('livewire-tables::results')
</div>
@endif
</div>
@endif
</div>
@elseif ($this->isBootstrap5)
<div {{ $this->getPaginationWrapperAttributesBag() }} >
@if ($this->paginationVisibilityIsEnabled())
@if ($this->paginationIsEnabled() && $this->isPaginationMethod('standard') && $this->getRows->lastPage() > 1)
<div class="row mt-3">
<div class="col-12 col-md-6 overflow-auto">
{{ $this->getRows->links('livewire-tables::specific.bootstrap-4.pagination') }}
</div>
<div class="col-12 col-md-6 text-center text-md-end text-muted">
@if($this->showPaginationDetails())
<span>@lang('livewire-tables::Showing')</span>
<strong>{{ $this->getRows->count() ? $this->getRows->firstItem() : 0 }}</strong>
<span>@lang('livewire-tables::to')</span>
<strong>{{ $this->getRows->count() ? $this->getRows->lastItem() : 0 }}</strong>
<span>@lang('livewire-tables::of')</span>
<strong><span x-text="paginationTotalItemCount"></span></strong>
<span>@lang('livewire-tables::results')</span>
@endif
</div>
@elseif ($this->isBootstrap5 && $this->paginationIsEnabled() && $this->paginationVisibilityIsEnabled())
<div {{ $this->getPaginationWrapperAttributesBag()
->except(['default', 'default-colors', 'default-styling'])
}}
>
@if ($this->isPaginationMethod('standard') && $this->getRows->lastPage() > 1)
<div class="row mt-3">
<div class="col-12 col-md-6 overflow-auto">
{{ $this->getRows->links('livewire-tables::specific.bootstrap-4.pagination') }}
</div>
<div class="col-12 col-md-6 text-center text-md-end text-muted">
@if($this->showPaginationDetails())
<span>@lang('livewire-tables::Showing')</span>
<strong>{{ $this->getRows->count() ? $this->getRows->firstItem() : 0 }}</strong>
<span>@lang('livewire-tables::to')</span>
<strong>{{ $this->getRows->count() ? $this->getRows->lastItem() : 0 }}</strong>
<span>@lang('livewire-tables::of')</span>
<strong><span x-text="paginationTotalItemCount"></span></strong>
<span>@lang('livewire-tables::results')</span>
@endif
</div>
</div>
@elseif ($this->isPaginationMethod('simple'))
<div class="row mt-3">
<div class="col-12 col-md-6 overflow-auto">
{{ $this->getRows->links('livewire-tables::specific.bootstrap-4.simple-pagination') }}
</div>
@elseif ($this->paginationIsEnabled() && $this->isPaginationMethod('simple'))
<div class="row mt-3">
<div class="col-12 col-md-6 overflow-auto">
{{ $this->getRows->links('livewire-tables::specific.bootstrap-4.simple-pagination') }}
</div>
<div class="col-12 col-md-6 text-center text-md-end text-muted">
@if($this->showPaginationDetails())
<span>@lang('livewire-tables::Showing')</span>
<strong>{{ $this->getRows->count() ? $this->getRows->firstItem() : 0 }}</strong>
<span>@lang('livewire-tables::to')</span>
<strong>{{ $this->getRows->count() ? $this->getRows->lastItem() : 0 }}</strong>
@endif
</div>
<div class="col-12 col-md-6 text-center text-md-end text-muted">
@if($this->showPaginationDetails())
<span>@lang('livewire-tables::Showing')</span>
<strong>{{ $this->getRows->count() ? $this->getRows->firstItem() : 0 }}</strong>
<span>@lang('livewire-tables::to')</span>
<strong>{{ $this->getRows->count() ? $this->getRows->lastItem() : 0 }}</strong>
@endif
</div>
@elseif ($this->paginationIsEnabled() && $this->isPaginationMethod('cursor'))
<div class="row mt-3">
<div class="col-12 col-md-6 overflow-auto">
{{ $this->getRows->links('livewire-tables::specific.bootstrap-4.simple-pagination') }}
</div>
</div>
@elseif ($this->isPaginationMethod('cursor'))
<div class="row mt-3">
<div class="col-12 col-md-6 overflow-auto">
{{ $this->getRows->links('livewire-tables::specific.bootstrap-4.simple-pagination') }}
</div>
@else
<div class="row mt-3">
<div class="col-12 text-muted">
@lang('livewire-tables::Showing')
<strong>{{ $this->getRows->count() }}</strong>
@lang('livewire-tables::results')
</div>
</div>
@else
<div class="row mt-3">
<div class="col-12 text-muted">
@lang('livewire-tables::Showing')
<strong>{{ $this->getRows->count() }}</strong>
@lang('livewire-tables::results')
</div>
@endif
</div>
@endif
</div>
@endif
Expand Down
4 changes: 3 additions & 1 deletion src/Traits/Styling/HasPaginationStyling.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,6 +11,7 @@ trait HasPaginationStyling
use PaginationStylingConfiguration,
PaginationStylingHelpers;

// Used In Frontend
#[Locked]
public string $paginationTheme = 'tailwind';

Expand All @@ -22,6 +23,7 @@ trait HasPaginationStyling

// Used In Frontend
protected array $paginationWrapperAttributes = ['class' => ''];


// Used In Frontend
protected ?string $customPaginationBlade;
}
2 changes: 1 addition & 1 deletion src/Traits/Styling/Helpers/PaginationStylingHelpers.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -61,7 +61,7 @@ public function hasCustomPaginationBlade(): bool
#[Computed]
public function getCustomPaginationBlade(): string
{
return $this->customPaginationBlade ? '';
return $this->customPaginationBlade ?? '';
}

}
Loading

0 comments on commit 6bc6850

Please sign in to comment.