'use strict';

Object.defineProperty(exports, '__esModule', { value: true });

require('core-js/modules/es.symbol.js');
require('core-js/modules/es.symbol.description.js');
require('core-js/modules/es.array.concat.js');
var React = require('react');
var classnames = require('classnames');
var index = require('../Tooltip/index.js');
var Settings = require('../../constants/Settings.js');
var CardPropTypes = require('../../constants/CardPropTypes.js');
var LayoutConstants = require('../../constants/LayoutConstants.js');
var iconsReact = require('@carbon/icons-react');

function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }

var React__default = /*#__PURE__*/_interopDefault(React);
var classnames__default = /*#__PURE__*/_interopDefault(classnames);

var iotPrefix = Settings.settings.iotPrefix;
var dsPrefix = "".concat(iotPrefix, "--data-state");

// Testing the tooltip content outside carbon proved difficult.
// So this is exposed for testing purpose.
var TooltipContent = function TooltipContent(_ref) {
  var tooltipContent = _ref.tooltipContent;
  var label = tooltipContent.label,
    description = tooltipContent.description,
    extraTooltipText = tooltipContent.extraTooltipText,
    learnMoreElement = tooltipContent.learnMoreElement;
  return /*#__PURE__*/React__default.default.createElement("span", {
    className: "".concat(dsPrefix, "-tooltip")
  }, /*#__PURE__*/React__default.default.createElement("p", {
    className: "".concat(dsPrefix, "-tooltip__label")
  }, label), /*#__PURE__*/React__default.default.createElement("p", null, description), extraTooltipText && /*#__PURE__*/React__default.default.createElement("p", null, extraTooltipText), learnMoreElement);
};
TooltipContent.propTypes = {
  tooltipContent: CardPropTypes.ValueContentPropTypes.dataState.isRequired
};
var DataStateRenderer = function DataStateRenderer(_ref2) {
  var dataState = _ref2.dataState,
    size = _ref2.size,
    id = _ref2.id;
  var label = dataState.label,
    description = dataState.description;
  var withTooltip = function withTooltip(element, triggerId, tooltipDirection) {
    return /*#__PURE__*/React__default.default.createElement(index.Tooltip, {
      showIcon: false,
      useAutoPositioning: true,
      triggerText: element,
      triggerId: triggerId,
      tooltipId: "".concat(triggerId, "-tooltip"),
      id: "".concat(triggerId, "-tooltip") // https://github.com/carbon-design-system/carbon/pull/6744
      ,
      direction: tooltipDirection || 'bottom'
    }, /*#__PURE__*/React__default.default.createElement(TooltipContent, {
      tooltipContent: dataState
    }));
  };
  var renderDataStateGridIcon = function renderDataStateGridIcon() {
    var type = dataState.type,
      tooltipDirection = dataState.tooltipDirection;
    var icon = dataState.icon;
    if (!icon) {
      if (type === LayoutConstants.CARD_DATA_STATE.ERROR) {
        icon = /*#__PURE__*/React__default.default.createElement(iconsReact.ErrorFilled, {
          size: 24,
          className: "".concat(dsPrefix, "-default-error-icon")
        });
      } else if (type === LayoutConstants.CARD_DATA_STATE.NO_DATA) {
        icon = /*#__PURE__*/React__default.default.createElement(iconsReact.WarningFilled, {
          size: 24,
          className: "".concat(dsPrefix, "-default-warning-icon")
        });
      }
    }
    return withTooltip(icon, "".concat(dsPrefix, "-grid__icon-").concat(id), tooltipDirection);
  };
  var renderDataStateGridItems = function renderDataStateGridItems() {
    var labelClass = "".concat(dsPrefix, "-grid__label");
    var descriptionClass = "".concat(dsPrefix, "-grid__description");
    return /*#__PURE__*/React__default.default.createElement(React__default.default.Fragment, null, renderDataStateGridIcon(), withTooltip(/*#__PURE__*/React__default.default.createElement("span", {
      className: labelClass
    }, label), "".concat(labelClass, "-").concat(id)), withTooltip(/*#__PURE__*/React__default.default.createElement("p", {
      className: descriptionClass
    }, description), "".concat(descriptionClass, "-").concat(id)));
  };
  return /*#__PURE__*/React__default.default.createElement("div", {
    className: "".concat(dsPrefix, "-container"),
    style: {
      '--container-padding': "".concat(LayoutConstants.CARD_CONTENT_PADDING, "px")
    }
  }, /*#__PURE__*/React__default.default.createElement("p", {
    className: classnames__default.default("".concat(dsPrefix, "-dashes"))
  }, "--"), /*#__PURE__*/React__default.default.createElement("div", {
    className: "".concat(dsPrefix, "-grid")
  }, size === LayoutConstants.CARD_SIZES.XSMALL || size === LayoutConstants.CARD_SIZES.SMALL || size === LayoutConstants.CARD_SIZES.SMALLWIDE || size === LayoutConstants.CARD_SIZES.MEDIUMTHIN ? renderDataStateGridIcon() : renderDataStateGridItems()));
};
DataStateRenderer.propTypes = {
  size: CardPropTypes.CardPropTypes.size,
  id: CardPropTypes.CardPropTypes.id,
  dataState: CardPropTypes.ValueContentPropTypes.dataState.isRequired
};
DataStateRenderer.defaultProps = {
  size: LayoutConstants.CARD_SIZES.MEDIUM,
  id: 'data-state-renderer'
};
DataStateRenderer.__docgenInfo = {
  "description": "",
  "methods": [],
  "displayName": "DataStateRenderer",
  "props": {
    "size": {
      "defaultValue": {
        "value": "CARD_SIZES.MEDIUM",
        "computed": true
      },
      "description": "",
      "type": {
        "name": "custom",
        "raw": "CardPropTypes.size"
      },
      "required": false
    },
    "id": {
      "defaultValue": {
        "value": "'data-state-renderer'",
        "computed": false
      },
      "description": "",
      "type": {
        "name": "custom",
        "raw": "CardPropTypes.id"
      },
      "required": false
    },
    "dataState": {
      "description": "",
      "type": {
        "name": "custom",
        "raw": "ValueContentPropTypes.dataState.isRequired"
      },
      "required": false
    }
  }
};
var DataStateRenderer$1 = DataStateRenderer;
TooltipContent.__docgenInfo = {
  "description": "",
  "methods": [],
  "displayName": "TooltipContent",
  "props": {
    "tooltipContent": {
      "description": "",
      "type": {
        "name": "custom",
        "raw": "ValueContentPropTypes.dataState.isRequired"
      },
      "required": false
    }
  }
};

exports.TooltipContent = TooltipContent;
exports.default = DataStateRenderer$1;
