{"version":3,"file":"c7b1af92.js","mappings":"+NAaA,IAAMA,GAAO,8KAQI,SAAAC,GAAC,OAAKA,EAAEC,cAAgB,OAAS,QARrC,oBASO,SAAAD,GAAC,OAAKA,EAAEE,iBAAmB,OAAS,QAT3C,uEAcM,SAAAF,GAAC,OAAKA,EAAEC,cAAgB,OAAS,QAdvC,oBAeS,SAAAD,GAAC,OAAKA,EAAEE,iBAAmB,OAAS,QAf7C,4CAmBM,SAAAF,GAAC,OAAKA,EAAEC,cAAgB,OAAS,QAnBvC,oBAoBS,SAAAD,GAAC,OAAKA,EAAEE,iBAAmB,OAAS,QApB7C,MAwBPC,GAAE,qIAOc,SAAAH,GAAC,OAAIA,EAAEI,MAAMC,MAAML,EAAEM,WAPnC,mDAcFC,GAAM,yJAQNC,GAAU,+MAiBVC,GAAgB,kGAIA,SAAAT,GAAC,OAAII,EAAAA,EAAAA,MAAYJ,EAAEU,mBAJnB,yHAiBhBC,GAAS,kKAQO,SAAAX,GAAC,OAAIA,EAAEI,MAAMC,MAAML,EAAEY,YAR5B,gHAoBFR,EAAAA,EAAAA,MAAAA,SApBE,kCAwBX,SAAAJ,GAAC,OACDA,EAAEa,WACFC,EAAAA,EAAAA,KADA,oBAEsBV,EAAAA,EAAAA,MAAAA,UAFtB,qBAGsBA,EAAAA,EAAAA,MAAAA,UAHtB,4BAMaA,EAAAA,EAAAA,MAAAA,MANb,WAzBW,mGAAf,wCA6CMW,GAAgB,OAAOC,EAAAA,EAAP,qBAAH,+BAEb,SAAAhB,GAAC,OACDA,EAAEa,UAAF,IAHa,4CAUA,SAAAb,GAAC,OAAIA,EAAEI,MAAMa,MAAMC,KAAKC,WAVxB,iBAAnB,qHAeMC,GAAI,8EAIJ,SAAApB,GAAC,OACDA,EAAEa,UAAF,IALI,MAAV,kFAiBMQ,GAAe,sGAIC,SAAArB,GAAC,OAAIA,EAAEI,MAAMC,MAAML,EAAEsB,cAJtB,mGAUNlB,EAAAA,EAAAA,aAVM,MAajB,SAAAJ,GAAC,OACAA,EAAEuB,aAAH,IAdiB,qIAkCfC,GAAgB,2QAuBhBC,GAAiB,OAAOT,EAAAA,EAAP,qBAAH,8EAOdU,GAAiB,yKAYjBC,GAAU,sCAsBVC,EAAqB,SAAC,GAQrB,IAPLC,EAOI,EAPJA,SACAN,EAMI,EANJA,YACAO,EAKI,EALJA,eACAC,EAII,EAJJA,sBACAC,EAGI,EAHJA,SACApB,EAEI,EAFJA,SACAqB,EACI,EADJA,MAEMC,EAAeC,GAAAA,CAAUN,EAASO,MAAMC,OAAO,GAAGC,MAClDC,EAAahB,IAAgBW,EAEnC,OACE,SAACvB,EAAD,CACEE,SAAU0B,EACVC,QAAS,kBAAMV,EAAeI,IAC9BO,KAAK,MACL,gBAAeF,EACfG,GAAIR,EACJ,gBAAkBA,EAAlB,SACAS,SAAUJ,EAAa,MAAQ,EAC/B3B,SAAUA,EACVgC,UAAW,SAAAC,GACK,eAAVA,EAAEC,KAAwBb,EAAQD,EAASe,OAAS,GACtDF,EAAEG,OAAOC,mBAAmBC,QAEhB,cAAVL,EAAEC,KAAuBb,EAAQ,GACnCY,EAAEG,OAAOG,uBAAuBD,WAIpC,SAACnC,EAAD,CAAeqC,QAAM,EAACC,KAAK,YAAYxC,SAAU0B,EAAYe,UAAQ,GAClEzB,IAEF0B,EAAAA,EAAAA,GAASxB,EAAuBX,EAAM,CAAEP,SAAU0B,MAKnDiB,EAAoB,SAAC,GAA4F,IAA1F3B,EAAyF,EAAzFA,SAAU4B,EAA+E,EAA/EA,cAAeC,EAAgE,EAAhEA,aAAcC,EAAkD,EAAlDA,cAAepC,EAAmC,EAAnCA,YAAab,EAAsB,EAAtBA,gBACxFwB,EAAeC,GAAAA,CAAUN,EAASO,MAAMC,OAAO,GAAGC,MAClDC,EAAahB,IAAgBW,EAEnC,OACE,SAACb,EAAD,CACEE,YAAagB,EACbG,GAAOR,EAAL,SACFO,KAAK,WACL,kBAAiBP,EACjBS,SAAUJ,EAAa,GAAK,EAC5BqB,QAASrB,EACTjB,WAAYZ,EACZmD,UAAU,kBAEV,SAACnC,EAAD,MAAoB6B,EAAAA,EAAAA,GAASI,EAAehC,EAAY,CAAEmC,OAAO,MACjE,SAAC,IAAD,CAAOC,MAAO,GAAIC,YAAa,KAC/B,SAACxC,EAAD,MACE,SAACC,EAAD,CAAgB4B,KAAK,WAAWZ,KAAK,UAAU,aAAW,IAAIa,UAAQ,GACnEG,IAEH,SAAC,IAAD,CAAMJ,KAAK,OAAOC,UAAQ,GACvBI,MAgFX,IAzEqB,SAAC,GAAwB,IAAtBO,EAAqB,EAArBA,MAAOC,EAAc,EAAdA,QACvBC,GAAQ,SAAC,EAAAC,SAAD,CAAU/B,OAAQ6B,EAAQG,OAAOf,WACzCgB,GAAW,SAAC,EAAAF,SAAD,CAAU/B,OAAQ6B,EAAQI,SAAShB,WAC5CjD,EAAU6D,EAAV7D,MACFkE,EAAWL,EAAQM,UACnBvE,EAAgBiE,MAAAA,OAAH,EAAGA,EAASO,gBACzBvE,EAAmBgE,MAAAA,OAAH,EAAGA,EAASQ,mBAE5BC,EAAOV,EAAMW,KAAI,SAAAC,GAAI,OAAI1C,GAAAA,CAAU0C,EAAKC,UAAUxC,SACxD,GAAsCyC,EAAAA,EAAAA,UAASJ,EAAK,IAA7CpD,EAAP,KAAoBO,EAApB,KACMkD,EAhGC,aAgG4B3E,EA/FxB,CACLK,gBAAiB,WACjBE,SAAU,SAQL,CACLF,gBAAiB,QACjBE,SAAU,YAqFhB,OACE,SAACb,EAAD,CACE2C,GAAI6B,GAAY,KAChBtE,cAAiC,OAAlBA,GAAgCA,EAC/CC,iBAAuC,OAArBA,GAAmCA,IAErD,SAACK,EAAD,MACE,SAAC,IAAD,CAAM8C,KAAK,WAAWD,QAAM,EAACE,UAAQ,GAClCa,IAEH,SAAC,IAAD,CAAOc,OAAQ,KACdX,IACC,0BACE,SAAC,IAAD,CAAMjB,KAAK,OAAOD,QAAM,EAACE,UAAQ,GAC9BgB,EAAU,MAEb,SAAC,IAAD,CAAOW,OAAQ,EAAGC,aAAc,QAItC,SAAC1E,EAAD,MACE,SAACC,EAAD,CAAkBgC,KAAK,UAAU/B,gBAAiBsE,EAAcpE,UAC7DqD,GACCA,EAAMW,KAAI,SAACC,EAAMM,GAAP,OACR,SAACvD,EAAD,CACEK,MAAOkD,EACPnD,SAAUiC,EACVpC,UAAU,SAAC,EAAAuC,SAAD,CAAU/B,OAAQwC,EAAKC,UAAUxB,WAC3CZ,GAAIP,GAAAA,CAAU0C,EAAKC,UAAUxC,MAC7Bf,YAAaA,EACbO,eAAgBA,EAChBC,sBAAuB8C,EAAKO,uBAC5BxE,SAAUoE,EAAcpE,SACxBkC,IAAK+B,EAAKC,UAAUxC,WAI3B2B,GACCA,EAAMW,KAAI,SAACC,EAAMM,GAAP,OACR,SAAC,WAAD,CAAgBrC,IAAK+B,EAAKC,UAAUxC,OAClC,SAACkB,EAAD,CACE3B,UAAU,SAAC,EAAAuC,SAAD,CAAU/B,OAAQwC,EAAKC,UAAUxB,WAC3CG,eAAe,SAAC,EAAAW,SAAD,CAAU/B,OAAQwC,EAAKQ,gBAAgB/B,WACtDI,cAAc,SAAC,EAAAU,SAAD,CAAU/B,OAAQwC,EAAKS,eAAehC,WACpDK,cAAekB,EAAKU,gBACpBC,cAAeX,EAAKY,gBACpBlE,YAAaA,EACbb,gBAAiBsE,EAActE,wBAKzC,SAACP,EAAD,CACE0D,UAAU,KACVvD,QAAS0E,EAActE,gBACvBT,cAAiC,OAAlBA,GAAgCA","sources":["webpack://audioeye-web/./src/components/pageSlices/FeaturedTabs.jsx"],"sourcesContent":["/* eslint-disable indent */\nimport React, { useState } from 'react'\nimport { graphql } from 'gatsby'\nimport styled from '@emotion/styled'\nimport { css } from '@emotion/react'\nimport kebabCase from 'lodash/kebabCase'\nimport { RichText } from 'prismic-reactjs'\n\nimport { theme } from '../../styles'\nimport Text from '../common/Text'\nimport Space from '../common/Space'\nimport getImage from '../../utils/getImage'\n\nconst Wrapper = styled.div`\n position: relative;\n width: 100%;\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n padding: 80px 0px;\n padding-top: ${p => (p.hasTopPadding ? '80px' : '0px')};\n padding-bottom: ${p => (p.hasBottomPadding ? '80px' : '0px')};\n\n @media (max-width: 1050px) {\n width: 100%;\n margin-left: 0px;\n padding-top: ${p => (p.hasTopPadding ? '48px' : '0px')};\n padding-bottom: ${p => (p.hasBottomPadding ? '48px' : '0px')};\n }\n\n @media (max-width: 800px) {\n padding-top: ${p => (p.hasTopPadding ? '40px' : '0px')};\n padding-bottom: ${p => (p.hasBottomPadding ? '40px' : '0px')};\n }\n`\n\nconst BG = styled.div`\n position: absolute;\n width: 500vw;\n height: 100%;\n margin-left: -300%;\n top: 0;\n z-index: -1;\n background-color: ${p => p.theme.color[p.bgColor]};\n\n @media (max-width: 1050px) {\n margin-left: -100%;\n }\n`\n\nconst Header = styled.div`\n max-width: 900px;\n display: flex;\n flex-direction: column;\n align-content: center;\n align-items: center;\n`\n\nconst TabWrapper = styled.div`\n width: 100%;\n margin-top: 40px;\n z-index: 2;\n &:focus {\n outline: none;\n }\n\n @media (max-width: 1050px) {\n margin-top: 24px;\n }\n\n @media (max-width: 800px) {\n margin-top: 0px;\n }\n`\n\nconst TabButtonWrapper = styled.div`\n width: 100%;\n display: flex;\n flex-direction: row;\n background-color: ${p => theme.color[p.backgroundColor]};\n border-radius: 8px;\n padding: 16px;\n\n @media (max-width: 1050px) {\n padding: 0 32px;\n }\n\n @media (max-width: 800px) {\n padding: 0 12px;\n }\n`\n\nconst TabButton = styled.button`\n display: flex;\n flex: 1;\n justify-content: center;\n align-items: center;\n cursor: pointer;\n padding: 8px;\n margin: 0px 5px;\n background-color: ${p => p.theme.color[p.tabColor]};\n border-radius: 8px;\n position: relative;\n\n &:first-of-type {\n margin-left: 0px;\n }\n &:last-child {\n margin-right: 0px;\n }\n\n p {\n color: ${theme.color.offBlack};\n margin-bottom: 0px !important;\n }\n\n ${p =>\n p.selected &&\n css`\n background-color: ${theme.color.purple500};\n border: 3px solid ${theme.color.purple500};\n box-shadow: none;\n p {\n color: ${theme.color.white};\n }\n `}\n\n @media (max-width: 1050px) {\n padding: 10px;\n }\n\n @media (max-width: 800px) {\n margin: 0px 2px;\n padding: 4px;\n }\n`\n\nconst TabButtonText = styled(Text)`\n @media (max-width: 1050px) {\n ${p =>\n p.selected &&\n css`\n display: none;\n `};\n }\n @media (max-width: 500px) {\n p {\n font-size: ${p => p.theme.fonts.size.tinyBody}!important;\n }\n }\n`\n\nconst Icon = styled.img`\n display: none;\n\n @media (max-width: 1050px) {\n ${p =>\n p.selected &&\n css`\n display: flex;\n max-width: 60px;\n min-width: 45px;\n max-height: 60px;\n object-fit: contain;\n width: 100%;\n `}\n }\n`\n\nconst TabPanelWrapper = styled.div`\n display: flex;\n justify-content: center;\n width: 100%;\n background-color: ${p => p.theme.color[p.panelColor]};\n align-items: flex-start;\n padding: 64px 16px 0px 16px;\n border: 3px solid transparent;\n\n &:focus {\n outline: ${theme.focusOutline};\n }\n\n ${p =>\n !p.selectedTab &&\n css`\n height: 0px !important;\n min-height: 0px;\n visibility: hidden;\n `}\n\n @media (max-width: 1350px) {\n min-height: 425px;\n }\n\n @media (max-width: 1050px) {\n padding: 0px;\n }\n\n @media (max-width: 800px) {\n min-height: 350px;\n }\n`\n\nconst PanelTextWrapper = styled.div`\n display: flex;\n flex: 1;\n flex-direction: column;\n\n ul {\n text-align: left;\n padding-left: 20px;\n }\n p {\n margin-bottom: 0px;\n }\n\n @media (max-width: 1050px) {\n align-items: center;\n padding: 24px;\n }\n\n @media (max-width: 500px) {\n padding: 24px 12px;\n }\n`\n\nconst PanelTitleText = styled(Text)`\n margin-bottom: 16px;\n p {\n margin-bottom: 0px !important;\n }\n`\n\nconst PanelImageWrapper = styled.div`\n display: flex;\n flex: 1;\n justify-content: center;\n width: 100%;\n height: 100%;\n\n @media (max-width: 1050px) {\n display: none;\n }\n`\n\nconst PanelImage = styled.img``\n\nconst modifyColors = bgColor => {\n switch (bgColor) {\n case 'offWhite':\n return {\n backgroundColor: 'offWhite',\n tabColor: 'white',\n }\n case 'white':\n return {\n backgroundColor: 'white',\n tabColor: 'offWhite',\n }\n default:\n return {\n backgroundColor: 'white',\n tabColor: 'offWhite',\n }\n }\n}\n\nconst TabButtonComponent = ({\n tabTitle,\n selectedTab,\n setSelectedTab,\n selectedTabMobileIcon,\n tabItems,\n tabColor,\n index,\n}) => {\n const tabTitleText = kebabCase(tabTitle.props.render[0].text)\n const isSelected = selectedTab === tabTitleText\n\n return (\n setSelectedTab(tabTitleText)}\n role=\"tab\"\n aria-selected={isSelected}\n id={tabTitleText}\n aria-controls={`${tabTitleText}-panel`}\n tabIndex={isSelected ? null : -1}\n tabColor={tabColor}\n onKeyDown={e => {\n if (e.key === 'ArrowRight' && index < tabItems.length - 1) {\n e.target.nextElementSibling.focus()\n }\n if (e.key === 'ArrowLeft' && index > 0) {\n e.target.previousElementSibling.focus()\n }\n }}\n >\n \n {tabTitle}\n \n {getImage(selectedTabMobileIcon, Icon, { selected: isSelected })}\n \n )\n}\n\nconst TabPanelComponent = ({ tabTitle, tabPanelTitle, tabPanelText, tabPanelImage, selectedTab, backgroundColor }) => {\n const tabTitleText = kebabCase(tabTitle.props.render[0].text)\n const isSelected = selectedTab === tabTitleText\n\n return (\n