UNPKG

kea-react

Version:

Componentes comunes de react

100 lines (99 loc) 4.79 kB
"use strict"; var __extends = (this && this.__extends) || (function () { var extendStatics = Object.setPrototypeOf || ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) || function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; }; return function (d, b) { extendStatics(d, b); function __() { this.constructor = d; } d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __()); }; })(); var __assign = (this && this.__assign) || Object.assign || function(t) { for (var s, i = 1, n = arguments.length; i < n; i++) { s = arguments[i]; for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p]; } return t; }; var __read = (this && this.__read) || function (o, n) { var m = typeof Symbol === "function" && o[Symbol.iterator]; if (!m) return o; var i = m.call(o), r, ar = [], e; try { while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value); } catch (error) { e = { error: error }; } finally { try { if (r && !r.done && (m = i["return"])) m.call(i); } finally { if (e) throw e.error; } } return ar; }; var __spread = (this && this.__spread) || function () { for (var ar = [], i = 0; i < arguments.length; i++) ar = ar.concat(__read(arguments[i])); return ar; }; Object.defineProperty(exports, "__esModule", { value: true }); var React = require("react"); var selector = require("../../selector"); function getPageValues(itemsCount, value) { var commonPageSizes = [10, 15, 30, 50, 100, 200, 500, 1000, 2000, 5000, 10000]; var pageSizes = __spread(commonPageSizes.filter(function (x) { return x < itemsCount; }), [itemsCount]); var selectedSize = (function () { var filtrados = pageSizes.filter(function (x) { return x <= value.selectedPageSize; }); return filtrados[filtrados.length - 1] || itemsCount; })(); var pageCount = Math.ceil(itemsCount / selectedSize); var selectedPage = Math.min(value.selectedPage, pageCount - 1); return { itemsCount: itemsCount, pageCount: pageCount, selectedPage: selectedPage, selectedSize: selectedSize, pageSizes: pageSizes }; } exports.getPageValues = getPageValues; var PaginatorSelector = /** @class */ (function (_super) { __extends(PaginatorSelector, _super); function PaginatorSelector() { return _super !== null && _super.apply(this, arguments) || this; } PaginatorSelector.prototype.render = function () { var _this = this; var values = getPageValues(this.props.itemsCount, this.props.value); return (React.createElement("span", null, React.createElement(PageSelector, { count: values.pageCount, selected: values.selectedPage, onValueChanged: function (page) { return _this.props.onChange(__assign({}, _this.props.value, { selectedPage: page })); } }), React.createElement("div", { className: "pull-right" }, React.createElement(SizeSelector, { pageSizes: values.pageSizes, value: values.selectedSize, onChange: function (size) { return _this.props.onChange(__assign({}, _this.props.value, { selectedPageSize: size })); } })))); }; return PaginatorSelector; }(React.PureComponent)); exports.PaginatorSelector = PaginatorSelector; /**Un selector de pagina */ var PageSelector = /** @class */ (function (_super) { __extends(PageSelector, _super); function PageSelector() { return _super !== null && _super.apply(this, arguments) || this; } PageSelector.prototype.render = function () { var _this = this; var paginas = selector.Rango(this.props.count).map(function (x) { return ({ value: x, label: x + 1, tooltip: "página " + (x + 1) }); }); return (React.createElement(selector.PaginatedButtonSelector, { items: paginas, value: this.props.selected, onChange: function (value) { return _this.props.onValueChanged(value); } })); }; return PageSelector; }(React.PureComponent)); var SizeSelector = /** @class */ (function (_super) { __extends(SizeSelector, _super); function SizeSelector() { return _super !== null && _super.apply(this, arguments) || this; } SizeSelector.prototype.render = function () { return (React.createElement(selector.ButtonSelector, { items: this.props.pageSizes.map(function (x) { return ({ value: x, label: x, tooltip: x + " elementos por página" }); }), value: this.props.value, onChange: this.props.onChange })); }; return SizeSelector; }(React.PureComponent));