<script lang="ts">
import type { Block } from '$lib/Block';
import GenericBlock from './blocks/GenericBlock.svelte';
import InputBlock from './blocks/InputBlock.svelte';
import CheckboxBlock from './blocks/CheckboxBlock.svelte';
import ChartBlock from './blocks/ChartBlock.svelte';
import GaugeBlock from './blocks/GaugeBlock.svelte';
import ButtonBlock from './blocks/ButtonBlock.svelte';
import ComboBoxBlock from './blocks/ComboBoxBlock.svelte';
import TableBlock from './blocks/TableBlock.svelte';
import LabelBlock from './blocks/LabelBlock.svelte';
import SliderBlock from './blocks/SliderBlock.svelte';
import LedBlock from './blocks/LedBlock.svelte';
import BarBlock from './blocks/BarBlock.svelte';
import DisplayBlock from './blocks/DisplayBlock.svelte';
import MultiChartBlock from './blocks/MultiChartBlock.svelte';
interface Props {
data: { value: Block };
}
let { data }: Props = $props();
const block = $derived(data.value);
</script>
{#if block.desc.implementation === 'native'}
<GenericBlock {data} />
{:else if block.desc.name === 'Input'}
<InputBlock {data} />
{:else if block.desc.name === 'Checkbox'}
<CheckboxBlock {data} />
{:else if block.desc.name === 'Chart'}
<ChartBlock {data} />
{:else if block.desc.name === 'Gauge'}
<GaugeBlock {data} />
{:else if block.desc.name === 'Button'}
<ButtonBlock {data} />
{:else if block.desc.name === 'ComboBox'}
<ComboBoxBlock {data} />
{:else if block.desc.name === 'Table'}
<TableBlock {data} />
{:else if block.desc.name === 'Label'}
<LabelBlock {data} />
{:else if block.desc.name === 'Slider'}
<SliderBlock {data} />
{:else if block.desc.name === 'Led'}
<LedBlock {data} />
{:else if block.desc.name === 'Bar'}
<BarBlock {data} />
{:else if block.desc.name === 'Display'}
<DisplayBlock {data} />
{:else if block.desc.name === 'MultiChart'}
<MultiChartBlock {data} />
{:else}
<GenericBlock {data} />
{/if}