widenarrow-ui 1.0.48 → 1.0.49
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/lib/components/Pagination/Pagination.types.d.ts +7 -3
- package/lib/index.d.ts +7 -3
- package/lib/index.esm.js +20 -22
- package/lib/index.esm.js.map +1 -1
- package/lib/index.js +20 -22
- package/lib/index.js.map +1 -1
- package/package.json +1 -1
- package/src/components/Pagination/Pagination.tsx +82 -65
- package/src/components/Pagination/Pagination.types.ts +7 -3
package/lib/index.js
CHANGED
|
@@ -2610,7 +2610,7 @@ var styles$b = {"body":"Pagination-module_WRLv5h","container":"Pagination-module
|
|
|
2610
2610
|
var s$b = classNames.bind(styles$b);
|
|
2611
2611
|
var Pagination = function (_a) {
|
|
2612
2612
|
var _b;
|
|
2613
|
-
var className = _a.className, pagination = _a.pagination,
|
|
2613
|
+
var className = _a.className, pagination = _a.pagination, slim = _a.slim, onChange = _a.onChange, _c = _a.buttonType, buttonType = _c === void 0 ? exports.HierarchyTypes.SECONDARY : _c, _d = _a.pageSizeOptions, pageSizeOptions = _d === void 0 ? [10, 20, 30, 40, 50, 80, 100] : _d, firstPageTitle = _a.firstPageTitle, previousPageTitle = _a.previousPageTitle, nextPageTitle = _a.nextPageTitle, lastPageTitle = _a.lastPageTitle, pageSizeTitleCallback = _a.pageSizeTitleCallback, tableIntervalTitleCallback = _a.tableIntervalTitleCallback, withTablePagination = _a.withTablePagination, withFastForwardButtons = _a.withFastForwardButtons, withPageSizeChange = _a.withPageSizeChange;
|
|
2614
2614
|
if (!pagination) {
|
|
2615
2615
|
return null;
|
|
2616
2616
|
}
|
|
@@ -2626,9 +2626,6 @@ var Pagination = function (_a) {
|
|
|
2626
2626
|
var _a;
|
|
2627
2627
|
return s$b('button', (_a = { button_slim: slim }, _a[additionalClassName] = additionalClassName, _a));
|
|
2628
2628
|
};
|
|
2629
|
-
if (numberOfPages < 2) {
|
|
2630
|
-
return null;
|
|
2631
|
-
}
|
|
2632
2629
|
if (pagination.fetching && !numberOfPages) {
|
|
2633
2630
|
return (jsxRuntime.jsx("ul", { className: s$b('container', (_b = {}, _b[className] = className, _b)), children: ramda.times(function (i) { return (jsxRuntime.jsx("li", { className: itemClassName, children: jsxRuntime.jsx("div", { className: buttonClassName() }) }, i)); }, 5) }));
|
|
2634
2631
|
}
|
|
@@ -2639,39 +2636,40 @@ var Pagination = function (_a) {
|
|
|
2639
2636
|
? tableIntervalTitleCallback({ start: start, end: end, total: pagination.numberOfHits })
|
|
2640
2637
|
: "".concat(start, " - ").concat(end, " of ").concat(pagination.numberOfHits) }) }));
|
|
2641
2638
|
};
|
|
2639
|
+
var firstPageButton = withFastForwardButtons ? (jsxRuntime.jsx("li", { children: jsxRuntime.jsx("button", { title: firstPageTitle || 'First page', className: buttonClassName(isFirstPage ? 'button_disabled' : undefined), onClick: function () {
|
|
2640
|
+
onChange(__assign(__assign({}, pagination), { currentPage: 1 }));
|
|
2641
|
+
}, disabled: isFirstPage, children: jsxRuntime.jsx(Icon, { icon: exports.IconTypes.ARROW_FIRST_PAGE }) }) })) : null;
|
|
2642
|
+
var previousPageButton = (jsxRuntime.jsx("li", { className: itemClassName, children: jsxRuntime.jsx("button", { title: previousPageTitle || 'Previous page', className: buttonClassName(isFirstPage ? 'button_disabled' : undefined), onClick: function () {
|
|
2643
|
+
!isFirstPage && onChange(__assign(__assign({}, pagination), { currentPage: pagination.currentPage - 1 }));
|
|
2644
|
+
}, disabled: isFirstPage, children: jsxRuntime.jsx(Icon, { icon: exports.IconTypes.CHEVRON_LEFT }) }) }));
|
|
2645
|
+
var nextPageButton = (jsxRuntime.jsx("li", { className: itemClassName, children: jsxRuntime.jsx("button", { title: nextPageTitle || 'Next page', className: buttonClassName(isLastPage ? 'button_disabled' : undefined), onClick: function () {
|
|
2646
|
+
onChange(__assign(__assign({}, pagination), { currentPage: pagination.currentPage + 1 }));
|
|
2647
|
+
}, disabled: isLastPage, children: jsxRuntime.jsx(Icon, { icon: exports.IconTypes.CHEVRON_RIGHT }) }) }));
|
|
2648
|
+
var lastPageButton = withFastForwardButtons ? (jsxRuntime.jsx("li", { children: jsxRuntime.jsx("button", { title: lastPageTitle || 'Last page', className: buttonClassName(isLastPage ? 'button_disabled' : undefined), onClick: function () {
|
|
2649
|
+
onChange(__assign(__assign({}, pagination), { currentPage: pagination.numberOfPages }));
|
|
2650
|
+
}, disabled: isLastPage, children: jsxRuntime.jsx(Icon, { icon: exports.IconTypes.ARROW_LAST_PAGE }) }) })) : null;
|
|
2642
2651
|
/*
|
|
2643
2652
|
paginationMarkup
|
|
2644
2653
|
*/
|
|
2645
2654
|
var paginationMarkup = function () {
|
|
2646
2655
|
var _a, _b;
|
|
2647
|
-
if (
|
|
2648
|
-
return (jsxRuntime.jsxs(Box, { alignItems: 'center', children: [jsxRuntime.jsxs("ul", { className: s$b('container', (_a = {}, _a[className] = className, _a)), children: [
|
|
2649
|
-
!isFirstPage && onPaginate(pagination.currentPage - 1);
|
|
2650
|
-
}, disabled: isFirstPage, children: jsxRuntime.jsx(Icon, { icon: exports.IconTypes.CHEVRON_LEFT }) }) }), jsxRuntime.jsx("li", { className: itemClassName, children: jsxRuntime.jsx("button", { title: nextPageTitle || 'Next page', className: buttonClassName(isLastPage ? 'button_disabled' : undefined), onClick: function () {
|
|
2651
|
-
onPaginate(pagination.currentPage + 1);
|
|
2652
|
-
}, disabled: isLastPage, children: jsxRuntime.jsx(Icon, { icon: exports.IconTypes.CHEVRON_RIGHT }) }) })] }), getPageInfoText()] }));
|
|
2656
|
+
if (withTablePagination) {
|
|
2657
|
+
return (jsxRuntime.jsxs(Box, { alignItems: 'center', children: [jsxRuntime.jsxs("ul", { className: s$b('container', (_a = {}, _a[className] = className, _a)), children: [firstPageButton, previousPageButton, nextPageButton, lastPageButton] }), getPageInfoText()] }));
|
|
2653
2658
|
}
|
|
2654
|
-
return (jsxRuntime.jsxs("ul", { className: s$b('container', (_b = {}, _b[className] = className, _b)), children: [
|
|
2655
|
-
!isFirstPage && onPaginate(pagination.currentPage - 1);
|
|
2656
|
-
}, disabled: isFirstPage, children: jsxRuntime.jsx(Icon, { icon: exports.IconTypes.CHEVRON_LEFT }) }) }), getPaginationArray(pagination).map(function (pageObject, index) {
|
|
2659
|
+
return (jsxRuntime.jsxs("ul", { className: s$b('container', (_b = {}, _b[className] = className, _b)), children: [firstPageButton, previousPageButton, getPaginationArray(pagination).map(function (pageObject, index) {
|
|
2657
2660
|
if (pageObject.type === 'dots') {
|
|
2658
2661
|
return (jsxRuntime.jsx("li", { className: itemClassName, children: jsxRuntime.jsx("div", { className: s$b('dots', { dots_slim: slim }), children: "..." }) }, "".concat(pageObject.type, "-").concat(index)));
|
|
2659
2662
|
}
|
|
2660
2663
|
return (jsxRuntime.jsx("li", { className: itemClassName, children: jsxRuntime.jsx("button", { title: "Go to page ".concat(pageObject.page), className: buttonClassName(pageObject.page === pagination.currentPage ? 'button_isActive' : undefined), onClick: function () {
|
|
2661
|
-
|
|
2664
|
+
onChange(__assign(__assign({}, pagination), { currentPage: pageObject.page }));
|
|
2662
2665
|
}, children: pageObject.page }) }, "".concat(pageObject.type, "-").concat(index)));
|
|
2663
|
-
}),
|
|
2664
|
-
onPaginate(pagination.currentPage + 1);
|
|
2665
|
-
}, disabled: isLastPage, children: jsxRuntime.jsx(Icon, { icon: exports.IconTypes.CHEVRON_RIGHT }) }) })] }));
|
|
2666
|
+
}), nextPageButton, lastPageButton] }));
|
|
2666
2667
|
};
|
|
2667
|
-
/*
|
|
2668
|
-
pageSizeMarkup
|
|
2669
|
-
*/
|
|
2670
2668
|
var sizeTitle = pageSizeTitleCallback ? pageSizeTitleCallback({ pageSize: pagination.pageSize }) : "Page size: ".concat(pagination.pageSize);
|
|
2671
2669
|
var pageSizeMarkup = function () {
|
|
2672
|
-
return
|
|
2670
|
+
return withPageSizeChange ? (jsxRuntime.jsxs(react.Fragment, { children: [jsxRuntime.jsx(Separator, { marginX: '15' }), jsxRuntime.jsx(DropDown, { buttonComponent: jsxRuntime.jsx(InlineButton, { type: buttonType, text: sizeTitle }), title: sizeTitle, children: pageSizeOptions
|
|
2673
2671
|
.filter(function (pageSize) { return pageSize < pagination.numberOfHits; })
|
|
2674
|
-
.map(function (pageSize) { return (jsxRuntime.jsx(DropDownItem, { text: pageSize.toString(), onClickCallback: function () { return
|
|
2672
|
+
.map(function (pageSize) { return (jsxRuntime.jsx(DropDownItem, { text: pageSize.toString(), onClickCallback: function () { return onChange(__assign(__assign({}, pagination), { pageSize: pageSize })); }, active: pagination.pageSize === pageSize, closeDropDownOnClick: true, withEllipsis: true })); }) })] })) : null;
|
|
2675
2673
|
};
|
|
2676
2674
|
return (jsxRuntime.jsxs(Box, { alignItems: 'center', children: [paginationMarkup(), pageSizeMarkup()] }));
|
|
2677
2675
|
};
|