Skip to content

Demos

Interactive

LandNorge
Code Editor
<Form.Handler
  data={{
    myCountry: 'NO',
  }}
>
  <Flex.Stack>
    <Field.SelectCountry path="/myCountry" />
    <Value.SelectCountry path="/myCountry" />
  </Flex.Stack>
</Form.Handler>

Placeholder

LandNo value given
Code Editor
<Value.SelectCountry placeholder="No value given" />

Value

LandNorge
Code Editor
<Value.SelectCountry value="NO" />

Use different locale

CountrySwitzerland
Code Editor
<Form.Handler
  locale="en-GB"
  data={{
    myCountry: 'CH',
  }}
>
  <Value.SelectCountry path="/myCountry" />
</Form.Handler>

Label

Label text
Code Editor
<Value.SelectCountry label="Label text" showEmpty />

Label and value

Label textNorge
Code Editor
<Value.SelectCountry label="Label text" value="NO" />

Inline

This is before the component Norge This is after the component

Code Editor
<P>
  This is before the component <Value.SelectCountry value="NO" inline />{' '}
  This is after the component
</P>