@megafon/ui-core 3.12.0 → 3.14.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (18) hide show
  1. package/CHANGELOG.md +34 -0
  2. package/dist/es/components/Badges/components/PromoBadge/PromoBadge.css +4 -0
  3. package/dist/es/components/Badges/components/PromoBadge/PromoBadge.d.ts +1 -0
  4. package/dist/es/components/Badges/components/PromoBadge/PromoBadge.js +2 -1
  5. package/dist/es/components/Banner/Banner.css +3 -0
  6. package/dist/es/components/Banner/Banner.d.ts +2 -0
  7. package/dist/es/components/Banner/Banner.js +5 -1
  8. package/dist/es/components/Carousel/Carousel.d.ts +2 -0
  9. package/dist/es/components/Carousel/Carousel.js +7 -2
  10. package/dist/lib/components/Badges/components/PromoBadge/PromoBadge.css +4 -0
  11. package/dist/lib/components/Badges/components/PromoBadge/PromoBadge.d.ts +1 -0
  12. package/dist/lib/components/Badges/components/PromoBadge/PromoBadge.js +2 -1
  13. package/dist/lib/components/Banner/Banner.css +3 -0
  14. package/dist/lib/components/Banner/Banner.d.ts +2 -0
  15. package/dist/lib/components/Banner/Banner.js +5 -1
  16. package/dist/lib/components/Carousel/Carousel.d.ts +2 -0
  17. package/dist/lib/components/Carousel/Carousel.js +7 -2
  18. package/package.json +4 -4
