primeng/fesm2022/primeng-table.mjs

PrimeNG is a premium UI library for Angular featuring a rich set of 90+ components, a theme designer, various theme alternatives such as Material, Bootstrap, Tailwind, premium templates and professional support. In addition, it integrates with PrimeBlock,

export * from 'primeng/types/table';
import * as i0 from '@angular/core';
import { Injectable, InjectionToken, input, booleanAttribute, inject, computed, effect, ViewEncapsulation, ChangeDetectionStrategy, Component, numberAttribute, output, signal, model, viewChild, contentChild, untracked, Directive, HostListener, ElementRef, NgModule } from '@angular/core';
import { style as style$1 } from '@primeuix/styles/datatable';
import { BaseStyle } from 'primeng/base';
import { Subject } from 'rxjs';
import { NgTemplateOutlet, isPlatformBrowser } from '@angular/common';
import * as i2$1 from '@angular/forms';
import { FormsModule } from '@angular/forms';
import { isClickable, setAttribute, getAttribute, find, findSingle, appendChild, addStyle, absolutePosition } from '@primeuix/utils';
import { OverlayService, FilterService, FilterOperator, FilterMatchMode, TranslationKeys, SharedModule } from 'primeng/api';
import { BaseComponent, PARENT_INSTANCE } from 'primeng/basecomponent';
import * as i1 from 'primeng/bind';
import { Bind, BindModule } from 'primeng/bind';
import { DomHandler, ConnectedOverlayScrollHandler } from 'primeng/dom';
import * as i2 from 'primeng/paginator';
import { PaginatorModule } from 'primeng/paginator';
import * as i3 from 'primeng/scroller';
import { ScrollerModule } from 'primeng/scroller';
import { ArrowDown } from '@primeicons/angular/arrow-down';
import { ArrowUp } from '@primeicons/angular/arrow-up';
import { Spinner } from '@primeicons/angular/spinner';
import { ObjectUtils, UniqueComponentId, ZIndexUtils } from 'primeng/utils';
import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
import * as i1$1 from 'primeng/badge';
import { BadgeModule } from 'primeng/badge';
import { SortAlt } from '@primeicons/angular/sort-alt';
import { SortAmountDown } from '@primeicons/angular/sort-amount-down';
import { SortAmountUpAlt } from '@primeicons/angular/sort-amount-up-alt';
import * as i1$2 from 'primeng/radiobutton';
import { RadioButtonModule } from 'primeng/radiobutton';
import * as i1$3 from 'primeng/checkbox';
import { CheckboxModule } from 'primeng/checkbox';
import { Filter } from '@primeicons/angular/filter';
import { FilterFill } from '@primeicons/angular/filter-fill';
import { Plus } from '@primeicons/angular/plus';
import { Trash } from '@primeicons/angular/trash';
import * as i3$2 from 'primeng/button';
import { ButtonModule } from 'primeng/button';
import * as i6 from 'primeng/datepicker';
import { DatePickerModule } from 'primeng/datepicker';
import * as i4 from 'primeng/inputnumber';
import { InputNumberModule } from 'primeng/inputnumber';
import * as i3$1 from 'primeng/inputtext';
import { InputTextModule } from 'primeng/inputtext';
import * as i5 from 'primeng/motion';
import { MotionModule } from 'primeng/motion';
import * as i4$1 from 'primeng/select';
import { SelectModule } from 'primeng/select';

