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

82 lines (81 loc) 3.39 kB
"use strict"; var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault"); Object.defineProperty(exports, "__esModule", { value: true }); exports.Industry = Industry; var _react = _interopRequireDefault(require("react")); var _propTypes = _interopRequireDefault(require("prop-types")); var _classnames = _interopRequireDefault(require("classnames")); function Industry(_ref) { var value = _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 ? 'industryField' : _ref$fieldId, _ref$selectId = _ref.selectId, selectId = _ref$selectId === void 0 ? 'industry' : _ref$selectId, _ref$selectName = _ref.selectName, selectName = _ref$selectName === void 0 ? 'industry' : _ref$selectName, _ref$options = _ref.options, options = _ref$options === void 0 ? [] : _ref$options, _ref$fieldLabel = _ref.fieldLabel, fieldLabel = _ref$fieldLabel === void 0 ? 'In which industry do you work?' : _ref$fieldLabel, _ref$isRequired = _ref.isRequired, isRequired = _ref$isRequired === void 0 ? true : _ref$isRequired; var inpiutWrapperClassName = (0, _classnames["default"])(['o-forms-input', 'o-forms-input--select', { 'o-forms-input--invalid': hasError }]); var fieldTitleClassName = (0, _classnames["default"])(['o-forms-title', { 'o-forms-field--optional': !isRequired }]); options.sort(function (a, b) { return a.description.localeCompare(b.description); }); return /*#__PURE__*/_react["default"].createElement("label", { id: fieldId, className: "o-forms-field ncf__validation-error", htmlFor: selectId }, /*#__PURE__*/_react["default"].createElement("span", { className: fieldTitleClassName }, /*#__PURE__*/_react["default"].createElement("span", { className: "o-forms-title__main" }, fieldLabel)), /*#__PURE__*/_react["default"].createElement("span", { className: inpiutWrapperClassName }, /*#__PURE__*/_react["default"].createElement("select", { id: selectId, name: selectName, "data-trackable": "industry", "aria-required": isRequired, required: isRequired, disabled: isDisabled, defaultValue: value }, /*#__PURE__*/_react["default"].createElement("option", { value: "" }, "Please select an industry"), options.map(function (_ref2) { var code = _ref2.code, description = _ref2.description; return /*#__PURE__*/_react["default"].createElement("option", { key: code, value: code }, description); })), /*#__PURE__*/_react["default"].createElement("span", { className: "o-forms-input__error" }, "Please select your company\u2019s industry"))); } Industry.propTypes = { value: _propTypes["default"].string, isDisabled: _propTypes["default"].bool, hasError: _propTypes["default"].bool, fieldId: _propTypes["default"].string, selectId: _propTypes["default"].string, selectName: _propTypes["default"].string, options: _propTypes["default"].arrayOf(_propTypes["default"].shape({ code: _propTypes["default"].string, description: _propTypes["default"].string })), fieldLabel: _propTypes["default"].string, isRequired: _propTypes["default"].bool };