Andreas Reinhold / reiniandClaude Opus 5
2acd9ab492
Laravel's and Livewire's paginator views render data-md-pagination hooks; pagination.css draws the row, the 40px steps with their 48px targets, the selected page and the swap to "Page n of m" below 600px (plan step 36, inputs). It imports button.css for the simple paginators, now that the button is rewritten. Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01Qwx5USif3wFFmxtHg5U1g9
41 lines
2.5 KiB
PHP
41 lines
2.5 KiB
PHP
{{-- Livewire's simple and cursor paginator, drawn in M3: previous and next as outlined buttons
|
|
(the package puts this in front of `livewire::simple-tailwind`). --}}
|
|
|
|
@php
|
|
if (! isset($scrollTo)) {
|
|
$scrollTo = 'body';
|
|
}
|
|
|
|
$scrollIntoViewJsSnippet = ($scrollTo !== false)
|
|
? <<<JS
|
|
(\$el.closest('{$scrollTo}') || document.querySelector('{$scrollTo}')).scrollIntoView()
|
|
JS
|
|
: '';
|
|
|
|
$cursor = method_exists($paginator, 'getCursorName');
|
|
@endphp
|
|
|
|
<div>
|
|
@if ($paginator->hasPages())
|
|
<nav role="navigation" aria-label="{{ __('Pagination Navigation') }}" data-md-pagination>
|
|
@if ($paginator->onFirstPage())
|
|
<x-livewire-material::button variant="outlined" icon="chevron_left" :label="__('Previous')" disabled />
|
|
@elseif ($cursor)
|
|
@php($previousCursor = $paginator->previousCursor() ?? $paginator->cursor())
|
|
<x-livewire-material::button variant="outlined" icon="chevron_left" :label="__('Previous')" wire:key="cursor-{{ $paginator->getCursorName() }}-{{ $previousCursor?->encode() }}" wire:click="setPage('{{ $previousCursor?->encode() }}', '{{ $paginator->getCursorName() }}')" x-on:click="{{ $scrollIntoViewJsSnippet }}" wire:loading.attr="disabled" dusk="previousPage" />
|
|
@else
|
|
<x-livewire-material::button variant="outlined" icon="chevron_left" :label="__('Previous')" wire:click="previousPage('{{ $paginator->getPageName() }}')" x-on:click="{{ $scrollIntoViewJsSnippet }}" wire:loading.attr="disabled" dusk="previousPage" />
|
|
@endif
|
|
|
|
@if (! $paginator->hasMorePages())
|
|
<x-livewire-material::button variant="outlined" icon-right="chevron_right" :label="__('Next')" disabled />
|
|
@elseif ($cursor)
|
|
@php($nextCursor = $paginator->nextCursor() ?? $paginator->cursor())
|
|
<x-livewire-material::button variant="outlined" icon-right="chevron_right" :label="__('Next')" wire:key="cursor-{{ $paginator->getCursorName() }}-{{ $nextCursor?->encode() }}" wire:click="setPage('{{ $nextCursor?->encode() }}', '{{ $paginator->getCursorName() }}')" x-on:click="{{ $scrollIntoViewJsSnippet }}" wire:loading.attr="disabled" dusk="nextPage" />
|
|
@else
|
|
<x-livewire-material::button variant="outlined" icon-right="chevron_right" :label="__('Next')" wire:click="nextPage('{{ $paginator->getPageName() }}')" x-on:click="{{ $scrollIntoViewJsSnippet }}" wire:loading.attr="disabled" dusk="nextPage" />
|
|
@endif
|
|
</nav>
|
|
@endif
|
|
</div>
|