@eturnity/eturnity_reusable_components 9.19.8 → 9.19.9

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@eturnity/eturnity_reusable_components",
-  "version": "9.19.8",
+  "version": "9.19.9",
   "files": [
     "dist",
     "src"

package/src/components/icon/Icon.vue

@@ -250,7 +250,12 @@
   const icon = reactive({ html: '' })
 
   const loadSvg = async () => {
-    let svgString = await fetchIcon(props.name.toLowerCase())
+    const raw = props.name
+    if (raw == null || String(raw).trim() === '') {
+      icon.html = ''
+      return
+    }
+    let svgString = await fetchIcon(String(raw).toLowerCase())
     if (props.svgRotation) svgString = rotateSvg(svgString, props.svgRotation)
     icon.html = svgString
   }

package/src/components/icon/iconCache.mjs

@@ -1,23 +1,53 @@
+/**
+ * Load SVG icon markup by file stem (lowercase), matching files in
+ * `src/assets/svgIcons/<stem>.svg`.
+ *
+ * Uses `import.meta.glob` instead of `new URL(..., import.meta.url)` + `fetch`
+ * so Vite does not emit a broken asset URL when this package is linked via
+ * `@fs/...` (which previously produced requests like `.../icon/undefined`).
+ */
+const rawIconModules = import.meta.glob('../../assets/svgIcons/*.svg', {
+  query: '?raw',
+  import: 'default',
+})
+
+const iconLoadersByStem = {}
+for (const path of Object.keys(rawIconModules)) {
+  const normalized = path.replace(/\\/g, '/')
+  const match = normalized.match(/\/([^/]+)\.svg$/i)
+  if (!match) continue
+  iconLoadersByStem[match[1].toLowerCase()] = rawIconModules[path]
+}
+
 const iconCache = {}
 
 export const fetchIcon = async (fileName) => {
-  if (iconCache[fileName]) {
-    return iconCache[fileName]
+  if (fileName == null) {
+    console.warn('fetchIcon called with null or undefined fileName')
+    return ''
   }
 
-  // We need to use "new URL" to load dynamic assets (https://vitejs.dev/guide/assets.html#new-url-url-import-meta-url)
-  const fetchUrl = new URL(
-    `../../assets/svgIcons/${fileName}.svg`,
-    import.meta.url
-  ).href
+  const stem = String(fileName).trim().toLowerCase()
+  if (!stem) {
+    return ''
+  }
 
-  try {
-    const response = await fetch(fetchUrl)
-    const rawFile = await response.text()
-    iconCache[fileName] = rawFile
+  if (iconCache[stem]) {
+    return iconCache[stem]
+  }
+
+  const loader = iconLoadersByStem[stem]
+  if (!loader) {
+    console.error(`Unknown icon SVG: ${stem}.svg`)
+    return ''
+  }
 
+  try {
+    const rawFile = await loader()
+    iconCache[stem] = rawFile
     return rawFile
   } catch (error) {
-    console.error(`Failed to load ${fileName}.svg`)
+    console.error(`Failed to load ${stem}.svg`, error)
+    return ''
   }
 }

package/src/components/navigationSideMenu/index.vue

@@ -142,6 +142,7 @@
                       >
                         <IconCell :is-collapsed="isCollapsed">
                           <IconComponent
+                            v-if="item.icon"
                             :color="
                               item.id === activeItemId
                                 ? theme.semanticColors.purple[500]
@@ -187,6 +188,7 @@
                       >
                         <IconCell :is-collapsed="isCollapsed">
                           <IconComponent
+                            v-if="item.icon"
                             :color="
                               item.id === activeParentId
                                 ? theme.semanticColors.purple[500]