@shopify/polaris/dist/esm/components/Page/Page.js

Shopify’s product component library

import { objectWithoutProperties as _objectWithoutProperties } from '../../_virtual/_rollupPluginBabelHelpers.js';
import React$1 from 'react';
import { useFeatures } from '../../utilities/features/hooks.js';
import { classNames } from '../../utilities/css.js';
import { Header as Header$1 } from './components/Header/Header.js';
import styles from './Page.scss.js';

function Page(_ref) {
  var {
    children,
    fullWidth,
    narrowWidth
  } = _ref,
      rest = _objectWithoutProperties(_ref, ["children", "fullWidth", "narrowWidth"]);

  var {
    newDesignLanguage
  } = useFeatures();
  var className = classNames(styles.Page, fullWidth && styles.fullWidth, narrowWidth && styles.narrowWidth, newDesignLanguage && styles.newDesignLanguage);
  var hasHeaderContent = rest.title != null && rest.title !== '' || rest.primaryAction != null || rest.secondaryActions != null && rest.secondaryActions.length > 0 || rest.actionGroups != null && rest.actionGroups.length > 0 || rest.breadcrumbs != null && rest.breadcrumbs.length > 0;
  var headerMarkup = hasHeaderContent ? /*#__PURE__*/React$1.createElement(Header$1, rest) : null;
  return /*#__PURE__*/React$1.createElement("div", {
    className: className
  }, headerMarkup, /*#__PURE__*/React$1.createElement("div", {
    className: styles.Content
  }, children));
}

export { Page };