Skip to content

Commit e69f3ea

Browse files
ddinchevaddincheva
committed
chore(*): rename visibleWhenCollapse property
1 parent f5acb06 commit e69f3ea

File tree

5 files changed

+27
-27
lines changed

5 files changed

+27
-27
lines changed

‎CHANGELOG.md

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -27,8 +27,8 @@ All notable changes for each version of this project will be documented in this
2727
- `advancedFilteringExpressionsTreeChange` event emitter is added, which is fired whenever a change to the advanced filtering expressions has occurred (prior to performing the actual filtering).
2828
- `collapsible` and `expanded` properties are added to the IgxColumnGroupComponent; `collapsible` property identifies that certain column group is collapsible; `expanded` identifies whether the group is expanded or collapsed initially;
2929
- `collapsibleChange` and `expandedChange` events are added to the IgxColumnGroupComponent which are emited whenever `collapsible` and `expanded` properties are changed accordingly;
30-
- `visibleWhenCollapse` property has been added to the IgxColumnComponent; Allows you to set whether the column stay visible when its parrent is collapsed.
31-
- `visibleWhenCollapseChange` events is added to the IgxColumnComponent which are emited whenever `visibleWhenCollapse` property is changed;
30+
- `visibleWhenCollapsed` property has been added to the IgxColumnComponent; Allows you to set whether the column stay visible when its parrent is collapsed.
31+
- `visibleWhenCollapsedChange` events is added to the IgxColumnComponent which are emited whenever `visibleWhenCollapsed` property is changed;
3232
- `collapsibleIndicatorTemplate` property is introduced to IgxColumnGroupComponent, which allows you to set a custom template for the expand collapse indicator;
3333
- `igxCollapsibleIndicator` directive has been introduced, which allows you to set a custom template for the expand collapse indicator;
3434
- `IgxGridExcelStyleFilteringComponent` and `IgxAdvancedFilteringDialogComponent` can now be hosted outside of the grid in order to provide the same experience as the built-in filtering UI.

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

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -207,8 +207,8 @@ export class IgxColumnGroupComponent extends IgxColumnComponent implements After
207207
this.children.forEach(child => child.hidden = value);
208208
} else {
209209
this.children.forEach(c => {
210-
if (c.visibleWhenCollapse === undefined) {c.hidden = false; return; }
211-
c.hidden = this.expanded ? c.visibleWhenCollapse : !c.visibleWhenCollapse;
210+
if (c.visibleWhenCollapsed === undefined) {c.hidden = false; return; }
211+
c.hidden = this.expanded ? c.visibleWhenCollapsed : !c.visibleWhenCollapsed;
212212
});
213213
}
214214
}
@@ -241,7 +241,7 @@ export class IgxColumnGroupComponent extends IgxColumnComponent implements After
241241
child.parent = this;
242242
});
243243
if (this.collapsible) {
244-
const cols = this.children.map(child => child.visibleWhenCollapse);
244+
const cols = this.children.map(child => child.visibleWhenCollapsed);
245245
if (!(cols.some(c => c === true) && cols.some(c => c === false))) {
246246
this.collapsible = false;
247247
return;

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

Lines changed: 11 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -260,7 +260,7 @@ export class IgxColumnComponent implements AfterContentInit {
260260
public collapsibleChange = new EventEmitter<boolean>();
261261
/** @hidden */
262262
@Output()
263-
public visibleWhenCollapseChange = new EventEmitter<boolean>();
263+
public visibleWhenCollapsedChange = new EventEmitter<boolean>();
264264

265265
/**
266266
* Gets whether the hiding is disabled.
@@ -1016,17 +1016,17 @@ export class IgxColumnComponent implements AfterContentInit {
10161016
* Indicates whether the column will be visible when its parent is collapsed.
10171017
* ```html
10181018
* <igx-column-group>
1019-
* <igx-column [visibleWhenCollapse]="true"></igx-column>
1019+
* <igx-column [visibleWhenCollapsed]="true"></igx-column>
10201020
* </igx-column-group>
10211021
* ```
10221022
* @memberof IgxColumnComponent
10231023
*/
10241024
@Input()
1025-
set visibleWhenCollapse(value: boolean) {
1026-
this._visibleWhenCollapse = value;
1027-
this.visibleWhenCollapseChange.emit(this._visibleWhenCollapse);
1025+
set visibleWhenCollapsed(value: boolean) {
1026+
this._visibleWhenCollapsed = value;
1027+
this.visibleWhenCollapsedChange.emit(this._visibleWhenCollapsed);
10281028
if (this.parent) {
1029-
const cols = this.parent.children.map(child => child.visibleWhenCollapse);
1029+
const cols = this.parent.children.map(child => child.visibleWhenCollapsed);
10301030
if (!(cols.some(c => c === true) && cols.some(c => c === false))) {
10311031
this.parent.collapsible = false;
10321032
} else {
@@ -1035,9 +1035,9 @@ export class IgxColumnComponent implements AfterContentInit {
10351035
}
10361036
}
10371037

1038-
get visibleWhenCollapse(): boolean {
1038+
get visibleWhenCollapsed(): boolean {
10391039
if (!this.parent) { return; }
1040-
return this._visibleWhenCollapse;
1040+
return this._visibleWhenCollapsed;
10411041
}
10421042

10431043
/**
@@ -1170,7 +1170,7 @@ export class IgxColumnComponent implements AfterContentInit {
11701170
/**
11711171
* @hidden
11721172
*/
1173-
protected _visibleWhenCollapse;
1173+
protected _visibleWhenCollapsed;
11741174
/**
11751175
* @hidden
11761176
*/
@@ -1768,8 +1768,8 @@ export class IgxColumnComponent implements AfterContentInit {
17681768
* @internal
17691769
*/
17701770
protected setExpandCollapseState() {
1771-
this.children.filter(col => (col.visibleWhenCollapse !== undefined)).forEach(c => {
1772-
c.hidden = this._expanded ? c.visibleWhenCollapse : !c.visibleWhenCollapse;
1771+
this.children.filter(col => (col.visibleWhenCollapsed !== undefined)).forEach(c => {
1772+
c.hidden = this._expanded ? c.visibleWhenCollapsed : !c.visibleWhenCollapsed;
17731773
});
17741774
}
17751775

‎src/app/grid-column-groups/grid-column-groups.sample.html

Lines changed: 10 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -7,23 +7,23 @@
77
<igx-grid [allowFiltering]="true" [rowSelectable]="false" #grid [data]="data" displayDensity="compact" [showToolbar]="true" [allowAdvancedFiltering]="true" [columnHiding]="true">
88
<igx-column [movable]="true" [resizable]="true" [pinned]="true" field="Missing"></igx-column>
99
<igx-column-group [movable]="true" header="General Information" [collapsible]="true" [expanded]="true" [hidden]="true">
10-
<igx-column [movable]="true" [filterable]="false" [hidden]="true" sortable="true" resizable="true" field="CompanyName" width="200px" [visibleWhenCollapse]="false"></igx-column>
10+
<igx-column [movable]="true" [filterable]="false" [hidden]="true" sortable="true" resizable="true" field="CompanyName" width="200px" [visibleWhenCollapsed]="false"></igx-column>
1111
<igx-column field="Missing"></igx-column>
12-
<igx-column-group [movable]="true" header="Person Details" [collapsible]="true" [expanded]="false" [visibleWhenCollapse]="true">
13-
<igx-column [movable]="true" [visibleWhenCollapse]="false" [hidden]="true" filterable="true" sortable="true" resizable="true" field="ContactName"></igx-column>
14-
<igx-column [movable]="true" [visibleWhenCollapse]="false" [pinned]="true" filterable="true" sortable="true" resizable="true" field="ContactTitle"></igx-column>
12+
<igx-column-group [movable]="true" header="Person Details" [collapsible]="true" [expanded]="false" [visibleWhenCollapsed]="true">
13+
<igx-column [movable]="true" [visibleWhenCollapsed]="false" [hidden]="true" filterable="true" sortable="true" resizable="true" field="ContactName"></igx-column>
14+
<igx-column [movable]="true" [visibleWhenCollapsed]="false" [pinned]="true" filterable="true" sortable="true" resizable="true" field="ContactTitle"></igx-column>
1515
</igx-column-group>
1616
<ng-template igxCollapsibleIndicator let-column="column" #ind >
1717
<igx-icon [attr.draggable]="false">{{column.expanded ? 'remove' : 'add'}} </igx-icon>
1818
</ng-template>
1919
</igx-column-group>
2020
<igx-column [movable]="true" [hidden]="s" [resizable]="true" field="ID" editable="true"></igx-column>
2121
<igx-column-group [movable]="true" header="Address Information" [(collapsible)]='s' [expanded]='true'>
22-
<igx-column [movable]="true" filterable="true" sortable="true" resizable="true" field="Country" [visibleWhenCollapse]= 'false'></igx-column>
23-
<igx-column [movable]="true" filterable="true" sortable="true" resizable="true" field="Region" [visibleWhenCollapse]= 'false'></igx-column>
24-
<igx-column [movable]="true" filterable="true" sortable="true" resizable="true" field="City" [visibleWhenCollapse]= 'false'></igx-column>
25-
<igx-column [movable]="true" filterable="true" sortable="true" resizable="true" field="Address" [visibleWhenCollapse]= 'false'></igx-column>
26-
<igx-column [movable]="true" filterable="true" editable="true" sortable="true" [visibleWhenCollapse]= 'true' field="FullAddress"></igx-column>
22+
<igx-column [movable]="true" filterable="true" sortable="true" resizable="true" field="Country" [visibleWhenCollapsed]= 'false'></igx-column>
23+
<igx-column [movable]="true" filterable="true" sortable="true" resizable="true" field="Region" [visibleWhenCollapsed]= 'false'></igx-column>
24+
<igx-column [movable]="true" filterable="true" sortable="true" resizable="true" field="City" [visibleWhenCollapsed]= 'false'></igx-column>
25+
<igx-column [movable]="true" filterable="true" sortable="true" resizable="true" field="Address" [visibleWhenCollapsed]= 'false'></igx-column>
26+
<igx-column [movable]="true" filterable="true" editable="true" sortable="true" [visibleWhenCollapsed]= 'true' field="FullAddress"></igx-column>
2727
</igx-column-group>
2828
<igx-column field="Missing"></igx-column>
2929
<igx-column field="Missing"></igx-column>
@@ -57,7 +57,7 @@
5757
</igx-column-group>
5858
</igx-grid>
5959
<span igxButton (click)="log()">Pin first group</span>
60-
<span igxButton (click)="pinGroup()">Toggle visibleWhenCollapse - Person Details</span>
60+
<span igxButton (click)="pinGroup()">Toggle visibleWhenCollapsed - Person Details</span>
6161
<span igxButton (click)="hideGroup()">Toggle expand - Address Information</span>
6262
<span igxButton (click)="toggleCollapsible()">Toggle collapsible - General Information</span>
6363
</section>

‎src/app/grid-column-groups/grid-column-groups.sample.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -56,7 +56,7 @@ export class GridColumnGroupsSampleComponent implements AfterViewInit {
5656

5757
pinGroup() {
5858
const t = this.grid.getColumnByName('ContactName');
59-
t.visibleWhenCollapse = !t.visibleWhenCollapse;
59+
t.visibleWhenCollapsed = !t.visibleWhenCollapsed;
6060
}
6161

6262
log() {

0 commit comments

Comments
 (0)