@financial-times/n-conversion-forms 27.2.1 → 27.2.3

package/components/__snapshots__/b2c-partnership-confirmation.spec.js.snap

@@ -7,7 +7,7 @@ exports[`B2CPartnershipConfirmation renders as default 1`] = `
     </div>
     <div class="ncf__paragraph">
       <h1 class="ncf__header ncf__header--confirmation">
-        Welcome to your 30 days&#x27; Premium access
+        Welcome to your Premium access
       </h1>
     </div>
   </div>

package/components/__snapshots__/licence-confirmation.spec.js.snap

@@ -28,7 +28,7 @@ exports[`LicenceConfirmation renders if content id 1`] = `
     <a href="/content/d19dc7a6-c33b-4931-9a7e-4a74674da29a"
        class="ncf__link"
     >
-      Start reading
+      Go to homepage
     </a>
   </p>
 </div>
@@ -62,7 +62,7 @@ exports[`LicenceConfirmation renders if educational licence 1`] = `
     <a href="/"
        class="ncf__link"
     >
-      Start reading
+      Go to homepage
     </a>
   </p>
 </div>
@@ -97,7 +97,7 @@ exports[`LicenceConfirmation renders if is embedded 1`] = `
        class="ncf__link"
        target="_top"
     >
-      Start reading
+      Go to homepage
     </a>
   </p>
 </div>
@@ -131,7 +131,7 @@ exports[`LicenceConfirmation renders if is trial 1`] = `
     <a href="/"
        class="ncf__link"
     >
-      Start reading
+      Go to homepage
     </a>
   </p>
 </div>
@@ -165,7 +165,7 @@ exports[`LicenceConfirmation renders with custom duration value 1`] = `
     <a href="/"
        class="ncf__link"
     >
-      Start reading
+      Go to homepage
     </a>
   </p>
 </div>
@@ -199,7 +199,7 @@ exports[`LicenceConfirmation renders with default props 1`] = `
     <a href="/"
        class="ncf__link"
     >
-      Start reading
+      Go to homepage
     </a>
   </p>
 </div>

package/components/__snapshots__/licence-header.spec.js.snap

@@ -1,19 +1,19 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`LicenceHeader renders if is isB2cPartnershipLicence 1`] = `
-<h1 class="ncf__header ncf__center">
+<h1 class="ncf__header">
   Welcome to the Financial Times
 </h1>
 `;
 
 exports[`LicenceHeader renders if is trial 1`] = `
-<h1 class="ncf__header ncf__center">
+<h1 class="ncf__header">
   Welcome to the Financial Times
 </h1>
 `;
 
 exports[`LicenceHeader renders if url is defined 1`] = `
-<h1 class="ncf__header ncf__center">
+<h1 class="ncf__header">
   Join your FT.com subscription
 </h1>
 <div class="ncf__center">
@@ -31,7 +31,7 @@ exports[`LicenceHeader renders if url is defined 1`] = `
 `;
 
 exports[`LicenceHeader renders with custom display name 1`] = `
-<h1 class="ncf__header ncf__center">
+<h1 class="ncf__header">
   <span class="ncf__light-licence-text">
     Great news!
     <span class="ncf__bold-licence-text">
@@ -60,7 +60,7 @@ exports[`LicenceHeader renders with custom display name 1`] = `
 `;
 
 exports[`LicenceHeader renders with custom welcome text (that requires escaping, e.g. ampersand) 1`] = `
-<h1 class="ncf__header ncf__center">
+<h1 class="ncf__header">
   Join your FT.com subscription
 </h1>
 <div class="ncf__center">
