@portnet/ui 2.0.8 → 3.0.1

package/dist/components/table/PuiTable.js

@@ -1,688 +0,0 @@
-"use strict";
-
-require("core-js/modules/es.weak-map.js");
-require("core-js/modules/esnext.iterator.filter.js");
-require("core-js/modules/esnext.iterator.for-each.js");
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = exports.PuiTableHeader = void 0;
-require("core-js/modules/es.array.includes.js");
-require("core-js/modules/es.regexp.to-string.js");
-require("core-js/modules/es.string.includes.js");
-require("core-js/modules/esnext.iterator.constructor.js");
-require("core-js/modules/esnext.iterator.map.js");
-require("core-js/modules/web.dom-collections.iterator.js");
-var _propTypes = _interopRequireDefault(require("prop-types"));
-var React = _interopRequireWildcard(require("react"));
-var _apperance = require("../../config/apperance");
-var _PuiTooltip = _interopRequireDefault(require("../others/PuiTooltip"));
-var _antd = require("antd");
-var _icons = require("@ant-design/icons");
-var _jsxRuntime = require("react/jsx-runtime");
-const _excluded = ["field", "headerName", "width", "renderCell", "sortable", "align"],
-  _excluded2 = ["id", "className", "sx", "elevate", "rows", "rowCount", "columns", "paginationMode", "page", "pageSize", "checkboxSelection", "loading", "load", "stripped", "actions", "oneActionOnly", "onSelect", "onPageChange", "onPageSizeChange", "stickyColumns", "pinnedColumns", "getRowId", "onSelectionModelChange", "selectionModel", "onRowClick", "highlightHoveredRow", "stickyHeader", "hideFooter", "hideFooterPagination", "components", "componentsProps", "getRowClassName", "onActionClick", "rowHeight"];
-function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-function _objectWithoutProperties(e, t) { if (null == e) return {}; var o, r, i = _objectWithoutPropertiesLoose(e, t); if (Object.getOwnPropertySymbols) { var n = Object.getOwnPropertySymbols(e); for (r = 0; r < n.length; r++) o = n[r], -1 === t.indexOf(o) && {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]); } return i; }
-function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (-1 !== e.indexOf(n)) continue; t[n] = r[n]; } return t; }
-function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
-function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
-function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == typeof i ? i : i + ""; }
-function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); } // Styles personnalisés pour le tableau
-const tableCustomStyles = "\n  /* Styles g\xE9n\xE9raux du tableau - inspir\xE9 du design de r\xE9f\xE9rence */\n  .pui-table {\n    border-radius: 8px;\n    overflow: hidden;\n    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);\n    background-color: #ffffff;\n  }\n  \n  .pui-table .ant-table {\n    border-radius: 8px;\n  }\n  \n  /* En-t\xEAtes de colonnes */\n  .pui-table .ant-table-thead > tr > th {\n    background-color: #f9fafb;\n    color: #374151;\n    font-weight: 600;\n    font-size: 0.875rem;\n    padding: 12px 16px;\n    border-bottom: 1px solid #e5e7eb;\n    transition: background-color 0.2s;\n  }\n  \n  .pui-table .ant-table-thead > tr > th:hover {\n    background-color: #f3f4f6;\n  }\n  \n  /* Cellules du tableau */\n  .pui-table .ant-table-tbody > tr > td {\n    padding: 12px 16px;\n    border-bottom: 1px solid #f3f4f6;\n    color: #111827;\n    font-size: 0.875rem;\n    transition: background-color 0.2s ease;\n    white-space: normal !important;\n    word-wrap: break-word !important;\n    word-break: break-word !important;\n    max-width: 300px;\n    overflow: visible;\n    line-height: 1.5;\n  }\n  \n  /* Lignes altern\xE9es */\n  .pui-table .ant-table-tbody > tr:nth-child(even) > td {\n    background-color: #f9fafb;\n  }\n  \n  .pui-table .ant-table-tbody > tr:nth-child(odd) > td {\n    background-color: #ffffff;\n  }\n  \n  /* Effet de survol */\n  .pui-table .ant-table-tbody > tr:hover > td {\n    background-color: #f3f4f6 !important;\n  }\n  \n  /* Styles des lignes s\xE9lectionn\xE9es */\n  .pui-table .ant-table-tbody > tr.ant-table-row-selected > td {\n    background-color: rgba(59, 130, 246, 0.05);\n  }\n  \n  .pui-table .ant-table-tbody > tr.ant-table-row-selected:hover > td {\n    background-color: rgba(59, 130, 246, 0.1) !important;\n  }\n  \n  /* Styles des statuts */\n  .pui-table .status-badge {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    padding: 2px 8px;\n    border-radius: 9999px;\n    font-size: 0.75rem;\n    font-weight: 500;\n    line-height: 1.5;\n  }\n  \n  .pui-table .status-badge.cancelled {\n    background-color: #fee2e2;\n    color: #b91c1c;\n  }\n  \n  .pui-table .status-badge.delivered {\n    background-color: #dcfce7;\n    color: #15803d;\n  }\n  \n  .pui-table .status-badge.ready {\n    background-color: #e0f2fe;\n    color: #0369a1;\n  }\n  \n  .pui-table .status-badge.on-the-way {\n    background-color: #fef3c7;\n    color: #92400e;\n  }\n  \n  /* Pagination */\n  .pui-table-pagination {\n    padding: 12px 16px;\n    border-top: 1px solid #f3f4f6;\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n  }\n  \n  .pui-table-pagination .ant-pagination {\n    margin: 0;\n  }\n  \n  .pui-table-pagination .ant-pagination-item,\n  .pui-table-pagination .ant-pagination-prev button,\n  .pui-table-pagination .ant-pagination-next button {\n    border-radius: 6px;\n    border: 1px solid #e5e7eb;\n    height: 32px;\n    min-width: 32px;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n  }\n  \n  .pui-table-pagination .ant-pagination-item:hover,\n  .pui-table-pagination .ant-pagination-prev:hover button,\n  .pui-table-pagination .ant-pagination-next:hover button {\n    border-color: #d1d5db;\n    color: #4b5563;\n  }\n  \n  .pui-table-pagination .ant-pagination-item-active {\n    background-color: #3b82f6;\n    border-color: #3b82f6;\n  }\n  \n  .pui-table-pagination .ant-pagination-item-active a {\n    color: white;\n  }\n  \n  .pui-table-pagination .ant-pagination-item-active:hover {\n    background-color: #2563eb;\n    border-color: #2563eb;\n  }\n  \n  /* Styles pour la colonne d'actions */\n  .pui-table .actions-column {\n    white-space: nowrap !important;\n    overflow: visible !important;\n  }\n  \n  .pui-table .action-button {\n    padding: 4px 8px !important;\n    margin: 0 2px !important;\n    min-width: auto !important;\n    height: 28px !important;\n    line-height: 20px !important;\n    transition: all 0.2s !important;\n  }\n  \n  .pui-table .action-button:hover {\n    background-color: rgba(24, 144, 255, 0.1) !important;\n    color: #1890ff !important;\n  }\n  \n  /* Bouton Cr\xE9er */\n  .pui-create-button {\n    background-color: #3b82f6;\n    color: white;\n    border: none;\n    border-radius: 6px;\n    padding: 8px 16px;\n    font-weight: 500;\n    display: flex;\n    align-items: center;\n    gap: 8px;\n    transition: all 0.2s;\n  }\n  \n  .pui-create-button:hover {\n    background-color: #2563eb;\n  }\n  \n  /* Titre de la page */\n  .pui-table-title {\n    font-size: 1.5rem;\n    font-weight: 600;\n    color: #111827;\n    margin-bottom: 16px;\n  }\n";
-
-// Injection des styles dans le document
-const injectStyles = () => {
-  const styleId = 'pui-table-custom-styles';
-
-  // Vérifie si les styles existent déjà
-  if (!document.getElementById(styleId)) {
-    const styleElement = document.createElement('style');
-    styleElement.id = styleId;
-    styleElement.innerHTML = tableCustomStyles;
-    document.head.appendChild(styleElement);
-  }
-};
-
-// Suppression des styles lors du démontage
-const removeStyles = () => {
-  const styleElement = document.getElementById('pui-table-custom-styles');
-  if (styleElement) {
-    document.head.removeChild(styleElement);
-  }
-};
-
-// Composant pour les boutons d'action
-const TableActions = _ref => {
-  let {
-    row,
-    actions
-  } = _ref;
-  // Empêcher la propagation des événements au niveau du conteneur
-  const handleContainerClick = e => {
-    e.preventDefault();
-    e.stopPropagation();
-  };
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_antd.Space, {
-    size: "small",
-    onClick: handleContainerClick // Arrêter la propagation au niveau du conteneur
-    ,
-    onMouseDown: handleContainerClick // Capturer également les événements mousedown
-    ,
-    style: {
-      display: 'inline-flex'
-    },
-    children: actions.map((action, index) => {
-      // Si l'action a une condition et que la condition n'est pas remplie, ne pas afficher le bouton
-      if (action.condition && !action.condition(row)) {
-        return null;
-      }
-      return /*#__PURE__*/(0, _jsxRuntime.jsx)(_antd.Tooltip, {
-        title: action.tooltip || action.label,
-        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_antd.Button, {
-          type: "text",
-          icon: action.icon,
-          onClick: e => {
-            // Empêcher la propagation et le comportement par défaut
-            e.preventDefault();
-            e.stopPropagation();
-            // Appeler la fonction onClick de l'action
-            if (typeof action.onClick === 'function') {
-              action.onClick(row);
-            } else if (typeof action.action === 'function') {
-              // Pour la rétrocompatibilité
-              action.action(row);
-            }
-          },
-          onMouseDown: e => {
-            // Empêcher également la propagation des événements mousedown
-            e.preventDefault();
-            e.stopPropagation();
-          },
-          className: "action-button",
-          "aria-label": action.label
-        })
-      }, index);
-    })
-  });
-};
-
-// Personnalisation des éléments vides
-const customRenderEmpty = () => /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-  style: {
-    textAlign: 'center',
-    padding: '20px 0'
-  },
-  children: /*#__PURE__*/(0, _jsxRuntime.jsx)("p", {
-    children: "Aucune donn\xE9e \xE0 afficher"
-  })
-});
-
-// Fonction pour rendre les badges de statut
-const renderStatusBadge = status => {
-  if (!status) return null;
-  const statusText = status.toString().toLowerCase();
-  let className = 'status-badge';
-  if (statusText.includes('cancel')) {
-    className += ' cancelled';
-  } else if (statusText.includes('deliver')) {
-    className += ' delivered';
-  } else if (statusText.includes('ready')) {
-    className += ' ready';
-  } else if (statusText.includes('way') || statusText.includes('progress')) {
-    className += ' on-the-way';
-  }
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
-    className: className,
-    children: status
-  });
-};
-
-// Fonction pour transformer les colonnes et ajouter le rendu des badges de statut
-const transformColumns = columns => {
-  return columns.map(column => {
-    var _newColumn$title;
-    const newColumn = _objectSpread({}, column);
-
-    // Si c'est une colonne de statut, ajouter le rendu personnalisé
-    if (newColumn.dataIndex === 'status' || newColumn.key === 'status' || ((_newColumn$title = newColumn.title) === null || _newColumn$title === void 0 ? void 0 : _newColumn$title.toString().toLowerCase()) === 'status') {
-      newColumn.render = text => renderStatusBadge(text);
-    }
-
-    // Ajouter d'autres transformations si nécessaire
-
-    return newColumn;
-  });
-};
-
-// Convertir les colonnes du format DataGrid au format Ant Design
-const convertColumns = (columns, onActionClick, actions) => {
-  if (!columns) return [];
-  const antColumns = columns.map(column => {
-    const {
-        field,
-        headerName,
-        width,
-        renderCell,
-        sortable,
-        align
-      } = column,
-      rest = _objectWithoutProperties(column, _excluded);
-
-    // Fonction de rendu par défaut pour gérer les textes longs
-    const defaultRender = (text, record) => {
-      if (text === null || text === undefined) return "-";
-      const textStr = String(text);
-      const shouldShowTooltip = textStr.length > 30;
-      return /*#__PURE__*/(0, _jsxRuntime.jsx)(_antd.Tooltip, {
-        title: shouldShowTooltip ? textStr : "",
-        placement: "topLeft",
-        children: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-          style: {
-            whiteSpace: 'normal',
-            wordWrap: 'break-word',
-            wordBreak: 'break-word',
-            overflow: 'hidden',
-            textOverflow: 'ellipsis',
-            lineHeight: '1.5',
-            maxHeight: '4.5em',
-            // Environ 3 lignes
-            display: '-webkit-box',
-            WebkitLineClamp: 3,
-            WebkitBoxOrient: 'vertical'
-          },
-          children: textStr
-        })
-      });
-    };
-    return _objectSpread({
-      title: headerName,
-      dataIndex: field,
-      key: field,
-      width,
-      sorter: sortable,
-      align: align || 'left',
-      render: renderCell ? (text, record) => renderCell({
-        row: record,
-        value: text
-      }) : defaultRender
-    }, rest);
-  });
-
-  // Ajouter une colonne d'actions si des actions sont fournies
-  if (actions && actions.length > 0) {
-    antColumns.push({
-      title: 'Actions',
-      key: 'actions',
-      width: 100,
-      align: 'center',
-      render: (_, record) => /*#__PURE__*/(0, _jsxRuntime.jsx)(TableActions, {
-        row: record,
-        actions: actions
-      }),
-      // Empêcher le tri sur la colonne d'actions
-      sorter: false,
-      // Empêcher le filtrage sur la colonne d'actions
-      filterable: false
-    });
-  }
-
-  // Appliquer les transformations pour les badges de statut et autres styles
-  return transformColumns(antColumns);
-};
-
-// Composant de pagination ergonomique personnalisé
-const PuiTablePagination = _ref2 => {
-  let {
-    current,
-    pageSize,
-    total,
-    onChange
-  } = _ref2;
-  // Calculer le nombre total de pages
-  const totalPages = Math.ceil(total / pageSize);
-
-  // Calculer la plage d'éléments affichés
-  const startItem = (current - 1) * pageSize + 1;
-  const endItem = Math.min(current * pageSize, total);
-
-  // Fonction pour aller à la page précédente
-  const goToPrevPage = () => {
-    if (current > 1) {
-      onChange(current - 1, pageSize);
-    }
-  };
-
-  // Fonction pour aller à la page suivante
-  const goToNextPage = () => {
-    if (current < totalPages) {
-      onChange(current + 1, pageSize);
-    }
-  };
-
-  // Fonction pour générer les numéros de page à afficher
-  const getPageNumbers = () => {
-    const pages = [];
-    const maxVisiblePages = 5; // Nombre maximum de pages visibles
-
-    // Toujours afficher la première page
-    pages.push(1);
-
-    // Calculer la plage de pages à afficher
-    let startPage = Math.max(2, current - Math.floor(maxVisiblePages / 2));
-    let endPage = Math.min(totalPages - 1, startPage + maxVisiblePages - 3);
-
-    // Ajuster la plage si nécessaire
-    if (endPage < startPage) {
-      endPage = startPage;
-    }
-
-    // Ajouter des ellipses si nécessaire
-    if (startPage > 2) {
-      pages.push('ellipsis1');
-    }
-
-    // Ajouter les pages intermédiaires
-    for (let i = startPage; i <= endPage; i++) {
-      pages.push(i);
-    }
-
-    // Ajouter des ellipses si nécessaire
-    if (endPage < totalPages - 1) {
-      pages.push('ellipsis2');
-    }
-
-    // Toujours afficher la dernière page si elle existe
-    if (totalPages > 1) {
-      pages.push(totalPages);
-    }
-    return pages;
-  };
-
-  // Style pour les boutons de pagination
-  const buttonStyle = {
-    display: 'flex',
-    alignItems: 'center',
-    justifyContent: 'center',
-    width: '32px',
-    height: '32px',
-    margin: '0 4px',
-    borderRadius: '4px',
-    border: '1px solid #d9d9d9',
-    backgroundColor: '#fff',
-    cursor: 'pointer',
-    transition: 'all 0.2s',
-    color: '#666',
-    fontWeight: 'normal',
-    fontSize: '14px',
-    lineHeight: '32px',
-    userSelect: 'none'
-  };
-
-  // Style pour le bouton de page active
-  const activeButtonStyle = _objectSpread(_objectSpread({}, buttonStyle), {}, {
-    backgroundColor: '#1890ff',
-    borderColor: '#1890ff',
-    color: '#fff',
-    fontWeight: 'bold'
-  });
-
-  // Style pour les boutons désactivés
-  const disabledButtonStyle = _objectSpread(_objectSpread({}, buttonStyle), {}, {
-    cursor: 'not-allowed',
-    color: '#d9d9d9',
-    backgroundColor: '#f5f5f5'
-  });
-  return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
-    style: {
-      display: 'flex',
-      alignItems: 'center',
-      justifyContent: 'space-between'
-    },
-    children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
-      style: {
-        fontSize: '14px',
-        color: '#666'
-      },
-      children: ["Affichage de ", /*#__PURE__*/(0, _jsxRuntime.jsx)("strong", {
-        children: startItem
-      }), " \xE0 ", /*#__PURE__*/(0, _jsxRuntime.jsx)("strong", {
-        children: endItem
-      }), " sur ", /*#__PURE__*/(0, _jsxRuntime.jsx)("strong", {
-        children: total
-      }), " \xE9l\xE9ments"]
-    }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
-      style: {
-        display: 'flex',
-        alignItems: 'center'
-      },
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-        style: current === 1 ? disabledButtonStyle : buttonStyle,
-        onClick: current === 1 ? undefined : goToPrevPage,
-        title: "Page pr\xE9c\xE9dente",
-        children: "<"
-      }), getPageNumbers().map((page, index) => {
-        if (page === 'ellipsis1' || page === 'ellipsis2') {
-          return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-            style: _objectSpread(_objectSpread({}, buttonStyle), {}, {
-              border: 'none',
-              cursor: 'default'
-            }),
-            children: "..."
-          }, page);
-        }
-        return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-          style: page === current ? activeButtonStyle : buttonStyle,
-          onClick: () => page !== current && onChange(page, pageSize),
-          children: page
-        }, page);
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-        style: current === totalPages ? disabledButtonStyle : buttonStyle,
-        onClick: current === totalPages ? undefined : goToNextPage,
-        title: "Page suivante",
-        children: ">"
-      })]
-    })]
-  });
-};
-
-// Composant principal PuiTable avec Ant Design
-const PuiTable = /*#__PURE__*/React.forwardRef((_ref3, ref) => {
-  let {
-      id,
-      className,
-      sx,
-      elevate,
-      rows,
-      rowCount,
-      columns,
-      paginationMode,
-      page,
-      pageSize,
-      checkboxSelection,
-      loading,
-      load,
-      stripped,
-      actions,
-      oneActionOnly,
-      onSelect,
-      onPageChange,
-      onPageSizeChange,
-      stickyColumns = [],
-      pinnedColumns,
-      getRowId,
-      onSelectionModelChange,
-      selectionModel,
-      onRowClick,
-      highlightHoveredRow,
-      stickyHeader,
-      hideFooter,
-      hideFooterPagination,
-      components,
-      componentsProps,
-      getRowClassName,
-      onActionClick,
-      rowHeight = 'auto'
-    } = _ref3,
-    rest = _objectWithoutProperties(_ref3, _excluded2);
-  // Convertir les colonnes au format Ant Design
-  const antColumns = React.useMemo(() => convertColumns(columns, onActionClick, actions), [columns, onActionClick, actions]);
-
-  // Gérer la sélection
-  const [selectedRowKeys, setSelectedRowKeys] = React.useState([]);
-  const onSelectChange = newSelectedRowKeys => {
-    setSelectedRowKeys(newSelectedRowKeys);
-    if (onSelect) {
-      onSelect(newSelectedRowKeys);
-    }
-  };
-
-  // Configuration des lignes sélectionnables
-  const rowSelection = checkboxSelection ? {
-    selectedRowKeys,
-    onChange: onSelectChange
-  } : undefined;
-
-  // Gérer le changement de page
-  const handlePageChange = (newPage, newPageSize) => {
-    if (onPageChange) {
-      // Ant Design utilise une pagination 1-indexed, mais nous gardons notre convention 0-indexed
-      onPageChange(newPage - 1);
-    }
-    if (onPageSizeChange && pageSize !== newPageSize) {
-      onPageSizeChange(newPageSize);
-    }
-  };
-
-  // Configurer les colonnes sticky
-  const configuredColumns = React.useMemo(() => {
-    if (!stickyColumns || stickyColumns.length === 0) return antColumns;
-    return antColumns.map(column => {
-      if (stickyColumns.includes(column.dataIndex) || stickyColumns.includes(column.key)) {
-        return _objectSpread(_objectSpread({}, column), {}, {
-          fixed: 'left'
-        });
-      }
-      return column;
-    });
-  }, [antColumns, stickyColumns]);
-
-  // Style du tableau
-  const tableStyle = _objectSpread(_objectSpread({
-    fontSize: '0.85em'
-  }, elevate ? {
-    boxShadow: '0 2px 8px rgba(0,0,0,0.07)'
-  } : {}), sx || {});
-
-  // Style pour les lignes du tableau
-  const rowStyle = {
-    height: rowHeight,
-    minHeight: rowHeight === 'auto' ? '60px' : rowHeight
-  };
-
-  // Injection des styles CSS personnalisés
-  React.useEffect(() => {
-    injectStyles();
-    return () => removeStyles();
-  }, []);
-
-  // Mettre à jour les lignes sélectionnées lorsque selectionModel change
-  React.useEffect(() => {
-    if (selectionModel) {
-      setSelectedRowKeys(selectionModel);
-    }
-  }, [selectionModel]);
-
-  // Gérer le changement de sélection
-  const handleSelectionChange = newSelectedRowKeys => {
-    setSelectedRowKeys(newSelectedRowKeys);
-    if (onSelectionModelChange) {
-      onSelectionModelChange(newSelectedRowKeys);
-    }
-  };
-
-  // Gérer le clic sur une ligne
-  const handleRowClick = record => {
-    if (onRowClick) {
-      onRowClick(record);
-    }
-  };
-
-  // Obtenir les propriétés de ligne (pour les événements et les classes)
-  const getRowProps = record => {
-    const rowId = getRowId ? getRowId(record) : record.id;
-    const isSelected = selectedRowKeys.includes(rowId);
-    return {
-      onClick: e => {
-        // Ne déclencher le clic sur la ligne que si l'événement n'a pas été arrêté par un enfant
-        if (!e.isPropagationStopped() && onRowClick) {
-          onRowClick(record);
-        }
-      },
-      className: "".concat(getRowClassName ? getRowClassName(record) : '', " ").concat(isSelected ? 'ant-table-row-selected' : ''),
-      style: {
-        cursor: onRowClick ? 'pointer' : 'default'
-      }
-    };
-  };
-
-  // Calculer le nombre total de pages
-  const totalPages = Math.ceil(rowCount / pageSize);
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_antd.ConfigProvider, {
-    theme: {
-      components: {
-        Table: {
-          headerBg: '#f9fafb',
-          headerColor: '#374151',
-          borderColor: '#f3f4f6',
-          rowHoverBg: '#f3f4f6'
-        }
-      }
-    },
-    children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_antd.Spin, {
-      spinning: loading || load,
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_antd.Table, _objectSpread({
-        ref: ref,
-        id: id,
-        className: "pui-table ".concat(className || '', " ").concat(stripped ? 'table-stripped' : ''),
-        columns: configuredColumns,
-        dataSource: rows.map(row => _objectSpread(_objectSpread({}, row), {}, {
-          key: row.id || row.key || Math.random().toString(36).substr(2, 9)
-        })),
-        pagination: false,
-        rowSelection: rowSelection,
-        size: "small",
-        bordered: true,
-        style: tableStyle,
-        scroll: {
-          x: 'max-content'
-        },
-        rowClassName: (record, index) => {
-          let className = index % 2 === 0 ? 'ant-table-row-light' : 'ant-table-row-dark';
-          if (record.isEditing) className += ' ant-table-row-editing';
-          return className;
-        },
-        onRow: record => _objectSpread(_objectSpread({}, getRowProps(record)), {}, {
-          style: rowStyle
-        })
-      }, rest)), !hideFooter && !hideFooterPagination && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-        className: "pui-table-pagination",
-        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(PuiTablePagination, {
-          current: page + 1,
-          pageSize: pageSize,
-          total: rowCount,
-          onChange: (newPage, newPageSize) => {
-            if (newPageSize !== pageSize) {
-              onPageSizeChange && onPageSizeChange(newPageSize);
-            } else {
-              onPageChange && onPageChange(newPage - 1);
-            }
-          }
-        })
-      })]
-    })
-  });
-});
-PuiTable.propTypes = {
-  id: _propTypes.default.string,
-  className: _propTypes.default.string,
-  sx: _propTypes.default.object,
-  elevate: _propTypes.default.bool,
-  stripped: _propTypes.default.bool,
-  oneActionOnly: _propTypes.default.bool,
-  rows: _propTypes.default.arrayOf(_propTypes.default.object),
-  rowCount: _propTypes.default.number,
-  columns: _propTypes.default.arrayOf(_propTypes.default.object).isRequired,
-  page: _propTypes.default.number,
-  pageSize: _propTypes.default.number,
-  actions: _propTypes.default.arrayOf(_propTypes.default.shape({
-    title: _propTypes.default.string,
-    icon: _propTypes.default.element,
-    action: _propTypes.default.func.isRequired
-  })),
-  checkboxSelection: _propTypes.default.bool,
-  paginationMode: _propTypes.default.oneOf(["client", "server", "none"]),
-  loading: _propTypes.default.bool,
-  load: _propTypes.default.bool,
-  onSelect: _propTypes.default.func,
-  onPageChange: _propTypes.default.func,
-  onPageSizeChange: _propTypes.default.func,
-  stickyColumns: _propTypes.default.arrayOf(_propTypes.default.string),
-  pinnedColumns: _propTypes.default.object,
-  getRowId: _propTypes.default.func,
-  onSelectionModelChange: _propTypes.default.func,
-  selectionModel: _propTypes.default.array,
-  onRowClick: _propTypes.default.func,
-  highlightHoveredRow: _propTypes.default.bool,
-  stickyHeader: _propTypes.default.bool,
-  hideFooter: _propTypes.default.bool,
-  hideFooterPagination: _propTypes.default.bool,
-  components: _propTypes.default.object,
-  componentsProps: _propTypes.default.object,
-  getRowClassName: _propTypes.default.func,
-  onActionClick: _propTypes.default.func,
-  rowHeight: _propTypes.default.string
-};
-PuiTable.defaultProps = {
-  oneActionOnly: false,
-  elevate: true,
-  pageSize: 5,
-  page: 0,
-  paginationMode: "client",
-  stripped: false,
-  actions: [],
-  stickyColumns: [],
-  rows: [],
-  getRowId: null,
-  onSelectionModelChange: null,
-  selectionModel: null,
-  onRowClick: null,
-  highlightHoveredRow: false,
-  stickyHeader: false,
-  hideFooter: false,
-  hideFooterPagination: false,
-  components: null,
-  componentsProps: null,
-  getRowClassName: null,
-  onActionClick: null,
-  rowHeight: 'auto',
-  loading: false,
-  load: false
-};
-
-// Composant pour l'en-tête de la table avec titre et bouton de création
-const PuiTableHeader = _ref4 => {
-  let {
-    title,
-    onCreateClick,
-    createButtonText = "Create"
-  } = _ref4;
-  return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
-    style: {
-      display: 'flex',
-      justifyContent: 'space-between',
-      alignItems: 'center',
-      marginBottom: '16px'
-    },
-    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("h1", {
-      className: "pui-table-title",
-      children: title
-    }), onCreateClick && /*#__PURE__*/(0, _jsxRuntime.jsx)(_antd.Button, {
-      type: "primary",
-      onClick: onCreateClick,
-      className: "pui-create-button",
-      icon: /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
-        style: {
-          marginRight: '4px'
-        },
-        children: "+"
-      }),
-      children: createButtonText
-    })]
-  });
-};
-exports.PuiTableHeader = PuiTableHeader;
-var _default = exports.default = PuiTable;