Self referencing components do not work in kebab-case

[Hulkmaster]

Vue version

3.5.13

Link to minimal reproduction

core/packages/compiler-core/src/transform.ts

Line 157 in 2e6ec39

selfName: nameMatch && capitalize(camelize(nameMatch[1])),

Steps to reproduce

Works

filename: BaseComponent.vue
template:

<template>
  <div>
    <BaseComponent
      v-for="child in children"
      :key="child.id"
    />
  </div>
</template>

<script setup>
const children = ref([]);
</script>

Works

filename: base-component.vue
template:

<template>
  <div>
    <BaseComponent
      v-for="child in children"
      :key="child.id"
    />
  </div>
</template>

<script setup>
const children = ref([]);
</script>

DOES NOT work

filename: base-component.vue
template:

<template>
  <div>
    <base-component
      v-for="child in children"
      :key="child.id"
    />
  </div>
</template>

<script setup>
const children = ref([]);
</script>

Culprit is here:

core/packages/compiler-core/src/transform.ts

Line 157 in 2e6ec39

selfName: nameMatch && capitalize(camelize(nameMatch[1])),

it transforms it to PascalCase, so kebab-case doesn't work

What is expected?

in reproduce

What is actually happening?

in reproduce

System Info

Any additional comments?

related issues:
vuejs/docs#765
#2827
#2821

[edison1105]

I can't reproduce it in the Playground
Could you please provide a minimal reproduction?

[Hulkmaster]

it indeed works in playground, i'll try on clean app to reproduce

[Hulkmaster]

I'm ashamed

it does not indeed work in our project (latest vue/vite)

but it does work correctly in plain vite-create project

i did not bother to try out on empty project first before creating an issue

sorry for wasting your time