mimir-ui-kit 1.38.10 → 1.38.12
Sign up to get free protection for your applications and to get access to all the features.
|
@@ -1 +1 @@
|
|
|
1
|
-
.
|
|
1
|
+
._buttons_l320r_2{display:inline-flex}._merged-button_l320r_6{--button-height: var(--button-height-m);--button-space: var(--mimir-control-space-xs)}._merged-button_l320r_6:first-child{border-radius:0;border-top-left-radius:var(--mimir-control-radius);border-bottom-left-radius:var(--mimir-control-radius)}._merged-button_l320r_6:last-child{border-radius:0;border-top-right-radius:var(--mimir-control-radius);border-bottom-right-radius:var(--mimir-control-radius)}._merged-button_l320r_6:hover{color:var(--button-color-hover);background:var(--button-bg-color-hover)}._merged-button_l320r_6:active{color:var(--button-color-active);background:var(--button-bg-color-active)}._merged-button_l320r_6._gray_l320r_28{--button-bg-color: var(--black-5);--button-bg-color-hover: var(--black-5);--button-bg-color-active: var(--asphalt-normal);--button-color: var(--asphalt-normal);--button-color-hover: var(--sapphire-normal);--button-color-active: var(--light-text)}._merged-button_l320r_6._white_l320r_36{--button-bg-color: var(--white-normal);--button-bg-color-active: var(--asphalt-normal);--button-bg-color-hover: var(--white-normal);--button-color: var(--asphalt-normal);--button-color-hover: var(--sapphire-normal);--button-color-active: var(--light-text)}._merged-button_l320r_6._transparent_l320r_44{--button-bg-color: var(--black-5);--button-bg-color-hover: var(--black-5);--button-bg-color-active: var(--asphalt-normal);--button-bg-color-focus: var(--sapphire-normal);--button-color: var(--light-text);--button-color-hover: var(--sapphire-normal);--button-color-active: var(--light-text)}._merged-button_l320r_6._is-icon_l320r_53{width:var(--button-height-m);padding:0}._merged-button_l320r_6._one-button_l320r_57{border-radius:var(--mimir-control-radius)}._merged-button_l320r_6:disabled{--button-cursor: not-allowed;color:var(--disabled-color);background-color:var(--black-5)}._merged-button_l320r_6:disabled:hover,._merged-button_l320r_6:disabled:active,._merged-button_l320r_6:disabled:focus{color:var(--disabled-color);background-color:var(--black-5);box-shadow:none}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.
|
|
1
|
+
._container_1pfd2_3{--pagination-active: #e5e5e5;display:flex;gap:var(--mimir-space-2xl);justify-content:center;margin:0 auto}._container_1pfd2_3:not(:last-child){margin-bottom:0 auto var(--mimir-space-xl)}@media (max-width: 767.9px){._container_1pfd2_3{gap:var(--mimir-space-xs)}}._container_1pfd2_3 ._pagination-button_1pfd2_18{display:flex;align-items:center;justify-content:center;width:40px;height:40px;color:var(--black-100);font-weight:var(--mimir-font-weight-text-regular);font-size:var(--mimir-size-text-l);font-family:var(--mimir-font-inter);background-color:transparent;border-radius:var(--mimir-control-radius);font-feature-settings:"zero"}._container_1pfd2_3 ._pagination-button_1pfd2_18:active{background-color:var(--pagination-active)}._container_1pfd2_3 ._pagination-button_1pfd2_18:focus-visible,._container_1pfd2_3 ._pagination-button_1pfd2_18:hover{color:var(--sapphire-normal);-webkit-text-decoration:none;text-decoration:none}._container_1pfd2_3 ._pagination-button_1pfd2_18._is-active_1pfd2_39{background-color:var(--pagination-active)}._container_1pfd2_3 ._ellipsis_1pfd2_42{-webkit-user-select:none;-moz-user-select:none;user-select:none;pointer-events:none}
|
|
@@ -1,45 +1,48 @@
|
|
|
1
|
-
import { jsx as
|
|
2
|
-
import { c as
|
|
3
|
-
import { memo as
|
|
4
|
-
import { EMergedButtonVariantRound as
|
|
1
|
+
import { jsx as e } from "react/jsx-runtime";
|
|
2
|
+
import { c as _ } from "../../index-DIxK0V-G.js";
|
|
3
|
+
import { memo as l } from "react";
|
|
4
|
+
import { EMergedButtonVariantRound as u } from "./constants.js";
|
|
5
5
|
import { Button as g } from "../Button/Button.js";
|
|
6
|
-
import '../../assets/MergedButton.css';const
|
|
7
|
-
buttons:
|
|
8
|
-
"merged-button": "_merged-
|
|
6
|
+
import '../../assets/MergedButton.css';const p = "_buttons_l320r_2", d = "_gray_l320r_28", B = "_white_l320r_36", I = "_transparent_l320r_44", o = {
|
|
7
|
+
buttons: p,
|
|
8
|
+
"merged-button": "_merged-button_l320r_6",
|
|
9
9
|
gray: d,
|
|
10
|
-
white:
|
|
11
|
-
transparent:
|
|
12
|
-
"is-icon": "_is-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
10
|
+
white: B,
|
|
11
|
+
transparent: I,
|
|
12
|
+
"is-icon": "_is-icon_l320r_53",
|
|
13
|
+
"one-button": "_one-button_l320r_57"
|
|
14
|
+
}, f = l(({ buttons: r }) => /* @__PURE__ */ e("div", { className: o.buttons, children: r.map(
|
|
15
|
+
({
|
|
16
|
+
variant: s = u.White,
|
|
17
|
+
disabled: n,
|
|
18
|
+
className: c,
|
|
19
|
+
...t
|
|
20
|
+
}, i) => {
|
|
21
|
+
const a = {
|
|
16
22
|
...t,
|
|
17
23
|
isIconButton: t.isIconButton ?? !1,
|
|
18
24
|
iconName: t.isIconButton ? t.iconName : void 0,
|
|
19
25
|
leftIcon: t.isIconButton ? void 0 : t.leftIcon,
|
|
20
26
|
rightIcon: t.isIconButton ? void 0 : t.rightIcon
|
|
21
|
-
}, m =
|
|
22
|
-
o[
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
t.className
|
|
29
|
-
);
|
|
30
|
-
return /* @__PURE__ */ s(
|
|
27
|
+
}, m = _(o["merged-button"], c, {
|
|
28
|
+
[o[s]]: !n,
|
|
29
|
+
[o.disabled]: n,
|
|
30
|
+
[o["is-icon"]]: t.isIconButton,
|
|
31
|
+
[o["one-button"]]: r.length === 1
|
|
32
|
+
});
|
|
33
|
+
return /* @__PURE__ */ e(
|
|
31
34
|
g,
|
|
32
35
|
{
|
|
33
36
|
clear: !0,
|
|
34
37
|
disabled: n,
|
|
35
38
|
className: m,
|
|
36
|
-
...
|
|
39
|
+
...a
|
|
37
40
|
},
|
|
38
|
-
|
|
41
|
+
i
|
|
39
42
|
);
|
|
40
43
|
}
|
|
41
44
|
) }));
|
|
42
|
-
|
|
45
|
+
f.displayName = "MergedButton";
|
|
43
46
|
export {
|
|
44
|
-
|
|
47
|
+
f as MergedButton
|
|
45
48
|
};
|
|
@@ -1,167 +1,169 @@
|
|
|
1
|
-
import { jsxs as P, jsx as
|
|
2
|
-
import { c as
|
|
3
|
-
import { forwardRef as
|
|
4
|
-
import { FIRST_PAGE_NUMBER as
|
|
1
|
+
import { jsxs as P, jsx as i } from "react/jsx-runtime";
|
|
2
|
+
import { c as _ } from "../../index-DIxK0V-G.js";
|
|
3
|
+
import { forwardRef as N, useState as v, useEffect as A } from "react";
|
|
4
|
+
import { FIRST_PAGE_NUMBER as u, DEFAULT_PER_PAGE as E } from "./constants.js";
|
|
5
5
|
import { useWindowSize as x } from "../../hooks/useWindowSize/index.js";
|
|
6
|
-
import {
|
|
7
|
-
import '../../assets/Pagination.css';const
|
|
8
|
-
container:
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
href: "#",
|
|
29
|
-
"aria-label": "Назад",
|
|
30
|
-
rel: "prev",
|
|
31
|
-
children: /* @__PURE__ */ e(v, { iconName: "ArrowLeft16px" })
|
|
32
|
-
}
|
|
33
|
-
)
|
|
34
|
-
}
|
|
35
|
-
);
|
|
36
|
-
}, M = ({
|
|
6
|
+
import { MergedButton as g } from "../MergedButton/MergedButton.js";
|
|
7
|
+
import '../../assets/Pagination.css';const j = "_container_1pfd2_3", w = "_ellipsis_1pfd2_42", C = {
|
|
8
|
+
container: j,
|
|
9
|
+
"pagination-button": "_pagination-button_1pfd2_18",
|
|
10
|
+
"is-active": "_is-active_1pfd2_39",
|
|
11
|
+
ellipsis: w
|
|
12
|
+
}, B = ({ currentPageNumber: t, onClick: n, setCurrentPage: o }) => /* @__PURE__ */ i(
|
|
13
|
+
g,
|
|
14
|
+
{
|
|
15
|
+
buttons: [
|
|
16
|
+
{
|
|
17
|
+
isIconButton: !0,
|
|
18
|
+
variant: "white",
|
|
19
|
+
onClick: () => {
|
|
20
|
+
t !== u && (o(t - 1), n(t - 1));
|
|
21
|
+
},
|
|
22
|
+
iconName: "ArrowLeft16px",
|
|
23
|
+
disabled: t === u
|
|
24
|
+
}
|
|
25
|
+
]
|
|
26
|
+
}
|
|
27
|
+
), I = ({
|
|
37
28
|
currentPageNumber: t,
|
|
38
29
|
lastPageNumber: n,
|
|
39
|
-
onClick:
|
|
40
|
-
setCurrentPage:
|
|
30
|
+
onClick: o,
|
|
31
|
+
setCurrentPage: s
|
|
41
32
|
}) => {
|
|
42
|
-
const
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
return /* @__PURE__ */ e(
|
|
46
|
-
"span",
|
|
33
|
+
const a = t >= n;
|
|
34
|
+
return /* @__PURE__ */ i(
|
|
35
|
+
g,
|
|
47
36
|
{
|
|
48
|
-
|
|
49
|
-
[s.disabled]: i
|
|
50
|
-
}),
|
|
51
|
-
children: /* @__PURE__ */ e(
|
|
52
|
-
"a",
|
|
37
|
+
buttons: [
|
|
53
38
|
{
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
39
|
+
isIconButton: !0,
|
|
40
|
+
variant: "white",
|
|
41
|
+
onClick: () => {
|
|
42
|
+
a || (s(t + 1), o(t + 1));
|
|
43
|
+
},
|
|
44
|
+
disabled: a,
|
|
45
|
+
iconName: "ArrowRight16px"
|
|
60
46
|
}
|
|
61
|
-
|
|
47
|
+
]
|
|
62
48
|
}
|
|
63
49
|
);
|
|
64
|
-
},
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
50
|
+
}, k = () => /* @__PURE__ */ i(
|
|
51
|
+
g,
|
|
52
|
+
{
|
|
53
|
+
buttons: [
|
|
54
|
+
{
|
|
55
|
+
children: "...",
|
|
56
|
+
variant: "transparent",
|
|
57
|
+
className: _(C["pagination-button"], C.ellipsis)
|
|
58
|
+
}
|
|
59
|
+
]
|
|
60
|
+
}
|
|
61
|
+
), h = ({
|
|
70
62
|
currentPageNumber: t,
|
|
71
63
|
newPageNumber: n,
|
|
72
|
-
onClick:
|
|
73
|
-
setCurrentPage:
|
|
64
|
+
onClick: o,
|
|
65
|
+
setCurrentPage: s
|
|
74
66
|
}) => {
|
|
75
|
-
const
|
|
76
|
-
|
|
77
|
-
},
|
|
78
|
-
return /* @__PURE__ */
|
|
79
|
-
|
|
67
|
+
const a = t === n, r = () => {
|
|
68
|
+
s(n), o(n);
|
|
69
|
+
}, e = n < 10 ? `0${n}` : n;
|
|
70
|
+
return /* @__PURE__ */ i(
|
|
71
|
+
"button",
|
|
72
|
+
{
|
|
73
|
+
type: "button",
|
|
74
|
+
onClick: r,
|
|
75
|
+
className: _(C["pagination-button"], {
|
|
76
|
+
[C["is-active"]]: a
|
|
77
|
+
}),
|
|
78
|
+
children: e
|
|
79
|
+
}
|
|
80
|
+
);
|
|
81
|
+
}, R = ({
|
|
80
82
|
start: t,
|
|
81
83
|
end: n,
|
|
82
|
-
currentPageNumber:
|
|
83
|
-
onClick:
|
|
84
|
-
setCurrentPage:
|
|
84
|
+
currentPageNumber: o,
|
|
85
|
+
onClick: s,
|
|
86
|
+
setCurrentPage: a
|
|
85
87
|
}) => {
|
|
86
|
-
const
|
|
87
|
-
for (let
|
|
88
|
-
|
|
89
|
-
/* @__PURE__ */
|
|
90
|
-
|
|
88
|
+
const r = [];
|
|
89
|
+
for (let e = t; e <= n; e++)
|
|
90
|
+
r.push(
|
|
91
|
+
/* @__PURE__ */ i(
|
|
92
|
+
h,
|
|
91
93
|
{
|
|
92
|
-
currentPageNumber:
|
|
93
|
-
setCurrentPage:
|
|
94
|
-
newPageNumber:
|
|
95
|
-
onClick:
|
|
94
|
+
currentPageNumber: o,
|
|
95
|
+
setCurrentPage: a,
|
|
96
|
+
newPageNumber: e,
|
|
97
|
+
onClick: s
|
|
96
98
|
},
|
|
97
|
-
|
|
99
|
+
e
|
|
98
100
|
)
|
|
99
101
|
);
|
|
100
|
-
return
|
|
101
|
-
},
|
|
102
|
+
return r;
|
|
103
|
+
}, U = N(
|
|
102
104
|
(t, n) => {
|
|
103
105
|
const {
|
|
104
|
-
rootClassName:
|
|
105
|
-
total:
|
|
106
|
-
perPage:
|
|
107
|
-
currentPageNumber:
|
|
108
|
-
onChange:
|
|
109
|
-
} = t, [c,
|
|
110
|
-
let
|
|
111
|
-
return
|
|
112
|
-
|
|
113
|
-
}, [
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
)) : c >
|
|
106
|
+
rootClassName: o,
|
|
107
|
+
total: s,
|
|
108
|
+
perPage: a = E,
|
|
109
|
+
currentPageNumber: r = u,
|
|
110
|
+
onChange: e
|
|
111
|
+
} = t, [c, d] = v(r), l = Math.ceil(s / a), { width: b } = x(), p = b <= 650 ? 2 : 4;
|
|
112
|
+
let m = 0, f = 0;
|
|
113
|
+
return A(() => {
|
|
114
|
+
d(r);
|
|
115
|
+
}, [r]), c <= p ? (m = u, f = Math.min(
|
|
116
|
+
u + p,
|
|
117
|
+
l
|
|
118
|
+
)) : c > l - p ? (m = l - p, f = l) : (m = c - p / 2, f = c + p / 2), s <= a ? null : /* @__PURE__ */ P(
|
|
117
119
|
"nav",
|
|
118
120
|
{
|
|
119
121
|
"aria-label": "Постраничная навигация",
|
|
120
|
-
className:
|
|
122
|
+
className: _(C.container, o),
|
|
121
123
|
ref: n,
|
|
122
124
|
children: [
|
|
123
|
-
/* @__PURE__ */
|
|
124
|
-
|
|
125
|
+
/* @__PURE__ */ i(
|
|
126
|
+
B,
|
|
125
127
|
{
|
|
126
128
|
currentPageNumber: c,
|
|
127
|
-
onClick:
|
|
128
|
-
setCurrentPage:
|
|
129
|
+
onClick: e,
|
|
130
|
+
setCurrentPage: d
|
|
129
131
|
}
|
|
130
132
|
),
|
|
131
|
-
|
|
132
|
-
|
|
133
|
+
m > u && /* @__PURE__ */ i(
|
|
134
|
+
h,
|
|
133
135
|
{
|
|
134
|
-
newPageNumber:
|
|
136
|
+
newPageNumber: u,
|
|
135
137
|
currentPageNumber: c,
|
|
136
|
-
onClick:
|
|
137
|
-
setCurrentPage:
|
|
138
|
+
onClick: e,
|
|
139
|
+
setCurrentPage: d
|
|
138
140
|
}
|
|
139
141
|
),
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
start:
|
|
143
|
-
end:
|
|
142
|
+
m > u + 1 && /* @__PURE__ */ i(k, {}),
|
|
143
|
+
R({
|
|
144
|
+
start: m,
|
|
145
|
+
end: f,
|
|
144
146
|
currentPageNumber: c,
|
|
145
|
-
setCurrentPage:
|
|
146
|
-
onClick:
|
|
147
|
+
setCurrentPage: d,
|
|
148
|
+
onClick: e
|
|
147
149
|
}),
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
150
|
+
f < l - 1 && /* @__PURE__ */ i(k, {}),
|
|
151
|
+
f < l && /* @__PURE__ */ i(
|
|
152
|
+
h,
|
|
151
153
|
{
|
|
152
|
-
newPageNumber:
|
|
154
|
+
newPageNumber: l,
|
|
153
155
|
currentPageNumber: c,
|
|
154
|
-
setCurrentPage:
|
|
155
|
-
onClick:
|
|
156
|
+
setCurrentPage: d,
|
|
157
|
+
onClick: e
|
|
156
158
|
}
|
|
157
159
|
),
|
|
158
|
-
/* @__PURE__ */
|
|
159
|
-
|
|
160
|
+
/* @__PURE__ */ i(
|
|
161
|
+
I,
|
|
160
162
|
{
|
|
161
163
|
currentPageNumber: c,
|
|
162
|
-
setCurrentPage:
|
|
163
|
-
lastPageNumber:
|
|
164
|
-
onClick:
|
|
164
|
+
setCurrentPage: d,
|
|
165
|
+
lastPageNumber: l,
|
|
166
|
+
onClick: e
|
|
165
167
|
}
|
|
166
168
|
)
|
|
167
169
|
]
|
|
@@ -170,5 +172,5 @@ import '../../assets/Pagination.css';const E = "_container_18kj0_2", D = "_item_
|
|
|
170
172
|
}
|
|
171
173
|
);
|
|
172
174
|
export {
|
|
173
|
-
|
|
175
|
+
U as Pagination
|
|
174
176
|
};
|