@primer/react
Version:
An implementation of GitHub's Primer Design System using React
116 lines (98 loc) • 3.22 kB
JavaScript
;
var React = require('react');
var PageLayout = require('../PageLayout/PageLayout.js');
function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
var React__default = /*#__PURE__*/_interopDefault(React);
function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
// ----------------------------------------------------------------------------
// SplitPageLayout
const Root = props => {
return /*#__PURE__*/React__default.default.createElement(PageLayout.PageLayout, _extends({
containerWidth: "full",
padding: "none",
columnGap: "none",
rowGap: "none",
_slotsConfig: {
header: Header,
footer: Footer
}
}, props));
};
Root.displayName = "Root";
Root.displayName = 'SplitPageLayout';
// ----------------------------------------------------------------------------
// SplitPageLayout.Header
const Header = ({
padding = 'normal',
divider = 'line',
...props
}) => {
// eslint-disable-next-line primer-react/direct-slot-children
return /*#__PURE__*/React__default.default.createElement(PageLayout.PageLayout.Header, _extends({
padding: padding,
divider: divider
}, props));
};
Header.displayName = "Header";
Header.displayName = 'SplitPageLayout.Header';
// ----------------------------------------------------------------------------
// SplitPageLayout.Content
const Content = ({
width = 'large',
padding = 'normal',
...props
}) => {
return /*#__PURE__*/React__default.default.createElement(PageLayout.PageLayout.Content, _extends({
width: width,
padding: padding
}, props));
};
Content.displayName = "Content";
Content.displayName = 'SplitPageLayout.Content';
// ----------------------------------------------------------------------------
// SplitPageLayout.Pane
const Pane = ({
position = 'start',
sticky = true,
padding = 'normal',
divider = 'line',
...props
}) => {
return /*#__PURE__*/React__default.default.createElement(PageLayout.PageLayout.Pane, _extends({
position: position,
sticky: sticky,
padding: padding,
divider: divider
}, props));
};
Pane.displayName = "Pane";
Pane.displayName = 'SplitPageLayout.Pane';
// ----------------------------------------------------------------------------
// SplitPageLayout.Footer
const Footer = ({
padding = 'normal',
divider = 'line',
...props
}) => {
// eslint-disable-next-line primer-react/direct-slot-children
return /*#__PURE__*/React__default.default.createElement(PageLayout.PageLayout.Footer, _extends({
padding: padding,
divider: divider
}, props));
};
Footer.displayName = "Footer";
Footer.displayName = 'SplitPageLayout.Footer';
// ----------------------------------------------------------------------------
// Export
const SplitPageLayout = Object.assign(Root, {
Header,
Content,
Pane,
Footer
});
exports.Content = Content;
exports.Footer = Footer;
exports.Header = Header;
exports.Pane = Pane;
exports.Root = Root;
exports.SplitPageLayout = SplitPageLayout;