<template>
    <b-form-textarea rows="4"
                     max-rows="8"
                     v-model="html"></b-form-textarea>
</template>

<script>
import loc from './text.resx';
import Text from './Text';
import { i18n } from "../../../../localization/vue-i18n";
var d = new Text();
export default {
    i18n: i18n(loc),
    props: {
        /**
         * object of type {
         *  text: ''
         * }
         */
        value: {
            type: Object,
            default() {
                return d.getEmptyData();
            }
        },
        config: {
            type: Object,
            default() {
                return d.getEmptyConfig();
            }
        },
    },
    data() {
        return {
            html: this.value.text,
        };
    },
    watch: {
        'value.text': {
            handler() {
                if (this.value.text !== this.html) {
                    this.html = this.value.text;
                }
            },
            deep: true
        },
        html() {
            if (this.value.text !== this.html) {
                this.$emit('input', {
                    text: this.html
                });
            }
        },
    }
}
</script>