diff --git a/packages/compiler-core/src/transforms/transformElement.ts b/packages/compiler-core/src/transforms/transformElement.ts
index 3bb9a83fd20..1d93a0af86f 100644
--- a/packages/compiler-core/src/transforms/transformElement.ts
+++ b/packages/compiler-core/src/transforms/transformElement.ts
@@ -244,7 +244,12 @@ export function resolveComponentType(
     return builtIn
   }
 
-  // 3. user component (resolve)
+  // 3. user component (from setup bindings)
+  if (context.bindingMetadata[tag] === 'setup') {
+    return `$setup[${JSON.stringify(tag)}]`
+  }
+
+  // 4. user component (resolve)
   context.helper(RESOLVE_COMPONENT)
   context.components.add(tag)
   return toValidAssetId(tag, `component`)
diff --git a/packages/template-explorer/src/options.ts b/packages/template-explorer/src/options.ts
index 167b23d0b86..b94bee722c5 100644
--- a/packages/template-explorer/src/options.ts
+++ b/packages/template-explorer/src/options.ts
@@ -10,7 +10,12 @@ export const compilerOptions: CompilerOptions = reactive({
   hoistStatic: false,
   cacheHandlers: false,
   scopeId: null,
-  ssrCssVars: `{ color }`
+  ssrCssVars: `{ color }`,
+  bindingMetadata: {
+    TestComponent: 'setup',
+    foo: 'setup',
+    bar: 'props'
+  }
 })
 
 const App = {