@homebound/beam 2.378.1 → 2.379.1

package/dist/components/Layout/FullBleed.d.ts

@@ -1,7 +0,0 @@
-import { ReactElement } from "react";
-/** Provides a way to extend the full width of the ScrollableParent */
-export declare function FullBleed({ children, omitPadding }: {
-    children: ReactElement;
-    omitPadding?: boolean;
-}): ReactElement<any, string | import("react").JSXElementConstructor<any>>;
-//# sourceMappingURL=FullBleed.d.ts.map

package/dist/components/Layout/FullBleed.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"FullBleed.d.ts","sourceRoot":"","sources":["../../../src/components/Layout/FullBleed.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAgB,YAAY,EAAE,MAAM,OAAO,CAAC;AAInD,sEAAsE;AACtE,wBAAgB,SAAS,CAAC,EAAE,QAAQ,EAAE,WAAmB,EAAE,EAAE;IAAE,QAAQ,EAAE,YAAY,CAAC;IAAC,WAAW,CAAC,EAAE,OAAO,CAAA;CAAE,0EAO7G"}

package/dist/components/Layout/FullBleed.js

@@ -1,15 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.FullBleed = FullBleed;
-const react_1 = require("react");
-const ScrollableParent_1 = require("./ScrollableParent");
-const Css_1 = require("../../Css");
-/** Provides a way to extend the full width of the ScrollableParent */
-function FullBleed({ children, omitPadding = false }) {
-    const { pr, pl } = (0, ScrollableParent_1.useScrollableParent)();
-    return !pr && !pl
-        ? children
-        : (0, react_1.cloneElement)(children, {
-            style: Css_1.Css.ml(`-${pl}`).mr(`-${pr}`).if(!omitPadding).pl(pl).pr(pr).$,
-        });
-}

package/dist/components/Layout/PreventBrowserScroll.d.ts

@@ -1,4 +0,0 @@
-import { ChildrenOnly } from "../../types";
-/** Intended to wrap the whole application to prevent the browser's native scrolling behavior while also taking the full height of the viewport */
-export declare function PreventBrowserScroll({ children }: ChildrenOnly): import("@emotion/react/jsx-runtime").JSX.Element;
-//# sourceMappingURL=PreventBrowserScroll.d.ts.map

package/dist/components/Layout/PreventBrowserScroll.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"PreventBrowserScroll.d.ts","sourceRoot":"","sources":["../../../src/components/Layout/PreventBrowserScroll.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,YAAY,EAAE,oBAAkB;AAEzC,kJAAkJ;AAClJ,wBAAgB,oBAAoB,CAAC,EAAE,QAAQ,EAAE,EAAE,YAAY,oDAU9D"}

package/dist/components/Layout/PreventBrowserScroll.js

@@ -1,13 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.PreventBrowserScroll = PreventBrowserScroll;
-const jsx_runtime_1 = require("@emotion/react/jsx-runtime");
-const Css_1 = require("../../Css");
-/** Intended to wrap the whole application to prevent the browser's native scrolling behavior while also taking the full height of the viewport */
-function PreventBrowserScroll({ children }) {
-    return (
-    // Take over the full viewport and hide any overflown content.
-    // Using `-webkit-fill-available`, otherwise `height: 100vh` includes the app bars in mobile Safari. See https://allthingssmitty.com/2020/05/11/css-fix-for-100vh-in-mobile-webkit/
-    // Setting the multiple "(min|max-)height" properties is necessary, as Truss will turn this into an object and there can only be one `height` property.
-    (0, jsx_runtime_1.jsx)("div", { css: Css_1.Css.oh.vh100.mh("-webkit-fill-available").maxh("-webkit-fill-available").$, children: (0, jsx_runtime_1.jsx)("div", { css: Css_1.Css.h100.df.fdc.mh0.oa.$, children: children }) }));
-}

package/dist/components/Layout/RightPaneLayout/RightPaneContext.d.ts

@@ -1,17 +0,0 @@
-import React, { ReactNode } from "react";
-export interface OpenRightPaneOpts {
-    content: ReactNode;
-}
-export type RightPaneLayoutContextProps = {
-    openInPane: (opts: OpenRightPaneOpts) => void;
-    closePane: () => void;
-    clearPane: () => void;
-    isRightPaneOpen: boolean;
-    rightPaneContent: ReactNode;
-};
-export declare const RightPaneContext: React.Context<RightPaneLayoutContextProps>;
-export declare function RightPaneProvider({ children }: {
-    children: ReactNode;
-}): import("@emotion/react/jsx-runtime").JSX.Element;
-export declare function useRightPaneContext(): RightPaneLayoutContextProps;
-//# sourceMappingURL=RightPaneContext.d.ts.map