const style = /*css*/ `
${style$1}

/* For PrimeNG */
.p-datatable-scrollable-table > .p-datatable-thead {
    top: 0;
    z-index: 2;
}

.p-datatable-scrollable-table > .p-datatable-frozen-tbody {
    position: sticky;
    z-index: 2;
}

.p-datatable-scrollable-table > .p-datatable-frozen-tbody + .p-datatable-frozen-tbody {
    z-index: 1;
}

.p-datatable-mask.p-overlay-mask {
    position: absolute;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 3;
}

.p-datatable-filter-overlay {
    position: absolute;
    background: dt('datatable.filter.overlay.select.background');
    color: dt('datatable.filter.overlay.select.color');
    border: 1px solid dt('datatable.filter.overlay.select.border.color');
    border-radius: dt('datatable.filter.overlay.select.border.radius');
    box-shadow: dt('datatable.filter.overlay.select.shadow');
    min-width: 12.5rem;
}

.p-datatable-filter-rule {
    border-bottom: 1px solid dt('datatable.filter.rule.border.color');
}

.p-datatable-filter-rule:last-child {
    border-bottom: 0 none;
}

.p-datatable-filter-add-rule-button,
.p-datatable-filter-remove-rule-button {
    width: 100%;
}

.p-datatable-filter-remove-button {
    width: 100%;
}

.p-datatable-thead > tr > th {
    padding: dt('datatable.header.cell.padding');
    background: dt('datatable.header.cell.background');
    border-color: dt('datatable.header.cell.border.color');
    border-style: solid;
    border-width: 0 0 1px 0;
    color: dt('datatable.header.cell.color');
    font-weight: dt('datatable.column.title.font.weight');
    text-align: start;
    transition:
        background dt('datatable.transition.duration'),
        color dt('datatable.transition.duration'),
        border-color dt('datatable.transition.duration'),
        outline-color dt('datatable.transition.duration'),
        box-shadow dt('datatable.transition.duration');
}

.p-datatable-thead > tr > th p-column-filter,
.p-datatable-thead > tr > th p-columnfilter {
    font-weight: normal;
}

.p-datatable-thead > tr > th,
.p-datatable-sort-icon,
.p-datatable-sort-badge {
    vertical-align: middle;
}

.p-datatable-thead > tr > th.p-datatable-column-sorted {
    background: dt('datatable.header.cell.selected.background');
    color: dt('datatable.header.cell.selected.color');
}

.p-datatable-thead > tr > th.p-datatable-column-sorted .p-datatable-sort-icon {
    color: dt('datatable.header.cell.selected.color');
}

.p-datatable.p-datatable-striped .p-datatable-tbody > tr:nth-child(odd) {
    background: dt('datatable.row.striped.background');
}

.p-datatable.p-datatable-striped .p-datatable-tbody > tr:nth-child(odd).p-datatable-row-selected {
    background: dt('datatable.row.selected.background');
    color: dt('datatable.row.selected.color');
}

p-sort-icon, p-sorticon {
    display: inline-flex;
    align-items: center;
    gap: dt('datatable.header.cell.gap');
}

.p-datatable .p-editable-column.p-cell-editing {
    padding: 0;
}

.p-datatable .p-editable-column.p-cell-editing p-cell-editor,
.p-datatable .p-editable-column.p-cell-editing p-celleditor {
    display: block;
    width: 100%;
}
`;
const classes = {
    root: ({ instance }) => [
        'p-datatable p-component',
        {
            'p-datatable-hoverable': instance.rowHover() || instance.selectionMode(),
            'p-datatable-resizable': instance.resizableColumns(),
            'p-datatable-resizable-fit': instance.resizableColumns() && instance.columnResizeMode() === 'fit',
            'p-datatable-scrollable': instance.scrollable(),
            'p-datatable-flex-scrollable': instance.scrollable() && instance.scrollHeight() === 'flex',
            'p-datatable-striped': instance.stripedRows(),
            'p-datatable-gridlines': instance.showGridlines(),
            'p-datatable-sm': instance.size() === 'small',
            'p-datatable-lg': instance.size() === 'large'
        }
    ],
    mask: 'p-datatable-mask p-overlay-mask',
    loadingIcon: 'p-datatable-loading-icon',
    header: 'p-datatable-header',
    pcPaginator: ({ instance }) => 'p-datatable-paginator-' + instance.paginatorPosition(),
    tableContainer: 'p-datatable-table-container',
    table: ({ instance }) => [
        'p-datatable-table',
        {
            'p-datatable-scrollable-table': instance.scrollable(),
            'p-datatable-resizable-table': instance.resizableColumns(),
            'p-datatable-resizable-table-fit': instance.resizableColumns() && instance.columnResizeMode() === 'fit'
        }
    ],
    thead: 'p-datatable-thead',
    columnResizer: 'p-datatable-column-resizer',
    columnHeaderContent: 'p-datatable-column-header-content',
    columnTitle: 'p-datatable-column-title',
    columnFooter: 'p-datatable-column-footer',
    sortIcon: 'p-datatable-sort-icon',
    pcSortBadge: 'p-datatable-sort-badge',
    filter: ({ instance }) => ({
        'p-datatable-filter': true,
        'p-datatable-inline-filter': instance.display() === 'row',
        'p-datatable-popover-filter': instance.display() === 'menu'
    }),
    filterElementContainer: 'p-datatable-filter-element-container',
    pcColumnFilterButton: 'p-datatable-column-filter-button',
    pcColumnFilterClearButton: 'p-datatable-column-filter-clear-button',
    filterOverlay: ({ instance }) => ({
        'p-datatable-filter-overlay p-component': true,
        'p-datatable-filter-overlay-popover': instance.display() === 'menu'
    }),
    filterConstraintList: 'p-datatable-filter-constraint-list',
    filterConstraint: ({ selected }) => ({
        'p-datatable-filter-constraint': true,
        'p-datatable-filter-constraint-selected': selected
    }),
    filterConstraintSeparator: 'p-datatable-filter-constraint-separator',
    filterOperator: 'p-datatable-filter-operator',
    pcFilterOperatorDropdown: 'p-datatable-filter-operator-dropdown',
    filterRuleList: 'p-datatable-filter-rule-list',
    filterRule: 'p-datatable-filter-rule',
    pcFilterConstraintDropdown: 'p-datatable-filter-constraint-dropdown',
    pcFilterRemoveRuleButton: 'p-datatable-filter-remove-rule-button',
    pcFilterAddRuleButton: 'p-datatable-filter-add-rule-button',
    filterButtonbar: 'p-datatable-filter-buttonbar',
    pcFilterClearButton: 'p-datatable-filter-clear-button',
    pcFilterApplyButton: 'p-datatable-filter-apply-button',
    tbody: ({ instance }) => ({
        'p-datatable-tbody': true,
        'p-datatable-frozen-tbody': instance.frozenValue() || instance.frozenBodyTemplate(),
        'p-virtualscroller-content': instance.virtualScroll()
    }),
    rowGroupHeader: 'p-datatable-row-group-header',
    rowToggleButton: 'p-datatable-row-toggle-button',
    rowToggleIcon: 'p-datatable-row-toggle-icon',
    rowExpansion: 'p-datatable-row-expansion',
    rowGroupFooter: 'p-datatable-row-group-footer',
    emptyMessage: 'p-datatable-empty-message',
    bodyCell: ({ instance }) => ({
        'p-datatable-frozen-column': instance.columnProp('frozen')
    }),
    reorderableRowHandle: 'p-datatable-reorderable-row-handle',
    pcRowEditorInit: 'p-datatable-row-editor-init',
    pcRowEditorSave: 'p-datatable-row-editor-save',
    pcRowEditorCancel: 'p-datatable-row-editor-cancel',
    tfoot: 'p-datatable-tfoot',
    footerCell: ({ instance }) => ({
        'p-datatable-frozen-column': instance.columnProp('frozen')
    }),
    virtualScrollerSpacer: 'p-datatable-virtualscroller-spacer',
    footer: 'p-datatable-tfoot',
    columnResizeIndicator: 'p-datatable-column-resize-indicator',
    rowReorderIndicatorUp: 'p-datatable-row-reorder-indicator-up',
    rowReorderIndicatorDown: 'p-datatable-row-reorder-indicator-down',
    sortableColumn: ({ instance }) => ({
        'p-datatable-sortable-column': instance.isEnabled(),
        ' p-datatable-column-sorted': instance.sorted()
    }),
    sortableColumnIcon: 'p-datatable-sort-icon',
    sortableColumnBadge: 'p-sortable-column-badge',
    selectableRow: ({ instance }) => ({
        'p-datatable-selectable-row': instance.isEnabled(),
        'p-datatable-row-selected': instance.selected
    }),
    resizableColumn: 'p-datatable-resizable-column',
    reorderableColumn: 'p-datatable-reorderable-column',
    rowEditorCancel: 'p-datatable-row-editor-cancel',
    frozenColumn: ({ instance }) => ({
        'p-datatable-frozen-column': instance.frozen(),
        'p-datatable-frozen-column-left': instance.alignFrozen() === 'left'
    }),
    contextMenuRowSelected: ({ instance }) => ({
        'p-datatable-contextmenu-row-selected': instance.selected
    })
};
const inlineStyles = {
    tableContainer: ({ instance }) => ({
        'max-height': instance.virtualScroll() ? '' : instance.scrollHeight(),
        overflow: 'auto'
    }),
    thead: { position: 'sticky' },
    tfoot: { position: 'sticky' },
    rowGroupHeader: ({ instance }) => ({
        top: instance.getFrozenRowGroupHeaderStickyPosition
    })
};
class TableStyle extends BaseStyle {
    name = 'datatable';
    style = style;
    classes = classes;
    inlineStyles = inlineStyles;
    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: TableStyle, deps: null, target: i0.ɵɵFactoryTarget.Injectable });
    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: TableStyle });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: TableStyle, decorators: [{
            type: Injectable
        }] });
