text: import { BsListNested} from 'react-icons/bs';
  import {IoMdLocate} from 'react-icons/io';
  export const SearchClient=({data,ville})=>{
     return (<article  className="py-2">
           <form className="flex justify-between flex-wrap items-start bg-gray-100 p-6 rounded-md shadow-md">
           <div className="m-1 flex-1 bg-gray-50 p-2 flex justify-center items-start rounded-md ring-1 ring-gray-500">
              <input className="w-full outline-none" name="text" type="text" placeholder="Que cherchez vous ?" style={{ fontSize: '14px'}}/>
            </div>
             <div className="m-1 flex-1 bg-gray-50 p-2 flex justify-center items-start rounded-md ring-1 ring-gray-500">
               <label for="categorie"><BsListNested className="mx-1" style={{fontSize:'18px'}}/></label>
               <select id="categorie" name="categorie" className="w-full outline-none cursor-pointer">
                  <optgroup label="Inforamtique">
                     <option>Tyrannosaurus</option>
                     <option>Velociraptor</option>
                     <option>Deinonychus</option>
                  </optgroup>
                  <optgroup label="Véhecule">
                     <option>Vélo</option>
                     <option>Moto</option>
                     <option>Car</option>
                  </optgroup>
                  <optgroup label="Habit">
                     <option>short</option>
                     <option>Patalon</option>
                     <option>autre</option>
                  </optgroup>
               </select>
            </div>
           <div className="m-1 flex-1 bg-gray-50 p-2 flex justify-center items-start rounded-md ring-1 ring-gray-500">
              <label for="ville"><IoMdLocate className="mx-1" style={{fontSize:'18px'}} /></label>
               <select id="ville" name="ville" className="w-full outline-none cursor-pointer">
                  {ville.map((value,index)=>
                    <option key={index} value={value.name}>{value.name}</option>
                  )};
               </select>
            </div>
           </form>
      </article>)
  }