primevue 3.16.2 → 3.17.0

package/datatable/datatable.esm.js

@@ -44,13 +44,13 @@ const _hoisted_1$a = ["aria-checked", "tabindex"];
 
 function render$a(_ctx, _cache, $props, $setup, $data, $options) {
   return (openBlock(), createElementBlock("div", {
-    class: normalizeClass(['p-checkbox p-component', {'p-checkbox-focused': $data.focused, 'p-disabled': _ctx.$attrs.disabled}]),
+    class: normalizeClass(['p-checkbox p-component', { 'p-checkbox-focused': $data.focused, 'p-disabled': _ctx.$attrs.disabled }]),
     onClick: _cache[2] || (_cache[2] = (...args) => ($options.onClick && $options.onClick(...args))),
     onKeydown: _cache[3] || (_cache[3] = withKeys(withModifiers((...args) => ($options.onClick && $options.onClick(...args)), ["prevent"]), ["space"]))
   }, [
     createElementVNode("div", {
       ref: "box",
-      class: normalizeClass(['p-checkbox-box p-component', {'p-highlight': $props.checked, 'p-disabled': _ctx.$attrs.disabled, 'p-focus': $data.focused}]),
+      class: normalizeClass(['p-checkbox-box p-component', { 'p-highlight': $props.checked, 'p-disabled': _ctx.$attrs.disabled, 'p-focus': $data.focused }]),
       role: "checkbox",
       "aria-checked": $props.checked,
       tabindex: _ctx.$attrs.disabled ? null : '0',
@@ -58,7 +58,7 @@ function render$a(_ctx, _cache, $props, $setup, $data, $options) {
       onBlur: _cache[1] || (_cache[1] = $event => ($options.onBlur($event)))
     }, [
       createElementVNode("span", {
-        class: normalizeClass(['p-checkbox-icon', {'pi pi-check': $props.checked}])
+        class: normalizeClass(['p-checkbox-icon', { 'pi pi-check': $props.checked }])
       }, null, 2)
     ], 42, _hoisted_1$a)
   ], 34))
@@ -68,7 +68,7 @@ script$a.render = render$a;
 
 var script$9 = {
     name: 'ColumnFilter',
-    emits: ['filter-change','filter-apply','operator-change','matchmode-change','constraint-add','constraint-remove','filter-clear','apply-click'],
+    emits: ['filter-change', 'filter-apply', 'operator-change', 'matchmode-change', 'constraint-add', 'constraint-remove', 'filter-clear', 'apply-click'],
     props: {
         field: {
             type: String,
@@ -145,7 +145,7 @@ var script$9 = {
             overlayVisible: false,
             defaultMatchMode: null,
             defaultOperator: null
-        }
+        };
     },
     overlay: null,
     selfClick: false,
@@ -164,24 +164,24 @@ var script$9 = {
     mounted() {
         if (this.filters && this.filters[this.field]) {
             let fieldFilters = this.filters[this.field];
+
             if (fieldFilters.operator) {
                 this.defaultMatchMode = fieldFilters.constraints[0].matchMode;
                 this.defaultOperator = fieldFilters.operator;
-            }
-            else {
+            } else {
                 this.defaultMatchMode = this.filters[this.field].matchMode;
             }
         }
     },
     methods: {
         clearFilter() {
-            let _filters = {...this.filters};
+            let _filters = { ...this.filters };
+
             if (_filters[this.field].operator) {
                 _filters[this.field].constraints.splice(1);
                 _filters[this.field].operator = this.defaultOperator;
-                _filters[this.field].constraints[0] = {value: null, matchMode: this.defaultMatchMode};
-            }
-            else {
+                _filters[this.field].constraints[0] = { value: null, matchMode: this.defaultMatchMode };
+            } else {
                 _filters[this.field].value = null;
                 _filters[this.field].matchMode = this.defaultMatchMode;
             }
@@ -192,18 +192,17 @@ var script$9 = {
             this.hide();
         },
         applyFilter() {
-            this.$emit('apply-click', {field: this.field, constraints: this.filters[this.field]});
+            this.$emit('apply-click', { field: this.field, constraints: this.filters[this.field] });
             this.$emit('filter-apply');
             this.hide();
         },
         hasFilter() {
             if (this.filtersStore) {
                 let fieldFilter = this.filtersStore[this.field];
+
                 if (fieldFilter) {
-                    if (fieldFilter.operator)
-                        return !this.isFilterBlank(fieldFilter.constraints[0].value);
-                    else
-                        return !this.isFilterBlank(fieldFilter.value);
+                    if (fieldFilter.operator) return !this.isFilterBlank(fieldFilter.constraints[0].value);
+                    else return !this.isFilterBlank(fieldFilter.value);
                 }
             }
 
@@ -214,48 +213,51 @@ var script$9 = {
         },
         isFilterBlank(filter) {
             if (filter !== null && filter !== undefined) {
-                if ((typeof filter === 'string' && filter.trim().length == 0) || (filter instanceof Array && filter.length == 0))
-                    return true;
-                else
-                    return false;
+                if ((typeof filter === 'string' && filter.trim().length == 0) || (filter instanceof Array && filter.length == 0)) return true;
+                else return false;
             }
+
             return true;
         },
         toggleMenu() {
             this.overlayVisible = !this.overlayVisible;
         },
         onToggleButtonKeyDown(event) {
-            switch(event.key) {
+            switch (event.key) {
                 case 'Escape':
                 case 'Tab':
                     this.overlayVisible = false;
-                break;
+                    break;
 
                 case 'ArrowDown':
                     if (this.overlayVisible) {
                         let focusable = DomHandler.getFocusableElements(this.overlay);
+
                         if (focusable) {
                             focusable[0].focus();
                         }
+
                         event.preventDefault();
-                    }
-                    else if (event.altKey) {
+                    } else if (event.altKey) {
                         this.overlayVisible = true;
                         event.preventDefault();
                     }
-                break;
+
+                    break;
             }
         },
         onEscape() {
             this.overlayVisible = false;
+
             if (this.$refs.icon) {
                 this.$refs.icon.focus();
             }
         },
         onRowMatchModeChange(matchMode) {
-            let _filters = {...this.filters};
+            let _filters = { ...this.filters };
+
             _filters[this.field].matchMode = matchMode;
-            this.$emit('matchmode-change', {field: this.field, matchMode: matchMode});
+            this.$emit('matchmode-change', { field: this.field, matchMode: matchMode });
             this.$emit('filter-change', _filters);
             this.$emit('filter-apply');
             this.hide();
@@ -263,9 +265,10 @@ var script$9 = {
         onRowMatchModeKeyDown(event) {
             let item = event.target;
 
-            switch(event.key) {
+            switch (event.key) {
                 case 'ArrowDown':
                     var nextItem = this.findNextItem(item);
+
                     if (nextItem) {
                         item.removeAttribute('tabindex');
                         nextItem.tabIndex = '0';
@@ -273,10 +276,11 @@ var script$9 = {
                     }
 
                     event.preventDefault();
-                break;
+                    break;
 
                 case 'ArrowUp':
                     var prevItem = this.findPrevItem(item);
+
                     if (prevItem) {
                         item.removeAttribute('tabindex');
                         prevItem.tabIndex = '0';
@@ -284,36 +288,40 @@ var script$9 = {
                     }
 
                     event.preventDefault();
-                break;
+                    break;
             }
         },
         isRowMatchModeSelected(matchMode) {
-            return (this.filters[this.field]).matchMode === matchMode;
+            return this.filters[this.field].matchMode === matchMode;
         },
         onOperatorChange(value) {
-            let _filters = {...this.filters};
+            let _filters = { ...this.filters };
+
             _filters[this.field].operator = value;
             this.$emit('filter-change', _filters);
 
-            this.$emit('operator-change', {field: this.field, operator: value});
+            this.$emit('operator-change', { field: this.field, operator: value });
+
             if (!this.showApplyButton) {
                 this.$emit('filter-apply');
             }
         },
         onMenuMatchModeChange(value, index) {
-            let _filters = {...this.filters};
+            let _filters = { ...this.filters };
+
             _filters[this.field].constraints[index].matchMode = value;
-            this.$emit('matchmode-change', {field: this.field, matchMode: value, index: index});
+            this.$emit('matchmode-change', { field: this.field, matchMode: value, index: index });
 
             if (!this.showApplyButton) {
                 this.$emit('filter-apply');
             }
         },
         addConstraint() {
-            let _filters = {...this.filters};
-            let newConstraint = {value: null, matchMode: this.defaultMatchMode};
+            let _filters = { ...this.filters };
+            let newConstraint = { value: null, matchMode: this.defaultMatchMode };
+
             _filters[this.field].constraints.push(newConstraint);
-            this.$emit('constraint-add', {field: this.field, constraing: newConstraint});
+            this.$emit('constraint-add', { field: this.field, constraing: newConstraint });
             this.$emit('filter-change', _filters);
 
             if (!this.showApplyButton) {
@@ -321,9 +329,10 @@ var script$9 = {
             }
         },
         removeConstraint(index) {
-            let _filters = {...this.filters};
+            let _filters = { ...this.filters };
             let removedConstraint = _filters[this.field].constraints.splice(index, 1);
-            this.$emit('constraint-remove', {field: this.field, constraing: removedConstraint});
+
+            this.$emit('constraint-remove', { field: this.field, constraing: removedConstraint });
             this.$emit('filter-change', _filters);
 
             if (!this.showApplyButton) {
@@ -336,18 +345,14 @@ var script$9 = {
         findNextItem(item) {
             let nextItem = item.nextElementSibling;
 
-            if (nextItem)
-                return DomHandler.hasClass(nextItem, 'p-column-filter-separator')  ? this.findNextItem(nextItem) : nextItem;
-            else
-                return item.parentElement.firstElementChild;
+            if (nextItem) return DomHandler.hasClass(nextItem, 'p-column-filter-separator') ? this.findNextItem(nextItem) : nextItem;
+            else return item.parentElement.firstElementChild;
         },
         findPrevItem(item) {
             let prevItem = item.previousElementSibling;
 
-            if (prevItem)
-                DomHandler.hasClass(prevItem, 'p-column-filter-separator')  ? this.findPrevItem(prevItem) : prevItem;
-            else
-                return item.parentElement.lastElementChild;
+            if (prevItem) DomHandler.hasClass(prevItem, 'p-column-filter-separator') ? this.findPrevItem(prevItem) : prevItem;
+            else return item.parentElement.lastElementChild;
         },
         hide() {
             this.overlayVisible = false;
@@ -367,6 +372,7 @@ var script$9 = {
             if (this.filterMenuStyle) {
                 DomHandler.applyStyle(this.overlay, this.filterMenuStyle);
             }
+
             ZIndexUtils.set('overlay', el, this.$primevue.config.zIndex.overlay);
             DomHandler.absolutePosition(this.overlay, this.$refs.icon);
             this.bindOutsideClickListener();
@@ -378,6 +384,7 @@ var script$9 = {
                     this.selfClick = true;
                 }
             };
+
             OverlayEventBus.on('overlay-click', this.overlayEventListener);
         },
         onOverlayLeave() {
@@ -409,8 +416,10 @@ var script$9 = {
                     if (this.overlayVisible && !this.selfClick && this.isOutsideClicked(event.target)) {
                         this.overlayVisible = false;
                     }
+
                     this.selfClick = false;
                 };
+
                 document.addEventListener('click', this.outsideClickListener);
             }
         },
@@ -444,6 +453,7 @@ var script$9 = {
                         this.hide();
                     }
                 };
+
                 window.addEventListener('resize', this.resizeListener);
             }
         },
@@ -456,35 +466,43 @@ var script$9 = {
     },
     computed: {
         containerClass() {
-            return ['p-column-filter p-fluid', {
-                'p-column-filter-row': this.display === 'row',
-                'p-column-filter-menu': this.display === 'menu'
-            }];
+            return [
+                'p-column-filter p-fluid',
+                {
+                    'p-column-filter-row': this.display === 'row',
+                    'p-column-filter-menu': this.display === 'menu'
+                }
+            ];
         },
         overlayClass() {
-            return [this.filterMenuClass, {
-                'p-column-filter-overlay p-component p-fluid': true,
-                'p-column-filter-overlay-menu': this.display === 'menu',
-                'p-input-filled': this.$primevue.config.inputStyle === 'filled',
-                'p-ripple-disabled': this.$primevue.config.ripple === false
-            }];
+            return [
+                this.filterMenuClass,
+                {
+                    'p-column-filter-overlay p-component p-fluid': true,
+                    'p-column-filter-overlay-menu': this.display === 'menu',
+                    'p-input-filled': this.$primevue.config.inputStyle === 'filled',
+                    'p-ripple-disabled': this.$primevue.config.ripple === false
+                }
+            ];
         },
         showMenuButton() {
-            return this.showMenu && (this.display === 'row' ? this.type !== 'boolean': true);
+            return this.showMenu && (this.display === 'row' ? this.type !== 'boolean' : true);
         },
         matchModes() {
-            return this.matchModeOptions ||
-                this.$primevue.config.filterMatchModeOptions[this.type].map(key => {
-                    return {label: this.$primevue.config.locale[key], value: key}
-                });
+            return (
+                this.matchModeOptions ||
+                this.$primevue.config.filterMatchModeOptions[this.type].map((key) => {
+                    return { label: this.$primevue.config.locale[key], value: key };
+                })
+            );
         },
         isShowMatchModes() {
             return this.type !== 'boolean' && this.showMatchModes && this.matchModes;
         },
         operatorOptions() {
             return [
-                {label: this.$primevue.config.locale.matchAll, value: FilterOperator.AND},
-                {label: this.$primevue.config.locale.matchAny, value: FilterOperator.OR}
+                { label: this.$primevue.config.locale.matchAll, value: FilterOperator.AND },
+                { label: this.$primevue.config.locale.matchAny, value: FilterOperator.OR }
             ];
         },
         noFilterLabel() {
@@ -509,7 +527,7 @@ var script$9 = {
             return this.$primevue.config.locale.addRule;
         },
         isShowAddConstraint() {
-            return this.showAddButton && this.filters[this.field].operator && (this.fieldConstraints && this.fieldConstraints.length < this.maxConstraints);
+            return this.showAddButton && this.filters[this.field].operator && this.fieldConstraints && this.fieldConstraints.length < this.maxConstraints;
         },
         clearButtonLabel() {
             return this.$primevue.config.locale.clear;
@@ -519,9 +537,9 @@ var script$9 = {
         }
     },
     components: {
-        'CFDropdown': Dropdown,
-        'CFButton': Button,
-        'Portal': Portal
+        CFDropdown: Dropdown,
+        CFButton: Button,
+        Portal: Portal
     }
 };
 
@@ -577,7 +595,7 @@ function render$9(_ctx, _cache, $props, $setup, $data, $options) {
           key: 1,
           ref: "icon",
           type: "button",
-          class: normalizeClass(["p-column-filter-menu-button p-link", {'p-column-filter-menu-button-open': $data.overlayVisible, 'p-column-filter-menu-button-active': $options.hasFilter()}]),
+          class: normalizeClass(["p-column-filter-menu-button p-link", { 'p-column-filter-menu-button-open': $data.overlayVisible, 'p-column-filter-menu-button-active': $options.hasFilter() }]),
           "aria-haspopup": "true",
           "aria-expanded": $data.overlayVisible,
           onClick: _cache[0] || (_cache[0] = $event => ($options.toggleMenu())),
@@ -587,7 +605,7 @@ function render$9(_ctx, _cache, $props, $setup, $data, $options) {
     ($props.showClearButton && $props.display === 'row')
       ? (openBlock(), createElementBlock("button", {
           key: 2,
-          class: normalizeClass([{'p-hidden-space': !$options.hasRowFilter()}, "p-column-filter-clear-button p-link"]),
+          class: normalizeClass([{ 'p-hidden-space': !$options.hasRowFilter() }, "p-column-filter-clear-button p-link"]),
           type: "button",
           onClick: _cache[2] || (_cache[2] = $event => ($options.clearFilter()))
         }, _hoisted_6$3, 2))
@@ -619,8 +637,8 @@ function render$9(_ctx, _cache, $props, $setup, $data, $options) {
                     ? (openBlock(), createElementBlock("ul", _hoisted_7$1, [
                         (openBlock(true), createElementBlock(Fragment, null, renderList($options.matchModes, (matchMode, i) => {
                           return (openBlock(), createElementBlock("li", {
-                            class: normalizeClass(["p-column-filter-row-item", {'p-highlight': $options.isRowMatchModeSelected(matchMode.value)}]),
                             key: matchMode.label,
+                            class: normalizeClass(["p-column-filter-row-item", { 'p-highlight': $options.isRowMatchModeSelected(matchMode.value) }]),
                             onClick: $event => ($options.onRowMatchModeChange(matchMode.value)),
                             onKeydown: [
                               _cache[3] || (_cache[3] = $event => ($options.onRowMatchModeKeyDown($event))),
@@ -758,9 +776,24 @@ script$9.render = render$9;
 
 var script$8 = {
     name: 'HeaderCell',
-    emits: ['column-click', 'column-mousedown', 'column-dragstart', 'column-dragover', 'column-dragleave', 'column-drop',
-            'column-resizestart', 'checkbox-change', 'filter-change', 'filter-apply',
-            'operator-change', 'matchmode-change', 'constraint-add', 'constraint-remove', 'filter-clear', 'apply-click'],
+    emits: [
+        'column-click',
+        'column-mousedown',
+        'column-dragstart',
+        'column-dragover',
+        'column-dragleave',
+        'column-drop',
+        'column-resizestart',
+        'checkbox-change',
+        'filter-change',
+        'filter-apply',
+        'operator-change',
+        'matchmode-change',
+        'constraint-add',
+        'constraint-remove',
+        'filter-clear',
+        'apply-click'
+    ],
     props: {
         column: {
             type: Object,
@@ -771,7 +804,7 @@ var script$8 = {
             default: false
         },
         groupRowsBy: {
-            type: [Array,String],
+            type: [Array, String],
             default: null
         },
         sortMode: {
@@ -826,7 +859,7 @@ var script$8 = {
     data() {
         return {
             styleObject: {}
-        }
+        };
     },
     mounted() {
         if (this.columnProp('frozen')) {
@@ -843,15 +876,15 @@ var script$8 = {
             return ObjectUtils.getVNodeProp(this.column, prop);
         },
         onClick(event) {
-            this.$emit('column-click', {originalEvent: event, column: this.column});
+            this.$emit('column-click', { originalEvent: event, column: this.column });
         },
         onKeyDown(event) {
             if (event.which === 13 && event.currentTarget.nodeName === 'TH' && DomHandler.hasClass(event.currentTarget, 'p-sortable-column')) {
-                this.$emit('column-click', {originalEvent: event, column: this.column});
+                this.$emit('column-click', { originalEvent: event, column: this.column });
             }
         },
         onMouseDown(event) {
-            this.$emit('column-mousedown', {originalEvent: event, column: this.column});
+            this.$emit('column-mousedown', { originalEvent: event, column: this.column });
         },
         onDragStart(event) {
             this.$emit('column-dragstart', event);
@@ -869,42 +902,48 @@ var script$8 = {
             this.$emit('column-resizestart', event);
         },
         getMultiSortMetaIndex() {
-            return this.multiSortMeta.findIndex(meta => (meta.field === this.columnProp('field') || meta.field === this.columnProp('sortField')));
+            return this.multiSortMeta.findIndex((meta) => meta.field === this.columnProp('field') || meta.field === this.columnProp('sortField'));
         },
         getBadgeValue() {
             let index = this.getMultiSortMetaIndex();
 
-            return (this.groupRowsBy && this.groupRowsBy === this.groupRowSortField) && index > -1 ? index : index + 1;
+            return this.groupRowsBy && this.groupRowsBy === this.groupRowSortField && index > -1 ? index : index + 1;
         },
         isMultiSorted() {
-            return this.sortMode === 'multiple' && this.columnProp('sortable') && this.getMultiSortMetaIndex() > -1
+            return this.sortMode === 'multiple' && this.columnProp('sortable') && this.getMultiSortMetaIndex() > -1;
         },
         isColumnSorted() {
-            return this.sortMode === 'single' ? (this.sortField && (this.sortField === this.columnProp('field') || this.sortField === this.columnProp('sortField'))) : this.isMultiSorted();
+            return this.sortMode === 'single' ? this.sortField && (this.sortField === this.columnProp('field') || this.sortField === this.columnProp('sortField')) : this.isMultiSorted();
         },
         updateStickyPosition() {
             if (this.columnProp('frozen')) {
                 let align = this.columnProp('alignFrozen');
+
                 if (align === 'right') {
                     let right = 0;
                     let next = this.$el.nextElementSibling;
+
                     if (next) {
                         right = DomHandler.getOuterWidth(next) + parseFloat(next.style.right || 0);
                     }
+
                     this.styleObject.right = right + 'px';
-                }
-                else {
+                } else {
                     let left = 0;
                     let prev = this.$el.previousElementSibling;
+
                     if (prev) {
                         left = DomHandler.getOuterWidth(prev) + parseFloat(prev.style.left || 0);
                     }
+
                     this.styleObject.left = left + 'px';
                 }
 
                 let filterRow = this.$el.parentElement.nextElementSibling;
+
                 if (filterRow) {
                     let index = DomHandler.index(this.$el);
+
                     filterRow.children[index].style.left = this.styleObject.left;
                     filterRow.children[index].style.right = this.styleObject.right;
                 }
@@ -916,20 +955,24 @@ var script$8 = {
     },
     computed: {
         containerClass() {
-            return [this.filterColumn ? this.columnProp('filterHeaderClass') : this.columnProp('headerClass'), this.columnProp('class'), {
+            return [
+                this.filterColumn ? this.columnProp('filterHeaderClass') : this.columnProp('headerClass'),
+                this.columnProp('class'),
+                {
                     'p-sortable-column': this.columnProp('sortable'),
                     'p-resizable-column': this.resizableColumns,
                     'p-highlight': this.isColumnSorted(),
                     'p-filter-column': this.filterColumn,
                     'p-frozen-column': this.columnProp('frozen'),
                     'p-reorderable-column': this.reorderableColumns
-            }];
+                }
+            ];
         },
         containerStyle() {
-            let headerStyle = this.filterColumn ? this.columnProp('filterHeaderStyle'): this.columnProp('headerStyle');
+            let headerStyle = this.filterColumn ? this.columnProp('filterHeaderStyle') : this.columnProp('headerStyle');
             let columnStyle = this.columnProp('style');
 
-            return this.columnProp('frozen') ? [columnStyle, headerStyle, this.styleObject]: [columnStyle, headerStyle];
+            return this.columnProp('frozen') ? [columnStyle, headerStyle, this.styleObject] : [columnStyle, headerStyle];
         },
         sortableColumnIcon() {
             let sorted = false;
@@ -937,10 +980,10 @@ var script$8 = {
 
             if (this.sortMode === 'single') {
                 sorted = this.sortField && (this.sortField === this.columnProp('field') || this.sortField === this.columnProp('sortField'));
-                sortOrder = sorted ? this.sortOrder: 0;
-            }
-            else if (this.sortMode === 'multiple') {
+                sortOrder = sorted ? this.sortOrder : 0;
+            } else if (this.sortMode === 'multiple') {
                 let metaIndex = this.getMultiSortMetaIndex();
+
                 if (metaIndex > -1) {
                     sorted = true;
                     sortOrder = this.multiSortMeta[metaIndex].order;
@@ -948,7 +991,8 @@ var script$8 = {
             }
 
             return [
-                'p-sortable-column-icon pi pi-fw', {
+                'p-sortable-column-icon pi pi-fw',
+                {
                     'pi-sort-alt': !sorted,
                     'pi-sort-amount-up-alt': sorted && sortOrder > 0,
                     'pi-sort-amount-down': sorted && sortOrder < 0
@@ -958,21 +1002,18 @@ var script$8 = {
         ariaSort() {
             if (this.columnProp('sortable')) {
                 const sortIcon = this.sortableColumnIcon;
-                if (sortIcon[1]['pi-sort-amount-down'])
-                    return 'descending';
-                else if (sortIcon[1]['pi-sort-amount-up-alt'])
-                    return 'ascending';
-                else
-                    return 'none';
-            }
-            else {
+
+                if (sortIcon[1]['pi-sort-amount-down']) return 'descending';
+                else if (sortIcon[1]['pi-sort-amount-up-alt']) return 'ascending';
+                else return 'none';
+            } else {
                 return null;
             }
         }
     },
     components: {
-        'DTHeaderCheckbox': script$a,
-        'DTColumnFilter': script$9
+        DTHeaderCheckbox: script$a,
+        DTColumnFilter: script$9
     }
 };
 
@@ -1033,7 +1074,7 @@ function render$8(_ctx, _cache, $props, $setup, $data, $options) {
       ($options.isMultiSorted())
         ? (openBlock(), createElementBlock("span", _hoisted_4$3, toDisplayString($options.getBadgeValue()), 1))
         : createCommentVNode("", true),
-      ($options.columnProp('selectionMode') ==='multiple' && $props.filterDisplay !== 'row')
+      ($options.columnProp('selectionMode') === 'multiple' && $props.filterDisplay !== 'row')
         ? (openBlock(), createBlock(_component_DTHeaderCheckbox, {
             key: 4,
             checked: $props.allRowsSelected,
@@ -1044,7 +1085,7 @@ function render$8(_ctx, _cache, $props, $setup, $data, $options) {
       ($props.filterDisplay === 'menu' && $props.column.children && $props.column.children.filter)
         ? (openBlock(), createBlock(_component_DTColumnFilter, {
             key: 5,
-            field: $options.columnProp('filterField')||$options.columnProp('field'),
+            field: $options.columnProp('filterField') || $options.columnProp('field'),
             type: $options.columnProp('dataType'),
             display: "menu",
             showMenu: $options.columnProp('showFilterMenu'),
@@ -1066,11 +1107,11 @@ function render$8(_ctx, _cache, $props, $setup, $data, $options) {
             showAddButton: $options.columnProp('showAddButton'),
             matchModeOptions: $options.columnProp('filterMatchModeOptions'),
             maxConstraints: $options.columnProp('maxConstraints'),
-            onOperatorChange: _cache[3] || (_cache[3] = $event => (_ctx.$emit('operator-change',$event))),
+            onOperatorChange: _cache[3] || (_cache[3] = $event => (_ctx.$emit('operator-change', $event))),
             onMatchmodeChange: _cache[4] || (_cache[4] = $event => (_ctx.$emit('matchmode-change', $event))),
             onConstraintAdd: _cache[5] || (_cache[5] = $event => (_ctx.$emit('constraint-add', $event))),
             onConstraintRemove: _cache[6] || (_cache[6] = $event => (_ctx.$emit('constraint-remove', $event))),
-            onApplyClick: _cache[7] || (_cache[7] = $event => (_ctx.$emit('apply-click',$event)))
+            onApplyClick: _cache[7] || (_cache[7] = $event => (_ctx.$emit('apply-click', $event)))
           }, null, 8, ["field", "type", "showMenu", "filterElement", "filterHeaderTemplate", "filterFooterTemplate", "filterClearTemplate", "filterApplyTemplate", "filters", "filtersStore", "filterMenuStyle", "filterMenuClass", "showOperator", "showClearButton", "showApplyButton", "showMatchModes", "showAddButton", "matchModeOptions", "maxConstraints"]))
         : createCommentVNode("", true)
     ])
@@ -1081,11 +1122,26 @@ script$8.render = render$8;
 
 var script$7 = {
     name: 'TableHeader',
-    emits: ['column-click', 'column-mousedown', 'column-dragstart', 'column-dragover', 'column-dragleave', 'column-drop',
-            'column-resizestart', 'checkbox-change', 'filter-change', 'filter-apply',
-            'operator-change', 'matchmode-change', 'constraint-add', 'constraint-remove', 'filter-clear', 'apply-click'],
+    emits: [
+        'column-click',
+        'column-mousedown',
+        'column-dragstart',
+        'column-dragover',
+        'column-dragleave',
+        'column-drop',
+        'column-resizestart',
+        'checkbox-change',
+        'filter-change',
+        'filter-apply',
+        'operator-change',
+        'matchmode-change',
+        'constraint-add',
+        'constraint-remove',
+        'filter-clear',
+        'apply-click'
+    ],
     props: {
-		columnGroup: {
+        columnGroup: {
             type: null,
             default: null
         },
@@ -1098,7 +1154,7 @@ var script$7 = {
             default: null
         },
         groupRowsBy: {
-            type: [Array,String],
+            type: [Array, String],
             default: null
         },
         resizableColumns: {
@@ -1155,9 +1211,14 @@ var script$7 = {
             return ObjectUtils.getVNodeProp(col, prop);
         },
         getFilterColumnHeaderClass(column) {
-            return ['p-filter-column', this.columnProp(column, 'filterHeaderClass'), this.columnProp(column, 'class'), {
-                'p-frozen-column': this.columnProp(column, 'frozen')
-            }];
+            return [
+                'p-filter-column',
+                this.columnProp(column, 'filterHeaderClass'),
+                this.columnProp(column, 'class'),
+                {
+                    'p-frozen-column': this.columnProp(column, 'frozen')
+                }
+            ];
         },
         getFilterColumnHeaderStyle(column) {
             return [this.columnProp(column, 'filterHeaderStyle'), this.columnProp(column, 'style')];
@@ -1166,12 +1227,12 @@ var script$7 = {
             let rows = [];
 
             let columnGroup = this.columnGroup;
+
             if (columnGroup.children && columnGroup.children.default) {
                 for (let child of columnGroup.children.default()) {
                     if (child.type.name === 'Row') {
                         rows.push(child);
-                    }
-                    else if (child.children && child.children instanceof Array) {
+                    } else if (child.children && child.children instanceof Array) {
                         rows = child.children;
                     }
                 }
@@ -1179,15 +1240,13 @@ var script$7 = {
                 return rows;
             }
         },
-        getHeaderColumns(row){
+        getHeaderColumns(row) {
             let cols = [];
 
             if (row.children && row.children.default) {
-                row.children.default().forEach(child => {
-                    if (child.children && child.children instanceof Array)
-                        cols = [...cols, ...child.children];
-                    else if (child.type.name === 'Column')
-                        cols.push(child);
+                row.children.default().forEach((child) => {
+                    if (child.children && child.children instanceof Array) cols = [...cols, ...child.children];
+                    else if (child.type.name === 'Column') cols.push(child);
                 });
 
                 return cols;
@@ -1195,9 +1254,9 @@ var script$7 = {
         }
     },
     components: {
-        'DTHeaderCell': script$8,
-        'DTHeaderCheckbox': script$a,
-        'DTColumnFilter': script$9
+        DTHeaderCell: script$8,
+        DTHeaderCheckbox: script$a,
+        DTColumnFilter: script$9
     }
 };
 
@@ -1222,9 +1281,9 @@ function render$7(_ctx, _cache, $props, $setup, $data, $options) {
           createElementVNode("tr", _hoisted_2$5, [
             (openBlock(true), createElementBlock(Fragment, null, renderList($props.columns, (col, i) => {
               return (openBlock(), createElementBlock(Fragment, {
-                key: $options.columnProp(col, 'columnKey')||$options.columnProp(col, 'field')||i
+                key: $options.columnProp(col, 'columnKey') || $options.columnProp(col, 'field') || i
               }, [
-                (!$options.columnProp(col, 'hidden') && ($props.rowGroupMode !== 'subheader' || ($props.groupRowsBy !== $options.columnProp(col, 'field'))))
+                (!$options.columnProp(col, 'hidden') && ($props.rowGroupMode !== 'subheader' || $props.groupRowsBy !== $options.columnProp(col, 'field')))
                   ? (openBlock(), createBlock(_component_DTHeaderCell, {
                       key: 0,
                       column: col,
@@ -1251,11 +1310,11 @@ function render$7(_ctx, _cache, $props, $setup, $data, $options) {
                       filtersStore: $props.filtersStore,
                       onFilterChange: _cache[8] || (_cache[8] = $event => (_ctx.$emit('filter-change', $event))),
                       onFilterApply: _cache[9] || (_cache[9] = $event => (_ctx.$emit('filter-apply'))),
-                      onOperatorChange: _cache[10] || (_cache[10] = $event => (_ctx.$emit('operator-change',$event))),
+                      onOperatorChange: _cache[10] || (_cache[10] = $event => (_ctx.$emit('operator-change', $event))),
                       onMatchmodeChange: _cache[11] || (_cache[11] = $event => (_ctx.$emit('matchmode-change', $event))),
                       onConstraintAdd: _cache[12] || (_cache[12] = $event => (_ctx.$emit('constraint-add', $event))),
                       onConstraintRemove: _cache[13] || (_cache[13] = $event => (_ctx.$emit('constraint-remove', $event))),
-                      onApplyClick: _cache[14] || (_cache[14] = $event => (_ctx.$emit('apply-click',$event)))
+                      onApplyClick: _cache[14] || (_cache[14] = $event => (_ctx.$emit('apply-click', $event)))
                     }, null, 8, ["column", "groupRowsBy", "groupRowSortField", "reorderableColumns", "resizableColumns", "sortMode", "sortField", "sortOrder", "multiSortMeta", "allRowsSelected", "empty", "filters", "filterDisplay", "filtersStore"]))
                   : createCommentVNode("", true)
               ], 64))
@@ -1265,15 +1324,15 @@ function render$7(_ctx, _cache, $props, $setup, $data, $options) {
             ? (openBlock(), createElementBlock("tr", _hoisted_3$4, [
                 (openBlock(true), createElementBlock(Fragment, null, renderList($props.columns, (col, i) => {
                   return (openBlock(), createElementBlock(Fragment, {
-                    key: $options.columnProp(col, 'columnKey')||$options.columnProp(col, 'field')||i
+                    key: $options.columnProp(col, 'columnKey') || $options.columnProp(col, 'field') || i
                   }, [
-                    (!$options.columnProp(col, 'hidden') && ($props.rowGroupMode !== 'subheader' || ($props.groupRowsBy !== $options.columnProp(col, 'field'))))
+                    (!$options.columnProp(col, 'hidden') && ($props.rowGroupMode !== 'subheader' || $props.groupRowsBy !== $options.columnProp(col, 'field')))
                       ? (openBlock(), createElementBlock("th", {
                           key: 0,
                           style: normalizeStyle($options.getFilterColumnHeaderStyle(col)),
                           class: normalizeClass($options.getFilterColumnHeaderClass(col))
                         }, [
-                          ($options.columnProp(col, 'selectionMode') ==='multiple')
+                          ($options.columnProp(col, 'selectionMode') === 'multiple')
                             ? (openBlock(), createBlock(_component_DTHeaderCheckbox, {
                                 key: 0,
                                 checked: $props.allRowsSelected,
@@ -1284,10 +1343,10 @@ function render$7(_ctx, _cache, $props, $setup, $data, $options) {
                           (col.children && col.children.filter)
                             ? (openBlock(), createBlock(_component_DTColumnFilter, {
                                 key: 1,
-                                field: $options.columnProp(col,'filterField')||$options.columnProp(col,'field'),
-                                type: $options.columnProp(col,'dataType'),
+                                field: $options.columnProp(col, 'filterField') || $options.columnProp(col, 'field'),
+                                type: $options.columnProp(col, 'dataType'),
                                 display: "row",
-                                showMenu: $options.columnProp(col,'showFilterMenu'),
+                                showMenu: $options.columnProp(col, 'showFilterMenu'),
                                 filterElement: col.children && col.children.filter,
                                 filterHeaderTemplate: col.children && col.children.filterheader,
                                 filterFooterTemplate: col.children && col.children.filterfooter,
@@ -1297,20 +1356,20 @@ function render$7(_ctx, _cache, $props, $setup, $data, $options) {
                                 filtersStore: $props.filtersStore,
                                 onFilterChange: _cache[16] || (_cache[16] = $event => (_ctx.$emit('filter-change', $event))),
                                 onFilterApply: _cache[17] || (_cache[17] = $event => (_ctx.$emit('filter-apply'))),
-                                filterMenuStyle: $options.columnProp(col,'filterMenuStyle'),
-                                filterMenuClass: $options.columnProp(col,'filterMenuClass'),
-                                showOperator: $options.columnProp(col,'showFilterOperator'),
-                                showClearButton: $options.columnProp(col,'showClearButton'),
-                                showApplyButton: $options.columnProp(col,'showApplyButton'),
-                                showMatchModes: $options.columnProp(col,'showFilterMatchModes'),
-                                showAddButton: $options.columnProp(col,'showAddButton'),
-                                matchModeOptions: $options.columnProp(col,'filterMatchModeOptions'),
-                                maxConstraints: $options.columnProp(col,'maxConstraints'),
-                                onOperatorChange: _cache[18] || (_cache[18] = $event => (_ctx.$emit('operator-change',$event))),
+                                filterMenuStyle: $options.columnProp(col, 'filterMenuStyle'),
+                                filterMenuClass: $options.columnProp(col, 'filterMenuClass'),
+                                showOperator: $options.columnProp(col, 'showFilterOperator'),
+                                showClearButton: $options.columnProp(col, 'showClearButton'),
+                                showApplyButton: $options.columnProp(col, 'showApplyButton'),
+                                showMatchModes: $options.columnProp(col, 'showFilterMatchModes'),
+                                showAddButton: $options.columnProp(col, 'showAddButton'),
+                                matchModeOptions: $options.columnProp(col, 'filterMatchModeOptions'),
+                                maxConstraints: $options.columnProp(col, 'maxConstraints'),
+                                onOperatorChange: _cache[18] || (_cache[18] = $event => (_ctx.$emit('operator-change', $event))),
                                 onMatchmodeChange: _cache[19] || (_cache[19] = $event => (_ctx.$emit('matchmode-change', $event))),
                                 onConstraintAdd: _cache[20] || (_cache[20] = $event => (_ctx.$emit('constraint-add', $event))),
                                 onConstraintRemove: _cache[21] || (_cache[21] = $event => (_ctx.$emit('constraint-remove', $event))),
-                                onApplyClick: _cache[22] || (_cache[22] = $event => (_ctx.$emit('apply-click',$event)))
+                                onApplyClick: _cache[22] || (_cache[22] = $event => (_ctx.$emit('apply-click', $event)))
                               }, null, 8, ["field", "type", "showMenu", "filterElement", "filterHeaderTemplate", "filterFooterTemplate", "filterClearTemplate", "filterApplyTemplate", "filters", "filtersStore", "filterMenuStyle", "filterMenuClass", "showOperator", "showClearButton", "showApplyButton", "showMatchModes", "showAddButton", "matchModeOptions", "maxConstraints"]))
                             : createCommentVNode("", true)
                         ], 6))
@@ -1327,9 +1386,9 @@ function render$7(_ctx, _cache, $props, $setup, $data, $options) {
           }, [
             (openBlock(true), createElementBlock(Fragment, null, renderList($options.getHeaderColumns(row), (col, j) => {
               return (openBlock(), createElementBlock(Fragment, {
-                key: $options.columnProp(col, 'columnKey')||$options.columnProp(col, 'field')||j
+                key: $options.columnProp(col, 'columnKey') || $options.columnProp(col, 'field') || j
               }, [
-                (!$options.columnProp(col, 'hidden') && ($props.rowGroupMode !== 'subheader' || ($props.groupRowsBy !== $options.columnProp(col, 'field'))) && (typeof col.children !== 'string'))
+                (!$options.columnProp(col, 'hidden') && ($props.rowGroupMode !== 'subheader' || $props.groupRowsBy !== $options.columnProp(col, 'field')) && typeof col.children !== 'string')
                   ? (openBlock(), createBlock(_component_DTHeaderCell, {
                       key: 0,
                       column: col,
@@ -1349,11 +1408,11 @@ function render$7(_ctx, _cache, $props, $setup, $data, $options) {
                       filtersStore: $props.filtersStore,
                       onFilterChange: _cache[26] || (_cache[26] = $event => (_ctx.$emit('filter-change', $event))),
                       onFilterApply: _cache[27] || (_cache[27] = $event => (_ctx.$emit('filter-apply'))),
-                      onOperatorChange: _cache[28] || (_cache[28] = $event => (_ctx.$emit('operator-change',$event))),
+                      onOperatorChange: _cache[28] || (_cache[28] = $event => (_ctx.$emit('operator-change', $event))),
                       onMatchmodeChange: _cache[29] || (_cache[29] = $event => (_ctx.$emit('matchmode-change', $event))),
                       onConstraintAdd: _cache[30] || (_cache[30] = $event => (_ctx.$emit('constraint-add', $event))),
                       onConstraintRemove: _cache[31] || (_cache[31] = $event => (_ctx.$emit('constraint-remove', $event))),
-                      onApplyClick: _cache[32] || (_cache[32] = $event => (_ctx.$emit('apply-click',$event)))
+                      onApplyClick: _cache[32] || (_cache[32] = $event => (_ctx.$emit('apply-click', $event)))
                     }, null, 8, ["column", "groupRowsBy", "groupRowSortField", "sortMode", "sortField", "sortOrder", "multiSortMeta", "allRowsSelected", "empty", "filters", "filterDisplay", "filtersStore"]))
                   : createCommentVNode("", true)
               ], 64))
@@ -1370,7 +1429,7 @@ var script$6 = {
     inheritAttrs: false,
     emits: ['change'],
     props: {
-		value: null,
+        value: null,
         checked: null
     },
     data() {
@@ -1406,7 +1465,7 @@ const _hoisted_3$3 = [
 
 function render$6(_ctx, _cache, $props, $setup, $data, $options) {
   return (openBlock(), createElementBlock("div", {
-    class: normalizeClass(['p-radiobutton p-component', {'p-radiobutton-focused': $data.focused}]),
+    class: normalizeClass(['p-radiobutton p-component', { 'p-radiobutton-focused': $data.focused }]),
     onClick: _cache[0] || (_cache[0] = (...args) => ($options.onClick && $options.onClick(...args))),
     tabindex: "0",
     onFocus: _cache[1] || (_cache[1] = $event => ($options.onFocus($event))),
@@ -1415,7 +1474,7 @@ function render$6(_ctx, _cache, $props, $setup, $data, $options) {
   }, [
     createElementVNode("div", {
       ref: "box",
-      class: normalizeClass(['p-radiobutton-box p-component', {'p-highlight': $props.checked, 'p-disabled': _ctx.$attrs.disabled, 'p-focus': $data.focused}]),
+      class: normalizeClass(['p-radiobutton-box p-component', { 'p-highlight': $props.checked, 'p-disabled': _ctx.$attrs.disabled, 'p-focus': $data.focused }]),
       role: "radio",
       "aria-checked": $props.checked
     }, _hoisted_3$3, 10, _hoisted_1$6)
@@ -1429,7 +1488,7 @@ var script$5 = {
     inheritAttrs: false,
     emits: ['change'],
     props: {
-		value: null,
+        value: null,
         checked: null
     },
     data() {
@@ -1460,12 +1519,12 @@ const _hoisted_1$5 = ["aria-checked", "tabindex"];
 
 function render$5(_ctx, _cache, $props, $setup, $data, $options) {
   return (openBlock(), createElementBlock("div", {
-    class: normalizeClass(['p-checkbox p-component', {'p-checkbox-focused': $data.focused}]),
+    class: normalizeClass(['p-checkbox p-component', { 'p-checkbox-focused': $data.focused }]),
     onClick: _cache[3] || (_cache[3] = withModifiers((...args) => ($options.onClick && $options.onClick(...args)), ["stop","prevent"]))
   }, [
     createElementVNode("div", {
       ref: "box",
-      class: normalizeClass(['p-checkbox-box p-component', {'p-highlight': $props.checked, 'p-disabled': _ctx.$attrs.disabled, 'p-focus': $data.focused}]),
+      class: normalizeClass(['p-checkbox-box p-component', { 'p-highlight': $props.checked, 'p-disabled': _ctx.$attrs.disabled, 'p-focus': $data.focused }]),
       role: "checkbox",
       "aria-checked": $props.checked,
       tabindex: _ctx.$attrs.disabled ? null : '0',
@@ -1474,7 +1533,7 @@ function render$5(_ctx, _cache, $props, $setup, $data, $options) {
       onBlur: _cache[2] || (_cache[2] = $event => ($options.onBlur($event)))
     }, [
       createElementVNode("span", {
-        class: normalizeClass(['p-checkbox-icon', {'pi pi-check': $props.checked}])
+        class: normalizeClass(['p-checkbox-icon', { 'pi pi-check': $props.checked }])
       }, null, 2)
     ], 42, _hoisted_1$5)
   ], 2))
@@ -1484,8 +1543,7 @@ script$5.render = render$5;
 
 var script$4 = {
     name: 'BodyCell',
-    emits: ['cell-edit-init', 'cell-edit-complete', 'cell-edit-cancel', 'row-edit-init', 'row-edit-save', 'row-edit-cancel',
-            'row-toggle', 'radio-change', 'checkbox-change', 'editing-meta-change'],
+    emits: ['cell-edit-init', 'cell-edit-complete', 'cell-edit-cancel', 'row-edit-init', 'row-edit-save', 'row-edit-cancel', 'row-toggle', 'radio-change', 'checkbox-change', 'editing-meta-change'],
     props: {
         rowData: {
             type: Object,
@@ -1543,14 +1601,14 @@ var script$4 = {
         return {
             d_editing: this.editing,
             styleObject: {}
-        }
+        };
     },
     watch: {
         editing(newValue) {
             this.d_editing = newValue;
         },
-        '$data.d_editing': function(newValue) {
-            this.$emit('editing-meta-change', {data: this.rowData, field: (this.field || `field_${this.index}`), index: this.rowIndex, editing: newValue});
+        '$data.d_editing': function (newValue) {
+            this.$emit('editing-meta-change', { data: this.rowData, field: this.field || `field_${this.index}`, index: this.rowIndex, editing: newValue });
         }
     },
     mounted() {
@@ -1565,6 +1623,7 @@ var script$4 = {
 
         if (this.d_editing && (this.editMode === 'cell' || (this.editMode === 'row' && this.columnProp('rowEditor')))) {
             const focusableEl = DomHandler.getFirstFocusableElement(this.$el);
+
             focusableEl && focusableEl.focus();
         }
     },
@@ -1588,7 +1647,7 @@ var script$4 = {
             });
         },
         toggleRowWithRadio(event, index) {
-            this.$emit('radio-change', { originalEvent: event.originalEvent, index: index, data: event.data});
+            this.$emit('radio-change', { originalEvent: event.originalEvent, index: index, data: event.data });
         },
         toggleRowWithCheckbox(event, index) {
             this.$emit('checkbox-change', { originalEvent: event.originalEvent, index: index, data: event.data });
@@ -1602,6 +1661,7 @@ var script$4 = {
                     if (!this.selfClick) {
                         this.completeEdit(event, 'outside');
                     }
+
                     this.selfClick = false;
                 };
 
@@ -1628,13 +1688,14 @@ var script$4 = {
                 if (!this.d_editing) {
                     this.d_editing = true;
                     this.bindDocumentEditListener();
-                    this.$emit('cell-edit-init', {originalEvent: event, data: this.rowData, field: this.field, index: this.rowIndex});
+                    this.$emit('cell-edit-init', { originalEvent: event, data: this.rowData, field: this.field, index: this.rowIndex });
 
                     this.overlayEventListener = (e) => {
                         if (this.$el && this.$el.contains(e.target)) {
                             this.selfClick = true;
                         }
                     };
+
                     OverlayEventBus.on('overlay-click', this.overlayEventListener);
                 }
             }
@@ -1650,7 +1711,7 @@ var script$4 = {
                 index: this.rowIndex,
                 type: type,
                 defaultPrevented: false,
-                preventDefault: function() {
+                preventDefault: function () {
                     this.defaultPrevented = true;
                 }
             };
@@ -1666,21 +1727,19 @@ var script$4 = {
                 switch (event.which) {
                     case 13:
                         this.completeEdit(event, 'enter');
-                    break;
+                        break;
 
                     case 27:
                         this.switchCellToViewMode();
-                        this.$emit('cell-edit-cancel', {originalEvent: event, data: this.rowData, field: this.field, index: this.rowIndex});
-                    break;
+                        this.$emit('cell-edit-cancel', { originalEvent: event, data: this.rowData, field: this.field, index: this.rowIndex });
+                        break;
 
                     case 9:
                         this.completeEdit(event, 'tab');
 
-                        if (event.shiftKey)
-                            this.moveToPreviousCell(event);
-                        else
-                            this.moveToNextCell(event);
-                    break;
+                        if (event.shiftKey) this.moveToPreviousCell(event);
+                        else this.moveToNextCell(event);
+                        break;
                 }
             }
         },
@@ -1705,13 +1764,13 @@ var script$4 = {
         findCell(element) {
             if (element) {
                 let cell = element;
+
                 while (cell && !DomHandler.hasClass(cell, 'p-cell-editing')) {
                     cell = cell.parentElement;
                 }
 
                 return cell;
-            }
-            else {
+            } else {
                 return null;
             }
         },
@@ -1720,18 +1779,16 @@ var script$4 = {
 
             if (!prevCell) {
                 let previousRow = cell.parentElement.previousElementSibling;
+
                 if (previousRow) {
                     prevCell = previousRow.lastElementChild;
                 }
             }
 
             if (prevCell) {
-                if (DomHandler.hasClass(prevCell, 'p-editable-column'))
-                    return prevCell;
-                else
-                    return this.findPreviousEditableColumn(prevCell);
-            }
-            else {
+                if (DomHandler.hasClass(prevCell, 'p-editable-column')) return prevCell;
+                else return this.findPreviousEditableColumn(prevCell);
+            } else {
                 return null;
             }
         },
@@ -1740,68 +1797,70 @@ var script$4 = {
 
             if (!nextCell) {
                 let nextRow = cell.parentElement.nextElementSibling;
+
                 if (nextRow) {
                     nextCell = nextRow.firstElementChild;
                 }
             }
 
             if (nextCell) {
-                if (DomHandler.hasClass(nextCell, 'p-editable-column'))
-                    return nextCell;
-                else
-                    return this.findNextEditableColumn(nextCell);
-            }
-            else {
+                if (DomHandler.hasClass(nextCell, 'p-editable-column')) return nextCell;
+                else return this.findNextEditableColumn(nextCell);
+            } else {
                 return null;
             }
         },
         isEditingCellValid() {
-            return (DomHandler.find(this.$el, '.p-invalid').length === 0);
+            return DomHandler.find(this.$el, '.p-invalid').length === 0;
         },
         onRowEditInit(event) {
-            this.$emit('row-edit-init', {originalEvent: event, data: this.rowData, newData: this.editingRowData, field: this.field, index: this.rowIndex});
+            this.$emit('row-edit-init', { originalEvent: event, data: this.rowData, newData: this.editingRowData, field: this.field, index: this.rowIndex });
         },
         onRowEditSave(event) {
-            this.$emit('row-edit-save', {originalEvent: event, data: this.rowData, newData: this.editingRowData, field: this.field, index: this.rowIndex});
+            this.$emit('row-edit-save', { originalEvent: event, data: this.rowData, newData: this.editingRowData, field: this.field, index: this.rowIndex });
         },
         onRowEditCancel(event) {
-            this.$emit('row-edit-cancel', {originalEvent: event, data: this.rowData, newData: this.editingRowData, field: this.field, index: this.rowIndex});
+            this.$emit('row-edit-cancel', { originalEvent: event, data: this.rowData, newData: this.editingRowData, field: this.field, index: this.rowIndex });
         },
         editorInitCallback(event) {
-            this.$emit('row-edit-init', {originalEvent: event, data: this.rowData, newData: this.editingRowData, field: this.field, index: this.rowIndex});
+            this.$emit('row-edit-init', { originalEvent: event, data: this.rowData, newData: this.editingRowData, field: this.field, index: this.rowIndex });
         },
         editorSaveCallback(event) {
             if (this.editMode === 'row') {
-                this.$emit('row-edit-save', {originalEvent: event, data: this.rowData, newData: this.editingRowData, field: this.field, index: this.rowIndex});
+                this.$emit('row-edit-save', { originalEvent: event, data: this.rowData, newData: this.editingRowData, field: this.field, index: this.rowIndex });
             } else {
                 this.completeEdit(event, 'enter');
             }
         },
         editorCancelCallback(event) {
             if (this.editMode === 'row') {
-                this.$emit('row-edit-cancel', {originalEvent: event, data: this.rowData, newData: this.editingRowData, field: this.field, index: this.rowIndex});
+                this.$emit('row-edit-cancel', { originalEvent: event, data: this.rowData, newData: this.editingRowData, field: this.field, index: this.rowIndex });
             } else {
                 this.switchCellToViewMode();
-                this.$emit('cell-edit-cancel', {originalEvent: event, data: this.rowData, field: this.field, index: this.rowIndex});
+                this.$emit('cell-edit-cancel', { originalEvent: event, data: this.rowData, field: this.field, index: this.rowIndex });
             }
         },
         updateStickyPosition() {
             if (this.columnProp('frozen')) {
                 let align = this.columnProp('alignFrozen');
+
                 if (align === 'right') {
                     let right = 0;
                     let next = this.$el.nextElementSibling;
+
                     if (next) {
                         right = DomHandler.getOuterWidth(next) + parseFloat(next.style.right || 0);
                     }
+
                     this.styleObject.right = right + 'px';
-                }
-                else {
+                } else {
                     let left = 0;
                     let prev = this.$el.previousElementSibling;
+
                     if (prev) {
                         left = DomHandler.getOuterWidth(prev) + parseFloat(prev.style.left || 0);
                     }
+
                     this.styleObject.left = left + 'px';
                 }
             }
@@ -1818,41 +1877,49 @@ var script$4 = {
             return this.columnProp('field');
         },
         containerClass() {
-            return [this.columnProp('bodyClass'), this.columnProp('class'), {
-                'p-selection-column': this.columnProp('selectionMode') != null,
-                'p-editable-column': this.isEditable(),
-                'p-cell-editing': this.d_editing,
-                'p-frozen-column': this.columnProp('frozen')
-            }];
+            return [
+                this.columnProp('bodyClass'),
+                this.columnProp('class'),
+                {
+                    'p-selection-column': this.columnProp('selectionMode') != null,
+                    'p-editable-column': this.isEditable(),
+                    'p-cell-editing': this.d_editing,
+                    'p-frozen-column': this.columnProp('frozen')
+                }
+            ];
         },
         containerStyle() {
             let bodyStyle = this.columnProp('bodyStyle');
             let columnStyle = this.columnProp('style');
 
-            return this.columnProp('frozen') ? [columnStyle, bodyStyle, this.styleObject]: [columnStyle, bodyStyle];
+            return this.columnProp('frozen') ? [columnStyle, bodyStyle, this.styleObject] : [columnStyle, bodyStyle];
         },
         loading() {
             return this.getVirtualScrollerProp('loading');
         },
         loadingOptions() {
             const getLoaderOptions = this.getVirtualScrollerProp('getLoaderOptions');
-            return getLoaderOptions && getLoaderOptions(this.rowIndex, {
-                cellIndex: this.index,
-                cellFirst: this.index === 0,
-                cellLast: this.index === (this.getVirtualScrollerProp('columns').length - 1),
-                cellEven: this.index % 2 === 0,
-                cellOdd: this.index % 2 !== 0,
-                column: this.column,
-                field: this.field
-            });
+
+            return (
+                getLoaderOptions &&
+                getLoaderOptions(this.rowIndex, {
+                    cellIndex: this.index,
+                    cellFirst: this.index === 0,
+                    cellLast: this.index === this.getVirtualScrollerProp('columns').length - 1,
+                    cellEven: this.index % 2 === 0,
+                    cellOdd: this.index % 2 !== 0,
+                    column: this.column,
+                    field: this.field
+                })
+            );
         }
     },
     components: {
-        'DTRadioButton': script$6,
-        'DTCheckbox': script$5
+        DTRadioButton: script$6,
+        DTCheckbox: script$5
     },
     directives: {
-        'ripple': Ripple
+        ripple: Ripple
     }
 };
 
@@ -1943,7 +2010,7 @@ function render$4(_ctx, _cache, $props, $setup, $data, $options) {
                           checked: $props.selected,
                           onChange: _cache[0] || (_cache[0] = $event => ($options.toggleRowWithRadio($event, $props.rowIndex)))
                         }, null, 8, ["value", "checked"]))
-                      : ($options.columnProp('selectionMode') ==='multiple')
+                      : ($options.columnProp('selectionMode') === 'multiple')
                         ? (openBlock(), createBlock(_component_DTCheckbox, {
                             key: 1,
                             value: $props.rowData,
@@ -1955,7 +2022,7 @@ function render$4(_ctx, _cache, $props, $setup, $data, $options) {
                 : ($options.columnProp('rowReorder'))
                   ? (openBlock(), createElementBlock("i", {
                       key: 5,
-                      class: normalizeClass(['p-datatable-reorderablerow-handle', ($options.columnProp('rowReorderIcon') || 'pi pi-bars')])
+                      class: normalizeClass(['p-datatable-reorderablerow-handle', $options.columnProp('rowReorderIcon') || 'pi pi-bars'])
                     }, null, 2))
                   : ($options.columnProp('expander'))
                     ? withDirectives((openBlock(), createElementBlock("button", {
@@ -2013,10 +2080,30 @@ script$4.render = render$4;
 
 var script$3 = {
     name: 'TableBody',
-    emits: ['rowgroup-toggle', 'row-click', 'row-dblclick', 'row-rightclick', 'row-touchend', 'row-keydown', 'row-mousedown',
-        'row-dragstart', 'row-dragover', 'row-dragleave', 'row-dragend', 'row-drop', 'row-toggle',
-        'radio-change', 'checkbox-change', 'cell-edit-init', 'cell-edit-complete', 'cell-edit-cancel',
-        'row-edit-init', 'row-edit-save', 'row-edit-cancel', 'editing-meta-change'],
+    emits: [
+        'rowgroup-toggle',
+        'row-click',
+        'row-dblclick',
+        'row-rightclick',
+        'row-touchend',
+        'row-keydown',
+        'row-mousedown',
+        'row-dragstart',
+        'row-dragover',
+        'row-dragleave',
+        'row-dragend',
+        'row-drop',
+        'row-toggle',
+        'radio-change',
+        'checkbox-change',
+        'cell-edit-init',
+        'cell-edit-complete',
+        'cell-edit-cancel',
+        'row-edit-init',
+        'row-edit-save',
+        'row-edit-cancel',
+        'editing-meta-change'
+    ],
     props: {
         value: {
             type: Array,
@@ -2039,7 +2126,7 @@ var script$3 = {
             default: null
         },
         groupRowsBy: {
-            type: [Array,String],
+            type: [Array, String],
             default: null
         },
         expandableRowGroups: {
@@ -2071,7 +2158,7 @@ var script$3 = {
             default: null
         },
         selection: {
-            type: [Array,Object],
+            type: [Array, Object],
             default: null
         },
         selectionKeys: {
@@ -2139,6 +2226,11 @@ var script$3 = {
             default: false
         }
     },
+    data() {
+        return {
+            rowGroupHeaderStyleObject: {}
+        };
+    },
     watch: {
         virtualScrollerContentProps(newValue, oldValue) {
             if (!this.isVirtualScrollerDisabled && this.getVirtualScrollerProp('vertical') && this.getVirtualScrollerProp('itemSize', oldValue) !== this.getVirtualScrollerProp('itemSize', newValue)) {
@@ -2168,11 +2260,6 @@ var script$3 = {
             this.updateFrozenRowGroupHeaderStickyPosition();
         }
     },
-    data() {
-        return {
-            rowGroupHeaderStyleObject: {}
-        }
-    },
     methods: {
         columnProp(col, prop) {
             return ObjectUtils.getVNodeProp(col, prop);
@@ -2180,25 +2267,28 @@ var script$3 = {
         shouldRenderRowGroupHeader(value, rowData, i) {
             let currentRowFieldData = ObjectUtils.resolveFieldData(rowData, this.groupRowsBy);
             let prevRowData = value[i - 1];
+
             if (prevRowData) {
                 let previousRowFieldData = ObjectUtils.resolveFieldData(prevRowData, this.groupRowsBy);
+
                 return currentRowFieldData !== previousRowFieldData;
-            }
-            else {
+            } else {
                 return true;
             }
         },
         getRowKey(rowData, index) {
-            return this.dataKey ? ObjectUtils.resolveFieldData(rowData, this.dataKey): index;
+            return this.dataKey ? ObjectUtils.resolveFieldData(rowData, this.dataKey) : index;
         },
         getRowIndex(index) {
             const getItemOptions = this.getVirtualScrollerProp('getItemOptions');
+
             return getItemOptions ? getItemOptions(index).index : index;
         },
         getRowClass(rowData) {
             let rowStyleClass = [];
+
             if (this.selectionMode) {
-                 rowStyleClass.push('p-selectable-row');
+                rowStyleClass.push('p-selectable-row');
             }
 
             if (this.selection) {
@@ -2226,15 +2316,15 @@ var script$3 = {
         shouldRenderRowGroupFooter(value, rowData, i) {
             if (this.expandableRowGroups && !this.isRowGroupExpanded(rowData)) {
                 return false;
-            }
-            else {
+            } else {
                 let currentRowFieldData = ObjectUtils.resolveFieldData(rowData, this.groupRowsBy);
                 let nextRowData = value[i + 1];
+
                 if (nextRowData) {
                     let nextRowFieldData = ObjectUtils.resolveFieldData(nextRowData, this.groupRowsBy);
+
                     return currentRowFieldData !== nextRowFieldData;
-                }
-                else {
+                } else {
                     return true;
                 }
             }
@@ -2243,25 +2333,23 @@ var script$3 = {
             if (this.rowGroupMode) {
                 if (this.rowGroupMode === 'subheader') {
                     return this.groupRowsBy !== this.columnProp(column, 'field');
-                }
-                else if (this.rowGroupMode === 'rowspan') {
+                } else if (this.rowGroupMode === 'rowspan') {
                     if (this.isGrouped(column)) {
                         let prevRowData = value[i - 1];
+
                         if (prevRowData) {
                             let currentRowFieldData = ObjectUtils.resolveFieldData(value[i], this.columnProp(column, 'field'));
                             let previousRowFieldData = ObjectUtils.resolveFieldData(prevRowData, this.columnProp(column, 'field'));
+
                             return currentRowFieldData !== previousRowFieldData;
-                        }
-                        else {
+                        } else {
                             return true;
                         }
-                    }
-                    else {
+                    } else {
                         return true;
                     }
                 }
-            }
-            else {
+            } else {
                 return !this.columnProp(column, 'hidden');
             }
         },
@@ -2274,55 +2362,49 @@ var script$3 = {
                 while (currentRowFieldData === nextRowFieldData) {
                     groupRowSpan++;
                     let nextRowData = value[++index];
+
                     if (nextRowData) {
                         nextRowFieldData = ObjectUtils.resolveFieldData(nextRowData, this.columnProp(column, 'field'));
-                    }
-                    else {
+                    } else {
                         break;
                     }
                 }
 
                 return groupRowSpan === 1 ? null : groupRowSpan;
-            }
-            else {
+            } else {
                 return null;
             }
         },
         rowTogglerIcon(rowData) {
             const icon = this.isRowExpanded(rowData) ? this.expandedRowIcon : this.collapsedRowIcon;
+
             return ['p-row-toggler-icon pi', icon];
         },
         rowGroupTogglerIcon(rowData) {
             const icon = this.isRowGroupExpanded(rowData) ? this.expandedRowIcon : this.collapsedRowIcon;
+
             return ['p-row-toggler-icon pi', icon];
         },
         isGrouped(column) {
             if (this.groupRowsBy && this.columnProp(column, 'field')) {
-                if (Array.isArray(this.groupRowsBy))
-                    return this.groupRowsBy.indexOf(column.props.field) > -1;
-                else
-                    return this.groupRowsBy === column.props.field;
-            }
-            else {
+                if (Array.isArray(this.groupRowsBy)) return this.groupRowsBy.indexOf(column.props.field) > -1;
+                else return this.groupRowsBy === column.props.field;
+            } else {
                 return false;
             }
         },
         isRowEditing(rowData) {
             if (rowData && this.editingRows) {
-                if (this.dataKey)
-                    return this.editingRowKeys ? this.editingRowKeys[ObjectUtils.resolveFieldData(rowData, this.dataKey)] !== undefined : false;
-                else
-                    return this.findIndex(rowData, this.editingRows) > -1;
+                if (this.dataKey) return this.editingRowKeys ? this.editingRowKeys[ObjectUtils.resolveFieldData(rowData, this.dataKey)] !== undefined : false;
+                else return this.findIndex(rowData, this.editingRows) > -1;
             }
 
             return false;
         },
         isRowExpanded(rowData) {
             if (rowData && this.expandedRows) {
-                if (this.dataKey)
-                    return this.expandedRowKeys ? this.expandedRowKeys[ObjectUtils.resolveFieldData(rowData, this.dataKey)] !== undefined : false;
-                else
-                    return this.findIndex(rowData, this.expandedRows) > -1;
+                if (this.dataKey) return this.expandedRowKeys ? this.expandedRowKeys[ObjectUtils.resolveFieldData(rowData, this.dataKey)] !== undefined : false;
+                else return this.findIndex(rowData, this.expandedRows) > -1;
             }
 
             return false;
@@ -2330,20 +2412,19 @@ var script$3 = {
         isRowGroupExpanded(rowData) {
             if (this.expandableRowGroups && this.expandedRowGroups) {
                 let groupFieldValue = ObjectUtils.resolveFieldData(rowData, this.groupRowsBy);
+
                 return this.expandedRowGroups.indexOf(groupFieldValue) > -1;
             }
+
             return false;
         },
         isSelected(rowData) {
             if (rowData && this.selection) {
                 if (this.dataKey) {
                     return this.selectionKeys ? this.selectionKeys[ObjectUtils.resolveFieldData(rowData, this.dataKey)] !== undefined : false;
-                }
-                else {
-                    if (this.selection instanceof Array)
-                        return this.findIndexInSelection(rowData) > -1;
-                    else
-                        return this.equals(rowData, this.selection);
+                } else {
+                    if (this.selection instanceof Array) return this.findIndexInSelection(rowData) > -1;
+                    else return this.equals(rowData, this.selection);
                 }
             }
 
@@ -2361,6 +2442,7 @@ var script$3 = {
         },
         findIndex(rowData, collection) {
             let index = -1;
+
             if (collection && collection.length) {
                 for (let i = 0; i < collection.length; i++) {
                     if (this.equals(rowData, collection[i])) {
@@ -2373,34 +2455,34 @@ var script$3 = {
             return index;
         },
         equals(data1, data2) {
-            return this.compareSelectionBy === 'equals' ? (data1 === data2) : ObjectUtils.equals(data1, data2, this.dataKey);
+            return this.compareSelectionBy === 'equals' ? data1 === data2 : ObjectUtils.equals(data1, data2, this.dataKey);
         },
         onRowGroupToggle(event, data) {
-            this.$emit('rowgroup-toggle', {originalEvent: event, data: data});
+            this.$emit('rowgroup-toggle', { originalEvent: event, data: data });
         },
         onRowClick(event, rowData, rowIndex) {
-            this.$emit('row-click', {originalEvent: event, data: rowData, index: rowIndex});
+            this.$emit('row-click', { originalEvent: event, data: rowData, index: rowIndex });
         },
         onRowDblClick(event, rowData, rowIndex) {
-            this.$emit('row-dblclick', {originalEvent: event, data: rowData, index: rowIndex});
+            this.$emit('row-dblclick', { originalEvent: event, data: rowData, index: rowIndex });
         },
         onRowRightClick(event, rowData, rowIndex) {
-            this.$emit('row-rightclick', {originalEvent: event, data: rowData, index: rowIndex});
+            this.$emit('row-rightclick', { originalEvent: event, data: rowData, index: rowIndex });
         },
         onRowTouchEnd(event) {
             this.$emit('row-touchend', event);
         },
         onRowKeyDown(event, rowData, rowIndex) {
-            this.$emit('row-keydown', {originalEvent: event, data: rowData, index: rowIndex});
+            this.$emit('row-keydown', { originalEvent: event, data: rowData, index: rowIndex });
         },
         onRowMouseDown(event) {
             this.$emit('row-mousedown', event);
         },
         onRowDragStart(event, rowIndex) {
-            this.$emit('row-dragstart', {originalEvent: event, index: rowIndex});
+            this.$emit('row-dragstart', { originalEvent: event, index: rowIndex });
         },
         onRowDragOver(event, rowIndex) {
-            this.$emit('row-dragover', {originalEvent: event, index: rowIndex});
+            this.$emit('row-dragover', { originalEvent: event, index: rowIndex });
         },
         onRowDragLeave(event) {
             this.$emit('row-dragleave', event);
@@ -2446,19 +2528,23 @@ var script$3 = {
         },
         updateFrozenRowGroupHeaderStickyPosition() {
             let tableHeaderHeight = DomHandler.getOuterHeight(this.$el.previousElementSibling);
+
             this.rowGroupHeaderStyleObject.top = tableHeaderHeight + 'px';
         },
         updateVirtualScrollerPosition() {
             const tableHeaderHeight = DomHandler.getOuterHeight(this.$el.previousElementSibling);
+
             this.$el.style.top = (this.$el.style.top || 0) + tableHeaderHeight + 'px';
         },
         getVirtualScrollerProp(option, options) {
             options = options || this.virtualScrollerContentProps;
+
             return options ? options[option] : null;
         },
         bodyRef(el) {
             // For VirtualScroller
             const contentRef = this.getVirtualScrollerProp('contentRef');
+
             contentRef && contentRef(el);
         }
     },
@@ -2466,15 +2552,15 @@ var script$3 = {
         columnsLength() {
             let hiddenColLength = 0;
 
-            this.columns.forEach(column => {
-                if(this.columnProp(column, 'hidden')) hiddenColLength++;
+            this.columns.forEach((column) => {
+                if (this.columnProp(column, 'hidden')) hiddenColLength++;
             });
 
             return this.columns ? this.columns.length - hiddenColLength : 0;
         },
         rowGroupHeaderStyle() {
             if (this.scrollable) {
-                return {top: this.rowGroupHeaderStyleObject.top};
+                return { top: this.rowGroupHeaderStyleObject.top };
             }
 
             return null;
@@ -2484,7 +2570,7 @@ var script$3 = {
         }
     },
     components: {
-        'DTBodyCell': script$4
+        DTBodyCell: script$4
     }
 };
 
@@ -2542,11 +2628,11 @@ function render$3(_ctx, _cache, $props, $setup, $data, $options) {
                   ], 8, _hoisted_1$3)
                 ], 4))
               : createCommentVNode("", true),
-            ($props.expandableRowGroups ? $options.isRowGroupExpanded(rowData): true)
+            ($props.expandableRowGroups ? $options.isRowGroupExpanded(rowData) : true)
               ? (openBlock(), createElementBlock("tr", {
+                  key: $options.getRowKey(rowData, $options.getRowIndex(index)),
                   class: normalizeClass($options.getRowClass(rowData)),
                   style: normalizeStyle($props.rowStyle),
-                  key: $options.getRowKey(rowData, $options.getRowIndex(index)),
                   onClick: $event => ($options.onRowClick($event, rowData, $options.getRowIndex(index))),
                   onDblclick: $event => ($options.onRowDblClick($event, rowData, $options.getRowIndex(index))),
                   onContextmenu: $event => ($options.onRowRightClick($event, rowData, $options.getRowIndex(index))),
@@ -2563,7 +2649,7 @@ function render$3(_ctx, _cache, $props, $setup, $data, $options) {
                 }, [
                   (openBlock(true), createElementBlock(Fragment, null, renderList($props.columns, (col, i) => {
                     return (openBlock(), createElementBlock(Fragment, {
-                      key: $options.columnProp(col,'columnKey')||$options.columnProp(col,'field')||i
+                      key: $options.columnProp(col, 'columnKey') || $options.columnProp(col, 'field') || i
                     }, [
                       ($options.shouldRenderBodyCell($props.value, col, $options.getRowIndex(index)))
                         ? (openBlock(), createBlock(_component_DTBodyCell, {
@@ -2573,7 +2659,7 @@ function render$3(_ctx, _cache, $props, $setup, $data, $options) {
                             rowIndex: $options.getRowIndex(index),
                             index: i,
                             selected: $options.isSelected(rowData),
-                            rowTogglerIcon: $options.columnProp(col,'expander') ? $options.rowTogglerIcon(rowData): null,
+                            rowTogglerIcon: $options.columnProp(col, 'expander') ? $options.rowTogglerIcon(rowData) : null,
                             frozenRow: $props.frozenRow,
                             rowspan: $props.rowGroupMode === 'rowspan' ? $options.calculateRowGroupSize($props.value, col, $options.getRowIndex(index)) : null,
                             editMode: $props.editMode,
@@ -2599,8 +2685,8 @@ function render$3(_ctx, _cache, $props, $setup, $data, $options) {
               : createCommentVNode("", true),
             ($props.templates['expansion'] && $props.expandedRows && $options.isRowExpanded(rowData))
               ? (openBlock(), createElementBlock("tr", {
-                  class: "p-datatable-row-expansion",
                   key: $options.getRowKey(rowData, $options.getRowIndex(index)) + '_expansion',
+                  class: "p-datatable-row-expansion",
                   role: "row"
                 }, [
                   createElementVNode("td", { colspan: $options.columnsLength }, [
@@ -2613,8 +2699,8 @@ function render$3(_ctx, _cache, $props, $setup, $data, $options) {
               : createCommentVNode("", true),
             ($props.templates['groupfooter'] && $props.rowGroupMode === 'subheader' && $options.shouldRenderRowGroupFooter($props.value, rowData, $options.getRowIndex(index)))
               ? (openBlock(), createElementBlock("tr", {
-                  class: "p-rowgroup-footer",
                   key: $options.getRowKey(rowData, $options.getRowIndex(index)) + '_subfooter',
+                  class: "p-rowgroup-footer",
                   role: "row"
                 }, [
                   (openBlock(), createBlock(resolveDynamicComponent($props.templates['groupfooter']), {
@@ -2648,7 +2734,7 @@ var script$2 = {
     data() {
         return {
             styleObject: {}
-        }
+        };
     },
     mounted() {
         if (this.columnProp('frozen')) {
@@ -2667,20 +2753,24 @@ var script$2 = {
         updateStickyPosition() {
             if (this.columnProp('frozen')) {
                 let align = this.columnProp('alignFrozen');
+
                 if (align === 'right') {
                     let right = 0;
                     let next = this.$el.nextElementSibling;
+
                     if (next) {
                         right = DomHandler.getOuterWidth(next) + parseFloat(next.style.left);
                     }
+
                     this.styleObject.right = right + 'px';
-                }
-                else {
+                } else {
                     let left = 0;
                     let prev = this.$el.previousElementSibling;
+
                     if (prev) {
                         left = DomHandler.getOuterWidth(prev) + parseFloat(prev.style.left);
                     }
+
                     this.styleObject.left = left + 'px';
                 }
             }
@@ -2688,15 +2778,19 @@ var script$2 = {
     },
     computed: {
         containerClass() {
-            return [this.columnProp('footerClass'), this.columnProp('class'), {
-                'p-frozen-column': this.columnProp('frozen')
-            }];
+            return [
+                this.columnProp('footerClass'),
+                this.columnProp('class'),
+                {
+                    'p-frozen-column': this.columnProp('frozen')
+                }
+            ];
         },
         containerStyle() {
             let bodyStyle = this.columnProp('footerStyle');
             let columnStyle = this.columnProp('style');
 
-            return this.columnProp('frozen') ? [columnStyle, bodyStyle, this.styleObject]: [columnStyle, bodyStyle];
+            return this.columnProp('frozen') ? [columnStyle, bodyStyle, this.styleObject] : [columnStyle, bodyStyle];
         }
     }
 };
@@ -2733,7 +2827,7 @@ var script$1 = {
         columns: {
             type: null,
             default: null
-        },
+        }
     },
     methods: {
         columnProp(col, prop) {
@@ -2743,12 +2837,12 @@ var script$1 = {
             let rows = [];
 
             let columnGroup = this.columnGroup;
+
             if (columnGroup.children && columnGroup.children.default) {
                 for (let child of columnGroup.children.default()) {
                     if (child.type.name === 'Row') {
                         rows.push(child);
-                    }
-                    else if (child.children && child.children instanceof Array) {
+                    } else if (child.children && child.children instanceof Array) {
                         rows = child.children;
                     }
                 }
@@ -2756,15 +2850,13 @@ var script$1 = {
                 return rows;
             }
         },
-        getFooterColumns(row){
+        getFooterColumns(row) {
             let cols = [];
 
             if (row.children && row.children.default) {
-                row.children.default().forEach(child => {
-                    if (child.children && child.children instanceof Array)
-                        cols = [...cols, ...child.children];
-                    else if (child.type.name === 'Column')
-                        cols.push(child);
+                row.children.default().forEach((child) => {
+                    if (child.children && child.children instanceof Array) cols = [...cols, ...child.children];
+                    else if (child.type.name === 'Column') cols.push(child);
                 });
 
                 return cols;
@@ -2777,8 +2869,7 @@ var script$1 = {
 
             if (this.columnGroup) {
                 hasFooter = true;
-            }
-            else if (this.columns) {
+            } else if (this.columns) {
                 for (let col of this.columns) {
                     if (this.columnProp(col, 'footer') || (col.children && col.children.footer)) {
                         hasFooter = true;
@@ -2791,7 +2882,7 @@ var script$1 = {
         }
     },
     components: {
-        'DTFooterCell': script$2
+        DTFooterCell: script$2
     }
 };
 
@@ -2814,9 +2905,9 @@ function render$1(_ctx, _cache, $props, $setup, $data, $options) {
           ? (openBlock(), createElementBlock("tr", _hoisted_2$1, [
               (openBlock(true), createElementBlock(Fragment, null, renderList($props.columns, (col, i) => {
                 return (openBlock(), createElementBlock(Fragment, {
-                  key: $options.columnProp(col,'columnKey')||$options.columnProp(col,'field')||i
+                  key: $options.columnProp(col, 'columnKey') || $options.columnProp(col, 'field') || i
                 }, [
-                  (!$options.columnProp(col,'hidden'))
+                  (!$options.columnProp(col, 'hidden'))
                     ? (openBlock(), createBlock(_component_DTFooterCell, {
                         key: 0,
                         column: col
@@ -2832,9 +2923,9 @@ function render$1(_ctx, _cache, $props, $setup, $data, $options) {
               }, [
                 (openBlock(true), createElementBlock(Fragment, null, renderList($options.getFooterColumns(row), (col, j) => {
                   return (openBlock(), createElementBlock(Fragment, {
-                    key: $options.columnProp(col,'columnKey')||$options.columnProp(col,'field')||j
+                    key: $options.columnProp(col, 'columnKey') || $options.columnProp(col, 'field') || j
                   }, [
-                    (!$options.columnProp(col,'hidden'))
+                    (!$options.columnProp(col, 'hidden'))
                       ? (openBlock(), createBlock(_component_DTFooterCell, {
                           key: 0,
                           column: col
@@ -2852,11 +2943,46 @@ script$1.render = render$1;
 
 var script = {
     name: 'DataTable',
-    emits: ['value-change', 'update:first', 'update:rows', 'page', 'update:sortField', 'update:sortOrder', 'update:multiSortMeta', 'sort', 'filter', 'row-click', 'row-dblclick',
-        'update:selection', 'row-select', 'row-unselect', 'update:contextMenuSelection', 'row-contextmenu', 'row-unselect-all', 'row-select-all', 'select-all-change',
-        'column-resize-end', 'column-reorder', 'row-reorder', 'update:expandedRows', 'row-collapse', 'row-expand',
-        'update:expandedRowGroups', 'rowgroup-collapse', 'rowgroup-expand', 'update:filters', 'state-restore', 'state-save',
-        'cell-edit-init', 'cell-edit-complete', 'cell-edit-cancel', 'update:editingRows', 'row-edit-init', 'row-edit-save', 'row-edit-cancel'],
+    emits: [
+        'value-change',
+        'update:first',
+        'update:rows',
+        'page',
+        'update:sortField',
+        'update:sortOrder',
+        'update:multiSortMeta',
+        'sort',
+        'filter',
+        'row-click',
+        'row-dblclick',
+        'update:selection',
+        'row-select',
+        'row-unselect',
+        'update:contextMenuSelection',
+        'row-contextmenu',
+        'row-unselect-all',
+        'row-select-all',
+        'select-all-change',
+        'column-resize-end',
+        'column-reorder',
+        'row-reorder',
+        'update:expandedRows',
+        'row-collapse',
+        'row-expand',
+        'update:expandedRowGroups',
+        'rowgroup-collapse',
+        'rowgroup-expand',
+        'update:filters',
+        'state-restore',
+        'state-save',
+        'cell-edit-init',
+        'cell-edit-complete',
+        'cell-edit-cancel',
+        'update:editingRows',
+        'row-edit-init',
+        'row-edit-save',
+        'row-edit-cancel'
+    ],
     props: {
         value: {
             type: Array,
@@ -2959,7 +3085,7 @@ var script = {
             default: undefined
         },
         selection: {
-            type: [Array,Object],
+            type: [Array, Object],
             default: null
         },
         selectionMode: {
@@ -3035,7 +3161,7 @@ var script = {
             default: null
         },
         groupRowsBy: {
-            type: [Array,String],
+            type: [Array, String],
             default: null
         },
         expandableRowGroups: {
@@ -3076,7 +3202,7 @@ var script = {
         },
         scrollDirection: {
             type: String,
-            default: "vertical"
+            default: 'vertical'
         },
         virtualScrollerOptions: {
             type: Object,
@@ -3184,7 +3310,7 @@ var script = {
         },
         filters: {
             deep: true,
-            handler: function(newValue) {
+            handler: function (newValue) {
                 this.d_filters = this.cloneFilters(newValue);
             }
         }
@@ -3234,6 +3360,7 @@ var script = {
             this.d_rows = event.rows;
 
             let pageEvent = this.createLazyLoadEvent(event);
+
             pageEvent.pageCount = event.pageCount;
             pageEvent.page = event.page;
 
@@ -3250,21 +3377,24 @@ var script = {
                 const targetNode = event.target;
                 const columnField = this.columnProp(column, 'sortField') || this.columnProp(column, 'field');
 
-                if (DomHandler.hasClass(targetNode, 'p-sortable-column') || DomHandler.hasClass(targetNode, 'p-column-title') || DomHandler.hasClass(targetNode, 'p-column-header-content')
-                    || DomHandler.hasClass(targetNode, 'p-sortable-column-icon') || DomHandler.hasClass(targetNode.parentElement, 'p-sortable-column-icon')) {
+                if (
+                    DomHandler.hasClass(targetNode, 'p-sortable-column') ||
+                    DomHandler.hasClass(targetNode, 'p-column-title') ||
+                    DomHandler.hasClass(targetNode, 'p-column-header-content') ||
+                    DomHandler.hasClass(targetNode, 'p-sortable-column-icon') ||
+                    DomHandler.hasClass(targetNode.parentElement, 'p-sortable-column-icon')
+                ) {
                     DomHandler.clearSelection();
 
                     if (this.sortMode === 'single') {
                         if (this.d_sortField === columnField) {
-                            if (this.removableSort && (this.d_sortOrder * -1 === this.defaultSortOrder)) {
+                            if (this.removableSort && this.d_sortOrder * -1 === this.defaultSortOrder) {
                                 this.d_sortOrder = null;
                                 this.d_sortField = null;
-                            }
-                            else {
+                            } else {
                                 this.d_sortOrder = this.d_sortOrder * -1;
                             }
-                        }
-                        else {
+                        } else {
                             this.d_sortOrder = this.defaultSortOrder;
                             this.d_sortField = columnField;
                         }
@@ -3272,11 +3402,11 @@ var script = {
                         this.$emit('update:sortField', this.d_sortField);
                         this.$emit('update:sortOrder', this.d_sortOrder);
                         this.resetPage();
-                    }
-                    else if (this.sortMode === 'multiple') {
+                    } else if (this.sortMode === 'multiple') {
                         let metaKey = event.metaKey || event.ctrlKey;
+
                         if (!metaKey) {
-                            this.d_multiSortMeta =  this.d_multiSortMeta.filter(meta => meta.field === columnField);
+                            this.d_multiSortMeta = this.d_multiSortMeta.filter((meta) => meta.field === columnField);
                         }
 
                         this.addMultiSortField(columnField);
@@ -3293,8 +3423,8 @@ var script = {
 
             if (this.groupRowsBy && this.groupRowsBy === this.sortField) {
                 this.d_multiSortMeta = [
-                    {field: this.sortField, order: this.sortOrder || this.defaultSortOrder},
-                    {field: this.d_sortField, order: this.d_sortOrder}
+                    { field: this.sortField, order: this.sortOrder || this.defaultSortOrder },
+                    { field: this.d_sortField, order: this.d_sortOrder }
                 ];
 
                 return this.sortMultiple(value);
@@ -3308,18 +3438,13 @@ var script = {
 
                 let result = null;
 
-                if (value1 == null && value2 != null)
-                    result = -1;
-                else if (value1 != null && value2 == null)
-                    result = 1;
-                else if (value1 == null && value2 == null)
-                    result = 0;
-                else if (typeof value1 === 'string' && typeof value2 === 'string')
-                    result = value1.localeCompare(value2, undefined, { numeric: true });
-                else
-                    result = (value1 < value2) ? -1 : (value1 > value2) ? 1 : 0;
-
-                return (this.d_sortOrder * result);
+                if (value1 == null && value2 != null) result = -1;
+                else if (value1 != null && value2 == null) result = 1;
+                else if (value1 == null && value2 == null) result = 0;
+                else if (typeof value1 === 'string' && typeof value2 === 'string') result = value1.localeCompare(value2, undefined, { numeric: true });
+                else result = value1 < value2 ? -1 : value1 > value2 ? 1 : 0;
+
+                return this.d_sortOrder * result;
             });
 
             return data;
@@ -3329,6 +3454,7 @@ var script = {
 
             if (this.groupRowsBy && (this.d_groupRowsSortMeta || (this.d_multiSortMeta.length && this.groupRowsBy === this.d_multiSortMeta[0].field))) {
                 const firstSortMeta = this.d_multiSortMeta[0];
+
                 !this.d_groupRowsSortMeta && (this.d_groupRowsSortMeta = firstSortMeta);
 
                 if (firstSortMeta.field !== this.d_groupRowsSortMeta.field) {
@@ -3350,31 +3476,27 @@ var script = {
             let result = null;
 
             if (typeof value1 === 'string' || value1 instanceof String) {
-                if (value1.localeCompare && (value1 !== value2)) {
-                    return (this.d_multiSortMeta[index].order * value1.localeCompare(value2, undefined, { numeric: true }));
+                if (value1.localeCompare && value1 !== value2) {
+                    return this.d_multiSortMeta[index].order * value1.localeCompare(value2, undefined, { numeric: true });
                 }
-            }
-            else {
-                result = (value1 < value2) ? -1 : 1;
+            } else {
+                result = value1 < value2 ? -1 : 1;
             }
 
-            if (value1 === value2)  {
-                return (this.d_multiSortMeta.length - 1) > (index) ? (this.multisortField(data1, data2, index + 1)) : 0;
+            if (value1 === value2) {
+                return this.d_multiSortMeta.length - 1 > index ? this.multisortField(data1, data2, index + 1) : 0;
             }
 
-            return (this.d_multiSortMeta[index].order * result);
+            return this.d_multiSortMeta[index].order * result;
         },
         addMultiSortField(field) {
-            let index =  this.d_multiSortMeta.findIndex(meta => meta.field === field);
+            let index = this.d_multiSortMeta.findIndex((meta) => meta.field === field);
 
             if (index >= 0) {
-                if (this.removableSort && (this.d_multiSortMeta[index].order * -1 === this.defaultSortOrder))
-                    this.d_multiSortMeta.splice(index, 1);
-                else
-                    this.d_multiSortMeta[index] = {field: field, order: this.d_multiSortMeta[index].order * -1};
-            }
-            else {
-                this.d_multiSortMeta.push({field: field, order: this.defaultSortOrder});
+                if (this.removableSort && this.d_multiSortMeta[index].order * -1 === this.defaultSortOrder) this.d_multiSortMeta.splice(index, 1);
+                else this.d_multiSortMeta[index] = { field: field, order: this.d_multiSortMeta[index].order * -1 };
+            } else {
+                this.d_multiSortMeta.push({ field: field, order: this.defaultSortOrder });
             }
 
             this.d_multiSortMeta = [...this.d_multiSortMeta];
@@ -3387,8 +3509,9 @@ var script = {
             this.clearEditingMetaData();
 
             let globalFilterFieldsArray;
+
             if (this.filters['global']) {
-                globalFilterFieldsArray = this.globalFilterFields|| this.columns.map(col => this.columnProp(col, 'filterField') || this.columnProp(col, 'field'));
+                globalFilterFieldsArray = this.globalFilterFields || this.columns.map((col) => this.columnProp(col, 'filterField') || this.columnProp(col, 'field'));
             }
 
             let filteredValue = [];
@@ -3412,8 +3535,7 @@ var script = {
                                     break;
                                 }
                             }
-                        }
-                        else {
+                        } else {
                             localMatch = this.executeLocalFilter(filterField, data[i], filterMeta);
                         }
 
@@ -3424,8 +3546,9 @@ var script = {
                 }
 
                 if (this.filters['global'] && !globalMatch && globalFilterFieldsArray) {
-                    for(let j = 0; j < globalFilterFieldsArray.length; j++) {
+                    for (let j = 0; j < globalFilterFieldsArray.length; j++) {
                         let globalFilterField = globalFilterFieldsArray[j];
+
                         globalMatch = FilterService.filters[this.filters['global'].matchMode || FilterMatchMode.CONTAINS](ObjectUtils.resolveFieldData(data[i], globalFilterField), this.filters['global'].value, this.filterLocale);
 
                         if (globalMatch) {
@@ -3435,10 +3558,10 @@ var script = {
                 }
 
                 let matches;
+
                 if (this.filters['global']) {
-                    matches = localFiltered ? (localFiltered && localMatch && globalMatch) : globalMatch;
-                }
-                else {
+                    matches = localFiltered ? localFiltered && localMatch && globalMatch : globalMatch;
+                } else {
                     matches = localFiltered && localMatch;
                 }
 
@@ -3452,6 +3575,7 @@ var script = {
             }
 
             let filterEvent = this.createLazyLoadEvent();
+
             filterEvent.filteredValue = filteredValue;
             this.$emit('filter', filterEvent);
             this.$emit('value-change', filteredValue);
@@ -3468,6 +3592,7 @@ var script = {
         },
         onRowClick(e) {
             const event = e.originalEvent;
+
             if (DomHandler.isClickable(event.target)) {
                 return;
             }
@@ -3482,10 +3607,10 @@ var script = {
                     DomHandler.clearSelection();
                     this.rangeRowIndex = rowIndex;
                     this.selectRange(event);
-                }
-                else {
+                } else {
                     const selected = this.isSelected(rowData);
                     const metaSelection = this.rowTouched ? false : this.metaKeySelection;
+
                     this.anchorRowIndex = rowIndex;
                     this.rangeRowIndex = rowIndex;
 
@@ -3493,52 +3618,49 @@ var script = {
                         let metaKey = event.metaKey || event.ctrlKey;
 
                         if (selected && metaKey) {
-                            if(this.isSingleSelectionMode()) {
+                            if (this.isSingleSelectionMode()) {
                                 this.$emit('update:selection', null);
-                            }
-                            else {
+                            } else {
                                 const selectionIndex = this.findIndexInSelection(rowData);
-                                const _selection = this.selection.filter((val,i) => i != selectionIndex);
+                                const _selection = this.selection.filter((val, i) => i != selectionIndex);
+
                                 this.$emit('update:selection', _selection);
                             }
 
-                            this.$emit('row-unselect', {originalEvent: event, data: rowData, index: rowIndex, type: 'row'});
-                        }
-                        else {
-                            if(this.isSingleSelectionMode()) {
+                            this.$emit('row-unselect', { originalEvent: event, data: rowData, index: rowIndex, type: 'row' });
+                        } else {
+                            if (this.isSingleSelectionMode()) {
                                 this.$emit('update:selection', rowData);
-                            }
-                            else if (this.isMultipleSelectionMode()) {
-                                let _selection = metaKey ? (this.selection || []) : [];
+                            } else if (this.isMultipleSelectionMode()) {
+                                let _selection = metaKey ? this.selection || [] : [];
+
                                 _selection = [..._selection, rowData];
                                 this.$emit('update:selection', _selection);
                             }
 
-                            this.$emit('row-select', {originalEvent: event, data: rowData, index: rowIndex, type: 'row'});
+                            this.$emit('row-select', { originalEvent: event, data: rowData, index: rowIndex, type: 'row' });
                         }
-                    }
-                    else {
+                    } else {
                         if (this.selectionMode === 'single') {
                             if (selected) {
                                 this.$emit('update:selection', null);
-                                this.$emit('row-unselect', {originalEvent: event, data: rowData, index: rowIndex, type: 'row'});
-                            }
-                            else {
+                                this.$emit('row-unselect', { originalEvent: event, data: rowData, index: rowIndex, type: 'row' });
+                            } else {
                                 this.$emit('update:selection', rowData);
-                                this.$emit('row-select', {originalEvent: event, data: rowData, index: rowIndex, type: 'row'});
+                                this.$emit('row-select', { originalEvent: event, data: rowData, index: rowIndex, type: 'row' });
                             }
-                        }
-                        else if (this.selectionMode === 'multiple') {
+                        } else if (this.selectionMode === 'multiple') {
                             if (selected) {
                                 const selectionIndex = this.findIndexInSelection(rowData);
                                 const _selection = this.selection.filter((val, i) => i != selectionIndex);
+
                                 this.$emit('update:selection', _selection);
-                                this.$emit('row-unselect', {originalEvent: event, data: rowData, index: rowIndex, type: 'row'});
-                            }
-                            else {
+                                this.$emit('row-unselect', { originalEvent: event, data: rowData, index: rowIndex, type: 'row' });
+                            } else {
                                 const _selection = this.selection ? [...this.selection, rowData] : [rowData];
+
                                 this.$emit('update:selection', _selection);
-                                this.$emit('row-select', {originalEvent: event, data: rowData, index: rowIndex, type: 'row'});
+                                this.$emit('row-select', { originalEvent: event, data: rowData, index: rowIndex, type: 'row' });
                             }
                         }
                     }
@@ -3549,6 +3671,7 @@ var script = {
         },
         onRowDblClick(e) {
             const event = e.originalEvent;
+
             if (DomHandler.isClickable(event.target)) {
                 return;
             }
@@ -3577,51 +3700,49 @@ var script = {
                     //down arrow
                     case 40:
                         var nextRow = this.findNextSelectableRow(row);
+
                         if (nextRow) {
                             nextRow.focus();
                         }
 
                         event.preventDefault();
-                    break;
+                        break;
 
                     //up arrow
                     case 38:
                         var prevRow = this.findPrevSelectableRow(row);
+
                         if (prevRow) {
                             prevRow.focus();
                         }
 
                         event.preventDefault();
-                    break;
+                        break;
 
                     //enter
                     case 13:
-                        this.onRowClick({originalEvent: event, data: rowData, index: rowIndex});
-                    break;
+                        this.onRowClick({ originalEvent: event, data: rowData, index: rowIndex });
+                        break;
                 }
             }
         },
         findNextSelectableRow(row) {
             let nextRow = row.nextElementSibling;
+
             if (nextRow) {
-                if (DomHandler.hasClass(nextRow, 'p-selectable-row'))
-                    return nextRow;
-                else
-                    return this.findNextSelectableRow(nextRow);
-            }
-            else {
+                if (DomHandler.hasClass(nextRow, 'p-selectable-row')) return nextRow;
+                else return this.findNextSelectableRow(nextRow);
+            } else {
                 return null;
             }
         },
         findPrevSelectableRow(row) {
             let prevRow = row.previousElementSibling;
+
             if (prevRow) {
-                if (DomHandler.hasClass(prevRow, 'p-selectable-row'))
-                    return prevRow;
-                else
-                    return this.findPrevSelectableRow(prevRow);
-            }
-            else {
+                if (DomHandler.hasClass(prevRow, 'p-selectable-row')) return prevRow;
+                else return this.findPrevSelectableRow(prevRow);
+            } else {
                 return null;
             }
         },
@@ -3631,8 +3752,7 @@ var script = {
             if (this.isSelected(rowData)) {
                 this.$emit('update:selection', null);
                 this.$emit('row-unselect', { originalEvent: event.originalEvent, data: rowData, index: event.index, type: 'radiobutton' });
-            }
-            else {
+            } else {
                 this.$emit('update:selection', rowData);
                 this.$emit('row-select', { originalEvent: event.originalEvent, data: rowData, index: event.index, type: 'radiobutton' });
             }
@@ -3643,11 +3763,12 @@ var script = {
             if (this.isSelected(rowData)) {
                 const selectionIndex = this.findIndexInSelection(rowData);
                 const _selection = this.selection.filter((val, i) => i != selectionIndex);
+
                 this.$emit('update:selection', _selection);
                 this.$emit('row-unselect', { originalEvent: event.originalEvent, data: rowData, index: event.index, type: 'checkbox' });
-            }
-            else {
+            } else {
                 let _selection = this.selection ? [...this.selection] : [];
+
                 _selection = [..._selection, rowData];
                 this.$emit('update:selection', _selection);
                 this.$emit('row-select', { originalEvent: event.originalEvent, data: rowData, index: event.index, type: 'checkbox' });
@@ -3656,21 +3777,18 @@ var script = {
         toggleRowsWithCheckbox(event) {
             if (this.selectAll !== null) {
                 this.$emit('select-all-change', event);
-            }
-            else {
+            } else {
                 const { originalEvent, checked } = event;
                 let _selection = [];
 
                 if (checked) {
                     _selection = this.frozenValue ? [...this.frozenValue, ...this.processedData] : this.processedData;
-                    this.$emit('row-select-all', {originalEvent, data: _selection});
-                }
-                else {
-                    this.$emit('row-unselect-all', {originalEvent});
+                    this.$emit('row-select-all', { originalEvent, data: _selection });
+                } else {
+                    this.$emit('row-unselect-all', { originalEvent });
                 }
 
                 this.$emit('update:selection', _selection);
-
             }
         },
         isSingleSelectionMode() {
@@ -3683,12 +3801,9 @@ var script = {
             if (rowData && this.selection) {
                 if (this.dataKey) {
                     return this.d_selectionKeys ? this.d_selectionKeys[ObjectUtils.resolveFieldData(rowData, this.dataKey)] !== undefined : false;
-                }
-                else {
-                    if (this.selection instanceof Array)
-                        return this.findIndexInSelection(rowData) > -1;
-                    else
-                        return this.equals(rowData, this.selection);
+                } else {
+                    if (this.selection instanceof Array) return this.findIndexInSelection(rowData) > -1;
+                    else return this.equals(rowData, this.selection);
                 }
             }
 
@@ -3699,6 +3814,7 @@ var script = {
         },
         findIndex(rowData, collection) {
             let index = -1;
+
             if (collection && collection.length) {
                 for (let i = 0; i < collection.length; i++) {
                     if (this.equals(rowData, collection[i])) {
@@ -3712,39 +3828,39 @@ var script = {
         },
         updateSelectionKeys(selection) {
             this.d_selectionKeys = {};
+
             if (Array.isArray(selection)) {
                 for (let data of selection) {
                     this.d_selectionKeys[String(ObjectUtils.resolveFieldData(data, this.dataKey))] = 1;
                 }
-            }
-            else {
+            } else {
                 this.d_selectionKeys[String(ObjectUtils.resolveFieldData(selection, this.dataKey))] = 1;
             }
         },
         updateExpandedRowKeys(expandedRows) {
             if (expandedRows && expandedRows.length) {
                 this.d_expandedRowKeys = {};
+
                 for (let data of expandedRows) {
                     this.d_expandedRowKeys[String(ObjectUtils.resolveFieldData(data, this.dataKey))] = 1;
                 }
-            }
-            else {
+            } else {
                 this.d_expandedRowKeys = null;
             }
         },
         updateEditingRowKeys(editingRows) {
             if (editingRows && editingRows.length) {
                 this.d_editingRowKeys = {};
+
                 for (let data of editingRows) {
                     this.d_editingRowKeys[String(ObjectUtils.resolveFieldData(data, this.dataKey))] = 1;
                 }
-            }
-            else {
+            } else {
                 this.d_editingRowKeys = null;
             }
         },
         equals(data1, data2) {
-            return this.compareSelectionBy === 'equals' ? (data1 === data2) : ObjectUtils.equals(data1, data2, this.dataKey);
+            return this.compareSelectionBy === 'equals' ? data1 === data2 : ObjectUtils.equals(data1, data2, this.dataKey);
         },
         selectRange(event) {
             let rangeStart, rangeEnd;
@@ -3752,12 +3868,10 @@ var script = {
             if (this.rangeRowIndex > this.anchorRowIndex) {
                 rangeStart = this.anchorRowIndex;
                 rangeEnd = this.rangeRowIndex;
-            }
-            else if(this.rangeRowIndex < this.anchorRowIndex) {
+            } else if (this.rangeRowIndex < this.anchorRowIndex) {
                 rangeStart = this.rangeRowIndex;
                 rangeEnd = this.anchorRowIndex;
-            }
-            else {
+            } else {
                 rangeStart = this.rangeRowIndex;
                 rangeEnd = this.rangeRowIndex;
             }
@@ -3769,10 +3883,12 @@ var script = {
 
             const value = this.processedData;
             let _selection = [];
-            for(let i = rangeStart; i <= rangeEnd; i++) {
+
+            for (let i = rangeStart; i <= rangeEnd; i++) {
                 let rangeRowData = value[i];
+
                 _selection.push(rangeRowData);
-                this.$emit('row-select', {originalEvent: event, data: rangeRowData, type: 'row'});
+                this.$emit('row-select', { originalEvent: event, data: rangeRowData, type: 'row' });
             }
 
             this.$emit('update:selection', _selection);
@@ -3783,22 +3899,19 @@ var script = {
             if (!data) {
                 data = this.processedData;
 
-                if (options && options.selectionOnly)
-                    data = this.selection || [];
-                else if (this.frozenValue)
-                    data = data ? [...this.frozenValue, ...data] : this.frozenValue;
+                if (options && options.selectionOnly) data = this.selection || [];
+                else if (this.frozenValue) data = data ? [...this.frozenValue, ...data] : this.frozenValue;
             }
 
             //headers
             let headerInitiated = false;
+
             for (let i = 0; i < this.columns.length; i++) {
                 let column = this.columns[i];
 
                 if (this.columnProp(column, 'exportable') !== false && this.columnProp(column, 'field')) {
-                    if (headerInitiated)
-                        csv += this.csvSeparator;
-                    else
-                        headerInitiated = true;
+                    if (headerInitiated) csv += this.csvSeparator;
+                    else headerInitiated = true;
 
                     csv += '"' + (this.columnProp(column, 'exportHeader') || this.columnProp(column, 'header') || this.columnProp(column, 'field')) + '"';
                 }
@@ -3806,16 +3919,16 @@ var script = {
 
             //body
             if (data) {
-                data.forEach(record => {
+                data.forEach((record) => {
                     csv += '\n';
                     let rowInitiated = false;
+
                     for (let i = 0; i < this.columns.length; i++) {
                         let column = this.columns[i];
+
                         if (this.columnProp(column, 'exportable') !== false && this.columnProp(column, 'field')) {
-                            if (rowInitiated)
-                                csv += this.csvSeparator;
-                            else
-                                rowInitiated = true;
+                            if (rowInitiated) csv += this.csvSeparator;
+                            else rowInitiated = true;
 
                             let cellData = ObjectUtils.resolveFieldData(record, this.columnProp(column, 'field'));
 
@@ -3825,12 +3938,8 @@ var script = {
                                         data: cellData,
                                         field: this.columnProp(column, 'field')
                                     });
-                                }
-                                else
-                                    cellData = String(cellData).replace(/"/g, '""');
-                            }
-                            else
-                                cellData = '';
+                                } else cellData = String(cellData).replace(/"/g, '""');
+                            } else cellData = '';
 
                             csv += '"' + cellData + '"';
                         }
@@ -3838,19 +3947,17 @@ var script = {
                 });
             }
 
-
             //footers
             let footerInitiated = false;
+
             for (let i = 0; i < this.columns.length; i++) {
                 let column = this.columns[i];
 
                 if (i === 0) csv += '\n';
 
                 if (this.columnProp(column, 'exportable') !== false && this.columnProp(column, 'field')) {
-                    if (footerInitiated)
-                        csv += this.csvSeparator;
-                    else
-                        footerInitiated = true;
+                    if (footerInitiated) csv += this.csvSeparator;
+                    else footerInitiated = true;
 
                     csv += '"' + (this.columnProp(column, 'exportFooter') || this.columnProp(column, 'footer') || this.columnProp(column, 'field')) + '"';
                 }
@@ -3864,18 +3971,20 @@ var script = {
         },
         onColumnResizeStart(event) {
             let containerLeft = DomHandler.getOffset(this.$el).left;
+
             this.resizeColumnElement = event.target.parentElement;
             this.columnResizing = true;
-            this.lastResizeHelperX = (event.pageX - containerLeft + this.$el.scrollLeft);
+            this.lastResizeHelperX = event.pageX - containerLeft + this.$el.scrollLeft;
 
             this.bindColumnResizeEvents();
         },
         onColumnResize(event) {
             let containerLeft = DomHandler.getOffset(this.$el).left;
+
             DomHandler.addClass(this.$el, 'p-unselectable-text');
             this.$refs.resizeHelper.style.height = this.$el.offsetHeight + 'px';
             this.$refs.resizeHelper.style.top = 0 + 'px';
-            this.$refs.resizeHelper.style.left = (event.pageX - containerLeft + this.$el.scrollLeft) + 'px';
+            this.$refs.resizeHelper.style.left = event.pageX - containerLeft + this.$el.scrollLeft + 'px';
 
             this.$refs.resizeHelper.style.display = 'block';
         },
@@ -3883,7 +3992,7 @@ var script = {
             let delta = this.$refs.resizeHelper.offsetLeft - this.lastResizeHelperX;
             let columnWidth = this.resizeColumnElement.offsetWidth;
             let newColumnWidth = columnWidth + delta;
-            let minWidth = this.resizeColumnElement.style.minWidth||15;
+            let minWidth = this.resizeColumnElement.style.minWidth || 15;
 
             if (columnWidth + delta > parseInt(minWidth, 10)) {
                 if (this.columnResizeMode === 'fit') {
@@ -3893,9 +4002,9 @@ var script = {
                     if (newColumnWidth > 15 && nextColumnWidth > 15) {
                         this.resizeTableCells(newColumnWidth, nextColumnWidth);
                     }
-                }
-                else if (this.columnResizeMode === 'expand') {
+                } else if (this.columnResizeMode === 'expand') {
                     const tableWidth = this.$refs.table.offsetWidth + delta + 'px';
+
                     const updateTableWidth = (el) => {
                         !!el && (el.style.width = el.style.minWidth = tableWidth);
                     };
@@ -3933,15 +4042,18 @@ var script = {
             let colIndex = DomHandler.index(this.resizeColumnElement);
             let widths = [];
             let headers = DomHandler.find(this.$refs.table, '.p-datatable-thead > tr > th');
-            headers.forEach(header => widths.push(DomHandler.getOuterWidth(header)));
+
+            headers.forEach((header) => widths.push(DomHandler.getOuterWidth(header)));
 
             this.destroyStyleElement();
             this.createStyleElement();
 
             let innerHTML = '';
+
             widths.forEach((width, index) => {
-                let colWidth = index === colIndex ? newColumnWidth : (nextColumnWidth && index === colIndex + 1) ? nextColumnWidth : width;
+                let colWidth = index === colIndex ? newColumnWidth : nextColumnWidth && index === colIndex + 1 ? nextColumnWidth : width;
                 let style = this.scrollable ? `flex: 1 1 ${colWidth}px !important` : `width: ${colWidth}px !important`;
+
                 innerHTML += `
                     .p-datatable[${this.attributeSelector}] .p-datatable-thead > tr > th:nth-child(${index + 1}),
                     .p-datatable[${this.attributeSelector}] .p-datatable-tbody > tr > td:nth-child(${index + 1}),
@@ -3956,7 +4068,7 @@ var script = {
         bindColumnResizeEvents() {
             if (!this.documentColumnResizeListener) {
                 this.documentColumnResizeListener = document.addEventListener('mousemove', () => {
-                    if(this.columnResizing) {
+                    if (this.columnResizing) {
                         this.onColumnResize(event);
                     }
                 });
@@ -3964,13 +4076,12 @@ var script = {
 
             if (!this.documentColumnResizeEndListener) {
                 this.documentColumnResizeEndListener = document.addEventListener('mouseup', () => {
-                    if(this.columnResizing) {
+                    if (this.columnResizing) {
                         this.columnResizing = false;
                         this.onColumnResizeEnd();
                     }
                 });
             }
-
         },
         unbindColumnResizeEvents() {
             if (this.documentColumnResizeListener) {
@@ -3988,15 +4099,14 @@ var script = {
             const column = e.column;
 
             if (this.reorderableColumns && this.columnProp(column, 'reorderableColumn') !== false) {
-                if (event.target.nodeName === 'INPUT' || event.target.nodeName === 'TEXTAREA' || DomHandler.hasClass(event.target, 'p-column-resizer'))
-                    event.currentTarget.draggable = false;
-                else
-                    event.currentTarget.draggable = true;
+                if (event.target.nodeName === 'INPUT' || event.target.nodeName === 'TEXTAREA' || DomHandler.hasClass(event.target, 'p-column-resizer')) event.currentTarget.draggable = false;
+                else event.currentTarget.draggable = true;
             }
         },
         onColumnHeaderDragStart(event) {
             if (this.columnResizing) {
                 event.preventDefault();
+
                 return;
             }
 
@@ -4008,26 +4118,26 @@ var script = {
         },
         onColumnHeaderDragOver(event) {
             let dropHeader = this.findParentHeader(event.target);
-            if(this.reorderableColumns && this.draggedColumn && dropHeader) {
+
+            if (this.reorderableColumns && this.draggedColumn && dropHeader) {
                 event.preventDefault();
                 let containerOffset = DomHandler.getOffset(this.$el);
                 let dropHeaderOffset = DomHandler.getOffset(dropHeader);
 
                 if (this.draggedColumn !== dropHeader) {
-                    let targetLeft =  dropHeaderOffset.left - containerOffset.left;
+                    let targetLeft = dropHeaderOffset.left - containerOffset.left;
                     let columnCenter = dropHeaderOffset.left + dropHeader.offsetWidth / 2;
 
                     this.$refs.reorderIndicatorUp.style.top = dropHeaderOffset.top - containerOffset.top - (this.colReorderIconHeight - 1) + 'px';
                     this.$refs.reorderIndicatorDown.style.top = dropHeaderOffset.top - containerOffset.top + dropHeader.offsetHeight + 'px';
 
-                    if(event.pageX > columnCenter) {
-                        this.$refs.reorderIndicatorUp.style.left = (targetLeft + dropHeader.offsetWidth - Math.ceil(this.colReorderIconWidth / 2)) + 'px';
-                        this.$refs.reorderIndicatorDown.style.left = (targetLeft + dropHeader.offsetWidth - Math.ceil(this.colReorderIconWidth / 2))+ 'px';
+                    if (event.pageX > columnCenter) {
+                        this.$refs.reorderIndicatorUp.style.left = targetLeft + dropHeader.offsetWidth - Math.ceil(this.colReorderIconWidth / 2) + 'px';
+                        this.$refs.reorderIndicatorDown.style.left = targetLeft + dropHeader.offsetWidth - Math.ceil(this.colReorderIconWidth / 2) + 'px';
                         this.dropPosition = 1;
-                    }
-                    else {
-                        this.$refs.reorderIndicatorUp.style.left = (targetLeft - Math.ceil(this.colReorderIconWidth / 2)) + 'px';
-                        this.$refs.reorderIndicatorDown.style.left = (targetLeft - Math.ceil(this.colReorderIconWidth / 2))+ 'px';
+                    } else {
+                        this.$refs.reorderIndicatorUp.style.left = targetLeft - Math.ceil(this.colReorderIconWidth / 2) + 'px';
+                        this.$refs.reorderIndicatorDown.style.left = targetLeft - Math.ceil(this.colReorderIconWidth / 2) + 'px';
                         this.dropPosition = -1;
                     }
 
@@ -4037,7 +4147,7 @@ var script = {
             }
         },
         onColumnHeaderDragLeave(event) {
-            if(this.reorderableColumns && this.draggedColumn) {
+            if (this.reorderableColumns && this.draggedColumn) {
                 event.preventDefault();
                 this.$refs.reorderIndicatorUp.style.display = 'none';
                 this.$refs.reorderIndicatorDown.style.display = 'none';
@@ -4045,10 +4155,12 @@ var script = {
         },
         onColumnHeaderDrop(event) {
             event.preventDefault();
+
             if (this.draggedColumn) {
                 let dragIndex = DomHandler.index(this.draggedColumn);
                 let dropIndex = DomHandler.index(this.findParentHeader(event.target));
-                let allowDrop = (dragIndex !== dropIndex);
+                let allowDrop = dragIndex !== dropIndex;
+
                 if (allowDrop && ((dropIndex - dragIndex === 1 && this.dropPosition === -1) || (dropIndex - dragIndex === -1 && this.dropPosition === 1))) {
                     allowDrop = false;
                 }
@@ -4072,15 +4184,16 @@ var script = {
             }
         },
         findParentHeader(element) {
-            if(element.nodeName === 'TH') {
+            if (element.nodeName === 'TH') {
                 return element;
-            }
-            else {
+            } else {
                 let parent = element.parentElement;
-                while(parent.nodeName !== 'TH') {
+
+                while (parent.nodeName !== 'TH') {
                     parent = parent.parentElement;
                     if (!parent) break;
                 }
+
                 return parent;
             }
         },
@@ -4088,6 +4201,7 @@ var script = {
             if (columns && columns.length) {
                 for (let i = 0; i < columns.length; i++) {
                     let column = columns[i];
+
                     if (this.columnProp(column, 'columnKey') === key || this.columnProp(column, 'field') === key) {
                         return column;
                     }
@@ -4097,17 +4211,16 @@ var script = {
             return null;
         },
         onRowMouseDown(event) {
-            if (DomHandler.hasClass(event.target, 'p-datatable-reorderablerow-handle'))
-                event.currentTarget.draggable = true;
-            else
-                event.currentTarget.draggable = false;
+            if (DomHandler.hasClass(event.target, 'p-datatable-reorderablerow-handle')) event.currentTarget.draggable = true;
+            else event.currentTarget.draggable = false;
         },
         onRowDragStart(e) {
             const event = e.originalEvent;
             const index = e.index;
+
             this.rowDragging = true;
             this.draggedRowIndex = index;
-            event.dataTransfer.setData('text', 'b');    // For firefox
+            event.dataTransfer.setData('text', 'b'); // For firefox
         },
         onRowDragOver(e) {
             const event = e.originalEvent;
@@ -4124,16 +4237,11 @@ var script = {
                     DomHandler.removeClass(rowElement, 'p-datatable-dragpoint-bottom');
 
                     this.droppedRowIndex = index;
-                    if (prevRowElement)
-                        DomHandler.addClass(prevRowElement, 'p-datatable-dragpoint-bottom');
-                    else
-                        DomHandler.addClass(rowElement, 'p-datatable-dragpoint-top');
-                }
-                else {
-                    if (prevRowElement)
-                        DomHandler.removeClass(prevRowElement, 'p-datatable-dragpoint-bottom');
-                    else
-                        DomHandler.addClass(rowElement, 'p-datatable-dragpoint-top');
+                    if (prevRowElement) DomHandler.addClass(prevRowElement, 'p-datatable-dragpoint-bottom');
+                    else DomHandler.addClass(rowElement, 'p-datatable-dragpoint-top');
+                } else {
+                    if (prevRowElement) DomHandler.removeClass(prevRowElement, 'p-datatable-dragpoint-bottom');
+                    else DomHandler.addClass(rowElement, 'p-datatable-dragpoint-top');
 
                     this.droppedRowIndex = index + 1;
                     DomHandler.addClass(rowElement, 'p-datatable-dragpoint-bottom');
@@ -4145,6 +4253,7 @@ var script = {
         onRowDragLeave(event) {
             let rowElement = event.currentTarget;
             let prevRowElement = rowElement.previousElementSibling;
+
             if (prevRowElement) {
                 DomHandler.removeClass(prevRowElement, 'p-datatable-dragpoint-bottom');
             }
@@ -4160,8 +4269,9 @@ var script = {
         },
         onRowDrop(event) {
             if (this.droppedRowIndex != null) {
-                let dropIndex = (this.draggedRowIndex > this.droppedRowIndex) ? this.droppedRowIndex : (this.droppedRowIndex === 0) ? 0 : this.droppedRowIndex - 1;
+                let dropIndex = this.draggedRowIndex > this.droppedRowIndex ? this.droppedRowIndex : this.droppedRowIndex === 0 ? 0 : this.droppedRowIndex - 1;
                 let processedData = [...this.processedData];
+
                 ObjectUtils.reorderArray(processedData, this.draggedRowIndex, dropIndex);
 
                 this.$emit('row-reorder', {
@@ -4185,8 +4295,7 @@ var script = {
 
             if (this.dataKey) {
                 expanded = this.d_expandedRowKeys ? this.d_expandedRowKeys[ObjectUtils.resolveFieldData(rowData, this.dataKey)] !== undefined : false;
-            }
-            else {
+            } else {
                 expandedRowIndex = this.findIndex(rowData, this.expandedRows);
                 expanded = expandedRowIndex > -1;
             }
@@ -4195,11 +4304,11 @@ var script = {
                 if (expandedRowIndex == null) {
                     expandedRowIndex = this.findIndex(rowData, this.expandedRows);
                 }
+
                 _expandedRows.splice(expandedRowIndex, 1);
                 this.$emit('update:expandedRows', _expandedRows);
                 this.$emit('row-collapse', event);
-            }
-            else {
+            } else {
                 _expandedRows.push(rowData);
                 this.$emit('update:expandedRows', _expandedRows);
                 this.$emit('row-expand', event);
@@ -4212,28 +4321,29 @@ var script = {
             let _expandedRowGroups = this.expandedRowGroups ? [...this.expandedRowGroups] : [];
 
             if (this.isRowGroupExpanded(data)) {
-                _expandedRowGroups = _expandedRowGroups.filter(group => group !== groupFieldValue);
+                _expandedRowGroups = _expandedRowGroups.filter((group) => group !== groupFieldValue);
                 this.$emit('update:expandedRowGroups', _expandedRowGroups);
-                this.$emit('rowgroup-collapse', {originalEvent: event, data: groupFieldValue});
-            }
-            else {
+                this.$emit('rowgroup-collapse', { originalEvent: event, data: groupFieldValue });
+            } else {
                 _expandedRowGroups.push(groupFieldValue);
                 this.$emit('update:expandedRowGroups', _expandedRowGroups);
-                this.$emit('rowgroup-expand', {originalEvent: event, data: groupFieldValue});
+                this.$emit('rowgroup-expand', { originalEvent: event, data: groupFieldValue });
             }
         },
         isRowGroupExpanded(rowData) {
             if (this.expandableRowGroups && this.expandedRowGroups) {
                 let groupFieldValue = ObjectUtils.resolveFieldData(rowData, this.groupRowsBy);
+
                 return this.expandedRowGroups.indexOf(groupFieldValue) > -1;
             }
+
             return false;
         },
         isStateful() {
             return this.stateKey != null;
         },
         getStorage() {
-            switch(this.stateStorage) {
+            switch (this.stateStorage) {
                 case 'local':
                     return window.localStorage;
 
@@ -4298,8 +4408,9 @@ var script = {
             const storage = this.getStorage();
             const stateString = storage.getItem(this.stateKey);
             const dateFormat = /\d{4}-\d{2}-\d{2}T\d{2}:\d{2}:\d{2}.\d{3}Z/;
-            const reviver = function(key, value) {
-                if (typeof value === "string" && dateFormat.test(value)) {
+
+            const reviver = function (key, value) {
+                if (typeof value === 'string' && dateFormat.test(value)) {
                     return new Date(value);
                 }
 
@@ -4356,7 +4467,8 @@ var script = {
         saveColumnWidths(state) {
             let widths = [];
             let headers = DomHandler.find(this.$el, '.p-datatable-thead > tr > th');
-            headers.forEach(header => widths.push(DomHandler.getOuterWidth(header)));
+
+            headers.forEach((header) => widths.push(DomHandler.getOuterWidth(header)));
             state.columnWidths = widths.join(',');
 
             if (this.columnResizeMode === 'expand') {
@@ -4377,8 +4489,10 @@ var script = {
                     this.createStyleElement();
 
                     let innerHTML = '';
+
                     widths.forEach((width, index) => {
                         let style = this.scrollable ? `flex: 1 1 ${width}px !important` : `width: ${width}px !important`;
+
                         innerHTML += `
                             .p-datatable[${this.attributeSelector}] .p-datatable-thead > tr > th:nth-child(${index + 1}),
                             .p-datatable[${this.attributeSelector}] .p-datatable-tbody > tr > td:nth-child(${index + 1}),
@@ -4403,18 +4517,21 @@ var script = {
         },
         onRowEditInit(event) {
             let _editingRows = this.editingRows ? [...this.editingRows] : [];
+
             _editingRows.push(event.data);
             this.$emit('update:editingRows', _editingRows);
             this.$emit('row-edit-init', event);
         },
         onRowEditSave(event) {
             let _editingRows = [...this.editingRows];
+
             _editingRows.splice(this.findIndex(event.data, _editingRows), 1);
             this.$emit('update:editingRows', _editingRows);
             this.$emit('row-edit-save', event);
         },
         onRowEditCancel(event) {
             let _editingRows = [...this.editingRows];
+
             _editingRows.splice(this.findIndex(event.data, _editingRows), 1);
             this.$emit('update:editingRows', _editingRows);
             this.$emit('row-edit-cancel', event);
@@ -4427,10 +4544,10 @@ var script = {
             if (editing) {
                 !meta && (meta = editingMeta[index] = { data: { ...data }, fields: [] });
                 meta['fields'].push(field);
-            }
-            else if (meta) {
-                const fields = meta['fields'].filter(f => f !== field);
-                !fields.length ? (delete editingMeta[index]) : (meta['fields'] = fields);
+            } else if (meta) {
+                const fields = meta['fields'].filter((f) => f !== field);
+
+                !fields.length ? delete editingMeta[index] : (meta['fields'] = fields);
             }
 
             this.d_editingMeta = editingMeta;
@@ -4471,9 +4588,17 @@ var script = {
         },
         cloneFilters() {
             let cloned = {};
+
             if (this.filters) {
-                Object.entries(this.filters).forEach(([prop,value]) => {
-                    cloned[prop] = value.operator ? {operator: value.operator, constraints: value.constraints.map(constraint => {return {...constraint}})} : {...value};
+                Object.entries(this.filters).forEach(([prop, value]) => {
+                    cloned[prop] = value.operator
+                        ? {
+                              operator: value.operator,
+                              constraints: value.constraints.map((constraint) => {
+                                  return { ...constraint };
+                              })
+                          }
+                        : { ...value };
                 });
             }
 
@@ -4481,7 +4606,8 @@ var script = {
         },
         updateReorderableColumns() {
             let columnOrder = [];
-            this.columns.forEach(col => columnOrder.push(this.columnProp(col, 'columnKey')||this.columnProp(col, 'field')));
+
+            this.columns.forEach((col) => columnOrder.push(this.columnProp(col, 'columnKey') || this.columnProp(col, 'field')));
             this.d_columnOrder = columnOrder;
         },
         createStyleElement() {
@@ -4490,10 +4616,10 @@ var script = {
             document.head.appendChild(this.styleElement);
         },
         createResponsiveStyle() {
-			if (!this.responsiveStyleElement) {
-				this.responsiveStyleElement = document.createElement('style');
-				this.responsiveStyleElement.type = 'text/css';
-				document.head.appendChild(this.responsiveStyleElement);
+            if (!this.responsiveStyleElement) {
+                this.responsiveStyleElement = document.createElement('style');
+                this.responsiveStyleElement.type = 'text/css';
+                document.head.appendChild(this.responsiveStyleElement);
 
                 let innerHTML = `
 @media screen and (max-width: ${this.breakpoint}) {
@@ -4526,8 +4652,8 @@ var script = {
 `;
 
                 this.responsiveStyleElement.innerHTML = innerHTML;
-			}
-		},
+            }
+        },
         destroyResponsiveStyle() {
             if (this.responsiveStyleElement) {
                 document.head.removeChild(this.responsiveStyleElement);
@@ -4544,6 +4670,7 @@ var script = {
             if (!results) {
                 results = [];
             }
+
             if (children && children.length) {
                 children.forEach((child) => {
                     if (child.children instanceof Array) {
@@ -4553,6 +4680,7 @@ var script = {
                     }
                 });
             }
+
             return results;
         },
         dataToRender(data) {
@@ -4560,6 +4688,7 @@ var script = {
 
             if (_data && this.paginator) {
                 const first = this.lazy ? 0 : this.d_first;
+
                 return _data.slice(first, first + this.d_rows);
             }
 
@@ -4572,8 +4701,9 @@ var script = {
     computed: {
         containerClass() {
             return [
-                'p-datatable p-component', {
-                    'p-datatable-hoverable-rows': (this.rowHover || this.selectionMode),
+                'p-datatable p-component',
+                {
+                    'p-datatable-hoverable-rows': this.rowHover || this.selectionMode,
                     'p-datatable-auto-layout': this.autoLayout,
                     'p-datatable-resizable': this.resizableColumns,
                     'p-datatable-resizable-fit': this.resizableColumns && this.columnResizeMode === 'fit',
@@ -4581,7 +4711,7 @@ var script = {
                     'p-datatable-scrollable-vertical': this.scrollable && this.scrollDirection === 'vertical',
                     'p-datatable-scrollable-horizontal': this.scrollable && this.scrollDirection === 'horizontal',
                     'p-datatable-scrollable-both': this.scrollable && this.scrollDirection === 'both',
-                    'p-datatable-flex-scrollable': (this.scrollable && this.scrollHeight === 'flex'),
+                    'p-datatable-flex-scrollable': this.scrollable && this.scrollHeight === 'flex',
                     'p-datatable-responsive-stack': this.responsiveLayout === 'stack',
                     'p-datatable-responsive-scroll': this.responsiveLayout === 'scroll',
                     'p-datatable-striped': this.stripedRows,
@@ -4602,8 +4732,10 @@ var script = {
 
             if (this.reorderableColumns && this.d_columnOrder) {
                 let orderedColumns = [];
+
                 for (let columnKey of this.d_columnOrder) {
                     let column = this.findColumnByKey(cols, columnKey);
+
                     if (column && !this.columnProp(column, 'hidden')) {
                         orderedColumns.push(column);
                     }
@@ -4616,6 +4748,7 @@ var script = {
         },
         headerColumnGroup() {
             const children = this.getChildren();
+
             if (children) {
                 for (let child of children) {
                     if (child.type.name === 'ColumnGroup' && this.columnProp(child, 'type') === 'header') {
@@ -4628,6 +4761,7 @@ var script = {
         },
         footerColumnGroup() {
             const children = this.getChildren();
+
             if (children) {
                 for (let child of children) {
                     if (child.type.name === 'ColumnGroup' && this.columnProp(child, 'type') === 'footer') {
@@ -4651,10 +4785,8 @@ var script = {
                     }
 
                     if (this.sorted) {
-                        if(this.sortMode === 'single')
-                            data = this.sortSingle(data);
-                        else if(this.sortMode === 'multiple')
-                            data = this.sortMultiple(data);
+                        if (this.sortMode === 'single') data = this.sortSingle(data);
+                        else if (this.sortMode === 'multiple') data = this.sortMultiple(data);
                     }
                 }
             }
@@ -4664,15 +4796,16 @@ var script = {
         totalRecordsLength() {
             if (this.lazy) {
                 return this.totalRecords;
-            }
-            else {
+            } else {
                 const data = this.processedData;
+
                 return data ? data.length : 0;
             }
         },
         empty() {
             const data = this.processedData;
-            return (!data || data.length === 0);
+
+            return !data || data.length === 0;
         },
         paginatorTop() {
             return this.paginator && (this.paginatorPosition !== 'bottom' || this.paginatorPosition === 'both');
@@ -4689,28 +4822,28 @@ var script = {
         allRowsSelected() {
             if (this.selectAll !== null) {
                 return this.selectAll;
-            }
-            else {
+            } else {
                 const val = this.frozenValue ? [...this.frozenValue, ...this.processedData] : this.processedData;
-                return ObjectUtils.isNotEmpty(val) && this.selection && Array.isArray(this.selection) && val.every(v => this.selection.some(s => this.equals(s, v)));
+
+                return ObjectUtils.isNotEmpty(val) && this.selection && Array.isArray(this.selection) && val.every((v) => this.selection.some((s) => this.equals(s, v)));
             }
         },
         attributeSelector() {
             return UniqueComponentId();
         },
         groupRowSortField() {
-            return this.sortMode === 'single' ? this.sortField : (this.d_groupRowsSortMeta ? this.d_groupRowsSortMeta.field : null);
+            return this.sortMode === 'single' ? this.sortField : this.d_groupRowsSortMeta ? this.d_groupRowsSortMeta.field : null;
         },
         virtualScrollerDisabled() {
             return ObjectUtils.isEmpty(this.virtualScrollerOptions) || !this.scrollable;
         }
     },
     components: {
-        'DTPaginator': Paginator,
-        'DTTableHeader': script$7,
-        'DTTableBody': script$3,
-        'DTTableFooter': script$1,
-        'DTVirtualScroller': VirtualScroller
+        DTPaginator: Paginator,
+        DTTableHeader: script$7,
+        DTTableBody: script$3,
+        DTTableFooter: script$1,
+        DTVirtualScroller: VirtualScroller
     }
 };
 
@@ -4790,7 +4923,8 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
                 name: "start",
                 fn: withCtx(() => [
                   renderSlot(_ctx.$slots, "paginatorstart")
-                ])
+                ]),
+                key: "0"
               }
             : undefined,
           (_ctx.$slots.paginatorend)
@@ -4798,7 +4932,8 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
                 name: "end",
                 fn: withCtx(() => [
                   renderSlot(_ctx.$slots, "paginatorend")
-                ])
+                ]),
+                key: "1"
               }
             : undefined
         ]), 1032, ["rows", "first", "totalRecords", "pageLinkSize", "template", "rowsPerPageOptions", "currentPageReportTemplate", "alwaysShow"]))
@@ -4990,7 +5125,8 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
                 name: "start",
                 fn: withCtx(() => [
                   renderSlot(_ctx.$slots, "paginatorstart")
-                ])
+                ]),
+                key: "0"
               }
             : undefined,
           (_ctx.$slots.paginatorend)
@@ -4998,7 +5134,8 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
                 name: "end",
                 fn: withCtx(() => [
                   renderSlot(_ctx.$slots, "paginatorend")
-                ])
+                ]),
+                key: "1"
               }
             : undefined
         ]), 1032, ["rows", "first", "totalRecords", "pageLinkSize", "template", "rowsPerPageOptions", "currentPageReportTemplate", "alwaysShow"]))
@@ -5045,7 +5182,7 @@ function styleInject(css, ref) {
   }
 }
 
-var css_248z = "\n.p-datatable {\n    position: relative;\n}\n.p-datatable table {\n    border-collapse: collapse;\n    min-width: 100%;\n    table-layout: fixed;\n}\n.p-datatable .p-sortable-column {\n    cursor: pointer;\n    -webkit-user-select: none;\n       -moz-user-select: none;\n        -ms-user-select: none;\n            user-select: none;\n}\n.p-datatable .p-sortable-column .p-column-title,\n.p-datatable .p-sortable-column .p-sortable-column-icon,\n.p-datatable .p-sortable-column .p-sortable-column-badge {\n    vertical-align: middle;\n}\n.p-datatable .p-sortable-column .p-sortable-column-badge {\n    display: -webkit-inline-box;\n    display: -ms-inline-flexbox;\n    display: inline-flex;\n    -webkit-box-align: center;\n        -ms-flex-align: center;\n            align-items: center;\n    -webkit-box-pack: center;\n        -ms-flex-pack: center;\n            justify-content: center;\n}\n.p-datatable-responsive-scroll > .p-datatable-wrapper {\n    overflow-x: auto;\n}\n.p-datatable-responsive-scroll > .p-datatable-wrapper > table,\n.p-datatable-auto-layout > .p-datatable-wrapper > table {\n    table-layout: auto;\n}\n.p-datatable-hoverable-rows .p-selectable-row {\n    cursor: pointer;\n}\n\n/* Scrollable */\n.p-datatable-scrollable .p-datatable-wrapper {\n    position: relative;\n    overflow: auto;\n}\n.p-datatable-scrollable .p-datatable-thead,\n.p-datatable-scrollable .p-datatable-tbody,\n.p-datatable-scrollable .p-datatable-tfoot {\n    display: block;\n}\n.p-datatable-scrollable .p-datatable-thead > tr,\n.p-datatable-scrollable .p-datatable-tbody > tr,\n.p-datatable-scrollable .p-datatable-tfoot > tr {\n    display: -webkit-box;\n    display: -ms-flexbox;\n    display: flex;\n    -ms-flex-wrap: nowrap;\n        flex-wrap: nowrap;\n    width: 100%;\n}\n.p-datatable-scrollable .p-datatable-thead > tr > th,\n.p-datatable-scrollable .p-datatable-tbody > tr > td,\n.p-datatable-scrollable .p-datatable-tfoot > tr > td {\n    display: -webkit-box;\n    display: -ms-flexbox;\n    display: flex;\n    -webkit-box-flex: 1;\n        -ms-flex: 1 1 0px;\n            flex: 1 1 0;\n    -webkit-box-align: center;\n        -ms-flex-align: center;\n            align-items: center;\n}\n.p-datatable-scrollable .p-datatable-thead {\n    position: sticky;\n    top: 0;\n    z-index: 1;\n}\n.p-datatable-scrollable .p-datatable-frozen-tbody {\n    position: sticky;\n    z-index: 1;\n}\n.p-datatable-scrollable .p-datatable-tfoot {\n    position: sticky;\n    bottom: 0;\n    z-index: 1;\n}\n.p-datatable-scrollable .p-frozen-column {\n    position: sticky;\n    background: inherit;\n}\n.p-datatable-scrollable th.p-frozen-column {\n    z-index: 1;\n}\n.p-datatable-scrollable-both .p-datatable-thead > tr > th,\n.p-datatable-scrollable-both .p-datatable-tbody > tr > td,\n.p-datatable-scrollable-both .p-datatable-tfoot > tr > td,\n.p-datatable-scrollable-horizontal .p-datatable-thead > tr > th\n.p-datatable-scrollable-horizontal .p-datatable-tbody > tr > td,\n.p-datatable-scrollable-horizontal .p-datatable-tfoot > tr > td {\n    -webkit-box-flex: 1;\n        -ms-flex: 1 0 auto;\n            flex: 1 0 auto;\n}\n.p-datatable-flex-scrollable {\n    display: -webkit-box;\n    display: -ms-flexbox;\n    display: flex;\n    -webkit-box-orient: vertical;\n    -webkit-box-direction: normal;\n        -ms-flex-direction: column;\n            flex-direction: column;\n    height: 100%;\n}\n.p-datatable-flex-scrollable .p-datatable-wrapper {\n    display: -webkit-box;\n    display: -ms-flexbox;\n    display: flex;\n    -webkit-box-orient: vertical;\n    -webkit-box-direction: normal;\n        -ms-flex-direction: column;\n            flex-direction: column;\n    -webkit-box-flex: 1;\n        -ms-flex: 1;\n            flex: 1;\n    height: 100%;\n}\n.p-datatable-scrollable .p-rowgroup-header {\n    position: sticky;\n    z-index: 1;\n}\n.p-datatable-scrollable.p-datatable-grouped-header .p-datatable-thead,\n.p-datatable-scrollable.p-datatable-grouped-footer .p-datatable-tfoot {\n    display: table;\n    border-collapse: collapse;\n    width: 100%;\n    table-layout: fixed;\n}\n.p-datatable-scrollable.p-datatable-grouped-header .p-datatable-thead > tr,\n.p-datatable-scrollable.p-datatable-grouped-footer .p-datatable-tfoot > tr {\n    display: table-row;\n}\n.p-datatable-scrollable.p-datatable-grouped-header .p-datatable-thead > tr > th,\n.p-datatable-scrollable.p-datatable-grouped-footer .p-datatable-tfoot > tr > td {\n    display: table-cell;\n}\n.p-datatable-scrollable .p-virtualscroller > .p-datatable-table {\n    display: inline-block; /* For Safari */\n}\n\n/* Resizable */\n.p-datatable-resizable > .p-datatable-wrapper {\n    overflow-x: auto;\n}\n.p-datatable-resizable .p-datatable-thead > tr > th,\n.p-datatable-resizable .p-datatable-tfoot > tr > td,\n.p-datatable-resizable .p-datatable-tbody > tr > td {\n    overflow: hidden;\n    white-space: nowrap;\n}\n.p-datatable-resizable .p-resizable-column:not(.p-frozen-column) {\n    background-clip: padding-box;\n    position: relative;\n}\n.p-datatable-resizable-fit .p-resizable-column:last-child .p-column-resizer {\n    display: none;\n}\n.p-datatable .p-column-resizer {\n    display: block;\n    position: absolute !important;\n    top: 0;\n    right: 0;\n    margin: 0;\n    width: .5rem;\n    height: 100%;\n    padding: 0px;\n    cursor:col-resize;\n    border: 1px solid transparent;\n}\n.p-datatable .p-column-header-content {\n    display: -webkit-box;\n    display: -ms-flexbox;\n    display: flex;\n    -webkit-box-align: center;\n        -ms-flex-align: center;\n            align-items: center;\n}\n.p-datatable .p-column-resizer-helper {\n    width: 1px;\n    position: absolute;\n    z-index: 10;\n    display: none;\n}\n.p-datatable .p-row-editor-init,\n.p-datatable .p-row-editor-save,\n.p-datatable .p-row-editor-cancel {\n    display: -webkit-inline-box;\n    display: -ms-inline-flexbox;\n    display: inline-flex;\n    -webkit-box-align: center;\n        -ms-flex-align: center;\n            align-items: center;\n    -webkit-box-pack: center;\n        -ms-flex-pack: center;\n            justify-content: center;\n    overflow: hidden;\n    position: relative;\n}\n\n/* Expand */\n.p-datatable .p-row-toggler {\n    display: -webkit-inline-box;\n    display: -ms-inline-flexbox;\n    display: inline-flex;\n    -webkit-box-align: center;\n        -ms-flex-align: center;\n            align-items: center;\n    -webkit-box-pack: center;\n        -ms-flex-pack: center;\n            justify-content: center;\n    overflow: hidden;\n    position: relative;\n}\n\n/* Reorder */\n.p-datatable-reorder-indicator-up,\n.p-datatable-reorder-indicator-down {\n    position: absolute;\n    display: none;\n}\n.p-reorderable-column,\n.p-datatable-reorderablerow-handle {\n    cursor: move;\n}\n\n/* Loader */\n.p-datatable .p-datatable-loading-overlay {\n    position: absolute;\n    display: -webkit-box;\n    display: -ms-flexbox;\n    display: flex;\n    -webkit-box-align: center;\n        -ms-flex-align: center;\n            align-items: center;\n    -webkit-box-pack: center;\n        -ms-flex-pack: center;\n            justify-content: center;\n    z-index: 2;\n}\n\n/* Filter */\n.p-column-filter-row {\n    display: -webkit-box;\n    display: -ms-flexbox;\n    display: flex;\n    -webkit-box-align: center;\n        -ms-flex-align: center;\n            align-items: center;\n    width: 100%;\n}\n.p-column-filter-menu {\n    display: -webkit-inline-box;\n    display: -ms-inline-flexbox;\n    display: inline-flex;\n    margin-left: auto;\n}\n.p-column-filter-row .p-column-filter-element {\n    -webkit-box-flex: 1;\n        -ms-flex: 1 1 auto;\n            flex: 1 1 auto;\n    width: 1%;\n}\n.p-column-filter-menu-button,\n.p-column-filter-clear-button {\n    display: -webkit-inline-box;\n    display: -ms-inline-flexbox;\n    display: inline-flex;\n    -webkit-box-pack: center;\n        -ms-flex-pack: center;\n            justify-content: center;\n    -webkit-box-align: center;\n        -ms-flex-align: center;\n            align-items: center;\n    cursor: pointer;\n    text-decoration: none;\n    overflow: hidden;\n    position: relative;\n}\n.p-column-filter-overlay {\n    position: absolute;\n    top: 0;\n    left: 0;\n}\n.p-column-filter-row-items {\n    margin: 0;\n    padding: 0;\n    list-style: none;\n}\n.p-column-filter-row-item {\n    cursor: pointer;\n}\n.p-column-filter-add-button,\n.p-column-filter-remove-button {\n    -webkit-box-pack: center;\n        -ms-flex-pack: center;\n            justify-content: center;\n}\n.p-column-filter-add-button .p-button-label,\n.p-column-filter-remove-button .p-button-label {\n    -webkit-box-flex: 0;\n        -ms-flex-positive: 0;\n            flex-grow: 0;\n}\n.p-column-filter-buttonbar {\n    display: -webkit-box;\n    display: -ms-flexbox;\n    display: flex;\n    -webkit-box-align: center;\n        -ms-flex-align: center;\n            align-items: center;\n    -webkit-box-pack: justify;\n        -ms-flex-pack: justify;\n            justify-content: space-between;\n}\n.p-column-filter-buttonbar .p-button:not(.p-button-icon-only) {\n    width: auto;\n}\n\n/* Responsive */\n.p-datatable .p-datatable-tbody > tr > td > .p-column-title {\n    display: none;\n}\n\n/* VirtualScroller */\n.p-datatable .p-virtualscroller-loading {\n    -webkit-transform: none !important;\n            transform: none !important;\n    min-height: 0;\n    position: sticky;\n    top: 0;\n    left: 0;\n}\n";
+var css_248z = "\n.p-datatable {\n    position: relative;\n}\n.p-datatable table {\n    border-collapse: collapse;\n    min-width: 100%;\n    table-layout: fixed;\n}\n.p-datatable .p-sortable-column {\n    cursor: pointer;\n    -webkit-user-select: none;\n       -moz-user-select: none;\n        -ms-user-select: none;\n            user-select: none;\n}\n.p-datatable .p-sortable-column .p-column-title,\n.p-datatable .p-sortable-column .p-sortable-column-icon,\n.p-datatable .p-sortable-column .p-sortable-column-badge {\n    vertical-align: middle;\n}\n.p-datatable .p-sortable-column .p-sortable-column-badge {\n    display: -webkit-inline-box;\n    display: -ms-inline-flexbox;\n    display: inline-flex;\n    -webkit-box-align: center;\n        -ms-flex-align: center;\n            align-items: center;\n    -webkit-box-pack: center;\n        -ms-flex-pack: center;\n            justify-content: center;\n}\n.p-datatable-responsive-scroll > .p-datatable-wrapper {\n    overflow-x: auto;\n}\n.p-datatable-responsive-scroll > .p-datatable-wrapper > table,\n.p-datatable-auto-layout > .p-datatable-wrapper > table {\n    table-layout: auto;\n}\n.p-datatable-hoverable-rows .p-selectable-row {\n    cursor: pointer;\n}\n\n/* Scrollable */\n.p-datatable-scrollable .p-datatable-wrapper {\n    position: relative;\n    overflow: auto;\n}\n.p-datatable-scrollable .p-datatable-thead,\n.p-datatable-scrollable .p-datatable-tbody,\n.p-datatable-scrollable .p-datatable-tfoot {\n    display: block;\n}\n.p-datatable-scrollable .p-datatable-thead > tr,\n.p-datatable-scrollable .p-datatable-tbody > tr,\n.p-datatable-scrollable .p-datatable-tfoot > tr {\n    display: -webkit-box;\n    display: -ms-flexbox;\n    display: flex;\n    -ms-flex-wrap: nowrap;\n        flex-wrap: nowrap;\n    width: 100%;\n}\n.p-datatable-scrollable .p-datatable-thead > tr > th,\n.p-datatable-scrollable .p-datatable-tbody > tr > td,\n.p-datatable-scrollable .p-datatable-tfoot > tr > td {\n    display: -webkit-box;\n    display: -ms-flexbox;\n    display: flex;\n    -webkit-box-flex: 1;\n        -ms-flex: 1 1 0px;\n            flex: 1 1 0;\n    -webkit-box-align: center;\n        -ms-flex-align: center;\n            align-items: center;\n}\n.p-datatable-scrollable .p-datatable-thead {\n    position: sticky;\n    top: 0;\n    z-index: 1;\n}\n.p-datatable-scrollable .p-datatable-frozen-tbody {\n    position: sticky;\n    z-index: 1;\n}\n.p-datatable-scrollable .p-datatable-tfoot {\n    position: sticky;\n    bottom: 0;\n    z-index: 1;\n}\n.p-datatable-scrollable .p-frozen-column {\n    position: sticky;\n    background: inherit;\n}\n.p-datatable-scrollable th.p-frozen-column {\n    z-index: 1;\n}\n.p-datatable-scrollable-both .p-datatable-thead > tr > th,\n.p-datatable-scrollable-both .p-datatable-tbody > tr > td,\n.p-datatable-scrollable-both .p-datatable-tfoot > tr > td,\n.p-datatable-scrollable-horizontal .p-datatable-thead > tr > th .p-datatable-scrollable-horizontal .p-datatable-tbody > tr > td,\n.p-datatable-scrollable-horizontal .p-datatable-tfoot > tr > td {\n    -webkit-box-flex: 1;\n        -ms-flex: 1 0 auto;\n            flex: 1 0 auto;\n}\n.p-datatable-flex-scrollable {\n    display: -webkit-box;\n    display: -ms-flexbox;\n    display: flex;\n    -webkit-box-orient: vertical;\n    -webkit-box-direction: normal;\n        -ms-flex-direction: column;\n            flex-direction: column;\n    height: 100%;\n}\n.p-datatable-flex-scrollable .p-datatable-wrapper {\n    display: -webkit-box;\n    display: -ms-flexbox;\n    display: flex;\n    -webkit-box-orient: vertical;\n    -webkit-box-direction: normal;\n        -ms-flex-direction: column;\n            flex-direction: column;\n    -webkit-box-flex: 1;\n        -ms-flex: 1;\n            flex: 1;\n    height: 100%;\n}\n.p-datatable-scrollable .p-rowgroup-header {\n    position: sticky;\n    z-index: 1;\n}\n.p-datatable-scrollable.p-datatable-grouped-header .p-datatable-thead,\n.p-datatable-scrollable.p-datatable-grouped-footer .p-datatable-tfoot {\n    display: table;\n    border-collapse: collapse;\n    width: 100%;\n    table-layout: fixed;\n}\n.p-datatable-scrollable.p-datatable-grouped-header .p-datatable-thead > tr,\n.p-datatable-scrollable.p-datatable-grouped-footer .p-datatable-tfoot > tr {\n    display: table-row;\n}\n.p-datatable-scrollable.p-datatable-grouped-header .p-datatable-thead > tr > th,\n.p-datatable-scrollable.p-datatable-grouped-footer .p-datatable-tfoot > tr > td {\n    display: table-cell;\n}\n.p-datatable-scrollable .p-virtualscroller > .p-datatable-table {\n    display: inline-block; /* For Safari */\n}\n\n/* Resizable */\n.p-datatable-resizable > .p-datatable-wrapper {\n    overflow-x: auto;\n}\n.p-datatable-resizable .p-datatable-thead > tr > th,\n.p-datatable-resizable .p-datatable-tfoot > tr > td,\n.p-datatable-resizable .p-datatable-tbody > tr > td {\n    overflow: hidden;\n    white-space: nowrap;\n}\n.p-datatable-resizable .p-resizable-column:not(.p-frozen-column) {\n    background-clip: padding-box;\n    position: relative;\n}\n.p-datatable-resizable-fit .p-resizable-column:last-child .p-column-resizer {\n    display: none;\n}\n.p-datatable .p-column-resizer {\n    display: block;\n    position: absolute !important;\n    top: 0;\n    right: 0;\n    margin: 0;\n    width: 0.5rem;\n    height: 100%;\n    padding: 0px;\n    cursor: col-resize;\n    border: 1px solid transparent;\n}\n.p-datatable .p-column-header-content {\n    display: -webkit-box;\n    display: -ms-flexbox;\n    display: flex;\n    -webkit-box-align: center;\n        -ms-flex-align: center;\n            align-items: center;\n}\n.p-datatable .p-column-resizer-helper {\n    width: 1px;\n    position: absolute;\n    z-index: 10;\n    display: none;\n}\n.p-datatable .p-row-editor-init,\n.p-datatable .p-row-editor-save,\n.p-datatable .p-row-editor-cancel {\n    display: -webkit-inline-box;\n    display: -ms-inline-flexbox;\n    display: inline-flex;\n    -webkit-box-align: center;\n        -ms-flex-align: center;\n            align-items: center;\n    -webkit-box-pack: center;\n        -ms-flex-pack: center;\n            justify-content: center;\n    overflow: hidden;\n    position: relative;\n}\n\n/* Expand */\n.p-datatable .p-row-toggler {\n    display: -webkit-inline-box;\n    display: -ms-inline-flexbox;\n    display: inline-flex;\n    -webkit-box-align: center;\n        -ms-flex-align: center;\n            align-items: center;\n    -webkit-box-pack: center;\n        -ms-flex-pack: center;\n            justify-content: center;\n    overflow: hidden;\n    position: relative;\n}\n\n/* Reorder */\n.p-datatable-reorder-indicator-up,\n.p-datatable-reorder-indicator-down {\n    position: absolute;\n    display: none;\n}\n.p-reorderable-column,\n.p-datatable-reorderablerow-handle {\n    cursor: move;\n}\n\n/* Loader */\n.p-datatable .p-datatable-loading-overlay {\n    position: absolute;\n    display: -webkit-box;\n    display: -ms-flexbox;\n    display: flex;\n    -webkit-box-align: center;\n        -ms-flex-align: center;\n            align-items: center;\n    -webkit-box-pack: center;\n        -ms-flex-pack: center;\n            justify-content: center;\n    z-index: 2;\n}\n\n/* Filter */\n.p-column-filter-row {\n    display: -webkit-box;\n    display: -ms-flexbox;\n    display: flex;\n    -webkit-box-align: center;\n        -ms-flex-align: center;\n            align-items: center;\n    width: 100%;\n}\n.p-column-filter-menu {\n    display: -webkit-inline-box;\n    display: -ms-inline-flexbox;\n    display: inline-flex;\n    margin-left: auto;\n}\n.p-column-filter-row .p-column-filter-element {\n    -webkit-box-flex: 1;\n        -ms-flex: 1 1 auto;\n            flex: 1 1 auto;\n    width: 1%;\n}\n.p-column-filter-menu-button,\n.p-column-filter-clear-button {\n    display: -webkit-inline-box;\n    display: -ms-inline-flexbox;\n    display: inline-flex;\n    -webkit-box-pack: center;\n        -ms-flex-pack: center;\n            justify-content: center;\n    -webkit-box-align: center;\n        -ms-flex-align: center;\n            align-items: center;\n    cursor: pointer;\n    text-decoration: none;\n    overflow: hidden;\n    position: relative;\n}\n.p-column-filter-overlay {\n    position: absolute;\n    top: 0;\n    left: 0;\n}\n.p-column-filter-row-items {\n    margin: 0;\n    padding: 0;\n    list-style: none;\n}\n.p-column-filter-row-item {\n    cursor: pointer;\n}\n.p-column-filter-add-button,\n.p-column-filter-remove-button {\n    -webkit-box-pack: center;\n        -ms-flex-pack: center;\n            justify-content: center;\n}\n.p-column-filter-add-button .p-button-label,\n.p-column-filter-remove-button .p-button-label {\n    -webkit-box-flex: 0;\n        -ms-flex-positive: 0;\n            flex-grow: 0;\n}\n.p-column-filter-buttonbar {\n    display: -webkit-box;\n    display: -ms-flexbox;\n    display: flex;\n    -webkit-box-align: center;\n        -ms-flex-align: center;\n            align-items: center;\n    -webkit-box-pack: justify;\n        -ms-flex-pack: justify;\n            justify-content: space-between;\n}\n.p-column-filter-buttonbar .p-button:not(.p-button-icon-only) {\n    width: auto;\n}\n\n/* Responsive */\n.p-datatable .p-datatable-tbody > tr > td > .p-column-title {\n    display: none;\n}\n\n/* VirtualScroller */\n.p-datatable .p-virtualscroller-loading {\n    -webkit-transform: none !important;\n            transform: none !important;\n    min-height: 0;\n    position: sticky;\n    top: 0;\n    left: 0;\n}\n";
 styleInject(css_248z);
 
 script.render = render;