{"version":3,"sources":["components/landing/LandingFAQ/LandingFAQ.tsx"],"names":["LandingFAQ","datos","useState","preguntaActiva","setPreguntaActiva","useHistory","className","id","Typography","variant","component","map","dato","indice","key","onClick","handlePreguntaClick","pregunta","respuesta"],"mappings":"oOAyFeA,MAtEf,YAAwC,IAAnBC,EAAkB,EAAlBA,MAAkB,EACOC,mBAAwB,MAD/B,mBAC9BC,EAD8B,KACdC,EADc,KAiBrC,OANgBC,cAOd,6BACE,yBAAKC,UAAU,MAAMC,GAAG,wBACtB,yBAAKD,UAAU,qBACb,kBAACE,EAAA,EAAD,CAAYC,QAAQ,KAAKC,UAAU,KAAKJ,UAAU,2BAAlD,yBAIF,yBAAKA,UAAU,uBACb,yBAAKA,UAAU,gBACZL,EAAMU,KAAI,SAACC,EAAMC,GAAP,OACT,yBAAKP,UAAU,WAAWQ,IAAKD,GAC7B,wBAAIE,QAAS,kBA1BC,SAACF,GAEzBT,EADED,IAAmBU,EACH,KAEAA,GAsBWG,CAAoBH,KACpCD,EAAKK,UAER,yBACEX,UAAS,iBACPH,IAAmBU,EAAS,SAAW,KAG3C,2BAAID,EAAKM","file":"static/js/11.fafe86c7.chunk.js","sourcesContent":["import React, {useState} from \"react\";\nimport Button from \"@material-ui/core/Button\";\nimport Typography from \"@material-ui/core/Typography\";\n//import ArrowForwardIcon from \"@material-ui/icons/ArrowForward\";\n//import imgRecommendations from \"../../../assets/recommendations-cover-2.png\";\nimport { useHistory } from \"react-router-dom\";\n\n/* import imgGirl from \"../../../assets/cover-girl.png\"; */\n\ninterface FAQData {\n  pregunta: string;\n  respuesta: string;\n}\n\ninterface FAQProps {\n  datos: FAQData[];\n}\n\n\nfunction LandingFAQ({datos}: FAQProps) {\n  const [preguntaActiva, setPreguntaActiva] = useState<number | null>(null);\n\n  const handlePreguntaClick = (indice: number) => {\n    if (preguntaActiva === indice) {\n      setPreguntaActiva(null);\n    } else {\n      setPreguntaActiva(indice);\n    }\n  };\n\n  const history = useHistory();\n\n  function handleClick() {\n    history.push('/signup/?user=1');\n  }\n\n  return (\n    <div>\n      <div className=\"faq\" id=\"preguntas-frecuentes\">\n        <div className=\"landing-faq-title\">\n          <Typography variant=\"h1\" component=\"h2\" className=\"landing-title faq-title\">\n          Preguntas frecuentes\n          </Typography>\n        </div>\n        <div className=\"landing-faq-content\">\n          <div className=\"faq-acordeon\">\n            {datos.map((dato, indice) => (\n              <div className=\"question\" key={indice}>\n                <h2 onClick={() => handlePreguntaClick(indice)}>\n                  {dato.pregunta}\n                </h2>\n                <div\n                  className={`answer ${\n                    preguntaActiva === indice ? 'activo' : ''\n                  }`}\n                >\n                <p>{dato.respuesta}</p>\n              </div>\n            </div>\n          ))}\n          </div>\n        </div>\n      </div>\n    </div>\n  );\n  /* return (\n    <div>\n      <div className=\"faq\">\n        <div className=\"landing-faq-title\">\n          <Typography variant=\"h1\" component=\"h2\" className=\"landing-title faq-title\">\n          Preguntas frecuentes\n          </Typography>\n        </div>\n        <div class=\"landing-faq-content\">\n          <div class=\"faq-acordeon\">\n            <div class=\"question\">\n              <h2>¿Pregunta 1?</h2>\n              <div class=\"answer\">\n                <p>Respuesta a la pregunta 1.</p>\n              </div>\n            </div>\n          </div>\n        </div>\n      </div>\n    </div>\n    \n  ); */\n}\n\nexport default LandingFAQ;"],"sourceRoot":""}