@kdcloudjs/kdesign 1.0.2

package/lib/notification-base/notification.js

@@ -0,0 +1,110 @@
+"use strict";
+
+var _typeof = require("@babel/runtime-corejs3/helpers/typeof");
+
+var _WeakMap = require("@babel/runtime-corejs3/core-js-stable/weak-map");
+
+var _Object$getOwnPropertyDescriptor = require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptor");
+
+var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/toConsumableArray"));
+
+var _extends2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/extends"));
+
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/slicedToArray"));
+
+var _concat = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/concat"));
+
+var _map = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/map"));
+
+var _splice = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/splice"));
+
+var _filter = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/filter"));
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _notice = _interopRequireDefault(require("./notice"));
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof _WeakMap !== "function") return null; var cacheBabelInterop = new _WeakMap(); var cacheNodeInterop = new _WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && _Object$getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? _Object$getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+var seed = 0;
+var now = Date.now();
+
+function getUuid() {
+  var _context;
+
+  var id = seed;
+  seed += 1;
+  return (0, _concat.default)(_context = "msg_".concat(now, "_")).call(_context, id);
+}
+
+var Notification = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
+  var placement = props.placement;
+
+  var _useState = (0, _react.useState)([]),
+      _useState2 = (0, _slicedToArray2.default)(_useState, 2),
+      notices = _useState2[0],
+      setNotices = _useState2[1];
+
+  (0, _react.useImperativeHandle)(ref, function () {
+    return {
+      add: add,
+      remove: remove,
+      placement: placement,
+      notices: notices
+    };
+  }, [notices]);
+
+  var add = function add(addProps) {
+    var key = addProps.key || getUuid();
+    var notice = (0, _extends2.default)((0, _extends2.default)({}, addProps), {
+      key: key
+    });
+    var pns = (0, _toConsumableArray2.default)(notices);
+    var updatedNotices = (0, _concat.default)(pns).call(pns);
+    var noticeIndex = (0, _map.default)(pns).call(pns, function (v) {
+      return v.key;
+    }).indexOf(key);
+
+    if (~noticeIndex) {
+      (0, _splice.default)(updatedNotices).call(updatedNotices, noticeIndex, 1, notice);
+    } else {
+      updatedNotices.push(notice);
+    }
+
+    setNotices(updatedNotices);
+  };
+
+  var remove = function remove(key) {
+    var filter = (0, _filter.default)(notices).call(notices, function (notice) {
+      return notice.key !== key;
+    });
+    setNotices(filter);
+  };
+
+  var _onClose = function onClose(notice) {
+    remove(notice.key || '');
+    notice.onClose && notice.onClose(notice.key);
+  };
+
+  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, (0, _map.default)(notices).call(notices, function (notice) {
+    return /*#__PURE__*/_react.default.createElement(_notice.default, (0, _extends2.default)({}, notice, {
+      key: notice.key,
+      onClose: function onClose() {
+        return _onClose(notice);
+      }
+    }));
+  }));
+});
+
+Notification.displayName = 'Notification';
+var _default = Notification;
+exports.default = _default;

package/lib/pagination/index.d.ts

@@ -0,0 +1,3 @@
+import Pagination from './pagination';
+export { pageType, IPaginationProps } from './pagination';
+export default Pagination;

package/lib/pagination/index.js

@@ -0,0 +1,13 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _pagination = _interopRequireDefault(require("./pagination"));
+
+var _default = _pagination.default;
+exports.default = _default;

package/lib/pagination/pagination.d.ts

@@ -0,0 +1,29 @@
+import * as React from 'react';
+import { DropDownProps } from '../dropdown';
+export declare const PageTypes: ["basic", "bill", "simple", "less", "nicety"];
+export declare type pageType = typeof PageTypes[number];
+export interface IPaginationProps {
+    total?: number;
+    current?: number;
+    pageSize?: number;
+    prefixCls?: string;
+    className?: string;
+    disabled?: boolean;
+    bordered?: boolean;
+    pageType?: pageType;
+    showTitle?: boolean;
+    defaultCurrent?: number;
+    defaultPageSize?: number;
+    showSizeChanger?: boolean;
+    hideOnSinglePage?: boolean;
+    style?: React.CSSProperties;
+    dropdownProps?: DropDownProps;
+    pageSizeOptions?: Array<string>;
+    onChange?: (page: number, pageSize?: number) => void;
+    showQuickJumper?: boolean | {
+        goButton?: React.ReactNode;
+    };
+    onShowSizeChange?: (current: number, size: number) => void;
+}
+declare const Pagination: React.FC<IPaginationProps>;
+export default Pagination;

