@mjhls/mjh-framework 1.0.133 → 1.0.135

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/README.md CHANGED
@@ -1,5 +1,5 @@
1
1
 
2
- # mjh-framework v. 1.0.133
2
+ # mjh-framework v. 1.0.135
3
3
 
4
4
 
5
5
 
package/dist/index.es.js CHANGED
@@ -8,6 +8,7 @@ import Card from 'react-bootstrap/Card';
8
8
  import moment from 'moment';
9
9
  import Link from 'next/link';
10
10
  import { withRouter, useRouter } from 'next/router';
11
+ import LazyLoad from 'react-lazyload';
11
12
  import Media from 'react-bootstrap/Media';
12
13
  import { Media as Media$1, Container as Container$1, Dropdown, Figure, Carousel, Table, Button as Button$1, ProgressBar, Card as Card$1 } from 'react-bootstrap';
13
14
  import Button from 'react-bootstrap/Button';
@@ -19,6 +20,7 @@ import { useAccordionToggle } from 'react-bootstrap/AccordionToggle';
19
20
  import { FacebookShareButton, TwitterShareButton, PinterestShareButton, EmailShareButton, FacebookIcon, TwitterIcon, PinterestIcon, EmailIcon } from 'react-share';
20
21
  import Form from 'react-bootstrap/Form';
21
22
  import FormControl from 'react-bootstrap/FormControl';
23
+ import { SocialIcon } from 'react-social-icons';
22
24
  import Nav from 'react-bootstrap/Nav';
23
25
  import Navbar from 'react-bootstrap/Navbar';
24
26
  import NavDropdown from 'react-bootstrap/NavDropdown';
