feat: make data and columns readonly (#6183)

Author: KevinVandy

packages/angular-table/src/helpers/createTableHook.ts

@@ -154,7 +154,7 @@ type AppGroupColumnDef<
   footer?: AppColumnDefTemplate<
     AppHeaderContext<TFeatures, TData, unknown, THeaderComponents>
   >
-  columns?: Array<ColumnDef<TFeatures, TData, unknown>>
+  columns?: ReadonlyArray<ColumnDef<TFeatures, TData, unknown>>
 }
 
 // =============================================================================

packages/table-core/src/core/columns/coreColumnsFeature.types.ts

@@ -65,7 +65,7 @@ export interface TableOptions_Columns<
   /**
    * The array of column defs to use for the table.
    */
-  columns: Array<ColumnDef<TFeatures, TData, TValue>>
+  columns: ReadonlyArray<ColumnDef<TFeatures, TData, TValue>>
   /**
    * Default column options to use for all column defs supplied to the table.
    */

packages/table-core/src/core/columns/coreColumnsFeature.utils.ts

@@ -79,7 +79,7 @@ export function table_getAllColumns<
   table: Table_Internal<TFeatures, TData>,
 ): Array<Column<TFeatures, TData, unknown>> {
   const recurseColumns = (
-    colDefs: Array<ColumnDef<TFeatures, TData, unknown>>,
+    colDefs: ReadonlyArray<ColumnDef<TFeatures, TData, unknown>>,
     parent?: Column<TFeatures, TData, unknown>,
     depth = 0,
   ): Array<Column<TFeatures, TData, unknown>> => {

packages/table-core/src/core/row-models/createCoreRowModel.ts

@@ -29,7 +29,7 @@ function _createCoreRowModel<
   TData extends RowData,
 >(
   table: Table_Internal<TFeatures, TData>,
-  data: Array<TData>,
+  data: ReadonlyArray<TData>,
 ): {
   rows: Array<Row<TFeatures, TData>>
   flatRows: Array<Row<TFeatures, TData>>
@@ -42,7 +42,7 @@ function _createCoreRowModel<
   }
 
   const accessRows = (
-    originalRows: Array<TData>,
+    originalRows: ReadonlyArray<TData>,
     depth = 0,
     parentRow?: Row<TFeatures, TData>,
   ): Array<Row<TFeatures, TData>> => {

packages/table-core/src/core/rows/coreRowsFeature.types.ts

@@ -29,7 +29,7 @@ export interface Row_CoreProperties<
   /**
    * An array of the original subRows as returned by the `options.getSubRows` option.
    */
-  originalSubRows?: Array<TData>
+  originalSubRows?: ReadonlyArray<TData>
   /**
    * If nested, this row's parent row id.
    */
@@ -96,7 +96,10 @@ export interface TableOptions_Rows<
    * This optional function is used to access the sub rows for any given row. If you are using nested rows, you will need to use this function to return the sub rows object (or undefined) from the row.
    * @example getSubRows: row => row.subRows
    */
-  getSubRows?: (originalRow: TData, index: number) => undefined | Array<TData>
+  getSubRows?: (
+    originalRow: TData,
+    index: number,
+  ) => undefined | ReadonlyArray<TData>
 }
 
 export interface Table_Rows<

packages/table-core/src/core/table/coreTablesFeature.types.ts

@@ -31,7 +31,7 @@ export interface TableOptions_Table<
   /**
    * The data for the table to display. When the `data` option changes reference, the table will reprocess the data.
    */
-  data: Array<TData>
+  data: ReadonlyArray<TData>
   /**
    * Use this option to optionally pass initial state to the table. This state will be used when resetting various table states either automatically by the table (eg. `options.autoResetPageIndex`) or via functions like `table.resetRowSelection()`. Most reset function allow you optionally pass a flag to reset to a blank/default state instead of the initial state.
    * Table state will not be reset when this object changes, which also means that the initial state object does not need to be stable.

packages/table-core/src/types/ColumnDef.ts

@@ -150,7 +150,7 @@ type GroupColumnDefBase<
   TData extends RowData,
   TValue extends CellData = CellData,
 > = ColumnDefBase<TFeatures, TData, TValue> & {
-  columns?: Array<ColumnDef<TFeatures, TData, unknown>>
+  columns?: ReadonlyArray<ColumnDef<TFeatures, TData, unknown>>
 }
 
 export type GroupColumnDef<

packages/table-devtools/src/components/RowsPanel.tsx

@@ -62,7 +62,7 @@ export function RowsPanel() {
           'No table instance is connected. Pass a table instance to TableDevtoolsPanel.',
       }
     }
-    const data = tableInstance.options.data as Array<unknown>
+    const data = tableInstance.options.data as ReadonlyArray<unknown>
     if (!Array.isArray(data)) return data
     if (data.length <= ROW_LIMIT) return data as unknown
     return data.slice(0, ROW_LIMIT) as unknown
@@ -71,7 +71,7 @@ export function RowsPanel() {
   const getRawDataTotalCount = (): number => {
     tableState?.()
     if (!tableInstance) return 0
-    const data = tableInstance.options.data as Array<unknown>
+    const data = tableInstance.options.data as ReadonlyArray<unknown>
     return Array.isArray(data) ? data.length : 0
   }
 

packages/vue-table/src/useTable.ts

@@ -16,7 +16,7 @@ export type TableOptionsWithReactiveData<
   TFeatures extends TableFeatures,
   TData extends RowData,
 > = Omit<TableOptions<TFeatures, TData>, 'data'> & {
-  data: MaybeRef<Array<TData>>
+  data: MaybeRef<ReadonlyArray<TData>>
 }
 
 function getOptionsWithReactiveData<