"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = void 0;
var _react = _interopRequireDefault(require("react"));
var _ = require("../..");
var _utils = require("../../common/utils");
var _ProgressDonutChart = _interopRequireDefault(require("./ProgressDonutChart"));
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
var Title = function Title(_ref) {
  var percentageCompleted = _ref.percentageCompleted,
    _ref$maxPercentage = _ref.maxPercentage,
    maxPercentage = _ref$maxPercentage === void 0 ? 100 : _ref$maxPercentage,
    _ref$title = _ref.title,
    title = _ref$title === void 0 ? 'Default list title' : _ref$title,
    description = _ref.description,
    viewAllLabel = _ref.viewAllLabel,
    displayMode = _ref.displayMode,
    _ref$showProgress = _ref.showProgress,
    showProgress = _ref$showProgress === void 0 ? true : _ref$showProgress,
    _ref$onViewAll = _ref.onViewAll,
    onViewAll = _ref$onViewAll === void 0 ? function () {} : _ref$onViewAll,
    onClose = _ref.onClose;
  return displayMode === 'DRAWER' ? _react.default.createElement(_.Box, {
    py: 4
  }, _react.default.createElement(_.Flexbox, {
    container: true,
    gap: 5,
    justifyContent: "center",
    direction: "column",
    alignItems: "center"
  }, showProgress && percentageCompleted && _react.default.createElement(_ProgressDonutChart.default, {
    completed: percentageCompleted,
    total: maxPercentage,
    size: "l"
  }), _react.default.createElement(_.Flexbox, {
    container: true,
    item: true,
    direction: "column",
    alignItems: "center"
  }, (0, _utils.isElement)(description) && description || _react.default.createElement(_.Typography, {
    type: "title3",
    weight: "bold",
    color: function color(t) {
      return t.colorTokens.action.text_default;
    }
  }, description)))) : _react.default.createElement(_.Flexbox, {
    container: true,
    gap: 5,
    alignItems: "center"
  }, showProgress && percentageCompleted && _react.default.createElement(_.Flexbox, {
    item: true,
    shrink: 0
  }, _react.default.createElement(_ProgressDonutChart.default, {
    completed: percentageCompleted,
    total: maxPercentage,
    size: "s"
  })), _react.default.createElement(_.Flexbox, {
    container: true,
    item: true,
    direction: "column",
    grow: 1,
    gap: 0,
    sm: {
      gap: 1
    }
  }, _react.default.createElement(_.Typography, {
    type: "title3"
  }, title), (0, _utils.isElement)(description) && description || _react.default.createElement(_.Typography, {
    type: "secondary"
  }, description)), viewAllLabel && _react.default.createElement(_.Flexbox, {
    item: true,
    shrink: 0
  }, _react.default.createElement(_.Button.Pill, {
    variant: "tertiary",
    size: "m",
    onClick: onViewAll,
    "data-custom-prevent-click-outside": true
  }, viewAllLabel)), percentageCompleted === maxPercentage && onClose && _react.default.createElement(_.Button, {
    variant: "neutral",
    onClick: onClose
  }, _react.default.createElement(_.Icon.Cross16, null)));
};
var _default = exports.default = Title;