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

package/dist/delivery-security-instructions.jsx

@@ -0,0 +1,72 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.DeliverySecurityInstructions = DeliverySecurityInstructions;
+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; }
+function DeliverySecurityInstructions(_ref) {
+  var _ref$fieldId = _ref.fieldId,
+    fieldId = _ref$fieldId === void 0 ? 'deliverySecurityInstructionsField' : _ref$fieldId,
+    _ref$hasError = _ref.hasError,
+    hasError = _ref$hasError === void 0 ? false : _ref$hasError,
+    _ref$inputId = _ref.inputId,
+    inputId = _ref$inputId === void 0 ? 'deliverySecurityInstructions' : _ref$inputId,
+    _ref$maxlength = _ref.maxlength,
+    maxlength = _ref$maxlength === void 0 ? null : _ref$maxlength,
+    _ref$rows = _ref.rows,
+    rows = _ref$rows === void 0 ? null : _ref$rows,
+    _ref$isDisabled = _ref.isDisabled,
+    isDisabled = _ref$isDisabled === void 0 ? false : _ref$isDisabled,
+    _ref$placeholder = _ref.placeholder,
+    placeholder = _ref$placeholder === void 0 ? '' : _ref$placeholder,
+    _ref$value = _ref.value,
+    value = _ref$value === void 0 ? '' : _ref$value;
+  var textAreaWrapperClassNames = (0, _classnames["default"])(['o-forms-input', 'o-forms-input--textarea', {
+    'o-forms-input--invalid': hasError
+  }]);
+  var defaultPlaceholder = 'Please enter any secure information here, e.g. security gate access codes';
+  var textAreaProps = _objectSpread(_objectSpread(_objectSpread({
+    id: inputId,
+    name: inputId
+  }, maxlength && {
+    maxLength: maxlength
+  }), rows && {
+    rows: rows
+  }), {}, {
+    'data-trackable': 'field-deliverySecurityInstructions',
+    placeholder: placeholder ? placeholder : defaultPlaceholder,
+    disabled: isDisabled,
+    defaultValue: value
+  });
+  return /*#__PURE__*/_react["default"].createElement("label", {
+    id: fieldId,
+    className: "o-forms-field o-forms-field--optional",
+    "data-validate": "required",
+    htmlFor: inputId
+  }, /*#__PURE__*/_react["default"].createElement("span", {
+    className: "o-forms-title"
+  }, /*#__PURE__*/_react["default"].createElement("span", {
+    className: "o-forms-title__main"
+  }, "Security instructions")), /*#__PURE__*/_react["default"].createElement("span", {
+    className: textAreaWrapperClassNames
+  }, /*#__PURE__*/_react["default"].createElement("textarea", textAreaProps)), /*#__PURE__*/_react["default"].createElement("span", {
+    className: "additional-field-information"
+  }, "NB. Details supplied here will not appear on packaging."));
+}
+DeliverySecurityInstructions.propTypes = {
+  fieldId: _propTypes["default"].string,
+  hasError: _propTypes["default"].bool,
+  inputId: _propTypes["default"].string,
+  maxlength: _propTypes["default"].number,
+  rows: _propTypes["default"].number,
+  isDisabled: _propTypes["default"].bool,
+  value: _propTypes["default"].string,
+  placeholder: _propTypes["default"].string
+};

package/dist/delivery-start-date.jsx

