Visualisation: tooltip and table improvement

[cpelley]

• Tooltips now show:
  • Only collapsed properties where we collapse the graph.
  • Node data where we don't collapse the graph.
• Improved formatting of tooltip.
• Table now adds an explicit collapsed column as distinct from the data.
• Nodes are click-able, scrolling the table to the corresponding row and highlighting it.
• Table rows are click-able, highlighting that row.
• Now turned into a web component (using jsdelivr to make this possible).
  • We can now support visualisation without people having javascript hardcoded in theirs files.

Issues

• Closes graph node and table row click go-to support #84
• Closes Turn the DAG visualisation capability into a Web Component #76

TODO (future PR):

• Dark mode theme toggle.
• Make tooltip and info configurable (via callback??).
• Replace UTF-8 symbols with svg symbols (UTF-8 symbols are font+browser+platform sensitive).
• Toggle button between '
  ' render as newline VS '; '.

[cpelley]

This isn't polished yet, but @SamGriffithsMO, this might be of use to you 🤷

It's been clear that when collapsing over properties, that listing all relevant node data in the tooltip is not terrible useful or readable. The approach taken here is a stronger reliance on the lookup table. I will likely make this configurable using a callback on polishing this up.

[cpelley]

I'll add a change that makes the mermaid nodes clickable. On clicking a node, it will take you to the corresponding table row and highlight it.
Done