[Data grid] [Behaviour] Paginator

[arecuenco-dsgn]

Introduction

Pagination divides table data into separate pages, with simple controls to navigate between pages and optionally adjust items per page and the items visible on each page. Positioned at the bottom of the data table, it enhances user navigation and data accessibility. Pagination is commonly found in interfaces displaying large datasets such as tables, grids, lists, and search results.

Paginators Parts

• Controls to move between pages (Arrow buttons)
• Page selectable control
• Items counter: Shows the total number of items and the items that are displayed on each page.
• Number of items displayed

To be discussed

• sizing: medium and large?
• is ui design of paginator in data grid the same as a stand-alone/navigation paginator?
• mobile version
• version with links and version with buttons inside

### Tasks
- [ ] https://github.com/sl-design-system/components/issues/1485
- [ ] https://github.com/sl-design-system/components/issues/1486

[anna-lach]

Questions and thoughts about the paginator

Paginator.pdf

Some conclusions after the meeting:

• there will be no labels in buttons: < previous next >, only buttons with arrows < and >
• there should be a menu button with hidden pages, when there is ellipsis ...
• when the first page is selected the < button should be disabled, and the same when the last page is selected, next button > should be disabled
• there will be no special buttons with arrows for the first and last page (but it should be possible to go to the first and last page [when there is not enough space] using page numbers [first and last]: < 1 ... 4 5 6 ... 9 >)

Waiting for input from @arecuenco-dsgn about mobile version, making parts of paginator as subcomponents (pages, items per page, total amount) etc. What about having different paginator for data grid?

[anna-lach]

Version of the paginator with links will be added at a later stage: https://github.com/sl-design-system/components/issues/1568.