@abi-software/map-side-bar 2.17.0 → 2.17.1-demo.1

package/package.json

@@ -1,9 +1,9 @@
 {
   "name": "@abi-software/map-side-bar",
-  "version": "2.17.0",
+  "version": "2.17.1-demo.1",
   "license": "Apache-2.0",
   "engines": {
-    "node": ">=20"
+    "node": "^24.20.0"
   },
   "repository": {
     "type": "git",
@@ -91,5 +91,11 @@
     "@rollup/rollup-darwin-arm64": "4.63.0",
     "@rollup/rollup-linux-x64-gnu": "4.63.0",
     "@rollup/rollup-win32-x64-msvc": "4.63.0"
+  },
+  "allowScripts": {
+    "@parcel/watcher@2.6.0": true,
+    "cypress@15.21.1": true,
+    "fsevents@2.3.3": true,
+    "esbuild@0.21.5": true
   }
 }

package/src/App.vue

@@ -1,9 +1,5 @@
 <template>
   <div id="app">
-    <link
-      rel="stylesheet"
-      href="https://fonts.googleapis.com/css?family=Asap:400,400i,500,600,700&display=swap"
-    />
     <div class="options-container">
       <div>Click arrow to open sidebar</div>
       <el-button @click="openSearch">search Uberon from refs</el-button>
@@ -19,6 +15,7 @@
       <el-button @click="getFacets">Get facets</el-button>
       <el-button @click="toggleCreateData">Create Data/Annotation</el-button>
       <el-button @click="openConnectivitySearch()">Connectivity Search</el-button>
+      <el-button @click="showCellCardExplorer()">Show Cell Card Explorer</el-button>
     </div>
     <SideBar
       :envVars="envVars"
@@ -30,6 +27,7 @@
       :connectivityEntry="connectivityEntry"
       :connectivityKnowledge="connectivityKnowledge"
       :showVisibilityFilter="true"
+      :showCellCards="showCellCards"
       @search-changed="searchChanged($event)"
       @hover-changed="hoverChanged($event)"
       @connectivity-hovered="onConnectivityHovered"
@@ -45,9 +43,7 @@
 import SideBar from './components/SideBar.vue'
 import EventBus from './components/EventBus.js'
 import exampleConnectivityInput from './exampleConnectivityInput.js'
-
-
-const capitalise = (str) => str.charAt(0).toUpperCase() + str.slice(1);
+import { capitalise } from './utils/common.js'
 
 const flatmapQuery = (flatmapApi, sql) => {
   const data = { sql: sql };
@@ -136,6 +132,7 @@ export default {
         BL_SERVER_URL: import.meta.env.VITE_APP_BL_SERVER_URL,
         ROOT_URL: import.meta.env.VITE_APP_ROOT_URL,
         FLATMAPAPI_LOCATION: import.meta.env.VITE_FLATMAPAPI_LOCATION,
+        CELL_CARDS_API: import.meta.env.VITE_APP_CELL_CARDS_API,
       },
       connectivityEntry: [],
       createData: {
@@ -152,6 +149,7 @@ export default {
       query: '',
       filter: [],
       target: [],
+      showCellCards: false,
     }
   },
   methods: {
@@ -366,7 +364,12 @@ export default {
     },
     onConnectivityCollapseChange: function () {
       this.connectivityEntry = [...exampleConnectivityInput]
-    }
+    },
+    showCellCardExplorer: function () {
+      this.showCellCards = true;
+      this.$refs.sideBar.tabClicked({ id: 4, type: 'cellCardExplorer' });
+      this.$refs.sideBar.setDrawerOpen(true);
+    },
   },
   mounted: async function () {
     console.log('mounted app')
@@ -389,6 +392,7 @@ export default {
 }
 body {
   margin: 0px;
+  font-family: $font-family;
 }
 .map-icon {
   color: $app-primary-color;

package/src/assets/fonts.scss

@@ -0,0 +1,3 @@
+@use 'variables' as *;
+@import url('https://fonts.googleapis.com/css?family=Asap:400,400i,500,600,700&display=swap');
+

package/src/assets/styles.scss

@@ -1,7 +1,5 @@
 @use '_variables' as *;
 @forward '_variables';
 
-@import url('https://fonts.googleapis.com/css?family=Asap:400,400i,500,600,700&display=swap');
-
 /* icon font path, required */
 $--color-primary: $app-primary-color !default;