@financial-times/n-conversion-forms 27.2.2 → 27.3.1

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__/licence-header.spec.js.snap +6 -6
  2. package/components/__snapshots__/licence-title.spec.js.snap +4 -4
  3. package/components/delivery-city.jsx +4 -1
  4. package/components/licence-header.jsx +6 -0
  5. package/components/licence-title.jsx +3 -5
  6. package/dist/delivery-city.js +4 -2
  7. package/dist/licence-header.js +8 -1
  8. package/dist/licence-title.js +3 -3
  9. package/helpers/supportedCountries.js +2 -2
  10. package/main.scss +6 -0
  11. package/package.json +1 -1
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/delivery-city.jsx CHANGED
@@ -20,8 +20,11 @@ export function DeliveryCity ({
20
20
  GBR: 'e.g. Bath',
21
21
  USA: 'e.g. Los Angeles',
22
22
  CAN: 'e.g. Montreal',
23
+ ARE: 'e.g. Dubai'
23
24
  };
24
25
 
26
+ const inputLabel = country === 'ARE'? 'Emirate or City':'City';
27
+
25
28
  return (
26
29
  <label
27
30
  id="deliveryCityField"
@@ -30,7 +33,7 @@ export function DeliveryCity ({
30
33
  htmlFor="deliveryCity"
31
34
  >
32
35
  <span className="o-forms-title">
33
- <span className="o-forms-title__main">City</span>
36
+ <span className="o-forms-title__main">{inputLabel}</span>
34
37
  </span>
35
38
  <span className={inputWrapperClassName}>
36
39
  <input
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/delivery-city.js CHANGED
@@ -30,8 +30,10 @@ function DeliveryCity(_ref) {
30
30
  var inputPlaceholder = {
31
31
  GBR: 'e.g. Bath',
32
32
  USA: 'e.g. Los Angeles',
33
- CAN: 'e.g. Montreal'
33
+ CAN: 'e.g. Montreal',
34
+ ARE: 'e.g. Dubai'
34
35
  };
36
+ var inputLabel = country === 'ARE' ? 'Emirate or City' : 'City';
35
37
  return /*#__PURE__*/_react["default"].createElement("label", {
36
38
  id: "deliveryCityField",
37
39
  className: "o-forms-field ncf__validation-error",
@@ -41,7 +43,7 @@ function DeliveryCity(_ref) {
41
43
  className: "o-forms-title"
42
44
  }, /*#__PURE__*/_react["default"].createElement("span", {
43
45
  className: "o-forms-title__main"
44
- }, "City")), /*#__PURE__*/_react["default"].createElement("span", {
46
+ }, inputLabel)), /*#__PURE__*/_react["default"].createElement("span", {
45
47
  className: inputWrapperClassName
46
48
  }, /*#__PURE__*/_react["default"].createElement("input", {
47
49
  type: "text",
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/helpers/supportedCountries.js CHANGED
@@ -4,7 +4,6 @@ const { printRegions } = require('./constants');
4
4
  const supportedCountriesMasterList = {
5
5
  cemeaV1: {
6
6
  AUT: 'Austria',
7
- ARE: 'United Arab Emirates',
8
7
  BEL: 'Belgium',
9
8
  BGR: 'Bulgaria',
10
9
  HRV: 'Croatia',
@@ -49,7 +48,8 @@ const supportedCountriesMasterList = {
49
48
  other: {
50
49
  GBR: 'United Kingdom',
51
50
  USA: 'United States',
52
- CAN: 'Canada'
51
+ CAN: 'Canada',
52
+ ARE: 'United Arab Emirates'
53
53
  }
54
54
  };
55
55
 
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.2",
3
+ "version": "27.3.1",
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": {