wix-style-react/dist/src/PageSection/PageSection.js

wix-style-react

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports["default"] = void 0;

var _react = _interopRequireDefault(require("react"));

var _propTypes = _interopRequireDefault(require("prop-types"));

var _Heading = _interopRequireDefault(require("../Heading"));

var _Text = _interopRequireDefault(require("../Text"));

var _Divider = _interopRequireDefault(require("../Divider"));

var _PageSectionSt = require("./PageSection.st.css");

var _constants = require("./constants");

/** Page Section */
var PageSection = function PageSection(_ref) {
  var dataHook = _ref.dataHook,
      showDivider = _ref.showDivider,
      title = _ref.title,
      subtitle = _ref.subtitle,
      actionsBar = _ref.actionsBar,
      className = _ref.className;
  return /*#__PURE__*/_react["default"].createElement("div", {
    className: (0, _PageSectionSt.st)(_PageSectionSt.classes.root, {
      showDivider: showDivider
    }, className),
    "data-hook": dataHook
  }, /*#__PURE__*/_react["default"].createElement("div", {
    className: _PageSectionSt.classes.content
  }, /*#__PURE__*/_react["default"].createElement("div", {
    className: _PageSectionSt.classes.titleColumn
  }, title && /*#__PURE__*/_react["default"].createElement(_Heading["default"], {
    appearance: "H2",
    dataHook: _constants.dataHooks.pageSectionTitle,
    ellipsis: true
  }, title), subtitle && /*#__PURE__*/_react["default"].createElement(_Text["default"], {
    secondary: true,
    weight: "thin",
    ellipsis: true,
    dataHook: _constants.dataHooks.pageSectionSubtitle
  }, subtitle)), actionsBar && /*#__PURE__*/_react["default"].createElement("div", {
    className: _PageSectionSt.classes.actionsBar,
    "data-hook": _constants.dataHooks.pageSectionActionsBar
  }, actionsBar)), showDivider && /*#__PURE__*/_react["default"].createElement(_Divider["default"], {
    className: _PageSectionSt.classes.divider
  }));
};

PageSection.displayName = 'PageSection';
PageSection.propTypes = {
  /** Applied as data-hook HTML attribute that can be used in the tests */
  dataHook: _propTypes["default"].string,

  /** A css class to be applied to the component's root element */
  className: _propTypes["default"].string,

  /** The main title content */
  title: _propTypes["default"].node,

  /** The subtitle content */
  subtitle: _propTypes["default"].node,

  /** A placeholder for a component that can contain actions.*/
  actionsBar: _propTypes["default"].node,

  /** Renders a divider */
  showDivider: _propTypes["default"].bool
};
PageSection.defaultProps = {};
var _default = PageSection;
exports["default"] = _default;