@mjhls/mjh-framework 1.0.691 → 1.0.693

package/README.md

@@ -1,5 +1,5 @@
 
-# mjh-framework v. 1.0.690
+# mjh-framework v. 1.0.693
 
 > Foundation Framework 
 

package/dist/cjs/AccordionPanel.js

@@ -11,7 +11,7 @@ var React = require('react');
 var React__default = _interopDefault(React);
 var slicedToArray = require('./slicedToArray-8f385299.js');
 require('./iconBase-68959171.js');
-var index_esm = require('./index.esm-876ca9ff.js');
+var index_esm = require('./index.esm-90433435.js');
 var Accordion = _interopDefault(require('react-bootstrap/Accordion'));
 var AccordionToggle = require('react-bootstrap/AccordionToggle');
 

package/dist/cjs/ArticleSeriesListing.js

@@ -20,7 +20,7 @@ var React__default = _interopDefault(React);
 var index = require('./index-2d0a4911.js');
 require('prop-types');
 var Container = _interopDefault(require('react-bootstrap/Container'));
-require('./moment-66a6a284.js');
+var moment = require('./moment-66a6a284.js');
 var Router = require('next/router');
 var Router__default = _interopDefault(Router);
 require('./isSymbol-04666465.js');
@@ -34,7 +34,7 @@ require('./slicedToArray-8f385299.js');
 require('./smoothscroll-95231a70.js');
 var YoutubeGroup = require('./YoutubeGroup.js');
 require('./iconBase-68959171.js');
