mimir-ui-kit 1.54.4 → 1.55.0

package/dist/components/Pagination/Counter/Counter.d.ts

@@ -2,8 +2,21 @@ import { ECounterVariant } from '../constants';
 
 export type TCounterProps = {
     value: number;
+    /**
+     * Предустановленный вариант из ECounterVariant
+     */
     variant?: `${ECounterVariant}` | ECounterVariant;
+    /**
+     * Произвольный цвет текста (любое валидное css-значение).
+     * Если передан, имеет приоритет над variant.
+     */
+    color?: string;
+    /**
+     * Произвольный цвет фона (любое валидное css-значение).
+     * Если передан, имеет приоритет над variant.
+     */
+    backgroundColor?: string;
     className?: string;
 };
-export declare const Counter: ({ value, variant, className }: TCounterProps) => import("react/jsx-runtime").JSX.Element;
+export declare const Counter: ({ value, variant, color, backgroundColor, className }: TCounterProps) => import("react/jsx-runtime").JSX.Element;
 export { ECounterVariant };

package/dist/components/Pagination/Counter/Counter.js

@@ -1,28 +1,42 @@
-import { jsx as n } from "react/jsx-runtime";
-import { c } from "../../../index-DIxK0V-G.js";
-import { ECounterVariant as m } from "../constants.js";
-import '../../../assets/Counter.css';const u = "_counter_q40vf_2", r = {
-  counter: u,
+import { jsx as a } from "react/jsx-runtime";
+import { c as i } from "../../../index-DIxK0V-G.js";
+import { ECounterVariant as t } from "../constants.js";
+import '../../../assets/Counter.css';const f = "_counter_q40vf_2", s = {
+  counter: f,
   "counter--default": "_counter--default_q40vf_15",
   "counter--warning": "_counter--warning_q40vf_19",
   "counter--error": "_counter--error_q40vf_23",
   "counter--success": "_counter--success_q40vf_27"
-}, a = ({
-  value: e,
-  variant: o = "default",
-  className: t
-}) => /* @__PURE__ */ n(
-  "span",
-  {
-    className: c(
-      r.counter,
-      r[`counter--${o}`],
-      t
-    ),
-    children: e
-  }
-);
+}, m = /* @__PURE__ */ new Set([
+  t.DEFAULT,
+  t.WARNING,
+  t.ERROR,
+  t.SUCCESS
+]), v = ({
+  value: c,
+  variant: e = t.DEFAULT,
+  color: n,
+  backgroundColor: r,
+  className: o
+}) => {
+  const u = e !== void 0 && m.has(String(e)), _ = n || r ? {
+    ...n && { color: n },
+    ...r && { backgroundColor: r }
+  } : void 0;
+  return /* @__PURE__ */ a(
+    "span",
+    {
+      style: _,
+      className: i(
+        s.counter,
+        u && s[`counter--${e}`],
+        o
+      ),
+      children: c
+    }
+  );
+};
 export {
-  a as Counter,
-  m as ECounterVariant
+  v as Counter,
+  t as ECounterVariant
 };

package/dist/components/Pagination/Pagination.d.ts

