dequelabs / dequelabs/cauldron
Pagination: Overload statusLabel to be used as a formatter for better i18n support
- Dominant language
- TypeScript
- Stars
- 127
- Forks
- 31
- Avg merge
- 2d 12h
- Merged PRs (30d)
- 8
Description
In support of i18n `Pagination` has a handful of overrides for various phrases/labels. However, the status text IMO is a bit unique. I’m referring to the “Showing 1 to 10 of 15” text, which can be overridden by the `statusLabel` prop. There are 3 pieces of data this text uses:
- `totalItems` - provided
- `itemStart` - calculated
- `itemEnd` - calculated
Because, both `itemStart` and `itemEnd` are calculated, if I wanted to internationalize the status text, I’d have to duplicate these calculations outside of `Pagination`. To avoid this…
**I’d like to propose** overloading the `statusLabel` property on `Pagination` where it can either be a `ReactNode` or a function that gets passed `totalItems`, `itemStart`, and `itemEnd` and returns a `ReactNode`.
It is important to note that using the `usePagination` exposes this data to me via `pageStatus.pageStart` and `pageStatus.pageEnd`, but if I’m not using the hook, I don’t have access to the calculated data, and the change I’m proposing is still useful.
Contributor guide
Assessment
This issue has not been assessed yet.