package/dist/components/Layout/RightPaneLayout/RightPaneContext.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"RightPaneContext.d.ts","sourceRoot":"","sources":["../../../../src/components/Layout/RightPaneLayout/RightPaneContext.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,SAAS,EAA8C,MAAM,OAAO,CAAC;AAErF,MAAM,WAAW,iBAAiB;IAChC,OAAO,EAAE,SAAS,CAAC;CACpB;AAED,MAAM,MAAM,2BAA2B,GAAG;IACxC,UAAU,EAAE,CAAC,IAAI,EAAE,iBAAiB,KAAK,IAAI,CAAC;IAC9C,SAAS,EAAE,MAAM,IAAI,CAAC;IACtB,SAAS,EAAE,MAAM,IAAI,CAAC;IACtB,eAAe,EAAE,OAAO,CAAC;IACzB,gBAAgB,EAAE,SAAS,CAAC;CAC7B,CAAC;AAEF,eAAO,MAAM,gBAAgB,4CAM3B,CAAC;AAEH,wBAAgB,iBAAiB,CAAC,EAAE,QAAQ,EAAE,EAAE;IAAE,QAAQ,EAAE,SAAS,CAAA;CAAE,oDAqBtE;AAED,wBAAgB,mBAAmB,gCAElC"}

package/dist/components/Layout/RightPaneLayout/RightPaneContext.js

@@ -1,53 +0,0 @@
-"use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.RightPaneContext = void 0;
-exports.RightPaneProvider = RightPaneProvider;
-exports.useRightPaneContext = useRightPaneContext;
-const jsx_runtime_1 = require("@emotion/react/jsx-runtime");
-const react_1 = __importStar(require("react"));
-exports.RightPaneContext = react_1.default.createContext({
-    openInPane: () => { },
-    closePane: () => { },
-    clearPane: () => { },
-    isRightPaneOpen: false,
-    rightPaneContent: null,
-});
-function RightPaneProvider({ children }) {
-    // Note: separating the pane content from isOpen state to prevent animating when updating content.
-    const [rightPaneContent, setRightPaneContent] = (0, react_1.useState)(undefined);
-    const [isRightPaneOpen, setIsRightPaneOpen] = (0, react_1.useState)(false);
-    const openInPane = (0, react_1.useCallback)((opts) => {
-        setRightPaneContent(opts?.content);
-        setIsRightPaneOpen(true);
-    }, [setRightPaneContent]);
-    const closePane = (0, react_1.useCallback)(() => setIsRightPaneOpen(false), []);
-    const clearPane = (0, react_1.useCallback)(() => setRightPaneContent(undefined), [setRightPaneContent]);
-    const context = (0, react_1.useMemo)(() => ({ openInPane, closePane, clearPane, rightPaneContent, isRightPaneOpen }), [openInPane, closePane, rightPaneContent, clearPane, isRightPaneOpen]);
-    return (0, jsx_runtime_1.jsx)(exports.RightPaneContext.Provider, { value: context, children: children });
-}
-function useRightPaneContext() {
-    return (0, react_1.useContext)(exports.RightPaneContext);
-}

package/dist/components/Layout/RightPaneLayout/RightPaneLayout.d.ts

@@ -1,9 +0,0 @@
-import { ReactElement } from "react";
-import { Palette } from "../../../Css";
-export declare function RightPaneLayout(props: {
-    children: ReactElement;
-    paneBgColor?: Palette;
-    paneWidth?: number;
-    defaultPaneContent?: ReactElement;
-}): import("@emotion/react/jsx-runtime").JSX.Element;
-//# sourceMappingURL=RightPaneLayout.d.ts.map

package/dist/components/Layout/RightPaneLayout/RightPaneLayout.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"RightPaneLayout.d.ts","sourceRoot":"","sources":["../../../../src/components/Layout/RightPaneLayout/RightPaneLayout.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,YAAY,EAAa,MAAM,OAAO,CAAC;AAChD,OAAO,EAAO,OAAO,EAAE,qBAAgB;AAGvC,wBAAgB,eAAe,CAAC,KAAK,EAAE;IACrC,QAAQ,EAAE,YAAY,CAAC;IACvB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,kBAAkB,CAAC,EAAE,YAAY,CAAC;CACnC,oDA4DA"}

