From ef2249a58d22e189ca1e9b204b2eca75a1ba1303 Mon Sep 17 00:00:00 2001
From: Henri Bergius <henri.bergius@iki.fi>
Date: Thu, 30 Nov 2017 21:44:56 +0100
Subject: [PATCH] Move Plotly Shadow DOM Hack to helper, refs
 plotly/plotly.js#1433

---
 elements/linechart.js   | 15 +++------------
 lib/plotly-shadowdom.js | 12 ++++++++++++
 2 files changed, 15 insertions(+), 12 deletions(-)
 create mode 100644 lib/plotly-shadowdom.js

diff --git a/elements/linechart.js b/elements/linechart.js
index 99464ed..93713d1 100644
--- a/elements/linechart.js
+++ b/elements/linechart.js
@@ -1,6 +1,7 @@
 import { withComponent, props } from 'skatejs';
 import { colors } from '../lib/colors';
-import { parseValue } from '../lib//values';
+import { parseValue } from '../lib/values';
+import injectCss from '../lib/plotly-shadowdom';
 
 const Component = withComponent();
 
@@ -56,17 +57,7 @@ class LineChart extends Component {
       root.removeChild(root.firstChild);
     }
     root.appendChild(render());
-
-    // Hack for Shadow DOM compat
-    const styles = document.createElement('style');
-    styles.innerText = `
-      .js-plotly-plot .plotly .main-svg {
-            position: absolute;
-            top: 0;
-            left: 0;
-            pointer-events: none;
-        }`;
-    root.appendChild(styles);
+    injectCss(root);
   }
 
   render({ data, shape, width, height }) {
diff --git a/lib/plotly-shadowdom.js b/lib/plotly-shadowdom.js
new file mode 100644
index 0000000..16ae0c3
--- /dev/null
+++ b/lib/plotly-shadowdom.js
@@ -0,0 +1,12 @@
+// Hack for Shadow DOM compat
+export default function injectCss(root) {
+  const styles = document.createElement('style');
+  styles.appendChild(document.createTextNode(`
+    .js-plotly-plot .plotly .main-svg {
+      position: absolute;
+      top: 0;
+      left: 0;
+      pointer-events: none;
+    }`));
+  root.appendChild(styles);
+};