fix(table): add a label for the checkboxes of individual rows

Author: Kiarokh

src/components/table/table-selection.spec.ts

@@ -32,7 +32,8 @@ describe('table selection', () => {
         tableSelection = new TestTableSelection(
             () => table,
             new ElementPool(document),
-            { emit: emitSelect }
+            { emit: emitSelect },
+            jest.fn((key: string) => key)
         );
     });
 

src/components/table/table-selection.ts

@@ -21,11 +21,13 @@ export class TableSelection {
      * @param getTable - Function that returns the Tabulator instance
      * @param pool - The element pool used to cache the checkbox components
      * @param selectEvent - The event emitter to use when checkboxes are toggled
+     * @param getTranslation - Function to get translated strings
      */
     constructor(
         private getTable: () => Tabulator,
         private pool: ElementPool,
-        private selectEvent: EventEmitter<RowData[]>
+        private selectEvent: EventEmitter<RowData[]>,
+        private getTranslation: (key: string) => string
     ) {
         this.selection = new Selection((index) =>
             getRowId(this.getRowByIndex(index).getData())
@@ -106,7 +108,9 @@ export class TableSelection {
             const element = this.pool.get(LIMEL_CHECKBOX);
             setElementProperties(element, {
                 checked: this.selection.has(getRowId(cell.getData())),
+                label: this.getTranslation('table.select-row'),
             });
+            element.classList.add('hide-label');
             element.style.display = 'inline-block';
 
             return element;

src/components/table/table.tsx

@@ -477,7 +477,8 @@ export class Table {
             this.tableSelection = new TableSelection(
                 () => this.tabulator,
                 this.pool,
-                this.select
+                this.select,
+                (key: string) => this.getTranslation(key)
             );
             this.tableSelection.setSelection(this.selection);
         }