package/dist/components/Layout/RightPaneLayout/RightPaneLayout.js

@@ -1,29 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.RightPaneLayout = RightPaneLayout;
-const jsx_runtime_1 = require("@emotion/react/jsx-runtime");
-const framer_motion_1 = require("framer-motion");
-const react_1 = require("react");
-const Css_1 = require("../../../Css");
-const RightPaneContext_1 = require("./RightPaneContext");
-function RightPaneLayout(props) {
-    const { children, paneBgColor = Css_1.Palette.White, paneWidth = 450, defaultPaneContent } = props;
-    const { isRightPaneOpen, rightPaneContent, clearPane, closePane } = (0, RightPaneContext_1.useRightPaneContext)();
-    // Close pane on page unmount because otherwise the next page that has a right pane will show our stale content
-    (0, react_1.useEffect)(() => closePane, [closePane]);
-    return ((0, jsx_runtime_1.jsx)("div", { css: Css_1.Css.h100.df.oxh.$, children: (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("div", { css: {
-                        ...Css_1.Css.w(`calc(100% - ${paneWidth + 24}px)`).add("transition", "width .2s linear").h100.mr3.oxa.$,
-                        ...Css_1.Css.if(!isRightPaneOpen).w100.mr0.$,
-                        ...Css_1.Css.if(!!defaultPaneContent).w(`calc(100% - ${paneWidth + 24}px)`).mr3.$,
-                    }, children: children }), (0, jsx_runtime_1.jsxs)("div", { css: Css_1.Css.relative.if(!!defaultPaneContent).wPx(paneWidth).$, children: [defaultPaneContent && ((0, jsx_runtime_1.jsx)("div", { css: Css_1.Css.h100
-                                .wPx(paneWidth)
-                                .left(0)
-                                .absolute.add("transition", "all .3s ease-in-out")
-                                .if(isRightPaneOpen)
-                                .add("opacity", 0)
-                                .left(100).$, children: defaultPaneContent })), (0, jsx_runtime_1.jsx)(framer_motion_1.AnimatePresence, { children: isRightPaneOpen && ((0, jsx_runtime_1.jsx)(framer_motion_1.motion.div, { layout: "position", "data-testid": "rightPaneContent", css: Css_1.Css.bgColor(paneBgColor).h100.wPx(paneWidth).$, 
-                                // Keeping initial x to offset pane width and space between panel and page content
-                                initial: { x: paneWidth + 24, position: "absolute" }, animate: { x: 0 }, transition: { ease: "linear", duration: 0.2 }, exit: { transition: { ease: "linear", duration: 0.2 }, x: paneWidth }, 
-                                // Clear the content of the detail pane when the animation is completed and only when pane is closing
-                                onAnimationComplete: (definition) => definition.x !== 0 && clearPane(), children: rightPaneContent }, "rightPane")) })] })] }) }));
-}

package/dist/components/Layout/RightPaneLayout/index.d.ts

@@ -1,4 +0,0 @@
-export * from "./RightPaneContext";
-export * from "./RightPaneLayout";
-export * from "./useRightPane";
-//# sourceMappingURL=index.d.ts.map

package/dist/components/Layout/RightPaneLayout/index.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/Layout/RightPaneLayout/index.ts"],"names":[],"mappings":"AAAA,cAAc,oBAAoB,CAAC;AACnC,cAAc,mBAAmB,CAAC;AAClC,cAAc,gBAAgB,CAAC"}

package/dist/components/Layout/RightPaneLayout/index.js

@@ -1,19 +0,0 @@
-"use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __exportStar = (this && this.__exportStar) || function(m, exports) {
-    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-__exportStar(require("./RightPaneContext"), exports);
-__exportStar(require("./RightPaneLayout"), exports);
-__exportStar(require("./useRightPane"), exports);

package/dist/components/Layout/RightPaneLayout/useRightPane.d.ts

@@ -1,9 +0,0 @@
-import { OpenRightPaneOpts } from "./RightPaneContext";
-export interface UseRightPaneHook {
-    /** Opens a right pane */
-    openRightPane: (opts: OpenRightPaneOpts) => void;
-    /** Closes the right pane */
-    closeRightPane: () => void;
-}
-export declare function useRightPane(): UseRightPaneHook;
-//# sourceMappingURL=useRightPane.d.ts.map

