Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

@guardian/atoms-rendering

Package Overview
Dependencies
Maintainers
36
Versions
157
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@guardian/atoms-rendering - npm Package Compare versions

Comparing version 1.8.0 to 1.8.1

2

dist/index.js

@@ -1,2 +0,2 @@

var n,e=require("react"),t=(n=e)&&"object"==typeof n&&"default"in n?n.default:n,r=require("emotion"),a=require("@guardian/src-foundations/typography"),i=require("@guardian/src-foundations"),l=require("@guardian/src-foundations/palette"),o=require("@guardian/src-icons"),s=require("@guardian/src-foundations/palette/"),c=require("react-dom/server");function m(n,e){return e||(e=n.slice(0)),n.raw=e,n}function d(){var n=m(["\n ","\n "]);return d=function(){return n},n}function u(){var n=m(["\n ","\n margin-top: ","px;\n "]);return u=function(){return n},n}function p(){var n=m(["\n padding-bottom: ","px;\n padding-left: ","px;\n padding-right: ","px;\n border-top: 1px solid ",";\n color: ",";\n background: ",";\n\n p {\n margin-top: ","px;\n margin-bottom: ","px;\n }\n "]);return p=function(){return n},n}var f=function(n){var e=n.children;return t.createElement("figure",{"data-atom-id":n.id,"data-atom-type":"explainer",className:r.css(p(),i.space[1],i.space[2],i.space[2],l.text.primary,l.text.primary,l.neutral[97],i.space[3],i.space[3])},e)},g=function(n){var e=n.title;return t.createElement("h3",{className:r.css(u(),a.headline.xxsmall({fontWeight:"bold"}),i.space[2])},e)},h=function(n){var e=n.html;return t.createElement("div",{className:r.css(d(),a.textSans.small({fontWeight:"light",lineHeight:"tight"})),dangerouslySetInnerHTML:{__html:e}})};function x(n,e){switch(n){case"opinion":return s.opinion[e];case"sport":return s.sport[e];case"culture":return s.culture[e];case"lifestyle":return s.lifestyle[e];case"news":return s.news[e];default:return s.news[400]}}function b(){var n=m(["\n ",";\n height: 28px;\n "]);return b=function(){return n},n}function v(){var n=m(["\n transform: rotate(180deg);\n -webkit-transform: rotate(180deg);\n -moz-transform: rotate(180deg);\n -o-transform: rotate(180deg);\n "]);return v=function(){return n},n}function E(){var n=m(["\n display: flex;\n align-items: center;\n ",";\n "]);return E=function(){return n},n}function y(){var n=m(["\n display: inline-flex;\n cursor: pointer;\n align-items: center;\n justify-content: center;\n background: black;\n color: white;\n border-style: hidden;\n border-radius: 100%;\n margin: 0 0 0 5px;\n padding: 0;\n width: 28px;\n height: 28px;\n :hover {\n background: ",";\n }\n :focus {\n border: none;\n }\n "]);return y=function(){return n},n}function k(){var n=m(["\n width: 16px;\n height: 16px;\n "]);return k=function(){return n},n}function w(){var n=m(["\n font-size: 13px;\n line-height: 16px;\n display: flex;\n justify-content: flex-end;\n"]);return w=function(){return n},n}var N=r.css(w()),S=function(){return t.createElement("svg",{className:r.css(k()),viewBox:"0 0 40 40"},t.createElement("path",{fill:"#FFF",d:"M33.78 22.437l-4.228 13.98L27.93 37.5 5.062 34.14V15.503l7.8-1.517L24.354 2.5h1.624L28.9 5.426l-4.548 8.67h.107l10.477 1.31"}))},H=function(n){var i=n.pillar,l=n.likeHandler,o=n.dislikeHandler,s=r.css(y(),x(i,400)),c=e.useState(!1),m=c[0],d=c[1];return t.createElement("footer",{className:N},t.createElement("div",{hidden:m},t.createElement("div",{className:r.css(E(),a.textSans.xsmall())},t.createElement("div",null,"Was this helpful?"),t.createElement("button",{"data-testid":"like",className:s,onClick:function(){l(),d(!0)}},t.createElement(S,null)),t.createElement("button",{className:r.cx(s,r.css(v())),"data-testid":"dislike",onClick:function(){o(),d(!0)}},t.createElement(S,null)))),t.createElement("div",{className:r.css(b(),a.textSans.xsmall()),"data-testid":"feedback",hidden:!m},"Thank you for your feedback."))};function T(){var n=m(["\n background: ",";\n color: ",";\n height: 2rem;\n position: absolute;\n bottom: 0;\n transform: translate(0, 50%);\n padding: 0 15px 0 7px;\n border-radius: 100em;\n cursor: pointer;\n display: inline-flex;\n align-items: center;\n border: 0;\n margin: 0;\n :hover {\n background: ",";\n }\n "]);return T=function(){return n},n}function A(){var n=m(["\n display: block;\n ",";\n color: ",";\n "]);return A=function(){return n},n}function C(){var n=m(["\n display: inline-flex;\n align-items: center;\n ",";\n"]);return C=function(){return n},n}function _(){var n=m(["\n margin-right: 14px;\n margin-bottom: 6px;\n width: 30px;\n fill: white;\n height: 25px;\n padding-left: 4px;\n"]);return _=function(){return n},n}function L(){var n=m(["\n margin-right: 12px;\n margin-bottom: 6px;\n width: 33px;\n fill: white;\n height: 28px;\n"]);return L=function(){return n},n}function W(){var n=m(["\n ",";\n margin: 0;\n line-height: 22px;\n"]);return W=function(){return n},n}var M=r.css(W(),a.headline.xxxsmall({fontWeight:"medium"})),F=r.css(L()),z=r.css(_()),I=r.css(C(),a.textSans.small()),j=function(n){var i=n.sectionTitle,l=n.title,c=n.pillar,m=n.expandCallback,d=r.css(A(),a.body.medium({lineHeight:"tight",fontWeight:"bold"}),x(c,400)),u=r.css(T(),s.neutral[7],s.neutral[100],x(c,400)),p=e.useState(!1),f=p[0],g=p[1],h=e.useState(!1),b=h[0],v=h[1];return t.createElement("summary",{onClick:function(){b||(m(),v(!0)),g(!f)}},t.createElement("span",{className:d},i),t.createElement("h4",{className:M},l),t.createElement("span",{className:u},f?t.createElement("span",{className:I},t.createElement("span",{className:z},t.createElement(o.SvgMinus,null)),"Hide"):t.createElement("span",{className:I},t.createElement("span",{className:F},t.createElement(o.SvgPlus,null)),"Show")))};function q(){var n=m(["\n a {\n color: ",";\n text-decoration: none;\n border-bottom: 0.0625rem solid ",";\n transition: border-color 0.15s ease-out;\n }\n\n a:hover {\n border-bottom: solid 0.0625rem ",";\n }\n "]);return q=function(){return n},n}function D(){var n=m(["\n ",";\n margin: 12px 0;\n display: flex;\n align-items: center;\n svg {\n width: 30px;\n fill: ",";\n }\n"]);return D=function(){return n},n}function Q(){var n=m(["\n .forceHeightAndWidth & {\n width: 100px;\n height: 100px;\n }\n float: left;\n margin-right: 16px;\n margin-bottom: 6px;\n object-fit: cover;\n border-radius: 50%;\n display: block;\n border: 0px;\n"]);return Q=function(){return n},n}function B(){var n=m(["\n ","\n p {\n margin-bottom: 0.5rem;\n }\n\n ol {\n list-style: decimal;\n list-style-position: inside;\n margin-bottom: 1rem;\n }\n\n ul {\n list-style: none;\n margin: 0 0 0.75rem;\n padding: 0;\n margin-bottom: 1rem;\n }\n\n ul li {\n margin-bottom: 0.375rem;\n padding-left: 1.25rem;\n }\n\n ul li:before {\n display: inline-block;\n content: '';\n border-radius: 0.375rem;\n height: 0.75rem;\n width: 0.75rem;\n margin-right: 0.5rem;\n background-color: ",";\n margin-left: -1.25rem;\n }\n\n /* Without this bold elements are overridden */\n b {\n font-weight: 700;\n }\n"]);return B=function(){return n},n}function P(){var n=m(["\n margin: 16px 0 36px;\n background: ",";\n padding: 0 5px 6px;\n border-image: repeating-linear-gradient(\n to bottom,\n ",",\n "," 1px,\n transparent 1px,\n transparent 4px\n )\n 13;\n border-top: 13px solid black;\n position: relative;\n summary {\n list-style: none;\n margin: 0 0 16px;\n }\n\n /* https://developer.mozilla.org/en-US/docs/Web/HTML/Element/details#Customizing_the_disclosure_widget */\n summary::-webkit-details-marker {\n display: none;\n }\n\n summary:focus {\n outline: none;\n }\n"]);return P=function(){return n},n}function O(){var n=m(["\n display: block;\n position: relative;\n margin-bottom: 0.75rem;\n margin-top: 1rem;\n"]);return O=function(){return n},n}var V=r.css(O()),G=r.css(P(),l.neutral[93],l.neutral[86],l.neutral[86]),U=r.css(B(),a.body.medium(),l.neutral[86]),Y=r.css(Q()),J=r.css(D(),a.textSans.xsmall(),l.neutral[60]),K=function(n){var e=n.id,r=n.children;return t.createElement("div",{className:V,"data-atom-id":e,"data-atom-type":"guide"},t.createElement("details",{className:G,"data-atom-id":e,"data-snippet-type":"guide",open:n.expandForStorybook},t.createElement(j,{sectionTitle:"Quick Guide",pillar:n.pillar,title:n.title,expandCallback:n.expandCallback}),r))},R=function(n){var e=n.html,a=n.image,i=n.credit,s=n.pillar,c=r.css(q(),x(s,300),l.neutral[86],x(s,400));return t.createElement("div",null,a&&t.createElement("span",{className:"forceHeightAndWidth"},t.createElement("img",{className:Y,src:a,alt:""})),t.createElement("div",{className:r.cx(U,c),dangerouslySetInnerHTML:{__html:e}}),i&&t.createElement("div",{className:J},t.createElement(o.SvgInfo,null),i))},X=function(n){var e=n.css,r=n.js,a=n.html;return c.renderToString(t.createElement("html",null,t.createElement("head",null,t.createElement("meta",{charSet:"utf-8"}),t.createElement("meta",{name:"viewport",content:"width=device-width,minimum-scale=1,initial-scale=1"}),e&&t.createElement("style",{dangerouslySetInnerHTML:{__html:e}})),t.createElement("body",null,a&&t.createElement("div",{dangerouslySetInnerHTML:{__html:a}})),t.createElement("script",{dangerouslySetInnerHTML:{__html:r}}),t.createElement("script",{dangerouslySetInnerHTML:{__html:"\n function resize() {\n window.frameElement.height = document.body.offsetHeight;\n }\n window.addEventListener('resize', resize);\n resize();\n "}}),t.createElement("script",{dangerouslySetInnerHTML:{__html:"\n var fonts = [].slice.apply(window.parent.document.styleSheets)\n .filter(function (sheet) { return sheet.ownerNode.className.indexOf(\"webfont\") > - 1; })\n .map(function (sheet) { return sheet.ownerNode.textContent; })\n .join(' ');\n var css = document.createElement('style');\n css.textContent = fonts;\n document.head.appendChild(css);\n "}})))};function Z(){var n=m(["\n width: 100%;\n"]);return Z=function(){return n},n}function $(){var n=m(["\n margin: 0;\n"]);return $=function(){return n},n}var nn=r.css($()),en=r.css(Z());function tn(){var n=m(["\n margin: 16px 0 36px;\n background: ",";\n padding: 0 5px 6px;\n border-image: repeating-linear-gradient(\n to bottom,\n ",",\n "," 1px,\n transparent 1px,\n transparent 4px\n )\n 13;\n border-top: 13px solid black;\n position: relative;\n summary {\n list-style: none;\n margin: 0 0 16px;\n }\n\n /* https://developer.mozilla.org/en-US/docs/Web/HTML/Element/details#Customizing_the_disclosure_widget */\n summary::-webkit-details-marker {\n display: none;\n }\n\n summary:focus {\n outline: none;\n }\n"]);return tn=function(){return n},n}function rn(){var n=m(["\n display: block;\n position: relative;\n margin-bottom: 0.75rem;\n margin-top: 1rem;\n"]);return rn=function(){return n},n}var an=r.css(rn()),ln=r.css(tn(),l.neutral[93],l.neutral[86],l.neutral[86]),on=function(n){var e=n.id,r=n.children,a=n.atomType;return t.createElement("div",{className:an,"data-atom-id":e,"data-atom-type":a},t.createElement("details",{className:ln,"data-atom-id":e,"data-snippet-type":a,open:n.expandForStorybook},t.createElement(j,{sectionTitle:n.atomTypeTitle,pillar:n.pillar,title:n.title,expandCallback:n.expandCallback}),r))};function sn(){var n=m(["\n a {\n color: ",";\n text-decoration: none;\n border-bottom: 0.0625rem solid ",";\n transition: border-color 0.15s ease-out;\n }\n\n a:hover {\n border-bottom: solid 0.0625rem ",";\n }\n"]);return sn=function(){return n},n}function cn(){var n=m(["\n ","\n p {\n margin-bottom: 0.5rem;\n }\n\n ol {\n list-style: decimal;\n list-style-position: inside;\n margin-bottom: 1rem;\n }\n\n ul {\n list-style: none;\n margin: 0 0 0.75rem;\n padding: 0;\n margin-bottom: 1rem;\n }\n\n ul li {\n margin-bottom: 0.375rem;\n padding-left: 1.25rem;\n }\n\n ul li:before {\n display: inline-block;\n content: '';\n border-radius: 0.375rem;\n height: 0.75rem;\n width: 0.75rem;\n margin-right: 0.5rem;\n background-color: ",";\n margin-left: -1.25rem;\n }\n\n /* Without this bold elements are overridden */\n b {\n font-weight: 700;\n }\n\n i {\n font-style: italic;\n }\n"]);return cn=function(){return n},n}function mn(){var n=m(["\n ",";\n margin: 12px 0;\n display: flex;\n align-items: center;\n svg {\n width: 30px;\n fill: ",";\n }\n"]);return mn=function(){return n},n}function dn(){var n=m(["\n .forceHeightAndWidth & {\n width: 100px;\n height: 100px;\n }\n float: left;\n margin-right: 16px;\n margin-bottom: 6px;\n object-fit: cover;\n border-radius: 50%;\n display: block;\n border: 0px;\n"]);return dn=function(){return n},n}var un=r.css(dn()),pn=r.css(mn(),a.textSans.xsmall(),l.neutral[60]),fn=r.css(cn(),a.body.medium(),l.neutral[86]),gn=function(n){return r.css(sn(),x(n,300),l.neutral[86],x(n,400))},hn=function(n){var e=n.html,a=n.image,i=n.credit,l=n.pillar;return t.createElement("div",null,a&&t.createElement("span",{className:"forceHeightAndWidth"},t.createElement("img",{className:un,src:a,alt:""})),t.createElement("div",{className:r.cx(fn,gn(l)),dangerouslySetInnerHTML:{__html:e}}),i&&t.createElement("div",{className:pn},t.createElement(o.SvgInfo,null),i))};function xn(){var n=m(["\n ",";\n margin: 0;\n line-height: 22px;\n "]);return xn=function(){return n},n}function bn(){var n=m(["\n color: ",";\n display: block;\n ",";\n "]);return bn=function(){return n},n}function vn(){var n=m(["\n ",";\n margin: 12px 0;\n display: flex;\n align-items: center;\n svg {\n width: 30px;\n fill: #999999;\n }\n"]);return vn=function(){return n},n}function En(){var n=m(["\n ",";\n height: 28px;\n"]);return En=function(){return n},n}function yn(){var n=m(["\n display: flex;\n align-items: center;\n ",";\n"]);return yn=function(){return n},n}function kn(){var n=m(["\n font-size: 13px;\n line-height: 16px;\n display: flex;\n justify-content: flex-end;\n"]);return kn=function(){return n},n}function wn(){var n=m(["\n transform: rotate(180deg);\n -webkit-transform: rotate(180deg);\n -moz-transform: rotate(180deg);\n -o-transform: rotate(180deg);\n"]);return wn=function(){return n},n}function Nn(){var n=m(["\n width: 16px;\n height: 16px;\n"]);return Nn=function(){return n},n}function Sn(){var n=m(["\n display: inline-flex;\n align-items: center;\n ",";\n"]);return Sn=function(){return n},n}function Hn(){var n=m(["\n margin-right: 14px;\n margin-bottom: 6px;\n width: 30px;\n fill: white;\n height: 25px;\n padding-left: 4px;\n"]);return Hn=function(){return n},n}function Tn(){var n=m(["\n margin-right: 12px;\n margin-bottom: 6px;\n width: 33px;\n fill: white;\n height: 28px;\n"]);return Tn=function(){return n},n}function An(){var n=m(["\n .forceHeightAndWidth & {\n width: 100px;\n height: 100px;\n }\n float: left;\n margin-right: 16px;\n margin-bottom: 6px;\n object-fit: cover;\n border-radius: 50%;\n display: block;\n border: 0px;\n"]);return An=function(){return n},n}function Cn(){var n=m(["\n display: inline-flex;\n cursor: pointer;\n align-items: center;\n justify-content: center;\n background: black;\n color: white;\n border-style: hidden;\n border-radius: 100%;\n margin: 0 0 0 5px;\n padding: 0;\n width: 28px;\n height: 28px;\n :hover {\n background: ",";\n border-color: ",";\n }\n\n :focus {\n border: none;\n }\n"]);return Cn=function(){return n},n}function _n(){var n=m(["\n background: ",";\n color: ",";\n height: 2rem;\n font-size: 13px;\n position: absolute;\n bottom: 0;\n transform: translate(0, 50%);\n padding: 0 15px 0 7px;\n border-radius: 100em;\n cursor: pointer;\n display: inline-flex;\n align-items: center;\n border: 0;\n margin: 0;\n :hover {\n background: ",";\n }\n"]);return _n=function(){return n},n}function Ln(){var n=m([""]);return Ln=function(){return n},n}function Wn(){var n=m(["\n ","\n p {\n margin-bottom: 0.5rem;\n }\n ol {\n list-style: decimal;\n list-style-position: inside;\n margin-bottom: 1rem;\n }\n\n ul {\n list-style: none;\n margin: 0 0 0.75rem;\n padding: 0;\n margin-bottom: 1rem;\n }\n\n ul li {\n margin-bottom: 0.375rem;\n padding-left: 1.25rem;\n }\n\n ul li:before {\n display: inline-block;\n content: '';\n border-radius: 0.375rem;\n height: 0.75rem;\n width: 0.75rem;\n margin-right: 0.5rem;\n background-color: ",";\n margin-left: -1.25rem;\n }\n\n a {\n color: ",";\n text-decoration: none;\n border-bottom: 0.0625rem solid ",";\n transition: border-color 0.15s ease-out;\n }\n\n a:hover {\n border-bottom: solid 0.0625rem ",";\n }\n\n b {\n font-weight: bold;\n }\n"]);return Wn=function(){return n},n}function Mn(){var n=m(["\n margin: 16px 0 36px;\n background: ",";\n padding: 0 5px 6px;\n border-image: repeating-linear-gradient(\n to bottom,\n ",",\n "," 1px,\n transparent 1px,\n transparent 4px\n )\n 13;\n border-top: 13px solid black;\n border-left: 0;\n border-right: 0;\n border-bottom: 0;\n position: relative;\n summary {\n list-style: none;\n margin: 0 0 16px;\n }\n summary::-webkit-details-marker {\n display: none;\n }\n\n summary:focus {\n outline: none;\n }\n"]);return Mn=function(){return n},n}function Fn(){var n=m(["\n display: block;\n position: relative;\n margin-bottom: 0.75rem;\n margin-top: 1rem;\n"]);return Fn=function(){return n},n}var zn=r.css(Fn()),In=r.css(Mn(),l.neutral[93],l.neutral[86],l.neutral[86]),jn=r.css(Wn(),a.body.medium(),l.neutral[86],l.news[300],l.neutral[86],l.news[400]),qn=r.css(Ln()),Dn=r.css(_n(),l.neutral[7],l.neutral[100],l.news[400]),Qn=r.css(Cn(),l.news[400],l.news[400]),Bn=r.css(An()),Pn=r.css(Tn()),On=r.css(Hn()),Vn=r.css(Sn(),a.textSans.small()),Gn=r.css(Nn()),Un=r.css(wn()),Yn=r.css(kn()),Jn=r.css(yn(),a.textSans.xsmall()),Kn=r.css(En(),a.textSans.xsmall()),Rn=r.css(vn(),a.textSans.xsmall()),Xn=function(n){var e=n.id,r=n.children;return t.createElement("div",{className:zn,"data-atom-id":e,"data-atom-type":"qanda"},t.createElement("details",{"data-snippet-id":e,"data-snippet-type":"qanda",className:In},t.createElement(Zn,{title:n.title,expandHandler:n.expandHandler}),r))},Zn=function(n){var i=n.title,s=n.expandHandler,c=e.useState(!1),m=c[0],d=c[1],u=e.useState(!1),p=u[0],f=u[1];return t.createElement("summary",{onClick:function(){p||(s(),f(!0)),d(!m)},className:qn},t.createElement("span",{className:r.css(bn(),l.news[400],a.body.medium({lineHeight:"tight",fontWeight:"bold"}))},"Q&A"),t.createElement("h4",{className:r.css(xn(),a.headline.xxxsmall({fontWeight:"medium"}))},i),t.createElement("span",{className:Dn},!m&&t.createElement("span",{className:Vn},t.createElement("span",{className:Pn},t.createElement(o.SvgPlus,null)),"Show"),m&&t.createElement("span",{className:Vn},t.createElement("span",{className:On},t.createElement(o.SvgMinus,null)),"Hide")))},$n=function(n){var e=n.html,r=n.image,a=n.credit;return t.createElement("div",null,r&&t.createElement("span",{className:"forceHeightAndWidth"},t.createElement("img",{className:Bn,src:r,alt:""})),t.createElement("div",{className:jn,dangerouslySetInnerHTML:{__html:e}}),a&&t.createElement(ne,{credit:a}))},ne=function(n){var e=n.credit;return t.createElement("div",{className:Rn},t.createElement(o.SvgInfo,null),e)},ee=function(n){var a=n.likeHandler,i=n.dislikeHandler,l=e.useState(!1),o=l[0],s=l[1];return t.createElement("footer",{className:Yn},t.createElement("div",{hidden:o},t.createElement("div",{className:Jn},t.createElement("div",null,"Was this helpful?"),t.createElement("button",{className:Qn,value:"like","aria-label":"Yes","data-testid":"like",onClick:function(){a(),s(!0)}},t.createElement("svg",{className:Gn,viewBox:"0 0 40 40"},t.createElement("path",{fill:"#FFF",d:"M33.78 22.437l-4.228 13.98L27.93 37.5 5.062 34.14V15.503l7.8-1.517L24.354 2.5h1.624L28.9 5.426l-4.548 8.67h.107l10.477 1.31"}))),t.createElement("button",{className:r.cx(Qn,Un),value:"dislike","aria-label":"No","data-testid":"dislike",onClick:function(){i(),s(!0)}},t.createElement("svg",{className:Gn,viewBox:"0 0 40 40"},t.createElement("path",{fill:"#FFF",d:"M33.78 22.437l-4.228 13.98L27.93 37.5 5.062 34.14V15.503l7.8-1.517L24.354 2.5h1.624L28.9 5.426l-4.548 8.67h.107l10.477 1.31"}))))),t.createElement("div",{className:Kn,"aria-live":"polite",hidden:!o,"data-testid":"feedback"},"Thank you for your feedback."))};function te(){var n=m(["\n background: ",";\n ",";\n"]);return te=function(){return n},n}function re(){var n=m(["\n ::before {\n ","\n }\n margin-left: -16px;\n background: ",";\n ",";\n"]);return re=function(){return n},n}function ae(){var n=m(["\n content: '';\n width: ","px;\n height: ","px;\n border-radius: 100%;\n float: left;\n position: relative;\n left: -24px;\n background-color: #121212;\n"]);return ae=function(){return n},n}function ie(){var n=m(["\n ",";\n"]);return ie=function(){return n},n}function le(){var n=m(["\n :not(:last-child) {\n border-left: 0.0625rem solid ",";\n padding-bottom: ",";\n }\n padding-left: ","px;\n margin-left: ","px;\n"]);return le=function(){return n},n}var oe=r.css(le(),i.neutral[60],i.remSpace[4],i.space[4],i.space[2]),se=r.css(ie(),a.body.medium({lineHeight:"tight",fontWeight:"bold"})),ce=r.css(ae(),i.space[4],i.space[4]),me=r.css(re(),ce,i.brandAlt[400],a.body.medium({lineHeight:"tight",fontWeight:"bold"})),de=r.css(te(),i.brandAlt[400],a.body.medium({lineHeight:"tight",fontWeight:"bold"})),ue=function(n){var e=n.pillar;return t.createElement("div",null,n.events.map(function(n,r){var a=new Date(Date.parse(n.date)).toISOString(),i=n.toDate?new Date(Date.parse(n.toDate)).toISOString():"";return t.createElement("div",{key:r,"data-type":"event-snippet",className:oe},t.createElement("div",null,t.createElement("time",{dateTime:a,className:me},n.date),n.toDate&&t.createElement("span",null," ","-"," ",t.createElement("time",{dateTime:i,className:de},n.toDate))),n.title&&t.createElement("div",{className:se},n.title),n.body&&t.createElement(hn,{html:n.body,pillar:e}))}))};exports.AudioAtom=function(n){return t.createElement("div",{"data-atom-id":n.id},"AudioAtom")},exports.ChartAtom=function(n){return t.createElement("div",{"data-atom-id":n.id},"ChartAtom")},exports.ExplainerAtom=function(n){var e=n.html;return t.createElement(f,{id:n.id},t.createElement(g,{title:n.title}),t.createElement(h,{html:e}))},exports.GuideAtom=function(n){var e=n.pillar,r=n.likeHandler,a=n.dislikeHandler;return t.createElement(K,{id:n.id,title:n.title,pillar:e,expandForStorybook:n.expandForStorybook,expandCallback:n.expandCallback},t.createElement(R,{html:n.html,image:n.image,credit:n.credit,pillar:e}),t.createElement(H,{pillar:e,dislikeHandler:a,likeHandler:r}))},exports.InteractiveAtom=function(n){return t.createElement("figure",{className:nn,"data-atom-id":n.id,"data-atom-type":"interactive"},t.createElement("iframe",{className:en,srcDoc:X({js:n.js,css:n.css,html:n.html}),frameBorder:"0"}))},exports.MediaAtom=function(n){return t.createElement("div",{"data-atom-id":n.id},"MediaAtom")},exports.ProfileAtom=function(n){var e=n.pillar,r=n.likeHandler,a=n.dislikeHandler;return t.createElement(on,{id:n.id,title:n.title,pillar:e,atomType:"profile",atomTypeTitle:"Profile",expandForStorybook:n.expandForStorybook,expandCallback:n.expandCallback},t.createElement(hn,{html:n.html,image:n.image,credit:n.credit,pillar:e}),t.createElement(H,{pillar:e,dislikeHandler:a,likeHandler:r}))},exports.QandaAtom=function(n){var e=n.likeHandler,r=n.dislikeHandler;return t.createElement(Xn,{id:n.id,title:n.title,expandHandler:n.expandHandler},t.createElement($n,{html:n.html,image:n.image,credit:n.credit}),t.createElement(ee,{likeHandler:e,dislikeHandler:r}))},exports.QuizAtom=function(n){return t.createElement("div",{"data-atom-id":n.id},"QuizAtom")},exports.TimelineAtom=function(n){var e=n.events,r=n.description,a=n.pillar,i=n.likeHandler,l=n.dislikeHandler;return t.createElement(on,{atomType:"timeline",atomTypeTitle:"Timeline",id:n.id,pillar:a,expandForStorybook:n.expandForStorybook,title:n.title,expandCallback:n.expandCallback},r&&t.createElement(hn,{html:r,pillar:a}),e&&t.createElement(ue,{events:e,pillar:a}),t.createElement(H,{pillar:a,dislikeHandler:l,likeHandler:i}))};
var e,n=require("react"),t=(e=n)&&"object"==typeof e&&"default"in e?e.default:e,r=require("emotion"),a=require("@guardian/src-foundations/typography"),i=require("@guardian/src-foundations"),l=require("@guardian/src-foundations/palette"),o=require("@guardian/src-foundations/palette/"),c=require("@guardian/src-icons"),s=require("react-dom/server");function d(e,n){return n||(n=e.slice(0)),e.raw=n,e}function m(){var e=d(["\n ","\n "]);return m=function(){return e},e}function u(){var e=d(["\n ","\n margin-top: ","px;\n "]);return u=function(){return e},e}function p(){var e=d(["\n padding-bottom: ","px;\n padding-left: ","px;\n padding-right: ","px;\n border-top: 1px solid ",";\n color: ",";\n background: ",";\n\n p {\n margin-top: ","px;\n margin-bottom: ","px;\n }\n "]);return p=function(){return e},e}var f=function(e){var n=e.children;return t.createElement("figure",{"data-atom-id":e.id,"data-atom-type":"explainer",className:r.css(p(),i.space[1],i.space[2],i.space[2],l.text.primary,l.text.primary,l.neutral[97],i.space[3],i.space[3])},n)},g=function(e){var n=e.title;return t.createElement("h3",{className:r.css(u(),a.headline.xxsmall({fontWeight:"bold"}),i.space[2])},n)},h=function(e){var n=e.html;return t.createElement("div",{className:r.css(m(),a.textSans.small({fontWeight:"light",lineHeight:"tight"})),dangerouslySetInnerHTML:{__html:n}})};function x(e,n){switch(e){case"opinion":return o.opinion[n];case"sport":return o.sport[n];case"culture":return o.culture[n];case"lifestyle":return o.lifestyle[n];case"news":return o.news[n];default:return o.news[400]}}function b(){var e=d(["\n ",";\n height: 28px;\n "]);return b=function(){return e},e}function v(){var e=d(["\n transform: rotate(180deg);\n -webkit-transform: rotate(180deg);\n -moz-transform: rotate(180deg);\n -o-transform: rotate(180deg);\n "]);return v=function(){return e},e}function E(){var e=d(["\n display: flex;\n align-items: center;\n ",";\n "]);return E=function(){return e},e}function y(){var e=d(["\n display: inline-flex;\n cursor: pointer;\n align-items: center;\n justify-content: center;\n background: black;\n color: white;\n border-style: hidden;\n border-radius: 100%;\n margin: 0 0 0 5px;\n padding: 0;\n width: 28px;\n height: 28px;\n :hover {\n background: ",";\n }\n :focus {\n border: none;\n }\n "]);return y=function(){return e},e}function k(){var e=d(["\n width: 16px;\n height: 16px;\n "]);return k=function(){return e},e}function w(){var e=d(["\n font-size: 13px;\n line-height: 16px;\n display: flex;\n justify-content: flex-end;\n"]);return w=function(){return e},e}var H=r.css(w()),S=function(){return t.createElement("svg",{className:r.css(k()),viewBox:"0 0 40 40"},t.createElement("path",{fill:"#FFF",d:"M33.78 22.437l-4.228 13.98L27.93 37.5 5.062 34.14V15.503l7.8-1.517L24.354 2.5h1.624L28.9 5.426l-4.548 8.67h.107l10.477 1.31"}))},N=function(e){var i=e.pillar,l=e.likeHandler,o=e.dislikeHandler,c=r.css(y(),x(i,400)),s=n.useState(!1),d=s[0],m=s[1];return t.createElement("footer",{className:H},t.createElement("div",{hidden:d},t.createElement("div",{className:r.css(E(),a.textSans.xsmall())},t.createElement("div",null,"Was this helpful?"),t.createElement("button",{"data-testid":"like",className:c,onClick:function(){l(),m(!0)}},t.createElement(S,null)),t.createElement("button",{className:r.cx(c,r.css(v())),"data-testid":"dislike",onClick:function(){o(),m(!0)}},t.createElement(S,null)))),t.createElement("div",{className:r.css(b(),a.textSans.xsmall()),"data-testid":"feedback",hidden:!d},"Thank you for your feedback."))};function T(){var e=d(["\n background: ",";\n color: ",";\n height: 2rem;\n position: absolute;\n bottom: 0;\n transform: translate(0, 50%);\n padding: 0 15px 0 7px;\n border-radius: 100em;\n cursor: pointer;\n display: inline-flex;\n align-items: center;\n border: 0;\n margin: 0;\n :hover {\n background: ",";\n }\n "]);return T=function(){return e},e}function A(){var e=d(["\n display: block;\n ",";\n color: ",";\n "]);return A=function(){return e},e}function C(){var e=d(["\n display: inline-flex;\n align-items: center;\n ",";\n"]);return C=function(){return e},e}function _(){var e=d(["\n margin-right: 14px;\n margin-bottom: 6px;\n width: 30px;\n fill: white;\n height: 25px;\n padding-left: 4px;\n"]);return _=function(){return e},e}function L(){var e=d(["\n margin-right: 12px;\n margin-bottom: 6px;\n width: 33px;\n fill: white;\n height: 28px;\n"]);return L=function(){return e},e}function M(){var e=d(["\n ",";\n margin: 0;\n line-height: 22px;\n"]);return M=function(){return e},e}var W=r.css(M(),a.headline.xxxsmall({fontWeight:"medium"})),I=r.css(L()),z=r.css(_()),F=r.css(C(),a.textSans.small()),q=function(e){var i=e.sectionTitle,l=e.title,s=e.pillar,d=e.expandCallback,m=r.css(A(),a.body.medium({lineHeight:"tight",fontWeight:"bold"}),x(s,400)),u=r.css(T(),o.neutral[7],o.neutral[100],x(s,400)),p=n.useState(!1),f=p[0],g=p[1],h=n.useState(!1),b=h[0],v=h[1];return t.createElement("summary",{onClick:function(){b||(d(),v(!0)),g(!f)}},t.createElement("span",{className:m},i),t.createElement("h4",{className:W},l),t.createElement("span",{className:u},f?t.createElement("span",{className:F},t.createElement("span",{className:z},t.createElement(c.SvgMinus,null)),"Hide"):t.createElement("span",{className:F},t.createElement("span",{className:I},t.createElement(c.SvgPlus,null)),"Show")))};function D(){var e=d(["\n margin: 16px 0 36px;\n background: ",";\n padding: 0 5px 6px;\n border-image: repeating-linear-gradient(\n to bottom,\n ",",\n "," 1px,\n transparent 1px,\n transparent 4px\n )\n 13;\n border-top: 13px solid black;\n position: relative;\n summary {\n list-style: none;\n margin: 0 0 16px;\n }\n\n /* https://developer.mozilla.org/en-US/docs/Web/HTML/Element/details#Customizing_the_disclosure_widget */\n summary::-webkit-details-marker {\n display: none;\n }\n\n summary:focus {\n outline: none;\n }\n"]);return D=function(){return e},e}function j(){var e=d(["\n display: block;\n position: relative;\n margin-bottom: 0.75rem;\n margin-top: 1rem;\n"]);return j=function(){return e},e}var Q=r.css(j()),O=r.css(D(),l.neutral[93],l.neutral[86],l.neutral[86]),P=function(e){var n=e.id,r=e.children,a=e.atomType;return t.createElement("div",{className:Q,"data-atom-id":n,"data-atom-type":a},t.createElement("details",{className:O,"data-atom-id":n,"data-snippet-type":a,open:e.expandForStorybook},t.createElement(q,{sectionTitle:e.atomTypeTitle,pillar:e.pillar,title:e.title,expandCallback:e.expandCallback}),r))};function B(){var e=d(["\n a {\n color: ",";\n text-decoration: none;\n border-bottom: 0.0625rem solid ",";\n transition: border-color 0.15s ease-out;\n }\n\n a:hover {\n border-bottom: solid 0.0625rem ",";\n }\n"]);return B=function(){return e},e}function G(){var e=d(["\n ","\n p {\n margin-bottom: 0.5rem;\n }\n\n ol {\n list-style: decimal;\n list-style-position: inside;\n margin-bottom: 1rem;\n }\n\n ul {\n list-style: none;\n margin: 0 0 0.75rem;\n padding: 0;\n margin-bottom: 1rem;\n }\n\n ul li {\n margin-bottom: 0.375rem;\n padding-left: 1.25rem;\n }\n\n ul li:before {\n display: inline-block;\n content: '';\n border-radius: 0.375rem;\n height: 0.75rem;\n width: 0.75rem;\n margin-right: 0.5rem;\n background-color: ",";\n margin-left: -1.25rem;\n }\n\n /* Without this bold elements are overridden */\n b {\n font-weight: 700;\n }\n\n i {\n font-style: italic;\n }\n"]);return G=function(){return e},e}function U(){var e=d(["\n ",";\n margin: 12px 0;\n display: flex;\n align-items: center;\n svg {\n width: 30px;\n fill: ",";\n }\n"]);return U=function(){return e},e}function V(){var e=d(["\n .forceHeightAndWidth & {\n width: 100px;\n height: 100px;\n }\n float: left;\n margin-right: 16px;\n margin-bottom: 6px;\n object-fit: cover;\n border-radius: 50%;\n display: block;\n border: 0px;\n"]);return V=function(){return e},e}var J=r.css(V()),K=r.css(U(),a.textSans.xsmall(),l.neutral[60]),R=r.css(G(),a.body.medium(),l.neutral[86]),X=function(e){return r.css(B(),x(e,300),l.neutral[86],x(e,400))},Y=function(e){var n=e.html,a=e.image,i=e.credit,l=e.pillar;return t.createElement("div",null,a&&t.createElement("span",{className:"forceHeightAndWidth"},t.createElement("img",{className:J,src:a,alt:""})),t.createElement("div",{className:r.cx(R,X(l)),dangerouslySetInnerHTML:{__html:n}}),i&&t.createElement("div",{className:K},t.createElement(c.SvgInfo,null),i))},Z=function(e){var n=e.css,r=e.js,a=e.html;return s.renderToString(t.createElement("html",null,t.createElement("head",null,t.createElement("meta",{charSet:"utf-8"}),t.createElement("meta",{name:"viewport",content:"width=device-width,minimum-scale=1,initial-scale=1"}),n&&t.createElement("style",{dangerouslySetInnerHTML:{__html:n}})),t.createElement("body",null,a&&t.createElement("div",{dangerouslySetInnerHTML:{__html:a}})),t.createElement("script",{dangerouslySetInnerHTML:{__html:r}}),t.createElement("script",{dangerouslySetInnerHTML:{__html:"\n function resize() {\n window.frameElement.height = document.body.offsetHeight;\n }\n window.addEventListener('resize', resize);\n resize();\n "}}),t.createElement("script",{dangerouslySetInnerHTML:{__html:"\n var fonts = [].slice.apply(window.parent.document.styleSheets)\n .filter(function (sheet) { return sheet.ownerNode.className.indexOf(\"webfont\") > - 1; })\n .map(function (sheet) { return sheet.ownerNode.textContent; })\n .join(' ');\n var css = document.createElement('style');\n css.textContent = fonts;\n document.head.appendChild(css);\n "}})))};function $(){var e=d(["\n width: 100%;\n"]);return $=function(){return e},e}function ee(){var e=d(["\n margin: 0;\n"]);return ee=function(){return e},e}var ne=r.css(ee()),te=r.css($());function re(){var e=d(["\n background: ",";\n ",";\n"]);return re=function(){return e},e}function ae(){var e=d(["\n ::before {\n ","\n }\n margin-left: -16px;\n background: ",";\n ",";\n"]);return ae=function(){return e},e}function ie(){var e=d(["\n content: '';\n width: ","px;\n height: ","px;\n border-radius: 100%;\n float: left;\n position: relative;\n left: -24px;\n background-color: #121212;\n"]);return ie=function(){return e},e}function le(){var e=d(["\n ",";\n"]);return le=function(){return e},e}function oe(){var e=d(["\n :not(:last-child) {\n border-left: 0.0625rem solid ",";\n padding-bottom: ",";\n }\n padding-left: ","px;\n margin-left: ","px;\n"]);return oe=function(){return e},e}var ce=r.css(oe(),i.neutral[60],i.remSpace[4],i.space[4],i.space[2]),se=r.css(le(),a.body.medium({lineHeight:"tight",fontWeight:"bold"})),de=r.css(ie(),i.space[4],i.space[4]),me=r.css(ae(),de,i.brandAlt[400],a.body.medium({lineHeight:"tight",fontWeight:"bold"})),ue=r.css(re(),i.brandAlt[400],a.body.medium({lineHeight:"tight",fontWeight:"bold"})),pe=function(e){var n=e.pillar;return t.createElement("div",null,e.events.map(function(e,r){var a=new Date(Date.parse(e.date)).toISOString(),i=e.toDate?new Date(Date.parse(e.toDate)).toISOString():"";return t.createElement("div",{key:r,"data-type":"event-snippet",className:ce},t.createElement("div",null,t.createElement("time",{dateTime:a,className:me},e.date),e.toDate&&t.createElement("span",null," ","-"," ",t.createElement("time",{dateTime:i,className:ue},e.toDate))),e.title&&t.createElement("div",{className:se},e.title),e.body&&t.createElement(Y,{html:e.body,pillar:n}))}))};exports.AudioAtom=function(e){return t.createElement("div",{"data-atom-id":e.id},"AudioAtom")},exports.ChartAtom=function(e){return t.createElement("div",{"data-atom-id":e.id},"ChartAtom")},exports.ExplainerAtom=function(e){var n=e.html;return t.createElement(f,{id:e.id},t.createElement(g,{title:e.title}),t.createElement(h,{html:n}))},exports.GuideAtom=function(e){var n=e.pillar,r=e.likeHandler,a=e.dislikeHandler;return t.createElement(P,{id:e.id,title:e.title,pillar:n,atomType:"guide",atomTypeTitle:"Quick Guide",expandForStorybook:e.expandForStorybook,expandCallback:e.expandCallback},t.createElement(Y,{html:e.html,image:e.image,credit:e.credit,pillar:n}),t.createElement(N,{pillar:n,dislikeHandler:a,likeHandler:r}))},exports.InteractiveAtom=function(e){return t.createElement("figure",{className:ne,"data-atom-id":e.id,"data-atom-type":"interactive"},t.createElement("iframe",{className:te,srcDoc:Z({js:e.js,css:e.css,html:e.html}),frameBorder:"0"}))},exports.MediaAtom=function(e){return t.createElement("div",{"data-atom-id":e.id},"MediaAtom")},exports.ProfileAtom=function(e){var n=e.pillar,r=e.likeHandler,a=e.dislikeHandler;return t.createElement(P,{id:e.id,title:e.title,pillar:n,atomType:"profile",atomTypeTitle:"Profile",expandForStorybook:e.expandForStorybook,expandCallback:e.expandCallback},t.createElement(Y,{html:e.html,image:e.image,credit:e.credit,pillar:n}),t.createElement(N,{pillar:n,dislikeHandler:a,likeHandler:r}))},exports.QandaAtom=function(e){var n=e.pillar,r=e.likeHandler,a=e.dislikeHandler;return t.createElement(P,{id:e.id,title:e.title,atomType:"qanda",atomTypeTitle:"Q&A",pillar:n,expandCallback:e.expandCallback},t.createElement(Y,{html:e.html,image:e.image,credit:e.credit,pillar:n}),t.createElement(N,{pillar:n,likeHandler:r,dislikeHandler:a}))},exports.QuizAtom=function(e){return t.createElement("div",{"data-atom-id":e.id},"QuizAtom")},exports.TimelineAtom=function(e){var n=e.events,r=e.description,a=e.pillar,i=e.likeHandler,l=e.dislikeHandler;return t.createElement(P,{atomType:"timeline",atomTypeTitle:"Timeline",id:e.id,pillar:a,expandForStorybook:e.expandForStorybook,title:e.title,expandCallback:e.expandCallback},r&&t.createElement(Y,{html:r,pillar:a}),n&&t.createElement(pe,{events:n,pillar:a}),t.createElement(N,{pillar:a,dislikeHandler:l,likeHandler:i}))};
//# sourceMappingURL=index.js.map

