primevue-mirror/components/lib/paginator/Paginator.d.ts

344 lines
8.9 KiB
TypeScript
Raw Normal View History

2023-03-01 11:45:54 +00:00
/**
*
* Paginator is a generic component to display content in paged format.
*
2023-04-05 14:01:38 +00:00
* [Live Demo](https://primevue.org/paginator)
2023-03-01 11:45:54 +00:00
*
* @module paginator
*
*/
2022-09-06 12:03:37 +00:00
import { VNode } from 'vue';
2023-05-08 09:35:25 +00:00
import { DropdownPassThroughOptionType } from '../dropdown';
import { InputNumberPassThroughOptionType } from '../inputnumber';
2022-09-06 12:03:37 +00:00
import { ClassComponent, GlobalComponentConstructor } from '../ts-helpers';
2023-05-08 09:35:25 +00:00
export declare type PaginatorPassThroughOptionType = PaginatorPassThroughAttributes | ((options: PaginatorPassThroughMethodOptions) => PaginatorPassThroughAttributes) | null | undefined;
/**
* Custom passthrough(pt) option method.
*/
export interface PaginatorPassThroughMethodOptions {
props: PaginatorProps;
state: PaginatorState;
context: PaginatorContext;
}
/**
* Custom passthrough(pt) options.
* @see {@link PaginatorProps.pt}
*/
export interface PaginatorPassThroughOptions {
2023-06-05 11:04:02 +00:00
/**
* Uses to pass attributes to the paginator wrapper's DOM element.
*/
paginatorWrapper?: PaginatorPassThroughOptionType;
2023-05-08 09:35:25 +00:00
/**
* Uses to pass attributes to the root's DOM element.
*/
root?: PaginatorPassThroughOptionType;
/**
2023-05-30 13:39:08 +00:00
* Uses to pass attributes to the start's DOM element.
2023-05-08 09:35:25 +00:00
*/
2023-05-30 13:39:08 +00:00
start?: PaginatorPassThroughOptionType;
2023-05-08 09:35:25 +00:00
/**
* Uses to pass attributes to the first page button's DOM element.
*/
firstPageButton?: PaginatorPassThroughOptionType;
/**
* Uses to pass attributes to the first page icon's DOM element.
*/
firstPageIcon?: PaginatorPassThroughOptionType;
/**
* Uses to pass attributes to the prev page button's DOM element.
* @deprecated
2023-05-08 09:35:25 +00:00
*/
prevPageButton?: PaginatorPassThroughOptionType;
/**
* Uses to pass attributes to the prev page button's DOM element.
*/
previousPageButton?: PaginatorPassThroughOptionType;
2023-05-08 09:35:25 +00:00
/**
* Uses to pass attributes to the prev page icon's DOM element.
* @deprecated
2023-05-08 09:35:25 +00:00
*/
prevPageIcon?: PaginatorPassThroughOptionType;
/**
* Uses to pass attributes to the prev page icon's DOM element.
*/
previousPageIcon?: PaginatorPassThroughOptionType;
2023-05-08 09:35:25 +00:00
/**
* Uses to pass attributes to the next page button's DOM element.
*/
nextPageButton?: PaginatorPassThroughOptionType;
/**
* Uses to pass attributes to the next page icon's DOM element.
*/
nextPageIcon?: PaginatorPassThroughOptionType;
/**
* Uses to pass attributes to the last page button's DOM element.
*/
lastPageButton?: PaginatorPassThroughOptionType;
/**
* Uses to pass attributes to the last page icon's DOM element.
*/
lastPageIcon?: PaginatorPassThroughOptionType;
/**
* Uses to pass attributes to the pages's DOM element.
*/
pages?: PaginatorPassThroughOptionType;
/**
* Uses to pass attributes to the page button's DOM element.
*/
pageButton?: PaginatorPassThroughOptionType;
/**
* Uses to pass attributes to the current's DOM element.
*/
current?: PaginatorPassThroughOptionType;
/**
* Uses to pass attributes to the Dropdown component.
* @deprecated
2023-05-08 09:35:25 +00:00
*/
RPPDropdown?: DropdownPassThroughOptionType;
/**
* Uses to pass attributes to the Dropdown component.
* @see {@link DropdownPassThroughOptionType}
*/
rowPerPageDropdown?: DropdownPassThroughOptionType;
/**
* Uses to pass attributes to the Dropdown component.
* deprecated
*/
2023-05-08 09:35:25 +00:00
JTPDropdown?: DropdownPassThroughOptionType;
/**
* Uses to pass attributes to the Dropdown component.
* @see {@link DropdownPassThroughOptionType}
*/
jumpToPageDropdown?: DropdownPassThroughOptionType;
/**
* Uses to pass attributes to the Dropdown component.
* @deprecated
2023-05-08 09:35:25 +00:00
*/
JTPInput?: InputNumberPassThroughOptionType;
/**
* Uses to pass attributes to the Dropdown component.
* @see {@link InputNumberPassThroughOptionType}
*/
jumpToPageInput?: InputNumberPassThroughOptionType;
2023-05-08 09:35:25 +00:00
/**
* Uses to pass attributes to the end's DOM element.
*/
end?: PaginatorPassThroughOptionType;
}
/**
* Custom passthrough attributes for each DOM elements
*/
export interface PaginatorPassThroughAttributes {
[key: string]: any;
}
/**
* Defines current inline state in Paginator component.
*/
export interface PaginatorState {
/**
* Current index of first record as a number.
*/
d_first: number;
/**
* Current number of rows to display in new page as a number.
*/
d_rows: number;
}
/**
* Defines current options in Paginator component.
*/
export interface PaginatorContext {
/**
* Current active state as a boolean.
* @defaultValue false
*/
active: boolean;
/**
* Current disabled state of the button as a boolean.
* @defaultValue false
*/
disabled: boolean;
}
2023-03-01 11:45:54 +00:00
/**
* Paginator page state metadata.
*/
2022-09-06 12:03:37 +00:00
export interface PageState {
/**
* Index of first record
*/
first: number;
/**
* Number of rows to display in new page
*/
rows: number;
/**
* New page number
*/
page: number;
/**
* Total number of pages
*/
pageCount?: number;
}
2023-03-01 11:45:54 +00:00
/**
* Defines valid properties in Paginator component.
*/
2022-09-06 12:03:37 +00:00
export interface PaginatorProps {
/**
* Number of total records.
2023-03-01 11:45:54 +00:00
* @defaultValue 0
2022-09-06 12:03:37 +00:00
*/
totalRecords?: number | undefined;
/**
* Data count to display per page.
2023-03-01 11:45:54 +00:00
* @defaultValue 0
2022-09-06 12:03:37 +00:00
*/
rows?: number | undefined;
/**
* Zero-relative number of the first row to be displayed.
2023-03-01 11:45:54 +00:00
* @defaultValue 0
2022-09-06 12:03:37 +00:00
*/
first?: number | undefined;
/**
* Number of page links to display.
2023-03-01 11:45:54 +00:00
* @defaultValue 5
2022-09-06 12:03:37 +00:00
*/
pageLinkSize?: number | undefined;
/**
* Array of integer values to display inside rows per page dropdown.
*/
rowsPerPageOptions?: number[] | undefined;
/**
2023-06-14 14:28:21 +00:00
* Template of the paginator, can either be a string or an object with key-value pairs to define templates per breakpoint. Available templates are the following;
2022-09-06 12:03:37 +00:00
*
* - FirstPageLink
* - PrevPageLink
* - PageLinks
* - NextPageLink
* - LastPageLink
* - RowsPerPageDropdown
* - JumpToPageDropdown
* - JumpToPageInput
* - CurrentPageReport
*/
2022-12-08 11:04:25 +00:00
template?: any | string;
2022-09-06 12:03:37 +00:00
/**
2023-03-01 11:45:54 +00:00
* Template of the current page report element. It displays information about the pagination state. Available placeholders are the following;
2022-09-06 12:03:37 +00:00
*
* - {currentPage}
* - {totalPages}
* - {rows}
* - {first}
* - {last}
* - {totalRecords}
2023-03-01 11:45:54 +00:00
*
2023-03-08 11:02:08 +00:00
* @defaultValue '({currentPage} of {totalPages})'
2022-09-06 12:03:37 +00:00
*/
currentPageReportTemplate?: string | undefined;
/**
* Whether to show the paginator even there is only one page.
2023-03-01 11:45:54 +00:00
* @defaultValue true
2022-09-06 12:03:37 +00:00
*/
alwaysShow?: boolean | undefined;
2023-05-08 09:35:25 +00:00
/**
* Uses to pass attributes to DOM elements inside the component.
* @type {PaginatorPassThroughOptions}
*/
pt?: PaginatorPassThroughOptions;
2022-09-06 12:03:37 +00:00
}
2023-03-01 11:45:54 +00:00
/**
* Defines valid slots in Paginator component.
*/
2022-09-06 12:03:37 +00:00
export interface PaginatorSlots {
/**
* Custom start template.
* @param {Object} scope - start slot's params.
*/
2023-03-01 11:45:54 +00:00
start(scope: {
2022-09-06 12:03:37 +00:00
/**
* Current state
* @see PageState
*/
state: PageState;
2023-03-01 11:45:54 +00:00
}): VNode[];
2022-09-06 12:03:37 +00:00
/**
* Custom end template.
* @param {Object} scope - end slot's params.
*/
2023-03-01 11:45:54 +00:00
end(scope: {
2022-09-06 12:03:37 +00:00
/**
* Current state
* @see PageState
*/
state: PageState;
2023-03-01 11:45:54 +00:00
}): VNode[];
/**
* Custom first page link icon template.
*/
firstpagelinkicon(): VNode[];
/**
* Custom previous page link icon template.
*/
prevpagelinkicon(): VNode[];
/**
* Custom finextrst page link icon template.
*/
nextpagelinkicon(): VNode[];
/**
* Custom last page link icon template.
*/
lastpagelinkicon(): VNode[];
2022-09-06 12:03:37 +00:00
}
2023-03-01 11:45:54 +00:00
/**
* Defines valid emits in Paginator component.
*/
export interface PaginatorEmits {
2022-09-06 12:03:37 +00:00
/**
* Emitted when the first changes.
* @param {number} value - New value.
*/
2023-03-01 11:45:54 +00:00
'update:first'(value: number): void;
2022-09-06 12:03:37 +00:00
/**
* Emitted when the rows changes.
* @param {number} value - New value.
*/
2023-03-01 11:45:54 +00:00
'update:rows'(value: number): void;
2022-09-06 12:03:37 +00:00
/**
* Callback to invoke when page changes, the event object contains information about the new state.
* @param {PageState} event - New page state.
*/
2023-03-01 11:45:54 +00:00
page(event: PageState): void;
}
2022-09-06 12:03:37 +00:00
2023-03-01 11:45:54 +00:00
/**
* **PrimeVue - Paginator**
*
* _Paginator is a generic widget to display content in paged format._
*
* [Live Demo](https://www.primevue.org/paginator/)
* --- ---
* ![PrimeVue](https://primefaces.org/cdn/primevue/images/logo-100.png)
*
* @group Component
*/
2022-09-14 11:26:01 +00:00
declare class Paginator extends ClassComponent<PaginatorProps, PaginatorSlots, PaginatorEmits> {}
2022-09-06 12:03:37 +00:00
declare module '@vue/runtime-core' {
interface GlobalComponents {
2022-09-14 11:26:01 +00:00
Paginator: GlobalComponentConstructor<Paginator>;
2022-09-06 12:03:37 +00:00
}
}
export default Paginator;