From 90aca65a29fc2eb2a5ad06c97c039398dc6e4885 Mon Sep 17 00:00:00 2001
From: akhuoa <aung.kyaw.hein@auckland.ac.nz>
Date: Thu, 11 Jul 2024 13:40:52 +1200
Subject: [PATCH 1/5] Add image gallery popup and update tooltip

---
 src/components.d.ts                          |   1 +
 src/components/Tooltip/ImageGalleryPopup.vue | 344 +++++++++++++++++++
 src/components/Tooltip/ProvenancePopup.vue   |  83 +++++
 src/components/Tooltip/Tooltip.vue           |  28 +-
 4 files changed, 453 insertions(+), 3 deletions(-)
 create mode 100644 src/components/Tooltip/ImageGalleryPopup.vue

diff --git a/src/components.d.ts b/src/components.d.ts
index d15ca6f..b888a27 100644
--- a/src/components.d.ts
+++ b/src/components.d.ts
@@ -34,6 +34,7 @@ declare module 'vue' {
     ExternalResourceCard: typeof import('./components/Tooltip/ExternalResourceCard.vue')['default']
     HelpModeDialog: typeof import('./components/HelpModeDialog/HelpModeDialog.vue')['default']
     ProvenancePopup: typeof import('./components/Tooltip/ProvenancePopup.vue')['default']
+    ImageGalleryPopup: typeof import('./components/Tooltip/ImageGalleryPopup.vue')['default']
     Tooltip: typeof import('./components/Tooltip/Tooltip.vue')['default']
     TreeControls: typeof import('./components/TreeControls/TreeControls.vue')['default']
   }
diff --git a/src/components/Tooltip/ImageGalleryPopup.vue b/src/components/Tooltip/ImageGalleryPopup.vue
new file mode 100644
index 0000000..c25144c
--- /dev/null
+++ b/src/components/Tooltip/ImageGalleryPopup.vue
@@ -0,0 +1,344 @@
+<template>
+  <div class="main" v-loading="loading">
+      <!-- <div class="block" v-if="entry.title">
+        <span class="title">{{ capitalise(entry.title) }}</span>
+      </div> -->
+      <div class="block">
+        <el-button
+          class="button"
+          @click="showImages = !showImages"
+        >
+          <span v-if="showImages">Hide images</span>
+          <span v-else>View images at this location (Gallery)</span>
+        </el-button>
+        <template :key="index" v-for="(species, index) in speciesFilterTags">
+          <el-tag
+            type="info"
+            class="tag"
+            :class="{ 'active-tag': species.taxon === activeSpecies.taxon}"
+            @close="removeSpeciesFilterTag(species)"
+            @click="filterBySpecies(species)"
+            :closable="species.taxon === activeSpecies.taxon"
+          >
+            {{ species.name }} ({{ species.count }})
+          </el-tag>
+        </template>
+        <div v-if="showImages" class="image-gallery-container">
+          <Gallery  class="gallery" :items="filteredItems" />
+        </div>
+        <el-button
+          class="button"
+          @click="viewImage(imageIframeURL[this.entry.featureId[0]])"
+        >
+          <span>View images at this location (iFrame)</span>
+        </el-button>
+    </div>
+  </div>
+</template>
+
+<script>
+import Gallery from "@abi-software/gallery";
+import "@abi-software/gallery/dist/style.css";
+import {
+  ArrowUp as ElIconArrowUp,
+  ArrowDown as ElIconArrowDown,
+  Warning as ElIconWarning,
+} from '@element-plus/icons-vue'
+/* eslint-disable no-alert, no-console */
+import {
+  ElButton as Button,
+  ElContainer as Container,
+  ElIcon as Icon,
+  ElTag as Tag,
+} from 'element-plus'
+
+import EventBus from './EventBus'
+import flatmapImageMixin from '../mixins/flatmapImageMixin';
+
+const titleCase = (str) => {
+  return str.replace(/\w\S*/g, (t) => {
+    return t.charAt(0).toUpperCase() + t.substr(1).toLowerCase()
+  })
+}
+
+const capitalise = function (str) {
+  if (str) return str.charAt(0).toUpperCase() + str.slice(1)
+  return ''
+}
+
+const imageIframeURL = {
+  'UBERON:0000948': 'https://sparc.biolucida.net/image?c=MjIzNzItY29sLTI1NA%3D%3D',
+  'UBERON:0016508': 'https://sparc.biolucida.net/image?c=MjIzNzQtY29sLTI1NA%3D%3D',
+  'ILX:0793082': 'https://sparc.biolucida.net/image?c=MjIzNzUtY29sLTI1NA%3D%3D'
+}
+
+export default {
+  name: 'ImageGalleryPopup',
+  mixins: [flatmapImageMixin],
+  components: {
+    Button,
+    Container,
+    Icon,
+    Tag,
+    ElIconArrowUp,
+    ElIconArrowDown,
+    ElIconWarning,
+    Gallery,
+  },
+  props: {
+    galleryItems: {
+      type: Array,
+      default: () => [],
+    },
+    entry: {
+      type: Object,
+      default: () => ({
+        destinations: [],
+        origins: [],
+        components: [],
+        destinationsWithDatasets: [],
+        originsWithDatasets: [],
+        componentsWithDatasets: [],
+        resource: undefined,
+      }),
+    },
+  },
+  data: function () {
+    return {
+      controller: undefined,
+      activeSpecies: undefined,
+      loading: false,
+      showImages: false,
+      activeSpecies: { taxon: '', name: ''},
+      imageIframeURL: imageIframeURL,
+      speciesFilterTags: [],
+      filteredItems: [],
+    }
+  },
+  watch: {
+    galleryItems: {
+      handler: function () {
+        this.populateSpeciesFilterTags()
+      },
+      deep: true,
+    },
+  },
+  methods: {
+    removeSpeciesFilterTag: function (species) {
+      this.activeSpecies = { taxon: '', name: '' }
+      this.filteredItems = this.galleryItems
+    },
+    populateSpeciesFilterTags: function () {
+      this.speciesFilterTags = this.findAllSpeciesFromGalleryItems(this.galleryItems)
+    },
+    filterBySpecies: function (species) {
+      this.activeSpecies = species
+      this.filteredItems = this.findImagesForSpeciesFromGalleryItems(this.galleryItems, species.taxon)
+    },
+    titleCase: function (title) {
+      return titleCase(title)
+    },
+    capitalise: function (text) {
+      return capitalise(text)
+    },
+    viewImage: function (url) {
+      this.$emit('view-image', url)
+    }
+  },
+  mounted: function () {
+    this.populateSpeciesFilterTags()
+    this.filteredItems = this.galleryItems
+  },
+}
+</script>
+
+<style lang="scss" scoped>
+
+.display {
+  width: 44px;
+  word-break: normal;
+}
+
+.title {
+  text-align: left;
+  width: 16em;
+  line-height: 1.5em !important;
+  font-size: 1em;
+  font-family: Helvetica;
+  font-weight: 500;
+  /* font-weight: bold; */
+  padding-bottom: 8px;
+}
+
+.block {
+  margin-bottom: 0.5em;
+}
+
+.tag {
+  margin-right: 5px;
+  margin-bottom: 5px;
+  cursor: pointer;
+}
+
+.active-tag {
+  background-color: $app-primary-color;
+  color: #fff;
+}
+
+.icon {
+  right: 0px;
+  position: absolute;
+  top: 10px;
+}
+
+.icon:hover {
+  cursor: pointer;
+}
+
+
+.main {
+  font-size: 14px;
+  text-align: left;
+  line-height: 1.5em;
+  font-family: Asap, sans-serif, Helvetica;
+  font-weight: 400;
+  /* outline: thin red solid; */
+  padding: 1em !important;
+  overflow: hidden;
+  min-width: 18rem;
+}
+
+.title {
+  font-size: 18px;
+  font-weight: 500;
+  font-weight: bold;
+  padding-bottom: 8px;
+  color: rgb(131, 0, 191);
+}
+
+.attribute-title {
+  font-size: 16px;
+  font-weight: 600;
+  /* font-weight: bold; */
+  text-transform: uppercase;
+}
+
+.attribute-content {
+  font-size: 14px;
+  font-weight: 500;
+}
+
+.button {
+  margin-left: 0px !important;
+  margin-top: 0px !important;
+  font-size: 14px !important;
+  background-color: $app-primary-color;
+  color: #fff;
+  & + .button {
+    margin-top: 10px !important;
+  }
+  &:hover {
+    color: #fff !important;
+    background: #ac76c5 !important;
+    border: 1px solid #ac76c5 !important;
+  }
+}
+
+.tooltip-container {
+  &::after,
+  &::before {
+    content: '';
+    display: block;
+    position: absolute;
+    width: 0;
+    height: 0;
+    border-style: solid;
+    flex-shrink: 0;
+  }
+  .tooltip {
+    &::after {
+      display: none;
+    }
+    &::before {
+      display: none;
+    }
+  }
+}
+
+.maplibregl-popup-anchor-bottom {
+  .tooltip-container {
+    &::after,
+    &::before {
+      top: 100%;
+      border-width: 12px;
+    }
+    &::after {
+      margin-top: -1px;
+      border-color: rgb(255, 255, 255) transparent transparent transparent;
+    }
+    &::before {
+      margin: 0 auto;
+      border-color: $app-primary-color transparent transparent transparent;
+    }
+  }
+}
+
+.maplibregl-popup-anchor-top {
+  .tooltip-container {
+    &::after,
+    &::before {
+      top: -24px;
+      border-width: 12px;
+    }
+    &::after {
+      margin-top: 1px;
+      border-color: transparent transparent rgb(255, 255, 255) transparent;
+    }
+    &::before {
+      margin: 0 auto;
+      border-color: transparent transparent $app-primary-color transparent;
+    }
+  }
+}
+
+.content-container {
+  overflow-y: scroll;
+  scrollbar-width: thin !important;
+  max-height: 240px;
+}
+
+.scrollbar::-webkit-scrollbar-track {
+  border-radius: 10px;
+  background-color: #f5f5f5;
+}
+
+.scrollbar::-webkit-scrollbar {
+  width: 12px;
+  right: -12px;
+  background-color: #f5f5f5;
+}
+
+.scrollbar::-webkit-scrollbar-thumb {
+  border-radius: 4px;
+  box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.06);
+  background-color: #979797;
+}
+
+.image-gallery-container {
+  :deep(.gallery) {
+    .gallery-strip {
+      padding: 1rem 0;
+    }
+
+    > div {
+      min-height: max-content !important;
+    }
+  }
+}
+
+/* Fix for chrome bug where under triangle pops up above one on top of it  */
+.selector:not(*:root),
+.tooltip-container::after {
+  top: 99.4%;
+}
+</style>
diff --git a/src/components/Tooltip/ProvenancePopup.vue b/src/components/Tooltip/ProvenancePopup.vue
index 6fea2c4..521ae4e 100644
--- a/src/components/Tooltip/ProvenancePopup.vue
+++ b/src/components/Tooltip/ProvenancePopup.vue
@@ -31,6 +31,24 @@
         </span>
       </el-popover>
     </div>
