musae 1.3.1-beta.22 → 1.3.1-beta.23

package/dist/components/pagination/pagination.cjs

@@ -14,6 +14,7 @@ var relax = require('@aiszlab/relax');
 var className = require('@aiszlab/relax/class-name');
 var useClassNames = require('../../hooks/use-class-names.cjs');
 var context = require('./context.cjs');
+var theme = require('../theme/theme.cjs');
 
 var Pagination = function Pagination(_ref) {
   var _ref$total = _ref.total,
@@ -50,7 +51,8 @@ var Pagination = function Pagination(_ref) {
     onPageSizeChange = _usePagiantion.onPageSizeChange;
   var styled = {
     pagination: stylex.props(styles.default.pagination.base),
-    sizer: stylex.props(styles.default.pagination.sizer)
+    sizer: stylex.props(styles.default.pagination.sizer),
+    range: stylex.props(styles.default.pagination.range, theme.$body.small)
   };
   var pages = Math.max(1, Math.ceil(total / Math.max(1, pageSize)));
   var sizeOptions = React.useMemo(function () {
@@ -67,7 +69,10 @@ var Pagination = function Pagination(_ref) {
   }, /*#__PURE__*/React.createElement("ul", {
     className: styled.pagination.className,
     style: styled.pagination.style
-  }, paginationItems.map(function (item$1) {
+  }, /*#__PURE__*/React.createElement("li", {
+    className: styled.range.className,
+    style: styled.range.style
+  }, locale.range(total === 0 ? 0 : Math.min(total, (at - 1) * pageSize + 1), Math.min(at * pageSize, total), total)), paginationItems.map(function (item$1) {
     return /*#__PURE__*/React.createElement("li", {
       key: item$1
     }, /*#__PURE__*/React.createElement(item.default, {

package/dist/components/pagination/pagination.mjs

@@ -10,6 +10,7 @@ import { unique, toFunction } from '@aiszlab/relax';
 import { stringify } from '@aiszlab/relax/class-name';
 import { useClassNames } from '../../hooks/use-class-names.mjs';
 import { CLASS_NAMES } from './context.mjs';
+import { $body } from '../theme/theme.mjs';
 
 var Pagination = function Pagination(_ref) {
   var _ref$total = _ref.total,
@@ -46,7 +47,8 @@ var Pagination = function Pagination(_ref) {
     onPageSizeChange = _usePagiantion.onPageSizeChange;
   var styled = {
     pagination: props(styles.pagination.base),
-    sizer: props(styles.pagination.sizer)
+    sizer: props(styles.pagination.sizer),
+    range: props(styles.pagination.range, $body.small)
   };
   var pages = Math.max(1, Math.ceil(total / Math.max(1, pageSize)));
   var sizeOptions = useMemo(function () {
@@ -63,7 +65,10 @@ var Pagination = function Pagination(_ref) {
   }, /*#__PURE__*/React.createElement("ul", {
     className: styled.pagination.className,
     style: styled.pagination.style
-  }, paginationItems.map(function (item) {
+  }, /*#__PURE__*/React.createElement("li", {
+    className: styled.range.className,
+    style: styled.range.style
+  }, locale.range(total === 0 ? 0 : Math.min(total, (at - 1) * pageSize + 1), Math.min(at * pageSize, total), total)), paginationItems.map(function (item) {
     return /*#__PURE__*/React.createElement("li", {
       key: item
     }, /*#__PURE__*/React.createElement(Item, {

package/dist/components/pagination/styles.cjs

@@ -15,7 +15,7 @@ var pagination = {
   base: {
     k1xSpc: "musaex-78zum5",
     kGNEyG: "musaex-6s0dn4",
-    k1C7PZ: "musaex-5xj0sk",
+    k1C7PZ: "musaex-1bu9cvf",
     kH6xsr: "musaex-3ct3a4",
     kogj98: "musaex-q3gua8",
     kmVPX3: "musaex-1n775ky",
@@ -25,6 +25,11 @@ var pagination = {
     k1xSpc: "musaex-78zum5",
     kGNEyG: "musaex-6s0dn4",
     $$css: true
+  },
+  range: {
+    kMwMTN: "musaex-bq1wot",
+    khDVqt: "musaex-uxw1ft",
+    $$css: true
   }
 };
 var styles = {

package/dist/components/pagination/styles.d.ts

@@ -32,6 +32,10 @@ declare const styles: {
             readonly display: import("@stylexjs/stylex").StyleXClassNameFor<"display", "flex">;
             readonly alignItems: import("@stylexjs/stylex").StyleXClassNameFor<"alignItems", "center">;
         }>;
+        readonly range: Readonly<{
+            readonly color: import("@stylexjs/stylex").StyleXClassNameFor<"color", "var(--color-on-surface-variant)">;
+            readonly whiteSpace: import("@stylexjs/stylex").StyleXClassNameFor<"whiteSpace", "nowrap">;
+        }>;
     }>;
 };
 export default styles;

package/dist/components/pagination/styles.mjs

@@ -11,7 +11,7 @@ var pagination = {
   base: {
     k1xSpc: "musaex-78zum5",
     kGNEyG: "musaex-6s0dn4",
-    k1C7PZ: "musaex-5xj0sk",
+    k1C7PZ: "musaex-1bu9cvf",
     kH6xsr: "musaex-3ct3a4",
     kogj98: "musaex-q3gua8",
     kmVPX3: "musaex-1n775ky",
@@ -21,6 +21,11 @@ var pagination = {
     k1xSpc: "musaex-78zum5",
     kGNEyG: "musaex-6s0dn4",
     $$css: true
+  },
+  range: {
+    kMwMTN: "musaex-bq1wot",
+    khDVqt: "musaex-uxw1ft",
+    $$css: true
   }
 };
 var styles = {

package/dist/locale/locales/en_US.cjs

@@ -14,6 +14,9 @@ var en_US = {
   pagination: {
     size: function size(_size) {
       return "".concat(_size, " items/page");
+    },
+    range: function range(from, to, total) {
+      return "".concat(from, "\u2013").concat(to, " of ").concat(total);
     }
   },
   popconfirm: {

package/dist/locale/locales/en_US.mjs

@@ -10,6 +10,9 @@ var en_US = {
   pagination: {
     size: function size(_size) {
       return "".concat(_size, " items/page");
+    },
+    range: function range(from, to, total) {
+      return "".concat(from, "\u2013").concat(to, " of ").concat(total);
     }
   },
   popconfirm: {

package/dist/locale/locales/zh_CN.cjs

@@ -14,6 +14,9 @@ var zh_CN = {
   pagination: {
     size: function size(_size) {
       return "".concat(_size, " \u6761/\u9875");
+    },
+    range: function range(from, to, total) {
+      return "".concat(from, "\u2013").concat(to, " \u6761\uFF0C\u5171 ").concat(total, " \u6761");
     }
   },
   popconfirm: {

package/dist/locale/locales/zh_CN.mjs

@@ -10,6 +10,9 @@ var zh_CN = {
   pagination: {
     size: function size(_size) {
       return "".concat(_size, " \u6761/\u9875");
+    },
+    range: function range(from, to, total) {
+      return "".concat(from, "\u2013").concat(to, " \u6761\uFF0C\u5171 ").concat(total, " \u6761");
     }
   },
   popconfirm: {

package/dist/types/locale.d.ts

@@ -10,6 +10,7 @@ export interface Locale {
     };
     pagination: {
         size: string | ((size: number) => string);
+        range: (from: number, to: number, total: number) => string;
     };
     popconfirm: {
         confirm: string;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "musae",
-  "version": "1.3.1-beta.22",
+  "version": "1.3.1-beta.23",
   "description": "musae-ui",
   "author": "tutu@fantufantu.com",
   "license": "MIT",