primeng/fesm2022/primeng-table.mjs.map

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,

{"version":3,"file":"primeng-table.mjs","sources":["../../src/table/style/tablestyle.ts","../../src/table/table-service.ts","../../src/table/table-body.ts","../../src/table/table.ts","../../src/table/frozen-column.ts","../../src/table/editable-row.ts","../../src/table/reorderable-row-handle.ts","../../src/table/row-group-header.ts","../../src/table/row-toggler.ts","../../src/table/sortable-column.ts","../../src/table/selectable-row.ts","../../src/table/selectable-row-dbl-click.ts","../../src/table/context-menu-row.ts","../../src/table/resizable-column.ts","../../src/table/reorderable-column.ts","../../src/table/editable-column.ts","../../src/table/reorderable-row.ts","../../src/table/init-editable-row.ts","../../src/table/save-editable-row.ts","../../src/table/cancel-editable-row.ts","../../src/table/sort-icon.ts","../../src/table/cell-editor.ts","../../src/table/table-radio-button.ts","../../src/table/table-checkbox.ts","../../src/table/table-header-checkbox.ts","../../src/table/column-filter-form-element.ts","../../src/table/column-filter.ts","../../src/table/table.module.ts","../../src/table/primeng-table.ts"],"sourcesContent":["import { Injectable } from '@angular/core';\nimport { style as datatable_style } from '@primeuix/styles/datatable';\nimport { BaseStyle } from 'primeng/base';\n\nconst style = /*css*/ `\n${datatable_style}\n\n/* For PrimeNG */\n.p-datatable-scrollable-table > .p-datatable-thead {\n    top: 0;\n    z-index: 2;\n}\n\n.p-datatable-scrollable-table > .p-datatable-frozen-tbody {\n    position: sticky;\n    z-index: 2;\n}\n\n.p-datatable-scrollable-table > .p-datatable-frozen-tbody + .p-datatable-frozen-tbody {\n    z-index: 1;\n}\n\n.p-datatable-mask.p-overlay-mask {\n    position: absolute;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    z-index: 3;\n}\n\n.p-datatable-filter-overlay {\n    position: absolute;\n    background: dt('datatable.filter.overlay.select.background');\n    color: dt('datatable.filter.overlay.select.color');\n    border: 1px solid dt('datatable.filter.overlay.select.border.color');\n    border-radius: dt('datatable.filter.overlay.select.border.radius');\n    box-shadow: dt('datatable.filter.overlay.select.shadow');\n    min-width: 12.5rem;\n}\n\n.p-datatable-filter-rule {\n    border-bottom: 1px solid dt('datatable.filter.rule.border.color');\n}\n\n.p-datatable-filter-rule:last-child {\n    border-bottom: 0 none;\n}\n\n.p-datatable-filter-add-rule-button,\n.p-datatable-filter-remove-rule-button {\n    width: 100%;\n}\n\n.p-datatable-filter-remove-button {\n    width: 100%;\n}\n\n.p-datatable-thead > tr > th {\n    padding: dt('datatable.header.cell.padding');\n    background: dt('datatable.header.cell.background');\n    border-color: dt('datatable.header.cell.border.color');\n    border-style: solid;\n    border-width: 0 0 1px 0;\n    color: dt('datatable.header.cell.color');\n    font-weight: dt('datatable.column.title.font.weight');\n    text-align: start;\n    transition:\n        background dt('datatable.transition.duration'),\n        color dt('datatable.transition.duration'),\n        border-color dt('datatable.transition.duration'),\n        outline-color dt('datatable.transition.duration'),\n        box-shadow dt('datatable.transition.duration');\n}\n\n.p-datatable-thead > tr > th p-column-filter,\n.p-datatable-thead > tr > th p-columnfilter {\n    font-weight: normal;\n}\n\n.p-datatable-thead > tr > th,\n.p-datatable-sort-icon,\n.p-datatable-sort-badge {\n    vertical-align: middle;\n}\n\n.p-datatable-thead > tr > th.p-datatable-column-sorted {\n    background: dt('datatable.header.cell.selected.background');\n    color: dt('datatable.header.cell.selected.color');\n}\n\n.p-datatable-thead > tr > th.p-datatable-column-sorted .p-datatable-sort-icon {\n    color: dt('datatable.header.cell.selected.color');\n}\n\n.p-datatable.p-datatable-striped .p-datatable-tbody > tr:nth-child(odd) {\n    background: dt('datatable.row.striped.background');\n}\n\n.p-datatable.p-datatable-striped .p-datatable-tbody > tr:nth-child(odd).p-datatable-row-selected {\n    background: dt('datatable.row.selected.background');\n    color: dt('datatable.row.selected.color');\n}\n\np-sort-icon, p-sorticon {\n    display: inline-flex;\n    align-items: center;\n    gap: dt('datatable.header.cell.gap');\n}\n\n.p-datatable .p-editable-column.p-cell-editing {\n    padding: 0;\n}\n\n.p-datatable .p-editable-column.p-cell-editing p-cell-editor,\n.p-datatable .p-editable-column.p-cell-editing p-celleditor {\n    display: block;\n    width: 100%;\n}\n`;\n\nconst classes = {\n    root: ({ instance }) => [\n        'p-datatable p-component',\n        {\n            'p-datatable-hoverable': instance.rowHover() || instance.selectionMode(),\n            'p-datatable-resizable': instance.resizableColumns(),\n            'p-datatable-resizable-fit': instance.resizableColumns() && instance.columnResizeMode() === 'fit',\n            'p-datatable-scrollable': instance.scrollable(),\n            'p-datatable-flex-scrollable': instance.scrollable() && instance.scrollHeight() === 'flex',\n            'p-datatable-striped': instance.stripedRows(),\n            'p-datatable-gridlines': instance.showGridlines(),\n            'p-datatable-sm': instance.size() === 'small',\n            'p-datatable-lg': instance.size() === 'large'\n        }\n    ],\n    mask: 'p-datatable-mask p-overlay-mask',\n    loadingIcon: 'p-datatable-loading-icon',\n    header: 'p-datatable-header',\n    pcPaginator: ({ instance }) => 'p-datatable-paginator-' + instance.paginatorPosition(),\n    tableContainer: 'p-datatable-table-container',\n    table: ({ instance }) => [\n        'p-datatable-table',\n        {\n            'p-datatable-scrollable-table': instance.scrollable(),\n            'p-datatable-resizable-table': instance.resizableColumns(),\n            'p-datatable-resizable-table-fit': instance.resizableColumns() && instance.columnResizeMode() === 'fit'\n        }\n    ],\n    thead: 'p-datatable-thead',\n    columnResizer: 'p-datatable-column-resizer',\n    columnHeaderContent: 'p-datatable-column-header-content',\n    columnTitle: 'p-datatable-column-title',\n    columnFooter: 'p-datatable-column-footer',\n    sortIcon: 'p-datatable-sort-icon',\n    pcSortBadge: 'p-datatable-sort-badge',\n    filter: ({ instance }) => ({\n        'p-datatable-filter': true,\n        'p-datatable-inline-filter': instance.display() === 'row',\n        'p-datatable-popover-filter': instance.display() === 'menu'\n    }),\n    filterElementContainer: 'p-datatable-filter-element-container',\n    pcColumnFilterButton: 'p-datatable-column-filter-button',\n    pcColumnFilterClearButton: 'p-datatable-column-filter-clear-button',\n    filterOverlay: ({ instance }) => ({\n        'p-datatable-filter-overlay p-component': true,\n        'p-datatable-filter-overlay-popover': instance.display() === 'menu'\n    }),\n    filterConstraintList: 'p-datatable-filter-constraint-list',\n\n    filterConstraint: ({ selected }) => ({\n        'p-datatable-filter-constraint': true,\n        'p-datatable-filter-constraint-selected': selected\n    }),\n    filterConstraintSeparator: 'p-datatable-filter-constraint-separator',\n    filterOperator: 'p-datatable-filter-operator',\n    pcFilterOperatorDropdown: 'p-datatable-filter-operator-dropdown',\n    filterRuleList: 'p-datatable-filter-rule-list',\n    filterRule: 'p-datatable-filter-rule',\n    pcFilterConstraintDropdown: 'p-datatable-filter-constraint-dropdown',\n    pcFilterRemoveRuleButton: 'p-datatable-filter-remove-rule-button',\n    pcFilterAddRuleButton: 'p-datatable-filter-add-rule-button',\n    filterButtonbar: 'p-datatable-filter-buttonbar',\n    pcFilterClearButton: 'p-datatable-filter-clear-button',\n    pcFilterApplyButton: 'p-datatable-filter-apply-button',\n    tbody: ({ instance }) => ({\n        'p-datatable-tbody': true,\n        'p-datatable-frozen-tbody': instance.frozenValue() || instance.frozenBodyTemplate(),\n        'p-virtualscroller-content': instance.virtualScroll()\n    }),\n    rowGroupHeader: 'p-datatable-row-group-header',\n    rowToggleButton: 'p-datatable-row-toggle-button',\n    rowToggleIcon: 'p-datatable-row-toggle-icon',\n    rowExpansion: 'p-datatable-row-expansion',\n    rowGroupFooter: 'p-datatable-row-group-footer',\n    emptyMessage: 'p-datatable-empty-message',\n    bodyCell: ({ instance }) => ({\n        'p-datatable-frozen-column': instance.columnProp('frozen')\n    }),\n    reorderableRowHandle: 'p-datatable-reorderable-row-handle',\n    pcRowEditorInit: 'p-datatable-row-editor-init',\n    pcRowEditorSave: 'p-datatable-row-editor-save',\n    pcRowEditorCancel: 'p-datatable-row-editor-cancel',\n    tfoot: 'p-datatable-tfoot',\n    footerCell: ({ instance }) => ({\n        'p-datatable-frozen-column': instance.columnProp('frozen')\n    }),\n    virtualScrollerSpacer: 'p-datatable-virtualscroller-spacer',\n    footer: 'p-datatable-tfoot',\n    columnResizeIndicator: 'p-datatable-column-resize-indicator',\n    rowReorderIndicatorUp: 'p-datatable-row-reorder-indicator-up',\n    rowReorderIndicatorDown: 'p-datatable-row-reorder-indicator-down',\n    sortableColumn: ({ instance }) => ({\n        'p-datatable-sortable-column': instance.isEnabled(),\n        ' p-datatable-column-sorted': instance.sorted()\n    }),\n    sortableColumnIcon: 'p-datatable-sort-icon',\n    sortableColumnBadge: 'p-sortable-column-badge',\n    selectableRow: ({ instance }) => ({\n        'p-datatable-selectable-row': instance.isEnabled(),\n        'p-datatable-row-selected': instance.selected\n    }),\n    resizableColumn: 'p-datatable-resizable-column',\n    reorderableColumn: 'p-datatable-reorderable-column',\n    rowEditorCancel: 'p-datatable-row-editor-cancel',\n    frozenColumn: ({ instance }) => ({\n        'p-datatable-frozen-column': instance.frozen(),\n        'p-datatable-frozen-column-left': instance.alignFrozen() === 'left'\n    }),\n    contextMenuRowSelected: ({ instance }) => ({\n        'p-datatable-contextmenu-row-selected': instance.selected\n    })\n};\n\nconst inlineStyles = {\n    tableContainer: ({ instance }) => ({\n        'max-height': instance.virtualScroll() ? '' : instance.scrollHeight(),\n        overflow: 'auto'\n    }),\n    thead: { position: 'sticky' },\n    tfoot: { position: 'sticky' },\n    rowGroupHeader: ({ instance }) => ({\n        top: instance.getFrozenRowGroupHeaderStickyPosition\n    })\n};\n\n@Injectable()\nexport class TableStyle extends BaseStyle {\n    name = 'datatable';\n\n    style = style;\n\n    classes = classes;\n\n    inlineStyles = inlineStyles;\n}\n\n/**\n *\n * DataTable displays data in tabular format.\n *\n * [Live Demo](https://www.primeng.org/table/)\n *\n * @module tablestyle\n *\n */\nexport enum TableClasses {\n    /**\n     * Class name of the root element\n     */\n    root = 'p-datatable',\n    /**\n     * Class name of the mask element\n     */\n    mask = 'p-datatable-mask',\n    /**\n     * Class name of the loading icon element\n     */\n    loadingIcon = 'p-datatable-loading-icon',\n    /**\n     * Class name of the header element\n     */\n    header = 'p-datatable-header',\n    /**\n     * Class name of the paginator element\n     */\n    pcPaginator = 'p-datatable-paginator-[position]',\n    /**\n     * Class name of the table container element\n     */\n    tableContainer = 'p-datatable-table-container',\n    /**\n     * Class name of the table element\n     */\n    table = 'p-datatable-table',\n    /**\n     * Class name of the thead element\n     */\n    thead = 'p-datatable-thead',\n    /**\n     * Class name of the column resizer element\n     */\n    columnResizer = 'p-datatable-column-resizer',\n    /**\n     * Class name of the column header content element\n     */\n    columnHeaderContent = 'p-datatable-column-header-content',\n    /**\n     * Class name of the column title element\n     */\n    columnTitle = 'p-datatable-column-title',\n    /**\n     * Class name of the sort icon element\n     */\n    sortIcon = 'p-datatable-sort-icon',\n    /**\n     * Class name of the sort badge element\n     */\n    pcSortBadge = 'p-datatable-sort-badge',\n    /**\n     * Class name of the filter element\n     */\n    filter = 'p-datatable-filter',\n    /**\n     * Class name of the filter element container element\n     */\n    filterElementContainer = 'p-datatable-filter-element-container',\n    /**\n     * Class name of the column filter button element\n     */\n    pcColumnFilterButton = 'p-datatable-column-filter-button',\n    /**\n     * Class name of the column filter clear button element\n     */\n    pcColumnFilterClearButton = 'p-datatable-column-filter-clear-button',\n    /**\n     * Class name of the filter overlay element\n     */\n    filterOverlay = 'p-datatable-filter-overlay',\n    /**\n     * Class name of the filter constraint list element\n     */\n    filterConstraintList = 'p-datatable-filter-constraint-list',\n    /**\n     * Class name of the filter constraint element\n     */\n    filterConstraint = 'p-datatable-filter-constraint',\n    /**\n     * Class name of the filter constraint separator element\n     */\n    filterConstraintSeparator = 'p-datatable-filter-constraint-separator',\n    /**\n     * Class name of the filter operator element\n     */\n    filterOperator = 'p-datatable-filter-operator',\n    /**\n     * Class name of the filter operator dropdown element\n     */\n    pcFilterOperatorDropdown = 'p-datatable-filter-operator-dropdown',\n    /**\n     * Class name of the filter rule list element\n     */\n    filterRuleList = 'p-datatable-filter-rule-list',\n    /**\n     * Class name of the filter rule element\n     */\n    filterRule = 'p-datatable-filter-rule',\n    /**\n     * Class name of the filter constraint dropdown element\n     */\n    pcFilterConstraintDropdown = 'p-datatable-filter-constraint-dropdown',\n    /**\n     * Class name of the filter remove rule button element\n     */\n    pcFilterRemoveRuleButton = 'p-datatable-filter-remove-rule-button',\n    /**\n     * Class name of the filter add rule button element\n     */\n    pcFilterAddRuleButton = 'p-datatable-filter-add-rule-button',\n    /**\n     * Class name of the filter buttonbar element\n     */\n    filterButtonbar = 'p-datatable-filter-buttonbar',\n    /**\n     * Class name of the filter clear button element\n     */\n    pcFilterClearButton = 'p-datatable-filter-clear-button',\n    /**\n     * Class name of the filter apply button element\n     */\n    pcFilterApplyButton = 'p-datatable-filter-apply-button',\n    /**\n     * Class name of the tbody element\n     */\n    tbody = 'p-datatable-tbody',\n    /**\n     * Class name of the row group header element\n     */\n    rowGroupHeader = 'p-datatable-row-group-header',\n    /**\n     * Class name of the row toggle button element\n     */\n    rowToggleButton = 'p-datatable-row-toggle-button',\n    /**\n     * Class name of the row toggle icon element\n     */\n    rowToggleIcon = 'p-datatable-row-toggle-icon',\n    /**\n     * Class name of the row expansion element\n     */\n    rowExpansion = 'p-datatable-row-expansion',\n    /**\n     * Class name of the row group footer element\n     */\n    rowGroupFooter = 'p-datatable-row-group-footer',\n    /**\n     * Class name of the empty message element\n     */\n    emptyMessage = 'p-datatable-empty-message',\n    /**\n     * Class name of the reorderable row handle element\n     */\n    reorderableRowHandle = 'p-datatable-reorderable-row-handle',\n    /**\n     * Class name of the row editor init element\n     */\n    pcRowEditorInit = 'p-datatable-row-editor-init',\n    /**\n     * Class name of the row editor save element\n     */\n    pcRowEditorSave = 'p-datatable-row-editor-save',\n    /**\n     * Class name of the row editor cancel element\n     */\n    pcRowEditorCancel = 'p-datatable-row-editor-cancel',\n    /**\n     * Class name of the tfoot element\n     */\n    tfoot = 'p-datatable-tfoot',\n    /**\n     * Class name of the virtual scroller spacer element\n     */\n    virtualScrollerSpacer = 'p-datatable-virtualscroller-spacer',\n    /**\n     * Class name of the footer element\n     */\n    footer = 'p-datatable-footer',\n    /**\n     * Class name of the column resize indicator element\n     */\n    columnResizeIndicator = 'p-datatable-column-resize-indicator',\n    /**\n     * Class name of the row reorder indicator up element\n     */\n    rowReorderIndicatorUp = 'p-datatable-row-reorder-indicator-up',\n    /**\n     * Class name of the row reorder indicator down element\n     */\n    rowReorderIndicatorDown = 'p-datatable-row-reorder-indicator-down',\n    /**\n     * Class name of the sortable column element\n     */\n    sortableColumn = 'p-datatable-sortable-column',\n    /**\n     * Class name of the sortable column icon element\n     */\n    sortableColumnIcon = 'p-sortable-column-icon',\n    /**\n     * Class name of the sortable column badge element\n     */\n    sortableColumnBadge = 'p-sortable-column-badge',\n    /**\n     * Class name of the selectable row element\n     */\n    selectableRow = 'p-datatable-selectable-row',\n    /**\n     * Class name of the resizable column element\n     */\n    resizableColumn = 'p-datatable-resizable-column',\n    /**\n     * Class name of the row editor cancel element\n     */\n    rowEditorCancel = 'p-datatable-row-editor-cancel',\n    /**\n     * Class name of the frozen column element\n     */\n    frozenColumn = 'p-datatable-frozen-column',\n    /**\n     * Class name of the contextmenu row selected element\n     */\n    contextMenuRowSelected = 'p-datatable-contextmenu-row-selected'\n}\n","import { Injectable, InjectionToken } from '@angular/core';\nimport { SortMeta } from 'primeng/api';\nimport { Subject } from 'rxjs';\n\nexport const TABLE_INSTANCE = new InjectionToken<any>('TABLE_INSTANCE');\nexport const COLUMN_FILTER_INSTANCE = new InjectionToken<any>('COLUMN_FILTER_INSTANCE');\n\n@Injectable()\nexport class TableService {\n    private sortSource = new Subject<SortMeta | SortMeta[] | null>();\n    private selectionSource = new Subject();\n    private contextMenuSource = new Subject<any>();\n    private valueSource = new Subject<any>();\n    private columnsSource = new Subject();\n\n    sortSource$ = this.sortSource.asObservable();\n    selectionSource$ = this.selectionSource.asObservable();\n    contextMenuSource$ = this.contextMenuSource.asObservable();\n    valueSource$ = this.valueSource.asObservable();\n    columnsSource$ = this.columnsSource.asObservable();\n\n    onSort(sortMeta: SortMeta | SortMeta[] | null) {\n        this.sortSource.next(sortMeta);\n    }\n\n    onSelectionChange() {\n        this.selectionSource.next(null);\n    }\n\n    onContextMenu(data: any) {\n        this.contextMenuSource.next(data);\n    }\n\n    onValueChange(value: any) {\n        this.valueSource.next(value);\n    }\n\n    onColumnsChange(columns: any[]) {\n        this.columnsSource.next(columns);\n    }\n}\n","import { NgTemplateOutlet } from '@angular/common';\nimport { booleanAttribute, ChangeDetectionStrategy, Component, computed, effect, inject, input, TemplateRef, ViewEncapsulation } from '@angular/core';\nimport { BaseComponent } from 'primeng/basecomponent';\nimport { DomHandler } from 'primeng/dom';\nimport { Nullable } from 'primeng/ts-helpers';\nimport { ObjectUtils } from 'primeng/utils';\nimport { TABLE_INSTANCE } from './table-service';\nimport type { Table } from './table';\n\n@Component({\n    selector: '[pTableBody]',\n    standalone: true,\n    imports: [NgTemplateOutlet],\n    template: `\n        @if (!dataTable.expandedRowTemplate()) {\n            @for (rowData of value(); track dataTable.rowTrackBy()($index, rowData); let rowIndex = $index) {\n                @if (dataTable.groupHeaderTemplate() && !dataTable.virtualScroll() && dataTable.rowGroupMode() === 'subheader' && shouldRenderRowGroupHeader(value(), rowData, getRowIndex(rowIndex))) {\n                    <ng-container role=\"row\">\n                        <ng-container\n                            *ngTemplateOutlet=\"\n                                dataTable.groupHeaderTemplate();\n                                context: {\n                                    $implicit: rowData,\n                                    rowIndex: getRowIndex(rowIndex),\n                                    columns: columns(),\n                                    editing: dataTable.editMode() === 'row' && dataTable.isRowEditing(rowData),\n                                    frozen: frozen()\n                                }\n                            \"\n                        ></ng-container>\n                    </ng-container>\n                }\n                @if (dataTable.rowGroupMode() !== 'rowspan') {\n                    <ng-container\n                        *ngTemplateOutlet=\"\n                            rowData ? template() : dataTable.loadingBodyTemplate();\n                            context: {\n                                $implicit: rowData,\n                                rowIndex: getRowIndex(rowIndex),\n                                columns: columns(),\n                                editing: dataTable.editMode() === 'row' && dataTable.isRowEditing(rowData),\n                                frozen: frozen()\n                            }\n                        \"\n                    ></ng-container>\n                }\n                @if (dataTable.rowGroupMode() === 'rowspan') {\n                    <ng-container\n                        *ngTemplateOutlet=\"\n                            rowData ? template() : dataTable.loadingBodyTemplate();\n                            context: {\n                                $implicit: rowData,\n                                rowIndex: getRowIndex(rowIndex),\n                                columns: columns(),\n                                editing: dataTable.editMode() === 'row' && dataTable.isRowEditing(rowData),\n                                frozen: frozen(),\n                                rowgroup: shouldRenderRowspan(value(), rowData, rowIndex),\n                                rowspan: calculateRowGroupSize(value(), rowData, rowIndex)\n                            }\n                        \"\n                    ></ng-container>\n                }\n                @if (dataTable.groupFooterTemplate() && !dataTable.virtualScroll() && dataTable.rowGroupMode() === 'subheader' && shouldRenderRowGroupFooter(value(), rowData, getRowIndex(rowIndex))) {\n                    <ng-container role=\"row\">\n                        <ng-container\n                            *ngTemplateOutlet=\"\n                                dataTable.groupFooterTemplate();\n                                context: {\n                                    $implicit: rowData,\n                                    rowIndex: getRowIndex(rowIndex),\n                                    columns: columns(),\n                                    editing: dataTable.editMode() === 'row' && dataTable.isRowEditing(rowData),\n                                    frozen: frozen()\n                                }\n                            \"\n                        ></ng-container>\n                    </ng-container>\n                }\n            }\n        }\n        @if (dataTable.expandedRowTemplate() && !(frozen() && dataTable.frozenExpandedRowTemplate())) {\n            @for (rowData of value(); track dataTable.rowTrackBy()($index, rowData); let rowIndex = $index) {\n                @if (!dataTable.groupHeaderTemplate()) {\n                    <ng-container\n                        *ngTemplateOutlet=\"\n                            template();\n                            context: {\n                                $implicit: rowData,\n                                rowIndex: getRowIndex(rowIndex),\n                                columns: columns(),\n                                expanded: dataTable.isRowExpanded(rowData),\n                                editing: dataTable.editMode() === 'row' && dataTable.isRowEditing(rowData),\n                                frozen: frozen()\n                            }\n                        \"\n                    ></ng-container>\n                }\n                @if (dataTable.groupHeaderTemplate() && dataTable.rowGroupMode() === 'subheader' && shouldRenderRowGroupHeader(value(), rowData, getRowIndex(rowIndex))) {\n                    <ng-container role=\"row\">\n                        <ng-container\n                            *ngTemplateOutlet=\"\n                                dataTable.groupHeaderTemplate();\n                                context: {\n                                    $implicit: rowData,\n                                    rowIndex: getRowIndex(rowIndex),\n                                    columns: columns(),\n                                    expanded: dataTable.isRowExpanded(rowData),\n                                    editing: dataTable.editMode() === 'row' && dataTable.isRowEditing(rowData),\n                                    frozen: frozen()\n                                }\n                            \"\n                        ></ng-container>\n                    </ng-container>\n                }\n                @if (dataTable.isRowExpanded(rowData)) {\n                    <ng-container\n                        *ngTemplateOutlet=\"\n                            dataTable.expandedRowTemplate();\n                            context: {\n                                $implicit: rowData,\n                                rowIndex: getRowIndex(rowIndex),\n                                columns: columns(),\n                                frozen: frozen()\n                            }\n                        \"\n                    ></ng-container>\n                    @if (dataTable.groupFooterTemplate() && dataTable.rowGroupMode() === 'subheader' && shouldRenderRowGroupFooter(value(), rowData, getRowIndex(rowIndex))) {\n                        <ng-container role=\"row\">\n                            <ng-container\n                                *ngTemplateOutlet=\"\n                                    dataTable.groupFooterTemplate();\n                                    context: {\n                                        $implicit: rowData,\n                                        rowIndex: getRowIndex(rowIndex),\n                                        columns: columns(),\n                                        expanded: dataTable.isRowExpanded(rowData),\n                                        editing: dataTable.editMode() === 'row' && dataTable.isRowEditing(rowData),\n                                        frozen: frozen()\n                                    }\n                                \"\n                            ></ng-container>\n                        </ng-container>\n                    }\n                }\n            }\n        }\n        @if (dataTable.frozenExpandedRowTemplate() && frozen()) {\n            @for (rowData of value(); track dataTable.rowTrackBy()($index, rowData); let rowIndex = $index) {\n                <ng-container\n                    *ngTemplateOutlet=\"\n                        template();\n                        context: {\n                            $implicit: rowData,\n                            rowIndex: getRowIndex(rowIndex),\n                            columns: columns(),\n                            expanded: dataTable.isRowExpanded(rowData),\n                            editing: dataTable.editMode() === 'row' && dataTable.isRowEditing(rowData),\n                            frozen: frozen()\n                        }\n                    \"\n                ></ng-container>\n                @if (dataTable.isRowExpanded(rowData)) {\n                    <ng-container\n                        *ngTemplateOutlet=\"\n                            dataTable.frozenExpandedRowTemplate();\n                            context: {\n                                $implicit: rowData,\n                                rowIndex: getRowIndex(rowIndex),\n                                columns: columns(),\n                                frozen: frozen()\n                            }\n                        \"\n                    ></ng-container>\n                }\n            }\n        }\n        @if (dataTable.loading()) {\n            <ng-container *ngTemplateOutlet=\"dataTable.loadingBodyTemplate(); context: bodyContext()\"></ng-container>\n        }\n        @if (dataTable.isEmpty() && !dataTable.loading()) {\n            <ng-container *ngTemplateOutlet=\"dataTable.emptyMessageTemplate(); context: bodyContext()\"></ng-container>\n        }\n    `,\n    changeDetection: ChangeDetectionStrategy.Default,\n    encapsulation: ViewEncapsulation.None,\n    host: {\n        '[attr.data-p]': 'dataP()'\n    }\n})\nexport class TableBody extends BaseComponent {\n    hostName = 'Table';\n\n    columns = input<any[] | undefined>(undefined, { alias: 'pTableBody' });\n\n    template = input<Nullable<TemplateRef<any>>>(undefined, { alias: 'pTableBodyTemplate' });\n\n    value = input<any[] | undefined>();\n\n    frozen = input(undefined, { transform: booleanAttribute });\n\n    frozenRows = input(undefined, { transform: booleanAttribute });\n\n    scrollerOptions = input<any>();\n\n    public dataTable = inject<Table>(TABLE_INSTANCE);\n\n    bodyContext = computed(() => ({\n        $implicit: this.columns(),\n        frozen: this.frozen()\n    }));\n\n    constructor() {\n        super();\n        effect(() => {\n            const val = this.value();\n            if (val !== undefined) {\n                if (this.frozenRows()) {\n                    this.updateFrozenRowStickyPosition();\n                }\n\n                if (this.dataTable.scrollable() && this.dataTable.rowGroupMode() === 'subheader') {\n                    this.updateFrozenRowGroupHeaderStickyPosition();\n                }\n            }\n        });\n    }\n\n    onAfterViewInit() {\n        if (this.frozenRows()) {\n            this.updateFrozenRowStickyPosition();\n        }\n\n        if (this.dataTable.scrollable() && this.dataTable.rowGroupMode() === 'subheader') {\n            this.updateFrozenRowGroupHeaderStickyPosition();\n        }\n    }\n\n    shouldRenderRowGroupHeader(value: any, rowData: any, i: number) {\n        let currentRowFieldData = ObjectUtils.resolveFieldData(rowData, this.dataTable?.groupRowsBy() || '');\n        let prevRowData = value[i - (this.dataTable?.first() || 0) - 1];\n        if (prevRowData) {\n            let previousRowFieldData = ObjectUtils.resolveFieldData(prevRowData, this.dataTable?.groupRowsBy() || '');\n            return currentRowFieldData !== previousRowFieldData;\n        } else {\n            return true;\n        }\n    }\n\n    shouldRenderRowGroupFooter(value: any, rowData: any, i: number) {\n        let currentRowFieldData = ObjectUtils.resolveFieldData(rowData, this.dataTable?.groupRowsBy() || '');\n        let nextRowData = value[i - (this.dataTable?.first() || 0) + 1];\n        if (nextRowData) {\n            let nextRowFieldData = ObjectUtils.resolveFieldData(nextRowData, this.dataTable?.groupRowsBy() || '');\n            return currentRowFieldData !== nextRowFieldData;\n        } else {\n            return true;\n        }\n    }\n\n    shouldRenderRowspan(value: any, rowData: any, i: number) {\n        let currentRowFieldData = ObjectUtils.resolveFieldData(rowData, this.dataTable?.groupRowsBy());\n        let prevRowData = value[i - 1];\n        if (prevRowData) {\n            let previousRowFieldData = ObjectUtils.resolveFieldData(prevRowData, this.dataTable?.groupRowsBy() || '');\n            return currentRowFieldData !== previousRowFieldData;\n        } else {\n            return true;\n        }\n    }\n\n    calculateRowGroupSize(value: any, rowData: any, index: number) {\n        let currentRowFieldData = ObjectUtils.resolveFieldData(rowData, this.dataTable?.groupRowsBy());\n        let nextRowFieldData = currentRowFieldData;\n        let groupRowSpan = 0;\n\n        while (currentRowFieldData === nextRowFieldData) {\n            groupRowSpan++;\n            let nextRowData = value[++index];\n            if (nextRowData) {\n                nextRowFieldData = ObjectUtils.resolveFieldData(nextRowData, this.dataTable?.groupRowsBy() || '');\n            } else {\n                break;\n            }\n        }\n\n        return groupRowSpan === 1 ? null : groupRowSpan;\n    }\n\n    updateFrozenRowStickyPosition() {\n        this.el.nativeElement.style.top = DomHandler.getOuterHeight(this.el.nativeElement.previousElementSibling) + 'px';\n    }\n\n    updateFrozenRowGroupHeaderStickyPosition() {\n        if (this.el.nativeElement.previousElementSibling) {\n            let tableHeaderHeight = DomHandler.getOuterHeight(this.el.nativeElement.previousElementSibling);\n            this.dataTable.rowGroupHeaderStyleObject.top = tableHeaderHeight + 'px';\n        }\n    }\n\n    getScrollerOption(option: any, options?: any) {\n        if (this.dataTable.virtualScroll()) {\n            options = options || this.scrollerOptions();\n            return options ? options[option] : null;\n        }\n\n        return null;\n    }\n\n    getRowIndex(rowIndex: number) {\n        const index = this.dataTable.paginator() ? <number>this.dataTable.first() + rowIndex : rowIndex;\n        const getItemOptions = this.getScrollerOption('getItemOptions');\n        return getItemOptions ? getItemOptions(index).index : index;\n    }\n\n    dataP = computed(() => {\n        return this.cn({\n            hoverable: this.dataTable.rowHover() || this.dataTable.selectionMode(),\n            frozen: this.frozen()\n        });\n    });\n}\n","import { isPlatformBrowser, NgTemplateOutlet } from '@angular/common';\nimport { booleanAttribute, ChangeDetectionStrategy, Component, computed, contentChild, effect, ElementRef, inject, input, model, numberAttribute, output, TemplateRef, untracked, viewChild, ViewEncapsulation, signal } from '@angular/core';\nimport { FormsModule } from '@angular/forms';\nimport { isClickable, setAttribute } from '@primeuix/utils';\nimport { BlockableUI, FilterMatchMode, FilterMetadata, FilterOperator, FilterService, LazyLoadMeta, OverlayService, ScrollerOptions, SortMeta, TableState } from 'primeng/api';\nimport { BaseComponent, PARENT_INSTANCE } from 'primeng/basecomponent';\nimport { Bind, BindModule } from 'primeng/bind';\nimport { CheckboxChangeEvent } from 'primeng/checkbox';\nimport { DomHandler } from 'primeng/dom';\nimport { PaginatorModule } from 'primeng/paginator';\nimport { Scroller, ScrollerModule } from 'primeng/scroller';\nimport { ArrowDown } from '@primeicons/angular/arrow-down';\nimport { ArrowUp } from '@primeicons/angular/arrow-up';\nimport { Spinner } from '@primeicons/angular/spinner';\nimport {\n    ExportCSVOptions,\n    TableColResizeEvent,\n    TableColumnReorderEvent,\n    TableContextMenuSelectEvent,\n    TableEditCancelEvent,\n    TableEditCompleteEvent,\n    TableEditInitEvent,\n    TableFilterEvent,\n    TableHeaderCheckboxToggleEvent,\n    TableLazyLoadEvent,\n    TablePageEvent,\n    TablePaginatorPosition,\n    TableColumnResizeMode,\n    TableEditMode,\n    TablePassThrough,\n    TableRowExpandMode,\n    TableRowGroupMode,\n    TableSelectionMode,\n    TableSize,\n    TableSortMode,\n    TableStateStorage,\n    TableRowCollapseEvent,\n    TableRowExpandEvent,\n    TableRowReorderEvent,\n    TableRowSelectEvent,\n    TableRowUnSelectEvent,\n    TableSelectAllChangeEvent\n} from 'primeng/types/table';\nimport type { CSSProperties } from 'primeng/types/shared';\nimport { ObjectUtils, UniqueComponentId } from 'primeng/utils';\nimport { Subscription } from 'rxjs';\nimport { TableStyle } from './style/tablestyle';\nimport { TableBody } from './table-body';\nimport { TABLE_INSTANCE, TableService } from './table-service';\n/**\n * Table displays data in tabular format.\n * @group Components\n */\n@Component({\n    selector: 'p-table',\n    standalone: true,\n    imports: [NgTemplateOutlet, PaginatorModule, ScrollerModule, FormsModule, BindModule, Spinner, ArrowDown, ArrowUp, TableBody],\n    template: `\n        @if (showLoadingMask()) {\n            <div [class]=\"cx('mask')\" [pBind]=\"ptm('mask')\" animate.enter=\"p-overlay-mask-enter-active\" animate.leave=\"p-overlay-mask-leave-active\">\n                @if (loadingIcon()) {\n                    <i [class]=\"cn(cx('loadingIcon'), loadingIcon())\" [pBind]=\"ptm('loadingIcon')\"></i>\n                }\n                @if (!loadingIcon()) {\n                    @if (!loadingIconTemplate()) {\n                        <svg data-p-icon=\"spinner\" [class]=\"cx('loadingIcon')\" [spin]=\"true\" [pBind]=\"ptm('loadingIcon')\" />\n                    }\n                    @if (loadingIconTemplate()) {\n                        <span [class]=\"cx('loadingIcon')\" [pBind]=\"ptm('loadingIcon')\">\n                            <ng-template *ngTemplateOutlet=\"loadingIconTemplate()\"></ng-template>\n                        </span>\n                    }\n                }\n            </div>\n        }\n        @if (captionTemplate()) {\n            <div [class]=\"cx('header')\" [pBind]=\"ptm('header')\">\n                <ng-container *ngTemplateOutlet=\"captionTemplate()\"></ng-container>\n            </div>\n        }\n        @if (showTopPaginator()) {\n            <p-paginator\n                [rows]=\"rows()\"\n                [first]=\"first()\"\n                [totalRecords]=\"totalRecords()\"\n                [pageLinkSize]=\"pageLinks()\"\n                [alwaysShow]=\"alwaysShowPaginator()\"\n                (onPageChange)=\"onPageChange($event)\"\n                [rowsPerPageOptions]=\"rowsPerPageOptions()\"\n                [templateLeft]=\"paginatorLeftTemplate()\"\n                [templateRight]=\"paginatorRightTemplate()\"\n                [appendTo]=\"paginatorDropdownAppendTo()\"\n                [dropdownScrollHeight]=\"paginatorDropdownScrollHeight()\"\n                [currentPageReportTemplate]=\"currentPageReportTemplate()\"\n                [showFirstLastIcon]=\"showFirstLastIcon()\"\n                [dropdownItemTemplate]=\"paginatorDropdownItemTemplate()\"\n                [showCurrentPageReport]=\"showCurrentPageReport()\"\n                [showJumpToPageDropdown]=\"showJumpToPageDropdown()\"\n                [showJumpToPageInput]=\"showJumpToPageInput()\"\n                [showPageLinks]=\"showPageLinks()\"\n                [class]=\"cn(cx('pcPaginator'), paginatorStyleClass())\"\n                [locale]=\"paginatorLocale()\"\n                [pt]=\"ptm('pcPaginator')\"\n                [unstyled]=\"unstyled()\"\n            >\n                @if (paginatorDropdownIconTemplate()) {\n                    <ng-template #dropdownicon>\n                        <ng-container *ngTemplateOutlet=\"paginatorDropdownIconTemplate()\"></ng-container>\n                    </ng-template>\n                }\n\n                @if (paginatorFirstPageLinkIconTemplate()) {\n                    <ng-template #firstpagelinkicon>\n                        <ng-container *ngTemplateOutlet=\"paginatorFirstPageLinkIconTemplate()\"></ng-container>\n                    </ng-template>\n                }\n\n                @if (paginatorPreviousPageLinkIconTemplate()) {\n                    <ng-template #previouspagelinkicon>\n                        <ng-container *ngTemplateOutlet=\"paginatorPreviousPageLinkIconTemplate()\"></ng-container>\n                    </ng-template>\n                }\n\n                @if (paginatorLastPageLinkIconTemplate()) {\n                    <ng-template #lastpagelinkicon>\n                        <ng-container *ngTemplateOutlet=\"paginatorLastPageLinkIconTemplate()\"></ng-container>\n                    </ng-template>\n                }\n\n                @if (paginatorNextPageLinkIconTemplate()) {\n                    <ng-template #nextpagelinkicon>\n                        <ng-container *ngTemplateOutlet=\"paginatorNextPageLinkIconTemplate()\"></ng-container>\n                    </ng-template>\n                }\n            </p-paginator>\n        }\n\n        <div #wrapper [class]=\"cx('tableContainer')\" [style]=\"sx('tableContainer')\" [pBind]=\"ptm('tableContainer')\" [attr.data-p]=\"dataP\">\n            @if (virtualScroll()) {\n                <p-scroller\n                    #scroller\n                    [items]=\"processedData\"\n                    [columns]=\"columns\"\n                    [style]=\"scrollerStyle()\"\n                    [scrollHeight]=\"scrollerScrollHeight()\"\n                    [itemSize]=\"virtualScrollItemSize()\"\n                    [step]=\"rows()\"\n                    [delay]=\"scrollerDelay()\"\n                    [inline]=\"true\"\n                    [autoSize]=\"true\"\n                    [lazy]=\"lazy()\"\n                    (onLazyLoad)=\"onLazyItemLoad($event)\"\n                    [loaderDisabled]=\"true\"\n                    [showSpacer]=\"false\"\n                    [showLoader]=\"loadingBodyTemplate()\"\n                    [options]=\"virtualScrollOptions()\"\n                    [pt]=\"ptm('virtualScroller')\"\n                >\n                    <ng-template #content let-items let-scrollerOptions=\"options\">\n                        <ng-container\n                            *ngTemplateOutlet=\"\n                                buildInTable;\n                                context: {\n                                    $implicit: items,\n                                    options: scrollerOptions\n                                }\n                            \"\n                        ></ng-container>\n                    </ng-template>\n                </p-scroller>\n            }\n            @if (!virtualScroll()) {\n                <ng-container\n                    *ngTemplateOutlet=\"\n                        buildInTable;\n                        context: {\n                            $implicit: processedData,\n                            options: { columns }\n                        }\n                    \"\n                ></ng-container>\n            }\n\n            <ng-template #buildInTable let-items let-scrollerOptions=\"options\">\n                <table #table role=\"table\" [class]=\"cn(cx('table'), tableStyleClass())\" [pBind]=\"ptm('table')\" [style]=\"tableStyle()\" [attr.id]=\"id + '-table'\">\n                    <ng-container *ngTemplateOutlet=\"colGroupTemplate(); context: { $implicit: scrollerOptions.columns }\"></ng-container>\n                    <thead role=\"rowgroup\" #thead [class]=\"cx('thead')\" [style]=\"sx('thead')\" [pBind]=\"ptm('thead')\">\n                        <ng-container\n                            *ngTemplateOutlet=\"\n                                headerGroupedTemplate() || headerTemplate();\n                                context: {\n                                    $implicit: scrollerOptions.columns\n                                }\n                            \"\n                        ></ng-container>\n                    </thead>\n                    @if (showFrozenBody()) {\n                        <tbody\n                            role=\"rowgroup\"\n                            [class]=\"cx('tbody')\"\n                            [pBind]=\"ptm('tbody')\"\n                            [value]=\"frozenValue()\"\n                            [frozenRows]=\"true\"\n                            [pTableBody]=\"scrollerOptions.columns\"\n                            [pTableBodyTemplate]=\"frozenBodyTemplate()\"\n                            [unstyled]=\"unstyled()\"\n                            [frozen]=\"true\"\n                            [attr.data-p-virtualscroll]=\"virtualScroll()\"\n                        ></tbody>\n                    }\n                    <tbody\n                        role=\"rowgroup\"\n                        [class]=\"cn(cx('tbody'), scrollerOptions.contentStyleClass)\"\n                        [pBind]=\"ptm('tbody')\"\n                        [style]=\"scrollerOptions.contentStyle\"\n                        [value]=\"dataToRender(scrollerOptions.rows)\"\n                        [pTableBody]=\"scrollerOptions.columns\"\n                        [pTableBodyTemplate]=\"bodyTemplate()\"\n                        [scrollerOptions]=\"scrollerOptions\"\n                        [unstyled]=\"unstyled()\"\n                        [attr.data-p-virtualscroll]=\"virtualScroll()\"\n                    ></tbody>\n                    @if (scrollerOptions.spacerStyle) {\n                        <tbody role=\"rowgroup\" [style]=\"getVirtualScrollerSpacerStyle(scrollerOptions)\" [class]=\"cx('virtualScrollerSpacer')\" [pBind]=\"ptm('virtualScrollerSpacer')\"></tbody>\n                    }\n                    @if (showFooter()) {\n                        <tfoot role=\"rowgroup\" #tfoot [class]=\"cx('footer')\" [style]=\"sx('tfoot')\" [pBind]=\"ptm('tfoot')\">\n                            <ng-container\n                                *ngTemplateOutlet=\"\n                                    footerGroupedTemplate() || footerTemplate();\n                                    context: {\n                                        $implicit: scrollerOptions.columns\n                                    }\n                                \"\n                            ></ng-container>\n                        </tfoot>\n                    }\n                </table>\n            </ng-template>\n        </div>\n\n        @if (showBottomPaginator()) {\n            <p-paginator\n                [rows]=\"rows()\"\n                [first]=\"first()\"\n                [totalRecords]=\"totalRecords()\"\n                [pageLinkSize]=\"pageLinks()\"\n                [alwaysShow]=\"alwaysShowPaginator()\"\n                (onPageChange)=\"onPageChange($event)\"\n                [rowsPerPageOptions]=\"rowsPerPageOptions()\"\n                [templateLeft]=\"paginatorLeftTemplate()\"\n                [templateRight]=\"paginatorRightTemplate()\"\n                [appendTo]=\"paginatorDropdownAppendTo()\"\n                [dropdownScrollHeight]=\"paginatorDropdownScrollHeight()\"\n                [currentPageReportTemplate]=\"currentPageReportTemplate()\"\n                [showFirstLastIcon]=\"showFirstLastIcon()\"\n                [dropdownItemTemplate]=\"paginatorDropdownItemTemplate()\"\n                [showCurrentPageReport]=\"showCurrentPageReport()\"\n                [showJumpToPageDropdown]=\"showJumpToPageDropdown()\"\n                [showJumpToPageInput]=\"showJumpToPageInput()\"\n                [showPageLinks]=\"showPageLinks()\"\n                [class]=\"cn(cx('pcPaginator'), paginatorStyleClass())\"\n                [locale]=\"paginatorLocale()\"\n                [pt]=\"ptm('pcPaginator')\"\n                [unstyled]=\"unstyled()\"\n            >\n                @if (paginatorDropdownIconTemplate()) {\n                    <ng-template #dropdownicon>\n                        <ng-container *ngTemplateOutlet=\"paginatorDropdownIconTemplate()\"></ng-container>\n                    </ng-template>\n                }\n\n                @if (paginatorFirstPageLinkIconTemplate()) {\n                    <ng-template #firstpagelinkicon>\n                        <ng-container *ngTemplateOutlet=\"paginatorFirstPageLinkIconTemplate()\"></ng-container>\n                    </ng-template>\n                }\n\n                @if (paginatorPreviousPageLinkIconTemplate()) {\n                    <ng-template #previouspagelinkicon>\n                        <ng-container *ngTemplateOutlet=\"paginatorPreviousPageLinkIconTemplate()\"></ng-container>\n                    </ng-template>\n                }\n\n                @if (paginatorLastPageLinkIconTemplate()) {\n                    <ng-template #lastpagelinkicon>\n                        <ng-container *ngTemplateOutlet=\"paginatorLastPageLinkIconTemplate()\"></ng-container>\n                    </ng-template>\n                }\n\n                @if (paginatorNextPageLinkIconTemplate()) {\n                    <ng-template #nextpagelinkicon>\n                        <ng-container *ngTemplateOutlet=\"paginatorNextPageLinkIconTemplate()\"></ng-container>\n                    </ng-template>\n                }\n            </p-paginator>\n        }\n\n        @if (summaryTemplate()) {\n            <div [class]=\"cx('footer')\" [pBind]=\"ptm('footer')\">\n                <ng-container *ngTemplateOutlet=\"summaryTemplate()\"></ng-container>\n            </div>\n        }\n\n        @if (resizableColumns()) {\n            <div #resizeHelper [class]=\"cx('columnResizeIndicator')\" [pBind]=\"ptm('columnResizeIndicator')\" [style.display]=\"'none'\"></div>\n        }\n        @if (reorderableColumns()) {\n            <span #reorderIndicatorUp [class]=\"cx('rowReorderIndicatorUp')\" [pBind]=\"ptm('rowReorderIndicatorUp')\" [style.display]=\"'none'\">\n                @if (!reorderIndicatorUpIconTemplate()) {\n                    <svg data-p-icon=\"arrow-down\" [pBind]=\"ptm('rowReorderIndicatorUp')['icon']\" />\n                }\n                <ng-template *ngTemplateOutlet=\"reorderIndicatorUpIconTemplate()\"></ng-template>\n            </span>\n            <span #reorderIndicatorDown [class]=\"cx('rowReorderIndicatorDown')\" [pBind]=\"ptm('rowReorderIndicatorDown')\" [style.display]=\"'none'\">\n                @if (!reorderIndicatorDownIconTemplate()) {\n                    <svg data-p-icon=\"arrow-up\" [pBind]=\"ptm('rowReorderIndicatorDown')['icon']\" />\n                }\n                <ng-template *ngTemplateOutlet=\"reorderIndicatorDownIconTemplate()\"></ng-template>\n            </span>\n