Open UI

Input

Import

  • Input: The main component to display an input.

Usage

import {Input} from '@openlite/ui'
 
function App() {
  return(
    <Input placeholder="Email" />
  )
}

Examples

Rounded

import {Input} from '@openlite/ui'
 
function App() {
  return(
    <>
      <Input rounded="none" placeholder="Email" />
      <Input rounded="sm" placeholder="Email" />
      <Input rounded="md" placeholder="Email" />
      <Input rounded="lg" placeholder="Email" />
    </>
  )
}

Border

import {Input} from '@openlite/ui'
 
function App() {
  return(
    <>
      <Input border="none" placeholder="Email" />
      <Input border="sm" placeholder="Email" />
      <Input border="md" placeholder="Email" />
      <Input border="lg" placeholder="Email" />
    </>
  )
}

API

Input Props

PropsTypeDescription
rounded'none' | 'sm' | 'md' | 'lg' The rounded of the input.
border'none' | 'sm' | 'md' | 'lg' The border of the input.

Previous

Dropdown

Next

Label

On this page

ImportUsageExamplesRoundedBorderAPIInput Props