+    <div class="block">
+      <el-button
+        class="button"
+        @click="showImages = !showImages"
+      >
+        <span v-if="showImages">Hide images</span>
+        <span v-else>View images at this location (Gallery)</span>
+      </el-button>
+      <div v-if="showImages" class="image-gallery-container">
+        <Gallery :items="galleryItems" />
+      </div>
+      <el-button
+        class="button"
+        @click="viewImage(imageIframeURL[this.tooltipEntry.featureId[0]])"
+      >
+        <span>View images at this location (iFrame)</span>
+      </el-button>
+    </div>
     <div
       v-show="showDetails"
       class="hide"
@@ -171,6 +189,20 @@
 </template>
 
 <script>
+import Gallery from "@abi-software/gallery";
+import "@abi-software/gallery/dist/style.css";
+import {
+  ArrowUp as ElIconArrowUp,
+  ArrowDown as ElIconArrowDown,
+  Warning as ElIconWarning,
+} from '@element-plus/icons-vue'
+/* eslint-disable no-alert, no-console */
+import {
+  ElButton as Button,
+  ElContainer as Container,
+  ElIcon as Icon,
+} from 'element-plus'
+
 import EventBus from "../EventBus.js";
 
 const titleCase = (str) => {
@@ -184,8 +216,41 @@ const capitalise = function (str) {
   return "";
 };
 
+// TODO: temp data for testing
+const galleryItems = [
+  {
+    title: 'Title 1',
+    type: 'data1',
+    userData: 'https://sparc.science/',
+  },
+  {
+    title: 'Title 2',
+    type: 'data2',
+    link: 'https://sparc.science/',
+  },
+  {
+    title: 'Title 3',
+    type: 'data3',
+    link: 'https://sparc.science/',
+  },
+]
+const imageIframeURL = {
+  'UBERON:0000948': 'https://sparc.biolucida.net/image?c=MjIzNzItY29sLTI1NA%3D%3D',
+  'UBERON:0016508': 'https://sparc.biolucida.net/image?c=MjIzNzQtY29sLTI1NA%3D%3D',
+  'ILX:0793082': 'https://sparc.biolucida.net/image?c=MjIzNzUtY29sLTI1NA%3D%3D'
+}
+
 export default {
   name: "ProvenancePopup",
+  components: {
+    Button,
+    Container,
+    Icon,
+    ElIconArrowUp,
+    ElIconArrowDown,
+    ElIconWarning,
+    Gallery,
+  },
   props: {
     tooltipEntry: {
       type: Object,
@@ -209,6 +274,9 @@ export default {
       loading: false,
       showToolip: false,
       showDetails: false,
+      showImages: false,
+      galleryItems: galleryItems,
+      imageIframeURL: imageIframeURL,
       originDescriptions: {
         motor: "is the location of the initial cell body of the circuit",
         sensory: "is the location of the initial cell body in the PNS circuit",
@@ -280,6 +348,9 @@ export default {
     pubmedSearchUrlUpdate: function (val) {
       this.pubmedSearchUrl = val;
     },
+    viewImage: function (url) {
+      this.$emit('view-image', url);
+    },
   },
 };
 </script>
@@ -510,6 +581,18 @@ export default {
   background-color: #979797;
 }
 
+.image-gallery-container {
+  :deep(.gallery) {
+    .gallery-strip {
+      padding: 1rem 0;
+    }
+
+    > div {
+      min-height: max-content !important;
+    }
+  }
+}
+
 /* Fix for chrome bug where under triangle pops up above one on top of it  */
 .selector:not(*:root),
 .tooltip-container::after {
diff --git a/src/components/Tooltip/Tooltip.vue b/src/components/Tooltip/Tooltip.vue
index a942fd5..3a1be28 100644
--- a/src/components/Tooltip/Tooltip.vue
+++ b/src/components/Tooltip/Tooltip.vue
@@ -1,13 +1,22 @@
 <template>
   <div class="tooltip-container" id="tooltip-container">
-    <template v-if="annotationDisplay">
+    <template v-if="tooltipType === 'annotation' && annotationDisplay">
       <annotation-popup
         :annotationEntry="annotationEntry"
         @annotation="$emit('annotation', $event)"
       />
     </template>
-    <template v-else>
-      <provenance-popup :tooltipEntry="tooltipEntry" />
+    <template v-if="tooltipType === 'provenance'">
+      <provenance-popup
+        :tooltipEntry="tooltipEntry"
+        @view-image="viewImage"
+      />
+    </template>
+    <template v-if="tooltipType === 'image-gallery'">
+      <image-gallery-popup
+        :galleryItems="galleryItems"
+        @viewImage="viewImage"
+      />
     </template>
   </div>
 </template>
@@ -21,6 +30,10 @@ export default {
     tooltipEntry: {
       type: Object,
     },
+    tooltipType: {
+      type: String,
+      default: 'provenance',
+    },
     annotationDisplay: {
       type: Boolean,
       default: false,
@@ -28,6 +41,10 @@ export default {
     annotationEntry: {
       type: Object,
     },
+    galleryItems: {
+      type: Array,
+      default: () => [],
+    },
   },
   mounted: function() {
     // Emit events from child components
@@ -35,6 +52,11 @@ export default {
       this.$emit("onActionClick", data);
     });
   },
+  methods: {
+    viewImage: function (url) {
+      this.$emit('view-image', url)
+    }
+  }
 };
 </script>
 

From 547df089f9b85a58e73a4e3dfc70d7c46a058a1a Mon Sep 17 00:00:00 2001
From: akhuoa <aung.kyaw.hein@auckland.ac.nz>
Date: Thu, 11 Jul 2024 14:31:50 +1200
Subject: [PATCH 2/5] Add iframe-image-dialog and missing gallery package

---
 package-lock.json                             | 208 +++++++++++++-----
 package.json                                  |   1 +
 .../ImageDialog/IframeImageDialog.vue         |  70 ++++++
 src/components/index.js                       |   3 +-
 4 files changed, 230 insertions(+), 52 deletions(-)
 create mode 100644 src/components/ImageDialog/IframeImageDialog.vue

diff --git a/package-lock.json b/package-lock.json
index d724d1f..bc22a81 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,13 +1,14 @@
 {
   "name": "@abi-software/map-utilities",
-  "version": "0.0.0-beta.4",
+  "version": "0.0.0-beta.5",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "@abi-software/map-utilities",
-      "version": "0.0.0-beta.4",
+      "version": "0.0.0-beta.5",
       "dependencies": {
+        "@abi-software/gallery": "^1.1.0",
         "@abi-software/svg-sprite": "^1.0.0",
         "@element-plus/icons-vue": "^2.3.1",
         "element-plus": "^2.7.3",
@@ -21,6 +22,64 @@
         "vite": "^5.2.8"
       }
     },
+    "node_modules/@abi-software/gallery": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/@abi-software/gallery/-/gallery-1.1.0.tgz",
+      "integrity": "sha512-TZCqcqxZdC4wW35KJwBq96yXX8cd7pjGSqvaFLEtWhbe+mqsSrqhgnk/jbvN14/JtOFyo9S7KpBFKvLHFrwWJA==",
+      "dependencies": {
+        "axios": "^1.6.5",
+        "element-plus": "^2.4.4",
+        "unplugin-vue-components": "^0.26.0",
+        "vue": "^3.3.13"
+      }
+    },
+    "node_modules/@abi-software/gallery/node_modules/local-pkg": {
+      "version": "0.4.3",
+      "resolved": "https://registry.npmjs.org/local-pkg/-/local-pkg-0.4.3.tgz",
+      "integrity": "sha512-SFppqq5p42fe2qcZQqqEOiVRXl+WCP1MdT6k7BDEW1j++sp5fIY+/fdRQitvKgB5BrBcmrs5m/L0v2FrU5MY1g==",
+      "engines": {
+        "node": ">=14"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/antfu"
+      }
+    },
+    "node_modules/@abi-software/gallery/node_modules/unplugin-vue-components": {
+      "version": "0.26.0",
+      "resolved": "https://registry.npmjs.org/unplugin-vue-components/-/unplugin-vue-components-0.26.0.tgz",
+      "integrity": "sha512-s7IdPDlnOvPamjunVxw8kNgKNK8A5KM1YpK5j/p97jEKTjlPNrA0nZBiSfAKKlK1gWZuyWXlKL5dk3EDw874LQ==",
+      "dependencies": {
+        "@antfu/utils": "^0.7.6",
+        "@rollup/pluginutils": "^5.0.4",
+        "chokidar": "^3.5.3",
+        "debug": "^4.3.4",
+        "fast-glob": "^3.3.1",
+        "local-pkg": "^0.4.3",
+        "magic-string": "^0.30.3",
+        "minimatch": "^9.0.3",
+        "resolve": "^1.22.4",
+        "unplugin": "^1.4.0"
+      },
+      "engines": {
+        "node": ">=14"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/antfu"
+      },
+      "peerDependencies": {
+        "@babel/parser": "^7.15.8",
+        "@nuxt/kit": "^3.2.2",
+        "vue": "2 || 3"
+      },
+      "peerDependenciesMeta": {
+        "@babel/parser": {
+          "optional": true
+        },
+        "@nuxt/kit": {
+          "optional": true
+        }
+      }
+    },
     "node_modules/@abi-software/svg-sprite": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/@abi-software/svg-sprite/-/svg-sprite-1.0.0.tgz",
@@ -33,7 +92,6 @@
       "version": "0.7.8",
       "resolved": "https://registry.npmjs.org/@antfu/utils/-/utils-0.7.8.tgz",
       "integrity": "sha512-rWQkqXRESdjXtc+7NRfK9lASQjpXJu1ayp7qi1d23zZorY+wBHVLHHoVcMsEnkqEBWTFqbztO7/QdJFzyEcLTg==",
-      "dev": true,
       "funding": {
         "url": "https://github.com/sponsors/antfu"
       }
@@ -464,7 +522,6 @@
       "version": "2.1.5",
       "resolved": "https://registry.npmjs.org/@nodelib/fs.scandir/-/fs.scandir-2.1.5.tgz",
       "integrity": "sha512-vq24Bq3ym5HEQm2NKCr3yXDwjc7vTsEThRDnkp2DK9p1uqLR+DHurm/NOTo0KG7HYHU7eppKZj3MyqYuMBf62g==",
-      "dev": true,
       "dependencies": {
         "@nodelib/fs.stat": "2.0.5",
         "run-parallel": "^1.1.9"
@@ -477,7 +534,6 @@
       "version": "2.0.5",
       "resolved": "https://registry.npmjs.org/@nodelib/fs.stat/-/fs.stat-2.0.5.tgz",
       "integrity": "sha512-RkhPPp2zrqDAQA/2jNhnztcPAlv64XdhIp7a7454A5ovI7Bukxgt7MX7udwAu3zg1DcpPU0rz3VV1SeaqvY4+A==",
-      "dev": true,
       "engines": {
         "node": ">= 8"
       }
@@ -486,7 +542,6 @@
       "version": "1.2.8",
       "resolved": "https://registry.npmjs.org/@nodelib/fs.walk/-/fs.walk-1.2.8.tgz",
       "integrity": "sha512-oGB+UxlgWcgQkgwo8GcEGwemoTFt3FIO9ababBmaGwXIoBKZ+GTy0pP185beGg7Llih/NSHSV2XAs1lnznocSg==",
-      "dev": true,
       "dependencies": {
         "@nodelib/fs.scandir": "2.1.5",
         "fastq": "^1.6.0"
@@ -509,7 +564,6 @@
       "version": "5.1.0",
       "resolved": "https://registry.npmjs.org/@rollup/pluginutils/-/pluginutils-5.1.0.tgz",
       "integrity": "sha512-XTIWOPPcpvyKI6L1NHo0lFlCyznUEyPmPY1mc3KpPVDYulHSTvyeLNVW00QTLIAFNhR3kYnJTQHeGqU4M3n09g==",
-      "dev": true,
       "dependencies": {
         "@types/estree": "^1.0.0",
         "estree-walker": "^2.0.2",
@@ -738,8 +792,7 @@
     "node_modules/@types/estree": {
       "version": "1.0.5",
       "resolved": "https://registry.npmjs.org/@types/estree/-/estree-1.0.5.tgz",
-      "integrity": "sha512-/kYRxGDLWzHOB7q+wtSUQlFrtcdUccpfy+X+9iMBpHK8QLLhx2wIPYuS5DYtR9Wa/YlZAbIovy7qVdB1Aq6Lyw==",
-      "dev": true
+      "integrity": "sha512-/kYRxGDLWzHOB7q+wtSUQlFrtcdUccpfy+X+9iMBpHK8QLLhx2wIPYuS5DYtR9Wa/YlZAbIovy7qVdB1Aq6Lyw=="
     },
     "node_modules/@types/lodash": {
       "version": "4.17.4",
@@ -949,7 +1002,6 @@
       "version": "8.11.3",
       "resolved": "https://registry.npmjs.org/acorn/-/acorn-8.11.3.tgz",
       "integrity": "sha512-Y9rRfJG5jcKOE0CLisYbojUjIrIEE7AGMzA/Sm4BslANhbS+cDMpgBdcPT91oJ7OuJ9hYJBx59RjbhxVnrF8Xg==",
-      "dev": true,
       "bin": {
         "acorn": "bin/acorn"
       },
@@ -961,7 +1013,6 @@
       "version": "3.1.3",
       "resolved": "https://registry.npmjs.org/anymatch/-/anymatch-3.1.3.tgz",
       "integrity": "sha512-KMReFUr0B4t+D+OBkjR3KYqvocp2XaSzO55UcB6mgQMd3KbcE+mWTyvVV7D/zsdEbNnV6acZUutkiHQXvTr1Rw==",
-      "dev": true,
       "dependencies": {
         "normalize-path": "^3.0.0",
         "picomatch": "^2.0.4"
@@ -975,17 +1026,30 @@
       "resolved": "https://registry.npmjs.org/async-validator/-/async-validator-4.2.5.tgz",
       "integrity": "sha512-7HhHjtERjqlNbZtqNqy2rckN/SpOOlmDliet+lP7k+eKZEjPk3DgyeU9lIXLdeLz0uBbbVp+9Qdow9wJWgwwfg=="
     },
+    "node_modules/asynckit": {
+      "version": "0.4.0",
+      "resolved": "https://registry.npmjs.org/asynckit/-/asynckit-0.4.0.tgz",
+      "integrity": "sha512-Oei9OH4tRh0YqU3GxhX79dM/mwVgvbZJaSNaRk+bshkj0S5cfHcgYakreBjrHwatXKbz+IoIdYLxrKim2MjW0Q=="
+    },
+    "node_modules/axios": {
+      "version": "1.7.2",
+      "resolved": "https://registry.npmjs.org/axios/-/axios-1.7.2.tgz",
+      "integrity": "sha512-2A8QhOMrbomlDuiLeK9XibIBzuHeRcqqNOHp0Cyp5EoJ1IFDh+XZH3A6BkXtv0K4gFGCI0Y4BM7B1wOEi0Rmgw==",
+      "dependencies": {
+        "follow-redirects": "^1.15.6",
+        "form-data": "^4.0.0",
+        "proxy-from-env": "^1.1.0"
+      }
+    },
     "node_modules/balanced-match": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-1.0.2.tgz",
-      "integrity": "sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw==",
-      "dev": true
+      "integrity": "sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw=="
     },
     "node_modules/binary-extensions": {
       "version": "2.3.0",
       "resolved": "https://registry.npmjs.org/binary-extensions/-/binary-extensions-2.3.0.tgz",
       "integrity": "sha512-Ceh+7ox5qe7LJuLHoY0feh3pHuUDHAcRUeyL2VYghZwfpkNIy/+8Ocg0a3UuSoYzavmylwuLWQOf3hl0jjMMIw==",
-      "dev": true,
       "engines": {
         "node": ">=8"
       },
@@ -997,7 +1061,6 @@
       "version": "2.0.1",
       "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-2.0.1.tgz",
       "integrity": "sha512-XnAIvQ8eM+kC6aULx6wuQiwVsnzsi9d3WxzV3FpWTGA19F621kwdbsAcFKXgKUHZWsy+mY6iL1sHTxWEFCytDA==",
-      "dev": true,
       "dependencies": {
         "balanced-match": "^1.0.0"
       }
@@ -1006,7 +1069,6 @@
       "version": "3.0.3",
       "resolved": "https://registry.npmjs.org/braces/-/braces-3.0.3.tgz",
       "integrity": "sha512-yQbXgO/OSZVD2IsiLlro+7Hf6Q18EJrKSEsdoMzKePKXct3gvD8oLcOQdIzGupr5Fj+EDe8gO/lxc1BzfMpxvA==",
-      "dev": true,
       "dependencies": {
         "fill-range": "^7.1.1"
       },
@@ -1018,7 +1080,6 @@
       "version": "3.6.0",
       "resolved": "https://registry.npmjs.org/chokidar/-/chokidar-3.6.0.tgz",
       "integrity": "sha512-7VT13fmjotKpGipCW9JEQAusEPE+Ei8nl6/g4FBAmIm0GOOLMua9NDDo/DWp0ZAxCr3cPq5ZpBqmPAQgDda2Pw==",
-      "dev": true,
       "dependencies": {
         "anymatch": "~3.1.2",
         "braces": "~3.0.2",
@@ -1038,6 +1099,17 @@
         "fsevents": "~2.3.2"
       }
     },
+    "node_modules/combined-stream": {
+      "version": "1.0.8",
+      "resolved": "https://registry.npmjs.org/combined-stream/-/combined-stream-1.0.8.tgz",
+      "integrity": "sha512-FQN4MRfuJeHf7cBbBMJFXhKSDq+2kAArBlmRBvcvFE5BB1HZKXtSFASDhdlz9zOYwxh8lDdnvmMOe/+5cdoEdg==",
+      "dependencies": {
+        "delayed-stream": "~1.0.0"
+      },
+      "engines": {
+        "node": ">= 0.8"
+      }
+    },
     "node_modules/confbox": {
       "version": "0.1.7",
       "resolved": "https://registry.npmjs.org/confbox/-/confbox-0.1.7.tgz",
@@ -1058,7 +1130,6 @@
       "version": "4.3.4",
       "resolved": "https://registry.npmjs.org/debug/-/debug-4.3.4.tgz",
       "integrity": "sha512-PRWFHuSU3eDtQJPvnNY7Jcket1j0t5OuOsFzPPzsekD52Zl8qUfFIPEiswXqIvHWGVHOgX+7G/vCNNhehwxfkQ==",
-      "dev": true,
       "dependencies": {
         "ms": "2.1.2"
       },
@@ -1071,6 +1142,14 @@
         }
       }
     },
+    "node_modules/delayed-stream": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/delayed-stream/-/delayed-stream-1.0.0.tgz",
+      "integrity": "sha512-ZySD7Nf91aLB0RxL4KGrKHBXl7Eds1DAmEdcoVawXnLD7SDhpNgtuII2aAkg7a7QS41jxPSZ17p4VdGnMHk3MQ==",
+      "engines": {
+        "node": ">=0.4.0"
+      }
+    },
     "node_modules/element-plus": {
       "version": "2.7.3",
       "resolved": "https://registry.npmjs.org/element-plus/-/element-plus-2.7.3.tgz",
@@ -1159,7 +1238,6 @@
       "version": "3.3.2",
       "resolved": "https://registry.npmjs.org/fast-glob/-/fast-glob-3.3.2.tgz",
       "integrity": "sha512-oX2ruAFQwf/Orj8m737Y5adxDQO0LAB7/S5MnxCdTNDd4p6BsyIVsv9JQsATbTSq8KHRpLwIHbVlUNatxd+1Ow==",
-      "dev": true,
       "dependencies": {
         "@nodelib/fs.stat": "^2.0.2",
         "@nodelib/fs.walk": "^1.2.3",
@@ -1175,7 +1253,6 @@
       "version": "1.17.1",
       "resolved": "https://registry.npmjs.org/fastq/-/fastq-1.17.1.tgz",
       "integrity": "sha512-sRVD3lWVIXWg6By68ZN7vho9a1pQcN/WBFaAAsDDFzlJjvoGx0P8z7V1t72grFJfJhu3YPZBuu25f7Kaw2jN1w==",
-      "dev": true,
       "dependencies": {
         "reusify": "^1.0.4"
       }
@@ -1184,7 +1261,6 @@
       "version": "7.1.1",
       "resolved": "https://registry.npmjs.org/fill-range/-/fill-range-7.1.1.tgz",
       "integrity": "sha512-YsGpe3WHLK8ZYi4tWDg2Jy3ebRz2rXowDxnld4bkQB00cc/1Zw9AWnC0i9ztDJitivtQvaI9KaLyKrc+hBW0yg==",
-      "dev": true,
       "dependencies": {
         "to-regex-range": "^5.0.1"
       },
@@ -1192,11 +1268,42 @@
         "node": ">=8"
       }
     },
+    "node_modules/follow-redirects": {
+      "version": "1.15.6",
+      "resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.15.6.tgz",
+      "integrity": "sha512-wWN62YITEaOpSK584EZXJafH1AGpO8RVgElfkuXbTOrPX4fIfOyEpW/CsiNd8JdYrAoOvafRTOEnvsO++qCqFA==",
+      "funding": [
+        {
+          "type": "individual",
+          "url": "https://github.com/sponsors/RubenVerborgh"
+        }
+      ],
+      "engines": {
+        "node": ">=4.0"
+      },
+      "peerDependenciesMeta": {
+        "debug": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/form-data": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/form-data/-/form-data-4.0.0.tgz",
+      "integrity": "sha512-ETEklSGi5t0QMZuiXoA/Q6vcnxcLQP5vdugSpuAyi6SVGi2clPPp+xgEhuMaHC+zGgn31Kd235W35f7Hykkaww==",
+      "dependencies": {
+        "asynckit": "^0.4.0",
+        "combined-stream": "^1.0.8",
+        "mime-types": "^2.1.12"
+      },
+      "engines": {
+        "node": ">= 6"
+      }
+    },
     "node_modules/fsevents": {
       "version": "2.3.3",
       "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.3.tgz",
       "integrity": "sha512-5xoDfX+fL7faATnagmWPpbFtwh/R77WmMMqqHGS65C3vvB0YHrgF+B1YmZ3441tMj5n63k0212XNoJwzlhffQw==",
-      "dev": true,
       "hasInstallScript": true,
       "optional": true,
       "os": [
@@ -1210,7 +1317,6 @@
       "version": "1.1.2",
       "resolved": "https://registry.npmjs.org/function-bind/-/function-bind-1.1.2.tgz",
       "integrity": "sha512-7XHNxH7qX9xG5mIwxkhumTox/MIRNcOgDrxWsMt2pAr23WHp6MrRlN7FBSFpCpr+oVO0F744iUgR82nJMfG2SA==",
-      "dev": true,
       "funding": {
         "url": "https://github.com/sponsors/ljharb"
       }
@@ -1219,7 +1325,6 @@
       "version": "5.1.2",
       "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-5.1.2.tgz",
       "integrity": "sha512-AOIgSQCepiJYwP3ARnGx+5VnTu2HBYdzbGP45eLw1vr3zB3vZLeyed1sC9hnbcOc9/SrMyM5RPQrkGz4aS9Zow==",
-      "dev": true,
       "dependencies": {
         "is-glob": "^4.0.1"
       },
@@ -1231,7 +1336,6 @@
       "version": "2.0.2",
       "resolved": "https://registry.npmjs.org/hasown/-/hasown-2.0.2.tgz",
       "integrity": "sha512-0hJU9SCPvmMzIBdZFqNPXWa6dqh7WdH0cII9y+CyS8rG3nL48Bclra9HmKhVVUHyPWNH5Y7xDwAB7bfgSjkUMQ==",
-      "dev": true,
       "dependencies": {
         "function-bind": "^1.1.2"
       },
@@ -1249,7 +1353,6 @@
       "version": "2.1.0",
       "resolved": "https://registry.npmjs.org/is-binary-path/-/is-binary-path-2.1.0.tgz",
       "integrity": "sha512-ZMERYes6pDydyuGidse7OsHxtbI7WVeUEozgR/g7rd0xUimYNlvZRE/K2MgZTjWy725IfelLeVcEM97mmtRGXw==",
-      "dev": true,
       "dependencies": {
         "binary-extensions": "^2.0.0"
       },
@@ -1261,7 +1364,6 @@
       "version": "2.13.1",
       "resolved": "https://registry.npmjs.org/is-core-module/-/is-core-module-2.13.1.tgz",
       "integrity": "sha512-hHrIjvZsftOsvKSn2TRYl63zvxsgE0K+0mYMoH6gD4omR5IWB2KynivBQczo3+wF1cCkjzvptnI9Q0sPU66ilw==",
-      "dev": true,
       "dependencies": {
         "hasown": "^2.0.0"
       },
@@ -1273,7 +1375,6 @@
       "version": "2.1.1",
       "resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-2.1.1.tgz",
       "integrity": "sha512-SbKbANkN603Vi4jEZv49LeVJMn4yGwsbzZworEoyEiutsN3nJYdbO36zfhGJ6QEDpOZIFkDtnq5JRxmvl3jsoQ==",
-      "dev": true,
       "engines": {
         "node": ">=0.10.0"
       }
@@ -1282,7 +1383,6 @@
       "version": "4.0.3",
       "resolved": "https://registry.npmjs.org/is-glob/-/is-glob-4.0.3.tgz",
       "integrity": "sha512-xelSayHH36ZgE7ZWhli7pW34hNbNl8Ojv5KVmkJD4hBdD3th8Tfk9vYasLM+mXWOZhFkgZfxhLSnrwRr4elSSg==",
-      "dev": true,
       "dependencies": {
         "is-extglob": "^2.1.1"
       },
@@ -1294,7 +1394,6 @@
       "version": "7.0.0",
       "resolved": "https://registry.npmjs.org/is-number/-/is-number-7.0.0.tgz",
       "integrity": "sha512-41Cifkg6e8TylSpdtTpeLVMqvSBEVzTttHvERD741+pnZ8ANv0004MRL43QKPDlK9cGvNp6NZWZUBlbGXYxxng==",
-      "dev": true,
       "engines": {
         "node": ">=0.12.0"
       }
@@ -1352,7 +1451,6 @@
       "version": "1.4.1",
       "resolved": "https://registry.npmjs.org/merge2/-/merge2-1.4.1.tgz",
       "integrity": "sha512-8q7VEgMJW4J8tcfVPy8g09NcQwZdbwFEqhe/WZkoIzjn/3TGDwtOCYtXGxA3O8tPzpczCCDgv+P2P5y00ZJOOg==",
-      "dev": true,
       "engines": {
         "node": ">= 8"
       }
@@ -1361,7 +1459,6 @@
       "version": "4.0.7",
       "resolved": "https://registry.npmjs.org/micromatch/-/micromatch-4.0.7.tgz",
       "integrity": "sha512-LPP/3KorzCwBxfeUuZmaR6bG2kdeHSbe0P2tY3FLRU4vYrjYz5hI4QZwV0njUx3jeuKe67YukQ1LSPZBKDqO/Q==",
-      "dev": true,
       "dependencies": {
         "braces": "^3.0.3",
         "picomatch": "^2.3.1"
@@ -1370,11 +1467,29 @@
         "node": ">=8.6"
       }
     },
+    "node_modules/mime-db": {
+      "version": "1.52.0",
+      "resolved": "https://registry.npmjs.org/mime-db/-/mime-db-1.52.0.tgz",
+      "integrity": "sha512-sPU4uV7dYlvtWJxwwxHD0PuihVNiE7TyAbQ5SWxDCB9mUYvOgroQOwYQQOKPJ8CIbE+1ETVlOoK1UC2nU3gYvg==",
+      "engines": {
+        "node": ">= 0.6"
+      }
+    },
+    "node_modules/mime-types": {
+      "version": "2.1.35",
+      "resolved": "https://registry.npmjs.org/mime-types/-/mime-types-2.1.35.tgz",
+      "integrity": "sha512-ZDY+bPm5zTTF+YpCrAU9nK0UgICYPT0QtT1NZWFv4s++TNkcgVaT0g6+4R2uI4MjQjzysHB1zxuWL50hzaeXiw==",
+      "dependencies": {
+        "mime-db": "1.52.0"
+      },
+      "engines": {
+        "node": ">= 0.6"
+      }
+    },
     "node_modules/minimatch": {
       "version": "9.0.4",
       "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-9.0.4.tgz",
       "integrity": "sha512-KqWh+VchfxcMNRAJjj2tnsSJdNbHsVgnkBhTNrW7AjVo6OvLtxw8zfT9oLw1JSohlFzJ8jCoTgaoXvJ+kHt6fw==",
-      "dev": true,
       "dependencies": {
         "brace-expansion": "^2.0.1"
       },
@@ -1405,8 +1520,7 @@
     "node_modules/ms": {
       "version": "2.1.2",
       "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.2.tgz",
-      "integrity": "sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w==",
-      "dev": true
+      "integrity": "sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w=="
     },
     "node_modules/nanoid": {
       "version": "3.3.7",
@@ -1429,7 +1543,6 @@
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/normalize-path/-/normalize-path-3.0.0.tgz",
       "integrity": "sha512-6eZs5Ls3WtCisHWp9S2GUy8dqkpGi4BVSz3GaqiE6ezub0512ESztXUwUB6C6IKbQkY2Pnb/mD4WYojCRwcwLA==",
-      "dev": true,
       "engines": {
         "node": ">=0.10.0"
       }
@@ -1442,8 +1555,7 @@
     "node_modules/path-parse": {
       "version": "1.0.7",
       "resolved": "https://registry.npmjs.org/path-parse/-/path-parse-1.0.7.tgz",
-      "integrity": "sha512-LDJzPVEEEPR+y48z93A0Ed0yXb8pAByGWo/k5YYdYgpY2/2EsOsksJrq7lOHxryrVOn1ejG6oAp8ahvOIQD8sw==",
-      "dev": true
+      "integrity": "sha512-LDJzPVEEEPR+y48z93A0Ed0yXb8pAByGWo/k5YYdYgpY2/2EsOsksJrq7lOHxryrVOn1ejG6oAp8ahvOIQD8sw=="
     },
     "node_modules/pathe": {
       "version": "1.1.2",
@@ -1460,7 +1572,6 @@
       "version": "2.3.1",
       "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-2.3.1.tgz",
       "integrity": "sha512-JU3teHTNjmE2VCGFzuY8EXzCDVwEqB2a8fsIvwaStHhAWJEeVd1o1QD80CU6+ZdEXXSLbSsuLwJjkCBWqRQUVA==",
-      "dev": true,
       "engines": {
         "node": ">=8.6"
       },
@@ -1506,11 +1617,15 @@
         "node": "^10 || ^12 || >=14"
       }
     },
+    "node_modules/proxy-from-env": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/proxy-from-env/-/proxy-from-env-1.1.0.tgz",
+      "integrity": "sha512-D+zkORCbA9f1tdWRK0RaCR3GPv50cMxcrz4X8k5LTSUD1Dkw47mKJEZQNunItRTkWwgtaUSo1RVFRIG9ZXiFYg=="
+    },
     "node_modules/queue-microtask": {
       "version": "1.2.3",
       "resolved": "https://registry.npmjs.org/queue-microtask/-/queue-microtask-1.2.3.tgz",
       "integrity": "sha512-NuaNSa6flKT5JaSYQzJok04JzTL1CA6aGhv5rfLW3PgqA+M2ChpZQnAC8h8i4ZFkBS8X5RqkDBHA7r4hej3K9A==",
-      "dev": true,
       "funding": [
         {
           "type": "github",
@@ -1530,7 +1645,6 @@
       "version": "3.6.0",
       "resolved": "https://registry.npmjs.org/readdirp/-/readdirp-3.6.0.tgz",
       "integrity": "sha512-hOS089on8RduqdbhvQ5Z37A0ESjsqz6qnRcffsMU3495FuTdqSm+7bhJ29JvIOsBDEEnan5DPu9t3To9VRlMzA==",
-      "dev": true,
       "dependencies": {
         "picomatch": "^2.2.1"
       },
@@ -1542,7 +1656,6 @@
       "version": "1.22.8",
       "resolved": "https://registry.npmjs.org/resolve/-/resolve-1.22.8.tgz",
       "integrity": "sha512-oKWePCxqpd6FlLvGV1VU0x7bkPmmCNolxzjMf4NczoDnQcIWrAF+cPtZn5i6n+RfD2d9i0tzpKnG6Yk168yIyw==",
-      "dev": true,
       "dependencies": {
         "is-core-module": "^2.13.0",
         "path-parse": "^1.0.7",
@@ -1559,7 +1672,6 @@
       "version": "1.0.4",
       "resolved": "https://registry.npmjs.org/reusify/-/reusify-1.0.4.tgz",
       "integrity": "sha512-U9nH88a3fc/ekCF1l0/UP1IosiuIjyTh7hBvXVMHYgVcfGvt897Xguj2UOLDeI5BG2m7/uwyaLVT6fbtCwTyzw==",
-      "dev": true,
       "engines": {
         "iojs": ">=1.0.0",
         "node": ">=0.10.0"
@@ -1569,7 +1681,7 @@
       "version": "4.18.0",
       "resolved": "https://registry.npmjs.org/rollup/-/rollup-4.18.0.tgz",
       "integrity": "sha512-QmJz14PX3rzbJCN1SG4Xe/bAAX2a6NpCP8ab2vfu2GiUr8AQcr2nCV/oEO3yneFarB67zk8ShlIyWb2LGTb3Sg==",
-      "dev": true,
+      "devOptional": true,
       "dependencies": {
         "@types/estree": "1.0.5"
       },
@@ -1604,7 +1716,6 @@
       "version": "1.2.0",
       "resolved": "https://registry.npmjs.org/run-parallel/-/run-parallel-1.2.0.tgz",
       "integrity": "sha512-5l4VyZR86LZ/lDxZTR6jqL8AFE2S0IFLMP26AbjsLVADxHdhB/c0GUsH+y39UfCi3dzz8OlQuPmnaJOMoDHQBA==",
-      "dev": true,
       "funding": [
         {
           "type": "github",
@@ -1652,7 +1763,6 @@
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/supports-preserve-symlinks-flag/-/supports-preserve-symlinks-flag-1.0.0.tgz",
       "integrity": "sha512-ot0WnXS9fgdkgIcePe6RHNk1WA8+muPa6cSjeR3V8K27q9BB1rTE3R1p7Hv0z1ZyAc8s6Vvv8DIyWf681MAt0w==",
-      "dev": true,
       "engines": {
         "node": ">= 0.4"
       },
@@ -1664,7 +1774,6 @@
       "version": "5.0.1",
       "resolved": "https://registry.npmjs.org/to-regex-range/-/to-regex-range-5.0.1.tgz",
       "integrity": "sha512-65P7iz6X5yEr1cwcgvQxbbIw7Uk3gOy5dIdtZ4rDveLqhrdJP+Li/Hx6tyK0NEb+2GCyneCMJiGqrADCSNk8sQ==",
-      "dev": true,
       "dependencies": {
         "is-number": "^7.0.0"
       },
@@ -1682,7 +1791,6 @@
       "version": "1.10.1",
       "resolved": "https://registry.npmjs.org/unplugin/-/unplugin-1.10.1.tgz",
       "integrity": "sha512-d6Mhq8RJeGA8UfKCu54Um4lFA0eSaRa3XxdAJg8tIdxbu1ubW0hBCZUL7yI2uGyYCRndvbK8FLHzqy2XKfeMsg==",
-      "dev": true,
       "dependencies": {
         "acorn": "^8.11.3",
         "chokidar": "^3.6.0",
@@ -1809,7 +1917,6 @@
       "version": "3.2.3",
       "resolved": "https://registry.npmjs.org/webpack-sources/-/webpack-sources-3.2.3.tgz",
       "integrity": "sha512-/DyMEOrDgLKKIG0fmvtz+4dUX/3Ghozwgm6iPp8KRhvn+eQf9+Q7GWxVNMk3+uCPWfdXYC4ExGBckIXdFEfH1w==",
-      "dev": true,
       "engines": {
         "node": ">=10.13.0"
       }
@@ -1817,8 +1924,7 @@
     "node_modules/webpack-virtual-modules": {
       "version": "0.6.1",
       "resolved": "https://registry.npmjs.org/webpack-virtual-modules/-/webpack-virtual-modules-0.6.1.tgz",
-      "integrity": "sha512-poXpCylU7ExuvZK8z+On3kX+S8o/2dQ/SVYueKA0D4WEMXROXgY8Ez50/bQEUmvoSMMrWcrJqCHuhAbsiwg7Dg==",
-      "dev": true
+      "integrity": "sha512-poXpCylU7ExuvZK8z+On3kX+S8o/2dQ/SVYueKA0D4WEMXROXgY8Ez50/bQEUmvoSMMrWcrJqCHuhAbsiwg7Dg=="
     }
   }
 }
diff --git a/package.json b/package.json
index 960ee09..02c97de 100644
--- a/package.json
+++ b/package.json
@@ -25,6 +25,7 @@
     "./src/*": "./src/*"
   },
   "dependencies": {
+    "@abi-software/gallery": "^1.1.0",
     "@abi-software/svg-sprite": "^1.0.0",
     "@element-plus/icons-vue": "^2.3.1",
     "element-plus": "^2.7.3",
diff --git a/src/components/ImageDialog/IframeImageDialog.vue b/src/components/ImageDialog/IframeImageDialog.vue
new file mode 100644
index 0000000..e04de1a
--- /dev/null
+++ b/src/components/ImageDialog/IframeImageDialog.vue
@@ -0,0 +1,70 @@
+<template>
+  <div class="image-dialog" v-if="imageIframeOpen">
+    <div class="map-iframe-container">
+      <iframe
+        class="my-iframe"
+        :src="imageIframeURL">
+      </iframe>
+    </div>
+    <button
+      class="image-dialog-close"
+      @click="closeImageIframe"
+    >
+      Close
+    </button>
+  </div>
+</template>
+
+<script>
+  export default {
+    name: 'IframeImageDialog',
+    props: {
+      imageIframeOpen: false,
+      imageIframeURL: ''
+    },
+    methods: {
+      closeImageIframe: function () {
+        this.$emit('closeImageIframe')
+      },
+    }
+  }
+</script>
+
+<style lang="scss" scoped>
+  .image-dialog {
+    position: fixed;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    background-color: rgba(#000, 0.9);
+    z-index: 1000;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+
+    .image-dialog-close {
+      position: absolute;
+      top: 1rem;
+      right: 1rem;
+      padding: 4px;
+      border: 2px solid;
+      border-radius: 4px;
+    }
+
+    .map-iframe-container {
+      height: 80%;
+      width: 80%;
+      background: #fff;
+      border: 1px solid black;
+      overflow: hidden;
+    }
+
+    .my-iframe {
+      height:100%;
+      width:100%;
+      position:relative;
+      border-width:0px;
+    }
+  }
+</style>
diff --git a/src/components/index.js b/src/components/index.js
index 49fbbb2..7c38617 100644
--- a/src/components/index.js
+++ b/src/components/index.js
@@ -2,5 +2,6 @@ import DrawToolbar from "./DrawToolbar/DrawToolbar.vue";
 import HelpModeDialog from "./HelpModeDialog/HelpModeDialog.vue";
 import Tooltip from "./Tooltip/Tooltip.vue";
 import TreeControls from "./TreeControls/TreeControls.vue";
+import IframeImageDialog from "./ImageDialog/IframeImageDialog.vue";
 
-export { DrawToolbar, HelpModeDialog, Tooltip, TreeControls };
+export { DrawToolbar, HelpModeDialog, Tooltip, TreeControls, IframeImageDialog };

From 4c7f50af3c0ad59b0b8ccaf09b51f2f63d0f85d4 Mon Sep 17 00:00:00 2001
From: akhuoa <aung.kyaw.hein@auckland.ac.nz>
Date: Fri, 12 Jul 2024 11:07:30 +1200
Subject: [PATCH 3/5] Add missing flatmap mixin for image gallery popup

---
 package-lock.json                            |  4 +-
 package.json                                 |  2 +-
 src/components.d.ts                          |  5 ++-
 src/components/Tooltip/ImageGalleryPopup.vue |  3 +-
 src/mixins/flatmapImageMixin.js              | 42 ++++++++++++++++++++
 5 files changed, 49 insertions(+), 7 deletions(-)
 create mode 100644 src/mixins/flatmapImageMixin.js

diff --git a/package-lock.json b/package-lock.json
index bc22a81..951b0f4 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,12 +1,12 @@
 {
   "name": "@abi-software/map-utilities",
-  "version": "0.0.0-beta.5",
+  "version": "0.0.0-beta.7",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "@abi-software/map-utilities",
-      "version": "0.0.0-beta.5",
+      "version": "0.0.0-beta.7",
       "dependencies": {
         "@abi-software/gallery": "^1.1.0",
         "@abi-software/svg-sprite": "^1.0.0",
diff --git a/package.json b/package.json
index 8f80152..f98ce2c 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@abi-software/map-utilities",
-  "version": "0.0.0-beta.5",
+  "version": "0.0.0-beta.7",
   "files": [
     "dist/*",
     "src/*",
diff --git a/src/components.d.ts b/src/components.d.ts
index b888a27..08a31fa 100644
--- a/src/components.d.ts
+++ b/src/components.d.ts
@@ -29,12 +29,13 @@ declare module 'vue' {
     ElPopover: typeof import('element-plus/es')['ElPopover']
     ElRow: typeof import('element-plus/es')['ElRow']
     ElSelect: typeof import('element-plus/es')['ElSelect']
-    ElSwitch: typeof import('element-plus/es')['ElSwitch']
+    ElTag: typeof import('element-plus/es')['ElTag']
     ElTree: typeof import('element-plus/es')['ElTree']
     ExternalResourceCard: typeof import('./components/Tooltip/ExternalResourceCard.vue')['default']
     HelpModeDialog: typeof import('./components/HelpModeDialog/HelpModeDialog.vue')['default']
-    ProvenancePopup: typeof import('./components/Tooltip/ProvenancePopup.vue')['default']
+    IframeImageDialog: typeof import('./components/ImageDialog/IframeImageDialog.vue')['default']
     ImageGalleryPopup: typeof import('./components/Tooltip/ImageGalleryPopup.vue')['default']
+    ProvenancePopup: typeof import('./components/Tooltip/ProvenancePopup.vue')['default']
     Tooltip: typeof import('./components/Tooltip/Tooltip.vue')['default']
     TreeControls: typeof import('./components/TreeControls/TreeControls.vue')['default']
   }
diff --git a/src/components/Tooltip/ImageGalleryPopup.vue b/src/components/Tooltip/ImageGalleryPopup.vue
index c25144c..ae35fa8 100644
--- a/src/components/Tooltip/ImageGalleryPopup.vue
+++ b/src/components/Tooltip/ImageGalleryPopup.vue
@@ -52,8 +52,7 @@ import {
   ElTag as Tag,
 } from 'element-plus'
 
-import EventBus from './EventBus'
-import flatmapImageMixin from '../mixins/flatmapImageMixin';
+import flatmapImageMixin from '../../mixins/flatmapImageMixin';
 
 const titleCase = (str) => {
   return str.replace(/\w\S*/g, (t) => {
diff --git a/src/mixins/flatmapImageMixin.js b/src/mixins/flatmapImageMixin.js
new file mode 100644
index 0000000..39259a3
--- /dev/null
+++ b/src/mixins/flatmapImageMixin.js
@@ -0,0 +1,42 @@
+export default {
+  // Note that the setting store is included in MapContent.vue
+  methods: {
+    findImagesForSpeciesFromGalleryItems: function (galleryItems, speciesToFind) {
+      let imageList = []
+      galleryItems.forEach((image) => {
+        if (image.species && image.species.length > 0) {
+          image.species.forEach((species) => {
+            if (species.species && species.species.curie === speciesToFind) {
+              imageList.push(image)
+            }
+          })
+        }
+      })
+      return imageList
+    },
+    findAllSpeciesFromGalleryItems: function (galleryItems) {
+      let speciesList = [];
+      let speciesSet = new Set();
+
+      galleryItems.forEach((image) => {
+        if (image.species && image.species.length > 0) {
+          image.species.forEach((species) => {
+            if (species.species) {
+              let ispc = species.species;
+              if (!speciesSet.has(ispc.curie)) {
+                speciesSet.add(ispc.curie);
+                speciesList.push({ 'taxon': ispc.curie, 'name': ispc.name, 'count': 1});
+              } else {
+                speciesList.forEach((sp) => {
+                  if (sp.taxon === ispc.curie) sp.count++;
+                });
+              }
+            }
+          });
+        }
+      });
+
+      return speciesList;
+    },
+  }
+}

From da47eadb7480534afc32ec75cb82d7f023b10ae2 Mon Sep 17 00:00:00 2001
From: akhuoa <aung.kyaw.hein@auckland.ac.nz>
Date: Wed, 21 Aug 2024 13:10:43 +1200
Subject: [PATCH 4/5] Update export components

---
 src/components/index.js | 11 +++++++++--
 1 file changed, 9 insertions(+), 2 deletions(-)

diff --git a/src/components/index.js b/src/components/index.js
index 60a263d..cbbffb5 100644
--- a/src/components/index.js
+++ b/src/components/index.js
@@ -2,7 +2,14 @@ import DrawToolbar from "./DrawToolbar/DrawToolbar.vue";
 import HelpModeDialog from "./HelpModeDialog/HelpModeDialog.vue";
 import Tooltip from "./Tooltip/Tooltip.vue";
 import TreeControls from "./TreeControls/TreeControls.vue";
-import IframeImageDialog from "./ImageDialog/IframeImageDialog.vue";
 import CopyToClipboard from "./CopyToClipboard/CopyToClipboard.vue";
+import IframeImageDialog from "./ImageDialog/IframeImageDialog.vue";
 
-export { DrawToolbar, HelpModeDialog, Tooltip, TreeControls, CopyToClipboard, IframeImageDialog };
+export {
+  DrawToolbar,
+  HelpModeDialog,
+  Tooltip,
+  TreeControls,
+  CopyToClipboard,
+  IframeImageDialog
+};

From 5af5919b79467df8e963ab84358ec06f9d875dce Mon Sep 17 00:00:00 2001
From: akhuoa <aung.kyaw.hein@auckland.ac.nz>
Date: Wed, 21 Aug 2024 13:11:32 +1200
Subject: [PATCH 5/5] 1.1.1-beta.0

---
 package-lock.json | 4 ++--
 package.json      | 2 +-
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index 5272407..5d9c1de 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,12 +1,12 @@
 {
   "name": "@abi-software/map-utilities",
-  "version": "1.1.0",
+  "version": "1.1.1-beta.0",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "@abi-software/map-utilities",
-      "version": "1.1.0",
+      "version": "1.1.1-beta.0",
       "dependencies": {
         "@abi-software/gallery": "^1.1.0",
         "@abi-software/svg-sprite": "^1.0.0",
diff --git a/package.json b/package.json
index 17cfcde..661dde4 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@abi-software/map-utilities",
-  "version": "1.1.0",
+  "version": "1.1.1-beta.0",
   "files": [
     "dist/*",
     "src/*",