<script setup lang="ts">

const props = defineProps(
    {
        data: {type:String, required:true}
    }
)


</script>

<template>
    <div class="w-full h-2/3 text-center dark:text-white mt-2 flex flex-col gap-4 overflow-auto">
        <div class="flex flex-row gap-4"> 
            <div class="w-full font-bold">Name</div> 
            <div class="w-full font-bold">Value</div> 
        </div >
        <div class="flex flex-row gap-4" v-for="(value,name) in JSON.parse(data)" :key="name">
            <div class="w-1/2 break-words">{{ name }}</div>
            <div class="w-1/2 break-words">{{ value }}</div>
        </div>
    </div>
</template>