refactor(cdk/menu): use ID generator

Switches to using the ID generator service to create unique IDs.

Author: crisbeto

src/cdk/menu/menu-base.ts

@@ -6,7 +6,7 @@
  * found in the LICENSE file at https://angular.dev/license
  */
 
-import {FocusKeyManager, FocusOrigin} from '@angular/cdk/a11y';
+import {_IdGenerator, FocusKeyManager, FocusOrigin} from '@angular/cdk/a11y';
 import {Directionality} from '@angular/cdk/bidi';
 import {
   AfterContentInit,
@@ -30,9 +30,6 @@ import {CdkMenuItem} from './menu-item';
 import {MENU_STACK, MenuStack, MenuStackItem} from './menu-stack';
 import {PointerFocusTracker} from './pointer-focus-tracker';
 
-/** Counter used to create unique IDs for menus. */
-let nextId = 0;
-
 /**
  * Abstract directive that implements shared logic common to all menus.
  * This class can be extended to create custom menu types.
@@ -70,7 +67,7 @@ export abstract class CdkMenuBase
   protected readonly dir = inject(Directionality, {optional: true});
 
   /** The id of the menu's host element. */
-  @Input() id = `cdk-menu-${nextId++}`;
+  @Input() id: string = inject(_IdGenerator).getId('cdk-menu-');
 
   /** All child MenuItem elements nested in this Menu. */
   @ContentChildren(CdkMenuItem, {descendants: true})

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

@@ -6,14 +6,12 @@
  * found in the LICENSE file at https://angular.dev/license
  */
 
-import {UniqueSelectionDispatcher} from '@angular/cdk/collections';
 import {Directive, inject, OnDestroy} from '@angular/core';
+import {UniqueSelectionDispatcher} from '@angular/cdk/collections';
+import {_IdGenerator} from '@angular/cdk/a11y';
 import {CdkMenuItemSelectable} from './menu-item-selectable';
 import {CdkMenuItem} from './menu-item';
 
-/** Counter used to set a unique id and name for a selectable item */
-let nextId = 0;
-
 /**
  * A directive providing behavior for the "menuitemradio" ARIA role, which behaves similarly to
  * a conventional radio-button. Any sibling `CdkMenuItemRadio` instances within the same `CdkMenu`
@@ -36,7 +34,7 @@ export class CdkMenuItemRadio extends CdkMenuItemSelectable implements OnDestroy
   private readonly _selectionDispatcher = inject(UniqueSelectionDispatcher);
 
   /** An ID to identify this radio item to the `UniqueSelectionDispatcher`. */
-  private _id = `${nextId++}`;
+  private _id = inject(_IdGenerator).getId('cdk-menu-item-radio-');
 
   /** Function to unregister the selection dispatcher */
   private _removeDispatcherListener: () => void;

src/cdk/menu/menu-stack.ts

@@ -6,7 +6,8 @@
  * found in the LICENSE file at https://angular.dev/license
  */
 
-import {Inject, Injectable, InjectionToken, Optional, SkipSelf} from '@angular/core';
+import {inject, Inject, Injectable, InjectionToken, Optional, SkipSelf} from '@angular/core';
+import {_IdGenerator} from '@angular/cdk/a11y';
 import {Observable, Subject} from 'rxjs';
 import {debounceTime, distinctUntilChanged, startWith} from 'rxjs/operators';
 
@@ -58,9 +59,6 @@ export interface MenuStackCloseEvent {
   focusParentTrigger?: boolean;
 }
 
-/** The next available menu stack ID. */
-let nextId = 0;
-
 /**
  * MenuStack allows subscribers to listen for close events (when a MenuStackItem is popped off
  * of the stack) in order to perform closing actions. Upon the MenuStack being empty it emits
@@ -70,7 +68,7 @@ let nextId = 0;
 @Injectable()
 export class MenuStack {
   /** The ID of this menu stack. */
-  readonly id = `${nextId++}`;
+  readonly id = inject(_IdGenerator).getId('cdk-menu-stack-');
 
   /** All MenuStackItems tracked by this MenuStack. */
   private readonly _elements: MenuStackItem[] = [];