Provide a path to use Component Factories when using acx code that was previously using the ComponentRenderer pattern.

Also remove SupportsRendering as that was no longer being used.

PiperOrigin-RevId: 179479916

Author: TedSander

lib/material_input/material_auto_suggest_input.dart

@@ -31,7 +31,7 @@ import 'package:angular_components/model/selection/selection_container.dart';
 import 'package:angular_components/model/selection/selection_model.dart';
 import 'package:angular_components/model/selection/selection_options.dart';
 import 'package:angular_components/model/selection/string_selection_options.dart';
-import 'package:angular_components/model/ui/has_renderer.dart';
+import 'package:angular_components/model/ui/has_factory.dart';
 import 'package:angular_components/model/ui/highlight_provider.dart';
 import 'package:angular_components/model/ui/template_support.dart';
 import 'package:angular_components/stop_propagation/stop_propagation.dart';
@@ -437,9 +437,14 @@ class MaterialAutoSuggestInputComponent extends MaterialSelectBase
   bool get showLoadingSpinner => loading && options.optionsList.isEmpty;
 
   /// Custom renderer for suggestion labels.
+  @Deprecated('Use labelFactory instead.')
   @Input()
   ComponentRenderer labelRenderer;
 
+  /// Custom factory for rendering suggestion labels.
+  @Input()
+  FactoryRenderer labelFactory;
+
   /// An option is disabled if the options implements Selectable, but the [item]
   /// is not selectable.
   bool isOptionDisabled(Object item) =>

lib/material_input/material_auto_suggest_input.html

@@ -95,8 +95,9 @@
             (mouseenter)="activeModel.activate(null)">
           {{suggestionGroup.uiDisplayName}}
         </span>
-        <dynamic-component *ngIf="labelRenderer != null"
-            [componentType]="labelRenderer(suggestionGroup)"
+        <dynamic-component *ngIf="labelRenderer != null || labelFactory != null"
+            [componentType]="labelRenderer != null ? labelRenderer(suggestionGroup) : null"
+            [componetFactory]="labelFactory != null ? labelFactory(suggestionGroup) : null"
             [value]="suggestionGroup"
             (mouseenter)="activeModel.activate(null)">
         </dynamic-component>

lib/material_select/material_dropdown_select.dart

@@ -29,7 +29,7 @@ import 'package:angular_components/model/selection/select.dart';
 import 'package:angular_components/model/selection/selection_container.dart';
 import 'package:angular_components/model/selection/selection_model.dart';
 import 'package:angular_components/model/selection/selection_options.dart';
-import 'package:angular_components/model/ui/has_renderer.dart';
+import 'package:angular_components/model/ui/has_factory.dart';
 import 'package:angular_components/model/ui/template_support.dart';
 import 'package:angular_components/utils/id_generator/id_generator.dart';
 
@@ -183,8 +183,14 @@ class MaterialDropdownSelectComponent extends MaterialSelectBase
   bool showButtonBorder;
 
   @Input()
+  @Deprecated(
+      'Use labelFactory instead it allows for better tree-shakable code.')
   ComponentRenderer labelRenderer;
 
+  /// Factory used to create labels for the dropdown.
+  @Input()
+  FactoryRenderer labelFactory;
+
   /// CSS classes from the root element, passed to the popup to allow scoping of
   /// mixins.
   ///

lib/material_select/material_dropdown_select.html

@@ -68,8 +68,9 @@
             {{group.uiDisplayName}}
           </span>
           <dynamic-component
-              *ngIf="labelRenderer != null"
-              [componentType]="labelRenderer(group)"
+              *ngIf="labelRenderer != null || labelFactory != null"
+              [componentType]="labelRenderer != null ? labelRenderer(group) : null"
+              [componentFactory]="labelFactory != null ? labelFactory(group) : null"
               [value]="group">
           </dynamic-component>
           <template [ngIf]="group.isNotEmpty">

lib/material_select/material_select_item.dart

@@ -16,7 +16,7 @@ import 'package:angular_components/mixins/material_dropdown_base.dart';
 import 'package:angular_components/model/a11y/active_item_mixin.dart';
 import 'package:angular_components/model/selection/selection_container.dart';
 import 'package:angular_components/model/selection/selection_model.dart';
-import 'package:angular_components/model/ui/has_renderer.dart';
+import 'package:angular_components/model/ui/has_factory.dart';
 import 'package:angular_components/utils/angular/properties/properties.dart';
 import 'package:angular_components/utils/browser/dom_service/dom_service.dart';
 import 'package:angular_components/utils/disposer/disposer.dart';
@@ -47,7 +47,12 @@ import 'package:angular_components/utils/disposer/disposer.dart';
 )
 class MaterialSelectItemComponent extends ButtonDirective
     with ActiveItemMixin
