diff --git a/dist/flowchart.html b/dist/flowchart.html
index 0adebdc19..a8d8d21a2 100644
--- a/dist/flowchart.html
+++ b/dist/flowchart.html
@@ -886,55 +886,196 @@
   <h3>graph</h3>
   <div class="mermaid">
     graph LR
-    A[red text] -->|default style| B(blue text)
-    C([red text]) -->|default style| D[[blue text]]
-    E[(red text)] -->|default style| F((blue text))
-    G>red text] -->|default style| H{blue text}
-    I{{red text}} -->|default style| J[/blue text/]
-    K[\red text\] -->|default style| L[/blue text\]
-    M[\red text/] -->|default style| N[blue text]
+    A1[red text] -->|default style| A2[blue text]
+    B1(red text) -->|default style| B2(blue text)
+    C1([red text]) -->|default style| C2([blue text])
+    D1[[red text]] -->|default style| D2[[blue text]]
+    E1[(red text)] -->|default style| E2[(blue text)]
+    F1((red text)) -->|default style| F2((blue text))
+    G1>red text] -->|default style| G2>blue text]
+    H1{red text} -->|default style| H2{blue text}
+    I1{{red text}} -->|default style| I2{{blue text}}
+    J1[/red text/] -->|default style| J2[/blue text/]
+    K1[\red text\] -->|default style| K2[\blue text\]
+    L1[/red text\] -->|default style| L2[/blue text\]
+    M1[\red text/] -->|default style| M2[\blue text/]
+    N1[red text] -->|default style| N2[blue text]
     linkStyle default color:Sienna;
-    style A stroke:#ff0000,fill:#ffcccc,color:#ff0000
-    style B stroke:#0000ff,fill:#ccccff,color:#0000ff
-    style C stroke:#ff0000,fill:#ffcccc,color:#ff0000
-    style D stroke:#0000ff,fill:#ccccff,color:#0000ff
-    style E stroke:#ff0000,fill:#ffcccc,color:#ff0000
-    style F stroke:#0000ff,fill:#ccccff,color:#0000ff
-    style G stroke:#ff0000,fill:#ffcccc,color:#ff0000
-    style H stroke:#0000ff,fill:#ccccff,color:#0000ff
-    style I stroke:#ff0000,fill:#ffcccc,color:#ff0000
-    style J stroke:#0000ff,fill:#ccccff,color:#0000ff
-    style K stroke:#ff0000,fill:#ffcccc,color:#ff0000
-    style L stroke:#0000ff,fill:#ccccff,color:#0000ff
-    style M stroke:#ff0000,fill:#ffcccc,color:#ff0000
-    style N stroke:#0000ff,fill:#ccccff,color:#0000ff
+    style A1 stroke:#ff0000,fill:#ffcccc,color:#ff0000
+    style B1 stroke:#ff0000,fill:#ffcccc,color:#ff0000
+    style C1 stroke:#ff0000,fill:#ffcccc,color:#ff0000
+    style D1 stroke:#ff0000,fill:#ffcccc,color:#ff0000
+    style E1 stroke:#ff0000,fill:#ffcccc,color:#ff0000
+    style F1 stroke:#ff0000,fill:#ffcccc,color:#ff0000
+    style G1 stroke:#ff0000,fill:#ffcccc,color:#ff0000
+    style H1 stroke:#ff0000,fill:#ffcccc,color:#ff0000
+    style I1 stroke:#ff0000,fill:#ffcccc,color:#ff0000
+    style J1 stroke:#ff0000,fill:#ffcccc,color:#ff0000
+    style K1 stroke:#ff0000,fill:#ffcccc,color:#ff0000
+    style L1 stroke:#ff0000,fill:#ffcccc,color:#ff0000
+    style M1 stroke:#ff0000,fill:#ffcccc,color:#ff0000
+    style N1 stroke:#ff0000,fill:#ffcccc,color:#ff0000
+    style A2 stroke:#0000ff,fill:#ccccff,color:#0000ff
+    style B2 stroke:#0000ff,fill:#ccccff,color:#0000ff
+    style C2 stroke:#0000ff,fill:#ccccff,color:#0000ff
+    style D2 stroke:#0000ff,fill:#ccccff,color:#0000ff
+    style E2 stroke:#0000ff,fill:#ccccff,color:#0000ff
+    style F2 stroke:#0000ff,fill:#ccccff,color:#0000ff
+    style G2 stroke:#0000ff,fill:#ccccff,color:#0000ff
+    style H2 stroke:#0000ff,fill:#ccccff,color:#0000ff
+    style I2 stroke:#0000ff,fill:#ccccff,color:#0000ff
+    style J2 stroke:#0000ff,fill:#ccccff,color:#0000ff
+    style K2 stroke:#0000ff,fill:#ccccff,color:#0000ff
+    style L2 stroke:#0000ff,fill:#ccccff,color:#0000ff
+    style M2 stroke:#0000ff,fill:#ccccff,color:#0000ff
+    style N2 stroke:#0000ff,fill:#ccccff,color:#0000ff
   </div>
 
   <h3>flowchart</h3>
   <div class="mermaid">
     flowchart LR
