@gravionlabs/helix-core 22.0.0

package/fesm2022/gravionlabs-helix-core-treetable.mjs

@@ -0,0 +1,4199 @@
+export * from '@gravionlabs/helix-core/types/treetable';
+import * as i0 from '@angular/core';
+import { Injectable, InjectionToken, inject, input, booleanAttribute, model, numberAttribute, output, viewChild, contentChild, contentChildren, NgZone, effect, ChangeDetectionStrategy, ViewEncapsulation, Component, Directive, NgModule } from '@angular/core';
+import { BaseStyle } from '@gravionlabs/helix-core/base';
+import * as i2 from '@angular/common';
+import { isPlatformBrowser, CommonModule } from '@angular/common';
+import * as i6 from '@angular/forms';
+import { FormsModule } from '@angular/forms';
+import { resolveFieldData, isEmpty, getOffset, addStyle, findSingle, getIndex, calculateScrollbarWidth, getHiddenElementOuterWidth, getHiddenElementOuterHeight, reorderArray, isClickable, equals, find, removeClass, addClass, calculateScrollbarHeight, clearSelection, invokeElementMethod, focus, isNotEmpty, getAttribute } from '@gravionlabs/helix-core/uix/utils';
+import * as i4 from '@gravionlabs/helix-core/api';
+import { HelixTemplate, FilterService, SharedModule } from '@gravionlabs/helix-core/api';
+import * as i5 from '@gravionlabs/helix-core/badge';
+import { BadgeModule } from '@gravionlabs/helix-core/badge';
+import { BaseComponent, PARENT_INSTANCE } from '@gravionlabs/helix-core/basecomponent';
+import * as i1 from '@gravionlabs/helix-core/bind';
+import { Bind, BindModule } from '@gravionlabs/helix-core/bind';
+import { Checkbox } from '@gravionlabs/helix-core/checkbox';
+import { DomHandler } from '@gravionlabs/helix-core/dom';
+import { SpinnerIcon, ArrowDownIcon, ArrowUpIcon, SortAltIcon, SortAmountUpAltIcon, SortAmountDownIcon, ChevronDownIcon, ChevronRightIcon, CheckIcon } from '@gravionlabs/helix-core/icons';
+import * as i3 from '@gravionlabs/helix-core/paginator';
+import { PaginatorModule } from '@gravionlabs/helix-core/paginator';
+import { Ripple } from '@gravionlabs/helix-core/ripple';
+import { Scroller } from '@gravionlabs/helix-core/scroller';
+import { Subject } from 'rxjs';
+
+const style = /*css*/ `
+/* For Helix */
+.h-treetable {
+    position: relative;
+}
+
+.h-treetable table {
+    border-collapse: collapse;
+    width: 100%;
+    table-layout: fixed;
+}
+
+.h-treetable .h-sortable-column {
+    cursor: pointer;
+    user-select: none;
+}
+
+.h-treetable .h-sortable-column .h-column-title,
+.h-treetable .h-sortable-column .h-sortable-column-icon,
+.h-treetable .h-sortable-column .h-sortable-column-badge {
+    vertical-align: middle;
+}
+
+.h-treetable-sort-icon {
+    color: dt('treetable.sort.icon.color');
+    font-size: dt('treetable.sort.icon.size');
+    width: dt('treetable.sort.icon.size');
+    height: dt('treetable.sort.icon.size');
+    transition: color dt('treetable.transition.duration');
+}
+
+.h-treetable .h-sortable-column .h-sortable-column-badge {
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+}
+
+.h-treetable-auto-layout>.h-treetable-wrapper {
+    overflow-x: auto;
+}
+
+.h-treetable-auto-layout>.h-treetable-wrapper>table {
+    table-layout: auto;
+}
+
+.h-treetable-hoverable-rows .h-treetable-tbody>tr {
+    cursor: pointer;
+}
+
+.h-treetable-toggler {
+    cursor: pointer;
+    user-select: none;
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    vertical-align: middle;
+    overflow: hidden;
+    position: relative;
+}
+
+
+/* Scrollable */
+.h-treetable-scrollable-wrapper {
+    position: relative;
+}
+
+.h-treetable-scrollable-header,
+.h-treetable-scrollable-footer {
+    overflow: hidden;
+    flex-shrink: 0;
+}
+
+.h-treetable-scrollable-body {
+    overflow: auto;
+    position: relative;
+}
+
+.h-treetable-virtual-table {
+    position: absolute;
+}
+
+/* Frozen Columns */
+.h-treetable-frozen-view .h-treetable-scrollable-body {
+    overflow: hidden;
+}
+
+.h-treetable-frozen-view>.h-treetable-scrollable-body>table>.h-treetable-tbody>tr>td:last-child {
+    border-right: 0 none;
+}
+
+.h-treetable-unfrozen-view {
+    position: absolute;
+    top: 0;
+}
+
+/* Flex Scrollable */
+.h-treetable-flex-scrollable {
+    display: flex;
+    flex-direction: column;
+    flex: 1;
+    height: 100%;
+}
+
+.h-treetable-flex-scrollable .h-treetable-scrollable-wrapper,
+.h-treetable-flex-scrollable .h-treetable-scrollable-view {
+    display: flex;
+    flex-direction: column;
+    flex: 1;
+    height: 100%;
+}
+
+.h-treetable-flex-scrollable .h-treetable-virtual-scrollable-body {
+    flex: 1;
+}
+
+/* Resizable */
+.h-treetable-resizable>.h-treetable-wrapper {
+    overflow-x: auto;
+}
+
+.h-treetable-resizable .h-treetable-thead>tr>th,
+.h-treetable-resizable .h-treetable-tfoot>tr>td,
+.h-treetable-resizable .h-treetable-tbody>tr>td {
+    overflow: hidden;
+}
+
+.h-treetable-resizable .h-resizable-column {
+    background-clip: padding-box;
+    position: relative;
+}
+
+.h-treetable-resizable-fit .h-resizable-column:last-child .h-column-resizer {
+    display: none;
+}
+
+.h-treetable .h-column-resizer {
+    display: block;
+    position: absolute;
+    top: 0;
+    right: 0;
+    margin: 0;
+    width: dt('treetable.column.resizer.width');
+    height: 100%;
+    padding: 0px;
+    cursor: col-resize;
+    border: 1px solid transparent;
+}
+
+.h-treetable .h-column-resizer-helper {
+    width: dt('treetable.resize.indicator.width');
+    position: absolute;
+    z-index: 10;
+    display: none;
+    background: dt('treetable.resize.indicator.color');
+}
+
+.h-treetable .h-row-editor-init,
+.h-treetable .h-row-editor-save,
+.h-treetable .h-row-editor-cancel {
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    overflow: hidden;
+    position: relative;
+}
+
+
+/* Reorder */
+.h-treetable-reorder-indicator-up,
+.h-treetable-reorder-indicator-down {
+    position: absolute;
+    display: none;
+}
+
+[ttReorderableColumn] {
+    cursor: move;
+}
+
+/* Loader */
+.h-treetable-mask {
+    position: absolute !important;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    z-index: 2;
+}
+
+.h-treetable-loading-icon {
+    font-size: dt('treetable.loading.icon.size');
+    width: dt('treetable.loading.icon.size');
+    height: dt('treetable.loading.icon.size');
+}
+
+/* Virtual Scroll */
+.h-treetable .h-scroller-loading {
+    transform: none !important;
+    min-height: 0;
+    position: sticky;
+    top: 0;
+    left: 0;
+}
+
+.h-treetable .h-paginator-top {
+    border-color: dt('treetable.paginator.top.border.color');
+    border-style: solid;
+    border-width: dt('treetable.paginator.top.border.width');
+}
+
+.h-treetable .h-paginator-bottom {
+    border-color: dt('treetable.paginator.bottom.border.color');
+    border-style: solid;
+    border-width: dt('treetable.paginator.bottom.border.width');
+}
+
+.h-treetable .h-treetable-header {
+    background: dt('treetable.header.background');
+    color: dt('treetable.header.color');
+    border-color: dt('treetable.header.border.color');
+    border-style: solid;
+    border-width: dt('treetable.header.border.width');
+    padding: dt('treetable.header.padding');
+    font-weight: dt('treetable.column.title.font.weight');
+}
+
+.h-treetable .h-treetable-footer {
+    background: dt('treetable.footer.background');
+    color: dt('treetable.footer.color');
+    border-color: dt('treetable.footer.border.color');
+    border-style: solid;
+    border-width: dt('treetable.footer.border.width');
+    padding: dt('treetable.footer.padding');
+    font-weight: dt('treetable.column.footer.font.weight');
+}
+
+.h-treetable .h-treetable-thead>tr>th {
+    padding: dt('treetable.header.cell.padding');
+    background: dt('treetable.header.cell.background');
+    border-color: dt('treetable.header.cell.border.color');
+    border-style: solid;
+    border-width: 0 0 1px 0;
+    color: dt('treetable.header.cell.color');
+    font-weight: dt('treetable.column.title.font.weight');
+    text-align: start;
+    transition: background dt('treetable.transition.duration'), color dt('treetable.transition.duration'), border-color dt('treetable.transition.duration'),
+            outline-color dt('treetable.transition.duration'), box-shadow dt('treetable.transition.duration');
+}
+
+.h-treetable .h-treetable-tfoot>tr>td {
+    text-align: start;
+    padding: dt('treetable.footer.cell.padding');
+    border-color: dt('treetable.footer.cell.border.color');
+    border-style: solid;
+    border-width: 0 0 1px 0;
+    color: dt('treetable.footer.cell.color');
+    background: dt('treetable.footer.cell.background');
+    font-weight: dt('treetable.column.footer.font.weight');
+}
+
+.h-treetable .h-sortable-column {
+    cursor: pointer;
+    user-select: none;
+    outline-color: transparent;
+    vertical-align: middle;
+}
+
+.h-treetable .h-sortable-column .h-sortable-column-icon {
+    color: dt('treetable.sort.icon.color');
+    transition: color dt('treetable.transition.duration');
+}
+
+
+.h-treetable .h-sortable-column:not(.h-treetable-column-sorted):hover {
+    background: dt('treetable.header.cell.hover.background');
+    color: dt('treetable.header.cell.hover.color');
+}
+
+.h-treetable .h-sortable-column:not(.h-treetable-column-sorted):hover .h-treetable-sort-icon {
+    color: dt('treetable.sort.icon.hover.color');
+}
+
+.h-treetable .h-sortable-column.h-treetable-column-sorted {
+    background: dt('treetable.header.cell.selected.background');
+    color: dt('treetable.header.cell.selected.color');
+}
+
+.h-treetable .h-sortable-column.h-treetable-column-sorted .h-treetable-sort-icon {
+    color: dt('treetable.header.cell.selected.color');
+}
+
+.h-treetable .h-sortable-column:focus-visible {
+    box-shadow: dt('treetable.header.cell.focus.ring.shadow');
+    outline: dt('treetable.header.cell.focus.ring.width') dt('treetable.header.cell.focus.ring.style') dt('treetable.header.cell.focus.ring.color');
+    outline-offset: dt('treetable.header.cell.focus.ring.offset');
+}
+
+.h-treetable-hoverable .h-treetable-selectable-row {
+    cursor: pointer;
+}
+
+.h-treetable .h-treetable-tbody > tr {
+    outline-color: transparent;
+    background: dt('treetable.row.background');
+    color: dt('treetable.row.color');
+}
+
+.h-treetable .h-treetable-tbody>tr>td {
+    text-align: start;
+    border-color: dt('treetable.body.cell.border.color');
+    border-style: solid;
+    border-width: 0 0 1px 0;
+    padding: dt('treetable.body.cell.padding');
+}
+
+.h-treetable .h-treetable-tbody>tr>td .h-treetable-toggler {
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    overflow: hidden;
+    position: relative;
+    width: dt('treetable.node.toggle.button.size');
+    height: dt('treetable.node.toggle.button.size');
+    color: dt('treetable.node.toggle.button.color');
+    border: 0 none;
+    background: transparent;
+    cursor: pointer;
+    border-radius: dt('treetable.node.toggle.button.border.radius');
+    transition: background dt('treetable.transition.duration'), color dt('treetable.transition.duration'), border-color dt('treetable.transition.duration'),
+            outline-color dt('treetable.transition.duration'), box-shadow dt('treetable.transition.duration');
+    outline-color: transparent;
+    user-select: none;
+}
+
+.h-treetable .h-treetable-tbody>tr>td .h-treetable-toggler:enabled:hover {
+    color: dt('treetable.node.toggle.button.hover.color');
+    background: dt('treetable.node.toggle.button.hover.background');
+}
+
+.h-treetable .h-treetable-tbody>tr>tr.treetable-row-selected .h-treetable-toggler:hover {
+    background: dt('treetable.node.toggle.button.selected.hover.background');
+    color: dt('treetable.node.toggle.button.selected.hover.color');
+}
+
+.h-treetable .h-treetable-tbody>tr>td .h-treetable-toggler:focus-visible {
+    box-shadow: dt('treetable.node.toggle.button.focus.ring.shadow');
+    outline: dt('treetable.node.toggle.button.focus.ring.width') dt('treetable.node.toggle.button.focus.ring.style') dt('treetable.node.toggle.button.focus.ring.color');
+    outline-offset: dt('treetable.node.toggle.button.focus.ring.offset');
+}
+
+
+.h-treetable .h-treetable-tbody>tr.h-treetable-row-selected {
+    background: dt('treetable.row.selected.background');
+    color: dt('treetable.row.selected.color');
+}
+
+.h-treetable-tbody > tr:focus-visible,
+.h-treetable-tbody > tr.h-treetable-contextmenu-row-selected {
+    box-shadow: dt('treetable.row.focus.ring.shadow');
+    outline: dt('treetable.row.focus.ring.width') dt('treetable.row.focus.ring.style') dt('treetable.row.focus.ring.color');
+    outline-offset: dt('treetable.row.focus.ring.offset');
+}
+
+.h-treetable .h-treetable-tbody>tr.h-treetable-row-selected .h-treetable-toggler {
+    color: inherit;
+}
+
+.h-treetable .h-treetable-tbody>tr.h-treetable-row-selected .h-treetable-toggler:hover {
+    background: dt('treetable.node.toggle.button.selected.hover.background');
+    color: dt('treetable.node.toggle.button.selected.hover.color');
+}
+
+.h-treetable.h-treetable-hoverable-rows .h-treetable-tbody>tr:not(.h-treetable-row-selected):hover {
+    background: dt('treetable.row.hover.background');
+    color: dt('treetable.row.hover.color');
+}
+
+.h-treetable-gridlines .h-treetable-header {
+    border-width: 1px 1px 0 1px;
+}
+
+.h-treetable-gridlines .h-treetable-footer {
+    border-width: 0 1px 1px 1px;
+}
+
+.h-treetable-gridlines .h-treetable-paginator-top {
+    border-width: 1px 1px 0 1px;
+}
+
+.h-treetable-gridlines .h-treetable-paginator-bottom {
+    border-width: 0 1px 1px 1px;
+}
+
+.h-treetable-gridlines .h-treetable-thead > tr > th {
+    border-width: 1px 0 1px 1px;
+}
+
+.h-treetable-gridlines .h-treetable-thead > tr > th:last-child {
+    border-width: 1px;
+}
+
+.h-treetable-gridlines .h-treetable-tbody > tr > td {
+    border-width: 1px 0 0 1px;
+}
+
+.h-treetable-gridlines .h-treetable-tbody > tr > td:last-child {
+    border-width: 1px 1px 0 1px;
+}
+
+.h-treetable-gridlines .h-treetable-tbody > tr:last-child > td {
+    border-width: 1px 0 1px 1px;
+}
+
+.h-treetable-gridlines .h-treetable-tbody > tr:last-child > td:last-child {
+    border-width: 1px;
+}
+
+.h-treetable-gridlines .h-treetable-tfoot > tr > td {
+    border-width: 1px 0 1px 1px;
+}
+
+.h-treetable-gridlines .h-treetable-tfoot > tr > td:last-child {
+    border-width: 1px 1px 1px 1px;
+}
+
+.h-treetable.h-treetable-gridlines .h-treetable-thead + .h-treetable-tfoot > tr > td {
+    border-width: 0 0 1px 1px;
+}
+
+.h-treetable.h-treetable-gridlines .h-treetable-thead + .h-treetable-tfoot > tr > td:last-child {
+    border-width: 0 1px 1px 1px;
+}
+
+.h-treetable.h-treetable-gridlines:has(.h-treetable-thead):has(.h-treetable-tbody) .h-treetable-tbody > tr > td {
+    border-width: 0 0 1px 1px;
+}
+
+.h-treetable.h-treetable-gridlines:has(.h-treetable-thead):has(.h-treetable-tbody) .h-treetable-tbody > tr > td:last-child {
+    border-width: 0 1px 1px 1px;
+}
+
+.h-treetable.h-treetable-gridlines:has(.h-treetable-tbody):has(.h-treetable-tfoot) .h-treetable-tbody > tr:last-child > td {
+    border-width: 0 0 0 1px;
+}
+
+.h-treetable.h-treetable-gridlines:has(.h-treetable-tbody):has(.h-treetable-tfoot) .h-treetable-tbody > tr:last-child > td:last-child {
+    border-width: 0 1px 0 1px;
+}
+
+.h-treetable.h-treetable-sm .h-treetable-header {
+    padding: 0.65625rem 0.875rem;
+}
+
+.h-treetable.h-treetable-sm .h-treetable-thead>tr>th {
+    padding: 0.375rem 0.5rem;
+}
+
+.h-treetable.h-treetable-sm .h-treetable-tbody>tr>td {
+    padding: 0.375rem 0.5rem;
+}
+
+.h-treetable.h-treetable-sm .h-treetable-tfoot>tr>td {
+    padding: 0.375rem 0.5rem;
+}
+
+.h-treetable.h-treetable-sm .h-treetable-footer {
+    padding: 0.375rem 0.5rem;
+}
+
+.h-treetable.h-treetable-lg .h-treetable-header {
+    padding: 0.9375rem 1.25rem;
+}
+
+.h-treetable.h-treetable-lg .h-treetable-thead>tr>th {
+    padding: 0.9375rem 1.25rem;
+}
+
+.h-treetable.h-treetable-lg .h-treetable-tbody>tr>td {
+    padding: 0.9375rem 1.25rem;
+}
+
+.h-treetable.h-treetable-lg .h-treetable-tfoot>tr>td {
+    padding: 0.9375rem 1.25rem;
+}
+
+.h-treetable.h-treetable-lg .h-treetable-footer {
+    padding: 0.9375rem 1.25rem;
+}
+
+h-treetabletoggler + h-treetablecheckbox .h-checkbox,
+h-treetable-toggler + h-treetable-checkbox .h-checkbox,
+h-tree-table-toggler + h-tree-table-checkbox .h-checkbox {
+    vertical-align: middle;
+}
+
+h-treetabletoggler + h-treetablecheckbox + span,
+h-treetable-toggler + h-treetable-checkbox + span,
+h-tree-table-toggler + h-tree-table-checkbox + span {
+    vertical-align: middle;
+}
+
+h-treetable-sort-icon {
+    display: inline-flex;
+    align-items: center;
+    gap: dt('treetable.header.cell.gap');
+}
+`;
+const classes = {
+    root: ({ instance }) => [
+        'h-treetable h-component',
+        {
+            'h-treetable-gridlines': instance.showGridlines,
+            'h-treetable-hoverable-rows': instance.rowHover || instance.selectionMode === 'single' || instance.selectionMode === 'multiple',
+            'h-treetable-auto-layout': instance.autoLayout,
+            'h-treetable-resizable': instance.resizableColumns,
+            'h-treetable-resizable-fit': instance.resizableColumns && instance.columnResizeMode === 'fit',
+            'h-treetable-flex-scrollable': instance.scrollable && instance.scrollHeight === 'flex'
+        }
+    ],
+    loading: 'h-treetable-loading',
+    mask: 'h-treetable-mask h-overlay-mask',
+    loadingIcon: 'h-treetable-loading-icon',
+    header: 'h-treetable-header',
+    pcPaginator: ({ instance }) => ['h-treetable-paginator-' + instance.paginatorPosition, instance.paginatorStyleClass],
+    tableContainer: 'h-treetable-table-container',
+    table: ({ instance }) => ({
+        'h-treetable-table': true,
+        'h-treetable-scrollable-table': instance.scrollable,
+        'h-treetable-resizable-table': instance.resizableColumns,
+        'h-treetable-resizable-table-fit': instance.resizableColumns && instance.columnResizeMode === 'fit'
+    }),
+    thead: 'h-treetable-thead',
+    sortableColumn: ({ instance }) => ({
+        'h-sortable-column': instance.isEnabled(),
+        'h-treetable-column-sorted': instance.sorted
+    }),
+    sortableColumnIcon: 'h-treetable-sort-icon',
+    sortableColumnBadge: 'h-sortable-column-badge',
+    columnResizer: 'h-treetable-column-resizer',
+    columnHeaderContent: 'h-treetable-column-header-content',
+    columnTitle: 'h-treetable-column-title',
+    sortIcon: 'h-treetable-sort-icon',
+    pcSortBadge: 'h-treetable-sort-badge',
+    tbody: 'h-treetable-tbody',
+    row: ({ instance }) => ({
+        'h-treetable-row-selected': instance.selected
+    }),
+    contextMenuRow: ({ instance }) => ({
+        'h-treetable-contextmenu-row-selected': instance.selected
+    }),
+    toggler: 'h-treetable-toggler',
+    nodeToggleButton: 'h-treetable-node-toggle-button',
+    nodeToggleIcon: 'h-treetable-node-toggle-icon',
+    pcNodeCheckbox: 'h-treetable-node-checkbox',
+    tfoot: 'h-treetable-tfoot',
+    footerCell: ({ instance }) => ({
+        'h-treetable-frozen-column': instance.columnProp('frozen')
+    }),
+    footer: 'h-treetable-footer',
+    columnResizeIndicator: 'h-treetable-column-resize-indicator',
+    wrapper: 'h-treetable-wrapper',
+    scrollableWrapper: 'h-treetable-scrollable-wrapper',
+    scrollableView: 'h-treetable-scrollable-view',
+    frozenView: 'h-treetable-frozen-view',
+    columnResizerHelper: 'h-column-resizer-helper',
+    reorderIndicatorUp: 'h-treetable-reorder-indicator-up',
+    reorderIndicatorDown: 'h-treetable-reorder-indicator-down',
+    scrollableHeader: 'h-treetable-scrollable-header',
+    scrollableHeaderBox: 'h-treetable-scrollable-header-box',
+    scrollableHeaderTable: 'h-treetable-scrollable-header-table',
+    scrollableBody: 'h-treetable-scrollable-body',
+    scrollableFooter: 'h-treetable-scrollable-footer',
+    scrollableFooterBox: 'h-treetable-scrollable-footer-box',
+    scrollableFooterTable: 'h-treetable-scrollable-footer-table'
+};
+class TreeTableStyle extends BaseStyle {
+    name = 'treetable';
+    style = style;
+    classes = classes;
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: TreeTableStyle, deps: null, target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: TreeTableStyle });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: TreeTableStyle, decorators: [{
+            type: Injectable
+        }] });
+/**
+ *
+ * TreeTable is used to display hierarchical data in tabular format.
+ *
+ * [Live Demo](https://www.primeng.org/treetable/)
+ *
+ * @module treetablestyle
+ *
+ */
+var TreeTableClasses;
+(function (TreeTableClasses) {
+    /**
+     * Class name of the root element
+     */
+    TreeTableClasses["root"] = "h-treetable";
+    /**
+     * Class name of the loading element
+     */
+    TreeTableClasses["loading"] = "h-treetable-loading";
+    /**
+     * Class name of the mask element
+     */
+    TreeTableClasses["mask"] = "h-treetable-mask";
+    /**
+     * Class name of the loading icon element
+     */
+    TreeTableClasses["loadingIcon"] = "h-treetable-loading-icon";
+    /**
+     * Class name of the header element
+     */
+    TreeTableClasses["header"] = "h-treetable-header";
+    /**
+     * Class name of the paginator element
+     */
+    TreeTableClasses["pcPaginator"] = "h-treetable-paginator-[position]";
+    /**
+     * Class name of the table container element
+     */
+    TreeTableClasses["tableContainer"] = "h-treetable-table-container";
+    /**
+     * Class name of the table element
+     */
+    TreeTableClasses["table"] = "h-treetable-table";
+    /**
+     * Class name of the thead element
+     */
+    TreeTableClasses["thead"] = "h-treetable-thead";
+    /**
+     * Class name of the column resizer element
+     */
+    TreeTableClasses["columnResizer"] = "h-treetable-column-resizer";
+    /**
+     * Class name of the column title element
+     */
+    TreeTableClasses["columnTitle"] = "h-treetable-column-title";
+    /**
+     * Class name of the sort icon element
+     */
+    TreeTableClasses["sortIcon"] = "h-treetable-sort-icon";
+    /**
+     * Class name of the sort badge element
+     */
+    TreeTableClasses["pcSortBadge"] = "h-treetable-sort-badge";
+    /**
+     * Class name of the tbody element
+     */
+    TreeTableClasses["tbody"] = "h-treetable-tbody";
+    /**
+     * Class name of the node toggle button element
+     */
+    TreeTableClasses["nodeToggleButton"] = "h-treetable-node-toggle-button";
+    /**
+     * Class name of the node toggle icon element
+     */
+    TreeTableClasses["nodeToggleIcon"] = "h-treetable-node-toggle-icon";
+    /**
+     * Class name of the node checkbox element
+     */
+    TreeTableClasses["pcNodeCheckbox"] = "h-treetable-node-checkbox";
+    /**
+     * Class name of the empty message element
+     */
+    TreeTableClasses["emptyMessage"] = "h-treetable-empty-message";
+    /**
+     * Class name of the tfoot element
+     */
+    TreeTableClasses["tfoot"] = "h-treetable-tfoot";
+    /**
+     * Class name of the footer element
+     */
+    TreeTableClasses["footer"] = "h-treetable-footer";
+    /**
+     * Class name of the column resize indicator element
+     */
+    TreeTableClasses["columnResizeIndicator"] = "h-treetable-column-resize-indicator";
+    /**
+     * Class name of the wrapper element
+     */
+    TreeTableClasses["wrapper"] = "h-treetable-wrapper";
+    /**
+     * Class name of the scrollable wrapper element
+     */
+    TreeTableClasses["scrollableWrapper"] = "h-treetable-scrollable-wrapper";
+    /**
+     * Class name of the scrollable view element
+     */
+    TreeTableClasses["scrollableView"] = "h-treetable-scrollable-view";
+    /**
+     * Class name of the frozen view element
+     */
+    TreeTableClasses["frozenView"] = "h-treetable-frozen-view";
+    /**
+     * Class name of the column resizer helper element
+     */
+    TreeTableClasses["columnResizerHelper"] = "h-treetable-column-resizer-helper";
+    /**
+     * Class name of the reorder indicator up element
+     */
+    TreeTableClasses["reorderIndicatorUp"] = "h-treetable-reorder-indicator-up";
+    /**
+     * Class name of the reorder indicator down element
+     */
+    TreeTableClasses["reorderIndicatorDown"] = "h-treetable-reorder-indicator-down";
+    /**
+     * Class name of the scrollable header element
+     */
+    TreeTableClasses["scrollableHeader"] = "h-treetable-scrollable-header";
+    /**
+     * Class name of the scrollable header box element
+     */
+    TreeTableClasses["scrollableHeaderBox"] = "h-treetable-scrollable-header-box";
+    /**
+     * Class name of the scrollable header table element
+     */
+    TreeTableClasses["scrollableHeaderTable"] = "h-treetable-scrollable-header-table";
+    /**
+     * Class name of the scrollable body element
+     */
+    TreeTableClasses["scrollableBody"] = "h-treetable-scrollable-body";
+    /**
+     * Class name of the scrollable footer element
+     */
+    TreeTableClasses["scrollableFooter"] = "h-treetable-scrollable-footer";
+    /**
+     * Class name of the scrollable footer box element
+     */
+    TreeTableClasses["scrollableFooterBox"] = "h-treetable-scrollable-footer-box";
+    /**
+     * Class name of the scrollable footer table element
+     */
+    TreeTableClasses["scrollableFooterTable"] = "h-treetable-scrollable-footer-table";
+    /**
+     * Class name of the sortable column icon element
+     */
+    TreeTableClasses["sortableColumnIcon"] = "h-sortable-column-icon";
+})(TreeTableClasses || (TreeTableClasses = {}));
+
+const TREETABLE_INSTANCE = new InjectionToken('TREETABLE_INSTANCE');
+class TreeTableService {
+    sortSource = new Subject();
+    selectionSource = new Subject();
+    contextMenuSource = new Subject();
+    uiUpdateSource = new Subject();
+    totalRecordsSource = new Subject();
+    sortSource$ = this.sortSource.asObservable();
+    selectionSource$ = this.selectionSource.asObservable();
+    contextMenuSource$ = this.contextMenuSource.asObservable();
+    uiUpdateSource$ = this.uiUpdateSource.asObservable();
+    totalRecordsSource$ = this.totalRecordsSource.asObservable();
+    onSort(sortMeta) {
+        this.sortSource.next(sortMeta);
+    }
+    onSelectionChange() {
+        this.selectionSource.next(null);
+    }
+    onContextMenu(node) {
+        this.contextMenuSource.next(node);
+    }
+    onUIUpdate(value) {
+        this.uiUpdateSource.next(value);
+    }
+    onTotalRecordsChange(value) {
+        this.totalRecordsSource.next(value);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: TreeTableService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: TreeTableService });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: TreeTableService, decorators: [{
+            type: Injectable
+        }] });
+/**
+ * TreeTable is used to display hierarchical data in tabular format.
+ * @group Components
+ */
+class TreeTable extends BaseComponent {
+    componentName = 'TreeTable';
+    _componentStyle = inject(TreeTableStyle);
+    bindDirectiveInstance = inject(Bind, { self: true });
+    onAfterViewChecked() {
+        this.bindDirectiveInstance.setAttrs(this.ptms(['host', 'root']));
+    }
+    /**
+     * An array of objects to represent dynamic columns.
+     * @group Props
+     */
+    columns = input(/* @ts-ignore */
+    ...(ngDevMode ? [undefined, { debugName: "columns" }] : /* istanbul ignore next */ []));
+    /**
+     * Style class of the component.
+     * @deprecated since v20.0.0, use `class` instead.
+     * @group Props
+     */
+    styleClass = input(/* @ts-ignore */
+    ...(ngDevMode ? [undefined, { debugName: "styleClass" }] : /* 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 */ []));
+    /**
+     * Whether the cell widths scale according to their content or not.
+     * @group Props
+     */
+    autoLayout = input(undefined, { ...(ngDevMode ? { debugName: "autoLayout" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    /**
+     * Defines if data is loaded and interacted with in lazy manner.
+     * @group Props
+     */
+    lazy = input(false, { ...(ngDevMode ? { debugName: "lazy" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    /**
+     * Whether to call lazy loading on initialization.
+     * @group Props
+     */
+    lazyLoadOnInit = input(true, { ...(ngDevMode ? { debugName: "lazyLoadOnInit" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    /**
+     * When specified as true, enables the pagination.
+     * @group Props
+     */
+    paginator = input(undefined, { ...(ngDevMode ? { debugName: "paginator" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    /**
+     * Number of rows to display per page.
+     * @group Props
+     */
+    rows = model(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "rows" }] : /* istanbul ignore next */ []));
+    /**
+     * Index of the first row to be displayed.
+     * @group Props
+     */
+    first = model(0, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "first" }] : /* istanbul ignore next */ []));
+    /**
+     * 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.
+     * @group Props
+     */
+    paginatorPosition = input('bottom', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "paginatorPosition" }] : /* istanbul ignore next */ []));
+    /**
+     * Custom style class for paginator
+     * @group Props
+     */
+    paginatorStyleClass = input(/* @ts-ignore */
+    ...(ngDevMode ? [undefined, { debugName: "paginatorStyleClass" }] : /* istanbul ignore next */ []));
+    /**
+     * Target element to attach the paginator dropdown overlay, valid values are "body" or a local ng-template variable of another element (note: use binding with brackets for template variables, e.g. [appendTo]="mydiv" for a div element having #mydiv as variable name).
+     * @group Props
+     */
+    paginatorDropdownAppendTo = input(/* @ts-ignore */
+    ...(ngDevMode ? [undefined, { debugName: "paginatorDropdownAppendTo" }] : /* istanbul ignore next */ []));
+    /**
+     * Template of the current page report element. Available placeholders are {currentPage},{totalPages},{rows},{first},{last} and {totalRecords}
+     * @group Props
+     */
+    currentPageReportTemplate = input('{currentPage} of {totalPages}', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "currentPageReportTemplate" }] : /* istanbul ignore next */ []));
+    /**
+     * Whether to display current page report.
+     * @group Props
+     */
+    showCurrentPageReport = input(undefined, { ...(ngDevMode ? { debugName: "showCurrentPageReport" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    /**
+     * Whether to display a dropdown to navigate to any page.
+     * @group Props
+     */
+    showJumpToPageDropdown = input(undefined, { ...(ngDevMode ? { debugName: "showJumpToPageDropdown" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    /**
+     * When enabled, icons are displayed on paginator to go first and last page.
+     * @group Props
+     */
+    showFirstLastIcon = input(true, { ...(ngDevMode ? { debugName: "showFirstLastIcon" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    /**
+     * Whether to show page links.
+     * @group Props
+     */
+    showPageLinks = input(true, { ...(ngDevMode ? { debugName: "showPageLinks" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    /**
+     * Sort order to use when an unsorted column gets sorted by user interaction.
+     * @group Props
+     */
+    defaultSortOrder = input(1, { ...(ngDevMode ? { debugName: "defaultSortOrder" } : /* istanbul ignore next */ {}), transform: numberAttribute });
+    /**
+     * Defines whether sorting works on single column or on multiple columns.
+     * @group Props
+     */
+    sortMode = input('single', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "sortMode" }] : /* istanbul ignore next */ []));
+    /**
+     * When true, resets paginator to first page after sorting.
+     * @group Props
+     */
+    resetPageOnSort = input(true, { ...(ngDevMode ? { debugName: "resetPageOnSort" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    /**
+     * Whether to use the default sorting or a custom one using sortFunction.
+     * @group Props
+     */
+    customSort = input(undefined, { ...(ngDevMode ? { debugName: "customSort" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    /**
+     * Specifies the selection mode, valid values are "single" and "multiple".
+     * @group Props
+     */
+    selectionMode = input(/* @ts-ignore */
+    ...(ngDevMode ? [undefined, { debugName: "selectionMode" }] : /* istanbul ignore next */ []));
+    /**
+     * Selected row with a context menu.
+     * @group Props
+     */
+    contextMenuSelection = model(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "contextMenuSelection" }] : /* istanbul ignore next */ []));
+    /**
+     * Mode of the contet menu selection.
+     * @group Props
+     */
+    contextMenuSelectionMode = input('separate', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "contextMenuSelectionMode" }] : /* istanbul ignore next */ []));
+    /**
+     * A property to uniquely identify a record in data.
+     * @group Props
+     */
+    dataKey = input(/* @ts-ignore */
+    ...(ngDevMode ? [undefined, { debugName: "dataKey" }] : /* istanbul ignore next */ []));
+    /**
+     * Defines whether metaKey is should be considered for the selection. On touch enabled devices, metaKeySelection is turned off automatically.
+     * @group Props
+     */
+    metaKeySelection = input(false, { ...(ngDevMode ? { debugName: "metaKeySelection" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    /**
+     * Algorithm to define if a row is selected, valid values are "equals" that compares by reference and "deepEquals" that compares all fields.
+     * @group Props
+     */
+    compareSelectionBy = input('deepEquals', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "compareSelectionBy" }] : /* istanbul ignore next */ []));
+    /**
+     * Adds hover effect to rows without the need for selectionMode.
+     * @group Props
+     */
+    rowHover = input(undefined, { ...(ngDevMode ? { debugName: "rowHover" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    /**
+     * Displays a loader to indicate data load is in progress.
+     * @group Props
+     */
+    loading = input(undefined, { ...(ngDevMode ? { debugName: "loading" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    /**
+     * The icon to show while indicating data load is in progress.
+     * @group Props
+     */
+    loadingIcon = input(/* @ts-ignore */
+    ...(ngDevMode ? [undefined, { debugName: "loadingIcon" }] : /* istanbul ignore next */ []));
+    /**
+     * Whether to show the loading mask when loading property is true.
+     * @group Props
+     */
+    showLoader = input(true, { ...(ngDevMode ? { debugName: "showLoader" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    /**
+     * When specified, enables horizontal and/or vertical scrolling.
+     * @group Props
+     */
+    scrollable = input(undefined, { ...(ngDevMode ? { debugName: "scrollable" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    /**
+     * Height of the scroll viewport in fixed pixels or the "flex" keyword for a dynamic size.
+     * @group Props
+     */
+    scrollHeight = input(/* @ts-ignore */
+    ...(ngDevMode ? [undefined, { debugName: "scrollHeight" }] : /* istanbul ignore next */ []));
+    /**
+     * Whether the data should be loaded on demand during scroll.
+     * @group Props
+     */
+    virtualScroll = input(undefined, { ...(ngDevMode ? { debugName: "virtualScroll" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    /**
+     * Height of a row to use in calculations of virtual scrolling.
+     * @group Props
+     */
+    virtualScrollItemSize = input(undefined, { ...(ngDevMode ? { debugName: "virtualScrollItemSize" } : /* istanbul ignore next */ {}), transform: numberAttribute });
+    /**
+     * Whether to use the scroller feature. The properties of scroller component can be used like an object in it.
+     * @group Props
+     */
+    virtualScrollOptions = input(/* @ts-ignore */
+    ...(ngDevMode ? [undefined, { debugName: "virtualScrollOptions" }] : /* istanbul ignore next */ []));
+    /**
+     * The delay (in milliseconds) before triggering the virtual scroll. This determines the time gap between the user's scroll action and the actual rendering of the next set of items in the virtual scroll.
+     * @group Props
+     */
+    virtualScrollDelay = input(150, { ...(ngDevMode ? { debugName: "virtualScrollDelay" } : /* istanbul ignore next */ {}), transform: numberAttribute });
+    /**
+     * Width of the frozen columns container.
+     * @group Props
+     */
+    frozenWidth = input(/* @ts-ignore */
+    ...(ngDevMode ? [undefined, { debugName: "frozenWidth" }] : /* istanbul ignore next */ []));
+    /**
+     * An array of objects to represent dynamic columns that are frozen.
+     * @group Props
+     */
+    frozenColumns = input(/* @ts-ignore */
+    ...(ngDevMode ? [undefined, { debugName: "frozenColumns" }] : /* istanbul ignore next */ []));
+    /**
+     * When enabled, columns can be resized using drag and drop.
+     * @group Props
+     */
+    resizableColumns = input(undefined, { ...(ngDevMode ? { debugName: "resizableColumns" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    /**
+     * Defines whether the overall table width should change on column resize, valid values are "fit" and "expand".
+     * @group Props
+     */
+    columnResizeMode = input('fit', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "columnResizeMode" }] : /* istanbul ignore next */ []));
+    /**
+     * When enabled, columns can be reordered using drag and drop.
+     * @group Props
+     */
+    reorderableColumns = input(undefined, { ...(ngDevMode ? { debugName: "reorderableColumns" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    /**
+     * Local ng-template varilable of a ContextMenu.
+     * @group Props
+     */
+    contextMenu = input(/* @ts-ignore */
+    ...(ngDevMode ? [undefined, { debugName: "contextMenu" }] : /* istanbul ignore next */ []));
+    /**
+     * Function to optimize the dom operations by delegating to ngForTrackBy, default algorithm checks for object identity.
+     * @group Props
+     */
+    rowTrackBy = input((index, item) => item, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "rowTrackBy" }] : /* istanbul ignore next */ []));
+    /**
+     * An array of FilterMetadata objects to provide external filters.
+     * @group Props
+     */
+    filters = input({}, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "filters" }] : /* istanbul ignore next */ []));
+    /**
+     * An array of fields as string to use in global filtering.
+     * @group Props
+     */
+    globalFilterFields = input(/* @ts-ignore */
+    ...(ngDevMode ? [undefined, { debugName: "globalFilterFields" }] : /* istanbul ignore next */ []));
+    /**
+     * Delay in milliseconds before filtering the data.
+     * @group Props
+     */
+    filterDelay = input(300, { ...(ngDevMode ? { debugName: "filterDelay" } : /* istanbul ignore next */ {}), transform: numberAttribute });
+    /**
+     * Mode for filtering valid values are "lenient" and "strict". Default is lenient.
+     * @group Props
+     */
+    filterMode = input('lenient', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "filterMode" }] : /* istanbul ignore next */ []));
+    /**
+     * Locale to use in filtering. The default locale is the host environment's current locale.
+     * @group Props
+     */
+    filterLocale = input(/* @ts-ignore */
+    ...(ngDevMode ? [undefined, { debugName: "filterLocale" }] : /* istanbul ignore next */ []));
+    /**
+     * Locale to be used in paginator formatting.
+     * @group Props
+     */
+    paginatorLocale = input(/* @ts-ignore */
+    ...(ngDevMode ? [undefined, { debugName: "paginatorLocale" }] : /* istanbul ignore next */ []));
+    /**
+     * Number of total records, defaults to length of value when not defined.
+     * @group Props
+     */
+    totalRecords = model(0, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "totalRecords" }] : /* istanbul ignore next */ []));
+    /**
+     * Name of the field to sort data by default.
+     * @group Props
+     */
+    sortField = model(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "sortField" }] : /* istanbul ignore next */ []));
+    /**
+     * Order to sort when default sorting is enabled.
+     * @defaultValue 1
+     * @group Props
+     */
+    sortOrder = model(1, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "sortOrder" }] : /* istanbul ignore next */ []));
+    /**
+     * An array of SortMeta objects to sort the data by default in multiple sort mode.
+     * @defaultValue null
+     * @group Props
+     */
+    multiSortMeta = model(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "multiSortMeta" }] : /* istanbul ignore next */ []));
+    /**
+     * Selected row in single mode or an array of values in multiple mode.
+     * @defaultValue null
+     * @group Props
+     */
+    selection = model(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "selection" }] : /* istanbul ignore next */ []));
+    /**
+     * An array of objects to display.
+     * @defaultValue null
+     * @group Props
+     */
+    value = model([], /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
+    /**
+     * Indicates the height of rows to be scrolled.
+     * @defaultValue 28
+     * @group Props
+     * @deprecated use virtualScrollItemSize property instead.
+     */
+    virtualRowHeight = input(28, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "virtualRowHeight" }] : /* istanbul ignore next */ []));
+    /**
+     * A map of keys to control the selection state.
+     * @group Props
+     */
+    selectionKeys = model(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "selectionKeys" }] : /* istanbul ignore next */ []));
+    /**
+     * Whether to show grid lines between cells.
+     * @defaultValue false
+     * @group Props
+     */
+    showGridlines = input(false, { ...(ngDevMode ? { debugName: "showGridlines" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    /**
+     * Callback to invoke on selected node change.
+     * Emitted automatically as `selectionChange` via the `selection` model.
+     * @param {TreeTableNode} object - Node instance.
+     * @group Emits
+     */
+    /**
+     * Callback to invoke on context menu selection change.
+     * Emitted automatically as `contextMenuSelectionChange` via the `contextMenuSelection` model.
+     * @param {TreeTableNode} object - Node instance.
+     * @group Emits
+     */
+    /**
+     * Callback to invoke when data is filtered.
+     * @param {TreeTableFilterEvent} event - Custom filter event.
+     * @group Emits
+     */
+    onFilter = output();
+    /**
+     * Callback to invoke when a node is expanded.
+     * @param {TreeTableNodeExpandEvent} event - Node expand event.
+     * @group Emits
+     */
+    onNodeExpand = output();
+    /**
+     * Callback to invoke when a node is collapsed.
+     * @param {TreeTableNodeCollapseEvent} event - Node collapse event.
+     * @group Emits
+     */
+    onNodeCollapse = output();
+    /**
+     * Callback to invoke when pagination occurs.
+     * @param {TreeTablePaginatorState} object - Paginator state.
+     * @group Emits
+     */
+    onPage = output();
+    /**
+     * Callback to invoke when a column gets sorted.
+     * @param {Object} Object - Sort data.
+     * @group Emits
+     */
+    onSort = output();
+    /**
+     * Callback to invoke when paging, sorting or filtering happens in lazy mode.
+     * @param {TreeTableLazyLoadEvent} event - Custom lazy load event.
+     * @group Emits
+     */
+    onLazyLoad = output();
+    /**
+     * An event emitter to invoke on custom sorting, refer to sorting section for details.
+     * @param {TreeTableSortEvent} event - Custom sort event.
+     * @group Emits
+     */
+    sortFunction = output();
+    /**
+     * Callback to invoke when a column is resized.
+     * @param {TreeTableColResizeEvent} event - Custom column resize event.
+     * @group Emits
+     */
+    onColResize = output();
+    /**
+     * Callback to invoke when a column is reordered.
+     * @param {TreeTableColumnReorderEvent} event - Custom column reorder.
+     * @group Emits
+     */
+    onColReorder = output();
+    /**
+     * Callback to invoke when a node is selected.
+     * @param {TreeTableNode} object - Node instance.
+     * @group Emits
+     */
+    onNodeSelect = output();
+    /**
+     * Callback to invoke when a node is unselected.
+     * @param {TreeTableNodeUnSelectEvent} event - Custom node unselect event.
+     * @group Emits
+     */
+    onNodeUnselect = output();
+    /**
+     * Callback to invoke when a node is selected with right click.
+     * @param {TreeTableContextMenuSelectEvent} event - Custom context menu select event.
+     * @group Emits
+     */
+    onContextMenuSelect = output();
+    /**
+     * Callback to invoke when state of header checkbox changes.
+     * @param {TreeTableHeaderCheckboxToggleEvent} event - Custom checkbox toggle event.
+     * @group Emits
+     */
+    onHeaderCheckboxToggle = output();
+    /**
+     * Callback to invoke when a cell switches to edit mode.
+     * @param {TreeTableEditEvent} event - Custom edit event.
+     * @group Emits
+     */
+    onEditInit = output();
+    /**
+     * Callback to invoke when cell edit is completed.
+     * @param {TreeTableEditEvent} event - Custom edit event.
+     * @group Emits
+     */
+    onEditComplete = output();
+    /**
+     * Callback to invoke when cell edit is cancelled with escape key.
+     * @param {TreeTableEditEvent} event - Custom edit event.
+     * @group Emits
+     */
+    onEditCancel = output();
+    /**
+     * Callback to invoke when selectionKeys are changed.
+     * Emitted automatically as `selectionKeysChange` via the `selectionKeys` model.
+     * @param {Object} object - updated value of the selectionKeys.
+     * @group Emits
+     */
+    resizeHelperViewChild = viewChild('resizeHelper', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "resizeHelperViewChild" }] : /* istanbul ignore next */ []));
+    reorderIndicatorUpViewChild = viewChild('reorderIndicatorUp', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "reorderIndicatorUpViewChild" }] : /* istanbul ignore next */ []));
+    reorderIndicatorDownViewChild = viewChild('reorderIndicatorDown', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "reorderIndicatorDownViewChild" }] : /* istanbul ignore next */ []));
+    tableViewChild = viewChild('table', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "tableViewChild" }] : /* istanbul ignore next */ []));
+    scrollableViewChild = viewChild('scrollableView', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "scrollableViewChild" }] : /* istanbul ignore next */ []));
+    scrollableFrozenViewChild = viewChild('scrollableFrozenView', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "scrollableFrozenViewChild" }] : /* istanbul ignore next */ []));
+    serializedValue;
+    filteredNodes;
+    filterTimeout;
+    _colGroupTemplate = contentChild('colgroup', { ...(ngDevMode ? { debugName: "_colGroupTemplate" } : /* istanbul ignore next */ {}), descendants: false });
+    colGroupTemplate;
+    _captionTemplateSignal = contentChild('caption', { ...(ngDevMode ? { debugName: "_captionTemplateSignal" } : /* istanbul ignore next */ {}), descendants: false });
+    get _captionTemplate() { return this._captionTemplateSignal(); }
+    captionTemplate;
+    _headerTemplate = contentChild('header', { ...(ngDevMode ? { debugName: "_headerTemplate" } : /* istanbul ignore next */ {}), descendants: false });
+    headerTemplate;
+    _bodyTemplate = contentChild('body', { ...(ngDevMode ? { debugName: "_bodyTemplate" } : /* istanbul ignore next */ {}), descendants: false });
+    bodyTemplate;
+    _footerTemplateSignal = contentChild('footer', { ...(ngDevMode ? { debugName: "_footerTemplateSignal" } : /* istanbul ignore next */ {}), descendants: false });
+    get _footerTemplate() { return this._footerTemplateSignal(); }
+    footerTemplate;
+    _summaryTemplateSignal = contentChild('summary', { ...(ngDevMode ? { debugName: "_summaryTemplateSignal" } : /* istanbul ignore next */ {}), descendants: false });
+    get _summaryTemplate() { return this._summaryTemplateSignal(); }
+    summaryTemplate;
+    _emptyMessageTemplate = contentChild('emptymessage', { ...(ngDevMode ? { debugName: "_emptyMessageTemplate" } : /* istanbul ignore next */ {}), descendants: false });
+    emptyMessageTemplate;
+    _paginatorLeftTemplate = contentChild('paginatorleft', { ...(ngDevMode ? { debugName: "_paginatorLeftTemplate" } : /* istanbul ignore next */ {}), descendants: false });
+    paginatorLeftTemplate;
+    _paginatorRightTemplate = contentChild('paginatorright', { ...(ngDevMode ? { debugName: "_paginatorRightTemplate" } : /* istanbul ignore next */ {}), descendants: false });
+    paginatorRightTemplate;
+    _paginatorDropdownItemTemplate = contentChild('paginatordropdownitem', { ...(ngDevMode ? { debugName: "_paginatorDropdownItemTemplate" } : /* istanbul ignore next */ {}), descendants: false });
+    paginatorDropdownItemTemplate;
+    _frozenHeaderTemplate = contentChild('frozenheader', { ...(ngDevMode ? { debugName: "_frozenHeaderTemplate" } : /* istanbul ignore next */ {}), descendants: false });
+    frozenHeaderTemplate;
+    _frozenBodyTemplate = contentChild('frozenbody', { ...(ngDevMode ? { debugName: "_frozenBodyTemplate" } : /* istanbul ignore next */ {}), descendants: false });
+    frozenBodyTemplate;
+    _frozenFooterTemplate = contentChild('frozenfooter', { ...(ngDevMode ? { debugName: "_frozenFooterTemplate" } : /* istanbul ignore next */ {}), descendants: false });
+    frozenFooterTemplate;
+    _frozenColGroupTemplate = contentChild('frozencolgroup', { ...(ngDevMode ? { debugName: "_frozenColGroupTemplate" } : /* istanbul ignore next */ {}), descendants: false });
+    frozenColGroupTemplate;
+    _loadingIconTemplateSignal = contentChild('loadingicon', { ...(ngDevMode ? { debugName: "_loadingIconTemplateSignal" } : /* istanbul ignore next */ {}), descendants: false });
+    get _loadingIconTemplate() { return this._loadingIconTemplateSignal(); }
+    loadingIconTemplate;
+    _reorderIndicatorUpIconTemplate = contentChild('reorderindicatorupicon', { ...(ngDevMode ? { debugName: "_reorderIndicatorUpIconTemplate" } : /* istanbul ignore next */ {}), descendants: false });
+    reorderIndicatorUpIconTemplate;
+    _reorderIndicatorDownIconTemplate = contentChild('reorderindicatordownicon', { ...(ngDevMode ? { debugName: "_reorderIndicatorDownIconTemplate" } : /* istanbul ignore next */ {}), descendants: false });
+    reorderIndicatorDownIconTemplate;
+    _sortIconTemplateSignal = contentChild('sorticon', { ...(ngDevMode ? { debugName: "_sortIconTemplateSignal" } : /* istanbul ignore next */ {}), descendants: false });
+    get _sortIconTemplate() { return this._sortIconTemplateSignal(); }
+    sortIconTemplate;
+    _checkboxIconTemplateSignal = contentChild('checkboxicon', { ...(ngDevMode ? { debugName: "_checkboxIconTemplateSignal" } : /* istanbul ignore next */ {}), descendants: false });
+    get _checkboxIconTemplate() { return this._checkboxIconTemplateSignal(); }
+    checkboxIconTemplate;
+    _headerCheckboxIconTemplateSignal = contentChild('headercheckboxicon', { ...(ngDevMode ? { debugName: "_headerCheckboxIconTemplateSignal" } : /* istanbul ignore next */ {}), descendants: false });
+    get _headerCheckboxIconTemplate() { return this._headerCheckboxIconTemplateSignal(); }
+    headerCheckboxIconTemplate;
+    _togglerIconTemplate = contentChild('togglericon', { ...(ngDevMode ? { debugName: "_togglerIconTemplate" } : /* istanbul ignore next */ {}), descendants: false });
+    togglerIconTemplate;
+    _paginatorFirstPageLinkIconTemplateSignal = contentChild('paginatorfirstpagelinkicon', { ...(ngDevMode ? { debugName: "_paginatorFirstPageLinkIconTemplateSignal" } : /* istanbul ignore next */ {}), descendants: false });
+    get _paginatorFirstPageLinkIconTemplate() { return this._paginatorFirstPageLinkIconTemplateSignal(); }
+    paginatorFirstPageLinkIconTemplate;
+    _paginatorLastPageLinkIconTemplateSignal = contentChild('paginatorlastpagelinkicon', { ...(ngDevMode ? { debugName: "_paginatorLastPageLinkIconTemplateSignal" } : /* istanbul ignore next */ {}), descendants: false });
+    get _paginatorLastPageLinkIconTemplate() { return this._paginatorLastPageLinkIconTemplateSignal(); }
+    paginatorLastPageLinkIconTemplate;
+    _paginatorPreviousPageLinkIconTemplateSignal = contentChild('paginatorpreviouspagelinkicon', { ...(ngDevMode ? { debugName: "_paginatorPreviousPageLinkIconTemplateSignal" } : /* istanbul ignore next */ {}), descendants: false });
+    get _paginatorPreviousPageLinkIconTemplate() { return this._paginatorPreviousPageLinkIconTemplateSignal(); }
+    paginatorPreviousPageLinkIconTemplate;
+    _paginatorNextPageLinkIconTemplateSignal = contentChild('paginatornextpagelinkicon', { ...(ngDevMode ? { debugName: "_paginatorNextPageLinkIconTemplateSignal" } : /* istanbul ignore next */ {}), descendants: false });
+    get _paginatorNextPageLinkIconTemplate() { return this._paginatorNextPageLinkIconTemplateSignal(); }
+    paginatorNextPageLinkIconTemplate;
+    _loaderTemplateSignal = contentChild('loader', { ...(ngDevMode ? { debugName: "_loaderTemplateSignal" } : /* istanbul ignore next */ {}), descendants: false });
+    get _loaderTemplate() { return this._loaderTemplateSignal(); }
+    loaderTemplate;
+    lastResizerHelperX;
+    reorderIconWidth;
+    reorderIconHeight;
+    draggedColumn;
+    dropPosition;
+    preventSelectionSetterPropagation;
+    selectedKeys = {};
+    rowTouched;
+    editingCell;
+    editingCellData;
+    editingCellField;
+    editingCellClick;
+    documentEditListener;
+    initialized;
+    toggleRowIndex;
+    onInit() {
+        if (this.lazy() && this.lazyLoadOnInit() && !this.virtualScroll()) {
+            this.onLazyLoad.emit(this.createLazyLoadMetadata());
+        }
+        this.initialized = true;
+    }
+    templates = contentChildren(HelixTemplate, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "templates" }] : /* istanbul ignore next */ []));
+    onAfterContentInit() {
+        this.templates().forEach((item) => {
+            switch (item.getType()) {
+                case 'caption':
+                    this.captionTemplate = item.template;
+                    break;
+                case 'header':
+                    this.headerTemplate = item.template;
+                    break;
+                case 'body':
+                    this.bodyTemplate = item.template;
+                    break;
+                case 'footer':
+                    this.footerTemplate = item.template;
+                    break;
+                case 'summary':
+                    this.summaryTemplate = item.template;
+                    break;
+                case 'colgroup':
+                    this.colGroupTemplate = item.template;
+                    break;
+                case 'emptymessage':
+                    this.emptyMessageTemplate = item.template;
+                    break;
+                case 'paginatorleft':
+                    this.paginatorLeftTemplate = item.template;
+                    break;
+                case 'paginatorright':
+                    this.paginatorRightTemplate = item.template;
+                    break;
+                case 'paginatordropdownitem':
+                    this.paginatorDropdownItemTemplate = item.template;
+                    break;
+                case 'frozenheader':
+                    this.frozenHeaderTemplate = item.template;
+                    break;
+                case 'frozenbody':
+                    this.frozenBodyTemplate = item.template;
+                    break;
+                case 'frozenfooter':
+                    this.frozenFooterTemplate = item.template;
+                    break;
+                case 'frozencolgroup':
+                    this.frozenColGroupTemplate = item.template;
+                    break;
+                case 'loadingicon':
+                    this.loadingIconTemplate = item.template;
+                    break;
+                case 'reorderindicatorupicon':
+                    this.reorderIndicatorUpIconTemplate = item.template;
+                    break;
+                case 'reorderindicatordownicon':
+                    this.reorderIndicatorDownIconTemplate = item.template;
+                    break;
+                case 'sorticon':
+                    this.sortIconTemplate = item.template;
+                    break;
+                case 'checkboxicon':
+                    this.checkboxIconTemplate = item.template;
+                    break;
+                case 'headercheckboxicon':
+                    this.headerCheckboxIconTemplate = item.template;
+                    break;
+                case 'togglericon':
+                    this.togglerIconTemplate = item.template;
+                    break;
+                case 'paginatorfirstpagelinkicon':
+                    this.paginatorFirstPageLinkIconTemplate = item.template;
+                    break;
+                case 'paginatorlastpagelinkicon':
+                    this.paginatorLastPageLinkIconTemplate = item.template;
+                    break;
+                case 'paginatorpreviouspagelinkicon':
+                    this.paginatorPreviousPageLinkIconTemplate = item.template;
+                    break;
+                case 'paginatornextpagelinkicon':
+                    this.paginatorNextPageLinkIconTemplate = item.template;
+                    break;
+                case 'loader':
+                    this.loaderTemplate = item.template;
+                    break;
+            }
+        });
+    }
+    filterService = inject(FilterService);
+    tableService = inject(TreeTableService);
+    zone = inject(NgZone);
+    // The `totalRecords` setter used to notify TreeTableService on every write; `totalRecords` is
+    // now a model() signal, so the notification is reproduced as an effect (rule 3).
+    _totalRecordsEffect = effect(() => {
+        this.tableService.onTotalRecordsChange(this.totalRecords());
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "_totalRecordsEffect" }] : /* istanbul ignore next */ []));
+    // NOTE: `virtualRowHeight`'s setter used to log a one-time deprecation console.log whenever a
+    // consumer explicitly bound the (deprecated) property. It is now a plain input() (rule 1/3); the
+    // console.log side effect was intentionally dropped rather than reproduced via effect(), because
+    // an effect reading virtualRowHeight() fires once for every TreeTable instance at initialization
+    // regardless of whether the consumer ever set the input (signals don't distinguish "default value"
+    // from "explicitly bound to the default"), which would make the warning fire unconditionally for
+    // every consumer instead of only those actually using the deprecated property.
+    // Removed onChanges method (dead code with signal inputs): `value`, `sortField`, `sortOrder`,
+    // `multiSortMeta`, and `selection` are now signal-based (model()), so Angular no longer routes
+    // their changes through ngOnChanges/onChanges. Internal mutation paths (sort(), onPageChange(),
+    // filter methods, selection handlers, etc.) already call updateSerializedValue()/sortSingle()/
+    // sortMultiple()/updateselectedKeys() explicitly where needed. Mirrors table.ts (PR #391).
+    updateSerializedValue() {
+        this.serializedValue = [];
+        if (this.paginator())
+            this.serializePageNodes();
+        else
+            this.serializeNodes(null, this.filteredNodes || this.value(), 0, true);
+    }
+    serializeNodes(parent, nodes, level, visible) {
+        if (nodes && nodes.length) {
+            for (let node of nodes) {
+                node.parent = parent;
+                const rowNode = {
+                    node: node,
+                    parent: parent,
+                    level: level,
+                    visible: visible && (parent ? parent.expanded : true)
+                };
+                this.serializedValue.push(rowNode);
+                if (rowNode.visible && node.expanded) {
+                    this.serializeNodes(node, node.children, level + 1, rowNode.visible);
+                }
+            }
+        }
+    }
+    serializePageNodes() {
+        let data = this.filteredNodes || this.value();
+        this.serializedValue = [];
+        if (data && data.length) {
+            const first = this.lazy() ? 0 : this.first();
+            for (let i = first; i < first + this.rows(); i++) {
+                let node = data[i];
+                if (node) {
+                    this.serializedValue.push({
+                        node: node,
+                        parent: null,
+                        level: 0,
+                        visible: true
+                    });
+                    this.serializeNodes(node, node.children, 1, true);
+                }
+            }
+        }
+    }
+    updateselectedKeys() {
+        const dataKey = this.dataKey();
+        if (dataKey && this.selection()) {
+            this.selectedKeys = {};
+            if (Array.isArray(this.selection())) {
+                for (let node of this.selection()) {
+                    this.selectedKeys[String(resolveFieldData(node.data, dataKey))] = 1;
+                }
+            }
+            else {
+                this.selectedKeys[String(resolveFieldData(this.selection().data, dataKey))] = 1;
+            }
+        }
+    }
+    onPageChange(event) {
+        this.first.set(event.first);
+        this.rows.set(event.rows);
+        if (this.lazy())
+            this.onLazyLoad.emit(this.createLazyLoadMetadata());
+        else
+            this.serializePageNodes();
+        this.onPage.emit({
+            first: this.first(),
+            rows: this.rows()
+        });
+        this.tableService.onUIUpdate(this.value());
+        if (this.scrollable()) {
+            this.resetScrollTop();
+        }
+    }
+    sort(event) {
+        let originalEvent = event.originalEvent;
+        const sortMode = this.sortMode();
+        const scrollable = this.scrollable();
+        const resetPageOnSort = this.resetPageOnSort();
+        if (sortMode === 'single') {
+            this.sortOrder.set(this.sortField() === event.field ? this.sortOrder() * -1 : this.defaultSortOrder());
+            this.sortField.set(event.field);
+            this.sortSingle();
+            if (resetPageOnSort && scrollable) {
+                this.resetScrollTop();
+            }
+        }
+        if (sortMode === 'multiple') {
+            let metaKey = originalEvent.metaKey || originalEvent.ctrlKey;
+            let sortMeta = this.getSortMeta(event.field);
+            if (sortMeta) {
+                if (!metaKey) {
+                    this.multiSortMeta.set([{ field: event.field, order: sortMeta.order * -1 }]);
+                    if (resetPageOnSort && scrollable) {
+                        this.resetScrollTop();
+                    }
+                }
+                else {
+                    sortMeta.order = sortMeta.order * -1;
+                }
+            }
+            else {
+                if (!metaKey || !this.multiSortMeta()) {
+                    this.multiSortMeta.set([]);
+                    if (resetPageOnSort && scrollable) {
+                        this.resetScrollTop();
+                    }
+                }
+                this.multiSortMeta().push({ field: event.field, order: this.defaultSortOrder() });
+            }
+            this.sortMultiple();
+        }
+    }
+    sortSingle() {
+        if (this.sortField() && this.sortOrder()) {
+            if (this.lazy()) {
+                this.onLazyLoad.emit(this.createLazyLoadMetadata());
+            }
+            else if (this.value()) {
+                this.sortNodes(this.value());
+                if (this.hasFilter()) {
+                    this._filter();
+                }
+            }
+            let sortMeta = {
+                field: this.sortField(),
+                order: this.sortOrder()
+            };
+            this.onSort.emit(sortMeta);
+            this.tableService.onSort(sortMeta);
+            this.updateSerializedValue();
+        }
+    }
+    sortNodes(nodes) {
+        if (!nodes || nodes.length === 0) {
+            return;
+        }
+        if (this.customSort()) {
+            this.sortFunction.emit({
+                data: nodes,
+                mode: this.sortMode(),
+                field: this.sortField(),
+                order: this.sortOrder()
+            });
+        }
+        else {
+            nodes.sort((node1, node2) => {
+                let value1 = resolveFieldData(node1.data, this.sortField());
+                let value2 = resolveFieldData(node2.data, this.sortField());
+                let result = 0;
+                if (value1 == null && value2 != null)
+                    result = -1;
+                else if (value1 != null && value2 == null)
+                    result = 1;
+                else if (value1 == null && value2 == null)
+                    result = 0;
+                else if (typeof value1 === 'string' && typeof value2 === 'string')
+                    result = value1.localeCompare(value2, undefined, { numeric: true });
+                else
+                    result = value1 < value2 ? -1 : value1 > value2 ? 1 : 0;
+                return this.sortOrder() * result;
+            });
+        }
+        for (let node of nodes) {
+            this.sortNodes(node.children);
+        }
+    }
+    sortMultiple() {
+        if (this.multiSortMeta()) {
+            if (this.lazy()) {
+                this.onLazyLoad.emit(this.createLazyLoadMetadata());
+            }
+            else if (this.value()) {
+                this.sortMultipleNodes(this.value());
+                if (this.hasFilter()) {
+                    this._filter();
+                }
+            }
+            this.onSort.emit({
+                multisortmeta: this.multiSortMeta()
+            });
+            this.updateSerializedValue();
+            this.tableService.onSort(this.multiSortMeta());
+        }
+    }
+    sortMultipleNodes(nodes) {
+        if (!nodes || nodes.length === 0) {
+            return;
+        }
+        if (this.customSort()) {
+            this.sortFunction.emit({
+                data: this.value(),
+                mode: this.sortMode(),
+                multiSortMeta: this.multiSortMeta()
+            });
+        }
+        else {
+            nodes.sort((node1, node2) => {
+                return this.multisortField(node1, node2, this.multiSortMeta(), 0);
+            });
+        }
+        for (let node of nodes) {
+            this.sortMultipleNodes(node.children);
+        }
+    }
+    multisortField(node1, node2, multiSortMeta, index) {
+        if (isEmpty(this.multiSortMeta()) || isEmpty(multiSortMeta[index])) {
+            return 0;
+        }
+        let value1 = resolveFieldData(node1.data, multiSortMeta[index].field);
+        let value2 = resolveFieldData(node2.data, multiSortMeta[index].field);
+        let result = 0;
+        if (value1 == null && value2 != null)
+            result = -1;
+        else if (value1 != null && value2 == null)
+            result = 1;
+        else if (value1 == null && value2 == null)
+            result = 0;
+        if (typeof value1 == 'string' || value1 instanceof String) {
+            if (value1.localeCompare && value1 != value2) {
+                return multiSortMeta[index].order * value1.localeCompare(value2, undefined, { numeric: true });
+            }
+        }
+        else {
+            result = value1 < value2 ? -1 : 1;
+        }
+        if (value1 == value2) {
+            return multiSortMeta.length - 1 > index ? this.multisortField(node1, node2, multiSortMeta, index + 1) : 0;
+        }
+        return multiSortMeta[index].order * result;
+    }
+    getSortMeta(field) {
+        const multiSortMeta = this.multiSortMeta();
+        if (multiSortMeta && multiSortMeta.length) {
+            for (let i = 0; i < multiSortMeta.length; i++) {
+                if (multiSortMeta[i].field === field) {
+                    return multiSortMeta[i];
+                }
+            }
+        }
+        return null;
+    }
+    isSorted(field) {
+        const sortMode = this.sortMode();
+        if (sortMode === 'single') {
+            return this.sortField() && this.sortField() === field;
+        }
+        else if (sortMode === 'multiple') {
+            let sorted = false;
+            const multiSortMeta = this.multiSortMeta();
+            if (multiSortMeta) {
+                for (let i = 0; i < multiSortMeta.length; i++) {
+                    if (multiSortMeta[i].field == field) {
+                        sorted = true;
+                        break;
+                    }
+                }
+            }
+            return sorted;
+        }
+    }
+    createLazyLoadMetadata() {
+        return {
+            first: this.first(),
+            rows: this.rows(),
+            sortField: this.sortField(),
+            sortOrder: this.sortOrder(),
+            filters: this.filters(),
+            globalFilter: this.filters() && this.filters()['global'] ? this.filters()['global'].value : null,
+            multiSortMeta: this.multiSortMeta(),
+            forceUpdate: () => this.cd.detectChanges()
+        };
+    }
+    onLazyItemLoad(event) {
+        this.onLazyLoad.emit({
+            ...this.createLazyLoadMetadata(),
+            ...event,
+            rows: event.last - event.first
+        });
+    }
+    /**
+     * Resets scroll to top.
+     * @group Method
+     */
+    resetScrollTop() {
+        if (this.virtualScroll())
+            this.scrollToVirtualIndex(0);
+        else
+            this.scrollTo({ top: 0 });
+    }
+    /**
+     * Scrolls to given index when using virtual scroll.
+     * @param {number} index - index of the element.
+     * @group Method
+     */
+    scrollToVirtualIndex(index) {
+        const scrollableViewChild = this.scrollableViewChild();
+        if (scrollableViewChild) {
+            scrollableViewChild.scrollToVirtualIndex(index);
+        }
+        if (this.scrollableFrozenViewChild()) {
+            scrollableViewChild.scrollToVirtualIndex(index);
+        }
+    }
+    /**
+     * Scrolls to given index.
+     * @param {ScrollToOptions} options - Scroll options.
+     * @group Method
+     */
+    scrollTo(options) {
+        const scrollableViewChild = this.scrollableViewChild();
+        if (scrollableViewChild) {
+            scrollableViewChild.scrollTo(options);
+        }
+        if (this.scrollableFrozenViewChild()) {
+            scrollableViewChild.scrollTo(options);
+        }
+    }
+    isEmpty() {
+        let data = this.filteredNodes || this.value();
+        return data == null || data.length == 0;
+    }
+    getBlockableElement() {
+        return this.el.nativeElement.children[0];
+    }
+    onColumnResizeBegin(event) {
+        let containerLeft = getOffset(this.el?.nativeElement).left;
+        this.lastResizerHelperX = event.pageX - containerLeft + this.el?.nativeElement.scrollLeft;
+        event.preventDefault();
+    }
+    onColumnResize(event) {
+        let containerLeft = getOffset(this.el?.nativeElement).left;
+        this.el?.nativeElement.setAttribute('data-h-unselectable-text', 'true');
+        !this.$unstyled() && addStyle(this.el.nativeElement, { 'user-select': 'none' });
+        this.resizeHelperViewChild().nativeElement.style.height = this.el?.nativeElement.offsetHeight + 'px';
+        this.resizeHelperViewChild().nativeElement.style.top = 0 + 'px';
+        this.resizeHelperViewChild().nativeElement.style.left = event.pageX - containerLeft + this.el?.nativeElement.scrollLeft + 'px';
+        this.resizeHelperViewChild().nativeElement.style.display = 'block';
+    }
+    onColumnResizeEnd(event, column) {
+        let delta = this.resizeHelperViewChild().nativeElement.offsetLeft - this.lastResizerHelperX;
+        let columnWidth = column.offsetWidth;
+        let newColumnWidth = columnWidth + delta;
+        let minWidth = column.style.minWidth || 15;
+        if (columnWidth + delta > parseInt(minWidth)) {
+            const columnResizeMode = this.columnResizeMode();
+            if (columnResizeMode === 'fit') {
+                let nextColumn = column.nextElementSibling;
+                while (!nextColumn.offsetParent) {
+                    nextColumn = nextColumn.nextElementSibling;
+                }
+                if (nextColumn) {
+                    let nextColumnWidth = nextColumn.offsetWidth - delta;
+                    let nextColumnMinWidth = nextColumn.style.minWidth || 15;
+                    if (newColumnWidth > 15 && nextColumnWidth > parseInt(nextColumnMinWidth)) {
+                        if (this.scrollable()) {
+                            let scrollableView = this.findParentScrollableView(column);
+                            let scrollableBodyTable = findSingle(scrollableView, '[data-pc-section="scrollablebody"] table') || findSingle(scrollableView, '[data-pc-name="virtualscroller"] table');
+                            let scrollableHeaderTable = findSingle(scrollableView, '[data-pc-section="scrollableheadertable"]');
+                            let scrollableFooterTable = findSingle(scrollableView, '[data-pc-section="scrollablefootertable"]');
+                            let resizeColumnIndex = getIndex(column);
+                            this.resizeColGroup(scrollableHeaderTable, resizeColumnIndex, newColumnWidth, nextColumnWidth);
+                            this.resizeColGroup(scrollableBodyTable, resizeColumnIndex, newColumnWidth, nextColumnWidth);
+                            this.resizeColGroup(scrollableFooterTable, resizeColumnIndex, newColumnWidth, nextColumnWidth);
+                        }
+                        else {
+                            column.style.width = newColumnWidth + 'px';
+                            if (nextColumn) {
+                                nextColumn.style.width = nextColumnWidth + 'px';
+                            }
+                        }
+                    }
+                }
+            }
+            else if (columnResizeMode === 'expand') {
+                if (this.scrollable()) {
+                    let scrollableView = this.findParentScrollableView(column);
+                    let scrollableBody = findSingle(scrollableView, '[data-pc-section="scrollablebody"]') || findSingle(scrollableView, '[data-pc-name="virtualscroller"]');
+                    let scrollableHeader = findSingle(scrollableView, '[data-pc-section="scrollableheader"]');
+                    let scrollableFooter = findSingle(scrollableView, '[data-pc-section="scrollablefooter"]');
+                    let scrollableBodyTable = findSingle(scrollableView, '[data-pc-section="scrollablebody"] table') || findSingle(scrollableView, '[data-pc-name="virtualscroller"] table');
+                    let scrollableHeaderTable = findSingle(scrollableView, '[data-pc-section="scrollableheadertable"]');
+                    let scrollableFooterTable = findSingle(scrollableView, '[data-pc-section="scrollablefootertable"]');
+                    scrollableBodyTable.style.width = scrollableBodyTable.offsetWidth + delta + 'px';
+                    scrollableHeaderTable.style.width = scrollableHeaderTable.offsetWidth + delta + 'px';
+                    if (scrollableFooterTable) {
+                        scrollableFooterTable.style.width = scrollableFooterTable.offsetWidth + delta + 'px';
+                    }
+                    let resizeColumnIndex = getIndex(column);
+                    const scrollableBodyTableWidth = column ? scrollableBodyTable.offsetWidth + delta : newColumnWidth;
+                    const scrollableHeaderTableWidth = column ? scrollableHeaderTable.offsetWidth + delta : newColumnWidth;
+                    const isContainerInViewport = this.el?.nativeElement.offsetWidth >= scrollableBodyTableWidth;
+                    let setWidth = (container, table, width, isContainerInViewport) => {
+                        if (container && table) {
+                            container.style.width = isContainerInViewport ? width + calculateScrollbarWidth(scrollableBody) + 'px' : 'auto';
+                            table.style.width = width + 'px';
+                        }
+                    };
+                    setWidth(scrollableBody, scrollableBodyTable, scrollableBodyTableWidth, isContainerInViewport);
+                    setWidth(scrollableHeader, scrollableHeaderTable, scrollableHeaderTableWidth, isContainerInViewport);
+                    setWidth(scrollableFooter, scrollableFooterTable, scrollableHeaderTableWidth, isContainerInViewport);
+                    this.resizeColGroup(scrollableHeaderTable, resizeColumnIndex, newColumnWidth, null);
+                    this.resizeColGroup(scrollableBodyTable, resizeColumnIndex, newColumnWidth, null);
+                    this.resizeColGroup(scrollableFooterTable, resizeColumnIndex, newColumnWidth, null);
+                }
+                else {
+                    const tableViewChild = this.tableViewChild();
+                    this.tableViewChild().nativeElement.style.width = tableViewChild?.nativeElement.offsetWidth + delta + 'px';
+                    column.style.width = newColumnWidth + 'px';
+                    let containerWidth = tableViewChild?.nativeElement.style.width;
+                    this.el.nativeElement.style.width = containerWidth + 'px';
+                }
+            }
+            this.onColResize.emit({
+                element: column,
+                delta: delta
+            });
+        }
+        this.resizeHelperViewChild().nativeElement.style.display = 'none';
+        this.el.nativeElement.removeAttribute('data-h-unselectable-text');
+        !this.$unstyled() && (this.el.nativeElement.style['user-select'] = '');
+    }
+    findParentScrollableView(column) {
+        if (column) {
+            let parent = column.parentElement;
+            while (parent && !findSingle(parent, '[data-pc-section="scrollableview"]')) {
+                parent = parent.parentElement;
+            }
+            return parent;
+        }
+        else {
+            return null;
+        }
+    }
+    resizeColGroup(table, resizeColumnIndex, newColumnWidth, nextColumnWidth) {
+        if (table) {
+            let colGroup = table.children[0].nodeName === 'COLGROUP' ? table.children[0] : null;
+            if (colGroup) {
+                let col = colGroup.children[resizeColumnIndex];
+                let nextCol = col.nextElementSibling;
+                col.style.width = newColumnWidth + 'px';
+                if (nextCol && nextColumnWidth) {
+                    nextCol.style.width = nextColumnWidth + 'px';
+                }
+            }
+            else {
+                throw 'Scrollable tables require a colgroup to support resizable columns';
+            }
+        }
+    }
+    onColumnDragStart(event, columnElement) {
+        this.reorderIconWidth = getHiddenElementOuterWidth(this.reorderIndicatorUpViewChild()?.nativeElement);
+        this.reorderIconHeight = getHiddenElementOuterHeight(this.reorderIndicatorDownViewChild()?.nativeElement);
+        this.draggedColumn = columnElement;
+        event.dataTransfer.setData('text', 'b'); // For firefox
+    }
+    onColumnDragEnter(event, dropHeader) {
+        if (this.reorderableColumns() && this.draggedColumn && dropHeader) {
+            event.preventDefault();
+            let containerOffset = getOffset(this.el?.nativeElement);
+            let dropHeaderOffset = getOffset(dropHeader);
+            if (this.draggedColumn != dropHeader) {
+                let targetLeft = dropHeaderOffset.left - containerOffset.left;
+                let targetTop = containerOffset.top - dropHeaderOffset.top;
+                let columnCenter = dropHeaderOffset.left + dropHeader.offsetWidth / 2;
+                this.reorderIndicatorUpViewChild().nativeElement.style.top = dropHeaderOffset.top - containerOffset.top - (this.reorderIconHeight - 1) + 'px';
+                this.reorderIndicatorDownViewChild().nativeElement.style.top = dropHeaderOffset.top - containerOffset.top + dropHeader.offsetHeight + 'px';
+                if (event.pageX > columnCenter) {
+                    this.reorderIndicatorUpViewChild().nativeElement.style.left = targetLeft + dropHeader.offsetWidth - Math.ceil(this.reorderIconWidth / 2) + 'px';
+                    this.reorderIndicatorDownViewChild().nativeElement.style.left = targetLeft + dropHeader.offsetWidth - Math.ceil(this.reorderIconWidth / 2) + 'px';
+                    this.dropPosition = 1;
+                }
+                else {
+                    this.reorderIndicatorUpViewChild().nativeElement.style.left = targetLeft - Math.ceil(this.reorderIconWidth / 2) + 'px';
+                    this.reorderIndicatorDownViewChild().nativeElement.style.left = targetLeft - Math.ceil(this.reorderIconWidth / 2) + 'px';
+                    this.dropPosition = -1;
+                }
+                this.reorderIndicatorUpViewChild().nativeElement.style.display = 'block';
+                this.reorderIndicatorDownViewChild().nativeElement.style.display = 'block';
+            }
+            else {
+                event.dataTransfer.dropEffect = 'none';
+            }
+        }
+    }
+    onColumnDragLeave(event) {
+        if (this.reorderableColumns() && this.draggedColumn) {
+            event.preventDefault();
+            this.reorderIndicatorUpViewChild().nativeElement.style.display = 'none';
+            this.reorderIndicatorDownViewChild().nativeElement.style.display = 'none';
+        }
+    }
+    onColumnDrop(event, dropColumn) {
+        event.preventDefault();
+        if (this.draggedColumn) {
+            let dragIndex = DomHandler.indexWithinGroup(this.draggedColumn, 'ttreorderablecolumn');
+            let dropIndex = DomHandler.indexWithinGroup(dropColumn, 'ttreorderablecolumn');
+            let allowDrop = dragIndex != dropIndex;
+            if (allowDrop && ((dropIndex - dragIndex == 1 && this.dropPosition === -1) || (dragIndex - dropIndex == 1 && this.dropPosition === 1))) {
+                allowDrop = false;
+            }
+            if (allowDrop && dropIndex < dragIndex && this.dropPosition === 1) {
+                dropIndex = dropIndex + 1;
+            }
+            if (allowDrop && dropIndex > dragIndex && this.dropPosition === -1) {
+                dropIndex = dropIndex - 1;
+            }
+            if (allowDrop) {
+                const columns = this.columns();
+                reorderArray(columns, dragIndex, dropIndex);
+                this.onColReorder.emit({
+                    dragIndex: dragIndex,
+                    dropIndex: dropIndex,
+                    columns: columns
+                });
+            }
+            this.reorderIndicatorUpViewChild().nativeElement.style.display = 'none';
+            this.reorderIndicatorDownViewChild().nativeElement.style.display = 'none';
+            this.draggedColumn.draggable = false;
+            this.draggedColumn = null;
+            this.dropPosition = null;
+        }
+    }
+    handleRowClick(event) {
+        let targetNode = event.originalEvent.target.nodeName;
+        if (targetNode == 'INPUT' || targetNode == 'BUTTON' || targetNode == 'A' || isClickable(event.originalEvent.target)) {
+            return;
+        }
+        const selectionMode = this.selectionMode();
+        if (selectionMode) {
+            this.preventSelectionSetterPropagation = true;
+            let rowNode = event.rowNode;
+            let selected = this.isSelected(rowNode.node);
+            let metaSelection = this.rowTouched ? false : this.metaKeySelection();
+            const dataKey = this.dataKey();
+            let dataKeyValue = dataKey ? String(resolveFieldData(rowNode.node.data, dataKey)) : null;
+            if (metaSelection) {
+                let keyboardEvent = event.originalEvent;
+                let metaKey = keyboardEvent.metaKey || keyboardEvent.ctrlKey;
+                if (selected && metaKey) {
+                    if (this.isSingleSelectionMode()) {
+                        this.selection.set(null);
+                        this.selectedKeys = {};
+                    }
+                    else {
+                        let selectionIndex = this.findIndexInSelection(rowNode.node);
+                        this.selection.set(this.selection().filter((val, i) => i != selectionIndex));
+                        if (dataKeyValue) {
+                            delete this.selectedKeys[dataKeyValue];
+                        }
+                    }
+                    this.onNodeUnselect.emit({
+                        originalEvent: event.originalEvent,
+                        node: rowNode.node,
+                        type: 'row'
+                    });
+                }
+                else {
+                    if (this.isSingleSelectionMode()) {
+                        this.selection.set(rowNode.node);
+                        if (dataKeyValue) {
+                            this.selectedKeys = {};
+                            this.selectedKeys[dataKeyValue] = 1;
+                        }
+                    }
+                    else if (this.isMultipleSelectionMode()) {
+                        if (metaKey) {
+                            this.selection.set(this.selection() || []);
+                        }
+                        else {
+                            this.selection.set([]);
+                            this.selectedKeys = {};
+                        }
+                        this.selection.set([...this.selection(), rowNode.node]);
+                        if (dataKeyValue) {
+                            this.selectedKeys[dataKeyValue] = 1;
+                        }
+                    }
+                    this.onNodeSelect.emit({
+                        originalEvent: event.originalEvent,
+                        node: rowNode.node,
+                        type: 'row',
+                        index: event.rowIndex
+                    });
+                }
+            }
+            else {
+                if (selectionMode === 'single') {
+                    if (selected) {
+                        this.selection.set(null);
+                        this.selectedKeys = {};
+                        this.onNodeUnselect.emit({
+                            originalEvent: event.originalEvent,
+                            node: rowNode.node,
+                            type: 'row'
+                        });
+                    }
+                    else {
+                        this.selection.set(rowNode.node);
+                        this.onNodeSelect.emit({
+                            originalEvent: event.originalEvent,
+                            node: rowNode.node,
+                            type: 'row',
+                            index: event.rowIndex
+                        });
+                        if (dataKeyValue) {
+                            this.selectedKeys = {};
+                            this.selectedKeys[dataKeyValue] = 1;
+                        }
+                    }
+                }
+                else if (selectionMode === 'multiple') {
+                    if (selected) {
+                        let selectionIndex = this.findIndexInSelection(rowNode.node);
+                        this.selection.set(this.selection().filter((val, i) => i != selectionIndex));
+                        this.onNodeUnselect.emit({
+                            originalEvent: event.originalEvent,
+                            node: rowNode.node,
+                            type: 'row'
+                        });
+                        if (dataKeyValue) {
+                            delete this.selectedKeys[dataKeyValue];
+                        }
+                    }
+                    else {
+                        this.selection.set(this.selection() ? [...this.selection(), rowNode.node] : [rowNode.node]);
+                        this.onNodeSelect.emit({
+                            originalEvent: event.originalEvent,
+                            node: rowNode.node,
+                            type: 'row',
+                            index: event.rowIndex
+                        });
+                        if (dataKeyValue) {
+                            this.selectedKeys[dataKeyValue] = 1;
+                        }
+                    }
+                }
+            }
+            this.tableService.onSelectionChange();
+        }
+        this.rowTouched = false;
+    }
+    handleRowTouchEnd(event) {
+        this.rowTouched = true;
+    }
+    handleRowRightClick(event) {
+        if (this.contextMenu()) {
+            const node = event.rowNode.node;
+            const showContextMenu = () => {
+                this.contextMenu().show(event.originalEvent);
+                this.contextMenu().hideCallback = () => {
+                    this.contextMenuSelection.set(null);
+                    this.tableService.onContextMenu(null);
+                };
+            };
+            const contextMenuSelectionMode = this.contextMenuSelectionMode();
+            if (contextMenuSelectionMode === 'separate') {
+                this.contextMenuSelection.set(node);
+                this.tableService.onContextMenu(node);
+                showContextMenu();
+                this.onContextMenuSelect.emit({ originalEvent: event.originalEvent, node: node });
+            }
+            else if (contextMenuSelectionMode === 'joint') {
+                this.preventSelectionSetterPropagation = true;
+                let selected = this.isSelected(node);
+                const dataKey = this.dataKey();
+                let dataKeyValue = dataKey ? String(resolveFieldData(node.data, dataKey)) : null;
+                if (!selected) {
+                    if (this.isSingleSelectionMode()) {
+                        this.selection.set(node);
+                    }
+                    else if (this.isMultipleSelectionMode()) {
+                        this.selection.set([node]);
+                    }
+                    if (dataKeyValue) {
+                        this.selectedKeys[dataKeyValue] = 1;
+                    }
+                }
+                this.contextMenuSelection.set(node);
+                this.tableService.onContextMenu(node);
+                showContextMenu();
+                this.onContextMenuSelect.emit({ originalEvent: event.originalEvent, node: node });
+            }
+        }
+    }
+    toggleNodeWithCheckbox(event) {
+        // legacy selection support, will be removed in v18
+        this.selection.set(this.selection() || []);
+        this.preventSelectionSetterPropagation = true;
+        let node = event.rowNode.node;
+        let selected = this.isSelected(node);
+        if (selected) {
+            this.propagateSelectionDown(node, false);
+            if (event.rowNode.parent) {
+                this.propagateSelectionUp(node.parent, false);
+            }
+            this.onNodeUnselect.emit({ originalEvent: event, node: node });
+        }
+        else {
+            this.propagateSelectionDown(node, true);
+            if (event.rowNode.parent) {
+                this.propagateSelectionUp(node.parent, true);
+            }
+            this.onNodeSelect.emit({ originalEvent: event, node: node });
+        }
+        this.tableService.onSelectionChange();
+    }
+    toggleNodesWithCheckbox(event, check) {
+        // legacy selection support, will be removed in v18
+        let data = this.filteredNodes || this.value();
+        this.selection.set(check && data ? data.slice() : []);
+        this.toggleAll(check);
+        if (!check) {
+            this.selection.set([]);
+            this.selectedKeys = {};
+        }
+        this.preventSelectionSetterPropagation = true;
+        this.tableService.onSelectionChange();
+        this.onHeaderCheckboxToggle.emit({ originalEvent: event, checked: check });
+    }
+    toggleAll(checked) {
+        let data = this.filteredNodes || this.value();
+        if (!this.selectionKeys()) {
+            if (data && data.length) {
+                for (let node of data) {
+                    this.propagateSelectionDown(node, checked);
+                }
+            }
+        }
+        else {
+            // legacy selection support, will be removed in v18
+            if (data && data.length) {
+                for (let node of data) {
+                    this.propagateDown(node, checked);
+                }
+                // selectionKeys is mutated in place above; re-set with a shallow clone so the
+                // selectionKeys model signal detects the change and emits selectionKeysChange.
+                this.selectionKeys.set({ ...this.selectionKeys() });
+            }
+        }
+    }
+    propagateSelectionUp(node, select) {
+        // legacy selection support, will be removed in v18
+        if (node.children && node.children.length) {
+            let selectedChildCount = 0;
+            let childPartialSelected = false;
+            const dataKey = this.dataKey();
+            let dataKeyValue = dataKey ? String(resolveFieldData(node.data, dataKey)) : null;
+            for (let child of node.children) {
+                if (this.isSelected(child))
+                    selectedChildCount++;
+                else if (child.partialSelected)
+                    childPartialSelected = true;
+            }
+            if (select && selectedChildCount == node.children.length) {
+                this.selection.set([...(this.selection() || []), node]);
+                node.partialSelected = false;
+                if (dataKeyValue) {
+                    this.selectedKeys[dataKeyValue] = 1;
+                }
+            }
+            else {
+                if (!select) {
+                    let index = this.findIndexInSelection(node);
+                    if (index >= 0) {
+                        this.selection.set(this.selection().filter((val, i) => i != index));
+                        if (dataKeyValue) {
+                            delete this.selectedKeys[dataKeyValue];
+                        }
+                    }
+                }
+                if (childPartialSelected || (selectedChildCount > 0 && selectedChildCount != node.children.length))
+                    node.partialSelected = true;
+                else
+                    node.partialSelected = false;
+            }
+        }
+        let parent = node.parent;
+        node.checked = select;
+        if (parent) {
+            this.propagateSelectionUp(parent, select);
+        }
+    }
+    propagateSelectionDown(node, select) {
+        // legacy selection support, will be removed in v18
+        let index = this.findIndexInSelection(node);
+        const dataKey = this.dataKey();
+        let dataKeyValue = dataKey ? String(resolveFieldData(node.data, dataKey)) : null;
+        if (select && index == -1) {
+            this.selection.set([...(this.selection() || []), node]);
+            if (dataKeyValue) {
+                this.selectedKeys[dataKeyValue] = 1;
+            }
+        }
+        else if (!select && index > -1) {
+            this.selection.set(this.selection().filter((val, i) => i != index));
+            if (dataKeyValue) {
+                delete this.selectedKeys[dataKeyValue];
+            }
+        }
+        node.partialSelected = false;
+        node.checked = select;
+        if (node.children && node.children.length) {
+            for (let child of node.children) {
+                this.propagateSelectionDown(child, select);
+            }
+        }
+    }
+    isSelected(node) {
+        // legacy selection support, will be removed in v18
+        if (node && this.selection()) {
+            const dataKey = this.dataKey();
+            if (dataKey) {
+                if (node.hasOwnProperty('checked')) {
+                    return node['checked'];
+                }
+                else {
+                    return this.selectedKeys[resolveFieldData(node.data, dataKey)] !== undefined;
+                }
+            }
+            else {
+                if (Array.isArray(this.selection()))
+                    return this.findIndexInSelection(node) > -1;
+                else
+                    return this.equals(node, this.selection());
+            }
+        }
+        return false;
+    }
+    isNodeSelected(node) {
+        return this.selectionMode() && this.selectionKeys() ? this.selectionKeys()[this.nodeKey(node)]?.checked === true : false;
+    }
+    isNodePartialSelected(node) {
+        return this.selectionMode() && this.selectionKeys() ? this.selectionKeys()[this.nodeKey(node)]?.partialChecked === true : false;
+    }
+    nodeKey(node) {
+        const dataKey = this.dataKey();
+        return resolveFieldData(node, dataKey) || resolveFieldData(node?.data, dataKey);
+    }
+    toggleCheckbox(event) {
+        let { rowNode, check, originalEvent } = event;
+        let node = rowNode.node;
+        if (this.selectionKeys()) {
+            this.propagateDown(node, check);
+            if (node.parent) {
+                this.propagateUp(node.parent, check);
+            }
+            // selectionKeys is mutated in place above; re-set with a shallow clone so the
+            // selectionKeys model signal detects the change and emits selectionKeysChange.
+            this.selectionKeys.set({ ...this.selectionKeys() });
+        }
+        else {
+            this.toggleNodeWithCheckbox({ originalEvent, rowNode });
+        }
+        this.tableService.onSelectionChange();
+    }
+    propagateDown(node, check) {
+        if (check) {
+            this.selectionKeys()[this.nodeKey(node)] = { checked: true, partialChecked: false };
+        }
+        else {
+            delete this.selectionKeys()[this.nodeKey(node)];
+        }
+        if (node.children && node.children.length) {
+            for (let child of node.children) {
+                this.propagateDown(child, check);
+            }
+        }
+    }
+    propagateUp(node, check) {
+        let checkedChildCount = 0;
+        let childPartialSelected = false;
+        for (let child of node.children) {
+            if (this.selectionKeys()[this.nodeKey(child)] && this.selectionKeys()[this.nodeKey(child)].checked)
+                checkedChildCount++;
+            else if (this.selectionKeys()[this.nodeKey(child)] && this.selectionKeys()[this.nodeKey(child)].partialChecked)
+                childPartialSelected = true;
+        }
+        if (check && checkedChildCount === node.children.length) {
+            this.selectionKeys()[this.nodeKey(node)] = { checked: true, partialChecked: false };
+        }
+        else {
+            if (!check) {
+                delete this.selectionKeys()[this.nodeKey(node)];
+            }
+            if (childPartialSelected || (checkedChildCount > 0 && checkedChildCount !== node.children.length))
+                this.selectionKeys()[this.nodeKey(node)] = { checked: false, partialChecked: true };
+            else
+                this.selectionKeys()[this.nodeKey(node)] = { checked: false, partialChecked: false };
+        }
+        let parent = node.parent;
+        if (parent) {
+            this.propagateUp(parent, check);
+        }
+    }
+    findIndexInSelection(node) {
+        let index = -1;
+        if (this.selection() && this.selection().length) {
+            for (let i = 0; i < this.selection().length; i++) {
+                if (this.equals(node, this.selection()[i])) {
+                    index = i;
+                    break;
+                }
+            }
+        }
+        return index;
+    }
+    isSingleSelectionMode() {
+        return this.selectionMode() === 'single';
+    }
+    isMultipleSelectionMode() {
+        return this.selectionMode() === 'multiple';
+    }
+    equals(node1, node2) {
+        return this.compareSelectionBy() === 'equals' ? equals(node1, node2) : equals(node1.data, node2.data, this.dataKey());
+    }
+    filter(value, field, matchMode) {
+        if (this.filterTimeout) {
+            clearTimeout(this.filterTimeout);
+        }
+        if (!this.isFilterBlank(value)) {
+            this.filters()[field] = { value: value, matchMode: matchMode };
+        }
+        else if (this.filters()[field]) {
+            delete this.filters()[field];
+        }
+        this.filterTimeout = setTimeout(() => {
+            this._filter();
+            this.filterTimeout = null;
+        }, this.filterDelay());
+    }
+    filterGlobal(value, matchMode) {
+        this.filter(value, 'global', matchMode);
+    }
+    isFilterBlank(filter) {
+        if (filter !== null && filter !== undefined) {
+            if ((typeof filter === 'string' && filter.trim().length == 0) || (Array.isArray(filter) && filter.length == 0))
+                return true;
+            else
+                return false;
+        }
+        return true;
+    }
+    _filter() {
+        if (this.lazy()) {
+            this.onLazyLoad.emit(this.createLazyLoadMetadata());
+        }
+        else {
+            const value = this.value();
+            if (!value) {
+                return;
+            }
+            if (!this.hasFilter()) {
+                this.filteredNodes = null;
+                if (this.paginator()) {
+                    this.totalRecords.set(value ? value.length : 0);
+                }
+            }
+            else {
+                let globalFilterFieldsArray;
+                if (this.filters()['global']) {
+                    const columns = this.columns();
+                    const globalFilterFields = this.globalFilterFields();
+                    if (!columns && !globalFilterFields)
+                        throw new Error('Global filtering requires dynamic columns or globalFilterFields to be defined.');
+                    else
+                        globalFilterFieldsArray = globalFilterFields || columns;
+                }
+                this.filteredNodes = [];
+                const isStrictMode = this.filterMode() === 'strict';
+                let isValueChanged = false;
+                for (let node of value) {
+                    let copyNode = { ...node };
+                    let localMatch = true;
+                    let globalMatch = false;
+                    let paramsWithoutNode;
+                    for (let prop in this.filters()) {
+                        if (this.filters().hasOwnProperty(prop) && prop !== 'global') {
+                            let filterMeta = this.filters()[prop];
+                            let filterField = prop;
+                            let filterValue = filterMeta.value;
+                            let filterMatchMode = filterMeta.matchMode || 'startsWith';
+                            let filterConstraint = this.filterService.filters[filterMatchMode];
+                            paramsWithoutNode = { filterField, filterValue, filterConstraint, isStrictMode };
+                            if ((isStrictMode && !(this.findFilteredNodes(copyNode, paramsWithoutNode) || this.isFilterMatched(copyNode, paramsWithoutNode))) ||
+                                (!isStrictMode && !(this.isFilterMatched(copyNode, paramsWithoutNode) || this.findFilteredNodes(copyNode, paramsWithoutNode)))) {
+                                localMatch = false;
+                            }
+                            if (!localMatch) {
+                                break;
+                            }
+                        }
+                    }
+                    if (this.filters()['global'] && !globalMatch && globalFilterFieldsArray) {
+                        let copyNodeForGlobal = { ...copyNode };
+                        let filterField = undefined;
+                        let filterValue = this.filters()['global'].value;
+                        let filterConstraint = this.filterService.filters[this.filters()['global'].matchMode];
+                        paramsWithoutNode = {
+                            filterField,
+                            filterValue,
+                            filterConstraint,
+                            isStrictMode,
+                            globalFilterFieldsArray
+                        };
+                        if ((isStrictMode && (this.findFilteredNodes(copyNodeForGlobal, paramsWithoutNode) || this.isFilterMatched(copyNodeForGlobal, paramsWithoutNode))) ||
+                            (!isStrictMode && (this.isFilterMatched(copyNodeForGlobal, paramsWithoutNode) || this.findFilteredNodes(copyNodeForGlobal, paramsWithoutNode)))) {
+                            globalMatch = true;
+                            copyNode = copyNodeForGlobal;
+                        }
+                    }
+                    let matches = localMatch;
+                    if (this.filters()['global']) {
+                        matches = localMatch && globalMatch;
+                    }
+                    if (matches) {
+                        this.filteredNodes.push(copyNode);
+                    }
+                    isValueChanged = isValueChanged || !localMatch || globalMatch || (localMatch && this.filteredNodes.length > 0) || (!globalMatch && this.filteredNodes.length === 0);
+                }
+                if (!isValueChanged) {
+                    this.filteredNodes = null;
+                }
+                if (this.paginator()) {
+                    this.totalRecords.set(this.filteredNodes ? this.filteredNodes.length : value ? value.length : 0);
+                }
+            }
+            this.cd.markForCheck();
+        }
+        this.first.set(0);
+        const filteredValue = this.filteredNodes || this.value();
+        this.onFilter.emit({
+            filters: this.filters(),
+            filteredValue: filteredValue
+        });
+        this.tableService.onUIUpdate(filteredValue);
+        this.updateSerializedValue();
+        if (this.scrollable()) {
+            this.resetScrollTop();
+        }
+    }
+    findFilteredNodes(node, paramsWithoutNode) {
+        if (node) {
+            let matched = false;
+            if (node.children) {
+                let childNodes = [...node.children];
+                node.children = [];
+                for (let childNode of childNodes) {
+                    let copyChildNode = { ...childNode };
+                    if (this.isFilterMatched(copyChildNode, paramsWithoutNode)) {
+                        matched = true;
+                        node.children.push(copyChildNode);
+                    }
+                }
+            }
+            if (matched) {
+                return true;
+            }
+        }
+    }
+    isFilterMatched(node, filterOptions) {
+        let { filterField, filterValue, filterConstraint, isStrictMode, globalFilterFieldsArray } = filterOptions;
+        let matched = false;
+        const isMatched = (field) => filterConstraint(resolveFieldData(node.data, field), filterValue, this.filterLocale());
+        matched = globalFilterFieldsArray?.length ? globalFilterFieldsArray.some((globalFilterField) => isMatched(globalFilterField.field || globalFilterField)) : isMatched(filterField);
+        if (!matched || (isStrictMode && !this.isNodeLeaf(node))) {
+            matched =
+                this.findFilteredNodes(node, {
+                    filterField,
+                    filterValue,
+                    filterConstraint,
+                    isStrictMode,
+                    globalFilterFieldsArray
+                }) || matched;
+        }
+        return matched;
+    }
+    isNodeLeaf(node) {
+        return node.leaf === false ? false : !(node.children && node.children.length);
+    }
+    hasFilter() {
+        let empty = true;
+        for (let prop in this.filters()) {
+            if (this.filters().hasOwnProperty(prop)) {
+                empty = false;
+                break;
+            }
+        }
+        return !empty;
+    }
+    /**
+     * Clears the sort and paginator state.
+     * @group Method
+     */
+    reset() {
+        this.sortField.set(null);
+        this.sortOrder.set(1);
+        this.multiSortMeta.set(null);
+        this.tableService.onSort(null);
+        this.filteredNodes = null;
+        // `filters` is a plain input() (no filtersChange output), so it cannot be reassigned;
+        // clear it in place instead, mirroring table.ts's approach for its filters input.
+        for (const key of Object.keys(this.filters())) {
+            delete this.filters()[key];
+        }
+        this.first.set(0);
+        if (this.lazy()) {
+            this.onLazyLoad.emit(this.createLazyLoadMetadata());
+        }
+        else {
+            const value = this.value();
+            this.totalRecords.set(value ? value.length : 0);
+        }
+    }
+    updateEditingCell(cell, data, field) {
+        this.editingCell = cell;
+        this.editingCellData = data;
+        this.editingCellField = field;
+        this.bindDocumentEditListener();
+    }
+    isEditingCellValid() {
+        return this.editingCell && find(this.editingCell, '.ng-invalid.ng-dirty').length === 0;
+    }
+    bindDocumentEditListener() {
+        if (!this.documentEditListener) {
+            this.documentEditListener = this.renderer.listen(this.document, 'click', (event) => {
+                if (this.editingCell && !this.editingCellClick && this.isEditingCellValid()) {
+                    !this.$unstyled() && removeClass(this.editingCell, 'h-cell-editing');
+                    this.editingCell = null;
+                    this.onEditComplete.emit({ field: this.editingCellField, data: this.editingCellData });
+                    this.editingCellField = null;
+                    this.editingCellData = null;
+                    this.unbindDocumentEditListener();
+                }
+                this.editingCellClick = false;
+            });
+        }
+    }
+    unbindDocumentEditListener() {
+        if (this.documentEditListener) {
+            this.documentEditListener();
+            this.documentEditListener = null;
+        }
+    }
+    onDestroy() {
+        this.unbindDocumentEditListener();
+        this.editingCell = null;
+        this.editingCellField = null;
+        this.editingCellData = null;
+        this.initialized = null;
+    }
+    get dataP() {
+        return this.cn({
+            scrollable: this.scrollable(),
+            'flex-scrollable': this.scrollable() && this.scrollHeight() === 'flex',
+            loading: this.loading(),
+            empty: this.isEmpty()
+        });
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: TreeTable, deps: null, target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.6", type: TreeTable, isStandalone: false, selector: "h-treeTable, h-treetable, h-tree-table", inputs: { columns: { classPropertyName: "columns", publicName: "columns", isSignal: true, isRequired: false, transformFunction: null }, styleClass: { classPropertyName: "styleClass", publicName: "styleClass", isSignal: true, isRequired: false, transformFunction: null }, tableStyle: { classPropertyName: "tableStyle", publicName: "tableStyle", isSignal: true, isRequired: false, transformFunction: null }, tableStyleClass: { classPropertyName: "tableStyleClass", publicName: "tableStyleClass", isSignal: true, isRequired: false, transformFunction: null }, autoLayout: { classPropertyName: "autoLayout", publicName: "autoLayout", isSignal: true, isRequired: false, transformFunction: null }, lazy: { classPropertyName: "lazy", publicName: "lazy", isSignal: true, isRequired: false, transformFunction: null }, lazyLoadOnInit: { classPropertyName: "lazyLoadOnInit", publicName: "lazyLoadOnInit", isSignal: true, isRequired: false, transformFunction: null }, paginator: { classPropertyName: "paginator", publicName: "paginator", isSignal: true, isRequired: false, transformFunction: null }, rows: { classPropertyName: "rows", publicName: "rows", isSignal: true, isRequired: false, transformFunction: null }, first: { classPropertyName: "first", publicName: "first", isSignal: true, isRequired: false, transformFunction: null }, pageLinks: { classPropertyName: "pageLinks", publicName: "pageLinks", isSignal: true, isRequired: false, transformFunction: null }, rowsPerPageOptions: { classPropertyName: "rowsPerPageOptions", publicName: "rowsPerPageOptions", isSignal: true, isRequired: false, transformFunction: null }, alwaysShowPaginator: { classPropertyName: "alwaysShowPaginator", publicName: "alwaysShowPaginator", isSignal: true, isRequired: false, transformFunction: null }, paginatorPosition: { classPropertyName: "paginatorPosition", publicName: "paginatorPosition", isSignal: true, isRequired: false, transformFunction: null }, paginatorStyleClass: { classPropertyName: "paginatorStyleClass", publicName: "paginatorStyleClass", isSignal: true, isRequired: false, transformFunction: null }, paginatorDropdownAppendTo: { classPropertyName: "paginatorDropdownAppendTo", publicName: "paginatorDropdownAppendTo", isSignal: true, isRequired: false, transformFunction: null }, currentPageReportTemplate: { classPropertyName: "currentPageReportTemplate", publicName: "currentPageReportTemplate", isSignal: true, isRequired: false, transformFunction: null }, showCurrentPageReport: { classPropertyName: "showCurrentPageReport", publicName: "showCurrentPageReport", isSignal: true, isRequired: false, transformFunction: null }, showJumpToPageDropdown: { classPropertyName: "showJumpToPageDropdown", publicName: "showJumpToPageDropdown", isSignal: true, isRequired: false, transformFunction: null }, showFirstLastIcon: { classPropertyName: "showFirstLastIcon", publicName: "showFirstLastIcon", isSignal: true, isRequired: false, transformFunction: null }, showPageLinks: { classPropertyName: "showPageLinks", publicName: "showPageLinks", isSignal: true, isRequired: false, transformFunction: null }, defaultSortOrder: { classPropertyName: "defaultSortOrder", publicName: "defaultSortOrder", isSignal: true, isRequired: false, transformFunction: null }, sortMode: { classPropertyName: "sortMode", publicName: "sortMode", isSignal: true, isRequired: false, transformFunction: null }, resetPageOnSort: { classPropertyName: "resetPageOnSort", publicName: "resetPageOnSort", isSignal: true, isRequired: false, transformFunction: null }, customSort: { classPropertyName: "customSort", publicName: "customSort", isSignal: true, isRequired: false, transformFunction: null }, selectionMode: { classPropertyName: "selectionMode", publicName: "selectionMode", isSignal: true, isRequired: false, transformFunction: null }, contextMenuSelection: { classPropertyName: "contextMenuSelection", publicName: "contextMenuSelection", isSignal: true, isRequired: false, transformFunction: null }, contextMenuSelectionMode: { classPropertyName: "contextMenuSelectionMode", publicName: "contextMenuSelectionMode", isSignal: true, isRequired: false, transformFunction: null }, dataKey: { classPropertyName: "dataKey", publicName: "dataKey", isSignal: true, isRequired: false, transformFunction: null }, metaKeySelection: { classPropertyName: "metaKeySelection", publicName: "metaKeySelection", isSignal: true, isRequired: false, transformFunction: null }, compareSelectionBy: { classPropertyName: "compareSelectionBy", publicName: "compareSelectionBy", isSignal: true, isRequired: false, transformFunction: null }, rowHover: { classPropertyName: "rowHover", publicName: "rowHover", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, loadingIcon: { classPropertyName: "loadingIcon", publicName: "loadingIcon", isSignal: true, isRequired: false, transformFunction: null }, showLoader: { classPropertyName: "showLoader", publicName: "showLoader", isSignal: true, isRequired: false, transformFunction: null }, scrollable: { classPropertyName: "scrollable", publicName: "scrollable", isSignal: true, isRequired: false, transformFunction: null }, scrollHeight: { classPropertyName: "scrollHeight", publicName: "scrollHeight", isSignal: true, isRequired: false, transformFunction: null }, virtualScroll: { classPropertyName: "virtualScroll", publicName: "virtualScroll", isSignal: true, isRequired: false, transformFunction: null }, virtualScrollItemSize: { classPropertyName: "virtualScrollItemSize", publicName: "virtualScrollItemSize", isSignal: true, isRequired: false, transformFunction: null }, virtualScrollOptions: { classPropertyName: "virtualScrollOptions", publicName: "virtualScrollOptions", isSignal: true, isRequired: false, transformFunction: null }, virtualScrollDelay: { classPropertyName: "virtualScrollDelay", publicName: "virtualScrollDelay", isSignal: true, isRequired: false, transformFunction: null }, frozenWidth: { classPropertyName: "frozenWidth", publicName: "frozenWidth", isSignal: true, isRequired: false, transformFunction: null }, frozenColumns: { classPropertyName: "frozenColumns", publicName: "frozenColumns", isSignal: true, isRequired: false, transformFunction: null }, resizableColumns: { classPropertyName: "resizableColumns", publicName: "resizableColumns", isSignal: true, isRequired: false, transformFunction: null }, columnResizeMode: { classPropertyName: "columnResizeMode", publicName: "columnResizeMode", isSignal: true, isRequired: false, transformFunction: null }, reorderableColumns: { classPropertyName: "reorderableColumns", publicName: "reorderableColumns", isSignal: true, isRequired: false, transformFunction: null }, contextMenu: { classPropertyName: "contextMenu", publicName: "contextMenu", isSignal: true, isRequired: false, transformFunction: null }, rowTrackBy: { classPropertyName: "rowTrackBy", publicName: "rowTrackBy", isSignal: true, isRequired: false, transformFunction: null }, filters: { classPropertyName: "filters", publicName: "filters", isSignal: true, isRequired: false, transformFunction: null }, globalFilterFields: { classPropertyName: "globalFilterFields", publicName: "globalFilterFields", isSignal: true, isRequired: false, transformFunction: null }, filterDelay: { classPropertyName: "filterDelay", publicName: "filterDelay", isSignal: true, isRequired: false, transformFunction: null }, filterMode: { classPropertyName: "filterMode", publicName: "filterMode", isSignal: true, isRequired: false, transformFunction: null }, filterLocale: { classPropertyName: "filterLocale", publicName: "filterLocale", isSignal: true, isRequired: false, transformFunction: null }, paginatorLocale: { classPropertyName: "paginatorLocale", publicName: "paginatorLocale", isSignal: true, isRequired: false, transformFunction: null }, totalRecords: { classPropertyName: "totalRecords", publicName: "totalRecords", isSignal: true, isRequired: false, transformFunction: null }, sortField: { classPropertyName: "sortField", publicName: "sortField", isSignal: true, isRequired: false, transformFunction: null }, sortOrder: { classPropertyName: "sortOrder", publicName: "sortOrder", isSignal: true, isRequired: false, transformFunction: null }, multiSortMeta: { classPropertyName: "multiSortMeta", publicName: "multiSortMeta", isSignal: true, isRequired: false, transformFunction: null }, selection: { classPropertyName: "selection", publicName: "selection", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, virtualRowHeight: { classPropertyName: "virtualRowHeight", publicName: "virtualRowHeight", isSignal: true, isRequired: false, transformFunction: null }, selectionKeys: { classPropertyName: "selectionKeys", publicName: "selectionKeys", isSignal: true, isRequired: false, transformFunction: null }, showGridlines: { classPropertyName: "showGridlines", publicName: "showGridlines", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { rows: "rowsChange", first: "firstChange", contextMenuSelection: "contextMenuSelectionChange", totalRecords: "totalRecordsChange", sortField: "sortFieldChange", sortOrder: "sortOrderChange", multiSortMeta: "multiSortMetaChange", selection: "selectionChange", value: "valueChange", selectionKeys: "selectionKeysChange", onFilter: "onFilter", onNodeExpand: "onNodeExpand", onNodeCollapse: "onNodeCollapse", onPage: "onPage", onSort: "onSort", onLazyLoad: "onLazyLoad", sortFunction: "sortFunction", onColResize: "onColResize", onColReorder: "onColReorder", onNodeSelect: "onNodeSelect", onNodeUnselect: "onNodeUnselect", onContextMenuSelect: "onContextMenuSelect", onHeaderCheckboxToggle: "onHeaderCheckboxToggle", onEditInit: "onEditInit", onEditComplete: "onEditComplete", onEditCancel: "onEditCancel" }, host: { properties: { "class": "cn(cx('root'), styleClass())", "attr.data-h": "dataP", "attr.data-scrollselectors": "'.h-treetable-scrollable-body'" } }, providers: [TreeTableService, TreeTableStyle, { provide: TREETABLE_INSTANCE, useExisting: TreeTable }, { provide: PARENT_INSTANCE, useExisting: TreeTable }], queries: [{ propertyName: "_colGroupTemplate", first: true, predicate: ["colgroup"], isSignal: true }, { propertyName: "_captionTemplateSignal", first: true, predicate: ["caption"], isSignal: true }, { propertyName: "_headerTemplate", first: true, predicate: ["header"], isSignal: true }, { propertyName: "_bodyTemplate", first: true, predicate: ["body"], isSignal: true }, { propertyName: "_footerTemplateSignal", first: true, predicate: ["footer"], isSignal: true }, { propertyName: "_summaryTemplateSignal", first: true, predicate: ["summary"], isSignal: true }, { propertyName: "_emptyMessageTemplate", first: true, predicate: ["emptymessage"], isSignal: true }, { propertyName: "_paginatorLeftTemplate", first: true, predicate: ["paginatorleft"], isSignal: true }, { propertyName: "_paginatorRightTemplate", first: true, predicate: ["paginatorright"], isSignal: true }, { propertyName: "_paginatorDropdownItemTemplate", first: true, predicate: ["paginatordropdownitem"], isSignal: true }, { propertyName: "_frozenHeaderTemplate", first: true, predicate: ["frozenheader"], isSignal: true }, { propertyName: "_frozenBodyTemplate", first: true, predicate: ["frozenbody"], isSignal: true }, { propertyName: "_frozenFooterTemplate", first: true, predicate: ["frozenfooter"], isSignal: true }, { propertyName: "_frozenColGroupTemplate", first: true, predicate: ["frozencolgroup"], isSignal: true }, { propertyName: "_loadingIconTemplateSignal", first: true, predicate: ["loadingicon"], isSignal: true }, { propertyName: "_reorderIndicatorUpIconTemplate", first: true, predicate: ["reorderindicatorupicon"], isSignal: true }, { propertyName: "_reorderIndicatorDownIconTemplate", first: true, predicate: ["reorderindicatordownicon"], isSignal: true }, { propertyName: "_sortIconTemplateSignal", first: true, predicate: ["sorticon"], isSignal: true }, { propertyName: "_checkboxIconTemplateSignal", first: true, predicate: ["checkboxicon"], isSignal: true }, { propertyName: "_headerCheckboxIconTemplateSignal", first: true, predicate: ["headercheckboxicon"], isSignal: true }, { propertyName: "_togglerIconTemplate", first: true, predicate: ["togglericon"], isSignal: true }, { propertyName: "_paginatorFirstPageLinkIconTemplateSignal", first: true, predicate: ["paginatorfirstpagelinkicon"], isSignal: true }, { propertyName: "_paginatorLastPageLinkIconTemplateSignal", first: true, predicate: ["paginatorlastpagelinkicon"], isSignal: true }, { propertyName: "_paginatorPreviousPageLinkIconTemplateSignal", first: true, predicate: ["paginatorpreviouspagelinkicon"], isSignal: true }, { propertyName: "_paginatorNextPageLinkIconTemplateSignal", first: true, predicate: ["paginatornextpagelinkicon"], isSignal: true }, { propertyName: "_loaderTemplateSignal", first: true, predicate: ["loader"], isSignal: true }, { propertyName: "templates", predicate: HelixTemplate, isSignal: true }], viewQueries: [{ propertyName: "resizeHelperViewChild", first: true, predicate: ["resizeHelper"], descendants: true, isSignal: true }, { propertyName: "reorderIndicatorUpViewChild", first: true, predicate: ["reorderIndicatorUp"], descendants: true, isSignal: true }, { propertyName: "reorderIndicatorDownViewChild", first: true, predicate: ["reorderIndicatorDown"], descendants: true, isSignal: true }, { propertyName: "tableViewChild", first: true, predicate: ["table"], descendants: true, isSignal: true }, { propertyName: "scrollableViewChild", first: true, predicate: ["scrollableView"], descendants: true, isSignal: true }, { propertyName: "scrollableFrozenViewChild", first: true, predicate: ["scrollableFrozenView"], descendants: true, isSignal: true }], usesInheritance: true, hostDirectives: [{ directive: i1.Bind }], ngImport: i0, template: "@if (loading() && showLoader()) {\n  <div [hBind]=\"ptm('mask')\" [class]=\"cx('mask')\" animate.enter=\"h-overlay-mask-enter-active\" animate.leave=\"h-overlay-mask-leave-active\">\n    @if (loadingIcon()) {\n      <i [class]=\"cn(cx('loadingIcon'), 'pi-spin' + loadingIcon())\"></i>\n    }\n    @if (!loadingIcon()) {\n      @if (!loadingIconTemplate && !_loadingIconTemplate) {\n        <svg data-h-icon=\"spinner\" [spin]=\"true\" [class]=\"cx('loadingIcon')\" />\n      }\n      @if (loadingIconTemplate || _loadingIconTemplate) {\n        <span [class]=\"cx('loadingIcon')\">\n          <ng-template *ngTemplateOutlet=\"loadingIconTemplate || _loadingIconTemplate\"></ng-template>\n        </span>\n      }\n    }\n  </div>\n}\n@if (captionTemplate || _captionTemplate) {\n  <div [hBind]=\"ptm('header')\" [class]=\"cx('header')\">\n    <ng-container *ngTemplateOutlet=\"captionTemplate || _captionTemplate\"></ng-container>\n  </div>\n}\n@if (paginator() && (paginatorPosition() === 'top' || paginatorPosition() == 'both')) {\n  <h-paginator\n    [pt]=\"ptm('pcPaginator')\"\n    [rows]=\"rows()\"\n    [first]=\"first()\"\n    [totalRecords]=\"totalRecords()\"\n    [pageLinkSize]=\"pageLinks()\"\n    [styleClass]=\"cx('pcPaginator')\"\n    [alwaysShow]=\"alwaysShowPaginator()\"\n    (onPageChange)=\"onPageChange($event)\"\n    [rowsPerPageOptions]=\"rowsPerPageOptions()\"\n    [templateLeft]=\"paginatorLeftTemplate ?? _paginatorLeftTemplate()\"\n    [templateRight]=\"paginatorRightTemplate ?? _paginatorRightTemplate()\"\n    [appendTo]=\"paginatorDropdownAppendTo()\"\n    [currentPageReportTemplate]=\"currentPageReportTemplate()\"\n    [showFirstLastIcon]=\"showFirstLastIcon()\"\n    [dropdownItemTemplate]=\"paginatorDropdownItemTemplate ?? _paginatorDropdownItemTemplate()\"\n    [showCurrentPageReport]=\"showCurrentPageReport()\"\n    [showJumpToPageDropdown]=\"showJumpToPageDropdown()\"\n    [showPageLinks]=\"showPageLinks()\"\n    [locale]=\"paginatorLocale()\"\n    [unstyled]=\"unstyled()\"\n    >\n    @if (paginatorFirstPageLinkIconTemplate || _paginatorFirstPageLinkIconTemplate) {\n      <ng-template hTemplate=\"firstpagelinkicon\">\n        <ng-container *ngTemplateOutlet=\"paginatorFirstPageLinkIconTemplate || _paginatorFirstPageLinkIconTemplate\"></ng-container>\n      </ng-template>\n    }\n    @if (paginatorPreviousPageLinkIconTemplate || _paginatorPreviousPageLinkIconTemplate) {\n      <ng-template hTemplate=\"previouspagelinkicon\">\n        <ng-container *ngTemplateOutlet=\"paginatorPreviousPageLinkIconTemplate || _paginatorPreviousPageLinkIconTemplate\"></ng-container>\n      </ng-template>\n    }\n    @if (paginatorLastPageLinkIconTemplate || _paginatorLastPageLinkIconTemplate) {\n      <ng-template hTemplate=\"lastpagelinkicon\">\n        <ng-container *ngTemplateOutlet=\"paginatorLastPageLinkIconTemplate || _paginatorLastPageLinkIconTemplate\"></ng-container>\n      </ng-template>\n    }\n    @if (paginatorNextPageLinkIconTemplate || _paginatorNextPageLinkIconTemplate) {\n      <ng-template hTemplate=\"nextpagelinkicon\">\n        <ng-container *ngTemplateOutlet=\"paginatorNextPageLinkIconTemplate || _paginatorNextPageLinkIconTemplate\"></ng-container>\n      </ng-template>\n    }\n  </h-paginator>\n}\n\n@if (!scrollable()) {\n  <div [hBind]=\"ptm('wrapper')\" [class]=\"cx('wrapper')\">\n    <table role=\"treegrid\" [hBind]=\"ptm('table')\" #table [ngClass]=\"tableStyleClass()\" [ngStyle]=\"tableStyle()\">\n      <ng-container *ngTemplateOutlet=\"colGroupTemplate || _colGroupTemplate(); context: { $implicit: columns() }\"></ng-container>\n      <thead role=\"rowgroup\" [class]=\"cx('thead')\" [hBind]=\"ptm('thead')\">\n        <ng-container *ngTemplateOutlet=\"headerTemplate || _headerTemplate(); context: { $implicit: columns() }\"></ng-container>\n      </thead>\n      <tbody [class]=\"cx('tbody')\" [hBind]=\"ptm('tbody')\" role=\"rowgroup\" [unstyled]=\"unstyled()\" [hTreeTableBody]=\"columns()\" [pTreeTableBodyTemplate]=\"bodyTemplate ?? _bodyTemplate()\"></tbody>\n      <tfoot [class]=\"cx('tfoot')\" [hBind]=\"ptm('tfoot')\" role=\"rowgroup\">\n        <ng-container *ngTemplateOutlet=\"footerTemplate || _footerTemplate; context: { $implicit: columns() }\"></ng-container>\n      </tfoot>\n    </table>\n  </div>\n}\n\n@if (scrollable()) {\n  <div [hBind]=\"ptm('scrollableWrapper')\" [class]=\"cx('scrollableWrapper')\">\n    @if (frozenColumns() || frozenBodyTemplate || _frozenBodyTemplate()) {\n      <div\n        [ngClass]=\"[cx('scrollableView'), cx('frozenView')]\"\n        #scrollableFrozenView\n        [ttScrollableView]=\"frozenColumns()\"\n        [unstyled]=\"unstyled()\"\n        [frozen]=\"true\"\n        [ngStyle]=\"{ width: frozenWidth() }\"\n        [scrollHeight]=\"scrollHeight()\"\n        [hBind]=\"ptm('scrollableView')\"\n      ></div>\n    }\n    <div\n      [class]=\"cx('scrollableView')\"\n      [hBind]=\"ptm('scrollableView')\"\n      #scrollableView\n      [ttScrollableView]=\"columns()\"\n      [unstyled]=\"unstyled()\"\n      [frozen]=\"false\"\n      [scrollHeight]=\"scrollHeight()\"\n      [ngStyle]=\"{ left: frozenWidth(), width: 'calc(100% - ' + frozenWidth() + ')' }\"\n    ></div>\n  </div>\n}\n\n@if (paginator() && (paginatorPosition() === 'bottom' || paginatorPosition() == 'both')) {\n  <h-paginator\n    [pt]=\"ptm('pcPaginator')\"\n    [rows]=\"rows()\"\n    [first]=\"first()\"\n    [totalRecords]=\"totalRecords()\"\n    [pageLinkSize]=\"pageLinks()\"\n    [styleClass]=\"cx('pcPaginator')\"\n    [alwaysShow]=\"alwaysShowPaginator()\"\n    (onPageChange)=\"onPageChange($event)\"\n    [rowsPerPageOptions]=\"rowsPerPageOptions()\"\n    [templateLeft]=\"paginatorLeftTemplate ?? _paginatorLeftTemplate()\"\n    [templateRight]=\"paginatorRightTemplate ?? _paginatorRightTemplate()\"\n    [appendTo]=\"paginatorDropdownAppendTo()\"\n    [currentPageReportTemplate]=\"currentPageReportTemplate()\"\n    [showFirstLastIcon]=\"showFirstLastIcon()\"\n    [dropdownItemTemplate]=\"paginatorDropdownItemTemplate ?? _paginatorDropdownItemTemplate()\"\n    [showCurrentPageReport]=\"showCurrentPageReport()\"\n    [showJumpToPageDropdown]=\"showJumpToPageDropdown()\"\n    [showPageLinks]=\"showPageLinks()\"\n    [locale]=\"paginatorLocale()\"\n    [unstyled]=\"unstyled()\"\n    >\n    @if (paginatorFirstPageLinkIconTemplate || _paginatorFirstPageLinkIconTemplate) {\n      <ng-template hTemplate=\"firstpagelinkicon\">\n        <ng-container *ngTemplateOutlet=\"paginatorFirstPageLinkIconTemplate || _paginatorFirstPageLinkIconTemplate\"></ng-container>\n      </ng-template>\n    }\n    @if (paginatorPreviousPageLinkIconTemplate || _paginatorPreviousPageLinkIconTemplate) {\n      <ng-template hTemplate=\"previouspagelinkicon\">\n        <ng-container *ngTemplateOutlet=\"paginatorPreviousPageLinkIconTemplate || _paginatorPreviousPageLinkIconTemplate\"></ng-container>\n      </ng-template>\n    }\n    @if (paginatorLastPageLinkIconTemplate || _paginatorLastPageLinkIconTemplate) {\n      <ng-template hTemplate=\"lastpagelinkicon\">\n        <ng-container *ngTemplateOutlet=\"paginatorLastPageLinkIconTemplate || _paginatorLastPageLinkIconTemplate\"></ng-container>\n      </ng-template>\n    }\n    @if (paginatorNextPageLinkIconTemplate || _paginatorNextPageLinkIconTemplate) {\n      <ng-template hTemplate=\"nextpagelinkicon\">\n        <ng-container *ngTemplateOutlet=\"paginatorNextPageLinkIconTemplate || _paginatorNextPageLinkIconTemplate\"></ng-container>\n      </ng-template>\n    }\n  </h-paginator>\n}\n@if (summaryTemplate || _summaryTemplate) {\n  <div [hBind]=\"ptm('footer')\" [class]=\"cx('footer')\">\n    <ng-container *ngTemplateOutlet=\"summaryTemplate || _summaryTemplate\"></ng-container>\n  </div>\n}\n\n@if (resizableColumns()) {\n  <div [hBind]=\"ptm('columnResizerHelper')\" #resizeHelper [class]=\"cx('columnResizerHelper')\" [style.display]=\"'none'\"></div>\n}\n@if (reorderableColumns()) {\n  <span [hBind]=\"ptm('reorderIndicatorUp')\" #reorderIndicatorUp [class]=\"cx('reorderIndicatorUp')\" [style.display]=\"'none'\">\n    @if (!reorderIndicatorUpIconTemplate && !_reorderIndicatorUpIconTemplate()) {\n      <svg data-h-icon=\"arrow-down\" />\n    }\n    <ng-template *ngTemplateOutlet=\"reorderIndicatorUpIconTemplate || _reorderIndicatorUpIconTemplate()\"></ng-template>\n  </span>\n}\n@if (reorderableColumns()) {\n  <span [hBind]=\"ptm('reorderIndicatorDown')\" #reorderIndicatorDown [class]=\"cx('reorderIndicatorDown')\" [style.display]=\"'none'\">\n    @if (!reorderIndicatorDownIconTemplate && !_reorderIndicatorDownIconTemplate()) {\n      <svg data-h-icon=\"arrow-up\" />\n    }\n    <ng-template *ngTemplateOutlet=\"reorderIndicatorDownIconTemplate || _reorderIndicatorDownIconTemplate()\"></ng-template>\n  </span>\n}\n", dependencies: [{ kind: "directive", type: i0.forwardRef(() => i2.NgClass), selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i0.forwardRef(() => i2.NgTemplateOutlet), selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i0.forwardRef(() => i2.NgStyle), selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: i0.forwardRef(() => i3.Paginator), selector: "h-paginator", inputs: ["pageLinkSize", "styleClass", "alwaysShow", "dropdownAppendTo", "templateLeft", "templateRight", "dropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showFirstLastIcon", "totalRecords", "rows", "rowsPerPageOptions", "showJumpToPageDropdown", "showJumpToPageInput", "jumpToPageItemTemplate", "showPageLinks", "locale", "dropdownItemTemplate", "first", "appendTo"], outputs: ["rowsChange", "firstChange", "onPageChange"] }, { kind: "directive", type: i0.forwardRef(() => i4.HelixTemplate), selector: "[hTemplate]", inputs: ["type", "hTemplate"] }, { kind: "component", type: i0.forwardRef(() => SpinnerIcon), selector: "[data-h-icon=\"spinner\"]" }, { kind: "component", type: i0.forwardRef(() => ArrowDownIcon), selector: "[data-h-icon=\"arrow-down\"]" }, { kind: "component", type: i0.forwardRef(() => ArrowUpIcon), selector: "[data-h-icon=\"arrow-up\"]" }, { kind: "directive", type: i0.forwardRef(() => i1.Bind), selector: "[hBind]", inputs: ["hBind"] }, { kind: "component", type: i0.forwardRef(() => TTScrollableView), selector: "[ttScrollableView]", inputs: ["ttScrollableView", "frozen", "scrollHeight"] }, { kind: "component", type: i0.forwardRef(() => TTBody), selector: "[hTreeTableBody]", inputs: ["hTreeTableBody", "pTreeTableBodyTemplate", "frozen", "serializedNodes", "scrollerOptions"] }], changeDetection: i0.ChangeDetectionStrategy.Eager, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: TreeTable, decorators: [{
+            type: Component,
+            args: [{ selector: 'h-treeTable, h-treetable, h-tree-table', standalone: false, providers: [TreeTableService, TreeTableStyle, { provide: TREETABLE_INSTANCE, useExisting: TreeTable }, { provide: PARENT_INSTANCE, useExisting: TreeTable }], encapsulation: ViewEncapsulation.None, host: {
+                        '[class]': "cn(cx('root'), styleClass())",
+                        '[attr.data-h]': 'dataP',
+                        '[attr.data-scrollselectors]': "'.h-treetable-scrollable-body'"
+                    }, changeDetection: ChangeDetectionStrategy.Eager, hostDirectives: [Bind], template: "@if (loading() && showLoader()) {\n  <div [hBind]=\"ptm('mask')\" [class]=\"cx('mask')\" animate.enter=\"h-overlay-mask-enter-active\" animate.leave=\"h-overlay-mask-leave-active\">\n    @if (loadingIcon()) {\n      <i [class]=\"cn(cx('loadingIcon'), 'pi-spin' + loadingIcon())\"></i>\n    }\n    @if (!loadingIcon()) {\n      @if (!loadingIconTemplate && !_loadingIconTemplate) {\n        <svg data-h-icon=\"spinner\" [spin]=\"true\" [class]=\"cx('loadingIcon')\" />\n      }\n      @if (loadingIconTemplate || _loadingIconTemplate) {\n        <span [class]=\"cx('loadingIcon')\">\n          <ng-template *ngTemplateOutlet=\"loadingIconTemplate || _loadingIconTemplate\"></ng-template>\n        </span>\n      }\n    }\n  </div>\n}\n@if (captionTemplate || _captionTemplate) {\n  <div [hBind]=\"ptm('header')\" [class]=\"cx('header')\">\n    <ng-container *ngTemplateOutlet=\"captionTemplate || _captionTemplate\"></ng-container>\n  </div>\n}\n@if (paginator() && (paginatorPosition() === 'top' || paginatorPosition() == 'both')) {\n  <h-paginator\n    [pt]=\"ptm('pcPaginator')\"\n    [rows]=\"rows()\"\n    [first]=\"first()\"\n    [totalRecords]=\"totalRecords()\"\n    [pageLinkSize]=\"pageLinks()\"\n    [styleClass]=\"cx('pcPaginator')\"\n    [alwaysShow]=\"alwaysShowPaginator()\"\n    (onPageChange)=\"onPageChange($event)\"\n    [rowsPerPageOptions]=\"rowsPerPageOptions()\"\n    [templateLeft]=\"paginatorLeftTemplate ?? _paginatorLeftTemplate()\"\n    [templateRight]=\"paginatorRightTemplate ?? _paginatorRightTemplate()\"\n    [appendTo]=\"paginatorDropdownAppendTo()\"\n    [currentPageReportTemplate]=\"currentPageReportTemplate()\"\n    [showFirstLastIcon]=\"showFirstLastIcon()\"\n    [dropdownItemTemplate]=\"paginatorDropdownItemTemplate ?? _paginatorDropdownItemTemplate()\"\n    [showCurrentPageReport]=\"showCurrentPageReport()\"\n    [showJumpToPageDropdown]=\"showJumpToPageDropdown()\"\n    [showPageLinks]=\"showPageLinks()\"\n    [locale]=\"paginatorLocale()\"\n    [unstyled]=\"unstyled()\"\n    >\n    @if (paginatorFirstPageLinkIconTemplate || _paginatorFirstPageLinkIconTemplate) {\n      <ng-template hTemplate=\"firstpagelinkicon\">\n        <ng-container *ngTemplateOutlet=\"paginatorFirstPageLinkIconTemplate || _paginatorFirstPageLinkIconTemplate\"></ng-container>\n      </ng-template>\n    }\n    @if (paginatorPreviousPageLinkIconTemplate || _paginatorPreviousPageLinkIconTemplate) {\n      <ng-template hTemplate=\"previouspagelinkicon\">\n        <ng-container *ngTemplateOutlet=\"paginatorPreviousPageLinkIconTemplate || _paginatorPreviousPageLinkIconTemplate\"></ng-container>\n      </ng-template>\n    }\n    @if (paginatorLastPageLinkIconTemplate || _paginatorLastPageLinkIconTemplate) {\n      <ng-template hTemplate=\"lastpagelinkicon\">\n        <ng-container *ngTemplateOutlet=\"paginatorLastPageLinkIconTemplate || _paginatorLastPageLinkIconTemplate\"></ng-container>\n      </ng-template>\n    }\n    @if (paginatorNextPageLinkIconTemplate || _paginatorNextPageLinkIconTemplate) {\n      <ng-template hTemplate=\"nextpagelinkicon\">\n        <ng-container *ngTemplateOutlet=\"paginatorNextPageLinkIconTemplate || _paginatorNextPageLinkIconTemplate\"></ng-container>\n      </ng-template>\n    }\n  </h-paginator>\n}\n\n@if (!scrollable()) {\n  <div [hBind]=\"ptm('wrapper')\" [class]=\"cx('wrapper')\">\n    <table role=\"treegrid\" [hBind]=\"ptm('table')\" #table [ngClass]=\"tableStyleClass()\" [ngStyle]=\"tableStyle()\">\n      <ng-container *ngTemplateOutlet=\"colGroupTemplate || _colGroupTemplate(); context: { $implicit: columns() }\"></ng-container>\n      <thead role=\"rowgroup\" [class]=\"cx('thead')\" [hBind]=\"ptm('thead')\">\n        <ng-container *ngTemplateOutlet=\"headerTemplate || _headerTemplate(); context: { $implicit: columns() }\"></ng-container>\n      </thead>\n      <tbody [class]=\"cx('tbody')\" [hBind]=\"ptm('tbody')\" role=\"rowgroup\" [unstyled]=\"unstyled()\" [hTreeTableBody]=\"columns()\" [pTreeTableBodyTemplate]=\"bodyTemplate ?? _bodyTemplate()\"></tbody>\n      <tfoot [class]=\"cx('tfoot')\" [hBind]=\"ptm('tfoot')\" role=\"rowgroup\">\n        <ng-container *ngTemplateOutlet=\"footerTemplate || _footerTemplate; context: { $implicit: columns() }\"></ng-container>\n      </tfoot>\n    </table>\n  </div>\n}\n\n@if (scrollable()) {\n  <div [hBind]=\"ptm('scrollableWrapper')\" [class]=\"cx('scrollableWrapper')\">\n    @if (frozenColumns() || frozenBodyTemplate || _frozenBodyTemplate()) {\n      <div\n        [ngClass]=\"[cx('scrollableView'), cx('frozenView')]\"\n        #scrollableFrozenView\n        [ttScrollableView]=\"frozenColumns()\"\n        [unstyled]=\"unstyled()\"\n        [frozen]=\"true\"\n        [ngStyle]=\"{ width: frozenWidth() }\"\n        [scrollHeight]=\"scrollHeight()\"\n        [hBind]=\"ptm('scrollableView')\"\n      ></div>\n    }\n    <div\n      [class]=\"cx('scrollableView')\"\n      [hBind]=\"ptm('scrollableView')\"\n      #scrollableView\n      [ttScrollableView]=\"columns()\"\n      [unstyled]=\"unstyled()\"\n      [frozen]=\"false\"\n      [scrollHeight]=\"scrollHeight()\"\n      [ngStyle]=\"{ left: frozenWidth(), width: 'calc(100% - ' + frozenWidth() + ')' }\"\n    ></div>\n  </div>\n}\n\n@if (paginator() && (paginatorPosition() === 'bottom' || paginatorPosition() == 'both')) {\n  <h-paginator\n    [pt]=\"ptm('pcPaginator')\"\n    [rows]=\"rows()\"\n    [first]=\"first()\"\n    [totalRecords]=\"totalRecords()\"\n    [pageLinkSize]=\"pageLinks()\"\n    [styleClass]=\"cx('pcPaginator')\"\n    [alwaysShow]=\"alwaysShowPaginator()\"\n    (onPageChange)=\"onPageChange($event)\"\n    [rowsPerPageOptions]=\"rowsPerPageOptions()\"\n    [templateLeft]=\"paginatorLeftTemplate ?? _paginatorLeftTemplate()\"\n    [templateRight]=\"paginatorRightTemplate ?? _paginatorRightTemplate()\"\n    [appendTo]=\"paginatorDropdownAppendTo()\"\n    [currentPageReportTemplate]=\"currentPageReportTemplate()\"\n    [showFirstLastIcon]=\"showFirstLastIcon()\"\n    [dropdownItemTemplate]=\"paginatorDropdownItemTemplate ?? _paginatorDropdownItemTemplate()\"\n    [showCurrentPageReport]=\"showCurrentPageReport()\"\n    [showJumpToPageDropdown]=\"showJumpToPageDropdown()\"\n    [showPageLinks]=\"showPageLinks()\"\n    [locale]=\"paginatorLocale()\"\n    [unstyled]=\"unstyled()\"\n    >\n    @if (paginatorFirstPageLinkIconTemplate || _paginatorFirstPageLinkIconTemplate) {\n      <ng-template hTemplate=\"firstpagelinkicon\">\n        <ng-container *ngTemplateOutlet=\"paginatorFirstPageLinkIconTemplate || _paginatorFirstPageLinkIconTemplate\"></ng-container>\n      </ng-template>\n    }\n    @if (paginatorPreviousPageLinkIconTemplate || _paginatorPreviousPageLinkIconTemplate) {\n      <ng-template hTemplate=\"previouspagelinkicon\">\n        <ng-container *ngTemplateOutlet=\"paginatorPreviousPageLinkIconTemplate || _paginatorPreviousPageLinkIconTemplate\"></ng-container>\n      </ng-template>\n    }\n    @if (paginatorLastPageLinkIconTemplate || _paginatorLastPageLinkIconTemplate) {\n      <ng-template hTemplate=\"lastpagelinkicon\">\n        <ng-container *ngTemplateOutlet=\"paginatorLastPageLinkIconTemplate || _paginatorLastPageLinkIconTemplate\"></ng-container>\n      </ng-template>\n    }\n    @if (paginatorNextPageLinkIconTemplate || _paginatorNextPageLinkIconTemplate) {\n      <ng-template hTemplate=\"nextpagelinkicon\">\n        <ng-container *ngTemplateOutlet=\"paginatorNextPageLinkIconTemplate || _paginatorNextPageLinkIconTemplate\"></ng-container>\n      </ng-template>\n    }\n  </h-paginator>\n}\n@if (summaryTemplate || _summaryTemplate) {\n  <div [hBind]=\"ptm('footer')\" [class]=\"cx('footer')\">\n    <ng-container *ngTemplateOutlet=\"summaryTemplate || _summaryTemplate\"></ng-container>\n  </div>\n}\n\n@if (resizableColumns()) {\n  <div [hBind]=\"ptm('columnResizerHelper')\" #resizeHelper [class]=\"cx('columnResizerHelper')\" [style.display]=\"'none'\"></div>\n}\n@if (reorderableColumns()) {\n  <span [hBind]=\"ptm('reorderIndicatorUp')\" #reorderIndicatorUp [class]=\"cx('reorderIndicatorUp')\" [style.display]=\"'none'\">\n    @if (!reorderIndicatorUpIconTemplate && !_reorderIndicatorUpIconTemplate()) {\n      <svg data-h-icon=\"arrow-down\" />\n    }\n    <ng-template *ngTemplateOutlet=\"reorderIndicatorUpIconTemplate || _reorderIndicatorUpIconTemplate()\"></ng-template>\n  </span>\n}\n@if (reorderableColumns()) {\n  <span [hBind]=\"ptm('reorderIndicatorDown')\" #reorderIndicatorDown [class]=\"cx('reorderIndicatorDown')\" [style.display]=\"'none'\">\n    @if (!reorderIndicatorDownIconTemplate && !_reorderIndicatorDownIconTemplate()) {\n      <svg data-h-icon=\"arrow-up\" />\n    }\n    <ng-template *ngTemplateOutlet=\"reorderIndicatorDownIconTemplate || _reorderIndicatorDownIconTemplate()\"></ng-template>\n  </span>\n}\n" }]
+        }], propDecorators: { columns: [{ type: i0.Input, args: [{ isSignal: true, alias: "columns", required: false }] }], styleClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "styleClass", required: false }] }], tableStyle: [{ type: i0.Input, args: [{ isSignal: true, alias: "tableStyle", required: false }] }], tableStyleClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "tableStyleClass", required: false }] }], autoLayout: [{ type: i0.Input, args: [{ isSignal: true, alias: "autoLayout", required: false }] }], lazy: [{ type: i0.Input, args: [{ isSignal: true, alias: "lazy", required: false }] }], lazyLoadOnInit: [{ type: i0.Input, args: [{ isSignal: true, alias: "lazyLoadOnInit", required: false }] }], paginator: [{ type: i0.Input, args: [{ isSignal: true, alias: "paginator", required: false }] }], rows: [{ type: i0.Input, args: [{ isSignal: true, alias: "rows", required: false }] }, { type: i0.Output, args: ["rowsChange"] }], first: [{ type: i0.Input, args: [{ isSignal: true, alias: "first", required: false }] }, { type: i0.Output, args: ["firstChange"] }], pageLinks: [{ type: i0.Input, args: [{ isSignal: true, alias: "pageLinks", required: false }] }], rowsPerPageOptions: [{ type: i0.Input, args: [{ isSignal: true, alias: "rowsPerPageOptions", required: false }] }], alwaysShowPaginator: [{ type: i0.Input, args: [{ isSignal: true, alias: "alwaysShowPaginator", required: false }] }], paginatorPosition: [{ type: i0.Input, args: [{ isSignal: true, alias: "paginatorPosition", required: false }] }], paginatorStyleClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "paginatorStyleClass", required: false }] }], paginatorDropdownAppendTo: [{ type: i0.Input, args: [{ isSignal: true, alias: "paginatorDropdownAppendTo", required: false }] }], currentPageReportTemplate: [{ type: i0.Input, args: [{ isSignal: true, alias: "currentPageReportTemplate", required: false }] }], showCurrentPageReport: [{ type: i0.Input, args: [{ isSignal: true, alias: "showCurrentPageReport", required: false }] }], showJumpToPageDropdown: [{ type: i0.Input, args: [{ isSignal: true, alias: "showJumpToPageDropdown", required: false }] }], showFirstLastIcon: [{ type: i0.Input, args: [{ isSignal: true, alias: "showFirstLastIcon", required: false }] }], showPageLinks: [{ type: i0.Input, args: [{ isSignal: true, alias: "showPageLinks", required: false }] }], defaultSortOrder: [{ type: i0.Input, args: [{ isSignal: true, alias: "defaultSortOrder", required: false }] }], sortMode: [{ type: i0.Input, args: [{ isSignal: true, alias: "sortMode", required: false }] }], resetPageOnSort: [{ type: i0.Input, args: [{ isSignal: true, alias: "resetPageOnSort", required: false }] }], customSort: [{ type: i0.Input, args: [{ isSignal: true, alias: "customSort", required: false }] }], selectionMode: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectionMode", required: false }] }], contextMenuSelection: [{ type: i0.Input, args: [{ isSignal: true, alias: "contextMenuSelection", required: false }] }, { type: i0.Output, args: ["contextMenuSelectionChange"] }], contextMenuSelectionMode: [{ type: i0.Input, args: [{ isSignal: true, alias: "contextMenuSelectionMode", required: false }] }], dataKey: [{ type: i0.Input, args: [{ isSignal: true, alias: "dataKey", required: false }] }], metaKeySelection: [{ type: i0.Input, args: [{ isSignal: true, alias: "metaKeySelection", required: false }] }], compareSelectionBy: [{ type: i0.Input, args: [{ isSignal: true, alias: "compareSelectionBy", required: false }] }], rowHover: [{ type: i0.Input, args: [{ isSignal: true, alias: "rowHover", required: false }] }], loading: [{ type: i0.Input, args: [{ isSignal: true, alias: "loading", required: false }] }], loadingIcon: [{ type: i0.Input, args: [{ isSignal: true, alias: "loadingIcon", required: false }] }], showLoader: [{ type: i0.Input, args: [{ isSignal: true, alias: "showLoader", required: false }] }], scrollable: [{ type: i0.Input, args: [{ isSignal: true, alias: "scrollable", required: false }] }], scrollHeight: [{ type: i0.Input, args: [{ isSignal: true, alias: "scrollHeight", required: false }] }], virtualScroll: [{ type: i0.Input, args: [{ isSignal: true, alias: "virtualScroll", required: false }] }], virtualScrollItemSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "virtualScrollItemSize", required: false }] }], virtualScrollOptions: [{ type: i0.Input, args: [{ isSignal: true, alias: "virtualScrollOptions", required: false }] }], virtualScrollDelay: [{ type: i0.Input, args: [{ isSignal: true, alias: "virtualScrollDelay", required: false }] }], frozenWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "frozenWidth", required: false }] }], frozenColumns: [{ type: i0.Input, args: [{ isSignal: true, alias: "frozenColumns", required: false }] }], resizableColumns: [{ type: i0.Input, args: [{ isSignal: true, alias: "resizableColumns", required: false }] }], columnResizeMode: [{ type: i0.Input, args: [{ isSignal: true, alias: "columnResizeMode", required: false }] }], reorderableColumns: [{ type: i0.Input, args: [{ isSignal: true, alias: "reorderableColumns", required: false }] }], contextMenu: [{ type: i0.Input, args: [{ isSignal: true, alias: "contextMenu", required: false }] }], rowTrackBy: [{ type: i0.Input, args: [{ isSignal: true, alias: "rowTrackBy", required: false }] }], filters: [{ type: i0.Input, args: [{ isSignal: true, alias: "filters", required: false }] }], globalFilterFields: [{ type: i0.Input, args: [{ isSignal: true, alias: "globalFilterFields", required: false }] }], filterDelay: [{ type: i0.Input, args: [{ isSignal: true, alias: "filterDelay", required: false }] }], filterMode: [{ type: i0.Input, args: [{ isSignal: true, alias: "filterMode", required: false }] }], filterLocale: [{ type: i0.Input, args: [{ isSignal: true, alias: "filterLocale", required: false }] }], paginatorLocale: [{ type: i0.Input, args: [{ isSignal: true, alias: "paginatorLocale", required: false }] }], totalRecords: [{ type: i0.Input, args: [{ isSignal: true, alias: "totalRecords", required: false }] }, { type: i0.Output, args: ["totalRecordsChange"] }], sortField: [{ type: i0.Input, args: [{ isSignal: true, alias: "sortField", required: false }] }, { type: i0.Output, args: ["sortFieldChange"] }], sortOrder: [{ type: i0.Input, args: [{ isSignal: true, alias: "sortOrder", required: false }] }, { type: i0.Output, args: ["sortOrderChange"] }], multiSortMeta: [{ type: i0.Input, args: [{ isSignal: true, alias: "multiSortMeta", required: false }] }, { type: i0.Output, args: ["multiSortMetaChange"] }], selection: [{ type: i0.Input, args: [{ isSignal: true, alias: "selection", required: false }] }, { type: i0.Output, args: ["selectionChange"] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }], virtualRowHeight: [{ type: i0.Input, args: [{ isSignal: true, alias: "virtualRowHeight", required: false }] }], selectionKeys: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectionKeys", required: false }] }, { type: i0.Output, args: ["selectionKeysChange"] }], showGridlines: [{ type: i0.Input, args: [{ isSignal: true, alias: "showGridlines", required: false }] }], onFilter: [{ type: i0.Output, args: ["onFilter"] }], onNodeExpand: [{ type: i0.Output, args: ["onNodeExpand"] }], onNodeCollapse: [{ type: i0.Output, args: ["onNodeCollapse"] }], onPage: [{ type: i0.Output, args: ["onPage"] }], onSort: [{ type: i0.Output, args: ["onSort"] }], onLazyLoad: [{ type: i0.Output, args: ["onLazyLoad"] }], sortFunction: [{ type: i0.Output, args: ["sortFunction"] }], onColResize: [{ type: i0.Output, args: ["onColResize"] }], onColReorder: [{ type: i0.Output, args: ["onColReorder"] }], onNodeSelect: [{ type: i0.Output, args: ["onNodeSelect"] }], onNodeUnselect: [{ type: i0.Output, args: ["onNodeUnselect"] }], onContextMenuSelect: [{ type: i0.Output, args: ["onContextMenuSelect"] }], onHeaderCheckboxToggle: [{ type: i0.Output, args: ["onHeaderCheckboxToggle"] }], onEditInit: [{ type: i0.Output, args: ["onEditInit"] }], onEditComplete: [{ type: i0.Output, args: ["onEditComplete"] }], onEditCancel: [{ type: i0.Output, args: ["onEditCancel"] }], resizeHelperViewChild: [{ type: i0.ViewChild, args: ['resizeHelper', { isSignal: true }] }], reorderIndicatorUpViewChild: [{ type: i0.ViewChild, args: ['reorderIndicatorUp', { isSignal: true }] }], reorderIndicatorDownViewChild: [{ type: i0.ViewChild, args: ['reorderIndicatorDown', { isSignal: true }] }], tableViewChild: [{ type: i0.ViewChild, args: ['table', { isSignal: true }] }], scrollableViewChild: [{ type: i0.ViewChild, args: ['scrollableView', { isSignal: true }] }], scrollableFrozenViewChild: [{ type: i0.ViewChild, args: ['scrollableFrozenView', { isSignal: true }] }], _colGroupTemplate: [{ type: i0.ContentChild, args: ['colgroup', { ...{ descendants: false }, isSignal: true }] }], _captionTemplateSignal: [{ type: i0.ContentChild, args: ['caption', { ...{ descendants: false }, isSignal: true }] }], _headerTemplate: [{ type: i0.ContentChild, args: ['header', { ...{ descendants: false }, isSignal: true }] }], _bodyTemplate: [{ type: i0.ContentChild, args: ['body', { ...{ descendants: false }, isSignal: true }] }], _footerTemplateSignal: [{ type: i0.ContentChild, args: ['footer', { ...{ descendants: false }, isSignal: true }] }], _summaryTemplateSignal: [{ type: i0.ContentChild, args: ['summary', { ...{ descendants: false }, isSignal: true }] }], _emptyMessageTemplate: [{ type: i0.ContentChild, args: ['emptymessage', { ...{ descendants: false }, isSignal: true }] }], _paginatorLeftTemplate: [{ type: i0.ContentChild, args: ['paginatorleft', { ...{ descendants: false }, isSignal: true }] }], _paginatorRightTemplate: [{ type: i0.ContentChild, args: ['paginatorright', { ...{ descendants: false }, isSignal: true }] }], _paginatorDropdownItemTemplate: [{ type: i0.ContentChild, args: ['paginatordropdownitem', { ...{ descendants: false }, isSignal: true }] }], _frozenHeaderTemplate: [{ type: i0.ContentChild, args: ['frozenheader', { ...{ descendants: false }, isSignal: true }] }], _frozenBodyTemplate: [{ type: i0.ContentChild, args: ['frozenbody', { ...{ descendants: false }, isSignal: true }] }], _frozenFooterTemplate: [{ type: i0.ContentChild, args: ['frozenfooter', { ...{ descendants: false }, isSignal: true }] }], _frozenColGroupTemplate: [{ type: i0.ContentChild, args: ['frozencolgroup', { ...{ descendants: false }, isSignal: true }] }], _loadingIconTemplateSignal: [{ type: i0.ContentChild, args: ['loadingicon', { ...{ descendants: false }, isSignal: true }] }], _reorderIndicatorUpIconTemplate: [{ type: i0.ContentChild, args: ['reorderindicatorupicon', { ...{ descendants: false }, isSignal: true }] }], _reorderIndicatorDownIconTemplate: [{ type: i0.ContentChild, args: ['reorderindicatordownicon', { ...{ descendants: false }, isSignal: true }] }], _sortIconTemplateSignal: [{ type: i0.ContentChild, args: ['sorticon', { ...{ descendants: false }, isSignal: true }] }], _checkboxIconTemplateSignal: [{ type: i0.ContentChild, args: ['checkboxicon', { ...{ descendants: false }, isSignal: true }] }], _headerCheckboxIconTemplateSignal: [{ type: i0.ContentChild, args: ['headercheckboxicon', { ...{ descendants: false }, isSignal: true }] }], _togglerIconTemplate: [{ type: i0.ContentChild, args: ['togglericon', { ...{ descendants: false }, isSignal: true }] }], _paginatorFirstPageLinkIconTemplateSignal: [{ type: i0.ContentChild, args: ['paginatorfirstpagelinkicon', { ...{ descendants: false }, isSignal: true }] }], _paginatorLastPageLinkIconTemplateSignal: [{ type: i0.ContentChild, args: ['paginatorlastpagelinkicon', { ...{ descendants: false }, isSignal: true }] }], _paginatorPreviousPageLinkIconTemplateSignal: [{ type: i0.ContentChild, args: ['paginatorpreviouspagelinkicon', { ...{ descendants: false }, isSignal: true }] }], _paginatorNextPageLinkIconTemplateSignal: [{ type: i0.ContentChild, args: ['paginatornextpagelinkicon', { ...{ descendants: false }, isSignal: true }] }], _loaderTemplateSignal: [{ type: i0.ContentChild, args: ['loader', { ...{ descendants: false }, isSignal: true }] }], templates: [{ type: i0.ContentChildren, args: [i0.forwardRef(() => HelixTemplate), { isSignal: true }] }] } });
+class TTBody extends BaseComponent {
+    tt;
+    treeTableService;
+    columns = input(undefined, { ...(ngDevMode ? { debugName: "columns" } : /* istanbul ignore next */ {}), alias: "hTreeTableBody" });
+    template = input(undefined, { ...(ngDevMode ? { debugName: "template" } : /* istanbul ignore next */ {}), alias: "pTreeTableBodyTemplate" });
+    frozen = input(undefined, { ...(ngDevMode ? { debugName: "frozen" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    serializedNodes = input(/* @ts-ignore */
+    ...(ngDevMode ? [undefined, { debugName: "serializedNodes" }] : /* istanbul ignore next */ []));
+    scrollerOptions = input(/* @ts-ignore */
+    ...(ngDevMode ? [undefined, { debugName: "scrollerOptions" }] : /* istanbul ignore next */ []));
+    subscription;
+    constructor(tt, treeTableService) {
+        super();
+        this.tt = tt;
+        this.treeTableService = treeTableService;
+        this.subscription = this.tt.tableService.uiUpdateSource$.subscribe(() => {
+            if (this.tt.virtualScroll()) {
+                this.cd.detectChanges();
+            }
+        });
+    }
+    getScrollerOption(option, options) {
+        if (this.tt.virtualScroll()) {
+            options = options || this.scrollerOptions();
+            return options ? options[option] : null;
+        }
+        return null;
+    }
+    getRowIndex(rowIndex) {
+        const getItemOptions = this.getScrollerOption('getItemOptions');
+        return getItemOptions ? getItemOptions(rowIndex).index : rowIndex;
+    }
+    onDestroy() {
+        if (this.subscription) {
+            this.subscription.unsubscribe();
+        }
+    }
+    get dataP() {
+        return this.cn({
+            hoverable: this.tt.rowHover() || this.tt.selectionMode(),
+            frozen: this.frozen()
+        });
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: TTBody, deps: [{ token: TreeTable }, { token: TreeTableService }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.6", type: TTBody, isStandalone: false, selector: "[hTreeTableBody]", inputs: { columns: { classPropertyName: "columns", publicName: "hTreeTableBody", isSignal: true, isRequired: false, transformFunction: null }, template: { classPropertyName: "template", publicName: "pTreeTableBodyTemplate", isSignal: true, isRequired: false, transformFunction: null }, frozen: { classPropertyName: "frozen", publicName: "frozen", isSignal: true, isRequired: false, transformFunction: null }, serializedNodes: { classPropertyName: "serializedNodes", publicName: "serializedNodes", isSignal: true, isRequired: false, transformFunction: null }, scrollerOptions: { classPropertyName: "scrollerOptions", publicName: "scrollerOptions", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "attr.data-h": "dataP" } }, usesInheritance: true, ngImport: i0, template: "@for (serializedNode of serializedNodes() || tt.serializedValue; track tt.rowTrackBy()(rowIndex, serializedNode); let rowIndex = $index) {\n  @if (serializedNode.visible) {\n    <ng-container\n            *ngTemplateOutlet=\"\n                template();\n                context: {\n                    $implicit: serializedNode,\n                    node: serializedNode.node,\n                    rowData: serializedNode.node.data,\n                    columns: columns()\n                }\n            \"\n  ></ng-container>\n}\n}\n@if (tt.isEmpty()) {\n  <ng-container *ngTemplateOutlet=\"tt.emptyMessageTemplate || tt._emptyMessageTemplate(); context: { $implicit: columns(), frozen: frozen() }\"></ng-container>\n}\n", dependencies: [{ kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.Eager, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: TTBody, decorators: [{
+            type: Component,
+            args: [{ selector: '[hTreeTableBody]', standalone: false, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.Eager, host: {
+                        '[attr.data-h]': 'dataP'
+                    }, template: "@for (serializedNode of serializedNodes() || tt.serializedValue; track tt.rowTrackBy()(rowIndex, serializedNode); let rowIndex = $index) {\n  @if (serializedNode.visible) {\n    <ng-container\n            *ngTemplateOutlet=\"\n                template();\n                context: {\n                    $implicit: serializedNode,\n                    node: serializedNode.node,\n                    rowData: serializedNode.node.data,\n                    columns: columns()\n                }\n            \"\n  ></ng-container>\n}\n}\n@if (tt.isEmpty()) {\n  <ng-container *ngTemplateOutlet=\"tt.emptyMessageTemplate || tt._emptyMessageTemplate(); context: { $implicit: columns(), frozen: frozen() }\"></ng-container>\n}\n" }]
+        }], ctorParameters: () => [{ type: TreeTable }, { type: TreeTableService }], propDecorators: { columns: [{ type: i0.Input, args: [{ isSignal: true, alias: "hTreeTableBody", required: false }] }], template: [{ type: i0.Input, args: [{ isSignal: true, alias: "pTreeTableBodyTemplate", required: false }] }], frozen: [{ type: i0.Input, args: [{ isSignal: true, alias: "frozen", required: false }] }], serializedNodes: [{ type: i0.Input, args: [{ isSignal: true, alias: "serializedNodes", required: false }] }], scrollerOptions: [{ type: i0.Input, args: [{ isSignal: true, alias: "scrollerOptions", required: false }] }] } });
+class TTScrollableView extends BaseComponent {
+    tt;
+    zone;
+    hostName = 'TreeTable';
+    columns = input(undefined, { ...(ngDevMode ? { debugName: "columns" } : /* istanbul ignore next */ {}), alias: "ttScrollableView" });
+    frozen = input(undefined, { ...(ngDevMode ? { debugName: "frozen" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    scrollHeaderViewChild = viewChild('scrollHeader', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "scrollHeaderViewChild" }] : /* istanbul ignore next */ []));
+    scrollHeaderBoxViewChild = viewChild('scrollHeaderBox', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "scrollHeaderBoxViewChild" }] : /* istanbul ignore next */ []));
+    scrollBodyViewChild = viewChild('scrollBody', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "scrollBodyViewChild" }] : /* istanbul ignore next */ []));
+    scrollTableViewChild = viewChild('scrollTable', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "scrollTableViewChild" }] : /* istanbul ignore next */ []));
+    scrollLoadingTableViewChild = viewChild('loadingTable', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "scrollLoadingTableViewChild" }] : /* istanbul ignore next */ []));
+    scrollFooterViewChild = viewChild('scrollFooter', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "scrollFooterViewChild" }] : /* istanbul ignore next */ []));
+    scrollFooterBoxViewChild = viewChild('scrollFooterBox', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "scrollFooterBoxViewChild" }] : /* istanbul ignore next */ []));
+    scrollableAlignerViewChild = viewChild('scrollableAligner', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "scrollableAlignerViewChild" }] : /* istanbul ignore next */ []));
+    scroller = viewChild('scroller', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "scroller" }] : /* istanbul ignore next */ []));
+    headerScrollListener;
+    bodyScrollListener;
+    footerScrollListener;
+    frozenSiblingBody;
+    totalRecordsSubscription;
+    scrollHeight = input(/* @ts-ignore */
+    ...(ngDevMode ? [undefined, { debugName: "scrollHeight" }] : /* istanbul ignore next */ []));
+    preventBodyScrollPropagation;
+    _componentStyle = inject(TreeTableStyle);
+    // The `scrollHeight` setter used to log a deprecation console.log when a percentage/calc value
+    // was provided; `scrollHeight` is now a plain input(), so the warning is reproduced as an effect
+    // (rule 3).
+    _scrollHeightEffect = effect(() => {
+        const val = this.scrollHeight();
+        if (val != null && (val.includes('%') || val.includes('calc'))) {
+            console.log('Percentage scroll height calculation is removed in favor of the more performant CSS based flex mode, use scrollHeight="flex" instead.');
+        }
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "_scrollHeightEffect" }] : /* istanbul ignore next */ []));
+    constructor(tt, zone) {
+        super();
+        this.tt = tt;
+        this.zone = zone;
+    }
+    onAfterViewInit() {
+        if (isPlatformBrowser(this.platformId)) {
+            if (!this.frozen()) {
+                if (this.tt.frozenColumns() || this.tt.frozenBodyTemplate || this.tt._frozenBodyTemplate()) {
+                    addClass(this.el.nativeElement, 'h-treetable-unfrozen-view');
+                }
+                let frozenView = this.el.nativeElement.previousElementSibling;
+                if (frozenView) {
+                    if (this.tt.virtualScroll())
+                        this.frozenSiblingBody = findSingle(frozenView, '[data-pc-name="virtualscroller"]');
+                    else
+                        this.frozenSiblingBody = findSingle(frozenView, '[data-pc-section="scrollablebody"]');
+                }
+                if (this.scrollHeight()) {
+                    let scrollBarWidth = calculateScrollbarWidth();
+                    const scrollHeaderBoxViewChild = this.scrollHeaderBoxViewChild();
+                    if (scrollHeaderBoxViewChild?.nativeElement) {
+                        scrollHeaderBoxViewChild.nativeElement.style.paddingRight = scrollBarWidth + 'px';
+                    }
+                    const scrollFooterBoxViewChild = this.scrollFooterBoxViewChild();
+                    if (scrollFooterBoxViewChild && scrollFooterBoxViewChild.nativeElement) {
+                        scrollFooterBoxViewChild.nativeElement.style.paddingRight = scrollBarWidth + 'px';
+                    }
+                }
+            }
+            else {
+                const scrollableAlignerViewChild = this.scrollableAlignerViewChild();
+                if (scrollableAlignerViewChild && scrollableAlignerViewChild.nativeElement) {
+                    scrollableAlignerViewChild.nativeElement.style.height = calculateScrollbarHeight() + 'px';
+                }
+            }
+            this.bindEvents();
+        }
+    }
+    bindEvents() {
+        if (isPlatformBrowser(this.platformId)) {
+            this.zone.runOutsideAngular(() => {
+                const scrollHeaderViewChild = this.scrollHeaderViewChild();
+                if (scrollHeaderViewChild && scrollHeaderViewChild.nativeElement) {
+                    this.headerScrollListener = this.renderer.listen(this.scrollHeaderBoxViewChild()?.nativeElement, 'scroll', this.onHeaderScroll.bind(this));
+                }
+                const scrollFooterViewChild = this.scrollFooterViewChild();
+                if (scrollFooterViewChild && scrollFooterViewChild.nativeElement) {
+                    this.footerScrollListener = this.renderer.listen(scrollFooterViewChild.nativeElement, 'scroll', this.onFooterScroll.bind(this));
+                }
+                if (!this.frozen()) {
+                    if (this.tt.virtualScroll()) {
+                        this.bodyScrollListener = this.renderer.listen((this.scroller()?.getElementRef()).nativeElement, 'scroll', this.onBodyScroll.bind(this));
+                    }
+                    else {
+                        this.bodyScrollListener = this.renderer.listen(this.scrollBodyViewChild()?.nativeElement, 'scroll', this.onBodyScroll.bind(this));
+                    }
+                }
+            });
+        }
+    }
+    unbindEvents() {
+        if (isPlatformBrowser(this.platformId)) {
+            const scrollHeaderViewChild = this.scrollHeaderViewChild();
+            if (scrollHeaderViewChild && scrollHeaderViewChild.nativeElement) {
+                if (this.headerScrollListener) {
+                    this.headerScrollListener();
+                    this.headerScrollListener = null;
+                }
+            }
+            const scrollFooterViewChild = this.scrollFooterViewChild();
+            if (scrollFooterViewChild && scrollFooterViewChild.nativeElement) {
+                if (this.footerScrollListener) {
+                    this.footerScrollListener();
+                    this.footerScrollListener = null;
+                }
+            }
+            const scrollBodyViewChild = this.scrollBodyViewChild();
+            if (scrollBodyViewChild && scrollBodyViewChild.nativeElement) {
+                if (this.bodyScrollListener) {
+                    this.bodyScrollListener();
+                    this.bodyScrollListener = null;
+                }
+            }
+            const scroller = this.scroller();
+            if (scroller && scroller.getElementRef()) {
+                if (this.bodyScrollListener) {
+                    this.bodyScrollListener();
+                    this.bodyScrollListener = null;
+                }
+            }
+        }
+    }
+    onHeaderScroll() {
+        const scrollLeft = this.scrollHeaderViewChild()?.nativeElement.scrollLeft;
+        this.scrollBodyViewChild().nativeElement.scrollLeft = scrollLeft;
+        const scrollFooterViewChild = this.scrollFooterViewChild();
+        if (scrollFooterViewChild && scrollFooterViewChild.nativeElement) {
+            scrollFooterViewChild.nativeElement.scrollLeft = scrollLeft;
+        }
+        this.preventBodyScrollPropagation = true;
+    }
+    onFooterScroll() {
+        const scrollLeft = this.scrollFooterViewChild()?.nativeElement.scrollLeft;
+        this.scrollBodyViewChild().nativeElement.scrollLeft = scrollLeft;
+        const scrollHeaderViewChild = this.scrollHeaderViewChild();
+        if (scrollHeaderViewChild && scrollHeaderViewChild.nativeElement) {
+            scrollHeaderViewChild.nativeElement.scrollLeft = scrollLeft;
+        }
+        this.preventBodyScrollPropagation = true;
+    }
+    onBodyScroll(event) {
+        if (this.preventBodyScrollPropagation) {
+            this.preventBodyScrollPropagation = false;
+            return;
+        }
+        const scrollHeaderViewChild = this.scrollHeaderViewChild();
+        if (scrollHeaderViewChild && scrollHeaderViewChild.nativeElement) {
+            this.scrollHeaderBoxViewChild().nativeElement.style.marginLeft = -1 * event.target.scrollLeft + 'px';
+        }
+        const scrollFooterViewChild = this.scrollFooterViewChild();
+        if (scrollFooterViewChild && scrollFooterViewChild.nativeElement) {
+            this.scrollFooterBoxViewChild().nativeElement.style.marginLeft = -1 * event.target.scrollLeft + 'px';
+        }
+        if (this.frozenSiblingBody) {
+            this.frozenSiblingBody.scrollTop = event.target.scrollTop;
+        }
+    }
+    scrollToVirtualIndex(index) {
+        const scroller = this.scroller();
+        if (scroller) {
+            scroller.scrollToIndex(index);
+        }
+    }
+    scrollTo(options) {
+        const scroller = this.scroller();
+        if (scroller) {
+            scroller.scrollTo(options);
+        }
+        else {
+            const scrollBodyViewChild = this.scrollBodyViewChild();
+            if (scrollBodyViewChild?.nativeElement.scrollTo) {
+                scrollBodyViewChild.nativeElement.scrollTo(options);
+            }
+            else {
+                scrollBodyViewChild.nativeElement.scrollLeft = options.left;
+                scrollBodyViewChild.nativeElement.scrollTop = options.top;
+            }
+        }
+    }
+    onDestroy() {
+        this.unbindEvents();
+        this.frozenSiblingBody = null;
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: TTScrollableView, deps: [{ token: TreeTable }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.6", type: TTScrollableView, isStandalone: false, selector: "[ttScrollableView]", inputs: { columns: { classPropertyName: "columns", publicName: "ttScrollableView", isSignal: true, isRequired: false, transformFunction: null }, frozen: { classPropertyName: "frozen", publicName: "frozen", isSignal: true, isRequired: false, transformFunction: null }, scrollHeight: { classPropertyName: "scrollHeight", publicName: "scrollHeight", isSignal: true, isRequired: false, transformFunction: null } }, providers: [TreeTableStyle], viewQueries: [{ propertyName: "scrollHeaderViewChild", first: true, predicate: ["scrollHeader"], descendants: true, isSignal: true }, { propertyName: "scrollHeaderBoxViewChild", first: true, predicate: ["scrollHeaderBox"], descendants: true, isSignal: true }, { propertyName: "scrollBodyViewChild", first: true, predicate: ["scrollBody"], descendants: true, isSignal: true }, { propertyName: "scrollTableViewChild", first: true, predicate: ["scrollTable"], descendants: true, isSignal: true }, { propertyName: "scrollLoadingTableViewChild", first: true, predicate: ["loadingTable"], descendants: true, isSignal: true }, { propertyName: "scrollFooterViewChild", first: true, predicate: ["scrollFooter"], descendants: true, isSignal: true }, { propertyName: "scrollFooterBoxViewChild", first: true, predicate: ["scrollFooterBox"], descendants: true, isSignal: true }, { propertyName: "scrollableAlignerViewChild", first: true, predicate: ["scrollableAligner"], descendants: true, isSignal: true }, { propertyName: "scroller", first: true, predicate: ["scroller"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<div #scrollHeader [class]=\"cx('scrollableHeader')\" [hBind]=\"ptm('scrollableHeader')\">\n  <div #scrollHeaderBox [class]=\"cx('scrollableHeaderBox')\" [hBind]=\"ptm('scrollableHeaderBox')\">\n    <table [class]=\"cn(cx('scrollableHeaderTable'), tt.tableStyleClass())\" [hBind]=\"ptm('scrollableHeaderTable')\" [ngStyle]=\"tt.tableStyle()\">\n      <ng-container\n        *ngTemplateOutlet=\"frozen() ? tt.frozenColGroupTemplate || tt._frozenColGroupTemplate() || tt.colGroupTemplate || tt._colGroupTemplate() : tt.colGroupTemplate || tt._colGroupTemplate(); context: { $implicit: columns() }\"\n      ></ng-container>\n      <thead role=\"rowgroup\" [class]=\"cx('thead')\" [hBind]=\"ptm('thead')\">\n        <ng-container\n          *ngTemplateOutlet=\"frozen() ? tt.frozenHeaderTemplate || tt._frozenHeaderTemplate() || tt.headerTemplate || tt._headerTemplate() : tt.headerTemplate || tt._headerTemplate(); context: { $implicit: columns() }\"\n        ></ng-container>\n      </thead>\n    </table>\n  </div>\n</div>\n\n@if (tt.virtualScroll()) {\n  <h-scroller\n    #scroller\n    [items]=\"tt.serializedValue\"\n    [styleClass]=\"cx('scrollableBody')\"\n    [style]=\"{ height: tt.scrollHeight() !== 'flex' ? tt.scrollHeight() : undefined }\"\n    [scrollHeight]=\"scrollHeight() !== 'flex' ? undefined : '100%'\"\n    [itemSize]=\"tt.virtualScrollItemSize() || tt.virtualRowHeight()\"\n    [lazy]=\"tt.lazy()\"\n    (onLazyLoad)=\"tt.onLazyItemLoad($event)\"\n    [options]=\"tt.virtualScrollOptions()\"\n    [pt]=\"ptm('virtualScroller')\"\n    >\n    <ng-template #content let-items let-scrollerOptions=\"options\">\n      <ng-container *ngTemplateOutlet=\"buildInItems; context: { $implicit: items, options: scrollerOptions }\"></ng-container>\n    </ng-template>\n    @if (tt.loaderTemplate || tt._loaderTemplate) {\n      <ng-template #loader let-scrollerOptions=\"options\">\n        <ng-container *ngTemplateOutlet=\"tt.loaderTemplate || tt._loaderTemplate; context: { options: scrollerOptions }\"></ng-container>\n      </ng-template>\n    }\n  </h-scroller>\n}\n@if (!tt.virtualScroll()) {\n  <div\n    #scrollBody\n    [class]=\"cx('scrollableBody')\"\n    [hBind]=\"ptm('scrollableBody')\"\n        [ngStyle]=\"{\n            'max-height': tt.scrollHeight() !== 'flex' ? scrollHeight() : undefined,\n            'overflow-y': !frozen() && tt.scrollHeight() ? 'scroll' : undefined\n        }\"\n    >\n    <ng-container *ngTemplateOutlet=\"buildInItems; context: { $implicit: serializedValue, options: {} }\"></ng-container>\n  </div>\n}\n\n<ng-template #buildInItems let-items let-scrollerOptions=\"options\">\n  <table role=\"treegrid\" #scrollTable [hBind]=\"ptm('table')\" [class]=\"tt.tableStyleClass()\" [ngClass]=\"scrollerOptions.contentStyleClass\" [ngStyle]=\"tt.tableStyle()\" [style]=\"scrollerOptions.contentStyle\">\n    <ng-container\n      *ngTemplateOutlet=\"frozen() ? tt.frozenColGroupTemplate || tt._frozenColGroupTemplate() || tt.colGroupTemplate || tt._colGroupTemplate() : tt.colGroupTemplate || tt._colGroupTemplate(); context: { $implicit: columns() }\"\n    ></ng-container>\n    <tbody\n      [hBind]=\"ptm('tbody')\"\n      role=\"rowgroup\"\n      [class]=\"cx('tbody')\"\n      [hBind]=\"ptm('tbody')\"\n      [hTreeTableBody]=\"columns()\"\n      [unstyled]=\"unstyled()\"\n      [pTreeTableBodyTemplate]=\"frozen() ? tt.frozenBodyTemplate || tt._frozenBodyTemplate() || tt.bodyTemplate || tt._bodyTemplate() : tt.bodyTemplate || tt._bodyTemplate()\"\n      [serializedNodes]=\"items\"\n      [frozen]=\"frozen()\"\n    ></tbody>\n  </table>\n  @if (frozen()) {\n    <div #scrollableAligner [style.background-color]=\"'transparent'\"></div>\n  }\n</ng-template>\n\n@if (tt.footerTemplate || tt._footerTemplate) {\n  <div #scrollFooter [class]=\"cx('scrollableFooter')\" [hBind]=\"ptm('scrollableFooter')\">\n    <div #scrollFooterBox [class]=\"cx('scrollableFooterBox')\" [hBind]=\"ptm('scrollableFooterBox')\">\n      <table [class]=\"cx('scrollableFooterTable')\" [ngClass]=\"tt.tableStyleClass()\" [ngStyle]=\"tt.tableStyle()\" [hBind]=\"ptm('scrollableFooterTable')\">\n        <ng-container\n          *ngTemplateOutlet=\"frozen() ? tt.frozenColGroupTemplate || tt._frozenColGroupTemplate() || tt.colGroupTemplate || tt._colGroupTemplate() : tt.colGroupTemplate || tt._colGroupTemplate(); context: { $implicit: columns() }\"\n        ></ng-container>\n        <tfoot role=\"rowgroup\" [class]=\"cx('tfoot')\" [hBind]=\"ptm('tfoot')\">\n          <ng-container\n            *ngTemplateOutlet=\"frozen() ? tt.frozenFooterTemplate || tt._frozenFooterTemplate() || tt.footerTemplate || tt._footerTemplate : tt.footerTemplate || tt._footerTemplate; context: { $implicit: columns() }\"\n          ></ng-container>\n        </tfoot>\n      </table>\n    </div>\n  </div>\n}\n", dependencies: [{ kind: "directive", type: i0.forwardRef(() => i2.NgClass), selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i0.forwardRef(() => i2.NgTemplateOutlet), selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i0.forwardRef(() => i2.NgStyle), selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: i0.forwardRef(() => Scroller), selector: "h-scroller, h-virtualscroller, h-virtual-scroller, h-virtualScroller", inputs: ["hostName", "id", "style", "styleClass", "tabindex", "items", "itemSize", "scrollHeight", "scrollWidth", "orientation", "step", "delay", "resizeDelay", "appendOnly", "inline", "lazy", "disabled", "loaderDisabled", "columns", "showSpacer", "showLoader", "numToleratedItems", "loading", "autoSize", "trackBy", "options"], outputs: ["onLazyLoad", "onScroll", "onScrollIndexChange"] }, { kind: "directive", type: i0.forwardRef(() => i1.Bind), selector: "[hBind]", inputs: ["hBind"] }, { kind: "component", type: i0.forwardRef(() => TTBody), selector: "[hTreeTableBody]", inputs: ["hTreeTableBody", "pTreeTableBodyTemplate", "frozen", "serializedNodes", "scrollerOptions"] }], changeDetection: i0.ChangeDetectionStrategy.Eager, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: TTScrollableView, decorators: [{
+            type: Component,
+            args: [{ selector: '[ttScrollableView]', standalone: false, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.Eager, providers: [TreeTableStyle], template: "<div #scrollHeader [class]=\"cx('scrollableHeader')\" [hBind]=\"ptm('scrollableHeader')\">\n  <div #scrollHeaderBox [class]=\"cx('scrollableHeaderBox')\" [hBind]=\"ptm('scrollableHeaderBox')\">\n    <table [class]=\"cn(cx('scrollableHeaderTable'), tt.tableStyleClass())\" [hBind]=\"ptm('scrollableHeaderTable')\" [ngStyle]=\"tt.tableStyle()\">\n      <ng-container\n        *ngTemplateOutlet=\"frozen() ? tt.frozenColGroupTemplate || tt._frozenColGroupTemplate() || tt.colGroupTemplate || tt._colGroupTemplate() : tt.colGroupTemplate || tt._colGroupTemplate(); context: { $implicit: columns() }\"\n      ></ng-container>\n      <thead role=\"rowgroup\" [class]=\"cx('thead')\" [hBind]=\"ptm('thead')\">\n        <ng-container\n          *ngTemplateOutlet=\"frozen() ? tt.frozenHeaderTemplate || tt._frozenHeaderTemplate() || tt.headerTemplate || tt._headerTemplate() : tt.headerTemplate || tt._headerTemplate(); context: { $implicit: columns() }\"\n        ></ng-container>\n      </thead>\n    </table>\n  </div>\n</div>\n\n@if (tt.virtualScroll()) {\n  <h-scroller\n    #scroller\n    [items]=\"tt.serializedValue\"\n    [styleClass]=\"cx('scrollableBody')\"\n    [style]=\"{ height: tt.scrollHeight() !== 'flex' ? tt.scrollHeight() : undefined }\"\n    [scrollHeight]=\"scrollHeight() !== 'flex' ? undefined : '100%'\"\n    [itemSize]=\"tt.virtualScrollItemSize() || tt.virtualRowHeight()\"\n    [lazy]=\"tt.lazy()\"\n    (onLazyLoad)=\"tt.onLazyItemLoad($event)\"\n    [options]=\"tt.virtualScrollOptions()\"\n    [pt]=\"ptm('virtualScroller')\"\n    >\n    <ng-template #content let-items let-scrollerOptions=\"options\">\n      <ng-container *ngTemplateOutlet=\"buildInItems; context: { $implicit: items, options: scrollerOptions }\"></ng-container>\n    </ng-template>\n    @if (tt.loaderTemplate || tt._loaderTemplate) {\n      <ng-template #loader let-scrollerOptions=\"options\">\n        <ng-container *ngTemplateOutlet=\"tt.loaderTemplate || tt._loaderTemplate; context: { options: scrollerOptions }\"></ng-container>\n      </ng-template>\n    }\n  </h-scroller>\n}\n@if (!tt.virtualScroll()) {\n  <div\n    #scrollBody\n    [class]=\"cx('scrollableBody')\"\n    [hBind]=\"ptm('scrollableBody')\"\n        [ngStyle]=\"{\n            'max-height': tt.scrollHeight() !== 'flex' ? scrollHeight() : undefined,\n            'overflow-y': !frozen() && tt.scrollHeight() ? 'scroll' : undefined\n        }\"\n    >\n    <ng-container *ngTemplateOutlet=\"buildInItems; context: { $implicit: serializedValue, options: {} }\"></ng-container>\n  </div>\n}\n\n<ng-template #buildInItems let-items let-scrollerOptions=\"options\">\n  <table role=\"treegrid\" #scrollTable [hBind]=\"ptm('table')\" [class]=\"tt.tableStyleClass()\" [ngClass]=\"scrollerOptions.contentStyleClass\" [ngStyle]=\"tt.tableStyle()\" [style]=\"scrollerOptions.contentStyle\">\n    <ng-container\n      *ngTemplateOutlet=\"frozen() ? tt.frozenColGroupTemplate || tt._frozenColGroupTemplate() || tt.colGroupTemplate || tt._colGroupTemplate() : tt.colGroupTemplate || tt._colGroupTemplate(); context: { $implicit: columns() }\"\n    ></ng-container>\n    <tbody\n      [hBind]=\"ptm('tbody')\"\n      role=\"rowgroup\"\n      [class]=\"cx('tbody')\"\n      [hBind]=\"ptm('tbody')\"\n      [hTreeTableBody]=\"columns()\"\n      [unstyled]=\"unstyled()\"\n      [pTreeTableBodyTemplate]=\"frozen() ? tt.frozenBodyTemplate || tt._frozenBodyTemplate() || tt.bodyTemplate || tt._bodyTemplate() : tt.bodyTemplate || tt._bodyTemplate()\"\n      [serializedNodes]=\"items\"\n      [frozen]=\"frozen()\"\n    ></tbody>\n  </table>\n  @if (frozen()) {\n    <div #scrollableAligner [style.background-color]=\"'transparent'\"></div>\n  }\n</ng-template>\n\n@if (tt.footerTemplate || tt._footerTemplate) {\n  <div #scrollFooter [class]=\"cx('scrollableFooter')\" [hBind]=\"ptm('scrollableFooter')\">\n    <div #scrollFooterBox [class]=\"cx('scrollableFooterBox')\" [hBind]=\"ptm('scrollableFooterBox')\">\n      <table [class]=\"cx('scrollableFooterTable')\" [ngClass]=\"tt.tableStyleClass()\" [ngStyle]=\"tt.tableStyle()\" [hBind]=\"ptm('scrollableFooterTable')\">\n        <ng-container\n          *ngTemplateOutlet=\"frozen() ? tt.frozenColGroupTemplate || tt._frozenColGroupTemplate() || tt.colGroupTemplate || tt._colGroupTemplate() : tt.colGroupTemplate || tt._colGroupTemplate(); context: { $implicit: columns() }\"\n        ></ng-container>\n        <tfoot role=\"rowgroup\" [class]=\"cx('tfoot')\" [hBind]=\"ptm('tfoot')\">\n          <ng-container\n            *ngTemplateOutlet=\"frozen() ? tt.frozenFooterTemplate || tt._frozenFooterTemplate() || tt.footerTemplate || tt._footerTemplate : tt.footerTemplate || tt._footerTemplate; context: { $implicit: columns() }\"\n          ></ng-container>\n        </tfoot>\n      </table>\n    </div>\n  </div>\n}\n" }]
+        }], ctorParameters: () => [{ type: TreeTable }, { type: i0.NgZone }], propDecorators: { columns: [{ type: i0.Input, args: [{ isSignal: true, alias: "ttScrollableView", required: false }] }], frozen: [{ type: i0.Input, args: [{ isSignal: true, alias: "frozen", required: false }] }], scrollHeaderViewChild: [{ type: i0.ViewChild, args: ['scrollHeader', { isSignal: true }] }], scrollHeaderBoxViewChild: [{ type: i0.ViewChild, args: ['scrollHeaderBox', { isSignal: true }] }], scrollBodyViewChild: [{ type: i0.ViewChild, args: ['scrollBody', { isSignal: true }] }], scrollTableViewChild: [{ type: i0.ViewChild, args: ['scrollTable', { isSignal: true }] }], scrollLoadingTableViewChild: [{ type: i0.ViewChild, args: ['loadingTable', { isSignal: true }] }], scrollFooterViewChild: [{ type: i0.ViewChild, args: ['scrollFooter', { isSignal: true }] }], scrollFooterBoxViewChild: [{ type: i0.ViewChild, args: ['scrollFooterBox', { isSignal: true }] }], scrollableAlignerViewChild: [{ type: i0.ViewChild, args: ['scrollableAligner', { isSignal: true }] }], scroller: [{ type: i0.ViewChild, args: ['scroller', { isSignal: true }] }], scrollHeight: [{ type: i0.Input, args: [{ isSignal: true, alias: "scrollHeight", required: false }] }] } });
+class TTSortableColumn extends BaseComponent {
+    tt;
+    hostName = 'TreeTable ';
+    bindDirectiveInstance = inject(Bind, { self: true });
+    onAfterViewChecked() {
+        this.bindDirectiveInstance.setAttrs(this.ptm('sortableColumn', { context: { sorted: this.sorted } }));
+    }
+    field = input(undefined, { ...(ngDevMode ? { debugName: "field" } : /* istanbul ignore next */ {}), alias: "ttSortableColumn" });
+    ttSortableColumnDisabled = input(undefined, { ...(ngDevMode ? { debugName: "ttSortableColumnDisabled" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    sorted;
+    subscription;
+    _componentStyle = inject(TreeTableStyle);
+    get ariaSorted() {
+        if (this.sorted && this.tt.sortOrder() < 0)
+            return 'descending';
+        else if (this.sorted && this.tt.sortOrder() > 0)
+            return 'ascending';
+        else
+            return 'none';
+    }
+    constructor(tt) {
+        super();
+        this.tt = tt;
+        if (this.isEnabled()) {
+            this.subscription = this.tt.tableService.sortSource$.subscribe((sortMeta) => {
+                this.updateSortState();
+            });
+        }
+    }
+    onInit() {
+        if (this.isEnabled()) {
+            this.updateSortState();
+        }
+    }
+    updateSortState() {
+        this.sorted = this.tt.isSorted(this.field());
+    }
+    onClick(event) {
+        if (this.isEnabled()) {
+            this.updateSortState();
+            this.tt.sort({
+                originalEvent: event,
+                field: this.field()
+            });
+            clearSelection();
+        }
+    }
+    onEnterKey(event) {
+        this.onClick(event);
+    }
+    isEnabled() {
+        return this.ttSortableColumnDisabled() !== true;
+    }
+    onDestroy() {
+        if (this.subscription) {
+            this.subscription.unsubscribe();
+        }
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: TTSortableColumn, deps: [{ token: TreeTable }], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.1.6", type: TTSortableColumn, isStandalone: false, selector: "[ttSortableColumn]", inputs: { field: { classPropertyName: "field", publicName: "ttSortableColumn", isSignal: true, isRequired: false, transformFunction: null }, ttSortableColumnDisabled: { classPropertyName: "ttSortableColumnDisabled", publicName: "ttSortableColumnDisabled", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "role": "columnheader" }, listeners: { "click": "onClick($event)", "keydown.enter": "onEnterKey($event)" }, properties: { "class": "cx(\"sortableColumn\")", "tabindex": "isEnabled() ? \"0\" : null", "attr.aria-sort": "ariaSorted" } }, providers: [TreeTableStyle], usesInheritance: true, hostDirectives: [{ directive: i1.Bind }], ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: TTSortableColumn, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[ttSortableColumn]',
+                    standalone: false,
+                    host: {
+                        '[class]': 'cx("sortableColumn")',
+                        '[tabindex]': 'isEnabled() ? "0" : null',
+                        role: 'columnheader',
+                        '[attr.aria-sort]': 'ariaSorted',
+                        '(click)': 'onClick($event)',
+                        '(keydown.enter)': 'onEnterKey($event)'
+                    },
+                    providers: [TreeTableStyle],
+                    hostDirectives: [Bind]
+                }]
+        }], ctorParameters: () => [{ type: TreeTable }], propDecorators: { field: [{ type: i0.Input, args: [{ isSignal: true, alias: "ttSortableColumn", required: false }] }], ttSortableColumnDisabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "ttSortableColumnDisabled", required: false }] }] } });
+class TTSortIcon extends BaseComponent {
+    tt;
+    cd;
+    hostName = 'TreeTable';
+    field = input(/* @ts-ignore */
+    ...(ngDevMode ? [undefined, { debugName: "field" }] : /* istanbul ignore next */ []));
+    ariaLabelDesc = input(/* @ts-ignore */
+    ...(ngDevMode ? [undefined, { debugName: "ariaLabelDesc" }] : /* istanbul ignore next */ []));
+    ariaLabelAsc = input(/* @ts-ignore */
+    ...(ngDevMode ? [undefined, { debugName: "ariaLabelAsc" }] : /* istanbul ignore next */ []));
+    subscription;
+    sortOrder;
+    _componentStyle = inject(TreeTableStyle);
+    constructor(tt, cd) {
+        super();
+        this.tt = tt;
+        this.cd = cd;
+        this.subscription = this.tt.tableService.sortSource$.subscribe((sortMeta) => {
+            this.updateSortState();
+            this.cd.markForCheck();
+        });
+    }
+    onInit() {
+        this.updateSortState();
+    }
+    onClick(event) {
+        event.preventDefault();
+    }
+    getMultiSortMetaIndex() {
+        let multiSortMeta = this.tt.multiSortMeta();
+        let index = -1;
+        if (multiSortMeta && this.tt.sortMode() === 'multiple' && multiSortMeta.length > 1) {
+            for (let i = 0; i < multiSortMeta.length; i++) {
+                let meta = multiSortMeta[i];
+                const field = this.field();
+                if (meta.field === field || meta.field === field) {
+                    index = i;
+                    break;
+                }
+            }
+        }
+        return index;
+    }
+    updateSortState() {
+        const sortMode = this.tt.sortMode();
+        if (sortMode === 'single') {
+            this.sortOrder = this.tt.isSorted(this.field()) ? this.tt.sortOrder() : 0;
+        }
+        else if (sortMode === 'multiple') {
+            let sortMeta = this.tt.getSortMeta(this.field());
+            this.sortOrder = sortMeta ? sortMeta.order : 0;
+        }
+    }
+    getBadgeValue() {
+        return this.getMultiSortMetaIndex() + 1;
+    }
+    isMultiSorted() {
+        return this.tt.sortMode() === 'multiple' && this.getMultiSortMetaIndex() > -1;
+    }
+    onDestroy() {
+        if (this.subscription) {
+            this.subscription.unsubscribe();
+        }
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: TTSortIcon, deps: [{ token: TreeTable }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.6", type: TTSortIcon, isStandalone: false, selector: "h-treeTableSortIcon, h-treetable-sort-icon, h-tree-table-sort-icon", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: false, transformFunction: null }, ariaLabelDesc: { classPropertyName: "ariaLabelDesc", publicName: "ariaLabelDesc", isSignal: true, isRequired: false, transformFunction: null }, ariaLabelAsc: { classPropertyName: "ariaLabelAsc", publicName: "ariaLabelAsc", isSignal: true, isRequired: false, transformFunction: null } }, providers: [TreeTableStyle], usesInheritance: true, ngImport: i0, template: "@if (!tt.sortIconTemplate && !tt._sortIconTemplate) {\n  @if (sortOrder === 0) {\n    <svg data-h-icon=\"sort-alt\" [class]=\"cx('sortableColumnIcon')\" [hBind]=\"ptm('sortableColumnIcon')\" />\n  }\n  @if (sortOrder === 1) {\n    <svg data-h-icon=\"sort-amount-up-alt\" [class]=\"cx('sortableColumnIcon')\" [hBind]=\"ptm('sortableColumnIcon')\" />\n  }\n  @if (sortOrder === -1) {\n    <svg data-h-icon=\"sort-amount-down\" [class]=\"cx('sortableColumnIcon')\" [hBind]=\"ptm('sortableColumnIcon')\" />\n  }\n}\n@if (tt.sortIconTemplate || tt._sortIconTemplate) {\n  <span [class]=\"cx('sortableColumnIcon')\" [hBind]=\"ptm('sortableColumnIcon')\">\n    <ng-template *ngTemplateOutlet=\"tt.sortIconTemplate || tt._sortIconTemplate; context: { $implicit: sortOrder }\"></ng-template>\n  </span>\n}\n@if (isMultiSorted()) {\n  <h-badge [class]=\"cx('sortableColumnBadge')\" [value]=\"getBadgeValue()\" size=\"small\" [pt]=\"ptm('pcSortableColumnBadge')\" [unstyled]=\"unstyled()\"></h-badge>\n}\n", dependencies: [{ kind: "directive", type: i0.forwardRef(() => i2.NgTemplateOutlet), selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i0.forwardRef(() => SortAltIcon), selector: "[data-h-icon=\"sort-alt\"]" }, { kind: "component", type: i0.forwardRef(() => SortAmountUpAltIcon), selector: "[data-h-icon=\"sort-amount-up-alt\"]" }, { kind: "component", type: i0.forwardRef(() => SortAmountDownIcon), selector: "[data-h-icon=\"sort-amount-down\"]" }, { kind: "component", type: i0.forwardRef(() => i5.Badge), selector: "h-badge", inputs: ["styleClass", "badgeSize", "size", "severity", "value", "badgeDisabled"] }, { kind: "directive", type: i0.forwardRef(() => i1.Bind), selector: "[hBind]", inputs: ["hBind"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: TTSortIcon, decorators: [{
+            type: Component,
+            args: [{ selector: 'h-treeTableSortIcon, h-treetable-sort-icon, h-tree-table-sort-icon', standalone: false, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, providers: [TreeTableStyle], template: "@if (!tt.sortIconTemplate && !tt._sortIconTemplate) {\n  @if (sortOrder === 0) {\n    <svg data-h-icon=\"sort-alt\" [class]=\"cx('sortableColumnIcon')\" [hBind]=\"ptm('sortableColumnIcon')\" />\n  }\n  @if (sortOrder === 1) {\n    <svg data-h-icon=\"sort-amount-up-alt\" [class]=\"cx('sortableColumnIcon')\" [hBind]=\"ptm('sortableColumnIcon')\" />\n  }\n  @if (sortOrder === -1) {\n    <svg data-h-icon=\"sort-amount-down\" [class]=\"cx('sortableColumnIcon')\" [hBind]=\"ptm('sortableColumnIcon')\" />\n  }\n}\n@if (tt.sortIconTemplate || tt._sortIconTemplate) {\n  <span [class]=\"cx('sortableColumnIcon')\" [hBind]=\"ptm('sortableColumnIcon')\">\n    <ng-template *ngTemplateOutlet=\"tt.sortIconTemplate || tt._sortIconTemplate; context: { $implicit: sortOrder }\"></ng-template>\n  </span>\n}\n@if (isMultiSorted()) {\n  <h-badge [class]=\"cx('sortableColumnBadge')\" [value]=\"getBadgeValue()\" size=\"small\" [pt]=\"ptm('pcSortableColumnBadge')\" [unstyled]=\"unstyled()\"></h-badge>\n}\n" }]
+        }], ctorParameters: () => [{ type: TreeTable }, { type: i0.ChangeDetectorRef }], propDecorators: { field: [{ type: i0.Input, args: [{ isSignal: true, alias: "field", required: false }] }], ariaLabelDesc: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabelDesc", required: false }] }], ariaLabelAsc: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabelAsc", required: false }] }] } });
+class TTResizableColumn extends BaseComponent {
+    tt;
+    zone;
+    hostName = 'TreeTable';
+    ttResizableColumnDisabled = input(undefined, { ...(ngDevMode ? { debugName: "ttResizableColumnDisabled" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    resizer;
+    resizerMouseDownListener;
+    documentMouseMoveListener;
+    documentMouseUpListener;
+    constructor(tt, zone) {
+        super();
+        this.tt = tt;
+        this.zone = zone;
+    }
+    onAfterViewInit() {
+        if (isPlatformBrowser(this.platformId)) {
+            if (this.isEnabled()) {
+                addClass(this.el.nativeElement, 'h-resizable-column');
+                this.resizer = this.renderer.createElement('span');
+                !this.$unstyled() && this.renderer.addClass(this.resizer, 'h-column-resizer');
+                this.resizer.setAttribute('data-pc-section', 'columnresizer');
+                this.renderer.appendChild(this.el.nativeElement, this.resizer);
+                this.zone.runOutsideAngular(() => {
+                    this.resizerMouseDownListener = this.renderer.listen(this.resizer, 'mousedown', this.onMouseDown.bind(this));
+                });
+            }
+        }
+    }
+    bindDocumentEvents() {
+        this.zone.runOutsideAngular(() => {
+            this.documentMouseMoveListener = this.renderer.listen(this.document, 'mousemove', this.onDocumentMouseMove.bind(this));
+            this.documentMouseUpListener = this.renderer.listen(this.document, 'mouseup', this.onDocumentMouseUp.bind(this));
+        });
+    }
+    unbindDocumentEvents() {
+        if (this.documentMouseMoveListener) {
+            this.documentMouseMoveListener();
+            this.documentMouseMoveListener = null;
+        }
+        if (this.documentMouseUpListener) {
+            this.documentMouseUpListener();
+            this.documentMouseUpListener = null;
+        }
+    }
+    onMouseDown(event) {
+        this.tt.onColumnResizeBegin(event);
+        this.bindDocumentEvents();
+    }
+    onDocumentMouseMove(event) {
+        this.tt.onColumnResize(event);
+    }
+    onDocumentMouseUp(event) {
+        this.tt.onColumnResizeEnd(event, this.el.nativeElement);
+        this.unbindDocumentEvents();
+    }
+    isEnabled() {
+        return this.ttResizableColumnDisabled() !== true;
+    }
+    onDestroy() {
+        if (this.resizerMouseDownListener) {
+            this.resizerMouseDownListener();
+            this.resizerMouseDownListener = null;
+        }
+        this.unbindDocumentEvents();
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: TTResizableColumn, deps: [{ token: TreeTable }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.1.6", type: TTResizableColumn, isStandalone: false, selector: "[ttResizableColumn]", inputs: { ttResizableColumnDisabled: { classPropertyName: "ttResizableColumnDisabled", publicName: "ttResizableColumnDisabled", isSignal: true, isRequired: false, transformFunction: null } }, usesInheritance: true, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: TTResizableColumn, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[ttResizableColumn]',
+                    standalone: false
+                }]
+        }], ctorParameters: () => [{ type: TreeTable }, { type: i0.NgZone }], propDecorators: { ttResizableColumnDisabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "ttResizableColumnDisabled", required: false }] }] } });
+class TTReorderableColumn extends BaseComponent {
+    tt;
+    zone;
+    hostName = 'TreeTable';
+    ttReorderableColumnDisabled = input(undefined, { ...(ngDevMode ? { debugName: "ttReorderableColumnDisabled" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    dragStartListener;
+    dragOverListener;
+    dragEnterListener;
+    dragLeaveListener;
+    mouseDownListener;
+    constructor(tt, zone) {
+        super();
+        this.tt = tt;
+        this.zone = zone;
+    }
+    onAfterViewInit() {
+        if (this.isEnabled()) {
+            this.bindEvents();
+        }
+    }
+    bindEvents() {
+        if (isPlatformBrowser(this.platformId)) {
+            this.zone.runOutsideAngular(() => {
+                this.mouseDownListener = this.renderer.listen(this.el.nativeElement, 'mousedown', this.onMouseDown.bind(this));
+                this.dragStartListener = this.renderer.listen(this.el.nativeElement, 'dragstart', this.onDragStart.bind(this));
+                this.dragOverListener = this.renderer.listen(this.el.nativeElement, 'dragover', this.onDragEnter.bind(this));
+                this.dragEnterListener = this.renderer.listen(this.el.nativeElement, 'dragenter', this.onDragEnter.bind(this));
+                this.dragLeaveListener = this.renderer.listen(this.el.nativeElement, 'dragleave', this.onDragLeave.bind(this));
+            });
+        }
+    }
+    unbindEvents() {
+        if (isPlatformBrowser(this.platformId)) {
+            if (this.mouseDownListener) {
+                this.mouseDownListener();
+                this.mouseDownListener = null;
+            }
+            if (this.dragOverListener) {
+                this.dragOverListener();
+                this.dragOverListener = null;
+            }
+            if (this.dragEnterListener) {
+                this.dragEnterListener();
+                this.dragEnterListener = null;
+            }
+            if (this.dragLeaveListener) {
+                this.dragLeaveListener();
+                this.dragLeaveListener = null;
+            }
+        }
+    }
+    onMouseDown(event) {
+        if (event.target.nodeName === 'INPUT' || event.target.nodeName === 'TEXTAREA' || findSingle(event.target, '[data-pc-section="columnresizer"]'))
+            this.el.nativeElement.draggable = false;
+        else
+            this.el.nativeElement.draggable = true;
+    }
+    onDragStart(event) {
+        this.tt.onColumnDragStart(event, this.el.nativeElement);
+    }
+    onDragOver(event) {
+        event.preventDefault();
+    }
+    onDragEnter(event) {
+        this.tt.onColumnDragEnter(event, this.el.nativeElement);
+    }
+    onDragLeave(event) {
+        this.tt.onColumnDragLeave(event);
+    }
+    onDrop(event) {
+        if (this.isEnabled()) {
+            this.tt.onColumnDrop(event, this.el.nativeElement);
+        }
+    }
+    isEnabled() {
+        return this.ttReorderableColumnDisabled() !== true;
+    }
+    onDestroy() {
+        this.unbindEvents();
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: TTReorderableColumn, deps: [{ token: TreeTable }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.1.6", type: TTReorderableColumn, isStandalone: false, selector: "[ttReorderableColumn]", inputs: { ttReorderableColumnDisabled: { classPropertyName: "ttReorderableColumnDisabled", publicName: "ttReorderableColumnDisabled", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "drop": "onDrop($event)" } }, usesInheritance: true, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: TTReorderableColumn, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[ttReorderableColumn]',
+                    standalone: false,
+                    host: {
+                        '(drop)': 'onDrop($event)'
+                    }
+                }]
+        }], ctorParameters: () => [{ type: TreeTable }, { type: i0.NgZone }], propDecorators: { ttReorderableColumnDisabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "ttReorderableColumnDisabled", required: false }] }] } });
+class TTSelectableRow extends BaseComponent {
+    tt;
+    tableService;
+    rowNode = input(undefined, { ...(ngDevMode ? { debugName: "rowNode" } : /* istanbul ignore next */ {}), alias: "ttSelectableRow" });
+    ttSelectableRowDisabled = input(undefined, { ...(ngDevMode ? { debugName: "ttSelectableRowDisabled" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    selected;
+    subscription;
+    _componentStyle = inject(TreeTableStyle);
+    constructor(tt, tableService) {
+        super();
+        this.tt = tt;
+        this.tableService = tableService;
+        if (this.isEnabled()) {
+            this.subscription = this.tt.tableService.selectionSource$.subscribe(() => {
+                this.selected = this.tt.isSelected(this.rowNode().node);
+            });
+        }
+    }
+    onInit() {
+        if (this.isEnabled()) {
+            this.selected = this.tt.isSelected(this.rowNode().node);
+        }
+    }
+    onClick(event) {
+        if (this.isEnabled()) {
+            this.tt.handleRowClick({
+                originalEvent: event,
+                rowNode: this.rowNode()
+            });
+        }
+    }
+    onKeyDown(event) {
+        switch (event.code) {
+            case 'Enter':
+            case 'Space':
+                this.onEnterKey(event);
+                break;
+            default:
+                break;
+        }
+    }
+    onTouchEnd(event) {
+        if (this.isEnabled()) {
+            this.tt.handleRowTouchEnd(event);
+        }
+    }
+    onEnterKey(event) {
+        if (this.tt.selectionMode() === 'checkbox') {
+            this.tt.toggleNodeWithCheckbox({
+                originalEvent: event,
+                rowNode: this.rowNode()
+            });
+        }
+        else {
+            this.onClick(event);
+        }
+        event.preventDefault();
+    }
+    isEnabled() {
+        return this.ttSelectableRowDisabled() !== true;
+    }
+    onDestroy() {
+        if (this.subscription) {
+            this.subscription.unsubscribe();
+        }
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: TTSelectableRow, deps: [{ token: TreeTable }, { token: TreeTableService }], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.1.6", type: TTSelectableRow, isStandalone: false, selector: "[ttSelectableRow]", inputs: { rowNode: { classPropertyName: "rowNode", publicName: "ttSelectableRow", isSignal: true, isRequired: false, transformFunction: null }, ttSelectableRowDisabled: { classPropertyName: "ttSelectableRowDisabled", publicName: "ttSelectableRowDisabled", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "click": "onClick($event)", "keydown": "onKeyDown($event)", "touchend": "onTouchEnd($event)" }, properties: { "class": "cx(\"row\")", "attr.aria-selected": "selected" } }, providers: [TreeTableStyle], usesInheritance: true, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: TTSelectableRow, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[ttSelectableRow]',
+                    standalone: false,
+                    host: {
+                        '[class]': 'cx("row")',
+                        '[attr.aria-selected]': 'selected',
+                        '(click)': 'onClick($event)',
+                        '(keydown)': 'onKeyDown($event)',
+                        '(touchend)': 'onTouchEnd($event)'
+                    },
+                    providers: [TreeTableStyle]
+                }]
+        }], ctorParameters: () => [{ type: TreeTable }, { type: TreeTableService }], propDecorators: { rowNode: [{ type: i0.Input, args: [{ isSignal: true, alias: "ttSelectableRow", required: false }] }], ttSelectableRowDisabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "ttSelectableRowDisabled", required: false }] }] } });
+class TTSelectableRowDblClick extends BaseComponent {
+    tt;
+    tableService;
+    rowNode = input(undefined, { ...(ngDevMode ? { debugName: "rowNode" } : /* istanbul ignore next */ {}), alias: "ttSelectableRowDblClick" });
+    ttSelectableRowDisabled = input(undefined, { ...(ngDevMode ? { debugName: "ttSelectableRowDisabled" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    selected;
+    subscription;
+    _componentStyle = inject(TreeTableStyle);
+    constructor(tt, tableService) {
+        super();
+        this.tt = tt;
+        this.tableService = tableService;
+        if (this.isEnabled()) {
+            this.subscription = this.tt.tableService.selectionSource$.subscribe(() => {
+                this.selected = this.tt.isSelected(this.rowNode().node);
+            });
+        }
+    }
+    onInit() {
+        if (this.isEnabled()) {
+            this.selected = this.tt.isSelected(this.rowNode().node);
+        }
+    }
+    onClick(event) {
+        if (this.isEnabled()) {
+            this.tt.handleRowClick({
+                originalEvent: event,
+                rowNode: this.rowNode()
+            });
+        }
+    }
+    isEnabled() {
+        return this.ttSelectableRowDisabled() !== true;
+    }
+    onDestroy() {
+        if (this.subscription) {
+            this.subscription.unsubscribe();
+        }
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: TTSelectableRowDblClick, deps: [{ token: TreeTable }, { token: TreeTableService }], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.1.6", type: TTSelectableRowDblClick, isStandalone: false, selector: "[ttSelectableRowDblClick]", inputs: { rowNode: { classPropertyName: "rowNode", publicName: "ttSelectableRowDblClick", isSignal: true, isRequired: false, transformFunction: null }, ttSelectableRowDisabled: { classPropertyName: "ttSelectableRowDisabled", publicName: "ttSelectableRowDisabled", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "dblclick": "onClick($event)" }, properties: { "class": "cx(\"row\")" } }, providers: [TreeTableStyle], usesInheritance: true, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: TTSelectableRowDblClick, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[ttSelectableRowDblClick]',
+                    standalone: false,
+                    host: {
+                        '[class]': 'cx("row")',
+                        '(dblclick)': 'onClick($event)'
+                    },
+                    providers: [TreeTableStyle]
+                }]
+        }], ctorParameters: () => [{ type: TreeTable }, { type: TreeTableService }], propDecorators: { rowNode: [{ type: i0.Input, args: [{ isSignal: true, alias: "ttSelectableRowDblClick", required: false }] }], ttSelectableRowDisabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "ttSelectableRowDisabled", required: false }] }] } });
+class TTContextMenuRow extends BaseComponent {
+    tt;
+    tableService;
+    rowNode = input(undefined, { ...(ngDevMode ? { debugName: "rowNode" } : /* istanbul ignore next */ {}), alias: "ttContextMenuRow" });
+    ttContextMenuRowDisabled = input(undefined, { ...(ngDevMode ? { debugName: "ttContextMenuRowDisabled" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    selected;
+    subscription;
+    _componentStyle = inject(TreeTableStyle);
+    constructor(tt, tableService) {
+        super();
+        this.tt = tt;
+        this.tableService = tableService;
+        if (this.isEnabled()) {
+            this.subscription = this.tt.tableService.contextMenuSource$.subscribe((node) => {
+                this.selected = node ? this.tt.equals(this.rowNode().node, node) : false;
+            });
+        }
+    }
+    onContextMenu(event) {
+        if (this.isEnabled()) {
+            this.tt.handleRowRightClick({
+                originalEvent: event,
+                rowNode: this.rowNode()
+            });
+            this.el.nativeElement.focus();
+            event.preventDefault();
+        }
+    }
+    isEnabled() {
+        return this.ttContextMenuRowDisabled() !== true;
+    }
+    onDestroy() {
+        if (this.subscription) {
+            this.subscription.unsubscribe();
+        }
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: TTContextMenuRow, deps: [{ token: TreeTable }, { token: TreeTableService }], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.1.6", type: TTContextMenuRow, isStandalone: false, selector: "[ttContextMenuRow]", inputs: { rowNode: { classPropertyName: "rowNode", publicName: "ttContextMenuRow", isSignal: true, isRequired: false, transformFunction: null }, ttContextMenuRowDisabled: { classPropertyName: "ttContextMenuRowDisabled", publicName: "ttContextMenuRowDisabled", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "contextmenu": "onContextMenu($event)" }, properties: { "class": "cx(\"contextMenuRow\")", "tabindex": "isEnabled() ? 0 : undefined" } }, providers: [TreeTableStyle], usesInheritance: true, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: TTContextMenuRow, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[ttContextMenuRow]',
+                    standalone: false,
+                    host: {
+                        '[class]': 'cx("contextMenuRow")',
+                        '[tabindex]': 'isEnabled() ? 0 : undefined',
+                        '(contextmenu)': 'onContextMenu($event)'
+                    },
+                    providers: [TreeTableStyle]
+                }]
+        }], ctorParameters: () => [{ type: TreeTable }, { type: TreeTableService }], propDecorators: { rowNode: [{ type: i0.Input, args: [{ isSignal: true, alias: "ttContextMenuRow", required: false }] }], ttContextMenuRowDisabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "ttContextMenuRowDisabled", required: false }] }] } });
+class TTCheckbox extends BaseComponent {
+    tt;
+    tableService;
+    cd;
+    hostName = 'TreeTable';
+    disabled = input(undefined, { ...(ngDevMode ? { debugName: "disabled" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    rowNode = input(undefined, { ...(ngDevMode ? { debugName: "rowNode" } : /* istanbul ignore next */ {}), alias: "value" });
+    checked;
+    partialChecked;
+    focused;
+    subscription;
+    _componentStyle = inject(TreeTableStyle);
+    constructor(tt, tableService, cd) {
+        super();
+        this.tt = tt;
+        this.tableService = tableService;
+        this.cd = cd;
+        this.subscription = this.tt.tableService.selectionSource$.subscribe(() => {
+            if (this.tt.selectionKeys()) {
+                this.checked = this.tt.isNodeSelected(this.rowNode().node);
+                this.partialChecked = this.tt.isNodePartialSelected(this.rowNode().node);
+            }
+            else {
+                this.checked = this.tt.isSelected(this.rowNode().node);
+                this.partialChecked = this.rowNode().node.partialSelected;
+            }
+            this.cd.markForCheck();
+        });
+    }
+    onInit() {
+        if (this.tt.selectionKeys()) {
+            this.checked = this.tt.isNodeSelected(this.rowNode().node);
+            this.partialChecked = this.tt.isNodePartialSelected(this.rowNode().node);
+        }
+        else {
+            // for backward compatibility
+            this.checked = this.tt.isSelected(this.rowNode().node);
+            this.partialChecked = this.rowNode().node.partialSelected;
+        }
+    }
+    onClick(event) {
+        if (!this.disabled()) {
+            if (this.tt.selectionKeys()) {
+                const _check = !this.checked;
+                this.tt.toggleCheckbox({
+                    originalEvent: event,
+                    check: _check,
+                    rowNode: this.rowNode()
+                });
+            }
+            else {
+                this.tt.toggleNodeWithCheckbox({
+                    originalEvent: event,
+                    rowNode: this.rowNode()
+                });
+            }
+        }
+        clearSelection();
+    }
+    onFocus() {
+        this.focused = true;
+    }
+    onBlur() {
+        this.focused = false;
+    }
+    onDestroy() {
+        if (this.subscription) {
+            this.subscription.unsubscribe();
+        }
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: TTCheckbox, deps: [{ token: TreeTable }, { token: TreeTableService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.6", type: TTCheckbox, isStandalone: false, selector: "h-treeTableCheckbox, h-treetable-checkbox, h-tree-table-checkbox", inputs: { disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, rowNode: { classPropertyName: "rowNode", publicName: "value", isSignal: true, isRequired: false, transformFunction: null } }, providers: [TreeTableStyle], usesInheritance: true, ngImport: i0, template: `
+        <h-checkbox [ngModel]="checked" [pt]="ptm('pcRowCheckbox')" (onChange)="onClick($event)" [binary]="true" [disabled]="disabled()" [indeterminate]="partialChecked" [styleClass]="cx('pcNodeCheckbox')" [tabIndex]="-1" [unstyled]="unstyled()">
+          @if (tt.checkboxIconTemplate || tt._checkboxIconTemplate) {
+            <ng-template hTemplate="icon">
+              <ng-template *ngTemplateOutlet="tt.checkboxIconTemplate || tt._checkboxIconTemplate; context: { $implicit: checked, partialSelected: partialChecked }"></ng-template>
+            </ng-template>
+          }
+        </h-checkbox>
+        `, isInline: true, dependencies: [{ kind: "directive", type: i0.forwardRef(() => i2.NgTemplateOutlet), selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i0.forwardRef(() => i4.HelixTemplate), selector: "[hTemplate]", inputs: ["type", "hTemplate"] }, { kind: "component", type: i0.forwardRef(() => Checkbox), selector: "h-checkbox, h-checkBox, h-check-box", inputs: ["hostName", "value", "binary", "ariaLabelledBy", "ariaLabel", "tabindex", "inputId", "inputStyle", "styleClass", "inputClass", "indeterminate", "formControl", "checkboxIcon", "readonly", "autofocus", "trueValue", "falseValue", "variant", "size"], outputs: ["onChange", "onFocus", "onBlur"] }, { kind: "directive", type: i0.forwardRef(() => i6.NgControlStatus), selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i0.forwardRef(() => i6.NgModel), selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: TTCheckbox, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'h-treeTableCheckbox, h-treetable-checkbox, h-tree-table-checkbox',
+                    standalone: false,
+                    template: `
+        <h-checkbox [ngModel]="checked" [pt]="ptm('pcRowCheckbox')" (onChange)="onClick($event)" [binary]="true" [disabled]="disabled()" [indeterminate]="partialChecked" [styleClass]="cx('pcNodeCheckbox')" [tabIndex]="-1" [unstyled]="unstyled()">
+          @if (tt.checkboxIconTemplate || tt._checkboxIconTemplate) {
+            <ng-template hTemplate="icon">
+              <ng-template *ngTemplateOutlet="tt.checkboxIconTemplate || tt._checkboxIconTemplate; context: { $implicit: checked, partialSelected: partialChecked }"></ng-template>
+            </ng-template>
+          }
+        </h-checkbox>
+        `,
+                    encapsulation: ViewEncapsulation.None,
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    providers: [TreeTableStyle]
+                }]
+        }], ctorParameters: () => [{ type: TreeTable }, { type: TreeTableService }, { type: i0.ChangeDetectorRef }], propDecorators: { disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], rowNode: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }] } });
+class TTHeaderCheckbox extends BaseComponent {
+    tt;
+    tableService;
+    checked;
+    disabled;
+    selectionChangeSubscription;
+    valueChangeSubscription;
+    constructor(tt, tableService) {
+        super();
+        this.tt = tt;
+        this.tableService = tableService;
+        this.valueChangeSubscription = this.tt.tableService.uiUpdateSource$.subscribe(() => {
+            this.checked = this.updateCheckedState();
+        });
+        this.selectionChangeSubscription = this.tt.tableService.selectionSource$.subscribe(() => {
+            this.checked = this.updateCheckedState();
+        });
+    }
+    onInit() {
+        this.checked = this.updateCheckedState();
+    }
+    onClick(event) {
+        const value = this.tt?.value();
+        if ((value || this.tt?.filteredNodes) && ((value && value.length > 0) || (this.tt?.filteredNodes && this.tt.filteredNodes.length > 0))) {
+            this.tt?.toggleNodesWithCheckbox(event, !this.checked);
+        }
+        clearSelection();
+    }
+    onDestroy() {
+        if (this.selectionChangeSubscription) {
+            this.selectionChangeSubscription.unsubscribe();
+        }
+        if (this.valueChangeSubscription) {
+            this.valueChangeSubscription.unsubscribe();
+        }
+    }
+    updateCheckedState() {
+        this.cd.markForCheck();
+        let checked;
+        const data = this.tt.filteredNodes || this.tt.value();
+        if (data) {
+            if (this.tt.selectionKeys()) {
+                for (let node of data) {
+                    if (this.tt.isNodeSelected(node)) {
+                        checked = true;
+                    }
+                    else {
+                        checked = false;
+                        break;
+                    }
+                }
+            }
+            if (!this.tt.selectionKeys()) {
+                // legacy selection support, will be removed in v18
+                for (let node of data) {
+                    if (this.tt.isSelected(node)) {
+                        checked = true;
+                    }
+                    else {
+                        checked = false;
+                        break;
+                    }
+                }
+            }
+        }
+        else {
+            checked = false;
+        }
+        return checked;
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: TTHeaderCheckbox, deps: [{ token: TreeTable }, { token: TreeTableService }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.6", type: TTHeaderCheckbox, isStandalone: false, selector: "h-treeTableHeaderCheckbox", usesInheritance: true, ngImport: i0, template: `
+        <h-checkbox [ngModel]="checked" [pt]="ptm('pcHeaderCheckbox')" (onChange)="onClick($event)" [binary]="true" [disabled]="!tt.value || tt.value.length === 0" [unstyled]="unstyled()">
+          @if (tt.headerCheckboxIconTemplate || tt._headerCheckboxIconTemplate) {
+            <ng-template hTemplate="icon">
+              <ng-template *ngTemplateOutlet="tt.headerCheckboxIconTemplate || tt._headerCheckboxIconTemplate; context: { $implicit: checked }"></ng-template>
+            </ng-template>
+          }
+        </h-checkbox>
+        `, isInline: true, dependencies: [{ kind: "directive", type: i0.forwardRef(() => i2.NgTemplateOutlet), selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i0.forwardRef(() => i4.HelixTemplate), selector: "[hTemplate]", inputs: ["type", "hTemplate"] }, { kind: "component", type: i0.forwardRef(() => Checkbox), selector: "h-checkbox, h-checkBox, h-check-box", inputs: ["hostName", "value", "binary", "ariaLabelledBy", "ariaLabel", "tabindex", "inputId", "inputStyle", "styleClass", "inputClass", "indeterminate", "formControl", "checkboxIcon", "readonly", "autofocus", "trueValue", "falseValue", "variant", "size"], outputs: ["onChange", "onFocus", "onBlur"] }, { kind: "directive", type: i0.forwardRef(() => i6.NgControlStatus), selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i0.forwardRef(() => i6.NgModel), selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: TTHeaderCheckbox, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'h-treeTableHeaderCheckbox',
+                    standalone: false,
+                    template: `
+        <h-checkbox [ngModel]="checked" [pt]="ptm('pcHeaderCheckbox')" (onChange)="onClick($event)" [binary]="true" [disabled]="!tt.value || tt.value.length === 0" [unstyled]="unstyled()">
+          @if (tt.headerCheckboxIconTemplate || tt._headerCheckboxIconTemplate) {
+            <ng-template hTemplate="icon">
+              <ng-template *ngTemplateOutlet="tt.headerCheckboxIconTemplate || tt._headerCheckboxIconTemplate; context: { $implicit: checked }"></ng-template>
+            </ng-template>
+          }
+        </h-checkbox>
+        `,
+                    encapsulation: ViewEncapsulation.None,
+                    changeDetection: ChangeDetectionStrategy.OnPush
+                }]
+        }], ctorParameters: () => [{ type: TreeTable }, { type: TreeTableService }] });
+class TTEditableColumn extends BaseComponent {
+    tt;
+    zone;
+    data = input(undefined, { ...(ngDevMode ? { debugName: "data" } : /* istanbul ignore next */ {}), alias: "ttEditableColumn" });
+    field = input(undefined, { ...(ngDevMode ? { debugName: "field" } : /* istanbul ignore next */ {}), alias: "ttEditableColumnField" });
+    ttEditableColumnDisabled = input(undefined, { ...(ngDevMode ? { debugName: "ttEditableColumnDisabled" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    constructor(tt, zone) {
+        super();
+        this.tt = tt;
+        this.zone = zone;
+    }
+    onAfterViewInit() {
+        if (this.isEnabled()) {
+            !this.$unstyled() && addClass(this.el.nativeElement, 'h-editable-column');
+            this.el?.nativeElement.setAttribute('data-h-editable-column', 'true');
+        }
+    }
+    onClick(event) {
+        if (this.isEnabled()) {
+            this.tt.editingCellClick = true;
+            if (this.tt.editingCell) {
+                if (this.tt.editingCell !== this.el.nativeElement) {
+                    if (!this.tt.isEditingCellValid()) {
+                        return;
+                    }
+                    if (this.tt.editingCell)
+                        !this.$unstyled() && removeClass(this.tt.editingCell, 'h-cell-editing');
+                    this.openCell();
+                }
+            }
+            else {
+                this.openCell();
+            }
+        }
+    }
+    openCell() {
+        const data = this.data();
+        const field = this.field();
+        this.tt.updateEditingCell(this.el.nativeElement, data, field);
+        !this.$unstyled() && addClass(this.el.nativeElement, 'h-cell-editing');
+        this.el?.nativeElement.setAttribute('data-h-cell-editing', 'true');
+        this.tt.onEditInit.emit({ field: field, data: data });
+        this.tt.editingCellClick = true;
+        this.zone.runOutsideAngular(() => {
+            setTimeout(() => {
+                let focusable = findSingle(this.el.nativeElement, 'input, textarea');
+                if (focusable) {
+                    focusable.focus();
+                }
+            }, 50);
+        });
+    }
+    closeEditingCell() {
+        if (this.tt.editingCell)
+            !this.$unstyled() && removeClass(this.tt.editingCell, 'h-checkbox-icon');
+        this.tt.editingCell = null;
+        this.tt.unbindDocumentEditListener();
+    }
+    onKeyDown(event) {
+        if (this.isEnabled()) {
+            //enter
+            if (event.keyCode == 13 && !event.shiftKey) {
+                if (this.tt.isEditingCellValid()) {
+                    if (this.tt.editingCell) {
+                        !this.$unstyled() && removeClass(this.tt.editingCell, 'h-cell-editing');
+                        this.el?.nativeElement.setAttribute('data-h-cell-editing', 'false');
+                    }
+                    this.closeEditingCell();
+                    this.tt.onEditComplete.emit({ field: this.field(), data: this.data() });
+                }
+                event.preventDefault();
+            }
+            //escape
+            else if (event.keyCode == 27) {
+                if (this.tt.isEditingCellValid()) {
+                    if (this.tt.editingCell) {
+                        !this.$unstyled() && removeClass(this.tt.editingCell, 'h-cell-editing');
+                        this.el?.nativeElement.setAttribute('data-h-cell-editing', 'false');
+                    }
+                    this.closeEditingCell();
+                    this.tt.onEditCancel.emit({ field: this.field(), data: this.data() });
+                }
+                event.preventDefault();
+            }
+            //tab
+            else if (event.keyCode == 9) {
+                this.tt.onEditComplete.emit({ field: this.field(), data: this.data() });
+                if (event.shiftKey)
+                    this.moveToPreviousCell(event);
+                else
+                    this.moveToNextCell(event);
+            }
+        }
+    }
+    findCell(element) {
+        if (element) {
+            let cell = element;
+            while (cell && !findSingle(cell, '[data-h-cell-editing="true"]')) {
+                cell = cell.parentElement;
+            }
+            return cell;
+        }
+        else {
+            return null;
+        }
+    }
+    moveToPreviousCell(event) {
+        let currentCell = this.findCell(event.target);
+        let row = currentCell.parentElement;
+        let targetCell = this.findPreviousEditableColumn(currentCell);
+        if (targetCell) {
+            // @ts-ignore
+            invokeElementMethod(targetCell, 'click', undefined);
+            event.preventDefault();
+        }
+    }
+    moveToNextCell(event) {
+        let currentCell = this.findCell(event.target);
+        let row = currentCell.parentElement;
+        let targetCell = this.findNextEditableColumn(currentCell);
+        if (targetCell) {
+            // @ts-ignore
+            invokeElementMethod(targetCell, 'click', undefined);
+            event.preventDefault();
+        }
+    }
+    findPreviousEditableColumn(cell) {
+        let prevCell = cell.previousElementSibling;
+        if (!prevCell) {
+            let previousRow = cell.parentElement ? cell.parentElement.previousElementSibling : null;
+            if (previousRow) {
+                prevCell = previousRow.lastElementChild;
+            }
+        }
+        if (prevCell) {
+            if (findSingle(prevCell, '[data-h-editable-column="true"]'))
+                return prevCell;
+            else
+                return this.findPreviousEditableColumn(prevCell);
+        }
+        else {
+            return null;
+        }
+    }
+    findNextEditableColumn(cell) {
+        let nextCell = cell.nextElementSibling;
+        if (!nextCell) {
+            let nextRow = cell.parentElement ? cell.parentElement.nextElementSibling : null;
+            if (nextRow) {
+                nextCell = nextRow.firstElementChild;
+            }
+        }
+        if (nextCell) {
+            if (findSingle(nextCell, '[data-h-editable-column="true"]'))
+                return nextCell;
+            else
+                return this.findNextEditableColumn(nextCell);
+        }
+        else {
+            return null;
+        }
+    }
+    isEnabled() {
+        return this.ttEditableColumnDisabled() !== true;
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: TTEditableColumn, deps: [{ token: TreeTable }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.1.6", type: TTEditableColumn, isStandalone: false, selector: "[ttEditableColumn]", inputs: { data: { classPropertyName: "data", publicName: "ttEditableColumn", isSignal: true, isRequired: false, transformFunction: null }, field: { classPropertyName: "field", publicName: "ttEditableColumnField", isSignal: true, isRequired: false, transformFunction: null }, ttEditableColumnDisabled: { classPropertyName: "ttEditableColumnDisabled", publicName: "ttEditableColumnDisabled", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "click": "onClick($event)", "keydown": "onKeyDown($event)" } }, usesInheritance: true, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: TTEditableColumn, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[ttEditableColumn]',
+                    standalone: false,
+                    host: {
+                        '(click)': 'onClick($event)',
+                        '(keydown)': 'onKeyDown($event)'
+                    }
+                }]
+        }], ctorParameters: () => [{ type: TreeTable }, { type: i0.NgZone }], propDecorators: { data: [{ type: i0.Input, args: [{ isSignal: true, alias: "ttEditableColumn", required: false }] }], field: [{ type: i0.Input, args: [{ isSignal: true, alias: "ttEditableColumnField", required: false }] }], ttEditableColumnDisabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "ttEditableColumnDisabled", required: false }] }] } });
+class TreeTableCellEditor extends BaseComponent {
+    tt;
+    editableColumn;
+    hostName = 'TreeTable';
+    bindDirectiveInstance = inject(Bind, { self: true });
+    onAfterViewChecked() {
+        this.bindDirectiveInstance.setAttrs(this.ptm('cellEditor'));
+    }
+    templates = contentChildren(HelixTemplate, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "templates" }] : /* istanbul ignore next */ []));
+    inputTemplate;
+    outputTemplate;
+    constructor(tt, editableColumn) {
+        super();
+        this.tt = tt;
+        this.editableColumn = editableColumn;
+    }
+    onAfterContentInit() {
+        this.templates().forEach((item) => {
+            switch (item.getType()) {
+                case 'input':
+                    this.inputTemplate = item.template;
+                    break;
+                case 'output':
+                    this.outputTemplate = item.template;
+                    break;
+            }
+        });
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: TreeTableCellEditor, deps: [{ token: TreeTable }, { token: TTEditableColumn }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.6", type: TreeTableCellEditor, isStandalone: false, selector: "h-treeTableCellEditor, h-treetablecelleditor, h-treetable-cell-editor", queries: [{ propertyName: "templates", predicate: HelixTemplate, isSignal: true }], usesInheritance: true, hostDirectives: [{ directive: i1.Bind }], ngImport: i0, template: `
+        @if (tt.editingCell === editableColumn.el.nativeElement) {
+          <ng-container *ngTemplateOutlet="inputTemplate"></ng-container>
+        }
+        @if (!tt.editingCell || tt.editingCell !== editableColumn.el.nativeElement) {
+          <ng-container *ngTemplateOutlet="outputTemplate"></ng-container>
+        }
+        `, isInline: true, dependencies: [{ kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.Eager, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: TreeTableCellEditor, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'h-treeTableCellEditor, h-treetablecelleditor, h-treetable-cell-editor',
+                    standalone: false,
+                    template: `
+        @if (tt.editingCell === editableColumn.el.nativeElement) {
+          <ng-container *ngTemplateOutlet="inputTemplate"></ng-container>
+        }
+        @if (!tt.editingCell || tt.editingCell !== editableColumn.el.nativeElement) {
+          <ng-container *ngTemplateOutlet="outputTemplate"></ng-container>
+        }
+        `,
+                    encapsulation: ViewEncapsulation.None,
+                    changeDetection: ChangeDetectionStrategy.Eager,
+                    hostDirectives: [Bind]
+                }]
+        }], ctorParameters: () => [{ type: TreeTable }, { type: TTEditableColumn }], propDecorators: { templates: [{ type: i0.ContentChildren, args: [i0.forwardRef(() => HelixTemplate), { isSignal: true }] }] } });
+class TTRow extends BaseComponent {
+    tt;
+    el;
+    zone;
+    hostName = 'TreeTable';
+    bindDirectiveInstance = inject(Bind, { self: true });
+    treeTable = inject(TreeTable);
+    onAfterViewChecked() {
+        this.bindDirectiveInstance.setAttrs(this.ptm('row', this.ptmOptions()));
+    }
+    get level() {
+        return this.rowNode()?.['level'] + 1;
+    }
+    get styleClass() {
+        return this.rowNode()?.node['styleClass'] || '';
+    }
+    get expanded() {
+        return this.rowNode()?.node['expanded'];
+    }
+    rowNode = input(undefined, { ...(ngDevMode ? { debugName: "rowNode" } : /* istanbul ignore next */ {}), alias: "ttRow" });
+    _componentStyle = inject(TreeTableStyle);
+    constructor(tt, el, zone) {
+        super();
+        this.tt = tt;
+        this.el = el;
+        this.zone = zone;
+    }
+    onKeyDown(event) {
+        switch (event.code) {
+            case 'ArrowDown':
+                this.onArrowDownKey(event);
+                break;
+            case 'ArrowUp':
+                this.onArrowUpKey(event);
+                break;
+            case 'ArrowRight':
+                this.onArrowRightKey(event);
+                break;
+            case 'ArrowLeft':
+                this.onArrowLeftKey(event);
+                break;
+            case 'Tab':
+                this.onTabKey(event);
+                break;
+            case 'Home':
+                this.onHomeKey(event);
+                break;
+            case 'End':
+                this.onEndKey(event);
+                break;
+            default:
+                break;
+        }
+    }
+    onArrowDownKey(event) {
+        let nextRow = this.el?.nativeElement?.nextElementSibling;
+        if (nextRow) {
+            this.focusRowChange(event.currentTarget, nextRow);
+        }
+        event.preventDefault();
+    }
+    onArrowUpKey(event) {
+        let prevRow = this.el?.nativeElement?.previousElementSibling;
+        if (prevRow) {
+            this.focusRowChange(event.currentTarget, prevRow);
+        }
+        event.preventDefault();
+    }
+    onArrowRightKey(event) {
+        const currentTarget = event.currentTarget;
+        const isHiddenIcon = findSingle(currentTarget, 'button').style.visibility === 'hidden';
+        if (!isHiddenIcon && !this.expanded && this.rowNode().node['children']) {
+            this.expand(event);
+            currentTarget.tabIndex = -1;
+        }
+        event.preventDefault();
+    }
+    onArrowLeftKey(event) {
+        const container = this.tt.el?.nativeElement;
+        const expandedRows = find(container, '[aria-expanded="true"]');
+        const lastExpandedRow = expandedRows[expandedRows.length - 1];
+        if (this.expanded) {
+            this.collapse(event);
+        }
+        if (lastExpandedRow) {
+            this.tt.toggleRowIndex = getIndex(lastExpandedRow);
+        }
+        this.restoreFocus();
+        event.preventDefault();
+    }
+    onHomeKey(event) {
+        const firstElement = findSingle(this.tt.el?.nativeElement, `tr[aria-level="${this.level}"]`);
+        firstElement && focus(firstElement);
+        event.preventDefault();
+    }
+    onEndKey(event) {
+        const nodes = find(this.tt.el?.nativeElement, `tr[aria-level="${this.level}"]`);
+        const lastElement = nodes[nodes.length - 1];
+        focus(lastElement);
+        event.preventDefault();
+    }
+    onTabKey(event) {
+        const rows = this.el.nativeElement ? [...find(this.el.nativeElement.parentNode, 'tr')] : undefined;
+        if (rows && isNotEmpty(rows)) {
+            const hasSelectedRow = rows.some((row) => getAttribute(row, 'data-h-highlight') || row.getAttribute('aria-selected') === 'true');
+            rows.forEach((row) => {
+                row.tabIndex = -1;
+            });
+            if (hasSelectedRow) {
+                const selectedNodes = rows.filter((node) => getAttribute(node, 'data-h-highlight') || node.getAttribute('aria-selected') === 'true');
+                selectedNodes[0].tabIndex = 0;
+                return;
+            }
+            rows[0].tabIndex = 0;
+        }
+    }
+    expand(event) {
+        this.tt.toggleRowIndex = getIndex(this.el.nativeElement);
+        const node = this.rowNode()?.node;
+        if (node)
+            node['expanded'] = true;
+        this.tt.updateSerializedValue();
+        this.tt.tableService.onUIUpdate(this.tt.value());
+        node?.['children'] ? this.restoreFocus(this.tt.toggleRowIndex + 1) : this.restoreFocus();
+        this.tt.onNodeExpand.emit({
+            originalEvent: event,
+            node
+        });
+    }
+    collapse(event) {
+        const node = this.rowNode()?.node;
+        if (node)
+            node['expanded'] = false;
+        this.tt.updateSerializedValue();
+        this.tt.tableService.onUIUpdate(this.tt.value());
+        this.tt.onNodeCollapse.emit({ originalEvent: event, node });
+    }
+    focusRowChange(firstFocusableRow, currentFocusedRow, lastVisibleDescendant) {
+        firstFocusableRow.tabIndex = '-1';
+        currentFocusedRow.tabIndex = '0';
+        focus(currentFocusedRow);
+    }
+    restoreFocus(index) {
+        this.zone.runOutsideAngular(() => {
+            setTimeout(() => {
+                const container = this.tt.el?.nativeElement;
+                const tbody = findSingle(container, '[data-pc-section="tbody"]');
+                const row = tbody?.children?.[index || this.tt.toggleRowIndex || 0];
+                const rows = [...find(container, 'tr')];
+                rows &&
+                    rows.forEach((r) => {
+                        if (row && !row.isSameNode(r)) {
+                            r.tabIndex = -1;
+                        }
+                    });
+                if (row) {
+                    row.tabIndex = 0;
+                    row.focus();
+                }
+            }, 25);
+        });
+    }
+    ptmOptions() {
+        return {
+            context: {
+                selectable: this.treeTable?.rowHover() || this.treeTable.selectionMode() === 'row',
+                selected: this.treeTable.isSelected(this.rowNode()?.node),
+                scrollable: this.treeTable?.scrollable(),
+                rowNode: this.rowNode()
+            }
+        };
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: TTRow, deps: [{ token: TreeTable }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.1.6", type: TTRow, isStandalone: false, selector: "[ttRow]", inputs: { rowNode: { classPropertyName: "rowNode", publicName: "ttRow", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "role": "row" }, listeners: { "keydown": "onKeyDown($event)" }, properties: { "class": "'h-element ' + styleClass", "tabindex": "'0'", "attr.aria-expanded": "expanded", "attr.aria-level": "level" } }, providers: [TreeTableStyle], usesInheritance: true, hostDirectives: [{ directive: i1.Bind }], ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: TTRow, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[ttRow]',
+                    standalone: false,
+                    host: {
+                        '[class]': `'h-element ' + styleClass`,
+                        '[tabindex]': "'0'",
+                        '[attr.aria-expanded]': 'expanded',
+                        '[attr.aria-level]': 'level',
+                        role: 'row',
+                        '(keydown)': 'onKeyDown($event)'
+                    },
+                    providers: [TreeTableStyle],
+                    hostDirectives: [Bind]
+                }]
+        }], ctorParameters: () => [{ type: TreeTable }, { type: i0.ElementRef }, { type: i0.NgZone }], propDecorators: { rowNode: [{ type: i0.Input, args: [{ isSignal: true, alias: "ttRow", required: false }] }] } });
+class TreeTableToggler extends BaseComponent {
+    tt;
+    hostName = 'TreeTable';
+    bindDirectiveInstance = inject(Bind, { self: true });
+    onAfterViewChecked() {
+        this.bindDirectiveInstance.setAttrs(this.ptm('toggler'));
+    }
+    rowNode = input(/* @ts-ignore */
+    ...(ngDevMode ? [undefined, { debugName: "rowNode" }] : /* istanbul ignore next */ []));
+    _componentStyle = inject(TreeTableStyle);
+    constructor(tt) {
+        super();
+        this.tt = tt;
+    }
+    get toggleButtonAriaLabel() {
+        return this.config.translation ? (this.rowNode().expanded ? this.config.translation?.aria?.collapseRow : this.config.translation?.aria?.expandRow) : undefined;
+    }
+    onClick(event) {
+        const node = this.rowNode();
+        node.node.expanded = !node.node.expanded;
+        if (node.node.expanded) {
+            this.tt.onNodeExpand.emit({
+                originalEvent: event,
+                node: node.node
+            });
+        }
+        else {
+            this.tt.onNodeCollapse.emit({
+                originalEvent: event,
+                node: node.node
+            });
+        }
+        this.tt.updateSerializedValue();
+        this.tt.tableService.onUIUpdate(this.tt.value());
+        event.preventDefault();
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: TreeTableToggler, deps: [{ token: TreeTable }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.6", type: TreeTableToggler, isStandalone: false, selector: "h-treeTableToggler, h-treetabletoggler, h-treetable-toggler", inputs: { rowNode: { classPropertyName: "rowNode", publicName: "rowNode", isSignal: true, isRequired: false, transformFunction: null } }, providers: [TreeTableStyle], usesInheritance: true, hostDirectives: [{ directive: i1.Bind }], ngImport: i0, template: "<button\n  type=\"button\"\n  [class]=\"cx('toggler')\"\n  [hBind]=\"ptm('rowToggleButton')\"\n  (click)=\"onClick($event)\"\n  tabindex=\"-1\"\n  hRipple\n  [style.visibility]=\"rowNode().node.leaf === false || (rowNode().node.children && rowNode().node.children.length) ? 'visible' : 'hidden'\"\n  [style.marginInlineStart]=\"rowNode().level * 16 + 'px'\"\n  [attr.data-pc-group-section]=\"'rowactionbutton'\"\n  [attr.aria-label]=\"toggleButtonAriaLabel\"\n  >\n  @if (!tt.togglerIconTemplate && !tt._togglerIconTemplate()) {\n    @if (rowNode().node.expanded) {\n      <svg data-h-icon=\"chevron-down\" [hBind]=\"ptm('nodetoggleicon')\" [attr.aria-hidden]=\"true\" />\n    }\n    @if (!rowNode().node.expanded) {\n      <svg data-h-icon=\"chevron-right\" [hBind]=\"ptm('nodetoggleicon')\" [attr.aria-hidden]=\"true\" />\n    }\n  }\n  <ng-template *ngTemplateOutlet=\"tt.togglerIconTemplate || tt._togglerIconTemplate(); context: { $implicit: rowNode().node.expanded }\"></ng-template>\n</button>\n", dependencies: [{ kind: "directive", type: i0.forwardRef(() => i2.NgTemplateOutlet), selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i0.forwardRef(() => Ripple), selector: "[hRipple]" }, { kind: "component", type: i0.forwardRef(() => ChevronDownIcon), selector: "[data-h-icon=\"chevron-down\"]" }, { kind: "component", type: i0.forwardRef(() => ChevronRightIcon), selector: "[data-h-icon=\"chevron-right\"]" }, { kind: "directive", type: i0.forwardRef(() => i1.Bind), selector: "[hBind]", inputs: ["hBind"] }], changeDetection: i0.ChangeDetectionStrategy.Eager, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: TreeTableToggler, decorators: [{
+            type: Component,
+            args: [{ selector: 'h-treeTableToggler, h-treetabletoggler, h-treetable-toggler', standalone: false, encapsulation: ViewEncapsulation.None, providers: [TreeTableStyle], changeDetection: ChangeDetectionStrategy.Eager, hostDirectives: [Bind], template: "<button\n  type=\"button\"\n  [class]=\"cx('toggler')\"\n  [hBind]=\"ptm('rowToggleButton')\"\n  (click)=\"onClick($event)\"\n  tabindex=\"-1\"\n  hRipple\n  [style.visibility]=\"rowNode().node.leaf === false || (rowNode().node.children && rowNode().node.children.length) ? 'visible' : 'hidden'\"\n  [style.marginInlineStart]=\"rowNode().level * 16 + 'px'\"\n  [attr.data-pc-group-section]=\"'rowactionbutton'\"\n  [attr.aria-label]=\"toggleButtonAriaLabel\"\n  >\n  @if (!tt.togglerIconTemplate && !tt._togglerIconTemplate()) {\n    @if (rowNode().node.expanded) {\n      <svg data-h-icon=\"chevron-down\" [hBind]=\"ptm('nodetoggleicon')\" [attr.aria-hidden]=\"true\" />\n    }\n    @if (!rowNode().node.expanded) {\n      <svg data-h-icon=\"chevron-right\" [hBind]=\"ptm('nodetoggleicon')\" [attr.aria-hidden]=\"true\" />\n    }\n  }\n  <ng-template *ngTemplateOutlet=\"tt.togglerIconTemplate || tt._togglerIconTemplate(); context: { $implicit: rowNode().node.expanded }\"></ng-template>\n</button>\n" }]
+        }], ctorParameters: () => [{ type: TreeTable }], propDecorators: { rowNode: [{ type: i0.Input, args: [{ isSignal: true, alias: "rowNode", required: false }] }] } });
+class TreeTableModule {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: TreeTableModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "22.1.6", ngImport: i0, type: TreeTableModule, declarations: [TreeTable, TreeTableToggler, TTScrollableView, TTBody, TTSortableColumn, TTSortIcon, TTResizableColumn, TTRow, TTReorderableColumn, TTSelectableRow, TTSelectableRowDblClick, TTContextMenuRow, TTCheckbox, TTHeaderCheckbox, TTEditableColumn, TreeTableCellEditor], imports: [CommonModule,
+            PaginatorModule,
+            Ripple,
+            Scroller,
+            SpinnerIcon,
+            ArrowDownIcon,
+            ArrowUpIcon,
+            SortAltIcon,
+            SortAmountUpAltIcon,
+            SortAmountDownIcon,
+            BadgeModule,
+            CheckIcon,
+            ChevronDownIcon,
+            ChevronRightIcon,
+            Checkbox,
+            SharedModule,
+            FormsModule,
+            BindModule], exports: [TreeTable, SharedModule, TreeTableToggler, TTSortableColumn, TTSortIcon, TTResizableColumn, TTRow, TTReorderableColumn, TTSelectableRow, TTSelectableRowDblClick, TTContextMenuRow, TTCheckbox, TTHeaderCheckbox, TTEditableColumn, TreeTableCellEditor, Scroller] });
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: TreeTableModule, imports: [CommonModule,
+            PaginatorModule,
+            Scroller,
+            SpinnerIcon,
+            ArrowDownIcon,
+            ArrowUpIcon,
+            SortAltIcon,
+            SortAmountUpAltIcon,
+            SortAmountDownIcon,
+            BadgeModule,
+            CheckIcon,
+            ChevronDownIcon,
+            ChevronRightIcon,
+            Checkbox,
+            SharedModule,
+            FormsModule,
+            BindModule, SharedModule] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: TreeTableModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    imports: [
+                        CommonModule,
+                        PaginatorModule,
+                        Ripple,
+                        Scroller,
+                        SpinnerIcon,
+                        ArrowDownIcon,
+                        ArrowUpIcon,
+                        SortAltIcon,
+                        SortAmountUpAltIcon,
+                        SortAmountDownIcon,
+                        BadgeModule,
+                        CheckIcon,
+                        ChevronDownIcon,
+                        ChevronRightIcon,
+                        Checkbox,
+                        SharedModule,
+                        FormsModule,
+                        BindModule
+                    ],
+                    exports: [
+                        TreeTable,
+                        SharedModule,
+                        TreeTableToggler,
+                        TTSortableColumn,
+                        TTSortIcon,
+                        TTResizableColumn,
+                        TTRow,
+                        TTReorderableColumn,
+                        TTSelectableRow,
+                        TTSelectableRowDblClick,
+                        TTContextMenuRow,
+                        TTCheckbox,
+                        TTHeaderCheckbox,
+                        TTEditableColumn,
+                        TreeTableCellEditor,
+                        Scroller
+                    ],
+                    declarations: [
+                        TreeTable,
+                        TreeTableToggler,
+                        TTScrollableView,
+                        TTBody,
+                        TTSortableColumn,
+                        TTSortIcon,
+                        TTResizableColumn,
+                        TTRow,
+                        TTReorderableColumn,
+                        TTSelectableRow,
+                        TTSelectableRowDblClick,
+                        TTContextMenuRow,
+                        TTCheckbox,
+                        TTHeaderCheckbox,
+                        TTEditableColumn,
+                        TreeTableCellEditor
+                    ]
+                }]
+        }] });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { TTBody, TTCheckbox, TTContextMenuRow, TTEditableColumn, TTHeaderCheckbox, TTReorderableColumn, TTResizableColumn, TTRow, TTScrollableView, TTSelectableRow, TTSelectableRowDblClick, TTSortIcon, TTSortableColumn, TreeTable, TreeTableCellEditor, TreeTableClasses, TreeTableModule, TreeTableService, TreeTableStyle, TreeTableToggler };
+//# sourceMappingURL=gravionlabs-helix-core-treetable.mjs.map