/**
 *
 * carbon-angular v0.0.0 | table.component.js
 *
 * Copyright 2014, 2020 IBM
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *   http://www.apache.org/licenses/LICENSE-2.0

 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */


import { Component, ApplicationRef, Input, Output, EventEmitter, ElementRef, TemplateRef, HostBinding } from "@angular/core";
import { Subscription, fromEvent } from "rxjs";
import { TableModel } from "./table-model.class";
import { TableHeaderItem } from "./table-header-item.class";
import { TableItem } from "./table-item.class";
import { getFocusElementList, tabbableSelectorIgnoreTabIndex } from "../common/tab.service";
import { I18n } from "./../i18n/i18n.module";
import { merge } from "./../utils/object";
import { DataGridInteractionModel } from "./data-grid-interaction-model.class";
import { TableDomAdapter } from "./table-adapter.class";
/**
 * Build your table with this component by extending things that differ from default.
 *
 * [See demo](../../?path=/story/table--basic)
 *
 * Instead of the usual write-your-own-html approach you had with `<table>`,
 * carbon table uses model-view-controller approach.
 *
 * Here, you create a view (with built-in controller) and provide it a model.
 * Changes you make to the model are reflected in the view. Provide same model you use
 * in the table to the `<ibm-pagination>` components.
 * They provide a different view over the same data.
 *
 * ## Basic usage
 *
 * ```html
 * <ibm-table [model]="model"></ibm-table>
 * ```
 *
 * ```typescript
 * public model = new TableModel();
 *
 * this.model.data = [
 * 	[new TableItem({data: "asdf"}), new TableItem({data: "qwer"})],
 * 	[new TableItem({data: "csdf"}), new TableItem({data: "zwer"})],
 * 	[new TableItem({data: "bsdf"}), new TableItem({data: "swer"})],
 * 	[new TableItem({data: "csdf"}), new TableItem({data: "twer"})]
 * ];
 * ```
 *
 * ## Customization
 *
 * If you have custom data in your table, you need a way to display it. You can do that
 * by providing a template to `TableItem`.
 *
 * ```html
 * <ng-template #customTableItemTemplate let-data="data">
 * 	<a [routerLink]="data.link">{{data.name}} {{data.surname}}</a>
 * </ng-template>
 * ```
 *
 * ```typescript
 * customTableItemTemplate: TemplateRef<any>;
 *
 * this.customModel.data = [
 * 	[new TableItem({data: "asdf"}), new TableItem({data: {name: "Lessy", link: "/table"}, template: this.customTableItemTemplate})],
 * 	[new TableItem({data: "csdf"}), new TableItem({data: "swer"})],
 * 	[new TableItem({data: "bsdf"}), new TableItem({data: {name: "Alice", surname: "Bob"}, template: this.customTableItemTemplate})],
 * 	[new TableItem({data: "csdf"}), new TableItem({data: "twer"})],
 * ];
 * ```
 *
 * ### Sorting and filtering
 *
 * In case you need custom sorting and/or filtering you should subclass `TableHeaderItem`
 * and override needed functions.
 *
 * ```typescript
 * class FilterableHeaderItem extends TableHeaderItem {
 * 	// custom filter function
 * 	filter(item: TableItem): boolean {
 * 		if (typeof item.data === "string" && item.data.toLowerCase().indexOf(this.filterData.data.toLowerCase()) >= 0 ||
 * 		item.data.name && item.data.name.toLowerCase().indexOf(this.filterData.data.toLowerCase()) >= 0 ||
 * 		item.data.surname && item.data.surname.toLowerCase().indexOf(this.filterData.data.toLowerCase()) >= 0) {
 * 			return false;
 * 		}
 * 		return true;
 * 	}
 *
 * 	set filterCount(n) {}
 * 	get filterCount() {
 * 		return (this.filterData && this.filterData.data && this.filterData.data.length > 0) ? 1 : 0;
 * 	}
 *
 * 	// used for custom sorting
 * 	compare(one: TableItem, two: TableItem) {
 * 		const stringOne = (one.data.name || one.data.surname || one.data).toLowerCase();
 * 		const stringTwo = (two.data.name || two.data.surname || two.data).toLowerCase();
 *
 * 		if (stringOne > stringTwo) {
 * 			return 1;
 * 		} else if (stringOne < stringTwo) {
 * 			return -1;
 * 		} else {
 * 			return 0;
 * 		}
 * 	}
 * }
 * ```
 *
 * See `TableHeaderItem` class for more information.
 *
 * ## No data template
 *
 * When table has no data to show, it can show a message you provide it instead.
 *
 * ```html
 * <ibm-table [model]="model">No data.</ibm-table>
 * ```
 *
 * ... will show `No data.` message, but you can get creative and provide any template you want
 * to replace table's default `tbody`.
 *
 * ## Use pagination as table footer
 *
 * ```html
 * <ibm-pagination [model]="model" (selectPage)="selectPage($event)"></ibm-pagination>
 * ```
 *
 * `selectPage()` function should fetch the data from backend, create new `data`, apply it to `model.data`,
 * and update `model.currentPage`.
 *
 * If the data your server returns is a two dimensional array of objects, it would look something like this:
 *
 * ```typescript
 * selectPage(page) {
 * 	this.getPage(page).then((data: Array<Array<any>>) => {
 * 		// set the data and update page
 * 		this.model.data = this.prepareData(data);
 * 		this.model.currentPage = page;
 * 	});
 * }
 *
 * protected prepareData(data: Array<Array<any>>) {
 * 	// create new data from the service data
 * 	let newData = [];
 * 	data.forEach(dataRow => {
 * 		let row = [];
 * 		dataRow.forEach(dataElement => {
 * 			row.push(new TableItem({
 * 				data: dataElement,
 * 				template: typeof dataElement === "string" ? undefined : this.paginationTableItemTemplate
 * 				// your template can handle all the data types so you don't have to conditionally set it
 * 				// you can also set different templates for different columns based on index
 * 			}));
 * 		});
 * 		newData.push(row);
 * 	});
 * 	return newData;
 * }
 * ```
 *
 * <example-url>../../iframe.html?id=table--basic</example-url>
 */
