@megafon/ui-core 8.11.1 → 8.12.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 (5) hide show
  1. package/dist/es/components/Banner/Banner.d.ts +7 -2
  2. package/dist/es/components/Banner/Banner.js +25 -9
  3. package/dist/lib/components/Banner/Banner.d.ts +7 -2
  4. package/dist/lib/components/Banner/Banner.js +26 -10
  5. package/package.json +2 -2
package/dist/es/components/Banner/Banner.d.ts CHANGED
@@ -21,6 +21,11 @@ export declare const NavTheme: {
21
21
  readonly DARK: "dark";
22
22
  };
23
23
  type NavThemeType = (typeof NavTheme)[keyof typeof NavTheme];
24
+ export declare const PaginationAlign: {
25
+ readonly CENTER: "center";
26
+ readonly LEFT: "left";
27
+ };
28
+ export type PaginationAlignType = (typeof PaginationAlign)[keyof typeof PaginationAlign];
24
29
  export declare const PaginationTheme: {
25
30
  readonly DEFAULT: "default";
26
31
  readonly LIGHT: "light";
@@ -63,8 +68,8 @@ export interface IBannerProps {
63
68
  dotSvg?: Record<string, string>;
64
69
  dotInner?: Record<string, string>;
65
70
  };
66
- /** Выравнивание блока пагинации */
67
- paginationAlign?: 'center' | 'left';
71
+ /** Выравнивание блока пагинации. DEPRECATED: 'left' */
72
+ paginationAlign?: PaginationAlignType;
68
73
  /** Цветовая тема пагинации */
69
74
  paginationTheme?: PaginationThemeType;
70
75
  /** Тип кнопок пагинации */
package/dist/es/components/Banner/Banner.js CHANGED
@@ -22,7 +22,7 @@ try {
22
22
  Autoplay = Modules.Autoplay;
23
23
  } catch (e) {
24
24
  // eslint-disable-next-line no-console
25
- console.warn("\n WARNING: megafon/ui-core is using the latest version of swiper. \n For more information about server-side rendering\n please check the Banner component documentation at:\n https://ui.megafon.ru/components/banner\n ");
25
+ console.warn("\n WARNING: megafon/ui-core is using the latest version of swiper.\n For more information about server-side rendering\n please check the Banner component documentation at:\n https://ui.megafon.ru/components/banner\n ");
26
26
  }
27
27
  export var BackgroundColor = {
28
28
  TRANSPARENT: 'transparent',
@@ -40,6 +40,10 @@ export var NavTheme = {
40
40
  LIGHT: 'light',
41
41
  DARK: 'dark'
42
42
  };
43
+ export var PaginationAlign = {
44
+ CENTER: 'center',
45
+ LEFT: 'left'
46
+ };
43
47
  export var PaginationTheme = {
44
48
  DEFAULT: 'default',
45
49
  LIGHT: 'light',
@@ -59,10 +63,9 @@ var Banner = function Banner(_ref) {
59
63
  _ref$classes = _ref.classes,
60
64
  classes = _ref$classes === void 0 ? {} : _ref$classes,
61
65
  dataAttrs = _ref.dataAttrs,
62
- paginationAlign = _ref.paginationAlign,
63
- paginationTheme = _ref.paginationTheme,
66
+ _ref$paginationAlign = _ref.paginationAlign,
67
+ paginationAlign = _ref$paginationAlign === void 0 ? PaginationAlign.CENTER : _ref$paginationAlign,
64
68
  paginationType = _ref.paginationType,
65
- paginationPosition = _ref.paginationPosition,
66
69
  _ref$withPaginationBo = _ref.withPaginationBottomOffset,
67
70
  withPaginationBottomOffset = _ref$withPaginationBo === void 0 ? false : _ref$withPaginationBo,
68
71
  _ref$autoPlay = _ref.autoPlay,
@@ -73,8 +76,7 @@ var Banner = function Banner(_ref) {
73
76
  loop = _ref$loop === void 0 ? false : _ref$loop,
74
77
  _ref$pauseOnHover = _ref.pauseOnHover,
75
78
  pauseOnHover = _ref$pauseOnHover === void 0 ? false : _ref$pauseOnHover,
76
- _ref$backgroundColor = _ref.backgroundColor,
77
- backgroundColor = _ref$backgroundColor === void 0 ? BackgroundColor.TRANSPARENT : _ref$backgroundColor,
79
+ backgroundColor = _ref.backgroundColor,
78
80
  _ref$radius = _ref.radius,
79
81
  radius = _ref$radius === void 0 ? Radius.ROUNDED : _ref$radius,
80
82
  _ref$arrowTheme = _ref.arrowTheme,
@@ -130,6 +132,20 @@ var Banner = function Banner(_ref) {
130
132
  var dotTimerDelay = delay / 1000;
131
133
  var arrowSize = arrowTheme === ArrowTheme.WHITE ? ArrowSize.LARGE : ArrowSize.MIDDLE;
132
134
  var rootRef = React.useRef(null);
135
+ var correctPaginationPosition = paginationType === PaginationButtonType.FLAT ? PaginationPositionType.TOP_IN : PaginationPositionType.BOTTOM_OUT;
136
+ var correctPaginationAlign = paginationType === PaginationButtonType.FLAT ? paginationAlign : PaginationAlign.CENTER;
137
+ var getCorrectPaginationTheme = function getCorrectPaginationTheme() {
138
+ switch (backgroundColor) {
139
+ case BackgroundColor.GREEN:
140
+ case BackgroundColor.PURPLE:
141
+ return PaginationTheme.LIGHT;
142
+ case BackgroundColor.LIGHT:
143
+ case BackgroundColor.GRADIENT:
144
+ return PaginationTheme.DARK;
145
+ default:
146
+ return PaginationTheme.DEFAULT;
147
+ }
148
+ };
133
149
  var increaseAutoplayDelay = React.useCallback(function (_ref2) {
134
150
  var params = _ref2.params,
135
151
  autoplay = _ref2.autoplay;
@@ -249,8 +265,8 @@ var Banner = function Banner(_ref) {
249
265
  var renderPagination = /*#__PURE__*/React.createElement("div", _extends({}, filterDataAttrs(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.pagination), {
250
266
  className: cn('pagination', {
251
267
  type: paginationType,
252
- align: paginationAlign,
253
- position: paginationPosition,
268
+ align: correctPaginationAlign,
269
+ position: correctPaginationPosition,
254
270
  'bottom-offset': withPaginationBottomOffset
255
271
  }, [classes.pagination])
256
272
  }), children && React.Children.map(children, function (_, i) {
@@ -267,7 +283,7 @@ var Banner = function Banner(_ref) {
267
283
  showTimer: showDotTimer,
268
284
  timerDelay: dotTimerDelay,
269
285
  type: paginationType,
270
- theme: paginationTheme,
286
+ theme: getCorrectPaginationTheme(),
271
287
  onClick: handleDotClick
272
288
  });
273
289
  }));
package/dist/lib/components/Banner/Banner.d.ts CHANGED
@@ -21,6 +21,11 @@ export declare const NavTheme: {
21
21
  readonly DARK: "dark";
22
22
  };
23
23
  type NavThemeType = (typeof NavTheme)[keyof typeof NavTheme];
24
+ export declare const PaginationAlign: {
25
+ readonly CENTER: "center";
26
+ readonly LEFT: "left";
27
+ };
28
+ export type PaginationAlignType = (typeof PaginationAlign)[keyof typeof PaginationAlign];
24
29
  export declare const PaginationTheme: {
25
30
  readonly DEFAULT: "default";
26
31
  readonly LIGHT: "light";
@@ -63,8 +68,8 @@ export interface IBannerProps {
63
68
  dotSvg?: Record<string, string>;
64
69
  dotInner?: Record<string, string>;
65
70
  };
66
- /** Выравнивание блока пагинации */
67
- paginationAlign?: 'center' | 'left';
71
+ /** Выравнивание блока пагинации. DEPRECATED: 'left' */
72
+ paginationAlign?: PaginationAlignType;
68
73
  /** Цветовая тема пагинации */
69
74
  paginationTheme?: PaginationThemeType;
70
75
  /** Тип кнопок пагинации */
package/dist/lib/components/Banner/Banner.js CHANGED
@@ -4,7 +4,7 @@ function _typeof3(o) { "@babel/helpers - typeof"; return _typeof3 = "function" =
4
4
  Object.defineProperty(exports, "__esModule", {
5
5
  value: true
6
6
  });
7
- exports["default"] = exports.Radius = exports.PaginationTheme = exports.PaginationPositionType = exports.PaginationButtonType = exports.NavTheme = exports.BackgroundColor = void 0;
7
+ exports["default"] = exports.Radius = exports.PaginationTheme = exports.PaginationPositionType = exports.PaginationButtonType = exports.PaginationAlign = exports.NavTheme = exports.BackgroundColor = void 0;
8
8
  var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
9
9
  var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof"));
10
10
  var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
@@ -32,7 +32,7 @@ try {
32
32
  Autoplay = Modules.Autoplay;
33
33
  } catch (e) {
34
34
  // eslint-disable-next-line no-console
35
- console.warn("\n WARNING: megafon/ui-core is using the latest version of swiper. \n For more information about server-side rendering\n please check the Banner component documentation at:\n https://ui.megafon.ru/components/banner\n ");
35
+ console.warn("\n WARNING: megafon/ui-core is using the latest version of swiper.\n For more information about server-side rendering\n please check the Banner component documentation at:\n https://ui.megafon.ru/components/banner\n ");
36
36
  }
37
37
  var BackgroundColor = exports.BackgroundColor = {
38
38
  TRANSPARENT: 'transparent',
@@ -50,6 +50,10 @@ var NavTheme = exports.NavTheme = {
50
50
  LIGHT: 'light',
51
51
  DARK: 'dark'
52
52
  };
53
+ var PaginationAlign = exports.PaginationAlign = {
54
+ CENTER: 'center',
55
+ LEFT: 'left'
56
+ };
53
57
  var PaginationTheme = exports.PaginationTheme = {
54
58
  DEFAULT: 'default',
55
59
  LIGHT: 'light',
@@ -69,10 +73,9 @@ var Banner = function Banner(_ref) {
69
73
  _ref$classes = _ref.classes,
70
74
  classes = _ref$classes === void 0 ? {} : _ref$classes,
71
75
  dataAttrs = _ref.dataAttrs,
72
- paginationAlign = _ref.paginationAlign,
73
- paginationTheme = _ref.paginationTheme,
76
+ _ref$paginationAlign = _ref.paginationAlign,
77
+ paginationAlign = _ref$paginationAlign === void 0 ? PaginationAlign.CENTER : _ref$paginationAlign,
74
78
  paginationType = _ref.paginationType,
75
- paginationPosition = _ref.paginationPosition,
76
79
  _ref$withPaginationBo = _ref.withPaginationBottomOffset,
77
80
  withPaginationBottomOffset = _ref$withPaginationBo === void 0 ? false : _ref$withPaginationBo,
78
81
  _ref$autoPlay = _ref.autoPlay,
@@ -83,8 +86,7 @@ var Banner = function Banner(_ref) {
83
86
  loop = _ref$loop === void 0 ? false : _ref$loop,
84
87
  _ref$pauseOnHover = _ref.pauseOnHover,
85
88
  pauseOnHover = _ref$pauseOnHover === void 0 ? false : _ref$pauseOnHover,
86
- _ref$backgroundColor = _ref.backgroundColor,
87
- backgroundColor = _ref$backgroundColor === void 0 ? BackgroundColor.TRANSPARENT : _ref$backgroundColor,
89
+ backgroundColor = _ref.backgroundColor,
88
90
  _ref$radius = _ref.radius,
89
91
  radius = _ref$radius === void 0 ? Radius.ROUNDED : _ref$radius,
90
92
  _ref$arrowTheme = _ref.arrowTheme,
@@ -140,6 +142,20 @@ var Banner = function Banner(_ref) {
140
142
  var dotTimerDelay = delay / 1000;
141
143
  var arrowSize = arrowTheme === _NavArrow.Theme.WHITE ? _NavArrow.Size.LARGE : _NavArrow.Size.MIDDLE;
142
144
  var rootRef = React.useRef(null);
145
+ var correctPaginationPosition = paginationType === PaginationButtonType.FLAT ? PaginationPositionType.TOP_IN : PaginationPositionType.BOTTOM_OUT;
146
+ var correctPaginationAlign = paginationType === PaginationButtonType.FLAT ? paginationAlign : PaginationAlign.CENTER;
147
+ var getCorrectPaginationTheme = function getCorrectPaginationTheme() {
148
+ switch (backgroundColor) {
149
+ case BackgroundColor.GREEN:
150
+ case BackgroundColor.PURPLE:
151
+ return PaginationTheme.LIGHT;
152
+ case BackgroundColor.LIGHT:
153
+ case BackgroundColor.GRADIENT:
154
+ return PaginationTheme.DARK;
155
+ default:
156
+ return PaginationTheme.DEFAULT;
157
+ }
158
+ };
143
159
  var increaseAutoplayDelay = React.useCallback(function (_ref2) {
144
160
  var params = _ref2.params,
145
161
  autoplay = _ref2.autoplay;
@@ -259,8 +275,8 @@ var Banner = function Banner(_ref) {
259
275
  var renderPagination = /*#__PURE__*/React.createElement("div", (0, _extends2["default"])({}, (0, _uiHelpers.filterDataAttrs)(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.pagination), {
260
276
  className: cn('pagination', {
261
277
  type: paginationType,
262
- align: paginationAlign,
263
- position: paginationPosition,
278
+ align: correctPaginationAlign,
279
+ position: correctPaginationPosition,
264
280
  'bottom-offset': withPaginationBottomOffset
265
281
  }, [classes.pagination])
266
282
  }), children && React.Children.map(children, function (_, i) {
@@ -277,7 +293,7 @@ var Banner = function Banner(_ref) {
277
293
  showTimer: showDotTimer,
278
294
  timerDelay: dotTimerDelay,
279
295
  type: paginationType,
280
- theme: paginationTheme,
296
+ theme: getCorrectPaginationTheme(),
281
297
  onClick: handleDotClick
282
298
  });
283
299
  }));
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@megafon/ui-core",
3
- "version": "8.11.1",
3
+ "version": "8.12.0",
4
4
  "files": [
5
5
  "dist",
6
6
  "styles"
@@ -104,5 +104,5 @@
104
104
  "simplebar-react": "^3.2.5",
105
105
  "swiper": "^11.1.1"
106
106
  },
107
- "gitHead": "c748a0748d78a2872ab16a384d8e81b83fcd60db"
107
+ "gitHead": "554c37f61636b2dfef18178670158d3503a23b33"
108
108
  }