@xh/hoist 72.1.0 → 72.3.0

package/CHANGELOG.md

@@ -1,5 +1,49 @@
 # Changelog
 
+## v72.3.0 - 2025-04-08
+
+### 🎁 New Features
+
+* Added support for posting a "Client Health Report" track message on a configurable interval. This
+  message will include basic client information, and can be extended to include any other desired
+  data via `XH.trackService.addClientHealthReportSource()`. Enable by updating your app's
+  `xhActivityTrackingConfig` to include `clientHealthReport: {intervalMins: XXXX}`.
+* Enabled opt-in support for telemetry in `MsalClient`, leveraging hooks built-in to MSAL to collect
+  timing and success/failure count for all events emitted by the library.
+* Added the reported client app version as a column in the Admin Console WebSockets tab.
+
+### 🐞 Bug Fixes
+
+* Improved fetch request tracking to include time spent loading headers as specified by application.
+
+### ⚙️ Technical
+
+* Update shape of returned `BrowserUtils.getClientDeviceInfo()` to nest several properties under new
+  top-level `window` key and report JS heap size / usage values under the `memory` block in MB.
+
+### 📚 Libraries
+
+* @azure/msal-browser `3.28 → 4.8.0`
+
+## v72.2.0 - 2025-03-13
+
+### 🎁 New Features
+
+* Modified `TabContainerModel` to make more methods `protected`, improving extensibility for
+  advanced use-cases.
+* Enhanced `XH.reloadApp` with new argument to clear query parameters before loading.
+* Enhanced exception handling in `FetchService` to capture messages returned as raw strings, or
+  without explicit names.
+* Added dedicated columns to the Admin Console "Client Errors" tab for error names and messages.
+* `BaseOAuthClient` has been enhanced to allow `lazy` loading of Access Tokens, and also made more
+  robust such that Access Tokens that fail to load will never prevent the client from
+  initialization.
+
+### 🐞 Bug Fixes
+
+* Prevented native browser context menu from showing on `DashCanvas` surfaces and obscuring the
+  `DashCanvas` custom context menu.
+
 ## v72.1.0 - 2025-02-13
 
 ### 🎁 New Features

package/admin/tabs/activity/clienterrors/ClientErrorsModel.ts

@@ -9,7 +9,7 @@ import * as Col from '@xh/hoist/admin/columns';
 import {FilterChooserModel} from '@xh/hoist/cmp/filter';
 import {FormModel} from '@xh/hoist/cmp/form';
 import {GridModel} from '@xh/hoist/cmp/grid';
-import {HoistModel, LoadSpec, managed, XH} from '@xh/hoist/core';
+import {HoistModel, LoadSpec, managed, PlainObject, XH} from '@xh/hoist/core';
 import {StoreRecord} from '@xh/hoist/data';
 import {fmtJson} from '@xh/hoist/format';
 import {action, bindable, comparer, computed, makeObservable, observable} from '@xh/hoist/mobx';
