{"version":3,"file":"static/js/FilterBar.bf944991.js","mappings":"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","sources":["components/Filter/FilterLoader.tsx","components/FilterBar/FilterBar.styled.ts","components/FilterBar/FilterBar.tsx"],"sourcesContent":["import loadable, { DefaultComponent } from \"@loadable/component\";\nimport React, { ReactElement } from \"react\";\n\nimport FilterProps from \"./FilterProps\";\n\nconst Filter = loadable(\n    (): Promise<DefaultComponent<FilterProps>> =>\n        import(/* webpackChunkName: \"Filter\" */ \"./Filter\"),\n);\nconst FilterLoader = (props: FilterProps): ReactElement => (\n    <Filter {...props} />\n);\nexport default FilterLoader;\n","import { styled, css } from \"styled-components\";\nimport theme from \"styled-theming\";\n\nimport { default as DefaultIcon } from \"components/Icon/\";\nimport { default as NavLink } from \"components/Link\";\nimport { Container as GridContainer } from \"style/components/Page\";\nimport { styleBodyM } from \"style/components/Typography\";\nimport { GUTTER } from \"style/grid\";\nimport { MQ } from \"style/mediaQueries\";\n\nexport const Section = styled.div.attrs<{\n    $headerVisible: boolean;\n}>(() => ({}))`\n    align-items: center;\n    display: flex;\n    flex-direction: column;\n    width: 100%;\n    ${theme(\"variant\", {\n        default: css`\n            background: var(--background-default);\n            border-bottom: 1px solid var(--line-on-neutral-default);\n            border-top: 1px solid var(--line-on-neutral-default);\n            position: sticky;\n            top: 0;\n            z-index: 100;\n        `,\n    })};\n`;\n\nexport const Container = styled(GridContainer)`\n    ${theme(\"variant\", {\n        default: css`\n            padding: 0 0 0 ${GUTTER.SM};\n            position: relative;\n\n            &::after {\n                background: var(--gradient-background-default-opacity);\n                content: \"\";\n                display: block;\n                pointer-events: none;\n                position: absolute;\n                right: 0;\n                top: 0.875rem;\n                width: 4.375rem;\n                height: 1.75rem;\n            }\n\n            ${MQ.FROM_M} {\n                padding: 0.875rem ${GUTTER.MD};\n\n                &::after {\n                    all: unset;\n                }\n            }\n\n            ${MQ.FROM_XL} {\n                padding: 1.3125rem ${GUTTER.XL};\n            }\n        `,\n        pills: css`\n            padding: 0.875rem 0 0;\n        `,\n    })};\n`;\n\nexport const Links = styled.ul`\n    display: flex;\n    margin: 0;\n    padding: 0.875rem 3.5rem 0.875rem 0;\n    row-gap: 0.4375rem;\n    width: 100%;\n    ${theme(\"variant\", {\n        default: css`\n            column-gap: 2.1875rem;\n            flex-flow: row nowrap;\n            overflow-x: auto;\n\n            ${MQ.FROM_M} {\n                flex-wrap: wrap;\n                overflow: visible;\n            }\n        `,\n        pills: css`\n            column-gap: 0.875rem;\n            flex-flow: row wrap;\n        `,\n    })};\n\n    ${MQ.FROM_M} {\n        padding: 0;\n        row-gap: 0.875rem;\n    }\n`;\n\nexport const Watermark = styled(DefaultIcon)`\n    margin-right: 0.4375rem;\n`;\n\nexport const LinkWrapper = styled.div`\n    color: var(--text-on-neutral-primary);\n    list-style: none;\n    white-space: nowrap;\n`;\n\nexport const Slash = styled.span`\n    ${styleBodyM}\n    color: var(--text-on-neutral-secondary);\n`;\n\nexport const Link = styled(NavLink).attrs<{\n    $selected?: boolean;\n    $hasActiveChildren?: boolean;\n}>(() => ({}))`\n    ${styleBodyM}\n    border-bottom: none;\n    color: var(--text-on-neutral-primary);\n    transition: color 0.2s ease-in-out;\n    display: block;\n\n    span,\n    svg {\n        color: currentcolor;\n        transition: none;\n    }\n\n    &:hover {\n        color: var(--text-on-neutral-link);\n    }\n\n    ${(props) =>\n        props.$hasActiveChildren &&\n        css`\n            color: var(--text-on-neutral-secondary);\n        `}\n\n    ${(props) =>\n        props.$selected &&\n        css`\n            span {\n                border-bottom: 1px solid currentcolor;\n            }\n        `}\n`;\n","import React, { ReactElement, useCallback } from \"react\";\nimport { ThemeProvider } from \"styled-components\";\n\nimport Filter from \"components/Filter\";\nimport useHeader from \"hooks/useHeader\";\n\nimport {\n    Links,\n    LinkWrapper,\n    Link,\n    Section,\n    Container,\n    Watermark,\n    Slash,\n} from \"./FilterBar.styled\";\nimport FilterBarProps from \"./FilterBarProps\";\n\nconst FilterBar = ({\n    identifier,\n    items,\n    className,\n    variant = \"default\",\n    gtmClickType,\n    noScroll = false,\n}: FilterBarProps): ReactElement => {\n    const headerState = useHeader();\n\n    const getActiveChildren = useCallback(\n        (id: number) =>\n            items?.filter((item) => item.parentId === id && item.selected),\n        [items],\n    );\n\n    return (\n        <ThemeProvider theme={{ variant: variant }}>\n            <Section className={className} $headerVisible={headerState.visible}>\n                <Container\n                    role=\"navigation\"\n                    aria-label=\"FilterBar\"\n                    key={identifier || `FilterBarContent`}\n                >\n                    <Links as=\"ol\">\n                        {items\n                            ?.filter((cat) => !cat.parentId) // Only show parents on first level and handle children inside the loop\n                            ?.map((item, index) => {\n                                const children = item.id\n                                    ? getActiveChildren(Number(item.id))\n                                    : undefined;\n                                const hasActiveChildren = Boolean(\n                                    children && children.length > 0,\n                                );\n                                return (\n                                    item?.url && (\n                                        <LinkWrapper\n                                            as=\"li\"\n                                            key={`item-${index}`}\n                                        >\n                                            {variant == \"default\" ? (\n                                                <div>\n                                                    <Link\n                                                        to={item.url}\n                                                        title={item.displayName}\n                                                        aria-current={\n                                                            item.selected\n                                                                ? \"page\"\n                                                                : \"\"\n                                                        }\n                                                        gtmClickType={\n                                                            gtmClickType\n                                                        }\n                                                        noScroll={noScroll}\n                                                        $selected={\n                                                            item.selected\n                                                        }\n                                                        $hasActiveChildren={\n                                                            hasActiveChildren\n                                                        }\n                                                    >\n                                                        {item.icon && (\n                                                            <Watermark\n                                                                icon={`${item?.icon}28`}\n                                                            />\n                                                        )}\n                                                        <span>\n                                                            {item.displayName}\n                                                        </span>\n                                                    </Link>\n                                                    {hasActiveChildren && (\n                                                        <>\n                                                            <Slash>/</Slash>\n                                                            {children &&\n                                                                children.map(\n                                                                    (\n                                                                        child,\n                                                                        index,\n                                                                    ) => (\n                                                                        <Link\n                                                                            key={`catNavChild${index}`}\n                                                                            to={\n                                                                                child.url\n                                                                            }\n                                                                            title={\n                                                                                child.displayName\n                                                                            }\n                                                                            aria-current={\n                                                                                child.selected\n                                                                                    ? \"page\"\n                                                                                    : \"\"\n                                                                            }\n                                                                            gtmClickType={\n                                                                                gtmClickType\n                                                                            }\n                                                                            noScroll={\n                                                                                noScroll\n                                                                            }\n                                                                            $selected={\n                                                                                child.selected\n                                                                            }\n                                                                        >\n                                                                            <span>\n                                                                                {\n                                                                                    child.displayName\n                                                                                }\n                                                                            </span>\n                                                                        </Link>\n                                                                    ),\n                                                                )}\n                                                        </>\n                                                    )}\n                                                </div>\n                                            ) : (\n                                                <Filter\n                                                    to={item.url}\n                                                    title={item.displayName}\n                                                    selected={item.selected}\n                                                    gtmClickType={gtmClickType}\n                                                    noScroll={noScroll}\n                                                >\n                                                    <span>\n                                                        {item.displayName}\n                                                    </span>\n                                                </Filter>\n                                            )}\n                                        </LinkWrapper>\n                                    )\n                                );\n                            })}\n                    </Links>\n                </Container>\n            </Section>\n        </ThemeProvider>\n    );\n};\n\nexport default React.memo(FilterBar);\n"],"names":["Filter","loadable","resolved","chunkName","isReady","props","key","resolve","__webpack_modules__","importAsync","requireAsync","then","requireSync","id","__webpack_require__","FilterLoader","_jsx","Section","styled","div","attrs","withConfig","componentId","theme","default","css","Container","GridContainer","GUTTER","SM","MQ","FROM_M","MD","FROM_XL","XL","pills","Links","ul","Watermark","DefaultIcon","LinkWrapper","Slash","span","styleBodyM","Link","NavLink","$hasActiveChildren","$selected","FilterBar","identifier","items","className","variant","gtmClickType","noScroll","_items$filter","headerState","useHeader","getActiveChildren","useCallback","filter","item","parentId","selected","ThemeProvider","children","$headerVisible","visible","role","as","cat","map","index","Number","undefined","hasActiveChildren","Boolean","length","url","_jsxs","to","title","displayName","icon","_Fragment","child","React"],"sourceRoot":""}