@gravity-ui/uikit
Version:
Gravity UI base styling and components
125 lines (124 loc) • 4.34 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", { value: true });
exports.getNumerationList = getNumerationList;
exports.getNumberOfPages = getNumberOfPages;
exports.getResultTotal = getResultTotal;
exports.getSize = getSize;
exports.getResultPage = getResultPage;
exports.getViews = getViews;
exports.buildComponentProps = buildComponentProps;
exports.shouldUpdateOnPaginationItemClick = shouldUpdateOnPaginationItemClick;
const tslib_1 = require("tslib");
const uniq_1 = tslib_1.__importDefault(require("lodash/uniq.js"));
const warn_1 = require("../utils/warn.js");
function getNumerationList({ page, numberOfPages, mobile, }) {
return mobile
? getMobileNumerationList(page, numberOfPages)
: getDesktopNumerationList(page, numberOfPages);
}
function getMobileNumerationList(page, numberOfPages) {
const list = [page, 'pageOf', numberOfPages];
return list;
}
function getDesktopNumerationList(page, numberOfPages) {
const prevPage = Math.max(page - 1, 1);
let rightPage = Math.min(page + 1, numberOfPages);
const list = [prevPage, page, rightPage];
if (page === 1) {
rightPage = Math.min(rightPage + 1, numberOfPages);
list.push(rightPage);
}
if (numberOfPages - rightPage >= 2) {
list.push('ellipsis');
}
if (numberOfPages - page === 1) {
list.unshift(Math.max(page - 2, 1));
}
if (page === numberOfPages) {
list.unshift(Math.max(page - 2, 1));
list.unshift(Math.max(page - 3, 1));
}
list.push(numberOfPages);
return (0, uniq_1.default)(list);
}
function getNumberOfPages(pageSize, total = 0) {
return Math.floor((total - 1) / pageSize) + 1;
}
function getResultTotal(total) {
return total === undefined || total > 0 ? total : 1;
}
function getSize({ propSize, mobile, }) {
if (propSize) {
return propSize;
}
return mobile ? 'l' : 'm';
}
function getResultPage({ page, total, pageSize, }) {
return page > 0 && (total === undefined || page <= getNumberOfPages(pageSize, total))
? page
: 1;
}
function getViews({ propView, mobile }) {
const buttonView = propView === 'clear' ? 'flat' : 'outlined';
const inputView = mobile && propView === 'clear' ? 'clear' : 'normal';
const pageSizerView = propView === 'outlined' ? 'normal' : 'clear';
return { buttonView, inputView, pageSizerView };
}
const PAGINATION_MANAGED_PROPS = new Set([
'onClick',
'className',
'size',
'view',
'selected',
'disabled',
'qa',
'aria-current',
'extraProps',
'children',
]);
function buildComponentProps({ component, item, getPageProps, page = 0, pageSize, onUpdate, }) {
const disabled = item.type === 'button' && item.disabled;
const onClick = disabled
? undefined
: (event) => {
if (shouldUpdateOnPaginationItemClick(event, Boolean(component))) {
onUpdate(page, pageSize);
}
};
const ariaCurrent = component && item.type === 'page' && item.current ? 'page' : undefined;
const base = { onClick, 'aria-current': ariaCurrent };
if (!component || disabled) {
return base;
}
const userProps = getPageProps?.({ item, page });
const filtered = {};
if (userProps) {
for (const key of Object.keys(userProps)) {
if (!PAGINATION_MANAGED_PROPS.has(key)) {
filtered[key] = userProps[key];
}
}
}
if (component === 'a') {
if (filtered.href === undefined) {
(0, warn_1.warnOnce)('[Pagination] `component="a"` requires an `href` returned from `getPageProps` for every clickable item, otherwise the item falls back to a native `<button>`.');
}
return { ...base, ...filtered };
}
return { ...base, component, ...filtered };
}
// Only plain current-tab clicks should update pagination state.
function shouldUpdateOnPaginationItemClick(event, hasComponent) {
if (!hasComponent) {
return true;
}
const target = event.currentTarget.getAttribute('target');
return (!event.defaultPrevented &&
event.button === 0 &&
!event.metaKey &&
!event.ctrlKey &&
!event.shiftKey &&
!event.altKey &&
(!target || target === '_self'));
}
//# sourceMappingURL=utils.js.map