<template>
	<div class="form-text">
		<el-text tag="p" size="small" type="info" v-for="(item, index) in list" :key="index">{{
			item
		}}</el-text>
	</div>
</template>

<script setup lang="ts" name="node-base-form-text">
import { computed } from "vue";
import { isArray } from "lodash-es";

const props = defineProps({
	text: {
		type: [String, Array],
		default: ""
	}
});

const list = computed(() => {
	return isArray(props.text) ? props.text : [props.text];
});
</script>

<style lang="scss" scoped>
.form-text {
	line-height: normal;

	.el-text {
		margin-bottom: 10px;

		&:last-child {
			margin-bottom: 0;
		}
	}
}
</style>
