[
{
"$el": "div",
"if": "true",
"attrs": {
"class": "grid grid-cols-1 md:grid-cols-2 : xl:grid-cols-3 gap-1"
},
"children": [
{
"$formkit": "primeOutputText",
"name": "name",
"label": "Name",
"class": "text-[var(--p-primary-color)]"
},
{
"$formkit": "primeOutputNumber",
"name": "number",
"label": "Number",
"format": "short"
},
{
"$formkit": "primeOutputDate",
"name": "date",
"label": "Date",
"format": "rangeYear"
},
{
"$formkit": "primeOutputText",
"name": "text1",
"label": "Text"
},
{
"$formkit": "primeOutputText",
"name": "text2",
"label": "Text",
"validation": "required",
"class": "bg-[var(--p-primary-color)]"
}
]
}
]