cip-components/cip-form-input/basic/text/index.vue

<template>
  <div :style="{width, fontWeight, fontSize, textAlign}" v-textarea="modelValue"></div>
</template>
<script>
import { useFormInput } from '@cip/components/hooks/form-input'
import { formInputProps } from '../../form-input-props'
import { computed } from 'vue'
import TextareaDirective from '../../../directives/textarea'
export default {
  props: formInputProps,
  emits: ['update:modelValue'],
  directives: { [TextareaDirective.name]: TextareaDirective },
  setup (props, context) {
    const { width, ...formInput } = useFormInput(props, context)
    const fontWeight = computed(() => {
      return props.config.fontWeight ?? 'normal'
    })
    const fontSize = computed(() => {
      return props.config.fontSize + 'px' ?? '12px'
    })
    const textAlign = computed(() => {
      return props.config.textAlign ?? 'left'
    })

    return {
      ...formInput,
      ...context.attrs,
      width,
      fontWeight,
      fontSize,
      textAlign
    }
  }
}
</script>