Port of github.com/polymer/polymer.

pkg/custom_element/lib/custom_element.dart

 // Copyright (c) 2013, 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.
 
 /**
  * Custom DOM elements.
  *
  * This library provides access to the Polymer project's
  * [Custom Elements]
  * (http://www.polymer-project.org/platform/custom-elements.html)
  * API, which lets you define your own elements. With custom elements, you
  * associate code with custom tag names, and then use those custom tag names
  * as you would any standard tag. For more information, see the
  * [Polymer.dart homepage](https://www.dartlang.org/polymer-dart/) and its
  * [custom element example]
  * (https://www.dartlang.org/polymer-dart/#custom-elements).
  */
 library custom_element;
 
 import 'dart:async';
 import 'dart:html';
 import 'package:mdv/mdv.dart' as mdv;
 import 'package:meta/meta.dart';
 import 'src/custom_tag_name.dart';
 
+part 'src/attribute_map.dart';
+
 // TODO(jmesserly): replace with a real custom element polyfill.
 // This is just something temporary.
 /**
  * *Warning*: this implementation is a work in progress. It only implements
  * the specification partially.
  *
  * Registers a custom HTML element with [localName] and the associated
  * constructor. This will ensure the element is detected and
  *
  * See the specification at:
@@ skipping 72 matching lines @@
  * interface, it also provides lifecycle methods:
  * - [created]
  * - [inserted]
  * - [attributeChanged]
  * - [removed]
  */
 class CustomElement implements Element {
   /** The web component element wrapped by this class. */
   Element _host;
   List _shadowRoots;
+  _AttributeMap _attributes;
 
   /**
    * Shadow roots generated by dwc for each custom element, indexed by the
    * custom element tag name.
    */
   Map<String, dynamic> _generatedRoots = {};
 
   /**
    * Temporary property until components extend [Element]. An element can
    * only be associated with one host, and it is an error to use a web component
@@ skipping 43 matching lines @@
    * Note that [root] will be a [ShadowRoot] if the browser supports Shadow DOM.
    */
   void created() {}
 
   /** Invoked when this component gets inserted in the DOM tree. */
   void inserted() {}
 
   /** Invoked when this component is removed from the DOM tree. */
   void removed() {}
 
-  // TODO(jmesserly): how do we implement this efficiently?
-  // See https://github.com/dart-lang/web-ui/issues/37
   /** Invoked when any attribute of the component is modified. */
-  void attributeChanged(String name, String oldValue, String newValue) {}
+  void attributeChanged(String name, String oldValue) {}
 
   get model => host.model;
 
   void set model(newModel) {
     host.model = newModel;
   }
 
   get templateInstance => host.templateInstance;
   get isTemplate => host.isTemplate;
   get ref => host.ref;
@@ skipping 66 matching lines @@
   bool contains(Node other) => host.contains(other);
 
   bool hasChildNodes() => host.hasChildNodes();
 
   Node insertBefore(Node newChild, Node refChild) =>
     host.insertBefore(newChild, refChild);
 
   Node insertAllBefore(Iterable<Node> newChild, Node refChild) =>
     host.insertAllBefore(newChild, refChild);
 
-  Map<String, String> get attributes => host.attributes;
+  Map<String, String> get attributes {
+    if (_attributes == null) _attributes = new _AttributeMap(this);
+    return _attributes;
+  }
   set attributes(Map<String, String> value) {
-    host.attributes = value;
+    (attributes as _AttributeMap)._replaceAll(value);
   }
 
   List<Element> get elements => host.children;
 
   set elements(List<Element> value) {
     host.children = value;
   }
 
   List<Element> get children => host.children;
 
@@ skipping 355 matching lines @@
       for (var removed in record.removedNodes) {
         if (identical(node, removed)) {
           observer.disconnect();
           element.removed();
           return;
         }
       }
     }
   }).observe(element.parentNode, childList: true);
 }