Updates and fix for Angular breaking change

Author: nshahan

CHANGELOG.md

@@ -1,3 +1,8 @@
+## 0.2.1
+
+* Rollup of recent changes
+* Includes fix for breaking change in Angular 2.2.0
+
 ## 0.2.0
 
 * Add a modal dialog window called material_dialog.

lib/src/components/material_expansionpanel/material_expansionpanel_set.dart

@@ -18,8 +18,9 @@ class MaterialExpansionPanelSet implements OnDestroy {
   MaterialExpansionPanel _openPanel;
   QueryList<MaterialExpansionPanel> _panels;
 
-  MaterialExpansionPanelSet(
-      @ContentChildren(MaterialExpansionPanel) this._panels) {
+  @ContentChildren(MaterialExpansionPanel)
+  set panels(QueryList<MaterialExpansionPanel> value) {
+    _panels = value;
     _tearDownDisposer.addStreamSubscription(
         _panels.changes.listen((_) => _onPanelsChange()));
     _onPanelsChange();
@@ -47,6 +48,10 @@ class MaterialExpansionPanelSet implements OnDestroy {
           panel.close.listen((event) => _onPanelClose(panel, event)));
       _panelDisposer.addDisposable(
           panel.cancel.listen((event) => _onPanelClose(panel, event)));
+      if (panel.closeOnSave) {
+        _panelDisposer.addDisposable(
+            panel.save.listen((event) => _onPanelClose(panel, event)));
+      }
     });
   }
 
@@ -79,9 +84,9 @@ class MaterialExpansionPanelSet implements OnDestroy {
   }
 
   void _setOpenPanel(MaterialExpansionPanel panel) {
-    _panels.forEach((p) {
+    for (MaterialExpansionPanel p in _panels) {
       if (p != panel) p.anotherExpanded = (panel != null);
-    });
+    }
     _openPanel = panel;
   }
 }

lib/src/components/material_input/material_input.dart

@@ -251,4 +251,3 @@ class MaterialInputComponent extends BaseMaterialInput
     popupSourceEl = null;
   }
 }
-

lib/src/components/material_radio/material_radio_group.dart