-var index_esm = require('./index.esm-876ca9ff.js');
+var index_esm = require('./index.esm-90433435.js');
 
 var ArticleSeriesListing = function (_React$Component) {
   inherits._inherits(ArticleSeriesListing, _React$Component);
@@ -50,8 +50,29 @@ var ArticleSeriesListing = function (_React$Component) {
       args[_key] = arguments[_key];
     }
 
-    return _ret = (_temp = (_this = inherits._possibleConstructorReturn(this, (_ref = ArticleSeriesListing.__proto__ || inherits._Object$getPrototypeOf(ArticleSeriesListing)).call.apply(_ref, [this].concat(args))), _this), _this.page = _this.props.page, _this.mapping = _this.props.mapping, _this.data = _this.props.dataRecord, _this.query = _this.props.query, _this.params = _this.props.params, _this.autoScroll = _this.props.autoScroll ? _this.props.autoScroll : false, _this.dataArr = [_this.data], _this.defaultImage = _this.props.defaultImage ? _this.props.defaultImage : '/placeholder.jpg', _this.state = {
-      data: _this.dataArr,
+    return _ret = (_temp = (_this = inherits._possibleConstructorReturn(this, (_ref = ArticleSeriesListing.__proto__ || inherits._Object$getPrototypeOf(ArticleSeriesListing)).call.apply(_ref, [this].concat(args))), _this), _this.page = _this.props.page, _this.mapping = _this.props.mapping, _this.data = _this.props.dataRecord, _this.query = _this.props.query, _this.params = _this.props.params, _this.autoScroll = _this.props.autoScroll ? _this.props.autoScroll : false, _this.today = moment.moment().utc().format(), _this.dataArr = [_this.data], _this.defaultImage = _this.props.defaultImage ? _this.props.defaultImage : '/placeholder.jpg', _this.state = {
+      data: _this.dataArr.map(function (item) {
+        var tempObj = item;
+        if (tempObj.body) {
+          var filteredBody = tempObj.body.map(function (item) {
+            if (item._type === 'articleSeries') {
+              var innerObj = item;
+              var filteredArticles = innerObj.articles.filter(function (article) {
+                if ((article.is_visible === true || !article.hasOwnProperty('is_visible')) && _this.today >= article.published) {
+                  return article;
+                }
+              });
+              innerObj.body = filteredArticles;
+              return innerObj;
+            } else {
+              return item;
+            }
+          });
+
+          tempObj.body = filteredBody;
+        }
+        return tempObj;
+      }),
       per: _this.params ? _this.params.to : 2,
       page: _this.props.currentPage || 1,
       from: _this.params ? _this.params.from : 0,

package/dist/cjs/ExternalResources.js

@@ -44,9 +44,11 @@ var BlockContent = require('./BlockContent-88f69acd.js');
 require('./smoothscroll-95231a70.js');
 require('./GroupDeck.js');
 require('react-bootstrap');
+require('./iconBase-68959171.js');
+require('./index.esm-90433435.js');
 var Button = _interopDefault(require('react-bootstrap/Button'));
 var index$3 = require('./index-5be2866f.js');
-var getSerializers = require('./index-44c25825.js');
+var getSerializers = require('./index-59436c13.js');
 require('./util-f2c1b65b.js');
 require('./brightcove-react-player-loader.es-156bd4d6.js');
 require('react-bootstrap/Pagination');

package/dist/cjs/HamMagazine.js

@@ -22,7 +22,7 @@ require('./_set-species-f92c67c5.js');
 var Segment = require('./Segment.js');
 require('./react-social-icons-f7f48f71.js');
 require('./iconBase-68959171.js');
-var index_esm = require('./index.esm-876ca9ff.js');
+var index_esm = require('./index.esm-90433435.js');
 require('react-bootstrap/Button');
 require('react-bootstrap/Form');
 var Nav = _interopDefault(require('react-bootstrap/Nav'));

package/dist/cjs/NavMagazine.js

@@ -22,7 +22,7 @@ require('./_set-species-f92c67c5.js');
 var Segment = require('./Segment.js');
 require('./react-social-icons-f7f48f71.js');
 require('./iconBase-68959171.js');
-var index_esm = require('./index.esm-876ca9ff.js');
+var index_esm = require('./index.esm-90433435.js');
 require('react-bootstrap/Button');
 require('react-bootstrap/Form');
 var Nav = _interopDefault(require('react-bootstrap/Nav'));

package/dist/cjs/NavNative.js

@@ -157,6 +157,9 @@ var NavNative = function NavNative(props) {
   var toggleClass = function toggleClass(selector, type, addOn) {
     if (type === 'id') {
       var searchBar = document.getElementById(selector);
+      // Aligning search bar below the searchbutton
+      var socialComponent = document.getElementById('search-content-desktop').getBoundingClientRect();
+      searchBar.style.right = window.innerWidth - socialComponent.left + 'px';
       if (searchBar && searchBar.classList && searchBar.classList.contains(addOn)) {
         searchBar.classList.remove(addOn);
       } else if (searchBar && searchBar.classList) {
@@ -226,7 +229,31 @@ var NavNative = function NavNative(props) {
     } else if (type === 'desktop') {
       return React__default.createElement(
         'div',
-        { id: 'search-content-desktop' },
+        null,
+        React__default.createElement(
+          'div',
+          { id: 'search-content-desktop' },
+          React__default.createElement(
+            iconBase.IconContext.Provider,
+            { value: { color: socialIconVariant === 'light' ? 'white' : 'black', className: 'search-btn-desktop', size: '50px' } },
+            React__default.createElement(index_esm$2.GoSearch, {
+              onClick: function onClick() {
+                toggleClass('search-bar-desktop', 'id', 'show');
+                toggleClass('search-btn-desktop', 'class', 'active-search');
+              }
+            })
+          ),
+          website && website.socialLinks && website.socialLinks.length !== 0 && React__default.createElement(
+            'div',
+            { id: 'social-tab-desktop', style: { display: 'flex' } },
+            website.socialLinks && React__default.createElement(SocialIcons, { socialLinks: website.socialLinks, variant: socialIconVariant })
+          ),
+          React__default.createElement(
+            'style',
+            { jsx: 'true' },
+            '\n              #social-tab-desktops {\n                position: relative;\n                display: flex;\n                left: 0px;\n              }\n              #social-tab-desktops svg {\n                height: 25px !important;\n                width: 25px !important;\n              }\n              @media screen and (max-width: 1191px) {\n                #search-content-desktop {\n                  display: none !important;\n                }\n              }\n              @media screen and (min-width: 1199px) {\n                .mobile-nav {\n                  width: 100% !important;\n                }\n              }\n              #search-content-desktop {\n                display: flex;\n                padding-top: 2px;\n                height: 35px;\n                position: relative;\n              }\n              .search-btn-desktop {\n                padding: 5px;\n                height: 35px;\n                width: 35px;\n                margin: -3px 0px 0px 0px;\n                cursor: pointer;\n              }\n              #search-bar-desktop {\n                display: none;\n                background-color: var(--primary);\n                position: fixed;\n                width: 400px;\n                border-radius: 5px;\n                height: 48px;\n                top: 105px;\n              }\n              #search-bar-desktop .form-inline {\n                padding: 5px;\n              }\n              #search-bar-desktop .form-inline .form-control {\n                width: 78%;\n                border-radius: 5px;\n              }\n              #search-bar-desktop .form-inline .btn {\n                width: 20%;\n                border-radius: 5px;\n                padding: 7px;\n                margin-left: 5px;\n              }\n              .show {\n                display: block !important;\n              }\n              .active-search {\n                border-radius: 5px;\n                border: 1px solid var(--secondary);\n                margin-right: 1px !important;\n              }\n              #basic-navbar-nav {\n                margin-right: 20%;\n              }\n            '
+          )
+        ),
         React__default.createElement(
           'div',
           { id: 'search-bar-desktop' },
@@ -246,26 +273,6 @@ var NavNative = function NavNative(props) {
               'Search'
             )
           )
-        ),
-        React__default.createElement(
-          iconBase.IconContext.Provider,
-          { value: { color: socialIconVariant === 'light' ? 'white' : 'black', className: 'search-btn-desktop', size: '50px' } },
-          React__default.createElement(index_esm$2.GoSearch, {
-            onClick: function onClick() {
-              toggleClass('search-bar-desktop', 'id', 'show');
-              toggleClass('search-btn-desktop', 'class', 'active-search');
-            }
-          })
-        ),
-        website && website.socialLinks && website.socialLinks.length !== 0 && React__default.createElement(
-          'div',
-          { id: 'social-tab-desktop', style: { display: 'flex' } },
-          website.socialLinks && React__default.createElement(SocialIcons, { socialLinks: website.socialLinks, variant: socialIconVariant })
-        ),
-        React__default.createElement(
-          'style',
-          { jsx: 'true' },
-          '\n            #social-tab-desktops {\n              position: relative;\n              display: flex;\n              left: 0px;\n            }\n            #social-tab-desktops svg {\n              height: 25px !important;\n              width: 25px !important;\n            }\n            @media screen and (max-width: 1191px) {\n              #search-content-desktop {\n                display: none !important;\n              }\n            }\n            @media screen and (min-width: 1199px) {\n              .mobile-nav {\n                width: 100% !important;\n              }\n            }\n            #search-content-desktop {\n              display: flex;\n              padding-top: 2px;\n              height: 35px;\n              position: fixed;\n              right: 5%;\n              top: 12px;\n            }\n            #search-content-desktop .search-btn-desktop {\n              padding: 5px;\n              height: 35px;\n              width: 35px;\n              margin: -3px 0px 0px 0px;\n              cursor: pointer;\n            }\n            #search-content-desktop #search-bar-desktop {\n              display: none;\n              background-color: var(--primary);\n              position: relative;\n              width: 400px;\n              border-radius: 5px;\n              height: 48px;\n              top: 50px;\n            }\n            #search-content-desktop #search-bar-desktop .form-inline {\n              padding: 5px;\n            }\n            #search-content-desktop #search-bar-desktop .form-inline .form-control {\n              width: 78%;\n              border-radius: 5px;\n            }\n            #search-content-desktop #search-bar-desktop .form-inline .btn {\n              width: 20%;\n              border-radius: 5px;\n              padding: 7px;\n              margin-left: 5px;\n            }\n            .show {\n              display: block !important;\n            }\n            .active-search {\n              border-radius: 5px;\n              border: 1px solid var(--secondary);\n              margin-right: 1px !important;\n            }\n            #basic-navbar-nav {\n              margin-right: 20%;\n            }\n          '
         )
       );
     }

package/dist/cjs/PartnerDetailListing.js

@@ -54,8 +54,10 @@ require('./GroupDeck.js');
 require('react-bootstrap');
 require('./timeDifferenceCalc.js');
 var QueueDeckExpanded = require('./QueueDeckExpanded.js');
+require('./iconBase-68959171.js');
+require('./index.esm-90433435.js');
 require('react-bootstrap/Button');
-var getSerializers = require('./index-44c25825.js');
+var getSerializers = require('./index-59436c13.js');
 require('./util-f2c1b65b.js');
 require('./brightcove-react-player-loader.es-156bd4d6.js');
 require('react-bootstrap/Pagination');

package/dist/cjs/TemplateNormal.js

@@ -33,7 +33,7 @@ require('./get-68c52cb1.js');
 require('./react-social-icons-f7f48f71.js');
 require('react-bootstrap');
 require('./iconBase-68959171.js');
-require('./index.esm-876ca9ff.js');
+require('./index.esm-90433435.js');
 require('react-bootstrap/Button');
 require('./defineProperty-55548b25.js');
 require('react-bootstrap/Form');

package/dist/cjs/Ustream.js

@@ -12,7 +12,7 @@ var React__default = _interopDefault(React);
 var main = require('./main-b6c96c8d.js');
 var slicedToArray = require('./slicedToArray-8f385299.js');
 require('./iconBase-68959171.js');
-var index_esm = require('./index.esm-876ca9ff.js');
+var index_esm = require('./index.esm-90433435.js');
 var index_esm$3 = require('./index.esm-ff47db6f.js');
 
 var Ustream = function Ustream(_ref) {

package/dist/cjs/VideoSeriesListing.js

@@ -20,6 +20,7 @@ var React__default = _interopDefault(React);
 var index = require('./index-2d0a4911.js');
 require('prop-types');
 var Container = _interopDefault(require('react-bootstrap/Container'));
+var moment = require('./moment-66a6a284.js');
 var Router = require('next/router');
 var Router__default = _interopDefault(Router);
 require('./isSymbol-04666465.js');
@@ -33,7 +34,7 @@ require('./slicedToArray-8f385299.js');
 require('./smoothscroll-95231a70.js');
 var YoutubeGroup = require('./YoutubeGroup.js');
 require('./iconBase-68959171.js');
-var index_esm = require('./index.esm-876ca9ff.js');
+var index_esm = require('./index.esm-90433435.js');
 
 var VideoSeriesListing = function (_React$Component) {
   inherits._inherits(VideoSeriesListing, _React$Component);
@@ -49,8 +50,29 @@ var VideoSeriesListing = function (_React$Component) {
       args[_key] = arguments[_key];
     }
 
-    return _ret = (_temp = (_this = inherits._possibleConstructorReturn(this, (_ref = VideoSeriesListing.__proto__ || inherits._Object$getPrototypeOf(VideoSeriesListing)).call.apply(_ref, [this].concat(args))), _this), _this.page = _this.props.page, _this.mapping = _this.props.mapping, _this.data = _this.props.dataRecord, _this.query = _this.props.query, _this.params = _this.props.params, _this.dataArr = [_this.data], _this.defaultImage = _this.props.defaultImage ? _this.props.defaultImage : '/placeholder.jpg', _this.state = {
-      data: _this.dataArr,
+    return _ret = (_temp = (_this = inherits._possibleConstructorReturn(this, (_ref = VideoSeriesListing.__proto__ || inherits._Object$getPrototypeOf(VideoSeriesListing)).call.apply(_ref, [this].concat(args))), _this), _this.page = _this.props.page, _this.mapping = _this.props.mapping, _this.data = _this.props.dataRecord, _this.query = _this.props.query, _this.params = _this.props.params, _this.today = moment.moment().utc().format(), _this.dataArr = [_this.data], _this.defaultImage = _this.props.defaultImage ? _this.props.defaultImage : '/placeholder.jpg', _this.state = {
+      data: _this.dataArr.map(function (item) {
+        var tempObj = item;
+        if (tempObj.body) {
+          var filteredBody = tempObj.body.map(function (item) {
+            if (item._type === 'articleSeries') {
+              var innerObj = item;
+              var filteredArticles = innerObj.articles.filter(function (article) {
+                if ((article.is_visible === true || !article.hasOwnProperty('is_visible')) && (_this.today >= article.published || !article.hasOwnProperty('published'))) {
+                  return article;
+                }
+              });
+              innerObj.body = filteredArticles;
+              return innerObj;
+            } else {
+              return item;
+            }
+          });
+
+          tempObj.body = filteredBody;
+        }
+        return tempObj;
+      }),
       per: _this.params ? _this.params.to : 2,
       page: _this.props.currentPage || 1,
       from: _this.params ? _this.params.from : 0,
@@ -323,7 +345,16 @@ var VideoSeriesListing = function (_React$Component) {
                   'button',
                   {
                     className: 'btn',
-                    style: { margin: '0 auto 2rem', display: 'block', fontSize: '18px', padding: '.5rem 1.5rem', boxShadow: '1px 2px 4px 4px rgba(0,0,0,.15)', background: 'var(--primary)', color: '#fff', borderRadius: '5px' },
+                    style: {
+                      margin: '0 auto 2rem',
+                      display: 'block',
+                      fontSize: '18px',
+                      padding: '.5rem 1.5rem',
+                      boxShadow: '1px 2px 4px 4px rgba(0,0,0,.15)',
+                      background: 'var(--primary)',
+                      color: '#fff',
+                      borderRadius: '5px'
+                    },
                     onClick: function onClick(e) {
                       e.target.style.display = 'none';
                       _this2.loadMore();

package/dist/cjs/View.js

@@ -46,10 +46,11 @@ require('./smoothscroll-95231a70.js');
 require('./GroupDeck.js');
 require('react-bootstrap');
 require('./iconBase-68959171.js');
+require('./index.esm-90433435.js');
 var Button = _interopDefault(require('react-bootstrap/Button'));
 var defineProperty$1 = require('./defineProperty-55548b25.js');
 var Form = _interopDefault(require('react-bootstrap/Form'));
-var getSerializers = require('./index-44c25825.js');
+var getSerializers = require('./index-59436c13.js');
 require('./util-f2c1b65b.js');
 require('./brightcove-react-player-loader.es-156bd4d6.js');
 require('react-bootstrap/Pagination');

package/dist/cjs/getSerializers.js

@@ -40,8 +40,10 @@ require('./BlockContent-88f69acd.js');
 require('./smoothscroll-95231a70.js');
 require('./GroupDeck.js');
 require('react-bootstrap');
+require('./iconBase-68959171.js');
+require('./index.esm-90433435.js');
 require('react-bootstrap/Button');
-var getSerializers = require('./index-44c25825.js');
+var getSerializers = require('./index-59436c13.js');
 require('./util-f2c1b65b.js');
 require('./brightcove-react-player-loader.es-156bd4d6.js');
 require('react-bootstrap/Pagination');

package/dist/cjs/{index-44c25825.js → index-59436c13.js}

@@ -29,6 +29,7 @@ var BlockContent = require('./BlockContent-88f69acd.js');
 var smoothscroll = require('./smoothscroll-95231a70.js');
 var GroupDeck = require('./GroupDeck.js');
 var reactBootstrap = require('react-bootstrap');
+var index_esm = require('./index.esm-90433435.js');
 var Button = _interopDefault(require('react-bootstrap/Button'));
 var util = require('./util-f2c1b65b.js');
 var brightcoveReactPlayerLoader_es = require('./brightcove-react-player-loader.es-156bd4d6.js');
@@ -8026,6 +8027,7 @@ var ArticleSeries = function ArticleSeries(_ref) {
     return null;
   }
   nodes.seriesTitle = !nodes.seriesTitle ? 'Learning Objectives' : nodes.seriesTitle;
+  var today = moment.moment().utc().format();
 
   var authorPrefix = 'authors';
   var builder = index$1.imageUrlBuilder(client);
@@ -8036,28 +8038,38 @@ var ArticleSeries = function ArticleSeries(_ref) {
 
   var refArray = React.useRef([]);
   var adRefArray = React.useRef([]);
+  var articleContainerRef = React.useRef(null);
+  var arrowRef = React.useRef(null);
 
-  var _ref2 = main.main_39 ? React.useState(100) : React.useState(-25),
-      _ref3 = slicedToArray._slicedToArray(_ref2, 2),
-      NavoffsetTop = _ref3[0],
-      setNavoffsetTop = _ref3[1];
+  var _useState = React.useState(0),
+      _useState2 = slicedToArray._slicedToArray(_useState, 2),
+      contentWidth = _useState2[0],
+      setContentWidth = _useState2[1];
+
+  var upArrowClicked = false;
+
+  var Articles = nodes.articles.filter(function (article) {
+    if ((article.is_visible === true || !article.hasOwnProperty('is_visible')) && today >= article.published) {
+      return article;
+    }
+  });
 
   var PrevNextCards = function PrevNextCards(show, articleNum) {
     var articles = [];
     if (articleNum >= 0) {
       if (articleNum == 0) {
-        articles.push(nodes.articles[1]);
-      } else if (articleNum == nodes.articles.length - 1) {
-        articles.push(nodes.articles[articleNum - 1]);
+        articles.push(Articles[1]);
+      } else if (articleNum == Articles.length - 1) {
+        articles.push(Articles[articleNum - 1]);
       } else {
-        articles.push(nodes.articles[articleNum - 1]);
-        articles.push(nodes.articles[articleNum + 1]);
+        articles.push(Articles[articleNum - 1]);
+        articles.push(Articles[articleNum + 1]);
       }
     } else {
-      articles = [].concat(toConsumableArray._toConsumableArray(nodes.articles));
+      articles = [].concat(toConsumableArray._toConsumableArray(Articles));
     }
     return articles.map(function (article, index) {
-      if (!article) return null;
+      if (!article || !article.is_visible && article.hasOwnProperty('is_visible') || today < article.published) return null;
       var showReading = show ? 'showReading' : '';
       var articleLabel = articles.length == 1 && articleNum != 0 || articles.length > 1 && index == 0 ? 'Previous' : 'Next';
       return React__default.createElement(
@@ -8097,35 +8109,35 @@ var ArticleSeries = function ArticleSeries(_ref) {
     });
   };
 
-  var _ref4 = router && router.asPath && router.asPath.split('?')[1] ? React.useState(router.asPath.split('=')[1]) : React.useState(null),
-      _ref5 = slicedToArray._slicedToArray(_ref4, 2),
-      selectedArticle = _ref5[0],
-      setSelectedArticle = _ref5[1];
-
-  var _useState = React.useState(false),
-      _useState2 = slicedToArray._slicedToArray(_useState, 2),
-      firstLoad = _useState2[0],
-      setFirstLoad = _useState2[1];
+  var _ref2 = router && router.asPath && router.asPath.split('?')[1] ? React.useState(router.asPath.split('=')[1]) : React.useState(null),
+      _ref3 = slicedToArray._slicedToArray(_ref2, 2),
+      selectedArticle = _ref3[0],
+      setSelectedArticle = _ref3[1];
 
-  var _useState3 = React.useState(null),
+  var _useState3 = React.useState(false),
       _useState4 = slicedToArray._slicedToArray(_useState3, 2),
-      currentURL = _useState4[0],
-      setCurrentURL = _useState4[1];
+      firstLoad = _useState4[0],
+      setFirstLoad = _useState4[1];
 
   var _useState5 = React.useState(null),
       _useState6 = slicedToArray._slicedToArray(_useState5, 2),
-      currentTitle = _useState6[0],
-      setCurrentTitle = _useState6[1];
+      currentURL = _useState6[0],
+      setCurrentURL = _useState6[1];
 
   var _useState7 = React.useState(null),
       _useState8 = slicedToArray._slicedToArray(_useState7, 2),
-      currentSummary = _useState8[0],
-      setCurrentSummary = _useState8[1];
+      currentTitle = _useState8[0],
+      setCurrentTitle = _useState8[1];
 
   var _useState9 = React.useState(null),
       _useState10 = slicedToArray._slicedToArray(_useState9, 2),
-      currentThumbnail = _useState10[0],
-      setCurrentThumbnail = _useState10[1];
+      currentSummary = _useState10[0],
+      setCurrentSummary = _useState10[1];
+
+  var _useState11 = React.useState(null),
+      _useState12 = slicedToArray._slicedToArray(_useState11, 2),
+      currentThumbnail = _useState12[0],
+      setCurrentThumbnail = _useState12[1];
 
   var articleCardClickHandler = function articleCardClickHandler(e) {
     e.preventDefault();
@@ -8133,15 +8145,6 @@ var ArticleSeries = function ArticleSeries(_ref) {
     setSelectedArticle(articleClicked);
     scrollToArticle(articleClicked);
   };
-
-  React.useEffect(function () {
-    try {
-      if (main.main_39) {
-        setNavoffsetTop(document.getElementById('navbar-ham').offsetHeight - 15);
-      }
-    } catch (e) {}
-  }, []);
-
   var scrollToArticle = function scrollToArticle(id) {
     var localArticleID = id ? id : selectedArticle;
     var findArticle = function findArticle(ref) {
@@ -8153,8 +8156,12 @@ var ArticleSeries = function ArticleSeries(_ref) {
     var indexOfRef = refArray.current.findIndex(findArticle);
 
     if (indexOfRef >= 0) {
-      //refArray.current[indexOfRef].wraperRef.current.scrollIntoView({ behavior: 'smooth' })
-      window.scrollTo({ top: refArray.current[indexOfRef].wraperRef.current.offsetTop - NavoffsetTop, behavior: 'smooth' });
+      var newOffsetTop = !firstLoad ? refArray.current[indexOfRef].wraperRef.current.offsetTop : refArray.current[indexOfRef].wraperRef.current.offsetTop + document.getElementsByTagName('header')[0].clientHeight;
+      console.dir(refArray.current[indexOfRef].wraperRef.current);
+      console.log(document.getElementsByTagName('header')[0].clientHeight);
+      console.log(refArray.current[indexOfRef].wraperRef.current.offsetTop);
+      window.scrollTo({ top: newOffsetTop, behavior: 'smooth' });
+      //refArray.current[indexOfRef].wraperRef.current.scrollIntoView({ behavior: 'smooth', block: 'start' })
     }
     setFirstLoad(true);
   };
@@ -8202,13 +8209,24 @@ var ArticleSeries = function ArticleSeries(_ref) {
 
   var scrollDirectionDetect = function scrollDirectionDetect(e) {
     var window = e.currentTarget;
-
     if (preVscroll > window.scrollY) {
       isScrollDown = false;
-    } else if (preVscroll < window.scrollY) {
+      if (window.scrollY > articleContainerRef.current.offsetTop) {
+        arrowRef.current.classList.add('showArrow');
+        arrowRef.current.classList.remove('hideArrow');
+      }
+    } else if (preVscroll > window.scrollY) {
       isScrollDown = true;
     }
     preVscroll = window.scrollY;
+    setContentWidth(articleContainerRef.current.offsetWidth);
+    if (preVscroll <= articleContainerRef.current.offsetTop) {
+      arrowRef.current.classList.remove('showArrow');
+      arrowRef.current.classList.add('hideArrow');
+    }
+    if (window.scrollY === 0 && upArrowClicked === true) {
+      upArrowClicked = false;
+    }
   };
 
   React.useEffect(function () {
@@ -8218,7 +8236,8 @@ var ArticleSeries = function ArticleSeries(_ref) {
     };
   });
 
-  React.useEffect(function () {
+  React.useLayoutEffect(function () {
+    console.log('useLayoutEffect');
     if (!firstLoad) {
       if (main.main_39) {
         grabLoadedAds();
@@ -8226,10 +8245,9 @@ var ArticleSeries = function ArticleSeries(_ref) {
         scrollToArticle();
       }
     }
-  }, []);
+  });
 
   var grabLoadedAds = function grabLoadedAds() {
-    console.dir(index.lib_3);
     index.lib_3.getGoogletag().then(function (googletag) {
       var checkIfReady = window.setInterval(function () {
         if (window.googletag && googletag.pubadsReady) {
@@ -8262,9 +8280,26 @@ var ArticleSeries = function ArticleSeries(_ref) {
     }
   };
 
+  var handleArrowClick = function handleArrowClick() {
+    isScrollDown = true;
+    upArrowClicked = true;
+    arrowRef.current.classList.add('hideArrow');
+    arrowRef.current.classList.remove('showArrow');
+    window.scrollTo({ top: 0, behavior: 'smooth' });
+    window.history.pushState({}, '', router.asPath.split('?')[0]);
+    document.title = nodes.seriesTitle;
+  };
+
   return React__default.createElement(
     React__default.Fragment,
     null,
+    React__default.createElement(
+      'div',
+      { ref: arrowRef, className: 'scrollToTopArrow hideArrow', onClick: function onClick() {
+          return handleArrowClick();
+        } },
+      React__default.createElement(index_esm.IoIosArrowDropupCircle, null)
+    ),
     React__default.createElement('hr', { className: 'article-seperater my-4' }),
     React__default.createElement(
       'div',
@@ -8308,8 +8343,8 @@ var ArticleSeries = function ArticleSeries(_ref) {
     ),
     React__default.createElement(
       'div',
-      { className: 'article-container', style: { marginBottom: '2rem' } },
-      nodes.articles.map(function (article, index) {
+      { ref: articleContainerRef, className: 'article-container', style: { marginBottom: '2rem' } },
+      Articles.map(function (article, index) {
         return React__default.createElement(
           'div',
           { key: article.title },
@@ -8324,8 +8359,10 @@ var ArticleSeries = function ArticleSeries(_ref) {
                 return refArray.current[index] = ele;
               },
               onChange: function onChange(visible) {
-                if (visible === 'top' || visible === 'bottom' || visible === 'small-top') {
-                  onChangeArticle(article.param.current, visible, article.title, article.summary, urlFor(article.thumbnail.asset).url());
+                if (!upArrowClicked) {
+                  if (visible === 'top' || visible === 'bottom' || visible === 'small-top') {
+                    onChangeArticle(article.param.current, visible, article.title, article.summary, urlFor(article.thumbnail.asset).url());
+                  }
                 }
               } },
             React__default.createElement(
@@ -8380,26 +8417,30 @@ var ArticleSeries = function ArticleSeries(_ref) {
                 }, client.config())),
                 React__default.createElement('hr', { className: 'article-seperater my-4' })
               ),
-              React__default.createElement(
-                'div',
-                { className: 'objective-prevNext-Wrapper' },
-                React__default.createElement(
-                  'h5',
-                  { className: 'objective-title' },
-                  nodes.seriesTitle
-                ),
+              Articles.length > 1 && React__default.createElement(
+                React__default.Fragment,
+                null,
                 React__default.createElement(
                   'div',
-                  { className: 'prevNextWrapper' },
-                  PrevNextCards(true, index)
-                )
-              ),
-              React__default.createElement('hr', { className: 'article-seperater' })
+                  { className: 'objective-prevNext-Wrapper' },
+                  React__default.createElement(
+                    'h5',
+                    { className: 'objective-title' },
+                    nodes.seriesTitle
+                  ),
+                  React__default.createElement(
+                    'div',
+                    { className: 'prevNextWrapper' },
+                    PrevNextCards(true, index)
+                  )
+                ),
+                React__default.createElement('hr', { className: 'article-seperater' })
+              )
             ),
             React__default.createElement(
               'div',
               { className: 'ad-box', style: { textAlign: 'center' } },
-              main.main_39 && nodes.articles.length - 1 !== index && Ads.map(function (ad, innerIndex) {
+              main.main_39 && Articles.length - 1 !== index && Ads.map(function (ad, innerIndex) {
                 if (innerIndex === 0) {
                   return React__default.createElement(
                     'div',
@@ -8427,7 +8468,7 @@ var ArticleSeries = function ArticleSeries(_ref) {
       React__default.createElement(
         'style',
         { jsx: 'true' },
-        '\n          .block-content > div p {\n            padding: 0;\n          }\n\n          h2.article-title {\n            padding: 0;\n            font-weight: 500;\n          }\n          h4.article-title {\n            padding: 0;\n            font-weight: 500;\n          }\n          h4.prevNext-title {\n            padding: 0;\n            font-size: 1rem;\n            font-weight: 500;\n          }\n          .article-wrapper {\n            border: 1px solid #252525;\n            border-radius: 5px;\n            padding: 1rem 1rem 0 1rem;\n            margin-bottom: 1rem;\n          }\n          .prevNext-reading {\n            margin-top: -10px;\n            width: 75%;\n            text-align: center;\n            background: white;\n            border: 1px solid #252525;\n            align-self: center;\n            display: none;\n          }\n          .showReading {\n            display: block;\n          }\n          .author-details-wrapper a {\n            color: #252525;\n          }\n          .objective-prevNext-Wrapper {\n            display: flex;\n            flex-direction: column;\n            justify-content: center;\n          }\n          .objective-title {\n            padding: 0 !important;\n          }\n          .prevNext-thumbnail {\n            display: flex;\n            flex-direction: column;\n            min-width: 225px;\n            max-width: 225px;\n            overflow: hidden;\n            align-items: center;\n            object-fit: contain;\n            border-radius: 15px;\n          }\n          .prevNext-thumbnail img {\n            height: 125px;\n            object-fit: contain;\n            border-radius: 15px;\n          }\n          .prevNext-summary {\n            text-align: center;\n          }\n          .prevNext-publishDate {\n            font-size: 0.75rem;\n            margin-top: 0.5rem;\n          }\n          .prevNext-title {\n            padding: 0 !important;\n            line-height: 1 !important;\n            font-weight: 500;\n          }\n          .prevNextWrapper {\n            display: flex;\n            flex-direction: row;\n            justify-content: space-evenly;\n            flex-wrap: wrap;\n          }\n          .prevNextWrapper a {\n            display: flex;\n            flex-direction: column;\n            color: #252525;\n            align-items: center;\n          }\n          .prevNextCards {\n            max-width: 250px;\n            margin-bottom: 1rem;\n          }\n          @media only screen and (max-width: 568px) {\n            .prevNextWrapper {\n              flex-direction: column;\n              align-items: center;\n            }\n            .prevNextCards {\n              margin-bottom: 2rem;\n            }\n          }\n          @media only screen and (max-width: 568px) {\n          }\n        '
+        '\n          .scrollToTopArrow {\n            position: fixed;\n            top: 150px;\n            display: flex;\n            justify-content: center;\n            width: ' + contentWidth + 'px;\n            opacity: 0;\n            z-index: 99999999999;\n            cursor: pointer;\n          }\n          .showArrow {\n            opacity: 1;\n          }\n          .hideArrow {\n            opacity: 0;\n          }\n          .scrollToTopArrow > svg {\n            min-height: 50px;\n            min-width: 50px;\n            max-height: 50px;\n            max-width: 50px;\n          }\n          .block-content > div p {\n            padding: 0;\n          }\n\n          h2.article-title {\n            padding: 0;\n            font-weight: 500;\n          }\n          h4.article-title {\n            padding: 0;\n            font-weight: 500;\n          }\n          h4.prevNext-title {\n            padding: 0;\n            font-size: 1rem;\n            font-weight: 500;\n          }\n          .article-wrapper {\n            border: 1px solid #252525;\n            border-radius: 5px;\n            padding: 1rem 1rem 0 1rem;\n            margin-bottom: 1rem;\n          }\n          .prevNext-reading {\n            margin-top: -10px;\n            width: 75%;\n            text-align: center;\n            background: white;\n            border: 1px solid #252525;\n            align-self: center;\n            display: none;\n          }\n          .showReading {\n            display: block;\n          }\n          .author-details-wrapper a {\n            color: #252525;\n          }\n          .objective-prevNext-Wrapper {\n            display: flex;\n            flex-direction: column;\n            justify-content: center;\n          }\n          .objective-title {\n            padding: 0 !important;\n          }\n          .prevNext-thumbnail {\n            display: flex;\n            flex-direction: column;\n            min-width: 225px;\n            max-width: 225px;\n            overflow: hidden;\n            align-items: center;\n            object-fit: contain;\n            border-radius: 15px;\n          }\n          .prevNext-thumbnail img {\n            height: 125px;\n            object-fit: contain;\n            border-radius: 15px;\n          }\n          .prevNext-summary {\n            text-align: center;\n          }\n          .prevNext-publishDate {\n            font-size: 0.75rem;\n            margin-top: 0.5rem;\n          }\n          .prevNext-title {\n            padding: 0 !important;\n            line-height: 1 !important;\n            font-weight: 500;\n          }\n          .prevNextWrapper {\n            display: flex;\n            flex-direction: row;\n            justify-content: space-evenly;\n            flex-wrap: wrap;\n          }\n          .prevNextWrapper a {\n            display: flex;\n            flex-direction: column;\n            color: #252525;\n            align-items: center;\n          }\n          .prevNextCards {\n            max-width: 250px;\n            margin-bottom: 1rem;\n          }\n          @media only screen and (max-width: 568px) {\n            .prevNextWrapper {\n              flex-direction: column;\n              align-items: center;\n            }\n            .prevNextCards {\n              margin-bottom: 2rem;\n            }\n          }\n          @media only screen and (max-width: 568px) {\n          }\n        '
       )
     )
   );

package/dist/cjs/{index.esm-876ca9ff.js → index.esm-90433435.js}

@@ -3,6 +3,10 @@
 var iconBase = require('./iconBase-68959171.js');
 
 // THIS FILE IS AUTO GENERATED
+var IoIosArrowDropupCircle = function (props) {
+  return iconBase.GenIcon({"tag":"svg","attr":{"viewBox":"0 0 512 512"},"child":[{"tag":"path","attr":{"d":"M256 464c114.9 0 208-93.1 208-208S370.9 48 256 48 48 141.1 48 256s93.1 208 208 208zm0-244.5l-81.1 81.9c-7.5 7.5-19.8 7.5-27.3 0s-7.5-19.8 0-27.3l95.7-95.4c7.3-7.3 19.1-7.5 26.6-.6l94.3 94c3.8 3.8 5.7 8.7 5.7 13.7 0 4.9-1.9 9.9-5.6 13.6-7.5 7.5-19.7 7.6-27.3 0l-81-79.9z"}}]})(props);
+};
+IoIosArrowDropupCircle.displayName = "IoIosArrowDropupCircle";
 var IoIosArrowForward = function (props) {
   return iconBase.GenIcon({"tag":"svg","attr":{"viewBox":"0 0 512 512"},"child":[{"tag":"path","attr":{"d":"M294.1 256L167 129c-9.4-9.4-9.4-24.6 0-33.9s24.6-9.3 34 0L345 239c9.1 9.1 9.3 23.7.7 33.1L201.1 417c-4.7 4.7-10.9 7-17 7s-12.3-2.3-17-7c-9.4-9.4-9.4-24.6 0-33.9l127-127.1z"}}]})(props);
 };
@@ -20,6 +24,7 @@ var IoMdLogIn = function (props) {
 };
 IoMdLogIn.displayName = "IoMdLogIn";
 
+exports.IoIosArrowDropupCircle = IoIosArrowDropupCircle;
 exports.IoIosArrowForward = IoIosArrowForward;
 exports.IoIosOpen = IoIosOpen;
 exports.IoMdArrowDropdown = IoMdArrowDropdown;