Input

View Source

Composes Input.InputBox and Input.InputField.

Copy

Edit

const sizes = ['xs', 'sm', 'md', 'lg']
render(() => (
  <GridView width="100%" columns="repeat(4, 1fr)" alignment="start" spacing={2}>
    {sizes.map((size, index) => (
      <Input key={size} size={size} defaultValue={`Input ${size}`} />
    ))}
  </GridView>
))

const sizes = ['xs', 'sm', 'md', 'lg']
render(() => (
  <GridView width="100%" columns="repeat(4, 1fr)" alignment="start" spacing={2}>
    {sizes.map((size, index) => (
      <Input key={size} size={size} defaultValue={`Input ${size}`} />
    ))}
  </GridView>
))

Copy

Edit

const sizes = ['xs', 'sm', 'md', 'lg']
render(() => (
  <GridView width="100%" columns="repeat(4, 1fr)" alignment="start" spacing={2}>
    {sizes.map((size, index) => (
      <Input key={size} size={size} defaultValue={`Input ${size}`} subdued />
    ))}
  </GridView>
))

const sizes = ['xs', 'sm', 'md', 'lg']
render(() => (
  <GridView width="100%" columns="repeat(4, 1fr)" alignment="start" spacing={2}>
    {sizes.map((size, index) => (
      <Input key={size} size={size} defaultValue={`Input ${size}`} subdued />
    ))}
  </GridView>
))

Props

Accepts props for Input.InputBox and Input.InputField, remaining props are forwarded to Input.InputBox.

Props

PreviousForm NextInput.Inline