@helpdice/ui 2.5.8-beta.0 → 2.5.8

package/dist/pagination/index.js

@@ -4,6 +4,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var React = require('react');
 var theme = require('@helpdice/theme');
+var jsxRuntime = require('react/jsx-runtime');
 
 function _arrayLikeToArray(r, a) {
   (null == a || a > r.length) && (a = r.length);
@@ -64,14 +65,13 @@ function _createForOfIteratorHelper(r, e) {
     }
   };
 }
-function _extends() {
-  return _extends = Object.assign ? Object.assign.bind() : function (n) {
-    for (var e = 1; e < arguments.length; e++) {
-      var t = arguments[e];
-      for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
-    }
-    return n;
-  }, _extends.apply(null, arguments);
+function _defineProperty(e, r, t) {
+  return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, {
+    value: t,
+    enumerable: true,
+    configurable: true,
+    writable: true
+  }) : e[r] = t, e;
 }
 function _iterableToArray(r) {
   if ("undefined" != typeof Symbol && null != r[Symbol.iterator] || null != r["@@iterator"]) return Array.from(r);
@@ -109,6 +109,27 @@ function _nonIterableRest() {
 function _nonIterableSpread() {
   throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
 }
+function ownKeys(e, r) {
+  var t = Object.keys(e);
+  if (Object.getOwnPropertySymbols) {
+    var o = Object.getOwnPropertySymbols(e);
+    r && (o = o.filter(function (r) {
+      return Object.getOwnPropertyDescriptor(e, r).enumerable;
+    })), t.push.apply(t, o);
+  }
+  return t;
+}
+function _objectSpread2(e) {
+  for (var r = 1; r < arguments.length; r++) {
+    var t = null != arguments[r] ? arguments[r] : {};
+    r % 2 ? ownKeys(Object(t), true).forEach(function (r) {
+      _defineProperty(e, r, t[r]);
+    }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) {
+      Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r));
+    });
+  }
+  return e;
+}
 function _objectWithoutProperties(e, t) {
   if (null == e) return {};
   var o,
@@ -135,6 +156,20 @@ function _slicedToArray(r, e) {
 function _toConsumableArray(r) {
   return _arrayWithoutHoles(r) || _iterableToArray(r) || _unsupportedIterableToArray(r) || _nonIterableSpread();
 }
+function _toPrimitive(t, r) {
+  if ("object" != typeof t || !t) return t;
+  var e = t[Symbol.toPrimitive];
+  if (void 0 !== e) {
+    var i = e.call(t, r);
+    if ("object" != typeof i) return i;
+    throw new TypeError("@@toPrimitive must return a primitive value.");
+  }
+  return ("string" === r ? String : Number)(t);
+}
+function _toPropertyKey(t) {
+  var i = _toPrimitive(t, "string");
+  return "symbol" == typeof i ? i : i + "";
+}
 function _unsupportedIterableToArray(r, a) {
   if (r) {
     if ("string" == typeof r) return _arrayLikeToArray(r, a);
@@ -743,16 +778,19 @@ var PaginationItem = function PaginationItem(_ref) {
     if (disabled) return;
     onClick && onClick(event);
   };
-  return /*#__PURE__*/React.createElement("li", {
-    className: _JSXStyle.dynamic([["3250617587", [theme$1.palette.accents_7, theme$1.layout.radius, theme$1.palette.background, hover, theme$1.palette.accents_6, theme$1.palette.background, theme$1.expressiveness.shadowSmall, activeHover, theme$1.expressiveness.shadowMedium, theme$1.palette.accents_4, theme$1.palette.accents_2]]])
-  }, /*#__PURE__*/React.createElement("button", _extends({
-    onClick: clickHandler
-  }, props, {
-    className: _JSXStyle.dynamic([["3250617587", [theme$1.palette.accents_7, theme$1.layout.radius, theme$1.palette.background, hover, theme$1.palette.accents_6, theme$1.palette.background, theme$1.expressiveness.shadowSmall, activeHover, theme$1.expressiveness.shadowMedium, theme$1.palette.accents_4, theme$1.palette.accents_2]]]) + " " + (props && props.className != null && props.className || classes || "")
-  }), children), /*#__PURE__*/React.createElement(_JSXStyle, {
-    id: "3250617587",
-    dynamic: [theme$1.palette.accents_7, theme$1.layout.radius, theme$1.palette.background, hover, theme$1.palette.accents_6, theme$1.palette.background, theme$1.expressiveness.shadowSmall, activeHover, theme$1.expressiveness.shadowMedium, theme$1.palette.accents_4, theme$1.palette.accents_2]
-  }, "li.__jsx-style-dynamic-selector{margin-right:0.428em;display:inline-block;}button.__jsx-style-dynamic-selector{border:none;display:-webkit-inline-box;display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;box-sizing:border-box;text-transform:capitalize;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;white-space:nowrap;text-align:center;vertical-align:middle;box-shadow:none;outline:none;height:var(--pagination-size);min-width:var(--pagination-size);font-size:inherit;cursor:pointer;color:".concat(theme$1.palette.accents_7, ";border-radius:").concat(theme$1.layout.radius, ";background-color:").concat(theme$1.palette.background, ";-webkit-transition:all linear 200ms 0ms;transition:all linear 200ms 0ms;}button.__jsx-style-dynamic-selector:hover{background-color:").concat(hover, ";}.active.__jsx-style-dynamic-selector{font-weight:bold;background-color:").concat(theme$1.palette.accents_6, ";color:").concat(theme$1.palette.background, ";box-shadow:").concat(theme$1.expressiveness.shadowSmall, ";}.active.__jsx-style-dynamic-selector:hover{background-color:").concat(activeHover, ";box-shadow:").concat(theme$1.expressiveness.shadowMedium, ";}.disabled.__jsx-style-dynamic-selector{color:").concat(theme$1.palette.accents_4, ";cursor:not-allowed;}.disabled.__jsx-style-dynamic-selector:hover{background-color:").concat(theme$1.palette.accents_2, ";}button.__jsx-style-dynamic-selector svg{width:1.3em;height:1.3em;}")));
+  return /*#__PURE__*/jsxRuntime.jsxs("li", {
+    className: _JSXStyle.dynamic([["3250617587", [theme$1.palette.accents_7, theme$1.layout.radius, theme$1.palette.background, hover, theme$1.palette.accents_6, theme$1.palette.background, theme$1.expressiveness.shadowSmall, activeHover, theme$1.expressiveness.shadowMedium, theme$1.palette.accents_4, theme$1.palette.accents_2]]]),
+    children: [/*#__PURE__*/jsxRuntime.jsx("button", _objectSpread2(_objectSpread2({
+      onClick: clickHandler
+    }, props), {}, {
+      className: _JSXStyle.dynamic([["3250617587", [theme$1.palette.accents_7, theme$1.layout.radius, theme$1.palette.background, hover, theme$1.palette.accents_6, theme$1.palette.background, theme$1.expressiveness.shadowSmall, activeHover, theme$1.expressiveness.shadowMedium, theme$1.palette.accents_4, theme$1.palette.accents_2]]]) + " " + (props && props.className != null && props.className || classes || ""),
+      children: children
+    })), /*#__PURE__*/jsxRuntime.jsx(_JSXStyle, {
+      id: "3250617587",
+      dynamic: [theme$1.palette.accents_7, theme$1.layout.radius, theme$1.palette.background, hover, theme$1.palette.accents_6, theme$1.palette.background, theme$1.expressiveness.shadowSmall, activeHover, theme$1.expressiveness.shadowMedium, theme$1.palette.accents_4, theme$1.palette.accents_2],
+      children: "li.__jsx-style-dynamic-selector{margin-right:0.428em;display:inline-block;}button.__jsx-style-dynamic-selector{border:none;display:-webkit-inline-box;display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;box-sizing:border-box;text-transform:capitalize;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;white-space:nowrap;text-align:center;vertical-align:middle;box-shadow:none;outline:none;height:var(--pagination-size);min-width:var(--pagination-size);font-size:inherit;cursor:pointer;color:".concat(theme$1.palette.accents_7, ";border-radius:").concat(theme$1.layout.radius, ";background-color:").concat(theme$1.palette.background, ";-webkit-transition:all linear 200ms 0ms;transition:all linear 200ms 0ms;}button.__jsx-style-dynamic-selector:hover{background-color:").concat(hover, ";}.active.__jsx-style-dynamic-selector{font-weight:bold;background-color:").concat(theme$1.palette.accents_6, ";color:").concat(theme$1.palette.background, ";box-shadow:").concat(theme$1.expressiveness.shadowSmall, ";}.active.__jsx-style-dynamic-selector:hover{background-color:").concat(activeHover, ";box-shadow:").concat(theme$1.expressiveness.shadowMedium, ";}.disabled.__jsx-style-dynamic-selector{color:").concat(theme$1.palette.accents_4, ";cursor:not-allowed;}.disabled.__jsx-style-dynamic-selector:hover{background-color:").concat(theme$1.palette.accents_2, ";}button.__jsx-style-dynamic-selector svg{width:1.3em;height:1.3em;}")
+    })]
+  });
 };
 PaginationItem.displayName = 'PaginationItem';
 
@@ -787,12 +825,14 @@ var PaginationPrevious = function PaginationPrevious(_ref) {
   var _usePaginationContext = usePaginationContext(),
     update = _usePaginationContext.update,
     isFirst = _usePaginationContext.isFirst;
-  return /*#__PURE__*/React.createElement(PaginationItem, _extends({
+  return /*#__PURE__*/jsxRuntime.jsx(PaginationItem, _objectSpread2(_objectSpread2({
     onClick: function onClick() {
       return update && update('prev');
     },
     disabled: isFirst
-  }, props), children);
+  }, props), {}, {
+    children: children
+  }));
 };
 PaginationPrevious.displayName = 'PaginationPrevious';
 
@@ -803,12 +843,14 @@ var PaginationNext = function PaginationNext(_ref) {
   var _usePaginationContext = usePaginationContext(),
     update = _usePaginationContext.update,
     isLast = _usePaginationContext.isLast;
-  return /*#__PURE__*/React.createElement(PaginationItem, _extends({
+  return /*#__PURE__*/jsxRuntime.jsx(PaginationItem, _objectSpread2(_objectSpread2({
     onClick: function onClick() {
       return update && update('next');
     },
     disabled: isLast
-  }, props), children);
+  }, props), {}, {
+    children: children
+  }));
 };
 PaginationNext.displayName = 'PaginationNext';
 
@@ -819,7 +861,7 @@ var PaginationEllipsis = function PaginationEllipsis(_ref) {
     _useState2 = _slicedToArray(_useState, 2),
     showMore = _useState2[0],
     setShowMore = _useState2[1];
-  return /*#__PURE__*/React.createElement(PaginationItem, {
+  return /*#__PURE__*/jsxRuntime.jsxs(PaginationItem, {
     onClick: function onClick(e) {
       return _onClick && _onClick(e);
     },
@@ -828,52 +870,56 @@ var PaginationEllipsis = function PaginationEllipsis(_ref) {
     },
     onMouseLeave: function onMouseLeave() {
       return setShowMore(false);
-    }
-  }, showMore ? /*#__PURE__*/React.createElement("svg", {
-    viewBox: "0 0 24 24",
-    stroke: "currentColor",
-    strokeWidth: "1.5",
-    strokeLinecap: "round",
-    strokeLinejoin: "round",
-    fill: "none",
-    shapeRendering: "geometricPrecision",
-    className: _JSXStyle.dynamic([["2928474255", [isBefore ? '180deg' : '0deg']]]) + " " + "more"
-  }, /*#__PURE__*/React.createElement("path", {
-    d: "M13 17l5-5-5-5",
-    className: _JSXStyle.dynamic([["2928474255", [isBefore ? '180deg' : '0deg']]])
-  }), /*#__PURE__*/React.createElement("path", {
-    d: "M6 17l5-5-5-5",
-    className: _JSXStyle.dynamic([["2928474255", [isBefore ? '180deg' : '0deg']]])
-  })) : /*#__PURE__*/React.createElement("svg", {
-    viewBox: "0 0 24 24",
-    strokeWidth: "1.5",
-    strokeLinecap: "round",
-    strokeLinejoin: "round",
-    fill: "none",
-    shapeRendering: "geometricPrecision",
-    className: _JSXStyle.dynamic([["2928474255", [isBefore ? '180deg' : '0deg']]])
-  }, /*#__PURE__*/React.createElement("circle", {
-    cx: "12",
-    cy: "12",
-    r: "1",
-    fill: "currentColor",
-    className: _JSXStyle.dynamic([["2928474255", [isBefore ? '180deg' : '0deg']]])
-  }), /*#__PURE__*/React.createElement("circle", {
-    cx: "19",
-    cy: "12",
-    r: "1",
-    fill: "currentColor",
-    className: _JSXStyle.dynamic([["2928474255", [isBefore ? '180deg' : '0deg']]])
-  }), /*#__PURE__*/React.createElement("circle", {
-    cx: "5",
-    cy: "12",
-    r: "1",
-    fill: "currentColor",
-    className: _JSXStyle.dynamic([["2928474255", [isBefore ? '180deg' : '0deg']]])
-  })), /*#__PURE__*/React.createElement(_JSXStyle, {
-    id: "2928474255",
-    dynamic: [isBefore ? '180deg' : '0deg']
-  }, "svg.__jsx-style-dynamic-selector{color:currentColor;stroke:currentColor;width:1em;height:1em;}.more.__jsx-style-dynamic-selector{-webkit-transform:rotate(".concat(isBefore ? '180deg' : '0deg', ");-ms-transform:rotate(").concat(isBefore ? '180deg' : '0deg', ");transform:rotate(").concat(isBefore ? '180deg' : '0deg', ");}")));
+    },
+    children: [showMore ? /*#__PURE__*/jsxRuntime.jsxs("svg", {
+      viewBox: "0 0 24 24",
+      stroke: "currentColor",
+      strokeWidth: "1.5",
+      strokeLinecap: "round",
+      strokeLinejoin: "round",
+      fill: "none",
+      shapeRendering: "geometricPrecision",
+      className: _JSXStyle.dynamic([["2928474255", [isBefore ? '180deg' : '0deg']]]) + " " + "more",
+      children: [/*#__PURE__*/jsxRuntime.jsx("path", {
+        d: "M13 17l5-5-5-5",
+        className: _JSXStyle.dynamic([["2928474255", [isBefore ? '180deg' : '0deg']]])
+      }), /*#__PURE__*/jsxRuntime.jsx("path", {
+        d: "M6 17l5-5-5-5",
+        className: _JSXStyle.dynamic([["2928474255", [isBefore ? '180deg' : '0deg']]])
+      })]
+    }) : /*#__PURE__*/jsxRuntime.jsxs("svg", {
+      viewBox: "0 0 24 24",
+      strokeWidth: "1.5",
+      strokeLinecap: "round",
+      strokeLinejoin: "round",
+      fill: "none",
+      shapeRendering: "geometricPrecision",
+      className: _JSXStyle.dynamic([["2928474255", [isBefore ? '180deg' : '0deg']]]),
+      children: [/*#__PURE__*/jsxRuntime.jsx("circle", {
+        cx: "12",
+        cy: "12",
+        r: "1",
+        fill: "currentColor",
+        className: _JSXStyle.dynamic([["2928474255", [isBefore ? '180deg' : '0deg']]])
+      }), /*#__PURE__*/jsxRuntime.jsx("circle", {
+        cx: "19",
+        cy: "12",
+        r: "1",
+        fill: "currentColor",
+        className: _JSXStyle.dynamic([["2928474255", [isBefore ? '180deg' : '0deg']]])
+      }), /*#__PURE__*/jsxRuntime.jsx("circle", {
+        cx: "5",
+        cy: "12",
+        r: "1",
+        fill: "currentColor",
+        className: _JSXStyle.dynamic([["2928474255", [isBefore ? '180deg' : '0deg']]])
+      })]
+    }), /*#__PURE__*/jsxRuntime.jsx(_JSXStyle, {
+      id: "2928474255",
+      dynamic: [isBefore ? '180deg' : '0deg'],
+      children: "svg.__jsx-style-dynamic-selector{color:currentColor;stroke:currentColor;width:1em;height:1em;}.more.__jsx-style-dynamic-selector{-webkit-transform:rotate(".concat(isBefore ? '180deg' : '0deg', ");-ms-transform:rotate(").concat(isBefore ? '180deg' : '0deg', ");transform:rotate(").concat(isBefore ? '180deg' : '0deg', ");}")
+    })]
+  });
 };
 PaginationEllipsis.displayName = 'PaginationEllipsis';
 
@@ -898,13 +944,13 @@ var PaginationPages = function PaginationPages(_ref) {
     return _toConsumableArray(new Array(showPages));
   }, [showPages]);
   var renderItem = React.useCallback(function (value, active) {
-    return /*#__PURE__*/React.createElement(PaginationItem, {
-      key: "pagination-item-".concat(value),
+    return /*#__PURE__*/jsxRuntime.jsx(PaginationItem, {
       active: value === active,
       onClick: function onClick() {
         return setPage(value);
-      }
-    }, value);
+      },
+      children: value
+    }, "pagination-item-".concat(value));
   }, []);
   var startPages = pagesArray.map(function (_, index) {
     var value = index + 2;
@@ -913,13 +959,13 @@ var PaginationPages = function PaginationPages(_ref) {
   var middlePages = pagesArray.map(function (_, index) {
     var middleIndexNumber = middleNumber - (index + 1);
     var value = current - middleIndexNumber;
-    return /*#__PURE__*/React.createElement(PaginationItem, {
-      key: "pagination-middle-".concat(index),
+    return /*#__PURE__*/jsxRuntime.jsx(PaginationItem, {
       active: index + 1 === middleNumber,
       onClick: function onClick() {
         return setPage(value);
-      }
-    }, value);
+      },
+      children: value
+    }, "pagination-middle-".concat(index));
   });
   var endPages = pagesArray.map(function (_, index) {
     var value = count - (showPages - index);
@@ -927,34 +973,36 @@ var PaginationPages = function PaginationPages(_ref) {
   });
   if (count <= limit) {
     /* eslint-disable react/jsx-no-useless-fragment */
-    return /*#__PURE__*/React.createElement(React.Fragment, null, _toConsumableArray(new Array(count)).map(function (_, index) {
-      var value = index + 1;
-      return /*#__PURE__*/React.createElement(PaginationItem, {
-        key: "pagination-item-".concat(value),
-        active: value === current,
-        onClick: function onClick() {
-          return setPage(value);
-        }
-      }, value);
-    }));
+    return /*#__PURE__*/jsxRuntime.jsx(jsxRuntime.Fragment, {
+      children: _toConsumableArray(new Array(count)).map(function (_, index) {
+        var value = index + 1;
+        return /*#__PURE__*/jsxRuntime.jsx(PaginationItem, {
+          active: value === current,
+          onClick: function onClick() {
+            return setPage(value);
+          },
+          children: value
+        }, "pagination-item-".concat(value));
+      })
+    });
     /* eslint-enable */
   }
-  return /*#__PURE__*/React.createElement(React.Fragment, null, renderItem(1, current), showBeforeEllipsis && /*#__PURE__*/React.createElement(PaginationEllipsis, {
-    key: "pagination-ellipsis-before",
-    isBefore: true,
-    onClick: function onClick() {
-      return setPage(function (last) {
-        return last - 5 >= 1 ? last - 5 : 1;
-      });
-    }
-  }), showBeforeEllipsis && showAfterEllipsis ? middlePages : showBeforeEllipsis ? endPages : startPages, showAfterEllipsis && /*#__PURE__*/React.createElement(PaginationEllipsis, {
-    key: "pagination-ellipsis-after",
-    onClick: function onClick() {
-      return setPage(function (last) {
-        return last + 5 <= count ? last + 5 : count;
-      });
-    }
-  }), renderItem(count, current));
+  return /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
+    children: [renderItem(1, current), showBeforeEllipsis && /*#__PURE__*/jsxRuntime.jsx(PaginationEllipsis, {
+      isBefore: true,
+      onClick: function onClick() {
+        return setPage(function (last) {
+          return last - 5 >= 1 ? last - 5 : 1;
+        });
+      }
+    }, "pagination-ellipsis-before"), showBeforeEllipsis && showAfterEllipsis ? middlePages : showBeforeEllipsis ? endPages : startPages, showAfterEllipsis && /*#__PURE__*/jsxRuntime.jsx(PaginationEllipsis, {
+      onClick: function onClick() {
+        return setPage(function (last) {
+          return last + 5 <= count ? last + 5 : count;
+        });
+      }
+    }, "pagination-ellipsis-after"), renderItem(count, current)]
+  });
 };
 PaginationPages.displayName = 'PaginationPages';
 
