primereact 8.1.0 → 8.3.0

package/datatable/datatable.js

@@ -245,7 +245,7 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
     var onClick = function onClick(event) {
       if (!props.disabled) {
         props.onChange(event);
-        inputRef.current.focus();
+        utils.DomHandler.focus(inputRef.current);
       }
     };
 
@@ -1405,12 +1405,16 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
       }),
       'p-row-odd': props.index % 2 !== 0
     });
+    var style = {
+      height: props.virtualScrollerOptions ? props.virtualScrollerOptions.itemSize : undefined
+    };
     var content = createContent();
     var tabIndex = getTabIndex();
     return /*#__PURE__*/React__namespace.createElement("tr", {
       role: "row",
       tabIndex: tabIndex,
       className: className,
+      style: style,
       onMouseDown: onMouseDown,
       onMouseUp: onMouseUp,
       onClick: onClick,
@@ -1452,14 +1456,14 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
   function ownKeys$5(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 
   function _objectSpread$5(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$5(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$5(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-  var TableBody = /*#__PURE__*/React__namespace.memo(function (props) {
+  var TableBody = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace.forwardRef(function (props, ref) {
     var _React$useState = React__namespace.useState({}),
         _React$useState2 = _slicedToArray(_React$useState, 2),
         rowGroupHeaderStyleObjectState = _React$useState2[0],
         setRowGroupHeaderStyleObjectState = _React$useState2[1];
 
     var elementRef = React__namespace.useRef(null);
-    var ref = React__namespace.useCallback(function (el) {
+    var refCallback = React__namespace.useCallback(function (el) {
       elementRef.current = el;
       props.virtualScrollerContentRef && props.virtualScrollerContentRef(el);
     }, [props]);
@@ -1559,7 +1563,7 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
     };
 
     var allowRowDrag = function allowRowDrag(event) {
-      return !allowCellSelection() && allowDrag(event);
+      return !allowCellSelection() && allowDrag(event) || props.reorderableRows;
     };
 
     var allowCellDrag = function allowCellDrag(event) {
@@ -2113,9 +2117,12 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
     var onRowDragStart = function onRowDragStart(e) {
       var event = e.originalEvent,
           index = e.index;
-      rowDragging.current = true;
-      draggedRowIndex.current = index;
-      event.dataTransfer.setData('text', 'b'); // For firefox
+
+      if (allowRowDrag(event)) {
+        rowDragging.current = true;
+        draggedRowIndex.current = index;
+        event.dataTransfer.setData('text', 'b'); // For firefox
+      }
     };
 
     var onRowDragOver = function onRowDragOver(e) {
@@ -2511,10 +2518,10 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
     var className = utils.classNames('p-datatable-tbody', props.className);
     var content = props.empty ? createEmptyContent() : createContent();
     return /*#__PURE__*/React__namespace.createElement("tbody", {
-      ref: ref,
+      ref: refCallback,
       className: className
     }, content);
-  });
+  }));
   TableBody.displayName = 'TableBody';
 
   function ownKeys$4(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
@@ -2564,7 +2571,8 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
           styleObject['left'] = left + 'px';
         }
 
-        setStyleObjectState(styleObject);
+        var isSameStyle = styleObjectState['left'] === styleObject['left'] && styleObjectState['right'] === styleObject['right'];
+        !isSameStyle && setStyleObjectState(styleObject);
       }
     };
 
@@ -2687,7 +2695,8 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
         unbindOverlayListener = _useOverlayListener2[1];
 
     var hasFilter = function hasFilter() {
-      return filterStoreModel && filterModel && (filterStoreModel.operator ? filterStoreModel.constraints[0].value !== filterModel.constraints[0].value : filterStoreModel.value !== filterModel.value);
+      if (!filterStoreModel || !filterModel) return false;
+      return filterStoreModel.operator ? !isFilterBlank(filterModel.constraints[0].value) && filterStoreModel.constraints[0].value !== filterModel.constraints[0].value : !isFilterBlank(filterModel.value) && filterStoreModel.value !== filterModel.value;
     };
 
     var hasRowFilter = function hasRowFilter() {
@@ -3801,14 +3810,15 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
       var sortMeta = getSortMeta();
       var style = getStyle();
       var align = getColumnProp('alignHeader') || getColumnProp('align');
+      var frozen = getColumnProp('frozen');
       var className = utils.classNames(getColumnProp('headerClassName'), getColumnProp('className'), _defineProperty({
         'p-sortable-column': getColumnProp('sortable'),
         'p-resizable-column': props.resizableColumns && getColumnProp('resizeable'),
         'p-highlight': sortMeta.sorted,
-        'p-frozen-column': getColumnProp('frozen'),
+        'p-frozen-column': frozen,
         'p-selection-column': getColumnProp('selectionMode'),
         'p-sortable-disabled': getColumnProp('sortable') && _isSortableDisabled,
-        'p-reorderable-column': props.reorderableColumns && getColumnProp('reorderable')
+        'p-reorderable-column': props.reorderableColumns && getColumnProp('reorderable') && !frozen
       }, "p-align-".concat(align), !!align));
       var tabIndex = getColumnProp('sortable') && !_isSortableDisabled ? props.tabIndex : null;
       var colSpan = getColumnProp('colSpan');
@@ -4097,6 +4107,9 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
     var elementRef = React__namespace.useRef(null);
     var tableRef = React__namespace.useRef(null);
     var wrapperRef = React__namespace.useRef(null);
+    var bodyRef = React__namespace.useRef(null);
+    var frozenBodyRef = React__namespace.useRef(null);
+    var virtualScrollerRef = React__namespace.useRef(null);
     var reorderIndicatorUpRef = React__namespace.useRef(null);
     var reorderIndicatorDownRef = React__namespace.useRef(null);
     var colReorderIconWidth = React__namespace.useRef(null);
@@ -4592,8 +4605,22 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
           }
         } else if (props.columnResizeMode === 'expand') {
           var tableWidth = tableRef.current.offsetWidth + delta + 'px';
-          tableRef.current.style.width = tableWidth;
-          tableRef.current.style.minWidth = tableWidth;
+
+          var updateTableWidth = function updateTableWidth(el) {
+            !!el && (el.style.width = el.style.minWidth = tableWidth);
+          };
+
+          updateTableWidth(tableRef.current);
+
+          if (!isVirtualScrollerDisabled()) {
+            updateTableWidth(bodyRef.current);
+            updateTableWidth(frozenBodyRef.current);
+
+            if (wrapperRef.current) {
+              updateTableWidth(utils.DomHandler.findSingle(wrapperRef.current, '.p-virtualscroller-content'));
+            }
+          }
+
           resizeTableCells(newColumnWidth);
         }
 
@@ -4650,7 +4677,7 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
       var event = e.originalEvent,
           column = e.column;
 
-      if (props.reorderableColumns && getColumnProp(column, 'reorderable') !== false) {
+      if (props.reorderableColumns && getColumnProp(column, 'reorderable') !== false && !getColumnProp(column, 'frozen')) {
         if (event.target.nodeName === 'INPUT' || event.target.nodeName === 'TEXTAREA' || utils.DomHandler.hasClass(event.target, 'p-column-resizer')) event.currentTarget.draggable = false;else event.currentTarget.draggable = true;
       }
     };
@@ -4713,10 +4740,11 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
     };
 
     var onColumnHeaderDragOver = function onColumnHeaderDragOver(e) {
-      var event = e.originalEvent;
+      var event = e.originalEvent,
+          column = e.column;
       var dropHeader = findParentHeader(event.currentTarget);
 
-      if (props.reorderableColumns && draggedColumnElement.current && dropHeader) {
+      if (props.reorderableColumns && draggedColumnElement.current && dropHeader && !getColumnProp(column, 'frozen')) {
         event.preventDefault();
 
         if (draggedColumnElement.current !== dropHeader) {
@@ -4927,8 +4955,8 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
       return props.removableSort ? props.defaultSortOrder === currentOrder ? currentOrder * -1 : 0 : currentOrder * -1;
     };
 
-    var compareValuesOnSort = function compareValuesOnSort(value1, value2) {
-      return utils.ObjectUtils.sort(value1, value2, 1, PrimeReact__default["default"].locale);
+    var compareValuesOnSort = function compareValuesOnSort(value1, value2, order) {
+      return utils.ObjectUtils.sort(value1, value2, order, PrimeReact__default["default"].locale);
     };
 
     var addSortMeta = function addSortMeta(meta, multiSortMeta) {
@@ -4967,6 +4995,7 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
 
       if (columnSortable.current && columnSortFunction.current) {
         value = columnSortFunction.current({
+          rowData: value,
           field: field,
           order: order
         });
@@ -4974,8 +5003,7 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
         value.sort(function (data1, data2) {
           var value1 = utils.ObjectUtils.resolveFieldData(data1, field);
           var value2 = utils.ObjectUtils.resolveFieldData(data2, field);
-          var result = compareValuesOnSort(value1, value2);
-          return order * result;
+          return compareValuesOnSort(value1, value2, order);
         });
       }
 
@@ -5008,6 +5036,7 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
         var field = columnField.current;
         var order = meta ? meta.order : defaultSortOrder;
         value = columnSortFunction.current({
+          rowData: value,
           field: field,
           order: order
         });
@@ -5028,8 +5057,7 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
         return multiSortMeta.length - 1 > index ? multisortField(data1, data2, multiSortMeta, index + 1) : 0;
       }
 
-      var result = compareValuesOnSort(value1, value2);
-      return multiSortMeta[index].order * result;
+      return compareValuesOnSort(value1, value2, multiSortMeta[index].order);
     };
 
     var onFilterChange = function onFilterChange(filters) {
@@ -5349,6 +5377,17 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
           var sortOrder = localState && localState.sortOrder || getSortOrder();
           var multiSortMeta = localState && localState.multiSortMeta || getMultiSortMeta();
 
+          var _columns3 = getColumns();
+
+          var sortColumn = _columns3.find(function (col) {
+            return col.props.field === sortField;
+          });
+
+          if (sortColumn) {
+            columnSortable.current = sortColumn.props.sortable;
+            columnSortFunction.current = sortColumn.props.sortFunction;
+          }
+
           if (utils.ObjectUtils.isNotEmpty(filters) || props.globalFilter) {
             data = filterLocal(data, filters);
           }
@@ -5408,7 +5447,9 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
       }
     }, [props.responsiveLayout]);
     hooks.useUpdateEffect(function () {
-      filter(props.globalFilter, 'global', 'contains');
+      if (props.globalFilter) {
+        filter(props.globalFilter, 'global', 'contains');
+      }
     }, [props.globalFilter]);
     hooks.useUnmountEffect(function () {
       unbindColumnResizeEvents();
@@ -5416,7 +5457,7 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
       destroyResponsiveStyle();
     });
     React__namespace.useImperativeHandle(ref, function () {
-      return {
+      return _objectSpread({
         reset: reset,
         resetScroll: resetScroll,
         exportCSV: exportCSV,
@@ -5424,8 +5465,17 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
         resetColumnOrder: resetColumnOrder,
         closeEditingCell: closeEditingCell,
         restoreTableState: restoreTableState,
-        clearState: clearState
-      };
+        clearState: clearState,
+        getElement: function getElement() {
+          return elementRef.current;
+        },
+        getTable: function getTable() {
+          return tableRef.current;
+        },
+        getVirtualScroller: function getVirtualScroller() {
+          return virtualScrollerRef.current;
+        }
+      }, props);
     });
 
     var createLoader = function createLoader() {
@@ -5508,7 +5558,9 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
           columns = options.columns,
           contentRef = options.contentRef,
           className = options.className;
+          options.itemSize;
       var frozenBody = props.frozenValue && /*#__PURE__*/React__namespace.createElement(TableBody, {
+        ref: frozenBodyRef,
         value: props.frozenValue,
         className: "p-datatable-frozen-tbody",
         frozenRow: true,
@@ -5546,6 +5598,7 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
         editMode: props.editMode,
         editingRows: props.editingRows,
         onRowReorder: props.onRowReorder,
+        reorderableRows: props.reorderableRows,
         scrollable: props.scrollable,
         rowGroupMode: props.rowGroupMode,
         groupRowsBy: props.groupRowsBy,
@@ -5572,9 +5625,11 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
         expandedRowIcon: props.expandedRowIcon,
         collapsedRowIcon: props.collapsedRowIcon,
         rowClassName: props.rowClassName,
+        virtualScrollerOptions: options,
         isVirtualScrollerDisabled: true
       });
       var body = /*#__PURE__*/React__namespace.createElement(TableBody, {
+        ref: bodyRef,
         value: dataToRender(rows),
         className: className,
         empty: empty,
@@ -5613,6 +5668,7 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
         editMode: props.editMode,
         editingRows: props.editingRows,
         onRowReorder: props.onRowReorder,
+        reorderableRows: props.reorderableRows,
         scrollable: props.scrollable,
         rowGroupMode: props.rowGroupMode,
         groupRowsBy: props.groupRowsBy,
@@ -5667,10 +5723,15 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
         style: {
           maxHeight: _isVirtualScrollerDisabled ? props.scrollHeight : null
         }
-      }, /*#__PURE__*/React__namespace.createElement(virtualscroller.VirtualScroller, _extends({}, virtualScrollerOptions, {
+      }, /*#__PURE__*/React__namespace.createElement(virtualscroller.VirtualScroller, _extends({
+        ref: virtualScrollerRef
+      }, virtualScrollerOptions, {
         items: processedData,
         columns: columns,
-        scrollHeight: props.scrollHeight,
+        style: _objectSpread(_objectSpread({}, virtualScrollerOptions.style), {
+          height: props.scrollHeight !== 'flex' ? props.scrollHeight : undefined
+        }),
+        scrollHeight: props.scrollHeight !== 'flex' ? undefined : '100%',
         disabled: _isVirtualScrollerDisabled,
         loaderDisabled: true,
         showSpacer: false,
@@ -5879,6 +5940,7 @@ this.primereact.datatable = (function (exports, React, PrimeReact, hooks, pagina
     resizableColumns: false,
     columnResizeMode: 'fit',
     reorderableColumns: false,
+    reorderableRows: false,
     filters: null,
     globalFilter: null,
     filterDelay: 300,