import type { FormInstance, FormProps } from "antd/es/form";
import type { Gutter } from "antd/es/grid/row";
import type { ReactElement, ReactNode } from "react";
import type { FormOption } from "./FormItemsRenderer";

/**
 * 深度部分类型，将所有嵌套属性都变为可选
 */
export type DeepPartial<T> = T extends object
  ? { [P in keyof T]?: DeepPartial<T[P]> }
  : T;

/**
 * FormBuilder 组件属性
 */
export interface FormBuilderProps<Values = any> extends Omit<FormProps, "form" | "onFinish"> {
  /** 表单初始值 */
  values?: DeepPartial<Values>;
  /** 表单配置项数组 */
  options: FormOption<Values>[];
  /** 栅格间距，默认 24 */
  gutter?: Gutter | [Gutter, Gutter];
  /** 占据栅格列数，默认 12 */
  span?: number | string;
  /** 自动生成必填规则，默认 true */
  useAutoGenerateRequired?: boolean;
  /** 是否显示操作按钮区域，默认 true */
  showActionButtons?: boolean;
  /** 提交按钮文字，默认 "提交" */
  submitButtonText?: string;
  /** 取消按钮文字，默认 "取消" */
  cancelButtonText?: string;
  /** 是否显示提交按钮，默认 true */
  showSubmitButton?: boolean;
  /** 是否显示取消按钮，默认 true */
  showCancelButton?: boolean;
  /** 自定义操作按钮组 */
  customActionButtons?: ReactNode;
  /** 额外操作按钮组 */
  extraActionButtons?: ReactNode;
  /** 是否处于加载状态，默认 false */
  loading?: boolean;
  /** 表单实例（通过 Form.useForm() 创建） */
  form: FormInstance<Values>;
  /** 表单提交时的回调函数 */
  onFinish?: (values: Values) => void;
}

/**
 * 表单构建器组件
 */
type FormBuilderComponent = {
  useForm: typeof import("antd").Form.useForm;
  useWatch: typeof import("antd").Form.useWatch;
} & {
  <Values = any>(props: FormBuilderProps<Values>): ReactElement;
};

declare const FormBuilder: FormBuilderComponent;

export default FormBuilder;
