#Password

<Field.Password
  placeholder="Please enter your password"
  onChange={(value) => console.log('onChange', value)}
  onHidePassword={(event) => console.log('onHidePassword', event)}
  onShowPassword={(event) => console.log('onShowPassword', event)}
/>

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

<Field.Password
  label="Label text"
  value="password123"
  onChange={(value) => console.log('onChange', value)}
  onHidePassword={(event) => console.log('onHidePassword', event)}
  onShowPassword={(event) => console.log('onShowPassword', event)}
/>

<Field.Password
  onChange={(value) => console.log('onChange', value)}
  onHidePassword={(event) => console.log('onHidePassword', event)}
  onShowPassword={(event) => console.log('onShowPassword', event)}
  help={{
    title: 'Help is available',
    content:
      'Helping others, encouraging others, are often acts of being kind that have more meaning that you may realize.',
  }}
/>

<Field.Password
  value="password123"
  label="Label text"
  onChange={(value) => console.log('onChange', value)}
  onHidePassword={(event) => console.log('onHidePassword', event)}
  onShowPassword={(event) => console.log('onShowPassword', event)}
  disabled
/>

<Field.Password
  value="your-birthday"
  label="Label text"
  onChange={(value) => console.log('onChange', value)}
  onHidePassword={(event) => console.log('onHidePassword', event)}
  onShowPassword={(event) => console.log('onShowPassword', event)}
  error={new Error('This is what is wrong...')}
/>

<Field.Password
  value="pass"
  onChange={(value) => console.log('onChange', value)}
  onHidePassword={(event) => console.log('onHidePassword', event)}
  onShowPassword={(event) => console.log('onShowPassword', event)}
  required
/>

<Field.Password
  value="password123"
  pattern="\w{8}[0-9]{2}"
  onChange={(value) => console.log('onChange', value)}
  onHidePassword={(event) => console.log('onHidePassword', event)}
  onShowPassword={(event) => console.log('onShowPassword', event)}
  required
/>