Interface PaginationOptions

Interface defining the options for the Pagination component.

PaginationOptions

Pagination State:

interface PaginationOptions {
    totalPages: number;
    currentUserPage: number;
    handlePageChange?: ((options: GeneratePageContentOptions) => Promise<void>);
    position?: "left" | "right" | "middle";
    location?: "top" | "bottom" | "middle";
    direction?: "horizontal" | "vertical";
    buttonsContainerStyle?: StyleProp<ViewStyle>;
    activePageStyle?: StyleProp<ViewStyle>;
    inactivePageStyle?: StyleProp<ViewStyle>;
    backgroundColor?: string;
    paginationHeight?: number;
    showAspect?: boolean;
    parameters: PaginationParameters;
    style?: object;
    renderContent?: ((options: {
        defaultContent: ReactNode;
        dimensions: {
            width: number;
            height: number;
        };
    }) => ReactNode);
    renderContainer?: ((options: {
        defaultContainer: ReactNode;
        dimensions: {
            width: number;
            height: number;
        };
    }) => ReactNode);
}

Properties

totalPages currentUserPage handlePageChange? position? location? direction? buttonsContainerStyle? activePageStyle? inactivePageStyle? backgroundColor? paginationHeight? showAspect? parameters style? renderContent? renderContainer?

Properties

totalPages

totalPages: number

Total number of pages available

currentUserPage

currentUserPage: number

Current page number the user is viewing (1-indexed)

OptionalhandlePageChange

handlePageChange?: ((options: GeneratePageContentOptions) => Promise<void>)

Function to handle page changes (default: generatePageContent)

Layout & Positioning:

Optionalposition

position?: "left" | "right" | "middle"

Horizontal alignment

Optionallocation

location?: "top" | "bottom" | "middle"

Vertical alignment

Optionaldirection

direction?: "horizontal" | "vertical"

Pagination button layout direction

OptionalbuttonsContainerStyle

buttonsContainerStyle?: StyleProp<ViewStyle>

Custom styles for buttons container

OptionalactivePageStyle

activePageStyle?: StyleProp<ViewStyle>

Custom styles for active page button

OptionalinactivePageStyle

inactivePageStyle?: StyleProp<ViewStyle>

Custom styles for inactive page buttons

OptionalbackgroundColor

backgroundColor?: string

Background color of pagination container

OptionalpaginationHeight

paginationHeight?: number

Height of the pagination container in pixels

OptionalshowAspect

showAspect?: boolean

Whether to display the pagination component

Styling:

parameters

parameters: PaginationParameters

Pagination context and breakout room parameters

Advanced Render Overrides:

Optionalstyle

style?: object

Additional custom styles for container

State Parameters:

OptionalrenderContent

renderContent?: ((options: {
    defaultContent: ReactNode;
    dimensions: {
        width: number;
        height: number;
    };
}) => ReactNode)

Function to wrap or replace pagination content

OptionalrenderContainer

renderContainer?: ((options: {
    defaultContainer: ReactNode;
    dimensions: {
        width: number;
        height: number;
    };
}) => ReactNode)

Function to wrap or replace pagination container

Settings

Member Visibility

On This Page

Properties