After locally building and packing the latest wc-gocam-viz code, I tried bring it into my local AmiGO dev site. That revealed two main sticking points:
Stencil's assets feature requires quite a bit of configuration from the downstream client if they want to utilize the NPM package instead of relying on CDN <script> tags. Since the legend images we're talking about are actually quite small I've made a change here to simply inline them via rollup's image plugin and avoid Stencil assets altogether. This makes the the bundle a few kB bigger, but it means that downstream clients don't have to do any additional configuration.
Cytoscape assumes that it is not hosted in a shadow DOM element. This manifested itself in a bug where if you needed to scroll to see the pathway widget, the clicks inside the Cytoscape graph would register in the wrong position. We really don't want to give up on the shadow DOM because of its benefits for styling isolation. So the fix here it so manually set up some of the page-level event listeners that Cytoscape would have set up if it weren't hosted in the shadow DOM.
Other than that these changes remove an unused dependency (@geneontology/wc-light-modal) and do a little styling adjustment to prevent overflow in the genes panel when there are more than 4 evidence links to show.
After locally building and packing the latest
wc-gocam-vizcode, I tried bring it into my local AmiGO dev site. That revealed two main sticking points:<script>tags. Since the legend images we're talking about are actually quite small I've made a change here to simply inline them via rollup's image plugin and avoid Stencil assets altogether. This makes the the bundle a few kB bigger, but it means that downstream clients don't have to do any additional configuration.Other than that these changes remove an unused dependency (
@geneontology/wc-light-modal) and do a little styling adjustment to prevent overflow in the genes panel when there are more than 4 evidence links to show.