@@ -0,0 +1,77 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.DeliveryStartDate = DeliveryStartDate;
+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; }
+function DeliveryStartDate(_ref) {
+  var _ref$hasError = _ref.hasError,
+    hasError = _ref$hasError === void 0 ? false : _ref$hasError,
+    _ref$date = _ref.date,
+    date = _ref$date === void 0 ? '' : _ref$date,
+    _ref$value = _ref.value,
+    value = _ref$value === void 0 ? '' : _ref$value,
+    _ref$min = _ref.min,
+    min = _ref$min === void 0 ? null : _ref$min,
+    _ref$max = _ref.max,
+    max = _ref$max === void 0 ? null : _ref$max,
+    _ref$isDisabled = _ref.isDisabled,
+    isDisabled = _ref$isDisabled === void 0 ? false : _ref$isDisabled,
+    _ref$isAddressUpdate = _ref.isAddressUpdate,
+    isAddressUpdate = _ref$isAddressUpdate === void 0 ? false : _ref$isAddressUpdate;
+  var inputWrapperClassNames = (0, _classnames["default"])(['o-forms-input', 'o-forms-input--text', {
+    'o-forms-input--invalid': hasError
+  }]);
+  var inputProps = _objectSpread(_objectSpread(_objectSpread({
+    type: 'date',
+    id: 'deliveryStartDate',
+    name: 'deliveryStartDate'
+  }, min && {
+    min: min
+  }), max && {
+    max: max
+  }), {}, {
+    'data-trackable': 'field-deliveryStartDate',
+    'aria-required': 'true',
+    required: true,
+    disabled: isDisabled,
+    defaultValue: value
+  });
+  var startMessage = isAddressUpdate ? 'We’ll start delivering to this address from:' : 'Your print subscription will start from:';
+  return /*#__PURE__*/_react["default"].createElement("label", {
+    id: "deliveryStartDateField",
+    className: "o-forms-field ncf__validation-error",
+    "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",
+    id: "start-date-picker-title-span"
+  }, "Delivery start date"), /*#__PURE__*/_react["default"].createElement("span", {
+    className: "o-forms-title__prompt"
+  }, "Earliest available delivery date: ", date)), /*#__PURE__*/_react["default"].createElement("span", {
+    className: inputWrapperClassNames
+  }, /*#__PURE__*/_react["default"].createElement("input", inputProps), /*#__PURE__*/_react["default"].createElement("span", {
+    className: "o-forms-input__error"
+  }, "Please select a valid start date")), /*#__PURE__*/_react["default"].createElement("p", null, startMessage, " ", /*#__PURE__*/_react["default"].createElement("strong", {
+    className: "js-start-date-text"
+  }, date)));
+}
+DeliveryStartDate.propTypes = {
+  hasError: _propTypes["default"].bool,
+  date: _propTypes["default"].node,
+  // could be a string or a component that formats the string
+  value: _propTypes["default"].string,
+  min: _propTypes["default"].string,
+  max: _propTypes["default"].string,
+  isDisabled: _propTypes["default"].bool,
+  isAddressUpdate: _propTypes["default"].bool
+};

package/dist/education-job-title.jsx

@@ -0,0 +1,67 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.EducationJobTitle = EducationJobTitle;
+var _react = _interopRequireDefault(require("react"));
+var _propTypes = _interopRequireDefault(require("prop-types"));
+var _classnames = _interopRequireDefault(require("classnames"));
+function EducationJobTitle(_ref) {
+  var _ref$value = _ref.value,
+    value = _ref$value === void 0 ? '' : _ref$value,
+    _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$fieldId = _ref.fieldId,
+    fieldId = _ref$fieldId === void 0 ? 'jobTitleField' : _ref$fieldId,
+    _ref$inputId = _ref.inputId,
+    inputId = _ref$inputId === void 0 ? 'jobTitle' : _ref$inputId,
+    _ref$inputName = _ref.inputName,
+    inputName = _ref$inputName === void 0 ? 'jobTitle' : _ref$inputName,
+    _ref$isUSContract = _ref.isUSContract,
+    isUSContract = _ref$isUSContract === void 0 ? false : _ref$isUSContract;
+  var inputWrapperClassName = (0, _classnames["default"])(['o-forms-input', 'o-forms-input--select', {
+    'o-forms-input--invalid': hasError
+  }]);
+  var availableJobTitles = ['Faculty/Other'].concat(isUSContract ? ['Graduate Student', 'Undergraduate Student'] : ['Student']);
+  return /*#__PURE__*/_react["default"].createElement("label", {
+    id: fieldId,
+    className: "o-forms-field",
+    "data-validate": "required",
+    htmlFor: inputId
+  }, /*#__PURE__*/_react["default"].createElement("span", {
+    className: "o-forms-title"
+  }, /*#__PURE__*/_react["default"].createElement("span", {
+    className: "o-forms-title__main"
+  }, "Occupation")), /*#__PURE__*/_react["default"].createElement("span", {
+    className: inputWrapperClassName
+  }, /*#__PURE__*/_react["default"].createElement("select", {
+    id: inputId,
+    name: inputName,
+    "data-trackable": "job-title",
+    "aria-required": "true",
+    required: true,
+    disabled: isDisabled,
+    defaultValue: value
+  }, /*#__PURE__*/_react["default"].createElement("option", {
+    value: ""
+  }, "Select your occupation"), availableJobTitles.map(function (jobTitle, index) {
+    return /*#__PURE__*/_react["default"].createElement("option", {
+      key: index
+    }, jobTitle);
+  })), /*#__PURE__*/_react["default"].createElement("span", {
+    className: "o-forms-input__error"
+  }, "Please enter your occupation.")));
+}
+EducationJobTitle.propTypes = {
+  value: _propTypes["default"].string,
+  isDisabled: _propTypes["default"].bool,
+  hasError: _propTypes["default"].bool,
+  fieldId: _propTypes["default"].string,
+  inputId: _propTypes["default"].string,
+  inputName: _propTypes["default"].string,
+  isUSContract: _propTypes["default"].bool
+};