-    A[red text] -->|default style| B(blue text)
-    C([red text]) -->|default style| D[[blue text]]
-    E[(red text)] -->|default style| F((blue text))
-    G>red text] -->|default style| H{blue text}
-    I{{red text}} -->|default style| J[/blue text/]
-    K[\red text\] -->|default style| L[/blue text\]
-    M[\red text/] -->|default style| N[blue text]
+    A1[red text] <-->|default style| A2[blue text]
+    B1(red text) <-->|default style| B2(blue text)
+    C1([red text]) <-->|default style| C2([blue text])
+    D1[[red text]] <-->|default style| D2[[blue text]]
+    E1[(red text)] <-->|default style| E2[(blue text)]
+    F1((red text)) <-->|default style| F2((blue text))
+    G1>red text] <-->|default style| G2>blue text]
+    H1{red text} <-->|default style| H2{blue text}
+    I1{{red text}} <-->|default style| I2{{blue text}}
+    J1[/red text/] <-->|default style| J2[/blue text/]
+    K1[\red text\] <-->|default style| K2[\blue text\]
+    L1[/red text\] <-->|default style| L2[/blue text\]
+    M1[\red text/] <-->|default style| M2[\blue text/]
+    N1[red text] <-->|default style| N2[blue text]
     linkStyle default color:Sienna;
