"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.RadioStyled = exports.RadioLabel = exports.RadioField = exports.RadioWrap = exports.Label = exports.Wrap = exports.LABEL_CLASSNAME = exports.RADIO_STYLED_CLASSNAME = exports.RADIO_WRAP_CLASSNAME = void 0;

var _styledComponents = _interopRequireDefault(require("styled-components"));

var _styles = require("@vincent_za/styles");

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

function _templateObject6() {
  var data = _taggedTemplateLiteral(["\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  border: 2px solid ", ";\n  width: 100%;\n  height: 100%;\n  border-radius: 50%;\n\n  &::before {\n    content: '';\n    position: absolute;\n    visibility: hidden;\n    height: ", "px;\n    width: ", "px;\n    border-radius: 50%;\n    background-color: ", ";\n    transition: width 0.1s ease-out, height 0.1s ease-out, background-color 0.1s ease-out;\n    pointer-events: none;\n  }\n"]);

  _templateObject6 = function _templateObject6() {
    return data;
  };

  return data;
}

function _templateObject5() {
  var data = _taggedTemplateLiteral(["\n  position: absolute;\n  top: 0;\n  right: 0;\n  bottom: 0;\n  left: 0;\n"]);

  _templateObject5 = function _templateObject5() {
    return data;
  };

  return data;
}

function _templateObject4() {
  var data = _taggedTemplateLiteral(["\n  display: none;\n\n  &:checked ~ {\n    .", " {\n      border-color: ", ";\n\n      &::before {\n        visibility: visible;\n        width: ", "px;\n        height: ", "px;\n        background-color: ", ";\n      }\n    }\n  }\n"]);

  _templateObject4 = function _templateObject4() {
    return data;
  };

  return data;
}

function _templateObject3() {
  var data = _taggedTemplateLiteral(["\n  position: relative;\n  width: ", "px;\n  height: ", "px;\n\n  &:hover {\n    .", " {\n      border-color: ", ";\n\n      &::before {\n        visibility: visible;\n        background-color: ", ";\n      }\n    }\n  }\n"]);

  _templateObject3 = function _templateObject3() {
    return data;
  };

  return data;
}

function _templateObject2() {
  var data = _taggedTemplateLiteral(["\n  margin-right: ", ";\n  color: ", ";\n"]);

  _templateObject2 = function _templateObject2() {
    return data;
  };

  return data;
}

function _templateObject() {
  var data = _taggedTemplateLiteral(["\n  display: flex;\n  align-items: center;\n\n  ", ";\n"]);

  _templateObject = function _templateObject() {
    return data;
  };

  return data;
}

function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }

var SIZE = 16;
var BG = '#636363';
var RADIO_WRAP_CLASSNAME = 'radio-wrap';
exports.RADIO_WRAP_CLASSNAME = RADIO_WRAP_CLASSNAME;
var RADIO_STYLED_CLASSNAME = 'radio-styled';
exports.RADIO_STYLED_CLASSNAME = RADIO_STYLED_CLASSNAME;
var LABEL_CLASSNAME = 'radio-label';
exports.LABEL_CLASSNAME = LABEL_CLASSNAME;

var Wrap = _styledComponents.default.div(_templateObject(), function (props) {
  return props.isDisabled && "\n    opacity: 0.6;\n    pointer-events: none;\n  ";
});

exports.Wrap = Wrap;

var Label = _styledComponents.default.label(_templateObject2(), _styles.REM_UNIT_SM, function (props) {
  return props.checked ? _styles.COLOR_PRIMARY : 'inherit';
});

exports.Label = Label;

var RadioWrap = _styledComponents.default.div(_templateObject3(), SIZE, SIZE, RADIO_STYLED_CLASSNAME, _styles.COLOR_PRIMARY, _styles.COLOR_PRIMARY);

exports.RadioWrap = RadioWrap;

var RadioField = _styledComponents.default.input(_templateObject4(), RADIO_STYLED_CLASSNAME, _styles.COLOR_PRIMARY, SIZE / 2, SIZE / 2, _styles.COLOR_PRIMARY);

exports.RadioField = RadioField;

var RadioLabel = _styledComponents.default.label(_templateObject5());

exports.RadioLabel = RadioLabel;

var RadioStyled = _styledComponents.default.div(_templateObject6(), BG, SIZE / 4, SIZE / 4, BG);

exports.RadioStyled = RadioStyled;