@@ -64,34 +64,10 @@ import '../../utils/disposer/disposer.dart';
 class MaterialRadioGroupComponent implements ControlValueAccessor, OnDestroy {
   final _disposer = new Disposer.oneShot();
   final ManagedZone _managedZone;
+  final NgControl cd;
   List<MaterialRadioComponent> _children;
 
-  MaterialRadioGroupComponent(
-      this._managedZone,
-      @ContentChildren(MaterialRadioComponent) QueryList components,
-      @Self() @Optional() NgControl cd) {
-    _disposer.addStreamSubscription(components.changes.listen((_) {
-      _children = new List.from(components);
-      for (var child in _children) {
-        _disposer
-          ..addStreamSubscription(child.focusmove.listen(_moveFocus))
-          ..addStreamSubscription(child.selectionmove.listen(_moveSelection));
-      }
-      if (_preselectedValue != null) {
-        // Since this is updating children that were already dirty-checked,
-        // need to delay this change until next angular cycle.
-        _managedZone.onTurnDone.first.then((_) {
-          // Initialize preselect now, this will trigger tabIndex reset.
-          selected = _preselectedValue;
-          // The preselected value should be used only once.
-          _preselectedValue = null;
-        });
-      } else {
-        // Initialize tabIndex.
-        _resetTabIndex();
-      }
-    }));
-
+  MaterialRadioGroupComponent(this._managedZone, @Self() @Optional() this.cd) {
     _disposer.addStreamSubscription(componentSelection.selectionChanges
         .listen((List<SelectionChangeRecord<MaterialRadioComponent>> changes) {
       // Need to uncheck if selection change was made via user action.
@@ -121,9 +97,32 @@ class MaterialRadioGroupComponent implements ControlValueAccessor, OnDestroy {
 
     // When NgControl is present on the host element, the component
     // participates in the Forms API.
-    if (cd != null) {
-      cd.valueAccessor = this;
-    }
+    cd?.valueAccessor = this;
+  }
+
+  @ContentChildren(MaterialRadioComponent)
+  set list(QueryList components) {
+    _disposer.addStreamSubscription(components.changes.listen((_) {
+      _children = new List.from(components);
+      for (var child in _children) {
+        _disposer
+          ..addStreamSubscription(child.focusmove.listen(_moveFocus))
+          ..addStreamSubscription(child.selectionmove.listen(_moveSelection));
+      }
+      if (_preselectedValue != null) {
+        // Since this is updating children that were already dirty-checked,
+        // need to delay this change until next angular cycle.
+        _managedZone.onTurnDone.first.then((_) {
+          // Initialize preselect now, this will trigger tabIndex reset.
+          selected = _preselectedValue;
+          // The preselected value should be used only once.
+          _preselectedValue = null;
+        });
+      } else {
+        // Initialize tabIndex.
+        _resetTabIndex();
+      }
+    }));
   }
 
   @override

lib/src/components/reorder_list/reorder_list.dart

@@ -99,10 +99,14 @@ class ReorderListComponent implements OnDestroy {
   @ViewChild('placeholder', read: ElementRef)
   ElementRef placeholder;
 
-  ReorderListComponent(
-      this._managedZone, @ContentChildren(ReorderItemDirective) this._items) {
+  ReorderListComponent(this._managedZone) {
     _subscriptions = new Map<HtmlElement, List<StreamSubscription>>();
     _dragSubscriptions = new Map<HtmlElement, StreamSubscription>();
+  }
+
+  @ContentChildren(ReorderItemDirective)
+  set items(QueryList<ReorderItemDirective> value) {
+    _items = value;
     _disposer
         .addStreamSubscription(_items.changes.listen((_) => _refreshItems()));
     _refreshItems();

lib/src/components/scorecard/scoreboard.dart

@@ -2,6 +2,7 @@
 // for details. All rights reserved. Use of this source code is governed by a
 // BSD-style license that can be found in the LICENSE file.
 
+import 'dart:async';
 import 'dart:html';
 
 import '../glyph/glyph.dart';
@@ -70,14 +71,18 @@ class ScoreboardComponent implements OnInit, OnDestroy {
   bool get atScorecardBarEnd => _atScorecardBarEnd;
 
   ScoreboardComponent(
-      @ContentChildren(ScorecardComponent) this._scorecards,
       @Attribute('enableUniformWidths') String enableUniformWidths,
       this._domService,
       this._changeDetector) {
     _enableUniformWidths = enableUniformWidths != 'false'; // Defaults to true
+  }
+
+  @ContentChildren(ScorecardComponent)
+  set scoreCards(QueryList<ScorecardComponent> value) {
+    _scorecards = value;
     _disposer.addStreamSubscription(
-        _scorecards.changes.listen((_) => _onScorecardsChange()));
-    _onScorecardsChange();
+        _scorecards.changes.listen((_) => _onScorecardsChange));
+    scheduleMicrotask(_onScorecardsChange);
   }
 
   @override

lib/src/components/scorecard/scorecard.dart

@@ -182,6 +182,7 @@ class ScorecardComponent extends KeyboardOnlyFocusIndicatorDirective {
   /// Whether the selection state of the scorecard can be changed by clicking.
   @HostBinding('class.selectable')
   bool get selectable => _selectable;
+
   @Input()
   set selectable(selectable) {
     _selectable = getBool(selectable);

lib/src/laminate/popup/src/popup_source_directive.dart

@@ -78,17 +78,14 @@ class PopupSourceDirective
 
   @override
   Stream<Rectangle<num>> onDimensionsChanged({bool track: false}) {
-    StreamController<Rectangle> buffer;
-    return (buffer = new StreamController(
-            sync: true,
-            onListen: () {
-              buffer.addStream(_popupSource.onDimensionsChanged(track: track));
-            }))
-        .stream;
+    return _popupSource.onDimensionsChanged(track: track).distinct();
   }
 
   void _updateSource() {
-    _popupSource = _domPopupSourceFactory.create(_elementRef.nativeElement,
-        alignOriginX: _alignOriginX, alignOriginY: _alignOriginY);
+    _popupSource = _domPopupSourceFactory.create(
+      _elementRef.nativeElement,
+      alignOriginX: _alignOriginX,
+      alignOriginY: _alignOriginY,
+    );
   }
 }

lib/src/utils/browser/dom_service/dom_service.dart

@@ -14,8 +14,6 @@ import '../../disposer/disposable_callback.dart';
 
 import '../../disposer/disposer.dart';
 
-// TODO(google): Consolidate this with RenderSync /Angular.
-
 /// A callback from [DomService.scheduleRead] or [DomService.scheduleWrite].
 typedef void DomReadWriteFn();
 
@@ -406,6 +404,17 @@ class DomService {
   StreamSubscription addLayoutObserver(void domReadCallback()) =>
       onLayoutChanged.listen((_) => domReadCallback());
 
+  String describeStability() {
+    return {
+      '_insideDigest': _insideDigest,
+      '_scheduledProcessQueue': _scheduledProcessQueue,
+      '_layoutObserveRead': _layoutObserveRead != null,
+      '_nextFrameFuture': _nextFrameFuture != null,
+      '_domReadQueue': _domReadQueue.length,
+      '_domWriteQueue': _domWriteQueue.length,
+    }.toString();
+  }
+
   /// Whether there is any pending update.
   bool get hasPendingUpdate =>
       _insideDigest ||

pubspec.yaml

@@ -1,5 +1,5 @@
 name: angular2_components
-version: 0.2.0
+version: 0.2.1
 description: >
   The official Material Design components for AngularDart. Used at Google
   in production apps.
@@ -8,7 +8,7 @@ author: Dart Team <[email protected]>
 environment:
   sdk: '>=1.20.0 <2.0.0'
 dependencies:
-  angular2: ^2.1.0
+  angular2: '>=2.2.0 <2.3.0'
   intl: ^0.14.0
   js: ^0.6.1
   observable: ^0.14.0+1