ivt
Version:
Ivt Components Library
1 lines • 76.6 kB
Source Map (JSON)
{"version":3,"file":"index.mjs","sources":["../../src/utils/format.ts","../../src/components/default/form-layout/FormLayout.tsx"],"sourcesContent":["import { formatDateToBrazilian } from \"./date\";\nimport { formatMoney } from \"./format-numbers\";\n\n/**\n * Formata uma data para o padrão brasileiro (dd/MM/yyyy)\n * @param date Data a ser formatada (Date, string ou undefined)\n * @returns String formatada ou undefined se não houver valor\n */\nexport function formatDate(date: Date | string | undefined): string | undefined {\n\tif (!date) return undefined;\n\treturn formatDateToBrazilian(date);\n}\n\n/**\n * Formata um CNPJ no padrão brasileiro (##.###.###/####-##)\n * @param cnpj CNPJ a ser formatado (string com ou sem formatação)\n * @returns String formatada ou undefined se não houver valor\n */\nexport function formatCNPJ(cnpj: string | undefined | null): string | undefined {\n\tif (!cnpj) return undefined;\n\n\t// Remove caracteres não numéricos\n\tconst cleaned = cnpj.replace(/\\D/g, \"\");\n\n\t// Verifica se tem 14 dígitos\n\tif (cleaned.length !== 14) {\n\t\t// Se não tiver 14 dígitos, retorna o valor original\n\t\treturn cnpj;\n\t}\n\n\t// Formata: ##.###.###/####-##\n\treturn `${cleaned.slice(0, 2)}.${cleaned.slice(2, 5)}.${cleaned.slice(5, 8)}/${cleaned.slice(8, 12)}-${cleaned.slice(12, 14)}`;\n}\n\n/**\n * Formata um valor numérico como moeda brasileira (R$)\n * @param value Valor numérico a ser formatado\n * @returns String formatada ou undefined se não houver valor\n */\nexport function formatCurrency(value: number | undefined | null): string | undefined {\n\tif (value === null || value === undefined) return undefined;\n\treturn formatMoney({\n\t\tvalue,\n\t\tcurrency: \"BRL\",\n\t\tminimumFractionDigits: 2,\n\t\tmaximumFractionDigits: 2,\n\t});\n}\n","/** biome-ignore-all lint/suspicious/noExplicitAny: <any> */\n\"use client\";\n\nimport * as React from \"react\";\nimport { useEffect, useId, useRef, useState } from \"react\";\nimport { DateRange } from \"react-day-picker\";\nimport type { Control, FieldPath, FieldValues, UseFormReturn } from \"react-hook-form\";\nimport { NumericFormat, PatternFormat } from \"react-number-format\";\nimport { AutoComplete, CalendarPopover, CalendarRange } from \"@/components/default/base\";\nimport type { CalendarRangeProps } from \"@/components/default/base/CalendarRange\";\nimport { ListItem } from \"@/components/default/layout\";\nimport { Checkbox } from \"@/components/ui/checkbox\";\nimport { Combobox } from \"@/components/ui/combobox\";\nimport { DatePicker } from \"@/components/ui/date-picker\";\nimport {\n\tForm,\n\tFormControl,\n\tFormDescription,\n\tFormField,\n\tFormItem,\n\tFormLabel,\n\tFormMessage,\n} from \"@/components/ui/form\";\nimport { Input } from \"@/components/ui/input\";\nimport { InputFile } from \"@/components/ui/input-file\";\nimport { InputOTP, InputOTPGroup, InputOTPSlot } from \"@/components/ui/input-otp\";\nimport { Label } from \"@/components/ui/label\";\nimport { MultiSelect } from \"@/components/ui/multi-select/multi-select\";\nimport { RadioGroup, RadioGroupItem } from \"@/components/ui/radio-group\";\nimport {\n\tSelect,\n\tSelectContent,\n\tSelectItem,\n\tSelectTrigger,\n\tSelectValue,\n} from \"@/components/ui/select\";\nimport { Separator } from \"@/components/ui/separator\";\nimport { Slider } from \"@/components/ui/slider\";\nimport { Switch } from \"@/components/ui/switch\";\nimport { Textarea } from \"@/components/ui/textarea\";\nimport { Toggle } from \"@/components/ui/toggle\";\nimport { cn } from \"@/lib/utils\";\nimport { formatCNPJ, formatCurrency, formatDate } from \"@/utils/format\";\nimport { styleInput, styleInputError } from \"@/utils/styles\";\n\nexport type FormFieldType =\n\t| \"text\"\n\t| \"email\"\n\t| \"url\"\n\t| \"tel\"\n\t| \"textarea\"\n\t| \"number\"\n\t| \"numberRange\"\n\t| \"currency\"\n\t| \"pattern\"\n\t| \"select\"\n\t| \"multiselect\"\n\t| \"date\"\n\t| \"date-picker\"\n\t| \"dateRange\"\n\t| \"checkbox\"\n\t| \"switch\"\n\t| \"radio\"\n\t| \"slider\"\n\t| \"otp\"\n\t| \"toggle\"\n\t| \"autocomplete\"\n\t| \"combobox\"\n\t| \"file\"\n\t| \"custom\";\n\nexport interface FormFieldConfig<T extends FieldValues> {\n\tname: FieldPath<T>;\n\tlabel: string | null;\n\ttype: FormFieldType;\n\tplaceholder?: string;\n\tdescription?: React.ReactNode;\n\trequired?: boolean;\n\tisCheckboxDefault?: boolean;\n\tdisabled?: boolean;\n\tcols?: number;\n\tclassName?: string;\n\tinlineElement?: React.ReactNode;\n\toptions?: { label: string; value: string | number }[] | string[];\n\titems?: string[];\n\tallowNegative?: boolean;\n\tmaxLength?: number;\n\tendAdornment?: (value: any) => React.ReactNode;\n\n\tdecimalScale?: number;\n\tprefix?: string;\n\tformat?: string;\n\tmask?: string;\n\tradioOptions?: { label: string; value: string }[];\n\totpLength?: number;\n\tsliderRange?: { min: number; max: number; step?: number };\n\tautocompleteConfig?: {\n\t\tfetchOptions: (\n\t\t\tterm: string,\n\t\t) => Promise<Array<{ id: number | string; label: string; [key: string]: any }>>;\n\t\tgetOptionLabel?: (option: any) => string;\n\t\tgetOptionKey?: (option: any) => number | string;\n\t\tgetOptionValue?: (option: any) => any;\n\t\tsearchPlaceholder?: string;\n\t\tmessageEmpty?: string;\n\t\tonChangeCallback?: (option: any, form: UseFormReturn<T>) => void;\n\t\tclearable?: boolean;\n\t\tclassName?: string;\n\t};\n\tmultiSelectConfig?: {\n\t\tmaxCount?: number;\n\t\tsubtle?: boolean;\n\t\tsearchPlaceholder?: string;\n\t\temptyMessage?: string;\n\t\tgroupHeading?: string;\n\t\tnormalizeSearch?: boolean;\n\t\tvalueType?: \"number\" | \"string\";\n\t};\n\tcomboboxConfig?: {\n\t\titems: { value: string; label: string }[];\n\t\tsearchPlaceholder?: string;\n\t\temptyMessage?: string;\n\t\tgroupHeading?: string;\n\t\tnormalizeSearch?: boolean;\n\t\tvalueType?: \"number\" | \"string\";\n\t};\n\tdateConfig?: Omit<CalendarRangeProps, \"value\" | \"onChange\" | \"id\" | \"className\">;\n\tfileConfig?: {\n\t\taccept?: string;\n\t};\n\tselectConfig?: {\n\t\tclearable?: boolean;\n\t};\n\trender?: (props: { field: any; form: UseFormReturn<T> }) => React.ReactNode;\n}\n\nexport interface FormSectionConfig<T extends FieldValues> {\n\ttitle?: string;\n\tdescription?: string;\n\tfields: FormFieldConfig<T>[];\n}\n\nexport interface BaseFormFieldProps<T extends FieldValues> {\n\tconfig: FormFieldConfig<T>;\n\tcontrol: Control<T>;\n\treadOnly?: boolean;\n\tform?: UseFormReturn<T>;\n}\n\nfunction AutocompleteFieldWrapper<T extends FieldValues>({\n\tfield,\n\tform,\n\tautocompleteConfig,\n\tplaceholder,\n\tdisabled,\n\tisError,\n}: {\n\tfield: any;\n\tform: UseFormReturn<T>;\n\tautocompleteConfig: NonNullable<FormFieldConfig<T>[\"autocompleteConfig\"]>;\n\tplaceholder?: string;\n\tdisabled?: boolean;\n\tisError?: boolean;\n}) {\n\tconst [open, setOpen] = useState(false);\n\tconst [selectedOption, setSelectedOption] = useState<any>(null);\n\tconst selectedOptionRef = useRef<any>(null);\n\n\tconst getOptionLabel =\n\t\tautocompleteConfig.getOptionLabel || ((option: any) => option.label || String(option.id));\n\tconst getOptionKey = autocompleteConfig.getOptionKey || ((option: any) => option.id);\n\tconst getOptionValue = autocompleteConfig.getOptionValue || ((option: any) => option.id);\n\n\tuseEffect(() => {\n\t\tif (selectedOptionRef.current && field.value) {\n\t\t\tconst currentValue = getOptionValue(selectedOptionRef.current);\n\t\t\tconst newValue =\n\t\t\t\ttypeof field.value === \"object\" && field.value !== null\n\t\t\t\t\t? getOptionValue(field.value)\n\t\t\t\t\t: field.value;\n\n\t\t\tif (currentValue === newValue) {\n\t\t\t\treturn;\n\t\t\t}\n\t\t}\n\n\t\tif (field.value && typeof field.value === \"object\" && field.value !== null) {\n\t\t\tselectedOptionRef.current = field.value;\n\t\t\tsetSelectedOption(field.value);\n\t\t\treturn;\n\t\t}\n\n\t\tif (field.value && autocompleteConfig.fetchOptions) {\n\t\t\tconst isNumericValue = typeof field.value === \"number\";\n\t\t\tconst searchTerm = isNumericValue ? \"\" : field.value;\n\n\t\t\tautocompleteConfig\n\t\t\t\t.fetchOptions(searchTerm)\n\t\t\t\t.then((options) => {\n\t\t\t\t\tlet found: any = null;\n\n\t\t\t\t\tif (isNumericValue) {\n\t\t\t\t\t\tfound = options.find((opt) => getOptionKey(opt) === field.value);\n\t\t\t\t\t} else {\n\t\t\t\t\t\tfound = options.find((opt) => getOptionValue(opt) === field.value);\n\n\t\t\t\t\t\tif (!found) {\n\t\t\t\t\t\t\tfound = options.find((opt) => {\n\t\t\t\t\t\t\t\tconst label = getOptionLabel(opt);\n\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\tlabel === field.value || label.toLowerCase().includes(field.value.toLowerCase())\n\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t});\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\n\t\t\t\t\tif (found) {\n\t\t\t\t\t\tselectedOptionRef.current = found;\n\t\t\t\t\t\tsetSelectedOption(found);\n\t\t\t\t\t} else {\n\t\t\t\t\t\tselectedOptionRef.current = null;\n\t\t\t\t\t\tsetSelectedOption(null);\n\t\t\t\t\t}\n\t\t\t\t})\n\t\t\t\t.catch(() => {\n\t\t\t\t\tselectedOptionRef.current = null;\n\t\t\t\t\tsetSelectedOption(null);\n\t\t\t\t});\n\t\t} else if (!field.value) {\n\t\t\tselectedOptionRef.current = null;\n\t\t\tsetSelectedOption(null);\n\t\t}\n\t}, [field.value, autocompleteConfig.fetchOptions, getOptionValue, getOptionLabel, getOptionKey]);\n\n\treturn (\n\t\t<AutoComplete\n\t\t\tvalue={selectedOption}\n\t\t\tonChange={(option: any) => {\n\t\t\t\tconst value = option ? getOptionValue(option) : null;\n\t\t\t\tfield.onChange(value);\n\t\t\t\tselectedOptionRef.current = option;\n\t\t\t\tsetSelectedOption(option);\n\t\t\t\tif (option && autocompleteConfig.onChangeCallback) {\n\t\t\t\t\tautocompleteConfig.onChangeCallback(option, form);\n\t\t\t\t}\n\t\t\t}}\n\t\t\tplaceholder={placeholder || \"Digite para buscar...\"}\n\t\t\tsearchPlaceholder={autocompleteConfig.searchPlaceholder || \"Buscar...\"}\n\t\t\topen={open}\n\t\t\tonOpenChange={setOpen}\n\t\t\tfetchOptions={autocompleteConfig.fetchOptions}\n\t\t\tdisabled={disabled}\n\t\t\tmessageEmpty={autocompleteConfig.messageEmpty || \"Nenhum resultado encontrado...\"}\n\t\t\tgetOptionLabel={getOptionLabel}\n\t\t\tgetOptionKey={getOptionKey}\n\t\t\tclearable={autocompleteConfig.clearable ?? true}\n\t\t\tclassName={cn(\n\t\t\t\t\"border-input bg-background ring-offset-background placeholder:text-muted-foreground focus-visible:ring-ring flex h-10 w-full rounded-md border px-3 py-2 text-sm focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:outline-none disabled:cursor-not-allowed disabled:opacity-50 truncate max-w-150\",\n\t\t\t\tautocompleteConfig?.className,\n\t\t\t\tisError && styleInputError,\n\t\t\t)}\n\t\t/>\n\t);\n}\n\nexport function BaseFormField<T extends FieldValues>({\n\tconfig,\n\tcontrol,\n\treadOnly = false,\n\tform,\n}: BaseFormFieldProps<T>) {\n\tconst baseId = useId();\n\tconst {\n\t\tname,\n\t\tlabel,\n\t\ttype,\n\t\tplaceholder,\n\t\tdescription,\n\t\trequired,\n\t\toptions,\n\t\titems,\n\t\tallowNegative,\n\t\tdecimalScale,\n\t\tdisabled,\n\t\tprefix,\n\t\tradioOptions,\n\t\totpLength,\n\t\tsliderRange,\n\t\tformat: patternFormat,\n\t\tmask,\n\t\tautocompleteConfig,\n\t\tcomboboxConfig,\n\t\tinlineElement,\n\t\trender: customRender,\n\t\tmaxLength,\n\t\tendAdornment,\n\t\tmultiSelectConfig,\n\t\tdateConfig,\n\t\tfileConfig,\n\t\tisCheckboxDefault,\n\t} = config;\n\n\tconst formatReadOnlyValue = (value: unknown, fieldType: FormFieldType): string | undefined => {\n\t\tif (value === null || value === undefined || value === \"\") {\n\t\t\treturn undefined;\n\t\t}\n\n\t\tswitch (fieldType) {\n\t\t\tcase \"date\":\n\t\t\tcase \"date-picker\":\n\t\t\t\treturn formatDate(value as Date | string | undefined);\n\t\t\tcase \"currency\":\n\t\t\t\treturn formatCurrency(value as number);\n\t\t\tcase \"number\":\n\t\t\t\treturn typeof value === \"number\"\n\t\t\t\t\t? value.toLocaleString(\"pt-BR\", {\n\t\t\t\t\t\t\tminimumFractionDigits: decimalScale ?? 0,\n\t\t\t\t\t\t\tmaximumFractionDigits: decimalScale ?? 7,\n\t\t\t\t\t\t})\n\t\t\t\t\t: String(value);\n\t\t\tcase \"pattern\":\n\t\t\t\tif (patternFormat && typeof value === \"string\") {\n\t\t\t\t\tif (patternFormat.includes(\"##.###.###/####-##\")) {\n\t\t\t\t\t\treturn formatCNPJ(value);\n\t\t\t\t\t}\n\t\t\t\t\treturn value;\n\t\t\t\t}\n\t\t\t\treturn String(value);\n\t\t\tcase \"select\":\n\t\t\t\tif (options && options.length > 0) {\n\t\t\t\t\tconst option = options.find((opt) => {\n\t\t\t\t\t\tconst optValue = typeof opt === \"object\" ? opt.value : opt;\n\t\t\t\t\t\treturn String(optValue) === String(value);\n\t\t\t\t\t});\n\t\t\t\t\tif (option) {\n\t\t\t\t\t\treturn typeof option === \"object\" ? option.label : option;\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t\treturn String(value);\n\t\t\tcase \"checkbox\":\n\t\t\tcase \"switch\":\n\t\t\tcase \"toggle\":\n\t\t\t\treturn value ? \"Sim\" : \"Não\";\n\t\t\tcase \"radio\":\n\t\t\t\tif (radioOptions) {\n\t\t\t\t\tconst option = radioOptions.find((opt) => String(opt.value) === String(value));\n\t\t\t\t\treturn option ? option.label : String(value);\n\t\t\t\t}\n\t\t\t\treturn String(value);\n\t\t\tcase \"slider\":\n\t\t\t\treturn typeof value === \"number\" ? String(value) : undefined;\n\t\t\tcase \"numberRange\": {\n\t\t\t\tif (typeof value === \"object\" && value !== null && (\"min\" in value || \"max\" in value)) {\n\t\t\t\t\tconst range = value as { min?: number | null; max?: number | null };\n\t\t\t\t\tconst minStr =\n\t\t\t\t\t\trange.min !== null && range.min !== undefined\n\t\t\t\t\t\t\t? range.min.toLocaleString(\"pt-BR\", {\n\t\t\t\t\t\t\t\t\tminimumFractionDigits: decimalScale ?? 0,\n\t\t\t\t\t\t\t\t\tmaximumFractionDigits: decimalScale ?? 7,\n\t\t\t\t\t\t\t\t})\n\t\t\t\t\t\t\t: \"\";\n\t\t\t\t\tconst maxStr =\n\t\t\t\t\t\trange.max !== null && range.max !== undefined\n\t\t\t\t\t\t\t? range.max.toLocaleString(\"pt-BR\", {\n\t\t\t\t\t\t\t\t\tminimumFractionDigits: decimalScale ?? 0,\n\t\t\t\t\t\t\t\t\tmaximumFractionDigits: decimalScale ?? 7,\n\t\t\t\t\t\t\t\t})\n\t\t\t\t\t\t\t: \"\";\n\t\t\t\t\tif (minStr && maxStr) {\n\t\t\t\t\t\treturn `${minStr} - ${maxStr}`;\n\t\t\t\t\t}\n\t\t\t\t\tif (minStr) return `Mín: ${minStr}`;\n\t\t\t\t\tif (maxStr) return `Máx: ${maxStr}`;\n\t\t\t\t}\n\t\t\t\treturn undefined;\n\t\t\t}\n\t\t\tcase \"dateRange\": {\n\t\t\t\tif (typeof value === \"object\" && value !== null && \"from\" in value) {\n\t\t\t\t\tconst range = value as DateRange;\n\t\t\t\t\tif (range.from && range.to) {\n\t\t\t\t\t\treturn `${formatDate(range.from)} - ${formatDate(range.to)}`;\n\t\t\t\t\t}\n\t\t\t\t\tif (range.from) {\n\t\t\t\t\t\treturn `De: ${formatDate(range.from)}`;\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t\treturn undefined;\n\t\t\t}\n\t\t\tcase \"multiselect\": {\n\t\t\t\tif (Array.isArray(value) && value.length > 0) {\n\t\t\t\t\treturn value.join(\", \");\n\t\t\t\t}\n\t\t\t\treturn undefined;\n\t\t\t}\n\t\t\tcase \"combobox\": {\n\t\t\t\tif (typeof value === \"string\" || typeof value === \"number\") {\n\t\t\t\t\tconst valStr = String(value);\n\t\t\t\t\tif (config.comboboxConfig?.items) {\n\t\t\t\t\t\tconst option = config.comboboxConfig.items.find((opt) => String(opt.value) === valStr);\n\t\t\t\t\t\treturn option ? option.label : valStr;\n\t\t\t\t\t}\n\t\t\t\t\treturn valStr;\n\t\t\t\t}\n\t\t\t\treturn String(value);\n\t\t\t}\n\t\t\tdefault:\n\t\t\t\treturn String(value);\n\t\t}\n\t};\n\n\tif (readOnly) {\n\t\treturn (\n\t\t\t<FormField\n\t\t\t\tcontrol={control}\n\t\t\t\tname={name}\n\t\t\t\trender={({ field }: any) => (\n\t\t\t\t\t<ListItem title={label ?? \"\"} value={formatReadOnlyValue(field.value, type)} />\n\t\t\t\t)}\n\t\t\t/>\n\t\t);\n\t}\n\n\treturn (\n\t\t<FormField\n\t\t\tcontrol={control}\n\t\t\tname={name}\n\t\t\trender={({ field, fieldState }: any) => {\n\t\t\t\tconst isError = fieldState?.invalid;\n\n\t\t\t\tif (customRender && form) {\n\t\t\t\t\treturn (\n\t\t\t\t\t\t<FormItem\n\t\t\t\t\t\t\tclassName={cn(\n\t\t\t\t\t\t\t\ttype === \"checkbox\" &&\n\t\t\t\t\t\t\t\t\t\"flex flex-row items-start space-y-0 space-x-3 rounded-md border p-4\",\n\t\t\t\t\t\t\t\ttype === \"checkbox\" && isCheckboxDefault && \"border-none p-0\",\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{type !== \"checkbox\" && type !== \"switch\" && (\n\t\t\t\t\t\t\t\t<FormLabel htmlFor={name}>\n\t\t\t\t\t\t\t\t\t{label}\n\t\t\t\t\t\t\t\t\t{label && required && (\n\t\t\t\t\t\t\t\t\t\t<span\n\t\t\t\t\t\t\t\t\t\t\tclassName=\"text-destructive\"\n\t\t\t\t\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t\t\t\t\tfloat: \"none\",\n\t\t\t\t\t\t\t\t\t\t\t\twidth: \"auto\",\n\t\t\t\t\t\t\t\t\t\t\t\tmarginRight: 0,\n\t\t\t\t\t\t\t\t\t\t\t\tmarginTop: 0,\n\t\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t*\n\t\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t\t<span className={!label ? \"text-transparent\" : \"\"}>:</span>\n\t\t\t\t\t\t\t\t</FormLabel>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t<div className={cn(inlineElement && \"flex w-full items-center gap-2\")}>\n\t\t\t\t\t\t\t\t<div className={cn(inlineElement && \"min-w-0 flex-1\")}>\n\t\t\t\t\t\t\t\t\t<FormControl className={isError ? styleInputError : \"\"}>\n\t\t\t\t\t\t\t\t\t\t{customRender({ field, form })}\n\t\t\t\t\t\t\t\t\t</FormControl>\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t{inlineElement && <div className=\"shrink-0\">{inlineElement}</div>}\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t{type !== \"checkbox\" && description && !isError && (\n\t\t\t\t\t\t\t\t<FormDescription>{description}</FormDescription>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t<FormMessage />\n\t\t\t\t\t\t</FormItem>\n\t\t\t\t\t);\n\t\t\t\t}\n\n\t\t\t\treturn (\n\t\t\t\t\t<FormItem\n\t\t\t\t\t\tclassName={cn(\n\t\t\t\t\t\t\ttype === \"checkbox\" &&\n\t\t\t\t\t\t\t\t\"flex flex-row items-start space-y-0 space-x-3 rounded-md border p-4\",\n\t\t\t\t\t\t\tisCheckboxDefault && \"border-none p-0\",\n\t\t\t\t\t\t)}\n\t\t\t\t\t>\n\t\t\t\t\t\t{type !== \"checkbox\" && type !== \"switch\" && (\n\t\t\t\t\t\t\t<FormLabel htmlFor={name}>\n\t\t\t\t\t\t\t\t{label}\n\t\t\t\t\t\t\t\t{label && required && (\n\t\t\t\t\t\t\t\t\t<span\n\t\t\t\t\t\t\t\t\t\tclassName=\"text-destructive\"\n\t\t\t\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t\t\t\tfloat: \"none\",\n\t\t\t\t\t\t\t\t\t\t\twidth: \"auto\",\n\t\t\t\t\t\t\t\t\t\t\tmarginRight: 0,\n\t\t\t\t\t\t\t\t\t\t\tmarginTop: 0,\n\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t*\n\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t<span className={!label ? \"text-transparent\" : \"\"}>:</span>\n\t\t\t\t\t\t\t</FormLabel>\n\t\t\t\t\t\t)}\n\n\t\t\t\t\t\t<div className={cn(inlineElement && \"flex w-full items-center gap-2\")}>\n\t\t\t\t\t\t\t<div className={cn(inlineElement && \"min-w-0 flex-1\")}>\n\t\t\t\t\t\t\t\t<FormControl>\n\t\t\t\t\t\t\t\t\t{(() => {\n\t\t\t\t\t\t\t\t\t\tswitch (type) {\n\t\t\t\t\t\t\t\t\t\t\tcase \"text\":\n\t\t\t\t\t\t\t\t\t\t\tcase \"email\":\n\t\t\t\t\t\t\t\t\t\t\tcase \"url\":\n\t\t\t\t\t\t\t\t\t\t\tcase \"tel\":\n\t\t\t\t\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t\t\t\t\t<div className=\"relative\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t<Input\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t{...field}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\ttype={type}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tplaceholder={placeholder}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tmaxLength={maxLength}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tvalue={(field.value as string) || \"\"}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tclassName={cn(\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tisError ? styleInputError : \"\",\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tendAdornment && \"pr-20\",\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t{endAdornment && (\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<div className=\"text-muted-foreground pointer-events-none absolute top-1/2 right-3 -translate-y-1/2 text-xs\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t{endAdornment(field.value)}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t\t\t);\n\n\t\t\t\t\t\t\t\t\t\t\tcase \"file\":\n\t\t\t\t\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t\t\t\t\t<InputFile\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tid={String(name)}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tname={String(name)}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tvalue={field.value}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tonChange={(e) => {\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tconst file = e.target.files?.[0] || null;\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tfield.onChange(file);\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\taccept={fileConfig?.accept}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tisError={isError}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tplaceholder={placeholder}\n\t\t\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t\t\t);\n\n\t\t\t\t\t\t\t\t\t\t\tcase \"textarea\":\n\t\t\t\t\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t\t\t\t\t<Textarea\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tclassName={cn(\"min-h-20\", isError && styleInputError)}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t{...field}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tplaceholder={placeholder}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tvalue={(field.value as string) || \"\"}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tmaxLength={maxLength}\n\t\t\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t\t\t);\n\n\t\t\t\t\t\t\t\t\t\t\tcase \"number\":\n\t\t\t\t\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t\t\t\t\t<NumericFormat\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tid={name}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tcustomInput={Input}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tdecimalSeparator=\",\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tthousandSeparator=\".\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tdecimalScale={decimalScale ?? 7}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tvalue={field.value ?? \"\"}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tonValueChange={(values) => {\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tif (values.value === \"\") {\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tfield.onChange(null);\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tfield.onChange(values.floatValue);\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tplaceholder={placeholder}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tclassName={cn(\"h-9\", isError && styleInputError)}\n\t\t\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t\t\t);\n\n\t\t\t\t\t\t\t\t\t\t\tcase \"currency\":\n\t\t\t\t\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t\t\t\t\t<NumericFormat\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tid={name}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tcustomInput={Input}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tdecimalSeparator=\",\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tthousandSeparator=\".\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tdecimalScale={decimalScale ?? 2}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tvalue={field.value ?? \"\"}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tonValueChange={(values) => {\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tif (values.value === \"\") {\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tfield.onChange(null);\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tfield.onChange(values.floatValue);\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tplaceholder={placeholder}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tprefix={prefix ?? \"R$ \"}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tclassName={cn(\"h-9\", isError && styleInputError)}\n\t\t\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t\t\t);\n\n\t\t\t\t\t\t\t\t\t\t\tcase \"pattern\":\n\t\t\t\t\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t\t\t\t\t<PatternFormat\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tcustomInput={Input}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tformat={patternFormat || \"\"}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tmask={mask || \"_\"}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tplaceholder={placeholder}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tvalue={(field.value as string) || \"\"}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tonValueChange={(values) => {\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tfield.onChange(values.value);\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tclassName={isError ? styleInputError : \"\"}\n\t\t\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t\t\t);\n\n\t\t\t\t\t\t\t\t\t\t\tcase \"select\": {\n\t\t\t\t\t\t\t\t\t\t\t\tconst selectValue = String(field.value || \"\");\n\t\t\t\t\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t\t\t\t\t<Select\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tonValueChange={field.onChange}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tvalue={selectValue}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tclearable={config.selectConfig?.clearable ?? true}\n\t\t\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t<FormControl>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<SelectTrigger\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tid={name}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tclassName={cn(\"w-full\", isError && styleInputError)}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<SelectValue placeholder={placeholder || \"Selecione\"} />\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t</SelectTrigger>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t</FormControl>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t<SelectContent className=\"max-h-75 overflow-x-hidden overflow-y-auto\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t{options?.map((opt) => {\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tconst val = typeof opt === \"object\" ? String(opt.value) : opt;\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tconst lab = typeof opt === \"object\" ? opt.label : opt;\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<SelectItem key={val} value={val}>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t{lab}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t</SelectItem>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t</SelectContent>\n\t\t\t\t\t\t\t\t\t\t\t\t\t</Select>\n\t\t\t\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\t\t\t}\n\n\t\t\t\t\t\t\t\t\t\t\tcase \"date\":\n\t\t\t\t\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t\t\t\t\t<CalendarPopover\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tid={name}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tdate={field.value}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tsetDate={field.onChange}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tplaceholder={placeholder}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tdisableFuture={false}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tdisableWeekends={false}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tclassName={cn(\"w-full\", isError && styleInputError)}\n\t\t\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t\t\t);\n\n\t\t\t\t\t\t\t\t\t\t\tcase \"date-picker\":\n\t\t\t\t\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t\t\t\t\t<DatePicker\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tid={name}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tdate={field.value}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tsetDate={field.onChange}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tplaceholder={placeholder}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tclassName={cn(\"w-full\", isError && styleInputError)}\n\t\t\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t\t\t);\n\n\t\t\t\t\t\t\t\t\t\t\tcase \"checkbox\":\n\t\t\t\t\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t\t\t\t\t<div className=\"flex items-center gap-2\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t<Checkbox\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tchecked={!!field.value}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tonCheckedChange={field.onChange}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tid={name}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t<div className=\"space-y-1 leading-none\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<FormLabel htmlFor={name}>{label}</FormLabel>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t{description && !isError && (\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<FormDescription>{description}</FormDescription>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t\t\t);\n\n\t\t\t\t\t\t\t\t\t\t\tcase \"switch\":\n\t\t\t\t\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t\t\t\t\t<div className=\"flex items-center justify-between\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t<FormLabel htmlFor={name}>{label}</FormLabel>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t<Switch\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tchecked={!!field.value}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tonCheckedChange={field.onChange}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t\t\t);\n\n\t\t\t\t\t\t\t\t\t\t\tcase \"radio\":\n\t\t\t\t\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t\t\t\t\t<RadioGroup\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tvalue={String(field.value ?? \"\")}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tonValueChange={field.onChange}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tclassName=\"flex flex-col gap-2\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tdisabled={disabled ?? false}\n\t\t\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t{(radioOptions ?? [])?.map((opt) => {\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tconst radioId = `${String(name)}-${opt.value}`;\n\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<div key={opt.value} className=\"flex items-center gap-2\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<RadioGroupItem value={opt.value} id={radioId} />\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<Label htmlFor={radioId}>{opt.label}</Label>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t\t\t\t\t\t\t\t</RadioGroup>\n\t\t\t\t\t\t\t\t\t\t\t\t);\n\n\t\t\t\t\t\t\t\t\t\t\tcase \"slider\":\n\t\t\t\t\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t\t\t\t\t<div className=\"space-y-2\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t<Slider\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tvalue={[Number(field.value ?? sliderRange?.min ?? 0)]}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tonValueChange={(vals: number[]) => field.onChange(vals[0])}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tmin={sliderRange?.min ?? 0}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tmax={sliderRange?.max ?? 100}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tstep={sliderRange?.step ?? 1}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t{typeof field.value === \"number\" && (\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<p className=\"text-muted-foreground text-xs\">Valor: {field.value}</p>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t\t\t);\n\n\t\t\t\t\t\t\t\t\t\t\tcase \"otp\":\n\t\t\t\t\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t\t\t\t\t<InputOTP\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tmaxLength={otpLength ?? 6}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tvalue={String(field.value ?? \"\")}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tonChange={field.onChange}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t<InputOTPGroup>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t{Array.from({ length: otpLength ?? 6 }, (_, i) => ({\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tid: `${baseId}-otp-${i}`,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tindex: i,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t})).map((slot) => (\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<InputOTPSlot key={slot.id} index={slot.index} />\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t))}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t</InputOTPGroup>\n\t\t\t\t\t\t\t\t\t\t\t\t\t</InputOTP>\n\t\t\t\t\t\t\t\t\t\t\t\t);\n\n\t\t\t\t\t\t\t\t\t\t\tcase \"toggle\":\n\t\t\t\t\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t\t\t\t\t<div className=\"flex items-center gap-2\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t<Toggle\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tpressed={!!field.value}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tonPressedChange={(pressed: boolean) => field.onChange(pressed)}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tclassName={cn(isError && styleInputError)}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t{label}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t</Toggle>\n\t\t\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t\t\t);\n\n\t\t\t\t\t\t\t\t\t\t\tcase \"autocomplete\": {\n\t\t\t\t\t\t\t\t\t\t\t\tif (!autocompleteConfig || !form) {\n\t\t\t\t\t\t\t\t\t\t\t\t\treturn null;\n\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t\t\t\t\t<AutocompleteFieldWrapper\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tfield={field}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tform={form}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tautocompleteConfig={autocompleteConfig}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tplaceholder={placeholder}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tisError={isError}\n\t\t\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\t\t\t}\n\n\t\t\t\t\t\t\t\t\t\t\tcase \"combobox\": {\n\t\t\t\t\t\t\t\t\t\t\t\tif (!comboboxConfig) return null;\n\t\t\t\t\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t\t\t\t\t<div tabIndex={-1} className=\"outline-none\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t<Combobox\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tid={name}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\titems={comboboxConfig.items}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tvalue={String(field.value ?? \"\")}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tonValueChange={(val) => {\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tif (comboboxConfig.valueType === \"number\") {\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tfield.onChange(val !== \"\" ? Number(val) : null);\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tfield.onChange(val || null);\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tplaceholder={placeholder}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tsearchPlaceholder={comboboxConfig.searchPlaceholder}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\temptyMessage={comboboxConfig.emptyMessage}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tgroupHeading={comboboxConfig.groupHeading}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tnormalizeSearch={comboboxConfig.normalizeSearch}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\twidthClassName=\"w-full\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tclassName={cn(isError && styleInputError)}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\t\t\t}\n\n\t\t\t\t\t\t\t\t\t\t\tcase \"dateRange\": {\n\t\t\t\t\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t\t\t\t\t<div tabIndex={-1} className=\"outline-none\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t<CalendarRange\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tid={name}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tnumberOfMonths={2}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tvalue={field.value as DateRange | undefined}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tonChange={(value: DateRange | undefined | null) => {\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tfield.onChange(value);\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tif (form) {\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tsetTimeout(() => {\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tform.trigger([name]);\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t}, 0);\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tplaceholder={placeholder}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tclassName={cn(\"h-9 w-full\", isError && styleInputError)}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tdisabled={disabled || dateConfig?.disabled}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t{...dateConfig}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\t\t\t}\n\n\t\t\t\t\t\t\t\t\t\t\tcase \"numberRange\": {\n\t\t\t\t\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t\t\t\t\t<div className=\"flex gap-2\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t<NumericFormat\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tid={name}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tplaceholder=\"Mínimo\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tvalue={\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t(\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tfield.value as {\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tmin?: number | null;\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tmax?: number | null;\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t)?.min ?? \"\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tallowNegative={allowNegative ?? true}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tallowLeadingZeros={false}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tmaxLength={undefined}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tdecimalSeparator=\",\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tthousandSeparator=\".\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tdecimalScale={decimalScale ?? 8}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tfixedDecimalScale={false}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tonValueChange={(values) => {\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tconst numericValue = values.floatValue ?? null;\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tfield.onChange({\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t...((field.value as {\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tmin?: number | null;\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tmax?: number | null;\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t}) ?? {\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tmin: null,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tmax: null,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t}),\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tmin: numericValue,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t});\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tclassName={styleInput}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t<NumericFormat\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tid={name}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tplaceholder=\"Máximo\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tvalue={\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t(\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tfield.value as {\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tmin?: number | null;\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tmax?: number | null;\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t)?.max ?? \"\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tallowNegative={allowNegative ?? true}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tallowLeadingZeros={false}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tmaxLength={undefined}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tdecimalSeparator=\",\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tthousandSeparator=\".\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tdecimalScale={decimalScale ?? 8}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tfixedDecimalScale={false}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tonValueChange={(values) => {\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tconst numericValue = values.floatValue ?? null;\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tfield.onChange({\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t...((field.value as {\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tmin?: number | null;\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tmax?: number | null;\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t}) ?? {\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tmin: null,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tmax: null,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t}),\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tmax: numericValue,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t});\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tclassName={styleInput}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\t\t\t}\n\n\t\t\t\t\t\t\t\t\t\t\tcase \"multiselect\": {\n\t\t\t\t\t\t\t\t\t\t\t\tconst multiSelectOptions =\n\t\t\t\t\t\t\t\t\t\t\t\t\titems?.map((item) => ({\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tlabel: item,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tvalue: item,\n\t\t\t\t\t\t\t\t\t\t\t\t\t})) ||\n\t\t\t\t\t\t\t\t\t\t\t\t\toptions?.map((opt) =>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\ttypeof opt === \"string\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t? { label: opt, value: opt }\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t: { label: opt.label, value: String(opt.value) },\n\t\t\t\t\t\t\t\t\t\t\t\t\t) ||\n\t\t\t\t\t\t\t\t\t\t\t\t\t[];\n\n\t\t\t\t\t\t\t\t\t\t\t\tconst typedValue = Array.isArray(field.value)\n\t\t\t\t\t\t\t\t\t\t\t\t\t? field.value.map(String)\n\t\t\t\t\t\t\t\t\t\t\t\t\t: [];\n\n\t\t\t\t\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t\t\t\t\t<div tabIndex={-1} className=\"outline-none\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t<MultiSelect\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tid={name}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\toptions={multiSelectOptions}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tonValueChange={(val) => {\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tif (multiSelectConfig?.valueType === \"number\") {\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tfield.onChange(val.map(Number));\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tfield.onChange(val);\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tdefaultValue={typedValue}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tvalue={typedValue}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tplaceholder={placeholder}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tvariant=\"default\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tmaxCount={multiSelectConfig?.maxCount}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tsubtle={multiSelectConfig?.subtle}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tmessageEmpty={multiSelectConfig?.emptyMessage}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tsearchPlaceholder={multiSelectConfig?.searchPlaceholder}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tgroupHeading={multiSelectConfig?.groupHeading}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tnormalizeSearch={multiSelectConfig?.normalizeSearch}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tclassName={isError && styleInputError}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\t\t\t}\n\n\t\t\t\t\t\t\t\t\t\t\tdefault:\n\t\t\t\t\t\t\t\t\t\t\t\treturn null;\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t})()}\n\t\t\t\t\t\t\t\t</FormControl>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t{inlineElement && <div className=\"shrink-0\">{inlineElement}</div>}\n\t\t\t\t\t\t</div>\n\n\t\t\t\t\t\t{type !== \"checkbox\" && description && !isError && (\n\t\t\t\t\t\t\t<FormDescription>{description}</FormDescription>\n\t\t\t\t\t\t)}\n\t\t\t\t\t\t<FormMessage />\n\t\t\t\t\t</FormItem>\n\t\t\t\t);\n\t\t\t}}\n\t\t/>\n\t);\n}\n\nBaseFormField.displayName = \"BaseFormField\";\n\nexport interface FormLayoutProps<T extends FieldValues> {\n\tform: UseFormReturn<T>;\n\tsections?: FormSectionConfig<T>[];\n\tonSubmit?: (values: T) => void;\n\tonError?: (errors: any) => void;\n\tformId?: string;\n\ttitle?: string;\n\tdescription?: string;\n\theaderContent?: React.ReactNode;\n\treadOnly?: boolean;\n\tformRef?: React.RefObject<HTMLFormElement | null>;\n\tchildren?: React.ReactNode;\n\tstepNavigator?: React.ReactNode;\n}\n\nexport function FormLayout<T extends FieldValues>({\n\tform,\n\tsections,\n\tonSubmit,\n\tonError,\n\tformId,\n\ttitle,\n\tdescription,\n\theaderContent,\n\treadOnly = false,\n\tformRef,\n\tchildren,\n\tstepNavigator,\n}: FormLayoutProps<T>) {\n\tconst getColSpanClass = (cols?: number) => {\n\t\tif (!cols || cols === 1) return \"col-span-12 md:col-span-6 xl:col-span-4\";\n\t\tif (cols === 2) return \"col-span-12 md:col-span-12 xl:col-span-8\";\n\t\tif (cols === 3) return \"col-span-12\";\n\t\tif (cols === 6) return \"col-span-12 2xl:col-span-6\";\n\t\treturn \"col-span-12\";\n\t};\n\n\treturn (\n\t\t<Form {...form}>\n\t\t\t{onSubmit ? (\n\t\t\t\t<form\n\t\t\t\t\tonSubmit={form.handleSubmit(onSubmit, onError)}\n\t\t\t\t\tid={formId}\n\t\t\t\t\tref={formRef as React.RefObject<HTMLFormElement>}\n\t\t\t\t\tclassName=\"relative space-y-8\"\n\t\t\t\t>\n\t\t\t\t\t{(title || description) && (\n\t\t\t\t\t\t<div className=\"mb-6 space-y-2\">\n\t\t\t\t\t\t\t<div className=\"flex items-start justify-between\">\n\t\t\t\t\t\t\t\t<div>\n\t\t\t\t\t\t\t\t\t{title && <h2 className=\"text-xl font-semibold tracking-tight\">{title}</h2>}\n\t\t\t\t\t\t\t\t\t{description && <p className=\"text-muted-foreground text-sm\">{description}</p>}\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t{headerContent}\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t)}\n\n\t\t\t\t\t{children}\n\t\t\t\t\t{sections?.map((section, idx) => (\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tkey={section.title ? `${section.title}-${idx}` : `section-${idx}`}\n\t\t\t\t\t\t\tclassName=\"space-y-4\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{(section.title || section.description) && (\n\t\t\t\t\t\t\t\t<div className=\"flex items-center gap-2\">\n\t\t\t\t\t\t\t\t\t{section.title && <h3>{section.title}</h3>}\n\t\t\t\t\t\t\t\t\t<Separator className=\"flex-1\" />\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t)}\n\n\t\t\t\t\t\t\t<div className={cn(\"grid grid-cols-12\", readOnly ? \"gap-2\" : \"gap-4\")}>\n\t\t\t\t\t\t\t\t{section.fields.map((config) => (\n\t\t\t\t\t\t\t\t\t<div key={String(config.name)} className={getColSpanClass(config.cols)}>\n\t\t\t\t\t\t\t\t\t\t<BaseFormField\n\t\t\t\t\t\t\t\t\t\t\tconfig={config}\n\t\t\t\t\t\t\t\t\t\t\tcontrol={form.control}\n\t\t\t\t\t\t\t\t\t\t\treadOnly={readOnly}\n\t\t\t\t\t\t\t\t\t\t\tform={form}\n\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t))}\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t))}\n\t\t\t\t\t{stepNavigator}\n\t\t\t\t</form>\n\t\t\t) : (\n\t\t\t\t<div id={formId} className=\"relative space-y-8 px-1\">\n\t\t\t\t\t{children}\n\t\t\t\t\t{sections?.map((section, idx) => (\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tkey={section.title ? `${section.title}-${idx}` : `section-${idx}`}\n\t\t\t\t\t\t\tclassName=\"space-y-4\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{(section.title || section.description) && (\n\t\t\t\t\t\t\t\t<div className=\"flex items-center gap-2\">\n\t\t\t\t\t\t\t\t\t{section.title && <h3>{section.title}</h3>}\n\t\t\t\t\t\t\t\t\t<Separator className=\"flex-1\" />\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t)}\n\n\t\t\t\t\t\t\t<div className={cn(\"grid grid-cols-12\", readOnly ? \"gap-2\" : \"gap-4\")}>\n\t\t\t\t\t\t\t\t{section.fields.map((config) => (\n\t\t\t\t\t\t\t\t\t<div key={String(config.name)} className={getColSpanClass(config.cols)}>\n\t\t\t\t\t\t\t\t\t\t<BaseFormField\n\t\t\t\t\t\t\t\t\t\t\tconfig={config}\n\t\t\t\t\t\t\t\t\t\t\tcontrol={form.control}\n\t\t\t\t\t\t\t\t\t\t\treadOnly={readOnly}\n\t\t\t\t\t\t\t\t\t\t\tform={form}\n\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t))}\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t))}\n\t\t\t\t\t{stepNavigator}\n\t\t\t\t</div>\n\t\t\t)}\n\t\t</Form>\n\t);\n}\n\nFormLayout.displayName = \"FormLayout\";\n"],"names":["formatDate","date","undefined","formatDateToBrazilian","formatCNPJ","cnpj","cleaned","replace","length","slice","formatCurrency","value","formatMoney","currency","minimumFractionDigits","maximumFractionDigits","AutocompleteFieldWrapper","field","form","autocompleteConfig","placeholder","disabled","isError","open","setOpen","useState","selectedOption","setSelectedOption","selectedOptionRef","useRef","getOptionLabel","option","label","String","id","getOptionKey","getOptionValue","useEffect","current","currentValue","newValue","fetchOptions","isNumericValue","searchTerm","then","options","found","find","opt","toLowerCase","includes","catch","AutoComplete","onChange","onChangeCallback","searchPlaceholder","onOpenChange","messageEmpty","clearable","className","cn","styleInputError","BaseFormField","config","control","readOnly","baseId","useId","name","type","description","required","items","allowNegative","decimalScale","prefix","radioOptions","otpLength","sliderRange","format","patternFormat","mask","comboboxConfig","inlineElement","render","customRender","maxLength","endAdornment","multiSelectConfig","dateConfig","fileConfig","isCheckboxDefault","formatReadOnlyValue","fieldType","toLocaleString","optValue","range","minStr","min","maxStr","max","from","to","Array","isArray","join","valStr","FormField","ListItem","title","fieldState","invalid","FormItem","FormLabel","htmlFor","span","style","float","width","marginRight","marginTop","div","FormControl","FormDescription","FormMessage","Input","InputFile","e","file","target","files","accept","Textarea","NumericFormat","customInput","decimalSeparator","thousandSeparator","onValueChange","values","floatValue","PatternFormat","selectValue","Select","selectConfig","SelectTrigger","SelectValue","SelectContent","map","val","lab","SelectItem","key","CalendarPopover","setDate","disableFuture","disableWeekends","DatePicker","Checkbox","checked","onCheckedChange","Switch","RadioGroup","radioId","RadioGroupItem","Label","Slider","Number","vals","step","p","InputOTP","InputOTPGroup","_","i","index","slot","InputOTPSlot","Toggle","pressed","onPressedChange","tabIndex","Combobox","valueType","emptyMessage","groupHeading","normalizeSearch","widthClassName","CalendarRange","numberOfMonths","setTimeout","trigger","allowLeadingZeros","fixedDecimalScale","numericValue","styleInput","multiSelectOptions","item","typedValue","MultiSelect","defaultValue","variant","maxCount","subtle","displayName","FormLayout","sections","onSubmit","onError","formId","headerContent","formRef","children","stepNavigator","getColSpanClass","cols","Form","handleSubmit","ref","h2","section","idx","h3","Separator","fields"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAGA;;;;IAKO,SAASA,UAAAA,CAAWC,IAA+B,EAAA;IACzD,IAAI,CAACA,MAAM,OAAOC,SAAAA;AAClB,IAAA,OAAOC,qBAAAA,CAAsBF,IAAAA,CAAAA;AAC9B;AAEA;;;;IAKO,SAASG,UAAAA,CAAWC,IAA+B,EAAA;IACzD,IAAI,CAACA,MAAM,OAAOH,SAAAA;;AAGlB,IAAA,MAAMI,OAAAA,GAAUD,IAAAA,CAAKE,OAAO,CAAC,KAAA,EAAO,EAAA,CAAA;;IAGpC,IAAID,OAAAA,CAAQE,MAAM,KAAK,EAAA,EAAI;;QAE1B,OAAOH,IAAAA;AACR,IAAA;;AAGA,IAAA,OAAO,CAAA,EAAGC,OAAAA,CAAQG,KAAK,CAAC,GAAG,CAAA,CAAA,CAAG,CAAC,EAAEH,OAAAA,CAAQG,KAAK,CAAC,CAAA,EAAG,CAAA,CAAA,CAAG,CAAC,EAAEH,OAAAA,CAAQG,KAAK,CAAC,CAAA,EAAG,CAAA,CAAA,CAAG,CAAC,EAAEH,QAAQG,KAAK,CAAC,CAAA,EAAG,EAAA,CAAA,CAAI,CAAC,EAAEH,OAAAA,CAAQG,KAAK,CAAC,IAAI,EAAA,CAAA,CAAA,CAAK;AAC/H;AAEA;;;;IAKO,SAASC,cAAAA,CAAeC,KAAgC,EAAA;AAC9D,IAAA,IAAIA,KAAAA,KAAU,IAAA,IAAQA,KAAAA,KAAUT,SAAAA,EAAW,OAAOA,SAAAA;AAClD,IAAA,OAAOU,WAAAA,CAAY;AAClBD,QAAAA,KAAAA;QACAE,QAAAA,EAAU,KAAA;QACVC,qBAAAA,EAAuB,CAAA;QACvBC,qBAAAA,EAAuB;AACxB,KAAA,CAAA;AACD;;ACsGA,SAASC,wBAAAA,CAAgD,EACxDC,KAAK,EACLC,IAAI,EACJC,kBAAkB,EAClBC,WAAW,EACXC,QAAQ,EACRC,OAAO,EAQP,EAAA;AACA,IAAA,MAAM,CAACC,IAAAA,EAAMC,OAAAA,CAAQ,GAAGC,QAAAA,CAAS,KAAA,CAAA;AACjC,IAAA,MAAM,CAACC,cAAAA,EAAgBC,iBAAAA,CAAkB,GAAGF,QAAAA,CAAc,IAAA,CAAA;AAC1D,IAAA,MAAMG,oBAAoBC,MAAAA,CAAY,IAAA,CAAA;AAEtC,IAAA,MAAMC,cAAAA,GACLX,kBAAAA,CAAmBW,cAAc,KAAK,CAACC,MAAAA,GAAgBA,MAAAA,CAAOC,KAAK,IAAIC,MAAAA,CAAOF,MAAAA,CAAOG,EAAE,CAAA,CAAA;IACxF,MAAMC,YAAAA,GAAehB,mBAAmBgB,YAAY,KAAK,CAACJ,MAAAA,GAAgBA,MAAAA,CAAOG,EAAE,CAAD;IAClF,MAAME,cAAAA,GAAiBjB,mBAAmBiB,cAAc,KAAK,CAACL,MAAAA,GAAgBA,MAAAA,CAAOG,EAAE,CAAD;IAEtFG,SAAAA,CAAU,IAAA;AACT,QAAA,IAAIT,iBAAAA,CAAkBU,OAAO,IAAIrB,KAAAA,CAAMN,KAAK,EAAE;YAC7C,MAAM4B,YAAAA,GAAeH,cAAAA,CAAeR,iBAAAA,CAAkBU,OAAO,CAAA;AAC7D,YAAA,MAAM