<template>
  <div  class="go-title-03">
    <n-input
        size="small"
        v-model:value="dataset"
        :minlength="1"
        type="text"
        placeholder="请输入相关内容"
        
      />
  </div>
</template>

<script setup lang="ts">
import { PropType, toRefs } from 'vue'
import { CreateComponentType } from '@/packages/index.d'

const props = defineProps({
  chartConfig: {
    type: Object as PropType<CreateComponentType>,
    required: true
  }
})

const { w, h } = toRefs(props.chartConfig.attr)
const {
  textColor,
  textSize,
  backgroundColor,
  borderColor,
  dataset
} = toRefs(props.chartConfig.option)
</script>

<style lang="scss" scoped>
@include go('title-03') {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center; 

  :deep(.n-input){
    height: v-bind('h+"px"');
    background: v-bind('backgroundColor');
  }
  :deep(.n-input__input-el) {
    color: v-bind('textColor');
    font-size: v-bind('textSize+"px"');
  }
  :deep(.n-input__state-border){
    border-color: v-bind('borderColor');
  }

}
</style>
