#FirstName

<Field.FirstName onChange={(value) => console.log('onChange', value)} />

<Field.FirstName
  placeholder="Enter a name..."
  onChange={(value) => console.log('onChange', value)}
/>

<Field.FirstName
  label="Label text"
  onChange={(value) => console.log('onChange', value)}
/>

<Field.FirstName
  label="Label text"
  value="John"
  onChange={(value) => console.log('onChange', value)}
/>

<Field.FirstName
  label="Label text"
  value="John"
  help={{
    title: 'Help is available',
    contents:
      'Advantages of helping people include you being a good example for your children, family, and friends, and you having a direct impact on the trajectory of the lives of a lot of people.',
  }}
  onChange={(value) => console.log('onChange', value)}
/>

<Field.FirstName
  value="John"
  label="Label text"
  onChange={(value) => console.log('onChange', value)}
  disabled
/>

<Field.FirstName
  value="Unnamed"
  label="Label text"
  onChange={(value) => console.log('onChange', value)}
  error={new FormError('This is what is wrong...')}
/>

<Field.FirstName
  value="John"
  label="Label text"
  onChange={(value) => console.log('onChange', value)}
  required
/>