import 'core-js/modules/es.symbol.js';
import 'core-js/modules/es.symbol.description.js';
import 'core-js/modules/es.array.concat.js';
import 'core-js/modules/es.array.filter.js';
import 'core-js/modules/es.array.map.js';
import 'core-js/modules/es.object.to-string.js';
import React__default from 'react';
import PropTypes from 'prop-types';
import { SkeletonText } from '@carbon/react';
import warning from 'warning';
import icons, { bundledIconNames } from '../../utils/bundledIcons.js';
import { settings } from '../../constants/Settings.js';
import Button from '../Button/Button.js';
import { SvgPropType } from '../../constants/SharedPropTypes.js';

var prefix = settings.prefix;
var propTypes = {
  /** title of the dashboard */
  title: PropTypes.string,
  /** Optional description of the dashboard */
  description: PropTypes.string,
  /** string that represents the last updated date */
  lastUpdated: PropTypes.string,
  /** i18n label for last updated text */
  lastUpdatedLabel: PropTypes.string,
  /** Optional filter component that might be used to filter this dashboard */
  filter: PropTypes.node,
  /** If the component should render the last updated section */
  hasLastUpdated: PropTypes.bool,
  /** optional actions that will be rendered in the Dashboard header and used in onDashboardAction */
  actions: PropTypes.arrayOf(PropTypes.shape({
    /** Unique id of the action */
    id: PropTypes.string.isRequired,
    /** used as the description to show for the icon */
    labelText: PropTypes.string,
    /** icon ultimately gets passed through all the way to <Button>, which has this same copied proptype definition for icon */
    icon: PropTypes.oneOfType([PropTypes.oneOf(bundledIconNames), PropTypes.shape({
      width: PropTypes.string,
      height: PropTypes.string,
      viewBox: PropTypes.string.isRequired,
      svgData: SvgPropType.isRequired
    }), PropTypes.object,
    // Could be a react icon name
    PropTypes.element]),
    /** Optional custom component */
    customActionComponent: PropTypes.node
  })),
  /** callback invoked if a dashboard action is clicked */
  onDashboardAction: PropTypes.func,
  testId: PropTypes.string
};
var defaultProps = {
  title: null,
  description: null,
  lastUpdated: null,
  lastUpdatedLabel: 'Last updated:',
  filter: null,
  actions: [],
  onDashboardAction: null,
  hasLastUpdated: true,
  testId: 'dashboard-header'
};

