summaryrefslogtreecommitdiffstats
path: root/third_party/polymer/components/paper-item/paper-item.html
diff options
context:
space:
mode:
Diffstat (limited to 'third_party/polymer/components/paper-item/paper-item.html')
-rw-r--r--third_party/polymer/components/paper-item/paper-item.html104
1 files changed, 104 insertions, 0 deletions
diff --git a/third_party/polymer/components/paper-item/paper-item.html b/third_party/polymer/components/paper-item/paper-item.html
new file mode 100644
index 0000000..ceb1b8a
--- /dev/null
+++ b/third_party/polymer/components/paper-item/paper-item.html
@@ -0,0 +1,104 @@
+<!--
+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
+-->
+
+<!--
+@group Paper Elements
+
+`paper-item` is a list-item object for use in menus. It may contain and icon and/or
+a text label.
+
+Example:
+
+ <core-menu>
+ <paper-item icon="refresh" label="Refresh"></paper-item>
+ <paper-item label="Help"></paper-item>
+ <paper-item label="Sign Out"></paper-item>
+ </core-menu>
+
+To use as a link, put an `&lt;a&gt;` element in the item.
+
+Example:
+
+ <paper-item icon="home" label="Home">
+ <a href="http://www.polymer-project.org"></a>
+ </paper-item>
+
+@class paper-item
+-->
+
+<link href="../polymer/polymer.html" rel="import">
+<link href="../core-icon/core-icon.html" rel="import">
+<link href="../paper-ripple/paper-ripple.html" rel="import">
+
+<link href="paper-item.css" rel="stylesheet" shim-shadowdom>
+
+<polymer-element name="paper-item" attributes="label iconSrc icon" center horizontal layout>
+
+ <template>
+
+ <paper-ripple id="ripple"></paper-ripple>
+
+ <core-icon id="icon" hidden?="{{!iconSrc && !icon}}" src="{{iconSrc}}" icon="{{icon}}"></core-icon>
+ <div id="label">{{label}}</div>
+ <content></content>
+ </template>
+
+ <script>
+ Polymer('paper-item', {
+
+ publish: {
+
+ /**
+ * The label for the item.
+ *
+ * @attribute label
+ * @type string
+ * @default ''
+ */
+ label: '',
+
+ /**
+ * (optional) The URL of an image for an icon to use in the button.
+ * Should not use `icon` property if you are using this property.
+ *
+ * @attribute iconSrc
+ * @type string
+ * @default ''
+ */
+ iconSrc: '',
+
+ /**
+ * (optional) Specifies the icon name or index in the set of icons
+ * available in the icon set. If using this property, load the icon
+ * set separately where the icon is used. Should not use `src`
+ * if you are using this property.
+ *
+ * @attribute icon
+ * @type string
+ * @default ''
+ */
+ icon: ''
+
+ },
+
+ eventDelegates: {
+ 'down': 'downAction',
+ 'up': 'upAction'
+ },
+
+ downAction: function(e) {
+ this.$.ripple.downAction(e);
+ },
+
+ upAction: function(e) {
+ this.$.ripple.upAction(e);
+ }
+ });
+ </script>
+</polymer-element>