arengibook 3.1.1-main → 3.1.2-main

package/dist/index.js

@@ -50425,6 +50425,13 @@ var Table$1 = function Table(_ref13) {
     _useState40 = _slicedToArray$d(_useState39, 2),
     visibleColumns = _useState40[0],
     setVisibleColumns = _useState40[1];
+  // Colonnes de tête (frozen) rendues AVANT les colonnes de données : sélection,
+  // suppression, actions. PrimeReact applique les largeurs sauvegardées par
+  // nth-child(index) sur l'ensemble des <th> — il faut donc que le tableau de
+  // largeurs inclue ces colonnes, sinon tout est décalé et le tbody s'effondre.
+  var leadingColCount = (rowSelection ? 1 : 0) + (onDeleteRow ? 1 : 0) + (columns.some(function (c) {
+    return c.actionsField;
+  }) ? 1 : 0);
   var _useState41 = useState(''),
     _useState42 = _slicedToArray$d(_useState41, 2),
     globalFilter = _useState42[0],
@@ -50454,6 +50461,9 @@ var Table$1 = function Table(_ref13) {
   var FILTER_KEY = useMemo(function () {
     return tableId ? "Table:filterVisible:".concat(tableId) : 'Table:filterVisible';
   }, [tableId]);
+  var FILTERS_VALUES_KEY = useMemo(function () {
+    return tableId ? "Table:filters:".concat(tableId) : 'Table:filters';
+  }, [tableId]);
   var _useState49 = useState(function () {
       try {
         var _JSON$parse;
@@ -50584,13 +50594,44 @@ var Table$1 = function Table(_ref13) {
     });
     return f;
   }, [columns]);
-  var _useState53 = useState(initialFilters),
+
+  // Réinjecte les valeurs de filtres persistées dans la structure courante
+  // (on garde les matchModes de `base`, on ne reprend que les `value` sauvegardées).
+  var hydrateFilters = useCallback(function (base) {
+    try {
+      var saved = JSON.parse(localStorage.getItem(FILTERS_VALUES_KEY) || '{}');
+      var merged = {};
+      Object.keys(base).forEach(function (field) {
+        merged[field] = saved[field] != null && saved[field] !== '' ? _objectSpread2(_objectSpread2({}, base[field]), {}, {
+          value: saved[field]
+        }) : base[field];
+      });
+      return merged;
+    } catch (_unused5) {
+      return base;
+    }
+  }, [FILTERS_VALUES_KEY]);
+  var persistFilters = useCallback(function (f) {
+    try {
+      var values = {};
+      Object.entries(f || {}).forEach(function (_ref14) {
+        var _ref15 = _slicedToArray$d(_ref14, 2),
+          field = _ref15[0],
+          meta = _ref15[1];
+        if (meta && meta.value != null && meta.value !== '') values[field] = meta.value;
+      });
+      if (Object.keys(values).length) localStorage.setItem(FILTERS_VALUES_KEY, JSON.stringify(values));else localStorage.removeItem(FILTERS_VALUES_KEY);
+    } catch (_unused6) {}
+  }, [FILTERS_VALUES_KEY]);
+  var _useState53 = useState(function () {
+      return hydrateFilters(initialFilters);
+    }),
     _useState54 = _slicedToArray$d(_useState53, 2),
     filters = _useState54[0],
     setFilters = _useState54[1];
   useEffect(function () {
-    setFilters(initialFilters);
-  }, [initialFilters, columnFilter]);
+    setFilters(hydrateFilters(initialFilters));
+  }, [initialFilters, columnFilter, hydrateFilters]);
   var textFilterElement = useCallback(function (options) {
     var _options$value2;
     return /*#__PURE__*/React__default.createElement(InputText, {
@@ -50669,7 +50710,7 @@ var Table$1 = function Table(_ref13) {
 
   var linkTemplate = useCallback(function (col) {
     return function (rowData) {
-      var _ref14, _col$href;
+      var _ref16, _col$href;
       var label = rowData[col.field];
       if (col.type === 'titleLink') {
         return /*#__PURE__*/React__default.createElement("div", {
@@ -50683,7 +50724,7 @@ var Table$1 = function Table(_ref13) {
           className: "table-item-title cell-text"
         }, label));
       }
-      var href = typeof col.href === 'function' ? col.href(rowData) : (_ref14 = (_col$href = col.href) !== null && _col$href !== void 0 ? _col$href : rowData[col.field + 'Url']) !== null && _ref14 !== void 0 ? _ref14 : '#';
+      var href = typeof col.href === 'function' ? col.href(rowData) : (_ref16 = (_col$href = col.href) !== null && _col$href !== void 0 ? _col$href : rowData[col.field + 'Url']) !== null && _ref16 !== void 0 ? _ref16 : '#';
       return /*#__PURE__*/React__default.createElement("div", {
         className: "arengi-table-grey-title-box",
         style: {
@@ -50755,13 +50796,13 @@ var Table$1 = function Table(_ref13) {
   }, []);
   var lienFormulaireTemplate = useCallback(function (col) {
     return function (rowData) {
-      var _col$options5, _ref15, _opt$label, _ref16, _col$href2;
+      var _col$options5, _ref17, _opt$label, _ref18, _col$href2;
       var val = rowData[col.field];
       var opt = (_col$options5 = col.options) === null || _col$options5 === void 0 ? void 0 : _col$options5.find(function (o) {
         return o.value === val;
       });
-      var label = (_ref15 = (_opt$label = opt === null || opt === void 0 ? void 0 : opt.label) !== null && _opt$label !== void 0 ? _opt$label : val) !== null && _ref15 !== void 0 ? _ref15 : '';
-      var href = typeof col.href === 'function' ? col.href(rowData) : (_ref16 = (_col$href2 = col.href) !== null && _col$href2 !== void 0 ? _col$href2 : opt === null || opt === void 0 ? void 0 : opt.href) !== null && _ref16 !== void 0 ? _ref16 : null;
+      var label = (_ref17 = (_opt$label = opt === null || opt === void 0 ? void 0 : opt.label) !== null && _opt$label !== void 0 ? _opt$label : val) !== null && _ref17 !== void 0 ? _ref17 : '';
+      var href = typeof col.href === 'function' ? col.href(rowData) : (_ref18 = (_col$href2 = col.href) !== null && _col$href2 !== void 0 ? _col$href2 : opt === null || opt === void 0 ? void 0 : opt.href) !== null && _ref18 !== void 0 ? _ref18 : null;
       if (!label) return '';
       return /*#__PURE__*/React__default.createElement("div", {
         style: {
@@ -51311,10 +51352,10 @@ var Table$1 = function Table(_ref13) {
       });
       if (option) {
         var extra = {};
-        Object.entries(col.updates).forEach(function (_ref17) {
-          var _ref18 = _slicedToArray$d(_ref17, 2),
-            targetField = _ref18[0],
-            optionProp = _ref18[1];
+        Object.entries(col.updates).forEach(function (_ref19) {
+          var _ref20 = _slicedToArray$d(_ref19, 2),
+            targetField = _ref20[0],
+            optionProp = _ref20[1];
           if (option[optionProp] !== undefined) extra[targetField] = option[optionProp];
         });
         enrichedRow = _objectSpread2(_objectSpread2({}, newRowData), extra);
@@ -51471,10 +51512,10 @@ var Table$1 = function Table(_ref13) {
                 return opt.value === v;
               });
               if (option) {
-                Object.entries(col.updates).forEach(function (_ref19) {
-                  var _ref20 = _slicedToArray$d(_ref19, 2),
-                    tf = _ref20[0],
-                    op = _ref20[1];
+                Object.entries(col.updates).forEach(function (_ref21) {
+                  var _ref22 = _slicedToArray$d(_ref21, 2),
+                    tf = _ref22[0],
+                    op = _ref22[1];
                   if (option[op] !== undefined) enrichedFields[tf] = option[op];
                 });
               }
@@ -51521,24 +51562,20 @@ var Table$1 = function Table(_ref13) {
   var getSortField = useCallback(function (col) {
     return col.field;
   }, []);
-  useLayoutEffect(function () {
-    if (!DT_STATE_KEY || !data.length) return;
-    try {
-      var state = JSON.parse(localStorage.getItem(DT_STATE_KEY) || '{}');
-      if (state.first && state.first >= data.length) {
-        state.first = 0;
-        localStorage.setItem(DT_STATE_KEY, JSON.stringify(state));
-      }
-    } catch (_unused5) {}
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [DT_STATE_KEY, data.length]);
+
+  // Nombre de largeurs attendu = colonnes de tête (frozen) + colonnes visibles.
+  // Toute valeur sauvegardée à un décompte différent est obsolète (la structure
+  // des colonnes a changé) et doit être régénérée, sinon le mapping nth-child de
+  // PrimeReact décale les largeurs et le tableau s'effondre.
+  var expectedWidthCount = leadingColCount + visibleColumns.length;
   var autoWidthsWritten = useRef(false);
   useLayoutEffect(function () {
     if (autoWidthsWritten.current) return;
     try {
       var state = JSON.parse(localStorage.getItem(DT_STATE_KEY) || '{}');
-      if (state.columnWidths) return; // user already has saved widths
-    } catch (_unused6) {
+      // Largeurs déjà présentes ET cohérentes en nombre → on les garde.
+      if (state.columnWidths && state.columnWidths.split(',').length === expectedWidthCount) return;
+    } catch (_unused7) {
       return;
     }
     if (!tableWrapperRef.current) return;
@@ -51548,25 +51585,29 @@ var Table$1 = function Table(_ref13) {
     var span = document.createElement('span');
     span.style.cssText = "position:absolute;visibility:hidden;white-space:nowrap;font-size:".concat(cs.fontSize, ";font-family:").concat(cs.fontFamily, ";font-weight:").concat(cs.fontWeight, ";letter-spacing:").concat(cs.letterSpacing);
     document.body.appendChild(span);
-    var widths = visibleColumns.map(function (col) {
+    // Colonnes de tête frozen : largeur fixe 42px (cf. Column headerStyle).
+    var leadingWidths = Array(leadingColCount).fill(42);
+    var dataWidths = visibleColumns.map(function (col) {
       var _col$header2;
       span.textContent = (_col$header2 = col.header) !== null && _col$header2 !== void 0 ? _col$header2 : '';
       return col.type === 'index' ? 60 : span.offsetWidth + 72;
     });
     document.body.removeChild(span);
+    var widths = [].concat(_toConsumableArray$a(leadingWidths), _toConsumableArray$a(dataWidths));
     try {
       var _state = JSON.parse(localStorage.getItem(DT_STATE_KEY) || '{}');
       _state.columnWidths = widths.join(',');
-      _state.first = 0;
+      // tableWidth stale (ancien décompte) casserait le layout scrollable expand.
+      delete _state.tableWidth;
       localStorage.setItem(DT_STATE_KEY, JSON.stringify(_state));
-    } catch (_unused7) {
+    } catch (_unused8) {
       return;
     }
     autoWidthsWritten.current = true;
     setTableKey(function (k) {
       return k + 1;
     });
-  }, [DT_STATE_KEY, visibleColumns]);
+  }, [DT_STATE_KEY, visibleColumns, leadingColCount, expectedWidthCount]);
   var header = /*#__PURE__*/React__default.createElement("div", {
     style: {
       display: 'flex',
@@ -51705,14 +51746,14 @@ var Table$1 = function Table(_ref13) {
       try {
         localStorage.removeItem(ROW_HEIGHTS_KEY);
         localStorage.removeItem(ROW_PRESET_KEY);
-      } catch (_unused8) {}
+      } catch (_unused9) {}
       setRowPreset(null);
       setSettingsOpen(false);
     }
-  }].map(function (_ref21) {
-    var icon = _ref21.icon,
-      label = _ref21.label,
-      action = _ref21.action;
+  }].map(function (_ref23) {
+    var icon = _ref23.icon,
+      label = _ref23.label,
+      action = _ref23.action;
     return /*#__PURE__*/React__default.createElement("button", {
       key: label,
       type: "button",
@@ -51770,9 +51811,9 @@ var Table$1 = function Table(_ref13) {
   }, {
     key: 'large',
     label: 'Grande'
-  }].map(function (_ref22) {
-    var key = _ref22.key,
-      label = _ref22.label;
+  }].map(function (_ref24) {
+    var key = _ref24.key,
+      label = _ref24.label;
     return /*#__PURE__*/React__default.createElement("button", {
       key: key,
       type: "button",
@@ -51781,7 +51822,7 @@ var Table$1 = function Table(_ref13) {
         try {
           localStorage.removeItem(ROW_HEIGHTS_KEY);
           localStorage.setItem(ROW_PRESET_KEY, key);
-        } catch (_unused9) {}
+        } catch (_unused0) {}
         setRowPreset(key);
         setSettingsOpen(false);
       },
@@ -51910,7 +51951,8 @@ var Table$1 = function Table(_ref13) {
     filters: filterVisible ? filters : undefined,
     filterDisplay: filterVisible ? 'row' : undefined,
     onFilter: filterVisible ? function (e) {
-      return setFilters(e.filters);
+      setFilters(e.filters);
+      persistFilters(e.filters);
     } : undefined,
     editMode: (lockable && locked ? false : effectiveEditable || rowEdit || columns.some(function (c) {
       return c.editable === true;
@@ -51925,7 +51967,65 @@ var Table$1 = function Table(_ref13) {
     removableSort: true,
     reorderableColumns: true,
     stateKey: DT_STATE_KEY,
-    stateStorage: "local",
+    stateStorage: "custom",
+    customSaveState: function customSaveState(state) {
+      if (!DT_STATE_KEY) return;
+      try {
+        var saved = {};
+        // Pagination, tri, filtres, ordre des colonnes : persistés tels quels.
+        if (typeof state.first === 'number') saved.first = state.first;
+        if (typeof state.rows === 'number') saved.rows = state.rows;
+        if (state.sortField) {
+          saved.sortField = state.sortField;
+          saved.sortOrder = state.sortOrder;
+        }
+        if (state.multiSortMeta) saved.multiSortMeta = state.multiSortMeta;
+        // filtres gérés séparément (state contrôlé + clé Table:filters) pour
+        // éviter un filtrage invisible quand la barre de filtre est masquée.
+        // columnOrder NON persisté : les colonnes frozen (select/delete/actions)
+        // corrompaient l'ordre au tri/remontage (cf. findColumnByKey sur clé nulle).
+        // Largeurs (+ tableWidth) uniquement si le décompte correspond aux
+        // colonnes réellement rendues (tête frozen + visibles), sinon le
+        // mapping nth-child de PrimeReact décale tout et casse le layout.
+        if (typeof state.columnWidths === 'string' && state.columnWidths.split(',').length === expectedWidthCount) {
+          saved.columnWidths = state.columnWidths;
+          if (state.tableWidth !== undefined) saved.tableWidth = state.tableWidth;
+        }
+        localStorage.setItem(DT_STATE_KEY, JSON.stringify(saved));
+      } catch (_unused1) {}
+    },
+    customRestoreState: function customRestoreState() {
+      // CRUCIAL : dès que l'objet restauré est non vide, PrimeReact
+      // (_restoreState) applique setFirstState(state.first)/setRowsState(state.rows).
+      // Sans first/rows valides → undefined → dataToRender fait data.slice(0, NaN)
+      // = [] → tbody vide alors que la data est pleine. On garantit donc toujours
+      // une pagination valide (page 1 par défaut, rows par défaut).
+      var restored = {
+        first: 0,
+        rows: rows
+      };
+      if (!DT_STATE_KEY) return restored;
+      try {
+        var s = JSON.parse(localStorage.getItem(DT_STATE_KEY) || '{}');
+        if (typeof s.rows === 'number' && s.rows > 0) restored.rows = s.rows;
+        // Page courante restaurée seulement si elle reste dans la plage de
+        // données — sinon la tranche serait vide (cf. bug d'origine).
+        var len = Array.isArray(data) ? data.length : 0;
+        if (typeof s.first === 'number' && s.first > 0 && s.first < len) restored.first = s.first;
+        if (s.sortField) {
+          restored.sortField = s.sortField;
+          restored.sortOrder = s.sortOrder;
+        }
+        if (s.multiSortMeta) restored.multiSortMeta = s.multiSortMeta;
+        // filtres : non restaurés ici (gérés via le state contrôlé + Table:filters).
+        // columnOrder : non restauré (corrompait les colonnes frozen au tri).
+        if (typeof s.columnWidths === 'string' && s.columnWidths.split(',').length === expectedWidthCount) {
+          restored.columnWidths = s.columnWidths;
+          if (s.tableWidth !== undefined) restored.tableWidth = s.tableWidth;
+        }
+      } catch (_unused10) {/* noop */}
+      return restored;
+    },
     scrollable: true,
     scrollHeight: fullscreen ? 'flex' : '70vh',
     pt: {
@@ -51957,6 +52057,7 @@ var Table$1 = function Table(_ref13) {
     }
   }, rowSelection && /*#__PURE__*/React__default.createElement(Column, {
     key: "__select__",
+    columnKey: "__select__",
     header: /*#__PURE__*/React__default.createElement("span", {
       className: "material-icons",
       style: {
@@ -52020,6 +52121,7 @@ var Table$1 = function Table(_ref13) {
     }
   }), onDeleteRow && /*#__PURE__*/React__default.createElement(Column, {
     key: "__delete__",
+    columnKey: "__delete__",
     header: "",
     body: function body(rowData) {
       return /*#__PURE__*/React__default.createElement("div", {
@@ -52084,13 +52186,14 @@ var Table$1 = function Table(_ref13) {
     if (!actionsCol) return null;
     return /*#__PURE__*/React__default.createElement(Column, {
       key: "__row_actions__",
+      columnKey: "__row_actions__",
       header: "",
       body: function body(rowData) {
-        var _ref23, _linkCol$href;
+        var _ref25, _linkCol$href;
         var linkCol = columns.find(function (c) {
           return c.type === 'titleLink' || c.type === 'link';
         });
-        var linkHref = linkCol ? typeof linkCol.href === 'function' ? linkCol.href(rowData) : (_ref23 = (_linkCol$href = linkCol.href) !== null && _linkCol$href !== void 0 ? _linkCol$href : rowData[linkCol.field + 'Url']) !== null && _ref23 !== void 0 ? _ref23 : null : null;
+        var linkHref = linkCol ? typeof linkCol.href === 'function' ? linkCol.href(rowData) : (_ref25 = (_linkCol$href = linkCol.href) !== null && _linkCol$href !== void 0 ? _linkCol$href : rowData[linkCol.field + 'Url']) !== null && _ref25 !== void 0 ? _ref25 : null : null;
         return /*#__PURE__*/React__default.createElement(RowActionsCell, {
           actions: rowData[actionsCol.actionsField] || [],
           rowData: rowData,

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "arengibook",
   "private": false,
-  "version": "3.1.1-main",
+  "version": "3.1.2-main",
   "main": "dist/index.js",
   "module": "dist/index.js",
   "exports": {