primereact 10.8.4 → 10.9.0

package/datatable/datatable.esm.js

@@ -766,15 +766,15 @@ var Checkbox = /*#__PURE__*/React.memo(/*#__PURE__*/React.forwardRef(function (i
       DomHandler.focus(inputRef.current);
     }
   };
-  var _onFocus = function onFocus() {
+  var _onFocus = function onFocus(event) {
     var _props$onFocus;
     setFocusedState(true);
-    props === null || props === void 0 || (_props$onFocus = props.onFocus) === null || _props$onFocus === void 0 || _props$onFocus.call(props);
+    props === null || props === void 0 || (_props$onFocus = props.onFocus) === null || _props$onFocus === void 0 || _props$onFocus.call(props, event);
   };
-  var _onBlur = function onBlur() {
+  var _onBlur = function onBlur(event) {
     var _props$onBlur;
     setFocusedState(false);
-    props === null || props === void 0 || (_props$onBlur = props.onBlur) === null || _props$onBlur === void 0 || _props$onBlur.call(props);
+    props === null || props === void 0 || (_props$onBlur = props.onBlur) === null || _props$onBlur === void 0 || _props$onBlur.call(props, event);
   };
   React.useImperativeHandle(ref, function () {
     return {
@@ -825,10 +825,10 @@ var Checkbox = /*#__PURE__*/React.memo(/*#__PURE__*/React.forwardRef(function (i
       name: props.name,
       tabIndex: props.tabIndex,
       onFocus: function onFocus(e) {
-        return _onFocus();
+        return _onFocus(e);
       },
       onBlur: function onBlur(e) {
-        return _onBlur();
+        return _onBlur(e);
       },
       onChange: function onChange(e) {
         return _onChange(e);
@@ -1185,6 +1185,7 @@ var BodyCell = /*#__PURE__*/React.memo(function (props) {
   var keyHelperRef = React.useRef(null);
   var overlayEventListener = React.useRef(null);
   var selfClick = React.useRef(false);
+  var focusTimeout = React.useRef(null);
   var initFocusTimeout = React.useRef(null);
   var editingRowDataStateRef = React.useRef(null);
   var _props$ptCallbacks = props.ptCallbacks,
@@ -1229,12 +1230,13 @@ var BodyCell = /*#__PURE__*/React.memo(function (props) {
   var _useEventListener = useEventListener({
       type: 'click',
       listener: function listener(e) {
-        if (!selfClick.current && isOutsideClicked(e.target)) {
-          // #2666 for overlay components and outside is clicked
-          setTimeout(function () {
+        setTimeout(function () {
+          if (!selfClick.current && isOutsideClicked(e.target)) {
+            // #2666 for overlay components and outside is clicked
+
             switchCellToViewMode(e, true);
-          }, 0);
-        }
+          }
+        }, 0);
         selfClick.current = false;
       },
       options: true,
@@ -1365,11 +1367,14 @@ var BodyCell = /*#__PURE__*/React.memo(function (props) {
     }
   };
   var focusOnElement = function focusOnElement() {
-    if (editingState) {
-      var focusableEl = props.editMode === 'cell' ? DomHandler.getFirstFocusableElement(elementRef.current, ':not([data-pc-section="editorkeyhelperlabel"])') : DomHandler.findSingle(elementRef.current, '[data-p-row-editor-save="true"]');
-      focusableEl && focusableEl.focus();
-    }
-    keyHelperRef.current && (keyHelperRef.current.tabIndex = editingState ? -1 : 0);
+    clearTimeout(focusTimeout.current);
+    focusTimeout.current = setTimeout(function () {
+      if (editingState) {
+        var focusableEl = props.editMode === 'cell' ? DomHandler.getFirstFocusableElement(elementRef.current, ':not([data-pc-section="editorkeyhelperlabel"])') : DomHandler.findSingle(elementRef.current, '[data-p-row-editor-save="true"]');
+        focusableEl && focusableEl.focus();
+      }
+      keyHelperRef.current && (keyHelperRef.current.tabIndex = editingState ? -1 : 0);
+    }, 1);
   };
   var focusOnInit = function focusOnInit() {
     clearTimeout(initFocusTimeout.current);
@@ -1596,7 +1601,8 @@ var BodyCell = /*#__PURE__*/React.memo(function (props) {
     if (props.editMode === 'cell' || props.editMode === 'row') {
       focusOnElement();
     }
-  });
+  }, [props.editMode, props.editing, editingState]); // eslint-disable-line react-hooks/exhaustive-deps
+
   React.useEffect(function () {
     if (props.editMode === 'row' && props.editing !== editingState) {
       setEditingState(props.editing);
@@ -2836,10 +2842,10 @@ var TableBody = /*#__PURE__*/React.memo(/*#__PURE__*/React.forwardRef(function (
     return isAllowCellSelection ? selectRangeOnCell(event, rangeStart, rangeEnd) : selectRangeOnRow(event, rangeStart, rangeEnd);
   };
   var selectRangeOnRow = function selectRangeOnRow(event, rowRangeStart, rowRangeEnd) {
-    var value = props.tableProps.value;
     var selection = [];
     for (var i = rowRangeStart; i <= rowRangeEnd; i++) {
-      var rangeRowData = value[i];
+      var _props$value$i;
+      var rangeRowData = (_props$value$i = props.value[i]) !== null && _props$value$i !== void 0 ? _props$value$i : props.tableProps.value[i];
       if (!isSelectable({
         data: rangeRowData,
         index: i
@@ -3057,7 +3063,7 @@ var TableBody = /*#__PURE__*/React.memo(/*#__PURE__*/React.forwardRef(function (
     var event = e.originalEvent;
     var isDraggableHandle = isUnstyled() ? DomHandler.getAttribute(event.target, 'data-pc-section') === 'rowreordericon' || event.target.closest('[data-pc-section="rowreordericon"]') : DomHandler.hasClass(event.target, 'p-datatable-reorderablerow-handle') || event.target.closest('.p-datatable-reorderablerow-handle');
     event.currentTarget.draggable = isDraggableHandle;
-    event.target.draggable = !isDraggableHandle;
+    event.target.draggable = isDraggableHandle;
     if (allowRowDrag(e)) {
       enableDragSelection(event);
       anchorRowIndex.current = e.index;
@@ -3669,6 +3675,7 @@ var TableFooter = /*#__PURE__*/React.memo(function (props) {
   var getRowProps = function getRowProps(row) {
     return ColumnGroupBase.getCProps(row);
   };
+  var context = React.useContext(PrimeReactContext);
   var getColumnGroupProps = function getColumnGroupProps() {
     return props.footerColumnGroup ? ColumnGroupBase.getCProps(props.footerColumnGroup) : undefined;
   };
@@ -3726,7 +3733,7 @@ var TableFooter = /*#__PURE__*/React.memo(function (props) {
       return rows.map(function (row, i) {
         var rootProps = mergeProps({
           role: 'row'
-        }, getRowPTOptions(row, 'root'));
+        }, RowBase.getProps(row.props, context), getRowPTOptions(row, 'root'));
         return /*#__PURE__*/React.createElement("tr", _extends({}, rootProps, {
           key: i
         }), createGroupFooterCells(row));
@@ -4107,9 +4114,9 @@ var FocusTrap = /*#__PURE__*/React__default.memo(/*#__PURE__*/React__default.for
     var _ref2 = props || {},
       _ref2$tabIndex = _ref2.tabIndex,
       tabIndex = _ref2$tabIndex === void 0 ? 0 : _ref2$tabIndex;
-    var createFocusableElement = function createFocusableElement(onFocus, section) {
+    var createFocusableElement = function createFocusableElement(inRef, onFocus, section) {
       return /*#__PURE__*/React__default.createElement("span", {
-        ref: section === 'firstfocusableelement' ? firstFocusableElementRef : lastFocusableElementRef,
+        ref: inRef,
         className: 'p-hidden-accessible p-hidden-focusable',
         tabIndex: tabIndex,
         role: 'presentation',
@@ -4120,11 +4127,11 @@ var FocusTrap = /*#__PURE__*/React__default.memo(/*#__PURE__*/React__default.for
         "data-pc-section": section
       });
     };
-    var firstFocusableElement = createFocusableElement(onFirstHiddenElementFocus, 'firstfocusableelement');
-    var lastFocusableElement = createFocusableElement(onLastHiddenElementFocus, 'lastfocusableelement');
-    if (firstFocusableElement.ref.current && lastFocusableElement.ref.current) {
-      firstFocusableElement.ref.current.$_pfocustrap_lasthiddenfocusableelement = lastFocusableElement.ref.current;
-      lastFocusableElement.ref.current.$_pfocustrap_firsthiddenfocusableelement = firstFocusableElement.ref.current;
+    var firstFocusableElement = createFocusableElement(firstFocusableElementRef, onFirstHiddenElementFocus, 'firstfocusableelement');
+    var lastFocusableElement = createFocusableElement(lastFocusableElementRef, onLastHiddenElementFocus, 'lastfocusableelement');
+    if (firstFocusableElementRef.current && lastFocusableElementRef.current) {
+      firstFocusableElementRef.current.$_pfocustrap_lasthiddenfocusableelement = lastFocusableElementRef.current;
+      lastFocusableElementRef.current.$_pfocustrap_firsthiddenfocusableelement = firstFocusableElementRef.current;
     }
     return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, firstFocusableElement, props.children, lastFocusableElement);
   };
@@ -5171,7 +5178,7 @@ var HeaderCell = /*#__PURE__*/React.memo(function (props) {
     });
   };
   var _onKeyDown = function onKeyDown(event) {
-    if ((event.code == 'Enter' || event.code === 'NumpadEnter' || event.code == 'Space') && event.currentTarget === elementRef.current && DomHandler.getAttribute(event.currentTarget, 'data-p-sortable-column') === 'true') {
+    if ((event.code == 'Enter' || event.code === 'NumpadEnter' || event.code == 'Space') && event.target === elementRef.current && DomHandler.getAttribute(event.currentTarget, 'data-p-sortable-column') === true) {
       _onClick(event);
       event.preventDefault();
     }
@@ -5429,6 +5436,7 @@ var TableHeader = /*#__PURE__*/React.memo(function (props) {
     ptm = _props$ptCallbacks.ptm,
     ptmo = _props$ptCallbacks.ptmo,
     cx = _props$ptCallbacks.cx;
+  var context = React.useContext(PrimeReactContext);
   var getColumnProp = function getColumnProp(column, name) {
     return ColumnBase.getCProp(column, name);
   };
@@ -5637,7 +5645,7 @@ var TableHeader = /*#__PURE__*/React.memo(function (props) {
       return rows.map(function (row, i) {
         var headerRowProps = mergeProps({
           role: 'row'
-        }, getRowPTOptions(row, 'root'));
+        }, RowBase.getProps(row.props, context), getRowPTOptions(row, 'root'));
         return /*#__PURE__*/React.createElement("tr", _extends({}, headerRowProps, {
           key: i
         }), createGroupHeaderCells(row));