package/dist/email.jsx

@@ -0,0 +1,90 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.Email = Email;
+var _react = _interopRequireDefault(require("react"));
+var _propTypes = _interopRequireDefault(require("prop-types"));
+var _classnames = _interopRequireDefault(require("classnames"));
+function Email(_ref) {
+  var _ref$dataTrackable = _ref.dataTrackable,
+    dataTrackable = _ref$dataTrackable === void 0 ? 'field-email' : _ref$dataTrackable,
+    _ref$description = _ref.description,
+    description = _ref$description === void 0 ? 'Please enter an email address' : _ref$description,
+    _ref$errorText = _ref.errorText,
+    errorText = _ref$errorText === void 0 ? 'This email address is not valid' : _ref$errorText,
+    _ref$fieldId = _ref.fieldId,
+    fieldId = _ref$fieldId === void 0 ? 'emailField' : _ref$fieldId,
+    _ref$hasError = _ref.hasError,
+    hasError = _ref$hasError === void 0 ? false : _ref$hasError,
+    _ref$inputId = _ref.inputId,
+    inputId = _ref$inputId === void 0 ? 'email' : _ref$inputId,
+    _ref$isB2b = _ref.isB2b,
+    isB2b = _ref$isB2b === void 0 ? false : _ref$isB2b,
+    _ref$isDisabled = _ref.isDisabled,
+    isDisabled = _ref$isDisabled === void 0 ? false : _ref$isDisabled,
+    _ref$label = _ref.label,
+    label = _ref$label === void 0 ? '' : _ref$label,
+    _ref$placeHolder = _ref.placeHolder,
+    placeHolder = _ref$placeHolder === void 0 ? 'Enter your email address' : _ref$placeHolder,
+    _ref$value = _ref.value,
+    value = _ref$value === void 0 ? '' : _ref$value,
+    _ref$isEducationalLic = _ref.isEducationalLicence,
+    isEducationalLicence = _ref$isEducationalLic === void 0 ? false : _ref$isEducationalLic,
+    _ref$isB2cPartnership = _ref.isB2cPartnershipLicence,
+    isB2cPartnershipLicence = _ref$isB2cPartnership === void 0 ? false : _ref$isB2cPartnership,
+    _ref$showTitle = _ref.showTitle,
+    showTitle = _ref$showTitle === void 0 ? true : _ref$showTitle;
+  var labelText = label || (isB2b && !(isEducationalLicence || isB2cPartnershipLicence) ? 'Work email address' : 'Email address');
+  var inputWrapperClassNames = (0, _classnames["default"])(['o-forms-input', 'o-forms-input--text', {
+    'o-forms-input--invalid': hasError
+  }]);
+  var emailTitleClassNames = (0, _classnames["default"])(['o-forms-title', {
+    ncf__hidden: !showTitle
+  }]);
+  return /*#__PURE__*/_react["default"].createElement("label", {
+    id: fieldId,
+    className: "o-forms-field ncf__validation-error",
+    "data-validate": "required,email",
+    htmlFor: inputId
+  }, /*#__PURE__*/_react["default"].createElement("span", {
+    className: emailTitleClassNames
+  }, /*#__PURE__*/_react["default"].createElement("span", {
+    className: "o-forms-title__main"
+  }, labelText), description && /*#__PURE__*/_react["default"].createElement("span", {
+    className: "o-forms-title__prompt"
+  }, description)), /*#__PURE__*/_react["default"].createElement("span", {
+    className: inputWrapperClassNames
+  }, /*#__PURE__*/_react["default"].createElement("input", {
+    type: "email",
+    id: inputId,
+    name: inputId,
+    placeholder: placeHolder,
+    autoComplete: "email",
+    "data-trackable": dataTrackable,
+    "aria-required": "true",
+    required: true,
+    disabled: isDisabled,
+    defaultValue: value
+  }), /*#__PURE__*/_react["default"].createElement("span", {
+    className: "o-forms-input__error"
+  }, errorText)));
+}
+Email.propTypes = {
+  dataTrackable: _propTypes["default"].string,
+  description: _propTypes["default"].string,
+  errorText: _propTypes["default"].string,
+  fieldId: _propTypes["default"].string,
+  hasError: _propTypes["default"].bool,
+  inputId: _propTypes["default"].string,
+  isB2b: _propTypes["default"].bool,
+  isDisabled: _propTypes["default"].bool,
+  label: _propTypes["default"].string,
+  placeHolder: _propTypes["default"].string,
+  value: _propTypes["default"].string,
+  isEducationalLicence: _propTypes["default"].bool,
+  isB2cPartnershipLicence: _propTypes["default"].bool,
+  showTitle: _propTypes["default"].bool
+};

