{"ast":null,"code":"var __jsx = React.createElement;\n// cSpell:words hellip\nimport React, { useCallback, useMemo } from 'react';\nimport { backgroundColor, borderColor, borderFocusedColor, em, primaryColor, sameBorder, size, textColor, textInvertColor, transitionProps } from '~/utils/style';\nimport styled from 'styled-components';\nvar height = em(36);\nvar Wrapper = styled.nav.withConfig({\n  displayName: \"Pagination__Wrapper\",\n  componentId: \"pj0gu-0\"\n})([\"display:flex;user-select:none;\"]);\nvar Ul = styled.ul.withConfig({\n  displayName: \"Pagination__Ul\",\n  componentId: \"pj0gu-1\"\n})([\"display:inline-flex;list-style:none;margin:0;padding:0;\"]);\nvar Li = styled.li.withConfig({\n  displayName: \"Pagination__Li\",\n  componentId: \"pj0gu-2\"\n})([\"list-style:none;margin-left:\", \";&:first-child{margin-left:0;}\"], em(10));\nvar A = styled.a.withConfig({\n  displayName: \"Pagination__A\",\n  componentId: \"pj0gu-3\"\n})([\"cursor:pointer;display:block;background-color:\", \";color:\", \";height:\", \";line-height:calc(\", \" - 2px);min-width:\", \";padding:0 \", \";text-align:center;\", \";\", \" &:hover{border-color:\", \";}\"], function (props) {\n  return props.current ? primaryColor : backgroundColor;\n}, function (props) {\n  return props.current ? textInvertColor : textColor;\n}, height, height, height, em(10), function (props) {\n  return sameBorder({\n    color: props.current ? primaryColor : borderColor,\n    radius: true\n  });\n}, transitionProps(['color', 'border-color', 'background-color']), function (props) {\n  return props.current ? primaryColor : borderFocusedColor;\n});\nvar Span = styled.span.withConfig({\n  displayName: \"Pagination__Span\",\n  componentId: \"pj0gu-4\"\n})([\"display:block;\", \" line-height:\", \";text-align:center;\"], size(height), height);\n\nvar Pagination = function Pagination(_ref) {\n  var page = _ref.page,\n      total = _ref.total,\n      className = _ref.className,\n      onChange = _ref.onChange;\n  var padding = 2;\n  var around = 2;\n  var startEllipsis = useMemo(function () {\n    return page - padding - around - 1 > 0;\n  }, [page]);\n  var endEllipsis = useMemo(function () {\n    return page + padding + around < total;\n  }, [page, total]);\n  var start = useMemo(function () {\n    return page - around - 1 <= 0 ? [] : Array.from(new Array(Math.min(padding, page - around - 1)), function (_v, i) {\n      return i + 1;\n    });\n  }, [page]);\n  var end = useMemo(function () {\n    return page + around >= total ? [] : Array.from(new Array(Math.min(padding, total - page - around)), function (_v, i) {\n      return total - padding + i + 1 + Math.max(padding - total + page + around, 0);\n    });\n  }, [page, total]);\n  var before = useMemo(function () {\n    return page - 1 <= 0 ? [] : Array.from(new Array(Math.min(around, page - 1)), function (_v, i) {\n      return page - around + i + Math.max(around - page + 1, 0);\n    });\n  }, [page]);\n  var after = useMemo(function () {\n    return page >= total ? [] : Array.from(new Array(Math.min(around, total - page)), function (_v, i) {\n      return page + i + 1;\n    });\n  }, [page, total]);\n  var genLink = useCallback(function (arr) {\n    return arr.map(function (i) {\n      return __jsx(Li, {\n        key: i\n      }, __jsx(A, {\n        onClick: function onClick() {\n          return onChange === null || onChange === void 0 ? void 0 : onChange(i);\n        }\n      }, i));\n    });\n  }, [onChange]);\n\n  var hellip = __jsx(Li, null, __jsx(Span, null, \"\\u2026\"));\n\n  return __jsx(Wrapper, {\n    className: className\n  }, __jsx(Ul, null, genLink(start), startEllipsis && hellip, genLink(before), __jsx(Li, null, __jsx(A, {\n    current: true\n  }, page)), genLink(after), endEllipsis && hellip, genLink(end)));\n};\n\nexport default Pagination;","map":null,"metadata":{},"sourceType":"module"}