@@ -74,7 +74,7 @@ exports[`LicenceHeader renders with custom welcome text (that requires escaping,
 `;
 
 exports[`LicenceHeader renders with default props 1`] = `
-<h1 class="ncf__header ncf__center">
+<h1 class="ncf__header">
   Join your FT.com subscription
 </h1>
 <div class="ncf__center">

package/components/__snapshots__/licence-title.spec.js.snap

@@ -1,19 +1,19 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`LicenceTitle renders if is isB2cPartnershipLicence 1`] = `
-<h1 class="ncf__header ncf__center">
+<h1 class="ncf__header">
   Welcome to the Financial Times
 </h1>
 `;
 
 exports[`LicenceTitle renders if is trial 1`] = `
-<h1 class="ncf__header ncf__center">
+<h1 class="ncf__header">
   Welcome to the Financial Times
 </h1>
 `;
 
 exports[`LicenceTitle renders with custom display name 1`] = `
-<h1 class="ncf__header ncf__center">
+<h1 class="ncf__header">
   <span class="ncf__light-licence-text">
     Great news!
     <span class="ncf__bold-licence-text">
@@ -29,7 +29,7 @@ exports[`LicenceTitle renders with custom display name 1`] = `
 `;
 
 exports[`LicenceTitle renders with default props 1`] = `
-<h1 class="ncf__header ncf__center">
+<h1 class="ncf__header">
   Join your FT.com subscription
 </h1>
 `;

package/components/b2c-partnership-confirmation.jsx

@@ -19,7 +19,7 @@ export function B2CPartnershipConfirmation ({ ctaElement = null }) {
 				<div className="ncf__paragraph">
 					{
 						<h1 className="ncf__header ncf__header--confirmation">
-							{'Welcome to your 30 days\' Premium access'}
+							{'Welcome to your Premium access'}
 						</h1>
 					}
 				</div>

package/components/delivery-city.jsx

@@ -20,8 +20,11 @@ export function DeliveryCity ({
 		GBR: 'e.g. Bath',
 		USA: 'e.g. Los Angeles',
 		CAN: 'e.g. Montreal',
+		ARE: 'e.g. Dubai'
 	};
 
+	const inputLabel = country === 'ARE'? 'Emirate or City':'City';
+
 	return (
 		<label
 			id="deliveryCityField"
@@ -30,7 +33,7 @@ export function DeliveryCity ({
 			htmlFor="deliveryCity"
 		>
 			<span className="o-forms-title">
-				<span className="o-forms-title__main">City</span>
+				<span className="o-forms-title__main">{inputLabel}</span>
 			</span>
 			<span className={inputWrapperClassName}>
 				<input

package/components/licence-confirmation.jsx

@@ -55,7 +55,7 @@ export function LicenceConfirmation ({
 			)}
 
 			<p className="ncf__paragraph ncf__center">
-				<a {...readingLinkProps}>Start reading</a>
+				<a {...readingLinkProps}>Go to homepage</a>
 			</p>
 		</div>
 	);

package/components/licence-header.jsx

@@ -6,6 +6,7 @@ import { LicenceTitle } from './licence-title';
 export function LicenceHeader (props) {
 	const {
 		displayName = '',
+		logoUrl = '',
 		isTrial = false,
 		isB2cPartnershipLicence = false,
 		welcomeText = '',
@@ -17,6 +18,10 @@ export function LicenceHeader (props) {
 
 	return (
 		<React.Fragment>
+			{Boolean(logoUrl) && (
+				<img className="ncf__logo" alt="logo" src={logoUrl}/>
+			)}
+
 			<LicenceTitle
 				displayName={displayName}
 				isTrial={isTrial}
@@ -34,6 +39,7 @@ export function LicenceHeader (props) {
 
 LicenceHeader.propTypes = {
 	displayName: PropTypes.string,
+	logoUrl: PropTypes.string,
 	isTrial: PropTypes.bool,
 	welcomeText: PropTypes.string,
 	isB2cPartnershipLicence: PropTypes.bool,

package/components/licence-title.jsx

@@ -8,7 +8,7 @@ export function LicenceTitle ({
 }) {
 	if (isB2cPartnershipLicence || isTrial) {
 		return (
-			<h1 className="ncf__header ncf__center">
+			<h1 className="ncf__header">
 				{displayName || 'Welcome to the Financial Times'}
 			</h1>
 		);
@@ -20,13 +20,11 @@ export function LicenceTitle ({
 
 function renderB2BTitle (displayName) {
 	if (!displayName) {
-		return (
-			<h1 className="ncf__header ncf__center">Join your FT.com subscription</h1>
-		);
+		return <h1 className="ncf__header">Join your FT.com subscription</h1>;
 	}
 
 	return (
-		<h1 className="ncf__header ncf__center">
+		<h1 className="ncf__header">
 			<span className="ncf__light-licence-text">
 				Great news!
 				<span className="ncf__bold-licence-text"> {displayName} </span>

package/dist/b2c-partnership-confirmation.js

@@ -32,7 +32,7 @@ function B2CPartnershipConfirmation(_ref) {
     className: "ncf__paragraph"
   }, /*#__PURE__*/_react["default"].createElement("h1", {
     className: "ncf__header ncf__header--confirmation"
-  }, 'Welcome to your 30 days\' Premium access'))), /*#__PURE__*/_react["default"].createElement("p", {
+  }, 'Welcome to your Premium access'))), /*#__PURE__*/_react["default"].createElement("p", {
     className: "ncf__paragraph"
   }, "Please check your email to confirm your account and set your password."), /*#__PURE__*/_react["default"].createElement("p", {
     className: "ncf__paragraph"

package/dist/delivery-city.js

@@ -30,8 +30,10 @@ function DeliveryCity(_ref) {
   var inputPlaceholder = {
     GBR: 'e.g. Bath',
     USA: 'e.g. Los Angeles',
-    CAN: 'e.g. Montreal'
+    CAN: 'e.g. Montreal',
+    ARE: 'e.g. Dubai'
   };
+  var inputLabel = country === 'ARE' ? 'Emirate or City' : 'City';
   return /*#__PURE__*/_react["default"].createElement("label", {
     id: "deliveryCityField",
     className: "o-forms-field ncf__validation-error",
@@ -41,7 +43,7 @@ function DeliveryCity(_ref) {
     className: "o-forms-title"
   }, /*#__PURE__*/_react["default"].createElement("span", {
     className: "o-forms-title__main"
-  }, "City")), /*#__PURE__*/_react["default"].createElement("span", {
+  }, inputLabel)), /*#__PURE__*/_react["default"].createElement("span", {
     className: inputWrapperClassName
   }, /*#__PURE__*/_react["default"].createElement("input", {
     type: "text",

package/dist/licence-confirmation.js

@@ -63,7 +63,7 @@ function LicenceConfirmation(_ref) {
     href: "/myft"
   }, "Go to myFT")), /*#__PURE__*/_react["default"].createElement("p", {
     className: "ncf__paragraph ncf__center"
-  }, /*#__PURE__*/_react["default"].createElement("a", readingLinkProps, "Start reading")));
+  }, /*#__PURE__*/_react["default"].createElement("a", readingLinkProps, "Go to homepage")));
 }
 
 LicenceConfirmation.propTypes = {

package/dist/licence-header.js

@@ -18,6 +18,8 @@ var _licenceTitle = require("./licence-title");
 function LicenceHeader(props) {
   var _props$displayName = props.displayName,
       displayName = _props$displayName === void 0 ? '' : _props$displayName,
+      _props$logoUrl = props.logoUrl,
+      logoUrl = _props$logoUrl === void 0 ? '' : _props$logoUrl,
       _props$isTrial = props.isTrial,
       isTrial = _props$isTrial === void 0 ? false : _props$isTrial,
       _props$isB2cPartnersh = props.isB2cPartnershipLicence,
@@ -33,7 +35,11 @@ function LicenceHeader(props) {
     };
   }
 
-  return /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement(_licenceTitle.LicenceTitle, {
+  return /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, Boolean(logoUrl) && /*#__PURE__*/_react["default"].createElement("img", {
+    className: "ncf__logo",
+    alt: "logo",
+    src: logoUrl
+  }), /*#__PURE__*/_react["default"].createElement(_licenceTitle.LicenceTitle, {
     displayName: displayName,
     isTrial: isTrial,
     isB2cPartnershipLicence: isB2cPartnershipLicence
@@ -47,6 +53,7 @@ function LicenceHeader(props) {
 
 LicenceHeader.propTypes = {
   displayName: _propTypes["default"].string,
+  logoUrl: _propTypes["default"].string,
   isTrial: _propTypes["default"].bool,
   welcomeText: _propTypes["default"].string,
   isB2cPartnershipLicence: _propTypes["default"].bool,

package/dist/licence-title.js

@@ -21,7 +21,7 @@ function LicenceTitle(_ref) {
 
   if (isB2cPartnershipLicence || isTrial) {
     return /*#__PURE__*/_react["default"].createElement("h1", {
-      className: "ncf__header ncf__center"
+      className: "ncf__header"
     }, displayName || 'Welcome to the Financial Times');
   }
 
@@ -33,12 +33,12 @@ function LicenceTitle(_ref) {
 function renderB2BTitle(displayName) {
   if (!displayName) {
     return /*#__PURE__*/_react["default"].createElement("h1", {
-      className: "ncf__header ncf__center"
+      className: "ncf__header"
     }, "Join your FT.com subscription");
   }
 
   return /*#__PURE__*/_react["default"].createElement("h1", {
-    className: "ncf__header ncf__center"
+    className: "ncf__header"
   }, /*#__PURE__*/_react["default"].createElement("span", {
     className: "ncf__light-licence-text"
   }, "Great news!", /*#__PURE__*/_react["default"].createElement("span", {

package/helpers/supportedCountries.js

@@ -4,7 +4,6 @@ const { printRegions } = require('./constants');
 const supportedCountriesMasterList = {
 	cemeaV1: {
 		AUT: 'Austria',
-		ARE: 'United Arab Emirates',
 		BEL: 'Belgium',
 		BGR: 'Bulgaria',
 		HRV: 'Croatia',
@@ -49,7 +48,8 @@ const supportedCountriesMasterList = {
 	other: {
 		GBR: 'United Kingdom',
 		USA: 'United States',
-		CAN: 'Canada'
+		CAN: 'Canada',
+		ARE: 'United Arab Emirates'
 	}
 };
 

package/main.scss

@@ -432,6 +432,12 @@
 		}
 	}
 
+	&__logo {
+		display: block;
+		margin: 0 auto 2rem;
+		width: 40%;
+	}
+
 	@include ncfMessage();
 	@include ncfPackageChange();
 	@include ncfPaymentTerm();

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@financial-times/n-conversion-forms",
-  "version": "27.2.1",
+  "version": "27.2.3",
   "description": "Containing jsx components and styles for forms included on Accounts and Acqusition apps (next-signup, next-profile, next-retention, etc).",
   "main": "dist/index.js",
   "scripts": {