primevue
Version:
PrimeVue is an open source UI library for Vue featuring a rich set of 80+ components, a theme designer, various theme alternatives such as Material, Bootstrap, Tailwind, premium templates and professional support. In addition, it integrates with PrimeBloc
1,170 lines (1,157 loc) • 303 kB
JavaScript
this.primevue = this.primevue || {};
this.primevue.datatable = (function (api, ArrowDownIcon, ArrowUpIcon, SpinnerIcon, Paginator, utils, VirtualScroller, BaseComponent, DataTableStyle, ChevronDownIcon, ChevronRightIcon, vue, BarsIcon, CheckIcon, PencilIcon, TimesIcon, OverlayEventBus, Ripple, Checkbox, RadioButton, Button, Dropdown, FocusTrap, FilterIcon, FilterSlashIcon, PlusIcon, TrashIcon, Portal, SortAltIcon, SortAmountDownIcon, SortAmountUpAltIcon) {
'use strict';
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
var ArrowDownIcon__default = /*#__PURE__*/_interopDefaultLegacy(ArrowDownIcon);
var ArrowUpIcon__default = /*#__PURE__*/_interopDefaultLegacy(ArrowUpIcon);
var SpinnerIcon__default = /*#__PURE__*/_interopDefaultLegacy(SpinnerIcon);
var Paginator__default = /*#__PURE__*/_interopDefaultLegacy(Paginator);
var VirtualScroller__default = /*#__PURE__*/_interopDefaultLegacy(VirtualScroller);
var BaseComponent__default = /*#__PURE__*/_interopDefaultLegacy(BaseComponent);
var DataTableStyle__default = /*#__PURE__*/_interopDefaultLegacy(DataTableStyle);
var ChevronDownIcon__default = /*#__PURE__*/_interopDefaultLegacy(ChevronDownIcon);
var ChevronRightIcon__default = /*#__PURE__*/_interopDefaultLegacy(ChevronRightIcon);
var BarsIcon__default = /*#__PURE__*/_interopDefaultLegacy(BarsIcon);
var CheckIcon__default = /*#__PURE__*/_interopDefaultLegacy(CheckIcon);
var PencilIcon__default = /*#__PURE__*/_interopDefaultLegacy(PencilIcon);
var TimesIcon__default = /*#__PURE__*/_interopDefaultLegacy(TimesIcon);
var OverlayEventBus__default = /*#__PURE__*/_interopDefaultLegacy(OverlayEventBus);
var Ripple__default = /*#__PURE__*/_interopDefaultLegacy(Ripple);
var Checkbox__default = /*#__PURE__*/_interopDefaultLegacy(Checkbox);
var RadioButton__default = /*#__PURE__*/_interopDefaultLegacy(RadioButton);
var Button__default = /*#__PURE__*/_interopDefaultLegacy(Button);
var Dropdown__default = /*#__PURE__*/_interopDefaultLegacy(Dropdown);
var FocusTrap__default = /*#__PURE__*/_interopDefaultLegacy(FocusTrap);
var FilterIcon__default = /*#__PURE__*/_interopDefaultLegacy(FilterIcon);
var FilterSlashIcon__default = /*#__PURE__*/_interopDefaultLegacy(FilterSlashIcon);
var PlusIcon__default = /*#__PURE__*/_interopDefaultLegacy(PlusIcon);
var TrashIcon__default = /*#__PURE__*/_interopDefaultLegacy(TrashIcon);
var Portal__default = /*#__PURE__*/_interopDefaultLegacy(Portal);
var SortAltIcon__default = /*#__PURE__*/_interopDefaultLegacy(SortAltIcon);
var SortAmountDownIcon__default = /*#__PURE__*/_interopDefaultLegacy(SortAmountDownIcon);
var SortAmountUpAltIcon__default = /*#__PURE__*/_interopDefaultLegacy(SortAmountUpAltIcon);
var script$c = {
name: 'BaseDataTable',
"extends": BaseComponent__default["default"],
props: {
value: {
type: Array,
"default": null
},
dataKey: {
type: [String, Function],
"default": null
},
rows: {
type: Number,
"default": 0
},
first: {
type: Number,
"default": 0
},
totalRecords: {
type: Number,
"default": 0
},
paginator: {
type: Boolean,
"default": false
},
paginatorPosition: {
type: String,
"default": 'bottom'
},
alwaysShowPaginator: {
type: Boolean,
"default": true
},
paginatorTemplate: {
type: [Object, String],
"default": 'FirstPageLink PrevPageLink PageLinks NextPageLink LastPageLink RowsPerPageDropdown'
},
pageLinkSize: {
type: Number,
"default": 5
},
rowsPerPageOptions: {
type: Array,
"default": null
},
currentPageReportTemplate: {
type: String,
"default": '({currentPage} of {totalPages})'
},
lazy: {
type: Boolean,
"default": false
},
loading: {
type: Boolean,
"default": false
},
loadingIcon: {
type: String,
"default": undefined
},
sortField: {
type: [String, Function],
"default": null
},
sortOrder: {
type: Number,
"default": null
},
defaultSortOrder: {
type: Number,
"default": 1
},
nullSortOrder: {
type: Number,
"default": 1
},
multiSortMeta: {
type: Array,
"default": null
},
sortMode: {
type: String,
"default": 'single'
},
removableSort: {
type: Boolean,
"default": false
},
filters: {
type: Object,
"default": null
},
filterDisplay: {
type: String,
"default": null
},
globalFilterFields: {
type: Array,
"default": null
},
filterLocale: {
type: String,
"default": undefined
},
selection: {
type: [Array, Object],
"default": null
},
selectionMode: {
type: String,
"default": null
},
compareSelectionBy: {
type: String,
"default": 'deepEquals'
},
metaKeySelection: {
type: Boolean,
"default": false
},
contextMenu: {
type: Boolean,
"default": false
},
contextMenuSelection: {
type: Object,
"default": null
},
selectAll: {
type: Boolean,
"default": null
},
rowHover: {
type: Boolean,
"default": false
},
csvSeparator: {
type: String,
"default": ','
},
exportFilename: {
type: String,
"default": 'download'
},
exportFunction: {
type: Function,
"default": null
},
resizableColumns: {
type: Boolean,
"default": false
},
columnResizeMode: {
type: String,
"default": 'fit'
},
reorderableColumns: {
type: Boolean,
"default": false
},
expandedRows: {
type: [Array, Object],
"default": null
},
expandedRowIcon: {
type: String,
"default": undefined
},
collapsedRowIcon: {
type: String,
"default": undefined
},
rowGroupMode: {
type: String,
"default": null
},
groupRowsBy: {
type: [Array, String, Function],
"default": null
},
expandableRowGroups: {
type: Boolean,
"default": false
},
expandedRowGroups: {
type: Array,
"default": null
},
stateStorage: {
type: String,
"default": 'session'
},
stateKey: {
type: String,
"default": null
},
editMode: {
type: String,
"default": null
},
editingRows: {
type: Array,
"default": null
},
rowClass: {
type: Function,
"default": null
},
rowStyle: {
type: Function,
"default": null
},
scrollable: {
type: Boolean,
"default": false
},
virtualScrollerOptions: {
type: Object,
"default": null
},
scrollHeight: {
type: String,
"default": null
},
frozenValue: {
type: Array,
"default": null
},
responsiveLayout: {
type: String,
"default": 'scroll'
},
breakpoint: {
type: String,
"default": '960px'
},
showGridlines: {
type: Boolean,
"default": false
},
stripedRows: {
type: Boolean,
"default": false
},
highlightOnSelect: {
type: Boolean,
"default": false
},
size: {
type: String,
"default": null
},
tableStyle: {
type: null,
"default": null
},
tableClass: {
type: [String, Object],
"default": null
},
tableProps: {
type: Object,
"default": null
},
filterInputProps: {
type: null,
"default": null
}
},
style: DataTableStyle__default["default"],
provide: function provide() {
return {
$parentInstance: this
};
}
};
var script$b = {
name: 'RowCheckbox',
hostName: 'DataTable',
"extends": BaseComponent__default["default"],
emits: ['change'],
props: {
value: null,
checked: null,
column: null,
rowCheckboxIconTemplate: {
type: Function,
"default": null
},
index: {
type: Number,
"default": null
}
},
methods: {
getColumnPT: function getColumnPT(key) {
var columnMetaData = {
props: this.column.props,
parent: {
instance: this,
props: this.$props,
state: this.$data
},
context: {
index: this.index,
checked: this.checked,
disabled: this.$attrs.disabled
}
};
return vue.mergeProps(this.ptm("column.".concat(key), {
column: columnMetaData
}), this.ptm("column.".concat(key), columnMetaData), this.ptmo(this.getColumnProp(), key, columnMetaData));
},
getColumnProp: function getColumnProp() {
return this.column.props && this.column.props.pt ? this.column.props.pt : undefined; //@todo:
},
onChange: function onChange(event) {
if (!this.$attrs.disabled) {
this.$emit('change', {
originalEvent: event,
data: this.value
});
}
}
},
computed: {
checkboxAriaLabel: function checkboxAriaLabel() {
return this.$primevue.config.locale.aria ? this.checked ? this.$primevue.config.locale.aria.selectRow : this.$primevue.config.locale.aria.unselectRow : undefined;
}
},
components: {
CheckIcon: CheckIcon__default["default"],
Checkbox: Checkbox__default["default"]
}
};
function render$b(_ctx, _cache, $props, $setup, $data, $options) {
var _component_CheckIcon = vue.resolveComponent("CheckIcon");
var _component_Checkbox = vue.resolveComponent("Checkbox");
return vue.openBlock(), vue.createBlock(_component_Checkbox, {
modelValue: $props.checked,
binary: true,
disabled: _ctx.$attrs.disabled,
"aria-label": $options.checkboxAriaLabel,
onChange: $options.onChange,
unstyled: _ctx.unstyled,
pt: $options.getColumnPT('rowCheckbox')
}, {
icon: vue.withCtx(function (slotProps) {
return [$props.rowCheckboxIconTemplate ? (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent($props.rowCheckboxIconTemplate), {
key: 0,
checked: slotProps.checked,
"class": vue.normalizeClass(slotProps["class"])
}, null, 8, ["checked", "class"])) : !$props.rowCheckboxIconTemplate && slotProps.checked ? (vue.openBlock(), vue.createBlock(_component_CheckIcon, vue.mergeProps({
key: 1,
"class": slotProps["class"]
}, $options.getColumnPT('rowCheckbox.icon')), null, 16, ["class"])) : vue.createCommentVNode("", true)];
}),
_: 1
}, 8, ["modelValue", "disabled", "aria-label", "onChange", "unstyled", "pt"]);
}
script$b.render = render$b;
var script$a = {
name: 'RowRadioButton',
hostName: 'DataTable',
"extends": BaseComponent__default["default"],
emits: ['change'],
props: {
value: null,
checked: null,
name: null,
column: null,
index: {
type: Number,
"default": null
}
},
methods: {
getColumnPT: function getColumnPT(key) {
var columnMetaData = {
props: this.column.props,
parent: {
instance: this,
props: this.$props,
state: this.$data
},
context: {
index: this.index,
checked: this.checked,
disabled: this.$attrs.disabled
}
};
return vue.mergeProps(this.ptm("column.".concat(key), {
column: columnMetaData
}), this.ptm("column.".concat(key), columnMetaData), this.ptmo(this.getColumnProp(), key, columnMetaData));
},
getColumnProp: function getColumnProp() {
return this.column.props && this.column.props.pt ? this.column.props.pt : undefined; //@todo:
},
onChange: function onChange(event) {
if (!this.$attrs.disabled) {
this.$emit('change', {
originalEvent: event,
data: this.value
});
}
}
},
components: {
RadioButton: RadioButton__default["default"]
}
};
function render$a(_ctx, _cache, $props, $setup, $data, $options) {
var _component_RadioButton = vue.resolveComponent("RadioButton");
return vue.openBlock(), vue.createBlock(_component_RadioButton, {
modelValue: $props.checked,
binary: true,
disabled: _ctx.$attrs.disabled,
name: $props.name,
onChange: $options.onChange,
unstyled: _ctx.unstyled,
pt: $options.getColumnPT('rowRadiobutton')
}, null, 8, ["modelValue", "disabled", "name", "onChange", "unstyled", "pt"]);
}
script$a.render = render$a;
var script$9 = {
name: 'BodyCell',
hostName: 'DataTable',
"extends": BaseComponent__default["default"],
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,
"default": null
},
column: {
type: Object,
"default": null
},
frozenRow: {
type: Boolean,
"default": false
},
rowIndex: {
type: Number,
"default": null
},
index: {
type: Number,
"default": null
},
isRowExpanded: {
type: Boolean,
"default": false
},
selected: {
type: Boolean,
"default": false
},
editing: {
type: Boolean,
"default": false
},
editingMeta: {
type: Object,
"default": null
},
editMode: {
type: String,
"default": null
},
responsiveLayout: {
type: String,
"default": 'stack'
},
virtualScrollerContentProps: {
type: Object,
"default": null
},
ariaControls: {
type: String,
"default": null
},
name: {
type: String,
"default": null
},
expandedRowIcon: {
type: String,
"default": null
},
collapsedRowIcon: {
type: String,
"default": null
}
},
documentEditListener: null,
selfClick: false,
overlayEventListener: null,
data: function data() {
return {
d_editing: this.editing,
styleObject: {}
};
},
watch: {
editing: function editing(newValue) {
this.d_editing = newValue;
},
'$data.d_editing': function $dataD_editing(newValue) {
this.$emit('editing-meta-change', {
data: this.rowData,
field: this.field || "field_".concat(this.index),
index: this.rowIndex,
editing: newValue
});
}
},
mounted: function mounted() {
if (this.columnProp('frozen')) {
this.updateStickyPosition();
}
},
updated: function updated() {
var _this = this;
if (this.columnProp('frozen')) {
this.updateStickyPosition();
}
if (this.d_editing && (this.editMode === 'cell' || this.editMode === 'row' && this.columnProp('rowEditor'))) {
setTimeout(function () {
var focusableEl = utils.DomHandler.getFirstFocusableElement(_this.$el);
focusableEl && focusableEl.focus();
}, 1);
}
},
beforeUnmount: function beforeUnmount() {
if (this.overlayEventListener) {
OverlayEventBus__default["default"].off('overlay-click', this.overlayEventListener);
this.overlayEventListener = null;
}
},
methods: {
columnProp: function columnProp(prop) {
return utils.ObjectUtils.getVNodeProp(this.column, prop);
},
getColumnPT: function getColumnPT(key) {
var _this$$parentInstance, _this$$parentInstance2;
var columnMetaData = {
props: this.column.props,
parent: {
instance: this,
props: this.$props,
state: this.$data
},
context: {
index: this.index,
size: (_this$$parentInstance = this.$parentInstance) === null || _this$$parentInstance === void 0 || (_this$$parentInstance = _this$$parentInstance.$parentInstance) === null || _this$$parentInstance === void 0 ? void 0 : _this$$parentInstance.size,
showGridlines: (_this$$parentInstance2 = this.$parentInstance) === null || _this$$parentInstance2 === void 0 || (_this$$parentInstance2 = _this$$parentInstance2.$parentInstance) === null || _this$$parentInstance2 === void 0 ? void 0 : _this$$parentInstance2.showGridlines
}
};
return vue.mergeProps(this.ptm("column.".concat(key), {
column: columnMetaData
}), this.ptm("column.".concat(key), columnMetaData), this.ptmo(this.getColumnProp(), key, columnMetaData));
},
getColumnProp: function getColumnProp() {
return this.column.props && this.column.props.pt ? this.column.props.pt : undefined;
},
resolveFieldData: function resolveFieldData() {
return utils.ObjectUtils.resolveFieldData(this.rowData, this.field);
},
toggleRow: function toggleRow(event) {
this.$emit('row-toggle', {
originalEvent: event,
data: this.rowData
});
},
toggleRowWithRadio: function toggleRowWithRadio(event, index) {
this.$emit('radio-change', {
originalEvent: event.originalEvent,
index: index,
data: event.data
});
},
toggleRowWithCheckbox: function toggleRowWithCheckbox(event, index) {
this.$emit('checkbox-change', {
originalEvent: event.originalEvent,
index: index,
data: event.data
});
},
isEditable: function isEditable() {
return this.column.children && this.column.children.editor != null;
},
bindDocumentEditListener: function bindDocumentEditListener() {
var _this2 = this;
if (!this.documentEditListener) {
this.documentEditListener = function (event) {
if (!_this2.selfClick) {
_this2.completeEdit(event, 'outside');
}
_this2.selfClick = false;
};
document.addEventListener('click', this.documentEditListener);
}
},
unbindDocumentEditListener: function unbindDocumentEditListener() {
if (this.documentEditListener) {
document.removeEventListener('click', this.documentEditListener);
this.documentEditListener = null;
this.selfClick = false;
}
},
switchCellToViewMode: function switchCellToViewMode() {
this.d_editing = false;
this.unbindDocumentEditListener();
OverlayEventBus__default["default"].off('overlay-click', this.overlayEventListener);
this.overlayEventListener = null;
},
onClick: function onClick(event) {
var _this3 = this;
if (this.editMode === 'cell' && this.isEditable()) {
this.selfClick = true;
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.overlayEventListener = function (e) {
if (_this3.$el && _this3.$el.contains(e.target)) {
_this3.selfClick = true;
}
};
OverlayEventBus__default["default"].on('overlay-click', this.overlayEventListener);
}
}
},
completeEdit: function completeEdit(event, type) {
var completeEvent = {
originalEvent: event,
data: this.rowData,
newData: this.editingRowData,
value: this.rowData[this.field],
newValue: this.editingRowData[this.field],
field: this.field,
index: this.rowIndex,
type: type,
defaultPrevented: false,
preventDefault: function preventDefault() {
this.defaultPrevented = true;
}
};
this.$emit('cell-edit-complete', completeEvent);
if (!completeEvent.defaultPrevented) {
this.switchCellToViewMode();
}
},
onKeyDown: function onKeyDown(event) {
if (this.editMode === 'cell') {
switch (event.code) {
case 'Enter':
case 'NumpadEnter':
this.completeEdit(event, 'enter');
break;
case 'Escape':
this.switchCellToViewMode();
this.$emit('cell-edit-cancel', {
originalEvent: event,
data: this.rowData,
field: this.field,
index: this.rowIndex
});
break;
case 'Tab':
this.completeEdit(event, 'tab');
if (event.shiftKey) this.moveToPreviousCell(event);else this.moveToNextCell(event);
break;
}
}
},
moveToPreviousCell: function moveToPreviousCell(event) {
var currentCell = this.findCell(event.target);
var targetCell = this.findPreviousEditableColumn(currentCell);
if (targetCell) {
utils.DomHandler.invokeElementMethod(targetCell, 'click');
event.preventDefault();
}
},
moveToNextCell: function moveToNextCell(event) {
var currentCell = this.findCell(event.target);
var targetCell = this.findNextEditableColumn(currentCell);
if (targetCell) {
utils.DomHandler.invokeElementMethod(targetCell, 'click');
event.preventDefault();
}
},
findCell: function findCell(element) {
if (element) {
var cell = element;
while (cell && !utils.DomHandler.getAttribute(cell, 'data-p-cell-editing')) {
cell = cell.parentElement;
}
return cell;
} else {
return null;
}
},
findPreviousEditableColumn: function findPreviousEditableColumn(cell) {
var prevCell = cell.previousElementSibling;
if (!prevCell) {
var previousRow = cell.parentElement.previousElementSibling;
if (previousRow) {
prevCell = previousRow.lastElementChild;
}
}
if (prevCell) {
if (utils.DomHandler.getAttribute(prevCell, 'data-p-editable-column')) return prevCell;else return this.findPreviousEditableColumn(prevCell);
} else {
return null;
}
},
findNextEditableColumn: function findNextEditableColumn(cell) {
var nextCell = cell.nextElementSibling;
if (!nextCell) {
var nextRow = cell.parentElement.nextElementSibling;
if (nextRow) {
nextCell = nextRow.firstElementChild;
}
}
if (nextCell) {
if (utils.DomHandler.getAttribute(nextCell, 'data-p-editable-column')) return nextCell;else return this.findNextEditableColumn(nextCell);
} else {
return null;
}
},
onRowEditInit: function onRowEditInit(event) {
this.$emit('row-edit-init', {
originalEvent: event,
data: this.rowData,
newData: this.editingRowData,
field: this.field,
index: this.rowIndex
});
},
onRowEditSave: function onRowEditSave(event) {
this.$emit('row-edit-save', {
originalEvent: event,
data: this.rowData,
newData: this.editingRowData,
field: this.field,
index: this.rowIndex
});
},
onRowEditCancel: function onRowEditCancel(event) {
this.$emit('row-edit-cancel', {
originalEvent: event,
data: this.rowData,
newData: this.editingRowData,
field: this.field,
index: this.rowIndex
});
},
editorInitCallback: function editorInitCallback(event) {
this.$emit('row-edit-init', {
originalEvent: event,
data: this.rowData,
newData: this.editingRowData,
field: this.field,
index: this.rowIndex
});
},
editorSaveCallback: function 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
});
} else {
this.completeEdit(event, 'enter');
}
},
editorCancelCallback: function 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
});
} else {
this.switchCellToViewMode();
this.$emit('cell-edit-cancel', {
originalEvent: event,
data: this.rowData,
field: this.field,
index: this.rowIndex
});
}
},
updateStickyPosition: function updateStickyPosition() {
if (this.columnProp('frozen')) {
var align = this.columnProp('alignFrozen');
if (align === 'right') {
var right = 0;
var next = utils.DomHandler.getNextElementSibling(this.$el, '[data-p-frozen-column="true"]');
if (next) {
right = utils.DomHandler.getOuterWidth(next) + parseFloat(next.style.right || 0);
}
this.styleObject.right = right + 'px';
} else {
var left = 0;
var prev = utils.DomHandler.getPreviousElementSibling(this.$el, '[data-p-frozen-column="true"]');
if (prev) {
left = utils.DomHandler.getOuterWidth(prev) + parseFloat(prev.style.left || 0);
}
this.styleObject.left = left + 'px';
}
}
},
getVirtualScrollerProp: function getVirtualScrollerProp(option) {
return this.virtualScrollerContentProps ? this.virtualScrollerContentProps[option] : null;
}
},
computed: {
editingRowData: function editingRowData() {
return this.editingMeta[this.rowIndex] ? this.editingMeta[this.rowIndex].data : this.rowData;
},
field: function field() {
return this.columnProp('field');
},
containerClass: function containerClass() {
return [this.columnProp('bodyClass'), this.columnProp('class'), this.cx('bodyCell')];
},
containerStyle: function containerStyle() {
var bodyStyle = this.columnProp('bodyStyle');
var columnStyle = this.columnProp('style');
return this.columnProp('frozen') ? [columnStyle, bodyStyle, this.styleObject] : [columnStyle, bodyStyle];
},
loading: function loading() {
return this.getVirtualScrollerProp('loading');
},
loadingOptions: function loadingOptions() {
var 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
});
},
expandButtonAriaLabel: function expandButtonAriaLabel() {
return this.$primevue.config.locale.aria ? this.isRowExpanded ? this.$primevue.config.locale.aria.expandRow : this.$primevue.config.locale.aria.collapseRow : undefined;
},
initButtonAriaLabel: function initButtonAriaLabel() {
return this.$primevue.config.locale.aria ? this.$primevue.config.locale.aria.editRow : undefined;
},
saveButtonAriaLabel: function saveButtonAriaLabel() {
return this.$primevue.config.locale.aria ? this.$primevue.config.locale.aria.saveEdit : undefined;
},
cancelButtonAriaLabel: function cancelButtonAriaLabel() {
return this.$primevue.config.locale.aria ? this.$primevue.config.locale.aria.cancelEdit : undefined;
}
},
components: {
DTRadioButton: script$a,
DTCheckbox: script$b,
ChevronDownIcon: ChevronDownIcon__default["default"],
ChevronRightIcon: ChevronRightIcon__default["default"],
BarsIcon: BarsIcon__default["default"],
PencilIcon: PencilIcon__default["default"],
CheckIcon: CheckIcon__default["default"],
TimesIcon: TimesIcon__default["default"]
},
directives: {
ripple: Ripple__default["default"]
}
};
function _typeof$a(o) { "@babel/helpers - typeof"; return _typeof$a = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof$a(o); }
function ownKeys$a(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
function _objectSpread$a(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$a(Object(t), !0).forEach(function (r) { _defineProperty$a(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$a(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
function _defineProperty$a(obj, key, value) { key = _toPropertyKey$a(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
function _toPropertyKey$a(t) { var i = _toPrimitive$a(t, "string"); return "symbol" == _typeof$a(i) ? i : String(i); }
function _toPrimitive$a(t, r) { if ("object" != _typeof$a(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof$a(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
var _hoisted_1$4 = ["colspan", "rowspan", "data-p-selection-column", "data-p-editable-column", "data-p-cell-editing", "data-p-frozen-column"];
var _hoisted_2$2 = ["aria-expanded", "aria-controls", "aria-label"];
var _hoisted_3$2 = ["aria-label"];
var _hoisted_4$1 = ["aria-label"];
var _hoisted_5$1 = ["aria-label"];
function render$9(_ctx, _cache, $props, $setup, $data, $options) {
var _component_DTRadioButton = vue.resolveComponent("DTRadioButton");
var _component_DTCheckbox = vue.resolveComponent("DTCheckbox");
var _component_BarsIcon = vue.resolveComponent("BarsIcon");
var _component_ChevronDownIcon = vue.resolveComponent("ChevronDownIcon");
var _component_ChevronRightIcon = vue.resolveComponent("ChevronRightIcon");
var _directive_ripple = vue.resolveDirective("ripple");
return $options.loading ? (vue.openBlock(), vue.createElementBlock("td", vue.mergeProps({
key: 0,
style: $options.containerStyle,
"class": $options.containerClass,
role: "cell"
}, _objectSpread$a(_objectSpread$a({}, $options.getColumnPT('root')), $options.getColumnPT('bodyCell'))), [(vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent($props.column.children.loading), {
data: $props.rowData,
column: $props.column,
field: $options.field,
index: $props.rowIndex,
frozenRow: $props.frozenRow,
loadingOptions: $options.loadingOptions
}, null, 8, ["data", "column", "field", "index", "frozenRow", "loadingOptions"]))], 16)) : (vue.openBlock(), vue.createElementBlock("td", vue.mergeProps({
key: 1,
style: $options.containerStyle,
"class": $options.containerClass,
colspan: $options.columnProp('colspan'),
rowspan: $options.columnProp('rowspan'),
onClick: _cache[6] || (_cache[6] = function () {
return $options.onClick && $options.onClick.apply($options, arguments);
}),
onKeydown: _cache[7] || (_cache[7] = function () {
return $options.onKeyDown && $options.onKeyDown.apply($options, arguments);
}),
role: "cell"
}, _objectSpread$a(_objectSpread$a({}, $options.getColumnPT('root')), $options.getColumnPT('bodyCell')), {
"data-p-selection-column": $options.columnProp('selectionMode') != null,
"data-p-editable-column": $options.isEditable(),
"data-p-cell-editing": $data.d_editing,
"data-p-frozen-column": $options.columnProp('frozen')
}), [$props.responsiveLayout === 'stack' ? (vue.openBlock(), vue.createElementBlock("span", vue.mergeProps({
key: 0,
"class": _ctx.cx('columnTitle')
}, $options.getColumnPT('columnTitle')), vue.toDisplayString($options.columnProp('header')), 17)) : vue.createCommentVNode("", true), $props.column.children && $props.column.children.body && !$data.d_editing ? (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent($props.column.children.body), {
key: 1,
data: $props.rowData,
column: $props.column,
field: $options.field,
index: $props.rowIndex,
frozenRow: $props.frozenRow,
editorInitCallback: $options.editorInitCallback,
rowTogglerCallback: $options.toggleRow
}, null, 8, ["data", "column", "field", "index", "frozenRow", "editorInitCallback", "rowTogglerCallback"])) : $props.column.children && $props.column.children.editor && $data.d_editing ? (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent($props.column.children.editor), {
key: 2,
data: $options.editingRowData,
column: $props.column,
field: $options.field,
index: $props.rowIndex,
frozenRow: $props.frozenRow,
editorSaveCallback: $options.editorSaveCallback,
editorCancelCallback: $options.editorCancelCallback
}, null, 8, ["data", "column", "field", "index", "frozenRow", "editorSaveCallback", "editorCancelCallback"])) : $props.column.children && $props.column.children.body && !$props.column.children.editor && $data.d_editing ? (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent($props.column.children.body), {
key: 3,
data: $options.editingRowData,
column: $props.column,
field: $options.field,
index: $props.rowIndex,
frozenRow: $props.frozenRow
}, null, 8, ["data", "column", "field", "index", "frozenRow"])) : $options.columnProp('selectionMode') ? (vue.openBlock(), vue.createElementBlock(vue.Fragment, {
key: 4
}, [$options.columnProp('selectionMode') === 'single' ? (vue.openBlock(), vue.createBlock(_component_DTRadioButton, {
key: 0,
value: $props.rowData,
name: $props.name,
checked: $props.selected,
onChange: _cache[0] || (_cache[0] = function ($event) {
return $options.toggleRowWithRadio($event, $props.rowIndex);
}),
column: $props.column,
index: $props.index,
unstyled: _ctx.unstyled,
pt: _ctx.pt
}, null, 8, ["value", "name", "checked", "column", "index", "unstyled", "pt"])) : $options.columnProp('selectionMode') === 'multiple' ? (vue.openBlock(), vue.createBlock(_component_DTCheckbox, {
key: 1,
value: $props.rowData,
checked: $props.selected,
rowCheckboxIconTemplate: $props.column.children && $props.column.children.rowcheckboxicon,
"aria-selected": $props.selected ? true : undefined,
onChange: _cache[1] || (_cache[1] = function ($event) {
return $options.toggleRowWithCheckbox($event, $props.rowIndex);
}),
column: $props.column,
index: $props.index,
unstyled: _ctx.unstyled,
pt: _ctx.pt
}, null, 8, ["value", "checked", "rowCheckboxIconTemplate", "aria-selected", "column", "index", "unstyled", "pt"])) : vue.createCommentVNode("", true)], 64)) : $options.columnProp('rowReorder') ? (vue.openBlock(), vue.createElementBlock(vue.Fragment, {
key: 5
}, [$props.column.children && $props.column.children.rowreordericon ? (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent($props.column.children.rowreordericon), {
key: 0,
"class": vue.normalizeClass(_ctx.cx('rowReorderIcon'))
}, null, 8, ["class"])) : $options.columnProp('rowReorderIcon') ? (vue.openBlock(), vue.createElementBlock("i", vue.mergeProps({
key: 1,
"class": [_ctx.cx('rowReorderIcon'), $options.columnProp('rowReorderIcon')]
}, $options.getColumnPT('rowReorderIcon')), null, 16)) : (vue.openBlock(), vue.createBlock(_component_BarsIcon, vue.mergeProps({
key: 2,
"class": _ctx.cx('rowReorderIcon')
}, $options.getColumnPT('rowReorderIcon')), null, 16, ["class"]))], 64)) : $options.columnProp('expander') ? vue.withDirectives((vue.openBlock(), vue.createElementBlock("button", vue.mergeProps({
key: 6,
"class": _ctx.cx('rowToggler'),
type: "button",
"aria-expanded": $props.isRowExpanded,
"aria-controls": $props.ariaControls,
"aria-label": $options.expandButtonAriaLabel,
onClick: _cache[2] || (_cache[2] = function () {
return $options.toggleRow && $options.toggleRow.apply($options, arguments);
})
}, $options.getColumnPT('rowToggler'), {
"data-pc-group-section": "rowactionbutton"
}), [$props.column.children && $props.column.children.rowtogglericon ? (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent($props.column.children.rowtogglericon), {
key: 0,
"class": vue.normalizeClass(_ctx.cx('rowTogglerIcon')),
rowExpanded: $props.isRowExpanded
}, null, 8, ["class", "rowExpanded"])) : (vue.openBlock(), vue.createElementBlock(vue.Fragment, {
key: 1
}, [$props.isRowExpanded && $props.expandedRowIcon ? (vue.openBlock(), vue.createElementBlock("span", {
key: 0,
"class": vue.normalizeClass([_ctx.cx('rowTogglerIcon'), $props.expandedRowIcon])
}, null, 2)) : $props.isRowExpanded && !$props.expandedRowIcon ? (vue.openBlock(), vue.createBlock(_component_ChevronDownIcon, vue.mergeProps({
key: 1,
"class": _ctx.cx('rowTogglerIcon')
}, $options.getColumnPT('rowTogglerIcon')), null, 16, ["class"])) : !$props.isRowExpanded && $props.collapsedRowIcon ? (vue.openBlock(), vue.createElementBlock("span", {
key: 2,
"class": vue.normalizeClass([_ctx.cx('rowTogglerIcon'), $props.collapsedRowIcon])
}, null, 2)) : !$props.isRowExpanded && !$props.collapsedRowIcon ? (vue.openBlock(), vue.createBlock(_component_ChevronRightIcon, vue.mergeProps({
key: 3,
"class": _ctx.cx('rowTogglerIcon')
}, $options.getColumnPT('rowTogglerIcon')), null, 16, ["class"])) : vue.createCommentVNode("", true)], 64))], 16, _hoisted_2$2)), [[_directive_ripple]]) : $props.editMode === 'row' && $options.columnProp('rowEditor') ? (vue.openBlock(), vue.createElementBlock(vue.Fragment, {
key: 7
}, [!$data.d_editing ? vue.withDirectives((vue.openBlock(), vue.createElementBlock("button", vue.mergeProps({
key: 0,
"class": _ctx.cx('rowEditorInitButton'),
type: "button",
"aria-label": $options.initButtonAriaLabel,
onClick: _cache[3] || (_cache[3] = function () {
return $options.onRowEditInit && $options.onRowEditInit.apply($options, arguments);
})
}, $options.getColumnPT('rowEditorInitButton'), {
"data-pc-group-section": "rowactionbutton"
}), [(vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent($props.column.children && $props.column.children.roweditoriniticon || 'PencilIcon'), vue.mergeProps({
"class": _ctx.cx('rowEditorInitIcon')
}, $options.getColumnPT('rowEditorInitIcon')), null, 16, ["class"]))], 16, _hoisted_3$2)), [[_directive_ripple]]) : vue.createCommentVNode("", true), $data.d_editing ? vue.withDirectives((vue.openBlock(), vue.createElementBlock("button", vue.mergeProps({
key: 1,
"class": _ctx.cx('rowEditorSaveButton'),
type: "button",
"aria-label": $options.saveButtonAriaLabel,
onClick: _cache[4] || (_cache[4] = function () {
return $options.onRowEditSave && $options.onRowEditSave.apply($options, arguments);
})
}, $options.getColumnPT('rowEditorSaveButton'), {
"data-pc-group-section": "rowactionbutton"
}), [(vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent($props.column.children && $props.column.children.roweditorsaveicon || 'CheckIcon'), vue.mergeProps({
"class": _ctx.cx('rowEditorSaveIcon')
}, $options.getColumnPT('rowEditorSaveIcon')), null, 16, ["class"]))], 16, _hoisted_4$1)), [[_directive_ripple]]) : vue.createCommentVNode("", true), $data.d_editing ? vue.withDirectives((vue.openBlock(), vue.createElementBlock("button", vue.mergeProps({
key: 2,
"class": _ctx.cx('rowEditorCancelButton'),
type: "button",
"aria-label": $options.cancelButtonAriaLabel,
onClick: _cache[5] || (_cache[5] = function () {
return $options.onRowEditCancel && $options.onRowEditCancel.apply($options, arguments);
})
}, $options.getColumnPT('rowEditorCancelButton'), {
"data-pc-group-section": "rowactionbutton"
}), [(vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent($props.column.children && $props.column.children.roweditorcancelicon || 'TimesIcon'), vue.mergeProps({
"class": _ctx.cx('rowEditorCancelIcon')
}, $options.getColumnPT('rowEditorCancelIcon')), null, 16, ["class"]))], 16, _hoisted_5$1)), [[_directive_ripple]]) : vue.createCommentVNode("", true)], 64)) : (vue.openBlock(), vue.createElementBlock(vue.Fragment, {
key: 8
}, [vue.createTextVNode(vue.toDisplayString($options.resolveFieldData()), 1)], 64))], 16, _hoisted_1$4));
}
script$9.render = render$9;
function _typeof$9(o) { "@babel/helpers - typeof"; return _typeof$9 = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof$9(o); }
function _createForOfIteratorHelper$2(o, allowArrayLike) { var it = typeof Symbol !== "undefined" && o[Symbol.iterator] || o["@@iterator"]; if (!it) { if (Array.isArray(o) || (it = _unsupportedIterableToArray$2(o)) || allowArrayLike && o && typeof o.length === "number") { if (it) o = it; var i = 0; var F = function F() {}; return { s: F, n: function n() { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }, e: function e(_e) { throw _e; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var normalCompletion = true, didErr = false, err; return { s: function s() { it = it.call(o); }, n: function n() { var step = it.next(); normalCompletion = step.done; return step; }, e: function e(_e2) { didErr = true; err = _e2; }, f: function f() { try { if (!normalCompletion && it["return"] != null) it["return"](); } finally { if (didErr) throw err; } } }; }
function _unsupportedIterableToArray$2(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray$2(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray$2(o, minLen); }
function _arrayLikeToArray$2(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
function ownKeys$9(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
function _objectSpread$9(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$9(Object(t), !0).forEach(function (r) { _defineProperty$9(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$9(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
function _defineProperty$9(obj, key, value) { key = _toPropertyKey$9(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
function _toPropertyKey$9(t) { var i = _toPrimitive$9(t, "string"); return "symbol" == _typeof$9(i) ? i : String(i); }
function _toPrimitive$9(t, r) { if ("object" != _typeof$9(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof$9(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
var script$8 = {
name: 'BodyRow',
hostName: 'DataTable',
"extends": BaseComponent__default["default"],
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: {
rowData: {
type: Object,
"default": null
},
index: {
type: Number,
"default": 0
},
value: {
type: Array,
"default": null
},
columns: {
type: null,
"default": null
},
frozenRow: {
type: Boolean,
"default": false
},
empty: {
type: Boolean,
"default": false
},
rowGroupMode: {
type: String,
"default": null
},
groupRowsBy: {
type: [Array, String, Function],
"default": null
},
expandableR