=\n () => {\n const { state, send } = useCalculatorMachine()\n const formValues = state.context\n .formValues as MortgageProtectionFormType\n\n const getStarted: GetStartedProps = {\n title: 'Get Started',\n subtitle:\n 'You don’t have to wait until your mortgage is drawn down to begin.',\n phoneNumber: '(01) 704 1104',\n bodyText:\n 'This indicative quote from Irish Life Financial Services is for a Mortgage Protection policy from Irish Life Assurance plc and is subject to further assessment of health status. This assessment may result in an increase in the cost of cover. Irish Life Assurance plc, trading as Irish Life, is regulated by the Central Bank of Ireland.',\n }\n const onSubmit = (data: any) => {\n if (!data.coverNeeded && !data.term) {\n return\n }\n let user = {}\n if (state.context.formValues) {\n user = {\n ...state?.context?.formValues,\n coverNeeded: data.coverNeeded || formValues.coverNeeded,\n term: data.term || formValues.term,\n }\n }\n send({\n type: 'Get Adjusted Quote',\n payload: { user },\n } as CalculatorMachineEvent)\n }\n const adjustmentFormProps: AdjustmentFormProps = {\n onSubmit,\n coverNeeded: formValues.coverNeeded,\n term: formValues.term,\n peopleCovered:\n formValues.coverFor === '1' ? 'One person' : 'Two people',\n }\n\n const quoteDisplayProps: CalculatorQuoteDisplayProps = {\n getStarted,\n adjustmentFormProps,\n }\n return Decreasing Life Cover \nPays a lump sum if anyone covered on the plan dies. The cover will decrease each year because the amount of replacement income your family needs reduces over time.
\n
\nBill Cover \nPays your essential monthly bills if the person covered cannot work because of an illness or injury while employed. You will not be able to claim if you become unemployed for more than one month and your claim may be limited if living abroad at the time of your claim.
\n
\nSpecified Illness Cover \nPays a lump sum if you are diagnosed with one of the illness covered on the plan.
\n
\nFuneral Cover \nA lump sum payment to help your family cover the cost of your funeral and other related expenses.
\n
\nPrice Breakdown (per month) \nCost of Decreasing Life Cover: €${addValues(\n data?.lifeCoverPrem1,\n data?.lifeCoverPrem2\n )} \nCost of Bill Cover: €${addValues(data?.billPayPrem1, data?.billPayPrem2)} \nCost of Illness Cover: €${addValues(\n data?.sicCoverPrem1,\n data?.sicCoverPrem2\n )}\nIrish Life Policy Fee: €${Number(data?.fee).toFixed(2)}\n1% Government Levy: €${Number(data?.levy).toFixed(2)}\nTotal: €${Number(data?.premInclLevy).toFixed(2)}
\n
`\n}\nexport const moreInfo = (data: string): MoreInfoProps => {\n return {\n modalContent: data,\n buttonLabel: 'See costs & benefits'\n }\n\n}\nexport const getStarted: GetStartedProps = {\n title: 'Next Steps',\n subtitle:\n 'Speak to an advisor to help get started or for help with your quote.',\n phoneNumber: '(01) 704 1104',\n}\nexport const benefits = [\n `98.6% of death claims paid (2023)`,\n `Supporting 8,000+ families with claims (2023)`,\n `80 years looking after the needs of people in Ireland (2023)`,\n]\nexport const benefitsTitle = `Why choose Irish Life Assurance?`\nexport const validity: ValidityCardProps = {\n title: 'Validity',\n description: `This quote is valid for 7 days or until your next birthday, whichever is sooner and is subject to no changes to the applicable regulatory or tax rules within that period. You must keep up payments to stay on cover. This planner gives general guidance, but is not individual financial advice. We recommend you discuss your full circumstances and the cover with our of our qualified financial advisors.`,\n}\nexport const RiskCard: ValidityCardProps = {\n title: 'Risk associated with this quote',\n description: `See cover requirements section below for further detail on the calculation and assumptions for recommended cover levels.\nThis assessment may result in an increase in the cost of cover. Irish Life Assurance plc is regulated by the Central Bank of Ireland. This indicative quote from Irish Life Financial Services is for a OnePlan protection policy from Irish Life Assurance plc and is subject to further assessment of health status.`,\n}\nexport const coverRequirements = {\n accordion_section__title: 'Cover Requirements',\n accordion_section__items: [\n {\n id: 1,\n heading: 'Decreasing life cover',\n children_test: `\n Lump sum paid on death - The gap in\n cover is calculated by taking your net income, minus\n state benefits and any mortgage payments covered by\n mortgage protection multiplied by the term. If you have\n a mortgage, we assume that you have mortgage protection\n in place. Protection Term is calculated on your youngest\n child reaching age 25 or the remaining term of your\n mortgage. State widows benefit of €1,029 plus an\n additional €199 for each child per month is assumed. The\n level of state benefit is dependent on the number of\n PRSI contributions-we assume 48 or more in this\n instance.\n
`,\n },\n {\n id: 2,\n heading: 'Bill cover',\n children_test: `Pays regular amount if unable to work due to injury or\n illness - The recommended cover is calculated by adding\n your monthly mortgage or rent amount, plus €400 for\n essential bills such as gas, electricity etc. The amount\n of cover is capped at €2,000 or 40% of monthly net\n income, whichever is lower. Term is based on your\n youngest child reaching 25 or the remaining of your\n mortgage term.
`,\n },\n {\n id: 3,\n heading: 'Specified illness cover',\n children_test: `The recommended cover is calculated at two year's net\n salary. Term is based on your youngest child reaching age\n 25 or a term of 20 years if no children under the age of\n 25. If you are over 65 years of age, you are not\n eligible for this benefit.
`,\n },\n ],\n}\n","import React from 'react'\nimport { Card } from '@irishlife/ilgroupdesignsystem.atoms.card'\nimport { AccordionSection } from 'common/components/organisms/templateSections/AccordionSection'\nimport { coverRequirements } from './../utils/helperFunctions'\nexport interface CoverRequirementProps {}\n\nexport const CoverRequirement: React.FC = () => {\n return (\n \n \n )\n}\n","import React from 'react'\nimport { Box, HStack } from '@chakra-ui/react'\nimport { Text } from '@irishlife/ilgroupdesignsystem.atoms.text'\nexport interface QuoteCardHeadersProps {\n columns: any\n columnClass: any\n handleHeaderClick: any\n}\nexport const QuoteCardHeaders: React.FC = ({\n columns,\n columnClass,\n handleHeaderClick,\n}) => {\n return (\n <>\n \n {columns.map((item: any, index: any) => {\n return (\n handleHeaderClick(item, index)}\n >\n \n {item.title}\n \n \n {item.price}\n \n \n )\n })}\n \n \n )\n}\n","import React from 'react'\nimport {\n Box,\n Flex,\n Divider,\n Image,\n} from '@chakra-ui/react'\nimport { Text } from '@irishlife/ilgroupdesignsystem.atoms.text'\nimport { CheckIcon, CloseIcon } from '@irishlife/ilgroupdesignsystem.icons'\nimport { useCalculatorMachine } from 'common/components/organisms/Calculator/utils/context'\nimport { OnePlanFormType } from 'common/components/organisms/Calculator/utils/interfaces'\nimport { MoreInfo } from '../../../common/MoreInfo'\nimport { moreInfo } from '../utils/helperFunctions'\nexport interface CoverDetail {\n isApplicable: boolean\n title: string\n yourCover: string\n partnerCover: string\n}\n\nexport interface QuoteCardProps {\n coverDetails: any\n}\n\nexport const QuoteCard: React.FC = ({ coverDetails }) => {\n const { data, modalContent } = coverDetails\n const moreInfoProps = moreInfo(modalContent)\n const { state } = useCalculatorMachine()\n const formValues = state.context.formValues as OnePlanFormType\n return (\n \n \n \n \n {data.heading}\n \n \n \n \n \n \n \n {coverDetail.title}\n \n \n You: {' '}\n {coverDetail.yourCover}\n \n {formValues.jointLife === 'Y' && (\n \n Partner: {' '}\n {coverDetail.partnerCover}\n \n )}\n \n \n \n )\n } else {\n return (\n \n \n \n \n {coverDetail.title}\n \n \n {' '}\n Not applicable\n \n \n \n \n )\n }\n })}\n =\n () => {\n const { state } = useCalculatorMachine()\n type ColumnState = {\n isSelected: object\n }[]\n const activeStyles = {\n borderBottom: '4px solid #6977DF',\n boxShadow: '0px 0px 20px rgba(82, 97, 172, 0.24)',\n borderRadius: '12px',\n background: '#FFFFFF',\n }\n const columns = getOnePlanColumns(state).columns\n const [column, setColumn] = useState(columns[0])\n const initialColumnState: ColumnState = columns?.map(\n (column: any, index: number) => {\n if (index === 0) {\n return {\n isSelected: activeStyles,\n }\n }\n return { isSelected: {} }\n }\n )\n const [columnClass, setcolumnClass] =\n React.useState(initialColumnState)\n const handleHeaderClick = (column: any, index: number) => {\n setColumn(column)\n const columnState: ColumnState = columnClass.map(\n (item, itemIndex: number) => {\n return itemIndex === index\n ? { ...item, isSelected: activeStyles }\n : { ...item, isSelected: {} }\n }\n )\n setcolumnClass(columnState)\n }\n return (\n \n \n Your quote\n \n \n )\n }\n","import { PensionCalcQuote } from '../quoteComponents/PensionCalculatorQuote'\nimport { InvestmentCalcQuote } from '../quoteComponents/InvestmentCalculatorQuote'\nimport { IncomeProtectionQuote } from '../quoteComponents/IncomeProtectionQuote'\nimport { TermLifeQuote } from './TermLifeQuote'\nimport { MortgageProtectionQuote } from './MortgageProtectionQuote'\nimport { OnePlanProtectionQuote } from './OnePlanProtectionQuote'\nexport const QuoteComponentMapper: { [key: string]: any } = {\n Pensions: PensionCalcQuote,\n Investment: InvestmentCalcQuote,\n IncomeProtection: IncomeProtectionQuote,\n TermLife: TermLifeQuote,\n MortgageProtection: MortgageProtectionQuote,\n OnePlan: OnePlanProtectionQuote,\n}\n","import { Box } from '@chakra-ui/react'\nimport React from 'react'\nimport { AssumptionsCard } from './components/AssumptionsCard'\nimport { BenefitsCard } from '../common/BenefitsCard'\nimport { NextStepsCard } from './components/NextStepsCard'\nimport { PensionCalculatorOutput } from './components/PensionCalculatorOutput'\nimport { WarningAlerts } from '../common/WarningAlerts'\nexport interface PensionCalcQuoteProps {\n props?: any\n}\nexport const PensionCalcQuote: React.FC = () => {\n const benefits = [\n `Our advisors are on hand to help you and offer guidance.`,\n `We support our customers up until and after retirement.`,\n `Customers who had a financial review with us gave it a score of 94.4%.`,\n ]\n const benefitsTitle = ` Why choose Irish Life?`\n return (\n \n \n )\n}\n","import React from 'react'\nimport { InvestmentCalculatorOutput } from './components/InvestmentCalculatorOutput'\nimport { Warnings } from './components/Warnings'\nimport { AdjustmentForm } from './components/AdjustmentForm'\n\nimport { Card } from '@irishlife/ilgroupdesignsystem.atoms.card'\n\nexport interface InvestmentCalcQuoteProps {\n props?: any\n}\nexport const InvestmentCalcQuote: React.FC = () => {\n return (\n <>\n \n \n\n =\n () => {\n const { state, send } = useCalculatorMachine()\n if (state.context.quoteData?.error) {\n send({ type: 'ERROR OCCURED' })\n }\n const benefits = [\n `98.1% of death claims paid (2022)`,\n `Supporting 7,000+ families with claims (2022)`,\n `80 years looking after the needs of people in Ireland`,\n ]\n const benefitsTitle = `Why choose Irish Life Assurance?`\n\n return (\n \n \n )\n }\n","import { Box } from '@chakra-ui/react'\nimport React from 'react'\nimport { useCalculatorMachine } from '../../../utils/context'\nimport { BenefitsCard } from '../common/BenefitsCard'\nimport { TermLifeCalculatorOutput } from './TermLifeCalculatorOutput'\nimport { ValidityCard, ValidityCardProps } from '../common/ValidityCard'\nimport { HaveAQuestionCard } from '../common/HaveAQuestion'\nimport { isEmpty } from 'lodash'\n\nexport interface TermLifeQuoteProps {\n props?: any\n}\nexport const TermLifeQuote: React.FC = () => {\n const { state, send } = useCalculatorMachine()\n if (\n state.context.quoteData?.error ||\n isEmpty(state.context.quoteData?.quoteData)\n ) {\n send({ type: 'ERROR OCCURED' })\n }\n const phoneNumber = '(01) 704 1104'\n const benefits = [\n `98.1% of death claims paid (2022)`,\n `Supporting 7,000+ families with claims (2022)`,\n `80 years looking after the needs of people in Ireland`,\n ]\n const benefitsTitle = `Why choose Irish Life Assurance?`\n const validity: ValidityCardProps = {\n title: 'Validity',\n description:\n 'This quote is valid either for 7 days or to your next birthday, whichever is sooner. If you would like to discuss options for Joint Life Cover or Dual Life Cover, you can book a free consultation with a financial advisor.',\n }\n return (\n \n \n \n )\n}\n","import React from 'react'\nimport { ValidityCard, ValidityCardProps } from '../common/ValidityCard'\nimport { HaveAQuestionCard } from '../common/HaveAQuestion'\nimport { isEmpty } from 'lodash'\nimport { useCalculatorMachine } from '../../../utils/context'\nimport { BenefitsCard } from '../common/BenefitsCard'\nimport { Box } from '@chakra-ui/react'\nimport { MortgageProtectionOutput } from './MortgageProtectionOutput'\nexport interface MortgageProtectionQuoteProps {\n props?: any\n}\nexport const MortgageProtectionQuote: React.FC =\n () => {\n const { state, send } = useCalculatorMachine()\n if (\n state.context.quoteData?.error ||\n isEmpty(state.context.quoteData?.quoteData)\n ) {\n send({ type: 'ERROR OCCURED' })\n }\n const phoneNumber = '(01) 704 1104'\n const benefits = [\n `98.1% of death claims paid (2022)`,\n `Supporting 7,000+ families with claims (2022)`,\n `80 years looking after the needs of people in Ireland`,\n ]\n const benefitsTitle = `Why choose Irish Life Assurance?`\n const validity: ValidityCardProps = {\n title: 'Validity',\n description:\n 'This quote is valid for 7 days or until your next birthday, depending which comes first.',\n }\n return (\n \n \n \n )\n }\n","import React from 'react'\nimport { ValidityCard } from '../common/ValidityCard'\nimport { useCalculatorMachine } from '../../../utils/context'\nimport { BenefitsCard } from '../common/BenefitsCard'\nimport { Box } from '@chakra-ui/react'\nimport { GetStarted } from './../common/GetStarted'\nimport { Card } from '@irishlife/ilgroupdesignsystem.atoms.card'\nimport { CoverRequirement } from './OnePlanProtectionOutput/components/CoverRequirements'\nimport { OnePlanProtectionOutput } from './OnePlanProtectionOutput'\nimport { isEmpty } from 'lodash'\nimport { Button } from '@irishlife/ilgroupdesignsystem.atoms.button'\nimport { ArrowRightCircleIcon } from '@irishlife/ilgroupdesignsystem.icons'\nimport {\n getStarted,\n benefits,\n validity,\n benefitsTitle,\n RiskCard,\n} from './OnePlanProtectionOutput/utils/helperFunctions'\nexport interface OnePlanProtectionQuoteProps {\n props?: any\n}\nexport const OnePlanProtectionQuote: React.FC =\n () => {\n const { state, send } = useCalculatorMachine()\n const restartQuote = () => {\n send({\n type: 'Calculate Again',\n })\n }\n if (\n state.context.quoteData?.error ||\n isEmpty(state.context.quoteData?.comprehensiveQuoteData) ||\n isEmpty(state.context.quoteData?.essentialQuoteData) ||\n isEmpty(state.context.quoteData?.standardQuoteData)\n ) {\n send({ type: 'ERROR OCCURED' })\n }\n return (\n \n \n \n \n )\n }\n","import {\n Modal,\n ModalBody,\n ModalCloseButton,\n ModalContent,\n ModalFooter,\n ModalOverlay,\n useDisclosure,\n Box,\n} from '@chakra-ui/react'\nimport { Button } from '@irishlife/ilgroupdesignsystem.atoms.button'\nimport { Card } from '@irishlife/ilgroupdesignsystem.atoms.card'\nimport { ArrowRightCircleIcon } from '@irishlife/ilgroupdesignsystem.icons'\nimport { navigate } from '@reach/router'\nimport { RichText } from 'common/components/molecules/RichText'\nimport { config } from 'common/components/organisms/Calculator/config/index'\nimport { useCalculatorMachine } from 'common/components/organisms/Calculator/utils/context'\nimport { modifySteps } from 'common/components/organisms/Calculator/utils/modifySteps'\nimport React, { useEffect } from 'react'\nimport { useForm } from 'react-hook-form'\nimport { CalculatorStep, CalculatorStepProps } from './CalculatorStep'\nimport { CalculatorMachineEvent } from 'common/components/organisms/Calculator/utils/interfaces'\nimport isEmpty from 'lodash/isEmpty';\n\nexport interface CalculatorStepCommonProps {\n props?: any\n}\n\nexport const CalculatorStepCommon: React.FC = ({\n props,\n}) => {\n const { state, send } = useCalculatorMachine()\n const {\n register,\n handleSubmit,\n control,\n watch,\n trigger,\n formState: { isDirty, errors },\n } = useForm({\n shouldUnregister: false,\n mode: 'all',\n })\n const isFetching = state.matches('Getting Quote Details')\n const { isOpen, onOpen, onClose } = useDisclosure()\n const finalRef = React.useRef(null)\n const calculatorType = props.calc_type\n const analyticsName = `${calculatorType}_calculator`\n const { stepsTransformation } = config[calculatorType]\n const calculatorSteps = modifySteps(props?.steps)\n const formValues = watch()\n let transformedSteps = stepsTransformation(calculatorSteps, formValues)\n const questions = transformedSteps?.[state.context.screenNo].steps\n const formValuestoCheck = Object.values(questions).map((question: any) => {\n return question?.fieldName\n })\n const isFormComplete = Object.values(formValuestoCheck).every(\n (value) =>\n formValues.hasOwnProperty(value) &&\n formValues[value] !== undefined &&\n formValues[value] !== ''\n )\n const isSubmit = state.context.screenNo === transformedSteps?.length - 1\n useEffect(() => {\n if (isDirty) {\n send({\n type: 'Interacted',\n payload: {\n name: analyticsName,\n event: 'interacted',\n isInteracted: 'true',\n },\n } as CalculatorMachineEvent)\n }\n }, [isDirty, send, analyticsName])\n const onSubmit = (user: any) => {\n if (state.context.calc_type === 'Pensions') {\n user = { ...user, retirementAge: 66 }\n } else if (state.context.calc_type === 'IncomeProtection') {\n user = { ...user, retirementAge: 55 }\n }\n // user = { ...user, retirementAge: 66 }\n send({\n type: 'Get Quote' as string,\n payload: {\n user: user,\n calc_type: calculatorType,\n name: analyticsName,\n event: 'completed',\n },\n } as CalculatorMachineEvent)\n }\n const handleHelpButton = () => {\n onOpen()\n send({\n type: 'Need Help',\n payload: {\n name: analyticsName,\n event: 'need help clicked',\n },\n } as CalculatorMachineEvent)\n }\n return (\n \n )\n}\n\n","import React from 'react'\nimport { useCalculatorMachine } from '../../utils/context'\nimport { ErrorScreen } from './ErrorScreen'\nimport { QuoteComponentMapper } from '../quoteComponents/QuoteComponentMapper'\nimport { CalculatorStepCommon } from '../steps/CalculatorStepCommon'\ntype CalcType = 'Pensions' | 'Investment'\n\nexport const ViewSelector: React.FC = (props) => {\n const calcType: CalcType = props.props.calc_type\n const QuoteComponent = QuoteComponentMapper[calcType]\n const { state } = useCalculatorMachine()\n switch (true) {\n case state.matches('Quote Screen') ||\n state.matches('Refetching Quote Details'):\n return = ({ image }) => {\n const skewObjectStyleVertical: CSS.Properties = {\n position: 'absolute',\n left: '0',\n top: '0',\n height: '100%',\n background:\n 'linear-gradient(to right top, #F7F8FB 0%, #F7F8FB 50%, transparent 51%, transparent 70%, transparent 100%)',\n zIndex: 0,\n }\n return (\n \n \n \n )\n}\n","import { Box, Grid, GridItem } from '@chakra-ui/react'\nimport { analyticsService } from 'common/components/organisms/Calculator/config/analytics'\nimport { useDesktop } from 'common/hooks/useDesktop'\nimport { createCrmLead } from 'common/services/crm/createCrmLead'\nimport { fireAnalyticsEvent } from 'common/utils/fireAnalyticsEvent'\nimport React, { useEffect } from 'react'\nimport { EventObject } from 'xstate'\nimport { config } from 'common/components/organisms/Calculator/config/index'\nimport { useCalculatorMachine } from '../../utils/context'\nimport { footerNotesMapper } from '../footerNotes/footerNotesMapper'\nimport { Heading } from '../Heading'\nimport ProgressIndicator from '../ProgressIndicator'\nimport { ViewSelector } from '../views/ViewSelector'\nimport { ContainerRight } from './container-right'\nexport interface ContainerProps {\n props?: any\n}\n\nexport const Container: React.FC = ({ props }) => {\n const isDesktop = useDesktop()\n const { send } = useCalculatorMachine()\n const analyticsName = `${props.calc_type}_calculator`\n const { onSubmit } = config[props.calc_type]\n useEffect(() => {\n fireAnalyticsEvent({\n name: analyticsName,\n properties: {\n event: analyticsName,\n step: 'initialised',\n },\n })\n send({\n type: 'Initialise',\n payload: {\n props,\n actions: {\n onSubmit,\n analyticsService,\n createCrmLead,\n },\n },\n } as EventObject)\n // eslint-disable-next-line\n }, [])\n const calculatorType = props.calc_type\n const FooterNotes = footerNotesMapper[calculatorType]\n return (\n <>\n \n \n \n {isDesktop && (\n \n \n )}\n \n \n \n \n )\n}\n","import { Box } from '@chakra-ui/react'\nimport { Container } from 'common/components/organisms/Calculator/components/container'\nimport { CalculatorMachineProvider } from 'common/components/organisms/Calculator/utils/context'\nimport React from 'react'\n\n// eslint-disable-next-line @typescript-eslint/no-empty-interface\nexport interface CalculatorProps {\n steps: any\n}\n\nexport const Calculator: React.FC = (props) => {\n return (\n \n \n \n \n )\n}\n","import {\n Calculator as CalculatorOrganism,\n CalculatorProps as CalculatorOrganismProps,\n} from 'common/components/organisms/Calculator'\nimport React from 'react'\n\nexport interface CalculatorProps extends CalculatorOrganismProps {}\n\nexport const Calculator: React.FC = (props) => {\n return \n setIndex(index - 1)}\n marginRight='22px'\n marginTop={vertically ? '' : '2px'}\n w='16px'\n h='16px'\n >\n \n setIndex(number)}\n {...(rightIndicator\n ? { rightIndicator }\n : { leftIndicator })}\n />\n
\n setIndex(index + 1)}\n marginLeft='12px'\n w='16px'\n h='16px'\n >\n \n \n \n \n {isDesktop ? (\n images && (\n \n \n {images.map(\n (image: any, index: number) => (\n 2\n ? 2\n : index\n ]\n }\n />\n )\n )}\n \n \n )\n ) : (\n \n \n {isDesktop ? (\n \n setIndex(number - 1)\n }\n defaultStep={index + 1}\n />\n ) : (\n \n setIndex(number - 1)\n }\n defaultStep={index + 1}\n />\n )}\n \n \n \n \n \n \n \n {title}\n \n \n {card?.title}\n \n \n \n {card?.subtitle}\n \n \n {card.subtitle2}\n \n \n \n {card?.paragraph}\n \n \n {card?.children}\n \n \n {\n navigate(card?.callToAction?.url)\n }}\n >\n {card?.callToAction?.label}\n \n \n \n \n {card?.secondaryButtonText}\n \n \n \n \n \n \n )\n}\n","import React, { FC } from 'react'\nimport { Campaign3DSlideshow } from 'common/components/organisms/Campaign3DSlideshow/index'\n\nconst Campaign3DSlideshowWrapper: FC<{ props: any }> = (props) => {\n const processedProps = getProps(props)\n\n return = (props) => {\n const data = getCardGridData(props)\n return (\n \n \n \n \n )\n}\n\nexport const getCardGridData = (data: any): ProductListProps => {\n return {\n heading: data.cardgrid__heading,\n products: (data.cardgrid__products || []).map((product: any) => ({\n icon: product.icon,\n subtitle: product.subtitle,\n title: product.title,\n text: product.text,\n callToAction: {\n label: product.card_cta_0396ba7__cta_label,\n variant: product.card_cta_0396ba7__cta_variant,\n url: product.card_cta_0396ba7__cta_url,\n },\n })),\n text: data.cardgrid__text,\n title: data.cardgrid__title,\n }\n}\n","import { Benefits, BenefitsProps } from 'common/components/organisms/Benefits'\nimport React from 'react'\n\n// eslint-disable-next-line @typescript-eslint/no-empty-interface\nexport interface CardsProps extends BenefitsProps {}\n\nexport const Cards: React.FC = (props) => {\n return = props => {\n const context = getCardsCarouselData(props)\n return = (props) => {\n const { text, background } = props\n const [isMobile] = useMediaQuery('(max-width: 720px)')\n\n return (\n \n \n {text}\n \n \n )\n}\n","import React, { FC } from 'react'\nimport { CenteredText } from 'common/components/organisms/CenteredText/index'\n\nconst CareerCenteredTextWrapper: FC<{ props: any }> = (props) => {\n const processedProps = getCareersCenteredTextData(props)\n\n return = ({ text, title, counter }) => {\n return (\n \n \n \n {counter}\n \n \n \n {title}\n \n \n {text}\n \n \n )\n}\n\nexport default Card\n","import { IconButton } from '@irishlife/ilgroupdesignsystem.atoms.icon-button'\nimport {\n ChevronLeftIcon,\n ChevronRightIcon,\n} from '@irishlife/ilgroupdesignsystem.icons'\nimport { Box, Progress as LinearProgress, HStack } from '@chakra-ui/react'\nimport React, { useState, useEffect, useMemo } from 'react'\n\ninterface PaginationProps {\n items: any\n itemsPerPage?: number\n showControls?: boolean\n callBack: (object: any) => void\n}\nexport const Pagination: React.FC = ({\n items,\n itemsPerPage = 4,\n showControls = true,\n callBack,\n}) => {\n const [currentPage, setCurrentPage] = useState(1)\n const totalPages = Math.ceil(items.length / itemsPerPage)\n const startIndex = (currentPage - 1) * itemsPerPage\n const endIndex = startIndex + itemsPerPage\n const visibleItems = items.slice(startIndex, endIndex)\n const progressBarValue = useMemo(() => {\n const progressValue = (currentPage / totalPages) * 100\n if (progressValue === Infinity) {\n return 100\n }\n return progressValue\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [currentPage, totalPages, items])\n\n useEffect(() => {\n callBack({ visibleItems, currentPage })\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [currentPage, items, itemsPerPage])\n\n const handleNextPage = () => {\n if (currentPage < totalPages) {\n setCurrentPage((prev) => prev + 1)\n }\n }\n\n const handlePrevPage = () => {\n if (currentPage > 1) {\n setCurrentPage((prev) => prev - 1)\n }\n }\n return (\n <>\n {showControls &&\n \n \n div': {\n backgroundColor: '#717FE2',\n },\n }}\n />\n \n \n \n \n \n }\n \n )\n}\n","import React, { useState } from 'react'\nimport { Box, Text, SimpleGrid, VStack } from '@chakra-ui/react'\nimport Card from './Card'\nimport { Pagination } from '../../molecules/Pagination/index'\n\ninterface CountingCardsWithPaginationProps {\n title: string\n items: { title: string; text: string }[]\n}\n\nexport const CountingCardsWithPagination: React.FC =\n ({ title, items }) => {\n const [visibleItems, setVisibleItems] = useState([])\n const [currentPage, setCurrentPage] = useState(1)\n const itemsPerPage = 3\n\n const handlePagination = (paginationData: any) => {\n setVisibleItems(paginationData.visibleItems)\n setCurrentPage(paginationData.currentPage)\n }\n\n const calculateCounter = (index: number) => {\n return (currentPage - 1) * itemsPerPage + index + 1\n }\n\n return (\n \n \n {title}\n \n\n \n {visibleItems.map((item: any, index) => (\n \n\n \n \n \n )\n }\n","import { CountingCardsWithPagination } from 'common/components/organisms/CountingCardsWithPagination/index'\nimport React, { FC } from 'react'\n\nconst CountingCardsWithPaginationWrapper: FC<{ props: any }> = (props) => {\n const processedProps = getProps(props)\n\n return = props => {\n const { title, subtitle, ...rest } = getCtaData(props)\n return (\n \n {title && \n \n \n )\n}\n\nconst getCtaData = (data: any): CtaProps => {\n return {\n title: data.title,\n subtitle: data.subtitle,\n analyticsId: data.call_to_action__analytics_id,\n label: data.call_to_action__label,\n [`${data.call_to_action__iconlocation}Icon`]: data.call_to_action__icon,\n text: data.call_to_action__text,\n url: data.call_to_action__url,\n variant: data.call_to_action__variant\n }\n}\n","import {\n Box,\n SimpleGrid,\n VStack,\n Grid,\n GridItem,\n HStack,\n} from '@chakra-ui/react'\nimport { Card } from '@irishlife/ilgroupdesignsystem.atoms.card'\nimport { Text } from '@irishlife/ilgroupdesignsystem.atoms.text'\nimport {\n DocumentDownloadIcon,\n DownloadIcon,\n} from '@irishlife/ilgroupdesignsystem.icons'\nimport { Link } from 'common/components/atoms/Link'\nimport React from 'react'\n\ninterface DocumentDownloadPanelProps {\n title: string\n cards: { title: string; fileSize: string; downloadPath: string }[]\n}\n\nconst DocumentDownloadPanel: React.FC = (props) => {\n const { title, cards } = props\n\n return (\n \n \n \n \n {title}\n \n \n\n \n {cards?.map((item: any, index: number) => (\n \n \n \n \n \n \n \n \n \n \n {item.title}\n \n \n \n \n {item.fileSize} file size\n \n \n \n \n \n \n {\n //open link in new tab\n window.open(\n item.downloadPath,\n '_blank'\n )\n }}\n >\n \n \n \n ))}\n \n \n \n )\n}\n\nexport default DocumentDownloadPanel\n","import React, { FC } from 'react'\nimport DocumentDownloadPanel from 'common/components/organisms/DocumentDownloadPanel/DocumentDownloadPanel'\n\nconst DocumentDownloadPanelWrapper: FC<{ props: any }> = (props) => {\n const processedProps = getProps(props)\n\n return = ({\n title,\n text,\n image,\n callToAction,\n variant = 'default'\n}) => {\n const desktop = useDesktop()\n const dpr = useDpr()\n\n return (\n \n \n \n \n \n \n \n \n \n {callToAction.label && (\n \n \n \n \n )\n}\n","import { Box } from '@chakra-ui/react'\nimport { useDesktop } from 'common/hooks/useDesktop'\nimport React from 'react'\nimport { CampaignFeature, CampaignFeatureProps } from '../../CampaignFeature'\n\n// eslint-disable-next-line @typescript-eslint/no-empty-interface\nexport interface FeaturedProps extends CampaignFeatureProps {}\n\nexport const Featured: React.FC = props => {\n const desktop = useDesktop()\n return (\n \n \n )\n}\n\nconst getFeaturedData = (data: any): FeaturedProps => {\n return {\n title: data.title,\n text: data.text,\n image: data.image,\n callToAction: {\n analyticsId: data.call_to_action__analytics_id,\n label: data.call_to_action__label,\n [`${data.call_to_action__iconlocation}Icon`]: data.call_to_action__icon,\n text: data.call_to_action__text,\n title: data.call_to_action__title,\n url: data.call_to_action__url,\n variant: data.call_to_action__variant\n }\n }\n}\n","import { Box } from '@chakra-ui/react'\nimport { Text } from '@irishlife/ilgroupdesignsystem.atoms.text'\nimport { useDesktop } from 'common/hooks/useDesktop'\nimport React from 'react'\n\nexport interface IframeProps {\n src?: string\n width?: string\n height?: number\n mobileHeight?: number\n title: string\n scrolling: string\n heading?: string\n text?: string\n}\n\nconst fullWidthWrapperStyles = {\n marginLeft: '-50vw',\n marginRight: '-50vw',\n width: '100vw',\n position: 'relative',\n left: '50%',\n right: '50%',\n display: 'flex',\n justifyContent: 'center'\n}\n\nexport const Iframe: React.FC = props => {\n const attributes = getIframeData(props)\n const desktop = useDesktop()\n\n const [expanded, setExpanded] = React.useState(false)\n // 0, 480, 768, 992, 1280, 1536\n const heights = {\n collapsed: [2450, 2300, 2050, 2000, 1900],\n expanded: [4550, 3700, 3200, 3100, 2900]\n }\n\n const handleIframeMessage = (event: any) => {\n if (\n JSON.stringify(event.data) === 'true' ||\n JSON.stringify(event.data) === 'false'\n ) {\n setExpanded(event.data)\n }\n }\n\n React.useEffect(() => {\n if (typeof window === 'undefined') return\n window.addEventListener('message', handleIframeMessage)\n return () => {\n if (typeof window === 'undefined') return\n window.removeEventListener('message', handleIframeMessage)\n }\n }, [])\n\n return (\n <>\n {attributes.heading && (\n \n {attributes.heading}\n \n )}\n {attributes.text && (\n \n {attributes.text}\n \n )}\n \n = (\n props\n) => {\n const { image, title, callToAction } = props\n\n const isMobile = !useDesktop()\n return (\n \n \n \n \n {title}\n \n \n navigate(callToAction.url)}\n {...callToAction}\n mt='32px'\n >\n {callToAction.label}\n \n \n \n \n \n )\n}\n","import { ImageWithParagraph } from 'common/components/organisms/ImageWithParagraph/index'\nimport React from 'react'\n\nconst ImageWithParagraphWrapper: React.FC<{ props: any }> = (props) => {\n const processedProps = getProps(props)\n\n return \n {\n TagManager.dataLayer({\n dataLayer: {\n event: 'secondaryButtonClick',\n clickURL: ctaConfig.bookingUrl,\n clickID: ctaConfig.bookingAnalyticsId\n }\n })\n if(ctaConfig.bookingUrl.charAt(0) === '#') {\n let element = document.getElementById(ctaConfig.bookingUrl.slice(1, ctaConfig.bookingUrl.length))\n element?.scrollIntoView({ behavior: \"smooth\"})\n } else {\n navigate(ctaConfig.bookingUrl)\n }\n }} onCalculate={() => {\n TagManager.dataLayer({\n dataLayer: {\n event: 'secondaryButtonClick',\n clickID: ctaConfig.calculateAnalyticsId\n }\n })\n }} />\n \n )\n}\n\nconst getCtaConfig = (data: any) => {\n return {\n bookingUrl: data.url,\n bookingAnalyticsId: data.booking_cta_analytics_id,\n calculateAnalyticsId: data.calculate_cta_analytics_id\n }\n}\n\n","import { Box, Image, VStack } from '@chakra-ui/react'\nimport { Text } from '@irishlife/ilgroupdesignsystem.atoms.text'\nimport React from 'react'\ninterface MediaCardProps {\n title?: string\n image?: string\n}\n\nexport const MediaCard: React.FC = ({ title, image }) => {\n return (\n \n \n \n {title}\n \n \n \n \n \n )\n}\n","import { MediaCard } from 'common/components/organisms/MediaCard/index'\nimport React, { FC } from 'react'\n\nconst MediaCardWrapper: FC<{ props: any }> = (props) => {\n const processedProps = getProps(props)\n\n return = ({\n to,\n children,\n ...props\n}) => {\n // Check if the URL is external\n const isExternal = (url: string) => {\n return /^(https?:|mailto:|tel:)/.test(url)\n }\n\n if (isExternal(to)) {\n return (\n \n {children}\n \n )\n } else {\n return (\n = (props: any) => {\n return (\n \n \n )\n}\n\nexport const getMenuCardGridProps = (props: any): GridProps => {\n return {\n title: props.title,\n children: [<>{getMenuCards(props.menucard)}],\n }\n}\n\nexport const getMenuCards = (menuCards: any[]): MenuCardProps[] => {\n return (menuCards || []).map((menuCard) => {\n return (\n = ({ item, onClick }) => {\n const classes = useStyles()\n const desktop = isDesktop\n return (\n onClick(item)}\n w={\n desktop\n ? ['112px', '124px', '178px', '182px', '222px']\n : '222px'\n }\n alignItems={'center'}\n maxHeight={'100%'}\n display='flex'\n bg={'#fff'}\n flexDirection='column'\n borderWidth='1px'\n borderRadius='lg'\n p={'24px 6px'}\n boxShadow={'0px 0px 20px 0px rgba(82, 97, 172, 0.24)'}\n className={classes.selectedCard}\n >\n {item?.icon && (\n \n {item?.branchName}\n \n \n )\n}\n","import { RouteComponentProps } from '@reach/router'\nimport React, { useState } from 'react'\nimport { Grid, GridItem, Box } from '@chakra-ui/react'\nimport { MetamoCard, ItemProps } from 'common/components/molecules/MetamoCard'\nimport { Text } from '@irishlife/ilgroupdesignsystem.atoms.text'\nimport { AdvisorBooking } from 'common/components/organisms/AdvisorBooking'\nimport { isDesktop } from 'react-device-detect'\nimport { PreScreen } from 'common/components/organisms/AdvisorBooking/utils/interface'\nexport interface Metamo extends RouteComponentProps {\n branchList: any\n}\n\nexport const Metamo: React.FC = (props) => {\n const branchList = getBranchList(props)\n const isAdvisorView = props.isadvisorview === 'yes' ? true : false\n const [selectedBranch, setSelectedBranch] = useState(\n branchList[0]\n )\n const desktop = isDesktop\n const [showAdvisorbooking, setShowAdvisorbooking] = useState(false)\n const handleClick = (value: ItemProps) => {\n setSelectedBranch(value)\n setShowAdvisorbooking(true)\n }\n return (\n \n \n \n Choose your branch\n \n \n {branchList.map((item: ItemProps) => (\n \n \n ))}\n \n \n {showAdvisorbooking && (\n \n \n Select an option that suits you\n \n \n )}\n \n )\n}\n\nconst getPreScreen = (\n isAdvisorView: boolean,\n selectedBranch: ItemProps\n): PreScreen => {\n return {\n metamoVariant: true,\n isAdvisorView: isAdvisorView,\n sourceBranchName: selectedBranch.branchName.replace(/ /g, ''),\n }\n}\nconst getBranchList = (data: any): ItemProps[] => {\n const branchList = data?.metamo_branch_list?.map((item: any) => ({\n branchName: item.branch_name,\n branchId: item.branch_id,\n icon: item.icon,\n }))\n return branchList\n}\n","import { Box, HStack, SimpleGrid } from '@chakra-ui/react'\nimport { Text } from '@irishlife/ilgroupdesignsystem.atoms.text'\nimport { Input } from '@irishlife/ilgroupdesignsystem.molecules.input'\nimport { Link } from 'common/components/atoms/Link'\nimport { useDesktop } from 'common/hooks/useDesktop'\nimport React from 'react'\n\ninterface MiniFooterProps {\n loginLink?: string\n}\n\nexport const MiniFooter: React.FC = (props) => {\n const { loginLink = '/' } = props\n\n const isMobile = !useDesktop()\n\n return (\n \n \n \n Keep in touch and stay informed about new job opportunities\n that match your interests.\n \n \n \n Create your profile\n \n\n \n \n Already registered? Log in\n \n \n \n \n \n \n )\n}\n","import React, { FC } from 'react'\nimport { MiniFooter } from 'common/components/organisms/MiniFooter/index'\n\nconst MiniFooterWrapper: FC<{ props: any }> = (props) => {\n const processedProps = getProps(props)\n\n return \n \n \n \n {card?.imageSrc && (\n \n \n )}\n \n \n \n {card?.imageLeft && (\n \n \n setIndex(number - 1)\n }\n />\n \n )}\n \n {title}\n \n \n \n {card.title}\n \n \n {card.subtitle2}\n \n \n \n {card?.subtitle}\n \n \n {card?.paragraph}\n \n \n {card?.children}\n \n \n \n {card?.callToAction?.label}\n \n \n \n \n \n {card?.secondaryButtonText}\n \n \n {!card?.imageLeft && (\n \n {\n setIndex(number - 1)\n }}\n />\n \n )}\n \n \n \n \n \n )\n}\n\nfunction Container(props: Record) {\n return (\n =\n (props) => {\n const { title, cards } = props\n\n const [selectedCardIndex, setSelectedCardIndex] = useState(0) // State to track selected card index\n const [currentPage, setCurrentPage] = useState(\n Math.floor(selectedCardIndex) / 3 + 1\n )\n const [visibleItems, setVisibleItems] = useState()\n\n const handleCardClick = (idx: number) => {\n const index = (currentPage - 1) * 3 + idx\n setSelectedCardIndex(index) // Update selected card index on click\n }\n\n const cardStyle = (index: number) => ({\n borderBottom:\n index === selectedCardIndex\n ? ' 6px solid #039FBF'\n : '2px solid transparent',\n })\n\n const [isMobile] = useMediaQuery('(max-width: 720px)')\n\n useEffect(() => {\n const startIndex = (currentPage - 1) * 3\n const endIndex = startIndex + 3\n setVisibleItems(cards.slice(startIndex, endIndex))\n }, [currentPage, cards])\n\n useEffect(() => {\n setCurrentPage(Math.floor(selectedCardIndex / 3) + 1)\n }, [selectedCardIndex])\n\n const currentCard = cards[selectedCardIndex]\n return (\n \n \n \n {title}\n \n \n\n {!isMobile ? (\n \n \n {visibleItems?.map((card, index) => (\n handleCardClick(index)}\n >\n \n \n \n {card.title}\n \n \n \n \n ))}\n \n \n ) : (\n \n \n \n \n \n {currentCard.title}\n \n \n \n \n \n )}\n\n \n \n \n \n \n \n \n \n setSelectedCardIndex(number - 1)\n }\n />\n \n \n \n {currentCard.title}\n \n \n \n {currentCard.text}\n \n \n \n \n \n \n \n \n )\n }\n","import { MultiCardGalleryWithStepper } from 'common/components/organisms/MultiCardGalleryWithStepper/index'\nimport React, { FC } from 'react'\n\nconst MultiCardGalleryWithStepperWrapper: FC<{ props: any }> = (props) => {\n const processedProps = getProps(props)\n\n return = ({\n title,\n caption,\n items,\n}) => {\n const [selectedCardIndex, setSelectedCardIndex] = useState(0)\n const [visibleItems, setVisibleItems] = useState<{ title: string }[]>([])\n const [currentPage, setCurrentPage] = useState(1)\n const isMobile = !useDesktop()\n\n const cardStyle = (index: number) => ({\n borderBottom:\n index === selectedCardIndex\n ? ' 6px solid #039FBF'\n : '2px solid transparent',\n })\n\n const handlePagination = (paginationItems: any) => {\n setVisibleItems(paginationItems.visibleItems)\n setCurrentPage(paginationItems.currentPage)\n }\n\n return (\n \n \n \n \n \n {title}\n \n \n \n \n {caption}\n \n \n \n \n\n \n {visibleItems?.map((item, index) => (\n \n setSelectedCardIndex(\n (currentPage - 1) * (isMobile ? 1 : 4) + index\n )\n }\n display='flex'\n alignItems='center'\n justifyContent='center'\n cursor={'pointer'}\n >\n \n \n {item.title}\n \n \n \n ))}\n \n\n \n \n\n \n \n \n )\n}\n","import { MultiFeatureList } from 'common/components/organisms/MultiFeatureList/index'\nimport React, { FC } from 'react'\n\nconst MultiFeatureListWrapper: FC<{ props: any }> = (props) => {\n const processedProps = getProps(props)\n\n return ([])\n\n const handlePagination = (array: any) => {\n setVisibleItems(array.visibleItems)\n }\n\n return (\n <>\n \n {visibleItems.map((card, idx) => (\n \n \n ))}\n \n \n \n \n )\n}\n","import { Box } from '@chakra-ui/react'\nimport { Text } from '@irishlife/ilgroupdesignsystem.atoms.text'\nimport React from 'react'\nimport { PaginatedCards } from '../../molecules/PaginatedCards/index'\n\ninterface Card {\n icon: string\n description: string\n}\n\ninterface ItemsProps {\n cardTitle?: string\n cards: Card[]\n}\n\ninterface MultiPaginatedCardsProps {\n title: string\n subTitle: string\n items: ItemsProps[]\n secondSubtitle?: string\n secondTitle?: string\n}\n\nexport const MultiPaginatedCards: React.FC = (\n props\n) => {\n const { title, subTitle, items, secondSubtitle, secondTitle } = props\n\n return (\n \n \n {title}\n \n \n {subTitle}\n \n \n \n {item.cardTitle}\n \n \n \n \n ))}\n \n {secondSubtitle}\n \n \n {secondTitle}\n \n \n )\n}\n","import { MultiPaginatedCards } from 'common/components/organisms/MultiPaginatedCards/index'\nimport React, { FC } from 'react'\n\nconst MultiPaginatedCardsWrapper: FC<{ props: any }> = (props) => {\n const processedProps = getProps(props)\n\n return = (props) => {\n const notices = getNotices(props)\n const variant = props.variant\n const displayTitle = props.displaytitle\n if (variant === 'compact') {\n return (\n <>\n {displayTitle === 'true' && (\n Notices \n )}\n {notices?.length > 0 && (\n \n {notices?.map((notice, index) => (\n \n )}\n \n )\n }\n return (\n <>\n {notices?.length > 0 && (\n \n \n {notices?.map((notice, index) => (\n \n \n )}\n \n )\n}\n\nconst getNotices = (data: any): NoticeProps[] => {\n const notices = (data.notices || []).map((notice: any) => ({\n title: notice.title,\n text: notice.text,\n subTitle: notice.subTitle ? notice.subTitle : notice.subtitle,\n variant: notice.variant,\n noticeVariant: data.variant,\n callToAction: {\n label: notice.call_to_action__label,\n [`${notice.call_to_action__iconlocation}Icon`]:\n notice.call_to_action__icon,\n text: notice.call_to_action__text,\n title: notice.call_to_action__title,\n url: notice.call_to_action__url,\n variant: notice.call_to_action__variant,\n },\n }))\n return notices\n}\n","import 'core-js/modules/es.object.assign.js';\nimport { createIcon, Box, Center, Text } from '@chakra-ui/react';\nimport React from 'react';\nvar dict = {\n health: {\n inforce: {\n color: 'pillar.health',\n rgba: 'rgba(3, 159, 191, 0.1)'\n },\n lapsed: {\n color: 'pillar.lapsed',\n rgba: 'rgba(238, 135, 14, 0.1)'\n },\n surrendered: {\n color: 'pillar.surrendered',\n rgba: 'rgba(157, 152, 176, 0.1)'\n }\n },\n life: {\n inforce: {\n color: 'pillar.life',\n rgba: 'rgba(33, 150, 243, 0.1)'\n },\n lapsed: {\n color: 'pillar.lapsed',\n rgba: 'rgba(238, 135, 14, 0.1)'\n },\n surrendered: {\n color: 'pillar.surrendered',\n rgba: 'rgba(157, 152, 176, 0.1)'\n }\n },\n pensions: {\n inforce: {\n color: 'pillar.pensions',\n rgba: 'rgba(113, 127, 226, 0.1)'\n },\n lapsed: {\n color: 'pillar.lapsed',\n rgba: 'rgba(238, 135, 14, 0.1)'\n },\n surrendered: {\n color: 'pillar.surrendered',\n rgba: 'rgba(157, 152, 176, 0.1)'\n }\n },\n investments: {\n inforce: {\n color: 'pillar.investments',\n rgba: 'rgba(157, 71, 184, 0.1)'\n },\n lapsed: {\n color: 'pillar.lapsed',\n rgba: 'rgba(238, 135, 14, 0.1)'\n },\n surrendered: {\n color: 'pillar.surrendered',\n rgba: 'rgba(157, 152, 176, 0.1)'\n }\n },\n smartinvest: {\n inforce: {\n color: 'pillar.investments',\n rgba: 'rgba(157, 71, 184, 0.1)'\n },\n lapsed: {\n color: 'pillar.lapsed',\n rgba: 'rgba(238, 135, 14, 0.1)'\n },\n surrendered: {\n color: 'pillar.surrendered',\n rgba: 'rgba(157, 152, 176, 0.1)'\n }\n },\n financialplan: {\n inforce: {\n color: 'pillar.life',\n rgba: 'rgba(33, 150, 243, 0.1)'\n },\n lapsed: {\n color: 'pillar.lapsed',\n rgba: 'rgba(238, 135, 14, 0.1)'\n },\n surrendered: {\n color: 'pillar.surrendered',\n rgba: 'rgba(157, 152, 176, 0.1)'\n }\n },\n wellbeing: {\n inforce: {\n color: 'pillar.wellbeing',\n rgba: 'rgba(150, 201, 25, 1)'\n },\n lapsed: {\n color: 'pillar.lapsed',\n rgba: 'rgba(150, 201, 25, 1)'\n },\n surrendered: {\n color: 'pillar.surrendered',\n rgba: 'rgba(150, 201, 25, 1)'\n }\n }\n};\nvar fontSizes = {\n sm: 32,\n md: 64,\n xsm: 28,\n xxsm: 22,\n msm: 52\n};\n\nfunction PillarIcon(props) {\n var _props$variant = props.variant,\n variant = _props$variant === void 0 ? 'health' : _props$variant,\n _props$size = props.size,\n size = _props$size === void 0 ? 'md' : _props$size,\n _props$isDisabled = props.isDisabled,\n isDisabled = _props$isDisabled === void 0 ? false : _props$isDisabled,\n _props$planStatus = props.planStatus,\n planStatus = _props$planStatus === void 0 ? 'inforce' : _props$planStatus;\n var pillarIcon = React.useMemo(function () {\n var color = isDisabled ? 'vibrant.300' : variant === 'proposal' ? 'pillar.proposal' : dict[variant][planStatus].color;\n return function () {\n return {\n health: /*#__PURE__*/React.createElement(HealthIcon, {\n color: color,\n fontSize: fontSizes[size]\n }),\n life: /*#__PURE__*/React.createElement(LifeIcon, {\n color: color,\n fontSize: fontSizes[size]\n }),\n pensions: /*#__PURE__*/React.createElement(PensionsIcon, {\n color: color,\n fontSize: fontSizes[size]\n }),\n investments: /*#__PURE__*/React.createElement(InvestmentsIcon, {\n color: color,\n fontSize: fontSizes[size]\n }),\n smartinvest: /*#__PURE__*/React.createElement(InvestmentsIcon, {\n color: color,\n fontSize: fontSizes[size]\n }),\n financialplan: /*#__PURE__*/React.createElement(FinancialPlan, {\n color: color,\n fontSize: fontSizes[size]\n }),\n wellbeing: /*#__PURE__*/React.createElement(WellbeingIcon, {\n color: color,\n fontSize: fontSizes[size]\n }),\n proposal: /*#__PURE__*/React.createElement(ProposalIcon, {\n color: color,\n fontSize: fontSizes[size]\n })\n };\n }()[variant];\n }, [variant, size, isDisabled, planStatus]);\n return /*#__PURE__*/React.createElement(Wrapper, Object.assign({}, props), pillarIcon);\n}\n\nfunction Wrapper(props) {\n if (props.filled) return /*#__PURE__*/React.createElement(Circle, Object.assign({}, props));\n return /*#__PURE__*/React.createElement(Box, {\n \"data-testid\": 'PillarIcon'\n }, props.children);\n}\n\nfunction Circle(props) {\n var children = props.children,\n _props$variant2 = props.variant,\n variant = _props$variant2 === void 0 ? 'health' : _props$variant2,\n count = props.count,\n _props$size2 = props.size,\n size = _props$size2 === void 0 ? 'md' : _props$size2,\n _props$isDisabled2 = props.isDisabled,\n isDisabled = _props$isDisabled2 === void 0 ? false : _props$isDisabled2,\n _props$planStatus2 = props.planStatus,\n planStatus = _props$planStatus2 === void 0 ? 'inforce' : _props$planStatus2;\n var showCount = typeof count === 'number' && size === 'md' && !isDisabled;\n var rgba = isDisabled ? 'rgba(156, 165, 235, 0.1)' : dict[variant][planStatus].rgba; //styles[variant].rgba\n\n return /*#__PURE__*/React.createElement(Box, {\n \"data-testid\": 'PillarIcon'\n }, /*#__PURE__*/React.createElement(Center, {\n w: size === 'sm' ? '56px !important' : size === 'xsm' ? '42px' : size === 'xxsm' ? '36px' : '112px',\n h: size === 'sm' ? '56px !important' : size === 'xsm' ? '42px' : size === 'xxsm' ? '36px' : '112px',\n borderWidth: size === 'sm' ? '2px' : size === 'xsm' ? '1.5px' : size === 'xxsm' ? '1.5px' : '3px',\n borderColor: rgba,\n rounded: 'full',\n position: 'relative',\n bgColor: 'white'\n }, /*#__PURE__*/React.createElement(Center, {\n boxSize: size === 'sm' ? 12 : size === 'xsm' ? 9 : size === 'xxsm' ? 7 : 24,\n bg: rgba,\n rounded: 'full',\n opacity: 'none'\n }, children), showCount && /*#__PURE__*/React.createElement(Count, {\n variant: variant,\n count: count\n })));\n}\n\nfunction Count(props) {\n var variant = props.variant,\n count = props.count,\n planStatus = props.planStatus;\n var color = dict[variant][planStatus].color; //styles[variant].color\n\n return /*#__PURE__*/React.createElement(Center, {\n position: 'absolute',\n bottom: 0,\n right: 0,\n rounded: 'full',\n p: 2,\n borderWidth: '2px',\n boxSize: '30px',\n borderColor: color,\n bg: 'white'\n }, /*#__PURE__*/React.createElement(Text, {\n p: 0,\n m: 0,\n fontWeight: 600,\n fontSize: '16px'\n }, count));\n}\n\nvar LifeIcon = createIcon({\n displayName: 'LifeIcon',\n viewBox: '0 0 64 64',\n path: [/*#__PURE__*/React.createElement(\"path\", {\n d: 'M33.038 32.849v16.71A5.457 5.457 0 0 1 27.598 55a5.457 5.457 0 0 1-5.442-5.44',\n stroke: 'currentColor',\n strokeWidth: '2',\n strokeLinecap: 'round',\n strokeLinejoin: 'round',\n fill: 'transparent'\n }), /*#__PURE__*/React.createElement(\"path\", {\n d: 'M12.155 32.82c4.208 0 7.887 1.853 9.956 4.628 2.069-2.775 5.748-4.628 9.955-4.628 4.208 0 8.216 1.752 10.285 4.527 2.07-2.775 5.42-4.527 9.627-4.527a13.602 13.602 0 0 1 5.154 1.005C56.178 21.296 45.334 11.41 32.066 11.41 18.795 11.41 7.95 21.302 7 33.836a13.574 13.574 0 0 1 5.155-1.016v0Z',\n fill: 'currentColor',\n fillOpacity: '.2',\n stroke: 'currentColor',\n strokeWidth: '2',\n strokeLinecap: 'round',\n strokeLinejoin: 'round'\n }), /*#__PURE__*/React.createElement(\"path\", {\n d: 'M31.939 8v3.175a.51.51 0 0 1-.17.384c-1.3 1.183-9.658 9.425-9.658 25.888M32.486 11.41s9.864 7.761 9.864 25.613',\n stroke: 'currentColor',\n strokeWidth: '2',\n strokeLinecap: 'round',\n strokeLinejoin: 'round',\n fill: 'transparent'\n })]\n});\nvar HealthIcon = createIcon({\n displayName: 'HealthIcon',\n viewBox: '0 0 64 64',\n path: [/*#__PURE__*/React.createElement(\"path\", {\n d: 'M32.064 16.703S34.895 9 44.255 9c9.36 0 19.254 9.662 10.359 26.617C47.088 49.962 34.58 55.097 32.126 56h-.004c-2.455-.904-15.093-6.038-22.619-20.383C.608 18.662 10.365 9 19.726 9c9.36 0 12.327 7.703 12.327 7.703',\n fill: 'currentColor',\n fillOpacity: '.2'\n }), /*#__PURE__*/React.createElement(\"path\", {\n d: 'M32.064 16.703S34.895 9 44.255 9c9.36 0 19.254 9.662 10.359 26.617C47.088 49.962 34.58 55.097 32.126 56h-.004c-2.455-.904-15.093-6.038-22.619-20.383C.608 18.662 10.365 9 19.726 9c9.36 0 12.327 7.703 12.327 7.703',\n stroke: 'currentColor',\n strokeWidth: '2',\n strokeLinecap: 'round',\n strokeLinejoin: 'round',\n fill: 'transparent'\n }), /*#__PURE__*/React.createElement(\"path\", {\n d: 'M7.97 30.975h9.514l4.008 7.24 6.66-14.473L36.01 40.04l7.522-15.114 3.142 6.577h9.154',\n stroke: 'currentColor',\n strokeWidth: '2',\n strokeLinecap: 'round',\n strokeLinejoin: 'round',\n fill: 'transparent'\n })]\n});\nvar PensionsIcon = createIcon({\n displayName: 'PensionsIcon',\n viewBox: '0 0 64 64',\n path: [/*#__PURE__*/React.createElement(\"path\", {\n d: 'M39.012 27.998c3.36 10.199-1.166 17.302-8.805 19.826-7.639 2.524-15.498-.487-18.859-10.686-3.36-10.2-.95-23.724 6.688-26.248 7.64-2.524 17.615 6.909 20.976 17.108Z',\n fill: '#D8DBF7',\n stroke: 'currentColor',\n strokeWidth: '2',\n strokeLinecap: 'round',\n strokeLinejoin: 'round'\n }), /*#__PURE__*/React.createElement(\"path\", {\n d: 'M24.299 33c-.168-2.42.227-5.123 1.303-8.07 3.685-10.086 13.956-19.195 21.51-16.428 7.078 2.592 9.26 14.687 6.48 24.498H24.298Z',\n stroke: 'currentColor',\n strokeWidth: '2',\n strokeLinecap: 'round',\n strokeLinejoin: 'round',\n fill: '#D8DBF7'\n }), /*#__PURE__*/React.createElement(\"path\", {\n id: 'one',\n d: 'M57.803 32.942C57.803 45.125 46.206 55 31.9 55 17.596 55 6 45.125 6 32.942h51.803Z',\n fill: '#D8DBF7',\n stroke: 'currentColor',\n strokeWidth: '2',\n strokeLinecap: 'round',\n strokeLinejoin: 'round'\n }), /*#__PURE__*/React.createElement(\"path\", {\n d: 'M8.346 39.626h10.157M39.271 41.771h15.59M30.823 47.408H22.5',\n stroke: 'currentColor',\n strokeWidth: '2',\n strokeLinecap: 'round',\n strokeLinejoin: 'round'\n })]\n});\nvar InvestmentsIcon = createIcon({\n displayName: 'InvestmentsIcon',\n viewBox: '0 0 64 64',\n path: [/*#__PURE__*/React.createElement(\"path\", {\n d: 'M31.957 43.772C8.985 47.32 7 22.742 7 22.742c15.736-2.43 23.906 6.955 25.227 15.272',\n fill: 'currentColor',\n fillOpacity: '.2'\n }), /*#__PURE__*/React.createElement(\"path\", {\n d: 'M31.957 43.772C8.985 47.32 7 22.742 7 22.742c15.736-2.43 23.906 6.955 25.227 15.272',\n stroke: 'currentColor',\n strokeWidth: '2',\n fill: 'transparent'\n }), /*#__PURE__*/React.createElement(\"path\", {\n d: 'M32.259 56V32.955S29.839 9 57.166 9c0 0 2.73 26.865-24.286 26.865',\n fill: 'currentColor',\n fillOpacity: '.2'\n }), /*#__PURE__*/React.createElement(\"path\", {\n d: 'M32.259 56V32.955S29.839 9 57.166 9c0 0 2.73 26.865-24.286 26.865M56.282 9.873l-22.95 25.322M7 22.742l25.01 19.439',\n stroke: 'currentColor',\n strokeWidth: '2',\n fill: 'transparent'\n })]\n});\nvar FinancialPlan = createIcon({\n displayName: 'FinancialPlan',\n viewBox: '0 0 25 24',\n path: [/*#__PURE__*/React.createElement(\"path\", {\n \"clip-rule\": 'evenodd',\n d: 'M9.75 7.761a1 1 0 0 1 1-1h11.5a1 1 0 0 1 1 1v14.5a1 1 0 0 1-1 1h-11.5a1 1 0 0 1-1-1v-14.5Z',\n stroke: 'currentColor',\n fill: 'transparent',\n strokeWidth: '1',\n strokeLinecap: 'round',\n strokeLinejoin: 'round'\n }), /*#__PURE__*/React.createElement(\"path\", {\n d: 'M9.75 20.261h-3a1.5 1.5 0 0 1-1.5-1.5v-13.5a1.5 1.5 0 0 1 1.5-1.5h10.5a1.5 1.5 0 0 1 1.5 1.5v1.5',\n stroke: 'currentColor',\n fill: 'transparent',\n strokeWidth: '1',\n strokeLinecap: 'round',\n strokeLinejoin: 'round'\n }), /*#__PURE__*/React.createElement(\"path\", {\n d: 'M5.25 17.261h-3a1.5 1.5 0 0 1-1.5-1.5v-13.5a1.5 1.5 0 0 1 1.5-1.5h10.5a1.5 1.5 0 0 1 1.5 1.5v1.5M17.25 11.261h3M12.75 10.511l.75.75 1.5-1.5M17.25 15.761h3M12.75 15.011l.75.75 1.5-1.5M17.25 20.261h3M12.75 19.511l.75.75 1.5-1.5',\n stroke: 'currentColor',\n fill: 'transparent',\n strokeWidth: '1',\n strokeLinecap: 'round',\n strokeLinejoin: 'round'\n })]\n});\nvar WellbeingIcon = createIcon({\n displayName: 'Wellbeing',\n viewBox: '0 0 30 40',\n path: [/*#__PURE__*/React.createElement(\"path\", {\n d: 'M10.2261 6.4648C10.2261 5.51583 10.5075 4.58817 11.0347 3.79913C11.5619 3.01009 12.3113 2.39511 13.188 2.03195C14.0647 1.6688 15.0295 1.57378 15.9602 1.75891C16.891 1.94405 17.7459 2.40102 18.4169 3.07205C19.0879 3.74307 19.5449 4.59801 19.73 5.52874C19.9152 6.45948 19.8202 7.42421 19.457 8.30095C19.0939 9.17768 18.4789 9.92704 17.6898 10.4543C16.9008 10.9815 15.9731 11.2629 15.0242 11.2629C13.7516 11.2629 12.5312 10.7574 11.6314 9.85756C10.7316 8.95774 10.2261 7.73733 10.2261 6.4648V6.4648Z',\n stroke: 'currentColor',\n fill: 'transparent',\n strokeWidth: '2',\n strokeLinecap: 'round',\n strokeLinejoin: 'round',\n vectorEffect: 'non-scaling-stroke'\n }), /*#__PURE__*/React.createElement(\"path\", {\n d: 'M29.4959 11.9284C29.292 11.417 28.8958 11.0059 28.3924 10.7831C27.889 10.5603 27.3183 10.5436 26.8027 10.7366L17.3614 14.3893H12.8574L3.86482 10.9068C3.34965 10.7016 2.77404 10.7094 2.26463 10.9286C1.75522 11.1477 1.35373 11.5602 1.14848 12.0754C0.943238 12.5906 0.951048 13.1662 1.1702 13.6756C1.38934 14.185 1.80188 14.5865 2.31705 14.7917L10.35 17.8873V23.2426L4.65418 33.5971C4.32112 34.1988 4.23998 34.9079 4.42853 35.5693C4.61708 36.2307 5.05995 36.7904 5.66023 37.126C6.047 37.3449 6.48501 37.4571 6.9294 37.4511C7.39285 37.4521 7.84815 37.3292 8.24818 37.0952C8.6482 36.8612 8.97841 36.5245 9.20462 36.12L14.5444 26.4929H15.5195L20.72 36.8939C20.9325 37.3278 21.263 37.6931 21.6737 37.9477C22.0844 38.2023 22.5585 38.3359 23.0417 38.3333C23.4848 38.3295 23.9197 38.2132 24.3055 37.9953C24.6914 37.7774 25.0156 37.465 25.2477 37.0875C25.4797 36.71 25.6121 36.2797 25.6323 35.8371C25.6526 35.3944 25.56 34.9538 25.3633 34.5567L19.6675 23.1806V17.9956L28.2886 14.6989C28.5538 14.6016 28.7965 14.4516 29.0021 14.2579C29.2077 14.0642 29.3719 13.8308 29.4848 13.5718C29.5976 13.3129 29.6568 13.0337 29.6587 12.7512C29.6606 12.4688 29.6052 12.1888 29.4959 11.9284Z',\n stroke: 'currentColor',\n fill: 'transparent',\n strokeWidth: '2',\n strokeLinecap: 'round',\n strokeLinejoin: 'round',\n vectorEffect: 'non-scaling-stroke'\n })]\n});\nvar ProposalIcon = createIcon({\n displayName: 'Proposal',\n viewBox: '0 0 21 22',\n path: [/*#__PURE__*/React.createElement(\"path\", {\n fillRule: 'evenodd',\n clipRule: 'evenodd',\n d: 'M4.875 2.87427H2.375C1.68464 2.87427 1.125 3.43391 1.125 4.12427V19.1243C1.125 19.8146 1.68464 20.3743 2.375 20.3743H18.625C19.3154 20.3743 19.875 19.8146 19.875 19.1243V4.12427C19.875 3.43391 19.3154 2.87427 18.625 2.87427H9.875',\n fill: 'white'\n }), /*#__PURE__*/React.createElement(\"path\", {\n d: 'M4.875 2.87427H2.375C1.68464 2.87427 1.125 3.43391 1.125 4.12427V19.1243C1.125 19.8146 1.68464 20.3743 2.375 20.3743H18.625C19.3154 20.3743 19.875 19.8146 19.875 19.1243V4.12427C19.875 3.43391 19.3154 2.87427 18.625 2.87427H9.875',\n stroke: 'currentColor',\n strokeWidth: '1.5',\n strokeLinecap: 'round',\n strokeLinejoin: 'round',\n fill: 'white'\n }), /*#__PURE__*/React.createElement(\"path\", {\n id: 'Shape_2',\n fillRule: 'evenodd',\n clipRule: 'evenodd',\n d: 'M9.875 10.3743L7.375 8.5001L4.875 10.3751V2.2501C4.87478 2.0842 4.94053 1.92501 5.05776 1.80762C5.175 1.69023 5.3341 1.62427 5.5 1.62427H9.25C9.59518 1.62427 9.875 1.90409 9.875 2.24927V10.3743Z',\n fill: 'white',\n stroke: 'currentColor',\n strokeWidth: '1.5',\n strokeLinecap: 'round',\n strokeLinejoin: 'round'\n }), /*#__PURE__*/React.createElement(\"path\", {\n fillRule: 'evenodd',\n clipRule: 'evenodd',\n d: 'M4.875 16.6243H13.625H4.875Z',\n fill: 'white'\n }), /*#__PURE__*/React.createElement(\"path\", {\n d: 'M4.875 16.6243H13.625',\n stroke: 'currentColor',\n strokeWidth: '1.5',\n strokeLinecap: 'round',\n strokeLinejoin: 'round'\n }), /*#__PURE__*/React.createElement(\"path\", {\n fillRule: 'evenodd',\n clipRule: 'evenodd',\n d: 'M4.875 12.8743H16.125H4.875Z',\n fill: 'white'\n }), /*#__PURE__*/React.createElement(\"path\", {\n d: 'M4.875 12.8743H16.125',\n stroke: 'currentColor',\n strokeWidth: '1.5',\n strokeLinecap: 'round',\n strokeLinejoin: 'round'\n }), /*#__PURE__*/React.createElement(\"path\", {\n fillRule: 'evenodd',\n clipRule: 'evenodd',\n d: 'M16.125 9.12427H12.375H16.125Z',\n fill: 'white'\n }), /*#__PURE__*/React.createElement(\"path\", {\n d: 'M16.125 9.12427H12.375',\n stroke: 'currentColor',\n strokeWidth: '1.5',\n strokeLinecap: 'round',\n strokeLinejoin: 'round'\n })]\n});\nexport { PillarIcon };","import { Stack, useMediaQuery } from '@chakra-ui/react'\nimport { Button } from '@irishlife/ilgroupdesignsystem.atoms.button'\nimport {\n ArrowRightCircleIcon,\n ChevronRightIcon,\n} from '@irishlife/ilgroupdesignsystem.icons'\nimport { Card } from '@irishlifedigitalhub/ds.atoms.card'\nimport { PillarIcon } from '@irishlifedigitalhub/ds.atoms.pillar-icon'\nimport { Text } from '@irishlifedigitalhub/ds.atoms.text'\nimport { navigate } from '@reach/router'\nimport { fireAnalyticsEvent } from 'common/utils/fireAnalyticsEvent'\nimport React from 'react'\n\ntype BorderVariants =\n | 'life'\n | 'investments'\n | 'health'\n | 'pensions'\n | 'wellbeing'\n\nexport type PillarCardProps = {\n text: string\n variant: BorderVariants\n primaryCta: {\n label: string\n url: string\n analyticsId: string\n hide_cta?: 'Yes' | 'No'\n }\n secondaryCta: {\n label: string\n url: string\n analyticsId: string\n }\n}\n\nconst contentPropsMap = {\n life: {\n text: 'Life Insurance',\n },\n investments: {\n text: 'Investments',\n },\n health: {\n text: 'Health Insurance',\n },\n pensions: {\n text: 'Pensions',\n },\n wellbeing: {\n text: 'Wellbeing',\n },\n}\n\nexport function PillarCard(props: Readonly): JSX.Element {\n const { variant = 'health', text, primaryCta, secondaryCta } = props\n const { text: pillarName } = contentPropsMap[variant]\n const [isMobileExtraSmall, isMobile] = useMediaQuery([\n '(max-width: 373px)',\n '(max-width: 543px)',\n ])\n\n return (\n \n \n \n \n {pillarName}\n \n \n {text} \n \n {((!primaryCta.hide_cta) || (primaryCta.hide_cta && primaryCta.hide_cta === 'No')) &&\n = ({\n pillars,\n subtitle,\n subtitle___color,\n title,\n title___color\n}) => {\n return (\n \n {title && (\n \n { title }\n \n )}\n {subtitle && (\n \n { subtitle }\n \n )}\n \n {pillars.map((pillar) => (\n \n \n )\n}\n","import {\n Pillars as PillarsOrganism,\n PillarsProps as PillarsOrganismProps,\n} from 'common/components/organisms/Pillars'\nimport React from 'react'\n\nexport interface PillarsProps extends PillarsOrganismProps {}\n\nexport const Pillars: React.FC = (props) => {\n return (\n <>\n = ({\n label = 'Learn more',\n variant = 'ghost',\n onClick,\n url = '',\n ishighlighted,\n}) => {\n return (\n {\n TagManager.dataLayer({\n dataLayer: {\n event: 'secondaryButtonClick',\n clickText: label,\n clickURL: url,\n clickID: label,\n },\n })\n if (onClick) {\n onClick()\n }\n }}\n path={url}\n >\n \n = ({\n ishighlighted = false,\n icon,\n text,\n title,\n iconSize = 'md',\n subtitle,\n callToAction,\n}) => {\n return (\n <>\n \n {icon && (\n \n {title}\n \n {subtitle && (\n \n {subtitle}\n \n )}\n \n {text}\n \n {callToAction && callToAction.label && (\n = ({\n title,\n subTitle,\n text,\n productRowLists,\n}) => {\n const desktop = useDesktop()\n return (\n \n \n {title}\n \n \n \n {subTitle && (\n \n {subTitle}\n \n )}\n \n \n {productRowLists.map((productRowList: any) => (\n \n \n ))}\n \n \n \n \n )\n}\n","import {\n ProductRowLists,\n ProductRowListsProps,\n} from 'common/components/organisms/ProductRowLists'\nimport React from 'react'\n\nexport interface ProductListingProps extends ProductRowListsProps {}\nexport const ProductListing: React.FC = (props) => {\n return = ({\n cards,\n heading,\n variant,\n}) => {\n const isDark = variant === 'dark' ? true : false\n const background = isDark ? theme.palette.VIBRANT_700 : 'transparent'\n\n const lightStyles = {\n color: theme.palette.BRAND_900,\n }\n\n const darkStyles = {\n color: '#fff',\n ' p': {\n color: '#fff',\n },\n }\n\n return (\n \n \n {heading && (\n \n \n {heading}\n \n \n )}\n \n {cards?.map((card) => (\n \n {card.icon && (\n \n {card.title}\n \n {card.text && (\n \n {card.text}\n \n )}\n {card.callToAction &&\n !Array.isArray(card.callToAction) &&\n card.callToAction.label && (\n \n {\n if (card.callToAction.url) {\n navigate(\n card.callToAction.url\n )\n }\n }}\n >\n {card.callToAction.label}\n \n \n )}\n \n ))}\n \n \n \n )\n}\n","import React from 'react'\nimport { ProofPoints, ProofPointsProps } from '../../ProofPoints'\n\n// eslint-disable-next-line @typescript-eslint/no-empty-interface\nexport interface ProofPointsSectionProps extends ProofPointsProps {}\n\nexport const ProofPointsSection: React.FC = props => {\n return \n \n {icon}\n \n \n \n {title}\n \n\n \n \n \n \n )\n}\n\nexport default CustomPoplink\n","import { Box, Grid, Image, Text } from '@chakra-ui/react'\nimport { navigate } from '@reach/router'\nimport React from 'react'\nimport CustomPoplink from '../../molecules/CustomPoplink/CustomPoplink'\n\nexport interface Items {\n icon: string\n title: string\n url: string\n}\n\nexport interface ResourcesWithLinksProps {\n title: string\n subtitle: string\n description: string\n poplink: Items[]\n}\n\nconst JsxIcon = (imageUrl: string) => (\n = (\n props\n) => {\n const { title, subtitle, description, poplink = [] } = props\n\n return (\n \n \n \n \n {title}\n \n \n {subtitle}\n \n {description && (\n \n {description}\n \n )}\n \n\n \n \n {poplink &&\n poplink.map((item, index) => (\n \n navigate(item.url)}\n />\n \n ))}\n \n \n \n \n )\n}\n","import React, { FC } from 'react'\nimport { ResourcesWithLinks } from 'common/components/organisms/ResourcesWithLinks/index'\n\nconst ResourcesWithLinksWrapper: FC<{ props: any }> = (props) => {\n const processedProps = getProps(props)\n\n return \n \n )\n })\n}\n\nconst getSharedCardProps = (sharedCard: any): ShardCardProps => {\n return {\n subTitle: sharedCard.templatesection___shardcard__title\n ? sharedCard.templatesection___shardcard__title\n : '',\n body: sharedCard.templatesection___shardcard__text,\n callback: () =>\n handleCallBack(sharedCard?.templatesection___shardcard__cta[0]),\n callbackLabel:\n sharedCard?.templatesection___shardcard__cta[0]\n ?.call_to_action__label,\n callbackVariant:\n sharedCard?.templatesection___shardcard__cta[0]\n ?.call_to_action__variant === 'contained'\n ? 'primary'\n : 'secondary',\n callbackSize: 'md',\n image: 'Shared card image',\n imageSrc: sharedCard.templatesection___shardcard__image,\n imageBottom: false,\n }\n}\n\nconst handleCallBack = (data: any): any => {\n TagManager.dataLayer({\n dataLayer: {\n event: 'primaryButtonClick',\n clickText: data?.call_to_action__label,\n clickURL: data?.call_to_action__url,\n clickID: data?.call_to_action__analytics_id,\n },\n })\n navigate(data?.call_to_action__url || '')\n}\n","import React from 'react'\n// import './SupportCenter.css'\n\nconst SupportCenter: React.FC = () => {\n // useEffect(() => {\n // const head = document.querySelector('head')\n // setTimeout(() => {\n // if (head) {\n // // Added null check for head\n // head.insertAdjacentHTML(\n // 'beforeend',\n // `
\n}\n\nexport default SupportCenter\n","import React from 'react'\nimport { ComparisonTable } from '@irishlife/ilgroupdesignsystem.table'\nexport const Table: React.FC = (props) => {\n const data = getTableData(props)\n return ()\n\n useEffect(() => {\n setValue(value === undefined ? '' : value)\n }, [value])\n\n const handleChange = (event: React.ChangeEvent<{ value: unknown }>) => {\n setValue(event.target.value as string)\n onChange(event.target.value)\n }\n \n return (\n \n \n Select an option{' '}\n {isOptional && showOptional && (\n - optional \n )}\n \n {options &&\n options.length > 0 &&\n options.map(({ value, label }: any) => (\n \n {label}\n \n ))}\n \n \n )\n}\n","import React from 'react'\nimport { Theme, withStyles } from '@material-ui/core/styles'\nimport { Styles } from '@material-ui/core/styles/withStyles'\nimport { SimpleSelect } from '../../atoms/select'\nimport { Label } from '../../atoms/label'\nimport { theme } from '../../theme'\n\nexport interface SelectProps {\n value: string | number\n isDisabled?: boolean\n options: {\n value: string | number\n label: string\n }[]\n isOptional?: boolean\n isDarkBackground?: boolean\n onChange?: () => void\n label?: string\n}\n\nconst { palette } = theme\n\nconst styles: Styles = {\n root: {\n width: '328px'\n },\n darkBackground: {\n backgroundColor: 'rgb(245, 244, 247)'\n },\n optional: {\n fontSize: '14px',\n letterSpacing: '0.32px',\n lineHeight: '20px',\n fontFamily: 'Assistant',\n color: palette.NEUTRAL_700,\n fontStyle: 'italic',\n fontWeight: 400,\n paddingBottom: '4px'\n }\n}\n\nexport const Select = ({ ...props }) => {\n const {\n value,\n options,\n isDisabled,\n isOptional,\n isDarkBackground,\n onChange,\n label,\n classes\n } = props\n\n return (\n \n \n {label && - Optional \n )}\n
\n = ({\n title,\n cards,\n showFilters,\n pagination,\n members_card_style,\n callToAction,\n}) => {\n const [visibleItems, setVisibleItems] = useState();\n const [cardStore, setCardStore] = useState(cards);\n const [filterValues, setFilterValues] = useState({});\n const [companyFilterOptions, setCompanyFilterOptions] = useState([]);\n\n useEffect(() => {\n let idIterator = 0;\n const unique = Array.from(new Set(cards.map((card) => card.company)));\n\n setCompanyFilterOptions(\n unique.map((companyName) => ({\n id: idIterator++,\n label: companyName,\n value: companyName,\n }))\n );\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, []);\n\n const handlePagination = (array: any) => {\n setVisibleItems(array.visibleItems);\n };\n\n const clearAllFilters = () => {\n setFilterValues({});\n setCardStore(cards);\n };\n\n const applyFilters = (value: string, inputName: string) => {\n if (inputName === 'company') {\n const filtered = cards.filter((card) =>\n card.company?.toLowerCase().startsWith(value.toLowerCase())\n );\n if (filterValues?.department) {\n setCardStore(\n filtered.filter(\n (card) =>\n card.department\n ?.toLowerCase()\n .startsWith(filterValues.department.toLowerCase()) ||\n card.department?.toLowerCase() ===\n filterValues.department.toLowerCase()\n )\n );\n } else {\n setCardStore(filtered);\n }\n setFilterValues({ ...filterValues, [inputName]: value });\n }\n\n if (inputName === 'department') {\n if (value !== '') {\n const filtered = cards.filter(\n (card) =>\n card.department?.toLowerCase().startsWith(value.toLowerCase()) ||\n card.department?.toLowerCase() === value.toLowerCase()\n );\n\n if (filterValues?.company) {\n setCardStore(\n filtered.filter((card) =>\n card.company\n ?.toLowerCase()\n .startsWith(filterValues.company.toLowerCase())\n )\n );\n } else {\n setCardStore(filtered);\n }\n\n setFilterValues({ ...filterValues, [inputName]: value });\n } else {\n if (filterValues?.company) {\n const filtered = cards.filter((card) =>\n card.company\n ?.toLowerCase()\n .startsWith(filterValues.company.toLowerCase())\n );\n setCardStore(filtered);\n } else setCardStore(cards);\n setFilterValues((prevValues: any) => {\n delete prevValues.department;\n return prevValues;\n });\n }\n }\n };\n\n return (\n \n \n {title}\n \n {showFilters === 'True' && (\n <>\n \n \n \n applyFilters(event.target.value, 'department')\n }\n value={filterValues?.department || ''}\n />\n\n \n View all departments\n \n \n \n\n {}}\n onChange={(value: string) => applyFilters(value, 'company')}\n options={companyFilterOptions}\n placeholder=\"Please select an option\"\n value={filterValues?.company || undefined}\n />\n \n \n \n \n \n \n Filters\n \n\n \n {Object.keys(filterValues).length} \n \n \n \n Clear all\n \n \n \n \n \n {visibleItems?.map((card, index) => (\n \n \n \n {card.name}\n \n \n {card.jobTitle}\n {card.jobTitle && card.department && ','} {card.department}\n \n \n \n ))}\n \n\n \n \n\n {callToAction?.buttonUrl && (\n \n \n )}\n \n );\n};\n","import { TeamGridFilter } from 'common/components/organisms/TeamGridFilter/index'\nimport React, { FC } from 'react'\n\nconst TeamGridFilterWrapper: FC<{ props: any }> = (props) => {\n const processedProps = getProps(props)\n\n return and last
\n var openingTagRegex = /^/;\n var closingTagRegex = /<\\/p>$/; // Replace the first
with
“ \n\n if (openingTagRegex.test(input)) {\n input = input.replace(openingTagRegex, '
“ ');\n } // Replace the last
with ” \n\n\n if (closingTagRegex.test(input)) {\n input = input.replace(closingTagRegex, '” ');\n }\n\n return input;\n};\n\nvar TestimonialSection = function TestimonialSection(props) {\n var _props$type = props.type,\n type = _props$type === void 0 ? 'customer' : _props$type,\n title = props.title,\n quote = props.quote,\n _props$name = props.name,\n name = _props$name === void 0 ? 'Niamh' : _props$name,\n role = props.role,\n avatarSrc = props.avatarSrc,\n button = props.button;\n var location = props.type === 'customer' ? props.location : undefined;\n var nameString = location ? \"\".concat(name, \", \").concat(location) : name;\n var defaultTitle = type === 'customer' ? 'What our customers say' : 'How our advisors can help';\n var defaultRole = type === 'customer' ? 'Irish Life Customer' : 'Irish Life Financial Advisor';\n return /*#__PURE__*/React.createElement(Box, {\n sx: {\n display: 'flex',\n justifyContent: 'center',\n bg: '#2C2D8B',\n py: '22px',\n px: '16px'\n }\n }, /*#__PURE__*/React.createElement(Box, {\n sx: {\n py: '32px',\n px: '24px',\n maxWidth: '886px'\n }\n }, /*#__PURE__*/React.createElement(\"svg\", {\n width: '40',\n height: '40',\n viewBox: '0 0 40 40',\n fill: 'none',\n xmlns: 'http://www.w3.org/2000/svg'\n }, /*#__PURE__*/React.createElement(\"path\", {\n d: 'M36.9999 19.0556C37.0064 21.5487 36.424 24.008 35.3 26.2334C33.9672 28.9 31.9184 31.1429 29.3829 32.7109C26.8475 34.2788 23.9255 35.11 20.9444 35.1111C18.4513 35.1176 15.992 34.5351 13.7666 33.4111L3 37L6.58888 26.2334C5.46487 24.008 4.88239 21.5487 4.88889 19.0556C4.89004 16.0745 5.72115 13.1525 7.28913 10.6171C8.85711 8.08163 11.1 6.03279 13.7666 4.70005C15.992 3.57603 18.4513 2.99355 20.9444 3.00005H21.8889C25.826 3.21726 29.5446 4.87904 32.3328 7.66722C35.121 10.4554 36.7827 14.174 36.9999 18.1111V19.0556Z',\n stroke: '#6AD1C0',\n strokeWidth: '3',\n strokeLinecap: 'round',\n strokeLinejoin: 'round'\n })), /*#__PURE__*/React.createElement(Text, {\n variant: 'title-xs',\n sx: {\n color: 'accent.400',\n mt: 8,\n mb: 3\n }\n }, title || defaultTitle), /*#__PURE__*/React.createElement(Text, {\n variant: 'title-lg',\n sx: {\n color: '#fff',\n mt: 8\n }\n }, addQuotes(quote)), /*#__PURE__*/React.createElement(Box, {\n sx: {\n display: 'flex',\n mt: 9\n }\n }, avatarSrc && /*#__PURE__*/React.createElement(Avatar, {\n name: name,\n src: avatarSrc\n }), /*#__PURE__*/React.createElement(Box, {\n sx: {\n ml: 3\n }\n }, /*#__PURE__*/React.createElement(Text, {\n color: 'white',\n fontWeight: 'semibold',\n variant: 'subtitle-sm'\n }, \"-\", nameString), /*#__PURE__*/React.createElement(Text, {\n color: 'white',\n fontWeight: 'normal',\n variant: 'subtitle-md'\n }, role || defaultRole))), (button === null || button === void 0 ? void 0 : button.text) && /*#__PURE__*/React.createElement(Button, {\n bg: 'vibrant.100',\n variant: 'inverse',\n mt: 9,\n onClick: button.onClick\n }, button.text)));\n};\n\nexport { TestimonialSection };","import {\n TestimonialSection,\n TestimonialSectionProps,\n} from '@irishlifedigitalhub/ds.organisms.testimonial-section'\nimport { navigate } from '@reach/router'\nimport { fireAnalyticsEvent } from 'common/utils/fireAnalyticsEvent'\nimport React from 'react'\n\nexport const Testimonials: React.FC = (data) => {\n const props = getTestimonialProps(data)\n\n return = props => {\n const data = getTextWithImageData(props)\n return (\n \n \n // = props => {\n const data = getTimelineData(props)\n return = (props) => {\n const { image, title, subtitle, callToAction } = props\n\n const isMobile = !useDesktop()\n\n return (\n \n \n \n \n \n \n \n \n {title}\n \n {subtitle} \n navigate(callToAction.url)}\n >\n {callToAction.label}\n \n \n \n \n \n )\n}\n","import { TrapeziumBanner } from 'common/components/organisms/TrapeziumBanner/index'\nimport React, { FC } from 'react'\n\nconst TrapeziumBannerWrapper: FC<{ props: any }> = (props) => {\n const processedProps = getProps(props)\n\n return = props => {\n const data = getVideoWithTextData(props)\n return (\n = props => {\n const data = getWarningsData(props)\n return (\n =\n () => {\n return (\n \n = props => {\n const data = getResourcesData(props)\n return = () => {\n return (\n \n \n )\n}\n","import { Text } from '@irishlife/ilgroupdesignsystem.atoms.text'\nimport React from 'react'\nimport { Box } from '@chakra-ui/react'\n\nexport interface TextWithTitleProps {\n title: string\n body: string\n}\n\nexport const TextWithTitle: React.FC = ({\n body,\n title,\n}) => {\n return (\n \n \n {title}\n \n {body} \n \n )\n}\n","import React, { useEffect } from 'react';\n\ninterface IAppointeddWidget {\n id: string;\n}\n\nconst AppointeddWidget: React.FC = (props: IAppointeddWidget) => {\n useEffect(() => {\n const script1 = document.createElement('script');\n script1.src =\n 'https://booking-tools-sdk.appointedd.com/appointedd-booking-tools-sdk-v1.js';\n document.body.appendChild(script1);\n\n const script2 = document.createElement('script');\n\n script2.lang = 'javascript';\n script2.type = 'text/javascript';\n\n script2.text = `Appointedd.renderWidget(\"appointeddWidgetContainer\", {\n widgetId: '${props.id}' ,\n enableLanguageSelector: false,\n });`;\n\n setTimeout(function () {\n document.body.appendChild(script2);\n }, 300);\n }, [props.id]);\n return (\n <>\n \n \n );\n};\n\nexport { AppointeddWidget };\n","import React from 'react';\nimport { Helmet } from 'react-helmet';\n\ninterface ICanonicalTag {\n codename: string;\n full_url: string;\n lastModified: Date;\n}\n\nconst CanonicalTag: React.FC = ({ full_url }: ICanonicalTag) => {\n return (\n \n \n );\n};\n\nexport { CanonicalTag };\n","import React from 'react';\nimport { FeaturedCard } from './FeaturedCard';\nimport { IBlogV2PagePage } from 'common/pages/BlogV2PagePage';\nimport { useReadingTime } from 'react-hook-reading-time';\nimport { Wrapper } from 'common/components/molecules/Wrapper';\n\ninterface IInvestmentHubFeatured {\n blog_page_featured: IBlogV2PagePage[] | any[];\n}\n\nconst InvestmentHubFeatured: React.FC = ({\n blog_page_featured,\n}: IInvestmentHubFeatured) => {\n const { minutes } = useReadingTime(\n typeof blog_page_featured[0].body === 'string'\n ? blog_page_featured[0].body\n : ''\n );\n\n if (blog_page_featured && blog_page_featured.length === 1) {\n const blogPageOld: any = blog_page_featured[0];\n const blogPageV2: IBlogV2PagePage = blog_page_featured[0];\n\n if (blog_page_featured[0].type === 'blog_post') {\n return (\n \n \n );\n }\n\n if (blog_page_featured[0].type === 'blog_v2___page') {\n return (\n \n \n );\n }\n }\n\n return <>;\n};\n\nexport { InvestmentHubFeatured };\n","import React, { useEffect, useRef, useState } from 'react';\nimport TabGroup from './TabGroup';\nimport { BlogV2Category, IBlogV2PagePage } from 'common/pages/BlogV2PagePage';\nimport { orderBy } from 'lodash';\nimport { Box } from '@chakra-ui/react';\nimport { InvestmentHubCategoriesCategoryListing } from './InvestmentHubCategoriesCategoryListing';\nimport { InvestmentHubCategoriesAllListing } from './InvestmentHubCategoriesAllListing';\nimport { Wrapper } from 'common/components/molecules/Wrapper';\nimport { useDesktop } from 'common/hooks/useDesktop';\n\ninterface IInvestmentHubCategories {\n blogPosts: IBlogV2PagePage[] | any[];\n categories: BlogV2Category[];\n}\nexport interface GroupedBlogPosts {\n type: string;\n blogPosts: BlogCard[];\n}\nexport interface BlogCard {\n category: string;\n readTime?: number;\n title: string;\n buttonLabel: string;\n image: string;\n url: string;\n codename: string;\n}\n\nconst InvestmentHubCategories: React.FC = (\n props: IInvestmentHubCategories\n) => {\n const isDesktop = useDesktop();\n const [categories, setCategories] = useState([]);\n const [groupedBlogPosts, setGroupedBlogPosts] = useState(\n []\n );\n\n useEffect(() => {\n insertAllCategories();\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, []);\n\n useEffect(() => {\n groupCategories(categories);\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [categories]);\n\n const insertAllCategories = () => {\n let newCategories = props.categories;\n if (!newCategories.find((e) => e.name === 'All')) {\n newCategories.push({\n name: 'All',\n codename: '__',\n });\n }\n newCategories = orderBy(newCategories, 'name', 'asc');\n setCategories(newCategories);\n };\n\n const groupCategories = (categories: BlogV2Category[] | null) => {\n if (categories) {\n const _blogPostsOld = props.blogPosts.filter(\n (e) => e.type === 'blog_post'\n );\n const _blogPostsV2 = props.blogPosts.filter(\n (e) => e.type === 'blog_v2___page'\n );\n const _groupBlogPosts: GroupedBlogPosts[] = [];\n\n categories.forEach((category) => {\n if (category.name === 'All') return;\n\n const oldBlogPosts = groupOldBlogPosts(_blogPostsOld, category.name);\n\n const newBlogPosts = groupNewBlogPosts(_blogPostsV2, category.name);\n\n const mergeBlogPosts = orderBy(\n [...oldBlogPosts, ...newBlogPosts],\n 'date',\n 'desc'\n );\n\n const group: GroupedBlogPosts = {\n type: category.name,\n blogPosts: mergeBlogPosts,\n };\n\n _groupBlogPosts.push(group);\n });\n setGroupedBlogPosts(_groupBlogPosts);\n }\n };\n\n const groupOldBlogPosts = (\n blogPosts: IBlogV2PagePage[] | any[],\n category: string\n ) => {\n const group = blogPosts\n .filter((e) => e.blog_post_category === category)\n .map((e) => ({\n category: e.blog_post_category,\n title: e.title,\n buttonLabel: 'Read more',\n image: e.image,\n url: e.url,\n codename: e.codename,\n date: e.date_created\n }));\n\n return group;\n };\n\n const groupNewBlogPosts = (\n blogPosts: IBlogV2PagePage[] | any[],\n category: string\n ) => {\n const group = blogPosts\n .filter((item) => {\n return item.category.some((e: any) => e.name === category);\n })\n .map((e) => ({\n category: e.category,\n readTime: e.read_time,\n title: e.title,\n buttonLabel: e.button_label,\n image: e.feature_image,\n url: e.url,\n codename: e.codename,\n date: e.date_published\n }));\n\n return group;\n };\n\n const swiperRef = useRef(null);\n const [activeIndex, setActiveIndex] = useState(0);\n\n const handleClick = (e: number) => {\n setActiveIndex(e);\n };\n\n const handleClickByType = (type: string) => {\n const index = categories.findIndex((e) => e.name === type);\n setActiveIndex(index);\n scrollToListing();\n };\n\n const scrollToListing = () => {\n const element = document.getElementById('listingBlogPosts');\n if (element) {\n const offset = -400;\n const position = element?.getBoundingClientRect().top + window.scrollY;\n window.scrollTo({ top: position + offset, behavior: 'smooth' });\n }\n };\n\n return (\n \n \n {categories && groupedBlogPosts && (\n <>\n handleClick(e)}\n activeIndex={activeIndex}\n size=\"md\"\n />\n \n {activeIndex === 0 && (\n handleClickByType(e)}\n />\n )}\n {activeIndex !== 0 && (\n \n \n )}\n \n \n );\n};\n\nexport { InvestmentHubCategories };\n","const enabledTypesToReceiveBlogPosts: string[] = [\n 'template_section___investment_hub___categories'\n];\n\nconst isListTypesAllowedToReceiveBlogPosts = (items?: any[]) => {\n if(!items || (items && items.length === 0)) return false;\n\n const response = enabledTypesToReceiveBlogPosts.some(function(enabledType) {\n return items.find(e => e.type === enabledType)\n })\n\n return response;\n}\n\nconst isTypeAllowedToReceiveBlogPosts = (type?: string) => {\n if(!type) return false;\n\n const response = enabledTypesToReceiveBlogPosts.some(function(enabledType) {\n return type === enabledType\n })\n\n return response;\n}\n\nconst provideBlogPostsToGenericPageBySectionType = (pages: {\n template: string;\n path: string;\n context: any;\n}[], blogPages?: any) => {\n let newPages = [...pages];\n newPages = newPages.map(page => {\n let newContext = {...page.context};\n if(page.context.type === \"template___generic\") {\n const enableBlogPosts = isListTypesAllowedToReceiveBlogPosts(page.context.sections);\n if(enableBlogPosts) {\n newContext.blogPosts = blogPages;\n }\n }\n\n return {\n ...page,\n context: newContext,\n }\n });\n \n return newPages;\n};\n\nexport {\n isListTypesAllowedToReceiveBlogPosts,\n isTypeAllowedToReceiveBlogPosts,\n provideBlogPostsToGenericPageBySectionType\n}","import { Box } from '@chakra-ui/react'\nimport { Breadcrumb } from '@irishlifedigitalhub/ds.molecules.breadcrumb'\nimport {\n Jumbotron as HomeJumbotron,\n JumbotronProps,\n} from '@irishlifedigitalhub/ds.organisms.jumbotron'\nimport { navigate } from '@reach/router'\nimport { Wrapper } from 'common/components/molecules/Wrapper'\nimport { Jumbotron } from 'common/components/organisms/Jumbotron'\nimport { Layout, LayoutProps } from 'common/components/organisms/Layout'\nimport { theme } from 'core'\nimport React from 'react'\nimport TagManager from 'react-gtm-module'\nimport {\n TemplateSectionComponent,\n TemplateSectionType,\n} from './templateSectionMapper'\nimport { isTypeAllowedToReceiveBlogPosts } from 'common/utils/getCmsTypesToReceiveBlogPostsProp'\n\nexport interface Section {\n type?: TemplateSectionType\n}\n\n// eslint-disable-next-line @typescript-eslint/no-empty-interface\nexport interface GenericProps {\n codename?: string\n jumbotron: any\n layout: LayoutProps\n sections: Section[]\n blogPosts?: any[]\n}\n\nexport const Generic: React.FC = ({\n codename,\n jumbotron,\n layout,\n sections,\n blogPosts\n}) => {\n const newLayout = {\n ...layout,\n navigation: layout.customNavigationMenu || layout.navigation,\n }\n return (\n \n {jumbotron.variant !== 'home' &&\n codename !== 'knowledge' &&\n !codename?.includes('calculator__') &&\n codename !== 'income_protection_calculator' &&\n ifJumbotron(codename) && \n )\n}\nconst ifJumbotron = (codename?: string) => {\n if (codename === 'term_quote') {\n return false\n }\n return true\n}\n\nexport const getTemplateJumbotron = (\n jumbotron: any,\n breadcrumbs?: any\n): JumbotronProps => {\n return {\n src: jumbotron.image,\n title: jumbotron.title,\n subtitle: jumbotron.subtitle,\n paragraph: jumbotron.text,\n renderBreadcrumb: <>,\n\n buttonText: jumbotron.callToAction?.label,\n buttonProps: {\n onClick: () => {\n TagManager.dataLayer({\n dataLayer: {\n event: 'primaryButtonClick',\n clickText: jumbotron?.callToAction?.label,\n clickURL: jumbotron?.callToAction?.url,\n clickID: jumbotron?.callToAction?.analyticsId,\n },\n })\n navigate(jumbotron?.callToAction?.url || '')\n },\n },\n }\n}\n\nexport const getBreadCrumbs = (breadcrumbs: any) => {\n const items = breadcrumbs.map((item: any, index: number) => {\n return {\n id: index + 1,\n label: item.name,\n value: item.url,\n }\n })\n const finalBreadCrumbs = [{ id: 0, label: 'Home', value: '/' }, ...items]\n return (\n \n \n )\n}\n\nexport const getSections = (sections: any[] = [], blogPosts?: any[]) => {\n // Helper function to determine if extra space should be displayed\n const displayExtraSpace = (condition: string) =>\n condition === 'Yes' ? 'block' : 'none'\n\n // Helper function to get background color\n const getBackgroundColor = (\n defaultColor: string | undefined,\n type: string\n ) => {\n switch (type) {\n case 'templatesection___card_grid':\n return '#EBEDF7'\n case 'templatesection___minifooter':\n return '#fff'\n default:\n return defaultColor\n }\n }\n\n // set of sections that should not be wrapped in extra space\n const shouldNotBeWrapped = new Set([\n 'templatesection___trapeziumbanner',\n 'templatesection___multicampaignfeature',\n 'templatesection___campaign3dslideshow',\n 'template_section___canonical_tag',\n 'template_section___investment_hub___featured',\n 'template_section___investment_hub___categories'\n ])\n\n return sections.map(\n (\n {\n type,\n templatesection_common__spacer,\n templatesection_common__extra_space_above_and_bottom,\n templatesection_common__background_color = 'transparent',\n ...props\n },\n idx\n ) => {\n const bgColor = bgColors[templatesection_common__background_color]\n const Component = TemplateSectionComponent[type]\n const aboveAndBottomBackground = getBackgroundColor(bgColor, type)\n\n if (!Component) return null\n\n //This will show only when templatesection_common__extra_space_above_and_bottom is set to 'Yes' in the CMS\n const ExtraSpaceBox = (\n \n {shouldNotBeWrapped.has(type) ? (\n <>\n {ExtraSpaceBox}\n \n \n {ExtraSpaceBox}\n \n ) : (\n \n {ExtraSpaceBox}\n \n {Component?.displayName === 'Testimonials' ? (\n \n \n \n )}\n \n )\n }\n )\n}\n\nconst bgColors: { [key: string]: string | undefined } = {\n transparent: undefined,\n white: theme.palette.common.white,\n lightBlue: '#EBEDF7',\n deepBlue: '#4D599E',\n}\n\nconst getSectionId = (type: string) =>\n type.replace('templatesection___', '').toLowerCase()\n","// this method was added to unscopables after implementation\n// in popular engines, so it's moved to a separate module\nvar addToUnscopables = require('../internals/add-to-unscopables');\n\naddToUnscopables('flatMap');\n","'use strict';\n\nObject.defineProperty(exports, \"__esModule\", {\n value: true\n});\n\nvar _extends = Object.assign || function (target) {\n for (var i = 1; i < arguments.length; i++) {\n var source = arguments[i];\n\n for (var key in source) {\n if (Object.prototype.hasOwnProperty.call(source, key)) {\n target[key] = source[key];\n }\n }\n }\n\n return target;\n};\n\nvar _createClass = function () {\n function defineProperties(target, props) {\n for (var i = 0; i < props.length; i++) {\n var descriptor = props[i];\n descriptor.enumerable = descriptor.enumerable || false;\n descriptor.configurable = true;\n if (\"value\" in descriptor) descriptor.writable = true;\n Object.defineProperty(target, descriptor.key, descriptor);\n }\n }\n\n return function (Constructor, protoProps, staticProps) {\n if (protoProps) defineProperties(Constructor.prototype, protoProps);\n if (staticProps) defineProperties(Constructor, staticProps);\n return Constructor;\n };\n}();\n\nvar _react = require('react');\n\nvar _react2 = _interopRequireDefault(_react);\n\nvar _propTypes = require('prop-types');\n\nvar _propTypes2 = _interopRequireDefault(_propTypes);\n\nvar _raf = require('raf');\n\nvar _raf2 = _interopRequireDefault(_raf);\n\nfunction _interopRequireDefault(obj) {\n return obj && obj.__esModule ? obj : {\n default: obj\n };\n}\n\nfunction _classCallCheck(instance, Constructor) {\n if (!(instance instanceof Constructor)) {\n throw new TypeError(\"Cannot call a class as a function\");\n }\n}\n\nfunction _possibleConstructorReturn(self, call) {\n if (!self) {\n throw new ReferenceError(\"this hasn't been initialised - super() hasn't been called\");\n }\n\n return call && (typeof call === \"object\" || typeof call === \"function\") ? call : self;\n}\n\nfunction _inherits(subClass, superClass) {\n if (typeof superClass !== \"function\" && superClass !== null) {\n throw new TypeError(\"Super expression must either be null or a function, not \" + typeof superClass);\n }\n\n subClass.prototype = Object.create(superClass && superClass.prototype, {\n constructor: {\n value: subClass,\n enumerable: false,\n writable: true,\n configurable: true\n }\n });\n if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass;\n}\n\nvar ANIMATION_DURATION = 300;\n\nvar AnimatedNumber = function (_Component) {\n _inherits(AnimatedNumber, _Component);\n\n function AnimatedNumber(props) {\n _classCallCheck(this, AnimatedNumber);\n\n var _this = _possibleConstructorReturn(this, (AnimatedNumber.__proto__ || Object.getPrototypeOf(AnimatedNumber)).call(this, props));\n\n _this.state = {\n currentValue: props.initialValue\n };\n return _this;\n }\n\n _createClass(AnimatedNumber, [{\n key: 'componentDidMount',\n value: function componentDidMount() {\n this.prepareTween(this.props);\n }\n }, {\n key: 'componentWillReceiveProps',\n value: function componentWillReceiveProps(nextProps) {\n if (this.state.currentValue === nextProps.value) {\n return;\n }\n\n if (this.tweenHandle) {\n this.endTween();\n }\n\n this.prepareTween(nextProps);\n }\n }, {\n key: 'componentWillUnmount',\n value: function componentWillUnmount() {\n this.endTween();\n }\n }, {\n key: 'prepareTween',\n value: function prepareTween() {\n var _this2 = this;\n\n this.tweenHandle = (0, _raf2.default)(function (timestamp) {\n _this2.tweenValue(timestamp, true);\n });\n }\n }, {\n key: 'endTween',\n value: function endTween() {\n _raf2.default.cancel(this.tweenHandle);\n\n this.setState(_extends({}, this.state, {\n currentValue: this.props.value\n }));\n }\n }, {\n key: 'ensureSixtyFps',\n value: function ensureSixtyFps(timestamp) {\n var currentTime = this.state.currentTime;\n return !currentTime || timestamp - currentTime > 16;\n }\n }, {\n key: 'tweenValue',\n value: function tweenValue(timestamp, start) {\n if (!this.ensureSixtyFps(timestamp)) {\n this.tweenHandle = (0, _raf2.default)(this.tweenValue.bind(this));\n return;\n }\n\n var _props = this.props,\n value = _props.value,\n duration = _props.duration;\n var currentValue = this.state.currentValue;\n var currentTime = timestamp;\n var startTime = start ? timestamp : this.state.startTime;\n var fromValue = start ? currentValue : this.state.fromValue;\n var newValue = void 0;\n\n if (currentTime - startTime >= duration) {\n newValue = value;\n } else {\n newValue = fromValue + (value - fromValue) * ((currentTime - startTime) / duration);\n }\n\n if (newValue === value) {\n this.endTween();\n return;\n }\n\n this.setState({\n currentValue: newValue,\n startTime: startTime ? startTime : currentTime,\n fromValue: fromValue,\n currentTime: currentTime\n });\n this.tweenHandle = (0, _raf2.default)(this.tweenValue.bind(this));\n }\n }, {\n key: 'render',\n value: function render() {\n var _props2 = this.props,\n formatValue = _props2.formatValue,\n value = _props2.value,\n className = _props2.className,\n frameStyle = _props2.frameStyle,\n stepPrecision = _props2.stepPrecision;\n var _state = this.state,\n currentValue = _state.currentValue,\n fromValue = _state.fromValue;\n var style = this.props.style;\n var adjustedValue = currentValue;\n var direction = value - fromValue;\n\n if (currentValue !== value) {\n if (stepPrecision > 0) {\n adjustedValue = Number(currentValue.toFixed(stepPrecision));\n } else if (direction < 0 && stepPrecision === 0) {\n adjustedValue = Math.floor(currentValue);\n } else if (direction > 0 && stepPrecision === 0) {\n adjustedValue = Math.ceil(currentValue);\n }\n }\n\n var perc = Math.abs((adjustedValue - fromValue) / (value - fromValue) * 100);\n var currStyle = frameStyle(perc);\n\n if (style && currStyle) {\n style = _extends({}, style, currStyle);\n } else if (currStyle) {\n style = currStyle;\n }\n\n return _react2.default.createElement(this.props.component, _extends({}, filterKnownProps(this.props), {\n className: className,\n style: style\n }), formatValue(adjustedValue));\n }\n }]);\n\n return AnimatedNumber;\n}(_react.Component);\n\nAnimatedNumber.propTypes = {\n component: _propTypes2.default.any,\n formatValue: _propTypes2.default.func,\n value: _propTypes2.default.number,\n initialValue: _propTypes2.default.number,\n duration: _propTypes2.default.number,\n frameStyle: _propTypes2.default.func,\n stepPrecision: _propTypes2.default.number,\n style: _propTypes2.default.object,\n className: _propTypes2.default.string\n};\nAnimatedNumber.defaultProps = {\n component: 'span',\n formatValue: function formatValue(n) {\n return n;\n },\n initialValue: 0,\n duration: ANIMATION_DURATION,\n frameStyle: function frameStyle() {\n return {};\n },\n value: 0\n};\nexports.default = AnimatedNumber;\n\nfunction filterKnownProps(props) {\n var sanitized = {};\n var propNames = Object.keys(props);\n var validProps = Object.keys(AnimatedNumber.propTypes);\n propNames.filter(function (p) {\n return validProps.indexOf(p) < 0;\n }).forEach(function (p) {\n sanitized[p] = props[p];\n });\n return sanitized;\n}\n\n;","import { Grid, makeStyles } from '@material-ui/core'\nimport { Text } from 'common/components/molecules/Text'\nimport React from 'react'\n\nexport interface VideoProps {\n source?: string\n url?: string\n width?: number\n height?: number\n title: string\n heading: string\n text: string\n}\n\nconst useStyles = makeStyles({\n videoTitle: {\n color: '#4DB7AB',\n },\n videoHeading: {\n fontSize: '40px',\n },\n videoResponsive: {\n overflow: 'hidden',\n paddingBottom: '56.25%',\n position: 'relative',\n height: '0',\n '& > iframe': {\n left: '0',\n top: '0',\n height: '100%',\n width: '100%',\n position: 'absolute',\n },\n },\n})\n\nexport const Video: React.FC = ({\n source,\n url,\n width,\n height,\n title,\n heading,\n text,\n}) => {\n const classes = useStyles()\n return (\n \n {(title || text || heading) && (\n \n {title && (\n \n {source && (\n \n \n
\n )}\n {url && (\n \n \n
\n )}\n \n \n )\n}\n","function t(t) {\n var e = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 275;\n\n var _ref = function (t) {\n var e = new RegExp(\"[-ヿ㐀-䶿一-鿿豈-ｦ-ﾟ]\", \"g\"),\n n = (t.match(e) || []).length;\n return {\n count: n,\n time: n / 500,\n formattedText: t.replace(e, \"\")\n };\n }(t),\n n = _ref.count,\n r = _ref.time,\n c = _ref.formattedText,\n o = function (t) {\n var e = new RegExp(\"\\\\w+\", \"g\");\n return (t.match(e) || []).length;\n }(c);\n\n return {\n characters: n,\n otherLanguageTime: r,\n words: o,\n time: o / e\n };\n}\n\nfunction e(t) {\n return t < .5 ? \"less than a min\" : t >= .5 && t < 1.5 ? \"1 min read\" : Math.ceil(t) + \" min read\";\n}\n\nfunction n(t) {\n return t < .5 ? .5 : t >= .5 && t < 1.5 ? 1 : Math.ceil(t);\n}\n\nfunction r(r) {\n var c = function (t) {\n var e = new RegExp(\"<\\\\w+(\\\\s+(\\\"[^\\\"]*\\\"|\\\\'[^\\\\']*'|[^>])+)?>|<\\\\/\\\\w+>\", \"gi\");\n return t.replace(e, \"\");\n }(function (t) {\n return t.replace(/^\\s+/, \"\").replace(/\\s+$/, \"\");\n }(r)),\n _t = t(c),\n o = _t.time,\n i = _t.words;\n\n return {\n text: e(o),\n minutes: n(o),\n words: i,\n time: o\n };\n}\n\nexport { r as useReadingTime };","export default function _taggedTemplateLiteral(strings, raw) {\n if (!raw) {\n raw = strings.slice(0);\n }\n\n return Object.freeze(Object.defineProperties(strings, {\n raw: {\n value: Object.freeze(raw)\n }\n }));\n}","import { Box, Button, Grid } from '@material-ui/core'\nimport { Card } from 'common/components/molecules/Card'\nimport { CardCtaProps } from 'common/components/molecules/CardCta'\nimport { Spacer } from 'common/components/molecules/Spacer'\nimport { Wrapper } from 'common/components/molecules/Wrapper'\nimport { useDesktop } from 'common/hooks/useDesktop'\nimport React, { useState } from 'react'\nimport { LeftIntro } from '../LeftIntro'\n\nexport interface ProductListProps {\n heading: string\n products: {\n callToAction: CardCtaProps\n icon?: string\n title: string\n text: string\n }[]\n singleColumn?: boolean\n text: string\n title: string\n filter?: boolean\n iconSize?: 'md' | 'lg'\n transparent?: boolean\n generic?: boolean\n}\n\nexport const ProductList: React.FC = ({\n generic,\n heading,\n products = [],\n singleColumn,\n text,\n title,\n filter,\n iconSize,\n transparent\n}) => {\n const desktop = useDesktop()\n\n const [filteredProducts, setfilteredProducts] = useState(\n filter ? products.slice(0, 6) : products\n )\n const [count, setCount] = useState(6)\n\n const loopWithSlice = (start: number, end: number) => {\n const slicedPosts = products.slice(start, end)\n setfilteredProducts([...slicedPosts])\n }\n\n const loadMore = () => {\n setCount(count + 6)\n loopWithSlice(0, count + 6)\n }\n\n return (\n \n {!generic && \n \n \n \n \n \n {!desktop && \n {filteredProducts.map(\n (\n product: JSX.IntrinsicAttributes &\n import('../../molecules/Card').CardProps & {\n children?: React.ReactNode\n }\n ) => (\n \n \n )\n )}\n \n {filter && count <= products.length && (\n \n Load more\n \n )}\n \n \n \n \n \n \n {!generic && >'; // Important!\n // Keep this list in sync with production version in `./factoryWithThrowingShims.js`.\n\n var ReactPropTypes = {\n array: createPrimitiveTypeChecker('array'),\n bigint: createPrimitiveTypeChecker('bigint'),\n bool: createPrimitiveTypeChecker('boolean'),\n func: createPrimitiveTypeChecker('function'),\n number: createPrimitiveTypeChecker('number'),\n object: createPrimitiveTypeChecker('object'),\n string: createPrimitiveTypeChecker('string'),\n symbol: createPrimitiveTypeChecker('symbol'),\n any: createAnyTypeChecker(),\n arrayOf: createArrayOfTypeChecker,\n element: createElementTypeChecker(),\n elementType: createElementTypeTypeChecker(),\n instanceOf: createInstanceTypeChecker,\n node: createNodeChecker(),\n objectOf: createObjectOfTypeChecker,\n oneOf: createEnumTypeChecker,\n oneOfType: createUnionTypeChecker,\n shape: createShapeTypeChecker,\n exact: createStrictShapeTypeChecker\n };\n /**\n * inlined Object.is polyfill to avoid requiring consumers ship their own\n * https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/is\n */\n\n /*eslint-disable no-self-compare*/\n\n function is(x, y) {\n // SameValue algorithm\n if (x === y) {\n // Steps 1-5, 7-10\n // Steps 6.b-6.e: +0 != -0\n return x !== 0 || 1 / x === 1 / y;\n } else {\n // Step 6.a: NaN == NaN\n return x !== x && y !== y;\n }\n }\n /*eslint-enable no-self-compare*/\n\n /**\n * We use an Error-like object for backward compatibility as people may call\n * PropTypes directly and inspect their output. However, we don't use real\n * Errors anymore. We don't inspect their stack anyway, and creating them\n * is prohibitively expensive if they are created too often, such as what\n * happens in oneOfType() for any type before the one that matched.\n */\n\n\n function PropTypeError(message, data) {\n this.message = message;\n this.data = data && typeof data === 'object' ? data : {};\n this.stack = '';\n } // Make `instanceof Error` still work for returned errors.\n\n\n PropTypeError.prototype = Error.prototype;\n\n function createChainableTypeChecker(validate) {\n if (process.env.NODE_ENV !== 'production') {\n var manualPropTypeCallCache = {};\n var manualPropTypeWarningCount = 0;\n }\n\n function checkType(isRequired, props, propName, componentName, location, propFullName, secret) {\n componentName = componentName || ANONYMOUS;\n propFullName = propFullName || propName;\n\n if (secret !== ReactPropTypesSecret$1) {\n if (throwOnDirectAccess) {\n // New behavior only for users of `prop-types` package\n var err = new Error('Calling PropTypes validators directly is not supported by the `prop-types` package. ' + 'Use `PropTypes.checkPropTypes()` to call them. ' + 'Read more at http://fb.me/use-check-prop-types');\n err.name = 'Invariant Violation';\n throw err;\n } else if (process.env.NODE_ENV !== 'production' && typeof console !== 'undefined') {\n // Old behavior for people using React.PropTypes\n var cacheKey = componentName + ':' + propName;\n\n if (!manualPropTypeCallCache[cacheKey] && // Avoid spamming the console because they are often not actionable except for lib authors\n manualPropTypeWarningCount < 3) {\n printWarning$1('You are manually calling a React.PropTypes validation ' + 'function for the `' + propFullName + '` prop on `' + componentName + '`. This is deprecated ' + 'and will throw in the standalone `prop-types` package. ' + 'You may be seeing this warning due to a third-party PropTypes ' + 'library. See https://fb.me/react-warning-dont-call-proptypes ' + 'for details.');\n manualPropTypeCallCache[cacheKey] = true;\n manualPropTypeWarningCount++;\n }\n }\n }\n\n if (props[propName] == null) {\n if (isRequired) {\n if (props[propName] === null) {\n return new PropTypeError('The ' + location + ' `' + propFullName + '` is marked as required ' + ('in `' + componentName + '`, but its value is `null`.'));\n }\n\n return new PropTypeError('The ' + location + ' `' + propFullName + '` is marked as required in ' + ('`' + componentName + '`, but its value is `undefined`.'));\n }\n\n return null;\n } else {\n return validate(props, propName, componentName, location, propFullName);\n }\n }\n\n var chainedCheckType = checkType.bind(null, false);\n chainedCheckType.isRequired = checkType.bind(null, true);\n return chainedCheckType;\n }\n\n function createPrimitiveTypeChecker(expectedType) {\n function validate(props, propName, componentName, location, propFullName, secret) {\n var propValue = props[propName];\n var propType = getPropType(propValue);\n\n if (propType !== expectedType) {\n // `propValue` being instance of, say, date/regexp, pass the 'object'\n // check, but we can offer a more precise error message here rather than\n // 'of type `object`'.\n var preciseType = getPreciseType(propValue);\n return new PropTypeError('Invalid ' + location + ' `' + propFullName + '` of type ' + ('`' + preciseType + '` supplied to `' + componentName + '`, expected ') + ('`' + expectedType + '`.'), {\n expectedType: expectedType\n });\n }\n\n return null;\n }\n\n return createChainableTypeChecker(validate);\n }\n\n function createAnyTypeChecker() {\n return createChainableTypeChecker(emptyFunctionThatReturnsNull);\n }\n\n function createArrayOfTypeChecker(typeChecker) {\n function validate(props, propName, componentName, location, propFullName) {\n if (typeof typeChecker !== 'function') {\n return new PropTypeError('Property `' + propFullName + '` of component `' + componentName + '` has invalid PropType notation inside arrayOf.');\n }\n\n var propValue = props[propName];\n\n if (!Array.isArray(propValue)) {\n var propType = getPropType(propValue);\n return new PropTypeError('Invalid ' + location + ' `' + propFullName + '` of type ' + ('`' + propType + '` supplied to `' + componentName + '`, expected an array.'));\n }\n\n for (var i = 0; i < propValue.length; i++) {\n var error = typeChecker(propValue, i, componentName, location, propFullName + '[' + i + ']', ReactPropTypesSecret$1);\n\n if (error instanceof Error) {\n return error;\n }\n }\n\n return null;\n }\n\n return createChainableTypeChecker(validate);\n }\n\n function createElementTypeChecker() {\n function validate(props, propName, componentName, location, propFullName) {\n var propValue = props[propName];\n\n if (!isValidElement(propValue)) {\n var propType = getPropType(propValue);\n return new PropTypeError('Invalid ' + location + ' `' + propFullName + '` of type ' + ('`' + propType + '` supplied to `' + componentName + '`, expected a single ReactElement.'));\n }\n\n return null;\n }\n\n return createChainableTypeChecker(validate);\n }\n\n function createElementTypeTypeChecker() {\n function validate(props, propName, componentName, location, propFullName) {\n var propValue = props[propName];\n\n if (!ReactIs$1.isValidElementType(propValue)) {\n var propType = getPropType(propValue);\n return new PropTypeError('Invalid ' + location + ' `' + propFullName + '` of type ' + ('`' + propType + '` supplied to `' + componentName + '`, expected a single ReactElement type.'));\n }\n\n return null;\n }\n\n return createChainableTypeChecker(validate);\n }\n\n function createInstanceTypeChecker(expectedClass) {\n function validate(props, propName, componentName, location, propFullName) {\n if (!(props[propName] instanceof expectedClass)) {\n var expectedClassName = expectedClass.name || ANONYMOUS;\n var actualClassName = getClassName(props[propName]);\n return new PropTypeError('Invalid ' + location + ' `' + propFullName + '` of type ' + ('`' + actualClassName + '` supplied to `' + componentName + '`, expected ') + ('instance of `' + expectedClassName + '`.'));\n }\n\n return null;\n }\n\n return createChainableTypeChecker(validate);\n }\n\n function createEnumTypeChecker(expectedValues) {\n if (!Array.isArray(expectedValues)) {\n if (process.env.NODE_ENV !== 'production') {\n if (arguments.length > 1) {\n printWarning$1('Invalid arguments supplied to oneOf, expected an array, got ' + arguments.length + ' arguments. ' + 'A common mistake is to write oneOf(x, y, z) instead of oneOf([x, y, z]).');\n } else {\n printWarning$1('Invalid argument supplied to oneOf, expected an array.');\n }\n }\n\n return emptyFunctionThatReturnsNull;\n }\n\n function validate(props, propName, componentName, location, propFullName) {\n var propValue = props[propName];\n\n for (var i = 0; i < expectedValues.length; i++) {\n if (is(propValue, expectedValues[i])) {\n return null;\n }\n }\n\n var valuesString = JSON.stringify(expectedValues, function replacer(key, value) {\n var type = getPreciseType(value);\n\n if (type === 'symbol') {\n return String(value);\n }\n\n return value;\n });\n return new PropTypeError('Invalid ' + location + ' `' + propFullName + '` of value `' + String(propValue) + '` ' + ('supplied to `' + componentName + '`, expected one of ' + valuesString + '.'));\n }\n\n return createChainableTypeChecker(validate);\n }\n\n function createObjectOfTypeChecker(typeChecker) {\n function validate(props, propName, componentName, location, propFullName) {\n if (typeof typeChecker !== 'function') {\n return new PropTypeError('Property `' + propFullName + '` of component `' + componentName + '` has invalid PropType notation inside objectOf.');\n }\n\n var propValue = props[propName];\n var propType = getPropType(propValue);\n\n if (propType !== 'object') {\n return new PropTypeError('Invalid ' + location + ' `' + propFullName + '` of type ' + ('`' + propType + '` supplied to `' + componentName + '`, expected an object.'));\n }\n\n for (var key in propValue) {\n if (has(propValue, key)) {\n var error = typeChecker(propValue, key, componentName, location, propFullName + '.' + key, ReactPropTypesSecret$1);\n\n if (error instanceof Error) {\n return error;\n }\n }\n }\n\n return null;\n }\n\n return createChainableTypeChecker(validate);\n }\n\n function createUnionTypeChecker(arrayOfTypeCheckers) {\n if (!Array.isArray(arrayOfTypeCheckers)) {\n process.env.NODE_ENV !== 'production' ? printWarning$1('Invalid argument supplied to oneOfType, expected an instance of array.') : void 0;\n return emptyFunctionThatReturnsNull;\n }\n\n for (var i = 0; i < arrayOfTypeCheckers.length; i++) {\n var checker = arrayOfTypeCheckers[i];\n\n if (typeof checker !== 'function') {\n printWarning$1('Invalid argument supplied to oneOfType. Expected an array of check functions, but ' + 'received ' + getPostfixForTypeWarning(checker) + ' at index ' + i + '.');\n return emptyFunctionThatReturnsNull;\n }\n }\n\n function validate(props, propName, componentName, location, propFullName) {\n var expectedTypes = [];\n\n for (var i = 0; i < arrayOfTypeCheckers.length; i++) {\n var checker = arrayOfTypeCheckers[i];\n var checkerResult = checker(props, propName, componentName, location, propFullName, ReactPropTypesSecret$1);\n\n if (checkerResult == null) {\n return null;\n }\n\n if (checkerResult.data && has(checkerResult.data, 'expectedType')) {\n expectedTypes.push(checkerResult.data.expectedType);\n }\n }\n\n var expectedTypesMessage = expectedTypes.length > 0 ? ', expected one of type [' + expectedTypes.join(', ') + ']' : '';\n return new PropTypeError('Invalid ' + location + ' `' + propFullName + '` supplied to ' + ('`' + componentName + '`' + expectedTypesMessage + '.'));\n }\n\n return createChainableTypeChecker(validate);\n }\n\n function createNodeChecker() {\n function validate(props, propName, componentName, location, propFullName) {\n if (!isNode(props[propName])) {\n return new PropTypeError('Invalid ' + location + ' `' + propFullName + '` supplied to ' + ('`' + componentName + '`, expected a ReactNode.'));\n }\n\n return null;\n }\n\n return createChainableTypeChecker(validate);\n }\n\n function invalidValidatorError(componentName, location, propFullName, key, type) {\n return new PropTypeError((componentName || 'React class') + ': ' + location + ' type `' + propFullName + '.' + key + '` is invalid; ' + 'it must be a function, usually from the `prop-types` package, but received `' + type + '`.');\n }\n\n function createShapeTypeChecker(shapeTypes) {\n function validate(props, propName, componentName, location, propFullName) {\n var propValue = props[propName];\n var propType = getPropType(propValue);\n\n if (propType !== 'object') {\n return new PropTypeError('Invalid ' + location + ' `' + propFullName + '` of type `' + propType + '` ' + ('supplied to `' + componentName + '`, expected `object`.'));\n }\n\n for (var key in shapeTypes) {\n var checker = shapeTypes[key];\n\n if (typeof checker !== 'function') {\n return invalidValidatorError(componentName, location, propFullName, key, getPreciseType(checker));\n }\n\n var error = checker(propValue, key, componentName, location, propFullName + '.' + key, ReactPropTypesSecret$1);\n\n if (error) {\n return error;\n }\n }\n\n return null;\n }\n\n return createChainableTypeChecker(validate);\n }\n\n function createStrictShapeTypeChecker(shapeTypes) {\n function validate(props, propName, componentName, location, propFullName) {\n var propValue = props[propName];\n var propType = getPropType(propValue);\n\n if (propType !== 'object') {\n return new PropTypeError('Invalid ' + location + ' `' + propFullName + '` of type `' + propType + '` ' + ('supplied to `' + componentName + '`, expected `object`.'));\n } // We need to check all keys in case some are required but missing from props.\n\n\n var allKeys = assign({}, props[propName], shapeTypes);\n\n for (var key in allKeys) {\n var checker = shapeTypes[key];\n\n if (has(shapeTypes, key) && typeof checker !== 'function') {\n return invalidValidatorError(componentName, location, propFullName, key, getPreciseType(checker));\n }\n\n if (!checker) {\n return new PropTypeError('Invalid ' + location + ' `' + propFullName + '` key `' + key + '` supplied to `' + componentName + '`.' + '\\nBad object: ' + JSON.stringify(props[propName], null, ' ') + '\\nValid keys: ' + JSON.stringify(Object.keys(shapeTypes), null, ' '));\n }\n\n var error = checker(propValue, key, componentName, location, propFullName + '.' + key, ReactPropTypesSecret$1);\n\n if (error) {\n return error;\n }\n }\n\n return null;\n }\n\n return createChainableTypeChecker(validate);\n }\n\n function isNode(propValue) {\n switch (typeof propValue) {\n case 'number':\n case 'string':\n case 'undefined':\n return true;\n\n case 'boolean':\n return !propValue;\n\n case 'object':\n if (Array.isArray(propValue)) {\n return propValue.every(isNode);\n }\n\n if (propValue === null || isValidElement(propValue)) {\n return true;\n }\n\n var iteratorFn = getIteratorFn(propValue);\n\n if (iteratorFn) {\n var iterator = iteratorFn.call(propValue);\n var step;\n\n if (iteratorFn !== propValue.entries) {\n while (!(step = iterator.next()).done) {\n if (!isNode(step.value)) {\n return false;\n }\n }\n } else {\n // Iterator will provide entry [k,v] tuples rather than values.\n while (!(step = iterator.next()).done) {\n var entry = step.value;\n\n if (entry) {\n if (!isNode(entry[1])) {\n return false;\n }\n }\n }\n }\n } else {\n return false;\n }\n\n return true;\n\n default:\n return false;\n }\n }\n\n function isSymbol(propType, propValue) {\n // Native Symbol.\n if (propType === 'symbol') {\n return true;\n } // falsy value can't be a Symbol\n\n\n if (!propValue) {\n return false;\n } // 19.4.3.5 Symbol.prototype[@@toStringTag] === 'Symbol'\n\n\n if (propValue['@@toStringTag'] === 'Symbol') {\n return true;\n } // Fallback for non-spec compliant Symbols which are polyfilled.\n\n\n if (typeof Symbol === 'function' && propValue instanceof Symbol) {\n return true;\n }\n\n return false;\n } // Equivalent of `typeof` but with special handling for array and regexp.\n\n\n function getPropType(propValue) {\n var propType = typeof propValue;\n\n if (Array.isArray(propValue)) {\n return 'array';\n }\n\n if (propValue instanceof RegExp) {\n // Old webkits (at least until Android 4.0) return 'function' rather than\n // 'object' for typeof a RegExp. We'll normalize this here so that /bla/\n // passes PropTypes.object.\n return 'object';\n }\n\n if (isSymbol(propType, propValue)) {\n return 'symbol';\n }\n\n return propType;\n } // This handles more types than `getPropType`. Only used for error messages.\n // See `createPrimitiveTypeChecker`.\n\n\n function getPreciseType(propValue) {\n if (typeof propValue === 'undefined' || propValue === null) {\n return '' + propValue;\n }\n\n var propType = getPropType(propValue);\n\n if (propType === 'object') {\n if (propValue instanceof Date) {\n return 'date';\n } else if (propValue instanceof RegExp) {\n return 'regexp';\n }\n }\n\n return propType;\n } // Returns a string that is postfixed to a warning about an invalid type.\n // For example, \"undefined\" or \"of type array\"\n\n\n function getPostfixForTypeWarning(value) {\n var type = getPreciseType(value);\n\n switch (type) {\n case 'array':\n case 'object':\n return 'an ' + type;\n\n case 'boolean':\n case 'date':\n case 'regexp':\n return 'a ' + type;\n\n default:\n return type;\n }\n } // Returns class name of the object, if any.\n\n\n function getClassName(propValue) {\n if (!propValue.constructor || !propValue.constructor.name) {\n return ANONYMOUS;\n }\n\n return propValue.constructor.name;\n }\n\n ReactPropTypes.checkPropTypes = checkPropTypes;\n ReactPropTypes.resetWarningCache = checkPropTypes.resetWarningCache;\n ReactPropTypes.PropTypes = ReactPropTypes;\n return ReactPropTypes;\n};\n/**\n * Copyright (c) 2013-present, Facebook, Inc.\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n\nvar ReactPropTypesSecret = ReactPropTypesSecret_1;\n\nfunction emptyFunction() {}\n\nfunction emptyFunctionWithReset() {}\n\nemptyFunctionWithReset.resetWarningCache = emptyFunction;\n\nvar factoryWithThrowingShims = function factoryWithThrowingShims() {\n function shim(props, propName, componentName, location, propFullName, secret) {\n if (secret === ReactPropTypesSecret) {\n // It is still safe when called from React.\n return;\n }\n\n var err = new Error('Calling PropTypes validators directly is not supported by the `prop-types` package. ' + 'Use PropTypes.checkPropTypes() to call them. ' + 'Read more at http://fb.me/use-check-prop-types');\n err.name = 'Invariant Violation';\n throw err;\n }\n\n shim.isRequired = shim;\n\n function getShim() {\n return shim;\n } // Important!\n // Keep this list in sync with production version in `./factoryWithTypeCheckers.js`.\n\n\n var ReactPropTypes = {\n array: shim,\n bigint: shim,\n bool: shim,\n func: shim,\n number: shim,\n object: shim,\n string: shim,\n symbol: shim,\n any: shim,\n arrayOf: getShim,\n element: shim,\n elementType: shim,\n instanceOf: getShim,\n node: shim,\n objectOf: getShim,\n oneOf: getShim,\n oneOfType: getShim,\n shape: getShim,\n exact: getShim,\n checkPropTypes: emptyFunctionWithReset,\n resetWarningCache: emptyFunction\n };\n ReactPropTypes.PropTypes = ReactPropTypes;\n return ReactPropTypes;\n};\n/**\n * Copyright (c) 2013-present, Facebook, Inc.\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n\nif (process.env.NODE_ENV !== 'production') {\n var ReactIs = reactIs.exports; // By explicitly using `prop-types` you are opting into new development behavior.\n // http://fb.me/prop-types-in-prod\n\n var throwOnDirectAccess = true;\n propTypes.exports = factoryWithTypeCheckers(ReactIs.isElement, throwOnDirectAccess);\n} else {\n // By explicitly using `prop-types` you are opting into new production behavior.\n // http://fb.me/prop-types-in-prod\n propTypes.exports = factoryWithThrowingShims();\n}\n\n/**\n * Copyright (c) 2013-present, Facebook, Inc.\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n/**\n * Use invariant() to assert state which your program assumes to be true.\n *\n * Provide sprintf-style format (only %s is supported) and arguments\n * to provide information about what broke and what you were\n * expecting.\n *\n * The invariant message will be stripped in production, but the invariant\n * will remain to ensure logic does not differ in production.\n */\nvar NODE_ENV = process.env.NODE_ENV;\n\nvar invariant = function invariant(condition, format, a, b, c, d, e, f) {\n if (NODE_ENV !== 'production') {\n if (format === undefined) {\n throw new Error('invariant requires an error message argument');\n }\n }\n\n if (!condition) {\n var error;\n\n if (format === undefined) {\n error = new Error('Minified exception occurred; use the non-minified dev environment ' + 'for the full error message and additional helpful warnings.');\n } else {\n var args = [a, b, c, d, e, f];\n var argIndex = 0;\n error = new Error(format.replace(/%s/g, function () {\n return args[argIndex++];\n }));\n error.name = 'Invariant Violation';\n }\n\n error.framesToPop = 1; // we don't care about invariant's own frame\n\n throw error;\n }\n};\n\nvar invariant_1 = invariant;\nvar lib = {\n exports: {}\n};\nvar implementation = {\n exports: {}\n};\nvar key = '__global_unique_id__';\n\nvar gud = function gud() {\n return commonjsGlobal[key] = (commonjsGlobal[key] || 0) + 1;\n};\n/**\n * Copyright (c) 2014-present, Facebook, Inc.\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n/**\n * Similar to invariant but only logs a warning if the condition is not met.\n * This can be used to log issues in development environments in critical\n * paths. Removing the logging code for production environments will keep the\n * same logic and follow the same code paths.\n */\n\n\nvar __DEV__ = process.env.NODE_ENV !== 'production';\n\nvar warning = function warning() {};\n\nif (__DEV__) {\n var printWarning = function printWarning(format, args) {\n var len = arguments.length;\n args = new Array(len > 1 ? len - 1 : 0);\n\n for (var key = 1; key < len; key++) {\n args[key - 1] = arguments[key];\n }\n\n var argIndex = 0;\n var message = 'Warning: ' + format.replace(/%s/g, function () {\n return args[argIndex++];\n });\n\n if (typeof console !== 'undefined') {\n console.error(message);\n }\n\n try {\n // --- Welcome to debugging React ---\n // This error was thrown as a convenience so that you can use this stack\n // to find the callsite that caused this warning to fire.\n throw new Error(message);\n } catch (x) {}\n };\n\n warning = function warning(condition, format, args) {\n var len = arguments.length;\n args = new Array(len > 2 ? len - 2 : 0);\n\n for (var key = 2; key < len; key++) {\n args[key - 2] = arguments[key];\n }\n\n if (format === undefined) {\n throw new Error('`warning(condition, format, ...args)` requires a warning ' + 'message argument');\n }\n\n if (!condition) {\n printWarning.apply(null, [format].concat(args));\n }\n };\n}\n\nvar warning_1 = warning;\n\n(function (module, exports) {\n exports.__esModule = true;\n var _react = React;\n\n _interopRequireDefault(_react);\n\n var _propTypes = propTypes.exports;\n\n var _propTypes2 = _interopRequireDefault(_propTypes);\n\n var _gud = gud;\n\n var _gud2 = _interopRequireDefault(_gud);\n\n var _warning = warning_1;\n\n var _warning2 = _interopRequireDefault(_warning);\n\n function _interopRequireDefault(obj) {\n return obj && obj.__esModule ? obj : {\n default: obj\n };\n }\n\n function _classCallCheck(instance, Constructor) {\n if (!(instance instanceof Constructor)) {\n throw new TypeError(\"Cannot call a class as a function\");\n }\n }\n\n function _possibleConstructorReturn(self, call) {\n if (!self) {\n throw new ReferenceError(\"this hasn't been initialised - super() hasn't been called\");\n }\n\n return call && (typeof call === \"object\" || typeof call === \"function\") ? call : self;\n }\n\n function _inherits(subClass, superClass) {\n if (typeof superClass !== \"function\" && superClass !== null) {\n throw new TypeError(\"Super expression must either be null or a function, not \" + typeof superClass);\n }\n\n subClass.prototype = Object.create(superClass && superClass.prototype, {\n constructor: {\n value: subClass,\n enumerable: false,\n writable: true,\n configurable: true\n }\n });\n if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass;\n }\n\n var MAX_SIGNED_31_BIT_INT = 1073741823; // Inlined Object.is polyfill.\n // https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/is\n\n function objectIs(x, y) {\n if (x === y) {\n return x !== 0 || 1 / x === 1 / y;\n } else {\n return x !== x && y !== y;\n }\n }\n\n function createEventEmitter(value) {\n var handlers = [];\n return {\n on: function on(handler) {\n handlers.push(handler);\n },\n off: function off(handler) {\n handlers = handlers.filter(function (h) {\n return h !== handler;\n });\n },\n get: function get() {\n return value;\n },\n set: function set(newValue, changedBits) {\n value = newValue;\n handlers.forEach(function (handler) {\n return handler(value, changedBits);\n });\n }\n };\n }\n\n function onlyChild(children) {\n return Array.isArray(children) ? children[0] : children;\n }\n\n function createReactContext(defaultValue, calculateChangedBits) {\n var _Provider$childContex, _Consumer$contextType;\n\n var contextProp = '__create-react-context-' + (0, _gud2.default)() + '__';\n\n var Provider = function (_Component) {\n _inherits(Provider, _Component);\n\n function Provider() {\n var _temp, _this, _ret;\n\n _classCallCheck(this, Provider);\n\n for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {\n args[_key] = arguments[_key];\n }\n\n return _ret = (_temp = (_this = _possibleConstructorReturn(this, _Component.call.apply(_Component, [this].concat(args))), _this), _this.emitter = createEventEmitter(_this.props.value), _temp), _possibleConstructorReturn(_this, _ret);\n }\n\n Provider.prototype.getChildContext = function getChildContext() {\n var _ref;\n\n return _ref = {}, _ref[contextProp] = this.emitter, _ref;\n };\n\n Provider.prototype.componentWillReceiveProps = function componentWillReceiveProps(nextProps) {\n if (this.props.value !== nextProps.value) {\n var oldValue = this.props.value;\n var newValue = nextProps.value;\n var changedBits = void 0;\n\n if (objectIs(oldValue, newValue)) {\n changedBits = 0; // No change\n } else {\n changedBits = typeof calculateChangedBits === 'function' ? calculateChangedBits(oldValue, newValue) : MAX_SIGNED_31_BIT_INT;\n\n if (process.env.NODE_ENV !== 'production') {\n (0, _warning2.default)((changedBits & MAX_SIGNED_31_BIT_INT) === changedBits, 'calculateChangedBits: Expected the return value to be a ' + '31-bit integer. Instead received: %s', changedBits);\n }\n\n changedBits |= 0;\n\n if (changedBits !== 0) {\n this.emitter.set(nextProps.value, changedBits);\n }\n }\n }\n };\n\n Provider.prototype.render = function render() {\n return this.props.children;\n };\n\n return Provider;\n }(_react.Component);\n\n Provider.childContextTypes = (_Provider$childContex = {}, _Provider$childContex[contextProp] = _propTypes2.default.object.isRequired, _Provider$childContex);\n\n var Consumer = function (_Component2) {\n _inherits(Consumer, _Component2);\n\n function Consumer() {\n var _temp2, _this2, _ret2;\n\n _classCallCheck(this, Consumer);\n\n for (var _len2 = arguments.length, args = Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {\n args[_key2] = arguments[_key2];\n }\n\n return _ret2 = (_temp2 = (_this2 = _possibleConstructorReturn(this, _Component2.call.apply(_Component2, [this].concat(args))), _this2), _this2.state = {\n value: _this2.getValue()\n }, _this2.onUpdate = function (newValue, changedBits) {\n var observedBits = _this2.observedBits | 0;\n\n if ((observedBits & changedBits) !== 0) {\n _this2.setState({\n value: _this2.getValue()\n });\n }\n }, _temp2), _possibleConstructorReturn(_this2, _ret2);\n }\n\n Consumer.prototype.componentWillReceiveProps = function componentWillReceiveProps(nextProps) {\n var observedBits = nextProps.observedBits;\n this.observedBits = observedBits === undefined || observedBits === null ? MAX_SIGNED_31_BIT_INT // Subscribe to all changes by default\n : observedBits;\n };\n\n Consumer.prototype.componentDidMount = function componentDidMount() {\n if (this.context[contextProp]) {\n this.context[contextProp].on(this.onUpdate);\n }\n\n var observedBits = this.props.observedBits;\n this.observedBits = observedBits === undefined || observedBits === null ? MAX_SIGNED_31_BIT_INT // Subscribe to all changes by default\n : observedBits;\n };\n\n Consumer.prototype.componentWillUnmount = function componentWillUnmount() {\n if (this.context[contextProp]) {\n this.context[contextProp].off(this.onUpdate);\n }\n };\n\n Consumer.prototype.getValue = function getValue() {\n if (this.context[contextProp]) {\n return this.context[contextProp].get();\n } else {\n return defaultValue;\n }\n };\n\n Consumer.prototype.render = function render() {\n return onlyChild(this.props.children)(this.state.value);\n };\n\n return Consumer;\n }(_react.Component);\n\n Consumer.contextTypes = (_Consumer$contextType = {}, _Consumer$contextType[contextProp] = _propTypes2.default.object, _Consumer$contextType);\n return {\n Provider: Provider,\n Consumer: Consumer\n };\n }\n\n exports.default = createReactContext;\n module.exports = exports['default'];\n})(implementation, implementation.exports);\n\n(function (module, exports) {\n exports.__esModule = true;\n var _react = React;\n\n var _react2 = _interopRequireDefault(_react);\n\n var _implementation = implementation.exports;\n\n var _implementation2 = _interopRequireDefault(_implementation);\n\n function _interopRequireDefault(obj) {\n return obj && obj.__esModule ? obj : {\n default: obj\n };\n }\n\n exports.default = _react2.default.createContext || _implementation2.default;\n module.exports = exports['default'];\n})(lib, lib.exports);\n\nvar createContext = /*@__PURE__*/getDefaultExportFromCjs(lib.exports);\n/**\n * Copyright (c) 2013-present, Facebook, Inc.\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nfunction componentWillMount() {\n // Call this.constructor.gDSFP to support sub-classes.\n var state = this.constructor.getDerivedStateFromProps(this.props, this.state);\n\n if (state !== null && state !== undefined) {\n this.setState(state);\n }\n}\n\nfunction componentWillReceiveProps(nextProps) {\n // Call this.constructor.gDSFP to support sub-classes.\n // Use the setState() updater to ensure state isn't stale in certain edge cases.\n function updater(prevState) {\n var state = this.constructor.getDerivedStateFromProps(nextProps, prevState);\n return state !== null && state !== undefined ? state : null;\n } // Binding \"this\" is important for shallow renderer support.\n\n\n this.setState(updater.bind(this));\n}\n\nfunction componentWillUpdate(nextProps, nextState) {\n try {\n var prevProps = this.props;\n var prevState = this.state;\n this.props = nextProps;\n this.state = nextState;\n this.__reactInternalSnapshotFlag = true;\n this.__reactInternalSnapshot = this.getSnapshotBeforeUpdate(prevProps, prevState);\n } finally {\n this.props = prevProps;\n this.state = prevState;\n }\n} // React may warn about cWM/cWRP/cWU methods being deprecated.\n// Add a flag to suppress these warnings for this special case.\n\n\ncomponentWillMount.__suppressDeprecationWarning = true;\ncomponentWillReceiveProps.__suppressDeprecationWarning = true;\ncomponentWillUpdate.__suppressDeprecationWarning = true;\n\nfunction polyfill(Component) {\n var prototype = Component.prototype;\n\n if (!prototype || !prototype.isReactComponent) {\n throw new Error('Can only polyfill class components');\n }\n\n if (typeof Component.getDerivedStateFromProps !== 'function' && typeof prototype.getSnapshotBeforeUpdate !== 'function') {\n return Component;\n } // If new component APIs are defined, \"unsafe\" lifecycles won't be called.\n // Error if any of these lifecycles are present,\n // Because they would work differently between older and newer (16.3+) versions of React.\n\n\n var foundWillMountName = null;\n var foundWillReceivePropsName = null;\n var foundWillUpdateName = null;\n\n if (typeof prototype.componentWillMount === 'function') {\n foundWillMountName = 'componentWillMount';\n } else if (typeof prototype.UNSAFE_componentWillMount === 'function') {\n foundWillMountName = 'UNSAFE_componentWillMount';\n }\n\n if (typeof prototype.componentWillReceiveProps === 'function') {\n foundWillReceivePropsName = 'componentWillReceiveProps';\n } else if (typeof prototype.UNSAFE_componentWillReceiveProps === 'function') {\n foundWillReceivePropsName = 'UNSAFE_componentWillReceiveProps';\n }\n\n if (typeof prototype.componentWillUpdate === 'function') {\n foundWillUpdateName = 'componentWillUpdate';\n } else if (typeof prototype.UNSAFE_componentWillUpdate === 'function') {\n foundWillUpdateName = 'UNSAFE_componentWillUpdate';\n }\n\n if (foundWillMountName !== null || foundWillReceivePropsName !== null || foundWillUpdateName !== null) {\n var componentName = Component.displayName || Component.name;\n var newApiName = typeof Component.getDerivedStateFromProps === 'function' ? 'getDerivedStateFromProps()' : 'getSnapshotBeforeUpdate()';\n throw Error('Unsafe legacy lifecycles will not be called for components using new component APIs.\\n\\n' + componentName + ' uses ' + newApiName + ' but also contains the following legacy lifecycles:' + (foundWillMountName !== null ? '\\n ' + foundWillMountName : '') + (foundWillReceivePropsName !== null ? '\\n ' + foundWillReceivePropsName : '') + (foundWillUpdateName !== null ? '\\n ' + foundWillUpdateName : '') + '\\n\\nThe above lifecycles should be removed. Learn more about this warning here:\\n' + 'https://fb.me/react-async-component-lifecycle-hooks');\n } // React <= 16.2 does not support static getDerivedStateFromProps.\n // As a workaround, use cWM and cWRP to invoke the new static lifecycle.\n // Newer versions of React will ignore these lifecycles if gDSFP exists.\n\n\n if (typeof Component.getDerivedStateFromProps === 'function') {\n prototype.componentWillMount = componentWillMount;\n prototype.componentWillReceiveProps = componentWillReceiveProps;\n } // React <= 16.2 does not support getSnapshotBeforeUpdate.\n // As a workaround, use cWU to invoke the new lifecycle.\n // Newer versions of React will ignore that lifecycle if gSBU exists.\n\n\n if (typeof prototype.getSnapshotBeforeUpdate === 'function') {\n if (typeof prototype.componentDidUpdate !== 'function') {\n throw new Error('Cannot polyfill getSnapshotBeforeUpdate() for components that do not define componentDidUpdate() on the prototype');\n }\n\n prototype.componentWillUpdate = componentWillUpdate;\n var componentDidUpdate = prototype.componentDidUpdate;\n\n prototype.componentDidUpdate = function componentDidUpdatePolyfill(prevProps, prevState, maybeSnapshot) {\n // 16.3+ will not execute our will-update method;\n // It will pass a snapshot value to did-update though.\n // Older versions will require our polyfilled will-update value.\n // We need to handle both cases, but can't just check for the presence of \"maybeSnapshot\",\n // Because for <= 15.x versions this might be a \"prevContext\" object.\n // We also can't just check \"__reactInternalSnapshot\",\n // Because get-snapshot might return a falsy value.\n // So check for the explicit __reactInternalSnapshotFlag flag to determine behavior.\n var snapshot = this.__reactInternalSnapshotFlag ? this.__reactInternalSnapshot : maybeSnapshot;\n componentDidUpdate.call(this, prevProps, prevState, snapshot);\n };\n }\n\n return Component;\n} ////////////////////////////////////////////////////////////////////////////////\n// startsWith(string, search) - Check if `string` starts with `search`\n\n\nvar startsWith = function startsWith(string, search) {\n return string.substr(0, search.length) === search;\n}; ////////////////////////////////////////////////////////////////////////////////\n// pick(routes, uri)\n//\n// Ranks and picks the best route to match. Each segment gets the highest\n// amount of points, then the type of segment gets an additional amount of\n// points where\n//\n// static > dynamic > splat > root\n//\n// This way we don't have to worry about the order of our routes, let the\n// computers do it.\n//\n// A route looks like this\n//\n// { path, default, value }\n//\n// And a returned match looks like:\n//\n// { route, params, uri }\n//\n// I know, I should use TypeScript not comments for these types.\n\n\nvar pick = function pick(routes, uri) {\n var match = void 0;\n var default_ = void 0;\n\n var _uri$split = uri.split(\"?\"),\n uriPathname = _uri$split[0];\n\n var uriSegments = segmentize(uriPathname);\n var isRootUri = uriSegments[0] === \"\";\n var ranked = rankRoutes(routes);\n\n for (var i = 0, l = ranked.length; i < l; i++) {\n var missed = false;\n var route = ranked[i].route;\n\n if (route.default) {\n default_ = {\n route: route,\n params: {},\n uri: uri\n };\n continue;\n }\n\n var routeSegments = segmentize(route.path);\n var params = {};\n var max = Math.max(uriSegments.length, routeSegments.length);\n var index = 0;\n\n for (; index < max; index++) {\n var routeSegment = routeSegments[index];\n var uriSegment = uriSegments[index];\n\n if (isSplat(routeSegment)) {\n // Hit a splat, just grab the rest, and return a match\n // uri: /files/documents/work\n // route: /files/*\n var param = routeSegment.slice(1) || \"*\";\n params[param] = uriSegments.slice(index).map(decodeURIComponent).join(\"/\");\n break;\n }\n\n if (uriSegment === undefined) {\n // URI is shorter than the route, no match\n // uri: /users\n // route: /users/:userId\n missed = true;\n break;\n }\n\n var dynamicMatch = paramRe.exec(routeSegment);\n\n if (dynamicMatch && !isRootUri) {\n var matchIsNotReserved = reservedNames.indexOf(dynamicMatch[1]) === -1;\n !matchIsNotReserved ? process.env.NODE_ENV !== \"production\" ? invariant_1(false, \" dynamic segment \\\"\" + dynamicMatch[1] + \"\\\" is a reserved name. Please use a different name in path \\\"\" + route.path + \"\\\".\") : invariant_1(false) : void 0;\n var value = decodeURIComponent(uriSegment);\n params[dynamicMatch[1]] = value;\n } else if (routeSegment !== uriSegment) {\n // Current segments don't match, not dynamic, not splat, so no match\n // uri: /users/123/settings\n // route: /users/:id/profile\n missed = true;\n break;\n }\n }\n\n if (!missed) {\n match = {\n route: route,\n params: params,\n uri: \"/\" + uriSegments.slice(0, index).join(\"/\")\n };\n break;\n }\n }\n\n return match || default_ || null;\n}; ////////////////////////////////////////////////////////////////////////////////\n// resolve(to, basepath)\n//\n// Resolves URIs as though every path is a directory, no files. Relative URIs\n// in the browser can feel awkward because not only can you be \"in a directory\"\n// you can be \"at a file\", too. For example\n//\n// browserSpecResolve('foo', '/bar/') => /bar/foo\n// browserSpecResolve('foo', '/bar') => /foo\n//\n// But on the command line of a file system, it's not as complicated, you can't\n// `cd` from a file, only directories. This way, links have to know less about\n// their current path. To go deeper you can do this:\n//\n// \\n\\nNothing matched:\\n\\t${\n // location.pathname\n // }\\n\\nPaths checked: \\n\\t${routes\n // .map(route => route.path)\n // .join(\n // \"\\n\\t\"\n // )}\\n\\nTo get rid of this warning, add a default NotFound component as child of Router:\n // \\n\\tlet NotFound = () => Not Found!
\n // \\n\\t\\n\\t `\n // );\n return null;\n }\n };\n\n return RouterImpl;\n}(React.PureComponent);\n\nRouterImpl.defaultProps = {\n primary: true\n};\nvar FocusContext = createNamedContext(\"Focus\");\n\nvar FocusHandler = function FocusHandler(_ref3) {\n var uri = _ref3.uri,\n location = _ref3.location,\n component = _ref3.component,\n domProps = _objectWithoutProperties(_ref3, [\"uri\", \"location\", \"component\"]);\n\n return React.createElement(FocusContext.Consumer, null, function (requestFocus) {\n return React.createElement(FocusHandlerImpl, _extends({}, domProps, {\n component: component,\n requestFocus: requestFocus,\n uri: uri,\n location: location\n }));\n });\n}; // don't focus on initial render\n\n\nvar initialRender = true;\nvar focusHandlerCount = 0;\n\nvar FocusHandlerImpl = function (_React$Component2) {\n _inherits(FocusHandlerImpl, _React$Component2);\n\n function FocusHandlerImpl() {\n var _temp2, _this4, _ret2;\n\n _classCallCheck(this, FocusHandlerImpl);\n\n for (var _len2 = arguments.length, args = Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {\n args[_key2] = arguments[_key2];\n }\n\n return _ret2 = (_temp2 = (_this4 = _possibleConstructorReturn(this, _React$Component2.call.apply(_React$Component2, [this].concat(args))), _this4), _this4.state = {}, _this4.requestFocus = function (node) {\n if (!_this4.state.shouldFocus && node) {\n node.focus();\n }\n }, _temp2), _possibleConstructorReturn(_this4, _ret2);\n }\n\n FocusHandlerImpl.getDerivedStateFromProps = function getDerivedStateFromProps(nextProps, prevState) {\n var initial = prevState.uri == null;\n\n if (initial) {\n return _extends({\n shouldFocus: true\n }, nextProps);\n } else {\n var myURIChanged = nextProps.uri !== prevState.uri;\n var navigatedUpToMe = prevState.location.pathname !== nextProps.location.pathname && nextProps.location.pathname === nextProps.uri;\n return _extends({\n shouldFocus: myURIChanged || navigatedUpToMe\n }, nextProps);\n }\n };\n\n FocusHandlerImpl.prototype.componentDidMount = function componentDidMount() {\n focusHandlerCount++;\n this.focus();\n };\n\n FocusHandlerImpl.prototype.componentWillUnmount = function componentWillUnmount() {\n focusHandlerCount--;\n\n if (focusHandlerCount === 0) {\n initialRender = true;\n }\n };\n\n FocusHandlerImpl.prototype.componentDidUpdate = function componentDidUpdate(prevProps, prevState) {\n if (prevProps.location !== this.props.location && this.state.shouldFocus) {\n this.focus();\n }\n };\n\n FocusHandlerImpl.prototype.focus = function focus() {\n if (process.env.NODE_ENV === \"test\") {\n // getting cannot read property focus of null in the tests\n // and that bit of global `initialRender` state causes problems\n // should probably figure it out!\n return;\n }\n\n var requestFocus = this.props.requestFocus;\n\n if (requestFocus) {\n requestFocus(this.node);\n } else {\n if (initialRender) {\n initialRender = false;\n } else if (this.node) {\n // React polyfills [autofocus] and it fires earlier than cDM,\n // so we were stealing focus away, this line prevents that.\n if (!this.node.contains(document.activeElement)) {\n this.node.focus();\n }\n }\n }\n };\n\n FocusHandlerImpl.prototype.render = function render() {\n var _this5 = this;\n\n var _props2 = this.props;\n _props2.children;\n var style = _props2.style;\n _props2.requestFocus;\n var _props2$component = _props2.component,\n Comp = _props2$component === undefined ? \"div\" : _props2$component;\n _props2.uri;\n _props2.location;\n\n var domProps = _objectWithoutProperties(_props2, [\"children\", \"style\", \"requestFocus\", \"component\", \"uri\", \"location\"]);\n\n return React.createElement(Comp, _extends({\n style: _extends({\n outline: \"none\"\n }, style),\n tabIndex: \"-1\",\n ref: function ref(n) {\n return _this5.node = n;\n }\n }, domProps), React.createElement(FocusContext.Provider, {\n value: this.requestFocus\n }, this.props.children));\n };\n\n return FocusHandlerImpl;\n}(React.Component);\n\npolyfill(FocusHandlerImpl);\n\nvar k = function k() {}; ////////////////////////////////////////////////////////////////////////////////\n\n\nvar forwardRef = React.forwardRef;\n\nif (typeof forwardRef === \"undefined\") {\n forwardRef = function forwardRef(C) {\n return C;\n };\n}\n\nvar Link = forwardRef(function (_ref4, ref) {\n var innerRef = _ref4.innerRef,\n props = _objectWithoutProperties(_ref4, [\"innerRef\"]);\n\n return React.createElement(BaseContext.Consumer, null, function (_ref5) {\n _ref5.basepath;\n var baseuri = _ref5.baseuri;\n return React.createElement(Location, null, function (_ref6) {\n var location = _ref6.location,\n navigate = _ref6.navigate;\n\n var to = props.to,\n state = props.state,\n replace = props.replace,\n _props$getProps = props.getProps,\n getProps = _props$getProps === undefined ? k : _props$getProps,\n anchorProps = _objectWithoutProperties(props, [\"to\", \"state\", \"replace\", \"getProps\"]);\n\n var href = resolve(to, baseuri);\n var encodedHref = encodeURI(href);\n var isCurrent = location.pathname === encodedHref;\n var isPartiallyCurrent = startsWith(location.pathname, encodedHref);\n return React.createElement(\"a\", _extends({\n ref: ref || innerRef,\n \"aria-current\": isCurrent ? \"page\" : undefined\n }, anchorProps, getProps({\n isCurrent: isCurrent,\n isPartiallyCurrent: isPartiallyCurrent,\n href: href,\n location: location\n }), {\n href: href,\n onClick: function onClick(event) {\n if (anchorProps.onClick) anchorProps.onClick(event);\n\n if (shouldNavigate(event)) {\n event.preventDefault();\n var shouldReplace = replace;\n\n if (typeof replace !== \"boolean\" && isCurrent) {\n var _location$state = _extends({}, location.state);\n\n _location$state.key;\n\n var restState = _objectWithoutProperties(_location$state, [\"key\"]);\n\n shouldReplace = shallowCompare(_extends({}, state), restState);\n }\n\n navigate(href, {\n state: state,\n replace: shouldReplace\n });\n }\n }\n }));\n });\n });\n});\nLink.displayName = \"Link\";\nprocess.env.NODE_ENV !== \"production\" ? void 0 : void 0; ////////////////////////////////////////////////////////////////////////////////\n\nfunction RedirectRequest(uri) {\n this.uri = uri;\n}\n\nvar isRedirect = function isRedirect(o) {\n return o instanceof RedirectRequest;\n};\n\nvar redirectTo = function redirectTo(to) {\n throw new RedirectRequest(to);\n};\n\nvar RedirectImpl = function (_React$Component3) {\n _inherits(RedirectImpl, _React$Component3);\n\n function RedirectImpl() {\n _classCallCheck(this, RedirectImpl);\n\n return _possibleConstructorReturn(this, _React$Component3.apply(this, arguments));\n } // Support React < 16 with this hook\n\n\n RedirectImpl.prototype.componentDidMount = function componentDidMount() {\n var _props3 = this.props,\n navigate = _props3.navigate,\n to = _props3.to;\n _props3.from;\n var _props3$replace = _props3.replace,\n replace = _props3$replace === undefined ? true : _props3$replace,\n state = _props3.state;\n _props3.noThrow;\n\n var baseuri = _props3.baseuri,\n props = _objectWithoutProperties(_props3, [\"navigate\", \"to\", \"from\", \"replace\", \"state\", \"noThrow\", \"baseuri\"]);\n\n Promise.resolve().then(function () {\n var resolvedTo = resolve(to, baseuri);\n navigate(insertParams(resolvedTo, props), {\n replace: replace,\n state: state\n });\n });\n };\n\n RedirectImpl.prototype.render = function render() {\n var _props4 = this.props;\n _props4.navigate;\n var to = _props4.to;\n _props4.from;\n _props4.replace;\n _props4.state;\n\n var noThrow = _props4.noThrow,\n baseuri = _props4.baseuri,\n props = _objectWithoutProperties(_props4, [\"navigate\", \"to\", \"from\", \"replace\", \"state\", \"noThrow\", \"baseuri\"]);\n\n var resolvedTo = resolve(to, baseuri);\n if (!noThrow) redirectTo(insertParams(resolvedTo, props));\n return null;\n };\n\n return RedirectImpl;\n}(React.Component);\n\nvar Redirect = function Redirect(props) {\n return React.createElement(BaseContext.Consumer, null, function (_ref7) {\n var baseuri = _ref7.baseuri;\n return React.createElement(Location, null, function (locationContext) {\n return React.createElement(RedirectImpl, _extends({}, locationContext, {\n baseuri: baseuri\n }, props));\n });\n });\n};\n\nprocess.env.NODE_ENV !== \"production\" ? void 0 : void 0; ////////////////////////////////////////////////////////////////////////////////\n// Junk\n\nvar stripSlashes = function stripSlashes(str) {\n return str.replace(/(^\\/+|\\/+$)/g, \"\");\n};\n\nvar createRoute = function createRoute(basepath) {\n return function (element) {\n if (!element) {\n return null;\n }\n\n if (element.type === React.Fragment && element.props.children) {\n return React.Children.map(element.props.children, createRoute(basepath));\n }\n\n !(element.props.path || element.props.default || element.type === Redirect) ? process.env.NODE_ENV !== \"production\" ? invariant_1(false, \": Children of must have a `path` or `default` prop, or be a ``. None found on element type `\" + element.type + \"`\") : invariant_1(false) : void 0;\n !!(element.type === Redirect && (!element.props.from || !element.props.to)) ? process.env.NODE_ENV !== \"production\" ? invariant_1(false, \".\") : invariant_1(false) : void 0;\n !!(element.type === Redirect && !validateRedirect(element.props.from, element.props.to)) ? process.env.NODE_ENV !== \"production\" ? invariant_1(false, \" = ({\n text,\n title,\n show_bullets\n}) => {\n const noBullets = show_bullets === 'Hide'\n return (\n \n {title && (\n = ({\n features = [],\n title,\n subtitle,\n spacerVariant = 'md'\n}) => {\n const desktop = useDesktop()\n return (\n \n {spacerVariant !== 'none' &&\n \n )\n}\n","import { Box, Grid } from '@material-ui/core'\nimport { Spacer } from 'common/components/molecules/Spacer'\nimport { Text } from 'common/components/molecules/Text'\nimport { useDesktop } from 'common/hooks/useDesktop'\nimport React from 'react'\nimport { JumbotronCallToAction } from '../Jumbotron/JumbotronCallToAction'\nimport { FeatureListProps, featureListStyles } from './FeatureList'\nimport { FeatureListImage } from './FeatureListImage'\nimport { Features } from './Features'\n\nexport const FeatureListLeft: React.FC = ({\n features,\n image,\n scale,\n title,\n callToAction,\n cta,\n text,\n subtitle,\n featureTitle,\n featureSubtitle,\n secondaryTitle\n}) => {\n const desktop = useDesktop()\n return (\n \n {secondaryTitle && (\n \n \n \n \n \n {!desktop && \n \n \n \n \n \n \n \n )\n}\n","import { Box, Grid } from '@material-ui/core'\nimport { Spacer } from 'common/components/molecules/Spacer'\nimport { Text } from 'common/components/molecules/Text'\nimport { useDesktop } from 'common/hooks/useDesktop'\nimport React from 'react'\nimport { JumbotronCallToAction } from '../Jumbotron/JumbotronCallToAction'\nimport { FeatureListProps, featureListStyles } from './FeatureList'\nimport { FeatureListImage } from './FeatureListImage'\nimport { Features } from './Features'\n\nexport const FeatureListRight: React.FC = ({\n features,\n image,\n scale,\n title,\n callToAction,\n cta,\n text,\n subtitle,\n featureTitle,\n featureSubtitle,\n secondaryTitle\n}) => {\n const desktop = useDesktop()\n return (\n \n {secondaryTitle && (\n \n \n \n \n \n \n \n \n \n {title && !desktop && (\n <>\n \n \n \n \n )\n}\n","import { Box, Grid } from '@material-ui/core'\nimport { Spacer } from 'common/components/molecules/Spacer'\nimport { Text } from 'common/components/molecules/Text'\nimport { useDesktop } from 'common/hooks/useDesktop'\nimport React from 'react'\nimport { FeatureListProps, featureListStyles } from './FeatureList'\nimport { FeatureListImage } from './FeatureListImage'\nimport { Features } from './Features'\n\nexport interface FeatureListTopProps extends FeatureListProps {\n subtitle: string\n bulletsTitle: string\n}\n\nexport const FeatureListTop: React.FC = ({\n callToAction,\n features,\n image,\n scale,\n subtitle,\n title,\n bulletsTitle,\n secondaryTitle\n}) => {\n const desktop = useDesktop()\n return (\n \n {secondaryTitle && (\n \n \n \n \n \n \n \n \n \n {!desktop && \n \n \n \n )\n}\n","import React from 'react'\nimport { JumbotronCallToActionProps } from '../Jumbotron/JumbotronCallToAction'\nimport { FeatureProps } from './Feature'\nimport { FeatureListLeft } from './FeatureListLeft'\nimport { FeatureListRight } from './FeatureListRight'\nimport { FeatureListTop, FeatureListTopProps } from './FeatureListTop'\n\nexport interface FeatureListProps {\n variant?: 'top' | 'left' | 'right'\n features: FeatureProps[]\n subtitle?: string\n image?: string\n scale?: number\n title: string\n callToAction?: JumbotronCallToActionProps\n cta?: string\n text?: string\n featureTitle?: string\n featureSubtitle?: string\n secondaryTitle?: string\n}\n\nexport const featureListStyles = {\n column: {\n display: 'flex',\n maxHeight: '100%',\n flexDirection: 'column',\n justifyContent: 'center'\n }\n}\n\nexport const FeatureList: React.FC = ({\n variant = 'right',\n ...props\n}) => {\n switch (variant) {\n case 'top':\n return