@rjsf/primereact 6.0.0-beta.11

package/src/GridTemplate/GridTemplate.tsx

@@ -0,0 +1,93 @@
+import { useEffect, useState } from 'react';
+import { GridTemplateProps } from '@rjsf/utils';
+
+const breakpoints = {
+  xs: 0,
+  sm: 576,
+  md: 768,
+  lg: 992,
+  xl: 1200,
+};
+
+type Breakpoint = keyof typeof breakpoints;
+type ResponsiveSpan = Partial<Record<Breakpoint, number>>;
+
+function getBreakpoint(width: number): Breakpoint {
+  if (width >= breakpoints.xl) {
+    return 'xl';
+  }
+  if (width >= breakpoints.lg) {
+    return 'lg';
+  }
+  if (width >= breakpoints.md) {
+    return 'md';
+  }
+  if (width >= breakpoints.sm) {
+    return 'sm';
+  }
+  return 'xs';
+}
+
+function getResponsiveSpan(spanDef: ResponsiveSpan, breakpoint: Breakpoint): number {
+  return spanDef[breakpoint] ?? spanDef.xl ?? spanDef.lg ?? spanDef.md ?? spanDef.sm ?? spanDef.xs ?? 12;
+}
+
+function getInitialWidth(): number {
+  return typeof window !== 'undefined' ? window.innerWidth : breakpoints.xs;
+}
+
+/** Renders a `GridTemplate`, which is expecting the column size for each viewport breakpoint (xs, sm, md, lg, xl)
+ *  coming in via the extra props provided by the caller.
+ *  Uses a 12 column grid by default. This can be overridden by passing `layoutGrid` in `uiSchema`.
+ *
+ * @param props - The GridTemplateProps, including the extra props containing the grid sizing details
+ */
+export default function GridTemplate(props: GridTemplateProps) {
+  return props.column ? GridTemplateColumn(props) : GridTemplateRow(props);
+}
+
+function GridTemplateRow(props: GridTemplateProps) {
+  const { children, column, uiSchema, style, ...rest } = props;
+  const layoutGrid = uiSchema?.['ui:layoutGrid'] ?? {};
+  const totalColumns = layoutGrid.columns ?? 12;
+  const gap = layoutGrid.gap ?? '16px';
+
+  return (
+    <div
+      style={{
+        display: 'grid',
+        gridTemplateColumns: `repeat(${totalColumns}, 1fr)`,
+        alignItems: 'start',
+        gap,
+        ...(style ?? {}),
+      }}
+      {...rest}
+    >
+      {children}
+    </div>
+  );
+}
+
+function GridTemplateColumn(props: GridTemplateProps) {
+  const { children, column, uiSchema, xs, sm, md, lg, xl, style, ...rest } = props;
+
+  const [breakpoint, setBreakpoint] = useState<Breakpoint>(() => getBreakpoint(getInitialWidth()));
+
+  useEffect(() => {
+    if (typeof window === 'undefined') {
+      return;
+    }
+
+    const handleResize = () => setBreakpoint(getBreakpoint(window.innerWidth));
+    window.addEventListener('resize', handleResize);
+    return () => window.removeEventListener('resize', handleResize);
+  }, []);
+
+  const span = getResponsiveSpan(props as ResponsiveSpan, breakpoint);
+
+  return (
+    <div style={{ gridColumn: `span ${span} / span ${span}`, ...(style ?? {}) }} {...rest}>
+      {children}
+    </div>
+  );
+}

package/src/GridTemplate/index.ts

@@ -0,0 +1,2 @@
+export { default } from './GridTemplate';
+export * from './GridTemplate';

package/src/IconButton/IconButton.tsx

