lucent-laravel/front/js/svelte/content/RenderField.svelte

<script>
    import Checkbox from "./elements/Checkbox.svelte";

    import Color from "./elements/Color.svelte";
    import Reference from "./elements/Reference.svelte";
    import Number from "./elements/Number.svelte";

    import Text from "./elements/Text.svelte";
    import Url from "./elements/Url.svelte";
    import Date from "./elements/Date.svelte";
    import Datetime from "./elements/Datetime.svelte";
    import File from "./elements/File.svelte";
    import Uuid from "./elements/UUID.svelte";
    import Rich from "./elements/Rich.svelte";

    const renderElements = {
        text: Text,
        slug: Text,
        rich: Rich,
        textarea: Text,
        color: Color,
        checkbox: Checkbox,
        reference: Reference,
        number: Number,
        url: Url,
        date: Date,
        datetime: Datetime,
        uuid: Uuid,
        file: File,
    };
    export let field;
    export let queryRecord;

</script>

<svelte:component
    this={renderElements[field.info.name]}
    value={queryRecord.record.data[field.name]}
    {queryRecord}
    {field}
/>