package/dist/components/Layout/RightPaneLayout/useRightPane.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"useRightPane.d.ts","sourceRoot":"","sources":["../../../../src/components/Layout/RightPaneLayout/useRightPane.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAuB,MAAM,oBAAoB,CAAC;AAE5E,MAAM,WAAW,gBAAgB;IAC/B,yBAAyB;IACzB,aAAa,EAAE,CAAC,IAAI,EAAE,iBAAiB,KAAK,IAAI,CAAC;IACjD,4BAA4B;IAC5B,cAAc,EAAE,MAAM,IAAI,CAAC;CAC5B;AAED,wBAAgB,YAAY,IAAI,gBAAgB,CAM/C"}

package/dist/components/Layout/RightPaneLayout/useRightPane.js

@@ -1,11 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.useRightPane = useRightPane;
-const RightPaneContext_1 = require("./RightPaneContext");
-function useRightPane() {
-    const { openInPane, closePane } = (0, RightPaneContext_1.useRightPaneContext)();
-    return {
-        openRightPane: openInPane,
-        closeRightPane: closePane,
-    };
-}

package/dist/components/Layout/ScrollableContent.d.ts

@@ -1,20 +0,0 @@
-import { ReactNode, ReactPortal } from "react";
-import { Palette } from "../../Css";
-interface ScrollableContentProps {
-    children: ReactNode;
-    virtualized?: boolean;
-    omitBottomPadding?: true;
-    bgColor?: Palette;
-}
-/**
- * Helper component for placing scrollable content within a `ScrollableParent`.
- *
- * See the docs on `ScrollableParent.
- *
- * Note that you should not use this "just to get a scrollbar", instead just use `Css.oa.$`
- * or what not; this is only for implementing page-level patterns that need multiple stickied
- * components (page header, tab bar, table filter & actions).
- */
-export declare function ScrollableContent(props: ScrollableContentProps): ReactPortal | JSX.Element;
-export {};
-//# sourceMappingURL=ScrollableContent.d.ts.map

package/dist/components/Layout/ScrollableContent.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"ScrollableContent.d.ts","sourceRoot":"","sources":["../../../src/components/Layout/ScrollableContent.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,WAAW,EAAa,MAAM,OAAO,CAAC;AAG1D,OAAO,EAAO,OAAO,EAAE,kBAAgB;AAEvC,UAAU,sBAAsB;IAC9B,QAAQ,EAAE,SAAS,CAAC;IACpB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,iBAAiB,CAAC,EAAE,IAAI,CAAC;IACzB,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB;AAED;;;;;;;;GAQG;AACH,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,sBAAsB,GAAG,WAAW,GAAG,GAAG,CAAC,OAAO,CA6B1F"}

package/dist/components/Layout/ScrollableContent.js

@@ -1,37 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.ScrollableContent = ScrollableContent;
-const jsx_runtime_1 = require("@emotion/react/jsx-runtime");
-const react_1 = require("react");
-const react_dom_1 = require("react-dom");
-const ScrollableParent_1 = require("./ScrollableParent");
-const Css_1 = require("../../Css");
-/**
- * Helper component for placing scrollable content within a `ScrollableParent`.
- *
- * See the docs on `ScrollableParent.
- *
- * Note that you should not use this "just to get a scrollbar", instead just use `Css.oa.$`
- * or what not; this is only for implementing page-level patterns that need multiple stickied
- * components (page header, tab bar, table filter & actions).
- */
-function ScrollableContent(props) {
-    const { children, virtualized = false, omitBottomPadding, bgColor } = props;
-    const { scrollableEl, setPortalTick, pl, pr } = (0, ScrollableParent_1.useScrollableParent)();
-    (0, react_1.useEffect)(() => {
-        // The below `tick` logic is a way to detect whether the ScrollableContent is being used.
-        // The ScrollableParent sets scrolling style based on whether or not there are children inside of the `scrollableEl` portal.
-        setPortalTick((prev) => prev + 1);
-        // Ensure a tick happens on unmount in the event the next component loaded does not utilize `ScrollableContent`
-        return () => setPortalTick((prev) => prev + 1);
-    }, [setPortalTick]);
-    // Escape hatch specifically for tests where a "ScrollableParent" context may not be present.
-    if (!scrollableEl) {
-        return (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: children });
-    }
-    return (0, react_dom_1.createPortal)((0, jsx_runtime_1.jsx)("div", { css: {
-            ...Css_1.Css.h100.pr(pr).pl(pl).if(virtualized).pr0.$,
-            ...(bgColor && Css_1.Css.bgColor(bgColor).$),
-            ...(!omitBottomPadding && !virtualized && ScrollableParent_1.scrollContainerBottomPadding),
-        }, children: children }), scrollableEl);
-}

