Displays the changes made to the form and allows for submission or resetting values.
Conditionally renders itself depending on changes in the given form state. Does not render anything if no changes are detected in the form state.
A pair of conditionally rendered buttons for controlling the editing state of a form.
If no fields are editing, only the "Edit" button is displayed. If all fields are editing, only the "Stop Editing" button is displayed. Otherwise both are displayed.
Buttons are disabled depending on the formState, the disabled prop, and the disabled props in each of the
button-props props (if any of these is set to true a button will be disabled).
Renders nothing if the form is read-only or write-only.
A button for submitting a form. Shows a loading animation if this button was the one that was clicked in order to start the submission process. Disabled automatically while submission is in progress or successful.
Renders a <DialogBox> for viewing and managing past unsaved edits to a form. Handles updating local storage for a
form based on the given formName.
Renders a row to hold actions for the form (e.g. the submit button). Sets default sizing, spacing, and position.
Renders a column for a form to contain inputs. Sets default sizing and spacing.
Wraps the HTML
<form>element. Renders a<FormChangesDialogBox>if there are any changes and the form is an Update form. Displays toasts in response to submission events. Renders a<NavigationPrompt>if any fields have been changed.If a
nameprop is passed and local storage is not disabled with thenoLocalStorageprop, local storage of form edits will be set up. Thenameprop should be unique across the entire application, including amongst forms using the same component but for different model instances. For example, in the form for a Person model, the create form might have thename"person-create"and the instance edit forms might have anameof the form"person-[id]".Each of the four main features listed above can be disabled with a prop (one of the
no[Feature]props) in case special handling is required or desired. It is recommended to either leave these features active or replace them with a more customized solution.