Skip to content

Commit a03ddfe

Browse files
crisbetocrisbeto
committed
refactor(material/table): convert to standalone
Converts `material/table` to standalone.
1 parent 48cb0f5 commit a03ddfe

File tree

8 files changed

+77
-26
lines changed

8 files changed

+77
-26
lines changed

‎src/material/table/cell.ts

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -24,6 +24,7 @@ import {
2424
@Directive({
2525
selector: '[matCellDef]',
2626
providers: [{provide: CdkCellDef, useExisting: MatCellDef}],
27+
standalone: true,
2728
})
2829
export class MatCellDef extends CdkCellDef {}
2930

@@ -34,6 +35,7 @@ export class MatCellDef extends CdkCellDef {}
3435
@Directive({
3536
selector: '[matHeaderCellDef]',
3637
providers: [{provide: CdkHeaderCellDef, useExisting: MatHeaderCellDef}],
38+
standalone: true,
3739
})
3840
export class MatHeaderCellDef extends CdkHeaderCellDef {}
3941

@@ -44,6 +46,7 @@ export class MatHeaderCellDef extends CdkHeaderCellDef {}
4446
@Directive({
4547
selector: '[matFooterCellDef]',
4648
providers: [{provide: CdkFooterCellDef, useExisting: MatFooterCellDef}],
49+
standalone: true,
4750
})
4851
export class MatFooterCellDef extends CdkFooterCellDef {}
4952

@@ -58,6 +61,7 @@ export class MatFooterCellDef extends CdkFooterCellDef {}
5861
{provide: CdkColumnDef, useExisting: MatColumnDef},
5962
{provide: 'MAT_SORT_HEADER_COLUMN_DEF', useExisting: MatColumnDef},
6063
],
64+
standalone: true,
6165
})
6266
export class MatColumnDef extends CdkColumnDef {
6367
/** Unique name for this column. */
@@ -88,6 +92,7 @@ export class MatColumnDef extends CdkColumnDef {
8892
'class': 'mat-mdc-header-cell mdc-data-table__header-cell',
8993
'role': 'columnheader',
9094
},
95+
standalone: true,
9196
})
9297
export class MatHeaderCell extends CdkHeaderCell {}
9398

@@ -97,6 +102,7 @@ export class MatHeaderCell extends CdkHeaderCell {}
97102
host: {
98103
'class': 'mat-mdc-footer-cell mdc-data-table__cell',
99104
},
105+
standalone: true,
100106
})
101107
export class MatFooterCell extends CdkFooterCell {}
102108

@@ -106,5 +112,6 @@ export class MatFooterCell extends CdkFooterCell {}
106112
host: {
107113
'class': 'mat-mdc-cell mdc-data-table__cell',
108114
},
115+
standalone: true,
109116
})
110117
export class MatCell extends CdkCell {}

‎src/material/table/module.ts

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -59,8 +59,7 @@ const EXPORTED_DECLARATIONS = [
5959
];
6060

6161
@NgModule({
62-
imports: [MatCommonModule, CdkTableModule],
62+
imports: [MatCommonModule, CdkTableModule, ...EXPORTED_DECLARATIONS],
6363
exports: [MatCommonModule, EXPORTED_DECLARATIONS],
64-
declarations: EXPORTED_DECLARATIONS,
6564
})
6665
export class MatTableModule {}

‎src/material/table/row.ts

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -14,6 +14,7 @@ import {
1414
CdkRow,
1515
CdkRowDef,
1616
CdkNoDataRow,
17+
CdkCellOutlet,
1718
} from '@angular/cdk/table';
1819
import {ChangeDetectionStrategy, Component, Directive, ViewEncapsulation} from '@angular/core';
1920

@@ -28,6 +29,7 @@ const ROW_TEMPLATE = `<ng-container cdkCellOutlet></ng-container>`;
2829
selector: '[matHeaderRowDef]',
2930
providers: [{provide: CdkHeaderRowDef, useExisting: MatHeaderRowDef}],
3031
inputs: ['columns: matHeaderRowDef', 'sticky: matHeaderRowDefSticky'],
32+
standalone: true,
3133
})
3234
export class MatHeaderRowDef extends CdkHeaderRowDef {}
3335

@@ -39,6 +41,7 @@ export class MatHeaderRowDef extends CdkHeaderRowDef {}
3941
selector: '[matFooterRowDef]',
4042
providers: [{provide: CdkFooterRowDef, useExisting: MatFooterRowDef}],
4143
inputs: ['columns: matFooterRowDef', 'sticky: matFooterRowDefSticky'],
44+
standalone: true,
4245
})
4346
export class MatFooterRowDef extends CdkFooterRowDef {}
4447

@@ -51,6 +54,7 @@ export class MatFooterRowDef extends CdkFooterRowDef {}
5154
selector: '[matRowDef]',
5255
providers: [{provide: CdkRowDef, useExisting: MatRowDef}],
5356
inputs: ['columns: matRowDefColumns', 'when: matRowDefWhen'],
57+
standalone: true,
5458
})
5559
export class MatRowDef<T> extends CdkRowDef<T> {}
5660

