Skip to content

Commit 0a420eb

Browse files
authored
Merge branch 'master' into rivanova/fix-16145-master
2 parents 4a38a07 + 8de2a92 commit 0a420eb

File tree

6 files changed

+151
-24
lines changed

6 files changed

+151
-24
lines changed

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

Lines changed: 16 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -968,8 +968,9 @@ export class IgxColumnComponent implements AfterContentInit, OnDestroy, ColumnTy
968968
*/
969969
public get minWidthPx() {
970970
const gridAvailableSize = this.grid.calcWidth;
971-
const isPercentageWidth = this.minWidth && typeof this.minWidth === 'string' && this.minWidth.indexOf('%') !== -1;
972-
return isPercentageWidth ? parseFloat(this.minWidth) / 100 * gridAvailableSize : parseFloat(this.minWidth);
971+
const minWidth = this.minWidth || this.defaultMinWidth;
972+
const isPercentageWidth = minWidth && typeof minWidth === 'string' && minWidth.indexOf('%') !== -1;
973+
return isPercentageWidth ? parseFloat(minWidth) / 100 * gridAvailableSize : parseFloat(minWidth);
973974
}
974975

975976
/**
@@ -986,8 +987,9 @@ export class IgxColumnComponent implements AfterContentInit, OnDestroy, ColumnTy
986987
*/
987988
public get minWidthPercent() {
988989
const gridAvailableSize = this.grid.calcWidth;
989-
const isPercentageWidth = this.minWidth && typeof this.minWidth === 'string' && this.minWidth.indexOf('%') !== -1;
990-
return isPercentageWidth ? parseFloat(this.minWidth) : parseFloat(this.minWidth) / gridAvailableSize * 100;
990+
const minWidth = this.minWidth || this.defaultMinWidth;
991+
const isPercentageWidth = minWidth && typeof minWidth === 'string' && minWidth.indexOf('%') !== -1;
992+
return isPercentageWidth ? parseFloat(minWidth) : parseFloat(minWidth) / gridAvailableSize * 100;
991993
}
992994

993995

@@ -1015,7 +1017,7 @@ export class IgxColumnComponent implements AfterContentInit, OnDestroy, ColumnTy
10151017
this.grid.notifyChanges(true);
10161018
}
10171019
public get minWidth(): string {
1018-
return !this._defaultMinWidth ? this.defaultMinWidth : this._defaultMinWidth;
1020+
return this._defaultMinWidth;
10191021
}
10201022

10211023
/** @hidden @internal **/
@@ -2647,8 +2649,15 @@ export class IgxColumnComponent implements AfterContentInit, OnDestroy, ColumnTy
26472649
const currentCalcWidth = this.defaultWidth || this.grid.getPossibleColumnWidth();
26482650
this._calcWidth = this.getConstrainedSizePx(currentCalcWidth);
26492651
} else {
2650-
const currentCalcWidth = parseFloat(this.width);
2651-
this._calcWidth =this.getConstrainedSizePx(currentCalcWidth);
2652+
let possibleColumnWidth = '';
2653+
if (!this.widthSetByUser && this.userSetMinWidthPx && this.userSetMinWidthPx < this.grid.minColumnWidth) {
2654+
possibleColumnWidth = this.defaultWidth = this.grid.getPossibleColumnWidth(null, this.userSetMinWidthPx);
2655+
} else {
2656+
possibleColumnWidth = this.width;
2657+
}
2658+
2659+
const currentCalcWidth = parseFloat(possibleColumnWidth);
2660+
this._calcWidth = this.getConstrainedSizePx(currentCalcWidth);
26522661
}
26532662
this.calcPixelWidth = parseFloat(this._calcWidth);
26542663
}

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

