@semcore/pagination 4.51.0 → 16.0.0-prerelease.11

package/lib/esm/Pagination.mjs

@@ -1,168 +1,208 @@
-import $ from "@babel/runtime/helpers/esm/objectWithoutProperties";
-import v from "@babel/runtime/helpers/esm/objectSpread2";
-import S from "@babel/runtime/helpers/esm/classCallCheck";
-import I from "@babel/runtime/helpers/esm/createClass";
-import c from "@babel/runtime/helpers/esm/assertThisInitialized";
-import y from "@babel/runtime/helpers/esm/inherits";
-import T from "@babel/runtime/helpers/esm/createSuper";
-import l from "@babel/runtime/helpers/esm/defineProperty";
-import { sstyled as D } from "@semcore/utils/lib/core/index";
-import O, { sstyled as h, assignProps as d, Component as C } from "@semcore/core";
-import n from "react";
-import { Flex as L, ScreenReaderOnly as G } from "@semcore/flex-box";
-import N from "@semcore/input-number";
-import { Text as E } from "@semcore/typography";
-import z, { ButtonLink as K } from "@semcore/button";
-import { Hint as U } from "@semcore/tooltip";
-import W from "@semcore/icon/ChevronDoubleLeft/m";
-import q from "@semcore/utils/lib/uniqueID";
-import H from "@semcore/utils/lib/enhances/i18nEnhance";
-import { localizedMessages as R } from "./translations/__intergalactic-dynamic-locales.mjs";
-var M = ["styles", "getI18nText", "totalPages", "isLastOrSingle", "children"], J = (
+import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
+import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
+import _classCallCheck from "@babel/runtime/helpers/esm/classCallCheck";
+import _createClass from "@babel/runtime/helpers/esm/createClass";
+import _assertThisInitialized from "@babel/runtime/helpers/esm/assertThisInitialized";
+import _inherits from "@babel/runtime/helpers/esm/inherits";
+import _createSuper from "@babel/runtime/helpers/esm/createSuper";
+import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
+import { sstyled, createComponent, assignProps, Component } from "@semcore/core";
+import React from "react";
+import { Flex, ScreenReaderOnly } from "@semcore/flex-box";
+import InputNumber from "@semcore/input-number";
+import { Text } from "@semcore/typography";
+import Button, { ButtonLink } from "@semcore/button";
+import { Hint } from "@semcore/tooltip";
+import ChevronDoubleLeft from "@semcore/icon/ChevronDoubleLeft/m";
+import uniqueIDEnhancement from "@semcore/core/lib/utils/uniqueID";
+import i18nEnhance from "@semcore/core/lib/utils/enhances/i18nEnhance";
+import { localizedMessages } from "./translations/__intergalactic-dynamic-locales.mjs";
+var _excluded = ["styles", "getI18nText", "totalPages", "isLastOrSingle", "children"];
+var style = (
   /*__reshadow_css_start__*/
-  (D.insert(
+  (sstyled.insert(
     /*__inner_css_start__*/
-    ".___SPagination_v3jmf_gg_{justify-content:flex-start;align-items:center}.___SPagination_v3jmf_gg_.__withGap_v3jmf_gg_{gap:var(--intergalactic-spacing-4x, 16px)}.___SPagination_v3jmf_gg_.__withGap_v3jmf_gg_._size_l_v3jmf_gg_{gap:var(--intergalactic-spacing-5x, 20px)}.___SNextPage_v3jmf_gg_,.___SPrevPage_v3jmf_gg_{align-self:center;margin-left:var(--intergalactic-spacing-2x, 8px)}.___SNextPage_v3jmf_gg_._size_l_v3jmf_gg_,.___SPrevPage_v3jmf_gg_._size_l_v3jmf_gg_{margin-left:var(--intergalactic-spacing-3x, 12px)}.___SLabel_v3jmf_gg_{color:var(--intergalactic-text-primary, #191b23)}.___SLabel_v3jmf_gg_:not(:first-child){margin-left:var(--intergalactic-spacing-4x, 16px)}.___SLabel_v3jmf_gg_._size_l_v3jmf_gg_:not(:first-child){margin-left:var(--intergalactic-spacing-5x, 20px)}.___STotalPages_v3jmf_gg_{align-self:center;line-height:normal;color:var(--intergalactic-text-link, #006dca)}.___STotalPagesLabel_v3jmf_gg_{margin-left:var(--intergalactic-spacing-2x, 8px);margin-right:var(--intergalactic-spacing-1x, 4px);color:var(--intergalactic-text-primary, #191b23)}.___STotalLastPages_v3jmf_gg_{font-size:var(--intergalactic-fs-200, 14px);line-height:var(--intergalactic-lh-200, 142%);color:var(--intergalactic-text-primary, #191b23)}.___STotalLastPages_v3jmf_gg_._size_l_v3jmf_gg_{font-size:var(--intergalactic-fs-300, 16px);line-height:var(--intergalactic-lh-300, 150%)}.___SPageInput_v3jmf_gg_{max-width:68px;margin-left:var(--intergalactic-spacing-1x, 4px)}.___SPageInput_v3jmf_gg_._size_l_v3jmf_gg_{margin-left:var(--intergalactic-spacing-2x, 8px)}.___SPageInput_v3jmf_gg_:focus-within .___SPageInputAddon_v3jmf_gg_{opacity:1;clip:initial;position:static}.___SPageInputAddon_v3jmf_gg_{opacity:0;clip:rect(1px,1px,1px,1px);position:absolute}.___SLabel_v3jmf_gg_,.___STotalPagesLabel_v3jmf_gg_,.___STotalPages_v3jmf_gg_{font-size:var(--intergalactic-fs-200, 14px);line-height:var(--intergalactic-lh-200, 142%)}.___SLabel_v3jmf_gg_._size_l_v3jmf_gg_,.___STotalPagesLabel_v3jmf_gg_._size_l_v3jmf_gg_,.___STotalPages_v3jmf_gg_._size_l_v3jmf_gg_{font-size:var(--intergalactic-fs-300, 16px);line-height:var(--intergalactic-lh-300, 150%)}",
-    "v3jmf_gg_"
+    ".___SPagination_k9sct_gg_{justify-content:flex-start;align-items:center}.___SPagination_k9sct_gg_.__withGap_k9sct_gg_{gap:var(--intergalactic-spacing-4x, 16px)}.___SPagination_k9sct_gg_.__withGap_k9sct_gg_._size_l_k9sct_gg_{gap:var(--intergalactic-spacing-5x, 20px)}.___SNextPage_k9sct_gg_,.___SPrevPage_k9sct_gg_{align-self:center;margin-left:var(--intergalactic-spacing-2x, 8px)}.___SNextPage_k9sct_gg_._size_l_k9sct_gg_,.___SPrevPage_k9sct_gg_._size_l_k9sct_gg_{margin-left:var(--intergalactic-spacing-3x, 12px)}.___SLabel_k9sct_gg_{color:var(--intergalactic-text-primary, #191b23)}.___SLabel_k9sct_gg_:not(:first-child){margin-left:var(--intergalactic-spacing-4x, 16px)}.___SLabel_k9sct_gg_._size_l_k9sct_gg_:not(:first-child){margin-left:var(--intergalactic-spacing-5x, 20px)}.___STotalPages_k9sct_gg_{align-self:center;line-height:normal;color:var(--intergalactic-text-link, #006dca)}.___STotalPagesLabel_k9sct_gg_{margin-left:var(--intergalactic-spacing-2x, 8px);margin-right:var(--intergalactic-spacing-1x, 4px);color:var(--intergalactic-text-primary, #191b23)}.___STotalLastPages_k9sct_gg_{font-size:var(--intergalactic-fs-200, 14px);line-height:var(--intergalactic-lh-200, 142%);color:var(--intergalactic-text-primary, #191b23)}.___STotalLastPages_k9sct_gg_._size_l_k9sct_gg_{font-size:var(--intergalactic-fs-300, 16px);line-height:var(--intergalactic-lh-300, 150%)}.___SPageInput_k9sct_gg_{max-width:68px;margin-left:var(--intergalactic-spacing-1x, 4px)}.___SPageInput_k9sct_gg_._size_l_k9sct_gg_{margin-left:var(--intergalactic-spacing-2x, 8px)}.___SPageInput_k9sct_gg_:focus-within .___SPageInputAddon_k9sct_gg_{opacity:1;clip:initial;position:static}.___SPageInputAddon_k9sct_gg_{opacity:0;clip:rect(1px,1px,1px,1px);position:absolute}.___SLabel_k9sct_gg_,.___STotalPagesLabel_k9sct_gg_,.___STotalPages_k9sct_gg_{font-size:var(--intergalactic-fs-200, 14px);line-height:var(--intergalactic-lh-200, 142%)}.___SLabel_k9sct_gg_._size_l_k9sct_gg_,.___STotalPagesLabel_k9sct_gg_._size_l_k9sct_gg_,.___STotalPages_k9sct_gg_._size_l_k9sct_gg_{font-size:var(--intergalactic-fs-300, 16px);line-height:var(--intergalactic-lh-300, 150%)}",
+    "k9sct_gg_"
   ), {
-    __SPagination: "___SPagination_v3jmf_gg_",
-    __SLabel: "___SLabel_v3jmf_gg_",
-    _size_l: "_size_l_v3jmf_gg_",
-    __STotalPages: "___STotalPages_v3jmf_gg_",
-    __STotalPagesLabel: "___STotalPagesLabel_v3jmf_gg_",
-    __SPageInput: "___SPageInput_v3jmf_gg_",
-    __SPageInputAddon: "___SPageInputAddon_v3jmf_gg_",
-    _withGap: "__withGap_v3jmf_gg_",
-    __SNextPage: "___SNextPage_v3jmf_gg_",
-    __SPrevPage: "___SPrevPage_v3jmf_gg_",
-    __STotalLastPages: "___STotalLastPages_v3jmf_gg_"
+    "__SPagination": "___SPagination_k9sct_gg_",
+    "__SLabel": "___SLabel_k9sct_gg_",
+    "_size_l": "_size_l_k9sct_gg_",
+    "__STotalPages": "___STotalPages_k9sct_gg_",
+    "__STotalPagesLabel": "___STotalPagesLabel_k9sct_gg_",
+    "__SPageInput": "___SPageInput_k9sct_gg_",
+    "__SPageInputAddon": "___SPageInputAddon_k9sct_gg_",
+    "_withGap": "__withGap_k9sct_gg_",
+    "__SNextPage": "___SNextPage_k9sct_gg_",
+    "__SPrevPage": "___SPrevPage_k9sct_gg_",
+    "__STotalLastPages": "___STotalLastPages_k9sct_gg_"
   })
-), j = /* @__PURE__ */ function(_) {
-  y(r, _);
-  var u = T(r);
-  function r() {
-    var e;
-    S(this, r);
-    for (var s = arguments.length, g = new Array(s), f = 0; f < s; f++)
-      g[f] = arguments[f];
-    return e = u.call.apply(u, [this].concat(g)), l(c(e), "nextPageButtonRef", /* @__PURE__ */ n.createRef()), l(c(e), "prevPageButtonRef", /* @__PURE__ */ n.createRef()), l(c(e), "state", {
+);
+var PaginationRoot = /* @__PURE__ */ function(_Component) {
+  _inherits(PaginationRoot2, _Component);
+  var _super = _createSuper(PaginationRoot2);
+  function PaginationRoot2() {
+    var _this;
+    _classCallCheck(this, PaginationRoot2);
+    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+      args[_key] = arguments[_key];
+    }
+    _this = _super.call.apply(_super, [this].concat(args));
+    _defineProperty(_assertThisInitialized(_this), "nextPageButtonRef", /* @__PURE__ */ React.createRef());
+    _defineProperty(_assertThisInitialized(_this), "prevPageButtonRef", /* @__PURE__ */ React.createRef());
+    _defineProperty(_assertThisInitialized(_this), "state", {
       // Crutch, so as not to take out `dirtyCurrentPage` in props
       dirtyCurrentPage: void 0
-    }), l(c(e), "pageInputAddonRef", /* @__PURE__ */ n.createRef()), l(c(e), "returnLostFocus", function() {
+    });
+    _defineProperty(_assertThisInitialized(_this), "pageInputAddonRef", /* @__PURE__ */ React.createRef());
+    _defineProperty(_assertThisInitialized(_this), "returnLostFocus", function() {
       setTimeout(function() {
-        if (document.activeElement === document.body) {
-          var t = e.prevPageButtonRef.current, a = e.nextPageButtonRef.current;
-          t && !t.disabled ? t.focus() : a && !a.disabled && a.focus();
+        if (document.activeElement !== document.body) return;
+        var prevPageButton = _this.prevPageButtonRef.current;
+        var nextPageButton = _this.nextPageButtonRef.current;
+        if (prevPageButton && !prevPageButton.disabled) {
+          prevPageButton.focus();
+        } else if (nextPageButton && !nextPageButton.disabled) {
+          nextPageButton.focus();
         }
       }, 0);
-    }), l(c(e), "handlePageChange", function(t) {
-      t = Number(t), !Number.isNaN(t) && (e.handlers.currentPage(t), e.setState({
+    });
+    _defineProperty(_assertThisInitialized(_this), "handlePageChange", function(currentPage) {
+      currentPage = Number(currentPage);
+      if (Number.isNaN(currentPage)) {
+        return;
+      }
+      _this.handlers.currentPage(currentPage);
+      _this.setState({
         dirtyCurrentPage: void 0
-      }), e.returnLostFocus());
-    }), l(c(e), "handlePageValueChange", function(t) {
-      var a = e.state.dirtyCurrentPage;
-      Number.isNaN(Number(t)) && (t = a), e.setState({
-        dirtyCurrentPage: t
       });
-    }), l(c(e), "handlePageValueBlur", function() {
+      _this.returnLostFocus();
+    });
+    _defineProperty(_assertThisInitialized(_this), "handlePageValueChange", function(value) {
+      var dirtyCurrentPage = _this.state.dirtyCurrentPage;
+      if (Number.isNaN(Number(value))) {
+        value = dirtyCurrentPage;
+      }
+      _this.setState({
+        dirtyCurrentPage: value
+      });
+    });
+    _defineProperty(_assertThisInitialized(_this), "handlePageValueBlur", function() {
       setTimeout(function() {
-        if (e.pageInputAddonRef.current !== document.activeElement) {
-          var t = e.asProps.currentPage;
-          e.setState({
-            dirtyCurrentPage: t
+        if (_this.pageInputAddonRef.current !== document.activeElement) {
+          var currentPage = _this.asProps.currentPage;
+          _this.setState({
+            dirtyCurrentPage: currentPage
           });
         }
       }, 0);
-    }), l(c(e), "getDirtyCurrentPage", function() {
-      var t = e.state.dirtyCurrentPage, a = e.asProps.totalPages, i = t > a ? a : t;
-      return i <= 0 ? 1 : i;
-    }), l(c(e), "handlePageInputIconClick", function() {
-      var t = e.getDirtyCurrentPage();
-      e.handlePageChange(t);
-    }), l(c(e), "handlePageInputKeyDown", function(t) {
-      if (t.key === "Enter") {
-        var a = e.getDirtyCurrentPage();
-        e.handlePageChange(a);
-      }
-    }), l(c(e), "getFirstPageProps", function() {
-      var t = e.asProps, a = t.currentPage, i = t.getI18nText, o = t.size, P = a <= 1;
+    });
+    _defineProperty(_assertThisInitialized(_this), "getDirtyCurrentPage", function() {
+      var dirtyCurrentPage = _this.state.dirtyCurrentPage;
+      var totalPages = _this.asProps.totalPages;
+      var finalValue = dirtyCurrentPage > totalPages ? totalPages : dirtyCurrentPage;
+      return finalValue <= 0 ? 1 : finalValue;
+    });
+    _defineProperty(_assertThisInitialized(_this), "handlePageInputIconClick", function() {
+      var dirtyCurrentPage = _this.getDirtyCurrentPage();
+      _this.handlePageChange(dirtyCurrentPage);
+    });
+    _defineProperty(_assertThisInitialized(_this), "handlePageInputKeyDown", function(event) {
+      if (event.key !== "Enter") return;
+      var dirtyCurrentPage = _this.getDirtyCurrentPage();
+      _this.handlePageChange(dirtyCurrentPage);
+    });
+    _defineProperty(_assertThisInitialized(_this), "getFirstPageProps", function() {
+      var _this$asProps = _this.asProps, currentPage = _this$asProps.currentPage, getI18nText = _this$asProps.getI18nText, size = _this$asProps.size;
+      var disabled = currentPage <= 1;
       return {
-        disabled: P,
-        onClick: function() {
-          return e.handlePageChange(1);
+        disabled,
+        onClick: function onClick() {
+          return _this.handlePageChange(1);
         },
-        getI18nText: i,
-        size: o
+        getI18nText,
+        size
       };
-    }), l(c(e), "getPrevPageProps", function() {
-      var t = e.asProps, a = t.currentPage, i = t.getI18nText, o = t.size, P = a <= 1;
+    });
+    _defineProperty(_assertThisInitialized(_this), "getPrevPageProps", function() {
+      var _this$asProps2 = _this.asProps, currentPage = _this$asProps2.currentPage, getI18nText = _this$asProps2.getI18nText, size = _this$asProps2.size;
+      var disabled = currentPage <= 1;
       return {
-        currentPage: a,
-        disabled: P,
-        onClick: function() {
-          return e.handlePageChange(a - 1);
+        currentPage,
+        disabled,
+        onClick: function onClick() {
+          return _this.handlePageChange(currentPage - 1);
         },
-        getI18nText: i,
-        ref: e.nextPageButtonRef,
-        size: o
+        getI18nText,
+        ref: _this.nextPageButtonRef,
+        size
       };
-    }), l(c(e), "getNextPageProps", function() {
-      var t = e.asProps, a = t.currentPage, i = t.totalPages, o = t.getI18nText, P = t.size, p = !(a < i);
+    });
+    _defineProperty(_assertThisInitialized(_this), "getNextPageProps", function() {
+      var _this$asProps3 = _this.asProps, currentPage = _this$asProps3.currentPage, totalPages = _this$asProps3.totalPages, getI18nText = _this$asProps3.getI18nText, size = _this$asProps3.size;
+      var disabled = !(currentPage < totalPages);
       return {
-        currentPage: a,
-        disabled: p,
-        onClick: function() {
-          return e.handlePageChange(a + 1);
+        currentPage,
+        disabled,
+        onClick: function onClick() {
+          return _this.handlePageChange(currentPage + 1);
         },
-        getI18nText: o,
-        ref: e.prevPageButtonRef,
-        size: P
+        getI18nText,
+        ref: _this.prevPageButtonRef,
+        size
       };
-    }), l(c(e), "getPageInputProps", function() {
-      var t = e.asProps, a = t.getI18nText, i = t.locale, o = t.size;
+    });
+    _defineProperty(_assertThisInitialized(_this), "getPageInputProps", function() {
+      var _this$asProps4 = _this.asProps, getI18nText = _this$asProps4.getI18nText, locale = _this$asProps4.locale, size = _this$asProps4.size;
       return {
-        getI18nText: a,
-        locale: i,
-        size: o
+        getI18nText,
+        locale,
+        size
       };
-    }), l(c(e), "getPageInputAddonProps", function() {
+    });
+    _defineProperty(_assertThisInitialized(_this), "getPageInputAddonProps", function() {
       return {
-        onClick: e.handlePageInputIconClick,
-        ref: e.pageInputAddonRef,
-        onBlur: e.handlePageValueBlur
+        onClick: _this.handlePageInputIconClick,
+        ref: _this.pageInputAddonRef,
+        onBlur: _this.handlePageValueBlur
       };
-    }), l(c(e), "getPageInputValueProps", function() {
-      var t = e.state.dirtyCurrentPage, a = e.asProps, i = a.currentPage, o = a.totalPages, P = a.getI18nText, p = a.size;
+    });
+    _defineProperty(_assertThisInitialized(_this), "getPageInputValueProps", function() {
+      var dirtyCurrentPage = _this.state.dirtyCurrentPage;
+      var _this$asProps5 = _this.asProps, currentPage = _this$asProps5.currentPage, totalPages = _this$asProps5.totalPages, getI18nText = _this$asProps5.getI18nText, size = _this$asProps5.size;
       return {
         min: 1,
-        max: o,
-        disabled: o === 1,
-        value: t === void 0 ? i : t,
-        onBlur: e.handlePageValueBlur,
-        onChange: e.handlePageValueChange,
-        onKeyDown: e.handlePageInputKeyDown,
-        getI18nText: P,
-        size: p
+        max: totalPages,
+        disabled: totalPages === 1,
+        value: dirtyCurrentPage === void 0 ? currentPage : dirtyCurrentPage,
+        onBlur: _this.handlePageValueBlur,
+        onChange: _this.handlePageValueChange,
+        onKeyDown: _this.handlePageInputKeyDown,
+        getI18nText,
+        size
       };
-    }), l(c(e), "getTotalPagesProps", function() {
-      var t = e.asProps, a = t.currentPage, i = t.totalPages, o = t.getI18nText, P = t.locale, p = t.size, m = new Intl.NumberFormat(P, {
+    });
+    _defineProperty(_assertThisInitialized(_this), "getTotalPagesProps", function() {
+      var _this$asProps6 = _this.asProps, currentPage = _this$asProps6.currentPage, totalPages = _this$asProps6.totalPages, getI18nText = _this$asProps6.getI18nText, locale = _this$asProps6.locale, size = _this$asProps6.size;
+      var formatter = new Intl.NumberFormat(locale, {
         style: "decimal"
       });
       return {
-        totalPages: i,
-        children: m.format(i),
-        isLastOrSingle: a === i,
-        onClick: function() {
-          return e.handlePageChange(i);
+        totalPages,
+        children: formatter.format(totalPages),
+        isLastOrSingle: currentPage === totalPages,
+        onClick: function onClick() {
+          return _this.handlePageChange(totalPages);
         },
-        getI18nText: o,
-        size: p
+        getI18nText,
+        size
       };
-    }), e;
+    });
+    return _this;
   }
-  return I(r, [{
+  _createClass(PaginationRoot2, [{
     key: "uncontrolledProps",
-    value: function() {
+    value: function uncontrolledProps() {
       return {
         totalPages: null,
         currentPage: null
@@ -170,177 +210,208 @@ var M = ["styles", "getI18nText", "totalPages", "isLastOrSingle", "children"], J
     }
   }, {
     key: "componentDidUpdate",
-    value: function(s) {
-      s.currentPage !== void 0 && s.currentPage !== this.asProps.currentPage && this.setState({
-        dirtyCurrentPage: void 0
-      });
+    value: function componentDidUpdate(prevProps) {
+      if (prevProps.currentPage !== void 0 && prevProps.currentPage !== this.asProps.currentPage) {
+        this.setState({
+          dirtyCurrentPage: void 0
+        });
+      }
     }
   }, {
     key: "render",
-    value: function() {
-      var s = this.asProps, g, f = L, t = this.asProps, a = t.Children, i = t.children, o = t.getI18nText, P = t.currentPage, p = t.totalPages, m = p === void 0 ? 1 : p;
-      return g = h(this.asProps.styles), /* @__PURE__ */ n.createElement(f, g.cn("SPagination", v({}, d({
-        flexWrap: "wrap",
-        withGap: !i,
-        tag: "nav",
-        "aria-label": o("pagination")
-      }, s))), i ? /* @__PURE__ */ n.createElement(a, g.cn("Children", {})) : /* @__PURE__ */ n.createElement(n.Fragment, null, m === 1 ? null : /* @__PURE__ */ n.createElement(L, g.cn("Flex", {}), /* @__PURE__ */ n.createElement(x.FirstPage, null), /* @__PURE__ */ n.createElement(x.PrevPage, null), /* @__PURE__ */ n.createElement(x.NextPage, null)), /* @__PURE__ */ n.createElement(L, g.cn("Flex", {
-        alignItems: "center"
-      }), /* @__PURE__ */ n.createElement(x.PageInput, null), /* @__PURE__ */ n.createElement(x.TotalPages, null))), /* @__PURE__ */ n.createElement(G, g.cn("ScreenReaderOnly", {
+    value: function render() {
+      var _ref = this.asProps, _ref9;
+      var SPagination = Flex;
+      var _this$asProps7 = this.asProps, Children = _this$asProps7.Children, hasChildren = _this$asProps7.children, getI18nText = _this$asProps7.getI18nText, currentPage = _this$asProps7.currentPage, _this$asProps7$totalP = _this$asProps7.totalPages, totalPages = _this$asProps7$totalP === void 0 ? 1 : _this$asProps7$totalP;
+      return _ref9 = sstyled(this.asProps.styles), /* @__PURE__ */ React.createElement(SPagination, _ref9.cn("SPagination", _objectSpread({}, assignProps({
+        "flexWrap": "wrap",
+        "withGap": !hasChildren,
+        "tag": "nav",
+        "aria-label": getI18nText("pagination")
+      }, _ref))), hasChildren ? /* @__PURE__ */ React.createElement(Children, _ref9.cn("Children", {})) : /* @__PURE__ */ React.createElement(React.Fragment, null, totalPages === 1 ? null : /* @__PURE__ */ React.createElement(Flex, _ref9.cn("Flex", {}), /* @__PURE__ */ React.createElement(Pagination.FirstPage, null), /* @__PURE__ */ React.createElement(Pagination.PrevPage, null), /* @__PURE__ */ React.createElement(Pagination.NextPage, null)), /* @__PURE__ */ React.createElement(Flex, _ref9.cn("Flex", {
+        "alignItems": "center"
+      }), /* @__PURE__ */ React.createElement(Pagination.PageInput, null), /* @__PURE__ */ React.createElement(Pagination.TotalPages, null))), /* @__PURE__ */ React.createElement(ScreenReaderOnly, _ref9.cn("ScreenReaderOnly", {
         "aria-live": "polite",
-        role: "status"
-      }), o("pageInputLabel"), " ", P));
+        "role": "status"
+      }), getI18nText("pageInputLabel"), " ", currentPage));
     }
-  }]), r;
-}(C);
-l(j, "displayName", "Pagination");
-l(j, "defaultProps", function() {
+  }]);
+  return PaginationRoot2;
+}(Component);
+_defineProperty(PaginationRoot, "displayName", "Pagination");
+_defineProperty(PaginationRoot, "defaultProps", function() {
   return {
     defaultCurrentPage: 1,
     defaultTotalPages: 1,
-    i18n: R,
+    i18n: localizedMessages,
     locale: "en",
     size: "m"
   };
 });
-l(j, "style", J);
-l(j, "enhance", [H(R)]);
-var A = /* @__PURE__ */ function(_) {
-  y(r, _);
-  var u = T(r);
-  function r() {
-    return S(this, r), u.apply(this, arguments);
+_defineProperty(PaginationRoot, "style", style);
+_defineProperty(PaginationRoot, "enhance", [i18nEnhance(localizedMessages)]);
+var FirstPage = /* @__PURE__ */ function(_Component2) {
+  _inherits(FirstPage2, _Component2);
+  var _super2 = _createSuper(FirstPage2);
+  function FirstPage2() {
+    _classCallCheck(this, FirstPage2);
+    return _super2.apply(this, arguments);
   }
-  return I(r, [{
+  _createClass(FirstPage2, [{
     key: "render",
-    value: function() {
-      var s = this.asProps, g = this.asProps.getI18nText;
-      return /* @__PURE__ */ n.createElement(z, d({
-        "aria-label": g("firstPage")
-      }, s));
+    value: function render() {
+      var _ref2 = this.asProps;
+      var getI18nText = this.asProps.getI18nText;
+      return /* @__PURE__ */ React.createElement(Button, assignProps({
+        "aria-label": getI18nText("firstPage")
+      }, _ref2));
     }
-  }]), r;
-}(C);
-l(A, "defaultProps", function(_) {
-  var u = _.getI18nText("firstPage");
+  }]);
+  return FirstPage2;
+}(Component);
+_defineProperty(FirstPage, "defaultProps", function(props) {
+  var hintContent = props.getI18nText("firstPage");
   return {
-    children: /* @__PURE__ */ n.createElement(z.Addon, {
-      tag: U,
-      title: u,
+    children: /* @__PURE__ */ React.createElement(Button.Addon, {
+      tag: Hint,
+      title: hintContent,
       timeout: [250, 50],
       __excludeProps: ["aria-label"]
-    }, /* @__PURE__ */ n.createElement(W, null))
+    }, /* @__PURE__ */ React.createElement(ChevronDoubleLeft, null))
   };
 });
-var F = /* @__PURE__ */ function(_) {
-  y(r, _);
-  var u = T(r);
-  function r() {
-    return S(this, r), u.apply(this, arguments);
+var PrevPage = /* @__PURE__ */ function(_Component3) {
+  _inherits(PrevPage2, _Component3);
+  var _super3 = _createSuper(PrevPage2);
+  function PrevPage2() {
+    _classCallCheck(this, PrevPage2);
+    return _super3.apply(this, arguments);
   }
-  return I(r, [{
+  _createClass(PrevPage2, [{
     key: "render",
-    value: function() {
-      var s = this.asProps, g, f = z;
-      return g = h(this.asProps.styles), /* @__PURE__ */ n.createElement(f, g.cn("SPrevPage", v({}, d({}, s))));
+    value: function render() {
+      var _ref3 = this.asProps, _ref10;
+      var SPrevPage = Button;
+      return _ref10 = sstyled(this.asProps.styles), /* @__PURE__ */ React.createElement(SPrevPage, _ref10.cn("SPrevPage", _objectSpread({}, assignProps({}, _ref3))));
     }
-  }]), r;
-}(C);
-l(F, "defaultProps", function(_) {
+  }]);
+  return PrevPage2;
+}(Component);
+_defineProperty(PrevPage, "defaultProps", function(props) {
   return {
-    children: _.getI18nText("prevPageLabel")
+    children: props.getI18nText("prevPageLabel")
   };
 });
-var V = /* @__PURE__ */ function(_) {
-  y(r, _);
-  var u = T(r);
-  function r() {
-    return S(this, r), u.apply(this, arguments);
+var NextPage = /* @__PURE__ */ function(_Component4) {
+  _inherits(NextPage2, _Component4);
+  var _super4 = _createSuper(NextPage2);
+  function NextPage2() {
+    _classCallCheck(this, NextPage2);
+    return _super4.apply(this, arguments);
   }
-  return I(r, [{
+  _createClass(NextPage2, [{
     key: "render",
-    value: function() {
-      var s = this.asProps, g, f = z;
-      return g = h(this.asProps.styles), /* @__PURE__ */ n.createElement(f, g.cn("SNextPage", v({}, d({
-        use: "primary",
-        theme: "info"
-      }, s))));
+    value: function render() {
+      var _ref4 = this.asProps, _ref11;
+      var SNextPage = Button;
+      return _ref11 = sstyled(this.asProps.styles), /* @__PURE__ */ React.createElement(SNextPage, _ref11.cn("SNextPage", _objectSpread({}, assignProps({
+        "use": "primary",
+        "theme": "info"
+      }, _ref4))));
     }
-  }]), r;
-}(C);
-l(V, "defaultProps", function(_) {
+  }]);
+  return NextPage2;
+}(Component);
+_defineProperty(NextPage, "defaultProps", function(props) {
   return {
-    children: _.getI18nText("nextPageLabel")
+    children: props.getI18nText("nextPageLabel")
   };
 });
-var Q = /* @__PURE__ */ function(_) {
-  y(r, _);
-  var u = T(r);
-  function r() {
-    return S(this, r), u.apply(this, arguments);
+var TotalPages = /* @__PURE__ */ function(_Component5) {
+  _inherits(TotalPages2, _Component5);
+  var _super5 = _createSuper(TotalPages2);
+  function TotalPages2() {
+    _classCallCheck(this, TotalPages2);
+    return _super5.apply(this, arguments);
   }
-  return I(r, [{
+  _createClass(TotalPages2, [{
     key: "render",
-    value: function() {
-      var s = this.asProps, g, f = K, t = E, a = E, i = this.asProps, o = i.styles, P = i.getI18nText, p = i.totalPages, m = i.isLastOrSingle, b = i.children, k = $(i, M), B = k.size === "l" ? "300" : "200";
-      return g = h(o), /* @__PURE__ */ n.createElement(n.Fragment, null, /* @__PURE__ */ n.createElement(t, g.cn("STotalPagesLabel", {
-        size: B
-      }), P("totalPagesLabel")), m ? /* @__PURE__ */ n.createElement(a, g.cn("STotalLastPages", v({
-        size: B,
-        "aria-label": P("lastPage", {
-          lastPageNumber: p
+    value: function render() {
+      var _ref5 = this.asProps, _ref12;
+      var STotalPages = ButtonLink;
+      var STotalPagesLabel = Text;
+      var STotalLastPages = Text;
+      var _this$asProps8 = this.asProps, styles = _this$asProps8.styles, getI18nText = _this$asProps8.getI18nText, totalPages = _this$asProps8.totalPages, isLastOrSingle = _this$asProps8.isLastOrSingle, children = _this$asProps8.children, other = _objectWithoutProperties(_this$asProps8, _excluded);
+      var textSize = other.size === "l" ? "300" : "200";
+      return _ref12 = sstyled(styles), /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(STotalPagesLabel, _ref12.cn("STotalPagesLabel", {
+        "size": textSize
+      }), getI18nText("totalPagesLabel")), isLastOrSingle ? /* @__PURE__ */ React.createElement(STotalLastPages, _ref12.cn("STotalLastPages", _objectSpread({
+        "size": textSize,
+        "aria-label": getI18nText("lastPage", {
+          lastPageNumber: totalPages
         })
-      }, k)), b) : /* @__PURE__ */ n.createElement(f, g.cn("STotalPages", v({}, d({
-        "aria-label": P("lastPage", {
-          lastPageNumber: p
+      }, other)), children) : /* @__PURE__ */ React.createElement(STotalPages, _ref12.cn("STotalPages", _objectSpread({}, assignProps({
+        "aria-label": getI18nText("lastPage", {
+          lastPageNumber: totalPages
         })
-      }, s)))));
+      }, _ref5)))));
     }
-  }]), r;
-}(C), X = function(u) {
-  var r = arguments[0], e, s = N.Value;
-  return e = h(u.styles), /* @__PURE__ */ n.createElement(s, e.cn("SPageInputValue", v({}, d({
-    onBlur: function() {
-      return !1;
+  }]);
+  return TotalPages2;
+}(Component);
+var PageInputValue = function PageInputValue2(props) {
+  var _ref6 = arguments[0], _ref13;
+  var SPageInputValue = InputNumber.Value;
+  return _ref13 = sstyled(props.styles), /* @__PURE__ */ React.createElement(SPageInputValue, _ref13.cn("SPageInputValue", _objectSpread({}, assignProps({
+    "onBlur": function onBlur() {
+      return false;
     }
-  }, r))));
-}, Y = function(u) {
-  var r = arguments[0], e, s = N.Addon;
-  return e = h(u.styles), /* @__PURE__ */ n.createElement(s, e.cn("SPageInputAddon", v({}, d({}, r))));
-}, w = /* @__PURE__ */ function(_) {
-  y(r, _);
-  var u = T(r);
-  function r() {
-    return S(this, r), u.apply(this, arguments);
+  }, _ref6))));
+};
+var PageInputAddon = function PageInputAddon2(props) {
+  var _ref7 = arguments[0], _ref14;
+  var SPageInputAddon = InputNumber.Addon;
+  return _ref14 = sstyled(props.styles), /* @__PURE__ */ React.createElement(SPageInputAddon, _ref14.cn("SPageInputAddon", _objectSpread({}, assignProps({}, _ref7))));
+};
+var PageInput = /* @__PURE__ */ function(_Component6) {
+  _inherits(PageInput2, _Component6);
+  var _super6 = _createSuper(PageInput2);
+  function PageInput2() {
+    _classCallCheck(this, PageInput2);
+    return _super6.apply(this, arguments);
   }
-  return I(r, [{
+  _createClass(PageInput2, [{
     key: "render",
-    value: function() {
-      var s = this.asProps, g, f = N, t = E, a = this.asProps, i = a.Children, o = a.getI18nText, P = a.styles, p = a.uid, m = a.locale, b = a.size;
-      return g = h(P), /* @__PURE__ */ n.createElement(n.Fragment, null, /* @__PURE__ */ n.createElement(t, g.cn("SLabel", {
-        tag: "label",
-        htmlFor: "pagination-input-".concat(p),
-        size: b
-      }), o("pageInputLabel")), /* @__PURE__ */ n.createElement(f, g.cn("SPageInput", v({}, d({
-        controlsLength: i.origin ? void 0 : 2,
-        locale: m
-      }, s))), i.origin ? /* @__PURE__ */ n.createElement(i, g.cn("Children", {})) : /* @__PURE__ */ n.createElement(x.PageInput.Value, {
-        id: "pagination-input-".concat(p)
+    value: function render() {
+      var _ref8 = this.asProps, _ref15;
+      var SPageInput = InputNumber;
+      var SLabel = Text;
+      var _this$asProps9 = this.asProps, Children = _this$asProps9.Children, getI18nText = _this$asProps9.getI18nText, styles = _this$asProps9.styles, uid = _this$asProps9.uid, locale = _this$asProps9.locale, size = _this$asProps9.size;
+      return _ref15 = sstyled(styles), /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(SLabel, _ref15.cn("SLabel", {
+        "tag": "label",
+        "htmlFor": "pagination-input-".concat(uid),
+        "size": size
+      }), getI18nText("pageInputLabel")), /* @__PURE__ */ React.createElement(SPageInput, _ref15.cn("SPageInput", _objectSpread({}, assignProps({
+        "controlsLength": Children.origin ? void 0 : 2,
+        "locale": locale
+      }, _ref8))), Children.origin ? /* @__PURE__ */ React.createElement(Children, _ref15.cn("Children", {})) : /* @__PURE__ */ React.createElement(Pagination.PageInput.Value, {
+        id: "pagination-input-".concat(uid)
       })));
     }
-  }]), r;
-}(C);
-l(w, "enhance", [q()]);
-var x = O(j, {
-  PrevPage: F,
-  NextPage: V,
-  FirstPage: A,
-  TotalPages: Q,
-  PageInput: [w, {
-    Value: X,
-    Addon: Y
+  }]);
+  return PageInput2;
+}(Component);
+_defineProperty(PageInput, "enhance", [uniqueIDEnhancement()]);
+var Pagination = createComponent(PaginationRoot, {
+  PrevPage,
+  NextPage,
+  FirstPage,
+  TotalPages,
+  PageInput: [PageInput, {
+    Value: PageInputValue,
+    Addon: PageInputAddon
   }]
 });
 export {
-  x as default
+  Pagination as default
 };