{"name":"rhf-input-date-field","title":"RHF Input Date Field","description":"Date input field with React Hook Form integration.","type":"registry:ui","docs":"/components/rhf-input-date-field","categories":["forms"],"registryDependencies":["https://pb-ui-five.vercel.app/registry/rhf-base-controller","https://pb-ui-five.vercel.app/registry/datefield-rac"],"dependencies":["react-hook-form"],"files":[{"path":"components/ui/rhf-inputs/input-date-field.tsx","target":"components/ui/rhf-inputs/input-date-field.tsx","type":"registry:ui","content":"import {\n  getLocalTimeZone,\n  parseDate,\n  parseDateTime,\n} from \"@internationalized/date\";\nimport { format } from \"date-fns\";\nimport { DateFieldProps, DateValue } from \"react-aria-components\";\nimport { FieldValues } from \"react-hook-form\";\nimport { DateField, DateInput, DateInputProps } from \"../datefield-rac\";\nimport { BaseController, BaseControllerProps } from \"./base-controller\";\n\ntype FieldInputProps<T extends FieldValues> = Omit<\n  BaseControllerProps<T>,\n  \"children\"\n> &\n  Omit<DateFieldProps<DateValue>, \"value\" | \"onChange\" | \"children\"> & {\n    defaultValue?: Date | string;\n  } & Pick<DateInputProps, \"className\" | \"unstyled\">;\n\ntype DateLike = Date | string | null | undefined;\n\nfunction toDateValue(value: DateLike): DateValue | undefined {\n  if (!value) return undefined;\n  if (value instanceof Date) {\n    const dateString = format(value, \"yyyy-MM-dd\");\n    return parseDate(dateString);\n  }\n  if (typeof value === \"string\") {\n    try {\n      return parseDate(value);\n    } catch {\n      try {\n        return parseDateTime(value);\n      } catch {\n        return undefined;\n      }\n    }\n  }\n  return undefined;\n}\n\nexport function InputDateField<T extends FieldValues>({\n  control,\n  name,\n  label,\n  description,\n  disableFieldError = false,\n  className,\n  required,\n  ...inputProps\n}: FieldInputProps<T>) {\n  const { defaultValue, ...restInputProps } = inputProps;\n\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        const resolvedValue = toDateValue(field.value as DateLike);\n        const resolvedDefaultValue = toDateValue(defaultValue);\n\n        return (\n          <DateField\n            className=\"*:not-first:mt-2\"\n            value={resolvedValue}\n            defaultValue={resolvedDefaultValue}\n            onChange={(nextValue) => {\n              if (!nextValue) {\n                field.onChange(undefined);\n                return;\n              }\n\n              const timeZone = getLocalTimeZone();\n              field.onChange(nextValue.toDate(timeZone));\n            }}\n            {...restInputProps}\n          >\n            <DateInput\n              className={className}\n              aria-invalid={!!fieldState.error}\n              aria-required={required}\n              aria-describedby={ariaDescribedBy}\n            />\n          </DateField>\n        );\n      }}\n    </BaseController>\n  );\n}\n"}]}