Add paper-dropdown and paper-dropdown-menu and run reproduce.sh

third_party/polymer/components/paper-dropdown-menu/demo.html

Index: third_party/polymer/components/paper-dropdown-menu/demo.html
diff --git a/third_party/polymer/components-chromium/core-dropdown-menu/demo.html b/third_party/polymer/components/paper-dropdown-menu/demo.html
similarity index 57%
copy from third_party/polymer/components-chromium/core-dropdown-menu/demo.html
copy to third_party/polymer/components/paper-dropdown-menu/demo.html
index f2646e5bf809fdc6950153f27055786884b0c3d7..e2b07e8508e6f222cd52d5b136ec6081de6e57b9 100644
--- a/third_party/polymer/components-chromium/core-dropdown-menu/demo.html
+++ b/third_party/polymer/components/paper-dropdown-menu/demo.html
@@ -15,18 +15,16 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
   <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
   <meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1.0, user-scalable=yes">
 
-  <title>core-dropdown-menu</title>
+  <title>paper-dropdown-menu</title>
 
   <script src="../webcomponentsjs/webcomponents.js"></script>
 
   <link href="../core-collapse/core-collapse.html" rel="import">
-  <link href="../core-dropdown/core-dropdown.html" rel="import">
-  <link href="../core-icons/core-icons.html" rel="import">
-  <link href="../core-icon-button/core-icon-button.html" rel="import">
-  <link href="../core-item/core-item.html" rel="import">
   <link href="../core-menu/core-menu.html" rel="import">
+  <link href="../paper-dropdown/paper-dropdown.html" rel="import">
+  <link href="../paper-item/paper-item.html" rel="import">
 
-  <link href="core-dropdown-menu.html" rel="import">
+  <link href="paper-dropdown-menu.html" rel="import">
 
   <style shim-shadowdom>
     body {
@@ -47,21 +45,17 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
       font-size: 16px;
     }
 
-    html /deep/ core-dropdown-menu {
+    html /deep/ paper-dropdown-menu {
       box-sizing: border-box;
       width: 170px;
     }
 
-    html /deep/ core-dropdown {
+    html /deep/ core-menu {
       box-sizing: border-box;
-      min-width: 170px;
-      background-color: #eee;
-      color: #000;
-      border: 1px solid #ccc;
-      border-radius: 3px;
+      width: 170px;
     }
 
-    core-item {
+    paper-item {
       overflow: hidden;
       white-space: nowrap;
       text-overflow: ellipsis;
@@ -72,14 +66,24 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
       padding: 8px;
     }
 
+    html /deep/ core-overlay {
+      border: 1px solid #ccc;
+      padding: 8px;
+      background: #fff;
+    }
+
     .constrained-height {
       height: 150px;
     }
 
     .colored {
+      color: #0f9d58;
+    }
+
+    .dropdown.colored::shadow #ripple,
+    .dropdown.colored::shadow #background {
       border: 1px solid #0f9d58;
       background-color: #b7e1cd;
-      color: #0f9d58;
     }
 
   </style>
@@ -93,25 +97,25 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
 
       <div>Absolutely positioned dropdowns</div>
 
-      <core-dropdown-menu label="Your favorite pastry">
-        <core-dropdown class="dropdown">
-          <core-menu>
+      <paper-dropdown-menu label="Your favorite pastry">
+        <paper-dropdown class="dropdown">
+          <core-menu class="menu">
             <template repeat="{{pastries}}">
-              <core-item>{{}}</core-item>
+              <paper-item>{{}}</paper-item>
             </template>
           </core-menu>
-        </core-dropdown>
-      </core-dropdown-menu>
+        </paper-dropdown>
+      </paper-dropdown-menu>
 
       <br><br>
 
-      <core-dropdown-menu label="Disabled" disabled>
-        <core-dropdown class="dropdown">
-          <core-menu>
-            <core-item>Should not see this</core-item>
+      <paper-dropdown-menu label="Disabled" disabled>
+        <paper-dropdown class="dropdown">
+          <core-menu class="menu">
+            <paper-item>Should not see this</paper-item>
           </core-menu>
-        </core-dropdown>
-      </core-dropdown-menu>
+        </paper-dropdown>
+      </paper-dropdown-menu>
 
     </section>
 
@@ -119,21 +123,37 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
 
       <div>Layered dropdowns</div>
 
+      <button onclick="document.getElementById('overlay').toggle()">toggle core-overlay</button>
+
+      <core-overlay id="overlay">
+
+        <paper-dropdown-menu label="Your favorite pastry">
+          <paper-dropdown layered class="dropdown">
+            <core-menu class="menu">
+              <template repeat="{{pastries}}">
+                <paper-item>{{}}</paper-item>
+              </template>
+            </core-menu>
+          </paper-dropdown>
+        </paper-dropdown-menu>
+
+      </core-overlay>
+
       <button onclick="document.getElementById('collapse').toggle()">toggle core-collapse</button>
 
       <br>
 
       <core-collapse id="collapse">
 
-        <core-dropdown-menu label="Your favorite pastry">
-          <core-dropdown layered class="dropdown">
-            <core-menu>
+        <paper-dropdown-menu label="Your favorite pastry">
+          <paper-dropdown layered class="dropdown">
+            <core-menu class="menu">
               <template repeat="{{pastries}}">
-                <core-item>{{}}</core-item>
+                <paper-item>{{}}</paper-item>
               </template>
             </core-menu>
-          </core-dropdown>
-        </core-dropdown-menu>
+          </paper-dropdown>
+        </paper-dropdown-menu>
 
       </core-collapse>
 
@@ -143,27 +163,27 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
 
       <div>Custom styling</div>
 
-      <core-dropdown-menu label="Constrained height">
-        <core-dropdown class="dropdown constrained-height">
-          <core-menu>
+      <paper-dropdown-menu label="Constrained height">
+        <paper-dropdown class="dropdown constrained-height">
+          <core-menu class="menu">
             <template repeat="{{pastries}}">
-              <core-item>{{}}</core-item>
+              <paper-item>{{}}</paper-item>
             </template>
           </core-menu>
-        </core-dropdown>
-      </core-dropdown-menu>
+        </paper-dropdown>
+      </paper-dropdown-menu>
 
       <br><br>
 
-      <core-dropdown-menu label="Colored">
-        <core-dropdown class="dropdown colored">
-          <core-menu>
+      <paper-dropdown-menu label="Colored">
+        <paper-dropdown class="dropdown colored">
+          <core-menu class="menu">
             <template repeat="{{pastries}}">
-              <core-item>{{}}</core-item>
+              <paper-item>{{}}</paper-item>
             </template>
           </core-menu>
-        </core-dropdown>
-      </core-dropdown-menu>
+        </paper-dropdown>
+      </paper-dropdown-menu>
 
     </section>