var __assign = (this && this.__assign) || function () {
    __assign = Object.assign || function(t) {
        for (var s, i = 1, n = arguments.length; i < n; i++) {
            s = arguments[i];
            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
                t[p] = s[p];
        }
        return t;
    };
    return __assign.apply(this, arguments);
};
var __rest = (this && this.__rest) || function (s, e) {
    var t = {};
    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
        t[p] = s[p];
    if (s != null && typeof Object.getOwnPropertySymbols === "function")
        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
                t[p[i]] = s[p[i]];
        }
    return t;
};
import React from 'react';
import { H1 } from '../../components/Semantic';
import { StyledDetailPageBody, StyledDetailPageFooterActions, StyledDetailPageFooterNotation, StyledDetailPageFooterContent, StyledDetailPageCard, StyledDetailPageFooter, } from './NextDetailPage.styles';
import { addSubcomponents } from '../../utils/addSubcomponents';
import { Section, SectionProvider } from '../Section';
import { NextGrid } from '../NextGrid';
import { Page } from '../PageLayout';
import { gridConfig } from './NextDetailPage.constants';
export var ViewContext = React.createContext({
    width: 'md',
});
var DetailPage_ = React.forwardRef(function DetailPage_(_a, ref) {
    var _b = _a.width, width = _b === void 0 ? 'md' : _b, children = _a.children, props = __rest(_a, ["width", "children"]);
    return (React.createElement(ViewContext.Provider, { value: { width: width } },
        React.createElement(Page, __assign({ ref: ref }, props), children)));
});
export var Heading = React.forwardRef(function Heading(props, ref) {
    return React.createElement(H1, __assign({ ref: ref }, props));
});
export var Body = React.forwardRef(function Body(props, ref) {
    var width = React.useContext(ViewContext).width;
    return (React.createElement(Page.Body, null,
        React.createElement(NextGrid.Row, null,
            React.createElement(NextGrid.Col, { colWidth: gridConfig[width].width, colStart: gridConfig[width].offset },
                React.createElement(StyledDetailPageBody, __assign({ ref: ref }, props))))));
});
export var Footer = React.forwardRef(function Footer(_a, ref) {
    var children = _a.children, props = __rest(_a, ["children"]);
    return (React.createElement(StyledDetailPageFooter, __assign({ ref: ref }, props),
        React.createElement(StyledDetailPageFooterContent, null, children)));
});
export var FooterNotation = React.forwardRef(function FooterNotation(props, ref) {
    return React.createElement(StyledDetailPageFooterNotation, __assign({ ref: ref }, props));
});
export var FooterActions = React.forwardRef(function Actions(props, ref) {
    return React.createElement(StyledDetailPageFooterActions, __assign({ ref: ref }, props));
});
export var Card = React.forwardRef(function Card(props, ref) {
    return (React.createElement(SectionProvider, null,
        React.createElement(StyledDetailPageCard, __assign({ ref: ref }, props))));
});
DetailPage_.displayName = 'DetailPage';
Heading.displayName = 'DetailPage.Heading';
Body.displayName = 'DetailPage.Body';
Footer.displayName = 'DetailPage.Footer';
Card.displayName = 'DetailPage.Card';
/**

 A detail page is used when an object is selected from a list page. The layout
 can adhere to varying predefined widths depending on use case.

 @since 10.19.0

 @see [Storybook](https://procore.github.io/core/latest/?path=/story/demos-nextdetailpage--edit)

 @see [Design Guidelines](https://design.procore.com/detail)

 */
export var DetailPage = addSubcomponents({
    Main: Page.Main,
    Header: Page.Header,
    Breadcrumbs: Page.Breadcrumbs,
    Card: Card,
    Banner: Page.Banner,
    Title: Page.Title,
    Heading: Heading,
    Tabs: Page.Tabs,
    Footer: Footer,
    FooterActions: FooterActions,
    FooterNotation: FooterNotation,
    Section: Section,
    Body: Body,
    Aside: Page.Aside,
}, DetailPage_);
//# sourceMappingURL=NextDetailPage.js.map