Project Bank Info - Copy this React, Tailwind Component to your project

Genera una maquetado con estos campos { "banco": { "clabe": "dasdas", "clave": null, "cuenta": "asdas", "detalleBanco": null, "id": 260, "mesaInversion": 15000.0, "nombre": "BANAMEX" }, "direccion": { "calle": "Privada de Emiliano Zapata", "colonia": "San Miguel Chalma", "cp": "54140", "estado": "Mexico", "id": 18860, "lote": "Vacio", "manzana": "Vacio", "municipio": "Tlalnepantla", "numExterior": "N/A", "numInterior": "3)" }, "id": 134, "idBanco": 260, "idDireccion": 18860, "promotor": "AAbfd", "proyectos": [ { "direccion": { "calle": "Privada de Emiliano Zapata", "colonia": "San Miguel Chalma", "cp": "54140", "estado": "Mexico", "id": 18869, "lote": "Vacio", "manzana": "Vacio", "municipio": "Tlalnepantla", "numExterior": "N/A", "numInterior": "3)" }, "etapas": [], "idDireccion": 18869, "idProyecto": 127, "nombreProyecto": "Ivan" }, { "direccion": { "calle": "Privada de Emiliano Zapata", "colonia": "San Miguel Chalma", "cp": "54140", "estado": "Mexico", "id": 18870, "lote": "Vacio", "manzana": "Vacio", "municipio": "Tlalnepantla", "numExterior": "N/A", "numInterior": "3)" }, "etapas": [], "idDireccion": 18870, "idProyecto": 128, "nombreProyecto": "Ivan" }, { "direccion": { "calle": "Privada de Emiliano Zapata", "colonia": "San Miguel Chalma", "cp": "54140", "estado": "Mexico", "id": 18871, "lote": "Vacio", "manzana": "Vacio", "municipio": "Tlalnepantla", "numExterior": "N/A", "numInterior": "3)" }, "etapas": [], "idDireccion": 18871, "idProyecto": 129, "nombreProyecto": "Ivan" } ], "rfc": "ZWTS581001YJ2" } agregale un buscador con cambo de pagina cuando selecciones un proyecto y se vea la demas informacion