package/dist/components/Layout/ScrollableParent.d.ts

@@ -1,47 +0,0 @@
-import { Dispatch, PropsWithChildren, SetStateAction } from "react";
-import { Properties } from "../../Css";
-interface ScrollableParentContextProps {
-    scrollableEl: HTMLElement | null;
-    pr: string | number;
-    pl: string | number;
-    setPortalTick: Dispatch<SetStateAction<number>>;
-}
-interface ScrollableParentContextProviderProps {
-    xss?: Properties;
-    tagName?: keyof JSX.IntrinsicElements;
-}
-/**
- * Provides a pattern for implementing "multiple sticky" components.
- *
- * In css, `position: sticky` is great for pinning 1 element to the top of a container.
- *
- * However, in UX patterns, we're often asked to pin multiple DOM elements that are actually
- * spread across multiple React components. For example:
- *
- * - Sticky a Header (in FooPage)
- * - Sticky the table filter & actions (in FooTable)
- * - Sticky the table header row(s) (in GridTable)
- *
- * Historically the way we did this was passing `stickyOffset`s around, where the header would be
- * `top: 0px`, the filter & actions would be `top: ${headerPx}px`, and the table header rows would
- * be `top: ${headerPx + filterActionsPx}px`.
- *
- * However, this is brittle as the `headerPx` / `filterActionsPx` are likely dynamic.
- *
- * `ScrollableParent` solves this by putting all the stickied content (except the table header rows)
- * into a single div, and then having the page use `ScrollableContent` to mark what should actually
- * scroll, which then we "pull up" to be a sibling div of "everything that was stickied".
- *
- * See [this miro](https://miro.com/app/board/o9J_l-FQ-RU=/) and how we need to "cut the component in half".
- */
-export declare function ScrollableParent(props: PropsWithChildren<ScrollableParentContextProviderProps>): import("@emotion/react/jsx-runtime").JSX.Element;
-export declare function useScrollableParent(): ScrollableParentContextProps;
-export declare const scrollContainerBottomPadding: {
-    content: import("csstype").Property.Content | undefined;
-} & {
-    display: import("csstype").Property.Display | undefined;
-} & {
-    height: import("csstype").Property.Height<string | 0> | undefined;
-};
-export {};
-//# sourceMappingURL=ScrollableParent.d.ts.map

package/dist/components/Layout/ScrollableParent.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"ScrollableParent.d.ts","sourceRoot":"","sources":["../../../src/components/Layout/ScrollableParent.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,QAAQ,EACR,iBAAiB,EACjB,cAAc,EAMf,MAAM,OAAO,CAAC;AACf,OAAO,EAAO,UAAU,EAAE,kBAAgB;AAE1C,UAAU,4BAA4B;IACpC,YAAY,EAAE,WAAW,GAAG,IAAI,CAAC;IACjC,EAAE,EAAE,MAAM,GAAG,MAAM,CAAC;IACpB,EAAE,EAAE,MAAM,GAAG,MAAM,CAAC;IACpB,aAAa,EAAE,QAAQ,CAAC,cAAc,CAAC,MAAM,CAAC,CAAC,CAAC;CACjD;AAUD,UAAU,oCAAoC;IAC5C,GAAG,CAAC,EAAE,UAAU,CAAC;IAEjB,OAAO,CAAC,EAAE,MAAM,GAAG,CAAC,iBAAiB,CAAC;CACvC;AAED;;;;;;;;;;;;;;;;;;;;;;;GAuBG;AACH,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,iBAAiB,CAAC,oCAAoC,CAAC,oDA0C9F;AAED,wBAAgB,mBAAmB,iCAElC;AAGD,eAAO,MAAM,4BAA4B;;;;;;CAAmD,CAAC"}

package/dist/components/Layout/ScrollableParent.js

