Input

The Input component extends the native <input /> component.

import { Input } from 'minerva-ui'

Preview

Source

() => { const [name, setName] = React.useState(''); return ( <Input value={name} onChange={e => setName(e.target.value)} placeholder="Basic Input" /> ); }

() => {
  const [name, setName] = React.useState('');
  return (
    <Input
      value={name}
      onChange={e => setName(e.target.value)}
      placeholder="Basic Input"
    />
  );
}

Disabled Input

Preview

Source

() => { const [name, setName] = React.useState(''); return ( <Input disabled value={name} onChange={e => setName(e.target.value)} placeholder="Basic Input" /> ); }

() => {
  const [name, setName] = React.useState('');
  return (
    <Input
      disabled
      value={name}
      onChange={e => setName(e.target.value)}
      placeholder="Basic Input"
    />
  );
}

Password Input

Preview

Source

() => { const [name, setName] = React.useState(''); return ( <Input type="password" value={name} onChange={e => setName(e.target.value)} placeholder="Basic Input" /> ); }

() => {
  const [name, setName] = React.useState('');
  return (
    <Input
      type="password"
      value={name}
      onChange={e => setName(e.target.value)}
      placeholder="Basic Input"
    />
  );
}

Props

These are props related to the Input component.

Name	Type	Is Required	Default	Description
disabled	boolean	optional	false	Toggles disabled class
hiddenLabel	string	optional	false	Allows input to be labeled for accessibility