primereact 10.5.0 → 10.5.2

package/datatable/datatable.d.ts

@@ -511,11 +511,15 @@ interface DataTableRowEditEvent extends DataTableRowEvent {
  * @see {@link DataTableProps.onRowEditSave}
  * @extends DataTableRowEditEvent
  */
-interface DataTableRowEditSaveEvent extends DataTableRowEditEvent {
+interface DataTableRowEditSaveEvent<TValue extends DataTableValueArray> extends DataTableRowEditEvent {
     /**
      * Whether the row is valid or not.
      */
     valid: boolean;
+    /**
+     * Editing row data.
+     */
+    newData: DataTableRowData<TValue>;
 }
 
 /**
@@ -612,7 +616,7 @@ interface DataTableColReorderEvent {
     /**
      * Columns array after reorder.
      */
-    columns: React.ReactElement;
+    columns: Column[];
 }
 
 /**
@@ -732,6 +736,10 @@ interface DataTableRowEditValidatorOptions<TValue extends DataTableValueArray> {
      * The props of the datatable.
      */
     props: DataTableProps<TValue>;
+    /**
+     * Index of validated row
+     */
+    rowIndex: number;
 }
 
 /**
@@ -1556,7 +1564,7 @@ interface DataTableBaseProps<TValue extends DataTableValueArray> extends Omit<Re
      * Callback to invoke when the save icon is clicked on row editing mode.
      * @param {DataTableRowEditSaveEvent} event - Custom row edit save event.
      */
