refactor(devtools): removed standalone: true (#58922)

Removed the default standalone true flag from all the component, directive and pipes PR Close #58922
2026-05-24 09:28:37 +00:00 · 2024-11-27 15:13:54 +05:30 · 2024-11-27 15:13:54 +05:30 · 31f73cd9d3
commit 31f73cd9d3
parent ee7aca1096
64 changed files with 6 additions and 76 deletions
--- a/devtools/projects/demo-standalone/src/app/app.component.ts
+++ b/devtools/projects/demo-standalone/src/app/app.component.ts
@ -12,7 +12,6 @@ import {Router, RouterOutlet} from '@angular/router';
@Component({
  selector: 'app-root',
  template: `<router-outlet></router-outlet>`,
-  standalone: true,
  imports: [RouterOutlet],
 })
 export class AppComponent {
--- a/devtools/projects/demo-standalone/src/app/demo-app/demo-app.component.ts
+++ b/devtools/projects/demo-standalone/src/app/demo-app/demo-app.component.ts
@ -35,7 +35,6 @@ import {ZippyComponent} from './zippy.component';
  templateUrl: './demo-app.component.html',
  styleUrls: ['./demo-app.component.scss'],
  encapsulation: ViewEncapsulation.None,
-  standalone: true,
  imports: [HeavyComponent, RouterOutlet, JsonPipe],
  schemas: [CUSTOM_ELEMENTS_SCHEMA],
 })
--- a/devtools/projects/demo-standalone/src/app/demo-app/heavy.component.ts
+++ b/devtools/projects/demo-standalone/src/app/demo-app/heavy.component.ts
@ -15,7 +15,7 @@ const fib = (n: number): number => {
  return fib(n - 1) + fib(n - 2);
 };

