@financial-times/n-conversion-forms 31.0.1 → 31.0.3

package/dist/accept-terms.jsx

@@ -0,0 +1,217 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.AcceptTerms = AcceptTerms;
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var _react = _interopRequireDefault(require("react"));
+var _propTypes = _interopRequireDefault(require("prop-types"));
+var _classnames = _interopRequireDefault(require("classnames"));
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2["default"])(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+var DEFAULT_AGE_RESTRICTION = '16';
+var DEFAULT_PRIVACY_POLICIES_POSITION = 'top';
+function AcceptTerms(_ref) {
+  var _ref$withPrivacyPolic = _ref.withPrivacyPolicyTerms,
+    withPrivacyPolicyTerms = _ref$withPrivacyPolic === void 0 ? false : _ref$withPrivacyPolic,
+    _ref$hasError = _ref.hasError,
+    hasError = _ref$hasError === void 0 ? false : _ref$hasError,
+    _ref$isSignup = _ref.isSignup,
+    isSignup = _ref$isSignup === void 0 ? false : _ref$isSignup,
+    _ref$isChecked = _ref.isChecked,
+    isChecked = _ref$isChecked === void 0 ? false : _ref$isChecked,
+    _ref$isB2b = _ref.isB2b,
+    isB2b = _ref$isB2b === void 0 ? false : _ref$isB2b,
+    _ref$isB2cPartnership = _ref.isB2cPartnership,
+    isB2cPartnership = _ref$isB2cPartnership === void 0 ? false : _ref$isB2cPartnership,
+    _ref$ageRestriction = _ref.ageRestriction,
+    ageRestriction = _ref$ageRestriction === void 0 ? DEFAULT_AGE_RESTRICTION : _ref$ageRestriction,
+    _ref$isEmbedded = _ref.isEmbedded,
+    isEmbedded = _ref$isEmbedded === void 0 ? false : _ref$isEmbedded,
+    _ref$isCorpSignup = _ref.isCorpSignup,
+    isCorpSignup = _ref$isCorpSignup === void 0 ? false : _ref$isCorpSignup,
+    _ref$isTrial = _ref.isTrial,
+    isTrial = _ref$isTrial === void 0 ? false : _ref$isTrial,
+    _ref$isTransition = _ref.isTransition,
+    isTransition = _ref$isTransition === void 0 ? false : _ref$isTransition,
+    _ref$transitionType = _ref.transitionType,
+    transitionType = _ref$transitionType === void 0 ? null : _ref$transitionType,
+    _ref$isPrintProduct = _ref.isPrintProduct,
+    isPrintProduct = _ref$isPrintProduct === void 0 ? false : _ref$isPrintProduct,
+    _ref$isSingleTerm = _ref.isSingleTerm,
+    isSingleTerm = _ref$isSingleTerm === void 0 ? false : _ref$isSingleTerm,
+    _ref$isDeferredBillin = _ref.isDeferredBilling,
+    isDeferredBilling = _ref$isDeferredBillin === void 0 ? false : _ref$isDeferredBillin,
+    _ref$hideConfirmTerms = _ref.hideConfirmTermsAndConditions,
+    hideConfirmTermsAndConditions = _ref$hideConfirmTerms === void 0 ? false : _ref$hideConfirmTerms,
+    children = _ref.children,
+    _ref$privacyPoliciesP = _ref.privacyPoliciesPosition,
+    privacyPoliciesPosition = _ref$privacyPoliciesP === void 0 ? DEFAULT_PRIVACY_POLICIES_POSITION : _ref$privacyPoliciesP;
+  var divProps = _objectSpread({
+    id: 'acceptTermsField',
+    className: 'o-forms-field o-layout-typography ncf__validation-error',
+    'data-validate': 'required,checked'
+  }, isSignup && {
+    'data-trackable': 'sign-up-terms'
+  });
+  var labelClassName = (0, _classnames["default"])(['o-forms-input', 'o-forms-input--checkbox', {
+    'o-forms-input--invalid': hasError
+  }]);
+  var inputProps = _objectSpread({
+    id: 'termsAcceptance',
+    type: 'checkbox',
+    name: 'termsAcceptance',
+    value: 'true',
+    'data-trackable': 'field-terms',
+    'aria-required': 'true',
+    required: true
+  }, isChecked && {
+    defaultChecked: true
+  });
+  var privacyPolicyTerms = /*#__PURE__*/_react["default"].createElement("div", {
+    className: "privacy-policy-terms"
+  }, /*#__PURE__*/_react["default"].createElement("span", {
+    className: "consent-text--".concat(privacyPoliciesPosition)
+  }, "For more information about how we use your data, please refer to our", ' ', /*#__PURE__*/_react["default"].createElement("a", {
+    className: "ncf__link--external",
+    href: "https://help.ft.com/legal-privacy/privacy-policy/",
+    target: "_blank",
+    rel: "noopener noreferrer",
+    "data-trackable": "privacy-policy-info"
+  }, "privacy"), ' ', "and\xA0", /*#__PURE__*/_react["default"].createElement("a", {
+    className: "ncf__link--external",
+    href: "https://help.ft.com/legal-privacy/cookies/",
+    target: "_blank",
+    rel: "noopener noreferrer",
+    "data-trackable": "cookies-info"
+  }, "cookie"), ' ', "policies."), !hideConfirmTermsAndConditions && /*#__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 confirm that I am ", ageRestriction, " years or older and agree to the full", ' ', /*#__PURE__*/_react["default"].createElement("a", {
+    className: "ncf__link--external",
+    href: "http://help.ft.com/help/legal-privacy/terms-conditions/",
+    target: isEmbedded ? '_top' : '_blank',
+    rel: "noopener noreferrer",
+    "data-trackable": "terms-and-conditions"
+  }, "Terms & Conditions"), "."), /*#__PURE__*/_react["default"].createElement("p", {
+    className: "o-forms-input__error"
+  }, "Please accept our terms & conditions")), children && /*#__PURE__*/_react["default"].createElement("div", {
+    className: "children-container"
+  }, children));
+  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"
+  }, "I confirm I am ", ageRestriction, " years or older and have read and agree to the", ' ', /*#__PURE__*/_react["default"].createElement("a", {
+    className: "ncf__link--external",
+    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 = isCorpSignup && /*#__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.")));
+  var transitionTerms = isTransition && /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, !isSingleTerm && /*#__PURE__*/_react["default"].createElement("li", null, /*#__PURE__*/_react["default"].createElement("span", {
+    className: "terms-transition"
+  }, "I give consent for my chosen payment method to be charged automatically at the end of each subscription term until I cancel it by contacting", ' ', /*#__PURE__*/_react["default"].createElement("a", {
+    className: "ncf__link--external",
+    href: "https://help.ft.com/help/contact-us/",
+    target: "_blank",
+    rel: "noopener noreferrer"
+  }, "customer care through chat, phone or email"), ".")), transitionType === 'immediate' ? /*#__PURE__*/_react["default"].createElement("li", null, /*#__PURE__*/_react["default"].createElement("span", {
+    className: "terms-transition terms-transition--immediate"
+  }, "By placing my order, my subscription will start immediately and I am aware and agree that I will therefore lose my statutory right to cancel my subscription within 14 days of acceptance of my order. Any notice of cancellation that I provide will only take effect at the end of my subscription period and previously paid amounts are non-refundable, except in the event that there is a fault in the provision of the services.")) : /*#__PURE__*/_react["default"].createElement("li", null, /*#__PURE__*/_react["default"].createElement("span", {
+    className: "terms-transition terms-transition--other"
+  }, "By placing my order, I acknowledge that my subscription will start", isSingleTerm ? ' and the chosen payment method will be charged ' : ' ', "on the date given above. Any cancellation notice received after that date will take effect at the end of my subscription term and previously paid amounts are non-refundable.")), /*#__PURE__*/_react["default"].createElement("li", null, /*#__PURE__*/_react["default"].createElement("span", {
+    className: "terms-transition"
+  }, "Find out more about our cancellation policy in our", ' ', /*#__PURE__*/_react["default"].createElement("a", {
+    className: "ncf__link--external",
+    href: "http://help.ft.com/help/legal-privacy/terms-conditions/",
+    target: "_blank",
+    rel: "noopener noreferrer"
+  }, "Terms & Conditions"), ".")));
+  var printSignupTermText = isTrial ? 'Credits for delivery suspension or delivery failure are not available during introductory offer periods.' : 'Credit for delivery suspensions is only available for hand-delivered subscriptions and is limited to a maximum of 24 issues per yearly subscription terms (4 issues per yearly FT Weekend subscription term).';
+  var signupTerms = isSignup && /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, isPrintProduct ? /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement("li", null, /*#__PURE__*/_react["default"].createElement("span", {
+    className: "terms-print"
+  }, printSignupTermText)), /*#__PURE__*/_react["default"].createElement("li", null, /*#__PURE__*/_react["default"].createElement("span", {
+    className: "terms-print"
+  }, "Find out more about your delivery start date in our", ' ', /*#__PURE__*/_react["default"].createElement("a", {
+    className: "ncf__link--external",
+    href: "http://help.ft.com/help/legal-privacy/terms-conditions/",
+    target: isEmbedded ? '_top' : '_blank',
+    rel: "noopener noreferrer"
+  }, "Terms & Conditions"), "."))) : /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement("li", null, /*#__PURE__*/_react["default"].createElement("span", {
+    className: "terms-signup"
+  }, "I give consent for my chosen payment method to be charged automatically at the end of each subscription term until I cancel it by contacting", ' ', /*#__PURE__*/_react["default"].createElement("a", {
+    className: "ncf__link--external",
+    href: "https://help.ft.com/help/contact-us/",
+    target: isEmbedded ? '_top' : '_blank',
+    rel: "noopener noreferrer"
+  }, "customer care through chat, phone or email"), ".")), /*#__PURE__*/_react["default"].createElement("li", null, /*#__PURE__*/_react["default"].createElement("span", {
+    className: "terms-signup"
+  }, "By placing my order, my subscription will start immediately and I am aware and agree that I will therefore lose my statutory right to cancel my subscription within 14 days of acceptance of my order. Any notice of cancellation that I provide will only take effect at the end of my subscription period and previously paid amounts are non-refundable, except in the event that there is a fault in the provision of the services.")), /*#__PURE__*/_react["default"].createElement("li", null, /*#__PURE__*/_react["default"].createElement("span", {
+    className: "terms-signup"
+  }, "Find out more about our cancellation policy in our", ' ', /*#__PURE__*/_react["default"].createElement("a", {
+    className: "ncf__link--external",
+    href: "https://help.ft.com/legal-privacy/terms-and-conditions/",
+    target: isEmbedded ? '_top' : '_blank',
+    rel: "noopener noreferrer"
+  }, "Terms & Conditions"), "."))));
+  var deferredBillingTerms = isDeferredBilling && /*#__PURE__*/_react["default"].createElement("li", null, /*#__PURE__*/_react["default"].createElement("span", {
+    className: "terms-deferred"
+  }, "Please note if you fail to make payment for your deferred billing plan within due date your subscription will be automatically cancelled."));
+  var b2cPartnershipTerms = /*#__PURE__*/_react["default"].createElement("label", {
+    className: [labelClassName, 'checkbox-two-lines'].join(' ')
+  }, /*#__PURE__*/_react["default"].createElement("input", inputProps), /*#__PURE__*/_react["default"].createElement("span", {
+    className: "o-forms-input__label"
+  }, "I confirm I am ", ageRestriction, " years or older and have read and agree to the", ' ', /*#__PURE__*/_react["default"].createElement("a", {
+    className: "ncf__link--external",
+    href: "http://help.ft.com/help/legal-privacy/terms-conditions/",
+    target: isEmbedded ? '_top' : '_blank',
+    rel: "noopener noreferrer",
+    "data-trackable": "terms-and-conditions"
+  }, "Terms & Conditions"), "."), /*#__PURE__*/_react["default"].createElement("p", {
+    className: "o-forms-input__error"
+  }, "Please accept our terms & conditions"));
+  return /*#__PURE__*/_react["default"].createElement("div", divProps, isB2cPartnership ? b2cPartnershipTerms : withPrivacyPolicyTerms ? privacyPolicyTerms : /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement("ul", {
+    className: "o-typography-list ncf__accept-terms-list"
+  }, b2bTerms, corpSignupTerms, transitionTerms, signupTerms, deferredBillingTerms), /*#__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"))));
+}
+AcceptTerms.propTypes = {
+  withPrivacyPolicyTerms: _propTypes["default"].bool,
+  hasError: _propTypes["default"].bool,
+  isSignup: _propTypes["default"].bool,
+  isChecked: _propTypes["default"].bool,
+  isB2b: _propTypes["default"].bool,
+  isB2cPartnership: _propTypes["default"].bool,
+  ageRestriction: _propTypes["default"].string,
+  isEmbedded: _propTypes["default"].bool,
+  isCorpSignup: _propTypes["default"].bool,
+  isTrial: _propTypes["default"].bool,
+  isTransition: _propTypes["default"].bool,
+  transitionType: _propTypes["default"].string,
+  isPrintProduct: _propTypes["default"].bool,
+  isSingleTerm: _propTypes["default"].bool,
+  isDeferredBilling: _propTypes["default"].bool,
+  hideConfirmTermsAndConditions: _propTypes["default"].bool,
+  children: _propTypes["default"].oneOfType([_propTypes["default"].arrayOf(_propTypes["default"].node), _propTypes["default"].node]),
+  privacyPoliciesPosition: _propTypes["default"].oneOf(['top', 'bottom'])
+};

package/dist/app-banner.jsx

@@ -0,0 +1,51 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.AppBanner = AppBanner;
+var _react = _interopRequireDefault(require("react"));
+function AppBanner() {
+  return /*#__PURE__*/_react["default"].createElement("div", {
+    id: "appBanner",
+    className: "ncf ncf__app-banner"
+  }, /*#__PURE__*/_react["default"].createElement("div", {
+    className: "ncf__app-banner-inner"
+  }, /*#__PURE__*/_react["default"].createElement("div", {
+    className: "ncf__app-banner-image"
+  }, /*#__PURE__*/_react["default"].createElement("img", {
+    alt: "FT app",
+    src: "https://www.ft.com/__origami/service/image/v2/images/raw/https://ft-next-assets-prod.s3-eu-west-1.amazonaws.com/assets/product/republishing-app-packshot-191107.png?source=ip-envoy"
+  })), /*#__PURE__*/_react["default"].createElement("div", {
+    className: "ncf__app-banner-content"
+  }, /*#__PURE__*/_react["default"].createElement("div", {
+    className: "ncf__app-banner-header"
+  }, "Get our free App"), "Download the ", /*#__PURE__*/_react["default"].createElement("span", {
+    className: "ncf__app-banner-strong"
+  }, "FT app"), " to access articles on the move."), /*#__PURE__*/_react["default"].createElement("div", {
+    className: "ncf__app-banner-actions"
+  }, /*#__PURE__*/_react["default"].createElement("div", {
+    className: "ncf__app-banner-action ncf__app-banner-action--ios"
+  }, /*#__PURE__*/_react["default"].createElement("a", {
+    href: "https://itunes.apple.com/app/apple-store/id1200842933?pt=246269&ct=onsite-app-promotion&mt=8",
+    target: "_blank",
+    role: "link",
+    rel: "noreferrer"
+  }, /*#__PURE__*/_react["default"].createElement("img", {
+    src: "https://www.ft.com/__assets/creatives/tour/apps/ios-download.svg",
+    alt: "Download from the iOS App store",
+    height: "35"
+  }))), /*#__PURE__*/_react["default"].createElement("div", {
+    className: "ncf__app-banner-action ncf__app-banner-action--android"
+  }, /*#__PURE__*/_react["default"].createElement("a", {
+    href: "https://play.google.com/store/apps/details?id=com.ft.news&referrer=utm_source%3Donsite-app-promotion%26utm_campaign%3DOnsite%2520Messaging",
+    target: "_blank",
+    role: "link",
+    rel: "noreferrer"
+  }, /*#__PURE__*/_react["default"].createElement("img", {
+    src: "https://www.ft.com/__origami/service/image/v2/images/raw/https%253A%252F%252Fwww.ft.com%252F__assets%252Fcreatives%252Ftour%252Fapps%252Fgoogle-play-badge-3x.png?source=ip-envoy",
+    height: "35",
+    alt: "Download on Google Play"
+  }))))));
+}

