wcs-core 4.2.0 → 5.0.0

package/dist/collection/components/grid/grid.js

@@ -1,8 +1,9 @@
 import { forceUpdate, h, Host } from '@stencil/core';
-import { getSortOrderInteger } from './grid-interface';
+import { getSortOrderInteger, } from './grid-interface';
 import { v4 as uuid } from 'uuid';
-import { cloneDeep, isEqual, get } from 'lodash-es';
+import { cloneDeep, get, isEqual } from 'lodash-es';
 import { GridPagination } from '../grid-pagination/grid-pagination';
+import { getActionForKeyboardEvent } from "./grid-keyboard-event";
 /**
  * The grid component is a complex component used as an HTML table to display collections of data.
  *
@@ -23,6 +24,11 @@ export class Grid {
     this.columns = undefined;
     this.paginationEl = undefined;
     this.rows = [];
+    this.cursorPosition = { col: 0, row: 1 };
+  }
+  onCursorPositionChange(newValue) {
+    // Notify all grid columns that the cursorPosition has changed
+    this.getGridColumnsFromTemplate().forEach(g => g.cursorPosition = newValue);
   }
   onDataChange(newValue) {
     this.updateGridRows(newValue);
@@ -31,10 +37,145 @@ export class Grid {
   onSelectedItemsPropertyChange(newValue) {
     this.updateSelectionWithValues(newValue);
   }
+  onFocus() {
+    var _a;
+    (_a = this.getElementToFocusAtCursorPosition()) === null || _a === void 0 ? void 0 : _a.focus();
+  }
+  /**
+   * If selectionConfig is different from `none`, that means that an extra column for radio or checkbox is rendered
+   * in the table.
+   */
+  hasSelectionColumn() {
+    return this.selectionConfig !== 'none';
+  }
+  /**
+   * Returns the element to focus at the current cursor position : it can be a cell (td, th) to focus or a nested
+   * checkbox / radio element if the selection mode is single or multiple
+   */
+  getElementToFocusAtCursorPosition() {
+    var _a, _b;
+    const el = (_a = this.gridElementsWithCoordinates.find(cell => { var _a, _b; return cell.col === ((_a = this.cursorPosition) === null || _a === void 0 ? void 0 : _a.col) && cell.row === ((_b = this.cursorPosition) === null || _b === void 0 ? void 0 : _b.row); })) === null || _a === void 0 ? void 0 : _a.el;
+    return this.hasSelectionColumn()
+      ? (_b = el.querySelector('wcs-checkbox,wcs-radio')) !== null && _b !== void 0 ? _b : el
+      : el;
+  }
+  moveCursorPosition(directionX, directionY) {
+    var _a;
+    this.cursorPosition = {
+      col: directionX === 'first' ? 0 :
+        directionX === 'last' ? this.totalDisplayedColumnCount() - 1 :
+          Math.min(Math.max(this.cursorPosition.col + directionX, 0), this.totalDisplayedColumnCount() - 1),
+      row: directionY === 'first' ? 0 :
+        directionY === 'last' ? this.getRowsForCurrentPage().length :
+          Math.min(Math.max(this.cursorPosition.row + directionY, 0), this.getRowsForCurrentPage().length)
+    };
+    this.handleCursorPositionOnEmptyTh();
+    (_a = this.getElementToFocusAtCursorPosition()) === null || _a === void 0 ? void 0 : _a.focus();
+  }
+  /**
+   * When the grid has selectionConfig single, an empty th appears at col=0, row=0.
+   * It should not be focusable so the cursor navigates to col=1, row=0 instead.
+   */
+  handleCursorPositionOnEmptyTh() {
+    if (this.selectionConfig === 'single' && this.cursorPosition.col === 0 && this.cursorPosition.row === 0) {
+      this.cursorPosition = {
+        col: 1,
+        row: 0
+      };
+    }
+  }
   onHiddenColumnChange() {
     // We use forceUpdate because the fact of hiding a column or not does not modify the internal structure of the grid (WcsGridRow).
     // Hide a column only impacts the way it is rendered but the grid-column remains in the dom and in our internal model.
     forceUpdate(this);
+    this.cursorPosition = { col: 0, row: 1 };
+  }
+  onKeyDown(_event) {
+    var _a;
+    if (((_a = document.activeElement) === null || _a === void 0 ? void 0 : _a.tagName) === 'WCS-GRID-PAGINATION') {
+      return;
+    }
+    let type;
+    switch (this.selectionConfig) {
+      case "multiple":
+        type = 'grid_selection_multiple';
+        break;
+      case "single":
+        type = 'grid_selection_single';
+        break;
+      case "none":
+        type = 'grid_no_selection';
+        break;
+    }
+    const actionsFromKeyboardEvents = getActionForKeyboardEvent(_event, type);
+    // If we have at least one associated actions, we prevent the default behavior of the event. 
+    // Except if the action is a focus move (we have to handle the preventDefault behavior ourselves in the action implementation)
+    if (actionsFromKeyboardEvents.length != 0) {
+      _event.preventDefault();
+    }
+    for (const actionFromKeyboardEvent of actionsFromKeyboardEvents) {
+      this.doActionFromKeyboardEventAssociatedAction(actionFromKeyboardEvent, _event);
+    }
+  }
+  doActionFromKeyboardEventAssociatedAction(actionFromKeyboardEvent, event) {
+    switch (actionFromKeyboardEvent.kind) {
+      case "FocusCell":
+        switch (actionFromKeyboardEvent.target) {
+          case "up":
+            this.moveCursorPosition(0, -1);
+            break;
+          case "down":
+            this.moveCursorPosition(0, 1);
+            break;
+          case "left":
+            this.moveCursorPosition(-1, 0);
+            break;
+          case "right":
+            this.moveCursorPosition(1, 0);
+            break;
+          case "first_of_row":
+            this.moveCursorPosition('first', 0);
+            break;
+          case "last_of_row":
+            this.moveCursorPosition('last', 0);
+            break;
+          case "first_of_grid":
+            this.moveCursorPosition('first', 'first');
+            break;
+          case "last_of_grid":
+            this.moveCursorPosition('last', 'last');
+            break;
+          default:
+            break;
+        }
+      case "SelectRow":
+        switch (actionFromKeyboardEvent.target) {
+          case "one":
+            event.preventDefault();
+            if (this.cursorPosition.row > 0) {
+              this.onRowSelection(this.rows[this.cursorPosition.row - 1]);
+            }
+            break;
+          case "all":
+            this.selectAllRows();
+            break;
+          default:
+            break;
+        }
+        break;
+      default:
+        throw new Error("Internal error");
+    }
+  }
+  onClick(_event) {
+    const clickedGridElement = _event.composedPath()
+      .filter(x => ['TD', 'TH']
+      .includes(x.nodeName))[0];
+    const clickedGridElementWithCoordinates = this.gridElementsWithCoordinates.find(e => e.el === clickedGridElement);
+    this.cursorPosition = {
+      col: clickedGridElementWithCoordinates.col,
+      row: clickedGridElementWithCoordinates.row,
+    };
   }
   updateSelectionWithValues(values) {
     if (this.selectionConfig === 'single') {
@@ -70,7 +211,10 @@ export class Grid {
           selected: false,
           cells: []
         };
+        let index = 0;
         for (const column of this.columns) {
+          column.columnPosition = index + (this.hasSelectionColumn() ? 1 : 0);
+          index++;
           row.cells.push({
             content: get(data[i], column.path),
             column,
@@ -98,14 +242,14 @@ export class Grid {
    * Handle existing column's filters (defined before the grid is instantiated)
    * @private
    */
-  refreshSort(refreshOthersColmumnsSortOrderState) {
+  refreshSort(refreshOthersColumnsSortOrderState) {
     //fixme: why the column property can be null or undefined?
     if (this.columns) {
       const [first, ...other] = this.columns.filter(c => c.sortOrder !== 'none');
       if (first && !this.serverMode) {
         this.sortBy(first);
       }
-      refreshOthersColmumnsSortOrderState && this.disableSortOrderForColumns(other);
+      refreshOthersColumnsSortOrderState && this.disableSortOrderForColumns(other);
     }
   }
   disableSortOrderForColumns(columns) {
@@ -119,6 +263,34 @@ export class Grid {
     const slotted = this.el.shadowRoot.querySelector('slot[name="grid-pagination"]');
     return slotted.assignedElements();
   }
+  get gridElementsWithCoordinates() {
+    const gridElements = [];
+    // If selection multiple, the first cell should be added to the list
+    if (this.selectionConfig === 'multiple') {
+      gridElements.push({
+        el: this.el.shadowRoot.querySelector('th'),
+        row: 0,
+        col: 0
+      });
+    }
+    this.getGridColumnsFromTemplate()
+      .filter(col => !col.hidden)
+      .forEach((col, index) => {
+      gridElements.push({
+        el: col.shadowRoot.querySelector('th'),
+        row: 0,
+        col: index + (this.hasSelectionColumn() ? 1 : 0),
+      });
+    });
+    this.el.shadowRoot.querySelectorAll('td').forEach((cell, index) => {
+      gridElements.push({
+        el: cell,
+        row: 1 + Math.floor(index / this.totalDisplayedColumnCount()),
+        col: index % this.totalDisplayedColumnCount(),
+      });
+    });
+    return gridElements;
+  }
   sortChangeEventHandler(event) {
     if (event.detail.order === 'none')
       return;
@@ -131,19 +303,19 @@ export class Grid {
   }
   /**
    * Sorts the grid rows according to the given column's configuration
-   * @param colmun Column from which to extract the sorting configuration
+   * @param column Column from which to extract the sorting configuration
    * @private
    */
-  sortBy(colmun) {
-    if (colmun.sortFn) {
+  sortBy(column) {
+    if (column.sortFn) {
       this.rows = cloneDeep(this.rows)
-        .sort((a, b) => colmun.sortFn(a.data, b.data, colmun) * getSortOrderInteger(colmun.sortOrder));
+        .sort((a, b) => column.sortFn(a.data, b.data, column) * getSortOrderInteger(column.sortOrder));
     }
     else {
       this.rows = cloneDeep(this.rows)
         .sort((a, b) => {
-        const path = colmun.path;
-        return ((get(a.data, path) < get(b.data, path)) ? -1 : (get(a.data, path) > get(b.data, path)) ? 1 : 0) * getSortOrderInteger(colmun.sortOrder);
+        const path = column.path;
+        return ((get(a.data, path) < get(b.data, path)) ? -1 : (get(a.data, path) > get(b.data, path)) ? 1 : 0) * getSortOrderInteger(column.sortOrder);
       });
     }
   }
@@ -184,15 +356,25 @@ export class Grid {
     }
     row.selected = !row.selected;
     if (this.selectionConfig !== 'single' || row.selected) {
-      this.wcsGridSelectionChange.emit({ row: this.wcsGridRowToWcsGridRowData(row) });
+      this.wcsGridSelectionChange.emit({
+        selectedRows: this.selectedRows.map(row => this.wcsGridRowToWcsGridRowData(row)),
+        changedRow: this.wcsGridRowToWcsGridRowData(row)
+      });
     }
     this.rows = cloneDeep(this.rows);
   }
+  get selectedRows() {
+    return this.rows.filter(r => r.selected);
+  }
   selectAllRows() {
     const rows = this.getRowsForCurrentPage();
     const selected = !this.allRowsAreSelected();
     rows.map(r => r.selected = selected);
     this.wcsGridAllSelectionChange.emit({ rows: selected ? rows.map(row => this.wcsGridRowToWcsGridRowData(row)) : [] });
+    this.wcsGridSelectionChange.emit({
+      selectedRows: this.selectedRows.map(row => this.wcsGridRowToWcsGridRowData(row)),
+      changedRow: 'allCheckbox'
+    });
     this.rows = cloneDeep(this.rows);
   }
   allRowsAreSelected() {
@@ -205,14 +387,15 @@ export class Grid {
     }
     return this.rows;
   }
-  renderSelectionColumn(row) {
+  renderSelectionColumn(row, rowIndex) {
+    var _a, _b, _c, _d;
     switch (this.selectionConfig) {
       case 'none':
         return;
       case 'single':
-        return h("td", null, h("wcs-radio", { checked: row.selected, onWcsRadioClick: this.onRowSelection.bind(this, row) }));
+        return h("td", { "aria-colindex": this.atLeastOneColumnHidden() ? 1 : null, tabIndex: ((_a = this.cursorPosition) === null || _a === void 0 ? void 0 : _a.col) === 0 && rowIndex + 1 === ((_b = this.cursorPosition) === null || _b === void 0 ? void 0 : _b.row) ? 0 : -1 }, h("wcs-radio", { tabIndex: -1, checked: row.selected, onWcsRadioClick: this.onRowSelection.bind(this, row) }));
       case 'multiple':
-        return h("td", null, h("wcs-checkbox", { checked: row.selected, onWcsChange: this.onRowSelection.bind(this, row) }));
+        return h("td", { "aria-colindex": this.atLeastOneColumnHidden() ? 1 : null, tabIndex: ((_c = this.cursorPosition) === null || _c === void 0 ? void 0 : _c.col) === 0 && rowIndex + 1 === ((_d = this.cursorPosition) === null || _d === void 0 ? void 0 : _d.row) ? 0 : -1 }, h("wcs-checkbox", { tabIndex: -1, checked: row.selected, onWcsChange: this.onRowSelection.bind(this, row) }));
     }
   }
   getCellContent(row, cell) {
@@ -221,30 +404,61 @@ export class Grid {
     }
     return cell.content;
   }
+  /**
+   * Returns the total number of columns
+   * @private
+   */
   totalColumnCount() {
     if (!this.columns) {
       return 0;
     }
-    return this.columns.length + (this.selectionConfig === 'none' ? 0 : 1);
+    return this.columns.length + (this.hasSelectionColumn() ? 1 : 0);
+  }
+  /**
+   * Returns the total number of columns that are not hidden
+   * @private
+   */
+  totalDisplayedColumnCount() {
+    var _a, _b;
+    return (_b = this.totalColumnCount() - ((_a = this.columns) === null || _a === void 0 ? void 0 : _a.filter(col => col.hidden).length)) !== null && _b !== void 0 ? _b : 0;
+  }
+  /**
+   * Returns true if at least one column is hidden from the table
+   * @private
+   */
+  atLeastOneColumnHidden() {
+    return this.totalDisplayedColumnCount() !== this.totalColumnCount();
   }
   render() {
-    var _a;
-    return (h(Host, null, h("table", null, h("thead", null, this.selectionConfig === 'none' ? ''
+    var _a, _b, _c, _d;
+    return (h(Host, null, h("table", { role: "grid", "aria-rowcount": !this.loading && ((_a = this.rows) === null || _a === void 0 ? void 0 : _a.length), "aria-colcount": !this.loading && this.totalDisplayedColumnCount() }, h("thead", null, h("tr", { "aria-rowindex": "1" }, this.selectionConfig === 'none' ? ''
       : h("th", { class: "wcs-grid-selection-column" }, this.selectionConfig === 'single' ? '' :
-        h("wcs-checkbox", { checked: this.allRowsAreSelected(), onWcsChange: this.selectAllRows.bind(this) })), h("slot", { name: "grid-column" })), h("tbody", null, this.loading
-      ? h("tr", null, h("td", { colSpan: this.totalColumnCount(), class: "loading" }, h("wcs-spinner", null)))
-      : (_a = this.rows) === null || _a === void 0 ? void 0 : _a.filter(row => this.serverMode || !this.paginationEl || row.page === this.paginationEl.currentPage).map(row => this.renderRow(row)))), h("slot", { name: "grid-pagination" })));
+        h("wcs-checkbox", { tabIndex: ((_b = this.cursorPosition) === null || _b === void 0 ? void 0 : _b.col) === 0
+            && ((_c = this.cursorPosition) === null || _c === void 0 ? void 0 : _c.row) === 0 ? 0 : -1, checked: this.allRowsAreSelected(), onWcsChange: this.selectAllRows.bind(this) })), h("slot", { name: "grid-column" }))), h("tbody", null, this.loading
+      ? h("tr", { "aria-busy": "true" }, h("td", { colSpan: this.totalColumnCount(), class: "loading" }, h("wcs-spinner", null)))
+      : (_d = this.rows) === null || _d === void 0 ? void 0 : _d.filter(row => this.serverMode || !this.paginationEl || row.page === this.paginationEl.currentPage).map((row, index) => this.renderRow(row, index)))), h("slot", { name: "grid-pagination" })));
   }
-  renderRow(row) {
+  /**
+   * Returns the row with all mapped cells inside.
+   * The aria-rowindex here starts at 2 because the header row starts at index 1.
+   * @private
+   */
+  renderRow(row, rowIndex) {
     var _a;
-    return h("tr", { class: row.selected ? 'selected' : '' }, this.renderSelectionColumn(row), (_a = row.cells) === null || _a === void 0 ? void 0 :
-      _a.map(cell => {
+    let hiddenColumnCount = 0;
+    return h("tr", { class: row.selected ? 'selected' : '', "aria-selected": row.selected ? 'true' : null, "aria-rowindex": rowIndex + 2 }, this.renderSelectionColumn(row, rowIndex), (_a = row.cells) === null || _a === void 0 ? void 0 :
+      _a.map((cell, cellIndex) => {
+        var _a, _b;
         if (cell.column.hidden) {
+          hiddenColumnCount++;
           return;
         }
+        const nonHiddenColumnIndex = cellIndex - hiddenColumnCount + 1 + (this.hasSelectionColumn() ? 1 : 0);
+        const cursorIsOnCell = nonHiddenColumnIndex - 1 === ((_a = this.cursorPosition) === null || _a === void 0 ? void 0 : _a.col)
+          && rowIndex + 1 === ((_b = this.cursorPosition) === null || _b === void 0 ? void 0 : _b.row);
         return cell.column.customCells
-          ? (h("td", null, h("slot", { name: cell.column.id + '-' + row.data[this.rowIdPath] })))
-          : (h("td", { part: cell.column.path + '-column' }, this.getCellContent(row, cell)));
+          ? (h("td", { tabIndex: cursorIsOnCell ? 0 : -1, "aria-colindex": this.atLeastOneColumnHidden() ? nonHiddenColumnIndex : null }, h("slot", { name: cell.column.id + '-' + row.data[this.rowIdPath] })))
+          : (h("td", { tabIndex: cursorIsOnCell ? 0 : -1, "aria-colindex": this.atLeastOneColumnHidden() ? nonHiddenColumnIndex : null, part: cell.column.path + '-column' }, this.getCellContent(row, cell)));
       }));
   }
   static get is() { return "wcs-grid"; }
@@ -392,7 +606,8 @@ export class Grid {
     return {
       "columns": {},
       "paginationEl": {},
-      "rows": {}
+      "rows": {},
+      "cursorPosition": {}
     };
   }
   static get events() {
@@ -407,10 +622,10 @@ export class Grid {
           "text": "Event emitted when a row is selected or unselected"
         },
         "complexType": {
-          "original": "WcsGridRowSelectedEventDetails",
-          "resolved": "WcsGridRowSelectedEventDetails",
+          "original": "WcsGridSelectionEventDetails",
+          "resolved": "WcsGridSelectionEventDetails",
           "references": {
-            "WcsGridRowSelectedEventDetails": {
+            "WcsGridSelectionEventDetails": {
               "location": "import",
               "path": "./grid-interface"
             }
@@ -441,6 +656,9 @@ export class Grid {
   static get elementRef() { return "el"; }
   static get watchers() {
     return [{
+        "propName": "cursorPosition",
+        "methodName": "onCursorPositionChange"
+      }, {
         "propName": "data",
         "methodName": "onDataChange"
       }, {
@@ -450,11 +668,29 @@ export class Grid {
   }
   static get listeners() {
     return [{
+        "name": "focus",
+        "method": "onFocus",
+        "target": undefined,
+        "capture": false,
+        "passive": false
+      }, {
         "name": "wcsHiddenChange",
         "method": "onHiddenColumnChange",
         "target": undefined,
         "capture": false,
         "passive": false
+      }, {
+        "name": "keydown",
+        "method": "onKeyDown",
+        "target": undefined,
+        "capture": false,
+        "passive": false
+      }, {
+        "name": "mousedown",
+        "method": "onClick",
+        "target": undefined,
+        "capture": false,
+        "passive": true
       }, {
         "name": "wcsSortChange",
         "method": "sortChangeEventHandler",

package/dist/collection/components/grid/grid.js.map

@@ -1 +1 @@
-{"version":3,"file":"grid.js","sourceRoot":"","sources":["../../../src/components/grid/grid.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n    Component,\n    ComponentDidLoad,\n    ComponentInterface,\n    Element,\n    Event,\n    EventEmitter,\n    forceUpdate,\n    h,\n    Host,\n    Listen,\n    Prop,\n    State,\n    VNode,\n    Watch\n} from '@stencil/core';\nimport {\n    getSortOrderInteger,\n    HyperFunc,\n    WcsGridAllRowSelectedEventDetails,\n    WcsGridCell,\n    WcsGridColumnSortChangeEventDetails,\n    WcsGridPaginationChangeEventDetails,\n    WcsGridRow,\n    WcsGridRowData,\n    WcsGridRowSelectedEventDetails,\n    WcsGridSelectionConfig\n} from './grid-interface';\nimport { v4 as uuid } from 'uuid';\nimport { cloneDeep, isEqual, get } from 'lodash-es';\nimport { GridPagination } from '../grid-pagination/grid-pagination';\n\n/**\n * The grid component is a complex component used as an HTML table to display collections of data.\n *\n * @cssprop --wcs-grid-highlight-color - Color for selected rows\n * @cssprop --wcs-grid-column-border-left - Left border of all grid headers\n * @slot grid-column - The slot containing the column of the grid in the `<thead>`\n * @slot grid-pagination - The slot containing the pagination of the grid below the `<table>`\n */\n@Component({\n    tag: 'wcs-grid',\n    styleUrl: 'grid.scss',\n    shadow: true\n})\nexport class Grid implements ComponentInterface, ComponentDidLoad {\n    @Element() private el!: HTMLWcsGridElement;\n    /**\n     * Manage sort and pagination with a backend server when set to `true`\n     */\n    @Prop() serverMode: boolean = false;\n    /**\n     * Contains the data to display in the table from a js object\n     */\n    @Prop() data: any[];\n    /**\n     * Flag to display a spinner during data loading\n     */\n    @Prop() loading: boolean;\n    /**\n     * Used to manage grid's row selection.  \n     * \"none\": no row can be selected.  \n     * \"multiple\": several rows can be selected.  \n     * \"single\": one row only can be selected.  \n     */\n    @Prop() selectionConfig: WcsGridSelectionConfig = 'none';\n    /**\n     * Set the selected items (rows)\n     */\n    @Prop() selectedItems: any | any[] = [];\n    /**\n     * Automatically set by the component to reference the wcs-grid-pagination HTML element by its id.\n     */\n    @Prop() wcsGridPaginationId: string;\n    /**\n     * Name of the object's key that will be used to display the cells whose `keyValue` attribute matches to the\n     * object's value for this key.\n     */\n    @Prop() rowIdPath: string;\n    @State() private columns: HTMLWcsGridColumnElement[];\n    @State() private paginationEl: HTMLWcsGridPaginationElement;\n    /**\n     * Rows to display, contains user data and meta data\n     */\n    @State() private rows: WcsGridRow[] = [];\n    /**\n     * Event emitted when a row is selected or unselected\n     */\n    @Event() wcsGridSelectionChange!: EventEmitter<WcsGridRowSelectedEventDetails>;\n    /**\n     * Event emitted when all rows are selected or unselected\n     */\n    @Event() wcsGridAllSelectionChange!: EventEmitter<WcsGridAllRowSelectedEventDetails>;\n\n    @Watch('data')\n    onDataChange(newValue: any[]): void {\n        this.updateGridRows(newValue);\n        this.refreshSort(false);\n    }\n\n    @Watch('selectedItems')\n    onSelectedItemsPropertyChange(newValue: any | any[]) {\n        this.updateSelectionWithValues(newValue);\n    }\n\n    @Listen('wcsHiddenChange')\n    onHiddenColumnChange(): void {\n        // We use forceUpdate because the fact of hiding a column or not does not modify the internal structure of the grid (WcsGridRow).\n        // Hide a column only impacts the way it is rendered but the grid-column remains in the dom and in our internal model.\n        forceUpdate(this);\n    }\n\n    private updateSelectionWithValues(values: any | any[]) {\n        if (this.selectionConfig === 'single') {\n            this.rows.map(r => r.selected = false);\n            for (const row of this.rows) {\n                if (isEqual(row.data, values)) {\n                    row.selected = true;\n                    break; // only one line can be selected\n                }\n            }\n        } else if (this.selectionConfig === 'multiple') {\n            this.rows.map(r => r.selected = false);\n            for (const row of this.rows) {\n                if (values.find(x => isEqual(x, row.data))) {\n                    row.selected = true;\n                }\n            }\n        }\n        this.rows = cloneDeep(this.rows);\n    }\n\n    private wcsGridRowToWcsGridRowData(row: WcsGridRow): WcsGridRowData {\n        return {selected: row.selected, page: row.page, data: row.data};\n    }\n\n    private updateGridRows(data: any[]): void {\n        const rows: WcsGridRow[] = [];\n        if (data && this.columns) {\n            // eslint-disable-next-line @typescript-eslint/prefer-for-of\n            for (let i = 0; i < data.length; i++) {\n                const row: WcsGridRow = {\n                    uuid: uuid(),\n                    data: data[i],\n                    selected: false,\n                    cells: []\n                };\n                for (const column of this.columns) {\n                    row.cells.push({\n                        content: get(data[i], column.path),\n                        column,\n                        formatter: column.formatter\n                    })\n                }\n                rows.push(row);\n            }\n            this.rows = rows;\n            this.updatePageIndex();\n        }\n    }\n\n    componentDidLoad(): void {\n        this.columns = this.getGridColumnsFromTemplate();\n        this.paginationEl = this.wcsGridPaginationId\n            ? document.getElementById(this.wcsGridPaginationId) as HTMLWcsGridPaginationElement\n            : this.getGridPaginationsFromTemplate()[0];\n        this.updateGridRows(this.data);\n        if (this.selectedItems) {\n            this.updateSelectionWithValues(this.selectedItems);\n        }\n        this.refreshSort(true);\n    }\n\n    /**\n     * Handle existing column's filters (defined before the grid is instantiated)\n     * @private\n     */\n    private refreshSort(refreshOthersColmumnsSortOrderState: boolean) {\n        //fixme: why the column property can be null or undefined?\n        if (this.columns) {\n            const [first, ...other] = this.columns.filter(c => c.sortOrder !== 'none');\n            if (first && !this.serverMode) {\n                this.sortBy(first);\n            }\n            refreshOthersColmumnsSortOrderState && this.disableSortOrderForColumns(other);\n        }\n    }\n\n    private disableSortOrderForColumns(columns: HTMLWcsGridColumnElement[] | null | undefined): void {\n        columns?.forEach(c => c.sortOrder = 'none');\n    }\n\n    private getGridColumnsFromTemplate(): HTMLWcsGridColumnElement[] {\n        const slotted = this.el.shadowRoot.querySelector('slot[name=\"grid-column\"]') as HTMLSlotElement;\n        return slotted.assignedElements() as any as HTMLWcsGridColumnElement[];\n    }\n\n    private getGridPaginationsFromTemplate(): HTMLWcsGridPaginationElement[] {\n        const slotted = this.el.shadowRoot.querySelector('slot[name=\"grid-pagination\"]') as HTMLSlotElement;\n        return slotted.assignedElements() as any as HTMLWcsGridPaginationElement[];\n    }\n\n    @Listen('wcsSortChange')\n    sortChangeEventHandler(event: CustomEvent<WcsGridColumnSortChangeEventDetails>): void {\n        if (event.detail.order === 'none') return;\n        // We keep only one active sort column\n        this.disableSortOrderForColumns(this.columns.filter(c => c !== event.detail.column));\n        if (this.serverMode) return;\n        this.sortBy(event.detail.column);\n        this.updatePageIndex();\n    }\n\n    /**\n     * Sorts the grid rows according to the given column's configuration\n     * @param colmun Column from which to extract the sorting configuration\n     * @private\n     */\n    private sortBy(colmun: HTMLWcsGridColumnElement) {\n        if (colmun.sortFn) {\n            this.rows = cloneDeep(this.rows)\n                .sort((a: any, b: any) => colmun.sortFn(a.data, b.data, colmun) * getSortOrderInteger(colmun.sortOrder));\n        } else {\n            this.rows = cloneDeep(this.rows)\n                .sort((a: any, b: any) => {\n                    const path = colmun.path;\n                    return ((get(a.data, path) < get(b.data, path)) ? -1 : (get(a.data, path) > get(b.data, path)) ? 1 : 0) * getSortOrderInteger(colmun.sortOrder);\n                });\n        }\n    }\n\n    /**\n     * Update the page's number of all rows\n     */\n    private updatePageIndex(): void {\n        if (!this.serverMode && this.paginationEl) {\n            this.paginationEl.itemsCount = this.data.length;\n            this.paginationEl.pageCount = Math.ceil(this.data.length / this.paginationEl.pageSize);\n\n            if (this.paginationEl.pageCount <= 1) {\n                this.paginationEl.currentPage = GridPagination.INDEX_FIRST_PAGE;\n            } else if (this.paginationEl.pageCount > 0 && this.paginationEl.currentPage + 1 > this.paginationEl.pageCount) {\n                this.paginationEl.currentPage = this.paginationEl.pageCount - 1;\n            }\n\n            const rows = cloneDeep(this.rows);\n            rows.forEach((row: WcsGridRow, index: number) =>\n                row.page = Math.floor(index / this.paginationEl.pageSize)\n            );\n            this.rows = [...rows];\n        }\n    }\n\n    @Listen('wcsGridPaginationChange')\n    paginationChangeEventHandler(): void {\n        this.onPaginationChange();\n    }\n\n    @Listen('wcsGridPaginationChange', {target: 'window'})\n    paginationChangeEventHandlerOutside(event: CustomEvent<WcsGridPaginationChangeEventDetails>): void {\n        if (this.wcsGridPaginationId && this.wcsGridPaginationId === (event.target as HTMLElement).id) {\n            this.onPaginationChange();\n        }\n    }\n\n    private onPaginationChange(): void {\n        if (this.serverMode) return;\n        this.updatePageIndex();\n    }\n\n    private onRowSelection(row: WcsGridRow): void {\n        if (this.selectionConfig === 'single') {\n            this.rows.filter(r => r.uuid !== row.uuid).map(r => r.selected = false);\n        }\n        row.selected = !row.selected;\n        if (this.selectionConfig !== 'single' || row.selected) {\n            this.wcsGridSelectionChange.emit({row: this.wcsGridRowToWcsGridRowData(row)});\n        }\n        this.rows = cloneDeep(this.rows);\n    }\n\n    private selectAllRows(): void {\n        const rows = this.getRowsForCurrentPage();\n        const selected = !this.allRowsAreSelected();\n        rows.map(r => r.selected = selected);\n        this.wcsGridAllSelectionChange.emit({rows: selected ? rows.map(row => this.wcsGridRowToWcsGridRowData(row)) : []});\n        this.rows = cloneDeep(this.rows);\n    }\n\n    private allRowsAreSelected(): boolean {\n        const rows = this.getRowsForCurrentPage();\n        return rows.length > 0 && rows.filter(row => row.selected).length === rows.length;\n    }\n\n    private getRowsForCurrentPage(): WcsGridRow[] {\n        if (this.paginationEl) {\n            return this.rows.filter(row => row.page === this.paginationEl.currentPage);\n        }\n        return this.rows;\n    }\n\n    renderSelectionColumn(row: WcsGridRow): any {\n        switch (this.selectionConfig) {\n            case 'none':\n                return;\n            case 'single':\n                return <td>\n                    <wcs-radio checked={row.selected} onWcsRadioClick={this.onRowSelection.bind(this, row)}/>\n                </td>;\n            case 'multiple':\n                return <td>\n                    <wcs-checkbox checked={row.selected} onWcsChange={this.onRowSelection.bind(this, row)}/>\n                </td>;\n        }\n    }\n\n    private getCellContent(row: WcsGridRow, cell: WcsGridCell): HTMLElement | HTMLElement[] | string | void {\n        if (cell.formatter) {\n            return cell.formatter(\n                (h as unknown) as HyperFunc<VNode>,\n                cell.column,\n                this.wcsGridRowToWcsGridRowData(row)\n            );\n        }\n        return cell.content;\n    }\n\n    private totalColumnCount() {\n        if (!this.columns) {\n            return 0;\n        }\n        return this.columns.length + (this.selectionConfig === 'none' ? 0 : 1);\n    }\n\n    render(): any {\n        return (\n            <Host>\n                {\n                    <table>\n                        <thead>\n                        {\n                            this.selectionConfig === 'none' ? ''\n                                : <th class=\"wcs-grid-selection-column\">\n                                    {\n                                        this.selectionConfig === 'single' ? '' :\n                                            <wcs-checkbox checked={this.allRowsAreSelected()}\n                                                          onWcsChange={this.selectAllRows.bind(this)}/>\n                                    }\n                                </th>\n                        }\n                        <slot name=\"grid-column\"></slot>\n                        </thead>\n                        <tbody>\n                        {\n                            this.loading\n                                ? <tr>\n                                    <td colSpan={this.totalColumnCount()} class=\"loading\">\n                                        <wcs-spinner></wcs-spinner>\n                                    </td>\n                                </tr>\n                                : this.rows\n                                    ?.filter(row => this.serverMode || !this.paginationEl || row.page === this.paginationEl.currentPage)\n                                    .map(row =>\n                                        this.renderRow(row)\n                                    )\n                        }\n                        </tbody>\n                    </table>\n                }\n                <slot name=\"grid-pagination\"></slot>\n            </Host>\n        );\n    }\n\n    private renderRow(row: WcsGridRow) {\n        return <tr class={row.selected ? 'selected' : ''}>\n            {this.renderSelectionColumn(row)}\n            {row.cells?.map(cell => {\n                    if (cell.column.hidden) {\n                        return;\n                    }\n                    return cell.column.customCells\n                        ? (<td>\n                            <slot name={cell.column.id + '-' + row.data[this.rowIdPath]}/>\n                        </td>)\n                        : (<td part={cell.column.path + '-column'}>{this.getCellContent(row, cell)}</td>)\n                }\n            )}\n        </tr>;\n    }\n}\n\n/**\n * Pour resize le tableau\n * https://www.brainbell.com/javascript/making-resizable-table-js.htmls\n *\n */\n"]}
+{"version":3,"file":"grid.js","sourceRoot":"","sources":["../../../src/components/grid/grid.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n    Component,\n    ComponentDidLoad,\n    ComponentInterface,\n    Element,\n    Event,\n    EventEmitter,\n    forceUpdate,\n    h,\n    Host,\n    Listen,\n    Prop,\n    State,\n    VNode,\n    Watch\n} from '@stencil/core';\nimport {\n    getSortOrderInteger,\n    HyperFunc,\n    WcsGridAllRowSelectedEventDetails,\n    WcsGridCell,\n    WcsGridColumnSortChangeEventDetails,\n    WcsGridPaginationChangeEventDetails,\n    WcsGridRow,\n    WcsGridRowData,\n    WcsGridSelectionConfig, \n    WcsGridSelectionEventDetails,\n} from './grid-interface';\nimport { v4 as uuid } from 'uuid';\nimport { cloneDeep, get, isEqual } from 'lodash-es';\nimport { GridPagination } from '../grid-pagination/grid-pagination';\nimport { getActionForKeyboardEvent, KeyboardEventAssociatedAction } from \"./grid-keyboard-event\";\n\ninterface GridElementWithCoordinates {\n    el: HTMLTableCellElement,\n    row: number,\n    col: number,\n}\n\n/**\n * The grid component is a complex component used as an HTML table to display collections of data.\n *\n * @cssprop --wcs-grid-highlight-color - Color for selected rows\n * @cssprop --wcs-grid-column-border-left - Left border of all grid headers\n * @slot grid-column - The slot containing the column of the grid in the `<thead>`\n * @slot grid-pagination - The slot containing the pagination of the grid below the `<table>`\n */\n@Component({\n    tag: 'wcs-grid',\n    styleUrl: 'grid.scss',\n    shadow: true\n})\nexport class Grid implements ComponentInterface, ComponentDidLoad {\n    @Element() private el!: HTMLWcsGridElement;\n    /**\n     * Manage sort and pagination with a backend server when set to `true`\n     */\n    @Prop() serverMode: boolean = false;\n    /**\n     * Contains the data to display in the table from a js object\n     */\n    @Prop() data: any[];\n    /**\n     * Flag to display a spinner during data loading\n     */\n    @Prop() loading: boolean;\n    /**\n     * Used to manage grid's row selection.  \n     * \"none\": no row can be selected.  \n     * \"multiple\": several rows can be selected.  \n     * \"single\": one row only can be selected.  \n     */\n    @Prop() selectionConfig: WcsGridSelectionConfig = 'none';\n    /**\n     * Set the selected items (rows)\n     */\n    @Prop() selectedItems: any | any[] = [];\n    /**\n     * Automatically set by the component to reference the wcs-grid-pagination HTML element by its id.\n     */\n    @Prop() wcsGridPaginationId: string;\n    /**\n     * Name of the object's key that will be used to display the cells whose `keyValue` attribute matches to the\n     * object's value for this key.\n     */\n    @Prop() rowIdPath: string;\n    @State() private columns: HTMLWcsGridColumnElement[];\n    @State() private paginationEl: HTMLWcsGridPaginationElement;\n    /**\n     * Rows to display, contains user data and meta data\n     */\n    @State() private rows: WcsGridRow[] = [];\n    /**\n     * Event emitted when a row is selected or unselected\n     */\n    @Event() wcsGridSelectionChange!: EventEmitter<WcsGridSelectionEventDetails>;\n    /**\n     * Event emitted when all rows are selected or unselected\n     */\n    @Event() wcsGridAllSelectionChange!: EventEmitter<WcsGridAllRowSelectedEventDetails>;\n    \n    /**\n     * Used to track the focus position in the grid for keyboard navigation.  \n     * Header row : index 0  \n     * First column :\n     *   - index 1 if selection mode multiple or single\n     *   - index 0 if no selection mode\n     * Default position : col 0, row 1\n     */\n    @State() private cursorPosition: {col: number, row: number} = {col: 0, row: 1};\n    \n    @Watch('cursorPosition')\n    onCursorPositionChange(newValue: {col: number, row: number}): void {\n        // Notify all grid columns that the cursorPosition has changed\n        this.getGridColumnsFromTemplate().forEach(g => g.cursorPosition = newValue);\n    }\n    \n    @Watch('data')\n    onDataChange(newValue: any[]): void {\n        this.updateGridRows(newValue);\n        this.refreshSort(false);\n    }\n\n    @Watch('selectedItems')\n    onSelectedItemsPropertyChange(newValue: any | any[]) {\n        this.updateSelectionWithValues(newValue);\n    }\n    \n    @Listen('focus')\n    onFocus() {\n        this.getElementToFocusAtCursorPosition()?.focus();\n    }\n\n    /**\n     * If selectionConfig is different from `none`, that means that an extra column for radio or checkbox is rendered\n     * in the table.\n     */\n    hasSelectionColumn() {\n        return this.selectionConfig !== 'none';\n    }\n    \n    /**\n     * Returns the element to focus at the current cursor position : it can be a cell (td, th) to focus or a nested\n     * checkbox / radio element if the selection mode is single or multiple\n     */\n    getElementToFocusAtCursorPosition(): HTMLTableCellElement | HTMLWcsCheckboxElement | HTMLWcsRadioElement {\n        const el = this.gridElementsWithCoordinates.find(cell =>\n            cell.col === this.cursorPosition?.col && cell.row === this.cursorPosition?.row)?.el;\n        return this.hasSelectionColumn()\n            ? el.querySelector('wcs-checkbox,wcs-radio') ?? el\n            : el;\n    }\n    \n    moveCursorPosition(directionX: number | 'first' | 'last', directionY: number | 'first' | 'last') {\n        this.cursorPosition = {\n            col: directionX === 'first' ? 0 :\n                directionX === 'last' ? this.totalDisplayedColumnCount() - 1 :\n                    Math.min(Math.max(this.cursorPosition.col + directionX, 0), this.totalDisplayedColumnCount() - 1),\n            row: directionY === 'first' ? 0 :\n                directionY === 'last' ? this.getRowsForCurrentPage().length :\n                    Math.min(Math.max(this.cursorPosition.row + directionY, 0), this.getRowsForCurrentPage().length)\n        };\n        \n        this.handleCursorPositionOnEmptyTh();\n        \n        this.getElementToFocusAtCursorPosition()?.focus();\n    }\n\n    /**\n     * When the grid has selectionConfig single, an empty th appears at col=0, row=0.\n     * It should not be focusable so the cursor navigates to col=1, row=0 instead.\n     */\n    handleCursorPositionOnEmptyTh() {\n        if (this.selectionConfig === 'single' && this.cursorPosition.col === 0 && this.cursorPosition.row === 0) {\n            this.cursorPosition = {\n                col: 1,\n                row: 0\n            }\n        }\n    }\n\n    @Listen('wcsHiddenChange')\n    onHiddenColumnChange(): void {\n        // We use forceUpdate because the fact of hiding a column or not does not modify the internal structure of the grid (WcsGridRow).\n        // Hide a column only impacts the way it is rendered but the grid-column remains in the dom and in our internal model.\n        forceUpdate(this);\n        this.cursorPosition = { col: 0 , row: 1 }\n    }\n\n    @Listen('keydown')\n    onKeyDown(_event: KeyboardEvent) {\n        if (document.activeElement?.tagName === 'WCS-GRID-PAGINATION') {\n            return;\n        }\n        \n        let type: 'grid_no_selection' | 'grid_selection_single' | 'grid_selection_multiple';\n        \n        switch (this.selectionConfig) {\n            case \"multiple\":\n                type = 'grid_selection_multiple';\n                break;\n            case \"single\":\n                type = 'grid_selection_single';\n                break;\n            case \"none\":\n                type = 'grid_no_selection';\n                break;\n        }\n\n        const actionsFromKeyboardEvents: KeyboardEventAssociatedAction[] = getActionForKeyboardEvent(_event, type);\n\n        // If we have at least one associated actions, we prevent the default behavior of the event. \n        // Except if the action is a focus move (we have to handle the preventDefault behavior ourselves in the action implementation)\n        if (actionsFromKeyboardEvents.length != 0) {\n            _event.preventDefault();\n        }\n\n        for (const actionFromKeyboardEvent of actionsFromKeyboardEvents) {\n            this.doActionFromKeyboardEventAssociatedAction(actionFromKeyboardEvent, _event);\n        }\n    }\n\n    doActionFromKeyboardEventAssociatedAction(actionFromKeyboardEvent: KeyboardEventAssociatedAction, event: KeyboardEvent) {\n        switch (actionFromKeyboardEvent.kind) {\n            case \"FocusCell\":\n                switch (actionFromKeyboardEvent.target) {\n                    case \"up\":\n                        this.moveCursorPosition(0, -1);\n                        break;\n                    case \"down\":\n                        this.moveCursorPosition(0, 1);\n                        break;\n                    case \"left\":\n                        this.moveCursorPosition(-1, 0);\n                        break;\n                    case \"right\":\n                        this.moveCursorPosition(1, 0);\n                        break;\n                    case \"first_of_row\":\n                        this.moveCursorPosition('first', 0);\n                        break;\n                    case \"last_of_row\":\n                        this.moveCursorPosition('last', 0);\n                        break;\n                    case \"first_of_grid\":\n                        this.moveCursorPosition('first', 'first');\n                        break;\n                    case \"last_of_grid\":\n                        this.moveCursorPosition('last', 'last');\n                        break;\n                    default:\n                        break;\n                }\n            case \"SelectRow\":\n                switch (actionFromKeyboardEvent.target) {\n                    case \"one\":\n                        event.preventDefault();\n                        if (this.cursorPosition.row > 0) {\n                            this.onRowSelection(this.rows[this.cursorPosition.row - 1]);\n                        }\n                        break;\n                    case \"all\":\n                        this.selectAllRows();\n                        break;\n                    default:\n                        break;\n                }\n                break;\n            default:\n                throw new Error(\"Internal error\");\n        }\n    }\n    \n    \n    @Listen('mousedown')\n    onClick(_event: MouseEvent) {\n        const clickedGridElement: HTMLTableCellElement = _event.composedPath()\n            .filter(x => ['TD', 'TH']\n            .includes((x as HTMLElement).nodeName))[0] as HTMLTableCellElement;\n        \n        const clickedGridElementWithCoordinates = this.gridElementsWithCoordinates.find(e => e.el === clickedGridElement);\n        \n        this.cursorPosition = {\n            col: clickedGridElementWithCoordinates.col,\n            row: clickedGridElementWithCoordinates.row,\n        }\n    }\n\n    private updateSelectionWithValues(values: any | any[]) {\n        if (this.selectionConfig === 'single') {\n            this.rows.map(r => r.selected = false);\n            for (const row of this.rows) {\n                if (isEqual(row.data, values)) {\n                    row.selected = true;\n                    break; // only one line can be selected\n                }\n            }\n        } else if (this.selectionConfig === 'multiple') {\n            this.rows.map(r => r.selected = false);\n            for (const row of this.rows) {\n                if (values.find(x => isEqual(x, row.data))) {\n                    row.selected = true;\n                }\n            }\n        }\n        this.rows = cloneDeep(this.rows);\n    }\n\n    private wcsGridRowToWcsGridRowData(row: WcsGridRow): WcsGridRowData {\n        return {selected: row.selected, page: row.page, data: row.data};\n    }\n\n    private updateGridRows(data: any[]): void {\n        const rows: WcsGridRow[] = [];\n        if (data && this.columns) {\n            // eslint-disable-next-line @typescript-eslint/prefer-for-of\n            for (let i = 0; i < data.length; i++) {\n                const row: WcsGridRow = {\n                    uuid: uuid(),\n                    data: data[i],\n                    selected: false,\n                    cells: []\n                };\n                let index = 0;\n                for (const column of this.columns) {\n                    column.columnPosition = index + (this.hasSelectionColumn() ? 1 : 0);\n                    index++;\n                    row.cells.push({\n                        content: get(data[i], column.path),\n                        column,\n                        formatter: column.formatter\n                    })\n                }\n                rows.push(row);\n            }\n            this.rows = rows;\n            this.updatePageIndex();\n        }\n    }\n\n    componentDidLoad(): void {\n        this.columns = this.getGridColumnsFromTemplate();\n        this.paginationEl = this.wcsGridPaginationId\n            ? document.getElementById(this.wcsGridPaginationId) as HTMLWcsGridPaginationElement\n            : this.getGridPaginationsFromTemplate()[0];\n        this.updateGridRows(this.data);\n        if (this.selectedItems) {\n            this.updateSelectionWithValues(this.selectedItems);\n        }\n        this.refreshSort(true);\n    }\n\n    /**\n     * Handle existing column's filters (defined before the grid is instantiated)\n     * @private\n     */\n    private refreshSort(refreshOthersColumnsSortOrderState: boolean) {\n        //fixme: why the column property can be null or undefined?\n        if (this.columns) {\n            const [first, ...other] = this.columns.filter(c => c.sortOrder !== 'none');\n            if (first && !this.serverMode) {\n                this.sortBy(first);\n            }\n            refreshOthersColumnsSortOrderState && this.disableSortOrderForColumns(other);\n        }\n    }\n\n    private disableSortOrderForColumns(columns: HTMLWcsGridColumnElement[] | null | undefined): void {\n        columns?.forEach(c => c.sortOrder = 'none');\n    }\n\n    private getGridColumnsFromTemplate(): HTMLWcsGridColumnElement[] {\n        const slotted = this.el.shadowRoot.querySelector('slot[name=\"grid-column\"]') as HTMLSlotElement;\n        return slotted.assignedElements() as any as HTMLWcsGridColumnElement[];\n    }\n\n    private getGridPaginationsFromTemplate(): HTMLWcsGridPaginationElement[] {\n        const slotted = this.el.shadowRoot.querySelector('slot[name=\"grid-pagination\"]') as HTMLSlotElement;\n        return slotted.assignedElements() as any as HTMLWcsGridPaginationElement[];\n    }\n    \n    private get gridElementsWithCoordinates(): GridElementWithCoordinates[] {\n        const gridElements: GridElementWithCoordinates[] = [];\n        // If selection multiple, the first cell should be added to the list\n        if (this.selectionConfig === 'multiple') {\n            gridElements.push({\n                el: this.el.shadowRoot.querySelector('th'),\n                row: 0,\n                col: 0\n            });\n        }\n        this.getGridColumnsFromTemplate()\n          .filter(col => !col.hidden)\n          .forEach((col, index) => {\n              gridElements.push({\n                  el: col.shadowRoot.querySelector('th'),\n                  row: 0,\n                  col: index + (this.hasSelectionColumn() ? 1 : 0),\n              });\n          });\n        this.el.shadowRoot.querySelectorAll('td').forEach((cell, index) => {\n            gridElements.push({\n                el: cell,\n                row: 1 + Math.floor(index / this.totalDisplayedColumnCount()),\n                col: index % this.totalDisplayedColumnCount(),\n            });\n        });\n        \n        return gridElements;\n    }\n\n    @Listen('wcsSortChange')\n    sortChangeEventHandler(event: CustomEvent<WcsGridColumnSortChangeEventDetails>): void {\n        if (event.detail.order === 'none') return;\n        // We keep only one active sort column\n        this.disableSortOrderForColumns(this.columns.filter(c => c !== event.detail.column));\n        if (this.serverMode) return;\n        this.sortBy(event.detail.column);\n        this.updatePageIndex();\n    }\n\n    /**\n     * Sorts the grid rows according to the given column's configuration\n     * @param column Column from which to extract the sorting configuration\n     * @private\n     */\n    private sortBy(column: HTMLWcsGridColumnElement) {\n        if (column.sortFn) {\n            this.rows = cloneDeep(this.rows)\n                .sort((a: any, b: any) => column.sortFn(a.data, b.data, column) * getSortOrderInteger(column.sortOrder));\n        } else {\n            this.rows = cloneDeep(this.rows)\n                .sort((a: any, b: any) => {\n                    const path = column.path;\n                    return ((get(a.data, path) < get(b.data, path)) ? -1 : (get(a.data, path) > get(b.data, path)) ? 1 : 0) * getSortOrderInteger(column.sortOrder);\n                });\n        }\n    }\n\n    /**\n     * Update the page's number of all rows\n     */\n    private updatePageIndex(): void {\n        if (!this.serverMode && this.paginationEl) {\n            this.paginationEl.itemsCount = this.data.length;\n            this.paginationEl.pageCount = Math.ceil(this.data.length / this.paginationEl.pageSize);\n\n            if (this.paginationEl.pageCount <= 1) {\n                this.paginationEl.currentPage = GridPagination.INDEX_FIRST_PAGE;\n            } else if (this.paginationEl.pageCount > 0 && this.paginationEl.currentPage + 1 > this.paginationEl.pageCount) {\n                this.paginationEl.currentPage = this.paginationEl.pageCount - 1;\n            }\n\n            const rows = cloneDeep(this.rows);\n            rows.forEach((row: WcsGridRow, index: number) =>\n                row.page = Math.floor(index / this.paginationEl.pageSize)\n            );\n            this.rows = [...rows];\n        }\n    }\n\n    @Listen('wcsGridPaginationChange')\n    paginationChangeEventHandler(): void {\n        this.onPaginationChange();\n    }\n\n    @Listen('wcsGridPaginationChange', {target: 'window'})\n    paginationChangeEventHandlerOutside(event: CustomEvent<WcsGridPaginationChangeEventDetails>): void {\n        if (this.wcsGridPaginationId && this.wcsGridPaginationId === (event.target as HTMLElement).id) {\n            this.onPaginationChange();\n        }\n    }\n\n    private onPaginationChange(): void {\n        if (this.serverMode) return;\n        this.updatePageIndex();\n    }\n\n    private onRowSelection(row: WcsGridRow): void {\n        if (this.selectionConfig === 'single') {\n            this.rows.filter(r => r.uuid !== row.uuid).map(r => r.selected = false);\n        }\n        row.selected = !row.selected;\n        if (this.selectionConfig !== 'single' || row.selected) {\n            this.wcsGridSelectionChange.emit({\n                selectedRows: this.selectedRows.map(row => this.wcsGridRowToWcsGridRowData(row)),\n                changedRow: this.wcsGridRowToWcsGridRowData(row)\n            });\n        }\n        this.rows = cloneDeep(this.rows);\n    }\n\n    private get selectedRows(): WcsGridRow[] {\n        return this.rows.filter(r => r.selected);\n    }\n\n    private selectAllRows(): void {\n        const rows = this.getRowsForCurrentPage();\n        const selected = !this.allRowsAreSelected();\n        rows.map(r => r.selected = selected);\n        this.wcsGridAllSelectionChange.emit({rows: selected ? rows.map(row => this.wcsGridRowToWcsGridRowData(row)) : []});\n        this.wcsGridSelectionChange.emit({ \n            selectedRows: this.selectedRows.map(row => this.wcsGridRowToWcsGridRowData(row)),\n            changedRow: 'allCheckbox'\n        });\n        this.rows = cloneDeep(this.rows);\n    }\n\n    private allRowsAreSelected(): boolean {\n        const rows = this.getRowsForCurrentPage();\n        return rows.length > 0 && rows.filter(row => row.selected).length === rows.length;\n    }\n\n    private getRowsForCurrentPage(): WcsGridRow[] {\n        if (this.paginationEl) {\n            return this.rows.filter(row => row.page === this.paginationEl.currentPage);\n        }\n        return this.rows;\n    }\n\n    renderSelectionColumn(row: WcsGridRow, rowIndex: number): any {\n        switch (this.selectionConfig) {\n            case 'none':\n                return;\n            case 'single': \n                return <td aria-colindex={this.atLeastOneColumnHidden() ? 1 : null}\n                           tabIndex={this.cursorPosition?.col === 0 && rowIndex + 1 === this.cursorPosition?.row ? 0 : -1}>\n                    <wcs-radio tabIndex={-1}\n                               checked={row.selected} onWcsRadioClick={this.onRowSelection.bind(this, row)}/>\n                </td>;\n            case 'multiple': \n                return <td aria-colindex={this.atLeastOneColumnHidden() ? 1 : null}\n                           tabIndex={this.cursorPosition?.col === 0 && rowIndex + 1 === this.cursorPosition?.row ? 0 : -1}>\n                    <wcs-checkbox tabIndex={-1}\n                                  checked={row.selected} onWcsChange={this.onRowSelection.bind(this, row)}/>\n                </td>;\n        }\n    }\n\n    private getCellContent(row: WcsGridRow, cell: WcsGridCell): HTMLElement | HTMLElement[] | string | void {\n        if (cell.formatter) {\n            return cell.formatter(\n                (h as unknown) as HyperFunc<VNode>,\n                cell.column,\n                this.wcsGridRowToWcsGridRowData(row)\n            );\n        }\n        return cell.content;\n    }\n\n    /**\n     * Returns the total number of columns\n     * @private\n     */\n    private totalColumnCount() {\n        if (!this.columns) {\n            return 0;\n        }\n        return this.columns.length + (this.hasSelectionColumn() ? 1 : 0);\n    }\n\n    /**\n     * Returns the total number of columns that are not hidden\n     * @private\n     */\n    private totalDisplayedColumnCount() {\n        return this.totalColumnCount() - this.columns?.filter(col => col.hidden).length ?? 0;\n    }\n\n    /**\n     * Returns true if at least one column is hidden from the table\n     * @private\n     */\n    private atLeastOneColumnHidden() {\n        return this.totalDisplayedColumnCount() !== this.totalColumnCount();\n    }\n    \n    render(): any {\n        return (\n          <Host>\n              {\n                  <table role=\"grid\"\n                         aria-rowcount={!this.loading && this.rows?.length}\n                         aria-colcount={!this.loading && this.totalDisplayedColumnCount()}>\n                      <thead>\n                      <tr aria-rowindex=\"1\">\n                          {\n                              this.selectionConfig === 'none' ? ''\n                                : <th class=\"wcs-grid-selection-column\">\n                                    {\n                                        this.selectionConfig === 'single' ? '' :\n                                          <wcs-checkbox tabIndex={this.cursorPosition?.col === 0\n                                                                    && this.cursorPosition?.row === 0  ? 0 : -1}\n                                                        checked={this.allRowsAreSelected()}\n                                                        onWcsChange={this.selectAllRows.bind(this)}/>\n                                    }\n                                </th>\n                          }\n                          <slot name=\"grid-column\"></slot>\n                      </tr>\n                      </thead>\n                      <tbody>\n                      {\n                          this.loading\n                            ? <tr aria-busy=\"true\">\n                                <td colSpan={this.totalColumnCount()} class=\"loading\">\n                                    <wcs-spinner></wcs-spinner>\n                                </td>\n                            </tr>\n                            : this.rows\n                              ?.filter(row => this.serverMode || !this.paginationEl || row.page === this.paginationEl.currentPage)\n                              .map((row, index) =>\n                                this.renderRow(row, index)\n                              )\n                      }\n                      </tbody>\n                  </table>\n              }\n              <slot name=\"grid-pagination\"></slot>\n          </Host>\n        );\n    }\n\n    /**\n     * Returns the row with all mapped cells inside.  \n     * The aria-rowindex here starts at 2 because the header row starts at index 1. \n     * @private\n     */ \n    private renderRow(row: WcsGridRow, rowIndex: number) {\n        let hiddenColumnCount = 0;\n        return <tr class={row.selected ? 'selected' : ''}\n                   aria-selected={row.selected ? 'true' : null}\n                   aria-rowindex={rowIndex + 2}>\n            {this.renderSelectionColumn(row, rowIndex)}\n            {row.cells?.map((cell, cellIndex) => {\n                    if (cell.column.hidden) {\n                        hiddenColumnCount++;\n                        return;\n                    }\n                    const nonHiddenColumnIndex =  cellIndex - hiddenColumnCount + 1 + (this.hasSelectionColumn() ? 1 : 0);\n                    const cursorIsOnCell = nonHiddenColumnIndex - 1 === this.cursorPosition?.col \n                      && rowIndex + 1 === this.cursorPosition?.row;\n                    return cell.column.customCells\n                        ? (<td tabIndex={cursorIsOnCell ? 0 : -1}\n                               aria-colindex={this.atLeastOneColumnHidden() ? nonHiddenColumnIndex : null}>\n                            <slot name={cell.column.id + '-' + row.data[this.rowIdPath]}/>\n                        </td>)\n                        : (<td tabIndex={cursorIsOnCell ? 0 : -1}\n                               aria-colindex={this.atLeastOneColumnHidden() ? nonHiddenColumnIndex : null}\n                               part={cell.column.path + '-column'}>{this.getCellContent(row, cell)}</td>)\n                }\n            )}\n        </tr>;\n    }\n}\n\n/**\n * Pour resize le tableau\n * https://www.brainbell.com/javascript/making-resizable-table-js.htmls\n *\n */\n"]}

package/dist/collection/components/grid-column/grid-column.css

@@ -16,6 +16,11 @@
 :host th .grid-column-th-content span {
   user-select: none;
 }
+:host th:focus-visible {
+  outline: 2px dashed var(--wcs-primary);
+  outline-offset: 0;
+  border-radius: 0.1rem;
+}
 :host .pointer {
   cursor: pointer;
 }