package/CHANGELOG.md CHANGED
@@ -3,6 +3,40 @@
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
+ # [3.14.0](https://github.com/MegafonWebLab/megafon-ui/compare/@megafon/ui-core@3.13.0...@megafon/ui-core@3.14.0) (2022-09-06)
7
+
8
+
9
+ ### Features
10
+
11
+ * **badge:** add new promo badge type ([8cbe525](https://github.com/MegafonWebLab/megafon-ui/commit/8cbe5253b9d08c19c9343b42cb3920ac259c8844))
12
+ * **carousel:** add new prop slideToClickedSlide ([8a43432](https://github.com/MegafonWebLab/megafon-ui/commit/8a4343290f943475c8522adaa3ad2b564c551d83))
13
+
14
+
15
+
16
+
17
+
18
+ # [3.13.0](https://github.com/MegafonWebLab/megafon-ui/compare/@megafon/ui-core@3.12.1...@megafon/ui-core@3.13.0) (2022-08-11)
19
+
20
+
21
+ ### Features
22
+
23
+ * **banner:** add auto height ([c7658fa](https://github.com/MegafonWebLab/megafon-ui/commit/c7658faf335bc26f0a1b816e29b9cca114944691))
24
+
25
+
26
+
27
+
28
+
29
+ ## [3.12.1](https://github.com/MegafonWebLab/megafon-ui/compare/@megafon/ui-core@3.12.0...@megafon/ui-core@3.12.1) (2022-08-02)
30
+
31
+
32
+ ### Bug Fixes
33
+
34
+ * **carousel:** popup input focus ([b1c117a](https://github.com/MegafonWebLab/megafon-ui/commit/b1c117ac1ed560182e61133393ec65f14527958f))
35
+
36
+
37
+
38
+
39
+
6
40
  # [3.12.0](https://github.com/MegafonWebLab/megafon-ui/compare/@megafon/ui-core@3.11.0...@megafon/ui-core@3.12.0) (2022-06-28)
7
41
 
8
42
 
package/dist/es/components/Badges/components/PromoBadge/PromoBadge.css CHANGED
@@ -27,6 +27,10 @@
27
27
  .mfui-promo-badge_type_user-choice {
28
28
  background-color: var(--reflexBlue);
29
29
  }
30
+ .mfui-promo-badge_type_interests {
31
+ background-color: var(--brandPurple20);
32
+ color: var(--brandPurple);
33
+ }
30
34
  .mfui-promo-badge__text {
31
35
  font-family: inherit;
32
36
  font-size: 12px;
package/dist/es/components/Badges/components/PromoBadge/PromoBadge.d.ts CHANGED
@@ -6,6 +6,7 @@ export declare const PromoBadgeTypes: {
6
6
  readonly VIP: "vip";
7
7
  readonly POPULAR: "popular";
8
8
  readonly USER_CHOICE: "user-choice";
9
+ readonly INTERESTS: "interests";
9
10
  };
10
11
  declare type PromoBadgeTypesType = typeof PromoBadgeTypes[keyof typeof PromoBadgeTypes];
11
12
  export interface IPromoBadgeProps {
package/dist/es/components/Badges/components/PromoBadge/PromoBadge.js CHANGED
@@ -9,7 +9,8 @@ export var PromoBadgeTypes = {
9
9
  NEW: 'new',
10
10
  VIP: 'vip',
11
11
  POPULAR: 'popular',
12
- USER_CHOICE: 'user-choice'
12
+ USER_CHOICE: 'user-choice',
13
+ INTERESTS: 'interests'
13
14
  };
14
15
  var cn = cnCreate('mfui-promo-badge');
15
16
 
package/dist/es/components/Banner/Banner.css CHANGED
@@ -36,6 +36,9 @@
36
36
  height: 400px;
37
37
  }
38
38
  }
39
+ .mfui-banner_auto-height .mfui-banner__slide {
40
+ height: auto;
41
+ }
39
42
  @media screen and (min-width: 1024px) {
40
43
  .mfui-banner .swiper-slide-visible {
41
44
  opacity: 1;
package/dist/es/components/Banner/Banner.d.ts CHANGED
@@ -36,6 +36,8 @@ export interface IBannerProps {
36
36
  pauseOnHover?: boolean;
37
37
  /** Цветовая тема навигации */
38
38
  navTheme?: NavThemeType;
39
+ /** Автоматическая высота слайдов */
40
+ autoHeight?: boolean;
39
41
  /** Обработчик клика по стрелке "вперед" (должен быть обернут в useCallback) */
40
42
  onNextClick?: (index: number) => void;
41
43
  /** Обработчик клика по стрелке "назад" (должен быть обернут в useCallback) */
package/dist/es/components/Banner/Banner.js CHANGED
@@ -43,6 +43,8 @@ var Banner = function Banner(_ref) {
43
43
  loop = _ref$loop === void 0 ? false : _ref$loop,
44
44
  _ref$navTheme = _ref.navTheme,
45
45
  navTheme = _ref$navTheme === void 0 ? 'light' : _ref$navTheme,
46
+ _ref$autoHeight = _ref.autoHeight,
47
+ autoHeight = _ref$autoHeight === void 0 ? false : _ref$autoHeight,
46
48
  _ref$children = _ref.children,
47
49
  children = _ref$children === void 0 ? [] : _ref$children,
48
50
  onNextClick = _ref.onNextClick,
@@ -178,7 +180,8 @@ var Banner = function Banner(_ref) {
178
180
  }, [autoPlay, pauseOnHover, swiperInstance === null || swiperInstance === void 0 ? void 0 : swiperInstance.autoplay]);
179
181
  return /*#__PURE__*/React.createElement("div", _extends({}, filterDataAttrs(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.root), {
180
182
  className: cn({
181
- 'nav-theme': navTheme
183
+ 'nav-theme': navTheme,
184
+ 'auto-height': autoHeight
182
185
  }, className),
183
186
  ref: rootRef
184
187
  }), /*#__PURE__*/React.createElement(Swiper, _extends({}, filterDataAttrs(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.swiper), {
@@ -259,6 +262,7 @@ Banner.propTypes = {
259
262
  autoPlayDelay: PropTypes.number,
260
263
  pauseOnHover: PropTypes.bool,
261
264
  navTheme: PropTypes.oneOf(Object.values(NavTheme)),
265
+ autoHeight: PropTypes.bool,
262
266
  onNextClick: PropTypes.func,
263
267
  onPrevClick: PropTypes.func,
264
268
  onDotClick: PropTypes.func,
package/dist/es/components/Carousel/Carousel.d.ts CHANGED
@@ -72,6 +72,8 @@ export interface ICarouselProps {
72
72
  effectTheme?: EffectThemeType;
73
73
  /** Css селектор элемента, при перетаскивании которого не будет происходить смена слайдов */
74
74
  noSwipingSelector?: string;
75
+ /** Свайп к слайду, по которому произведен клик */
76
+ slideToClickedSlide?: boolean;
75
77
  /** Ref на swiper */
76
78
  getSwiper?: (instance: SwiperCore) => void;
77
79
  /** Обработчик клика по стрелке вперед (должен быть обернут в useCallback) */
package/dist/es/components/Carousel/Carousel.js CHANGED
@@ -92,7 +92,9 @@ var Carousel = function Carousel(_ref) {
92
92
  getSwiper = _ref.getSwiper,
93
93
  onNextClick = _ref.onNextClick,
94
94
  onPrevClick = _ref.onPrevClick,
95
- onChange = _ref.onChange;
95
+ onChange = _ref.onChange,
96
+ _ref$slideToClickedSl = _ref.slideToClickedSlide,
97
+ slideToClickedSlide = _ref$slideToClickedSl === void 0 ? false : _ref$slideToClickedSl;
96
98
 
97
99
  var _React$useState = React.useState(),
98
100
  _React$useState2 = _slicedToArray(_React$useState, 2),
@@ -219,7 +221,9 @@ var Carousel = function Carousel(_ref) {
219
221
  };
220
222
 
221
223
  var disableFocusOnSlideClick = function disableFocusOnSlideClick(e) {
222
- e.nativeEvent.preventDefault();
224
+ if (e.nativeEvent.target.closest(".".concat(cn()))) {
225
+ e.nativeEvent.preventDefault();
226
+ }
223
227
  };
224
228
 
225
229
  React.useEffect(function () {
@@ -263,6 +267,7 @@ var Carousel = function Carousel(_ref) {
263
267
  allowTouchMove: !disableTouchMove,
264
268
  centeredSlides: centeredSlides,
265
269
  effect: effectTheme,
270
+ slideToClickedSlide: slideToClickedSlide,
266
271
  fadeEffect: effectTheme === EffectTheme.FADE ? {
267
272
  crossFade: effectTheme === EffectTheme.FADE
268
273
  } : undefined,
package/dist/lib/components/Badges/components/PromoBadge/PromoBadge.css CHANGED
@@ -27,6 +27,10 @@
27
27
  .mfui-promo-badge_type_user-choice {
28
28
  background-color: var(--reflexBlue);
29
29
  }
30
+ .mfui-promo-badge_type_interests {
31
+ background-color: var(--brandPurple20);
32
+ color: var(--brandPurple);
33
+ }
30
34
  .mfui-promo-badge__text {
31
35
  font-family: inherit;
32
36
  font-size: 12px;
package/dist/lib/components/Badges/components/PromoBadge/PromoBadge.d.ts CHANGED
@@ -6,6 +6,7 @@ export declare const PromoBadgeTypes: {
6
6
  readonly VIP: "vip";
7
7
  readonly POPULAR: "popular";
8
8
  readonly USER_CHOICE: "user-choice";
9
+ readonly INTERESTS: "interests";
9
10
  };
10
11
  declare type PromoBadgeTypesType = typeof PromoBadgeTypes[keyof typeof PromoBadgeTypes];
11
12
  export interface IPromoBadgeProps {
package/dist/lib/components/Badges/components/PromoBadge/PromoBadge.js CHANGED
@@ -28,7 +28,8 @@ var PromoBadgeTypes = {
28
28
  NEW: 'new',
29
29
  VIP: 'vip',
30
30
  POPULAR: 'popular',
31
- USER_CHOICE: 'user-choice'
31
+ USER_CHOICE: 'user-choice',
32
+ INTERESTS: 'interests'
32
33
  };
33
34
  exports.PromoBadgeTypes = PromoBadgeTypes;
34
35
  var cn = (0, _uiHelpers.cnCreate)('mfui-promo-badge');
package/dist/lib/components/Banner/Banner.css CHANGED
@@ -36,6 +36,9 @@
36
36
  height: 400px;
37
37
  }
38
38
  }
39
+ .mfui-banner_auto-height .mfui-banner__slide {
40
+ height: auto;
41
+ }
39
42
  @media screen and (min-width: 1024px) {
40
43
  .mfui-banner .swiper-slide-visible {
41
44
  opacity: 1;
package/dist/lib/components/Banner/Banner.d.ts CHANGED
@@ -36,6 +36,8 @@ export interface IBannerProps {
36
36
  pauseOnHover?: boolean;
37
37
  /** Цветовая тема навигации */
38
38
  navTheme?: NavThemeType;
39
+ /** Автоматическая высота слайдов */
40
+ autoHeight?: boolean;
39
41
  /** Обработчик клика по стрелке "вперед" (должен быть обернут в useCallback) */
40
42
  onNextClick?: (index: number) => void;
41
43
  /** Обработчик клика по стрелке "назад" (должен быть обернут в useCallback) */
package/dist/lib/components/Banner/Banner.js CHANGED
@@ -71,6 +71,8 @@ var Banner = function Banner(_ref) {
71
71
  loop = _ref$loop === void 0 ? false : _ref$loop,
72
72
  _ref$navTheme = _ref.navTheme,
73
73
  navTheme = _ref$navTheme === void 0 ? 'light' : _ref$navTheme,
74
+ _ref$autoHeight = _ref.autoHeight,
75
+ autoHeight = _ref$autoHeight === void 0 ? false : _ref$autoHeight,
74
76
  _ref$children = _ref.children,
75
77
  children = _ref$children === void 0 ? [] : _ref$children,
76
78
  onNextClick = _ref.onNextClick,
@@ -206,7 +208,8 @@ var Banner = function Banner(_ref) {
206
208
  }, [autoPlay, pauseOnHover, swiperInstance === null || swiperInstance === void 0 ? void 0 : swiperInstance.autoplay]);
207
209
  return /*#__PURE__*/React.createElement("div", (0, _extends2["default"])({}, (0, _uiHelpers.filterDataAttrs)(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.root), {
208
210
  className: cn({
209
- 'nav-theme': navTheme
211
+ 'nav-theme': navTheme,
212
+ 'auto-height': autoHeight
210
213
  }, className),
211
214
  ref: rootRef
212
215
  }), /*#__PURE__*/React.createElement(_react2.Swiper, (0, _extends2["default"])({}, (0, _uiHelpers.filterDataAttrs)(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.swiper), {
@@ -287,6 +290,7 @@ Banner.propTypes = {
287
290
  autoPlayDelay: PropTypes.number,
288
291
  pauseOnHover: PropTypes.bool,
289
292
  navTheme: PropTypes.oneOf(Object.values(NavTheme)),
293
+ autoHeight: PropTypes.bool,
290
294
  onNextClick: PropTypes.func,
291
295
  onPrevClick: PropTypes.func,
292
296
  onDotClick: PropTypes.func,
package/dist/lib/components/Carousel/Carousel.d.ts CHANGED
@@ -72,6 +72,8 @@ export interface ICarouselProps {
72
72
  effectTheme?: EffectThemeType;
73
73
  /** Css селектор элемента, при перетаскивании которого не будет происходить смена слайдов */
74
74
  noSwipingSelector?: string;
75
+ /** Свайп к слайду, по которому произведен клик */
76
+ slideToClickedSlide?: boolean;
75
77
  /** Ref на swiper */
76
78
  getSwiper?: (instance: SwiperCore) => void;
77
79
  /** Обработчик клика по стрелке вперед (должен быть обернут в useCallback) */
package/dist/lib/components/Carousel/Carousel.js CHANGED
@@ -124,7 +124,9 @@ var Carousel = function Carousel(_ref) {
124
124
  getSwiper = _ref.getSwiper,
125
125
  onNextClick = _ref.onNextClick,
126
126
  onPrevClick = _ref.onPrevClick,
127
- onChange = _ref.onChange;
127
+ onChange = _ref.onChange,
128
+ _ref$slideToClickedSl = _ref.slideToClickedSlide,
129
+ slideToClickedSlide = _ref$slideToClickedSl === void 0 ? false : _ref$slideToClickedSl;
128
130
 
129
131
  var _React$useState = React.useState(),
130
132
  _React$useState2 = (0, _slicedToArray2["default"])(_React$useState, 2),
@@ -249,7 +251,9 @@ var Carousel = function Carousel(_ref) {
249
251
  };
250
252
 
251
253
  var disableFocusOnSlideClick = function disableFocusOnSlideClick(e) {
252
- e.nativeEvent.preventDefault();
254
+ if (e.nativeEvent.target.closest(".".concat(cn()))) {
255
+ e.nativeEvent.preventDefault();
256
+ }
253
257
  };
254
258
 
255
259
  React.useEffect(function () {
@@ -293,6 +297,7 @@ var Carousel = function Carousel(_ref) {
293
297
  allowTouchMove: !disableTouchMove,
294
298
  centeredSlides: centeredSlides,
295
299
  effect: effectTheme,
300
+ slideToClickedSlide: slideToClickedSlide,
296
301
  fadeEffect: effectTheme === EffectTheme.FADE ? {
297
302
  crossFade: effectTheme === EffectTheme.FADE
298
303
  } : undefined,
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@megafon/ui-core",
3
- "version": "3.12.0",
3
+ "version": "3.14.0",
4
4
  "files": [
5
5
  "dist",
6
6
  "styles"
@@ -43,7 +43,7 @@
43
43
  ]
44
44
  },
45
45
  "peerDependencies": {
46
- "@megafon/ui-icons": "^0.0.2-beta.2",
46
+ "@megafon/ui-icons": "^1.0.0",
47
47
  "react": ">=16.13.0",
48
48
  "react-dom": ">=16.13.0"
49
49
  },
@@ -54,7 +54,7 @@
54
54
  "@babel/preset-env": "^7.8.6",
55
55
  "@babel/preset-react": "^7.8.3",
56
56
  "@babel/preset-typescript": "^7.8.3",
57
- "@megafon/ui-icons": "^1.2.2",
57
+ "@megafon/ui-icons": "^1.3.0",
58
58
  "@svgr/core": "^2.4.1",
59
59
  "@testing-library/react-hooks": "^7.0.1",
60
60
  "@types/enzyme": "^3.10.5",
@@ -97,5 +97,5 @@
97
97
  "react-popper": "^2.2.3",
98
98
  "swiper": "^6.5.6"
99
99
  },
100
- "gitHead": "937a89d31be941889706301984fdbf6c1e1852b2"
100
+ "gitHead": "24435bfc98f949ea9e2d60a415d4e90554cb1166"
101
101
  }