Lines changed: 61 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -295,19 +295,63 @@ export interface RowType {
295295
*/
296296
unpin?: () => void;
297297
}
298-
298+
/**
299+
* Describes a field that can be used in the Grid and QueryBuilder components.
300+
*/
299301
export interface FieldType {
302+
/**
303+
* Display label for the field.
304+
*/
300305
label?: string;
306+
307+
/**
308+
* The internal field name, used in expressions and queries.
309+
*/
301310
field: string;
311+
312+
/**
313+
* Optional column header for UI display purposes.
314+
*/
302315
header?: string;
316+
317+
/**
318+
* The data type of the field.
319+
*/
303320
/* alternateType: GridColumnDataType */
304321
dataType: DataType;
322+
323+
/**
324+
* Options for the editor associated with this field.
325+
*/
305326
editorOptions?: IFieldEditorOptions;
327+
328+
/**
329+
* Optional filtering operands that apply to this field.
330+
*/
306331
filters?: IgxFilteringOperand;
332+
333+
/**
334+
* Optional arguments for any pipe applied to the field.
335+
*/
307336
pipeArgs?: IFieldPipeArgs;
337+
338+
/**
339+
* Default time format for Date/Time fields.
340+
*/
308341
defaultTimeFormat?: string;
342+
343+
/**
344+
* Default date/time format for Date/Time fields.
345+
*/
309346
defaultDateTimeFormat?: string;
310347

348+
/**
349+
* Optional formatter function to transform the value before display.
350+
*
351+
* @param value - The value of the field.
352+
* @param rowData - Optional row data that contains this field.
353+
* @returns The formatted value.
354+
*/
311355
formatter?(value: any, rowData?: any): any;
312356
}
313357

@@ -1156,7 +1200,7 @@ export interface GridType extends IGridDataBindable {
11561200
refreshSearch(): void;
11571201
getDefaultExpandState(record: any): boolean;
11581202
trackColumnChanges(index: number, column: any): any;
1159-
getPossibleColumnWidth(): string;
1203+
getPossibleColumnWidth(baseWidth?: number, minColumnWidth?: number): string;
11601204
resetHorizontalVirtualization(): void;
11611205
hasVerticalScroll(): boolean;
11621206
getVisibleContentHeight(): number;
@@ -1492,10 +1536,24 @@ export interface IClipboardOptions {
14921536
}
14931537

14941538
/**
1495-
* An interface describing entity
1539+
* Describes an entity in the QueryBuilder.
1540+
* An entity represents a logical grouping of fields and can have nested child entities.
14961541
*/
14971542
export interface EntityType {
1543+
/**
1544+
* The name of the entity.
1545+
* Typically used as an identifier in expressions.
1546+
*/
14981547
name: string;
1548+
1549+
/**
1550+
* The list of fields that belong to this entity.
1551+
*/
14991552
fields: FieldType[];
1553+
1554+
/**
1555+
* Optional child entities.
1556+
* This allows building hierarchical or nested query structures.
1557+
*/
15001558
childEntities?: EntityType[];
15011559
}

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

Lines changed: 5 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -5484,7 +5484,7 @@ export abstract class IgxGridBaseDirective implements GridType,
54845484
/**
54855485
* @hidden @internal
54865486
*/
5487-
public getPossibleColumnWidth(baseWidth: number = null) {
5487+
public getPossibleColumnWidth(baseWidth: number = null, minColumnWidth: number = null) {
54885488
let computedWidth;
54895489
if (baseWidth !== null) {
54905490
computedWidth = baseWidth;
@@ -5533,9 +5533,11 @@ export abstract class IgxGridBaseDirective implements GridType,
55335533
}
55345534
computedWidth -= this.featureColumnsWidth();
55355535

5536+
const minColWidth = minColumnWidth || this.minColumnWidth;
5537+
55365538
const columnWidth = !Number.isFinite(sumExistingWidths) ?
5537-
Math.max(computedWidth / columnsToSize, this.minColumnWidth) :
5538-
Math.max((computedWidth - sumExistingWidths) / columnsToSize, this.minColumnWidth);
5539+
Math.max(computedWidth / columnsToSize, minColWidth) :
5540+
Math.max((computedWidth - sumExistingWidths) / columnsToSize, minColWidth);
55395541

55405542
return columnWidth + 'px';
55415543
}

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

Lines changed: 30 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -29,6 +29,7 @@ describe('IgxGrid - Deferred Column Resizing #grid', () => {
2929
GridFeaturesComponent,
3030
LargePinnedColGridComponent,
3131
NullColumnsComponent,
32+
MinWidthColumnsComponent,
3233
ColGridComponent,
3334
ColPercentageGridComponent
3435
]
@@ -902,6 +903,18 @@ describe('IgxGrid - Deferred Column Resizing #grid', () => {
902903
expect(headers[headers.length - 1].nativeElement.innerText).toEqual("ReleaseDate");
903904
expect(firstRowCells.length).toEqual(11);
904905
}));
906+
907+
it('should use user-provided `minWidth` as default min column width to size columns - #16057.', fakeAsync(() => {
908+
const fixture = TestBed.createComponent(MinWidthColumnsComponent);
909+
fixture.detectChanges();
910+
911+
const grid = fixture.componentInstance.grid;
912+
913+
expect(grid.columnList.get(0).width).toEqual('130px');
914+
expect(grid.columnList.get(1).width).toEqual('90px');
915+
expect(grid.columnList.get(2).width).toEqual('90px');
916+
expect(grid.columnList.get(3).width).toEqual('90px');
917+
}));
905918
});
906919

