mimir-ui-kit 1.54.5 → 1.55.0

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.
@@ -2,8 +2,21 @@ import { ECounterVariant } from '../constants';
2
2
 
3
3
  export type TCounterProps = {
4
4
  value: number;
5
+ /**
6
+ * Предустановленный вариант из ECounterVariant
7
+ */
5
8
  variant?: `${ECounterVariant}` | ECounterVariant;
9
+ /**
10
+ * Произвольный цвет текста (любое валидное css-значение).
11
+ * Если передан, имеет приоритет над variant.
12
+ */
13
+ color?: string;
14
+ /**
15
+ * Произвольный цвет фона (любое валидное css-значение).
16
+ * Если передан, имеет приоритет над variant.
17
+ */
18
+ backgroundColor?: string;
6
19
  className?: string;
7
20
  };
8
- export declare const Counter: ({ value, variant, className }: TCounterProps) => import("react/jsx-runtime").JSX.Element;
21
+ export declare const Counter: ({ value, variant, color, backgroundColor, className }: TCounterProps) => import("react/jsx-runtime").JSX.Element;
9
22
  export { ECounterVariant };
@@ -1,28 +1,42 @@
1
- import { jsx as n } from "react/jsx-runtime";
2
- import { c } from "../../../index-DIxK0V-G.js";
3
- import { ECounterVariant as m } from "../constants.js";
4
- import '../../../assets/Counter.css';const u = "_counter_q40vf_2", r = {
5
- counter: u,
1
+ import { jsx as a } from "react/jsx-runtime";
2
+ import { c as i } from "../../../index-DIxK0V-G.js";
3
+ import { ECounterVariant as t } from "../constants.js";
4
+ import '../../../assets/Counter.css';const f = "_counter_q40vf_2", s = {
5
+ counter: f,
6
6
  "counter--default": "_counter--default_q40vf_15",
7
7
  "counter--warning": "_counter--warning_q40vf_19",
8
8
  "counter--error": "_counter--error_q40vf_23",
9
9
  "counter--success": "_counter--success_q40vf_27"
10
- }, a = ({
11
- value: e,
12
- variant: o = "default",
13
- className: t
14
- }) => /* @__PURE__ */ n(
15
- "span",
16
- {
17
- className: c(
18
- r.counter,
19
- r[`counter--${o}`],
20
- t
21
- ),
22
- children: e
23
- }
24
- );
10
+ }, m = /* @__PURE__ */ new Set([
11
+ t.DEFAULT,
12
+ t.WARNING,
13
+ t.ERROR,
14
+ t.SUCCESS
15
+ ]), v = ({
16
+ value: c,
17
+ variant: e = t.DEFAULT,
18
+ color: n,
19
+ backgroundColor: r,
20
+ className: o
21
+ }) => {
22
+ const u = e !== void 0 && m.has(String(e)), _ = n || r ? {
23
+ ...n && { color: n },
24
+ ...r && { backgroundColor: r }
25
+ } : void 0;
26
+ return /* @__PURE__ */ a(
27
+ "span",
28
+ {
29
+ style: _,
30
+ className: i(
31
+ s.counter,
32
+ u && s[`counter--${e}`],
33
+ o
34
+ ),
35
+ children: c
36
+ }
37
+ );
38
+ };
25
39
  export {
26
- a as Counter,
27
- m as ECounterVariant
40
+ v as Counter,
41
+ t as ECounterVariant
28
42
  };
