Change R generic to TRow

abstract-table.ts

@@ -1,5 +1,5 @@
 /**
- * @template R A type that the shape of a row should be. E.g.
+ * @template TRow A type that the shape of a row should be. E.g.
  * ```
  * type User = {
  *     id: number;
@@ -8,11 +8,11 @@
  * ```
  * Then `User` would be passed as the generic.
  */
-export abstract class Table<R extends Object> {
+export abstract class Table<TRow extends Object> {
 
     table: HTMLTableElement;
     tableBody: HTMLTableSectionElement;
-    headers: Header<R>[];
+    headers: Header<TRow>[];
 
     messageEl: HTMLElement | null;
 
@@ -28,7 +28,7 @@ export abstract class Table<R extends Object> {
      * Pass an HTMLElement to use a custom element.
      * Pass null to disable automatic message output.
      */
-    constructor(exampleObject: R, displayNamesAndOrder?: Record<keyof R, string>, messageElement?: HTMLElement | null | undefined) {
+    constructor(exampleObject: TRow, displayNamesAndOrder?: Record<keyof TRow, string>, messageElement?: HTMLElement | null | undefined) {
 
         this.table = document.createElement("table")
         this.tableBody = document.createElement("tbody");
@@ -44,12 +44,12 @@ export abstract class Table<R extends Object> {
     }
 
     createHeadersFromType(
-        exampleObject: R, // Needed for runtime, since types don't exist in JS.
+        exampleObject: TRow, // Needed for runtime, since types don't exist in JS.
-        displayNamesAndOrder?: Record<keyof R, string>
+        displayNamesAndOrder?: Record<keyof TRow, string>
-    ): Header<R>[] {
+    ): Header<TRow>[] {
         const keys = displayNamesAndOrder
-            ? (Object.keys(displayNamesAndOrder) as (keyof R)[])
+            ? (Object.keys(displayNamesAndOrder) as (keyof TRow)[])
-            : (Object.keys(exampleObject) as (keyof R)[]);
+            : (Object.keys(exampleObject) as (keyof TRow)[]);
 
         return keys.map(key => ({
             key,
@@ -94,12 +94,12 @@ export abstract class Table<R extends Object> {
      * Appends one more row to the current rows.
      * @param data Data to append as a row.
      */
-    appendRow(data: R): void {
+    appendRow(data: TRow): void {
         const row = this.createPopulatedRow(data)
         this.tableBody.appendChild(row)
     }
 
-    appendRows(data: R[]): void {
+    appendRows(data: TRow[]): void {
         if (data.length === 0) {
             this.setMessage("No data to append. Empty list provided.")
             return;
@@ -114,7 +114,7 @@ export abstract class Table<R extends Object> {
      * @param data The data in the shape of `R`, with values populated.
      * @return A HTMLTableRowElement that can then be set on a table.
      */
-    createPopulatedRow(data: R): HTMLTableRowElement {
+    createPopulatedRow(data: TRow): HTMLTableRowElement {
         const row = document.createElement("tr");
 
         for (const header of this.headers) {
@@ -157,18 +157,18 @@ export abstract class Table<R extends Object> {
 
     /**
      * Deletes all current rows and sets a single row to the data in data param.
-     * @param data The data to set the table to. Should be of shape {@link R}
+     * @param data The data to set the table to. Should be of shape {@link TRow}
      */
-    setSingleRow(data: R): void {
+    setSingleRow(data: TRow): void {
         this.clearRows()
         this.appendRow(data)
     }
 
     /**
      * Deletes all current rows and sets the rows to the data in data param.
-     * @param data The data to set the table to. Should be of shape {@link R}
+     * @param data The data to set the table to. Should be of shape {@link TRow}
      */
-    setRows(data: R[]): void {
+    setRows(data: TRow[]): void {
         this.clearRows()
         if (data.length === 0) {
             this.setMessage("No data to show. Empty list provided.")