feat(expansion): add accordion expand/collapse all (#6929)

Implements review feedback:
* missing return type
* updated JS Doc
* internal-use only underscore
* subscription in dedicated function
* decoupled event handling from Material implementaion

Closes #6929

Author: henetiriki

src/cdk/accordion/accordion-item.ts

@@ -72,12 +72,12 @@ export class CdkAccordionItem implements OnDestroy {
               private _changeDetectorRef: ChangeDetectorRef,
               protected _expansionDispatcher: UniqueSelectionDispatcher) {
     this._removeUniqueSelectionListener =
-      _expansionDispatcher.listen((id: string, accordionId: string) => {
-        if (this.accordion && !this.accordion.multi &&
-            this.accordion.id === accordionId && this.id !== id) {
-          this.expanded = false;
-        }
-      });
+        _expansionDispatcher.listen((id: string, accordionId: string) => {
+          if (this.accordion && !this.accordion.multi &&
+              this.accordion.id === accordionId && this.id !== id) {
+            this.expanded = false;
+          }
+        });
   }
 
   /** Emits an event for the accordion item being destroyed. */

src/demo-app/expansion/expansion-demo.ts

@@ -7,7 +7,7 @@ import {MatAccordion} from '@angular/material';
   styleUrls: ['expansion-demo.css'],
   templateUrl: 'expansion-demo.html',
   encapsulation: ViewEncapsulation.None,
-  preserveWhitespaces: true,
+  preserveWhitespaces: false,
 })
 export class ExpansionDemo {
   @ViewChild(MatAccordion) accordion: MatAccordion;

src/lib/expansion/expansion-panel-header.ts

@@ -83,7 +83,6 @@ import {EXPANSION_PANEL_ANIMATION_TIMING, MatExpansionPanel} from './expansion-p
 })
 export class MatExpansionPanelHeader implements OnDestroy {
   private _parentChangeSubscription = Subscription.EMPTY;
-  private _expandCollapseAllSubscription = Subscription.EMPTY;
 
   constructor(
     renderer: Renderer2,
@@ -102,17 +101,6 @@ export class MatExpansionPanelHeader implements OnDestroy {
     .subscribe(() => this._changeDetectorRef.markForCheck());
 
     _focusMonitor.monitor(_element.nativeElement, renderer, false);
-
-    // When a panel is hosted in an accordion, subscribe to the expand/collapse subject
-    if (this.panel.accordion) {
-      this._expandCollapseAllSubscription =
-        this.panel.accordion.expandCollapseAllSubject.subscribe((expanded: boolean) => {
-          // Only toggle if current state is not the intended state
-          if (!!this._isExpanded() !== expanded) {
-            this._toggle();
-          }
-        });
-    }
   }
 
   /** Height of the header while the panel is expanded. */
@@ -164,7 +152,6 @@ export class MatExpansionPanelHeader implements OnDestroy {
 
   ngOnDestroy() {
     this._parentChangeSubscription.unsubscribe();
-    this._expandCollapseAllSubscription.unsubscribe();
     this._focusMonitor.stopMonitoring(this._element.nativeElement);
   }
 }