import * as i0 from '@angular/core';
import { OnInit, OnDestroy, EventEmitter, ElementRef, AfterContentInit, AfterViewInit, OnChanges, TemplateRef, QueryList, SimpleChanges, PipeTransform } from '@angular/core';
import { CdkVirtualScrollViewport } from '@angular/cdk/scrolling';
import { EuiPaginatorComponent } from '@eui/components/eui-paginator';
import { EuiTemplateDirective } from '@eui/components/directives';
import { FormGroup, FormControl } from '@angular/forms';
import { BehaviorSubject } from 'rxjs';
import * as i1 from '@eui/components/shared';
import { EuiDropdownComponent } from '@eui/components/eui-dropdown';

/**
 * @description
 * Component used with `eui-table` to add a filter feature to the table.
 *
 * @usageNotes
 * ### Basic Usage
 * ```html
 * <eui-table-filter #filter placeholder="Search filter..." (filterChange)="onFilterChange($event)"></eui-table-filter>
 * <table #euiTable euiTable [data]="data" [filter]="filter">
 *     <ng-template euiTemplate="header">
 *         <tr>
 *             <th>Country</th>
 *             <th>Year</th>
 *             <th>ISO</th>
 *             <th>Population</th>
 *             <th>Capital city</th>
 *         </tr>
 *     </ng-template>
 *     <ng-template let-row euiTemplate="body">
 *         <tr>
 *             <td data-col-label="Country">{{ row.country }}</td>
 *             <td data-col-label="Year">{{ row.year }}</td>
 *             <td data-col-label="ISO">{{ row.iso }}</td>
 *             <td data-col-label="Population">{{ row.population | number }}</td>
 *             <td data-col-label="Capital city">{{ row.capital }}</td>
 *         </tr>
 *     </ng-template>
 *     <ng-template euiTemplate="footer">
 *         <tr>
 *             <td colspan="5" class="text-right">Table footer</td>
 *         </tr>
 *     </ng-template>
 * </table>
 * ```
 * Typescript logic
 * ```ts
 * data: Country[] = [
 *     { id: 1, country: 'Belgium', year: 1958, iso: 'BE', population: 11198638, capital: 'Brussels' },
 * ]
 *
 * onFilterChange(event: string) {
 *     this.filteredData = this.euiTable.getFilteredData();
 *     this.getTotalPopulation();
 * }
 * ```
 */
declare class EuiTableFilterComponent implements OnInit, OnDestroy {
    /**
     * @description
     * Computes and returns the CSS classes for the component based on its current state.
     *
     * @returns {string} Space-separated string of CSS class names
     */
    get cssClasses(): string;
    /**
     * Placeholder text for the filter input.
     */
    placeholder: string;
    /**
     * Event emitted when the value of the input changes.
     */
    filterChange: EventEmitter<string>;
    filterInput: ElementRef<HTMLInputElement>;
    filter$: BehaviorSubject<string>;
    form: FormGroup<{
        filter: FormControl<string>;
    }>;
    private destroy$;
    ngOnInit(): void;
    ngOnDestroy(): void;
    /**
     * Set the filter value and emit the change event.
     *
     * @param value Value of the input.
     */
    setFilter(value: string): void;
    /**
     * Reset the filter and emit the change event.
     */
    resetFilter(): void;
    static ɵfac: i0.ɵɵFactoryDeclaration<EuiTableFilterComponent, never>;
    static ɵcmp: i0.ɵɵComponentDeclaration<EuiTableFilterComponent, "eui-table-filter", never, { "placeholder": { "alias": "placeholder"; "required": false; }; }, { "filterChange": "filterChange"; }, never, never, true, never>;
}

interface Sort {
    sort: string;
    order: SortOrder;
}
type SortOrder = 'asc' | 'desc' | 'none';

