Gridstack stopped working in version 2.0.0 and above if the class="grid-stack" element is a web-component with shadow-dom!

I was on version grid-stack 1.2.0 before, and i am using it inside a web-component where the top most element(class="grid-stack) is a web-component and has a shadow-dom, it was working perfectly until i moved to version 2.0.0! Also tried checking the latest, 2.1.0! But with that version it doesn't work either!

Your environment

• 2.0.0 and above
• Chrome latest

Steps to reproduce

<vi-dashboard id="dashboardEl" class="grid-stack">
  <vi-panel loc-x="0" loc-y="0" width="3" height="3" class="grid-stack-item">
       <div class="grid-stack-item-content></div>
  </vi-panel>
  <vi-panel loc-x="3" loc-y="0" width="3" height="3" class="grid-stack-item>
       <div class="grid-stack-item-content></div>
  </vi-panel>
</vi-dashboard>

If you see above markup, vi-panel and vi-dashboard are both web-components! vi-panel being a webcomponent works fine! But if vi-dashboard is a web-component, it doesnt render properly! With no errors in console!

Expected behaviour

It should render properly as normal grid-stack demo!

Actual behaviour

Everything is stacked at one place ! Drag-drop and resizing doesn't work either!