refactor: finer grained binding types for setup

packages/compiler-core/src/options.ts

@@ -62,10 +62,31 @@ export type HoistTransform = (
 ) => void
 
 export const enum BindingTypes {
+  /**
+   * returned from data()
+   */
   DATA = 'data',
+  /**
+   * decalred as a prop
+   */
   PROPS = 'props',
-  SETUP = 'setup',
-  CONST = 'const',
+  /**
+   * a let binding (may or may not be a ref)
+   */
+  SETUP_LET = 'setup-let',
+  /**
+   * a const binding that can never be a ref.
+   * these bindings don't need `unref()` calls when processed in inlined
+   * template expressions.
+   */
+  SETUP_CONST = 'setup-const',
+  /**
+   * a const binding that may be a ref.
+   */
+  SETUP_CONST_REF = 'setup-const-ref',
+  /**
+   * declared by other options, e.g. computed, inject
+   */
   OPTIONS = 'options'
 }
 

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

@@ -263,20 +263,22 @@ export function resolveComponentType(
         return resolvedTag
       }
     }
-    const tagFromSetup = checkType(BindingTypes.SETUP)
-    if (tagFromSetup) {
-      return context.inline
-        ? // setup scope bindings may be refs so they need to be unrefed
-          `${context.helperString(UNREF)}(${tagFromSetup})`
-        : `$setup[${JSON.stringify(tagFromSetup)}]`
-    }
-    const tagFromConst = checkType(BindingTypes.CONST)
+    const tagFromConst = checkType(BindingTypes.SETUP_CONST)
     if (tagFromConst) {
       return context.inline
         ? // in inline mode, const setup bindings (e.g. imports) can be used as-is
           tagFromConst
         : `$setup[${JSON.stringify(tagFromConst)}]`
     }
+    const tagFromSetup =
+      checkType(BindingTypes.SETUP_LET) ||
+      checkType(BindingTypes.SETUP_CONST_REF)
+    if (tagFromSetup) {
+      return context.inline
+        ? // setup scope bindings that may be refs need to be unrefed
+          `${context.helperString(UNREF)}(${tagFromSetup})`
+        : `$setup[${JSON.stringify(tagFromSetup)}]`
+    }
   }
 
   // 4. user component (resolve)

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

@@ -104,9 +104,12 @@ export function processExpression(
     const type = hasOwn(bindingMetadata, raw) && bindingMetadata[raw]
     if (inline) {
       // setup inline mode
-      if (type === BindingTypes.CONST) {
+      if (type === BindingTypes.SETUP_CONST) {
         return raw
-      } else if (type === BindingTypes.SETUP) {
+      } else if (
+        type === BindingTypes.SETUP_CONST_REF ||
+        type === BindingTypes.SETUP_LET
+      ) {
         return `${context.helperString(UNREF)}(${raw})`
       } else if (type === BindingTypes.PROPS) {
         // use __props which is generated by compileScript so in ts mode
@@ -114,8 +117,12 @@ export function processExpression(
         return `__props.${raw}`
       }
     } else {
-      if (type === BindingTypes.CONST) {
-        // setup const binding in non-inline mode
+      if (
+        type === BindingTypes.SETUP_LET ||
+        type === BindingTypes.SETUP_CONST ||
+        type === BindingTypes.SETUP_CONST_REF
+      ) {
+        // setup bindings in non-inline mode
         return `$setup.${raw}`
       } else if (type) {
         return `$${type}.${raw}`
@@ -131,7 +138,9 @@ export function processExpression(
   const bailConstant = rawExp.indexOf(`(`) > -1
   if (isSimpleIdentifier(rawExp)) {
     // const bindings exposed from setup - we know they never change
-    if (bindingMetadata[node.content] === BindingTypes.CONST) {
+    // marking it as runtime constant will prevent it from being listed as
+    // a dynamic prop.
+    if (bindingMetadata[node.content] === BindingTypes.SETUP_CONST) {
       node.isRuntimeConstant = true
     }
     if (