UNPKG

@idares-ui/react

Version:
77 lines 4.34 kB
"use strict"; exports.__esModule = true; exports.SpacerInput = exports.LastThree = exports.FirstThree = exports.LastPage = exports.MiddlePage = exports.FirstPage = exports.NextButton = exports.PreviousButton = void 0; var tslib_1 = require("tslib"); var React = tslib_1.__importStar(require("react")); var context_1 = require("../../utils/context"); var enum_1 = require("../../utils/enum"); var ArrowButton_1 = tslib_1.__importDefault(require("../ArrowButton")); var PaginationButton_1 = tslib_1.__importDefault(require("../PaginationButton")); var NavigationButton = function (_a) { var type = _a.type; var _b = React.useContext(context_1.MainContext), numberOfPages = _b.numberOfPages, page = _b.page; var computeProps = function () { switch (type) { case enum_1.NAVIGATION_BUTTON_TYPES.PREVIOUS: return { value: page > 1 ? page - 1 : page, "aria-label": "Previous page" }; case enum_1.NAVIGATION_BUTTON_TYPES.NEXT: return { value: page < numberOfPages ? page + 1 : page, "aria-label": "Next page" }; default: return { value: page, "aria-label": "Page ".concat(page) }; } }; return (React.createElement(PaginationButton_1["default"], tslib_1.__assign({}, computeProps()), React.createElement(ArrowButton_1["default"], { type: type }))); }; var PreviousButton = function () { return (React.createElement(NavigationButton, { type: enum_1.NAVIGATION_BUTTON_TYPES.PREVIOUS })); }; exports.PreviousButton = PreviousButton; var NextButton = function () { return (React.createElement(NavigationButton, { type: enum_1.NAVIGATION_BUTTON_TYPES.NEXT })); }; exports.NextButton = NextButton; var FirstPage = function () { var page = React.useContext(context_1.MainContext).page; return (React.createElement(PaginationButton_1["default"], { active: page === 1, title: 1, value: 1, "aria-label": "First page" })); }; exports.FirstPage = FirstPage; var MiddlePage = function () { var page = React.useContext(context_1.MainContext).page; return (React.createElement(PaginationButton_1["default"], { active: true, title: page, value: page, "aria-label": "Page ".concat(page) })); }; exports.MiddlePage = MiddlePage; var LastPage = function () { var _a = React.useContext(context_1.MainContext), numberOfPages = _a.numberOfPages, page = _a.page; return (React.createElement(PaginationButton_1["default"], { active: numberOfPages === page, title: numberOfPages, value: numberOfPages, "aria-label": "Last page" }, numberOfPages > 99 ? React.createElement(React.Fragment, null, "99+") : undefined)); }; exports.LastPage = LastPage; var FirstThree = function () { var page = React.useContext(context_1.MainContext).page; return (React.createElement(React.Fragment, null, new Array(3).fill(1).map(function (_, i) { var itemValue = i + 1; var isActive = itemValue === page; return (React.createElement(PaginationButton_1["default"], { key: itemValue, active: itemValue === page, title: itemValue, value: itemValue, "aria-label": "Page ".concat(itemValue).concat(isActive ? ", current page" : "") })); }))); }; exports.FirstThree = FirstThree; var LastThree = function () { var _a = React.useContext(context_1.MainContext), numberOfPages = _a.numberOfPages, page = _a.page; return (React.createElement(React.Fragment, null, new Array(3) .fill(1) .map(function (_, i) { var itemValue = numberOfPages - i; var isActive = itemValue === page; return (React.createElement(PaginationButton_1["default"], { key: i, active: isActive, title: itemValue, value: itemValue, "aria-label": "Page ".concat(itemValue).concat(isActive ? ", current page" : "") })); }) .reverse())); }; exports.LastThree = LastThree; var SpacerInput = function () { return (React.createElement(PaginationButton_1["default"], { clickInput: true, "aria-label": "Input page number" }, React.createElement(React.Fragment, null, "..."))); }; exports.SpacerInput = SpacerInput; //# sourceMappingURL=fragments.js.map