From 1c711fecc418ac2f3aabe0f723009b0b9ffda368 Mon Sep 17 00:00:00 2001
From: Caroline Desprat <cdesprat@icij.org>
Date: Wed, 4 Sep 2024 08:43:58 +0000
Subject: [PATCH] fix: prevent undefined in variables + fix typescript errors

---
 lib/components/PhosphorIcon.vue | 15 +++++++++++----
 1 file changed, 11 insertions(+), 4 deletions(-)

diff --git a/lib/components/PhosphorIcon.vue b/lib/components/PhosphorIcon.vue
index 1d09a24d..2f006622 100644
--- a/lib/components/PhosphorIcon.vue
+++ b/lib/components/PhosphorIcon.vue
@@ -141,6 +141,7 @@ function findComponentByName(name: string) {
     try {
       return await import(`node_modules/@phosphor-icons/vue/dist/icons/${filename}.vue.mjs`)
     } catch {
+      // @ts-expect-error Importing not typescript module
       // eslint-disable-next-line import/extensions
       return import('node_modules/@phosphor-icons/vue/dist/icons/PhSelection.vue.mjs')
     }
@@ -186,10 +187,16 @@ const weight = computed(() => {
 })
 
 const color = computed(() => {
+  let colorVariant = ''
+
+  if(props.variant){
+    colorVariant = `var(--bs-${props.variant}, currentColor)`
+  }
   if (currentHover.value && props.hoverVariant) {
-    return `var(--bs-${props.hoverVariant}, currentColor)`
+    colorVariant = `var(--bs-${props.hoverVariant}, ${colorVariant})`
   }
-  return `var(--bs-${props.variant}, currentColor)`
+  
+  return colorVariant
 })
 
 const spinTo = computed(() => {
@@ -215,8 +222,8 @@ const style = computed(() => {
   return {
     '--phosphor-icon-color': color.value,
     '--phosphor-icon-weight': weight.value,
-    '--phosphor-icon-raw-size': isRawSize.value ? props.size : null,
-    '--phosphor-icon-size': hasSize.value ? props.size : null,
+    '--phosphor-icon-raw-size': isRawSize.value ? props.size : undefined,
+    '--phosphor-icon-size': hasSize.value ? props.size : undefined,
     '--phosphor-icon-scale': props.scale ?? 1,
   }
 })