@megafon/ui-shared 4.9.1 → 4.11.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 (12) hide show
  1. package/CHANGELOG.md +22 -0
  2. package/dist/es/components/CardsBox/CardsBox.d.ts +2 -0
  3. package/dist/es/components/CardsBox/CardsBox.js +6 -3
  4. package/dist/es/components/VideoBlock/VideoBlock.css +4 -0
  5. package/dist/es/components/VideoBlock/VideoBlock.d.ts +2 -0
  6. package/dist/es/components/VideoBlock/VideoBlock.js +9 -4
  7. package/dist/lib/components/CardsBox/CardsBox.d.ts +2 -0
  8. package/dist/lib/components/CardsBox/CardsBox.js +6 -3
  9. package/dist/lib/components/VideoBlock/VideoBlock.css +4 -0
  10. package/dist/lib/components/VideoBlock/VideoBlock.d.ts +2 -0
  11. package/dist/lib/components/VideoBlock/VideoBlock.js +9 -4
  12. package/package.json +3 -3
package/CHANGELOG.md CHANGED
@@ -3,6 +3,28 @@
3
3
  All notable changes to this project will be documented in this file.
4
4
  See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
5
5
 
6
+ # [4.11.0](https://github.com/MegafonWebLab/megafon-ui/compare/@megafon/ui-shared@4.10.0...@megafon/ui-shared@4.11.0) (2023-01-31)
7
+
8
+
9
+ ### Features
10
+
11
+ * **cardsbox:** add prop hGridAlign ([883d12b](https://github.com/MegafonWebLab/megafon-ui/commit/883d12b3447659787d8aa3f61e734e8cb1b03656))
12
+
13
+
14
+
15
+
16
+
17
+ # [4.10.0](https://github.com/MegafonWebLab/megafon-ui/compare/@megafon/ui-shared@4.9.1...@megafon/ui-shared@4.10.0) (2023-01-23)
18
+
19
+
20
+ ### Features
21
+
22
+ * **videoblock:** add props fixWhiteVideoBackground ([0bd622a](https://github.com/MegafonWebLab/megafon-ui/commit/0bd622af335fff8f6ee43fb53cdc9d162ef906c6))
23
+
24
+
25
+
26
+
27
+
6
28
  ## [4.9.1](https://github.com/MegafonWebLab/megafon-ui/compare/@megafon/ui-shared@4.9.0...@megafon/ui-shared@4.9.1) (2023-01-17)
7
29
 
8
30
  **Note:** Version bump only for package @megafon/ui-shared
package/dist/es/components/CardsBox/CardsBox.d.ts CHANGED
@@ -1,6 +1,8 @@
1
1
  import * as React from 'react';
2
2
  import { ICard } from '../Card/Card';
3
3
  interface ICardsBoxProps {
4
+ /** Выравнивание всех колонок компонента Grid по горизонтали */
5
+ gridHAlign?: 'left' | 'right' | 'center' | 'between' | 'around';
4
6
  /** Ссылка на корневой элемент */
5
7
  rootRef?: React.Ref<HTMLDivElement>;
6
8
  /** Дата атрибуты для корневого элемента */
package/dist/es/components/CardsBox/CardsBox.js CHANGED
@@ -22,7 +22,8 @@ var SlidesSettings = (_SlidesSettings = {}, _defineProperty(_SlidesSettings, bre
22
22
  var cn = cnCreate('mfui-cards-box');
23
23
 
24
24
  var CardsBox = function CardsBox(_ref) {
25
- var rootRef = _ref.rootRef,
25
+ var gridHAlign = _ref.gridHAlign,
26
+ rootRef = _ref.rootRef,
26
27
  dataAttrs = _ref.dataAttrs,
27
28
  onChange = _ref.onChange,
28
29
  children = _ref.children;
@@ -37,14 +38,15 @@ var CardsBox = function CardsBox(_ref) {
37
38
  var renderGrid = React.useCallback(function () {
38
39
  return /*#__PURE__*/React.createElement(Grid, {
39
40
  guttersBottom: "medium",
40
- guttersLeft: "medium"
41
+ guttersLeft: "medium",
42
+ hAlign: gridHAlign
41
43
  }, React.Children.map(children, function (child) {
42
44
  return /*#__PURE__*/React.createElement(GridColumn, {
43
45
  all: "4",
44
46
  mobile: "12"
45
47
  }, child);
46
48
  }));
47
- }, [children]);
49
+ }, [children, gridHAlign]);
48
50
  var renderCarousel = React.useCallback(function () {
49
51
  return /*#__PURE__*/React.createElement(Carousel, {
50
52
  slidesSettings: SlidesSettings,
@@ -70,6 +72,7 @@ var CardsBox = function CardsBox(_ref) {
70
72
  };
71
73
 
72
74
  CardsBox.propTypes = {
75
+ gridHAlign: PropTypes.oneOf(['left', 'right', 'center', 'between', 'around']),
73
76
  rootRef: PropTypes.oneOfType([PropTypes.func, PropTypes.oneOfType([PropTypes.shape({
74
77
  current: PropTypes.elementType
75
78
  }), PropTypes.any])]),
package/dist/es/components/VideoBlock/VideoBlock.css CHANGED
@@ -78,6 +78,10 @@ h5 {
78
78
  -o-object-fit: contain;
79
79
  object-fit: contain;
80
80
  }
81
+ .mfui-video-block__video_fix-background {
82
+ -webkit-filter: brightness(108.5%);
83
+ filter: brightness(108.5%);
84
+ }
81
85
  .mfui-video-block__youtube {
82
86
  position: relative;
83
87
  padding-bottom: 56.25%;
package/dist/es/components/VideoBlock/VideoBlock.d.ts CHANGED
@@ -51,6 +51,8 @@ export interface IVideoBlockProps {
51
51
  contentPositionRight?: boolean;
52
52
  /** Воспроизводит видео на iOS устройствах без перехода в полноэкранный режим */
53
53
  playsinline?: boolean;
54
+ /** Фикс для белого фона */
55
+ fixWhiteVideoBackground?: boolean;
54
56
  }
55
57
  declare const VideoBlock: React.FC<IVideoBlockProps>;
56
58
  export default VideoBlock;
package/dist/es/components/VideoBlock/VideoBlock.js CHANGED
@@ -32,7 +32,9 @@ var VideoBlock = function VideoBlock(_ref) {
32
32
  contentPositionRight = _ref$contentPositionR === void 0 ? false : _ref$contentPositionR,
33
33
  poster = _ref.poster,
34
34
  _ref$playsinline = _ref.playsinline,
35
- playsinline = _ref$playsinline === void 0 ? false : _ref$playsinline;
35
+ playsinline = _ref$playsinline === void 0 ? false : _ref$playsinline,
36
+ _ref$fixWhiteVideoBac = _ref.fixWhiteVideoBackground,
37
+ fixWhiteVideoBackground = _ref$fixWhiteVideoBac === void 0 ? false : _ref$fixWhiteVideoBac;
36
38
  var renderVideo = React.useCallback(function () {
37
39
  switch (videoType) {
38
40
  case VideoTypes.YOUTUBE:
@@ -68,7 +70,9 @@ var VideoBlock = function VideoBlock(_ref) {
68
70
  /*#__PURE__*/
69
71
  // eslint-disable-next-line jsx-a11y/media-has-caption
70
72
  React.createElement("video", {
71
- className: cn('video'),
73
+ className: cn('video', {
74
+ 'fix-background': fixWhiteVideoBackground
75
+ }),
72
76
  autoPlay: isAutoplay,
73
77
  muted: isMuted,
74
78
  controls: !isAutoplay,
@@ -87,7 +91,7 @@ var VideoBlock = function VideoBlock(_ref) {
87
91
  return null;
88
92
  }
89
93
  }
90
- }, [videoType, videoSrc, isAutoplay, isMuted, poster, playsinline]);
94
+ }, [videoType, videoSrc, isAutoplay, isMuted, poster, playsinline, fixWhiteVideoBackground]);
91
95
  var renderContent = React.useCallback(function (_ref2) {
92
96
  var title = _ref2.title,
93
97
  description = _ref2.description,
@@ -180,6 +184,7 @@ VideoBlock.propTypes = {
180
184
  isAutoplay: PropTypes.bool,
181
185
  poster: PropTypes.string,
182
186
  playsinline: PropTypes.bool,
183
- contentPositionRight: PropTypes.bool
187
+ contentPositionRight: PropTypes.bool,
188
+ fixWhiteVideoBackground: PropTypes.bool
184
189
  };
185
190
  export default VideoBlock;
package/dist/lib/components/CardsBox/CardsBox.d.ts CHANGED
@@ -1,6 +1,8 @@
1
1
  import * as React from 'react';
2
2
  import { ICard } from '../Card/Card';
3
3
  interface ICardsBoxProps {
4
+ /** Выравнивание всех колонок компонента Grid по горизонтали */
5
+ gridHAlign?: 'left' | 'right' | 'center' | 'between' | 'around';
4
6
  /** Ссылка на корневой элемент */
5
7
  rootRef?: React.Ref<HTMLDivElement>;
6
8
  /** Дата атрибуты для корневого элемента */
package/dist/lib/components/CardsBox/CardsBox.js CHANGED
@@ -46,7 +46,8 @@ var SlidesSettings = (_SlidesSettings = {}, (0, _defineProperty2["default"])(_Sl
46
46
  var cn = (0, _uiHelpers.cnCreate)('mfui-cards-box');
47
47
 
48
48
  var CardsBox = function CardsBox(_ref) {
49
- var rootRef = _ref.rootRef,
49
+ var gridHAlign = _ref.gridHAlign,
50
+ rootRef = _ref.rootRef,
50
51
  dataAttrs = _ref.dataAttrs,
51
52
  onChange = _ref.onChange,
52
53
  children = _ref.children;
@@ -61,14 +62,15 @@ var CardsBox = function CardsBox(_ref) {
61
62
  var renderGrid = React.useCallback(function () {
62
63
  return /*#__PURE__*/React.createElement(_uiCore.Grid, {
63
64
  guttersBottom: "medium",
64
- guttersLeft: "medium"
65
+ guttersLeft: "medium",
66
+ hAlign: gridHAlign
65
67
  }, React.Children.map(children, function (child) {
66
68
  return /*#__PURE__*/React.createElement(_uiCore.GridColumn, {
67
69
  all: "4",
68
70
  mobile: "12"
69
71
  }, child);
70
72
  }));
71
- }, [children]);
73
+ }, [children, gridHAlign]);
72
74
  var renderCarousel = React.useCallback(function () {
73
75
  return /*#__PURE__*/React.createElement(_uiCore.Carousel, {
74
76
  slidesSettings: SlidesSettings,
@@ -94,6 +96,7 @@ var CardsBox = function CardsBox(_ref) {
94
96
  };
95
97
 
96
98
  CardsBox.propTypes = {
99
+ gridHAlign: PropTypes.oneOf(['left', 'right', 'center', 'between', 'around']),
97
100
  rootRef: PropTypes.oneOfType([PropTypes.func, PropTypes.oneOfType([PropTypes.shape({
98
101
  current: PropTypes.elementType
99
102
  }), PropTypes.any])]),
package/dist/lib/components/VideoBlock/VideoBlock.css CHANGED
@@ -78,6 +78,10 @@ h5 {
78
78
  -o-object-fit: contain;
79
79
  object-fit: contain;
80
80
  }
81
+ .mfui-video-block__video_fix-background {
82
+ -webkit-filter: brightness(108.5%);
83
+ filter: brightness(108.5%);
84
+ }
81
85
  .mfui-video-block__youtube {
82
86
  position: relative;
83
87
  padding-bottom: 56.25%;
package/dist/lib/components/VideoBlock/VideoBlock.d.ts CHANGED
@@ -51,6 +51,8 @@ export interface IVideoBlockProps {
51
51
  contentPositionRight?: boolean;
52
52
  /** Воспроизводит видео на iOS устройствах без перехода в полноэкранный режим */
53
53
  playsinline?: boolean;
54
+ /** Фикс для белого фона */
55
+ fixWhiteVideoBackground?: boolean;
54
56
  }
55
57
  declare const VideoBlock: React.FC<IVideoBlockProps>;
56
58
  export default VideoBlock;
package/dist/lib/components/VideoBlock/VideoBlock.js CHANGED
@@ -50,7 +50,9 @@ var VideoBlock = function VideoBlock(_ref) {
50
50
  contentPositionRight = _ref$contentPositionR === void 0 ? false : _ref$contentPositionR,
51
51
  poster = _ref.poster,
52
52
  _ref$playsinline = _ref.playsinline,
53
- playsinline = _ref$playsinline === void 0 ? false : _ref$playsinline;
53
+ playsinline = _ref$playsinline === void 0 ? false : _ref$playsinline,
54
+ _ref$fixWhiteVideoBac = _ref.fixWhiteVideoBackground,
55
+ fixWhiteVideoBackground = _ref$fixWhiteVideoBac === void 0 ? false : _ref$fixWhiteVideoBac;
54
56
 
55
57
  var renderVideo = _react["default"].useCallback(function () {
56
58
  switch (videoType) {
@@ -87,7 +89,9 @@ var VideoBlock = function VideoBlock(_ref) {
87
89
  /*#__PURE__*/
88
90
  // eslint-disable-next-line jsx-a11y/media-has-caption
89
91
  _react["default"].createElement("video", {
90
- className: cn('video'),
92
+ className: cn('video', {
93
+ 'fix-background': fixWhiteVideoBackground
94
+ }),
91
95
  autoPlay: isAutoplay,
92
96
  muted: isMuted,
93
97
  controls: !isAutoplay,
@@ -106,7 +110,7 @@ var VideoBlock = function VideoBlock(_ref) {
106
110
  return null;
107
111
  }
108
112
  }
109
- }, [videoType, videoSrc, isAutoplay, isMuted, poster, playsinline]);
113
+ }, [videoType, videoSrc, isAutoplay, isMuted, poster, playsinline, fixWhiteVideoBackground]);
110
114
 
111
115
  var renderContent = _react["default"].useCallback(function (_ref2) {
112
116
  var title = _ref2.title,
@@ -202,7 +206,8 @@ VideoBlock.propTypes = {
202
206
  isAutoplay: _propTypes["default"].bool,
203
207
  poster: _propTypes["default"].string,
204
208
  playsinline: _propTypes["default"].bool,
205
- contentPositionRight: _propTypes["default"].bool
209
+ contentPositionRight: _propTypes["default"].bool,
210
+ fixWhiteVideoBackground: _propTypes["default"].bool
206
211
  };
207
212
  var _default = VideoBlock;
208
213
  exports["default"] = _default;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@megafon/ui-shared",
3
- "version": "4.9.1",
3
+ "version": "4.11.0",
4
4
  "files": [
5
5
  "dist"
6
6
  ],
@@ -85,7 +85,7 @@
85
85
  },
86
86
  "dependencies": {
87
87
  "@babel/runtime": "^7.8.4",
88
- "@megafon/ui-core": "^4.11.1",
88
+ "@megafon/ui-core": "^4.11.3",
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": "01078516ff26b9bfc237633d30d5a4827cda1dc2"
96
+ "gitHead": "9def04b4abf47ad1bc0cfd3bb0430851b56b60ee"
97
97
  }