package/dist/error-page.jsx

@@ -0,0 +1,45 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.ErrorPage = ErrorPage;
+var _react = _interopRequireDefault(require("react"));
+var _propTypes = _interopRequireDefault(require("prop-types"));
+function ErrorPage(_ref) {
+  var children = _ref.children,
+    _ref$header = _ref.header,
+    header = _ref$header === void 0 ? 'Sorry, something went wrong' : _ref$header,
+    _ref$message = _ref.message,
+    message = _ref$message === void 0 ? 'Speak to our Customer Care team now so we can help.' : _ref$message;
+  return /*#__PURE__*/_react["default"].createElement("div", {
+    className: "ncf__wrapper ncf__center ncf__error-page"
+  }, /*#__PURE__*/_react["default"].createElement("div", {
+    className: "ncf__icon ncf__icon--error ncf__icon--large"
+  }), /*#__PURE__*/_react["default"].createElement("div", {
+    className: "ncf__paragraph"
+  }, /*#__PURE__*/_react["default"].createElement("h1", {
+    className: "ncf__header"
+  }, header), /*#__PURE__*/_react["default"].createElement("p", {
+    id: "error-message"
+  }, message)), /*#__PURE__*/_react["default"].createElement("div", {
+    className: "ncf__error-page__content"
+  }, children), /*#__PURE__*/_react["default"].createElement("div", {
+    className: "ncf__paragraph"
+  }, /*#__PURE__*/_react["default"].createElement("p", null, "International Toll Free Number"), /*#__PURE__*/_react["default"].createElement("a", {
+    id: "error-international-number",
+    className: "ncf__header ncf__link",
+    href: "tel:+80007056477"
+  }, "+ 800 0705 6477")), /*#__PURE__*/_react["default"].createElement("div", {
+    className: "ncf__paragraph"
+  }, /*#__PURE__*/_react["default"].createElement("a", {
+    className: "ncf__link",
+    href: "https://help.ft.com/help/contact-us/"
+  }, "Find a local phone number")));
+}
+ErrorPage.propTypes = {
+  children: _propTypes["default"].oneOfType([_propTypes["default"].arrayOf(_propTypes["default"].node), _propTypes["default"].node]),
+  header: _propTypes["default"].string,
+  message: _propTypes["default"].string
+};

package/dist/fieldset.jsx