declare enum ScrollinDirection {
    UP = "UP",
    DOWN = "DOWN"
}
/**
 * @description
 * The `eui-table` component has been built to offer various requested features including fast performance and excellent level of control over tabular presentation of data.
 *
 * The eui-table is quite simple of usage and requires :
 *
 *     - rows : the data value input as an array of objects, usually fetched from a service (data payload),
 *     - view : this is the template for the presentation with its various options such as the search filter, the paginator, sortable columns, etc.
 *
 * High-performance data table component with extensive features for tabular data presentation.
 * Supports virtual scrolling for large datasets, pagination, sorting, filtering, and row selection.
 * Provides sticky headers/footers/columns, responsive layouts, and async data loading.
 * Implements customizable templates for headers, body rows, footers, and empty states.
 * Commonly used for data grids, reports, dashboards, and any structured data display requiring advanced table functionality.
 *
 * @usageNotes
 * ### Basic Usage
 * ```html
 * <table euiTable [data]="data" isTableCompact>
 *     <ng-template euiTemplate="header">
 *         <tr>
 *             <th>Country</th>
 *             <th>Year</th>
 *             <th>ISO</th>
 *             <th>Population</th>
 *             <th>Capital city</th>
 *         </tr>
 *     </ng-template>
 *     <ng-template let-row euiTemplate="body">
 *         <tr>
 *             <td>{{ row.country }}</td>
 *             <td>{{ row.year }}</td>
 *             <td>{{ row.iso }}</td>
 *             <td>{{ row.population | number }}</td>
 *             <td>{{ row.capital }}</td>
 *         </tr>
 *     </ng-template>
 *     <ng-template euiTemplate="footer">
 *         <tr>
 *             <td class="eui-u-text-center" colspan="5">Footer</td>
 *         </tr>
 *     </ng-template>
 * </table>
 * ```
 * Typescript logic
 * ```ts
 * data: Country[] = [
 *     { id: 1, country: 'Belgium', year: 1958, iso: 'BE', population: 11198638, capital: 'Brussels' },
 * ]
 * ```
 *
 * ### With Pagination and Selection and template when no data
 * ```html
 * <table euiTable isTableResponsive [data]="data" [paginator]="paginator" (rowsSelect)="onRowsSelect($event)">
 *     <ng-template euiTemplate="header">
 *         <tr [isHeaderSelectable]="hasSelectionFeature">
 *             <th>Country</th>
 *             <th>Year</th>
 *             <th>ISO</th>
 *             <th>Population</th>
 *             <th>Capital city</th>
 *         </tr>
 *     </ng-template>
 *     <ng-template let-row euiTemplate="body">
 *         <tr [isDataSelectable]="row">
 *             <td data-col-label="Country">{{ row.country }}</td>
 *             <td data-col-label="Year">{{ row.year }}</td>
 *             <td data-col-label="ISO">{{ row.iso }}</td>
 *             <td data-col-label="Population">{{ row.population | number }}</td>
 *             <td data-col-label="Capital city">{{ row.capital }}</td>
 *         </tr>
 *     </ng-template>
 *     <ng-template euiTemplate="footer">
 *         <tr>
 *             <td class="eui-u-text-center" colspan="5">Footer</td>
 *         </tr>
 *     </ng-template>
 *     <ng-template let-row euiTemplate="noData">
 *         <tr>
 *             <td class="eui-u-text-center" colspan="5">There are currently no data to display</td>
 *         </tr>
 *     </ng-template>
 * </table>
 * <eui-paginator #paginator [pageSizeOptions]="[5, 10, 25, 50]" [pageSize]="10" (pageChange)="onPageChange($event)" [isHidden]="!hasPagination"></eui-paginator>
 * ```
 * Typescript logic
 * ```ts
 * data: Country[] = [
 *     { id: 1, country: 'Belgium', year: 1958, iso: 'BE', population: 11198638, capital: 'Brussels' },
 * ]
 *
 * onRowsSelect(selected: Country[]): void {
 *     console.log(selected);
 * }
 * ```
 *
 * ### Imports
 *  ```ts
 * import { EUI_TABLE } from '@eui/components/eui-table';
 * import { EuiTemplateDirective } from '@eui/components/directives';
 *
 * imports: [...EUI_TABLE, EuiTemplateDirective]
 * ```
 *
 * ### Accessibility
 * - Use semantic table elements (thead, tbody, tfoot, th, td)
 * - Provide scope="col" or scope="row" on header cells
 * - Use caption element to describe table purpose
 * - Ensure sufficient color contrast for text and borders
 *
 * ### Notes
 * - Virtual scrolling improves performance for large datasets (1000+ rows)
 * - Sticky headers/footers/columns require explicit height on container
 * - Use [isTableCompact]="true" for dense data display
 * - Sortable columns require isSortable directive on th elements
 */
