From f3cb9e6dc0b0f166ada1da5a2a5bb790a49fa8ef Mon Sep 17 00:00:00 2001
From: raichev-dima <raichevdp@gmail.com>
Date: Thu, 9 Jan 2025 18:03:11 +0300
Subject: [PATCH] fix(rating#4445): update `model-value` to `modelValue` case
 in the template

---
 packages/ui/src/components/va-rating/VaRating.vue           | 6 +++---
 .../ui/src/composables/std/internal/useUserProvidedProp.ts  | 2 ++
 2 files changed, 5 insertions(+), 3 deletions(-)

diff --git a/packages/ui/src/components/va-rating/VaRating.vue b/packages/ui/src/components/va-rating/VaRating.vue
index be4501ed74..b57ee37229 100644
--- a/packages/ui/src/components/va-rating/VaRating.vue
+++ b/packages/ui/src/components/va-rating/VaRating.vue
@@ -15,19 +15,19 @@
         class="va-rating__item"
         v-bind="VaRatingItemProps"
         :aria-label="tp($props.ariaItemLabel, { max: $props.max, value: itemNumber })"
-        :model-value="getItemValue(itemNumber - 1)"
+        :modelValue="getItemValue(itemNumber - 1)"
         :tabindex="tabIndexComputed"
         :disabled="$props.disabled"
         :readonly="$props.readonly"
         @hover="isInteractionsEnabled && onItemHoveredValueUpdate(itemNumber - 1, $event)"
-        @update:model-value="isInteractionsEnabled && onItemValueUpdate(itemNumber - 1, $event)"
+        @update:modelValue="isInteractionsEnabled && onItemValueUpdate(itemNumber - 1, $event)"
         v-slot="{ value, onClick }"
       >
         <slot name="item" v-bind="{ value: value, onClick: onClick, index: itemNumber }">
           <template v-if="$props.numbers">
             <VaRatingItemNumberButton
               v-bind="VaRatingItemNumberButtonProps"
-              :model-value="value"
+              :modelValue="value"
               :item-number="itemNumber"
             />
           </template>
diff --git a/packages/ui/src/composables/std/internal/useUserProvidedProp.ts b/packages/ui/src/composables/std/internal/useUserProvidedProp.ts
index 692dda807a..a81f514dce 100644
--- a/packages/ui/src/composables/std/internal/useUserProvidedProp.ts
+++ b/packages/ui/src/composables/std/internal/useUserProvidedProp.ts
@@ -22,6 +22,8 @@ export const useIsUserProvidedProp = (propName: string) => {
     if (!vm?.vnode.props) { return false }
 
     // If vnode doesn't have this prop it mean default value is used
+    // Note: be cautious as the `propName` should have the exact case in the template
+    // example: `modelValue` should not be `model-value`
     return propName in vm.vnode.props
   })
 }