Nested component not rendering in dynamically registered external component

[mrjeanjean]

Hi everyone,
I work on a VueJs (options API) project. Here is a simplify version :

1) The library

Let say I have a component which displays a list of components called 'blocks'.
Here is the boostrap of the app. An interface to add block dynamically from the outside :

// lib.js
import {createApp} from "vue";
import App from "./App.vue";

export function initApp(target) {
    const app = createApp(App);
   
    // create simple array containing the name of the components
    const blocks = [];
    app.provide('blocks', blocks);

    return {
        // add new block by pushing the block name in the array and register the component using app.component method
        addBlock: (blockName, Component) => {
            blocks.push(blockName);
            app.component(blockName, Component);
        },
        // finally mount the VueJs app
        render: () => {
            app.mount(target);
        }
    }
}

Here is the component who displays all the blocks.

<!-- App.vue -->
<template>
    <component :is="block" v-for="block in blocks"/>
</template>

<script>
export default {
  name: "App",
  inject: [
    'blocks'
  ]
}
</script>

2) The library consumer

For real life exemple I've built the library as es module and I use it like this :

// main.js
import {initApp} from "./../dist/lib.js";
import ExternalBlock from "./ExternalBlock.vue";

// create app through the library
const app = initApp('#app');
// add/register component
app.addBlock('ExternalBlock', ExternalBlock);
// finally render/mount the vue app
app.render();

Here is my externalBlock component :

<!-- ExternalBlock.vue -->
<template>
  External Block
  <ExternalBlockNested/>
</template>

<script>
import ExternalBlockNested from "./ExternalBlockNested.vue";

export default {
  name: "ExternalBlock",
  components: {ExternalBlockNested}
}
</script>

The purpose here is to add a component dynamically and make it rendered by the library.

The problem: the ExternalBlock is well displayed BUT the nested ExternalBlockNested is not rendered at all. and I have a warn error in the console : [Vue warn]: resolveComponent can only be used in render() or setup().

For sure I don't really understand how VueJs works under the hood, how components are really rendered...
Do I need to register my child component ExternalBlockNested manually (tried with no success)
Is it the way I've built the library who breaks VueJs logic ?

Error reproduction here: https://stackblitz.com/edit/vitejs-vite-fwb5ma?file=src%2FExternalBlock.vue,index.html&terminal=dev

Thanks for reading