"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
exports.__esModule = true;
exports.useFormPageHeader = useFormPageHeader;
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
var _react = _interopRequireDefault(require("react"));
var _designSystem = require("@wix/design-system");
var _providers = require("../../providers");
var _FormPage = require("../../components/FormPage");
var _PageSubTitle = require("../../components/PageSubTitle");
var _FormPageHeaderStCss = require("./FormPageHeader.st.css.js");
var _useIsMobile = require("../../hooks/useIsMobile");
var _jsxFileName = "/home/builduser/work/843658b9f44192f0/packages/cairo/dist/cjs/state/FormPage/useFormPageHeader.tsx";
function useFormPageHeader(child, {
  headerProps = {},
  overrides = {}
} = {}) {
  const state = (0, _providers.useFormPageContext)();
  const isMobile = (0, _useIsMobile.useIsMobile)();
  const {
    title,
    subtitle,
    breadcrumbs
  } = overrides;
  const actionsBar = /*#__PURE__*/_react.default.createElement(_FormPage.FormPageActionsBar, {
    moreActions: child.props.moreActions,
    __self: this,
    __source: {
      fileName: _jsxFileName,
      lineNumber: 37,
      columnNumber: 5
    }
  });
  const renderTitle = () => {
    if (!(title != null && title.text)) {
      return /*#__PURE__*/_react.default.createElement(_designSystem.SkeletonRectangle, {
        height: "24px",
        width: "50%",
        __self: this,
        __source: {
          fileName: _jsxFileName,
          lineNumber: 42,
          columnNumber: 14
        }
      });
    }
    const {
      text,
      badges
    } = title;
    return /*#__PURE__*/_react.default.createElement(_designSystem.Box, {
      gap: "SP2",
      verticalAlign: "middle",
      alignContent: "center",
      __self: this,
      __source: {
        fileName: _jsxFileName,
        lineNumber: 48,
        columnNumber: 7
      }
    }, /*#__PURE__*/_react.default.createElement(_designSystem.Heading, {
      size: isMobile ? 'large' : 'extraLarge',
      __self: this,
      __source: {
        fileName: _jsxFileName,
        lineNumber: 49,
        columnNumber: 9
      }
    }, text), badges && badges.length > 0 && /*#__PURE__*/_react.default.createElement(_designSystem.Box, {
      gap: "SP2",
      __self: this,
      __source: {
        fileName: _jsxFileName,
        lineNumber: 51,
        columnNumber: 11
      }
    }, badges.map((badge, index) => /*#__PURE__*/_react.default.createElement(_designSystem.Badge, (0, _extends2.default)({
      key: index
    }, badge, {
      dataHook: `form-page-header-badge-${index}`,
      __self: this,
      __source: {
        fileName: _jsxFileName,
        lineNumber: 53,
        columnNumber: 15
      }
    }), badge.text))));
  };
  return /*#__PURE__*/_react.default.createElement(_designSystem.Page.Header, (0, _extends2.default)({
    className: (0, _FormPageHeaderStCss.st)(_FormPageHeaderStCss.classes.root, {
      mobile: isMobile
    }),
    key: child.key,
    title: renderTitle(),
    subtitle: !subtitle && state.isFetching ? /*#__PURE__*/_react.default.createElement(_designSystem.SkeletonRectangle, {
      marginTop: "SP1",
      height: "12px",
      width: "70%",
      __self: this,
      __source: {
        fileName: _jsxFileName,
        lineNumber: 74,
        columnNumber: 11
      }
    }) : subtitle && /*#__PURE__*/_react.default.createElement(_PageSubTitle.PageSubTitle, (0, _extends2.default)({}, subtitle, {
      __self: this,
      __source: {
        fileName: _jsxFileName,
        lineNumber: 76,
        columnNumber: 23
      }
    })),
    actionsBar: actionsBar,
    breadcrumbs: breadcrumbs
  }, headerProps, {
    __self: this,
    __source: {
      fileName: _jsxFileName,
      lineNumber: 68,
      columnNumber: 5
    }
  }));
}
//# sourceMappingURL=useFormPageHeader.js.map