{"version":3,"sources":["webpack:///./src/components/layout/PowerPackExpansionConditions.jsx","webpack:///./src/components/layout/PowerPackConditions.jsx","webpack:///./src/components/layout/PowerPackTileLean.jsx","webpack:///./src/components/layout/PowerPacksCarousel.jsx","webpack:///./src/components/powerpacks/PowerPackTile.jsx","webpack:///./src/components/powerpacks/WhatIsPowerPack.jsx","webpack:///./src/components/powerpacks/PowerBoxTile.jsx","webpack:///./src/pages/powerpacks-carregamento-eletrico-casa/index.js","webpack:///./src/components/layout/PowerPackExpansionTile.jsx","webpack:///./src/components/layout/PowerPacksExpansionCarousel.jsx","webpack:///./src/components/common/ScrollToTop.jsx"],"names":["Container","styled","div","Condition","h2","p","PowerPackExpansionConditions","appState","useContext","AppContext","i18n","aboutPlans","powerpack_expansion","expansion_possible_text","PowerPackConditions","powerpacks","condition1","condition2","condition4","Tile","TileHeader","Subtitle","h4","Title","LabelPower","span","props","pack","MainList","MainListItems","h5","MainListItemsTitle","TileContent","SecItemsCont","SecondaryListItems","SecondaryItemDesc","PricesContainer","Price","Button","PowerPackTileLean","title","subtitle","dailyProduction","power","accum","charger","includedKms","roi","implArea","price","className","accumulation","included_kms","freeKmsPerYear","Tooltip","text","roi_tooltip","roi_sub","kwProd","kwProd_sub","PowerPacksContainer","PowerPacksCarousel","monophasic","simpleCharger","triphasic","to","label","purchase","toUpperCase","Article","Text","WhatIsPowerPack","SectionTitle","PowerPackLandingPage","sendEvent","id","PowerpackTwinContainer","image","carregamentoCasa","expansion","PowerPacksExpansionCarousel","whatIsPowerPack_title","whatIsPowerPack_text","list","Footer","PowerPackExpansionTile","panelsPower","availableInverters","availableBatteries","panels","upTo","ScrollToTop","page","useEffect","window","scrollTo"],"mappings":"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","file":"component---src-pages-powerpacks-carregamento-eletrico-casa-index-js-65aa6620076061408900.js","sourcesContent":["import React, { useContext } from 'react'\nimport styled from 'styled-components'\nimport { AppContext } from '../../contexts/AppContext'\n\nconst Container = styled.div`\n    margin: 60px 10%;\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    justify-content: left;\n`\n\nconst Title = styled.h2`\n    text-transform: uppercase;\n` \n\nconst Condition = styled.p`\n    font-size: 12pt;\n    font-weight: 300;\n`\n\nexport default function PowerPackExpansionConditions() {\n\n    const { appState } = useContext(AppContext);\n\n    return (\n        <Container>\n            <Condition>{appState.i18n.aboutPlans.powerpack_expansion.expansion_possible_text}</Condition>\n        </Container>\n    )\n}\n","import React, { useContext } from 'react'\nimport styled from 'styled-components'\nimport { AppContext } from '../../contexts/AppContext'\n\nconst Container = styled.div`\n    margin: 60px 10%;\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    justify-content: left;\n`\n\nconst Title = styled.h2`\n    text-transform: uppercase;\n` \n\nconst Condition = styled.p`\n    font-size: 12pt;\n    font-weight: 300;\n`\n\nexport default function PowerPackConditions() {\n\n    const { appState } = useContext(AppContext);\n\n    return (\n        <Container>\n            <Condition>{appState.i18n.powerpacks.condition1}</Condition>\n            <Condition>{appState.i18n.powerpacks.condition2}</Condition>\n            {/* <Condition>{appState.i18n.powerpacks.condition5}</Condition> */}\n            {/* <Condition>{appState.i18n.powerpacks.condition3}</Condition> */}\n            <Condition>{appState.i18n.powerpacks.condition4}</Condition>\n        </Container>\n    )\n}\n","import styled from 'styled-components'\nimport React, { useContext } from 'react';\nimport { AppContext } from '../../contexts/AppContext';\nimport { Button } from '@material-ui/core';\nimport { AnchorLink } from 'gatsby-plugin-anchor-links';\nimport InfoIcon from '@material-ui/icons/Info';\nimport Tooltip from '../common/Tooltip';\n\nconst Tile = styled.div`\n    display: flex;\n    flex-direction: column;\n    justify-content: center;\n    margin: 50px 20px 0 20px;\n    width: 325px;\n    @media (max-width: 425px) {\n        margin: 50px auto 0 auto;\n    }\n`\n\nconst Container = styled.div`\n    min-width: 325px;\n    margin-bottom: 20px;\n    border-radius: 20px;\n    background-color: white;\n`\n\nconst TileHeader = styled.div`\n    border-radius: 20px;\n    padding: 30px;\n    min-height: 200px;\n`\n\nconst Subtitle = styled.h4`\n    font-weight: 400 !important;\n    margin: 0;\n    font-size: 18pt;\n`\n\nconst Title = styled.h2`\n    margin: 0;\n    font-size: 25pt;\n`\n\nconst LabelPower = styled.span`\n    color: ${props => props.pack === \"20\" ? \"#29ABE2\" : props.pack === \"40\" ? \"#00a589\" : props.pack === \"60\" ? \"#2E3192\" : \"#29ABE2\"} ;\n`\n\nconst MainList = styled.div`\n    margin-top: 20px;\n`\n\nconst MainListItems = styled.h5`\n    margin: 0;\n    font-weight: 400;\n    font-size: 12pt;\n    padding: 0px 5px 0 5px;\n`\n\nconst MainListItemsTitle = styled.h5`\n    margin: 0;\n    font-weight: 600;\n    font-size: 12pt;\n    padding: 10px 5px 0 5px;\n`\n\nconst TileContent = styled.div`\n    padding: 30px;\n    background-color: ${props => props.pack === \"20\" ? \"#29ABE2\" : props.pack === \"40\" ? \"#00a589\" : props.pack === \"60\" ? \"#2E3192\" : \"#29ABE2\"} ;\n    opacity: 0.8;\n    border-bottom-right-radius: 20px;\n    border-bottom-left-radius: 20px;\n`\n\nconst SecItemsCont = styled.div`\n    padding: 15px 0;\n    line-height: 17px;\n\n    &:first-child {\n        padding-top: 0;\n    }\n\n    &:last-child {\n        padding-bottom: 0;\n    }\n`\n\nconst SecondaryListItems = styled.div`\n    display: flex;\n    color: white;\n    font-size: 14pt;\n    font-weight: 400;\n`\n\nconst SecondaryItemDesc = styled.span`\n    font-size: 10pt;\n    color: white;\n`\n\nconst HeaderSecondaryItemDesc = styled.span`\n    font-size: 10pt;\n    color: black;\n    padding: 0 5px;\n`\n\nconst PricesContainer = styled.div`\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n`\n\nconst PriceLabel = styled.span`\n    font-size: 16pt;\n    font-weight: 500;\n`\n\nconst Price = styled.span`\n    font-size: 20pt;\n    font-weight: 700;\n    margin: 10px 0 40px 0;\n`\n\nconst BuyButton = styled(Button)`\n` \n\nexport default function PowerPackTileLean({ title, subtitle, pack, dailyProduction, power, accum, charger, includedKms, roi, implArea, price }) {\n\n    const { appState } = useContext(AppContext)\n\n   \n\n    return (\n        <Tile>\n            <Container className=\"shadow\">\n                <TileHeader>\n                    {/* <Subtitle>{appState.i18n.powerpacks.pack}</Subtitle> */}\n                    <Title>{title} <LabelPower pack={pack}>{pack}</LabelPower></Title>\n                    <Subtitle>{subtitle}</Subtitle>\n                    <MainList>\n                        <MainListItemsTitle>{appState.i18n.powerpacks.dailyProduction}</MainListItemsTitle>\n                        <MainListItems>{dailyProduction} kWh</MainListItems>\n\n                        <MainListItemsTitle>{appState.i18n.powerpacks.power}</MainListItemsTitle>\n                        <MainListItems>{power} kW</MainListItems>\n                        \n                        <MainListItemsTitle>{appState.i18n.powerpacks.accumulation}</MainListItemsTitle>\n                        <MainListItems>{accum} kWh</MainListItems>\n\n                        <MainListItemsTitle>{appState.i18n.powerpacks.charger}</MainListItemsTitle>\n                        <MainListItems>{charger}</MainListItems>\n\n                        <MainListItemsTitle>{appState.i18n.powerpacks.included_kms}</MainListItemsTitle>\n                        <MainListItems>{includedKms} {appState.i18n.powerpacks.freeKmsPerYear}</MainListItems>\n                    </MainList>\n                </TileHeader>\n                <TileContent pack={pack}>\n                    {/* <SecItemsCont>\n                        <SecondaryListItems>{freeKms} {appState.i18n.powerpacks.freeKmsPerYear}</SecondaryListItems>\n                    </SecItemsCont> */}\n                    <SecItemsCont>\n                        <SecondaryListItems>{roi} {appState.i18n.powerpacks.roi}<Tooltip text={appState.i18n.powerpacks.roi_tooltip} /></SecondaryListItems>\n                        <SecondaryItemDesc>{appState.i18n.powerpacks.roi_sub}</SecondaryItemDesc>\n                    </SecItemsCont>\n                    <SecItemsCont>\n                        <SecondaryListItems>{dailyProduction} {appState.i18n.powerpacks.kwProd}</SecondaryListItems>\n                        <SecondaryItemDesc>{appState.i18n.powerpacks.kwProd_sub}</SecondaryItemDesc>\n                    </SecItemsCont>\n                    {/* <SecItemsCont>\n                        <SecondaryListItems>{batt} {appState.i18n.powerpacks.kwBatt}</SecondaryListItems>\n                    </SecItemsCont> */}\n                    <SecItemsCont>\n                        <SecondaryListItems>{implArea} m2</SecondaryListItems>\n                        <SecondaryItemDesc>{appState.i18n.powerpacks.implArea}</SecondaryItemDesc>\n                        {/* <SecondaryItemDesc>{appState.i18n.powerpacks.implArea_sub}</SecondaryItemDesc> */}\n                    </SecItemsCont>\n                </TileContent>\n            </Container>\n            <PricesContainer>\n                {/* <PriceLabel>{appState.i18n.all.price}</PriceLabel> */}\n                <Price>{price}</Price>\n            </PricesContainer>\n        </Tile>\n    )\n}\n","import { Link } from 'gatsby';\nimport React from 'react'\nimport { useContext } from 'react';\nimport styled from 'styled-components'\nimport { AppContext } from '../../contexts/AppContext';\nimport DefaultButton from '../common/Button';\nimport PowerPackTileLean from './PowerPackTileLean';\n\nconst PowerPacksContainer = styled.div`\n    display: flex;\n    flex-direction: row;\n    justify-content: center;\n    flex-wrap: wrap;\n    margin-bottom: 50px;\n    \n    @media (max-width: 425px) {\n        flex-direction: column;\n        align-items: center;\n    }\n`\nconst Container = styled.div`\n    margin: 50px 10%;\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n`\n\nexport default function PowerPacksCarousel() {\n\n    const { appState } = useContext(AppContext);\n\n    return (\n        <Container>\n            <PowerPacksContainer>\n           \n            \n                <PowerPackTileLean\n                     title={\"PowerPack\"}\n                     subtitle={appState.i18n.powerpacks.monophasic} \n                     pack={\"20\"} \n                     dailyProduction={\"8\"} \n                     power={\"3,7\"} \n                     accum={\"3\"} \n                     charger={appState.i18n.powerpacks.simpleCharger}\n                     includedKms={\"7300\"} \n                     roi={\"8,56%\"} \n                     implArea={\"10\"} \n                     price={\"€8.299\"}\n                    />\n                <PowerPackTileLean\n                     title={\"PowerPack\"}\n                     subtitle={appState.i18n.powerpacks.monophasic + \"/\" + appState.i18n.powerpacks.triphasic} \n                     pack={\"40\"} \n                     dailyProduction={\"12\"} \n                     power={\"6\"} \n                     accum={\"6\"} \n                     charger={appState.i18n.powerpacks.simpleCharger}\n                     includedKms={\"14600\"} \n                     roi={\"9,93%\"} \n                     implArea={\"14\"} \n                     price={\"€10.799\"}\n                    />\n                <PowerPackTileLean\n                     title={\"PowerPack\"}\n                     subtitle={appState.i18n.powerpacks.triphasic} \n                     pack={\"60\"} \n                     dailyProduction={\"20\"} \n                     power={\"8\"} \n                     accum={\"9\"} \n                     charger={appState.i18n.powerpacks.simpleCharger}\n                     includedKms={\"22000\"} \n                     roi={\"11,6%\"} \n                     implArea={\"24\"} \n                     price={\"€14.899\"}\n                    />\n                \n            </PowerPacksContainer>\n            <Link to=\"/powerpacks-carregamento-eletrico-casa\">\n                <DefaultButton label={appState.i18n.powerpacks.purchase.toUpperCase()} />\n            </Link>\n        </Container>\n    )\n}\n\n\n","import styled from 'styled-components'\nimport React, { useContext } from 'react';\nimport { AppContext } from '../../contexts/AppContext';\nimport { Button } from '@material-ui/core';\nimport { AnchorLink } from 'gatsby-plugin-anchor-links';\nimport InfoIcon from '@material-ui/icons/Info';\nimport Tooltip from '../common/Tooltip';\n\nconst Tile = styled.div`\n    display: flex;\n    flex-direction: column;\n    justify-content: center;\n    margin: 50px 20px 0 20px;\n    width: 325px;\n    @media (max-width: 425px) {\n        margin: 50px auto 0 auto;\n    }\n`\n\nconst Container = styled.div`\n    min-width: 325px;\n    margin-bottom: 20px;\n    border-radius: 20px;\n    background-color: white;\n`\n\nconst TileHeader = styled.div`\n    border-radius: 20px;\n    padding: 30px;\n    min-height: 200px;\n`\n\nconst Subtitle = styled.h4`\n    font-weight: 400 !important;\n    margin: 0;\n    font-size: 18pt;\n`\n\nconst Title = styled.h2`\n    margin: 0;\n    font-size: 25pt;\n`\n\nconst LabelPower = styled.span`\n    color: ${props => props.pack === \"40\" ? \"#29ABE2\" : props.pack === \"60\" ? \"#00a589\" : props.pack === \"80\" ? \"#2E3192\" : \"#29ABE2\"} ;\n`\n\nconst MainList = styled.div`\n    margin-top: 20px;\n`\n\nconst MainListItems = styled.h5`\n    margin: 0;\n    font-weight: 400;\n    font-size: 12pt;\n    padding: 10px 5px 0 5px;\n`\n\nconst TileContent = styled.div`\n    height: 278px;\n    padding: 30px;\n    background-color: ${props => props.pack === \"40\" ? \"#29ABE2\" : props.pack === \"60\" ? \"#00a589\" : props.pack === \"80\" ? \"#2E3192\" : \"#29ABE2\"} ;\n    opacity: 0.8;\n    border-bottom-right-radius: 20px;\n    border-bottom-left-radius: 20px;\n`\n\nconst SecItemsCont = styled.div`\n    padding: 15px 0;\n    line-height: 17px;\n\n    &:first-child {\n        padding-top: 0;\n    }\n\n    &:last-child {\n        padding-bottom: 0;\n    }\n`\n\nconst SecondaryListItems = styled.div`\n    display: flex;\n    color: white;\n    font-size: 14pt;\n    font-weight: 400;\n`\n\nconst SecondaryItemDesc = styled.span`\n    font-size: 10pt;\n    color: white;\n`\n\nconst HeaderSecondaryItemDesc = styled.span`\n    font-size: 10pt;\n    color: black;\n    padding: 0 5px;\n`\n\nconst PricesContainer = styled.div`\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n`\n\nconst PriceLabel = styled.span`\n    font-size: 16pt;\n    font-weight: 500;\n`\n\nconst Price = styled.span`\n    font-size: 20pt;\n    font-weight: 700;\n    margin: 10px 0 40px 0;\n`\n\nconst BuyButton = styled(Button)`\n` \n\nexport default function PowerPackTile({ pack, title, wattage, charger, freeKms, roi, prod, batt, area, price }) {\n\n    const { appState } = useContext(AppContext)\n\n   \n\n    return (\n        <Tile>\n            <Container className=\"shadow\">\n                <TileHeader>\n                    {/* <Subtitle>{appState.i18n.powerpacks.pack}</Subtitle> */}\n                    <Title>{title} <LabelPower pack={pack}>{pack}</LabelPower></Title>\n                    <MainList>\n                        <MainListItems>{pack} {appState.i18n.powerpacks.freeKmsPerDay}</MainListItems>\n                        <MainListItems>{appState.i18n.powerpacks.battery} {wattage}</MainListItems>\n                        <MainListItems>{charger}</MainListItems>\n                        {pack !== \"40\" && <HeaderSecondaryItemDesc>{appState.i18n.powerpacks.privateNetwork}</HeaderSecondaryItemDesc>}\n                    </MainList>\n                </TileHeader>\n                <TileContent pack={pack}>\n                    <SecItemsCont>\n                        <SecondaryListItems>{freeKms} {appState.i18n.powerpacks.freeKmsPerYear}</SecondaryListItems>\n                    </SecItemsCont>\n                    <SecItemsCont>\n                        <SecondaryListItems>{roi} {appState.i18n.powerpacks.roi}<Tooltip text={appState.i18n.powerpacks.roi_tooltip} /></SecondaryListItems>\n                        <SecondaryItemDesc>{appState.i18n.powerpacks.roi_sub}</SecondaryItemDesc>\n                    </SecItemsCont>\n                    <SecItemsCont>\n                        <SecondaryListItems>{prod} {appState.i18n.powerpacks.kwProd}</SecondaryListItems>\n                        <SecondaryItemDesc>{appState.i18n.powerpacks.kwProd_sub}</SecondaryItemDesc>\n                    </SecItemsCont>\n                    <SecItemsCont>\n                        <SecondaryListItems>{batt} {appState.i18n.powerpacks.kwBatt}</SecondaryListItems>\n                    </SecItemsCont>\n                    <SecItemsCont>\n                        <SecondaryListItems>{area} {appState.i18n.powerpacks.implArea}</SecondaryListItems>\n                        <SecondaryItemDesc>{appState.i18n.powerpacks.implArea_sub}</SecondaryItemDesc>\n                    </SecItemsCont>\n                </TileContent>\n            </Container>\n            <PricesContainer>\n                {/* <PriceLabel>Preço</PriceLabel> */}\n                <AnchorLink smooth to=\"/powerpacks-carregamento-eletrico-casa/#powerpacks\">\n                    <BuyButton className=\"button-default shadow\" variant=\"contained\" >{appState.i18n.powerpacks.prepurchase.toUpperCase()}</BuyButton>\n                </AnchorLink>\n                {/* <Price>{price}</Price> */}\n            </PricesContainer>\n        </Tile>\n    )\n}\n","import React from 'react'\nimport styled from 'styled-components'\n\nconst Article = styled.div`\n        max-width: 500px;\n        min-width: 250px;\n        margin: 100px auto;\n        padding: 0 10%\n    `\n\nconst Title = styled.div`\n        font-size: var(--medium-title-fontsize);\n        color: var(--primary-color);\n        margin-bottom: 30px;\n    `\n\nconst Text = styled.div`\n        line-height: 20pt;\n    `\n\nexport default function WhatIsPowerPack({title, text}) {\n\n    \n\n    return (\n        <Article>\n          <Title>{title}</Title>  \n          <Text>{text}</Text>\n        </Article>\n    )\n}\n","import styled from 'styled-components'\nimport React, { useContext } from 'react';\nimport { AppContext } from '../../contexts/AppContext';\nimport { Button } from '@material-ui/core';\nimport { AnchorLink } from 'gatsby-plugin-anchor-links';\n\nconst Tile = styled.div`\n    display: flex;\n    flex-direction: column;\n    justify-content: center;\n    margin: 50px 20px 0 20px;\n    @media (max-width: 425px) {\n        margin: 50px auto 0 auto;\n    }\n`\n\nconst Container = styled.div`\n    min-width: 325px;\n    margin-bottom: 20px;\n    border-radius: 20px;\n    background-color: white;\n`\n\nconst TileHeader = styled.div`\n    border-radius: 20px;\n    padding: 30px;\n`\n\nconst Subtitle = styled.h4`\n    font-weight: 400 !important;\n    margin: 0;\n    font-size: 18pt;\n`\n\nconst Title = styled.h2`\n    margin: 0;\n    font-size: 25pt;\n`\n\nconst LabelPower = styled.span`\n    color: ${props => props.pack === \"6\" ? \"#29ABE2\" : props.pack === \"10\" ? \"#00a589\" : props.pack === \"14\" ? \"#2E3192\" : \"#29ABE2\"} !important;\n`\n\nconst MainList = styled.div`\n    margin-top: 20px;\n`\n\nconst MainListItems = styled.h5`\n    margin: 0;\n    font-weight: 400;\n    font-size: 12pt;\n    padding: 5px;\n`\n\nconst TileContent = styled.div`\n    padding: 30px;\n    background-color: ${props => props.pack === \"6\" ? \"#29ABE2\" : props.pack === \"10\" ? \"#00a589\" : props.pack === \"14\" ? \"#2E3192\" : \"#29ABE2\"} ;\n    opacity: 0.8;\n    border-bottom-right-radius: 20px;\n    border-bottom-left-radius: 20px;\n`\n\nconst SecItemsCont = styled.div`\n    padding: 15px 0;\n    line-height: 17px;\n\n    &:first-child {\n        padding-top: 0;\n    }\n\n    &:last-child {\n        padding-bottom: 0;\n    }\n`\n\nconst SecondaryListItems = styled.div`\n    color: white;\n    font-size: 14pt;\n    font-weight: 400;\n`\n\nconst SecondaryItemDesc = styled.span`\n    font-size: 10pt;\n    color: white;\n`\n\nconst PricesContainer = styled.div`\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n`\n\nconst PriceLabel = styled.span`\n    font-size: 16pt;\n    font-weight: 500;\n`\n\nconst Price = styled.span`\n    font-size: 20pt;\n    font-weight: 700;\n    margin: 10px 0 40px 0;\n`\n\nconst BuyButton = styled(Button)`\n`\n\nexport default function PowerBoxTile({ pack, title, wattage, charger, freeKms, roi, prod, batt, area, price }) {\n\n    const { appState } = useContext(AppContext)\n\n\n\n    return (\n        <Tile>\n            <Container className=\"shadow\">\n                <TileHeader>\n                    {/* <Subtitle>{appState.i18n.powerpacks.pack}</Subtitle> */}\n                    <Title>{title} <LabelPower pack={pack}>{pack}</LabelPower></Title>\n                    <MainList>\n                        {/* <MainListItems>{pack}{appState.i18n.powerpacks.freeKmsPerDay}</MainListItems>\n                        <MainListItems>{wattage}</MainListItems>\n                        <MainListItems>{appState.i18n.powerpacks.simpleCharger}</MainListItems> */}\n                    </MainList>\n                </TileHeader>\n                <TileContent pack={pack}>\n                    <SecItemsCont>\n                        <SecondaryListItems>{batt} {appState.i18n.powerpacks.kwBatt}</SecondaryListItems>\n                    </SecItemsCont>\n                </TileContent>\n            </Container>\n            <PricesContainer>\n                {/* <PriceLabel>Preço</PriceLabel> */}\n                <AnchorLink smooth to=\"/powerpacks-carregamento-eletrico-casa/#powerpacks\">\n                    <BuyButton className=\"button-default shadow\" variant=\"contained\" >{appState.i18n.powerpacks.prepurchase.toUpperCase()}</BuyButton>\n                </AnchorLink>\n                {/* <Price>{price}</Price> */}\n            </PricesContainer>\n        </Tile>\n    )\n}\n","import React, { useContext } from 'react'\nimport { Button } from '@material-ui/core';\nimport carregamentoCasa from '../../images/powerpacks/carregamento_casa.jpg'\nimport { Link } from 'gatsby';\nimport { AppContext } from '../../contexts/AppContext';\nimport Footer from '../../components/layout/Footer';\nimport ScrollToTop from '../../components/common/ScrollToTop';\nimport Layout from '../../components/layout';\nimport SEO from '../../components/seo';\nimport PowerpackTwinContainer from '../../components/layout/PowerpackTwinContainer';\nimport PowerPackTile from '../../components/powerpacks/PowerPackTile';\nimport styled from 'styled-components';\nimport WhatIsPowerPack from '../../components/powerpacks/WhatIsPowerPack';\nimport WhyPowerPack from '../../components/powerpacks/WhyPowerPack';\nimport PowerBoxTile from '../../components/powerpacks/PowerBoxTile';\nimport PowerPacksCarousel from '../../components/layout/PowerPacksCarousel';\nimport PowerPackConditions from '../../components/layout/PowerPackConditions';\nimport PowerPacksExpansionCarousel from '../../components/layout/PowerPacksExpansionCarousel';\nimport PowerPackExpansionConditions from '../../components/layout/PowerPackExpansionConditions';\n\nconst PowerPacksContainer = styled.div`\n    display: flex;\n    flex-direction: row;\n    justify-content: center;\n    flex-wrap: wrap;\n    @media (max-width: 425px) {\n        flex-direction: column;\n        align-items: center;\n    }\n`\n\nconst ConditionsContainer = styled.div`\n    padding: 60px 0 30px 0;\n    background-color: var(--secondary-bg);\n    display: flex;\n    justify-content: center;\n`\n\nconst ConditionsList = styled.div`\n    display:flex;\n    flex-direction: column;\n    padding: 10px 30px;\n` \n\nconst ConditionItem = styled.span`\n    font-size: 10pt;\n    padding: 10px 0;\n\n    &:last-child {\n        padding-bottom: 0;\n    }\n` \n\nconst ConditionSubtitle = styled.h4`\n    margin: 20px 30px 0 30px;\n    font-weight: 600;\n` \n\nconst SectionTitle = styled.h2`\n    color: var(--primary-color);\n    margin: 150px 10% 0 10%;\n    font-size: 32pt;\n\n    @media (max-width: 767px) {\n        margin: 50px 10% 0 10%;\n    }\n`\n\nexport default function PowerPackLandingPage() {\n    const { appState, sendEvent } = useContext(AppContext);\n\n    return (\n        <Layout>\n            <div id=\"powerpacks\"></div>\n            <SEO title=\"PowerPacks - Carregamento em casa\" />\n            <div className=\"vbox\">\n                {/* <ScrollToTop /> */}\n                <PowerpackTwinContainer\n                    image={carregamentoCasa}\n                    title={appState.i18n.powerpacks.title}\n                    text={appState.i18n.powerpacks.subtitle} />\n            </div>\n            <SectionTitle>PowerPacks</SectionTitle>\n            <PowerPacksCarousel />\n            <PowerPackConditions />\n            <SectionTitle>{appState.i18n.powerpacks.expansion}</SectionTitle>\n            <PowerPacksExpansionCarousel />\n            <PowerPackExpansionConditions />\n            <div>\n                <WhatIsPowerPack title={appState.i18n.powerpacks.whatIsPowerPack_title} text={appState.i18n.powerpacks.whatIsPowerPack_text} list={\"\"} />\n                {/* <WhyPowerPack /> */}\n            </div>\n\n\n            {/* <ConditionsContainer>\n                <div>\n                    <div>\n                        <span className=\"subtitle reg-plans-signing-conditions-title\">{appState.i18n[\"registration\"][\"plan_sign_conditions_title\"]}</span>\n                    </div>\n                    <ConditionSubtitle>{appState.i18n[\"powerboxes\"][\"providerContract\"]}</ConditionSubtitle>\n                    <ConditionsList>\n                        <ConditionItem>{appState.i18n[\"powerboxes\"][\"condition1\"]}</ConditionItem>\n                        <ConditionItem>{appState.i18n[\"powerboxes\"][\"condition2\"]}</ConditionItem>\n                        <ConditionItem>{appState.i18n[\"powerboxes\"][\"condition3\"]}</ConditionItem>\n                    </ConditionsList>\n\n                    <ConditionSubtitle>{appState.i18n[\"powerboxes\"][\"equipment\"]}</ConditionSubtitle>\n                    <ConditionsList>\n                        <ConditionItem>{appState.i18n[\"powerboxes\"][\"condition4\"]}</ConditionItem>\n                        <ConditionItem>{appState.i18n[\"powerboxes\"][\"condition5\"]}</ConditionItem>\n                        <ConditionItem>{appState.i18n[\"powerboxes\"][\"condition6\"]}</ConditionItem>\n                    </ConditionsList>\n                </div>\n            </ConditionsContainer> */}\n            <Footer />\n        </Layout>\n    )\n}\n","import styled from 'styled-components'\nimport React, { useContext } from 'react';\nimport { AppContext } from '../../contexts/AppContext';\nimport { Button } from '@material-ui/core';\nimport { AnchorLink } from 'gatsby-plugin-anchor-links';\nimport InfoIcon from '@material-ui/icons/Info';\nimport Tooltip from '../common/Tooltip';\n\nconst Tile = styled.div`\n    display: flex;\n    flex-direction: column;\n    justify-content: center;\n    margin: 50px 20px 0 20px;\n    width: 325px;\n    @media (max-width: 425px) {\n        margin: 50px auto 0 auto;\n    }\n`\n\nconst Container = styled.div`\n    min-width: 325px;\n    margin-bottom: 20px;\n    border-radius: 20px;\n    background-color: white;\n`\n\nconst TileHeader = styled.div`\n    border-radius: 20px;\n    padding: 30px;\n    min-height: 200px;\n`\n\nconst Subtitle = styled.h4`\n    font-weight: 400 !important;\n    margin: 0;\n    font-size: 18pt;\n`\n\nconst Title = styled.h2`\n    margin: 0;\n    font-size: 25pt;\n`\n\nconst LabelPower = styled.span`\n    color: ${props => props.pack === \"20\" ? \"#29ABE2\" : props.pack === \"40\" ? \"#00a589\" : props.pack === \"60\" ? \"#2E3192\" : \"#29ABE2\"} ;\n`\n\nconst MainList = styled.div`\n    margin-top: 20px;\n`\n\nconst MainListItems = styled.h5`\n    margin: 0;\n    font-weight: 400;\n    font-size: 12pt;\n    padding: 0px 5px 0 5px;\n`\n\nconst MainListItemsTitle = styled.h5`\n    margin: 0;\n    font-weight: 600;\n    font-size: 12pt;\n    padding: 10px 5px 0 5px;\n`\n\nconst TileContent = styled.div`\n    padding: 30px;\n    background-color: ${props => props.pack === \"20\" ? \"#29ABE2\" : props.pack === \"40\" ? \"#00a589\" : props.pack === \"60\" ? \"#2E3192\" : \"#29ABE2\"} ;\n    opacity: 0.8;\n    border-bottom-right-radius: 20px;\n    border-bottom-left-radius: 20px;\n`\n\nconst SecItemsCont = styled.div`\n    padding: 15px 0;\n    line-height: 17px;\n\n    &:first-child {\n        padding-top: 0;\n    }\n\n    &:last-child {\n        padding-bottom: 0;\n    }\n`\n\nconst SecondaryListItems = styled.div`\n    display: flex;\n    color: white;\n    font-size: 14pt;\n    font-weight: 400;\n`\n\nconst SecondaryItemDesc = styled.span`\n    font-size: 10pt;\n    color: white;\n`\n\nconst HeaderSecondaryItemDesc = styled.span`\n    font-size: 10pt;\n    color: black;\n    padding: 0 5px;\n`\n\nconst PricesContainer = styled.div`\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n`\n\nconst PriceLabel = styled.span`\n    font-size: 16pt;\n    font-weight: 500;\n`\n\nconst Price = styled.span`\n    font-size: 20pt;\n    font-weight: 700;\n    margin: 10px 0 40px 0;\n`\n\nconst BuyButton = styled(Button)`\n` \n\nexport default function PowerPackExpansionTile({ title, subtitle, pack, panelsPower, availableInverters, availableBatteries }) {\n\n    const { appState } = useContext(AppContext)\n\n   \n\n    return (\n        <Tile>\n            <Container className=\"shadow\">\n                <TileHeader>\n                    {/* <Subtitle>{appState.i18n.powerpacks.pack}</Subtitle> */}\n                    <Title>{title} <LabelPower pack={pack}>{pack}</LabelPower></Title>\n                    <Subtitle>{subtitle}</Subtitle>\n                    <MainList>\n                        <MainListItemsTitle>{appState.i18n.powerpacks.panels}</MainListItemsTitle>\n                        <MainListItems>{appState.i18n.powerpacks.upTo} {panelsPower} kWp</MainListItems>\n\n                        <MainListItemsTitle>{appState.i18n.powerpacks.availableInverters}</MainListItemsTitle>\n                        <MainListItems>{availableInverters}</MainListItems>\n                        \n                        <MainListItemsTitle>{appState.i18n.powerpacks.availableBatteries}</MainListItemsTitle>\n                        <MainListItems>{availableBatteries}</MainListItems>\n                    </MainList>\n                </TileHeader>\n            </Container>\n        </Tile>\n    )\n}\n","import { Link } from 'gatsby';\nimport React from 'react'\nimport { useContext } from 'react';\nimport styled from 'styled-components'\nimport { AppContext } from '../../contexts/AppContext';\nimport DefaultButton from '../common/Button';\nimport PowerPackExpansionTile from './PowerPackExpansionTile';\n\nconst PowerPacksContainer = styled.div`\n    display: flex;\n    flex-direction: row;\n    justify-content: center;\n    flex-wrap: wrap;\n    margin-bottom: 50px;\n    \n    @media (max-width: 425px) {\n        flex-direction: column;\n        align-items: center;\n    }\n`\nconst Container = styled.div`\n    margin: 50px 10%;\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n`\n\nexport default function PowerPacksExpansionCarousel() {\n\n    const { appState } = useContext(AppContext);\n\n    return (\n        <Container>\n            <PowerPacksContainer>\n           \n            \n                <PowerPackExpansionTile\n                     title={\"PowerPack\"}\n                     subtitle={appState.i18n.powerpacks.monophasic} \n                     pack={\"20\"} \n                     panelsPower={\"7,5\"} \n                     availableInverters={\"3.7 kW, 5 kW\"} \n                     availableBatteries={\"3, 6, 9, 12 kWh\"} \n \n                    />\n                <PowerPackExpansionTile\n                     title={\"PowerPack\"}\n                     subtitle={appState.i18n.powerpacks.monophasic + \"/\" + appState.i18n.powerpacks.triphasic} \n                     pack={\"40\"} \n                     panelsPower={\"15\"} \n                     availableInverters={\"8kW, 10 kW\" + \" \" + appState.i18n.powerpacks.triphasic} \n                     availableBatteries={\"6, 9, 12 kWh\"}   \n                    />\n                <PowerPackExpansionTile\n                     title={\"PowerPack\"}\n                     subtitle={appState.i18n.powerpacks.triphasic} \n                     pack={\"60\"} \n                     panelsPower={\"18\"} \n                     availableInverters={\"10 kW, 12 kW, 15 kW\" + \" \" + appState.i18n.powerpacks.triphasic } \n                     availableBatteries={\"6, 9, 12 kWh\"}   \n                    />\n                \n            </PowerPacksContainer>\n            <Link to=\"/powerpacks-carregamento-eletrico-casa\">\n                <DefaultButton label={appState.i18n.powerpacks.purchase.toUpperCase()} />\n            </Link>\n        </Container>\n    )\n}\n\n\n","import { useEffect } from \"react\";\n\nexport default function ScrollToTop({page}) {\n\n  useEffect(() => {\n    window.scrollTo(0, 0);\n  }, [page]);\n\n  return null;\n}"],"sourceRoot":""}