'use strict';

var _defineProperty = require('@babel/runtime/helpers/defineProperty');
var _slicedToArray = require('@babel/runtime/helpers/slicedToArray');
var defaultsDeep = require('../../node_modules/lodash-es/defaultsDeep.js');
require('core-js/modules/es.array.concat.js');
require('core-js/modules/es.array.map.js');
require('core-js/modules/es.regexp.exec.js');
require('core-js/modules/es.string.replace.js');
require('core-js/modules/esnext.string.replace-all.js');
var React = require('react');
var PropTypes = require('prop-types');
var classnames = require('classnames');
var chartsReact = require('@carbon/charts-react');
var LayoutConstants = require('../../constants/LayoutConstants.js');
var ChartPropTypes = require('../../constants/ChartPropTypes.js');
var Settings = require('../../constants/Settings.js');
var cardTypeUtilityFunctions = require('../../utils/cardTypeUtilityFunctions.js');

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

var _defineProperty__default = /*#__PURE__*/_interopDefault(_defineProperty);
var _slicedToArray__default = /*#__PURE__*/_interopDefault(_slicedToArray);
var React__default = /*#__PURE__*/_interopDefault(React);
var PropTypes__default = /*#__PURE__*/_interopDefault(PropTypes);
var classnames__default = /*#__PURE__*/_interopDefault(classnames);

var iotPrefix = Settings.settings.iotPrefix;
var propTypes = {
  testId: PropTypes__default.default.string,
  isExpanded: PropTypes__default.default.bool,
  type: PropTypes__default.default.oneOf([LayoutConstants.CARD_TYPES.METER_CHART, LayoutConstants.CARD_TYPES.SPARKLINE_CHART, LayoutConstants.CARD_TYPES.STACKED_AREA_CHART]).isRequired,
  data: PropTypes__default.default.oneOf([ChartPropTypes.MeterChartPropTypes.data, ChartPropTypes.SparklineChartPropTypes.data]),
  content: PropTypes__default.default.oneOf([ChartPropTypes.MeterChartPropTypes.content, ChartPropTypes.SparklineChartPropTypes.content])
};
var defaultProps = {
  testId: 'cart-type-content',
  isExpanded: false,
  data: [],
  content: null
};
var CardTypeContent = function CardTypeContent(_ref) {
  var _listRef$current, _content$listContent, _contentWithDefaults$;
  var testId = _ref.testId,
    isExpanded = _ref.isExpanded,
    type = _ref.type,
    data = _ref.data,
    content = _ref.content;
  var listRef = React.useRef(null);
  var _useState = React.useState(),
    _useState2 = _slicedToArray__default.default(_useState, 2),
    listHeight = _useState2[0],
    setListHeight = _useState2[1];
  var contentWithDefaults = React.useMemo(function () {
    return defaultsDeep({}, content, defaultProps.content);
  }, [content]);
  var options = cardTypeUtilityFunctions.getChartOptions(type, data.length > 1, contentWithDefaults);
  var listClientHeight = (_listRef$current = listRef.current) === null || _listRef$current === void 0 ? void 0 : _listRef$current.clientHeight;
  React.useEffect(function () {
    setListHeight(listClientHeight);
  }, [listClientHeight]);
  var Chart = type === LayoutConstants.CARD_TYPES.METER_CHART ? chartsReact.MeterChart : type === LayoutConstants.CARD_TYPES.SPARKLINE_CHART ? chartsReact.AreaChart : type === LayoutConstants.CARD_TYPES.STACKED_AREA_CHART ? chartsReact.StackedAreaChart : null;
  return /*#__PURE__*/React__default.default.createElement("div", {
    className: classnames__default.default("".concat(iotPrefix, "--").concat(type.replaceAll('_', '-').toLowerCase(), "--wrapper"), _defineProperty__default.default({}, "".concat(iotPrefix, "--").concat(type.replaceAll('_', '-').toLowerCase(), "--wrapper__expanded"), isExpanded)),
    style: {
      '--card-list-height': ((_content$listContent = content.listContent) === null || _content$listContent === void 0 ? void 0 : _content$listContent.length) > 0 ? "".concat(listHeight, "px") : '0px'
    }
  }, /*#__PURE__*/React__default.default.createElement(Chart, {
    data: data,
    options: options
  }), ((_contentWithDefaults$ = contentWithDefaults.listContent) === null || _contentWithDefaults$ === void 0 ? void 0 : _contentWithDefaults$.length) > 0 ? /*#__PURE__*/React__default.default.createElement("div", {
    ref: listRef,
    "data-testid": "".concat(testId, "-list")
  }, contentWithDefaults.listContent.map(function (_ref2) {
    var label = _ref2.label,
      value = _ref2.value;
    return /*#__PURE__*/React__default.default.createElement("div", {
      className: "".concat(iotPrefix, "--").concat(type.replace('_', '-').toLowerCase(), "--wrapper--list")
    }, /*#__PURE__*/React__default.default.createElement("p", null, label), /*#__PURE__*/React__default.default.createElement("span", null, value));
  })) : null);
};
CardTypeContent.propTypes = propTypes;
CardTypeContent.defaultProps = defaultProps;
CardTypeContent.__docgenInfo = {
  "description": "",
  "methods": [],
  "displayName": "CardTypeContent",
  "props": {
    "testId": {
      "defaultValue": {
        "value": "'cart-type-content'",
        "computed": false
      },
      "description": "",
      "type": {
        "name": "string"
      },
      "required": false
    },
    "isExpanded": {
      "defaultValue": {
        "value": "false",
        "computed": false
      },
      "description": "",
      "type": {
        "name": "bool"
      },
      "required": false
    },
    "data": {
      "defaultValue": {
        "value": "[]",
        "computed": false
      },
      "description": "",
      "type": {
        "name": "enum",
        "value": [{
          "value": "MeterChartPropTypes.data",
          "computed": true
        }, {
          "value": "SparklineChartPropTypes.data",
          "computed": true
        }]
      },
      "required": false
    },
    "content": {
      "defaultValue": {
        "value": "null",
        "computed": false
      },
      "description": "",
      "type": {
        "name": "enum",
        "value": [{
          "value": "MeterChartPropTypes.content",
          "computed": true
        }, {
          "value": "SparklineChartPropTypes.content",
          "computed": true
        }]
      },
      "required": false
    },
    "type": {
      "description": "",
      "type": {
        "name": "enum",
        "value": [{
          "value": "CARD_TYPES.METER_CHART",
          "computed": true
        }, {
          "value": "CARD_TYPES.SPARKLINE_CHART",
          "computed": true
        }, {
          "value": "CARD_TYPES.STACKED_AREA_CHART",
          "computed": true
        }]
      },
      "required": true
    }
  }
};
var CardTypeContent$1 = CardTypeContent;

module.exports = CardTypeContent$1;
