lucid-ui
Version:
A UI component library from AppNexus.
48 lines • 2.54 kB
JavaScript
import React from 'react';
import createClass from 'create-react-class';
import { Paginator } from '../../../index';
export default createClass({
render: function render() {
return /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("p", null, "A paginator displaying a total count of objects."), /*#__PURE__*/React.createElement("section", null, /*#__PURE__*/React.createElement(Paginator, {
hasPageSizeSelector: true,
showTotalObjects: true,
totalCount: 12321313,
SingleSelect: {
DropMenu: {
direction: 'up'
}
}
}), /*#__PURE__*/React.createElement("p", null, "Total count is hidden if ", /*#__PURE__*/React.createElement("code", null, "totalCount"), " is not a valid number"), /*#__PURE__*/React.createElement(Paginator, {
hasPageSizeSelector: true,
showTotalObjects: true,
SingleSelect: {
DropMenu: {
direction: 'up'
}
}
})), /*#__PURE__*/React.createElement("section", null, /*#__PURE__*/React.createElement("p", null, "The label can be changed using ", /*#__PURE__*/React.createElement("code", null, "objectLabel"), " and", ' ', /*#__PURE__*/React.createElement("code", null, "objectLabelPlural")), /*#__PURE__*/React.createElement(Paginator, {
hasPageSizeSelector: true,
showTotalObjects: true,
totalCount: 1,
objectLabel: "singular object"
}), /*#__PURE__*/React.createElement(Paginator, {
hasPageSizeSelector: true,
showTotalObjects: true,
totalCount: 2,
objectLabelPlural: "is more than one"
}), /*#__PURE__*/React.createElement("p", null, /*#__PURE__*/React.createElement("code", null, "objectLabelPlural"), " will default to appending an \"s\" after ", /*#__PURE__*/React.createElement("code", null, "objectLabel"), "."), /*#__PURE__*/React.createElement(Paginator, {
hasPageSizeSelector: true,
showTotalObjects: true,
totalCount: 20,
objectLabel: "dog"
})), /*#__PURE__*/React.createElement("section", null, /*#__PURE__*/React.createElement("p", null, "Pass a custom formatter function as", ' ', /*#__PURE__*/React.createElement("code", null, "showTotalObjects(count)"), " to format the total count number."), /*#__PURE__*/React.createElement(Paginator, {
hasPageSizeSelector: true,
showTotalObjects: function showTotalObjects(count) {
return "--".concat(count, "--");
},
totalCount: 20,
objectLabel: "object",
objectLabelPlural: "objects"
})));
}
});