Demos
Postal address
Code Editor
<Field.Address.Postal onChange={(value) => console.log('onChange', value)} />
Street address
Code Editor
<Field.Address.Street onChange={(value) => console.log('onChange', value)} />
Placeholder
Code Editor
<Field.Address.Postal placeholder="Enter address..." onChange={(value) => console.log('onChange', value)} />
Label
Code Editor
<Field.Address.Postal label="Label text" onChange={(value) => console.log('onChange', value)} />
Label and value
Code Editor
<Field.Address.Postal label="Label text" value="Dronning Eufemias gate 30" onChange={(value) => console.log('onChange', value)} />
With help
Code Editor
<Field.Address.Postal label="Label text" value="Dronning Eufemias gate 30" help={{ title: 'Help is available', content: 'Use your gifts to teach and help others. Acknowledge them as gifts (even if only in your mind). Take some time to list your strengths as well as the ways in which you could share them with the world around you and how that truly is a gift to others.', }} onChange={(value) => console.log('onChange', value)} />
Disabled
Code Editor
<Field.Address.Postal value="Dronning Eufemias gate 30" label="Label text" onChange={(value) => console.log('onChange', value)} disabled />
Error message
This is what is wrong...
Code Editor
<Field.Address.Postal value="Dronning Eufemias gate X" label="Label text" onChange={(value) => console.log('onChange', value)} error={new Error('This is what is wrong...')} />
Validation - Required
Code Editor
<Field.Address.Postal value="Dronning Eufemias gate 30" label="Label text" onChange={(value) => console.log('onChange', value)} required />