Merge branch '19.2.x' into apetrov/fix-bootstrap-border-19.2.x

Author: adrianptrv

projects/igniteui-angular/src/lib/directives/tooltip/tooltip-target.directive.ts

@@ -199,6 +199,9 @@ export class IgxTooltipTargetDirective extends IgxToggleActionDirective implemen
     public override onClick() {
         if (!this.target.collapsed) {
             this.target.forceClose(this.mergedOverlaySettings);
+        } else if (this.target.toBeShown) {
+            clearTimeout(this.target.timeoutId);
+            this.target.toBeShown = false;
         }
     }
 

projects/igniteui-angular/src/lib/directives/tooltip/tooltip.directive.spec.ts

@@ -258,6 +258,21 @@ describe('IgxTooltip', () => {
             verifyTooltipVisibility(tooltipNativeElement, tooltipTarget, false);
         }));
 
+        it('IgxTooltip should not be shown if the target is clicked - #16145', fakeAsync(() => {
+            tooltipTarget.showDelay = 500;
+            fix.detectChanges();
+
+            hoverElement(button);
+            tick(300);
+            verifyTooltipVisibility(tooltipNativeElement, tooltipTarget, false);
+
+            UIInteractions.simulateClickAndSelectEvent(button);
+            fix.detectChanges();
+
+            tick(300);
+            verifyTooltipVisibility(tooltipNativeElement, tooltipTarget, false);
+        }));
+
         it('IgxTooltip hides on pressing \'escape\' key', fakeAsync(() => {
             tooltipTarget.showTooltip();
             flush();

projects/igniteui-angular/src/lib/grids/columns/column.component.ts

@@ -967,8 +967,9 @@ export class IgxColumnComponent implements AfterContentInit, OnDestroy, ColumnTy
      */
     public get minWidthPx() {
         const gridAvailableSize = this.grid.calcWidth;
-        const isPercentageWidth = this.minWidth && typeof this.minWidth === 'string' && this.minWidth.indexOf('%') !== -1;
-        return isPercentageWidth ? parseFloat(this.minWidth) / 100 * gridAvailableSize : parseFloat(this.minWidth);
+        const minWidth = this.minWidth || this.defaultMinWidth;
+        const isPercentageWidth = minWidth && typeof minWidth === 'string' && minWidth.indexOf('%') !== -1;
+        return isPercentageWidth ? parseFloat(minWidth) / 100 * gridAvailableSize : parseFloat(minWidth);
     }
 
     /**
@@ -985,8 +986,9 @@ export class IgxColumnComponent implements AfterContentInit, OnDestroy, ColumnTy
      */
     public get minWidthPercent() {
         const gridAvailableSize = this.grid.calcWidth;
-        const isPercentageWidth = this.minWidth && typeof this.minWidth === 'string' && this.minWidth.indexOf('%') !== -1;
-        return isPercentageWidth ? parseFloat(this.minWidth) : parseFloat(this.minWidth) / gridAvailableSize * 100;
+        const minWidth = this.minWidth || this.defaultMinWidth;
+        const isPercentageWidth = minWidth && typeof minWidth === 'string' && minWidth.indexOf('%') !== -1;
+        return isPercentageWidth ? parseFloat(minWidth) : parseFloat(minWidth) / gridAvailableSize * 100;
     }
 
 
@@ -1014,7 +1016,7 @@ export class IgxColumnComponent implements AfterContentInit, OnDestroy, ColumnTy
         this.grid.notifyChanges(true);
     }
     public get minWidth(): string {
-        return !this._defaultMinWidth ? this.defaultMinWidth : this._defaultMinWidth;
+        return this._defaultMinWidth;
     }
 
     /** @hidden @internal **/
@@ -2646,8 +2648,15 @@ export class IgxColumnComponent implements AfterContentInit, OnDestroy, ColumnTy
             const currentCalcWidth = this.defaultWidth || this.grid.getPossibleColumnWidth();
             this._calcWidth = this.getConstrainedSizePx(currentCalcWidth);
         } else {
-            const currentCalcWidth =  parseFloat(this.width);
-            this._calcWidth =this.getConstrainedSizePx(currentCalcWidth);
+            let possibleColumnWidth = '';
+            if (!this.widthSetByUser && this.userSetMinWidthPx && this.userSetMinWidthPx < this.grid.minColumnWidth) {
+                possibleColumnWidth = this.defaultWidth = this.grid.getPossibleColumnWidth(null, this.userSetMinWidthPx);
+            } else {
+                possibleColumnWidth = this.width;
+            }
+
+            const currentCalcWidth = parseFloat(possibleColumnWidth);
+            this._calcWidth = this.getConstrainedSizePx(currentCalcWidth);
         }
         this.calcPixelWidth = parseFloat(this._calcWidth);
     }

