<script>
    import Icon from "../../common/Icon.svelte";

    let dialogEl;

    $: data = {};

    export function close(e) {
        if (e) {
            e.preventDefault();
        }
        dialogEl.close();
    }

    export function open() {
        dialogEl.showModal();
    }
</script>

<dialog bind:this={dialogEl}>
    <div class="dialog-header">
        <button
            on:click|preventDefault={close}
            type="button"
            class="button close"
            aria-label="Close"
        >
            <Icon icon="close"></Icon>
        </button>
    </div>

    <div class="dialog-body" style="min-width: 900px">
        <slot />
    </div>
</dialog>
