---

This section details on the original issue you should resolve

<issue_title>useModal with custom component: Component was made a reactive object</issue_title>
<issue_description>### Describe the bug

I'm migrating my code to to use the new useModal composable, and for my custom modals, I'm getting this warning on the console whenever I create one.

const { create } = useModal();
create({ component: FeedbackModal }).show();

Vue received a Component that was made a reactive object. This can lead to unnecessary performance overhead and should be avoided by marking the component with `markRaw` or using `shallowRef` instead of `ref`. 
Component that was made reactive:  
Object { __name: "FeedbackModal", ...

I've tried using markRaw on the imported component , but it made no difference. I see in the source that it should already be applying markRaw to the component instance, so I'm not sure why this is happening.

Reproduction

https://stackblitz.com/edit/github-kpbciadc?file=src%2Fcomponents%2FComp.vue

Used Package Manager

npm</issue_description>

<agent_instructions> const resolvedProps = isRef(obj) ? obj : shallowRef(obj)
this should be enough... fix the other composables also that have the same problem.</agent_instructions>

Comments on the Issue (you are @copilot in this section)

@xvaara ```ts import { markRaw } from 'vue' create({ component: markRaw(MyModal) }).show() ```