mimir-ui-kit 1.38.10 → 1.38.11

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