907920
describe('Resizer tests: ', () => {
@@ -1060,6 +1073,23 @@ export class NullColumnsComponent implements OnInit {
10601073
}
10611074
}
10621075

1076+
@Component({
1077+
template: GridTemplateStrings.declareGrid(`width="400px" height="200px"`, ``, `<igx-column [field]="'ID'" [width]="'130px'" [resizable]="true"></igx-column>
1078+
<igx-column [field]="'CompanyName'" [minWidth]="'50px'" [resizable]="true"></igx-column>
1079+
<igx-column [field]="'ContactName'" [minWidth]="'50px'" [resizable]="true"></igx-column>
1080+
<igx-column [field]="'ContactTitle'" [minWidth]="'50px'" [resizable]="true"></igx-column>`),
1081+
imports: [IgxGridComponent, IgxColumnComponent]
1082+
})
1083+
export class MinWidthColumnsComponent implements OnInit {
1084+
@ViewChild(IgxGridComponent, { static: true }) public grid: IgxGridComponent;
1085+
1086+
public data = [];
1087+
1088+
public ngOnInit(): void {
1089+
this.data = SampleTestData.contactInfoData();
1090+
}
1091+
}
1092+
10631093
@Component({
10641094
template: GridTemplateStrings.declareGrid(`width="400px" height="600px" [allowFiltering]="true"`, ``, `<igx-column [field]="'Items'" [width]="'40px'" dataType="string" [filterable]="true"></igx-column>
10651095
<igx-column [field]="'ID'" [width]="'50px'" [header]="'ID'" [filterable]="true"></igx-column>

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

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -531,7 +531,7 @@ describe('IgxPivotGrid #pivotGrid', () => {
531531
expect(pivotGrid.gridSize).toBe(Size.Small);
532532
const dimensionContents = fixture.debugElement.queryAll(By.css('.igx-grid__tbody-pivot-dimension'));
533533
let rowHeaders = dimensionContents[0].queryAll(By.directive(IgxPivotRowDimensionHeaderGroupComponent));
534-
expect(rowHeaders[0].componentInstance.column.minWidth).toBe(minWidthSupercompact);
534+
expect(rowHeaders[0].componentInstance.column.defaultMinWidth).toBe(minWidthSupercompact);
535535
expect(pivotGrid.rowList.first.cells.first.nativeElement.offsetHeight).toBe(cellHeightSuperCompact);
536536

537537
pivotGrid.superCompactMode = false;
@@ -543,7 +543,7 @@ describe('IgxPivotGrid #pivotGrid', () => {
543543

544544
expect(pivotGrid.gridSize).toBe(Size.Large);
545545
rowHeaders = dimensionContents[0].queryAll(By.directive(IgxPivotRowDimensionHeaderGroupComponent));
546-
expect(rowHeaders[0].componentInstance.column.minWidth).toBe(minWidthComf);
546+
expect(rowHeaders[0].componentInstance.column.defaultMinWidth).toBe(minWidthComf);
547547
expect(pivotGrid.rowList.first.cells.first.nativeElement.offsetHeight).toBe(cellHeightComf);
548548
}));
549549

@@ -2411,7 +2411,7 @@ describe('IgxPivotGrid #pivotGrid', () => {
24112411
fixture.detectChanges();
24122412

24132413
rowHeaders = dimensionContents[0].queryAll(By.directive(IgxPivotRowDimensionHeaderGroupComponent));
2414-
const minWdith = parseFloat(rowHeaders[0].componentInstance.column.minWidth);
2414+
const minWdith = parseFloat(rowHeaders[0].componentInstance.column.defaultMinWidth);
24152415
expect(parseFloat(rowHeaders[0].componentInstance.column.width)).toEqual(minWdith);
24162416
expect(parseFloat(rowHeaders[3].componentInstance.column.width)).toEqual(minWdith);
24172417

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

Lines changed: 36 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -51,16 +51,40 @@ export class IgxQueryBuilderComponent implements OnDestroy {
5151
public showEntityChangeDialog = true;
5252

5353
/**
54-
* Returns the entities.
55-
* @hidden
54+
* Gets the list of entities available for the IgxQueryBuilderComponent.
55+
*
56+
* Each entity describes a logical group of fields that can be used in queries.
57+
* An entity can optionally have child entities, allowing nested sub-queries.
58+
*
59+
* @returns An array of {@link EntityType} objects.
5660
*/
5761
public get entities(): EntityType[] {
5862
return this._entities;
5963
}
6064

6165
/**
62-
* Sets the entities.
63-
* @hidden
66+
* Sets the list of entities for the IgxQueryBuilderComponent.
67+
* If the `expressionTree` is defined, it will be recreated with the new entities.
68+
*
69+
* Each entity should be an {@link EntityType} object describing the fields and optionally child entities.
70+
*
71+
* Example:
72+
* ```ts
73+
* [
74+
* {
75+
* name: 'Orders',
76+
* fields: [{ field: 'OrderID', dataType: 'number' }],
77+
* childEntities: [
78+
* {
79+
* name: 'OrderDetails',
80+
* fields: [{ field: 'ProductID', dataType: 'number' }]
81+
* }
82+
* ]
83+
* }
84+
* ]
85+
* ```
86+
*
87+
* @param entities - The array of entities to set.
6488
*/
6589
@Input()
6690
public set entities(entities: EntityType[]) {
@@ -73,18 +97,22 @@ export class IgxQueryBuilderComponent implements OnDestroy {
7397
}
7498

7599
/**
76-
* Returns the fields.
100+
* Gets the list of fields for the QueryBuilder.
101+
*
102+
* @deprecated since version 19.1.0. Use the `entities` property instead.
77103
* @hidden
78-
* @deprecated in version 19.1.0. Use the `entities` property instead.
79104
*/
80105
public get fields(): FieldType[] {
81106
return this._fields;
82107
}
83108

84109
/**
85-
* Sets the fields.
110+
* Sets the list of fields for the QueryBuilder.
111+
* Automatically wraps them into a single entity to maintain backward compatibility.
112+
*
113+
* @param fields - The array of fields to set.
114+
* @deprecated since version 19.1.0. Use the `entities` property instead.
86115
* @hidden
87-
* @deprecated in version 19.1.0. Use the `entities` property instead.
88116
*/
89117
@Input()
90118
public set fields(fields: FieldType[]) {

0 commit comments

Comments
 (0)