nominatim search (without working dialog)

src/components/dialogs/NominatimSearchPanel.tsx

@@ -0,0 +1,37 @@
+import React, { FC, useCallback, useState } from 'react';
+import { Icon } from '../panels/Icon';
+
+interface IProps {
+  active: boolean;
+  onSearch: (search: string) => void;
+}
+
+const NominatimSearchPanel: FC<IProps> = ({ active, onSearch }) => {
+  const [search, setSearch] = useState('Колывань');
+
+  const setValue = useCallback(({ target: { value } }) => setSearch(value), [setSearch]);
+
+  const onSubmit = useCallback(event => {
+    event.preventDefault();
+    
+    if (search.length < 3) return;
+
+    onSearch(search);
+  }, [search, onSearch]);
+
+  return (
+    <form className="panel nominatim-panel active" onSubmit={onSubmit}>
+      <div className="control-bar">
+        <div className="nominatim-search-input">
+          <input type="text" placeholder="Поиск на карте" value={search} onChange={setValue} />
+        </div>
+
+        <button>
+          <Icon icon="icon-search" />
+        </button>
+      </div>
+    </form>
+  );
+};
+
+export { NominatimSearchPanel };