@financial-times/n-conversion-forms/dist/delivery-option.jsx

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

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.DeliveryOption = DeliveryOption;
var _react = _interopRequireDefault(require("react"));
var _propTypes = _interopRequireDefault(require("prop-types"));
var _classnames = _interopRequireDefault(require("classnames"));
var _deliveryOptionMessages = require("../utils/delivery-option-messages");
var _supportedCountries = require("../helpers/supportedCountries");
function DeliveryOption(_ref) {
  var _ref$fieldId = _ref.fieldId,
    fieldId = _ref$fieldId === void 0 ? 'deliveryOptionField' : _ref$fieldId,
    country = _ref.country,
    _ref$productCode = _ref.productCode,
    productCode = _ref$productCode === void 0 ? undefined : _ref$productCode,
    _ref$options = _ref.options,
    options = _ref$options === void 0 ? [] : _ref$options,
    _ref$isSingle = _ref.isSingle,
    isSingle = _ref$isSingle === void 0 ? false : _ref$isSingle;
  var divClassName = (0, _classnames["default"])(['o-forms-field', 'ncf__delivery-option', {
    'ncf__delivery-option--single': isSingle
  }]);
  var FTShippingZone = (0, _supportedCountries.identifyFTShippingZone)(country);
  return /*#__PURE__*/_react["default"].createElement("div", {
    id: fieldId,
    className: divClassName,
    role: "group",
    "aria-label": "Delivery options"
  }, /*#__PURE__*/_react["default"].createElement("span", {
    className: "o-forms-input o-forms-input--radio-round"
  }, options.map(function (option) {
    var value = option.value,
      isValidDeliveryOption = option.isValidDeliveryOption,
      isSelected = option.isSelected;
    var deliveryOptionValue = (0, _deliveryOptionMessages.getDeliveryOption)(productCode, option, FTShippingZone);
    if (!isValidDeliveryOption || !deliveryOptionValue) {
      return null;
    }

    // in case the delivery option has a custom ID
    var id = deliveryOptionValue.customId || value;
    var inputProps = {
      type: 'radio',
      id: id,
      name: 'deliveryOption',
      value: value,
      className: 'ncf__delivery-option__input',
      defaultChecked: isSelected
    };
    return /*#__PURE__*/_react["default"].createElement("label", {
      key: value,
      className: "ncf__delivery-option__item",
      htmlFor: id
    }, /*#__PURE__*/_react["default"].createElement("input", inputProps), /*#__PURE__*/_react["default"].createElement("span", {
      className: "o-forms-input__label ncf__delivery-option__label"
    }, /*#__PURE__*/_react["default"].createElement("span", {
      className: "ncf__delivery-option__title o-forms-title__main"
    }, deliveryOptionValue.title), /*#__PURE__*/_react["default"].createElement("div", {
      className: "ncf__delivery-option__description"
    }, deliveryOptionValue.description)));
  })));
}
DeliveryOption.propTypes = {
  country: _propTypes["default"].oneOf(_supportedCountries.countriesSupportedISO).isRequired,
  productCode: _propTypes["default"].string,
  options: _propTypes["default"].arrayOf(_propTypes["default"].shape({
    value: _propTypes["default"].oneOf(['PV', 'HD', 'EV']),
    isSelected: _propTypes["default"].bool,
    deliveryOnPublicationDate: _propTypes["default"].bool,
    flightMarket: _propTypes["default"].bool,
    mailDelivery: _propTypes["default"].bool
  })),
  isSingle: _propTypes["default"].bool
};