@royaloperahouse/harmonic 0.17.0-i → 0.17.0-k

package/dist/harmonic.esm.js

@@ -4260,7 +4260,7 @@ var TextFieldLegacy = function TextFieldLegacy(_ref) {
 };
 
 var _templateObject$p, _templateObject2$h;
-var TextLinkWrapper = /*#__PURE__*/styled.a(_templateObject$p || (_templateObject$p = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  border-bottom: 1px solid;\n  padding-bottom: ", ";\n  font-family: var(--font-family-sans);\n  font-size: 19px;\n  font-weight: 500;\n  line-height: 17px;\n  letter-spacing: 0.4px;\n  color: var(--color-", ");\n  width: fit-content;\n  display: flex;\n  align-items: center;\n  cursor: pointer;\n  text-decoration: none;\n\n  @media ", " {\n    font-size: 17px;\n  }\n"])), function (_ref) {
+var TextLinkWrapper = /*#__PURE__*/styled.a(_templateObject$p || (_templateObject$p = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  border-bottom: 1px solid;\n  text-underline-offset: ", ";\n  font-family: var(--font-family-sans);\n  font-size: 19px;\n  font-weight: 500;\n  line-height: 17px;\n  letter-spacing: 0.4px;\n  color: var(--color-", ");\n  width: fit-content;\n  display: flex;\n  align-items: center;\n  cursor: pointer;\n  text-decoration: none;\n\n  @media ", " {\n    font-size: 17px;\n  }\n"])), function (_ref) {
   var iconName = _ref.iconName;
   return iconName ? 'calc(var(--text-link-underline-offset) - 4px)' : 'var(--harmonic-text-link-underline-offset)';
 }, function (_ref2) {
@@ -6443,7 +6443,7 @@ var AddressWrapper = /*#__PURE__*/styled.div(_templateObject3$m || (_templateObj
 var TitleWrapper$1 = /*#__PURE__*/styled.div(_templateObject4$j || (_templateObject4$j = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  align-items: baseline;\n  gap: 3px;\n"])));
 var MobileSuffixWrapper = /*#__PURE__*/styled.div(_templateObject5$f || (_templateObject5$f = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: none;\n\n  @media ", " {\n    display: block;\n  }\n"])), devices.mobile);
 var DesktopSuffixWrapper = /*#__PURE__*/styled.div(_templateObject6$a || (_templateObject6$a = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: block;\n\n  @media ", " {\n    display: none;\n  }\n"])), devices.mobile);
-var DetailsWrapper = /*#__PURE__*/styled.div(_templateObject7$7 || (_templateObject7$7 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  a {\n    font-family: var(--font-family-sans);\n    font-weight: 400;\n    font-size: 19px;\n    line-height: 26px;\n    letter-spacing: -0.5px;\n    color: var(--color-base-black);\n    text-decoration: underline;\n    text-underline-offset: 4px;\n    margin-right: 13px;\n    display: inline-block;\n\n    &:last-child {\n      margin-right: 0;\n    }\n\n    @media ", " {\n      font-size: 17px;\n      line-height: 24px;\n    }\n  }\n"])), devices.mobile);
+var DetailsWrapper = /*#__PURE__*/styled.div(_templateObject7$7 || (_templateObject7$7 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  a {\n    font-family: var(--font-family-sans);\n    font-weight: 400;\n    font-size: 19px;\n    line-height: 26px;\n    letter-spacing: -0.5px;\n    color: var(--color-base-black);\n    text-decoration: underline;\n    text-underline-offset: var(--harmonic-text-link-underline-offset);\n    margin-right: 13px;\n    display: inline-block;\n\n    &:last-child {\n      margin-right: 0;\n    }\n\n    @media ", " {\n      font-size: 17px;\n      line-height: 24px;\n    }\n  }\n"])), devices.mobile);
 
 var ContactCard = function ContactCard(_ref) {
   var title = _ref.title,
@@ -8437,7 +8437,7 @@ var CreditListing = function CreditListing(_ref) {
 };
 
 var _templateObject$Z;
-var PolicyLinksTextLinkWrapper = /*#__PURE__*/styled(TextLink)(_templateObject$Z || (_templateObject$Z = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  font-family: var(--font-family-sans);\n  font-size: 17px;\n  line-height: 24px;\n  letter-spacing: 0.4px;\n  color: var(--color-base-white);\n  border-bottom: unset;\n  text-decoration: underline;\n  text-underline-offset: 6px;\n  margin-bottom: 0;\n  padding-bottom: 0;\n"])));
+var PolicyLinksTextLinkWrapper = /*#__PURE__*/styled(TextLink)(_templateObject$Z || (_templateObject$Z = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  font-family: var(--font-family-sans);\n  font-size: 17px;\n  line-height: 24px;\n  letter-spacing: 0.4px;\n  color: var(--color-base-white);\n  border-bottom: unset;\n  text-decoration: underline;\n  text-underline-offset: var(--harmonic-text-link-underline-offset);\n  margin-bottom: 0;\n  padding-bottom: 0;\n"])));
 
 var PolicyLinks = function PolicyLinks(_ref) {
   var items = _ref.items;
@@ -11120,7 +11120,7 @@ var Heading = /*#__PURE__*/styled(HarmonicHeader).attrs({
 var Intro = /*#__PURE__*/styled(HarmonicSubtitle).attrs({
   size: 'large'
 })(_templateObject5$B || (_templateObject5$B = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  && {\n    margin-bottom: 27px;\n\n    @media ", " {\n      margin-bottom: 20px;\n    }\n  }\n"])), devices.mobile);
-var SignInLink = /*#__PURE__*/styled.a(_templateObject6$r || (_templateObject6$r = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  color: var(--primary-black);\n  text-decoration: underline;\n  text-decoration-skip: none;\n"])));
+var SignInLink = /*#__PURE__*/styled.a(_templateObject6$r || (_templateObject6$r = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  color: var(--primary-black);\n  cursor: pointer;\n  text-decoration: underline;\n  text-decoration-skip: none;\n"])));
 var SignInPrompt = /*#__PURE__*/styled(BodyCopyHarmonic).attrs({
   size: 'large'
 })(_templateObject7$l || (_templateObject7$l = /*#__PURE__*/_taggedTemplateLiteralLoose([""])));
@@ -11130,8 +11130,10 @@ var Paywall = function Paywall(_ref) {
     title = _ref.title,
     intro = _ref.intro,
     description = _ref.description,
+    buttonOnClick = _ref.buttonOnClick,
     buttonText = _ref.buttonText,
     buttonUrl = _ref.buttonUrl,
+    signInLinkOnClick = _ref.signInLinkOnClick,
     signInPromptText = _ref.signInPromptText,
     signInLinkUrl = _ref.signInLinkUrl;
   return /*#__PURE__*/React__default.createElement(Container$7, {
@@ -11140,9 +11142,11 @@ var Paywall = function Paywall(_ref) {
     html: description
   }), /*#__PURE__*/React__default.createElement(Button$2, {
     href: buttonUrl,
+    onClick: buttonOnClick,
     role: "button"
   }, buttonText), !!(signInPromptText && signInLinkUrl) && (/*#__PURE__*/React__default.createElement(SignInPrompt, null, signInPromptText + " ", /*#__PURE__*/React__default.createElement(SignInLink, {
-    href: signInLinkUrl
+    href: signInLinkUrl,
+    onClick: signInLinkOnClick
   }, "Sign in"))));
 };
 
@@ -11319,7 +11323,7 @@ var SocialAndNewsletterSection = /*#__PURE__*/styled(GridItem)(_templateObject3$
 var SectionWrapper = /*#__PURE__*/styled.div(_templateObject4$I || (_templateObject4$I = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  flex-direction: column;\n  gap: 20px;\n\n  @media ", " {\n    gap: 24px;\n  }\n"])), devices.mobile);
 var LogoAndDescriptionSection = /*#__PURE__*/styled(GridItem)(_templateObject5$C || (_templateObject5$C = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  grid-area: logo;\n  display: flex;\n  flex-direction: column;\n  justify-content: space-between;\n\n  @media ", " {\n    gap: 24px;\n  }\n"])), devices.mobile);
 var SponsorLogoContainer = /*#__PURE__*/styled.div(_templateObject6$s || (_templateObject6$s = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  max-width: 290px;\n\n  @media ", " {\n    max-width: unset;\n  }\n"])), devices.mobile);
-var TextLinkWrapper$3 = /*#__PURE__*/styled(TextLink)(_templateObject7$m || (_templateObject7$m = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  font-family: var(--font-family-sans);\n  font-size: 17px;\n  line-height: 24px;\n  letter-spacing: 0.4px;\n  color: var(--color-base-white);\n  border-bottom: unset;\n  text-decoration: underline;\n  text-underline-offset: 6px;\n  margin-bottom: 0;\n  padding-bottom: 0;\n"])));
+var TextLinkWrapper$3 = /*#__PURE__*/styled(TextLink)(_templateObject7$m || (_templateObject7$m = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  font-family: var(--font-family-sans);\n  font-size: 17px;\n  line-height: 24px;\n  letter-spacing: 0.4px;\n  color: var(--color-base-white);\n  border-bottom: unset;\n  text-decoration: underline;\n  text-underline-offset: var(--harmonic-text-link-underline-offset);\n  margin-bottom: 0;\n  padding-bottom: 0;\n"])));
 
 var SPONSOR_IMAGE_SOURCE = 'https://s3.eu-west-1.amazonaws.com/static.roh.org.uk/sponsorlogos/arts-council-england-invert.svg';
 var Footer = function Footer(_ref) {