primereact 9.3.1 → 9.4.0

package/datatable/datatable.esm.js

@@ -7,27 +7,27 @@ import { ArrowUpIcon } from 'primereact/icons/arrowup';
 import { SpinnerIcon } from 'primereact/icons/spinner';
 import { Paginator } from 'primereact/paginator';
 import { VirtualScroller } from 'primereact/virtualscroller';
-import { OverlayService } from 'primereact/overlayservice';
-import { Ripple } from 'primereact/ripple';
+import { BarsIcon } from 'primereact/icons/bars';
 import { CheckIcon } from 'primereact/icons/check';
-import { TimesIcon } from 'primereact/icons/times';
-import { PencilIcon } from 'primereact/icons/pencil';
 import { ChevronDownIcon } from 'primereact/icons/chevrondown';
 import { ChevronRightIcon } from 'primereact/icons/chevronright';
-import { BarsIcon } from 'primereact/icons/bars';
+import { PencilIcon } from 'primereact/icons/pencil';
+import { TimesIcon } from 'primereact/icons/times';
+import { OverlayService } from 'primereact/overlayservice';
+import { Ripple } from 'primereact/ripple';
 import { Button } from 'primereact/button';
 import { CSSTransition } from 'primereact/csstransition';
 import { Dropdown } from 'primereact/dropdown';
-import { InputText } from 'primereact/inputtext';
-import { Portal } from 'primereact/portal';
 import { FilterIcon } from 'primereact/icons/filter';
 import { FilterSlashIcon } from 'primereact/icons/filterslash';
-import { TrashIcon } from 'primereact/icons/trash';
 import { PlusIcon } from 'primereact/icons/plus';
-import { Tooltip } from 'primereact/tooltip';
+import { TrashIcon } from 'primereact/icons/trash';
+import { InputText } from 'primereact/inputtext';
+import { Portal } from 'primereact/portal';
 import { SortAltIcon } from 'primereact/icons/sortalt';
 import { SortAmountDownIcon } from 'primereact/icons/sortamountdown';
 import { SortAmountUpAltIcon } from 'primereact/icons/sortamountupalt';