package/dist/b2c-partnership-confirmation.jsx

@@ -0,0 +1,64 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.B2CPartnershipConfirmation = B2CPartnershipConfirmation;
+var _react = _interopRequireDefault(require("react"));
+var _propTypes = _interopRequireDefault(require("prop-types"));
+var productCodeMapping = {
+  P1: 'Standard',
+  P2: 'Premium',
+  EP: 'ePaper'
+};
+function B2CPartnershipConfirmation(_ref) {
+  var _ref$ctaElement = _ref.ctaElement,
+    ctaElement = _ref$ctaElement === void 0 ? null : _ref$ctaElement,
+    _ref$productCode = _ref.productCode,
+    productCode = _ref$productCode === void 0 ? null : _ref$productCode;
+  var readingLinkProps = {
+    href: '/',
+    className: 'ncf__link'
+  };
+  var customerCareProps = {
+    href: 'https://help.ft.com/',
+    className: 'ncf__link'
+  };
+
+  // Welcome to your Standard access
+  // Welcome to your Premium access
+  // Welcome to your ePaper access
+  // Welcome to your FT access (default)
+  var accessType = productCodeMapping[productCode === null || productCode === void 0 ? void 0 : productCode.toUpperCase()] || 'FT';
+  return /*#__PURE__*/_react["default"].createElement("div", {
+    className: "ncf ncf__wrapper"
+  }, /*#__PURE__*/_react["default"].createElement("div", {
+    className: "ncf__center"
+  }, /*#__PURE__*/_react["default"].createElement("div", {
+    className: "ncf__icon ncf__icon--tick ncf__icon--large"
+  }), /*#__PURE__*/_react["default"].createElement("div", {
+    className: "ncf__paragraph"
+  }, /*#__PURE__*/_react["default"].createElement("h1", {
+    className: "ncf__header ncf__header--confirmation"
+  }, "Welcome to your ".concat(accessType, " 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"
+  }, "Explore the homepage & enjoy your unlimited access & exclusive content."), ctaElement || /*#__PURE__*/_react["default"].createElement("p", {
+    className: "ncf__paragraph ncf__center"
+  }, /*#__PURE__*/_react["default"].createElement("a", {
+    className: "ncf__button ncf__button--submit",
+    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("p", {
+    className: "ncf__paragraph"
+  }, /*#__PURE__*/_react["default"].createElement("div", {
+    className: "ncf__strong"
+  }, "Can we help?"), "For any queries about your Premium subscription please", ' ', /*#__PURE__*/_react["default"].createElement("a", customerCareProps, "contact Customer Care"), "."));
+}
+B2CPartnershipConfirmation.propTypes = {
+  ctaElement: _propTypes["default"].node,
+  productCode: _propTypes["default"].string
+};

package/dist/billing-city.jsx

@@ -0,0 +1,58 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.BillingCity = BillingCity;
+var _react = _interopRequireDefault(require("react"));
+var _propTypes = _interopRequireDefault(require("prop-types"));
+var _classnames = _interopRequireDefault(require("classnames"));
+function BillingCity(_ref) {
+  var _ref$hasError = _ref.hasError,
+    hasError = _ref$hasError === void 0 ? false : _ref$hasError,
+    _ref$value = _ref.value,
+    value = _ref$value === void 0 ? '' : _ref$value,
+    _ref$isDisabled = _ref.isDisabled,
+    isDisabled = _ref$isDisabled === void 0 ? false : _ref$isDisabled,
+    _ref$isHidden = _ref.isHidden,
+    isHidden = _ref$isHidden === void 0 ? false : _ref$isHidden;
+  var billingCityFieldClassNames = (0, _classnames["default"])(['o-forms-field', 'ncf__validation-error', {
+    ncf__hidden: isHidden
+  }]);
+  var inputWrapperClassName = (0, _classnames["default"])(['o-forms-input', 'o-forms-input--text', {
+    'o-forms-input--invalid': hasError
+  }]);
+  return /*#__PURE__*/_react["default"].createElement("label", {
+    id: "billingCityField",
+    className: billingCityFieldClassNames,
+    "data-validate": "required",
+    htmlFor: "billingCity"
+  }, /*#__PURE__*/_react["default"].createElement("span", {
+    className: "o-forms-title"
+  }, /*#__PURE__*/_react["default"].createElement("span", {
+    className: "o-forms-title__main"
+  }, "Billing city/town")), /*#__PURE__*/_react["default"].createElement("span", {
+    className: inputWrapperClassName
+  }, /*#__PURE__*/_react["default"].createElement("input", {
+    type: "text",
+    id: "billingCity",
+    name: "billingCity",
+    "data-trackable": "field-billingCity",
+    autoComplete: "address-level2",
+    placeholder: "e.g. Bath",
+    maxLength: 40,
+    "aria-required": "true",
+    required: true,
+    disabled: isDisabled,
+    defaultValue: value
+  }), /*#__PURE__*/_react["default"].createElement("span", {
+    className: "o-forms-input__error"
+  }, "Please enter a valid city or town")));
+}
+BillingCity.propTypes = {
+  hasError: _propTypes["default"].bool,
+  value: _propTypes["default"].string,
+  isDisabled: _propTypes["default"].bool,
+  isHidden: _propTypes["default"].bool
+};

package/dist/billing-country.jsx

@@ -0,0 +1,43 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.BillingCountry = BillingCountry;
+var _react = _interopRequireDefault(require("react"));
+var _propTypes = _interopRequireDefault(require("prop-types"));
+var _country = require("./country");
+function BillingCountry(_ref) {
+  var _ref$fieldId = _ref.fieldId,
+    fieldId = _ref$fieldId === void 0 ? 'billingCountryField' : _ref$fieldId,
+    _ref$filterList = _ref.filterList,
+    filterList = _ref$filterList === void 0 ? [] : _ref$filterList,
+    _ref$hasError = _ref.hasError,
+    hasError = _ref$hasError === void 0 ? false : _ref$hasError,
+    _ref$inputId = _ref.inputId,
+    inputId = _ref$inputId === void 0 ? 'billingCountry' : _ref$inputId,
+    _ref$isDisabled = _ref.isDisabled,
+    isDisabled = _ref$isDisabled === void 0 ? false : _ref$isDisabled,
+    value = _ref.value;
+  return /*#__PURE__*/_react["default"].createElement(_country.Country, {
+    dataTrackable: "field-billing-country",
+    fieldId: fieldId,
+    filterList: filterList,
+    hasError: hasError,
+    inputId: inputId,
+    isB2b: false,
+    isDisabled: isDisabled,
+    isPlaceholderDisabled: true,
+    label: "Billing Country",
+    value: value
+  });
+}
+BillingCountry.propTypes = {
+  fieldId: _propTypes["default"].string,
+  filterList: _propTypes["default"].arrayOf(_propTypes["default"].string),
+  hasError: _propTypes["default"].bool,
+  inputId: _propTypes["default"].string,
+  isDisabled: _propTypes["default"].bool,
+  value: _propTypes["default"].string
+};

package/dist/billing-postcode.jsx

@@ -0,0 +1,76 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.BillingPostcode = BillingPostcode;
+var _react = _interopRequireDefault(require("react"));
+var _propTypes = _interopRequireDefault(require("prop-types"));
+var _classnames = _interopRequireDefault(require("classnames"));
+function BillingPostcode(_ref) {
+  var postcodeReference = _ref.postcodeReference,
+    _ref$value = _ref.value,
+    value = _ref$value === void 0 ? '' : _ref$value,
+    _ref$pattern = _ref.pattern,
+    pattern = _ref$pattern === void 0 ? null : _ref$pattern,
+    _ref$isDisabled = _ref.isDisabled,
+    isDisabled = _ref$isDisabled === void 0 ? false : _ref$isDisabled,
+    _ref$hasError = _ref.hasError,
+    hasError = _ref$hasError === void 0 ? false : _ref$hasError,
+    _ref$isHidden = _ref.isHidden,
+    isHidden = _ref$isHidden === void 0 ? false : _ref$isHidden,
+    _ref$fieldId = _ref.fieldId,
+    fieldId = _ref$fieldId === void 0 ? 'billingPostcodeField' : _ref$fieldId,
+    _ref$inputId = _ref.inputId,
+    inputId = _ref$inputId === void 0 ? 'billingPostcode' : _ref$inputId,
+    _ref$inputName = _ref.inputName,
+    inputName = _ref$inputName === void 0 ? 'billingPostcode' : _ref$inputName;
+  var BillingPostcodeFieldClassNames = (0, _classnames["default"])(['o-forms-field', {
+    ncf__hidden: isHidden
+  }]);
+  var inputWrapperClassNames = (0, _classnames["default"])(['o-forms-input', 'o-forms-input--text', {
+    'o-forms-input--invalid': hasError
+  }]);
+  return /*#__PURE__*/_react["default"].createElement("label", {
+    id: fieldId,
+    className: BillingPostcodeFieldClassNames,
+    "data-validate": "required",
+    htmlFor: inputId
+  }, /*#__PURE__*/_react["default"].createElement("span", {
+    className: "o-forms-title"
+  }, /*#__PURE__*/_react["default"].createElement("span", {
+    className: "o-forms-title__main"
+  }, "Billing ", /*#__PURE__*/_react["default"].createElement("span", {
+    "data-reference": "postcode"
+  }, postcodeReference))), /*#__PURE__*/_react["default"].createElement("span", {
+    className: inputWrapperClassNames
+  }, /*#__PURE__*/_react["default"].createElement("input", {
+    type: "text",
+    id: inputId,
+    name: inputName,
+    defaultValue: value,
+    placeholder: "Enter your ".concat(postcodeReference),
+    autoComplete: "postal-code",
+    "data-trackable": "billing-postcode",
+    "aria-required": "true",
+    required: true,
+    pattern: pattern,
+    disabled: isDisabled
+  }), /*#__PURE__*/_react["default"].createElement("span", {
+    className: "o-forms-input__error"
+  }, "Please enter a valid", ' ', /*#__PURE__*/_react["default"].createElement("span", {
+    "data-reference": "postcode"
+  }, postcodeReference), ".")));
+}
+BillingPostcode.propTypes = {
+  postcodeReference: _propTypes["default"].string.isRequired,
+  value: _propTypes["default"].string,
+  pattern: _propTypes["default"].string,
+  isDisabled: _propTypes["default"].bool,
+  hasError: _propTypes["default"].bool,
+  isHidden: _propTypes["default"].bool,
+  fieldId: _propTypes["default"].string,
+  inputId: _propTypes["default"].string,
+  inputName: _propTypes["default"].string
+};

package/dist/company-name.jsx

@@ -0,0 +1,78 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.CompanyName = CompanyName;
+var _react = _interopRequireDefault(require("react"));
+var _propTypes = _interopRequireDefault(require("prop-types"));
+var _classnames = _interopRequireDefault(require("classnames"));
+function CompanyName(_ref) {
+  var _ref$fieldId = _ref.fieldId,
+    fieldId = _ref$fieldId === void 0 ? 'companyNameField' : _ref$fieldId,
+    _ref$hasError = _ref.hasError,
+    hasError = _ref$hasError === void 0 ? false : _ref$hasError,
+    _ref$inputId = _ref.inputId,
+    inputId = _ref$inputId === void 0 ? 'companyName' : _ref$inputId,
+    _ref$inputName = _ref.inputName,
+    inputName = _ref$inputName === void 0 ? 'company' : _ref$inputName,
+    _ref$value = _ref.value,
+    value = _ref$value === void 0 ? '' : _ref$value,
+    _ref$isDisabled = _ref.isDisabled,
+    isDisabled = _ref$isDisabled === void 0 ? false : _ref$isDisabled,
+    _ref$fieldLabel = _ref.fieldLabel,
+    fieldLabel = _ref$fieldLabel === void 0 ? 'Company name' : _ref$fieldLabel,
+    _ref$placeholder = _ref.placeholder,
+    placeholder = _ref$placeholder === void 0 ? 'Please enter your company name' : _ref$placeholder,
+    _ref$isRequired = _ref.isRequired,
+    isRequired = _ref$isRequired === void 0 ? true : _ref$isRequired,
+    _ref$isHidden = _ref.isHidden,
+    isHidden = _ref$isHidden === void 0 ? false : _ref$isHidden,
+    _ref$maxlength = _ref.maxlength,
+    maxlength = _ref$maxlength === void 0 ? 100 : _ref$maxlength;
+  var divClassNames = (0, _classnames["default"])(['o-forms-field', {
+    'o-forms-field--optional': !isRequired
+  }, {
+    ncf__hidden: isHidden
+  }]);
+  var inputWrapperClassNames = (0, _classnames["default"])(['o-forms-input', 'o-forms-input--text', {
+    'o-forms-input--invalid': hasError
+  }]);
+  var inputProps = {
+    type: 'text',
+    id: inputId,
+    name: inputName,
+    placeholder: placeholder,
+    autoComplete: 'organization',
+    'data-trackable': 'company-name',
+    'aria-required': isRequired,
+    required: isRequired,
+    disabled: isDisabled,
+    defaultValue: value,
+    maxlength: maxlength
+  };
+  return /*#__PURE__*/_react["default"].createElement("label", {
+    id: fieldId,
+    className: divClassNames,
+    "data-validate": "required",
+    htmlFor: inputProps.id
+  }, /*#__PURE__*/_react["default"].createElement("span", {
+    className: "o-forms-title"
+  }, /*#__PURE__*/_react["default"].createElement("span", {
+    className: "o-forms-title__main"
+  }, fieldLabel)), /*#__PURE__*/_react["default"].createElement("span", {
+    className: inputWrapperClassNames
+  }, /*#__PURE__*/_react["default"].createElement("input", inputProps), /*#__PURE__*/_react["default"].createElement("span", {
+    className: "o-forms-input__error"
+  }, "Please enter your company name.")));
+}
+CompanyName.propTypes = {
+  hasError: _propTypes["default"].bool,
+  value: _propTypes["default"].string,
+  isDisabled: _propTypes["default"].bool,
+  fieldLabel: _propTypes["default"].string,
+  isRequired: _propTypes["default"].bool,
+  isHidden: _propTypes["default"].bool,
+  maxlength: _propTypes["default"].number
+};