Use MaterialIconComponent instead of deprecated GlyphComponent for material checkbox.

PiperOrigin-RevId: 199300674

Author: phantomesse

lib/material_checkbox/material_checkbox.dart

@@ -8,9 +8,9 @@ import 'dart:html';
 import 'package:angular/angular.dart';
 import 'package:angular_forms/angular_forms.dart';
 import 'package:meta/meta.dart';
-import 'package:angular_components/interfaces/has_disabled.dart';
 import 'package:angular_components/focus/focus.dart';
-import 'package:angular_components/glyph/glyph.dart';
+import 'package:angular_components/interfaces/has_disabled.dart';
+import 'package:angular_components/material_icon/material_icon.dart';
 import 'package:angular_components/material_ripple/material_ripple.dart';
 import 'package:angular_components/model/ui/icon.dart';
 import 'package:angular_components/utils/browser/events/events.dart';
@@ -68,7 +68,7 @@ const indeterminateAriaState = 'mixed';
   providers: const [
     const Provider(HasDisabled, useExisting: MaterialCheckboxComponent),
   ],
-  directives: const [GlyphComponent, MaterialRippleComponent, NgIf],
+  directives: const [MaterialIconComponent, MaterialRippleComponent, NgIf],
   templateUrl: 'material_checkbox.html',
   styleUrls: const ['material_checkbox.scss.css'],
   changeDetection: ChangeDetectionStrategy.OnPush,

lib/material_checkbox/material_checkbox.html

@@ -5,12 +5,12 @@
 -->
 <div class="icon-container"
      [class.focus]="showFocus">
-  <glyph [style.color]="themeColor"
+  <material-icon [style.color]="themeColor"
          [icon]="icon"
          class="icon"
          aria-hidden="true"
          [class.filled]="checked || indeterminate">
-  </glyph>
+  </material-icon>
   <material-ripple [style.color]="rippleColor"
               *ngIf="!disabled"
               class="ripple">