{"name":"rhf-textarea-field","title":"RHF Textarea Field","description":"Textarea field with React Hook Form integration.","type":"registry:ui","docs":"/components/rhf-textarea-field","categories":["forms"],"registryDependencies":["https://pb-ui-five.vercel.app/registry/rhf-base-controller","https://pb-ui-five.vercel.app/registry/textarea"],"dependencies":["react-hook-form"],"files":[{"path":"components/ui/rhf-inputs/textarea-field.tsx","target":"components/ui/rhf-inputs/textarea-field.tsx","type":"registry:ui","content":"import { FieldValues } from \"react-hook-form\";\nimport { Textarea } from \"../textarea\";\nimport { BaseController, BaseControllerProps } from \"./base-controller\";\n\ntype FieldTextareaProps<T extends FieldValues> = Omit<\n  React.TextareaHTMLAttributes<HTMLTextAreaElement>,\n  \"name\" | \"id\"\n> & {\n  maxLength?: number;\n} & Omit<BaseControllerProps<T>, \"children\">;\n\nexport function TextareaField<T extends FieldValues>({\n  control,\n  name,\n  label,\n  description,\n  maxLength,\n  disableFieldError = false,\n  required,\n  ...textareaProps\n}: FieldTextareaProps<T> & { required?: boolean }) {\n  return (\n    <BaseController\n      control={control}\n      name={name}\n      label={label}\n      required={required}\n      description={description}\n      disableFieldError={disableFieldError}\n    >\n      {({ field, fieldState, ariaDescribedBy }) => (\n        <div className=\"relative\">\n          <Textarea\n            id={field.name}\n            aria-required={required}\n            {...field}\n            {...textareaProps}\n            aria-invalid={!!fieldState.error}\n            aria-describedby={ariaDescribedBy}\n            className={`${maxLength ? \"pr-16\" : \"\"} ${\n              textareaProps.className || \"\"\n            }`}\n          />\n          {maxLength && (\n            <div className=\"top-3 right-3 absolute bg-background/80 px-1 rounded text-muted-foreground text-xs pointer-events-none\">\n              {(field.value || \"\").length}/{maxLength}\n            </div>\n          )}\n        </div>\n      )}\n    </BaseController>\n  );\n}\n"}]}