@mjhls/mjh-framework 1.0.457 → 1.0.459

package/README.md

@@ -1,5 +1,4 @@
-
-# mjh-framework v. 1.0.457
+# mjh-framework v. 1.0.459
 
 > Foundation Framework 
 

package/dist/cjs/ArticleQueue.js

@@ -55,6 +55,7 @@ var getSerializers = require('./getSerializers.js');
 require('./util-f2c1b65b.js');
 require('react-bootstrap/Pagination');
 require('next/dynamic');
+var getKeywords = require('./getKeywords.js');
 
 var renderAuthor = function renderAuthor(authorName, authorURL, index, length) {
   var defaultUrl = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : 'authors';
@@ -140,6 +141,10 @@ var Article = function Article(props) {
   var url = _props$article$url.current,
       issue = _props$article.issue,
       source = _props$article.source,
+      internalTag = _props$article.internalTag,
+      seoTag = _props$article.seoTag,
+      sponsoredTag = _props$article.sponsoredTag,
+      userDefinedTag = _props$article.userDefinedTag,
       regionalPages = props.regionalPages,
       nationalPage = props.nationalPage,
       ISIContent = props.ISIContent,
@@ -436,6 +441,7 @@ var Article = function Article(props) {
   var shareSummary = summary;
   var shareImage = thumbnail && thumbnail.asset ? urlFor(thumbnail.asset).url() : shareImageDefault;
   var siteName = props.website.title;
+  var shareKeywords = getKeywords(props.article).join(',');
 
   var meta = {
     shareTitle: shareTitle,
@@ -443,7 +449,8 @@ var Article = function Article(props) {
     shareSummary: shareSummary,
     shareUrl: shareUrl,
     shareImage: shareImage,
-    shareVia: props.Settings.title
+    shareVia: props.Settings.title,
+    shareKeywords: shareKeywords
   };
   return React__default.createElement(
     React__default.Fragment,
@@ -471,6 +478,7 @@ var Article = function Article(props) {
             '' + shareTitle
           ),
           React__default.createElement('meta', { name: 'description', key: 'description', content: shareSummary }),
+          React__default.createElement('meta', { name: 'keywords', key: 'keywords', content: shareKeywords }),
           passwordLock && React__default.createElement('meta', { name: 'robots', content: 'noindex, nofollow' }),
           React__default.createElement('meta', { property: 'og:url', content: shareUrl, key: 'og:url' }),
           React__default.createElement('meta', { property: 'og:title', content: shareTitle, key: 'og:title' }),
@@ -481,7 +489,8 @@ var Article = function Article(props) {
           React__default.createElement('meta', { name: 'twitter:title', content: shareTitle, key: 'twitter:title' }),
           React__default.createElement('meta', { name: 'twitter:image', content: shareImage, key: 'twitter:image' }),
           React__default.createElement('meta', { name: 'twitter:site', content: '@' + props.Settings.title, key: 'twitter:site' }),
-          React__default.createElement('meta', { name: 'twitter:description', content: shareSummary, key: 'twitter:description' })
+          React__default.createElement('meta', { name: 'twitter:description', content: shareSummary, key: 'twitter:description' }),
+          React__default.createElement('link', { rel: 'canonical', href: shareUrl, key: 'canonical' })
         ),
         React__default.createElement(
           'h1',
@@ -802,6 +811,7 @@ var ArticleQueue = function ArticleQueue(props) {
   var changeMeta = function changeMeta(meta) {
     document.title = meta.shareTitle;
     document.querySelector('meta[name="description"]').setAttribute('content', meta.shareSummary);
+    document.querySelector('meta[name="keywords"]').setAttribute('content', meta.shareKeywords);
     document.querySelector('meta[property="og:url"]').setAttribute('content', meta.shareUrl);
     document.querySelector('meta[property="og:title"]').setAttribute('content', meta.shareTitle);
     document.querySelector('meta[property="og:site_name"]').setAttribute('content', meta.shareVia);
@@ -810,6 +820,7 @@ var ArticleQueue = function ArticleQueue(props) {
     document.querySelector('meta[name="twitter:image"]').setAttribute('content', meta.shareImage);
     document.querySelector('meta[name="twitter:site"]').setAttribute('content', meta.shareVia);
     document.querySelector('meta[name="twitter:description"]').setAttribute('content', meta.shareSummary);
+    document.querySelector('link[rel="canonical"]').setAttribute('href', meta.shareUrl);
   };
 
   var onChangeArticle = function onChangeArticle(path, visibility, meta) {

package/dist/cjs/GridContent.js

@@ -356,14 +356,19 @@ var GridContent = function (_React$Component) {
         var data = this.state.data.slice(3);
 
         //  Need to pass flag "lgInfeedAd={true}" along with brandInsight from site level for large infeed-ad to render
-        //  Checking lgInfeedAd flag in desktop view ( window >= 1200px ).
-        if (lgInfeedAd && window && window.innerWidth >= 1200) {
+        //  Checking lgInfeedAd flag in desktop view ( window >= 1400px ).
+        if (lgInfeedAd && typeof window !== 'undefined' && window.innerWidth >= 1400) {
           var lgInFeedAd = {
             _type: 'lg-infeed',
             adUnit: brandInsight.adUnit,
             className: 'lg-infeed',
             networkID: brandInsight.networkID,
             sizes: [728, 90],
+            //  Adding sizeMapping for showing ad above 1400px
+            sizeMapping: [{
+              viewport: [1400, 0],
+              sizes: [[728, 90]]
+            }, { viewport: [0, 0], sizes: [] }],
             targeting: {
               content_placement: brandInsight.targeting.content_placement,
               document_url: brandInsight.targeting.document_url
@@ -383,8 +388,8 @@ var GridContent = function (_React$Component) {
         }
 
         if (showBI) {
-          //  Checking lgInfeedAd flag in desktop view ( window >= 1200px ).
-          if (lgInfeedAd && window && window.innerWidth >= 1200) {
+          //  Checking lgInfeedAd flag in desktop view ( window >= 1400px ).
+          if (lgInfeedAd && typeof window !== 'undefined' && window.innerWidth >= 1400) {
             brandInsight.interval = 8;
           } else {
             brandInsight.interval = 5;

package/dist/cjs/QueueDeckExpanded.js

@@ -161,14 +161,19 @@ var cardLoader = function cardLoader(data, builder, mapping, values, seoPaginate
   };
 
   //  Need to pass flag "lgInfeedAd={true}" along with brandInsightAd from site level for large infeed-ad to render
-  //  Checking lgInfeedAd flag in desktop view ( window >= 1200px ).
-  if (lgInfeedAd && brandInsightAd && window && window.innerWidth >= 1200) {
+  //  Checking window and lgInfeedAd flag in desktop view ( window >= 1400px ).
+  if (lgInfeedAd && brandInsightAd && typeof window !== 'undefined' && window.innerWidth >= 1400) {
     var lgInfeed = {
       _type: 'lg-infeed',
       adUnit: brandInsightAd.adUnit,
       className: 'lg-infeed',
       networkID: brandInsightAd.networkID,
       sizes: [728, 90],
+      //  Adding sizeMapping for showing ad above 1400px
+      sizeMapping: [{
+        viewport: [1400, 0],
+        sizes: [[728, 90]]
+      }, { viewport: [0, 0], sizes: [] }],
       targeting: {
         content_placement: brandInsightAd.targeting.content_placement,
         document_url: brandInsightAd.targeting.document_url
@@ -188,8 +193,8 @@ var cardLoader = function cardLoader(data, builder, mapping, values, seoPaginate
   }
 
   if (showBI && brandInsightAd) {
-    //  Checking lgInfeedAd flag in desktop view ( window >= 1200px ).
-    if (lgInfeedAd && window && window.innerWidth >= 1200) brandInsightAd.interval = 8;
+    //  Checking window and lgInfeedAd flag in desktop view ( window >= 1400px ).
+    if (lgInfeedAd && typeof window !== 'undefined' && window.innerWidth >= 1400) brandInsightAd.interval = 8;
     var pos = 0;
     for (var i = 1; pos < data.length; i++) {
       var inFeedAd = {
@@ -564,7 +569,7 @@ var cardLoader = function cardLoader(data, builder, mapping, values, seoPaginate
     React__default.createElement(
       'style',
       { jsx: 'true' },
-      '\n          .displayLabelThumb{\n            margin: 0 auto;\n            margin-top: -1.25rem;\n            background-color: white;\n            position: relative;\n          }\n          .sanityDisplayLabel {\n            margin: 0.5rem 0;\n            border: 1px solid black;\n            width: fit-content;\n            padding: 5px;\n            color: var(--franchise-primary, #484848);\n            border-radius: 2px;\n          }\n          .feature-media > .media-body {\n            -webkit-box-flex: none;\n            -ms-flex: none;\n            flex: none;\n          }\n          .img-wrapper img {\n            max-height: 240px;\n            height: auto;\n            width: 100%;\n            object-fit: contain;\n          }\n          .feature-wrapper {\n            height: 100%;\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 > 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 !important;\n            }\n          }\n        '
+      '\n          .displayLabelThumb {\n            margin: 0 auto;\n            margin-top: -1.25rem;\n            background-color: white;\n            position: relative;\n          }\n          .sanityDisplayLabel {\n            margin: 0.5rem 0;\n            border: 1px solid black;\n            width: fit-content;\n            padding: 5px;\n            color: var(--franchise-primary, #484848);\n            border-radius: 2px;\n          }\n          .feature-media > .media-body {\n            -webkit-box-flex: none;\n            -ms-flex: none;\n            flex: none;\n          }\n          .img-wrapper img {\n            max-height: 240px;\n            height: auto;\n            width: 100%;\n            object-fit: contain;\n          }\n          .feature-wrapper {\n            height: 100%;\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 > 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 !important;\n            }\n          }\n        '
     )
   );
 };

package/dist/cjs/View.js

@@ -57,6 +57,7 @@ var getSerializers = require('./getSerializers.js');
 require('./util-f2c1b65b.js');
 require('react-bootstrap/Pagination');
 require('next/dynamic');
+var getKeywords = require('./getKeywords.js');
 var getTargeting = require('./getTargeting-3ced038f.js');
 var urlFor = require('./urlFor.js');
 
@@ -593,6 +594,7 @@ var Article = function Article(props) {
     var shareSummary = article.summary;
     var shareImage = thumbnail && thumbnail.asset ? urlFor(props.client, thumbnail.asset).url() : shareImageDefault;
     var siteName = props.website && props.website.title ? props.website.title : '';
+    var shareKeywords = getKeywords(props.article).join(',');
 
     var meta = {
       shareTitle: shareTitle,
@@ -600,7 +602,8 @@ var Article = function Article(props) {
       shareSummary: shareSummary,
       shareUrl: shareUrl,
       shareImage: shareImage,
-      shareVia: props.Settings.title
+      shareVia: props.Settings.title,
+      shareKeywords: shareKeywords
     };
     if (!props.infiniteScroll) {
       onChangeArticle = function onChangeArticle() {
@@ -969,6 +972,7 @@ var ArticleQueue = function ArticleQueue(props) {
   var changeMeta = function changeMeta(meta) {
     document.title = meta.shareTitle;
     document.querySelector('meta[name="description"]').setAttribute('content', meta.shareSummary);
+    document.querySelector('meta[name="keywords"]').setAttribute('content', meta.shareKeywords);
     document.querySelector('meta[property="og:url"]').setAttribute('content', meta.shareUrl);
     document.querySelector('meta[property="og:title"]').setAttribute('content', meta.shareTitle);
     document.querySelector('meta[property="og:site_name"]').setAttribute('content', meta.shareVia);
@@ -977,6 +981,7 @@ var ArticleQueue = function ArticleQueue(props) {
     document.querySelector('meta[name="twitter:image"]').setAttribute('content', meta.shareImage);
     document.querySelector('meta[name="twitter:site"]').setAttribute('content', meta.shareVia);
     document.querySelector('meta[name="twitter:description"]').setAttribute('content', meta.shareSummary);
+    document.querySelector('link[rel="canonical"]').setAttribute('href', meta.shareUrl);
   };
 
   var onChangeArticle = function onChangeArticle(path, visibility, meta) {
@@ -1139,6 +1144,7 @@ var View = function View(props) {
         article.title + ' | ' + props.cache.siteSettingCache.name
       ),
       React__default.createElement('meta', { name: 'description', key: 'description', content: shareOptions.shareSummary }),
+      React__default.createElement('meta', { name: 'keywords', content: getKeywords(article).join(','), key: 'keywords' }),
       passwordLock && React__default.createElement('meta', { name: 'robots', content: 'noindex, nofollow' }),
       React__default.createElement('meta', { property: 'og:url', content: shareOptions.shareUrl, key: 'og:url' }),
       React__default.createElement('meta', { property: 'og:title', content: shareOptions.shareTitle, key: 'og:title' }),
@@ -1150,6 +1156,7 @@ var View = function View(props) {
       React__default.createElement('meta', { name: 'twitter:image', content: shareOptions.shareImage, key: 'twitter:image' }),
       React__default.createElement('meta', { name: 'twitter:site', content: '@' + props.Settings.title, key: 'twitter:site' }),
       React__default.createElement('meta', { name: 'twitter:description', content: shareOptions.shareSummary, key: 'twitter:description' }),
+      React__default.createElement('link', { rel: 'canonical', href: shareOptions.shareUrl, key: 'canonical' }),
       React__default.createElement(
         'noscript',
         null,

package/dist/cjs/getKeywords.js

@@ -4,24 +4,39 @@ var getKeywords = function getKeywords(article) {
   var keywords = [];
   var internalTag = article.internalTag,
       userDefinedTag = article.userDefinedTag,
-      SponsorshipTag = article.SponsorshipTag;
+      SponsorshipTag = article.SponsorshipTag,
+      seoTag = article.seoTag;
 
 
   if (internalTag) {
     internalTag.map(function (item) {
-      keywords.push(item);
+      if (!keywords.includes(item)) {
+        keywords.push(item);
+      }
     });
   }
 
   if (userDefinedTag) {
     userDefinedTag.map(function (item) {
-      keywords.push(item);
+      if (!keywords.includes(item)) {
+        keywords.push(item);
+      }
     });
   }
 
   if (SponsorshipTag) {
     SponsorshipTag.map(function (item) {
-      keywords.push(item);
+      if (!keywords.includes(item)) {
+        keywords.push(item);
+      }
+    });
+  }
+
+  if (seoTag) {
+    seoTag.map(function (item) {
+      if (!keywords.includes(item)) {
+        keywords.push(item);
+      }
     });
   }
 

package/dist/cjs/index.js

@@ -140,6 +140,7 @@ var getSerializers = require('./getSerializers.js');
 require('./util-f2c1b65b.js');
 require('react-bootstrap/Pagination');
 require('next/dynamic');
+var getKeywords = require('./getKeywords.js');
 var ArticleQueue = require('./ArticleQueue.js');
 var RelatedContent = require('./RelatedContent.js');
 var ForbesHero = require('./ForbesHero.js');
@@ -160,7 +161,6 @@ require('mysql');
 var View = require('./View.js');
 var getTargeting = require('./getTargeting-3ced038f.js');
 var urlFor = require('./urlFor.js');
-var getKeywords = require('./getKeywords.js');
 var getQuery = require('./getQuery.js');
 
 
@@ -223,6 +223,7 @@ exports.PublicationLanding = PublicationLanding;
 exports.IssueLanding = IssueLanding;
 exports.PopUpModal = PopUpModal;
 exports.getSerializers = getSerializers;
+exports.getKeywords = getKeywords;
 exports.ArticleQueue = ArticleQueue;
 exports.RelatedContent = RelatedContent;
 exports.ForbesHero = ForbesHero;
@@ -240,5 +241,4 @@ exports.Auth = Auth.default;
 exports.View = View;
 exports.getTargeting = getTargeting.getTargeting;
 exports.urlFor = urlFor;
-exports.getKeywords = getKeywords;
 exports.getQuery = getQuery;

package/dist/esm/ArticleQueue.js

@@ -50,6 +50,7 @@ import getSerializers from './getSerializers.js';
 import './util-7700fc59.js';
 import 'react-bootstrap/Pagination';
 import 'next/dynamic';
+import getKeywords from './getKeywords.js';
 
 var renderAuthor = function renderAuthor(authorName, authorURL, index, length) {
   var defaultUrl = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : 'authors';
@@ -135,6 +136,10 @@ var Article = function Article(props) {
   var url = _props$article$url.current,
       issue = _props$article.issue,
       source = _props$article.source,
+      internalTag = _props$article.internalTag,
+      seoTag = _props$article.seoTag,
+      sponsoredTag = _props$article.sponsoredTag,
+      userDefinedTag = _props$article.userDefinedTag,
       regionalPages = props.regionalPages,
       nationalPage = props.nationalPage,
       ISIContent = props.ISIContent,
@@ -431,6 +436,7 @@ var Article = function Article(props) {
   var shareSummary = summary;
   var shareImage = thumbnail && thumbnail.asset ? urlFor(thumbnail.asset).url() : shareImageDefault;
   var siteName = props.website.title;
+  var shareKeywords = getKeywords(props.article).join(',');
 
   var meta = {
     shareTitle: shareTitle,
@@ -438,7 +444,8 @@ var Article = function Article(props) {
     shareSummary: shareSummary,
     shareUrl: shareUrl,
     shareImage: shareImage,
-    shareVia: props.Settings.title
+    shareVia: props.Settings.title,
+    shareKeywords: shareKeywords
   };
   return React__default.createElement(
     React__default.Fragment,
@@ -466,6 +473,7 @@ var Article = function Article(props) {
             '' + shareTitle
           ),
           React__default.createElement('meta', { name: 'description', key: 'description', content: shareSummary }),
+          React__default.createElement('meta', { name: 'keywords', key: 'keywords', content: shareKeywords }),
           passwordLock && React__default.createElement('meta', { name: 'robots', content: 'noindex, nofollow' }),
           React__default.createElement('meta', { property: 'og:url', content: shareUrl, key: 'og:url' }),
           React__default.createElement('meta', { property: 'og:title', content: shareTitle, key: 'og:title' }),
@@ -476,7 +484,8 @@ var Article = function Article(props) {
           React__default.createElement('meta', { name: 'twitter:title', content: shareTitle, key: 'twitter:title' }),
           React__default.createElement('meta', { name: 'twitter:image', content: shareImage, key: 'twitter:image' }),
           React__default.createElement('meta', { name: 'twitter:site', content: '@' + props.Settings.title, key: 'twitter:site' }),
-          React__default.createElement('meta', { name: 'twitter:description', content: shareSummary, key: 'twitter:description' })
+          React__default.createElement('meta', { name: 'twitter:description', content: shareSummary, key: 'twitter:description' }),
+          React__default.createElement('link', { rel: 'canonical', href: shareUrl, key: 'canonical' })
         ),
         React__default.createElement(
           'h1',
@@ -797,6 +806,7 @@ var ArticleQueue = function ArticleQueue(props) {
   var changeMeta = function changeMeta(meta) {
     document.title = meta.shareTitle;
     document.querySelector('meta[name="description"]').setAttribute('content', meta.shareSummary);
+    document.querySelector('meta[name="keywords"]').setAttribute('content', meta.shareKeywords);
     document.querySelector('meta[property="og:url"]').setAttribute('content', meta.shareUrl);
     document.querySelector('meta[property="og:title"]').setAttribute('content', meta.shareTitle);
     document.querySelector('meta[property="og:site_name"]').setAttribute('content', meta.shareVia);
@@ -805,6 +815,7 @@ var ArticleQueue = function ArticleQueue(props) {
     document.querySelector('meta[name="twitter:image"]').setAttribute('content', meta.shareImage);
     document.querySelector('meta[name="twitter:site"]').setAttribute('content', meta.shareVia);
     document.querySelector('meta[name="twitter:description"]').setAttribute('content', meta.shareSummary);
+    document.querySelector('link[rel="canonical"]').setAttribute('href', meta.shareUrl);
   };
 
   var onChangeArticle = function onChangeArticle(path, visibility, meta) {

package/dist/esm/GridContent.js

@@ -350,14 +350,19 @@ var GridContent = function (_React$Component) {
         var data = this.state.data.slice(3);
 
         //  Need to pass flag "lgInfeedAd={true}" along with brandInsight from site level for large infeed-ad to render
-        //  Checking lgInfeedAd flag in desktop view ( window >= 1200px ).
-        if (lgInfeedAd && window && window.innerWidth >= 1200) {
+        //  Checking lgInfeedAd flag in desktop view ( window >= 1400px ).
+        if (lgInfeedAd && typeof window !== 'undefined' && window.innerWidth >= 1400) {
           var lgInFeedAd = {
             _type: 'lg-infeed',
             adUnit: brandInsight.adUnit,
             className: 'lg-infeed',
             networkID: brandInsight.networkID,
             sizes: [728, 90],
+            //  Adding sizeMapping for showing ad above 1400px
+            sizeMapping: [{
+              viewport: [1400, 0],
+              sizes: [[728, 90]]
+            }, { viewport: [0, 0], sizes: [] }],
             targeting: {
               content_placement: brandInsight.targeting.content_placement,
               document_url: brandInsight.targeting.document_url
@@ -377,8 +382,8 @@ var GridContent = function (_React$Component) {
         }
 
         if (showBI) {
-          //  Checking lgInfeedAd flag in desktop view ( window >= 1200px ).
-          if (lgInfeedAd && window && window.innerWidth >= 1200) {
+          //  Checking lgInfeedAd flag in desktop view ( window >= 1400px ).
+          if (lgInfeedAd && typeof window !== 'undefined' && window.innerWidth >= 1400) {
             brandInsight.interval = 8;
           } else {
             brandInsight.interval = 5;

package/dist/esm/QueueDeckExpanded.js

@@ -155,14 +155,19 @@ var cardLoader = function cardLoader(data, builder, mapping, values, seoPaginate
   };
 
   //  Need to pass flag "lgInfeedAd={true}" along with brandInsightAd from site level for large infeed-ad to render
-  //  Checking lgInfeedAd flag in desktop view ( window >= 1200px ).
-  if (lgInfeedAd && brandInsightAd && window && window.innerWidth >= 1200) {
+  //  Checking window and lgInfeedAd flag in desktop view ( window >= 1400px ).
+  if (lgInfeedAd && brandInsightAd && typeof window !== 'undefined' && window.innerWidth >= 1400) {
     var lgInfeed = {
       _type: 'lg-infeed',
       adUnit: brandInsightAd.adUnit,
       className: 'lg-infeed',
       networkID: brandInsightAd.networkID,
       sizes: [728, 90],
+      //  Adding sizeMapping for showing ad above 1400px
+      sizeMapping: [{
+        viewport: [1400, 0],
+        sizes: [[728, 90]]
+      }, { viewport: [0, 0], sizes: [] }],
       targeting: {
         content_placement: brandInsightAd.targeting.content_placement,
         document_url: brandInsightAd.targeting.document_url
@@ -182,8 +187,8 @@ var cardLoader = function cardLoader(data, builder, mapping, values, seoPaginate
   }
 
   if (showBI && brandInsightAd) {
-    //  Checking lgInfeedAd flag in desktop view ( window >= 1200px ).
-    if (lgInfeedAd && window && window.innerWidth >= 1200) brandInsightAd.interval = 8;
+    //  Checking window and lgInfeedAd flag in desktop view ( window >= 1400px ).
+    if (lgInfeedAd && typeof window !== 'undefined' && window.innerWidth >= 1400) brandInsightAd.interval = 8;
     var pos = 0;
     for (var i = 1; pos < data.length; i++) {
       var inFeedAd = {
@@ -558,7 +563,7 @@ var cardLoader = function cardLoader(data, builder, mapping, values, seoPaginate
     React__default.createElement(
       'style',
       { jsx: 'true' },
-      '\n          .displayLabelThumb{\n            margin: 0 auto;\n            margin-top: -1.25rem;\n            background-color: white;\n            position: relative;\n          }\n          .sanityDisplayLabel {\n            margin: 0.5rem 0;\n            border: 1px solid black;\n            width: fit-content;\n            padding: 5px;\n            color: var(--franchise-primary, #484848);\n            border-radius: 2px;\n          }\n          .feature-media > .media-body {\n            -webkit-box-flex: none;\n            -ms-flex: none;\n            flex: none;\n          }\n          .img-wrapper img {\n            max-height: 240px;\n            height: auto;\n            width: 100%;\n            object-fit: contain;\n          }\n          .feature-wrapper {\n            height: 100%;\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 > 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 !important;\n            }\n          }\n        '
+      '\n          .displayLabelThumb {\n            margin: 0 auto;\n            margin-top: -1.25rem;\n            background-color: white;\n            position: relative;\n          }\n          .sanityDisplayLabel {\n            margin: 0.5rem 0;\n            border: 1px solid black;\n            width: fit-content;\n            padding: 5px;\n            color: var(--franchise-primary, #484848);\n            border-radius: 2px;\n          }\n          .feature-media > .media-body {\n            -webkit-box-flex: none;\n            -ms-flex: none;\n            flex: none;\n          }\n          .img-wrapper img {\n            max-height: 240px;\n            height: auto;\n            width: 100%;\n            object-fit: contain;\n          }\n          .feature-wrapper {\n            height: 100%;\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 > 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 !important;\n            }\n          }\n        '
     )
   );
 };

package/dist/esm/View.js

@@ -52,6 +52,7 @@ import getSerializers from './getSerializers.js';
 import './util-7700fc59.js';
 import 'react-bootstrap/Pagination';
 import 'next/dynamic';
+import getKeywords from './getKeywords.js';
 import { a as getContentPlacementUrl, g as getTargeting } from './getTargeting-8f4bd5db.js';
 import urlFor from './urlFor.js';
 
@@ -588,6 +589,7 @@ var Article = function Article(props) {
     var shareSummary = article.summary;
     var shareImage = thumbnail && thumbnail.asset ? urlFor(props.client, thumbnail.asset).url() : shareImageDefault;
     var siteName = props.website && props.website.title ? props.website.title : '';
+    var shareKeywords = getKeywords(props.article).join(',');
 
     var meta = {
       shareTitle: shareTitle,
@@ -595,7 +597,8 @@ var Article = function Article(props) {
       shareSummary: shareSummary,
       shareUrl: shareUrl,
       shareImage: shareImage,
-      shareVia: props.Settings.title
+      shareVia: props.Settings.title,
+      shareKeywords: shareKeywords
     };
     if (!props.infiniteScroll) {
       onChangeArticle = function onChangeArticle() {
@@ -964,6 +967,7 @@ var ArticleQueue = function ArticleQueue(props) {
   var changeMeta = function changeMeta(meta) {
     document.title = meta.shareTitle;
     document.querySelector('meta[name="description"]').setAttribute('content', meta.shareSummary);
+    document.querySelector('meta[name="keywords"]').setAttribute('content', meta.shareKeywords);
     document.querySelector('meta[property="og:url"]').setAttribute('content', meta.shareUrl);
     document.querySelector('meta[property="og:title"]').setAttribute('content', meta.shareTitle);
     document.querySelector('meta[property="og:site_name"]').setAttribute('content', meta.shareVia);
@@ -972,6 +976,7 @@ var ArticleQueue = function ArticleQueue(props) {
     document.querySelector('meta[name="twitter:image"]').setAttribute('content', meta.shareImage);
     document.querySelector('meta[name="twitter:site"]').setAttribute('content', meta.shareVia);
     document.querySelector('meta[name="twitter:description"]').setAttribute('content', meta.shareSummary);
+    document.querySelector('link[rel="canonical"]').setAttribute('href', meta.shareUrl);
   };
 
   var onChangeArticle = function onChangeArticle(path, visibility, meta) {
@@ -1134,6 +1139,7 @@ var View = function View(props) {
         article.title + ' | ' + props.cache.siteSettingCache.name
       ),
       React__default.createElement('meta', { name: 'description', key: 'description', content: shareOptions.shareSummary }),
+      React__default.createElement('meta', { name: 'keywords', content: getKeywords(article).join(','), key: 'keywords' }),
       passwordLock && React__default.createElement('meta', { name: 'robots', content: 'noindex, nofollow' }),
       React__default.createElement('meta', { property: 'og:url', content: shareOptions.shareUrl, key: 'og:url' }),
       React__default.createElement('meta', { property: 'og:title', content: shareOptions.shareTitle, key: 'og:title' }),
@@ -1145,6 +1151,7 @@ var View = function View(props) {
       React__default.createElement('meta', { name: 'twitter:image', content: shareOptions.shareImage, key: 'twitter:image' }),
       React__default.createElement('meta', { name: 'twitter:site', content: '@' + props.Settings.title, key: 'twitter:site' }),
       React__default.createElement('meta', { name: 'twitter:description', content: shareOptions.shareSummary, key: 'twitter:description' }),
+      React__default.createElement('link', { rel: 'canonical', href: shareOptions.shareUrl, key: 'canonical' }),
       React__default.createElement(
         'noscript',
         null,

package/dist/esm/getKeywords.js

@@ -2,24 +2,39 @@ var getKeywords = function getKeywords(article) {
   var keywords = [];
   var internalTag = article.internalTag,
       userDefinedTag = article.userDefinedTag,
-      SponsorshipTag = article.SponsorshipTag;
+      SponsorshipTag = article.SponsorshipTag,
+      seoTag = article.seoTag;
 
 
   if (internalTag) {
     internalTag.map(function (item) {
-      keywords.push(item);
+      if (!keywords.includes(item)) {
+        keywords.push(item);
+      }
     });
   }
 
   if (userDefinedTag) {
     userDefinedTag.map(function (item) {
-      keywords.push(item);
+      if (!keywords.includes(item)) {
+        keywords.push(item);
+      }
     });
   }
 
   if (SponsorshipTag) {
     SponsorshipTag.map(function (item) {
-      keywords.push(item);
+      if (!keywords.includes(item)) {
+        keywords.push(item);
+      }
+    });
+  }
+
+  if (seoTag) {
+    seoTag.map(function (item) {
+      if (!keywords.includes(item)) {
+        keywords.push(item);
+      }
     });
   }
 

package/dist/esm/index.js

@@ -136,6 +136,7 @@ export { default as getSerializers } from './getSerializers.js';
 import './util-7700fc59.js';
 import 'react-bootstrap/Pagination';
 import 'next/dynamic';
+export { default as getKeywords } from './getKeywords.js';
 export { default as ArticleQueue } from './ArticleQueue.js';
 export { default as RelatedContent } from './RelatedContent.js';
 export { default as ForbesHero } from './ForbesHero.js';
@@ -156,5 +157,4 @@ import 'mysql';
 export { default as View } from './View.js';
 export { g as getTargeting } from './getTargeting-8f4bd5db.js';
 export { default as urlFor } from './urlFor.js';
-export { default as getKeywords } from './getKeywords.js';
 export { default as getQuery } from './getQuery.js';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mjhls/mjh-framework",
-  "version": "1.0.457",
+  "version": "1.0.459",
   "description": "Foundation Framework",
   "author": "mjh-framework",
   "license": "MIT",