@@ -0,0 +1,47 @@
+import { Button } from 'primereact/button';
+import { FormContextType, IconButtonProps, RJSFSchema, StrictRJSFSchema, TranslatableString } from '@rjsf/utils';
+
+function IconButton<T = any, S extends StrictRJSFSchema = RJSFSchema, F extends FormContextType = any>(
+  props: IconButtonProps<T, S, F>,
+) {
+  const { icon, iconType, uiSchema, registry, ...otherProps } = props;
+  return <Button icon={`pi pi-${icon}`} rounded text severity='secondary' {...otherProps} />;
+}
+
+export default IconButton;
+
+export function CopyButton<T = any, S extends StrictRJSFSchema = RJSFSchema, F extends FormContextType = any>(
+  props: IconButtonProps<T, S, F>,
+) {
+  const {
+    registry: { translateString },
+  } = props;
+  return <IconButton title={translateString(TranslatableString.CopyButton)} {...props} icon='copy' />;
+}
+
+export function MoveDownButton<T = any, S extends StrictRJSFSchema = RJSFSchema, F extends FormContextType = any>(
+  props: IconButtonProps<T, S, F>,
+) {
+  const {
+    registry: { translateString },
+  } = props;
+  return <IconButton title={translateString(TranslatableString.MoveDownButton)} {...props} icon='angle-down' />;
+}
+
+export function MoveUpButton<T = any, S extends StrictRJSFSchema = RJSFSchema, F extends FormContextType = any>(
+  props: IconButtonProps<T, S, F>,
+) {
+  const {
+    registry: { translateString },
+  } = props;
+  return <IconButton title={translateString(TranslatableString.MoveUpButton)} {...props} icon='angle-up' />;
+}
+
+export function RemoveButton<T = any, S extends StrictRJSFSchema = RJSFSchema, F extends FormContextType = any>(
+  props: IconButtonProps<T, S, F>,
+) {
+  const {
+    registry: { translateString },
+  } = props;
+  return <IconButton title={translateString(TranslatableString.RemoveButton)} {...props} icon='trash' />;
+}

package/src/IconButton/index.ts

@@ -0,0 +1,2 @@
+export { default } from './IconButton';
+export * from './IconButton';

package/src/MultiSchemaFieldTemplate/MultiSchemaFieldTemplate.tsx

@@ -0,0 +1,17 @@
+import { FormContextType, MultiSchemaFieldTemplateProps, RJSFSchema, StrictRJSFSchema } from '@rjsf/utils';
+import { Fieldset } from 'primereact/fieldset';
+
+export default function MultiSchemaFieldTemplate<
+  T = any,
+  S extends StrictRJSFSchema = RJSFSchema,
+  F extends FormContextType = any,
+>(props: MultiSchemaFieldTemplateProps<T, S, F>) {
+  const { selector, optionSchemaField } = props;
+
+  return (
+    <Fieldset>
+      <div style={{ marginBottom: '1rem' }}>{selector}</div>
+      {optionSchemaField}
+    </Fieldset>
+  );
+}

package/src/MultiSchemaFieldTemplate/index.ts

@@ -0,0 +1,2 @@
+export { default } from './MultiSchemaFieldTemplate';
+export * from './MultiSchemaFieldTemplate';

package/src/ObjectFieldTemplate/ObjectFieldTemplate.tsx

@@ -0,0 +1,88 @@
+import {
+  FormContextType,
+  ObjectFieldTemplateProps,
+  RJSFSchema,
+  StrictRJSFSchema,
+  canExpand,
+  descriptionId,
+  getTemplate,
+  getUiOptions,
+  titleId,
+  buttonId,
+} from '@rjsf/utils';
+
+/** The `ObjectFieldTemplate` is the template to use to render all the inner properties of an object along with the
+ * title and description if available. If the object is expandable, then an `AddButton` is also rendered after all
+ * the properties.
+ *
+ * @param props - The `ObjectFieldTemplateProps` for this component
+ */
+export default function ObjectFieldTemplate<
+  T = any,
+  S extends StrictRJSFSchema = RJSFSchema,
+  F extends FormContextType = any,
+>(props: ObjectFieldTemplateProps<T, S, F>) {
+  const {
+    description,
+    onAddClick,
+    title,
+    properties,
+    disabled,
+    readonly,
+    required,
+    uiSchema,
+    schema,
+    formData,
+    idSchema,
+    registry,
+  } = props;
+  const uiOptions = getUiOptions<T, S, F>(uiSchema);
+  const TitleFieldTemplate = getTemplate<'TitleFieldTemplate', T, S, F>('TitleFieldTemplate', registry, uiOptions);
+  const DescriptionFieldTemplate = getTemplate<'DescriptionFieldTemplate', T, S, F>(
+    'DescriptionFieldTemplate',
+    registry,
+    uiOptions,
+  );
+  // Button templates are not overridden in the uiSchema
+  const {
+    ButtonTemplates: { AddButton },
+  } = registry.templates;
+  return (
+    <>
+      {title && (
+        <TitleFieldTemplate
+          id={titleId<T>(idSchema)}
+          title={title}
+          required={required}
+          schema={schema}
+          uiSchema={uiSchema}
+          registry={registry}
+        />
+      )}
+      {description && (
+        <div style={{ marginBottom: '1rem' }}>
+          <DescriptionFieldTemplate
+            id={descriptionId<T>(idSchema)}
+            description={description}
+            schema={schema}
+            uiSchema={uiSchema}
+            registry={registry}
+          />
+        </div>
+      )}
+      {properties.map((prop) => prop.content)}
+      {canExpand<T, S, F>(schema, uiSchema, formData) && (
+        <div style={{ marginTop: '1rem', textAlign: 'right' }}>
+          <AddButton
+            id={buttonId<T>(idSchema, 'add')}
+            className='rjsf-object-property-expand'
+            icon='pi pi-plus'
+            onClick={onAddClick(schema)}
+            disabled={disabled || readonly}
+            registry={registry}
+          />
+        </div>
+      )}
+    </>
+  );
+}

