Configuration

The common semantics of height and maxWidth are described in Client (General). In React, these values can be set directly as props or via containerProps on the wrapper.

Example with props:

The technical semantics of parentUrl are described in Client (General).

In React, the same common key is set directly as the prop parentUrl – such as when the form finds itself in a modal, for example.

Example:

The technical semantics of vars and the common behaviour with URL parameters are described in Client (General).
In React, the common key is set directly as the prop vars.

Example:

The common semantics of language and locale are described in Client (General). In React, the same keys are set directly as props.

Example:

The common semantics of localesPath, locales, and the locale module formats are documented in Client (General). In React, the same shared key is set directly as the localesPath prop.

Two options are available in React:

1. localesPath for a JavaScript module containing translations that is loaded at runtime.
2. locales for a directly passed JavaScript object containing translation overrides as well as date-fns and upload locale objects by reference.

Example using localesPath:

The common semantics of configuration are described in Client (General). In React, the same common key is set directly as the prop configuration.

Example:

The common semantics of formName, refs, requestHeaders, persist and other metadata are described in Client (General). In React, these common keys are set directly as props.

Example:

The FormcentricForm component supports all mount configuration values as top-level props, as well as some React-specific additional props.

1. remountKey?: string | number
   Forces a full re-initialisation of the form. This prop should be used if init-time props change at runtime.
2. containerProps?: React.HTMLAttributes<HTMLDivElement>
   Passes attributes to the enclosing <div>, for example className, style, id, role, aria-* or event handlers.
3. onReady?: () => void
   Callback after successful initialisation.
4. onError?: (error: Error) => void
   Callback after initialisation errors or runtime errors.

1. conflictBehavior?: 'throw' | 'stop-existing'
   Specifies the application behaviour if the same embedId is already active on another/the same DOM instance.
   In the React wrapper, stop-existing is active by default.

The technical semantics of the common props are described in Client (General).
In React, these are as follows:

The technical semantics of the common props are described in Client (General).
In React, these are as follows:

The technical semantics of the common props are described in Client (General).
In React, these are as follows:

The technical semantics of the common props are described in Client (General).
In React, these are as follows:

1. At least one of embedId or formDefinition must be set.
2. Most configuration props are initialisation-only props. Changes afterwards are not automatically applied to a running instance.
3. Changes to embedId, formDefinition or remountKey trigger a repeat embedding.
4. Changes to FormcentricConfigProvider values or browser-global defaults also take effect only after a repeat embedding.
5. In contrast, containerProps, onReady and onError behave like normal React props and can be refreshed without re-initialisation.
6. In the React wrapper, conflictBehavior is set to stop-existing by default.
7. Note that skipThemeLoad and skipTemplatesLoad take effect only if they are set explicitly.
8. If you are intending to reuse the same form, then embedId should remain stable.
9. To force re-initialisation, make use of remountKey instead of using a changing React key.
10. Object-based props such as vars, params, themeVariables, and configuration should be passed as serializable objects. locales is the exception: it contains date-fns and upload locale objects, including their functions, and is passed by reference.
11. If parentUrl is not set explicitly, the current page URL can be used as a user return context.