100 lines
2.3 KiB
TypeScript
100 lines
2.3 KiB
TypeScript
'use client'
|
|
import type { AnswerValue, Question, QuestionOption } from '@/lib/form-engine.types'
|
|
import { RadioGroup } from './widgets/radio-group'
|
|
import { CheckboxGroup } from './widgets/checkbox-group'
|
|
import { TextAreaField } from './widgets/text-area-field'
|
|
import { TextShortField } from './widgets/text-short-field'
|
|
|
|
interface QuestionRendererProps {
|
|
question: Question
|
|
value: AnswerValue
|
|
onChange: (value: AnswerValue) => void
|
|
error?: string
|
|
}
|
|
|
|
const YES_NO_OPTIONS: QuestionOption[] = [
|
|
{ value: 'true', label: 'Sí' },
|
|
{ value: 'false', label: 'No' },
|
|
]
|
|
|
|
export function QuestionRenderer({ question, value, onChange, error }: QuestionRendererProps) {
|
|
const { code, type, prompt, required, max_select, options } = question
|
|
const legend = (
|
|
<>
|
|
<span className="q-code">{code} ·</span> {prompt}
|
|
</>
|
|
)
|
|
|
|
if (type === 'single_choice' && options) {
|
|
return (
|
|
<RadioGroup
|
|
name={code}
|
|
legend={legend}
|
|
options={options}
|
|
value={(value as string) ?? undefined}
|
|
required={required}
|
|
onChange={onChange}
|
|
error={error}
|
|
/>
|
|
)
|
|
}
|
|
|
|
if (type === 'multiple_choice' && options) {
|
|
return (
|
|
<CheckboxGroup
|
|
name={code}
|
|
legend={legend}
|
|
options={options}
|
|
value={(value as string[]) ?? []}
|
|
maxSelect={max_select}
|
|
required={required}
|
|
onChange={onChange}
|
|
error={error}
|
|
/>
|
|
)
|
|
}
|
|
|
|
// yes_no resuelto con el RadioGroup existente — dos opciones fijas, sin widget nuevo.
|
|
if (type === 'yes_no') {
|
|
return (
|
|
<RadioGroup
|
|
name={code}
|
|
legend={legend}
|
|
options={YES_NO_OPTIONS}
|
|
value={(value as string) ?? undefined}
|
|
required={required}
|
|
onChange={onChange}
|
|
error={error}
|
|
/>
|
|
)
|
|
}
|
|
|
|
if (type === 'text_short') {
|
|
return (
|
|
<TextShortField
|
|
name={code}
|
|
label={legend}
|
|
value={(value as string) ?? ''}
|
|
required={required}
|
|
onChange={onChange}
|
|
error={error}
|
|
/>
|
|
)
|
|
}
|
|
|
|
if (type === 'text_long') {
|
|
return (
|
|
<TextAreaField
|
|
name={code}
|
|
label={legend}
|
|
value={(value as string) ?? ''}
|
|
required={required}
|
|
onChange={onChange}
|
|
error={error}
|
|
/>
|
|
)
|
|
}
|
|
|
|
return null
|
|
}
|