/**
 *
 * DataTable displays data in tabular format.
 *
 * [Live Demo](https://www.primeng.org/table/)
 *
 * @module tablestyle
 *
 */
var TableClasses;
(function (TableClasses) {
    /**
     * Class name of the root element
     */
    TableClasses["root"] = "p-datatable";
    /**
     * Class name of the mask element
     */
    TableClasses["mask"] = "p-datatable-mask";
    /**
     * Class name of the loading icon element
     */
    TableClasses["loadingIcon"] = "p-datatable-loading-icon";
    /**
     * Class name of the header element
     */
    TableClasses["header"] = "p-datatable-header";
    /**
     * Class name of the paginator element
     */
    TableClasses["pcPaginator"] = "p-datatable-paginator-[position]";
    /**
     * Class name of the table container element
     */
    TableClasses["tableContainer"] = "p-datatable-table-container";
    /**
     * Class name of the table element
     */
    TableClasses["table"] = "p-datatable-table";
    /**
     * Class name of the thead element
     */
    TableClasses["thead"] = "p-datatable-thead";
    /**
     * Class name of the column resizer element
     */
    TableClasses["columnResizer"] = "p-datatable-column-resizer";
    /**
     * Class name of the column header content element
     */
    TableClasses["columnHeaderContent"] = "p-datatable-column-header-content";
    /**
     * Class name of the column title element
     */
    TableClasses["columnTitle"] = "p-datatable-column-title";
    /**
     * Class name of the sort icon element
     */
    TableClasses["sortIcon"] = "p-datatable-sort-icon";
    /**
     * Class name of the sort badge element
     */
    TableClasses["pcSortBadge"] = "p-datatable-sort-badge";
    /**
     * Class name of the filter element
     */
    TableClasses["filter"] = "p-datatable-filter";
    /**
     * Class name of the filter element container element
     */
    TableClasses["filterElementContainer"] = "p-datatable-filter-element-container";
    /**
     * Class name of the column filter button element
     */
    TableClasses["pcColumnFilterButton"] = "p-datatable-column-filter-button";
    /**
     * Class name of the column filter clear button element
     */
    TableClasses["pcColumnFilterClearButton"] = "p-datatable-column-filter-clear-button";
    /**
     * Class name of the filter overlay element
     */
    TableClasses["filterOverlay"] = "p-datatable-filter-overlay";
    /**
     * Class name of the filter constraint list element
     */
    TableClasses["filterConstraintList"] = "p-datatable-filter-constraint-list";
    /**
     * Class name of the filter constraint element
     */
    TableClasses["filterConstraint"] = "p-datatable-filter-constraint";
    /**
     * Class name of the filter constraint separator element
     */
    TableClasses["filterConstraintSeparator"] = "p-datatable-filter-constraint-separator";
    /**
     * Class name of the filter operator element
     */
    TableClasses["filterOperator"] = "p-datatable-filter-operator";
    /**
     * Class name of the filter operator dropdown element
     */
    TableClasses["pcFilterOperatorDropdown"] = "p-datatable-filter-operator-dropdown";
    /**
     * Class name of the filter rule list element
     */
    TableClasses["filterRuleList"] = "p-datatable-filter-rule-list";
    /**
     * Class name of the filter rule element
     */
    TableClasses["filterRule"] = "p-datatable-filter-rule";
    /**
     * Class name of the filter constraint dropdown element
     */
    TableClasses["pcFilterConstraintDropdown"] = "p-datatable-filter-constraint-dropdown";
    /**
     * Class name of the filter remove rule button element
     */
    TableClasses["pcFilterRemoveRuleButton"] = "p-datatable-filter-remove-rule-button";
    /**
     * Class name of the filter add rule button element
     */
    TableClasses["pcFilterAddRuleButton"] = "p-datatable-filter-add-rule-button";
    /**
     * Class name of the filter buttonbar element
     */
    TableClasses["filterButtonbar"] = "p-datatable-filter-buttonbar";
    /**
     * Class name of the filter clear button element
     */
    TableClasses["pcFilterClearButton"] = "p-datatable-filter-clear-button";
    /**
     * Class name of the filter apply button element
     */
    TableClasses["pcFilterApplyButton"] = "p-datatable-filter-apply-button";
    /**
     * Class name of the tbody element
     */
    TableClasses["tbody"] = "p-datatable-tbody";
    /**
     * Class name of the row group header element
     */
    TableClasses["rowGroupHeader"] = "p-datatable-row-group-header";
    /**
     * Class name of the row toggle button element
     */
    TableClasses["rowToggleButton"] = "p-datatable-row-toggle-button";
    /**
     * Class name of the row toggle icon element
     */
    TableClasses["rowToggleIcon"] = "p-datatable-row-toggle-icon";
    /**
     * Class name of the row expansion element
     */
    TableClasses["rowExpansion"] = "p-datatable-row-expansion";
    /**
     * Class name of the row group footer element
     */
    TableClasses["rowGroupFooter"] = "p-datatable-row-group-footer";
    /**
     * Class name of the empty message element
     */
    TableClasses["emptyMessage"] = "p-datatable-empty-message";
    /**
     * Class name of the reorderable row handle element
     */
    TableClasses["reorderableRowHandle"] = "p-datatable-reorderable-row-handle";
    /**
     * Class name of the row editor init element
     */
    TableClasses["pcRowEditorInit"] = "p-datatable-row-editor-init";
    /**
     * Class name of the row editor save element
     */
    TableClasses["pcRowEditorSave"] = "p-datatable-row-editor-save";
    /**
     * Class name of the row editor cancel element
     */
    TableClasses["pcRowEditorCancel"] = "p-datatable-row-editor-cancel";
    /**
     * Class name of the tfoot element
     */
    TableClasses["tfoot"] = "p-datatable-tfoot";
    /**
     * Class name of the virtual scroller spacer element
     */
    TableClasses["virtualScrollerSpacer"] = "p-datatable-virtualscroller-spacer";
    /**
     * Class name of the footer element
     */
    TableClasses["footer"] = "p-datatable-footer";
    /**
     * Class name of the column resize indicator element
     */
    TableClasses["columnResizeIndicator"] = "p-datatable-column-resize-indicator";
    /**
     * Class name of the row reorder indicator up element
     */
    TableClasses["rowReorderIndicatorUp"] = "p-datatable-row-reorder-indicator-up";
    /**
     * Class name of the row reorder indicator down element
     */
    TableClasses["rowReorderIndicatorDown"] = "p-datatable-row-reorder-indicator-down";
    /**
     * Class name of the sortable column element
     */
    TableClasses["sortableColumn"] = "p-datatable-sortable-column";
    /**
     * Class name of the sortable column icon element
     */
    TableClasses["sortableColumnIcon"] = "p-sortable-column-icon";
    /**
     * Class name of the sortable column badge element
     */
    TableClasses["sortableColumnBadge"] = "p-sortable-column-badge";
    /**
     * Class name of the selectable row element
     */
    TableClasses["selectableRow"] = "p-datatable-selectable-row";
    /**
     * Class name of the resizable column element
     */
    TableClasses["resizableColumn"] = "p-datatable-resizable-column";
    /**
     * Class name of the row editor cancel element
     */
    TableClasses["rowEditorCancel"] = "p-datatable-row-editor-cancel";
    /**
     * Class name of the frozen column element
     */
    TableClasses["frozenColumn"] = "p-datatable-frozen-column";
    /**
     * Class name of the contextmenu row selected element
     */
    TableClasses["contextMenuRowSelected"] = "p-datatable-contextmenu-row-selected";
})(TableClasses || (TableClasses = {}));

