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

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (11) hide show
  1. package/components/__snapshots__/b2c-partnership-confirmation.spec.js.snap +1 -1
  2. package/components/__snapshots__/licence-header.spec.js.snap +6 -6
  3. package/components/__snapshots__/licence-title.spec.js.snap +4 -4
  4. package/components/b2c-partnership-confirmation.jsx +1 -1
  5. package/components/licence-header.jsx +6 -0
  6. package/components/licence-title.jsx +3 -5
  7. package/dist/b2c-partnership-confirmation.js +1 -1
  8. package/dist/licence-header.js +8 -1
  9. package/dist/licence-title.js +3 -3
  10. package/main.scss +6 -0
  11. package/package.json +1 -1
package/components/__snapshots__/b2c-partnership-confirmation.spec.js.snap CHANGED
@@ -7,7 +7,7 @@ exports[`B2CPartnershipConfirmation renders as default 1`] = `
7
7
  </div>
8
8
  <div class="ncf__paragraph">
9
9
  <h1 class="ncf__header ncf__header--confirmation">
10
- Welcome to your 30 days&#x27; Premium access
10
+ Welcome to your Premium access
11
11
  </h1>
12
12
  </div>
13
13
  </div>
package/components/__snapshots__/licence-header.spec.js.snap CHANGED
@@ -1,19 +1,19 @@
1
1
  // Jest Snapshot v1, https://goo.gl/fbAQLP
2
2
 
3
3
  exports[`LicenceHeader renders if is isB2cPartnershipLicence 1`] = `
4
- <h1 class="ncf__header ncf__center">
4
+ <h1 class="ncf__header">
5
5
  Welcome to the Financial Times
6
6
  </h1>
7
7
  `;
8
8
 
9
9
  exports[`LicenceHeader renders if is trial 1`] = `
10
- <h1 class="ncf__header ncf__center">
10
+ <h1 class="ncf__header">
11
11
  Welcome to the Financial Times
12
12
  </h1>
13
13
  `;
14
14
 
15
15
  exports[`LicenceHeader renders if url is defined 1`] = `
16
- <h1 class="ncf__header ncf__center">
16
+ <h1 class="ncf__header">
17
17
  Join your FT.com subscription
18
18
  </h1>
19
19
  <div class="ncf__center">
@@ -31,7 +31,7 @@ exports[`LicenceHeader renders if url is defined 1`] = `
31
31
  `;
32
32
 
33
33
  exports[`LicenceHeader renders with custom display name 1`] = `
34
- <h1 class="ncf__header ncf__center">
34
+ <h1 class="ncf__header">
35
35
  <span class="ncf__light-licence-text">
36
36
  Great news!
37
37
  <span class="ncf__bold-licence-text">
@@ -60,7 +60,7 @@ exports[`LicenceHeader renders with custom display name 1`] = `
60
60
  `;
61
61
 
62
62
  exports[`LicenceHeader renders with custom welcome text (that requires escaping, e.g. ampersand) 1`] = `
63
- <h1 class="ncf__header ncf__center">
63
+ <h1 class="ncf__header">
64
64
  Join your FT.com subscription
65
65
  </h1>
66
66
  <div class="ncf__center">
