From f9084d7a8c572edfe07862c0cdbb3ae5621a0501 Mon Sep 17 00:00:00 2001
From: Alla Doroshkevych <alla.doroshkevych@oracle.com>
Date: Fri, 29 Mar 2024 15:23:54 -0400
Subject: [PATCH 1/3] no row headers if list has only one semantic column

---
 .../CHANGELOG.md                              |   3 +
 .../src/CompactInteractiveList.jsx            |   3 +-
 .../jest/CompactInteractiveList.test.jsx      | 147 +++-
 .../CompactInteractiveList.test.jsx.snap      | 631 ++++++++++++++++++
 4 files changed, 781 insertions(+), 3 deletions(-)

diff --git a/packages/terra-compact-interactive-list/CHANGELOG.md b/packages/terra-compact-interactive-list/CHANGELOG.md
index 9e57ab1a1a8..d3a95454f5e 100644
--- a/packages/terra-compact-interactive-list/CHANGELOG.md
+++ b/packages/terra-compact-interactive-list/CHANGELOG.md
@@ -2,6 +2,9 @@
 
 ## Unreleased
 
+* Changed
+  * Updated to have no row headers if list has only one semantic column.
+
 ## 1.14.0 - (March 29, 2024)
 
 * Changed
diff --git a/packages/terra-compact-interactive-list/src/CompactInteractiveList.jsx b/packages/terra-compact-interactive-list/src/CompactInteractiveList.jsx
index 372d93464de..b0fde6c77df 100644
--- a/packages/terra-compact-interactive-list/src/CompactInteractiveList.jsx
+++ b/packages/terra-compact-interactive-list/src/CompactInteractiveList.jsx
@@ -110,6 +110,7 @@ const propTypes = {
 
   /**
    * A zero-based index indicating which column represents the row header.
+   * Omitted if there is only one semantic column in the list, in this case the list will have no row headers.
    */
   rowHeaderIndex: validateRowHeaderIndex,
 
@@ -340,7 +341,7 @@ const CompactInteractiveList = (props) => {
             rowHeight={calculatedRowHeight}
             isTopmost={checkIfRowIsTopMost(index)}
             isLeftmost={checkIfRowIsLeftMost(index)}
-            rowHeaderIndex={rowHeaderIndex}
+            rowHeaderIndex={columns?.length > 1 ? rowHeaderIndex : undefined}
             hasVisibleBorders={hasVisibleBorders}
           />
         ))}
diff --git a/packages/terra-compact-interactive-list/tests/jest/CompactInteractiveList.test.jsx b/packages/terra-compact-interactive-list/tests/jest/CompactInteractiveList.test.jsx
index f414115ef91..a353a5c7b87 100644
--- a/packages/terra-compact-interactive-list/tests/jest/CompactInteractiveList.test.jsx
+++ b/packages/terra-compact-interactive-list/tests/jest/CompactInteractiveList.test.jsx
@@ -499,7 +499,7 @@ describe('Compact Interactive List', () => {
     });
   });
 