@@ -1,2 +0,2 @@

import e,{useState as t}from"react";import{css as a,cx as l}from"emotion";import{headline as i,textSans as r,body as n}from"@guardian/src-foundations/typography";import{space as o,neutral as m,remSpace as d,brandAlt as s}from"@guardian/src-foundations";import{text as c,neutral as p,news as g}from"@guardian/src-foundations/palette";import{SvgPlus as h,SvgMinus as b,SvgInfo as u}from"@guardian/src-icons";import{news as x,lifestyle as f,culture as E,sport as y,opinion as k,neutral as v}from"@guardian/src-foundations/palette/";import{renderToString as $}from"react-dom/server";let N,w,H,T=e=>e;const S=({id:t,children:l})=>e.createElement("figure",{"data-atom-id":t,"data-atom-type":"explainer",className:a(N||(N=T`
import e,{useState as t}from"react";import{css as a,cx as l}from"emotion";import{headline as i,textSans as r,body as n}from"@guardian/src-foundations/typography";import{space as o,neutral as m,remSpace as d,brandAlt as s}from"@guardian/src-foundations";import{text as c,neutral as p}from"@guardian/src-foundations/palette";import{news as g,lifestyle as h,culture as u,sport as x,opinion as b,neutral as f}from"@guardian/src-foundations/palette/";import{SvgPlus as E,SvgMinus as y,SvgInfo as k}from"@guardian/src-icons";import{renderToString as $}from"react-dom/server";let v,H,w,N=e=>e;const T=({id:t,children:l})=>e.createElement("figure",{"data-atom-id":t,"data-atom-type":"explainer",className:a(v||(v=N`
padding-bottom: ${0}px;

@@ -13,8 +13,8 @@ padding-left: ${0}px;

}
`),o[1],o[2],o[2],c.primary,c.primary,p[97],o[3],o[3])},l),_=({title:t})=>e.createElement("h3",{className:a(w||(w=T`
`),o[1],o[2],o[2],c.primary,c.primary,p[97],o[3],o[3])},l),S=({title:t})=>e.createElement("h3",{className:a(H||(H=N`
${0}
margin-top: ${0}px;
`),i.xxsmall({fontWeight:"bold"}),o[2])},t),C=({html:t})=>e.createElement("div",{className:a(H||(H=T`
`),i.xxsmall({fontWeight:"bold"}),o[2])},t),C=({html:t})=>e.createElement("div",{className:a(w||(w=N`
${0}
`),r.small({fontWeight:"light",lineHeight:"tight"})),dangerouslySetInnerHTML:{__html:t}}),L=({id:t,title:a,html:l})=>e.createElement(S,{id:t},e.createElement(_,{title:a}),e.createElement(C,{html:l})),W=({id:t})=>e.createElement("div",{"data-atom-id":t},"AudioAtom"),F=({id:t})=>e.createElement("div",{"data-atom-id":t},"ChartAtom");function M(e,t){switch(e){case"opinion":return k[t];case"sport":return y[t];case"culture":return E[t];case"lifestyle":return f[t];case"news":return x[t];default:return x[400]}}let z,A,j,I,D,B,O=e=>e;const Q=a(z||(z=O`
`),r.small({fontWeight:"light",lineHeight:"tight"})),dangerouslySetInnerHTML:{__html:t}}),_=({id:t,title:a,html:l})=>e.createElement(T,{id:t},e.createElement(S,{title:a}),e.createElement(C,{html:l})),L=({id:t})=>e.createElement("div",{"data-atom-id":t},"AudioAtom"),W=({id:t})=>e.createElement("div",{"data-atom-id":t},"ChartAtom");function F(e,t){switch(e){case"opinion":return b[t];case"sport":return x[t];case"culture":return u[t];case"lifestyle":return h[t];case"news":return g[t];default:return g[400]}}let M,z,D,I,A,j,O=e=>e;const Q=a(M||(M=O`
font-size: 13px;

@@ -24,6 +24,6 @@ line-height: 16px;

justify-content: flex-end;
`)),V=()=>e.createElement("svg",{className:a(A||(A=O`
`)),B=()=>e.createElement("svg",{className:a(z||(z=O`
width: 16px;
height: 16px;
`)),viewBox:"0 0 40 40"},e.createElement("path",{fill:"#FFF",d:"M33.78 22.437l-4.228 13.98L27.93 37.5 5.062 34.14V15.503l7.8-1.517L24.354 2.5h1.624L28.9 5.426l-4.548 8.67h.107l10.477 1.31"})),q=({pillar:i,likeHandler:n,dislikeHandler:o})=>{const m=a(j||(j=O`
`)),viewBox:"0 0 40 40"},e.createElement("path",{fill:"#FFF",d:"M33.78 22.437l-4.228 13.98L27.93 37.5 5.062 34.14V15.503l7.8-1.517L24.354 2.5h1.624L28.9 5.426l-4.548 8.67h.107l10.477 1.31"})),q=({pillar:i,likeHandler:n,dislikeHandler:o})=>{const m=a(D||(D=O`
display: inline-flex;

@@ -47,7 +47,7 @@ cursor: pointer;

}
`),M(i,400)),[d,s]=t(!1);return e.createElement("footer",{className:Q},e.createElement("div",{hidden:d},e.createElement("div",{className:a(I||(I=O`
`),F(i,400)),[d,s]=t(!1);return e.createElement("footer",{className:Q},e.createElement("div",{hidden:d},e.createElement("div",{className:a(I||(I=O`
display: flex;
align-items: center;
${0};
`),r.xsmall())},e.createElement("div",null,"Was this helpful?"),e.createElement("button",{"data-testid":"like",className:m,onClick:()=>{n(),s(!0)}},e.createElement(V,null)),e.createElement("button",{className:l(m,a(D||(D=O`
`),r.xsmall())},e.createElement("div",null,"Was this helpful?"),e.createElement("button",{"data-testid":"like",className:m,onClick:()=>{n(),s(!0)}},e.createElement(B,null)),e.createElement("button",{className:l(m,a(A||(A=O`
transform: rotate(180deg);

@@ -57,10 +57,10 @@ -webkit-transform: rotate(180deg);

-o-transform: rotate(180deg);
`))),"data-testid":"dislike",onClick:()=>{o(),s(!0)}},e.createElement(V,null)))),e.createElement("div",{className:a(B||(B=O`
`))),"data-testid":"dislike",onClick:()=>{o(),s(!0)}},e.createElement(B,null)))),e.createElement("div",{className:a(j||(j=O`
${0};
height: 28px;
`),r.xsmall()),"data-testid":"feedback",hidden:!d},"Thank you for your feedback."))};let U,G,P,Y,J,K,R=e=>e;const X=a(U||(U=R`
`),r.xsmall()),"data-testid":"feedback",hidden:!d},"Thank you for your feedback."))};let G,P,U,V,J,K,R=e=>e;const X=a(G||(G=R`
${0};
margin: 0;
line-height: 22px;
`),i.xxxsmall({fontWeight:"medium"})),Z=a(G||(G=R`
`),i.xxxsmall({fontWeight:"medium"})),Y=a(P||(P=R`
margin-right: 12px;

@@ -71,3 +71,3 @@ margin-bottom: 6px;

height: 28px;
`)),ee=a(P||(P=R`
`)),Z=a(U||(U=R`
margin-right: 14px;

@@ -79,11 +79,11 @@ margin-bottom: 6px;

padding-left: 4px;
`)),te=a(Y||(Y=R`
`)),ee=a(V||(V=R`
display: inline-flex;
align-items: center;
${0};
`),r.small()),ae=({sectionTitle:l,title:i,pillar:r,expandCallback:o})=>{const m=a(J||(J=R`
`),r.small()),te=({sectionTitle:l,title:i,pillar:r,expandCallback:o})=>{const m=a(J||(J=R`
display: block;
${0};
color: ${0};
`),n.medium({lineHeight:"tight",fontWeight:"bold"}),M(r,400)),d=a(K||(K=R`
`),n.medium({lineHeight:"tight",fontWeight:"bold"}),F(r,400)),d=a(K||(K=R`
background: ${0};

@@ -105,3 +105,3 @@ color: ${0};

}
`),v[7],v[100],M(r,400)),[s,c]=t(!1),[p,g]=t(!1);return e.createElement("summary",{onClick:()=>{p||(o(),g(!0)),c(!s)}},e.createElement("span",{className:m},l),e.createElement("h4",{className:X},i),e.createElement("span",{className:d},s?e.createElement("span",{className:te},e.createElement("span",{className:ee},e.createElement(b,null)),"Hide"):e.createElement("span",{className:te},e.createElement("span",{className:Z},e.createElement(h,null)),"Show")))};let le,ie,re,ne,oe,me,de=e=>e;const se=a(le||(le=de`
`),f[7],f[100],F(r,400)),[s,c]=t(!1),[p,g]=t(!1);return e.createElement("summary",{onClick:()=>{p||(o(),g(!0)),c(!s)}},e.createElement("span",{className:m},l),e.createElement("h4",{className:X},i),e.createElement("span",{className:d},s?e.createElement("span",{className:ee},e.createElement("span",{className:Z},e.createElement(y,null)),"Hide"):e.createElement("span",{className:ee},e.createElement("span",{className:Y},e.createElement(E,null)),"Show")))};let ae,le,ie=e=>e;const re=a(ae||(ae=ie`
display: block;

@@ -111,3 +111,3 @@ position: relative;

margin-top: 1rem;
`)),ce=a(ie||(ie=de`
`)),ne=a(le||(le=ie`
margin: 16px 0 36px;

@@ -139,42 +139,3 @@ background: ${0};

}
`),p[93],p[86],p[86]),pe=a(re||(re=de`
${0}
p {
margin-bottom: 0.5rem;
}
ol {
list-style: decimal;
list-style-position: inside;
margin-bottom: 1rem;
}
ul {
list-style: none;
margin: 0 0 0.75rem;
padding: 0;
margin-bottom: 1rem;
}
ul li {
margin-bottom: 0.375rem;
padding-left: 1.25rem;
}
ul li:before {
display: inline-block;
content: '';
border-radius: 0.375rem;
height: 0.75rem;
width: 0.75rem;
margin-right: 0.5rem;
background-color: ${0};
margin-left: -1.25rem;
}
/* Without this bold elements are overridden */
b {
font-weight: 700;
}
`),n.medium(),p[86]),ge=a(ne||(ne=de`
`),p[93],p[86],p[86]),oe=({id:t,title:a,children:l,pillar:i,expandForStorybook:r,atomType:n,atomTypeTitle:o,expandCallback:m})=>e.createElement("div",{className:re,"data-atom-id":t,"data-atom-type":n},e.createElement("details",{className:ne,"data-atom-id":t,"data-snippet-type":n,open:r},e.createElement(te,{sectionTitle:o,pillar:i,title:a,expandCallback:m}),l));let me,de,se,ce,pe=e=>e;const ge=a(me||(me=pe`
.forceHeightAndWidth & {

@@ -191,3 +152,3 @@ width: 100px;

border: 0px;
`)),he=a(oe||(oe=de`
`)),he=a(de||(de=pe`
${0};

@@ -201,71 +162,3 @@ margin: 12px 0;

}
`),r.xsmall(),p[60]),be=({id:t,title:a,children:l,pillar:i,expandForStorybook:r,expandCallback:n})=>e.createElement("div",{className:se,"data-atom-id":t,"data-atom-type":"guide"},e.createElement("details",{className:ce,"data-atom-id":t,"data-snippet-type":"guide",open:r},e.createElement(ae,{sectionTitle:"Quick Guide",pillar:i,title:a,expandCallback:n}),l)),ue=({html:t,image:i,credit:r,pillar:n})=>{const o=a(me||(me=de`
a {
color: ${0};
text-decoration: none;
border-bottom: 0.0625rem solid ${0};
transition: border-color 0.15s ease-out;
}
a:hover {
border-bottom: solid 0.0625rem ${0};
}
`),M(n,300),p[86],M(n,400));return e.createElement("div",null,i&&e.createElement("span",{className:"forceHeightAndWidth"},e.createElement("img",{className:ge,src:i,alt:""})),e.createElement("div",{className:l(pe,o),dangerouslySetInnerHTML:{__html:t}}),r&&e.createElement("div",{className:he},e.createElement(u,null),r))},xe=({id:t,title:a,image:l,html:i,credit:r,pillar:n,expandForStorybook:o,likeHandler:m,dislikeHandler:d,expandCallback:s})=>e.createElement(be,{id:t,title:a,pillar:n,expandForStorybook:o,expandCallback:s},e.createElement(ue,{html:i,image:l,credit:r,pillar:n}),e.createElement(q,{pillar:n,dislikeHandler:d,likeHandler:m})),fe=({css:t,js:a,html:l})=>$(e.createElement("html",null,e.createElement("head",null,e.createElement("meta",{charSet:"utf-8"}),e.createElement("meta",{name:"viewport",content:"width=device-width,minimum-scale=1,initial-scale=1"}),t&&e.createElement("style",{dangerouslySetInnerHTML:{__html:t}})),e.createElement("body",null,l&&e.createElement("div",{dangerouslySetInnerHTML:{__html:l}})),e.createElement("script",{dangerouslySetInnerHTML:{__html:a}}),e.createElement("script",{dangerouslySetInnerHTML:{__html:"\n function resize() {\n window.frameElement.height = document.body.offsetHeight;\n }\n window.addEventListener('resize', resize);\n resize();\n "}}),e.createElement("script",{dangerouslySetInnerHTML:{__html:"\n var fonts = [].slice.apply(window.parent.document.styleSheets)\n .filter(function (sheet) { return sheet.ownerNode.className.indexOf(\"webfont\") > - 1; })\n .map(function (sheet) { return sheet.ownerNode.textContent; })\n .join(' ');\n var css = document.createElement('style');\n css.textContent = fonts;\n document.head.appendChild(css);\n "}})));let Ee,ye,ke=e=>e;const ve=a(Ee||(Ee=ke`
margin: 0;
`)),$e=a(ye||(ye=ke`
width: 100%;
`)),Ne=({id:t,html:a,js:l,css:i})=>e.createElement("figure",{className:ve,"data-atom-id":t,"data-atom-type":"interactive"},e.createElement("iframe",{className:$e,srcDoc:fe({js:l,css:i,html:a}),frameBorder:"0"})),we=({id:t})=>e.createElement("div",{"data-atom-id":t},"MediaAtom");let He,Te,Se=e=>e;const _e=a(He||(He=Se`
display: block;
position: relative;
margin-bottom: 0.75rem;
margin-top: 1rem;
`)),Ce=a(Te||(Te=Se`
margin: 16px 0 36px;
background: ${0};
padding: 0 5px 6px;
border-image: repeating-linear-gradient(
to bottom,
${0},
${0} 1px,
transparent 1px,
transparent 4px
)
13;
border-top: 13px solid black;
position: relative;
summary {
list-style: none;
margin: 0 0 16px;
}
/* https://developer.mozilla.org/en-US/docs/Web/HTML/Element/details#Customizing_the_disclosure_widget */
summary::-webkit-details-marker {
display: none;
}
summary:focus {
outline: none;
}
`),p[93],p[86],p[86]),Le=({id:t,title:a,children:l,pillar:i,expandForStorybook:r,atomType:n,atomTypeTitle:o,expandCallback:m})=>e.createElement("div",{className:_e,"data-atom-id":t,"data-atom-type":n},e.createElement("details",{className:Ce,"data-atom-id":t,"data-snippet-type":n,open:r},e.createElement(ae,{sectionTitle:o,pillar:i,title:a,expandCallback:m}),l));let We,Fe,Me,ze,Ae=e=>e;const je=a(We||(We=Ae`
.forceHeightAndWidth & {
width: 100px;
height: 100px;
}
float: left;
margin-right: 16px;
margin-bottom: 6px;
object-fit: cover;
border-radius: 50%;
display: block;
border: 0px;
`)),Ie=a(Fe||(Fe=Ae`
${0};
margin: 12px 0;
display: flex;
align-items: center;
svg {
width: 30px;
fill: ${0};
}
`),r.xsmall(),p[60]),De=a(Me||(Me=Ae`
`),r.xsmall(),p[60]),ue=a(se||(se=pe`
${0}