package/src/ObjectFieldTemplate/index.ts

@@ -0,0 +1,2 @@
+export { default } from './ObjectFieldTemplate';
+export * from './ObjectFieldTemplate';

package/src/PasswordWidget/PasswordWidget.tsx

@@ -0,0 +1,65 @@
+import { ChangeEvent } from 'react';
+import {
+  ariaDescribedByIds,
+  FormContextType,
+  getInputProps,
+  RJSFSchema,
+  StrictRJSFSchema,
+  WidgetProps,
+} from '@rjsf/utils';
+import { Password } from 'primereact/password';
+
+/** The `PasswordWidget` renders a `Password` component
+ *
+ * @param props - The `WidgetProps` for this component
+ */
+export default function PasswordWidget<
+  T = any,
+  S extends StrictRJSFSchema = RJSFSchema,
+  F extends FormContextType = any,
+>(props: WidgetProps<T, S, F>) {
+  const {
+    id,
+    placeholder,
+    value,
+    required,
+    readonly,
+    disabled,
+    onChange,
+    onChangeOverride,
+    onBlur,
+    onFocus,
+    autofocus,
+    options,
+    schema,
+    type,
+    rawErrors = [],
+  } = props;
+  const inputProps = getInputProps<T, S, F>(schema, type, options);
+  const primeProps = (options.prime || {}) as object;
+
+  const _onChange = ({ target: { value } }: ChangeEvent<HTMLInputElement>) =>
+    onChange(value === '' ? options.emptyValue : value);
+  const _onBlur = () => onBlur && onBlur(id, value);
+  const _onFocus = () => onFocus && onFocus(id, value);
+
+  return (
+    <Password
+      id={id}
+      name={id}
+      placeholder={placeholder}
+      {...primeProps}
+      {...inputProps}
+      required={required}
+      autoFocus={autofocus}
+      disabled={disabled || readonly}
+      value={value || ''}
+      invalid={rawErrors.length > 0}
+      onChange={onChangeOverride || _onChange}
+      onBlur={_onBlur}
+      onFocus={_onFocus}
+      aria-describedby={ariaDescribedByIds<T>(id, !!schema.examples)}
+      pt={{ root: { style: { display: 'flex', flexDirection: 'column' } } }}
+    />
+  );
+}

package/src/PasswordWidget/index.ts

@@ -0,0 +1,2 @@
+export { default } from './PasswordWidget';
+export * from './PasswordWidget';

package/src/PrimeForm/PrimeForm.ts

@@ -0,0 +1,15 @@
+import { ComponentType } from 'react';
+import { withTheme, FormProps } from '@rjsf/core';
+import { FormContextType, RJSFSchema, StrictRJSFSchema } from '@rjsf/utils';
+
+import { generateTheme } from '../Theme';
+
+export function generateForm<
+  T = any,
+  S extends StrictRJSFSchema = RJSFSchema,
+  F extends FormContextType = any,
+>(): ComponentType<FormProps<T, S, F>> {
+  return withTheme<T, S, F>(generateTheme<T, S, F>());
+}
+
+export default generateForm();

package/src/PrimeForm/index.ts

@@ -0,0 +1,2 @@
+export { default } from './PrimeForm';
+export * from './PrimeForm';

package/src/RadioWidget/RadioWidget.tsx