@@ -68,6 +72,8 @@ export class MatRowDef<T> extends CdkRowDef<T> {}
6872
encapsulation: ViewEncapsulation.None,
6973
exportAs: 'matHeaderRow',
7074
providers: [{provide: CdkHeaderRow, useExisting: MatHeaderRow}],
75+
standalone: true,
76+
imports: [CdkCellOutlet],
7177
})
7278
export class MatHeaderRow extends CdkHeaderRow {}
7379

@@ -85,6 +91,8 @@ export class MatHeaderRow extends CdkHeaderRow {}
8591
encapsulation: ViewEncapsulation.None,
8692
exportAs: 'matFooterRow',
8793
providers: [{provide: CdkFooterRow, useExisting: MatFooterRow}],
94+
standalone: true,
95+
imports: [CdkCellOutlet],
8896
})
8997
export class MatFooterRow extends CdkFooterRow {}
9098

@@ -102,13 +110,16 @@ export class MatFooterRow extends CdkFooterRow {}
102110
encapsulation: ViewEncapsulation.None,
103111
exportAs: 'matRow',
104112
providers: [{provide: CdkRow, useExisting: MatRow}],
113+
standalone: true,
114+
imports: [CdkCellOutlet],
105115
})
106116
export class MatRow extends CdkRow {}
107117

