<script>

    import BlockButtons from "./BlockButtons.svelte";
    import BlockElements from "./BlockElements.svelte";
    import {flip} from "svelte/animate";
    import {quintOut} from 'svelte/easing';

    export let record;
    export let field;
    export let value = [];
    export let schemas;
    export let graph;


</script>

<div class="inline-card-wrapper">
    <BlockButtons
        bind:blockData={value}
    />
</div>
{#each value as blockItemData (blockItemData.id)}
    <div class="block-field-wrapper" animate:flip="{{delay: 250, duration: 250, easing: quintOut}}">
        <BlockElements
            bind:block={blockItemData}
            {record}
            {field}
            {schemas}
            bind:graph
        />
        <BlockButtons
            bind:blockData={value}
        />
    </div>
{/each}