-    implements OnDestroy, SelectionItem, HasRenderer, HasComponentRenderer {
+    implements
+        OnDestroy,
+        SelectionItem,
+        HasRenderer,
+        HasComponentRenderer,
+        HasFactoryRenderer {
   final _disposer = new Disposer.oneShot();
   final ActivationHandler _activationHandler;
   final ChangeDetectorRef _cdRef;
@@ -124,8 +129,14 @@ class MaterialSelectItemComponent extends ButtonDirective
   /// Use instead of manual label or item renderer.
   @Input()
   @override
+  @Deprecated('Use factoryrenderer instead as it will produce more '
+      'tree-shakeable code.')
   ComponentRenderer componentRenderer;
 
+  @Input()
+  @override
+  FactoryRenderer factoryRenderer;
+
   /// If true, check marks are used instead of checkboxes to indicate whether or
   /// not the item is selected for multi-select items.
   ///
@@ -202,9 +213,13 @@ class MaterialSelectItemComponent extends ButtonDirective
 
   bool _closeOnActivate = true;
 
+  // TODO(google): Remove after migration from ComponentRenderer is complete
   Type get componentType =>
       componentRenderer != null ? componentRenderer(value) : null;
 
+  ComponentFactory get componentFactory =>
+      factoryRenderer != null ? factoryRenderer(value) : null;
+
   /// Whether this item should be marked as selected.
   bool get isSelected => _isMarkedSelected || _isSelectedInSelectionModel;
 

lib/material_select/material_select_item.html

@@ -30,9 +30,10 @@
 &ngsp;
 <span *ngIf="valueHasLabel" class="label">{{valueLabel}}</span>
 &ngsp;
-<dynamic-component *ngIf="componentType != null"
+<dynamic-component *ngIf="componentType != null || componentFactory != null"
     class="dynamic-item"
     [componentType]="componentType"
+    [componentFactory]="componentFactory"
     [value]="value">
 </dynamic-component>
 <ng-content></ng-content>

lib/model/selection/selection_container.dart

@@ -4,12 +4,12 @@
 
 import 'package:angular_components/model/selection/selection_model.dart';
 import 'package:angular_components/model/selection/selection_options.dart';
-import 'package:angular_components/model/ui/has_renderer.dart';
+import 'package:angular_components/model/ui/has_factory.dart';
 
 /// A type of component which renders items from a `SelectionModel` and may
 /// show options from a `SelectionOptions` model.
 abstract class SelectionContainer<T>
-    implements HasRenderer<T>, HasComponentRenderer {
+    implements HasRenderer<T>, HasComponentRenderer, HasFactoryRenderer {
   /// The selection model this container represents.
   SelectionModel<T> _selection;
   SelectionModel<T> get selection => _selection;
@@ -40,9 +40,21 @@ abstract class SelectionContainer<T>
   @override
   ComponentRenderer get componentRenderer => _componentRenderer;
   @override
+  @Deprecated(
+      'Use factoryRenderer instead it provides more tree-shakeable code')
   set componentRenderer(ComponentRenderer value) {
     _componentRenderer = value;
   }
+
+  /// Specifies the factoryRenderer to use to determine the factory for
+  /// rendering an item.
+  FactoryRenderer _factoryRenderer;
+  @override
+  FactoryRenderer get factoryRenderer => _factoryRenderer;
+  @override
+  set factoryRenderer(FactoryRenderer value) {
+    _factoryRenderer = value;
+  }
 }
 
 /// A type of component which renders an item from a `SelectionModel`.

lib/model/ui/has_factory.dart

@@ -0,0 +1,22 @@
+// Copyright (c) 2016, the Dart project authors.  Please see the AUTHORS file
+// 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.
+
+// This file is separate from has_renderer so it doesn't add in the angular
+// dependency and so 'dart:html' which stops tests from running as a simple
+// dart_test.
+import 'package:angular/angular.dart' show ComponentFactory;
+
+import 'has_renderer.dart';
+
+export 'has_renderer.dart';
+
+/// Defines a method that returns a factory to render the Item.  The
+/// component created must implement [RendersValue].
+typedef ComponentFactory FactoryRenderer<T extends RendersValue, I>(I item);
+
+/// HasFactoryRenderer defines a method that takes in an item and returns the
+/// factory to use to render the item.
+abstract class HasFactoryRenderer<T extends RendersValue, I> {
+  FactoryRenderer<T, I> factoryRenderer;
+}

lib/model/ui/has_renderer.dart

@@ -54,10 +54,12 @@ abstract class RendersValue<T> {
 
 /// Defines a method that returns a component to render the Item.  The
 /// component must implement RendersValue.
+@Deprecated('Use FactoryRenderer instead as it allows for treeshaking')
 typedef Type ComponentRenderer<T extends RendersValue, I>(I item);
 
 /// HasComponentRenderer defines a method that takes in an item and returns the
 /// type to use to render the item.
+@Deprecated('Use HasFactoryRenderer instead as it allows for treeshaking')
 abstract class HasComponentRenderer<T extends RendersValue, I> {
   ComponentRenderer<T, I> componentRenderer;
 }
@@ -69,30 +71,3 @@ const ItemRenderer nullRenderer = _nullRenderer;
 
 String _nullRenderer(dynamic value) =>
     throw new StateError("nullRenderer should never be called");
-
-abstract class SupportsRendering<T extends RendersValue, I>
-    implements HasRenderer, HasComponentRenderer<T, I> {
-  /// Sets the componentRenderer and itemRenderer based on whether the
-  /// renderer implements the appropriate interfaces.
-  @Deprecated('Set componentRenderer or itemRenderer directly')
-  set renderer(Object renderer) {
-    if (renderer is HasRenderer) {
-      itemRenderer = renderer.itemRenderer;
-    } else {
-      // Provide a default.
-      itemRenderer = defaultItemRenderer;
-    }
-    if (renderer is HasComponentRenderer<T, I>) {
-      componentRenderer = renderer.componentRenderer;
-    }
-  }
-
-  @override
-  ComponentRenderer<T, I> componentRenderer;
-
-  /// This item renderer is used to convert list items into a string that for
-  /// the user of the UI.
-  /// Ex: itemRenderer(0) returns 'black';
-  @override
-  ItemRenderer itemRenderer = defaultItemRenderer;
-}

lib/src/material_tree/group/material_tree_group.html

@@ -44,6 +44,7 @@
           *ngIf="useComponentRenderer"
           class="item component"
           [componentType]="getComponentType(option)"
+          [componentFactory]="getComponentFactory(option)"
           [value]="option">
         </dynamic-component>
         <span