@megafon/ui-core 4.14.2 → 4.15.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.
Files changed (8) hide show
  1. package/CHANGELOG.md +16 -0
  2. package/dist/es/components/Select/Select.css +21 -23
  3. package/dist/es/components/Tabs/Tabs.d.ts +2 -0
  4. package/dist/es/components/Tabs/Tabs.js +8 -5
  5. package/dist/lib/components/Select/Select.css +21 -23
  6. package/dist/lib/components/Tabs/Tabs.d.ts +2 -0
  7. package/dist/lib/components/Tabs/Tabs.js +8 -5
  8. package/package.json +3 -3
package/CHANGELOG.md CHANGED
@@ -3,6 +3,22 @@
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.15.0](https://github.com/MegafonWebLab/megafon-ui/compare/@megafon/ui-core@4.14.2...@megafon/ui-core@4.15.0) (2023-03-27)
7
+
8
+
9
+ ### Bug Fixes
10
+
11
+ * **select:** reduce opened z index ([eb95b6b](https://github.com/MegafonWebLab/megafon-ui/commit/eb95b6b5ff4d18c0e782a571428fdb4680e11474))
12
+
13
+
14
+ ### Features
15
+
16
+ * **select:** fix pseudo element position, fix z-index of drop-down list ([8d74450](https://github.com/MegafonWebLab/megafon-ui/commit/8d744504b0829323a94727a49823ec4d6a6e0d0d))
17
+
18
+
19
+
20
+
21
+
6
22
  ## [4.14.2](https://github.com/MegafonWebLab/megafon-ui/compare/@megafon/ui-core@4.14.1...@megafon/ui-core@4.14.2) (2023-03-20)
7
23
 
8
24
 
package/dist/es/components/Select/Select.css CHANGED
@@ -38,8 +38,6 @@
38
38
  position: relative;
39
39
  }
40
40
  .mfui-select__control {
41
- position: relative;
42
- z-index: 11;
43
41
  -webkit-box-sizing: border-box;
44
42
  box-sizing: border-box;
45
43
  width: 100%;
@@ -53,24 +51,6 @@
53
51
  -webkit-transition: border-color 0.3s;
54
52
  transition: border-color 0.3s;
55
53
  }
56
- .mfui-select__control:after {
57
- content: '';
58
- position: absolute;
59
- top: 50%;
60
- right: 27px;
61
- z-index: 1;
62
- display: block;
63
- border-top: 6px solid;
64
- border-right: 5px solid transparent;
65
- border-bottom: none;
66
- border-left: 5px solid transparent;
67
- color: var(--brandGreen);
68
- cursor: pointer;
69
- -webkit-transition: -webkit-transform 0.6s;
70
- transition: -webkit-transform 0.6s;
71
- transition: transform 0.6s;
72
- transition: transform 0.6s, -webkit-transform 0.6s;
73
- }
74
54
  .mfui-select__combobox {
75
55
  font-size: 15px;
76
56
  line-height: 24px;
@@ -113,6 +93,24 @@
113
93
  height: 100%;
114
94
  outline: none;
115
95
  }
96
+ .mfui-select__title:after {
97
+ content: '';
98
+ position: absolute;
99
+ top: 50%;
100
+ right: 27px;
101
+ z-index: 1;
102
+ display: block;
103
+ border-top: 6px solid;
104
+ border-right: 5px solid transparent;
105
+ border-bottom: none;
106
+ border-left: 5px solid transparent;
107
+ color: var(--brandGreen);
108
+ cursor: pointer;
109
+ -webkit-transition: -webkit-transform 0.6s;
110
+ transition: -webkit-transform 0.6s;
111
+ transition: transform 0.6s;
112
+ transition: transform 0.6s, -webkit-transform 0.6s;
113
+ }
116
114
  .mfui-select__title-value {
117
115
  display: -webkit-box;
118
116
  display: -ms-flexbox;
@@ -343,9 +341,9 @@
343
341
  opacity: 1;
344
342
  }
345
343
  .mfui-select_open {
346
- z-index: 100;
344
+ z-index: 12;
347
345
  }
348
- .mfui-select_open .mfui-select__control:after {
346
+ .mfui-select_open .mfui-select__title:after {
349
347
  -webkit-transform: rotate(-180deg);
350
348
  transform: rotate(-180deg);
351
349
  }
@@ -385,7 +383,7 @@
385
383
  .mfui-select_disabled .mfui-select__title-inner:after {
386
384
  display: none;
387
385
  }
388
- .mfui-select_disabled .mfui-select__control:after {
386
+ .mfui-select_disabled .mfui-select__title:after {
389
387
  color: var(--content);
390
388
  opacity: 0.5;
391
389
  }
package/dist/es/components/Tabs/Tabs.d.ts CHANGED
@@ -36,6 +36,8 @@ export interface ITabsProps {
36
36
  panel?: Record<string, string>;
37
37
  prev?: Record<string, string>;
38
38
  next?: Record<string, string>;
39
+ wrapper?: Record<string, string>;
40
+ swiperWrapper?: Record<string, string>;
39
41
  };
40
42
  /** Размер табов */
41
43
  size?: TabSizeType;
package/dist/es/components/Tabs/Tabs.js CHANGED
@@ -394,19 +394,20 @@ var Tabs = function Tabs(_ref) {
394
394
  'auto-width': autoWidth
395
395
  }, [className, classes.root]),
396
396
  ref: rootRef
397
- }), /*#__PURE__*/React.createElement("div", {
398
- className: cn('wrapper', [classes === null || classes === void 0 ? void 0 : classes.wrapper]),
397
+ }), /*#__PURE__*/React.createElement("div", _extends({
399
398
  ref: tabListRef,
400
399
  style: {
401
400
  height: tabListHeight
402
401
  }
403
- }, /*#__PURE__*/React.createElement("div", {
402
+ }, filterDataAttrs(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.wrapper), {
403
+ className: cn('wrapper', [classes === null || classes === void 0 ? void 0 : classes.wrapper])
404
+ }), /*#__PURE__*/React.createElement("div", _extends({
404
405
  className: cn('swiper-wrapper', [classes === null || classes === void 0 ? void 0 : classes.swiperWrapper]),
405
406
  style: {
406
407
  paddingLeft: stickyOffset.left,
407
408
  paddingRight: stickyOffset.right
408
409
  }
409
- }, /*#__PURE__*/React.createElement(Swiper, _extends({}, filterDataAttrs(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.slider), {
410
+ }, filterDataAttrs(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.swiperWrapper)), /*#__PURE__*/React.createElement(Swiper, _extends({}, filterDataAttrs(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.slider), {
410
411
  simulateTouch: false,
411
412
  className: cn('swiper', {
412
413
  beginning: isBeginning,
@@ -458,7 +459,9 @@ Tabs.propTypes = {
458
459
  slider: PropTypes.objectOf(PropTypes.string.isRequired),
459
460
  panel: PropTypes.objectOf(PropTypes.string.isRequired),
460
461
  prev: PropTypes.objectOf(PropTypes.string.isRequired),
461
- next: PropTypes.objectOf(PropTypes.string.isRequired)
462
+ next: PropTypes.objectOf(PropTypes.string.isRequired),
463
+ wrapper: PropTypes.objectOf(PropTypes.string.isRequired),
464
+ swiperWrapper: PropTypes.objectOf(PropTypes.string.isRequired)
462
465
  }),
463
466
  size: PropTypes.oneOf(Object.values(TabSize)),
464
467
  align: PropTypes.oneOf(Object.values(TabAlign)),
package/dist/lib/components/Select/Select.css CHANGED
@@ -38,8 +38,6 @@
38
38
  position: relative;
39
39
  }
40
40
  .mfui-select__control {
41
- position: relative;
42
- z-index: 11;
43
41
  -webkit-box-sizing: border-box;
44
42
  box-sizing: border-box;
45
43
  width: 100%;
@@ -53,24 +51,6 @@
53
51
  -webkit-transition: border-color 0.3s;
54
52
  transition: border-color 0.3s;
55
53
  }
56
- .mfui-select__control:after {
57
- content: '';
58
- position: absolute;
59
- top: 50%;
60
- right: 27px;
61
- z-index: 1;
62
- display: block;
63
- border-top: 6px solid;
64
- border-right: 5px solid transparent;
65
- border-bottom: none;
66
- border-left: 5px solid transparent;
67
- color: var(--brandGreen);
68
- cursor: pointer;
69
- -webkit-transition: -webkit-transform 0.6s;
70
- transition: -webkit-transform 0.6s;
71
- transition: transform 0.6s;
72
- transition: transform 0.6s, -webkit-transform 0.6s;
73
- }
74
54
  .mfui-select__combobox {
75
55
  font-size: 15px;
76
56
  line-height: 24px;
@@ -113,6 +93,24 @@
113
93
  height: 100%;
114
94
  outline: none;
115
95
  }
96
+ .mfui-select__title:after {
97
+ content: '';
98
+ position: absolute;
99
+ top: 50%;
100
+ right: 27px;
101
+ z-index: 1;
102
+ display: block;
103
+ border-top: 6px solid;
104
+ border-right: 5px solid transparent;
105
+ border-bottom: none;
106
+ border-left: 5px solid transparent;
107
+ color: var(--brandGreen);
108
+ cursor: pointer;
109
+ -webkit-transition: -webkit-transform 0.6s;
110
+ transition: -webkit-transform 0.6s;
111
+ transition: transform 0.6s;
112
+ transition: transform 0.6s, -webkit-transform 0.6s;
113
+ }
116
114
  .mfui-select__title-value {
117
115
  display: -webkit-box;
118
116
  display: -ms-flexbox;
@@ -343,9 +341,9 @@
343
341
  opacity: 1;
344
342
  }
345
343
  .mfui-select_open {
346
- z-index: 100;
344
+ z-index: 12;
347
345
  }
348
- .mfui-select_open .mfui-select__control:after {
346
+ .mfui-select_open .mfui-select__title:after {
349
347
  -webkit-transform: rotate(-180deg);
350
348
  transform: rotate(-180deg);
351
349
  }
@@ -385,7 +383,7 @@
385
383
  .mfui-select_disabled .mfui-select__title-inner:after {
386
384
  display: none;
387
385
  }
388
- .mfui-select_disabled .mfui-select__control:after {
386
+ .mfui-select_disabled .mfui-select__title:after {
389
387
  color: var(--content);
390
388
  opacity: 0.5;
391
389
  }
package/dist/lib/components/Tabs/Tabs.d.ts CHANGED
@@ -36,6 +36,8 @@ export interface ITabsProps {
36
36
  panel?: Record<string, string>;
37
37
  prev?: Record<string, string>;
38
38
  next?: Record<string, string>;
39
+ wrapper?: Record<string, string>;
40
+ swiperWrapper?: Record<string, string>;
39
41
  };
40
42
  /** Размер табов */
41
43
  size?: TabSizeType;
package/dist/lib/components/Tabs/Tabs.js CHANGED
@@ -425,19 +425,20 @@ var Tabs = function Tabs(_ref) {
425
425
  'auto-width': autoWidth
426
426
  }, [className, classes.root]),
427
427
  ref: rootRef
428
- }), /*#__PURE__*/React.createElement("div", {
429
- className: cn('wrapper', [classes === null || classes === void 0 ? void 0 : classes.wrapper]),
428
+ }), /*#__PURE__*/React.createElement("div", (0, _extends2["default"])({
430
429
  ref: tabListRef,
431
430
  style: {
432
431
  height: tabListHeight
433
432
  }
434
- }, /*#__PURE__*/React.createElement("div", {
433
+ }, (0, _uiHelpers.filterDataAttrs)(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.wrapper), {
434
+ className: cn('wrapper', [classes === null || classes === void 0 ? void 0 : classes.wrapper])
435
+ }), /*#__PURE__*/React.createElement("div", (0, _extends2["default"])({
435
436
  className: cn('swiper-wrapper', [classes === null || classes === void 0 ? void 0 : classes.swiperWrapper]),
436
437
  style: {
437
438
  paddingLeft: stickyOffset.left,
438
439
  paddingRight: stickyOffset.right
439
440
  }
440
- }, /*#__PURE__*/React.createElement(_react2.Swiper, (0, _extends2["default"])({}, (0, _uiHelpers.filterDataAttrs)(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.slider), {
441
+ }, (0, _uiHelpers.filterDataAttrs)(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.swiperWrapper)), /*#__PURE__*/React.createElement(_react2.Swiper, (0, _extends2["default"])({}, (0, _uiHelpers.filterDataAttrs)(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.slider), {
441
442
  simulateTouch: false,
442
443
  className: cn('swiper', {
443
444
  beginning: isBeginning,
@@ -489,7 +490,9 @@ Tabs.propTypes = {
489
490
  slider: _propTypes["default"].objectOf(_propTypes["default"].string.isRequired),
490
491
  panel: _propTypes["default"].objectOf(_propTypes["default"].string.isRequired),
491
492
  prev: _propTypes["default"].objectOf(_propTypes["default"].string.isRequired),
492
- next: _propTypes["default"].objectOf(_propTypes["default"].string.isRequired)
493
+ next: _propTypes["default"].objectOf(_propTypes["default"].string.isRequired),
494
+ wrapper: _propTypes["default"].objectOf(_propTypes["default"].string.isRequired),
495
+ swiperWrapper: _propTypes["default"].objectOf(_propTypes["default"].string.isRequired)
493
496
  }),
494
497
  size: _propTypes["default"].oneOf(Object.values(TabSize)),
495
498
  align: _propTypes["default"].oneOf(Object.values(TabAlign)),
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@megafon/ui-core",
3
- "version": "4.14.2",
3
+ "version": "4.15.0",
4
4
  "files": [
5
5
  "dist",
6
6
  "styles"
@@ -54,7 +54,7 @@
54
54
  "@babel/preset-env": "^7.8.6",
55
55
  "@babel/preset-react": "^7.8.3",
56
56
  "@babel/preset-typescript": "^7.8.3",
57
- "@megafon/ui-icons": "^2.8.0",
57
+ "@megafon/ui-icons": "^2.8.1",
58
58
  "@svgr/core": "^2.4.1",
59
59
  "@testing-library/jest-dom": "5.16.2",
60
60
  "@testing-library/react": "12.1.2",
@@ -100,5 +100,5 @@
100
100
  "react-popper": "^2.2.3",
101
101
  "swiper": "^6.5.6"
102
102
  },
103
- "gitHead": "43725eddf6f23f91c95f9f7c932e9b9589a4af04"
103
+ "gitHead": "2b3c9ee6628b04ef8cf0105476716cac5558db02"
104
104
  }