refactor(popover-edit): remove circular reference (#19679)

Reworks the popover edit module in order to avoid circular references.

Author: crisbeto

goldens/ts-circular-deps.json

@@ -3,10 +3,6 @@
     "src/cdk-experimental/dialog/dialog-config.ts",
     "src/cdk-experimental/dialog/dialog-container.ts"
   ],
-  [
-    "src/cdk-experimental/popover-edit/edit-event-dispatcher.ts",
-    "src/cdk-experimental/popover-edit/edit-ref.ts"
-  ],
   [
     "src/cdk/drag-drop/directives/drag.ts",
     "src/cdk/drag-drop/directives/drop-list.ts"

src/cdk-experimental/popover-edit/edit-event-dispatcher.ts

@@ -22,7 +22,6 @@ import {
 
 import {CELL_SELECTOR, ROW_SELECTOR} from './constants';
 import {closest} from './polyfill';
-import {EditRef} from './edit-ref';
 
 /** The delay applied to mouse events before hiding or showing hover content. */
 const MOUSE_EVENT_DELAY_MS = 40;
@@ -42,11 +41,15 @@ export const enum HoverContentState {
   ON,
 }
 
+// Note: this class is generic, rather than referencing EditRef directly, in order to avoid
+// circular imports. If we were to reference it here, importing the registry into the
+// class that is registering itself will introduce a circular import.
+
 /**
  * Service for sharing delegated events and state for triggering table edits.
  */
 @Injectable()
-export class EditEventDispatcher {
+export class EditEventDispatcher<R> {
   /** A subject that indicates which table cell is currently editing (unless it is disabled). */
   readonly editing = new Subject<Element|null>();
 
@@ -70,10 +73,10 @@ export class EditEventDispatcher {
   readonly disabledCells = new WeakMap<Element, boolean>();
 
   /** The EditRef for the currently active edit lens (if any). */
-  get editRef(): EditRef<any>|null {
+  get editRef(): R|null {
     return this._editRef;
   }
-  private _editRef: EditRef<any>|null = null;
+  private _editRef: R|null = null;
 
   // Optimization: Precompute common pipeable operators used per row/cell.
   private readonly _distinctUntilChanged =
@@ -181,12 +184,12 @@ export class EditEventDispatcher {
   }
 
   /** Sets the currently active EditRef. */
-  setActiveEditRef(ref: EditRef<any>) {
+  setActiveEditRef(ref: R) {
     this._editRef = ref;
   }
 
   /** Unsets the currently active EditRef, if the specified editRef is active. */
-  unsetActiveEditRef(ref: EditRef<any>) {
+  unsetActiveEditRef(ref: R) {
     if (this._editRef !== ref) {
       return;
     }

src/cdk-experimental/popover-edit/edit-ref.ts

@@ -32,7 +32,7 @@ export class EditRef<FormValue> implements OnDestroy {
 
   constructor(
       @Self() private readonly _form: ControlContainer,
-      private readonly _editEventDispatcher: EditEventDispatcher,
+      private readonly _editEventDispatcher: EditEventDispatcher<EditRef<FormValue>>,
       private readonly _ngZone: NgZone) {
     this._editEventDispatcher.setActiveEditRef(this);
   }

src/cdk-experimental/popover-edit/edit-services.ts

@@ -15,6 +15,7 @@ import {ScrollDispatcher, ViewportRuler} from '@angular/cdk/scrolling';
 import {EditEventDispatcher} from './edit-event-dispatcher';
 import {FocusDispatcher} from './focus-dispatcher';
 import {PopoverEditPositionStrategyFactory} from './popover-edit-position-strategy-factory';
+import {EditRef} from './edit-ref';
 
 /**
  * Optimization
@@ -26,7 +27,8 @@ import {PopoverEditPositionStrategyFactory} from './popover-edit-position-strate
 export class EditServices {
   constructor(
       readonly directionality: Directionality,
-      readonly editEventDispatcher: EditEventDispatcher, readonly focusDispatcher: FocusDispatcher,
+      readonly editEventDispatcher: EditEventDispatcher<EditRef<unknown>>,
+      readonly focusDispatcher: FocusDispatcher,
       readonly focusTrapFactory: FocusTrapFactory, readonly ngZone: NgZone,
       readonly overlay: Overlay, readonly positionFactory: PopoverEditPositionStrategyFactory,
       readonly scrollDispatcher: ScrollDispatcher, readonly viewportRuler: ViewportRuler) {}

src/cdk-experimental/popover-edit/table-directives.ts

@@ -41,6 +41,7 @@ import {
   FocusEscapeNotifierFactory
 } from './focus-escape-notifier';
 import {closest} from './polyfill';
+import {EditRef} from './edit-ref';
 
 /**
  * Describes the number of columns before and after the originating cell that the
@@ -69,7 +70,7 @@ export class CdkEditable implements AfterViewInit, OnDestroy {
 
   constructor(
       protected readonly elementRef: ElementRef,
-      protected readonly editEventDispatcher: EditEventDispatcher,
+      protected readonly editEventDispatcher: EditEventDispatcher<EditRef<unknown>>,
       protected readonly focusDispatcher: FocusDispatcher, protected readonly ngZone: NgZone) {}
 
   ngAfterViewInit(): void {
@@ -487,7 +488,7 @@ export class CdkRowHoverContent implements AfterViewInit, OnDestroy {
 export class CdkEditOpen {
   constructor(
       protected readonly elementRef: ElementRef<HTMLElement>,
-      protected readonly editEventDispatcher: EditEventDispatcher) {
+      protected readonly editEventDispatcher: EditEventDispatcher<EditRef<unknown>>) {
 
     const nativeElement = elementRef.nativeElement;