@@ -1143,11 +1191,13 @@ var withScale = function withScale(Render) {
       getScaleProps: generateGetScaleProps(props),
       getAllScaleProps: generateGetAllScaleProps(props)
     };
-    return /*#__PURE__*/React.createElement(ScaleContext.Provider, {
-      value: value
-    }, /*#__PURE__*/React.createElement(Render, _extends({}, props, {
-      ref: ref
-    }), children));
+    return /*#__PURE__*/jsxRuntime.jsx(ScaleContext.Provider, {
+      value: value,
+      children: /*#__PURE__*/jsxRuntime.jsx(Render, _objectSpread2(_objectSpread2({}, props), {}, {
+        ref: ref,
+        children: children
+      }))
+    });
   });
   ScaleFC.displayName = "Scale".concat(Render.displayName || 'Wrapper');
   return ScaleFC;
@@ -1184,8 +1234,12 @@ var PaginationComponent = function PaginationComponent(_ref) {
       var hasChildren = function hasChildren(c) {
         return React.Children.count(c) > 0;
       };
-      var prevDefault = /*#__PURE__*/React.createElement(PaginationPrevious, null, "prev");
-      var nextDefault = /*#__PURE__*/React.createElement(PaginationNext, null, "next");
+      var prevDefault = /*#__PURE__*/jsxRuntime.jsx(PaginationPrevious, {
+        children: "prev"
+      });
+      var nextDefault = /*#__PURE__*/jsxRuntime.jsx(PaginationNext, {
+        children: "next"
+      });
       return [hasChildren(prevChildren) ? prevChildren : prevDefault, hasChildren(nextChildren) ? nextChildren : nextDefault];
     }, [prevChildren, nextChildren]),
     _useMemo2 = _slicedToArray(_useMemo, 2),