@@ -1,69 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.scrollContainerBottomPadding = void 0;
-exports.ScrollableParent = ScrollableParent;
-exports.useScrollableParent = useScrollableParent;
-const jsx_runtime_1 = require("@emotion/react/jsx-runtime");
-const react_1 = require("react");
-const Css_1 = require("../../Css");
-const ScrollableParentContext = (0, react_1.createContext)({
-    scrollableEl: null,
-    pr: 0,
-    pl: 0,
-    setPortalTick: (v) => { },
-});
-/**
- * Provides a pattern for implementing "multiple sticky" components.
- *
- * In css, `position: sticky` is great for pinning 1 element to the top of a container.
- *
- * However, in UX patterns, we're often asked to pin multiple DOM elements that are actually
- * spread across multiple React components. For example:
- *
- * - Sticky a Header (in FooPage)
- * - Sticky the table filter & actions (in FooTable)
- * - Sticky the table header row(s) (in GridTable)
- *
- * Historically the way we did this was passing `stickyOffset`s around, where the header would be
- * `top: 0px`, the filter & actions would be `top: ${headerPx}px`, and the table header rows would
- * be `top: ${headerPx + filterActionsPx}px`.
- *
- * However, this is brittle as the `headerPx` / `filterActionsPx` are likely dynamic.
- *
- * `ScrollableParent` solves this by putting all the stickied content (except the table header rows)
- * into a single div, and then having the page use `ScrollableContent` to mark what should actually
- * scroll, which then we "pull up" to be a sibling div of "everything that was stickied".
- *
- * See [this miro](https://miro.com/app/board/o9J_l-FQ-RU=/) and how we need to "cut the component in half".
- */
-function ScrollableParent(props) {
-    const { children, xss, tagName: Tag = "div" } = props;
-    const scrollableEl = (0, react_1.useMemo)(() => {
-        const el = document.createElement("div");
-        // Ensure this wrapping div takes up the full height of its container
-        el.style.height = "100%";
-        return el;
-    }, []);
-    const [, setTick] = (0, react_1.useState)(0);
-    const hasScrollableContent = scrollableEl.childNodes.length > 0;
-    const scrollableRef = (0, react_1.useRef)(null);
-    const { paddingLeft, paddingRight, ...otherXss } = xss || {};
-    const context = {
-        scrollableEl,
-        pl: paddingLeft ?? 0,
-        pr: paddingRight ?? 0,
-        setPortalTick: setTick,
-    };
-    (0, react_1.useEffect)(() => {
-        scrollableRef.current.appendChild(scrollableEl);
-    }, [scrollableEl]);
-    return ((0, jsx_runtime_1.jsx)(ScrollableParentContext.Provider, { value: context, children: (0, jsx_runtime_1.jsxs)(Tag, { css: { ...Css_1.Css.mh0.mw0.fg1.df.fdc.$, ...otherXss }, children: [(0, jsx_runtime_1.jsx)("div", { css: {
-                        ...Css_1.Css.pl(context.pl).pr(context.pr).$,
-                        ...(!hasScrollableContent ? { ...Css_1.Css.oa.h100.$, ...exports.scrollContainerBottomPadding } : undefined),
-                    }, children: children }), (0, jsx_runtime_1.jsx)("div", { css: Css_1.Css.fg1.oa.$, ref: scrollableRef })] }) }));
-}
-function useScrollableParent() {
-    return (0, react_1.useContext)(ScrollableParentContext);
-}
-// Styles to wrap around the scrollable content in order to give padding beneath the content within the scrollable container.
-exports.scrollContainerBottomPadding = Css_1.Css.addIn("&:after", Css_1.Css.contentEmpty.db.h2.$).$;

package/dist/components/Layout/index.d.ts

@@ -1,6 +0,0 @@
-export * from "./FullBleed";
-export * from "./PreventBrowserScroll";
-export * from "./RightPaneLayout";
-export * from "./ScrollableContent";
-export * from "./ScrollableParent";
-//# sourceMappingURL=index.d.ts.map

package/dist/components/Layout/index.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Layout/index.ts"],"names":[],"mappings":"AAAA,cAAc,aAAa,CAAC;AAC5B,cAAc,wBAAwB,CAAC;AACvC,cAAc,mBAAmB,CAAC;AAClC,cAAc,qBAAqB,CAAC;AACpC,cAAc,oBAAoB,CAAC"}

package/dist/components/Layout/index.js