@@ -0,0 +1,60 @@
+import {
+  ariaDescribedByIds,
+  enumOptionsIsSelected,
+  enumOptionsValueForIndex,
+  optionId,
+  FormContextType,
+  RJSFSchema,
+  StrictRJSFSchema,
+  WidgetProps,
+} from '@rjsf/utils';
+import { RadioButton, RadioButtonChangeEvent } from 'primereact/radiobutton';
+
+/** The `RadioWidget` is a widget for rendering a radio group.
+ *  It is typically used with a string property constrained with enum options.
+ *
+ * @param props - The `WidgetProps` for this component
+ */
+export default function RadioWidget<T = any, S extends StrictRJSFSchema = RJSFSchema, F extends FormContextType = any>(
+  props: WidgetProps<T, S, F>,
+) {
+  const { id, value, disabled, readonly, onChange, onBlur, onFocus, options } = props;
+  const primeProps = (options.prime || {}) as object;
+  const { enumOptions, enumDisabled, emptyValue } = options;
+
+  const _onChange = (e: RadioButtonChangeEvent) => {
+    onChange(enumOptionsValueForIndex<S>(e.value, enumOptions, emptyValue));
+  };
+
+  const _onBlur = () => onBlur(id, value);
+  const _onFocus = () => onFocus(id, value);
+
+  return (
+    <div style={{ display: 'flex', flexDirection: 'row', gap: '1rem' }}>
+      {Array.isArray(enumOptions) &&
+        enumOptions.map((option, index) => {
+          const checked = enumOptionsIsSelected<S>(option.value, value);
+          const itemDisabled = Array.isArray(enumDisabled) && enumDisabled.indexOf(option.value) !== -1;
+          return (
+            <div key={index} style={{ display: 'flex', alignItems: 'center' }}>
+              <RadioButton
+                inputId={optionId(id, index)}
+                name={id}
+                {...primeProps}
+                onFocus={_onFocus}
+                onBlur={_onBlur}
+                onChange={_onChange}
+                value={String(index)}
+                checked={checked}
+                disabled={disabled || itemDisabled || readonly}
+                aria-describedby={ariaDescribedByIds<T>(id)}
+              />
+              <label htmlFor={optionId(id, index)} style={{ marginLeft: '8px' }}>
+                {option.label}
+              </label>
+            </div>
+          );
+        })}
+    </div>
+  );
+}

package/src/RadioWidget/index.ts

@@ -0,0 +1,2 @@
+export { default } from './RadioWidget';
+export * from './RadioWidget';

package/src/RangeWidget/RangeWidget.tsx

@@ -0,0 +1,37 @@
+import { FocusEvent } from 'react';
+import { Slider, SliderChangeEvent } from 'primereact/slider';
+import { ariaDescribedByIds, FormContextType, RJSFSchema, StrictRJSFSchema, WidgetProps, rangeSpec } from '@rjsf/utils';
+
+/** The `RangeWidget` component uses the `Slider` from PrimeReact, wrapping the result
+ * in a div, with the value alongside it.
+ *
+ * @param props - The `WidgetProps` for this component
+ */
+export default function RangeWidget<T = any, S extends StrictRJSFSchema = RJSFSchema, F extends FormContextType = any>(
+  props: WidgetProps<T, S, F>,
+) {
+  const { value, readonly, disabled, onBlur, onFocus, options, schema, onChange, id } = props;
+  const primeProps = (options.prime || {}) as object;
+  const sliderProps = { value, id, ...rangeSpec<S>(schema) };
+
+  const _onChange = (e: SliderChangeEvent) => {
+    onChange(e.value ?? options.emptyValue);
+  };
+  const _onBlur = ({ target }: FocusEvent<HTMLInputElement>) => onBlur(id, target && target.value);
+  const _onFocus = ({ target }: FocusEvent<HTMLInputElement>) => onFocus(id, target && target.value);
+
+  return (
+    <>
+      <Slider
+        {...primeProps}
+        disabled={disabled || readonly}
+        onMouseDown={(e) => e.stopPropagation()}
+        onChange={_onChange}
+        onBlur={_onBlur}
+        onFocus={_onFocus}
+        {...sliderProps}
+        aria-describedby={ariaDescribedByIds<T>(id)}
+      />
+    </>
+  );
+}

package/src/RangeWidget/index.ts

@@ -0,0 +1,2 @@
+export { default } from './RangeWidget';
+export * from './RangeWidget';

package/src/SelectWidget/SelectWidget.tsx

