<script setup>
const props = defineProps({
    field: Object,
})

const model = defineModel();
</script>

<template>
    <div class="grid grid-cols-2 gap-4">
        <div>
            <label class="text-xs mb-2 text-gray-600">{{ __('daylight::general.label') }}</label>
            <input
                type="text"
                :id="field.name"
                v-model="model.label"
                class="block w-full rounded-md py-1.5 border-gray-300 text-gray-900 shadow-sm placeholder:text-gray-400 sm:text-sm"
            >
        </div>

        <div>
            <label class="text-xs mb-2 text-gray-600">{{ __('daylight::general.url') }}</label>
            <input
                type="text"
                :id="field.name"
                v-model="model.url"
                class="block w-full rounded-md py-1.5 border-gray-300 text-gray-900 shadow-sm placeholder:text-gray-400 sm:text-sm"
            >
        </div>
    </div>
</template>
