@namespace Connected.Components

@inherits UIComponent

<Element HtmlTag="ul" Class="@Classname" Style="@Style" Tag="@Tag" UserAttributes="@UserAttributes">
    @if (ShowFirstButton)
    {
        <li class="@ItemClassname">
            <IconButton Icon="@FirstIcon" Size="@Size" Variant="@Variant" Disabled="@(Selected == 1 || Disabled)" OnClick="@(() => OnClickControlButton(Page.First))" aria-label="First page"></IconButton>
        </li>
    }
    @if (ShowPreviousButton)
    {
        <li class="@ItemClassname">
            <IconButton Icon="@BeforeIcon" Size="@Size" Variant="@Variant" Disabled="@(Selected == 1 || Disabled)" OnClick="@(() => OnClickControlButton(Page.Previous))" aria-label="Previous page"></IconButton>
        </li>
    }
    @foreach (var state in GeneratePagination())
    {
        var currentPage = state;
        if (currentPage == -1)
        {
            <li class="@ItemClassname">
                <Text disabled="@Disabled">...</Text>
            </li>
        }
        else if (currentPage == Selected)
        {
            <li class="@SelectedItemClassname">
                <Button Variant="@(Variant == Variant.Outlined ? Variant.Outlined : Variant.Filled)" Size="@Size" DisableRipple="true" Disabled="@Disabled" Color="@Color" aria-current="page" aria-label="@($"Current page {currentPage}")">@currentPage</Button>
            </li>
        }
        else {
            <li class="@ItemClassname">
                <Button OnClick="@(() => Selected = currentPage)" Variant="@Variant" Size="@Size" DisableRipple="true" Disabled="@Disabled" aria-label="@($"Page {currentPage}")">@currentPage</Button>
            </li>
        }
    }
    @if (ShowNextButton)
    {
        <li class="@ItemClassname">
            <IconButton Icon="@NextIcon" Variant="@Variant" Size="@Size" Disabled="@(Selected == Count || Disabled)" OnClick="@(() => OnClickControlButton(Page.Next))" aria-label="Next page"></IconButton>
        </li>
    }
    @if (ShowLastButton)
    {
        <li class="@ItemClassname">
            <IconButton Icon="@LastIcon" Variant="@Variant" Size="@Size" Disabled="@(Selected == Count || Disabled)" OnClick="@(() => OnClickControlButton(Page.Last))" aria-label="Last page"></IconButton>
        </li>
    }
</Element>