-    style A stroke:#ff0000,fill:#ffcccc,color:#ff0000
-    style B stroke:#0000ff,fill:#ccccff,color:#0000ff
-    style C stroke:#ff0000,fill:#ffcccc,color:#ff0000
-    style D stroke:#0000ff,fill:#ccccff,color:#0000ff
-    style E stroke:#ff0000,fill:#ffcccc,color:#ff0000
-    style F stroke:#0000ff,fill:#ccccff,color:#0000ff
-    style G stroke:#ff0000,fill:#ffcccc,color:#ff0000
-    style H stroke:#0000ff,fill:#ccccff,color:#0000ff
-    style I stroke:#ff0000,fill:#ffcccc,color:#ff0000
-    style J stroke:#0000ff,fill:#ccccff,color:#0000ff
-    style K stroke:#ff0000,fill:#ffcccc,color:#ff0000
-    style L stroke:#0000ff,fill:#ccccff,color:#0000ff
-    style M stroke:#ff0000,fill:#ffcccc,color:#ff0000
-    style N stroke:#0000ff,fill:#ccccff,color:#0000ff
+    style A1 stroke:#ff0000,fill:#ffcccc,color:#ff0000
+    style B1 stroke:#ff0000,fill:#ffcccc,color:#ff0000
+    style C1 stroke:#ff0000,fill:#ffcccc,color:#ff0000
+    style D1 stroke:#ff0000,fill:#ffcccc,color:#ff0000
+    style E1 stroke:#ff0000,fill:#ffcccc,color:#ff0000
+    style F1 stroke:#ff0000,fill:#ffcccc,color:#ff0000
+    style G1 stroke:#ff0000,fill:#ffcccc,color:#ff0000
+    style H1 stroke:#ff0000,fill:#ffcccc,color:#ff0000
+    style I1 stroke:#ff0000,fill:#ffcccc,color:#ff0000
+    style J1 stroke:#ff0000,fill:#ffcccc,color:#ff0000
+    style K1 stroke:#ff0000,fill:#ffcccc,color:#ff0000
+    style L1 stroke:#ff0000,fill:#ffcccc,color:#ff0000
+    style M1 stroke:#ff0000,fill:#ffcccc,color:#ff0000
+    style N1 stroke:#ff0000,fill:#ffcccc,color:#ff0000
+    style A2 stroke:#0000ff,fill:#ccccff,color:#0000ff
+    style B2 stroke:#0000ff,fill:#ccccff,color:#0000ff
+    style C2 stroke:#0000ff,fill:#ccccff,color:#0000ff
+    style D2 stroke:#0000ff,fill:#ccccff,color:#0000ff
+    style E2 stroke:#0000ff,fill:#ccccff,color:#0000ff
+    style F2 stroke:#0000ff,fill:#ccccff,color:#0000ff
+    style G2 stroke:#0000ff,fill:#ccccff,color:#0000ff
+    style H2 stroke:#0000ff,fill:#ccccff,color:#0000ff
+    style I2 stroke:#0000ff,fill:#ccccff,color:#0000ff
+    style J2 stroke:#0000ff,fill:#ccccff,color:#0000ff
+    style K2 stroke:#0000ff,fill:#ccccff,color:#0000ff
+    style L2 stroke:#0000ff,fill:#ccccff,color:#0000ff
+    style M2 stroke:#0000ff,fill:#ccccff,color:#0000ff
+    style N2 stroke:#0000ff,fill:#ccccff,color:#0000ff
+  </div>
+
+  <hr/>
+  <h2>Sample 19</h2>
+
+  <h3>graph</h3>
+  <div class="mermaid">
+    graph TB
+    A1[red text] -->|default style| A2[blue text]
+    B1(red text) -->|default style| B2(blue text)
+    C1([red text]) -->|default style| C2([blue text])
+    D1[[red text]] -->|default style| D2[[blue text]]
+    E1[(red text)] -->|default style| E2[(blue text)]
+    F1((red text)) -->|default style| F2((blue text))
+    G1>red text] -->|default style| G2>blue text]
+    H1{red text} -->|default style| H2{blue text}
+    I1{{red text}} -->|default style| I2{{blue text}}
+    J1[/red text/] -->|default style| J2[/blue text/]
+    K1[\red text\] -->|default style| K2[\blue text\]
+    L1[/red text\] -->|default style| L2[/blue text\]
+    M1[\red text/] -->|default style| M2[\blue text/]
+    N1[red text] -->|default style| N2[blue text]
+    linkStyle default color:Sienna;
+    style A1 stroke:#ff0000,fill:#ffcccc,color:#ff0000
+    style B1 stroke:#ff0000,fill:#ffcccc,color:#ff0000
+    style C1 stroke:#ff0000,fill:#ffcccc,color:#ff0000
+    style D1 stroke:#ff0000,fill:#ffcccc,color:#ff0000
+    style E1 stroke:#ff0000,fill:#ffcccc,color:#ff0000
+    style F1 stroke:#ff0000,fill:#ffcccc,color:#ff0000
+    style G1 stroke:#ff0000,fill:#ffcccc,color:#ff0000
+    style H1 stroke:#ff0000,fill:#ffcccc,color:#ff0000
+    style I1 stroke:#ff0000,fill:#ffcccc,color:#ff0000
+    style J1 stroke:#ff0000,fill:#ffcccc,color:#ff0000
+    style K1 stroke:#ff0000,fill:#ffcccc,color:#ff0000
+    style L1 stroke:#ff0000,fill:#ffcccc,color:#ff0000
+    style M1 stroke:#ff0000,fill:#ffcccc,color:#ff0000
+    style N1 stroke:#ff0000,fill:#ffcccc,color:#ff0000
+    style A2 stroke:#0000ff,fill:#ccccff,color:#0000ff
+    style B2 stroke:#0000ff,fill:#ccccff,color:#0000ff
+    style C2 stroke:#0000ff,fill:#ccccff,color:#0000ff
+    style D2 stroke:#0000ff,fill:#ccccff,color:#0000ff
+    style E2 stroke:#0000ff,fill:#ccccff,color:#0000ff
+    style F2 stroke:#0000ff,fill:#ccccff,color:#0000ff
+    style G2 stroke:#0000ff,fill:#ccccff,color:#0000ff
+    style H2 stroke:#0000ff,fill:#ccccff,color:#0000ff
+    style I2 stroke:#0000ff,fill:#ccccff,color:#0000ff
+    style J2 stroke:#0000ff,fill:#ccccff,color:#0000ff
+    style K2 stroke:#0000ff,fill:#ccccff,color:#0000ff
+    style L2 stroke:#0000ff,fill:#ccccff,color:#0000ff
+    style M2 stroke:#0000ff,fill:#ccccff,color:#0000ff
+    style N2 stroke:#0000ff,fill:#ccccff,color:#0000ff
+  </div>
+
+  <h3>flowchart</h3>
+  <div class="mermaid">
+    flowchart TB
+    A1[red text] <-->|default style| A2[blue text]
+    B1(red text) <-->|default style| B2(blue text)
+    C1([red text]) <-->|default style| C2([blue text])
+    D1[[red text]] <-->|default style| D2[[blue text]]
+    E1[(red text)] <-->|default style| E2[(blue text)]
+    F1((red text)) <-->|default style| F2((blue text))
+    G1>red text] <-->|default style| G2>blue text]
+    H1{red text} <-->|default style| H2{blue text}
+    I1{{red text}} <-->|default style| I2{{blue text}}
+    J1[/red text/] <-->|default style| J2[/blue text/]
+    K1[\red text\] <-->|default style| K2[\blue text\]
+    L1[/red text\] <-->|default style| L2[/blue text\]
+    M1[\red text/] <-->|default style| M2[\blue text/]
+    N1[red text] <-->|default style| N2[blue text]
+    linkStyle default color:Sienna;
+    style A1 stroke:#ff0000,fill:#ffcccc,color:#ff0000
+    style B1 stroke:#ff0000,fill:#ffcccc,color:#ff0000
+    style C1 stroke:#ff0000,fill:#ffcccc,color:#ff0000
+    style D1 stroke:#ff0000,fill:#ffcccc,color:#ff0000
+    style E1 stroke:#ff0000,fill:#ffcccc,color:#ff0000
+    style F1 stroke:#ff0000,fill:#ffcccc,color:#ff0000
+    style G1 stroke:#ff0000,fill:#ffcccc,color:#ff0000
+    style H1 stroke:#ff0000,fill:#ffcccc,color:#ff0000
+    style I1 stroke:#ff0000,fill:#ffcccc,color:#ff0000
+    style J1 stroke:#ff0000,fill:#ffcccc,color:#ff0000
+    style K1 stroke:#ff0000,fill:#ffcccc,color:#ff0000
+    style L1 stroke:#ff0000,fill:#ffcccc,color:#ff0000
+    style M1 stroke:#ff0000,fill:#ffcccc,color:#ff0000
+    style N1 stroke:#ff0000,fill:#ffcccc,color:#ff0000
+    style A2 stroke:#0000ff,fill:#ccccff,color:#0000ff
+    style B2 stroke:#0000ff,fill:#ccccff,color:#0000ff
+    style C2 stroke:#0000ff,fill:#ccccff,color:#0000ff
+    style D2 stroke:#0000ff,fill:#ccccff,color:#0000ff
+    style E2 stroke:#0000ff,fill:#ccccff,color:#0000ff
+    style F2 stroke:#0000ff,fill:#ccccff,color:#0000ff
+    style G2 stroke:#0000ff,fill:#ccccff,color:#0000ff
+    style H2 stroke:#0000ff,fill:#ccccff,color:#0000ff
+    style I2 stroke:#0000ff,fill:#ccccff,color:#0000ff
+    style J2 stroke:#0000ff,fill:#ccccff,color:#0000ff
+    style K2 stroke:#0000ff,fill:#ccccff,color:#0000ff
+    style L2 stroke:#0000ff,fill:#ccccff,color:#0000ff
+    style M2 stroke:#0000ff,fill:#ccccff,color:#0000ff
+    style N2 stroke:#0000ff,fill:#ccccff,color:#0000ff
   </div>
 
   <hr/>
