@massds/mayflower-react/dist/PageHeader/index.mjs

React versions of Mayflower design system UI components

/**
 * PageHeader module.
 * @module @massds/mayflower-react/PageHeader
 * @requires module:@massds/mayflower-assets/scss/03-organisms/page-header
 * @requires module:@massds/mayflower-assets/scss/01-atoms/publish-state
 */
import React from "react";
import PropTypes from "prop-types";
import classNames from "classnames";

// import child components
import Paragraph from "../Paragraph/index.mjs";
import PublishState from "../PublishState/index.mjs";
const PageHeader = pageHeader => {
  const category = pageHeader.category,
    title = pageHeader.title,
    subTitle = pageHeader.subTitle,
    optionalContents = pageHeader.optionalContents,
    publishState = pageHeader.publishState;
  const pageHeaderClasses = classNames('ma__page-header', {
    'ma__page-header--has-optional-content': optionalContents
  });
  return /*#__PURE__*/React.createElement("section", {
    className: pageHeaderClasses
  }, /*#__PURE__*/React.createElement("div", {
    className: "ma__page-header__content"
  }, publishState && /*#__PURE__*/React.createElement("div", {
    className: "ma__page-header__publish-state"
  }, /*#__PURE__*/React.createElement(PublishState, publishState)), category && /*#__PURE__*/React.createElement("div", {
    className: "ma__page-header__category"
  }, category), /*#__PURE__*/React.createElement("h1", {
    className: "ma__page-header__title"
  }, category && /*#__PURE__*/React.createElement("span", {
    className: "visually-hidden"
  }, /*#__PURE__*/React.createElement("span", null, category), /*#__PURE__*/React.createElement("span", null, "\xA0")), title), subTitle && /*#__PURE__*/React.createElement("div", {
    className: "ma__page-header__sub-title"
  }, subTitle)));
};
PageHeader.propTypes = process.env.NODE_ENV !== "production" ? {
  /** render publish state above category */
  publishState: PropTypes.shape(PublishState.propTypes),
  /** render category/prefix above title */
  category: PropTypes.string,
  /** Render title text */
  title: PropTypes.string,
  /** Render subTitle text */
  subTitle: PropTypes.string,
  /** optional array of paragraphs `@atoms/headings/CompHeading` */
  optionalContents: PropTypes.arrayOf(PropTypes.shape(Paragraph.propTypes))
} : {};
export default PageHeader;