<script lang="ts">
    export let color: string = undefined
    export let size: string = undefined
    export let type: string = undefined
    export let form: string = undefined
    export let clone: boolean = false
    export let disabled: boolean = undefined

    const className = 'button-circle'
    const classes = [
        className,
        ...[color, size].map(variant => variant && `${className}--${variant}`),
        $$props.class
    ].join(' ').trim()
</script>

<button {type} {form} class={classes} on:click disabled={disabled}>
    {#if clone}
        {#each Array(2) as _}
            <span class="clone">
                <slot />
            </span>
        {/each}
    {:else}
        <slot />
    {/if}
</button>