wix-style-react/dist/src/BaseModalLayout/LayoutBlocks/Header/Header.js

wix-style-react

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
exports.__esModule = true;
exports.Header = void 0;
var _react = _interopRequireDefault(require("react"));
var _propTypes = _interopRequireDefault(require("prop-types"));
var _HeaderSt = require("./Header.st.css");
var _ModalHeading = _interopRequireDefault(require("./ModalHeading"));
var _constants = require("../../constants");
var _Text = _interopRequireDefault(require("../../../Text"));
var _Divider = _interopRequireDefault(require("../../../Divider"));
var _BaseModalLayoutContext = require("../../BaseModalLayoutContext");
var _ariaLabels = require("../../../common/accessibility/ariaLabels");
var _jsxFileName = "/home/builduser/work/a9c1ac8876d5057c/packages/wix-style-react/dist/cjs/BaseModalLayout/LayoutBlocks/Header/Header.js";
var Header = _ref => {
  var {
    dataHook,
    className,
    showHeaderDivider = false,
    titleSize,
    titleTag
  } = _ref;
  var {
    headerClassName,
    title,
    subtitle
  } = (0, _BaseModalLayoutContext.useBaseModalLayoutContext)();
  return (title || subtitle) && /*#__PURE__*/_react.default.createElement("div", {
    "data-hook": dataHook,
    className: (0, _HeaderSt.st)(_HeaderSt.classes.root, headerClassName, className),
    __self: void 0,
    __source: {
      fileName: _jsxFileName,
      lineNumber: 22,
      columnNumber: 7
    }
  }, /*#__PURE__*/_react.default.createElement("div", {
    className: _HeaderSt.classes.innerContent,
    __self: void 0,
    __source: {
      fileName: _jsxFileName,
      lineNumber: 26,
      columnNumber: 9
    }
  }, typeof title === 'string' ? /*#__PURE__*/_react.default.createElement(Header.Title, {
    titleSize: titleSize,
    titleTag: titleTag,
    __self: void 0,
    __source: {
      fileName: _jsxFileName,
      lineNumber: 28,
      columnNumber: 13
    }
  }, title) : title, subtitle && /*#__PURE__*/_react.default.createElement(_Text.default, {
    className: _HeaderSt.classes.subtitle,
    secondary: true,
    dataHook: _constants.dataHooks.headerSubtitle,
    id: _ariaLabels.ariaLabels.describedBy,
    __self: void 0,
    __source: {
      fileName: _jsxFileName,
      lineNumber: 35,
      columnNumber: 13
    }
  }, subtitle)), showHeaderDivider && /*#__PURE__*/_react.default.createElement(_Divider.default, {
    __self: void 0,
    __source: {
      fileName: _jsxFileName,
      lineNumber: 45,
      columnNumber: 31
    }
  })) || null;
};
exports.Header = Header;
Header.Title = _ref2 => {
  var {
    titleSize,
    titleTag,
    children
  } = _ref2;
  return /*#__PURE__*/_react.default.createElement(_ModalHeading.default, {
    size: titleSize,
    as: titleTag,
    children: children,
    className: _HeaderSt.classes.title,
    dataHook: _constants.dataHooks.headerTitle,
    id: _ariaLabels.ariaLabels.labelledBy,
    __self: void 0,
    __source: {
      fileName: _jsxFileName,
      lineNumber: 53,
      columnNumber: 3
    }
  });
};
Header.displayName = 'BaseModalLayout.Header';
Header.propTypes = {
  /** additional css classes */
  className: _propTypes.default.string,
  /** data hook for testing */
  dataHook: _propTypes.default.string,
  /** The modal's title */
  title: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.node]),
  /** The modal's subtitle */
  subtitle: _propTypes.default.string,
  /** Shows a divider at the bottom of the Header*/
  showHeaderDivider: _propTypes.default.bool
};
//# sourceMappingURL=Header.js.map