From 4a923627296c01901039ffb4da88f1ef97d408bd Mon Sep 17 00:00:00 2001
From: Sven <sven.westerlaken@hotmail.nl>
Date: Wed, 18 May 2022 22:30:22 +0200
Subject: [PATCH] fix(attrs): use seperated attributes to prevent style prop
 warning

---
 src/vue-wavify.vue | 14 ++++++++------
 1 file changed, 8 insertions(+), 6 deletions(-)

diff --git a/src/vue-wavify.vue b/src/vue-wavify.vue
index b546fa3..e75230e 100644
--- a/src/vue-wavify.vue
+++ b/src/vue-wavify.vue
@@ -1,8 +1,8 @@
 <template>
-<div class="vue-wavify-wave" ref="wave" v-on="$listeners" :id="id" :style="style">
+<div class="vue-wavify-wave" ref="wave" v-on="$listeners" :id="id" :style="separatedAttrs.style">
   <svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" >
     <slot></slot>
-    <path :d="this.path" :fill="fill" v-bind="$attrs"/>
+    <path :d="this.path" :fill="fill" v-bind="separatedAttrs.rest"/>
   </svg>
 </div>
 </template>
@@ -39,10 +39,6 @@ export default {
     id: {
       default: null,
       type: String
-    },
-    style: {
-      default: null,
-      type: String
     }
   },
   data() {
@@ -62,6 +58,12 @@ export default {
     window.cancelAnimationFrame(this.$frameId);
     this.$frameId = 0;
   },
+  computed: {
+    separatedAttrs () {
+      const { style,...rest } = this.$attrs;
+      return { style, rest };
+    },
+  },
   methods: {
     containerWidth () {
       return this.$refs.wave.offsetWidth;