@@ -313,3 +206,3 @@ p {

}
`),n.medium(),p[86]),Be=e=>a(ze||(ze=Ae`
`),n.medium(),p[86]),xe=e=>a(ce||(ce=pe`
a {

@@ -325,189 +218,7 @@ color: ${0};

}
`),M(e,300),p[86],M(e,400)),Oe=({html:t,image:a,credit:i,pillar:r})=>e.createElement("div",null,a&&e.createElement("span",{className:"forceHeightAndWidth"},e.createElement("img",{className:je,src:a,alt:""})),e.createElement("div",{className:l(De,Be(r)),dangerouslySetInnerHTML:{__html:t}}),i&&e.createElement("div",{className:Ie},e.createElement(u,null),i)),Qe=({id:t,title:a,image:l,html:i,credit:r,pillar:n,expandForStorybook:o,likeHandler:m,dislikeHandler:d,expandCallback:s})=>e.createElement(Le,{id:t,title:a,pillar:n,atomType:"profile",atomTypeTitle:"Profile",expandForStorybook:o,expandCallback:s},e.createElement(Oe,{html:i,image:l,credit:r,pillar:n}),e.createElement(q,{pillar:n,dislikeHandler:d,likeHandler:m}));let Ve,qe,Ue,Ge,Pe,Ye,Je,Ke,Re,Xe,Ze,et,tt,at,lt,it,rt,nt,ot=e=>e;const mt=a(Ve||(Ve=ot`
display: block;
position: relative;
margin-bottom: 0.75rem;
margin-top: 1rem;
`)),dt=a(qe||(qe=ot`
margin: 16px 0 36px;
background: ${0};
padding: 0 5px 6px;
border-image: repeating-linear-gradient(
to bottom,
${0},
${0} 1px,
transparent 1px,
transparent 4px
)
13;
border-top: 13px solid black;
border-left: 0;
border-right: 0;
border-bottom: 0;
position: relative;
summary {
list-style: none;
margin: 0 0 16px;
}
summary::-webkit-details-marker {
display: none;
}
summary:focus {
outline: none;
}
`),p[93],p[86],p[86]),st=a(Ue||(Ue=ot`
${0}
p {
margin-bottom: 0.5rem;
}
ol {
list-style: decimal;
list-style-position: inside;
margin-bottom: 1rem;
}
ul {
list-style: none;
margin: 0 0 0.75rem;
padding: 0;
margin-bottom: 1rem;
}
ul li {
margin-bottom: 0.375rem;
padding-left: 1.25rem;
}
ul li:before {
display: inline-block;
content: '';
border-radius: 0.375rem;
height: 0.75rem;
width: 0.75rem;
margin-right: 0.5rem;
background-color: ${0};
margin-left: -1.25rem;
}
a {
color: ${0};
text-decoration: none;
border-bottom: 0.0625rem solid ${0};
transition: border-color 0.15s ease-out;
}
a:hover {
border-bottom: solid 0.0625rem ${0};
}
b {
font-weight: bold;
}
`),n.medium(),p[86],g[300],p[86],g[400]),ct=a(Ge||(Ge=ot``)),pt=a(Pe||(Pe=ot`
background: ${0};
color: ${0};
height: 2rem;
font-size: 13px;
position: absolute;
bottom: 0;
transform: translate(0, 50%);
padding: 0 15px 0 7px;
border-radius: 100em;
cursor: pointer;
display: inline-flex;
align-items: center;
border: 0;
`),F(e,300),p[86],F(e,400)),be=({html:t,image:a,credit:i,pillar:r})=>e.createElement("div",null,a&&e.createElement("span",{className:"forceHeightAndWidth"},e.createElement("img",{className:ge,src:a,alt:""})),e.createElement("div",{className:l(ue,xe(r)),dangerouslySetInnerHTML:{__html:t}}),i&&e.createElement("div",{className:he},e.createElement(k,null),i)),fe=({id:t,title:a,image:l,html:i,credit:r,pillar:n,expandForStorybook:o,likeHandler:m,dislikeHandler:d,expandCallback:s})=>e.createElement(oe,{id:t,title:a,pillar:n,atomType:"guide",atomTypeTitle:"Quick Guide",expandForStorybook:o,expandCallback:s},e.createElement(be,{html:i,image:l,credit:r,pillar:n}),e.createElement(q,{pillar:n,dislikeHandler:d,likeHandler:m})),Ee=({css:t,js:a,html:l})=>$(e.createElement("html",null,e.createElement("head",null,e.createElement("meta",{charSet:"utf-8"}),e.createElement("meta",{name:"viewport",content:"width=device-width,minimum-scale=1,initial-scale=1"}),t&&e.createElement("style",{dangerouslySetInnerHTML:{__html:t}})),e.createElement("body",null,l&&e.createElement("div",{dangerouslySetInnerHTML:{__html:l}})),e.createElement("script",{dangerouslySetInnerHTML:{__html:a}}),e.createElement("script",{dangerouslySetInnerHTML:{__html:"\n function resize() {\n window.frameElement.height = document.body.offsetHeight;\n }\n window.addEventListener('resize', resize);\n resize();\n "}}),e.createElement("script",{dangerouslySetInnerHTML:{__html:"\n var fonts = [].slice.apply(window.parent.document.styleSheets)\n .filter(function (sheet) { return sheet.ownerNode.className.indexOf(\"webfont\") > - 1; })\n .map(function (sheet) { return sheet.ownerNode.textContent; })\n .join(' ');\n var css = document.createElement('style');\n css.textContent = fonts;\n document.head.appendChild(css);\n "}})));let ye,ke,$e=e=>e;const ve=a(ye||(ye=$e`
margin: 0;
:hover {
background: ${0};
}
`),p[7],p[100],g[400]),gt=a(Ye||(Ye=ot`
display: inline-flex;
cursor: pointer;
align-items: center;
justify-content: center;
background: black;
color: white;
border-style: hidden;
border-radius: 100%;
margin: 0 0 0 5px;
padding: 0;
width: 28px;
height: 28px;
:hover {
background: ${0};
border-color: ${0};
}
:focus {
border: none;
}
`),g[400],g[400]),ht=a(Je||(Je=ot`
.forceHeightAndWidth & {
width: 100px;
height: 100px;
}
float: left;
margin-right: 16px;
margin-bottom: 6px;
object-fit: cover;
border-radius: 50%;
display: block;
border: 0px;
`)),bt=a(Ke||(Ke=ot`
margin-right: 12px;
margin-bottom: 6px;
width: 33px;
fill: white;
height: 28px;
`)),ut=a(Re||(Re=ot`
margin-right: 14px;
margin-bottom: 6px;
width: 30px;
fill: white;
height: 25px;
padding-left: 4px;
`)),xt=a(Xe||(Xe=ot`
display: inline-flex;
align-items: center;
${0};
`),r.small()),ft=a(Ze||(Ze=ot`
width: 16px;
height: 16px;
`)),Et=a(et||(et=ot`
transform: rotate(180deg);
-webkit-transform: rotate(180deg);
-moz-transform: rotate(180deg);
-o-transform: rotate(180deg);
`)),yt=a(tt||(tt=ot`
font-size: 13px;
line-height: 16px;
display: flex;
justify-content: flex-end;
`)),kt=a(at||(at=ot`
display: flex;
align-items: center;
${0};
`),r.xsmall()),vt=a(lt||(lt=ot`
${0};
height: 28px;
`),r.xsmall()),$t=a(it||(it=ot`
${0};
margin: 12px 0;
display: flex;
align-items: center;
svg {
width: 30px;
fill: #999999;
}
`),r.xsmall()),Nt=({id:t,title:a,children:l,expandHandler:i})=>e.createElement("div",{className:mt,"data-atom-id":t,"data-atom-type":"qanda"},e.createElement("details",{"data-snippet-id":t,"data-snippet-type":"qanda",className:dt},e.createElement(wt,{title:a,expandHandler:i}),l)),wt=({title:l,expandHandler:r})=>{const[o,m]=t(!1),[d,s]=t(!1);return e.createElement("summary",{onClick:()=>{d||(r(),s(!0)),m(!o)},className:ct},e.createElement("span",{className:a(rt||(rt=ot`
color: ${0};
display: block;
${0};
`),g[400],n.medium({lineHeight:"tight",fontWeight:"bold"}))},"Q&A"),e.createElement("h4",{className:a(nt||(nt=ot`
${0};
margin: 0;
line-height: 22px;
`),i.xxxsmall({fontWeight:"medium"}))},l),e.createElement("span",{className:pt},!o&&e.createElement("span",{className:xt},e.createElement("span",{className:bt},e.createElement(h,null)),"Show"),o&&e.createElement("span",{className:xt},e.createElement("span",{className:ut},e.createElement(b,null)),"Hide")))},Ht=({html:t,image:a,credit:l})=>e.createElement("div",null,a&&e.createElement("span",{className:"forceHeightAndWidth"},e.createElement("img",{className:ht,src:a,alt:""})),e.createElement("div",{className:st,dangerouslySetInnerHTML:{__html:t}}),l&&e.createElement(Tt,{credit:l})),Tt=({credit:t})=>e.createElement("div",{className:$t},e.createElement(u,null),t),St=({likeHandler:a,dislikeHandler:i})=>{const[r,n]=t(!1);return e.createElement("footer",{className:yt},e.createElement("div",{hidden:r},e.createElement("div",{className:kt},e.createElement("div",null,"Was this helpful?"),e.createElement("button",{className:gt,value:"like","aria-label":"Yes","data-testid":"like",onClick:()=>{a(),n(!0)}},e.createElement("svg",{className:ft,viewBox:"0 0 40 40"},e.createElement("path",{fill:"#FFF",d:"M33.78 22.437l-4.228 13.98L27.93 37.5 5.062 34.14V15.503l7.8-1.517L24.354 2.5h1.624L28.9 5.426l-4.548 8.67h.107l10.477 1.31"}))),e.createElement("button",{className:l(gt,Et),value:"dislike","aria-label":"No","data-testid":"dislike",onClick:()=>{i(),n(!0)}},e.createElement("svg",{className:ft,viewBox:"0 0 40 40"},e.createElement("path",{fill:"#FFF",d:"M33.78 22.437l-4.228 13.98L27.93 37.5 5.062 34.14V15.503l7.8-1.517L24.354 2.5h1.624L28.9 5.426l-4.548 8.67h.107l10.477 1.31"}))))),e.createElement("div",{className:vt,"aria-live":"polite",hidden:!r,"data-testid":"feedback"},"Thank you for your feedback."))},_t=({id:t,title:a,image:l,html:i,credit:r,likeHandler:n,dislikeHandler:o,expandHandler:m})=>e.createElement(Nt,{id:t,title:a,expandHandler:m},e.createElement(Ht,{html:i,image:l,credit:r}),e.createElement(St,{likeHandler:n,dislikeHandler:o})),Ct=({id:t})=>e.createElement("div",{"data-atom-id":t},"QuizAtom");let Lt,Wt,Ft,Mt,zt,At=e=>e;const jt=a(Lt||(Lt=At`
`)),He=a(ke||(ke=$e`
width: 100%;
`)),we=({id:t,html:a,js:l,css:i})=>e.createElement("figure",{className:ve,"data-atom-id":t,"data-atom-type":"interactive"},e.createElement("iframe",{className:He,srcDoc:Ee({js:l,css:i,html:a}),frameBorder:"0"})),Ne=({id:t})=>e.createElement("div",{"data-atom-id":t},"MediaAtom"),Te=({id:t,title:a,image:l,html:i,credit:r,pillar:n,expandForStorybook:o,likeHandler:m,dislikeHandler:d,expandCallback:s})=>e.createElement(oe,{id:t,title:a,pillar:n,atomType:"profile",atomTypeTitle:"Profile",expandForStorybook:o,expandCallback:s},e.createElement(be,{html:i,image:l,credit:r,pillar:n}),e.createElement(q,{pillar:n,dislikeHandler:d,likeHandler:m})),Se=({id:t,title:a,image:l,html:i,credit:r,pillar:n,likeHandler:o,dislikeHandler:m,expandCallback:d})=>e.createElement(oe,{id:t,title:a,atomType:"qanda",atomTypeTitle:"Q&A",pillar:n,expandCallback:d},e.createElement(be,{html:i,image:l,credit:r,pillar:n}),e.createElement(q,{pillar:n,likeHandler:o,dislikeHandler:m})),Ce=({id:t})=>e.createElement("div",{"data-atom-id":t},"QuizAtom");let _e,Le,We,Fe,Me,ze=e=>e;const De=a(_e||(_e=ze`
:not(:last-child) {

@@ -519,5 +230,5 @@ border-left: 0.0625rem solid ${0};

margin-left: ${0}px;
`),m[60],d[4],o[4],o[2]),It=a(Wt||(Wt=At`
`),m[60],d[4],o[4],o[2]),Ie=a(Le||(Le=ze`
${0};
`),n.medium({lineHeight:"tight",fontWeight:"bold"})),Dt=a(Ft||(Ft=At`
`),n.medium({lineHeight:"tight",fontWeight:"bold"})),Ae=a(We||(We=ze`
content: '';

@@ -531,3 +242,3 @@ width: ${0}px;

background-color: #121212;
`),o[4],o[4]),Bt=a(Mt||(Mt=At`
`),o[4],o[4]),je=a(Fe||(Fe=ze`
::before {

@@ -539,6 +250,6 @@ ${0}

${0};
`),Dt,s[400],n.medium({lineHeight:"tight",fontWeight:"bold"})),Ot=a(zt||(zt=At`
`),Ae,s[400],n.medium({lineHeight:"tight",fontWeight:"bold"})),Oe=a(Me||(Me=ze`
background: ${0};
${0};
`),s[400],n.medium({lineHeight:"tight",fontWeight:"bold"})),Qt=({events:t,pillar:a})=>e.createElement("div",null,t.map((t,l)=>{const i=new Date(Date.parse(t.date)).toISOString(),r=t.toDate?new Date(Date.parse(t.toDate)).toISOString():"";return e.createElement("div",{key:l,"data-type":"event-snippet",className:jt},e.createElement("div",null,e.createElement("time",{dateTime:i,className:Bt},t.date),t.toDate&&e.createElement("span",null," ","-"," ",e.createElement("time",{dateTime:r,className:Ot},t.toDate))),t.title&&e.createElement("div",{className:It},t.title),t.body&&e.createElement(Oe,{html:t.body,pillar:a}))})),Vt=({id:t,events:a,description:l,title:i,pillar:r,expandForStorybook:n,likeHandler:o,dislikeHandler:m,expandCallback:d})=>e.createElement(Le,{atomType:"timeline",atomTypeTitle:"Timeline",id:t,pillar:r,expandForStorybook:n,title:i,expandCallback:d},l&&e.createElement(Oe,{html:l,pillar:r}),a&&e.createElement(Qt,{events:a,pillar:r}),e.createElement(q,{pillar:r,dislikeHandler:m,likeHandler:o}));export{W as AudioAtom,F as ChartAtom,L as ExplainerAtom,xe as GuideAtom,Ne as InteractiveAtom,we as MediaAtom,Qe as ProfileAtom,_t as QandaAtom,Ct as QuizAtom,Vt as TimelineAtom};
`),s[400],n.medium({lineHeight:"tight",fontWeight:"bold"})),Qe=({events:t,pillar:a})=>e.createElement("div",null,t.map((t,l)=>{const i=new Date(Date.parse(t.date)).toISOString(),r=t.toDate?new Date(Date.parse(t.toDate)).toISOString():"";return e.createElement("div",{key:l,"data-type":"event-snippet",className:De},e.createElement("div",null,e.createElement("time",{dateTime:i,className:je},t.date),t.toDate&&e.createElement("span",null," ","-"," ",e.createElement("time",{dateTime:r,className:Oe},t.toDate))),t.title&&e.createElement("div",{className:Ie},t.title),t.body&&e.createElement(be,{html:t.body,pillar:a}))})),Be=({id:t,events:a,description:l,title:i,pillar:r,expandForStorybook:n,likeHandler:o,dislikeHandler:m,expandCallback:d})=>e.createElement(oe,{atomType:"timeline",atomTypeTitle:"Timeline",id:t,pillar:r,expandForStorybook:n,title:i,expandCallback:d},l&&e.createElement(be,{html:l,pillar:r}),a&&e.createElement(Qe,{events:a,pillar:r}),e.createElement(q,{pillar:r,dislikeHandler:m,likeHandler:o}));export{L as AudioAtom,W as ChartAtom,_ as ExplainerAtom,fe as GuideAtom,we as InteractiveAtom,Ne as MediaAtom,Te as ProfileAtom,Se as QandaAtom,Ce as QuizAtom,Be as TimelineAtom};
//# sourceMappingURL=index.modern.js.map

