36 lines
909 B
Vue
36 lines
909 B
Vue
<script setup lang="ts">
|
|
import type { PublicFormField } from '@form-schema/types/formBuilder'
|
|
import { getValidatorsForField } from '@form-schema/utils/formValidation'
|
|
|
|
const props = defineProps<{
|
|
field: PublicFormField
|
|
modelValue: unknown
|
|
errorMessages?: string[]
|
|
}>()
|
|
|
|
const emit = defineEmits<{
|
|
(e: 'update:modelValue', v: string): void
|
|
(e: 'blur'): void
|
|
}>()
|
|
|
|
const rules = computed(() => getValidatorsForField(props.field))
|
|
const model = computed({
|
|
get: () => (props.modelValue ?? '') as string,
|
|
set: (v: string) => emit('update:modelValue', v),
|
|
})
|
|
</script>
|
|
|
|
<template>
|
|
<AppTextField
|
|
v-model="model"
|
|
:label="field.label"
|
|
:hint="field.help_text ?? undefined"
|
|
persistent-hint
|
|
:rules="rules"
|
|
:error-messages="errorMessages"
|
|
:required="field.is_required"
|
|
:maxlength="field.validation_rules?.max_length ?? undefined"
|
|
@blur="emit('blur')"
|
|
/>
|
|
</template>
|