fix: use vue components uid as circle uid

Author: setaman

src/components/Circle/CircleContainer.vue

@@ -3,21 +3,21 @@
     <svg class="ep-svg" :height="options.size" :width="options.size" xmlns="http://www.w3.org/2000/svg">
       <g class="ep-circle--container">
         <defs>
-          <gradient v-if="isColorGradient" :color="options.color" type="progress" :id="options.id" />
-          <gradient v-if="isColorFillGradient" :color="options.colorFill" type="progress-fill" :id="options.id" />
-          <gradient v-if="isEmptyColorGradient" :color="options.emptyColor" type="empty" :id="options.id" />
+          <gradient v-if="isColorGradient" :color="options.color" type="progress" :id="uid" />
+          <gradient v-if="isColorFillGradient" :color="options.colorFill" type="progress-fill" :id="options.uid" />
+          <gradient v-if="isEmptyColorGradient" :color="options.emptyColor" type="empty" :id="options.uid" />
           <gradient
             v-if="isEmptyColorFillGradient"
             :color="options.emptyColorFill"
             type="empty-fill"
-            :id="options.id"
+            :id="options.uid"
           />
-          <gradient v-if="isLoaderColorGradient" :color="options.loader.color" type="loader" :id="options.id" />
+          <gradient v-if="isLoaderColorGradient" :color="options.loader.color" type="loader" :id="options.uid" />
         </defs>
-        <component :is="circleType" :options="options" />
+        <component :is="circleType" :options="computedOptions" />
       </g>
     </svg>
-    <circle-dot v-if="options.dot" :options="options" />
+    <circle-dot v-if="options.dot" :options="computedOptions" />
   </div>
 </template>
 
@@ -37,6 +37,12 @@ export default {
     },
   },
   computed: {
+    computedOptions() {
+      return {
+        ...this.options,
+        uid: this.uid,
+      };
+    },
     circleType() {
       return this.options.half ? "half-circle-progress" : "circle-progress";
     },
@@ -55,6 +61,9 @@ export default {
     isLoaderColorGradient() {
       return Array.isArray(this.options.loader.color.colors);
     },
+    uid() {
+      return this.$.uid;
+    },
   },
 };
 </script>