"use strict";

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

var _lodash = _interopRequireDefault(require("lodash"));

var _utils = require("../utils/utils");

var _propTypes = _interopRequireDefault(require("prop-types"));

var _styled = _interopRequireDefault(require("@emotion/styled"));

var _constants = require("../utils/constants");

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

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

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

function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _nonIterableRest(); }

function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance"); }

function _iterableToArrayLimit(arr, i) { var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }

function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }

var BUTTON_RADIUS = 21;
var BUTTON_BORDER = 2;
var NodeWrapper =
/*#__PURE__*/
(0, _styled.default)('div', {
  target: "esnoskk0"
})("display:inline-block;padding:", _constants.NODE_PADDING, "px ", _constants.NODE_PADDING, "px ", _constants.NODE_PADDING, "px ", _constants.NODE_PADDING, "px;position:absolute;top:", function (_ref) {
  var y = _ref.y;
  return y - _constants.NODE_HEIGHT / 3 - _constants.NODE_PADDING;
}, "px;left:", function (_ref2) {
  var x = _ref2.x;
  return x - _constants.NODE_WIDTH / 2 - _constants.NODE_PADDING;
}, "px;");
var NodeLabel =
/*#__PURE__*/
(0, _styled.default)('div', {
  target: "esnoskk1"
})("position:relative;text-align:center;line-height:1.75;text-overflow:ellipsis;overflow:hidden;width:", _constants.NODE_WIDTH, "px;height:", _constants.NODE_HEIGHT, "px;font-style:", function (_ref3) {
  var isFolded = _ref3.isFolded;
  return isFolded ? 'italic' : 'initial';
}, ";pointer-events:auto;cursor:", function (_ref4) {
  var selectable = _ref4.selectable;
  return selectable ? 'pointer' : 'default';
}, ";box-sizing:content-box;border:", function (_ref5) {
  var selected = _ref5.selected;
  return selected ? "solid ".concat(_constants.SELECTED_BORDER_WIDTH, "px ").concat(_constants.SELECTED_COLOR_EDGES) : '';
}, ";top:", function (_ref6) {
  var selected = _ref6.selected;
  return selected ? -_constants.SELECTED_BORDER_WIDTH : 0;
}, "px;margin-bottom:", function (_ref7) {
  var selected = _ref7.selected;
  return selected ? -2 * _constants.SELECTED_BORDER_WIDTH : 0;
}, "px;left:", function (_ref8) {
  var selected = _ref8.selected;
  return selected ? -_constants.SELECTED_BORDER_WIDTH : 0;
}, "px;background-color:", function (_ref9) {
  var _ref9$color = _ref9.color,
      color = _ref9$color === void 0 ? _constants.COLOR_NODES : _ref9$color;
  return color;
}, ";");
var NodeButton =
/*#__PURE__*/
(0, _styled.default)('button', {
  target: "esnoskk2"
})("position:relative;left:", _constants.NODE_WIDTH / 2, "px;height:", BUTTON_RADIUS, "px;width:", BUTTON_RADIUS, "px;border:", BUTTON_BORDER, "px solid white;border-radius:50%;color:black;text-align:center;text-decoration:none;box-shadow:0 0 3px gray;float:left;font-size:12px;visibility:", function (_ref10) {
  var visible = _ref10.visible;
  return visible ? 'visible' : 'hidden';
}, ";font-weight:bold;display:inline-block;transform:translate(-50%,-50%);padding:0px;transition:background-color 0.1s;cursor:pointer;&:hover{background:#ffcc00;}&:focus{outline:none;}&:active{background:", _constants.SELECTED_COLOR_EDGES, ";}");

function computeNodePresentationData(hNode, interpreter) {
  var dtNode = hNode.data;
  var isLeaf = interpreter.isLeaf(dtNode);
  var isFolded = hNode.foldedChildren != null;

  if (isLeaf || isFolded) {
    var _interpreter$getPredi = interpreter.getPrediction(dtNode),
        value = _interpreter$getPredi.value,
        confidence = _interpreter$getPredi.confidence;

    var text;

    if (_lodash.default.isUndefined(value)) {
      text = dtNode.children[0].decision_rule.property;
    } else {
      text = _lodash.default.isFinite(value) ? parseFloat(value.toFixed(3)) : "".concat(value);
    }

    return {
      isLeaf: isLeaf,
      isFolded: isFolded,
      text: text,
      color: (0, _utils.computeLeafColor)(confidence)
    };
  } else {
    return {
      isLeaf: isLeaf,
      isFolded: isFolded,
      text: dtNode.children[0].decision_rule.property,
      color: undefined
    };
  }
}

var Node = function Node(_ref11) {
  var hNode = _ref11.hNode,
      interpreter = _ref11.interpreter,
      _ref11$selected = _ref11.selected,
      selected = _ref11$selected === void 0 ? false : _ref11$selected,
      onSelectNode = _ref11.onSelectNode,
      _ref11$onShowTooltip = _ref11.onShowTooltip,
      onShowTooltip = _ref11$onShowTooltip === void 0 ? function (ref, text) {} : _ref11$onShowTooltip,
      _ref11$onHideTooltip = _ref11.onHideTooltip,
      onHideTooltip = _ref11$onHideTooltip === void 0 ? function () {} : _ref11$onHideTooltip,
      _ref11$onToggleSubtre = _ref11.onToggleSubtreeFold,
      onToggleSubtreeFold = _ref11$onToggleSubtre === void 0 ? function () {} : _ref11$onToggleSubtre;
  var buttonRef = (0, _react.useRef)();
  var labelRef = (0, _react.useRef)();

  var _computeNodePresentat = computeNodePresentationData(hNode, interpreter),
      isFolded = _computeNodePresentat.isFolded,
      isLeaf = _computeNodePresentat.isLeaf,
      color = _computeNodePresentat.color,
      _computeNodePresentat2 = _computeNodePresentat.text,
      text = _computeNodePresentat2 === void 0 ? 'N/A' : _computeNodePresentat2;

  var _useState = (0, _react.useState)(false),
      _useState2 = _slicedToArray(_useState, 2),
      showNodeButton = _useState2[0],
      setShowNodeButton = _useState2[1];

  return _react.default.createElement(NodeWrapper, {
    onMouseOver: function onMouseOver() {
      setShowNodeButton(true);
      onShowTooltip(isLeaf ? labelRef.current : buttonRef.current, text);
    },
    onMouseOut: function onMouseOut() {
      setShowNodeButton(false);
      onHideTooltip();
    },
    x: hNode.x,
    y: hNode.y
  }, _react.default.createElement(NodeLabel, {
    ref: labelRef,
    onClick: onSelectNode,
    className: "craft-nodes",
    color: color,
    selected: selected,
    isFolded: isFolded,
    selectable: onSelectNode != null
  }, text), _react.default.createElement(NodeButton, {
    ref: buttonRef,
    onClick: onToggleSubtreeFold,
    visible: !isLeaf && showNodeButton
  }, isFolded ? '+' : '-'));
};

Node.propTypes = {
  hNode: _propTypes.default.object.isRequired,
  interpreter: _propTypes.default.object.isRequired,
  selected: _propTypes.default.bool,
  onSelectNode: _propTypes.default.func,
  onShowTooltip: _propTypes.default.func,
  onHideTooltip: _propTypes.default.func,
  onToggleSubtreeFold: _propTypes.default.func
};
var _default = Node;
exports.default = _default;