add chart with the features done

src/icons/BaseIcon.vue

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-withDefaults(defineProps<{ color: string }>(), {
+withDefaults(defineProps<{ color?: string }>(), {
   color: 'var(--primary-color)'
 })
 </script>

src/icons/ProblemSolvingIcon.vue

@@ -1,7 +1,7 @@
 <script setup lang="ts">
 import BaseIcon from './BaseIcon.vue'
 
-withDefaults(defineProps<{ color: string }>(), {
+withDefaults(defineProps<{ color?: string }>(), {
   color: 'var(--primary-color)'
 })
 </script>

src/icons/PullSystemIcon.vue

@@ -1,7 +1,7 @@
 <script setup lang="ts">
 import BaseIcon from './BaseIcon.vue'
 
-withDefaults(defineProps<{ color: string }>(), {
+withDefaults(defineProps<{ color?: string }>(), {
   color: 'var(--primary-color)'
 })
 </script>

src/icons/PushSystemIcon.vue

@@ -1,7 +1,7 @@
 <script setup lang="ts">
 import BaseIcon from './BaseIcon.vue'
 
-withDefaults(defineProps<{ color: string }>(), {
+withDefaults(defineProps<{ color?: string }>(), {
   color: 'var(--primary-color)'
 })
 </script>

src/icons/SeparatorIcon.vue

@@ -1,7 +1,7 @@
 <script setup lang="ts">
 import BaseIcon from './BaseIcon.vue'
 
-withDefaults(defineProps<{ color: string }>(), {
+withDefaults(defineProps<{ color?: string }>(), {
   color: 'var(--primary-color)'
 })
 </script>