| /** |
| * @license |
| * Copyright Google LLC All Rights Reserved. |
| * |
| * Use of this source code is governed by an MIT-style license that can be |
| * found in the LICENSE file at https://angular.io/license |
| */ |
| import { __extends } from 'tslib'; |
| import { coerceBooleanProperty } from '@angular/cdk/coercion'; |
| import { ContentChild, Directive, ElementRef, Input, TemplateRef, ChangeDetectionStrategy, Component, IterableDiffers, ViewContainerRef, ViewEncapsulation, Attribute, ChangeDetectorRef, ContentChildren, EmbeddedViewRef, Inject, isDevMode, Optional, ViewChild, InjectionToken, NgModule } from '@angular/core'; |
| import { Directionality } from '@angular/cdk/bidi'; |
| import { isDataSource } from '@angular/cdk/collections'; |
| export { DataSource } from '@angular/cdk/collections'; |
| import { Platform } from '@angular/cdk/platform'; |
| import { DOCUMENT, CommonModule } from '@angular/common'; |
| import { BehaviorSubject, Observable, of, Subject } from 'rxjs'; |
| import { takeUntil } from 'rxjs/operators'; |
| |
| /** |
| * @fileoverview added by tsickle |
| * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc |
| */ |
| /** |
| * Mixin to provide a directive with a function that checks if the sticky input has been |
| * changed since the last time the function was called. Essentially adds a dirty-check to the |
| * sticky value. |
| * \@docs-private |
| * @template T |
| * @param {?} base |
| * @return {?} |
| */ |
| function mixinHasStickyInput(base) { |
| return /** @class */ (function (_super) { |
| __extends(class_1, _super); |
| function class_1() { |
| var args = []; |
| for (var _i = 0; _i < arguments.length; _i++) { |
| args[_i] = arguments[_i]; |
| } |
| var _this = _super.apply(this, args) || this; |
| _this._sticky = false; |
| /** |
| * Whether the sticky input has changed since it was last checked. |
| */ |
| _this._hasStickyChanged = false; |
| return _this; |
| } |
| Object.defineProperty(class_1.prototype, "sticky", { |
| /** Whether sticky positioning should be applied. */ |
| get: /** |
| * Whether sticky positioning should be applied. |
| * @return {?} |
| */ |
| function () { return this._sticky; }, |
| set: /** |
| * @param {?} v |
| * @return {?} |
| */ |
| function (v) { |
| /** @type {?} */ |
| var prevValue = this._sticky; |
| this._sticky = coerceBooleanProperty(v); |
| this._hasStickyChanged = prevValue !== this._sticky; |
| }, |
| enumerable: true, |
| configurable: true |
| }); |
| /** Whether the sticky value has changed since this was last called. */ |
| /** |
| * Whether the sticky value has changed since this was last called. |
| * @return {?} |
| */ |
| class_1.prototype.hasStickyChanged = /** |
| * Whether the sticky value has changed since this was last called. |
| * @return {?} |
| */ |
| function () { |
| /** @type {?} */ |
| var hasStickyChanged = this._hasStickyChanged; |
| this._hasStickyChanged = false; |
| return hasStickyChanged; |
| }; |
| /** Resets the dirty check for cases where the sticky state has been used without checking. */ |
| /** |
| * Resets the dirty check for cases where the sticky state has been used without checking. |
| * @return {?} |
| */ |
| class_1.prototype.resetStickyChanged = /** |
| * Resets the dirty check for cases where the sticky state has been used without checking. |
| * @return {?} |
| */ |
| function () { |
| this._hasStickyChanged = false; |
| }; |
| return class_1; |
| }(base)); |
| } |
| |
| /** |
| * @fileoverview added by tsickle |
| * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc |
| */ |
| /** |
| * Cell definition for a CDK table. |
| * Captures the template of a column's data row cell as well as cell-specific properties. |
| */ |
| var CdkCellDef = /** @class */ (function () { |
| function CdkCellDef(/** @docs-private */ template) { |
| this.template = template; |
| } |
| CdkCellDef.decorators = [ |
| { type: Directive, args: [{ selector: '[cdkCellDef]' },] }, |
| ]; |
| /** @nocollapse */ |
| CdkCellDef.ctorParameters = function () { return [ |
| { type: TemplateRef } |
| ]; }; |
| return CdkCellDef; |
| }()); |
| /** |
| * Header cell definition for a CDK table. |
| * Captures the template of a column's header cell and as well as cell-specific properties. |
| */ |
| var CdkHeaderCellDef = /** @class */ (function () { |
| function CdkHeaderCellDef(/** @docs-private */ template) { |
| this.template = template; |
| } |
| CdkHeaderCellDef.decorators = [ |
| { type: Directive, args: [{ selector: '[cdkHeaderCellDef]' },] }, |
| ]; |
| /** @nocollapse */ |
| CdkHeaderCellDef.ctorParameters = function () { return [ |
| { type: TemplateRef } |
| ]; }; |
| return CdkHeaderCellDef; |
| }()); |
| /** |
| * Footer cell definition for a CDK table. |
| * Captures the template of a column's footer cell and as well as cell-specific properties. |
| */ |
| var CdkFooterCellDef = /** @class */ (function () { |
| function CdkFooterCellDef(/** @docs-private */ template) { |
| this.template = template; |
| } |
| CdkFooterCellDef.decorators = [ |
| { type: Directive, args: [{ selector: '[cdkFooterCellDef]' },] }, |
| ]; |
| /** @nocollapse */ |
| CdkFooterCellDef.ctorParameters = function () { return [ |
| { type: TemplateRef } |
| ]; }; |
| return CdkFooterCellDef; |
| }()); |
| // Boilerplate for applying mixins to CdkColumnDef. |
| /** |
| * \@docs-private |
| */ |
| var |
| // Boilerplate for applying mixins to CdkColumnDef. |
| /** |
| * \@docs-private |
| */ |
| CdkColumnDefBase = /** @class */ (function () { |
| function CdkColumnDefBase() { |
| } |
| return CdkColumnDefBase; |
| }()); |
| /** @type {?} */ |
| var _CdkColumnDefBase = mixinHasStickyInput(CdkColumnDefBase); |
| /** |
| * Column definition for the CDK table. |
| * Defines a set of cells available for a table column. |
| */ |
| var CdkColumnDef = /** @class */ (function (_super) { |
| __extends(CdkColumnDef, _super); |
| function CdkColumnDef() { |
| var _this = _super !== null && _super.apply(this, arguments) || this; |
| _this._stickyEnd = false; |
| return _this; |
| } |
| Object.defineProperty(CdkColumnDef.prototype, "name", { |
| /** Unique name for this column. */ |
| get: /** |
| * Unique name for this column. |
| * @return {?} |
| */ |
| function () { |
| return this._name; |
| }, |
| set: /** |
| * @param {?} name |
| * @return {?} |
| */ |
| function (name) { |
| // If the directive is set without a name (updated programatically), then this setter will |
| // trigger with an empty string and should not overwrite the programatically set value. |
| if (!name) { |
| return; |
| } |
| this._name = name; |
| this.cssClassFriendlyName = name.replace(/[^a-z0-9_-]/ig, '-'); |
| }, |
| enumerable: true, |
| configurable: true |
| }); |
| Object.defineProperty(CdkColumnDef.prototype, "stickyEnd", { |
| /** |
| * Whether this column should be sticky positioned on the end of the row. Should make sure |
| * that it mimics the `CanStick` mixin such that `_hasStickyChanged` is set to true if the value |
| * has been changed. |
| */ |
| get: /** |
| * Whether this column should be sticky positioned on the end of the row. Should make sure |
| * that it mimics the `CanStick` mixin such that `_hasStickyChanged` is set to true if the value |
| * has been changed. |
| * @return {?} |
| */ |
| function () { |
| return this._stickyEnd; |
| }, |
| set: /** |
| * @param {?} v |
| * @return {?} |
| */ |
| function (v) { |
| /** @type {?} */ |
| var prevValue = this._stickyEnd; |
| this._stickyEnd = coerceBooleanProperty(v); |
| this._hasStickyChanged = prevValue !== this._stickyEnd; |
| }, |
| enumerable: true, |
| configurable: true |
| }); |
| CdkColumnDef.decorators = [ |
| { type: Directive, args: [{ |
| selector: '[cdkColumnDef]', |
| inputs: ['sticky'], |
| providers: [{ provide: 'MAT_SORT_HEADER_COLUMN_DEF', useExisting: CdkColumnDef }], |
| },] }, |
| ]; |
| CdkColumnDef.propDecorators = { |
| name: [{ type: Input, args: ['cdkColumnDef',] }], |
| stickyEnd: [{ type: Input, args: ['stickyEnd',] }], |
| cell: [{ type: ContentChild, args: [CdkCellDef, { static: false },] }], |
| headerCell: [{ type: ContentChild, args: [CdkHeaderCellDef, { static: false },] }], |
| footerCell: [{ type: ContentChild, args: [CdkFooterCellDef, { static: false },] }] |
| }; |
| return CdkColumnDef; |
| }(_CdkColumnDefBase)); |
| /** |
| * Base class for the cells. Adds a CSS classname that identifies the column it renders in. |
| */ |
| var /** |
| * Base class for the cells. Adds a CSS classname that identifies the column it renders in. |
| */ |
| BaseCdkCell = /** @class */ (function () { |
| function BaseCdkCell(columnDef, elementRef) { |
| /** @type {?} */ |
| var columnClassName = "cdk-column-" + columnDef.cssClassFriendlyName; |
| elementRef.nativeElement.classList.add(columnClassName); |
| } |
| return BaseCdkCell; |
| }()); |
| /** |
| * Header cell template container that adds the right classes and role. |
| */ |
| var CdkHeaderCell = /** @class */ (function (_super) { |
| __extends(CdkHeaderCell, _super); |
| function CdkHeaderCell(columnDef, elementRef) { |
| return _super.call(this, columnDef, elementRef) || this; |
| } |
| CdkHeaderCell.decorators = [ |
| { type: Directive, args: [{ |
| selector: 'cdk-header-cell, th[cdk-header-cell]', |
| host: { |
| 'class': 'cdk-header-cell', |
| 'role': 'columnheader', |
| }, |
| },] }, |
| ]; |
| /** @nocollapse */ |
| CdkHeaderCell.ctorParameters = function () { return [ |
| { type: CdkColumnDef }, |
| { type: ElementRef } |
| ]; }; |
| return CdkHeaderCell; |
| }(BaseCdkCell)); |
| /** |
| * Footer cell template container that adds the right classes and role. |
| */ |
| var CdkFooterCell = /** @class */ (function (_super) { |
| __extends(CdkFooterCell, _super); |
| function CdkFooterCell(columnDef, elementRef) { |
| return _super.call(this, columnDef, elementRef) || this; |
| } |
| CdkFooterCell.decorators = [ |
| { type: Directive, args: [{ |
| selector: 'cdk-footer-cell, td[cdk-footer-cell]', |
| host: { |
| 'class': 'cdk-footer-cell', |
| 'role': 'gridcell', |
| }, |
| },] }, |
| ]; |
| /** @nocollapse */ |
| CdkFooterCell.ctorParameters = function () { return [ |
| { type: CdkColumnDef }, |
| { type: ElementRef } |
| ]; }; |
| return CdkFooterCell; |
| }(BaseCdkCell)); |
| /** |
| * Cell template container that adds the right classes and role. |
| */ |
| var CdkCell = /** @class */ (function (_super) { |
| __extends(CdkCell, _super); |
| function CdkCell(columnDef, elementRef) { |
| return _super.call(this, columnDef, elementRef) || this; |
| } |
| CdkCell.decorators = [ |
| { type: Directive, args: [{ |
| selector: 'cdk-cell, td[cdk-cell]', |
| host: { |
| 'class': 'cdk-cell', |
| 'role': 'gridcell', |
| }, |
| },] }, |
| ]; |
| /** @nocollapse */ |
| CdkCell.ctorParameters = function () { return [ |
| { type: CdkColumnDef }, |
| { type: ElementRef } |
| ]; }; |
| return CdkCell; |
| }(BaseCdkCell)); |
| |
| /** |
| * @fileoverview added by tsickle |
| * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc |
| */ |
| /** |
| * The row template that can be used by the mat-table. Should not be used outside of the |
| * material library. |
| * @type {?} |
| */ |
| var CDK_ROW_TEMPLATE = "<ng-container cdkCellOutlet></ng-container>"; |
| /** |
| * Base class for the CdkHeaderRowDef and CdkRowDef that handles checking their columns inputs |
| * for changes and notifying the table. |
| * @abstract |
| */ |
| var /** |
| * Base class for the CdkHeaderRowDef and CdkRowDef that handles checking their columns inputs |
| * for changes and notifying the table. |
| * @abstract |
| */ |
| BaseRowDef = /** @class */ (function () { |
| function BaseRowDef(template, _differs) { |
| this.template = template; |
| this._differs = _differs; |
| } |
| /** |
| * @param {?} changes |
| * @return {?} |
| */ |
| BaseRowDef.prototype.ngOnChanges = /** |
| * @param {?} changes |
| * @return {?} |
| */ |
| function (changes) { |
| // Create a new columns differ if one does not yet exist. Initialize it based on initial value |
| // of the columns property or an empty array if none is provided. |
| if (!this._columnsDiffer) { |
| /** @type {?} */ |
| var columns = (changes['columns'] && changes['columns'].currentValue) || []; |
| this._columnsDiffer = this._differs.find(columns).create(); |
| this._columnsDiffer.diff(columns); |
| } |
| }; |
| /** |
| * Returns the difference between the current columns and the columns from the last diff, or null |
| * if there is no difference. |
| */ |
| /** |
| * Returns the difference between the current columns and the columns from the last diff, or null |
| * if there is no difference. |
| * @return {?} |
| */ |
| BaseRowDef.prototype.getColumnsDiff = /** |
| * Returns the difference between the current columns and the columns from the last diff, or null |
| * if there is no difference. |
| * @return {?} |
| */ |
| function () { |
| return this._columnsDiffer.diff(this.columns); |
| }; |
| /** Gets this row def's relevant cell template from the provided column def. */ |
| /** |
| * Gets this row def's relevant cell template from the provided column def. |
| * @param {?} column |
| * @return {?} |
| */ |
| BaseRowDef.prototype.extractCellTemplate = /** |
| * Gets this row def's relevant cell template from the provided column def. |
| * @param {?} column |
| * @return {?} |
| */ |
| function (column) { |
| if (this instanceof CdkHeaderRowDef) { |
| return column.headerCell.template; |
| } |
| if (this instanceof CdkFooterRowDef) { |
| return column.footerCell.template; |
| } |
| else { |
| return column.cell.template; |
| } |
| }; |
| return BaseRowDef; |
| }()); |
| // Boilerplate for applying mixins to CdkHeaderRowDef. |
| /** |
| * \@docs-private |
| */ |
| var |
| // Boilerplate for applying mixins to CdkHeaderRowDef. |
| /** |
| * \@docs-private |
| */ |
| CdkHeaderRowDefBase = /** @class */ (function (_super) { |
| __extends(CdkHeaderRowDefBase, _super); |
| function CdkHeaderRowDefBase() { |
| return _super !== null && _super.apply(this, arguments) || this; |
| } |
| return CdkHeaderRowDefBase; |
| }(BaseRowDef)); |
| /** @type {?} */ |
| var _CdkHeaderRowDefBase = mixinHasStickyInput(CdkHeaderRowDefBase); |
| /** |
| * Header row definition for the CDK table. |
| * Captures the header row's template and other header properties such as the columns to display. |
| */ |
| var CdkHeaderRowDef = /** @class */ (function (_super) { |
| __extends(CdkHeaderRowDef, _super); |
| function CdkHeaderRowDef(template, _differs) { |
| return _super.call(this, template, _differs) || this; |
| } |
| // Prerender fails to recognize that ngOnChanges in a part of this class through inheritance. |
| // Explicitly define it so that the method is called as part of the Angular lifecycle. |
| // Prerender fails to recognize that ngOnChanges in a part of this class through inheritance. |
| // Explicitly define it so that the method is called as part of the Angular lifecycle. |
| /** |
| * @param {?} changes |
| * @return {?} |
| */ |
| CdkHeaderRowDef.prototype.ngOnChanges = |
| // Prerender fails to recognize that ngOnChanges in a part of this class through inheritance. |
| // Explicitly define it so that the method is called as part of the Angular lifecycle. |
| /** |
| * @param {?} changes |
| * @return {?} |
| */ |
| function (changes) { |
| _super.prototype.ngOnChanges.call(this, changes); |
| }; |
| CdkHeaderRowDef.decorators = [ |
| { type: Directive, args: [{ |
| selector: '[cdkHeaderRowDef]', |
| inputs: ['columns: cdkHeaderRowDef', 'sticky: cdkHeaderRowDefSticky'], |
| },] }, |
| ]; |
| /** @nocollapse */ |
| CdkHeaderRowDef.ctorParameters = function () { return [ |
| { type: TemplateRef }, |
| { type: IterableDiffers } |
| ]; }; |
| return CdkHeaderRowDef; |
| }(_CdkHeaderRowDefBase)); |
| // Boilerplate for applying mixins to CdkFooterRowDef. |
| /** |
| * \@docs-private |
| */ |
| var |
| // Boilerplate for applying mixins to CdkFooterRowDef. |
| /** |
| * \@docs-private |
| */ |
| CdkFooterRowDefBase = /** @class */ (function (_super) { |
| __extends(CdkFooterRowDefBase, _super); |
| function CdkFooterRowDefBase() { |
| return _super !== null && _super.apply(this, arguments) || this; |
| } |
| return CdkFooterRowDefBase; |
| }(BaseRowDef)); |
| /** @type {?} */ |
| var _CdkFooterRowDefBase = mixinHasStickyInput(CdkFooterRowDefBase); |
| /** |
| * Footer row definition for the CDK table. |
| * Captures the footer row's template and other footer properties such as the columns to display. |
| */ |
| var CdkFooterRowDef = /** @class */ (function (_super) { |
| __extends(CdkFooterRowDef, _super); |
| function CdkFooterRowDef(template, _differs) { |
| return _super.call(this, template, _differs) || this; |
| } |
| // Prerender fails to recognize that ngOnChanges in a part of this class through inheritance. |
| // Explicitly define it so that the method is called as part of the Angular lifecycle. |
| // Prerender fails to recognize that ngOnChanges in a part of this class through inheritance. |
| // Explicitly define it so that the method is called as part of the Angular lifecycle. |
| /** |
| * @param {?} changes |
| * @return {?} |
| */ |
| CdkFooterRowDef.prototype.ngOnChanges = |
| // Prerender fails to recognize that ngOnChanges in a part of this class through inheritance. |
| // Explicitly define it so that the method is called as part of the Angular lifecycle. |
| /** |
| * @param {?} changes |
| * @return {?} |
| */ |
| function (changes) { |
| _super.prototype.ngOnChanges.call(this, changes); |
| }; |
| CdkFooterRowDef.decorators = [ |
| { type: Directive, args: [{ |
| selector: '[cdkFooterRowDef]', |
| inputs: ['columns: cdkFooterRowDef', 'sticky: cdkFooterRowDefSticky'], |
| },] }, |
| ]; |
| /** @nocollapse */ |
| CdkFooterRowDef.ctorParameters = function () { return [ |
| { type: TemplateRef }, |
| { type: IterableDiffers } |
| ]; }; |
| return CdkFooterRowDef; |
| }(_CdkFooterRowDefBase)); |
| /** |
| * Data row definition for the CDK table. |
| * Captures the header row's template and other row properties such as the columns to display and |
| * a when predicate that describes when this row should be used. |
| * @template T |
| */ |
| var CdkRowDef = /** @class */ (function (_super) { |
| __extends(CdkRowDef, _super); |
| // TODO(andrewseguin): Add an input for providing a switch function to determine |
| // if this template should be used. |
| function CdkRowDef(template, _differs) { |
| return _super.call(this, template, _differs) || this; |
| } |
| CdkRowDef.decorators = [ |
| { type: Directive, args: [{ |
| selector: '[cdkRowDef]', |
| inputs: ['columns: cdkRowDefColumns', 'when: cdkRowDefWhen'], |
| },] }, |
| ]; |
| /** @nocollapse */ |
| CdkRowDef.ctorParameters = function () { return [ |
| { type: TemplateRef }, |
| { type: IterableDiffers } |
| ]; }; |
| return CdkRowDef; |
| }(BaseRowDef)); |
| /** |
| * Outlet for rendering cells inside of a row or header row. |
| * \@docs-private |
| */ |
| var CdkCellOutlet = /** @class */ (function () { |
| function CdkCellOutlet(_viewContainer) { |
| this._viewContainer = _viewContainer; |
| CdkCellOutlet.mostRecentCellOutlet = this; |
| } |
| /** |
| * @return {?} |
| */ |
| CdkCellOutlet.prototype.ngOnDestroy = /** |
| * @return {?} |
| */ |
| function () { |
| // If this was the last outlet being rendered in the view, remove the reference |
| // from the static property after it has been destroyed to avoid leaking memory. |
| if (CdkCellOutlet.mostRecentCellOutlet === this) { |
| CdkCellOutlet.mostRecentCellOutlet = null; |
| } |
| }; |
| /** |
| * Static property containing the latest constructed instance of this class. |
| * Used by the CDK table when each CdkHeaderRow and CdkRow component is created using |
| * createEmbeddedView. After one of these components are created, this property will provide |
| * a handle to provide that component's cells and context. After init, the CdkCellOutlet will |
| * construct the cells with the provided context. |
| */ |
| CdkCellOutlet.mostRecentCellOutlet = null; |
| CdkCellOutlet.decorators = [ |
| { type: Directive, args: [{ selector: '[cdkCellOutlet]' },] }, |
| ]; |
| /** @nocollapse */ |
| CdkCellOutlet.ctorParameters = function () { return [ |
| { type: ViewContainerRef } |
| ]; }; |
| return CdkCellOutlet; |
| }()); |
| /** |
| * Header template container that contains the cell outlet. Adds the right class and role. |
| */ |
| var CdkHeaderRow = /** @class */ (function () { |
| function CdkHeaderRow() { |
| } |
| CdkHeaderRow.decorators = [ |
| { type: Component, args: [{selector: 'cdk-header-row, tr[cdk-header-row]', |
| template: CDK_ROW_TEMPLATE, |
| host: { |
| 'class': 'cdk-header-row', |
| 'role': 'row', |
| }, |
| // See note on CdkTable for explanation on why this uses the default change detection strategy. |
| // tslint:disable-next-line:validate-decorators |
| changeDetection: ChangeDetectionStrategy.Default, |
| encapsulation: ViewEncapsulation.None, |
| },] }, |
| ]; |
| return CdkHeaderRow; |
| }()); |
| /** |
| * Footer template container that contains the cell outlet. Adds the right class and role. |
| */ |
| var CdkFooterRow = /** @class */ (function () { |
| function CdkFooterRow() { |
| } |
| CdkFooterRow.decorators = [ |
| { type: Component, args: [{selector: 'cdk-footer-row, tr[cdk-footer-row]', |
| template: CDK_ROW_TEMPLATE, |
| host: { |
| 'class': 'cdk-footer-row', |
| 'role': 'row', |
| }, |
| // See note on CdkTable for explanation on why this uses the default change detection strategy. |
| // tslint:disable-next-line:validate-decorators |
| changeDetection: ChangeDetectionStrategy.Default, |
| encapsulation: ViewEncapsulation.None, |
| },] }, |
| ]; |
| return CdkFooterRow; |
| }()); |
| /** |
| * Data row template container that contains the cell outlet. Adds the right class and role. |
| */ |
| var CdkRow = /** @class */ (function () { |
| function CdkRow() { |
| } |
| CdkRow.decorators = [ |
| { type: Component, args: [{selector: 'cdk-row, tr[cdk-row]', |
| template: CDK_ROW_TEMPLATE, |
| host: { |
| 'class': 'cdk-row', |
| 'role': 'row', |
| }, |
| // See note on CdkTable for explanation on why this uses the default change detection strategy. |
| // tslint:disable-next-line:validate-decorators |
| changeDetection: ChangeDetectionStrategy.Default, |
| encapsulation: ViewEncapsulation.None, |
| },] }, |
| ]; |
| return CdkRow; |
| }()); |
| |
| /** |
| * @fileoverview added by tsickle |
| * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc |
| */ |
| |
| /** |
| * List of all possible directions that can be used for sticky positioning. |
| * \@docs-private |
| * @type {?} |
| */ |
| var STICKY_DIRECTIONS = ['top', 'bottom', 'left', 'right']; |
| /** |
| * Applies and removes sticky positioning styles to the `CdkTable` rows and columns cells. |
| * \@docs-private |
| */ |
| var /** |
| * Applies and removes sticky positioning styles to the `CdkTable` rows and columns cells. |
| * \@docs-private |
| */ |
| StickyStyler = /** @class */ (function () { |
| /** |
| * @param _isNativeHtmlTable Whether the sticky logic should be based on a table |
| * that uses the native `<table>` element. |
| * @param _stickCellCss The CSS class that will be applied to every row/cell that has |
| * sticky positioning applied. |
| * @param direction The directionality context of the table (ltr/rtl); affects column positioning |
| * by reversing left/right positions. |
| * @param _isBrowser Whether the table is currently being rendered on the server or the client. |
| */ |
| function StickyStyler(_isNativeHtmlTable, _stickCellCss, direction, _isBrowser) { |
| if (_isBrowser === void 0) { _isBrowser = true; } |
| this._isNativeHtmlTable = _isNativeHtmlTable; |
| this._stickCellCss = _stickCellCss; |
| this.direction = direction; |
| this._isBrowser = _isBrowser; |
| } |
| /** |
| * Clears the sticky positioning styles from the row and its cells by resetting the `position` |
| * style, setting the zIndex to 0, and unsetting each provided sticky direction. |
| * @param rows The list of rows that should be cleared from sticking in the provided directions |
| * @param stickyDirections The directions that should no longer be set as sticky on the rows. |
| */ |
| /** |
| * Clears the sticky positioning styles from the row and its cells by resetting the `position` |
| * style, setting the zIndex to 0, and unsetting each provided sticky direction. |
| * @param {?} rows The list of rows that should be cleared from sticking in the provided directions |
| * @param {?} stickyDirections The directions that should no longer be set as sticky on the rows. |
| * @return {?} |
| */ |
| StickyStyler.prototype.clearStickyPositioning = /** |
| * Clears the sticky positioning styles from the row and its cells by resetting the `position` |
| * style, setting the zIndex to 0, and unsetting each provided sticky direction. |
| * @param {?} rows The list of rows that should be cleared from sticking in the provided directions |
| * @param {?} stickyDirections The directions that should no longer be set as sticky on the rows. |
| * @return {?} |
| */ |
| function (rows, stickyDirections) { |
| for (var _i = 0, rows_1 = rows; _i < rows_1.length; _i++) { |
| var row = rows_1[_i]; |
| // If the row isn't an element (e.g. if it's an `ng-container`), |
| // it won't have inline styles or `children` so we skip it. |
| if (row.nodeType !== row.ELEMENT_NODE) { |
| continue; |
| } |
| this._removeStickyStyle(row, stickyDirections); |
| for (var i = 0; i < row.children.length; i++) { |
| /** @type {?} */ |
| var cell = (/** @type {?} */ (row.children[i])); |
| this._removeStickyStyle(cell, stickyDirections); |
| } |
| } |
| }; |
| /** |
| * Applies sticky left and right positions to the cells of each row according to the sticky |
| * states of the rendered column definitions. |
| * @param rows The rows that should have its set of cells stuck according to the sticky states. |
| * @param stickyStartStates A list of boolean states where each state represents whether the cell |
| * in this index position should be stuck to the start of the row. |
| * @param stickyEndStates A list of boolean states where each state represents whether the cell |
| * in this index position should be stuck to the end of the row. |
| */ |
| /** |
| * Applies sticky left and right positions to the cells of each row according to the sticky |
| * states of the rendered column definitions. |
| * @param {?} rows The rows that should have its set of cells stuck according to the sticky states. |
| * @param {?} stickyStartStates A list of boolean states where each state represents whether the cell |
| * in this index position should be stuck to the start of the row. |
| * @param {?} stickyEndStates A list of boolean states where each state represents whether the cell |
| * in this index position should be stuck to the end of the row. |
| * @return {?} |
| */ |
| StickyStyler.prototype.updateStickyColumns = /** |
| * Applies sticky left and right positions to the cells of each row according to the sticky |
| * states of the rendered column definitions. |
| * @param {?} rows The rows that should have its set of cells stuck according to the sticky states. |
| * @param {?} stickyStartStates A list of boolean states where each state represents whether the cell |
| * in this index position should be stuck to the start of the row. |
| * @param {?} stickyEndStates A list of boolean states where each state represents whether the cell |
| * in this index position should be stuck to the end of the row. |
| * @return {?} |
| */ |
| function (rows, stickyStartStates, stickyEndStates) { |
| /** @type {?} */ |
| var hasStickyColumns = stickyStartStates.some((/** |
| * @param {?} state |
| * @return {?} |
| */ |
| function (state) { return state; })) || stickyEndStates.some((/** |
| * @param {?} state |
| * @return {?} |
| */ |
| function (state) { return state; })); |
| if (!rows.length || !hasStickyColumns || !this._isBrowser) { |
| return; |
| } |
| /** @type {?} */ |
| var firstRow = rows[0]; |
| /** @type {?} */ |
| var numCells = firstRow.children.length; |
| /** @type {?} */ |
| var cellWidths = this._getCellWidths(firstRow); |
| /** @type {?} */ |
| var startPositions = this._getStickyStartColumnPositions(cellWidths, stickyStartStates); |
| /** @type {?} */ |
| var endPositions = this._getStickyEndColumnPositions(cellWidths, stickyEndStates); |
| /** @type {?} */ |
| var isRtl = this.direction === 'rtl'; |
| for (var _i = 0, rows_2 = rows; _i < rows_2.length; _i++) { |
| var row = rows_2[_i]; |
| for (var i = 0; i < numCells; i++) { |
| /** @type {?} */ |
| var cell = (/** @type {?} */ (row.children[i])); |
| if (stickyStartStates[i]) { |
| this._addStickyStyle(cell, isRtl ? 'right' : 'left', startPositions[i]); |
| } |
| if (stickyEndStates[i]) { |
| this._addStickyStyle(cell, isRtl ? 'left' : 'right', endPositions[i]); |
| } |
| } |
| } |
| }; |
| /** |
| * Applies sticky positioning to the row's cells if using the native table layout, and to the |
| * row itself otherwise. |
| * @param rowsToStick The list of rows that should be stuck according to their corresponding |
| * sticky state and to the provided top or bottom position. |
| * @param stickyStates A list of boolean states where each state represents whether the row |
| * should be stuck in the particular top or bottom position. |
| * @param position The position direction in which the row should be stuck if that row should be |
| * sticky. |
| * |
| */ |
| /** |
| * Applies sticky positioning to the row's cells if using the native table layout, and to the |
| * row itself otherwise. |
| * @param {?} rowsToStick The list of rows that should be stuck according to their corresponding |
| * sticky state and to the provided top or bottom position. |
| * @param {?} stickyStates A list of boolean states where each state represents whether the row |
| * should be stuck in the particular top or bottom position. |
| * @param {?} position The position direction in which the row should be stuck if that row should be |
| * sticky. |
| * |
| * @return {?} |
| */ |
| StickyStyler.prototype.stickRows = /** |
| * Applies sticky positioning to the row's cells if using the native table layout, and to the |
| * row itself otherwise. |
| * @param {?} rowsToStick The list of rows that should be stuck according to their corresponding |
| * sticky state and to the provided top or bottom position. |
| * @param {?} stickyStates A list of boolean states where each state represents whether the row |
| * should be stuck in the particular top or bottom position. |
| * @param {?} position The position direction in which the row should be stuck if that row should be |
| * sticky. |
| * |
| * @return {?} |
| */ |
| function (rowsToStick, stickyStates, position) { |
| // Since we can't measure the rows on the server, we can't stick the rows properly. |
| if (!this._isBrowser) { |
| return; |
| } |
| // If positioning the rows to the bottom, reverse their order when evaluating the sticky |
| // position such that the last row stuck will be "bottom: 0px" and so on. |
| /** @type {?} */ |
| var rows = position === 'bottom' ? rowsToStick.reverse() : rowsToStick; |
| /** @type {?} */ |
| var stickyHeight = 0; |
| for (var rowIndex = 0; rowIndex < rows.length; rowIndex++) { |
| if (!stickyStates[rowIndex]) { |
| continue; |
| } |
| /** @type {?} */ |
| var row = rows[rowIndex]; |
| if (this._isNativeHtmlTable) { |
| for (var j = 0; j < row.children.length; j++) { |
| /** @type {?} */ |
| var cell = (/** @type {?} */ (row.children[j])); |
| this._addStickyStyle(cell, position, stickyHeight); |
| } |
| } |
| else { |
| // Flex does not respect the stick positioning on the cells, needs to be applied to the row. |
| // If this is applied on a native table, Safari causes the header to fly in wrong direction. |
| this._addStickyStyle(row, position, stickyHeight); |
| } |
| if (rowIndex === rows.length - 1) { |
| // prevent unnecessary reflow from getBoundingClientRect() |
| return; |
| } |
| stickyHeight += row.getBoundingClientRect().height; |
| } |
| }; |
| /** |
| * When using the native table in Safari, sticky footer cells do not stick. The only way to stick |
| * footer rows is to apply sticky styling to the tfoot container. This should only be done if |
| * all footer rows are sticky. If not all footer rows are sticky, remove sticky positioning from |
| * the tfoot element. |
| */ |
| /** |
| * When using the native table in Safari, sticky footer cells do not stick. The only way to stick |
| * footer rows is to apply sticky styling to the tfoot container. This should only be done if |
| * all footer rows are sticky. If not all footer rows are sticky, remove sticky positioning from |
| * the tfoot element. |
| * @param {?} tableElement |
| * @param {?} stickyStates |
| * @return {?} |
| */ |
| StickyStyler.prototype.updateStickyFooterContainer = /** |
| * When using the native table in Safari, sticky footer cells do not stick. The only way to stick |
| * footer rows is to apply sticky styling to the tfoot container. This should only be done if |
| * all footer rows are sticky. If not all footer rows are sticky, remove sticky positioning from |
| * the tfoot element. |
| * @param {?} tableElement |
| * @param {?} stickyStates |
| * @return {?} |
| */ |
| function (tableElement, stickyStates) { |
| if (!this._isNativeHtmlTable) { |
| return; |
| } |
| /** @type {?} */ |
| var tfoot = (/** @type {?} */ (tableElement.querySelector('tfoot'))); |
| if (stickyStates.some((/** |
| * @param {?} state |
| * @return {?} |
| */ |
| function (state) { return !state; }))) { |
| this._removeStickyStyle(tfoot, ['bottom']); |
| } |
| else { |
| this._addStickyStyle(tfoot, 'bottom', 0); |
| } |
| }; |
| /** |
| * Removes the sticky style on the element by removing the sticky cell CSS class, re-evaluating |
| * the zIndex, removing each of the provided sticky directions, and removing the |
| * sticky position if there are no more directions. |
| */ |
| /** |
| * Removes the sticky style on the element by removing the sticky cell CSS class, re-evaluating |
| * the zIndex, removing each of the provided sticky directions, and removing the |
| * sticky position if there are no more directions. |
| * @param {?} element |
| * @param {?} stickyDirections |
| * @return {?} |
| */ |
| StickyStyler.prototype._removeStickyStyle = /** |
| * Removes the sticky style on the element by removing the sticky cell CSS class, re-evaluating |
| * the zIndex, removing each of the provided sticky directions, and removing the |
| * sticky position if there are no more directions. |
| * @param {?} element |
| * @param {?} stickyDirections |
| * @return {?} |
| */ |
| function (element, stickyDirections) { |
| for (var _i = 0, stickyDirections_1 = stickyDirections; _i < stickyDirections_1.length; _i++) { |
| var dir = stickyDirections_1[_i]; |
| element.style[dir] = ''; |
| } |
| element.style.zIndex = this._getCalculatedZIndex(element); |
| // If the element no longer has any more sticky directions, remove sticky positioning and |
| // the sticky CSS class. |
| /** @type {?} */ |
| var hasDirection = STICKY_DIRECTIONS.some((/** |
| * @param {?} dir |
| * @return {?} |
| */ |
| function (dir) { return !!element.style[dir]; })); |
| if (!hasDirection) { |
| element.style.position = ''; |
| element.classList.remove(this._stickCellCss); |
| } |
| }; |
| /** |
| * Adds the sticky styling to the element by adding the sticky style class, changing position |
| * to be sticky (and -webkit-sticky), setting the appropriate zIndex, and adding a sticky |
| * direction and value. |
| */ |
| /** |
| * Adds the sticky styling to the element by adding the sticky style class, changing position |
| * to be sticky (and -webkit-sticky), setting the appropriate zIndex, and adding a sticky |
| * direction and value. |
| * @param {?} element |
| * @param {?} dir |
| * @param {?} dirValue |
| * @return {?} |
| */ |
| StickyStyler.prototype._addStickyStyle = /** |
| * Adds the sticky styling to the element by adding the sticky style class, changing position |
| * to be sticky (and -webkit-sticky), setting the appropriate zIndex, and adding a sticky |
| * direction and value. |
| * @param {?} element |
| * @param {?} dir |
| * @param {?} dirValue |
| * @return {?} |
| */ |
| function (element, dir, dirValue) { |
| element.classList.add(this._stickCellCss); |
| element.style[dir] = dirValue + "px"; |
| element.style.cssText += 'position: -webkit-sticky; position: sticky; '; |
| element.style.zIndex = this._getCalculatedZIndex(element); |
| }; |
| /** |
| * Calculate what the z-index should be for the element, depending on what directions (top, |
| * bottom, left, right) have been set. It should be true that elements with a top direction |
| * should have the highest index since these are elements like a table header. If any of those |
| * elements are also sticky in another direction, then they should appear above other elements |
| * that are only sticky top (e.g. a sticky column on a sticky header). Bottom-sticky elements |
| * (e.g. footer rows) should then be next in the ordering such that they are below the header |
| * but above any non-sticky elements. Finally, left/right sticky elements (e.g. sticky columns) |
| * should minimally increment so that they are above non-sticky elements but below top and bottom |
| * elements. |
| */ |
| /** |
| * Calculate what the z-index should be for the element, depending on what directions (top, |
| * bottom, left, right) have been set. It should be true that elements with a top direction |
| * should have the highest index since these are elements like a table header. If any of those |
| * elements are also sticky in another direction, then they should appear above other elements |
| * that are only sticky top (e.g. a sticky column on a sticky header). Bottom-sticky elements |
| * (e.g. footer rows) should then be next in the ordering such that they are below the header |
| * but above any non-sticky elements. Finally, left/right sticky elements (e.g. sticky columns) |
| * should minimally increment so that they are above non-sticky elements but below top and bottom |
| * elements. |
| * @param {?} element |
| * @return {?} |
| */ |
| StickyStyler.prototype._getCalculatedZIndex = /** |
| * Calculate what the z-index should be for the element, depending on what directions (top, |
| * bottom, left, right) have been set. It should be true that elements with a top direction |
| * should have the highest index since these are elements like a table header. If any of those |
| * elements are also sticky in another direction, then they should appear above other elements |
| * that are only sticky top (e.g. a sticky column on a sticky header). Bottom-sticky elements |
| * (e.g. footer rows) should then be next in the ordering such that they are below the header |
| * but above any non-sticky elements. Finally, left/right sticky elements (e.g. sticky columns) |
| * should minimally increment so that they are above non-sticky elements but below top and bottom |
| * elements. |
| * @param {?} element |
| * @return {?} |
| */ |
| function (element) { |
| /** @type {?} */ |
| var zIndexIncrements = { |
| top: 100, |
| bottom: 10, |
| left: 1, |
| right: 1, |
| }; |
| /** @type {?} */ |
| var zIndex = 0; |
| for (var _i = 0, STICKY_DIRECTIONS_1 = STICKY_DIRECTIONS; _i < STICKY_DIRECTIONS_1.length; _i++) { |
| var dir = STICKY_DIRECTIONS_1[_i]; |
| if (element.style[dir]) { |
| zIndex += zIndexIncrements[dir]; |
| } |
| } |
| return zIndex ? "" + zIndex : ''; |
| }; |
| /** Gets the widths for each cell in the provided row. */ |
| /** |
| * Gets the widths for each cell in the provided row. |
| * @param {?} row |
| * @return {?} |
| */ |
| StickyStyler.prototype._getCellWidths = /** |
| * Gets the widths for each cell in the provided row. |
| * @param {?} row |
| * @return {?} |
| */ |
| function (row) { |
| /** @type {?} */ |
| var cellWidths = []; |
| /** @type {?} */ |
| var firstRowCells = row.children; |
| for (var i = 0; i < firstRowCells.length; i++) { |
| /** @type {?} */ |
| var cell = (/** @type {?} */ (firstRowCells[i])); |
| cellWidths.push(cell.getBoundingClientRect().width); |
| } |
| return cellWidths; |
| }; |
| /** |
| * Determines the left and right positions of each sticky column cell, which will be the |
| * accumulation of all sticky column cell widths to the left and right, respectively. |
| * Non-sticky cells do not need to have a value set since their positions will not be applied. |
| */ |
| /** |
| * Determines the left and right positions of each sticky column cell, which will be the |
| * accumulation of all sticky column cell widths to the left and right, respectively. |
| * Non-sticky cells do not need to have a value set since their positions will not be applied. |
| * @param {?} widths |
| * @param {?} stickyStates |
| * @return {?} |
| */ |
| StickyStyler.prototype._getStickyStartColumnPositions = /** |
| * Determines the left and right positions of each sticky column cell, which will be the |
| * accumulation of all sticky column cell widths to the left and right, respectively. |
| * Non-sticky cells do not need to have a value set since their positions will not be applied. |
| * @param {?} widths |
| * @param {?} stickyStates |
| * @return {?} |
| */ |
| function (widths, stickyStates) { |
| /** @type {?} */ |
| var positions = []; |
| /** @type {?} */ |
| var nextPosition = 0; |
| for (var i = 0; i < widths.length; i++) { |
| if (stickyStates[i]) { |
| positions[i] = nextPosition; |
| nextPosition += widths[i]; |
| } |
| } |
| return positions; |
| }; |
| /** |
| * Determines the left and right positions of each sticky column cell, which will be the |
| * accumulation of all sticky column cell widths to the left and right, respectively. |
| * Non-sticky cells do not need to have a value set since their positions will not be applied. |
| */ |
| /** |
| * Determines the left and right positions of each sticky column cell, which will be the |
| * accumulation of all sticky column cell widths to the left and right, respectively. |
| * Non-sticky cells do not need to have a value set since their positions will not be applied. |
| * @param {?} widths |
| * @param {?} stickyStates |
| * @return {?} |
| */ |
| StickyStyler.prototype._getStickyEndColumnPositions = /** |
| * Determines the left and right positions of each sticky column cell, which will be the |
| * accumulation of all sticky column cell widths to the left and right, respectively. |
| * Non-sticky cells do not need to have a value set since their positions will not be applied. |
| * @param {?} widths |
| * @param {?} stickyStates |
| * @return {?} |
| */ |
| function (widths, stickyStates) { |
| /** @type {?} */ |
| var positions = []; |
| /** @type {?} */ |
| var nextPosition = 0; |
| for (var i = widths.length; i > 0; i--) { |
| if (stickyStates[i]) { |
| positions[i] = nextPosition; |
| nextPosition += widths[i]; |
| } |
| } |
| return positions; |
| }; |
| return StickyStyler; |
| }()); |
| |
| /** |
| * @fileoverview added by tsickle |
| * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc |
| */ |
| |
| /** |
| * Returns an error to be thrown when attempting to find an unexisting column. |
| * \@docs-private |
| * @param {?} id Id whose lookup failed. |
| * @return {?} |
| */ |
| function getTableUnknownColumnError(id) { |
| return Error("Could not find column with id \"" + id + "\"."); |
| } |
| /** |
| * Returns an error to be thrown when two column definitions have the same name. |
| * \@docs-private |
| * @param {?} name |
| * @return {?} |
| */ |
| function getTableDuplicateColumnNameError(name) { |
| return Error("Duplicate column definition name provided: \"" + name + "\"."); |
| } |
| /** |
| * Returns an error to be thrown when there are multiple rows that are missing a when function. |
| * \@docs-private |
| * @return {?} |
| */ |
| function getTableMultipleDefaultRowDefsError() { |
| return Error("There can only be one default row without a when predicate function."); |
| } |
| /** |
| * Returns an error to be thrown when there are no matching row defs for a particular set of data. |
| * \@docs-private |
| * @param {?} data |
| * @return {?} |
| */ |
| function getTableMissingMatchingRowDefError(data) { |
| return Error("Could not find a matching row definition for the" + |
| ("provided row data: " + JSON.stringify(data))); |
| } |
| /** |
| * Returns an error to be thrown when there is no row definitions present in the content. |
| * \@docs-private |
| * @return {?} |
| */ |
| function getTableMissingRowDefsError() { |
| return Error('Missing definitions for header, footer, and row; ' + |
| 'cannot determine which columns should be rendered.'); |
| } |
| /** |
| * Returns an error to be thrown when the data source does not match the compatible types. |
| * \@docs-private |
| * @return {?} |
| */ |
| function getTableUnknownDataSourceError() { |
| return Error("Provided data source did not match an array, Observable, or DataSource"); |
| } |
| /** |
| * Returns an error to be thrown when the text column cannot find a parent table to inject. |
| * \@docs-private |
| * @return {?} |
| */ |
| function getTableTextColumnMissingParentTableError() { |
| return Error("Text column could not find a parent table for registration."); |
| } |
| /** |
| * Returns an error to be thrown when a table text column doesn't have a name. |
| * \@docs-private |
| * @return {?} |
| */ |
| function getTableTextColumnMissingNameError() { |
| return Error("Table text column must have a name."); |
| } |
| |
| /** |
| * @fileoverview added by tsickle |
| * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc |
| */ |
| /** |
| * Provides a handle for the table to grab the view container's ng-container to insert data rows. |
| * \@docs-private |
| */ |
| var DataRowOutlet = /** @class */ (function () { |
| function DataRowOutlet(viewContainer, elementRef) { |
| this.viewContainer = viewContainer; |
| this.elementRef = elementRef; |
| } |
| DataRowOutlet.decorators = [ |
| { type: Directive, args: [{ selector: '[rowOutlet]' },] }, |
| ]; |
| /** @nocollapse */ |
| DataRowOutlet.ctorParameters = function () { return [ |
| { type: ViewContainerRef }, |
| { type: ElementRef } |
| ]; }; |
| return DataRowOutlet; |
| }()); |
| /** |
| * Provides a handle for the table to grab the view container's ng-container to insert the header. |
| * \@docs-private |
| */ |
| var HeaderRowOutlet = /** @class */ (function () { |
| function HeaderRowOutlet(viewContainer, elementRef) { |
| this.viewContainer = viewContainer; |
| this.elementRef = elementRef; |
| } |
| HeaderRowOutlet.decorators = [ |
| { type: Directive, args: [{ selector: '[headerRowOutlet]' },] }, |
| ]; |
| /** @nocollapse */ |
| HeaderRowOutlet.ctorParameters = function () { return [ |
| { type: ViewContainerRef }, |
| { type: ElementRef } |
| ]; }; |
| return HeaderRowOutlet; |
| }()); |
| /** |
| * Provides a handle for the table to grab the view container's ng-container to insert the footer. |
| * \@docs-private |
| */ |
| var FooterRowOutlet = /** @class */ (function () { |
| function FooterRowOutlet(viewContainer, elementRef) { |
| this.viewContainer = viewContainer; |
| this.elementRef = elementRef; |
| } |
| FooterRowOutlet.decorators = [ |
| { type: Directive, args: [{ selector: '[footerRowOutlet]' },] }, |
| ]; |
| /** @nocollapse */ |
| FooterRowOutlet.ctorParameters = function () { return [ |
| { type: ViewContainerRef }, |
| { type: ElementRef } |
| ]; }; |
| return FooterRowOutlet; |
| }()); |
| /** |
| * The table template that can be used by the mat-table. Should not be used outside of the |
| * material library. |
| * \@docs-private |
| * @type {?} |
| */ |
| var CDK_TABLE_TEMPLATE = |
| // Note that according to MDN, the `caption` element has to be projected as the **first** |
| // element in the table. See https://developer.mozilla.org/en-US/docs/Web/HTML/Element/caption |
| "\n <ng-content select=\"caption\"></ng-content>\n <ng-container headerRowOutlet></ng-container>\n <ng-container rowOutlet></ng-container>\n <ng-container footerRowOutlet></ng-container>\n"; |
| /** |
| * Class used to conveniently type the embedded view ref for rows with a context. |
| * \@docs-private |
| * @abstract |
| * @template T |
| */ |
| var /** |
| * Class used to conveniently type the embedded view ref for rows with a context. |
| * \@docs-private |
| * @abstract |
| * @template T |
| */ |
| RowViewRef = /** @class */ (function (_super) { |
| __extends(RowViewRef, _super); |
| function RowViewRef() { |
| return _super !== null && _super.apply(this, arguments) || this; |
| } |
| return RowViewRef; |
| }(EmbeddedViewRef)); |
| /** |
| * A data table that can render a header row, data rows, and a footer row. |
| * Uses the dataSource input to determine the data to be rendered. The data can be provided either |
| * as a data array, an Observable stream that emits the data array to render, or a DataSource with a |
| * connect function that will return an Observable stream that emits the data array to render. |
| * @template T |
| */ |
| var CdkTable = /** @class */ (function () { |
| function CdkTable(_differs, _changeDetectorRef, _elementRef, role, _dir, _document, _platform) { |
| this._differs = _differs; |
| this._changeDetectorRef = _changeDetectorRef; |
| this._elementRef = _elementRef; |
| this._dir = _dir; |
| this._platform = _platform; |
| /** |
| * Subject that emits when the component has been destroyed. |
| */ |
| this._onDestroy = new Subject(); |
| /** |
| * Map of all the user's defined columns (header, data, and footer cell template) identified by |
| * name. Collection populated by the column definitions gathered by `ContentChildren` as well as |
| * any custom column definitions added to `_customColumnDefs`. |
| */ |
| this._columnDefsByName = new Map(); |
| /** |
| * Column definitions that were defined outside of the direct content children of the table. |
| * These will be defined when, e.g., creating a wrapper around the cdkTable that has |
| * column definitions as *it's* content child. |
| */ |
| this._customColumnDefs = new Set(); |
| /** |
| * Data row definitions that were defined outside of the direct content children of the table. |
| * These will be defined when, e.g., creating a wrapper around the cdkTable that has |
| * built-in data rows as *it's* content child. |
| */ |
| this._customRowDefs = new Set(); |
| /** |
| * Header row definitions that were defined outside of the direct content children of the table. |
| * These will be defined when, e.g., creating a wrapper around the cdkTable that has |
| * built-in header rows as *it's* content child. |
| */ |
| this._customHeaderRowDefs = new Set(); |
| /** |
| * Footer row definitions that were defined outside of the direct content children of the table. |
| * These will be defined when, e.g., creating a wrapper around the cdkTable that has a |
| * built-in footer row as *it's* content child. |
| */ |
| this._customFooterRowDefs = new Set(); |
| /** |
| * Whether the header row definition has been changed. Triggers an update to the header row after |
| * content is checked. Initialized as true so that the table renders the initial set of rows. |
| */ |
| this._headerRowDefChanged = true; |
| /** |
| * Whether the footer row definition has been changed. Triggers an update to the footer row after |
| * content is checked. Initialized as true so that the table renders the initial set of rows. |
| */ |
| this._footerRowDefChanged = true; |
| /** |
| * Cache of the latest rendered `RenderRow` objects as a map for easy retrieval when constructing |
| * a new list of `RenderRow` objects for rendering rows. Since the new list is constructed with |
| * the cached `RenderRow` objects when possible, the row identity is preserved when the data |
| * and row template matches, which allows the `IterableDiffer` to check rows by reference |
| * and understand which rows are added/moved/removed. |
| * |
| * Implemented as a map of maps where the first key is the `data: T` object and the second is the |
| * `CdkRowDef<T>` object. With the two keys, the cache points to a `RenderRow<T>` object that |
| * contains an array of created pairs. The array is necessary to handle cases where the data |
| * array contains multiple duplicate data objects and each instantiated `RenderRow` must be |
| * stored. |
| */ |
| this._cachedRenderRowsMap = new Map(); |
| /** |
| * CSS class added to any row or cell that has sticky positioning applied. May be overriden by |
| * table subclasses. |
| */ |
| this.stickyCssClass = 'cdk-table-sticky'; |
| this._multiTemplateDataRows = false; |
| // TODO(andrewseguin): Remove max value as the end index |
| // and instead calculate the view on init and scroll. |
| /** |
| * Stream containing the latest information on what rows are being displayed on screen. |
| * Can be used by the data source to as a heuristic of what data should be provided. |
| * |
| * \@docs-private |
| */ |
| this.viewChange = new BehaviorSubject({ start: 0, end: Number.MAX_VALUE }); |
| if (!role) { |
| this._elementRef.nativeElement.setAttribute('role', 'grid'); |
| } |
| this._document = _document; |
| this._isNativeHtmlTable = this._elementRef.nativeElement.nodeName === 'TABLE'; |
| } |
| Object.defineProperty(CdkTable.prototype, "trackBy", { |
| /** |
| * Tracking function that will be used to check the differences in data changes. Used similarly |
| * to `ngFor` `trackBy` function. Optimize row operations by identifying a row based on its data |
| * relative to the function to know if a row should be added/removed/moved. |
| * Accepts a function that takes two parameters, `index` and `item`. |
| */ |
| get: /** |
| * Tracking function that will be used to check the differences in data changes. Used similarly |
| * to `ngFor` `trackBy` function. Optimize row operations by identifying a row based on its data |
| * relative to the function to know if a row should be added/removed/moved. |
| * Accepts a function that takes two parameters, `index` and `item`. |
| * @return {?} |
| */ |
| function () { |
| return this._trackByFn; |
| }, |
| set: /** |
| * @param {?} fn |
| * @return {?} |
| */ |
| function (fn) { |
| if (isDevMode() && fn != null && typeof fn !== 'function' && (/** @type {?} */ (console)) && |
| (/** @type {?} */ (console.warn))) { |
| console.warn("trackBy must be a function, but received " + JSON.stringify(fn) + "."); |
| } |
| this._trackByFn = fn; |
| }, |
| enumerable: true, |
| configurable: true |
| }); |
| Object.defineProperty(CdkTable.prototype, "dataSource", { |
| /** |
| * The table's source of data, which can be provided in three ways (in order of complexity): |
| * - Simple data array (each object represents one table row) |
| * - Stream that emits a data array each time the array changes |
| * - `DataSource` object that implements the connect/disconnect interface. |
| * |
| * If a data array is provided, the table must be notified when the array's objects are |
| * added, removed, or moved. This can be done by calling the `renderRows()` function which will |
| * render the diff since the last table render. If the data array reference is changed, the table |
| * will automatically trigger an update to the rows. |
| * |
| * When providing an Observable stream, the table will trigger an update automatically when the |
| * stream emits a new array of data. |
| * |
| * Finally, when providing a `DataSource` object, the table will use the Observable stream |
| * provided by the connect function and trigger updates when that stream emits new data array |
| * values. During the table's ngOnDestroy or when the data source is removed from the table, the |
| * table will call the DataSource's `disconnect` function (may be useful for cleaning up any |
| * subscriptions registered during the connect process). |
| */ |
| get: /** |
| * The table's source of data, which can be provided in three ways (in order of complexity): |
| * - Simple data array (each object represents one table row) |
| * - Stream that emits a data array each time the array changes |
| * - `DataSource` object that implements the connect/disconnect interface. |
| * |
| * If a data array is provided, the table must be notified when the array's objects are |
| * added, removed, or moved. This can be done by calling the `renderRows()` function which will |
| * render the diff since the last table render. If the data array reference is changed, the table |
| * will automatically trigger an update to the rows. |
| * |
| * When providing an Observable stream, the table will trigger an update automatically when the |
| * stream emits a new array of data. |
| * |
| * Finally, when providing a `DataSource` object, the table will use the Observable stream |
| * provided by the connect function and trigger updates when that stream emits new data array |
| * values. During the table's ngOnDestroy or when the data source is removed from the table, the |
| * table will call the DataSource's `disconnect` function (may be useful for cleaning up any |
| * subscriptions registered during the connect process). |
| * @return {?} |
| */ |
| function () { |
| return this._dataSource; |
| }, |
| set: /** |
| * @param {?} dataSource |
| * @return {?} |
| */ |
| function (dataSource) { |
| if (this._dataSource !== dataSource) { |
| this._switchDataSource(dataSource); |
| } |
| }, |
| enumerable: true, |
| configurable: true |
| }); |
| Object.defineProperty(CdkTable.prototype, "multiTemplateDataRows", { |
| /** |
| * Whether to allow multiple rows per data object by evaluating which rows evaluate their 'when' |
| * predicate to true. If `multiTemplateDataRows` is false, which is the default value, then each |
| * dataobject will render the first row that evaluates its when predicate to true, in the order |
| * defined in the table, or otherwise the default row which does not have a when predicate. |
| */ |
| get: /** |
| * Whether to allow multiple rows per data object by evaluating which rows evaluate their 'when' |
| * predicate to true. If `multiTemplateDataRows` is false, which is the default value, then each |
| * dataobject will render the first row that evaluates its when predicate to true, in the order |
| * defined in the table, or otherwise the default row which does not have a when predicate. |
| * @return {?} |
| */ |
| function () { |
| return this._multiTemplateDataRows; |
| }, |
| set: /** |
| * @param {?} v |
| * @return {?} |
| */ |
| function (v) { |
| this._multiTemplateDataRows = coerceBooleanProperty(v); |
| // In Ivy if this value is set via a static attribute (e.g. <table multiTemplateDataRows>), |
| // this setter will be invoked before the row outlet has been defined hence the null check. |
| if (this._rowOutlet && this._rowOutlet.viewContainer.length) { |
| this._forceRenderDataRows(); |
| } |
| }, |
| enumerable: true, |
| configurable: true |
| }); |
| /** |
| * @return {?} |
| */ |
| CdkTable.prototype.ngOnInit = /** |
| * @return {?} |
| */ |
| function () { |
| var _this = this; |
| this._setupStickyStyler(); |
| if (this._isNativeHtmlTable) { |
| this._applyNativeTableSections(); |
| } |
| // Set up the trackBy function so that it uses the `RenderRow` as its identity by default. If |
| // the user has provided a custom trackBy, return the result of that function as evaluated |
| // with the values of the `RenderRow`'s data and index. |
| this._dataDiffer = this._differs.find([]).create((/** |
| * @param {?} _i |
| * @param {?} dataRow |
| * @return {?} |
| */ |
| function (_i, dataRow) { |
| return _this.trackBy ? _this.trackBy(dataRow.dataIndex, dataRow.data) : dataRow; |
| })); |
| }; |
| /** |
| * @return {?} |
| */ |
| CdkTable.prototype.ngAfterContentChecked = /** |
| * @return {?} |
| */ |
| function () { |
| // Cache the row and column definitions gathered by ContentChildren and programmatic injection. |
| this._cacheRowDefs(); |
| this._cacheColumnDefs(); |
| // Make sure that the user has at least added header, footer, or data row def. |
| if (!this._headerRowDefs.length && !this._footerRowDefs.length && !this._rowDefs.length) { |
| throw getTableMissingRowDefsError(); |
| } |
| // Render updates if the list of columns have been changed for the header, row, or footer defs. |
| this._renderUpdatedColumns(); |
| // If the header row definition has been changed, trigger a render to the header row. |
| if (this._headerRowDefChanged) { |
| this._forceRenderHeaderRows(); |
| this._headerRowDefChanged = false; |
| } |
| // If the footer row definition has been changed, trigger a render to the footer row. |
| if (this._footerRowDefChanged) { |
| this._forceRenderFooterRows(); |
| this._footerRowDefChanged = false; |
| } |
| // If there is a data source and row definitions, connect to the data source unless a |
| // connection has already been made. |
| if (this.dataSource && this._rowDefs.length > 0 && !this._renderChangeSubscription) { |
| this._observeRenderChanges(); |
| } |
| this._checkStickyStates(); |
| }; |
| /** |
| * @return {?} |
| */ |
| CdkTable.prototype.ngOnDestroy = /** |
| * @return {?} |
| */ |
| function () { |
| this._rowOutlet.viewContainer.clear(); |
| this._headerRowOutlet.viewContainer.clear(); |
| this._footerRowOutlet.viewContainer.clear(); |
| this._cachedRenderRowsMap.clear(); |
| this._onDestroy.next(); |
| this._onDestroy.complete(); |
| if (isDataSource(this.dataSource)) { |
| this.dataSource.disconnect(this); |
| } |
| }; |
| /** |
| * Renders rows based on the table's latest set of data, which was either provided directly as an |
| * input or retrieved through an Observable stream (directly or from a DataSource). |
| * Checks for differences in the data since the last diff to perform only the necessary |
| * changes (add/remove/move rows). |
| * |
| * If the table's data source is a DataSource or Observable, this will be invoked automatically |
| * each time the provided Observable stream emits a new data array. Otherwise if your data is |
| * an array, this function will need to be called to render any changes. |
| */ |
| /** |
| * Renders rows based on the table's latest set of data, which was either provided directly as an |
| * input or retrieved through an Observable stream (directly or from a DataSource). |
| * Checks for differences in the data since the last diff to perform only the necessary |
| * changes (add/remove/move rows). |
| * |
| * If the table's data source is a DataSource or Observable, this will be invoked automatically |
| * each time the provided Observable stream emits a new data array. Otherwise if your data is |
| * an array, this function will need to be called to render any changes. |
| * @return {?} |
| */ |
| CdkTable.prototype.renderRows = /** |
| * Renders rows based on the table's latest set of data, which was either provided directly as an |
| * input or retrieved through an Observable stream (directly or from a DataSource). |
| * Checks for differences in the data since the last diff to perform only the necessary |
| * changes (add/remove/move rows). |
| * |
| * If the table's data source is a DataSource or Observable, this will be invoked automatically |
| * each time the provided Observable stream emits a new data array. Otherwise if your data is |
| * an array, this function will need to be called to render any changes. |
| * @return {?} |
| */ |
| function () { |
| var _this = this; |
| this._renderRows = this._getAllRenderRows(); |
| /** @type {?} */ |
| var changes = this._dataDiffer.diff(this._renderRows); |
| if (!changes) { |
| return; |
| } |
| /** @type {?} */ |
| var viewContainer = this._rowOutlet.viewContainer; |
| changes.forEachOperation((/** |
| * @param {?} record |
| * @param {?} prevIndex |
| * @param {?} currentIndex |
| * @return {?} |
| */ |
| function (record, prevIndex, currentIndex) { |
| if (record.previousIndex == null) { |
| _this._insertRow(record.item, (/** @type {?} */ (currentIndex))); |
| } |
| else if (currentIndex == null) { |
| viewContainer.remove((/** @type {?} */ (prevIndex))); |
| } |
| else { |
| /** @type {?} */ |
| var view = (/** @type {?} */ (viewContainer.get((/** @type {?} */ (prevIndex))))); |
| viewContainer.move((/** @type {?} */ (view)), currentIndex); |
| } |
| })); |
| // Update the meta context of a row's context data (index, count, first, last, ...) |
| this._updateRowIndexContext(); |
| // Update rows that did not get added/removed/moved but may have had their identity changed, |
| // e.g. if trackBy matched data on some property but the actual data reference changed. |
| changes.forEachIdentityChange((/** |
| * @param {?} record |
| * @return {?} |
| */ |
| function (record) { |
| /** @type {?} */ |
| var rowView = (/** @type {?} */ (viewContainer.get((/** @type {?} */ (record.currentIndex))))); |
| rowView.context.$implicit = record.item.data; |
| })); |
| this.updateStickyColumnStyles(); |
| }; |
| /** |
| * Sets the header row definition to be used. Overrides the header row definition gathered by |
| * using `ContentChild`, if one exists. Sets a flag that will re-render the header row after the |
| * table's content is checked. |
| * @docs-private |
| * @deprecated Use `addHeaderRowDef` and `removeHeaderRowDef` instead |
| * @breaking-change 8.0.0 |
| */ |
| /** |
| * Sets the header row definition to be used. Overrides the header row definition gathered by |
| * using `ContentChild`, if one exists. Sets a flag that will re-render the header row after the |
| * table's content is checked. |
| * \@docs-private |
| * @deprecated Use `addHeaderRowDef` and `removeHeaderRowDef` instead |
| * \@breaking-change 8.0.0 |
| * @param {?} headerRowDef |
| * @return {?} |
| */ |
| CdkTable.prototype.setHeaderRowDef = /** |
| * Sets the header row definition to be used. Overrides the header row definition gathered by |
| * using `ContentChild`, if one exists. Sets a flag that will re-render the header row after the |
| * table's content is checked. |
| * \@docs-private |
| * @deprecated Use `addHeaderRowDef` and `removeHeaderRowDef` instead |
| * \@breaking-change 8.0.0 |
| * @param {?} headerRowDef |
| * @return {?} |
| */ |
| function (headerRowDef) { |
| this._customHeaderRowDefs = new Set([headerRowDef]); |
| this._headerRowDefChanged = true; |
| }; |
| /** |
| * Sets the footer row definition to be used. Overrides the footer row definition gathered by |
| * using `ContentChild`, if one exists. Sets a flag that will re-render the footer row after the |
| * table's content is checked. |
| * @docs-private |
| * @deprecated Use `addFooterRowDef` and `removeFooterRowDef` instead |
| * @breaking-change 8.0.0 |
| */ |
| /** |
| * Sets the footer row definition to be used. Overrides the footer row definition gathered by |
| * using `ContentChild`, if one exists. Sets a flag that will re-render the footer row after the |
| * table's content is checked. |
| * \@docs-private |
| * @deprecated Use `addFooterRowDef` and `removeFooterRowDef` instead |
| * \@breaking-change 8.0.0 |
| * @param {?} footerRowDef |
| * @return {?} |
| */ |
| CdkTable.prototype.setFooterRowDef = /** |
| * Sets the footer row definition to be used. Overrides the footer row definition gathered by |
| * using `ContentChild`, if one exists. Sets a flag that will re-render the footer row after the |
| * table's content is checked. |
| * \@docs-private |
| * @deprecated Use `addFooterRowDef` and `removeFooterRowDef` instead |
| * \@breaking-change 8.0.0 |
| * @param {?} footerRowDef |
| * @return {?} |
| */ |
| function (footerRowDef) { |
| this._customFooterRowDefs = new Set([footerRowDef]); |
| this._footerRowDefChanged = true; |
| }; |
| /** Adds a column definition that was not included as part of the content children. */ |
| /** |
| * Adds a column definition that was not included as part of the content children. |
| * @param {?} columnDef |
| * @return {?} |
| */ |
| CdkTable.prototype.addColumnDef = /** |
| * Adds a column definition that was not included as part of the content children. |
| * @param {?} columnDef |
| * @return {?} |
| */ |
| function (columnDef) { |
| this._customColumnDefs.add(columnDef); |
| }; |
| /** Removes a column definition that was not included as part of the content children. */ |
| /** |
| * Removes a column definition that was not included as part of the content children. |
| * @param {?} columnDef |
| * @return {?} |
| */ |
| CdkTable.prototype.removeColumnDef = /** |
| * Removes a column definition that was not included as part of the content children. |
| * @param {?} columnDef |
| * @return {?} |
| */ |
| function (columnDef) { |
| this._customColumnDefs.delete(columnDef); |
| }; |
| /** Adds a row definition that was not included as part of the content children. */ |
| /** |
| * Adds a row definition that was not included as part of the content children. |
| * @param {?} rowDef |
| * @return {?} |
| */ |
| CdkTable.prototype.addRowDef = /** |
| * Adds a row definition that was not included as part of the content children. |
| * @param {?} rowDef |
| * @return {?} |
| */ |
| function (rowDef) { |
| this._customRowDefs.add(rowDef); |
| }; |
| /** Removes a row definition that was not included as part of the content children. */ |
| /** |
| * Removes a row definition that was not included as part of the content children. |
| * @param {?} rowDef |
| * @return {?} |
| */ |
| CdkTable.prototype.removeRowDef = /** |
| * Removes a row definition that was not included as part of the content children. |
| * @param {?} rowDef |
| * @return {?} |
| */ |
| function (rowDef) { |
| this._customRowDefs.delete(rowDef); |
| }; |
| /** Adds a header row definition that was not included as part of the content children. */ |
| /** |
| * Adds a header row definition that was not included as part of the content children. |
| * @param {?} headerRowDef |
| * @return {?} |
| */ |
| CdkTable.prototype.addHeaderRowDef = /** |
| * Adds a header row definition that was not included as part of the content children. |
| * @param {?} headerRowDef |
| * @return {?} |
| */ |
| function (headerRowDef) { |
| this._customHeaderRowDefs.add(headerRowDef); |
| this._headerRowDefChanged = true; |
| }; |
| /** Removes a header row definition that was not included as part of the content children. */ |
| /** |
| * Removes a header row definition that was not included as part of the content children. |
| * @param {?} headerRowDef |
| * @return {?} |
| */ |
| CdkTable.prototype.removeHeaderRowDef = /** |
| * Removes a header row definition that was not included as part of the content children. |
| * @param {?} headerRowDef |
| * @return {?} |
| */ |
| function (headerRowDef) { |
| this._customHeaderRowDefs.delete(headerRowDef); |
| this._headerRowDefChanged = true; |
| }; |
| /** Adds a footer row definition that was not included as part of the content children. */ |
| /** |
| * Adds a footer row definition that was not included as part of the content children. |
| * @param {?} footerRowDef |
| * @return {?} |
| */ |
| CdkTable.prototype.addFooterRowDef = /** |
| * Adds a footer row definition that was not included as part of the content children. |
| * @param {?} footerRowDef |
| * @return {?} |
| */ |
| function (footerRowDef) { |
| this._customFooterRowDefs.add(footerRowDef); |
| this._footerRowDefChanged = true; |
| }; |
| /** Removes a footer row definition that was not included as part of the content children. */ |
| /** |
| * Removes a footer row definition that was not included as part of the content children. |
| * @param {?} footerRowDef |
| * @return {?} |
| */ |
| CdkTable.prototype.removeFooterRowDef = /** |
| * Removes a footer row definition that was not included as part of the content children. |
| * @param {?} footerRowDef |
| * @return {?} |
| */ |
| function (footerRowDef) { |
| this._customFooterRowDefs.delete(footerRowDef); |
| this._footerRowDefChanged = true; |
| }; |
| /** |
| * Updates the header sticky styles. First resets all applied styles with respect to the cells |
| * sticking to the top. Then, evaluating which cells need to be stuck to the top. This is |
| * automatically called when the header row changes its displayed set of columns, or if its |
| * sticky input changes. May be called manually for cases where the cell content changes outside |
| * of these events. |
| */ |
| /** |
| * Updates the header sticky styles. First resets all applied styles with respect to the cells |
| * sticking to the top. Then, evaluating which cells need to be stuck to the top. This is |
| * automatically called when the header row changes its displayed set of columns, or if its |
| * sticky input changes. May be called manually for cases where the cell content changes outside |
| * of these events. |
| * @return {?} |
| */ |
| CdkTable.prototype.updateStickyHeaderRowStyles = /** |
| * Updates the header sticky styles. First resets all applied styles with respect to the cells |
| * sticking to the top. Then, evaluating which cells need to be stuck to the top. This is |
| * automatically called when the header row changes its displayed set of columns, or if its |
| * sticky input changes. May be called manually for cases where the cell content changes outside |
| * of these events. |
| * @return {?} |
| */ |
| function () { |
| /** @type {?} */ |
| var headerRows = this._getRenderedRows(this._headerRowOutlet); |
| /** @type {?} */ |
| var tableElement = (/** @type {?} */ (this._elementRef.nativeElement)); |
| // Hide the thead element if there are no header rows. This is necessary to satisfy |
| // overzealous a11y checkers that fail because the `rowgroup` element does not contain |
| // required child `row`. |
| /** @type {?} */ |
| var thead = tableElement.querySelector('thead'); |
| if (thead) { |
| thead.style.display = headerRows.length ? '' : 'none'; |
| } |
| /** @type {?} */ |
| var stickyStates = this._headerRowDefs.map((/** |
| * @param {?} def |
| * @return {?} |
| */ |
| function (def) { return def.sticky; })); |
| this._stickyStyler.clearStickyPositioning(headerRows, ['top']); |
| this._stickyStyler.stickRows(headerRows, stickyStates, 'top'); |
| // Reset the dirty state of the sticky input change since it has been used. |
| this._headerRowDefs.forEach((/** |
| * @param {?} def |
| * @return {?} |
| */ |
| function (def) { return def.resetStickyChanged(); })); |
| }; |
| /** |
| * Updates the footer sticky styles. First resets all applied styles with respect to the cells |
| * sticking to the bottom. Then, evaluating which cells need to be stuck to the bottom. This is |
| * automatically called when the footer row changes its displayed set of columns, or if its |
| * sticky input changes. May be called manually for cases where the cell content changes outside |
| * of these events. |
| */ |
| /** |
| * Updates the footer sticky styles. First resets all applied styles with respect to the cells |
| * sticking to the bottom. Then, evaluating which cells need to be stuck to the bottom. This is |
| * automatically called when the footer row changes its displayed set of columns, or if its |
| * sticky input changes. May be called manually for cases where the cell content changes outside |
| * of these events. |
| * @return {?} |
| */ |
| CdkTable.prototype.updateStickyFooterRowStyles = /** |
| * Updates the footer sticky styles. First resets all applied styles with respect to the cells |
| * sticking to the bottom. Then, evaluating which cells need to be stuck to the bottom. This is |
| * automatically called when the footer row changes its displayed set of columns, or if its |
| * sticky input changes. May be called manually for cases where the cell content changes outside |
| * of these events. |
| * @return {?} |
| */ |
| function () { |
| /** @type {?} */ |
| var footerRows = this._getRenderedRows(this._footerRowOutlet); |
| /** @type {?} */ |
| var tableElement = (/** @type {?} */ (this._elementRef.nativeElement)); |
| // Hide the tfoot element if there are no footer rows. This is necessary to satisfy |
| // overzealous a11y checkers that fail because the `rowgroup` element does not contain |
| // required child `row`. |
| /** @type {?} */ |
| var tfoot = tableElement.querySelector('tfoot'); |
| if (tfoot) { |
| tfoot.style.display = footerRows.length ? '' : 'none'; |
| } |
| /** @type {?} */ |
| var stickyStates = this._footerRowDefs.map((/** |
| * @param {?} def |
| * @return {?} |
| */ |
| function (def) { return def.sticky; })); |
| this._stickyStyler.clearStickyPositioning(footerRows, ['bottom']); |
| this._stickyStyler.stickRows(footerRows, stickyStates, 'bottom'); |
| this._stickyStyler.updateStickyFooterContainer(this._elementRef.nativeElement, stickyStates); |
| // Reset the dirty state of the sticky input change since it has been used. |
| this._footerRowDefs.forEach((/** |
| * @param {?} def |
| * @return {?} |
| */ |
| function (def) { return def.resetStickyChanged(); })); |
| }; |
| /** |
| * Updates the column sticky styles. First resets all applied styles with respect to the cells |
| * sticking to the left and right. Then sticky styles are added for the left and right according |
| * to the column definitions for each cell in each row. This is automatically called when |
| * the data source provides a new set of data or when a column definition changes its sticky |
| * input. May be called manually for cases where the cell content changes outside of these events. |
| */ |
| /** |
| * Updates the column sticky styles. First resets all applied styles with respect to the cells |
| * sticking to the left and right. Then sticky styles are added for the left and right according |
| * to the column definitions for each cell in each row. This is automatically called when |
| * the data source provides a new set of data or when a column definition changes its sticky |
| * input. May be called manually for cases where the cell content changes outside of these events. |
| * @return {?} |
| */ |
| CdkTable.prototype.updateStickyColumnStyles = /** |
| * Updates the column sticky styles. First resets all applied styles with respect to the cells |
| * sticking to the left and right. Then sticky styles are added for the left and right according |
| * to the column definitions for each cell in each row. This is automatically called when |
| * the data source provides a new set of data or when a column definition changes its sticky |
| * input. May be called manually for cases where the cell content changes outside of these events. |
| * @return {?} |
| */ |
| function () { |
| var _this = this; |
| /** @type {?} */ |
| var headerRows = this._getRenderedRows(this._headerRowOutlet); |
| /** @type {?} */ |
| var dataRows = this._getRenderedRows(this._rowOutlet); |
| /** @type {?} */ |
| var footerRows = this._getRenderedRows(this._footerRowOutlet); |
| // Clear the left and right positioning from all columns in the table across all rows since |
| // sticky columns span across all table sections (header, data, footer) |
| this._stickyStyler.clearStickyPositioning(headerRows.concat(dataRows, footerRows), ['left', 'right']); |
| // Update the sticky styles for each header row depending on the def's sticky state |
| headerRows.forEach((/** |
| * @param {?} headerRow |
| * @param {?} i |
| * @return {?} |
| */ |
| function (headerRow, i) { |
| _this._addStickyColumnStyles([headerRow], _this._headerRowDefs[i]); |
| })); |
| // Update the sticky styles for each data row depending on its def's sticky state |
| this._rowDefs.forEach((/** |
| * @param {?} rowDef |
| * @return {?} |
| */ |
| function (rowDef) { |
| // Collect all the rows rendered with this row definition. |
| /** @type {?} */ |
| var rows = []; |
| for (var i = 0; i < dataRows.length; i++) { |
| if (_this._renderRows[i].rowDef === rowDef) { |
| rows.push(dataRows[i]); |
| } |
| } |
| _this._addStickyColumnStyles(rows, rowDef); |
| })); |
| // Update the sticky styles for each footer row depending on the def's sticky state |
| footerRows.forEach((/** |
| * @param {?} footerRow |
| * @param {?} i |
| * @return {?} |
| */ |
| function (footerRow, i) { |
| _this._addStickyColumnStyles([footerRow], _this._footerRowDefs[i]); |
| })); |
| // Reset the dirty state of the sticky input change since it has been used. |
| Array.from(this._columnDefsByName.values()).forEach((/** |
| * @param {?} def |
| * @return {?} |
| */ |
| function (def) { return def.resetStickyChanged(); })); |
| }; |
| /** |
| * Get the list of RenderRow objects to render according to the current list of data and defined |
| * row definitions. If the previous list already contained a particular pair, it should be reused |
| * so that the differ equates their references. |
| */ |
| /** |
| * Get the list of RenderRow objects to render according to the current list of data and defined |
| * row definitions. If the previous list already contained a particular pair, it should be reused |
| * so that the differ equates their references. |
| * @private |
| * @return {?} |
| */ |
| CdkTable.prototype._getAllRenderRows = /** |
| * Get the list of RenderRow objects to render according to the current list of data and defined |
| * row definitions. If the previous list already contained a particular pair, it should be reused |
| * so that the differ equates their references. |
| * @private |
| * @return {?} |
| */ |
| function () { |
| /** @type {?} */ |
| var renderRows = []; |
| // Store the cache and create a new one. Any re-used RenderRow objects will be moved into the |
| // new cache while unused ones can be picked up by garbage collection. |
| /** @type {?} */ |
| var prevCachedRenderRows = this._cachedRenderRowsMap; |
| this._cachedRenderRowsMap = new Map(); |
| // For each data object, get the list of rows that should be rendered, represented by the |
| // respective `RenderRow` object which is the pair of `data` and `CdkRowDef`. |
| for (var i = 0; i < this._data.length; i++) { |
| /** @type {?} */ |
| var data = this._data[i]; |
| /** @type {?} */ |
| var renderRowsForData = this._getRenderRowsForData(data, i, prevCachedRenderRows.get(data)); |
| if (!this._cachedRenderRowsMap.has(data)) { |
| this._cachedRenderRowsMap.set(data, new WeakMap()); |
| } |
| for (var j = 0; j < renderRowsForData.length; j++) { |
| /** @type {?} */ |
| var renderRow = renderRowsForData[j]; |
| /** @type {?} */ |
| var cache = (/** @type {?} */ (this._cachedRenderRowsMap.get(renderRow.data))); |
| if (cache.has(renderRow.rowDef)) { |
| (/** @type {?} */ (cache.get(renderRow.rowDef))).push(renderRow); |
| } |
| else { |
| cache.set(renderRow.rowDef, [renderRow]); |
| } |
| renderRows.push(renderRow); |
| } |
| } |
| return renderRows; |
| }; |
| /** |
| * Gets a list of `RenderRow<T>` for the provided data object and any `CdkRowDef` objects that |
| * should be rendered for this data. Reuses the cached RenderRow objects if they match the same |
| * `(T, CdkRowDef)` pair. |
| */ |
| /** |
| * Gets a list of `RenderRow<T>` for the provided data object and any `CdkRowDef` objects that |
| * should be rendered for this data. Reuses the cached RenderRow objects if they match the same |
| * `(T, CdkRowDef)` pair. |
| * @private |
| * @param {?} data |
| * @param {?} dataIndex |
| * @param {?=} cache |
| * @return {?} |
| */ |
| CdkTable.prototype._getRenderRowsForData = /** |
| * Gets a list of `RenderRow<T>` for the provided data object and any `CdkRowDef` objects that |
| * should be rendered for this data. Reuses the cached RenderRow objects if they match the same |
| * `(T, CdkRowDef)` pair. |
| * @private |
| * @param {?} data |
| * @param {?} dataIndex |
| * @param {?=} cache |
| * @return {?} |
| */ |
| function (data, dataIndex, cache) { |
| /** @type {?} */ |
| var rowDefs = this._getRowDefs(data, dataIndex); |
| return rowDefs.map((/** |
| * @param {?} rowDef |
| * @return {?} |
| */ |
| function (rowDef) { |
| /** @type {?} */ |
| var cachedRenderRows = (cache && cache.has(rowDef)) ? (/** @type {?} */ (cache.get(rowDef))) : []; |
| if (cachedRenderRows.length) { |
| /** @type {?} */ |
| var dataRow = (/** @type {?} */ (cachedRenderRows.shift())); |
| dataRow.dataIndex = dataIndex; |
| return dataRow; |
| } |
| else { |
| return { data: data, rowDef: rowDef, dataIndex: dataIndex }; |
| } |
| })); |
| }; |
| /** Update the map containing the content's column definitions. */ |
| /** |
| * Update the map containing the content's column definitions. |
| * @private |
| * @return {?} |
| */ |
| CdkTable.prototype._cacheColumnDefs = /** |
| * Update the map containing the content's column definitions. |
| * @private |
| * @return {?} |
| */ |
| function () { |
| var _this = this; |
| this._columnDefsByName.clear(); |
| /** @type {?} */ |
| var columnDefs = mergeQueryListAndSet(this._contentColumnDefs, this._customColumnDefs); |
| columnDefs.forEach((/** |
| * @param {?} columnDef |
| * @return {?} |
| */ |
| function (columnDef) { |
| if (_this._columnDefsByName.has(columnDef.name)) { |
| throw getTableDuplicateColumnNameError(columnDef.name); |
| } |
| _this._columnDefsByName.set(columnDef.name, columnDef); |
| })); |
| }; |
| /** Update the list of all available row definitions that can be used. */ |
| /** |
| * Update the list of all available row definitions that can be used. |
| * @private |
| * @return {?} |
| */ |
| CdkTable.prototype._cacheRowDefs = /** |
| * Update the list of all available row definitions that can be used. |
| * @private |
| * @return {?} |
| */ |
| function () { |
| this._headerRowDefs = |
| mergeQueryListAndSet(this._contentHeaderRowDefs, this._customHeaderRowDefs); |
| this._footerRowDefs = |
| mergeQueryListAndSet(this._contentFooterRowDefs, this._customFooterRowDefs); |
| this._rowDefs = mergeQueryListAndSet(this._contentRowDefs, this._customRowDefs); |
| // After all row definitions are determined, find the row definition to be considered default. |
| /** @type {?} */ |
| var defaultRowDefs = this._rowDefs.filter((/** |
| * @param {?} def |
| * @return {?} |
| */ |
| function (def) { return !def.when; })); |
| if (!this.multiTemplateDataRows && defaultRowDefs.length > 1) { |
| throw getTableMultipleDefaultRowDefsError(); |
| } |
| this._defaultRowDef = defaultRowDefs[0]; |
| }; |
| /** |
| * Check if the header, data, or footer rows have changed what columns they want to display or |
| * whether the sticky states have changed for the header or footer. If there is a diff, then |
| * re-render that section. |
| */ |
| /** |
| * Check if the header, data, or footer rows have changed what columns they want to display or |
| * whether the sticky states have changed for the header or footer. If there is a diff, then |
| * re-render that section. |
| * @private |
| * @return {?} |
| */ |
| CdkTable.prototype._renderUpdatedColumns = /** |
| * Check if the header, data, or footer rows have changed what columns they want to display or |
| * whether the sticky states have changed for the header or footer. If there is a diff, then |
| * re-render that section. |
| * @private |
| * @return {?} |
| */ |
| function () { |
| /** @type {?} */ |
| var columnsDiffReducer = (/** |
| * @param {?} acc |
| * @param {?} def |
| * @return {?} |
| */ |
| function (acc, def) { return acc || !!def.getColumnsDiff(); }); |
| // Force re-render data rows if the list of column definitions have changed. |
| if (this._rowDefs.reduce(columnsDiffReducer, false)) { |
| this._forceRenderDataRows(); |
| } |
| // Force re-render header/footer rows if the list of column definitions have changed.. |
| if (this._headerRowDefs.reduce(columnsDiffReducer, false)) { |
| this._forceRenderHeaderRows(); |
| } |
| if (this._footerRowDefs.reduce(columnsDiffReducer, false)) { |
| this._forceRenderFooterRows(); |
| } |
| }; |
| /** |
| * Switch to the provided data source by resetting the data and unsubscribing from the current |
| * render change subscription if one exists. If the data source is null, interpret this by |
| * clearing the row outlet. Otherwise start listening for new data. |
| */ |
| /** |
| * Switch to the provided data source by resetting the data and unsubscribing from the current |
| * render change subscription if one exists. If the data source is null, interpret this by |
| * clearing the row outlet. Otherwise start listening for new data. |
| * @private |
| * @param {?} dataSource |
| * @return {?} |
| */ |
| CdkTable.prototype._switchDataSource = /** |
| * Switch to the provided data source by resetting the data and unsubscribing from the current |
| * render change subscription if one exists. If the data source is null, interpret this by |
| * clearing the row outlet. Otherwise start listening for new data. |
| * @private |
| * @param {?} dataSource |
| * @return {?} |
| */ |
| function (dataSource) { |
| this._data = []; |
| if (isDataSource(this.dataSource)) { |
| this.dataSource.disconnect(this); |
| } |
| // Stop listening for data from the previous data source. |
| if (this._renderChangeSubscription) { |
| this._renderChangeSubscription.unsubscribe(); |
| this._renderChangeSubscription = null; |
| } |
| if (!dataSource) { |
| if (this._dataDiffer) { |
| this._dataDiffer.diff([]); |
| } |
| this._rowOutlet.viewContainer.clear(); |
| } |
| this._dataSource = dataSource; |
| }; |
| /** Set up a subscription for the data provided by the data source. */ |
| /** |
| * Set up a subscription for the data provided by the data source. |
| * @private |
| * @return {?} |
| */ |
| CdkTable.prototype._observeRenderChanges = /** |
| * Set up a subscription for the data provided by the data source. |
| * @private |
| * @return {?} |
| */ |
| function () { |
| var _this = this; |
| // If no data source has been set, there is nothing to observe for changes. |
| if (!this.dataSource) { |
| return; |
| } |
| /** @type {?} */ |
| var dataStream; |
| if (isDataSource(this.dataSource)) { |
| dataStream = this.dataSource.connect(this); |
| } |
| else if (this.dataSource instanceof Observable) { |
| dataStream = this.dataSource; |
| } |
| else if (Array.isArray(this.dataSource)) { |
| dataStream = of(this.dataSource); |
| } |
| if (dataStream === undefined) { |
| throw getTableUnknownDataSourceError(); |
| } |
| this._renderChangeSubscription = dataStream.pipe(takeUntil(this._onDestroy)).subscribe((/** |
| * @param {?} data |
| * @return {?} |
| */ |
| function (data) { |
| _this._data = data || []; |
| _this.renderRows(); |
| })); |
| }; |
| /** |
| * Clears any existing content in the header row outlet and creates a new embedded view |
| * in the outlet using the header row definition. |
| */ |
| /** |
| * Clears any existing content in the header row outlet and creates a new embedded view |
| * in the outlet using the header row definition. |
| * @private |
| * @return {?} |
| */ |
| CdkTable.prototype._forceRenderHeaderRows = /** |
| * Clears any existing content in the header row outlet and creates a new embedded view |
| * in the outlet using the header row definition. |
| * @private |
| * @return {?} |
| */ |
| function () { |
| var _this = this; |
| // Clear the header row outlet if any content exists. |
| if (this._headerRowOutlet.viewContainer.length > 0) { |
| this._headerRowOutlet.viewContainer.clear(); |
| } |
| this._headerRowDefs.forEach((/** |
| * @param {?} def |
| * @param {?} i |
| * @return {?} |
| */ |
| function (def, i) { return _this._renderRow(_this._headerRowOutlet, def, i); })); |
| this.updateStickyHeaderRowStyles(); |
| this.updateStickyColumnStyles(); |
| }; |
| /** |
| * Clears any existing content in the footer row outlet and creates a new embedded view |
| * in the outlet using the footer row definition. |
| */ |
| /** |
| * Clears any existing content in the footer row outlet and creates a new embedded view |
| * in the outlet using the footer row definition. |
| * @private |
| * @return {?} |
| */ |
| CdkTable.prototype._forceRenderFooterRows = /** |
| * Clears any existing content in the footer row outlet and creates a new embedded view |
| * in the outlet using the footer row definition. |
| * @private |
| * @return {?} |
| */ |
| function () { |
| var _this = this; |
| // Clear the footer row outlet if any content exists. |
| if (this._footerRowOutlet.viewContainer.length > 0) { |
| this._footerRowOutlet.viewContainer.clear(); |
| } |
| this._footerRowDefs.forEach((/** |
| * @param {?} def |
| * @param {?} i |
| * @return {?} |
| */ |
| function (def, i) { return _this._renderRow(_this._footerRowOutlet, def, i); })); |
| this.updateStickyFooterRowStyles(); |
| this.updateStickyColumnStyles(); |
| }; |
| /** Adds the sticky column styles for the rows according to the columns' stick states. */ |
| /** |
| * Adds the sticky column styles for the rows according to the columns' stick states. |
| * @private |
| * @param {?} rows |
| * @param {?} rowDef |
| * @return {?} |
| */ |
| CdkTable.prototype._addStickyColumnStyles = /** |
| * Adds the sticky column styles for the rows according to the columns' stick states. |
| * @private |
| * @param {?} rows |
| * @param {?} rowDef |
| * @return {?} |
| */ |
| function (rows, rowDef) { |
| var _this = this; |
| /** @type {?} */ |
| var columnDefs = Array.from(rowDef.columns || []).map((/** |
| * @param {?} columnName |
| * @return {?} |
| */ |
| function (columnName) { |
| /** @type {?} */ |
| var columnDef = _this._columnDefsByName.get(columnName); |
| if (!columnDef) { |
| throw getTableUnknownColumnError(columnName); |
| } |
| return (/** @type {?} */ (columnDef)); |
| })); |
| /** @type {?} */ |
| var stickyStartStates = columnDefs.map((/** |
| * @param {?} columnDef |
| * @return {?} |
| */ |
| function (columnDef) { return columnDef.sticky; })); |
| /** @type {?} */ |
| var stickyEndStates = columnDefs.map((/** |
| * @param {?} columnDef |
| * @return {?} |
| */ |
| function (columnDef) { return columnDef.stickyEnd; })); |
| this._stickyStyler.updateStickyColumns(rows, stickyStartStates, stickyEndStates); |
| }; |
| /** Gets the list of rows that have been rendered in the row outlet. */ |
| /** |
| * Gets the list of rows that have been rendered in the row outlet. |
| * @param {?} rowOutlet |
| * @return {?} |
| */ |
| CdkTable.prototype._getRenderedRows = /** |
| * Gets the list of rows that have been rendered in the row outlet. |
| * @param {?} rowOutlet |
| * @return {?} |
| */ |
| function (rowOutlet) { |
| /** @type {?} */ |
| var renderedRows = []; |
| for (var i = 0; i < rowOutlet.viewContainer.length; i++) { |
| /** @type {?} */ |
| var viewRef = ((/** @type {?} */ ((/** @type {?} */ (rowOutlet.viewContainer.get(i)))))); |
| renderedRows.push(viewRef.rootNodes[0]); |
| } |
| return renderedRows; |
| }; |
| /** |
| * Get the matching row definitions that should be used for this row data. If there is only |
| * one row definition, it is returned. Otherwise, find the row definitions that has a when |
| * predicate that returns true with the data. If none return true, return the default row |
| * definition. |
| */ |
| /** |
| * Get the matching row definitions that should be used for this row data. If there is only |
| * one row definition, it is returned. Otherwise, find the row definitions that has a when |
| * predicate that returns true with the data. If none return true, return the default row |
| * definition. |
| * @param {?} data |
| * @param {?} dataIndex |
| * @return {?} |
| */ |
| CdkTable.prototype._getRowDefs = /** |
| * Get the matching row definitions that should be used for this row data. If there is only |
| * one row definition, it is returned. Otherwise, find the row definitions that has a when |
| * predicate that returns true with the data. If none return true, return the default row |
| * definition. |
| * @param {?} data |
| * @param {?} dataIndex |
| * @return {?} |
| */ |
| function (data, dataIndex) { |
| if (this._rowDefs.length == 1) { |
| return [this._rowDefs[0]]; |
| } |
| /** @type {?} */ |
| var rowDefs = []; |
| if (this.multiTemplateDataRows) { |
| rowDefs = this._rowDefs.filter((/** |
| * @param {?} def |
| * @return {?} |
| */ |
| function (def) { return !def.when || def.when(dataIndex, data); })); |
| } |
| else { |
| /** @type {?} */ |
| var rowDef = this._rowDefs.find((/** |
| * @param {?} def |
| * @return {?} |
| */ |
| function (def) { return def.when && def.when(dataIndex, data); })) || this._defaultRowDef; |
| if (rowDef) { |
| rowDefs.push(rowDef); |
| } |
| } |
| if (!rowDefs.length) { |
| throw getTableMissingMatchingRowDefError(data); |
| } |
| return rowDefs; |
| }; |
| /** |
| * Create the embedded view for the data row template and place it in the correct index location |
| * within the data row view container. |
| */ |
| /** |
| * Create the embedded view for the data row template and place it in the correct index location |
| * within the data row view container. |
| * @private |
| * @param {?} renderRow |
| * @param {?} renderIndex |
| * @return {?} |
| */ |
| CdkTable.prototype._insertRow = /** |
| * Create the embedded view for the data row template and place it in the correct index location |
| * within the data row view container. |
| * @private |
| * @param {?} renderRow |
| * @param {?} renderIndex |
| * @return {?} |
| */ |
| function (renderRow, renderIndex) { |
| /** @type {?} */ |
| var rowDef = renderRow.rowDef; |
| /** @type {?} */ |
| var context = { $implicit: renderRow.data }; |
| this._renderRow(this._rowOutlet, rowDef, renderIndex, context); |
| }; |
| /** |
| * Creates a new row template in the outlet and fills it with the set of cell templates. |
| * Optionally takes a context to provide to the row and cells, as well as an optional index |
| * of where to place the new row template in the outlet. |
| */ |
| /** |
| * Creates a new row template in the outlet and fills it with the set of cell templates. |
| * Optionally takes a context to provide to the row and cells, as well as an optional index |
| * of where to place the new row template in the outlet. |
| * @private |
| * @param {?} outlet |
| * @param {?} rowDef |
| * @param {?} index |
| * @param {?=} context |
| * @return {?} |
| */ |
| CdkTable.prototype._renderRow = /** |
| * Creates a new row template in the outlet and fills it with the set of cell templates. |
| * Optionally takes a context to provide to the row and cells, as well as an optional index |
| * of where to place the new row template in the outlet. |
| * @private |
| * @param {?} outlet |
| * @param {?} rowDef |
| * @param {?} index |
| * @param {?=} context |
| * @return {?} |
| */ |
| function (outlet, rowDef, index, context) { |
| if (context === void 0) { context = {}; } |
| // TODO(andrewseguin): enforce that one outlet was instantiated from createEmbeddedView |
| outlet.viewContainer.createEmbeddedView(rowDef.template, context, index); |
| for (var _a = 0, _b = this._getCellTemplates(rowDef); _a < _b.length; _a++) { |
| var cellTemplate = _b[_a]; |
| if (CdkCellOutlet.mostRecentCellOutlet) { |
| CdkCellOutlet.mostRecentCellOutlet._viewContainer.createEmbeddedView(cellTemplate, context); |
| } |
| } |
| this._changeDetectorRef.markForCheck(); |
| }; |
| /** |
| * Updates the index-related context for each row to reflect any changes in the index of the rows, |
| * e.g. first/last/even/odd. |
| */ |
| /** |
| * Updates the index-related context for each row to reflect any changes in the index of the rows, |
| * e.g. first/last/even/odd. |
| * @private |
| * @return {?} |
| */ |
| CdkTable.prototype._updateRowIndexContext = /** |
| * Updates the index-related context for each row to reflect any changes in the index of the rows, |
| * e.g. first/last/even/odd. |
| * @private |
| * @return {?} |
| */ |
| function () { |
| /** @type {?} */ |
| var viewContainer = this._rowOutlet.viewContainer; |
| for (var renderIndex = 0, count = viewContainer.length; renderIndex < count; renderIndex++) { |
| /** @type {?} */ |
| var viewRef = (/** @type {?} */ (viewContainer.get(renderIndex))); |
| /** @type {?} */ |
| var context = (/** @type {?} */ (viewRef.context)); |
| context.count = count; |
| context.first = renderIndex === 0; |
| context.last = renderIndex === count - 1; |
| context.even = renderIndex % 2 === 0; |
| context.odd = !context.even; |
| if (this.multiTemplateDataRows) { |
| context.dataIndex = this._renderRows[renderIndex].dataIndex; |
| context.renderIndex = renderIndex; |
| } |
| else { |
| context.index = this._renderRows[renderIndex].dataIndex; |
| } |
| } |
| }; |
| /** Gets the column definitions for the provided row def. */ |
| /** |
| * Gets the column definitions for the provided row def. |
| * @private |
| * @param {?} rowDef |
| * @return {?} |
| */ |
| CdkTable.prototype._getCellTemplates = /** |
| * Gets the column definitions for the provided row def. |
| * @private |
| * @param {?} rowDef |
| * @return {?} |
| */ |
| function (rowDef) { |
| var _this = this; |
| if (!rowDef || !rowDef.columns) { |
| return []; |
| } |
| return Array.from(rowDef.columns, (/** |
| * @param {?} columnId |
| * @return {?} |
| */ |
| function (columnId) { |
| /** @type {?} */ |
| var column = _this._columnDefsByName.get(columnId); |
| if (!column) { |
| throw getTableUnknownColumnError(columnId); |
| } |
| return rowDef.extractCellTemplate(column); |
| })); |
| }; |
| /** Adds native table sections (e.g. tbody) and moves the row outlets into them. */ |
| /** |
| * Adds native table sections (e.g. tbody) and moves the row outlets into them. |
| * @private |
| * @return {?} |
| */ |
| CdkTable.prototype._applyNativeTableSections = /** |
| * Adds native table sections (e.g. tbody) and moves the row outlets into them. |
| * @private |
| * @return {?} |
| */ |
| function () { |
| /** @type {?} */ |
| var documentFragment = this._document.createDocumentFragment(); |
| /** @type {?} */ |
| var sections = [ |
| { tag: 'thead', outlet: this._headerRowOutlet }, |
| { tag: 'tbody', outlet: this._rowOutlet }, |
| { tag: 'tfoot', outlet: this._footerRowOutlet }, |
| ]; |
| for (var _a = 0, sections_1 = sections; _a < sections_1.length; _a++) { |
| var section = sections_1[_a]; |
| /** @type {?} */ |
| var element = this._document.createElement(section.tag); |
| element.setAttribute('role', 'rowgroup'); |
| element.appendChild(section.outlet.elementRef.nativeElement); |
| documentFragment.appendChild(element); |
| } |
| // Use a DocumentFragment so we don't hit the DOM on each iteration. |
| this._elementRef.nativeElement.appendChild(documentFragment); |
| }; |
| /** |
| * Forces a re-render of the data rows. Should be called in cases where there has been an input |
| * change that affects the evaluation of which rows should be rendered, e.g. toggling |
| * `multiTemplateDataRows` or adding/removing row definitions. |
| */ |
| /** |
| * Forces a re-render of the data rows. Should be called in cases where there has been an input |
| * change that affects the evaluation of which rows should be rendered, e.g. toggling |
| * `multiTemplateDataRows` or adding/removing row definitions. |
| * @private |
| * @return {?} |
| */ |
| CdkTable.prototype._forceRenderDataRows = /** |
| * Forces a re-render of the data rows. Should be called in cases where there has been an input |
| * change that affects the evaluation of which rows should be rendered, e.g. toggling |
| * `multiTemplateDataRows` or adding/removing row definitions. |
| * @private |
| * @return {?} |
| */ |
| function () { |
| this._dataDiffer.diff([]); |
| this._rowOutlet.viewContainer.clear(); |
| this.renderRows(); |
| this.updateStickyColumnStyles(); |
| }; |
| /** |
| * Checks if there has been a change in sticky states since last check and applies the correct |
| * sticky styles. Since checking resets the "dirty" state, this should only be performed once |
| * during a change detection and after the inputs are settled (after content check). |
| */ |
| /** |
| * Checks if there has been a change in sticky states since last check and applies the correct |
| * sticky styles. Since checking resets the "dirty" state, this should only be performed once |
| * during a change detection and after the inputs are settled (after content check). |
| * @private |
| * @return {?} |
| */ |
| CdkTable.prototype._checkStickyStates = /** |
| * Checks if there has been a change in sticky states since last check and applies the correct |
| * sticky styles. Since checking resets the "dirty" state, this should only be performed once |
| * during a change detection and after the inputs are settled (after content check). |
| * @private |
| * @return {?} |
| */ |
| function () { |
| /** @type {?} */ |
| var stickyCheckReducer = (/** |
| * @param {?} acc |
| * @param {?} d |
| * @return {?} |
| */ |
| function (acc, d) { |
| return acc || d.hasStickyChanged(); |
| }); |
| // Note that the check needs to occur for every definition since it notifies the definition |
| // that it can reset its dirty state. Using another operator like `some` may short-circuit |
| // remaining definitions and leave them in an unchecked state. |
| if (this._headerRowDefs.reduce(stickyCheckReducer, false)) { |
| this.updateStickyHeaderRowStyles(); |
| } |
| if (this._footerRowDefs.reduce(stickyCheckReducer, false)) { |
| this.updateStickyFooterRowStyles(); |
| } |
| if (Array.from(this._columnDefsByName.values()).reduce(stickyCheckReducer, false)) { |
| this.updateStickyColumnStyles(); |
| } |
| }; |
| /** |
| * Creates the sticky styler that will be used for sticky rows and columns. Listens |
| * for directionality changes and provides the latest direction to the styler. Re-applies column |
| * stickiness when directionality changes. |
| */ |
| /** |
| * Creates the sticky styler that will be used for sticky rows and columns. Listens |
| * for directionality changes and provides the latest direction to the styler. Re-applies column |
| * stickiness when directionality changes. |
| * @private |
| * @return {?} |
| */ |
| CdkTable.prototype._setupStickyStyler = /** |
| * Creates the sticky styler that will be used for sticky rows and columns. Listens |
| * for directionality changes and provides the latest direction to the styler. Re-applies column |
| * stickiness when directionality changes. |
| * @private |
| * @return {?} |
| */ |
| function () { |
| var _this = this; |
| /** @type {?} */ |
| var direction = this._dir ? this._dir.value : 'ltr'; |
| this._stickyStyler = new StickyStyler(this._isNativeHtmlTable, this.stickyCssClass, direction, this._platform.isBrowser); |
| (this._dir ? this._dir.change : of()) |
| .pipe(takeUntil(this._onDestroy)) |
| .subscribe((/** |
| * @param {?} value |
| * @return {?} |
| */ |
| function (value) { |
| _this._stickyStyler.direction = value; |
| _this.updateStickyColumnStyles(); |
| })); |
| }; |
| CdkTable.decorators = [ |
| { type: Component, args: [{selector: 'cdk-table, table[cdk-table]', |
| exportAs: 'cdkTable', |
| template: CDK_TABLE_TEMPLATE, |
| host: { |
| 'class': 'cdk-table', |
| }, |
| encapsulation: ViewEncapsulation.None, |
| // The "OnPush" status for the `MatTable` component is effectively a noop, so we are removing it. |
| // The view for `MatTable` consists entirely of templates declared in other views. As they are |
| // declared elsewhere, they are checked when their declaration points are checked. |
| // tslint:disable-next-line:validate-decorators |
| changeDetection: ChangeDetectionStrategy.Default, |
| },] }, |
| ]; |
| /** @nocollapse */ |
| CdkTable.ctorParameters = function () { return [ |
| { type: IterableDiffers }, |
| { type: ChangeDetectorRef }, |
| { type: ElementRef }, |
| { type: String, decorators: [{ type: Attribute, args: ['role',] }] }, |
| { type: Directionality, decorators: [{ type: Optional }] }, |
| { type: undefined, decorators: [{ type: Inject, args: [DOCUMENT,] }] }, |
| { type: Platform } |
| ]; }; |
| CdkTable.propDecorators = { |
| trackBy: [{ type: Input }], |
| dataSource: [{ type: Input }], |
| multiTemplateDataRows: [{ type: Input }], |
| _rowOutlet: [{ type: ViewChild, args: [DataRowOutlet, { static: true },] }], |
| _headerRowOutlet: [{ type: ViewChild, args: [HeaderRowOutlet, { static: true },] }], |
| _footerRowOutlet: [{ type: ViewChild, args: [FooterRowOutlet, { static: true },] }], |
| _contentColumnDefs: [{ type: ContentChildren, args: [CdkColumnDef,] }], |
| _contentRowDefs: [{ type: ContentChildren, args: [CdkRowDef,] }], |
| _contentHeaderRowDefs: [{ type: ContentChildren, args: [CdkHeaderRowDef,] }], |
| _contentFooterRowDefs: [{ type: ContentChildren, args: [CdkFooterRowDef,] }] |
| }; |
| return CdkTable; |
| }()); |
| /** |
| * Utility function that gets a merged list of the entries in a QueryList and values of a Set. |
| * @template T |
| * @param {?} queryList |
| * @param {?} set |
| * @return {?} |
| */ |
| function mergeQueryListAndSet(queryList, set) { |
| return queryList.toArray().concat(Array.from(set)); |
| } |
| |
| /** |
| * @fileoverview added by tsickle |
| * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc |
| */ |
| /** |
| * Injection token that can be used to specify the text column options. |
| * @type {?} |
| */ |
| var TEXT_COLUMN_OPTIONS = new InjectionToken('text-column-options'); |
| /** |
| * Column that simply shows text content for the header and row cells. Assumes that the table |
| * is using the native table implementation (`<table>`). |
| * |
| * By default, the name of this column will be the header text and data property accessor. |
| * The header text can be overridden with the `headerText` input. Cell values can be overridden with |
| * the `dataAccessor` input. Change the text justification to the start or end using the `justify` |
| * input. |
| * @template T |
| */ |
| var CdkTextColumn = /** @class */ (function () { |
| function CdkTextColumn(_table, _options) { |
| this._table = _table; |
| this._options = _options; |
| /** |
| * Alignment of the cell values. |
| */ |
| this.justify = 'start'; |
| this._options = _options || {}; |
| } |
| Object.defineProperty(CdkTextColumn.prototype, "name", { |
| /** Column name that should be used to reference this column. */ |
| get: /** |
| * Column name that should be used to reference this column. |
| * @return {?} |
| */ |
| function () { |
| return this._name; |
| }, |
| set: /** |
| * @param {?} name |
| * @return {?} |
| */ |
| function (name) { |
| this._name = name; |
| // With Ivy, inputs can be initialized before static query results are |
| // available. In that case, we defer the synchronization until "ngOnInit" fires. |
| this._syncColumnDefName(); |
| }, |
| enumerable: true, |
| configurable: true |
| }); |
| /** |
| * @return {?} |
| */ |
| CdkTextColumn.prototype.ngOnInit = /** |
| * @return {?} |
| */ |
| function () { |
| this._syncColumnDefName(); |
| if (this.headerText === undefined) { |
| this.headerText = this._createDefaultHeaderText(); |
| } |
| if (!this.dataAccessor) { |
| this.dataAccessor = |
| this._options.defaultDataAccessor || ((/** |
| * @param {?} data |
| * @param {?} name |
| * @return {?} |
| */ |
| function (data, name) { return ((/** @type {?} */ (data)))[name]; })); |
| } |
| if (this._table) { |
| // Provide the cell and headerCell directly to the table with the static `ViewChild` query, |
| // since the columnDef will not pick up its content by the time the table finishes checking |
| // its content and initializing the rows. |
| this.columnDef.cell = this.cell; |
| this.columnDef.headerCell = this.headerCell; |
| this._table.addColumnDef(this.columnDef); |
| } |
| else { |
| throw getTableTextColumnMissingParentTableError(); |
| } |
| }; |
| /** |
| * @return {?} |
| */ |
| CdkTextColumn.prototype.ngOnDestroy = /** |
| * @return {?} |
| */ |
| function () { |
| if (this._table) { |
| this._table.removeColumnDef(this.columnDef); |
| } |
| }; |
| /** |
| * Creates a default header text. Use the options' header text transformation function if one |
| * has been provided. Otherwise simply capitalize the column name. |
| */ |
| /** |
| * Creates a default header text. Use the options' header text transformation function if one |
| * has been provided. Otherwise simply capitalize the column name. |
| * @return {?} |
| */ |
| CdkTextColumn.prototype._createDefaultHeaderText = /** |
| * Creates a default header text. Use the options' header text transformation function if one |
| * has been provided. Otherwise simply capitalize the column name. |
| * @return {?} |
| */ |
| function () { |
| /** @type {?} */ |
| var name = this.name; |
| if (isDevMode() && !name) { |
| throw getTableTextColumnMissingNameError(); |
| } |
| if (this._options && this._options.defaultHeaderTextTransform) { |
| return this._options.defaultHeaderTextTransform(name); |
| } |
| return name[0].toUpperCase() + name.slice(1); |
| }; |
| /** Synchronizes the column definition name with the text column name. */ |
| /** |
| * Synchronizes the column definition name with the text column name. |
| * @private |
| * @return {?} |
| */ |
| CdkTextColumn.prototype._syncColumnDefName = /** |
| * Synchronizes the column definition name with the text column name. |
| * @private |
| * @return {?} |
| */ |
| function () { |
| if (this.columnDef) { |
| this.columnDef.name = this.name; |
| } |
| }; |
| CdkTextColumn.decorators = [ |
| { type: Component, args: [{selector: 'cdk-text-column', |
| template: "\n <ng-container cdkColumnDef>\n <th cdk-header-cell *cdkHeaderCellDef [style.text-align]=\"justify\">\n {{headerText}}\n </th>\n <td cdk-cell *cdkCellDef=\"let data\" [style.text-align]=\"justify\">\n {{dataAccessor(data, name)}}\n </td>\n </ng-container>\n ", |
| encapsulation: ViewEncapsulation.None, |
| // Change detection is intentionally not set to OnPush. This component's template will be provided |
| // to the table to be inserted into its view. This is problematic when change detection runs since |
| // the bindings in this template will be evaluated _after_ the table's view is evaluated, which |
| // mean's the template in the table's view will not have the updated value (and in fact will cause |
| // an ExpressionChangedAfterItHasBeenCheckedError). |
| // tslint:disable-next-line:validate-decorators |
| changeDetection: ChangeDetectionStrategy.Default, |
| },] }, |
| ]; |
| /** @nocollapse */ |
| CdkTextColumn.ctorParameters = function () { return [ |
| { type: CdkTable, decorators: [{ type: Optional }] }, |
| { type: undefined, decorators: [{ type: Optional }, { type: Inject, args: [TEXT_COLUMN_OPTIONS,] }] } |
| ]; }; |
| CdkTextColumn.propDecorators = { |
| name: [{ type: Input }], |
| headerText: [{ type: Input }], |
| dataAccessor: [{ type: Input }], |
| justify: [{ type: Input }], |
| columnDef: [{ type: ViewChild, args: [CdkColumnDef, { static: true },] }], |
| cell: [{ type: ViewChild, args: [CdkCellDef, { static: true },] }], |
| headerCell: [{ type: ViewChild, args: [CdkHeaderCellDef, { static: true },] }] |
| }; |
| return CdkTextColumn; |
| }()); |
| |
| /** |
| * @fileoverview added by tsickle |
| * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc |
| */ |
| /** @type {?} */ |
| var EXPORTED_DECLARATIONS = [ |
| CdkTable, |
| CdkRowDef, |
| CdkCellDef, |
| CdkCellOutlet, |
| CdkHeaderCellDef, |
| CdkFooterCellDef, |
| CdkColumnDef, |
| CdkCell, |
| CdkRow, |
| CdkHeaderCell, |
| CdkFooterCell, |
| CdkHeaderRow, |
| CdkHeaderRowDef, |
| CdkFooterRow, |
| CdkFooterRowDef, |
| DataRowOutlet, |
| HeaderRowOutlet, |
| FooterRowOutlet, |
| CdkTextColumn, |
| ]; |
| var CdkTableModule = /** @class */ (function () { |
| function CdkTableModule() { |
| } |
| CdkTableModule.decorators = [ |
| { type: NgModule, args: [{ |
| imports: [CommonModule], |
| exports: EXPORTED_DECLARATIONS, |
| declarations: EXPORTED_DECLARATIONS |
| },] }, |
| ]; |
| return CdkTableModule; |
| }()); |
| |
| /** |
| * @fileoverview added by tsickle |
| * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc |
| */ |
| |
| /** |
| * @fileoverview added by tsickle |
| * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc |
| */ |
| |
| export { DataRowOutlet, HeaderRowOutlet, FooterRowOutlet, CDK_TABLE_TEMPLATE, CdkTable, CdkCellDef, CdkHeaderCellDef, CdkFooterCellDef, CdkColumnDef, BaseCdkCell, CdkHeaderCell, CdkFooterCell, CdkCell, CDK_ROW_TEMPLATE, BaseRowDef, CdkHeaderRowDef, CdkFooterRowDef, CdkRowDef, CdkCellOutlet, CdkHeaderRow, CdkFooterRow, CdkRow, CdkTableModule, STICKY_DIRECTIONS, StickyStyler, mixinHasStickyInput, TEXT_COLUMN_OPTIONS, CdkTextColumn }; |
| //# sourceMappingURL=table.es5.js.map |