@xh/hoist 77.0.1 → 77.1.1

package/CHANGELOG.md

@@ -1,11 +1,23 @@
 # Changelog
 
+## 77.1.1 - 2025-11-12
+
+### 🎁 New Features
+*  New method `StoreRecord.getModifiedValues()` to gather edited data from a store record.
+
+### 🐞 Bug Fixes
+*  StoreRecord will no longer report `isModified` as `true` if a field has been edited and
+   then returned to its original value in a subsequent edit.
+*  Restore support for `TabModel.content` being nullable to support dynamic tab content.
+*  Remove stray context menu from appearing when clicking on column group headers and other grid
+   empty space.
+
 ## 77.0.1 - 2025-10-29
 
 ### 💥 Breaking Changes
 
-* The `disableXssProtection` flag supported by `AppSpec` and `FieldSpec` has been removed and
-  replaced with its opposite, `enableXssProtection`, now an opt-in feature.
+* Removed the `disableXssProtection` flag supported by `AppSpec` and `FieldSpec` and replaced with
+  its opposite, `enableXssProtection`, now an opt-in feature.
     * While store-based XSS protection via DomPurify is still available to apps that can display
       untrusted or potentially malicious data, this is an uncommon use case for Hoist apps and was
       deemed to not provide enough benefit relative to potential performance pitfalls for most
@@ -17,20 +29,25 @@
 
 ### 🐞 Bug Fixes
 
-* Fixes regressions in grid context menu for filtering and copy/paste introduced by agGrid v34.
-* Fixes `getExpandState` in `AgGridModel`
+* Fixed regressions in grid context menus for filtering and copy/paste introduced by AG Grid v34.
+    * Note: AG Grid v34+ no longer supports HTML markup in context menus. Applications setting the
+      `text` or `secondaryText` properties of `RecordGridAction` to markup should be sure to use
+      React nodes for formatting instead.
+* Fixed `AgGridModel.getExpandState()` not returning a full representation of expanded groups -
+  an issue that primarily affected linked tree map visualizations.
+
+### ⚙️ Technical
+
+* Support Grails 7 service name conventions in admin client (backward compatible)
 
-* Note: As of v34, AgGrid no longer supports html markup in context menus.  Applications setting
-  the `text` or `secondaryText` properties of `RecordGridAction` to markup should be sure to use
-  react nodes for formatting instead.
 
 ## 76.2.0 - 2025-10-22
 
 ### ⚙️ Technical
 
-* Performance improvements to Store for large data sets.
-* New property `cubeRowType` on `ViewRowData` supports identifying bucketed rows.
-* `waitFor` can accept a null value for a timeout.
+* Implemented minor performance improvements within `Store` for large data sets.
+* Added new `ViewRowData.cubeRowType` property to support identifying bucketed rows.
+* Improved `waitFor` to accept a `null` value for its timeout.
 
 ## 76.1.0 - 2025-10-17
 

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

@@ -152,7 +152,13 @@ export class ServiceModel extends BaseInstanceModel {
     }
 
     private processRawData(r: PlainObject) {
-        const provider = r.name && r.name.startsWith('hoistCore') ? 'Hoist' : 'App';
+        // For Grails <=6, plugin is prefix in name.
+        // For Grails >7, we provide class to determine provider
+        // TODO: simplify when Hoist v34+ required.
+        const provider =
+            r.name.startsWith('hoistCore') || r.className?.startsWith('io.xh.hoist')
+                ? 'Hoist'
+                : 'App';
         const displayName = lowerFirst(r.name.replace('hoistCore', ''));
         return {provider, displayName, ...r};
     }

package/admin/tabs/general/config/ConfigPanelModel.ts

@@ -7,7 +7,7 @@
 import {exportFilenameWithDate} from '@xh/hoist/admin/AdminUtils';
 import {AppModel} from '@xh/hoist/admin/AppModel';
 import * as Col from '@xh/hoist/admin/columns';
