@meduza/ui-kit-2 0.1.99 → 0.2.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.
@@ -1997,7 +1997,7 @@ var MetaContainer = function MetaContainer(_ref) {
1997
1997
  })));
1998
1998
  };
1999
1999
 
2000
- var styles$w = {"root":"DonatesTeaser-module_root__3rtaJ","ctaInner":"DonatesTeaser-module_ctaInner__2LChL","main":"DonatesTeaser-module_main__YBt6p","title":"DonatesTeaser-module_title__hs-yr","text":"DonatesTeaser-module_text__ro-QA","cta":"DonatesTeaser-module_cta__1orPb","center":"DonatesTeaser-module_center__2Ynx9","isInCard":"DonatesTeaser-module_isInCard__HrFh8","isInSlide":"DonatesTeaser-module_isInSlide__1vC4Z"};
2000
+ var styles$w = {"root":"DonatesTeaser-module_root__3rtaJ","main":"DonatesTeaser-module_main__YBt6p","title":"DonatesTeaser-module_title__hs-yr","text":"DonatesTeaser-module_text__ro-QA","cta":"DonatesTeaser-module_cta__1orPb","ctaInner":"DonatesTeaser-module_ctaInner__2LChL","center":"DonatesTeaser-module_center__2Ynx9","isInCard":"DonatesTeaser-module_isInCard__HrFh8","isInSlide":"DonatesTeaser-module_isInSlide__1vC4Z"};
2001
2001
 
2002
2002
  var DonatesTeaser = function DonatesTeaser(_ref) {
2003
2003
  var styleContext = _ref.styleContext,
@@ -2011,15 +2011,14 @@ var DonatesTeaser = function DonatesTeaser(_ref) {
2011
2011
 
2012
2012
  var data = {
2013
2013
  ru: {
2014
- title: 'Слушайте музыку, помогайте «Медузе»',
2015
- // subtitle:
2016
- // '«Медуза» продолжает работать, потому что есть вы',
2017
- button: 'Дать денег',
2014
+ title: 'Вы совершили чудо',
2015
+ subtitle: '«Медуза» продолжает работать, потому что есть вы',
2016
+ button: '«Медуза», я с тобой ',
2018
2017
  href: 'https://support.meduza.io'
2019
2018
  },
2020
2019
  en: {
2021
2020
  title: 'Tune in and help Meduza!',
2022
- // subtitle: 'We’re only here thanks to you.',
2021
+ subtitle: 'We’re only here thanks to you.',
2023
2022
  button: 'Pledge today',
2024
2023
  href: 'https://support.meduza.io/en'
2025
2024
  }
@@ -2035,6 +2034,11 @@ var DonatesTeaser = function DonatesTeaser(_ref) {
2035
2034
  dangerouslySetInnerHTML: {
2036
2035
  __html: data[lang].title
2037
2036
  }
2037
+ }), " ", React__default.createElement("span", {
2038
+ className: styles$w.text,
2039
+ dangerouslySetInnerHTML: {
2040
+ __html: data[lang].subtitle
2041
+ }
2038
2042
  }))), React__default.createElement("div", {
2039
2043
  className: styles$w.cta
2040
2044
  }, React__default.createElement("a", {
@@ -2517,6 +2521,99 @@ var RelatedRichBlock = function RelatedRichBlock(_ref) {
2517
2521
  })));
2518
2522
  };
2519
2523
 
