chore(grid-lite): bump to latest & enable adoptRootStyles by default (#16921)

Author: damyanpetev

package-lock.json

@@ -126,7 +126,7 @@
     "hammerjs": "^2.0.8",
     "ig-typedoc-theme": "^7.0.1",
     "igniteui-dockmanager": "^1.17.0",
-    "igniteui-grid-lite": "~0.4.0",
+    "igniteui-grid-lite": "~0.5.0",
     "igniteui-i18n-resources": "^1.0.2",
     "igniteui-sassdoc-theme": "^2.1.0",
     "igniteui-webcomponents": "^6.5.0",

package.json

@@ -44,7 +44,8 @@ class IgxGridLite<T extends object = any> extends IgcGridLite<T> {
         '[sortingOptions]': "sortingOptions()",
         '[dataPipelineConfiguration]': "dataPipelineConfiguration()",
         '(sorted)': "onSorted($any($event))",
-        '(filtered)': "onFiltered($any($event))"
+        '(filtered)': "onFiltered($any($event))",
+        'adopt-root-styles': '',
     },
     template: `<ng-content></ng-content>`
 })

projects/igniteui-angular/grids/lite/src/grid-lite.component.ts

@@ -87,7 +87,7 @@
         "hammerjs": "^2.0.8",
         "@types/hammerjs": "^2.0.46",
         "igniteui-webcomponents": "^6.5.0",
-        "igniteui-grid-lite": "~0.4.0"
+        "igniteui-grid-lite": "~0.5.0"
     },
     "peerDependenciesMeta": {
         "hammerjs": {

projects/igniteui-angular/package.json

@@ -50,7 +50,7 @@
       let-column="column"
       let-parent="parent"
     >
-      <div>Cell {{value}}</div>
+      <igx-checkbox [checked]="value" readonly>Cell {{value}}</igx-checkbox>
     </ng-template>
   </igx-grid-lite-column>
 </igx-grid-lite>

src/app/grid-lite/grid-lite.sample.html

@@ -1,12 +1,13 @@
 import { Component, CUSTOM_ELEMENTS_SCHEMA, inject, viewChild } from '@angular/core';
 import { IgxGridLiteCellTemplateDirective, IgxGridLiteColumnComponent, IgxGridLiteComponent, IgxGridLiteFilteringExpression, IgxGridLiteHeaderTemplateDirective, IgxGridLiteSortingExpression, IgxGridLiteSortingOptions } from "igniteui-angular/grids/lite";
 import { GridLiteDataService } from './data.service';
+import { IgxCheckboxComponent } from 'igniteui-angular';
 @Component({
     selector: 'app-grid-lite-sample',
     templateUrl: 'grid-lite.sample.html',
     styleUrls: ['grid-lite.sample.scss'],
     schemas: [CUSTOM_ELEMENTS_SCHEMA],
-    imports: [IgxGridLiteComponent, IgxGridLiteColumnComponent, IgxGridLiteHeaderTemplateDirective, IgxGridLiteCellTemplateDirective]
+    imports: [IgxCheckboxComponent, IgxGridLiteComponent, IgxGridLiteColumnComponent, IgxGridLiteHeaderTemplateDirective, IgxGridLiteCellTemplateDirective]
 })
 export class GridLiteSampleComponent {
     protected grid = viewChild<IgxGridLiteComponent<any>>('grid');