@aurelia-mdc-web/all 9.3.0-au2 → 9.3.2-au2

package/dist/src/data-table/mdc-data-table.js

@@ -0,0 +1,519 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.MdcDataTable = void 0;
+const tslib_1 = require("tslib");
+/* eslint-disable no-template-curly-in-string */
+const base_1 = require("../base");
+const data_table_1 = require("@material/data-table");
+const ponyfill_1 = require("@material/dom/ponyfill");
+const aurelia_1 = require("aurelia");
+const runtime_html_1 = require("@aurelia/runtime-html");
+const mdc_data_table_html_raw_1 = tslib_1.__importDefault(require("./mdc-data-table.html?raw"));
+data_table_1.events.ROW_CLICK = data_table_1.events.ROW_CLICK.toLowerCase();
+data_table_1.events.ROW_SELECTION_CHANGED = data_table_1.events.ROW_SELECTION_CHANGED.toLowerCase();
+data_table_1.events.SELECTED_ALL = data_table_1.events.SELECTED_ALL.toLowerCase();
+data_table_1.events.SORTED = data_table_1.events.SORTED.toLowerCase();
+data_table_1.events.UNSELECTED_ALL = data_table_1.events.UNSELECTED_ALL.toLowerCase();
+const NAVIGATION_EVENT = 'mdcdatatable:navigation';
+/**
+ * Use `pagination-total` replaceable part to customise pagination total label.
+ * @selector mdc-data-table
+ * @emits mdcdatatable:rowselectionchanged | Emitted when row checkbox is checked or unchecked
+ * @emits mdcdatatable:selectedall | Emitted when header row checkbox is checked
+ * @emits mdcdatatable:unselectedall | Emitted when header row checkbox is unchecked
+ * @emits mdcdatatable:sorted | Emitted when clicked on sortable header cell
+ * @emits mdcdatatable:rowclick | Emitted when a row is clicked
+ */
+let MdcDataTable = (() => {
+    let _classDecorators = [(0, aurelia_1.inject)(Element), (0, aurelia_1.customElement)({ name: 'mdc-data-table', template: mdc_data_table_html_raw_1.default }), (0, runtime_html_1.processContent)(function processContent(node) {
+            const element = node;
+            const table = element.querySelector('table');
+            if (!table) {
+                throw new Error('Have you forgotten the <table> tag in you data table markup?');
+            }
+            table.classList.add('mdc-data-table__table');
+            table.setAttribute('aria-label', '${ariaLabel}');
+            const headerRow = element.querySelector('thead>tr');
+            if (!headerRow) {
+                throw new Error('Have you forgotten the <thead><tr> tags in you data table markup?');
+            }
+            headerRow.classList.add(data_table_1.cssClasses.HEADER_ROW);
+            headerRow.setAttribute('ref', 'headerRow');
+            const headerCells = headerRow.querySelectorAll('th');
+            for (const th of Array.from(headerCells)) {
+                th.classList.add(data_table_1.cssClasses.HEADER_CELL);
+                th.classList.toggle('mdc-data-table__header-cell--numeric', th.hasAttribute('numeric'));
+                th.setAttribute('role', 'columnheader');
+                th.setAttribute('scope', 'col');
+            }
+            const tbody = element.querySelector('tbody');
+            if (!tbody) {
+                throw new Error('Have you forgotten the <tbody> tag in you data table markup?');
+            }
+            tbody.classList.add(data_table_1.cssClasses.CONTENT);
+            tbody.setAttribute('ref', 'content');
+            const paginationTotalSlot = element.querySelector('[au-slot="pagination-total"]');
+            paginationTotalSlot?.remove();
+            if (paginationTotalSlot) {
+                element.appendChild(paginationTotalSlot);
+            }
+        })];
+    let _classDescriptor;
+    let _classExtraInitializers = [];
+    let _classThis;
+    let _classSuper = base_1.MdcComponent;
+    let _pagination_decorators;
+    let _pagination_initializers = [];
+    let _pagination_extraInitializers = [];
+    let _rowsPerPageLabel_decorators;
+    let _rowsPerPageLabel_initializers = [];
+    let _rowsPerPageLabel_extraInitializers = [];
+    let _pageSizes_decorators;
+    let _pageSizes_initializers = [];
+    let _pageSizes_extraInitializers = [];
+    let _pageSize_decorators;
+    let _pageSize_initializers = [];
+    let _pageSize_extraInitializers = [];
+    let _stickyHeader_decorators;
+    let _stickyHeader_initializers = [];
+    let _stickyHeader_extraInitializers = [];
+    let _manualCheckboxHandling_decorators;
+    let _manualCheckboxHandling_initializers = [];
+    let _manualCheckboxHandling_extraInitializers = [];
+    let _saveColumnWidths_decorators;
+    let _saveColumnWidths_initializers = [];
+    let _saveColumnWidths_extraInitializers = [];
+    let _recordsCount_decorators;
+    let _recordsCount_initializers = [];
+    let _recordsCount_extraInitializers = [];
+    let _activePage_decorators;
+    let _activePage_initializers = [];
+    let _activePage_extraInitializers = [];
+    let _busy_decorators;
+    let _busy_initializers = [];
+    let _busy_extraInitializers = [];
+    let _hoistPageSelectToBody_decorators;
+    let _hoistPageSelectToBody_initializers = [];
+    let _hoistPageSelectToBody_extraInitializers = [];
+    var MdcDataTable = class extends _classSuper {
+        static { _classThis = this; }
+        static {
+            const _metadata = typeof Symbol === "function" && Symbol.metadata ? Object.create(_classSuper[Symbol.metadata] ?? null) : void 0;
+            _pagination_decorators = [(0, aurelia_1.bindable)({ set: base_1.booleanAttr })];
+            _rowsPerPageLabel_decorators = [(0, aurelia_1.bindable)()];
+            _pageSizes_decorators = [(0, aurelia_1.bindable)()];
+            _pageSize_decorators = [(0, aurelia_1.bindable)({ mode: aurelia_1.BindingMode.twoWay })];
+            _stickyHeader_decorators = [(0, aurelia_1.bindable)({ set: base_1.booleanAttr })];
+            _manualCheckboxHandling_decorators = [(0, aurelia_1.bindable)({ set: base_1.booleanAttr })];
+            _saveColumnWidths_decorators = [(0, aurelia_1.bindable)({ set: base_1.booleanAttr })];
+            _recordsCount_decorators = [(0, aurelia_1.bindable)({ set: base_1.number })];
+            _activePage_decorators = [(0, aurelia_1.bindable)({ set: base_1.number })];
+            _busy_decorators = [(0, aurelia_1.bindable)({ set: base_1.booleanAttr })];
+            _hoistPageSelectToBody_decorators = [(0, aurelia_1.bindable)({ set: base_1.booleanAttr })];
+            tslib_1.__esDecorate(null, null, _pagination_decorators, { kind: "field", name: "pagination", static: false, private: false, access: { has: obj => "pagination" in obj, get: obj => obj.pagination, set: (obj, value) => { obj.pagination = value; } }, metadata: _metadata }, _pagination_initializers, _pagination_extraInitializers);
+            tslib_1.__esDecorate(null, null, _rowsPerPageLabel_decorators, { kind: "field", name: "rowsPerPageLabel", static: false, private: false, access: { has: obj => "rowsPerPageLabel" in obj, get: obj => obj.rowsPerPageLabel, set: (obj, value) => { obj.rowsPerPageLabel = value; } }, metadata: _metadata }, _rowsPerPageLabel_initializers, _rowsPerPageLabel_extraInitializers);
+            tslib_1.__esDecorate(null, null, _pageSizes_decorators, { kind: "field", name: "pageSizes", static: false, private: false, access: { has: obj => "pageSizes" in obj, get: obj => obj.pageSizes, set: (obj, value) => { obj.pageSizes = value; } }, metadata: _metadata }, _pageSizes_initializers, _pageSizes_extraInitializers);
+            tslib_1.__esDecorate(null, null, _pageSize_decorators, { kind: "field", name: "pageSize", static: false, private: false, access: { has: obj => "pageSize" in obj, get: obj => obj.pageSize, set: (obj, value) => { obj.pageSize = value; } }, metadata: _metadata }, _pageSize_initializers, _pageSize_extraInitializers);
+            tslib_1.__esDecorate(null, null, _stickyHeader_decorators, { kind: "field", name: "stickyHeader", static: false, private: false, access: { has: obj => "stickyHeader" in obj, get: obj => obj.stickyHeader, set: (obj, value) => { obj.stickyHeader = value; } }, metadata: _metadata }, _stickyHeader_initializers, _stickyHeader_extraInitializers);
+            tslib_1.__esDecorate(null, null, _manualCheckboxHandling_decorators, { kind: "field", name: "manualCheckboxHandling", static: false, private: false, access: { has: obj => "manualCheckboxHandling" in obj, get: obj => obj.manualCheckboxHandling, set: (obj, value) => { obj.manualCheckboxHandling = value; } }, metadata: _metadata }, _manualCheckboxHandling_initializers, _manualCheckboxHandling_extraInitializers);
+            tslib_1.__esDecorate(null, null, _saveColumnWidths_decorators, { kind: "field", name: "saveColumnWidths", static: false, private: false, access: { has: obj => "saveColumnWidths" in obj, get: obj => obj.saveColumnWidths, set: (obj, value) => { obj.saveColumnWidths = value; } }, metadata: _metadata }, _saveColumnWidths_initializers, _saveColumnWidths_extraInitializers);
+            tslib_1.__esDecorate(null, null, _recordsCount_decorators, { kind: "field", name: "recordsCount", static: false, private: false, access: { has: obj => "recordsCount" in obj, get: obj => obj.recordsCount, set: (obj, value) => { obj.recordsCount = value; } }, metadata: _metadata }, _recordsCount_initializers, _recordsCount_extraInitializers);
+            tslib_1.__esDecorate(null, null, _activePage_decorators, { kind: "field", name: "activePage", static: false, private: false, access: { has: obj => "activePage" in obj, get: obj => obj.activePage, set: (obj, value) => { obj.activePage = value; } }, metadata: _metadata }, _activePage_initializers, _activePage_extraInitializers);
+            tslib_1.__esDecorate(null, null, _busy_decorators, { kind: "field", name: "busy", static: false, private: false, access: { has: obj => "busy" in obj, get: obj => obj.busy, set: (obj, value) => { obj.busy = value; } }, metadata: _metadata }, _busy_initializers, _busy_extraInitializers);
+            tslib_1.__esDecorate(null, null, _hoistPageSelectToBody_decorators, { kind: "field", name: "hoistPageSelectToBody", static: false, private: false, access: { has: obj => "hoistPageSelectToBody" in obj, get: obj => obj.hoistPageSelectToBody, set: (obj, value) => { obj.hoistPageSelectToBody = value; } }, metadata: _metadata }, _hoistPageSelectToBody_initializers, _hoistPageSelectToBody_extraInitializers);
+            tslib_1.__esDecorate(null, _classDescriptor = { value: _classThis }, _classDecorators, { kind: "class", name: _classThis.name, metadata: _metadata }, null, _classExtraInitializers);
+            MdcDataTable = _classThis = _classDescriptor.value;
+            if (_metadata) Object.defineProperty(_classThis, Symbol.metadata, { enumerable: true, configurable: true, writable: true, value: _metadata });
+            tslib_1.__runInitializers(_classThis, _classExtraInitializers);
+        }
+        header;
+        content;
+        columnResized;
+        mutationObserver;
+        /** Shows pagination footer */
+        pagination = tslib_1.__runInitializers(this, _pagination_initializers, void 0);
+        /** Caption for the page size selector */
+        rowsPerPageLabel = (tslib_1.__runInitializers(this, _pagination_extraInitializers), tslib_1.__runInitializers(this, _rowsPerPageLabel_initializers, 'Rows per page'));
+        /** Page sizes available for selection, e.g. [10, 25, 100, 'All'] */
+        pageSizes = (tslib_1.__runInitializers(this, _rowsPerPageLabel_extraInitializers), tslib_1.__runInitializers(this, _pageSizes_initializers, [10, 25, 100]));
+        /** Selected page size */
+        pageSize = (tslib_1.__runInitializers(this, _pageSizes_extraInitializers), tslib_1.__runInitializers(this, _pageSize_initializers, 10));
+        /** Makes header row sticky (fixed) on vertical scroll.
+         * (Note: Sticky header feature is not compatible with IE11 browsers.) */
+        stickyHeader = (tslib_1.__runInitializers(this, _pageSize_extraInitializers), tslib_1.__runInitializers(this, _stickyHeader_initializers, void 0));
+        /** Turns off checkbox handling by the MDC framework */
+        manualCheckboxHandling = (tslib_1.__runInitializers(this, _stickyHeader_extraInitializers), tslib_1.__runInitializers(this, _manualCheckboxHandling_initializers, void 0));
+        /** Turns on automatic column widths saving to localStorage */
+        saveColumnWidths = (tslib_1.__runInitializers(this, _manualCheckboxHandling_extraInitializers), tslib_1.__runInitializers(this, _saveColumnWidths_initializers, void 0));
+        get paginationPosition() {
+            if (typeof this.pageSize !== 'number' || this.pageSize === undefined || isNaN(this.activePage) || isNaN(this.recordsCount)) {
+                return undefined;
+            }
+            const pagesCount = Math.ceil(this.recordsCount / this.pageSize);
+            return this.activePage === 1
+                ? (pagesCount === 1 ? undefined : 'first')
+                : (this.activePage === pagesCount ? 'last' : 'between');
+        }
+        /** Sets total number of records. Used in navigation row. */
+        recordsCount = (tslib_1.__runInitializers(this, _saveColumnWidths_extraInitializers), tslib_1.__runInitializers(this, _recordsCount_initializers, void 0));
+        /** Sets the active page number. Used in navigation row. */
+        activePage = (tslib_1.__runInitializers(this, _recordsCount_extraInitializers), tslib_1.__runInitializers(this, _activePage_initializers, void 0));
+        get paginationTotal() {
+            if (typeof this.pageSize !== 'number' || this.pageSize === undefined || isNaN(this.activePage) || isNaN(this.recordsCount)) {
+                return undefined;
+            }
+            const firstRecord = this.pageSize * (this.activePage - 1) + 1;
+            const lastRecord = Math.min(this.pageSize * this.activePage, this.recordsCount);
+            return `${firstRecord}-${lastRecord} of ${this.recordsCount}`;
+        }
+        /** Turns on a linear progress indicator at the top of the table */
+        busy = (tslib_1.__runInitializers(this, _activePage_extraInitializers), tslib_1.__runInitializers(this, _busy_initializers, void 0));
+        busyChanged() {
+            if (this.busy) {
+                this.foundation?.showProgress();
+            }
+            else {
+                this.foundation?.hideProgress();
+            }
+        }
+        hoistPageSelectToBody = (tslib_1.__runInitializers(this, _busy_extraInitializers), tslib_1.__runInitializers(this, _hoistPageSelectToBody_initializers, void 0));
+        get rowCheckboxList() {
+            return Array.from(this.root.querySelectorAll(`.${data_table_1.cssClasses.ROW} .mdc-checkbox`))
+                .map(x => runtime_html_1.CustomElement.for(x).viewModel);
+        }
+        get headerRowCheckbox() {
+            const el = this.root.querySelector(`.${data_table_1.cssClasses.HEADER_ROW} .mdc-checkbox`);
+            return el ? runtime_html_1.CustomElement.for(el).viewModel : undefined;
+        }
+        handleHeaderRowCheckboxChange() {
+            this.foundation?.handleHeaderRowCheckboxChange();
+        }
+        handleRowCheckboxChange(event) {
+            if (event.target.type === 'checkbox') {
+                this.foundation?.handleRowCheckboxChange(event);
+            }
+        }
+        headerRowClickListener(event) {
+            this.handleHeaderRowClick(event);
+        }
+        handleNavigationClick(type) {
+            this.emit(NAVIGATION_EVENT, { type }, true);
+        }
+        handleContentClick(event) {
+            const dataRowEl = (0, ponyfill_1.closest)(event.target, data_table_1.selectors.ROW);
+            if (!dataRowEl) {
+                return;
+            }
+            this.foundation?.handleRowClick({
+                rowId: this.getRowIdByRowElement(dataRowEl),
+                row: dataRowEl,
+            });
+        }
+        /**
+         * Re-initializes header row checkbox and row checkboxes when selectable rows are added or removed from table.
+         */
+        layout() {
+            this.foundation?.layout();
+        }
+        /**
+         * Returns array of header row cell elements.
+         */
+        getHeaderCells() {
+            return [].slice.call(this.root.querySelectorAll(data_table_1.selectors.HEADER_CELL));
+        }
+        /**
+         * Returns array of row elements.
+         */
+        getRows() {
+            return this.foundation.getRows();
+        }
+        /**
+         * Returns array of selected row ids.
+         */
+        getSelectedRowIds() {
+            return this.foundation.getSelectedRowIds();
+        }
+        /**
+         * Sets selected row ids. Overwrites previously selected rows.
+         * @param rowIds Array of row ids that needs to be selected.
+         */
+        setSelectedRowIds(rowIds) {
+            this.foundation?.setSelectedRowIds(rowIds);
+        }
+        handleEvent(evt) {
+            switch (evt.currentTarget) {
+                case this.header:
+                    switch (evt.type) {
+                        case 'change':
+                            this.handleHeaderRowCheckboxChange();
+                            break;
+                        case 'click':
+                            this.handleHeaderRowClick(evt);
+                            break;
+                    }
+                    break;
+                case this.content:
+                    switch (evt.type) {
+                        case 'change':
+                            this.handleRowCheckboxChange(evt);
+                            break;
+                    }
+                    break;
+            }
+        }
+        beforeFoundationCreated() {
+            this.header = this.root.querySelector(`.${data_table_1.cssClasses.HEADER_ROW}`);
+            this.content = this.root.querySelector(`.${data_table_1.cssClasses.CONTENT}`);
+            this.header.addEventListener('click', this);
+            this.header.querySelectorAll('th[resizeable]').forEach(x => {
+                const resizeHandle = document.createElement('div');
+                resizeHandle.addEventListener('mousedown', (event) => this.startColumnResize(event, x));
+                x.insertBefore(document.createElement('div'), x.firstChild).classList.add('mdc-data-table__header-cell__hover-indicator');
+                x.appendChild(resizeHandle).classList.add('mdc-data-table__header-cell__resize-handle');
+            });
+            if (this.saveColumnWidths) {
+                this.restoreColumnWidths();
+                this.mutationObserver = new MutationObserver(() => this.restoreColumnWidths());
+                this.mutationObserver.observe(this.content, { childList: true, subtree: false });
+            }
+            if (!this.manualCheckboxHandling) {
+                this.header.addEventListener('change', this);
+                this.content.addEventListener('change', this);
+            }
+            const rowCheckboxList = this.rowCheckboxList;
+            this.rowCheckboxList.forEach(x => x.root.classList.add(data_table_1.cssClasses.ROW_CHECKBOX));
+            if (this.headerRowCheckbox) {
+                this.headerRowCheckbox.root.classList.add(data_table_1.cssClasses.HEADER_ROW_CHECKBOX);
+                rowCheckboxList.push(this.headerRowCheckbox);
+            }
+        }
+        restoreColumnWidths() {
+            const widths = JSON.parse(localStorage.getItem(`mdc-data-table-${this.root.id}-column-widths`) ?? '[]');
+            this.setColumnWidths(widths);
+        }
+        initialSyncWithDOM() {
+            if (this.busy !== undefined) {
+                this.busyChanged();
+            }
+            if (!this.manualCheckboxHandling) {
+                const rowCheckboxList = this.rowCheckboxList;
+                for (let i = 0; i < rowCheckboxList.length; ++i) {
+                    if (rowCheckboxList[i].checked) {
+                        this.getRowByIndex(i).classList.add(data_table_1.cssClasses.ROW_SELECTED);
+                    }
+                }
+            }
+            this.foundation?.layout();
+        }
+        startColumnResize(event, headerCell) {
+            this.columnResized = true;
+            const startX = event.clientX;
+            const resizeHandle = event.target;
+            const initialHandlePosition = resizeHandle.offsetLeft;
+            // Create a visual indicator for the resize handle
+            const handleIndicator = document.createElement('div');
+            handleIndicator.classList.add('mdc-data-table__header-cell__resize-handle-indicator');
+            handleIndicator.style.left = `${initialHandlePosition}px`;
+            handleIndicator.style.height = `${headerCell.offsetHeight}px`;
+            document.body.style.cursor = 'col-resize';
+            headerCell.classList.add('mdc-data-table__header-cell--resizing');
+            headerCell.appendChild(handleIndicator);
+            const onMouseMove = (moveEvent) => {
+                const deltaX = moveEvent.clientX - startX;
+                handleIndicator.style.left = `${Math.max(initialHandlePosition + deltaX, headerCell.clientLeft)}px`;
+            };
+            const onMouseUp = () => {
+                const finalDeltaX = parseInt(handleIndicator.style.left, 10) - initialHandlePosition;
+                const newWidth = Math.max(5, headerCell.offsetWidth + finalDeltaX); // Minimum width of 5px
+                // Apply the new width to the column
+                headerCell.style.minWidth = headerCell.style.maxWidth = `${newWidth}px`;
+                this.content.querySelectorAll(`tr td:nth-child(${Array.from(headerCell.parentElement.children).indexOf(headerCell) + 1})`)
+                    .forEach((cell) => {
+                    cell.style.minWidth = cell.style.maxWidth = `${newWidth}px`;
+                });
+                // Clean up
+                handleIndicator.remove();
+                this.columnResized = false;
+                document.body.style.cursor = '';
+                headerCell.classList.remove('mdc-data-table__header-cell--resizing');
+                document.removeEventListener('mousemove', onMouseMove);
+                document.removeEventListener('mouseup', onMouseUp);
+                // Save the new widths if required
+                const widths = this.getHeaderCells().map(x => x.style.minWidth);
+                if (this.saveColumnWidths) {
+                    localStorage.setItem(`mdc-data-table-${this.root.id}-column-widths`, JSON.stringify(widths));
+                }
+                this.emit('mdcdatatable:columnsresized', { widths }, true);
+            };
+            document.addEventListener('mousemove', onMouseMove);
+            document.addEventListener('mouseup', onMouseUp);
+        }
+        destroy() {
+            this.header.removeEventListener('change', this);
+            this.header.removeEventListener('click', this);
+            this.content.removeEventListener('change', this);
+            this.mutationObserver?.disconnect();
+        }
+        setColumnWidths(widths) {
+            if (!widths || widths.length === 0) {
+                return;
+            }
+            this.getHeaderCells().forEach((x, i) => {
+                x.style.minWidth = x.style.maxWidth = widths[i];
+                this.content.querySelectorAll(`tr td:nth-child(${i + 1})`).forEach((cell) => {
+                    cell.style.minWidth = cell.style.maxWidth = widths[i];
+                });
+            });
+        }
+        getDefaultFoundation() {
+            // DO NOT INLINE this variable. For backward compatibility, foundations take a Partial<MDCFooAdapter>.
+            // To ensure we don't accidentally omit any methods, we need a separate, strongly typed adapter variable.
+            // tslint:disable:object-literal-sort-keys Methods should be in the same order as the adapter interface.
+            const adapter = {
+                addClass: (className) => this.root.classList.add(className),
+                removeClass: (className) => this.root.classList.remove(className),
+                getHeaderCellElements: () => this.getHeaderCells(),
+                getHeaderCellCount: () => this.getHeaderCells().length,
+                getAttributeByHeaderCellIndex: (index, attribute) => this.getHeaderCells()[index].getAttribute(attribute),
+                setAttributeByHeaderCellIndex: (index, attribute, value) => this.getHeaderCells()[index].setAttribute(attribute, value),
+                setClassNameByHeaderCellIndex: (index, className) => this.getHeaderCells()[index].classList.add(className),
+                removeClassNameByHeaderCellIndex: (index, className) => {
+                    this.getHeaderCells()[index].classList.remove(className);
+                },
+                notifySortAction: (data) => {
+                    this.emit(data_table_1.events.SORTED, data, /** shouldBubble */ true);
+                },
+                getTableContainerHeight: () => {
+                    const tableContainer = this.root.querySelector(`.${data_table_1.cssClasses.TABLE_CONTAINER}`);
+                    if (!tableContainer) {
+                        throw new Error('MDCDataTable: Table container element not found.');
+                    }
+                    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+                    return tableContainer.getBoundingClientRect().height;
+                },
+                getTableHeaderHeight: () => {
+                    const tableHeader = this.root.querySelector(data_table_1.selectors.HEADER_ROW);
+                    if (!tableHeader) {
+                        throw new Error('MDCDataTable: Table header element not found.');
+                    }
+                    return tableHeader.getBoundingClientRect().height;
+                },
+                setProgressIndicatorStyles: (styles) => {
+                    const progressIndicator = this.root.querySelector(data_table_1.selectors.PROGRESS_INDICATOR);
+                    if (!progressIndicator) {
+                        throw new Error('MDCDataTable: Progress indicator element not found.');
+                    }
+                    Object.assign(progressIndicator.style, styles);
+                },
+                addClassAtRowIndex: (rowIndex, className) => {
+                    this.getRows()[rowIndex].classList.add(className);
+                },
+                getRowCount: () => this.getRows().length,
+                getRowElements: () => [].slice.call(this.root.querySelectorAll(data_table_1.selectors.ROW)),
+                getRowIdAtIndex: (rowIndex) => this.getRows()[rowIndex].getAttribute(data_table_1.dataAttributes.ROW_ID),
+                getRowIndexByChildElement: (el) => this.getRows().indexOf((0, ponyfill_1.closest)(el, data_table_1.selectors.ROW)),
+                getSelectedRowCount: () => this.root.querySelectorAll(data_table_1.selectors.ROW_SELECTED).length,
+                isCheckboxAtRowIndexChecked: (rowIndex) => this.rowCheckboxList[rowIndex].checked,
+                isHeaderRowCheckboxChecked: () => this.headerRowCheckbox?.checked ?? false,
+                isRowsSelectable: () => !!this.root.querySelector(data_table_1.selectors.ROW_CHECKBOX),
+                notifyRowSelectionChanged: (data) => {
+                    this.emit(data_table_1.events.ROW_SELECTION_CHANGED, {
+                        row: this.getRowByIndex(data.rowIndex),
+                        rowId: this.getRowIdByIndex(data.rowIndex),
+                        rowIndex: data.rowIndex,
+                        selected: data.selected,
+                    }, /** shouldBubble */ true);
+                },
+                notifySelectedAll: () => {
+                    this.emit(data_table_1.events.SELECTED_ALL, {}, /** shouldBubble */ true);
+                },
+                notifyUnselectedAll: () => {
+                    this.emit(data_table_1.events.UNSELECTED_ALL, {}, /** shouldBubble */ true);
+                },
+                notifyRowClick: (data) => {
+                    this.emit(data_table_1.events.ROW_CLICK, data, /** shouldBubble */ true);
+                },
+                registerHeaderRowCheckbox: () => {
+                    // const checkboxEl = this.root.querySelector<IMdcCheckboxElement>(selectors.HEADER_ROW_CHECKBOX);
+                    // this.headerRowCheckbox = checkboxEl?.au?.controller.viewModel;
+                },
+                registerRowCheckboxes: () => {
+                    // this.rowCheckboxList = [];
+                    // this.getRows().forEach((rowEl) => {
+                    //   const checkbox = rowEl.querySelector<IMdcCheckboxElement>(selectors.ROW_CHECKBOX)?.au?.controller.viewModel;
+                    //   if (checkbox) {
+                    //     this.rowCheckboxList.push(checkbox);
+                    //   }
+                    // });
+                },
+                removeClassAtRowIndex: (rowIndex, className) => {
+                    this.getRows()[rowIndex].classList.remove(className);
+                },
+                setAttributeAtRowIndex: (rowIndex, attr, value) => {
+                    this.getRows()[rowIndex].setAttribute(attr, value);
+                },
+                setHeaderRowCheckboxChecked: (checked) => {
+                    if (this.headerRowCheckbox) {
+                        this.headerRowCheckbox.checked = checked;
+                    }
+                },
+                setHeaderRowCheckboxIndeterminate: (indeterminate) => {
+                    if (this.headerRowCheckbox) {
+                        this.headerRowCheckbox.indeterminate = indeterminate;
+                    }
+                },
+                setRowCheckboxCheckedAtIndex: (rowIndex, checked) => {
+                    this.rowCheckboxList[rowIndex].checked = checked;
+                },
+                setSortStatusLabelByHeaderCellIndex: (columnIndex, sortValue) => {
+                    const headerCell = this.getHeaderCells()[columnIndex];
+                    const sortStatusLabel = headerCell.querySelector(data_table_1.selectors.SORT_STATUS_LABEL);
+                    if (!sortStatusLabel) {
+                        return;
+                    }
+                    sortStatusLabel.textContent =
+                        this.getSortStatusMessageBySortValue(sortValue);
+                }
+            };
+            return new data_table_1.MDCDataTableFoundation(adapter);
+        }
+        getRowByIndex(index) {
+            return this.getRows()[index];
+        }
+        getRowIdByIndex(index) {
+            return this.getRowByIndex(index).getAttribute(data_table_1.dataAttributes.ROW_ID);
+        }
+        handleHeaderRowClick(event) {
+            const headerCell = (0, ponyfill_1.closest)(event.target, data_table_1.selectors.HEADER_CELL_WITH_SORT);
+            if (!headerCell) {
+                return;
+            }
+            const columnId = headerCell.getAttribute(data_table_1.dataAttributes.COLUMN_ID);
+            const columnIndex = this.getHeaderCells().indexOf(headerCell);
+            if (columnIndex === -1) {
+                return;
+            }
+            this.foundation?.handleSortAction({ columnId, columnIndex, headerCell });
+        }
+        getSortStatusMessageBySortValue(sortValue) {
+            switch (sortValue) {
+                case data_table_1.SortValue.ASCENDING:
+                    return data_table_1.messages.SORTED_IN_ASCENDING;
+                case data_table_1.SortValue.DESCENDING:
+                    return data_table_1.messages.SORTED_IN_DESCENDING;
+                default:
+                    return '';
+            }
+        }
+        getRowIdByRowElement(rowElement) {
+            return rowElement.getAttribute(data_table_1.dataAttributes.ROW_ID);
+        }
+        constructor() {
+            super(...arguments);
+            tslib_1.__runInitializers(this, _hoistPageSelectToBody_extraInitializers);
+        }
+    };
+    return MdcDataTable = _classThis;
+})();
+exports.MdcDataTable = MdcDataTable;
+//# sourceMappingURL=mdc-data-table.js.map