-  describe('Keyboard navigation, vertical flow', () => {
+  describe('keyboard navigation, vertical flow', () => {
     const cols = [
       {
         id: 'Column-0',
@@ -723,7 +723,7 @@ describe('Compact Interactive List', () => {
     });
   });
 
-  describe('Keyboard navigation, horizontal flow', () => {
+  describe('keyboard navigation, horizontal flow', () => {
     const cols = [
       {
         id: 'Column-0',
@@ -1087,4 +1087,147 @@ describe('Compact Interactive List', () => {
       expect(mockOnCellSelect).not.toHaveBeenCalled();
     });
   });
+
+  describe('row headers', () => {
+    const cols = [
+      {
+        id: 'Column-0',
+        displayName: 'Col_1',
+        width: '40px',
+        minimumWidth: '20px',
+      },
+      {
+        id: 'Column-1',
+        displayName: 'Col_2',
+        width: '200px',
+        maximumWidth: '300px',
+      },
+      {
+        id: 'Column-2',
+        displayName: 'Col_3',
+        width: '40px',
+      },
+    ];
+
+    const singleColRows = [
+      {
+        id: 'row_1',
+        cells: [{ content: 'Discern Care Set (1)' }],
+      },
+      {
+        id: 'row_2',
+        cells: [{ content: 'Initial observation Care/Day High Severity 99220 (2)' }],
+      },
+      {
+        id: 'row_3',
+        cells: [{ content: 'Arterial Sheath Care (3)' }],
+      },
+      {
+        id: 'row_4',
+        cells: [{ content: 'Sbsq Observation Care/Day High Severity 99226 (4)' }],
+      },
+      {
+        id: 'row_5',
+        cells: [{ content: 'Arterial Sheath Care (5)' }],
+      },
+    ];
+
+    const singleCol = [
+      {
+        id: 'Column-0',
+        displayName: 'Col_1',
+        width: '40px',
+      },
+    ];
+
+    it('list with one column should match a snapshot', () => {
+      const wrapper = enzymeIntl.mountWithIntl(
+        <CompactInteractiveList
+          id="compact-interactive-list-with-one-column"
+          rows={singleColRows}
+          columns={singleCol}
+        />,
+      );
+      expect(wrapper).toMatchSnapshot();
+    });
+
+    it('list with one column should have no cells with role rowheader', () => {
+      const wrapper = enzymeIntl.mountWithIntl(
+        <CompactInteractiveList
+          id="compact-interactive-list-with-one-column"
+          rows={singleColRows}
+          columns={singleCol}
+        />,
+      );
+      const rowElements = wrapper.find('.row');
+      const firstRowCellElements = rowElements.at(0).find('.cell');
+      expect(firstRowCellElements.length).toEqual(1);
+      expect(firstRowCellElements.at(0).prop('role')).toEqual('gridcell');
+      const secondRowCellElements = rowElements.at(1).find('.cell');
+      expect(secondRowCellElements.at(0).prop('role')).toEqual('gridcell');
+      const thirdRowCellElements = rowElements.at(2).find('.cell');
+      expect(thirdRowCellElements.at(0).prop('role')).toEqual('gridcell');
+    });
+
+    it('rowHeaderIndex prop should have no effect on list with one column', () => {
+      const wrapper = enzymeIntl.mountWithIntl(
+        <CompactInteractiveList
+          id="compact-interactive-list-with-one-column"
+          rows={singleColRows}
+          columns={singleCol}
+          rowHeaderIndex={0} // has no effect, no rowheader
+        />,
+      );
+      const rowElements = wrapper.find('.row');
+      const firstRowCellElements = rowElements.at(0).find('.cell');
+      expect(firstRowCellElements.length).toEqual(1);
+      expect(firstRowCellElements.at(0).prop('role')).toEqual('gridcell');
+      const secondRowCellElements = rowElements.at(1).find('.cell');
+      expect(secondRowCellElements.at(0).prop('role')).toEqual('gridcell');
+      const thirdRowCellElements = rowElements.at(2).find('.cell');
+      expect(thirdRowCellElements.at(0).prop('role')).toEqual('gridcell');
+    });
+
+    it('list with more than one column should default to fist cell being a rowheader', () => {
+      const wrapper = enzymeIntl.mountWithIntl(
+        <CompactInteractiveList
+          id="compact-interactive-list-with-more-than-one-column"
+          rows={rows}
+          columns={cols}
+          // no rowHeaderIndex prop should default to 0
+        />,
+      );
+      const rowElements = wrapper.find('.row');
+      const firstRowCellElements = rowElements.at(0).find('.cell');
+      expect(firstRowCellElements.at(0).prop('role')).toEqual('rowheader');
+      expect(firstRowCellElements.at(1).prop('role')).toEqual('gridcell');
+      const secondRowCellElements = rowElements.at(1).find('.cell');
+      expect(secondRowCellElements.at(0).prop('role')).toEqual('rowheader');
+      expect(secondRowCellElements.at(1).prop('role')).toEqual('gridcell');
+      const thirdRowCellElements = rowElements.at(2).find('.cell');
+      expect(thirdRowCellElements.at(0).prop('role')).toEqual('rowheader');
+      expect(thirdRowCellElements.at(1).prop('role')).toEqual('gridcell');
+    });
+
+    it('rowHeaderIndex prop should set a rowheader in lists with more than one column', () => {
+      const wrapper = enzymeIntl.mountWithIntl(
+        <CompactInteractiveList
+          id="compact-interactive-list-with-rowHeaderIndex"
+          rows={rows}
+          columns={cols}
+          rowHeaderIndex={1} // makes second cell is a rowheader
+        />,
+      );
+      const rowElements = wrapper.find('.row');
+      const firstRowCellElements = rowElements.at(0).find('.cell');
+      expect(firstRowCellElements.at(0).prop('role')).toEqual('gridcell');
+      expect(firstRowCellElements.at(1).prop('role')).toEqual('rowheader');
+      const secondRowCellElements = rowElements.at(1).find('.cell');
+      expect(secondRowCellElements.at(0).prop('role')).toEqual('gridcell');
+      expect(secondRowCellElements.at(1).prop('role')).toEqual('rowheader');
+      const thirdRowCellElements = rowElements.at(2).find('.cell');
+      expect(thirdRowCellElements.at(0).prop('role')).toEqual('gridcell');
+      expect(thirdRowCellElements.at(1).prop('role')).toEqual('rowheader');
+    });
+  });
 });
diff --git a/packages/terra-compact-interactive-list/tests/jest/__snapshots__/CompactInteractiveList.test.jsx.snap b/packages/terra-compact-interactive-list/tests/jest/__snapshots__/CompactInteractiveList.test.jsx.snap
index 33519a2e194..3dc5fbceef3 100644
--- a/packages/terra-compact-interactive-list/tests/jest/__snapshots__/CompactInteractiveList.test.jsx.snap
+++ b/packages/terra-compact-interactive-list/tests/jest/__snapshots__/CompactInteractiveList.test.jsx.snap
@@ -3076,3 +3076,634 @@ exports[`Compact Interactive List responsive columns should match a snapshot 1`]
   </CompactInteractiveList>
 </InjectIntl(CompactInteractiveList)>
 `;
+
+exports[`Compact Interactive List row headers list with one column should match a snapshot 1`] = `
+<InjectIntl(CompactInteractiveList)
+  columns={
+    Array [
+      Object {
+        "displayName": "Col_1",
+        "id": "Column-0",
+        "width": "40px",
+      },
+    ]
+  }
+  id="compact-interactive-list-with-one-column"
+  intl={
+    Object {
+      "defaultFormats": Object {},
+      "defaultLocale": "en",
+      "formatDate": [Function],
+      "formatHTMLMessage": [Function],
+      "formatMessage": [Function],
+      "formatNumber": [Function],
+      "formatPlural": [Function],
+      "formatRelative": [Function],
+      "formatTime": [Function],
+      "formats": Object {},
+      "formatters": Object {
+        "getDateTimeFormat": [Function],
+        "getMessageFormat": [Function],
+        "getNumberFormat": [Function],
+        "getPluralFormat": [Function],
+        "getRelativeFormat": [Function],
+      },
+      "locale": "en",
+      "messages": null,
+      "now": [Function],
+      "onError": [Function],
+      "textComponent": "span",
+      "timeZone": null,
+    }
+  }
+  rows={
+    Array [
+      Object {
+        "cells": Array [
+          Object {
+            "content": "Discern Care Set (1)",
+          },
+        ],
+        "id": "row_1",
+      },
+      Object {
+        "cells": Array [
+          Object {
+            "content": "Initial observation Care/Day High Severity 99220 (2)",
+          },
+        ],
+        "id": "row_2",
+      },
+      Object {
+        "cells": Array [
+          Object {
+            "content": "Arterial Sheath Care (3)",
+          },
+        ],
+        "id": "row_3",
+      },
+      Object {
+        "cells": Array [
+          Object {
+            "content": "Sbsq Observation Care/Day High Severity 99226 (4)",
+          },
+        ],
+        "id": "row_4",
+      },
+      Object {
+        "cells": Array [
+          Object {
+            "content": "Arterial Sheath Care (5)",
+          },
+        ],
+        "id": "row_5",
+      },
+    ]
+  }
+>
+  <CompactInteractiveList
+    columns={
+      Array [
+        Object {
+          "displayName": "Col_1",
+          "id": "Column-0",
+          "width": "40px",
+        },
+      ]
+    }
+    hasVisibleBorders={true}
+    id="compact-interactive-list-with-one-column"
+    intl={
+      Object {
+        "defaultFormats": Object {},
+        "defaultLocale": "en",
+        "formatDate": [Function],
+        "formatHTMLMessage": [Function],
+        "formatMessage": [Function],
+        "formatNumber": [Function],
+        "formatPlural": [Function],
+        "formatRelative": [Function],
+        "formatTime": [Function],
+        "formats": Object {},
+        "formatters": Object {
+          "getDateTimeFormat": [Function],
+          "getMessageFormat": [Function],
+          "getNumberFormat": [Function],
+          "getPluralFormat": [Function],
+          "getRelativeFormat": [Function],
+        },
+        "locale": "en",
+        "messages": null,
+        "now": [Function],
+        "onError": [Function],
+        "textComponent": "span",
+        "timeZone": null,
+      }
+    }
+    numberOfColumns={1}
+    rowHeaderIndex={0}
+    rows={
+      Array [
+        Object {
+          "cells": Array [
+            Object {
+              "content": "Discern Care Set (1)",
+            },
+          ],
+          "id": "row_1",
+        },
+        Object {
+          "cells": Array [
+            Object {
+              "content": "Initial observation Care/Day High Severity 99220 (2)",
+            },
+          ],
+          "id": "row_2",
+        },
+        Object {
+          "cells": Array [
+            Object {
+              "content": "Arterial Sheath Care (3)",
+            },
+          ],
+          "id": "row_3",
+        },
+        Object {
+          "cells": Array [
+            Object {
+              "content": "Sbsq Observation Care/Day High Severity 99226 (4)",
+            },
+          ],
+          "id": "row_4",
+        },
+        Object {
+          "cells": Array [
+            Object {
+              "content": "Arterial Sheath Care (5)",
+            },
+          ],
+          "id": "row_5",
+        },
+      ]
+    }
+    width="100%"
+  >
+    <div
+      className="compact-interactive-list-container"
+    >
+      <div
+        className="compact-interactive-list"
+        id="compact-interactive-list-with-one-column"
+        onFocus={[Function]}
+        onKeyDown={[Function]}
+        role="grid"
+        style={
+          Object {
+            "flexDirection": "column",
+            "height": "200px",
+            "width": "40px",
+          }
+        }
+        tabIndex={0}
+      >
+        <div
+          className="hidden"
+          role="row"
+        >
+          <span
+            key="Column-0"
+            role="columnheader"
+          >
+            Col_1
+          </span>
+        </div>
+        <Memo(Row)
+          cells={
+            Array [
+              Object {
+                "content": "Discern Care Set (1)",
+              },
+            ]
+          }
+          columnMinimumWidth={60}
+          columns={
+            Array [
+              Object {
+                "displayName": "Col_1",
+                "id": "Column-0",
+                "width": 40,
+              },
+            ]
+          }
+          hasVisibleBorders={true}
+          id="row_1"
+          isLeftmost={true}
+          isResponsive={false}
+          isTopmost={true}
+          key="row_1"
+          numberOfColumns={1}
+          rowHeight={
+            Object {
+              "unitType": "px",
+              "value": 40,
+            }
+          }
+          rowIndex={0}
+          rowMaximumWidth={null}
+          rowMinimumWidth={null}
+          rowWidth={40}
+          setFocusedCell={[Function]}
+          widthUnit="px"
+        >
+          <div
+            aria-hidden={null}
+            className="row row-topmost row-leftmost"
+            data-row-id="row_1"
+            id="row_1"
+            role="row"
+            style={
+              Object {
+                "height": "40px",
+                "width": "40px",
+              }
+            }
+          >
+            <Memo(Cell)
+              column={
+                Object {
+                  "displayName": "Col_1",
+                  "id": "Column-0",
+                  "width": 40,
+                }
+              }
+              columnMinimumWidth={60}
+              isRowHeader={false}
+              key="row-row_1-col-Column-0"
+              rowId="row_1"
+              setFocusedCell={[Function]}
+              widthUnit="px"
+            >
+              <div
+                className="cell"
+                onKeyDown={[Function]}
+                onMouseDown={[Function]}
+                role="gridcell"
+                style={
+                  Object {
+                    "justifyContent": "left",
+                    "textAlign": "left",
+                    "width": "40px",
+                  }
+                }
+                tabIndex={-1}
+              >
+                Discern Care Set (1)
+              </div>
+            </Memo(Cell)>
+          </div>
+        </Memo(Row)>
+        <Memo(Row)
+          cells={
+            Array [
+              Object {
+                "content": "Initial observation Care/Day High Severity 99220 (2)",
+              },
+            ]
+          }
+          columnMinimumWidth={60}
+          columns={
+            Array [
+              Object {
+                "displayName": "Col_1",
+                "id": "Column-0",
+                "width": 40,
+              },
+            ]
+          }
+          hasVisibleBorders={true}
+          id="row_2"
+          isLeftmost={true}
+          isResponsive={false}
+          isTopmost={false}
+          key="row_2"
+          numberOfColumns={1}
+          rowHeight={
+            Object {
+              "unitType": "px",
+              "value": 40,
+            }
+          }
+          rowIndex={1}
+          rowMaximumWidth={null}
+          rowMinimumWidth={null}
+          rowWidth={40}
+          setFocusedCell={[Function]}
+          widthUnit="px"
+        >
+          <div
+            aria-hidden={null}
+            className="row row-leftmost"
+            data-row-id="row_2"
+            id="row_2"
+            role="row"
+            style={
+              Object {
+                "height": "40px",
+                "width": "40px",
+              }
+            }
+          >
+            <Memo(Cell)
+              column={
+                Object {
+                  "displayName": "Col_1",
+                  "id": "Column-0",
+                  "width": 40,
+                }
+              }
+              columnMinimumWidth={60}
+              isRowHeader={false}
+              key="row-row_2-col-Column-0"
+              rowId="row_2"
+              setFocusedCell={[Function]}
+              widthUnit="px"
+            >
+              <div
+                className="cell"
+                onKeyDown={[Function]}
+                onMouseDown={[Function]}
+                role="gridcell"
+                style={
+                  Object {
+                    "justifyContent": "left",
+                    "textAlign": "left",
+                    "width": "40px",
+                  }
+                }
+                tabIndex={-1}
+              >
+                Initial observation Care/Day High Severity 99220 (2)
+              </div>
+            </Memo(Cell)>
+          </div>
+        </Memo(Row)>
+        <Memo(Row)
+          cells={
+            Array [
+              Object {
+                "content": "Arterial Sheath Care (3)",
+              },
+            ]
+          }
+          columnMinimumWidth={60}
+          columns={
+            Array [
+              Object {
+                "displayName": "Col_1",
+                "id": "Column-0",
+                "width": 40,
+              },
+            ]
+          }
+          hasVisibleBorders={true}
+          id="row_3"
+          isLeftmost={true}
+          isResponsive={false}
+          isTopmost={false}
+          key="row_3"
+          numberOfColumns={1}
+          rowHeight={
+            Object {
+              "unitType": "px",
+              "value": 40,
+            }
+          }
+          rowIndex={2}
+          rowMaximumWidth={null}
+          rowMinimumWidth={null}
+          rowWidth={40}
+          setFocusedCell={[Function]}
+          widthUnit="px"
+        >
+          <div
+            aria-hidden={null}
+            className="row row-leftmost"
+            data-row-id="row_3"
+            id="row_3"
+            role="row"
+            style={
+              Object {
+                "height": "40px",
+                "width": "40px",
+              }
+            }
+          >
+            <Memo(Cell)
+              column={
+                Object {
+                  "displayName": "Col_1",
+                  "id": "Column-0",
+                  "width": 40,
+                }
+              }
+              columnMinimumWidth={60}
+              isRowHeader={false}
+              key="row-row_3-col-Column-0"
+              rowId="row_3"
+              setFocusedCell={[Function]}
+              widthUnit="px"
+            >
+              <div
+                className="cell"
+                onKeyDown={[Function]}
+                onMouseDown={[Function]}
+                role="gridcell"
+                style={
+                  Object {
+                    "justifyContent": "left",
+                    "textAlign": "left",
+                    "width": "40px",
+                  }
+                }
+                tabIndex={-1}
+              >
+                Arterial Sheath Care (3)
+              </div>
+            </Memo(Cell)>
+          </div>
+        </Memo(Row)>
+        <Memo(Row)
+          cells={
+            Array [
+              Object {
+                "content": "Sbsq Observation Care/Day High Severity 99226 (4)",
+              },
+            ]
+          }
+          columnMinimumWidth={60}
+          columns={
+            Array [
+              Object {
+                "displayName": "Col_1",
+                "id": "Column-0",
+                "width": 40,
+              },
+            ]
+          }
+          hasVisibleBorders={true}
+          id="row_4"
+          isLeftmost={true}
+          isResponsive={false}
+          isTopmost={false}
+          key="row_4"
+          numberOfColumns={1}
+          rowHeight={
+            Object {
+              "unitType": "px",
+              "value": 40,
+            }
+          }
+          rowIndex={3}
+          rowMaximumWidth={null}
+          rowMinimumWidth={null}
+          rowWidth={40}
+          setFocusedCell={[Function]}
+          widthUnit="px"
+        >
+          <div
+            aria-hidden={null}
+            className="row row-leftmost"
+            data-row-id="row_4"
+            id="row_4"
+            role="row"
+            style={
+              Object {
+                "height": "40px",
+                "width": "40px",
+              }
+            }
+          >
+            <Memo(Cell)
+              column={
+                Object {
+                  "displayName": "Col_1",
+                  "id": "Column-0",
+                  "width": 40,
+                }
+              }
+              columnMinimumWidth={60}
+              isRowHeader={false}
+              key="row-row_4-col-Column-0"
+              rowId="row_4"
+              setFocusedCell={[Function]}
+              widthUnit="px"
+            >
+              <div
+                className="cell"
+                onKeyDown={[Function]}
+                onMouseDown={[Function]}
+                role="gridcell"
+                style={
+                  Object {
+                    "justifyContent": "left",
+                    "textAlign": "left",
+                    "width": "40px",
+                  }
+                }
+                tabIndex={-1}
+              >
+                Sbsq Observation Care/Day High Severity 99226 (4)
+              </div>
+            </Memo(Cell)>
+          </div>
+        </Memo(Row)>
+        <Memo(Row)
+          cells={
+            Array [
+              Object {
+                "content": "Arterial Sheath Care (5)",
+              },
+            ]
+          }
+          columnMinimumWidth={60}
+          columns={
+            Array [
+              Object {
+                "displayName": "Col_1",
+                "id": "Column-0",
+                "width": 40,
+              },
+            ]
+          }
+          hasVisibleBorders={true}
+          id="row_5"
+          isLeftmost={true}
+          isResponsive={false}
+          isTopmost={false}
+          key="row_5"
+          numberOfColumns={1}
+          rowHeight={
+            Object {
+              "unitType": "px",
+              "value": 40,
+            }
+          }
+          rowIndex={4}
+          rowMaximumWidth={null}
+          rowMinimumWidth={null}
+          rowWidth={40}
+          setFocusedCell={[Function]}
+          widthUnit="px"
+        >
+          <div
+            aria-hidden={null}
+            className="row row-leftmost"
+            data-row-id="row_5"
+            id="row_5"
+            role="row"
+            style={
+              Object {
+                "height": "40px",
+                "width": "40px",
+              }
+            }
+          >
+            <Memo(Cell)
+              column={
+                Object {
+                  "displayName": "Col_1",
+                  "id": "Column-0",
+                  "width": 40,
+                }
+              }
+              columnMinimumWidth={60}
+              isRowHeader={false}
+              key="row-row_5-col-Column-0"
+              rowId="row_5"
+              setFocusedCell={[Function]}
+              widthUnit="px"
+            >
+              <div
+                className="cell"
+                onKeyDown={[Function]}
+                onMouseDown={[Function]}
+                role="gridcell"
+                style={
+                  Object {
+                    "justifyContent": "left",
+                    "textAlign": "left",
+                    "width": "40px",
+                  }
+                }
+                tabIndex={-1}
+              >
+                Arterial Sheath Care (5)
+              </div>
+            </Memo(Cell)>
+          </div>
+        </Memo(Row)>
+      </div>
+    </div>
+  </CompactInteractiveList>
+</InjectIntl(CompactInteractiveList)>
+`;

From 76ce35a6f621e028bcd7d31645e48727199ca632 Mon Sep 17 00:00:00 2001
From: Alla Doroshkevych <alla.doroshkevych@oracle.com>
Date: Fri, 29 Mar 2024 16:28:36 -0400
Subject: [PATCH 2/3] removed snapshot

---
 .../jest/CompactInteractiveList.test.jsx      |  11 -
 .../CompactInteractiveList.test.jsx.snap      | 631 ------------------
 2 files changed, 642 deletions(-)

diff --git a/packages/terra-compact-interactive-list/tests/jest/CompactInteractiveList.test.jsx b/packages/terra-compact-interactive-list/tests/jest/CompactInteractiveList.test.jsx
index a353a5c7b87..1ce5a1f022a 100644
--- a/packages/terra-compact-interactive-list/tests/jest/CompactInteractiveList.test.jsx
+++ b/packages/terra-compact-interactive-list/tests/jest/CompactInteractiveList.test.jsx
@@ -1140,17 +1140,6 @@ describe('Compact Interactive List', () => {
       },
     ];
 
-    it('list with one column should match a snapshot', () => {
-      const wrapper = enzymeIntl.mountWithIntl(
-        <CompactInteractiveList
-          id="compact-interactive-list-with-one-column"
-          rows={singleColRows}
-          columns={singleCol}
-        />,
-      );
-      expect(wrapper).toMatchSnapshot();
-    });
-
     it('list with one column should have no cells with role rowheader', () => {
       const wrapper = enzymeIntl.mountWithIntl(
         <CompactInteractiveList
diff --git a/packages/terra-compact-interactive-list/tests/jest/__snapshots__/CompactInteractiveList.test.jsx.snap b/packages/terra-compact-interactive-list/tests/jest/__snapshots__/CompactInteractiveList.test.jsx.snap
index 3dc5fbceef3..33519a2e194 100644
--- a/packages/terra-compact-interactive-list/tests/jest/__snapshots__/CompactInteractiveList.test.jsx.snap
+++ b/packages/terra-compact-interactive-list/tests/jest/__snapshots__/CompactInteractiveList.test.jsx.snap
@@ -3076,634 +3076,3 @@ exports[`Compact Interactive List responsive columns should match a snapshot 1`]
   </CompactInteractiveList>
 </InjectIntl(CompactInteractiveList)>
 `;
-
-exports[`Compact Interactive List row headers list with one column should match a snapshot 1`] = `
-<InjectIntl(CompactInteractiveList)
-  columns={
-    Array [
-      Object {
-        "displayName": "Col_1",
-        "id": "Column-0",
-        "width": "40px",
-      },
-    ]
-  }
-  id="compact-interactive-list-with-one-column"
-  intl={
-    Object {
-      "defaultFormats": Object {},
-      "defaultLocale": "en",
-      "formatDate": [Function],
-      "formatHTMLMessage": [Function],
-      "formatMessage": [Function],
-      "formatNumber": [Function],
-      "formatPlural": [Function],
-      "formatRelative": [Function],
-      "formatTime": [Function],
-      "formats": Object {},
-      "formatters": Object {
-        "getDateTimeFormat": [Function],
-        "getMessageFormat": [Function],
-        "getNumberFormat": [Function],
-        "getPluralFormat": [Function],
-        "getRelativeFormat": [Function],
-      },
-      "locale": "en",
-      "messages": null,
-      "now": [Function],
-      "onError": [Function],
-      "textComponent": "span",
-      "timeZone": null,
-    }
-  }
-  rows={
-    Array [
-      Object {
-        "cells": Array [
-          Object {
-            "content": "Discern Care Set (1)",
-          },
-        ],
-        "id": "row_1",
-      },
-      Object {
-        "cells": Array [
-          Object {
-            "content": "Initial observation Care/Day High Severity 99220 (2)",
-          },
-        ],
-        "id": "row_2",
-      },
-      Object {
-        "cells": Array [
-          Object {
-            "content": "Arterial Sheath Care (3)",
-          },
-        ],
-        "id": "row_3",
-      },
-      Object {
-        "cells": Array [
-          Object {
-            "content": "Sbsq Observation Care/Day High Severity 99226 (4)",
-          },
-        ],
-        "id": "row_4",
-      },
-      Object {
-        "cells": Array [
-          Object {
-            "content": "Arterial Sheath Care (5)",
-          },
-        ],
-        "id": "row_5",
-      },
-    ]
-  }
->
-  <CompactInteractiveList
-    columns={
-      Array [
-        Object {
-          "displayName": "Col_1",
-          "id": "Column-0",
-          "width": "40px",
-        },
-      ]
-    }
-    hasVisibleBorders={true}
-    id="compact-interactive-list-with-one-column"
-    intl={
-      Object {
-        "defaultFormats": Object {},
-        "defaultLocale": "en",
-        "formatDate": [Function],
-        "formatHTMLMessage": [Function],
-        "formatMessage": [Function],
-        "formatNumber": [Function],
-        "formatPlural": [Function],
-        "formatRelative": [Function],
-        "formatTime": [Function],
-        "formats": Object {},
-        "formatters": Object {
-          "getDateTimeFormat": [Function],
-          "getMessageFormat": [Function],
-          "getNumberFormat": [Function],
-          "getPluralFormat": [Function],
-          "getRelativeFormat": [Function],
-        },
-        "locale": "en",
-        "messages": null,
-        "now": [Function],
-        "onError": [Function],
-        "textComponent": "span",
-        "timeZone": null,
-      }
-    }
-    numberOfColumns={1}
-    rowHeaderIndex={0}
-    rows={
-      Array [
-        Object {
-          "cells": Array [
-            Object {
-              "content": "Discern Care Set (1)",
-            },
-          ],
-          "id": "row_1",
-        },
-        Object {
-          "cells": Array [
-            Object {
-              "content": "Initial observation Care/Day High Severity 99220 (2)",
-            },
-          ],
-          "id": "row_2",
-        },
-        Object {
-          "cells": Array [
-            Object {
-              "content": "Arterial Sheath Care (3)",
-            },
-          ],
-          "id": "row_3",
-        },
-        Object {
-          "cells": Array [
-            Object {
-              "content": "Sbsq Observation Care/Day High Severity 99226 (4)",
-            },
-          ],
-          "id": "row_4",
-        },
-        Object {
-          "cells": Array [
-            Object {
-              "content": "Arterial Sheath Care (5)",
-            },
-          ],
-          "id": "row_5",
-        },
-      ]
-    }
-    width="100%"
-  >
-    <div
-      className="compact-interactive-list-container"
-    >
-      <div
-        className="compact-interactive-list"
-        id="compact-interactive-list-with-one-column"
-        onFocus={[Function]}
-        onKeyDown={[Function]}
-        role="grid"
-        style={
-          Object {
-            "flexDirection": "column",
-            "height": "200px",
-            "width": "40px",
-          }
-        }
-        tabIndex={0}
-      >
-        <div
-          className="hidden"
-          role="row"
-        >
-          <span
-            key="Column-0"
-            role="columnheader"
-          >
-            Col_1
-          </span>
-        </div>
-        <Memo(Row)
-          cells={
-            Array [
-              Object {
-                "content": "Discern Care Set (1)",
-              },
-            ]
-          }
-          columnMinimumWidth={60}
-          columns={
-            Array [
-              Object {
-                "displayName": "Col_1",
-                "id": "Column-0",
-                "width": 40,
-              },
-            ]
-          }
-          hasVisibleBorders={true}
-          id="row_1"
-          isLeftmost={true}
-          isResponsive={false}
-          isTopmost={true}
-          key="row_1"
-          numberOfColumns={1}
-          rowHeight={
-            Object {
-              "unitType": "px",
-              "value": 40,
-            }
-          }
-          rowIndex={0}
-          rowMaximumWidth={null}
-          rowMinimumWidth={null}
-          rowWidth={40}
-          setFocusedCell={[Function]}
-          widthUnit="px"
-        >
-          <div
-            aria-hidden={null}
-            className="row row-topmost row-leftmost"
-            data-row-id="row_1"
-            id="row_1"
-            role="row"
-            style={
-              Object {
-                "height": "40px",
-                "width": "40px",
-              }
-            }
-          >
-            <Memo(Cell)
-              column={
-                Object {
-                  "displayName": "Col_1",
-                  "id": "Column-0",
-                  "width": 40,
-                }
-              }
-              columnMinimumWidth={60}
-              isRowHeader={false}
-              key="row-row_1-col-Column-0"
-              rowId="row_1"
-              setFocusedCell={[Function]}
-              widthUnit="px"
-            >
-              <div
-                className="cell"
-                onKeyDown={[Function]}
-                onMouseDown={[Function]}
-                role="gridcell"
-                style={
-                  Object {
-                    "justifyContent": "left",
-                    "textAlign": "left",
-                    "width": "40px",
-                  }
-                }
-                tabIndex={-1}
-              >
-                Discern Care Set (1)
-              </div>
-            </Memo(Cell)>
-          </div>
-        </Memo(Row)>
-        <Memo(Row)
-          cells={
-            Array [
-              Object {
-                "content": "Initial observation Care/Day High Severity 99220 (2)",
-              },
-            ]
-          }
-          columnMinimumWidth={60}
-          columns={
-            Array [
-              Object {
-                "displayName": "Col_1",
-                "id": "Column-0",
-                "width": 40,
-              },
-            ]
-          }
-          hasVisibleBorders={true}
-          id="row_2"
-          isLeftmost={true}
-          isResponsive={false}
-          isTopmost={false}
-          key="row_2"
-          numberOfColumns={1}
-          rowHeight={
-            Object {
-              "unitType": "px",
-              "value": 40,
-            }
-          }
-          rowIndex={1}
-          rowMaximumWidth={null}
-          rowMinimumWidth={null}
-          rowWidth={40}
-          setFocusedCell={[Function]}
-          widthUnit="px"
-        >
-          <div
-            aria-hidden={null}
-            className="row row-leftmost"
-            data-row-id="row_2"
-            id="row_2"
-            role="row"
-            style={
-              Object {
-                "height": "40px",
-                "width": "40px",
-              }
-            }
-          >
-            <Memo(Cell)
-              column={
-                Object {
-                  "displayName": "Col_1",
-                  "id": "Column-0",
-                  "width": 40,
-                }
-              }
-              columnMinimumWidth={60}
-              isRowHeader={false}
-              key="row-row_2-col-Column-0"
-              rowId="row_2"
-              setFocusedCell={[Function]}
-              widthUnit="px"
-            >
-              <div
-                className="cell"
-                onKeyDown={[Function]}
-                onMouseDown={[Function]}
-                role="gridcell"
-                style={
-                  Object {
-                    "justifyContent": "left",
-                    "textAlign": "left",
-                    "width": "40px",
-                  }
-                }
-                tabIndex={-1}
-              >
-                Initial observation Care/Day High Severity 99220 (2)
-              </div>
-            </Memo(Cell)>
-          </div>
-        </Memo(Row)>
-        <Memo(Row)
-          cells={
-            Array [
-              Object {
-                "content": "Arterial Sheath Care (3)",
-              },
-            ]
-          }
-          columnMinimumWidth={60}
-          columns={
-            Array [
-              Object {
-                "displayName": "Col_1",
-                "id": "Column-0",
-                "width": 40,
-              },
-            ]
-          }
-          hasVisibleBorders={true}
-          id="row_3"
-          isLeftmost={true}
-          isResponsive={false}
-          isTopmost={false}
-          key="row_3"
-          numberOfColumns={1}
-          rowHeight={
-            Object {
-              "unitType": "px",
-              "value": 40,
-            }
-          }
-          rowIndex={2}
-          rowMaximumWidth={null}
-          rowMinimumWidth={null}
-          rowWidth={40}
-          setFocusedCell={[Function]}
-          widthUnit="px"
-        >
-          <div
-            aria-hidden={null}
-            className="row row-leftmost"
-            data-row-id="row_3"
-            id="row_3"
-            role="row"
-            style={
-              Object {
-                "height": "40px",
-                "width": "40px",
-              }
-            }
-          >
-            <Memo(Cell)
-              column={
-                Object {
-                  "displayName": "Col_1",
-                  "id": "Column-0",
-                  "width": 40,
-                }
-              }
-              columnMinimumWidth={60}
-              isRowHeader={false}
-              key="row-row_3-col-Column-0"
-              rowId="row_3"
-              setFocusedCell={[Function]}
-              widthUnit="px"
-            >
-              <div
-                className="cell"
-                onKeyDown={[Function]}
-                onMouseDown={[Function]}
-                role="gridcell"
-                style={
-                  Object {
-                    "justifyContent": "left",
-                    "textAlign": "left",
-                    "width": "40px",
-                  }
-                }
-                tabIndex={-1}
-              >
-                Arterial Sheath Care (3)
-              </div>
-            </Memo(Cell)>
-          </div>
-        </Memo(Row)>
-        <Memo(Row)
-          cells={
-            Array [
-              Object {
-                "content": "Sbsq Observation Care/Day High Severity 99226 (4)",
-              },
-            ]
-          }
-          columnMinimumWidth={60}
-          columns={
-            Array [
-              Object {
-                "displayName": "Col_1",
-                "id": "Column-0",
-                "width": 40,
-              },
-            ]
-          }
-          hasVisibleBorders={true}
-          id="row_4"
-          isLeftmost={true}
-          isResponsive={false}
-          isTopmost={false}
-          key="row_4"
-          numberOfColumns={1}
-          rowHeight={
-            Object {
-              "unitType": "px",
-              "value": 40,
-            }
-          }
-          rowIndex={3}
-          rowMaximumWidth={null}
-          rowMinimumWidth={null}
-          rowWidth={40}
-          setFocusedCell={[Function]}
-          widthUnit="px"
-        >
-          <div
-            aria-hidden={null}
-            className="row row-leftmost"
-            data-row-id="row_4"
-            id="row_4"
-            role="row"
-            style={
-              Object {
-                "height": "40px",
-                "width": "40px",
-              }
-            }
-          >
-            <Memo(Cell)
-              column={
-                Object {
-                  "displayName": "Col_1",
-                  "id": "Column-0",
-                  "width": 40,
-                }
-              }
-              columnMinimumWidth={60}
-              isRowHeader={false}
-              key="row-row_4-col-Column-0"
-              rowId="row_4"
-              setFocusedCell={[Function]}
-              widthUnit="px"
-            >
-              <div
-                className="cell"
-                onKeyDown={[Function]}
-                onMouseDown={[Function]}
-                role="gridcell"
-                style={
-                  Object {
-                    "justifyContent": "left",
-                    "textAlign": "left",
-                    "width": "40px",
-                  }
-                }
-                tabIndex={-1}
-              >
-                Sbsq Observation Care/Day High Severity 99226 (4)
-              </div>
-            </Memo(Cell)>
-          </div>
-        </Memo(Row)>
-        <Memo(Row)
-          cells={
-            Array [
-              Object {
-                "content": "Arterial Sheath Care (5)",
-              },
-            ]
-          }
-          columnMinimumWidth={60}
-          columns={
-            Array [
-              Object {
-                "displayName": "Col_1",
-                "id": "Column-0",
-                "width": 40,
-              },
-            ]
-          }
-          hasVisibleBorders={true}
-          id="row_5"
-          isLeftmost={true}
-          isResponsive={false}
-          isTopmost={false}
-          key="row_5"
-          numberOfColumns={1}
-          rowHeight={
-            Object {
-              "unitType": "px",
-              "value": 40,
-            }
-          }
-          rowIndex={4}
-          rowMaximumWidth={null}
-          rowMinimumWidth={null}
-          rowWidth={40}
-          setFocusedCell={[Function]}
-          widthUnit="px"
-        >
-          <div
-            aria-hidden={null}
-            className="row row-leftmost"
-            data-row-id="row_5"
-            id="row_5"
-            role="row"
-            style={
-              Object {
-                "height": "40px",
-                "width": "40px",
-              }
-            }
-          >
-            <Memo(Cell)
-              column={
-                Object {
-                  "displayName": "Col_1",
-                  "id": "Column-0",
-                  "width": 40,
-                }
-              }
-              columnMinimumWidth={60}
-              isRowHeader={false}
-              key="row-row_5-col-Column-0"
-              rowId="row_5"
-              setFocusedCell={[Function]}
-              widthUnit="px"
-            >
-              <div
-                className="cell"
-                onKeyDown={[Function]}
-                onMouseDown={[Function]}
-                role="gridcell"
-                style={
-                  Object {
-                    "justifyContent": "left",
-                    "textAlign": "left",
-                    "width": "40px",
-                  }
-                }
-                tabIndex={-1}
-              >
-                Arterial Sheath Care (5)
-              </div>
-            </Memo(Cell)>
-          </div>
-        </Memo(Row)>
-      </div>
-    </div>
-  </CompactInteractiveList>
-</InjectIntl(CompactInteractiveList)>
-`;

From 86707eae5fce55617e84936c347370899d55d3ac Mon Sep 17 00:00:00 2001
From: Alla Doroshkevych <alla.doroshkevych@oracle.com>
Date: Fri, 29 Mar 2024 16:31:00 -0400
Subject: [PATCH 3/3] Update
 packages/terra-compact-interactive-list/src/CompactInteractiveList.jsx

Co-authored-by: Sydney Combs <42594047+sycombs@users.noreply.github.com>
---
 .../src/CompactInteractiveList.jsx                              | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/terra-compact-interactive-list/src/CompactInteractiveList.jsx b/packages/terra-compact-interactive-list/src/CompactInteractiveList.jsx
index b0fde6c77df..1411be041e0 100644
--- a/packages/terra-compact-interactive-list/src/CompactInteractiveList.jsx
+++ b/packages/terra-compact-interactive-list/src/CompactInteractiveList.jsx
@@ -110,7 +110,7 @@ const propTypes = {
 
   /**
    * A zero-based index indicating which column represents the row header.
-   * Omitted if there is only one semantic column in the list, in this case the list will have no row headers.
+   * If there is only one semantic column in the list, the list will have no row headers and the rowHeaderIndex will be ignored.
    */
   rowHeaderIndex: validateRowHeaderIndex,