declare class EuiTableComponent<DATA = unknown> implements AfterContentInit, AfterViewInit, OnDestroy, OnInit, OnChanges {
    /**
     * @description
     * Computes and returns the CSS classes for the component based on its current state.
     *
     * @returns {string} Space-separated string of CSS class names
     */
    get cssClasses(): string;
    /**
     * Data to display in the table.
     *
     * @type {DATA[]} Generic type of data
     */
    data: DATA[];
    /**
     * Unicity criteria of the data.
     *
     * @default 'id'
     */
    propId: string;
    /**
     * In combination with `isVirtualScroll`. Row height use by virtual scroll calculation.
     *
     * @default 41
     */
    itemSize: number;
    /**
     * `eui-paginator` reference passed to the table.
     *
     * @type {EuiPaginatorComponent}
     */
    paginator: EuiPaginatorComponent;
    /**
     * `eui-table-filter` reference passed to the table.
     *
     * @type {EuiTableFilterComponent}
     */
    filter: EuiTableFilterComponent;
    /**
     * In combination with `isDataSelectable`. Rows to be selected by default.
     *
     * @type {DATA[]} Set of data to select.
     */
    preselectedRows: DATA[];
    /**
     * Wheter the table uses virtual scroll to display data.
     *
     * `eui-table` selector needs to be used in order to make virtual scroll working properly.
     *
     * @default false
     */
    isVirtualScroll: boolean;
    /**
     * In combination with `isVirtualScroll`. Wheter the table caches the data when scroll.
     * Means that if a scroll level has already loads data, the `scrollChange` event won't be emitted.
     *
     * @default false
     */
    isVirtualScrollCache: boolean;
    /**
     * Wheter the table header is sticky.
     * In order to use eui-table sticky feature and control the scrolling overflow,
     * we recommend to wrap the table with the provided eui-table__scrollable-wrapper class and set your custom table width and/or height.
     *
     * @default false
     */
    hasStickyHeader: boolean;
    /**
     * Wheter the table footer is sticky.
     * In order to use eui-table sticky feature and control the scrolling overflow,
     * we recommend to wrap the table with the provided eui-table__scrollable-wrapper class and set your custom table width and/or height.
     *
     * @default false
     */
    hasStickyFooter: boolean;
    /**
     * Wheter the table col is sticky.
     * In order to use eui-table sticky feature and control the scrolling overflow,
     * we recommend to wrap the table with the provided eui-table__scrollable-wrapper class and set your custom table width and/or height.
     *
     * Only first or latest columns can be sticky.
     *
     * @default false
     */
    hasStickyCols: boolean;
    /**
     * Wheter the table is reponsive.
     *
     * @default false
     */
    isTableResponsive: boolean;
    /**
     * Wheter the table uses async data.
     * In this configuration, pagination, filtering and sorting are managed by the backend.
     *
     * When data are async, paginator and filter must not be bound to the eui-table component like in other sample.
     *
     * @default false
     */
    isAsync: boolean;
    /**
     * In combination with `isVirtualScroll`. Total length of data that are displayed in the table with virtual scroll.
     *
     * @default 0
     */
    virtualScrollAsyncItemsLength: number;
    /**
     * In combination with `isVirtualScroll`. Nb of data items to load in the table.
     *
     * @default 50
     */
    virtualScrollNbRows: number;
    /**
     * Wheter the cols can be reordered.
     *
     * @default false
     */
    isColsOrderable: boolean;
    /**
     * Wheter a loading spinner is displayed in the table.
     *
     * @default false
     */
    isLoading: boolean;
    /**
     * Wheter the 'select all' checkbox in the header will select ONLY items in the current page.
     *
     * If `false`, all items across the pages will be selected.
     *
     * @default true
     */
    isSelectOnlyVisibleRows: boolean;
    /**
     * Whether the table use bordered styles.
     *
     * @default false
     */
    isTableBordered: boolean;
    /**
     * Wheter the table has a fixed layout which forces a table to use fixed column widths, ignoring content size for faster and more predictable layout.
     *
     * @default false
     */
    isTableFixedLayout: boolean;
    /**
     * Whether the table use compact design.
     *
     * @default false
     */
    isTableCompact: boolean;
    protected headerTemplate: TemplateRef<HTMLElement>;
    protected bodyTemplate: TemplateRef<{
        $implicit: DATA;
        index: number;
    }>;
    protected footerTemplate: TemplateRef<HTMLElement>;
    protected noDataTemplate: TemplateRef<HTMLElement>;
    protected captionTemplate: TemplateRef<HTMLElement>;
    protected loading: any[];
    protected nbCols: HTMLTableCellElement[];
    protected dataRendered: DATA[];
    protected cdkVirtualScrollViewportOverflowValue: ('hidden' | 'auto');
    templates: QueryList<EuiTemplateDirective>;
    protected cdkVirtualScrollViewport: CdkVirtualScrollViewport;
    protected cdkVirtualScrollViewportElement: ElementRef;
    theadRef: ElementRef<HTMLElement>;
    tbodyRef: ElementRef<HTMLElement>;
    tfootRef: ElementRef<HTMLElement>;
    /**
     * In combination with `isVirtualScroll`. Event emitted when a scroll is done.
     */
    scrollChange: EventEmitter<any>;
    /**
     * In combination with `isDataSelectable` on a row. Event emitted when the selection changes with an array of data.
     */
    rowsSelect: EventEmitter<DATA[]>;
    /**
     * In combination with `isSortable` on the cols. Event emitted when the sort changes with the property displayed in the col and the order as `ASC` or `DESC`.
     */
    sortChange: EventEmitter<Sort[]>;
    private destroy$;
    private virtualScrollLastMultiple;
    private virtualScrollSpliceFrom;
    private scrolledIndex;
    private nbItemDisplayed;
    private scrollingDirection;
    private mutationObserver;
    private dataSrc;
    private page;
    private pageSize;
    private tableFeaturesHandlerSubscription;
    private filteredData;
    private elementRef;
    private cd;
    private euiTableSelectableRowService;
    private euiTableSortService;
    private baseStatesDirective;
    private renderer;
    ngOnChanges(c: SimpleChanges): void;
    ngOnInit(): void;
    ngAfterContentInit(): void;
    ngAfterViewInit(): void;
    ngOnDestroy(): void;
    /**
     * Moves an element within the rendered data array.
     *
     * @param itemId - The identifier (default: id) of the element to move.
     * @param fromIndex - The current index of the element to move.
     * @param toIndex - The new desired position for the element.
     */
    moveItem(itemId: number | string, fromIndex: number, toIndex: number): void;
    /**
     * Select all rows
     */
    selectAllRows(): void;
    /**
     * Unselect all rows
     */
    unselectAllRows(): void;
    /**
     * Return an array with the data matching the string filter
     * @returns
     */
    getFilteredData(): DATA[];
    /**
     * Sort the table's data.
     *
     * @param sorts An array of SortOrder. See {@link SortOrder}
     */
    setSort(sorts: Sort[]): void;
    /**
     * Filters the table's data based on a string declared in `EuiTableFilterComponent`
     *
     * @param filter String to filter the data
     * @param r Array of data to filter
     * @returns The set of data matching the filter
     */
    filterData(filter: string, r: DATA[]): DATA[];
    /**
     * Get the top position in px of the sticky header.
     */
    protected get stickyHeaderTopPosition(): string;
    /**
     * Get the bottom position in px of the sticky footer.
     */
    protected get stickyFooterBottomPosition(): string;
    /**
     * Get the width in px of the viewport in which the table is.
     */
    protected get cdkVirtualScrollViewportWidth(): string;
    /**
     * Get the width, as a number, of the host element.
     */
    protected get hostWidth(): number;
    protected trackByFn(index: number): number;
    /**
     * Handles table features such as sorting, filtering, and pagination before rendering.
     */
    private tableFeaturesHandler;
    /**
     * Sorts the data based on the sort, property and order, criterias.
     *
     * @param sortCriterias Array of sort criterias containing the property on which the sort will be performed and the order (`ASC` or `DESC`).
     * @param r Array of data to sort
     * @returns A sorted array
     */
    private sortData;
    /**
     * Slices the data array based on the pagination event.
     *
     * @param pagination Object containing the page, the page size and the total number of pages.
     * @param r Array of data to paginate.
     * @returns The sliced array to render.
     */
    private paginateRows;
    /**
     * Round down the index to the nearest multiple of the number of rows.
     *
     * @param index Index of the current scroll level.
     * @param nbRows Number of rows to display.
     * @returns A rounded number.
     */
    private roundDown;
    /**
     * Checks if in the range of data to render some of them had already been loaded or not.
     *
     * @param startIndex Start index of the range to check
     * @param limit Number of item to check after the start index.
     * @param dataRendered Array of data to check
     * @returns The index of the first undefined item in the range or `-1` if not found.
     */
    private hasUndefinedInRange;
    /**
     * Calcultates the position of columns that are sticky.
     */
    private stickyFeatureHandler;
    /**
     * Handles the selection of rows.
     */
    private selectRowsFeatureHandler;
    /**
     * Handles the sorting of columns.
     */
    private sortFeatureHandler;
    /**
     * Get the properties of the object matching the filter string.
     *
     * @param row Row to extract the property from.
     * @param filter String to search in the properties.
     * @returns An array of properties matching the filter.
     */
    private getProps;
    /**
     * Get a property of an object based on the path.
     *
     * @param obj Row to extract the property from.
     * @param prop Path of the property to extract.
     * @returns The value of the property
     */
    private getObjProp;
    static ɵfac: i0.ɵɵFactoryDeclaration<EuiTableComponent<any>, never>;
    static ɵcmp: i0.ɵɵComponentDeclaration<EuiTableComponent<any>, "eui-table, table[euiTable]", never, { "data": { "alias": "data"; "required": false; }; "propId": { "alias": "propId"; "required": false; }; "itemSize": { "alias": "itemSize"; "required": false; }; "paginator": { "alias": "paginator"; "required": false; }; "filter": { "alias": "filter"; "required": false; }; "preselectedRows": { "alias": "preselectedRows"; "required": false; }; "isVirtualScroll": { "alias": "isVirtualScroll"; "required": false; }; "isVirtualScrollCache": { "alias": "isVirtualScrollCache"; "required": false; }; "hasStickyHeader": { "alias": "hasStickyHeader"; "required": false; }; "hasStickyFooter": { "alias": "hasStickyFooter"; "required": false; }; "hasStickyCols": { "alias": "hasStickyCols"; "required": false; }; "isTableResponsive": { "alias": "isTableResponsive"; "required": false; }; "isAsync": { "alias": "isAsync"; "required": false; }; "virtualScrollAsyncItemsLength": { "alias": "virtualScrollAsyncItemsLength"; "required": false; }; "virtualScrollNbRows": { "alias": "virtualScrollNbRows"; "required": false; }; "isColsOrderable": { "alias": "isColsOrderable"; "required": false; }; "isLoading": { "alias": "isLoading"; "required": false; }; "isSelectOnlyVisibleRows": { "alias": "isSelectOnlyVisibleRows"; "required": false; }; "isTableBordered": { "alias": "isTableBordered"; "required": false; }; "isTableFixedLayout": { "alias": "isTableFixedLayout"; "required": false; }; "isTableCompact": { "alias": "isTableCompact"; "required": false; }; }, { "scrollChange": "scrollChange"; "rowsSelect": "rowsSelect"; "sortChange": "sortChange"; }, ["templates"], never, true, [{ directive: typeof i1.BaseStatesDirective; inputs: {}; outputs: {}; }]>;
    static ngAcceptInputType_isVirtualScroll: unknown;
    static ngAcceptInputType_isVirtualScrollCache: unknown;
    static ngAcceptInputType_hasStickyHeader: unknown;
    static ngAcceptInputType_hasStickyFooter: unknown;
    static ngAcceptInputType_hasStickyCols: unknown;
    static ngAcceptInputType_isTableResponsive: unknown;
    static ngAcceptInputType_isAsync: unknown;
    static ngAcceptInputType_virtualScrollAsyncItemsLength: unknown;
    static ngAcceptInputType_virtualScrollNbRows: unknown;
    static ngAcceptInputType_isColsOrderable: unknown;
    static ngAcceptInputType_isLoading: unknown;
    static ngAcceptInputType_isSelectOnlyVisibleRows: unknown;
    static ngAcceptInputType_isTableBordered: unknown;
    static ngAcceptInputType_isTableFixedLayout: unknown;
    static ngAcceptInputType_isTableCompact: unknown;
}

