@vlsergey/react-bootstrap-pagetable
Version:
Complex solution to work with pageable data, including sorting, filtering, actions, changing displayed columns, etc.
22 lines (21 loc) • 1.45 kB
JavaScript
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
var tslib_1 = require("tslib");
var react_1 = tslib_1.__importStar(require("react"));
var Form_1 = tslib_1.__importDefault(require("react-bootstrap/Form"));
var ControlledContext_1 = require("./ControlledContext");
var PageSizeSelector = function (_a) {
var _b = _a.name, name = _b === void 0 ? 'size' : _b, etc = tslib_1.__rest(_a, ["name"]);
var _c = ControlledContext_1.useControlledContext(), fetchArgs = _c.fetchArgs, onFetchArgsChange = _c.onFetchArgsChange, size = _c.size;
var handleChange = react_1.useCallback(function (_a) {
var currentTarget = _a.currentTarget;
return onFetchArgsChange(tslib_1.__assign(tslib_1.__assign({}, fetchArgs), { size: Number(currentTarget.value) }));
}, [fetchArgs, onFetchArgsChange]);
return react_1.default.createElement(Form_1.default.Control, tslib_1.__assign({}, etc, { as: "select", name: name, onChange: handleChange, size: size, value: fetchArgs.size }),
react_1.default.createElement("option", { value: 5 }, "5"),
react_1.default.createElement("option", { value: 10 }, "10"),
react_1.default.createElement("option", { value: 25 }, "25"),
react_1.default.createElement("option", { value: 50 }, "50"),
react_1.default.createElement("option", { value: 100 }, "100"));
};
exports.default = react_1.default.memo(PageSizeSelector);