feat(material/snack-bar): convert to standalone (#27926)

Converts the snack bar module to standalone.

Author: crisbeto

src/dev-app/snack-bar/snack-bar-demo.ts

@@ -13,7 +13,6 @@ import {
   MatSnackBarConfig,
   MatSnackBarHorizontalPosition,
   MatSnackBarVerticalPosition,
-  MatSnackBarModule,
 } from '@angular/material/snack-bar';
 import {CommonModule} from '@angular/common';
 import {FormsModule} from '@angular/forms';
@@ -29,7 +28,6 @@ import {MatSelectModule} from '@angular/material/select';
   encapsulation: ViewEncapsulation.None,
   standalone: true,
   imports: [
-    MatSnackBarModule,
     CommonModule,
     FormsModule,
     MatButtonModule,
@@ -49,7 +47,10 @@ export class SnackBarDemo {
   horizontalPosition: MatSnackBarHorizontalPosition = 'center';
   verticalPosition: MatSnackBarVerticalPosition = 'bottom';
 
-  constructor(public snackBar: MatSnackBar, private _dir: Directionality) {}
+  constructor(
+    public snackBar: MatSnackBar,
+    private _dir: Directionality,
+  ) {}
 
   open() {
     const config = this._createConfig();

src/material/snack-bar/module.ts

@@ -8,30 +8,27 @@
 
 import {OverlayModule} from '@angular/cdk/overlay';
 import {PortalModule} from '@angular/cdk/portal';
-import {CommonModule} from '@angular/common';
 import {NgModule} from '@angular/core';
 import {MatButtonModule} from '@angular/material/button';
 import {MatCommonModule} from '@angular/material/core';
 
 import {SimpleSnackBar} from './simple-snack-bar';
 import {MatSnackBarContainer} from './snack-bar-container';
 import {MatSnackBarAction, MatSnackBarActions, MatSnackBarLabel} from './snack-bar-content';
+import {MatSnackBar} from './snack-bar';
+
+const DIRECTIVES = [MatSnackBarContainer, MatSnackBarLabel, MatSnackBarActions, MatSnackBarAction];
 
 @NgModule({
-  imports: [OverlayModule, PortalModule, CommonModule, MatButtonModule, MatCommonModule],
-  exports: [
+  imports: [
+    OverlayModule,
+    PortalModule,
+    MatButtonModule,
     MatCommonModule,
-    MatSnackBarContainer,
-    MatSnackBarLabel,
-    MatSnackBarActions,
-    MatSnackBarAction,
-  ],
-  declarations: [
     SimpleSnackBar,
-    MatSnackBarContainer,
-    MatSnackBarLabel,
-    MatSnackBarActions,
-    MatSnackBarAction,
+    ...DIRECTIVES,
   ],
+  exports: [MatCommonModule, ...DIRECTIVES],
+  providers: [MatSnackBar],
 })
 export class MatSnackBarModule {}

src/material/snack-bar/simple-snack-bar.ts

@@ -7,8 +7,11 @@
  */
 
 import {ChangeDetectionStrategy, Component, Inject, ViewEncapsulation} from '@angular/core';
+import {CommonModule} from '@angular/common';
+import {MatButtonModule} from '@angular/material/button';
 import {MatSnackBarRef} from './snack-bar-ref';
 import {MAT_SNACK_BAR_DATA} from './snack-bar-config';
+import {MatSnackBarAction, MatSnackBarActions, MatSnackBarLabel} from './snack-bar-content';
 
 /**
  * Interface for a simple snack bar component that has a message and a single action.
@@ -27,6 +30,8 @@ export interface TextOnlySnackBar {
   exportAs: 'matSnackBar',
   encapsulation: ViewEncapsulation.None,
   changeDetection: ChangeDetectionStrategy.OnPush,
+  imports: [MatButtonModule, MatSnackBarLabel, MatSnackBarActions, MatSnackBarAction, CommonModule],
+  standalone: true,
   host: {
     'class': 'mat-mdc-simple-snack-bar',
   },

src/material/snack-bar/snack-bar-container.ts

@@ -26,6 +26,7 @@ import {
   CdkPortalOutlet,
   ComponentPortal,
   DomPortal,
+  PortalModule,
   TemplatePortal,
 } from '@angular/cdk/portal';
 import {Observable, Subject} from 'rxjs';
@@ -52,6 +53,8 @@ let uniqueId = 0;
   changeDetection: ChangeDetectionStrategy.Default,
   encapsulation: ViewEncapsulation.None,
   animations: [matSnackBarAnimations.snackBarState],
+  standalone: true,
+  imports: [PortalModule],
   host: {
     'class': 'mdc-snackbar mat-mdc-snack-bar-container mdc-snackbar--open',
     '[@state]': '_animationState',

src/material/snack-bar/snack-bar-content.ts

@@ -11,6 +11,7 @@ import {Directive} from '@angular/core';
 /** Directive that should be applied to the text element to be rendered in the snack bar. */
 @Directive({
   selector: `[matSnackBarLabel]`,
+  standalone: true,
   host: {
     'class': 'mat-mdc-snack-bar-label mdc-snackbar__label',
   },
@@ -20,6 +21,7 @@ export class MatSnackBarLabel {}
 /** Directive that should be applied to the element containing the snack bar's action buttons. */
 @Directive({
   selector: `[matSnackBarActions]`,
+  standalone: true,
   host: {
     'class': 'mat-mdc-snack-bar-actions mdc-snackbar__actions',
   },
@@ -29,6 +31,7 @@ export class MatSnackBarActions {}
 /** Directive that should be applied to each of the snack bar's action buttons. */
 @Directive({
   selector: `[matSnackBarAction]`,
+  standalone: true,
   host: {
     'class': 'mat-mdc-snack-bar-action mdc-snackbar__action',
   },

src/material/snack-bar/snack-bar.ts

@@ -21,7 +21,6 @@ import {
   SkipSelf,
   TemplateRef,
 } from '@angular/core';
-import {MatSnackBarModule} from './module';
 import {SimpleSnackBar, TextOnlySnackBar} from './simple-snack-bar';
 import {MatSnackBarContainer} from './snack-bar-container';
 import {MAT_SNACK_BAR_DATA, MatSnackBarConfig} from './snack-bar-config';
@@ -46,7 +45,7 @@ export const MAT_SNACK_BAR_DEFAULT_OPTIONS = new InjectionToken<MatSnackBarConfi
 /**
  * Service to dispatch Material Design snack bar messages.
  */
-@Injectable({providedIn: MatSnackBarModule})
+@Injectable({providedIn: 'root'})
 export class MatSnackBar implements OnDestroy {
   /**
    * Reference to the current snack bar in the view *at this level* (in the Angular injector tree).

tools/public_api_guard/material/snack-bar.md

@@ -19,11 +19,10 @@ import { DomPortal } from '@angular/cdk/portal';
 import { ElementRef } from '@angular/core';
 import { EmbeddedViewRef } from '@angular/core';
 import * as i0 from '@angular/core';
-import * as i4 from '@angular/cdk/overlay';
-import * as i5 from '@angular/cdk/portal';
-import * as i6 from '@angular/common';
-import * as i7 from '@angular/material/button';
-import * as i8 from '@angular/material/core';
+import * as i1 from '@angular/cdk/overlay';
+import * as i2 from '@angular/cdk/portal';
+import * as i3 from '@angular/material/button';
+import * as i4 from '@angular/material/core';
 import { InjectionToken } from '@angular/core';
 import { Injector } from '@angular/core';
 import { LiveAnnouncer } from '@angular/cdk/a11y';
@@ -70,15 +69,15 @@ export class MatSnackBar implements OnDestroy {
 // @public
 export class MatSnackBarAction {
     // (undocumented)
-    static ɵdir: i0.ɵɵDirectiveDeclaration<MatSnackBarAction, "[matSnackBarAction]", never, {}, {}, never, never, false, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<MatSnackBarAction, "[matSnackBarAction]", never, {}, {}, never, never, true, never>;
     // (undocumented)
     static ɵfac: i0.ɵɵFactoryDeclaration<MatSnackBarAction, never>;
 }
 
 // @public
 export class MatSnackBarActions {
     // (undocumented)
-    static ɵdir: i0.ɵɵDirectiveDeclaration<MatSnackBarActions, "[matSnackBarActions]", never, {}, {}, never, never, false, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<MatSnackBarActions, "[matSnackBarActions]", never, {}, {}, never, never, true, never>;
     // (undocumented)
     static ɵfac: i0.ɵɵFactoryDeclaration<MatSnackBarActions, never>;
 }
@@ -124,7 +123,7 @@ export class MatSnackBarContainer extends BasePortalOutlet implements OnDestroy
     _role?: 'status' | 'alert';
     snackBarConfig: MatSnackBarConfig;
     // (undocumented)
-    static ɵcmp: i0.ɵɵComponentDeclaration<MatSnackBarContainer, "mat-snack-bar-container", never, {}, {}, never, never, false, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<MatSnackBarContainer, "mat-snack-bar-container", never, {}, {}, never, never, true, never>;
     // (undocumented)
     static ɵfac: i0.ɵɵFactoryDeclaration<MatSnackBarContainer, never>;
 }
@@ -140,7 +139,7 @@ export type MatSnackBarHorizontalPosition = 'start' | 'center' | 'end' | 'left'
 // @public
 export class MatSnackBarLabel {
     // (undocumented)
-    static ɵdir: i0.ɵɵDirectiveDeclaration<MatSnackBarLabel, "[matSnackBarLabel]", never, {}, {}, never, never, false, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<MatSnackBarLabel, "[matSnackBarLabel]", never, {}, {}, never, never, true, never>;
     // (undocumented)
     static ɵfac: i0.ɵɵFactoryDeclaration<MatSnackBarLabel, never>;
 }
@@ -152,7 +151,7 @@ export class MatSnackBarModule {
     // (undocumented)
     static ɵinj: i0.ɵɵInjectorDeclaration<MatSnackBarModule>;
     // (undocumented)
-    static ɵmod: i0.ɵɵNgModuleDeclaration<MatSnackBarModule, [typeof i1.SimpleSnackBar, typeof i2.MatSnackBarContainer, typeof i3.MatSnackBarLabel, typeof i3.MatSnackBarActions, typeof i3.MatSnackBarAction], [typeof i4.OverlayModule, typeof i5.PortalModule, typeof i6.CommonModule, typeof i7.MatButtonModule, typeof i8.MatCommonModule], [typeof i8.MatCommonModule, typeof i2.MatSnackBarContainer, typeof i3.MatSnackBarLabel, typeof i3.MatSnackBarActions, typeof i3.MatSnackBarAction]>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<MatSnackBarModule, never, [typeof i1.OverlayModule, typeof i2.PortalModule, typeof i3.MatButtonModule, typeof i4.MatCommonModule, typeof i5.SimpleSnackBar, typeof i6.MatSnackBarContainer, typeof i7.MatSnackBarLabel, typeof i7.MatSnackBarActions, typeof i7.MatSnackBarAction], [typeof i4.MatCommonModule, typeof i6.MatSnackBarContainer, typeof i7.MatSnackBarLabel, typeof i7.MatSnackBarActions, typeof i7.MatSnackBarAction]>;
 }
 
 // @public
@@ -190,7 +189,7 @@ export class SimpleSnackBar implements TextOnlySnackBar {
     // (undocumented)
     snackBarRef: MatSnackBarRef<SimpleSnackBar>;
     // (undocumented)
-    static ɵcmp: i0.ɵɵComponentDeclaration<SimpleSnackBar, "simple-snack-bar", ["matSnackBar"], {}, {}, never, never, false, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<SimpleSnackBar, "simple-snack-bar", ["matSnackBar"], {}, {}, never, never, true, never>;
     // (undocumented)
     static ɵfac: i0.ɵɵFactoryDeclaration<SimpleSnackBar, never>;
 }