/**
 * @description
 * Component used internally by `eui-table` to add a 'select all' checkbox in the header of the table.
 *
 * @usageNotes
 * ### Basic Usage
 * ```html
 * <table euiTable [data]="data" (rowsSelect)="onRowsSelect($event)">
 *     <ng-template euiTemplate="header">
 *         <tr isHeaderSelectable>
 *             <th>Country</th>
 *             <th>Year</th>
 *             <th>ISO</th>
 *             <th>Population</th>
 *             <th>Capital city</th>
 *         </tr>
 *     </ng-template>
 *     <ng-template let-row euiTemplate="body">
 *         <tr [isDataSelectable]="row">
 *             <td data-col-label="Country">{{ row.country }}</td>
 *             <td data-col-label="Year">{{ row.year }}</td>
 *             <td data-col-label="ISO">{{ row.iso }}</td>
 *             <td data-col-label="Population">{{ row.population | number }}</td>
 *             <td data-col-label="Capital city">{{ row.capital }}</td>
 *         </tr>
 *     </ng-template>
 * </table>
 * ```
 * Typescript logic
 * ```ts
 * data: Country[] = [
 *     { id: 1, country: 'Belgium', year: 1958, iso: 'BE', population: 11198638, capital: 'Brussels' },
 * ]
 *
 * onRowsSelect(selected: Country[]): void {
 *     console.log(selected);
 * }
 * ```
 */