@@ -0,0 +1,58 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.Fieldset = Fieldset;
+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; }
+function Fieldset(_ref) {
+  var _ref$children = _ref.children,
+    children = _ref$children === void 0 ? null : _ref$children,
+    _ref$name = _ref.name,
+    name = _ref$name === void 0 ? null : _ref$name,
+    _ref$legend = _ref.legend,
+    legend = _ref$legend === void 0 ? null : _ref$legend,
+    _ref$hideLegend = _ref.hideLegend,
+    hideLegend = _ref$hideLegend === void 0 ? false : _ref$hideLegend,
+    _ref$headingLevel = _ref.headingLevel,
+    HeadingLevel = _ref$headingLevel === void 0 ? null : _ref$headingLevel,
+    _ref$header = _ref.header,
+    header = _ref$header === void 0 ? null : _ref$header,
+    _ref$descriptor = _ref.descriptor,
+    descriptor = _ref$descriptor === void 0 ? null : _ref$descriptor;
+  var fieldsetProps = _objectSpread(_objectSpread({}, name && {
+    name: name
+  }), {}, {
+    className: 'ncf__fieldset'
+  });
+  var legendClassName = (0, _classnames["default"])(['ncf__legend', {
+    'o-normalise-visually-hidden': hideLegend
+  }]);
+  var legendElement = legend ? /*#__PURE__*/_react["default"].createElement("legend", {
+    className: legendClassName
+  }, legend) : null;
+  var headingLevelElement = HeadingLevel ? /*#__PURE__*/_react["default"].createElement(HeadingLevel, {
+    className: "ncf__header"
+  }, header) : null;
+  var descriptorElement = descriptor ? /*#__PURE__*/_react["default"].createElement("p", {
+    className: "ncf__fieldset-descriptor"
+  }, descriptor) : null;
+  return /*#__PURE__*/_react["default"].createElement("fieldset", fieldsetProps, legendElement, headingLevelElement, descriptorElement, /*#__PURE__*/_react["default"].createElement("div", {
+    className: "ncf__fields"
+  }, children));
+}
+Fieldset.propTypes = {
+  children: _propTypes["default"].oneOfType([_propTypes["default"].arrayOf(_propTypes["default"].node), _propTypes["default"].node]),
+  name: _propTypes["default"].string,
+  legend: _propTypes["default"].string,
+  hideLegend: _propTypes["default"].bool,
+  headingLevel: _propTypes["default"].string,
+  header: _propTypes["default"].node,
+  descriptor: _propTypes["default"].node
+};

package/dist/first-name.jsx

@@ -0,0 +1,73 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.FirstName = FirstName;
+var _react = _interopRequireDefault(require("react"));
+var _propTypes = _interopRequireDefault(require("prop-types"));
+var _classnames = _interopRequireDefault(require("classnames"));
+function FirstName(_ref) {
+  var _ref$dataTrackable = _ref.dataTrackable,
+    dataTrackable = _ref$dataTrackable === void 0 ? 'field-name' : _ref$dataTrackable,
+    _ref$errorText = _ref.errorText,
+    errorText = _ref$errorText === void 0 ? 'Please enter your first name' : _ref$errorText,
+    _ref$fieldId = _ref.fieldId,
+    fieldId = _ref$fieldId === void 0 ? 'firstNameField' : _ref$fieldId,
+    _ref$hasError = _ref.hasError,
+    hasError = _ref$hasError === void 0 ? false : _ref$hasError,
+    _ref$inputId = _ref.inputId,
+    inputId = _ref$inputId === void 0 ? 'firstName' : _ref$inputId,
+    inputName = _ref.inputName,
+    _ref$isDisabled = _ref.isDisabled,
+    isDisabled = _ref$isDisabled === void 0 ? false : _ref$isDisabled,
+    _ref$label = _ref.label,
+    label = _ref$label === void 0 ? 'First name' : _ref$label,
+    _ref$placeHolder = _ref.placeHolder,
+    placeHolder = _ref$placeHolder === void 0 ? 'Enter your first name' : _ref$placeHolder,
+    _ref$value = _ref.value,
+    value = _ref$value === void 0 ? '' : _ref$value;
+  // Use inputId if inputName is not explicitly passed.
+  inputName = inputName || inputId;
+  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: "o-forms-field ncf__validation-error",
+    "data-validate": "required",
+    htmlFor: inputId
+  }, /*#__PURE__*/_react["default"].createElement("span", {
+    className: "o-forms-title"
+  }, /*#__PURE__*/_react["default"].createElement("span", {
+    className: "o-forms-title__main"
+  }, label)), /*#__PURE__*/_react["default"].createElement("span", {
+    className: inputWrapperClassNames
+  }, /*#__PURE__*/_react["default"].createElement("input", {
+    type: "text",
+    id: inputId,
+    name: inputName,
+    placeholder: placeHolder,
+    autoComplete: "given-name",
+    "data-trackable": dataTrackable,
+    "aria-required": "true",
+    required: true,
+    disabled: isDisabled,
+    defaultValue: value
+  }), /*#__PURE__*/_react["default"].createElement("span", {
+    className: "o-forms-input__error"
+  }, errorText)));
+}
+FirstName.propTypes = {
+  dataTrackable: _propTypes["default"].string,
+  errorText: _propTypes["default"].string,
+  fieldId: _propTypes["default"].string,
+  hasError: _propTypes["default"].bool,
+  inputId: _propTypes["default"].string,
+  inputName: _propTypes["default"].string,
+  isDisabled: _propTypes["default"].bool,
+  label: _propTypes["default"].string,
+  placeHolder: _propTypes["default"].string,
+  value: _propTypes["default"].string
+};

