forked from rjsf-team/react-jsonschema-form
-
Notifications
You must be signed in to change notification settings - Fork 0
/
withTheme.tsx
54 lines (50 loc) · 1.54 KB
/
withTheme.tsx
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
import React, { ForwardedRef, forwardRef } from "react";
import Form, { FormProps } from "./components/Form";
import { FormContextType, RJSFSchema, StrictRJSFSchema } from "@rjsf/utils";
/** The properties for the `withTheme` function, essentially a subset of properties from the `FormProps` that can be
* overridden while creating a theme
*/
export type ThemeProps<
T = any,
S extends StrictRJSFSchema = RJSFSchema,
F extends FormContextType = any
> = Pick<
FormProps<T, S, F>,
"fields" | "templates" | "widgets" | "_internalFormWrapper"
> & {
ref?: React.Ref<Form<T, S, F>>;
};
/** A Higher-Order component that creates a wrapper around a `Form` with the overrides from the `WithThemeProps` */
export default function withTheme<
T = any,
S extends StrictRJSFSchema = RJSFSchema,
F extends FormContextType = any
>(themeProps: ThemeProps<T, S, F>) {
return forwardRef(
(
{ fields, widgets, templates, ...directProps }: FormProps<T, S, F>,
ref: ForwardedRef<Form<T, S, F>>
) => {
fields = { ...themeProps.fields, ...fields };
widgets = { ...themeProps.widgets, ...widgets };
templates = {
...themeProps.templates,
...templates,
ButtonTemplates: {
...themeProps?.templates?.ButtonTemplates,
...templates?.ButtonTemplates,
},
};
return (
<Form<T, S, F>
{...themeProps}
{...directProps}
fields={fields}
widgets={widgets}
templates={templates}
ref={ref}
/>
);
}
);
}