@megafon/ui-shared 5.16.0 → 6.0.0-beta.1
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/dist/es/components/AccordionBox/AccordionBox.css +1 -15
- package/dist/es/components/AccordionBox/AccordionBox.d.ts +2 -2
- package/dist/es/components/AccordionBox/AccordionBox.js +6 -49
- package/dist/es/components/AudioPlayer/AudioPlayer.d.ts +2 -2
- package/dist/es/components/AudioPlayer/AudioPlayer.js +11 -27
- package/dist/es/components/AudioPlayer/AudioProgress.d.ts +1 -1
- package/dist/es/components/AudioPlayer/AudioProgress.js +10 -22
- package/dist/es/components/AudioPlayer/AudioRange.d.ts +1 -1
- package/dist/es/components/AudioPlayer/AudioRange.js +8 -10
- package/dist/es/components/AudioPlayer/AudioVolume.d.ts +1 -1
- package/dist/es/components/AudioPlayer/AudioVolume.js +3 -12
- package/dist/es/components/AudioPlayer/hooks/useTrackDuration.js +4 -10
- package/dist/es/components/AudioPlayer/style/AudioPlayer.css +1 -58
- package/dist/es/components/AudioPlayer/style/AudioProgress.css +1 -35
- package/dist/es/components/AudioPlayer/style/AudioRange.css +1 -68
- package/dist/es/components/AudioPlayer/style/AudioVolume.css +1 -34
- package/dist/es/components/AudioPlayer/timerFormatUtil.js +1 -9
- package/dist/es/components/BannerBox/BannerBox.d.ts +1 -1
- package/dist/es/components/BannerBox/BannerBox.js +3 -12
- package/dist/es/components/BenefitsIcons/BenefitsIcons.d.ts +1 -1
- package/dist/es/components/BenefitsIcons/BenefitsIcons.js +23 -64
- package/dist/es/components/BenefitsIcons/BenefitsIconsTile.d.ts +1 -1
- package/dist/es/components/BenefitsIcons/BenefitsIconsTile.js +9 -36
- package/dist/es/components/BenefitsIcons/helpers.d.ts +3 -3
- package/dist/es/components/BenefitsIcons/helpers.js +6 -20
- package/dist/es/components/BenefitsIcons/style/BenefitsIcons.css +1 -38
- package/dist/es/components/BenefitsIcons/style/BenefitsIconsTile.css +1 -90
- package/dist/es/components/BenefitsIcons/types.d.ts +5 -5
- package/dist/es/components/BenefitsPictures/BenefitsPictures.d.ts +1 -1
- package/dist/es/components/BenefitsPictures/BenefitsPictures.js +19 -49
- package/dist/es/components/BenefitsPictures/BenfitsPictures.css +1 -43
- package/dist/es/components/BenefitsPictures/helpers.d.ts +2 -2
- package/dist/es/components/BenefitsPictures/helpers.js +0 -14
- package/dist/es/components/BenefitsPictures/types.d.ts +3 -3
- package/dist/es/components/BenefitsPictures/types.js +1 -0
- package/dist/es/components/Breadcrumbs/Breadcrumbs.css +1 -43
- package/dist/es/components/Breadcrumbs/Breadcrumbs.d.ts +6 -6
- package/dist/es/components/Breadcrumbs/Breadcrumbs.js +10 -39
- package/dist/es/components/Breadcrumbs/components/BreadcrumbsItem.css +1 -16
- package/dist/es/components/Breadcrumbs/components/BreadcrumbsItem.d.ts +4 -4
- package/dist/es/components/Breadcrumbs/components/BreadcrumbsItem.js +11 -36
- package/dist/es/components/ButtonBanner/ButtonBanner.css +1 -122
- package/dist/es/components/ButtonBanner/ButtonBanner.d.ts +7 -7
- package/dist/es/components/ButtonBanner/ButtonBanner.js +22 -53
- package/dist/es/components/ButtonLinkBox/ButtonLinkBox.css +1 -19
- package/dist/es/components/ButtonLinkBox/ButtonLinkBox.d.ts +3 -3
- package/dist/es/components/ButtonLinkBox/ButtonLinkBox.js +20 -51
- package/dist/es/components/Card/Card.css +1 -354
- package/dist/es/components/Card/Card.d.ts +5 -9
- package/dist/es/components/Card/Card.js +26 -136
- package/dist/es/components/Card/types.d.ts +9 -15
- package/dist/es/components/Card/types.js +1 -0
- package/dist/es/components/CardsBox/CardsBox.js +3 -14
- package/dist/es/components/CardsBox/helpers.d.ts +2 -2
- package/dist/es/components/CardsBox/helpers.js +0 -4
- package/dist/es/components/CarouselBox/CarouselBox.d.ts +2 -2
- package/dist/es/components/CarouselBox/CarouselBox.js +11 -24
- package/dist/es/components/Container/Container.css +1 -3230
- package/dist/es/components/Container/Container.d.ts +7 -5
- package/dist/es/components/Container/Container.js +10 -25
- package/dist/es/components/DownloadLinks/DownloadLink.css +1 -37
- package/dist/es/components/DownloadLinks/DownloadLink.d.ts +1 -1
- package/dist/es/components/DownloadLinks/DownloadLink.js +13 -44
- package/dist/es/components/DownloadLinks/DownloadLinks.css +1 -36
- package/dist/es/components/DownloadLinks/DownloadLinks.d.ts +3 -3
- package/dist/es/components/DownloadLinks/DownloadLinks.js +2 -13
- package/dist/es/components/FaqWrapper/FaqWrapper.d.ts +5 -2
- package/dist/es/components/FaqWrapper/FaqWrapper.js +1 -3
- package/dist/es/components/ImageBanner/ImageBanner.css +1 -248
- package/dist/es/components/ImageBanner/ImageBanner.d.ts +21 -17
- package/dist/es/components/ImageBanner/ImageBanner.js +51 -109
- package/dist/es/components/Instructions/Instructions.css +1 -790
- package/dist/es/components/Instructions/Instructions.d.ts +11 -11
- package/dist/es/components/Instructions/Instructions.js +41 -94
- package/dist/es/components/NotificationBox/NotificationBox.css +1 -0
- package/dist/es/components/NotificationBox/NotificationBox.d.ts +4 -4
- package/dist/es/components/NotificationBox/NotificationBox.js +5 -19
- package/dist/es/components/PageTitle/PageTitle.css +1 -80
- package/dist/es/components/PageTitle/PageTitle.d.ts +2 -2
- package/dist/es/components/PageTitle/PageTitle.js +12 -37
- package/dist/es/components/Partners/Partners.css +1 -53
- package/dist/es/components/Partners/Partners.d.ts +2 -2
- package/dist/es/components/Partners/Partners.js +17 -48
- package/dist/es/components/PictureWithDescription/PictureWithDescription.css +1 -80
- package/dist/es/components/PictureWithDescription/PictureWithDescription.d.ts +4 -2
- package/dist/es/components/PictureWithDescription/PictureWithDescription.js +10 -28
- package/dist/es/components/Property/Property.css +1 -156
- package/dist/es/components/Property/Property.d.ts +4 -4
- package/dist/es/components/Property/Property.js +37 -81
- package/dist/es/components/Property/PropertyDescription.css +1 -17
- package/dist/es/components/Property/PropertyDescription.d.ts +3 -3
- package/dist/es/components/Property/PropertyDescription.js +8 -28
- package/dist/es/components/Property/types.d.ts +7 -5
- package/dist/es/components/Property/types.js +1 -0
- package/dist/es/components/Steps/Steps.css +1 -41
- package/dist/es/components/Steps/Steps.d.ts +2 -1
- package/dist/es/components/Steps/Steps.js +4 -19
- package/dist/es/components/Steps/StepsItem.css +1 -42
- package/dist/es/components/Steps/StepsItem.d.ts +2 -2
- package/dist/es/components/Steps/StepsItem.js +2 -9
- package/dist/es/components/StoreBanner/StoreBanner.css +1 -346
- package/dist/es/components/StoreBanner/StoreBanner.d.ts +5 -5
- package/dist/es/components/StoreBanner/StoreBanner.js +41 -97
- package/dist/es/components/StoreButton/StoreButton.css +1 -327
- package/dist/es/components/StoreButton/StoreButton.d.ts +3 -3
- package/dist/es/components/StoreButton/StoreButton.js +13 -44
- package/dist/es/components/Table/Table.css +1 -157
- package/dist/es/components/Table/Table.d.ts +1 -1
- package/dist/es/components/Table/Table.js +31 -51
- package/dist/es/components/Table/TableCell.js +0 -6
- package/dist/es/components/Table/TableRow.js +1 -10
- package/dist/es/components/TabsBox/TabsBox.d.ts +1 -1
- package/dist/es/components/TabsBox/TabsBox.js +4 -13
- package/dist/es/components/TextBox/TextBox.css +1 -25
- package/dist/es/components/TextBox/TextBox.d.ts +2 -1
- package/dist/es/components/TextBox/TextBox.js +8 -23
- package/dist/es/components/TextBox/TextBoxPicture.css +1 -27
- package/dist/es/components/TextBox/TextBoxPicture.d.ts +2 -2
- package/dist/es/components/TextBox/TextBoxPicture.js +5 -14
- package/dist/es/components/TextWithIcon/TextWithIcon.css +1 -10
- package/dist/es/components/TextWithIcon/TextWithIcon.d.ts +1 -1
- package/dist/es/components/TextWithIcon/TextWithIcon.js +6 -24
- package/dist/es/components/TextWithIcon/TextWithIconItem.css +1 -29
- package/dist/es/components/TextWithIcon/TextWithIconItem.d.ts +1 -1
- package/dist/es/components/TextWithIcon/TextWithIconItem.js +6 -21
- package/dist/es/components/TitleDescriptionBox/TitleDescriptionBox.css +1 -31
- package/dist/es/components/TitleDescriptionBox/TitleDescriptionBox.d.ts +1 -1
- package/dist/es/components/TitleDescriptionBox/TitleDescriptionBox.js +6 -23
- package/dist/es/components/VideoBanner/VideoBanner.css +1 -225
- package/dist/es/components/VideoBanner/VideoBanner.d.ts +7 -7
- package/dist/es/components/VideoBanner/VideoBanner.js +47 -110
- package/dist/es/components/VideoBlock/VideoBlock.css +1 -106
- package/dist/es/components/VideoBlock/VideoBlock.d.ts +4 -4
- package/dist/es/components/VideoBlock/VideoBlock.js +35 -75
- package/dist/es/helpers/getColumnConfig.d.ts +5 -1
- package/dist/lib/components/AccordionBox/AccordionBox.css +1 -15
- package/dist/lib/components/AccordionBox/AccordionBox.d.ts +2 -2
- package/dist/lib/components/AccordionBox/AccordionBox.js +10 -66
- package/dist/lib/components/AudioPlayer/AudioPlayer.d.ts +2 -2
- package/dist/lib/components/AudioPlayer/AudioPlayer.js +32 -56
- package/dist/lib/components/AudioPlayer/AudioProgress.d.ts +1 -1
- package/dist/lib/components/AudioPlayer/AudioProgress.js +12 -43
- package/dist/lib/components/AudioPlayer/AudioRange.d.ts +1 -1
- package/dist/lib/components/AudioPlayer/AudioRange.js +9 -17
- package/dist/lib/components/AudioPlayer/AudioVolume.d.ts +1 -1
- package/dist/lib/components/AudioPlayer/AudioVolume.js +4 -23
- package/dist/lib/components/AudioPlayer/hooks/useTrackDuration.js +5 -16
- package/dist/lib/components/AudioPlayer/style/AudioPlayer.css +1 -58
- package/dist/lib/components/AudioPlayer/style/AudioProgress.css +1 -35
- package/dist/lib/components/AudioPlayer/style/AudioRange.css +1 -68
- package/dist/lib/components/AudioPlayer/style/AudioVolume.css +1 -34
- package/dist/lib/components/AudioPlayer/timerFormatUtil.js +2 -13
- package/dist/lib/components/BannerBox/BannerBox.d.ts +1 -1
- package/dist/lib/components/BannerBox/BannerBox.js +7 -25
- package/dist/lib/components/BenefitsIcons/BenefitsIcons.d.ts +1 -1
- package/dist/lib/components/BenefitsIcons/BenefitsIcons.js +26 -86
- package/dist/lib/components/BenefitsIcons/BenefitsIconsTile.d.ts +1 -1
- package/dist/lib/components/BenefitsIcons/BenefitsIconsTile.js +13 -53
- package/dist/lib/components/BenefitsIcons/helpers.d.ts +3 -3
- package/dist/lib/components/BenefitsIcons/helpers.js +10 -37
- package/dist/lib/components/BenefitsIcons/style/BenefitsIcons.css +1 -38
- package/dist/lib/components/BenefitsIcons/style/BenefitsIconsTile.css +1 -90
- package/dist/lib/components/BenefitsIcons/types.d.ts +5 -5
- package/dist/lib/components/BenefitsIcons/types.js +5 -8
- package/dist/lib/components/BenefitsPictures/BenefitsPictures.d.ts +1 -1
- package/dist/lib/components/BenefitsPictures/BenefitsPictures.js +24 -71
- package/dist/lib/components/BenefitsPictures/BenfitsPictures.css +1 -43
- package/dist/lib/components/BenefitsPictures/helpers.d.ts +2 -2
- package/dist/lib/components/BenefitsPictures/helpers.js +9 -40
- package/dist/lib/components/BenefitsPictures/types.d.ts +3 -3
- package/dist/lib/components/BenefitsPictures/types.js +5 -1
- package/dist/lib/components/Breadcrumbs/Breadcrumbs.css +1 -43
- package/dist/lib/components/Breadcrumbs/Breadcrumbs.d.ts +6 -6
- package/dist/lib/components/Breadcrumbs/Breadcrumbs.js +18 -60
- package/dist/lib/components/Breadcrumbs/components/BreadcrumbsItem.css +1 -16
- package/dist/lib/components/Breadcrumbs/components/BreadcrumbsItem.d.ts +4 -4
- package/dist/lib/components/Breadcrumbs/components/BreadcrumbsItem.js +22 -55
- package/dist/lib/components/ButtonBanner/ButtonBanner.css +1 -122
- package/dist/lib/components/ButtonBanner/ButtonBanner.d.ts +7 -7
- package/dist/lib/components/ButtonBanner/ButtonBanner.js +40 -89
- package/dist/lib/components/ButtonLinkBox/ButtonLinkBox.css +1 -19
- package/dist/lib/components/ButtonLinkBox/ButtonLinkBox.d.ts +3 -3
- package/dist/lib/components/ButtonLinkBox/ButtonLinkBox.js +29 -72
- package/dist/lib/components/Card/Card.css +1 -354
- package/dist/lib/components/Card/Card.d.ts +5 -9
- package/dist/lib/components/Card/Card.js +63 -180
- package/dist/lib/components/Card/types.d.ts +9 -15
- package/dist/lib/components/Card/types.js +5 -1
- package/dist/lib/components/CardsBox/CardsBox.js +7 -31
- package/dist/lib/components/CardsBox/helpers.d.ts +2 -2
- package/dist/lib/components/CardsBox/helpers.js +1 -8
- package/dist/lib/components/CarouselBox/CarouselBox.d.ts +2 -2
- package/dist/lib/components/CarouselBox/CarouselBox.js +15 -39
- package/dist/lib/components/Container/Container.css +1 -3230
- package/dist/lib/components/Container/Container.d.ts +7 -5
- package/dist/lib/components/Container/Container.js +17 -39
- package/dist/lib/components/DownloadLinks/DownloadLink.css +1 -37
- package/dist/lib/components/DownloadLinks/DownloadLink.d.ts +1 -1
- package/dist/lib/components/DownloadLinks/DownloadLink.js +17 -60
- package/dist/lib/components/DownloadLinks/DownloadLinks.css +1 -36
- package/dist/lib/components/DownloadLinks/DownloadLinks.d.ts +3 -3
- package/dist/lib/components/DownloadLinks/DownloadLinks.js +8 -33
- package/dist/lib/components/FaqWrapper/FaqWrapper.d.ts +5 -2
- package/dist/lib/components/FaqWrapper/FaqWrapper.js +6 -9
- package/dist/lib/components/ImageBanner/ImageBanner.css +1 -248
- package/dist/lib/components/ImageBanner/ImageBanner.d.ts +21 -17
- package/dist/lib/components/ImageBanner/ImageBanner.js +71 -155
- package/dist/lib/components/Instructions/Instructions.css +1 -790
- package/dist/lib/components/Instructions/Instructions.d.ts +11 -11
- package/dist/lib/components/Instructions/Instructions.js +103 -186
- package/dist/lib/components/NotificationBox/NotificationBox.css +1 -0
- package/dist/lib/components/NotificationBox/NotificationBox.d.ts +4 -4
- package/dist/lib/components/NotificationBox/NotificationBox.js +9 -37
- package/dist/lib/components/PageTitle/PageTitle.css +1 -80
- package/dist/lib/components/PageTitle/PageTitle.d.ts +2 -2
- package/dist/lib/components/PageTitle/PageTitle.js +15 -52
- package/dist/lib/components/Partners/Partners.css +1 -53
- package/dist/lib/components/Partners/Partners.d.ts +2 -2
- package/dist/lib/components/Partners/Partners.js +21 -65
- package/dist/lib/components/PictureWithDescription/PictureWithDescription.css +1 -80
- package/dist/lib/components/PictureWithDescription/PictureWithDescription.d.ts +4 -2
- package/dist/lib/components/PictureWithDescription/PictureWithDescription.js +16 -46
- package/dist/lib/components/Property/Property.css +1 -156
- package/dist/lib/components/Property/Property.d.ts +4 -4
- package/dist/lib/components/Property/Property.js +60 -120
- package/dist/lib/components/Property/PropertyDescription.css +1 -17
- package/dist/lib/components/Property/PropertyDescription.d.ts +3 -3
- package/dist/lib/components/Property/PropertyDescription.js +15 -46
- package/dist/lib/components/Property/types.d.ts +7 -5
- package/dist/lib/components/Property/types.js +5 -1
- package/dist/lib/components/Steps/Steps.css +1 -41
- package/dist/lib/components/Steps/Steps.d.ts +2 -1
- package/dist/lib/components/Steps/Steps.js +8 -35
- package/dist/lib/components/Steps/StepsItem.css +1 -42
- package/dist/lib/components/Steps/StepsItem.d.ts +2 -2
- package/dist/lib/components/Steps/StepsItem.js +11 -23
- package/dist/lib/components/StoreBanner/StoreBanner.css +1 -346
- package/dist/lib/components/StoreBanner/StoreBanner.d.ts +5 -5
- package/dist/lib/components/StoreBanner/StoreBanner.js +47 -118
- package/dist/lib/components/StoreButton/StoreButton.css +1 -327
- package/dist/lib/components/StoreButton/StoreButton.d.ts +3 -3
- package/dist/lib/components/StoreButton/StoreButton.js +17 -63
- package/dist/lib/components/Table/Table.css +1 -157
- package/dist/lib/components/Table/Table.d.ts +1 -1
- package/dist/lib/components/Table/Table.js +35 -68
- package/dist/lib/components/Table/TableCell.js +4 -16
- package/dist/lib/components/Table/TableRow.js +5 -19
- package/dist/lib/components/TabsBox/TabBox.js +1 -4
- package/dist/lib/components/TabsBox/TabsBox.d.ts +1 -1
- package/dist/lib/components/TabsBox/TabsBox.js +8 -26
- package/dist/lib/components/TextBox/TextBox.css +1 -25
- package/dist/lib/components/TextBox/TextBox.d.ts +2 -1
- package/dist/lib/components/TextBox/TextBox.js +12 -36
- package/dist/lib/components/TextBox/TextBoxPicture.css +1 -27
- package/dist/lib/components/TextBox/TextBoxPicture.d.ts +2 -2
- package/dist/lib/components/TextBox/TextBoxPicture.js +11 -29
- package/dist/lib/components/TextWithIcon/TextWithIcon.css +1 -10
- package/dist/lib/components/TextWithIcon/TextWithIcon.d.ts +1 -1
- package/dist/lib/components/TextWithIcon/TextWithIcon.js +10 -39
- package/dist/lib/components/TextWithIcon/TextWithIconItem.css +1 -29
- package/dist/lib/components/TextWithIcon/TextWithIconItem.d.ts +1 -1
- package/dist/lib/components/TextWithIcon/TextWithIconItem.js +10 -37
- package/dist/lib/components/TitleDescriptionBox/TitleDescriptionBox.css +1 -31
- package/dist/lib/components/TitleDescriptionBox/TitleDescriptionBox.d.ts +1 -1
- package/dist/lib/components/TitleDescriptionBox/TitleDescriptionBox.js +10 -40
- package/dist/lib/components/VideoBanner/VideoBanner.css +1 -225
- package/dist/lib/components/VideoBanner/VideoBanner.d.ts +7 -7
- package/dist/lib/components/VideoBanner/VideoBanner.js +83 -176
- package/dist/lib/components/VideoBlock/VideoBlock.css +1 -106
- package/dist/lib/components/VideoBlock/VideoBlock.d.ts +4 -4
- package/dist/lib/components/VideoBlock/VideoBlock.js +58 -114
- package/dist/lib/constants/throttleTime.js +2 -3
- package/dist/lib/helpers/getColumnConfig.d.ts +5 -1
- package/dist/lib/helpers/getColumnConfig.js +2 -5
- package/dist/lib/index.js +10 -57
- package/package.json +89 -92
- package/CHANGELOG.md +0 -3984
- package/dist/es/components/NotificationBox/style/NotificationBox.css +0 -28
- package/dist/es/components/StoreBanner/doc/img/android-screen.png +0 -0
- package/dist/es/components/StoreBanner/doc/img/qr-code.png +0 -0
- package/dist/es/components/StoreBanner/doc/img/screen.png +0 -0
- package/dist/lib/components/NotificationBox/style/NotificationBox.css +0 -28
- package/dist/lib/components/StoreBanner/doc/img/android-screen.png +0 -0
- package/dist/lib/components/StoreBanner/doc/img/qr-code.png +0 -0
- package/dist/lib/components/StoreBanner/doc/img/screen.png +0 -0
@@ -1,6 +1,6 @@
|
|
1
|
-
import
|
1
|
+
import * as React from 'react';
|
2
2
|
import SwiperCore from 'swiper';
|
3
|
-
import './Instructions.
|
3
|
+
import './Instructions.scss';
|
4
4
|
export declare const pictureAlignTypes: {
|
5
5
|
readonly LEFT: "left";
|
6
6
|
readonly RIGHT: "right";
|
@@ -34,13 +34,13 @@ export declare const elementOrderTypes: {
|
|
34
34
|
readonly DEFAULT: "default";
|
35
35
|
readonly REVERSED: "reversed";
|
36
36
|
};
|
37
|
-
|
38
|
-
|
39
|
-
|
40
|
-
|
41
|
-
|
42
|
-
|
43
|
-
export
|
37
|
+
type PictureAlignTypesType = (typeof pictureAlignTypes)[keyof typeof pictureAlignTypes];
|
38
|
+
type PictureVerticalAlignTypesType = (typeof pictureVerticalAlignTypes)[keyof typeof pictureVerticalAlignTypes];
|
39
|
+
type PictureMaskTypesType = (typeof pictureMaskTypes)[keyof typeof pictureMaskTypes];
|
40
|
+
type PictureBackgroundColorsType = (typeof pictureBackgroundColorTypes)[keyof typeof pictureBackgroundColorTypes];
|
41
|
+
type ArrowThemeType = (typeof arrowTheme)[keyof typeof arrowTheme];
|
42
|
+
type ElementOrderType = (typeof elementOrderTypes)[keyof typeof elementOrderTypes];
|
43
|
+
export type InstructionItemType = {
|
44
44
|
title: string | React.ReactNode | React.ReactNode[];
|
45
45
|
mediaUrl: string;
|
46
46
|
isVideo: boolean;
|
@@ -62,7 +62,7 @@ export interface IInstructionsProps {
|
|
62
62
|
arrowNext?: Record<string, string>;
|
63
63
|
};
|
64
64
|
/** Ссылка на корневой элемент */
|
65
|
-
rootRef?: Ref<HTMLDivElement>;
|
65
|
+
rootRef?: React.Ref<HTMLDivElement>;
|
66
66
|
/** Дополнительные классы для внутренних элементов */
|
67
67
|
classes?: {
|
68
68
|
instructionItem?: string;
|
@@ -99,5 +99,5 @@ export interface IInstructionsProps {
|
|
99
99
|
/** Ref на swiper */
|
100
100
|
getSwiper?: (instance: SwiperCore) => void;
|
101
101
|
}
|
102
|
-
declare const Instructions: React.FC<IInstructionsProps
|
102
|
+
declare const Instructions: React.FC<React.PropsWithChildren<IInstructionsProps>>;
|
103
103
|
export default Instructions;
|
@@ -1,14 +1,11 @@
|
|
1
1
|
import _extends from "@babel/runtime/helpers/extends";
|
2
2
|
import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
|
3
3
|
import "core-js/modules/es.array.map.js";
|
4
|
-
|
5
4
|
/* eslint-disable jsx-a11y/no-static-element-interactions */
|
6
|
-
|
7
5
|
/* eslint-disable jsx-a11y/click-events-have-key-events */
|
8
|
-
import React from 'react';
|
6
|
+
import * as React from 'react';
|
9
7
|
import { Grid, GridColumn, Header, NavArrow, Paragraph, Tile } from '@megafon/ui-core';
|
10
8
|
import { cnCreate, filterDataAttrs, titleConvertConfig, convert, textConvertConfig } from '@megafon/ui-helpers';
|
11
|
-
import PropTypes from 'prop-types';
|
12
9
|
import { Swiper, SwiperSlide } from 'swiper/react';
|
13
10
|
import "./Instructions.css";
|
14
11
|
export var pictureAlignTypes = {
|
@@ -47,51 +44,47 @@ export var elementOrderTypes = {
|
|
47
44
|
var testIdPrefix = 'Instructions';
|
48
45
|
var cn = cnCreate('mfui-instructions');
|
49
46
|
var swiperSlideCn = cn('slide');
|
50
|
-
|
51
47
|
var Instructions = function Instructions(_ref) {
|
52
48
|
var dataAttrs = _ref.dataAttrs,
|
53
|
-
|
54
|
-
|
55
|
-
|
56
|
-
|
57
|
-
|
58
|
-
|
59
|
-
|
60
|
-
|
61
|
-
|
62
|
-
|
63
|
-
|
64
|
-
|
65
|
-
|
66
|
-
|
67
|
-
|
68
|
-
|
69
|
-
|
70
|
-
|
71
|
-
|
72
|
-
|
73
|
-
|
74
|
-
|
75
|
-
|
76
|
-
|
77
|
-
|
78
|
-
|
79
|
-
|
80
|
-
|
81
|
-
|
82
|
-
|
83
|
-
|
84
|
-
|
49
|
+
rootRef = _ref.rootRef,
|
50
|
+
_ref$classes = _ref.classes,
|
51
|
+
_ref$classes2 = _ref$classes === void 0 ? {} : _ref$classes,
|
52
|
+
instructionItem = _ref$classes2.instructionItem,
|
53
|
+
desktopInstructionItem = _ref$classes2.desktopInstructionItem,
|
54
|
+
mobileInstructionItem = _ref$classes2.mobileInstructionItem,
|
55
|
+
activeInstructionItem = _ref$classes2.activeInstructionItem,
|
56
|
+
desktopItemTitle = _ref$classes2.desktopItemTitle,
|
57
|
+
mobileItemTitle = _ref$classes2.mobileItemTitle,
|
58
|
+
instructionItemImg = _ref$classes2.instructionItemImg,
|
59
|
+
additionalText = _ref$classes2.additionalText,
|
60
|
+
arrowPrev = _ref$classes2.arrowPrev,
|
61
|
+
arrowNext = _ref$classes2.arrowNext,
|
62
|
+
_ref$title = _ref.title,
|
63
|
+
title = _ref$title === void 0 ? '' : _ref$title,
|
64
|
+
instructionItems = _ref.instructionItems,
|
65
|
+
_ref$pictureAlign = _ref.pictureAlign,
|
66
|
+
pictureAlign = _ref$pictureAlign === void 0 ? 'left' : _ref$pictureAlign,
|
67
|
+
_ref$pictureVerticalA = _ref.pictureVerticalAlign,
|
68
|
+
pictureVerticalAlign = _ref$pictureVerticalA === void 0 ? 'center' : _ref$pictureVerticalA,
|
69
|
+
_ref$pictureMask = _ref.pictureMask,
|
70
|
+
pictureMask = _ref$pictureMask === void 0 ? 'none' : _ref$pictureMask,
|
71
|
+
pictureBackgroundColor = _ref.pictureBackgroundColor,
|
72
|
+
getSwiper = _ref.getSwiper,
|
73
|
+
text = _ref.additionalText,
|
74
|
+
showArrows = _ref.showArrows,
|
75
|
+
_ref$arrowsTheme = _ref.arrowsTheme,
|
76
|
+
arrowsTheme = _ref$arrowsTheme === void 0 ? arrowTheme.DARK : _ref$arrowsTheme,
|
77
|
+
_ref$elementOrder = _ref.elementOrder,
|
78
|
+
elementOrder = _ref$elementOrder === void 0 ? 'default' : _ref$elementOrder,
|
79
|
+
children = _ref.children;
|
85
80
|
var _React$useState = React.useState(),
|
86
|
-
|
87
|
-
|
88
|
-
|
89
|
-
|
81
|
+
_React$useState2 = _slicedToArray(_React$useState, 2),
|
82
|
+
swiperInstance = _React$useState2[0],
|
83
|
+
setSwiperInstance = _React$useState2[1];
|
90
84
|
var _React$useState3 = React.useState(0),
|
91
|
-
|
92
|
-
|
93
|
-
|
94
|
-
|
85
|
+
_React$useState4 = _slicedToArray(_React$useState3, 2),
|
86
|
+
slideIndex = _React$useState4[0],
|
87
|
+
setSlideIndex = _React$useState4[1];
|
95
88
|
var isMobileReversed = elementOrder === 'reversed';
|
96
89
|
var getSwiperInstance = React.useCallback(function (swiper) {
|
97
90
|
setSwiperInstance(swiper);
|
@@ -101,7 +94,6 @@ var Instructions = function Instructions(_ref) {
|
|
101
94
|
if (articleIndex !== activeIndex) {
|
102
95
|
return undefined;
|
103
96
|
}
|
104
|
-
|
105
97
|
return activeInstructionItem;
|
106
98
|
}, [activeInstructionItem]);
|
107
99
|
var handleArticleClick = React.useCallback(function (ind) {
|
@@ -118,14 +110,12 @@ var Instructions = function Instructions(_ref) {
|
|
118
110
|
if (!swiperInstance) {
|
119
111
|
return;
|
120
112
|
}
|
121
|
-
|
122
113
|
swiperInstance.slidePrev();
|
123
114
|
}, [swiperInstance]);
|
124
115
|
var handleNextClick = React.useCallback(function () {
|
125
116
|
if (!swiperInstance) {
|
126
117
|
return;
|
127
118
|
}
|
128
|
-
|
129
119
|
swiperInstance.slideNext();
|
130
120
|
}, [swiperInstance]);
|
131
121
|
var renderVideo = React.useCallback(function (mediaUrl, index) {
|
@@ -167,8 +157,8 @@ var Instructions = function Instructions(_ref) {
|
|
167
157
|
className: cn('swiper')
|
168
158
|
}, instructionItems.map(function (_ref3, i) {
|
169
159
|
var mediaUrl = _ref3.mediaUrl,
|
170
|
-
|
171
|
-
|
160
|
+
isVideo = _ref3.isVideo,
|
161
|
+
imageAlt = _ref3.imageAlt;
|
172
162
|
return /*#__PURE__*/React.createElement(SwiperSlide, {
|
173
163
|
className: swiperSlideCn,
|
174
164
|
key: i + mediaUrl
|
@@ -191,7 +181,7 @@ var Instructions = function Instructions(_ref) {
|
|
191
181
|
var renderQrCode = React.useCallback(function () {
|
192
182
|
return /*#__PURE__*/React.createElement(React.Fragment, null, instructionItems.map(function (_ref4, i) {
|
193
183
|
var qrCode = _ref4.qrCode,
|
194
|
-
|
184
|
+
qrCodeText = _ref4.qrCodeText;
|
195
185
|
return slideIndex === i && !!qrCode && /*#__PURE__*/React.createElement(Tile, {
|
196
186
|
className: cn('qr-code'),
|
197
187
|
radius: "rounded",
|
@@ -216,7 +206,6 @@ var Instructions = function Instructions(_ref) {
|
|
216
206
|
if (pictureMask === pictureMaskTypes.NONE) {
|
217
207
|
return renderSlider();
|
218
208
|
}
|
219
|
-
|
220
209
|
return /*#__PURE__*/React.createElement("div", {
|
221
210
|
className: cn('img-wrapper'),
|
222
211
|
"data-testid": "".concat(testIdPrefix, "-img-wrapper")
|
@@ -323,46 +312,4 @@ var Instructions = function Instructions(_ref) {
|
|
323
312
|
})
|
324
313
|
}, !!title && renderTitle('desktop'), !isMobileReversed && renderMobileArticles(), renderDesktopArticles(), text && renderText(), children)))));
|
325
314
|
};
|
326
|
-
|
327
|
-
Instructions.propTypes = {
|
328
|
-
dataAttrs: PropTypes.shape({
|
329
|
-
root: PropTypes.objectOf(PropTypes.string.isRequired),
|
330
|
-
item: PropTypes.objectOf(PropTypes.string.isRequired),
|
331
|
-
image: PropTypes.objectOf(PropTypes.string.isRequired),
|
332
|
-
mobileItemText: PropTypes.objectOf(PropTypes.string.isRequired),
|
333
|
-
wrapper: PropTypes.objectOf(PropTypes.string.isRequired),
|
334
|
-
arrowPrev: PropTypes.objectOf(PropTypes.string.isRequired),
|
335
|
-
arrowNext: PropTypes.objectOf(PropTypes.string.isRequired)
|
336
|
-
}),
|
337
|
-
rootRef: PropTypes.oneOfType([PropTypes.func, PropTypes.oneOfType([PropTypes.shape({
|
338
|
-
current: PropTypes.elementType
|
339
|
-
}), PropTypes.any])]),
|
340
|
-
classes: PropTypes.shape({
|
341
|
-
instructionItem: PropTypes.string,
|
342
|
-
desktopInstructionItem: PropTypes.string,
|
343
|
-
mobileInstructionItem: PropTypes.string,
|
344
|
-
activeInstructionItem: PropTypes.string,
|
345
|
-
desktopItemTitle: PropTypes.string,
|
346
|
-
mobileItemTitle: PropTypes.string,
|
347
|
-
instructionItemImg: PropTypes.string,
|
348
|
-
arrowPrev: PropTypes.string,
|
349
|
-
arrowNext: PropTypes.string
|
350
|
-
}),
|
351
|
-
title: PropTypes.string,
|
352
|
-
additionalText: PropTypes.string,
|
353
|
-
instructionItems: PropTypes.arrayOf(PropTypes.shape({
|
354
|
-
title: PropTypes.oneOfType([PropTypes.string, PropTypes.node, PropTypes.arrayOf(PropTypes.node)]).isRequired,
|
355
|
-
mediaUrl: PropTypes.string.isRequired,
|
356
|
-
isVideo: PropTypes.bool.isRequired,
|
357
|
-
imageAlt: PropTypes.string
|
358
|
-
}).isRequired).isRequired,
|
359
|
-
pictureAlign: PropTypes.oneOf([pictureAlignTypes.LEFT, pictureAlignTypes.RIGHT]),
|
360
|
-
pictureVerticalAlign: PropTypes.oneOf([pictureVerticalAlignTypes.CENTER, pictureVerticalAlignTypes.TOP, pictureVerticalAlignTypes.UNSET]),
|
361
|
-
pictureMask: PropTypes.oneOf([pictureMaskTypes.ANDROID, pictureMaskTypes.ANDROID_CROPPED, pictureMaskTypes.NEW_IPHONE, pictureMaskTypes.WHITE_IPHONE, pictureMaskTypes.BLACK_IPHONE, pictureMaskTypes.LAPTOP, pictureMaskTypes.LAPTOP_NEW, pictureMaskTypes.IPHONE_12, pictureMaskTypes.IPHONE_15, pictureMaskTypes.IPHONE_CROPPED, pictureMaskTypes.NONE]),
|
362
|
-
pictureBackgroundColor: PropTypes.oneOf([pictureBackgroundColorTypes.SPB_SKY_0]),
|
363
|
-
showArrows: PropTypes.bool,
|
364
|
-
arrowsTheme: PropTypes.oneOf([arrowTheme.DARK, arrowTheme.PURPLE]),
|
365
|
-
elementOrder: PropTypes.oneOf([elementOrderTypes.DEFAULT, elementOrderTypes.REVERSED]),
|
366
|
-
getSwiper: PropTypes.func
|
367
|
-
};
|
368
315
|
export default Instructions;
|
@@ -0,0 +1 @@
|
|
1
|
+
h1,h2,h3,h4,h5{margin:0}.mfui-notification-box{display:-webkit-box;display:-ms-flexbox;display:flex}.mfui-notification-box:not(:first-child){margin-top:24px}.mfui-notification-box__notification{max-width:740px}.mfui-notification-box_align_left{-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start}.mfui-notification-box_align_center{-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}
|
@@ -1,13 +1,13 @@
|
|
1
1
|
import * as React from 'react';
|
2
2
|
import { Notification } from '@megafon/ui-core';
|
3
|
-
import './
|
3
|
+
import './NotificationBox.scss';
|
4
4
|
export declare const Align: {
|
5
5
|
readonly LEFT: "left";
|
6
6
|
readonly CENTER: "center";
|
7
7
|
};
|
8
|
-
|
9
|
-
|
10
|
-
|
8
|
+
type AlignType = (typeof Align)[keyof typeof Align];
|
9
|
+
type NotificationProps = React.ComponentProps<typeof Notification>;
|
10
|
+
type NotificationBoxProps = Omit<NotificationProps, 'isColored'> & {
|
11
11
|
/** Горизонтальное выравнивание */
|
12
12
|
align?: AlignType;
|
13
13
|
};
|
@@ -1,37 +1,27 @@
|
|
1
1
|
import _extends from "@babel/runtime/helpers/extends";
|
2
|
-
import "core-js/modules/es.array.index-of.js";
|
3
2
|
import "core-js/modules/es.symbol.js";
|
4
|
-
import "core-js/modules/es.
|
5
|
-
|
3
|
+
import "core-js/modules/es.array.index-of.js";
|
6
4
|
var __rest = this && this.__rest || function (s, e) {
|
7
5
|
var t = {};
|
8
|
-
|
9
|
-
for (var p in s) {
|
10
|
-
if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
|
11
|
-
}
|
12
|
-
|
6
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
|
13
7
|
if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
14
8
|
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
|
15
9
|
}
|
16
10
|
return t;
|
17
11
|
};
|
18
|
-
|
19
12
|
import * as React from 'react';
|
20
13
|
import { Notification } from '@megafon/ui-core';
|
21
14
|
import { cnCreate } from '@megafon/ui-helpers';
|
22
|
-
import
|
23
|
-
import "./style/NotificationBox.css";
|
15
|
+
import "./NotificationBox.css";
|
24
16
|
export var Align = {
|
25
17
|
LEFT: 'left',
|
26
18
|
CENTER: 'center'
|
27
19
|
};
|
28
20
|
var cn = cnCreate('mfui-notification-box');
|
29
|
-
|
30
21
|
var NotificationBox = function NotificationBox(_a) {
|
31
22
|
var _a$align = _a.align,
|
32
|
-
|
33
|
-
|
34
|
-
|
23
|
+
align = _a$align === void 0 ? 'left' : _a$align,
|
24
|
+
restProps = __rest(_a, ["align"]);
|
35
25
|
return /*#__PURE__*/React.createElement("div", {
|
36
26
|
className: cn({
|
37
27
|
align: align
|
@@ -42,8 +32,4 @@ var NotificationBox = function NotificationBox(_a) {
|
|
42
32
|
isColored: false
|
43
33
|
}))));
|
44
34
|
};
|
45
|
-
|
46
|
-
NotificationBox.propTypes = {
|
47
|
-
align: PropTypes.oneOf(Object.values(Align))
|
48
|
-
};
|
49
35
|
export default NotificationBox;
|
@@ -1,80 +1 @@
|
|
1
|
-
h1,
|
2
|
-
h2,
|
3
|
-
h3,
|
4
|
-
h4,
|
5
|
-
h5 {
|
6
|
-
margin: 0;
|
7
|
-
}
|
8
|
-
.mfui-page-title {
|
9
|
-
display: inline-block;
|
10
|
-
width: 100%;
|
11
|
-
}
|
12
|
-
.mfui-page-title__breadcrumbs {
|
13
|
-
margin-top: 32px;
|
14
|
-
}
|
15
|
-
@media screen and (max-width: 767px) {
|
16
|
-
.mfui-page-title__breadcrumbs {
|
17
|
-
display: none;
|
18
|
-
}
|
19
|
-
}
|
20
|
-
.mfui-page-title__title {
|
21
|
-
margin-top: 110px;
|
22
|
-
}
|
23
|
-
@media screen and (min-width: 1024px) and (max-width: 1279px) {
|
24
|
-
.mfui-page-title__title {
|
25
|
-
margin-top: 100px;
|
26
|
-
}
|
27
|
-
}
|
28
|
-
@media screen and (min-width: 768px) and (max-width: 1023px) {
|
29
|
-
.mfui-page-title__title {
|
30
|
-
margin-top: 90px;
|
31
|
-
}
|
32
|
-
}
|
33
|
-
@media screen and (max-width: 767px) {
|
34
|
-
.mfui-page-title__title {
|
35
|
-
margin-top: 45px;
|
36
|
-
}
|
37
|
-
}
|
38
|
-
.mfui-page-title__badge {
|
39
|
-
font-size: 12px;
|
40
|
-
line-height: 18px;
|
41
|
-
display: inline-block;
|
42
|
-
margin-top: 16px;
|
43
|
-
padding: 2px 14px;
|
44
|
-
color: var(--stcWhite);
|
45
|
-
font-weight: 500;
|
46
|
-
background-color: var(--brandPurple);
|
47
|
-
}
|
48
|
-
@media screen and (min-width: 1280px) {
|
49
|
-
.mfui-page-title__badge_under-breadcrumbs {
|
50
|
-
margin-top: 32px;
|
51
|
-
}
|
52
|
-
}
|
53
|
-
@media screen and (min-width: 1024px) and (max-width: 1279px) {
|
54
|
-
.mfui-page-title__badge_under-breadcrumbs {
|
55
|
-
margin-top: 24px;
|
56
|
-
}
|
57
|
-
}
|
58
|
-
@media screen and (min-width: 768px) and (max-width: 1023px) {
|
59
|
-
.mfui-page-title__badge_under-breadcrumbs {
|
60
|
-
margin-top: 16px;
|
61
|
-
}
|
62
|
-
}
|
63
|
-
@media screen and (min-width: 1280px) {
|
64
|
-
.mfui-page-title__title_under-breadcrumbs {
|
65
|
-
margin-top: 60px;
|
66
|
-
}
|
67
|
-
}
|
68
|
-
@media screen and (min-width: 1024px) and (max-width: 1279px) {
|
69
|
-
.mfui-page-title__title_under-breadcrumbs {
|
70
|
-
margin-top: 50px;
|
71
|
-
}
|
72
|
-
}
|
73
|
-
@media screen and (min-width: 768px) and (max-width: 1023px) {
|
74
|
-
.mfui-page-title__title_under-breadcrumbs {
|
75
|
-
margin-top: 45px;
|
76
|
-
}
|
77
|
-
}
|
78
|
-
.mfui-page-title__badge + .mfui-page-title__title {
|
79
|
-
margin-top: 8px;
|
80
|
-
}
|
1
|
+
h1,h2,h3,h4,h5{margin:0}.mfui-page-title{display:inline-block;width:100%}.mfui-page-title__breadcrumbs{margin-top:32px}@media screen and (max-width:767px){.mfui-page-title__breadcrumbs{display:none}}.mfui-page-title__title{margin-top:110px}@media screen and (min-width:1024px) and (max-width:1279px){.mfui-page-title__title{margin-top:100px}}@media screen and (min-width:768px) and (max-width:1023px){.mfui-page-title__title{margin-top:90px}}@media screen and (max-width:767px){.mfui-page-title__title{margin-top:45px}}.mfui-page-title__badge{background-color:var(--brandPurple);color:var(--stcWhite);display:inline-block;font-size:12px;font-weight:500;line-height:18px;margin-top:16px;padding:2px 14px}@media screen and (min-width:1280px){.mfui-page-title__badge_under-breadcrumbs{margin-top:32px}}@media screen and (min-width:1024px) and (max-width:1279px){.mfui-page-title__badge_under-breadcrumbs{margin-top:24px}}@media screen and (min-width:768px) and (max-width:1023px){.mfui-page-title__badge_under-breadcrumbs{margin-top:16px}}@media screen and (min-width:1280px){.mfui-page-title__title_under-breadcrumbs{margin-top:60px}}@media screen and (min-width:1024px) and (max-width:1279px){.mfui-page-title__title_under-breadcrumbs{margin-top:50px}}@media screen and (min-width:768px) and (max-width:1023px){.mfui-page-title__title_under-breadcrumbs{margin-top:45px}}.mfui-page-title__badge+.mfui-page-title__title{margin-top:8px}
|
@@ -1,7 +1,7 @@
|
|
1
1
|
import * as React from 'react';
|
2
|
-
import './PageTitle.less';
|
3
2
|
import { Props as BreadcrumbsType } from '../Breadcrumbs/Breadcrumbs';
|
4
|
-
|
3
|
+
import './PageTitle.scss';
|
4
|
+
export type PageTitleProps = {
|
5
5
|
/** Дополнительные data атрибуты к внутренним элементам */
|
6
6
|
dataAttrs?: {
|
7
7
|
root?: Record<string, string>;
|
@@ -2,25 +2,23 @@ import _extends from "@babel/runtime/helpers/extends";
|
|
2
2
|
import * as React from 'react';
|
3
3
|
import { Header, Grid, GridColumn } from '@megafon/ui-core';
|
4
4
|
import { cnCreate, filterDataAttrs } from '@megafon/ui-helpers';
|
5
|
-
import PropTypes from 'prop-types';
|
6
|
-
import "./PageTitle.css";
|
7
5
|
import Breadcrumbs from "../Breadcrumbs/Breadcrumbs";
|
6
|
+
import "./PageTitle.css";
|
8
7
|
var testIdPrefix = 'PageTitle';
|
9
8
|
var cn = cnCreate('mfui-page-title');
|
10
|
-
|
11
9
|
var PageTitle = function PageTitle(_ref) {
|
12
10
|
var dataAttrs = _ref.dataAttrs,
|
13
|
-
|
14
|
-
|
15
|
-
|
16
|
-
|
17
|
-
|
18
|
-
|
19
|
-
|
20
|
-
|
21
|
-
|
22
|
-
|
23
|
-
|
11
|
+
title = _ref.title,
|
12
|
+
breadcrumbs = _ref.breadcrumbs,
|
13
|
+
badge = _ref.badge,
|
14
|
+
_ref$isFullWidth = _ref.isFullWidth,
|
15
|
+
isFullWidth = _ref$isFullWidth === void 0 ? true : _ref$isFullWidth,
|
16
|
+
_ref$hasBreadcrumbsMi = _ref.hasBreadcrumbsMicrodata,
|
17
|
+
hasBreadcrumbsMicrodata = _ref$hasBreadcrumbsMi === void 0 ? false : _ref$hasBreadcrumbsMi,
|
18
|
+
className = _ref.className,
|
19
|
+
_ref$classes = _ref.classes,
|
20
|
+
classes = _ref$classes === void 0 ? {} : _ref$classes,
|
21
|
+
rootRef = _ref.rootRef;
|
24
22
|
var isBreadcrumbs = !!(breadcrumbs === null || breadcrumbs === void 0 ? void 0 : breadcrumbs.length);
|
25
23
|
var renderPageTitle = React.useCallback(function () {
|
26
24
|
return /*#__PURE__*/React.createElement(React.Fragment, null, badge && /*#__PURE__*/React.createElement("div", {
|
@@ -61,27 +59,4 @@ var PageTitle = function PageTitle(_ref) {
|
|
61
59
|
className: cn('breadcrumbs', [classes.breadcrumbs])
|
62
60
|
}), isFullWidth ? renderPageTitle() : renderPageTitleWithGrid());
|
63
61
|
};
|
64
|
-
|
65
|
-
PageTitle.propTypes = {
|
66
|
-
dataAttrs: PropTypes.shape({
|
67
|
-
root: PropTypes.objectOf(PropTypes.string.isRequired),
|
68
|
-
breadcrumbs: PropTypes.objectOf(PropTypes.string.isRequired),
|
69
|
-
breadcrumbsLink: PropTypes.objectOf(PropTypes.string.isRequired)
|
70
|
-
}),
|
71
|
-
title: PropTypes.oneOfType([PropTypes.string, PropTypes.node, PropTypes.arrayOf(PropTypes.node)]).isRequired,
|
72
|
-
breadcrumbs: PropTypes.arrayOf(PropTypes.shape({
|
73
|
-
title: PropTypes.string.isRequired,
|
74
|
-
href: PropTypes.string
|
75
|
-
}).isRequired),
|
76
|
-
badge: PropTypes.string,
|
77
|
-
isFullWidth: PropTypes.bool,
|
78
|
-
hasBreadcrumbsMicrodata: PropTypes.bool,
|
79
|
-
className: PropTypes.string,
|
80
|
-
classes: PropTypes.shape({
|
81
|
-
breadcrumbs: PropTypes.string
|
82
|
-
}),
|
83
|
-
rootRef: PropTypes.oneOfType([PropTypes.func, PropTypes.oneOfType([PropTypes.shape({
|
84
|
-
current: PropTypes.elementType
|
85
|
-
}), PropTypes.any])])
|
86
|
-
};
|
87
62
|
export default PageTitle;
|
@@ -1,53 +1 @@
|
|
1
|
-
h1,
|
2
|
-
h2,
|
3
|
-
h3,
|
4
|
-
h4,
|
5
|
-
h5 {
|
6
|
-
margin: 0;
|
7
|
-
}
|
8
|
-
.mfui-partners__tile:not(:last-child) {
|
9
|
-
margin-bottom: 20px;
|
10
|
-
}
|
11
|
-
@media screen and (max-width: 767px) {
|
12
|
-
.mfui-partners__tile:not(:last-child) {
|
13
|
-
margin-bottom: 16px;
|
14
|
-
}
|
15
|
-
}
|
16
|
-
.mfui-partners__tile-inner {
|
17
|
-
-webkit-box-sizing: border-box;
|
18
|
-
box-sizing: border-box;
|
19
|
-
height: 132px;
|
20
|
-
padding: 28px 48px;
|
21
|
-
}
|
22
|
-
@media screen and (min-width: 1024px) and (max-width: 1279px) {
|
23
|
-
.mfui-partners__tile-inner {
|
24
|
-
height: 104px;
|
25
|
-
padding: 22px 37px;
|
26
|
-
}
|
27
|
-
}
|
28
|
-
@media screen and (min-width: 768px) and (max-width: 1023px) {
|
29
|
-
.mfui-partners__tile-inner {
|
30
|
-
height: 77px;
|
31
|
-
padding: 10px;
|
32
|
-
}
|
33
|
-
}
|
34
|
-
@media screen and (max-width: 767px) {
|
35
|
-
.mfui-partners__tile-inner {
|
36
|
-
height: 60px;
|
37
|
-
padding: 8px;
|
38
|
-
}
|
39
|
-
}
|
40
|
-
.mfui-partners__img-wrapper {
|
41
|
-
position: relative;
|
42
|
-
width: 100%;
|
43
|
-
height: 100%;
|
44
|
-
}
|
45
|
-
.mfui-partners__tile-img {
|
46
|
-
position: absolute;
|
47
|
-
top: 50%;
|
48
|
-
left: 50%;
|
49
|
-
max-width: 100%;
|
50
|
-
max-height: 100%;
|
51
|
-
-webkit-transform: translate(-50%, -50%);
|
52
|
-
transform: translate(-50%, -50%);
|
53
|
-
}
|
1
|
+
h1,h2,h3,h4,h5{margin:0}.mfui-partners__tile:not(:last-child){margin-bottom:20px}@media screen and (max-width:767px){.mfui-partners__tile:not(:last-child){margin-bottom:16px}}.mfui-partners__tile-inner{-webkit-box-sizing:border-box;box-sizing:border-box;height:132px;padding:28px 48px}@media screen and (min-width:1024px) and (max-width:1279px){.mfui-partners__tile-inner{height:104px;padding:22px 37px}}@media screen and (min-width:768px) and (max-width:1023px){.mfui-partners__tile-inner{height:77px;padding:10px}}@media screen and (max-width:767px){.mfui-partners__tile-inner{height:60px;padding:8px}}.mfui-partners__img-wrapper{height:100%;position:relative;width:100%}.mfui-partners__tile-img{left:50%;max-height:100%;max-width:100%;position:absolute;top:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%)}
|
@@ -1,52 +1,45 @@
|
|
1
1
|
import _extends from "@babel/runtime/helpers/extends";
|
2
2
|
import _defineProperty from "@babel/runtime/helpers/defineProperty";
|
3
|
-
|
4
|
-
var _slidesSettings;
|
5
|
-
|
6
3
|
import "core-js/modules/es.array.map.js";
|
7
4
|
import "core-js/modules/es.array.slice.js";
|
8
5
|
import * as React from 'react';
|
9
6
|
import { Grid, GridColumn, Tile, Carousel } from '@megafon/ui-core';
|
10
7
|
import { breakpoints, cnCreate, filterDataAttrs } from '@megafon/ui-helpers';
|
11
|
-
import * as PropTypes from 'prop-types';
|
12
8
|
import "./Partners.css";
|
13
9
|
var MAX_GRID_ITEMS_LENGTH = 8;
|
14
|
-
var slidesSettings = (
|
10
|
+
var slidesSettings = _defineProperty(_defineProperty(_defineProperty({}, breakpoints.MOBILE_SMALL_START, {
|
15
11
|
slidesPerView: 2,
|
16
12
|
spaceBetween: 16
|
17
|
-
}),
|
13
|
+
}), breakpoints.MOBILE_MIDDLE_START, {
|
18
14
|
slidesPerView: 3,
|
19
15
|
spaceBetween: 20
|
20
|
-
}),
|
16
|
+
}), breakpoints.DESKTOP_SMALL_START, {
|
21
17
|
slidesPerView: 4,
|
22
18
|
spaceBetween: 20
|
23
|
-
})
|
19
|
+
});
|
24
20
|
var testIdPrefix = 'Partners';
|
25
21
|
var cn = cnCreate('mfui-partners');
|
26
|
-
|
27
22
|
var Partners = function Partners(_ref) {
|
28
23
|
var rootRef = _ref.rootRef,
|
29
|
-
|
30
|
-
|
31
|
-
|
32
|
-
|
33
|
-
|
34
|
-
|
35
|
-
|
36
|
-
|
37
|
-
|
38
|
-
|
24
|
+
_ref$classes = _ref.classes,
|
25
|
+
_ref$classes2 = _ref$classes === void 0 ? {} : _ref$classes,
|
26
|
+
root = _ref$classes2.root,
|
27
|
+
itemClass = _ref$classes2.itemClass,
|
28
|
+
dataAttrs = _ref.dataAttrs,
|
29
|
+
className = _ref.className,
|
30
|
+
items = _ref.items,
|
31
|
+
onChange = _ref.onChange,
|
32
|
+
onNextClick = _ref.onNextClick,
|
33
|
+
onPrevClick = _ref.onPrevClick;
|
39
34
|
var renderItem = React.useCallback(function (item) {
|
40
35
|
var index = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
|
41
|
-
|
42
36
|
if (!item) {
|
43
37
|
return null;
|
44
38
|
}
|
45
|
-
|
46
39
|
var src = item.src,
|
47
|
-
|
48
|
-
|
49
|
-
|
40
|
+
href = item.href,
|
41
|
+
alt = item.alt,
|
42
|
+
rel = item.rel;
|
50
43
|
return /*#__PURE__*/React.createElement(Tile, {
|
51
44
|
href: href,
|
52
45
|
rel: rel,
|
@@ -108,28 +101,4 @@ var Partners = function Partners(_ref) {
|
|
108
101
|
className: cn([root, className])
|
109
102
|
}, filterDataAttrs(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.root)), items.length > MAX_GRID_ITEMS_LENGTH ? renderCarousel() : renderGrid());
|
110
103
|
};
|
111
|
-
|
112
|
-
Partners.propTypes = {
|
113
|
-
rootRef: PropTypes.oneOfType([PropTypes.func, PropTypes.oneOfType([PropTypes.shape({
|
114
|
-
current: PropTypes.elementType
|
115
|
-
}), PropTypes.any])]),
|
116
|
-
classes: PropTypes.shape({
|
117
|
-
root: PropTypes.string,
|
118
|
-
itemClass: PropTypes.string
|
119
|
-
}),
|
120
|
-
dataAttrs: PropTypes.shape({
|
121
|
-
root: PropTypes.objectOf(PropTypes.string.isRequired),
|
122
|
-
item: PropTypes.objectOf(PropTypes.string.isRequired)
|
123
|
-
}),
|
124
|
-
className: PropTypes.string,
|
125
|
-
items: PropTypes.arrayOf(PropTypes.shape({
|
126
|
-
href: PropTypes.string,
|
127
|
-
rel: PropTypes.string,
|
128
|
-
src: PropTypes.string.isRequired,
|
129
|
-
alt: PropTypes.string.isRequired
|
130
|
-
}).isRequired).isRequired,
|
131
|
-
onChange: PropTypes.func,
|
132
|
-
onNextClick: PropTypes.func,
|
133
|
-
onPrevClick: PropTypes.func
|
134
|
-
};
|
135
104
|
export default Partners;
|