{"version":3,"file":"static/js/Process.203f7762.js","mappings":"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","sources":["components/Process/Process.styled.ts","components/Process/Process.tsx"],"sourcesContent":["import { styled, css } from \"styled-components\";\nimport theme from \"styled-theming\";\n\nimport Icon from \"components/Icon\";\nimport Link from \"components/Link\";\nimport { Container as GridContainer } from \"style/components/Page\";\nimport {\n    BodyL,\n    styleBodyM,\n    styleHeadingM,\n    styleHeadingXL,\n    styleLabelM,\n} from \"style/components/Typography\";\nimport { columnGap } from \"style/grid\";\nimport { MQ } from \"style/mediaQueries\";\n\nconst background = theme(\"theme\", {\n    lightgray: \"--background-default\",\n    blue: \"--block-blue-default\",\n    cyan: \"--block-cyan-default\",\n});\n\nconst circularColor = theme(\"theme\", {\n    lightgray: \"--icon-on-neutral-disabled\",\n    blue: \"--icon-on-blue-disabled\",\n    cyan: \"--icon-on-cyan-disabled\",\n});\n\nconst indicatorBackgroundActive = theme(\"theme\", {\n    lightgray: \"--icon-on-neutral-primary\",\n    blue: \"--icon-on-blue-primary\",\n    cyan: \"--icon-on-cyan-primary\",\n});\n\nconst indicatorColorActive = theme(\"theme\", {\n    lightgray: \"--text-inverted\",\n    blue: \"--text-on-cyan-primary\",\n    cyan: \"--text-on-blue-primary\",\n});\n\nconst indicatorColor = theme(\"theme\", {\n    lightgray: \"--text-on-neutral-disabled\",\n    blue: \"--text-on-blue-disabled\",\n    cyan: \"--text-on-cyan-disabled\",\n});\n\nconst linkColor = theme(\"theme\", {\n    lightgray: \"--text-on-neutral-secondary\",\n    blue: \"--text-on-blue-secondary\",\n    cyan: \"--text-on-cyan-secondary\",\n});\n\nconst hoverColor = theme(\"contentTheme\", {\n    black: \"--text-on-neutral-link\",\n    cyan: \"--text-on-blue-primary-alt\",\n    blue: \"--text-on-cyan-primary\",\n    white: \"--text-on-neutral-inverted\",\n});\n\nexport const Content = styled(GridContainer)`\n    ${columnGap}\n    display: grid;\n    grid-template: auto 1fr / repeat(4, 1fr);\n    grid-template-areas:\n        \"heading\"\n        \"introduction\"\n        \"steps\";\n    width: 100%;\n\n    ${MQ.FROM_M} {\n        grid-template-columns: repeat(12, 1fr);\n    }\n\n    ${MQ.FROM_L} {\n        grid-template-areas:\n            \"heading steps\"\n            \"introduction steps\";\n    }\n`;\n\nexport const Heading = styled.h2`\n    ${styleHeadingXL}\n    grid-area: heading;\n    grid-column: 1 / span 3;\n    justify-self: flex-start;\n    margin-bottom: 1.3125rem;\n    margin-top: 0;\n\n    ${MQ.FROM_M} {\n        grid-column: 1 / span 8;\n    }\n\n    ${MQ.FROM_L} {\n        grid-column: 1 / span 6;\n    }\n\n    ${MQ.FROM_XL} {\n        margin-bottom: 1.75rem;\n    }\n`;\n\nexport const Introduction = styled(BodyL)`\n    grid-area: introduction;\n    grid-column: 1 / span 4;\n    justify-self: flex-start;\n\n    ${MQ.FROM_M} {\n        grid-column: 1 / span 8;\n    }\n\n    ${MQ.FROM_L} {\n        grid-column: 1 / span 5;\n    }\n`;\n\nexport const StepsWrapper = styled.div`\n    --circular-size: 1.75rem;\n    --indicator-size: 2.625rem;\n\n    grid-area: steps;\n    grid-column: 1 / span 4;\n    position: relative;\n\n    ${MQ.FROM_M} {\n        --circular-size: 2.625rem;\n\n        grid-column: 5 / span 8;\n    }\n\n    ${MQ.FROM_L} {\n        grid-column: 7 / span 6;\n    }\n\n    ${MQ.FROM_XL} {\n        --circular-size: 3.5rem;\n        --indicator-size: 3.5rem;\n\n        grid-column: 7 / span 5;\n    }\n`;\n\nexport const Steps = styled.ol`\n    counter-reset: item;\n    display: flex;\n    flex-direction: column;\n    margin: 2.625rem 0 1.75rem;\n    padding-left: 1.25rem;\n    row-gap: 1.3125rem;\n\n    ${MQ.FROM_M} {\n        margin: 3.5rem 0 2.625rem;\n    }\n\n    ${MQ.FROM_L} {\n        margin: 3.9375rem 0 2.625rem;\n    }\n\n    ${MQ.FROM_XL} {\n        margin: 5.25rem 0 3.5rem;\n        padding-left: 1.6875rem;\n        row-gap: 1.75rem;\n    }\n`;\n\nexport const StepIcon = styled(Icon)`\n    color: var(--icon-decorative-coral);\n    margin-bottom: 0.4375rem;\n\n    ${MQ.FROM_XL} {\n        margin-bottom: 0.875rem;\n    }\n`;\n\nexport const StepHeading = styled.h3`\n    ${styleHeadingM}\n    margin-block: 0;\n`;\n\nexport const StepContent = styled.p`\n    ${styleBodyM}\n    margin-block: 0;\n`;\n\nexport const LinkText = styled.div`\n    ${styleLabelM};\n    color: var(${linkColor});\n    margin-right: 0.875rem;\n    transition:\n        color 0.2s ease-in-out,\n        margin-right 0.2s ease-in-out;\n`;\n\nexport const IconArrow = styled(Icon)`\n    color: var(${linkColor});\n    margin-right: 0.875rem;\n    transition:\n        color 0.2s ease-in-out,\n        margin-left 0.2s ease-in-out;\n`;\n\nexport const ReadMore = styled(Link)`\n    border-bottom: none;\n    display: block;\n    transition: color 0.2s ease-in-out;\n\n    &:hover {\n        ${LinkText} {\n            color: var(${hoverColor});\n            margin-right: 0;\n        }\n\n        ${IconArrow} {\n            color: var(${hoverColor});\n            margin-left: 0.875rem;\n        }\n    }\n`;\n\nexport const CircularProcess = styled.div`\n    border: 1px dashed var(${circularColor});\n    border-radius: calc(var(--circular-size) / 2);\n    border-right: none;\n    bottom: 0;\n    left: 0;\n    margin-left: -0.4375rem;\n    position: absolute;\n    top: 0.875rem;\n    width: var(--circular-size);\n\n    ${MQ.FROM_M} {\n        margin-left: calc(var(--circular-size) / -2);\n    }\n\n    ${MQ.FROM_L} {\n        top: 1.3125rem;\n    }\n\n    ${MQ.FROM_XL} {\n        top: 1.75rem;\n    }\n`;\n\nexport const Step = styled.li.attrs<{\n    $hasIcon: boolean;\n    $enableNumbers: boolean;\n    $active: boolean;\n}>(() => ({}))`\n    border-left: 1px solid var(${circularColor});\n    display: flex;\n    flex-direction: column;\n    padding-bottom: 2.625rem;\n    padding-left: 2.625rem;\n    position: relative;\n    row-gap: 0.875rem;\n    transition: border-color 0.2s ease-in-out;\n\n    ${(props) =>\n        !props.$hasIcon &&\n        css`\n            ${StepHeading} {\n                margin-top: 1.3125rem;\n\n                ${MQ.FROM_XL} {\n                    margin-top: 1.75rem;\n                }\n            }\n        `}\n    ${(props) =>\n        props.$active &&\n        css`\n            border-color: var(${indicatorBackgroundActive});\n        `}\n\n    ${MQ.FROM_M} {\n        padding-left: 3.5rem;\n        padding-bottom: 3.5rem;\n    }\n\n    ${MQ.FROM_XL} {\n        padding-left: 4.375rem;\n        padding-bottom: 4.375rem;\n    }\n\n    &::before {\n        ${styleHeadingM};\n        align-items: center;\n        aspect-ratio: 1;\n        background-color: var(${background});\n        border: 1px solid var(${circularColor});\n        border-radius: calc(var(--indicator-size) / 2);\n        color: var(${indicatorColor});\n        counter-increment: item;\n        display: flex;\n        justify-content: center;\n        left: calc(var(--indicator-size) / -2);\n        margin: 0;\n        position: absolute;\n        transition:\n            border-color 0.2s ease-in-out,\n            color 0.2s ease-in-out,\n            background-color 0.2s ease-in-out;\n        top: 4.375rem;\n        width: var(--indicator-size);\n        ${(props) =>\n            props.$enableNumbers\n                ? css`\n                      content: counter(item);\n                  `\n                : css`\n                      content: \"\";\n                  `};\n        ${(props) =>\n            !props.$hasIcon &&\n            css`\n                top: 0.6875rem;\n\n                ${MQ.FROM_XL} {\n                    top: 1.125rem;\n                }\n            `}\n        ${(props) =>\n            props.$active &&\n            css`\n                background-color: var(${indicatorBackgroundActive});\n                border-color: var(${indicatorBackgroundActive});\n                color: var(${indicatorColorActive});\n            `}\n    }\n`;\n","import React, { ReactElement, useState } from \"react\";\nimport { Waypoint } from \"react-waypoint\";\nimport { ThemeProvider } from \"styled-components\";\n\nimport Section from \"components/Section\";\nimport { useBreakpoint } from \"hooks\";\nimport useIsInEditMode from \"hooks/useIsInEditMode\";\nimport { addEditAttributes } from \"utils/episerver\";\n\nimport {\n    Heading,\n    Content,\n    CircularProcess,\n    Introduction,\n    Step,\n    StepsWrapper,\n    Steps,\n    StepIcon,\n    ReadMore,\n    IconArrow,\n    LinkText,\n    StepHeading,\n    StepContent,\n} from \"./Process.styled\";\nimport ProcessProps from \"./ProcessProps\";\n\nconst Process = ({\n    identifier,\n    theme,\n    contentTheme,\n    actionTheme,\n    heading,\n    introduction,\n    anchorName,\n    steps,\n    type = \"circular\",\n    enableNumbers = true,\n    enableIcons = true,\n}: ProcessProps): ReactElement => {\n    const isInEditMode = useIsInEditMode();\n    const [activeIds, setActiveIds] = useState<string[]>([]);\n\n    const breakPoint = useBreakpoint();\n\n    return (\n        <Section theme={theme} alignItems=\"center\" id={anchorName}>\n            <ThemeProvider\n                theme={{\n                    theme: theme,\n                    contentTheme: contentTheme,\n                    actionTheme: actionTheme || contentTheme,\n                    isInEditMode: isInEditMode,\n                }}\n            >\n                <Content key={identifier || `ProcessContent`}>\n                    {(isInEditMode || heading) && (\n                        <Heading\n                            as=\"h2\"\n                            {...addEditAttributes(\"Heading\")}\n                            dangerouslySetInnerHTML={{\n                                __html: heading || \"\",\n                            }}\n                        />\n                    )}\n                    {(isInEditMode || introduction) && (\n                        <Introduction\n                            as=\"div\"\n                            {...addEditAttributes(\"Introduction\")}\n                        >\n                            {introduction}\n                        </Introduction>\n                    )}\n                    <StepsWrapper>\n                        {type === \"circular\" && <CircularProcess />}\n                        <Steps {...addEditAttributes(\"ProcessSteps\")}>\n                            {steps &&\n                                steps.map((step, index) => {\n                                    const hasIcon = enableIcons && !!step.icon;\n                                    const hasReadMore =\n                                        step.link &&\n                                        step.link.url &&\n                                        step.link.linkText;\n\n                                    // Handle the offsets for Waypoint, which defines when it should switch active\n                                    let topOffset: string;\n                                    let bottomOffset: string;\n                                    switch (breakPoint) {\n                                        case \"XL\":\n                                            topOffset = \"112px\";\n                                            bottomOffset = hasIcon\n                                                ? \"70px\"\n                                                : \"18px\";\n                                            break;\n                                        case \"L\":\n                                            topOffset = \"98px\";\n                                            bottomOffset = hasIcon\n                                                ? \"70px\"\n                                                : \"11px\";\n                                            break;\n                                        case \"M\":\n                                            topOffset = \"98px\";\n                                            bottomOffset = hasIcon\n                                                ? \"70px\"\n                                                : \"11px\";\n                                            break;\n                                        default:\n                                            topOffset = \"84px\";\n                                            bottomOffset = hasIcon\n                                                ? \"70px\"\n                                                : \"11px\";\n                                    }\n\n                                    return (\n                                        <Waypoint\n                                            bottomOffset={bottomOffset}\n                                            topOffset={topOffset}\n                                            key={`step-${index}`}\n                                            onEnter={() => {\n                                                setActiveIds(\n                                                    step.identifier\n                                                        ? [\n                                                              ...activeIds,\n                                                              step.identifier,\n                                                          ]\n                                                        : activeIds,\n                                                );\n                                            }}\n                                            onLeave={() => {\n                                                setActiveIds(\n                                                    activeIds.filter(\n                                                        (id) =>\n                                                            id !==\n                                                            step.identifier,\n                                                    ),\n                                                );\n                                            }}\n                                        >\n                                            <Step\n                                                key={`step-${index}`}\n                                                $hasIcon={hasIcon}\n                                                $enableNumbers={enableNumbers}\n                                                $active={\n                                                    // Get the first in array\n                                                    activeIds.find(Boolean) ===\n                                                    step.identifier\n                                                }\n                                            >\n                                                {enableIcons && step.icon && (\n                                                    <StepIcon\n                                                        icon={`${step.icon}56`}\n                                                        aria-hidden=\"true\"\n                                                    />\n                                                )}\n                                                {step.heading && (\n                                                    <StepHeading\n                                                        dangerouslySetInnerHTML={{\n                                                            __html:\n                                                                step.heading ||\n                                                                \"\",\n                                                        }}\n                                                    />\n                                                )}\n                                                {step.content && (\n                                                    <StepContent\n                                                        dangerouslySetInnerHTML={{\n                                                            __html:\n                                                                step.content ||\n                                                                \"\",\n                                                        }}\n                                                    />\n                                                )}\n                                                {hasReadMore && (\n                                                    <ReadMore\n                                                        {...step.link}\n                                                        hoverSpan={true}\n                                                        gtmClickType=\"quote\"\n                                                        {...addEditAttributes(\n                                                            \"Link\",\n                                                        )}\n                                                    >\n                                                        <LinkText>\n                                                            <IconArrow\n                                                                icon={\n                                                                    \"longArrowRight28\"\n                                                                }\n                                                                aria-hidden=\"true\"\n                                                            />\n                                                            {step.link\n                                                                ?.linkText ||\n                                                                \"\"}\n                                                        </LinkText>\n                                                    </ReadMore>\n                                                )}\n                                            </Step>\n                                        </Waypoint>\n                                    );\n                                })}\n                        </Steps>\n                    </StepsWrapper>\n                </Content>\n            </ThemeProvider>\n        </Section>\n    );\n};\n\nexport default React.memo(Process);\n"],"names":["background","theme","lightgray","blue","cyan","circularColor","indicatorBackgroundActive","indicatorColorActive","indicatorColor","linkColor","hoverColor","black","white","Content","styled","GridContainer","withConfig","componentId","columnGap","MQ","FROM_M","FROM_L","Heading","h2","styleHeadingXL","FROM_XL","Introduction","BodyL","StepsWrapper","div","Steps","ol","StepIcon","Icon","StepHeading","h3","styleHeadingM","StepContent","p","styleBodyM","LinkText","styleLabelM","IconArrow","ReadMore","Link","CircularProcess","Step","li","attrs","props","$hasIcon","css","$active","$enableNumbers","Process","identifier","contentTheme","actionTheme","heading","introduction","anchorName","steps","type","enableNumbers","enableIcons","isInEditMode","useIsInEditMode","activeIds","setActiveIds","useState","breakPoint","useBreakpoint","_jsx","Section","alignItems","id","children","ThemeProvider","_jsxs","as","addEditAttributes","dangerouslySetInnerHTML","__html","map","step","index","_step$link","hasIcon","icon","hasReadMore","link","url","linkText","topOffset","bottomOffset","Waypoint","onEnter","onLeave","filter","find","Boolean","content","hoverSpan","gtmClickType","React"],"sourceRoot":""}