@financial-times/n-conversion-forms 26.0.0 → 27.0.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.
- package/.circleci/config.yml +4 -4
- package/.eslintignore +1 -0
- package/.github/workflows/gh-pages-deploy.yml +1 -0
- package/.storybook/main.js +0 -1
- package/__mocks__/@financial-times/o-expander.js +9 -0
- package/__mocks__/@financial-times/o-forms-input.js +11 -0
- package/__mocks__/@financial-times/o-forms.js +40 -0
- package/build-state/npm-shrinkwrap.json +294 -6334
- package/components/__snapshots__/b2c-partnership-confirmation.spec.js.snap +1 -1
- package/components/__snapshots__/confirmation.spec.js.snap +0 -3
- package/components/__snapshots__/debug.spec.js.snap +25 -13
- package/components/__snapshots__/delivery-postcode.spec.js.snap +1 -1
- package/components/__snapshots__/payment-term.spec.js.snap +1 -1
- package/components/__snapshots__/payment-type.spec.js.snap +19 -0
- package/components/__snapshots__/registration-confirmation.spec.js.snap +230 -74
- package/components/accept-terms.jsx +57 -36
- package/components/accept-terms.stories.js +28 -1
- package/components/b2c-partnership-confirmation.jsx +1 -1
- package/components/confirmation.jsx +15 -8
- package/components/confirmation.spec.js +1 -1
- package/components/debug.jsx +19 -12
- package/components/debug.stories.js +13 -0
- package/components/delivery-address.jsx +21 -58
- package/components/delivery-address.stories.js +7 -0
- package/components/delivery-city.jsx +4 -2
- package/components/delivery-city.stories.js +9 -0
- package/components/delivery-option.jsx +5 -3
- package/components/delivery-option.stories.js +7 -1
- package/components/delivery-postcode.jsx +32 -13
- package/components/delivery-postcode.stories.js +2 -1
- package/components/delivery-security-instructions.spec.js +3 -3
- package/components/graduation-date.spec.js +8 -8
- package/components/index.jsx +1 -1
- package/components/message.jsx +1 -1
- package/components/payment-term.jsx +152 -25
- package/components/payment-term.spec.js +46 -4
- package/components/payment-term.stories.js +69 -14
- package/components/payment-type.jsx +3 -1
- package/components/position.jsx +6 -3
- package/components/position.spec.js +15 -5
- package/components/registration-confirmation.jsx +111 -32
- package/components/responsibility.jsx +6 -3
- package/components/responsibility.spec.js +15 -5
- package/components/text-input.jsx +73 -0
- package/components/text-input.spec.js +118 -0
- package/components/text-input.stories.js +31 -0
- package/dist/accept-terms.js +15 -7
- package/dist/b2c-partnership-confirmation.js +1 -1
- package/dist/confirmation.js +11 -2
- package/dist/debug.js +6 -6
- package/dist/delivery-address.js +19 -32
- package/dist/delivery-city.js +4 -2
- package/dist/delivery-option.js +5 -2
- package/dist/delivery-postcode.js +31 -12
- package/dist/index.js +9 -9
- package/dist/message.js +1 -1
- package/dist/payment-term.js +117 -11
- package/dist/payment-type.js +5 -2
- package/dist/position.js +6 -2
- package/dist/registration-confirmation.js +87 -29
- package/dist/responsibility.js +6 -2
- package/dist/text-input.js +84 -0
- package/helpers/constants.js +7 -0
- package/helpers/deliveryAddressMap.js +167 -0
- package/helpers/index.js +7 -0
- package/helpers/index.spec.js +11 -0
- package/helpers/ncf-common-data.spec.js +34 -0
- package/helpers/ncf-countries.spec.js +136 -0
- package/helpers/supportedCountries.js +76 -0
- package/helpers/supportedPostcodeExamples.js +57 -0
- package/helpers/supportedPostcodeValidators.js +53 -0
- package/helpers/utilities.js +14 -0
- package/jest.config.js +8 -1
- package/main.scss +461 -0
- package/package.json +6 -3
- package/styles/confirmation.scss +122 -0
- package/styles/payment-term.scss +3 -0
- package/utils/app-banner.spec.js +68 -0
- package/utils/apple-pay.spec.js +177 -0
- package/utils/billing-country.spec.js +87 -0
- package/utils/billing-postcode.spec.js +138 -0
- package/utils/company-name.spec.js +3 -7
- package/utils/country.spec.js +87 -0
- package/utils/delivery-address-type.spec.js +24 -11
- package/utils/delivery-option-messages.js +15 -0
- package/utils/delivery-option-messages.spec.js +3 -3
- package/utils/delivery-option.spec.js +100 -15
- package/utils/delivery-postcode.spec.js +138 -0
- package/utils/delivery-start-date.spec.js +177 -0
- package/utils/email.spec.js +210 -0
- package/utils/event-notifier.spec.js +116 -0
- package/utils/form-element.spec.js +71 -0
- package/utils/loader.spec.js +161 -0
- package/utils/password.spec.js +65 -0
- package/utils/payment-term.js +25 -1
- package/utils/payment-term.spec.js +198 -0
- package/utils/payment-type.js +1 -1
- package/utils/payment-type.spec.js +136 -0
- package/utils/postcode.spec.js +122 -0
- package/utils/salesforce.spec.js +30 -0
- package/utils/submit.spec.js +81 -0
- package/utils/tracking.spec.js +174 -0
- package/utils/validation.js +2 -2
- package/utils/validation.spec.js +234 -0
- package/utils/zuora.spec.js +249 -0
- package/components/__snapshots__/b2c-partnership-payment-term.spec.js.snap +0 -193
- package/components/b2c-partnership-payment-term.jsx +0 -126
- package/components/b2c-partnership-payment-term.spec.js +0 -52
- package/components/b2c-partnership-payment-term.stories.js +0 -44
- package/dist/b2c-partnership-payment-term.js +0 -91
- package/styles/b2c-partnership-payment-term.scss +0 -20
|
@@ -1,193 +0,0 @@
|
|
|
1
|
-
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
|
2
|
-
|
|
3
|
-
exports[`B2cPartnershipPaymentTerm render with minimum props required 1`] = `
|
|
4
|
-
<div id="paymentTermField"
|
|
5
|
-
class="o-forms__group ncf__payment-term ncf__b2c-partnership-payment-term"
|
|
6
|
-
>
|
|
7
|
-
<div class="ncf__payment-term__item o-forms-input--radio-round">
|
|
8
|
-
<input type="radio"
|
|
9
|
-
id="299.99"
|
|
10
|
-
name="paymentTerm"
|
|
11
|
-
value="299.99"
|
|
12
|
-
checked
|
|
13
|
-
>
|
|
14
|
-
<label for="299.99"
|
|
15
|
-
class="o-forms-input__label ncf__payment-term__label"
|
|
16
|
-
>
|
|
17
|
-
<span class="ncf__payment-term__title">
|
|
18
|
-
£299.99 - Digital FT + The Washington Post
|
|
19
|
-
</span>
|
|
20
|
-
<div class="ncf__b2c-partnership-payment-term__description">
|
|
21
|
-
<p>
|
|
22
|
-
Includes:
|
|
23
|
-
<br>
|
|
24
|
-
1 year Digital subscription to the Financial Times
|
|
25
|
-
<br>
|
|
26
|
-
90-day All-Access Digital subscription to The Washington Post
|
|
27
|
-
</p>
|
|
28
|
-
</div>
|
|
29
|
-
</label>
|
|
30
|
-
</div>
|
|
31
|
-
<div class="ncf__payment-term__legal">
|
|
32
|
-
<p>
|
|
33
|
-
We will automatically renew your subscription using the payment method provided unless you cancel before your renewal date.
|
|
34
|
-
</p>
|
|
35
|
-
<p>
|
|
36
|
-
We will notify you at least 14 days in advance of any changes to the price in your subscription that would apply upon next renewal. Find out more about our cancellation policy in our
|
|
37
|
-
<a class="ncf__link--external"
|
|
38
|
-
href="https://help.ft.com/help/legal-privacy/terms-conditions/"
|
|
39
|
-
title="FT Legal Terms and Conditions help page"
|
|
40
|
-
target="_blank"
|
|
41
|
-
rel="noopener noreferrer"
|
|
42
|
-
>
|
|
43
|
-
Terms & Conditions
|
|
44
|
-
</a>
|
|
45
|
-
.
|
|
46
|
-
</p>
|
|
47
|
-
</div>
|
|
48
|
-
</div>
|
|
49
|
-
`;
|
|
50
|
-
|
|
51
|
-
exports[`B2cPartnershipPaymentTerm renders with annual option 1`] = `
|
|
52
|
-
<div id="paymentTermField"
|
|
53
|
-
class="o-forms__group ncf__payment-term ncf__b2c-partnership-payment-term"
|
|
54
|
-
>
|
|
55
|
-
<div class="ncf__payment-term__item o-forms-input--radio-round">
|
|
56
|
-
<input type="radio"
|
|
57
|
-
id="annual"
|
|
58
|
-
name="paymentTerm"
|
|
59
|
-
value="annual"
|
|
60
|
-
checked
|
|
61
|
-
>
|
|
62
|
-
<label for="annual"
|
|
63
|
-
class="o-forms-input__label ncf__payment-term__label"
|
|
64
|
-
>
|
|
65
|
-
<span class="ncf__payment-term__title">
|
|
66
|
-
£20.00 - Digital FT + The Washington Post
|
|
67
|
-
</span>
|
|
68
|
-
<div class="ncf__b2c-partnership-payment-term__description">
|
|
69
|
-
<p>
|
|
70
|
-
Includes:
|
|
71
|
-
<br>
|
|
72
|
-
1 year Digital subscription to the Financial Times
|
|
73
|
-
<br>
|
|
74
|
-
90-day All-Access Digital subscription to The Washington Post
|
|
75
|
-
</p>
|
|
76
|
-
</div>
|
|
77
|
-
</label>
|
|
78
|
-
</div>
|
|
79
|
-
<div class="ncf__payment-term__legal">
|
|
80
|
-
<p>
|
|
81
|
-
We will automatically renew your subscription using the payment method provided unless you cancel before your renewal date.
|
|
82
|
-
</p>
|
|
83
|
-
<p>
|
|
84
|
-
We will notify you at least 14 days in advance of any changes to the price in your subscription that would apply upon next renewal. Find out more about our cancellation policy in our
|
|
85
|
-
<a class="ncf__link--external"
|
|
86
|
-
href="https://help.ft.com/help/legal-privacy/terms-conditions/"
|
|
87
|
-
title="FT Legal Terms and Conditions help page"
|
|
88
|
-
target="_blank"
|
|
89
|
-
rel="noopener noreferrer"
|
|
90
|
-
>
|
|
91
|
-
Terms & Conditions
|
|
92
|
-
</a>
|
|
93
|
-
.
|
|
94
|
-
</p>
|
|
95
|
-
</div>
|
|
96
|
-
</div>
|
|
97
|
-
`;
|
|
98
|
-
|
|
99
|
-
exports[`B2cPartnershipPaymentTerm renders with monthly option 1`] = `
|
|
100
|
-
<div id="paymentTermField"
|
|
101
|
-
class="o-forms__group ncf__payment-term ncf__b2c-partnership-payment-term"
|
|
102
|
-
>
|
|
103
|
-
<div class="ncf__payment-term__item o-forms-input--radio-round">
|
|
104
|
-
<input type="radio"
|
|
105
|
-
id="monthly"
|
|
106
|
-
name="paymentTerm"
|
|
107
|
-
value="monthly"
|
|
108
|
-
checked
|
|
109
|
-
>
|
|
110
|
-
<label for="monthly"
|
|
111
|
-
class="o-forms-input__label ncf__payment-term__label"
|
|
112
|
-
>
|
|
113
|
-
<span class="ncf__payment-term__title">
|
|
114
|
-
£20.00 - Digital FT + The Washington Post
|
|
115
|
-
</span>
|
|
116
|
-
<div class="ncf__b2c-partnership-payment-term__description">
|
|
117
|
-
<p>
|
|
118
|
-
Includes:
|
|
119
|
-
<br>
|
|
120
|
-
1 month Digital subscription to the Financial Times
|
|
121
|
-
<br>
|
|
122
|
-
90-day All-Access Digital subscription to The Washington Post
|
|
123
|
-
</p>
|
|
124
|
-
</div>
|
|
125
|
-
</label>
|
|
126
|
-
</div>
|
|
127
|
-
<div class="ncf__payment-term__legal">
|
|
128
|
-
<p>
|
|
129
|
-
We will automatically renew your subscription using the payment method provided unless you cancel before your renewal date.
|
|
130
|
-
</p>
|
|
131
|
-
<p>
|
|
132
|
-
We will notify you at least 14 days in advance of any changes to the price in your subscription that would apply upon next renewal. Find out more about our cancellation policy in our
|
|
133
|
-
<a class="ncf__link--external"
|
|
134
|
-
href="https://help.ft.com/help/legal-privacy/terms-conditions/"
|
|
135
|
-
title="FT Legal Terms and Conditions help page"
|
|
136
|
-
target="_blank"
|
|
137
|
-
rel="noopener noreferrer"
|
|
138
|
-
>
|
|
139
|
-
Terms & Conditions
|
|
140
|
-
</a>
|
|
141
|
-
.
|
|
142
|
-
</p>
|
|
143
|
-
</div>
|
|
144
|
-
</div>
|
|
145
|
-
`;
|
|
146
|
-
|
|
147
|
-
exports[`B2cPartnershipPaymentTerm renders with quarterly option 1`] = `
|
|
148
|
-
<div id="paymentTermField"
|
|
149
|
-
class="o-forms__group ncf__payment-term ncf__b2c-partnership-payment-term"
|
|
150
|
-
>
|
|
151
|
-
<div class="ncf__payment-term__item o-forms-input--radio-round">
|
|
152
|
-
<input type="radio"
|
|
153
|
-
id="quarterly"
|
|
154
|
-
name="paymentTerm"
|
|
155
|
-
value="quarterly"
|
|
156
|
-
checked
|
|
157
|
-
>
|
|
158
|
-
<label for="quarterly"
|
|
159
|
-
class="o-forms-input__label ncf__payment-term__label"
|
|
160
|
-
>
|
|
161
|
-
<span class="ncf__payment-term__title">
|
|
162
|
-
£20.00 - Digital FT + The Washington Post
|
|
163
|
-
</span>
|
|
164
|
-
<div class="ncf__b2c-partnership-payment-term__description">
|
|
165
|
-
<p>
|
|
166
|
-
Includes:
|
|
167
|
-
<br>
|
|
168
|
-
3 month Digital subscription to the Financial Times
|
|
169
|
-
<br>
|
|
170
|
-
90-day All-Access Digital subscription to The Washington Post
|
|
171
|
-
</p>
|
|
172
|
-
</div>
|
|
173
|
-
</label>
|
|
174
|
-
</div>
|
|
175
|
-
<div class="ncf__payment-term__legal">
|
|
176
|
-
<p>
|
|
177
|
-
We will automatically renew your subscription using the payment method provided unless you cancel before your renewal date.
|
|
178
|
-
</p>
|
|
179
|
-
<p>
|
|
180
|
-
We will notify you at least 14 days in advance of any changes to the price in your subscription that would apply upon next renewal. Find out more about our cancellation policy in our
|
|
181
|
-
<a class="ncf__link--external"
|
|
182
|
-
href="https://help.ft.com/help/legal-privacy/terms-conditions/"
|
|
183
|
-
title="FT Legal Terms and Conditions help page"
|
|
184
|
-
target="_blank"
|
|
185
|
-
rel="noopener noreferrer"
|
|
186
|
-
>
|
|
187
|
-
Terms & Conditions
|
|
188
|
-
</a>
|
|
189
|
-
.
|
|
190
|
-
</p>
|
|
191
|
-
</div>
|
|
192
|
-
</div>
|
|
193
|
-
`;
|
|
@@ -1,126 +0,0 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import PropTypes from 'prop-types';
|
|
3
|
-
|
|
4
|
-
export function B2cPartnershipPaymentTerm ({
|
|
5
|
-
fieldId = 'paymentTermField',
|
|
6
|
-
inputName = 'paymentTerm',
|
|
7
|
-
options = [],
|
|
8
|
-
displayName,
|
|
9
|
-
offerType,
|
|
10
|
-
partnerOffer,
|
|
11
|
-
conditions = [],
|
|
12
|
-
}) {
|
|
13
|
-
const durations = {
|
|
14
|
-
annual: '1 year',
|
|
15
|
-
quarterly: '3 month',
|
|
16
|
-
monthly: '1 month',
|
|
17
|
-
};
|
|
18
|
-
|
|
19
|
-
// convert to Title Case
|
|
20
|
-
offerType = offerType
|
|
21
|
-
.split('')
|
|
22
|
-
.map((letter, i) => (i !== 0 ? letter.toLowerCase() : letter.toUpperCase()))
|
|
23
|
-
.join('');
|
|
24
|
-
|
|
25
|
-
return (
|
|
26
|
-
<div
|
|
27
|
-
id={fieldId}
|
|
28
|
-
className="o-forms__group ncf__payment-term ncf__b2c-partnership-payment-term"
|
|
29
|
-
>
|
|
30
|
-
{options.map(
|
|
31
|
-
(option) =>
|
|
32
|
-
option.selected && (
|
|
33
|
-
<div
|
|
34
|
-
className="ncf__payment-term__item o-forms-input--radio-round"
|
|
35
|
-
key={option.value}
|
|
36
|
-
>
|
|
37
|
-
<input
|
|
38
|
-
type="radio"
|
|
39
|
-
id={option.value}
|
|
40
|
-
name={inputName}
|
|
41
|
-
value={option.value}
|
|
42
|
-
defaultChecked={true}
|
|
43
|
-
/>
|
|
44
|
-
<label
|
|
45
|
-
htmlFor={option.value}
|
|
46
|
-
className="o-forms-input__label ncf__payment-term__label"
|
|
47
|
-
>
|
|
48
|
-
<span className="ncf__payment-term__title">
|
|
49
|
-
{option.price} - {displayName}
|
|
50
|
-
</span>
|
|
51
|
-
<div className="ncf__b2c-partnership-payment-term__description">
|
|
52
|
-
<p>
|
|
53
|
-
Includes:
|
|
54
|
-
<br />
|
|
55
|
-
{durations[option.name]} {offerType} subscription to the
|
|
56
|
-
Financial Times
|
|
57
|
-
<br />
|
|
58
|
-
{partnerOffer.duration} {partnerOffer.name} subscription to{' '}
|
|
59
|
-
{partnerOffer.vendor}
|
|
60
|
-
</p>
|
|
61
|
-
{conditions.length > 0 && (
|
|
62
|
-
<p>
|
|
63
|
-
{conditions.map((line) => (
|
|
64
|
-
<>
|
|
65
|
-
{line}
|
|
66
|
-
<br />
|
|
67
|
-
</>
|
|
68
|
-
))}
|
|
69
|
-
</p>
|
|
70
|
-
)}
|
|
71
|
-
</div>
|
|
72
|
-
</label>
|
|
73
|
-
</div>
|
|
74
|
-
)
|
|
75
|
-
)}
|
|
76
|
-
|
|
77
|
-
<div className="ncf__payment-term__legal">
|
|
78
|
-
<p>
|
|
79
|
-
We will automatically renew your subscription using the payment method
|
|
80
|
-
provided unless you cancel before your renewal date.
|
|
81
|
-
</p>
|
|
82
|
-
<p>
|
|
83
|
-
We will notify you at least 14 days in advance of any changes to the
|
|
84
|
-
price in your subscription that would apply upon next renewal. Find
|
|
85
|
-
out more about our cancellation policy in our{' '}
|
|
86
|
-
<a
|
|
87
|
-
className="ncf__link--external"
|
|
88
|
-
href="https://help.ft.com/help/legal-privacy/terms-conditions/"
|
|
89
|
-
title="FT Legal Terms and Conditions help page"
|
|
90
|
-
target="_blank"
|
|
91
|
-
rel="noopener noreferrer"
|
|
92
|
-
>
|
|
93
|
-
Terms & Conditions
|
|
94
|
-
</a>
|
|
95
|
-
.
|
|
96
|
-
</p>
|
|
97
|
-
</div>
|
|
98
|
-
</div>
|
|
99
|
-
);
|
|
100
|
-
}
|
|
101
|
-
|
|
102
|
-
B2cPartnershipPaymentTerm.propTypes = {
|
|
103
|
-
fieldId: PropTypes.string,
|
|
104
|
-
inputName: PropTypes.string,
|
|
105
|
-
options: PropTypes.arrayOf(
|
|
106
|
-
PropTypes.shape({
|
|
107
|
-
discount: PropTypes.string,
|
|
108
|
-
isTrial: PropTypes.bool,
|
|
109
|
-
name: PropTypes.string.isRequired,
|
|
110
|
-
price: PropTypes.string.isRequired,
|
|
111
|
-
selected: PropTypes.bool,
|
|
112
|
-
trialDuration: PropTypes.string,
|
|
113
|
-
trialPrice: PropTypes.string,
|
|
114
|
-
value: PropTypes.string.isRequired,
|
|
115
|
-
monthlyPrice: PropTypes.string,
|
|
116
|
-
})
|
|
117
|
-
).isRequired,
|
|
118
|
-
displayName: PropTypes.string.isRequired,
|
|
119
|
-
partnerOffer: PropTypes.shape({
|
|
120
|
-
duration: PropTypes.string.isRequired,
|
|
121
|
-
name: PropTypes.string.isRequired,
|
|
122
|
-
vendor: PropTypes.string.isRequired,
|
|
123
|
-
}).isRequired,
|
|
124
|
-
conditions: PropTypes.arrayOf(PropTypes.string),
|
|
125
|
-
offerType: PropTypes.string.isRequired,
|
|
126
|
-
};
|
|
@@ -1,52 +0,0 @@
|
|
|
1
|
-
import { B2cPartnershipPaymentTerm } from './index';
|
|
2
|
-
import { expectToRenderCorrectly } from '../test-jest/helpers/expect-to-render-correctly';
|
|
3
|
-
|
|
4
|
-
expect.extend(expectToRenderCorrectly);
|
|
5
|
-
|
|
6
|
-
const defaultProps = {
|
|
7
|
-
displayName: 'Digital FT + The Washington Post',
|
|
8
|
-
partnerOffer: {
|
|
9
|
-
duration: '90-day',
|
|
10
|
-
name: 'All-Access Digital',
|
|
11
|
-
vendor: 'The Washington Post',
|
|
12
|
-
},
|
|
13
|
-
offerType: 'DIGITAL',
|
|
14
|
-
options: [
|
|
15
|
-
{
|
|
16
|
-
name: 'annual',
|
|
17
|
-
price: '£299.99',
|
|
18
|
-
value: 299.99,
|
|
19
|
-
isTrial: false,
|
|
20
|
-
discount: null,
|
|
21
|
-
selected: true,
|
|
22
|
-
},
|
|
23
|
-
],
|
|
24
|
-
};
|
|
25
|
-
|
|
26
|
-
describe('B2cPartnershipPaymentTerm', () => {
|
|
27
|
-
it('render with minimum props required', () => {
|
|
28
|
-
const props = {
|
|
29
|
-
...defaultProps,
|
|
30
|
-
};
|
|
31
|
-
|
|
32
|
-
expect(B2cPartnershipPaymentTerm).toRenderCorrectly(props);
|
|
33
|
-
});
|
|
34
|
-
|
|
35
|
-
['annual', 'quarterly', 'monthly'].forEach((type) => {
|
|
36
|
-
it(`renders with ${type} option`, () => {
|
|
37
|
-
const props = {
|
|
38
|
-
...defaultProps,
|
|
39
|
-
options: [
|
|
40
|
-
{
|
|
41
|
-
name: type,
|
|
42
|
-
value: type,
|
|
43
|
-
price: '£20.00',
|
|
44
|
-
selected: true,
|
|
45
|
-
},
|
|
46
|
-
],
|
|
47
|
-
};
|
|
48
|
-
|
|
49
|
-
expect(B2cPartnershipPaymentTerm).toRenderCorrectly(props);
|
|
50
|
-
});
|
|
51
|
-
});
|
|
52
|
-
});
|
|
@@ -1,44 +0,0 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import { Fieldset } from './fieldset';
|
|
3
|
-
import { B2cPartnershipPaymentTerm } from './b2c-partnership-payment-term';
|
|
4
|
-
|
|
5
|
-
export default {
|
|
6
|
-
title: 'B2C Partnership Payment Term',
|
|
7
|
-
component: B2cPartnershipPaymentTerm,
|
|
8
|
-
};
|
|
9
|
-
|
|
10
|
-
export const Basic = (args) => (
|
|
11
|
-
<Fieldset>
|
|
12
|
-
<B2cPartnershipPaymentTerm {...args} />
|
|
13
|
-
</Fieldset>
|
|
14
|
-
);
|
|
15
|
-
Basic.args = {
|
|
16
|
-
displayName: 'Digital FT + The Washington Post',
|
|
17
|
-
partnerOffer: {
|
|
18
|
-
duration: '90-day',
|
|
19
|
-
name: 'All-Access Digital',
|
|
20
|
-
vendor: 'The Washington Post',
|
|
21
|
-
},
|
|
22
|
-
conditions: [
|
|
23
|
-
'90-day Washington Post subscription must be redeemed by 31 March 2021.',
|
|
24
|
-
],
|
|
25
|
-
offerType: 'DIGITAL',
|
|
26
|
-
options: [
|
|
27
|
-
{
|
|
28
|
-
name: 'monthly',
|
|
29
|
-
price: '£49.99',
|
|
30
|
-
value: 49.99,
|
|
31
|
-
isTrial: false,
|
|
32
|
-
discount: '33%',
|
|
33
|
-
selected: false,
|
|
34
|
-
},
|
|
35
|
-
{
|
|
36
|
-
name: 'annual',
|
|
37
|
-
price: '£299.99',
|
|
38
|
-
value: 299.99,
|
|
39
|
-
isTrial: false,
|
|
40
|
-
discount: null,
|
|
41
|
-
selected: true,
|
|
42
|
-
},
|
|
43
|
-
],
|
|
44
|
-
};
|
|
@@ -1,91 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
-
|
|
5
|
-
Object.defineProperty(exports, "__esModule", {
|
|
6
|
-
value: true
|
|
7
|
-
});
|
|
8
|
-
exports.B2cPartnershipPaymentTerm = B2cPartnershipPaymentTerm;
|
|
9
|
-
|
|
10
|
-
var _react = _interopRequireDefault(require("react"));
|
|
11
|
-
|
|
12
|
-
var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
13
|
-
|
|
14
|
-
function B2cPartnershipPaymentTerm(_ref) {
|
|
15
|
-
var _ref$fieldId = _ref.fieldId,
|
|
16
|
-
fieldId = _ref$fieldId === void 0 ? 'paymentTermField' : _ref$fieldId,
|
|
17
|
-
_ref$inputName = _ref.inputName,
|
|
18
|
-
inputName = _ref$inputName === void 0 ? 'paymentTerm' : _ref$inputName,
|
|
19
|
-
_ref$options = _ref.options,
|
|
20
|
-
options = _ref$options === void 0 ? [] : _ref$options,
|
|
21
|
-
displayName = _ref.displayName,
|
|
22
|
-
offerType = _ref.offerType,
|
|
23
|
-
partnerOffer = _ref.partnerOffer,
|
|
24
|
-
_ref$conditions = _ref.conditions,
|
|
25
|
-
conditions = _ref$conditions === void 0 ? [] : _ref$conditions;
|
|
26
|
-
var durations = {
|
|
27
|
-
annual: '1 year',
|
|
28
|
-
quarterly: '3 month',
|
|
29
|
-
monthly: '1 month'
|
|
30
|
-
}; // convert to Title Case
|
|
31
|
-
|
|
32
|
-
offerType = offerType.split('').map(function (letter, i) {
|
|
33
|
-
return i !== 0 ? letter.toLowerCase() : letter.toUpperCase();
|
|
34
|
-
}).join('');
|
|
35
|
-
return /*#__PURE__*/_react["default"].createElement("div", {
|
|
36
|
-
id: fieldId,
|
|
37
|
-
className: "o-forms__group ncf__payment-term ncf__b2c-partnership-payment-term"
|
|
38
|
-
}, options.map(function (option) {
|
|
39
|
-
return option.selected && /*#__PURE__*/_react["default"].createElement("div", {
|
|
40
|
-
className: "ncf__payment-term__item o-forms-input--radio-round",
|
|
41
|
-
key: option.value
|
|
42
|
-
}, /*#__PURE__*/_react["default"].createElement("input", {
|
|
43
|
-
type: "radio",
|
|
44
|
-
id: option.value,
|
|
45
|
-
name: inputName,
|
|
46
|
-
value: option.value,
|
|
47
|
-
defaultChecked: true
|
|
48
|
-
}), /*#__PURE__*/_react["default"].createElement("label", {
|
|
49
|
-
htmlFor: option.value,
|
|
50
|
-
className: "o-forms-input__label ncf__payment-term__label"
|
|
51
|
-
}, /*#__PURE__*/_react["default"].createElement("span", {
|
|
52
|
-
className: "ncf__payment-term__title"
|
|
53
|
-
}, option.price, " - ", displayName), /*#__PURE__*/_react["default"].createElement("div", {
|
|
54
|
-
className: "ncf__b2c-partnership-payment-term__description"
|
|
55
|
-
}, /*#__PURE__*/_react["default"].createElement("p", null, "Includes:", /*#__PURE__*/_react["default"].createElement("br", null), durations[option.name], " ", offerType, " subscription to the Financial Times", /*#__PURE__*/_react["default"].createElement("br", null), partnerOffer.duration, " ", partnerOffer.name, " subscription to", ' ', partnerOffer.vendor), conditions.length > 0 && /*#__PURE__*/_react["default"].createElement("p", null, conditions.map(function (line) {
|
|
56
|
-
return /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, line, /*#__PURE__*/_react["default"].createElement("br", null));
|
|
57
|
-
})))));
|
|
58
|
-
}), /*#__PURE__*/_react["default"].createElement("div", {
|
|
59
|
-
className: "ncf__payment-term__legal"
|
|
60
|
-
}, /*#__PURE__*/_react["default"].createElement("p", null, "We will automatically renew your subscription using the payment method provided unless you cancel before your renewal date."), /*#__PURE__*/_react["default"].createElement("p", null, "We will notify you at least 14 days in advance of any changes to the price in your subscription that would apply upon next renewal. Find out more about our cancellation policy in our", ' ', /*#__PURE__*/_react["default"].createElement("a", {
|
|
61
|
-
className: "ncf__link--external",
|
|
62
|
-
href: "https://help.ft.com/help/legal-privacy/terms-conditions/",
|
|
63
|
-
title: "FT Legal Terms and Conditions help page",
|
|
64
|
-
target: "_blank",
|
|
65
|
-
rel: "noopener noreferrer"
|
|
66
|
-
}, "Terms & Conditions"), ".")));
|
|
67
|
-
}
|
|
68
|
-
|
|
69
|
-
B2cPartnershipPaymentTerm.propTypes = {
|
|
70
|
-
fieldId: _propTypes["default"].string,
|
|
71
|
-
inputName: _propTypes["default"].string,
|
|
72
|
-
options: _propTypes["default"].arrayOf(_propTypes["default"].shape({
|
|
73
|
-
discount: _propTypes["default"].string,
|
|
74
|
-
isTrial: _propTypes["default"].bool,
|
|
75
|
-
name: _propTypes["default"].string.isRequired,
|
|
76
|
-
price: _propTypes["default"].string.isRequired,
|
|
77
|
-
selected: _propTypes["default"].bool,
|
|
78
|
-
trialDuration: _propTypes["default"].string,
|
|
79
|
-
trialPrice: _propTypes["default"].string,
|
|
80
|
-
value: _propTypes["default"].string.isRequired,
|
|
81
|
-
monthlyPrice: _propTypes["default"].string
|
|
82
|
-
})).isRequired,
|
|
83
|
-
displayName: _propTypes["default"].string.isRequired,
|
|
84
|
-
partnerOffer: _propTypes["default"].shape({
|
|
85
|
-
duration: _propTypes["default"].string.isRequired,
|
|
86
|
-
name: _propTypes["default"].string.isRequired,
|
|
87
|
-
vendor: _propTypes["default"].string.isRequired
|
|
88
|
-
}).isRequired,
|
|
89
|
-
conditions: _propTypes["default"].arrayOf(_propTypes["default"].string),
|
|
90
|
-
offerType: _propTypes["default"].string.isRequired
|
|
91
|
-
};
|
|
@@ -1,20 +0,0 @@
|
|
|
1
|
-
@mixin ncfB2cPartnershipPaymentTerm() {
|
|
2
|
-
&__b2c-partnership-payment-term {
|
|
3
|
-
&__description {
|
|
4
|
-
font-size: 15px;
|
|
5
|
-
|
|
6
|
-
p:first-child {
|
|
7
|
-
margin-top: 0;
|
|
8
|
-
}
|
|
9
|
-
p:last-child {
|
|
10
|
-
margin-bottom: 0;
|
|
11
|
-
}
|
|
12
|
-
}
|
|
13
|
-
|
|
14
|
-
// hide radio button
|
|
15
|
-
.o-forms-input--radio-round .o-forms-input__label:after,
|
|
16
|
-
.o-forms-input--radio-round .o-forms-input__label:before {
|
|
17
|
-
content: none;
|
|
18
|
-
}
|
|
19
|
-
}
|
|
20
|
-
}
|