UNPKG

@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).

65 lines (64 loc) 2.64 kB
"use strict"; var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault"); Object.defineProperty(exports, "__esModule", { value: true }); exports.JobTitle = JobTitle; var _react = _interopRequireDefault(require("react")); var _propTypes = _interopRequireDefault(require("prop-types")); var _classnames = _interopRequireDefault(require("classnames")); function JobTitle(_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$isRequired = _ref.isRequired, isRequired = _ref$isRequired === void 0 ? true : _ref$isRequired; var inputWrapperClassName = (0, _classnames["default"])(['o-forms-input', 'o-forms-input--text', { 'o-forms-input--invalid': hasError }]); var fieldTitleClassName = (0, _classnames["default"])(['o-forms-title', { 'o-forms-field--optional': !isRequired }]); 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: fieldTitleClassName }, /*#__PURE__*/_react["default"].createElement("span", { className: "o-forms-title__main" }, "Job title")), /*#__PURE__*/_react["default"].createElement("span", { className: inputWrapperClassName }, /*#__PURE__*/_react["default"].createElement("input", { type: "text", id: inputId, name: inputName, placeholder: "Enter your job title", autoComplete: "organization-title", "data-trackable": "job-title", "aria-required": isRequired, required: isRequired, disabled: isDisabled, defaultValue: value }), /*#__PURE__*/_react["default"].createElement("span", { className: "o-forms-input__error" }, "Please enter your job title."))); } JobTitle.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 };