UNPKG

@financial-times/n-conversion-forms

Version:

Containing jsx components and styles for forms included on Accounts and Acqusition apps (next-signup, next-profile, next-retention, etc).

90 lines (89 loc) 4.08 kB
"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 };