@xh/hoist 79.0.0-SNAPSHOT.1765213676051 → 79.0.0-SNAPSHOT.1765576094437

package/CHANGELOG.md

@@ -2,9 +2,24 @@
 
 ## 79.0.0-SNAPSHOT - unreleased
 
+### 💥 Breaking Changes
+
+* Renamed `GridModel.applyColumnStateChanges()` to `updateColumnState()` for clarity and better
+  symmetry with `setColumnState()`. The prior method remains as an alias but is now deprecated and
+  scheduled for removal in v82.
+
 ### 🐞 Bug Fixes
 
+* Fixed column chooser to display columns in the same order as they appear in the grid.
 * Defaulted Highcharts font to Hoist default (--xh-font-family)
+* Tweaked `GridFindField` to forward a provided `ref` to its underlying `TextInput`.
+
+### ⚙️ Technical
+
+* Removed the following previously deprecated configs as planned:
+    * `AppSpec.websocketsEnabled` - enabled by default, disable via `disableWebSockets`
+    * `GroupingChooserProps.popoverTitle` - use `editorTitle`
+    * `RelativeTimestampProps.options` - provide directly as top-level props
 
 ## 78.1.4 - 2025-12-05
 

package/build/types/cmp/grid/GridModel.d.ts

@@ -1,9 +1,9 @@
-import { CellClickedEvent, CellContextMenuEvent, CellDoubleClickedEvent, CellEditingStartedEvent, CellEditingStoppedEvent, AgColumnState, RowClickedEvent, RowDoubleClickedEvent } from '@xh/hoist/kit/ag-grid';
 import { AgGridModel } from '@xh/hoist/cmp/ag-grid';
 import { Column, ColumnGroup, ColumnGroupSpec, ColumnSpec, GridAutosizeMode, GridFilterModelConfig, GridGroupSortFn, TreeStyle } from '@xh/hoist/cmp/grid';
 import { GridFilterModel } from '@xh/hoist/cmp/grid/filter/GridFilterModel';
 import { Awaitable, HoistModel, HSide, PlainObject, SizingMode, Some, TaskObserver, Thunkable, VSide } from '@xh/hoist/core';
 import { Store, StoreConfig, StoreRecord, StoreRecordId, StoreRecordOrId, StoreSelectionConfig, StoreSelectionModel, StoreTransaction } from '@xh/hoist/data';
+import { AgColumnState, CellClickedEvent, CellContextMenuEvent, CellDoubleClickedEvent, CellEditingStartedEvent, CellEditingStoppedEvent, RowClickedEvent, RowDoubleClickedEvent } from '@xh/hoist/kit/ag-grid';
 import { ExportOptions } from '@xh/hoist/svc/GridExportService';
 import { ReactNode, RefObject } from 'react';
 import { GridAutosizeOptions } from './GridAutosizeOptions';