+import { Tooltip } from 'primereact/tooltip';
 
 function _extends() {
   _extends = Object.assign ? Object.assign.bind() : function (target) {
@@ -253,9 +253,9 @@ var DataTableBase = {
     __TYPE: 'DataTable',
     alwaysShowPaginator: true,
     breakpoint: '960px',
-    checkIcon: null,
     cellClassName: null,
     cellSelection: false,
+    checkIcon: null,
     className: null,
     collapsedRowIcon: null,
     columnResizeMode: 'fit',
@@ -276,8 +276,10 @@ var DataTableBase = {
     expandedRows: null,
     exportFilename: 'download',
     exportFunction: null,
+    filterClearIcon: null,
     filterDelay: 300,
     filterDisplay: 'menu',
+    filterIcon: null,
     filterLocale: undefined,
     filters: null,
     first: 0,
@@ -312,8 +314,6 @@ var DataTableBase = {
     onFilter: null,
     onPage: null,
     onRowClick: null,
-    onRowMouseEnter: null,
-    onRowMouseLeave: null,
     onRowCollapse: null,
     onRowDoubleClick: null,
     onRowEditCancel: null,
@@ -322,6 +322,8 @@ var DataTableBase = {
     onRowEditInit: null,
     onRowEditSave: null,
     onRowExpand: null,
+    onRowMouseEnter: null,
+    onRowMouseLeave: null,
     onRowReorder: null,
     onRowSelect: null,
     onRowToggle: null,
@@ -341,10 +343,10 @@ var DataTableBase = {
     paginatorRight: null,
     paginatorTemplate: 'FirstPageLink PrevPageLink PageLinks NextPageLink LastPageLink RowsPerPageDropdown',
     removableSort: false,
-    reorderableColumns: false,
-    reorderableRows: false,
     reorderIndicatorDownIcon: null,
     reorderIndicatorUpIcon: null,
+    reorderableColumns: false,
+    reorderableRows: false,
     resizableColumns: false,
     responsiveLayout: 'scroll',
     rowClassName: null,
@@ -369,6 +371,7 @@ var DataTableBase = {
     selectionMode: null,
     selectionPageOnly: false,
     showGridlines: false,
+    showHeaders: true,
     showRowReorderElement: null,
     showSelectAll: true,
     showSelectionElement: null,
@@ -769,14 +772,29 @@ var BodyCell = /*#__PURE__*/React.memo(function (props) {
       var onCellEditInit = getColumnProp('onCellEditInit');
       var cellEditValidatorEvent = getColumnProp('cellEditValidatorEvent');
       if (onBeforeCellEditShow) {
-        onBeforeCellEditShow(params);
+        // if user returns false do not show the editor
+        if (onBeforeCellEditShow(params) === false) {
+          return;
+        }
+
+        // if user prevents default stop the editor
+        if (event && event.defaultPrevented) {
+          return;
+        }
       }
 
       // If the data is sorted using sort icon, it has been added to wait for the sort operation when any cell is wanted to be opened.
       setTimeout(function () {
         setEditingState(true);
         if (onCellEditInit) {
-          onCellEditInit(params);
+          if (onCellEditInit(params) === false) {
+            return;
+          }
+
+          // if user prevents default stop the editor
+          if (event && event.defaultPrevented) {
+            return;
+          }
         }
         if (cellEditValidatorEvent === 'click') {
           bindDocumentClickListener();
@@ -948,7 +966,7 @@ var BodyCell = /*#__PURE__*/React.memo(function (props) {
     }
   }, [props.editingMeta]);
   React.useEffect(function () {
-    if (props.editMode === 'row') {
+    if (props.editMode === 'cell' || props.editMode === 'row') {
       var callbackParams = getCellCallbackParams();
       var params = _objectSpread$8(_objectSpread$8({}, callbackParams), {}, {
         editing: editingState,
@@ -1693,7 +1711,22 @@ var TableBody = /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef(function
       if (isSubheaderGrouping && props.expandableRowGroups) {
         return isRowGroupExpanded(rowData);
       } else {
-        if (props.dataKey) return props.expandedRows ? props.expandedRows[ObjectUtils.resolveFieldData(rowData, props.dataKey)] !== undefined : false;else return findIndex(props.expandedRows, rowData) !== -1;
+        if (props.dataKey) {
+          var rowId = ObjectUtils.resolveFieldData(rowData, props.dataKey);
+          var expanded = false;
+          if (props.expandedRows) {
+            if (Array.isArray(props.expandedRows)) {
+              expanded = props.expandedRows.some(function (row) {
+                return ObjectUtils.resolveFieldData(row, props.dataKey) === rowId;
+              });
+            } else {
+              expanded = props.expandedRows[rowId] !== undefined;
+            }
+          }
+          return expanded;
+        } else {
+          return findIndex(props.expandedRows, rowData) !== -1;
+        }
       }
     }
     return false;
@@ -3119,7 +3152,7 @@ var ColumnFilter = /*#__PURE__*/React.memo(function (props) {
     var iconProps = {
       'aria-hidden': true
     };
-    var icon = props.columnFilterIcon || /*#__PURE__*/React.createElement(FilterIcon, iconProps);
+    var icon = props.filterIcon || /*#__PURE__*/React.createElement(FilterIcon, iconProps);
     var columnFilterIcon = IconUtils.getJSXIcon(icon, _objectSpread$3({}, iconProps), {
       props: props
     });
@@ -3631,21 +3664,15 @@ var HeaderCell = /*#__PURE__*/React.memo(function (props) {
       sortOrder = _ref2.sortOrder;
     if (getColumnProp('sortable')) {
       var iconClassName = 'p-sortable-column-icon';
-      var icon = sorted ? sortOrder < 0 ? /*#__PURE__*/React.createElement(SortAmountDownIcon, {
-        className: iconClassName
-      }) : /*#__PURE__*/React.createElement(SortAmountUpAltIcon, {
-        className: iconClassName
-      }) : /*#__PURE__*/React.createElement(SortAltIcon, {
-        className: iconClassName
-      });
-      var sortIcon = IconUtils.getJSXIcon(props.sortIcon || icon, {
-        className: iconClassName
-      }, {
+      var icon = sorted ? sortOrder < 0 ? /*#__PURE__*/React.createElement(SortAmountDownIcon, null) : /*#__PURE__*/React.createElement(SortAmountUpAltIcon, null) : /*#__PURE__*/React.createElement(SortAltIcon, null);
+      var sortIcon = IconUtils.getJSXIcon(props.sortIcon || icon, undefined, {
         props: props,
         sorted: sorted,
         sortOrder: sortOrder
       });
-      return sortIcon;
+      return /*#__PURE__*/React.createElement("span", {
+        className: iconClassName
+      }, sortIcon);
     }
     return null;
   };
@@ -3678,7 +3705,9 @@ var HeaderCell = /*#__PURE__*/React.memo(function (props) {
         filters: props.filters,
         onFilterChange: props.onFilterChange,
         onFilterApply: props.onFilterApply,
-        filtersStore: props.filtersStore
+        filtersStore: props.filtersStore,
+        filterIcon: props.filterIcon,
+        filterClearIcon: props.filterClearIcon
       });
     }
     return null;
@@ -4388,6 +4417,9 @@ var DataTable = /*#__PURE__*/React.forwardRef(function (inProps, ref) {
         var updateTableWidth = function updateTableWidth(el) {
           !!el && (el.style.width = el.style.minWidth = tableWidth);
         };
+
+        // https://github.com/primefaces/primereact/issues/3970 Reasoning: resize table cells before updating the table width so that it can use existing computed cell widths and adjust only the one column.
+        resizeTableCells(newColumnWidth);
         updateTableWidth(tableRef.current);
         if (!isVirtualScrollerDisabled()) {
           updateTableWidth(bodyRef.current);
@@ -4396,7 +4428,6 @@ var DataTable = /*#__PURE__*/React.forwardRef(function (inProps, ref) {
             updateTableWidth(DomHandler.findSingle(wrapperRef.current, '.p-virtualscroller-content'));
           }
         }
-        resizeTableCells(newColumnWidth);
       }
       if (props.onColumnResizeEnd) {
         props.onColumnResizeEnd({
@@ -4981,12 +5012,13 @@ var DataTable = /*#__PURE__*/React.forwardRef(function (inProps, ref) {
 
     //headers
     columns.forEach(function (column, i) {
-      var _ref3 = [getColumnProp(column, 'field'), getColumnProp(column, 'header'), getColumnProp(column, 'exportable')],
+      var _ref3 = [getColumnProp(column, 'field'), getColumnProp(column, 'header'), getColumnProp(column, 'exportHeader'), getColumnProp(column, 'exportable')],
         field = _ref3[0],
         header = _ref3[1],
-        exportable = _ref3[2];
+        exportHeader = _ref3[2],
+        exportable = _ref3[3];
       if (exportable && field) {
-        var columnHeader = String(header || field).replace(/"/g, '""').replace(/\n/g, "\u2028");
+        var columnHeader = String(exportHeader || header || field).replace(/"/g, '""').replace(/\n/g, "\u2028");
         csv += '"' + columnHeader + '"';
         if (i < columns.length - 1) {
           csv += props.csvSeparator;
@@ -5186,6 +5218,9 @@ var DataTable = /*#__PURE__*/React.forwardRef(function (inProps, ref) {
     return null;
   };
   var createTableHeader = function createTableHeader(options, empty, _isVirtualScrollerDisabled) {
+    if (props.showHeaders === false) {
+      return null;
+    }
     var sortField = getSortField();
     var sortOrder = getSortOrder();
     var multiSortMeta = _toConsumableArray(getMultiSortMeta());
@@ -5218,6 +5253,8 @@ var DataTable = /*#__PURE__*/React.forwardRef(function (inProps, ref) {
       filterDisplay: props.filterDisplay,
       filters: filters,
       filtersStore: filtersStore,
+      filterIcon: props.filterIcon,
+      filterClearIcon: props.filterClearIcon,
       onFilterChange: onFilterChange,
       onFilterApply: onFilterApply,
       showSelectAll: props.showSelectAll,