remove platinum elements, closes #11. Also update the components.

bower.json

@@ -11,7 +11,6 @@
     "paper-elements": "polymerelements/paper-elements#1.0.3",
     "gold-elements": "polymerelements/gold-elements#1.0.1",
     "neon-elements": "polymerelements/iron-elements#1.0.0",
-    "platinum-elements": "polymerelements/platinum-elements#1.0.1",
     "molecules": "polymerelements/molecules#1.0.0",
     "google-web-components": "GoogleWebComponents/google-web-components#1.0.1"
   }

lib/iron_autogrow_textarea.dart

@@ -19,9 +19,7 @@ import 'iron_flex_layout/classes/iron_flex_layout.dart';
 ///
 /// Example:
 ///
-///     <iron-autogrow-textarea id="a1">
-///       <textarea id="t1"></textarea>
-///     </iron-autogrow-textarea>
+///     <iron-autogrow-textarea></iron-autogrow-textarea>
 ///
 /// Because the `textarea`'s `value` property is not observable, you should use
 /// this element's `bind-value` instead for imperative updates.
@@ -35,8 +33,8 @@ class IronAutogrowTextarea extends HtmlElement with CustomElementProxyMixin, Pol
   set autocomplete(String value) { jsElement[r'autocomplete'] = value; }
 
   /// Bound to the textarea's `autofocus` attribute.
-  String get autofocus => jsElement[r'autofocus'];
-  set autofocus(String value) { jsElement[r'autofocus'] = value; }
+  bool get autofocus => jsElement[r'autofocus'];
+  set autofocus(bool value) { jsElement[r'autofocus'] = value; }
 
   /// Use this property instead of `value` for two-way data binding.
   String get bindValue => jsElement[r'bindValue'];

lib/iron_dropdown.dart

@@ -56,6 +56,12 @@ class IronDropdown extends HtmlElement with CustomElementProxyMixin, PolymerProx
   String get horizontalAlign => jsElement[r'horizontalAlign'];
   set horizontalAlign(String value) { jsElement[r'horizontalAlign'] = value; }
 
+  /// A pixel value that will be added to the position calculated for the
+  /// given `horizontalAlign`. Use a negative value to offset to the
+  /// left, or a positive value to offset to the right.
+  num get horizontalOffset => jsElement[r'horizontalOffset'];
+  set horizontalOffset(num value) { jsElement[r'horizontalOffset'] = value; }
+
   /// Set to true to disable animations when opening and closing the
   /// dropdown.
   bool get noAnimations => jsElement[r'noAnimations'];
@@ -75,4 +81,10 @@ class IronDropdown extends HtmlElement with CustomElementProxyMixin, PolymerProx
   /// vertically relative to the dropdown trigger.
   String get verticalAlign => jsElement[r'verticalAlign'];
   set verticalAlign(String value) { jsElement[r'verticalAlign'] = value; }
+
+  /// A pixel value that will be added to the position calculated for the
+  /// given `verticalAlign`. Use a negative value to offset towards the
+  /// top, or a positive value to offset towards the bottom.
+  num get verticalOffset => jsElement[r'verticalOffset'];
+  set verticalOffset(num value) { jsElement[r'verticalOffset'] = value; }
 }

lib/iron_validatable_behavior.dart

@@ -12,7 +12,7 @@ import 'iron_meta.dart';
 
 /// Use `Polymer.IronValidatableBehavior` to implement an element that validates user input.
 ///
-/// ### Accessiblity
+/// ### Accessibility
 ///
 /// Changing the `invalid` property, either manually or by calling `validate()` will update the
 /// `aria-invalid` attribute.
@@ -33,7 +33,11 @@ abstract class IronValidatableBehavior implements CustomElementProxyMixin {
   bool hasValidator() =>
       jsElement.callMethod('hasValidator', []);
 
-  /// [values]: Passed to the validator's `validate()` function.
-  bool validate(values) =>
-      jsElement.callMethod('validate', [values]);
+  /// Returns true if the `value` is valid, and updates `invalid`. If you want
+  /// your element to have custom validation logic, do not override this method;
+  /// override `_getValidity(value)` instead.
+  /// [value]: The value to be validated. By default, it is passed
+  ///     to the validator's `validate()` function, if a validator is set.
+  bool validate(value) =>
+      jsElement.callMethod('validate', [value]);
 }

