igniteui-angular 19.0.7 → 19.1.0-beta.1

package/lib/query-builder/query-builder.component.d.ts

@@ -1,54 +1,13 @@
-import { AfterViewInit, EventEmitter, PipeTransform } from '@angular/core';
-import { ChangeDetectorRef, ElementRef, OnDestroy } from '@angular/core';
-import { IButtonGroupEventArgs } from '../buttonGroup/buttonGroup.component';
+import { EventEmitter, TemplateRef } from '@angular/core';
+import { ElementRef, OnDestroy } from '@angular/core';
 import { IQueryBuilderResourceStrings } from '../core/i18n/query-builder-resources';
-import { PlatformUtil } from '../core/utils';
-import { FilteringLogic, IFilteringExpression } from '../data-operations/filtering-expression.interface';
 import { IExpressionTree } from '../data-operations/filtering-expressions-tree';
 import { IgxOverlayOutletDirective } from '../directives/toggle/toggle.directive';
-import { FieldType } from '../grids/common/grid.interface';
-import { IgxIconService } from '../icon/icon.service';
-import { OverlaySettings } from '../services/overlay/utilities';
+import { EntityType, FieldType } from '../grids/common/grid.interface';
 import { IgxQueryBuilderHeaderComponent } from './query-builder-header.component';
+import { IgxQueryBuilderTreeComponent } from './query-builder-tree.component';
+import { IgxIconService } from '../icon/icon.service';
 import * as i0 from "@angular/core";
-export declare class IgxFieldFormatterPipe implements PipeTransform {
-    transform(value: any, formatter: (v: any, data: any, fieldData?: any) => any, rowData: any, fieldData?: any): any;
-    static ɵfac: i0.ɵɵFactoryDeclaration<IgxFieldFormatterPipe, never>;
-    static ɵpipe: i0.ɵɵPipeDeclaration<IgxFieldFormatterPipe, "fieldFormatter", true>;
-}
-/**
- * @hidden @internal
- *
- * Internal class usage
- */
-declare class ExpressionItem {
-    parent: ExpressionGroupItem;
-    selected: boolean;
-    constructor(parent?: ExpressionGroupItem);
-}
-/**
- * @hidden @internal
- *
- * Internal class usage
- */
-declare class ExpressionGroupItem extends ExpressionItem {
-    operator: FilteringLogic;
-    children: ExpressionItem[];
-    constructor(operator: FilteringLogic, parent?: ExpressionGroupItem);
-}
-/**
- * @hidden @internal
- *
- * Internal class usage
- */
-declare class ExpressionOperandItem extends ExpressionItem {
-    expression: IFilteringExpression;
-    inEditMode: boolean;
-    inAddMode: boolean;
-    hovered: boolean;
-    fieldLabel: string;
-    constructor(expression: IFilteringExpression, parent: ExpressionGroupItem);
-}
 /**
  * A component used for operating with complex filters by creating or editing conditions
  * and grouping them using AND/OR logic.
@@ -56,16 +15,12 @@ declare class ExpressionOperandItem extends ExpressionItem {
  *
  * @example
  * ```html
- * <igx-query-builder [fields]="this.fields">
+ * <igx-query-builder [entities]="this.entities">
  * </igx-query-builder>
  * ```
  */
