Common Attributes

Here are a few common component attributes that Fef core-components can have. Attributes can be defined either with a property in html markup or programmatically through javascript scripting in a Fef application.

Attribute	Explanation
data	String. Tells component to use data found at this data registry index.
edit-mode	Boolean. Explicitly override a field's edit mode.
mask	String. Sets how the component is displayed in the application. Three values are possible here: normal, hidden, or read-only
field	String. Tells component and any components within to use this path as the base path.
label, label-key	String. If using label, will use the string provided, ignoring localization. If using label-key, will use localization key to print label from user's locale
selection-name	Selection set identifier for this component. In the master-detail pattern, this is the "master"
selection-source	Reference to a named selection set. In the master-detail pattern, this is the "detail".

Mask and Edit Mode

The mask and editMode are two attributes of every FEF component.

Mask can be NORMAL, READONLY, or HIDDEN
The editMode can be true or false.
Ultimately, editMode has the final say as to whether a component offers a widget or a read-only representation of its value.
By default, editMode is false when the mask is not NORMAL
By default, the mask is as specified in the Design if it has one, otherwise NORMAL
If the mask is NORMAL, editMode is inherited from its parent component.
Top-level components inherit their editMode from the page's editMode (Facade.PageRegistry.editMode / setEditMode)
A page's editMode can be either toggled using the Edit/Review core-docbar buttons, programmatically set, or permanently set in pages.json
A HIDDEN mask results in the component and its children not being rendered (whether this means the DOM is not emitted is up to each component to decide)

For example:

<core-form><core-field field="myField"></core-field></core-form>

Here, we specified no masking or editMode at all.

First we check the Design Registry for the field and use its mask - if it's HIDDEN, we don't show the field; if it's READONLY, editMode will be false
If the design field is NORMAL or unspecified, we get the editMode of the parent component - coreForm
The form has no design of its own in this case; had it been associated with an embedded design field, we would have inherited its mask just like with core-field
Since it has no design, we inherit from the page's editMode - if the page is in editMode, the field will be as well