fix(compiler): avoid namespace collisions when transforming template refs in inline mode (#6975)

fix #6964

packages/compiler-core/__tests__/transforms/transformElement.spec.ts

@@ -1063,6 +1063,32 @@ describe('compiler: element transform', () => {
       })
     })
 
+    test('script setup inline mode template ref (binding does not exist but props with the same name exist)', () => {
+      const { node } = parseWithElementTransform(`<input ref="msg"/>`, {
+        inline: true,
+        bindingMetadata: {
+          msg: BindingTypes.PROPS,
+          ref: BindingTypes.SETUP_CONST
+        }
+      })
+      expect(node.props).toMatchObject({
+        type: NodeTypes.JS_OBJECT_EXPRESSION,
+        properties: [
+          {
+            type: NodeTypes.JS_PROPERTY,
+            key: {
+              content: 'ref',
+              isStatic: true
+            },
+            value: {
+              content: 'msg',
+              isStatic: true
+            }
+          }
+        ]
+      })
+    })
+
     test('HYDRATE_EVENTS', () => {
       // ignore click events (has dedicated fast path)
       const { node } = parseWithElementTransform(`<div @click="foo" />`, {

packages/compiler-core/src/transforms/transformElement.ts

@@ -497,11 +497,12 @@ export function buildProps(
         // in inline mode there is no setupState object, so we can't use string
         // keys to set the ref. Instead, we need to transform it to pass the
         // actual ref instead.
+        if (!__BROWSER__ && value && context.inline) {
+          const binding = context.bindingMetadata[value.content]
           if (
-          !__BROWSER__ &&
+            binding === BindingTypes.SETUP_LET ||
-          value &&
+            binding === BindingTypes.SETUP_REF ||
-          context.inline &&
+            binding === BindingTypes.SETUP_MAYBE_REF
-          context.bindingMetadata[value.content]
           ) {
             isStatic = false
             properties.push(
@@ -512,6 +513,7 @@ export function buildProps(
             )
           }
         }
+      }
       // skip is on <component>, or is="vue:xxx"
       if (
         name === 'is' &&