@@ -0,0 +1,139 @@
+import { FocusEvent } from 'react';
+import { Dropdown } from 'primereact/dropdown';
+import {
+  ariaDescribedByIds,
+  enumOptionsIndexForValue,
+  enumOptionsValueForIndex,
+  FormContextType,
+  RJSFSchema,
+  StrictRJSFSchema,
+  WidgetProps,
+} from '@rjsf/utils';
+import { MultiSelect } from 'primereact/multiselect';
+
+/** The `SelectWidget` is a widget for rendering dropdowns.
+ *  It is typically used with string properties constrained with enum options.
+ *
+ * @param props - The `WidgetProps` for this component
+ */
+export default function SelectWidget<T = any, S extends StrictRJSFSchema = RJSFSchema, F extends FormContextType = any>(
+  props: WidgetProps<T, S, F>,
+) {
+  const { multiple = false } = props;
+
+  return multiple ? <MultiSelectWidget {...props} /> : <SingleSelectWidget {...props} />;
+}
+
+function SingleSelectWidget<T = any, S extends StrictRJSFSchema = RJSFSchema, F extends FormContextType = any>({
+  schema,
+  id,
+  name, // remove this from dropdownProps
+  options,
+  label,
+  hideLabel,
+  required,
+  disabled,
+  placeholder,
+  readonly,
+  value,
+  multiple,
+  autofocus,
+  onChange,
+  onBlur,
+  onFocus,
+  errorSchema,
+  rawErrors = [],
+  registry,
+  uiSchema,
+  hideError,
+  formContext,
+  ...dropdownProps
+}: WidgetProps<T, S, F>) {
+  const { enumOptions, enumDisabled, emptyValue: optEmptyVal } = options;
+  const primeProps = (options.prime || {}) as object;
+
+  multiple = typeof multiple === 'undefined' ? false : multiple;
+
+  const emptyValue = multiple ? [] : '';
+  const isEmpty = typeof value === 'undefined' || (multiple && value.length < 1) || (!multiple && value === emptyValue);
+
+  const _onChange = (e: { value: any }) => onChange(enumOptionsValueForIndex<S>(e.value, enumOptions, optEmptyVal));
+  const _onBlur = ({ target }: FocusEvent<HTMLInputElement>) =>
+    onBlur(id, enumOptionsValueForIndex<S>(target && target.value, enumOptions, optEmptyVal));
+  const _onFocus = ({ target }: FocusEvent<HTMLInputElement>) =>
+    onFocus(id, enumOptionsValueForIndex<S>(target && target.value, enumOptions, optEmptyVal));
+  const selectedIndexes = enumOptionsIndexForValue<S>(value, enumOptions, multiple);
+  const { ...dropdownRemainingProps } = dropdownProps;
+
+  return (
+    <Dropdown
+      id={id}
+      name={id}
+      {...primeProps}
+      value={!isEmpty && typeof selectedIndexes !== 'undefined' ? selectedIndexes : emptyValue}
+      options={(enumOptions ?? []).map(({ value, label }, i: number) => ({
+        label,
+        value: String(i),
+        disabled: Array.isArray(enumDisabled) && enumDisabled.indexOf(value) !== -1,
+      }))}
+      onChange={_onChange}
+      onBlur={_onBlur}
+      onFocus={_onFocus}
+      placeholder={placeholder}
+      disabled={disabled || readonly}
+      autoFocus={autofocus}
+      aria-describedby={ariaDescribedByIds<T>(id)}
+      {...dropdownRemainingProps}
+    />
+  );
+}
+
+function MultiSelectWidget<T = any, S extends StrictRJSFSchema = RJSFSchema, F extends FormContextType = any>({
+  id,
+  options,
+  disabled,
+  placeholder,
+  readonly,
+  value,
+  multiple = false,
+  autofocus,
+  onChange,
+  onBlur,
+  onFocus,
+}: WidgetProps<T, S, F>) {
+  const { enumOptions, enumDisabled, emptyValue: optEmptyVal } = options;
+  const primeProps = (options.prime || {}) as object;
+
+  const emptyValue = multiple ? [] : '';
+  const isEmpty = typeof value === 'undefined' || (multiple && value.length < 1) || (!multiple && value === emptyValue);
+
+  const _onChange = (e: { value: any }) => onChange(enumOptionsValueForIndex<S>(e.value, enumOptions, optEmptyVal));
+  const _onBlur = ({ target }: FocusEvent<HTMLInputElement>) =>
+    onBlur(id, enumOptionsValueForIndex<S>(target && target.value, enumOptions, optEmptyVal));
+  const _onFocus = ({ target }: FocusEvent<HTMLInputElement>) =>
+    onFocus(id, enumOptionsValueForIndex<S>(target && target.value, enumOptions, optEmptyVal));
+  const selectedIndexes = enumOptionsIndexForValue<S>(value, enumOptions, multiple);
+
+  return (
+    <MultiSelect
+      id={id}
+      name={id}
+      {...primeProps}
+      value={!isEmpty && typeof selectedIndexes !== 'undefined' ? selectedIndexes : emptyValue}
+      options={(enumOptions ?? []).map(({ value, label }, i: number) => ({
+        label,
+        value: String(i),
+        disabled: Array.isArray(enumDisabled) && enumDisabled.indexOf(value) !== -1,
+      }))}
+      onChange={_onChange}
+      onBlur={_onBlur}
+      onFocus={_onFocus}
+      placeholder={placeholder}
+      disabled={disabled || readonly}
+      autoFocus={autofocus}
+      display={options.display === 'chip' ? 'chip' : 'comma'}
+      aria-describedby={ariaDescribedByIds<T>(id)}
+      pt={{ root: { style: { position: 'relative' } } }}
+    />
+  );
+}

