@mjhls/mjh-framework 1.0.108 → 1.0.109-8.1

package/dist/esm/SocialSearchComponent-9e65c8d6.js

@@ -0,0 +1,204 @@
+import { _ as _slicedToArray } from './slicedToArray-72ed566b.js';
+import React__default, { useState, useRef, useEffect } from 'react';
+import SocialIcons from './SocialIcons.js';
+import { G as GoSearch } from './index.esm-9508070a.js';
+import { I as IconContext } from './iconBase-ccc56b97.js';
+import Form from 'react-bootstrap/Form';
+import FormControl from 'react-bootstrap/FormControl';
+import Button from 'react-bootstrap/Button';
+import { g as main_34, c as main_44 } from './main-754d4992.js';
+
+var SocialSearchComponent = function SocialSearchComponent(_ref) {
+  var type = _ref.type,
+      socialIconVariant = _ref.socialIconVariant,
+      website = _ref.website,
+      navID = _ref.navID,
+      _ref$searchIconUrl = _ref.searchIconUrl,
+      searchIconUrl = _ref$searchIconUrl === undefined ? null : _ref$searchIconUrl;
+
+  // Search Term
+  var _useState = useState(''),
+      _useState2 = _slicedToArray(_useState, 2),
+      searchKey = _useState2[0],
+      setSearchKey = _useState2[1];
+  // To calculate the position at which mobile searchbar should set.
+
+
+  var _useState3 = useState(0),
+      _useState4 = _slicedToArray(_useState3, 2),
+      topOffset = _useState4[0],
+      setTopOffset = _useState4[1];
+
+  var _useState5 = useState(0),
+      _useState6 = _slicedToArray(_useState5, 2),
+      rightOffset = _useState6[0],
+      setRightpOffset = _useState6[1];
+
+  var desktopComponent = useRef(null);
+  var mobileComponent = useRef(null);
+
+  useEffect(function () {
+    var navWrapper = document.getElementById(navID);
+    var mastNav = document.querySelector('.nav-brands');
+    var topOffset = 0;
+    // Checking for non-IOS devices before setting the offset position.
+    if (window && window.innerWidth < 1200 && mastNav && mastNav.offsetHeight && !main_34) topOffset = topOffset + mastNav.offsetHeight;
+    if (navWrapper && navWrapper.offsetHeight) topOffset = topOffset + navWrapper.offsetHeight;
+    setTopOffset(topOffset + 2);
+
+    if (desktopComponent && desktopComponent.current && desktopComponent.current.offsetWidth && desktopComponent.current.offsetLeft) {
+      setRightpOffset(window.innerWidth - desktopComponent.current.offsetLeft);
+    }
+  }, []);
+
+  // Search function
+  var submitSearch = function submitSearch(e) {
+    e.preventDefault();
+    window.location.href = '/search?searchTerm=' + encodeURIComponent(searchKey);
+  };
+
+  // Toggling class of an element.Can't use toggle() as IE doesn't support toggle()
+  var toggleClass = function toggleClass(selector, type, addOn) {
+    if (type === 'id') {
+      var searchBar = document.getElementById(selector);
+      if (searchBar && searchBar.classList && searchBar.classList.contains(addOn)) {
+        searchBar.classList.remove(addOn);
+      } else if (searchBar && searchBar.classList) {
+        searchBar.classList.add(addOn);
+      }
+    } else if (type === 'class') {
+      var searchBtn = document.getElementsByClassName(selector)[0];
+      if (searchBtn && searchBtn.classList && searchBtn.classList.contains(addOn)) {
+        // Set overflow fix for iPhones safari browsers
+        if (main_44 || window.innerWidth < 1200 && main_34) {
+          var mainNav = document.querySelector('#navbar-ham');
+          if (mainNav && mainNav.style) mainNav.style.overflow = 'auto';
+        }
+        searchBtn.classList.remove(addOn);
+      } else if (searchBtn && searchBtn.classList) {
+        // Set overflow fix for iPhones safari browsers
+        if (main_44 || window.innerWidth < 1200 && main_34) {
+          var _mainNav = document.querySelector('#navbar-ham');
+          if (_mainNav && _mainNav.style) _mainNav.style.overflow = 'visible';
+        }
+        searchBtn.classList.add(addOn);
+      }
+    }
+  };
+
+  var socialSearchDesktop = function socialSearchDesktop() {
+    return React__default.createElement(
+      'div',
+      { id: 'search-content-desktop', ref: desktopComponent, style: { display: 'flex' } },
+      React__default.createElement(
+        'div',
+        { id: 'search-bar-desktop', style: { top: topOffset, right: rightOffset } },
+        React__default.createElement(
+          Form,
+          { style: { padding: '6px' }, inline: true, onSubmit: function onSubmit(e) {
+              return submitSearch(e);
+            } },
+          searchIconUrl && React__default.createElement(
+            'div',
+            { style: { maxWidth: '90px', marginRight: '.5rem' } },
+            React__default.createElement('img', { className: 'img-fluid', src: searchIconUrl, alt: 'search icon' })
+          ),
+          React__default.createElement(FormControl, { style: { width: '50%', flexGrow: '1' }, placeholder: 'Search', type: 'text', value: searchKey, onChange: function onChange(e) {
+              return setSearchKey(e.target.value);
+            } }),
+          React__default.createElement(
+            Button,
+            { variant: 'primary', style: { backgroundColor: 'var(--secondary)', border: 'none', width: '20%', marginLeft: '2%' }, onClick: function onClick(e) {
+                return submitSearch(e);
+              } },
+            'Search'
+          )
+        )
+      ),
+      React__default.createElement(
+        IconContext.Provider,
+        { value: { color: socialIconVariant === 'light' ? 'white' : 'black', className: 'search-btn-desktop', size: '35px' } },
+        React__default.createElement(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', left: '0px', position: 'relative', paddingTop: '3px', maxHeight: '35px' } },
+        website.socialLinks && React__default.createElement(SocialIcons, { socialLinks: website.socialLinks, variant: socialIconVariant })
+      ),
+      React__default.createElement(
+        'style',
+        { jsx: 'true' },
+        '\n          #search-content-desktop .search-btn-desktop {\n            padding: 5px;\n            cursor: pointer;\n          }\n          #search-content-desktop #search-bar-desktop {\n            display: none;\n            background-color: var(--primary);\n            position: absolute;\n            width: 400px;\n            border-radius: 5px;\n            height: 48px;\n            right: 15%;\n          }\n          #search-content-desktop .search-btn-desktop.active-search {\n            border-radius: 5px;\n            border: 1px solid var(--secondary) !important;\n          }\n          #search-content-desktop #search-bar-desktop.show {\n            display: block !important;\n          }\n        '
+      )
+    );
+  };
+
+  var socialSearchMobile = function socialSearchMobile() {
+    return React__default.createElement(
+      'div',
+      { id: 'search-content-mobile', ref: mobileComponent },
+      React__default.createElement(
+        'div',
+        { id: 'search-bar-mobile', style: { top: topOffset } },
+        React__default.createElement(
+          Form,
+          { inline: true, style: { padding: '6px', width: '100%' }, onSubmit: function onSubmit(e) {
+              return submitSearch(e);
+            } },
+          searchIconUrl && React__default.createElement(
+            'div',
+            { style: { maxWidth: '90px', marginRight: '.5rem' } },
+            React__default.createElement('img', { className: 'img-fluid', src: searchIconUrl, alt: 'search icon' })
+          ),
+          React__default.createElement(FormControl, { style: { width: '20%', flexGrow: '1' }, placeholder: 'Search', type: 'text', value: searchKey, onChange: function onChange(e) {
+              return setSearchKey(e.target.value);
+            } }),
+          React__default.createElement(
+            Button,
+            { variant: 'primary', style: { backgroundColor: 'var(--secondary)', border: 'none', width: '20%', marginLeft: '2%' }, onClick: function onClick(e) {
+                return submitSearch(e);
+              } },
+            'Search'
+          )
+        )
+      ),
+      React__default.createElement(
+        IconContext.Provider,
+        { value: { color: socialIconVariant === 'light' ? 'white' : 'black', className: 'search-btn-mobile', size: '35px' } },
+        React__default.createElement(GoSearch, {
+          onClick: function onClick() {
+            var navToggle = document.getElementsByClassName('navbar-toggler')[0];
+            if (navToggle && navToggle.classList && !navToggle.classList.contains('collapsed')) {
+              var nav = document.querySelectorAll('.navbar-collapse');
+              for (var i = 0; i < nav.length; i++) {
+                if (nav[i] && nav[i].classList) nav[i].classList.remove('show');
+              }
+              if (navToggle && navToggle.classList) navToggle.classList.add('collapsed');
+            }
+
+            toggleClass('search-bar-mobile', 'id', 'show');
+            toggleClass('search-btn-mobile', 'class', 'active-search');
+          }
+        })
+      ),
+      React__default.createElement(
+        'style',
+        { jsx: 'true' },
+        '\n          #search-content-mobile {\n            display: flex;\n            z-index: 999;\n          }\n          @media screen and (min-width: 1200px) {\n            #search-content-mobile {\n              display: none;\n            }\n          }\n          #search-content-mobile .search-btn-mobile {\n            padding: 5px;\n            right: 4%;\n            height: 35px;\n            width: 35px;\n            margin-top: 4px;\n            cursor: pointer;\n          }\n          #search-content-mobile #search-bar-mobile {\n            position: ' + (main_34 ? 'absolute' : 'fixed') + ';\n            display: none;\n            left: 0px;\n            width: 100%;\n            border-radius: 5px;\n            padding: 10px;\n            background-color: var(--primary);\n          }\n          #search-content-mobile #search-bar-mobile .form-inline {\n            margin-top: 0px;\n            width: 100% !important;\n          }\n          #search-content-mobile #search-bar-mobile .form-inline .form-control {\n            width: 78%;\n            border-radius: 5px;\n            height: 45px;\n          }\n          #search-content-mobile #search-bar-mobile .form-inline .btn {\n            width: 20%;\n            border-radius: 5px;\n            background-color: #040c5a;\n            height: 45px;\n            margin-left: 5px;\n            padding: 1px;\n          }\n          #search-content-mobile .search-btn-mobile.active-search {\n            border-radius: 5px;\n            border: 1px solid var(--secondary);\n          }\n          #search-content-mobile #search-bar-mobile.show {\n            display: block !important;\n          }\n        '
+      )
+    );
+  };
+
+  if (type === 'mobile') {
+    return socialSearchMobile();
+  } else if (type === 'desktop') {
+    return socialSearchDesktop();
+  }
+};
+
+export { SocialSearchComponent as S };

package/dist/esm/SocialShare.js

@@ -0,0 +1,67 @@
+import React__default from 'react';
+import Head from 'next/head';
+import { FacebookShareButton, FacebookIcon, TwitterShareButton, TwitterIcon, LinkedinShareButton, LinkedinIcon, PinterestShareButton, PinterestIcon, EmailShareButton, EmailIcon } from 'react-share';
+
+var SocialShare = function SocialShare(props) {
+  var shareUrl = props.shareUrl,
+      shareTitle = props.shareTitle,
+      shareVia = props.shareVia,
+      shareSummary = props.shareSummary,
+      shareSubject = props.shareSubject,
+      shareImage = props.shareImage,
+      size = props.size,
+      siteName = props.siteName,
+      twitterSiteName = props.twitterSiteName,
+      _props$disableMeta = props.disableMeta,
+      disableMeta = _props$disableMeta === undefined ? false : _props$disableMeta,
+      hidePinterest = props.hidePinterest,
+      hideFacebook = props.hideFacebook;
+
+  return React__default.createElement(
+    React__default.Fragment,
+    null,
+    !disableMeta && React__default.createElement(
+      Head,
+      null,
+      React__default.createElement('meta', { property: 'og:url', content: shareUrl, key: 'og:url' }),
+      React__default.createElement('meta', { property: 'og:title', content: shareTitle, key: 'og:title' }),
+      React__default.createElement('meta', { property: 'og:image', content: shareImage, key: 'og:image' }),
+      React__default.createElement('meta', { property: 'og:site_name', content: siteName, key: 'og:site_name' }),
+      React__default.createElement('meta', { property: 'og:description', content: shareSummary, key: 'og:description' }),
+      React__default.createElement('meta', { name: 'twitter:card', content: 'summary', key: 'og:card' }),
+      React__default.createElement('meta', { name: 'twitter:title', content: shareTitle, key: 'og:title' }),
+      React__default.createElement('meta', { name: 'twitter:image', content: shareImage, key: 'og:image' }),
+      React__default.createElement('meta', { name: 'twitter:site', content: twitterSiteName, key: 'og:site' }),
+      React__default.createElement('meta', { name: 'twitter:description', content: shareSummary, key: 'og:description' })
+    ),
+    !hideFacebook && React__default.createElement(
+      FacebookShareButton,
+      { url: shareUrl, quote: shareTitle },
+      React__default.createElement(FacebookIcon, { size: size, round: true })
+    ),
+    React__default.createElement(
+      TwitterShareButton,
+      { url: shareUrl, title: shareTitle, via: shareVia },
+      React__default.createElement(TwitterIcon, { size: size, round: true })
+    ),
+    React__default.createElement(
+      LinkedinShareButton,
+      { url: shareUrl, title: shareTitle, via: shareVia },
+      React__default.createElement(LinkedinIcon, { size: size, round: true })
+    ),
+    !hidePinterest && React__default.createElement(
+      PinterestShareButton,
+      { url: shareUrl, media: shareImage, description: shareSummary },
+      React__default.createElement(PinterestIcon, { size: size, round: true })
+    ),
+    React__default.createElement(
+      EmailShareButton,
+      { url: shareUrl, subject: shareSubject, body: shareSummary },
+      React__default.createElement(EmailIcon, { size: size, round: true })
+    )
+  );
+};
+
+var SocialShare$1 = React__default.memo(SocialShare);
+
+export { SocialShare$1 as default };

package/dist/esm/TaxonomyCard.js

@@ -0,0 +1,246 @@
+import { _ as _extends } from './extends-2f4448b8.js';
+import React__default from 'react';
+import { B as BlockContent } from './BlockContent-1e73bd2c.js';
+import Container from 'react-bootstrap/Container';
+import Row from 'react-bootstrap/Row';
+import Col from 'react-bootstrap/Col';
+import Card from 'react-bootstrap/Card';
+import urlFor from './urlFor.js';
+import { L as LazyLoad } from './index-755f2cc2.js';
+import { r as reactSocialIcons_1 } from './react-social-icons-9be47857.js';
+import { c as checkSisterSite } from './checkSisterSite-a7218fda.js';
+import './_commonjsHelpers-0c4b6f40.js';
+import './core.get-iterator-method-95db387d.js';
+import 'prop-types';
+import './index-3f5c03b2.js';
+import './slicedToArray-72ed566b.js';
+import './web.dom.iterable-3fffc027.js';
+import 'react-dom';
+
+var TaxonomyCard = function TaxonomyCard(props) {
+  // setting default value for imageHeight
+  var columns = props.columns,
+      variant = props.variant,
+      _props$icon = props.icon,
+      icon = _props$icon === undefined ? false : _props$icon,
+      data = props.dataRecord,
+      defaultImage = props.defaultImage,
+      client = props.client,
+      _props$imageHeight = props.imageHeight,
+      imageHeight = _props$imageHeight === undefined ? 270 : _props$imageHeight,
+      _props$imageWidth = props.imageWidth,
+      imageWidth = _props$imageWidth === undefined ? null : _props$imageWidth,
+      _props$imageFit = props.imageFit,
+      imageFit = _props$imageFit === undefined ? null : _props$imageFit,
+      getSerializers = props.getSerializers;
+
+
+  var renderCardImage = function renderCardImage(row) {
+    var url = urlFor({ client: client, source: row.thumbnail, imageHeight: imageHeight, imageWidth: imageWidth, imageFit: imageFit });
+    return url;
+  };
+
+  var mode = variant && variant === 'bottom' ? 'column-reverse' : 'column';
+
+  var itemCounter = 0;
+  var lgVar = 12;
+
+  return React__default.createElement(
+    'div',
+    { className: 'contentDeck' },
+    React__default.createElement(
+      Container,
+      null,
+      React__default.createElement(
+        Row,
+        null,
+        data && data.map(function (row, index) {
+          if (columns === 'rotate' && itemCounter % 3 === 0) {
+            lgVar = 12;
+          } else if (columns && columns !== 'rotate') {
+            lgVar = Math.floor(12 / columns);
+          } else {
+            lgVar = 6;
+          }
+          var thumbnailURL = row.thumbnail && row.thumbnail.asset ? renderCardImage(row) : defaultImage;
+          var address1 = row.address1,
+              address2 = row.address2,
+              city = row.city,
+              zip = row.zip,
+              state = row.state,
+              country = row.country,
+              company = row.company,
+              website = row.website,
+              email = row.email,
+              extraURL1 = row.extraURL1,
+              extraURL2 = row.extraURL2,
+              extraURL3 = row.extraURL3,
+              extraURL4 = row.extraURL4,
+              linkedIn = row.linkedIn,
+              twitter = row.twitter,
+              facebook = row.facebook,
+              instagram = row.instagram;
+
+          var socialLinks = [linkedIn, twitter, facebook, instagram];
+          var address = [address1, address2, city, state, zip, country];
+          var companyDetails = [];
+          company && companyDetails.push({ key: 'company', value: company });
+          website && companyDetails.push({ key: 'url', value: website });
+          email && companyDetails.push({ key: 'email', value: email });
+          extraURL1 && companyDetails.push({ key: 'url', value: extraURL1 });
+          extraURL2 && companyDetails.push({ key: 'url', value: extraURL2 });
+          extraURL3 && companyDetails.push({ key: 'url', value: extraURL3 });
+          extraURL4 && companyDetails.push({ key: 'url', value: extraURL4 });
+          return React__default.createElement(
+            Col,
+            { key: itemCounter, md: 12, lg: lgVar, counter: itemCounter++, style: { display: 'flex', flex: '1 0 auto' } },
+            React__default.createElement(
+              Card,
+              { className: 'taxonomy-card', style: { flexDirection: mode, position: 'relative', overflow: 'hidden' } },
+              React__default.createElement(
+                Card.Body,
+                null,
+                React__default.createElement(
+                  Row,
+                  null,
+                  thumbnailURL && React__default.createElement(
+                    Col,
+                    null,
+                    React__default.createElement(
+                      LazyLoad,
+                      { height: imageHeight },
+                      row && row.thumbnail && React__default.createElement(
+                        'figure',
+                        null,
+                        row.thumbnail.link ? React__default.createElement(
+                          'a',
+                          _extends({
+                            href: row.thumbnail.link,
+                            target: row.thumbnail.blank ? '_blank' : '_self'
+                          }, checkSisterSite(row.thumbnail.link) ? {} : { rel: 'noopener noreferrer' }),
+                          React__default.createElement(Card.Img, { variant: 'top', src: thumbnailURL, alt: row.thumbnail.alt ? row.thumbnail.alt : 'profile image' })
+                        ) : React__default.createElement(Card.Img, { variant: 'top', src: thumbnailURL, alt: row.thumbnail.alt ? row.thumbnail.alt : 'profile image' }),
+                        row && row.thumbnail && row.thumbnail.caption && React__default.createElement(
+                          'figcaption',
+                          null,
+                          row.thumbnail.caption
+                        )
+                      )
+                    )
+                  ),
+                  React__default.createElement(
+                    Col,
+                    null,
+                    React__default.createElement(
+                      Row,
+                      { className: 'details-content-wrapper' },
+                      React__default.createElement(
+                        'div',
+                        { className: 'details-content-inner-wrapper' },
+                        (address && address.length > 0 || companyDetails && companyDetails.length > 0) && React__default.createElement(
+                          'div',
+                          { className: 'details-wrapper' },
+                          companyDetails && companyDetails.length > 0 && React__default.createElement(
+                            'div',
+                            { className: 'company-wrapper' },
+                            companyDetails.map(function (field, index) {
+                              if (field.value && field.key === 'company') {
+                                return React__default.createElement(
+                                  'p',
+                                  { className: 'details-field', key: index },
+                                  field.value
+                                );
+                              } else if (field.value && field.key === 'url') {
+                                return React__default.createElement(
+                                  'a',
+                                  _extends({ className: 'details-field', href: field.value, key: index }, checkSisterSite(field.value) ? {} : { rel: 'noopener noreferrer' }),
+                                  field.value
+                                );
+                              }
+                              // else if (field.value && field.key === 'email') {
+                              //   return (
+                              //     <a className='details-field' href={`mailto:${field.value}`} key={index}>
+                              //       {field.value}
+                              //     </a>
+                              //   )
+                              // }
+                            })
+                          ),
+                          address && address.length > 0 && React__default.createElement(
+                            'div',
+                            { className: 'address-wrapper' },
+                            address.map(function (field, index) {
+                              if (field) {
+                                return React__default.createElement(
+                                  'p',
+                                  { className: 'details-field', key: index },
+                                  field
+                                );
+                              }
+                            })
+                          ),
+                          React__default.createElement(
+                            'style',
+                            { jsx: 'true' },
+                            '\n                                    .details-content-wrapper,\n                                    .details-content-inner-wrapper {\n                                      width: 100%;\n                                    }\n                                    .details-wrapper .details-field {\n                                      margin: 0px;\n                                      display: block;\n                                      font-size: 1rem;\n                                      margin-bottom: 3px;\n                                    }\n                                    .details-wrapper .company-wrapper {\n                                      margin-right: 20px;\n                                      display: inline-block;\n                                      width: 50%;\n                                      vertical-align: top;\n                                    }\n                                    .details-wrapper .address-wrapper {\n                                      width: 45%;\n                                      display: inline-block;\n                                    }\n                                  '
+                          )
+                        ),
+                        socialLinks && socialLinks.length && React__default.createElement(
+                          'div',
+                          { className: 'social-icons' },
+                          socialLinks.map(function (url, index) {
+                            if (url && url.length) {
+                              return React__default.createElement(reactSocialIcons_1, _extends({
+                                target: '_blank'
+                              }, checkSisterSite(url) ? {} : { rel: 'noopener noreferrer' }, {
+                                key: index,
+                                index: index,
+                                url: url,
+                                style: { width: 30, height: 30, marginRight: 10 }
+                              }));
+                            }
+                          }),
+                          React__default.createElement(
+                            'style',
+                            { jsx: 'true' },
+                            '\n                                    .social-icons {\n                                      margin-top: 0px;\n                                      margin-bottom: 10px;\n                                    }\n                                  '
+                          )
+                        ),
+                        React__default.createElement(
+                          Card.Text,
+                          null,
+                          React__default.createElement(BlockContent, _extends({ blocks: row.summary, serializers: getSerializers }, client.config()))
+                        )
+                      )
+                    )
+                  )
+                ),
+                icon && React__default.createElement(
+                  'span',
+                  {
+                    className: 'taxonomy-icon',
+                    style: {
+                      position: 'absolute',
+                      right: '20px',
+                      top: '50%',
+                      transform: 'translateY(-50%) translateX(50px)',
+                      transition: 'all .25s',
+                      pointerEvents: 'none'
+                    } },
+                  '\u2192'
+                )
+              )
+            )
+          );
+        })
+      )
+    ),
+    icon && React__default.createElement(
+      'style',
+      { jsx: 'true' },
+      '\n          .taxonomy-card:hover .taxonomy-icon {\n            transform: translateY(-50%) scale(1.5) translateX(0) !important;\n          }\n        '
+    )
+  );
+};
+
+export { TaxonomyCard as default };