primereact 10.7.0 → 10.8.1

package/datatable/datatable.js

@@ -905,7 +905,7 @@ this.primereact.datatable = (function (exports, React, PrimeReact$1, componentba
       props: props
     });
     var tabIndex = props.disabled ? null : '0';
-    var checkboxProps = mergeProps({
+    var checkboxProps = {
       role: 'checkbox',
       'aria-checked': props.checked,
       tabIndex: tabIndex,
@@ -913,8 +913,10 @@ this.primereact.datatable = (function (exports, React, PrimeReact$1, componentba
       'aria-label': props.ariaLabel,
       checked: props.checked,
       icon: checkIcon,
-      disabled: props.disabled
-    }, getColumnPTOptions('rowCheckbox'));
+      disabled: props.disabled,
+      unstyled: props.unstyled,
+      pt: getColumnPTOptions('rowCheckbox')
+    };
     return /*#__PURE__*/React__namespace.createElement(Checkbox, checkboxProps);
   });
   RowCheckbox.displayName = 'RowCheckbox';
@@ -930,9 +932,9 @@ this.primereact.datatable = (function (exports, React, PrimeReact$1, componentba
         'p-variant-filled': props.variant ? props.variant === 'filled' : context && context.inputStyle === 'filled'
       });
     },
-    radiobuttonbox: 'p-radiobutton-box',
-    radiobuttoninput: 'p-radiobutton-input',
-    radiobuttonicon: 'p-radiobutton-icon'
+    box: 'p-radiobutton-box',
+    input: 'p-radiobutton-input',
+    icon: 'p-radiobutton-icon'
   };
   var RadioButtonBase = componentbase.ComponentBase.extend({
     defaultProps: {
@@ -1089,19 +1091,19 @@ this.primereact.datatable = (function (exports, React, PrimeReact$1, componentba
         readOnly: props.readonly,
         required: props.required,
         tabIndex: props.tabIndex,
-        className: cx('radiobuttoninput')
-      }, ariaProps), inProps.input, ptm('radiobuttoninput'));
+        className: cx('input')
+      }, ariaProps), inProps.input, ptm('input'));
       return /*#__PURE__*/React__namespace.createElement("input", _extends({
         ref: inputRef
       }, inputProps));
     };
     var createBoxElement = function createBoxElement() {
       var boxProps = mergeProps({
-        className: cx('radiobuttonbox')
-      }, inProps.box, ptm('radiobuttonbox'));
+        className: cx('box')
+      }, inProps.box, ptm('box'));
       var iconProps = mergeProps({
-        className: cx('radiobuttonicon')
-      }, inProps.icon, ptm('radiobuttonicon'));
+        className: cx('icon')
+      }, inProps.icon, ptm('icon'));
       return /*#__PURE__*/React__namespace.createElement("div", boxProps, /*#__PURE__*/React__namespace.createElement("div", iconProps));
     };
     return /*#__PURE__*/React__namespace.createElement(React__namespace.Fragment, null, /*#__PURE__*/React__namespace.createElement("div", _extends({
@@ -1143,18 +1145,16 @@ this.primereact.datatable = (function (exports, React, PrimeReact$1, componentba
         props.onChange(event);
       }
     };
-    var radioButtonProps = mergeProps({
+    var radioButtonProps = {
       role: 'radio',
       'aria-checked': props.checked,
       checked: props.checked,
       disabled: props.disabled,
       name: "".concat(props.tableSelector, "_dt_radio"),
       onChange: onChange,
-      input: getColumnPTOptions('radiobuttoninput'),
-      box: getColumnPTOptions('radiobuttonbox'),
-      icon: getColumnPTOptions('radiobuttonicon'),
-      unstyled: props.unstyled
-    }, getColumnPTOptions('radiobutton'));
+      unstyled: props.unstyled,
+      pt: getColumnPTOptions('rowRadioButton')
+    };
     return /*#__PURE__*/React__namespace.createElement(RadioButton, radioButtonProps);
   });
   RowRadioButton.displayName = 'RowRadioButton';
@@ -2445,7 +2445,8 @@ this.primereact.datatable = (function (exports, React, PrimeReact$1, componentba
     var _props$ptCallbacks = props.ptCallbacks,
       ptm = _props$ptCallbacks.ptm,
       ptmo = _props$ptCallbacks.ptmo,
-      cx = _props$ptCallbacks.cx;
+      cx = _props$ptCallbacks.cx,
+      isUnstyled = _props$ptCallbacks.isUnstyled;
     var _onClick = function onClick(event) {
       props.onClick({
         originalEvent: event,
@@ -2468,8 +2469,9 @@ this.primereact.datatable = (function (exports, React, PrimeReact$1, componentba
     };
     var rowGroupTogglerIconProps = mergeProps({
       className: cx('rowGroupTogglerIcon'),
-      'aria-hidden': true
-    }, getColumnPTOptions('rowGroupTogglerIcon'));
+      'aria-hidden': true,
+      unstyled: isUnstyled()
+    }, ptm('rowGroupTogglerIcon'), getColumnPTOptions('rowGroupTogglerIcon'));
     var icon = props.expanded ? props.expandedRowIcon || /*#__PURE__*/React__namespace.createElement(chevrondown.ChevronDownIcon, rowGroupTogglerIconProps) : props.collapsedRowIcon || /*#__PURE__*/React__namespace.createElement(chevronright.ChevronRightIcon, rowGroupTogglerIconProps);
     var togglerIcon = utils.IconUtils.getJSXIcon(icon, _objectSpread$8({}, rowGroupTogglerIconProps), {
       props: props
@@ -2482,8 +2484,9 @@ this.primereact.datatable = (function (exports, React, PrimeReact$1, componentba
       },
       className: cx('rowGroupToggler'),
       tabIndex: props.tabIndex,
-      'aria-label': label
-    }, getColumnPTOptions('rowGroupToggler'));
+      'aria-label': label,
+      unstyled: isUnstyled()
+    }, ptm('rowGroupToggler'), getColumnPTOptions('rowGroupToggler'));
     return /*#__PURE__*/React__namespace.createElement("button", rowGroupTogglerProps, togglerIcon, /*#__PURE__*/React__namespace.createElement(ripple.Ripple, null));
   });
   RowTogglerButton.displayName = 'RowTogglerButton';
@@ -2497,7 +2500,7 @@ this.primereact.datatable = (function (exports, React, PrimeReact$1, componentba
       ptm = _props$ptCallbacks.ptm,
       ptmo = _props$ptCallbacks.ptmo,
       cx = _props$ptCallbacks.cx,
-      isUnsyled = _props$ptCallbacks.isUnsyled;
+      isUnstyled = _props$ptCallbacks.isUnstyled;
     var _React$useState = React__namespace.useState({}),
       _React$useState2 = _slicedToArray(_React$useState, 2),
       rowGroupHeaderStyleObjectState = _React$useState2[0],
@@ -2816,32 +2819,20 @@ this.primereact.datatable = (function (exports, React, PrimeReact$1, componentba
     var selectRange = function selectRange(event) {
       var rangeStart;
       var rangeEnd;
-      var selectedSize;
       var isAllowCellSelection = allowCellSelection();
-      var index = utils.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;
       }
       return isAllowCellSelection ? selectRangeOnCell(event, rangeStart, rangeEnd) : selectRangeOnRow(event, rangeStart, rangeEnd);
     };
     var selectRangeOnRow = function selectRangeOnRow(event, rowRangeStart, rowRangeEnd) {
-      var value = props.value;
+      var value = props.tableProps.value;
       var selection = [];
       for (var i = rowRangeStart; i <= rowRangeEnd; i++) {
         var rangeRowData = value[i];
@@ -2932,7 +2923,7 @@ this.primereact.datatable = (function (exports, React, PrimeReact$1, componentba
       if (props.dragSelection && !dragSelectionHelper.current) {
         dragSelectionHelper.current = document.createElement('div');
         dragSelectionHelper.current.setAttribute('p-datatable-drag-selection-helper', 'true');
-        !isUnsyled && utils.DomHandler.addClass(dragSelectionHelper.current, 'p-datatable-drag-selection-helper');
+        !isUnstyled() && utils.DomHandler.addClass(dragSelectionHelper.current, 'p-datatable-drag-selection-helper');
         initialDragPosition.current = {
           x: event.clientX,
           y: event.clientY
@@ -3060,7 +3051,10 @@ this.primereact.datatable = (function (exports, React, PrimeReact$1, componentba
     };
     var onRowMouseDown = function onRowMouseDown(e) {
       var event = e.originalEvent;
-      if (!isUnsyled && utils.DomHandler.hasClass(event.target, 'p-datatable-reorderablerow-handle')) {
+      if (!isUnstyled() && utils.DomHandler.hasClass(event.target, 'p-datatable-reorderablerow-handle')) {
+        event.currentTarget.draggable = true;
+        event.target.draggable = false;
+      } else if (isUnstyled() && utils.DomHandler.getAttribute(event.target, 'data-pc-section') === 'rowreordericon') {
         event.currentTarget.draggable = true;
         event.target.draggable = false;
       } else {
@@ -3152,26 +3146,26 @@ this.primereact.datatable = (function (exports, React, PrimeReact$1, componentba
         var prevRowElement = rowElement.previousElementSibling;
         if (pageY < rowMidY) {
           rowElement.setAttribute('data-p-datatable-dragpoint-bottom', 'false');
-          !isUnsyled && utils.DomHandler.removeClass(rowElement, 'p-datatable-dragpoint-bottom');
+          !isUnstyled() && utils.DomHandler.removeClass(rowElement, 'p-datatable-dragpoint-bottom');
           droppedRowIndex.current = index;
           if (prevRowElement) {
             prevRowElement.setAttribute('data-p-datatable-dragpoint-bottom', 'true');
-            !isUnsyled && utils.DomHandler.addClass(prevRowElement, 'p-datatable-dragpoint-bottom');
+            !isUnstyled() && utils.DomHandler.addClass(prevRowElement, 'p-datatable-dragpoint-bottom');
           } else {
             rowElement.setAttribute('data-p-datatable-dragpoint-top', 'true');
-            !isUnsyled && utils.DomHandler.addClass(rowElement, 'p-datatable-dragpoint-top');
+            !isUnstyled() && utils.DomHandler.addClass(rowElement, 'p-datatable-dragpoint-top');
           }
         } else {
           if (prevRowElement) {
             prevRowElement.setAttribute('data-p-datatable-dragpoint-bottom', 'false');
-            !isUnsyled && utils.DomHandler.removeClass(prevRowElement, 'p-datatable-dragpoint-bottom');
+            !isUnstyled() && utils.DomHandler.removeClass(prevRowElement, 'p-datatable-dragpoint-bottom');
           } else {
             rowElement.setAttribute('data-p-datatable-dragpoint-top', 'true');
-            !isUnsyled && utils.DomHandler.addClass(rowElement, 'p-datatable-dragpoint-top');
+            !isUnstyled() && utils.DomHandler.addClass(rowElement, 'p-datatable-dragpoint-top');
           }
           droppedRowIndex.current = index + 1;
           rowElement.setAttribute('data-p-datatable-dragpoint-bottom', 'true');
-          !isUnsyled && utils.DomHandler.addClass(rowElement, 'p-datatable-dragpoint-bottom');
+          !isUnstyled() && utils.DomHandler.addClass(rowElement, 'p-datatable-dragpoint-bottom');
         }
       }
       event.preventDefault();
@@ -3182,12 +3176,12 @@ this.primereact.datatable = (function (exports, React, PrimeReact$1, componentba
       var prevRowElement = rowElement.previousElementSibling;
       if (prevRowElement) {
         prevRowElement.setAttribute('data-p-datatable-dragpoint-bottom', 'false');
-        !isUnsyled && utils.DomHandler.removeClass(prevRowElement, 'p-datatable-dragpoint-bottom');
+        !isUnstyled() && utils.DomHandler.removeClass(prevRowElement, 'p-datatable-dragpoint-bottom');
       }
       rowElement.setAttribute('data-p-datatable-dragpoint-bottom', 'false');
-      !isUnsyled && utils.DomHandler.removeClass(rowElement, 'p-datatable-dragpoint-bottom');
+      !isUnstyled() && utils.DomHandler.removeClass(rowElement, 'p-datatable-dragpoint-bottom');
       rowElement.setAttribute('data-p-datatable-dragpoint-top', 'false');
-      !isUnsyled && utils.DomHandler.removeClass(rowElement, 'p-datatable-dragpoint-top');
+      !isUnstyled() && utils.DomHandler.removeClass(rowElement, 'p-datatable-dragpoint-top');
     };
     var onRowDragEnd = function onRowDragEnd(e) {
       var event = e.originalEvent;
@@ -3363,7 +3357,7 @@ this.primereact.datatable = (function (exports, React, PrimeReact$1, componentba
           collapsedRowIcon: props.collapsedRowIcon,
           ptCallbacks: props.ptCallbacks,
           metaData: props.metaData,
-          unstyled: props.unstyled
+          unstyled: isUnstyled()
         });
         var options = {
           index: rowIndex,
@@ -3469,7 +3463,7 @@ this.primereact.datatable = (function (exports, React, PrimeReact$1, componentba
           virtualScrollerOptions: props.virtualScrollerOptions,
           ptCallbacks: props.ptCallbacks,
           metaData: props.metaData,
-          unstyled: props.unstyled
+          unstyled: isUnstyled()
         });
       }
     };
@@ -3833,18 +3827,20 @@ this.primereact.datatable = (function (exports, React, PrimeReact$1, componentba
   _defineProperty(PrimeReact, "changeTheme", function (currentTheme, newTheme, linkElementId, callback) {
     var _linkElement$parentNo;
     var linkElement = document.getElementById(linkElementId);
-    var cloneLinkElement = linkElement.cloneNode(true);
+    if (!linkElement) {
+      throw Error("Element with id ".concat(linkElementId, " not found."));
+    }
     var newThemeUrl = linkElement.getAttribute('href').replace(currentTheme, newTheme);
-    cloneLinkElement.setAttribute('id', linkElementId + '-clone');
-    cloneLinkElement.setAttribute('href', newThemeUrl);
-    cloneLinkElement.addEventListener('load', function () {
-      linkElement.remove();
-      cloneLinkElement.setAttribute('id', linkElementId);
+    var newLinkElement = document.createElement('link');
+    newLinkElement.setAttribute('rel', 'stylesheet');
+    newLinkElement.setAttribute('id', linkElementId);
+    newLinkElement.setAttribute('href', newThemeUrl);
+    newLinkElement.addEventListener('load', function () {
       if (callback) {
         callback();
       }
     });
-    (_linkElement$parentNo = linkElement.parentNode) === null || _linkElement$parentNo === void 0 || _linkElement$parentNo.insertBefore(cloneLinkElement, linkElement.nextSibling);
+    (_linkElement$parentNo = linkElement.parentNode) === null || _linkElement$parentNo === void 0 || _linkElement$parentNo.replaceChild(newLinkElement, linkElement);
   });
 
   var locales = {
@@ -5007,7 +5003,7 @@ this.primereact.datatable = (function (exports, React, PrimeReact$1, componentba
       props: props
     });
     var tabIndex = props.disabled ? null : 0;
-    var headerCheckboxProps = mergeProps({
+    var headerCheckboxProps = {
       role: 'checkbox',
       'aria-checked': props.checked,
       'aria-label': props.checked ? ariaLabel('selectAll') : ariaLabel('unselectAll'),
@@ -5015,8 +5011,10 @@ this.primereact.datatable = (function (exports, React, PrimeReact$1, componentba
       onChange: onChange,
       icon: checkIcon,
       checked: props.checked,
-      disabled: props.disabled
-    }, getColumnPTOptions('headerCheckbox'));
+      disabled: props.disabled,
+      unstyled: props.unstyled,
+      pt: getColumnPTOptions('headerCheckbox')
+    };
     return /*#__PURE__*/React__namespace.createElement(Checkbox, headerCheckboxProps);
   });
   HeaderCheckbox.displayName = 'HeaderCheckbox';
@@ -7053,8 +7051,7 @@ this.primereact.datatable = (function (exports, React, PrimeReact$1, componentba
           className: ptCallbacks.cx('loadingIcon')
         }, ptCallbacks.ptm('loadingIcon'));
         var icon = props.loadingIcon || /*#__PURE__*/React__namespace.createElement(spinner.SpinnerIcon, _extends({}, loadingIconProps, {
-          spin: true,
-          unstyled: props.unstyled
+          spin: true
         }));
         var loadingIcon = utils.IconUtils.getJSXIcon(icon, _objectSpread({}, loadingIconProps), {
           props: props