const TABLE_INSTANCE = new InjectionToken('TABLE_INSTANCE');
const COLUMN_FILTER_INSTANCE = new InjectionToken('COLUMN_FILTER_INSTANCE');
class TableService {
    sortSource = new Subject();
    selectionSource = new Subject();
    contextMenuSource = new Subject();
    valueSource = new Subject();
    columnsSource = new Subject();
    sortSource$ = this.sortSource.asObservable();
    selectionSource$ = this.selectionSource.asObservable();
    contextMenuSource$ = this.contextMenuSource.asObservable();
    valueSource$ = this.valueSource.asObservable();
    columnsSource$ = this.columnsSource.asObservable();
    onSort(sortMeta) {
        this.sortSource.next(sortMeta);
    }
    onSelectionChange() {
        this.selectionSource.next(null);
    }
    onContextMenu(data) {
        this.contextMenuSource.next(data);
    }
    onValueChange(value) {
        this.valueSource.next(value);
    }
    onColumnsChange(columns) {
        this.columnsSource.next(columns);
    }
    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: TableService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: TableService });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: TableService, decorators: [{
            type: Injectable
        }] });

class TableBody extends BaseComponent {
    hostName = 'Table';
    columns = input(undefined, { ...(ngDevMode ? { debugName: "columns" } : /* istanbul ignore next */ {}), alias: 'pTableBody' });
    template = input(undefined, { ...(ngDevMode ? { debugName: "template" } : /* istanbul ignore next */ {}), alias: 'pTableBodyTemplate' });
    value = input(/* @ts-ignore */
    ...(ngDevMode ? [undefined, { debugName: "value" }] : /* istanbul ignore next */ []));
    frozen = input(undefined, { ...(ngDevMode ? { debugName: "frozen" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
    frozenRows = input(undefined, { ...(ngDevMode ? { debugName: "frozenRows" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
    scrollerOptions = input(/* @ts-ignore */
    ...(ngDevMode ? [undefined, { debugName: "scrollerOptions" }] : /* istanbul ignore next */ []));
    dataTable = inject(TABLE_INSTANCE);
    bodyContext = computed(() => ({
        $implicit: this.columns(),
        frozen: this.frozen()
    }), /* @ts-ignore */
    ...(ngDevMode ? [{ debugName: "bodyContext" }] : /* istanbul ignore next */ []));
    constructor() {
        super();
        effect(() => {
            const val = this.value();
            if (val !== undefined) {
                if (this.frozenRows()) {
                    this.updateFrozenRowStickyPosition();
                }
                if (this.dataTable.scrollable() && this.dataTable.rowGroupMode() === 'subheader') {
                    this.updateFrozenRowGroupHeaderStickyPosition();
                }
            }
        });
    }
    onAfterViewInit() {
        if (this.frozenRows()) {
            this.updateFrozenRowStickyPosition();
        }
        if (this.dataTable.scrollable() && this.dataTable.rowGroupMode() === 'subheader') {
            this.updateFrozenRowGroupHeaderStickyPosition();
        }
    }
    shouldRenderRowGroupHeader(value, rowData, i) {
        let currentRowFieldData = ObjectUtils.resolveFieldData(rowData, this.dataTable?.groupRowsBy() || '');
        let prevRowData = value[i - (this.dataTable?.first() || 0) - 1];
        if (prevRowData) {
            let previousRowFieldData = ObjectUtils.resolveFieldData(prevRowData, this.dataTable?.groupRowsBy() || '');
            return currentRowFieldData !== previousRowFieldData;
        }
        else {
            return true;
        }
    }
    shouldRenderRowGroupFooter(value, rowData, i) {
        let currentRowFieldData = ObjectUtils.resolveFieldData(rowData, this.dataTable?.groupRowsBy() || '');
        let nextRowData = value[i - (this.dataTable?.first() || 0) + 1];
        if (nextRowData) {
            let nextRowFieldData = ObjectUtils.resolveFieldData(nextRowData, this.dataTable?.groupRowsBy() || '');
            return currentRowFieldData !== nextRowFieldData;
        }
        else {
            return true;
        }
    }
    shouldRenderRowspan(value, rowData, i) {
        let currentRowFieldData = ObjectUtils.resolveFieldData(rowData, this.dataTable?.groupRowsBy());
        let prevRowData = value[i - 1];
        if (prevRowData) {
            let previousRowFieldData = ObjectUtils.resolveFieldData(prevRowData, this.dataTable?.groupRowsBy() || '');
            return currentRowFieldData !== previousRowFieldData;
        }
        else {
            return true;
        }
    }
    calculateRowGroupSize(value, rowData, index) {
        let currentRowFieldData = ObjectUtils.resolveFieldData(rowData, this.dataTable?.groupRowsBy());
        let nextRowFieldData = currentRowFieldData;
        let groupRowSpan = 0;
        while (currentRowFieldData === nextRowFieldData) {
            groupRowSpan++;
            let nextRowData = value[++index];
            if (nextRowData) {
                nextRowFieldData = ObjectUtils.resolveFieldData(nextRowData, this.dataTable?.groupRowsBy() || '');
            }
            else {
                break;
            }
        }
        return groupRowSpan === 1 ? null : groupRowSpan;
    }
    updateFrozenRowStickyPosition() {
        this.el.nativeElement.style.top = DomHandler.getOuterHeight(this.el.nativeElement.previousElementSibling) + 'px';
    }
    updateFrozenRowGroupHeaderStickyPosition() {
        if (this.el.nativeElement.previousElementSibling) {
            let tableHeaderHeight = DomHandler.getOuterHeight(this.el.nativeElement.previousElementSibling);
            this.dataTable.rowGroupHeaderStyleObject.top = tableHeaderHeight + 'px';
        }
    }
    getScrollerOption(option, options) {
        if (this.dataTable.virtualScroll()) {
            options = options || this.scrollerOptions();
            return options ? options[option] : null;
        }
        return null;
    }
    getRowIndex(rowIndex) {
        const index = this.dataTable.paginator() ? this.dataTable.first() + rowIndex : rowIndex;
        const getItemOptions = this.getScrollerOption('getItemOptions');
        return getItemOptions ? getItemOptions(index).index : index;
    }
    dataP = computed(() => {
        return this.cn({
            hoverable: this.dataTable.rowHover() || this.dataTable.selectionMode(),
            frozen: this.frozen()
        });
    }, /* @ts-ignore */
    ...(ngDevMode ? [{ debugName: "dataP" }] : /* istanbul ignore next */ []));
    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: TableBody, deps: [], target: i0.ɵɵFactoryTarget.Component });
    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.6", type: TableBody, isStandalone: true, selector: "[pTableBody]", inputs: { columns: { classPropertyName: "columns", publicName: "pTableBody", isSignal: true, isRequired: false, transformFunction: null }, template: { classPropertyName: "template", publicName: "pTableBodyTemplate", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, frozen: { classPropertyName: "frozen", publicName: "frozen", isSignal: true, isRequired: false, transformFunction: null }, frozenRows: { classPropertyName: "frozenRows", publicName: "frozenRows", isSignal: true, isRequired: false, transformFunction: null }, scrollerOptions: { classPropertyName: "scrollerOptions", publicName: "scrollerOptions", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "attr.data-p": "dataP()" } }, usesInheritance: true, ngImport: i0, template: `
        @if (!dataTable.expandedRowTemplate()) {
            @for (rowData of value(); track dataTable.rowTrackBy()($index, rowData); let rowIndex = $index) {
                @if (dataTable.groupHeaderTemplate() && !dataTable.virtualScroll() && dataTable.rowGroupMode() === 'subheader' && shouldRenderRowGroupHeader(value(), rowData, getRowIndex(rowIndex))) {
                    <ng-container role="row">
                        <ng-container
                            *ngTemplateOutlet="
                                dataTable.groupHeaderTemplate();
                                context: {
                                    $implicit: rowData,
                                    rowIndex: getRowIndex(rowIndex),
                                    columns: columns(),
                                    editing: dataTable.editMode() === 'row' && dataTable.isRowEditing(rowData),
                                    frozen: frozen()
                                }
                            "
                        ></ng-container>
                    </ng-container>
                }
                @if (dataTable.rowGroupMode() !== 'rowspan') {
                    <ng-container
                        *ngTemplateOutlet="
                            rowData ? template() : dataTable.loadingBodyTemplate();
                            context: {
                                $implicit: rowData,
                                rowIndex: getRowIndex(rowIndex),
                                columns: columns(),
                                editing: dataTable.editMode() === 'row' && dataTable.isRowEditing(rowData),
                                frozen: frozen()
                            }
                        "
                    ></ng-container>
                }
                @if (dataTable.rowGroupMode() === 'rowspan') {
                    <ng-container
                        *ngTemplateOutlet="
                            rowData ? template() : dataTable.loadingBodyTemplate();
                            context: {
                                $implicit: rowData,
                                rowIndex: getRowIndex(rowIndex),
                                columns: columns(),
                                editing: dataTable.editMode() === 'row' && dataTable.isRowEditing(rowData),
                                frozen: frozen(),
                                rowgroup: shouldRenderRowspan(value(), rowData, rowIndex),
                                rowspan: calculateRowGroupSize(value(), rowData, rowIndex)
                            }
                        "
                    ></ng-container>
                }
                @if (dataTable.groupFooterTemplate() && !dataTable.virtualScroll() && dataTable.rowGroupMode() === 'subheader' && shouldRenderRowGroupFooter(value(), rowData, getRowIndex(rowIndex))) {
                    <ng-container role="row">
                        <ng-container
                            *ngTemplateOutlet="
                                dataTable.groupFooterTemplate();
                                context: {
                                    $implicit: rowData,
                                    rowIndex: getRowIndex(rowIndex),
                                    columns: columns(),
                                    editing: dataTable.editMode() === 'row' && dataTable.isRowEditing(rowData),
                                    frozen: frozen()
                                }
                            "
                        ></ng-container>
                    </ng-container>
                }
            }
        }
        @if (dataTable.expandedRowTemplate() && !(frozen() && dataTable.frozenExpandedRowTemplate())) {
            @for (rowData of value(); track dataTable.rowTrackBy()($index, rowData); let rowIndex = $index) {
                @if (!dataTable.groupHeaderTemplate()) {
                    <ng-container
                        *ngTemplateOutlet="
                            template();
                            context: {
                                $implicit: rowData,
                                rowIndex: getRowIndex(rowIndex),
                                columns: columns(),
                                expanded: dataTable.isRowExpanded(rowData),
                                editing: dataTable.editMode() === 'row' && dataTable.isRowEditing(rowData),
                                frozen: frozen()
                            }
                        "
                    ></ng-container>
                }
                @if (dataTable.groupHeaderTemplate() && dataTable.rowGroupMode() === 'subheader' && shouldRenderRowGroupHeader(value(), rowData, getRowIndex(rowIndex))) {
                    <ng-container role="row">
                        <ng-container
                            *ngTemplateOutlet="
                                dataTable.groupHeaderTemplate();
                                context: {
                                    $implicit: rowData,
                                    rowIndex: getRowIndex(rowIndex),
                                    columns: columns(),
                                    expanded: dataTable.isRowExpanded(rowData),
                                    editing: dataTable.editMode() === 'row' && dataTable.isRowEditing(rowData),
                                    frozen: frozen()
                                }
                            "
                        ></ng-container>
                    </ng-container>
                }
                @if (dataTable.isRowExpanded(rowData)) {
                    <ng-container
                        *ngTemplateOutlet="
                            dataTable.expandedRowTemplate();
                            context: {
                                $implicit: rowData,
                                rowIndex: getRowIndex(rowIndex),
                                columns: columns(),
                                frozen: frozen()
                            }
                        "
                    ></ng-container>
                    @if (dataTable.groupFooterTemplate() && dataTable.rowGroupMode() === 'subheader' && shouldRenderRowGroupFooter(value(), rowData, getRowIndex(rowIndex))) {
                        <ng-container role="row">
                            <ng-container
                                *ngTemplateOutlet="
                                    dataTable.groupFooterTemplate();
                                    context: {
                                        $implicit: rowData,
                                        rowIndex: getRowIndex(rowIndex),
                                        columns: columns(),
                                        expanded: dataTable.isRowExpanded(rowData),
                                        editing: dataTable.editMode() === 'row' && dataTable.isRowEditing(rowData),
                                        frozen: frozen()
                                    }
                                "
                            ></ng-container>
                        </ng-container>
                    }
                }
            }
        }
        @if (dataTable.frozenExpandedRowTemplate() && frozen()) {
            @for (rowData of value(); track dataTable.rowTrackBy()($index, rowData); let rowIndex = $index) {
                <ng-container
                    *ngTemplateOutlet="
                        template();
                        context: {
                            $implicit: rowData,
                            rowIndex: getRowIndex(rowIndex),
                            columns: columns(),
                            expanded: dataTable.isRowExpanded(rowData),
                            editing: dataTable.editMode() === 'row' && dataTable.isRowEditing(rowData),
                            frozen: frozen()
                        }
                    "
                ></ng-container>
                @if (dataTable.isRowExpanded(rowData)) {
                    <ng-container
                        *ngTemplateOutlet="
                            dataTable.frozenExpandedRowTemplate();
                            context: {
                                $implicit: rowData,
                                rowIndex: getRowIndex(rowIndex),
                                columns: columns(),
                                frozen: frozen()
                            }
                        "
                    ></ng-container>
                }
            }
        }
        @if (dataTable.loading()) {
            <ng-container *ngTemplateOutlet="dataTable.loadingBodyTemplate(); context: bodyContext()"></ng-container>
        }
        @if (dataTable.isEmpty() && !dataTable.loading()) {
            <ng-container *ngTemplateOutlet="dataTable.emptyMessageTemplate(); context: bodyContext()"></ng-container>
        }
    `, isInline: true, dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.Eager, encapsulation: i0.ViewEncapsulation.None });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: TableBody, decorators: [{
            type: Component,
            args: [{
                    selector: '[pTableBody]',
                    standalone: true,
                    imports: [NgTemplateOutlet],
                    template: `
        @if (!dataTable.expandedRowTemplate()) {
            @for (rowData of value(); track dataTable.rowTrackBy()($index, rowData); let rowIndex = $index) {
                @if (dataTable.groupHeaderTemplate() && !dataTable.virtualScroll() && dataTable.rowGroupMode() === 'subheader' && shouldRenderRowGroupHeader(value(), rowData, getRowIndex(rowIndex))) {
                    <ng-container role="row">
                        <ng-container
                            *ngTemplateOutlet="
                                dataTable.groupHeaderTemplate();
                                context: {
                                    $implicit: rowData,
                                    rowIndex: getRowIndex(rowIndex),
                                    columns: columns(),
                                    editing: dataTable.editMode() === 'row' && dataTable.isRowEditing(rowData),
                                    frozen: frozen()
                                }
                            "
                        ></ng-container>
                    </ng-container>
                }
                @if (dataTable.rowGroupMode() !== 'rowspan') {
                    <ng-container
                        *ngTemplateOutlet="
                            rowData ? template() : dataTable.loadingBodyTemplate();
                            context: {
                                $implicit: rowData,
                                rowIndex: getRowIndex(rowIndex),
                                columns: columns(),
                                editing: dataTable.editMode() === 'row' && dataTable.isRowEditing(rowData),
                                frozen: frozen()
                            }
                        "
                    ></ng-container>
                }
                @if (dataTable.rowGroupMode() === 'rowspan') {
                    <ng-container
                        *ngTemplateOutlet="
                            rowData ? template() : dataTable.loadingBodyTemplate();
                            context: {
                                $implicit: rowData,
                                rowIndex: getRowIndex(rowIndex),
                                columns: columns(),
                                editing: dataTable.editMode() === 'row' && dataTable.isRowEditing(rowData),
                                frozen: frozen(),
                                rowgroup: shouldRenderRowspan(value(), rowData, rowIndex),
                                rowspan: calculateRowGroupSize(value(), rowData, rowIndex)
                            }
                        "
                    ></ng-container>
                }
                @if (dataTable.groupFooterTemplate() && !dataTable.virtualScroll() && dataTable.rowGroupMode() === 'subheader' && shouldRenderRowGroupFooter(value(), rowData, getRowIndex(rowIndex))) {
                    <ng-container role="row">
                        <ng-container
                            *ngTemplateOutlet="
                                dataTable.groupFooterTemplate();
                                context: {
                                    $implicit: rowData,
                                    rowIndex: getRowIndex(rowIndex),
                                    columns: columns(),
                                    editing: dataTable.editMode() === 'row' && dataTable.isRowEditing(rowData),
                                    frozen: frozen()
                                }
                            "
                        ></ng-container>
                    </ng-container>
                }
            }
        }
        @if (dataTable.expandedRowTemplate() && !(frozen() && dataTable.frozenExpandedRowTemplate())) {
            @for (rowData of value(); track dataTable.rowTrackBy()($index, rowData); let rowIndex = $index) {
                @if (!dataTable.groupHeaderTemplate()) {
                    <ng-container
                        *ngTemplateOutlet="
                            template();
                            context: {
                                $implicit: rowData,
                                rowIndex: getRowIndex(rowIndex),
                                columns: columns(),
                                expanded: dataTable.isRowExpanded(rowData),
                                editing: dataTable.editMode() === 'row' && dataTable.isRowEditing(rowData),
                                frozen: frozen()
                            }
                        "
                    ></ng-container>
                }
                @if (dataTable.groupHeaderTemplate() && dataTable.rowGroupMode() === 'subheader' && shouldRenderRowGroupHeader(value(), rowData, getRowIndex(rowIndex))) {
                    <ng-container role="row">
                        <ng-container
                            *ngTemplateOutlet="
                                dataTable.groupHeaderTemplate();
                                context: {
                                    $implicit: rowData,
                                    rowIndex: getRowIndex(rowIndex),
                                    columns: columns(),
                                    expanded: dataTable.isRowExpanded(rowData),
                                    editing: dataTable.editMode() === 'row' && dataTable.isRowEditing(rowData),
                                    frozen: frozen()
                                }
                            "
                        ></ng-container>
                    </ng-container>
                }
                @if (dataTable.isRowExpanded(rowData)) {
                    <ng-container
                        *ngTemplateOutlet="
                            dataTable.expandedRowTemplate();
                            context: {
                                $implicit: rowData,
                                rowIndex: getRowIndex(rowIndex),
                                columns: columns(),
                                frozen: frozen()
                            }
                        "
                    ></ng-container>
                    @if (dataTable.groupFooterTemplate() && dataTable.rowGroupMode() === 'subheader' && shouldRenderRowGroupFooter(value(), rowData, getRowIndex(rowIndex))) {
                        <ng-container role="row">
                            <ng-container
                                *ngTemplateOutlet="
                                    dataTable.groupFooterTemplate();
                                    context: {
                                        $implicit: rowData,
                                        rowIndex: getRowIndex(rowIndex),
                                        columns: columns(),
                                        expanded: dataTable.isRowExpanded(rowData),
                                        editing: dataTable.editMode() === 'row' && dataTable.isRowEditing(rowData),
                                        frozen: frozen()
                                    }
                                "
                            ></ng-container>
                        </ng-container>
                    }
                }
            }
        }
        @if (dataTable.frozenExpandedRowTemplate() && frozen()) {
            @for (rowData of value(); track dataTable.rowTrackBy()($index, rowData); let rowIndex = $index) {
                <ng-container
                    *ngTemplateOutlet="
                        template();
                        context: {
                            $implicit: rowData,
                            rowIndex: getRowIndex(rowIndex),
                            columns: columns(),
                            expanded: dataTable.isRowExpanded(rowData),
                            editing: dataTable.editMode() === 'row' && dataTable.isRowEditing(rowData),
                            frozen: frozen()
                        }
                    "
                ></ng-container>
                @if (dataTable.isRowExpanded(rowData)) {
                    <ng-container
                        *ngTemplateOutlet="
                            dataTable.frozenExpandedRowTemplate();
                            context: {
                                $implicit: rowData,
                                rowIndex: getRowIndex(rowIndex),
                                columns: columns(),
                                frozen: frozen()
                            }
                        "
                    ></ng-container>
                }
            }
        }
        @if (dataTable.loading()) {
            <ng-container *ngTemplateOutlet="dataTable.loadingBodyTemplate(); context: bodyContext()"></ng-container>
        }
        @if (dataTable.isEmpty() && !dataTable.loading()) {
            <ng-container *ngTemplateOutlet="dataTable.emptyMessageTemplate(); context: bodyContext()"></ng-container>
        }
    `,
                    changeDetection: ChangeDetectionStrategy.Default,
                    encapsulation: ViewEncapsulation.None,
                    host: {
                        '[attr.data-p]': 'dataP()'
                    }
                }]
        }], ctorParameters: () => [], propDecorators: { columns: [{ type: i0.Input, args: [{ isSignal: true, alias: "pTableBody", required: false }] }], template: [{ type: i0.Input, args: [{ isSignal: true, alias: "pTableBodyTemplate", required: false }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }], frozen: [{ type: i0.Input, args: [{ isSignal: true, alias: "frozen", required: false }] }], frozenRows: [{ type: i0.Input, args: [{ isSignal: true, alias: "frozenRows", required: false }] }], scrollerOptions: [{ type: i0.Input, args: [{ isSignal: true, alias: "scrollerOptions", required: false }] }] } });

/**
 * Table displays data in tabular format.
 * @group Components
 */
class Table extends BaseComponent {
    componentName = 'Table';
    /**
     * An array of objects to represent dynamic columns that are frozen.
     * @group Props
     */
    frozenColumns = input(/* @ts-ignore */
    ...(ngDevMode ? [undefined, { debugName: "frozenColumns" }] : /* istanbul ignore next */ []));
    /**
     * An array of objects to display as frozen.
     * @group Props
     */
    frozenValue = input(/* @ts-ignore */
    ...(ngDevMode ? [undefined, { debugName: "frozenValue" }] : /* istanbul ignore next */ []));
    /**
     * Inline style of the table.
     * @group Props
     */
    tableStyle = input(/* @ts-ignore */
    ...(ngDevMode ? [undefined, { debugName: "tableStyle" }] : /* istanbul ignore next */ []));
    /**
     * Style class of the table.
     * @group Props
     */
    tableStyleClass = input(/* @ts-ignore */
    ...(ngDevMode ? [undefined, { debugName: "tableStyleClass" }] : /* istanbul ignore next */ []));
    /**
     * When specified as true, enables the pagination.
     * @group Props
     */
    paginator = input(undefined, { ...(ngDevMode ? { debugName: "paginator" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
    /**
     * Number of page links to display in paginator.
     * @group Props
     */
    pageLinks = input(5, { ...(ngDevMode ? { debugName: "pageLinks" } : /* istanbul ignore next */ {}), transform: numberAttribute });
    /**
     * Array of integer/object values to display inside rows per page dropdown of paginator
     * @group Props
     */
    rowsPerPageOptions = input(/* @ts-ignore */
    ...(ngDevMode ? [undefined, { debugName: "rowsPerPageOptions" }] : /* istanbul ignore next */ []));
    /**
     * Whether to show it even there is only one page.
     * @group Props
     */
    alwaysShowPaginator = input(true, { ...(ngDevMode ? { debugName: "alwaysShowPaginator" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
    /**
     * Position of the paginator, options are "top", "bottom" or "both".
     * @group Props
     */
    paginatorPosition = input('bottom', /* @ts-ignore */
    ...(ngDevMode ? [{ debugName: "paginatorPosition" }] : /* istanbul ignore next */ []));
    /**
     * Custom style class for paginator