Skip to main content
⌘K
Last modified: 24/Jun/2024

Search

Search component is a special case of text input.

#Usage

import { Search } from '@kinsta/stratus'

const MyComponent = () => (
  <Search />
)

#Props

Search component can accept [any props that Input can,][input-url] including all properties from the HTMLInputElement interface. On top of that there is one extra prop on Password.

#onClear
() => void
callback on pushing the "empty" icon
#isDisabled
boolean
Set the disabled state of input
#isReadOnly
boolean
Set content to be readonly
#hasAutoFocus
boolean
Set that the input should be focused when rendered
#hasError
boolean
Set the error state of the input
#addonBefore
ReactNode
Content of the addon before the input box
#addonAfter
ReactNode
Content of the addon after the input box
#prefixItem
ReactNode
Content of the prefix of the input
#suffixItem
ReactNode
Content of the suffix of the input
#label
string | ReactElement<any, string | JSXElementConstructor<any>>
Content of the label
#description
string | ReactElement<any, string | JSXElementConstructor<any>>
Content of the description
#errorMessage
string | ReactElement<any, string | JSXElementConstructor<any>>
Content of the error message
#unit
string
Sets the unit of the input

#Types

  • SearchInterface: props of the Search component extended by InputInterface

Read more about types here

#See also