@financial-times/n-conversion-forms
Version:
Containing jsx components and styles for forms included on Accounts and Acquisition apps (next-signup, next-profile, next-retention, etc).
73 lines (72 loc) • 4.56 kB
JSX
"use strict";
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.AcceptTermsBusiness = AcceptTermsBusiness;
var _react = _interopRequireDefault(require("react"));
var _propTypes = _interopRequireDefault(require("prop-types"));
var _classnames = _interopRequireDefault(require("classnames"));
function AcceptTermsBusiness(_ref) {
var _ref$hasError = _ref.hasError,
hasError = _ref$hasError === void 0 ? false : _ref$hasError,
_ref$isB2b = _ref.isB2b,
isB2b = _ref$isB2b === void 0 ? false : _ref$isB2b,
_ref$isEmbedded = _ref.isEmbedded,
isEmbedded = _ref$isEmbedded === void 0 ? false : _ref$isEmbedded,
_ref$isTrial = _ref.isTrial,
isTrial = _ref$isTrial === void 0 ? false : _ref$isTrial;
var divProps = {
id: 'acceptTermsField',
className: 'o-forms-field o-layout-typography ncf__validation-error',
'data-validate': 'required,checked'
};
var labelClassName = (0, _classnames["default"])(['o-forms-input', 'o-forms-input--checkbox', {
'o-forms-input--invalid': hasError
}]);
var inputProps = {
id: 'termsAcceptance',
type: 'checkbox',
name: 'termsAcceptance',
value: 'true',
'data-trackable': 'field-terms',
'aria-required': 'true',
required: true
};
var b2bTerms = isB2b ? /*#__PURE__*/_react["default"].createElement("li", null, /*#__PURE__*/_react["default"].createElement("span", {
className: "terms-b2b"
}, "By submitting this form, you indicate your consent to also being contacted by Financial Times by email, post, or phone about our other products, services or special offers unless you untick this box.")) : /*#__PURE__*/_react["default"].createElement("li", null, /*#__PURE__*/_react["default"].createElement("span", {
className: "terms-default o3-type-body-base"
}, "I confirm I am 16 years or older and have read and agree to the", ' ', /*#__PURE__*/_react["default"].createElement("a", {
href: "http://help.ft.com/help/legal-privacy/terms-conditions/",
target: isEmbedded ? '_top' : '_blank',
rel: "noopener noreferrer",
"data-trackable": "terms-and-conditions"
}, "Terms & Conditions"), "."));
var corpSignupTerms = /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement("li", null, /*#__PURE__*/_react["default"].createElement("span", {
className: "terms-corp-signup"
}, "Your organisation\u2019s administrator(s) may view basic usage and profile data about your account and have the ability to set up myFT topic follows on your behalf.")), /*#__PURE__*/_react["default"].createElement("li", null, /*#__PURE__*/_react["default"].createElement("span", {
className: "terms-corp-signup"
}, "Basic usage and profile data about your account can include; for example, your job title and profile information, the date you last visited, volume of content consumed, etc.")), /*#__PURE__*/_react["default"].createElement("li", null, /*#__PURE__*/_react["default"].createElement("span", {
className: "terms-corp-signup"
}, "myFT topics may be selected on your behalf by your company administrator or FT representative for you to follow. You can unfollow these topics or unsubscribe from the myFT digest through the Contact preferences section on myFT.")), isTrial && /*#__PURE__*/_react["default"].createElement("li", null, /*#__PURE__*/_react["default"].createElement("span", {
className: "terms-corp-signup"
}, "This trial is to demonstrate the value of a group subscription and we\u2019ll contact you during your trial.")));
return /*#__PURE__*/_react["default"].createElement("div", divProps, /*#__PURE__*/_react["default"].createElement("ul", {
className: "ncf__accept-terms-list"
}, b2bTerms, corpSignupTerms), /*#__PURE__*/_react["default"].createElement("label", {
className: labelClassName,
htmlFor: "termsAcceptance"
}, /*#__PURE__*/_react["default"].createElement("input", inputProps), /*#__PURE__*/_react["default"].createElement("span", {
className: "o-forms-input__label"
}, "I agree to the above terms & conditions."), /*#__PURE__*/_react["default"].createElement("p", {
className: "o-forms-input__error"
}, "Please accept our terms & conditions")));
}
AcceptTermsBusiness.propTypes = {
hasError: _propTypes["default"].bool,
isChecked: _propTypes["default"].bool,
isB2b: _propTypes["default"].bool,
isEmbedded: _propTypes["default"].bool,
isTrial: _propTypes["default"].bool
};