@@ -1,21 +0,0 @@
-"use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __exportStar = (this && this.__exportStar) || function(m, exports) {
-    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-__exportStar(require("./FullBleed"), exports);
-__exportStar(require("./PreventBrowserScroll"), exports);
-__exportStar(require("./RightPaneLayout"), exports);
-__exportStar(require("./ScrollableContent"), exports);
-__exportStar(require("./ScrollableParent"), exports);

package/dist/components/Loader.d.ts

@@ -1,7 +0,0 @@
-interface LoaderProps {
-    size?: "xs" | "sm" | "md" | "lg";
-    contrast?: boolean;
-}
-export declare function Loader({ size, contrast }: LoaderProps): import("@emotion/react/jsx-runtime").JSX.Element;
-export {};
-//# sourceMappingURL=Loader.d.ts.map

package/dist/components/Loader.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"Loader.d.ts","sourceRoot":"","sources":["../../src/components/Loader.tsx"],"names":[],"mappings":"AAEA,UAAU,WAAW;IACnB,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;IACjC,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,wBAAgB,MAAM,CAAC,EAAE,IAAW,EAAE,QAAgB,EAAE,EAAE,WAAW,oDAuBpE"}

package/dist/components/Loader.js

@@ -1,27 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Loader = Loader;
-const jsx_runtime_1 = require("@emotion/react/jsx-runtime");
-const Css_1 = require("../Css");
-function Loader({ size = "lg", contrast = false }) {
-    const [dimensions, borderSize] = sizeToPixels[size];
-    const [bgColor, spinnerColor] = contrast ? [Css_1.Palette.Gray600, Css_1.Palette.Gray200] : [Css_1.Palette.White, Css_1.Palette.Blue700];
-    return ((0, jsx_runtime_1.jsx)("div", { "aria-label": "Loading", css: Css_1.Css.br100.ba
-            .hPx(dimensions)
-            .wPx(dimensions)
-            .bc(bgColor)
-            .bw(`${borderSize}px`)
-            .add("borderTopColor", spinnerColor)
-            .add("textIndent", "-999px")
-            .add("animationName", "spin")
-            .add("animationDuration", "800ms")
-            .add("animationIterationCount", "infinite")
-            .add("animationTimingFunction", "linear")
-            .add("transform", "translateZ(0)").$ }));
-}
-const sizeToPixels = {
-    xs: [16, 2],
-    sm: [32, 4],
-    md: [64, 8],
-    lg: [96, 12],
-};

package/dist/components/LoadingSkeleton.d.ts

@@ -1,11 +0,0 @@
-type Sizes = "sm" | "md" | "lg";
-export type LoadingSkeletonProps = {
-    rows?: number;
-    columns?: number;
-    size?: Sizes;
-    randomizeWidths?: boolean;
-    contrast?: boolean;
-};
-export declare function LoadingSkeleton({ rows, columns, size, randomizeWidths, contrast, }: LoadingSkeletonProps): import("@emotion/react/jsx-runtime").JSX.Element;
-export {};
-//# sourceMappingURL=LoadingSkeleton.d.ts.map

package/dist/components/LoadingSkeleton.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"LoadingSkeleton.d.ts","sourceRoot":"","sources":["../../src/components/LoadingSkeleton.tsx"],"names":[],"mappings":"AAEA,KAAK,KAAK,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AAEhC,MAAM,MAAM,oBAAoB,GAAG;IACjC,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,IAAI,CAAC,EAAE,KAAK,CAAC;IACb,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB,CAAC;AAEF,wBAAgB,eAAe,CAAC,EAC9B,IAAQ,EACR,OAAW,EACX,IAAW,EACX,eAAuB,EACvB,QAAgB,GACjB,EAAE,oBAAoB,oDA+BtB"}

package/dist/components/LoadingSkeleton.js

