a8361c2d7e
All checks were successful
Release to Staging / build_and_release (push) Successful in 1m7s
42 lines
1.5 KiB
TypeScript
42 lines
1.5 KiB
TypeScript
import { forwardRef } from 'react'
|
|
|
|
interface SearchInputProps {
|
|
handleKeyDown: (event: React.KeyboardEvent<HTMLInputElement>) => void
|
|
handleSearch: () => void
|
|
handleChange?: (event: React.ChangeEvent<HTMLInputElement>) => void
|
|
}
|
|
|
|
export const SearchInput = forwardRef<HTMLInputElement, SearchInputProps>(
|
|
({ handleKeyDown, handleSearch, handleChange }, ref) => (
|
|
<div className='SearchMain'>
|
|
<div className='SearchMainInside'>
|
|
<div className='SearchMainInsideWrapper'>
|
|
<input
|
|
type='text'
|
|
className='SMIWInput'
|
|
ref={ref}
|
|
onKeyDown={handleKeyDown}
|
|
onChange={handleChange}
|
|
placeholder='Enter search term'
|
|
/>
|
|
<button
|
|
className='btn btnMain SMIWButton'
|
|
type='button'
|
|
onClick={handleSearch}
|
|
>
|
|
<svg
|
|
xmlns='http://www.w3.org/2000/svg'
|
|
viewBox='0 0 512 512'
|
|
width='1em'
|
|
height='1em'
|
|
fill='currentColor'
|
|
>
|
|
<path d='M500.3 443.7l-119.7-119.7c27.22-40.41 40.65-90.9 33.46-144.7C401.8 87.79 326.8 13.32 235.2 1.723C99.01-15.51-15.51 99.01 1.724 235.2c11.6 91.64 86.08 166.7 177.6 178.9c53.8 7.189 104.3-6.236 144.7-33.46l119.7 119.7c15.62 15.62 40.95 15.62 56.57 0C515.9 484.7 515.9 459.3 500.3 443.7zM79.1 208c0-70.58 57.42-128 128-128s128 57.42 128 128c0 70.58-57.42 128-128 128S79.1 278.6 79.1 208z'></path>
|
|
</svg>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
)
|
|
)
|