@@ -16,7 +16,20 @@ export type TNextProps = {
16
16
  export type TPageData = {
17
17
  date?: string;
18
18
  count?: number;
19
+ /**
20
+ * Предустановленный вариант счетчика
21
+ */
19
22
  counterVariant?: `${ECounterVariant}` | ECounterVariant;
23
+ /**
24
+ * Произвольный цвет текста счетчика (любое валидное css-значение).
25
+ * Если передан, имеет приоритет над counterVariant.
26
+ */
27
+ counterColor?: string;
28
+ /**
29
+ * Произвольный цвет фона счетчика (любое валидное css-значение).
30
+ * Если передан, имеет приоритет над counterVariant.
31
+ */
32
+ counterBackgroundColor?: string;
20
33
  };
21
34
  export type TItemProps = {
22
35
  currentPageNumber: number;
@@ -1,11 +1,11 @@
1
- import { jsxs as x, jsx as i, Fragment as B } from "react/jsx-runtime";
1
+ import { jsxs as x, jsx as o, Fragment as y } from "react/jsx-runtime";
2
2
  import { c as P } from "../../index-DIxK0V-G.js";
3
3
  import { forwardRef as R, useState as S, useEffect as $ } from "react";
4
4
  import { FIRST_PAGE_NUMBER as f, DEFAULT_PER_PAGE as F } from "./constants.js";
5
5
  import { Counter as L } from "./Counter/Counter.js";
6
6
  import { useWindowSize as G } from "../../hooks/useWindowSize/index.js";
7
- import { MergedButton as y } from "../MergedButton/MergedButton.js";
8
- import '../../assets/Pagination.css';const T = "_container_1rzjl_43", U = "_ellipsis_1rzjl_64", O = "_disabled_1rzjl_69", a = {
7
+ import { MergedButton as B } from "../MergedButton/MergedButton.js";
8
+ import '../../assets/Pagination.css';const T = "_container_1rzjl_43", U = "_ellipsis_1rzjl_64", O = "_disabled_1rzjl_69", r = {
9
9
  "pagination-button": "_pagination-button_1rzjl_2",
10
10
  "is-active": "_is-active_1rzjl_23",
11
11
  "pagination-button--date": "_pagination-button--date_1rzjl_26",
@@ -16,128 +16,136 @@ import '../../assets/Pagination.css';const T = "_container_1rzjl_43", U = "_elli
16
16
  ellipsis: U,
17
17
  disabled: O
18
18
  }, V = ({
19
- currentPageNumber: t,
20
- onClick: n,
19
+ currentPageNumber: n,
20
+ onClick: e,
21
21
  setCurrentPage: u,
22
22
  disabled: c
23
- }) => /* @__PURE__ */ i(
24
- y,
23
+ }) => /* @__PURE__ */ o(
24
+ B,
25
25
  {
26
26
  buttons: [
27
27
  {
28
28
  isIconButton: !0,
29
29
  variant: "white",
30
30
  onClick: () => {
31
- t !== f && (u(t - 1), n(t - 1));
31
+ n !== f && (u(n - 1), e(n - 1));
32
32
  },
33
33
  iconName: "ArrowLeft16px",
34
- disabled: c || t === f,
34
+ disabled: c || n === f,
35
35
  "data-testid": "back-button"
36
36
  }
37
37
  ]
38
38
  }
39
39
  ), W = ({
40
- currentPageNumber: t,
41
- lastPageNumber: n,
40
+ currentPageNumber: n,
41
+ lastPageNumber: e,
42
42
  onClick: u,
43
43
  setCurrentPage: c,
44
- disabled: r
44
+ disabled: a
45
45
  }) => {
46
- const e = t >= n;
47
- return /* @__PURE__ */ i(
48
- y,
46
+ const t = n >= e;
47
+ return /* @__PURE__ */ o(
48
+ B,
49
49
  {
50
50
  buttons: [
51
51
  {
52
52
  isIconButton: !0,
53
53
  variant: "white",
54
54
  onClick: () => {
55
- e || (c(t + 1), u(t + 1));
55
+ t || (c(n + 1), u(n + 1));
56
56
  },
57
- disabled: r || e,
57
+ disabled: a || t,
58
58
  iconName: "ArrowRight16px",
59
59
  "data-testid": "next-button"
60
60
  }
61
61
  ]
62
62
  }
63
63
  );
64
- }, E = () => /* @__PURE__ */ i(
65
- y,
64
+ }, E = () => /* @__PURE__ */ o(
65
+ B,
66
66
  {
67
67
  buttons: [
68
68
  {
69
69
  children: "...",
70
70
  variant: "transparent",
71
- className: P(a["pagination-button"], a.ellipsis)
71
+ className: P(r["pagination-button"], r.ellipsis)
72
72
  }
73
73
  ]
74
74
  }
75
75
  ), A = ({
76
- currentPageNumber: t,
77
- newPageNumber: n,
76
+ currentPageNumber: n,
77
+ newPageNumber: e,
78
78
  onClick: u,
79
79
  setCurrentPage: c,
80
- disabled: r,
81
- pageData: e,
82
- isDateMode: o = !1
80
+ disabled: a,
81
+ pageData: t,
82
+ isDateMode: i = !1
83
83
  }) => {
84
- const s = t === n, p = () => {
85
- r || (c(n), u(n));
86
- }, l = n < 10 ? `0${n}` : n;
87
- return o && e ? /* @__PURE__ */ i(
84
+ const s = n === e, p = () => {
85
+ a || (c(e), u(e));
86
+ }, l = e < 10 ? `0${e}` : e;
87
+ return i && t ? /* @__PURE__ */ o(
88
88
  "button",
89
89
  {
90
90
  "data-testid": `pagination-button-${l}`,
91
91
  type: "button",
92
92
  onClick: p,
93
- disabled: r,
93
+ disabled: a,
94
94
  className: P(
95
- a["pagination-button"],
96
- a["pagination-button--date"],
95
+ r["pagination-button"],
96
+ r["pagination-button--date"],
97
97
  {
98
- [a["is-active"]]: s
98
+ [r["is-active"]]: s
99
99
  }
100
100
  ),
101
- children: /* @__PURE__ */ x("div", { className: a["date-content"], children: [
102
- /* @__PURE__ */ i("span", { className: a["date-text"], children: e.date }),
103
- e.count !== void 0 && /* @__PURE__ */ i(L, { value: e.count, variant: e.counterVariant })
101
+ children: /* @__PURE__ */ x("div", { className: r["date-content"], children: [
102
+ /* @__PURE__ */ o("span", { className: r["date-text"], children: t.date }),
103
+ t.count !== void 0 && /* @__PURE__ */ o(
104
+ L,
105
+ {
106
+ value: t.count,
107
+ variant: t.counterVariant,
108
+ color: t.counterColor,
109
+ backgroundColor: t.counterBackgroundColor
110
+ }
111
+ )
104
112
  ] })
105
113
  }
106
- ) : /* @__PURE__ */ i(
114
+ ) : /* @__PURE__ */ o(
107
115
  "button",
108
116
  {
109
117
  "data-testid": `pagination-button-${l}`,
110
118
  type: "button",
111
119
  onClick: p,
112
- disabled: r,
113
- className: P(a["pagination-button"], {
114
- [a["is-active"]]: s
120
+ disabled: a,
121
+ className: P(r["pagination-button"], {
122
+ [r["is-active"]]: s
115
123
  }),
116
124
  children: l
117
125
  }
118
126
  );
119
127
  }, q = ({
120
- start: t,
121
- end: n,
128
+ start: n,
129
+ end: e,
122
130
  currentPageNumber: u,
123
131
  onClick: c,
124
- setCurrentPage: r,
125
- disabled: e,
126
- pagesData: o,
132
+ setCurrentPage: a,
133
+ disabled: t,
134
+ pagesData: i,
127
135
  isDateMode: s
128
136
  }) => {
129
137
  const p = [];
130
- for (let l = t; l <= n; l++) {
131
- const v = o == null ? void 0 : o[l - 1];
138
+ for (let l = n; l <= e; l++) {
139
+ const v = i == null ? void 0 : i[l - 1];
132
140
  p.push(
133
- /* @__PURE__ */ i(
141
+ /* @__PURE__ */ o(
134
142
  A,
135
143
  {
136
144
  currentPageNumber: u,
137
- setCurrentPage: r,
145
+ setCurrentPage: a,
138
146
  newPageNumber: l,
139
147
  onClick: c,
140
- disabled: e,
148
+ disabled: t,
141
149
  pageData: v,
142
150
  isDateMode: s
143
151
  },
@@ -147,13 +155,13 @@ import '../../assets/Pagination.css';const T = "_container_1rzjl_43", U = "_elli
147
155
  }
148
156
  return p;
149
157
  }, D = R(
150
- (t, n) => {
158
+ (n, e) => {
151
159
  const {
152
160
  rootClassName: u,
153
161
  total: c,
154
- perPage: r = F,
155
- currentPageNumber: e = f,
156
- onChange: o,
162
+ perPage: a = F,
163
+ currentPageNumber: t = f,
164
+ onChange: i,
157
165
  disabled: s = !1,
158
166
  hidePrevButton: p = !1,
159
167
  hideNextButton: l = !1,
@@ -161,44 +169,44 @@ import '../../assets/Pagination.css';const T = "_container_1rzjl_43", U = "_elli
161
169
  boundaryCount: d = 1,
162
170
  isDateMode: j = !1,
163
171
  pagesData: h
164
- } = t, [m, k] = S(e), _ = Math.ceil(c / r), { width: M } = G(), w = M <= 650 ? 1 : 2, N = v !== void 0 ? v : w;
172
+ } = n, [m, k] = S(t), _ = Math.ceil(c / a), { width: M } = G(), w = M <= 650 ? 1 : 2, N = v !== void 0 ? v : w;
165
173
  let C = 0, g = 0;
166
174
  return $(() => {
167
- k(e);
168
- }, [e]), m <= d + N + 1 ? (C = f, g = Math.min(
175
+ k(t);
176
+ }, [t]), m <= d + N + 1 ? (C = f, g = Math.min(
169
177
  d + N * 2 + 1,
170
178
  _
171
179
  )) : m >= _ - d - N ? (C = Math.max(
172
180
  _ - d - N * 2,
173
181
  f
174
- ), g = _) : (C = m - N, g = m + N), c <= r ? null : /* @__PURE__ */ x(
182
+ ), g = _) : (C = m - N, g = m + N), c <= a ? null : /* @__PURE__ */ x(
175
183
  "nav",
176
184
  {
177
185
  "aria-label": "Постраничная навигация",
178
- className: P(a.container, u, {
179
- [a.disabled]: s,
180
- [a["container--date-mode"]]: j
186
+ className: P(r.container, u, {
187
+ [r.disabled]: s,
188
+ [r["container--date-mode"]]: j
181
189
  }),
182
- ref: n,
190
+ ref: e,
183
191
  children: [
184
- !p && /* @__PURE__ */ i(
192
+ !p && /* @__PURE__ */ o(
185
193
  V,
186
194
  {
187
195
  currentPageNumber: m,
188
- onClick: o,
196
+ onClick: i,
189
197
  setCurrentPage: k,
190
198
  disabled: s
191
199
  }
192
200
  ),
193
- C > f && /* @__PURE__ */ x(B, { children: [
201
+ C > f && /* @__PURE__ */ x(y, { children: [
194
202
  Array.from({ length: d }).map((I, z) => {
195
203
  const b = f + z;
196
- return b >= C ? null : /* @__PURE__ */ i(
204
+ return b >= C ? null : /* @__PURE__ */ o(
197
205
  A,
198
206
  {
199
207
  newPageNumber: b,
200
208
  currentPageNumber: m,
201
- onClick: o,
209
+ onClick: i,
202
210
  setCurrentPage: k,
203
211
  disabled: s,
204
212
  pageData: h == null ? void 0 : h[b - 1],
@@ -207,28 +215,28 @@ import '../../assets/Pagination.css';const T = "_container_1rzjl_43", U = "_elli
207
215
  `boundary-start-${b}`
208
216
  );
209
217
  }),
210
- C > d + f && /* @__PURE__ */ i(E, {})
218
+ C > d + f && /* @__PURE__ */ o(E, {})
211
219
  ] }),
212
220
  q({
213
221
  start: C,
214
222
  end: g,
215
223
  currentPageNumber: m,
216
224
  setCurrentPage: k,
217
- onClick: o,
225
+ onClick: i,
218
226
  disabled: s,
219
227
  pagesData: h,
220
228
  isDateMode: j
221
229
  }),
222
- g < _ && /* @__PURE__ */ x(B, { children: [
223
- g < _ - d && /* @__PURE__ */ i(E, {}),
230
+ g < _ && /* @__PURE__ */ x(y, { children: [
231
+ g < _ - d && /* @__PURE__ */ o(E, {}),
224
232
  Array.from({ length: d }).map((I, z) => {
225
233
  const b = _ - d + 1 + z;
226
- return b <= g ? null : /* @__PURE__ */ i(
234
+ return b <= g ? null : /* @__PURE__ */ o(
227
235
  A,
228
236
  {
229
237
  newPageNumber: b,
230
238
  currentPageNumber: m,
231
- onClick: o,
239
+ onClick: i,
232
240
  setCurrentPage: k,
233
241
  disabled: s,
234
242
  pageData: h == null ? void 0 : h[b - 1],
@@ -238,13 +246,13 @@ import '../../assets/Pagination.css';const T = "_container_1rzjl_43", U = "_elli
238
246
  );
239
247
  })
240
248
  ] }),
241
- !l && /* @__PURE__ */ i(
249
+ !l && /* @__PURE__ */ o(
242
250
  W,
243
251
  {
244
252
  currentPageNumber: m,
245
253
  setCurrentPage: k,
246
254
  lastPageNumber: _,
247
- onClick: o,
255
+ onClick: i,
248
256
  disabled: s
249
257
  }
250
258
  )
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "mimir-ui-kit",
3
3
  "private": false,
4
- "version": "1.54.5",
4
+ "version": "1.55.0",
5
5
  "type": "module",
6
6
  "exports": {
7
7
  ".": {