import React, { useMemo } from 'react';
import { isFunction } from '@pisell/utils';
import Buttons from "./Buttons";
import "./index.less";
var Header = function Header(_ref) {
  var buttons = _ref.buttons,
    title = _ref.title,
    subTitle = _ref.subTitle,
    showTitle = _ref.showTitle,
    showSubTitle = _ref.showSubTitle;
  var showHeader = useMemo(function () {
    return title && showTitle || (Array.isArray(buttons) ? buttons.length > 0 : buttons) || subTitle && showSubTitle;
  }, [buttons, title, subTitle, showTitle, showSubTitle]);
  var titleNode = useMemo(function () {
    if (isFunction(title)) {
      return title();
    }
    return title;
  }, [title]);
  var buttonsNode = useMemo(function () {
    if (Array.isArray(buttons)) {
      return /*#__PURE__*/React.createElement(Buttons, {
        list: buttons
      });
    }
    return buttons;
  }, [buttons]);
  var subTitleNode = useMemo(function () {
    if (isFunction(subTitle)) {
      return subTitle();
    }
    return subTitle;
  }, [subTitle]);
  return showHeader ? /*#__PURE__*/React.createElement("div", {
    className: "materials-grid-header-wrap"
  }, /*#__PURE__*/React.createElement("div", {
    className: 'materials-grid-header'
  }, showTitle && /*#__PURE__*/React.createElement("div", {
    className: 'left-wrap'
  }, titleNode), /*#__PURE__*/React.createElement("div", {
    className: 'right-wrap'
  }, buttonsNode)), showSubTitle && subTitleNode && /*#__PURE__*/React.createElement("div", {
    className: 'materials-grid-sub-title'
  }, subTitleNode)) : null;
};
export default Header;