package/src/SelectWidget/index.ts

@@ -0,0 +1,2 @@
+export { default } from './SelectWidget';
+export * from './SelectWidget';

package/src/SubmitButton/SubmitButton.tsx

@@ -0,0 +1,16 @@
+import { Button } from 'primereact/button';
+import { getSubmitButtonOptions, FormContextType, RJSFSchema, StrictRJSFSchema, SubmitButtonProps } from '@rjsf/utils';
+
+/** The `SubmitButton` renders a button that represents the `Submit` action on a form
+ */
+export default function SubmitButton<
+  T = any,
+  S extends StrictRJSFSchema = RJSFSchema,
+  F extends FormContextType = any,
+>({ uiSchema }: SubmitButtonProps<T, S, F>) {
+  const { submitText, norender, props: submitButtonProps = {} } = getSubmitButtonOptions<T, S, F>(uiSchema);
+  if (norender) {
+    return null;
+  }
+  return <Button type='submit' label={submitText} {...submitButtonProps} />;
+}

package/src/SubmitButton/index.ts

@@ -0,0 +1,2 @@
+export { default } from './SubmitButton';
+export * from './SubmitButton';

package/src/Templates/Templates.ts

@@ -0,0 +1,52 @@
+import { FormContextType, RJSFSchema, StrictRJSFSchema, TemplatesType } from '@rjsf/utils';
+
+import AddButton from '../AddButton';
+import ArrayFieldItemTemplate from '../ArrayFieldItemTemplate';
+import ArrayFieldTemplate from '../ArrayFieldTemplate';
+import BaseInputTemplate from '../BaseInputTemplate';
+import DescriptionField from '../DescriptionField';
+import ErrorList from '../ErrorList';
+import { CopyButton, MoveDownButton, MoveUpButton, RemoveButton } from '../IconButton';
+import FieldErrorTemplate from '../FieldErrorTemplate';
+import FieldHelpTemplate from '../FieldHelpTemplate';
+import FieldTemplate from '../FieldTemplate';
+import MultiSchemaFieldTemplate from '../MultiSchemaFieldTemplate';
+import ObjectFieldTemplate from '../ObjectFieldTemplate';
+import SubmitButton from '../SubmitButton';
+import TitleField from '../TitleField';
+import WrapIfAdditionalTemplate from '../WrapIfAdditionalTemplate';
+import ArrayFieldTitleTemplate from '../ArrayFieldTitleTemplate';
+import GridTemplate from '../GridTemplate';
+
+export function generateTemplates<
+  T = any,
+  S extends StrictRJSFSchema = RJSFSchema,
+  F extends FormContextType = any,
+>(): Partial<TemplatesType<T, S, F>> {
+  return {
+    ArrayFieldItemTemplate,
+    ArrayFieldTemplate,
+    ArrayFieldTitleTemplate,
+    BaseInputTemplate,
+    ButtonTemplates: {
+      AddButton,
+      CopyButton,
+      MoveDownButton,
+      MoveUpButton,
+      RemoveButton,
+      SubmitButton,
+    },
+    DescriptionFieldTemplate: DescriptionField,
+    ErrorListTemplate: ErrorList,
+    FieldErrorTemplate,
+    FieldHelpTemplate,
+    FieldTemplate,
+    MultiSchemaFieldTemplate,
+    ObjectFieldTemplate,
+    TitleFieldTemplate: TitleField,
+    WrapIfAdditionalTemplate,
+    GridTemplate,
+  };
+}
+
+export default generateTemplates();

package/src/Templates/index.ts

@@ -0,0 +1,2 @@
+export { default } from './Templates';
+export * from './Templates';