declare class EuiTableSelectableHeaderComponent<DATA> implements OnInit, OnDestroy {
    /**
     * Whether select all features are available in the header.
     *
     * @default false
     */
    isHeaderSelectable: boolean;
    isCheckedIndeterminate: boolean;
    isChecked: boolean;
    private destroy$;
    private euiDataTableSelectableRowService;
    ngOnInit(): void;
    ngOnDestroy(): void;
    /**
     * Gets the `aria-label` attribute for the checkbox element.
     *
     * @default `Unchecked`
     */
    get ariaLabel(): string;
    /**
     * Handle the change of the selected status.
     *
     * @param e Change Event
     */
    toggleCheckedState(e: Event): void;
    static ɵfac: i0.ɵɵFactoryDeclaration<EuiTableSelectableHeaderComponent<any>, never>;
    static ɵcmp: i0.ɵɵComponentDeclaration<EuiTableSelectableHeaderComponent<any>, "tr[isHeaderSelectable]", never, { "isHeaderSelectable": { "alias": "isHeaderSelectable"; "required": false; }; }, {}, never, ["*"], true, never>;
    static ngAcceptInputType_isHeaderSelectable: unknown;
}

/**
 * @description
 * Component used internally by `eui-table` to make a row selectable.
 *
 * @usageNotes
 * ### Basic Usage
 * ```html
 * <table euiTable [data]="data" (rowsSelect)="onRowsSelect($event)">
 *     <ng-template euiTemplate="header">
 *         <tr isHeaderSelectable>
 *             <th>Country</th>
 *             <th>Year</th>
 *             <th>ISO</th>
 *             <th>Population</th>
 *             <th>Capital city</th>
 *         </tr>
 *     </ng-template>
 *     <ng-template let-row euiTemplate="body">
 *         <tr [isDataSelectable]="row">
 *             <td data-col-label="Country">{{ row.country }}</td>
 *             <td data-col-label="Year">{{ row.year }}</td>
 *             <td data-col-label="ISO">{{ row.iso }}</td>
 *             <td data-col-label="Population">{{ row.population | number }}</td>
 *             <td data-col-label="Capital city">{{ row.capital }}</td>
 *         </tr>
 *     </ng-template>
 * </table>
 * ```
 * Typescript logic
 * ```ts
 * data: Country[] = [
 *     { id: 1, country: 'Belgium', year: 1958, iso: 'BE', population: 11198638, capital: 'Brussels' },
 * ]
 *
 * onRowsSelect(selected: Country[]): void {
 *     console.log(selected);
 * }
 * ```
 */
