primereact 10.8.4 → 10.9.0

package/datatable/datatable.js

@@ -760,15 +760,15 @@ this.primereact.datatable = (function (exports, React, PrimeReact$1, componentba
         utils.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__namespace.useImperativeHandle(ref, function () {
       return {
@@ -819,10 +819,10 @@ this.primereact.datatable = (function (exports, React, PrimeReact$1, componentba
         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);
@@ -1179,6 +1179,7 @@ this.primereact.datatable = (function (exports, React, PrimeReact$1, componentba
     var keyHelperRef = React__namespace.useRef(null);
     var overlayEventListener = React__namespace.useRef(null);
     var selfClick = React__namespace.useRef(false);
+    var focusTimeout = React__namespace.useRef(null);
     var initFocusTimeout = React__namespace.useRef(null);
     var editingRowDataStateRef = React__namespace.useRef(null);
     var _props$ptCallbacks = props.ptCallbacks,
@@ -1223,12 +1224,13 @@ this.primereact.datatable = (function (exports, React, PrimeReact$1, componentba
     var _useEventListener = hooks.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,
@@ -1359,11 +1361,14 @@ this.primereact.datatable = (function (exports, React, PrimeReact$1, componentba
       }
     };
     var focusOnElement = function focusOnElement() {
-      if (editingState) {
-        var focusableEl = props.editMode === 'cell' ? utils.DomHandler.getFirstFocusableElement(elementRef.current, ':not([data-pc-section="editorkeyhelperlabel"])') : utils.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' ? utils.DomHandler.getFirstFocusableElement(elementRef.current, ':not([data-pc-section="editorkeyhelperlabel"])') : utils.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);
@@ -1590,7 +1595,8 @@ this.primereact.datatable = (function (exports, React, PrimeReact$1, componentba
       if (props.editMode === 'cell' || props.editMode === 'row') {
         focusOnElement();
       }
-    });
+    }, [props.editMode, props.editing, editingState]); // eslint-disable-line react-hooks/exhaustive-deps
+
     React__namespace.useEffect(function () {
       if (props.editMode === 'row' && props.editing !== editingState) {
         setEditingState(props.editing);
@@ -2830,10 +2836,10 @@ this.primereact.datatable = (function (exports, React, PrimeReact$1, componentba
       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
@@ -3051,7 +3057,7 @@ this.primereact.datatable = (function (exports, React, PrimeReact$1, componentba
       var event = e.originalEvent;
       var isDraggableHandle = isUnstyled() ? utils.DomHandler.getAttribute(event.target, 'data-pc-section') === 'rowreordericon' || event.target.closest('[data-pc-section="rowreordericon"]') : utils.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;
@@ -3663,6 +3669,7 @@ this.primereact.datatable = (function (exports, React, PrimeReact$1, componentba
     var getRowProps = function getRowProps(row) {
       return ColumnGroupBase.getCProps(row);
     };
+    var context = React__namespace.useContext(PrimeReact$1.PrimeReactContext);
     var getColumnGroupProps = function getColumnGroupProps() {
       return props.footerColumnGroup ? ColumnGroupBase.getCProps(props.footerColumnGroup) : undefined;
     };
@@ -3720,7 +3727,7 @@ this.primereact.datatable = (function (exports, React, PrimeReact$1, componentba
         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__namespace.createElement("tr", _extends({}, rootProps, {
             key: i
           }), createGroupFooterCells(row));
@@ -4101,9 +4108,9 @@ this.primereact.datatable = (function (exports, React, PrimeReact$1, componentba
       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["default"].createElement("span", {
-          ref: section === 'firstfocusableelement' ? firstFocusableElementRef : lastFocusableElementRef,
+          ref: inRef,
           className: 'p-hidden-accessible p-hidden-focusable',
           tabIndex: tabIndex,
           role: 'presentation',
@@ -4114,11 +4121,11 @@ this.primereact.datatable = (function (exports, React, PrimeReact$1, componentba
           "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["default"].createElement(React__default["default"].Fragment, null, firstFocusableElement, props.children, lastFocusableElement);
     };
@@ -5165,7 +5172,7 @@ this.primereact.datatable = (function (exports, React, PrimeReact$1, componentba
       });
     };
     var _onKeyDown = function onKeyDown(event) {
-      if ((event.code == 'Enter' || event.code === 'NumpadEnter' || event.code == 'Space') && event.currentTarget === elementRef.current && utils.DomHandler.getAttribute(event.currentTarget, 'data-p-sortable-column') === 'true') {
+      if ((event.code == 'Enter' || event.code === 'NumpadEnter' || event.code == 'Space') && event.target === elementRef.current && utils.DomHandler.getAttribute(event.currentTarget, 'data-p-sortable-column') === true) {
         _onClick(event);
         event.preventDefault();
       }
@@ -5423,6 +5430,7 @@ this.primereact.datatable = (function (exports, React, PrimeReact$1, componentba
       ptm = _props$ptCallbacks.ptm,
       ptmo = _props$ptCallbacks.ptmo,
       cx = _props$ptCallbacks.cx;
+    var context = React__namespace.useContext(PrimeReact$1.PrimeReactContext);
     var getColumnProp = function getColumnProp(column, name) {
       return ColumnBase.getCProp(column, name);
     };
@@ -5631,7 +5639,7 @@ this.primereact.datatable = (function (exports, React, PrimeReact$1, componentba
         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__namespace.createElement("tr", _extends({}, headerRowProps, {
             key: i
           }), createGroupHeaderCells(row));