Modal Target

[RoxDevvv]

Hi ,
how to pass component to Modal without doing it in html tags i wanna set different target separately
example of what am doing

----------------- this will set target to both components at once ------------------------
new ModalCompo({
target: Target,
props: {
Name: Name,
},
});

------------ModalCompo Script------------

<script> import Modal from "svelte-simple-modal"; import Popup from "./Content.svelte"; export let Name = ""; </script>

what i want to do ====>

const popupmeesage = new Popup({
target: Target,
props: {
Name: Name,
},
});

const modal = new Modal({
target: document.body,
content: popupmeesage
});

---

Thank you

[flekschas]

I am not 100% clear what you're asking about.

If you're trying to insert the Modal into a specific DOM element, then that's currently not support. See #32.

If you're asking about creating the <Modal /> component within script tags, then that's not actively supported either. You could try to use the bind() function to create the component within script tags but I wouldn't know why you'd want to do this in the first place. Do you mind sharing your use case?

[RoxDevvv]

The use case am creating chrome extension where i have to inject component inside the html body so i found the only way is to create component via script and set target but in case of your modal the content should be inside it so i wasn't able to set modal target in upper body while the content button should inside a specific place inside a table so yeah i work around to make this possible by creating many scripts it works but I don't think it is best way to do
Also i will try to use bind idea i think it is better

I will share code as soon as u return home

[flekschas]

Got it. Thanks for providing details. I haven't really planned for this packages to be used in such scenarios so I can't provide much help but I think your best bet at getting it to work is to use the bind() method.