\n
\n
this.handleCloseModal()}\n />\n
\n );\n }\n}\n","import { h } from '@atomify/jsx';\nimport { Image } from '@atoms/image';\nimport {\n COLOR_CLASSES,\n FormattedPrice,\n FormattedSpecification,\n FormattedStatus,\n} from '@source/utilities/api-formatters';\nimport { useTranslate } from '@utilities/hooks';\n\ninterface ProjectPhaseCardInterface {\n title: string;\n id?: string;\n image?: string | null;\n price?: FormattedPrice;\n specs?: FormattedSpecification[];\n status?: FormattedStatus;\n housesAmount?: number;\n classes?: string;\n hidePrice?: boolean;\n debugId?: string;\n}\n\nexport const ProjectPhaseCard = ({\n classes = '',\n id,\n image,\n title,\n status,\n housesAmount,\n price,\n specs,\n hidePrice,\n debugId,\n}: ProjectPhaseCardInterface) => (\n
\n {debugId &&
{debugId}}\n\n
\n {image && (\n \n )}\n
\n\n
\n {status && (\n
\n {status.label}\n \n )}\n\n {housesAmount && (\n
\n {` - ${housesAmount} `}\n {useTranslate(housesAmount === 1 ? 'House' : 'Houses')}\n \n )}\n\n
{title}
\n\n {price?.amount && !hidePrice && (\n
\n {price.prefix && price.prefix} {price.amount && price.amount}{' '}\n {price.suffix && price.suffix}\n
\n )}\n\n {specs && (\n
\n {specs.map(({ value, suffix }) => (\n - \n {value} {suffix}\n
\n ))}\n
\n )}\n
\n
\n);\n","import { h } from '@atomify/jsx';\nimport { Image } from '@atoms/image';\nimport { COLOR_CLASSES, FormattedPrice, FormattedStatus } from '@source/utilities/api-formatters';\n\ninterface PropertyCardInterface {\n number?: string | null;\n title: string;\n id?: string;\n project?: string | null;\n image?: string | null;\n href?: string;\n price?: FormattedPrice;\n specs?: string[];\n status?: FormattedStatus;\n wishlistItemCount?: number;\n classes?: string;\n hidePrice?: boolean;\n debugId?: string;\n orientation?: 'horizontal' | 'vertical';\n}\n\nexport const PropertyCard = (data: PropertyCardInterface) => {\n const {\n classes = '',\n href,\n id,\n image,\n title,\n number,\n status,\n price,\n specs,\n project,\n wishlistItemCount,\n hidePrice,\n debugId,\n orientation,\n } = data;\n\n const { hasWishlist } = window.__ENVIRONMENT_DETAILS__;\n\n const classList = {\n ['c-property-card']: true,\n [classes]: true,\n ...(orientation && { [`property-card--${orientation}`]: true }),\n };\n\n return (\n
\n {debugId && {debugId}}\n \n {image && (\n \n )}\n {hasWishlist && wishlistItemCount && (\n \n )}\n
\n {number && (\n \n {number}\n
\n )}\n\n \n {status && (\n
\n {status.label}\n \n )}\n\n
{title}
\n\n {price?.amount && !hidePrice && (\n
\n {price.prefix && price.prefix} {price.amount && price.amount}{' '}\n {price.suffix && price.suffix}\n
\n )}\n\n {specs && (\n
\n {specs.map((spec) => (\n - {spec}
\n ))}\n
\n )}\n\n {project &&
{project}}\n
\n \n );\n};\n","import { defineElement, FC, onDidLoad, useElement, useListen } from '@atomify/hooks';\nimport { BPDFormElement, BPDInput, PagesProps } from '@source/components/atoms';\nimport {\n getSmartSubscriptionProject,\n smartSubscriptionStore,\n} from '@source/store/smart-subscription';\nimport { useButtonLoadingState, usePostcodeChecker } from '@source/utilities/hooks';\nimport {\n getSubscriptionAddress,\n getSubscriptionUser,\n isStoreAddressDataComplete,\n subscribeToProjectPhase,\n subscriptionStore,\n} from '@store/subscription/store';\nimport { SubscriptionStoreAddress } from '@store/subscription/store.types';\n\nexport const SUBSCRIPTION_MODAL_ID = 'smart-subscription-modal';\n\ninterface SmartSubscriptionProps {\n bpdPages: PagesProps;\n}\n\nconst SMART_SUBSCRIPTION_POSTCODE_INPUT_HOOK = '[js-hook-smart-subscription-zipcode] bpd-input';\nconst SMART_SUBSCRIPTION_HOUSENUMBER_INPUT_HOOK =\n '[js-hook-smart-subscription-housenumber] bpd-input';\nconst SMART_SUBSCRIPTION_HOUSENUMBER_ADDITION_INPUT_HOOK =\n '[js-hook-smart-subscription-housenumber-suffix] bpd-input';\nconst SMART_SUBSCRIPTION_STREET_INPUT_HOOK = '[js-hook-smart-subscription-street] bpd-input';\nconst SMART_SUBSCRIPTION_PLACE_INPUT_HOOK = '[js-hook-smart-subscription-city] bpd-input';\nconst SMART_SUBSCRIPTION_PHONENUMBER_INPUT_HOOK =\n '[js-hook-smart-subscription-phonenumber] bpd-input';\nconst SMART_SUBSCRIPTION_COUNTRY_INPUT_HOOK = '[js-hook-smart-subscription-country] bpd-input';\nconst SMART_SUBSCRIPTION_SUBMIT_CTA_HOOK = '[js-hook-smart-subscription-submit]';\n\nexport const SmartSubscription: FC
= ({ element }) => {\n const form = useElement('[js-hook-smart-subscription-project-signup-form]');\n\n // Element query bindings for dynamic use.\n useElement('bpd-pages', { as: 'bpdPages' });\n\n useListen(form, 'serializedForm', async (e: CustomEvent) => handleFormSubmit(e));\n\n const areaId = window.__ENVIRONMENT_DETAILS__.areaId;\n\n const zipcodeInput = useElement(SMART_SUBSCRIPTION_POSTCODE_INPUT_HOOK);\n const houseNumberInput = useElement(SMART_SUBSCRIPTION_HOUSENUMBER_INPUT_HOOK);\n const houseNumberAdditionInput = useElement