@@ -1218,19 +1272,22 @@ var PaginationComponent = function PaginationComponent(_ref) {
       setPage(customPage);
     }
   }, [customPage]);
-  return /*#__PURE__*/React.createElement(PaginationContext.Provider, {
-    value: values
-  }, /*#__PURE__*/React.createElement("nav", _extends({}, props, {
-    className: _JSXStyle.dynamic([["3826701357", [SCALES.font(2), SCALES.font(0.875), SCALES.width(1, 'auto'), SCALES.height(1, 'auto'), SCALES.pt(0), SCALES.pr(0), SCALES.pb(0), SCALES.pl(0), SCALES.mt(0), SCALES.mr(0), SCALES.mb(0), SCALES.ml(0)]]]) + " " + (props && props.className != null && props.className || className || "")
-  }), prevItem, /*#__PURE__*/React.createElement(PaginationPages, {
-    count: count,
-    current: page,
-    limit: limit,
-    setPage: setPage
-  }), nextItem), /*#__PURE__*/React.createElement(_JSXStyle, {
-    id: "3826701357",
-    dynamic: [SCALES.font(2), SCALES.font(0.875), SCALES.width(1, 'auto'), SCALES.height(1, 'auto'), SCALES.pt(0), SCALES.pr(0), SCALES.pb(0), SCALES.pl(0), SCALES.mt(0), SCALES.mr(0), SCALES.mb(0), SCALES.ml(0)]
-  }, "nav.__jsx-style-dynamic-selector{font-variant:tabular-nums;font-feature-settings:'tnum';--pagination-size:".concat(SCALES.font(2), ";font-size:").concat(SCALES.font(0.875), ";width:").concat(SCALES.width(1, 'auto'), ";height:").concat(SCALES.height(1, 'auto'), ";padding:").concat(SCALES.pt(0), " ").concat(SCALES.pr(0), " ").concat(SCALES.pb(0), " ").concat(SCALES.pl(0), ";margin:").concat(SCALES.mt(0), " ").concat(SCALES.mr(0), " ").concat(SCALES.mb(0), " ").concat(SCALES.ml(0), ";}nav.__jsx-style-dynamic-selector button:last-of-type{margin-right:0;}")));
+  return /*#__PURE__*/jsxRuntime.jsxs(PaginationContext.Provider, {
+    value: values,
+    children: [/*#__PURE__*/jsxRuntime.jsxs("nav", _objectSpread2(_objectSpread2({}, props), {}, {
+      className: _JSXStyle.dynamic([["3826701357", [SCALES.font(2), SCALES.font(0.875), SCALES.width(1, 'auto'), SCALES.height(1, 'auto'), SCALES.pt(0), SCALES.pr(0), SCALES.pb(0), SCALES.pl(0), SCALES.mt(0), SCALES.mr(0), SCALES.mb(0), SCALES.ml(0)]]]) + " " + (props && props.className != null && props.className || className || ""),
+      children: [prevItem, /*#__PURE__*/jsxRuntime.jsx(PaginationPages, {
+        count: count,
+        current: page,
+        limit: limit,
+        setPage: setPage
+      }), nextItem]
+    })), /*#__PURE__*/jsxRuntime.jsx(_JSXStyle, {
+      id: "3826701357",
+      dynamic: [SCALES.font(2), SCALES.font(0.875), SCALES.width(1, 'auto'), SCALES.height(1, 'auto'), SCALES.pt(0), SCALES.pr(0), SCALES.pb(0), SCALES.pl(0), SCALES.mt(0), SCALES.mr(0), SCALES.mb(0), SCALES.ml(0)],
+      children: "nav.__jsx-style-dynamic-selector{font-variant:tabular-nums;font-feature-settings:'tnum';--pagination-size:".concat(SCALES.font(2), ";font-size:").concat(SCALES.font(0.875), ";width:").concat(SCALES.width(1, 'auto'), ";height:").concat(SCALES.height(1, 'auto'), ";padding:").concat(SCALES.pt(0), " ").concat(SCALES.pr(0), " ").concat(SCALES.pb(0), " ").concat(SCALES.pl(0), ";margin:").concat(SCALES.mt(0), " ").concat(SCALES.mr(0), " ").concat(SCALES.mb(0), " ").concat(SCALES.ml(0), ";}nav.__jsx-style-dynamic-selector button:last-of-type{margin-right:0;}")
+    })]
+  });
 };
 PaginationComponent.displayName = 'Pagination';
 var Pagination = withScale(PaginationComponent);