@megafon/ui-core 4.11.1 → 4.11.3

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.
Files changed (16) hide show
  1. package/CHANGELOG.md +20 -0
  2. package/dist/es/components/Button/Button.css +217 -115
  3. package/dist/es/components/Button/Button.js +5 -3
  4. package/dist/es/components/Notification/Notification.d.ts +3 -2
  5. package/dist/es/components/Notification/Notification.js +6 -2
  6. package/dist/es/components/Pagination/components/PaginationButtons/PaginationButtons.js +7 -2
  7. package/dist/es/components/Tooltip/Tooltip.css +13 -28
  8. package/dist/es/components/Tooltip/Tooltip.js +17 -16
  9. package/dist/lib/components/Button/Button.css +217 -115
  10. package/dist/lib/components/Button/Button.js +5 -3
  11. package/dist/lib/components/Notification/Notification.d.ts +3 -2
  12. package/dist/lib/components/Notification/Notification.js +6 -3
  13. package/dist/lib/components/Pagination/components/PaginationButtons/PaginationButtons.js +7 -2
  14. package/dist/lib/components/Tooltip/Tooltip.css +13 -28
  15. package/dist/lib/components/Tooltip/Tooltip.js +17 -16
  16. package/package.json +2 -2
package/CHANGELOG.md CHANGED
@@ -3,6 +3,26 @@
3
3
  All notable changes to this project will be documented in this file.
4
4
  See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
5
5
 
