lucent-laravel/front/js/svelte/records/elements/Url.svelte

<script>
    import { getContext } from "svelte";
    const channelurl = getContext("channelurl");
    export let field;
    export let value;
    export let schema;
    let id = self.crypto.randomUUID();
</script>

<div class="mb-0">
    <div class="d-flex justify-content-between">
        <label for={id} class="form-label">{field.label}</label>
        <a
            class="text-decoration-none"
            href="{channelurl}/schemas/{schema.name}/fields/edit/{field.name}"
            ><code class="text-primary opacity-50">{field.name}</code></a
        >
    </div>
    <input
        type="url"
        {id}
        class="form-control"
        bind:value
        placeholder="https://www.example.com"
    />
    {#if field.help}
        <small class=" text-primary opacity-50">{field.help}</small>
    {/if}
</div>