"use strict";

function _typeof(obj) { if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.RadioOptions = void 0;

var _react = _interopRequireWildcard(require("react"));

var _radioOptions = require("./radio-options.proptypes");

var _primitives = require("../../primitives");

var _behaviors = require("../../core/behaviors");

var _typography = require("../../core/typography");

var _formInput = require("../../core/forms/form-input");

var _icon = require("./icon");

var _fieldLabel = require("../../core/typography/field-label");

var _formList = require("../../core/forms/form-list");

function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function _getRequireWildcardCache() { return cache; }; return cache; }

function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }

var BaseRadioOption = function BaseRadioOption(_ref) {
  var id = _ref.id,
      selected = _ref.selected,
      text = _ref.text,
      onClick = _ref.onClick,
      description = _ref.description,
      freeForm = _ref.freeForm;
  var onOptionClick = (0, _react.useCallback)(function () {
    onClick(id);
  }, [onClick, id]);
  var onTextChange = (0, _react.useCallback)(function (value) {
    if (freeForm && freeForm.onChange) {
      freeForm.onChange(value);
    }
  }, [freeForm]);
  return _react["default"].createElement(_primitives.Box, null, _react["default"].createElement(_behaviors.UnstyledButton, {
    style: {
      width: '100%',
      outline: 'none'
    },
    onClick: onOptionClick
  }, _react["default"].createElement(_primitives.Box, {
    stacked: "row",
    align: "center",
    justify: "space-between",
    spacing: ['pr1', 'pl3']
  }, _react["default"].createElement(_primitives.Box, {
    stacked: "column",
    align: "start",
    spacing: "pv2"
  }, _react["default"].createElement(_typography.Span, {
    face: "sans",
    colorName: "greyscale-black",
    fontSize: "f3",
    bold: true,
    spacing: ['m0', 'p0']
  }, text), description !== undefined ? _react["default"].createElement(_primitives.Box, {
    spacing: "mt1"
  }, _react["default"].createElement(_typography.Text, {
    fontSize: "f1",
    spacing: "mb0",
    colorName: "greyscale-black"
  }, description)) : null), _react["default"].createElement(_icon.RadioOption, {
    selected: selected,
    justify: "end"
  }))), freeForm ? _react["default"].createElement(_primitives.Box, {
    spacing: ['mb1', 'pl3', 'pt1']
  }, _react["default"].createElement(_formInput.FormInput, {
    label: freeForm.placeholder,
    placeholder: freeForm.placeholder,
    value: freeForm.value,
    onChange: onTextChange,
    style: {
      border: 0,
      padding: 0
    },
    large: true
  })) : null);
};

var RadioOptions = function RadioOptions(_ref2) {
  var label = _ref2.label,
      selectedId = _ref2.selectedId,
      options = _ref2.options,
      onClick = _ref2.onClick;
  return _react["default"].createElement(_primitives.Box, null, _react["default"].createElement(_fieldLabel.FieldLabel, null, label), _react["default"].createElement(_formList.FormList, {
    items: options.map(function (option) {
      return _react["default"].createElement(BaseRadioOption, {
        id: option.id,
        key: option.id,
        text: option.text,
        selected: option.id === selectedId,
        description: option.description,
        freeForm: option.freeForm,
        onClick: onClick
      });
    })
  }));
};

exports.RadioOptions = RadioOptions;
RadioOptions.displayName = 'RadioOptions';
RadioOptions.propTypes = _radioOptions.radioPropTypes;