braid-design-system/dist/lib/components/PageBlock/PageBlock.cjs

Themeable design system for the SEEK Group

"use strict";
const jsxRuntime = require("react/jsx-runtime");
const lib_components_Box_Box_cjs = require("../Box/Box.cjs");
const lib_components_ContentBlock_ContentBlock_cjs = require("../ContentBlock/ContentBlock.cjs");
const lib_components_private_buildDataAttributes_cjs = require("../private/buildDataAttributes.cjs");
const lib_components_PageBlock_pageBlockGutters_cjs = require("./pageBlockGutters.cjs");
const validPageBlockComponents = [
  "div",
  "article",
  "aside",
  "main",
  "section",
  "nav"
];
const PageBlock = ({
  children,
  width = "large",
  component: componentProp,
  data,
  ...restProps
}) => {
  const component = componentProp && validPageBlockComponents.includes(componentProp) ? componentProp : "div";
  return /* @__PURE__ */ jsxRuntime.jsx(
    lib_components_Box_Box_cjs.Box,
    {
      width: "full",
      component,
      paddingX: lib_components_PageBlock_pageBlockGutters_cjs.pageBlockGutters,
      ...lib_components_private_buildDataAttributes_cjs.buildDataAttributes({ data, validateRestProps: restProps }),
      children: width === "full" ? children : /* @__PURE__ */ jsxRuntime.jsx(lib_components_ContentBlock_ContentBlock_cjs.ContentBlock, { width, children })
    }
  );
};
exports.PageBlock = PageBlock;