2.0-preview branch

.gitignore

@@ -1,3 +1,4 @@
 util/node_modules
 material-design-icons
-bower_components
+bower_components*
+bower-*.json

.travis.yml

@@ -1,24 +1,27 @@
 language: node_js
 sudo: required
 before_script:
-  - npm install -g bower polylint web-component-tester
-  - bower install
-  - polylint
+  - npm install -g bower polymer-cli@next
+  - polymer install --variants
+  - sudo mv /usr/bin/google-chrome /usr/bin/google-chrome-old
+  - sudo mv /usr/bin/google-chrome-beta /usr/bin/google-chrome
 env:
   global:
     - secure: >-
         L3XJmmXJlYZYyvlKoZ25HpEC1FcTtWejNk2xRQKAH4cg8+oNMjE80OxkaIVHtZlatpLdIIYk79p+9OtGiskXZ1QsAjHtrxWE5YRSSz3nL/XyZqUu7tjiNtrih6PiEvocmwMCCdRGMSXwVl1YoUUYM0DWxHdykd0EMXYYkYe+yQo=
     - secure: >-
         PSLkHUoiTj6UxN+7KtZG2miLmeuDuGN4c+ksviIP4/4lh5x7xic7CIeMmf2HLd18MR8CwCHjfMrIrxYF/IusILn6fdQ8rdBw+XhEF7xP+8UqqgF6YjGHs/xPDYYiGtisEc2OOg+vzqXIMhmKTg2vVlhuNq16eggGsRDcsEhEong=
-node_js: '6'
+node_js: stable
 addons:
   firefox: latest
   apt:
     sources:
       - google-chrome
     packages:
-      - google-chrome-stable
+      - google-chrome-beta
 script:
-  - true || xvfb-run wct
-  - 'if [ "${TRAVIS_PULL_REQUEST}" = "false" ]; then true || wct -s ''default''; fi'
+  - true || xvfb-run polymer test
+  - >-
+    if [ "${TRAVIS_PULL_REQUEST}" = "false" ]; then true || polymer test -s
+    'default'; fi
 dist: trusty

README.md

