Viz legend

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@geneontology/wc-gocam-viz",
-  "version": "1.0.0",
+  "version": "1.0.1-beta.1",
   "description": "Web component to visualize GO-CAM",
   "main": "dist/index.cjs.js",
   "module": "dist/index.js",
@@ -48,4 +48,4 @@
   "homepage": "https://github.com/geneontology/wc-gocam-viz#readme",
   "author": "Laurent-Philippe Albou",
   "license": "BSD-3"
-}
+}

src/components/gocam-legend/gocam-legend.scss

@@ -1,4 +1,4 @@
-@import "../../scss/mixins";
+@import '../../scss/mixins';
 
 :host {
   /**
@@ -28,6 +28,7 @@
 
 .header {
   @include standard-var-styles(header);
+  text-align: center;
   font-weight: var(--header-font-weight);
   margin-bottom: 0.5em;
 }
@@ -43,6 +44,7 @@
 img {
   display: inline-block;
   max-height: 1.25em;
+  min-width: 3.5em;
   max-width: 3.75em;
   object-fit: scale-down;
 }
@@ -56,4 +58,4 @@ img {
 .item-label {
   display: inline-block;
   margin-left: 0.5em;
-}
+}

src/components/gocam-legend/gocam-legend.tsx

@@ -5,6 +5,7 @@ import direct_regulation from './assets/relation/direct_regulation.png';
 import indirect_regulation from './assets/relation/indirect_regulation.png';
 import positive_regulation from './assets/relation/positive_regulation.png';
 import negative_regulation from './assets/relation/negative_regulation.png';
+import provides_input_for from './assets/relation/provides_input_for.png';
 import neutral from './assets/relation/neutral.png';
 import has_input from './assets/relation/has_input.png';
 import has_output from './assets/relation/has_output.png';
@@ -22,6 +23,7 @@ const IMAGE_DATA = {
   indirect_regulation,
   positive_regulation,
   negative_regulation,
+  provides_input_for,
   neutral,
   has_input,
   has_output

src/globals/constants.ts

@@ -18,6 +18,9 @@ export const legend = {
     }, {
       id: 'negative_regulation',
       label: 'Negative Regulation'
+    }, {
+      id: 'provides_input_for',
+      label: 'Provides Input For'
     }, {
       id: 'neutral',
       label: 'Unknown/Neutral'