package/dist/src/data-table/mdc-data-table.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"mdc-data-table.js","sourceRoot":"","sources":["../../../src/data-table/mdc-data-table.ts"],"names":[],"mappings":"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","sourcesContent":["/* eslint-disable no-template-curly-in-string */\r\nimport { MdcComponent, booleanAttr, number } from '../base';\r\nimport {\r\n  MDCDataTableFoundation, selectors, MDCDataTableAdapter, events, cssClasses, RowClickEventData,\r\n  dataAttributes, MDCDataTableRowSelectionChangedEventDetail, SortValue, messages\r\n} from '@material/data-table';\r\nimport { closest } from '@material/dom/ponyfill';\r\nimport { inject, customElement, INode, bindable, BindingMode } from 'aurelia';\r\nimport { processContent, CustomElement } from '@aurelia/runtime-html';\r\nimport template from './mdc-data-table.html?raw';\r\nimport { MdcCheckbox } from '../checkbox/mdc-checkbox';\r\n\r\nevents.ROW_CLICK = events.ROW_CLICK.toLowerCase();\r\nevents.ROW_SELECTION_CHANGED = events.ROW_SELECTION_CHANGED.toLowerCase();\r\nevents.SELECTED_ALL = events.SELECTED_ALL.toLowerCase();\r\nevents.SORTED = events.SORTED.toLowerCase();\r\nevents.UNSELECTED_ALL = events.UNSELECTED_ALL.toLowerCase();\r\nconst NAVIGATION_EVENT = 'mdcdatatable:navigation';\r\n\r\nexport interface MDCDataTableColumnsResizedEventDetail {\r\n  widths: string[];\r\n}\r\n\r\n/**\r\n * Use `pagination-total` replaceable part to customise pagination total label.\r\n * @selector mdc-data-table\r\n * @emits mdcdatatable:rowselectionchanged | Emitted when row checkbox is checked or unchecked\r\n * @emits mdcdatatable:selectedall | Emitted when header row checkbox is checked\r\n * @emits mdcdatatable:unselectedall | Emitted when header row checkbox is unchecked\r\n * @emits mdcdatatable:sorted | Emitted when clicked on sortable header cell\r\n * @emits mdcdatatable:rowclick | Emitted when a row is clicked\r\n */\r\n@inject(Element)\r\n@customElement({ name: 'mdc-data-table', template })\r\n@processContent(function processContent(node: INode) {\r\n  const element = node as HTMLElement;\r\n  const table = element.querySelector('table');\r\n  if (!table) {\r\n    throw new Error('Have you forgotten the <table> tag in you data table markup?');\r\n  }\r\n  table.classList.add('mdc-data-table__table');\r\n  table.setAttribute('aria-label', '${ariaLabel}');\r\n\r\n  const headerRow = element.querySelector('thead>tr');\r\n  if (!headerRow) {\r\n    throw new Error('Have you forgotten the <thead><tr> tags in you data table markup?');\r\n  }\r\n  headerRow.classList.add(cssClasses.HEADER_ROW);\r\n  headerRow.setAttribute('ref', 'headerRow');\r\n  const headerCells = headerRow.querySelectorAll<HTMLElement>('th');\r\n  for (const th of Array.from(headerCells)) {\r\n    th.classList.add(cssClasses.HEADER_CELL);\r\n    th.classList.toggle('mdc-data-table__header-cell--numeric', th.hasAttribute('numeric'));\r\n    th.setAttribute('role', 'columnheader');\r\n    th.setAttribute('scope', 'col');\r\n  }\r\n\r\n  const tbody = element.querySelector('tbody');\r\n  if (!tbody) {\r\n    throw new Error('Have you forgotten the <tbody> tag in you data table markup?');\r\n  }\r\n  tbody.classList.add(cssClasses.CONTENT);\r\n  tbody.setAttribute('ref', 'content');\r\n\r\n  const paginationTotalSlot = element.querySelector('[au-slot=\"pagination-total\"]');\r\n  paginationTotalSlot?.remove();\r\n\r\n  if (paginationTotalSlot) {\r\n    element.appendChild(paginationTotalSlot);\r\n  }\r\n}\r\n)\r\nexport class MdcDataTable extends MdcComponent<MDCDataTableFoundation> implements EventListenerObject {\r\n  header: HTMLElement;\r\n  content: HTMLElement;\r\n  columnResized: boolean;\r\n  private mutationObserver: MutationObserver;\r\n\r\n  /** Shows pagination footer */\r\n  @bindable({ set: booleanAttr })\r\n  pagination: boolean;\r\n\r\n  /** Caption for the page size selector */\r\n  @bindable()\r\n  rowsPerPageLabel: string = 'Rows per page';\r\n\r\n  /** Page sizes available for selection, e.g. [10, 25, 100, 'All'] */\r\n  @bindable()\r\n  pageSizes: unknown[] = [10, 25, 100];\r\n\r\n  /** Selected page size */\r\n  @bindable({ mode: BindingMode.twoWay })\r\n  pageSize: unknown = 10;\r\n\r\n  /** Makes header row sticky (fixed) on vertical scroll.\r\n   * (Note: Sticky header feature is not compatible with IE11 browsers.) */\r\n  @bindable({ set: booleanAttr })\r\n  stickyHeader: boolean;\r\n\r\n  /** Turns off checkbox handling by the MDC framework */\r\n  @bindable({ set: booleanAttr })\r\n  manualCheckboxHandling: boolean;\r\n\r\n  /** Turns on automatic column widths saving to localStorage */\r\n  @bindable({ set: booleanAttr })\r\n  saveColumnWidths: boolean;\r\n\r\n  get paginationPosition(): 'first' | 'between' | 'last' | undefined {\r\n    if (typeof this.pageSize !== 'number' || this.pageSize === undefined || isNaN(this.activePage) || isNaN(this.recordsCount)) {\r\n      return undefined;\r\n    }\r\n    const pagesCount = Math.ceil(this.recordsCount / this.pageSize);\r\n    return this.activePage === 1\r\n      ? (pagesCount === 1 ? undefined : 'first')\r\n      : (this.activePage === pagesCount ? 'last' : 'between');\r\n  }\r\n\r\n  /** Sets total number of records. Used in navigation row. */\r\n  @bindable({ set: number })\r\n  recordsCount: number;\r\n\r\n  /** Sets the active page number. Used in navigation row. */\r\n  @bindable({ set: number })\r\n  activePage: number;\r\n\r\n  get paginationTotal(): string | undefined {\r\n    if (typeof this.pageSize !== 'number' || this.pageSize === undefined || isNaN(this.activePage) || isNaN(this.recordsCount)) {\r\n      return undefined;\r\n    }\r\n    const firstRecord = this.pageSize * (this.activePage - 1) + 1;\r\n    const lastRecord = Math.min(this.pageSize * this.activePage, this.recordsCount);\r\n    return `${firstRecord}-${lastRecord} of ${this.recordsCount}`;\r\n  }\r\n\r\n  /** Turns on a linear progress indicator at the top of the table */\r\n  @bindable({ set: booleanAttr })\r\n  busy: boolean;\r\n  busyChanged() {\r\n    if (this.busy) {\r\n      this.foundation?.showProgress();\r\n    } else {\r\n      this.foundation?.hideProgress();\r\n    }\r\n  }\r\n\r\n  @bindable({ set: booleanAttr })\r\n  hoistPageSelectToBody: boolean;\r\n\r\n  get rowCheckboxList(): MdcCheckbox[] {\r\n    return Array.from(this.root.querySelectorAll(`.${cssClasses.ROW} .mdc-checkbox`))\r\n      .map(x => CustomElement.for<MdcCheckbox>(x).viewModel);\r\n  }\r\n\r\n  get headerRowCheckbox(): MdcCheckbox | undefined {\r\n    const el = this.root.querySelector(`.${cssClasses.HEADER_ROW} .mdc-checkbox`);\r\n    return el ? CustomElement.for<MdcCheckbox>(el).viewModel : undefined;\r\n  }\r\n\r\n  handleHeaderRowCheckboxChange() {\r\n    this.foundation?.handleHeaderRowCheckboxChange();\r\n  }\r\n\r\n  handleRowCheckboxChange(event: Event) {\r\n    if ((event.target as HTMLInputElement).type === 'checkbox') {\r\n      this.foundation?.handleRowCheckboxChange(event);\r\n    }\r\n  }\r\n\r\n  headerRowClickListener(event: Event) {\r\n    this.handleHeaderRowClick(event);\r\n  }\r\n\r\n  handleNavigationClick(type: 'first' | 'prev' | 'next' | 'last') {\r\n    this.emit(NAVIGATION_EVENT, { type }, true);\r\n  }\r\n\r\n  handleContentClick(event: Event) {\r\n    const dataRowEl = closest(event.target as Element, selectors.ROW) as HTMLElement;\r\n    if (!dataRowEl) {\r\n      return;\r\n    }\r\n\r\n    this.foundation?.handleRowClick({\r\n      rowId: this.getRowIdByRowElement(dataRowEl),\r\n      row: dataRowEl,\r\n    });\r\n  }\r\n\r\n  /**\r\n   * Re-initializes header row checkbox and row checkboxes when selectable rows are added or removed from table.\r\n   */\r\n  layout() {\r\n    this.foundation?.layout();\r\n  }\r\n\r\n  /**\r\n   * Returns array of header row cell elements.\r\n   */\r\n  getHeaderCells(): HTMLElement[] {\r\n    return [].slice.call(this.root.querySelectorAll(selectors.HEADER_CELL)) as HTMLElement[];\r\n  }\r\n\r\n  /**\r\n   * Returns array of row elements.\r\n   */\r\n  getRows(): Element[] {\r\n    return this.foundation!.getRows();\r\n  }\r\n\r\n  /**\r\n   * Returns array of selected row ids.\r\n   */\r\n  getSelectedRowIds(): (string | null)[] {\r\n    return this.foundation!.getSelectedRowIds();\r\n  }\r\n\r\n  /**\r\n   * Sets selected row ids. Overwrites previously selected rows.\r\n   * @param rowIds Array of row ids that needs to be selected.\r\n   */\r\n  setSelectedRowIds(rowIds: string[]) {\r\n    this.foundation?.setSelectedRowIds(rowIds);\r\n  }\r\n\r\n  handleEvent(evt: Event): void {\r\n    switch (evt.currentTarget) {\r\n      case this.header:\r\n        switch (evt.type) {\r\n          case 'change': this.handleHeaderRowCheckboxChange(); break;\r\n          case 'click': this.handleHeaderRowClick(evt); break;\r\n        }\r\n        break;\r\n      case this.content:\r\n        switch (evt.type) {\r\n          case 'change': this.handleRowCheckboxChange(evt); break;\r\n        }\r\n        break;\r\n    }\r\n  }\r\n\r\n  beforeFoundationCreated() {\r\n    this.header = this.root.querySelector<HTMLElement>(`.${cssClasses.HEADER_ROW}`)!;\r\n    this.content = this.root.querySelector<HTMLElement>(`.${cssClasses.CONTENT}`)!;\r\n    this.header.addEventListener('click', this);\r\n    this.header.querySelectorAll('th[resizeable]').forEach(x => {\r\n      const resizeHandle = document.createElement('div');\r\n      resizeHandle.addEventListener('mousedown', (event) => this.startColumnResize(event, x as HTMLElement));\r\n      x.insertBefore(document.createElement('div'), x.firstChild).classList.add('mdc-data-table__header-cell__hover-indicator');\r\n      x.appendChild(resizeHandle).classList.add('mdc-data-table__header-cell__resize-handle');\r\n    });\r\n    if (this.saveColumnWidths) {\r\n      this.restoreColumnWidths();\r\n      this.mutationObserver = new MutationObserver(() => this.restoreColumnWidths());\r\n      this.mutationObserver.observe(this.content, { childList: true, subtree: false });\r\n    }\r\n\r\n    if (!this.manualCheckboxHandling) {\r\n      this.header.addEventListener('change', this);\r\n      this.content.addEventListener('change', this);\r\n    }\r\n\r\n    const rowCheckboxList = this.rowCheckboxList;\r\n    this.rowCheckboxList.forEach(x => x.root.classList.add(cssClasses.ROW_CHECKBOX));\r\n    if (this.headerRowCheckbox) {\r\n      this.headerRowCheckbox.root.classList.add(cssClasses.HEADER_ROW_CHECKBOX);\r\n      rowCheckboxList.push(this.headerRowCheckbox);\r\n    }\r\n  }\r\n\r\n  public restoreColumnWidths() {\r\n    const widths = JSON.parse(localStorage.getItem(`mdc-data-table-${this.root.id}-column-widths`) ?? '[]');\r\n    this.setColumnWidths(widths);\r\n  }\r\n\r\n  initialSyncWithDOM() {\r\n    if (this.busy !== undefined) {\r\n      this.busyChanged();\r\n    }\r\n    if (!this.manualCheckboxHandling) {\r\n      const rowCheckboxList = this.rowCheckboxList;\r\n      for (let i = 0; i < rowCheckboxList.length; ++i) {\r\n        if (rowCheckboxList[i].checked) {\r\n          this.getRowByIndex(i).classList.add(cssClasses.ROW_SELECTED);\r\n        }\r\n      }\r\n    }\r\n    this.foundation?.layout();\r\n  }\r\n\r\n  private startColumnResize(event: MouseEvent, headerCell: HTMLElement): void {\r\n    this.columnResized = true;\r\n    const startX = event.clientX;\r\n    const resizeHandle = event.target as HTMLElement;\r\n    const initialHandlePosition = resizeHandle.offsetLeft;\r\n\r\n    // Create a visual indicator for the resize handle\r\n    const handleIndicator = document.createElement('div');\r\n    handleIndicator.classList.add('mdc-data-table__header-cell__resize-handle-indicator');\r\n    handleIndicator.style.left = `${initialHandlePosition}px`;\r\n    handleIndicator.style.height = `${headerCell.offsetHeight}px`;\r\n    document.body.style.cursor = 'col-resize';\r\n    headerCell.classList.add('mdc-data-table__header-cell--resizing');\r\n    headerCell.appendChild(handleIndicator);\r\n\r\n    const onMouseMove = (moveEvent: MouseEvent) => {\r\n      const deltaX = moveEvent.clientX - startX;\r\n      handleIndicator.style.left = `${Math.max(initialHandlePosition + deltaX, headerCell.clientLeft)}px`;\r\n    };\r\n\r\n    const onMouseUp = () => {\r\n      const finalDeltaX = parseInt(handleIndicator.style.left, 10) - initialHandlePosition;\r\n      const newWidth = Math.max(5, headerCell.offsetWidth + finalDeltaX); // Minimum width of 5px\r\n\r\n      // Apply the new width to the column\r\n      headerCell.style.minWidth = headerCell.style.maxWidth = `${newWidth}px`;\r\n      this.content.querySelectorAll(`tr td:nth-child(${Array.from(headerCell.parentElement!.children).indexOf(headerCell) + 1})`)\r\n        .forEach((cell: HTMLElement) => {\r\n          cell.style.minWidth = cell.style.maxWidth = `${newWidth}px`;\r\n        });\r\n\r\n      // Clean up\r\n      handleIndicator.remove();\r\n      this.columnResized = false;\r\n      document.body.style.cursor = '';\r\n      headerCell.classList.remove('mdc-data-table__header-cell--resizing');\r\n      document.removeEventListener('mousemove', onMouseMove);\r\n      document.removeEventListener('mouseup', onMouseUp);\r\n\r\n      // Save the new widths if required\r\n      const widths = this.getHeaderCells().map(x => x.style.minWidth);\r\n      if (this.saveColumnWidths) {\r\n        localStorage.setItem(`mdc-data-table-${this.root.id}-column-widths`, JSON.stringify(widths));\r\n      }\r\n\r\n      this.emit<MDCDataTableColumnsResizedEventDetail>('mdcdatatable:columnsresized', { widths }, true);\r\n    };\r\n\r\n    document.addEventListener('mousemove', onMouseMove);\r\n    document.addEventListener('mouseup', onMouseUp);\r\n  }\r\n\r\n  destroy() {\r\n    this.header.removeEventListener('change', this);\r\n    this.header.removeEventListener('click', this);\r\n    this.content.removeEventListener('change', this);\r\n    this.mutationObserver?.disconnect();\r\n  }\r\n\r\n  public setColumnWidths(widths: string[]) {\r\n    if (!widths || widths.length === 0) {\r\n      return;\r\n    }\r\n    this.getHeaderCells().forEach((x, i) => {\r\n      x.style.minWidth = x.style.maxWidth = widths[i];\r\n      this.content.querySelectorAll(`tr td:nth-child(${i + 1})`).forEach((cell: HTMLElement) => {\r\n        cell.style.minWidth = cell.style.maxWidth = widths[i];\r\n      });\r\n    });\r\n  }\r\n\r\n  getDefaultFoundation() {\r\n    // DO NOT INLINE this variable. For backward compatibility, foundations take a Partial<MDCFooAdapter>.\r\n    // To ensure we don't accidentally omit any methods, we need a separate, strongly typed adapter variable.\r\n    // tslint:disable:object-literal-sort-keys Methods should be in the same order as the adapter interface.\r\n    const adapter: MDCDataTableAdapter = {\r\n      addClass: (className) => this.root.classList.add(className),\r\n      removeClass: (className) => this.root.classList.remove(className),\r\n      getHeaderCellElements: () => this.getHeaderCells(),\r\n      getHeaderCellCount: () => this.getHeaderCells().length,\r\n      getAttributeByHeaderCellIndex: (index, attribute) => this.getHeaderCells()[index].getAttribute(attribute),\r\n      setAttributeByHeaderCellIndex: (index, attribute, value) => this.getHeaderCells()[index].setAttribute(attribute, value),\r\n      setClassNameByHeaderCellIndex: (index, className) => this.getHeaderCells()[index].classList.add(className),\r\n      removeClassNameByHeaderCellIndex: (index, className) => {\r\n        this.getHeaderCells()[index].classList.remove(className);\r\n      },\r\n      notifySortAction: (data) => {\r\n        this.emit(events.SORTED, data, /** shouldBubble */ true);\r\n      },\r\n      getTableContainerHeight: () => {\r\n        const tableContainer =\r\n          this.root.querySelector<HTMLElement>(`.${cssClasses.TABLE_CONTAINER}`);\r\n\r\n        if (!tableContainer) {\r\n          throw new Error('MDCDataTable: Table container element not found.');\r\n        }\r\n\r\n        // eslint-disable-next-line @typescript-eslint/no-explicit-any\r\n        return tableContainer.getBoundingClientRect().height as any;\r\n      },\r\n      getTableHeaderHeight: () => {\r\n        const tableHeader =\r\n          this.root.querySelector<HTMLElement>(selectors.HEADER_ROW);\r\n\r\n        if (!tableHeader) {\r\n          throw new Error('MDCDataTable: Table header element not found.');\r\n        }\r\n\r\n        return tableHeader.getBoundingClientRect().height;\r\n      },\r\n      setProgressIndicatorStyles: (styles) => {\r\n        const progressIndicator = this.root.querySelector<HTMLElement>(selectors.PROGRESS_INDICATOR);\r\n\r\n        if (!progressIndicator) {\r\n          throw new Error('MDCDataTable: Progress indicator element not found.');\r\n        }\r\n\r\n        Object.assign(progressIndicator.style, styles);\r\n      },\r\n      addClassAtRowIndex: (rowIndex: number, className: string) => {\r\n        this.getRows()[rowIndex].classList.add(className);\r\n      },\r\n      getRowCount: () => this.getRows().length,\r\n      getRowElements: () => [].slice.call(this.root.querySelectorAll(selectors.ROW)) as Element[],\r\n      getRowIdAtIndex: (rowIndex: number) =>\r\n        this.getRows()[rowIndex].getAttribute(dataAttributes.ROW_ID),\r\n      getRowIndexByChildElement: (el: Element) => this.getRows().indexOf((closest(el, selectors.ROW) as HTMLElement)),\r\n      getSelectedRowCount: () => this.root.querySelectorAll(selectors.ROW_SELECTED).length,\r\n      isCheckboxAtRowIndexChecked: (rowIndex: number) => this.rowCheckboxList[rowIndex].checked,\r\n      isHeaderRowCheckboxChecked: () => this.headerRowCheckbox?.checked ?? false,\r\n      isRowsSelectable: () => !!this.root.querySelector(selectors.ROW_CHECKBOX),\r\n      notifyRowSelectionChanged:\r\n        (data: MDCDataTableRowSelectionChangedEventDetail) => {\r\n          this.emit(\r\n            events.ROW_SELECTION_CHANGED, {\r\n            row: this.getRowByIndex(data.rowIndex),\r\n            rowId: this.getRowIdByIndex(data.rowIndex),\r\n            rowIndex: data.rowIndex,\r\n            selected: data.selected,\r\n          }, /** shouldBubble */ true);\r\n        },\r\n      notifySelectedAll: () => {\r\n        this.emit(events.SELECTED_ALL, {}, /** shouldBubble */ true);\r\n      },\r\n      notifyUnselectedAll: () => {\r\n        this.emit(events.UNSELECTED_ALL, {}, /** shouldBubble */ true);\r\n      },\r\n      notifyRowClick: (data: RowClickEventData) => {\r\n        this.emit(events.ROW_CLICK, data, /** shouldBubble */ true);\r\n      },\r\n      registerHeaderRowCheckbox: () => {\r\n        // const checkboxEl = this.root.querySelector<IMdcCheckboxElement>(selectors.HEADER_ROW_CHECKBOX);\r\n        // this.headerRowCheckbox = checkboxEl?.au?.controller.viewModel;\r\n      },\r\n      registerRowCheckboxes: () => {\r\n        // this.rowCheckboxList = [];\r\n        // this.getRows().forEach((rowEl) => {\r\n        //   const checkbox = rowEl.querySelector<IMdcCheckboxElement>(selectors.ROW_CHECKBOX)?.au?.controller.viewModel;\r\n        //   if (checkbox) {\r\n        //     this.rowCheckboxList.push(checkbox);\r\n        //   }\r\n        // });\r\n      },\r\n      removeClassAtRowIndex: (rowIndex: number, className: string) => {\r\n        this.getRows()[rowIndex].classList.remove(className);\r\n      },\r\n      setAttributeAtRowIndex:\r\n        (rowIndex: number, attr: string, value: string) => {\r\n          this.getRows()[rowIndex].setAttribute(attr, value);\r\n        },\r\n      setHeaderRowCheckboxChecked: (checked: boolean) => {\r\n        if (this.headerRowCheckbox) {\r\n          this.headerRowCheckbox.checked = checked;\r\n        }\r\n      },\r\n      setHeaderRowCheckboxIndeterminate: (indeterminate: boolean) => {\r\n        if (this.headerRowCheckbox) {\r\n          this.headerRowCheckbox.indeterminate = indeterminate;\r\n        }\r\n      },\r\n      setRowCheckboxCheckedAtIndex: (rowIndex: number, checked: boolean) => {\r\n        this.rowCheckboxList[rowIndex].checked = checked;\r\n      },\r\n      setSortStatusLabelByHeaderCellIndex: (\r\n        columnIndex: number, sortValue: SortValue) => {\r\n        const headerCell = this.getHeaderCells()[columnIndex];\r\n        const sortStatusLabel =\r\n          headerCell.querySelector<HTMLElement>(selectors.SORT_STATUS_LABEL);\r\n\r\n        if (!sortStatusLabel) {\r\n          return;\r\n        }\r\n\r\n        sortStatusLabel.textContent =\r\n          this.getSortStatusMessageBySortValue(sortValue);\r\n      }\r\n    };\r\n    return new MDCDataTableFoundation(adapter);\r\n  }\r\n\r\n  private getRowByIndex(index: number): Element {\r\n    return this.getRows()[index];\r\n  }\r\n\r\n  private getRowIdByIndex(index: number): string | null {\r\n    return this.getRowByIndex(index).getAttribute(dataAttributes.ROW_ID);\r\n  }\r\n\r\n  private handleHeaderRowClick(event: Event): void {\r\n    const headerCell =\r\n      closest(event.target as Element, selectors.HEADER_CELL_WITH_SORT) as\r\n      HTMLElement;\r\n\r\n    if (!headerCell) {\r\n      return;\r\n    }\r\n\r\n    const columnId = headerCell.getAttribute(dataAttributes.COLUMN_ID);\r\n    const columnIndex = this.getHeaderCells().indexOf(headerCell);\r\n    if (columnIndex === -1) {\r\n      return;\r\n    }\r\n\r\n    this.foundation?.handleSortAction({ columnId, columnIndex, headerCell });\r\n  }\r\n\r\n  private getSortStatusMessageBySortValue(sortValue: SortValue): string {\r\n    switch (sortValue) {\r\n      case SortValue.ASCENDING:\r\n        return messages.SORTED_IN_ASCENDING;\r\n      case SortValue.DESCENDING:\r\n        return messages.SORTED_IN_DESCENDING;\r\n      default:\r\n        return '';\r\n    }\r\n  }\r\n\r\n  private getRowIdByRowElement(rowElement: HTMLElement): string | null {\r\n    return rowElement.getAttribute(dataAttributes.ROW_ID);\r\n  }\r\n}\r\n"]}