{"version":3,"file":"static/js/BlockQuoteSection.ea7810d2.js","mappings":"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","sources":["components/BlockQuoteSection/BlockQuoteSection.styled.ts","components/BlockQuoteSection/BlockQuoteSection.tsx","components/Image/ImageLoader.tsx"],"sourcesContent":["import { styled, css } from \"styled-components\";\nimport theme from \"styled-theming\";\n\nimport BlockQuote from \"components/BlockQuote\";\nimport Section from \"components/Section\";\nimport { Container as GridContainer } from \"style/components/Page\";\nimport { columnGap } from \"style/grid\";\nimport { MQ } from \"style/mediaQueries\";\n\nconst backgroundColor = theme(\"theme\", {\n    undefined: \"--color-transparent\",\n    default: \"--background-default\",\n    lightgray: \"--background-default\",\n    blue: \"--block-blue-default\",\n    cyan: \"--block-cyan-default\",\n    coral: \"--block-coral-default\",\n});\n\nexport const StyledSection = styled(Section)`\n    --image-width: calc(50vw - (0.5 * var(--grid-column-gutter)));\n\n    align-items: center;\n    position: relative;\n\n    ${MQ.FROM_L} {\n        --image-width: calc(\n            50vw - var(--grid-column-size) - (0.5 * 17px) -\n                (1.5 * var(--grid-column-gutter))\n        );\n    }\n`;\n\nexport const Container = styled(GridContainer)`\n    ${columnGap}\n    align-items: center;\n    padding-block: 0;\n\n    ${theme(\"hasImage\", {\n        true: css`\n            align-items: center;\n            display: grid;\n            grid-template-columns: repeat(4, [col-start] 1fr);\n            grid-template-rows:\n                calc(0.7 * var(--image-width))\n                1fr;\n\n            &::after {\n                ${MQ.FROM_M} {\n                    display: block;\n                    grid-row: 2 / span 2;\n                    z-index: 2;\n                    background-color: var(${backgroundColor});\n                    grid-column: col-start 6 / span 3;\n                    content: \"\";\n                    width: calc(\n                        2 *\n                            (\n                                var(--grid-column-size) +\n                                    var(--grid-column-gutter)\n                            )\n                    );\n                    height: 100%;\n                }\n\n                ${MQ.FROM_L} {\n                    grid-column: col-start 7 / span 3;\n                }\n            }\n        `,\n        false: css`\n            display: flex;\n            padding-block: 2.1875rem;\n        `,\n    })}\n\n    ${MQ.FROM_M} {\n        min-height: 80vh;\n\n        ${theme(\"hasImage\", {\n            true: css`\n                grid-template-columns: repeat(12, [col-start] 1fr);\n                grid-template-rows:\n                    minmax(4.375rem, auto)\n                    min-content\n                    minmax(4.375rem, auto);\n                padding-block: 0;\n            `,\n            false: css`\n                padding-block: 3.5rem;\n            `,\n        })}\n    }\n\n    ${MQ.FROM_L} {\n        min-height: 100vh;\n        ${theme(\"hasImage\", {\n            true: css`\n                grid-template-rows:\n                    minmax(8.75rem, auto)\n                    min-content\n                    minmax(8.75rem, auto);\n            `,\n        })}\n    }\n\n    ${MQ.FROM_XL} {\n        ${theme(\"hasImage\", {\n            true: css`\n                grid-template-rows:\n                    minmax(6.5625rem, auto)\n                    min-content\n                    minmax(6.5625rem, auto);\n            `,\n            false: css`\n                padding-bottom: 4.375rem;\n                padding-top: 4.375rem;\n            `,\n        })}\n    }\n\n    ${theme(\"isInEditMode\", {\n        true: css`\n            min-height: auto;\n\n            ${MQ.FROM_L} {\n                min-height: auto;\n            }\n        `,\n    })}\n\n    figure {\n        z-index: 1;\n    }\n`;\n\nexport const BlockQuoteWrapper = styled.div`\n    background-color: var(${backgroundColor});\n    z-index: 3;\n\n    ${theme(\"hasImage\", {\n        true: css`\n            grid-column: col-start 1 / span 4;\n            grid-row: 2;\n            padding-bottom: 3.5rem;\n            padding-right: 0.875rem;\n            padding-top: 0.875rem;\n\n            ${MQ.FROM_M} {\n                grid-column: col-start 1 / span 7;\n                padding-block: 2.1875rem;\n                padding-right: 0;\n            }\n\n            ${MQ.FROM_L} {\n                grid-column: col-start 1 / span 8;\n            }\n            ${MQ.FROM_XL} {\n                padding-block: 3.5rem;\n            }\n        `,\n    })}\n`;\n\nexport const StyledBlockQuote = styled(BlockQuote)`\n    z-index: 2;\n`;\n\nexport const ImageWrapper = styled.div`\n    aspect-ratio: 1;\n    display: block;\n    position: absolute;\n    right: 0;\n    top: 0;\n    width: var(--image-width);\n    z-index: 2;\n\n    ${MQ.FROM_M} {\n        aspect-ratio: unset;\n        bottom: 0;\n        grid-row: 1 / span 3;\n    }\n`;\n","import React, { ReactElement } from \"react\";\nimport { ThemeProvider } from \"styled-components\";\n\nimport Image from \"components/Image\";\nimport useIsInEditMode from \"hooks/useIsInEditMode\";\nimport { BREAKPOINT_NUMBER } from \"style/breakpoints\";\nimport generateSrcSet from \"style/generateSrcSet\";\n\nimport {\n    BlockQuoteWrapper,\n    Container,\n    ImageWrapper,\n    StyledBlockQuote,\n    StyledSection,\n} from \"./BlockQuoteSection.styled\";\nimport BlockQuoteSectionProps from \"./BlockQuoteSectionProps\";\n\nconst BlockQuoteSection = ({\n    identifier,\n    quoteText,\n    className,\n    theme = \"lightgray\",\n    contentTheme = \"black\",\n    image,\n    author,\n    anchorName,\n    link,\n}: BlockQuoteSectionProps): ReactElement => {\n    const isInEditMode = useIsInEditMode();\n\n    // Fix for old QuoteSectionWithImageBlock themes\n    if (theme === \"lightgray\" && contentTheme === \"white\") {\n        theme = \"lightgray\";\n        contentTheme = \"black\";\n    }\n\n    // Override some image specific parameters\n    if (image && image.url) {\n        image.srcSet = generateSrcSet({\n            image: image.url,\n            focalPoint: image.focalPoint,\n            maxWidth: image.uploadedWidth,\n            maxHeight: image.uploadedHeight,\n            format: \"jpg\",\n            content: [\n                {\n                    width: 2560,\n                    breakpoint: BREAKPOINT_NUMBER.XXXL,\n                },\n                {\n                    width: 1920,\n                    breakpoint: BREAKPOINT_NUMBER.XXL,\n                },\n                {\n                    width: 1680,\n                    breakpoint: BREAKPOINT_NUMBER.XL,\n                },\n                {\n                    width: 1365,\n                    breakpoint: BREAKPOINT_NUMBER.L,\n                },\n                {\n                    width: 992,\n                    breakpoint: BREAKPOINT_NUMBER.M,\n                },\n                {\n                    width: 768,\n                    height: 768,\n                },\n            ],\n        });\n    }\n\n    return (\n        <StyledSection colorTheme={theme} id={anchorName}>\n            <ThemeProvider\n                theme={{\n                    theme: theme,\n                    contentTheme: contentTheme,\n                    hasImage: !!(image && image.url),\n                    isInEditMode: isInEditMode,\n                }}\n            >\n                <Container key={identifier || `QuoteSectionContent`}>\n                    {image?.url && (\n                        <ImageWrapper>\n                            <Image {...image} caption=\"\" cover={true} />\n                        </ImageWrapper>\n                    )}\n                    <BlockQuoteWrapper>\n                        <StyledBlockQuote\n                            className={className}\n                            quoteText={quoteText}\n                            author={author}\n                            theme={theme}\n                            link={link}\n                            size=\"large\"\n                        />\n                    </BlockQuoteWrapper>\n                </Container>\n            </ThemeProvider>\n        </StyledSection>\n    );\n};\n\nexport default React.memo(BlockQuoteSection);\n","import loadable, { DefaultComponent } from \"@loadable/component\";\nimport React, { ReactElement } from \"react\";\n\nimport ImageProps from \"./ImageProps\";\n\nconst Image = loadable(\n    (): Promise<DefaultComponent<ImageProps>> =>\n        import(/* webpackChunkName: \"Image\" */ \"./Image\"),\n);\nconst ImageLoader = (props: ImageProps): ReactElement => <Image {...props} />;\nexport default ImageLoader;\n"],"names":["backgroundColor","theme","undefined","default","lightgray","blue","cyan","coral","StyledSection","styled","Section","withConfig","componentId","MQ","FROM_L","Container","GridContainer","columnGap","true","css","FROM_M","false","FROM_XL","BlockQuoteWrapper","div","StyledBlockQuote","BlockQuote","ImageWrapper","BlockQuoteSection","identifier","quoteText","className","contentTheme","image","author","anchorName","link","isInEditMode","useIsInEditMode","url","srcSet","generateSrcSet","focalPoint","maxWidth","uploadedWidth","maxHeight","uploadedHeight","format","content","width","breakpoint","BREAKPOINT_NUMBER","XXXL","XXL","XL","L","M","height","_jsx","colorTheme","id","children","ThemeProvider","hasImage","_jsxs","Image","caption","cover","size","React","loadable","resolved","chunkName","isReady","props","key","resolve","__webpack_modules__","importAsync","requireAsync","then","requireSync","__webpack_require__","ImageLoader"],"sourceRoot":""}