diff --git a/docs/integrations.md b/docs/integrations.md
index 2373c7f85..6c447bc8f 100644
--- a/docs/integrations.md
+++ b/docs/integrations.md
@@ -108,6 +108,8 @@ They also serve as proof of concept, for the variety of things that can be built
   - [Mermaid Preview](https://s3.amazonaws.com/extend.brackets/alanhohn.mermaid-preview/alanhohn.mermaid-preview-1.0.2.zip)
 - [Iodide](https://github.com/iodide-project/iodide)
   - [iodide-mermaid-plugin](https://github.com/iodide-project/iodide-mermaid-plugin)
+- [Google docs](https://docs.google.com/)
+  - [Mermaid plugin for google docs](https://workspace.google.com/marketplace/app/mermaid/636321283856)
 
 ## Document Generation
 
diff --git a/src/dagre-wrapper/nodes.js b/src/dagre-wrapper/nodes.js
index 13fe0e337..c422dd4d9 100644
--- a/src/dagre-wrapper/nodes.js
+++ b/src/dagre-wrapper/nodes.js
@@ -53,7 +53,7 @@ const hexagon = (parent, node) => {
   updateNodeBounds(node, hex);
 
   node.intersect = function(point) {
-    return intersect.polygon(node, point);
+    return intersect.polygon(node, points, point);
   };
 
   return shapeSvg;
@@ -74,10 +74,12 @@ const rect_left_inv_arrow = (parent, node) => {
 
   const el = insertPolygonShape(shapeSvg, w, h, points);
   el.attr('style', node.style);
-  updateNodeBounds(node, el);
+
+  node.width = w + h;
+  node.height = h;
 
   node.intersect = function(point) {
-    return intersect.polygon(node, point);
+    return intersect.polygon(node, points, point);
   };
 
   return shapeSvg;
@@ -100,7 +102,7 @@ const lean_right = (parent, node) => {
   updateNodeBounds(node, el);
 
   node.intersect = function(point) {
-    return intersect.polygon(node, point);
+    return intersect.polygon(node, points, point);
   };
 
   return shapeSvg;
@@ -123,7 +125,7 @@ const lean_left = (parent, node) => {
   updateNodeBounds(node, el);
 
   node.intersect = function(point) {
-    return intersect.polygon(node, point);
+    return intersect.polygon(node, points, point);
   };
 
   return shapeSvg;
@@ -146,7 +148,7 @@ const trapezoid = (parent, node) => {
   updateNodeBounds(node, el);
 
   node.intersect = function(point) {
-    return intersect.polygon(node, point);
+    return intersect.polygon(node, points, point);
   };
 
   return shapeSvg;
@@ -169,7 +171,7 @@ const inv_trapezoid = (parent, node) => {
   updateNodeBounds(node, el);
 
   node.intersect = function(point) {
-    return intersect.polygon(node, point);
+    return intersect.polygon(node, points, point);
   };
 
   return shapeSvg;
@@ -193,7 +195,7 @@ const rect_right_inv_arrow = (parent, node) => {
   updateNodeBounds(node, el);
 
   node.intersect = function(point) {
-    return intersect.polygon(node, point);
+    return intersect.polygon(node, points, point);
   };
 
   return shapeSvg;
@@ -470,7 +472,7 @@ const subroutine = (parent, node) => {
   updateNodeBounds(node, el);
 
   node.intersect = function(point) {
-    return intersect.polygon(node, point);
+    return intersect.polygon(node, points, point);
   };
 
   return shapeSvg;