package/dist/form.jsx

@@ -0,0 +1,29 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.Form = Form;
+var _react = _interopRequireDefault(require("react"));
+var _propTypes = _interopRequireDefault(require("prop-types"));
+function Form(_ref) {
+  var children = _ref.children,
+    _ref$action = _ref.action,
+    action = _ref$action === void 0 ? '' : _ref$action,
+    _ref$method = _ref.method,
+    method = _ref$method === void 0 ? 'POST' : _ref$method;
+  return /*#__PURE__*/_react["default"].createElement("div", {
+    className: "ncf__wrapper"
+  }, /*#__PURE__*/_react["default"].createElement("form", {
+    className: "ncf",
+    action: action,
+    method: method,
+    noValidate: true
+  }, children));
+}
+Form.propTypes = {
+  children: _propTypes["default"].oneOfType([_propTypes["default"].arrayOf(_propTypes["default"].node), _propTypes["default"].node]),
+  action: _propTypes["default"].string,
+  method: _propTypes["default"].string
+};

package/dist/google-sign-in.jsx

@@ -0,0 +1,24 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.GoogleSignIn = GoogleSignIn;
+var _react = _interopRequireDefault(require("react"));
+var _propTypes = _interopRequireDefault(require("prop-types"));
+function GoogleSignIn(_ref) {
+  var signInRedirectUrl = _ref.signInRedirectUrl;
+  return /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement("link", {
+    href: "https://fonts.googleapis.com/css?family=Roboto",
+    rel: "stylesheet"
+  }), /*#__PURE__*/_react["default"].createElement("base", {
+    target: "_parent"
+  }), /*#__PURE__*/_react["default"].createElement("a", {
+    className: "google_button",
+    href: signInRedirectUrl
+  }, "Sign in with Google"));
+}
+GoogleSignIn.propTypes = {
+  signInRedirectUrl: _propTypes["default"].string.isRequired
+};

package/dist/graduation-date.jsx

