import 'core-js/modules/es.symbol.js';
import 'core-js/modules/es.symbol.description.js';
import 'core-js/modules/es.array.concat.js';
import React__default from 'react';
import classnames from 'classnames';
import { Tooltip } from '../Tooltip/index.js';
import { settings } from '../../constants/Settings.js';
import { ValueContentPropTypes, CardPropTypes } from '../../constants/CardPropTypes.js';
import { CARD_CONTENT_PADDING, CARD_SIZES, CARD_DATA_STATE } from '../../constants/LayoutConstants.js';
import { ErrorFilled, WarningFilled } from '@carbon/icons-react';

var iotPrefix = 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.createElement("span", {
    className: "".concat(dsPrefix, "-tooltip")
  }, /*#__PURE__*/React__default.createElement("p", {
    className: "".concat(dsPrefix, "-tooltip__label")
  }, label), /*#__PURE__*/React__default.createElement("p", null, description), extraTooltipText && /*#__PURE__*/React__default.createElement("p", null, extraTooltipText), learnMoreElement);
};
TooltipContent.propTypes = {
  tooltipContent: 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.createElement(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.createElement(TooltipContent, {
      tooltipContent: dataState
    }));
  };
  var renderDataStateGridIcon = function renderDataStateGridIcon() {
    var type = dataState.type,
      tooltipDirection = dataState.tooltipDirection;
    var icon = dataState.icon;
    if (!icon) {
      if (type === CARD_DATA_STATE.ERROR) {
        icon = /*#__PURE__*/React__default.createElement(ErrorFilled, {
          size: 24,
          className: "".concat(dsPrefix, "-default-error-icon")
        });
      } else if (type === CARD_DATA_STATE.NO_DATA) {
        icon = /*#__PURE__*/React__default.createElement(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.createElement(React__default.Fragment, null, renderDataStateGridIcon(), withTooltip(/*#__PURE__*/React__default.createElement("span", {
      className: labelClass
    }, label), "".concat(labelClass, "-").concat(id)), withTooltip(/*#__PURE__*/React__default.createElement("p", {
      className: descriptionClass
    }, description), "".concat(descriptionClass, "-").concat(id)));
  };
  return /*#__PURE__*/React__default.createElement("div", {
    className: "".concat(dsPrefix, "-container"),
    style: {
      '--container-padding': "".concat(CARD_CONTENT_PADDING, "px")
    }
  }, /*#__PURE__*/React__default.createElement("p", {
    className: classnames("".concat(dsPrefix, "-dashes"))
  }, "--"), /*#__PURE__*/React__default.createElement("div", {
    className: "".concat(dsPrefix, "-grid")
  }, size === CARD_SIZES.XSMALL || size === CARD_SIZES.SMALL || size === CARD_SIZES.SMALLWIDE || size === CARD_SIZES.MEDIUMTHIN ? renderDataStateGridIcon() : renderDataStateGridItems()));
};
DataStateRenderer.propTypes = {
  size: CardPropTypes.size,
  id: CardPropTypes.id,
  dataState: ValueContentPropTypes.dataState.isRequired
};
DataStateRenderer.defaultProps = {
  size: 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
    }
  }
};

export { TooltipContent, DataStateRenderer$1 as default };
