FormLabel >=2.7.0

A label component that automatically handles the labelIcon property and position.

Usage

template

<template>
  <FormLabel 
      :label-icon="labelIcon" 
      :label-icon-position="labelIconPosition" 
      :label="field.label" 
      :field-id="props.id"
  />
</template>

script setup

<script setup>
import { toRefs } from 'vue'
import { FormLabel, useLabelIcon, useFieldProps } from '@kevinkosterr/vue3-form-generator'

const props = defineProps(useFieldProps())

const { field, model } = toRefs(props)
const { labelIcon, labelIconPosition } = useLabelIcon(field.value.labelIcon)
</script>

Props

labelIcon string | ComponentPublicInstance | null

Either a string webfont class, a component or LabelIconDefinition.

labelIconPosition 'left' | 'right' | null

Either 'left', 'right' or null

label string

Label as set by the field schema.

fieldId string

Computed field id, taken from props.