Код DemoSearchWrapperconst DemoSearchWrapper: React.FC<IDemoSearchWrapperProps> = ({ children }) => {const [value, setValue] = React.useState('');const [items, setItems] = React.useState([]);const handleChange = React.useCallback((query: string) => {if (!query) {return;}setItems((oldItems) => [...oldItems, query]);}, [items, setItems]);return (<div><p style={{ marginTop: 0 }}>Value: {value}</p>{children({ onChange: handleChange, onSubmit: setValue, items: items, chosenValue: value })}</div>);};
иконка поиска расположена слева, добавлена возможность очистить поле по клику на крестик
Value:
Value:
Value:
Код DemoSearchCustomItemsWrapperconst DemoSearchCustomItemsWrapper: React.FC<IDemoSearchCustomItemsWrapper> = ({ children }) => {const [value, setValue] = React.useState<string>('');const getContent = React.useCallback((index: number) => (<div><div><b>ИП Баранник Александр Николаевич {index + 1}</b></div><div><b>ИНН: 503209463031</b></div><div>Московская обл, Одинцовский р-н, г Одинцово</div></div>), []);const items = React.useMemo(() => (new Array(5).fill('').map((_, i) => ({value: `ИП Баранник Александр Николаевич ${i + 1}`,searchView: getContent(i),}))), []);return <div>{children({ value, onSubmit: setValue, items })}</div>;};