2022-09-12 07:13:52 +00:00
const PaginatorProps = [
{
2022-09-14 14:26:41 +00:00
name : 'totalRecords' ,
type : 'number' ,
default : '0' ,
description : 'Number of total records.'
2022-09-12 07:13:52 +00:00
} ,
{
2022-09-14 14:26:41 +00:00
name : 'rows' ,
type : 'number' ,
default : '0' ,
description : 'Data count to display per page.'
2022-09-12 07:13:52 +00:00
} ,
{
2022-09-14 14:26:41 +00:00
name : 'first' ,
type : 'number' ,
default : '0' ,
description : 'Zero-relative number of the first row to be displayed.'
2022-09-12 07:13:52 +00:00
} ,
{
2022-09-14 14:26:41 +00:00
name : 'pageLinkSize' ,
type : 'number' ,
default : '5' ,
description : 'Number of page links to display.'
2022-09-12 07:13:52 +00:00
} ,
{
2022-09-14 14:26:41 +00:00
name : 'rowsPerPageOptions' ,
type : 'array' ,
default : 'null' ,
description : 'Array of integer values to display inside rows per page dropdown.'
2022-09-12 07:13:52 +00:00
} ,
{
2022-09-14 14:26:41 +00:00
name : 'template' ,
type : 'string' ,
default : 'FirstPageLink PrevPageLink PageLinks NextPageLink LastPageLink RowsPerPageDropdown' ,
description : 'Template of the paginator.'
2022-09-12 07:13:52 +00:00
} ,
{
2022-09-14 14:26:41 +00:00
name : 'currentPageReportTemplate' ,
type : 'string' ,
default : '({currentPage} of {totalPages})' ,
description : 'Template of the current page report element. Available placeholders are {currentPage},{totalPages},{rows},{first},{last} and {totalRecords}'
2022-09-12 07:13:52 +00:00
} ,
{
2022-09-14 14:26:41 +00:00
name : 'alwaysShow' ,
type : 'boolean' ,
default : 'true' ,
description : 'Whether to show the paginator even there is only one page.'
2023-05-08 09:35:25 +00:00
} ,
{
name : 'pt' ,
type : 'any' ,
default : 'null' ,
2023-08-01 14:01:12 +00:00
description : 'Used to pass attributes to DOM elements inside the component.'
2023-07-06 13:20:37 +00:00
} ,
{
name : 'unstyled' ,
type : 'boolean' ,
default : 'false' ,
description : 'When enabled, it removes component related styles in the core.'
2022-09-12 07:13:52 +00:00
}
] ;
const PaginatorEvents = [
{
2022-09-14 14:26:41 +00:00
name : 'page' ,
description : 'Callback to invoke when page changes, the event object contains information about the new state.' ,
2022-09-12 07:13:52 +00:00
arguments : [
{
2022-09-14 14:26:41 +00:00
name : 'event.page' ,
type : 'number' ,
description : 'New page number'
2022-09-12 07:13:52 +00:00
} ,
{
2022-09-14 14:26:41 +00:00
name : 'event.first' ,
type : 'number' ,
description : 'Index of first record'
2022-09-12 07:13:52 +00:00
} ,
{
2022-09-14 14:26:41 +00:00
name : 'event.rows' ,
type : 'number' ,
description : 'Number of rows to display in new page'
2022-09-12 07:13:52 +00:00
} ,
{
2022-09-14 14:26:41 +00:00
name : 'event.pageCount' ,
type : 'number' ,
description : 'Total number of pages'
2022-09-12 07:13:52 +00:00
}
]
}
] ;
const PaginatorSlots = [
{
2023-04-18 13:42:36 +00:00
name : 'start' ,
2023-04-07 06:48:00 +00:00
description : "Custom content for the component's left side."
2022-09-12 07:13:52 +00:00
} ,
{
2023-04-18 13:42:36 +00:00
name : 'end' ,
2023-04-07 06:48:00 +00:00
description : "Custom content for the component's right side."
} ,
{
name : 'firstpagelinkicon' ,
description : 'Custom first page link icon template.'
} ,
{
name : 'prevpagelinkicon' ,
description : 'Custom previous page link icon template.'
} ,
{
name : 'nextpagelinkicon' ,
description : 'Custom next page link icon template.'
} ,
{
name : 'lastpagelinkicon' ,
description : 'Custom last page link icon template.'
2022-09-12 07:13:52 +00:00
}
] ;
module . exports = {
paginator : {
2022-09-14 14:26:41 +00:00
name : 'Paginator' ,
description : 'Paginator is a generic component to display content in paged format.' ,
2022-09-12 07:13:52 +00:00
props : PaginatorProps ,
events : PaginatorEvents ,
slots : PaginatorSlots
}
} ;