@megafon/ui-core 4.0.0-beta.15 → 4.0.0-beta.18

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 (12) hide show
  1. package/CHANGELOG.md +34 -0
  2. package/dist/es/components/Select/Select.css +3 -13
  3. package/dist/es/components/Tabs/Tabs.css +11 -0
  4. package/dist/es/components/Tabs/Tabs.js +2 -0
  5. package/dist/es/components/TextField/TextField.css +1 -1
  6. package/dist/es/components/TextField/TextField.js +4 -3
  7. package/dist/lib/components/Select/Select.css +3 -13
  8. package/dist/lib/components/Tabs/Tabs.css +11 -0
  9. package/dist/lib/components/Tabs/Tabs.js +2 -0
  10. package/dist/lib/components/TextField/TextField.css +1 -1
  11. package/dist/lib/components/TextField/TextField.js +4 -3
  12. package/package.json +2 -2
package/CHANGELOG.md CHANGED
@@ -3,6 +3,40 @@
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.0.0-beta.18](https://github.com/MegafonWebLab/megafon-ui/compare/@megafon/ui-core@4.0.0-beta.17...@megafon/ui-core@4.0.0-beta.18) (2022-08-22)
7
+
8
+
9
+ ### Bug Fixes
10
+
11
+ * **tabs:** fix swiper overflow and box-sizing ([bbfb09d](https://github.com/MegafonWebLab/megafon-ui/commit/bbfb09d86223c3dc1f70aaa2a03d108256c3a37d))
12
+
13
+
14
+
15
+
16
+
17
+ # [4.0.0-beta.17](https://github.com/MegafonWebLab/megafon-ui/compare/@megafon/ui-core@4.0.0-beta.16...@megafon/ui-core@4.0.0-beta.17) (2022-08-22)
18
+
19
+
20
+ ### Bug Fixes
21
+
22
+ * **select:** fix items overflow ([6c795a3](https://github.com/MegafonWebLab/megafon-ui/commit/6c795a35ae27e8100edd6d6ec7456962b8f62a41))
23
+ * **tabs:** fix container alignment ([2bd4f31](https://github.com/MegafonWebLab/megafon-ui/commit/2bd4f31fba455a817e9597103c25ca97fe33d2d8))
24
+
25
+
26
+
27
+
28
+
29
+ # [4.0.0-beta.16](https://github.com/MegafonWebLab/megafon-ui/compare/@megafon/ui-core@4.0.0-beta.15...@megafon/ui-core@4.0.0-beta.16) (2022-08-17)
30
+
31
+
32
+ ### Bug Fixes
33
+
34
+ * **textfield:** fixes permanently visible block after the field ([9cc5184](https://github.com/MegafonWebLab/megafon-ui/commit/9cc5184f7b60a7f7dcfe3f9f49cc3199787a77d7))
35
+
36
+
37
+
38
+
39
+
6
40
  # [4.0.0-beta.15](https://github.com/MegafonWebLab/megafon-ui/compare/@megafon/ui-core@4.0.0-beta.14...@megafon/ui-core@4.0.0-beta.15) (2022-08-15)
7
41
 
8
42
 
package/dist/es/components/Select/Select.css CHANGED
@@ -58,6 +58,7 @@
58
58
  position: absolute;
59
59
  top: 50%;
60
60
  right: 27px;
61
+ z-index: 1;
61
62
  display: block;
62
63
  border-top: 6px solid;
63
64
  border-right: 5px solid transparent;
@@ -119,6 +120,7 @@
119
120
  -webkit-box-align: center;
120
121
  -ms-flex-align: center;
121
122
  align-items: center;
123
+ overflow: hidden;
122
124
  }
123
125
  .mfui-select__title-inner_hide-value .mfui-select__title-value {
124
126
  color: var(--spbSky3);
@@ -145,7 +147,7 @@
145
147
  content: '';
146
148
  position: absolute;
147
149
  top: 0;
148
- right: 0;
150
+ right: 40px;
149
151
  bottom: 0;
150
152
  width: 40px;
151
153
  background: -webkit-gradient(linear, left top, right top, from(rgba(255, 255, 255, 0)), to(var(--base)));
@@ -209,18 +211,6 @@
209
211
  -webkit-box-align: center;
210
212
  -ms-flex-align: center;
211
213
  align-items: center;
212
- overflow: hidden;
213
- white-space: nowrap;
214
- }
215
- .mfui-select__item-title:after {
216
- content: '';
217
- position: absolute;
218
- top: 0;
219
- right: 0;
220
- bottom: 0;
221
- width: 40px;
222
- background: -webkit-gradient(linear, left top, right top, from(rgba(255, 255, 255, 0)), to(var(--base)));
223
- background: linear-gradient(to right, rgba(255, 255, 255, 0), var(--base));
224
214
  }
225
215
  .mfui-select__item-title_active {
226
216
  font-weight: 600;
package/dist/es/components/Tabs/Tabs.css CHANGED
@@ -6,10 +6,19 @@
6
6
  display: flex;
7
7
  width: 100%;
8
8
  }
9
+ .mfui-tabs__wrapper {
10
+ display: -webkit-box;
11
+ display: -ms-flexbox;
12
+ display: flex;
13
+ -webkit-box-pack: center;
14
+ -ms-flex-pack: center;
15
+ justify-content: center;
16
+ }
9
17
  .mfui-tabs__swiper-wrapper {
10
18
  display: -webkit-box;
11
19
  display: -ms-flexbox;
12
20
  display: flex;
21
+ width: 100%;
13
22
  }
14
23
  .mfui-tabs__swiper {
15
24
  font-family: inherit;
@@ -131,6 +140,8 @@
131
140
  -webkit-box-pack: center;
132
141
  -ms-flex-pack: center;
133
142
  justify-content: center;
143
+ -webkit-box-sizing: border-box;
144
+ box-sizing: border-box;
134
145
  height: 36px;
135
146
  padding: 2px 12px;
136
147
  color: var(--spbSky3);
package/dist/es/components/Tabs/Tabs.js CHANGED
@@ -370,6 +370,7 @@ var Tabs = function Tabs(_ref) {
370
370
  }, [className, rootClass]),
371
371
  ref: rootRef
372
372
  }), /*#__PURE__*/React.createElement("div", {
373
+ className: cn('wrapper'),
373
374
  ref: tabListRef,
374
375
  style: {
375
376
  height: tabListHeight
@@ -386,6 +387,7 @@ var Tabs = function Tabs(_ref) {
386
387
  beginning: isBeginning,
387
388
  end: isEnd
388
389
  }, [innerIndentsClass]),
390
+ watchOverflow: true,
389
391
  slidesPerView: "auto",
390
392
  initialSlide: currentIndex,
391
393
  onSwiper: handleSwiper,
package/dist/es/components/TextField/TextField.css CHANGED
@@ -231,7 +231,7 @@
231
231
  .mfui-text-field__require-mark {
232
232
  color: var(--fury);
233
233
  }
234
- .mfui-text-field__wrap {
234
+ .mfui-text-field__field-bottom-wrapper {
235
235
  display: -webkit-box;
236
236
  display: -ms-flexbox;
237
237
  display: flex;
package/dist/es/components/TextField/TextField.js CHANGED
@@ -430,6 +430,7 @@ var TextField = function TextField(_ref) {
430
430
  var isPlaceholderShowed = isPasswordType && isPasswordHidden && !!inputValue;
431
431
  var valueHasSymbols = inputValue !== null && inputValue !== undefined;
432
432
  var currentSymbolCount = valueHasSymbols && String(inputValue).length || 0;
433
+ var showAdditionalBlock = displayedNoticeText || symbolCounter;
433
434
  return /*#__PURE__*/React.createElement("div", _extends({}, filterDataAttrs(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.root), {
434
435
  className: cn({
435
436
  disabled: disabled,
@@ -446,9 +447,9 @@ var TextField = function TextField(_ref) {
446
447
  }, renderField(), textareaType === TextareaTypes.FLEXIBLE && /*#__PURE__*/React.createElement("div", {
447
448
  className: cn('resizer'),
448
449
  ref: resizerRef
449
- }, /*#__PURE__*/React.createElement(ResizeIcon, null))), /*#__PURE__*/React.createElement("div", {
450
- className: cn('wrap')
451
- }, /*#__PURE__*/React.createElement("div", _extends({
450
+ }, /*#__PURE__*/React.createElement(ResizeIcon, null))), showAdditionalBlock && /*#__PURE__*/React.createElement("div", {
451
+ className: cn('field-bottom-wrapper')
452
+ }, displayedNoticeText && /*#__PURE__*/React.createElement("div", _extends({
452
453
  className: cn('notice-text', {
453
454
  active: !!noticeText
454
455
  }),
package/dist/lib/components/Select/Select.css CHANGED
@@ -58,6 +58,7 @@
58
58
  position: absolute;
59
59
  top: 50%;
60
60
  right: 27px;
61
+ z-index: 1;
61
62
  display: block;
62
63
  border-top: 6px solid;
63
64
  border-right: 5px solid transparent;
@@ -119,6 +120,7 @@
119
120
  -webkit-box-align: center;
120
121
  -ms-flex-align: center;
121
122
  align-items: center;
123
+ overflow: hidden;
122
124
  }
123
125
  .mfui-select__title-inner_hide-value .mfui-select__title-value {
124
126
  color: var(--spbSky3);
@@ -145,7 +147,7 @@
145
147
  content: '';
146
148
  position: absolute;
147
149
  top: 0;
148
- right: 0;
150
+ right: 40px;
149
151
  bottom: 0;
150
152
  width: 40px;
151
153
  background: -webkit-gradient(linear, left top, right top, from(rgba(255, 255, 255, 0)), to(var(--base)));
@@ -209,18 +211,6 @@
209
211
  -webkit-box-align: center;
210
212
  -ms-flex-align: center;
211
213
  align-items: center;
212
- overflow: hidden;
213
- white-space: nowrap;
214
- }
215
- .mfui-select__item-title:after {
216
- content: '';
217
- position: absolute;
218
- top: 0;
219
- right: 0;
220
- bottom: 0;
221
- width: 40px;
222
- background: -webkit-gradient(linear, left top, right top, from(rgba(255, 255, 255, 0)), to(var(--base)));
223
- background: linear-gradient(to right, rgba(255, 255, 255, 0), var(--base));
224
214
  }
225
215
  .mfui-select__item-title_active {
226
216
  font-weight: 600;
package/dist/lib/components/Tabs/Tabs.css CHANGED
@@ -6,10 +6,19 @@
6
6
  display: flex;
7
7
  width: 100%;
8
8
  }
9
+ .mfui-tabs__wrapper {
10
+ display: -webkit-box;
11
+ display: -ms-flexbox;
12
+ display: flex;
13
+ -webkit-box-pack: center;
14
+ -ms-flex-pack: center;
15
+ justify-content: center;
16
+ }
9
17
  .mfui-tabs__swiper-wrapper {
10
18
  display: -webkit-box;
11
19
  display: -ms-flexbox;
12
20
  display: flex;
21
+ width: 100%;
13
22
  }
14
23
  .mfui-tabs__swiper {
15
24
  font-family: inherit;
@@ -131,6 +140,8 @@
131
140
  -webkit-box-pack: center;
132
141
  -ms-flex-pack: center;
133
142
  justify-content: center;
143
+ -webkit-box-sizing: border-box;
144
+ box-sizing: border-box;
134
145
  height: 36px;
135
146
  padding: 2px 12px;
136
147
  color: var(--spbSky3);
package/dist/lib/components/Tabs/Tabs.js CHANGED
@@ -399,6 +399,7 @@ var Tabs = function Tabs(_ref) {
399
399
  }, [className, rootClass]),
400
400
  ref: rootRef
401
401
  }), /*#__PURE__*/React.createElement("div", {
402
+ className: cn('wrapper'),
402
403
  ref: tabListRef,
403
404
  style: {
404
405
  height: tabListHeight
@@ -415,6 +416,7 @@ var Tabs = function Tabs(_ref) {
415
416
  beginning: isBeginning,
416
417
  end: isEnd
417
418
  }, [innerIndentsClass]),
419
+ watchOverflow: true,
418
420
  slidesPerView: "auto",
419
421
  initialSlide: currentIndex,
420
422
  onSwiper: handleSwiper,
package/dist/lib/components/TextField/TextField.css CHANGED
@@ -231,7 +231,7 @@
231
231
  .mfui-text-field__require-mark {
232
232
  color: var(--fury);
233
233
  }
234
- .mfui-text-field__wrap {
234
+ .mfui-text-field__field-bottom-wrapper {
235
235
  display: -webkit-box;
236
236
  display: -ms-flexbox;
237
237
  display: flex;
package/dist/lib/components/TextField/TextField.js CHANGED
@@ -454,6 +454,7 @@ var TextField = function TextField(_ref) {
454
454
  var isPlaceholderShowed = isPasswordType && isPasswordHidden && !!inputValue;
455
455
  var valueHasSymbols = inputValue !== null && inputValue !== undefined;
456
456
  var currentSymbolCount = valueHasSymbols && String(inputValue).length || 0;
457
+ var showAdditionalBlock = displayedNoticeText || symbolCounter;
457
458
  return /*#__PURE__*/React.createElement("div", (0, _extends2["default"])({}, (0, _uiHelpers.filterDataAttrs)(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.root), {
458
459
  className: cn({
459
460
  disabled: disabled,
@@ -470,9 +471,9 @@ var TextField = function TextField(_ref) {
470
471
  }, renderField(), textareaType === TextareaTypes.FLEXIBLE && /*#__PURE__*/React.createElement("div", {
471
472
  className: cn('resizer'),
472
473
  ref: resizerRef
473
- }, /*#__PURE__*/React.createElement(ResizeIcon, null))), /*#__PURE__*/React.createElement("div", {
474
- className: cn('wrap')
475
- }, /*#__PURE__*/React.createElement("div", (0, _extends2["default"])({
474
+ }, /*#__PURE__*/React.createElement(ResizeIcon, null))), showAdditionalBlock && /*#__PURE__*/React.createElement("div", {
475
+ className: cn('field-bottom-wrapper')
476
+ }, displayedNoticeText && /*#__PURE__*/React.createElement("div", (0, _extends2["default"])({
476
477
  className: cn('notice-text', {
477
478
  active: !!noticeText
478
479
  }),
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@megafon/ui-core",
3
- "version": "4.0.0-beta.15",
3
+ "version": "4.0.0-beta.18",
4
4
  "files": [
5
5
  "dist",
6
6
  "styles"
@@ -97,5 +97,5 @@
97
97
  "react-popper": "^2.2.3",
98
98
  "swiper": "^6.5.6"
99
99
  },
100
- "gitHead": "8fa13cb6d6c646953fd8cb6ad27a04fbc26a512d"
100
+ "gitHead": "5a1d0399078e86cc7f193b83e82099e7883d75f1"
101
101
  }