@mjhls/mjh-framework 1.0.241 → 1.0.242

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,7 +1,5 @@
1
1
 
2
- # mjh-framework v. 1.0.241
3
-
4
-
2
+ # mjh-framework v. 1.0.242
5
3
 
6
4
 
7
5
  > Foundation Framework
package/dist/cjs/index.js CHANGED
@@ -14440,6 +14440,168 @@ var YahooHero = function YahooHero(props) {
14440
14440
  );
14441
14441
  };
14442
14442
 
14443
+ var GridHero = function GridHero(props) {
14444
+ var topArticle = props.dataRecord[0];
14445
+ var subArticles = props.dataRecord.slice(1, 3);
14446
+
14447
+ var client = props.client;
14448
+
14449
+ var builder = index$1.imageUrlBuilder(client);
14450
+ function urlFor(source) {
14451
+ return builder.image(source);
14452
+ }
14453
+
14454
+ var topArticleThumbnail = '';
14455
+ var topArticleAltText = topArticle.title;
14456
+ if (topArticle.thumbnail && topArticle.thumbnail.asset) {
14457
+ topArticleThumbnail = urlFor(topArticle.thumbnail.asset).width(600).url();
14458
+ topArticleAltText = topArticle.thumbnail.asset.originalFileName;
14459
+ } else if (props.thumbnail) {
14460
+ topArticleThumbnail = props.thumbnail;
14461
+ }
14462
+
14463
+ var renderAuthor = function renderAuthor(authorDetail, index, length) {
14464
+ if (authorDetail) {
14465
+ var _id = authorDetail._id,
14466
+ displayName = authorDetail.displayName,
14467
+ url = authorDetail.url;
14468
+
14469
+ if (displayName && url && url.current) {
14470
+ return React__default.createElement(
14471
+ 'div',
14472
+ { key: _id },
14473
+ index === 0 && React__default.createElement(
14474
+ 'span',
14475
+ { className: 'pr-1' },
14476
+ 'By'
14477
+ ),
14478
+ React__default.createElement(
14479
+ 'a',
14480
+ { href: '/authors/' + url.current, className: 'text-muted' },
14481
+ displayName,
14482
+ length !== index + 1 && React__default.createElement('br', null)
14483
+ )
14484
+ );
14485
+ } else if (displayName) {
14486
+ return React__default.createElement(
14487
+ 'div',
14488
+ { key: _id },
14489
+ index === 0 && React__default.createElement(
14490
+ 'span',
14491
+ { className: 'pr-1' },
14492
+ 'By'
14493
+ ),
14494
+ React__default.createElement(
14495
+ 'span',
14496
+ { className: 'text-muted' },
14497
+ displayName,
14498
+ length !== index + 1 && React__default.createElement('br', null)
14499
+ )
14500
+ );
14501
+ }
14502
+ } else return null;
14503
+ };
14504
+
14505
+ return React__default.createElement(
14506
+ 'div',
14507
+ { className: 'article-hero' },
14508
+ React__default.createElement(
14509
+ 'div',
14510
+ { className: 'grid-top-article' },
14511
+ topArticleThumbnail && React__default.createElement(
14512
+ 'a',
14513
+ { href: '/view/' + topArticle.url.current },
14514
+ React__default.createElement(
14515
+ 'div',
14516
+ { className: 'grid-top-article--img' },
14517
+ React__default.createElement('img', { src: topArticleThumbnail, alt: topArticleAltText })
14518
+ )
14519
+ ),
14520
+ React__default.createElement(
14521
+ 'div',
14522
+ { className: 'grid-top-article--body' },
14523
+ React__default.createElement(
14524
+ 'a',
14525
+ { href: '/view/' + topArticle.url.current },
14526
+ React__default.createElement(
14527
+ 'h1',
14528
+ null,
14529
+ topArticle.title
14530
+ )
14531
+ ),
14532
+ React__default.createElement(
14533
+ 'p',
14534
+ { className: 'article-date' },
14535
+ visibilitySensor.moment(topArticle.published).format('MMMM DD, YYYY ')
14536
+ ),
14537
+ topArticle.authorMapping && topArticle.authorMapping.length > 0 && topArticle.authorMapping.map(function (authorDetail, index) {
14538
+ return renderAuthor(authorDetail, index, topArticle.authorMapping.length);
14539
+ }),
14540
+ topArticle.summary && React__default.createElement(
14541
+ 'p',
14542
+ { className: 'top-article-summary' },
14543
+ entities.clean_html_1(topArticle.summary)
14544
+ )
14545
+ )
14546
+ ),
14547
+ React__default.createElement(
14548
+ 'div',
14549
+ { className: 'grid-sub-article-container' },
14550
+ subArticles.map(function (article, index) {
14551
+ var articleThumbnail = '';
14552
+ var articleAltText = article.title;
14553
+ if (article.thumbnail && article.thumbnail.asset) {
14554
+ articleThumbnail = urlFor(article.thumbnail.asset).width(480).height(270).url();
14555
+ articleAltText = article.thumbnail.asset.originalFileName;
14556
+ } else if (props.thumbnail) {
14557
+ articleThumbnail = props.thumbnail;
14558
+ }
14559
+
14560
+ return React__default.createElement(
14561
+ 'div',
14562
+ { key: index, className: 'grid-sub-article sub-grid-' + (index + 1) },
14563
+ React__default.createElement(
14564
+ 'a',
14565
+ { href: '/view/' + article.url.current },
14566
+ React__default.createElement('img', { src: articleThumbnail, alt: articleAltText })
14567
+ ),
14568
+ React__default.createElement(
14569
+ 'div',
14570
+ { className: 'grid-sub-article-body' },
14571
+ React__default.createElement(
14572
+ 'a',
14573
+ { href: '/view/' + article.url.current },
14574
+ React__default.createElement(
14575
+ 'h2',
14576
+ { className: 'grid-sub-article--title' },
14577
+ article.title
14578
+ )
14579
+ ),
14580
+ React__default.createElement(
14581
+ 'p',
14582
+ { className: 'article-date' },
14583
+ visibilitySensor.moment(article.published).format('MMMM DD, YYYY ')
14584
+ ),
14585
+ article.authorMapping && article.authorMapping.length > 0 && article.authorMapping.map(function (authorDetail, index) {
14586
+ return renderAuthor(authorDetail, index, article.authorMapping.length);
14587
+ }),
14588
+ article.summary && React__default.createElement(
14589
+ 'p',
14590
+ { className: 'sub-article-summary' },
14591
+ entities.clean_html_1(article.summary)
14592
+ )
14593
+ )
14594
+ );
14595
+ })
14596
+ ),
14597
+ React__default.createElement(
14598
+ 'style',
14599
+ { jsx: 'true' },
14600
+ '\n .article-hero {\n margin-bottom: 1rem;\n border-bottom: 1px solid #ddd;\n padding-bottom: 0.5rem;\n margin-left: 15px;\n margin-right: 15px;\n }\n .grid-top-article {\n width: 100%;\n margin-bottom: 1rem;\n padding-bottom: 1rem;\n border-bottom: 5px solid var(--primary);\n box-shadow: 1px 3px 3px rgba(0, 0, 0, 0.2);\n }\n .grid-top-article img {\n width: 100%;\n\n max-height: 300px;\n min-height: 275px;\n object-fit: cover;\n height: 112.5px;\n }\n\n .grid-top-article--body {\n padding: 1.25rem;\n }\n .grid-top-article--body h1 {\n color: #373a3c !important;\n margin-bottom: 0.25rem !important;\n font-weight: 600 !important;\n font-size: 1.6rem;\n font-size: 1.40625rem;\n line-height: 1.2;\n }\n .grid-top-article--body p {\n margin-bottom: 0;\n color: #252525;\n }\n\n .grid-sub-article-container {\n display: flex;\n flex-direction: row;\n padding-top: 1rem;\n }\n .grid-sub-article {\n width: 48%;\n margin-bottom: 1.75rem;\n }\n .grid-sub-article-body {\n padding: 1.25rem;\n }\n @media screen and (min-width: 992px) {\n .sub-grid-1 {\n margin-right: 2%;\n }\n .sub-grid-2 {\n margin-left: 2%;\n }\n }\n .grid-sub-article img {\n margin-right: 1rem;\n width: 100%;\n max-height: 240px;\n object-fit: contain;\n }\n .grid-sub-article p {\n margin-bottom: 0;\n\n color: #373a3c;\n }\n .grid-sub-article .grid-sub-article--title {\n color: #373a3c !important;\n margin-bottom: 0.25rem !important;\n font-weight: 600 !important;\n font-size: 1.6rem;\n font-size: 1.40625rem;\n line-height: 1.2;\n }\n .author-text {\n font-size: 0.9375rem;\n font-weight: 400;\n line-height: 1.5;\n }\n .author-text > span {\n color: #868e96 !important;\n }\n .article-date {\n font-style: italic;\n }\n .top-article-summary,\n .sub-article-summary {\n margin-top: 0.5rem;\n }\n\n @media screen and (max-width: 992px) {\n .grid-sub-article-container {\n flex-direction: column;\n }\n .grid-sub-article {\n width: 100%;\n }\n }\n '
14601
+ )
14602
+ );
14603
+ };
14604
+
14443
14605
  /*
14444
14606
  Sample query
14445
14607
  let references = ''
@@ -15220,6 +15382,7 @@ exports.ConferenceArticleCard = ConferenceArticleCard;
15220
15382
  exports.EventsDeck = EventsDeck;
15221
15383
  exports.Feature = Feature;
15222
15384
  exports.ForbesHero = fbsHero;
15385
+ exports.GridHero = GridHero;
15223
15386
  exports.Hero = Hero;
15224
15387
  exports.HorizontalHero = HorizontalHero;
15225
15388
  exports.OncliveHero = OncliveHero;
package/dist/esm/index.js CHANGED
@@ -14438,6 +14438,168 @@ var YahooHero = function YahooHero(props) {
14438
14438
  );
14439
14439
  };
14440
14440
 
14441
+ var GridHero = function GridHero(props) {
14442
+ var topArticle = props.dataRecord[0];
14443
+ var subArticles = props.dataRecord.slice(1, 3);
14444
+
14445
+ var client = props.client;
14446
+
14447
+ var builder = imageUrlBuilder(client);
14448
+ function urlFor(source) {
14449
+ return builder.image(source);
14450
+ }
14451
+
14452
+ var topArticleThumbnail = '';
14453
+ var topArticleAltText = topArticle.title;
14454
+ if (topArticle.thumbnail && topArticle.thumbnail.asset) {
14455
+ topArticleThumbnail = urlFor(topArticle.thumbnail.asset).width(600).url();
14456
+ topArticleAltText = topArticle.thumbnail.asset.originalFileName;
14457
+ } else if (props.thumbnail) {
14458
+ topArticleThumbnail = props.thumbnail;
14459
+ }
14460
+
14461
+ var renderAuthor = function renderAuthor(authorDetail, index, length) {
14462
+ if (authorDetail) {
14463
+ var _id = authorDetail._id,
14464
+ displayName = authorDetail.displayName,
14465
+ url = authorDetail.url;
14466
+
14467
+ if (displayName && url && url.current) {
14468
+ return React__default.createElement(
14469
+ 'div',
14470
+ { key: _id },
14471
+ index === 0 && React__default.createElement(
14472
+ 'span',
14473
+ { className: 'pr-1' },
14474
+ 'By'
14475
+ ),
14476
+ React__default.createElement(
14477
+ 'a',
14478
+ { href: '/authors/' + url.current, className: 'text-muted' },
14479
+ displayName,
14480
+ length !== index + 1 && React__default.createElement('br', null)
14481
+ )
14482
+ );
14483
+ } else if (displayName) {
14484
+ return React__default.createElement(
14485
+ 'div',
14486
+ { key: _id },
14487
+ index === 0 && React__default.createElement(
14488
+ 'span',
14489
+ { className: 'pr-1' },
14490
+ 'By'
14491
+ ),
14492
+ React__default.createElement(
14493
+ 'span',
14494
+ { className: 'text-muted' },
14495
+ displayName,
14496
+ length !== index + 1 && React__default.createElement('br', null)
14497
+ )
14498
+ );
14499
+ }
14500
+ } else return null;
14501
+ };
14502
+
14503
+ return React__default.createElement(
14504
+ 'div',
14505
+ { className: 'article-hero' },
14506
+ React__default.createElement(
14507
+ 'div',
14508
+ { className: 'grid-top-article' },
14509
+ topArticleThumbnail && React__default.createElement(
14510
+ 'a',
14511
+ { href: '/view/' + topArticle.url.current },
14512
+ React__default.createElement(
14513
+ 'div',
14514
+ { className: 'grid-top-article--img' },
14515
+ React__default.createElement('img', { src: topArticleThumbnail, alt: topArticleAltText })
14516
+ )
14517
+ ),
14518
+ React__default.createElement(
14519
+ 'div',
14520
+ { className: 'grid-top-article--body' },
14521
+ React__default.createElement(
14522
+ 'a',
14523
+ { href: '/view/' + topArticle.url.current },
14524
+ React__default.createElement(
14525
+ 'h1',
14526
+ null,
14527
+ topArticle.title
14528
+ )
14529
+ ),
14530
+ React__default.createElement(
14531
+ 'p',
14532
+ { className: 'article-date' },
14533
+ moment(topArticle.published).format('MMMM DD, YYYY ')
14534
+ ),
14535
+ topArticle.authorMapping && topArticle.authorMapping.length > 0 && topArticle.authorMapping.map(function (authorDetail, index) {
14536
+ return renderAuthor(authorDetail, index, topArticle.authorMapping.length);
14537
+ }),
14538
+ topArticle.summary && React__default.createElement(
14539
+ 'p',
14540
+ { className: 'top-article-summary' },
14541
+ clean_html_1(topArticle.summary)
14542
+ )
14543
+ )
14544
+ ),
14545
+ React__default.createElement(
14546
+ 'div',
14547
+ { className: 'grid-sub-article-container' },
14548
+ subArticles.map(function (article, index) {
14549
+ var articleThumbnail = '';
14550
+ var articleAltText = article.title;
14551
+ if (article.thumbnail && article.thumbnail.asset) {
14552
+ articleThumbnail = urlFor(article.thumbnail.asset).width(480).height(270).url();
14553
+ articleAltText = article.thumbnail.asset.originalFileName;
14554
+ } else if (props.thumbnail) {
14555
+ articleThumbnail = props.thumbnail;
14556
+ }
14557
+
14558
+ return React__default.createElement(
14559
+ 'div',
14560
+ { key: index, className: 'grid-sub-article sub-grid-' + (index + 1) },
14561
+ React__default.createElement(
14562
+ 'a',
14563
+ { href: '/view/' + article.url.current },
14564
+ React__default.createElement('img', { src: articleThumbnail, alt: articleAltText })
14565
+ ),
14566
+ React__default.createElement(
14567
+ 'div',
14568
+ { className: 'grid-sub-article-body' },
14569
+ React__default.createElement(
14570
+ 'a',
14571
+ { href: '/view/' + article.url.current },
14572
+ React__default.createElement(
14573
+ 'h2',
14574
+ { className: 'grid-sub-article--title' },
14575
+ article.title
14576
+ )
14577
+ ),
14578
+ React__default.createElement(
14579
+ 'p',
14580
+ { className: 'article-date' },
14581
+ moment(article.published).format('MMMM DD, YYYY ')
14582
+ ),
14583
+ article.authorMapping && article.authorMapping.length > 0 && article.authorMapping.map(function (authorDetail, index) {
14584
+ return renderAuthor(authorDetail, index, article.authorMapping.length);
14585
+ }),
14586
+ article.summary && React__default.createElement(
14587
+ 'p',
14588
+ { className: 'sub-article-summary' },
14589
+ clean_html_1(article.summary)
14590
+ )
14591
+ )
14592
+ );
14593
+ })
14594
+ ),
14595
+ React__default.createElement(
14596
+ 'style',
14597
+ { jsx: 'true' },
14598
+ '\n .article-hero {\n margin-bottom: 1rem;\n border-bottom: 1px solid #ddd;\n padding-bottom: 0.5rem;\n margin-left: 15px;\n margin-right: 15px;\n }\n .grid-top-article {\n width: 100%;\n margin-bottom: 1rem;\n padding-bottom: 1rem;\n border-bottom: 5px solid var(--primary);\n box-shadow: 1px 3px 3px rgba(0, 0, 0, 0.2);\n }\n .grid-top-article img {\n width: 100%;\n\n max-height: 300px;\n min-height: 275px;\n object-fit: cover;\n height: 112.5px;\n }\n\n .grid-top-article--body {\n padding: 1.25rem;\n }\n .grid-top-article--body h1 {\n color: #373a3c !important;\n margin-bottom: 0.25rem !important;\n font-weight: 600 !important;\n font-size: 1.6rem;\n font-size: 1.40625rem;\n line-height: 1.2;\n }\n .grid-top-article--body p {\n margin-bottom: 0;\n color: #252525;\n }\n\n .grid-sub-article-container {\n display: flex;\n flex-direction: row;\n padding-top: 1rem;\n }\n .grid-sub-article {\n width: 48%;\n margin-bottom: 1.75rem;\n }\n .grid-sub-article-body {\n padding: 1.25rem;\n }\n @media screen and (min-width: 992px) {\n .sub-grid-1 {\n margin-right: 2%;\n }\n .sub-grid-2 {\n margin-left: 2%;\n }\n }\n .grid-sub-article img {\n margin-right: 1rem;\n width: 100%;\n max-height: 240px;\n object-fit: contain;\n }\n .grid-sub-article p {\n margin-bottom: 0;\n\n color: #373a3c;\n }\n .grid-sub-article .grid-sub-article--title {\n color: #373a3c !important;\n margin-bottom: 0.25rem !important;\n font-weight: 600 !important;\n font-size: 1.6rem;\n font-size: 1.40625rem;\n line-height: 1.2;\n }\n .author-text {\n font-size: 0.9375rem;\n font-weight: 400;\n line-height: 1.5;\n }\n .author-text > span {\n color: #868e96 !important;\n }\n .article-date {\n font-style: italic;\n }\n .top-article-summary,\n .sub-article-summary {\n margin-top: 0.5rem;\n }\n\n @media screen and (max-width: 992px) {\n .grid-sub-article-container {\n flex-direction: column;\n }\n .grid-sub-article {\n width: 100%;\n }\n }\n '
14599
+ )
14600
+ );
14601
+ };
14602
+
14441
14603
  /*
14442
14604
  Sample query
14443
14605
  let references = ''
@@ -15172,4 +15334,4 @@ var _initialiseProps = function _initialiseProps() {
15172
15334
  };
15173
15335
  };
15174
15336
 
15175
- export { AD300x250, AD300x250x600, ADFooter, AccordionPanel, AdSlotsProvider, AlphabeticList, ArticleDetailDropdown, ArticleQueue, Breadcrumbs$1 as Breadcrumbs, CMEDeck, ConferenceArticleCard, EventsDeck, Feature, fbsHero as ForbesHero, Hero, HorizontalHero, OncliveHero, OncliveLargeHero, PdfDownload, RelatedContent, RelatedTopicsDropdown, SetCookie, SocialShare$1 as SocialShare, VerticalHero, YahooHero, getSerializers };
15337
+ export { AD300x250, AD300x250x600, ADFooter, AccordionPanel, AdSlotsProvider, AlphabeticList, ArticleDetailDropdown, ArticleQueue, Breadcrumbs$1 as Breadcrumbs, CMEDeck, ConferenceArticleCard, EventsDeck, Feature, fbsHero as ForbesHero, GridHero, Hero, HorizontalHero, OncliveHero, OncliveLargeHero, PdfDownload, RelatedContent, RelatedTopicsDropdown, SetCookie, SocialShare$1 as SocialShare, VerticalHero, YahooHero, getSerializers };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@mjhls/mjh-framework",
3
- "version": "1.0.241",
3
+ "version": "1.0.242",
4
4
  "description": "Foundation Framework",
5
5
  "author": "mjh-framework",
6
6
  "license": "MIT",