A next-generation tool to create blazing-fast documentation sites
API
created:3/5/2021
updated:3/5/2021
loc
183
comments
23%
passed
8
coverage
10%

SearchInput

avatar of atanasster
avatar of Atanas Stoyanov
@component-controls/components
3.15.0

an input component combined with a popover, can be used for incremental search.

import { SearchInput } from '@component-controls/components';

Overview

Name
Description
Default
SearchInputOwnProps(6 properties)
onSearch

callback on change of search input. user can retrieve items in this callback

(search: string) => void | Promise<void>
-
onSelect

on select a search item.

((item: ItemType) => void)
-
children

children is a render prop to allow custom rendering of items, one at a time

(((props: SearchBoxCallbackProps<ItemType>) => ReactNode) & (boolean | ReactChild | ReactFragment | ReactPortal | null))
-
items

items array

ItemType[]
[]
popoverProps

customize the popover

PopoverProps
-
render

custom renver of the search items popup

((rendered: ReactNode) => ReactNode)
rendered => rendered
InputHTMLAttributes(33 properties)
SpaceProps(28 properties)
HTMLAttributes(43 properties)
Attributes(1 properties)
AriaAttributes(48 properties)
DOMAttributes(159 properties)
BoxOwnProps(4 properties)
BackgroundColorProps(2 properties)
OpacityProps(1 properties)

Commits

Date
Author
Commit Message
4/27/2021

atanasster

avatar of atanasster
fix: remove intial open on search undefined
2/17/2021

atanasster

avatar of atanasster
feat: components history and catalog
12/23/2020

atanasster

avatar of atanasster
feat: add algolia confurable site search
11/15/2020

atanasster

avatar of atanasster
chore: update lint
11/14/2020

Atanas Stoyanov

avatar of Atanas Stoyanov
fix: serch input alignment ie11
10/28/2020

atanasster

avatar of atanasster
chore: axe-plugin and components
10/21/2020

atanasster

avatar of atanasster
chore: update document type check
8/6/2020

atanasster

avatar of atanasster
fix: linting issues
7/8/2020

atanasster

avatar of atanasster
fix: optimize initial search loading
6/28/2020

atanasster

avatar of atanasster
chore: gatsby 404 page
12 commits
package
imports
peer
SearchIcon
react
^17.0.1
useStateuseEffectReactNode
*
scrollIntoView
theme-ui
^0.8.4
jsxInputPropsInputBox
file
imports
"../Popover"
PopoverPopoverProps
"../Keyboard"
KeyboardDOWN_ARROWUP_ARROWRETURNESCTAB

Stories

Default Render

Placeholder

Customize