FieldBlock

Properties

Property	Type	Description
`label`	`string`	(optional) Field label to show above / before the input feature.
`labelDescription`	`string`	(optional) A more discreet text displayed beside the label (i.e for "(optional)").
`labelDescriptionInline`	`boolean`	(optional) If true, the `labelDescription` will be displayed on the same line as the label.
`labelSrOnly`	`boolean`	(optional) Use `true` to make the label only readable by screen readers.
`labelSize`	`string` `false`	(optional) Define one of the following heading sizes: `medium` or `large`.
`help`	`object`	(optional) Provide help content for the field using `title` and `content` as a string or React.Node. Additionally, you can set `open` to `true` to display the inline help, set the `breakout` property to `false` to disable the breakout of the inline help content, or use `renderAs` set to `dialog` to render the content in a Dialog (recommended for larger amounts of content).
`layout`	`string`	(optional) Layout for the label and input. Can be `horizontal` or `vertical`.
`layoutOptions`	`object`	(optional) Use this to set additional options for the `horizontal` layout. E.g. `{ width: "medium" }`. You can also use a custom width `{number}rem`. Instead of a width, you can use a min/max width. E.g. `{ minWidth: "6rem", maxWidth: "12rem" }`.
`width`	`string` `false`	(optional) Will set the width for the whole block. Use `small`, `medium`, `large` for predefined standard widths. You can also set a custom width `{number}rem` or use `stretch` or `false`.
`contentWidth`	`string` `false`	(optional) Will set the width for its contents. Use `small`, `medium`, `large` for predefined standard widths. You can also set a custom width `{number}rem` or use `stretch` or `false`.
`Space`	`string` `object`	(optional) Spacing properties like `top` or `bottom` are supported.
`labelHeight`	`string`	(optional) Defines the height of an component (size prop), so the label can be aligned correctly. Can be `default`, `small`, `medium`, `large`.
`asFieldset`	`boolean`	(optional) Use `true` when you have several form elements. This way a `fieldset` with a `legend` is used.
`align`	`string` `false`	(optional) `center` or `bottom` for aligning the contents vertically. Defaults to `bottom`.
`disableStatusSummary`	`boolean`	(optional) Use `true` to disable the error summary.
`composition`	`true`	(optional) Use `true` for when you have more than one field wrapped.
`disabled`	`boolean`	(optional) Set `true` to make the inner FormLabel behave as disabled.

Translations

More info about translations can be found in the general localization and Eufemia Forms localization docs.

Key	nb-NO	en-GB	sv-SE	da-DK
`Field.errorSummaryTitle`	Feil som må rettes	Please correct the following errors	Fel som måste åtgärdas	Felter der skal rettes
`Field.stateSummary`	Oppsummering:	Summary:	Sammanfattning:	Oversigt:
`Field.errorSummary`	Feil som må rettes:	Please correct the following errors:	Fel som måste åtgärdas:	Felter der skal rettes:
`Field.errorRequired`	Dette feltet må fylles ut.	This field is required.	Detta fält måste fyllas i.	Dette felt skal udfyldes.
`Field.errorPattern`	Verdien er ugyldig.	The value is invalid.	Värdet är ogiltigt.	Ugyldig værdi.
`Field.optionalLabelSuffix`	(valgfritt)	(optional)	(valfritt)	(valgfrit)