@inherits DComponentBase @* daisyUI Pagination: https://daisyui.com/components/pagination/ . A join of btn join-items; the page is 1-based (@bind-Current) and the current one is btn-active with aria-current="page". Beyond Siblings pages on each side of the current one, runs of pages collapse into a disabled ellipsis; the first and last pages always show. *@
@if (ShowPreviousNext) { } @foreach (var number in Pages()) { if (number == 0) { } else { var target = number; } } @if (ShowPreviousNext) { }
@code { /// The number of pages. [Parameter] public int Count { get; set; } /// The current page, from 1 to Count. [Parameter] public int Current { get; set; } = 1; [Parameter] public EventCallback CurrentChanged { get; set; } /// How many pages to show on each side of the current one before collapsing the rest into "…". [Parameter] public int Siblings { get; set; } = 1; [Parameter] public DSize Size { get; set; } [Parameter] public DDirection Direction { get; set; } [Parameter] public bool ShowPreviousNext { get; set; } = true; [Parameter] public string PreviousText { get; set; } = "«"; [Parameter] public string NextText { get; set; } = "»"; [Parameter] public string PreviousAriaLabel { get; set; } = "Previous page"; [Parameter] public string NextAriaLabel { get; set; } = "Next page"; [Parameter] public string EllipsisText { get; set; } = "…"; string ItemClass(bool active) => Cx("join-item btn", SizeClass, active ? "btn-active" : null); string SizeClass => Size switch { DSize.Xs => "btn-xs", DSize.Sm => "btn-sm", DSize.Lg => "btn-lg", DSize.Xl => "btn-xl", _ => null }; // The pages to show in order, with 0 standing for an ellipsis. A gap of a single page shows that page instead. IEnumerable Pages() { if (Count <= 0) yield break; var current = Math.Clamp(Current, 1, Count); var siblings = Math.Clamp(Siblings, 0, Count); var from = Math.Max(1, current - siblings); var to = Math.Min(Count, current + siblings); if (from > 1) { yield return 1; if (from > 2) yield return from == 3 ? 2 : 0; } for (var page = from; page <= to; page++) yield return page; if (to < Count) { if (to < Count - 1) yield return to == Count - 2 ? Count - 1 : 0; yield return Count; } } async Task Go(int page) { page = Math.Clamp(page, 1, Math.Max(Count, 1)); if (page == Current) return; Current = page; await CurrentChanged.InvokeAsync(page); } }