@megafon/ui-core 5.15.0 → 5.16.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 (18) hide show
  1. package/CHANGELOG.md +18 -0
  2. package/dist/es/colors/colorsData.js +3 -0
  3. package/dist/es/components/Accordion/Accordion.d.ts +4 -0
  4. package/dist/es/components/Accordion/Accordion.js +9 -3
  5. package/dist/es/components/Carousel/Carousel.js +1 -0
  6. package/dist/es/components/ContentView/ContentView.d.ts +4 -0
  7. package/dist/es/components/ContentView/ContentView.js +4 -0
  8. package/dist/es/components/RadioButton/RadioButton.css +13 -7
  9. package/dist/lib/colors/colorsData.js +3 -0
  10. package/dist/lib/components/Accordion/Accordion.d.ts +4 -0
  11. package/dist/lib/components/Accordion/Accordion.js +9 -3
  12. package/dist/lib/components/Carousel/Carousel.js +1 -0
  13. package/dist/lib/components/ContentView/ContentView.d.ts +4 -0
  14. package/dist/lib/components/ContentView/ContentView.js +4 -0
  15. package/dist/lib/components/RadioButton/RadioButton.css +13 -7
  16. package/package.json +2 -2
  17. package/styles/colors.css +1 -0
  18. package/styles/colorsDark.css +1 -0