declare class EuiTableSelectableRowComponent<DATA> implements OnInit, OnDestroy, OnChanges {
    /**
     * Data of the row.
     */
    isDataSelectable: DATA;
    /**
     * Wheter only one row is selectable.
     *
     * @default false
     */
    isSingleSelectable: boolean;
    /**
     * Wheter the row is selected.
     *
     * @default false
     */
    isChecked: boolean;
    /**
     * Wheter the selection can be done with the keyboard.
     *
     * @default false
     */
    isKeyboardSelectable: boolean;
    private propId;
    private destroy$;
    /**
     * @description
     * Computes and returns the CSS classes for the component based on its current state.
     *
     * @returns {string} Space-separated string of CSS class names
     */
    get cssClasses(): string;
    private euiDataTableSelectableRowService;
    private elementRef;
    ngOnChanges(c: SimpleChanges): void;
    ngOnInit(): void;
    ngOnDestroy(): void;
    /**
     * Handle the change of the selected status.
     *
     * @param e Change Event
     */
    toggleCheckedState(e: Event): void;
    static ɵfac: i0.ɵɵFactoryDeclaration<EuiTableSelectableRowComponent<any>, never>;
    static ɵcmp: i0.ɵɵComponentDeclaration<EuiTableSelectableRowComponent<any>, "tr[isDataSelectable]", never, { "isDataSelectable": { "alias": "isDataSelectable"; "required": false; }; "isSingleSelectable": { "alias": "isSingleSelectable"; "required": false; }; "isChecked": { "alias": "isChecked"; "required": false; }; "isKeyboardSelectable": { "alias": "isKeyboardSelectable"; "required": false; }; }, {}, never, ["*"], true, never>;
    static ngAcceptInputType_isSingleSelectable: unknown;
    static ngAcceptInputType_isChecked: unknown;
    static ngAcceptInputType_isKeyboardSelectable: unknown;
}

/**
 * @description
 * Directive used to activate the sticky feature on a column of the table.
 *
 * @usageNotes
 * ### Basic Usage
 * ```html
 * <div class="eui-table__scrollable-wrapper" style="width: 800px; height: 600px; overflow: auto" tabindex="0">
 *     <table euiTable hasStickyHeader hasStickyFooter hasStickyCols [data]="data" style="width: 1400px">
 *         <ng-template euiTemplate="header">
 *             <tr>
 *                 <th isStickyCol>Country</th>
 *                 <th>Year</th>
 *                 <th>ISO</th>
 *                 <th>Population</th>
 *                 <th>Capital city</th>
 *             </tr>
 *         </ng-template>
 *         <ng-template let-row euiTemplate="body">
 *             <tr>
 *                 <td isStickyCol>{{ row.country }}</td>
 *                 <td>{{ row.year }}</td>
 *                 <td>{{ row.iso }}</td>
 *                 <td>{{ row.population | number }}</td>
 *                 <td>{{ row.capital }}</td>
 *             </tr>
 *         </ng-template>
 *         <ng-template euiTemplate="footer">
 *             <tr>
 *                 <td isStickyCol class="eui-u-text-center">Footer</td>
 *                 <td class="eui-u-text-center">Footer</td>
 *                 <td class="eui-u-text-center">Footer</td>
 *                 <td class="eui-u-text-center">Footer</td>
 *                 <td class="eui-u-text-center">Footer</td>
 *             </tr>
 *         </ng-template>
 *     </table>
 * </div>
 * ```
 * Typescript logic
 * ```ts
 * data: Country[] = [
 *     { id: 1, country: 'Belgium', year: 1958, iso: 'BE', population: 11198638, capital: 'Brussels' },
 * ]
 * ```
 */