/** Renders the dashboard header at the top of the dashboard */
var DashboardHeader = function DashboardHeader(_ref) {
  var title = _ref.title,
    description = _ref.description,
    lastUpdated = _ref.lastUpdated,
    lastUpdatedLabel = _ref.lastUpdatedLabel,
    filter = _ref.filter,
    hasLastUpdated = _ref.hasLastUpdated,
    actions = _ref.actions,
    onDashboardAction = _ref.onDashboardAction,
    testId = _ref.testId;
  {
    warning(false, 'Dashboard component has been deprecated and will be removed in the next release of `carbon-addons-iot-react`.') ;
  }
  return /*#__PURE__*/React__default.createElement("div", {
    "data-testid": testId,
    className: "dashboard--header"
  }, /*#__PURE__*/React__default.createElement("div", {
    className: "dashboard--header-left"
  }, title ? /*#__PURE__*/React__default.createElement("h2", null, title) : null, description ? /*#__PURE__*/React__default.createElement("p", null, description) : null, hasLastUpdated && lastUpdatedLabel ? /*#__PURE__*/React__default.createElement("div", {
    className: "dashboard--lastupdated"
  }, lastUpdatedLabel, " ", lastUpdated || /*#__PURE__*/React__default.createElement(SkeletonText, null)) : null), /*#__PURE__*/React__default.createElement("div", {
    className: "dashboard--header-right"
  }, filter, /*#__PURE__*/React__default.createElement("div", {
    className: "dashboard--header-actions"
  }, actions.map(function (action) {
    return action.icon ? /*#__PURE__*/React__default.createElement(Button, {
      className: "".concat(prefix, "--btn--icon-only"),
      id: "action-icon--".concat(action.id),
      key: action.id,
      onClick: function onClick() {
        return onDashboardAction(action.id);
      },
      kind: "ghost",
      title: action.labelText,
      renderIcon: typeof action.icon === 'string' // legacy support for naming the icon by string
      ? icons[action.icon] : /*#__PURE__*/React__default.isValidElement(action.icon) ? function (props) {
        return /*#__PURE__*/React__default.cloneElement(action.icon, props);
      } : action.icon // alternatively you can pass the
      ,
      iconDescription: action.labelText,
      testId: "".concat(testId, "-button-").concat(action.id)
    }) : (/*#__PURE__*/React__default.cloneElement(action.customActionComponent, {
      key: "icon-".concat(action.id)
    }));
  }))));
};
DashboardHeader.propTypes = propTypes;
DashboardHeader.defaultProps = defaultProps;
DashboardHeader.__docgenInfo = {
  "description": "Renders the dashboard header at the top of the dashboard",
  "methods": [],
  "displayName": "DashboardHeader",
  "props": {
    "title": {
      "defaultValue": {
        "value": "null",
        "computed": false
      },
      "description": "title of the dashboard",
      "type": {
        "name": "string"
      },
      "required": false
    },
    "description": {
      "defaultValue": {
        "value": "null",
        "computed": false
      },
      "description": "Optional description of the dashboard",
      "type": {
        "name": "string"
      },
      "required": false
    },
    "lastUpdated": {
      "defaultValue": {
        "value": "null",
        "computed": false
      },
      "description": "string that represents the last updated date",
      "type": {
        "name": "string"
      },
      "required": false
    },
    "lastUpdatedLabel": {
      "defaultValue": {
        "value": "'Last updated:'",
        "computed": false
      },
      "description": "i18n label for last updated text",
      "type": {
        "name": "string"
      },
      "required": false
    },
    "filter": {
      "defaultValue": {
        "value": "null",
        "computed": false
      },
      "description": "Optional filter component that might be used to filter this dashboard",
      "type": {
        "name": "node"
      },
      "required": false
    },
    "actions": {
      "defaultValue": {
        "value": "[]",
        "computed": false
      },
      "description": "optional actions that will be rendered in the Dashboard header and used in onDashboardAction",
      "type": {
        "name": "arrayOf",
        "value": {
          "name": "shape",
          "value": {
            "id": {
              "name": "string",
              "description": "Unique id of the action",
              "required": true
            },
            "labelText": {
              "name": "string",
              "description": "used as the description to show for the icon",
              "required": false
            },
            "icon": {
              "name": "union",
              "value": [{
                "name": "enum",
                "computed": true,
                "value": "bundledIconNames"
              }, {
                "name": "shape",
                "value": {
                  "width": {
                    "name": "string",
                    "required": false
                  },
                  "height": {
                    "name": "string",
                    "required": false
                  },
                  "viewBox": {
                    "name": "string",
                    "required": true
                  },
                  "svgData": {
                    "name": "custom",
                    "raw": "SvgPropType.isRequired",
                    "required": true
                  }
                }
              }, {
                "name": "object"
              }, {
                "name": "element"
              }],
              "description": "icon ultimately gets passed through all the way to <Button>, which has this same copied proptype definition for icon",
              "required": false
            },
            "customActionComponent": {
              "name": "node",
              "description": "Optional custom component",
              "required": false
            }
          }
        }
      },
      "required": false
    },
    "onDashboardAction": {
      "defaultValue": {
        "value": "null",
        "computed": false
      },
      "description": "callback invoked if a dashboard action is clicked",
      "type": {
        "name": "func"
      },
      "required": false
    },
    "hasLastUpdated": {
      "defaultValue": {
        "value": "true",
        "computed": false
      },
      "description": "If the component should render the last updated section",
      "type": {
        "name": "bool"
      },
      "required": false
    },
    "testId": {
      "defaultValue": {
        "value": "'dashboard-header'",
        "computed": false
      },
      "description": "",
      "type": {
        "name": "string"
      },
      "required": false
    }
  }
};
var DashboardHeader$1 = DashboardHeader;

export { DashboardHeader$1 as default };