@@ -16,7 +16,20 @@ export type TNextProps = {
 export type TPageData = {
     date?: string;
     count?: number;
+    /**
+     * Предустановленный вариант счетчика
+     */
     counterVariant?: `${ECounterVariant}` | ECounterVariant;
+    /**
+     * Произвольный цвет текста счетчика (любое валидное css-значение).
+     * Если передан, имеет приоритет над counterVariant.
+     */
+    counterColor?: string;
+    /**
+     * Произвольный цвет фона счетчика (любое валидное css-значение).
+     * Если передан, имеет приоритет над counterVariant.
+     */
+    counterBackgroundColor?: string;
 };
 export type TItemProps = {
     currentPageNumber: number;

package/dist/components/Pagination/Pagination.js

@@ -1,11 +1,11 @@
-import { jsxs as x, jsx as i, Fragment as B } from "react/jsx-runtime";
+import { jsxs as x, jsx as o, Fragment as y } from "react/jsx-runtime";
 import { c as P } from "../../index-DIxK0V-G.js";
 import { forwardRef as R, useState as S, useEffect as $ } from "react";
 import { FIRST_PAGE_NUMBER as f, DEFAULT_PER_PAGE as F } from "./constants.js";
 import { Counter as L } from "./Counter/Counter.js";
 import { useWindowSize as G } from "../../hooks/useWindowSize/index.js";
-import { MergedButton as y } from "../MergedButton/MergedButton.js";
-import '../../assets/Pagination.css';const T = "_container_1rzjl_43", U = "_ellipsis_1rzjl_64", O = "_disabled_1rzjl_69", a = {
+import { MergedButton as B } from "../MergedButton/MergedButton.js";
+import '../../assets/Pagination.css';const T = "_container_1rzjl_43", U = "_ellipsis_1rzjl_64", O = "_disabled_1rzjl_69", r = {
   "pagination-button": "_pagination-button_1rzjl_2",
   "is-active": "_is-active_1rzjl_23",
   "pagination-button--date": "_pagination-button--date_1rzjl_26",
@@ -16,128 +16,136 @@ import '../../assets/Pagination.css';const T = "_container_1rzjl_43", U = "_elli
   ellipsis: U,
   disabled: O
 }, V = ({
-  currentPageNumber: t,
-  onClick: n,
+  currentPageNumber: n,
+  onClick: e,
   setCurrentPage: u,
   disabled: c
-}) => /* @__PURE__ */ i(
-  y,
+}) => /* @__PURE__ */ o(
+  B,
   {
     buttons: [
       {
         isIconButton: !0,
         variant: "white",
         onClick: () => {
-          t !== f && (u(t - 1), n(t - 1));
+          n !== f && (u(n - 1), e(n - 1));
         },
         iconName: "ArrowLeft16px",
-        disabled: c || t === f,
+        disabled: c || n === f,
         "data-testid": "back-button"
       }
     ]
   }
 ), W = ({
-  currentPageNumber: t,
-  lastPageNumber: n,
+  currentPageNumber: n,
+  lastPageNumber: e,
   onClick: u,
   setCurrentPage: c,
-  disabled: r
+  disabled: a
 }) => {
-  const e = t >= n;
-  return /* @__PURE__ */ i(
-    y,
+  const t = n >= e;
+  return /* @__PURE__ */ o(
+    B,
     {
       buttons: [
         {
           isIconButton: !0,
           variant: "white",
           onClick: () => {
-            e || (c(t + 1), u(t + 1));
+            t || (c(n + 1), u(n + 1));
           },
-          disabled: r || e,
+          disabled: a || t,
           iconName: "ArrowRight16px",
           "data-testid": "next-button"
         }
       ]
     }
   );
-}, E = () => /* @__PURE__ */ i(
-  y,
+}, E = () => /* @__PURE__ */ o(
+  B,
   {
     buttons: [
       {
         children: "...",
         variant: "transparent",
-        className: P(a["pagination-button"], a.ellipsis)
+        className: P(r["pagination-button"], r.ellipsis)
       }
     ]
   }
 ), A = ({
-  currentPageNumber: t,
-  newPageNumber: n,
+  currentPageNumber: n,
+  newPageNumber: e,
   onClick: u,
   setCurrentPage: c,
-  disabled: r,
-  pageData: e,
-  isDateMode: o = !1
+  disabled: a,
+  pageData: t,
+  isDateMode: i = !1
 }) => {
-  const s = t === n, p = () => {
-    r || (c(n), u(n));
-  }, l = n < 10 ? `0${n}` : n;
-  return o && e ? /* @__PURE__ */ i(
+  const s = n === e, p = () => {
+    a || (c(e), u(e));
+  }, l = e < 10 ? `0${e}` : e;
+  return i && t ? /* @__PURE__ */ o(
     "button",
     {
       "data-testid": `pagination-button-${l}`,
       type: "button",
       onClick: p,
-      disabled: r,
+      disabled: a,
       className: P(
-        a["pagination-button"],
-        a["pagination-button--date"],
+        r["pagination-button"],
+        r["pagination-button--date"],
         {
-          [a["is-active"]]: s
+          [r["is-active"]]: s
         }
       ),
-      children: /* @__PURE__ */ x("div", { className: a["date-content"], children: [
-        /* @__PURE__ */ i("span", { className: a["date-text"], children: e.date }),
-        e.count !== void 0 && /* @__PURE__ */ i(L, { value: e.count, variant: e.counterVariant })
+      children: /* @__PURE__ */ x("div", { className: r["date-content"], children: [
+        /* @__PURE__ */ o("span", { className: r["date-text"], children: t.date }),
+        t.count !== void 0 && /* @__PURE__ */ o(
+          L,
+          {
+            value: t.count,
+            variant: t.counterVariant,
+            color: t.counterColor,
+            backgroundColor: t.counterBackgroundColor
+          }
+        )
       ] })
     }
-  ) : /* @__PURE__ */ i(
+  ) : /* @__PURE__ */ o(
     "button",
     {
       "data-testid": `pagination-button-${l}`,
       type: "button",
       onClick: p,
-      disabled: r,
-      className: P(a["pagination-button"], {
-        [a["is-active"]]: s
+      disabled: a,
+      className: P(r["pagination-button"], {
+        [r["is-active"]]: s
       }),
       children: l
     }
   );
 }, q = ({
-  start: t,
-  end: n,
+  start: n,
+  end: e,
   currentPageNumber: u,
   onClick: c,
-  setCurrentPage: r,
-  disabled: e,
-  pagesData: o,
+  setCurrentPage: a,
+  disabled: t,
+  pagesData: i,
   isDateMode: s
 }) => {
   const p = [];
-  for (let l = t; l <= n; l++) {
-    const v = o == null ? void 0 : o[l - 1];
+  for (let l = n; l <= e; l++) {
+    const v = i == null ? void 0 : i[l - 1];
     p.push(
-      /* @__PURE__ */ i(
+      /* @__PURE__ */ o(
         A,
         {
           currentPageNumber: u,
-          setCurrentPage: r,
+          setCurrentPage: a,
           newPageNumber: l,
           onClick: c,
-          disabled: e,
+          disabled: t,
           pageData: v,
           isDateMode: s
         },
@@ -147,13 +155,13 @@ import '../../assets/Pagination.css';const T = "_container_1rzjl_43", U = "_elli
   }
   return p;
 }, D = R(
-  (t, n) => {
+  (n, e) => {
     const {
       rootClassName: u,
       total: c,
-      perPage: r = F,
-      currentPageNumber: e = f,
-      onChange: o,
+      perPage: a = F,
+      currentPageNumber: t = f,
+      onChange: i,
       disabled: s = !1,
       hidePrevButton: p = !1,
       hideNextButton: l = !1,
@@ -161,44 +169,44 @@ import '../../assets/Pagination.css';const T = "_container_1rzjl_43", U = "_elli
       boundaryCount: d = 1,
       isDateMode: j = !1,
       pagesData: h
-    } = t, [m, k] = S(e), _ = Math.ceil(c / r), { width: M } = G(), w = M <= 650 ? 1 : 2, N = v !== void 0 ? v : w;
+    } = n, [m, k] = S(t), _ = Math.ceil(c / a), { width: M } = G(), w = M <= 650 ? 1 : 2, N = v !== void 0 ? v : w;
     let C = 0, g = 0;
     return $(() => {
-      k(e);
-    }, [e]), m <= d + N + 1 ? (C = f, g = Math.min(
+      k(t);
+    }, [t]), m <= d + N + 1 ? (C = f, g = Math.min(
       d + N * 2 + 1,
       _
     )) : m >= _ - d - N ? (C = Math.max(
       _ - d - N * 2,
       f
-    ), g = _) : (C = m - N, g = m + N), c <= r ? null : /* @__PURE__ */ x(
+    ), g = _) : (C = m - N, g = m + N), c <= a ? null : /* @__PURE__ */ x(
       "nav",
       {
         "aria-label": "Постраничная навигация",
-        className: P(a.container, u, {
-          [a.disabled]: s,
-          [a["container--date-mode"]]: j
+        className: P(r.container, u, {
+          [r.disabled]: s,
+          [r["container--date-mode"]]: j
         }),
-        ref: n,
+        ref: e,
         children: [
-          !p && /* @__PURE__ */ i(
+          !p && /* @__PURE__ */ o(
             V,
             {
               currentPageNumber: m,
-              onClick: o,
+              onClick: i,
               setCurrentPage: k,
               disabled: s
             }
           ),
-          C > f && /* @__PURE__ */ x(B, { children: [
+          C > f && /* @__PURE__ */ x(y, { children: [
             Array.from({ length: d }).map((I, z) => {
               const b = f + z;
-              return b >= C ? null : /* @__PURE__ */ i(
+              return b >= C ? null : /* @__PURE__ */ o(
                 A,
                 {
                   newPageNumber: b,
                   currentPageNumber: m,
-                  onClick: o,
+                  onClick: i,
                   setCurrentPage: k,
                   disabled: s,
                   pageData: h == null ? void 0 : h[b - 1],
@@ -207,28 +215,28 @@ import '../../assets/Pagination.css';const T = "_container_1rzjl_43", U = "_elli
                 `boundary-start-${b}`
               );
             }),
-            C > d + f && /* @__PURE__ */ i(E, {})
+            C > d + f && /* @__PURE__ */ o(E, {})
           ] }),
           q({
             start: C,
             end: g,
             currentPageNumber: m,
             setCurrentPage: k,
-            onClick: o,
+            onClick: i,
             disabled: s,
             pagesData: h,
             isDateMode: j
           }),
-          g < _ && /* @__PURE__ */ x(B, { children: [
-            g < _ - d && /* @__PURE__ */ i(E, {}),
+          g < _ && /* @__PURE__ */ x(y, { children: [
+            g < _ - d && /* @__PURE__ */ o(E, {}),
             Array.from({ length: d }).map((I, z) => {
               const b = _ - d + 1 + z;
-              return b <= g ? null : /* @__PURE__ */ i(
+              return b <= g ? null : /* @__PURE__ */ o(
                 A,
                 {
                   newPageNumber: b,
                   currentPageNumber: m,
-                  onClick: o,
+                  onClick: i,
                   setCurrentPage: k,
                   disabled: s,
                   pageData: h == null ? void 0 : h[b - 1],
@@ -238,13 +246,13 @@ import '../../assets/Pagination.css';const T = "_container_1rzjl_43", U = "_elli
               );
             })
           ] }),
-          !l && /* @__PURE__ */ i(
+          !l && /* @__PURE__ */ o(
             W,
             {
               currentPageNumber: m,
               setCurrentPage: k,
               lastPageNumber: _,
-              onClick: o,
+              onClick: i,
               disabled: s
             }
           )

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "mimir-ui-kit",
   "private": false,
-  "version": "1.54.4",
+  "version": "1.55.0",
   "type": "module",
   "exports": {
     ".": {