@atlaskit/page/dist/cjs/page.js

A page layout organizes sections on a page using a grid and grid columns.

/* page.tsx generated by @compiled/babel-plugin v0.39.1 */
"use strict";

var _typeof = require("@babel/runtime/helpers/typeof");
Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = void 0;
require("./page.compiled.css");
var React = _interopRequireWildcard(require("react"));
var _runtime = require("@compiled/react/runtime");
var _constants = require("./constants");
function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
var styles = {
  banner: "_1bsb1osq _kqsw1n9t",
  bannerContainer: "_16jlkb7n _1o9zidpf _i0dl1wug _v564evma _1bsb1osq _kqswh2mm _1pby11wp",
  pageContent: "_16jlkb7n _1o9zkb7n _i0dl1wug _1ul9idpf _kqswh2mm _1pbykb7n",
  wrapper: "_1e0c1txw _1bsb1osq _1tke1osq _2lx21bp4",
  mainContainer: "_16jlkb7n _1o9zkb7n _i0dl1wug _1e0c1txw",
  navigation: "_kqswh2mm _1pbycs5v"
};

/**
 * __Page__
 *
 * Used to build page layouts.
 *
 * Has built in support for positioning [banners](https://atlassian.design/components/banner/examples)
 * and the deprecated `@atlaskit/navigation`.
 *
 * - [Examples](https://atlaskit.atlassian.com/packages/design-system/page)
 */
var Page = function Page(_ref) {
  var _ref$isBannerOpen = _ref.isBannerOpen,
    isBannerOpen = _ref$isBannerOpen === void 0 ? false : _ref$isBannerOpen,
    _ref$bannerHeight = _ref.bannerHeight,
    bannerHeight = _ref$bannerHeight === void 0 ? _constants.defaultBannerHeight : _ref$bannerHeight,
    banner = _ref.banner,
    navigation = _ref.navigation,
    children = _ref.children,
    testId = _ref.testId;
  return /*#__PURE__*/React.createElement("div", {
    "data-testid": testId,
    className: (0, _runtime.ax)([styles.wrapper])
  }, banner ? /*#__PURE__*/React.createElement("div", {
    style: {
      height: isBannerOpen ? "".concat(bannerHeight, "px") : '0'
    },
    "aria-hidden": !isBannerOpen,
    "data-testid": testId ? "".concat(testId, "--banner-container") : undefined,
    className: (0, _runtime.ax)([styles.bannerContainer])
  }, /*#__PURE__*/React.createElement("div", {
    className: (0, _runtime.ax)([styles.banner])
  }, banner)) : null, /*#__PURE__*/React.createElement("div", {
    className: (0, _runtime.ax)([styles.mainContainer])
  }, /*#__PURE__*/React.createElement("div", {
    className: (0, _runtime.ax)([styles.navigation])
  }, navigation), /*#__PURE__*/React.createElement("div", {
    className: (0, _runtime.ax)([styles.pageContent])
  }, children)));
};
var _default = exports.default = Page;