@@ -74,7 +74,7 @@ exports[`LicenceHeader renders with custom welcome text (that requires escaping,
74
74
  `;
75
75
 
76
76
  exports[`LicenceHeader renders with default props 1`] = `
77
- <h1 class="ncf__header ncf__center">
77
+ <h1 class="ncf__header">
78
78
  Join your FT.com subscription
79
79
  </h1>
80
80
  <div class="ncf__center">
package/components/__snapshots__/licence-title.spec.js.snap CHANGED
@@ -1,19 +1,19 @@
1
1
  // Jest Snapshot v1, https://goo.gl/fbAQLP
2
2
 
3
3
  exports[`LicenceTitle renders if is isB2cPartnershipLicence 1`] = `
4
- <h1 class="ncf__header ncf__center">
4
+ <h1 class="ncf__header">
5
5
  Welcome to the Financial Times
6
6
  </h1>
7
7
  `;
8
8
 
9
9
  exports[`LicenceTitle renders if is trial 1`] = `
10
- <h1 class="ncf__header ncf__center">
10
+ <h1 class="ncf__header">
11
11
  Welcome to the Financial Times
12
12
  </h1>
13
13
  `;
14
14
 
15
15
  exports[`LicenceTitle renders with custom display name 1`] = `
16
- <h1 class="ncf__header ncf__center">
16
+ <h1 class="ncf__header">
17
17
  <span class="ncf__light-licence-text">
18
18
  Great news!
19
19
  <span class="ncf__bold-licence-text">
@@ -29,7 +29,7 @@ exports[`LicenceTitle renders with custom display name 1`] = `
29
29
  `;
30
30
 
31
31
  exports[`LicenceTitle renders with default props 1`] = `
32
- <h1 class="ncf__header ncf__center">
32
+ <h1 class="ncf__header">
33
33
  Join your FT.com subscription
34
34
  </h1>
35
35
  `;
package/components/b2c-partnership-confirmation.jsx CHANGED
@@ -19,7 +19,7 @@ export function B2CPartnershipConfirmation ({ ctaElement = null }) {
19
19
  <div className="ncf__paragraph">
20
20
  {
21
21
  <h1 className="ncf__header ncf__header--confirmation">
22
- {'Welcome to your 30 days\' Premium access'}
22
+ {'Welcome to your Premium access'}
23
23
  </h1>
24
24
  }
25
25
  </div>
package/components/licence-header.jsx CHANGED
@@ -6,6 +6,7 @@ import { LicenceTitle } from './licence-title';
6
6
  export function LicenceHeader (props) {
7
7
  const {
8
8
  displayName = '',
9
+ logoUrl = '',
9
10
  isTrial = false,
10
11
  isB2cPartnershipLicence = false,
11
12
  welcomeText = '',
@@ -17,6 +18,10 @@ export function LicenceHeader (props) {
17
18
 
18
19
  return (
19
20
  <React.Fragment>
21
+ {Boolean(logoUrl) && (
22
+ <img className="ncf__logo" alt="logo" src={logoUrl}/>
23
+ )}
24
+
20
25
  <LicenceTitle
21
26
  displayName={displayName}
22
27
  isTrial={isTrial}
@@ -34,6 +39,7 @@ export function LicenceHeader (props) {
34
39
 
35
40
  LicenceHeader.propTypes = {
36
41
  displayName: PropTypes.string,
42
+ logoUrl: PropTypes.string,
37
43
  isTrial: PropTypes.bool,
38
44
  welcomeText: PropTypes.string,
39
45
  isB2cPartnershipLicence: PropTypes.bool,
package/components/licence-title.jsx CHANGED
@@ -8,7 +8,7 @@ export function LicenceTitle ({
8
8
  }) {
9
9
  if (isB2cPartnershipLicence || isTrial) {
10
10
  return (
11
- <h1 className="ncf__header ncf__center">
11
+ <h1 className="ncf__header">
12
12
  {displayName || 'Welcome to the Financial Times'}
13
13
  </h1>
14
14
  );
@@ -20,13 +20,11 @@ export function LicenceTitle ({
20
20
 
21
21
  function renderB2BTitle (displayName) {
22
22
  if (!displayName) {
23
- return (
24
- <h1 className="ncf__header ncf__center">Join your FT.com subscription</h1>
25
- );
23
+ return <h1 className="ncf__header">Join your FT.com subscription</h1>;
26
24
  }
27
25
 
28
26
  return (
29
- <h1 className="ncf__header ncf__center">
27
+ <h1 className="ncf__header">
30
28
  <span className="ncf__light-licence-text">
31
29
  Great news!
32
30
  <span className="ncf__bold-licence-text"> {displayName} </span>
package/dist/b2c-partnership-confirmation.js CHANGED
@@ -32,7 +32,7 @@ function B2CPartnershipConfirmation(_ref) {
32
32
  className: "ncf__paragraph"
33
33
  }, /*#__PURE__*/_react["default"].createElement("h1", {
34
34
  className: "ncf__header ncf__header--confirmation"
35
- }, 'Welcome to your 30 days\' Premium access'))), /*#__PURE__*/_react["default"].createElement("p", {
35
+ }, 'Welcome to your Premium access'))), /*#__PURE__*/_react["default"].createElement("p", {
36
36
  className: "ncf__paragraph"
37
37
  }, "Please check your email to confirm your account and set your password."), /*#__PURE__*/_react["default"].createElement("p", {
38
38
  className: "ncf__paragraph"
package/dist/licence-header.js CHANGED
@@ -18,6 +18,8 @@ var _licenceTitle = require("./licence-title");
18
18
  function LicenceHeader(props) {
19
19
  var _props$displayName = props.displayName,
20
20
  displayName = _props$displayName === void 0 ? '' : _props$displayName,
21
+ _props$logoUrl = props.logoUrl,
22
+ logoUrl = _props$logoUrl === void 0 ? '' : _props$logoUrl,
21
23
  _props$isTrial = props.isTrial,
22
24
  isTrial = _props$isTrial === void 0 ? false : _props$isTrial,
23
25
  _props$isB2cPartnersh = props.isB2cPartnershipLicence,
@@ -33,7 +35,11 @@ function LicenceHeader(props) {
33
35
  };
34
36
  }
35
37
 
36
- return /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement(_licenceTitle.LicenceTitle, {
38
+ return /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, Boolean(logoUrl) && /*#__PURE__*/_react["default"].createElement("img", {
39
+ className: "ncf__logo",
40
+ alt: "logo",
41
+ src: logoUrl
42
+ }), /*#__PURE__*/_react["default"].createElement(_licenceTitle.LicenceTitle, {
37
43
  displayName: displayName,
38
44
  isTrial: isTrial,
39
45
  isB2cPartnershipLicence: isB2cPartnershipLicence
@@ -47,6 +53,7 @@ function LicenceHeader(props) {
47
53
 
48
54
  LicenceHeader.propTypes = {
49
55
  displayName: _propTypes["default"].string,
56
+ logoUrl: _propTypes["default"].string,
50
57
  isTrial: _propTypes["default"].bool,
51
58
  welcomeText: _propTypes["default"].string,
52
59
  isB2cPartnershipLicence: _propTypes["default"].bool,
package/dist/licence-title.js CHANGED
@@ -21,7 +21,7 @@ function LicenceTitle(_ref) {
21
21
 
22
22
  if (isB2cPartnershipLicence || isTrial) {
23
23
  return /*#__PURE__*/_react["default"].createElement("h1", {
24
- className: "ncf__header ncf__center"
24
+ className: "ncf__header"
25
25
  }, displayName || 'Welcome to the Financial Times');
26
26
  }
27
27
 
@@ -33,12 +33,12 @@ function LicenceTitle(_ref) {
33
33
  function renderB2BTitle(displayName) {
34
34
  if (!displayName) {
35
35
  return /*#__PURE__*/_react["default"].createElement("h1", {
36
- className: "ncf__header ncf__center"
36
+ className: "ncf__header"
37
37
  }, "Join your FT.com subscription");
38
38
  }
39
39
 
40
40
  return /*#__PURE__*/_react["default"].createElement("h1", {
41
- className: "ncf__header ncf__center"
41
+ className: "ncf__header"
42
42
  }, /*#__PURE__*/_react["default"].createElement("span", {
43
43
  className: "ncf__light-licence-text"
44
44
  }, "Great news!", /*#__PURE__*/_react["default"].createElement("span", {
package/main.scss CHANGED
@@ -432,6 +432,12 @@
432
432
  }
433
433
  }
434
434
 
435
+ &__logo {
436
+ display: block;
437
+ margin: 0 auto 2rem;
438
+ width: 40%;
439
+ }
440
+
435
441
  @include ncfMessage();
436
442
  @include ncfPackageChange();
437
443
  @include ncfPaymentTerm();
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@financial-times/n-conversion-forms",
3
- "version": "27.2.1",
3
+ "version": "27.3.0",
4
4
  "description": "Containing jsx components and styles for forms included on Accounts and Acqusition apps (next-signup, next-profile, next-retention, etc).",
5
5
  "main": "dist/index.js",
6
6
  "scripts": {