declare class EuiTableStickyColDirective {
    class: string;
    static ɵfac: i0.ɵɵFactoryDeclaration<EuiTableStickyColDirective, never>;
    static ɵdir: i0.ɵɵDirectiveDeclaration<EuiTableStickyColDirective, "th[isStickyCol], td[isStickyCol]", never, {}, {}, never, never, true, never>;
}

/**
 * @description
 * Pipe used to highlight the matching string in the data of the table when used with filter feature.
 *
 * @example
 * ```
 * <td><span [innerHTML]="row.year | euiTableHighlight: strFilter"></span></td>
 *
 * strFilter = '19'
 * ```
 */
declare class EuiTableHighlightPipe implements PipeTransform {
    /**
     * Wrap a matching string with a span element with a class name in the data of the table
     *
     * @param value Data displayed in a cell.
     * @param strFilter Search string to highlight.
     * @param className CSS class to add to the span element. Default: 'eui-u-text-search'
     * @returns
     */
    transform(value: string, strFilter: string, className?: string): string;
    static ɵfac: i0.ɵɵFactoryDeclaration<EuiTableHighlightPipe, never>;
    static ɵpipe: i0.ɵɵPipeDeclaration<EuiTableHighlightPipe, "euiTableHighlight", true>;
}

/**
 * @description
 * Component used internally by `eui-table` to make a column sortable.
 *
 * @usageNotes
 * ### Basic Usage
 * ```html
 * <table euiTable [data]="data" (sortChange)="onSortChange($event)">
 *     <ng-template euiTemplate="header">
 *         <tr>
 *             <th isSortable sortOn="id">Id</th>
 *             <th isSortable sortOn="country">Country</th>
 *             <th isSortable sortOn="year">Year</th>
 *             <th isSortable sortOn="iso">ISO</th>
 *             <th isSortable sortOn="population">Population</th>
 *             <th isSortable sortOn="capital">Capital city</th>
 *         </tr>
 *     </ng-template>
 *     <ng-template let-row euiTemplate="body">
 *         <tr>
 *             <td data-col-label="Id"><span euiBadge>{{ row.id }}</span></td>
 *             <td data-col-label="Country">{{ row.country }}</td>
 *             <td data-col-label="Year">{{ row.year }}</td>
 *             <td data-col-label="ISO">{{ row.iso }}</td>
 *             <td data-col-label="Population">{{ row.population | number }}</td>
 *             <td data-col-label="Capital city">{{ row.capital }}</td>
 *         </tr>
 *     </ng-template>
 *     <ng-template euiTemplate="footer">
 *         <tr>
 *             <td class="eui-u-text-center" colspan="6">Footer</td>
 *         </tr>
 *     </ng-template>
 * </table>
 * ```
 * Typescript logic
 * ```ts
 * data: Country[] = [
 *     { id: 1, country: 'Belgium', year: 1958, iso: 'BE', population: 11198638, capital: 'Brussels' },
 * ]
 *
 * onSortChange(e: Sort[]) {
 *     console.log(e);
 * }
 * ```
 */
declare class EuiTableSortableColComponent implements OnInit, OnDestroy {
    /**
     * @description
     * Computes and returns the CSS classes for the component based on its current state.
     *
     * @returns {string} Space-separated string of CSS class names
     */
    get cssClasses(): string;
    /**
     * @description
     * Returns the aria-sort value based on current sort order for accessibility.
     *
     * @returns {string} ARIA sort state: 'ascending', 'descending', or 'none'
     */
    get ariaSort(): 'ascending' | 'descending' | 'none';
    sortOn: i0.InputSignal<string>;
    sortOrder: i0.InputSignal<SortOrder>;
    /**
     * Whether the column is sorted by default.
     *
     * @default false
     */
    defaultOrder: boolean;
    /**
     * Whether the sort is disabled on the column.
     *
     * @default false
     */
    sortDisabled: boolean;
    /**
     * Whether the sorting of the column can be cumulated with the one of other column.
     *
     * @default false
     */
    isMultiSortable: boolean;
    order: SortOrder;
    isSorted: boolean;
    sortedIndex: number;
    euiDropdown: EuiDropdownComponent;
    private destroy$;
    private euiTableSortService;
    ngOnInit(): void;
    ngOnDestroy(): void;
    /**
     * Handles the click event on the sortable column.
     */
    changeSort(): void;
    /**
     * Handles the click event on the dropdown item when the column is multi-sortable.
     * @param order An array of SortOrder. See {@link SortOrder}
     */
    onDropdownItemClick(order: SortOrder): void;
    static ɵfac: i0.ɵɵFactoryDeclaration<EuiTableSortableColComponent, never>;
    static ɵcmp: i0.ɵɵComponentDeclaration<EuiTableSortableColComponent, "th[isSortable]", never, { "sortOn": { "alias": "sortOn"; "required": false; "isSignal": true; }; "sortOrder": { "alias": "sortOrder"; "required": false; "isSignal": true; }; "defaultOrder": { "alias": "defaultOrder"; "required": false; }; "sortDisabled": { "alias": "sortDisabled"; "required": false; }; "isMultiSortable": { "alias": "isMultiSortable"; "required": false; }; }, {}, never, ["*"], true, never>;
    static ngAcceptInputType_defaultOrder: unknown;
    static ngAcceptInputType_sortDisabled: unknown;
    static ngAcceptInputType_isMultiSortable: unknown;
}