package/CHANGELOG.md CHANGED
@@ -3,6 +3,24 @@
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
+ # [5.16.0](https://hq-gitlab.megafon.ru/site-portal/services/megafon-ui/compare/@megafon/ui-core@5.15.0...@megafon/ui-core@5.16.0) (2024-06-26)
7
+
8
+
9
+ ### Bug Fixes
10
+
11
+ * **carousel:** unsibscribe throttle ([c595b66](https://hq-gitlab.megafon.ru/site-portal/services/megafon-ui/commit/c595b66d2ecff5b071ffd69c7ffb22dd18b8e9ca))
12
+ * **contentview:** add new props to component ContentView ([8780d37](https://hq-gitlab.megafon.ru/site-portal/services/megafon-ui/commit/8780d37b9699b336dd5575403f9e8e6aee95113e))
13
+ * **radiobutton:** fix hover on touch devices ([fecbc40](https://hq-gitlab.megafon.ru/site-portal/services/megafon-ui/commit/fecbc4023a545835e4a3995feec1caac1c3e0253))
14
+
15
+
16
+ ### Features
17
+
18
+ * **accordion:** add new prop titleTag for change title tag, add classes.title prop" ([6f265f5](https://hq-gitlab.megafon.ru/site-portal/services/megafon-ui/commit/6f265f53bbd552957454405d8c95cbe1549c72dd))
19
+
20
+
21
+
22
+
23
+
6
24
  # [5.15.0](https://hq-gitlab.megafon.ru/site-portal/services/megafon-ui/compare/@megafon/ui-core@5.14.1...@megafon/ui-core@5.15.0) (2024-06-17)
7
25
 
8
26
 
package/dist/es/colors/colorsData.js CHANGED
@@ -110,6 +110,9 @@ var colors = {
110
110
  name: 'Exclusive',
111
111
  code: 'gradientExclusive',
112
112
  gradient: 'linear-gradient(90deg, #2A2674 0%, #444189 74%, #504D93 100%)'
113
+ }, {
114
+ name: 'Scrim',
115
+ code: 'gradientScrim'
113
116
  }]
114
117
  }
115
118
  },
package/dist/es/components/Accordion/Accordion.d.ts CHANGED
@@ -1,10 +1,13 @@
1
1
  import * as React from 'react';
2
+ import { IHeaderProps } from '../Header/Header';
2
3
  import './Accordion.less';
3
4
  export interface IAccordionProps {
4
5
  /** Ссылка на корневой элемент */
5
6
  rootRef?: React.Ref<HTMLDivElement>;
6
7
  /** Заголовок */
7
8
  title: string | React.ReactNode | React.ReactNode[];
9
+ /** Заголовок */
10
+ titleTag?: IHeaderProps['as'];
8
11
  /** Состояние открытости */
9
12
  isOpened?: boolean;
10
13
  /** Включить микроразметку */
@@ -17,6 +20,7 @@ export interface IAccordionProps {
17
20
  openedClass?: string;
18
21
  collapse?: string;
19
22
  titleWrap?: string;
23
+ title?: string;
20
24
  };
21
25
  /** Дополнительные data атрибуты к внутренним элементам */
22
26
  dataAttrs?: {
package/dist/es/components/Accordion/Accordion.js CHANGED
@@ -22,6 +22,8 @@ var cn = cnCreate('mfui-accordion');
22
22
  var Accordion = function Accordion(_ref) {
23
23
  var rootRef = _ref.rootRef,
24
24
  title = _ref.title,
25
+ _ref$titleTag = _ref.titleTag,
26
+ titleTag = _ref$titleTag === void 0 ? 'h5' : _ref$titleTag,
25
27
  _ref$isOpened = _ref.isOpened,
26
28
  isOpened = _ref$isOpened === void 0 ? false : _ref$isOpened,
27
29
  _ref$hasMicrodata = _ref.hasMicrodata,
@@ -33,6 +35,7 @@ var Accordion = function Accordion(_ref) {
33
35
  rootPropsClasses = _ref$classes.root,
34
36
  collapsePropsClasses = _ref$classes.collapse,
35
37
  titleWrapPropsClasses = _ref$classes.titleWrap,
38
+ titlePropsClasses = _ref$classes.title,
36
39
  dataAttrs = _ref.dataAttrs,
37
40
  onClickAccordion = _ref.onClickAccordion,
38
41
  children = _ref.children;
@@ -88,8 +91,9 @@ var Accordion = function Accordion(_ref) {
88
91
  }, hasMicrodata && {
89
92
  itemProp: 'name'
90
93
  }), /*#__PURE__*/React.createElement(Header, {
91
- as: "h5",
92
- dataAttrs: dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.header
94
+ as: titleTag,
95
+ dataAttrs: dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.header,
96
+ className: titlePropsClasses
93
97
  }, title), /*#__PURE__*/React.createElement("div", {
94
98
  className: cn('icon-box')
95
99
  }, /*#__PURE__*/React.createElement(ArrowDown, _extends({
@@ -107,6 +111,7 @@ Accordion.propTypes = {
107
111
  current: PropTypes.elementType
108
112
  }), PropTypes.any])]),
109
113
  title: PropTypes.oneOfType([PropTypes.string, PropTypes.node, PropTypes.arrayOf(PropTypes.node)]).isRequired,
114
+ titleTag: PropTypes.oneOf(['h1', 'h2', 'h3', 'h5']),
110
115
  isOpened: PropTypes.bool,
111
116
  hasMicrodata: PropTypes.bool,
112
117
  className: PropTypes.string,
@@ -114,7 +119,8 @@ Accordion.propTypes = {
114
119
  openedClass: PropTypes.string,
115
120
  root: PropTypes.string,
116
121
  collapse: PropTypes.string,
117
- titleWrap: PropTypes.string
122
+ titleWrap: PropTypes.string,
123
+ title: PropTypes.string
118
124
  }),
119
125
  dataAttrs: PropTypes.shape({
120
126
  root: PropTypes.objectOf(PropTypes.string.isRequired),
package/dist/es/components/Carousel/Carousel.js CHANGED
@@ -261,6 +261,7 @@ var Carousel = function Carousel(_ref) {
261
261
  var windowResizeHandlerThrottled = throttle(windowResizeHandler, throttleTime.resize);
262
262
  window.addEventListener('resize', windowResizeHandlerThrottled);
263
263
  return function () {
264
+ windowResizeHandlerThrottled.cancel();
264
265
  window.removeEventListener('resize', windowResizeHandlerThrottled);
265
266
  };
266
267
  }, [slidesSettings, swiperInstance]);
package/dist/es/components/ContentView/ContentView.d.ts CHANGED
@@ -7,6 +7,10 @@ declare type ElementType = {
7
7
  href?: string;
8
8
  /** Атрибут target */
9
9
  target?: '_self' | '_blank' | '_parent' | '_top';
10
+ /** Отключение кнопки */
11
+ disabled?: boolean;
12
+ /** Показать загрузку */
13
+ showLoader?: boolean;
10
14
  /** Обработчик клика */
11
15
  onClick?: (e: React.SyntheticEvent<EventTarget>) => void;
12
16
  };
package/dist/es/components/ContentView/ContentView.js CHANGED
@@ -46,6 +46,8 @@ var ContentView = function ContentView(_ref) {
46
46
  className: cn('button', [classes.button]),
47
47
  href: buttonParams.href,
48
48
  target: buttonParams.target,
49
+ disabled: buttonParams.disabled,
50
+ showLoader: buttonParams.showLoader,
49
51
  onClick: buttonParams.onClick,
50
52
  dataAttrs: {
51
53
  root: dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.button
@@ -55,6 +57,8 @@ var ContentView = function ContentView(_ref) {
55
57
  type: "text",
56
58
  href: linkParams.href,
57
59
  target: linkParams.target,
60
+ disabled: linkParams.disabled,
61
+ showLoader: linkParams.showLoader,
58
62
  onClick: linkParams.onClick,
59
63
  dataAttrs: {
60
64
  root: dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.link
package/dist/es/components/RadioButton/RadioButton.css CHANGED
@@ -54,8 +54,10 @@
54
54
  .mfui-radio-button__input_dark:checked + .mfui-radio-button__custom-input:before {
55
55
  border: 7px solid var(--brandGreen);
56
56
  }
57
- .mfui-radio-button__label_dark:not(.mfui-radio-button__label_disabled):hover .mfui-radio-button__custom-input:before {
58
- border-color: var(--buttonHoverGreen);
57
+ @media (hover: hover) {
58
+ .mfui-radio-button__label_dark:not(.mfui-radio-button__label_disabled):hover .mfui-radio-button__custom-input:before {
59
+ border-color: var(--buttonHoverGreen);
60
+ }
59
61
  }
60
62
  .mfui-radio-button__label_dark:not(.mfui-radio-button__label_disabled):active .mfui-radio-button__custom-input:before {
61
63
  border-color: var(--buttonDown);
@@ -80,12 +82,16 @@
80
82
  border: 7px solid var(--stcWhite);
81
83
  background-color: var(--stcBlack);
82
84
  }
83
- .mfui-radio-button__label_light:not(.mfui-radio-button__label_disabled):hover .mfui-radio-button__custom-input:before {
84
- border-color: var(--buttonHoverGrey);
85
- background-color: var(--buttonHoverGrey);
85
+ @media (hover: hover) {
86
+ .mfui-radio-button__label_light:not(.mfui-radio-button__label_disabled):hover .mfui-radio-button__custom-input:before {
87
+ border-color: var(--buttonHoverGrey);
88
+ background-color: var(--buttonHoverGrey);
89
+ }
86
90
  }
87
- .mfui-radio-button__label_light:not(.mfui-radio-button__label_disabled):hover .mfui-radio-button__input:checked + .mfui-radio-button__custom-input:before {
88
- background-color: var(--stcBlack);
91
+ @media (hover: hover) {
92
+ .mfui-radio-button__label_light:not(.mfui-radio-button__label_disabled):hover .mfui-radio-button__input:checked + .mfui-radio-button__custom-input:before {
93
+ background-color: var(--stcBlack);
94
+ }
89
95
  }
90
96
  .mfui-radio-button__label_light:not(.mfui-radio-button__label_disabled):active .mfui-radio-button__custom-input:before {
91
97
  border-color: var(--buttonDown);
package/dist/lib/colors/colorsData.js CHANGED
@@ -116,6 +116,9 @@ var colors = {
116
116
  name: 'Exclusive',
117
117
  code: 'gradientExclusive',
118
118
  gradient: 'linear-gradient(90deg, #2A2674 0%, #444189 74%, #504D93 100%)'
119
+ }, {
120
+ name: 'Scrim',
121
+ code: 'gradientScrim'
119
122
  }]
120
123
  }
121
124
  },
package/dist/lib/components/Accordion/Accordion.d.ts CHANGED
@@ -1,10 +1,13 @@
1
1
  import * as React from 'react';
2
+ import { IHeaderProps } from '../Header/Header';
2
3
  import './Accordion.less';
3
4
  export interface IAccordionProps {
4
5
  /** Ссылка на корневой элемент */
5
6
  rootRef?: React.Ref<HTMLDivElement>;
6
7
  /** Заголовок */
7
8
  title: string | React.ReactNode | React.ReactNode[];
9
+ /** Заголовок */
10
+ titleTag?: IHeaderProps['as'];
8
11
  /** Состояние открытости */
9
12
  isOpened?: boolean;
10
13
  /** Включить микроразметку */
@@ -17,6 +20,7 @@ export interface IAccordionProps {
17
20
  openedClass?: string;
18
21
  collapse?: string;
19
22
  titleWrap?: string;
23
+ title?: string;
20
24
  };
21
25
  /** Дополнительные data атрибуты к внутренним элементам */
22
26
  dataAttrs?: {
package/dist/lib/components/Accordion/Accordion.js CHANGED
@@ -42,6 +42,8 @@ var cn = (0, _uiHelpers.cnCreate)('mfui-accordion');
42
42
  var Accordion = function Accordion(_ref) {
43
43
  var rootRef = _ref.rootRef,
44
44
  title = _ref.title,
45
+ _ref$titleTag = _ref.titleTag,
46
+ titleTag = _ref$titleTag === void 0 ? 'h5' : _ref$titleTag,
45
47
  _ref$isOpened = _ref.isOpened,
46
48
  isOpened = _ref$isOpened === void 0 ? false : _ref$isOpened,
47
49
  _ref$hasMicrodata = _ref.hasMicrodata,
@@ -53,6 +55,7 @@ var Accordion = function Accordion(_ref) {
53
55
  rootPropsClasses = _ref$classes.root,
54
56
  collapsePropsClasses = _ref$classes.collapse,
55
57
  titleWrapPropsClasses = _ref$classes.titleWrap,
58
+ titlePropsClasses = _ref$classes.title,
56
59
  dataAttrs = _ref.dataAttrs,
57
60
  onClickAccordion = _ref.onClickAccordion,
58
61
  children = _ref.children;
@@ -108,8 +111,9 @@ var Accordion = function Accordion(_ref) {
108
111
  }, hasMicrodata && {
109
112
  itemProp: 'name'
110
113
  }), /*#__PURE__*/React.createElement(_Header["default"], {
111
- as: "h5",
112
- dataAttrs: dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.header
114
+ as: titleTag,
115
+ dataAttrs: dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.header,
116
+ className: titlePropsClasses
113
117
  }, title), /*#__PURE__*/React.createElement("div", {
114
118
  className: cn('icon-box')
115
119
  }, /*#__PURE__*/React.createElement(ArrowDown, (0, _extends2["default"])({
@@ -127,6 +131,7 @@ Accordion.propTypes = {
127
131
  current: PropTypes.elementType
128
132
  }), PropTypes.any])]),
129
133
  title: PropTypes.oneOfType([PropTypes.string, PropTypes.node, PropTypes.arrayOf(PropTypes.node)]).isRequired,
134
+ titleTag: PropTypes.oneOf(['h1', 'h2', 'h3', 'h5']),
130
135
  isOpened: PropTypes.bool,
131
136
  hasMicrodata: PropTypes.bool,
132
137
  className: PropTypes.string,
@@ -134,7 +139,8 @@ Accordion.propTypes = {
134
139
  openedClass: PropTypes.string,
135
140
  root: PropTypes.string,
136
141
  collapse: PropTypes.string,
137
- titleWrap: PropTypes.string
142
+ titleWrap: PropTypes.string,
143
+ title: PropTypes.string
138
144
  }),
139
145
  dataAttrs: PropTypes.shape({
140
146
  root: PropTypes.objectOf(PropTypes.string.isRequired),
package/dist/lib/components/Carousel/Carousel.js CHANGED
@@ -302,6 +302,7 @@ var Carousel = function Carousel(_ref) {
302
302
  var windowResizeHandlerThrottled = (0, _lodash["default"])(windowResizeHandler, _throttleTime["default"].resize);
303
303
  window.addEventListener('resize', windowResizeHandlerThrottled);
304
304
  return function () {
305
+ windowResizeHandlerThrottled.cancel();
305
306
  window.removeEventListener('resize', windowResizeHandlerThrottled);
306
307
  };
307
308
  }, [slidesSettings, swiperInstance]);
package/dist/lib/components/ContentView/ContentView.d.ts CHANGED
@@ -7,6 +7,10 @@ declare type ElementType = {
7
7
  href?: string;
8
8
  /** Атрибут target */
9
9
  target?: '_self' | '_blank' | '_parent' | '_top';
10
+ /** Отключение кнопки */
11
+ disabled?: boolean;
12
+ /** Показать загрузку */
13
+ showLoader?: boolean;
10
14
  /** Обработчик клика */
11
15
  onClick?: (e: React.SyntheticEvent<EventTarget>) => void;
12
16
  };
package/dist/lib/components/ContentView/ContentView.js CHANGED
@@ -66,6 +66,8 @@ var ContentView = function ContentView(_ref) {
66
66
  className: cn('button', [classes.button]),
67
67
  href: buttonParams.href,
68
68
  target: buttonParams.target,
69
+ disabled: buttonParams.disabled,
70
+ showLoader: buttonParams.showLoader,
69
71
  onClick: buttonParams.onClick,
70
72
  dataAttrs: {
71
73
  root: dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.button
@@ -75,6 +77,8 @@ var ContentView = function ContentView(_ref) {
75
77
  type: "text",
76
78
  href: linkParams.href,
77
79
  target: linkParams.target,
80
+ disabled: linkParams.disabled,
81
+ showLoader: linkParams.showLoader,
78
82
  onClick: linkParams.onClick,
79
83
  dataAttrs: {
80
84
  root: dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.link
package/dist/lib/components/RadioButton/RadioButton.css CHANGED
@@ -54,8 +54,10 @@
54
54
  .mfui-radio-button__input_dark:checked + .mfui-radio-button__custom-input:before {
55
55
  border: 7px solid var(--brandGreen);
56
56
  }
57
- .mfui-radio-button__label_dark:not(.mfui-radio-button__label_disabled):hover .mfui-radio-button__custom-input:before {
58
- border-color: var(--buttonHoverGreen);
57
+ @media (hover: hover) {
58
+ .mfui-radio-button__label_dark:not(.mfui-radio-button__label_disabled):hover .mfui-radio-button__custom-input:before {
59
+ border-color: var(--buttonHoverGreen);
60
+ }
59
61
  }
60
62
  .mfui-radio-button__label_dark:not(.mfui-radio-button__label_disabled):active .mfui-radio-button__custom-input:before {
61
63
  border-color: var(--buttonDown);
@@ -80,12 +82,16 @@
80
82
  border: 7px solid var(--stcWhite);
81
83
  background-color: var(--stcBlack);
82
84
  }
83
- .mfui-radio-button__label_light:not(.mfui-radio-button__label_disabled):hover .mfui-radio-button__custom-input:before {
84
- border-color: var(--buttonHoverGrey);
85
- background-color: var(--buttonHoverGrey);
85
+ @media (hover: hover) {
86
+ .mfui-radio-button__label_light:not(.mfui-radio-button__label_disabled):hover .mfui-radio-button__custom-input:before {
87
+ border-color: var(--buttonHoverGrey);
88
+ background-color: var(--buttonHoverGrey);
89
+ }
86
90
  }
87
- .mfui-radio-button__label_light:not(.mfui-radio-button__label_disabled):hover .mfui-radio-button__input:checked + .mfui-radio-button__custom-input:before {
88
- background-color: var(--stcBlack);
91
+ @media (hover: hover) {
92
+ .mfui-radio-button__label_light:not(.mfui-radio-button__label_disabled):hover .mfui-radio-button__input:checked + .mfui-radio-button__custom-input:before {
93
+ background-color: var(--stcBlack);
94
+ }
89
95
  }
90
96
  .mfui-radio-button__label_light:not(.mfui-radio-button__label_disabled):active .mfui-radio-button__custom-input:before {
91
97
  border-color: var(--buttonDown);
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@megafon/ui-core",
3
- "version": "5.15.0",
3
+ "version": "5.16.0",
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": "250432bf38272f12927489decad080faf0a9dfb7"
100
+ "gitHead": "0d4f96ecbc805db6a1b2200dd9adbb707349d474"
101
101
  }
package/styles/colors.css CHANGED
@@ -31,6 +31,7 @@
31
31
  --gradientBasic: linear-gradient(90deg, #01873F 0%, #00B956 74%, #14CD6A 100%);
32
32
  --gradientVIP: linear-gradient(90deg, #5B1168 0%, #731982 74%, #821E93 100%);
33
33
  --gradientExclusive: linear-gradient(90deg, #2A2674 0%, #444189 74%, #504D93 100%);
34
+ --gradientScrim: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, #FFFFFF 22.73%);
34
35
 
35
36
  /* Static */
36
37
  --stcWhite: #FFFFFF;
package/styles/colorsDark.css CHANGED
@@ -32,6 +32,7 @@
32
32
  --gradientBasic: linear-gradient(90deg, #01873F 0%, #00B956 74%, #14CD6A 100%);
33
33
  --gradientVIP: linear-gradient(90deg, #5B1168 0%, #731982 74%, #821E93 100%);
34
34
  --gradientExclusive: linear-gradient(90deg, #2A2674 0%, #444189 74%, #504D93 100%);
35
+ --gradientScrim: linear-gradient(180deg, rgba(31, 31, 31, 0) 0%, #1F1F1F 22.73%);
35
36
 
36
37
  /* Static */
37
38
  --stcWhite: #FFFFFF;