Merge pull request #24 from IgniteUI/mpopov/fix-add-cell-ellipsis

fix(cell): Apply ellipsis styling for cell text

Author: zdrawku

src/components/cell.ts

@@ -56,7 +56,9 @@ export default class IgcGridLiteCell<T extends object> extends LitElement {
 
   protected override render() {
     return html`${cache(
-      this.column.cellTemplate ? this.column.cellTemplate(this.context as any) : html`${this.value}`
+      this.column.cellTemplate
+        ? this.column.cellTemplate(this.context as any)
+        : html`<span part="text">${this.value}</span>`
     )}`;
   }
 }

src/styles/body-cell/body-cell.scss

@@ -31,6 +31,12 @@ $inset-shadow-width: #{rem(1px)};
     border-inline-end: none;
 }
 
+[part~="text"] {
+	text-overflow: ellipsis;
+	overflow: hidden;
+	white-space: nowrap;
+}
+
 igc-input {
 	position: absolute;
 	left: 0;