diff --git a/src/cdk-experimental/combobox/combobox-module.ts b/src/cdk-experimental/combobox/combobox-module.ts
index b8ac8c7782bc..075c6770394b 100644
--- a/src/cdk-experimental/combobox/combobox-module.ts
+++ b/src/cdk-experimental/combobox/combobox-module.ts
@@ -9,10 +9,9 @@
 import {NgModule} from '@angular/core';
 import {OverlayModule} from '@angular/cdk/overlay';
 import {CdkCombobox} from './combobox';
-import {CdkComboboxPanel} from './combobox-panel';
 import {CdkComboboxPopup} from './combobox-popup';
 
-const EXPORTED_DECLARATIONS = [CdkCombobox, CdkComboboxPanel, CdkComboboxPopup];
+const EXPORTED_DECLARATIONS = [CdkCombobox, CdkComboboxPopup];
 @NgModule({
   imports: [OverlayModule],
   exports: EXPORTED_DECLARATIONS,
diff --git a/src/cdk-experimental/combobox/combobox-panel.ts b/src/cdk-experimental/combobox/combobox-panel.ts
deleted file mode 100644
index bb8b148e95a2..000000000000
--- a/src/cdk-experimental/combobox/combobox-panel.ts
+++ /dev/null
@@ -1,58 +0,0 @@
-/**
- * @license
- * Copyright Google LLC All Rights Reserved.
- *
- * Use of this source code is governed by an MIT-style license that can be
- * found in the LICENSE file at https://angular.io/license
- */
-
-export type AriaHasPopupValue = 'false' | 'true' | 'menu' | 'listbox' | 'tree' | 'grid' | 'dialog';
-
-import {Directive, TemplateRef} from '@angular/core';
-import {Subject} from 'rxjs';
-
-@Directive({
-  host: {
-    'class': 'cdk-combobox-panel',
-  },
-  selector: 'ng-template[cdkComboboxPanel]',
-  exportAs: 'cdkComboboxPanel',
-})
-export class CdkComboboxPanel<T = unknown> {
-  valueUpdated: Subject<T | T[]> = new Subject<T | T[]>();
-  contentIdUpdated: Subject<string> = new Subject<string>();
-  contentTypeUpdated: Subject<AriaHasPopupValue> = new Subject<AriaHasPopupValue>();
-
-  contentId: string = '';
-  contentType: AriaHasPopupValue;
-
-  constructor(readonly _templateRef: TemplateRef<unknown>) {}
-
-  /** Tells the parent combobox to close the panel and sends back the content value. */
-  closePanel(data?: T | T[]) {
-    this.valueUpdated.next(data || []);
-  }
-
-  // TODO: instead of using a focus function, potentially use cdk/a11y focus trapping
-  focusContent() {
-    // TODO: Use an injected document here
-    document.getElementById(this.contentId)?.focus();
-  }
-
-  /** Registers the content's id and the content type with the panel. */
-  _registerContent(contentId: string, contentType: AriaHasPopupValue) {
-    // If content has already been registered, no further contentIds are registered.
-    if (this.contentType && this.contentType !== contentType) {
-      return;
-    }
-
-    this.contentId = contentId;
-    if (contentType !== 'listbox' && contentType !== 'dialog') {
-      throw Error('CdkComboboxPanel currently only supports listbox or dialog content.');
-    }
-    this.contentType = contentType;
-
-    this.contentIdUpdated.next(this.contentId);
-    this.contentTypeUpdated.next(this.contentType);
-  }
-}
diff --git a/src/cdk-experimental/combobox/combobox-popup.ts b/src/cdk-experimental/combobox/combobox-popup.ts
index c00e609cb406..b1bd515006a2 100644
--- a/src/cdk-experimental/combobox/combobox-popup.ts
+++ b/src/cdk-experimental/combobox/combobox-popup.ts
@@ -6,18 +6,8 @@
  * found in the LICENSE file at https://angular.io/license
  */
 
-import {
-  Directive,
-  ElementRef,
-  Inject,
-  InjectionToken,
-  Input,
-  OnInit,
-  Optional,
-} from '@angular/core';
-import {AriaHasPopupValue, CdkComboboxPanel} from './combobox-panel';
-
-export const PANEL = new InjectionToken<CdkComboboxPanel>('CdkComboboxPanel');
+import {Directive, ElementRef, Inject, Input, OnInit} from '@angular/core';
+import {AriaHasPopupValue, CDK_COMBOBOX, CdkCombobox} from './combobox';
 
 let nextId = 0;
 
@@ -53,11 +43,9 @@ export class CdkComboboxPopup<T = unknown> implements OnInit {
 
   @Input() id = `cdk-combobox-popup-${nextId++}`;
 
-  @Input('parentPanel') private readonly _explicitPanel: CdkComboboxPanel;
-
   constructor(
     private readonly _elementRef: ElementRef<HTMLElement>,
-    @Optional() @Inject(PANEL) readonly _parentPanel?: CdkComboboxPanel<T>,
+    @Inject(CDK_COMBOBOX) private readonly _combobox: CdkCombobox,
   ) {}
 
   ngOnInit() {
@@ -65,11 +53,7 @@ export class CdkComboboxPopup<T = unknown> implements OnInit {
   }
 
   registerWithPanel(): void {
-    if (this._parentPanel === null || this._parentPanel === undefined) {
-      this._explicitPanel._registerContent(this.id, this._role);
-    } else {
-      this._parentPanel._registerContent(this.id, this._role);
-    }
+    this._combobox._registerContent(this.id, this._role);
   }
 
   focusFirstElement() {
diff --git a/src/cdk-experimental/combobox/combobox.spec.ts b/src/cdk-experimental/combobox/combobox.spec.ts
index 277ad6521650..32a705e7c9f6 100644
--- a/src/cdk-experimental/combobox/combobox.spec.ts
+++ b/src/cdk-experimental/combobox/combobox.spec.ts
@@ -1,25 +1,11 @@
-import {
-  Component,
-  DebugElement,
-  Directive,
-  ElementRef,
-  Inject,
-  InjectionToken,
-  Input,
-  OnInit,
-  Optional,
-  ViewChild,
-} from '@angular/core';
+import {Component, DebugElement, ElementRef, ViewChild} from '@angular/core';
 import {ComponentFixture, TestBed, waitForAsync} from '@angular/core/testing';
 import {By} from '@angular/platform-browser';
 import {CdkComboboxModule} from './combobox-module';
 import {CdkCombobox} from './combobox';
 import {dispatchKeyboardEvent, dispatchMouseEvent} from '../../cdk/testing/private';
-import {
-  AriaHasPopupValue,
-  CdkComboboxPanel,
-} from '@angular/cdk-experimental/combobox/combobox-panel';
 import {DOWN_ARROW, ESCAPE} from '@angular/cdk/keycodes';
+import {CdkComboboxPopup} from '@angular/cdk-experimental/combobox/combobox-popup';
 
 describe('Combobox', () => {
   describe('with a basic toggle trigger', () => {
@@ -27,11 +13,11 @@ describe('Combobox', () => {
     let testComponent: ComboboxToggle;
 
     let combobox: DebugElement;
-    let comboboxInstance: CdkCombobox<unknown>;
+    let comboboxInstance: CdkCombobox;
     let comboboxElement: HTMLElement;
 
     let dialog: DebugElement;
-    let dialogInstance: FakeDialogContent<unknown>;
+    let dialogInstance: CdkComboboxPopup;
     let dialogElement: HTMLElement;
 
     let applyButton: DebugElement;
@@ -41,7 +27,7 @@ describe('Combobox', () => {
       waitForAsync(() => {
         TestBed.configureTestingModule({
           imports: [CdkComboboxModule],
-          declarations: [ComboboxToggle, FakeDialogContent],
+          declarations: [ComboboxToggle],
         }).compileComponents();
       }),
     );
@@ -53,7 +39,7 @@ describe('Combobox', () => {
       testComponent = fixture.debugElement.componentInstance;
 
       combobox = fixture.debugElement.query(By.directive(CdkCombobox));
-      comboboxInstance = combobox.injector.get<CdkCombobox<unknown>>(CdkCombobox);
+      comboboxInstance = combobox.injector.get<CdkCombobox>(CdkCombobox);
       comboboxElement = combobox.nativeElement;
     });
 
@@ -77,10 +63,10 @@ describe('Combobox', () => {
       dispatchMouseEvent(comboboxElement, 'click');
       fixture.detectChanges();
 
-      dialog = fixture.debugElement.query(By.directive(FakeDialogContent));
-      dialogInstance = dialog.injector.get<FakeDialogContent<unknown>>(FakeDialogContent);
+      dialog = fixture.debugElement.query(By.directive(CdkComboboxPopup));
+      dialogInstance = dialog.injector.get<CdkComboboxPopup>(CdkComboboxPopup);
 
-      expect(comboboxElement.getAttribute('aria-owns')).toBe(dialogInstance.dialogId);
+      expect(comboboxElement.getAttribute('aria-owns')).toBe(dialogInstance.id);
       expect(comboboxElement.getAttribute('aria-haspopup')).toBe('dialog');
     });
 
@@ -110,7 +96,7 @@ describe('Combobox', () => {
 
       expect(comboboxInstance.isOpen()).toBeTrue();
 
-      dialog = fixture.debugElement.query(By.directive(FakeDialogContent));
+      dialog = fixture.debugElement.query(By.directive(CdkComboboxPopup));
       dialogElement = dialog.nativeElement;
 
       expect(document.activeElement).toBe(dialogElement);
@@ -201,13 +187,13 @@ describe('Combobox', () => {
     let testComponent: ComboboxToggle;
 
     let combobox: DebugElement;
-    let comboboxInstance: CdkCombobox<unknown>;
+    let comboboxInstance: CdkCombobox;
 
     beforeEach(
       waitForAsync(() => {
         TestBed.configureTestingModule({
           imports: [CdkComboboxModule],
-          declarations: [ComboboxToggle, FakeDialogContent],
+          declarations: [ComboboxToggle],
         }).compileComponents();
       }),
     );
@@ -219,7 +205,7 @@ describe('Combobox', () => {
       testComponent = fixture.debugElement.componentInstance;
 
       combobox = fixture.debugElement.query(By.directive(CdkCombobox));
-      comboboxInstance = combobox.injector.get<CdkCombobox<unknown>>(CdkCombobox);
+      comboboxInstance = combobox.injector.get<CdkCombobox>(CdkCombobox);
     });
 
     it('should coerce single string into open action', () => {
@@ -273,14 +259,14 @@ describe('Combobox', () => {
     let testComponent: ComboboxToggle;
 
     let combobox: DebugElement;
-    let comboboxInstance: CdkCombobox<unknown>;
+    let comboboxInstance: CdkCombobox;
     let comboboxElement: HTMLElement;
 
     beforeEach(
       waitForAsync(() => {
         TestBed.configureTestingModule({
           imports: [CdkComboboxModule],
-          declarations: [ComboboxToggle, FakeDialogContent],
+          declarations: [ComboboxToggle],
         }).compileComponents();
       }),
     );
@@ -292,7 +278,7 @@ describe('Combobox', () => {
       testComponent = fixture.debugElement.componentInstance;
 
       combobox = fixture.debugElement.query(By.directive(CdkCombobox));
-      comboboxInstance = combobox.injector.get<CdkCombobox<unknown>>(CdkCombobox);
+      comboboxInstance = combobox.injector.get<CdkCombobox>(CdkCombobox);
       comboboxElement = combobox.nativeElement;
     });
 
@@ -392,17 +378,17 @@ describe('Combobox', () => {
 
 @Component({
   template: `
-  <button cdkCombobox #toggleCombobox class="example-combobox"
+  <button cdkCombobox #toggleCombobox="cdkCombobox" class="example-combobox"
           [cdkComboboxTriggerFor]="panel"
           [openActions]="actions">
     No Value
   </button>
   <div id="other-content"></div>
 
-  <ng-template cdkComboboxPanel #panel="cdkComboboxPanel">
-    <div dialogContent #dialog="dialogContent" [parentPanel]="panel">
+  <ng-template #panel>
+    <div #dialog cdkComboboxPopup>
       <input #input>
-      <button id="applyButton" (click)="panel.closePanel(input.value)">Apply</button>
+      <button id="applyButton" (click)="toggleCombobox.updateAndClose(input.value)">Apply</button>
     </div>
   </ng-template>`,
 })
@@ -411,37 +397,3 @@ class ComboboxToggle {
 
   actions: string = 'click';
 }
-
-export const PANEL = new InjectionToken<CdkComboboxPanel>('CdkComboboxPanel');
-
-let id = 0;
-
-@Directive({
-  selector: '[dialogContent]',
-  exportAs: 'dialogContent',
-  host: {
-    '[attr.role]': 'role',
-    '[id]': 'dialogId',
-    'tabIndex': '-1',
-  },
-})
-export class FakeDialogContent<V> implements OnInit {
-  dialogId = `dialog-${id++}`;
-  role = 'dialog';
-
-  @Input('parentPanel') private readonly _explicitPanel: CdkComboboxPanel;
-
-  constructor(@Optional() @Inject(PANEL) readonly _parentPanel?: CdkComboboxPanel<V>) {}
-
-  ngOnInit() {
-    this.registerWithPanel();
-  }
-
-  registerWithPanel(): void {
-    if (this._parentPanel === null || this._parentPanel === undefined) {
-      this._explicitPanel._registerContent(this.dialogId, this.role as AriaHasPopupValue);
-    } else {
-      this._parentPanel._registerContent(this.dialogId, this.role as AriaHasPopupValue);
-    }
-  }
-}
diff --git a/src/cdk-experimental/combobox/combobox.ts b/src/cdk-experimental/combobox/combobox.ts
index 049576ea199b..2b22d860559d 100644
--- a/src/cdk-experimental/combobox/combobox.ts
+++ b/src/cdk-experimental/combobox/combobox.ts
@@ -5,22 +5,21 @@
  * Use of this source code is governed by an MIT-style license that can be
  * found in the LICENSE file at https://angular.io/license
  */
-
-export type OpenAction = 'focus' | 'click' | 'downKey' | 'toggle';
-export type OpenActionInput = OpenAction | OpenAction[] | string | null | undefined;
-
+import {DOCUMENT} from '@angular/common';
 import {
-  AfterContentInit,
   Directive,
   ElementRef,
   EventEmitter,
+  Inject,
+  InjectionToken,
+  Injector,
   Input,
   OnDestroy,
   Optional,
   Output,
+  TemplateRef,
   ViewContainerRef,
 } from '@angular/core';
-import {CdkComboboxPanel, AriaHasPopupValue} from './combobox-panel';
 import {TemplatePortal} from '@angular/cdk/portal';
 import {
   ConnectedPosition,
@@ -30,12 +29,18 @@ import {
   OverlayRef,
 } from '@angular/cdk/overlay';
 import {Directionality} from '@angular/cdk/bidi';
-import {BooleanInput, coerceBooleanProperty, coerceArray} from '@angular/cdk/coercion';
+import {BooleanInput, coerceArray, coerceBooleanProperty} from '@angular/cdk/coercion';
 import {_getEventTarget} from '@angular/cdk/platform';
 import {DOWN_ARROW, ENTER, ESCAPE, TAB} from '@angular/cdk/keycodes';
 
+export type AriaHasPopupValue = 'false' | 'true' | 'menu' | 'listbox' | 'tree' | 'grid' | 'dialog';
+export type OpenAction = 'focus' | 'click' | 'downKey' | 'toggle';
+export type OpenActionInput = OpenAction | OpenAction[] | string | null | undefined;
+
 const allowedOpenActions = ['focus', 'click', 'downKey', 'toggle'];
 
+export const CDK_COMBOBOX = new InjectionToken<CdkCombobox>('CDK_COMBOBOX');
+
 @Directive({
   selector: '[cdkCombobox]',
   exportAs: 'cdkCombobox',
@@ -52,16 +57,11 @@ const allowedOpenActions = ['focus', 'click', 'downKey', 'toggle'];
     '[attr.aria-expanded]': 'isOpen()',
     '[attr.tabindex]': '_getTabIndex()',
   },
+  providers: [{provide: CDK_COMBOBOX, useExisting: CdkCombobox}],
 })
-export class CdkCombobox<T = unknown> implements OnDestroy, AfterContentInit {
+export class CdkCombobox<T = unknown> implements OnDestroy {
   @Input('cdkComboboxTriggerFor')
-  get panel(): CdkComboboxPanel<T> | undefined {
-    return this._panel;
-  }
-  set panel(panel: CdkComboboxPanel<T> | undefined) {
-    this._panel = panel;
-  }
-  private _panel: CdkComboboxPanel<T> | undefined;
+  _panelTemplateRef: TemplateRef<unknown>;
 
   @Input()
   value: T | T[];
@@ -101,7 +101,8 @@ export class CdkCombobox<T = unknown> implements OnDestroy, AfterContentInit {
   >();
 
   private _overlayRef: OverlayRef;
-  private _panelContent: TemplatePortal;
+  private _panelPortal: TemplatePortal;
+
   contentId: string = '';
   contentType: AriaHasPopupValue;
 
@@ -109,24 +110,11 @@ export class CdkCombobox<T = unknown> implements OnDestroy, AfterContentInit {
     private readonly _elementRef: ElementRef<HTMLElement>,
     private readonly _overlay: Overlay,
     protected readonly _viewContainerRef: ViewContainerRef,
+    private readonly _injector: Injector,
+    @Inject(DOCUMENT) private readonly _doc: any,
     @Optional() private readonly _directionality?: Directionality,
   ) {}
 
-  ngAfterContentInit() {
-    this._panel?.valueUpdated.subscribe(data => {
-      this._setComboboxValue(data);
-      this.close();
-    });
-
-    this._panel?.contentIdUpdated.subscribe(id => {
-      this.contentId = id;
-    });
-
-    this._panel?.contentTypeUpdated.subscribe(type => {
-      this.contentType = type;
-    });
-  }
-
   ngOnDestroy() {
     if (this._overlayRef) {
       this._overlayRef.dispose();
@@ -142,7 +130,8 @@ export class CdkCombobox<T = unknown> implements OnDestroy, AfterContentInit {
 
     if (keyCode === DOWN_ARROW) {
       if (this.isOpen()) {
-        this._panel?.focusContent();
+        // TODO: instead of using a focus function, potentially use cdk/a11y focus trapping
+        this._doc.getElementById(this.contentId)?.focus();
       } else if (this._openActions.indexOf('downKey') !== -1) {
         this.open();
       }
@@ -204,7 +193,8 @@ export class CdkCombobox<T = unknown> implements OnDestroy, AfterContentInit {
       this._overlayRef = this._overlayRef || this._overlay.create(this._getOverlayConfig());
       this._overlayRef.attach(this._getPanelContent());
       if (!this._isTextTrigger()) {
-        this._panel?.focusContent();
+        // TODO: instead of using a focus function, potentially use cdk/a11y focus trapping
+        this._doc.getElementById(this.contentId)?.focus();
       }
     }
   }
@@ -224,7 +214,7 @@ export class CdkCombobox<T = unknown> implements OnDestroy, AfterContentInit {
 
   /** Returns true if combobox has a child panel. */
   hasPanel(): boolean {
-    return !!this.panel;
+    return !!this._panelTemplateRef;
   }
 
   _getTabIndex(): string | null {
@@ -243,6 +233,11 @@ export class CdkCombobox<T = unknown> implements OnDestroy, AfterContentInit {
     }
   }
 
+  updateAndClose(value: T | T[]) {
+    this._setComboboxValue(value);
+    this.close();
+  }
+
   private _setTextContent(content: T | T[]) {
     const contentArray = coerceArray(content);
     this._elementRef.nativeElement.textContent = contentArray.join(' ');
@@ -278,13 +273,22 @@ export class CdkCombobox<T = unknown> implements OnDestroy, AfterContentInit {
     ];
   }
 
+  private _getPanelInjector() {
+    return this._injector;
+  }
+
   private _getPanelContent() {
-    const hasPanelChanged = this._panel?._templateRef !== this._panelContent?.templateRef;
-    if (this._panel && (!this._panel || hasPanelChanged)) {
-      this._panelContent = new TemplatePortal(this._panel._templateRef, this._viewContainerRef);
+    const hasPanelChanged = this._panelTemplateRef !== this._panelPortal?.templateRef;
+    if (this._panelTemplateRef && (!this._panelPortal || hasPanelChanged)) {
+      this._panelPortal = new TemplatePortal(
+        this._panelTemplateRef,
+        this._viewContainerRef,
+        undefined,
+        this._getPanelInjector(),
+      );
     }
 
-    return this._panelContent;
+    return this._panelPortal;
   }
 
   private _coerceOpenActionProperty(input: OpenActionInput): OpenAction[] {
@@ -297,4 +301,17 @@ export class CdkCombobox<T = unknown> implements OnDestroy, AfterContentInit {
     }
     return actions as OpenAction[];
   }
+
+  /** Registers the content's id and the content type with the panel. */
+  _registerContent(contentId: string, contentType: AriaHasPopupValue) {
+    if (
+      (typeof ngDevMode === 'undefined' || ngDevMode) &&
+      contentType !== 'listbox' &&
+      contentType !== 'dialog'
+    ) {
+      throw Error('CdkComboboxPanel currently only supports listbox or dialog content.');
+    }
+    this.contentId = contentId;
+    this.contentType = contentType;
+  }
 }
diff --git a/src/cdk-experimental/combobox/public-api.ts b/src/cdk-experimental/combobox/public-api.ts
index 07eadcfa2ec1..39f92a795d37 100644
--- a/src/cdk-experimental/combobox/public-api.ts
+++ b/src/cdk-experimental/combobox/public-api.ts
@@ -8,5 +8,4 @@
 
 export * from './combobox-module';
 export * from './combobox';
-export * from './combobox-panel';
 export * from './combobox-popup';
diff --git a/src/cdk-experimental/listbox/listbox.spec.ts b/src/cdk-experimental/listbox/listbox.spec.ts
index cc68637f35ec..19fa36bfdf00 100644
--- a/src/cdk-experimental/listbox/listbox.spec.ts
+++ b/src/cdk-experimental/listbox/listbox.spec.ts
@@ -1,7 +1,7 @@
-import {ComponentFixture, waitForAsync, TestBed, tick, fakeAsync} from '@angular/core/testing';
+import {ComponentFixture, fakeAsync, TestBed, tick, waitForAsync} from '@angular/core/testing';
 import {Component, DebugElement, ViewChild} from '@angular/core';
 import {By} from '@angular/platform-browser';
-import {CdkOption, CdkListboxModule, ListboxSelectionChangeEvent, CdkListbox} from './index';
+import {CdkListbox, CdkListboxModule, CdkOption, ListboxSelectionChangeEvent} from './index';
 import {
   createKeyboardEvent,
   dispatchKeyboardEvent,
@@ -9,7 +9,7 @@ import {
 } from '../../cdk/testing/private';
 import {A, DOWN_ARROW, END, HOME, SPACE} from '@angular/cdk/keycodes';
 import {FormControl, FormsModule, ReactiveFormsModule} from '@angular/forms';
-import {CdkCombobox, CdkComboboxModule, CdkComboboxPanel} from '@angular/cdk-experimental/combobox';
+import {CdkCombobox, CdkComboboxModule} from '@angular/cdk-experimental/combobox';
 
 describe('CdkOption and CdkListbox', () => {
   describe('selection state change', () => {
@@ -887,7 +887,7 @@ describe('CdkOption and CdkListbox', () => {
 
       listboxInstance.setActiveOption(optionInstances[1]);
       dispatchKeyboardEvent(listboxElement, 'keydown', SPACE);
-      testComponent.panel.closePanel(testComponent.listbox.getSelectedValues());
+      testComponent.combobox.updateAndClose(testComponent.listbox.getSelectedValues());
       fixture.detectChanges();
 
       expect(comboboxInstance.isOpen()).toBeFalse();
@@ -1003,9 +1003,8 @@ class ListboxControlValueAccessor {
       No Value
     </button>
 
-    <ng-template cdkComboboxPanel #panel="cdkComboboxPanel">
+    <ng-template #panel>
       <select cdkListbox
-              [parentPanel]="panel"
               [disabled]="isDisabled"
               [multiple]="isMultiselectable"
               (selectionChange)="onSelectionChange($event)">
@@ -1022,7 +1021,7 @@ class ListboxInsideCombobox {
   isDisabled: boolean = false;
   isMultiselectable: boolean = false;
   @ViewChild(CdkListbox) listbox: CdkListbox<string>;
-  @ViewChild('panel') panel: CdkComboboxPanel<string>;
+  @ViewChild(CdkCombobox) combobox: CdkCombobox;
 
   onSelectionChange(event: ListboxSelectionChangeEvent<string>) {
     this.changedOption = event.option;
diff --git a/src/cdk-experimental/listbox/listbox.ts b/src/cdk-experimental/listbox/listbox.ts
index 6f15c1ff67c5..cdbf1c445b0d 100644
--- a/src/cdk-experimental/listbox/listbox.ts
+++ b/src/cdk-experimental/listbox/listbox.ts
@@ -14,7 +14,6 @@ import {
   EventEmitter,
   forwardRef,
   Inject,
-  InjectionToken,
   Input,
   OnDestroy,
   OnInit,
@@ -23,26 +22,24 @@ import {
   QueryList,
 } from '@angular/core';
 import {ActiveDescendantKeyManager, Highlightable, ListKeyManagerOption} from '@angular/cdk/a11y';
-import {DOWN_ARROW, ENTER, SPACE, UP_ARROW, LEFT_ARROW, RIGHT_ARROW} from '@angular/cdk/keycodes';
-import {BooleanInput, coerceBooleanProperty, coerceArray} from '@angular/cdk/coercion';
+import {DOWN_ARROW, ENTER, LEFT_ARROW, RIGHT_ARROW, SPACE, UP_ARROW} from '@angular/cdk/keycodes';
+import {BooleanInput, coerceArray, coerceBooleanProperty} from '@angular/cdk/coercion';
 import {SelectionChange, SelectionModel} from '@angular/cdk/collections';
 import {defer, merge, Observable, Subject} from 'rxjs';
 import {startWith, switchMap, takeUntil} from 'rxjs/operators';
 import {ControlValueAccessor, NG_VALUE_ACCESSOR} from '@angular/forms';
-import {CdkComboboxPanel} from '@angular/cdk-experimental/combobox';
 import {Directionality} from '@angular/cdk/bidi';
+import {CDK_COMBOBOX, CdkCombobox} from '@angular/cdk-experimental/combobox';
 
 let nextId = 0;
 let listboxId = 0;
 
-export const CDK_LISTBOX_VALUE_ACCESSOR: any = {
+export const CDK_LISTBOX_VALUE_ACCESSOR = {
   provide: NG_VALUE_ACCESSOR,
   useExisting: forwardRef(() => CdkListbox),
   multi: true,
 };
 
-export const PANEL = new InjectionToken<CdkComboboxPanel>('CdkComboboxPanel');
-
 @Directive({
   selector: '[cdkOption]',
   exportAs: 'cdkOption',
@@ -100,6 +97,12 @@ export class CdkOption<T = unknown> implements ListKeyManagerOption, Highlightab
     this._value = value;
   }
 
+  /**
+   * The text used to locate this item during menu typeahead. If not specified,
+   * the `textContent` of the item will be used.
+   */
+  @Input() typeahead: string;
+
   @Output() readonly selectionChange = new EventEmitter<OptionSelectionChangeEvent<T>>();
 
   constructor(
@@ -170,23 +173,7 @@ export class CdkOption<T = unknown> implements ListKeyManagerOption, Highlightab
 
   /** Get the label for this element which is required by the FocusableOption interface. */
   getLabel() {
-    // we know that the current node is an element type
-    const clone = this._elementRef.nativeElement.cloneNode(true) as Element;
-    this._removeIcons(clone);
-
-    return clone.textContent?.trim() || '';
-  }
-
-  /** Remove any child from the given element which can be identified as an icon. */
-  private _removeIcons(element: Element) {
-    // TODO: make this a configurable function that can removed any desired type of node.
-    for (const icon of Array.from(element.querySelectorAll('mat-icon, .material-icons'))) {
-      icon.remove();
-    }
-  }
-
-  getElementRef() {
-    return this._elementRef;
+    return (this.typeahead ?? this._elementRef.nativeElement.textContent?.trim()) || '';
   }
 
   /** Sets the active property to true to enable the active css class. */
@@ -295,10 +282,8 @@ export class CdkListbox<T> implements AfterContentInit, OnDestroy, OnInit, Contr
 
   @Input() compareWith: (o1: T, o2: T) => boolean = (a1, a2) => a1 === a2;
 
-  @Input('parentPanel') private readonly _explicitPanel: CdkComboboxPanel;
-
   constructor(
-    @Optional() @Inject(PANEL) readonly _parentPanel?: CdkComboboxPanel<T>,
+    @Optional() @Inject(CDK_COMBOBOX) private readonly _combobox: CdkCombobox,
     @Optional() private readonly _dir?: Directionality,
   ) {}
 
@@ -309,7 +294,7 @@ export class CdkListbox<T> implements AfterContentInit, OnDestroy, OnInit, Contr
   ngAfterContentInit() {
     this._initKeyManager();
     this._initSelectionModel();
-    this._registerWithPanel();
+    this._combobox?._registerContent(this.id, 'listbox');
 
     this.optionSelectionChanges.subscribe(event => {
       this._emitChangeEvent(event.source);
@@ -325,11 +310,6 @@ export class CdkListbox<T> implements AfterContentInit, OnDestroy, OnInit, Contr
     this._destroyed.complete();
   }
 
-  private _registerWithPanel(): void {
-    const panel = this._parentPanel || this._explicitPanel;
-    panel?._registerContent(this.id, 'listbox');
-  }
-
   private _initKeyManager() {
     this._listKeyManager = new ActiveDescendantKeyManager(this._options)
       .withWrap()
@@ -410,11 +390,12 @@ export class CdkListbox<T> implements AfterContentInit, OnDestroy, OnInit, Contr
   }
 
   _updatePanelForSelection(option: CdkOption<T>) {
-    const panel = this._parentPanel || this._explicitPanel;
-    if (!this.multiple) {
-      option.selected ? panel?.closePanel(option.value) : panel?.closePanel();
-    } else {
-      panel?.closePanel(this.getSelectedValues());
+    if (this._combobox) {
+      if (!this.multiple) {
+        this._combobox.updateAndClose(option.selected ? option.value : []);
+      } else {
+        this._combobox.updateAndClose(this.getSelectedValues());
+      }
     }
   }
 
diff --git a/src/dev-app/cdk-experimental-combobox/cdk-combobox-demo-module.ts b/src/dev-app/cdk-experimental-combobox/cdk-combobox-demo-module.ts
index d163b2e7595d..e568312eae18 100644
--- a/src/dev-app/cdk-experimental-combobox/cdk-combobox-demo-module.ts
+++ b/src/dev-app/cdk-experimental-combobox/cdk-combobox-demo-module.ts
@@ -11,7 +11,6 @@ import {CommonModule} from '@angular/common';
 import {RouterModule} from '@angular/router';
 import {CdkComboboxModule} from '@angular/cdk-experimental/combobox';
 import {CdkComboboxDemo} from './cdk-combobox-demo';
-import {PanelContent} from './panel-content';
 
 @NgModule({
   imports: [
@@ -19,6 +18,6 @@ import {PanelContent} from './panel-content';
     CommonModule,
     RouterModule.forChild([{path: '', component: CdkComboboxDemo}]),
   ],
-  declarations: [CdkComboboxDemo, PanelContent],
+  declarations: [CdkComboboxDemo],
 })
 export class CdkComboboxDemoModule {}
diff --git a/src/dev-app/cdk-experimental-combobox/cdk-combobox-demo.html b/src/dev-app/cdk-experimental-combobox/cdk-combobox-demo.html
index 25addde9d206..70d7a85c7fd3 100644
--- a/src/dev-app/cdk-experimental-combobox/cdk-combobox-demo.html
+++ b/src/dev-app/cdk-experimental-combobox/cdk-combobox-demo.html
@@ -1,12 +1,12 @@
 Toggle Combobox!
 <br>
-<button cdkCombobox class="example-combobox" [cdkComboboxTriggerFor]="panel" [openActions]="'toggle'">
+<button cdkCombobox #trigger="cdkCombobox" class="example-combobox" [cdkComboboxTriggerFor]="panel" [openActions]="'toggle'">
     No Value
 </button>
 
-<ng-template cdkComboboxPanel #panel="cdkComboboxPanel">
-    <div cdkComboboxPopup [parentPanel]="panel" [firstFocus]="input">
+<ng-template #panel>
+    <div cdkComboboxPopup [firstFocus]="input">
         <input #input>
-        <button (click)="panel.closePanel(input.value)">Apply</button>
+        <button (click)="trigger.updateAndClose(input.value)">Apply</button>
     </div>
 </ng-template>
diff --git a/src/dev-app/cdk-experimental-combobox/panel-content.ts b/src/dev-app/cdk-experimental-combobox/panel-content.ts
deleted file mode 100644
index a4512cc23dae..000000000000
--- a/src/dev-app/cdk-experimental-combobox/panel-content.ts
+++ /dev/null
@@ -1,43 +0,0 @@
-/**
- * @license
- * Copyright Google LLC All Rights Reserved.
- *
- * Use of this source code is governed by an MIT-style license that can be
- * found in the LICENSE file at https://angular.io/license
- */
-
-import {Directive, Inject, InjectionToken, Input, OnInit, Optional} from '@angular/core';
-import {AriaHasPopupValue, CdkComboboxPanel} from '@angular/cdk-experimental/combobox';
-
-export const PANEL = new InjectionToken<CdkComboboxPanel>('CdkComboboxPanel');
-
-let id = 0;
-
-@Directive({
-  selector: '[panelContent]',
-  exportAs: 'panelContent',
-  host: {
-    'role': 'role',
-    '[id]': 'dialogId',
-  },
-})
-export class PanelContent<V> implements OnInit {
-  dialogId = `dialog-${id++}`;
-  role = 'dialog';
-
-  @Input('parentPanel') private readonly _explicitPanel: CdkComboboxPanel;
-
-  constructor(@Optional() @Inject(PANEL) readonly _parentPanel?: CdkComboboxPanel<V>) {}
-
-  ngOnInit() {
-    this.registerWithPanel();
-  }
-
-  registerWithPanel(): void {
-    if (this._parentPanel === null || this._parentPanel === undefined) {
-      this._explicitPanel._registerContent(this.dialogId, this.role as AriaHasPopupValue);
-    } else {
-      this._parentPanel._registerContent(this.dialogId, this.role as AriaHasPopupValue);
-    }
-  }
-}