Merge branch '19.2.x' into mpopov/fix-input-label-position-19-2

Author: desig9stein

projects/igniteui-angular/src/lib/core/styles/components/column-actions/_column-actions-theme.scss

@@ -100,7 +100,7 @@
 
     %column-actions-input {
         font-size: rem(16px) !important;
-        margin: rem(-16px) 0 0 !important;
+        margin: 0 !important;
         padding: rem(8px) rem(16px);
     }
 

projects/igniteui-angular/src/lib/core/styles/components/combo/_combo-theme.scss

@@ -263,6 +263,13 @@
                 padding: 0;
             }
         }
+
+        &:not(.igx-input-group--disabled){
+          %igx-combo__clear-button {
+                color: var-get($theme, 'clear-button-foreground');
+                background: var-get($theme, 'clear-button-background');
+            }
+        }
     }
 
     %form-group-bundle:not(%form-group-bundle--disabled):focus-within {

projects/igniteui-angular/src/lib/core/styles/components/input/_input-group-theme.scss

@@ -492,12 +492,23 @@
                     }
                 }
             }
+
+            &:not(%form-group-display--focused, %form-group-display--filled) {
+                &:has(input:not(:placeholder-shown, [type='file'])) {
+                    %form-group-label {
+                        @include type-style('subtitle-1');
+                        transform: translateY(0);
+                    }
+                }
+            }
         }
     }
 
     %form-group-placeholder {
-        %form-group-label {
-            transition: none !important;
+        &:has(input:placeholder-shown, textarea:placeholder-shown) { 
+            %form-group-label {
+                transition: none !important;
+            }
         }
     }
 
@@ -998,13 +1009,20 @@
 
     %form-group-label--focused-border,
     %form-group-label--filled-border,
-    %form-group-label--placeholder-border,
     %form-group-label--file-border {
         %igx-input-group__notch {
             border-block-start-color: transparent !important;
         }
     }
 
+    %form-group-label--placeholder-border {
+        &:has(input:placeholder-shown, textarea:placeholder-shown) {
+            %igx-input-group__notch {
+                border-block-start-color: transparent !important;
+            }
+        }
+    }
+
     %form-group-label--focused-border {
         %form-group-bundle-start {
             border-inline-start-width: rem(2px);
@@ -1099,6 +1117,26 @@
                 width: calc(100% - #{rem(2px)});
             }
         }
+
+        %textarea-group:not(%form-group-display--focused, %form-group-display--filled) {
+            &:has(textarea:not(:placeholder-shown)) {
+                %form-group-textarea-label:not(%textarea-group-label--focused) {
+                    @include type-style('subtitle-1');
+
+                    top: calc($input-top-padding - #{rem(3px)});
+                    transform: translateY(0);
+                    margin-bottom: auto;
+                }
+            }
+        }
+
+        %textarea-group:not(%form-group-display--focused, %form-group-display--filled) {
+            &:has(%form-group-display--border, textarea:not(:placeholder-shown)) {
+                %igx-input-group__notch {
+                    border-block-start-width: rem(1px);
+                }
+            }
+        }
     }
 
     %form-group-textarea-group-bundle {

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

@@ -27,7 +27,7 @@ import { QueryBuilderFunctions } from '../../query-builder/query-builder-functio
 import { By } from '@angular/platform-browser';
 import { IgxDateTimeEditorDirective } from '../../directives/date-time-editor/date-time-editor.directive';
 import { QueryBuilderSelectors } from '../../query-builder/query-builder.common';
-import { IgxHGridRemoteOnDemandComponent } from '../hierarchical-grid/hierarchical-grid.spec';
+import { IgxHGridRemoteOnDemandComponent, IgxHierarchicalGridMissingChildDataComponent } from '../hierarchical-grid/hierarchical-grid.spec';
 import { IGridResourceStrings } from '../../core/i18n/grid-resources';
 
 describe('IgxGrid - Advanced Filtering #grid - ', () => {
@@ -1899,6 +1899,19 @@ describe('IgxGrid - Advanced Filtering #grid - ', () => {
             expect(Array.from(operatorSelect.querySelectorAll('igx-select-item')).pop().textContent).toBe('My Not In');
         }));
     });
+
+    it('Should not throw an error when some child data is missing.', fakeAsync(() => {
+        const fixture = TestBed.createComponent(IgxHierarchicalGridMissingChildDataComponent);
+        const hierarchicalGrid = fixture.componentInstance.hGrid;
+        hierarchicalGrid.allowAdvancedFiltering = true;
+        fixture.detectChanges();
+
+        // Open Advanced Filtering dialog.
+        expect(() => {
+            hierarchicalGrid.openAdvancedFilteringDialog();
+            fixture.detectChanges();
+        }).not.toThrow();
+    }));
 });
 
 