@@ -1,23 +1,9 @@
-
-<!---
-
-This README is automatically generated from the comments in these files:
-iron-icons.html
-
-Edit those files, and our readme bot will duplicate them over here!
-Edit this file, and the bot will squash your changes :)
-
-The bot does some handling of markdown. Please file a bug if it does the wrong
-thing! https://github.com/PolymerLabs/tedium/issues
-
--->
-
 [![Build status](https://travis-ci.org/PolymerElements/iron-icons.svg?branch=master)](https://travis-ci.org/PolymerElements/iron-icons)
 
 _[Demo and API docs](https://elements.polymer-project.org/elements/iron-icons)_
 
 
-##&lt;iron-icons&gt;
+## &lt;iron-icons&gt;
 
 `iron-icons` is a utility import that includes the definition for the `iron-icon` element, `iron-iconset-svg` element, as well as an import for the default icon set.
 
@@ -45,5 +31,3 @@ use directly in your elements.
 See [iron-icon](./iron-icon) for more information about working with icons.
 
 See [iron-iconset](./iron-iconset) and [iron-iconset-svg](./iron-iconset-svg) for more information about how to create a custom iconset.
-
-

bower.json

@@ -1,6 +1,6 @@
 {
   "name": "iron-icons",
-  "version": "1.2.1",
+  "version": "2.0.0",
   "description": "A set of icons for use with iron-icon",
   "authors": [
     "The Polymer Authors"
@@ -19,17 +19,32 @@
   "license": "http://polymer.github.io/LICENSE.txt",
   "homepage": "https://github.com/PolymerElements/paper-icons",
   "dependencies": {
-    "iron-icon": "polymerelements/iron-icon#^1.0.0",
-    "iron-iconset-svg": "polymerelements/iron-iconset-svg#^1.0.0",
-    "polymer": "Polymer/polymer#^1.0.0"
+    "iron-icon": "PolymerElements/iron-icon#2.0-preview",
+    "iron-iconset-svg": "PolymerElements/iron-iconset-svg#2.0-preview",
+    "polymer": "Polymer/polymer#^2.0.0-rc.1"
   },
   "devDependencies": {
-    "paper-styles": "polymerelements/paper-styles#^1.0.2",
-    "iron-component-page": "polymerelements/iron-component-page#1.0.0",
-    "iron-flex-layout": "polymerelements/iron-flex-layout#^1.0.0",
-    "iron-meta": "polymerelements/iron-meta#^1.0.0",
-    "webcomponentsjs": "webcomponents/webcomponentsjs#^0.7.0",
-    "web-component-tester": "^4.0.0"
+    "paper-styles": "PolymerElements/paper-styles#2.0-preview",
+    "iron-component-page": "polymerelements/iron-component-page#2.0-preview",
+    "iron-meta": "PolymerElements/iron-meta#2.0-preview",
+    "webcomponentsjs": "webcomponents/webcomponentsjs#^1.0.0-rc.1",
+    "web-component-tester": "^6.0.0-prerelease.6"
+  },
+  "variants": {
+    "1.x": {
+      "dependencies": {
+        "iron-icon": "polymerelements/iron-icon#^1.0.0",
+        "iron-iconset-svg": "polymerelements/iron-iconset-svg#^1.0.0",
+        "polymer": "Polymer/polymer#^1.0.0"
+      },
+      "devDependencies": {
+        "paper-styles": "polymerelements/paper-styles#^1.0.2",
+        "iron-component-page": "polymerelements/iron-component-page#1.0.0",
+        "iron-meta": "polymerelements/iron-meta#^1.0.0",
+        "webcomponentsjs": "webcomponents/webcomponentsjs#^0.7.0",
+        "web-component-tester": "^4.0.0"
+      }
+    }
   },
   "ignore": [
     "util",

demo/index.html

@@ -14,7 +14,7 @@
   <script src="../../webcomponentsjs/webcomponents-lite.js"></script>
   <link rel="import" href="../../paper-styles/demo-pages.html">
   <link rel="import" href="../../paper-styles/color.html">
-  <link rel="import" href="../../iron-flex-layout/iron-flex-layout.html">
+  <link rel="import" href="../../iron-meta/iron-meta.html">
 
   <!-- load default iconset -->
   <link rel="import" href="../iron-icons.html">
@@ -30,87 +30,92 @@
   <link rel="import" href="../notification-icons.html">
   <link rel="import" href="../social-icons.html">
   <link rel="import" href="../places-icons.html">
-
-  <style is="custom-style">
-    h2 {
-      text-transform: capitalize;
-    }
-
-    iron-icon {
-      transition: all 0.2s;
-      -webkit-transition: all 0.2s;
-    }
-
-    iron-icon:hover {
-      fill: var(--google-yellow-700);
-    }
-
-    .set {
-      margin: auto;
-      padding: 1em 0;
-      border-bottom: 1px solid silver;
-      @apply(--layout-horizontal);
-      @apply(--layout-wrap);
-    }
-
-    .set:last-of-type {
-      border-bottom: none;
-    }
-
-    .set:nth-of-type(4n-3) {
-      color: var(--paper-grey-700);
-    }
-
-    .set:nth-of-type(4n-2) {
-      color: var(--paper-pink-500);
-    }
-
-    .set:nth-of-type(4n-1) {
-      color: var(--google-green-500);
-    }
-
-    .set:nth-of-type(4n) {
-      color: var( --google-blue-500);
-    }
-
-    .container {
-      min-width: 10em;
-      padding: 1em 0.5em;
-      text-align: center;
-      @apply(--layout-vertical);
-      @apply(--layout-center);
-      @apply(--layout-flex);
-    }
-
-    .container > div {
-      margin-top: 0.5em;
-      color: black;
-      font-size: 10px;
-    }
-  </style>
 </head>
 <body>
-  <template is="dom-bind">
-   <iron-meta type="iconset" list="{{iconsets}}"></iron-meta>
-
-    <template is="dom-repeat" items="{{iconsets}}">
-      <h2>{{item.name}}</h2>
-
-      <div class="set">
-        <template is="dom-repeat" items="{{getIconNames(item)}}">
-          <span class="container">
-            <iron-icon icon="{{item}}"></iron-icon>
-            <div>{{item}}</div>
-          </span>
+  <custom-style>
+    <style is="custom-style">
+      h2 {
+        text-transform: capitalize;
+      }
+
+      iron-icon {
+        transition: all 0.2s;
+        -webkit-transition: all 0.2s;
+      }
+
+      iron-icon:hover {
+        fill: var(--google-yellow-700);
+      }
+
+      .set {
+        display: block;
+        text-align: center;
+        margin: auto;
+        padding: 1em 0;
+        border-bottom: 1px solid silver;
+      }
+
+      .set:last-of-type {
+        border-bottom: none;
+      }
+
+      .set:nth-of-type(4n-3) {
+        color: var(--paper-grey-700);
+      }
+
+      .set:nth-of-type(4n-2) {
+        color: var(--paper-pink-500);
+      }
+
+      .set:nth-of-type(4n-1) {
+        color: var(--google-green-500);
+      }
+
+      .set:nth-of-type(4n) {
+        color: var(--google-blue-500);
+      }
+
+      .container {
+        display: inline-block;
+        width: 10em;
+        margin: 1em 0.5em;
+        text-align: center;
+      }
+
+      .container > div {
+        margin-top: 0.5em;
+        color: black;
+        font-size: 10px;
+      }
+    </style>
+  </custom-style>
+
+  <dom-bind>
+    <template is="dom-bind" id="scope">
+      <dom-repeat>
+        <template is="dom-repeat" id="iconsetRepeat">
+          <h2>{{item.name}}</h2>
+          <dom-repeat class="set">
+            <template is="dom-repeat" items="{{getIconNames(item)}}">
+              <span class="container">
+                <iron-icon icon="{{item}}"></iron-icon>
+                <div>{{item}}</div>
+              </span>
+            </template>
+          </dom-repeat>
         </template>
-      </div>
+      </dom-repeat>
     </template>
-  </template>
+  </dom-bind>
 
   <script>
-    document.querySelector('[is=dom-bind]').getIconNames = function(iconset) {
-      return iconset.getIconNames();
-    };
+    window.addEventListener('WebComponentsReady', function() {
+      scope.getIconNames = function(iconset) {
+        return iconset.getIconNames();
+      };
+      scope.parentNode.getIconNames = scope.getIconNames;
+      iconsetRepeat.items = new Polymer.IronMeta({type: 'iconset'}).list;
+    });
   </script>
 </body>
 </html>