@mjhls/mjh-framework 1.0.142 → 1.0.144

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/dist/index.js CHANGED
@@ -6338,13 +6338,13 @@ var GridContent = function (_React$Component) {
6338
6338
  Card.Body,
6339
6339
  { style: { padding: '20px' } },
6340
6340
  React__default.createElement(
6341
- Link,
6342
- { href: _this2.page + '/[url]', as: _this2.page + '/' + get_1(row, 'url.current') },
6341
+ Card.Title,
6342
+ null,
6343
6343
  React__default.createElement(
6344
- 'a',
6345
- null,
6344
+ Link,
6345
+ { href: _this2.page + '/[url]', as: _this2.page + '/' + get_1(row, 'url.current') },
6346
6346
  React__default.createElement(
6347
- Card.Title,
6347
+ 'a',
6348
6348
  null,
6349
6349
  row.title
6350
6350
  )
@@ -6401,7 +6401,7 @@ var GridContent = function (_React$Component) {
6401
6401
  { href: linkHref },
6402
6402
  React__default.createElement(
6403
6403
  'a',
6404
- { className: index$$1 === 0 || index$$1 % 4 === 0 ? '' : 'card-image' },
6404
+ { target: row.url && row.url.target ? '_blank' : '_self', className: index$$1 === 0 || index$$1 % 4 === 0 ? '' : 'card-image' },
6405
6405
  React__default.createElement(
6406
6406
  LazyLoad,
6407
6407
  { height: _this2.props.imageHeight },
@@ -6421,7 +6421,7 @@ var GridContent = function (_React$Component) {
6421
6421
  { href: linkHref },
6422
6422
  React__default.createElement(
6423
6423
  'a',
6424
- null,
6424
+ { target: row.url && row.url.target ? '_blank' : '_self' },
6425
6425
  React__default.createElement(
6426
6426
  Card.Title,
6427
6427
  null,
@@ -6748,11 +6748,11 @@ var DeckQueue = function (_React$Component) {
6748
6748
  Card.Body,
6749
6749
  { style: { padding: '20px' } },
6750
6750
  row.title && React__default.createElement(
6751
- Link,
6752
- { href: _this2.page + '/[url]', as: _this2.page + '/' + get_1(row, 'url.current') },
6751
+ Card.Title,
6752
+ null,
6753
6753
  React__default.createElement(
6754
- Card.Title,
6755
- null,
6754
+ Link,
6755
+ { href: _this2.page + '/[url]', as: _this2.page + '/' + get_1(row, 'url.current') },
6756
6756
  row.title
6757
6757
  )
6758
6758
  ),
@@ -6772,11 +6772,11 @@ var DeckQueue = function (_React$Component) {
6772
6772
  )
6773
6773
  ),
6774
6774
  row.summary && React__default.createElement(
6775
- Link,
6776
- { href: _this2.page + '/[url]', as: _this2.page + '/' + get_1(row, 'url.current') },
6775
+ Card.Text,
6776
+ null,
6777
6777
  React__default.createElement(
6778
- Card.Text,
6779
- null,
6778
+ Link,
6779
+ { href: _this2.page + '/[url]', as: _this2.page + '/' + get_1(row, 'url.current') },
6780
6780
  row.summary
6781
6781
  )
6782
6782
  )
@@ -7541,6 +7541,7 @@ var cardLoader = function cardLoader(data, builder, mapping, values, seoPaginate
7541
7541
  reactBootstrap.Media,
7542
7542
  {
7543
7543
  key: article._id ? article._id : index$$1,
7544
+ className: article._type == 'feature' ? 'feature-media' : '',
7544
7545
  style: { flexDirection: article._type == 'feature' ? 'column' : 'row', marginBottom: '1.25rem', paddingBottom: '1.25rem', borderBottom: '1px solid #ddd' } },
7545
7546
  (article.thumbnail && article.thumbnail.asset || defaultImage) && React__default.createElement(
7546
7547
  Link,
@@ -7611,7 +7612,7 @@ var cardLoader = function cardLoader(data, builder, mapping, values, seoPaginate
7611
7612
  React__default.createElement(
7612
7613
  'style',
7613
7614
  { jsx: 'true' },
7614
- '\n .img-wrapper img {\n max-height: 240px;\n height: auto;\n width: 100%;\n object-fit: contain;\n }\n .feature-wrapper {\n width: 100%;\n }\n .feature-wrapper img {\n width: 100%;\n margin-bottom: 1em;\n }\n @media only screen and (min-width: 768px) {\n \n .img-wrapper > img {\n padding-right: 1em;\n }\n }\n @media only screen and (max-width: 767px) {\n .img-wrapper {\n width: 100%;\n }\n .img-wrapper img {\n padding-bottom: 1em;\n }\n .media {\n flex-direction: column;\n }\n }\n '
7615
+ '\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 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;\n }\n }\n '
7615
7616
  )
7616
7617
  );
7617
7618
  };
@@ -8813,7 +8814,7 @@ var Column2 = function Column2(props) {
8813
8814
  row.component
8814
8815
  );
8815
8816
  }),
8816
- website && website.sideFooterContent && website.sideFooterContent.length && React__default.createElement(SideFooter, { website: website })
8817
+ website && website.sideFooterContent && website.sideFooterContent.length && !website.showFooterOnLeftSide && React__default.createElement(SideFooter, { website: website })
8817
8818
  )
8818
8819
  )
8819
8820
  )
@@ -8969,7 +8970,8 @@ var Column3 = function Column3(props) {
8969
8970
  React__default.createElement(
8970
8971
  Col,
8971
8972
  { md: true, className: 'leftCol', style: { width: '200px' } },
8972
- React__default.createElement(LeftNav, { leftItems: leftItems })
8973
+ React__default.createElement(LeftNav, { leftItems: leftItems }),
8974
+ website && website.sideFooterContent && website.sideFooterContent.length && website.showFooterOnLeftSide && React__default.createElement(SideFooter, { website: website })
8973
8975
  ),
8974
8976
  React__default.createElement(
8975
8977
  Col,
@@ -9013,7 +9015,7 @@ var Column3 = function Column3(props) {
9013
9015
  row.component
9014
9016
  );
9015
9017
  }),
9016
- website && website.sideFooterContent && website.sideFooterContent.length && React__default.createElement(SideFooter, { website: website })
9018
+ website && website.sideFooterContent && website.sideFooterContent.length && !website.showFooterOnLeftSide && React__default.createElement(SideFooter, { website: website })
9017
9019
  )
9018
9020
  )
9019
9021
  )
@@ -10308,8 +10310,8 @@ var FigureComponent = function FigureComponent(_ref) {
10308
10310
 
10309
10311
  var _useState = React.useState(null),
10310
10312
  _useState2 = slicedToArray(_useState, 2),
10311
- captionWidth = _useState2[0],
10312
- setcaptionWidth = _useState2[1];
10313
+ imageWidth = _useState2[0],
10314
+ setimageWidth = _useState2[1];
10313
10315
 
10314
10316
  var _useState3 = React.useState(''),
10315
10317
  _useState4 = slicedToArray(_useState3, 2),
@@ -10320,65 +10322,68 @@ var FigureComponent = function FigureComponent(_ref) {
10320
10322
  alt = node$$1.alt,
10321
10323
  blank = node$$1.blank,
10322
10324
  link = node$$1.link,
10323
- widthP = node$$1.widthP,
10325
+ _node$widthP = node$$1.widthP,
10326
+ widthP = _node$widthP === undefined ? 'auto' : _node$widthP,
10324
10327
  _node$alignment = node$$1.alignment,
10325
10328
  alignment = _node$alignment === undefined ? 'center' : _node$alignment;
10326
10329
 
10327
- var imgWidth = widthP ? widthP + '%' : '100%';
10328
10330
 
10329
10331
  var figureMargin = void 0;
10330
10332
  if (imgFloat === 'none') {
10331
10333
  figureMargin = '0 auto 1rem';
10332
10334
  }
10333
10335
  if (imgFloat === 'left') {
10334
- figureMargin = '0 10% 1rem 1rem';
10336
+ figureMargin = '0 1.5rem 1.5rem 10%';
10335
10337
  }
10336
10338
  if (imgFloat === 'right') {
10337
- figureMargin = '0 1rem 1rem 10%';
10339
+ figureMargin = '0 10% 1.5rem 1.5rem';
10338
10340
  }
10339
10341
 
10340
10342
  var loadImg = function loadImg() {
10341
- setcaptionWidth(imgElement.current.width);
10343
+ if (widthP == 'auto') {
10344
+ setimageWidth(imgElement.current.naturalWidth);
10345
+ } else {
10346
+ setimageWidth(widthP + '%');
10347
+ }
10342
10348
  };
10343
10349
 
10350
+ React.useEffect(function () {
10351
+ if (widthP == 'auto') {
10352
+ setimageWidth(imgElement.current.naturalWidth + 'px');
10353
+ } else {
10354
+ setimageWidth(widthP + '%');
10355
+ }
10356
+ }, [imageWidth]);
10357
+
10344
10358
  React.useEffect(function () {
10345
10359
  var screenWidth = window.innerWidth;
10346
10360
  if (screenWidth > 1000) {
10347
10361
  var align = alignment.toLowerCase() === 'center' ? 'none' : alignment.toLowerCase();
10348
10362
  setimgFloat(align);
10349
10363
  }
10364
+
10350
10365
  // eslint-disable-next-line react-hooks/exhaustive-deps
10351
10366
  }, []);
10352
10367
 
10353
10368
  return React__default.createElement(
10354
10369
  reactBootstrap.Figure,
10355
- { className: 'd-block text-center mb-3', style: { width: imgWidth, float: imgFloat, clear: 'both', margin: figureMargin } },
10370
+ { className: 'd-block text-center mb-3', style: { width: imageWidth, float: imgFloat, clear: 'both', margin: figureMargin, maxWidth: '100%' } },
10356
10371
  link ? React__default.createElement(
10357
10372
  'a',
10358
10373
  { href: link, target: blank ? '_blank' : '_self' },
10359
- React__default.createElement(reactBootstrap.Figure.Image, {
10360
- ref: imgElement,
10361
- onLoad: loadImg,
10362
- src: urlFor$1(node$$1, client).url(),
10363
- alt: alt && alt
10364
- }),
10374
+ React__default.createElement(reactBootstrap.Figure.Image, { style: { width: '100%' }, className: 'figure-image', ref: imgElement, onLoad: loadImg, src: urlFor$1(node$$1, client).url(), alt: alt && alt }),
10365
10375
  caption && React__default.createElement(
10366
10376
  reactBootstrap.Figure.Caption,
10367
- { style: { width: captionWidth } },
10377
+ { style: { width: '100%', maxWidth: '100%' } },
10368
10378
  caption
10369
10379
  )
10370
10380
  ) : React__default.createElement(
10371
10381
  React__default.Fragment,
10372
10382
  null,
10373
- React__default.createElement(reactBootstrap.Figure.Image, {
10374
- ref: imgElement,
10375
- onLoad: loadImg,
10376
- src: urlFor$1(node$$1, client).url(),
10377
- alt: alt && alt
10378
- }),
10383
+ React__default.createElement(reactBootstrap.Figure.Image, { style: { width: '100%' }, className: 'figure-image', ref: imgElement, onLoad: loadImg, src: urlFor$1(node$$1, client).url(), alt: alt && alt }),
10379
10384
  caption && React__default.createElement(
10380
10385
  reactBootstrap.Figure.Caption,
10381
- { style: { width: captionWidth } },
10386
+ { style: { width: '100%', maxWidth: '100%' } },
10382
10387
  caption
10383
10388
  )
10384
10389
  )
@@ -14040,7 +14045,22 @@ var Media$1 = function Media$$1(_ref) {
14040
14045
 
14041
14046
  var renderFigure = function renderFigure(uploadDoc, poster, blank, caption) {
14042
14047
  if (uploadDoc && uploadDoc.asset) {
14043
- if (poster && poster.asset) {
14048
+ if (poster && poster.asset && caption && caption !== '') {
14049
+ return React__default.createElement(
14050
+ reactBootstrap.Figure,
14051
+ { className: 'mb-3' },
14052
+ React__default.createElement(
14053
+ 'a',
14054
+ { href: uploadDoc.asset.url, target: blank ? '_blank' : '_self' },
14055
+ React__default.createElement(reactBootstrap.Figure.Image, { src: urlFor(poster).url(), fluid: true }),
14056
+ React__default.createElement(
14057
+ reactBootstrap.Figure.Caption,
14058
+ { className: 'text-center' },
14059
+ caption
14060
+ )
14061
+ )
14062
+ );
14063
+ } else if (poster && poster.asset) {
14044
14064
  return React__default.createElement(
14045
14065
  reactBootstrap.Figure,
14046
14066
  { className: 'mb-3' },
@@ -14083,11 +14103,27 @@ var Video = function Video(_ref) {
14083
14103
  var node = _ref.node,
14084
14104
  accountIDs = _ref.accountIDs;
14085
14105
  var source = node.source,
14086
- videoID = node.videoID;
14106
+ videoID = node.videoID,
14107
+ experienceID = node.experienceID;
14087
14108
 
14088
14109
  if (source === 'brightcove' && accountIDs.brightcove) {
14089
- return React__default.createElement(ReactPlayerLoader, { accountId: accountIDs.brightcove.accountId, videoId: videoID, playerId: accountIDs.brightcove.playerId, attrs: { className: 'brightcove' } });
14110
+ if (videoID) {
14111
+ return React__default.createElement(ReactPlayerLoader, { accountId: accountIDs.brightcove.accountId, videoId: videoID, playerId: accountIDs.brightcove.playerId, attrs: { className: 'brightcove' } });
14112
+ } else if (experienceID) {
14113
+ return React__default.createElement('iframe', {
14114
+ src: 'https://players.brightcove.net/' + accountIDs.brightcove.accountId + '/experience_' + experienceID + '/index.html',
14115
+ allowFullScreen: 'true',
14116
+ webkitallowfullscreen: 'true',
14117
+ mozallowfullscreen: 'true',
14118
+ frameBorder: 'none',
14119
+ scrolling: 'no',
14120
+ height: '411',
14121
+ width: '100%'
14122
+ });
14123
+ }
14124
+ return null;
14090
14125
  }
14126
+
14091
14127
  // TODO - add players for other video types
14092
14128
  return null;
14093
14129
  };