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

    export let label = "";
    export let show = false;
</script>

<button
    class="btn btn-link p-0  text-decoration-none d-flex align-items-center mb-2 "
    on:click|preventDefault={(e) => (show = !show)}
>
    <span class="me-1">{label}</span>
    {#if !show}
        <Icon icon="circle-chevron-down" />
    {/if}

    {#if show}
        <Icon icon="circle-chevron-up" />
    {/if}
</button>
{#if show}
    <div class="mb-3" style="padding: 22px;    background: rgb(249, 249, 249);    border-radius: 32px;">
        <slot />
    </div>
{/if}