-@Component({selector: 'app-heavy', template: `<h1>{{ calculate() }}</h1>`, standalone: true})
+@Component({selector: 'app-heavy', template: `<h1>{{ calculate() }}</h1>`})
 export class HeavyComponent {
  @Input()
  set foo(_: any) {}
--- a/devtools/projects/demo-standalone/src/app/demo-app/todo/about/about.component.ts
+++ b/devtools/projects/demo-standalone/src/app/demo-app/todo/about/about.component.ts
@ -11,7 +11,6 @@ import {RouterLink} from '@angular/router';

@Component({
  selector: 'app-about',
-  standalone: true,
  imports: [RouterLink],
  template: `
    About component
--- a/devtools/projects/demo-standalone/src/app/demo-app/todo/dialog.component.ts
+++ b/devtools/projects/demo-standalone/src/app/demo-app/todo/dialog.component.ts
@ -18,7 +18,6 @@ export interface DialogData {

@Component({
  selector: 'app-dialog',
-  standalone: true,
  imports: [MatDialogModule, MatFormField, MatLabel, FormsModule],
  template: `
    <h1 mat-dialog-title>Hi {{ data.name }}</h1>
--- a/devtools/projects/demo-standalone/src/app/demo-app/todo/home/sample.pipe.ts
+++ b/devtools/projects/demo-standalone/src/app/demo-app/todo/home/sample.pipe.ts
@ -8,7 +8,7 @@

 import {OnDestroy, Pipe, PipeTransform} from '@angular/core';

-@Pipe({name: 'sample', pure: false, standalone: true})
+@Pipe({name: 'sample', pure: false})
 export class SamplePipe implements PipeTransform, OnDestroy {
  transform(val: unknown) {
    return val;
--- a/devtools/projects/demo-standalone/src/app/demo-app/todo/home/todo.component.ts
+++ b/devtools/projects/demo-standalone/src/app/demo-app/todo/home/todo.component.ts
@ -6,7 +6,6 @@
 * found in the LICENSE file at https://angular.dev/license
 */

-import {CommonModule} from '@angular/common';
 import {ChangeDetectionStrategy, Component, EventEmitter, Input, Output} from '@angular/core';

 import {TooltipDirective} from './tooltip.directive';
@ -20,7 +19,6 @@ export interface Todo {
@Component({
  selector: 'app-todo',
  changeDetection: ChangeDetectionStrategy.OnPush,
-  standalone: true,
  imports: [TooltipDirective],
  styles: [
    `
--- a/devtools/projects/demo-standalone/src/app/demo-app/todo/home/todos.component.ts
+++ b/devtools/projects/demo-standalone/src/app/demo-app/todo/home/todos.component.ts
@ -29,7 +29,7 @@ export const enum TodoFilter {
  Active = 'active',
 }

-@Pipe({pure: false, name: 'todosFilter', standalone: true})
+@Pipe({pure: false, name: 'todosFilter'})
 export class TodosFilter implements PipeTransform {
  transform(todos: Todo[], filter: TodoFilter): Todo[] {
    return (todos || []).filter((t) => {
@ -57,7 +57,6 @@ const fib = (n: number): number => {
@Component({
  selector: 'app-todos',
  imports: [RouterLink, TodoComponent, SamplePipe, TodosFilter, TooltipDirective],
-  standalone: true,
  template: `
    <a [routerLink]="">Home</a>
    <a [routerLink]="">Home</a>
--- a/devtools/projects/demo-standalone/src/app/demo-app/todo/home/tooltip.directive.ts
+++ b/devtools/projects/demo-standalone/src/app/demo-app/todo/home/tooltip.directive.ts
@ -8,7 +8,7 @@

 import {Directive, HostListener} from '@angular/core';

-@Directive({selector: '[appTooltip]', standalone: true})
+@Directive({selector: '[appTooltip]'})
 export class TooltipDirective {
  visible = false;
  nested = {
--- a/devtools/projects/demo-standalone/src/app/demo-app/todo/todo-app.component.ts
+++ b/devtools/projects/demo-standalone/src/app/demo-app/todo/todo-app.component.ts
@ -9,15 +9,12 @@
 import {Component} from '@angular/core';
 import {FormsModule} from '@angular/forms';
 import {MatDialog, MatDialogModule} from '@angular/material/dialog';
-import {MatFormFieldModule} from '@angular/material/form-field';
-import {MatInputModule} from '@angular/material/input';
 import {RouterLink, RouterOutlet} from '@angular/router';

 import {DialogComponent} from './dialog.component';

@Component({
  selector: 'app-todo-demo',
-  standalone: true,
  imports: [RouterLink, RouterOutlet, MatDialogModule, FormsModule],
  styles: [
    `
--- a/devtools/projects/demo-standalone/src/app/demo-app/zippy.component.ts
+++ b/devtools/projects/demo-standalone/src/app/demo-app/zippy.component.ts
@ -10,7 +10,6 @@ import {Component, Input} from '@angular/core';

@Component({
  selector: 'app-zippy',
-  standalone: true,
  styles: [
    `
      :host {
--- a/devtools/projects/demo-standalone/src/app/devtools-app/devtools-app.component.ts
+++ b/devtools/projects/demo-standalone/src/app/devtools-app/devtools-app.component.ts
@ -14,7 +14,6 @@ import {DevToolsComponent} from 'ng-devtools';
 import {FrameManager} from '../../../../../projects/ng-devtools/src/lib/frame_manager';

@Component({
-  standalone: true,
  imports: [DevToolsComponent],
  providers: [
    {provide: FrameManager, useFactory: () => FrameManager.initialize(null)},
--- a/devtools/projects/ng-devtools/src/lib/devtools-tabs/dependency-injection/resolution-path.component.ts
+++ b/devtools/projects/ng-devtools/src/lib/devtools-tabs/dependency-injection/resolution-path.component.ts
@ -36,7 +36,6 @@ import {InjectorTreeNode, InjectorTreeVisualizer} from './injector-tree-visualiz
      }
    `,
  ],
-  standalone: true,
 })
 export class ResolutionPathComponent implements OnDestroy {
  private svgContainer = viewChild.required<ElementRef>('svgContainer');
--- a/devtools/projects/ng-devtools/src/lib/devtools-tabs/devtools-tabs.component.ts
+++ b/devtools/projects/ng-devtools/src/lib/devtools-tabs/devtools-tabs.component.ts
@ -16,7 +16,7 @@ import {Events, MessageBus, Route} from 'protocol';

 import {ApplicationEnvironment, Frame, TOP_LEVEL_FRAME_ID} from '../application-environment/index';
 import {FrameManager} from '../frame_manager';
-import {Theme, ThemeService} from '../theme-service';
+import {ThemeService} from '../theme-service';

 import {DirectiveExplorerComponent} from './directive-explorer/directive-explorer.component';
 import {InjectorTreeComponent} from './injector-tree/injector-tree.component';
@ -30,7 +30,6 @@ type Tabs = 'Components' | 'Profiler' | 'Router Tree' | 'Injector Tree';
  selector: 'ng-devtools-tabs',
  templateUrl: './devtools-tabs.component.html',
  styleUrls: ['./devtools-tabs.component.scss'],
-  standalone: true,
  imports: [
    MatTabNav,
    MatTabNavPanel,
--- a/devtools/projects/ng-devtools/src/lib/devtools-tabs/devtools-tabs.spec.ts
+++ b/devtools/projects/ng-devtools/src/lib/devtools-tabs/devtools-tabs.spec.ts
@ -24,7 +24,6 @@ import {FrameManager} from '../frame_manager';
@Component({
  selector: 'ng-directive-explorer',
  template: '',
-  standalone: true,
  imports: [MatTooltip, MatMenuModule],
 })
 export class MockDirectiveExplorerComponent {}
--- a/devtools/projects/ng-devtools/src/lib/devtools-tabs/directive-explorer/directive-explorer.component.ts
+++ b/devtools/projects/ng-devtools/src/lib/devtools-tabs/directive-explorer/directive-explorer.component.ts
@ -75,7 +75,6 @@ const sameDirectives = (a: IndexedNode, b: IndexedNode) => {
      useClass: ElementPropertyResolver,
    },
  ],
-  standalone: true,
  imports: [
    SplitComponent,
    SplitAreaDirective,
--- a/devtools/projects/ng-devtools/src/lib/devtools-tabs/directive-explorer/directive-explorer.spec.ts
+++ b/devtools/projects/ng-devtools/src/lib/devtools-tabs/directive-explorer/directive-explorer.spec.ts
@ -18,7 +18,6 @@ import {IndexedNode} from './directive-forest/index-forest';
 import SpyObj = jasmine.SpyObj;
 import {By} from '@angular/platform-browser';
 import {FrameManager} from '../../frame_manager';
-import {TabUpdate} from '../tab-update';
 import {Component, CUSTOM_ELEMENTS_SCHEMA, output, input} from '@angular/core';
 import {ElementPropertyResolver, FlatNode} from './property-resolver/element-property-resolver';
 import {BreadcrumbsComponent} from './directive-forest/breadcrumbs/breadcrumbs.component';
@ -27,7 +26,6 @@ import {PropertyTabComponent} from './property-tab/property-tab.component';
@Component({
  selector: 'ng-directive-forest',
  template: '',
-  standalone: true,
 })
 class MockDirectiveForestComponent {
  readonly forest = input<IndexedNode[]>([]);
@ -44,7 +42,6 @@ class MockDirectiveForestComponent {
@Component({
  selector: 'ng-breadcrumbs',
  template: '',
-  standalone: true,
 })
 class MockBreadcrumbsComponent {
  readonly parents = input<IndexedNode[]>([]);
@ -56,7 +53,6 @@ class MockBreadcrumbsComponent {
@Component({
  selector: 'ng-property-tab',
  template: '',
-  standalone: true,
 })
 class MockPropertyTabComponent {
  readonly currentSelectedElement = input<IndexedNode | null>(null);
--- a/devtools/projects/ng-devtools/src/lib/devtools-tabs/directive-explorer/directive-forest/breadcrumbs/breadcrumbs.component.ts
+++ b/devtools/projects/ng-devtools/src/lib/devtools-tabs/directive-explorer/directive-forest/breadcrumbs/breadcrumbs.component.ts
@ -26,7 +26,6 @@ import {MatCard} from '@angular/material/card';
  selector: 'ng-breadcrumbs',
  templateUrl: './breadcrumbs.component.html',
  styleUrls: ['./breadcrumbs.component.scss'],
-  standalone: true,
  imports: [MatCard, MatIcon, MatButton],
 })
 export class BreadcrumbsComponent {
--- a/devtools/projects/ng-devtools/src/lib/devtools-tabs/directive-explorer/directive-forest/directive-forest.component.ts
+++ b/devtools/projects/ng-devtools/src/lib/devtools-tabs/directive-explorer/directive-forest/directive-forest.component.ts
@ -25,7 +25,6 @@ import {
  signal,
  viewChild,
 } from '@angular/core';
-import {takeUntilDestroyed} from '@angular/core/rxjs-interop';
 import {DevToolsNode, ElementPosition, Events, MessageBus} from 'protocol';

 import {TabUpdate} from '../../tab-update/index';
@ -42,7 +41,6 @@ import {MatTooltip} from '@angular/material/tooltip';
  templateUrl: './directive-forest.component.html',
  styleUrls: ['./directive-forest.component.scss'],
  changeDetection: ChangeDetectionStrategy.OnPush,
-  standalone: true,
  imports: [
    FilterComponent,
    CdkVirtualScrollViewport,
--- a/devtools/projects/ng-devtools/src/lib/devtools-tabs/directive-explorer/directive-forest/filter/filter.component.ts
+++ b/devtools/projects/ng-devtools/src/lib/devtools-tabs/directive-explorer/directive-forest/filter/filter.component.ts
@ -14,7 +14,6 @@ import {MatCard} from '@angular/material/card';
  selector: 'ng-filter',
  templateUrl: './filter.component.html',
  styleUrls: ['./filter.component.scss'],
-  standalone: true,
  imports: [MatCard, MatIcon],
 })
 export class FilterComponent {
--- a/devtools/projects/ng-devtools/src/lib/devtools-tabs/directive-explorer/property-tab/component-metadata.component.ts
+++ b/devtools/projects/ng-devtools/src/lib/devtools-tabs/directive-explorer/property-tab/component-metadata.component.ts
@ -16,7 +16,6 @@ import {ElementPropertyResolver} from '../property-resolver/element-property-res
  templateUrl: './component-metadata.component.html',
  styleUrls: ['./component-metadata.component.scss'],
  changeDetection: ChangeDetectionStrategy.OnPush,
-  standalone: true,
 })
 export class ComponentMetadataComponent {
  readonly currentSelectedComponent = input.required<ComponentType>();
--- a/devtools/projects/ng-devtools/src/lib/devtools-tabs/directive-explorer/property-tab/property-tab-header.component.ts
+++ b/devtools/projects/ng-devtools/src/lib/devtools-tabs/directive-explorer/property-tab/property-tab-header.component.ts
@ -17,7 +17,6 @@ import {MatExpansionModule} from '@angular/material/expansion';
  selector: 'ng-property-tab-header',
  styleUrls: ['./property-tab-header.component.scss'],
  changeDetection: ChangeDetectionStrategy.OnPush,
-  standalone: true,
  imports: [MatExpansionModule, ComponentMetadataComponent],
 })
 export class PropertyTabHeaderComponent {
--- a/devtools/projects/ng-devtools/src/lib/devtools-tabs/directive-explorer/property-tab/property-tab.component.ts
+++ b/devtools/projects/ng-devtools/src/lib/devtools-tabs/directive-explorer/property-tab/property-tab.component.ts
@ -17,7 +17,6 @@ import {PropertyTabHeaderComponent} from './property-tab-header.component';
@Component({
  templateUrl: './property-tab.component.html',
  selector: 'ng-property-tab',
-  standalone: true,
  imports: [PropertyTabHeaderComponent, PropertyTabBodyComponent],
 })
 export class PropertyTabComponent {
--- a/devtools/projects/ng-devtools/src/lib/devtools-tabs/directive-explorer/property-tab/property-view/property-editor.component.ts
+++ b/devtools/projects/ng-devtools/src/lib/devtools-tabs/directive-explorer/property-tab/property-view/property-editor.component.ts
@ -39,7 +39,6 @@ const parseValue = (value: EditorResult): EditorResult => {
  templateUrl: './property-editor.component.html',
  selector: 'ng-property-editor',
  styleUrls: ['./property-editor.component.scss'],
-  standalone: true,
  imports: [FormsModule],
 })
 export class PropertyEditorComponent {
--- a/devtools/projects/ng-devtools/src/lib/devtools-tabs/directive-explorer/property-tab/property-view/property-preview.component.ts
+++ b/devtools/projects/ng-devtools/src/lib/devtools-tabs/directive-explorer/property-tab/property-view/property-preview.component.ts
@ -15,7 +15,6 @@ import {FlatNode} from '../../property-resolver/element-property-resolver';
  selector: 'ng-property-preview',
  templateUrl: './property-preview.component.html',
  styleUrls: ['./property-preview.component.scss'],
-  standalone: true,
 })
 export class PropertyPreviewComponent {
  readonly node = input.required<FlatNode>();
--- a/devtools/projects/ng-devtools/src/lib/devtools-tabs/directive-explorer/property-tab/property-view/property-tab-body.component.ts
+++ b/devtools/projects/ng-devtools/src/lib/devtools-tabs/directive-explorer/property-tab/property-view/property-tab-body.component.ts
@ -17,7 +17,6 @@ import {PropertyViewComponent} from './property-view.component';
  templateUrl: './property-tab-body.component.html',
  selector: 'ng-property-tab-body',
  styleUrls: ['./property-tab-body.component.scss'],
-  standalone: true,
  imports: [PropertyViewComponent],
 })
 export class PropertyTabBodyComponent {
--- a/devtools/projects/ng-devtools/src/lib/devtools-tabs/directive-explorer/property-tab/property-view/property-view-body.component.ts
+++ b/devtools/projects/ng-devtools/src/lib/devtools-tabs/directive-explorer/property-tab/property-view/property-view-body.component.ts
@ -26,7 +26,6 @@ import {MatExpansionModule} from '@angular/material/expansion';
  selector: 'ng-property-view-body',
  templateUrl: './property-view-body.component.html',
  styleUrls: ['./property-view-body.component.scss'],
-  standalone: true,
  imports: [
    MatExpansionModule,
    CdkDropList,
@ -166,7 +165,6 @@ export class PropertyViewBodyComponent {
      }
    `,
  ],
-  standalone: true,
  imports: [MatExpansionModule, MatChipsModule, MatTooltip, ResolutionPathComponent],
 })
 export class DependencyViewerComponent {
@ -186,7 +184,6 @@ export class DependencyViewerComponent {
      }
    `,
  ],
-  standalone: true,
  imports: [DependencyViewerComponent],
 })
 export class InjectedServicesComponent {
--- a/devtools/projects/ng-devtools/src/lib/devtools-tabs/directive-explorer/property-tab/property-view/property-view-header.component.ts
+++ b/devtools/projects/ng-devtools/src/lib/devtools-tabs/directive-explorer/property-tab/property-view/property-view-header.component.ts
@ -15,7 +15,6 @@ import {MatToolbar} from '@angular/material/toolbar';
  selector: 'ng-property-view-header',
  templateUrl: './property-view-header.component.html',
  styleUrls: ['./property-view-header.component.scss'],
-  standalone: true,
  imports: [MatToolbar, MatTooltip, MatIcon],
 })
 export class PropertyViewHeaderComponent {
--- a/devtools/projects/ng-devtools/src/lib/devtools-tabs/directive-explorer/property-tab/property-view/property-view-tree.component.ts
+++ b/devtools/projects/ng-devtools/src/lib/devtools-tabs/directive-explorer/property-tab/property-view/property-view-tree.component.ts
@ -20,7 +20,6 @@ import {MatTree, MatTreeNode, MatTreeNodeDef, MatTreeNodePadding} from '@angular
  selector: 'ng-property-view-tree',
  templateUrl: './property-view-tree.component.html',
  styleUrls: ['./property-view-tree.component.scss'],
-  standalone: true,
  imports: [
    MatTree,
    MatTreeNode,
--- a/devtools/projects/ng-devtools/src/lib/devtools-tabs/directive-explorer/property-tab/property-view/property-view.component.ts
+++ b/devtools/projects/ng-devtools/src/lib/devtools-tabs/directive-explorer/property-tab/property-view/property-view.component.ts
@ -17,7 +17,6 @@ import {PropertyViewHeaderComponent} from './property-view-header.component';
  selector: 'ng-property-view',
  templateUrl: './property-view.component.html',
  styleUrls: ['./property-view.component.scss'],
-  standalone: true,
  imports: [PropertyViewHeaderComponent, PropertyViewBodyComponent],
 })
 export class PropertyViewComponent {
--- a/devtools/projects/ng-devtools/src/lib/devtools-tabs/injector-tree/injector-providers.component.ts
+++ b/devtools/projects/ng-devtools/src/lib/devtools-tabs/injector-tree/injector-providers.component.ts
@ -142,7 +142,6 @@ import {Events, MessageBus, SerializedInjector, SerializedProviderRecord} from '
      }
    `,
  ],
-  standalone: true,
  imports: [
    MatTableModule,
    MatIcon,
--- a/devtools/projects/ng-devtools/src/lib/devtools-tabs/injector-tree/injector-tree.component.ts
+++ b/devtools/projects/ng-devtools/src/lib/devtools-tabs/injector-tree/injector-tree.component.ts
@ -45,7 +45,6 @@ import {
 } from './injector-tree-fns';

@Component({
-  standalone: true,
  selector: 'ng-injector-tree',
  imports: [
    SplitComponent,
--- a/devtools/projects/ng-devtools/src/lib/devtools-tabs/profiler/profiler-import-dialog.component.ts
+++ b/devtools/projects/ng-devtools/src/lib/devtools-tabs/profiler/profiler-import-dialog.component.ts
@ -28,7 +28,6 @@ interface DialogData {
  selector: 'ng-profiler-import-dialog',
  templateUrl: './profiler-import-dialog.component.html',
  styleUrls: ['./profiler-import-dialog.component.scss'],
-  standalone: true,
  imports: [MatDialogActions, MatDialogClose, MatDialogContent, MatDialogTitle, MatButton],
 })
 export class ProfilerImportDialogComponent {
--- a/devtools/projects/ng-devtools/src/lib/devtools-tabs/profiler/profiler.component.ts
+++ b/devtools/projects/ng-devtools/src/lib/devtools-tabs/profiler/profiler.component.ts
@ -28,7 +28,6 @@ const PROFILER_VERSION = 1;
  selector: 'ng-profiler',
  templateUrl: './profiler.component.html',
  styleUrls: ['./profiler.component.scss'],
-  standalone: true,
  imports: [MatCard, MatIconButton, MatTooltip, MatIcon, TimelineComponent],
 })
 export class ProfilerComponent implements OnInit {
--- a/devtools/projects/ng-devtools/src/lib/devtools-tabs/profiler/timeline/frame-selector.component.ts
+++ b/devtools/projects/ng-devtools/src/lib/devtools-tabs/profiler/timeline/frame-selector.component.ts
@ -37,7 +37,6 @@ const ITEM_WIDTH = 30;
  selector: 'ng-frame-selector',
  templateUrl: './frame-selector.component.html',
  styleUrls: ['./frame-selector.component.scss'],
-  standalone: true,
  imports: [
    MatCard,
    MatTooltip,
--- a/devtools/projects/ng-devtools/src/lib/devtools-tabs/profiler/timeline/recording-dialog.component.ts
+++ b/devtools/projects/ng-devtools/src/lib/devtools-tabs/profiler/timeline/recording-dialog.component.ts
@ -13,7 +13,6 @@ import {MatProgressBar} from '@angular/material/progress-bar';
  selector: 'ng-recording-dialog',
  templateUrl: './recording-dialog.component.html',
  styleUrls: ['./recording-dialog.component.scss'],
-  standalone: true,
  imports: [MatProgressBar],
 })
 export class RecordingDialogComponent {}
--- a/devtools/projects/ng-devtools/src/lib/devtools-tabs/profiler/timeline/recording-modal.component.ts
+++ b/devtools/projects/ng-devtools/src/lib/devtools-tabs/profiler/timeline/recording-modal.component.ts
@ -13,7 +13,6 @@ import {RecordingDialogComponent} from './recording-dialog.component';
  selector: 'ng-recording-modal',
  templateUrl: './recording-modal.component.html',
  styleUrls: ['./recording-modal.component.scss'],
-  standalone: true,
  imports: [RecordingDialogComponent],
 })
 export class RecordingModalComponent {}
--- a/devtools/projects/ng-devtools/src/lib/devtools-tabs/profiler/timeline/recording-visualizer/bar-chart.component.ts
+++ b/devtools/projects/ng-devtools/src/lib/devtools-tabs/profiler/timeline/recording-visualizer/bar-chart.component.ts
@ -39,7 +39,6 @@ interface BarData {
    ]),
    trigger('stagger', [transition(':enter', [query(':enter', stagger('.1s', [animateChild()]))])]),
  ],
-  standalone: true,
  imports: [MatTooltip],
  changeDetection: ChangeDetectionStrategy.OnPush,
 })
--- a/devtools/projects/ng-devtools/src/lib/devtools-tabs/profiler/timeline/recording-visualizer/bargraph-visualizer.component.ts
+++ b/devtools/projects/ng-devtools/src/lib/devtools-tabs/profiler/timeline/recording-visualizer/bargraph-visualizer.component.ts
@ -20,7 +20,6 @@ import {BarChartComponent} from './bar-chart.component';
  selector: 'ng-bargraph-visualizer',
  templateUrl: './bargraph-visualizer.component.html',
  styleUrls: ['./bargraph-visualizer.component.scss'],
-  standalone: true,
  imports: [BarChartComponent],
  changeDetection: ChangeDetectionStrategy.OnPush,
 })
--- a/devtools/projects/ng-devtools/src/lib/devtools-tabs/profiler/timeline/recording-visualizer/execution-details.component.ts
+++ b/devtools/projects/ng-devtools/src/lib/devtools-tabs/profiler/timeline/recording-visualizer/execution-details.component.ts
@ -14,7 +14,6 @@ import {SelectedDirective} from './timeline-visualizer.component';
  selector: 'ng-execution-details',
  templateUrl: './execution-details.component.html',
  styleUrls: ['./execution-details.component.scss'],
-  standalone: true,
  changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class ExecutionDetailsComponent {
--- a/devtools/projects/ng-devtools/src/lib/devtools-tabs/profiler/timeline/recording-visualizer/flamegraph-visualizer.component.ts
+++ b/devtools/projects/ng-devtools/src/lib/devtools-tabs/profiler/timeline/recording-visualizer/flamegraph-visualizer.component.ts
@ -25,7 +25,6 @@ import {NgxFlamegraphModule} from 'ngx-flamegraph';
  selector: 'ng-flamegraph-visualizer',
  templateUrl: './flamegraph-visualizer.component.html',
  styleUrls: ['./flamegraph-visualizer.component.scss'],
-  standalone: true,
  imports: [NgxFlamegraphModule],
  changeDetection: ChangeDetectionStrategy.OnPush,
 })
--- a/devtools/projects/ng-devtools/src/lib/devtools-tabs/profiler/timeline/recording-visualizer/timeline-visualizer.component.ts
+++ b/devtools/projects/ng-devtools/src/lib/devtools-tabs/profiler/timeline/recording-visualizer/timeline-visualizer.component.ts
@ -51,7 +51,6 @@ interface SelectedNode {
  selector: 'ng-timeline-visualizer',
  templateUrl: './timeline-visualizer.component.html',
  styleUrls: ['./timeline-visualizer.component.scss'],
-  standalone: true,
  imports: [
    SplitComponent,
    SplitAreaDirective,
--- a/devtools/projects/ng-devtools/src/lib/devtools-tabs/profiler/timeline/recording-visualizer/tree-map-visualizer.component.ts
+++ b/devtools/projects/ng-devtools/src/lib/devtools-tabs/profiler/timeline/recording-visualizer/tree-map-visualizer.component.ts
@ -30,7 +30,6 @@ import {TreeMapFormatter, TreeMapNode} from '../record-formatter/tree-map-format
  selector: 'ng-tree-map-visualizer',
  templateUrl: './tree-map-visualizer.component.html',
  styleUrls: ['./tree-map-visualizer.component.scss'],
-  standalone: true,
  changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class TreeMapVisualizerComponent implements OnDestroy {
--- a/devtools/projects/ng-devtools/src/lib/devtools-tabs/profiler/timeline/timeline-controls.component.ts
+++ b/devtools/projects/ng-devtools/src/lib/devtools-tabs/profiler/timeline/timeline-controls.component.ts
@ -22,7 +22,6 @@ import {DecimalPipe} from '@angular/common';
  selector: 'ng-timeline-controls',
  templateUrl: './timeline-controls.component.html',
  styleUrls: ['./timeline-controls.component.scss'],
-  standalone: true,
  imports: [
    MatFormField,
    MatLabel,
--- a/devtools/projects/ng-devtools/src/lib/devtools-tabs/profiler/timeline/timeline.component.ts
+++ b/devtools/projects/ng-devtools/src/lib/devtools-tabs/profiler/timeline/timeline.component.ts
@ -26,7 +26,6 @@ const MAX_HEIGHT = 50;
  selector: 'ng-recording-timeline',
  templateUrl: './timeline.component.html',
  styleUrls: ['./timeline.component.scss'],
-  standalone: true,
  imports: [
    RecordingModalComponent,
    TimelineControlsComponent,
--- a/devtools/projects/ng-devtools/src/lib/devtools-tabs/router-tree/router-tree.component.ts
+++ b/devtools/projects/ng-devtools/src/lib/devtools-tabs/router-tree/router-tree.component.ts
@ -22,7 +22,6 @@ import {Events, MessageBus, Route} from 'protocol';
  selector: 'ng-router-tree',
  templateUrl: './router-tree.component.html',
  styleUrls: ['./router-tree.component.scss'],
-  standalone: true,
 })
 export class RouterTreeComponent {
  private svgContainer = viewChild.required<ElementRef>('svgContainer');
--- a/devtools/projects/ng-devtools/src/lib/devtools.component.ts
+++ b/devtools/projects/ng-devtools/src/lib/devtools.component.ts
@ -60,7 +60,6 @@ const LAST_SUPPORTED_VERSION = 9;
      transition(':leave', [style({opacity: 1}), animate('200ms', style({opacity: 0}))]),
    ]),
  ],
-  standalone: true,
  imports: [DevToolsTabsComponent, MatTooltip, MatProgressSpinnerModule, MatTooltipModule],
 })
 export class DevToolsComponent implements OnInit, OnDestroy {
--- a/devtools/projects/ng-devtools/src/lib/devtools_spec.ts
+++ b/devtools/projects/ng-devtools/src/lib/devtools_spec.ts
@ -6,7 +6,7 @@
 * found in the LICENSE file at https://angular.dev/license
 */

-import {Component, signal} from '@angular/core';
+import {Component} from '@angular/core';
 import {ComponentFixture, TestBed} from '@angular/core/testing';
 import {FrameManager} from './frame_manager';
 import {DevToolsComponent} from './devtools.component';
@ -16,7 +16,6 @@ import {MessageBus} from 'protocol';
@Component({
  selector: 'ng-devtools-tabs',
  template: '',
-  standalone: true,
 })
 export class MockNgDevToolsTabs {}

--- a/devtools/projects/ng-devtools/src/lib/vendor/angular-split/lib/component/split.component.ts
+++ b/devtools/projects/ng-devtools/src/lib/vendor/angular-split/lib/component/split.component.ts
@ -92,7 +92,6 @@ import {
      <div class="as-split-gutter-icon"></div>
    </div>
    } }`,
-  standalone: true,
 })
 export class SplitComponent implements AfterViewInit, OnDestroy {
  private _direction: 'horizontal' | 'vertical' = 'horizontal';
--- a/devtools/projects/ng-devtools/src/lib/vendor/angular-split/lib/component/splitArea.directive.ts
+++ b/devtools/projects/ng-devtools/src/lib/vendor/angular-split/lib/component/splitArea.directive.ts
@ -9,7 +9,6 @@ import {getInputBoolean, getInputPositiveNumber} from './utils';
@Directive({
  selector: 'as-split-area, [as-split-area]',
  exportAs: 'asSplitArea',
-  standalone: true,
 })
 export class SplitAreaDirective implements OnInit, OnDestroy {
  private _order: number | null = null;
--- a/devtools/projects/shell-browser/src/app/app.component.ts
+++ b/devtools/projects/shell-browser/src/app/app.component.ts
@ -14,7 +14,6 @@ import {Events, MessageBus} from 'protocol';
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.scss'],
-  standalone: true,
  imports: [DevToolsComponent],
 })
 export class AppComponent implements OnInit {
--- a/devtools/src/app/app.component.ts
+++ b/devtools/src/app/app.component.ts
@ -13,7 +13,6 @@ import {Router, RouterOutlet} from '@angular/router';
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.scss'],
-  standalone: true,
  imports: [RouterOutlet],
 })
 export class AppComponent {
--- a/devtools/src/app/demo-app/demo-app.component.ts
+++ b/devtools/src/app/demo-app/demo-app.component.ts
@ -28,7 +28,6 @@ import {RouterOutlet} from '@angular/router';
  templateUrl: './demo-app.component.html',
  styleUrls: ['./demo-app.component.scss'],
  encapsulation: ViewEncapsulation.None,
-  standalone: true,
  schemas: [CUSTOM_ELEMENTS_SCHEMA],
  imports: [HeavyComponent, SamplePropertiesComponent, RouterOutlet],
 })
--- a/devtools/src/app/demo-app/heavy.component.ts
+++ b/devtools/src/app/demo-app/heavy.component.ts
@ -19,7 +19,6 @@ const fib = (n: number): number => {
  selector: 'app-heavy',
  templateUrl: './heavy.component.html',
  styleUrls: ['./heavy.component.scss'],
-  standalone: true,
 })
 export class HeavyComponent {
  readonly foo = input();
--- a/devtools/src/app/demo-app/sample-properties.component.ts
+++ b/devtools/src/app/demo-app/sample-properties.component.ts
@ -15,7 +15,6 @@ import {SampleService} from './sample.service';
  selector: 'app-sample-properties',
  template: '',
  styles: [''],
-  standalone: true,
 })
 export class SamplePropertiesComponent {
  readonly elementRef = viewChild<ElementRef>('elementReference');
--- a/devtools/src/app/demo-app/todo/about/about.component.ts
+++ b/devtools/src/app/demo-app/todo/about/about.component.ts
@ -17,7 +17,6 @@ import {RouterLink} from '@angular/router';
    <a [routerLink]="">Home</a>
    <a [routerLink]="">Home</a>
  `,
-  standalone: true,
  imports: [RouterLink],
 })
 export class AboutComponent {}
--- a/devtools/src/app/demo-app/todo/dialog.component.ts
+++ b/devtools/src/app/demo-app/todo/dialog.component.ts
@ -27,7 +27,6 @@ export interface DialogData {
@Component({
  selector: 'app-dialog',
  templateUrl: 'dialog.component.html',
-  standalone: true,
  imports: [
    MatDialogTitle,
    MatDialogContent,
--- a/devtools/src/app/demo-app/todo/home/sample.pipe.ts
+++ b/devtools/src/app/demo-app/todo/home/sample.pipe.ts
@ -11,7 +11,6 @@ import {OnDestroy, Pipe, PipeTransform} from '@angular/core';
@Pipe({
  name: 'sample',
  pure: false,
-  standalone: true,
 })
 export class SamplePipe implements PipeTransform, OnDestroy {
  transform(val: unknown) {
--- a/devtools/src/app/demo-app/todo/home/todo.component.ts
+++ b/devtools/src/app/demo-app/todo/home/todo.component.ts
@ -16,7 +16,6 @@ import {TooltipDirective} from './tooltip.directive';
  selector: 'app-todo',
  changeDetection: ChangeDetectionStrategy.OnPush,
  styleUrls: ['./todo.component.scss'],
-  standalone: true,
  imports: [TooltipDirective],
 })
 export class TodoComponent {
--- a/devtools/src/app/demo-app/todo/home/todos.component.ts
+++ b/devtools/src/app/demo-app/todo/home/todos.component.ts
@ -25,7 +25,6 @@ const fib = (n: number): number => {
@Component({
  templateUrl: 'todos.component.html',
  selector: 'app-todos',
-  standalone: true,
  imports: [RouterLink, TodoComponent, TooltipDirective, SamplePipe, TodosFilter],
 })
 export class TodosComponent implements OnInit, OnDestroy {
--- a/devtools/src/app/demo-app/todo/home/todos.pipe.ts
+++ b/devtools/src/app/demo-app/todo/home/todos.pipe.ts
@ -19,7 +19,6 @@ export const enum TodoFilter {
@Pipe({
  pure: false,
  name: 'todosFilter',
-  standalone: true,
 })
 export class TodosFilter implements PipeTransform {
  transform(todos: Todo[], filter: TodoFilter): Todo[] {
--- a/devtools/src/app/demo-app/todo/home/tooltip.directive.ts
+++ b/devtools/src/app/demo-app/todo/home/tooltip.directive.ts
@ -10,7 +10,6 @@ import {Directive} from '@angular/core';

@Directive({
  selector: '[appTooltip]',
-  standalone: true,
  host: {
    '(click)': 'handleClick()',
  },
--- a/devtools/src/app/demo-app/zippy.component.ts
+++ b/devtools/src/app/demo-app/zippy.component.ts
@ -12,7 +12,6 @@ import {Component, input} from '@angular/core';
  selector: 'app-zippy',
  templateUrl: './zippy.component.html',
  styleUrls: ['./zippy.component.scss'],
-  standalone: true,
 })
 export class ZippyComponent {
  readonly title = input<string>('title');
--- a/devtools/src/app/devtools-app/devtools-app.component.ts
+++ b/devtools/src/app/devtools-app/devtools-app.component.ts
@ -14,7 +14,6 @@ import {DevToolsComponent} from 'ng-devtools';
@Component({
  templateUrl: './devtools-app.component.html',
  styleUrls: ['./devtools-app.component.scss'],
-  standalone: true,
  imports: [DevToolsComponent],
 })
 export class AppDevToolsComponent {