@procore/core-react 11.20.0-vite.1 → 11.21.0

package/dist/PageLayout/PageLayout.js

@@ -0,0 +1,332 @@
+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 __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+var __generator = (this && this.__generator) || function (thisArg, body) {
+    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
+    return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
+    function verb(n) { return function (v) { return step([n, v]); }; }
+    function step(op) {
+        if (f) throw new TypeError("Generator is already executing.");
+        while (_) try {
+            if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
+            if (y = 0, t) op = [op[0] & 2, t.value];
+            switch (op[0]) {
+                case 0: case 1: t = op; break;
+                case 4: _.label++; return { value: op[1], done: false };
+                case 5: _.label++; y = op[1]; op = [0]; continue;
+                case 7: op = _.ops.pop(); _.trys.pop(); continue;
+                default:
+                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
+                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
+                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
+                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
+                    if (t[2]) _.ops.pop();
+                    _.trys.pop(); continue;
+            }
+            op = body.call(thisArg, _);
+        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
+        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
+    }
+};
+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 throttle from 'lodash.throttle';
+import React from 'react';
+import { Grid } from '../Grid/Grid';
+import { TearsheetContext } from '../Tearsheet/Tearsheet';
+import { useResize } from '../_hooks/Resize';
+import { useScroll } from '../_hooks/Scroll';
+import { useUpdateEffect } from '../_hooks/useUpdateEffect';
+import { addSubcomponents } from '../_utils/addSubcomponents';
+import { mergeRefs } from '../_utils/mergeRefs';
+import { pageLayoutRootDataAttr } from './PageLayout.constants';
+import { animationDuration, StyledAside, StyledAsideFluidContainer, StyledAsidePanel, StyledBody, StyledFooter, StyledPageBanner, StyledPageBreadcrumbs, StyledPageContainer, StyledPageHeader, StyledPageMain, StyledPageTabs, StyledPageTitle, } from './PageLayout.styles';
+import { getBottomOffsetForFooterUseCase, getGlobalBottomOffset, getGlobalTopOffset, getIsIntersectingVertically, getRightOffset, wait, } from './PageLayout.utils';
+var defaultAsideIsOpen = false;
+export var PageContext = React.createContext({
+    bodyRef: React.createRef(),
+    footerRef: React.createRef(),
+    containerRef: React.createRef(),
+    aside: {
+        open: function () { return Promise.resolve(); },
+        close: function () { return Promise.resolve(); },
+        isOpen: defaultAsideIsOpen,
+    },
+});
+var PageGrid = function (_a) {
+    var gutterX = _a.gutterX, props = __rest(_a, ["gutterX"]);
+    return React.createElement(Grid, __assign({ gutterX: gutterX !== null && gutterX !== void 0 ? gutterX : 'lg' }, props));
+};
+var PageHeader = React.forwardRef(function PageHeader(_a, ref) {
+    var transparent = _a.transparent, props = __rest(_a, ["transparent"]);
+    return React.createElement(StyledPageHeader, __assign({ "$transparent": transparent }, props, { ref: ref }));
+});
+var PageBody = React.forwardRef(function PageBody(props, ref) {
+    var bodyRef = React.useContext(PageContext).bodyRef;
+    return React.createElement(StyledBody, __assign({}, props, { ref: mergeRefs(ref, bodyRef) }));
+});
+var PageFooter = React.forwardRef(function PageFooter(props, ref) {
+    var _a = React.useContext(PageContext), bodyRef = _a.bodyRef, footerRef = _a.footerRef, aside = _a.aside;
+    var addListener = React.useContext(TearsheetContext).addListener;
+    var _b = React.useState(false), isIntersectingWithBody = _b[0], setIsIntersectingWithBody = _b[1];
+    function calculateIntersections() {
+        if (!footerRef.current || !bodyRef.current) {
+            return;
+        }
+        setIsIntersectingWithBody(getIsIntersectingVertically(bodyRef.current, footerRef.current));
+    }
+    React.useEffect(function () {
+        var _a;
+        var tabWasPressed = false;
+        var onActiveElementChange = function () {
+            if (tabWasPressed &&
+                footerRef.current &&
+                document.activeElement &&
+                getIsIntersectingVertically(document.activeElement, footerRef.current)) {
+                document.activeElement.scrollIntoView();
+            }
+        };
+        var onKeyDown = function (e) {
+            if (e.code === 'Tab') {
+                tabWasPressed = true;
+                // setTimeout is added to the end of async queue
+                // after all already attached eventListeners
+                // `tabWasPressed` marked as `false` after all events
+                // which can be triggered by pressing Tab
+                setTimeout(function () {
+                    tabWasPressed = false;
+                }, 0);
+            }
+        };
+        (_a = bodyRef.current) === null || _a === void 0 ? void 0 : _a.addEventListener('focusin', onActiveElementChange);
+        document.addEventListener('keydown', onKeyDown, true);
+        return function () {
+            var _a;
+            (_a = bodyRef.current) === null || _a === void 0 ? void 0 : _a.removeEventListener('focusin', onActiveElementChange);
+            document.removeEventListener('keydown', onKeyDown, true);
+        };
+    }, []);
+    React.useEffect(function () { return addListener('scroll', calculateIntersections); }, []);
+    React.useEffect(calculateIntersections, []);
+    useScroll({ onScroll: calculateIntersections });
+    useResize({ onResize: calculateIntersections });
+    return (React.createElement(StyledFooter, __assign({}, props, { "$isAsideOpen": aside.isOpen, "$hasShadow": isIntersectingWithBody, "data-sticky": isIntersectingWithBody ? 'sticky' : '', ref: mergeRefs(ref, footerRef) })));
+});
+var PageAside = React.forwardRef(function PageAside(_a, ref) {
+    var _this = this;
+    var children = _a.children, controlledIsOpen = _a.open, props = __rest(_a, ["children", "open"]);
+    var _b = React.useContext(PageContext).aside, contextIsOpen = _b.isOpen, open = _b.open, close = _b.close;
+    var _c = React.useContext(TearsheetContext), tearsheetPlacement = _c.placement, addTearsheetListener = _c.addListener;
+    var _d = React.useContext(PageContext), footerRef = _d.footerRef, containerRef = _d.containerRef;
+    var innerRef = React.useRef(null);
+    var _e = React.useState(null), topOffset = _e[0], setTopOffset = _e[1];
+    var _f = React.useState(0), bottomOffset = _f[0], setBottomOffset = _f[1];
+    var _g = React.useState(0), rightOffset = _g[0], setRightOffset = _g[1];
+    var initialIsOpen = controlledIsOpen !== null && controlledIsOpen !== void 0 ? controlledIsOpen : contextIsOpen;
+    var _h = React.useState(initialIsOpen ? 'open' : 'closed'), animationStatus = _h[0], setAnimationStatus = _h[1];
+    var _j = React.useState(initialIsOpen), isOpen = _j[0], setIsOpen = _j[1];
+    var throttledToggle = React.useCallback(throttle(function (isOpen) {
+        if (isOpen) {
+            open();
+        }
+        else {
+            close();
+        }
+    }, 
+    // wait just a little longer than the animation duration to avoid odd blinking
+    animationDuration.panel + 100, { trailing: true }), []);
+    React.useEffect(function () {
+        throttledToggle(controlledIsOpen);
+    }, [controlledIsOpen, throttledToggle]);
+    React.useEffect(function () {
+        setIsOpen(contextIsOpen);
+    }, []);
+    useUpdateEffect(function () {
+        ;
+        (function () { return __awaiter(_this, void 0, void 0, function () {
+            return __generator(this, function (_a) {
+                switch (_a.label) {
+                    case 0:
+                        if (!contextIsOpen) return [3 /*break*/, 3];
+                        setIsOpen(true);
+                        // allow browsers to recalculate the layout
+                        return [4 /*yield*/, wait(0)];
+                    case 1:
+                        // allow browsers to recalculate the layout
+                        _a.sent();
+                        setAnimationStatus('opening');
+                        return [4 /*yield*/, wait(animationDuration.panel)];
+                    case 2:
+                        _a.sent();
+                        setAnimationStatus('open');
+                        return [2 /*return*/];
+                    case 3:
+                        setAnimationStatus('closing');
+                        return [4 /*yield*/, wait(animationDuration.panel)];
+                    case 4:
+                        _a.sent();
+                        setAnimationStatus('closed');
+                        setIsOpen(false);
+                        return [2 /*return*/];
+                }
+            });
+        }); })();
+    }, [contextIsOpen]);
+    function calculateOffsets() {
+        calculateHorizontalOffsets();
+        calculateVerticalOffsets();
+    }
+    function calculateHorizontalOffsets() {
+        if (!containerRef.current) {
+            return;
+        }
+        setRightOffset(getRightOffset(containerRef.current));
+    }
+    function calculateVerticalOffsets() {
+        if (!innerRef.current || !containerRef.current) {
+            return;
+        }
+        var globalTopOffset = getGlobalTopOffset(containerRef.current);
+        setTopOffset(globalTopOffset);
+        var globalBottomOffset = getGlobalBottomOffset(containerRef.current);
+        setBottomOffset(globalBottomOffset);
+        if (!footerRef.current) {
+            return;
+        }
+        var bottomOffset = getBottomOffsetForFooterUseCase(footerRef.current, globalBottomOffset);
+        if (bottomOffset !== null) {
+            setBottomOffset(bottomOffset);
+        }
+    }
+    useScroll({ onScroll: calculateOffsets });
+    useResize({ onResize: calculateOffsets });
+    React.useEffect(function () {
+        if (tearsheetPlacement) {
+            return addTearsheetListener('afterShow', calculateOffsets);
+        }
+        calculateOffsets();
+    }, []);
+    useUpdateEffect(calculateOffsets, [contextIsOpen, animationStatus]);
+    var asideOpen = ['open', 'opening'].includes(animationStatus);
+    var asideClosed = ['closed', 'closing'].includes(animationStatus);
+    return isOpen ? (React.createElement(StyledAside, __assign({}, props, { "$open": asideOpen, "$closed": asideClosed, ref: mergeRefs(ref, innerRef, calculateOffsets) }),
+        React.createElement(StyledAsideFluidContainer, { "$open": asideOpen, "$closed": asideClosed },
+            React.createElement(StyledAsidePanel, { "$offsetTop": topOffset, "$rightOffset": rightOffset, "$minusHeight": (topOffset !== null && topOffset !== void 0 ? topOffset : 0) + bottomOffset, "$closing": animationStatus === 'closing', "$opening": animationStatus === 'opening', "$closed": animationStatus === 'closed', "$altAnimation": tearsheetPlacement === 'left' }, children)))) : null;
+});
+var PageContainer = React.forwardRef(function PageContainer(props, ref) {
+    var _a = React.useState(defaultAsideIsOpen), isAsideOpen = _a[0], setIsAsideOpen = _a[1];
+    var openAside = function () {
+        setIsAsideOpen(true);
+        return wait(animationDuration.panel);
+    };
+    var closeAside = function () {
+        setIsAsideOpen(false);
+        return wait(animationDuration.panel);
+    };
+    var containerRef = React.useRef(null);
+    var bodyRef = React.useRef(null);
+    var footerRef = React.useRef(null);
+    return (React.createElement(PageContext.Provider, { value: {
+            bodyRef: bodyRef,
+            footerRef: footerRef,
+            containerRef: containerRef,
+            aside: {
+                open: openAside,
+                close: closeAside,
+                isOpen: isAsideOpen,
+            },
+        } },
+        React.createElement(StyledPageContainer, __assign({}, props, { ref: mergeRefs(ref, containerRef) }))));
+});
+var PageMain = React.forwardRef(function PageMain(props, ref) {
+    var _a;
+    var tearsheetPlacement = React.useContext(TearsheetContext).placement;
+    var attrs = (_a = {}, _a[pageLayoutRootDataAttr] = true, _a);
+    return (React.createElement(PageGrid, null,
+        React.createElement(StyledPageMain, __assign({}, props, attrs, { ref: ref, "$tearsheetPlacement": tearsheetPlacement }))));
+});
+var PageBreadcrumbs = React.forwardRef(function PageBreadcrumbs(props, ref) {
+    return React.createElement(StyledPageBreadcrumbs, __assign({ ref: ref }, props));
+});
+var PageBanner = React.forwardRef(function PageBanner(props, ref) {
+    return React.createElement(StyledPageBanner, __assign({ ref: ref }, props));
+});
+var PageTitle = React.forwardRef(function PageTitle(props, ref) {
+    return React.createElement(StyledPageTitle, __assign({ ref: ref }, props));
+});
+var PageTabs = React.forwardRef(function PageTabs(props, ref) {
+    return React.createElement(StyledPageTabs, __assign({ ref: ref }, props));
+});
+PageGrid.displayName = 'Page.Grid';
+PageHeader.displayName = 'Page.Header';
+PageBanner.displayName = 'Page.Banner';
+PageBreadcrumbs.displayName = 'Page.Breadcrumbs';
+PageTitle.displayName = 'Page.Title';
+PageTabs.displayName = 'Page.Tabs';
+PageBody.displayName = 'Page.Body';
+PageFooter.displayName = 'Page.Footer';
+PageAside.displayName = 'Page.Aside';
+PageContainer.displayName = 'Page';
+PageMain.displayName = 'Page.Main';
+/**
+  Building block elements for layout that should be used to build a common skeleton of a page.
+
+  - Page
+    - Page.Main
+      - Page.Header
+        - Page.Breadcrumbs
+          - Breadcrumbs
+        - Page.Banner
+          - Banner
+        - Page.Title
+          - Title or H1
+        - Page.Tabs
+          - Tabs
+      - Page.Body
+      - Page.Footer
+    - Page.Aside
+
+Other helpers, such as Page.Grid, Page.Row and Page.Column are thin wrappers over Grid components and share the same API.
+ */
+export var Page = addSubcomponents({
+    Header: PageHeader,
+    Banner: PageBanner,
+    Breadcrumbs: PageBreadcrumbs,
+    Title: PageTitle,
+    Tabs: PageTabs,
+    Footer: PageFooter,
+    Body: PageBody,
+    Main: PageMain,
+    Aside: PageAside,
+    // Grid utilities
+    Grid: PageGrid,
+    Column: Grid.Col,
+    Row: Grid.Row,
+}, PageContainer);
+//# sourceMappingURL=PageLayout.js.map

package/dist/PageLayout/PageLayout.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PageLayout.js","sourceRoot":"","sources":["../../src/PageLayout/PageLayout.tsx"],"names":[],"mappings":"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"}

package/dist/PageLayout/PageLayout.styles.d.ts

@@ -0,0 +1,43 @@
+/// <reference types="react" />
+import { Placement } from '../Tearsheet/Tearsheet.types';
+export declare const adjustMaxWidth: (breakpointMinWidth: number) => number;
+export declare const StyledPageHeader: import("styled-components").StyledComponent<"div", any, {
+    $transparent?: boolean | undefined;
+}, never>;
+export declare const StyledPageTitle: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const StyledPageBreadcrumbs: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("../_utils/types").DivAttributes & import("..").BreadcrumbProps & import("react").RefAttributes<HTMLElement>> & {
+    Crumb: import("react").ForwardRefExoticComponent<((import("../_utils/types").LiAttributes & import("..").BreadcrumbCrumbProps) | (import("../_utils/types").DivAttributes & import("..").BreadcrumbCrumbProps)) & import("react").RefAttributes<HTMLDivElement | HTMLLIElement>>;
+}, any, {}, never>;
+export declare const StyledPageBanner: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const getActions: () => import("styled-components").FlattenSimpleInterpolation;
+export declare const StyledPageActions: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const StyledPageTabs: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const StyledBody: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const animationDuration: {
+    panel: number;
+};
+export declare const StyledFooter: import("styled-components").StyledComponent<"div", any, {
+    $isAsideOpen: boolean;
+    $hasShadow: boolean;
+}, never>;
+export declare const StyledAside: import("styled-components").StyledComponent<"div", any, {
+    $open: boolean;
+    $closed: boolean;
+}, never>;
+export declare const StyledAsidePanel: import("styled-components").StyledComponent<"div", any, {
+    $offsetTop: number | null;
+    $minusHeight: number;
+    $closing: boolean;
+    $closed: boolean;
+    $opening: boolean;
+    $rightOffset: number;
+    $altAnimation: boolean;
+}, never>;
+export declare const StyledPageMain: import("styled-components").StyledComponent<"div", any, {
+    $tearsheetPlacement: Placement | null;
+}, never>;
+export declare const StyledPageContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const StyledAsideFluidContainer: import("styled-components").StyledComponent<"div", any, {
+    $open: boolean;
+    $closed: boolean;
+}, never>;

package/dist/PageLayout/PageLayout.styles.js

@@ -0,0 +1,95 @@
+var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
+    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
+    return cooked;
+};
+import styled, { css, keyframes } from 'styled-components';
+import { Breadcrumbs } from '../Breadcrumbs/Breadcrumbs';
+import { minScrimSize } from '../Tearsheet/Tearsheet.styles';
+import { colors } from '../_styles/colors';
+import { getShadow } from '../_styles/shadows';
+import { spacing } from '../_styles/spacing';
+import { isIE11 } from '../_utils/isIE11';
+import { getSmallScreenBreakpointValue } from './PageLayout.utils';
+var outerPageSpacing = spacing.xl;
+export var adjustMaxWidth = function (breakpointMinWidth) {
+    return breakpointMinWidth - 0.02;
+};
+var headerCSS = css(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  // use padding instead of margin to divide the headers to maintain the background color\n  padding-top: ", "px;\n\n  margin-left: ", "px;\n  margin-right: ", "px;\n  padding-right: ", "px;\n  padding-left: ", "px;\n\n  ", "\n"], ["\n  // use padding instead of margin to divide the headers to maintain the background color\n  padding-top: ", "px;\n\n  margin-left: ", "px;\n  margin-right: ", "px;\n  padding-right: ", "px;\n  padding-left: ", "px;\n\n  ", "\n"])), spacing.lg, outerPageSpacing * -1, outerPageSpacing * -1, outerPageSpacing, outerPageSpacing, function (_a) {
+    var $transparent = _a.$transparent;
+    return !$transparent && css(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n      ", "\n      background-color: ", ";\n    "], ["\n      ", "\n      background-color: ", ";\n    "])), getShadow(1.5), colors.white);
+});
+export var StyledPageHeader = styled.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  ", "\n"], ["\n  ", "\n"])), headerCSS);
+export var StyledPageTitle = styled.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n  margin-top: ", "px;\n\n  &:last-child {\n    padding-bottom: ", "px;\n  }\n\n  &:first-child {\n    margin-top: 0;\n  }\n"], ["\n  margin-top: ", "px;\n\n  &:last-child {\n    padding-bottom: ", "px;\n  }\n\n  &:first-child {\n    margin-top: 0;\n  }\n"])), spacing.lg, spacing.lg);
+export var StyledPageBreadcrumbs = styled(Breadcrumbs)(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n  margin-top: ", "px;\n\n  &:first-child {\n    margin-top: 0;\n  }\n"], ["\n  margin-top: ", "px;\n\n  &:first-child {\n    margin-top: 0;\n  }\n"])), spacing.lg);
+export var StyledPageBanner = styled.div(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n  margin-top: ", "px;\n\n  &:first-child {\n    margin-top: 0;\n  }\n"], ["\n  margin-top: ", "px;\n\n  &:first-child {\n    margin-top: 0;\n  }\n"])), spacing.lg);
+export var getActions = function () { return css(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n  flex-shrink: 0;\n  padding-left: ", "px;\n\n  > button,\n  > a {\n    &:first-child {\n      margin-left: 0;\n    }\n\n    margin-left: ", "px;\n  }\n"], ["\n  flex-shrink: 0;\n  padding-left: ", "px;\n\n  > button,\n  > a {\n    &:first-child {\n      margin-left: 0;\n    }\n\n    margin-left: ", "px;\n  }\n"])), spacing.xl, spacing.sm); };
+export var StyledPageActions = styled.div(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n  ", "\n"], ["\n  ", "\n"])), getActions());
+export var StyledPageTabs = styled.div(templateObject_9 || (templateObject_9 = __makeTemplateObject(["\n  margin-top: ", "px;\n"], ["\n  margin-top: ", "px;\n"])), spacing.sm);
+export var StyledBody = styled.div(templateObject_10 || (templateObject_10 = __makeTemplateObject(["\n  margin-top: ", "px;\n"], ["\n  margin-top: ", "px;\n"])), spacing.xl);
+var panelWidth = 400;
+var zIndexes = {
+    panelWideScreen: 3,
+    panelNarrowScreen: 1,
+    footer: 2,
+};
+export var animationDuration = {
+    panel: 600,
+};
+export var StyledFooter = styled.div(templateObject_12 || (templateObject_12 = __makeTemplateObject(["\n  background-color: ", ";\n  margin: 0 ", "px;\n\n  ", "\n\n  position: sticky;\n  bottom: 0;\n  z-index: ", ";\n\n  ", "\n"], ["\n  background-color: ", ";\n  margin: 0 ", "px;\n\n  ", "\n\n  position: sticky;\n  bottom: 0;\n  z-index: ", ";\n\n  ", "\n"])), colors.white, outerPageSpacing * -1, function (_a) {
+    var $hasShadow = _a.$hasShadow;
+    return $hasShadow && getShadow(2, 'top');
+}, zIndexes.footer, function (_a) {
+    var $isAsideOpen = _a.$isAsideOpen;
+    return $isAsideOpen && css(templateObject_11 || (templateObject_11 = __makeTemplateObject(["\n      @media ", " {\n        z-index: ", ";\n      }\n    "], ["\n      @media ", " {\n        z-index: ", ";\n      }\n    "])), getSmallScreenBreakpointValue(), zIndexes.footer);
+});
+export var StyledAside = styled.div(templateObject_16 || (templateObject_16 = __makeTemplateObject(["\n  ", "\n\n  // remove aside block from the main flow on smaller screens, enabling overlay-like positioning\n  @media ", " {\n    position: absolute;\n    right: 0;\n  }\n"], ["\n  ", "\n\n  // remove aside block from the main flow on smaller screens, enabling overlay-like positioning\n  @media ", " {\n    position: absolute;\n    right: 0;\n  }\n"])), function (_a) {
+    var $closed = _a.$closed, $open = _a.$open;
+    return isIE11() && css(templateObject_15 || (templateObject_15 = __makeTemplateObject(["\n      display: flex;\n      flex-grow: 0;\n      flex-shrink: 0;\n      flex-basis: 0;\n\n      transition: flex-basis ", "ms;\n\n      ", "\n\n      ", "\n    "], ["\n      display: flex;\n      flex-grow: 0;\n      flex-shrink: 0;\n      flex-basis: 0;\n\n      transition: flex-basis ", "ms;\n\n      ", "\n\n      ", "\n    "])), animationDuration.panel, $closed && css(templateObject_13 || (templateObject_13 = __makeTemplateObject(["\n        flex-basis: 0;\n      "], ["\n        flex-basis: 0;\n      "]))), $open && css(templateObject_14 || (templateObject_14 = __makeTemplateObject(["\n        flex-basis: ", "px;\n      "], ["\n        flex-basis: ", "px;\n      "])), panelWidth));
+}, getSmallScreenBreakpointValue());
+var slideDistance = '100%';
+var slideIn = keyframes(templateObject_17 || (templateObject_17 = __makeTemplateObject(["\n  from {\n    transform: translateX(", ");\n  }\n  to {\n    transform: translateX(0);\n  }\n"], ["\n  from {\n    transform: translateX(", ");\n  }\n  to {\n    transform: translateX(0);\n  }\n"])), slideDistance);
+var slideOut = keyframes(templateObject_18 || (templateObject_18 = __makeTemplateObject(["\n  from {\n    transform: translateX(0);\n  }\n  to {\n    transform: translateX(", ");\n  }\n"], ["\n  from {\n    transform: translateX(0);\n  }\n  to {\n    transform: translateX(", ");\n  }\n"])), slideDistance);
+var getPanelAnimation = function () { return css(templateObject_21 || (templateObject_21 = __makeTemplateObject(["\n  ", "\n\n  ", "\n"], ["\n  ", "\n\n  ", "\n"])), function (_a) {
+    var $opening = _a.$opening;
+    return $opening && css(templateObject_19 || (templateObject_19 = __makeTemplateObject(["\n      animation: ", " ease-out ", "ms;\n    "], ["\n      animation: ", " ease-out ", "ms;\n    "])), slideIn, animationDuration.panel);
+}, function (_a) {
+    var $closing = _a.$closing;
+    return $closing && css(templateObject_20 || (templateObject_20 = __makeTemplateObject(["\n      animation: ", " ease-out ", "ms;\n    "], ["\n      animation: ", " ease-out ", "ms;\n    "])), slideOut, animationDuration.panel);
+}); };
+export var StyledAsidePanel = styled.div(templateObject_26 || (templateObject_26 = __makeTemplateObject(["\n  // position panel behind the page sticky footer on smaller screens\n  ", "\n\n  /*\n   * On smaller screens, the panel is positioned absolutely,\n   *  so the animation needs to happen here\n  */\n  @media ", " {\n    ", "\n  }\n\n  ", "\n\n  ", "\n\n  border-left: 1px solid ", ";\n  width: ", "px;\n  position: fixed;\n  background-color: ", ";\n\n  overflow: auto;\n  z-index: ", ";\n\n  ", "\n\n  ", "\n"], ["\n  // position panel behind the page sticky footer on smaller screens\n  ", "\n\n  /*\n   * On smaller screens, the panel is positioned absolutely,\n   *  so the animation needs to happen here\n  */\n  @media ", " {\n    ", "\n  }\n\n  ", "\n\n  ", "\n\n  border-left: 1px solid ", ";\n  width: ", "px;\n  position: fixed;\n  background-color: ", ";\n\n  overflow: auto;\n  z-index: ", ";\n\n  ", "\n\n  ", "\n"])), function (_a) {
+    var $rightOffset = _a.$rightOffset;
+    return css(templateObject_22 || (templateObject_22 = __makeTemplateObject(["\n    @media ", " {\n      ", "\n      border-left: 0;\n      z-index: ", ";\n      right: ", "px;\n    }\n  "], ["\n    @media ", " {\n      ", "\n      border-left: 0;\n      z-index: ", ";\n      right: ", "px;\n    }\n  "])), getSmallScreenBreakpointValue(), getShadow(2), zIndexes.panelNarrowScreen, $rightOffset);
+}, getSmallScreenBreakpointValue(), getPanelAnimation(), function (_a) {
+    var $altAnimation = _a.$altAnimation;
+    return $altAnimation && getPanelAnimation();
+}, function (_a) {
+    var $closed = _a.$closed;
+    return $closed && css(templateObject_23 || (templateObject_23 = __makeTemplateObject(["\n      display: none;\n    "], ["\n      display: none;\n    "])));
+}, colors.gray85, panelWidth, colors.gray96, zIndexes.panelWideScreen, function (_a) {
+    var $minusHeight = _a.$minusHeight;
+    return css(templateObject_24 || (templateObject_24 = __makeTemplateObject(["\n      height: calc(100vh - ", "px);\n    "], ["\n      height: calc(100vh - ", "px);\n    "])), $minusHeight);
+}, function (_a) {
+    var $offsetTop = _a.$offsetTop;
+    return $offsetTop !== null && css(templateObject_25 || (templateObject_25 = __makeTemplateObject(["\n      top: ", "px;\n    "], ["\n      top: ", "px;\n    "])), $offsetTop);
+});
+export var StyledPageMain = styled.div(templateObject_30 || (templateObject_30 = __makeTemplateObject(["\n  position: relative;\n  padding: 0 ", "px;\n  max-width: 100%;\n  background-color: ", ";\n\n  ", "\n\n  ", "\n"], ["\n  position: relative;\n  padding: 0 ", "px;\n  max-width: 100%;\n  background-color: ", ";\n\n  ", "\n\n  ", "\n"])), outerPageSpacing, colors.gray96, function () {
+    return isIE11() && css(templateObject_27 || (templateObject_27 = __makeTemplateObject(["\n      flex: 1 0 0%;\n    "], ["\n      flex: 1 0 0%;\n    "])));
+}, function (_a) {
+    var $tearsheetPlacement = _a.$tearsheetPlacement;
+    if (!$tearsheetPlacement) {
+        return '';
+    }
+    if (['top', 'bottom'].includes($tearsheetPlacement)) {
+        return css(templateObject_28 || (templateObject_28 = __makeTemplateObject(["\n        min-height: calc(100vh - ", "px);\n      "], ["\n        min-height: calc(100vh - ", "px);\n      "])), minScrimSize);
+    }
+    return css(templateObject_29 || (templateObject_29 = __makeTemplateObject(["\n      min-height: 100vh;\n    "], ["\n      min-height: 100vh;\n    "])));
+});
+export var StyledPageContainer = styled.div(templateObject_32 || (templateObject_32 = __makeTemplateObject(["\n  display: grid;\n  grid-template-columns: 1fr auto;\n  ", "\n"], ["\n  display: grid;\n  grid-template-columns: 1fr auto;\n  ", "\n"])), function () {
+    return isIE11() && css(templateObject_31 || (templateObject_31 = __makeTemplateObject(["\n      display: flex;\n      flex-wrap: wrap;\n    "], ["\n      display: flex;\n      flex-wrap: wrap;\n    "])));
+});
+export var StyledAsideFluidContainer = styled.div(templateObject_36 || (templateObject_36 = __makeTemplateObject(["\n  ", "\n"], ["\n  ", "\n"])), function (_a) {
+    var $closed = _a.$closed, $open = _a.$open;
+    return !isIE11() && css(templateObject_35 || (templateObject_35 = __makeTemplateObject(["\n      transition: width ", "ms;\n\n      ", "\n\n      ", "\n    "], ["\n      transition: width ", "ms;\n\n      ", "\n\n      ", "\n    "])), animationDuration.panel, $closed && css(templateObject_33 || (templateObject_33 = __makeTemplateObject(["\n        width: 0;\n      "], ["\n        width: 0;\n      "]))), $open && css(templateObject_34 || (templateObject_34 = __makeTemplateObject(["\n        width: ", "px;\n      "], ["\n        width: ", "px;\n      "])), panelWidth));
+});
+var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7, templateObject_8, templateObject_9, templateObject_10, templateObject_11, templateObject_12, templateObject_13, templateObject_14, templateObject_15, templateObject_16, templateObject_17, templateObject_18, templateObject_19, templateObject_20, templateObject_21, templateObject_22, templateObject_23, templateObject_24, templateObject_25, templateObject_26, templateObject_27, templateObject_28, templateObject_29, templateObject_30, templateObject_31, templateObject_32, templateObject_33, templateObject_34, templateObject_35, templateObject_36;
+//# sourceMappingURL=PageLayout.styles.js.map

package/dist/PageLayout/PageLayout.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PageLayout.styles.js","sourceRoot":"","sources":["../../src/PageLayout/PageLayout.styles.ts"],"names":[],"mappings":"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"}

package/dist/PageLayout/PageLayout.types.d.ts

@@ -0,0 +1,27 @@
+/// <reference types="react" />
+import { DivAttributes, Props } from '../_utils/types';
+interface CustomizableStyledComponent {
+    as?: string | React.ComponentType<any>;
+}
+export interface PageComponentProps extends CustomizableStyledComponent, Props, DivAttributes {
+}
+export interface PageHeaderProps extends PageComponentProps {
+    /**
+     * @description If the header should have no background.
+     * @since 10.19.0
+     */
+    transparent?: boolean;
+}
+export interface PageAsideProps extends PageComponentProps {
+    /**
+     * @description If the aside block should be open
+     * @since 10.19.0
+     */
+    open?: boolean;
+}
+export interface PageMainProps extends PageComponentProps {
+}
+export interface PageFooterProps extends PageComponentProps {
+}
+export declare type PageAsideAnimationStatus = 'open' | 'closed' | 'opening' | 'closing';
+export {};

package/dist/PageLayout/PageLayout.types.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=PageLayout.types.js.map

package/dist/PageLayout/PageLayout.types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PageLayout.types.js","sourceRoot":"","sources":["../../src/PageLayout/PageLayout.types.ts"],"names":[],"mappings":""}

package/dist/PageLayout/PageLayout.utils.d.ts

@@ -0,0 +1,8 @@
+export declare const getSmallScreenBreakpointValue: () => string;
+export declare const getIsUsingSmallScreen: () => boolean;
+export declare const wait: (ms: number) => Promise<void>;
+export declare function getBottomOffsetForFooterUseCase(footerEl: HTMLDivElement, globalBottomOffset: number): number | null;
+export declare function getGlobalBottomOffset(containerEl: HTMLDivElement): number;
+export declare function getGlobalTopOffset(containerEl: HTMLDivElement): number;
+export declare function getRightOffset(containerEl: HTMLDivElement): number;
+export declare function getIsIntersectingVertically(upperEl: HTMLElement, lowerEl: HTMLElement): boolean;

package/dist/PageLayout/PageLayout.utils.js

@@ -0,0 +1,53 @@
+import { breakpointRawMinWidthValues } from '../Grid/Grid.constants';
+import { adjustMaxWidth } from './PageLayout.styles';
+export var getSmallScreenBreakpointValue = function () {
+    return "(max-width: ".concat(adjustMaxWidth(breakpointRawMinWidthValues.tabletMd), "px)");
+};
+export var getIsUsingSmallScreen = function () {
+    var _a;
+    return (_a = globalThis.matchMedia) === null || _a === void 0 ? void 0 : _a.call(globalThis, getSmallScreenBreakpointValue()).matches;
+};
+export var wait = function (ms) {
+    return new Promise(function (resolve) { return setTimeout(resolve, ms); });
+};
+export function getBottomOffsetForFooterUseCase(footerEl, globalBottomOffset) {
+    var _a;
+    var viewportHeight = document.documentElement.clientHeight;
+    var footerRect = footerEl.getBoundingClientRect();
+    var footerTop = (_a = footerRect.y) !== null && _a !== void 0 ? _a : footerRect.top;
+    var footerHeight = footerRect.height;
+    var isSmallScreen = getIsUsingSmallScreen();
+    var isPageFooterSticky = footerEl.dataset.sticky === 'sticky';
+    if (isSmallScreen) {
+        if (isPageFooterSticky) {
+            return globalBottomOffset + viewportHeight - footerTop;
+        }
+        return globalBottomOffset + footerHeight;
+    }
+    if (isPageFooterSticky) {
+        // align with the sticky footer in the rest of use cases
+        return viewportHeight - footerRect.bottom;
+    }
+    return null;
+}
+export function getGlobalBottomOffset(containerEl) {
+    var lowerBoundary = containerEl.getBoundingClientRect();
+    var lowerBoundaryTopOffset = lowerBoundary.bottom;
+    var viewportHeight = document.documentElement.clientHeight;
+    return Math.max(viewportHeight - lowerBoundaryTopOffset, 0);
+}
+export function getGlobalTopOffset(containerEl) {
+    var _a;
+    var upperBoundary = containerEl.getBoundingClientRect();
+    var upperBoundaryTopOffset = (_a = upperBoundary.y) !== null && _a !== void 0 ? _a : upperBoundary.top;
+    return Math.max(upperBoundaryTopOffset, 0);
+}
+export function getRightOffset(containerEl) {
+    var containerRight = containerEl.getBoundingClientRect().right;
+    var viewportWidth = document.documentElement.clientWidth;
+    return viewportWidth - containerRight;
+}
+export function getIsIntersectingVertically(upperEl, lowerEl) {
+    return (upperEl.getBoundingClientRect().bottom > lowerEl.getBoundingClientRect().top);
+}
+//# sourceMappingURL=PageLayout.utils.js.map

package/dist/PageLayout/PageLayout.utils.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PageLayout.utils.js","sourceRoot":"","sources":["../../src/PageLayout/PageLayout.utils.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,2BAA2B,EAAE,MAAM,wBAAwB,CAAA;AACpE,OAAO,EAAE,cAAc,EAAE,MAAM,qBAAqB,CAAA;AAEpD,MAAM,CAAC,IAAM,6BAA6B,GAAG;IAC3C,OAAA,sBAAe,cAAc,CAAC,2BAA2B,CAAC,QAAQ,CAAC,QAAK;AAAxE,CAAwE,CAAA;AAE1E,MAAM,CAAC,IAAM,qBAAqB,GAAG;;IACnC,OAAO,MAAA,UAAU,CAAC,UAAU,2DAAG,6BAA6B,EAAE,EAAE,OAAO,CAAA;AACzE,CAAC,CAAA;AAED,MAAM,CAAC,IAAM,IAAI,GAAG,UAAC,EAAU;IAC7B,OAAA,IAAI,OAAO,CAAO,UAAC,OAAO,IAAK,OAAA,UAAU,CAAC,OAAO,EAAE,EAAE,CAAC,EAAvB,CAAuB,CAAC;AAAvD,CAAuD,CAAA;AAEzD,MAAM,UAAU,+BAA+B,CAC7C,QAAwB,EACxB,kBAA0B;;IAE1B,IAAM,cAAc,GAAG,QAAQ,CAAC,eAAe,CAAC,YAAY,CAAA;IAC5D,IAAM,UAAU,GAAG,QAAQ,CAAC,qBAAqB,EAAE,CAAA;IACnD,IAAM,SAAS,GAAG,MAAA,UAAU,CAAC,CAAC,mCAAI,UAAU,CAAC,GAAG,CAAA;IAChD,IAAM,YAAY,GAAG,UAAU,CAAC,MAAM,CAAA;IACtC,IAAM,aAAa,GAAG,qBAAqB,EAAE,CAAA;IAC7C,IAAM,kBAAkB,GAAG,QAAQ,CAAC,OAAO,CAAC,MAAM,KAAK,QAAQ,CAAA;IAE/D,IAAI,aAAa,EAAE;QACjB,IAAI,kBAAkB,EAAE;YACtB,OAAO,kBAAkB,GAAG,cAAc,GAAG,SAAS,CAAA;SACvD;QAED,OAAO,kBAAkB,GAAG,YAAY,CAAA;KACzC;IAED,IAAI,kBAAkB,EAAE;QACtB,wDAAwD;QACxD,OAAO,cAAc,GAAG,UAAU,CAAC,MAAM,CAAA;KAC1C;IAED,OAAO,IAAI,CAAA;AACb,CAAC;AAED,MAAM,UAAU,qBAAqB,CAAC,WAA2B;IAC/D,IAAM,aAAa,GAAG,WAAW,CAAC,qBAAqB,EAAE,CAAA;IACzD,IAAM,sBAAsB,GAAG,aAAa,CAAC,MAAM,CAAA;IACnD,IAAM,cAAc,GAAG,QAAQ,CAAC,eAAe,CAAC,YAAY,CAAA;IAC5D,OAAO,IAAI,CAAC,GAAG,CAAC,cAAc,GAAG,sBAAsB,EAAE,CAAC,CAAC,CAAA;AAC7D,CAAC;AAED,MAAM,UAAU,kBAAkB,CAAC,WAA2B;;IAC5D,IAAM,aAAa,GAAG,WAAW,CAAC,qBAAqB,EAAE,CAAA;IACzD,IAAM,sBAAsB,GAAG,MAAA,aAAa,CAAC,CAAC,mCAAI,aAAa,CAAC,GAAG,CAAA;IACnE,OAAO,IAAI,CAAC,GAAG,CAAC,sBAAsB,EAAE,CAAC,CAAC,CAAA;AAC5C,CAAC;AAED,MAAM,UAAU,cAAc,CAAC,WAA2B;IACxD,IAAM,cAAc,GAAG,WAAW,CAAC,qBAAqB,EAAE,CAAC,KAAK,CAAA;IAChE,IAAM,aAAa,GAAG,QAAQ,CAAC,eAAe,CAAC,WAAW,CAAA;IAE1D,OAAO,aAAa,GAAG,cAAc,CAAA;AACvC,CAAC;AAED,MAAM,UAAU,2BAA2B,CACzC,OAAoB,EACpB,OAAoB;IAEpB,OAAO,CACL,OAAO,CAAC,qBAAqB,EAAE,CAAC,MAAM,GAAG,OAAO,CAAC,qBAAqB,EAAE,CAAC,GAAG,CAC7E,CAAA;AACH,CAAC"}

package/dist/PageLayout/index.d.ts

@@ -0,0 +1,2 @@
+export { Page, PageContext } from './PageLayout';
+export { PageAsideProps, PageComponentProps as PageProps, PageHeaderProps, } from './PageLayout.types';

package/dist/PageLayout/index.js

@@ -0,0 +1,2 @@
+export { Page, PageContext } from './PageLayout';
+//# sourceMappingURL=index.js.map

package/dist/PageLayout/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/PageLayout/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,WAAW,EAAE,MAAM,cAAc,CAAA"}