projects/igniteui-angular/src/lib/grids/common/grid.interface.ts

@@ -295,19 +295,63 @@ export interface RowType {
      */
     unpin?: () => void;
 }
-
+/**
+ * Describes a field that can be used in the Grid and QueryBuilder components.
+ */
 export interface FieldType {
+    /**
+     * Display label for the field.
+     */
     label?: string;
+
+    /**
+     * The internal field name, used in expressions and queries.
+     */
     field: string;
+
+    /**
+     * Optional column header for UI display purposes.
+     */
     header?: string;
+
+    /**
+     * The data type of the field.
+     */
     /* alternateType: GridColumnDataType */
     dataType: DataType;
+
+    /**
+     * Options for the editor associated with this field.
+     */
     editorOptions?: IFieldEditorOptions;
+
+    /**
+     * Optional filtering operands that apply to this field.
+     */
     filters?: IgxFilteringOperand;
+
+    /**
+     * Optional arguments for any pipe applied to the field.
+     */
     pipeArgs?: IFieldPipeArgs;
+
+    /**
+     * Default time format for Date/Time fields.
+     */
     defaultTimeFormat?: string;
+
+    /**
+     * Default date/time format for Date/Time fields.
+     */
     defaultDateTimeFormat?: string;
 
+    /**
+     * Optional formatter function to transform the value before display.
+     *
+     * @param value - The value of the field.
+     * @param rowData - Optional row data that contains this field.
+     * @returns The formatted value.
+     */
     formatter?(value: any, rowData?: any): any;
 }
 
