From d0ce71ad7d2a3052ff52b14849d8a97cfcc2dd18 Mon Sep 17 00:00:00 2001
From: tugcekucukoglu <tugcekucukoglu.860@gmail.com>
Date: Fri, 29 Nov 2024 13:26:52 +0300
Subject: [PATCH] $attrs binding defects

---
 apps/showcase/doc/inputotp/SampleDoc.vue   | 8 ++++----
 apps/showcase/doc/inputotp/TemplateDoc.vue | 8 ++++----
 2 files changed, 8 insertions(+), 8 deletions(-)

diff --git a/apps/showcase/doc/inputotp/SampleDoc.vue b/apps/showcase/doc/inputotp/SampleDoc.vue
index 9735ff581..047e8c104 100644
--- a/apps/showcase/doc/inputotp/SampleDoc.vue
+++ b/apps/showcase/doc/inputotp/SampleDoc.vue
@@ -8,7 +8,7 @@
             <p class="text-surface-500 dark:text-surface-400 block mb-8">Please enter the code sent to your phone.</p>
             <InputOtp v-model="value" :length="6" style="gap: 0">
                 <template #default="{ attrs, events, index }">
-                    <input type="text" v-bind="attrs" v-on="events" class="custom-otp-input" />
+                    <input type="text" v-bind="$attrs" v-on="events" class="custom-otp-input" />
                     <div v-if="index === 3" class="px-4">
                         <i class="pi pi-minus" />
                     </div>
@@ -35,7 +35,7 @@ export default {
     <p class="text-surface-500 dark:text-surface-400 block mb-8">Please enter the code sent to your phone.</p>
     <InputOtp v-model="value" :length="6" style="gap: 0">
         <template #default="{ attrs, events, index }">
-            <input type="text" v-bind="attrs" v-on="events" class="custom-otp-input" />
+            <input type="text" v-bind="$attrs" v-on="events" class="custom-otp-input" />
             <div v-if="index === 3" class="px-4">
                 <i class="pi pi-minus" />
             </div>
@@ -55,7 +55,7 @@ export default {
             <p class="text-surface-500 dark:text-surface-400 block mb-8">Please enter the code sent to your phone.</p>
             <InputOtp v-model="value" :length="6" style="gap: 0">
                 <template #default="{ attrs, events, index }">
-                    <input type="text" v-bind="attrs" v-on="events" class="custom-otp-input" />
+                    <input type="text" v-bind="$attrs" v-on="events" class="custom-otp-input" />
                     <div v-if="index === 3" class="px-4">
                         <i class="pi pi-minus" />
                     </div>
@@ -125,7 +125,7 @@ export default {
             <p class="text-surface-500 dark:text-surface-400 block mb-8">Please enter the code sent to your phone.</p>
             <InputOtp v-model="value" :length="6" style="gap: 0">
                 <template #default="{ attrs, events, index }">
-                    <input type="text" v-bind="attrs" v-on="events" class="custom-otp-input" />
+                    <input type="text" v-bind="$attrs" v-on="events" class="custom-otp-input" />
                     <div v-if="index === 3" class="px-4">
                         <i class="pi pi-minus" />
                     </div>
diff --git a/apps/showcase/doc/inputotp/TemplateDoc.vue b/apps/showcase/doc/inputotp/TemplateDoc.vue
index de3189954..b05a65ee7 100644
--- a/apps/showcase/doc/inputotp/TemplateDoc.vue
+++ b/apps/showcase/doc/inputotp/TemplateDoc.vue
@@ -5,7 +5,7 @@
     <div class="card flex justify-center">
         <InputOtp v-model="value">
             <template #default="{ attrs, events }">
-                <input type="text" v-bind="attrs" v-on="events" class="custom-otp-input" />
+                <input type="text" v-bind="$attrs" v-on="events" class="custom-otp-input" />
             </template>
         </InputOtp>
     </div>
@@ -21,7 +21,7 @@ export default {
                 basic: `
 <InputOtp v-model="value">
     <template #default="{ attrs, events }">
-        <input type="text" v-bind="attrs" v-on="events" class="custom-otp-input" />
+        <input type="text" v-bind="$attrs" v-on="events" class="custom-otp-input" />
     </template>
 </InputOtp>
 `,
@@ -30,7 +30,7 @@ export default {
     <div class="card flex justify-center">
         <InputOtp v-model="value">
             <template #default="{ attrs, events }">
-                <input type="text" v-bind="attrs" v-on="events" class="custom-otp-input" />
+                <input type="text" v-bind="$attrs" v-on="events" class="custom-otp-input" />
             </template>
         </InputOtp>
     </div>
@@ -69,7 +69,7 @@ export default {
     <div class="card flex justify-center">
         <InputOtp v-model="value">
             <template #default="{ attrs, events }">
-                <input type="text" v-bind="attrs" v-on="events" class="custom-otp-input" />
+                <input type="text" v-bind="$attrs" v-on="events" class="custom-otp-input" />
             </template>
         </InputOtp>
     </div>