-import {hbox, hspacer} from '@xh/hoist/cmp/layout';
+import {br, fragment, hbox, hspacer} from '@xh/hoist/cmp/layout';
 import {HoistModel, LoadSpec, managed, XH} from '@xh/hoist/core';
 import {FieldSpec} from '@xh/hoist/data';
 import {defaultReadonlyRenderer} from '@xh/hoist/desktop/cmp/form';
@@ -17,14 +17,14 @@ import {
     cloneAction,
     deleteAction,
     editAction,
-    RestGridModel,
-    RestStore
+    RestGridModel
 } from '@xh/hoist/desktop/cmp/rest';
+import {Icon} from '@xh/hoist/icon';
 import {action, makeObservable, observable} from '@xh/hoist/mobx';
+import {pluralize} from '@xh/hoist/utils/js';
 import {isNil, truncate} from 'lodash';
 import {DifferModel} from '../../../differ/DifferModel';
 import {RegroupDialogModel} from '../../../regroup/RegroupDialogModel';
-import {Icon} from '@xh/hoist/icon';
 
 export class ConfigPanelModel extends HoistModel {
     override persistWith = {localStorageKey: 'xhAdminConfigState'};
@@ -43,18 +43,27 @@ export class ConfigPanelModel extends HoistModel {
         super();
         makeObservable(this);
 
-        const required = true,
+        const {regroupAction} = this.regroupDialogModel,
+            required = true,
             enableCreate = true,
             hidden = true;
 
         this.gridModel = new RestGridModel({
-            readonly: AppModel.readonly,
-            persistWith: this.persistWith,
+            // Core config
+            autosizeOptions: {mode: 'managed', includeCollapsedChildren: true},
             colChooserModel: true,
             enableExport: true,
             exportOptions: {filename: exportFilenameWithDate('configs')},
+            filterFields: ['name', 'value', 'groupName', 'note'],
+            groupBy: 'groupName',
+            persistWith: this.persistWith,
+            prepareCloneFn: ({clone}) => (clone.name = `${clone.name}_CLONE`),
+            readonly: AppModel.readonly,
             selModel: 'multiple',
-            store: new RestStore({
+            sortBy: 'name',
+            unit: 'config',
+            // Store + fields
+            store: {
                 url: 'rest/configAdmin',
                 reloadLookupsOnLoad: true,
                 fieldDefaults: {enableXssProtection: false},
@@ -83,25 +92,8 @@ export class ConfigPanelModel extends HoistModel {
                         editable: false
                     }
                 ]
-            }),
-            actionWarning: {
-                del: records =>
-                    `Are you sure you want to delete ${records.length} config(s)? Deleting configs can break running apps.`
             },
-            toolbarActions: [addAction, editAction, cloneAction, deleteAction],
-            menuActions: [
-                addAction,
-                editAction,
-                cloneAction,
-                deleteAction,
-                '-',
-                this.regroupDialogModel.regroupAction
-            ],
-            prepareCloneFn: ({clone}) => (clone.name = `${clone.name}_CLONE`),
-            unit: 'config',
-            filterFields: ['name', 'value', 'groupName', 'note'],
-            sortBy: 'name',
-            groupBy: 'groupName',
+            // Cols + editors
             columns: [
                 {...Col.groupName, hidden},
                 {...Col.name},
@@ -138,7 +130,19 @@ export class ConfigPanelModel extends HoistModel {
                 {field: 'clientVisible'},
                 {field: 'lastUpdated'},
                 {field: 'lastUpdatedBy'}
-            ]
+            ],
+            // Actions
+            actionWarning: {
+                del: records =>
+                    fragment(
+                        `Are you sure you want to delete ${pluralize('selected config', records.length, true)}?`,
+                        br(),
+                        br(),
+                        `Deleting configs can break running apps.`
+                    )
+            },
+            menuActions: [addAction, editAction, cloneAction, deleteAction, '-', regroupAction],
+            toolbarActions: [addAction, editAction, cloneAction, deleteAction]
         });
     }
 

package/admin/tabs/userData/prefs/UserPreferenceModel.ts

@@ -25,12 +25,19 @@ export class UserPreferenceModel extends HoistModel {
             hidden = true;
 
         this.gridModel = new RestGridModel({
-            readonly: AppModel.readonly,
-            persistWith: {localStorageKey: 'xhAdminUserPreferenceState'},
+            // Core config
+            autosizeOptions: {mode: 'managed', includeCollapsedChildren: true},
             colChooserModel: true,
             enableExport: true,
             exportOptions: {filename: exportFilenameWithDate('user-prefs')},
+            filterFields: ['name', 'username'],
+            groupBy: 'groupName',
+            persistWith: {localStorageKey: 'xhAdminUserPreferenceState'},
+            readonly: AppModel.readonly,
             selModel: 'multiple',
+            sortBy: 'name',
+            unit: 'user preference',
+            // Store + fields
             store: {
                 url: 'rest/userPreferenceAdmin',
                 reloadLookupsOnLoad: true,
@@ -55,10 +62,7 @@ export class UserPreferenceModel extends HoistModel {
                     {...(Col.lastUpdatedBy.field as FieldSpec), editable: false}
                 ]
             },
-            sortBy: 'name',
-            groupBy: 'groupName',
-            unit: 'user preference',
-            filterFields: ['name', 'username'],
+            // Cols + editors
             columns: [
                 {...Col.name},
                 {...Col.type},

package/admin/tabs/userData/prefs/editor/PrefEditorModel.ts

@@ -7,11 +7,13 @@
 import {exportFilenameWithDate} from '@xh/hoist/admin/AdminUtils';
 import {AppModel} from '@xh/hoist/admin/AppModel';
 import * as Col from '@xh/hoist/admin/columns';
+import {br, fragment} from '@xh/hoist/cmp/layout';
 import {HoistModel, LoadSpec, managed, XH} from '@xh/hoist/core';
 import {FieldSpec} from '@xh/hoist/data';
 import {textArea} from '@xh/hoist/desktop/cmp/input';
 import {addAction, deleteAction, editAction, RestGridModel} from '@xh/hoist/desktop/cmp/rest';
 import {action, makeObservable, observable} from '@xh/hoist/mobx';
+import {pluralize} from '@xh/hoist/utils/js';
 import {DifferModel} from '../../../../differ/DifferModel';
 import {RegroupDialogModel} from '../../../../regroup/RegroupDialogModel';
 
@@ -32,18 +34,26 @@ export class PrefEditorModel extends HoistModel {
         super();
         makeObservable(this);
 
-        const required = true,
+        const {regroupAction} = this.regroupDialogModel,
+            required = true,
             enableCreate = true,
             hidden = true;
 
         this.gridModel = new RestGridModel({
-            readonly: AppModel.readonly,
-            persistWith: this.persistWith,
+            // Core config
+            autosizeOptions: {mode: 'managed', includeCollapsedChildren: true},
             colChooserModel: true,
             enableExport: true,
             exportOptions: {filename: exportFilenameWithDate('prefs')},
+            filterFields: ['name', 'groupName'],
+            groupBy: 'groupName',
+            persistWith: this.persistWith,
+            readonly: AppModel.readonly,
             selModel: 'multiple',
             showRefreshButton: true,
+            sortBy: 'name',
+            unit: 'preference',
+            // Store + fields
             store: {
                 url: 'rest/preferenceAdmin',
                 reloadLookupsOnLoad: true,
@@ -68,21 +78,7 @@ export class PrefEditorModel extends HoistModel {
                     {...(Col.lastUpdatedBy.field as FieldSpec), editable: false}
                 ]
             },
-            sortBy: 'name',
-            groupBy: 'groupName',
-            unit: 'preference',
-            filterFields: ['name', 'groupName'],
-            actionWarning: {
-                del: records =>
-                    `Are you sure you want to delete ${records.length} preference(s)? Deleting preferences can break running apps.`
-            },
-            menuActions: [
-                addAction,
-                editAction,
-                deleteAction,
-                '-',
-                this.regroupDialogModel.regroupAction
-            ],
+            // Cols + Editors
             columns: [
                 {...Col.name},
                 {...Col.type},
@@ -100,7 +96,18 @@ export class PrefEditorModel extends HoistModel {
                 {field: 'notes', formField: {item: textArea({height: 100})}},
                 {field: 'lastUpdated'},
                 {field: 'lastUpdatedBy'}
-            ]
+            ],
+            // Actions
+            actionWarning: {
+                del: records =>
+                    fragment(
+                        `Are you sure you want to delete ${pluralize('selected preference', records.length, true)}?`,
+                        br(),
+                        br(),
+                        `Deleting preference definitions can break running apps.`
+                    )
+            },
+            menuActions: [addAction, editAction, deleteAction, '-', regroupAction]
         });
     }
 

package/build/types/core/persist/PersistOptions.d.ts

@@ -35,12 +35,12 @@ export interface PersistOptions {
     viewManagerModel?: ViewManagerModel;
     /**
      *  Function returning blob of data to be used for reading state.
-     *  Ignored if `prefKey`, `localStorageKey` or `dashViewModel` are provided.
+     *  Ignored if `prefKey`, `localStorageKey`, `dashViewModel` or 'viewManagerModel' are provided.
      */
     getData?: () => any;
     /**
      * Function to be used to write blob of data representing state.
-     * Ignored if `prefKey`, `localStorageKey` or `dashViewModel` are provided.
+     * Ignored if `prefKey`, `localStorageKey`, `dashViewModel` or 'viewManagerModel' are provided.
      */
     setData?: (data: object) => void;
 }

package/build/types/data/StoreRecord.d.ts

@@ -94,6 +94,14 @@ export declare class StoreRecord {
      * Field in the Store. Useful for cloning/iterating over all values (including defaults).
      */
     getValues(): PlainObject;
+    /**
+     * Get a map of modified values only.
+     *
+     * If record has no modifications, this method will return null.
+     * If modifications are returned, the returned object will include id,
+     * for convenience.
+     */
+    getModifiedValues(): PlainObject;
     /**
      * Construct a StoreRecord from a pre-processed `data` source object.
      *

package/build/types/desktop/cmp/rest/RestGridModel.d.ts

@@ -1,10 +1,11 @@
-import { RowDoubleClickedEvent } from '@xh/hoist/kit/ag-grid';
 import { BaseFieldConfig } from '@xh/hoist/cmp/form';
 import { GridConfig, GridModel } from '@xh/hoist/cmp/grid';
 import { ElementSpec, HoistModel, PlainObject } from '@xh/hoist/core';
 import '@xh/hoist/desktop/register';
 import { RecordAction, RecordActionSpec, StoreRecord } from '@xh/hoist/data';
+import { RowDoubleClickedEvent } from '@xh/hoist/kit/ag-grid';
 import { ExportOptions } from '@xh/hoist/svc';
+import { ReactNode } from 'react';
 import { FormFieldProps } from '../form';
 import { RestStore, RestStoreConfig } from './data/RestStore';
 import { RestFormModel } from './impl/RestFormModel';
@@ -22,9 +23,9 @@ export interface RestGridConfig extends GridConfig {
     showRefreshButton?: boolean;
     /** Warning to display before actions on a selection of records. */
     actionWarning?: {
-        add?: string | ((recs: StoreRecord[]) => string);
-        del?: string | ((recs: StoreRecord[]) => string);
-        edit?: string | ((recs: StoreRecord[]) => string);
+        add?: ReactNode | ((recs: StoreRecord[]) => ReactNode);
+        del?: ReactNode | ((recs: StoreRecord[]) => ReactNode);
+        edit?: ReactNode | ((recs: StoreRecord[]) => ReactNode);
     };
     /** Name that describes records in this grid. */
     unit?: string;

package/build/types/desktop/cmp/rest/impl/RestFormModel.d.ts

@@ -16,9 +16,9 @@ export declare class RestFormModel extends HoistModel {
     dialogRef: import("react").RefObject<HTMLElement>;
     get unit(): string;
     get actionWarning(): {
-        add?: string | ((recs: import("@xh/hoist/data").StoreRecord[]) => string);
-        del?: string | ((recs: import("@xh/hoist/data").StoreRecord[]) => string);
-        edit?: string | ((recs: import("@xh/hoist/data").StoreRecord[]) => string);
+        add?: import("react").ReactNode | ((recs: import("@xh/hoist/data").StoreRecord[]) => import("react").ReactNode);
+        del?: import("react").ReactNode | ((recs: import("@xh/hoist/data").StoreRecord[]) => import("react").ReactNode);
+        edit?: import("react").ReactNode | ((recs: import("@xh/hoist/data").StoreRecord[]) => import("react").ReactNode);
     };
     get actions(): (import("@xh/hoist/data").RecordActionSpec | import("@xh/hoist/data").RecordAction)[];
     get editors(): RestGridEditor[];

package/cmp/chart/impl/copyToClipboard.ts

@@ -24,14 +24,14 @@ export function installCopyToClipboard(Highcharts) {
             try {
                 const blobPromise = convertChartToPngAsync(this),
                     clipboardItemInput = new window.ClipboardItem({
-                        // Safari requires an unresolved promise.  See https://bugs.webkit.org/show_bug.cgi?id=222262 for discussion
+                        // Safari requires an unresolved promise. See https://bugs.webkit.org/show_bug.cgi?id=222262 for discussion
                         'image/png': Highcharts.isSafari ? blobPromise : await blobPromise
                     });
                 await window.navigator.clipboard.write([clipboardItemInput]);
                 XH.successToast('Chart copied to clipboard');
             } catch (e) {
                 XH.handleException(e, {showAlert: false, logOnServer: true});
-                XH.dangerToast('Error: Chart could not be copied.  This error has been logged.');
+                XH.dangerToast('Error: Chart could not be copied. This error has been logged.');
             }
         }
     });
@@ -41,14 +41,7 @@ export function installCopyToClipboard(Highcharts) {
 // Implementation
 //------------------
 async function convertChartToPngAsync(chart) {
-    const svg = await new Promise((resolve, reject) =>
-            chart.getSVGForLocalExport(
-                chart.options.exporting,
-                {},
-                () => reject('Cannot fallback to export server'),
-                svg => resolve(svg)
-            )
-        ),
+    const svg = chart.getSVG(),
         svgUrl = svgToDataUrl(svg),
         pngDataUrl = await svgUrlToPngDataUrlAsync(svgUrl),
         ret = await loadBlob(pngDataUrl);
@@ -65,7 +58,7 @@ function memoryCleanup(svgUrl) {
 }
 
 /**
- * Convert dataUri converted to blob
+ * Convert dataUri to blob
  */
 async function loadBlob(dataUrl) {
     const fetched = await fetch(dataUrl);
@@ -84,7 +77,7 @@ function svgToDataUrl(svg) {
     try {
         // Safari requires data URI since it doesn't allow navigation to blob
         // URLs.
-        // foreignObjects dont work well in Blobs in Chrome (#14780).
+        // foreignObjects don't work well in Blobs in Chrome (#14780).
         if (!isWebKitButNotChrome && svg.indexOf('<foreignObject') === -1) {
             return domurl.createObjectURL(
                 new window.Blob([svg], {
@@ -94,7 +87,7 @@ function svgToDataUrl(svg) {
         }
     } catch (e) {}
 
-    // safari, firefox, or svgs with foreignObect returns this
+    // Safari, Firefox, or SVGs with foreignObect returns this
     return 'data:image/svg+xml;charset=UTF-8,' + encodeURIComponent(svg);
 }
 

package/cmp/grid/Grid.ts

@@ -205,10 +205,10 @@ export class GridLocalModel extends HoistModel {
             defaultColDef: {
                 sortable: true,
                 resizable: true,
-                suppressHeaderContextMenu: true,
                 suppressHeaderMenuButton: true,
                 menuTabs: ['filterMenuTab']
             },
+            getMainMenuItems: () => [],
             popupParent: document.querySelector('body'),
             suppressAggFuncInHeader: true,
             icons: {

package/cmp/tab/TabModel.ts

@@ -174,6 +174,8 @@ export class TabModel extends HoistModel {
     // Implementation
     //------------------
     private parseContent(content: Content | TabContainerConfig | TabConfig[]): Content {
+        if (!content) return null;
+
         // Recognize if content is a child container spec.
         let childConfig: TabContainerConfig = null;
         if (isArray(content)) {

package/cmp/treemap/TreeMap.ts

@@ -172,7 +172,6 @@ class TreeMapLocalModel extends HoistModel {
             this.prevConfig = cloneDeep(chartCfg);
             this.createChart(config);
         }
-
         this.updateLabelVisibility();
     }
 
@@ -199,9 +198,18 @@ class TreeMapLocalModel extends HoistModel {
         });
     }
 
+    // Reload series data by fully removing and re-adding the series.
+    // When treemap clustering is enabled, `setData()` & `series.update()` does not properly clear old cluster nodes,
+    // causing overlap or stale rendering. Removing and re-adding the series forces a full rebuild
+    // of the layout and clustering state, ensuring the chart is correctly redrawn.
     @logWithDebug
     reloadSeriesData(newData) {
-        this.chart?.series[0].setData(newData, true, false);
+        const {chart} = this;
+        if (!chart) return;
+        const oldSeries = chart.series[0],
+            series = Highcharts.merge(oldSeries.userOptions, {data: newData});
+        oldSeries.remove(false);
+        chart.addSeries(series, true);
     }
 
     startResize = ({width, height}) => {

package/cmp/treemap/TreeMapModel.ts

@@ -465,7 +465,7 @@ export class TreeMapModel extends HoistModel {
     //----------------------
     defaultOnClick = (record, e) => {
         const {gridModel} = this;
-        if (!gridModel) return;
+        if (!gridModel || !record) return;
 
         // Select nodes in grid
         const {selModel} = gridModel;
@@ -477,7 +477,7 @@ export class TreeMapModel extends HoistModel {
     };
 
     defaultOnDoubleClick = record => {
-        if (!this.gridModel?.treeMode || isEmpty(record.children)) return;
+        if (!this.gridModel?.treeMode || isEmpty(record?.children)) return;
         this.toggleNodeExpanded(record.treePath);
     };
 }

package/core/persist/PersistOptions.ts

@@ -59,13 +59,13 @@ export interface PersistOptions {
 
     /**
      *  Function returning blob of data to be used for reading state.
-     *  Ignored if `prefKey`, `localStorageKey` or `dashViewModel` are provided.
+     *  Ignored if `prefKey`, `localStorageKey`, `dashViewModel` or 'viewManagerModel' are provided.
      */
     getData?: () => any;
 
     /**
      * Function to be used to write blob of data representing state.
-     * Ignored if `prefKey`, `localStorageKey` or `dashViewModel` are provided.
+     * Ignored if `prefKey`, `localStorageKey`, `dashViewModel` or 'viewManagerModel' are provided.
      */
     setData?: (data: object) => void;
 }

package/data/Store.ts

@@ -515,10 +515,12 @@ export class Store extends HoistBase {
 
             return new StoreRecord({
                 id,
-                data: parsedData,
                 store: this,
+                raw: null,
+                data: parsedData,
+                committedData: null,
                 parent,
-                committedData: null
+                isSummary: false
             });
         });
 
@@ -585,13 +587,22 @@ export class Store extends HoistBase {
             const currentRec = this.getOrThrow(id),
                 updatedData = this.parseUpdate(currentRec.data, mod);
 
+            // If after parsing, data is deep equal, its a no-op
+            if (equal(updatedData, currentRec.data)) return;
+
+            // Previously updated record might now be reverted to clean, normalize
+            const committedData =
+                currentRec.isModified && equal(currentRec.committedData, updatedData)
+                    ? updatedData
+                    : currentRec.committedData;
+
             const updatedRec = new StoreRecord({
                 id: currentRec.id,
+                store: currentRec.store,
                 raw: currentRec.raw,
                 data: updatedData,
+                committedData: committedData,
                 parent: currentRec.parent,
-                store: currentRec.store,
-                committedData: currentRec.committedData,
                 isSummary: currentRec.isSummary
             });
 
@@ -1036,7 +1047,15 @@ export class Store extends HoistBase {
         }
 
         data = this.parseRaw(data);
-        const ret = new StoreRecord({id, data, raw, parent, store: this, isSummary});
+        const ret = new StoreRecord({
+            id,
+            store: this,
+            raw,
+            data,
+            committedData: data,
+            parent,
+            isSummary
+        });
 
         // Finalize summary only.  Non-summary finalized by RecordSet
         if (isSummary) ret.finalize();
@@ -1093,7 +1112,7 @@ export class Store extends HoistBase {
         return ret;
     }
 
-    private parseUpdate(data, update) {
+    private parseUpdate(data: PlainObject, update: PlainObject): PlainObject {
         const {_fieldMap} = this;
 
         // a) clone the existing object
@@ -1151,9 +1170,11 @@ export class Store extends HoistBase {
 
             const ret = new StoreRecord({
                 id: recToRevert.id,
-                raw: recToRevert.raw,
-                data: {...recToRevert.committedData},
                 store: this,
+                raw: recToRevert.raw,
+                data: recToRevert.committedData,
+                committedData: recToRevert.committedData,
+                parent: null,
                 isSummary: true
             });
             ret.finalize();

package/data/StoreRecord.ts

@@ -6,11 +6,12 @@
  */
 import {PlainObject} from '@xh/hoist/core';
 import {throwIf} from '@xh/hoist/utils/js';
-import {isNil, flatMap, isMatch} from 'lodash';
+import {isNil, flatMap, isMatch, isEmpty, pickBy} from 'lodash';
 import {Store} from './Store';
 import {ValidationState} from './validation/ValidationState';
 import {RecordValidator} from './impl/RecordValidator';
 import {Field} from './Field';
+import equal from 'fast-deep-equal';
 
 /**
  * Wrapper object for each data element within a {@link Store}. Records must be assigned a unique ID
@@ -184,6 +185,26 @@ export class StoreRecord {
         return ret;
     }
 
+    /**
+     * Get a map of modified values only.
+     *
+     * If record has no modifications, this method will return null.
+     * If modifications are returned, the returned object will include id,
+     * for convenience.
+     */
+    getModifiedValues(): PlainObject {
+        if (!this.isModified) return null;
+
+        const {data, committedData} = this,
+            ret = pickBy(data, (v, k) => !equal(v, committedData[k]));
+        if (!isEmpty(ret)) {
+            ret.id = this.id;
+            return ret;
+        } else {
+            return null;
+        }
+    }
+
     /**
      * Construct a StoreRecord from a pre-processed `data` source object.
      *
@@ -195,15 +216,7 @@ export class StoreRecord {
      * @internal
      */
     constructor(config: StoreRecordConfig) {
-        const {
-            id,
-            store,
-            data,
-            raw = null,
-            committedData = data,
-            parent,
-            isSummary = false
-        } = config;
+        const {id, store, raw, data, committedData, parent, isSummary} = config;
         throwIf(
             isNil(id),
             "Record needs an ID. Use 'Store.idSpec' to specify a unique ID for each record."