add color classes

src/components/Progress/Progress.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="w-full bg-gray-200 rounded-full h-2.5 dark:bg-gray-700">
-    <div class="bg-blue-600 h-2.5 rounded-full" :class="wrapperClasses" style="width: 45%"></div>
+    <div class="h-2.5 rounded-full" :class="wrapperClasses" style="width: 45%"></div>
   </div>
 </template>
 <script lang="ts" setup>
@@ -11,7 +11,7 @@ import { useProgressClasses } from './composables/useProgressClasses'
 const props = defineProps({
   color: {
     type: String, // 'dark' | 'blue' | 'red' | 'green' | 'yellow' | 'indigo' | 'purple'
-    default: 'yellow',
+    default: 'pink',
   },
   label: {
     type: String,

src/components/Progress/composables/useProgressClasses.ts

@@ -8,16 +8,16 @@ export type ProgressClassMap<T extends string> = { default: Record<T, string> }
 
 const progressColorClasses: ProgressClassMap<ProgressVariant> = {
   default: {
-    default: '',
-    blue: 'bg-blue-600',
-    alternative: '',
+    default: 'bg-blue-600 dark:bg-blue-600',
+    blue: 'bg-blue-600 dark:bg-blue-600',
+    alternative: 'dark:bg-gray-800',
     dark: 'bg-gray-600 dark:bg-gray-300',
-    light: '',
+    light: 'bg-white dark:bg-gray-800',
     green: 'bg-green-600 dark:bg-green-500',
     red: 'bg-red-600 dark:bg-red-500',
     yellow: 'bg-yellow-400',
     purple: 'bg-purple-600 dark:bg-purple-500',
-    pink: '',
+    pink: 'bg-pink-700 dark:bg-pink-600',
   },
 }