@portnet/ui 6.0.2 → 6.0.3

package/dist/v2/patterns/_dataGridShared.js

@@ -21,20 +21,13 @@ var _Select = _interopRequireDefault(require("@mui/material/Select"));
 var _MenuItem = _interopRequireDefault(require("@mui/material/MenuItem"));
 var _mergeLabels = require("../utils/mergeLabels");
 var _jsxRuntime = require("react/jsx-runtime");
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
-function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
-function _createForOfIteratorHelper(o, allowArrayLike) { var it = typeof Symbol !== "undefined" && o[Symbol.iterator] || o["@@iterator"]; if (!it) { if (Array.isArray(o) || (it = _unsupportedIterableToArray(o)) || allowArrayLike && o && typeof o.length === "number") { if (it) o = it; var i = 0; var F = function F() {}; return { s: F, n: function n() { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }, e: function e(_e) { throw _e; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var normalCompletion = true, didErr = false, err; return { s: function s() { it = it.call(o); }, n: function n() { var step = it.next(); normalCompletion = step.done; return step; }, e: function e(_e2) { didErr = true; err = _e2; }, f: function f() { try { if (!normalCompletion && it["return"] != null) it["return"](); } finally { if (didErr) throw err; } } }; }
-function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
-function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
-function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
-function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); } /**
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
+/**
  * _dataGridShared — Portnet UI v2 (private)
- */ /**
+ */
+
+/**
  * Strips optionality AND an explicitly-declared `| undefined`.
  *
  * `Required<T>` is NOT sufficient here, and the difference is invisible until it
@@ -48,20 +41,21 @@ function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input ==
  * `Exclude<T[K], undefined>` removes it for real. Behaviour is identical to what
  * `Required<>` produced BEFORE the optional props were widened — this restores
  * the original intent rather than changing it.
- */ /**
+ */
+
+/**
  * Fully-resolved (all-present) label shapes. The public DataGridLabels /
  * DataGridPaginationLabels (../types/datagrid) are the OVERRIDE shapes (every
  * field optional). After mergeLabels every field is guaranteed present, so the
  * renderers (Pagination, DataGrid) read them without optional access.
  */
-var DEFAULT_PAGE_SIZES = exports.DEFAULT_PAGE_SIZES = [25, 50, 100];
-var DEFAULT_MAX_BODY_HEIGHT = exports.DEFAULT_MAX_BODY_HEIGHT = "70vh";
-var DEFAULT_LABELS = exports.DEFAULT_LABELS = Object.freeze({
+
+const DEFAULT_PAGE_SIZES = exports.DEFAULT_PAGE_SIZES = [25, 50, 100];
+const DEFAULT_MAX_BODY_HEIGHT = exports.DEFAULT_MAX_BODY_HEIGHT = "70vh";
+const DEFAULT_LABELS = exports.DEFAULT_LABELS = Object.freeze({
   tableAria: "Tableau",
   selectAll: "Tout sélectionner",
-  selectRow: function selectRow(id) {
-    return "S\xE9lectionner la ligne ".concat(id);
-  },
+  selectRow: id => `Sélectionner la ligne ${id}`,
   actionsHeader: "Actions",
   pagination: Object.freeze({
     loading: "Chargement…",
@@ -71,9 +65,7 @@ var DEFAULT_LABELS = exports.DEFAULT_LABELS = Object.freeze({
     nextPage: "Page suivante",
     lastPage: "Dernière page",
     navLabel: "Pagination",
-    rangeOf: function rangeOf(from, to, total, fmt) {
-      return "".concat(from, "\u2013").concat(to, " sur ").concat(fmt(total));
-    }
+    rangeOf: (from, to, total, fmt) => `${from}–${to} sur ${fmt(total)}`
   })
 });
 function mergeLabels(labels) {
@@ -97,68 +89,45 @@ function mergeLabels(labels) {
    * arrays. Convention for the whole library: a nested label dictionary is
    * merged at its own level.
    */
-  return (0, _mergeLabels.mergeLabels)(DEFAULT_LABELS, _objectSpread(_objectSpread({}, labels), {}, {
+  return (0, _mergeLabels.mergeLabels)(DEFAULT_LABELS, {
+    ...labels,
     pagination: (0, _mergeLabels.mergeLabels)(DEFAULT_LABELS.pagination, labels.pagination)
-  }));
+  });
 }
 function makeNumberFormatter(locale) {
   try {
     return new Intl.NumberFormat(locale);
-  } catch (_unused) {
+  } catch {
     return new Intl.NumberFormat("fr-FR");
   }
 }
 function applyColumnOrder(columns, columnOrder) {
   if (!columnOrder || columnOrder.length === 0) return columns;
-  var byKey = new Map(columns.map(function (c) {
-    return [c.key, c];
-  }));
-  var ordered = [];
-  var _iterator = _createForOfIteratorHelper(columnOrder),
-    _step;
-  try {
-    for (_iterator.s(); !(_step = _iterator.n()).done;) {
-      var key = _step.value;
-      var col = byKey.get(key);
-      if (col !== undefined) {
-        ordered.push(col);
-        byKey["delete"](key);
-      }
+  const byKey = new Map(columns.map(c => [c.key, c]));
+  const ordered = [];
+  for (const key of columnOrder) {
+    const col = byKey.get(key);
+    if (col !== undefined) {
+      ordered.push(col);
+      byKey.delete(key);
     }
-  } catch (err) {
-    _iterator.e(err);
-  } finally {
-    _iterator.f();
-  }
-  var _iterator2 = _createForOfIteratorHelper(byKey.values()),
-    _step2;
-  try {
-    for (_iterator2.s(); !(_step2 = _iterator2.n()).done;) {
-      var _col = _step2.value;
-      ordered.push(_col);
-    }
-  } catch (err) {
-    _iterator2.e(err);
-  } finally {
-    _iterator2.f();
   }
+  for (const col of byKey.values()) ordered.push(col);
   return ordered;
 }
 function columnsSignature(columns) {
   if (!Array.isArray(columns)) return "";
-  return columns.map(function (c) {
-    return c && _typeof(c) === "object" ? c.key : c;
-  }).join("|");
+  return columns.map(c => c && typeof c === "object" ? c.key : c).join("|");
 }
 function useColumnsStabilityWarn(columns) {
-  var prevColumnsRef = React.useRef(columns);
-  var warnedRef = React.useRef(false);
-  React.useEffect(function () {
+  const prevColumnsRef = React.useRef(columns);
+  const warnedRef = React.useRef(false);
+  React.useEffect(() => {
     if (process.env["NODE_ENV"] === "production") return;
     if (warnedRef.current) return;
     if (prevColumnsRef.current === columns) return;
-    var prevSig = columnsSignature(prevColumnsRef.current);
-    var nextSig = columnsSignature(columns);
+    const prevSig = columnsSignature(prevColumnsRef.current);
+    const nextSig = columnsSignature(columns);
     if (prevSig && prevSig === nextSig) {
       // eslint-disable-next-line no-console
       console.warn("[@portnet/ui v2] DataGrid received a new `columns` reference with identical column keys. Define columns outside render or wrap in useMemo.");
@@ -167,10 +136,10 @@ function useColumnsStabilityWarn(columns) {
     prevColumnsRef.current = columns;
   });
 }
-var PAGINATION_ICON_SX = exports.PAGINATION_ICON_SX = Object.freeze({
+const PAGINATION_ICON_SX = exports.PAGINATION_ICON_SX = Object.freeze({
   transform: "scaleX(var(--pui-rtl-flip, 1))"
 });
-var CONTAINER_SX = exports.CONTAINER_SX = Object.freeze({
+const CONTAINER_SX = exports.CONTAINER_SX = Object.freeze({
   background: "transparent",
   overflow: "hidden"
 });
@@ -193,7 +162,7 @@ var CONTAINER_SX = exports.CONTAINER_SX = Object.freeze({
  * letterSpacing is reset to "normal" because all-caps text uses wider
  * tracking which looks wrong on title-case column headers.
  */
-var TABLE_BASE_SX = Object.freeze({
+const TABLE_BASE_SX = Object.freeze({
   borderCollapse: "separate",
   borderSpacing: 0,
   "& thead th": {
@@ -214,15 +183,17 @@ var TABLE_BASE_SX = Object.freeze({
     borderBottom: "1px solid var(--border)"
   }
 });
-var TABLE_BY_DENSITY = exports.TABLE_BY_DENSITY = Object.freeze({
+const TABLE_BY_DENSITY = exports.TABLE_BY_DENSITY = Object.freeze({
   comfortable: TABLE_BASE_SX,
-  compact: Object.freeze(_objectSpread(_objectSpread({}, TABLE_BASE_SX), {}, {
-    "& tbody td": _objectSpread(_objectSpread({}, TABLE_BASE_SX["& tbody td"]), {}, {
+  compact: Object.freeze({
+    ...TABLE_BASE_SX,
+    "& tbody td": {
+      ...TABLE_BASE_SX["& tbody td"],
       padding: "var(--s-2) var(--s-4)"
-    })
-  }))
+    }
+  })
 });
-var ROW_HOVER_SELECTED_SX = Object.freeze({
+const ROW_HOVER_SELECTED_SX = Object.freeze({
   "&:nth-of-type(even)": {
     backgroundColor: "var(--bg-subtle)"
   },
@@ -239,26 +210,28 @@ var ROW_HOVER_SELECTED_SX = Object.freeze({
     }
   }
 });
-var ROW_CLICKABLE_SX = exports.ROW_CLICKABLE_SX = Object.freeze(_objectSpread(_objectSpread({}, ROW_HOVER_SELECTED_SX), {}, {
+const ROW_CLICKABLE_SX = exports.ROW_CLICKABLE_SX = Object.freeze({
+  ...ROW_HOVER_SELECTED_SX,
   cursor: "pointer",
   "&:focus-visible": {
     outline: "2px solid var(--accent)",
     outlineOffset: "var(--pui-outline-offset-inset)"
   }
-}));
-var ROW_STATIC_SX = exports.ROW_STATIC_SX = Object.freeze(_objectSpread(_objectSpread({}, ROW_HOVER_SELECTED_SX), {}, {
+});
+const ROW_STATIC_SX = exports.ROW_STATIC_SX = Object.freeze({
+  ...ROW_HOVER_SELECTED_SX,
   cursor: "default"
-}));
-var HEADER_CHECKBOX_CELL_SX = exports.HEADER_CHECKBOX_CELL_SX = Object.freeze({
+});
+const HEADER_CHECKBOX_CELL_SX = exports.HEADER_CHECKBOX_CELL_SX = Object.freeze({
   width: "var(--tactile-min)",
   position: "sticky",
   top: 0,
   zIndex: 2
 });
-var BODY_CHECKBOX_CELL_SX = exports.BODY_CHECKBOX_CELL_SX = Object.freeze({
+const BODY_CHECKBOX_CELL_SX = exports.BODY_CHECKBOX_CELL_SX = Object.freeze({
   width: "var(--tactile-min)"
 });
-var HOVER_ONLY_CELL_SX = exports.HOVER_ONLY_CELL_SX = Object.freeze({
+const HOVER_ONLY_CELL_SX = exports.HOVER_ONLY_CELL_SX = Object.freeze({
   opacity: 0,
   transition: "opacity var(--duration-fast, 120ms) ease",
   "tr:hover &, tr:focus-within &": {
@@ -268,18 +241,18 @@ var HOVER_ONLY_CELL_SX = exports.HOVER_ONLY_CELL_SX = Object.freeze({
     opacity: 1
   }
 });
-var ERROR_CELL_SX = exports.ERROR_CELL_SX = Object.freeze({
+const ERROR_CELL_SX = exports.ERROR_CELL_SX = Object.freeze({
   padding: 0,
   borderBottom: "none"
 });
-var ERROR_INNER_SX = exports.ERROR_INNER_SX = Object.freeze({
+const ERROR_INNER_SX = exports.ERROR_INNER_SX = Object.freeze({
   padding: "var(--s-4)"
 });
-var FILLER_CELL_SX = exports.FILLER_CELL_SX = Object.freeze({
+const FILLER_CELL_SX = exports.FILLER_CELL_SX = Object.freeze({
   padding: 0,
   borderBottom: "1px solid var(--border)"
 });
-var FILLER_HEAD_CELL_SX = exports.FILLER_HEAD_CELL_SX = Object.freeze({
+const FILLER_HEAD_CELL_SX = exports.FILLER_HEAD_CELL_SX = Object.freeze({
   padding: 0,
   position: "sticky",
   top: 0,
@@ -290,7 +263,7 @@ var FILLER_HEAD_CELL_SX = exports.FILLER_HEAD_CELL_SX = Object.freeze({
 
 /* ── Pagination ─────────────────────────────────────────────────── */
 
-var PAGINATION_CONTAINER_SX = Object.freeze({
+const PAGINATION_CONTAINER_SX = Object.freeze({
   display: "flex",
   alignItems: "center",
   // R-RS / WCAG 1.4.10 — the control groups (range / page-size / nav)
@@ -307,129 +280,140 @@ var PAGINATION_CONTAINER_SX = Object.freeze({
   fontSize: "var(--text-xs)",
   color: "var(--fg-muted)"
 });
-var PAGINATION_RANGE_SX = Object.freeze({
+const PAGINATION_RANGE_SX = Object.freeze({
   flex: 1,
   fontVariantNumeric: "tabular-nums"
 });
-var PAGINATION_PAGESIZE_GROUP_SX = Object.freeze({
+const PAGINATION_PAGESIZE_GROUP_SX = Object.freeze({
   display: "flex",
   alignItems: "center",
   gap: "var(--s-2)"
 });
-var PAGINATION_NAV_GROUP_SX = Object.freeze({
+const PAGINATION_NAV_GROUP_SX = Object.freeze({
   display: "flex",
   alignItems: "center",
   gap: "var(--s-1)"
 });
-var PAGINATION_PAGE_OF_SX = Object.freeze({
+const PAGINATION_PAGE_OF_SX = Object.freeze({
   minWidth: 56,
   textAlign: "center",
   fontVariantNumeric: "tabular-nums"
 });
-var PAGINATION_SELECT_SX = Object.freeze({
+const PAGINATION_SELECT_SX = Object.freeze({
   fontSize: "var(--text-xs)",
   height: 28
 });
-function Pagination(_ref) {
-  var page = _ref.page,
-    pageSize = _ref.pageSize,
-    total = _ref.total,
-    onPageChange = _ref.onPageChange,
-    onPageSizeChange = _ref.onPageSizeChange,
-    _ref$pageSizes = _ref.pageSizes,
-    pageSizes = _ref$pageSizes === void 0 ? DEFAULT_PAGE_SIZES : _ref$pageSizes,
-    loading = _ref.loading,
-    locale = _ref.locale,
-    labels = _ref.labels;
-  var pages = Math.max(1, Math.ceil(total / pageSize));
-  var from = total === 0 ? 0 : (page - 1) * pageSize + 1;
-  var to = Math.min(total, page * pageSize);
-  var go = function go(p) {
-    return onPageChange(Math.min(pages, Math.max(1, p)));
-  };
-  var fmt = React.useMemo(function () {
-    var nf = makeNumberFormatter(locale);
-    return function (n) {
-      return nf.format(n);
-    };
+
+/**
+ * Cible tactile des quatre boutons de navigation (R-7.4 / WCAG 2.5.5).
+ *
+ * `tokens/density` énonce la règle : « Icon-only buttons MUST set
+ * min-width/min-height to `tactileMin` ». Ces quatre-là étaient des
+ * `IconButton size="small"` sans plancher — environ 34 px, dix de moins que le
+ * minimum, dans la barre de pagination de CHAQUE liste du portefeuille.
+ *
+ * `min-*` et non `width`/`height` : la zone d'appui grandit, le dessin de
+ * l'icône ne change pas. Le voisin `HEADER_CHECKBOX_CELL_SX` lit déjà
+ * `var(--tactile-min)` — même source, même variable.
+ *
+ * >>> RESTE À ARBITRER : le sélecteur « lignes par page » juste à côté porte
+ * >>> `height: 28`. Pour lui, la boîte visuelle EST la zone d'appui, donc la
+ * >>> remonter à 44 px change le dessin de la barre : c'est une décision de
+ * >>> design et non une correction de défaut, et elle ne se prend pas dans un
+ * >>> commit d'accessibilité. Signalée ici pour qu'elle ne se perde pas. <<<
+ */
+const PAGINATION_BUTTON_SX = Object.freeze({
+  minWidth: "var(--tactile-min)",
+  minHeight: "var(--tactile-min)"
+});
+function Pagination({
+  page,
+  pageSize,
+  total,
+  onPageChange,
+  onPageSizeChange,
+  pageSizes = DEFAULT_PAGE_SIZES,
+  loading,
+  locale,
+  labels
+}) {
+  const pages = Math.max(1, Math.ceil(total / pageSize));
+  const from = total === 0 ? 0 : (page - 1) * pageSize + 1;
+  const to = Math.min(total, page * pageSize);
+  const go = p => onPageChange(Math.min(pages, Math.max(1, p)));
+  const fmt = React.useMemo(() => {
+    const nf = makeNumberFormatter(locale);
+    return n => nf.format(n);
   }, [locale]);
-  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_Box["default"], {
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_Box.default, {
     component: "nav",
     "aria-label": labels.navLabel,
     sx: PAGINATION_CONTAINER_SX,
-    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_Box["default"], {
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_Box.default, {
       role: "status",
       "aria-live": "polite",
       "aria-atomic": "true",
       sx: PAGINATION_RANGE_SX,
       children: loading ? labels.loading : labels.rangeOf(from, to, total, fmt)
-    }), onPageSizeChange && /*#__PURE__*/(0, _jsxRuntime.jsxs)(_Box["default"], {
+    }), onPageSizeChange && /*#__PURE__*/(0, _jsxRuntime.jsxs)(_Box.default, {
       sx: PAGINATION_PAGESIZE_GROUP_SX,
       children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
         children: labels.rowsPerPage
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Select["default"], {
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Select.default, {
         size: "small",
         value: pageSize,
-        onChange: function onChange(e) {
-          return onPageSizeChange(Number(e.target.value));
-        },
+        onChange: e => onPageSizeChange(Number(e.target.value)),
         inputProps: {
           "aria-label": String(labels.rowsPerPage)
         },
         sx: PAGINATION_SELECT_SX,
-        children: pageSizes.map(function (s) {
-          return /*#__PURE__*/(0, _jsxRuntime.jsx)(_MenuItem["default"], {
-            value: s,
-            children: s
-          }, s);
-        })
+        children: pageSizes.map(s => /*#__PURE__*/(0, _jsxRuntime.jsx)(_MenuItem.default, {
+          value: s,
+          children: s
+        }, s))
       })]
-    }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_Box["default"], {
+    }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_Box.default, {
       sx: PAGINATION_NAV_GROUP_SX,
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_IconButton["default"], {
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_IconButton.default, {
         size: "small",
-        onClick: function onClick() {
-          return go(1);
-        },
+        onClick: () => go(1),
         disabled: page <= 1,
         "aria-label": labels.firstPage,
-        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_FirstPage["default"], {
+        sx: PAGINATION_BUTTON_SX,
+        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_FirstPage.default, {
           fontSize: "small",
           sx: PAGINATION_ICON_SX
         })
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_IconButton["default"], {
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_IconButton.default, {
         size: "small",
-        onClick: function onClick() {
-          return go(page - 1);
-        },
+        onClick: () => go(page - 1),
         disabled: page <= 1,
         "aria-label": labels.previousPage,
-        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_KeyboardArrowLeft["default"], {
+        sx: PAGINATION_BUTTON_SX,
+        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_KeyboardArrowLeft.default, {
           fontSize: "small",
           sx: PAGINATION_ICON_SX
         })
-      }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_Box["default"], {
+      }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_Box.default, {
         sx: PAGINATION_PAGE_OF_SX,
         children: [page, " / ", pages]
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_IconButton["default"], {
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_IconButton.default, {
         size: "small",
-        onClick: function onClick() {
-          return go(page + 1);
-        },
+        onClick: () => go(page + 1),
         disabled: page >= pages,
         "aria-label": labels.nextPage,
-        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_KeyboardArrowRight["default"], {
+        sx: PAGINATION_BUTTON_SX,
+        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_KeyboardArrowRight.default, {
           fontSize: "small",
           sx: PAGINATION_ICON_SX
         })
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_IconButton["default"], {
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_IconButton.default, {
         size: "small",
-        onClick: function onClick() {
-          return go(pages);
-        },
+        onClick: () => go(pages),
         disabled: page >= pages,
         "aria-label": labels.lastPage,
-        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_LastPage["default"], {
+        sx: PAGINATION_BUTTON_SX,
+        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_LastPage.default, {
           fontSize: "small",
           sx: PAGINATION_ICON_SX
         })