@atlaskit/dynamic-table
Version:
A dynamic table displays rows of data with built-in pagination, sorting, and re-ordering functionality.
35 lines • 1.29 kB
JavaScript
import _defineProperty from "@babel/runtime/helpers/defineProperty";
import React from 'react';
import Pagination from '@atlaskit/pagination';
export default class ManagedPagination extends React.Component {
constructor(...args) {
super(...args);
_defineProperty(this, "onChange", (_event, newValue, analyticsEvent) => {
this.props.onChange(newValue, analyticsEvent);
});
}
render() {
const {
total,
value = 1,
i18n,
testId,
isDisabled
} = this.props;
const pages = [...Array(total)].map((_, index) => index + 1);
// Pagination accepts array now thus selectedIndex starts with 0
// So, we are substracting value by one thus not breaking dynamic table
const selectedIndex = value - 1;
return /*#__PURE__*/React.createElement(Pagination, {
selectedIndex: selectedIndex,
isDisabled: isDisabled,
label: i18n === null || i18n === void 0 ? void 0 : i18n.label,
nextLabel: i18n === null || i18n === void 0 ? void 0 : i18n.next,
previousLabel: i18n === null || i18n === void 0 ? void 0 : i18n.prev,
pageLabel: i18n === null || i18n === void 0 ? void 0 : i18n.pageLabel,
onChange: this.onChange,
pages: pages,
testId: testId && `${testId}--pagination`
});
}
}