@homebound/beam 2.134.2 → 2.135.1

package/dist/{src/components → components}/ButtonGroup.d.ts

@@ -1,5 +1,4 @@
 import { IconProps } from "./Icon";
-import { Callback } from "../types";
 export interface ButtonGroupProps {
     buttons: ButtonGroupButton[];
     /** Disables all buttons in ButtonGroup */
@@ -9,7 +8,7 @@ export interface ButtonGroupProps {
 export declare type ButtonGroupButton = {
     icon?: IconProps["icon"];
     text?: string;
-    onClick?: Callback;
+    onClick?: VoidFunction;
     /** Disables the button. Note we don't support the `disabled: ReactNode`/tooltip for now. */
     disabled?: boolean;
     /** Indicates the active/selected button, as in a tab or toggle. */

package/dist/{src/components → components}/ButtonMenu.d.ts

@@ -1,6 +1,5 @@
 import { IconProps } from "./Icon";
 import { OverlayTriggerProps } from "./internal/OverlayTrigger";
-import { Callback } from "../types";
 interface ButtonMenuProps extends Pick<OverlayTriggerProps, "trigger" | "placement" | "disabled" | "tooltip"> {
     items: MenuItem[];
     persistentItems?: MenuItem[];
@@ -9,7 +8,7 @@ interface ButtonMenuProps extends Pick<OverlayTriggerProps, "trigger" | "placeme
 export declare function ButtonMenu(props: ButtonMenuProps): import("@emotion/react/jsx-runtime").JSX.Element;
 declare type MenuItemBase = {
     label: string;
-    onClick: string | Callback;
+    onClick: string | VoidFunction;
     disabled?: boolean;
 };
 export declare type IconMenuItemType = MenuItemBase & {

package/dist/{src/components → components}/Modal/Modal.d.ts

@@ -1,6 +1,5 @@
 import { MutableRefObject, ReactNode } from "react";
 import { Only, Xss } from "../../Css";
-import { Callback } from "../../types";
 export declare type ModalSize = "sm" | "md" | "lg" | "xl";
 export interface ModalProps {
     /**
@@ -18,7 +17,7 @@ export interface ModalProps {
     /** Force scrolling i.e. to avoid content jumping left/right as scroll bar goes away/comes back. */
     forceScrolling?: boolean;
     /** Adds a callback that is called _after_ close has definitely happened. */
-    onClose?: Callback;
+    onClose?: VoidFunction;
     /** Imperative API for interacting with the Modal */
     api?: MutableRefObject<ModalApi | undefined>;
     /** Adds a border for the header. */

package/dist/{src/components → components}/Modal/Modal.js

@@ -31,8 +31,8 @@ function Modal(props) {
         onClose: closeModal,
         isDismissable: true,
         shouldCloseOnInteractOutside: (el) => {
-            // Do not close the Modal if the user is interacting with the Tribute mentions dropdown (via RichTextField).
-            return !el.closest(".tribute-container");
+            // Do not close the Modal if the user is interacting with the Tribute mentions dropdown (via RichTextField) or with another 3rd party dialog (such as a lightbox) on top of it.
+            return !(el.closest(".tribute-container") || el.closest("[role='dialog']"));
         },
     }, ref);
     const { modalProps } = (0, react_aria_1.useModal)();

package/dist/{src/components → components}/Modal/useModal.d.ts

@@ -1,8 +1,8 @@
-import { Callback, CheckFn } from "../../types";
+import { CheckFn } from "../../types";
 import { ModalProps } from "./Modal";
 export interface UseModalHook {
     openModal: (props: ModalProps) => void;
-    closeModal: Callback;
+    closeModal: VoidFunction;
     addCanClose: (canClose: CheckFn) => void;
     setSize: (size: ModalProps["size"]) => void;
 }

package/dist/{src/components → components}/Table/GridTable.d.ts

@@ -331,6 +331,8 @@ export declare type GridDataRow<R extends Kinded> = {
     /** Whether to pin this sort to the first/last of its parent's children. */
     pin?: "first" | "last";
     data: unknown;
+    /** Whether to have the row collapsed (children not visible) on initial load. This will be ignore in subsequent re-renders of the table */
+    initCollapsed?: boolean;
 } & IfAny<R, {}, DiscriminateUnion<R, "kind", R["kind"]>>;
 declare type IfAny<T, Y, N> = 0 extends 1 & T ? Y : N;
 /** Return the content for a given column def applied to a given row. */

package/dist/{src/components → components}/Table/GridTable.js

@@ -97,13 +97,13 @@ function GridTable(props) {
     const api = (0, react_1.useMemo)(() => {
         var _a;
         const api = (_a = props.api) !== null && _a !== void 0 ? _a : new GridTableApi_1.GridTableApiImpl();
-        api.init(persistCollapse, virtuosoRef);
+        api.init(persistCollapse, virtuosoRef, rows);
         api.setActiveRowId(activeRowId);
         return api;
     }, [props.api]);
     const style = resolveStyles(maybeStyle);
     const { rowState } = api;
-    rowState.rows = rows;
+    rowState.setRows(rows);
     (0, react_1.useEffect)(() => {
         rowState.activeRowId = activeRowId;
     }, [rowState, activeRowId]);

package/dist/{src/components → components}/Table/GridTableApi.d.ts

@@ -37,7 +37,7 @@ export declare class GridTableApiImpl<R extends Kinded> implements GridTableApi<
     readonly rowState: RowState;
     virtuosoRef: MutableRefObject<VirtuosoHandle | null>;
     /** Called once by the GridTable when it takes ownership of this api instance. */
-    init(persistCollapse: string | undefined, virtuosoRef: MutableRefObject<VirtuosoHandle | null>): void;
+    init(persistCollapse: string | undefined, virtuosoRef: MutableRefObject<VirtuosoHandle | null>, rows: GridDataRow<R>[]): void;
     scrollToIndex(index: number): void;
     getSelectedRowIds(kind?: string): string[];
     getSelectedRows(kind?: string): any;

package/dist/{src/components → components}/Table/GridTableApi.js

@@ -31,10 +31,8 @@ class GridTableApiImpl {
         this.virtuosoRef = { current: null };
     }
     /** Called once by the GridTable when it takes ownership of this api instance. */
-    init(persistCollapse, virtuosoRef) {
-        if (persistCollapse) {
-            this.rowState.loadPersistedCollapse(persistCollapse);
-        }
+    init(persistCollapse, virtuosoRef, rows) {
+        this.rowState.loadCollapse(persistCollapse, rows);
         this.virtuosoRef = virtuosoRef;
     }
     scrollToIndex(index) {

package/dist/{src/components → components}/Table/RowState.d.ts

@@ -27,7 +27,8 @@ export declare class RowState {
      * Creates the `RowState` for a given `GridTable`.
      */
     constructor();
-    loadPersistedCollapse(persistCollapse: string): void;
+    loadCollapse(persistCollapse: string | undefined, rows: GridDataRow<any>[]): void;
+    setRows(rows: GridDataRow<any>[]): void;
     setVisibleRows(rowIds: string[]): void;
     get selectedIds(): string[];
     getSelected(id: string): SelectedState;

package/dist/{src/components → components}/Table/RowState.js

@@ -53,9 +53,47 @@ class RowState {
             this.selectedRows.merge(map);
         }, { equals: mobx_1.comparer.shallow });
     }
-    loadPersistedCollapse(persistCollapse) {
+    loadCollapse(persistCollapse, rows) {
         this.persistCollapse = persistCollapse;
-        this.collapsedRows.replace(readLocalCollapseState(persistCollapse));
+        const sessionStorageIds = persistCollapse ? sessionStorage.getItem(persistCollapse) : null;
+        // Initialize with our collapsed rows based on what is in sessionStorage. Otherwise check if any rows have been defined as collapsed
+        const collapsedGridRowIds = sessionStorageIds ? JSON.parse(sessionStorageIds) : getCollapsedIdsFromRows(rows);
+        // If we have some initial rows to collapse, then set the internal prop
+        if (collapsedGridRowIds.length > 0) {
+            this.collapsedRows.replace(collapsedGridRowIds);
+            // If `persistCollapse` is set, but sessionStorageIds was not defined, then add them now.
+            if (this.persistCollapse && !sessionStorageIds) {
+                sessionStorage.setItem(this.persistCollapse, JSON.stringify(collapsedGridRowIds));
+            }
+        }
+    }
+    // Updates the list of rows and regenerates the collapsedRows property if needed.
+    setRows(rows) {
+        // If the set of rows are different, and this is the first time adding "data" rows (non "totals" or "header" rows), then collapsedRows may need to be updated.
+        if (rows !== this.rows && this.rows.some((r) => r.kind !== "totals" && r.kind !== "header")) {
+            const currentCollapsedIds = this.collapsedIds;
+            // Create a list of the (maybe) new rows that should be initially collapsed
+            const maybeNewCollapsedRows = flattenRows(rows).filter((r) => r.initCollapsed);
+            // If the list of collapsed rows are different, then determine which are net-new rows and should be added to the newCollapsedIds array
+            if (currentCollapsedIds.length !== maybeNewCollapsedRows.length ||
+                !currentCollapsedIds.every((id) => maybeNewCollapsedRows.some((r) => r.id === id))) {
+                // Flatten out the existing rows to make checking for new rows easier
+                const flattenedExistingIds = flattenRows(this.rows).map((r) => r.id);
+                const newCollapsedIds = maybeNewCollapsedRows
+                    .filter((maybeNewRow) => !flattenedExistingIds.includes(maybeNewRow.id))
+                    .map((row) => row.id);
+                // If there are new rows that should be collapsed then update the collapsedRows arrays
+                if (newCollapsedIds.length > 0) {
+                    this.collapsedRows.replace(currentCollapsedIds.concat(newCollapsedIds));
+                    // Also update our persistCollapse if set
+                    if (this.persistCollapse) {
+                        sessionStorage.setItem(this.persistCollapse, JSON.stringify(currentCollapsedIds.concat(newCollapsedIds)));
+                    }
+                }
+            }
+        }
+        // Finally replace our existing list of rows
+        this.rows = rows;
     }
     setVisibleRows(rowIds) {
         // ObservableSet doesn't seem to do a `diff` inside `replace` before firing
@@ -177,7 +215,7 @@ class RowState {
         }
         this.collapsedRows.replace(collapsedIds);
         if (this.persistCollapse) {
-            localStorage.setItem(this.persistCollapse, JSON.stringify(collapsedIds));
+            sessionStorage.setItem(this.persistCollapse, JSON.stringify(collapsedIds));
         }
     }
     getVisibleChildrenStates(children, map) {
@@ -208,7 +246,7 @@ exports.RowStateContext = react_1.default.createContext({
 });
 // Get the rows that are already in the toggled state, so we can keep them toggled
 function readLocalCollapseState(persistCollapse) {
-    const collapsedGridRowIds = localStorage.getItem(persistCollapse);
+    const collapsedGridRowIds = sessionStorage.getItem(persistCollapse);
     return collapsedGridRowIds ? JSON.parse(collapsedGridRowIds) : [];
 }
 /** Finds a row by id, and returns it + any parents. */
@@ -232,3 +270,18 @@ function deriveParentSelected(children) {
     const allUnchecked = children.every((child) => child === "unchecked");
     return children.length === 0 ? "unchecked" : allChecked ? "checked" : allUnchecked ? "unchecked" : "partial";
 }
+function getCollapsedIdsFromRows(rows) {
+    return rows.reduce((acc, r) => {
+        if (r.initCollapsed) {
+            acc.push(r.id);
+        }
+        if (r.children) {
+            acc.push(...getCollapsedIdsFromRows(r.children));
+        }
+        return acc;
+    }, []);
+}
+function flattenRows(rows) {
+    const childRows = rows.flatMap((r) => (r.children ? flattenRows(r.children) : []));
+    return [...rows, ...childRows];
+}

package/dist/{src/components → components}/internal/Menu.d.ts

@@ -1,9 +1,8 @@
 import { HTMLAttributes, PropsWithChildren } from "react";
 import { MenuItem } from "..";
-import { Callback } from "../../types";
 interface MenuProps<T> {
     ariaMenuProps: HTMLAttributes<HTMLElement>;
-    onClose: Callback;
+    onClose: VoidFunction;
     items: MenuItem[];
     persistentItems?: MenuItem[];
 }