@semcore/pagination 16.1.12 → 17.0.0-prerelease.18

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (17) hide show
  1. package/CHANGELOG.md +6 -0
  2. package/README.md +4 -4
  3. package/lib/cjs/Pagination.js +310 -347
  4. package/lib/cjs/Pagination.js.map +1 -1
  5. package/lib/cjs/index.d.js.map +1 -1
  6. package/lib/cjs/index.js +3 -3
  7. package/lib/cjs/translations/__intergalactic-dynamic-locales.js +17 -17
  8. package/lib/cjs/translations/__intergalactic-dynamic-locales.js.map +1 -1
  9. package/lib/es6/Pagination.js +302 -339
  10. package/lib/es6/Pagination.js.map +1 -1
  11. package/lib/es6/index.d.js.map +1 -1
  12. package/lib/es6/translations/__intergalactic-dynamic-locales.js +16 -16
  13. package/lib/es6/translations/__intergalactic-dynamic-locales.js.map +1 -1
  14. package/lib/esm/Pagination.mjs +278 -272
  15. package/lib/esm/translations/__intergalactic-dynamic-locales.mjs +1 -1
  16. package/lib/types/index.d.ts +3 -12
  17. package/package.json +11 -11
package/lib/esm/Pagination.mjs CHANGED
@@ -1,256 +1,275 @@
1
- import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
2
- import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
3
- import _classCallCheck from "@babel/runtime/helpers/esm/classCallCheck";
4
- import _createClass from "@babel/runtime/helpers/esm/createClass";
5
- import _callSuper from "@babel/runtime/helpers/esm/callSuper";
6
- import _inherits from "@babel/runtime/helpers/esm/inherits";
7
1
  import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
8
- import { createComponent, sstyled, assignProps, Component } from "@semcore/core";
2
+ import { createComponent, sstyled, Component, assignProps } from "@semcore/core";
3
+ import { Flex, ScreenReaderOnly, Hint } from "@semcore/base-components";
9
4
  import Button, { ButtonLink } from "@semcore/button";
10
5
  import i18nEnhance from "@semcore/core/lib/utils/enhances/i18nEnhance";
11
6
  import uniqueIDEnhancement from "@semcore/core/lib/utils/uniqueID";
12
- import { Flex, ScreenReaderOnly } from "@semcore/flex-box";
13
7
  import ChevronDoubleLeft from "@semcore/icon/ChevronDoubleLeft/m";
14
8
  import InputNumber from "@semcore/input-number";
15
- import { Hint } from "@semcore/tooltip";
16
9
  import { Text } from "@semcore/typography";
17
10
  import React from "react";
18
11
  import { localizedMessages } from "./translations/__intergalactic-dynamic-locales.mjs";
19
- var _excluded = ["styles", "getI18nText", "totalPages", "isLastOrSingle", "children"];
20
12
  /*!__reshadow-styles__:"./style/pagination.shadow.css"*/
