{"version":3,"file":"3060-fe5ecb1cfbf365464757.js","mappings":"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","sources":["webpack://royal-college-radiologists/./src/helpers/scrollbars.ts","webpack://royal-college-radiologists/./src/stories/Components/UmbracoForm/FormControls/DropDownList/DropDownList.tsx","webpack://royal-college-radiologists/./src/stories/Components/UmbracoForm/data.ts","webpack://royal-college-radiologists/./src/stories/Widgets/InnerPageNavigation/InnerPageNavigation.styles.ts","webpack://royal-college-radiologists/./src/stories/Widgets/InnerPageNavigation/InnerPageNavigation.tsx"],"sourcesContent":["import { css } from 'styled-components';\r\nimport brand from './brand';\r\nexport default css `\r\n  &::-webkit-scrollbar-track {\r\n    background-color: ${brand.grey.grey40};\r\n  }\r\n\r\n  &::-webkit-scrollbar {\r\n    background-color: ${brand.grey.grey40};\r\n    height: 6px;\r\n    width: 6px;\r\n  }\r\n\r\n  &::-webkit-scrollbar-thumb {\r\n    background-color: ${brand.grey.grey90};\r\n    border-radius: 0;\r\n    cursor: pointer;\r\n  }\r\n`;\r\n","import SvgChevron from '@img/icons/chevron.svg';\r\nimport React from 'react';\r\nimport S from '../../UmbracoForm.styles';\r\nimport { SystemIcon, getSvgFromSystem } from '@helpers/systemIcons';\r\nconst DropDownList = React.forwardRef(({ field, error, hidePlaceholder, ...otherProps }, ref) => {\r\n    const [showToolTip, setShowToolTip] = React.useState(false);\r\n    return (React.createElement(S.Field, { \"data-error\": !!error },\r\n        React.createElement(S.Label, { htmlFor: field.alias },\r\n            field.caption,\r\n            field.required && React.createElement(React.Fragment, null, \" *\"),\r\n            field.toolTip && (React.createElement(S.ToolTipContainer, null,\r\n                React.createElement(S.ToolTip, { type: 'button', onClick: () => setShowToolTip(!showToolTip) }, \"?\"),\r\n                React.createElement(S.ToolTipInner, { \"data-show-tooltip\": showToolTip },\r\n                    field.toolTip,\r\n                    React.createElement(S.CloseToolTip, { type: 'button', onClick: () => setShowToolTip(false) }, getSvgFromSystem(SystemIcon.Cross)))))),\r\n        React.createElement(S.SelectWrapper, null,\r\n            React.createElement(S.Select, { ref: ref, id: field.alias, placeholder: field.placeholder, required: field.required, ...otherProps },\r\n                !hidePlaceholder && React.createElement(\"option\", { value: \"\" }, field.placeholder),\r\n                field.values?.map((value, index) => (React.createElement(\"option\", { key: `option-${index}`, value: value.value }, value.caption)))),\r\n            React.createElement(S.Arrow, null,\r\n                React.createElement(SvgChevron, null))),\r\n        error && React.createElement(S.Error, null, error.message)));\r\n});\r\nDropDownList.displayName = 'DropDownList';\r\nexport default DropDownList;\r\n","export const emptyFieldProps = {\r\n    id: ``,\r\n    alias: '',\r\n    actionType: '',\r\n    type: '',\r\n    caption: '',\r\n    logicType: '',\r\n    placeholder: '',\r\n    toolTip: '',\r\n    regex: '',\r\n    required: false,\r\n    requiredErrorMessage: '',\r\n    rules: [],\r\n    invalidErrorMessage: '',\r\n    values: [],\r\n    fieldData1: '',\r\n    fieldData2: '',\r\n};\r\n","import { transition } from '@helpers/animate';\r\nimport brand from '@helpers/brand';\r\nimport { fluid } from '@helpers/fluid';\r\nimport fonts from '@helpers/fonts';\r\nimport { baseGrid, siteWide } from '@helpers/grid';\r\nimport { Layers } from '@helpers/layers';\r\nimport { Device, from } from '@helpers/media';\r\nimport scrollbars from '@helpers/scrollbars';\r\nimport { paragraphRegular } from '@helpers/typography';\r\nimport UmbracoFormStyles from '@stories/Components/UmbracoForm/UmbracoForm.styles';\r\nimport styled from 'styled-components';\r\nconst Container = styled.section `\r\n  --bgColour: ${brand.secondary.red};\r\n  --fgColour: ${brand.primary.purple};\r\n\r\n  position: sticky;\r\n  top: 0;\r\n  width: 100%;\r\n  z-index: ${Layers.Header - 1};\r\n  background-color: var(--background);\r\n\r\n  &[data-variant='dark'] {\r\n    --background: ${brand.primary.purple};\r\n  }\r\n\r\n  &[data-variant='light'] {\r\n    --background: ${brand.primary.offWhite};\r\n  }\r\n\r\n  .equally-ai___high-saturation & {\r\n    filter: saturate(200%);\r\n  }\r\n\r\n  .equally-ai___reverse-contrast & {\r\n    filter: invert(100%);\r\n  }\r\n\r\n  .equally-ai___monochrome-contrast & {\r\n    filter: grayscale(100%);\r\n  }\r\n\r\n  .equally-ai___reverse-contrast.equally-ai___monochrome-contrast & {\r\n    filter: grayscale(100%) invert(100%);\r\n  }\r\n`;\r\nconst Inner = styled.div `\r\n  @media ${from(Device.Tablet)} {\r\n    ${siteWide};\r\n    ${baseGrid};\r\n  }\r\n`;\r\nconst Nav = styled.nav `\r\n  ${scrollbars};\r\n\r\n  display: flex;\r\n  flex-wrap: nowrap;\r\n  gap: ${fluid(22, 50)};\r\n  background-color: var(--bgColour);\r\n  padding: 0 ${fluid(20, 30)};\r\n\r\n  @media ${from(Device.Tablet)} {\r\n    overflow: auto;\r\n    grid-column: 1 / span 12;\r\n  }\r\n\r\n  @media ${from(Device.DesktopLarge)} {\r\n    grid-column: 2 / span 10;\r\n  }\r\n`;\r\nconst Link = styled.a `\r\n  display: none;\r\n\r\n  @media ${from(Device.Tablet)} {\r\n    ${paragraphRegular};\r\n\r\n    position: relative;\r\n    display: inline-flex;\r\n    color: var(--fgColour);\r\n    margin: 0;\r\n    place-content: center;\r\n    place-items: center;\r\n    text-decoration: none;\r\n    white-space: nowrap;\r\n    height: ${fluid(45, 71)};\r\n\r\n    &::after {\r\n      ${transition('background-size')};\r\n\r\n      content: '';\r\n      display: block;\r\n      position: absolute;\r\n      bottom: 0;\r\n      left: 0;\r\n      height: 6px;\r\n      width: 100%;\r\n      background: transparent;\r\n      background-image: linear-gradient(to right, var(--fgColour), var(--fgColour));\r\n      background-repeat: no-repeat;\r\n      background-size: 0% 100%;\r\n    }\r\n\r\n    &[data-active='true'],\r\n    &.focus-ring,\r\n    &:hover {\r\n      &::after {\r\n        background-size: 100% 100%;\r\n      }\r\n    }\r\n  }\r\n`;\r\nconst DropdownWrapper = styled.div `\r\n  width: 100%;\r\n\r\n  ${UmbracoFormStyles.Field} {\r\n    flex-direction: row;\r\n    align-items: center;\r\n    gap: ${fluid(32, 42, Device.Mobile, Device.Tablet)};\r\n    width: 100%;\r\n    margin: 10px 0;\r\n\r\n    @media ${from(Device.Tablet)} {\r\n      display: none;\r\n    }\r\n  }\r\n\r\n  ${UmbracoFormStyles.Label} {\r\n    ${fonts.graphikCompact.semibold};\r\n\r\n    font-size: 20px;\r\n    white-space: nowrap;\r\n    text-transform: none;\r\n    color: var(--fgColour);\r\n  }\r\n\r\n  ${UmbracoFormStyles.SelectWrapper} {\r\n    color: var(--fgColour);\r\n  }\r\n\r\n  ${UmbracoFormStyles.Select} {\r\n    background-color: transparent;\r\n    border-color: var(--fgColour);\r\n    color: currentColor;\r\n\r\n    option {\r\n      color: var(--fgColour);\r\n    }\r\n  }\r\n`;\r\nconst InnerPageNavigationStyles = {\r\n    Container,\r\n    DropdownWrapper,\r\n    Inner,\r\n    Link,\r\n    Nav,\r\n};\r\nexport default InnerPageNavigationStyles;\r\n","import { scrollTo } from '@helpers/animate';\r\nimport { emptyFieldProps } from '@stories/Components/UmbracoForm/data';\r\nimport DropDownList from '@stories/Components/UmbracoForm/FormControls/DropDownList/DropDownList';\r\nimport * as React from 'react';\r\nimport S from './InnerPageNavigation.styles';\r\nconst InnerPageNavigation = (props) => {\r\n    const ref = React.useRef(null);\r\n    const [activeId, setActiveId] = React.useState('');\r\n    const [scrollId, setScrollId] = React.useState('');\r\n    React.useEffect(() => {\r\n        if (scrollId === '') {\r\n            const observer = new IntersectionObserver((entries) => {\r\n                const lastEntry = [...entries].reverse().find((entry) => entry.isIntersecting);\r\n                if (lastEntry) {\r\n                    setActiveId(lastEntry.target.id);\r\n                }\r\n            }, { rootMargin: '-65px 0px -66% 0px' });\r\n            props.sections.forEach((section) => {\r\n                const element = document.getElementById(section.id);\r\n                if (element) {\r\n                    observer.observe(element);\r\n                }\r\n            });\r\n            return () => {\r\n                observer.disconnect();\r\n            };\r\n        }\r\n        else {\r\n            setActiveId(scrollId);\r\n            setTimeout(() => {\r\n                setScrollId('');\r\n            }, 500);\r\n        }\r\n    }, [scrollId]);\r\n    return (React.createElement(S.Container, { \"data-variant\": props.variant, ref: ref },\r\n        React.createElement(S.Inner, null,\r\n            React.createElement(S.Nav, { \"aria-label\": \"In-page navigation\" },\r\n                props.sections.map((section) => (React.createElement(S.Link, { key: section.id, href: `#${section.id}`, \"data-active\": activeId === section.id, onClick: (event) => {\r\n                        event.preventDefault();\r\n                        scrollToSection(section.id);\r\n                    } }, section.title))),\r\n                React.createElement(S.DropdownWrapper, null,\r\n                    React.createElement(DropDownList, { field: {\r\n                            ...emptyFieldProps,\r\n                            caption: 'Go to:',\r\n                            values: [\r\n                                ...props.sections.map((section) => ({\r\n                                    caption: section.title,\r\n                                    value: section.id,\r\n                                })),\r\n                            ],\r\n                        }, onChange: (e) => scrollToSection(e.target.value), value: activeId, hidePlaceholder: true }))))));\r\n    function scrollToSection(id) {\r\n        const targetEl = document.getElementById(id);\r\n        if (!targetEl) {\r\n            return;\r\n        }\r\n        setScrollId(targetEl.id);\r\n        /* Compensate for the sticky header height */\r\n        const y = targetEl.getBoundingClientRect().top -\r\n            (ref.current?.getBoundingClientRect().height ?? 60) +\r\n            document.documentElement.scrollTop;\r\n        scrollTo(y);\r\n    }\r\n};\r\nexport default InnerPageNavigation;\r\n"],"names":["css","brand","grey","grey40","grey90","DropDownList","React","_ref","ref","_field$values","field","error","hidePlaceholder","otherProps","showToolTip","setShowToolTip","S","Field","Label","htmlFor","alias","caption","required","toolTip","ToolTipContainer","ToolTip","type","onClick","ToolTipInner","CloseToolTip","getSvgFromSystem","SystemIcon","Cross","SelectWrapper","Select","id","placeholder","value","values","map","index","key","Arrow","SvgChevron","Error","message","displayName","emptyFieldProps","actionType","logicType","regex","requiredErrorMessage","rules","invalidErrorMessage","fieldData1","fieldData2","Container","styled","section","withConfig","componentId","secondary","red","primary","purple","Layers","Header","offWhite","Inner","div","from","Device","Tablet","siteWide","baseGrid","Nav","nav","scrollbars","fluid","DesktopLarge","Link","a","paragraphRegular","transition","DropdownWrapper","UmbracoFormStyles","Mobile","fonts","graphikCompact","semibold","props","activeId","setActiveId","scrollId","setScrollId","observer","IntersectionObserver","entries","lastEntry","reverse","find","entry","isIntersecting","target","rootMargin","sections","forEach","element","document","getElementById","observe","disconnect","setTimeout","variant","href","event","preventDefault","scrollToSection","title","onChange","e","_ref$current$getBound","_ref$current","targetEl","y","getBoundingClientRect","top","current","height","documentElement","scrollTop","scrollTo"],"sourceRoot":""}