import { ComponentInterface, EventEmitter } from '../../stencil-public-runtime';
/**
 * @name Pagination
 * @category Display
 * @summary Use for navigating between pages of content like search results or tables.
 */
export declare class Q2Pagination implements ComponentInterface {
    containerElement: HTMLElement;
    containerWidth: number;
    firstPageBtn: HTMLQ2BtnElement;
    inputField: HTMLQ2InputElement;
    lastPageBtn: HTMLQ2BtnElement;
    nextPageBtn: HTMLQ2BtnElement;
    perPageSelect: HTMLQ2SelectElement;
    prevPageBtn: HTMLQ2BtnElement;
    resizeObserver: ResizeObserver;
    hostElement: HTMLElement;
    isSmall: boolean;
    /**
     * Indicates the horizontal alignment of pagination elements
     * @info
     * When using the 'stacked' version, the default alignment is 'center'. When using the unstacked version, the default alignment is 'right'.
     */
    align?: 'left' | 'center' | 'right';
    /** @deprecated Use 'align' instead */
    alignment?: 'left' | 'center' | 'right';
    /** Determines whether the component uses dynamic resizing behavior. This is disabled when `pagesOnly`, `recordsOnly`, or `stacked` is true. */
    autoSize: boolean;
    /** Allows the component to be disabled should the state of the page require this  */
    disabled: boolean;
    /** The current page that is being displayed. */
    page: number;
    /**
     * The number of pages that can be displayed.
     * @info
     * Only referenced when `pagesOnly` is true.
     */
    pages: number;
    /** Indicates to display only the current and total pages. This disables the `autoSize` feature. */
    pagesOnly: boolean;
    /** The total number of records displayed on each page. This disables the `autoSize` feature. */
    perPage: number;
    /**
     * A list of perPage values.
     * This generates a [Select](https://tecton.q2developer.com/design-system/q2-select/) element that allows the user to modify the `perPage` value.
     * @info
     * `pagesOnly` or `recordsOnly` being true disables this feature.
     *
     * **Example:**
     * @snippet
     * this.perPageIncrements = [10, 25, 50];
     */
    perPageIncrements: number[] | string[] | string | undefined;
    /** Indicates to display only the current and total records. */
    recordsOnly: boolean;
    /** Description of the record type to be displayed alongside the record count. */
    recordType: string;
    /**
     * Allows the component to be displayed in a stacked layout. This disables the `autoSize` feature.
     * @info
     * When set to true, the default alignment will be 'center'. When false, the default alignment is 'right'.
     */
    stacked: boolean;
    /** The total number of records to paginate. */
    total: number;
    /**
     * Emitted when the page is changed.
     * @legacyEvent
     * @deprecated Use 'tctChange' instead
     */
    change: EventEmitter<{
        page: number;
        perPage: number;
    }>;
    /**
     * Emitted when the page is changed.
     * @legacyEvent
     */
    tctChange: EventEmitter<{
        page: number;
        perPage: number;
    }>;
    disconnectedCallback(): void;
    componentWillLoad(): void;
    componentDidLoad(): void;
    onHostElementFocus(event: any): void;
    /**
     * Emulates clicking the button that controls moving to the first page, and emitting a change event with the updated page number.
     *
     * If the `<button>` is disabled, this method does nothing.
     * @testOnly
     */
    clickFirstPage(): Promise<void>;
    /**
     * Emulates clicking the button that controls moving to the last page, and emitting a change event with the updated page number.
     *
     * If the `<button>` is disabled, this method does nothing.
     * @testOnly
     */
    clickLastPage(): Promise<void>;
    /**
     * Emulates clicking the button that controls moving to the next page, and emitting a change event with the updated page number.
     *
     * If the `<button>` is disabled, this method does nothing.
     * @testOnly
     */
    clickNextPage(): Promise<void>;
    /**
     * Emulates clicking the button that controls moving to the previous page, and emitting a change event with the updated page number.
     *
     * If the `<button>` is disabled, this method does nothing.
     * @testOnly
     */
    clickPreviousPage(): Promise<void>;
    /**
     * Emulates selecting a `perPage` value from the `perPageIncrements` dropdown,
     * and updates the value of the `perPage` property.
     *
     * If `value` is not in the `perPageIncrements` array, this method does nothing.
     * @testOnly
     */
    selectPerPageIncrementValue(value: number): Promise<void>;
    /**
     * Emulates setting the page value in the `<input>` field,
     * and emitting a change event with the updated page number.
     *
     * If `value` is invalid, this method does nothing.
     * @testOnly
     */
    setPageValue(value: number): Promise<void>;
    alignmentHandler(): void;
    manageResizeObserver(): void;
    checkDisplayTypes(): void;
    get containerClasses(): string[];
    get currentRange(): string;
    get isFullViewHidden(): boolean;
    get nextRange(): string;
    get pageWithDefault(): number;
    get perPageIncrementsArray(): number[];
    get perPageWithDefault(): number;
    get prevRange(): string;
    get recordTypeWithDefault(): string;
    get showPerPageSelect(): boolean;
    get totalPages(): number;
    get totalWithDefault(): number;
    checkSize: () => void;
    handlePageChange: (page: number | string) => void;
    handlePerPageChange: (event: CustomEvent) => void;
    removeResizeObserver(): void;
    renderPerPage(): any;
    render(): any;
}