-    onRowEditSave?(event: DataTableRowEditSaveEvent): void;
+    onRowEditSave?(event: DataTableRowEditSaveEvent<TValue>): void;
     /**
      * Callback to invoke when a row is expanded.
      * @param {DataTableRowEvent} event - Custom row event.

package/datatable/datatable.esm.js

@@ -549,7 +549,7 @@ var DataTableBase = ComponentBase.extend({
     lazy: false,
     loading: false,
     loadingIcon: null,
-    metaKeySelection: true,
+    metaKeySelection: false,
     multiSortMeta: null,
     onAllRowsSelect: null,
     onAllRowsUnselect: null,
@@ -931,6 +931,9 @@ var BodyCell = /*#__PURE__*/React.memo(function (props) {
   };
   var field = getColumnProp('field') || "field_".concat(props.index);
   var editingKey = props.dataKey ? props.rowData && props.rowData[props.dataKey] || props.rowIndex : props.rowIndex;
+  var isEditable = function isEditable() {
+    return getColumnProp('editor');
+  };
   var _useEventListener = useEventListener({
       type: 'click',
       listener: function listener(e) {
@@ -942,14 +945,12 @@ var BodyCell = /*#__PURE__*/React.memo(function (props) {
         }
         selfClick.current = false;
       },
-      options: true
+      options: true,
+      when: isEditable()
     }),
     _useEventListener2 = _slicedToArray(_useEventListener, 2),
     bindDocumentClickListener = _useEventListener2[0],
     unbindDocumentClickListener = _useEventListener2[1];
-  var isEditable = function isEditable() {
-    return getColumnProp('editor');
-  };
   var isSelected = function isSelected() {
     return props.selection ? props.selection instanceof Array ? findIndex(props.selection) > -1 : equals(props.selection) : false;
   };
@@ -1499,22 +1500,23 @@ var BodyCell = /*#__PURE__*/React.memo(function (props) {
           onCancelClick: onRowEditCancel,
           cancelClassName: cx('rowEditorCancelButton')
         };
-        var rowEditorSaveButtonProps = mergeProps(_defineProperty(_defineProperty({
+        var rowEditorSaveButtonProps = mergeProps({
           type: 'button',
           name: 'row-save',
           'aria-label': ariaLabel$1('saveEdit'),
           onClick: rowEditorProps.onSaveClick,
           className: rowEditorProps.saveClassName,
-          tabIndex: props.tabIndex
-        }, "aria-label", ariaLabel$1('saveEdit')), 'data-p-row-editor-save', true), getColumnPTOptions('rowEditorSaveButton'));
-        var rowEditorCancelButtonProps = mergeProps(_defineProperty({
+          tabIndex: props.tabIndex,
+          'data-p-row-editor-save': true
+        }, getColumnPTOptions('rowEditorSaveButton'));
+        var rowEditorCancelButtonProps = mergeProps({
           type: 'button',
           name: 'row-cancel',
           'aria-label': ariaLabel$1('cancelEdit'),
           onClick: rowEditorProps.onCancelClick,
           className: rowEditorProps.cancelClassName,
           tabIndex: props.tabIndex
-        }, "aria-label", ariaLabel$1('cancelEdit')), getColumnPTOptions('rowEditorCancelButton'));
+        }, getColumnPTOptions('rowEditorCancelButton'));
         content = /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("button", rowEditorSaveButtonProps, rowEditorSaveIcon, /*#__PURE__*/React.createElement(Ripple, null)), /*#__PURE__*/React.createElement("button", rowEditorCancelButtonProps, rowEditorCancelIcon, /*#__PURE__*/React.createElement(Ripple, null)));
       } else {
         rowEditorProps = {
@@ -1522,14 +1524,15 @@ var BodyCell = /*#__PURE__*/React.memo(function (props) {
           onInitClick: onRowEditInit,
           initClassName: cx('rowEditorInitButton')
         };
-        var rowEditorInitButtonProps = mergeProps(_defineProperty(_defineProperty({
+        var rowEditorInitButtonProps = mergeProps({
           type: 'button',
           name: 'row-edit',
           'aria-label': ariaLabel$1('editRow'),
           onClick: rowEditorProps.onInitClick,
           className: rowEditorProps.initClassName,
-          tabIndex: props.tabIndex
-        }, "aria-label", ariaLabel$1('editRow')), 'data-p-row-editor-init', true), getColumnPTOptions('rowEditorInitButton'));
+          tabIndex: props.tabIndex,
+          'data-p-row-editor-init': true
+        }, getColumnPTOptions('rowEditorInitButton'));
         content = /*#__PURE__*/React.createElement("button", rowEditorInitButtonProps, rowEditorInitIcon, /*#__PURE__*/React.createElement(Ripple, null));
       }
       if (body) {
@@ -1977,13 +1980,15 @@ var BodyRow = /*#__PURE__*/React.memo(function (props) {
     var event = e.originalEvent,
       newData = e.newData;
     var valid = props.rowEditValidator ? props.rowEditValidator(newData, {
-      props: props.tableProps
+      props: props.tableProps,
+      rowIndex: props.rowIndex
     }) : true;
     if (props.onRowEditSave) {
       props.onRowEditSave({
         originalEvent: event,
         data: props.rowData,
         index: props.rowIndex,
+        newData: newData,
         valid: valid
       });
     }
@@ -2076,7 +2081,7 @@ var BodyRow = /*#__PURE__*/React.memo(function (props) {
   var rowProps = mergeProps({
     role: 'row',
     tabIndex: tabIndex,
-    className: classNames(rowClassName, cx('bodyRow', {
+    className: classNames(cx('bodyRow', {
       rowProps: props
     })),
     style: style,
@@ -2135,7 +2140,10 @@ var BodyRow = /*#__PURE__*/React.memo(function (props) {
     }),
     'data-p-highlight': props.selected,
     'data-p-highlight-contextmenu': props.contextMenuSelected
-  }, getBodyRowPTOptions('bodyRow'));
+  }, getBodyRowPTOptions('bodyRow'), {
+    className: rowClassName // #5983 must be last so all unstyled merging takes place first
+  });
+
   return /*#__PURE__*/React.createElement("tr", rowProps, content);
 });
 BodyRow.displayName = 'BodyRow';
@@ -2489,7 +2497,6 @@ var TableBody = /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef(function
         type: type
       });
     }
-    focusOnElement(originalEvent, true);
     if (props.onSelectionChange && selection !== props.selection) {
       props.onSelectionChange({
         originalEvent: originalEvent,
@@ -2511,16 +2518,27 @@ var TableBody = /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef(function
     }
     anchorRowIndex.current = rangeRowIndex.current;
     anchorCellIndex.current = event.cellIndex;
-    focusOnElement(event.originalEvent, false);
   };
   var selectRange = function selectRange(event) {
-    var rangeStart, rangeEnd;
+    var rangeStart, rangeEnd, selectedSize;
+    var isAllowCellSelection = allowCellSelection();
+    var index = ObjectUtils.findIndexInList(event.data, props.value, props.dataKey);
     if (rangeRowIndex.current > anchorRowIndex.current) {
       rangeStart = anchorRowIndex.current;
       rangeEnd = rangeRowIndex.current;
+      if (!isAllowCellSelection) {
+        selectedSize = rangeEnd - rangeStart;
+        rangeEnd = index;
+        rangeStart = index - selectedSize;
+      }
     } else if (rangeRowIndex.current < anchorRowIndex.current) {
       rangeStart = rangeRowIndex.current;
       rangeEnd = anchorRowIndex.current;
+      if (!isAllowCellSelection) {
+        selectedSize = rangeEnd - rangeStart;
+        rangeStart = index;
+        rangeEnd = index + selectedSize;
+      }
     } else {
       rangeStart = rangeEnd = rangeRowIndex.current;
     }
@@ -2528,7 +2546,7 @@ var TableBody = /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef(function
       rangeStart = Math.max(rangeStart - props.first, 0);
       rangeEnd -= props.first;
     }
-    return allowCellSelection() ? selectRangeOnCell(event, rangeStart, rangeEnd) : selectRangeOnRow(event, rangeStart, rangeEnd);
+    return isAllowCellSelection ? selectRangeOnCell(event, rangeStart, rangeEnd) : selectRangeOnRow(event, rangeStart, rangeEnd);
   };
   var selectRangeOnRow = function selectRangeOnRow(event, rowRangeStart, rowRangeEnd) {
     var value = props.value;
@@ -3517,127 +3535,127 @@ _defineProperty(PrimeReact, "changeTheme", function (currentTheme, newTheme, lin
 
 var locales = {
   en: {
-    startsWith: 'Starts with',
+    accept: 'Yes',
+    addRule: 'Add Rule',
+    am: 'AM',
+    apply: 'Apply',
+    cancel: 'Cancel',
+    choose: 'Choose',
+    chooseDate: 'Choose Date',
+    chooseMonth: 'Choose Month',
+    chooseYear: 'Choose Year',
+    clear: 'Clear',
+    completed: 'Completed',
     contains: 'Contains',
-    notContains: 'Not contains',
+    custom: 'Custom',
+    dateAfter: 'Date is after',
+    dateBefore: 'Date is before',
+    dateFormat: 'mm/dd/yy',
+    dateIs: 'Date is',
+    dateIsNot: 'Date is not',
+    dayNames: ['Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday'],
+    dayNamesMin: ['Su', 'Mo', 'Tu', 'We', 'Th', 'Fr', 'Sa'],
+    dayNamesShort: ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat'],
+    emptyFilterMessage: 'No results found',
+    emptyMessage: 'No available options',
+    emptySearchMessage: 'No results found',
+    emptySelectionMessage: 'No selected item',
     endsWith: 'Ends with',
     equals: 'Equals',
-    notEquals: 'Not equals',
-    noFilter: 'No Filter',
+    fileSizeTypes: ['B', 'KB', 'MB', 'GB', 'TB', 'PB', 'EB', 'ZB', 'YB'],
     filter: 'Filter',
-    lt: 'Less than',
-    lte: 'Less than or equal to',
+    firstDayOfWeek: 0,
     gt: 'Greater than',
     gte: 'Greater than or equal to',
-    dateIs: 'Date is',
-    dateIsNot: 'Date is not',
-    dateBefore: 'Date is before',
-    dateAfter: 'Date is after',
-    custom: 'Custom',
-    clear: 'Clear',
-    close: 'Close',
-    apply: 'Apply',
+    lt: 'Less than',
+    lte: 'Less than or equal to',
     matchAll: 'Match All',
     matchAny: 'Match Any',
-    addRule: 'Add Rule',
-    removeRule: 'Remove Rule',
-    accept: 'Yes',
-    reject: 'No',
-    choose: 'Choose',
-    upload: 'Upload',
-    cancel: 'Cancel',
-    completed: 'Completed',
-    pending: 'Pending',
-    fileSizeTypes: ['B', 'KB', 'MB', 'GB', 'TB', 'PB', 'EB', 'ZB', 'YB'],
-    dayNames: ['Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday'],
-    dayNamesShort: ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat'],
-    dayNamesMin: ['Su', 'Mo', 'Tu', 'We', 'Th', 'Fr', 'Sa'],
+    medium: 'Medium',
     monthNames: ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'],
     monthNamesShort: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'],
-    chooseYear: 'Choose Year',
-    chooseMonth: 'Choose Month',
-    chooseDate: 'Choose Date',
-    prevDecade: 'Previous Decade',
     nextDecade: 'Next Decade',
-    prevYear: 'Previous Year',
-    nextYear: 'Next Year',
-    prevMonth: 'Previous Month',
-    nextMonth: 'Next Month',
-    prevHour: 'Previous Hour',
     nextHour: 'Next Hour',
-    prevMinute: 'Previous Minute',
     nextMinute: 'Next Minute',
-    prevSecond: 'Previous Second',
+    nextMonth: 'Next Month',
     nextSecond: 'Next Second',
-    prevMilliSecond: 'Previous Second',
-    nextMilliSecond: 'Next Second',
-    am: 'am',
-    pm: 'pm',
-    today: 'Today',
+    nextYear: 'Next Year',
+    noFilter: 'No Filter',
+    notContains: 'Not contains',
+    notEquals: 'Not equals',
     now: 'Now',
-    weekHeader: 'Wk',
-    firstDayOfWeek: 0,
+    passwordPrompt: 'Enter a password',
+    pending: 'Pending',
+    pm: 'PM',
+    prevDecade: 'Previous Decade',
+    prevHour: 'Previous Hour',
+    prevMinute: 'Previous Minute',
+    prevMonth: 'Previous Month',
+    prevSecond: 'Previous Second',
+    prevYear: 'Previous Year',
+    reject: 'No',
+    removeRule: 'Remove Rule',
+    searchMessage: '{0} results are available',
+    selectionMessage: '{0} items selected',
     showMonthAfterYear: false,
-    dateFormat: 'mm/dd/yy',
-    weak: 'Weak',
-    medium: 'Medium',
+    startsWith: 'Starts with',
     strong: 'Strong',
-    passwordPrompt: 'Enter a password',
-    emptyFilterMessage: 'No available options',
-    emptyMessage: 'No results found',
+    today: 'Today',
+    upload: 'Upload',
+    weak: 'Weak',
+    weekHeader: 'Wk',
     aria: {
-      trueLabel: 'True',
-      falseLabel: 'False',
-      nullLabel: 'Not Selected',
-      star: '1 star',
-      stars: '{star} stars',
-      selectAll: 'All items selected',
-      unselectAll: 'All items unselected',
+      cancelEdit: 'Cancel Edit',
       close: 'Close',
-      previous: 'Previous',
-      next: 'Next',
-      navigation: 'Navigation',
-      scrollTop: 'Scroll Top',
-      moveTop: 'Move Top',
-      moveUp: 'Move Up',
-      moveDown: 'Move Down',
-      moveBottom: 'Move Bottom',
-      moveToTarget: 'Move to Target',
-      moveToSource: 'Move to Source',
-      moveAllToTarget: 'Move All to Target',
-      moveAllToSource: 'Move All to Source',
-      pageLabel: 'Page {page}',
+      collapseRow: 'Row Collapsed',
+      editRow: 'Edit Row',
+      expandRow: 'Row Expanded',
+      falseLabel: 'False',
+      filterConstraint: 'Filter Constraint',
+      filterOperator: 'Filter Operator',
       firstPageLabel: 'First Page',
+      gridView: 'Grid View',
+      hideFilterMenu: 'Hide Filter Menu',
+      jumpToPageDropdownLabel: 'Jump to Page Dropdown',
+      jumpToPageInputLabel: 'Jump to Page Input',
       lastPageLabel: 'Last Page',
+      listView: 'List View',
+      moveAllToSource: 'Move All to Source',
+      moveAllToTarget: 'Move All to Target',
+      moveBottom: 'Move Bottom',
+      moveDown: 'Move Down',
+      moveToSource: 'Move to Source',
+      moveToTarget: 'Move to Target',
+      moveTop: 'Move Top',
+      moveUp: 'Move Up',
+      navigation: 'Navigation',
+      next: 'Next',
       nextPageLabel: 'Next Page',
+      nullLabel: 'Not Selected',
+      pageLabel: 'Page {page}',
+      otpLabel: 'Please enter one time password character {0}',
+      passwordHide: 'Hide Password',
+      passwordShow: 'Show Password',
+      previous: 'Previous',
       previousPageLabel: 'Previous Page',
+      rotateLeft: 'Rotate Left',
+      rotateRight: 'Rotate Right',
       rowsPerPageLabel: 'Rows per page',
-      jumpToPageDropdownLabel: 'Jump to Page Dropdown',
-      jumpToPageInputLabel: 'Jump to Page Input',
+      saveEdit: 'Save Edit',
+      scrollTop: 'Scroll Top',
+      selectAll: 'All items selected',
       selectRow: 'Row Selected',
-      unselectRow: 'Row Unselected',
-      expandRow: 'Row Expanded',
-      collapseRow: 'Row Collapsed',
       showFilterMenu: 'Show Filter Menu',
-      hideFilterMenu: 'Hide Filter Menu',
-      filterOperator: 'Filter Operator',
-      filterConstraint: 'Filter Constraint',
-      editRow: 'Row Edit',
-      saveEdit: 'Save Edit',
-      cancelEdit: 'Cancel Edit',
-      listView: 'List View',
-      gridView: 'Grid View',
       slide: 'Slide',
       slideNumber: '{slideNumber}',
+      star: '1 star',
+      stars: '{star} stars',
+      trueLabel: 'True',
+      unselectAll: 'All items unselected',
+      unselectRow: 'Row Unselected',
       zoomImage: 'Zoom Image',
       zoomIn: 'Zoom In',
-      zoomOut: 'Zoom Out',
-      rotateRight: 'Rotate Right',
-      rotateLeft: 'Rotate Left',
-      selectLabel: 'Select',
-      unselectLabel: 'Unselect',
-      expandLabel: 'Expand',
-      collapseLabel: 'Collapse'
+      zoomOut: 'Zoom Out'
     }
   }
 };
@@ -3794,7 +3812,9 @@ var ColumnFilter = /*#__PURE__*/React.memo(function (props) {
     overlayVisibleState = _React$useState2[0],
     setOverlayVisibleState = _React$useState2[1];
   var overlayRef = React.useRef(null);
-  var overlayId = React.useRef(UniqueComponentId());
+  var overlayId = React.useRef(function () {
+    return UniqueComponentId();
+  });
   var iconRef = React.useRef(null);
   var selfClick = React.useRef(false);
   var overlayEventListener = React.useRef(null);
@@ -5071,11 +5091,10 @@ var HeaderCell = /*#__PURE__*/React.memo(function (props) {
       ref: elementRef
     }, headerCellProps), resizer, header), hasTooltip && /*#__PURE__*/React.createElement(Tooltip, _extends({
       target: elementRef,
-      content: headerTooltip
-    }, headerTooltipOptions, {
+      content: headerTooltip,
       pt: getColumnPTOptions('tooltip'),
       unstyled: props.unstyled
-    })));
+    }, headerTooltipOptions)));
   };
   var element = createElement();
   return element;