refactor(cdk-experimental/selection): switch to standalone

Reworks `cdk-experimental/selection` to support standalone.

Author: crisbeto

src/cdk-experimental/selection/BUILD.bazel

@@ -29,6 +29,7 @@ ng_test_library(
         ":selection",
         "//src/cdk/table",
         "//src/cdk/testing/private",
+        "@npm//@angular/common",
     ],
 )
 

src/cdk-experimental/selection/row-selection.ts

@@ -24,6 +24,7 @@ import {CdkSelection} from './selection';
     '[class.cdk-selected]': '_selection.isSelected(this.value, this.index)',
     '[attr.aria-selected]': '_selection.isSelected(this.value, this.index)',
   },
+  standalone: true,
 })
 export class CdkRowSelection<T> {
   // We need an initializer here to avoid a TS error.

src/cdk-experimental/selection/select-all.ts

@@ -26,6 +26,7 @@ import {CdkSelection} from './selection';
 @Directive({
   selector: '[cdkSelectAll]',
   exportAs: 'cdkSelectAll',
+  standalone: true,
 })
 export class CdkSelectAll<T> implements OnDestroy, OnInit {
   /**

src/cdk-experimental/selection/selection-column.ts

@@ -20,6 +20,9 @@ import {
 } from '@angular/core';
 
 import {CdkSelection} from './selection';
+import {AsyncPipe} from '@angular/common';
+import {CdkSelectionToggle} from './selection-toggle';
+import {CdkSelectAll} from './select-all';
 
 /**
  * Column that adds row selecting checkboxes and a select-all checkbox if `cdkSelectionMultiple` is
@@ -54,6 +57,15 @@ import {CdkSelection} from './selection';
   `,
   changeDetection: ChangeDetectionStrategy.OnPush,
   encapsulation: ViewEncapsulation.None,
+  standalone: true,
+  imports: [
+    CdkColumnDef,
+    CdkHeaderCellDef,
+    CdkSelectAll,
+    CdkCellDef,
+    CdkSelectionToggle,
+    AsyncPipe,
+  ],
 })
 export class CdkSelectionColumn<T> implements OnInit, OnDestroy {
   /** Column name that should be used to reference this column. */

src/cdk-experimental/selection/selection-module.ts

@@ -17,14 +17,15 @@ import {CdkSelectionColumn} from './selection-column';
 import {CdkSelectionToggle} from './selection-toggle';
 
 @NgModule({
-  imports: [CommonModule, CdkTableModule],
-  exports: [CdkSelection, CdkSelectionToggle, CdkSelectAll, CdkSelectionColumn, CdkRowSelection],
-  declarations: [
+  imports: [
+    CommonModule,
+    CdkTableModule,
     CdkSelection,
     CdkSelectionToggle,
     CdkSelectAll,
     CdkSelectionColumn,
     CdkRowSelection,
   ],
+  exports: [CdkSelection, CdkSelectionToggle, CdkSelectAll, CdkSelectionColumn, CdkRowSelection],
 })
 export class CdkSelectionModule {}

src/cdk-experimental/selection/selection-toggle.ts

@@ -27,6 +27,7 @@ import {CdkSelection} from './selection';
 @Directive({
   selector: '[cdkSelectionToggle]',
   exportAs: 'cdkSelectionToggle',
+  standalone: true,
 })
 export class CdkSelectionToggle<T> implements OnDestroy, OnInit {
   /** The value that is associated with the toggle */

src/cdk-experimental/selection/selection.spec.ts

@@ -1,3 +1,4 @@
+import {AsyncPipe} from '@angular/common';
 import {CdkTableModule} from '@angular/cdk/table';
 import {ChangeDetectorRef, Component, ElementRef, ViewChild} from '@angular/core';
 import {waitForAsync, ComponentFixture, fakeAsync, flush, TestBed} from '@angular/core/testing';
@@ -12,8 +13,7 @@ describe('CdkSelection', () => {
 
   beforeEach(waitForAsync(() => {
     TestBed.configureTestingModule({
-      imports: [CdkSelectionModule],
-      declarations: [ListWithMultiSelection],
+      imports: [CdkSelectionModule, ListWithMultiSelection],
     }).compileComponents();
   }));
 
@@ -239,8 +239,7 @@ describe('CdkSelection with multiple = false', () => {
 
   beforeEach(waitForAsync(() => {
     TestBed.configureTestingModule({
-      imports: [CdkSelectionModule],
-      declarations: [ListWithSingleSelection],
+      imports: [CdkSelectionModule, ListWithSingleSelection],
     }).compileComponents();
   }));
 
@@ -305,8 +304,7 @@ describe('cdkSelectionColumn', () => {
 
   beforeEach(waitForAsync(() => {
     TestBed.configureTestingModule({
-      imports: [CdkSelectionModule, CdkTableModule],
-      declarations: [MultiSelectTableWithSelectionColumn],
+      imports: [CdkSelectionModule, CdkTableModule, MultiSelectTableWithSelectionColumn],
     }).compileComponents();
   }));
 
@@ -400,8 +398,7 @@ describe('cdkSelectionColumn with multiple = false', () => {
 
   beforeEach(waitForAsync(() => {
     TestBed.configureTestingModule({
-      imports: [CdkSelectionModule, CdkTableModule],
-      declarations: [SingleSelectTableWithSelectionColumn],
+      imports: [CdkSelectionModule, CdkTableModule, SingleSelectTableWithSelectionColumn],
     }).compileComponents();
   }));
 
@@ -454,6 +451,8 @@ describe('cdkSelectionColumn with multiple = false', () => {
         </li>
       }
     </ul>`,
+  standalone: true,
+  imports: [CdkSelectionModule, AsyncPipe],
 })
 class ListWithMultiSelection {
   @ViewChild(CdkSelection) cdkSelection: CdkSelection<string>;
@@ -519,6 +518,8 @@ class ListWithMultiSelection {
         </li>
       }
     </ul>`,
+  standalone: true,
+  imports: [CdkSelectionModule, AsyncPipe],
 })
 class ListWithSingleSelection {
   @ViewChild(CdkSelection) cdkSelection: CdkSelection<string>;
@@ -561,6 +562,8 @@ class ListWithSingleSelection {
           cdkRowSelection [cdkRowSelectionValue]="row"></tr>
     </table>
     `,
+  standalone: true,
+  imports: [CdkSelectionModule, CdkTableModule],
 })
 class MultiSelectTableWithSelectionColumn {
   @ViewChild(CdkSelection) cdkSelection: CdkSelection<string>;
@@ -627,6 +630,8 @@ class MultiSelectTableWithSelectionColumn {
           cdkRowSelection [cdkRowSelectionValue]="row"></tr>
     </table>
     `,
+  standalone: true,
+  imports: [CdkSelectionModule, CdkTableModule],
 })
 class SingleSelectTableWithSelectionColumn {
   @ViewChild(CdkSelection) cdkSelection: CdkSelection<string>;

src/cdk-experimental/selection/selection.ts

@@ -32,6 +32,7 @@ import {SelectableWithIndex, SelectionChange, SelectionSet} from './selection-se
 @Directive({
   selector: '[cdkSelection]',
   exportAs: 'cdkSelection',
+  standalone: true,
 })
 export class CdkSelection<T> implements OnInit, AfterContentChecked, CollectionViewer, OnDestroy {
   viewChange: Observable<ListRange>;