Merge branch 'polymer3' into 'master'

Polymer3 See merge request mistio/mist-insights!16
mistio · Apr 19, 2021 · f2bbc38 · f2bbc38
2 parents 5b7d1a3 + 7eac1bd
commit f2bbc38
Show file tree

Hide file tree

Showing 10 changed files with 3,630 additions and 2,274 deletions.
diff --git a/.gitignore b/.gitignore
@@ -1 +1,3 @@
 bower_components
+
+node_modules
diff --git a/demo/index.html b/demo/index.html
@@ -10,19 +10,39 @@
 
     <link rel="import" href="../../iron-demo-helpers/demo-pages-shared-styles.html">
     <link rel="import" href="../../iron-demo-helpers/demo-snippet.html">
-    <link rel="import" href="../mist-insights.html">
+    <script type="module" src="../mist-insights.js"></script>
 
-    <style is="custom-style" include="demo-pages-shared-styles">
-    </style>
+    <!-- FIXME(polymer-modulizer):
+        These imperative modules that innerHTML your HTML are
+        a hacky way to be sure that any mixins in included style
+        modules are ready before any elements that reference them are
+        instantiated, otherwise the CSS @apply mixin polyfill won't be
+        able to expand the underlying CSS custom properties.
+        See: https://github.com/Polymer/polymer-modulizer/issues/154
+        -->
+    <script type="module">
+const $_documentContainer = document.createElement('template');
+
+$_documentContainer.innerHTML = `<style is="custom-style" include="demo-pages-shared-styles">
+    </style>`;
+
+document.head.appendChild($_documentContainer.content);
+</script>
   </head>
   <body>
-    <div class="vertical-section-container centered">
+    <script type="module">
+const $_documentContainer = document.createElement('template');
+
+$_documentContainer.innerHTML = `<div class="vertical-section-container centered">
       <h3>Basic mist-insights demo</h3>
       <demo-snippet>
         <template>
           <mist-insights></mist-insights>
         </template>
       </demo-snippet>
-    </div>
+    </div>`;
+
+document.body.appendChild($_documentContainer.content);
+</script>
   </body>
 </html>
diff --git a/echarts-import.html b/echarts-import.html
diff --git a/index.html b/index.html
@@ -6,11 +6,15 @@
 
     <title>mist-insights</title>
 
-    <script src="../webcomponentsjs/webcomponents-lite.js"></script>
 
-    <link rel="import" href="../iron-component-page/iron-component-page.html">
   </head>
   <body>
-    <iron-component-page src="mist-insights.html"></iron-component-page>
+    <script type="module">
+      import "./mist-insights.js"
+    </script>
+    <mist-insights period="month" stack-term="" cloud="es123232"
+                   uri=""
+                   token="token"
+                   currency="$"></mist-insights>
   </body>
 </html>