@@ -1,29 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.LoadingSkeleton = LoadingSkeleton;
-const jsx_runtime_1 = require("@emotion/react/jsx-runtime");
-const Css_1 = require("../Css");
-function LoadingSkeleton({ rows = 1, columns = 1, size = "md", randomizeWidths = false, contrast = false, }) {
-    const cellArray = [...Array(columns)];
-    const rowArray = [...Array(rows)];
-    const rowHeight = sizeToPixels[size];
-    const rowCells = (rowNumber) => {
-        const flexGrowForCell = randomizeWidths ? getRandomizedFlexBasisByRowIndex(rowNumber) : 1;
-        return cellArray.map((_, i) => ((0, jsx_runtime_1.jsx)("div", { css: Css_1.Css.br4
-                .add("animation", "pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite")
-                .add("flexGrow", flexGrowForCell)
-                .bgGray300.if(contrast).bgGray700.$ }, `row-${rowNumber}-cell-${i}`)));
-    };
-    return ((0, jsx_runtime_1.jsx)("div", { "aria-label": "Loading", children: rowArray.map((_, i) => ((0, jsx_runtime_1.jsx)("div", { css: Css_1.Css.df.gap1.mb1.hPx(rowHeight).$, children: rowCells(i) }, `row-${i}`))) }));
-}
-/** Create the illusion of random widths by cycling through a list of widths that look nice in order */
-function getRandomizedFlexBasisByRowIndex(rowIndex) {
-    const randomizedFlexBasisValues = [0.65, 0.8, 0.75, 0.9, 0.8, 0.85, 0.8, 0.95];
-    const valueIndex = rowIndex % randomizedFlexBasisValues.length;
-    return randomizedFlexBasisValues[valueIndex];
-}
-const sizeToPixels = {
-    sm: 16,
-    md: 24,
-    lg: 32,
-};

package/dist/components/MaxLines.d.ts

@@ -1,6 +0,0 @@
-import { PropsWithChildren } from "react";
-export type MaxLinesProps = PropsWithChildren<{
-    maxLines: number;
-}>;
-export declare function MaxLines({ maxLines, children }: MaxLinesProps): import("@emotion/react/jsx-runtime").JSX.Element;
-//# sourceMappingURL=MaxLines.d.ts.map

package/dist/components/MaxLines.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"MaxLines.d.ts","sourceRoot":"","sources":["../../src/components/MaxLines.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,iBAAiB,EAA4C,MAAM,OAAO,CAAC;AAGpF,MAAM,MAAM,aAAa,GAAG,iBAAiB,CAAC;IAC5C,QAAQ,EAAE,MAAM,CAAC;CAClB,CAAC,CAAC;AAEH,wBAAgB,QAAQ,CAAC,EAAE,QAAQ,EAAE,QAAQ,EAAE,EAAE,aAAa,oDA0C7D"}

package/dist/components/MaxLines.js

@@ -1,36 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.MaxLines = MaxLines;
-const jsx_runtime_1 = require("@emotion/react/jsx-runtime");
-const utils_1 = require("@react-aria/utils");
-const react_1 = require("react");
-const src_1 = require("..");
-function MaxLines({ maxLines, children }) {
-    const elRef = (0, react_1.useRef)(null);
-    const [hasMore, setHasMore] = (0, react_1.useState)(false);
-    const [expanded, setExpanded] = (0, react_1.useState)(false);
-    // When first rendered it will not be expanded and we'll have the `lineClamp` styles applied.
-    // Determine if we need the show more/less buttons.
-    // If the content is larger, then we need to set the height of the collapsed content to return to.
-    (0, utils_1.useLayoutEffect)(() => {
-        if (!elRef.current)
-            return;
-        // If the content overflows, then set the `hasMore` state to true.
-        setHasMore(elRef.current.scrollHeight > elRef.current.clientHeight);
-    }, []);
-    // Whenever the content changes, reset state
-    (0, react_1.useEffect)(() => {
-        setExpanded(false);
-    }, [children]);
-    const onResize = (0, react_1.useCallback)(() => {
-        // Listen for changes in the content height and determine if we still need the "show more/less" buttons.
-        // This content can change if the user resizes the window, or if the `props.children` change.
-        // The tricky part here is that setting `lineClamp` styles also triggers a resize event.
-        // We'll need to be aware of when this is triggered from our own `lineClamp` styles, vs externally.
-        if (!elRef.current)
-            return;
-        !expanded && setHasMore(elRef.current.scrollHeight > elRef.current.clientHeight);
-    }, [expanded]);
-    (0, utils_1.useResizeObserver)({ ref: elRef, onResize });
-    return ((0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("div", { ref: elRef, css: src_1.Css.if(!expanded).lineClamp(maxLines).$, children: children }), hasMore && ((0, jsx_runtime_1.jsx)("button", { css: src_1.Css.db.smMd.$, onClick: () => setExpanded((prev) => !prev), children: expanded ? "Show Less" : "Show More" }))] }));
-}