@@ -0,0 +1,112 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.Compliance = void 0;
+exports.GraduationDate = GraduationDate;
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+var _react = _interopRequireDefault(require("react"));
+var _propTypes = _interopRequireDefault(require("prop-types"));
+var _classnames = _interopRequireDefault(require("classnames"));
+var getMonthNameByIndex = function getMonthNameByIndex(index) {
+  return new Date(null, index, null).toLocaleDateString('en', {
+    month: 'long'
+  });
+};
+var Compliance = function Compliance() {
+  return /*#__PURE__*/_react["default"].createElement("div", {
+    id: "graduationDateCompliance",
+    className: "ncf__field ncf__gd-compliance"
+  }, /*#__PURE__*/_react["default"].createElement("p", null, "We use the information you provide, and may share it with your institution, for the purposes of administering your institution's licence for", ' ', /*#__PURE__*/_react["default"].createElement("a", {
+    className: "ncf__link--external",
+    href: "https://ft.com/",
+    title: "Financial Times",
+    target: "_blank",
+    rel: "noopener noreferrer"
+  }, "FT.com.", ' ')), /*#__PURE__*/_react["default"].createElement("p", null, "We may also use it to ensure our communications to you are more relevant. If you do not wish us to do so, you can amend your preferences at any time", ' ', /*#__PURE__*/_react["default"].createElement("a", {
+    className: "ncf__link--external",
+    href: "http://www.ft.com/myft/alerts/",
+    title: "Financial Times",
+    target: "_blank",
+    rel: "noopener noreferrer"
+  }, "here")));
+};
+exports.Compliance = Compliance;
+function GraduationDate(_ref) {
+  var value = _ref.value,
+    _ref$isDisabled = _ref.isDisabled,
+    isDisabled = _ref$isDisabled === void 0 ? false : _ref$isDisabled,
+    _ref$isRequired = _ref.isRequired,
+    isRequired = _ref$isRequired === void 0 ? false : _ref$isRequired,
+    _ref$hasError = _ref.hasError,
+    hasError = _ref$hasError === void 0 ? false : _ref$hasError;
+  var currentYear = new Date().getUTCFullYear();
+  var earliestSelectableYear = currentYear - 4;
+  var defaultValues = value && value.trim().match(/^([0-9]{4})-(0[0-9]|1[012])-[0-9]{2}$/);
+  var _ref2 = defaultValues || [],
+    _ref3 = (0, _slicedToArray2["default"])(_ref2, 3),
+    defaultYear = _ref3[1],
+    defaultMonth = _ref3[2];
+  var inputWrapperClassNames = (0, _classnames["default"])(['o-forms-input', 'o-forms-input--select', {
+    'o-forms-input--invalid': hasError
+  }]);
+  return /*#__PURE__*/_react["default"].createElement("div", {
+    id: "graduationDateField",
+    className: "o-forms-field ncf__validation-error ncf__graduation-date",
+    "data-validate": "required"
+  }, /*#__PURE__*/_react["default"].createElement("span", {
+    className: "o-forms-title",
+    role: "group",
+    "aria-labelledby": "graduationTitleMain"
+  }, /*#__PURE__*/_react["default"].createElement("span", {
+    className: "o-forms-title__main",
+    id: "graduationTitleMain"
+  }, "Expected graduation date")), /*#__PURE__*/_react["default"].createElement("div", {
+    className: inputWrapperClassNames
+  }, /*#__PURE__*/_react["default"].createElement("div", {
+    className: "ncf__graduation-date__select-wrapper"
+  }, /*#__PURE__*/_react["default"].createElement("span", null, /*#__PURE__*/_react["default"].createElement("label", {
+    htmlFor: "graduationDateMonth"
+  }, "Month"), /*#__PURE__*/_react["default"].createElement("select", {
+    id: "graduationDateMonth",
+    name: "graduationDateMonth",
+    required: isRequired,
+    "aria-required": isRequired,
+    disabled: isDisabled,
+    defaultValue: defaultMonth
+  }, Array.from({
+    length: 12
+  }, function (_, index) {
+    return /*#__PURE__*/_react["default"].createElement("option", {
+      key: index,
+      value: (index + 1).toString(10).padStart(2, '0')
+    }, getMonthNameByIndex(index + 1));
+  }))), /*#__PURE__*/_react["default"].createElement("span", null, /*#__PURE__*/_react["default"].createElement("label", {
+    htmlFor: "graduationDateYear"
+  }, "Year"), /*#__PURE__*/_react["default"].createElement("select", {
+    id: "graduationDateYear",
+    name: "graduationDateYear",
+    required: isRequired,
+    "aria-required": isRequired,
+    disabled: isDisabled,
+    defaultValue: defaultYear
+  }, Array.from({
+    length: 9
+  }, function (_, index) {
+    var value = earliestSelectableYear + index;
+    return /*#__PURE__*/_react["default"].createElement("option", {
+      key: index,
+      value: value
+    }, value);
+  })))), /*#__PURE__*/_react["default"].createElement("span", {
+    className: "o-forms-input__error"
+  }, "Please select a valid graduation date")), /*#__PURE__*/_react["default"].createElement(Compliance, null));
+}
+GraduationDate.propTypes = {
+  value: _propTypes["default"].string,
+  isDisabled: _propTypes["default"].bool,
+  isRequired: _propTypes["default"].bool,
+  hasError: _propTypes["default"].bool
+};