<template>
    <VueJsonPretty
        :data="modelData[row.model]"
        :deep="row.deep"
        :showLength="row.showLength"
        :showDoubleQuotes="row.showDoubleQuotes"
        :highlightSelectedNode="row.highlightSelectedNode"
        :path="row.path"
        :editable="row.edit"
    />
</template>

<script lang="ts">
import { defineComponent, PropType } from 'vue'
import VueJsonPretty from 'vue-json-pretty'
import type { VueJsonPrettyInterface } from './index'
import 'vue-json-pretty/lib/styles.css'

export default defineComponent({
    name: 'InfoVueJsonPretty',
    components: { VueJsonPretty },
    props: {
        row: {
            type: Object as PropType<VueJsonPrettyInterface>,
            default: () => {
            }
        },
        modelData: {
            type: Object,
            default: () => {}
        }
    }
})
</script>
<style lang="scss" scoped>
</style>