2524
+ var styles$C = {"root":"ShopRelatedBlock-module_root__x4vdk","wrapper":"ShopRelatedBlock-module_wrapper__3jQp9","overlay":"ShopRelatedBlock-module_overlay__15S5a","overlayHeader":"ShopRelatedBlock-module_overlayHeader__2IXK-","body":"ShopRelatedBlock-module_body__3ipYj","hasGradient":"ShopRelatedBlock-module_hasGradient__1pghj","picture":"ShopRelatedBlock-module_picture__1bu9H","tag":"ShopRelatedBlock-module_tag__2vTKm","center":"ShopRelatedBlock-module_center__2H85-","title":"ShopRelatedBlock-module_title__1ZIW0","price":"ShopRelatedBlock-module_price__2cVXM","dark":"ShopRelatedBlock-module_dark__3Gfbc","light":"ShopRelatedBlock-module_light__1y8Qy","mobile":"ShopRelatedBlock-module_mobile__AleU0","desktop":"ShopRelatedBlock-module_desktop__2--zA"};
2525
+
2526
+ /* eslint-disable react/jsx-no-target-blank */
2527
+ var ShopRelatedBlock = function ShopRelatedBlock(_ref) {
2528
+ var _ref$block = _ref.block,
2529
+ onlyOn = _ref$block.only_on,
2530
+ _ref$block$data = _ref$block.data,
2531
+ url = _ref$block$data.url,
2532
+ _ref$block$data$cover = _ref$block$data.cover,
2533
+ urls = _ref$block$data$cover.urls,
2534
+ gradients = _ref$block$data$cover.gradients,
2535
+ tag = _ref$block$data$cover.tag,
2536
+ layout = _ref$block$data$cover.layout,
2537
+ ratio = _ref$block$data$cover.ratio,
2538
+ firstTitle = _ref$block$data$cover.first_title,
2539
+ secondTitle = _ref$block$data$cover.second_title,
2540
+ styleContext = _ref.styleContext;
2541
+ var style = {};
2542
+ var styleHeader = {};
2543
+
2544
+ var _useInView = reactIntersectionObserver.useInView({
2545
+ threshold: 0,
2546
+ triggerOnce: true
2547
+ }),
2548
+ ref = _useInView[0],
2549
+ inView = _useInView[1];
2550
+
2551
+ React.useEffect(function () {
2552
+ if (inView) {
2553
+ if (onlyOn === 'mobile' && window.innerWidth <= 511 || onlyOn === 'desktop' && window.innerWidth >= 512 || !onlyOn) {
2554
+ postMessage('productRelated', url, 'view');
2555
+ }
2556
+ }
2557
+ }, [inView]);
2558
+
2559
+ var handleClick = function handleClick() {
2560
+ postMessage('productRelated', url, 'click');
2561
+ };
2562
+
2563
+ var classNames = [[styles$C.root, true], [styles$C.hasGradient, !!gradients], [styles$C[onlyOn], !!onlyOn && !!styles$C[onlyOn]]];
2564
+
2565
+ if (styleContext) {
2566
+ classNames = makeStyleContext(classNames, styleContext, styles$C);
2567
+ }
2568
+
2569
+ if (gradients) {
2570
+ styleHeader.backgroundImage = generateGradient(gradients.bg_rgb, 'mediaBlockTop');
2571
+ var theme = [gradients.text_rgb === '0,0,0' ? 'dark' : 'light'];
2572
+ classNames = makeStyleContext(classNames, theme, styles$C);
2573
+
2574
+ if (onlyOn === 'desktop') {
2575
+ style.backgroundImage = generateGradient(gradients.bg_rgb, 'mediaBlockBottom');
2576
+ }
2577
+ }
2578
+
2579
+ return React__default.createElement("a", {
2580
+ "data-testid": "related-rich-block",
2581
+ className: makeClassName(classNames),
2582
+ href: url,
2583
+ target: "_blank",
2584
+ onClick: function onClick() {
2585
+ return handleClick();
2586
+ },
2587
+ ref: ref
2588
+ }, layout === 'rich' && React__default.createElement(React__default.Fragment, null, React__default.createElement("div", {
2589
+ className: styles$C.overlay,
2590
+ style: style
2591
+ }), React__default.createElement("div", {
2592
+ className: styles$C.overlayHeader,
2593
+ style: styleHeader
2594
+ })), React__default.createElement("div", {
2595
+ className: styles$C.tag
2596
+ }, React__default.createElement(Tag, {
2597
+ size: "small",
2598
+ theme: "inherit",
2599
+ styleContext: "richRelated"
2600
+ }, tag)), React__default.createElement("div", {
2601
+ className: styles$C.cover
2602
+ }, React__default.createElement("div", {
2603
+ className: styles$C.picture
2604
+ }, React__default.createElement(Image, {
2605
+ optimized: urls,
2606
+ ratio: ratio,
2607
+ display: "narrow"
2608
+ }))), React__default.createElement("div", {
2609
+ className: styles$C.body
2610
+ }, React__default.createElement("h2", {
2611
+ className: styles$C.title
2612
+ }, firstTitle, React__default.createElement("span", {
2613
+ className: styles$C.price
2614
+ }, secondTitle))));
2615
+ };
2616
+
2520
2617
  var RawHtmlBlock = function RawHtmlBlock(_ref) {
2521
2618
  var block = _ref.block,
2522
2619
  styleContext = _ref.styleContext,
@@ -2573,6 +2670,14 @@ var RawHtmlBlock = function RawHtmlBlock(_ref) {
2573
2670
  });
