How to Add Default Props to Compound Component From Ant Design

I found myself repeating same props for all forms from Ant Design so the reasonable question was where to put them once.

To do that I needed to replace a Form component with customized one and keep all child components (like Item).

So I came up to this:

import { Form as AntForm } from "antd";

const CustomForm = <T = unknown>(props: Parameters<typeof AntForm<T>>[0]) => (
  <AntForm layout="vertical" autoComplete="off" {...props} />
);

export const Form = Object.assign(CustomForm, AntForm) as typeof AntForm;

and it seems to work.

Sources
#

Extending Typography.Title

Sources#

Sources
#