@@ -1,2 +0,2 @@

!function(n,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports,require("react"),require("emotion"),require("@guardian/src-foundations/typography"),require("@guardian/src-foundations"),require("@guardian/src-foundations/palette"),require("@guardian/src-icons"),require("@guardian/src-foundations/palette/"),require("react-dom/server")):"function"==typeof define&&define.amd?define(["exports","react","emotion","@guardian/src-foundations/typography","@guardian/src-foundations","@guardian/src-foundations/palette","@guardian/src-icons","@guardian/src-foundations/palette/","react-dom/server"],e):e((n=n||self).atomsRendering={},n.react,n.emotion,n.typography,n.srcFoundations,n.palette,n.srcIcons,n._,n.server)}(this,function(n,e,t,r,a,i,l,o,s){var c="default"in e?e.default:e;function d(n,e){return e||(e=n.slice(0)),n.raw=e,n}function m(){var n=d(["\n ","\n "]);return m=function(){return n},n}function u(){var n=d(["\n ","\n margin-top: ","px;\n "]);return u=function(){return n},n}function p(){var n=d(["\n padding-bottom: ","px;\n padding-left: ","px;\n padding-right: ","px;\n border-top: 1px solid ",";\n color: ",";\n background: ",";\n\n p {\n margin-top: ","px;\n margin-bottom: ","px;\n }\n "]);return p=function(){return n},n}var f=function(n){var e=n.children;return c.createElement("figure",{"data-atom-id":n.id,"data-atom-type":"explainer",className:t.css(p(),a.space[1],a.space[2],a.space[2],i.text.primary,i.text.primary,i.neutral[97],a.space[3],a.space[3])},e)},g=function(n){var e=n.title;return c.createElement("h3",{className:t.css(u(),r.headline.xxsmall({fontWeight:"bold"}),a.space[2])},e)},h=function(n){var e=n.html;return c.createElement("div",{className:t.css(m(),r.textSans.small({fontWeight:"light",lineHeight:"tight"})),dangerouslySetInnerHTML:{__html:e}})};function x(n,e){switch(n){case"opinion":return o.opinion[e];case"sport":return o.sport[e];case"culture":return o.culture[e];case"lifestyle":return o.lifestyle[e];case"news":return o.news[e];default:return o.news[400]}}function b(){var n=d(["\n ",";\n height: 28px;\n "]);return b=function(){return n},n}function v(){var n=d(["\n transform: rotate(180deg);\n -webkit-transform: rotate(180deg);\n -moz-transform: rotate(180deg);\n -o-transform: rotate(180deg);\n "]);return v=function(){return n},n}function y(){var n=d(["\n display: flex;\n align-items: center;\n ",";\n "]);return y=function(){return n},n}function E(){var n=d(["\n display: inline-flex;\n cursor: pointer;\n align-items: center;\n justify-content: center;\n background: black;\n color: white;\n border-style: hidden;\n border-radius: 100%;\n margin: 0 0 0 5px;\n padding: 0;\n width: 28px;\n height: 28px;\n :hover {\n background: ",";\n }\n :focus {\n border: none;\n }\n "]);return E=function(){return n},n}function k(){var n=d(["\n width: 16px;\n height: 16px;\n "]);return k=function(){return n},n}function w(){var n=d(["\n font-size: 13px;\n line-height: 16px;\n display: flex;\n justify-content: flex-end;\n"]);return w=function(){return n},n}var N=t.css(w()),S=function(){return c.createElement("svg",{className:t.css(k()),viewBox:"0 0 40 40"},c.createElement("path",{fill:"#FFF",d:"M33.78 22.437l-4.228 13.98L27.93 37.5 5.062 34.14V15.503l7.8-1.517L24.354 2.5h1.624L28.9 5.426l-4.548 8.67h.107l10.477 1.31"}))},H=function(n){var a=n.pillar,i=n.likeHandler,l=n.dislikeHandler,o=t.css(E(),x(a,400)),s=e.useState(!1),d=s[0],m=s[1];return c.createElement("footer",{className:N},c.createElement("div",{hidden:d},c.createElement("div",{className:t.css(y(),r.textSans.xsmall())},c.createElement("div",null,"Was this helpful?"),c.createElement("button",{"data-testid":"like",className:o,onClick:function(){i(),m(!0)}},c.createElement(S,null)),c.createElement("button",{className:t.cx(o,t.css(v())),"data-testid":"dislike",onClick:function(){l(),m(!0)}},c.createElement(S,null)))),c.createElement("div",{className:t.css(b(),r.textSans.xsmall()),"data-testid":"feedback",hidden:!d},"Thank you for your feedback."))};function T(){var n=d(["\n background: ",";\n color: ",";\n height: 2rem;\n position: absolute;\n bottom: 0;\n transform: translate(0, 50%);\n padding: 0 15px 0 7px;\n border-radius: 100em;\n cursor: pointer;\n display: inline-flex;\n align-items: center;\n border: 0;\n margin: 0;\n :hover {\n background: ",";\n }\n "]);return T=function(){return n},n}function A(){var n=d(["\n display: block;\n ",";\n color: ",";\n "]);return A=function(){return n},n}function _(){var n=d(["\n display: inline-flex;\n align-items: center;\n ",";\n"]);return _=function(){return n},n}function C(){var n=d(["\n margin-right: 14px;\n margin-bottom: 6px;\n width: 30px;\n fill: white;\n height: 25px;\n padding-left: 4px;\n"]);return C=function(){return n},n}function L(){var n=d(["\n margin-right: 12px;\n margin-bottom: 6px;\n width: 33px;\n fill: white;\n height: 28px;\n"]);return L=function(){return n},n}function W(){var n=d(["\n ",";\n margin: 0;\n line-height: 22px;\n"]);return W=function(){return n},n}var F=t.css(W(),r.headline.xxxsmall({fontWeight:"medium"})),M=t.css(L()),I=t.css(C()),z=t.css(_(),r.textSans.small()),j=function(n){var a=n.sectionTitle,i=n.title,s=n.pillar,d=n.expandCallback,m=t.css(A(),r.body.medium({lineHeight:"tight",fontWeight:"bold"}),x(s,400)),u=t.css(T(),o.neutral[7],o.neutral[100],x(s,400)),p=e.useState(!1),f=p[0],g=p[1],h=e.useState(!1),b=h[0],v=h[1];return c.createElement("summary",{onClick:function(){b||(d(),v(!0)),g(!f)}},c.createElement("span",{className:m},a),c.createElement("h4",{className:F},i),c.createElement("span",{className:u},f?c.createElement("span",{className:z},c.createElement("span",{className:I},c.createElement(l.SvgMinus,null)),"Hide"):c.createElement("span",{className:z},c.createElement("span",{className:M},c.createElement(l.SvgPlus,null)),"Show")))};function q(){var n=d(["\n a {\n color: ",";\n text-decoration: none;\n border-bottom: 0.0625rem solid ",";\n transition: border-color 0.15s ease-out;\n }\n\n a:hover {\n border-bottom: solid 0.0625rem ",";\n }\n "]);return q=function(){return n},n}function D(){var n=d(["\n ",";\n margin: 12px 0;\n display: flex;\n align-items: center;\n svg {\n width: 30px;\n fill: ",";\n }\n"]);return D=function(){return n},n}function Q(){var n=d(["\n .forceHeightAndWidth & {\n width: 100px;\n height: 100px;\n }\n float: left;\n margin-right: 16px;\n margin-bottom: 6px;\n object-fit: cover;\n border-radius: 50%;\n display: block;\n border: 0px;\n"]);return Q=function(){return n},n}function B(){var n=d(["\n ","\n p {\n margin-bottom: 0.5rem;\n }\n\n ol {\n list-style: decimal;\n list-style-position: inside;\n margin-bottom: 1rem;\n }\n\n ul {\n list-style: none;\n margin: 0 0 0.75rem;\n padding: 0;\n margin-bottom: 1rem;\n }\n\n ul li {\n margin-bottom: 0.375rem;\n padding-left: 1.25rem;\n }\n\n ul li:before {\n display: inline-block;\n content: '';\n border-radius: 0.375rem;\n height: 0.75rem;\n width: 0.75rem;\n margin-right: 0.5rem;\n background-color: ",";\n margin-left: -1.25rem;\n }\n\n /* Without this bold elements are overridden */\n b {\n font-weight: 700;\n }\n"]);return B=function(){return n},n}function P(){var n=d(["\n margin: 16px 0 36px;\n background: ",";\n padding: 0 5px 6px;\n border-image: repeating-linear-gradient(\n to bottom,\n ",",\n "," 1px,\n transparent 1px,\n transparent 4px\n )\n 13;\n border-top: 13px solid black;\n position: relative;\n summary {\n list-style: none;\n margin: 0 0 16px;\n }\n\n /* https://developer.mozilla.org/en-US/docs/Web/HTML/Element/details#Customizing_the_disclosure_widget */\n summary::-webkit-details-marker {\n display: none;\n }\n\n summary:focus {\n outline: none;\n }\n"]);return P=function(){return n},n}function O(){var n=d(["\n display: block;\n position: relative;\n margin-bottom: 0.75rem;\n margin-top: 1rem;\n"]);return O=function(){return n},n}var V=t.css(O()),G=t.css(P(),i.neutral[93],i.neutral[86],i.neutral[86]),U=t.css(B(),r.body.medium(),i.neutral[86]),R=t.css(Q()),Y=t.css(D(),r.textSans.xsmall(),i.neutral[60]),J=function(n){var e=n.id,t=n.children;return c.createElement("div",{className:V,"data-atom-id":e,"data-atom-type":"guide"},c.createElement("details",{className:G,"data-atom-id":e,"data-snippet-type":"guide",open:n.expandForStorybook},c.createElement(j,{sectionTitle:"Quick Guide",pillar:n.pillar,title:n.title,expandCallback:n.expandCallback}),t))},K=function(n){var e=n.html,r=n.image,a=n.credit,o=n.pillar,s=t.css(q(),x(o,300),i.neutral[86],x(o,400));return c.createElement("div",null,r&&c.createElement("span",{className:"forceHeightAndWidth"},c.createElement("img",{className:R,src:r,alt:""})),c.createElement("div",{className:t.cx(U,s),dangerouslySetInnerHTML:{__html:e}}),a&&c.createElement("div",{className:Y},c.createElement(l.SvgInfo,null),a))},X=function(n){var e=n.css,t=n.js,r=n.html;return s.renderToString(c.createElement("html",null,c.createElement("head",null,c.createElement("meta",{charSet:"utf-8"}),c.createElement("meta",{name:"viewport",content:"width=device-width,minimum-scale=1,initial-scale=1"}),e&&c.createElement("style",{dangerouslySetInnerHTML:{__html:e}})),c.createElement("body",null,r&&c.createElement("div",{dangerouslySetInnerHTML:{__html:r}})),c.createElement("script",{dangerouslySetInnerHTML:{__html:t}}),c.createElement("script",{dangerouslySetInnerHTML:{__html:"\n function resize() {\n window.frameElement.height = document.body.offsetHeight;\n }\n window.addEventListener('resize', resize);\n resize();\n "}}),c.createElement("script",{dangerouslySetInnerHTML:{__html:"\n var fonts = [].slice.apply(window.parent.document.styleSheets)\n .filter(function (sheet) { return sheet.ownerNode.className.indexOf(\"webfont\") > - 1; })\n .map(function (sheet) { return sheet.ownerNode.textContent; })\n .join(' ');\n var css = document.createElement('style');\n css.textContent = fonts;\n document.head.appendChild(css);\n "}})))};function Z(){var n=d(["\n width: 100%;\n"]);return Z=function(){return n},n}function $(){var n=d(["\n margin: 0;\n"]);return $=function(){return n},n}var nn=t.css($()),en=t.css(Z());function tn(){var n=d(["\n margin: 16px 0 36px;\n background: ",";\n padding: 0 5px 6px;\n border-image: repeating-linear-gradient(\n to bottom,\n ",",\n "," 1px,\n transparent 1px,\n transparent 4px\n )\n 13;\n border-top: 13px solid black;\n position: relative;\n summary {\n list-style: none;\n margin: 0 0 16px;\n }\n\n /* https://developer.mozilla.org/en-US/docs/Web/HTML/Element/details#Customizing_the_disclosure_widget */\n summary::-webkit-details-marker {\n display: none;\n }\n\n summary:focus {\n outline: none;\n }\n"]);return tn=function(){return n},n}function rn(){var n=d(["\n display: block;\n position: relative;\n margin-bottom: 0.75rem;\n margin-top: 1rem;\n"]);return rn=function(){return n},n}var an=t.css(rn()),ln=t.css(tn(),i.neutral[93],i.neutral[86],i.neutral[86]),on=function(n){var e=n.id,t=n.children,r=n.atomType;return c.createElement("div",{className:an,"data-atom-id":e,"data-atom-type":r},c.createElement("details",{className:ln,"data-atom-id":e,"data-snippet-type":r,open:n.expandForStorybook},c.createElement(j,{sectionTitle:n.atomTypeTitle,pillar:n.pillar,title:n.title,expandCallback:n.expandCallback}),t))};function sn(){var n=d(["\n a {\n color: ",";\n text-decoration: none;\n border-bottom: 0.0625rem solid ",";\n transition: border-color 0.15s ease-out;\n }\n\n a:hover {\n border-bottom: solid 0.0625rem ",";\n }\n"]);return sn=function(){return n},n}function cn(){var n=d(["\n ","\n p {\n margin-bottom: 0.5rem;\n }\n\n ol {\n list-style: decimal;\n list-style-position: inside;\n margin-bottom: 1rem;\n }\n\n ul {\n list-style: none;\n margin: 0 0 0.75rem;\n padding: 0;\n margin-bottom: 1rem;\n }\n\n ul li {\n margin-bottom: 0.375rem;\n padding-left: 1.25rem;\n }\n\n ul li:before {\n display: inline-block;\n content: '';\n border-radius: 0.375rem;\n height: 0.75rem;\n width: 0.75rem;\n margin-right: 0.5rem;\n background-color: ",";\n margin-left: -1.25rem;\n }\n\n /* Without this bold elements are overridden */\n b {\n font-weight: 700;\n }\n\n i {\n font-style: italic;\n }\n"]);return cn=function(){return n},n}function dn(){var n=d(["\n ",";\n margin: 12px 0;\n display: flex;\n align-items: center;\n svg {\n width: 30px;\n fill: ",";\n }\n"]);return dn=function(){return n},n}function mn(){var n=d(["\n .forceHeightAndWidth & {\n width: 100px;\n height: 100px;\n }\n float: left;\n margin-right: 16px;\n margin-bottom: 6px;\n object-fit: cover;\n border-radius: 50%;\n display: block;\n border: 0px;\n"]);return mn=function(){return n},n}var un=t.css(mn()),pn=t.css(dn(),r.textSans.xsmall(),i.neutral[60]),fn=t.css(cn(),r.body.medium(),i.neutral[86]),gn=function(n){return t.css(sn(),x(n,300),i.neutral[86],x(n,400))},hn=function(n){var e=n.html,r=n.image,a=n.credit,i=n.pillar;return c.createElement("div",null,r&&c.createElement("span",{className:"forceHeightAndWidth"},c.createElement("img",{className:un,src:r,alt:""})),c.createElement("div",{className:t.cx(fn,gn(i)),dangerouslySetInnerHTML:{__html:e}}),a&&c.createElement("div",{className:pn},c.createElement(l.SvgInfo,null),a))};function xn(){var n=d(["\n ",";\n margin: 0;\n line-height: 22px;\n "]);return xn=function(){return n},n}function bn(){var n=d(["\n color: ",";\n display: block;\n ",";\n "]);return bn=function(){return n},n}function vn(){var n=d(["\n ",";\n margin: 12px 0;\n display: flex;\n align-items: center;\n svg {\n width: 30px;\n fill: #999999;\n }\n"]);return vn=function(){return n},n}function yn(){var n=d(["\n ",";\n height: 28px;\n"]);return yn=function(){return n},n}function En(){var n=d(["\n display: flex;\n align-items: center;\n ",";\n"]);return En=function(){return n},n}function kn(){var n=d(["\n font-size: 13px;\n line-height: 16px;\n display: flex;\n justify-content: flex-end;\n"]);return kn=function(){return n},n}function wn(){var n=d(["\n transform: rotate(180deg);\n -webkit-transform: rotate(180deg);\n -moz-transform: rotate(180deg);\n -o-transform: rotate(180deg);\n"]);return wn=function(){return n},n}function Nn(){var n=d(["\n width: 16px;\n height: 16px;\n"]);return Nn=function(){return n},n}function Sn(){var n=d(["\n display: inline-flex;\n align-items: center;\n ",";\n"]);return Sn=function(){return n},n}function Hn(){var n=d(["\n margin-right: 14px;\n margin-bottom: 6px;\n width: 30px;\n fill: white;\n height: 25px;\n padding-left: 4px;\n"]);return Hn=function(){return n},n}function Tn(){var n=d(["\n margin-right: 12px;\n margin-bottom: 6px;\n width: 33px;\n fill: white;\n height: 28px;\n"]);return Tn=function(){return n},n}function An(){var n=d(["\n .forceHeightAndWidth & {\n width: 100px;\n height: 100px;\n }\n float: left;\n margin-right: 16px;\n margin-bottom: 6px;\n object-fit: cover;\n border-radius: 50%;\n display: block;\n border: 0px;\n"]);return An=function(){return n},n}function _n(){var n=d(["\n display: inline-flex;\n cursor: pointer;\n align-items: center;\n justify-content: center;\n background: black;\n color: white;\n border-style: hidden;\n border-radius: 100%;\n margin: 0 0 0 5px;\n padding: 0;\n width: 28px;\n height: 28px;\n :hover {\n background: ",";\n border-color: ",";\n }\n\n :focus {\n border: none;\n }\n"]);return _n=function(){return n},n}function Cn(){var n=d(["\n background: ",";\n color: ",";\n height: 2rem;\n font-size: 13px;\n position: absolute;\n bottom: 0;\n transform: translate(0, 50%);\n padding: 0 15px 0 7px;\n border-radius: 100em;\n cursor: pointer;\n display: inline-flex;\n align-items: center;\n border: 0;\n margin: 0;\n :hover {\n background: ",";\n }\n"]);return Cn=function(){return n},n}function Ln(){var n=d([""]);return Ln=function(){return n},n}function Wn(){var n=d(["\n ","\n p {\n margin-bottom: 0.5rem;\n }\n ol {\n list-style: decimal;\n list-style-position: inside;\n margin-bottom: 1rem;\n }\n\n ul {\n list-style: none;\n margin: 0 0 0.75rem;\n padding: 0;\n margin-bottom: 1rem;\n }\n\n ul li {\n margin-bottom: 0.375rem;\n padding-left: 1.25rem;\n }\n\n ul li:before {\n display: inline-block;\n content: '';\n border-radius: 0.375rem;\n height: 0.75rem;\n width: 0.75rem;\n margin-right: 0.5rem;\n background-color: ",";\n margin-left: -1.25rem;\n }\n\n a {\n color: ",";\n text-decoration: none;\n border-bottom: 0.0625rem solid ",";\n transition: border-color 0.15s ease-out;\n }\n\n a:hover {\n border-bottom: solid 0.0625rem ",";\n }\n\n b {\n font-weight: bold;\n }\n"]);return Wn=function(){return n},n}function Fn(){var n=d(["\n margin: 16px 0 36px;\n background: ",";\n padding: 0 5px 6px;\n border-image: repeating-linear-gradient(\n to bottom,\n ",",\n "," 1px,\n transparent 1px,\n transparent 4px\n )\n 13;\n border-top: 13px solid black;\n border-left: 0;\n border-right: 0;\n border-bottom: 0;\n position: relative;\n summary {\n list-style: none;\n margin: 0 0 16px;\n }\n summary::-webkit-details-marker {\n display: none;\n }\n\n summary:focus {\n outline: none;\n }\n"]);return Fn=function(){return n},n}function Mn(){var n=d(["\n display: block;\n position: relative;\n margin-bottom: 0.75rem;\n margin-top: 1rem;\n"]);return Mn=function(){return n},n}var In=t.css(Mn()),zn=t.css(Fn(),i.neutral[93],i.neutral[86],i.neutral[86]),jn=t.css(Wn(),r.body.medium(),i.neutral[86],i.news[300],i.neutral[86],i.news[400]),qn=t.css(Ln()),Dn=t.css(Cn(),i.neutral[7],i.neutral[100],i.news[400]),Qn=t.css(_n(),i.news[400],i.news[400]),Bn=t.css(An()),Pn=t.css(Tn()),On=t.css(Hn()),Vn=t.css(Sn(),r.textSans.small()),Gn=t.css(Nn()),Un=t.css(wn()),Rn=t.css(kn()),Yn=t.css(En(),r.textSans.xsmall()),Jn=t.css(yn(),r.textSans.xsmall()),Kn=t.css(vn(),r.textSans.xsmall()),Xn=function(n){var e=n.id,t=n.children;return c.createElement("div",{className:In,"data-atom-id":e,"data-atom-type":"qanda"},c.createElement("details",{"data-snippet-id":e,"data-snippet-type":"qanda",className:zn},c.createElement(Zn,{title:n.title,expandHandler:n.expandHandler}),t))},Zn=function(n){var a=n.title,o=n.expandHandler,s=e.useState(!1),d=s[0],m=s[1],u=e.useState(!1),p=u[0],f=u[1];return c.createElement("summary",{onClick:function(){p||(o(),f(!0)),m(!d)},className:qn},c.createElement("span",{className:t.css(bn(),i.news[400],r.body.medium({lineHeight:"tight",fontWeight:"bold"}))},"Q&A"),c.createElement("h4",{className:t.css(xn(),r.headline.xxxsmall({fontWeight:"medium"}))},a),c.createElement("span",{className:Dn},!d&&c.createElement("span",{className:Vn},c.createElement("span",{className:Pn},c.createElement(l.SvgPlus,null)),"Show"),d&&c.createElement("span",{className:Vn},c.createElement("span",{className:On},c.createElement(l.SvgMinus,null)),"Hide")))},$n=function(n){var e=n.html,t=n.image,r=n.credit;return c.createElement("div",null,t&&c.createElement("span",{className:"forceHeightAndWidth"},c.createElement("img",{className:Bn,src:t,alt:""})),c.createElement("div",{className:jn,dangerouslySetInnerHTML:{__html:e}}),r&&c.createElement(ne,{credit:r}))},ne=function(n){var e=n.credit;return c.createElement("div",{className:Kn},c.createElement(l.SvgInfo,null),e)},ee=function(n){var r=n.likeHandler,a=n.dislikeHandler,i=e.useState(!1),l=i[0],o=i[1];return c.createElement("footer",{className:Rn},c.createElement("div",{hidden:l},c.createElement("div",{className:Yn},c.createElement("div",null,"Was this helpful?"),c.createElement("button",{className:Qn,value:"like","aria-label":"Yes","data-testid":"like",onClick:function(){r(),o(!0)}},c.createElement("svg",{className:Gn,viewBox:"0 0 40 40"},c.createElement("path",{fill:"#FFF",d:"M33.78 22.437l-4.228 13.98L27.93 37.5 5.062 34.14V15.503l7.8-1.517L24.354 2.5h1.624L28.9 5.426l-4.548 8.67h.107l10.477 1.31"}))),c.createElement("button",{className:t.cx(Qn,Un),value:"dislike","aria-label":"No","data-testid":"dislike",onClick:function(){a(),o(!0)}},c.createElement("svg",{className:Gn,viewBox:"0 0 40 40"},c.createElement("path",{fill:"#FFF",d:"M33.78 22.437l-4.228 13.98L27.93 37.5 5.062 34.14V15.503l7.8-1.517L24.354 2.5h1.624L28.9 5.426l-4.548 8.67h.107l10.477 1.31"}))))),c.createElement("div",{className:Jn,"aria-live":"polite",hidden:!l,"data-testid":"feedback"},"Thank you for your feedback."))};function te(){var n=d(["\n background: ",";\n ",";\n"]);return te=function(){return n},n}function re(){var n=d(["\n ::before {\n ","\n }\n margin-left: -16px;\n background: ",";\n ",";\n"]);return re=function(){return n},n}function ae(){var n=d(["\n content: '';\n width: ","px;\n height: ","px;\n border-radius: 100%;\n float: left;\n position: relative;\n left: -24px;\n background-color: #121212;\n"]);return ae=function(){return n},n}function ie(){var n=d(["\n ",";\n"]);return ie=function(){return n},n}function le(){var n=d(["\n :not(:last-child) {\n border-left: 0.0625rem solid ",";\n padding-bottom: ",";\n }\n padding-left: ","px;\n margin-left: ","px;\n"]);return le=function(){return n},n}var oe=t.css(le(),a.neutral[60],a.remSpace[4],a.space[4],a.space[2]),se=t.css(ie(),r.body.medium({lineHeight:"tight",fontWeight:"bold"})),ce=t.css(ae(),a.space[4],a.space[4]),de=t.css(re(),ce,a.brandAlt[400],r.body.medium({lineHeight:"tight",fontWeight:"bold"})),me=t.css(te(),a.brandAlt[400],r.body.medium({lineHeight:"tight",fontWeight:"bold"})),ue=function(n){var e=n.pillar;return c.createElement("div",null,n.events.map(function(n,t){var r=new Date(Date.parse(n.date)).toISOString(),a=n.toDate?new Date(Date.parse(n.toDate)).toISOString():"";return c.createElement("div",{key:t,"data-type":"event-snippet",className:oe},c.createElement("div",null,c.createElement("time",{dateTime:r,className:de},n.date),n.toDate&&c.createElement("span",null," ","-"," ",c.createElement("time",{dateTime:a,className:me},n.toDate))),n.title&&c.createElement("div",{className:se},n.title),n.body&&c.createElement(hn,{html:n.body,pillar:e}))}))};n.AudioAtom=function(n){return c.createElement("div",{"data-atom-id":n.id},"AudioAtom")},n.ChartAtom=function(n){return c.createElement("div",{"data-atom-id":n.id},"ChartAtom")},n.ExplainerAtom=function(n){var e=n.html;return c.createElement(f,{id:n.id},c.createElement(g,{title:n.title}),c.createElement(h,{html:e}))},n.GuideAtom=function(n){var e=n.pillar,t=n.likeHandler,r=n.dislikeHandler;return c.createElement(J,{id:n.id,title:n.title,pillar:e,expandForStorybook:n.expandForStorybook,expandCallback:n.expandCallback},c.createElement(K,{html:n.html,image:n.image,credit:n.credit,pillar:e}),c.createElement(H,{pillar:e,dislikeHandler:r,likeHandler:t}))},n.InteractiveAtom=function(n){return c.createElement("figure",{className:nn,"data-atom-id":n.id,"data-atom-type":"interactive"},c.createElement("iframe",{className:en,srcDoc:X({js:n.js,css:n.css,html:n.html}),frameBorder:"0"}))},n.MediaAtom=function(n){return c.createElement("div",{"data-atom-id":n.id},"MediaAtom")},n.ProfileAtom=function(n){var e=n.pillar,t=n.likeHandler,r=n.dislikeHandler;return c.createElement(on,{id:n.id,title:n.title,pillar:e,atomType:"profile",atomTypeTitle:"Profile",expandForStorybook:n.expandForStorybook,expandCallback:n.expandCallback},c.createElement(hn,{html:n.html,image:n.image,credit:n.credit,pillar:e}),c.createElement(H,{pillar:e,dislikeHandler:r,likeHandler:t}))},n.QandaAtom=function(n){var e=n.likeHandler,t=n.dislikeHandler;return c.createElement(Xn,{id:n.id,title:n.title,expandHandler:n.expandHandler},c.createElement($n,{html:n.html,image:n.image,credit:n.credit}),c.createElement(ee,{likeHandler:e,dislikeHandler:t}))},n.QuizAtom=function(n){return c.createElement("div",{"data-atom-id":n.id},"QuizAtom")},n.TimelineAtom=function(n){var e=n.events,t=n.description,r=n.pillar,a=n.likeHandler,i=n.dislikeHandler;return c.createElement(on,{atomType:"timeline",atomTypeTitle:"Timeline",id:n.id,pillar:r,expandForStorybook:n.expandForStorybook,title:n.title,expandCallback:n.expandCallback},t&&c.createElement(hn,{html:t,pillar:r}),e&&c.createElement(ue,{events:e,pillar:r}),c.createElement(H,{pillar:r,dislikeHandler:i,likeHandler:a}))}});
!function(e,n){"object"==typeof exports&&"undefined"!=typeof module?n(exports,require("react"),require("emotion"),require("@guardian/src-foundations/typography"),require("@guardian/src-foundations"),require("@guardian/src-foundations/palette"),require("@guardian/src-foundations/palette/"),require("@guardian/src-icons"),require("react-dom/server")):"function"==typeof define&&define.amd?define(["exports","react","emotion","@guardian/src-foundations/typography","@guardian/src-foundations","@guardian/src-foundations/palette","@guardian/src-foundations/palette/","@guardian/src-icons","react-dom/server"],n):n((e=e||self).atomsRendering={},e.react,e.emotion,e.typography,e.srcFoundations,e.palette,e._,e.srcIcons,e.server)}(this,function(e,n,t,r,a,i,l,o,c){var s="default"in n?n.default:n;function d(e,n){return n||(n=e.slice(0)),e.raw=n,e}function m(){var e=d(["\n ","\n "]);return m=function(){return e},e}function u(){var e=d(["\n ","\n margin-top: ","px;\n "]);return u=function(){return e},e}function p(){var e=d(["\n padding-bottom: ","px;\n padding-left: ","px;\n padding-right: ","px;\n border-top: 1px solid ",";\n color: ",";\n background: ",";\n\n p {\n margin-top: ","px;\n margin-bottom: ","px;\n }\n "]);return p=function(){return e},e}var f=function(e){var n=e.children;return s.createElement("figure",{"data-atom-id":e.id,"data-atom-type":"explainer",className:t.css(p(),a.space[1],a.space[2],a.space[2],i.text.primary,i.text.primary,i.neutral[97],a.space[3],a.space[3])},n)},g=function(e){var n=e.title;return s.createElement("h3",{className:t.css(u(),r.headline.xxsmall({fontWeight:"bold"}),a.space[2])},n)},h=function(e){var n=e.html;return s.createElement("div",{className:t.css(m(),r.textSans.small({fontWeight:"light",lineHeight:"tight"})),dangerouslySetInnerHTML:{__html:n}})};function x(e,n){switch(e){case"opinion":return l.opinion[n];case"sport":return l.sport[n];case"culture":return l.culture[n];case"lifestyle":return l.lifestyle[n];case"news":return l.news[n];default:return l.news[400]}}function v(){var e=d(["\n ",";\n height: 28px;\n "]);return v=function(){return e},e}function b(){var e=d(["\n transform: rotate(180deg);\n -webkit-transform: rotate(180deg);\n -moz-transform: rotate(180deg);\n -o-transform: rotate(180deg);\n "]);return b=function(){return e},e}function y(){var e=d(["\n display: flex;\n align-items: center;\n ",";\n "]);return y=function(){return e},e}function E(){var e=d(["\n display: inline-flex;\n cursor: pointer;\n align-items: center;\n justify-content: center;\n background: black;\n color: white;\n border-style: hidden;\n border-radius: 100%;\n margin: 0 0 0 5px;\n padding: 0;\n width: 28px;\n height: 28px;\n :hover {\n background: ",";\n }\n :focus {\n border: none;\n }\n "]);return E=function(){return e},e}function k(){var e=d(["\n width: 16px;\n height: 16px;\n "]);return k=function(){return e},e}function w(){var e=d(["\n font-size: 13px;\n line-height: 16px;\n display: flex;\n justify-content: flex-end;\n"]);return w=function(){return e},e}var H=t.css(w()),S=function(){return s.createElement("svg",{className:t.css(k()),viewBox:"0 0 40 40"},s.createElement("path",{fill:"#FFF",d:"M33.78 22.437l-4.228 13.98L27.93 37.5 5.062 34.14V15.503l7.8-1.517L24.354 2.5h1.624L28.9 5.426l-4.548 8.67h.107l10.477 1.31"}))},N=function(e){var a=e.pillar,i=e.likeHandler,l=e.dislikeHandler,o=t.css(E(),x(a,400)),c=n.useState(!1),d=c[0],m=c[1];return s.createElement("footer",{className:H},s.createElement("div",{hidden:d},s.createElement("div",{className:t.css(y(),r.textSans.xsmall())},s.createElement("div",null,"Was this helpful?"),s.createElement("button",{"data-testid":"like",className:o,onClick:function(){i(),m(!0)}},s.createElement(S,null)),s.createElement("button",{className:t.cx(o,t.css(b())),"data-testid":"dislike",onClick:function(){l(),m(!0)}},s.createElement(S,null)))),s.createElement("div",{className:t.css(v(),r.textSans.xsmall()),"data-testid":"feedback",hidden:!d},"Thank you for your feedback."))};function T(){var e=d(["\n background: ",";\n color: ",";\n height: 2rem;\n position: absolute;\n bottom: 0;\n transform: translate(0, 50%);\n padding: 0 15px 0 7px;\n border-radius: 100em;\n cursor: pointer;\n display: inline-flex;\n align-items: center;\n border: 0;\n margin: 0;\n :hover {\n background: ",";\n }\n "]);return T=function(){return e},e}function A(){var e=d(["\n display: block;\n ",";\n color: ",";\n "]);return A=function(){return e},e}function C(){var e=d(["\n display: inline-flex;\n align-items: center;\n ",";\n"]);return C=function(){return e},e}function _(){var e=d(["\n margin-right: 14px;\n margin-bottom: 6px;\n width: 30px;\n fill: white;\n height: 25px;\n padding-left: 4px;\n"]);return _=function(){return e},e}function I(){var e=d(["\n margin-right: 12px;\n margin-bottom: 6px;\n width: 33px;\n fill: white;\n height: 28px;\n"]);return I=function(){return e},e}function L(){var e=d(["\n ",";\n margin: 0;\n line-height: 22px;\n"]);return L=function(){return e},e}var M=t.css(L(),r.headline.xxxsmall({fontWeight:"medium"})),W=t.css(I()),F=t.css(_()),z=t.css(C(),r.textSans.small()),q=function(e){var a=e.sectionTitle,i=e.title,c=e.pillar,d=e.expandCallback,m=t.css(A(),r.body.medium({lineHeight:"tight",fontWeight:"bold"}),x(c,400)),u=t.css(T(),l.neutral[7],l.neutral[100],x(c,400)),p=n.useState(!1),f=p[0],g=p[1],h=n.useState(!1),v=h[0],b=h[1];return s.createElement("summary",{onClick:function(){v||(d(),b(!0)),g(!f)}},s.createElement("span",{className:m},a),s.createElement("h4",{className:M},i),s.createElement("span",{className:u},f?s.createElement("span",{className:z},s.createElement("span",{className:F},s.createElement(o.SvgMinus,null)),"Hide"):s.createElement("span",{className:z},s.createElement("span",{className:W},s.createElement(o.SvgPlus,null)),"Show")))};function D(){var e=d(["\n margin: 16px 0 36px;\n background: ",";\n padding: 0 5px 6px;\n border-image: repeating-linear-gradient(\n to bottom,\n ",",\n "," 1px,\n transparent 1px,\n transparent 4px\n )\n 13;\n border-top: 13px solid black;\n position: relative;\n summary {\n list-style: none;\n margin: 0 0 16px;\n }\n\n /* https://developer.mozilla.org/en-US/docs/Web/HTML/Element/details#Customizing_the_disclosure_widget */\n summary::-webkit-details-marker {\n display: none;\n }\n\n summary:focus {\n outline: none;\n }\n"]);return D=function(){return e},e}function j(){var e=d(["\n display: block;\n position: relative;\n margin-bottom: 0.75rem;\n margin-top: 1rem;\n"]);return j=function(){return e},e}var Q=t.css(j()),O=t.css(D(),i.neutral[93],i.neutral[86],i.neutral[86]),P=function(e){var n=e.id,t=e.children,r=e.atomType;return s.createElement("div",{className:Q,"data-atom-id":n,"data-atom-type":r},s.createElement("details",{className:O,"data-atom-id":n,"data-snippet-type":r,open:e.expandForStorybook},s.createElement(q,{sectionTitle:e.atomTypeTitle,pillar:e.pillar,title:e.title,expandCallback:e.expandCallback}),t))};function B(){var e=d(["\n a {\n color: ",";\n text-decoration: none;\n border-bottom: 0.0625rem solid ",";\n transition: border-color 0.15s ease-out;\n }\n\n a:hover {\n border-bottom: solid 0.0625rem ",";\n }\n"]);return B=function(){return e},e}function G(){var e=d(["\n ","\n p {\n margin-bottom: 0.5rem;\n }\n\n ol {\n list-style: decimal;\n list-style-position: inside;\n margin-bottom: 1rem;\n }\n\n ul {\n list-style: none;\n margin: 0 0 0.75rem;\n padding: 0;\n margin-bottom: 1rem;\n }\n\n ul li {\n margin-bottom: 0.375rem;\n padding-left: 1.25rem;\n }\n\n ul li:before {\n display: inline-block;\n content: '';\n border-radius: 0.375rem;\n height: 0.75rem;\n width: 0.75rem;\n margin-right: 0.5rem;\n background-color: ",";\n margin-left: -1.25rem;\n }\n\n /* Without this bold elements are overridden */\n b {\n font-weight: 700;\n }\n\n i {\n font-style: italic;\n }\n"]);return G=function(){return e},e}function R(){var e=d(["\n ",";\n margin: 12px 0;\n display: flex;\n align-items: center;\n svg {\n width: 30px;\n fill: ",";\n }\n"]);return R=function(){return e},e}function U(){var e=d(["\n .forceHeightAndWidth & {\n width: 100px;\n height: 100px;\n }\n float: left;\n margin-right: 16px;\n margin-bottom: 6px;\n object-fit: cover;\n border-radius: 50%;\n display: block;\n border: 0px;\n"]);return U=function(){return e},e}var V=t.css(U()),J=t.css(R(),r.textSans.xsmall(),i.neutral[60]),K=t.css(G(),r.body.medium(),i.neutral[86]),X=function(e){return t.css(B(),x(e,300),i.neutral[86],x(e,400))},Y=function(e){var n=e.html,r=e.image,a=e.credit,i=e.pillar;return s.createElement("div",null,r&&s.createElement("span",{className:"forceHeightAndWidth"},s.createElement("img",{className:V,src:r,alt:""})),s.createElement("div",{className:t.cx(K,X(i)),dangerouslySetInnerHTML:{__html:n}}),a&&s.createElement("div",{className:J},s.createElement(o.SvgInfo,null),a))},Z=function(e){var n=e.css,t=e.js,r=e.html;return c.renderToString(s.createElement("html",null,s.createElement("head",null,s.createElement("meta",{charSet:"utf-8"}),s.createElement("meta",{name:"viewport",content:"width=device-width,minimum-scale=1,initial-scale=1"}),n&&s.createElement("style",{dangerouslySetInnerHTML:{__html:n}})),s.createElement("body",null,r&&s.createElement("div",{dangerouslySetInnerHTML:{__html:r}})),s.createElement("script",{dangerouslySetInnerHTML:{__html:t}}),s.createElement("script",{dangerouslySetInnerHTML:{__html:"\n function resize() {\n window.frameElement.height = document.body.offsetHeight;\n }\n window.addEventListener('resize', resize);\n resize();\n "}}),s.createElement("script",{dangerouslySetInnerHTML:{__html:"\n var fonts = [].slice.apply(window.parent.document.styleSheets)\n .filter(function (sheet) { return sheet.ownerNode.className.indexOf(\"webfont\") > - 1; })\n .map(function (sheet) { return sheet.ownerNode.textContent; })\n .join(' ');\n var css = document.createElement('style');\n css.textContent = fonts;\n document.head.appendChild(css);\n "}})))};function $(){var e=d(["\n width: 100%;\n"]);return $=function(){return e},e}function ee(){var e=d(["\n margin: 0;\n"]);return ee=function(){return e},e}var ne=t.css(ee()),te=t.css($());function re(){var e=d(["\n background: ",";\n ",";\n"]);return re=function(){return e},e}function ae(){var e=d(["\n ::before {\n ","\n }\n margin-left: -16px;\n background: ",";\n ",";\n"]);return ae=function(){return e},e}function ie(){var e=d(["\n content: '';\n width: ","px;\n height: ","px;\n border-radius: 100%;\n float: left;\n position: relative;\n left: -24px;\n background-color: #121212;\n"]);return ie=function(){return e},e}function le(){var e=d(["\n ",";\n"]);return le=function(){return e},e}function oe(){var e=d(["\n :not(:last-child) {\n border-left: 0.0625rem solid ",";\n padding-bottom: ",";\n }\n padding-left: ","px;\n margin-left: ","px;\n"]);return oe=function(){return e},e}var ce=t.css(oe(),a.neutral[60],a.remSpace[4],a.space[4],a.space[2]),se=t.css(le(),r.body.medium({lineHeight:"tight",fontWeight:"bold"})),de=t.css(ie(),a.space[4],a.space[4]),me=t.css(ae(),de,a.brandAlt[400],r.body.medium({lineHeight:"tight",fontWeight:"bold"})),ue=t.css(re(),a.brandAlt[400],r.body.medium({lineHeight:"tight",fontWeight:"bold"})),pe=function(e){var n=e.pillar;return s.createElement("div",null,e.events.map(function(e,t){var r=new Date(Date.parse(e.date)).toISOString(),a=e.toDate?new Date(Date.parse(e.toDate)).toISOString():"";return s.createElement("div",{key:t,"data-type":"event-snippet",className:ce},s.createElement("div",null,s.createElement("time",{dateTime:r,className:me},e.date),e.toDate&&s.createElement("span",null," ","-"," ",s.createElement("time",{dateTime:a,className:ue},e.toDate))),e.title&&s.createElement("div",{className:se},e.title),e.body&&s.createElement(Y,{html:e.body,pillar:n}))}))};e.AudioAtom=function(e){return s.createElement("div",{"data-atom-id":e.id},"AudioAtom")},e.ChartAtom=function(e){return s.createElement("div",{"data-atom-id":e.id},"ChartAtom")},e.ExplainerAtom=function(e){var n=e.html;return s.createElement(f,{id:e.id},s.createElement(g,{title:e.title}),s.createElement(h,{html:n}))},e.GuideAtom=function(e){var n=e.pillar,t=e.likeHandler,r=e.dislikeHandler;return s.createElement(P,{id:e.id,title:e.title,pillar:n,atomType:"guide",atomTypeTitle:"Quick Guide",expandForStorybook:e.expandForStorybook,expandCallback:e.expandCallback},s.createElement(Y,{html:e.html,image:e.image,credit:e.credit,pillar:n}),s.createElement(N,{pillar:n,dislikeHandler:r,likeHandler:t}))},e.InteractiveAtom=function(e){return s.createElement("figure",{className:ne,"data-atom-id":e.id,"data-atom-type":"interactive"},s.createElement("iframe",{className:te,srcDoc:Z({js:e.js,css:e.css,html:e.html}),frameBorder:"0"}))},e.MediaAtom=function(e){return s.createElement("div",{"data-atom-id":e.id},"MediaAtom")},e.ProfileAtom=function(e){var n=e.pillar,t=e.likeHandler,r=e.dislikeHandler;return s.createElement(P,{id:e.id,title:e.title,pillar:n,atomType:"profile",atomTypeTitle:"Profile",expandForStorybook:e.expandForStorybook,expandCallback:e.expandCallback},s.createElement(Y,{html:e.html,image:e.image,credit:e.credit,pillar:n}),s.createElement(N,{pillar:n,dislikeHandler:r,likeHandler:t}))},e.QandaAtom=function(e){var n=e.pillar,t=e.likeHandler,r=e.dislikeHandler;return s.createElement(P,{id:e.id,title:e.title,atomType:"qanda",atomTypeTitle:"Q&A",pillar:n,expandCallback:e.expandCallback},s.createElement(Y,{html:e.html,image:e.image,credit:e.credit,pillar:n}),s.createElement(N,{pillar:n,likeHandler:t,dislikeHandler:r}))},e.QuizAtom=function(e){return s.createElement("div",{"data-atom-id":e.id},"QuizAtom")},e.TimelineAtom=function(e){var n=e.events,t=e.description,r=e.pillar,a=e.likeHandler,i=e.dislikeHandler;return s.createElement(P,{atomType:"timeline",atomTypeTitle:"Timeline",id:e.id,pillar:r,expandForStorybook:e.expandForStorybook,title:e.title,expandCallback:e.expandCallback},t&&s.createElement(Y,{html:t,pillar:r}),n&&s.createElement(pe,{events:n,pillar:r}),s.createElement(N,{pillar:r,dislikeHandler:i,likeHandler:a}))}});
//# sourceMappingURL=index.umd.js.map
/// <reference types="react" />
import { QandaAtomType } from './types';
export declare const QandaAtom: ({ id, title, image, html, credit, likeHandler, dislikeHandler, expandHandler, }: QandaAtomType) => JSX.Element;
export declare const QandaAtom: ({ id, title, image, html, credit, pillar, likeHandler, dislikeHandler, expandCallback, }: QandaAtomType) => JSX.Element;

@@ -54,5 +54,6 @@ export declare type ExplainerAtomType = {

credit?: string;
pillar: string;
likeHandler: () => void;
dislikeHandler: () => void;
expandHandler: () => void;
expandCallback: () => void;
};

@@ -59,0 +60,0 @@ export declare type QuizAtomType = {

{
"name": "@guardian/atoms-rendering",
"version": "1.8.0",
"version": "1.8.1",
"source": "src/index.ts",

@@ -5,0 +5,0 @@ "main": "dist/index.js",

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc