<script>
    import {createEventDispatcher, getContext} from "svelte";

    const dispatch = createEventDispatcher();
    const channel = getContext("channel");
    let isOpen = false;

    export function open() {
        isOpen = true;
    }
</script>

<div
        class="modal fade show"
        tabindex="-1"
        class:d-block={isOpen}
        aria-modal="true"
        role="dialog"
        style="background: rgba(100,100,100,.6);"
>
    <div class="modal-dialog modal-dialog-centered modal-dialog-scrollable">
        <div class="modal-content">
            <div class="modal-header">


                <button
                        on:click|preventDefault={(e) => (isOpen = false)}
                        type="button"
                        class="btn-close"
                        data-bs-dismiss="modal"
                        aria-label="Close"
                />
            </div>
            <div class="modal-body">

            </div>
        </div>
    </div>
</div>


<style>
    .modal-dialog {
        width: auto;
        max-width: 100%;

    }

    .modal-content {
        margin: 40px auto;
        width: auto;
        height: 100%;
    }
</style>