2574
2671
  }
2575
2672
 
2673
+ case 'related_shop':
2674
+ {
2675
+ return React__default.createElement(ShopRelatedBlock, {
2676
+ block: block,
2677
+ styleContext: styleContext
2678
+ });
2679
+ }
2680
+
2576
2681
  default:
2577
2682
  {
2578
2683
  return React__default.createElement(BlockProvider, {
@@ -2590,7 +2695,7 @@ var RawHtmlBlock = function RawHtmlBlock(_ref) {
2590
2695
  }
2591
2696
  };
2592
2697
 
2593
- var styles$C = {"root":"ToolbarButton-module_root__xN-fq","isDark":"ToolbarButton-module_isDark__2q5U7","dark":"ToolbarButton-module_dark__GrIOr","bookmark":"ToolbarButton-module_bookmark__3369b","isActive":"ToolbarButton-module_isActive__3NLAE","text":"ToolbarButton-module_text__32m6s"};
2698
+ var styles$D = {"root":"ToolbarButton-module_root__xN-fq","isDark":"ToolbarButton-module_isDark__2q5U7","dark":"ToolbarButton-module_dark__GrIOr","bookmark":"ToolbarButton-module_bookmark__3369b","isActive":"ToolbarButton-module_isActive__3NLAE","text":"ToolbarButton-module_text__32m6s"};
2594
2699
 
2595
2700
  var ToolbarButton = function ToolbarButton(_ref) {
2596
2701
  var children = _ref.children,
@@ -2598,7 +2703,7 @@ var ToolbarButton = function ToolbarButton(_ref) {
2598
2703
  theme = _ref.theme,
2599
2704
  isActive = _ref.isActive,
2600
2705
  _onClick = _ref.onClick;
2601
- var classNames = [[styles$C.root, true], [styles$C[type], !!styles$C[type]], [styles$C[theme], !!styles$C[theme] && !!theme], [styles$C.isActive, !!isActive]];
2706
+ var classNames = [[styles$D.root, true], [styles$D[type], !!styles$D[type]], [styles$D[theme], !!styles$D[theme] && !!theme], [styles$D.isActive, !!isActive]];
2602
2707
  return React__default.createElement("li", {
2603
2708
  className: toolbarStyles.item
2604
2709
  }, React__default.createElement("button", {
@@ -2613,103 +2718,10 @@ var ToolbarButton = function ToolbarButton(_ref) {
2613
2718
  icon: type,
2614
2719
  styleContext: "isInToolbar"
2615
2720
  }), children && React__default.createElement("span", {
2616
- className: styles$C.text
2721
+ className: styles$D.text
2617
2722
  }, children)));
2618
2723
  };
2619
2724
 
2620
- var styles$D = {"root":"ShopRelatedBlock-module_root__x4vdk","wrapper":"ShopRelatedBlock-module_wrapper__3jQp9","overlay":"ShopRelatedBlock-module_overlay__15S5a","overlayHeader":"ShopRelatedBlock-module_overlayHeader__2IXK-","body":"ShopRelatedBlock-module_body__3ipYj","hasGradient":"ShopRelatedBlock-module_hasGradient__1pghj","picture":"ShopRelatedBlock-module_picture__1bu9H","tag":"ShopRelatedBlock-module_tag__2vTKm","center":"ShopRelatedBlock-module_center__2H85-","title":"ShopRelatedBlock-module_title__1ZIW0","price":"ShopRelatedBlock-module_price__2cVXM","dark":"ShopRelatedBlock-module_dark__3Gfbc","light":"ShopRelatedBlock-module_light__1y8Qy","mobile":"ShopRelatedBlock-module_mobile__AleU0","desktop":"ShopRelatedBlock-module_desktop__2--zA"};
2621
-
2622
- /* eslint-disable react/jsx-no-target-blank */
2623
- var ShopRelatedBlock = function ShopRelatedBlock(_ref) {
2624
- var _ref$block = _ref.block,
2625
- onlyOn = _ref$block.only_on,
2626
- _ref$block$data = _ref$block.data,
2627
- url = _ref$block$data.url,
2628
- _ref$block$data$cover = _ref$block$data.cover,
2629
- urls = _ref$block$data$cover.urls,
2630
- gradients = _ref$block$data$cover.gradients,
2631
- tag = _ref$block$data$cover.tag,
2632
- layout = _ref$block$data$cover.layout,
2633
- ratio = _ref$block$data$cover.ratio,
2634
- firstTitle = _ref$block$data$cover.first_title,
2635
- secondTitle = _ref$block$data$cover.second_title,
2636
- styleContext = _ref.styleContext;
2637
- var style = {};
2638
- var styleHeader = {};
2639
-
2640
- var _useInView = reactIntersectionObserver.useInView({
2641
- threshold: 0,
2642
- triggerOnce: true
2643
- }),
2644
- ref = _useInView[0],
2645
- inView = _useInView[1];
2646
-
2647
- React.useEffect(function () {
2648
- if (inView) {
2649
- if (onlyOn === 'mobile' && window.innerWidth <= 511 || onlyOn === 'desktop' && window.innerWidth >= 512 || !onlyOn) {
2650
- postMessage('productRelated', url, 'view');
2651
- }
2652
- }
2653
- }, [inView]);
2654
-
2655
- var handleClick = function handleClick() {
2656
- postMessage('productRelated', url, 'click');
2657
- };
2658
-
2659
- var classNames = [[styles$D.root, true], [styles$D.hasGradient, !!gradients], [styles$D[onlyOn], !!onlyOn && !!styles$D[onlyOn]]];
2660
-
2661
- if (styleContext) {
2662
- classNames = makeStyleContext(classNames, styleContext, styles$D);
2663
- }
2664
-
2665
- if (gradients) {
2666
- styleHeader.backgroundImage = generateGradient(gradients.bg_rgb, 'mediaBlockTop');
2667
- var theme = [gradients.text_rgb === '0,0,0' ? 'dark' : 'light'];
2668
- classNames = makeStyleContext(classNames, theme, styles$D);
2669
-
2670
- if (onlyOn === 'desktop') {
2671
- style.backgroundImage = generateGradient(gradients.bg_rgb, 'mediaBlockBottom');
2672
- }
2673
- }
2674
-
2675
- return React__default.createElement("a", {
2676
- "data-testid": "related-rich-block",
2677
- className: makeClassName(classNames),
2678
- href: url,
2679
- target: "_blank",
2680
- onClick: function onClick() {
2681
- return handleClick();
2682
- },
2683
- ref: ref
2684
- }, layout === 'rich' && React__default.createElement(React__default.Fragment, null, React__default.createElement("div", {
2685
- className: styles$D.overlay,
2686
- style: style
2687
- }), React__default.createElement("div", {
2688
- className: styles$D.overlayHeader,
2689
- style: styleHeader
2690
- })), React__default.createElement("div", {
2691
- className: styles$D.tag
2692
- }, React__default.createElement(Tag, {
2693
- size: "small",
2694
- theme: "inherit",
2695
- styleContext: "richRelated"
2696
- }, tag)), React__default.createElement("div", {
2697
- className: styles$D.cover
2698
- }, React__default.createElement("div", {
2699
- className: styles$D.picture
2700
- }, React__default.createElement(Image, {
2701
- optimized: urls,
2702
- ratio: ratio,
2703
- display: "narrow"
2704
- }))), React__default.createElement("div", {
2705
- className: styles$D.body
2706
- }, React__default.createElement("h2", {
2707
- className: styles$D.title
2708
- }, firstTitle, React__default.createElement("span", {
2709
- className: styles$D.price
2710
- }, secondTitle))));
2711
- };
2712
-
2713
2725
  exports.BookmarkButton = BookmarkButton;
2714
2726
  exports.Button = Button;
2715
2727
  exports.CardTitle = CardTitle;