diff --git a/projects/components/src/public-api.ts b/projects/components/src/public-api.ts
index cbdafa48e..ce20398ed 100644
--- a/projects/components/src/public-api.ts
+++ b/projects/components/src/public-api.ts
@@ -312,6 +312,7 @@ export { TableCellParser } from './table/cells/table-cell-parser';
 export * from './table/cells/data-parsers/table-cell-no-op-parser';
 export * from './table/cells/data-parsers/table-cell-string-parser';
 export * from './table/cells/data-parsers/table-cell-timestamp-parser';
+export * from './table/cells/data-renderers/string-array-with-x-more-table-cell-renderer/string-array-with-x-more-table-cell-renderer.component'
 
 // Table Controls
 export * from './table/controls/table-controls.module';
diff --git a/projects/components/src/table/cells/data-renderers/string-array/string-array-table-cell-renderer.component.scss b/projects/components/src/table/cells/data-renderers/string-array-with-x-more-table-cell-renderer/string-array-with-x-more-table-cell-renderer.component.scss
similarity index 81%
rename from projects/components/src/table/cells/data-renderers/string-array/string-array-table-cell-renderer.component.scss
rename to projects/components/src/table/cells/data-renderers/string-array-with-x-more-table-cell-renderer/string-array-with-x-more-table-cell-renderer.component.scss
index f80b3d83f..88d0acf65 100644
--- a/projects/components/src/table/cells/data-renderers/string-array/string-array-table-cell-renderer.component.scss
+++ b/projects/components/src/table/cells/data-renderers/string-array-with-x-more-table-cell-renderer/string-array-with-x-more-table-cell-renderer.component.scss
@@ -3,15 +3,14 @@
 
 .string-array-cell {
   display: flex;
-  flex-direction: row;
   align-items: center;
 
-  .first-item {
+  .item {
     @include ellipsis-overflow();
     padding-right: 8px;
   }
 
-  .summary-text {
+  .tooltip-item {
     padding: 0 6px;
     background-color: $gray-2;
     border-radius: 4px;
diff --git a/projects/components/src/table/cells/data-renderers/string-array-with-x-more-table-cell-renderer/string-array-with-x-more-table-cell-renderer.component.test.ts b/projects/components/src/table/cells/data-renderers/string-array-with-x-more-table-cell-renderer/string-array-with-x-more-table-cell-renderer.component.test.ts
new file mode 100644
index 000000000..e5be6dbf4
--- /dev/null
+++ b/projects/components/src/table/cells/data-renderers/string-array-with-x-more-table-cell-renderer/string-array-with-x-more-table-cell-renderer.component.test.ts
@@ -0,0 +1,50 @@
+import { FormattingModule } from '@hypertrace/common';
+import { TableCellNoOpParser, XMoreComponent } from '@hypertrace/components';
+import { createComponentFactory } from '@ngneat/spectator/jest';
+import { MockComponent } from 'ng-mocks';
+import { tableCellDataProvider, tableCellProviders } from '../../test/cell-providers';
+import { StringArrayWithXMore, StringArrayWithXMoreTableCellRendererComponent } from './string-array-with-x-more-table-cell-renderer.component';
+
+describe('String array table cell renderer component', () => {
+  const buildComponent = createComponentFactory({
+    component: StringArrayWithXMoreTableCellRendererComponent,
+    imports: [FormattingModule],
+    providers: [
+      tableCellProviders(
+        {
+          id: 'test'
+        },
+        new TableCellNoOpParser(undefined!)
+      )
+    ],
+    declarations: [MockComponent(XMoreComponent)],
+    shallow: true
+  });
+
+  test('should render array with multiple items as expected', () => {
+    
+    const cellData: StringArrayWithXMore = {
+      items: ['first-item', 'second-item', 'third-item'], 
+      maxToShow: 2
+    }
+    const spectator = buildComponent({
+      providers: [tableCellDataProvider(cellData)]
+    });
+
+    expect(spectator.queryAll('.item').length).toEqual(cellData.maxToShow);
+    expect(spectator.query(XMoreComponent)?.count).toEqual(1);
+  });
+
+  test('should render array with no item as expected', () => {
+    
+    const cellData: StringArrayWithXMore = {
+      items: [], 
+      maxToShow: 2
+    }
+    const spectator = buildComponent({
+      providers: [tableCellDataProvider(cellData)]
+    });
+
+    expect(spectator.query('.empty-cell')).toExist();
+  });
+});
diff --git a/projects/components/src/table/cells/data-renderers/string-array-with-x-more-table-cell-renderer/string-array-with-x-more-table-cell-renderer.component.ts b/projects/components/src/table/cells/data-renderers/string-array-with-x-more-table-cell-renderer/string-array-with-x-more-table-cell-renderer.component.ts
new file mode 100644
index 000000000..54937794d
--- /dev/null
+++ b/projects/components/src/table/cells/data-renderers/string-array-with-x-more-table-cell-renderer/string-array-with-x-more-table-cell-renderer.component.ts
@@ -0,0 +1,48 @@
+import { ChangeDetectionStrategy, Component, OnInit } from '@angular/core';
+import { TableCellRenderer } from '../../table-cell-renderer';
+import { TableCellRendererBase } from '../../table-cell-renderer-base';
+import { CoreTableCellParserType } from '../../types/core-table-cell-parser-type';
+import { CoreTableCellRendererType } from '../../types/core-table-cell-renderer-type';
+import { TableCellAlignmentType } from '../../types/table-cell-alignment-type';
+
+@Component({
+  selector: 'ht-string-array-with-x-more-table-cell-renderer',
+  styleUrls: ['./string-array-with-x-more-table-cell-renderer.component.scss'],
+  changeDetection: ChangeDetectionStrategy.OnPush,
+  template: `
+    <div class="string-array-cell" *ngIf="this.value.items.length>0; else empty">
+      <div class="item" *ngFor="let item of this.value.items | slice: 0:this.value.maxToShow">
+        {{ item }}
+      </div>
+      <ht-x-more
+        class="rem-items"
+        [count]="this.value.items.length - this.value.maxToShow"
+        [tooltip]="summaryTooltip"
+      ></ht-x-more>
+      <ng-template #summaryTooltip>
+        <div class="tooltip-container">
+          <div
+            class="tooltip-item"
+            *ngFor="let item of this.value.items | slice: this.value.maxToShow:this.value.items.length"
+          >
+            {{ item }}
+          </div>
+        </div>
+      </ng-template>
+    </div>
+    <ng-template #empty>
+      <span class='empty-cell'>-</span>
+    </ng-template>
+  `
+})
+@TableCellRenderer({
+  type: CoreTableCellRendererType.StringArrayWithXMore,
+  alignment: TableCellAlignmentType.Left,
+  parser: CoreTableCellParserType.NoOp
+})
+export class StringArrayWithXMoreTableCellRendererComponent extends TableCellRendererBase<StringArrayWithXMore> implements OnInit {}
+
+export interface StringArrayWithXMore{
+  items: string[];
+  maxToShow: number;
+}
\ No newline at end of file
diff --git a/projects/components/src/table/cells/data-renderers/string-array/string-array-table-cell-renderer.component.test.ts b/projects/components/src/table/cells/data-renderers/string-array/string-array-table-cell-renderer.component.test.ts
deleted file mode 100644
index b7071769c..000000000
--- a/projects/components/src/table/cells/data-renderers/string-array/string-array-table-cell-renderer.component.test.ts
+++ /dev/null
@@ -1,49 +0,0 @@
-import { FormattingModule } from '@hypertrace/common';
-import { TableCellNoOpParser } from '@hypertrace/components';
-import { createComponentFactory } from '@ngneat/spectator/jest';
-import { tableCellDataProvider, tableCellProviders } from '../../test/cell-providers';
-import { StringArrayTableCellRendererComponent } from './string-array-table-cell-renderer.component';
-
-describe('String array table cell renderer component', () => {
-  const buildComponent = createComponentFactory({
-    component: StringArrayTableCellRendererComponent,
-    imports: [FormattingModule],
-    providers: [
-      tableCellProviders(
-        {
-          id: 'test'
-        },
-        new TableCellNoOpParser(undefined!)
-      )
-    ],
-
-    shallow: true
-  });
-
-  test('should render an array with one item as expected', () => {
-    const spectator = buildComponent({
-      providers: [tableCellDataProvider(['first-item'])]
-    });
-
-    expect(spectator.query('.first-item')).toHaveText('first-item');
-    expect(spectator.query('.summary-text')).toHaveText('');
-  });
-
-  test('should render an empty array as expected', () => {
-    const spectator = buildComponent({
-      providers: [tableCellDataProvider([])]
-    });
-
-    expect(spectator.query('.first-item')).toHaveText('-');
-    expect(spectator.query('.summary-text')).toHaveText('');
-  });
-
-  test('should render array with multiple items as expected', () => {
-    const spectator = buildComponent({
-      providers: [tableCellDataProvider(['first-item', 'second-item', 'third-item'])]
-    });
-
-    expect(spectator.query('.first-item')).toHaveText('first-item');
-    expect(spectator.query('.summary-text')).toHaveText('+2');
-  });
-});
diff --git a/projects/components/src/table/cells/data-renderers/string-array/string-array-table-cell-renderer.component.ts b/projects/components/src/table/cells/data-renderers/string-array/string-array-table-cell-renderer.component.ts
deleted file mode 100644
index 996b2a676..000000000
--- a/projects/components/src/table/cells/data-renderers/string-array/string-array-table-cell-renderer.component.ts
+++ /dev/null
@@ -1,57 +0,0 @@
-import { ChangeDetectionStrategy, Component, Inject, OnInit } from '@angular/core';
-import { TableColumnConfig, TableRow } from '../../../table-api';
-import {
-  TABLE_CELL_DATA,
-  TABLE_COLUMN_CONFIG,
-  TABLE_COLUMN_INDEX,
-  TABLE_DATA_PARSER,
-  TABLE_ROW_DATA
-} from '../../table-cell-injection';
-import { TableCellParserBase } from '../../table-cell-parser-base';
-import { TableCellRenderer } from '../../table-cell-renderer';
-import { TableCellRendererBase } from '../../table-cell-renderer-base';
-import { CoreTableCellParserType } from '../../types/core-table-cell-parser-type';
-import { CoreTableCellRendererType } from '../../types/core-table-cell-renderer-type';
-import { TableCellAlignmentType } from '../../types/table-cell-alignment-type';
-
-@Component({
-  selector: 'ht-string-array-table-cell-renderer',
-  styleUrls: ['./string-array-table-cell-renderer.component.scss'],
-  changeDetection: ChangeDetectionStrategy.OnPush,
-  template: `
-    <div class="string-array-cell" [htTooltip]="summaryTooltip">
-      <span class="first-item">{{ this.firstItem | htDisplayString }}</span>
-      <span class="summary-text">{{ this.summaryText }}</span>
-
-      <ng-template #summaryTooltip>
-        <div *ngFor="let value of this.value">{{ value }}</div>
-      </ng-template>
-    </div>
-  `
-})
-@TableCellRenderer({
-  type: CoreTableCellRendererType.StringArray,
-  alignment: TableCellAlignmentType.Left,
-  parser: CoreTableCellParserType.NoOp
-})
-export class StringArrayTableCellRendererComponent extends TableCellRendererBase<string[]> implements OnInit {
-  public firstItem!: string;
-  public summaryText!: string;
-
-  public constructor(
-    @Inject(TABLE_COLUMN_CONFIG) columnConfig: TableColumnConfig,
-    @Inject(TABLE_COLUMN_INDEX) index: number,
-    @Inject(TABLE_DATA_PARSER) parser: TableCellParserBase<string[], string[], unknown>,
-    @Inject(TABLE_CELL_DATA) cellData: string[],
-    @Inject(TABLE_ROW_DATA) rowData: TableRow
-  ) {
-    super(columnConfig, index, parser, cellData, rowData);
-  }
-
-  public ngOnInit(): void {
-    super.ngOnInit();
-
-    this.firstItem = this.value[0];
-    this.summaryText = this.value.length > 1 ? `+${this.value.length - 1}` : '';
-  }
-}
diff --git a/projects/components/src/table/cells/table-cells.module.ts b/projects/components/src/table/cells/table-cells.module.ts
index 4dfed1580..e46ca0db2 100644
--- a/projects/components/src/table/cells/table-cells.module.ts
+++ b/projects/components/src/table/cells/table-cells.module.ts
@@ -9,6 +9,7 @@ import { FilterButtonModule } from '../../filtering/filter-button/filter-button.
 import { FilterModalModule } from '../../filtering/filter-modal/filter-modal.module';
 import { IconModule } from '../../icon/icon.module';
 import { PopoverModule } from '../../popover/popover.module';
+import { XMoreModule } from '../../public-api';
 import { TooltipModule } from '../../tooltip/tooltip.module';
 import { TableHeaderCellRendererComponent } from '../header/table-header-cell-renderer.component';
 import { TableCellBooleanParser } from './data-parsers/table-cell-boolean-parser';
@@ -22,7 +23,7 @@ import { StringEnumTableCellRendererComponent } from './data-renderers/enum/stri
 import { IconTableCellRendererComponent } from './data-renderers/icon/icon-table-cell-renderer.component';
 import { NumericTableCellRendererComponent } from './data-renderers/numeric/numeric-table-cell-renderer.component';
 import { RelativeTimestampTableCellRendererComponent } from './data-renderers/relative-timestamp/relative-timestamp-table-cell-renderer.component';
-import { StringArrayTableCellRendererComponent } from './data-renderers/string-array/string-array-table-cell-renderer.component';
+import { StringArrayWithXMoreTableCellRendererComponent } from './data-renderers/string-array-with-x-more-table-cell-renderer/string-array-with-x-more-table-cell-renderer.component';
 import { TableDataCellRendererComponent } from './data-renderers/table-data-cell-renderer.component';
 import { TextWithCopyActionTableCellRendererComponent } from './data-renderers/text-with-copy/text-with-copy-table-cell-renderer.component';
 import { TextTableCellRendererComponent } from './data-renderers/text/text-table-cell-renderer.component';
@@ -52,7 +53,8 @@ export const TABLE_CELL_PARSERS = new InjectionToken<unknown[][]>('TABLE_CELL_PA
     FilterButtonModule,
     FilterModalModule,
     PopoverModule,
-    CopyToClipboardModule
+    CopyToClipboardModule,
+    XMoreModule,
   ],
   exports: [
     TableHeaderCellRendererComponent,
@@ -71,7 +73,7 @@ export const TABLE_CELL_PARSERS = new InjectionToken<unknown[][]>('TABLE_CELL_PA
     TimestampTableCellRendererComponent,
     TimeAgoTableCellRendererComponent,
     CodeTableCellRendererComponent,
-    StringArrayTableCellRendererComponent,
+    StringArrayWithXMoreTableCellRendererComponent,
     StringEnumTableCellRendererComponent,
     TextWithCopyActionTableCellRendererComponent,
     RelativeTimestampTableCellRendererComponent
@@ -88,7 +90,7 @@ export const TABLE_CELL_PARSERS = new InjectionToken<unknown[][]>('TABLE_CELL_PA
         TimestampTableCellRendererComponent,
         TimeAgoTableCellRendererComponent,
         CodeTableCellRendererComponent,
-        StringArrayTableCellRendererComponent,
+        StringArrayWithXMoreTableCellRendererComponent,
         StringEnumTableCellRendererComponent,
         TextWithCopyActionTableCellRendererComponent,
         RelativeTimestampTableCellRendererComponent
diff --git a/projects/components/src/table/cells/types/core-table-cell-renderer-type.ts b/projects/components/src/table/cells/types/core-table-cell-renderer-type.ts
index 2917244bc..b873d76d0 100644
--- a/projects/components/src/table/cells/types/core-table-cell-renderer-type.ts
+++ b/projects/components/src/table/cells/types/core-table-cell-renderer-type.ts
@@ -5,7 +5,7 @@ export const enum CoreTableCellRendererType {
   Number = 'number',
   RowExpander = 'row-expander',
   RelativeTimestamp = 'relative-timestamp',
-  StringArray = 'string-array',
+  StringArrayWithXMore = 'string-array-with-x-more',
   StringEnum = 'string-enum',
   Text = 'text',
   TextWithCopyAction = 'text-with-copy-action',