{"version":3,"sources":["webpack:///./src/stories/Widgets/SkipToContent/SkipToContent.styles.ts","webpack:///./src/stories/Widgets/SkipToContent/SkipToContent.tsx","webpack:///./src/helpers/cssVar.ts","webpack:///./src/helpers/brand.ts","webpack:///./src/helpers/grey.ts"],"names":["Link","styled","a","themes","cssVar","SkipToContent","cta","React","createElement","S","href","url","accessibleText","text","name","setCssVar","value","brand","black","blueGrey","gold","grey","reduce","previous","current","hsl","magenta","purple","white","validation","invalid","valid","lightTheme","css","dark","light","pattern"],"mappings":"gIAsBe,OACXA,K,KApBSC,EAAOC,EAAV,+EAAGD,CAAH,uPACNE,IAAM,KAMMC,YAAO,WACZA,YAAO,aCNHC,UAHO,EAAGC,SACbC,IAAMC,cAAcC,EAAET,KAAM,CAAEU,KAAMJ,EAAIK,IAAK,aAAcL,EAAIM,gBAAkBN,EAAIO,O,+BCHjG,oEAUA,SAAST,EAAOU,GACZ,MAAQ,SAAQA,KAEpB,SAASC,EAAUD,EAAME,GACrB,MAAQ,KAAIF,MAASE,M,2FCXzB,MAAMC,EAAQ,CACVC,MAAO,UACPC,SAAU,UACVC,KAAM,UACNC,KCNoB,CAAC,GAAI,GAAI,GAAI,GAAI,IACPC,OAAO,CAACC,EAAUC,KAAX,UAClCD,EACH,CAAE,OAAMC,IAEER,EAFeQ,EAGlBC,YAAI,EAAG,EAAGT,EAAQ,OAD7B,IAAcA,GADV,IDGAU,QAAS,UACTC,OAAQ,UACRC,MAAO,OACPC,WAAY,CACRC,QAAS,UACTC,MAAO,YAGFC,EAAaC,YAAH,yBACnBlB,YAAU,UAAWE,EAAMC,OAC3BH,YAAU,UAAWE,EAAMW,OAC3Bb,YAAU,aAAcE,EAAMS,SAC9BX,YAAU,cAAeE,EAAMS,SAC/BX,YAAU,iBAAkBE,EAAMU,SA0BzBxB,EAAS,CAClB+B,KAzBqBD,YAAH,qBAClBlB,YAAU,UAAWE,EAAMW,OAC3Bb,YAAU,UAAWE,EAAMC,OAC3BH,YAAU,cAAeE,EAAMS,SAC/BX,YAAU,iBAAkBE,EAAMU,SAsBlCQ,MAAOH,EACPN,QArBwBO,YAAH,qBACrBlB,YAAU,UAAWE,EAAMW,OAC3Bb,YAAU,UAAWE,EAAMS,SAC3BX,YAAU,cAAeE,EAAMS,SAC/BX,YAAU,iBAAkBE,EAAMU,SAkBlCS,QAhBwBH,YAAH,qBACrBlB,YAAU,UAAWE,EAAMC,OAC3BH,YAAU,UAAWE,EAAMW,OAC3Bb,YAAU,cAAeE,EAAMS,SAC/BX,YAAU,iBAAkBE,EAAMU,SAalCA,OAXuBM,YAAH,qBACpBlB,YAAU,UAAWE,EAAMW,OAC3Bb,YAAU,UAAWE,EAAMU,QAC3BZ,YAAU,cAAeE,EAAMS,SAC/BX,YAAU,iBAAkBE,EAAMU,UASvBV","file":"57-4ec4d273d60d06b52ac8.js","sourcesContent":["import { themes } from '@helpers/brand';\r\nimport { cssVar } from '@helpers/cssVar';\r\nimport styled from 'styled-components';\r\nconst Link = styled.a `\r\n  ${themes['dark']};\r\n\r\n  position: fixed;\r\n  top: 0;\r\n  left: 50%;\r\n  display: block;\r\n  background: ${cssVar('bgColor')};\r\n  color: ${cssVar('fgColor')};\r\n  height: 30px;\r\n  padding: 8px;\r\n  transform: translateX(-50%) translateY(-100%);\r\n  transition: transform 0.15s ease-out;\r\n  z-index: 2000;\r\n\r\n  &:focus {\r\n    transform: translateX(-50%) translateY(0%);\r\n  }\r\n`;\r\nexport default {\r\n    Link,\r\n};\r\n","import React from 'react';\r\nimport S from './SkipToContent.styles';\r\nconst SkipToContent = ({ cta }) => {\r\n    return (React.createElement(S.Link, { href: cta.url, \"aria-label\": cta.accessibleText }, cta.text));\r\n};\r\nexport default SkipToContent;\r\n","const variables = [\r\n    'fgColor',\r\n    'bgColor',\r\n    'bgColorAlt',\r\n    'accentColor',\r\n    'accentColorAlt',\r\n    'siteWidth',\r\n    'sitePadding',\r\n    'sectionMargin',\r\n];\r\nfunction cssVar(name) {\r\n    return `var(--${name})`;\r\n}\r\nfunction setCssVar(name, value) {\r\n    return `--${name}: ${value}`;\r\n}\r\nexport { cssVar, setCssVar };\r\n","import { css } from 'styled-components';\r\nimport { setCssVar } from './cssVar';\r\nimport greyscale from './grey';\r\nconst brand = {\r\n    black: '#231f20',\r\n    blueGrey: '#eff1f1',\r\n    gold: '#a29161',\r\n    grey: greyscale,\r\n    magenta: '#89166e',\r\n    purple: '#57154a',\r\n    white: '#fff',\r\n    validation: {\r\n        invalid: '#da291c',\r\n        valid: '#008c15',\r\n    },\r\n};\r\nexport const lightTheme = css `\r\n  ${setCssVar('fgColor', brand.black)};\r\n  ${setCssVar('bgColor', brand.white)};\r\n  ${setCssVar('bgColorAlt', brand.magenta)};\r\n  ${setCssVar('accentColor', brand.magenta)};\r\n  ${setCssVar('accentColorAlt', brand.purple)};\r\n`;\r\nexport const darkTheme = css `\r\n  ${setCssVar('fgColor', brand.white)};\r\n  ${setCssVar('bgColor', brand.black)};\r\n  ${setCssVar('accentColor', brand.magenta)};\r\n  ${setCssVar('accentColorAlt', brand.purple)};\r\n`;\r\nexport const magentaTheme = css `\r\n  ${setCssVar('fgColor', brand.white)};\r\n  ${setCssVar('bgColor', brand.magenta)};\r\n  ${setCssVar('accentColor', brand.magenta)};\r\n  ${setCssVar('accentColorAlt', brand.purple)};\r\n`;\r\nexport const patternTheme = css `\r\n  ${setCssVar('fgColor', brand.black)};\r\n  ${setCssVar('bgColor', brand.white)};\r\n  ${setCssVar('accentColor', brand.magenta)};\r\n  ${setCssVar('accentColorAlt', brand.purple)};\r\n`;\r\nexport const purpleTheme = css `\r\n  ${setCssVar('fgColor', brand.white)};\r\n  ${setCssVar('bgColor', brand.purple)};\r\n  ${setCssVar('accentColor', brand.magenta)};\r\n  ${setCssVar('accentColorAlt', brand.purple)};\r\n`;\r\nexport const themes = {\r\n    dark: darkTheme,\r\n    light: lightTheme,\r\n    magenta: magentaTheme,\r\n    pattern: patternTheme,\r\n    purple: purpleTheme,\r\n};\r\nexport default brand;\r\n","import { hsl } from 'polished';\r\nconst greyscaleValues = [18, 46, 70, 73, 87];\r\nconst greyscale = greyscaleValues.reduce((previous, current) => ({\r\n    ...previous,\r\n    [`grey${current}`]: grey(current),\r\n}), {});\r\nfunction grey(value) {\r\n    return hsl(0, 0, value / 100);\r\n}\r\nexport { greyscale as default, grey };\r\n"],"sourceRoot":""}