projects/igniteui-angular/src/lib/grids/hierarchical-grid/hierarchical-grid.component.ts

@@ -1256,7 +1256,9 @@ export class IgxHierarchicalGridComponent extends IgxHierarchicalGridBaseDirecti
             ];
 
             entities[0].childEntities = this.childLayoutList.reduce((acc, rowIsland) => {
-                return acc.concat(this.generateChildEntity(rowIsland, this.data[0][rowIsland.key][0]));
+                const childFirstRowData = this.data?.length > 0 && this.data[0][rowIsland.key]?.length > 0 ?
+                    this.data[0][rowIsland.key][0] : null;
+                return acc.concat(this.generateChildEntity(rowIsland, childFirstRowData));
             }
             , []);
         }
@@ -1289,7 +1291,9 @@ export class IgxHierarchicalGridComponent extends IgxHierarchicalGridBaseDirecti
             if (!firstRowData) {
                 return null;
             }
-            return acc.concat(this.generateChildEntity(childRowIsland, firstRowData[childRowIsland.key][0]));
+            const childFirstRowData = firstRowData.length > 0 && firstRowData[childRowIsland.key]?.length > 0 ?
+                firstRowData[childRowIsland.key][0] : null;
+            return acc.concat(this.generateChildEntity(childRowIsland, childFirstRowData));
         }, []);
 
         if (rowIslandChildEntities?.length > 0) {

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

@@ -2477,3 +2477,31 @@ export class IgxHierarchicalGridEmptyTemplateComponent extends IgxHierarchicalGr
         this.childGridRef = grid;
     }
 }
+
+@Component({
+    template: `
+    <igx-hierarchical-grid #hGrid [data]="data" [autoGenerate]="false"
+        [height]="'400px'" [width]="'500px'">
+        <igx-column field="root1" [dataType]="'number'"></igx-column>
+        <igx-column field="root2" [dataType]="'number'"></igx-column>
+        <igx-row-island [key]="'level1data'" [autoGenerate]="false">
+            <igx-column field="level1child1" [dataType]="'number'"></igx-column>
+            <igx-column field="level1child2" [dataType]="'number'"></igx-column>
+            <igx-row-island [key]="'level2data'" [autoGenerate]="false">
+                <igx-column field="level2child1" [dataType]="'number'"></igx-column>
+                <igx-column field="level2child2" [dataType]="'number'"></igx-column>
+            </igx-row-island>
+        </igx-row-island>
+    </igx-hierarchical-grid>`,
+    imports: [IgxHierarchicalGridComponent, IgxColumnComponent, IgxRowIslandComponent]
+})
+export class IgxHierarchicalGridMissingChildDataComponent {
+    @ViewChild('hGrid', { read: IgxHierarchicalGridComponent, static: true })
+    public hGrid: IgxHierarchicalGridComponent;
+
+    public data = [
+        { root1: 1, root2: 1, level1data: [{ level1child1: 11, level1child2: 12 }] }, // missing level2data
+        { root1: 2, root2: 2, level1data: [{ level1child1: 21, level1child2: 22, level2data: [{ level2child1: 31, level2child2: 32 }] }] },
+        { root1: 3, root2: 3, level1data: [] }
+    ];
+}