@megafon/ui-shared 4.11.0 → 4.13.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.
- package/CHANGELOG.md +34 -0
- package/dist/es/components/BenefitsPictures/BenefitsPictures.js +5 -3
- package/dist/es/components/BenefitsPictures/types.d.ts +2 -0
- package/dist/es/components/ButtonBanner/ButtonBanner.d.ts +2 -0
- package/dist/es/components/ButtonBanner/ButtonBanner.js +3 -0
- package/dist/es/components/ButtonLinkBox/ButtonLinkBox.d.ts +4 -0
- package/dist/es/components/ButtonLinkBox/ButtonLinkBox.js +7 -1
- package/dist/es/components/Card/Card.d.ts +4 -0
- package/dist/es/components/Card/Card.js +12 -4
- package/dist/es/components/Instructions/Instructions.d.ts +1 -0
- package/dist/es/components/Instructions/Instructions.js +5 -3
- package/dist/es/components/Partners/Partners.d.ts +1 -0
- package/dist/es/components/Partners/Partners.js +4 -1
- package/dist/es/components/PictureWithDescription/PictureWithDescription.d.ts +2 -0
- package/dist/es/components/PictureWithDescription/PictureWithDescription.js +3 -1
- package/dist/es/components/StoreBanner/StoreBanner.d.ts +2 -0
- package/dist/es/components/StoreBanner/StoreBanner.js +10 -0
- package/dist/es/components/StoreButton/StoreButton.d.ts +1 -1
- package/dist/es/components/StoreButton/StoreButton.js +8 -2
- package/dist/es/components/TextBox/TextBoxPicture.d.ts +2 -0
- package/dist/es/components/TextBox/TextBoxPicture.js +5 -3
- package/dist/es/components/VideoBanner/VideoBanner.d.ts +6 -0
- package/dist/es/components/VideoBanner/VideoBanner.js +11 -3
- package/dist/es/components/VideoBlock/VideoBlock.d.ts +2 -0
- package/dist/es/components/VideoBlock/VideoBlock.js +4 -1
- package/dist/lib/components/BenefitsPictures/BenefitsPictures.js +5 -3
- package/dist/lib/components/BenefitsPictures/types.d.ts +2 -0
- package/dist/lib/components/ButtonBanner/ButtonBanner.d.ts +2 -0
- package/dist/lib/components/ButtonBanner/ButtonBanner.js +3 -0
- package/dist/lib/components/ButtonLinkBox/ButtonLinkBox.d.ts +4 -0
- package/dist/lib/components/ButtonLinkBox/ButtonLinkBox.js +7 -1
- package/dist/lib/components/Card/Card.d.ts +4 -0
- package/dist/lib/components/Card/Card.js +12 -4
- package/dist/lib/components/Instructions/Instructions.d.ts +1 -0
- package/dist/lib/components/Instructions/Instructions.js +5 -3
- package/dist/lib/components/Partners/Partners.d.ts +1 -0
- package/dist/lib/components/Partners/Partners.js +4 -1
- package/dist/lib/components/PictureWithDescription/PictureWithDescription.d.ts +2 -0
- package/dist/lib/components/PictureWithDescription/PictureWithDescription.js +3 -1
- package/dist/lib/components/StoreBanner/StoreBanner.d.ts +2 -0
- package/dist/lib/components/StoreBanner/StoreBanner.js +10 -0
- package/dist/lib/components/StoreButton/StoreButton.d.ts +1 -1
- package/dist/lib/components/StoreButton/StoreButton.js +8 -2
- package/dist/lib/components/TextBox/TextBoxPicture.d.ts +2 -0
- package/dist/lib/components/TextBox/TextBoxPicture.js +5 -3
- package/dist/lib/components/VideoBanner/VideoBanner.d.ts +6 -0
- package/dist/lib/components/VideoBanner/VideoBanner.js +11 -3
- package/dist/lib/components/VideoBlock/VideoBlock.d.ts +2 -0
- package/dist/lib/components/VideoBlock/VideoBlock.js +4 -1
- package/package.json +4 -4
@@ -180,7 +180,8 @@ var BenefitsPictures = function BenefitsPictures(_ref) {
|
|
180
180
|
}, items.map(function (_ref2, index) {
|
181
181
|
var img = _ref2.img,
|
182
182
|
title = _ref2.title,
|
183
|
-
text = _ref2.text
|
183
|
+
text = _ref2.text,
|
184
|
+
alt = _ref2.alt;
|
184
185
|
return /*#__PURE__*/React.createElement(_uiCore.GridColumn, (0, _extends2["default"])({}, align === 'left' ? getLeftConfig(items.length, index) : getCenterConfig(items.length, index, gridGap), {
|
185
186
|
key: index
|
186
187
|
}), /*#__PURE__*/React.createElement("div", {
|
@@ -190,7 +191,7 @@ var BenefitsPictures = function BenefitsPictures(_ref) {
|
|
190
191
|
'h-align': align
|
191
192
|
}),
|
192
193
|
src: img,
|
193
|
-
alt:
|
194
|
+
alt: alt
|
194
195
|
}), /*#__PURE__*/React.createElement(_uiCore.Header, {
|
195
196
|
className: cn('title'),
|
196
197
|
align: align,
|
@@ -208,7 +209,8 @@ BenefitsPictures.propTypes = {
|
|
208
209
|
items: _propTypes["default"].arrayOf(_propTypes["default"].shape({
|
209
210
|
title: _propTypes["default"].string.isRequired,
|
210
211
|
text: _propTypes["default"].string.isRequired,
|
211
|
-
img: _propTypes["default"].string.isRequired
|
212
|
+
img: _propTypes["default"].string.isRequired,
|
213
|
+
alt: _propTypes["default"].string
|
212
214
|
}).isRequired).isRequired,
|
213
215
|
align: _propTypes["default"].oneOf(['left', 'center']),
|
214
216
|
gridGap: _propTypes["default"].oneOf(['medium', 'large']),
|
@@ -5,6 +5,8 @@ export interface IBenefit {
|
|
5
5
|
text: string;
|
6
6
|
/** Изображение */
|
7
7
|
img: string;
|
8
|
+
/** Значение тега alt для изображения */
|
9
|
+
alt?: string;
|
8
10
|
}
|
9
11
|
declare type TGridSizeValues = '1' | '2' | '3' | '4' | '5' | '6' | '7' | '8' | '9' | '10' | '11' | '12';
|
10
12
|
export declare type GridConfig = {
|
@@ -46,6 +46,8 @@ export interface IButtonBannerProps {
|
|
46
46
|
buttonTarget?: ButtonTargetType;
|
47
47
|
/** Цвет кнопки */
|
48
48
|
buttonColor?: ButtonColorType;
|
49
|
+
/** Rel - атрибут тега <a> */
|
50
|
+
buttonRel?: string;
|
49
51
|
/** Масштабирование изображения */
|
50
52
|
imageScaling?: ImageScalingType;
|
51
53
|
/** Обработчик клика по кнопке */
|
@@ -66,6 +66,7 @@ var ButtonBanner = function ButtonBanner(_ref) {
|
|
66
66
|
buttonTarget = _ref$buttonTarget === void 0 ? '_self' : _ref$buttonTarget,
|
67
67
|
_ref$buttonColor = _ref.buttonColor,
|
68
68
|
buttonColor = _ref$buttonColor === void 0 ? 'green' : _ref$buttonColor,
|
69
|
+
buttonRel = _ref.buttonRel,
|
69
70
|
_ref$imageScaling = _ref.imageScaling,
|
70
71
|
imageScaling = _ref$imageScaling === void 0 ? 'cover' : _ref$imageScaling,
|
71
72
|
onButtonClick = _ref.onButtonClick;
|
@@ -76,6 +77,7 @@ var ButtonBanner = function ButtonBanner(_ref) {
|
|
76
77
|
},
|
77
78
|
className: cn('button', [classes.button]),
|
78
79
|
href: buttonUrl,
|
80
|
+
rel: buttonRel,
|
79
81
|
target: buttonTarget,
|
80
82
|
theme: buttonColor,
|
81
83
|
onClick: onButtonClick,
|
@@ -133,6 +135,7 @@ ButtonBanner.propTypes = {
|
|
133
135
|
buttonDownload: PropTypes.bool,
|
134
136
|
buttonTarget: PropTypes.oneOf(Object.values(ButtonTarget)),
|
135
137
|
buttonColor: PropTypes.oneOf(Object.values(ButtonColor)),
|
138
|
+
buttonRel: PropTypes.string,
|
136
139
|
onButtonClick: PropTypes.func
|
137
140
|
};
|
138
141
|
var _default = ButtonBanner;
|
@@ -27,12 +27,16 @@ export interface IButtonLinkBoxProps {
|
|
27
27
|
buttonColor?: 'green' | 'purple';
|
28
28
|
/** Target свойство кнопки */
|
29
29
|
buttonTarget?: '_self' | '_blank' | '_parent' | '_top';
|
30
|
+
/** Rel - атрибут тега <a> для кнопки */
|
31
|
+
buttonRel?: string;
|
30
32
|
/** Заголовок ссылки */
|
31
33
|
linkTitle?: string;
|
32
34
|
/** Добавляет атрибут download для тега <a> компонента Button */
|
33
35
|
linkUrl?: string;
|
34
36
|
/** Target свойство ссылки */
|
35
37
|
linkTarget?: '_self' | '_blank' | '_parent' | '_top';
|
38
|
+
/** Rel - атрибут тега <a> для ссылки */
|
39
|
+
linkRel?: string;
|
36
40
|
/** Добавляет атрибут download к свойству тега <a> */
|
37
41
|
linkDownload?: boolean;
|
38
42
|
/** Горизонтальное выравнивание */
|
@@ -35,9 +35,11 @@ var ButtonLinkBox = function ButtonLinkBox(_ref) {
|
|
35
35
|
buttonDownload = _ref.buttonDownload,
|
36
36
|
_ref$buttonColor = _ref.buttonColor,
|
37
37
|
buttonColor = _ref$buttonColor === void 0 ? 'green' : _ref$buttonColor,
|
38
|
+
buttonRel = _ref.buttonRel,
|
38
39
|
linkTitle = _ref.linkTitle,
|
39
40
|
linkUrl = _ref.linkUrl,
|
40
41
|
linkDownload = _ref.linkDownload,
|
42
|
+
linkRel = _ref.linkRel,
|
41
43
|
align = _ref.align,
|
42
44
|
className = _ref.className,
|
43
45
|
buttonTarget = _ref.buttonTarget,
|
@@ -62,7 +64,8 @@ var ButtonLinkBox = function ButtonLinkBox(_ref) {
|
|
62
64
|
theme: buttonColor,
|
63
65
|
onClick: onButtonClick,
|
64
66
|
target: buttonTarget,
|
65
|
-
download: buttonDownload
|
67
|
+
download: buttonDownload,
|
68
|
+
rel: buttonRel
|
66
69
|
}, buttonTitle)), linkTitle && /*#__PURE__*/_react["default"].createElement("div", {
|
67
70
|
className: cn('row')
|
68
71
|
}, /*#__PURE__*/_react["default"].createElement(_uiCore.TextLink, {
|
@@ -74,6 +77,7 @@ var ButtonLinkBox = function ButtonLinkBox(_ref) {
|
|
74
77
|
download: linkDownload,
|
75
78
|
underlineVisibility: "always",
|
76
79
|
target: linkTarget,
|
80
|
+
rel: linkRel,
|
77
81
|
onClick: onLinkClick
|
78
82
|
}, linkTitle)));
|
79
83
|
};
|
@@ -97,9 +101,11 @@ ButtonLinkBox.propTypes = {
|
|
97
101
|
buttonUrl: PropTypes.string,
|
98
102
|
buttonDownload: PropTypes.bool,
|
99
103
|
buttonColor: PropTypes.oneOf(['green', 'purple']),
|
104
|
+
buttonRel: PropTypes.string,
|
100
105
|
linkTitle: PropTypes.string,
|
101
106
|
linkUrl: PropTypes.string,
|
102
107
|
linkDownload: PropTypes.bool,
|
108
|
+
linkRel: PropTypes.string,
|
103
109
|
align: PropTypes.oneOf(['center']),
|
104
110
|
onButtonClick: PropTypes.func,
|
105
111
|
onLinkClick: PropTypes.func
|
@@ -10,6 +10,7 @@ interface IButton {
|
|
10
10
|
href?: string;
|
11
11
|
target?: TargetType;
|
12
12
|
download?: boolean;
|
13
|
+
rel?: string;
|
13
14
|
onClick?: () => void;
|
14
15
|
}
|
15
16
|
interface ILink {
|
@@ -17,6 +18,7 @@ interface ILink {
|
|
17
18
|
href?: string;
|
18
19
|
target?: TargetType;
|
19
20
|
download?: boolean;
|
21
|
+
rel?: string;
|
20
22
|
}
|
21
23
|
export declare const ObjectFit: {
|
22
24
|
readonly FILL: "fill";
|
@@ -43,6 +45,8 @@ export interface ICard {
|
|
43
45
|
rootRef?: Ref<HTMLDivElement>;
|
44
46
|
/** Изображение в карточке */
|
45
47
|
imageSrc?: string;
|
48
|
+
/** Значение тега alt для изображения */
|
49
|
+
imageAlt?: string;
|
46
50
|
/** Иконка в карточке */
|
47
51
|
svgSrc?: React.ReactNode;
|
48
52
|
/** Заголовок карточки */
|
@@ -40,6 +40,7 @@ var Card = function Card(_ref) {
|
|
40
40
|
classes = _ref$classes === void 0 ? {} : _ref$classes,
|
41
41
|
rootRef = _ref.rootRef,
|
42
42
|
imageSrc = _ref.imageSrc,
|
43
|
+
imageAlt = _ref.imageAlt,
|
43
44
|
svgSrc = _ref.svgSrc,
|
44
45
|
title = _ref.title,
|
45
46
|
text = _ref.text,
|
@@ -70,7 +71,7 @@ var Card = function Card(_ref) {
|
|
70
71
|
}, /*#__PURE__*/_react["default"].createElement("img", {
|
71
72
|
className: cn('img'),
|
72
73
|
src: imageSrc,
|
73
|
-
alt:
|
74
|
+
alt: imageAlt
|
74
75
|
}));
|
75
76
|
}
|
76
77
|
|
@@ -84,7 +85,7 @@ var Card = function Card(_ref) {
|
|
84
85
|
default:
|
85
86
|
return null;
|
86
87
|
}
|
87
|
-
}, [imageSrc, svgSrc, objectFit]);
|
88
|
+
}, [imageSrc, svgSrc, objectFit, imageAlt]);
|
88
89
|
|
89
90
|
var renderLink = _react["default"].useCallback(function () {
|
90
91
|
if (!link) {
|
@@ -94,7 +95,8 @@ var Card = function Card(_ref) {
|
|
94
95
|
var linkHref = link.href,
|
95
96
|
linkTitle = link.title,
|
96
97
|
linkTarget = link.target,
|
97
|
-
download = link.download
|
98
|
+
download = link.download,
|
99
|
+
linkRel = link.rel;
|
98
100
|
|
99
101
|
if (!linkHref || isCardLink) {
|
100
102
|
return /*#__PURE__*/_react["default"].createElement("span", {
|
@@ -106,6 +108,7 @@ var Card = function Card(_ref) {
|
|
106
108
|
href: linkHref,
|
107
109
|
download: download,
|
108
110
|
target: linkTarget,
|
111
|
+
rel: linkRel,
|
109
112
|
dataAttrs: {
|
110
113
|
root: dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.link
|
111
114
|
},
|
@@ -122,6 +125,7 @@ var Card = function Card(_ref) {
|
|
122
125
|
btnTitle = button.title,
|
123
126
|
btnTarget = button.target,
|
124
127
|
btnDownload = button.download,
|
128
|
+
btnRel = button.rel,
|
125
129
|
btnOnClick = button.onClick;
|
126
130
|
return /*#__PURE__*/_react["default"].createElement(_uiCore.Button, {
|
127
131
|
dataAttrs: {
|
@@ -131,6 +135,7 @@ var Card = function Card(_ref) {
|
|
131
135
|
href: btnHref,
|
132
136
|
target: btnTarget,
|
133
137
|
download: btnDownload,
|
138
|
+
rel: btnRel,
|
134
139
|
onClick: btnOnClick
|
135
140
|
}, btnTitle);
|
136
141
|
}, [button, isCardLink, classes, dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.button]);
|
@@ -186,6 +191,7 @@ Card.propTypes = {
|
|
186
191
|
current: _propTypes["default"].elementType
|
187
192
|
}), _propTypes["default"].any])]),
|
188
193
|
imageSrc: _propTypes["default"].string,
|
194
|
+
imageAlt: _propTypes["default"].string,
|
189
195
|
svgSrc: _propTypes["default"].node,
|
190
196
|
title: _propTypes["default"].oneOfType([_propTypes["default"].string, _propTypes["default"].node, _propTypes["default"].arrayOf(_propTypes["default"].node)]).isRequired,
|
191
197
|
text: _propTypes["default"].oneOfType([_propTypes["default"].string, _propTypes["default"].node, _propTypes["default"].arrayOf(_propTypes["default"].node)]),
|
@@ -194,13 +200,15 @@ Card.propTypes = {
|
|
194
200
|
href: _propTypes["default"].string,
|
195
201
|
target: _propTypes["default"].oneOf(Object.values(Target)),
|
196
202
|
download: _propTypes["default"].bool,
|
203
|
+
rel: _propTypes["default"].string,
|
197
204
|
onClick: _propTypes["default"].func
|
198
205
|
}),
|
199
206
|
link: _propTypes["default"].shape({
|
200
207
|
title: _propTypes["default"].string.isRequired,
|
201
208
|
href: _propTypes["default"].string,
|
202
209
|
target: _propTypes["default"].oneOf(Object.values(Target)),
|
203
|
-
download: _propTypes["default"].bool
|
210
|
+
download: _propTypes["default"].bool,
|
211
|
+
rel: _propTypes["default"].string
|
204
212
|
}),
|
205
213
|
isCenteredText: _propTypes["default"].bool,
|
206
214
|
isLeftHAlign: _propTypes["default"].bool,
|
@@ -20,6 +20,7 @@ export declare type InstructionItemType = {
|
|
20
20
|
title: string | React.ReactNode | React.ReactNode[];
|
21
21
|
mediaUrl: string;
|
22
22
|
isVideo: boolean;
|
23
|
+
imageAlt?: string;
|
23
24
|
};
|
24
25
|
export interface IInstructionsProps {
|
25
26
|
/** Дополнительные data атрибуты к внутренним элементам */
|
@@ -126,12 +126,13 @@ var Instructions = function Instructions(_ref) {
|
|
126
126
|
className: cn('swiper')
|
127
127
|
}, instructionItems.map(function (_ref3, i) {
|
128
128
|
var mediaUrl = _ref3.mediaUrl,
|
129
|
-
isVideo = _ref3.isVideo
|
129
|
+
isVideo = _ref3.isVideo,
|
130
|
+
imageAlt = _ref3.imageAlt;
|
130
131
|
return /*#__PURE__*/_react["default"].createElement(_react2.SwiperSlide, {
|
131
132
|
className: swiperSlideCn,
|
132
133
|
key: i + mediaUrl
|
133
134
|
}, isVideo ? renderVideo(mediaUrl, i) : /*#__PURE__*/_react["default"].createElement("img", (0, _extends2["default"])({
|
134
|
-
alt:
|
135
|
+
alt: imageAlt,
|
135
136
|
src: mediaUrl
|
136
137
|
}, (0, _uiHelpers.filterDataAttrs)(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.image, i + 1), {
|
137
138
|
className: cn('swiper-img', [instructionItemImg])
|
@@ -274,7 +275,8 @@ Instructions.propTypes = {
|
|
274
275
|
instructionItems: _propTypes["default"].arrayOf(_propTypes["default"].shape({
|
275
276
|
title: _propTypes["default"].oneOfType([_propTypes["default"].string, _propTypes["default"].node, _propTypes["default"].arrayOf(_propTypes["default"].node)]).isRequired,
|
276
277
|
mediaUrl: _propTypes["default"].string.isRequired,
|
277
|
-
isVideo: _propTypes["default"].bool.isRequired
|
278
|
+
isVideo: _propTypes["default"].bool.isRequired,
|
279
|
+
imageAlt: _propTypes["default"].string
|
278
280
|
}).isRequired).isRequired,
|
279
281
|
pictureAlign: _propTypes["default"].oneOf([pictureAlignTypes.LEFT, pictureAlignTypes.RIGHT]),
|
280
282
|
pictureMask: _propTypes["default"].oneOf([pictureMaskTypes.ANDROID, pictureMaskTypes.NEW_IPHONE, pictureMaskTypes.WHITE_IPHONE, pictureMaskTypes.BLACK_IPHONE, pictureMaskTypes.LAPTOP, pictureMaskTypes.IPHONE_12, pictureMaskTypes.NONE]),
|
@@ -65,9 +65,11 @@ var Partners = function Partners(_ref) {
|
|
65
65
|
|
66
66
|
var src = item.src,
|
67
67
|
href = item.href,
|
68
|
-
alt = item.alt
|
68
|
+
alt = item.alt,
|
69
|
+
rel = item.rel;
|
69
70
|
return /*#__PURE__*/React.createElement(_uiCore.Tile, {
|
70
71
|
href: href,
|
72
|
+
rel: rel,
|
71
73
|
shadowLevel: "default",
|
72
74
|
isInteractive: !!href,
|
73
75
|
className: cn('tile'),
|
@@ -133,6 +135,7 @@ Partners.propTypes = {
|
|
133
135
|
className: PropTypes.string,
|
134
136
|
items: PropTypes.arrayOf(PropTypes.shape({
|
135
137
|
href: PropTypes.string,
|
138
|
+
rel: PropTypes.string,
|
136
139
|
src: PropTypes.string.isRequired,
|
137
140
|
alt: PropTypes.string.isRequired
|
138
141
|
}).isRequired).isRequired,
|
@@ -21,6 +21,8 @@ export interface IPictureWithDescriptionProps {
|
|
21
21
|
pictureUrl: string;
|
22
22
|
/** Расположение изображения */
|
23
23
|
pictureAlign?: PictureAlignTypesType;
|
24
|
+
/** Значение тега alt для изображения */
|
25
|
+
pictureAlt?: string;
|
24
26
|
/** Выравнивание текста по верхнему краю */
|
25
27
|
isTextTopAlign?: boolean;
|
26
28
|
}
|
@@ -37,6 +37,7 @@ var PictureWithDescription = function PictureWithDescription(_ref) {
|
|
37
37
|
pictureUrl = _ref.pictureUrl,
|
38
38
|
_ref$pictureAlign = _ref.pictureAlign,
|
39
39
|
pictureAlign = _ref$pictureAlign === void 0 ? 'left' : _ref$pictureAlign,
|
40
|
+
pictureAlt = _ref.pictureAlt,
|
40
41
|
isTextTopAlign = _ref.isTextTopAlign,
|
41
42
|
children = _ref.children;
|
42
43
|
return /*#__PURE__*/React.createElement("div", {
|
@@ -49,7 +50,7 @@ var PictureWithDescription = function PictureWithDescription(_ref) {
|
|
49
50
|
}, /*#__PURE__*/React.createElement("img", {
|
50
51
|
className: cn('img'),
|
51
52
|
src: pictureUrl,
|
52
|
-
alt:
|
53
|
+
alt: pictureAlt
|
53
54
|
})), /*#__PURE__*/React.createElement("div", {
|
54
55
|
className: cn('articles', {
|
55
56
|
align: pictureAlign,
|
@@ -75,6 +76,7 @@ PictureWithDescription.propTypes = {
|
|
75
76
|
title: _propTypes["default"].oneOfType([_propTypes["default"].string, _propTypes["default"].node, _propTypes["default"].arrayOf(_propTypes["default"].node)]),
|
76
77
|
pictureUrl: _propTypes["default"].string.isRequired,
|
77
78
|
pictureAlign: _propTypes["default"].oneOf([pictureAlignTypes.LEFT, pictureAlignTypes.RIGHT]),
|
79
|
+
pictureAlt: _propTypes["default"].string,
|
78
80
|
isTextTopAlign: _propTypes["default"].bool
|
79
81
|
};
|
80
82
|
var _default = PictureWithDescription;
|
@@ -37,6 +37,8 @@ export interface IStoreBannerProps {
|
|
37
37
|
textButton?: string;
|
38
38
|
/** Ссылка для кнопки */
|
39
39
|
linkButton?: string;
|
40
|
+
/** Rel - атрибут тега <a> для всех кнопок баннера */
|
41
|
+
rel?: string;
|
40
42
|
/** Ссылка на картинку с QR-кодом */
|
41
43
|
qrCode?: string;
|
42
44
|
/** Цветовая тема компонента */
|
@@ -58,6 +58,7 @@ var StoreBanner = function StoreBanner(_ref) {
|
|
58
58
|
linkButton = _ref.linkButton,
|
59
59
|
_ref$textButton = _ref.textButton,
|
60
60
|
textButton = _ref$textButton === void 0 ? 'Установите приложение' : _ref$textButton,
|
61
|
+
rel = _ref.rel,
|
61
62
|
qrCode = _ref.qrCode,
|
62
63
|
imageSrc = _ref.imageSrc,
|
63
64
|
_ref$theme = _ref.theme,
|
@@ -108,6 +109,7 @@ var StoreBanner = function StoreBanner(_ref) {
|
|
108
109
|
},
|
109
110
|
theme: _StoreButton.Theme.APP_STORE,
|
110
111
|
href: linkApple,
|
112
|
+
rel: rel,
|
111
113
|
onClick: onClickApple,
|
112
114
|
className: cn('store-link', {
|
113
115
|
'app-store': true
|
@@ -118,6 +120,7 @@ var StoreBanner = function StoreBanner(_ref) {
|
|
118
120
|
},
|
119
121
|
theme: _StoreButton.Theme.GOOGLE_PLAY,
|
120
122
|
href: linkGoogle,
|
123
|
+
rel: rel,
|
121
124
|
className: cn('store-link', {
|
122
125
|
'google-play': true
|
123
126
|
}, googleLinkClassName),
|
@@ -128,6 +131,7 @@ var StoreBanner = function StoreBanner(_ref) {
|
|
128
131
|
},
|
129
132
|
theme: _StoreButton.Theme.HUAWEI_STORE,
|
130
133
|
href: linkHuawei,
|
134
|
+
rel: rel,
|
131
135
|
className: cn('store-link', {
|
132
136
|
'huawei-store': true
|
133
137
|
}, huaweiLinkClassName),
|
@@ -138,6 +142,7 @@ var StoreBanner = function StoreBanner(_ref) {
|
|
138
142
|
},
|
139
143
|
className: cn('button'),
|
140
144
|
href: linkButton,
|
145
|
+
rel: rel,
|
141
146
|
theme: theme === 'green' ? 'purple' : 'green'
|
142
147
|
}, textButton)))), /*#__PURE__*/React.createElement(_uiCore.GridColumn, {
|
143
148
|
all: "4",
|
@@ -162,6 +167,11 @@ StoreBanner.propTypes = {
|
|
162
167
|
onClickApple: _propTypes["default"].func,
|
163
168
|
linkGoogle: _propTypes["default"].string,
|
164
169
|
onClickGoogle: _propTypes["default"].func,
|
170
|
+
linkHuawei: _propTypes["default"].string,
|
171
|
+
onClickHuawei: _propTypes["default"].func,
|
172
|
+
textButton: _propTypes["default"].string,
|
173
|
+
linkButton: _propTypes["default"].string,
|
174
|
+
rel: _propTypes["default"].string,
|
165
175
|
qrCode: _propTypes["default"].string,
|
166
176
|
deviceMask: _propTypes["default"].oneOf(Object.values(DeviceMask)).isRequired,
|
167
177
|
imageSrc: _propTypes["default"].string.isRequired,
|
@@ -7,7 +7,7 @@ export declare enum Theme {
|
|
7
7
|
HUAWEI_STORE = "huawei-store"
|
8
8
|
}
|
9
9
|
declare type LinkPropTypes = React.ComponentProps<typeof Link>;
|
10
|
-
export declare type Props = Required<Pick<LinkPropTypes, 'href'>> & Pick<LinkPropTypes, 'target'
|
10
|
+
export declare type Props = Required<Pick<LinkPropTypes, 'href'>> & Pick<LinkPropTypes, 'target' | 'rel' | 'onClick' | 'dataAttrs'> & {
|
11
11
|
/** Тема кнопки */
|
12
12
|
theme: Theme;
|
13
13
|
/** Дополнительный класс */
|
@@ -55,13 +55,15 @@ var cn = (0, _uiHelpers.cnCreate)('mfui-store-button');
|
|
55
55
|
|
56
56
|
var StoreButton = function StoreButton(_a) {
|
57
57
|
var href = _a.href,
|
58
|
+
rel = _a.rel,
|
58
59
|
onClick = _a.onClick,
|
59
60
|
theme = _a.theme,
|
60
61
|
className = _a.className,
|
61
|
-
rest = __rest(_a, ["href", "onClick", "theme", "className"]);
|
62
|
+
rest = __rest(_a, ["href", "rel", "onClick", "theme", "className"]);
|
62
63
|
|
63
64
|
return /*#__PURE__*/React.createElement(_uiCore.Link, (0, _extends2["default"])({}, rest, {
|
64
65
|
href: href,
|
66
|
+
rel: rel,
|
65
67
|
onClick: onClick,
|
66
68
|
className: cn({
|
67
69
|
theme: theme
|
@@ -71,10 +73,14 @@ var StoreButton = function StoreButton(_a) {
|
|
71
73
|
|
72
74
|
StoreButton.propTypes = {
|
73
75
|
href: _propTypes["default"].string.isRequired,
|
76
|
+
rel: _propTypes["default"].string,
|
74
77
|
theme: _propTypes["default"].oneOf(Object.values(Theme)).isRequired,
|
75
78
|
onClick: _propTypes["default"].func,
|
76
79
|
className: _propTypes["default"].string,
|
77
|
-
target: _propTypes["default"].oneOf(['_self', '_blank', '_parent', '_top'])
|
80
|
+
target: _propTypes["default"].oneOf(['_self', '_blank', '_parent', '_top']),
|
81
|
+
dataAttrs: _propTypes["default"].shape({
|
82
|
+
root: _propTypes["default"].objectOf(_propTypes["default"].string.isRequired)
|
83
|
+
})
|
78
84
|
};
|
79
85
|
var _default = StoreButton;
|
80
86
|
exports["default"] = _default;
|
@@ -12,6 +12,8 @@ export interface ITextBoxPictureProps {
|
|
12
12
|
url: string;
|
13
13
|
/** Значение вертикальных отступов */
|
14
14
|
margin?: PictureMarginTypesType;
|
15
|
+
/** Значение тега alt для изображения */
|
16
|
+
alt?: string;
|
15
17
|
}
|
16
18
|
declare const TextBoxPicture: React.FC<ITextBoxPictureProps>;
|
17
19
|
export default TextBoxPicture;
|
@@ -29,7 +29,8 @@ var cn = (0, _uiHelpers.cnCreate)('mfui-text-box-picture');
|
|
29
29
|
var TextBoxPicture = function TextBoxPicture(_ref) {
|
30
30
|
var url = _ref.url,
|
31
31
|
_ref$margin = _ref.margin,
|
32
|
-
margin = _ref$margin === void 0 ? pictureMarginTypes.DEFAULT : _ref$margin
|
32
|
+
margin = _ref$margin === void 0 ? pictureMarginTypes.DEFAULT : _ref$margin,
|
33
|
+
alt = _ref.alt;
|
33
34
|
return /*#__PURE__*/React.createElement("div", {
|
34
35
|
className: cn({
|
35
36
|
margin: margin
|
@@ -37,13 +38,14 @@ var TextBoxPicture = function TextBoxPicture(_ref) {
|
|
37
38
|
}, /*#__PURE__*/React.createElement("img", {
|
38
39
|
className: cn('img'),
|
39
40
|
src: url,
|
40
|
-
alt:
|
41
|
+
alt: alt
|
41
42
|
}));
|
42
43
|
};
|
43
44
|
|
44
45
|
TextBoxPicture.propTypes = {
|
45
46
|
url: PropTypes.string.isRequired,
|
46
|
-
margin: PropTypes.oneOf([pictureMarginTypes.DEFAULT, pictureMarginTypes.BIG_TOP, pictureMarginTypes.BIG_BOTTOM, pictureMarginTypes.BIG_VERTICAL])
|
47
|
+
margin: PropTypes.oneOf([pictureMarginTypes.DEFAULT, pictureMarginTypes.BIG_TOP, pictureMarginTypes.BIG_BOTTOM, pictureMarginTypes.BIG_VERTICAL]),
|
48
|
+
alt: PropTypes.string
|
47
49
|
};
|
48
50
|
var _default = TextBoxPicture;
|
49
51
|
exports["default"] = _default;
|
@@ -34,6 +34,8 @@ export interface IContent {
|
|
34
34
|
buttonTarget?: '_self' | '_blank' | '_parent' | '_top';
|
35
35
|
/** Добавляет атрибут download для тега <a> компонента Button */
|
36
36
|
buttonDownload?: boolean;
|
37
|
+
/** Добавляет атрибут rel для тега <a> компонента Button */
|
38
|
+
buttonRel?: string;
|
37
39
|
/** Цвет кнопки */
|
38
40
|
buttonColor?: ButtonColorType;
|
39
41
|
/** Обработчик клика по кнопке */
|
@@ -52,6 +54,8 @@ export interface IContent {
|
|
52
54
|
linkTarget?: '_self' | '_blank' | '_parent' | '_top';
|
53
55
|
/** Добавляет атрибут download для тега <a> компонента TextLink */
|
54
56
|
linkDownload?: boolean;
|
57
|
+
/** Добавляет атрибут rel для тега <a> компонента TextLink */
|
58
|
+
linkRel?: string;
|
55
59
|
/** Строка со стоимостью услуги */
|
56
60
|
cost?: string;
|
57
61
|
}
|
@@ -94,6 +98,8 @@ interface IVideoBannerProps {
|
|
94
98
|
imageDesktop?: string;
|
95
99
|
/** Изображение для большого компьютерного разрешения */
|
96
100
|
imageDesktopWide?: string;
|
101
|
+
/** Значение тега alt для изображения */
|
102
|
+
imageAlt?: string;
|
97
103
|
/** Хлебные крошки */
|
98
104
|
breadcrumbs?: BreadCrumbsItemsType;
|
99
105
|
/** Включить микроразметку хлебных крошек */
|
@@ -92,6 +92,7 @@ var VideoBanner = function VideoBanner(_ref2) {
|
|
92
92
|
imageDesktop = _ref2$imageDesktop === void 0 ? '' : _ref2$imageDesktop,
|
93
93
|
_ref2$imageDesktopWid = _ref2.imageDesktopWide,
|
94
94
|
imageDesktopWide = _ref2$imageDesktopWid === void 0 ? '' : _ref2$imageDesktopWid,
|
95
|
+
imageAlt = _ref2.imageAlt,
|
95
96
|
content = _ref2.content,
|
96
97
|
_ref2$isMuted = _ref2.isMuted,
|
97
98
|
isMuted = _ref2$isMuted === void 0 ? true : _ref2$isMuted,
|
@@ -118,6 +119,7 @@ var VideoBanner = function VideoBanner(_ref2) {
|
|
118
119
|
buttonDownload = _ref3.buttonDownload,
|
119
120
|
_ref3$buttonColor = _ref3.buttonColor,
|
120
121
|
buttonColor = _ref3$buttonColor === void 0 ? ButtonColor.GREEN : _ref3$buttonColor,
|
122
|
+
buttonRel = _ref3.buttonRel,
|
121
123
|
onButtonClick = _ref3.onButtonClick,
|
122
124
|
onLinkClick = _ref3.onLinkClick,
|
123
125
|
_ref3$textColor = _ref3.textColor,
|
@@ -127,6 +129,7 @@ var VideoBanner = function VideoBanner(_ref2) {
|
|
127
129
|
linkUrl = _ref3.linkUrl,
|
128
130
|
linkTarget = _ref3.linkTarget,
|
129
131
|
linkDownload = _ref3.linkDownload,
|
132
|
+
linkRel = _ref3.linkRel,
|
130
133
|
cost = _ref3.cost;
|
131
134
|
return /*#__PURE__*/_react["default"].createElement(_uiCore.Grid, {
|
132
135
|
className: cn('grid'),
|
@@ -164,7 +167,8 @@ var VideoBanner = function VideoBanner(_ref2) {
|
|
164
167
|
href: buttonHref,
|
165
168
|
target: buttonTarget,
|
166
169
|
onClick: onButtonClick,
|
167
|
-
download: buttonDownload
|
170
|
+
download: buttonDownload,
|
171
|
+
rel: buttonRel
|
168
172
|
}, buttonTitle), linkTitle && /*#__PURE__*/_react["default"].createElement(_uiCore.TextLink, {
|
169
173
|
dataAttrs: {
|
170
174
|
root: dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.link
|
@@ -173,7 +177,8 @@ var VideoBanner = function VideoBanner(_ref2) {
|
|
173
177
|
href: linkUrl,
|
174
178
|
download: linkDownload,
|
175
179
|
target: linkTarget,
|
176
|
-
onClick: onLinkClick
|
180
|
+
onClick: onLinkClick,
|
181
|
+
rel: linkRel
|
177
182
|
}, linkTitle)))));
|
178
183
|
}, [classes.button, classes.link, dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.button, dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.link]);
|
179
184
|
|
@@ -268,7 +273,7 @@ var VideoBanner = function VideoBanner(_ref2) {
|
|
268
273
|
}), /*#__PURE__*/_react["default"].createElement("img", {
|
269
274
|
className: cn('background-image'),
|
270
275
|
src: imageMobile,
|
271
|
-
alt:
|
276
|
+
alt: imageAlt
|
272
277
|
})))));
|
273
278
|
};
|
274
279
|
|
@@ -300,6 +305,7 @@ VideoBanner.propTypes = {
|
|
300
305
|
buttonHref: PropTypes.string,
|
301
306
|
buttonDownload: PropTypes.bool,
|
302
307
|
buttonColor: PropTypes.oneOf(Object.values(ButtonColor)),
|
308
|
+
buttonRel: PropTypes.string,
|
303
309
|
onButtonClick: PropTypes.func,
|
304
310
|
onLinkClick: PropTypes.func,
|
305
311
|
textColor: PropTypes.oneOf(Object.values(TextColor)),
|
@@ -307,6 +313,7 @@ VideoBanner.propTypes = {
|
|
307
313
|
linkTitle: PropTypes.string,
|
308
314
|
linkUrl: PropTypes.string,
|
309
315
|
linkDownload: PropTypes.bool,
|
316
|
+
linkRel: PropTypes.string,
|
310
317
|
cost: PropTypes.string
|
311
318
|
}),
|
312
319
|
isMuted: PropTypes.bool,
|
@@ -314,6 +321,7 @@ VideoBanner.propTypes = {
|
|
314
321
|
imageTablet: PropTypes.string.isRequired,
|
315
322
|
imageDesktop: PropTypes.string,
|
316
323
|
imageDesktopWide: PropTypes.string,
|
324
|
+
imageAlt: PropTypes.string,
|
317
325
|
breadcrumbs: PropTypes.arrayOf(PropTypes.shape({
|
318
326
|
title: PropTypes.string.isRequired,
|
319
327
|
href: PropTypes.string
|
@@ -9,6 +9,8 @@ export interface IContent {
|
|
9
9
|
buttonTitle?: string;
|
10
10
|
/** Добавляет атрибут download для тега <a> компонента Button */
|
11
11
|
buttonDownload?: boolean;
|
12
|
+
/** Добавляет атрибут rel для тега <a> компонента Button */
|
13
|
+
buttonRel?: string;
|
12
14
|
/** Ссылка на кнопке */
|
13
15
|
href?: string;
|
14
16
|
/** Обработчик клика по кнопке */
|
@@ -118,6 +118,7 @@ var VideoBlock = function VideoBlock(_ref) {
|
|
118
118
|
href = _ref2.href,
|
119
119
|
buttonDownload = _ref2.buttonDownload,
|
120
120
|
buttonTitle = _ref2.buttonTitle,
|
121
|
+
buttonRel = _ref2.buttonRel,
|
121
122
|
onButtonClick = _ref2.onButtonClick;
|
122
123
|
return /*#__PURE__*/_react["default"].createElement("div", {
|
123
124
|
className: cn('content', {
|
@@ -135,7 +136,8 @@ var VideoBlock = function VideoBlock(_ref) {
|
|
135
136
|
className: cn('button', [classes.button]),
|
136
137
|
href: href,
|
137
138
|
onClick: onButtonClick,
|
138
|
-
download: buttonDownload
|
139
|
+
download: buttonDownload,
|
140
|
+
rel: buttonRel
|
139
141
|
}, buttonTitle));
|
140
142
|
}, [classes.button, classes.description, dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.button, contentPositionRight]);
|
141
143
|
|
@@ -198,6 +200,7 @@ VideoBlock.propTypes = {
|
|
198
200
|
href: _propTypes["default"].string,
|
199
201
|
buttonTitle: _propTypes["default"].string,
|
200
202
|
buttonDownload: _propTypes["default"].bool,
|
203
|
+
buttonRel: _propTypes["default"].string,
|
201
204
|
onButtonClick: _propTypes["default"].func
|
202
205
|
}),
|
203
206
|
videoType: _propTypes["default"].oneOf(Object.values(VideoTypes)),
|
package/package.json
CHANGED
@@ -1,6 +1,6 @@
|
|
1
1
|
{
|
2
2
|
"name": "@megafon/ui-shared",
|
3
|
-
"version": "4.
|
3
|
+
"version": "4.13.0",
|
4
4
|
"files": [
|
5
5
|
"dist"
|
6
6
|
],
|
@@ -52,7 +52,7 @@
|
|
52
52
|
"@babel/preset-env": "^7.8.6",
|
53
53
|
"@babel/preset-react": "^7.8.3",
|
54
54
|
"@babel/preset-typescript": "^7.8.3",
|
55
|
-
"@megafon/ui-icons": "^2.
|
55
|
+
"@megafon/ui-icons": "^2.7.0",
|
56
56
|
"@svgr/core": "^2.4.1",
|
57
57
|
"@testing-library/jest-dom": "5.16.2",
|
58
58
|
"@testing-library/react": "12.1.2",
|
@@ -85,7 +85,7 @@
|
|
85
85
|
},
|
86
86
|
"dependencies": {
|
87
87
|
"@babel/runtime": "^7.8.4",
|
88
|
-
"@megafon/ui-core": "^4.
|
88
|
+
"@megafon/ui-core": "^4.12.0",
|
89
89
|
"@megafon/ui-helpers": "^2.4.0",
|
90
90
|
"core-js": "^3.6.4",
|
91
91
|
"htmr": "^0.9.2",
|
@@ -93,5 +93,5 @@
|
|
93
93
|
"prop-types": "^15.7.2",
|
94
94
|
"swiper": "^6.5.6"
|
95
95
|
},
|
96
|
-
"gitHead": "
|
96
|
+
"gitHead": "8aa400bad61aac6015ab7eff10b6aa24dcdbd8f6"
|
97
97
|
}
|