@@ -4733,7 +4735,7 @@ var DeckContent = function (_React$Component) {
4733
4735
  var client = _this.props.client;
4734
4736
 
4735
4737
  var builder = imageUrlBuilder(client);
4736
- return builder.image(source);
4738
+ return builder.image(source).auto('format');
4737
4739
  }, _this.renderCardImage = function (row, page) {
4738
4740
  if (row.thumbnail && row.thumbnail.asset) {
4739
4741
  var url = _this.urlFor(row.thumbnail);
@@ -4898,7 +4900,15 @@ var DeckContent = function (_React$Component) {
4898
4900
  React__default.createElement(
4899
4901
  'a',
4900
4902
  null,
4901
- React__default.createElement(Card.Img, { variant: 'top', src: _this.renderCardImage(row, page), alt: row.thumbnail && row.thumbnail.asset ? row.thumbnail.asset.originalFilename : '' })
4903
+ React__default.createElement(
4904
+ LazyLoad,
4905
+ { height: _this.props.imageHeight },
4906
+ React__default.createElement(Card.Img, {
4907
+ variant: 'top',
4908
+ src: _this.renderCardImage(row, page),
4909
+ alt: row.thumbnail && row.thumbnail.asset ? row.thumbnail.asset.originalFilename : ''
4910
+ })
4911
+ )
4902
4912
  )
4903
4913
  ),
4904
4914
  React__default.createElement(
@@ -6129,7 +6139,7 @@ var GridContent = function (_React$Component) {
6129
6139
  var client = _this.props.client;
6130
6140
 
6131
6141
  var builder = imageUrlBuilder(client);
6132
- return builder.image(source);
6142
+ return builder.image(source).auto('format');
6133
6143
  }, _this.renderCardImage = function (row, page) {
6134
6144
  if (row.thumbnail && row.thumbnail.asset) {
6135
6145
  var url = _this.urlFor(row.thumbnail);
@@ -6272,12 +6282,13 @@ var GridContent = function (_React$Component) {
6272
6282
 
6273
6283
  createClass(GridContent, [{
6274
6284
  key: 'cardLoader',
6275
- value: function cardLoader(page, columns, variant) {
6285
+ value: function cardLoader(page, columns, variant, showVideo, VideoPlayer) {
6276
6286
  var _this2 = this;
6277
6287
 
6278
6288
  var lgVar = Math.floor(12 / columns);
6279
6289
  var itemCounter = 0;
6280
6290
  var numberOfItemsBeforeAd = 6;
6291
+ var numberOfItemsBeforeVideo = 3;
6281
6292
  if (variant === 'stack') {
6282
6293
  return React__default.createElement(
6283
6294
  Row,
@@ -6302,7 +6313,15 @@ var GridContent = function (_React$Component) {
6302
6313
  React__default.createElement(
6303
6314
  'a',
6304
6315
  null,
6305
- React__default.createElement(Card.Img, { variant: 'top', src: _this2.renderCardImage(row, page), alt: row.thumbnail && row.thumbnail.asset ? row.thumbnail.asset.originalFilename : '' })
6316
+ React__default.createElement(
6317
+ LazyLoad,
6318
+ { height: _this2.props.imageHeight },
6319
+ React__default.createElement(Card.Img, {
6320
+ variant: 'top',
6321
+ src: _this2.renderCardImage(row, page),
6322
+ alt: row.thumbnail && row.thumbnail.asset ? row.thumbnail.asset.originalFilename : ''
6323
+ })
6324
+ )
6306
6325
  )
6307
6326
  )
6308
6327
  ),
@@ -6374,7 +6393,15 @@ var GridContent = function (_React$Component) {
6374
6393
  React__default.createElement(
6375
6394
  'a',
6376
6395
  { className: index$$1 === 0 || index$$1 % 4 === 0 ? '' : 'card-image' },
6377
- React__default.createElement(Card.Img, { variant: 'top', src: _this2.renderCardImage(row, page), alt: row.thumbnail && row.thumbnail.asset ? row.thumbnail.asset.originalFilename : '' })
6396
+ React__default.createElement(
6397
+ LazyLoad,
6398
+ { height: _this2.props.imageHeight },
6399
+ React__default.createElement(Card.Img, {
6400
+ variant: 'top',
6401
+ src: _this2.renderCardImage(row, page),
6402
+ alt: row.thumbnail && row.thumbnail.asset ? row.thumbnail.asset.originalFilename : ''
6403
+ })
6404
+ )
6378
6405
  )
6379
6406
  ),
6380
6407
  React__default.createElement(
@@ -6410,6 +6437,7 @@ var GridContent = function (_React$Component) {
6410
6437
  )
6411
6438
  )
6412
6439
  ),
6440
+ showVideo && (_this2.state.data.length < numberOfItemsBeforeVideo || index$$1 + 1 === numberOfItemsBeforeVideo) && React__default.createElement(VideoPlayer, null),
6413
6441
  main_36 && _this2.props.rightItems && (index$$1 + 1) % numberOfItemsBeforeAd === 0 && _this2.renderMobileAd(index$$1, numberOfItemsBeforeAd)
6414
6442
  );
6415
6443
  })
@@ -6424,7 +6452,9 @@ var GridContent = function (_React$Component) {
6424
6452
  columns = _props.columns,
6425
6453
  variant = _props.variant,
6426
6454
  autoScroll = _props.autoScroll,
6427
- page = _props.page;
6455
+ page = _props.page,
6456
+ showVideo = _props.showVideo,
6457
+ VideoPlayer = _props.VideoPlayer;
6428
6458
 
6429
6459
 
6430
6460
  return React__default.createElement(
@@ -6436,7 +6466,7 @@ var GridContent = function (_React$Component) {
6436
6466
  React__default.createElement(
6437
6467
  Container,
6438
6468
  null,
6439
- this.cardLoader(page, columns, variant)
6469
+ this.cardLoader(page, columns, variant, showVideo, VideoPlayer)
6440
6470
  )
6441
6471
  ) : React__default.createElement(
6442
6472
  React__default.Fragment,
@@ -6444,7 +6474,7 @@ var GridContent = function (_React$Component) {
6444
6474
  React__default.createElement(
6445
6475
  Container,
6446
6476
  null,
6447
- this.cardLoader(page, columns, variant)
6477
+ this.cardLoader(page, columns, variant, showVideo, VideoPlayer)
6448
6478
  ),
6449
6479
  React__default.createElement(
6450
6480
  'div',
@@ -6558,7 +6588,7 @@ var DeckQueue = function (_React$Component) {
6558
6588
  var client = _this.props.client;
6559
6589
 
6560
6590
  var builder = imageUrlBuilder(client);
6561
- return builder.image(source);
6591
+ return builder.image(source).auto('format');
6562
6592
  }, _this.renderCardImage = function (row) {
6563
6593
  if (row.thumbnail && row.thumbnail.asset) {
6564
6594
  var url = _this.urlFor(row.thumbnail);
@@ -6696,7 +6726,11 @@ var DeckQueue = function (_React$Component) {
6696
6726
  React__default.createElement(
6697
6727
  Link,
6698
6728
  { href: _this2.page + '/[url]', as: _this2.page + '/' + get_1(row, 'url.current') },
6699
- React__default.createElement(Card.Img, { variant: 'top', src: _this2.renderCardImage(row), alt: row.thumbnail && row.thumbnail.asset ? row.thumbnail.asset.originalFilename : '' })
6729
+ React__default.createElement(
6730
+ LazyLoad,
6731
+ { height: _this2.props.imageHeight },
6732
+ React__default.createElement(Card.Img, { variant: 'top', src: _this2.renderCardImage(row), alt: row.thumbnail && row.thumbnail.asset ? row.thumbnail.asset.originalFilename : '' })
6733
+ )
6700
6734
  )
6701
6735
  ),
6702
6736
  React__default.createElement(
@@ -6824,7 +6858,7 @@ var ThumbnailCard = function ThumbnailCard(_ref) {
6824
6858
  var builder = imageUrlBuilder(client);
6825
6859
 
6826
6860
  var urlFor = function urlFor(source) {
6827
- return builder.image(source);
6861
+ return builder.image(source).auto('format');
6828
6862
  };
6829
6863
 
6830
6864
  return React__default.createElement(
@@ -6834,13 +6868,11 @@ var ThumbnailCard = function ThumbnailCard(_ref) {
6834
6868
  return React__default.createElement(
6835
6869
  Media,
6836
6870
  { className: 'mb-3 thumbnail-card' },
6837
- React__default.createElement('img', {
6838
- width: size,
6839
- height: size,
6840
- className: 'mr-3',
6841
- src: item.thumbnail ? urlFor(item.thumbnail).url() : defaultImage,
6842
- alt: 'Generic placeholder'
6843
- }),
6871
+ React__default.createElement(
6872
+ LazyLoad,
6873
+ { height: size },
6874
+ React__default.createElement('img', { width: size, height: size, className: 'mr-3', src: item.thumbnail ? urlFor(item.thumbnail).url() : defaultImage, alt: 'Generic placeholder' })
6875
+ ),
6844
6876
  React__default.createElement(
6845
6877
  Media.Body,
6846
6878
  null,
@@ -6875,7 +6907,7 @@ var TaxonomyCard = function TaxonomyCard(props) {
6875
6907
  var builder = imageUrlBuilder(client);
6876
6908
 
6877
6909
  var urlFor = function urlFor(source) {
6878
- return builder.image(source);
6910
+ return builder.image(source).auto('format');
6879
6911
  };
6880
6912
 
6881
6913
  var renderCardImage = function renderCardImage(row) {
@@ -6923,7 +6955,11 @@ var TaxonomyCard = function TaxonomyCard(props) {
6923
6955
  thumbnailURL && React__default.createElement(
6924
6956
  Col,
6925
6957
  null,
6926
- React__default.createElement(Card.Img, { variant: 'top', src: thumbnailURL })
6958
+ React__default.createElement(
6959
+ LazyLoad,
6960
+ { height: imageHeight },
6961
+ React__default.createElement(Card.Img, { variant: 'top', src: thumbnailURL })
6962
+ )
6927
6963
  ),
6928
6964
  React__default.createElement(
6929
6965
  Col,
@@ -7251,7 +7287,11 @@ var YoutubeGroup = function YoutubeGroup(props) {
7251
7287
  React__default.createElement(
7252
7288
  'div',
7253
7289
  { className: 'tile__media' },
7254
- React__default.createElement('img', { className: 'tile__img', src: thumbnail, alt: '' })
7290
+ React__default.createElement(
7291
+ LazyLoad,
7292
+ null,
7293
+ React__default.createElement('img', { className: 'tile__img', src: thumbnail, alt: '' })
7294
+ )
7255
7295
  ),
7256
7296
  React__default.createElement(
7257
7297
  'div',
@@ -7289,7 +7329,11 @@ var YoutubeGroup = function YoutubeGroup(props) {
7289
7329
  React__default.createElement(
7290
7330
  'div',
7291
7331
  { className: 'tile__media' },
7292
- React__default.createElement('img', { className: 'tile__img', src: _thumbnail, alt: '' })
7332
+ React__default.createElement(
7333
+ LazyLoad,
7334
+ null,
7335
+ React__default.createElement('img', { className: 'tile__img', src: _thumbnail, alt: '' })
7336
+ )
7293
7337
  ),
7294
7338
  React__default.createElement(
7295
7339
  'div',
@@ -7325,7 +7369,7 @@ var YoutubeGroup = function YoutubeGroup(props) {
7325
7369
  };
7326
7370
 
7327
7371
  var urlFor = function urlFor(source, builder) {
7328
- return builder.image(source);
7372
+ return builder.image(source).auto('format');
7329
7373
  };
7330
7374
 
7331
7375
  var renderCardImage = function renderCardImage(row, builder, imageHeight, imageWidth) {
@@ -7494,7 +7538,11 @@ var cardLoader = function cardLoader(data, builder, mapping, values, seoPaginate
7494
7538
  React__default.createElement(
7495
7539
  'a',
7496
7540
  { className: 'img-wrapper' },
7497
- article.thumbnail && article.thumbnail.asset ? React__default.createElement('img', { className: 'mr-3 img-fluid', src: renderCardImage(article, builder, imageHeight, imageWidth), alt: article.title }) : article.thumbnail ? React__default.createElement('img', { src: article.thumbnail, className: 'mr-3', alt: article.title }) : React__default.createElement('img', { src: defaultImage, src2: article.thumbnail, className: 'mr-3', width: '240', height: '135', alt: article.title })
7541
+ React__default.createElement(
7542
+ LazyLoad,
7543
+ { height: imageHeight },
7544
+ article.thumbnail && article.thumbnail.asset ? React__default.createElement('img', { className: 'mr-3 img-fluid', src: renderCardImage(article, builder, imageHeight, imageWidth), alt: article.title }) : article.thumbnail ? React__default.createElement('img', { src: article.thumbnail, className: 'mr-3', alt: article.title }) : React__default.createElement('img', { src: defaultImage, src2: article.thumbnail, className: 'mr-3', width: '240', height: '135', alt: article.title })
7545
+ )
7498
7546
  )
7499
7547
  ),
7500
7548
  React__default.createElement(
@@ -8129,7 +8177,7 @@ var MasterDeck = function (_React$Component) {
8129
8177
  var client = _this.props.client;
8130
8178
 
8131
8179
  var builder = imageUrlBuilder(client);
8132
- return builder.image(source);
8180
+ return builder.image(source).auto('format');
8133
8181
  }, _this.renderCardImage = function (row, page) {
8134
8182
  if (row.thumbnail && row.thumbnail.asset) {
8135
8183
  var url = _this.urlFor(row.thumbnail);
@@ -8260,7 +8308,6 @@ var MasterDeck = function (_React$Component) {
8260
8308
  Row,
8261
8309
  null,
8262
8310
  _this.state.data && _this.state.data.map(function (row, index$$1) {
8263
-
8264
8311
  var pageNumber = row.pageNumber || _this.state.page;
8265
8312
  var contentCategoryName = row.contentCategory && row.contentCategory.name && _this.mapping[row.contentCategory.name] ? row.contentCategory.name : 'Articles';
8266
8313
 
@@ -8416,7 +8463,7 @@ var PublicationDeck = function PublicationDeck(props) {
8416
8463
 
8417
8464
  var urlFor = function urlFor(source) {
8418
8465
  var builder = imageUrlBuilder(client);
8419
- return builder.image(source);
8466
+ return builder.image(source).auto('format');
8420
8467
  };
8421
8468
 
8422
8469
  var renderCardImage = function renderCardImage(thumbnail) {
@@ -8446,7 +8493,11 @@ var PublicationDeck = function PublicationDeck(props) {
8446
8493
  React__default.createElement(
8447
8494
  'a',
8448
8495
  null,
8449
- row.childIssue && row.childIssue.thumbnail && React__default.createElement(Card.Img, { variant: 'top', src: renderCardImage(row.childIssue.thumbnail), alt: row.name }),
8496
+ row.childIssue && row.childIssue.thumbnail && React__default.createElement(
8497
+ LazyLoad,
8498
+ { height: imageHeight },
8499
+ React__default.createElement(Card.Img, { variant: 'top', src: renderCardImage(row.childIssue.thumbnail), alt: row.name })
8500
+ ),
8450
8501
  React__default.createElement(
8451
8502
  Card.Body,
8452
8503
  null,
@@ -8481,7 +8532,7 @@ var IssueDeck = function IssueDeck(props) {
8481
8532
 
8482
8533
  var urlFor = function urlFor(source) {
8483
8534
  var builder = imageUrlBuilder(client);
8484
- return builder.image(source);
8535
+ return builder.image(source).auto('format');
8485
8536
  };
8486
8537
 
8487
8538
  var renderCardImage = function renderCardImage(thumbnail) {
@@ -8517,7 +8568,11 @@ var IssueDeck = function IssueDeck(props) {
8517
8568
  React__default.createElement(
8518
8569
  Col,
8519
8570
  { md: 12, lg: 4 },
8520
- row.thumbnail && React__default.createElement(Card.Img, { variant: 'top', src: renderCardImage(row.thumbnail), alt: row.name })
8571
+ row.thumbnail && React__default.createElement(
8572
+ LazyLoad,
8573
+ { height: imageHeight },
8574
+ React__default.createElement(Card.Img, { variant: 'top', src: renderCardImage(row.thumbnail), alt: row.name })
8575
+ )
8521
8576
  ),
8522
8577
  React__default.createElement(
8523
8578
  Col,
@@ -8568,7 +8623,7 @@ var IssueContentDeck = function IssueContentDeck(props) {
8568
8623
 
8569
8624
  var urlFor = function urlFor(source) {
8570
8625
  var builder = imageUrlBuilder(client);
8571
- return builder.image(source);
8626
+ return builder.image(source).auto('format');
8572
8627
  };
8573
8628
 
8574
8629
  var renderCardImage = function renderCardImage(thumbnail) {
@@ -8598,7 +8653,11 @@ var IssueContentDeck = function IssueContentDeck(props) {
8598
8653
  React__default.createElement(
8599
8654
  'a',
8600
8655
  null,
8601
- row.thumbnail && React__default.createElement(Card.Img, { variant: 'top', src: renderCardImage(row.thumbnail), alt: row.title }),
8656
+ row.thumbnail && React__default.createElement(
8657
+ LazyLoad,
8658
+ { height: imageHeight },
8659
+ React__default.createElement(Card.Img, { variant: 'top', src: renderCardImage(row.thumbnail), alt: row.title })
8660
+ ),
8602
8661
  React__default.createElement(
8603
8662
  Card.Body,
8604
8663
  null,
@@ -9212,6 +9271,65 @@ var NavFooter = function NavFooter(props) {
9212
9271
  );
9213
9272
  };
9214
9273
 
9274
+ var SocialNavFooter = function SocialNavFooter(props) {
9275
+ var year = new Date().getFullYear();
9276
+ var website = props.website;
9277
+
9278
+ return React__default.createElement(
9279
+ 'div',
9280
+ { className: 'nav-footer' },
9281
+ website && website.footerLinks && website.footerLinks.length && React__default.createElement(
9282
+ 'ul',
9283
+ null,
9284
+ website && website.footerLinks.map(function (content, index) {
9285
+ if (content.url && content.title) {
9286
+ return content.blank ? React__default.createElement(
9287
+ 'li',
9288
+ { key: index },
9289
+ React__default.createElement(
9290
+ 'a',
9291
+ { target: '_blank', href: content.url, className: 'nav-link' },
9292
+ content.title
9293
+ )
9294
+ ) : React__default.createElement(
9295
+ 'li',
9296
+ { key: index },
9297
+ React__default.createElement(
9298
+ Link,
9299
+ { href: content.url },
9300
+ React__default.createElement(
9301
+ 'a',
9302
+ { className: 'nav-link' },
9303
+ content.title
9304
+ )
9305
+ )
9306
+ );
9307
+ } else return null;
9308
+ })
9309
+ ),
9310
+ React__default.createElement(
9311
+ 'ul',
9312
+ null,
9313
+ React__default.createElement(
9314
+ 'li',
9315
+ { style: { marginTop: '10px' }, key: website.footerLinks ? website.footerLinks.length + 1 : 1 },
9316
+ website.socialLinks && website.socialLinks.map(function (row, index) {
9317
+ return React__default.createElement(SocialIcon, { target: row.blank ? '_blank' : '_self', key: index, index: index, url: row.url, style: { width: 30, height: 30, marginRight: 5 } });
9318
+ })
9319
+ )
9320
+ ),
9321
+ website && website.name && React__default.createElement(
9322
+ 'p',
9323
+ { className: 'nav-link' },
9324
+ '\xA9 ',
9325
+ year,
9326
+ ' ',
9327
+ website.name,
9328
+ '. All rights reserved.'
9329
+ )
9330
+ );
9331
+ };
9332
+
9215
9333
  var NavMagazine = function NavMagazine(props) {
9216
9334
  /*
9217
9335
  Example Nav with acceptable props
@@ -9231,7 +9349,9 @@ var NavMagazine = function NavMagazine(props) {
9231
9349
  website = props.website,
9232
9350
  _props$showLogin = props.showLogin,
9233
9351
  showLogin = _props$showLogin === undefined ? false : _props$showLogin,
9234
- _props$userData = props.userData;
9352
+ _props$userData = props.userData,
9353
+ _props$socialFooterNa = props.socialFooterNav,
9354
+ socialFooterNav = _props$socialFooterNa === undefined ? false : _props$socialFooterNa;
9235
9355
 
9236
9356
  var navRef = useRef(null);
9237
9357
 
@@ -9523,7 +9643,7 @@ var NavMagazine = function NavMagazine(props) {
9523
9643
  React__default.createElement(
9524
9644
  Nav,
9525
9645
  { className: 'mr-auto' },
9526
- React__default.createElement(NavFooter, { website: website })
9646
+ socialFooterNav ? React__default.createElement(SocialNavFooter, { website: website }) : React__default.createElement(NavFooter, { website: website })
9527
9647
  )
9528
9648
  )
9529
9649
  )