2023-12-16 19:20:26 +03:00
|
|
|
import { BiSearchAlt2 } from 'react-icons/bi';
|
|
|
|
|
2023-12-08 19:24:08 +03:00
|
|
|
import Overlay from './Overlay';
|
2023-11-06 02:20:16 +03:00
|
|
|
import TextInput from './TextInput';
|
|
|
|
|
|
|
|
interface ConceptSearchProps {
|
|
|
|
value: string
|
|
|
|
onChange?: (newValue: string) => void
|
2023-12-08 19:24:08 +03:00
|
|
|
noBorder?: boolean
|
|
|
|
dimensions?: string
|
2023-11-06 02:20:16 +03:00
|
|
|
}
|
|
|
|
|
2023-12-15 17:34:50 +03:00
|
|
|
function ConceptSearch({ value, onChange, noBorder, dimensions }: ConceptSearchProps) {
|
2023-11-06 02:20:16 +03:00
|
|
|
return (
|
2023-12-08 19:24:08 +03:00
|
|
|
<div className={dimensions}>
|
|
|
|
<Overlay
|
2023-12-15 17:34:50 +03:00
|
|
|
position='top-[-0.125rem] left-3 translate-y-1/2'
|
|
|
|
className='pointer-events-none clr-text-controls'
|
2023-12-08 19:24:08 +03:00
|
|
|
>
|
2023-12-16 19:20:26 +03:00
|
|
|
<BiSearchAlt2 size='1.25rem' />
|
2023-12-08 19:24:08 +03:00
|
|
|
</Overlay>
|
2023-12-05 01:22:44 +03:00
|
|
|
<TextInput noOutline
|
2023-11-06 02:20:16 +03:00
|
|
|
placeholder='Поиск'
|
2023-12-15 17:34:50 +03:00
|
|
|
dimensions='w-full pl-10'
|
|
|
|
noBorder={noBorder}
|
2023-11-06 02:20:16 +03:00
|
|
|
value={value}
|
2023-11-27 11:33:34 +03:00
|
|
|
onChange={event => (onChange ? onChange(event.target.value) : undefined)}
|
2023-11-06 02:20:16 +03:00
|
|
|
/>
|
|
|
|
</div>);
|
|
|
|
}
|
|
|
|
|
2023-12-15 17:34:50 +03:00
|
|
|
export default ConceptSearch;
|