fix(rating#4445): update model-value to modelValue case in the te…

…mplate
epicmaxco · Jan 9, 2025 · f3cb9e6 · f3cb9e6
1 parent 4151e43
commit f3cb9e6
Show file tree

Hide file tree

Showing 2 changed files with 5 additions and 3 deletions.
diff --git 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
@@ -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
   })
 }