21
- var style = (
13
+ const style = (
22
14
  /*__reshadow_css_start__*/
23
15
  (sstyled.insert(
24
16
  /*__inner_css_start__*/
25
- ".___SPagination_2y4s9_gg_{justify-content:flex-start;align-items:center}.___SPagination_2y4s9_gg_.__withGap_2y4s9_gg_{gap:var(--intergalactic-spacing-4x, 16px)}.___SPagination_2y4s9_gg_.__withGap_2y4s9_gg_._size_l_2y4s9_gg_{gap:var(--intergalactic-spacing-5x, 20px)}.___SNextPage_2y4s9_gg_,.___SPrevPage_2y4s9_gg_{align-self:center;margin-left:var(--intergalactic-spacing-2x, 8px)}.___SNextPage_2y4s9_gg_._size_l_2y4s9_gg_,.___SPrevPage_2y4s9_gg_._size_l_2y4s9_gg_{margin-left:var(--intergalactic-spacing-3x, 12px)}.___SLabel_2y4s9_gg_{color:var(--intergalactic-text-primary, #191b23)}.___SLabel_2y4s9_gg_:not(:first-child){margin-left:var(--intergalactic-spacing-4x, 16px)}.___SLabel_2y4s9_gg_._size_l_2y4s9_gg_:not(:first-child){margin-left:var(--intergalactic-spacing-5x, 20px)}.___STotalPages_2y4s9_gg_{align-self:center;line-height:normal;color:var(--intergalactic-text-link, #006dca)}.___STotalPagesLabel_2y4s9_gg_{margin-left:var(--intergalactic-spacing-2x, 8px);margin-right:var(--intergalactic-spacing-1x, 4px);color:var(--intergalactic-text-primary, #191b23)}.___STotalLastPages_2y4s9_gg_{font-size:var(--intergalactic-fs-200, 14px);line-height:var(--intergalactic-lh-200, 142%);color:var(--intergalactic-text-primary, #191b23)}.___STotalLastPages_2y4s9_gg_._size_l_2y4s9_gg_{font-size:var(--intergalactic-fs-300, 16px);line-height:var(--intergalactic-lh-300, 150%)}.___SPageInput_2y4s9_gg_{max-width:68px;margin-left:var(--intergalactic-spacing-1x, 4px)}.___SPageInput_2y4s9_gg_._size_l_2y4s9_gg_{margin-left:var(--intergalactic-spacing-2x, 8px)}.___SPageInput_2y4s9_gg_:focus-within .___SPageInputAddon_2y4s9_gg_{opacity:1;clip:initial;position:static}.___SPageInputAddon_2y4s9_gg_{opacity:0;clip:rect(1px,1px,1px,1px);position:absolute}.___SLabel_2y4s9_gg_,.___STotalPagesLabel_2y4s9_gg_,.___STotalPages_2y4s9_gg_{font-size:var(--intergalactic-fs-200, 14px);line-height:var(--intergalactic-lh-200, 142%)}.___SLabel_2y4s9_gg_._size_l_2y4s9_gg_,.___STotalPagesLabel_2y4s9_gg_._size_l_2y4s9_gg_,.___STotalPages_2y4s9_gg_._size_l_2y4s9_gg_{font-size:var(--intergalactic-fs-300, 16px);line-height:var(--intergalactic-lh-300, 150%)}",
17
+ ".___SPagination_4tsjh_gg_{justify-content:flex-start;align-items:center}.___SPagination_4tsjh_gg_.__withGap_4tsjh_gg_{gap:var(--intergalactic-spacing-4x, 16px)}.___SPagination_4tsjh_gg_.__withGap_4tsjh_gg_._size_l_4tsjh_gg_{gap:var(--intergalactic-spacing-5x, 20px)}.___SNextPage_4tsjh_gg_,.___SPrevPage_4tsjh_gg_{align-self:center;margin-left:var(--intergalactic-spacing-2x, 8px)}.___SNextPage_4tsjh_gg_._size_l_4tsjh_gg_,.___SPrevPage_4tsjh_gg_._size_l_4tsjh_gg_{margin-left:var(--intergalactic-spacing-3x, 12px)}.___SLabel_4tsjh_gg_{color:var(--intergalactic-text-primary, #191b23)}.___SLabel_4tsjh_gg_:not(:first-child){margin-left:var(--intergalactic-spacing-4x, 16px)}.___SLabel_4tsjh_gg_._size_l_4tsjh_gg_:not(:first-child){margin-left:var(--intergalactic-spacing-5x, 20px)}.___STotalPages_4tsjh_gg_{align-self:center;line-height:normal;color:var(--intergalactic-text-link, #006dca)}.___STotalPagesLabel_4tsjh_gg_{margin-left:var(--intergalactic-spacing-2x, 8px);margin-right:var(--intergalactic-spacing-1x, 4px);color:var(--intergalactic-text-primary, #191b23)}.___STotalLastPages_4tsjh_gg_{font-size:var(--intergalactic-fs-200, 14px);line-height:var(--intergalactic-lh-200, 142%);color:var(--intergalactic-text-primary, #191b23)}.___STotalLastPages_4tsjh_gg_._size_l_4tsjh_gg_{font-size:var(--intergalactic-fs-300, 16px);line-height:var(--intergalactic-lh-300, 150%)}.___SPageInput_4tsjh_gg_{max-width:68px;margin-left:var(--intergalactic-spacing-1x, 4px)}.___SPageInput_4tsjh_gg_._size_l_4tsjh_gg_{margin-left:var(--intergalactic-spacing-2x, 8px)}.___SPageInput_4tsjh_gg_:focus-within .___SPageInputAddon_4tsjh_gg_{opacity:1;clip:initial;position:static}.___SPageInputAddon_4tsjh_gg_{opacity:0;clip:rect(1px,1px,1px,1px);position:absolute}.___SLabel_4tsjh_gg_,.___STotalPagesLabel_4tsjh_gg_,.___STotalPages_4tsjh_gg_{font-size:var(--intergalactic-fs-200, 14px);line-height:var(--intergalactic-lh-200, 142%)}.___SLabel_4tsjh_gg_._size_l_4tsjh_gg_,.___STotalPagesLabel_4tsjh_gg_._size_l_4tsjh_gg_,.___STotalPages_4tsjh_gg_._size_l_4tsjh_gg_{font-size:var(--intergalactic-fs-300, 16px);line-height:var(--intergalactic-lh-300, 150%)}",
26
18
  /*__inner_css_end__*/
27
- "2y4s9_gg_"
19
+ "4tsjh_gg_"
28
20
  ), /*__reshadow_css_end__*/
29
21
  {
30
- "__SPagination": "___SPagination_2y4s9_gg_",
31
- "__SLabel": "___SLabel_2y4s9_gg_",
32
- "_size_l": "_size_l_2y4s9_gg_",
33
- "__STotalPages": "___STotalPages_2y4s9_gg_",
34
- "__STotalPagesLabel": "___STotalPagesLabel_2y4s9_gg_",
35
- "__SPageInput": "___SPageInput_2y4s9_gg_",
36
- "__SPageInputAddon": "___SPageInputAddon_2y4s9_gg_",
37
- "_withGap": "__withGap_2y4s9_gg_",
38
- "__SNextPage": "___SNextPage_2y4s9_gg_",
39
- "__SPrevPage": "___SPrevPage_2y4s9_gg_",
40
- "__STotalLastPages": "___STotalLastPages_2y4s9_gg_"
22
+ "__SPagination": "___SPagination_4tsjh_gg_",
23
+ "__SLabel": "___SLabel_4tsjh_gg_",
24
+ "_size_l": "_size_l_4tsjh_gg_",
25
+ "__STotalPages": "___STotalPages_4tsjh_gg_",
26
+ "__STotalPagesLabel": "___STotalPagesLabel_4tsjh_gg_",
27
+ "__SPageInput": "___SPageInput_4tsjh_gg_",
28
+ "__SPageInputAddon": "___SPageInputAddon_4tsjh_gg_",
29
+ "_withGap": "__withGap_4tsjh_gg_",
30
+ "__SNextPage": "___SNextPage_4tsjh_gg_",
31
+ "__SPrevPage": "___SPrevPage_4tsjh_gg_",
32
+ "__STotalLastPages": "___STotalLastPages_4tsjh_gg_"
41
33
  })
42
34
  );
43
- var PaginationRoot = /* @__PURE__ */ (function(_Component) {
44
- function PaginationRoot2() {
45
- var _this;
46
- _classCallCheck(this, PaginationRoot2);
47
- for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
48
- args[_key] = arguments[_key];
49
- }
50
- _this = _callSuper(this, PaginationRoot2, [].concat(args));
51
- _defineProperty(_this, "nextPageButtonRef", /* @__PURE__ */ React.createRef());
52
- _defineProperty(_this, "prevPageButtonRef", /* @__PURE__ */ React.createRef());
53
- _defineProperty(_this, "state", {
35
+ class PaginationRoot extends Component {
36
+ constructor(...args) {
37
+ super(...args);
38
+ _defineProperty(this, "nextPageButtonRef", /* @__PURE__ */ React.createRef());
39
+ _defineProperty(this, "prevPageButtonRef", /* @__PURE__ */ React.createRef());
40
+ _defineProperty(this, "state", {
54
41
  // Crutch, so as not to take out `dirtyCurrentPage` in props
55
42
  dirtyCurrentPage: void 0
56
43
  });
57
- _defineProperty(_this, "pageInputAddonRef", /* @__PURE__ */ React.createRef());
58
- _defineProperty(_this, "returnLostFocusTo", function(ref) {
59
- requestAnimationFrame(function() {
60
- var _ref$current;
61
- (_ref$current = ref.current) === null || _ref$current === void 0 || _ref$current.focus();
44
+ _defineProperty(this, "pageInputAddonRef", /* @__PURE__ */ React.createRef());
45
+ _defineProperty(this, "returnLostFocusTo", (ref) => {
46
+ requestAnimationFrame(() => {
47
+ var _a;
48
+ (_a = ref.current) == null ? void 0 : _a.focus();
62
49
  });
63
50
  });
64
- _defineProperty(_this, "handlePageChange", function(currentPage) {
51
+ _defineProperty(this, "handlePageChange", (currentPage) => {
65
52
  currentPage = Number(currentPage);
66
53
  if (Number.isNaN(currentPage)) {
67
54
  return;
68
55
  }
69
- _this.handlers.currentPage(currentPage);
70
- _this.setState({
56
+ this.handlers.currentPage(currentPage);
57
+ this.setState({
71
58
  dirtyCurrentPage: void 0
72
59
  });
73
60
  });
74
- _defineProperty(_this, "handlePageValueChange", function(value) {
75
- var dirtyCurrentPage = _this.state.dirtyCurrentPage;
61
+ _defineProperty(this, "handlePageValueChange", (value) => {
62
+ const {
63
+ dirtyCurrentPage
64
+ } = this.state;
76
65
  if (Number.isNaN(Number(value))) {
77
66
  value = dirtyCurrentPage;
78
67
  }
79
- _this.setState({
68
+ this.setState({
80
69
  dirtyCurrentPage: value
81
70
  });
82
71
  });
83
- _defineProperty(_this, "handlePageValueBlur", function() {
84
- setTimeout(function() {
85
- if (_this.pageInputAddonRef.current !== document.activeElement) {
86
- var currentPage = _this.asProps.currentPage;
87
- _this.setState({
72
+ _defineProperty(this, "handlePageValueBlur", () => {
73
+ setTimeout(() => {
74
+ if (this.pageInputAddonRef.current !== document.activeElement) {
75
+ const {
76
+ currentPage
77
+ } = this.asProps;
78
+ this.setState({
88
79
  dirtyCurrentPage: currentPage
89
80
  });
90
81
  }
91
82
  }, 0);
92
83
  });
93
- _defineProperty(_this, "getDirtyCurrentPage", function() {
94
- var dirtyCurrentPage = _this.state.dirtyCurrentPage;
95
- var totalPages = _this.asProps.totalPages;
96
- var finalValue = dirtyCurrentPage > totalPages ? totalPages : dirtyCurrentPage;
84
+ _defineProperty(this, "getDirtyCurrentPage", () => {
85
+ const {
86
+ dirtyCurrentPage
87
+ } = this.state;
88
+ const {
89
+ totalPages
90
+ } = this.asProps;
91
+ const finalValue = dirtyCurrentPage > totalPages ? totalPages : dirtyCurrentPage;
97
92
  return finalValue <= 0 ? 1 : finalValue;
98
93
  });
99
- _defineProperty(_this, "handlePageInputIconClick", function() {
100
- var dirtyCurrentPage = _this.getDirtyCurrentPage();
101
- _this.handlePageChange(dirtyCurrentPage);
102
- });
103
- _defineProperty(_this, "handlePageInputKeyDown", function(event) {
94
+ _defineProperty(this, "handlePageInputKeyDown", (event) => {
104
95
  if (event.key !== "Enter") return;
105
- var dirtyCurrentPage = _this.getDirtyCurrentPage();
106
- _this.handlePageChange(dirtyCurrentPage);
96
+ const dirtyCurrentPage = this.getDirtyCurrentPage();
97
+ this.handlePageChange(dirtyCurrentPage);
107
98
  });
108
- _defineProperty(_this, "getFirstPageProps", function() {
109
- var _this$asProps = _this.asProps, currentPage = _this$asProps.currentPage, getI18nText = _this$asProps.getI18nText, size = _this$asProps.size;
110
- var disabled = currentPage <= 1;
99
+ _defineProperty(this, "getFirstPageProps", () => {
100
+ const {
101
+ currentPage,
102
+ getI18nText,
103
+ size
104
+ } = this.asProps;
105
+ const disabled = currentPage <= 1;
111
106
  return {
112
107
  disabled,
113
- onClick: function onClick() {
114
- _this.handlePageChange(1);
115
- _this.returnLostFocusTo(_this.nextPageButtonRef);
108
+ onClick: () => {
109
+ this.handlePageChange(1);
110
+ this.returnLostFocusTo(this.nextPageButtonRef);
116
111
  },
117
112
  getI18nText,
118
113
  size
119
114
  };
120
115
  });
121
- _defineProperty(_this, "getPrevPageProps", function() {
122
- var _this$asProps2 = _this.asProps, currentPage = _this$asProps2.currentPage, getI18nText = _this$asProps2.getI18nText, size = _this$asProps2.size;
123
- var disabled = currentPage <= 1;
116
+ _defineProperty(this, "getPrevPageProps", () => {
117
+ const {
118
+ currentPage,
119
+ getI18nText,
120
+ size
121
+ } = this.asProps;
122
+ const disabled = currentPage <= 1;
124
123
  return {
125
124
  currentPage,
126
125
  disabled,
127
- onClick: function onClick() {
128
- var followingPage = currentPage - 1;
129
- _this.handlePageChange(followingPage);
126
+ onClick: () => {
127
+ const followingPage = currentPage - 1;
128
+ this.handlePageChange(followingPage);
130
129
  if (followingPage <= 1) {
131
- _this.returnLostFocusTo(_this.nextPageButtonRef);
130
+ this.returnLostFocusTo(this.nextPageButtonRef);
132
131
  }
133
132
  },
134
133
  getI18nText,
135
- ref: _this.prevPageButtonRef,
134
+ ref: this.prevPageButtonRef,
136
135
  size
137
136
  };
138
137
  });
139
- _defineProperty(_this, "getNextPageProps", function() {
140
- var _this$asProps3 = _this.asProps, currentPage = _this$asProps3.currentPage, totalPages = _this$asProps3.totalPages, getI18nText = _this$asProps3.getI18nText, size = _this$asProps3.size;
141
- var disabled = currentPage >= totalPages;
138
+ _defineProperty(this, "getNextPageProps", () => {
139
+ const {
140
+ currentPage,
141
+ totalPages,
142
+ getI18nText,
143
+ size
144
+ } = this.asProps;
145
+ const disabled = currentPage >= totalPages;
142
146
  return {
143
147
  currentPage,
144
148
  disabled,
145
- onClick: function onClick() {
146
- var followingPage = currentPage + 1;
147
- _this.handlePageChange(followingPage);
149
+ onClick: () => {
150
+ const followingPage = currentPage + 1;
151
+ this.handlePageChange(followingPage);
148
152
  if (followingPage >= totalPages) {
149
- _this.returnLostFocusTo(_this.prevPageButtonRef);
153
+ this.returnLostFocusTo(this.prevPageButtonRef);
150
154
  }
151
155
  },
152
156
  getI18nText,
153
- ref: _this.nextPageButtonRef,
157
+ ref: this.nextPageButtonRef,
154
158
  size
155
159
  };
156
160
  });
157
- _defineProperty(_this, "getPageInputProps", function() {
158
- var _this$asProps4 = _this.asProps, getI18nText = _this$asProps4.getI18nText, locale = _this$asProps4.locale, size = _this$asProps4.size;
161
+ _defineProperty(this, "getPageInputProps", () => {
162
+ const {
163
+ getI18nText,
164
+ locale,
165
+ size
166
+ } = this.asProps;
159
167
  return {
160
168
  getI18nText,
161
169
  locale,
162
170
  size,
163
- paginationInputId: _this.paginationInputId
171
+ paginationInputId: this.paginationInputId
164
172
  };
165
173
  });
166
- _defineProperty(_this, "getPageInputAddonProps", function() {
174
+ _defineProperty(this, "getPageInputAddonProps", () => {
167
175
  return {
168
- onClick: _this.handlePageInputIconClick,
169
- ref: _this.pageInputAddonRef,
170
- onBlur: _this.handlePageValueBlur
176
+ ref: this.pageInputAddonRef,
177
+ onBlur: this.handlePageValueBlur
171
178
  };
172
179
  });
173
- _defineProperty(_this, "getPageInputValueProps", function() {
174
- var dirtyCurrentPage = _this.state.dirtyCurrentPage;
175
- var _this$asProps5 = _this.asProps, currentPage = _this$asProps5.currentPage, totalPages = _this$asProps5.totalPages, getI18nText = _this$asProps5.getI18nText, size = _this$asProps5.size;
180
+ _defineProperty(this, "getPageInputValueProps", () => {
181
+ const {
182
+ dirtyCurrentPage
183
+ } = this.state;
184
+ const {
185
+ currentPage,
186
+ totalPages,
187
+ getI18nText,
188
+ size
189
+ } = this.asProps;
176
190
  return {
177
191
  min: 1,
178
192
  max: totalPages,
179
193
  disabled: totalPages === 1,
180
194
  value: dirtyCurrentPage === void 0 ? currentPage : dirtyCurrentPage,
181
- onBlur: _this.handlePageValueBlur,
182
- onChange: _this.handlePageValueChange,
183
- onKeyDown: _this.handlePageInputKeyDown,
195
+ onBlur: this.handlePageValueBlur,
196
+ onChange: this.handlePageValueChange,
197
+ onKeyDown: this.handlePageInputKeyDown,
184
198
  getI18nText,
185
199
  size,
186
- id: _this.paginationInputId
200
+ id: this.paginationInputId
187
201
  };
188
202
  });
189
- _defineProperty(_this, "getTotalPagesProps", function() {
190
- 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;
191
- var formatter = new Intl.NumberFormat(locale, {
203
+ _defineProperty(this, "getTotalPagesProps", () => {
204
+ const {
205
+ currentPage,
206
+ totalPages,
207
+ getI18nText,
208
+ locale,
209
+ size
210
+ } = this.asProps;
211
+ const formatter = new Intl.NumberFormat(locale, {
192
212
  style: "decimal"
193
213
  });
194
214
  return {
195
215
  totalPages,
196
216
  children: formatter.format(totalPages),
197
217
  isLastOrSingle: currentPage === totalPages,
198
- onClick: function onClick() {
199
- _this.handlePageChange(totalPages);
200
- _this.returnLostFocusTo(_this.prevPageButtonRef);
218
+ onClick: () => {
219
+ this.handlePageChange(totalPages);
220
+ this.returnLostFocusTo(this.prevPageButtonRef);
201
221
  },
202
222
  getI18nText,
203
223
  size
204
224
  };
205
225
  });
206
- return _this;
207
226
  }
208
- _inherits(PaginationRoot2, _Component);
209
- return _createClass(PaginationRoot2, [{
210
- key: "uncontrolledProps",
211
- value: function uncontrolledProps() {
212
- return {
213
- totalPages: null,
214
- currentPage: null
215
- };
216
- }
217
- }, {
218
- key: "componentDidUpdate",
219
- value: function componentDidUpdate(prevProps) {
220
- if (prevProps.currentPage !== void 0 && prevProps.currentPage !== this.asProps.currentPage) {
221
- this.setState({
222
- dirtyCurrentPage: void 0
223
- });
224
- }
225
- }
226
- }, {
227
- key: "paginationInputId",
228
- get: function get() {
229
- var uid = this.asProps.uid;
230
- return "pagination-input-".concat(uid);
227
+ uncontrolledProps() {
228
+ return {
229
+ totalPages: null,
230
+ currentPage: null
231
+ };
232
+ }
233
+ componentDidUpdate(prevProps) {
234
+ if (prevProps.currentPage !== void 0 && prevProps.currentPage !== this.asProps.currentPage) {
235
+ this.setState({
236
+ dirtyCurrentPage: void 0
237
+ });
231
238
  }
232
- }, {
233
- key: "render",
234
- value: function render() {
235
- var _ref = this.asProps, _ref9;
236
- var SPagination = Flex;
237
- 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;
238
- return _ref9 = sstyled(this.asProps.styles), /* @__PURE__ */ React.createElement(SPagination, _ref9.cn("SPagination", _objectSpread({}, assignProps({
239
+ }
240
+ get paginationInputId() {
241
+ const {
242
+ uid
243
+ } = this.asProps;
244
+ return `pagination-input-${uid}`;
245
+ }
246
+ render() {
247
+ var _ref = this.asProps, _ref9;
248
+ const SPagination = Flex;
249
+ const {
250
+ Children,
251
+ children: hasChildren,
252
+ getI18nText,
253
+ currentPage,
254
+ totalPages = 1
255
+ } = this.asProps;
256
+ return _ref9 = sstyled(this.asProps.styles), /* @__PURE__ */ React.createElement(SPagination, _ref9.cn("SPagination", {
257
+ ...assignProps({
239
258
  "flexWrap": "wrap",
240
259
  "withGap": !hasChildren,
241
260
  "tag": "nav",
242
261
  "aria-label": getI18nText("pagination")
243
- }, _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", {
244
- "alignItems": "center"
245
- }), /* @__PURE__ */ React.createElement(Pagination.PageInput, null), /* @__PURE__ */ React.createElement(Pagination.TotalPages, null))), /* @__PURE__ */ React.createElement(ScreenReaderOnly, _ref9.cn("ScreenReaderOnly", {
246
- "aria-live": "polite",
247
- "role": "status"
248
- }), getI18nText("pageInputLabel"), " ", currentPage));
249
- }
250
- }]);
251
- })(Component);
262
+ }, _ref)
263
+ }), 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", {
264
+ "alignItems": "center"
265
+ }), /* @__PURE__ */ React.createElement(Pagination.PageInput, null), /* @__PURE__ */ React.createElement(Pagination.TotalPages, null))), /* @__PURE__ */ React.createElement(ScreenReaderOnly, _ref9.cn("ScreenReaderOnly", {
266
+ "aria-live": "polite",
267
+ "role": "status"
268
+ }), getI18nText("pageInputLabel"), " ", currentPage));
269
+ }
270
+ }
252
271
  _defineProperty(PaginationRoot, "displayName", "Pagination");
253
- _defineProperty(PaginationRoot, "defaultProps", function() {
272
+ _defineProperty(PaginationRoot, "defaultProps", () => {
254
273
  return {
255
274
  defaultCurrentPage: 1,
256
275
  defaultTotalPages: 1,
@@ -261,147 +280,134 @@ _defineProperty(PaginationRoot, "defaultProps", function() {
261
280
  });
262
281
  _defineProperty(PaginationRoot, "style", style);
263
282
  _defineProperty(PaginationRoot, "enhance", [i18nEnhance(localizedMessages), uniqueIDEnhancement()]);
264
- var FirstPage = /* @__PURE__ */ (function(_Component2) {
265
- function FirstPage2() {
266
- _classCallCheck(this, FirstPage2);
267
- return _callSuper(this, FirstPage2, arguments);
283
+ class FirstPage extends Component {
284
+ constructor(...args) {
285
+ super(...args);
286
+ _defineProperty(this, "buttonRef", /* @__PURE__ */ React.createRef());
268
287
  }
269
- _inherits(FirstPage2, _Component2);
270
- return _createClass(FirstPage2, [{
271
- key: "render",
272
- value: function render() {
273
- var _ref2 = this.asProps;
274
- var getI18nText = this.asProps.getI18nText;
275
- return /* @__PURE__ */ React.createElement(Button, assignProps({
276
- "aria-label": getI18nText("firstPage")
277
- }, _ref2));
278
- }
279
- }]);
280
- })(Component);
281
- _defineProperty(FirstPage, "defaultProps", function(props) {
282
- var hintContent = props.getI18nText("firstPage");
283
- return {
284
- children: /* @__PURE__ */ React.createElement(Button.Addon, {
285
- tag: Hint,
286
- title: hintContent,
287
- timeout: [250, 50],
288
- __excludeProps: ["aria-label"]
289
- }, /* @__PURE__ */ React.createElement(ChevronDoubleLeft, null))
290
- };
291
- });
292
- var PrevPage = /* @__PURE__ */ (function(_Component3) {
293
- function PrevPage2() {
294
- _classCallCheck(this, PrevPage2);
295
- return _callSuper(this, PrevPage2, arguments);
288
+ render() {
289
+ var _ref2 = this.asProps;
290
+ const {
291
+ getI18nText,
292
+ Children,
293
+ children,
294
+ disabled
295
+ } = this.asProps;
296
+ const hintContent = getI18nText("firstPage");
297
+ const isAdvanced = children !== void 0;
298
+ return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(Button, assignProps({
299
+ "aria-label": getI18nText("firstPage"),
300
+ "ref": this.buttonRef
301
+ }, _ref2), isAdvanced ? /* @__PURE__ */ React.createElement(Children, null) : /* @__PURE__ */ React.createElement(Button.Addon, {
302
+ tag: ChevronDoubleLeft
303
+ })), !isAdvanced && /* @__PURE__ */ React.createElement(Hint, {
304
+ triggerRef: this.buttonRef,
305
+ timeout: [250, 50]
306
+ }, hintContent));
296
307
  }
297
- _inherits(PrevPage2, _Component3);
298
- return _createClass(PrevPage2, [{
299
- key: "render",
300
- value: function render() {
301
- var _ref3 = this.asProps, _ref0;
302
- var SPrevPage = Button;
303
- return _ref0 = sstyled(this.asProps.styles), /* @__PURE__ */ React.createElement(SPrevPage, _ref0.cn("SPrevPage", _objectSpread({}, assignProps({}, _ref3))));
304
- }
305
- }]);
306
- })(Component);
307
- _defineProperty(PrevPage, "defaultProps", function(props) {
308
- return {
309
- children: props.getI18nText("prevPageLabel")
310
- };
311
- });
312
- var NextPage = /* @__PURE__ */ (function(_Component4) {
313
- function NextPage2() {
314
- _classCallCheck(this, NextPage2);
315
- return _callSuper(this, NextPage2, arguments);
308
+ }
309
+ class PrevPage extends Component {
310
+ render() {
311
+ var _ref3 = this.asProps, _ref0;
312
+ const SPrevPage = Button;
313
+ return _ref0 = sstyled(this.asProps.styles), /* @__PURE__ */ React.createElement(SPrevPage, _ref0.cn("SPrevPage", {
314
+ ...assignProps({}, _ref3)
315
+ }));
316
316
  }
317
- _inherits(NextPage2, _Component4);
318
- return _createClass(NextPage2, [{
319
- key: "render",
320
- value: function render() {
321
- var _ref4 = this.asProps, _ref1;
322
- var SNextPage = Button;
323
- return _ref1 = sstyled(this.asProps.styles), /* @__PURE__ */ React.createElement(SNextPage, _ref1.cn("SNextPage", _objectSpread({}, assignProps({
317
+ }
318
+ _defineProperty(PrevPage, "defaultProps", (props) => ({
319
+ children: props.getI18nText("prevPageLabel")
320
+ }));
321
+ class NextPage extends Component {
322
+ render() {
323
+ var _ref4 = this.asProps, _ref1;
324
+ const SNextPage = Button;
325
+ return _ref1 = sstyled(this.asProps.styles), /* @__PURE__ */ React.createElement(SNextPage, _ref1.cn("SNextPage", {
326
+ ...assignProps({
324
327
  "use": "primary",
325
328
  "theme": "info"
326
- }, _ref4))));
327
- }
328
- }]);
329
- })(Component);
330
- _defineProperty(NextPage, "defaultProps", function(props) {
331
- return {
332
- children: props.getI18nText("nextPageLabel")
333
- };
334
- });
335
- var TotalPages = /* @__PURE__ */ (function(_Component5) {
336
- function TotalPages2() {
337
- _classCallCheck(this, TotalPages2);
338
- return _callSuper(this, TotalPages2, arguments);
329
+ }, _ref4)
330
+ }));
339
331
  }
340
- _inherits(TotalPages2, _Component5);
341
- return _createClass(TotalPages2, [{
342
- key: "render",
343
- value: function render() {
344
- var _ref5 = this.asProps, _ref10;
345
- var STotalPages = ButtonLink;
346
- var STotalPagesLabel = Text;
347
- var STotalLastPages = Text;
348
- 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);
349
- var textSize = other.size === "l" ? "300" : "200";
350
- return _ref10 = sstyled(styles), /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(STotalPagesLabel, _ref10.cn("STotalPagesLabel", {
351
- "size": textSize
352
- }), getI18nText("totalPagesLabel")), isLastOrSingle ? /* @__PURE__ */ React.createElement(STotalLastPages, _ref10.cn("STotalLastPages", _objectSpread({
353
- "size": textSize,
332
+ }
333
+ _defineProperty(NextPage, "defaultProps", (props) => ({
334
+ children: props.getI18nText("nextPageLabel")
335
+ }));
336
+ class TotalPages extends Component {
337
+ render() {
338
+ var _ref5 = this.asProps, _ref10;
339
+ const STotalPages = ButtonLink;
340
+ const STotalPagesLabel = Text;
341
+ const STotalLastPages = Text;
342
+ const {
343
+ styles,
344
+ getI18nText,
345
+ totalPages,
346
+ isLastOrSingle,
347
+ children,
348
+ ...other
349
+ } = this.asProps;
350
+ const textSize = other.size === "l" ? "300" : "200";
351
+ return _ref10 = sstyled(styles), /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(STotalPagesLabel, _ref10.cn("STotalPagesLabel", {
352
+ "size": textSize
353
+ }), getI18nText("totalPagesLabel")), isLastOrSingle ? /* @__PURE__ */ React.createElement(STotalLastPages, _ref10.cn("STotalLastPages", {
354
+ "size": textSize,
355
+ "aria-label": getI18nText("lastPage", {
356
+ lastPageNumber: totalPages
357
+ }),
358
+ ...other
359
+ }), children) : /* @__PURE__ */ React.createElement(STotalPages, _ref10.cn("STotalPages", {
360
+ ...assignProps({
354
361
  "aria-label": getI18nText("lastPage", {
355
362
  lastPageNumber: totalPages
356
363
  })
357
- }, other)), children) : /* @__PURE__ */ React.createElement(STotalPages, _ref10.cn("STotalPages", _objectSpread({}, assignProps({
358
- "aria-label": getI18nText("lastPage", {
359
- lastPageNumber: totalPages
360
- })
361
- }, _ref5)))));
362
- }
363
- }]);
364
- })(Component);
365
- var PageInputValue = function PageInputValue2(props) {
364
+ }, _ref5)
365
+ })));
366
+ }
367
+ }
368
+ function PageInputValue(props) {
366
369
  var _ref6 = arguments[0], _ref11;
367
- var SPageInputValue = InputNumber.Value;
368
- return _ref11 = sstyled(props.styles), /* @__PURE__ */ React.createElement(SPageInputValue, _ref11.cn("SPageInputValue", _objectSpread({}, assignProps({
369
- "onBlur": function onBlur() {
370
- return false;
371
- }
372
- }, _ref6))));
373
- };
374
- var PageInputAddon = function PageInputAddon2(props) {
370
+ const SPageInputValue = InputNumber.Value;
371
+ return _ref11 = sstyled(props.styles), /* @__PURE__ */ React.createElement(SPageInputValue, _ref11.cn("SPageInputValue", {
372
+ ...assignProps({
373
+ "onBlur": () => false
374
+ }, _ref6)
375
+ }));
376
+ }
377
+ function PageInputAddon(props) {
375
378
  var _ref7 = arguments[0], _ref12;
376
- var SPageInputAddon = InputNumber.Addon;
377
- return _ref12 = sstyled(props.styles), /* @__PURE__ */ React.createElement(SPageInputAddon, _ref12.cn("SPageInputAddon", _objectSpread({}, assignProps({}, _ref7))));
378
- };
379
- var PageInput = /* @__PURE__ */ (function(_Component6) {
380
- function PageInput2() {
381
- _classCallCheck(this, PageInput2);
382
- return _callSuper(this, PageInput2, arguments);
383
- }
384
- _inherits(PageInput2, _Component6);
385
- return _createClass(PageInput2, [{
386
- key: "render",
387
- value: function render() {
388
- var _ref8 = this.asProps, _ref13;
389
- var SPageInput = InputNumber;
390
- var SLabel = Text;
391
- var _this$asProps9 = this.asProps, Children = _this$asProps9.Children, getI18nText = _this$asProps9.getI18nText, styles = _this$asProps9.styles, locale = _this$asProps9.locale, size = _this$asProps9.size, paginationInputId = _this$asProps9.paginationInputId;
392
- return _ref13 = sstyled(styles), /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(SLabel, _ref13.cn("SLabel", {
393
- "tag": "label",
394
- "htmlFor": paginationInputId,
395
- "size": size
396
- }), getI18nText("pageInputLabel")), /* @__PURE__ */ React.createElement(SPageInput, _ref13.cn("SPageInput", _objectSpread({}, assignProps({
379
+ const SPageInputAddon = InputNumber.Addon;
380
+ return _ref12 = sstyled(props.styles), /* @__PURE__ */ React.createElement(SPageInputAddon, _ref12.cn("SPageInputAddon", {
381
+ ...assignProps({}, _ref7)
382
+ }));
383
+ }
384
+ class PageInput extends Component {
385
+ render() {
386
+ var _ref8 = this.asProps, _ref13;
387
+ const SPageInput = InputNumber;
388
+ const SLabel = Text;
389
+ const {
390
+ Children,
391
+ getI18nText,
392
+ styles,
393
+ locale,
394
+ size,
395
+ paginationInputId
396
+ } = this.asProps;
397
+ return _ref13 = sstyled(styles), /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(SLabel, _ref13.cn("SLabel", {
398
+ "tag": "label",
399
+ "htmlFor": paginationInputId,
400
+ "size": size
401
+ }), getI18nText("pageInputLabel")), /* @__PURE__ */ React.createElement(SPageInput, _ref13.cn("SPageInput", {
402
+ ...assignProps({
397
403
  "controlsLength": Children.origin ? void 0 : 2,
398
404
  "locale": locale
399
- }, _ref8))), Children.origin ? /* @__PURE__ */ React.createElement(Children, _ref13.cn("Children", {})) : /* @__PURE__ */ React.createElement(Pagination.PageInput.Value, null)));
400
- }
401
- }]);
402
- })(Component);
405
+ }, _ref8)
406
+ }), Children.origin ? /* @__PURE__ */ React.createElement(Children, _ref13.cn("Children", {})) : /* @__PURE__ */ React.createElement(Pagination.PageInput.Value, null)));
407
+ }
408
+ }
403
409
  _defineProperty(PageInput, "enhance", [uniqueIDEnhancement()]);
404
- var Pagination = createComponent(PaginationRoot, {
410
+ const Pagination = createComponent(PaginationRoot, {
405
411
  PrevPage,
406
412
  NextPage,
407
413
  FirstPage,