lib/paper_badge.dart

@@ -9,6 +9,7 @@ import 'dart:js' show JsArray, JsObject;
 import 'package:web_components/web_components.dart';
 import 'package:polymer_interop/polymer_interop.dart';
 import 'iron_resizable_behavior.dart';
+import 'iron_flex_layout.dart';
 import 'default_theme.dart';
 
 /// `<paper-badge>` is a circular text badge that is displayed on the top right

lib/paper_badge.html

@@ -1,5 +1,6 @@
 <link rel="import" href="paper_badge_nodart.html">
 <link rel="import" href="iron_resizable_behavior.html">
+<link rel="import" href="iron_flex_layout.html">
 <link rel="import" href="default_theme.html">
 
 <script type="application/dart" src="paper_badge.dart"></script>

lib/paper_badge_nodart.html

@@ -1,4 +1,5 @@
 <link rel="import" href="src/paper-badge/paper-badge.html">
 <link rel="import" href="iron_resizable_behavior_nodart.html">
+<link rel="import" href="iron_flex_layout_nodart.html">
 <link rel="import" href="default_theme_nodart.html">
 

lib/paper_input_behavior.dart

@@ -85,11 +85,22 @@ abstract class PaperInputBehavior implements CustomElementProxyMixin {
   String get list => jsElement[r'list'];
   set list(String value) { jsElement[r'list'] = value; }
 
+  /// The maximum (numeric or date-time) input value.
+  /// Can be a String (e.g. `"2000-1-1"`) or a Number (e.g. `2`).
+  /// Bind this to the `<input is="iron-input">`'s `max` property.
+  String get max => jsElement[r'max'];
+  set max(String value) { jsElement[r'max'] = value; }
+
   /// The maximum length of the input value. Bind this to the `<input is="iron-input">`'s
   /// `maxlength` property.
   num get maxlength => jsElement[r'maxlength'];
   set maxlength(num value) { jsElement[r'maxlength'] = value; }
 
+  /// The minimum (numeric or date-time) input value.
+  /// Bind this to the `<input is="iron-input">`'s `min` property.
+  String get min => jsElement[r'min'];
+  set min(String value) { jsElement[r'min'] = value; }
+
   /// Bind this to the `<input is="iron-input">`'s `minlength` property.
   num get minlength => jsElement[r'minlength'];
   set minlength(num value) { jsElement[r'minlength'] = value; }
@@ -130,6 +141,11 @@ abstract class PaperInputBehavior implements CustomElementProxyMixin {
   num get size => jsElement[r'size'];
   set size(num value) { jsElement[r'size'] = value; }
 
+  /// Limits the numeric or date-time increments.
+  /// Bind this to the `<input is="iron-input">`'s `step` property.
+  String get step => jsElement[r'step'];
+  set step(String value) { jsElement[r'step'] = value; }
+
   /// The type of the input. The supported types are `text`, `number` and `password`. Bind this
   /// to the `<input is="iron-input">`'s `type` property.
   String get type => jsElement[r'type'];

lib/paper_input_container.dart

@@ -76,6 +76,8 @@ import 'paper_styles.dart';
 /// `--paper-input-container-label` | Mixin applied to the label | `{}`
 /// `--paper-input-container-label-focus` | Mixin applied to the label when the input is focused | `{}`
 /// `--paper-input-container-input` | Mixin applied to the input | `{}`
+/// `--paper-input-container-prefix` | Mixin applied to the input prefix | `{}`
+/// `--paper-input-container-suffix` | Mixin applied to the input suffix | `{}`
 /// `--paper-input-container-underline` | Mixin applied to the underline | `{}`
 /// `--paper-input-container-underline-focus` | Mixin applied to the underline when the input is focued | `{}`
 /// `--paper-input-container-underline-disabled` | Mixin applied to the underline when the input is disabled | `{}`

lib/paper_menu_button.dart

@@ -65,6 +65,12 @@ class PaperMenuButton extends HtmlElement with CustomElementProxyMixin, PolymerP
   String get horizontalAlign => jsElement[r'horizontalAlign'];
   set horizontalAlign(String value) { jsElement[r'horizontalAlign'] = value; }
 
+  /// A pixel value that will be added to the position calculated for the
+  /// given `horizontalAlign`. Use a negative value to offset to the
+  /// left, or a positive value to offset to the right.
+  num get horizontalOffset => jsElement[r'horizontalOffset'];
+  set horizontalOffset(num value) { jsElement[r'horizontalOffset'] = value; }
+
   /// Set to true to disable animations when opening and closing the
   /// dropdown.
   bool get noAnimations => jsElement[r'noAnimations'];
@@ -84,6 +90,12 @@ class PaperMenuButton extends HtmlElement with CustomElementProxyMixin, PolymerP
   String get verticalAlign => jsElement[r'verticalAlign'];
   set verticalAlign(String value) { jsElement[r'verticalAlign'] = value; }
 
+  /// A pixel value that will be added to the position calculated for the
+  /// given `verticalAlign`. Use a negative value to offset towards the
+  /// top, or a positive value to offset towards the bottom.
+  num get verticalOffset => jsElement[r'verticalOffset'];
+  set verticalOffset(num value) { jsElement[r'verticalOffset'] = value; }
+
   /// Hide the dropdown content.
   void close() =>
       jsElement.callMethod('close', []);

lib/src/gold-phone-input/gold-phone-input.html

@@ -69,6 +69,13 @@
     width: 40px;
   }
 
+  /* TODO(notwaldorf): The style applied by paper-input-container is more
+   * specific, and we need the important to override it. This will go away
+   * once we can refactor this element to use the paper-input suffix */
+  label {
+    left: 40px !important;
+  }
+
   </style>
 
   <template>
@@ -78,7 +85,7 @@
         always-float-label="[[_computeAlwaysFloatLabel(alwaysFloatLabel,placeholder)]]"
         invalid="[[invalid]]">
 
-      <label style="left:40px;" hidden$="[[!label]]">[[label]]</label>
+      <label hidden$="[[!label]]">[[label]]</label>
 
       <div class="horizontal layout">
         <span>+<span>[[countryCode]]</span></span>

lib/src/iron-autogrow-textarea/iron-autogrow-textarea.html

@@ -21,9 +21,7 @@
 
 Example:
 
-    <iron-autogrow-textarea id="a1">
-      <textarea id="t1"></textarea>
-    </iron-autogrow-textarea>
+    <iron-autogrow-textarea></iron-autogrow-textarea>
 
 Because the `textarea`'s `value` property is not observable, you should use
 this element's `bind-value` instead for imperative updates.
@@ -63,6 +61,7 @@
       height: 100%;
       font-size: inherit;
       font-family: inherit;
+      line-height: inherit;
     }
 
     ::content textarea:invalid {
@@ -150,8 +149,8 @@
        * Bound to the textarea's `autofocus` attribute.
        */
       autofocus: {
-        type: String,
-        value: 'off'
+        type: Boolean,
+        value: false
       },
 
       /**
@@ -302,5 +301,5 @@
     _computeValue: function() {
       return this.bindValue;
     }
-  })
+  });
 </script>

lib/src/iron-behaviors/iron-button-state.html

@@ -109,8 +109,10 @@
     // to emulate native checkbox, (de-)activations from a user interaction fire
     // 'change' events
     _userActivate: function(active) {
-      this.active = active;
-      this.fire('change');
+      if (this.active !== active) {
+        this.active = active;
+        this.fire('change');
+      }
     },
 
     _eventSourceIsPrimaryInput: function(event) {

lib/src/iron-behaviors/iron-control-state.html

@@ -60,11 +60,6 @@
     ],
 
     ready: function() {
-      // TODO(sjmiles): ensure read-only property is valued so the compound
-      // observer will fire
-      if (this.focused === undefined) {
-        this._setFocused(false);
-      }
       this.addEventListener('focus', this._boundFocusBlurHandler, true);
       this.addEventListener('blur', this._boundFocusBlurHandler, true);
     },
@@ -75,7 +70,6 @@
         var focused = event.type === 'focus';
         this._setFocused(focused);
       } else if (!this.shadowRoot) {
-        event.stopPropagation();
         this.fire(event.type, {sourceEvent: event}, {
           node: this,
           bubbles: event.bubbles,

lib/src/iron-behaviors/test/focused-state.html

@@ -90,26 +90,22 @@
         focusable = fixture('NestedFocusedState');
       });
 
-      test('focus/blur events fired on host element', function(done) {
+      test('focus/blur events fired on host element', function() {
         var nFocusEvents = 0;
         var nBlurEvents = 0;
+
         focusable.addEventListener('focus', function() {
           nFocusEvents += 1;
-          // setTimeout to wait for potentially more, erroneous events
-          setTimeout(function() {
-            assert.equal(nFocusEvents, 1, 'one focus event fired');
-            MockInteractions.blur(focusable.$.input);
-          });
+          MockInteractions.blur(focusable.$.input);
         });
         focusable.addEventListener('blur', function() {
           nBlurEvents += 1;
-          // setTimeout to wait for potentially more, erroneous events
-          setTimeout(function() {
-            assert.equal(nBlurEvents, 1, 'one blur event fired');
-            done();
-          });
         });
+
         MockInteractions.focus(focusable.$.input);
+
+        expect(nBlurEvents).to.be.greaterThan(0);
+        expect(nFocusEvents).to.be.greaterThan(0);
       });
 
     });

lib/src/iron-dropdown/iron-dropdown.html

@@ -98,6 +98,28 @@
             reflectToAttribute: true
           },
 
+          /**
+           * A pixel value that will be added to the position calculated for the
+           * given `horizontalAlign`. Use a negative value to offset to the
+           * left, or a positive value to offset to the right.
+           */
+          horizontalOffset: {
+            type: Number,
+            value: 0,
+            notify: true
+          },
+
+          /**
+           * A pixel value that will be added to the position calculated for the
+           * given `verticalAlign`. Use a negative value to offset towards the
+           * top, or a positive value to offset towards the bottom.
+           */
+          verticalOffset: {
+            type: Number,
+            value: 0,
+            notify: true
+          },
+
           /**
            * The element that should be used to position the dropdown when
            * it is opened.
@@ -147,7 +169,7 @@
         },
 
         observers: [
-          '_updateOverlayPosition(verticalAlign, horizontalAlign)'
+          '_updateOverlayPosition(verticalAlign, horizontalAlign, verticalOffset, horizontalOffset)'
         ],
 
         attached: function() {
@@ -190,6 +212,8 @@
             target = this._positionRect.left;
           }
 
+          target += this.horizontalOffset;
+
           return Math.max(target, 0);
         },
 
@@ -202,6 +226,8 @@
             target = this._positionRect.top;
           }
 
+          target += this.verticalOffset;
+
           return Math.max(target, 0);
         },
 

lib/src/iron-dropdown/test/iron-dropdown.html

@@ -141,6 +141,27 @@
           }, 1);
         });
 
+        suite('with an offset', function() {
+          test('is offset by the offset value when open', function() {
+            var dropdownRect;
+            var offsetDropdownRect;
+
+            dropdown.opened = true;
+
+            Polymer.Base.async(function() {
+              dropdownRect = dropdown.getBoundingClientRect();
+
+              dropdownRect.verticalOffset = 10;
+              dropdownRect.horizontalOffset = -10;
+
+              offsetDropdownRect = dropdown.getBoundingClientRect();
+
+              expect(dropdownRect.top).to.be.equal(offsetDropdownRect.top - 10);
+              expect(dropdownRect.left).to.be.equal(offsetDropdownRect.left + 10);
+            }, 1);
+          });
+        });
+
       });
     });
   </script>

lib/src/iron-test-helpers/mock-interactions.js

@@ -91,11 +91,15 @@
   }
 
   function focus(target) {
-    Polymer.Base.fire.call(target, 'focus');
+    Polymer.Base.fire.call(target, 'focus', {}, {
+      bubbles: false
+    });
   }
 
   function blur(target) {
-    Polymer.Base.fire.call(target, 'blur');
+    Polymer.Base.fire.call(target, 'blur', {}, {
+      bubbles: false
+    });
   }
 
   function downAndUp(target, callback) {