@@ -483,6 +483,8 @@ export declare class GridModel extends HoistModel {
      * @param colStateChanges - changes to apply to the columns. If all leaf
      *     columns are represented in these changes then the sort order will be applied as well.
      */
+    updateColumnState(colStateChanges: Partial<ColumnState>[]): void;
+    /** @deprecated - use {@link updateColumnState} instead. */
     applyColumnStateChanges(colStateChanges: Partial<ColumnState>[]): void;
     getColumn(colId: string): Column;
     getColumnGroup(groupId: string): ColumnGroup;

package/build/types/cmp/relativetimestamp/RelativeTimestamp.d.ts

@@ -7,12 +7,6 @@ interface RelativeTimestampProps extends HoistProps, BoxProps, RelativeTimestamp
     bind?: string;
     /** Date or milliseconds representing the starting time / time to compare. See also `bind`. */
     timestamp?: Date | number;
-    /**
-     * Formatting options.
-     *
-     * @deprecated - these options should be spread into this object directly.
-     */
-    options?: RelativeTimestampOptions;
 }
 export interface RelativeTimestampOptions {
     /** Allow dates greater than Date.now().*/

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

@@ -116,9 +116,7 @@ export declare class AppSpec<T extends HoistAppModel = HoistAppModel> {
      *  initialized, including a breakdown of elapsed time throughout the init process.
      */
     trackAppLoad?: boolean;
-    /** @deprecated - use {@link AppSpec.disableWebSockets} instead. */
-    webSocketsEnabled?: boolean;
-    constructor({ authModelClass, checkAccess, clientAppCode, clientAppName, componentClass, containerClass, disableWebSockets, enableXssProtection, enableLoginForm, enableLogout, idlePanel, isMobileApp, lockoutMessage, lockoutPanel, loginMessage, modelClass, showBrowserContextMenu, trackAppLoad, webSocketsEnabled }: {
+    constructor({ authModelClass, checkAccess, clientAppCode, clientAppName, componentClass, containerClass, disableWebSockets, enableXssProtection, enableLoginForm, enableLogout, idlePanel, isMobileApp, lockoutMessage, lockoutPanel, loginMessage, modelClass, showBrowserContextMenu, trackAppLoad }: {
         authModelClass?: typeof HoistAuthModel;
         checkAccess: any;
         clientAppCode?: string;
@@ -137,6 +135,5 @@ export declare class AppSpec<T extends HoistAppModel = HoistAppModel> {
         modelClass: any;
         showBrowserContextMenu?: boolean;
         trackAppLoad?: boolean;
-        webSocketsEnabled: any;
     });
 }

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

@@ -139,7 +139,7 @@ export declare abstract class HoistBase {
     /** @returns true if this instance has been destroyed. */
     get isDestroyed(): boolean;
     /**
-     * Clean up resources associated with this object
+     * Clean up resources associated with this object.
      */
     destroy(): void;
 }

package/build/types/desktop/cmp/dash/canvas/DashCanvas.d.ts

@@ -1,6 +1,6 @@
-import { type ReactGridLayoutProps } from 'react-grid-layout';
 import { HoistProps, TestSupportProps } from '@xh/hoist/core';
 import '@xh/hoist/desktop/register';
+import type { ReactGridLayoutProps } from 'react-grid-layout';
 import { DashCanvasModel } from './DashCanvasModel';
 import 'react-grid-layout/css/styles.css';
 import './DashCanvas.scss';

package/build/types/desktop/cmp/dash/canvas/DashCanvasModel.d.ts

@@ -1,4 +1,3 @@
-import type { DragOverEvent, Layout } from 'react-grid-layout';
 import { Persistable, PersistableState } from '@xh/hoist/core';
 import { DashCanvasViewModel, DashCanvasViewSpec, DashConfig, DashViewState, DashModel } from '../';
 import '@xh/hoist/desktop/register';
@@ -21,30 +20,6 @@ export interface DashCanvasConfig extends DashConfig<DashCanvasViewSpec, DashCan
     maxRows?: number;
     /** Padding inside the container [x, y] in pixels. Defaults to same as `margin`. */
     containerPadding?: [number, number];
-    /**
-     * Whether the canvas should accept drag-and-drop of views from outside
-     * the canvas. Default false.
-     */
-    droppable?: boolean;
-    /**
-     * Optional Callback to invoke after a view is successfully dropped onto the canvas.
-     */
-    onDropDone?: (viewModel: DashCanvasViewModel) => void;
-    /**
-     * Optional callback to invoke when an item is dragged over the canvas. This may be used to
-     * customize how the size of the dropping placeholder is calculated. The callback should
-     * return an object with optional 'w' and 'h' properties indicating the desired width and height
-     * (in grid units) of the dropping placeholder. If not provided, Hoist's own default logic will be used.
-     */
-    onDropDragOver?: (e: DragOverEvent) => {
-        w?: number;
-        h?: number;
-    } | false | undefined;
-    /**
-     * Whether an overlay with an Add View button should be rendered
-     * when the canvas is empty. Default true.
-     */
-    showAddViewButtonWhenEmpty?: boolean;
 }
 export interface DashCanvasItemState {
     layout: DashCanvasItemLayout;
@@ -70,12 +45,7 @@ export declare class DashCanvasModel extends DashModel<DashCanvasViewSpec, DashC
     compact: boolean;
     margin: [number, number];
     containerPadding: [number, number];
-    DROPPING_ELEM_ID: string;
     maxRows: number;
-    showAddViewButtonWhenEmpty: boolean;
-    droppable: boolean;
-    onDropDone: (viewModel: DashCanvasViewModel) => void;
-    draggedInView: DashCanvasItemState;
     /** Current number of rows in canvas */
     get rows(): number;
     get isEmpty(): boolean;
@@ -84,7 +54,7 @@ export declare class DashCanvasModel extends DashModel<DashCanvasViewSpec, DashC
     isResizing: boolean;
     private isLoadingState;
     get rglLayout(): any[];
-    constructor({ viewSpecs, viewSpecDefaults, initialState, layoutLocked, contentLocked, renameLocked, persistWith, emptyText, addViewButtonText, columns, rowHeight, compact, margin, maxRows, containerPadding, extraMenuItems, showAddViewButtonWhenEmpty, droppable, onDropDone, onDropDragOver }: DashCanvasConfig);
+    constructor({ viewSpecs, viewSpecDefaults, initialState, layoutLocked, contentLocked, renameLocked, persistWith, emptyText, addViewButtonText, columns, rowHeight, compact, margin, maxRows, containerPadding, extraMenuItems }: DashCanvasConfig);
     /** Removes all views from the canvas */
     clear(): void;
     /**
@@ -122,22 +92,15 @@ export declare class DashCanvasModel extends DashModel<DashCanvasViewSpec, DashC
     renameView(id: string): void;
     /** Scrolls a DashCanvasView into view. */
     ensureViewVisible(id: string): void;
-    onDrop(rglLayout: Layout[], layoutItem: Layout, evt: Event): void;
-    setDraggedInView(view?: DashCanvasItemState): void;
-    onDropDragOver(e: DragOverEvent): {
-        w?: number;
-        h?: number;
-    } | false | undefined;
     getPersistableState(): PersistableState<{
         state: DashCanvasItemState[];
     }>;
     setPersistableState(persistableState: PersistableState<{
         state: DashCanvasItemState[];
     }>): void;
-    private doDrop;
     private getLayoutFromPosition;
     private addViewInternal;
-    onRglLayoutChange(rglLayout: Layout[]): void;
+    onRglLayoutChange(rglLayout: any): void;
     private setLayout;
     private loadState;
     private buildState;

package/build/types/desktop/cmp/grouping/GroupingChooser.d.ts

@@ -20,8 +20,6 @@ export interface GroupingChooserProps extends ButtonProps<GroupingChooserModel>
     popoverMinHeight?: number;
     /** Position of popover relative to target button. */
     popoverPosition?: 'bottom' | 'top';
-    /** @deprecated - use `editorTitle` instead */
-    popoverTitle?: ReactNode;
     /**
      * Width in pixels of the popover menu itself.
      * If unspecified, will default based on favorites enabled status + side.

package/build/types/desktop/cmp/leftrightchooser/LeftRightChooserModel.d.ts

@@ -1,5 +1,5 @@
-import { GridModel } from '@xh/hoist/cmp/grid';
-import { HoistModel, HSide } from '@xh/hoist/core';
+import { GridModel, GridSorterLike } from '@xh/hoist/cmp/grid';
+import { HoistModel, HSide, Some } from '@xh/hoist/core';
 import '@xh/hoist/desktop/register';
 import { FilterTestFn, StoreRecord } from '@xh/hoist/data';
 export interface LeftRightChooserConfig {
@@ -14,11 +14,13 @@ export interface LeftRightChooserConfig {
     showCounts?: boolean;
     leftTitle?: string;
     leftSorted?: boolean;
+    leftSortBy?: Some<GridSorterLike>;
     leftGroupingEnabled?: boolean;
     leftGroupingExpanded?: boolean;
     leftEmptyText?: string;
     rightTitle?: string;
     rightSorted?: boolean;
+    rightSortBy?: Some<GridSorterLike>;
     rightGroupingEnabled?: boolean;
     rightGroupingExpanded?: boolean;
     rightEmptyText?: string;
@@ -39,6 +41,7 @@ export interface LeftRightChooserItem {
     /** True to prevent the user from moving the item between sides. */
     locked?: boolean;
     exclude?: boolean;
+    sortValue?: any;
 }
 /**
  * A Model for managing the state of a LeftRightChooser.
@@ -72,7 +75,7 @@ export declare class LeftRightChooserModel extends HoistModel {
     get rightValues(): any[];
     /** Currently 'selected' values on the left hand side. */
     get leftValues(): any[];
-    constructor({ data, onChange, ungroupedName, leftTitle, leftSorted, leftGroupingEnabled, leftGroupingExpanded, leftEmptyText, readonly, rightTitle, rightSorted, rightGroupingEnabled, rightGroupingExpanded, rightEmptyText, showCounts, xhImpl }: LeftRightChooserConfig);
+    constructor({ data, onChange, ungroupedName, leftTitle, leftSorted, leftSortBy, leftGroupingEnabled, leftGroupingExpanded, leftEmptyText, readonly, rightTitle, rightSorted, rightSortBy, rightGroupingEnabled, rightGroupingExpanded, rightEmptyText, showCounts, xhImpl }: LeftRightChooserConfig);
     setData(data: LeftRightChooserItem[]): void;
     moveRows(rows: StoreRecord[]): void;
     private getTextColRenderer;

package/build/types/kit/ag-grid/index.d.ts

@@ -13,7 +13,7 @@ export declare let agGridVersion: any;
  * implementations.
  */
 export type { GridOptions, GridApi, SortDirection, ColDef, ColGroupDef, GetContextMenuItemsParams, GridReadyEvent, IHeaderGroupParams, IHeaderParams, ProcessCellForExportParams, CellClassParams, HeaderClassParams, HeaderValueGetterParams, ICellRendererParams, ITooltipParams, IRowNode, RowClassParams, ValueGetterParams, ValueSetterParams, MenuItemDef, CellPosition, NavigateToNextCellParams, ColumnEvent, ColumnState as AgColumnState, Column as AgColumn, ColumnGroup as AgColumnGroup, AgProvidedColumnGroup, RowDoubleClickedEvent, RowClickedEvent, RowHeightParams, CellClickedEvent, CellContextMenuEvent, CellDoubleClickedEvent, CellEditingStartedEvent, CellEditingStoppedEvent } from 'ag-grid-community';
-export type { CustomCellEditorProps, CustomMenuItemProps } from 'ag-grid-react';
+export type { CustomCellEditorProps, CustomCellRendererProps, CustomMenuItemProps } from 'ag-grid-react';
 export { useGridCellEditor, useGridMenuItem } from 'ag-grid-react';
 /**
  * Expose application versions of ag-Grid to Hoist.

package/cmp/grid/GridModel.ts

@@ -4,17 +4,6 @@
  *
  * Copyright © 2025 Extremely Heavy Industries Inc.
  */
-import {
-    CellClickedEvent,
-    CellContextMenuEvent,
-    CellDoubleClickedEvent,
-    CellEditingStartedEvent,
-    CellEditingStoppedEvent,
-    ColumnEvent,
-    AgColumnState,
-    RowClickedEvent,
-    RowDoubleClickedEvent
-} from '@xh/hoist/kit/ag-grid';
 import {AgGridModel} from '@xh/hoist/cmp/ag-grid';
 import {
     Column,
@@ -56,15 +45,27 @@ import {
 import {ColChooserModel as DesktopColChooserModel} from '@xh/hoist/dynamics/desktop';
 import {ColChooserModel as MobileColChooserModel} from '@xh/hoist/dynamics/mobile';
 import {Icon} from '@xh/hoist/icon';
+import {
+    AgColumnState,
+    CellClickedEvent,
+    CellContextMenuEvent,
+    CellDoubleClickedEvent,
+    CellEditingStartedEvent,
+    CellEditingStoppedEvent,
+    ColumnEvent,
+    RowClickedEvent,
+    RowDoubleClickedEvent
+} from '@xh/hoist/kit/ag-grid';
 import {action, bindable, makeObservable, observable, when} from '@xh/hoist/mobx';
 import {wait, waitFor} from '@xh/hoist/promise';
 import {ExportOptions} from '@xh/hoist/svc/GridExportService';
 import {SECONDS} from '@xh/hoist/utils/datetime';
 import {
-    sharePendingPromise,
+    apiDeprecated,
     deepFreeze,
     executeIfFunction,
     logWithDebug,
+    sharePendingPromise,
     throwIf,
     warnIf,
     withDefault
@@ -1183,7 +1184,7 @@ export class GridModel extends HoistModel {
         );
 
         pull(colStateChanges, null);
-        this.applyColumnStateChanges(colStateChanges);
+        this.updateColumnState(colStateChanges);
     }
 
     @action
@@ -1214,7 +1215,7 @@ export class GridModel extends HoistModel {
         const col = this.findColumn(this.columns, colId);
         if (!width || !col || col.flex) return;
         const colStateChanges = [{colId, width, manuallySized: true}];
-        this.applyColumnStateChanges(colStateChanges);
+        this.updateColumnState(colStateChanges);
     }
 
     /**
@@ -1230,7 +1231,7 @@ export class GridModel extends HoistModel {
      *     columns are represented in these changes then the sort order will be applied as well.
      */
     @action
-    applyColumnStateChanges(colStateChanges: Partial<ColumnState>[]) {
+    updateColumnState(colStateChanges: Partial<ColumnState>[]): void {
         if (isEmpty(colStateChanges)) return;
 
         let columnState = cloneDeep(this.columnState);
@@ -1260,6 +1261,16 @@ export class GridModel extends HoistModel {
         }
     }
 
+    /** @deprecated - use {@link updateColumnState} instead. */
+    applyColumnStateChanges(colStateChanges: Partial<ColumnState>[]): void {
+        apiDeprecated('GridModel.applyColumnStateChanges()', {
+            msg: 'Use updateColumnState() instead.',
+            v: '82',
+            source: GridModel
+        });
+        this.updateColumnState(colStateChanges);
+    }
+
     getColumn(colId: string): Column {
         return this.findColumn(this.columns, colId);
     }
@@ -1295,7 +1306,7 @@ export class GridModel extends HoistModel {
     }
 
     setColumnVisible(colId: string, visible: boolean) {
-        this.applyColumnStateChanges([{colId, hidden: !visible}]);
+        this.updateColumnState([{colId, hidden: !visible}]);
     }
 
     showColumn(colId: string) {
@@ -1307,7 +1318,7 @@ export class GridModel extends HoistModel {
     }
 
     setColumnGroupVisible(groupId: string, visible: boolean) {
-        this.applyColumnStateChanges(
+        this.updateColumnState(
             this.getColumnGroup(groupId)
                 .getLeafColumns()
                 .map(({colId}) => ({colId, hidden: !visible}))

package/cmp/relativetimestamp/RelativeTimestamp.ts

@@ -4,9 +4,6 @@
  *
  * Copyright © 2025 Extremely Heavy Industries Inc.
  */
-import {getLayoutProps} from '@xh/hoist/utils/react';
-import {inRange, isNil} from 'lodash';
-import moment from 'moment';
 import {box, span} from '@xh/hoist/cmp/layout';
 import {
     BoxProps,
@@ -21,7 +18,10 @@ import {fmtCompactDate, fmtDateTime} from '@xh/hoist/format';
 import {action, computed, makeObservable, observable} from '@xh/hoist/mobx';
 import {Timer} from '@xh/hoist/utils/async';
 import {DAYS, HOURS, LocalDate, SECONDS} from '@xh/hoist/utils/datetime';
-import {apiDeprecated, logWarn, withDefault} from '@xh/hoist/utils/js';
+import {logWarn, withDefault} from '@xh/hoist/utils/js';
+import {getLayoutProps} from '@xh/hoist/utils/react';
+import {inRange, isNil} from 'lodash';
+import moment from 'moment';
 
 interface RelativeTimestampProps extends HoistProps, BoxProps, RelativeTimestampOptions {
     /**
@@ -32,13 +32,6 @@ interface RelativeTimestampProps extends HoistProps, BoxProps, RelativeTimestamp
 
     /** Date or milliseconds representing the starting time / time to compare. See also `bind`. */
     timestamp?: Date | number;
-
-    /**
-     * Formatting options.
-     *
-     * @deprecated - these options should be spread into this object directly.
-     */
-    options?: RelativeTimestampOptions;
 }
 
 export interface RelativeTimestampOptions {
@@ -133,16 +126,7 @@ class RelativeTimestampLocalModel extends HoistModel {
 
     @computed.struct
     get options(): RelativeTimestampOptions {
-        const {componentProps} = this;
-
-        apiDeprecated('options', {
-            test: componentProps.options,
-            msg: 'Spread options directly in this object instead',
-            v: `v78`,
-            source: RelativeTimestamp
-        });
-
-        return componentProps.options ?? componentProps;
+        return this.componentProps as RelativeTimestampProps;
     }
 
     constructor() {

package/core/AppSpec.ts

@@ -5,8 +5,8 @@
  * Copyright © 2025 Extremely Heavy Industries Inc.
  */
 import {ElementFactory, HoistAppModel, HoistAuthModel, HoistProps, XH} from '@xh/hoist/core';
-import {apiDeprecated, throwIf} from '@xh/hoist/utils/js';
-import {isFunction, isNil, isString, isUndefined} from 'lodash';
+import {throwIf} from '@xh/hoist/utils/js';
+import {isFunction, isNil, isString} from 'lodash';
 import {Component, ComponentClass, FunctionComponent} from 'react';
 
 /**
@@ -140,9 +140,6 @@ export class AppSpec<T extends HoistAppModel = HoistAppModel> {
      */
     trackAppLoad?: boolean;
 
-    /** @deprecated - use {@link AppSpec.disableWebSockets} instead. */
-    webSocketsEnabled?: boolean;
-
     constructor({
         authModelClass = HoistAuthModel,
         checkAccess,
@@ -161,8 +158,7 @@ export class AppSpec<T extends HoistAppModel = HoistAppModel> {
         loginMessage = null,
         modelClass,
         showBrowserContextMenu = false,
-        trackAppLoad = true,
-        webSocketsEnabled
+        trackAppLoad = true
     }) {
         throwIf(!componentClass, 'A Hoist App must define a componentClass');
 
@@ -180,17 +176,6 @@ export class AppSpec<T extends HoistAppModel = HoistAppModel> {
             'A Hoist App must specify a required role string or a function for checkAccess.'
         );
 
-        if (!isUndefined(webSocketsEnabled)) {
-            let msg: string;
-            if (webSocketsEnabled === false) {
-                disableWebSockets = true;
-                msg = `Specify disableWebSockets: true to continue actively disabling WebSockets if required.`;
-            } else {
-                msg = `WebSockets are now enabled by default - this property can be safely removed from your appSpec.`;
-            }
-            apiDeprecated('webSocketsEnabled', {msg, v: 'v78'});
-        }
-
         this.authModelClass = authModelClass;
         this.checkAccess = checkAccess;
         this.clientAppCode = clientAppCode;
@@ -209,6 +194,5 @@ export class AppSpec<T extends HoistAppModel = HoistAppModel> {
         this.modelClass = modelClass;
         this.showBrowserContextMenu = showBrowserContextMenu;
         this.trackAppLoad = trackAppLoad;
-        this.webSocketsEnabled = !disableWebSockets;
     }
 }

package/core/HoistBase.ts

@@ -287,9 +287,15 @@ export abstract class HoistBase {
     }
 
     /**
-     * Clean up resources associated with this object
+     * Clean up resources associated with this object.
      */
     destroy() {
+        // If a model is being destroyed or has already been destroyed, no need to destroy it again.
+        // Prevents stack overflow in case this model gets a managed reference chain back to itself.
+        if (this.isDestroyed) {
+            this.logWarn('Destruction skipped - this model is already destroyed.');
+            return;
+        }
         this._destroyed = true;
         this.disposers.forEach(f => f());
         this.managedInstances.forEach(i => XH.safeDestroy(i));

package/desktop/cmp/dash/canvas/DashCanvas.ts

@@ -4,12 +4,6 @@
  *
  * Copyright © 2025 Extremely Heavy Industries Inc.
  */
-import ReactGridLayout, {
-    type ReactGridLayoutProps,
-    type DragOverEvent,
-    type Layout,
-    WidthProvider
-} from 'react-grid-layout';
 import {showContextMenu} from '@xh/hoist/kit/blueprint';
 import composeRefs from '@seznam/compose-react-refs';
 import {div, vbox, vspacer} from '@xh/hoist/cmp/layout';
@@ -26,6 +20,8 @@ import '@xh/hoist/desktop/register';
 import {Classes, overlay} from '@xh/hoist/kit/blueprint';
 import {consumeEvent, TEST_ID} from '@xh/hoist/utils/js';
 import classNames from 'classnames';
+import ReactGridLayout, {WidthProvider} from 'react-grid-layout';
+import type {ReactGridLayoutProps} from 'react-grid-layout';
 import {DashCanvasModel} from './DashCanvasModel';
 import {dashCanvasContextMenu} from './impl/DashCanvasContextMenu';
 import {dashCanvasView} from './impl/DashCanvasView';
@@ -91,7 +87,7 @@ export const [DashCanvas, dashCanvas] = hoistCmp.withFactory<DashCanvasProps>({
                         draggableHandle:
                             '.xh-dash-tab.xh-panel > .xh-panel__content > .xh-panel-header',
                         draggableCancel: '.xh-button',
-                        onLayoutChange: (layout: Layout[]) => model.onRglLayoutChange(layout),
+                        onLayoutChange: layout => model.onRglLayoutChange(layout),
                         onResizeStart: () => (model.isResizing = true),
                         onResizeStop: () => (model.isResizing = false),
                         items: model.viewModels.map(vm =>
@@ -100,13 +96,9 @@ export const [DashCanvas, dashCanvas] = hoistCmp.withFactory<DashCanvasProps>({
                                 item: dashCanvasView({model: vm})
                             })
                         ),
-                        isDroppable: model.droppable,
-                        onDrop: (layout: Layout[], layoutItem: Layout, evt: Event) =>
-                            model.onDrop(layout, layoutItem, evt),
-                        onDropDragOver: (evt: DragOverEvent) => model.onDropDragOver(evt),
                         ...rglOptions
                     }),
-                    emptyContainerOverlay({omit: !model.showAddViewButtonWhenEmpty})
+                    emptyContainerOverlay()
                 ],
                 [TEST_ID]: testId
             })