@@ -1156,7 +1200,7 @@ export interface GridType extends IGridDataBindable {
     refreshSearch(): void;
     getDefaultExpandState(record: any): boolean;
     trackColumnChanges(index: number, column: any): any;
-    getPossibleColumnWidth(): string;
+    getPossibleColumnWidth(baseWidth?: number, minColumnWidth?: number): string;
     resetHorizontalVirtualization(): void;
     hasVerticalScroll(): boolean;
     getVisibleContentHeight(): number;
@@ -1492,10 +1536,24 @@ export interface IClipboardOptions {
 }
 
 /**
- * An interface describing entity
+ * Describes an entity in the QueryBuilder.
+ * An entity represents a logical grouping of fields and can have nested child entities.
  */
 export interface EntityType {
+    /**
+     * The name of the entity.
+     * Typically used as an identifier in expressions.
+     */
     name: string;
+
+    /**
+     * The list of fields that belong to this entity.
+     */
     fields: FieldType[];
+
+    /**
+     * Optional child entities.
+     * This allows building hierarchical or nested query structures.
+     */
     childEntities?: EntityType[];
 }

projects/igniteui-angular/src/lib/grids/grid-base.directive.ts

@@ -5451,7 +5451,7 @@ export abstract class IgxGridBaseDirective implements GridType,
     /**
      * @hidden @internal
      */
-    public getPossibleColumnWidth(baseWidth: number = null) {
+    public getPossibleColumnWidth(baseWidth: number = null, minColumnWidth: number = null) {
         let computedWidth;
         if (baseWidth !== null) {
             computedWidth = baseWidth;
@@ -5500,9 +5500,11 @@ export abstract class IgxGridBaseDirective implements GridType,
         }
         computedWidth -= this.featureColumnsWidth();
 
+        const minColWidth = minColumnWidth || this.minColumnWidth;
+
         const columnWidth = !Number.isFinite(sumExistingWidths) ?
-            Math.max(computedWidth / columnsToSize, this.minColumnWidth) :
-            Math.max((computedWidth - sumExistingWidths) / columnsToSize, this.minColumnWidth);
+            Math.max(computedWidth / columnsToSize, minColWidth) :
+            Math.max((computedWidth - sumExistingWidths) / columnsToSize, minColWidth);
 
         return columnWidth + 'px';
     }

projects/igniteui-angular/src/lib/grids/grid/column-resizing.spec.ts

@@ -29,6 +29,7 @@ describe('IgxGrid - Deferred Column Resizing #grid', () => {
                 GridFeaturesComponent,
                 LargePinnedColGridComponent,
                 NullColumnsComponent,
+                MinWidthColumnsComponent,
                 ColGridComponent,
                 ColPercentageGridComponent
             ]
@@ -898,6 +899,18 @@ describe('IgxGrid - Deferred Column Resizing #grid', () => {
             expect(headers[headers.length - 1].nativeElement.innerText).toEqual("ReleaseDate");
             expect(firstRowCells.length).toEqual(11);
         }));
+
+        it('should use user-provided `minWidth` as default min column width to size columns - #16057.', fakeAsync(() => {
+            const fixture = TestBed.createComponent(MinWidthColumnsComponent);
+            fixture.detectChanges();
+
+            const grid = fixture.componentInstance.grid;
+
+            expect(grid.columnList.get(0).width).toEqual('130px');
+            expect(grid.columnList.get(1).width).toEqual('90px');
+            expect(grid.columnList.get(2).width).toEqual('90px');
+            expect(grid.columnList.get(3).width).toEqual('90px');
+        }));
     });
 
     describe('Resizer tests: ', () => {
@@ -1056,6 +1069,23 @@ export class NullColumnsComponent implements OnInit {
     }
 }
 
+@Component({
+    template: GridTemplateStrings.declareGrid(`width="400px" height="200px"`, ``, `<igx-column [field]="'ID'" [width]="'130px'" [resizable]="true"></igx-column>
+        <igx-column [field]="'CompanyName'" [minWidth]="'50px'" [resizable]="true"></igx-column>
+        <igx-column [field]="'ContactName'" [minWidth]="'50px'" [resizable]="true"></igx-column>
+        <igx-column [field]="'ContactTitle'" [minWidth]="'50px'" [resizable]="true"></igx-column>`),
+    imports: [IgxGridComponent, IgxColumnComponent]
+})
+export class MinWidthColumnsComponent implements OnInit {
+    @ViewChild(IgxGridComponent, { static: true }) public grid: IgxGridComponent;
+
+    public data = [];
+
+    public ngOnInit(): void {
+        this.data = SampleTestData.contactInfoData();
+    }
+}
+
 @Component({
     template: GridTemplateStrings.declareGrid(`width="400px" height="600px" [allowFiltering]="true"`, ``, `<igx-column [field]="'Items'" [width]="'40px'" dataType="string" [filterable]="true"></igx-column>
          <igx-column [field]="'ID'" [width]="'50px'" [header]="'ID'" [filterable]="true"></igx-column>

projects/igniteui-angular/src/lib/grids/pivot-grid/pivot-grid.spec.ts

@@ -531,7 +531,7 @@ describe('IgxPivotGrid #pivotGrid', () => {
             expect(pivotGrid.gridSize).toBe(Size.Small);
             const dimensionContents = fixture.debugElement.queryAll(By.css('.igx-grid__tbody-pivot-dimension'));
             let rowHeaders = dimensionContents[0].queryAll(By.directive(IgxPivotRowDimensionHeaderGroupComponent));
-            expect(rowHeaders[0].componentInstance.column.minWidth).toBe(minWidthSupercompact);
+            expect(rowHeaders[0].componentInstance.column.defaultMinWidth).toBe(minWidthSupercompact);
             expect(pivotGrid.rowList.first.cells.first.nativeElement.offsetHeight).toBe(cellHeightSuperCompact);
 
             pivotGrid.superCompactMode = false;
@@ -543,7 +543,7 @@ describe('IgxPivotGrid #pivotGrid', () => {
 
             expect(pivotGrid.gridSize).toBe(Size.Large);
             rowHeaders = dimensionContents[0].queryAll(By.directive(IgxPivotRowDimensionHeaderGroupComponent));
-            expect(rowHeaders[0].componentInstance.column.minWidth).toBe(minWidthComf);
+            expect(rowHeaders[0].componentInstance.column.defaultMinWidth).toBe(minWidthComf);
             expect(pivotGrid.rowList.first.cells.first.nativeElement.offsetHeight).toBe(cellHeightComf);
         }));
 
@@ -2411,7 +2411,7 @@ describe('IgxPivotGrid #pivotGrid', () => {
             fixture.detectChanges();
 
             rowHeaders = dimensionContents[0].queryAll(By.directive(IgxPivotRowDimensionHeaderGroupComponent));
-            const minWdith = parseFloat(rowHeaders[0].componentInstance.column.minWidth);
+            const minWdith = parseFloat(rowHeaders[0].componentInstance.column.defaultMinWidth);
             expect(parseFloat(rowHeaders[0].componentInstance.column.width)).toEqual(minWdith);
             expect(parseFloat(rowHeaders[3].componentInstance.column.width)).toEqual(minWdith);
 

projects/igniteui-angular/src/lib/query-builder/query-builder.component.ts

@@ -51,16 +51,40 @@ export class IgxQueryBuilderComponent implements OnDestroy {
     public showEntityChangeDialog = true;
 
     /**
-     * Returns the entities.
-     * @hidden
+     * Gets the list of entities available for the IgxQueryBuilderComponent.
+     *
+     * Each entity describes a logical group of fields that can be used in queries.
+     * An entity can optionally have child entities, allowing nested sub-queries.
+     *
+     * @returns An array of {@link EntityType} objects.
      */
     public get entities(): EntityType[] {
         return this._entities;
     }
 
     /**
-     * Sets the entities.
-     * @hidden
+     * Sets the list of entities for the IgxQueryBuilderComponent.
+     * If the `expressionTree` is defined, it will be recreated with the new entities.
+     *
+     * Each entity should be an {@link EntityType} object describing the fields and optionally child entities.
+     *
+     * Example:
+     * ```ts
+     * [
+     *   {
+     *     name: 'Orders',
+     *     fields: [{ field: 'OrderID', dataType: 'number' }],
+     *     childEntities: [
+     *       {
+     *         name: 'OrderDetails',
+     *         fields: [{ field: 'ProductID', dataType: 'number' }]
+     *       }
+     *     ]
+     *   }
+     * ]
+     * ```
+     *
+     * @param entities - The array of entities to set.
      */
     @Input()
     public set entities(entities: EntityType[]) {
@@ -73,18 +97,22 @@ export class IgxQueryBuilderComponent implements OnDestroy {
     }
 
     /**
-     * Returns the fields.
+     * Gets the list of fields for the QueryBuilder.
+     *
+     * @deprecated since version 19.1.0. Use the `entities` property instead.
      * @hidden
-     * @deprecated in version 19.1.0. Use the `entities` property instead.
      */
     public get fields(): FieldType[] {
         return this._fields;
     }
 
     /**
-     * Sets the fields.
+     * Sets the list of fields for the QueryBuilder.
+     * Automatically wraps them into a single entity to maintain backward compatibility.
+     *
+     * @param fields - The array of fields to set.
+     * @deprecated since version 19.1.0. Use the `entities` property instead.
      * @hidden
-     * @deprecated in version 19.1.0. Use the `entities` property instead.
      */
     @Input()
     public set fields(fields: FieldType[]) {