@procore/core-react
Version:
React library of Procore Design Guidelines
93 lines (86 loc) • 3.82 kB
JavaScript
var _excluded = ["width", "hasNavigation", "children"],
_excluded2 = ["visible"];
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); }
function _objectWithoutProperties(e, t) { if (null == e) return {}; var o, r, i = _objectWithoutPropertiesLoose(e, t); if (Object.getOwnPropertySymbols) { var n = Object.getOwnPropertySymbols(e); for (r = 0; r < n.length; r++) o = n[r], -1 === t.indexOf(o) && {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]); } return i; }
function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (-1 !== e.indexOf(n)) continue; t[n] = r[n]; } return t; }
import React from 'react';
import { AnchorNavigationProvider } from '../AnchorNavigation/AnchorNavigationProvider';
import { DetailPage, DetailPageViewContext } from '../DetailPage/DetailPage';
import { Page } from '../PageLayout/PageLayout';
import { spacing } from '../_styles/spacing';
import { addSubcomponents } from '../_utils/addSubcomponents';
var SettingsPage_ = /*#__PURE__*/React.forwardRef(function SettingsPage_(_ref, ref) {
var _ref$width = _ref.width,
width = _ref$width === void 0 ? 'block' : _ref$width,
_ref$hasNavigation = _ref.hasNavigation,
hasNavigation = _ref$hasNavigation === void 0 ? true : _ref$hasNavigation,
children = _ref.children,
props = _objectWithoutProperties(_ref, _excluded);
return /*#__PURE__*/React.createElement(DetailPageViewContext.Provider, {
value: {
width: width,
hasNavigation: hasNavigation
}
}, /*#__PURE__*/React.createElement(AnchorNavigationProvider, {
offset: spacing.xs
}, /*#__PURE__*/React.createElement(Page, _extends({
ref: ref
}, props, {
"data-core-react": "settings-page"
}), children)));
});
export var Footer = /*#__PURE__*/React.forwardRef(function Footer(_ref2, ref) {
var visible = _ref2.visible,
props = _objectWithoutProperties(_ref2, _excluded2);
return visible ? /*#__PURE__*/React.createElement(DetailPage.Footer, _extends({
ref: ref
}, props)) : null;
});
SettingsPage_.displayName = 'SettingsPage';
Footer.displayName = 'SettingsPage.Footer';
/**
A settings page is basically a copy of DetailPage. However, it may have some differences in a future.
- SettingsPage
- SettingsPage.Main
- SettingsPage.Header
- SettingsPage.Breadcrumbs
- Breadcrumbs
- SettingsPage.Banner
- Banner
- SettingsPage.Title
- Title or H1
- SettingsPage.Tabs
- Tabs
- SettingsPage.Body
- SettingsPage.Title
- SettingsPage.Banner
- SettingsPage.Card
- SettingsPage.Banner
- SettingsPage.Section
- SettingsPage.Section
- SettingsPage.Section
- SettingsPage.Footer or Form.SettingsPageFooter
- SettingsPage.FooterNotation
- SettingsPage.FooterActions
- Button
- Panel
@since TBD
@see [Storybook](https://stories.core.procore.com/?path=/story/core-react_demos-detailpage--edit)
@see [Design Guidelines](https://design.procore.com/detail)
*/
export var SettingsPage = addSubcomponents({
Main: Page.Main,
Header: Page.Header,
Breadcrumbs: Page.Breadcrumbs,
Card: DetailPage.Card,
Banner: Page.Banner,
Title: Page.Title,
Heading: DetailPage.Heading,
Tabs: Page.Tabs,
Footer: Footer,
FooterActions: DetailPage.FooterActions,
FooterNotation: DetailPage.FooterNotation,
Section: DetailPage.Section,
Body: DetailPage.Body
}, SettingsPage_);
//# sourceMappingURL=SettingsPage.js.map