108118
/** Row that can be used to display a message when no data is shown in the table. */
109119
@Directive({
110120
selector: 'ng-template[matNoDataRow]',
111121
providers: [{provide: CdkNoDataRow, useExisting: MatNoDataRow}],
122+
standalone: true,
112123
})
113124
export class MatNoDataRow extends CdkNoDataRow {
114125
override _contentClassName = 'mat-mdc-no-data-row';

‎src/material/table/table.spec.ts

Lines changed: 25 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -17,8 +17,11 @@ import {NoopAnimationsModule} from '@angular/platform-browser/animations';
1717
describe('MDC-based MatTable', () => {
1818
beforeEach(waitForAsync(() => {
1919
TestBed.configureTestingModule({
20-
imports: [MatTableModule, MatPaginatorModule, MatSortModule, NoopAnimationsModule],
21-
declarations: [
20+
imports: [
21+
MatTableModule,
22+
MatPaginatorModule,
23+
MatSortModule,
24+
NoopAnimationsModule,
2225
MatTableApp,
2326
MatTableWithWhenRowApp,
2427
ArrayDataSourceMatTableApp,
@@ -707,6 +710,8 @@ class FakeDataSource extends DataSource<TestData> {
707710
<tr mat-footer-row *matFooterRowDef="columnsToRender"></tr>
708711
</table>
709712
`,
713+
standalone: true,
714+
imports: [MatTableModule, MatPaginatorModule, MatSortModule],
710715
})
711716
class MatTableApp {
712717
dataSource: FakeDataSource | null = new FakeDataSource();
@@ -741,6 +746,8 @@ class MatTableApp {
741746
</tr>
742747
</table>
743748
`,
749+
standalone: true,
750+
imports: [MatTableModule, MatPaginatorModule, MatSortModule],
744751
})
745752
class NativeHtmlTableApp {
746753
dataSource: FakeDataSource | null = new FakeDataSource();
@@ -794,6 +801,8 @@ class NativeHtmlTableApp {
794801
<tr mat-row *matRowDef="let row; columns: columnsToRender"></tr>
795802
</table>
796803
`,
804+
standalone: true,
805+
imports: [MatTableModule, MatPaginatorModule, MatSortModule],
797806
})
798807
class NestedTableApp {
799808
dataSource: FakeDataSource | null = new FakeDataSource();
@@ -812,6 +821,8 @@ class NestedTableApp {
812821
<tr mat-row *matRowDef="let row; columns: columnsToRender"></tr>
813822
</table>
814823
`,
824+
standalone: true,
825+
imports: [MatTableModule, MatPaginatorModule, MatSortModule],
815826
})
816827
class StickyTableApp {
817828
dataSource = new FakeDataSource();
@@ -839,6 +850,8 @@ class StickyTableApp {
839850
<tr mat-footer-row *matFooterRowDef="['column_a']"></tr>
840851
</table>
841852
`,
853+
standalone: true,
854+
imports: [MatTableModule, MatPaginatorModule, MatSortModule],
842855
})
843856
class MatTableWithWhenRowApp {
844857
multiTemplateDataRows = false;
@@ -876,6 +889,8 @@ class MatTableWithWhenRowApp {
876889
877890
<mat-paginator [pageSize]="5"></mat-paginator>
878891
`,
892+
standalone: true,
893+
imports: [MatTableModule, MatPaginatorModule, MatSortModule],
879894
})
880895
class ArrayDataSourceMatTableApp implements AfterViewInit {
881896
underlyingDataSource = new FakeDataSource();
@@ -928,6 +943,8 @@ class ArrayDataSourceMatTableApp implements AfterViewInit {
928943
<tr mat-row *matRowDef="let row; columns: columnsToRender"></tr>
929944
</table>
930945
`,
946+
standalone: true,
947+
imports: [MatTableModule, MatPaginatorModule, MatSortModule],
931948
})
932949
class MatTableWithSortApp implements OnInit {
933950
underlyingDataSource = new FakeDataSource();
@@ -979,6 +996,8 @@ class MatTableWithSortApp implements OnInit {
979996
980997
<mat-paginator [pageSize]="5"></mat-paginator>
981998
`,
999+
standalone: true,
1000+
imports: [MatTableModule, MatPaginatorModule, MatSortModule],
9821001
})
9831002
class MatTableWithPaginatorApp implements OnInit {
9841003
underlyingDataSource = new FakeDataSource();
@@ -1020,6 +1039,8 @@ class MatTableWithPaginatorApp implements OnInit {
10201039
</ng-container>
10211040
</table>
10221041
`,
1042+
standalone: true,
1043+
imports: [MatTableModule, MatPaginatorModule, MatSortModule],
10231044
})
10241045
class TableWithNgContainerRow {
10251046
dataSource: FakeDataSource | null = new FakeDataSource();
@@ -1057,6 +1078,8 @@ class TableWithNgContainerRow {
10571078
<mat-footer-row *matFooterRowDef="columnsToRender"></mat-footer-row>
10581079
</mat-table>
10591080
`,
1081+
standalone: true,
1082+
imports: [MatTableModule, MatPaginatorModule, MatSortModule],
10601083
})
10611084
class MatFlexTableApp {
10621085
dataSource: FakeDataSource | null = new FakeDataSource();

‎src/material/table/table.ts

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -19,6 +19,10 @@ import {
1919
_COALESCED_STYLE_SCHEDULER,
2020
CDK_TABLE,
2121
STICKY_POSITIONING_LISTENER,
22+
HeaderRowOutlet,
23+
DataRowOutlet,
24+
NoDataRowOutlet,
25+
FooterRowOutlet,
2226
} from '@angular/cdk/table';
2327
import {
2428
_DisposeViewRepeaterStrategy,
@@ -33,6 +37,7 @@ import {
3337
@Directive({
3438
selector: 'mat-table[recycleRows], table[mat-table][recycleRows]',
3539
providers: [{provide: _VIEW_REPEATER_STRATEGY, useClass: _RecycleViewRepeaterStrategy}],
40+
standalone: true,
3641
})
3742
export class MatRecycleRows {}
3843

@@ -70,6 +75,8 @@ export class MatRecycleRows {}
7075
// See note on CdkTable for explanation on why this uses the default change detection strategy.
7176
// tslint:disable-next-line:validate-decorators
7277
changeDetection: ChangeDetectionStrategy.Default,
78+
standalone: true,
79+
imports: [HeaderRowOutlet, DataRowOutlet, NoDataRowOutlet, FooterRowOutlet],
7380
})
7481
export class MatTable<T> extends CdkTable<T> implements OnInit {
7582
/** Overrides the sticky CSS class set by the `CdkTable`. */

‎src/material/table/testing/table-harness.spec.ts

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -11,8 +11,7 @@ describe('MatTableHarness', () => {
1111

1212
beforeEach(async () => {
1313
await TestBed.configureTestingModule({
14-
imports: [MatTableModule],
15-
declarations: [TableHarnessTest],
14+
imports: [MatTableModule, TableHarnessTest],
1615
}).compileComponents();
1716

1817
fixture = TestBed.createComponent(TableHarnessTest);
@@ -215,6 +214,8 @@ describe('MatTableHarness', () => {
215214
<tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
216215
</table>
217216
`,
217+
standalone: true,
218+
imports: [MatTableModule],
218219
})
219220
class TableHarnessTest {
220221
displayedColumns: string[] = ['position', 'name', 'weight', 'symbol'];

‎src/material/table/text-column.ts

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -8,6 +8,7 @@
88

99
import {CdkTextColumn} from '@angular/cdk/table';
1010
import {ChangeDetectionStrategy, Component, ViewEncapsulation} from '@angular/core';
11+
import {MatColumnDef, MatHeaderCellDef, MatHeaderCell, MatCellDef, MatCell} from './cell';
1112

1213
/**
1314
* Column that simply shows text content for the header and row cells. Assumes that the table
@@ -38,5 +39,7 @@ import {ChangeDetectionStrategy, Component, ViewEncapsulation} from '@angular/co
3839
// an ExpressionChangedAfterItHasBeenCheckedError).
3940
// tslint:disable-next-line:validate-decorators
4041
changeDetection: ChangeDetectionStrategy.Default,
42+
standalone: true,
43+
imports: [MatColumnDef, MatHeaderCellDef, MatHeaderCell, MatCellDef, MatCell],
4144
})
4245
export class MatTextColumn<T> extends CdkTextColumn<T> {}

0 commit comments

Comments
 (0)