/**
 * @description
 * Directive used to activate the expandable feature on a row of the table.
 *
 * @usageNotes
 * ### Basic Usage
 * ```html
 * <table euiTable [data]="data">
 *     <ng-template euiTemplate="header">
 *         <tr>
 *             <th aria-hidden="true"></th>
 *             <th>Country</th>
 *             <th>Year</th>
 *             <th>ISO</th>
 *             <th>Population</th>
 *             <th>Capital city</th>
 *         </tr>
 *     </ng-template>
 *     <ng-template let-row euiTemplate="body">
 *         <tr>
 *             <td data-col-label="Click to expand/collapse">
 *                 <eui-icon-button
 *                     size="s"
 *                     [icon]="!row.expanded ? 'eui-chevron-right' : 'eui-chevron-down'"
 *                     [aria-label]="row.expanded ? 'Collapse row for ' + row.country : 'Expand row for ' + row.country"
 *                     (click)="row.expanded = !row.expanded;" />
 *             </td>
 *             <td data-col-label="Country">{{ row.country }}</td>
 *             <td data-col-label="Year">{{ row.year }}</td>
 *             <td data-col-label="ISO">{{ row.iso }}</td>
 *             <td data-col-label="Population">{{ row.population | number }}</td>
 *             <td data-col-label="Capital city">{{ row.capital }}</td>
 *         </tr>
 *         \@if(row.expanded) {
 *             <tr isExpandableRow>
 *                 <td colspan="6" class="p-3">
 *                     <h4 class="eui-u-text-h4">Expanded row content for {{ row.country }}</h4>
 *                     <div class="row">
 *                         <div class="col-md-3">
 *                             <span class="eui-flag-icon eui-flag-icon-{{ row.iso.toLowerCase() }} eui-flag-icon-5x"></span>
 *                         </div>
 *                         <div class="col-md-9">
 *                             <span>Capital city : <strong>{{ row.capital }}</strong></span><br>
 *                             <span>Population : <strong>{{ row.population | number }}</strong></span><br>
 *                             <span>Year : <strong>{{ row.year }}</strong></span><br>
 *                         </div>
 *                     </div>
 *                 </td>
 *             </tr>
 *         }
 *     </ng-template>
 * </table>
 * ```
 * Typescript logic
 * ```ts
 * data: Country[] = [
 *     { id: 1, country: 'Belgium', year: 1958, iso: 'BE', population: 11198638, capital: 'Brussels' },
 * ]
 * ```
 */
declare class EuiTableExpandableRowDirective implements OnInit {
    string: string;
    private animationPlayer;
    get isOpen(): boolean;
    private el;
    private animationBuilder;
    ngOnInit(): void;
    static ɵfac: i0.ɵɵFactoryDeclaration<EuiTableExpandableRowDirective, never>;
    static ɵdir: i0.ɵɵDirectiveDeclaration<EuiTableExpandableRowDirective, "tr[isExpandableRow]", never, {}, {}, never, never, true, never>;
}

declare const EUI_TABLE: readonly [typeof EuiTableComponent, typeof EuiTableSelectableHeaderComponent, typeof EuiTableSelectableRowComponent, typeof EuiTableStickyColDirective, typeof EuiTableFilterComponent, typeof EuiTableHighlightPipe, typeof EuiTableSortableColComponent, typeof EuiTableExpandableRowDirective, typeof EuiTemplateDirective];

export { EUI_TABLE, EuiTableComponent, EuiTableExpandableRowDirective, EuiTableFilterComponent, EuiTableHighlightPipe, EuiTableSelectableHeaderComponent, EuiTableSelectableRowComponent, EuiTableSortableColComponent, EuiTableStickyColDirective, ScrollinDirection };
export type { Sort, SortOrder };
//# sourceMappingURL=eui-components-eui-table.d.ts.map