1 | import * as i1 from '@angular/cdk/bidi';
|
2 | import { coerceBooleanProperty } from '@angular/cdk/coercion';
|
3 | import { _VIEW_REPEATER_STRATEGY, _RecycleViewRepeaterStrategy, isDataSource, _DisposeViewRepeaterStrategy } from '@angular/cdk/collections';
|
4 | export { DataSource } from '@angular/cdk/collections';
|
5 | import * as i2 from '@angular/cdk/platform';
|
6 | import * as i3 from '@angular/cdk/scrolling';
|
7 | import { ScrollingModule } from '@angular/cdk/scrolling';
|
8 | import { DOCUMENT } from '@angular/common';
|
9 | import * as i0 from '@angular/core';
|
10 | import { InjectionToken, Directive, Inject, Optional, Input, ContentChild, Injectable, Component, ChangeDetectionStrategy, ViewEncapsulation, EmbeddedViewRef, EventEmitter, NgZone, Attribute, SkipSelf, Output, ViewChild, ContentChildren, NgModule } from '@angular/core';
|
11 | import { Subject, from, BehaviorSubject, isObservable, of } from 'rxjs';
|
12 | import { takeUntil, take } from 'rxjs/operators';
|
13 |
|
14 |
|
15 |
|
16 |
|
17 |
|
18 |
|
19 |
|
20 | function mixinHasStickyInput(base) {
|
21 | return class extends base {
|
22 |
|
23 | get sticky() {
|
24 | return this._sticky;
|
25 | }
|
26 | set sticky(v) {
|
27 | const prevValue = this._sticky;
|
28 | this._sticky = coerceBooleanProperty(v);
|
29 | this._hasStickyChanged = prevValue !== this._sticky;
|
30 | }
|
31 |
|
32 | hasStickyChanged() {
|
33 | const hasStickyChanged = this._hasStickyChanged;
|
34 | this._hasStickyChanged = false;
|
35 | return hasStickyChanged;
|
36 | }
|
37 |
|
38 | resetStickyChanged() {
|
39 | this._hasStickyChanged = false;
|
40 | }
|
41 | constructor(...args) {
|
42 | super(...args);
|
43 | this._sticky = false;
|
44 |
|
45 | this._hasStickyChanged = false;
|
46 | }
|
47 | };
|
48 | }
|
49 |
|
50 |
|
51 |
|
52 |
|
53 |
|
54 | const CDK_TABLE = new InjectionToken('CDK_TABLE');
|
55 |
|
56 | const TEXT_COLUMN_OPTIONS = new InjectionToken('text-column-options');
|
57 |
|
58 |
|
59 |
|
60 |
|
61 |
|
62 | class CdkCellDef {
|
63 | constructor(/** @docs-private */ template) {
|
64 | this.template = template;
|
65 | }
|
66 | static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: CdkCellDef, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
|
67 | static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.0", type: CdkCellDef, selector: "[cdkCellDef]", ngImport: i0 }); }
|
68 | }
|
69 | i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: CdkCellDef, decorators: [{
|
70 | type: Directive,
|
71 | args: [{ selector: '[cdkCellDef]' }]
|
72 | }], ctorParameters: function () { return [{ type: i0.TemplateRef }]; } });
|
73 |
|
74 |
|
75 |
|
76 |
|
77 | class CdkHeaderCellDef {
|
78 | constructor(/** @docs-private */ template) {
|
79 | this.template = template;
|
80 | }
|
81 | static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: CdkHeaderCellDef, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
|
82 | static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.0", type: CdkHeaderCellDef, selector: "[cdkHeaderCellDef]", ngImport: i0 }); }
|
83 | }
|
84 | i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: CdkHeaderCellDef, decorators: [{
|
85 | type: Directive,
|
86 | args: [{ selector: '[cdkHeaderCellDef]' }]
|
87 | }], ctorParameters: function () { return [{ type: i0.TemplateRef }]; } });
|
88 |
|
89 |
|
90 |
|
91 |
|
92 | class CdkFooterCellDef {
|
93 | constructor(/** @docs-private */ template) {
|
94 | this.template = template;
|
95 | }
|
96 | static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: CdkFooterCellDef, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
|
97 | static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.0", type: CdkFooterCellDef, selector: "[cdkFooterCellDef]", ngImport: i0 }); }
|
98 | }
|
99 | i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: CdkFooterCellDef, decorators: [{
|
100 | type: Directive,
|
101 | args: [{ selector: '[cdkFooterCellDef]' }]
|
102 | }], ctorParameters: function () { return [{ type: i0.TemplateRef }]; } });
|
103 |
|
104 |
|
105 | class CdkColumnDefBase {
|
106 | }
|
107 | const _CdkColumnDefBase = mixinHasStickyInput(CdkColumnDefBase);
|
108 |
|
109 |
|
110 |
|
111 |
|
112 | class CdkColumnDef extends _CdkColumnDefBase {
|
113 |
|
114 | get name() {
|
115 | return this._name;
|
116 | }
|
117 | set name(name) {
|
118 | this._setNameInput(name);
|
119 | }
|
120 | |
121 |
|
122 |
|
123 |
|
124 |
|
125 | get stickyEnd() {
|
126 | return this._stickyEnd;
|
127 | }
|
128 | set stickyEnd(v) {
|
129 | const prevValue = this._stickyEnd;
|
130 | this._stickyEnd = coerceBooleanProperty(v);
|
131 | this._hasStickyChanged = prevValue !== this._stickyEnd;
|
132 | }
|
133 | constructor(_table) {
|
134 | super();
|
135 | this._table = _table;
|
136 | this._stickyEnd = false;
|
137 | }
|
138 | |
139 |
|
140 |
|
141 |
|
142 |
|
143 |
|
144 |
|
145 | _updateColumnCssClassName() {
|
146 | this._columnCssClassName = [`cdk-column-${this.cssClassFriendlyName}`];
|
147 | }
|
148 | |
149 |
|
150 |
|
151 |
|
152 |
|
153 |
|
154 | _setNameInput(value) {
|
155 |
|
156 |
|
157 | if (value) {
|
158 | this._name = value;
|
159 | this.cssClassFriendlyName = value.replace(/[^a-z0-9_-]/gi, '-');
|
160 | this._updateColumnCssClassName();
|
161 | }
|
162 | }
|
163 | static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: CdkColumnDef, deps: [{ token: CDK_TABLE, optional: true }], target: i0.ɵɵFactoryTarget.Directive }); }
|
164 | static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.0", type: CdkColumnDef, selector: "[cdkColumnDef]", inputs: { sticky: "sticky", name: ["cdkColumnDef", "name"], stickyEnd: "stickyEnd" }, providers: [{ provide: 'MAT_SORT_HEADER_COLUMN_DEF', useExisting: CdkColumnDef }], queries: [{ propertyName: "cell", first: true, predicate: CdkCellDef, descendants: true }, { propertyName: "headerCell", first: true, predicate: CdkHeaderCellDef, descendants: true }, { propertyName: "footerCell", first: true, predicate: CdkFooterCellDef, descendants: true }], usesInheritance: true, ngImport: i0 }); }
|
165 | }
|
166 | i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: CdkColumnDef, decorators: [{
|
167 | type: Directive,
|
168 | args: [{
|
169 | selector: '[cdkColumnDef]',
|
170 | inputs: ['sticky'],
|
171 | providers: [{ provide: 'MAT_SORT_HEADER_COLUMN_DEF', useExisting: CdkColumnDef }],
|
172 | }]
|
173 | }], ctorParameters: function () { return [{ type: undefined, decorators: [{
|
174 | type: Inject,
|
175 | args: [CDK_TABLE]
|
176 | }, {
|
177 | type: Optional
|
178 | }] }]; }, propDecorators: { name: [{
|
179 | type: Input,
|
180 | args: ['cdkColumnDef']
|
181 | }], stickyEnd: [{
|
182 | type: Input,
|
183 | args: ['stickyEnd']
|
184 | }], cell: [{
|
185 | type: ContentChild,
|
186 | args: [CdkCellDef]
|
187 | }], headerCell: [{
|
188 | type: ContentChild,
|
189 | args: [CdkHeaderCellDef]
|
190 | }], footerCell: [{
|
191 | type: ContentChild,
|
192 | args: [CdkFooterCellDef]
|
193 | }] } });
|
194 |
|
195 | class BaseCdkCell {
|
196 | constructor(columnDef, elementRef) {
|
197 | elementRef.nativeElement.classList.add(...columnDef._columnCssClassName);
|
198 | }
|
199 | }
|
200 |
|
201 | class CdkHeaderCell extends BaseCdkCell {
|
202 | constructor(columnDef, elementRef) {
|
203 | super(columnDef, elementRef);
|
204 | }
|
205 | static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: CdkHeaderCell, deps: [{ token: CdkColumnDef }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive }); }
|
206 | static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.0", type: CdkHeaderCell, selector: "cdk-header-cell, th[cdk-header-cell]", host: { attributes: { "role": "columnheader" }, classAttribute: "cdk-header-cell" }, usesInheritance: true, ngImport: i0 }); }
|
207 | }
|
208 | i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: CdkHeaderCell, decorators: [{
|
209 | type: Directive,
|
210 | args: [{
|
211 | selector: 'cdk-header-cell, th[cdk-header-cell]',
|
212 | host: {
|
213 | 'class': 'cdk-header-cell',
|
214 | 'role': 'columnheader',
|
215 | },
|
216 | }]
|
217 | }], ctorParameters: function () { return [{ type: CdkColumnDef }, { type: i0.ElementRef }]; } });
|
218 |
|
219 | class CdkFooterCell extends BaseCdkCell {
|
220 | constructor(columnDef, elementRef) {
|
221 | super(columnDef, elementRef);
|
222 | if (columnDef._table?._elementRef.nativeElement.nodeType === 1) {
|
223 | const tableRole = columnDef._table._elementRef.nativeElement.getAttribute('role');
|
224 | const role = tableRole === 'grid' || tableRole === 'treegrid' ? 'gridcell' : 'cell';
|
225 | elementRef.nativeElement.setAttribute('role', role);
|
226 | }
|
227 | }
|
228 | static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: CdkFooterCell, deps: [{ token: CdkColumnDef }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive }); }
|
229 | static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.0", type: CdkFooterCell, selector: "cdk-footer-cell, td[cdk-footer-cell]", host: { classAttribute: "cdk-footer-cell" }, usesInheritance: true, ngImport: i0 }); }
|
230 | }
|
231 | i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: CdkFooterCell, decorators: [{
|
232 | type: Directive,
|
233 | args: [{
|
234 | selector: 'cdk-footer-cell, td[cdk-footer-cell]',
|
235 | host: {
|
236 | 'class': 'cdk-footer-cell',
|
237 | },
|
238 | }]
|
239 | }], ctorParameters: function () { return [{ type: CdkColumnDef }, { type: i0.ElementRef }]; } });
|
240 |
|
241 | class CdkCell extends BaseCdkCell {
|
242 | constructor(columnDef, elementRef) {
|
243 | super(columnDef, elementRef);
|
244 | if (columnDef._table?._elementRef.nativeElement.nodeType === 1) {
|
245 | const tableRole = columnDef._table._elementRef.nativeElement.getAttribute('role');
|
246 | const role = tableRole === 'grid' || tableRole === 'treegrid' ? 'gridcell' : 'cell';
|
247 | elementRef.nativeElement.setAttribute('role', role);
|
248 | }
|
249 | }
|
250 | static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: CdkCell, deps: [{ token: CdkColumnDef }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive }); }
|
251 | static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.0", type: CdkCell, selector: "cdk-cell, td[cdk-cell]", host: { classAttribute: "cdk-cell" }, usesInheritance: true, ngImport: i0 }); }
|
252 | }
|
253 | i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: CdkCell, decorators: [{
|
254 | type: Directive,
|
255 | args: [{
|
256 | selector: 'cdk-cell, td[cdk-cell]',
|
257 | host: {
|
258 | 'class': 'cdk-cell',
|
259 | },
|
260 | }]
|
261 | }], ctorParameters: function () { return [{ type: CdkColumnDef }, { type: i0.ElementRef }]; } });
|
262 |
|
263 |
|
264 |
|
265 |
|
266 | class _Schedule {
|
267 | constructor() {
|
268 | this.tasks = [];
|
269 | this.endTasks = [];
|
270 | }
|
271 | }
|
272 |
|
273 | const _COALESCED_STYLE_SCHEDULER = new InjectionToken('_COALESCED_STYLE_SCHEDULER');
|
274 |
|
275 |
|
276 |
|
277 |
|
278 |
|
279 |
|
280 |
|
281 | class _CoalescedStyleScheduler {
|
282 | constructor(_ngZone) {
|
283 | this._ngZone = _ngZone;
|
284 | this._currentSchedule = null;
|
285 | this._destroyed = new Subject();
|
286 | }
|
287 | |
288 |
|
289 |
|
290 | schedule(task) {
|
291 | this._createScheduleIfNeeded();
|
292 | this._currentSchedule.tasks.push(task);
|
293 | }
|
294 | |
295 |
|
296 |
|
297 |
|
298 | scheduleEnd(task) {
|
299 | this._createScheduleIfNeeded();
|
300 | this._currentSchedule.endTasks.push(task);
|
301 | }
|
302 |
|
303 | ngOnDestroy() {
|
304 | this._destroyed.next();
|
305 | this._destroyed.complete();
|
306 | }
|
307 | _createScheduleIfNeeded() {
|
308 | if (this._currentSchedule) {
|
309 | return;
|
310 | }
|
311 | this._currentSchedule = new _Schedule();
|
312 | this._getScheduleObservable()
|
313 | .pipe(takeUntil(this._destroyed))
|
314 | .subscribe(() => {
|
315 | while (this._currentSchedule.tasks.length || this._currentSchedule.endTasks.length) {
|
316 | const schedule = this._currentSchedule;
|
317 |
|
318 | this._currentSchedule = new _Schedule();
|
319 | for (const task of schedule.tasks) {
|
320 | task();
|
321 | }
|
322 | for (const task of schedule.endTasks) {
|
323 | task();
|
324 | }
|
325 | }
|
326 | this._currentSchedule = null;
|
327 | });
|
328 | }
|
329 | _getScheduleObservable() {
|
330 |
|
331 |
|
332 | return this._ngZone.isStable
|
333 | ? from(Promise.resolve(undefined))
|
334 | : this._ngZone.onStable.pipe(take(1));
|
335 | }
|
336 | static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: _CoalescedStyleScheduler, deps: [{ token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Injectable }); }
|
337 | static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: _CoalescedStyleScheduler }); }
|
338 | }
|
339 | i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: _CoalescedStyleScheduler, decorators: [{
|
340 | type: Injectable
|
341 | }], ctorParameters: function () { return [{ type: i0.NgZone }]; } });
|
342 |
|
343 |
|
344 |
|
345 |
|
346 |
|
347 | const CDK_ROW_TEMPLATE = `<ng-container cdkCellOutlet></ng-container>`;
|
348 |
|
349 |
|
350 |
|
351 |
|
352 | class BaseRowDef {
|
353 | constructor(
|
354 | /** @docs-private */ template, _differs) {
|
355 | this.template = template;
|
356 | this._differs = _differs;
|
357 | }
|
358 | ngOnChanges(changes) {
|
359 |
|
360 |
|
361 | if (!this._columnsDiffer) {
|
362 | const columns = (changes['columns'] && changes['columns'].currentValue) || [];
|
363 | this._columnsDiffer = this._differs.find(columns).create();
|
364 | this._columnsDiffer.diff(columns);
|
365 | }
|
366 | }
|
367 | |
368 |
|
369 |
|
370 |
|
371 | getColumnsDiff() {
|
372 | return this._columnsDiffer.diff(this.columns);
|
373 | }
|
374 |
|
375 | extractCellTemplate(column) {
|
376 | if (this instanceof CdkHeaderRowDef) {
|
377 | return column.headerCell.template;
|
378 | }
|
379 | if (this instanceof CdkFooterRowDef) {
|
380 | return column.footerCell.template;
|
381 | }
|
382 | else {
|
383 | return column.cell.template;
|
384 | }
|
385 | }
|
386 | static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: BaseRowDef, deps: [{ token: i0.TemplateRef }, { token: i0.IterableDiffers }], target: i0.ɵɵFactoryTarget.Directive }); }
|
387 | static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.0", type: BaseRowDef, usesOnChanges: true, ngImport: i0 }); }
|
388 | }
|
389 | i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: BaseRowDef, decorators: [{
|
390 | type: Directive
|
391 | }], ctorParameters: function () { return [{ type: i0.TemplateRef }, { type: i0.IterableDiffers }]; } });
|
392 |
|
393 |
|
394 | class CdkHeaderRowDefBase extends BaseRowDef {
|
395 | }
|
396 | const _CdkHeaderRowDefBase = mixinHasStickyInput(CdkHeaderRowDefBase);
|
397 |
|
398 |
|
399 |
|
400 |
|
401 | class CdkHeaderRowDef extends _CdkHeaderRowDefBase {
|
402 | constructor(template, _differs, _table) {
|
403 | super(template, _differs);
|
404 | this._table = _table;
|
405 | }
|
406 |
|
407 |
|
408 | ngOnChanges(changes) {
|
409 | super.ngOnChanges(changes);
|
410 | }
|
411 | static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: CdkHeaderRowDef, deps: [{ token: i0.TemplateRef }, { token: i0.IterableDiffers }, { token: CDK_TABLE, optional: true }], target: i0.ɵɵFactoryTarget.Directive }); }
|
412 | static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.0", type: CdkHeaderRowDef, selector: "[cdkHeaderRowDef]", inputs: { columns: ["cdkHeaderRowDef", "columns"], sticky: ["cdkHeaderRowDefSticky", "sticky"] }, usesInheritance: true, usesOnChanges: true, ngImport: i0 }); }
|
413 | }
|
414 | i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: CdkHeaderRowDef, decorators: [{
|
415 | type: Directive,
|
416 | args: [{
|
417 | selector: '[cdkHeaderRowDef]',
|
418 | inputs: ['columns: cdkHeaderRowDef', 'sticky: cdkHeaderRowDefSticky'],
|
419 | }]
|
420 | }], ctorParameters: function () { return [{ type: i0.TemplateRef }, { type: i0.IterableDiffers }, { type: undefined, decorators: [{
|
421 | type: Inject,
|
422 | args: [CDK_TABLE]
|
423 | }, {
|
424 | type: Optional
|
425 | }] }]; } });
|
426 |
|
427 |
|
428 | class CdkFooterRowDefBase extends BaseRowDef {
|
429 | }
|
430 | const _CdkFooterRowDefBase = mixinHasStickyInput(CdkFooterRowDefBase);
|
431 |
|
432 |
|
433 |
|
434 |
|
435 | class CdkFooterRowDef extends _CdkFooterRowDefBase {
|
436 | constructor(template, _differs, _table) {
|
437 | super(template, _differs);
|
438 | this._table = _table;
|
439 | }
|
440 |
|
441 |
|
442 | ngOnChanges(changes) {
|
443 | super.ngOnChanges(changes);
|
444 | }
|
445 | static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: CdkFooterRowDef, deps: [{ token: i0.TemplateRef }, { token: i0.IterableDiffers }, { token: CDK_TABLE, optional: true }], target: i0.ɵɵFactoryTarget.Directive }); }
|
446 | static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.0", type: CdkFooterRowDef, selector: "[cdkFooterRowDef]", inputs: { columns: ["cdkFooterRowDef", "columns"], sticky: ["cdkFooterRowDefSticky", "sticky"] }, usesInheritance: true, usesOnChanges: true, ngImport: i0 }); }
|
447 | }
|
448 | i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: CdkFooterRowDef, decorators: [{
|
449 | type: Directive,
|
450 | args: [{
|
451 | selector: '[cdkFooterRowDef]',
|
452 | inputs: ['columns: cdkFooterRowDef', 'sticky: cdkFooterRowDefSticky'],
|
453 | }]
|
454 | }], ctorParameters: function () { return [{ type: i0.TemplateRef }, { type: i0.IterableDiffers }, { type: undefined, decorators: [{
|
455 | type: Inject,
|
456 | args: [CDK_TABLE]
|
457 | }, {
|
458 | type: Optional
|
459 | }] }]; } });
|
460 |
|
461 |
|
462 |
|
463 |
|
464 |
|
465 | class CdkRowDef extends BaseRowDef {
|
466 |
|
467 |
|
468 | constructor(template, _differs, _table) {
|
469 | super(template, _differs);
|
470 | this._table = _table;
|
471 | }
|
472 | static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: CdkRowDef, deps: [{ token: i0.TemplateRef }, { token: i0.IterableDiffers }, { token: CDK_TABLE, optional: true }], target: i0.ɵɵFactoryTarget.Directive }); }
|
473 | static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.0", type: CdkRowDef, selector: "[cdkRowDef]", inputs: { columns: ["cdkRowDefColumns", "columns"], when: ["cdkRowDefWhen", "when"] }, usesInheritance: true, ngImport: i0 }); }
|
474 | }
|
475 | i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: CdkRowDef, decorators: [{
|
476 | type: Directive,
|
477 | args: [{
|
478 | selector: '[cdkRowDef]',
|
479 | inputs: ['columns: cdkRowDefColumns', 'when: cdkRowDefWhen'],
|
480 | }]
|
481 | }], ctorParameters: function () { return [{ type: i0.TemplateRef }, { type: i0.IterableDiffers }, { type: undefined, decorators: [{
|
482 | type: Inject,
|
483 | args: [CDK_TABLE]
|
484 | }, {
|
485 | type: Optional
|
486 | }] }]; } });
|
487 |
|
488 |
|
489 |
|
490 |
|
491 | class CdkCellOutlet {
|
492 | |
493 |
|
494 |
|
495 |
|
496 |
|
497 |
|
498 |
|
499 | static { this.mostRecentCellOutlet = null; }
|
500 | constructor(_viewContainer) {
|
501 | this._viewContainer = _viewContainer;
|
502 | CdkCellOutlet.mostRecentCellOutlet = this;
|
503 | }
|
504 | ngOnDestroy() {
|
505 |
|
506 |
|
507 | if (CdkCellOutlet.mostRecentCellOutlet === this) {
|
508 | CdkCellOutlet.mostRecentCellOutlet = null;
|
509 | }
|
510 | }
|
511 | static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: CdkCellOutlet, deps: [{ token: i0.ViewContainerRef }], target: i0.ɵɵFactoryTarget.Directive }); }
|
512 | static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.0", type: CdkCellOutlet, selector: "[cdkCellOutlet]", ngImport: i0 }); }
|
513 | }
|
514 | i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: CdkCellOutlet, decorators: [{
|
515 | type: Directive,
|
516 | args: [{ selector: '[cdkCellOutlet]' }]
|
517 | }], ctorParameters: function () { return [{ type: i0.ViewContainerRef }]; } });
|
518 |
|
519 | class CdkHeaderRow {
|
520 | static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: CdkHeaderRow, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
521 | static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.0", type: CdkHeaderRow, selector: "cdk-header-row, tr[cdk-header-row]", host: { attributes: { "role": "row" }, classAttribute: "cdk-header-row" }, ngImport: i0, template: "<ng-container cdkCellOutlet></ng-container>", isInline: true, dependencies: [{ kind: "directive", type: CdkCellOutlet, selector: "[cdkCellOutlet]" }], changeDetection: i0.ChangeDetectionStrategy.Default, encapsulation: i0.ViewEncapsulation.None }); }
|
522 | }
|
523 | i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: CdkHeaderRow, decorators: [{
|
524 | type: Component,
|
525 | args: [{
|
526 | selector: 'cdk-header-row, tr[cdk-header-row]',
|
527 | template: CDK_ROW_TEMPLATE,
|
528 | host: {
|
529 | 'class': 'cdk-header-row',
|
530 | 'role': 'row',
|
531 | },
|
532 |
|
533 |
|
534 | changeDetection: ChangeDetectionStrategy.Default,
|
535 | encapsulation: ViewEncapsulation.None,
|
536 | }]
|
537 | }] });
|
538 |
|
539 | class CdkFooterRow {
|
540 | static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: CdkFooterRow, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
541 | static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.0", type: CdkFooterRow, selector: "cdk-footer-row, tr[cdk-footer-row]", host: { attributes: { "role": "row" }, classAttribute: "cdk-footer-row" }, ngImport: i0, template: "<ng-container cdkCellOutlet></ng-container>", isInline: true, dependencies: [{ kind: "directive", type: CdkCellOutlet, selector: "[cdkCellOutlet]" }], changeDetection: i0.ChangeDetectionStrategy.Default, encapsulation: i0.ViewEncapsulation.None }); }
|
542 | }
|
543 | i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: CdkFooterRow, decorators: [{
|
544 | type: Component,
|
545 | args: [{
|
546 | selector: 'cdk-footer-row, tr[cdk-footer-row]',
|
547 | template: CDK_ROW_TEMPLATE,
|
548 | host: {
|
549 | 'class': 'cdk-footer-row',
|
550 | 'role': 'row',
|
551 | },
|
552 |
|
553 |
|
554 | changeDetection: ChangeDetectionStrategy.Default,
|
555 | encapsulation: ViewEncapsulation.None,
|
556 | }]
|
557 | }] });
|
558 |
|
559 | class CdkRow {
|
560 | static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: CdkRow, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
561 | static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.0", type: CdkRow, selector: "cdk-row, tr[cdk-row]", host: { attributes: { "role": "row" }, classAttribute: "cdk-row" }, ngImport: i0, template: "<ng-container cdkCellOutlet></ng-container>", isInline: true, dependencies: [{ kind: "directive", type: CdkCellOutlet, selector: "[cdkCellOutlet]" }], changeDetection: i0.ChangeDetectionStrategy.Default, encapsulation: i0.ViewEncapsulation.None }); }
|
562 | }
|
563 | i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: CdkRow, decorators: [{
|
564 | type: Component,
|
565 | args: [{
|
566 | selector: 'cdk-row, tr[cdk-row]',
|
567 | template: CDK_ROW_TEMPLATE,
|
568 | host: {
|
569 | 'class': 'cdk-row',
|
570 | 'role': 'row',
|
571 | },
|
572 |
|
573 |
|
574 | changeDetection: ChangeDetectionStrategy.Default,
|
575 | encapsulation: ViewEncapsulation.None,
|
576 | }]
|
577 | }] });
|
578 |
|
579 | class CdkNoDataRow {
|
580 | constructor(templateRef) {
|
581 | this.templateRef = templateRef;
|
582 | this._contentClassName = 'cdk-no-data-row';
|
583 | }
|
584 | static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: CdkNoDataRow, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
|
585 | static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.0", type: CdkNoDataRow, selector: "ng-template[cdkNoDataRow]", ngImport: i0 }); }
|
586 | }
|
587 | i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: CdkNoDataRow, decorators: [{
|
588 | type: Directive,
|
589 | args: [{
|
590 | selector: 'ng-template[cdkNoDataRow]',
|
591 | }]
|
592 | }], ctorParameters: function () { return [{ type: i0.TemplateRef }]; } });
|
593 |
|
594 |
|
595 |
|
596 |
|
597 |
|
598 | const STICKY_DIRECTIONS = ['top', 'bottom', 'left', 'right'];
|
599 |
|
600 |
|
601 |
|
602 |
|
603 | class StickyStyler {
|
604 | |
605 |
|
606 |
|
607 |
|
608 |
|
609 |
|
610 |
|
611 |
|
612 |
|
613 |
|
614 |
|
615 |
|
616 |
|
617 |
|
618 | constructor(_isNativeHtmlTable, _stickCellCss, direction, _coalescedStyleScheduler, _isBrowser = true, _needsPositionStickyOnElement = true, _positionListener) {
|
619 | this._isNativeHtmlTable = _isNativeHtmlTable;
|
620 | this._stickCellCss = _stickCellCss;
|
621 | this.direction = direction;
|
622 | this._coalescedStyleScheduler = _coalescedStyleScheduler;
|
623 | this._isBrowser = _isBrowser;
|
624 | this._needsPositionStickyOnElement = _needsPositionStickyOnElement;
|
625 | this._positionListener = _positionListener;
|
626 | this._cachedCellWidths = [];
|
627 | this._borderCellCss = {
|
628 | 'top': `${_stickCellCss}-border-elem-top`,
|
629 | 'bottom': `${_stickCellCss}-border-elem-bottom`,
|
630 | 'left': `${_stickCellCss}-border-elem-left`,
|
631 | 'right': `${_stickCellCss}-border-elem-right`,
|
632 | };
|
633 | }
|
634 | |
635 |
|
636 |
|
637 |
|
638 |
|
639 |
|
640 | clearStickyPositioning(rows, stickyDirections) {
|
641 | const elementsToClear = [];
|
642 | for (const row of rows) {
|
643 |
|
644 |
|
645 | if (row.nodeType !== row.ELEMENT_NODE) {
|
646 | continue;
|
647 | }
|
648 | elementsToClear.push(row);
|
649 | for (let i = 0; i < row.children.length; i++) {
|
650 | elementsToClear.push(row.children[i]);
|
651 | }
|
652 | }
|
653 |
|
654 | this._coalescedStyleScheduler.schedule(() => {
|
655 | for (const element of elementsToClear) {
|
656 | this._removeStickyStyle(element, stickyDirections);
|
657 | }
|
658 | });
|
659 | }
|
660 | |
661 |
|
662 |
|
663 |
|
664 |
|
665 |
|
666 |
|
667 |
|
668 |
|
669 |
|
670 |
|
671 | updateStickyColumns(rows, stickyStartStates, stickyEndStates, recalculateCellWidths = true) {
|
672 | if (!rows.length ||
|
673 | !this._isBrowser ||
|
674 | !(stickyStartStates.some(state => state) || stickyEndStates.some(state => state))) {
|
675 | if (this._positionListener) {
|
676 | this._positionListener.stickyColumnsUpdated({ sizes: [] });
|
677 | this._positionListener.stickyEndColumnsUpdated({ sizes: [] });
|
678 | }
|
679 | return;
|
680 | }
|
681 | const firstRow = rows[0];
|
682 | const numCells = firstRow.children.length;
|
683 | const cellWidths = this._getCellWidths(firstRow, recalculateCellWidths);
|
684 | const startPositions = this._getStickyStartColumnPositions(cellWidths, stickyStartStates);
|
685 | const endPositions = this._getStickyEndColumnPositions(cellWidths, stickyEndStates);
|
686 | const lastStickyStart = stickyStartStates.lastIndexOf(true);
|
687 | const firstStickyEnd = stickyEndStates.indexOf(true);
|
688 |
|
689 | this._coalescedStyleScheduler.schedule(() => {
|
690 | const isRtl = this.direction === 'rtl';
|
691 | const start = isRtl ? 'right' : 'left';
|
692 | const end = isRtl ? 'left' : 'right';
|
693 | for (const row of rows) {
|
694 | for (let i = 0; i < numCells; i++) {
|
695 | const cell = row.children[i];
|
696 | if (stickyStartStates[i]) {
|
697 | this._addStickyStyle(cell, start, startPositions[i], i === lastStickyStart);
|
698 | }
|
699 | if (stickyEndStates[i]) {
|
700 | this._addStickyStyle(cell, end, endPositions[i], i === firstStickyEnd);
|
701 | }
|
702 | }
|
703 | }
|
704 | if (this._positionListener) {
|
705 | this._positionListener.stickyColumnsUpdated({
|
706 | sizes: lastStickyStart === -1
|
707 | ? []
|
708 | : cellWidths
|
709 | .slice(0, lastStickyStart + 1)
|
710 | .map((width, index) => (stickyStartStates[index] ? width : null)),
|
711 | });
|
712 | this._positionListener.stickyEndColumnsUpdated({
|
713 | sizes: firstStickyEnd === -1
|
714 | ? []
|
715 | : cellWidths
|
716 | .slice(firstStickyEnd)
|
717 | .map((width, index) => (stickyEndStates[index + firstStickyEnd] ? width : null))
|
718 | .reverse(),
|
719 | });
|
720 | }
|
721 | });
|
722 | }
|
723 | |
724 |
|
725 |
|
726 |
|
727 |
|
728 |
|
729 |
|
730 |
|
731 |
|
732 |
|
733 |
|
734 | stickRows(rowsToStick, stickyStates, position) {
|
735 |
|
736 | if (!this._isBrowser) {
|
737 | return;
|
738 | }
|
739 |
|
740 |
|
741 |
|
742 | const rows = position === 'bottom' ? rowsToStick.slice().reverse() : rowsToStick;
|
743 | const states = position === 'bottom' ? stickyStates.slice().reverse() : stickyStates;
|
744 |
|
745 | const stickyOffsets = [];
|
746 | const stickyCellHeights = [];
|
747 | const elementsToStick = [];
|
748 | for (let rowIndex = 0, stickyOffset = 0; rowIndex < rows.length; rowIndex++) {
|
749 | if (!states[rowIndex]) {
|
750 | continue;
|
751 | }
|
752 | stickyOffsets[rowIndex] = stickyOffset;
|
753 | const row = rows[rowIndex];
|
754 | elementsToStick[rowIndex] = this._isNativeHtmlTable
|
755 | ? Array.from(row.children)
|
756 | : [row];
|
757 | const height = row.getBoundingClientRect().height;
|
758 | stickyOffset += height;
|
759 | stickyCellHeights[rowIndex] = height;
|
760 | }
|
761 | const borderedRowIndex = states.lastIndexOf(true);
|
762 |
|
763 |
|
764 | this._coalescedStyleScheduler.schedule(() => {
|
765 | for (let rowIndex = 0; rowIndex < rows.length; rowIndex++) {
|
766 | if (!states[rowIndex]) {
|
767 | continue;
|
768 | }
|
769 | const offset = stickyOffsets[rowIndex];
|
770 | const isBorderedRowIndex = rowIndex === borderedRowIndex;
|
771 | for (const element of elementsToStick[rowIndex]) {
|
772 | this._addStickyStyle(element, position, offset, isBorderedRowIndex);
|
773 | }
|
774 | }
|
775 | if (position === 'top') {
|
776 | this._positionListener?.stickyHeaderRowsUpdated({
|
777 | sizes: stickyCellHeights,
|
778 | offsets: stickyOffsets,
|
779 | elements: elementsToStick,
|
780 | });
|
781 | }
|
782 | else {
|
783 | this._positionListener?.stickyFooterRowsUpdated({
|
784 | sizes: stickyCellHeights,
|
785 | offsets: stickyOffsets,
|
786 | elements: elementsToStick,
|
787 | });
|
788 | }
|
789 | });
|
790 | }
|
791 | |
792 |
|
793 |
|
794 |
|
795 |
|
796 |
|
797 | updateStickyFooterContainer(tableElement, stickyStates) {
|
798 | if (!this._isNativeHtmlTable) {
|
799 | return;
|
800 | }
|
801 | const tfoot = tableElement.querySelector('tfoot');
|
802 |
|
803 | this._coalescedStyleScheduler.schedule(() => {
|
804 | if (stickyStates.some(state => !state)) {
|
805 | this._removeStickyStyle(tfoot, ['bottom']);
|
806 | }
|
807 | else {
|
808 | this._addStickyStyle(tfoot, 'bottom', 0, false);
|
809 | }
|
810 | });
|
811 | }
|
812 | |
813 |
|
814 |
|
815 |
|
816 |
|
817 | _removeStickyStyle(element, stickyDirections) {
|
818 | for (const dir of stickyDirections) {
|
819 | element.style[dir] = '';
|
820 | element.classList.remove(this._borderCellCss[dir]);
|
821 | }
|
822 |
|
823 |
|
824 |
|
825 |
|
826 | const hasDirection = STICKY_DIRECTIONS.some(dir => stickyDirections.indexOf(dir) === -1 && element.style[dir]);
|
827 | if (hasDirection) {
|
828 | element.style.zIndex = this._getCalculatedZIndex(element);
|
829 | }
|
830 | else {
|
831 |
|
832 | element.style.zIndex = '';
|
833 | if (this._needsPositionStickyOnElement) {
|
834 | element.style.position = '';
|
835 | }
|
836 | element.classList.remove(this._stickCellCss);
|
837 | }
|
838 | }
|
839 | |
840 |
|
841 |
|
842 |
|
843 |
|
844 | _addStickyStyle(element, dir, dirValue, isBorderElement) {
|
845 | element.classList.add(this._stickCellCss);
|
846 | if (isBorderElement) {
|
847 | element.classList.add(this._borderCellCss[dir]);
|
848 | }
|
849 | element.style[dir] = `${dirValue}px`;
|
850 | element.style.zIndex = this._getCalculatedZIndex(element);
|
851 | if (this._needsPositionStickyOnElement) {
|
852 | element.style.cssText += 'position: -webkit-sticky; position: sticky; ';
|
853 | }
|
854 | }
|
855 | |
856 |
|
857 |
|
858 |
|
859 |
|
860 |
|
861 |
|
862 |
|
863 |
|
864 |
|
865 |
|
866 | _getCalculatedZIndex(element) {
|
867 | const zIndexIncrements = {
|
868 | top: 100,
|
869 | bottom: 10,
|
870 | left: 1,
|
871 | right: 1,
|
872 | };
|
873 | let zIndex = 0;
|
874 |
|
875 |
|
876 |
|
877 | for (const dir of STICKY_DIRECTIONS) {
|
878 | if (element.style[dir]) {
|
879 | zIndex += zIndexIncrements[dir];
|
880 | }
|
881 | }
|
882 | return zIndex ? `${zIndex}` : '';
|
883 | }
|
884 |
|
885 | _getCellWidths(row, recalculateCellWidths = true) {
|
886 | if (!recalculateCellWidths && this._cachedCellWidths.length) {
|
887 | return this._cachedCellWidths;
|
888 | }
|
889 | const cellWidths = [];
|
890 | const firstRowCells = row.children;
|
891 | for (let i = 0; i < firstRowCells.length; i++) {
|
892 | let cell = firstRowCells[i];
|
893 | cellWidths.push(cell.getBoundingClientRect().width);
|
894 | }
|
895 | this._cachedCellWidths = cellWidths;
|
896 | return cellWidths;
|
897 | }
|
898 | |
899 |
|
900 |
|
901 |
|
902 |
|
903 | _getStickyStartColumnPositions(widths, stickyStates) {
|
904 | const positions = [];
|
905 | let nextPosition = 0;
|
906 | for (let i = 0; i < widths.length; i++) {
|
907 | if (stickyStates[i]) {
|
908 | positions[i] = nextPosition;
|
909 | nextPosition += widths[i];
|
910 | }
|
911 | }
|
912 | return positions;
|
913 | }
|
914 | |
915 |
|
916 |
|
917 |
|
918 |
|
919 | _getStickyEndColumnPositions(widths, stickyStates) {
|
920 | const positions = [];
|
921 | let nextPosition = 0;
|
922 | for (let i = widths.length; i > 0; i--) {
|
923 | if (stickyStates[i]) {
|
924 | positions[i] = nextPosition;
|
925 | nextPosition += widths[i];
|
926 | }
|
927 | }
|
928 | return positions;
|
929 | }
|
930 | }
|
931 |
|
932 |
|
933 |
|
934 |
|
935 |
|
936 |
|
937 | function getTableUnknownColumnError(id) {
|
938 | return Error(`Could not find column with id "${id}".`);
|
939 | }
|
940 |
|
941 |
|
942 |
|
943 |
|
944 | function getTableDuplicateColumnNameError(name) {
|
945 | return Error(`Duplicate column definition name provided: "${name}".`);
|
946 | }
|
947 |
|
948 |
|
949 |
|
950 |
|
951 | function getTableMultipleDefaultRowDefsError() {
|
952 | return Error(`There can only be one default row without a when predicate function.`);
|
953 | }
|
954 |
|
955 |
|
956 |
|
957 |
|
958 | function getTableMissingMatchingRowDefError(data) {
|
959 | return Error(`Could not find a matching row definition for the` +
|
960 | `provided row data: ${JSON.stringify(data)}`);
|
961 | }
|
962 |
|
963 |
|
964 |
|
965 |
|
966 | function getTableMissingRowDefsError() {
|
967 | return Error('Missing definitions for header, footer, and row; ' +
|
968 | 'cannot determine which columns should be rendered.');
|
969 | }
|
970 |
|
971 |
|
972 |
|
973 |
|
974 | function getTableUnknownDataSourceError() {
|
975 | return Error(`Provided data source did not match an array, Observable, or DataSource`);
|
976 | }
|
977 |
|
978 |
|
979 |
|
980 |
|
981 | function getTableTextColumnMissingParentTableError() {
|
982 | return Error(`Text column could not find a parent table for registration.`);
|
983 | }
|
984 |
|
985 |
|
986 |
|
987 |
|
988 | function getTableTextColumnMissingNameError() {
|
989 | return Error(`Table text column must have a name.`);
|
990 | }
|
991 |
|
992 |
|
993 | const STICKY_POSITIONING_LISTENER = new InjectionToken('CDK_SPL');
|
994 |
|
995 |
|
996 |
|
997 |
|
998 |
|
999 | class CdkRecycleRows {
|
1000 | static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: CdkRecycleRows, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
1001 | static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.0", type: CdkRecycleRows, selector: "cdk-table[recycleRows], table[cdk-table][recycleRows]", providers: [{ provide: _VIEW_REPEATER_STRATEGY, useClass: _RecycleViewRepeaterStrategy }], ngImport: i0 }); }
|
1002 | }
|
1003 | i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: CdkRecycleRows, decorators: [{
|
1004 | type: Directive,
|
1005 | args: [{
|
1006 | selector: 'cdk-table[recycleRows], table[cdk-table][recycleRows]',
|
1007 | providers: [{ provide: _VIEW_REPEATER_STRATEGY, useClass: _RecycleViewRepeaterStrategy }],
|
1008 | }]
|
1009 | }] });
|
1010 |
|
1011 |
|
1012 |
|
1013 |
|
1014 | class DataRowOutlet {
|
1015 | constructor(viewContainer, elementRef) {
|
1016 | this.viewContainer = viewContainer;
|
1017 | this.elementRef = elementRef;
|
1018 | }
|
1019 | static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: DataRowOutlet, deps: [{ token: i0.ViewContainerRef }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive }); }
|
1020 | static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.0", type: DataRowOutlet, selector: "[rowOutlet]", ngImport: i0 }); }
|
1021 | }
|
1022 | i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: DataRowOutlet, decorators: [{
|
1023 | type: Directive,
|
1024 | args: [{ selector: '[rowOutlet]' }]
|
1025 | }], ctorParameters: function () { return [{ type: i0.ViewContainerRef }, { type: i0.ElementRef }]; } });
|
1026 |
|
1027 |
|
1028 |
|
1029 |
|
1030 | class HeaderRowOutlet {
|
1031 | constructor(viewContainer, elementRef) {
|
1032 | this.viewContainer = viewContainer;
|
1033 | this.elementRef = elementRef;
|
1034 | }
|
1035 | static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: HeaderRowOutlet, deps: [{ token: i0.ViewContainerRef }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive }); }
|
1036 | static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.0", type: HeaderRowOutlet, selector: "[headerRowOutlet]", ngImport: i0 }); }
|
1037 | }
|
1038 | i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: HeaderRowOutlet, decorators: [{
|
1039 | type: Directive,
|
1040 | args: [{ selector: '[headerRowOutlet]' }]
|
1041 | }], ctorParameters: function () { return [{ type: i0.ViewContainerRef }, { type: i0.ElementRef }]; } });
|
1042 |
|
1043 |
|
1044 |
|
1045 |
|
1046 | class FooterRowOutlet {
|
1047 | constructor(viewContainer, elementRef) {
|
1048 | this.viewContainer = viewContainer;
|
1049 | this.elementRef = elementRef;
|
1050 | }
|
1051 | static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: FooterRowOutlet, deps: [{ token: i0.ViewContainerRef }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive }); }
|
1052 | static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.0", type: FooterRowOutlet, selector: "[footerRowOutlet]", ngImport: i0 }); }
|
1053 | }
|
1054 | i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: FooterRowOutlet, decorators: [{
|
1055 | type: Directive,
|
1056 | args: [{ selector: '[footerRowOutlet]' }]
|
1057 | }], ctorParameters: function () { return [{ type: i0.ViewContainerRef }, { type: i0.ElementRef }]; } });
|
1058 |
|
1059 |
|
1060 |
|
1061 |
|
1062 |
|
1063 | class NoDataRowOutlet {
|
1064 | constructor(viewContainer, elementRef) {
|
1065 | this.viewContainer = viewContainer;
|
1066 | this.elementRef = elementRef;
|
1067 | }
|
1068 | static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: NoDataRowOutlet, deps: [{ token: i0.ViewContainerRef }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive }); }
|
1069 | static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.0", type: NoDataRowOutlet, selector: "[noDataRowOutlet]", ngImport: i0 }); }
|
1070 | }
|
1071 | i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: NoDataRowOutlet, decorators: [{
|
1072 | type: Directive,
|
1073 | args: [{ selector: '[noDataRowOutlet]' }]
|
1074 | }], ctorParameters: function () { return [{ type: i0.ViewContainerRef }, { type: i0.ElementRef }]; } });
|
1075 |
|
1076 |
|
1077 |
|
1078 |
|
1079 |
|
1080 | const CDK_TABLE_TEMPLATE =
|
1081 |
|
1082 |
|
1083 | `
|
1084 | <ng-content select="caption"></ng-content>
|
1085 | <ng-content select="colgroup, col"></ng-content>
|
1086 | <ng-container headerRowOutlet></ng-container>
|
1087 | <ng-container rowOutlet></ng-container>
|
1088 | <ng-container noDataRowOutlet></ng-container>
|
1089 | <ng-container footerRowOutlet></ng-container>
|
1090 | `;
|
1091 |
|
1092 |
|
1093 |
|
1094 |
|
1095 | class RowViewRef extends EmbeddedViewRef {
|
1096 | }
|
1097 |
|
1098 |
|
1099 |
|
1100 |
|
1101 |
|
1102 |
|
1103 | class CdkTable {
|
1104 | |
1105 |
|
1106 |
|
1107 |
|
1108 |
|
1109 |
|
1110 | get trackBy() {
|
1111 | return this._trackByFn;
|
1112 | }
|
1113 | set trackBy(fn) {
|
1114 | if ((typeof ngDevMode === 'undefined' || ngDevMode) && fn != null && typeof fn !== 'function') {
|
1115 | console.warn(`trackBy must be a function, but received ${JSON.stringify(fn)}.`);
|
1116 | }
|
1117 | this._trackByFn = fn;
|
1118 | }
|
1119 | |
1120 |
|
1121 |
|
1122 |
|
1123 |
|
1124 |
|
1125 |
|
1126 |
|
1127 |
|
1128 |
|
1129 |
|
1130 |
|
1131 |
|
1132 |
|
1133 |
|
1134 |
|
1135 |
|
1136 |
|
1137 |
|
1138 |
|
1139 | get dataSource() {
|
1140 | return this._dataSource;
|
1141 | }
|
1142 | set dataSource(dataSource) {
|
1143 | if (this._dataSource !== dataSource) {
|
1144 | this._switchDataSource(dataSource);
|
1145 | }
|
1146 | }
|
1147 | |
1148 |
|
1149 |
|
1150 |
|
1151 |
|
1152 |
|
1153 | get multiTemplateDataRows() {
|
1154 | return this._multiTemplateDataRows;
|
1155 | }
|
1156 | set multiTemplateDataRows(v) {
|
1157 | this._multiTemplateDataRows = coerceBooleanProperty(v);
|
1158 |
|
1159 |
|
1160 | if (this._rowOutlet && this._rowOutlet.viewContainer.length) {
|
1161 | this._forceRenderDataRows();
|
1162 | this.updateStickyColumnStyles();
|
1163 | }
|
1164 | }
|
1165 | |
1166 |
|
1167 |
|
1168 |
|
1169 | get fixedLayout() {
|
1170 | return this._fixedLayout;
|
1171 | }
|
1172 | set fixedLayout(v) {
|
1173 | this._fixedLayout = coerceBooleanProperty(v);
|
1174 |
|
1175 | this._forceRecalculateCellWidths = true;
|
1176 | this._stickyColumnStylesNeedReset = true;
|
1177 | }
|
1178 | constructor(_differs, _changeDetectorRef, _elementRef, role, _dir, _document, _platform, _viewRepeater, _coalescedStyleScheduler, _viewportRuler,
|
1179 | /**
|
1180 | * @deprecated `_stickyPositioningListener` parameter to become required.
|
1181 | * @breaking-change 13.0.0
|
1182 | */
|
1183 | _stickyPositioningListener,
|
1184 | /**
|
1185 | * @deprecated `_ngZone` parameter to become required.
|
1186 | * @breaking-change 14.0.0
|
1187 | */
|
1188 | _ngZone) {
|
1189 | this._differs = _differs;
|
1190 | this._changeDetectorRef = _changeDetectorRef;
|
1191 | this._elementRef = _elementRef;
|
1192 | this._dir = _dir;
|
1193 | this._platform = _platform;
|
1194 | this._viewRepeater = _viewRepeater;
|
1195 | this._coalescedStyleScheduler = _coalescedStyleScheduler;
|
1196 | this._viewportRuler = _viewportRuler;
|
1197 | this._stickyPositioningListener = _stickyPositioningListener;
|
1198 | this._ngZone = _ngZone;
|
1199 |
|
1200 | this._onDestroy = new Subject();
|
1201 | |
1202 |
|
1203 |
|
1204 |
|
1205 |
|
1206 | this._columnDefsByName = new Map();
|
1207 | |
1208 |
|
1209 |
|
1210 |
|
1211 |
|
1212 | this._customColumnDefs = new Set();
|
1213 | |
1214 |
|
1215 |
|
1216 |
|
1217 |
|
1218 | this._customRowDefs = new Set();
|
1219 | |
1220 |
|
1221 |
|
1222 |
|
1223 |
|
1224 | this._customHeaderRowDefs = new Set();
|
1225 | |
1226 |
|
1227 |
|
1228 |
|
1229 |
|
1230 | this._customFooterRowDefs = new Set();
|
1231 | |
1232 |
|
1233 |
|
1234 |
|
1235 | this._headerRowDefChanged = true;
|
1236 | |
1237 |
|
1238 |
|
1239 |
|
1240 | this._footerRowDefChanged = true;
|
1241 | |
1242 |
|
1243 |
|
1244 |
|
1245 | this._stickyColumnStylesNeedReset = true;
|
1246 | |
1247 |
|
1248 |
|
1249 |
|
1250 |
|
1251 | this._forceRecalculateCellWidths = true;
|
1252 | |
1253 |
|
1254 |
|
1255 |
|
1256 |
|
1257 |
|
1258 |
|
1259 |
|
1260 |
|
1261 |
|
1262 |
|
1263 |
|
1264 |
|
1265 | this._cachedRenderRowsMap = new Map();
|
1266 | |
1267 |
|
1268 |
|
1269 |
|
1270 | this.stickyCssClass = 'cdk-table-sticky';
|
1271 | |
1272 |
|
1273 |
|
1274 |
|
1275 |
|
1276 | this.needsPositionStickyOnElement = true;
|
1277 |
|
1278 | this._isShowingNoDataRow = false;
|
1279 | this._multiTemplateDataRows = false;
|
1280 | this._fixedLayout = false;
|
1281 | |
1282 |
|
1283 |
|
1284 |
|
1285 | this.contentChanged = new EventEmitter();
|
1286 |
|
1287 |
|
1288 | |
1289 |
|
1290 |
|
1291 |
|
1292 |
|
1293 |
|
1294 | this.viewChange = new BehaviorSubject({
|
1295 | start: 0,
|
1296 | end: Number.MAX_VALUE,
|
1297 | });
|
1298 | if (!role) {
|
1299 | this._elementRef.nativeElement.setAttribute('role', 'table');
|
1300 | }
|
1301 | this._document = _document;
|
1302 | this._isNativeHtmlTable = this._elementRef.nativeElement.nodeName === 'TABLE';
|
1303 | }
|
1304 | ngOnInit() {
|
1305 | this._setupStickyStyler();
|
1306 | if (this._isNativeHtmlTable) {
|
1307 | this._applyNativeTableSections();
|
1308 | }
|
1309 |
|
1310 |
|
1311 |
|
1312 | this._dataDiffer = this._differs.find([]).create((_i, dataRow) => {
|
1313 | return this.trackBy ? this.trackBy(dataRow.dataIndex, dataRow.data) : dataRow;
|
1314 | });
|
1315 | this._viewportRuler
|
1316 | .change()
|
1317 | .pipe(takeUntil(this._onDestroy))
|
1318 | .subscribe(() => {
|
1319 | this._forceRecalculateCellWidths = true;
|
1320 | });
|
1321 | }
|
1322 | ngAfterContentChecked() {
|
1323 |
|
1324 | this._cacheRowDefs();
|
1325 | this._cacheColumnDefs();
|
1326 |
|
1327 | if (!this._headerRowDefs.length &&
|
1328 | !this._footerRowDefs.length &&
|
1329 | !this._rowDefs.length &&
|
1330 | (typeof ngDevMode === 'undefined' || ngDevMode)) {
|
1331 | throw getTableMissingRowDefsError();
|
1332 | }
|
1333 |
|
1334 | const columnsChanged = this._renderUpdatedColumns();
|
1335 | const rowDefsChanged = columnsChanged || this._headerRowDefChanged || this._footerRowDefChanged;
|
1336 |
|
1337 | this._stickyColumnStylesNeedReset = this._stickyColumnStylesNeedReset || rowDefsChanged;
|
1338 | this._forceRecalculateCellWidths = rowDefsChanged;
|
1339 |
|
1340 | if (this._headerRowDefChanged) {
|
1341 | this._forceRenderHeaderRows();
|
1342 | this._headerRowDefChanged = false;
|
1343 | }
|
1344 |
|
1345 | if (this._footerRowDefChanged) {
|
1346 | this._forceRenderFooterRows();
|
1347 | this._footerRowDefChanged = false;
|
1348 | }
|
1349 |
|
1350 |
|
1351 | if (this.dataSource && this._rowDefs.length > 0 && !this._renderChangeSubscription) {
|
1352 | this._observeRenderChanges();
|
1353 | }
|
1354 | else if (this._stickyColumnStylesNeedReset) {
|
1355 |
|
1356 |
|
1357 | this.updateStickyColumnStyles();
|
1358 | }
|
1359 | this._checkStickyStates();
|
1360 | }
|
1361 | ngOnDestroy() {
|
1362 | [
|
1363 | this._rowOutlet.viewContainer,
|
1364 | this._headerRowOutlet.viewContainer,
|
1365 | this._footerRowOutlet.viewContainer,
|
1366 | this._cachedRenderRowsMap,
|
1367 | this._customColumnDefs,
|
1368 | this._customRowDefs,
|
1369 | this._customHeaderRowDefs,
|
1370 | this._customFooterRowDefs,
|
1371 | this._columnDefsByName,
|
1372 | ].forEach(def => {
|
1373 | def.clear();
|
1374 | });
|
1375 | this._headerRowDefs = [];
|
1376 | this._footerRowDefs = [];
|
1377 | this._defaultRowDef = null;
|
1378 | this._onDestroy.next();
|
1379 | this._onDestroy.complete();
|
1380 | if (isDataSource(this.dataSource)) {
|
1381 | this.dataSource.disconnect(this);
|
1382 | }
|
1383 | }
|
1384 | |
1385 |
|
1386 |
|
1387 |
|
1388 |
|
1389 |
|
1390 |
|
1391 |
|
1392 |
|
1393 |
|
1394 | renderRows() {
|
1395 | this._renderRows = this._getAllRenderRows();
|
1396 | const changes = this._dataDiffer.diff(this._renderRows);
|
1397 | if (!changes) {
|
1398 | this._updateNoDataRow();
|
1399 | this.contentChanged.next();
|
1400 | return;
|
1401 | }
|
1402 | const viewContainer = this._rowOutlet.viewContainer;
|
1403 | this._viewRepeater.applyChanges(changes, viewContainer, (record, _adjustedPreviousIndex, currentIndex) => this._getEmbeddedViewArgs(record.item, currentIndex), record => record.item.data, (change) => {
|
1404 | if (change.operation === 1 && change.context) {
|
1405 | this._renderCellTemplateForItem(change.record.item.rowDef, change.context);
|
1406 | }
|
1407 | });
|
1408 |
|
1409 | this._updateRowIndexContext();
|
1410 |
|
1411 |
|
1412 | changes.forEachIdentityChange((record) => {
|
1413 | const rowView = viewContainer.get(record.currentIndex);
|
1414 | rowView.context.$implicit = record.item.data;
|
1415 | });
|
1416 | this._updateNoDataRow();
|
1417 |
|
1418 |
|
1419 | if (this._ngZone && NgZone.isInAngularZone()) {
|
1420 | this._ngZone.onStable.pipe(take(1), takeUntil(this._onDestroy)).subscribe(() => {
|
1421 | this.updateStickyColumnStyles();
|
1422 | });
|
1423 | }
|
1424 | else {
|
1425 | this.updateStickyColumnStyles();
|
1426 | }
|
1427 | this.contentChanged.next();
|
1428 | }
|
1429 |
|
1430 | addColumnDef(columnDef) {
|
1431 | this._customColumnDefs.add(columnDef);
|
1432 | }
|
1433 |
|
1434 | removeColumnDef(columnDef) {
|
1435 | this._customColumnDefs.delete(columnDef);
|
1436 | }
|
1437 |
|
1438 | addRowDef(rowDef) {
|
1439 | this._customRowDefs.add(rowDef);
|
1440 | }
|
1441 |
|
1442 | removeRowDef(rowDef) {
|
1443 | this._customRowDefs.delete(rowDef);
|
1444 | }
|
1445 |
|
1446 | addHeaderRowDef(headerRowDef) {
|
1447 | this._customHeaderRowDefs.add(headerRowDef);
|
1448 | this._headerRowDefChanged = true;
|
1449 | }
|
1450 |
|
1451 | removeHeaderRowDef(headerRowDef) {
|
1452 | this._customHeaderRowDefs.delete(headerRowDef);
|
1453 | this._headerRowDefChanged = true;
|
1454 | }
|
1455 |
|
1456 | addFooterRowDef(footerRowDef) {
|
1457 | this._customFooterRowDefs.add(footerRowDef);
|
1458 | this._footerRowDefChanged = true;
|
1459 | }
|
1460 |
|
1461 | removeFooterRowDef(footerRowDef) {
|
1462 | this._customFooterRowDefs.delete(footerRowDef);
|
1463 | this._footerRowDefChanged = true;
|
1464 | }
|
1465 |
|
1466 | setNoDataRow(noDataRow) {
|
1467 | this._customNoDataRow = noDataRow;
|
1468 | }
|
1469 | |
1470 |
|
1471 |
|
1472 |
|
1473 |
|
1474 |
|
1475 |
|
1476 | updateStickyHeaderRowStyles() {
|
1477 | const headerRows = this._getRenderedRows(this._headerRowOutlet);
|
1478 | const tableElement = this._elementRef.nativeElement;
|
1479 |
|
1480 |
|
1481 |
|
1482 | const thead = tableElement.querySelector('thead');
|
1483 | if (thead) {
|
1484 | thead.style.display = headerRows.length ? '' : 'none';
|
1485 | }
|
1486 | const stickyStates = this._headerRowDefs.map(def => def.sticky);
|
1487 | this._stickyStyler.clearStickyPositioning(headerRows, ['top']);
|
1488 | this._stickyStyler.stickRows(headerRows, stickyStates, 'top');
|
1489 |
|
1490 | this._headerRowDefs.forEach(def => def.resetStickyChanged());
|
1491 | }
|
1492 | |
1493 |
|
1494 |
|
1495 |
|
1496 |
|
1497 |
|
1498 |
|
1499 | updateStickyFooterRowStyles() {
|
1500 | const footerRows = this._getRenderedRows(this._footerRowOutlet);
|
1501 | const tableElement = this._elementRef.nativeElement;
|
1502 |
|
1503 |
|
1504 |
|
1505 | const tfoot = tableElement.querySelector('tfoot');
|
1506 | if (tfoot) {
|
1507 | tfoot.style.display = footerRows.length ? '' : 'none';
|
1508 | }
|
1509 | const stickyStates = this._footerRowDefs.map(def => def.sticky);
|
1510 | this._stickyStyler.clearStickyPositioning(footerRows, ['bottom']);
|
1511 | this._stickyStyler.stickRows(footerRows, stickyStates, 'bottom');
|
1512 | this._stickyStyler.updateStickyFooterContainer(this._elementRef.nativeElement, stickyStates);
|
1513 |
|
1514 | this._footerRowDefs.forEach(def => def.resetStickyChanged());
|
1515 | }
|
1516 | |
1517 |
|
1518 |
|
1519 |
|
1520 |
|
1521 |
|
1522 |
|
1523 | updateStickyColumnStyles() {
|
1524 | const headerRows = this._getRenderedRows(this._headerRowOutlet);
|
1525 | const dataRows = this._getRenderedRows(this._rowOutlet);
|
1526 | const footerRows = this._getRenderedRows(this._footerRowOutlet);
|
1527 |
|
1528 |
|
1529 |
|
1530 |
|
1531 | if ((this._isNativeHtmlTable && !this._fixedLayout) || this._stickyColumnStylesNeedReset) {
|
1532 |
|
1533 |
|
1534 | this._stickyStyler.clearStickyPositioning([...headerRows, ...dataRows, ...footerRows], ['left', 'right']);
|
1535 | this._stickyColumnStylesNeedReset = false;
|
1536 | }
|
1537 |
|
1538 | headerRows.forEach((headerRow, i) => {
|
1539 | this._addStickyColumnStyles([headerRow], this._headerRowDefs[i]);
|
1540 | });
|
1541 |
|
1542 | this._rowDefs.forEach(rowDef => {
|
1543 |
|
1544 | const rows = [];
|
1545 | for (let i = 0; i < dataRows.length; i++) {
|
1546 | if (this._renderRows[i].rowDef === rowDef) {
|
1547 | rows.push(dataRows[i]);
|
1548 | }
|
1549 | }
|
1550 | this._addStickyColumnStyles(rows, rowDef);
|
1551 | });
|
1552 |
|
1553 | footerRows.forEach((footerRow, i) => {
|
1554 | this._addStickyColumnStyles([footerRow], this._footerRowDefs[i]);
|
1555 | });
|
1556 |
|
1557 | Array.from(this._columnDefsByName.values()).forEach(def => def.resetStickyChanged());
|
1558 | }
|
1559 | |
1560 |
|
1561 |
|
1562 |
|
1563 |
|
1564 | _getAllRenderRows() {
|
1565 | const renderRows = [];
|
1566 |
|
1567 |
|
1568 | const prevCachedRenderRows = this._cachedRenderRowsMap;
|
1569 | this._cachedRenderRowsMap = new Map();
|
1570 |
|
1571 |
|
1572 | for (let i = 0; i < this._data.length; i++) {
|
1573 | let data = this._data[i];
|
1574 | const renderRowsForData = this._getRenderRowsForData(data, i, prevCachedRenderRows.get(data));
|
1575 | if (!this._cachedRenderRowsMap.has(data)) {
|
1576 | this._cachedRenderRowsMap.set(data, new WeakMap());
|
1577 | }
|
1578 | for (let j = 0; j < renderRowsForData.length; j++) {
|
1579 | let renderRow = renderRowsForData[j];
|
1580 | const cache = this._cachedRenderRowsMap.get(renderRow.data);
|
1581 | if (cache.has(renderRow.rowDef)) {
|
1582 | cache.get(renderRow.rowDef).push(renderRow);
|
1583 | }
|
1584 | else {
|
1585 | cache.set(renderRow.rowDef, [renderRow]);
|
1586 | }
|
1587 | renderRows.push(renderRow);
|
1588 | }
|
1589 | }
|
1590 | return renderRows;
|
1591 | }
|
1592 | |
1593 |
|
1594 |
|
1595 |
|
1596 |
|
1597 | _getRenderRowsForData(data, dataIndex, cache) {
|
1598 | const rowDefs = this._getRowDefs(data, dataIndex);
|
1599 | return rowDefs.map(rowDef => {
|
1600 | const cachedRenderRows = cache && cache.has(rowDef) ? cache.get(rowDef) : [];
|
1601 | if (cachedRenderRows.length) {
|
1602 | const dataRow = cachedRenderRows.shift();
|
1603 | dataRow.dataIndex = dataIndex;
|
1604 | return dataRow;
|
1605 | }
|
1606 | else {
|
1607 | return { data, rowDef, dataIndex };
|
1608 | }
|
1609 | });
|
1610 | }
|
1611 |
|
1612 | _cacheColumnDefs() {
|
1613 | this._columnDefsByName.clear();
|
1614 | const columnDefs = mergeArrayAndSet(this._getOwnDefs(this._contentColumnDefs), this._customColumnDefs);
|
1615 | columnDefs.forEach(columnDef => {
|
1616 | if (this._columnDefsByName.has(columnDef.name) &&
|
1617 | (typeof ngDevMode === 'undefined' || ngDevMode)) {
|
1618 | throw getTableDuplicateColumnNameError(columnDef.name);
|
1619 | }
|
1620 | this._columnDefsByName.set(columnDef.name, columnDef);
|
1621 | });
|
1622 | }
|
1623 |
|
1624 | _cacheRowDefs() {
|
1625 | this._headerRowDefs = mergeArrayAndSet(this._getOwnDefs(this._contentHeaderRowDefs), this._customHeaderRowDefs);
|
1626 | this._footerRowDefs = mergeArrayAndSet(this._getOwnDefs(this._contentFooterRowDefs), this._customFooterRowDefs);
|
1627 | this._rowDefs = mergeArrayAndSet(this._getOwnDefs(this._contentRowDefs), this._customRowDefs);
|
1628 |
|
1629 | const defaultRowDefs = this._rowDefs.filter(def => !def.when);
|
1630 | if (!this.multiTemplateDataRows &&
|
1631 | defaultRowDefs.length > 1 &&
|
1632 | (typeof ngDevMode === 'undefined' || ngDevMode)) {
|
1633 | throw getTableMultipleDefaultRowDefsError();
|
1634 | }
|
1635 | this._defaultRowDef = defaultRowDefs[0];
|
1636 | }
|
1637 | |
1638 |
|
1639 |
|
1640 |
|
1641 |
|
1642 | _renderUpdatedColumns() {
|
1643 | const columnsDiffReducer = (acc, def) => acc || !!def.getColumnsDiff();
|
1644 |
|
1645 | const dataColumnsChanged = this._rowDefs.reduce(columnsDiffReducer, false);
|
1646 | if (dataColumnsChanged) {
|
1647 | this._forceRenderDataRows();
|
1648 | }
|
1649 |
|
1650 | const headerColumnsChanged = this._headerRowDefs.reduce(columnsDiffReducer, false);
|
1651 | if (headerColumnsChanged) {
|
1652 | this._forceRenderHeaderRows();
|
1653 | }
|
1654 | const footerColumnsChanged = this._footerRowDefs.reduce(columnsDiffReducer, false);
|
1655 | if (footerColumnsChanged) {
|
1656 | this._forceRenderFooterRows();
|
1657 | }
|
1658 | return dataColumnsChanged || headerColumnsChanged || footerColumnsChanged;
|
1659 | }
|
1660 | |
1661 |
|
1662 |
|
1663 |
|
1664 |
|
1665 | _switchDataSource(dataSource) {
|
1666 | this._data = [];
|
1667 | if (isDataSource(this.dataSource)) {
|
1668 | this.dataSource.disconnect(this);
|
1669 | }
|
1670 |
|
1671 | if (this._renderChangeSubscription) {
|
1672 | this._renderChangeSubscription.unsubscribe();
|
1673 | this._renderChangeSubscription = null;
|
1674 | }
|
1675 | if (!dataSource) {
|
1676 | if (this._dataDiffer) {
|
1677 | this._dataDiffer.diff([]);
|
1678 | }
|
1679 | this._rowOutlet.viewContainer.clear();
|
1680 | }
|
1681 | this._dataSource = dataSource;
|
1682 | }
|
1683 |
|
1684 | _observeRenderChanges() {
|
1685 |
|
1686 | if (!this.dataSource) {
|
1687 | return;
|
1688 | }
|
1689 | let dataStream;
|
1690 | if (isDataSource(this.dataSource)) {
|
1691 | dataStream = this.dataSource.connect(this);
|
1692 | }
|
1693 | else if (isObservable(this.dataSource)) {
|
1694 | dataStream = this.dataSource;
|
1695 | }
|
1696 | else if (Array.isArray(this.dataSource)) {
|
1697 | dataStream = of(this.dataSource);
|
1698 | }
|
1699 | if (dataStream === undefined && (typeof ngDevMode === 'undefined' || ngDevMode)) {
|
1700 | throw getTableUnknownDataSourceError();
|
1701 | }
|
1702 | this._renderChangeSubscription = dataStream
|
1703 | .pipe(takeUntil(this._onDestroy))
|
1704 | .subscribe(data => {
|
1705 | this._data = data || [];
|
1706 | this.renderRows();
|
1707 | });
|
1708 | }
|
1709 | |
1710 |
|
1711 |
|
1712 |
|
1713 | _forceRenderHeaderRows() {
|
1714 |
|
1715 | if (this._headerRowOutlet.viewContainer.length > 0) {
|
1716 | this._headerRowOutlet.viewContainer.clear();
|
1717 | }
|
1718 | this._headerRowDefs.forEach((def, i) => this._renderRow(this._headerRowOutlet, def, i));
|
1719 | this.updateStickyHeaderRowStyles();
|
1720 | }
|
1721 | |
1722 |
|
1723 |
|
1724 |
|
1725 | _forceRenderFooterRows() {
|
1726 |
|
1727 | if (this._footerRowOutlet.viewContainer.length > 0) {
|
1728 | this._footerRowOutlet.viewContainer.clear();
|
1729 | }
|
1730 | this._footerRowDefs.forEach((def, i) => this._renderRow(this._footerRowOutlet, def, i));
|
1731 | this.updateStickyFooterRowStyles();
|
1732 | }
|
1733 |
|
1734 | _addStickyColumnStyles(rows, rowDef) {
|
1735 | const columnDefs = Array.from(rowDef.columns || []).map(columnName => {
|
1736 | const columnDef = this._columnDefsByName.get(columnName);
|
1737 | if (!columnDef && (typeof ngDevMode === 'undefined' || ngDevMode)) {
|
1738 | throw getTableUnknownColumnError(columnName);
|
1739 | }
|
1740 | return columnDef;
|
1741 | });
|
1742 | const stickyStartStates = columnDefs.map(columnDef => columnDef.sticky);
|
1743 | const stickyEndStates = columnDefs.map(columnDef => columnDef.stickyEnd);
|
1744 | this._stickyStyler.updateStickyColumns(rows, stickyStartStates, stickyEndStates, !this._fixedLayout || this._forceRecalculateCellWidths);
|
1745 | }
|
1746 |
|
1747 | _getRenderedRows(rowOutlet) {
|
1748 | const renderedRows = [];
|
1749 | for (let i = 0; i < rowOutlet.viewContainer.length; i++) {
|
1750 | const viewRef = rowOutlet.viewContainer.get(i);
|
1751 | renderedRows.push(viewRef.rootNodes[0]);
|
1752 | }
|
1753 | return renderedRows;
|
1754 | }
|
1755 | |
1756 |
|
1757 |
|
1758 |
|
1759 |
|
1760 |
|
1761 | _getRowDefs(data, dataIndex) {
|
1762 | if (this._rowDefs.length == 1) {
|
1763 | return [this._rowDefs[0]];
|
1764 | }
|
1765 | let rowDefs = [];
|
1766 | if (this.multiTemplateDataRows) {
|
1767 | rowDefs = this._rowDefs.filter(def => !def.when || def.when(dataIndex, data));
|
1768 | }
|
1769 | else {
|
1770 | let rowDef = this._rowDefs.find(def => def.when && def.when(dataIndex, data)) || this._defaultRowDef;
|
1771 | if (rowDef) {
|
1772 | rowDefs.push(rowDef);
|
1773 | }
|
1774 | }
|
1775 | if (!rowDefs.length && (typeof ngDevMode === 'undefined' || ngDevMode)) {
|
1776 | throw getTableMissingMatchingRowDefError(data);
|
1777 | }
|
1778 | return rowDefs;
|
1779 | }
|
1780 | _getEmbeddedViewArgs(renderRow, index) {
|
1781 | const rowDef = renderRow.rowDef;
|
1782 | const context = { $implicit: renderRow.data };
|
1783 | return {
|
1784 | templateRef: rowDef.template,
|
1785 | context,
|
1786 | index,
|
1787 | };
|
1788 | }
|
1789 | |
1790 |
|
1791 |
|
1792 |
|
1793 |
|
1794 | _renderRow(outlet, rowDef, index, context = {}) {
|
1795 |
|
1796 | const view = outlet.viewContainer.createEmbeddedView(rowDef.template, context, index);
|
1797 | this._renderCellTemplateForItem(rowDef, context);
|
1798 | return view;
|
1799 | }
|
1800 | _renderCellTemplateForItem(rowDef, context) {
|
1801 | for (let cellTemplate of this._getCellTemplates(rowDef)) {
|
1802 | if (CdkCellOutlet.mostRecentCellOutlet) {
|
1803 | CdkCellOutlet.mostRecentCellOutlet._viewContainer.createEmbeddedView(cellTemplate, context);
|
1804 | }
|
1805 | }
|
1806 | this._changeDetectorRef.markForCheck();
|
1807 | }
|
1808 | |
1809 |
|
1810 |
|
1811 |
|
1812 | _updateRowIndexContext() {
|
1813 | const viewContainer = this._rowOutlet.viewContainer;
|
1814 | for (let renderIndex = 0, count = viewContainer.length; renderIndex < count; renderIndex++) {
|
1815 | const viewRef = viewContainer.get(renderIndex);
|
1816 | const context = viewRef.context;
|
1817 | context.count = count;
|
1818 | context.first = renderIndex === 0;
|
1819 | context.last = renderIndex === count - 1;
|
1820 | context.even = renderIndex % 2 === 0;
|
1821 | context.odd = !context.even;
|
1822 | if (this.multiTemplateDataRows) {
|
1823 | context.dataIndex = this._renderRows[renderIndex].dataIndex;
|
1824 | context.renderIndex = renderIndex;
|
1825 | }
|
1826 | else {
|
1827 | context.index = this._renderRows[renderIndex].dataIndex;
|
1828 | }
|
1829 | }
|
1830 | }
|
1831 |
|
1832 | _getCellTemplates(rowDef) {
|
1833 | if (!rowDef || !rowDef.columns) {
|
1834 | return [];
|
1835 | }
|
1836 | return Array.from(rowDef.columns, columnId => {
|
1837 | const column = this._columnDefsByName.get(columnId);
|
1838 | if (!column && (typeof ngDevMode === 'undefined' || ngDevMode)) {
|
1839 | throw getTableUnknownColumnError(columnId);
|
1840 | }
|
1841 | return rowDef.extractCellTemplate(column);
|
1842 | });
|
1843 | }
|
1844 |
|
1845 | _applyNativeTableSections() {
|
1846 | const documentFragment = this._document.createDocumentFragment();
|
1847 | const sections = [
|
1848 | { tag: 'thead', outlets: [this._headerRowOutlet] },
|
1849 | { tag: 'tbody', outlets: [this._rowOutlet, this._noDataRowOutlet] },
|
1850 | { tag: 'tfoot', outlets: [this._footerRowOutlet] },
|
1851 | ];
|
1852 | for (const section of sections) {
|
1853 | const element = this._document.createElement(section.tag);
|
1854 | element.setAttribute('role', 'rowgroup');
|
1855 | for (const outlet of section.outlets) {
|
1856 | element.appendChild(outlet.elementRef.nativeElement);
|
1857 | }
|
1858 | documentFragment.appendChild(element);
|
1859 | }
|
1860 |
|
1861 | this._elementRef.nativeElement.appendChild(documentFragment);
|
1862 | }
|
1863 | |
1864 |
|
1865 |
|
1866 |
|
1867 |
|
1868 | _forceRenderDataRows() {
|
1869 | this._dataDiffer.diff([]);
|
1870 | this._rowOutlet.viewContainer.clear();
|
1871 | this.renderRows();
|
1872 | }
|
1873 | |
1874 |
|
1875 |
|
1876 |
|
1877 |
|
1878 | _checkStickyStates() {
|
1879 | const stickyCheckReducer = (acc, d) => {
|
1880 | return acc || d.hasStickyChanged();
|
1881 | };
|
1882 |
|
1883 |
|
1884 |
|
1885 | if (this._headerRowDefs.reduce(stickyCheckReducer, false)) {
|
1886 | this.updateStickyHeaderRowStyles();
|
1887 | }
|
1888 | if (this._footerRowDefs.reduce(stickyCheckReducer, false)) {
|
1889 | this.updateStickyFooterRowStyles();
|
1890 | }
|
1891 | if (Array.from(this._columnDefsByName.values()).reduce(stickyCheckReducer, false)) {
|
1892 | this._stickyColumnStylesNeedReset = true;
|
1893 | this.updateStickyColumnStyles();
|
1894 | }
|
1895 | }
|
1896 | |
1897 |
|
1898 |
|
1899 |
|
1900 |
|
1901 | _setupStickyStyler() {
|
1902 | const direction = this._dir ? this._dir.value : 'ltr';
|
1903 | this._stickyStyler = new StickyStyler(this._isNativeHtmlTable, this.stickyCssClass, direction, this._coalescedStyleScheduler, this._platform.isBrowser, this.needsPositionStickyOnElement, this._stickyPositioningListener);
|
1904 | (this._dir ? this._dir.change : of())
|
1905 | .pipe(takeUntil(this._onDestroy))
|
1906 | .subscribe(value => {
|
1907 | this._stickyStyler.direction = value;
|
1908 | this.updateStickyColumnStyles();
|
1909 | });
|
1910 | }
|
1911 |
|
1912 | _getOwnDefs(items) {
|
1913 | return items.filter(item => !item._table || item._table === this);
|
1914 | }
|
1915 |
|
1916 | _updateNoDataRow() {
|
1917 | const noDataRow = this._customNoDataRow || this._noDataRow;
|
1918 | if (!noDataRow) {
|
1919 | return;
|
1920 | }
|
1921 | const shouldShow = this._rowOutlet.viewContainer.length === 0;
|
1922 | if (shouldShow === this._isShowingNoDataRow) {
|
1923 | return;
|
1924 | }
|
1925 | const container = this._noDataRowOutlet.viewContainer;
|
1926 | if (shouldShow) {
|
1927 | const view = container.createEmbeddedView(noDataRow.templateRef);
|
1928 | const rootNode = view.rootNodes[0];
|
1929 |
|
1930 |
|
1931 | if (view.rootNodes.length === 1 && rootNode?.nodeType === this._document.ELEMENT_NODE) {
|
1932 | rootNode.setAttribute('role', 'row');
|
1933 | rootNode.classList.add(noDataRow._contentClassName);
|
1934 | }
|
1935 | }
|
1936 | else {
|
1937 | container.clear();
|
1938 | }
|
1939 | this._isShowingNoDataRow = shouldShow;
|
1940 | }
|
1941 | static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: CdkTable, deps: [{ token: i0.IterableDiffers }, { token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: 'role', attribute: true }, { token: i1.Directionality, optional: true }, { token: DOCUMENT }, { token: i2.Platform }, { token: _VIEW_REPEATER_STRATEGY }, { token: _COALESCED_STYLE_SCHEDULER }, { token: i3.ViewportRuler }, { token: STICKY_POSITIONING_LISTENER, optional: true, skipSelf: true }, { token: i0.NgZone, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
|
1942 | static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.0", type: CdkTable, selector: "cdk-table, table[cdk-table]", inputs: { trackBy: "trackBy", dataSource: "dataSource", multiTemplateDataRows: "multiTemplateDataRows", fixedLayout: "fixedLayout" }, outputs: { contentChanged: "contentChanged" }, host: { attributes: { "ngSkipHydration": "" }, properties: { "class.cdk-table-fixed-layout": "fixedLayout" }, classAttribute: "cdk-table" }, providers: [
|
1943 | { provide: CDK_TABLE, useExisting: CdkTable },
|
1944 | { provide: _VIEW_REPEATER_STRATEGY, useClass: _DisposeViewRepeaterStrategy },
|
1945 | { provide: _COALESCED_STYLE_SCHEDULER, useClass: _CoalescedStyleScheduler },
|
1946 |
|
1947 | { provide: STICKY_POSITIONING_LISTENER, useValue: null },
|
1948 | ], queries: [{ propertyName: "_noDataRow", first: true, predicate: CdkNoDataRow, descendants: true }, { propertyName: "_contentColumnDefs", predicate: CdkColumnDef, descendants: true }, { propertyName: "_contentRowDefs", predicate: CdkRowDef, descendants: true }, { propertyName: "_contentHeaderRowDefs", predicate: CdkHeaderRowDef, descendants: true }, { propertyName: "_contentFooterRowDefs", predicate: CdkFooterRowDef, descendants: true }], viewQueries: [{ propertyName: "_rowOutlet", first: true, predicate: DataRowOutlet, descendants: true, static: true }, { propertyName: "_headerRowOutlet", first: true, predicate: HeaderRowOutlet, descendants: true, static: true }, { propertyName: "_footerRowOutlet", first: true, predicate: FooterRowOutlet, descendants: true, static: true }, { propertyName: "_noDataRowOutlet", first: true, predicate: NoDataRowOutlet, descendants: true, static: true }], exportAs: ["cdkTable"], ngImport: i0, template: "\n <ng-content select=\"caption\"></ng-content>\n <ng-content select=\"colgroup, col\"></ng-content>\n <ng-container headerRowOutlet></ng-container>\n <ng-container rowOutlet></ng-container>\n <ng-container noDataRowOutlet></ng-container>\n <ng-container footerRowOutlet></ng-container>\n", isInline: true, styles: [".cdk-table-fixed-layout{table-layout:fixed}"], dependencies: [{ kind: "directive", type: DataRowOutlet, selector: "[rowOutlet]" }, { kind: "directive", type: HeaderRowOutlet, selector: "[headerRowOutlet]" }, { kind: "directive", type: FooterRowOutlet, selector: "[footerRowOutlet]" }, { kind: "directive", type: NoDataRowOutlet, selector: "[noDataRowOutlet]" }], changeDetection: i0.ChangeDetectionStrategy.Default, encapsulation: i0.ViewEncapsulation.None }); }
|
1949 | }
|
1950 | i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: CdkTable, decorators: [{
|
1951 | type: Component,
|
1952 | args: [{ selector: 'cdk-table, table[cdk-table]', exportAs: 'cdkTable', template: CDK_TABLE_TEMPLATE, host: {
|
1953 | 'class': 'cdk-table',
|
1954 | '[class.cdk-table-fixed-layout]': 'fixedLayout',
|
1955 | 'ngSkipHydration': '',
|
1956 | }, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.Default, providers: [
|
1957 | { provide: CDK_TABLE, useExisting: CdkTable },
|
1958 | { provide: _VIEW_REPEATER_STRATEGY, useClass: _DisposeViewRepeaterStrategy },
|
1959 | { provide: _COALESCED_STYLE_SCHEDULER, useClass: _CoalescedStyleScheduler },
|
1960 |
|
1961 | { provide: STICKY_POSITIONING_LISTENER, useValue: null },
|
1962 | ], styles: [".cdk-table-fixed-layout{table-layout:fixed}"] }]
|
1963 | }], ctorParameters: function () { return [{ type: i0.IterableDiffers }, { type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: undefined, decorators: [{
|
1964 | type: Attribute,
|
1965 | args: ['role']
|
1966 | }] }, { type: i1.Directionality, decorators: [{
|
1967 | type: Optional
|
1968 | }] }, { type: undefined, decorators: [{
|
1969 | type: Inject,
|
1970 | args: [DOCUMENT]
|
1971 | }] }, { type: i2.Platform }, { type: undefined, decorators: [{
|
1972 | type: Inject,
|
1973 | args: [_VIEW_REPEATER_STRATEGY]
|
1974 | }] }, { type: _CoalescedStyleScheduler, decorators: [{
|
1975 | type: Inject,
|
1976 | args: [_COALESCED_STYLE_SCHEDULER]
|
1977 | }] }, { type: i3.ViewportRuler }, { type: undefined, decorators: [{
|
1978 | type: Optional
|
1979 | }, {
|
1980 | type: SkipSelf
|
1981 | }, {
|
1982 | type: Inject,
|
1983 | args: [STICKY_POSITIONING_LISTENER]
|
1984 | }] }, { type: i0.NgZone, decorators: [{
|
1985 | type: Optional
|
1986 | }] }]; }, propDecorators: { trackBy: [{
|
1987 | type: Input
|
1988 | }], dataSource: [{
|
1989 | type: Input
|
1990 | }], multiTemplateDataRows: [{
|
1991 | type: Input
|
1992 | }], fixedLayout: [{
|
1993 | type: Input
|
1994 | }], contentChanged: [{
|
1995 | type: Output
|
1996 | }], _rowOutlet: [{
|
1997 | type: ViewChild,
|
1998 | args: [DataRowOutlet, { static: true }]
|
1999 | }], _headerRowOutlet: [{
|
2000 | type: ViewChild,
|
2001 | args: [HeaderRowOutlet, { static: true }]
|
2002 | }], _footerRowOutlet: [{
|
2003 | type: ViewChild,
|
2004 | args: [FooterRowOutlet, { static: true }]
|
2005 | }], _noDataRowOutlet: [{
|
2006 | type: ViewChild,
|
2007 | args: [NoDataRowOutlet, { static: true }]
|
2008 | }], _contentColumnDefs: [{
|
2009 | type: ContentChildren,
|
2010 | args: [CdkColumnDef, { descendants: true }]
|
2011 | }], _contentRowDefs: [{
|
2012 | type: ContentChildren,
|
2013 | args: [CdkRowDef, { descendants: true }]
|
2014 | }], _contentHeaderRowDefs: [{
|
2015 | type: ContentChildren,
|
2016 | args: [CdkHeaderRowDef, {
|
2017 | descendants: true,
|
2018 | }]
|
2019 | }], _contentFooterRowDefs: [{
|
2020 | type: ContentChildren,
|
2021 | args: [CdkFooterRowDef, {
|
2022 | descendants: true,
|
2023 | }]
|
2024 | }], _noDataRow: [{
|
2025 | type: ContentChild,
|
2026 | args: [CdkNoDataRow]
|
2027 | }] } });
|
2028 |
|
2029 | function mergeArrayAndSet(array, set) {
|
2030 | return array.concat(Array.from(set));
|
2031 | }
|
2032 |
|
2033 | /**
|
2034 | * Column that simply shows text content for the header and row cells. Assumes that the table
|
2035 | * is using the native table implementation (`<table>`).
|
2036 | *
|
2037 | * By default, the name of this column will be the header text and data property accessor.
|
2038 | * The header text can be overridden with the `headerText` input. Cell values can be overridden with
|
2039 | * the `dataAccessor` input. Change the text justification to the start or end using the `justify`
|
2040 | * input.
|
2041 | */
|
2042 | class CdkTextColumn {
|
2043 |
|
2044 | get name() {
|
2045 | return this._name;
|
2046 | }
|
2047 | set name(name) {
|
2048 | this._name = name;
|
2049 |
|
2050 |
|
2051 | this._syncColumnDefName();
|
2052 | }
|
2053 | constructor(
|
2054 | // `CdkTextColumn` is always requiring a table, but we just assert it manually
|
2055 | // for better error reporting.
|
2056 | // tslint:disable-next-line: lightweight-tokens
|
2057 | _table, _options) {
|
2058 | this._table = _table;
|
2059 | this._options = _options;
|
2060 |
|
2061 | this.justify = 'start';
|
2062 | this._options = _options || {};
|
2063 | }
|
2064 | ngOnInit() {
|
2065 | this._syncColumnDefName();
|
2066 | if (this.headerText === undefined) {
|
2067 | this.headerText = this._createDefaultHeaderText();
|
2068 | }
|
2069 | if (!this.dataAccessor) {
|
2070 | this.dataAccessor =
|
2071 | this._options.defaultDataAccessor || ((data, name) => data[name]);
|
2072 | }
|
2073 | if (this._table) {
|
2074 |
|
2075 |
|
2076 |
|
2077 | this.columnDef.cell = this.cell;
|
2078 | this.columnDef.headerCell = this.headerCell;
|
2079 | this._table.addColumnDef(this.columnDef);
|
2080 | }
|
2081 | else if (typeof ngDevMode === 'undefined' || ngDevMode) {
|
2082 | throw getTableTextColumnMissingParentTableError();
|
2083 | }
|
2084 | }
|
2085 | ngOnDestroy() {
|
2086 | if (this._table) {
|
2087 | this._table.removeColumnDef(this.columnDef);
|
2088 | }
|
2089 | }
|
2090 | |
2091 |
|
2092 |
|
2093 |
|
2094 | _createDefaultHeaderText() {
|
2095 | const name = this.name;
|
2096 | if (!name && (typeof ngDevMode === 'undefined' || ngDevMode)) {
|
2097 | throw getTableTextColumnMissingNameError();
|
2098 | }
|
2099 | if (this._options && this._options.defaultHeaderTextTransform) {
|
2100 | return this._options.defaultHeaderTextTransform(name);
|
2101 | }
|
2102 | return name[0].toUpperCase() + name.slice(1);
|
2103 | }
|
2104 |
|
2105 | _syncColumnDefName() {
|
2106 | if (this.columnDef) {
|
2107 | this.columnDef.name = this.name;
|
2108 | }
|
2109 | }
|
2110 | static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: CdkTextColumn, deps: [{ token: CdkTable, optional: true }, { token: TEXT_COLUMN_OPTIONS, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
|
2111 | static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.0", type: CdkTextColumn, selector: "cdk-text-column", inputs: { name: "name", headerText: "headerText", dataAccessor: "dataAccessor", justify: "justify" }, viewQueries: [{ propertyName: "columnDef", first: true, predicate: CdkColumnDef, descendants: true, static: true }, { propertyName: "cell", first: true, predicate: CdkCellDef, descendants: true, static: true }, { propertyName: "headerCell", first: true, predicate: CdkHeaderCellDef, descendants: true, static: true }], ngImport: i0, template: `
|
2112 | <ng-container cdkColumnDef>
|
2113 | <th cdk-header-cell *cdkHeaderCellDef [style.text-align]="justify">
|
2114 | {{headerText}}
|
2115 | </th>
|
2116 | <td cdk-cell *cdkCellDef="let data" [style.text-align]="justify">
|
2117 | {{dataAccessor(data, name)}}
|
2118 | </td>
|
2119 | </ng-container>
|
2120 | `, isInline: true, dependencies: [{ kind: "directive", type: CdkCellDef, selector: "[cdkCellDef]" }, { kind: "directive", type: CdkHeaderCellDef, selector: "[cdkHeaderCellDef]" }, { kind: "directive", type: CdkColumnDef, selector: "[cdkColumnDef]", inputs: ["sticky", "cdkColumnDef", "stickyEnd"] }, { kind: "directive", type: CdkCell, selector: "cdk-cell, td[cdk-cell]" }, { kind: "directive", type: CdkHeaderCell, selector: "cdk-header-cell, th[cdk-header-cell]" }], changeDetection: i0.ChangeDetectionStrategy.Default, encapsulation: i0.ViewEncapsulation.None }); }
|
2121 | }
|
2122 | i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: CdkTextColumn, decorators: [{
|
2123 | type: Component,
|
2124 | args: [{
|
2125 | selector: 'cdk-text-column',
|
2126 | template: `
|
2127 | <ng-container cdkColumnDef>
|
2128 | <th cdk-header-cell *cdkHeaderCellDef [style.text-align]="justify">
|
2129 | {{headerText}}
|
2130 | </th>
|
2131 | <td cdk-cell *cdkCellDef="let data" [style.text-align]="justify">
|
2132 | {{dataAccessor(data, name)}}
|
2133 | </td>
|
2134 | </ng-container>
|
2135 | `,
|
2136 | encapsulation: ViewEncapsulation.None,
|
2137 |
|
2138 |
|
2139 |
|
2140 |
|
2141 |
|
2142 |
|
2143 | changeDetection: ChangeDetectionStrategy.Default,
|
2144 | }]
|
2145 | }], ctorParameters: function () { return [{ type: CdkTable, decorators: [{
|
2146 | type: Optional
|
2147 | }] }, { type: undefined, decorators: [{
|
2148 | type: Optional
|
2149 | }, {
|
2150 | type: Inject,
|
2151 | args: [TEXT_COLUMN_OPTIONS]
|
2152 | }] }]; }, propDecorators: { name: [{
|
2153 | type: Input
|
2154 | }], headerText: [{
|
2155 | type: Input
|
2156 | }], dataAccessor: [{
|
2157 | type: Input
|
2158 | }], justify: [{
|
2159 | type: Input
|
2160 | }], columnDef: [{
|
2161 | type: ViewChild,
|
2162 | args: [CdkColumnDef, { static: true }]
|
2163 | }], cell: [{
|
2164 | type: ViewChild,
|
2165 | args: [CdkCellDef, { static: true }]
|
2166 | }], headerCell: [{
|
2167 | type: ViewChild,
|
2168 | args: [CdkHeaderCellDef, { static: true }]
|
2169 | }] } });
|
2170 |
|
2171 | const EXPORTED_DECLARATIONS = [
|
2172 | CdkTable,
|
2173 | CdkRowDef,
|
2174 | CdkCellDef,
|
2175 | CdkCellOutlet,
|
2176 | CdkHeaderCellDef,
|
2177 | CdkFooterCellDef,
|
2178 | CdkColumnDef,
|
2179 | CdkCell,
|
2180 | CdkRow,
|
2181 | CdkHeaderCell,
|
2182 | CdkFooterCell,
|
2183 | CdkHeaderRow,
|
2184 | CdkHeaderRowDef,
|
2185 | CdkFooterRow,
|
2186 | CdkFooterRowDef,
|
2187 | DataRowOutlet,
|
2188 | HeaderRowOutlet,
|
2189 | FooterRowOutlet,
|
2190 | CdkTextColumn,
|
2191 | CdkNoDataRow,
|
2192 | CdkRecycleRows,
|
2193 | NoDataRowOutlet,
|
2194 | ];
|
2195 | class CdkTableModule {
|
2196 | static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: CdkTableModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
2197 | static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.0.0", ngImport: i0, type: CdkTableModule, declarations: [CdkTable,
|
2198 | CdkRowDef,
|
2199 | CdkCellDef,
|
2200 | CdkCellOutlet,
|
2201 | CdkHeaderCellDef,
|
2202 | CdkFooterCellDef,
|
2203 | CdkColumnDef,
|
2204 | CdkCell,
|
2205 | CdkRow,
|
2206 | CdkHeaderCell,
|
2207 | CdkFooterCell,
|
2208 | CdkHeaderRow,
|
2209 | CdkHeaderRowDef,
|
2210 | CdkFooterRow,
|
2211 | CdkFooterRowDef,
|
2212 | DataRowOutlet,
|
2213 | HeaderRowOutlet,
|
2214 | FooterRowOutlet,
|
2215 | CdkTextColumn,
|
2216 | CdkNoDataRow,
|
2217 | CdkRecycleRows,
|
2218 | NoDataRowOutlet], imports: [ScrollingModule], exports: [CdkTable,
|
2219 | CdkRowDef,
|
2220 | CdkCellDef,
|
2221 | CdkCellOutlet,
|
2222 | CdkHeaderCellDef,
|
2223 | CdkFooterCellDef,
|
2224 | CdkColumnDef,
|
2225 | CdkCell,
|
2226 | CdkRow,
|
2227 | CdkHeaderCell,
|
2228 | CdkFooterCell,
|
2229 | CdkHeaderRow,
|
2230 | CdkHeaderRowDef,
|
2231 | CdkFooterRow,
|
2232 | CdkFooterRowDef,
|
2233 | DataRowOutlet,
|
2234 | HeaderRowOutlet,
|
2235 | FooterRowOutlet,
|
2236 | CdkTextColumn,
|
2237 | CdkNoDataRow,
|
2238 | CdkRecycleRows,
|
2239 | NoDataRowOutlet] }); }
|
2240 | static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: CdkTableModule, imports: [ScrollingModule] }); }
|
2241 | }
|
2242 | i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: CdkTableModule, decorators: [{
|
2243 | type: NgModule,
|
2244 | args: [{
|
2245 | exports: EXPORTED_DECLARATIONS,
|
2246 | declarations: EXPORTED_DECLARATIONS,
|
2247 | imports: [ScrollingModule],
|
2248 | }]
|
2249 | }] });
|
2250 |
|
2251 |
|
2252 |
|
2253 |
|
2254 |
|
2255 | export { BaseCdkCell, BaseRowDef, CDK_ROW_TEMPLATE, CDK_TABLE, CDK_TABLE_TEMPLATE, CdkCell, CdkCellDef, CdkCellOutlet, CdkColumnDef, CdkFooterCell, CdkFooterCellDef, CdkFooterRow, CdkFooterRowDef, CdkHeaderCell, CdkHeaderCellDef, CdkHeaderRow, CdkHeaderRowDef, CdkNoDataRow, CdkRecycleRows, CdkRow, CdkRowDef, CdkTable, CdkTableModule, CdkTextColumn, DataRowOutlet, FooterRowOutlet, HeaderRowOutlet, NoDataRowOutlet, STICKY_DIRECTIONS, STICKY_POSITIONING_LISTENER, StickyStyler, TEXT_COLUMN_OPTIONS, _COALESCED_STYLE_SCHEDULER, _CoalescedStyleScheduler, _Schedule, mixinHasStickyInput };
|
2256 |
|