npm_modules: Fork bower_components into Polymer 0.4.0 and 0.5.0 versions

polymer_0.5.0/bower_components/core-label/core-label.html

+<!--
+    @license
+    Copyright (c) 2014 The Polymer Project Authors. All rights reserved.
+    This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
+    The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
+    The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
+    Code distributed by Google as part of the polymer project is also
+    subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
+-->
+
+<!--
+`<core-label>` provides a version of the `<label>` element that works with Custom Elements as well as native elements.
+
+All text in the `core-label` will be applied to the target element as a screen-reader accessible description.
+
+There are two ways to use `core-label` to target an element:
+
+1. place an element inside core-label with the `for` attribute:
+
+        <core-label>
+          Context for the Button
+          <paper-button for>button</paper-button>
+        </core-label>
+
+2. Set the `for` attribute on the `core-label` element to point to a target element in the same scope with a query
+string:
+
+        <core-label for=".foo">
+          Context for the button witht the "foo" class"
+        </core-label>
+        <paper-button class="foo">Far away button</paper-button>
+
+All taps on the `core-label` will be forwarded to the "target" element.
+
+@group Core Elements
+@element core-label
+@homepage github.io
+-->
+
+<link rel="import" href="../polymer/polymer.html">
+
+<!-- Native <label> has cursor: default -->
+<style>
+  html /deep/ core-label {
+    cursor: default;
+  }
+</style>
+
+<polymer-element name="core-label">
+  <script>
+    (function() {
+
+      var ID = 0;
+      function generate(node) {
+        if (!node.id) {
+          node.id = 'core-label-' + ID++;
+        }
+        return node.id;
+      }
+
+      Polymer('core-label', {
+        /**
+         * A query selector string for a "target" element not nested in the `<core-label>`
+         *
+         * @attribute for
+         * @type string
+         * @default ''
+         */
+        publish: {
+          'for': {reflect: true, value: ''}
+        },
+        eventDelegates: {
+          'tap': 'tapHandler'
+        },
+        created: function() {
+          generate(this);
+          this._forElement = null;
+        },
+        ready: function() {
+          if (!this.for) {
+            this._forElement = this.querySelector('[for]');
+            this._tie();
+          }
+        },
+        tapHandler: function(ev) {
+          if (!this._forElement) {
+            return;
+          }
+          if (ev.target === this._forElement) {
+            return;
+          }
+          this._forElement.focus();
+          this._forElement.click();
+          this.fire('tap', null, this._forElement);
+        },
+        _tie: function() {
+          if (this._forElement) {
+            this._forElement.setAttribute('aria-labelledby', this.id);
+          }
+        },
+        _findScope: function() {
+          var n = this.parentNode;
+          while(n && n.parentNode) {
+            n = n.parentNode;
+          }
+          return n;
+        },
+        forChanged: function(oldFor, newFor) {
+          if (this._forElement) {
+            this._forElement.removeAttribute('aria-labelledby');
+          }
+          var scope = this._findScope();
+          if (!scope) {
+            return;
+          }
+          this._forElement = scope.querySelector(newFor);
+          if (this._forElement) {
+            this._tie();
+          }
+        }
+      });
+    })();
+  </script>
+</polymer-element>