-export declare class IgxQueryBuilderComponent implements AfterViewInit, OnDestroy {
-    cdr: ChangeDetectorRef;
+export declare class IgxQueryBuilderComponent implements OnDestroy {
     protected iconService: IgxIconService;
-    protected platform: PlatformUtil;
-    protected el: ElementRef;
-    protected _localeId: string;
     /**
      * @hidden @internal
      */
@@ -75,11 +30,24 @@ export declare class IgxQueryBuilderComponent implements AfterViewInit, OnDestro
      */
     display: string;
     /**
-    * Returns the fields.
-    */
+     * Gets/sets whether the confirmation dialog should be shown when changing entity.
+     * Default value is `true`.
+     */
+    showEntityChangeDialog: boolean;
+    /**
+     * Gets/sets the entities.
+     */
+    entities: EntityType[];
+    /**
+     * Returns the fields.
+     * @hidden
+     * @deprecated in version 19.1.0. Use the `entities` property instead.
+     */
     get fields(): FieldType[];
     /**
      * Sets the fields.
+     * @hidden
+     * @deprecated in version 19.1.0. Use the `entities` property instead.
      */
     set fields(fields: FieldType[]);
     /**
@@ -94,12 +62,7 @@ export declare class IgxQueryBuilderComponent implements AfterViewInit, OnDestro
      * Gets the `locale` of the query builder.
      * If not set, defaults to application's locale.
      */
-    get locale(): string;
-    /**
-     * Sets the `locale` of the query builder.
-     * Expects a valid BCP 47 language tag.
-     */
-    set locale(value: string);
+    locale: string;
     /**
      * Sets the resource strings.
      * By default it uses EN resources.
@@ -109,6 +72,10 @@ export declare class IgxQueryBuilderComponent implements AfterViewInit, OnDestro
      * Returns the resource strings.
      */
     get resourceStrings(): IQueryBuilderResourceStrings;
+    /**
+     * Disables subsequent entity changes at the root level after the initial selection.
+     */
+    disableEntityChange: boolean;
     /**
      * Event fired as the expression tree is changed.
      *
@@ -117,103 +84,40 @@ export declare class IgxQueryBuilderComponent implements AfterViewInit, OnDestro
      * ```
      */
     expressionTreeChange: EventEmitter<any>;
-    private fieldSelect;
-    private conditionSelect;
-    private searchValueInput;
-    private picker;
-    private addRootAndGroupButton;
-    private addConditionButton;
     /**
      * @hidden @internal
      */
     headerContent: IgxQueryBuilderHeaderComponent;
-    protected set editingInputsContainer(value: ElementRef);
-    /** @hidden */
-    protected get editingInputsContainer(): ElementRef;
-    protected set addModeContainer(value: ElementRef);
-    /** @hidden */
-    protected get addModeContainer(): ElementRef;
-    protected set currentGroupButtonsContainer(value: ElementRef);
-    /** @hidden */
-    protected get currentGroupButtonsContainer(): ElementRef;
-    private contextMenuToggle;
-    private chips;
-    private expressionsContainer;
-    private overlayOutlet;
     /**
      * @hidden @internal
      */
-    rootGroup: ExpressionGroupItem;
+    searchValueTemplate: TemplateRef<any>;
     /**
      * @hidden @internal
      */
-    selectedExpressions: ExpressionOperandItem[];
-    /**
-     * @hidden @internal
-     */
-    currentGroup: ExpressionGroupItem;
-    /**
-     * @hidden @internal
-     */
-    contextualGroup: ExpressionGroupItem;
-    /**
-     * @hidden @internal
-     */
-    filteringLogics: any;
-    /**
-     * @hidden @internal
-     */
-    selectedCondition: string;
-    /**
-     * @hidden @internal
-     */
-    searchValue: any;
-    /**
-     * @hidden @internal
-     */
-    pickerOutlet: IgxOverlayOutletDirective | ElementRef;
-    /**
-     * @hidden @internal
-     */
-    fieldSelectOverlaySettings: OverlaySettings;
-    /**
-     * @hidden @internal
-     */
-    conditionSelectOverlaySettings: OverlaySettings;
+    queryTree: IgxQueryBuilderTreeComponent;
     private destroy$;
-    private _selectedField;
-    private _clickTimer;
-    private _dblClickDelay;
-    private _preventChipClick;
-    private _editingInputsContainer;
-    private _addModeContainer;
-    private _currentGroupButtonsContainer;
-    private _addModeExpression;
-    private _editedExpression;
-    private _selectedGroups;
-    private _fields;
-    private _expressionTree;
-    private _locale;
     private _resourceStrings;
-    private _positionSettings;
-    private _overlaySettings;
-    constructor(cdr: ChangeDetectorRef, iconService: IgxIconService, platform: PlatformUtil, el: ElementRef, _localeId: string);
+    private _expressionTree;
+    private _fields;
+    private _shouldEmitTreeChange;
+    constructor(iconService: IgxIconService);
     /**
-     * @hidden @internal
+     * Returns whether the expression tree can be committed in the current state.
      */
-    ngAfterViewInit(): void;
+    canCommit(): boolean;
     /**
-     * @hidden @internal
+     * Commits the expression tree in the current state if it is valid. If not throws an exception.
      */
-    ngOnDestroy(): void;
+    commit(): void;
     /**
-     * @hidden @internal
+     * Discards all unsaved changes to the expression tree.
      */
-    set selectedField(value: FieldType);
+    discard(): void;
     /**
      * @hidden @internal
      */
-    get selectedField(): FieldType;
+    ngOnDestroy(): void;
     /**
      * @hidden @internal
      *
@@ -226,185 +130,21 @@ export declare class IgxQueryBuilderComponent implements AfterViewInit, OnDestro
      * used by the grid
      */
     get isContextMenuVisible(): boolean;
-    /**
-     * @hidden @internal
-     */
-    get hasEditedExpression(): boolean;
-    /**
-     * @hidden @internal
-     */
-    addCondition(parent: ExpressionGroupItem, afterExpression?: ExpressionItem): void;
-    /**
-     * @hidden @internal
-     */
-    addAndGroup(parent?: ExpressionGroupItem, afterExpression?: ExpressionItem): void;
-    /**
-     * @hidden @internal
-     */
-    addOrGroup(parent?: ExpressionGroupItem, afterExpression?: ExpressionItem): void;
-    /**
-     * @hidden @internal
-     */
-    endGroup(groupItem: ExpressionGroupItem): void;
-    /**
-     * @hidden @internal
-     */
-    commitOperandEdit(): void;
-    /**
-     * @hidden @internal
-     */
-    cancelOperandAdd(): void;
-    /**
-     * @hidden @internal
-     */
-    cancelOperandEdit(): void;
-    /**
-     * @hidden @internal
-     */
-    operandCanBeCommitted(): boolean;
     /**
      * @hidden @internal
      *
      * used by the grid
      */
     exitOperandEdit(): void;
-    /**
-     * @hidden @internal
-     */
-    isExpressionGroup(expression: ExpressionItem): boolean;
-    /**
-     * @hidden @internal
-     */
-    onChipRemove(expressionItem: ExpressionItem): void;
-    /**
-     * @hidden @internal
-     */
-    onChipClick(expressionItem: ExpressionOperandItem): void;
-    /**
-     * @hidden @internal
-     */
-    onChipDblClick(expressionItem: ExpressionOperandItem): void;
-    /**
-     * @hidden @internal
-     */
-    enterExpressionEdit(expressionItem: ExpressionOperandItem): void;
-    /**
-     * @hidden @internal
-     */
-    clearSelection(): void;
-    /**
-     * @hidden @internal
-     */
-    enterExpressionAdd(expressionItem: ExpressionOperandItem): void;
-    /**
-     * @hidden @internal
-     */
-    contextMenuClosed(): void;
-    /**
-     * @hidden @internal
-     */
-    onKeyDown(eventArgs: KeyboardEvent): void;
-    /**
-     * @hidden @internal
-     */
-    createAndGroup(): void;
-    /**
-     * @hidden @internal
-     */
-    createOrGroup(): void;
-    /**
-     * @hidden @internal
-     */
-    deleteFilters(): void;
-    /**
-     * @hidden @internal
-     */
-    onGroupClick(groupItem: ExpressionGroupItem): void;
-    /**
-     * @hidden @internal
-     */
-    ungroup(): void;
-    /**
-     * @hidden @internal
-     */
-    deleteGroup(): void;
-    /**
-     * @hidden @internal
-     */
-    selectFilteringLogic(event: IButtonGroupEventArgs): void;
-    /**
-     * @hidden @internal
-     */
-    getConditionFriendlyName(name: string): string;
-    /**
-     * @hidden @internal
-     */
-    isDate(value: any): value is Date;
-    /**
-     * @hidden @internal
-     */
-    onExpressionsScrolled(): void;
-    /**
-     * @hidden @internal
-     */
-    invokeClick(eventArgs: KeyboardEvent): void;
-    /**
-     * @hidden @internal
-     */
-    openPicker(args: KeyboardEvent): void;
-    /**
-     * @hidden @internal
-     */
-    onOutletPointerDown(event: any): void;
-    /**
-     * @hidden @internal
-     */
-    getConditionList(): string[];
-    /**
-     * @hidden @internal
-     */
-    getFormatter(field: string): (value: any, rowData?: any) => any;
-    /**
-     * @hidden @internal
-     */
-    getFormat(field: string): string;
     /**
      * @hidden @internal
      *
      * used by the grid
      */
     setAddButtonFocus(): void;
-    /**
-     * @hidden @internal
-     */
-    context(expression: ExpressionItem, afterExpression?: ExpressionItem): {
-        $implicit: ExpressionItem;
-        afterExpression: ExpressionItem;
-    };
-    /**
-     * @hidden @internal
-     */
-    onChipSelectionEnd(): void;
-    private setFormat;
-    private setFilters;
-    private onToggleExpression;
-    private toggleExpression;
-    private addGroup;
-    private createExpressionGroupItem;
-    private createExpressionTreeFromGroupItem;
-    private toggleContextMenu;
-    private findSingleSelectedGroup;
-    private isInsideGroup;
-    private deleteItem;
-    private createGroup;
-    private toggleGroup;
-    private toggleGroupRecursive;
-    private deselectParentRecursive;
-    private calculateContextMenuTarget;
-    private scrollElementIntoView;
-    private init;
+    onExpressionTreeChange(tree: IExpressionTree): void;
     private registerSVGIcons;
     static ɵfac: i0.ɵɵFactoryDeclaration<IgxQueryBuilderComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<IgxQueryBuilderComponent, "igx-query-builder", never, { "fields": { "alias": "fields"; "required": false; }; "expressionTree": { "alias": "expressionTree"; "required": false; }; "locale": { "alias": "locale"; "required": false; }; "resourceStrings": { "alias": "resourceStrings"; "required": false; }; }, { "expressionTreeChange": "expressionTreeChange"; }, ["headerContent"], ["igx-query-builder-header"], true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<IgxQueryBuilderComponent, "igx-query-builder", never, { "showEntityChangeDialog": { "alias": "showEntityChangeDialog"; "required": false; }; "entities": { "alias": "entities"; "required": false; }; "fields": { "alias": "fields"; "required": false; }; "expressionTree": { "alias": "expressionTree"; "required": false; }; "locale": { "alias": "locale"; "required": false; }; "resourceStrings": { "alias": "resourceStrings"; "required": false; }; "disableEntityChange": { "alias": "disableEntityChange"; "required": false; }; }, { "expressionTreeChange": "expressionTreeChange"; }, ["headerContent", "searchValueTemplate"], ["igx-query-builder-header"], true, never>;
+    static ngAcceptInputType_showEntityChangeDialog: unknown;
 }
-export {};

package/lib/query-builder/query-builder.directives.d.ts

@@ -0,0 +1,22 @@
+import { TemplateRef } from '@angular/core';
+import * as i0 from "@angular/core";
+/**
+ * Defines the custom template that will be used for the search value input of condition in edit mode
+ *
+ * @igxModule IgxQueryBuilderModule
+ * @igxKeywords query builder, query builder search value
+ * @igxGroup Data entry and display
+ *
+ * @example
+ * <igx-query-builder>
+ *      <ng-template igxQueryBuilderSearchValue let-expression="expression">
+ *          <input type="text" required [(ngModel)]="expression.searchVal"/>
+ *      </ng-template>
+ *  </igx-query-builder>
+ */
+export declare class IgxQueryBuilderSearchValueTemplateDirective {
+    template: TemplateRef<any>;
+    constructor(template: TemplateRef<any>);
+    static ɵfac: i0.ɵɵFactoryDeclaration<IgxQueryBuilderSearchValueTemplateDirective, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<IgxQueryBuilderSearchValueTemplateDirective, "[igxQueryBuilderSearchValue]", never, {}, {}, never, never, true, never>;
+}

package/lib/query-builder/query-builder.module.d.ts

@@ -1,12 +1,13 @@
 import * as i0 from "@angular/core";
 import * as i1 from "./query-builder.component";
 import * as i2 from "./query-builder-header.component";
+import * as i3 from "./query-builder.directives";
 /**
  * @hidden
  * IMPORTANT: The following is NgModule exported for backwards-compatibility before standalone components
  */
 export declare class IgxQueryBuilderModule {
     static ɵfac: i0.ɵɵFactoryDeclaration<IgxQueryBuilderModule, never>;
-    static ɵmod: i0.ɵɵNgModuleDeclaration<IgxQueryBuilderModule, never, [typeof i1.IgxQueryBuilderComponent, typeof i2.IgxQueryBuilderHeaderComponent], [typeof i1.IgxQueryBuilderComponent, typeof i2.IgxQueryBuilderHeaderComponent]>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<IgxQueryBuilderModule, never, [typeof i1.IgxQueryBuilderComponent, typeof i2.IgxQueryBuilderHeaderComponent, typeof i3.IgxQueryBuilderSearchValueTemplateDirective], [typeof i1.IgxQueryBuilderComponent, typeof i2.IgxQueryBuilderHeaderComponent, typeof i3.IgxQueryBuilderSearchValueTemplateDirective]>;
     static ɵinj: i0.ɵɵInjectorDeclaration<IgxQueryBuilderModule>;
 }

package/lib/services/public_api.d.ts

@@ -15,4 +15,3 @@ export * from './transaction/igx-hierarchical-transaction';
 export * from './transaction/igx-transaction';
 export * from './transaction/transaction';
 export * from './transaction/transaction-factory.service';
-export * from './theme/theme.token';

package/lib/services/theme/theme.service.d.ts

@@ -0,0 +1,27 @@
+import { ElementRef } from "@angular/core";
+import * as i0 from "@angular/core";
+declare const Theme: {
+    Material: "material";
+    Fluent: "fluent";
+    Bootstrap: "bootstrap";
+    IndigoDesign: "indigo";
+};
+/**
+ * Determines the component theme.
+ */
+export type IgxTheme = (typeof Theme)[keyof typeof Theme];
+export declare class ThemeService {
+    private document;
+    /**
+     * Sets the theme of the component.
+     * Allowed values of type IgxTheme.
+     */
+    globalTheme: IgxTheme;
+    private theme$;
+    constructor(document: any);
+    private init;
+    getComponentTheme(el: ElementRef): IgxTheme;
+    static ɵfac: i0.ɵɵFactoryDeclaration<ThemeService, never>;
+    static ɵprov: i0.ɵɵInjectableDeclaration<ThemeService>;
+}
+export {};

package/migrations/update-18_2_0/changes/inputs.json

@@ -1,6 +1,15 @@
 {
     "$schema": "../../common/schema/binding.schema.json",
     "changes": [
+        {
+            "name": "fields",
+            "replaceWith": "entities",
+            "valueTransform": "fields_to_entities",
+            "owner": {
+                "selector": "igx-query-builder",
+                "type": "component"
+            }
+        },
         {
             "name": "filterable",
             "replaceWith": "disableFiltering",

package/migrations/update-18_2_0/index.js

@@ -14,6 +14,10 @@ const version = '18.2.0';
 exports.default = () => (host, context) => __awaiter(void 0, void 0, void 0, function* () {
     context.logger.info(`Applying migration for Ignite UI for Angular to version ${version}`);
     const update = new UpdateChanges_1.UpdateChanges(__dirname, host, context);
+    update.addValueTransform('fields_to_entities', (args) => {
+        args.bindingType = UpdateChanges_1.InputPropertyType.EVAL;
+        args.value = `[{ name: '', fields: ${args.value}}]`;
+    });
     const IG_COLORS = [
         'primary-',
         'primary-A',

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "igniteui-angular",
-  "version": "19.0.7",
+  "version": "19.1.0-beta.1",
   "description": "Ignite UI for Angular is a dependency-free Angular toolkit for building modern web apps",
   "author": "Infragistics",
   "license": "SEE LICENSE IN LICENSE",
@@ -73,7 +73,7 @@
     "tslib": "^2.3.0",
     "igniteui-trial-watermark": "^3.0.2",
     "lodash-es": "^4.17.21",
-    "igniteui-theming": "^14.3.0",
+    "igniteui-theming": "v14.5.0-beta.2",
     "@igniteui/material-icons-extended": "^3.1.0"
   },
   "peerDependencies": {