Description
Value.Email is a wrapper component for displaying string values, with user experience tailored for email values.
Demos
Empty
<Value.Email showEmpty />
Placeholder
The value was not filled in
<Value.Email placeholder="The value was not filled in" />
Value
firstname.lastname@domain.com
<Value.Email value="firstname.lastname@domain.com" />
Label
<Value.Email label="Label text" showEmpty />
Label and value
firstname.lastname@domain.com
<Value.Email label="Label text" value="firstname.lastname@domain.com" />
Inline
This is before the componentfirstname.lastname@domain.comThis is after the component
<p>This is before the component<Value.Email value="firstname.lastname@domain.com" inline />This is after the component</p>
Properties
Standard value component props
| Property | Type | Description |
|---|---|---|
value | string | (optional) Source data value for the input |
showEmpty | boolean | (optional) True to show the component even when the value is empty. |
label | string | (optional) Field label to show above / before the input feature |
placeholder | string | (optional) Text showing in place of the value if no value is given |
path | string | (optional) JSON Pointer for where the data for this input is located in the source dataset (when using DataContext) |
inline | boolean | (optional) True to show the value without any DOM elements surrounding it. I.e for putting it as part of a text. |