package/lib/pagination/pagination.js

@@ -0,0 +1,465 @@
+"use strict";
+
+var _typeof = require("@babel/runtime-corejs3/helpers/typeof");
+
+var _WeakMap = require("@babel/runtime-corejs3/core-js-stable/weak-map");
+
+var _Object$getOwnPropertyDescriptor = require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptor");
+
+var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = exports.PageTypes = void 0;
+
+var _concat = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/concat"));
+
+var _slice = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/slice"));
+
+var _from = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/array/from"));
+
+var _keys = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/keys"));
+
+var _map = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/map"));
+
+var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/toConsumableArray"));
+
+var _extends2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/extends"));
+
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/defineProperty"));
+
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/slicedToArray"));
+
+var React = _interopRequireWildcard(require("react"));
+
+var _classnames = _interopRequireDefault(require("classnames"));
+
+var _ConfigContext = _interopRequireDefault(require("../config-provider/ConfigContext"));
+
+var _utils = require("../_utils");
+
+var _icon = _interopRequireDefault(require("../icon"));
+
+var _dropdown = _interopRequireDefault(require("../dropdown"));
+
+var _devwarning = _interopRequireDefault(require("../_utils/devwarning"));
+
+var _type = require("../_utils/type");
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof _WeakMap !== "function") return null; var cacheBabelInterop = new _WeakMap(); var cacheNodeInterop = new _WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && _Object$getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? _Object$getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+/* eslint-disable react/jsx-no-comment-textnodes */
+var PageTypes = (0, _type.tuple)('basic', 'bill', 'simple', 'less', 'nicety');
+exports.PageTypes = PageTypes;
+
+var Pagination = function Pagination(props) {
+  var _context4;
+
+  var _React$useContext = React.useContext(_ConfigContext.default),
+      getPrefixCls = _React$useContext.getPrefixCls,
+      pkgPrefixCls = _React$useContext.prefixCls,
+      userDefaultProps = _React$useContext.compDefaultProps,
+      locale = _React$useContext.locale;
+
+  var paginationLangMsg = locale.getCompLangMsg({
+    componentName: 'Pagination'
+  }); // 属性需要合并一遍用户定义的默认属性
+
+  var _getCompProps = (0, _utils.getCompProps)('Pagination', userDefaultProps, props),
+      style = _getCompProps.style,
+      total = _getCompProps.total,
+      current = _getCompProps.current,
+      pageSize = _getCompProps.pageSize,
+      disabled = _getCompProps.disabled,
+      onChange = _getCompProps.onChange,
+      pageType = _getCompProps.pageType,
+      bordered = _getCompProps.bordered,
+      showTitle = _getCompProps.showTitle,
+      className = _getCompProps.className,
+      dropdownProps = _getCompProps.dropdownProps,
+      defaultCurrent = _getCompProps.defaultCurrent,
+      showQuickJumper = _getCompProps.showQuickJumper,
+      defaultPageSize = _getCompProps.defaultPageSize,
+      pageSizeOptions = _getCompProps.pageSizeOptions,
+      showSizeChanger = _getCompProps.showSizeChanger,
+      onShowSizeChange = _getCompProps.onShowSizeChange,
+      hideOnSinglePage = _getCompProps.hideOnSinglePage,
+      customPrefixcls = _getCompProps.prefixCls;
+
+  (0, _devwarning.default)(PageTypes.indexOf(pageType) === -1, 'Pagination', "cannot found pageType '".concat(pageType, "'")); // className前缀
+
+  var prefixCls = getPrefixCls(pkgPrefixCls, 'pagination', customPrefixcls); // 每页显示的记录条数
+
+  var _React$useState = React.useState(pageSize || defaultPageSize),
+      _React$useState2 = (0, _slicedToArray2.default)(_React$useState, 2),
+      size = _React$useState2[0],
+      setSize = _React$useState2[1];
+
+  React.useEffect(function () {
+    pageSize !== undefined && setSize(pageSize);
+  }, [pageSize]); // 总页数
+
+  var totalPage = Math.max(Math.ceil(total / size), 1); // 当前页码
+
+  var initPage = Math.min(totalPage, current || defaultCurrent);
+
+  var _React$useState3 = React.useState(Math.max(initPage, 1)),
+      _React$useState4 = (0, _slicedToArray2.default)(_React$useState3, 2),
+      page = _React$useState4[0],
+      setPage = _React$useState4[1];
+
+  React.useEffect(function () {
+    current !== undefined && setPage(current);
+  }, [current]); // 输入的页码
+
+  var _React$useState5 = React.useState(undefined),
+      _React$useState6 = (0, _slicedToArray2.default)(_React$useState5, 2),
+      inputPage = _React$useState6[0],
+      setInputPage = _React$useState6[1]; // 是否显示pageSize切换器
+
+
+  var showSizeSelector = total > 50 ? true : showSizeChanger;
+  var defaultShowQuickJumper = pageType !== 'bill';
+  var showJumper = showQuickJumper === undefined ? defaultShowQuickJumper : showQuickJumper; // pageSize切换器是否展开
+
+  var _React$useState7 = React.useState(false),
+      _React$useState8 = (0, _slicedToArray2.default)(_React$useState7, 2),
+      isOpen = _React$useState8[0],
+      setIsOpen = _React$useState8[1]; // 切换pageSize
+
+
+  var handleChangeSize = function handleChangeSize(key) {
+    var currentSize = Number(key);
+
+    if (currentSize !== size) {
+      if (pageSize === undefined) setSize(currentSize);
+      var currentPage = Math.min(Math.ceil(total / Number(currentSize)), page);
+      changePage(currentPage, currentSize);
+      onShowSizeChange && onShowSizeChange(currentPage, currentSize);
+    }
+
+    setIsOpen(false);
+  }; // 输入页码
+
+
+  var handleChangeCurrentPage = function handleChangeCurrentPage(e) {
+    return setInputPage(e.target.value);
+  }; // 回车确定页码
+
+
+  var handleKeyUp = function handleKeyUp(e) {
+    if (e.key === 'Enter') handleConfirmCurrentPage();
+  }; // 页码输入框回车或者失去焦点确定翻到输入的页码
+
+
+  var handleConfirmCurrentPage = function handleConfirmCurrentPage() {
+    if (inputPage !== undefined) {
+      // 正整数正则表达式
+      var inputReg = new RegExp("^-?\\d+$");
+
+      if (inputReg.test(inputPage)) {
+        if (Number(inputPage) < 1) changePage(1);else if (Number(inputPage) > totalPage) changePage(totalPage);else changePage(Number(inputPage));
+      }
+
+      setInputPage(undefined);
+    }
+  }; // 翻页
+
+
+  var changePage = function changePage(page, pageSize) {
+    current === undefined && setPage(page);
+    onChange && onChange(page, pageSize || size);
+  }; // 翻到上一页
+
+
+  var handlePrev = function handlePrev() {
+    return changePage(page - 1);
+  }; // 翻到下一页
+
+
+  var handleNext = function handleNext() {
+    return changePage(page + 1);
+  }; // 翻到第一页
+
+
+  var handleFirst = function handleFirst() {
+    return changePage(1);
+  }; // 翻到最后一页
+
+
+  var handleLast = function handleLast() {
+    return changePage(totalPage);
+  }; // 向前跳转
+
+
+  var jumpPrev = function jumpPrev() {
+    return changePage(page - 5 || 1);
+  }; // 向后跳转
+
+
+  var jumpNext = function jumpNext() {
+    return changePage(page + 5 < totalPage ? page + 5 : totalPage);
+  };
+
+  var itemAttr = function itemAttr(prefix, title, active) {
+    var _context, _classNames;
+
+    return {
+      className: (0, _classnames.default)((_classNames = {}, (0, _defineProperty2.default)(_classNames, (0, _concat.default)(_context = "".concat(prefixCls, "-")).call(_context, prefix), true), (0, _defineProperty2.default)(_classNames, "bordered", bordered), (0, _defineProperty2.default)(_classNames, "active", active), _classNames)),
+      title: showTitle ? title : undefined
+    };
+  }; // 生成元素是连续数字的数组
+
+
+  function genArray(start, end) {
+    var _context2, _context3;
+
+    return (0, _slice.default)(_context2 = (0, _from.default)((0, _keys.default)(_context3 = Array(end + 1)).call(_context3))).call(_context2, start);
+  }
+
+  function dropdownVisibleChange(visible) {
+    setIsOpen(visible);
+
+    if (dropdownProps && typeof dropdownProps.onVisibleChange === 'function') {
+      dropdownProps.onVisibleChange(visible);
+    }
+  }
+
+  var sizeOptions = /*#__PURE__*/React.createElement(_dropdown.default.Menu, null, (0, _map.default)(pageSizeOptions).call(pageSizeOptions, function (size) {
+    return /*#__PURE__*/React.createElement(_dropdown.default.Item, {
+      key: size
+    }, pageType === 'nicety' ? size : locale.getLangMsg('Pagination', 'perPage', {
+      size: size
+    }));
+  }));
+  var normalPagination = /*#__PURE__*/React.createElement("div", {
+    className: (0, _classnames.default)(prefixCls, className),
+    style: style
+  }, pageType === 'basic' && /*#__PURE__*/React.createElement("span", {
+    className: "".concat(prefixCls, "-total")
+  }, locale.getLangMsg('Pagination', 'total', {
+    total: totalPage
+  })), showJumper && /*#__PURE__*/React.createElement("span", {
+    className: "".concat(prefixCls, "-current")
+  }, locale.getLangMsg('Pagination', 'order', {
+    order: /*#__PURE__*/React.createElement("input", {
+      type: "text",
+      disabled: disabled,
+      onKeyUp: handleKeyUp,
+      onBlur: handleConfirmCurrentPage,
+      onChange: handleChangeCurrentPage,
+      className: "".concat(prefixCls, "-current-input"),
+      value: inputPage === undefined ? page : inputPage
+    })
+  })), /*#__PURE__*/React.createElement("ul", {
+    className: "".concat(prefixCls, "-action")
+  }, /*#__PURE__*/React.createElement("li", (0, _extends2.default)({}, itemAttr('action-item', paginationLangMsg.first)), /*#__PURE__*/React.createElement("button", {
+    onClick: handleFirst,
+    disabled: page === 1 || disabled
+  }, /*#__PURE__*/React.createElement(_icon.default, {
+    type: "first"
+  }))), /*#__PURE__*/React.createElement("li", (0, _extends2.default)({}, itemAttr('action-item', paginationLangMsg.prevPage)), /*#__PURE__*/React.createElement("button", {
+    onClick: handlePrev,
+    disabled: page === 1 || disabled
+  }, /*#__PURE__*/React.createElement(_icon.default, {
+    type: "arrow-left"
+  }))), /*#__PURE__*/React.createElement("li", (0, _extends2.default)({}, itemAttr('action-item', paginationLangMsg.nextPage)), /*#__PURE__*/React.createElement("button", {
+    onClick: handleNext,
+    disabled: page === totalPage || disabled
+  }, /*#__PURE__*/React.createElement(_icon.default, {
+    type: "arrow-right"
+  }))), /*#__PURE__*/React.createElement("li", (0, _extends2.default)({}, itemAttr('action-item', paginationLangMsg.last)), /*#__PURE__*/React.createElement("button", {
+    onClick: handleLast,
+    disabled: page === totalPage || disabled
+  }, /*#__PURE__*/React.createElement(_icon.default, {
+    type: "last"
+  })))), showSizeSelector && /*#__PURE__*/React.createElement("div", {
+    className: "".concat(prefixCls, "-selector")
+  }, /*#__PURE__*/React.createElement(_dropdown.default, (0, _extends2.default)({
+    selectable: true,
+    defaultKey: size,
+    menu: sizeOptions,
+    trigger: "click",
+    disabled: disabled,
+    popperStyle: {
+      minWidth: 67
+    },
+    onItemClick: handleChangeSize,
+    getPopupContainer: function getPopupContainer(triggerNode) {
+      return triggerNode === null || triggerNode === void 0 ? void 0 : triggerNode.parentElement;
+    }
+  }, dropdownProps, {
+    onVisibleChange: dropdownVisibleChange
+  }), /*#__PURE__*/React.createElement("button", {
+    className: "".concat(prefixCls, "-selector-size")
+  }, /*#__PURE__*/React.createElement("span", null, locale.getLangMsg('Pagination', 'perPage', {
+    size: size
+  })), /*#__PURE__*/React.createElement(_icon.default, {
+    type: "arrow-down",
+    className: (0, _classnames.default)("".concat(prefixCls, "-dropdown-icon"), (0, _defineProperty2.default)({}, "".concat(prefixCls, "-dropdown-icon-open"), isOpen))
+  })))));
+  var simplePagination = /*#__PURE__*/React.createElement("ul", {
+    className: (0, _classnames.default)(prefixCls, 'simple', {
+      bordered: bordered,
+      disabled: disabled
+    }, className),
+    style: style
+  }, /*#__PURE__*/React.createElement("li", (0, _extends2.default)({}, itemAttr('item', paginationLangMsg.prevPage)), /*#__PURE__*/React.createElement("button", {
+    onClick: handlePrev,
+    disabled: page === 1 || disabled
+  }, /*#__PURE__*/React.createElement(_icon.default, {
+    type: "arrow-left"
+  }))), /*#__PURE__*/React.createElement("li", (0, _extends2.default)({}, itemAttr('item', (0, _concat.default)(_context4 = "".concat(page, "/")).call(_context4, totalPage))), /*#__PURE__*/React.createElement("span", {
+    className: "".concat(prefixCls, "-current")
+  }, showJumper ? /*#__PURE__*/React.createElement("input", {
+    type: "text",
+    disabled: disabled,
+    onKeyUp: handleKeyUp,
+    onBlur: handleConfirmCurrentPage,
+    onChange: handleChangeCurrentPage,
+    className: "".concat(prefixCls, "-current-input"),
+    value: inputPage === undefined ? page : inputPage
+  }) : page), "/ ", /*#__PURE__*/React.createElement("span", {
+    className: "".concat(prefixCls, "-total")
+  }, totalPage)), /*#__PURE__*/React.createElement("li", (0, _extends2.default)({}, itemAttr('item', paginationLangMsg.nextPage)), /*#__PURE__*/React.createElement("button", {
+    onClick: handleNext,
+    disabled: page === totalPage || disabled
+  }, /*#__PURE__*/React.createElement(_icon.default, {
+    type: "arrow-right"
+  }))));
+  var lessPages = genArray(1, totalPage);
+  var lessPagination = /*#__PURE__*/React.createElement("div", {
+    className: (0, _classnames.default)(prefixCls, 'less', {
+      bordered: bordered,
+      disabled: disabled
+    }, className),
+    style: style
+  }, /*#__PURE__*/React.createElement("ul", {
+    className: "".concat(prefixCls, "-pages")
+  }, /*#__PURE__*/React.createElement("li", (0, _extends2.default)({}, itemAttr('pages-item', paginationLangMsg.prevPage)), /*#__PURE__*/React.createElement("button", {
+    onClick: handlePrev,
+    disabled: page === 1 || disabled
+  }, /*#__PURE__*/React.createElement(_icon.default, {
+    type: "arrow-left"
+  }))), (0, _map.default)(lessPages).call(lessPages, function (item, index) {
+    return /*#__PURE__*/React.createElement("li", (0, _extends2.default)({
+      key: index
+    }, itemAttr('pages-item', String(item), item === page)), /*#__PURE__*/React.createElement("button", {
+      onClick: function onClick() {
+        return changePage(item);
+      },
+      disabled: disabled
+    }, item));
+  }), /*#__PURE__*/React.createElement("li", (0, _extends2.default)({}, itemAttr('pages-item', paginationLangMsg.nextPage)), /*#__PURE__*/React.createElement("button", {
+    onClick: handleNext,
+    disabled: page === totalPage || disabled
+  }, /*#__PURE__*/React.createElement(_icon.default, {
+    type: "arrow-right"
+  })))));
+  var nicetyPages = lessPages;
+
+  if (totalPage >= 8) {
+    nicetyPages.length = 0;
+
+    if (page < 5) {
+      nicetyPages.push.apply(nicetyPages, (0, _toConsumableArray2.default)(genArray(1, 5)));
+    } else if (page > totalPage - 4) {
+      nicetyPages.push.apply(nicetyPages, (0, _toConsumableArray2.default)(genArray(totalPage - 4, totalPage)));
+    } else {
+      nicetyPages.push.apply(nicetyPages, (0, _toConsumableArray2.default)(genArray(page - 2, page + 2)));
+    }
+
+    page <= totalPage - 4 && nicetyPages.push('>>', totalPage);
+    page >= 5 && nicetyPages.unshift(1, '<<');
+  }
+
+  var nicetyPagination = /*#__PURE__*/React.createElement("div", {
+    className: (0, _classnames.default)(prefixCls, 'nicety', {
+      bordered: bordered,
+      disabled: disabled
+    }, className),
+    style: style
+  }, /*#__PURE__*/React.createElement("ul", {
+    className: "".concat(prefixCls, "-pages")
+  }, /*#__PURE__*/React.createElement("li", (0, _extends2.default)({}, itemAttr('pages-item', paginationLangMsg.prevPage)), /*#__PURE__*/React.createElement("button", {
+    onClick: handlePrev,
+    disabled: page === 1 || disabled
+  }, /*#__PURE__*/React.createElement(_icon.default, {
+    type: "arrow-left"
+  }))), (0, _map.default)(nicetyPages).call(nicetyPages, function (item, index) {
+    var handleChangePage = function handleChangePage() {
+      return typeof item === 'string' ? item === '<<' ? jumpPrev() : jumpNext() : changePage(item);
+    };
+
+    var pageText = typeof item === 'string' ? '...' : item;
+    var jumperIconType = item === '<<' ? 'double-arrow-left' : 'double-arrow-right';
+    var title = typeof item === 'string' ? paginationLangMsg[item === '<<' ? 'forward' : 'backward'] : String(item);
+    return /*#__PURE__*/React.createElement("li", (0, _extends2.default)({
+      key: index
+    }, itemAttr('pages-item', title, item === page)), /*#__PURE__*/React.createElement("button", {
+      onClick: handleChangePage,
+      disabled: disabled
+    }, pageText, typeof item === 'string' && /*#__PURE__*/React.createElement(_icon.default, {
+      type: jumperIconType,
+      className: "".concat(prefixCls, "-pages-jumper-icon")
+    })));
+  }), /*#__PURE__*/React.createElement("li", (0, _extends2.default)({}, itemAttr('pages-item', paginationLangMsg.nextPage)), /*#__PURE__*/React.createElement("button", {
+    onClick: handleNext,
+    disabled: page === totalPage || disabled
+  }, /*#__PURE__*/React.createElement(_icon.default, {
+    type: "arrow-right"
+  })))), showJumper && /*#__PURE__*/React.createElement("div", {
+    className: "".concat(prefixCls, "-jumper")
+  }, /*#__PURE__*/React.createElement("input", {
+    type: "text",
+    disabled: disabled,
+    onKeyUp: handleKeyUp,
+    onBlur: handleConfirmCurrentPage,
+    onChange: handleChangeCurrentPage,
+    className: "".concat(prefixCls, "-jumper-input"),
+    value: inputPage === undefined ? '' : inputPage
+  }), /*#__PURE__*/React.createElement("button", {
+    className: "".concat(prefixCls, "-jumper-button"),
+    disabled: disabled,
+    onClick: handleConfirmCurrentPage
+  }, "GO")), showSizeSelector && /*#__PURE__*/React.createElement("div", {
+    className: "".concat(prefixCls, "-options")
+  }, locale.getLangMsg('Pagination', 'perPage', {
+    size: /*#__PURE__*/React.createElement(_dropdown.default, (0, _extends2.default)({
+      selectable: true,
+      trigger: "click",
+      defaultKey: size,
+      menu: sizeOptions,
+      disabled: disabled,
+      popperStyle: {
+        minWidth: 67
+      },
+      onItemClick: handleChangeSize,
+      getPopupContainer: function getPopupContainer(triggerNode) {
+        return triggerNode === null || triggerNode === void 0 ? void 0 : triggerNode.parentElement;
+      }
+    }, dropdownProps, {
+      onVisibleChange: dropdownVisibleChange
+    }), /*#__PURE__*/React.createElement("button", {
+      className: "".concat(prefixCls, "-options-size")
+    }, size, /*#__PURE__*/React.createElement(_icon.default, {
+      type: "arrow-down",
+      className: (0, _classnames.default)("".concat(prefixCls, "-dropdown-icon"), (0, _defineProperty2.default)({}, "".concat(prefixCls, "-dropdown-icon-open"), isOpen))
+    })))
+  })));
+  var mapPagination = {
+    basic: normalPagination,
+    bill: normalPagination,
+    simple: simplePagination,
+    less: lessPagination,
+    nicety: nicetyPagination
+  };
+  return hideOnSinglePage && totalPage === 1 ? null : mapPagination[pageType] || mapPagination.basic;
+};
+
+Pagination.displayName = 'Pagination';
+var _default = Pagination;
+exports.default = _default;

package/lib/pagination/style/css.js

@@ -0,0 +1,5 @@
+"use strict";
+
+require("../../style/index.css");
+
+require("./index.css");