@netdata/netdata-ui/dist/components/radio-button/index.js

netdata UI kit

"use strict";

exports.__esModule = true;
exports["default"] = void 0;
var _react = _interopRequireDefault(require("react"));
var _typography = require("../typography");
var _styled = require("./styled");
var _excluded = ["alignItems", "alignSelf", "checked", "children", "disabled", "iconProps", "label", "margin"];
function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (-1 !== e.indexOf(n)) continue; t[n] = r[n]; } return t; }
var radioButtonStyles = {
  disabled: {
    containerColor: "disabledBackground",
    dotColor: "disabledBackground",
    borderColor: "disabledBackground"
  },
  checked: {
    containerColor: "inputBg",
    dotColor: "primary",
    borderColor: "inputBorder"
  },
  checkedDisabled: {
    containerColor: "inputBg",
    dotColor: "disabled",
    borderColor: "inputBorder"
  },
  "default": {
    containerColor: "inputBg",
    dotColor: "bright",
    borderColor: "inputBorder"
  }
};
var RadioButton = function RadioButton(_ref) {
  var _ref$alignItems = _ref.alignItems,
    alignItems = _ref$alignItems === void 0 ? "center" : _ref$alignItems,
    alignSelf = _ref.alignSelf,
    checked = _ref.checked,
    children = _ref.children,
    disabled = _ref.disabled,
    iconProps = _ref.iconProps,
    label = _ref.label,
    margin = _ref.margin,
    rest = _objectWithoutPropertiesLoose(_ref, _excluded);
  var radioStatus = disabled && !checked ? "disabled" : checked && disabled ? "checkedDisabled" : checked ? "checked" : "default";
  var radioStyles = _react["default"].useMemo(function () {
    return radioButtonStyles[radioStatus];
  }, [radioStatus]);
  var showIcon = radioStatus === "checkedDisabled" || radioStatus === "checked";
  return /*#__PURE__*/_react["default"].createElement(_styled.Container, {
    alignItems: alignItems,
    alignSelf: alignSelf,
    disabled: disabled,
    margin: margin
  }, /*#__PURE__*/_react["default"].createElement(_styled.Input, _extends({
    type: "radio",
    disabled: disabled,
    checked: checked
  }, rest)), /*#__PURE__*/_react["default"].createElement(_styled.IconContainer, {
    background: radioStyles.containerColor,
    borderColor: radioStyles.borderColor,
    margin: children || label ? [0.5, 2, 0, 0] : null
  }, showIcon && /*#__PURE__*/_react["default"].createElement(_styled.StyledIcon, _extends({
    name: "dot",
    color: radioStyles.dotColor
  }, iconProps))), children, label && !children && /*#__PURE__*/_react["default"].createElement(_typography.Text, null, label));
};
var _default = exports["default"] = RadioButton;