refactor(multiple): remove standalone flag from CDK

Removes all of the `standalone` flag from all components in the CDK.

Author: crisbeto

src/cdk/a11y/focus-monitor/focus-monitor.ts

@@ -617,7 +617,6 @@ export class FocusMonitor implements OnDestroy {
 @Directive({
   selector: '[cdkMonitorElementFocus], [cdkMonitorSubtreeFocus]',
   exportAs: 'cdkMonitorFocus',
-  standalone: true,
 })
 export class CdkMonitorFocus implements AfterViewInit, OnDestroy {
   private _elementRef = inject<ElementRef<HTMLElement>>(ElementRef);

src/cdk/a11y/focus-trap/focus-trap.ts

@@ -403,7 +403,6 @@ export class FocusTrapFactory {
 @Directive({
   selector: '[cdkTrapFocus]',
   exportAs: 'cdkTrapFocus',
-  standalone: true,
 })
 export class CdkTrapFocus implements OnDestroy, AfterContentInit, OnChanges, DoCheck {
   private _elementRef = inject<ElementRef<HTMLElement>>(ElementRef);

src/cdk/a11y/live-announcer/live-announcer.ts

@@ -210,7 +210,6 @@ export class LiveAnnouncer implements OnDestroy {
 @Directive({
   selector: '[cdkAriaLive]',
   exportAs: 'cdkAriaLive',
-  standalone: true,
 })
 export class CdkAriaLive implements OnDestroy {
   private _elementRef = inject(ElementRef);

src/cdk/accordion/accordion-item.ts

@@ -36,7 +36,6 @@ let nextId = 0;
     // registering to the same accordion.
     {provide: CDK_ACCORDION, useValue: undefined},
   ],
-  standalone: true,
 })
 export class CdkAccordionItem implements OnInit, OnDestroy {
   accordion = inject<CdkAccordion>(CDK_ACCORDION, {optional: true, skipSelf: true})!;

src/cdk/accordion/accordion.ts

@@ -34,7 +34,6 @@ export const CDK_ACCORDION = new InjectionToken<CdkAccordion>('CdkAccordion');
   selector: 'cdk-accordion, [cdkAccordion]',
   exportAs: 'cdkAccordion',
   providers: [{provide: CDK_ACCORDION, useExisting: CdkAccordion}],
-  standalone: true,
 })
 export class CdkAccordion implements OnDestroy, OnChanges {
   /** Emits when the state of the accordion changes */

src/cdk/bidi/dir.ts

@@ -21,7 +21,6 @@ import {Direction, Directionality, _resolveDirectionality} from './directionalit
   providers: [{provide: Directionality, useExisting: Dir}],
   host: {'[attr.dir]': '_rawDir'},
   exportAs: 'dir',
-  standalone: true,
 })
 export class Dir implements Directionality, AfterContentInit, OnDestroy {
   /** Normalized direction that accounts for invalid/unsupported values. */

src/cdk/clipboard/copy-to-clipboard.ts

@@ -39,7 +39,6 @@ export const CDK_COPY_TO_CLIPBOARD_CONFIG = new InjectionToken<CdkCopyToClipboar
   host: {
     '(click)': 'copy()',
   },
-  standalone: true,
 })
 export class CdkCopyToClipboard implements OnDestroy {
   private _clipboard = inject(Clipboard);

src/cdk/dialog/dialog-container.ts

@@ -56,7 +56,6 @@ export function throwDialogContentAlreadyAttachedError() {
   // Using OnPush for dialogs caused some G3 sync issues. Disabled until we can track them down.
   // tslint:disable-next-line:validate-decorators
   changeDetection: ChangeDetectionStrategy.Default,
-  standalone: true,
   imports: [CdkPortalOutlet],
   host: {
     'class': 'cdk-dialog-container',

src/cdk/dialog/dialog.spec.ts

@@ -1214,6 +1214,7 @@ class DirectiveWithViewContainer {
 @Component({
   changeDetection: ChangeDetectionStrategy.OnPush,
   template: 'hello',
+  standalone: false,
 })
 class ComponentWithOnPushViewContainer {
   viewContainerRef = inject(ViewContainerRef);
@@ -1305,6 +1306,7 @@ class DialogWithoutFocusableElements {}
 @Component({
   template: `<button>I'm a button</button>`,
   encapsulation: ViewEncapsulation.ShadowDom,
+  standalone: false,
 })
 class ShadowDomComponent {}
 

src/cdk/drag-drop/directives/drag-handle.ts

@@ -30,7 +30,6 @@ export const CDK_DRAG_HANDLE = new InjectionToken<CdkDragHandle>('CdkDragHandle'
 /** Handle that can be used to drag a CdkDrag instance. */
 @Directive({
   selector: '[cdkDragHandle]',
-  standalone: true,
   host: {
     'class': 'cdk-drag-handle',
   },

src/cdk/drag-drop/directives/drag-placeholder.ts

@@ -22,7 +22,6 @@ export const CDK_DRAG_PLACEHOLDER = new InjectionToken<CdkDragPlaceholder>('CdkD
  */
 @Directive({
   selector: 'ng-template[cdkDragPlaceholder]',
-  standalone: true,
   providers: [{provide: CDK_DRAG_PLACEHOLDER, useExisting: CdkDragPlaceholder}],
 })
 export class CdkDragPlaceholder<T = any> implements OnDestroy {

src/cdk/drag-drop/directives/drag-preview.ts

@@ -30,7 +30,6 @@ export const CDK_DRAG_PREVIEW = new InjectionToken<CdkDragPreview>('CdkDragPrevi
  */
 @Directive({
   selector: 'ng-template[cdkDragPreview]',
-  standalone: true,
   providers: [{provide: CDK_DRAG_PREVIEW, useExisting: CdkDragPreview}],
 })
 export class CdkDragPreview<T = any> implements OnDestroy {

src/cdk/drag-drop/directives/drag.ts

@@ -62,7 +62,6 @@ export const CDK_DROP_LIST = new InjectionToken<CdkDropList>('CdkDropList');
 @Directive({
   selector: '[cdkDrag]',
   exportAs: 'cdkDrag',
-  standalone: true,
   host: {
     'class': DRAG_HOST_CLASS,
     '[class.cdk-drag-disabled]': 'disabled',

src/cdk/drag-drop/directives/drop-list-group.ts

@@ -26,7 +26,6 @@ export const CDK_DROP_LIST_GROUP = new InjectionToken<CdkDropListGroup<unknown>>
 @Directive({
   selector: '[cdkDropListGroup]',
   exportAs: 'cdkDropListGroup',
-  standalone: true,
   providers: [{provide: CDK_DROP_LIST_GROUP, useExisting: CdkDropListGroup}],
 })
 export class CdkDropListGroup<T> implements OnDestroy {

src/cdk/drag-drop/directives/drop-list.ts

@@ -38,7 +38,6 @@ let _uniqueIdCounter = 0;
 @Directive({
   selector: '[cdkDropList], cdk-drop-list',
   exportAs: 'cdkDropList',
-  standalone: true,
   providers: [
     // Prevent child drop lists from picking up the same group as their parent.
     {provide: CDK_DROP_LIST_GROUP, useValue: undefined},

src/cdk/drag-drop/drag-drop-registry.ts

@@ -35,7 +35,6 @@ const activeCapturingEventOptions = normalizePassiveListenerOptions({
  * @docs-private
  */
 @Component({
-  standalone: true,
   styleUrl: 'resets.css',
   encapsulation: ViewEncapsulation.None,
   template: '',

src/cdk/listbox/listbox.spec.ts

@@ -1012,6 +1012,7 @@ describe('CdkOption and CdkListbox', () => {
       <div cdkOption="peach">Peach</div>
     </div>
   `,
+  standalone: false,
 })
 class ListboxWithOptions {
   changedOption: CdkOption | null;
@@ -1037,6 +1038,7 @@ class ListboxWithOptions {
 
 @Component({
   template: `<div cdkListbox></div>`,
+  standalone: false,
 })
 class ListboxWithNoOptions {}
 
@@ -1052,6 +1054,7 @@ class ListboxWithNoOptions {}
       <div cdkOption="peach">Peach</div>
     </div>
   `,
+  standalone: false,
 })
 class ListboxWithFormControl {
   formControl = new FormControl();
@@ -1067,6 +1070,7 @@ class ListboxWithFormControl {
       }
     </div>
   `,
+  standalone: false,
 })
 class ListboxWithPreselectedFormControl {
   options = ['a', 'b', 'c'];
@@ -1081,6 +1085,7 @@ class ListboxWithPreselectedFormControl {
       }
     </div>
   `,
+  standalone: false,
 })
 class ListboxWithInvalidPreselectedFormControl {
   options = ['a', 'b', 'c'];
@@ -1096,6 +1101,7 @@ class ListboxWithInvalidPreselectedFormControl {
       <li cdkOption="peach" cdkOptionTypeaheadLabel="peach">🍑</li>
     </ul>
   `,
+  standalone: false,
 })
 class ListboxWithCustomTypeahead {}
 
@@ -1109,6 +1115,7 @@ class ListboxWithCustomTypeahead {}
       <div cdkOption="peach">Peach</div>
     </div>
   `,
+  standalone: false,
 })
 class ListboxWithBoundValue {
   value = ['banana'];
@@ -1125,6 +1132,7 @@ class ListboxWithBoundValue {
       <div cdkOption="peach">Peach</div>
     </div>
   `,
+  standalone: false,
 })
 class ListboxWithMultipleBoundValues {
   value = ['apple', 'banana'];
@@ -1138,6 +1146,7 @@ class ListboxWithMultipleBoundValues {
       }
     </div>
   `,
+  standalone: false,
 })
 class ListboxWithObjectValues {
   fruits = [{name: 'Apple'}, {name: 'Orange'}, {name: 'Banana'}, {name: 'Peach'}];

src/cdk/listbox/listbox.ts

@@ -81,7 +81,6 @@ class ListboxSelectionModel<T> extends SelectionModel<T> {
 /** A selectable option in a listbox. */
 @Directive({
   selector: '[cdkOption]',
-  standalone: true,
   exportAs: 'cdkOption',
   host: {
     'role': 'option',
@@ -230,7 +229,6 @@ export class CdkOption<T = unknown> implements ListKeyManagerOption, Highlightab
 
 @Directive({
   selector: '[cdkListbox]',
-  standalone: true,
   exportAs: 'cdkListbox',
   host: {
     'role': 'listbox',

src/cdk/menu/context-menu-trigger.spec.ts

@@ -451,6 +451,7 @@ describe('CdkContextMenuTrigger', () => {
       </div>
     </ng-template>
   `,
+  standalone: false,
 })
 class SimpleContextMenu {
   @ViewChild(CdkContextMenuTrigger) trigger: CdkContextMenuTrigger;
@@ -479,6 +480,7 @@ class SimpleContextMenu {
       <div #copy_menu cdkMenu></div>
     </ng-template>
   `,
+  standalone: false,
 })
 class NestedContextMenu {
   @ViewChild('cut_trigger', {read: ElementRef}) cutContext: ElementRef<HTMLElement>;
@@ -504,6 +506,7 @@ class NestedContextMenu {
       <div #copy_menu cdkMenu></div>
     </ng-template>
   `,
+  standalone: false,
 })
 class ContextMenuWithSubmenu {
   @ViewChild(CdkContextMenuTrigger, {read: ElementRef}) context: ElementRef<HTMLElement>;
@@ -534,6 +537,7 @@ class ContextMenuWithSubmenu {
       <button #inline_menu_button cdkMenuItem></button>
     </div>
   `,
+  standalone: false,
 })
 class ContextMenuWithMenuBarAndInlineMenu {
   @ViewChild(CdkMenuBar, {read: ElementRef}) nativeMenuBar: ElementRef;
@@ -562,6 +566,7 @@ class ContextMenuWithMenuBarAndInlineMenu {
       </div>
     </ng-template>
   `,
+  standalone: false,
 })
 class MenuBarAndContextTriggerShareMenu {
   @ViewChild(CdkMenuTrigger) menuBarTrigger: CdkMenuTrigger;
@@ -577,6 +582,7 @@ class MenuBarAndContextTriggerShareMenu {
       <div cdkMenu class="test-menu">{{message}}</div>
     </ng-template>
   `,
+  standalone: false,
 })
 class ContextTriggerWithData {
   @ViewChild(CdkContextMenuTrigger, {read: ElementRef}) triggerElement: ElementRef<HTMLElement>;

src/cdk/menu/context-menu-trigger.ts

@@ -65,7 +65,6 @@ export type ContextMenuCoordinates = {x: number; y: number};
 @Directive({
   selector: '[cdkContextMenuTriggerFor]',
   exportAs: 'cdkContextMenuTriggerFor',
-  standalone: true,
   host: {
     '[attr.data-cdk-menu-stack-id]': 'null',
     '(contextmenu)': '_openOnContextMenu($event)',

src/cdk/menu/menu-aim.ts

@@ -254,7 +254,6 @@ export class TargetMenuAim implements MenuAim, OnDestroy {
 @Directive({
   selector: '[cdkTargetMenuAim]',
   exportAs: 'cdkTargetMenuAim',
-  standalone: true,
   providers: [{provide: MENU_AIM, useClass: TargetMenuAim}],
 })
 export class CdkTargetMenuAim {}

src/cdk/menu/menu-bar.ts

@@ -31,7 +31,6 @@ import {CdkMenuBase} from './menu-base';
 @Directive({
   selector: '[cdkMenuBar]',
   exportAs: 'cdkMenuBar',
-  standalone: true,
   host: {
     'role': 'menubar',
     'class': 'cdk-menu-bar',

src/cdk/menu/menu-base.ts

@@ -49,7 +49,6 @@ let nextId = 0;
     '(focusin)': 'menuStack.setHasFocus(true)',
     '(focusout)': 'menuStack.setHasFocus(false)',
   },
-  standalone: true,
 })
 export abstract class CdkMenuBase
   extends CdkMenuGroup

src/cdk/menu/menu-group.ts

@@ -15,7 +15,6 @@ import {UniqueSelectionDispatcher} from '@angular/cdk/collections';
 @Directive({
   selector: '[cdkMenuGroup]',
   exportAs: 'cdkMenuGroup',
-  standalone: true,
   host: {
     'role': 'group',
     'class': 'cdk-menu-group',

src/cdk/menu/menu-item-checkbox.ts

@@ -17,7 +17,6 @@ import {CdkMenuItem} from './menu-item';
 @Directive({
   selector: '[cdkMenuItemCheckbox]',
   exportAs: 'cdkMenuItemCheckbox',
-  standalone: true,
   host: {
     'role': 'menuitemcheckbox',
     '[class.cdk-menu-item-checkbox]': 'true',

src/cdk/menu/menu-item-radio.ts

@@ -22,7 +22,6 @@ let nextId = 0;
 @Directive({
   selector: '[cdkMenuItemRadio]',
   exportAs: 'cdkMenuItemRadio',
-  standalone: true,
   host: {
     'role': 'menuitemradio',
     '[class.cdk-menu-item-radio]': 'true',

src/cdk/menu/menu-item-selectable.ts

@@ -15,7 +15,6 @@ import {CdkMenuItem} from './menu-item';
     '[attr.aria-checked]': '!!checked',
     '[attr.aria-disabled]': 'disabled || null',
   },
-  standalone: true,
 })
 export abstract class CdkMenuItemSelectable extends CdkMenuItem {
   /** Whether the element is checked */

src/cdk/menu/menu-item.spec.ts

@@ -148,6 +148,7 @@ describe('MenuItem', () => {
 
 @Component({
   template: `<button cdkMenuItem>Click me!</button>`,
+  standalone: false,
 })
 class SingleMenuItem {}
 
@@ -158,6 +159,7 @@ class SingleMenuItem {}
       Click me!
     </button>
   `,
+  standalone: false,
 })
 class MenuItemWithIcon {
   typeahead: string;
@@ -170,13 +172,15 @@ class MenuItemWithIcon {
       Click me!
     </button>
   `,
+  standalone: false,
 })
 class MenuItemWithIconClass {
   typeahead: string;
 }
 
 @Component({
   template: ` <button cdkMenuItem><strong>Click</strong> me!</button> `,
+  standalone: false,
 })
 class MenuItemWithBoldElement {}
 
@@ -193,6 +197,7 @@ class MenuItemWithBoldElement {}
       </div>
     </button>
   `,
+  standalone: false,
 })
 class MenuItemWithMultipleNestings {
   typeahead: string;

src/cdk/menu/menu-item.ts

@@ -37,7 +37,6 @@ import {eventDispatchesNativeClick} from './event-detection';
 @Directive({
   selector: '[cdkMenuItem]',
   exportAs: 'cdkMenuItem',
-  standalone: true,
   host: {
     'role': 'menuitem',
     'class': 'cdk-menu-item',

src/cdk/menu/menu-trigger-base.ts

@@ -46,7 +46,6 @@ export const MENU_SCROLL_STRATEGY = new InjectionToken<() => ScrollStrategy>(
     '[attr.aria-controls]': 'childMenu?.id',
     '[attr.data-cdk-menu-stack-id]': 'menuStack.id',
   },
-  standalone: true,
 })
 export abstract class CdkMenuTriggerBase implements OnDestroy {
   /** The DI injector for this component. */