var Table = /** @class */ (function () {
    /**
     * Creates an instance of Table.
     */
    function Table(elementRef, applicationRef, i18n) {
        this.elementRef = elementRef;
        this.applicationRef = applicationRef;
        this.i18n = i18n;
        /**
         * Size of the table rows.
         */
        this.size = "md";
        /**
         * Set to `true` for a loading table.
         */
        this.skeleton = false;
        /**
         * Setting sortable to false will disable all headers including headers which are sortable. Is is
         * possible to set the sortable state on the header item to disable/enable sorting for only some headers.
         */
        this.sortable = true;
        this.noBorder = true;
        /**
         * Controls whether to show the selection checkboxes column or not.
         */
        this.showSelectionColumn = true;
        /**
         * Controls whether to enable multiple or single row selection.
         */
        this.enableSingleSelect = false;
        /**
         * Distance (in px) from the bottom that view has to reach before
         * `scrollLoad` event is emitted.
         */
        this.scrollLoadDistance = 0;
        /**
         * Set to `true` to enable users to resize columns.
         *
         * Works for columns with width set in pixels.
         *
         */
        this.columnsResizable = false;
        /**
         * Set to `true` to enable users to drag and drop columns.
         *
         * Changing the column order in table changes table model. Be aware of it when you add additional data
         * to the model.
         *
         */
        this.columnsDraggable = false;
        /**
         * Set to `false` to remove table rows (zebra) stripes.
         */
        this.striped = true;
        /**
         * Set to `true` to stick the header to the top of the table
         */
        this.stickyHeader = false;
        /**
         * Emits an index of the column that wants to be sorted.
         *
         */
        this.sort = new EventEmitter();
        /**
         * Emits if all rows are selected.
         *
         * @param model
         */
        this.selectAll = new EventEmitter();
        /**
         * Emits if all rows are deselected.
         *
         * @param model
         */
        this.deselectAll = new EventEmitter();
        /**
         * Emits if a single row is selected.
         *
         * @param ({model: this.model, selectedRowIndex: index})
         */
        this.selectRow = new EventEmitter();
        /**
         * Emits if a single row is deselected.
         *
         * @param ({model: this.model, deselectedRowIndex: index})
         */
        this.deselectRow = new EventEmitter();
        /**
         * Emits if a row item excluding expandButtons, checkboxes, or radios is clicked.
         */
        this.rowClick = new EventEmitter();
        /**
         * Emits when table requires more data to be loaded.
         */
        this.scrollLoad = new EventEmitter();
        /**
         * Controls if all checkboxes are viewed as selected.
         */
        this.selectAllCheckbox = false;
        /**
         * Controls the indeterminate state of the header checkbox.
         */
        this.selectAllCheckboxSomeSelected = false;
        this.isColumnDragging = false;
        this.columnDraggedHoverIndex = -1;
        this.columnDraggedPosition = "";
        this._isDataGrid = false;
        // flag to prevent getters/setters from querying the view before it's fully instantiated
        this.isViewReady = false;
        this.subscriptions = new Subscription();
        this._expandButtonAriaLabel = this.i18n.getOverridable("TABLE.EXPAND_BUTTON");
        this._sortDescendingLabel = this.i18n.getOverridable("TABLE.SORT_DESCENDING");
        this._sortAscendingLabel = this.i18n.getOverridable("TABLE.SORT_ASCENDING");
        this._checkboxHeaderLabel = this.i18n.getOverridable("TABLE.CHECKBOX_HEADER");
        this._checkboxRowLabel = this.i18n.getOverridable("TABLE.CHECKBOX_ROW");
        this._endOfDataText = this.i18n.getOverridable("TABLE.END_OF_DATA");
        this._scrollTopText = this.i18n.getOverridable("TABLE.SCROLL_TOP");
        this._filterTitle = this.i18n.getOverridable("TABLE.FILTER");
    }
    /**
     * Creates a skeleton model with a row and column count specified by the user
     *
     * Example:
     *
     * ```typescript
     * this.model = Table.skeletonModel(5, 5);
     * ```
     */
    Table.skeletonModel = function (rowCount, columnCount) {
        var model = new TableModel();
        var header = new Array();
        var data = new Array();
        var row = new Array();
        for (var i = 0; i < columnCount; i++) {
            header.push(new TableHeaderItem());
            row.push(new TableItem());
        }
        for (var i = 0; i < rowCount - 1; i++) {
            data.push(row);
        }
        model.header = header;
        model.data = data;
        return model;
    };
    Table.setTabIndex = function (element, index) {
        var focusElementList = getFocusElementList(element, tabbableSelectorIgnoreTabIndex);
        if (element.firstElementChild && element.firstElementChild.classList.contains("bx--table-sort")) {
            focusElementList[1].tabIndex = index;
        }
        else if (focusElementList.length > 0) {
            focusElementList[0].tabIndex = index;
        }
        else {
            element.tabIndex = index;
        }
    };
    Table.focus = function (element) {
        var focusElementList = getFocusElementList(element, tabbableSelectorIgnoreTabIndex);
        if (element.firstElementChild && element.firstElementChild.classList.contains("bx--table-sort")) {
            focusElementList[1].focus();
        }
        else if (focusElementList.length > 0) {
            focusElementList[0].focus();
        }
        else {
            element.focus();
        }
    };
    Object.defineProperty(Table.prototype, "model", {
        get: function () {
            return this._model;
        },
        /**
         * `TableModel` with data the table is to display.
         */
        set: function (m) {
            var _this = this;
            if (this._model) {
                this.subscriptions.unsubscribe();
            }
            this._model = m;
            var rowsChange = this._model.rowsSelectedChange.subscribe(function () { return _this.updateSelectAllCheckbox(); });
            var dataChange = this._model.dataChange.subscribe(function () {
                if (_this.isDataGrid) {
                    _this.resetTabIndex();
                }
                _this.updateSelectAllCheckbox();
            });
            this.subscriptions.add(rowsChange);
            this.subscriptions.add(dataChange);
            if (this.isDataGrid) {
                var expandedChange = this._model.rowsExpandedChange.subscribe(function () {
                    // Allows the expanded row to have a focus state when it exists in the DOM
                    setTimeout(function () {
                        var expandedRows = _this.elementRef.nativeElement.querySelectorAll(".bx--expandable-row:not(.bx--parent-row)");
                        Array.from(expandedRows).forEach(function (row) {
                            if (row.firstElementChild.tabIndex === undefined || row.firstElementChild.tabIndex !== -1) {
                                row.firstElementChild.tabIndex = -1;
                            }
                        });
                    });
                });
                this.subscriptions.add(expandedChange);
            }
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(Table.prototype, "isDataGrid", {
        get: function () {
            return this._isDataGrid;
        },
        /**
         * Set to `true` for a data grid with keyboard interactions.
         */
        set: function (value) {
            this._isDataGrid = value;
            if (this.isViewReady) {
                if (value) {
                    this.enableDataGridInteractions();
                }
                else {
                    this.disableDataGridInteractions();
                }
            }
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(Table.prototype, "enableRowSelect", {
        get: function () {
            return this.showSelectionColumn;
        },
        /**
         * Controls whether to show the selection checkboxes column or not.
         *
         * @deprecated in the next major carbon-components-angular version in favor of
         * `showSelectionColumn` because of new attribute `enableSingleSelect`
         *  please use `showSelectionColumn` instead
         */
        set: function (value) {
            this.showSelectionColumn = value;
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(Table.prototype, "expandButtonAriaLabel", {
        get: function () {
            return this._expandButtonAriaLabel.value;
        },
        set: function (value) {
            this._expandButtonAriaLabel.override(value);
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(Table.prototype, "sortDescendingLabel", {
        get: function () {
            return this._sortDescendingLabel.value;
        },
        set: function (value) {
            this._sortDescendingLabel.override(value);
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(Table.prototype, "sortAscendingLabel", {
        get: function () {
            return this._sortAscendingLabel.value;
        },
        set: function (value) {
            this._sortAscendingLabel.override(value);
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(Table.prototype, "translations", {
        /**
         * Expects an object that contains some or all of:
         * ```
         * {
         *		"FILTER": "Filter",
         *		"END_OF_DATA": "You've reached the end of your content",
         *		"SCROLL_TOP": "Scroll to top",
         *		"CHECKBOX_HEADER": "Select all rows",
         *		"CHECKBOX_ROW": "Select row"
         * }
         * ```
         */
        set: function (value) {
            var valueWithDefaults = merge(this.i18n.getMultiple("TABLE"), value);
            this._filterTitle.override(valueWithDefaults.FILTER);
            this._endOfDataText.override(valueWithDefaults.END_OF_DATA);
            this._scrollTopText.override(valueWithDefaults.SCROLL_TOP);
            this._checkboxHeaderLabel.override(valueWithDefaults.CHECKBOX_HEADER);
            this._checkboxRowLabel.override(valueWithDefaults.CHECKBOX_ROW);
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(Table.prototype, "noData", {
        get: function () {
            return !this.model.data ||
                this.model.data.length === 0 ||
                this.model.data.length === 1 && this.model.data[0].length === 0;
        },
        enumerable: true,
        configurable: true
    });
    Table.prototype.ngAfterViewInit = function () {
        this.isViewReady = true;
        if (this.isDataGrid) {
            this.enableDataGridInteractions();
        }
    };
    Table.prototype.ngOnDestroy = function () {
        this.subscriptions.unsubscribe();
        if (this.positionSubscription) {
            this.positionSubscription.unsubscribe();
        }
    };
    Table.prototype.enableDataGridInteractions = function () {
        // if we have an `interactioModel` we've already enabled datagrid
        if (this.interactionModel) {
            return;
        }
        var table = this.elementRef.nativeElement.querySelector("table");
        var tableAdapter = new TableDomAdapter(table);
        var keydownEventStream = fromEvent(table, "keydown");
        var clickEventStream = fromEvent(table, "click");
        this.interactionModel = new DataGridInteractionModel(keydownEventStream, clickEventStream, tableAdapter);
        this.positionSubscription = this.interactionModel.position.subscribe(function (event) {
            var _a = event.current, currentRow = _a[0], currentColumn = _a[1];
            var _b = event.previous, previousRow = _b[0], previousColumn = _b[1];
            var currentElement = tableAdapter.getCell(currentRow, currentColumn);
            Table.setTabIndex(currentElement, 0);
            // if the model has just initialized don't focus or reset anything
            if (previousRow === -1 || previousColumn === -1) {
                return;
            }
            var previousElement = tableAdapter.getCell(previousRow, previousColumn);
            Table.setTabIndex(previousElement, -1);
            Table.focus(currentElement);
        });
        // call this after assigning `this.interactionModel` since it depends on it
        this.resetTabIndex();
    };
    Table.prototype.disableDataGridInteractions = function () {
        // unsubscribe first so we don't cause the focus to fly around
        if (this.positionSubscription) {
            this.positionSubscription.unsubscribe();
        }
        // undo tab indexing (also resets the model)
        this.resetTabIndex(0);
        // null out the model ref
        this.interactionModel = null;
    };
    Table.prototype.onSelectAll = function () {
        this.model.selectAll(true);
        this.selectAll.emit(this.model);
    };
    Table.prototype.onDeselectAll = function () {
        this.model.selectAll(false);
        this.deselectAll.emit(this.model);
    };
    Table.prototype.onSelectRow = function (event) {
        // check for the existence of the selectedRowIndex property
        if (Object.keys(event).includes("selectedRowIndex")) {
            this.model.selectRow(event.selectedRowIndex, true);
            this.selectRow.emit(event);
            if (this.showSelectionColumn && this.enableSingleSelect) {
                var index = event.selectedRowIndex;
                this.model.selectAll(false);
                this.model.selectRow(index);
            }
        }
        else {
            this.model.selectRow(event.deselectedRowIndex, false);
            this.deselectRow.emit(event);
        }
    };
    Table.prototype.onRowClick = function (index) {
        this.rowClick.emit(index);
    };
    Table.prototype.updateSelectAllCheckbox = function () {
        var selectedRowsCount = this.model.selectedRowsCount();
        if (selectedRowsCount <= 0) {
            // reset select all checkbox if nothing selected
            this.selectAllCheckbox = false;
            this.selectAllCheckboxSomeSelected = false;
        }
        else if (selectedRowsCount < this.model.data.length) {
            this.selectAllCheckbox = false;
            this.selectAllCheckboxSomeSelected = true;
        }
        else {
            this.selectAllCheckbox = true;
            this.selectAllCheckboxSomeSelected = false;
        }
    };
    Table.prototype.resetTabIndex = function (newTabIndex) {
        var _this = this;
        if (newTabIndex === void 0) { newTabIndex = -1; }
        // ensure the view is ready for the reset before we preform the actual reset
        setTimeout(function () {
            // reset all the tabIndexes we can find
            var focusElementList = getFocusElementList(_this.elementRef.nativeElement, tabbableSelectorIgnoreTabIndex);
            if (focusElementList) {
                focusElementList.forEach(function (tabbable) {
                    tabbable.tabIndex = newTabIndex;
                });
            }
            // reset interaction model positions and tabIndexes
            if (_this.interactionModel) {
                _this.interactionModel.resetTabIndexes(newTabIndex);
            }
        });
    };
    Table.prototype.columnResizeStart = function (event, column) {
        var _this = this;
        this.columnResizeWidth = parseInt(column.style.width, 10);
        this.columnResizeMouseX = event.clientX;
        event.preventDefault();
        this.mouseMoveSubscription = fromEvent(document.body, "mousemove").subscribe(function (event) {
            _this.columnResizeProgress(event, column);
        });
        this.mouseUpSubscription = fromEvent(document.body, "mouseup").subscribe(function (event) {
            _this.columnResizeEnd(event, column);
        });
    };
    Table.prototype.columnResizeProgress = function (event, column) {
        var move = event.clientX - this.columnResizeMouseX;
        column.style.width = this.columnResizeWidth + move + "px";
    };
    Table.prototype.columnResizeEnd = function (event, column) {
        this.mouseMoveSubscription.unsubscribe();
        this.mouseUpSubscription.unsubscribe();
    };
    /**
     * Triggered when the user scrolls on the `<tbody>` element.
     * Emits the `scrollLoad` event.
     */
    Table.prototype.onScroll = function (event) {
        var distanceFromBottom = event.target.scrollHeight - event.target.clientHeight - event.target.scrollTop;
        if (distanceFromBottom <= this.scrollLoadDistance) {
            this.scrollLoad.emit(this.model);
        }
        else {
            this.model.isEnd = false;
        }
    };
    Table.prototype.columnDragStart = function (event, columnIndex) {
        this.isColumnDragging = true;
        this.columnDraggedHoverIndex = columnIndex;
        event.dataTransfer.setData("columnIndex", JSON.stringify(columnIndex));
    };
    Table.prototype.columnDragEnd = function (event, columnIndex) {
        this.isColumnDragging = false;
        this.columnDraggedHoverIndex = -1;
    };
    Table.prototype.columnDragEnter = function (event, position, columnIndex) {
        this.columnDraggedPosition = position;
        this.columnDraggedHoverIndex = columnIndex;
    };
    Table.prototype.columnDragLeave = function (event, position, columnIndex) {
        this.columnDraggedPosition = "";
    };
    Table.prototype.columnDragover = function (event, position, columnIndex) {
        this.columnDraggedHoverIndex = columnIndex;
        this.columnDraggedPosition = position;
        // needed to tell browser to allow dropping
        event.preventDefault();
    };
    Table.prototype.columnDrop = function (event, position, columnIndex) {
        this.isColumnDragging = false;
        this.columnDraggedHoverIndex = -1;
        this.columnDraggedPosition = "";
        this.model.moveColumn(parseInt(event.dataTransfer.getData("columnIndex"), 10), columnIndex + (position === "right" ? 1 : 0));
    };
    /**
     * Triggered when the user scrolls on the `<tbody>` element.
     * Emits the `scrollLoad` event.
     */
    Table.prototype.scrollToTop = function (event) {
        event.target.parentElement.parentElement.parentElement.parentElement.children[1].scrollTop = 0;
        this.model.isEnd = false;
    };
    Table.prototype.getSelectionLabelValue = function (row) {
        if (!this.selectionLabelColumn) {
            return { value: this.i18n.get().TABLE.ROW };
        }
        return { value: row[this.selectionLabelColumn].data };
    };
    Table.prototype.getExpandButtonAriaLabel = function () {
        return this._expandButtonAriaLabel.subject;
    };
    Table.prototype.getSortDescendingLabel = function () {
        return this._sortDescendingLabel.subject;
    };
    Table.prototype.getSortAscendingLabel = function () {
        return this._sortAscendingLabel.subject;
    };
    Table.prototype.getCheckboxHeaderLabel = function () {
        return this._checkboxHeaderLabel.subject;
    };
    Table.prototype.getCheckboxRowLabel = function () {
        return this._checkboxRowLabel.subject;
    };
    Table.prototype.getEndOfDataText = function () {
        return this._endOfDataText.subject;
    };
    Table.prototype.getScrollTopText = function () {
        return this._scrollTopText.subject;
    };
    Table.prototype.getFilterTitle = function () {
        return this._filterTitle.subject;
    };
    Table.decorators = [
        { type: Component, args: [{
                    selector: "ibm-table",
                    template: "\n\t<table\n\t\tibmTable\n\t\t[sortable]=\"sortable\"\n\t\t[noBorder]=\"noBorder\"\n\t\t[ngClass]=\"{'bx--data-table--sticky-header': stickyHeader}\"\n\t\t[size]=\"size\"\n\t\t[striped]=\"striped\"\n\t\t[skeleton]=\"skeleton\">\n\t\t<thead\n\t\t\tibmTableHead\n\t\t\t[sortable]=\"sortable\"\n\t\t\t(deselectAll)=\"onDeselectAll()\"\n\t\t\t(selectAll)=\"onSelectAll()\"\n\t\t\t(sort)=\"sort.emit($event)\"\n\t\t\t[checkboxHeaderLabel]=\"getCheckboxHeaderLabel()\"\n\t\t\t[filterTitle]=\"getFilterTitle()\"\n\t\t\t[model]=\"model\"\n\t\t\t[size]=\"size\"\n\t\t\t[selectAllCheckbox]=\"selectAllCheckbox\"\n\t\t\t[selectAllCheckboxSomeSelected]=\"selectAllCheckboxSomeSelected\"\n\t\t\t[showSelectionColumn]=\"showSelectionColumn\"\n\t\t\t[enableSingleSelect]=\"enableSingleSelect\"\n\t\t\t[skeleton]=\"skeleton\"\n\t\t\t[sortAscendingLabel]=\"sortAscendingLabel\"\n\t\t\t[sortDescendingLabel]=\"sortDescendingLabel\"\n\t\t\t[stickyHeader]=\"stickyHeader\">\n\t\t</thead>\n\t\t<tbody\n\t\t\tibmTableBody\n\t\t\t(deselectRow)=\"onSelectRow($event)\"\n\t\t\t(scroll)=\"onScroll($event)\"\n\t\t\t(selectRow)=\"onSelectRow($event)\"\n\t\t\t[checkboxRowLabel]=\"getCheckboxRowLabel()\"\n\t\t\t[enableSingleSelect]=\"enableSingleSelect\"\n\t\t\t(rowClick)=\"onRowClick($event)\"\n\t\t\t[expandButtonAriaLabel]=\"expandButtonAriaLabel\"\n\t\t\t[model]=\"model\"\n\t\t\t[size]=\"size\"\n\t\t\t[ngStyle]=\"{'overflow-y': 'scroll'}\"\n\t\t\t[selectionLabelColumn]=\"selectionLabelColumn\"\n\t\t\t[showSelectionColumn]=\"showSelectionColumn\"\n\t\t\t[skeleton]=\"skeleton\"\n\t\t\t*ngIf=\"!noData; else noDataTemplate\">\n\t\t</tbody>\n\t\t<ng-template #noDataTemplate><ng-content></ng-content></ng-template>\n\t\t<tfoot>\n\t\t\t<ng-template\n\t\t\t\t[ngTemplateOutlet]=\"footerTemplate\">\n\t\t\t</ng-template>\n\t\t\t<tr *ngIf=\"this.model.isLoading\">\n\t\t\t\t<td class=\"table_loading-indicator\">\n\t\t\t\t\t<div class=\"bx--loading bx--loading--small\">\n\t\t\t\t\t\t<svg class=\"bx--loading__svg\" viewBox=\"-75 -75 150 150\">\n\t\t\t\t\t\t\t<circle class=\"bx--loading__stroke\" cx=\"0\" cy=\"0\" r=\"37.5\" />\n\t\t\t\t\t\t</svg>\n\t\t\t\t\t</div>\n\t\t\t\t</td>\n\t\t\t</tr>\n\t\t\t<tr *ngIf=\"this.model.isEnd\">\n\t\t\t\t<td class=\"table_end-indicator\">\n\t\t\t\t\t<h5>{{getEndOfDataText() | async}}</h5>\n\t\t\t\t\t<button (click)=\"scrollToTop($event)\" class=\"btn--secondary-sm\">\n\t\t\t\t\t\t{{getScrollTopText() | async}}\n\t\t\t\t\t</button>\n\t\t\t\t</td>\n\t\t\t</tr>\n\t\t</tfoot>\n\t</table>\n\t"
                },] },
    ];
    /** @nocollapse */
    Table.ctorParameters = function () { return [
        { type: ElementRef },
        { type: ApplicationRef },
        { type: I18n }
    ]; };
    Table.propDecorators = {
        model: [{ type: Input }],
        size: [{ type: Input }],
        skeleton: [{ type: Input }],
        isDataGrid: [{ type: Input }],
        sortable: [{ type: Input }],
        noBorder: [{ type: Input }],
        enableRowSelect: [{ type: Input }],
        showSelectionColumn: [{ type: Input }],
        enableSingleSelect: [{ type: Input }],
        scrollLoadDistance: [{ type: Input }],
        columnsResizable: [{ type: Input }],
        columnsDraggable: [{ type: Input }],
        expandButtonAriaLabel: [{ type: Input }],
        sortDescendingLabel: [{ type: Input }],
        sortAscendingLabel: [{ type: Input }],
        translations: [{ type: Input }],
        striped: [{ type: Input }],
        stickyHeader: [{ type: HostBinding, args: ["class.bx--data-table_inner-container",] }, { type: Input }],
        footerTemplate: [{ type: Input }],
        selectionLabelColumn: [{ type: Input }],
        sort: [{ type: Output }],
        selectAll: [{ type: Output }],
        deselectAll: [{ type: Output }],
        selectRow: [{ type: Output }],
        deselectRow: [{ type: Output }],
        rowClick: [{ type: Output }],
        scrollLoad: [{ type: Output }]
    };
    return Table;
}());
export { Table };
//# sourceMappingURL=table.component.js.map