Skip to content

Components#

Form.Card#

Form.Card is a wrapper for the Card component to make it easier to use inside a form.

Form.Section#

Form.Section lets you compose blocks of fields and values to be reused in different contexts.

Form.Section.ViewContainer#

Form.Section.ViewContainer enables users to toggle (with animation) the content of each item between the view and edit container.

Form.Section.EditContainer#

Form.Section.EditContainer enables users to toggle (with animation) the content of each item between the view and edit container.

Form.Appearance#

Form.Appearance is a provider for theming form fields.

Form.ButtonRow#

Form.ButtonRow is a wrapper for horizontally separated buttons.

Form.clearData#

Form.clearData lets you clear the data of a form.

Form.ErrorMessages#

Error messages in Eufemia Forms are used to provide feedback to users when there are issues with their input.

Form.getData#

Form.getData lets you access your form data outside of the form context.

Form.Handler#

The Form.Handler is the root component of your form. It provides an HTML form element and handles the form data.

Form.InfoOverlay#

Form.InfoOverlay is used to display an informational message that fully covers the available space.

Form.Isolation#

Form.Isolation lets you isolate parts of your form so data and validations are not shared between the Form.Handler until you want to.

Form.MainHeading#

Form.MainHeading is a standardized main heading for sections, ensuring default layout, spacing etc.

Form.Outlet#

Form.Outlet lets you render fields and form components in another part of the tree while linking them to a specific Form.Handler by id.

Form.SchemaValidation#

Schema validation can be done with a JSON Schema which makes it possible to describe the data structure and validation needs, both for the individual value, and more complex rules across the data set.

Form.Section.Toolbar#

Form.Section.Toolbar is a helper component to be used within an Form.Section.ViewContainer and Form.Section.EditContainer.

Form.setData#

Form.setData lets you set or modify your form data outside of the form context.

Form.SubHeading#

Form.SubHeading is a standardized sub heading for sections, ensuring default layout, spacing etc.

Form.SubmitButton#

Form.SubmitButton connects to the Form.Handler to submit the active state of the internal DataContext, triggering onSubmit.

Form.SubmitConfirmation#

Form.SubmitConfirmation can be used to prevent the Form.Handler from submitting, and makes it possible to show a confirmation dialog in different scenarios.

Form.SubmitIndicator#

Form.SubmitIndicator lets you show an indicator while async form operations are performed.

Form.useData#

Form.useData lets you access or modify your form data outside of the form context within your application.

Form.useDataValue#

Form.useDataValue lets you render one form data value with a path-scoped subscription.

Form.useSnapshot#

Form.useSnapshot lets you store data snapshots of your form data, either inside or outside of the form context.

Form.useSubmit#

Form.useSubmit lets you trigger form submit from outside the form element, e.g. when the submit button is in a modal footer or toolbar.

Form.useTranslation#

Form.useTranslation is a hook that returns the translations for the current locale.

Form.useValidation#

Form.useValidation lets you monitor and modify field status or your form errors outside of the context.

Form.Visibility#

Form.Visibility makes it possible to hide components and elements on the screen based on the dynamic state of data.

Suggest an edit