@xh/hoist 80.0.0-SNAPSHOT.1767973504648 → 80.0.0-SNAPSHOT.1767982629403

package/cmp/grid/GridModel.ts

@@ -1442,9 +1442,9 @@ export class GridModel extends HoistModel {
 
     /**
      * Begin an inline editing session.
-     * @param opts.record - StoreRecord/ID to edit. If unspecified, the first selected StoreRecord
+     * @param record - StoreRecord/ID to edit. If unspecified, the first selected StoreRecord
      *      will be used, if any, or the first overall StoreRecord in the grid.
-     * @param opts.colId - ID of column on which to start editing. If unspecified, the first
+     * @param colId - ID of column on which to start editing. If unspecified, the first
      *      editable column will be used.
      */
     async beginEditAsync(opts: {record?: StoreRecordOrId; colId?: string} = {}) {

package/cmp/grid/filter/GridFilterFieldSpec.ts

@@ -7,12 +7,18 @@
 import {ColumnRenderer} from '@xh/hoist/cmp/grid';
 import {HoistInputProps} from '@xh/hoist/cmp/input';
 import {PlainObject} from '@xh/hoist/core';
-import {FieldFilterOperator, parseFilter, StoreRecord, View} from '@xh/hoist/data';
+import {
+    CompoundFilter,
+    FieldFilter,
+    FieldFilterOperator,
+    Filter,
+    parseFilter
+} from '@xh/hoist/data';
 import {
     BaseFilterFieldSpec,
     BaseFilterFieldSpecConfig
 } from '@xh/hoist/data/filter/BaseFilterFieldSpec';
-import {castArray, compact, flatten, isDate, isEmpty, uniqBy} from 'lodash';
+import {castArray, compact, flatMap, isDate, isEmpty, uniqBy} from 'lodash';
 import {GridFilterModel} from './GridFilterModel';
 
 export interface GridFilterFieldSpecConfig extends BaseFilterFieldSpecConfig {
@@ -37,14 +43,16 @@ export interface GridFilterFieldSpecConfig extends BaseFilterFieldSpecConfig {
 
 /**
  * Apps should NOT instantiate this class directly.
- * Instead, provide a config for this object to the GridModel's `filterModel` config.
+ * Instead, provide a config for this object via {@link GridConfig.filterModel} config.
  */
 export class GridFilterFieldSpec extends BaseFilterFieldSpec {
     filterModel: GridFilterModel;
     renderer: ColumnRenderer;
     inputProps: PlainObject;
     defaultOp: FieldFilterOperator;
-    valueCount: number;
+
+    /** Total number of unique values for this field in the source, regardless of other filters. */
+    allValuesCount: number;
 
     constructor({
         filterModel,
@@ -71,68 +79,61 @@ export class GridFilterFieldSpec extends BaseFilterFieldSpec {
     //------------------------
     loadValuesFromSource() {
         const {filterModel, field, source, sourceField} = this,
-            columnFilters = filterModel.getColumnFilters(field),
-            sourceStore = source instanceof View ? source.cube.store : source,
-            allRecords = sourceStore.allRecords;
-
-        // Apply external filters *not* pertaining to this field to the sourceStore
-        // to get the filtered set of available values to offer as options.
-        const cleanedFilter = this.cleanFilter(filterModel.filter);
-        let filteredRecords = allRecords;
-        if (cleanedFilter) {
-            const testFn = parseFilter(cleanedFilter).getTestFn(sourceStore);
-            filteredRecords = allRecords.filter(testFn);
-        }
+            columnFilters = filterModel.getColumnFilters(field);
+
+        // All possible values for this field from our source.
+        const allSrcVals = source.getValuesForFieldFilter(field).map(it => this.toDisplayValue(it));
+
+        // Values from current column filter.
+        const colFilterVals = flatMap(columnFilters, filter => {
+            return castArray(filter.value).map(val => sourceField.parseVal(val));
+        }).map(it => this.toDisplayValue(it));
+
+        // Combine + unique - these are all values that *could* be shown in the filter UI.
+        const allValues = uniqBy([...allSrcVals, ...colFilterVals], this.getUniqueValue);
 
-        // Get values from current column filter
-        const filterValues = [];
-        columnFilters.forEach(filter => {
-            const newValues = castArray(filter.value).map(value => {
-                value = sourceField.parseVal(value);
-                return filterModel.toDisplayValue(value);
-            });
-            filterValues.push(...newValues);
-        });
-
-        // Combine unique values from record sets and column filters.
-        const allValues = uniqBy(
-            [...flatten(allRecords.map(rec => this.valueFromRecord(rec))), ...filterValues],
-            this.getUniqueValue
-        );
-        let values;
-        if (cleanedFilter) {
-            values = uniqBy(
-                [
-                    ...flatten(filteredRecords.map(rec => this.valueFromRecord(rec))),
-                    ...filterValues
-                ],
-                this.getUniqueValue
-            );
+        // Create a filter with other filters *not* pertaining to this field, if any.
+        // This filter will be used to get the subset of all possible values for this field that
+        // exist in records passing those other filters.
+        const otherFieldsFilter = this.cleanFilter(filterModel.filter);
+
+        let values: any[];
+
+        if (otherFieldsFilter) {
+            // If we have filters on other fields, get values from source that pass that filter.
+            // These will be the set of values shown in the filter UI.
+            const filteredSrcVals = source
+                .getValuesForFieldFilter(field, otherFieldsFilter)
+                .map(it => this.toDisplayValue(it));
+            values = uniqBy([...filteredSrcVals, ...colFilterVals], this.getUniqueValue);
         } else {
+            // Otherwise, all possible values are shown.
             values = allValues;
         }
 
         this.values = values.sort();
-        this.valueCount = allValues.length;
+
+        // Note count of all possible values for this field - allows ValuesTabModel
+        // to indicate to the user if some values are hidden due to other active filters.
+        this.allValuesCount = allValues.length;
     }
 
     // Recursively modify a Filter|CompoundFilter to remove all FieldFilters referencing this column
-    private cleanFilter(filter) {
-        if (!filter) return filter;
-
-        const {field, filters, op} = filter;
-        if (filters) {
+    private cleanFilter(filter: Filter): Filter {
+        if (CompoundFilter.isCompoundFilter(filter)) {
+            const {filters, op} = filter;
             const ret = compact(filters.map(it => this.cleanFilter(it)));
-            return !isEmpty(ret) ? {op, filters: ret} : null;
-        } else if (field === this.field) {
+            return !isEmpty(ret) ? parseFilter({op, filters: ret}) : null;
+        }
+
+        if (FieldFilter.isFieldFilter(filter) && filter.field === this.field) {
             return null;
         }
 
         return filter;
     }
 
-    private valueFromRecord(record: StoreRecord) {
-        const {filterModel, field} = this;
-        return filterModel.toDisplayValue(record.get(field));
+    private toDisplayValue(val: any): any {
+        return this.filterModel.toDisplayValue(val);
     }
 }

package/cmp/grid/filter/GridFilterModel.ts

@@ -117,11 +117,11 @@ export class GridFilterModel extends HoistModel {
         return this.fieldSpecs.find(it => it.field === field);
     }
 
-    toDisplayValue(value) {
+    toDisplayValue(value: any): any {
         return isNil(value) || value === '' ? GridFilterModel.BLANK_PLACEHOLDER : value;
     }
 
-    fromDisplayValue(value) {
+    fromDisplayValue(value: any): any {
         return value === GridFilterModel.BLANK_PLACEHOLDER ? null : value;
     }
 
@@ -135,7 +135,7 @@ export class GridFilterModel extends HoistModel {
         this.dialogOpen = false;
     }
 
-    setFilter(filter) {
+    setFilter(filter: Filter) {
         wait()
             .then(() => this.bind.setFilter(filter))
             .linkTo(this.gridModel.filterTask);
@@ -161,11 +161,10 @@ export class GridFilterModel extends HoistModel {
         });
     }
 
-    private getOuterCompoundFilter(filter, field) {
-        if (!filter?.isCompoundFilter) return null;
+    private getOuterCompoundFilter(filter: Filter, field: string) {
+        if (!CompoundFilter.isCompoundFilter(filter)) return null;
 
-        // This is the outer compound filter if all its children
-        // are FieldFilters on the matching field.
+        // This is the outer compound filter if all children are FieldFilters on the matching field.
         if (every(filter.filters, {field})) {
             return filter;
         }

package/cmp/layout/Tags.ts

@@ -29,7 +29,6 @@ export const a = elementFactory('a');
 export const br = elementFactory('br');
 export const code = elementFactory('code');
 export const div = elementFactory('div');
-export const fieldset = elementFactory('fieldset');
 export const form = elementFactory('form');
 export const hr = elementFactory('hr');
 export const h1 = elementFactory('h1');
@@ -37,7 +36,6 @@ export const h2 = elementFactory('h2');
 export const h3 = elementFactory('h3');
 export const h4 = elementFactory('h4');
 export const label = elementFactory('label');
-export const legend = elementFactory('legend');
 export const li = elementFactory('li');
 export const nav = elementFactory('nav');
 export const ol = elementFactory('ol');

package/cmp/tab/TabContainerModel.ts

@@ -119,7 +119,7 @@ export class TabContainerModel extends HoistModel {
 
     /**
      * @param config - TabContainer configuration.
-     * @param depth - Depth in hierarchy of nested TabContainerModels. Not for application use.
+     * @param [depth] - Depth in hierarchy of nested TabContainerModels. Not for application use.
      */
     constructor(
         {

package/data/Store.ts

@@ -6,6 +6,18 @@
  */
 
 import {HoistBase, managed, PlainObject, Some, XH} from '@xh/hoist/core';
+import {
+    Field,
+    FieldSpec,
+    Filter,
+    FilterBindTarget,
+    FilterLike,
+    FilterValueSource,
+    parseFilter,
+    StoreRecord,
+    StoreRecordId,
+    StoreRecordOrId
+} from '@xh/hoist/data';
 import {action, computed, makeObservable, observable} from '@xh/hoist/mobx';
 import {logWithDebug, throwIf, warnIf} from '@xh/hoist/utils/js';
 import equal from 'fast-deep-equal';
@@ -13,6 +25,7 @@ import {
     castArray,
     defaultsDeep,
     differenceBy,
+    first,
     flatMapDeep,
     isArray,
     isEmpty,
@@ -20,21 +33,15 @@ import {
     isNil,
     isNull,
     isString,
-    values,
+    partition,
     remove as lodashRemove,
-    uniq,
-    first,
     some,
-    partition
+    uniq,
+    values
 } from 'lodash';
-import {Field, FieldSpec} from './Field';
-import {parseFilter} from './filter/Utils';
+import {instanceManager} from '../core/impl/InstanceManager';
 import {RecordSet} from './impl/RecordSet';
 import {StoreErrorMap, StoreValidator} from './impl/StoreValidator';
-import {StoreRecord, StoreRecordId, StoreRecordOrId} from './StoreRecord';
-import {instanceManager} from '../core/impl/InstanceManager';
-import {Filter} from './filter/Filter';
-import {FilterLike} from './filter/Types';
 
 export interface StoreConfig {
     /** Field names, configs, or instances. */
@@ -181,11 +188,13 @@ export type StoreRecordIdSpec = string | ((data: PlainObject) => StoreRecordId);
 /**
  * A managed and observable set of local, in-memory Records.
  */
-export class Store extends HoistBase {
-    get isStore() {
-        return true;
+export class Store extends HoistBase implements FilterBindTarget, FilterValueSource {
+    static isStore(obj: unknown): obj is Store {
+        return obj instanceof Store;
     }
 
+    readonly isFilterValueSource = true;
+
     fields: Field[] = null;
     idSpec: (data: PlainObject) => StoreRecordId;
     processRawData: (raw: any) => any;
@@ -811,6 +820,31 @@ export class Store extends HoistBase {
         return !this.getById(id, true) && !!this.getById(id, false);
     }
 
+    getValuesForFieldFilter(fieldName: string, filter?: Filter): any[] {
+        const field = this.getField(fieldName);
+        if (!field) return [];
+
+        let recs = this.allRecords;
+        if (filter) {
+            const testFn = filter.getTestFn(this);
+            recs = recs.filter(testFn);
+        }
+
+        const ret = new Set();
+        recs.forEach(rec => {
+            const val = rec.get(fieldName);
+            if (!isNil(val)) {
+                if (field.type === 'tags') {
+                    val.forEach(it => ret.add(it));
+                } else {
+                    ret.add(val);
+                }
+            }
+        });
+
+        return Array.from(ret);
+    }
+
     /**
      * Set whether the root should be loaded as summary data in loadData().
      */

package/data/cube/View.ts

@@ -10,7 +10,9 @@ import {
     Cube,
     CubeField,
     Filter,
+    FilterBindTarget,
     FilterLike,
+    FilterValueSource,
     Query,
     QueryConfig,
     Store,
@@ -64,11 +66,13 @@ export interface DimensionValue {
  * Primary interface for consuming grouped and aggregated data from the cube.
  * Applications should create via the {@link Cube.createView} factory.
  */
-export class View extends HoistBase {
-    get isView() {
-        return true;
+export class View extends HoistBase implements FilterBindTarget, FilterValueSource {
+    static isView(obj: unknown): obj is View {
+        return obj instanceof View;
     }
 
+    readonly isFilterValueSource = true;
+
     /** Query defining this View. Update via {@link updateQuery}. */
     @observable.ref
     query: Query = null;
@@ -222,6 +226,13 @@ export class View extends HoistBase {
         }
     }
 
+    //----------------------------
+    // FilterValueSource interface
+    //----------------------------
+    getValuesForFieldFilter(fieldName: string, filter?: Filter): any[] {
+        return this.cube.store.getValuesForFieldFilter(fieldName, filter);
+    }
+
     //------------------------
     // Implementation
     //------------------------

package/data/filter/BaseFilterFieldSpec.ts

@@ -5,7 +5,7 @@
  * Copyright © 2026 Extremely Heavy Industries Inc.
  */
 import {HoistBase} from '@xh/hoist/core';
-import {Field, Store, FieldFilter, FieldType, genDisplayName, View} from '@xh/hoist/data';
+import {Field, FieldFilter, FieldType, FilterValueSource, genDisplayName} from '@xh/hoist/data';
 import {compact, isArray, isEmpty} from 'lodash';
 import {FieldFilterOperator} from './Types';
 
@@ -19,7 +19,7 @@ export interface BaseFilterFieldSpecConfig {
     /** Operators available for filtering, will default to a supported set based on type.*/
     ops?: FieldFilterOperator[];
     /** Used to source matching data `Field` and extract values if configured. */
-    source?: Store | View;
+    source?: FilterValueSource;
     /**
      * True to provide interfaces and auto-complete options
      * with enumerated matches for creating '=' or '!=' filters. Defaults to true for
@@ -47,7 +47,7 @@ export abstract class BaseFilterFieldSpec extends HoistBase {
     fieldType: FieldType;
     displayName: string;
     ops: FieldFilterOperator[];
-    source: Store | View;
+    source: FilterValueSource;
     enableValues: boolean;
     forceSelection: boolean;
     values: any[];

package/data/filter/CompoundFilter.ts

@@ -17,8 +17,8 @@ import {CompoundFilterSpec, CompoundFilterOperator, FilterTestFn} from './Types'
  * Immutable.
  */
 export class CompoundFilter extends Filter {
-    get isCompoundFilter() {
-        return true;
+    static isCompoundFilter(obj: unknown): obj is CompoundFilter {
+        return obj instanceof CompoundFilter;
     }
 
     readonly filters: Filter[];
@@ -63,7 +63,7 @@ export class CompoundFilter extends Filter {
             other instanceof CompoundFilter &&
             other.op === this.op &&
             isEqualWith(other.filters, this.filters, (a, b) =>
-                a.isFilter && b.isFilter ? a.equals(b) : undefined
+                Filter.isFilter(a) && Filter.isFilter(b) ? a.equals(b) : undefined
             )
         );
     }

package/data/filter/FieldFilter.ts

@@ -36,8 +36,8 @@ import {FieldFilterOperator, FieldFilterSpec, FilterTestFn} from './Types';
  * Immutable.
  */
 export class FieldFilter extends Filter {
-    get isFieldFilter() {
-        return true;
+    static isFieldFilter(obj: unknown): obj is FieldFilter {
+        return obj instanceof FieldFilter;
     }
 
     readonly field: string;

package/data/filter/Filter.ts

@@ -5,8 +5,8 @@
  * Copyright © 2026 Extremely Heavy Industries Inc.
  */
 
-import {Store} from '../Store';
-import {FilterSpec, FilterTestFn} from './Types';
+import {Store} from '@xh/hoist/data';
+import type {FilterSpec, FilterTestFn} from './Types';
 
 /**
  * Base class for Hoist data package Filters.
@@ -20,8 +20,8 @@ import {FilterSpec, FilterTestFn} from './Types';
  *      via an `AND` or `OR` operator.
  */
 export abstract class Filter {
-    get isFilter() {
-        return true;
+    static isFilter(obj: unknown): obj is Filter {
+        return obj instanceof Filter;
     }
 
     /**

package/data/filter/FunctionFilter.ts

@@ -19,8 +19,8 @@ import {FunctionFilterSpec, FilterTestFn} from './Types';
  * Immutable.
  */
 export class FunctionFilter extends Filter {
-    get isFunctionFilter() {
-        return true;
+    static isFunctionFilter(obj: unknown): obj is FunctionFilter {
+        return obj instanceof FunctionFilter;
     }
 
     readonly key: string;

package/data/filter/Types.ts

@@ -5,17 +5,25 @@
  * Copyright © 2026 Extremely Heavy Industries Inc.
  */
 
-import {PlainObject} from '@xh/hoist/core';
-import {Filter} from './Filter';
-import {StoreRecord, Field, FieldType} from '../';
+import type {PlainObject} from '@xh/hoist/core';
+import type {Filter} from './Filter';
+import type {StoreRecord, Field, FieldType} from '../';
 
-export type CompoundFilterOperator = 'AND' | 'OR' | 'and' | 'or';
-export interface CompoundFilterSpec {
-    /** Collection of Filters or configs to create. */
-    filters: FilterLike[];
+export type FilterLike = Filter | FilterSpec | FilterTestFn | FilterLike[];
 
-    /** logical operator 'AND' (default) or 'OR'. */
-    op?: CompoundFilterOperator;
+export type FilterSpec = FieldFilterSpec | FunctionFilterSpec | CompoundFilterSpec;
+
+export interface FieldFilterSpec {
+    /** Name of Field to filter or Field instance. */
+    field: string | Field;
+
+    /** One of the supported operators to use for comparison. */
+    op: FieldFilterOperator;
+
+    value: any;
+
+    /** For internal serialization only. */
+    valueType?: FieldType;
 }
 
 export type FieldFilterOperator =
@@ -33,19 +41,17 @@ export type FieldFilterOperator =
     | 'not ends'
     | 'includes'
     | 'excludes';
-export interface FieldFilterSpec {
-    /** Name of Field to filter or Field instance. */
-    field: string | Field;
 
-    /** One of the supported operators to use for comparison. */
-    op: FieldFilterOperator;
-
-    value: any;
+export interface CompoundFilterSpec {
+    /** Collection of Filters or configs to create. */
+    filters: FilterLike[];
 
-    /** For internal serialization only. */
-    valueType?: FieldType;
+    /** logical operator 'AND' (default) or 'OR'. */
+    op?: CompoundFilterOperator;
 }
 
+export type CompoundFilterOperator = 'AND' | 'OR' | 'and' | 'or';
+
 export interface FunctionFilterSpec {
     /** Key used to identify this FunctionFilter.*/
     key: string;
@@ -61,6 +67,33 @@ export interface FunctionFilterSpec {
  */
 export type FilterTestFn = (candidate: PlainObject | StoreRecord) => boolean;
 
-export type FilterSpec = FieldFilterSpec | FunctionFilterSpec | CompoundFilterSpec;
+/**
+ * Target (typically a {@link Store} or Cube {@link View}) that can be used by filtering models
+ * such as {@link FilterChooserModel} and {@link GridFilterModel} to get and set filters.
+ */
+export interface FilterBindTarget {
+    filter: Filter;
+    setFilter(filter: FilterLike): unknown;
+}
 
-export type FilterLike = Filter | FilterSpec | FilterTestFn | FilterLike[];
+/**
+ * Data provider (typically a {@link Store} or Cube {@link View}) that can be used by filtering
+ * models such as {@link FilterChooserModel} and {@link GridFilterModel} to source available
+ * values from within a dataset for display / suggestion to users.
+ */
+export interface FilterValueSource {
+    /** Names of all fields available in the source. */
+    fieldNames: string[];
+    /** @returns the Field instance for the given field name. */
+    getField(fieldName: string): Field;
+    /** @returns unique values for the given field, applying the given filter if provided. */
+    getValuesForFieldFilter(fieldName: string, filter?: Filter): any[];
+    /** Observable timestamp for the source's data, to trigger consumers to re-query values. */
+    lastUpdated: number;
+    /** For the {@link isFilterValueSource} typeguard. */
+    isFilterValueSource: true;
+}
+
+export function isFilterValueSource(v: unknown): v is FilterValueSource {
+    return (v as any)?.isFilterValueSource === true;
+}

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

@@ -10,7 +10,7 @@ import ReactGridLayout, {
     useContainerWidth,
     getCompactor
 } from 'react-grid-layout';
-import {GridBackground, type GridBackgroundProps, wrapCompactor} from 'react-grid-layout/extras';
+import {GridBackground, type GridBackgroundProps} from 'react-grid-layout/extras';
 import composeRefs from '@seznam/compose-react-refs';
 import {div, vbox, vspacer} from '@xh/hoist/cmp/layout';
 import {
@@ -62,11 +62,7 @@ export const [DashCanvas, dashCanvas] = hoistCmp.withFactory<DashCanvasProps>({
     render({className, model, rglOptions, testId}, ref) {
         const isDraggable = !model.layoutLocked,
             isResizable = !model.layoutLocked,
-            {width, containerRef, mounted} = useContainerWidth(),
-            defaultDroppedItemDims = {
-                w: Math.floor(model.columns / 3),
-                h: Math.floor(model.columns / 3)
-            };
+            {width, containerRef, mounted} = useContainerWidth();
 
         return refreshContextView({
             model: model.refreshContextModel,
@@ -102,20 +98,7 @@ export const [DashCanvas, dashCanvas] = hoistCmp.withFactory<DashCanvasProps>({
                                 resizeConfig: {
                                     enabled: isResizable
                                 },
-                                dropConfig: {
-                                    enabled: model.contentLocked ? false : model.allowsDrop,
-                                    defaultItem: defaultDroppedItemDims,
-                                    onDragOver: (evt: DragEvent) => model.onDropDragOver(evt)
-                                },
-                                onDrop: (
-                                    layout: LayoutItem[],
-                                    layoutItem: LayoutItem,
-                                    evt: Event
-                                ) => model.onDrop(layout, layoutItem, evt),
-                                compactor:
-                                    model.compact === 'wrap'
-                                        ? wrapCompactor
-                                        : getCompactor(model.compact, false, false),
+                                compactor: getCompactor(model.compact, false, false),
                                 onLayoutChange: (layout: LayoutItem[]) =>
                                     model.onRglLayoutChange(layout),
                                 onResizeStart: () => (model.isResizing = true),
@@ -133,7 +116,7 @@ export const [DashCanvas, dashCanvas] = hoistCmp.withFactory<DashCanvasProps>({
                         ),
                         width
                     }),
-                    emptyContainerOverlay({omit: !mounted || !model.showAddViewButtonWhenEmpty})
+                    emptyContainerOverlay({omit: !mounted})
                 ],
                 [TEST_ID]: testId
             })