Pagination

For more examples, visit the Storybook.

Example

<StudsPagination>
    <StudsPaginationContent>
        <StudsPaginationItem>
        <StudsPaginationPrevious />
        </StudsPaginationItem>
        <StudsPaginationItem>
        <StudsPaginationLink isActive>1</StudsPaginationLink>
        </StudsPaginationItem>
        <StudsPaginationItem>
        <StudsPaginationLink>2</StudsPaginationLink>
        </StudsPaginationItem>
        <StudsPaginationItem>
        <StudsPaginationLink>3</StudsPaginationLink>
        </StudsPaginationItem>
        <StudsPaginationItem>
        <StudsPaginationNext />
        </StudsPaginationItem>
    </StudsPaginationContent>
</StudsPagination>

`<StudsPaginationLink>` Props

isActive

boolean

default:"false"

If true, the link is active.

For more examples, visit the Storybook.

Example

<StudsPagination>
    <StudsPaginationContent>
        <StudsPaginationItem>
        <StudsPaginationPrevious />
        </StudsPaginationItem>
        <StudsPaginationItem>
        <StudsPaginationLink isActive>1</StudsPaginationLink>
        </StudsPaginationItem>
        <StudsPaginationItem>
        <StudsPaginationLink>2</StudsPaginationLink>
        </StudsPaginationItem>
        <StudsPaginationItem>
        <StudsPaginationLink>3</StudsPaginationLink>
        </StudsPaginationItem>
        <StudsPaginationItem>
        <StudsPaginationNext />
        </StudsPaginationItem>
    </StudsPaginationContent>
</StudsPagination>

`<StudsPaginationLink>` Props

isActive

boolean

default:"false"

If true, the link is active.

For more examples, visit the Storybook.

Example

<StudsPagination
    PageSize="10"
    Count="100"
/>

`<StudsPagination>` Parameters

FirstPageTitle

string

default:"First page"

Gets or sets the pager’s first page button’s title attribute.

FirstPageAriaLabel

string

default:"Go to first page."

Gets or sets the pager’s first page button’s aria-label attribute.

PrevPageLabel

string

Gets or sets the pager’s optional previous page button’s label text.

PrevPageTitle

string

default:"Previous page"

Gets or sets the pager’s previous page button’s title attribute.

PrevPageAriaLabel

string

default:"Go to previous page."

Gets or sets the pager’s previous page button’s aria-label attribute.

LastPageTitle

string

default:"Last page"

Gets or sets the pager’s last page button’s title attribute.

LastPageAriaLabel

string

default:"Go to last page."

Gets or sets the pager’s last page button’s aria-label attribute.

NextPageLabel

string

Gets or sets the pager’s optional next page button’s label text.

NextPageTitle

string

default:"Next page"

Gets or sets the pager’s next page button’s title attribute.

NextPageAriaLabel

string

default:"Go to next page."

Gets or sets the pager’s next page button’s aria-label attribute.

PageTitleFormat

string

default:"Page {0}"

Gets or sets the pager’s numeric page number buttons’ title attributes.

PageAriaLabelFormat

string

default:"Go to page {0}."

Gets or sets the pager’s numeric page number buttons’ aria-label attributes.

PageSize

int

default:"10"

Gets or sets the page size.

PageSizeChanged

EventCallback<int>

Gets or sets the page size changed callback.

PageSizeOptions

IEnumerable<int>

Gets or sets the page size options.

PageSizeText

string

default:"items per page"

Gets or sets the page size description text.

PageNumbersCount

int

default:"5"

Gets or sets the page numbers count.

Count

int

Gets or sets the total items count.

AlwaysVisible

bool

default:"false"

Gets or sets a value indicating whether pager is visible even when not enough data for paging.

PageChanged

EventCallback<PagerEventArgs>

Gets or sets the page changed callback.

Attributes

Dictionary<string, object>

Specifies additional custom attributes that will be rendered by the component.

MouseEnter

EventCallback<ElementReference>

Gets or sets the callback that is invoked when the mouse enters an item.

MouseLeave

EventCallback<ElementReference>

Gets or sets the callback that is invoked when the mouse leaves an item.

A callback that will be invoked when the user right-clicks the component. Commonly used to display a context menu.

Culture

CultureInfo

default:"CultureInfo.CurrentCulture"

Gets or sets the culture used to display localizable data (numbers, dates). Set by default to “CultureInfo.CurrentCulture”.

Style

string

Gets or sets the inline CSS style.

Visible

bool

default:"true"

Gets or sets a value indicating whether this “T:Studs.StudsComponent” is visible. Invisible components are not rendered.

Getting Started

Foundations

Components

Integration

Content

`<StudsPaginationLink>` Props

`<StudsPaginationLink>` Props

`<StudsPagination>` Parameters

Getting Started

Foundations

Components

Integration

Content

​<StudsPaginationLink> Props

​<StudsPaginationLink> Props

​<StudsPagination> Parameters

`<StudsPaginationLink>` Props

`<StudsPaginationLink>` Props

`<StudsPagination>` Parameters