@mjhls/mjh-framework 1.0.134 → 1.0.136

package/dist/index.js

@@ -6289,12 +6289,13 @@ var GridContent = function (_React$Component) {
 
   createClass(GridContent, [{
     key: 'cardLoader',
-    value: function cardLoader(page, columns, variant) {
+    value: function cardLoader(page, columns, variant, showVideo, VideoPlayer) {
       var _this2 = this;
 
       var lgVar = Math.floor(12 / columns);
       var itemCounter = 0;
       var numberOfItemsBeforeAd = 6;
+      var numberOfItemsBeforeVideo = 3;
       if (variant === 'stack') {
         return React__default.createElement(
           Row,
@@ -6443,6 +6444,7 @@ var GridContent = function (_React$Component) {
                 )
               )
             ),
+            showVideo && (_this2.state.data.length < numberOfItemsBeforeVideo || index$$1 + 1 === numberOfItemsBeforeVideo) && React__default.createElement(VideoPlayer, null),
             main_36 && _this2.props.rightItems && (index$$1 + 1) % numberOfItemsBeforeAd === 0 && _this2.renderMobileAd(index$$1, numberOfItemsBeforeAd)
           );
         })
@@ -6457,7 +6459,9 @@ var GridContent = function (_React$Component) {
           columns = _props.columns,
           variant = _props.variant,
           autoScroll = _props.autoScroll,
-          page = _props.page;
+          page = _props.page,
+          showVideo = _props.showVideo,
+          VideoPlayer = _props.VideoPlayer;
 
 
       return React__default.createElement(
@@ -6469,7 +6473,7 @@ var GridContent = function (_React$Component) {
           React__default.createElement(
             Container,
             null,
-            this.cardLoader(page, columns, variant)
+            this.cardLoader(page, columns, variant, showVideo, VideoPlayer)
           )
         ) : React__default.createElement(
           React__default.Fragment,
@@ -6477,7 +6481,7 @@ var GridContent = function (_React$Component) {
           React__default.createElement(
             Container,
             null,
-            this.cardLoader(page, columns, variant)
+            this.cardLoader(page, columns, variant, showVideo, VideoPlayer)
           ),
           React__default.createElement(
             'div',
@@ -7371,8 +7375,6 @@ var YoutubeGroup = function YoutubeGroup(props) {
   );
 };
 
-var _this = undefined;
-
 var urlFor = function urlFor(source, builder) {
   return builder.image(source).auto('format');
 };
@@ -7536,17 +7538,23 @@ var cardLoader = function cardLoader(data, builder, mapping, values, seoPaginate
             null,
             React__default.createElement(
               reactBootstrap.Media,
-              { key: article._id ? article._id : index$$1, style: { marginBottom: '1.25rem', paddingBottom: '1.25rem', borderBottom: '1px solid #ddd' } },
+              {
+                key: article._id ? article._id : index$$1,
+                style: { flexDirection: article._type == 'feature' ? 'column' : 'row', marginBottom: '1.25rem', paddingBottom: '1.25rem', borderBottom: '1px solid #ddd' } },
               (article.thumbnail && article.thumbnail.asset || defaultImage) && React__default.createElement(
                 Link,
                 { href: mapping[contentCategoryName] + '/[url]', as: mapping[contentCategoryName] + '/' + article.url.current },
                 React__default.createElement(
                   'a',
-                  { className: 'img-wrapper' },
+                  { className: article._type == 'feature' ? 'feature-wrapper' : 'img-wrapper' },
                   React__default.createElement(
                     LazyLoad,
-                    { height: _this.props.imageHeight },
-                    article.thumbnail && article.thumbnail.asset ? React__default.createElement('img', { className: 'mr-3 img-fluid', src: renderCardImage(article, builder, imageHeight, imageWidth), alt: article.title }) : article.thumbnail ? React__default.createElement('img', { src: article.thumbnail, className: 'mr-3', alt: article.title }) : React__default.createElement('img', { src: defaultImage, src2: article.thumbnail, className: 'mr-3', width: '240', height: '135', alt: article.title })
+                    { height: imageHeight },
+                    article.thumbnail && article.thumbnail.asset ? React__default.createElement('img', {
+                      className: article._type == 'feature' ? 'img-fluid' : 'mr-3 img-fluid',
+                      src: renderCardImage(article, builder, imageHeight, imageWidth),
+                      alt: article.title
+                    }) : article.thumbnail ? React__default.createElement('img', { src: article.thumbnail, className: 'mr-3', alt: article.title }) : React__default.createElement('img', { src: defaultImage, src2: article.thumbnail, className: 'mr-3', width: '240', height: '135', alt: article.title })
                   )
                 )
               ),
@@ -7602,7 +7610,7 @@ var cardLoader = function cardLoader(data, builder, mapping, values, seoPaginate
     React__default.createElement(
       'style',
       { jsx: 'true' },
-      '\n          .img-wrapper img {\n            max-height: 200px;\n            width: 100%;\n            object-fit: cover;\n          }\n          @media only screen and (min-width: 768px) {\n            .img-wrapper {\n              width: 42%;\n            }\n            .img-wrapper > img {\n              padding-right: 1em;\n            }\n          }\n          @media only screen and (max-width: 767px) {\n            .img-wrapper {\n              width: 100%;\n            }\n            .img-wrapper img {\n              padding-bottom: 1em;\n            }\n            .media {\n              flex-direction: column;\n            }\n          }\n        '
+      '\n          .img-wrapper img {\n            max-height: 200px;\n            width: 100%;\n            object-fit: cover;\n          }\n          .feature-wrapper {\n            width: 100%;\n          }\n          .feature-wrapper img {\n            width: 100%;\n            margin-bottom: 1em;\n          }\n          @media only screen and (min-width: 768px) {\n            .img-wrapper {\n              width: 42%;\n            }\n            .img-wrapper > img {\n              padding-right: 1em;\n            }\n          }\n          @media only screen and (max-width: 767px) {\n            .img-wrapper {\n              width: 100%;\n            }\n            .img-wrapper img {\n              padding-bottom: 1em;\n            }\n            .media {\n              flex-direction: column;\n            }\n          }\n        '
     )
   );
 };
@@ -10205,20 +10213,32 @@ var TemplateNormal = function TemplateNormal(props) {
 var AD300x250 = function AD300x250(_ref) {
   var networkID = _ref.networkID,
       adUnit = _ref.adUnit,
-      targeting = _ref.targeting;
+      slotId = _ref.slotId,
+      _ref$targeting = _ref.targeting,
+      targeting = _ref$targeting === undefined ? {} : _ref$targeting;
 
-  return React__default.createElement(AD, { networkID: networkID, adUnit: adUnit, targeting: targeting, className: 'AD300x250', sizes: [[300, 250], [300, 100]] });
+  return React__default.createElement(AD, {
+    networkID: networkID,
+    adUnit: adUnit,
+    slotId: slotId,
+    targeting: targeting,
+    className: 'AD300x250',
+    sizes: [[300, 250], [300, 100]]
+  });
 };
 
 var AD300x250x600 = function AD300x250x600(_ref) {
   var networkID = _ref.networkID,
       adUnit = _ref.adUnit,
-      targeting = _ref.targeting;
+      slotId = _ref.slotId,
+      _ref$targeting = _ref.targeting,
+      targeting = _ref$targeting === undefined ? {} : _ref$targeting;
 
   return React__default.createElement(AD, {
     networkID: networkID,
     adUnit: adUnit,
     className: 'AD300x250',
+    slotId: slotId,
     targeting: targeting,
     sizes: [[300, 250], [300, 600], [300, 100]]
   });