{"version":3,"sources":["components/Apartment/ApartmentSpecs/styles.js","components/Form/ContactFormSelectable/styles.js","components/Developer/DeveloperFormBlocks/DeveloperApartmentSelector/styles.js","components/Developer/DeveloperFormBlocks/DeveloperApartmentSelector/index.tsx","components/Form/ContactFormSelectable/index.tsx","pages/AreaListingPage/styles.js","pages/AreaListingPage/index.tsx"],"names":["Specs","styled","div","withConfig","componentId","color","props","last","media","md","_templateObject","_taggedTemplateLiteral","SpecsTitle","_templateObject2","textStyles","H3","SpecsChevron","span","isOpen","css","SpecsContent","_templateObject3","SpecItem","P","PSmall","lineHeight","_templateObject4","SpecKey","_templateObject5","SpecValue","_templateObject6","AInline","FormWrapper","attrs","className","id","boxShadow","hugeLight","ribbon","H3Condensed","FormContainer","split","FormColumns","FormColumn","grid","gutterSmall","lg","gutter","SubjectSelection","ariaRole","MicroText","concat","isActive","FormFooter","FormDisclaimer","p","_templateObject7","DeveloperApartmentSelectorWrapper","_templateObject8","ApartmentSelectorElement","ApartmentCurrentSelection","TextLinkSecondary","ApartmentSelectorRowContainer","basic","ApartmentSelectorRow","DeveloperApartmentSelector","setOpen","useState","selectedProperties","setSelectedProperties","setDeveloperProperties","setFieldValue","useEffect","pKeys","map","push","key","housingCompanyData","isEmpty","properties","React","createElement","onClick","e","stopPropagation","currentValue","length","filter","label","FaIcon","icon","property","apartmentAddress","totalArea","livingArea","toString","replace","roomTypes","type","checked","includes","onChange","newValues","splice","indexOf","htmlFor","floor","floorAmount","salesPriceUnencumbered","console","log","Formik","lazy","then","module","default","ErrorMessage","FormPlaceholder","_ref","contactFormStyle","Placeholder","PlaceholderInput","PlaceholderTextarea","Fragment","PlaceholderSelectable","PlaceholderGdpr","PlaceholderButton","width","ContactFormSelectable","_ref2","initialValues","validationSchema","contactSubmitTimeout","buttonText","children","developer","email","firstName","lastName","message","phone","propertyID","getSchema","name","postCode","isSubmitted","setSubmitted","subjectIndex","setSubjectIndex","clearTimeout","hasWindow","Suspense","fallback","onSubmit","doSubmit","values","_ref3","setSubmitting","resetForm","__awaiter","submitUrl","location","href","formData","Object","assign","Array","isArray","sort","Math","random","slice","res","contactService","doBasicContact","window","setTimeout","_ref4","handleChange","handleBlur","handleSubmit","isSubmitting","InputGroup","aria-label","disabled","onBlur","placeholder","value","component","msg","FormError","Textarea","Text","defaultValue","Link","to","target","CtaButton","text","submitting","ThankYouMessage","AreaListingHero","rgba","HeroColumns","HeroColumn","PMedium","HeroImage","AreaListingColumns","AreaListingColumn","wide","_templateObject9","AreaGroup","_templateObject10","_templateObject11","AreaList","_templateObject12","_templateObject13","Area","area","url","dangerouslySetInnerHTML","__html","filterXSS","CityListing","city","areas","i","AreaListing","page","cities","AreaListingPageContainer","connect","state","doc","document","useParallax","speed","Container","srcSet","getAssetUrl","src","alt"],"mappings":"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","file":"assets/js/pages-AreaListingPage.chunk.js?cb=bebd14d29d4f41ecfe9c","sourcesContent":["import styled, { css } from 'styled-components';\nimport { color, textStyles, lineHeight, media } from '@utils/style-utils';\n\nexport const Specs = styled.div`\n\tborder-bottom: 1px solid ${ color('grey', 5) };\n\tmargin-bottom: ${ props => props.last ? '0px !important' : '20px' };\n\twidth: 100%;\n\n\t${ media.md`\n\t\tmargin-bottom: 40px;\n\t`}\n`\n\nexport const SpecsTitle = styled.div`\n\talign-items: center;\n\tdisplay: flex;\n\tmargin-bottom: 20px;\n\n\t${ media.md`\n\t\tmargin-bottom: 40px;\n\t`}\n\n\th3 {\n\t\t${ textStyles.H3 }\n\t\tcursor: pointer;\n\t\tmargin: 0;\n\t}\n`\n\nexport const SpecsChevron = styled.span`\n\talign-items: center;\n\tcursor: pointer;\n\tdisplay: inline-flex;\n\tflex-grow: 1;\n\tfont-size: 30px;\n\tjustify-content: flex-end;\n\n\tsvg {\n\t\tdisplay: block;\n\t\tmax-width: 14px;\n\t\ttransform: rotate(0deg);\n\t}\n\n\t${ props => props.isOpen && css`\n\t\tsvg {\n\t\t\ttransform: rotate(180deg);\n\t\t}\n\t`}\n`\n\nexport const SpecsContent = styled.div`\n\tdisplay: ${ props => props.isOpen ? 'block' : 'none' };\n\tpadding-bottom: 20px;\n\n\t${ media.md`\n\t\tpadding-bottom: 40px;\n\t`}\n`\n\nexport const SpecItem = styled.div`\n\t${ textStyles.P }\n\t${ textStyles.PSmall }\n\n\tdisplay: flex;\n\tflex-direction: column;\n\tline-height: ${ lineHeight(17, 25) };\n\tmargin-bottom: 17px;\n\twidth: 100%;\n\n\t${ media.md`\n\t\tflex-direction: row;\n\t`}\n\n\t&:last-of-type {\n\t\tmargin-bottom: 0;\n\t}\n`\n\nexport const SpecKey = styled.span`\n\tflex: 1 0 100%;\n\tfont-weight: 500;\n\n\t${ media.md`\n\t\tfont-weight: normal;\n\t\tflex: 1 0 22.5%;\n\t`}\n`\n\nexport const SpecValue = styled.span`\n\tflex: 1 0 100%;\n\n\t${ media.md`\n\t\tflex: 1 0 77.5%;\n\t\tpadding-left: 32px;\n\t`}\n\n\ta {\n\t\t${ textStyles.AInline }\n\t}\n`\n","import styled, { css } from \"styled-components\";\nimport { color, media, textStyles, ribbon, boxShadow, grid } from \"@utils/style-utils\";\n\nexport const FormWrapper = styled.div.attrs(() => ({\n\tclassName: \"contact-form-selectable\",\n\tid: \"contactFormSelectable\",\n}))`\n\tbackground: ${color(\"white\")};\n\tborder: 1px solid ${color(\"grey\", 6)};\n\tborder-radius: 4px;\n\tbox-shadow: ${boxShadow.hugeLight};\n\toverflow: hidden;\n\tpadding: 50px 15px 30px;\n\tposition: relative;\n\n\t@media (min-height: 840px) and (min-width: 992px) {\n\t\tposition: sticky;\n\t\ttop: 30px;\n\t}\n\n\t&::before {\n\t\t${ribbon};\n\t\tcontent: '';\n\t\theight: 6px;\n\t\tleft: 0;\n\t\tposition: absolute;\n\t\ttop: 0;\n\t\twidth: 100%;\n\t}\n\n\t${media.md`\n\t\tpadding: 60px 32px 40px;\n\t`};\n\n\th4 {\n\t\t${textStyles.H3Condensed}\n\t\tmargin: 0 auto 24px;\n\t\ttext-align: center;\n\t}\n\n\t.placeholder-textarea {\n\t\tmargin-bottom: 28px;\n\t\tmargin-top: 16px;\n\t}\n\n\ttextarea {\n\t\tmargin-bottom: 28px;\n\t}\n\n\tbutton {\n\t\tdisplay: block;\n\t\tmax-width: 312px;\n\t\tmargin: 0 auto;\n\t\twidth: 100%;\n\t}\n\n\t.contact-form-pretext {\n\t\t${textStyles.P};\n\t}\n`;\n\nexport const FormContainer = styled.div.attrs(props => ({\n\tclassName: props.split ? \"form-container form-container-split\" : \"form-container\",\n}))`\n\tmargin: 0 auto;\n\tmax-width: 312px;\n`;\n\nexport const FormColumns = styled.div`\n\tdisplay: flex;\n\tflex-direction: column;\n\n\t${props =>\n\t\tprops.split &&\n\t\tcss`\n\t\t\t${media.md`\n\t\t\t\tflex-direction: row;\n\t\t\t\tjustify-content: space-between;\n\t\t\t`};\n\t\t`};\n`;\n\nexport const FormColumn = styled.div`\n\tflex-basis: 100%;\n\n\ttextarea {\n\t\tmargin-top: 16px;\n\t}\n\n\t${props =>\n\t\tprops.split &&\n\t\tcss`\n\t\t\t${media.md`\n\t\t\t\tflex-basis: calc((100% - ${grid.gutterSmall}px) / 2);\n\n\t\t\t\ttextarea,\n\t\t\t\t.placeholder-textarea {\n\t\t\t\t\theight: 96px;\n\t\t\t\t\tmargin-top: 0;\n\t\t\t\t}\n\t\t\t`}\n\t\t\t${media.lg`\n\t\t\t\tflex-basis: calc((100% - ${grid.gutter}px) / 2);\n\t\t\t`};\n\t\t`}\n`;\n\nexport const SubjectSelection = styled.div.attrs(() => ({\n\tariaRole: \"button\",\n}))`\n\t${textStyles.MicroText};\n\tcolor: ${color(\"grey\", 2)};\n\tcursor: pointer;\n\tmargin-bottom: 16px;\n\tpadding-left: 26px;\n\tposition: relative;\n\ttransition: color 150ms;\n\n\t&::before {\n\t\tbackground-color: ${color(\"white\")};\n\t\tbackground-image: ${`radial-gradient(circle 8px at 50%, ${color(\"greenBright\", 1)} 50%, transparent 50%)`};\n\t\tbackground-position: 50% 50%;\n\t\tbackground-repeat: no-repeat;\n\t\tbackground-size: 0px;\n\t\tborder: 1px solid ${color(\"grey\", 5)};\n\t\tborder-radius: 50%;\n\t\tcontent: \"\";\n\t\tdisplay: inline-block;\n\t\theight: 16px;\n\t\tleft: 0;\n\t\tposition: absolute;\n\t\ttop: 2px;\n\t\ttransition: background-color 150ms, background-size 150ms, border-color 150ms;\n\t\twidth: 16px;\n\t}\n\n\t&:hover {\n\t\tcolor: ${color(\"grey\", 1)};\n\n\t\t&::before {\n\t\t\tbackground-color: ${color(\"greenBright\", 4)};\n\t\t}\n\t}\n\n\t&[disabled] {\n\t\topacity: 0.7;\n\t\tpointer-events: none;\n\t}\n\n\t${props =>\n\t\tprops.isActive &&\n\t\tcss`\n\t\t\t&::before {\n\t\t\t\tbackground-color: ${color(\"greenBright\", 4)};\n\t\t\t\tbackground-size: 8px;\n\t\t\t\tborder-color: ${color(\"greenBright\", 1)};\n\t\t\t}\n\t\t`};\n`;\n\nexport const FormFooter = styled.div.attrs(() => ({\n\tclassName: \"form-footer\",\n}))`\n\t.form-container-split & {\n\t\tdisplay: flex;\n\t\tflex-direction: column;\n\n\t\t${media.md`\n\t\t\tflex-direction: row;\n\t\t\tjustify-content: space-between;\n\t\t\tpadding-top: 10px;\n\n\t\t\tbutton {\n\t\t\t\tmargin-right: 0;\n\t\t\t\tmax-height: 48px;\n\t\t\t\tmax-width: 193px;\n\t\t\t}\n\t\t`};\n\t}\n`;\n\nexport const FormDisclaimer = styled.p`\n\t${textStyles.MicroText};\n\tcolor: ${color(\"grey\", 3)};\n\tletter-spacing: normal;\n\tmargin: 20px 0;\n\tmax-width: 361px;\n\ttext-align: center;\n\n\t.form-container-split & {\n\t\t${media.md`\n\t\t\tmargin-bottom: 0;\n\t\t\tmargin-top: 0;\n\t\t\ttext-align: left;\n\t\t`};\n\t}\n\n\ta {\n\t\tcolor: ${color(\"greenDark\", 1)};\n\t\tdisplay: block;\n\t\ttext-align: center;\n\t\ttext-decoration: none;\n\n\t\t.form-container-split & {\n\t\t\tmargin-top: 5px;\n\n\t\t\t${media.md`\n\t\t\t\tdisplay: inline;\n\t\t\t\tmargin-top: 0;\n\t\t\t\ttext-align: left;\n\t\t\t`};\n\t\t}\n\n\t\t&:hover {\n\t\t\tcolor: ${color(\"greenDark\", 2)};\n\t\t\ttext-decoration: underline;\n\t\t}\n\t}\n`;\n\nexport const DeveloperApartmentSelectorWrapper = styled.div`\n\tmargin-top: 16px;\n\n\t${media.md`\n\t\tmargin-bottom: 16px;\n\t\tmargin-top: 0;\n\t`};\n`;\n","import styled from \"styled-components\";\nimport { boxShadow, color, textStyles } from \"@utils/style-utils\";\n\nexport const ApartmentSelectorElement = styled.div`\n\tposition: relative;\n`;\n\nexport const ApartmentCurrentSelection = styled.div`\n\t${textStyles.TextLinkSecondary};\n\tborder-radius: 4px;\n\tborder: 1px solid ${color(\"grey\", 5)};\n\tpadding: 11px 16px 8px 16px;\n\tdisplay: flex;\n\n\tspan {\n\t\tcolor: ${color(\"grey\", 1)};\n\t\tcursor: pointer;\n\t\t&::selection {\n\t\t\tbackground: transparent;\n\t\t}\n\t}\n\n\t.apartment-selector-chevron {\n\t\tfont-size: 14px;\n\t\tline-height: 14px;\n\t\tcolor: ${color(\"greenBright\", 1)};\n\t}\n`;\n\nexport const ApartmentSelectorRowContainer = styled.div`\n\tposition: absolute;\n\ttop: 55px;\n\tleft: 0;\n\twidth: 100%;\n\tbackground: ${color(\"white\")};\n\tborder-radius: 4px;\n\tborder: 1px solid ${color(\"grey\", 5)};\n\tbox-shadow: ${boxShadow.basic};\n\tmax-height: 300px;\n\toverflow-y: auto;\n\tz-index: 20;\n\tpadding: 23px 8px;\n`;\n\nexport const ApartmentSelectorRow = styled.div`\n\tdisplay: block;\n\n\tinput[type=\"checkbox\"] {\n\t\tdisplay: none;\n\n\t\t&:checked ~ label {\n\t\t\t.box {\n\t\t\t\tbackground: ${ color('greenBright', 4) };\n\t\t\t\tborder-color: ${ color('greenBright', 1) };\n\n\t\t\t\ti {\n\t\t\t\t\tdisplay: block;\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n\n\tlabel {\n\t\talign-items: flex-start;\n\t\tcolor: ${ color('grey', 2) };\n\t\tcursor: pointer;\n\t\tdisplay: flex;\n\t\tfont-size: 17px;\n\t\tline-height: 120%;\n\t\tmargin-bottom: 8px;\n\t\tpadding-top: 8px;\n\t\tborder-radius: 4px;\n\t\ttransition: color 150ms;\n\t\tuser-select: none;\n\n\t\t&:hover:not(:checked) {\n\t\t\t.box {\n\t\t\t\tbackground-color: ${ color('grey', 7) };\n\t\t\t}\n\t\t}\n\n\t\t.box {\n\t\t\tbackground: ${ color('white') };\n\t\t\tborder: 1px solid ${ color('grey', 5) };\n\t\t\tborder-radius: 2px;\n\t\t\tcolor: ${ color('greenBright', 1) };\n\t\t\tcursor: pointer;\n\t\t\tfont-size: 10px;\n\t\t\tdisplay: inline-block;\n\t\t\theight: 16px;\n\t\t\tmargin: -1px 12px 0;\n\t\t\tposition: relative;\n\t\t\ttransition: background-color 150ms, border-color 150ms;\n\t\t\twidth: 16px;\n\t\t\tmin-width: 16px;\n\n\t\t\ti {\n\t\t\t\tdisplay: none;\n\t\t\t\tleft: 0;\n\t\t\t\tposition: absolute;\n\t\t\t\tright: 0;\n\t\t\t\ttext-align: center;\n\t\t\t\ttop: 50%;\n\t\t\t\ttransform: translateY(-50%);\n\t\t\t}\n\t\t}\n\t\t.label-text {\n\t\t\tpadding: 0;\n\t\t\tmargin: -5px 0 0 0;\n\t\t\tfont-weight: normal; // required for admin, defaults to bold\n\t\t\tP {\n\t\t\t\tpadding: 0;\n\t\t\t\tmargin: 0;\n\t\t\t}\n\t\t}\n\t}\n\n\t.apartment-selector-row__first {\n\t\tmax-height: 52px;\n\t\toverflow: hidden;\n\t}\n\n\t.apartment-selector-row__second {\n\t\t${textStyles.MicroText};\n\t\tcolor: ${color(\"grey\", 2)};\n\t\tmargin: -8px 0 5px 40px;\n\t}\n`;\n","import React, { useEffect, useState } from \"react\";\nimport isEmpty from \"lodash-es/isEmpty\";\nimport {\n\tApartmentCurrentSelection,\n\tApartmentSelectorElement,\n\tApartmentSelectorRow,\n\tApartmentSelectorRowContainer\n} from \"./styles\";\nimport { FontAwesomeIcon as FaIcon } from \"@fortawesome/react-fontawesome\";\nimport { SpecsChevron } from \"@components/Apartment/ApartmentSpecs/styles\";\n\nconst DeveloperApartmentSelector = (props: any) => {\n\n\tconst [isOpen, setOpen] = useState(false);\n\tconst [selectedProperties, setSelectedProperties] = useState([]);\n\tconst { setDeveloperProperties, setFieldValue } = props;\n\n\tuseEffect(() => {\n\t\tif (setDeveloperProperties && typeof(setDeveloperProperties) === 'function') {\n\t\t\tsetDeveloperProperties(selectedProperties);\n\t\t}\n\t\tif (setFieldValue && typeof(setFieldValue) === 'function') {\n\t\t\tlet pKeys = [];\n\t\t\tselectedProperties.map((p) => {\n\t\t\t\tpKeys.push(p.key);\n\t\t\t});\n\t\t\tsetFieldValue(\"propertyID\", pKeys);\n\t\t}\n\t}, [selectedProperties]);\n\n\ttry {\n\t\tconst { housingCompanyData } = props || { housingCompanyData: {} };\n\t\tif (isEmpty(housingCompanyData)) return null;\n\n\t\tconst { properties } = housingCompanyData;\n\t\tif (isEmpty(properties)) return null;\n\n\t\treturn <ApartmentSelectorElement>\n\t\t\t<ApartmentCurrentSelection\n\t\t\t\tonClick={(e) => {\n\t\t\t\t\te.stopPropagation();\n\t\t\t\t\tsetOpen((currentValue) => {\n\t\t\t\t\t\treturn !currentValue;\n\t\t\t\t\t});\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\t{selectedProperties.length === 0 && <span>Valitse asunto</span>}\n\t\t\t\t{selectedProperties.length === 1 && <span>{selectedProperties.filter(() => {return true})[0].label}</span>}\n\t\t\t\t{selectedProperties.length > 1 && <span>Valitut asunnot ({selectedProperties.length})</span>}\n\t\t\t\t<SpecsChevron className=\"apartment-selector-chevron\" isOpen={isOpen}>\n\t\t\t\t\t<FaIcon icon={[\"far\", \"angle-down\"]} />\n\t\t\t\t</SpecsChevron>\n\t\t\t</ApartmentCurrentSelection>\n\t\t\t{isOpen && <ApartmentSelectorRowContainer>\n\t\t\t\t{properties.map((property) => {\n\t\t\t\t\tproperty.label = (property.apartmentAddress || property.key) + \" \" + (property.totalArea || property.livingArea || '').toString().replace('.', ',') + \" m² \" + (property.roomTypes || '');\n\t\t\t\t\treturn <ApartmentSelectorRow key={property.key}>\n\t\t\t\t\t\t<div className=\"apartment-selector-row__first\">\n\t\t\t\t\t\t\t<input\n\t\t\t\t\t\t\t\tid={\"property-select-\" + property.key}\n\t\t\t\t\t\t\t\ttype=\"checkbox\"\n\t\t\t\t\t\t\t\tchecked={selectedProperties.includes(property)}\n\t\t\t\t\t\t\t\tonChange={(e) => {\n\t\t\t\t\t\t\t\t\te.stopPropagation();\n\t\t\t\t\t\t\t\t\tsetSelectedProperties((currentValue) => {\n\t\t\t\t\t\t\t\t\t\tlet newValues = [...currentValue];\n\t\t\t\t\t\t\t\t\t\tif (currentValue.includes(property)) {\n\t\t\t\t\t\t\t\t\t\t\tnewValues.splice(currentValue.indexOf(property), 1);\n\t\t\t\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\t\t\t\tnewValues.push(property);\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\treturn newValues;\n\t\t\t\t\t\t\t\t\t});\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t<label htmlFor={\"property-select-\" + property.key}>\n\t\t\t\t\t\t\t\t<span className=\"box\">\n\t\t\t\t\t\t\t\t\t<i><FaIcon icon=\"check\"/></i>\n\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t<span className=\"label-text\">{property.label}</span>\n\t\t\t\t\t\t\t</label>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t<div className=\"apartment-selector-row__second\">{(property.floor || '').toString().length > 1 ? \"Kerros \" + property.floor + \"/\" + (property.floorAmount || property.floor) + \", \" : \"\"}{(property.salesPriceUnencumbered && property.salesPriceUnencumbered.toString().length > 0) ? property.salesPriceUnencumbered.toString().replace(/\\B(?=(\\d{3})+(?!\\d))/g, \" \").replace('.', ',') + \" €\" : \"\"}</div>\n\t\t\t\t\t</ApartmentSelectorRow>\n\t\t\t\t})}\n\t\t\t</ApartmentSelectorRowContainer>}\n\t\t</ApartmentSelectorElement>;\n\t} catch (e) {\n\t\tconsole.log(e);\n\t\treturn null;\n\t}\n};\n\nexport default DeveloperApartmentSelector;\n","import React, { lazy, Suspense, useState, useEffect } from \"react\";\nimport {\n\tInputGroup,\n\tFormError,\n\tTextarea,\n\tThankYouMessage,\n\tPlaceholder,\n\tPlaceholderButton,\n\tPlaceholderGdpr,\n\tPlaceholderInput,\n\tPlaceholderTextarea,\n\tPlaceholderSelectable,\n} from \"@components/Form/form-styles\";\nimport contactService from \"@services/contact.service\";\nimport { hasWindow } from \"@utils\";\nimport { getSchema } from \"@utils/validators\";\nimport CtaButton from \"@components/Buttons/CtaButton\";\nimport { Link } from \"react-router-dom\";\nimport { FontAwesomeIcon as FaIcon } from \"@fortawesome/react-fontawesome\";\nimport Text from \"wake-react-components/text\";\nimport {\n\tFormWrapper,\n\tFormContainer,\n\tSubjectSelection,\n\tFormDisclaimer,\n\tFormColumns,\n\tFormColumn,\n\tFormFooter, DeveloperApartmentSelectorWrapper,\n} from \"./styles\";\nimport DeveloperApartmentSelector from \"@components/Developer/DeveloperFormBlocks/DeveloperApartmentSelector\";\n\nconst Formik = lazy(() => import(/* webpackPrefetch:true */ \"formik\").then(module => ({ default: module.Formik })));\nconst ErrorMessage = lazy(() =>\n\timport(/* webpackPrefetch:true */ \"formik\").then(module => ({ default: module.ErrorMessage }))\n);\n\nconst FormPlaceholder = ({ split = false, contactFormStyle = \"old\" }) => {\n\treturn (\n\t\t<Placeholder className=\"form-placeholder\">\n\t\t\t<FormColumns split={split}>\n\t\t\t\t<FormColumn split={split}>\n\t\t\t\t\t<PlaceholderInput />\n\t\t\t\t\t<PlaceholderInput />\n\t\t\t\t\t<PlaceholderInput />\n\t\t\t\t\t<PlaceholderInput />\n\t\t\t\t</FormColumn>\n\t\t\t\t<FormColumn split={split}>\n\t\t\t\t\t{contactFormStyle === \"new\" && <PlaceholderInput />}\n\t\t\t\t\t<PlaceholderTextarea />\n\t\t\t\t\t{contactFormStyle !== \"new\" && <>\n\t\t\t\t\t\t<PlaceholderSelectable isActive={true} />\n\t\t\t\t\t\t<PlaceholderSelectable />\n\t\t\t\t\t\t<PlaceholderSelectable />\n\t\t\t\t\t</>}\n\t\t\t\t</FormColumn>\n\t\t\t</FormColumns>\n\n\t\t\t<PlaceholderGdpr />\n\t\t\t<PlaceholderButton width=\"100%\" />\n\t\t</Placeholder>\n\t);\n};\n\nconst ContactFormSelectable = ({ buttonText = \"Lähetä\", split = false, children = null, developer = null, housingCompanyData = null, contactFormStyle = \"old\" }) => {\n\tlet initialValues, validationSchema;\n\tif (contactFormStyle === \"new\") {\n\t\tinitialValues = {\n\t\t\temail: \"\",\n\t\t\tfirstName: \"\",\n\t\t\tlastName: \"\",\n\t\t\tmessage: \"\",\n\t\t\tphone: \"\",\n\t\t\tpropertyID: [],\n\t\t};\n\t\tvalidationSchema = getSchema([\"firstName\", \"lastName\", \"email\", \"phone\", \"message\", \"propertyID\"]);\n\t} else {\n\t\tinitialValues = {\n\t\t\temail: \"\",\n\t\t\tmessage: \"\",\n\t\t\tname: \"\",\n\t\t\tphone: \"\",\n\t\t\tpostCode: \"\",\n\t\t};\n\t\tvalidationSchema = getSchema([\"name\", \"email\", \"phone\", \"postCode\", \"message\"]);\n\t}\n\n\tlet contactSubmitTimeout: number;\n\tconst [isSubmitted, setSubmitted] = useState(false);\n\tconst [subjectIndex, setSubjectIndex] = useState(contactFormStyle === \"new\" ? 4 : 1);\n\n\tconst doSubmit = async (values, { setSubmitting, resetForm }) => {\n\t\tsetSubmitting(true);\n\n\t\tconst submitUrl = location.href;\n\n\t\tconst formData = {\n\t\t\tsubjectIndex,\n\t\t\tsubmitUrl,\n\t\t\t...values,\n\t\t};\n\n\t\tif (developer) {\n\t\t\tformData.developer = developer;\n\t\t\tif (formData.propertyID && Array.isArray(formData.propertyID)) {\n\t\t\t\tformData.property = formData.propertyID.sort(() => Math.random() - Math.random()).slice(0, 1)[0];\n\t\t\t}\n\t\t}\n\n\t\ttry {\n\t\t\tconst res = await contactService.doBasicContact(formData);\n\t\t\tconsole.log(\"successful form submit\", res);\n\t\t\tsetSubmitting(false);\n\t\t\tsetSubmitted(true);\n\n\t\t\tif (hasWindow) {\n\t\t\t\tcontactSubmitTimeout = window.setTimeout(() => {\n\t\t\t\t\tsetSubmitted(false);\n\t\t\t\t\tresetForm(initialValues);\n\t\t\t\t}, 6000);\n\t\t\t}\n\t\t} catch (e) {\n\t\t\tconsole.log(\"error while sending form..\", e);\n\t\t\tsetSubmitting(false);\n\t\t\tsetSubmitted(false);\n\t\t\tthrow e;\n\t\t}\n\t};\n\n\tuseEffect(() => {\n\t\treturn () => {\n\t\t\t/* clear the reset timeout before component unmounts */\n\t\t\tif (contactSubmitTimeout) {\n\t\t\t\tclearTimeout(contactSubmitTimeout);\n\t\t\t}\n\t\t};\n\t}, []);\n\n\treturn (\n\t\t<FormWrapper>\n\t\t\t<FormContainer split={split}>\n\t\t\t\t<h4>Ota yhteyttä</h4>\n\t\t\t\t{children && <div className=\"form-children\">{children}</div>}\n\t\t\t\t{!hasWindow && <FormPlaceholder split={split} />}\n\t\t\t\t{hasWindow && (\n\t\t\t\t\t<Suspense fallback={<FormPlaceholder split={split} contactFormStyle={contactFormStyle} />}>\n\t\t\t\t\t\t<Formik initialValues={initialValues} onSubmit={doSubmit} validationSchema={validationSchema}>\n\t\t\t\t\t\t\t{({ values, handleChange, handleBlur, handleSubmit, isSubmitting, setFieldValue }) => (\n\t\t\t\t\t\t\t\t<form onSubmit={handleSubmit} className={isSubmitting ? \"submitting\" : \"\"}>\n\t\t\t\t\t\t\t\t\t<FormColumns split={split}>\n\t\t\t\t\t\t\t\t\t\t<FormColumn split={split}>\n\t\t\t\t\t\t\t\t\t\t\t<InputGroup>\n\t\t\t\t\t\t\t\t\t\t\t\t<input\n\t\t\t\t\t\t\t\t\t\t\t\t\taria-label={contactFormStyle === \"new\" ? \"Etunimi\": \"Nimi\"}\n\t\t\t\t\t\t\t\t\t\t\t\t\tdisabled={isSubmitted || isSubmitting}\n\t\t\t\t\t\t\t\t\t\t\t\t\tname={contactFormStyle === \"new\" ? \"firstName\" : \"name\"}\n\t\t\t\t\t\t\t\t\t\t\t\t\tonBlur={handleBlur}\n\t\t\t\t\t\t\t\t\t\t\t\t\tonChange={handleChange}\n\t\t\t\t\t\t\t\t\t\t\t\t\tplaceholder={contactFormStyle === \"new\" ? \"Etunimi\" : \"Nimi\"}\n\t\t\t\t\t\t\t\t\t\t\t\t\ttype=\"text\"\n\t\t\t\t\t\t\t\t\t\t\t\t\tvalue={contactFormStyle === \"new\" ? values[\"firstName\"] : values[\"name\"]}\n\t\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t\t\t<FaIcon icon=\"user\" />\n\t\t\t\t\t\t\t\t\t\t\t\t<ErrorMessage component=\"p\" name={contactFormStyle === \"new\" ? \"firstName\" : \"name\"}>\n\t\t\t\t\t\t\t\t\t\t\t\t\t{msg => <FormError>{msg}</FormError>}\n\t\t\t\t\t\t\t\t\t\t\t\t</ErrorMessage>\n\t\t\t\t\t\t\t\t\t\t\t</InputGroup>\n\t\t\t\t\t\t\t\t\t\t\t{contactFormStyle === \"new\" && <InputGroup>\n\t\t\t\t\t\t\t\t\t\t\t\t<input\n\t\t\t\t\t\t\t\t\t\t\t\t\taria-label=\"Sukunimi\"\n\t\t\t\t\t\t\t\t\t\t\t\t\tdisabled={isSubmitted || isSubmitting}\n\t\t\t\t\t\t\t\t\t\t\t\t\tname=\"lastName\"\n\t\t\t\t\t\t\t\t\t\t\t\t\tonBlur={handleBlur}\n\t\t\t\t\t\t\t\t\t\t\t\t\tonChange={handleChange}\n\t\t\t\t\t\t\t\t\t\t\t\t\tplaceholder=\"Sukunimi\"\n\t\t\t\t\t\t\t\t\t\t\t\t\ttype=\"text\"\n\t\t\t\t\t\t\t\t\t\t\t\t\tvalue={values[\"lastName\"]}\n\t\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t\t\t<FaIcon icon=\"user\" />\n\t\t\t\t\t\t\t\t\t\t\t\t<ErrorMessage component=\"p\" name=\"lastName\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t{msg => <FormError>{msg}</FormError>}\n\t\t\t\t\t\t\t\t\t\t\t\t</ErrorMessage>\n\t\t\t\t\t\t\t\t\t\t\t</InputGroup>}\n\t\t\t\t\t\t\t\t\t\t\t<InputGroup>\n\t\t\t\t\t\t\t\t\t\t\t\t<input\n\t\t\t\t\t\t\t\t\t\t\t\t\taria-label=\"Puhelinnumero\"\n\t\t\t\t\t\t\t\t\t\t\t\t\tdisabled={isSubmitted || isSubmitting}\n\t\t\t\t\t\t\t\t\t\t\t\t\tname=\"phone\"\n\t\t\t\t\t\t\t\t\t\t\t\t\tonBlur={handleBlur}\n\t\t\t\t\t\t\t\t\t\t\t\t\tonChange={handleChange}\n\t\t\t\t\t\t\t\t\t\t\t\t\tplaceholder=\"Puhelinnumero\"\n\t\t\t\t\t\t\t\t\t\t\t\t\ttype=\"tel\"\n\t\t\t\t\t\t\t\t\t\t\t\t\tvalue={values[\"phone\"]}\n\t\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t\t\t<FaIcon icon=\"phone\" />\n\t\t\t\t\t\t\t\t\t\t\t\t<ErrorMessage component=\"p\" name=\"phone\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t{msg => <FormError>{msg}</FormError>}\n\t\t\t\t\t\t\t\t\t\t\t\t</ErrorMessage>\n\t\t\t\t\t\t\t\t\t\t\t</InputGroup>\n\t\t\t\t\t\t\t\t\t\t\t<InputGroup>\n\t\t\t\t\t\t\t\t\t\t\t\t<input\n\t\t\t\t\t\t\t\t\t\t\t\t\taria-label=\"Sähköpostiosoite\"\n\t\t\t\t\t\t\t\t\t\t\t\t\tdisabled={isSubmitted || isSubmitting}\n\t\t\t\t\t\t\t\t\t\t\t\t\tname=\"email\"\n\t\t\t\t\t\t\t\t\t\t\t\t\tonBlur={handleBlur}\n\t\t\t\t\t\t\t\t\t\t\t\t\tonChange={handleChange}\n\t\t\t\t\t\t\t\t\t\t\t\t\tplaceholder=\"Sähköposti\"\n\t\t\t\t\t\t\t\t\t\t\t\t\ttype=\"email\"\n\t\t\t\t\t\t\t\t\t\t\t\t\tvalue={values[\"email\"]}\n\t\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t\t\t<FaIcon icon=\"envelope\" />\n\t\t\t\t\t\t\t\t\t\t\t\t<ErrorMessage component=\"p\" name=\"email\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t{msg => <FormError>{msg}</FormError>}\n\t\t\t\t\t\t\t\t\t\t\t\t</ErrorMessage>\n\t\t\t\t\t\t\t\t\t\t\t</InputGroup>\n\n\t\t\t\t\t\t\t\t\t\t\t{contactFormStyle !== \"new\" && <InputGroup>\n\t\t\t\t\t\t\t\t\t\t\t\t<input\n\t\t\t\t\t\t\t\t\t\t\t\t\taria-label=\"Postinumero\"\n\t\t\t\t\t\t\t\t\t\t\t\t\tdisabled={isSubmitted || isSubmitting}\n\t\t\t\t\t\t\t\t\t\t\t\t\tname=\"postCode\"\n\t\t\t\t\t\t\t\t\t\t\t\t\tonBlur={handleBlur}\n\t\t\t\t\t\t\t\t\t\t\t\t\tonChange={handleChange}\n\t\t\t\t\t\t\t\t\t\t\t\t\tplaceholder=\"Postinumero\"\n\t\t\t\t\t\t\t\t\t\t\t\t\tvalue={values[\"postCode\"]}\n\t\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t\t\t<FaIcon icon=\"map-marker-alt\" />\n\t\t\t\t\t\t\t\t\t\t\t\t<ErrorMessage component=\"p\" name=\"postCode\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t{msg => <FormError>{msg}</FormError>}\n\t\t\t\t\t\t\t\t\t\t\t\t</ErrorMessage>\n\t\t\t\t\t\t\t\t\t\t\t</InputGroup>}\n\t\t\t\t\t\t\t\t\t\t</FormColumn>\n\t\t\t\t\t\t\t\t\t\t<FormColumn split={split}>\n\t\t\t\t\t\t\t\t\t\t\t{!!(contactFormStyle === \"new\" && developer) && <DeveloperApartmentSelectorWrapper>\n\t\t\t\t\t\t\t\t\t\t\t\t<DeveloperApartmentSelector setFieldValue={setFieldValue} housingCompanyData={housingCompanyData} />\n\t\t\t\t\t\t\t\t\t\t\t\t<ErrorMessage component=\"p\" name=\"propertyID\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t{msg => <FormError>{msg}</FormError>}\n\t\t\t\t\t\t\t\t\t\t\t\t</ErrorMessage>\n\t\t\t\t\t\t\t\t\t\t\t</DeveloperApartmentSelectorWrapper>}\n\n\t\t\t\t\t\t\t\t\t\t\t<Textarea\n\t\t\t\t\t\t\t\t\t\t\t\taria-label=\"Viesti\"\n\t\t\t\t\t\t\t\t\t\t\t\tdisabled={isSubmitted || isSubmitting}\n\t\t\t\t\t\t\t\t\t\t\t\tid=\"message\"\n\t\t\t\t\t\t\t\t\t\t\t\tname=\"message\"\n\t\t\t\t\t\t\t\t\t\t\t\tonBlur={handleBlur}\n\t\t\t\t\t\t\t\t\t\t\t\tonChange={handleChange}\n\t\t\t\t\t\t\t\t\t\t\t\tplaceholder=\"Viestisi\"\n\t\t\t\t\t\t\t\t\t\t\t\tvalue={values[\"message\"]}\n\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t\t<ErrorMessage component=\"p\" name=\"message\">\n\t\t\t\t\t\t\t\t\t\t\t\t{msg => <FormError>{msg}</FormError>}\n\t\t\t\t\t\t\t\t\t\t\t</ErrorMessage>\n\n\t\t\t\t\t\t\t\t\t\t\t{!!(!developer || contactFormStyle === \"old\") && <>\n\t\t\t\t\t\t\t\t\t\t\t\t<SubjectSelection\n\t\t\t\t\t\t\t\t\t\t\t\t\tdisabled={isSubmitted || isSubmitting}\n\t\t\t\t\t\t\t\t\t\t\t\t\tisActive={subjectIndex === 1}\n\t\t\t\t\t\t\t\t\t\t\t\t\tonClick={() => setSubjectIndex(1)}\n\t\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t\tHaluan keskustella asuntoasioista yleisesti\n\t\t\t\t\t\t\t\t\t\t\t\t</SubjectSelection>\n\t\t\t\t\t\t\t\t\t\t\t\t<SubjectSelection\n\t\t\t\t\t\t\t\t\t\t\t\t\tdisabled={isSubmitted || isSubmitting}\n\t\t\t\t\t\t\t\t\t\t\t\t\tisActive={subjectIndex === 0}\n\t\t\t\t\t\t\t\t\t\t\t\t\tonClick={() => setSubjectIndex(0)}\n\t\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t\tHaluan lisätietoja tai esittelyn asunnosta\n\t\t\t\t\t\t\t\t\t\t\t\t</SubjectSelection>\n\t\t\t\t\t\t\t\t\t\t\t\t<SubjectSelection\n\t\t\t\t\t\t\t\t\t\t\t\t\tdisabled={isSubmitted || isSubmitting}\n\t\t\t\t\t\t\t\t\t\t\t\t\tisActive={subjectIndex === 2}\n\t\t\t\t\t\t\t\t\t\t\t\t\tonClick={() => setSubjectIndex(2)}\n\t\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t\tHaluan perustellun hinta-arvion asunnostani Kotikäynnillä\n\t\t\t\t\t\t\t\t\t\t\t\t</SubjectSelection>\n\t\t\t\t\t\t\t\t\t\t\t</>}\n\t\t\t\t\t\t\t\t\t\t</FormColumn>\n\t\t\t\t\t\t\t\t\t</FormColumns>\n\n\t\t\t\t\t\t\t\t\t{!isSubmitted && (\n\t\t\t\t\t\t\t\t\t\t<FormFooter>\n\t\t\t\t\t\t\t\t\t\t\t<FormDisclaimer className={contactFormStyle ? \"new\" : \"\"}>\n\t\t\t\t\t\t\t\t\t\t\t\t{contactFormStyle === \"new\" && <>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<Text\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tname=\"formFooterText\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tdefaultValue=\"Välitämme varauspyynnön myymäläämme.\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<br />\n\t\t\t\t\t\t\t\t\t\t\t\t</>}\n\t\t\t\t\t\t\t\t\t\t\t\t{contactFormStyle !== \"new\" && <>\n\t\t\t\t\t\t\t\t\t\t\t\tVälitämme yhteydenottopyynnön postinumeron perusteella lähimpään\n\t\t\t\t\t\t\t\t\t\t\t\tmyymäläämme.&nbsp;</>}\n\t\t\t\t\t\t\t\t\t\t\t\t<Link to=\"/tietosuoja\" target=\"_blank\">\n\t\t\t\t\t\t\t\t\t\t\t\t\tTietosuojaseloste\n\t\t\t\t\t\t\t\t\t\t\t\t</Link>\n\t\t\t\t\t\t\t\t\t\t\t</FormDisclaimer>\n\t\t\t\t\t\t\t\t\t\t\t<CtaButton\n\t\t\t\t\t\t\t\t\t\t\t\ttext={buttonText}\n\t\t\t\t\t\t\t\t\t\t\t\ttype=\"submit\"\n\t\t\t\t\t\t\t\t\t\t\t\tdisabled={isSubmitting}\n\t\t\t\t\t\t\t\t\t\t\t\tsubmitting={isSubmitting}\n\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t</FormFooter>\n\t\t\t\t\t\t\t\t\t)}\n\n\t\t\t\t\t\t\t\t\t{isSubmitted && (\n\t\t\t\t\t\t\t\t\t\t<ThankYouMessage>\n\t\t\t\t\t\t\t\t\t\t\t<span>\n\t\t\t\t\t\t\t\t\t\t\t\t<FaIcon icon=\"stars\" />\n\t\t\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t\t\t\tKiitos { contactFormStyle == \"new\" ? \"varauspyynnöstä\" : \"yhteydenotosta\"}!\n\t\t\t\t\t\t\t\t\t\t</ThankYouMessage>\n\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t</form>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t</Formik>\n\t\t\t\t\t</Suspense>\n\t\t\t\t)}\n\t\t\t</FormContainer>\n\t\t</FormWrapper>\n\t);\n};\n\nexport default ContactFormSelectable;\n","import styled, { css } from \"styled-components\";\nimport { color, media, textStyles } from \"@utils/style-utils\";\nimport { rgba } from \"polished\";\n\nexport const AreaListingHero = styled.div`\n\tbackground: ${rgba(color(\"blue\", 4), 0.5)};\n\tpadding: 80px 0 0;\n\tmargin-bottom: 85px;\n\n\t${media.md`\n\t\tpadding: 100px 0 0;\n\t\tmargin-bottom: 120px;\n\t`}\n\n\t${media.lg`\n\t\tpadding: 150px 0 0;\n\t\tmargin-bottom: 150px;\n\t`}\n`;\n\nexport const HeroColumns = styled.div`\n\tmargin: auto;\n\tmax-width: 768px;\n\tposition: relative;\n\n\t${media.lg`\n\t\talign-items: flex-start;\n\t\tdisplay: flex;\n\t\tmax-width: 100%;\n\t\ttop: 40px\n\t\twidth: 100%;\n\t`}\n`;\n\nexport const HeroColumn = styled.div`\n\tmargin-bottom: 30px;\n\n\t${media.lg`\n\t\tdisplay: flex;\n\t\tflex-basis: 50%;\n\t\tflex-direction: column;\n\t\tmargin-bottom: 0;\n\n\t\t&:first-of-type {\n\t\t\tpadding-right: 40px;\n\n\t\t\t> * {\n\t\t\t\tmax-width: 545px;\n\t\t\t}\n\t\t}\n\t`}\n\n\th1 {\n\t\tmargin-top: -7px;\n\t}\n\n\tp {\n\t\t${textStyles.PMedium}\n\t}\n`;\n\nexport const HeroImage = styled.div`\n\theight: 0;\n\toverflow: hidden;\n\tpadding-bottom: 66.76%;\n\tposition: relative;\n\twidth: 100%;\n\n\t${media.lg`\n\t\tpadding-bottom: 48%;\n\t`}\n\n\tpicture {\n\t\tdisplay: block;\n\t\tposition: absolute;\n\n\t\t&:first-of-type {\n\t\t\tleft: 0;\n\t\t\twidth: 84.8%;\n\t\t\tz-index: 1;\n\t\t}\n\n\t\t&:last-of-type {\n\t\t\tright: 0;\n\t\t\ttop: 18.34%;\n\t\t\twidth: 35.56%;\n\t\t\tz-index: 2;\n\t\t}\n\n\t\t${media.lg`\n\t\t\ttop: 0;\n\n\t\t\t&:first-of-type {\n\t\t\t\twidth: 71.69%;\n\t\t\t}\n\n\t\t\t&:last-of-type {\n\t\t\t\ttop: 0;\n\t\t\t\twidth: calc(28.31% - 20px);\n\t\t\t}\n\t\t`}\n\t}\n\n\timg {\n\t\tdisplay: block;\n\t\twidth: 100%;\n\t}\n`;\n\nexport const AreaListingColumns = styled.div`\n\t${media.lg`\n\t\tdisplay: flex;\n\t\tjustify-content: space-between;\n\t`}\n`;\n\n// prettier-ignore\nexport const AreaListingColumn = styled.div`\n\t${props => props.wide ? css`\n\t\t${media.lg`\n\t\t\twidth: calc(896 / 1364 * 100%);\n\t\t`}\n\t` : css`\n\t\t${media.lg`\n\t\t\tpadding-left: 40px;\n\t\t\twidth: calc(468 / 1364 * 100%);\n\t\t`}\n\t`}\n`\n// prettier-ignore-end\n\nexport const AreaGroup = styled.div`\n\t&:first-of-type,\n\th2 {\n\t\tborder-bottom: 1px solid ${color(\"grey\", 5)};\n\t\tmargin-bottom: 40px;\n\n\t\t${media.md`\n\t\t\tmargin-bottom: 60px;\n\t\t`}\n\n\t\t${media.lg`\n\t\t\tmargin-bottom: 80px;\n\t\t`}\n\t}\n\th2 {\n\t\tborder-bottom: 0;\n\t}\n`;\n\nexport const AreaList = styled.div`\n\tmargin-bottom: 40px;\n\n\t${media.md`\n\t\tmargin-bottom: 60px;\n\t`}\n\n\t${media.lg`\n\t\tmargin-bottom: 80px;\n\t`}\n\n\ta {\n\t\tcolor: ${color(\"grey\", 1)};\n\t\tdisplay: inline-block;\n\t\tmargin-right: 10px;\n\t\tmargin-bottom: 5px;\n\t\tpadding: 3px 0;\n\t\ttext-decoration: none;\n\t\ttransition: color 150ms;\n\n\t\t&:hover {\n\t\t\tcolor: ${color(\"greenBright\", 1)};\n\t\t}\n\t}\n`;\n","import React, { Fragment, useEffect } from \"react\";\nimport { IDocument } from \"@redux/document\";\nimport { IApplicationState } from \"@redux\";\nimport { connect } from \"react-redux\";\nimport { Container } from \"@components/Grid\";\nimport { Link } from \"react-router-dom\";\nimport { getAssetUrl } from \"@utils/index\";\nimport {\n\tAreaListingHero,\n\tHeroColumns,\n\tHeroColumn,\n\tHeroImage,\n\tAreaListingColumns,\n\tAreaListingColumn,\n\tAreaList,\n\tAreaGroup,\n} from \"./styles\";\nimport useParallax from \"@hooks/use-parallax\";\nimport isEmpty from \"lodash-es/isEmpty\";\nimport ContactFormSelectable from \"@components/Form/ContactFormSelectable\";\nimport { filterXSS } from \"xss\";\n\ninterface IProps {\n\tdoc: IDocument;\n}\n\ninterface IArea {\n\tareas?: IArea[];\n\tname: string;\n\turl: string;\n}\n\nconst Area = ({ area }) => {\n\treturn <Link to={area.url} dangerouslySetInnerHTML={{ __html: filterXSS(area.name) }} />;\n};\n\nconst CityListing = ({ city }) => {\n\treturn (\n\t\t<AreaList>\n\t\t\t<h3>\n\t\t\t\t<Link to={city.url}>{city.name}</Link>\n\t\t\t</h3>\n\t\t\t{city.areas &&\n\t\t\t\tcity.areas.map((area: IArea, i: number) => <Area area={area} key={`area-${city.url}-${i}`} />)}\n\t\t</AreaList>\n\t);\n};\n\nconst AreaListing = ({ page }) => {\n\tif (isEmpty(page)) {\n\t\treturn null;\n\t}\n\n\tconst { name, cities } = page;\n\n\treturn (\n\t\t<AreaGroup>\n\t\t\t<h2>{name}</h2>\n\t\t\t{!isEmpty(cities) &&\n\t\t\t\tcities.map((city: IArea, i: number) => (\n\t\t\t\t\t<CityListing city={city} key={`cityListing-${city.name}-${i}`} />\n\t\t\t\t))}\n\t\t</AreaGroup>\n\t);\n};\n\nconst AreaListingPage = (props: IProps) => {\n\tconst { areas } = props.doc;\n\n\tuseParallax(\".p-1\", { speed: -2 });\n\tuseParallax(\".p-2\", { speed: 2 });\n\n\treturn (\n\t\t<Fragment>\n\t\t\t<AreaListingHero>\n\t\t\t\t<Container>\n\t\t\t\t\t<HeroColumns>\n\t\t\t\t\t\t<HeroColumn>\n\t\t\t\t\t\t\t<h1>Asuinalueet</h1>\n\t\t\t\t\t\t\t<p>\n\t\t\t\t\t\t\t\tPohditko kodinvaihtoa, mutta et tunne asuinalueita riittävän hyvin? Nyt voit tutustua\n\t\t\t\t\t\t\t\thaluamaasi alueeseen kätevästi vaikkapa kotisohvalta käsin.\n\t\t\t\t\t\t\t</p>\n\t\t\t\t\t\t</HeroColumn>\n\t\t\t\t\t\t<HeroColumn>\n\t\t\t\t\t\t\t<HeroImage>\n\t\t\t\t\t\t\t\t<picture className=\"p-1\">\n\t\t\t\t\t\t\t\t\t<source\n\t\t\t\t\t\t\t\t\t\tsrcSet={\n\t\t\t\t\t\t\t\t\t\t\tgetAssetUrl(\"/assets/images/km-2019/aluesivut/arealist-large@2x.webp\") +\n\t\t\t\t\t\t\t\t\t\t\t\" 2x, \" +\n\t\t\t\t\t\t\t\t\t\t\tgetAssetUrl(\"/assets/images/km-2019/aluesivut/arealist-large.webp\") +\n\t\t\t\t\t\t\t\t\t\t\t\" 1x\"\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\ttype=\"image/webp\"\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t<source\n\t\t\t\t\t\t\t\t\t\tsrcSet={\n\t\t\t\t\t\t\t\t\t\t\tgetAssetUrl(\"/assets/images/km-2019/aluesivut/arealist-large@2x.jpg\") +\n\t\t\t\t\t\t\t\t\t\t\t\" 2x, \" +\n\t\t\t\t\t\t\t\t\t\t\tgetAssetUrl(\"/assets/images/km-2019/aluesivut/arealist-large.jpg\") +\n\t\t\t\t\t\t\t\t\t\t\t\" 1x\"\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\ttype=\"image/jpeg\"\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t<img\n\t\t\t\t\t\t\t\t\t\tsrcSet={\n\t\t\t\t\t\t\t\t\t\t\tgetAssetUrl(\"/assets/images/km-2019/aluesivut/arealist-large@2x.jpg\") +\n\t\t\t\t\t\t\t\t\t\t\t\" 2x, \" +\n\t\t\t\t\t\t\t\t\t\t\tgetAssetUrl(\"/assets/images/km-2019/aluesivut/arealist-large.jpg\") +\n\t\t\t\t\t\t\t\t\t\t\t\" 1x\"\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\tsrc={getAssetUrl(\"/assets/images/km-2019/aluesivut/arealist-large.jpg\")}\n\t\t\t\t\t\t\t\t\t\talt=\"Asuinalueet - Kiinteistömaailma.fi\"\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t</picture>\n\t\t\t\t\t\t\t\t<picture className=\"p-2\">\n\t\t\t\t\t\t\t\t\t<source\n\t\t\t\t\t\t\t\t\t\tsrcSet={\n\t\t\t\t\t\t\t\t\t\t\tgetAssetUrl(\"/assets/images/km-2019/aluesivut/arealist-small@2x.webp\") +\n\t\t\t\t\t\t\t\t\t\t\t\" 2x, \" +\n\t\t\t\t\t\t\t\t\t\t\tgetAssetUrl(\"/assets/images/km-2019/aluesivut/arealist-small.webp\") +\n\t\t\t\t\t\t\t\t\t\t\t\" 1x\"\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\ttype=\"image/webp\"\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t<source\n\t\t\t\t\t\t\t\t\t\tsrcSet={\n\t\t\t\t\t\t\t\t\t\t\tgetAssetUrl(\"/assets/images/km-2019/aluesivut/arealist-small@2x.jpg\") +\n\t\t\t\t\t\t\t\t\t\t\t\" 2x, \" +\n\t\t\t\t\t\t\t\t\t\t\tgetAssetUrl(\"/assets/images/km-2019/aluesivut/arealist-small.jpg\") +\n\t\t\t\t\t\t\t\t\t\t\t\" 1x\"\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\ttype=\"image/jpeg\"\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t<img\n\t\t\t\t\t\t\t\t\t\tsrcSet={\n\t\t\t\t\t\t\t\t\t\t\tgetAssetUrl(\"/assets/images/km-2019/aluesivut/arealist-small@2x.jpg\") +\n\t\t\t\t\t\t\t\t\t\t\t\" 2x, \" +\n\t\t\t\t\t\t\t\t\t\t\tgetAssetUrl(\"/assets/images/km-2019/aluesivut/arealist-small.jpg\") +\n\t\t\t\t\t\t\t\t\t\t\t\" 1x\"\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\tsrc={getAssetUrl(\"/assets/images/km-2019/aluesivut/arealist-small.jpg\")}\n\t\t\t\t\t\t\t\t\t\talt=\"Asuinalueet - Kiinteistömaailma.fi\"\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t</picture>\n\t\t\t\t\t\t\t</HeroImage>\n\t\t\t\t\t\t</HeroColumn>\n\t\t\t\t\t</HeroColumns>\n\t\t\t\t</Container>\n\t\t\t</AreaListingHero>\n\t\t\t<Container>\n\t\t\t\t<AreaListingColumns>\n\t\t\t\t\t<AreaListingColumn wide={true}>\n\t\t\t\t\t\t{!isEmpty(areas) &&\n\t\t\t\t\t\t\tareas.map((page, i: number) => <AreaListing page={page} key={`areaListing-${i}`} />)}\n\t\t\t\t\t</AreaListingColumn>\n\t\t\t\t\t<AreaListingColumn>\n\t\t\t\t\t\t<ContactFormSelectable />\n\t\t\t\t\t</AreaListingColumn>\n\t\t\t\t</AreaListingColumns>\n\t\t\t</Container>\n\t\t</Fragment>\n\t);\n};\n\nconst mapStateToProps = (state: IApplicationState) => ({\n\tdoc: state.document,\n});\nconst AreaListingPageContainer = connect(mapStateToProps)(AreaListingPage);\n\nexport default AreaListingPageContainer;\n"],"sourceRoot":""}