@@ -62,6 +62,14 @@ export class ClientErrorsModel extends HoistModel {
                 {...Col.appVersion},
                 {...Col.appEnvironment},
                 {...Col.msg, displayName: 'User Message', hidden},
+                {
+                    field: {name: 'errorName', type: 'string'},
+                    autosizeMaxWidth: 400
+                },
+                {
+                    field: {name: 'errorMessage', type: 'string'},
+                    autosizeMaxWidth: 400
+                },
                 {...Col.error, hidden},
                 {...Col.url},
                 {...Col.correlationId},
@@ -119,18 +127,29 @@ export class ClientErrorsModel extends HoistModel {
     }
 
     override async doLoadAsync(loadSpec: LoadSpec) {
-        const {gridModel} = this;
+        const {query, gridModel} = this;
 
         try {
-            const data = await XH.fetchService.postJson({
+            const data: PlainObject[] = await XH.fetchService.postJson({
                 url: 'clientErrorAdmin',
-                body: this.query,
+                body: query,
                 loadSpec
             });
 
+            // Parse name + message from JSON-serialized error object out to top-level properties.
+            data.forEach(it => {
+                try {
+                    const error = JSON.parse(it.error);
+                    it.errorName = error?.name;
+                    it.errorMessage = error?.message;
+                } catch (ignored) {}
+            });
+
             gridModel.loadData(data);
             await gridModel.preSelectFirstAsync();
         } catch (e) {
+            if (loadSpec.isStale || loadSpec.isAutoRefresh) return;
+
             gridModel.clear();
             XH.handleException(e);
         }

package/admin/tabs/cluster/instances/InstancesTabModel.ts

@@ -149,7 +149,7 @@ export class InstancesTabModel extends HoistModel {
                 },
                 {
                     ...usedHeapMb,
-                    headerName: 'Heap (MB)'
+                    headerName: 'Heap (mb)'
                 },
                 {
                     ...usedPctMax,
@@ -214,11 +214,12 @@ export class InstancesTabModel extends HoistModel {
     private async shutdownInstanceAsync(instance: PlainObject) {
         if (
             !(await XH.confirm({
-                message: `Are you SURE you want to shutdown instance ${instance.name}?`,
+                message: `Are you sure you wish to immediately terminate instance ${instance.name}?`,
                 confirmProps: {
                     icon: Icon.skull(),
-                    text: 'Shutdown Now',
+                    text: 'Yes, kill the instance',
                     intent: 'danger',
+                    outlined: true,
                     autoFocus: false
                 }
             }))

package/admin/tabs/cluster/instances/logs/LogDisplay.ts

@@ -6,12 +6,12 @@
  */
 import {clock} from '@xh/hoist/cmp/clock';
 import {grid} from '@xh/hoist/cmp/grid';
-import {code, filler, fragment, hspacer, label, placeholder} from '@xh/hoist/cmp/layout';
+import {filler, fragment, hspacer, label, placeholder} from '@xh/hoist/cmp/layout';
+import {loadingIndicator} from '@xh/hoist/cmp/loadingindicator';
 import {hoistCmp, uses, XH} from '@xh/hoist/core';
 import {button, modalToggleButton} from '@xh/hoist/desktop/cmp/button';
 import {gridFindField} from '@xh/hoist/desktop/cmp/grid';
 import {numberInput, switchInput, textInput} from '@xh/hoist/desktop/cmp/input';
-import {loadingIndicator} from '@xh/hoist/cmp/loadingindicator';
 import {panel} from '@xh/hoist/desktop/cmp/panel';
 import {toolbar, toolbarSep} from '@xh/hoist/desktop/cmp/toolbar';
 import {Icon} from '@xh/hoist/icon';
@@ -48,7 +48,7 @@ const tbar = hoistCmp.factory<LogDisplayModel>(({model}) => {
         numberInput({
             bind: 'startLine',
             min: 1,
-            width: 80,
+            width: 70,
             disabled: model.tail,
             displayWithCommas: true
         }),
@@ -57,13 +57,13 @@ const tbar = hoistCmp.factory<LogDisplayModel>(({model}) => {
         numberInput({
             bind: 'maxLines',
             min: 1,
-            width: 80,
+            width: 70,
             displayWithCommas: true
         }),
         '-',
         textInput({
             bind: 'pattern',
-            placeholder: 'Filter',
+            placeholder: 'Filter lines...',
             leftIcon: Icon.filter(),
             flex: 1,
             rightElement: fragment(
@@ -85,7 +85,7 @@ const tbar = hoistCmp.factory<LogDisplayModel>(({model}) => {
                 })
             )
         }),
-        gridFindField({flex: 1}),
+        gridFindField({flex: 1, placeholder: 'Find lines...'}),
         '-',
         switchInput({
             bind: 'tail',
@@ -123,16 +123,14 @@ const bbar = hoistCmp.factory<LogDisplayModel>({
             }),
             filler(),
             Icon.clock(),
-            code(
-                clock({
-                    timezone: zone,
-                    format: 'HH:mm',
-                    suffix: fmtTimeZone(zone, offset)
-                })
-            ),
+            clock({
+                timezone: zone,
+                format: 'HH:mm',
+                suffix: fmtTimeZone(zone, offset)
+            }),
             fragment({
                 omit: !logRootPath,
-                items: [toolbarSep(), Icon.folder(), code(logRootPath)]
+                items: [toolbarSep(), Icon.folder({className: 'xh-margin-right'}), logRootPath]
             })
         );
     }

package/admin/tabs/cluster/instances/logs/LogDisplayModel.ts

@@ -117,8 +117,6 @@ export class LogDisplayModel extends HoistModel {
             },
             loadSpec
         });
-        // Backward compatibility for Hoist Core < v22, which returned exception in-band
-        if (!response.success) throw XH.exception(response.exception);
         this.updateGridData(response.content);
     }
 

package/admin/tabs/cluster/instances/logs/LogViewer.ts

@@ -5,8 +5,8 @@
  * Copyright © 2025 Extremely Heavy Industries Inc.
  */
 import {logLevelDialog} from '@xh/hoist/admin/tabs/cluster/instances/logs/levels/LogLevelDialog';
-import {grid} from '@xh/hoist/cmp/grid';
-import {hframe} from '@xh/hoist/cmp/layout';
+import {grid, gridCountLabel} from '@xh/hoist/cmp/grid';
+import {filler, hframe} from '@xh/hoist/cmp/layout';
 import {storeFilterField} from '@xh/hoist/cmp/store';
 import {creates, hoistCmp} from '@xh/hoist/core';
 import {errorMessage} from '@xh/hoist/cmp/error';
@@ -37,9 +37,8 @@ export const logViewer = hoistCmp.factory({
                         side: 'left',
                         defaultSize: 380
                     },
-                    item: grid(),
-                    bbar: [
-                        storeFilterField({flex: 1}),
+                    tbar: [
+                        storeFilterField({flex: 1, placeholder: 'Filter files...'}),
                         select({
                             leftIcon: Icon.server(),
                             bind: 'instanceOnly',
@@ -53,6 +52,8 @@ export const logViewer = hoistCmp.factory({
                             ]
                         })
                     ],
+                    item: grid(),
+                    bbar: [filler(), gridCountLabel({unit: 'log file'})],
                     mask: 'onLoad'
                 }),
                 logDisplay(),

package/admin/tabs/cluster/instances/logs/LogViewerModel.ts

@@ -13,6 +13,7 @@ import {RecordActionSpec} from '@xh/hoist/data';
 import {compactDateRenderer, fmtNumber} from '@xh/hoist/format';
 import {Icon} from '@xh/hoist/icon';
 import {bindable, makeObservable, observable} from '@xh/hoist/mobx';
+import {pluralize} from '@xh/hoist/utils/js';
 import download from 'downloadjs';
 import {LogDisplayModel} from './LogDisplayModel';
 
@@ -119,7 +120,13 @@ export class LogViewerModel extends BaseInstanceModel {
             if (!count) return;
 
             const confirmed = await XH.confirm({
-                message: `Delete ${count} log files on the server? This cannot be undone.`
+                message: `Are you sure you want to delete ${pluralize('log file', count, true)}? This cannot be undone.`,
+                confirmProps: {
+                    text: `Yes, delete the ${pluralize('file', count)}`,
+                    intent: 'danger',
+                    outlined: true,
+                    autoFocus: false
+                }
             });
             if (!confirmed) return;
 

package/admin/tabs/cluster/instances/memory/MemoryMonitorModel.ts

@@ -131,6 +131,7 @@ export class MemoryMonitorModel extends BaseInstanceModel {
                 },
                 {
                     groupId: 'GC',
+                    headerName: 'Garbage Collection',
                     headerAlign: 'center',
                     children: [collectionCount, avgCollectionTime, pctCollectionTime]
                 }

package/admin/tabs/cluster/instances/services/DetailsModel.ts

@@ -5,7 +5,6 @@
  * Copyright © 2025 Extremely Heavy Industries Inc.
  */
 import {HoistModel, LoadSpec, lookup, PlainObject, XH} from '@xh/hoist/core';
-import {StoreRecord} from '@xh/hoist/data';
 import {bindable} from '@xh/hoist/mobx';
 import {ServiceModel} from './ServiceModel';
 
@@ -14,7 +13,7 @@ export class DetailsModel extends HoistModel {
     parent: ServiceModel;
 
     @bindable.ref
-    svcName: StoreRecord;
+    svcName: String;
 
     @bindable.ref
     stats: PlainObject;

package/admin/tabs/cluster/instances/services/DetailsPanel.ts

@@ -11,6 +11,7 @@ import {errorMessage} from '@xh/hoist/cmp/error';
 import {panel} from '@xh/hoist/desktop/cmp/panel';
 import {jsonInput} from '@xh/hoist/desktop/cmp/input';
 import {Icon} from '@xh/hoist/icon';
+import {isEmpty} from 'lodash';
 
 export const detailsPanel = hoistCmp.factory({
     model: creates(DetailsModel),
@@ -18,7 +19,7 @@ export const detailsPanel = hoistCmp.factory({
     render({model}) {
         const {svcName} = model;
         return panel({
-            title: svcName ? `Stats: ${svcName}` : 'Stats',
+            title: svcName ?? 'Stats',
             mask: 'onLoad',
             icon: Icon.info(),
             compactHeader: true,
@@ -42,18 +43,22 @@ const stats = hoistCmp.factory<DetailsModel>({
             });
         }
 
-        if (stats == null) return null;
-
-        return panel(
-            jsonInput({
-                readonly: true,
-                width: '100%',
-                height: '100%',
-                enableSearch: true,
-                showFullscreenButton: false,
-                editorProps: {lineNumbers: false},
-                value: model.parent.fmtStats(stats)
-            })
-        );
+        return isEmpty(stats)
+            ? placeholder(
+                  ...(loadModel.isPending
+                      ? []
+                      : [Icon.questionCircle(), 'This service does not report any admin stats.'])
+              )
+            : panel(
+                  jsonInput({
+                      readonly: true,
+                      width: '100%',
+                      height: '100%',
+                      enableSearch: true,
+                      showFullscreenButton: false,
+                      editorProps: {lineNumbers: false},
+                      value: model.parent.fmtStats(stats)
+                  })
+              );
     }
 });

package/admin/tabs/cluster/instances/services/ServiceModel.ts

@@ -10,7 +10,7 @@ import {timestampNoYear} from '@xh/hoist/admin/columns';
 import {BaseInstanceModel} from '@xh/hoist/admin/tabs/cluster/instances/BaseInstanceModel';
 import {GridModel} from '@xh/hoist/cmp/grid';
 import {br, fragment} from '@xh/hoist/cmp/layout';
-import {LoadSpec, managed, XH} from '@xh/hoist/core';
+import {LoadSpec, managed, PlainObject, XH} from '@xh/hoist/core';
 import {FilterLike, FilterTestFn, RecordActionSpec} from '@xh/hoist/data';
 import {Icon} from '@xh/hoist/icon';
 import {bindable, makeObservable} from '@xh/hoist/mobx';
@@ -52,15 +52,16 @@ export class ServiceModel extends BaseInstanceModel {
         selModel: 'multiple',
         enableExport: true,
         exportOptions: {filename: exportFilenameWithDate('services')},
+        groupBy: 'provider',
         store: {
             idSpec: 'name',
             processRawData: this.processRawData,
             fields: [
                 {name: 'provider', type: 'string'},
                 {name: 'name', type: 'string'},
-                {name: 'displayName', type: 'string'},
+                {name: 'displayName', type: 'string', displayName: 'Service'},
                 {name: 'initializedDate', type: 'date', displayName: 'Initialized'},
-                {name: 'lastCachesCleared', type: 'date', displayName: 'Last Cleared'}
+                {name: 'lastCachesCleared', type: 'date', displayName: 'Caches Last Cleared'}
             ]
         },
         sortBy: ['provider', 'displayName'],
@@ -81,6 +82,7 @@ export class ServiceModel extends BaseInstanceModel {
     constructor() {
         super();
         makeObservable(this);
+
         this.addReaction({
             track: () => [this.textFilter, this.typeFilter],
             run: this.applyFilters,
@@ -91,6 +93,7 @@ export class ServiceModel extends BaseInstanceModel {
     async clearCachesAsync(entireCluster: boolean) {
         const {gridModel, instanceName, loadModel} = this,
             {selectedRecords} = gridModel;
+
         if (isEmpty(selectedRecords)) return;
 
         const cacheStr =
@@ -131,19 +134,24 @@ export class ServiceModel extends BaseInstanceModel {
     }
 
     override async doLoadAsync(loadSpec: LoadSpec) {
+        const {gridModel, instanceName: instance} = this;
         try {
             const data = await XH.fetchJson({
                 url: 'serviceManagerAdmin/listServices',
-                params: {instance: this.instanceName},
+                params: {instance},
                 loadSpec
             });
-            return this.gridModel.loadData(data);
+
+            if (!loadSpec.isStale) {
+                gridModel.loadData(data);
+                gridModel.preSelectFirstAsync();
+            }
         } catch (e) {
             this.handleLoadException(e, loadSpec);
         }
     }
 
-    private processRawData(r) {
+    private processRawData(r: PlainObject) {
         const provider = r.name && r.name.startsWith('hoistCore') ? 'Hoist' : 'App';
         const displayName = lowerFirst(r.name.replace('hoistCore', ''));
         return {provider, displayName, ...r};

package/admin/tabs/cluster/instances/services/ServicePanel.ts

@@ -9,11 +9,11 @@ import {grid, gridCountLabel} from '@xh/hoist/cmp/grid';
 import {filler, hframe} from '@xh/hoist/cmp/layout';
 import {storeFilterField} from '@xh/hoist/cmp/store';
 import {creates, hoistCmp, uses} from '@xh/hoist/core';
-import {exportButton} from '@xh/hoist/desktop/cmp/button';
+import {button, exportButton} from '@xh/hoist/desktop/cmp/button';
+import {buttonGroupInput} from '@xh/hoist/desktop/cmp/input';
 import {panel} from '@xh/hoist/desktop/cmp/panel';
 import {recordActionBar} from '@xh/hoist/desktop/cmp/record';
 import {toolbar} from '@xh/hoist/desktop/cmp/toolbar';
-import {select} from '@xh/hoist/desktop/cmp/input';
 import {ServiceModel} from './ServiceModel';
 
 export const servicePanel = hoistCmp.factory({
@@ -52,15 +52,14 @@ const bbar = hoistCmp.factory({
             filler(),
             gridCountLabel({unit: 'service'}),
             '-',
-            select({
-                options: [
-                    {value: 'all', label: 'All'},
-                    {value: 'app', label: 'App Only'},
-                    {value: 'hoist', label: 'Hoist Only'}
-                ],
-                width: 125,
+            buttonGroupInput({
                 bind: 'typeFilter',
-                hideDropdownIndicator: true
+                outlined: true,
+                items: [
+                    button({value: 'all', text: 'All'}),
+                    button({value: 'app', text: 'App'}),
+                    button({value: 'hoist', text: 'Hoist'})
+                ]
             }),
             storeFilterField({
                 matchMode: 'any',

package/admin/tabs/cluster/instances/websocket/WebSocketColumns.ts

@@ -72,3 +72,12 @@ export const lastReceivedTime: ColumnSpec = {
     ...Col.compactDate,
     width: 140
 };
+
+export const clientAppVersion: ColumnSpec = {
+    field: {
+        name: 'clientAppVersion',
+        type: 'string',
+        displayName: 'Client Version'
+    },
+    width: 120
+};

package/admin/tabs/cluster/instances/websocket/WebSocketModel.ts

@@ -77,7 +77,8 @@ export class WebSocketModel extends BaseInstanceModel {
                 WSCol.sentMessageCount,
                 WSCol.lastSentTime,
                 WSCol.receivedMessageCount,
-                WSCol.lastReceivedTime
+                WSCol.lastReceivedTime,
+                WSCol.clientAppVersion
             ]
         });
 

package/admin/tabs/userData/roles/RoleModel.ts

@@ -275,7 +275,7 @@ export class RoleModel extends HoistModel {
         return new GridModel({
             treeMode: true,
             treeStyle: TreeStyle.HIGHLIGHTS_AND_BORDERS,
-            autosizeOptions: {mode: 'managed'},
+            autosizeOptions: {mode: 'managed', includeCollapsedChildren: true},
             selModel: 'multiple',
             emptyText: 'No roles found.',
             colChooserModel: true,

package/admin/tabs/userData/roles/details/RoleDetailsModel.ts

@@ -44,7 +44,7 @@ export class RoleDetailsModel extends HoistModel {
                 );
 
                 this.setTabTitle('users', 'Users', role?.effectiveUsers);
-                this.setTabTitle('directories', 'Directories', role?.effectiveDirectoryGroups);
+                this.setTabTitle('directories', 'Dir. Groups', role?.effectiveDirectoryGroups);
                 this.setTabTitle('effectiveRoles', 'Granted To', role?.effectiveRoles);
                 this.setTabTitle('inheritedRoles', 'Inheriting From', role?.inheritedRoles);
             },
@@ -77,6 +77,7 @@ export class RoleDetailsModel extends HoistModel {
                 },
                 {
                     id: 'directories',
+                    title: 'Dir. Groups',
                     omit: !this.roleModel.moduleConfig.directoryGroupsSupported,
                     content: directoryMembers
                 },

package/admin/tabs/userData/roles/recategorize/RecategorizeDialogModel.ts

@@ -65,8 +65,8 @@ export class RecategorizeDialogModel extends HoistModel {
                     }
                 })
                 .linkTo(this.savingTask);
-            await this.parent.refreshAsync();
             this.close();
+            await this.parent.refreshAsync();
         } catch (e) {
             XH.handleException(e);
         }

package/appcontainer/AppStateModel.ts

@@ -24,8 +24,13 @@ export class AppStateModel extends HoistModel {
     suspendData: AppSuspendData;
     accessDeniedMessage: string = 'Access Denied';
 
+    /**
+     * Timestamp when the app first started loading, prior to even JS download/eval.
+     * Read from timestamp set on window within index.html.
+     */
+    readonly loadStarted: number = window['_xhLoadTimestamp'];
+
     private timings: Record<AppState, number> = {} as Record<AppState, number>;
-    private loadStarted: number = window['_xhLoadTimestamp']; // set in index.html
     private lastStateChangeTime: number = this.loadStarted;
 
     constructor() {

package/build/types/admin/tabs/activity/tracking/ActivityTrackingModel.d.ts

@@ -26,7 +26,10 @@ export declare class ActivityTrackingModel extends HoistModel {
      */
     get queryDisplayString(): string;
     get endDay(): LocalDate;
-    get maxRowOptions(): any;
+    get maxRowOptions(): {
+        value: number;
+        label: string;
+    }[];
     get maxRows(): number;
     /** True if data loaded from the server has been topped by maxRows. */
     get maxRowsReached(): boolean;

package/build/types/admin/tabs/cluster/instances/services/DetailsModel.d.ts

@@ -1,11 +1,10 @@
 import { HoistModel, LoadSpec, PlainObject } from '@xh/hoist/core';
-import { StoreRecord } from '@xh/hoist/data';
 import { ServiceModel } from './ServiceModel';
 export declare class DetailsModel extends HoistModel {
     parent: ServiceModel;
-    svcName: StoreRecord;
+    svcName: String;
     stats: PlainObject;
-    get selectedRecord(): StoreRecord;
+    get selectedRecord(): import("../../../../../data").StoreRecord;
     onLinked(): void;
     doLoadAsync(loadSpec: LoadSpec): Promise<void>;
 }

package/build/types/admin/tabs/cluster/instances/websocket/WebSocketColumns.d.ts

@@ -6,3 +6,4 @@ export declare const sentMessageCount: ColumnSpec;
 export declare const lastSentTime: ColumnSpec;
 export declare const receivedMessageCount: ColumnSpec;
 export declare const lastReceivedTime: ColumnSpec;
+export declare const clientAppVersion: ColumnSpec;

package/build/types/appcontainer/AppStateModel.d.ts

@@ -10,8 +10,12 @@ export declare class AppStateModel extends HoistModel {
     lastActivityMs: number;
     suspendData: AppSuspendData;
     accessDeniedMessage: string;
+    /**
+     * Timestamp when the app first started loading, prior to even JS download/eval.
+     * Read from timestamp set on window within index.html.
+     */
+    readonly loadStarted: number;
     private timings;
-    private loadStarted;
     private lastStateChangeTime;
     constructor();
     setAppState(nextState: AppState): void;

package/build/types/cmp/tab/TabContainerModel.d.ts

@@ -68,7 +68,7 @@ export declare class TabContainerModel extends HoistModel implements Persistable
     refreshMode: RefreshMode;
     emptyText: ReactNode;
     refreshContextModel: RefreshContextModel;
-    private lastActiveTabId;
+    protected lastActiveTabId: string;
     constructor({ tabs, defaultTabId, route, switcher, track, renderMode, refreshMode, persistWith, emptyText, xhImpl }: TabContainerConfig);
     /** Set/replace all tabs within the container. */
     setTabs(tabs: Array<TabModel | TabConfig>): void;
@@ -110,10 +110,10 @@ export declare class TabContainerModel extends HoistModel implements Persistable
     setPersistableState(state: PersistableState<{
         activeTabId: string;
     }>): void;
-    private setActiveTabIdInternal;
-    private syncWithRouter;
-    private forwardRouterToTab;
-    private calculateActiveTabId;
+    protected setActiveTabIdInternal(id: any): void;
+    protected syncWithRouter(): void;
+    protected forwardRouterToTab(id: any): void;
+    protected calculateActiveTabId(tabs: any): any;
 }
 export interface AddTabOptions {
     /** Index in tab collection where tab is to be added. */

package/build/types/core/HoistProps.d.ts

@@ -95,6 +95,7 @@ export interface LayoutProps {
     flexGrow?: string | number;
     flexShrink?: string | number;
     flexWrap?: Property.FlexWrap;
+    gap?: string | number;
     alignItems?: string;
     alignSelf?: string;
     alignContent?: string;

package/build/types/core/XH.d.ts

@@ -9,9 +9,9 @@ import { AppContainerModel } from '../appcontainer/AppContainerModel';
 import { BannerModel } from '../appcontainer/BannerModel';
 import { ToastModel } from '../appcontainer/ToastModel';
 import '../styles/XH.scss';
-import { AppSpec, AppState, AppSuspendData, BannerSpec, ExceptionHandler, ExceptionHandlerOptions, HoistAppModel, HoistException, HoistService, HoistServiceClass, HoistUser, MessageSpec, PageState, PlainObject, SizingMode, TaskObserver, Theme, ToastSpec, TrackOptions } from './';
+import { AppSpec, AppState, AppSuspendData, BannerSpec, ExceptionHandler, ExceptionHandlerOptions, HoistAppModel, HoistException, HoistService, HoistServiceClass, HoistUser, MessageSpec, PageState, PlainObject, ReloadAppOptions, SizingMode, TaskObserver, Theme, ToastSpec, TrackOptions } from './';
 import { HoistModel, ModelSelector, RefreshContextModel } from './model';
-export declare const MIN_HOIST_CORE_VERSION = "21.0";
+export declare const MIN_HOIST_CORE_VERSION = "28.0";
 /**
  * Top-level Singleton model for Hoist. This is the main entry point for the API.
  *
@@ -193,13 +193,13 @@ export declare class XHApi {
     /**
      * Trigger a full reload of the current application.
      *
-     * @param path - relative path to reload (e.g. 'mobile/').  Defaults to the
-     * existing location pathname.
+     * @param opts - options to govern reload. To support legacy usages, a provided
+     *       string will be treated as `ReloadAppOptions.path`.
      *
      * This method will reload the entire application document in the browser - to trigger a
      * refresh of the loadable content within the app, use {@link refreshAppAsync} instead.
      */
-    reloadApp(path?: string): void;
+    reloadApp(opts?: ReloadAppOptions | string): void;
     /**
      * Refresh the current application.
      *