6
+ ## [4.11.3](https://github.com/MegafonWebLab/megafon-ui/compare/@megafon/ui-core@4.11.2...@megafon/ui-core@4.11.3) (2023-01-31)
7
+
8
+ **Note:** Version bump only for package @megafon/ui-core
9
+
10
+
11
+
12
+
13
+
14
+ ## [4.11.2](https://github.com/MegafonWebLab/megafon-ui/compare/@megafon/ui-core@4.11.1...@megafon/ui-core@4.11.2) (2023-01-23)
15
+
16
+
17
+ ### Bug Fixes
18
+
19
+ * **button:** fixed styles ([1fc2ad3](https://github.com/MegafonWebLab/megafon-ui/commit/1fc2ad37f0b8b57e992f764802f11316b95539d3))
20
+ * **tooltip:** fix margins ([5572397](https://github.com/MegafonWebLab/megafon-ui/commit/55723976459d58ecf131e9fe5aee570c9871b1d2))
21
+
22
+
23
+
24
+
25
+
6
26
  ## [4.11.1](https://github.com/MegafonWebLab/megafon-ui/compare/@megafon/ui-core@4.11.0...@megafon/ui-core@4.11.1) (2023-01-17)
7
27
 
8
28
  **Note:** Version bump only for package @megafon/ui-core
package/dist/es/components/Button/Button.css CHANGED
@@ -5,6 +5,9 @@
5
5
  display: inline-block;
6
6
  -webkit-box-sizing: border-box;
7
7
  box-sizing: border-box;
8
+ min-width: -webkit-fit-content;
9
+ min-width: -moz-fit-content;
10
+ min-width: fit-content;
8
11
  padding: 0 32px;
9
12
  border: none;
10
13
  border-radius: 30px;
@@ -30,196 +33,301 @@
30
33
  transition: fill 0.3s;
31
34
  }
32
35
  .mfui-button_size-all_extra-small {
36
+ min-width: 24px;
37
+ height: 24px;
33
38
  padding: 0 16px;
34
- }
35
- .mfui-button_size-all_extra-small .mfui-button__inner {
36
39
  font-size: 12px;
37
- line-height: 18px;
38
- min-width: 26px;
39
- height: 26px;
40
+ line-height: 14px;
40
41
  }
41
- .mfui-button_size-all_small .mfui-button__inner {
42
+ .mfui-button_size-all_extra-small .mfui-button__icon,
43
+ .mfui-button_size-all_extra-small .mfui-button__icon-arrow {
44
+ width: 20px;
45
+ height: 20px;
46
+ }
47
+ .mfui-button_size-all_small {
42
48
  min-width: 40px;
43
49
  height: 40px;
50
+ padding: 0 24px;
51
+ }
52
+ .mfui-button_size-all_small .mfui-button__icon,
53
+ .mfui-button_size-all_small .mfui-button__icon-arrow {
54
+ width: 20px;
55
+ height: 20px;
44
56
  }
45
- .mfui-button_size-all_medium .mfui-button__inner {
57
+ .mfui-button_size-all_medium {
46
58
  min-width: 52px;
47
59
  height: 52px;
48
60
  }
49
- .mfui-button_size-all_large .mfui-button__inner {
61
+ .mfui-button_size-all_medium .mfui-button__icon,
62
+ .mfui-button_size-all_medium .mfui-button__icon-arrow {
63
+ width: 32px;
64
+ height: 32px;
65
+ }
66
+ .mfui-button_size-all_large {
50
67
  min-width: 60px;
51
68
  height: 60px;
52
69
  }
53
- .mfui-button_size-all_extra-small .mfui-button__icon {
54
- width: 18px;
55
- height: 18px;
70
+ .mfui-button_size-all_large .mfui-button__icon,
71
+ .mfui-button_size-all_large .mfui-button__icon-arrow {
72
+ width: 32px;
73
+ height: 32px;
56
74
  }
57
- .mfui-button_size-all_small .mfui-button__icon {
58
- width: 16px;
59
- height: 16px;
75
+ .mfui-button_size-all_extra-small.mfui-buttonhas-arrow {
76
+ padding: 0 8px;
60
77
  }
61
- .mfui-button_size-all_medium .mfui-button__icon {
62
- width: 24px;
63
- height: 24px;
78
+ .mfui-button_size-all_extra-small.mfui-buttonhas-arrow .mfui-button__content {
79
+ padding-left: 12px;
64
80
  }
65
- .mfui-button_size-all_large .mfui-button__icon {
66
- width: 40px;
67
- height: 40px;
81
+ .mfui-button_size-all_medium.mfui-buttonhas-arrow,
82
+ .mfui-button_size-all_large.mfui-buttonhas-arrow {
83
+ padding: 0 24px;
84
+ }
85
+ .mfui-button_size-all_small.mfui-buttonhas-arrow .mfui-button__content,
86
+ .mfui-button_size-all_medium.mfui-buttonhas-arrow .mfui-button__content,
87
+ .mfui-button_size-all_large.mfui-buttonhas-arrow .mfui-button__content {
88
+ padding-left: 16px;
89
+ }
90
+ .mfui-button_type_text {
91
+ padding: 0;
68
92
  }
69
93
  @media screen and (min-width: 1280px) {
70
94
  .mfui-button_size-wide_extra-small {
95
+ min-width: 24px;
96
+ height: 24px;
71
97
  padding: 0 16px;
72
- }
73
- .mfui-button_size-wide_extra-small .mfui-button__inner {
74
98
  font-size: 12px;
75
- line-height: 18px;
76
- min-width: 26px;
77
- height: 26px;
99
+ line-height: 14px;
78
100
  }
79
- .mfui-button_size-wide_small .mfui-button__inner {
101
+ .mfui-button_size-wide_extra-small .mfui-button__icon,
102
+ .mfui-button_size-wide_extra-small .mfui-button__icon-arrow {
103
+ width: 20px;
104
+ height: 20px;
105
+ }
106
+ .mfui-button_size-wide_small {
80
107
  min-width: 40px;
81
108
  height: 40px;
109
+ padding: 0 24px;
110
+ }
111
+ .mfui-button_size-wide_small .mfui-button__icon,
112
+ .mfui-button_size-wide_small .mfui-button__icon-arrow {
113
+ width: 20px;
114
+ height: 20px;
82
115
  }
83
- .mfui-button_size-wide_medium .mfui-button__inner {
116
+ .mfui-button_size-wide_medium {
84
117
  min-width: 52px;
85
118
  height: 52px;
86
119
  }
87
- .mfui-button_size-wide_large .mfui-button__inner {
120
+ .mfui-button_size-wide_medium .mfui-button__icon,
121
+ .mfui-button_size-wide_medium .mfui-button__icon-arrow {
122
+ width: 32px;
123
+ height: 32px;
124
+ }
125
+ .mfui-button_size-wide_large {
88
126
  min-width: 60px;
89
127
  height: 60px;
90
128
  }
91
- .mfui-button_size-wide_extra-small .mfui-button__icon {
92
- width: 18px;
93
- height: 18px;
129
+ .mfui-button_size-wide_large .mfui-button__icon,
130
+ .mfui-button_size-wide_large .mfui-button__icon-arrow {
131
+ width: 32px;
132
+ height: 32px;
94
133
  }
95
- .mfui-button_size-wide_small .mfui-button__icon {
96
- width: 16px;
97
- height: 16px;
134
+ .mfui-button_size-wide_extra-small.mfui-buttonhas-arrow {
135
+ padding: 0 8px;
98
136
  }
99
- .mfui-button_size-wide_medium .mfui-button__icon {
100
- width: 24px;
101
- height: 24px;
137
+ .mfui-button_size-wide_extra-small.mfui-buttonhas-arrow .mfui-button__content {
138
+ padding-left: 12px;
102
139
  }
103
- .mfui-button_size-wide_large .mfui-button__icon {
104
- width: 40px;
105
- height: 40px;
140
+ .mfui-button_size-wide_medium.mfui-buttonhas-arrow,
141
+ .mfui-button_size-wide_large.mfui-buttonhas-arrow {
142
+ padding: 0 24px;
143
+ }
144
+ .mfui-button_size-wide_small.mfui-buttonhas-arrow .mfui-button__content,
145
+ .mfui-button_size-wide_medium.mfui-buttonhas-arrow .mfui-button__content,
146
+ .mfui-button_size-wide_large.mfui-buttonhas-arrow .mfui-button__content {
147
+ padding-left: 16px;
148
+ }
149
+ .mfui-button_type_text {
150
+ padding: 0;
106
151
  }
107
152
  }
108
153
  @media screen and (min-width: 1024px) {
109
154
  .mfui-button_size-desktop_extra-small {
155
+ min-width: 24px;
156
+ height: 24px;
110
157
  padding: 0 16px;
111
- }
112
- .mfui-button_size-desktop_extra-small .mfui-button__inner {
113
158
  font-size: 12px;
114
- line-height: 18px;
115
- min-width: 26px;
116
- height: 26px;
159
+ line-height: 14px;
117
160
  }
118
- .mfui-button_size-desktop_small .mfui-button__inner {
161
+ .mfui-button_size-desktop_extra-small .mfui-button__icon,
162
+ .mfui-button_size-desktop_extra-small .mfui-button__icon-arrow {
163
+ width: 20px;
164
+ height: 20px;
165
+ }
166
+ .mfui-button_size-desktop_small {
119
167
  min-width: 40px;
120
168
  height: 40px;
169
+ padding: 0 24px;
170
+ }
171
+ .mfui-button_size-desktop_small .mfui-button__icon,
172
+ .mfui-button_size-desktop_small .mfui-button__icon-arrow {
173
+ width: 20px;
174
+ height: 20px;
121
175
  }
122
- .mfui-button_size-desktop_medium .mfui-button__inner {
176
+ .mfui-button_size-desktop_medium {
123
177
  min-width: 52px;
124
178
  height: 52px;
125
179
  }
126
- .mfui-button_size-desktop_large .mfui-button__inner {
180
+ .mfui-button_size-desktop_medium .mfui-button__icon,
181
+ .mfui-button_size-desktop_medium .mfui-button__icon-arrow {
182
+ width: 32px;
183
+ height: 32px;
184
+ }
185
+ .mfui-button_size-desktop_large {
127
186
  min-width: 60px;
128
187
  height: 60px;
129
188
  }
130
- .mfui-button_size-desktop_extra-small .mfui-button__icon {
131
- width: 18px;
132
- height: 18px;
189
+ .mfui-button_size-desktop_large .mfui-button__icon,
190
+ .mfui-button_size-desktop_large .mfui-button__icon-arrow {
191
+ width: 32px;
192
+ height: 32px;
133
193
  }
134
- .mfui-button_size-desktop_small .mfui-button__icon {
135
- width: 16px;
136
- height: 16px;
194
+ .mfui-button_size-desktop_extra-small.mfui-buttonhas-arrow {
195
+ padding: 0 8px;
137
196
  }
138
- .mfui-button_size-desktop_medium .mfui-button__icon {
139
- width: 24px;
140
- height: 24px;
197
+ .mfui-button_size-desktop_extra-small.mfui-buttonhas-arrow .mfui-button__content {
198
+ padding-left: 12px;
141
199
  }
142
- .mfui-button_size-desktop_large .mfui-button__icon {
143
- width: 40px;
144
- height: 40px;
200
+ .mfui-button_size-desktop_medium.mfui-buttonhas-arrow,
201
+ .mfui-button_size-desktop_large.mfui-buttonhas-arrow {
202
+ padding: 0 24px;
203
+ }
204
+ .mfui-button_size-desktop_small.mfui-buttonhas-arrow .mfui-button__content,
205
+ .mfui-button_size-desktop_medium.mfui-buttonhas-arrow .mfui-button__content,
206
+ .mfui-button_size-desktop_large.mfui-buttonhas-arrow .mfui-button__content {
207
+ padding-left: 16px;
208
+ }
209
+ .mfui-button_type_text {
210
+ padding: 0;
145
211
  }
146
212
  }
147
213
  @media screen and (min-width: 768px) and (max-width: 1023px) {
148
214
  .mfui-button_size-tablet_extra-small {
215
+ min-width: 24px;
216
+ height: 24px;
149
217
  padding: 0 16px;
150
- }
151
- .mfui-button_size-tablet_extra-small .mfui-button__inner {
152
218
  font-size: 12px;
153
- line-height: 18px;
154
- min-width: 26px;
155
- height: 26px;
219
+ line-height: 14px;
220
+ }
221
+ .mfui-button_size-tablet_extra-small .mfui-button__icon,
222
+ .mfui-button_size-tablet_extra-small .mfui-button__icon-arrow {
223
+ width: 20px;
224
+ height: 20px;
156
225
  }
157
- .mfui-button_size-tablet_small .mfui-button__inner {
226
+ .mfui-button_size-tablet_small {
158
227
  min-width: 40px;
159
228
  height: 40px;
229
+ padding: 0 24px;
160
230
  }
161
- .mfui-button_size-tablet_medium .mfui-button__inner {
231
+ .mfui-button_size-tablet_small .mfui-button__icon,
232
+ .mfui-button_size-tablet_small .mfui-button__icon-arrow {
233
+ width: 20px;
234
+ height: 20px;
235
+ }
236
+ .mfui-button_size-tablet_medium {
162
237
  min-width: 52px;
163
238
  height: 52px;
164
239
  }
165
- .mfui-button_size-tablet_large .mfui-button__inner {
240
+ .mfui-button_size-tablet_medium .mfui-button__icon,
241
+ .mfui-button_size-tablet_medium .mfui-button__icon-arrow {
242
+ width: 32px;
243
+ height: 32px;
244
+ }
245
+ .mfui-button_size-tablet_large {
166
246
  min-width: 60px;
167
247
  height: 60px;
168
248
  }
169
- .mfui-button_size-tablet_extra-small .mfui-button__icon {
170
- width: 18px;
171
- height: 18px;
249
+ .mfui-button_size-tablet_large .mfui-button__icon,
250
+ .mfui-button_size-tablet_large .mfui-button__icon-arrow {
251
+ width: 32px;
252
+ height: 32px;
172
253
  }
173
- .mfui-button_size-tablet_small .mfui-button__icon {
174
- width: 16px;
175
- height: 16px;
254
+ .mfui-button_size-tablet_extra-small.mfui-buttonhas-arrow {
255
+ padding: 0 8px;
176
256
  }
177
- .mfui-button_size-tablet_medium .mfui-button__icon {
178
- width: 24px;
179
- height: 24px;
257
+ .mfui-button_size-tablet_extra-small.mfui-buttonhas-arrow .mfui-button__content {
258
+ padding-left: 12px;
180
259
  }
181
- .mfui-button_size-tablet_large .mfui-button__icon {
182
- width: 40px;
183
- height: 40px;
260
+ .mfui-button_size-tablet_medium.mfui-buttonhas-arrow,
261
+ .mfui-button_size-tablet_large.mfui-buttonhas-arrow {
262
+ padding: 0 24px;
263
+ }
264
+ .mfui-button_size-tablet_small.mfui-buttonhas-arrow .mfui-button__content,
265
+ .mfui-button_size-tablet_medium.mfui-buttonhas-arrow .mfui-button__content,
266
+ .mfui-button_size-tablet_large.mfui-buttonhas-arrow .mfui-button__content {
267
+ padding-left: 16px;
268
+ }
269
+ .mfui-button_type_text {
270
+ padding: 0;
184
271
  }
185
272
  }
186
273
  @media screen and (max-width: 767px) {
187
274
  .mfui-button_size-mobile_extra-small {
275
+ min-width: 24px;
276
+ height: 24px;
188
277
  padding: 0 16px;
189
- }
190
- .mfui-button_size-mobile_extra-small .mfui-button__inner {
191
278
  font-size: 12px;
192
- line-height: 18px;
193
- min-width: 26px;
194
- height: 26px;
279
+ line-height: 14px;
280
+ }
281
+ .mfui-button_size-mobile_extra-small .mfui-button__icon,
282
+ .mfui-button_size-mobile_extra-small .mfui-button__icon-arrow {
283
+ width: 20px;
284
+ height: 20px;
195
285
  }
196
- .mfui-button_size-mobile_small .mfui-button__inner {
286
+ .mfui-button_size-mobile_small {
197
287
  min-width: 40px;
198
288
  height: 40px;
289
+ padding: 0 24px;
199
290
  }
200
- .mfui-button_size-mobile_medium .mfui-button__inner {
291
+ .mfui-button_size-mobile_small .mfui-button__icon,
292
+ .mfui-button_size-mobile_small .mfui-button__icon-arrow {
293
+ width: 20px;
294
+ height: 20px;
295
+ }
296
+ .mfui-button_size-mobile_medium {
201
297
  min-width: 52px;
202
298
  height: 52px;
203
299
  }
204
- .mfui-button_size-mobile_large .mfui-button__inner {
300
+ .mfui-button_size-mobile_medium .mfui-button__icon,
301
+ .mfui-button_size-mobile_medium .mfui-button__icon-arrow {
302
+ width: 32px;
303
+ height: 32px;
304
+ }
305
+ .mfui-button_size-mobile_large {
205
306
  min-width: 60px;
206
307
  height: 60px;
207
308
  }
208
- .mfui-button_size-mobile_extra-small .mfui-button__icon {
209
- width: 18px;
210
- height: 18px;
309
+ .mfui-button_size-mobile_large .mfui-button__icon,
310
+ .mfui-button_size-mobile_large .mfui-button__icon-arrow {
311
+ width: 32px;
312
+ height: 32px;
211
313
  }
212
- .mfui-button_size-mobile_small .mfui-button__icon {
213
- width: 16px;
214
- height: 16px;
314
+ .mfui-button_size-mobile_extra-small.mfui-buttonhas-arrow {
315
+ padding: 0 8px;
215
316
  }
216
- .mfui-button_size-mobile_medium .mfui-button__icon {
217
- width: 24px;
218
- height: 24px;
317
+ .mfui-button_size-mobile_extra-small.mfui-buttonhas-arrow .mfui-button__content {
318
+ padding-left: 12px;
219
319
  }
220
- .mfui-button_size-mobile_large .mfui-button__icon {
221
- width: 40px;
222
- height: 40px;
320
+ .mfui-button_size-mobile_medium.mfui-buttonhas-arrow,
321
+ .mfui-button_size-mobile_large.mfui-buttonhas-arrow {
322
+ padding: 0 24px;
323
+ }
324
+ .mfui-button_size-mobile_small.mfui-buttonhas-arrow .mfui-button__content,
325
+ .mfui-button_size-mobile_medium.mfui-buttonhas-arrow .mfui-button__content,
326
+ .mfui-button_size-mobile_large.mfui-buttonhas-arrow .mfui-button__content {
327
+ padding-left: 16px;
328
+ }
329
+ .mfui-button_type_text {
330
+ padding: 0;
223
331
  }
224
332
  }
225
333
  .mfui-button:hover {
@@ -247,6 +355,7 @@
247
355
  -webkit-box-sizing: border-box;
248
356
  box-sizing: border-box;
249
357
  width: 100%;
358
+ height: inherit;
250
359
  vertical-align: top;
251
360
  }
252
361
  .mfui-button__text {
@@ -280,19 +389,18 @@
280
389
  .mfui-button__icon-arrow {
281
390
  width: 32px;
282
391
  height: 32px;
283
- margin-right: -8px;
284
392
  margin-left: 4px;
285
393
  }
286
394
  .mfui-button_content-type_icon {
287
395
  padding: 0;
288
396
  }
289
397
  .mfui-button_content-type_icon-text .mfui-button__icon {
290
- width: 24px;
291
- height: 24px;
292
- margin-right: 8px;
293
- margin-left: -8px;
398
+ width: 32px;
399
+ height: 32px;
400
+ margin-right: 4px;
294
401
  }
295
- .mfui-button_content-type_icon-text.mfui-button_size-all_small .mfui-button__icon {
402
+ .mfui-button_content-type_icon-text.mfui-button_size-all_small .mfui-button__icon,
403
+ .mfui-button_content-type_icon-text.mfui-button_size-all_extra-small .mfui-button__icon {
296
404
  display: none;
297
405
  }
298
406
  .mfui-button_type_text.mfui-button_theme_green {
@@ -301,9 +409,6 @@
301
409
  width: fit-content;
302
410
  color: var(--brandGreen);
303
411
  background-color: transparent;
304
- block-size: -webkit-fit-content;
305
- block-size: -moz-fit-content;
306
- block-size: fit-content;
307
412
  }
308
413
  .mfui-button_type_text.mfui-button_theme_green svg {
309
414
  fill: var(--brandGreen);
@@ -326,9 +431,6 @@
326
431
  width: fit-content;
327
432
  color: var(--brandPurple);
328
433
  background-color: transparent;
329
- block-size: -webkit-fit-content;
330
- block-size: -moz-fit-content;
331
- block-size: fit-content;
332
434
  }
333
435
  .mfui-button_type_text.mfui-button_theme_purple svg {
334
436
  fill: var(--brandPurple);
@@ -351,9 +453,6 @@
351
453
  width: fit-content;
352
454
  color: var(--stcWhite);
353
455
  background-color: transparent;
354
- block-size: -webkit-fit-content;
355
- block-size: -moz-fit-content;
356
- block-size: fit-content;
357
456
  }
358
457
  .mfui-button_type_text.mfui-button_theme_white svg {
359
458
  fill: var(--stcWhite);
@@ -371,6 +470,9 @@
371
470
  fill: var(--buttonDown);
372
471
  }
373
472
  .mfui-button_type_text.mfui-button_theme_black {
473
+ width: -webkit-fit-content;
474
+ width: -moz-fit-content;
475
+ width: fit-content;
374
476
  color: var(--stcBlack);
375
477
  background-color: transparent;
376
478
  }
package/dist/es/components/Button/Button.js CHANGED
@@ -96,6 +96,7 @@ var Button = function Button(_ref) {
96
96
  setTouch = _React$useState2[1];
97
97
 
98
98
  var ElementType = href ? 'a' : 'button';
99
+ var displayArrow = showArrow && !icon;
99
100
  var handleClick = React.useCallback(function (e) {
100
101
  if (disabled) {
101
102
  e.preventDefault();
@@ -138,10 +139,10 @@ var Button = function Button(_ref) {
138
139
  className: cn('text', {
139
140
  ellipsis: ellipsis
140
141
  })
141
- }, filterDataAttrs(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.text)), children), !icon && showArrow && /*#__PURE__*/React.createElement(Arrow, _extends({
142
+ }, filterDataAttrs(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.text)), children), displayArrow && /*#__PURE__*/React.createElement(Arrow, _extends({
142
143
  className: cn('icon-arrow')
143
144
  }, filterDataAttrs(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.arrow))));
144
- }, [children, icon, dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.content, dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.text, dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.arrow, ellipsis, showLoader, contentClassName, showArrow]);
145
+ }, [children, icon, dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.content, dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.text, dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.arrow, ellipsis, showLoader, contentClassName, displayArrow]);
145
146
  var contentType = React.useMemo(function () {
146
147
  switch (true) {
147
148
  case icon && !children:
@@ -202,7 +203,8 @@ var Button = function Button(_ref) {
202
203
  'full-width': fullWidth,
203
204
  loading: showLoader,
204
205
  'no-touch': !isTouch,
205
- 'content-type': contentType
206
+ 'content-type': contentType,
207
+ 'has-arrow': displayArrow
206
208
  }, classNameValue),
207
209
  href: href,
208
210
  download: !!href && download,
package/dist/es/components/Notification/Notification.d.ts CHANGED
@@ -1,13 +1,13 @@
1
1
  import React from 'react';
2
2
  import './Notification.less';
3
- export declare const NotificationTypes: {
3
+ declare const NotificationTypes: {
4
4
  readonly SUCCESS: "success";
5
5
  readonly WARNING: "warning";
6
6
  readonly ERROR: "error";
7
7
  readonly INFO: "info";
8
8
  };
9
9
  declare type NotificationType = typeof NotificationTypes[keyof typeof NotificationTypes];
10
- export declare const ShadowTypes: {
10
+ declare const ShadowTypes: {
11
11
  readonly ZERO: "zero";
12
12
  /** @deprecated TODO: нужно удалить значение при выпуске мажорной версии */
13
13
  readonly LOW: "low";
@@ -80,5 +80,6 @@ export interface INotificationProps {
80
80
  /** Обработчик клика по кнопке расхлопа */
81
81
  onCollapseButtonClick?: (value: boolean) => void;
82
82
  }
83
+ export declare const testIdPrefix = "Notification";
83
84
  declare const Notification: React.FC<INotificationProps>;
84
85
  export default Notification;
package/dist/es/components/Notification/Notification.js CHANGED
@@ -74,13 +74,13 @@ var CancelIcon = function CancelIcon(props) {
74
74
  };
75
75
 
76
76
  var TIMEOUT_DELAY = 400;
77
- export var NotificationTypes = {
77
+ var NotificationTypes = {
78
78
  SUCCESS: 'success',
79
79
  WARNING: 'warning',
80
80
  ERROR: 'error',
81
81
  INFO: 'info'
82
82
  };
83
- export var ShadowTypes = {
83
+ var ShadowTypes = {
84
84
  ZERO: 'zero',
85
85
 
86
86
  /** @deprecated TODO: нужно удалить значение при выпуске мажорной версии */
@@ -92,6 +92,7 @@ export var ShadowTypes = {
92
92
  PRESSED: 'pressed',
93
93
  DEFAULT: 'default'
94
94
  };
95
+ export var testIdPrefix = 'Notification';
95
96
  var cn = cnCreate('mfui-notification');
96
97
 
97
98
  var Notification = function Notification(_ref) {
@@ -286,10 +287,12 @@ var Notification = function Notification(_ref) {
286
287
  colored: isColored
287
288
  }, [className, rootClass])
288
289
  }, /*#__PURE__*/React.createElement("div", {
290
+ "data-testid": "".concat(testIdPrefix, "-container"),
289
291
  className: cn('container', [containerClass])
290
292
  }, /*#__PURE__*/React.createElement("div", {
291
293
  className: cn('icon-container')
292
294
  }, renderIcon()), /*#__PURE__*/React.createElement("div", {
295
+ "data-testid": "".concat(testIdPrefix, "-content"),
293
296
  className: cn('content', [contentClass])
294
297
  }, /*#__PURE__*/React.createElement("div", {
295
298
  className: cn('text-container')
@@ -308,6 +311,7 @@ var Notification = function Notification(_ref) {
308
311
  ref: fullTextRef,
309
312
  className: cn('full-text', textClasses.full)
310
313
  }, children))), hasBottom && /*#__PURE__*/React.createElement("div", {
314
+ "data-testid": "".concat(testIdPrefix, "-bottom"),
311
315
  className: cn('bottom', {
312
316
  'has-button': !!buttonText
313
317
  })
package/dist/es/components/Pagination/components/PaginationButtons/PaginationButtons.js CHANGED
@@ -31,10 +31,15 @@ var PaginationButtons = function PaginationButtons(_ref) {
31
31
 
32
32
  if (isHiddenButton) {
33
33
  return /*#__PURE__*/React.createElement(PaginationButton, {
34
- className: cn('button'),
35
34
  disabled: true,
36
35
  key: index,
37
- theme: theme
36
+ theme: theme,
37
+ className: cn('button'),
38
+ dataAttrs: {
39
+ root: {
40
+ 'data-testid': 'hiddenButton'
41
+ }
42
+ }
38
43
  }, /*#__PURE__*/React.createElement(NothingIcon, null));
39
44
  }
40
45