//widgetType: Basic (props) => { const [hoveredDropdown, setHoveredDropdown] = useState(null); const [dropdownTimeout, setDropdownTimeout] = useState(null); const [mobileMenuOpen, setMobileMenuOpen] = useState(false); const [mobileBlogsExpanded, setMobileBlogsExpanded] = useState(false); const [mobileSobreNosotrosExpanded, setMobileSobreNosotrosExpanded] = useState(false); const headerConfig = { logo: "https://d3f70emg10ruwo.cloudfront.net/0hgtnx0q52xkx/d9264ef9-c7f0-442e-9b20-0b2a7ed72c15/mx-entrega-header-logo.svg", navs: [ { id: "09753295-6e7a-47bd-a9ea-c045b3fb807a", url: "/", name: "Hogar" }, { id: "3751942e-a962-4064-adcf-0f1c3ebc1df3", url: "/blogs", name: "Blogs", navs: [ { id: "3751942e-a962-4064-adcf-0f1c3ebc1df3-639334100000", url: "/blogs/cómo-convertirte-en-chofer-repartidor-en-méxico", name: "¿Cómo convertirte en chofer repartidor en México?", type: "link", target: "_self" }, { id: "3751942e-a962-4064-adcf-0f1c3ebc1df3-865750100000", url: "/blogs/las-mejores-empresas-de-reparto-para-trabajar-en-méxico", name: "Las Mejores Empresas de Reparto para Trabajar en México", type: "link", target: "_self" }, { id: "3751942e-a962-4064-adcf-0f1c3ebc1df3-316834100000", url: "/blogs/estrategias-para-conductores-de-reparto-exitosos", name: "Estrategias para conductores de reparto exitosos", type: "link", target: "_self" }, { id: "3751942e-a962-4064-adcf-0f1c3ebc1df3-557234100000", url: "/blogs/habilidades-de-servicio-al-cliente-que-todo-conductor-de-entregas-debe-dominar", name: "Habilidades de Servicio al Cliente que Todo Conductor de Entregas Debe Dominar", type: "link", target: "_self" }, { id: "3751942e-a962-4064-adcf-0f1c3ebc1df3-791283100000", url: "/blogs/trabajos-de-repartidor-cerca-de-mí:-cómo-encontrar-oportunidades-locales----que-se-adapten-a-ti--", name: "Trabajos de Repartidor Cerca de Mí: Cómo Encontrar Oportunidades Locales que Se Adapten a Ti", type: "link", target: "_self" } ] }, { id: "ca241db1-6d38-4188-9b19-187b8e98f171", url: "/sobre-nosotros", name: "Sobre nosotros", navs: [ { id: "ca241db1-6d38-4188-9b19-187b8e98f171-681341100000", url: "/sobre-nosotros/sobre-ag-soluciones-de-logística-terrestre-sa-de-cv", name: "Sobre AG Soluciones de logística terrestre SA de CV", type: "link", target: "_self" }, { id: "ca241db1-6d38-4188-9b19-187b8e98f171-438968100000", url: "/sobre-nosotros/sobre-antaflex", name: "Sobre Antaflex", type: "link", target: "_self" }, { id: "ca241db1-6d38-4188-9b19-187b8e98f171-252334100000", url: "/sobre-nosotros/sobre-mensajeria-y-paqueteria-lizeve", name: "Sobre Mensajeria y Paqueteria Lizeve", type: "link", target: "_self" }, { id: "ca241db1-6d38-4188-9b19-187b8e98f171-172023100000", url: "/sobre-nosotros/sobre-neuroxpress", name: "Sobre NeuroXpress", type: "link", target: "_self" }, { id: "ca241db1-6d38-4188-9b19-187b8e98f171-395571100000", url: "/sobre-nosotros/sobre-pakt-logística-express", name: "Sobre PAKT LOGÍSTICA EXPRESS", type: "link", target: "_self" }, { id: "ca241db1-6d38-4188-9b19-187b8e98f171-659800100000", url: "/sobre-nosotros/sobre-paquetería-pochtec", name: "Sobre PAQUETERÍA POCHTEC", type: "link", target: "_self" }, { id: "ca241db1-6d38-4188-9b19-187b8e98f171-714244100000", url: "/sobre-nosotros/sobre-paqueteria-sandoval-sa-de-cv", name: "Sobre PAQUETERIA SANDOVAL SA DE CV", type: "link", target: "_self" }, { id: "ca241db1-6d38-4188-9b19-187b8e98f171-750937100000", url: "/sobre-nosotros/sobre-ser-sonrisas-en-ruta", name: "Sobre SER-SONRISAS EN RUTA", type: "link", target: "_self" }, { id: "ca241db1-6d38-4188-9b19-187b8e98f171-704008100000", url: "/sobre-nosotros/servicio-automotriz-rino", name: "Servicio Automotriz Rino", type: "link", target: "_self" }, { id: "ca241db1-6d38-4188-9b19-187b8e98f171-583028100000", url: "/sobre-nosotros/sobre-velozz-log%C3%ADstica-y-soluciones-de-paqueter%C3%ADa", name: "Sobre Velozz Logística y Soluciones de Paquetería", type: "link", target: "_self" } ] } ], saveIconLink: "buscar-empleos", saveIconText: "Buscar empleos", saveJobBtnIcon: "Search", searchIconLink: "empleos-guardados", searchIconText: "Empleos guardados", shareJobBtnIcon: "BookmarkBorder", logoWidth: { mobile: "64px", tablet: "64px", desktop: "85px" }, logoHeight: { mobile: "50px", tablet: "50px", desktop: "66px" } }; const blogsNav = headerConfig.navs.find((nav) => nav.name === "Blogs"); const sobreNosotrosNav = headerConfig.navs.find((nav) => nav.name === "Sobre nosotros"); const hogarNav = headerConfig.navs.find((nav) => nav.name === "Hogar"); useEffect(() => { return () => { if (dropdownTimeout) { clearTimeout(dropdownTimeout); } }; }, [dropdownTimeout]); const handleDropdownEnter = (dropdownType) => { if (dropdownTimeout) { clearTimeout(dropdownTimeout); setDropdownTimeout(null); } setHoveredDropdown(dropdownType); }; const handleDropdownLeave = () => { const timeout = setTimeout(() => { setHoveredDropdown(null); }, 150); setDropdownTimeout(timeout); }; const toggleMobileMenu = () => { setMobileMenuOpen(!mobileMenuOpen); }; const toggleMobileBlogsDropdown = () => { setMobileBlogsExpanded(!mobileBlogsExpanded); }; const toggleMobileSobreNosotrosDropdown = () => { setMobileSobreNosotrosExpanded(!mobileSobreNosotrosExpanded); }; const handleDropdownItemClick = () => { setHoveredDropdown(null); setMobileMenuOpen(false); setMobileBlogsExpanded(false); setMobileSobreNosotrosExpanded(false); }; return ( <> {hogarNav?.name || "Hogar"} handleDropdownEnter('blogs')} onMouseLeave={handleDropdownLeave} > {blogsNav?.name || "Blogs"} {hoveredDropdown === 'blogs' && ( handleDropdownEnter('blogs')} onMouseLeave={handleDropdownLeave} sx={{ position: 'absolute', top: '100%', left: 0, mt: 0.5, backgroundColor: '#ffffff', borderRadius: '16px', boxShadow: '0 4px 20px rgba(0, 0, 0, 0.1)', minWidth: '350px', py: 2, zIndex: 10000, maxHeight: '300px', overflowY: 'auto' }} > {(blogsNav?.navs || []).map((item) => ( {item.name} ))} )} handleDropdownEnter('sobreNosotros')} onMouseLeave={handleDropdownLeave} > {sobreNosotrosNav?.name || "Sobre nosotros"} {hoveredDropdown === 'sobreNosotros' && ( handleDropdownEnter('sobreNosotros')} onMouseLeave={handleDropdownLeave} sx={{ position: 'absolute', top: '100%', left: 0, mt: 0.5, backgroundColor: '#ffffff', borderRadius: '16px', boxShadow: '0 4px 20px rgba(0, 0, 0, 0.1)', minWidth: '400px', py: 2, zIndex: 10000, maxHeight: '300px', overflowY: 'auto' }} > {(sobreNosotrosNav?.navs || []).map((item) => ( {item.name} ))} )} {headerConfig.searchIconText} {mobileMenuOpen && ( setMobileMenuOpen(false)} sx={{ display: 'block', py: 2, fontSize: '18px', fontWeight: 500, color: '#787070', textDecoration: 'none', borderBottom: '1px solid #f0f0f0', '&:hover': { color: '#146eb4' } }} > {hogarNav?.name || "Hogar"} {blogsNav?.name || "Blogs"} {mobileBlogsExpanded && ( {(blogsNav?.navs || []).map((item, index) => ( {item.name} ))} )} {sobreNosotrosNav?.name || "Sobre nosotros"} {mobileSobreNosotrosExpanded && ( {(sobreNosotrosNav?.navs || []).map((item, index) => ( {item.name} ))} )} )} ); }

Sobre nosotros

Antaflex

Pakt Logística Express

Paquetería Pochtec

Paqueteria Sandoval SA DE CV

Ser-sonrisas En Ruta

Velozz Logística y Soluciones de Paquetería