{"version":3,"sources":["webpack:///./presentation/utils/urlLanguageParse.ts","webpack:///./presentation/components/ribbons/tiers/DesktopTier.tsx","webpack:///src/presentation/components/ribbons/tiers/DesktopTier.stylesheet.ts","webpack:///src/presentation/components/ribbons/tiers/Desktop.stylesheet.ts","webpack:///./presentation/components/ribbons/tiers/Desktop.tsx"],"names":["url","language","length","parsedLanguage","split","toUpperCase","join","replace","isValueDefined","value","isNilOrEmpty","PureDesktopTier","colorway","glyph","imageUrl","label","behavior","badge","selected","hover","handleClick","currentLanguage","styles","theme","useTheme","typography","contrastColor","getContrastColor","useStyles","default","root","display","alignItems","height","position","textAlign","fontFamily","content","color","getTitleColor","width","borderWidth","outline","cursor","paddingTop","gu2px","paddingBottom","cssSides","Side","longhand","style","backgroundColor","transition","textDecoration","text","overflow","textOverflow","whiteSpace","icon","justifyContent","marginRight","spacing","image","minWidth","objectFit","objectPosition","marginLeft","borderBottomColor","rgba","useStylesheet","hasGlyph","hasImage","hasBadge","badgeKind","Colorway","DARK","HIGHLIGHT","includes","BadgeKind","PRIMARY","goto","isExternalRoute","tierUrl","useIsExternalRoute","onClick","href","scrollToRef","isHashUrl","undefined","data-selector","name","size","loading","src","urlLanguageParse","alt","createImageAlt","Boolean","Shortcode","against","code","flush","kind","displayName","callToAction","withLanguage","withHover","tiersBorderBottomColor","LIGHT","NEUTRAL","PRIMARY_GRADIENT","PureDesktopTiers","id","ribbonId","links","layout","classNames","alignment","findResponsiveItem","breakpoints","Alignment","tiers","cx","link","getClassNames","useBreakpoints","className","map","i"],"mappings":"8EAAe,KAACA,EAAaC,KAC3B,GAAID,GAAOA,EAAIE,QAAUD,EAAU,CACjC,IAAIE,EAMJ,OAJEA,EADiC,IAA/BF,EAASG,MAAM,KAAKF,OACL,CAACD,EAASG,MAAM,KAAK,GAAIH,EAASG,MAAM,KAAK,GAAGC,eAAeC,KAAK,KAEpEL,EAEZD,EAAIO,QAAQ,eAAgBJ,GAErC,OAAOH,I,gTC2BT,SAASQ,EAA4BC,GACnC,OAAQC,YAAaD,GAGhB,MAAME,EAAkB,IAWb,IAXc,SAC9BC,EAD8B,MAE9BC,EAF8B,SAG9BC,EAH8B,MAI9BC,EAJ8B,SAK9BC,EAL8B,MAM9BC,EAN8B,SAO9BC,EAP8B,MAQ9BC,EAR8B,YAS9BC,EAT8B,gBAU9BC,GACgB,EAChB,MAAM,OAAEC,GC7CK,KAQT,IARU,4BAGdH,GAKI,EACJ,MAAM,MAAEI,GAAUC,eACZ,qBAAWC,GAAjB,EACMC,EAAgBC,YAAiBJ,EAAvC,GAEA,OAAOK,YACL,CACEC,QAAS,CACPC,KAAM,CACJC,QADI,OAEJC,WAFI,SAGJC,OAHI,OAIJC,SAJI,WAKJC,UALI,SAMJC,WAAYX,EANR,WAODY,cACHC,MAAOC,YAAchB,EARjB,GASJiB,MATI,OAUJC,YAVI,EAWJC,QAXI,EAYJC,OAZI,UAaJC,WAAYC,YAAM,EAbd,GAcJC,cAAeD,YAAM,EAdjB,MAeDE,YAAS,UAAWC,IAAZ,EAfP,MAgBDC,YAAS,eAAgB,CAC1BT,MAD0B,EAE1BU,MAF0B,QAG1BZ,MAAO,gBAETa,gBArBI,cAsBJC,WAtBI,uCAuBJC,eAAgB,QAElBC,KAAM,CACJC,SADI,SAEJC,aAFI,WAGJC,WAAY,UAEdC,KAAM,CACJ3B,QADI,OAEJC,WAFI,SAGJ2B,eAHI,SAIJnB,MAAOK,YAAM,EAJT,GAKJZ,OAAQY,YAAM,EALV,GAMJP,MANI,EAOJsB,YAAaf,YAAM,EAAGgB,IAExBC,MAAO,CACLtB,MAAOK,YAAM,EADR,GAELZ,OAAQY,YAAM,EAFT,GAGLkB,SAAUlB,YAAM,EAHX,GAILmB,UAJK,QAKLC,eAAgB,UAElBhD,MAAO,CACLiD,WAAYrB,YAAM,EAAGgB,KAIzB3C,SAAU,CACRY,KAAM,CACJqC,kBAAmBzC,IAIvBP,MAAO,CACLW,KAAM,CACJqC,kBAAmBC,YAAKzC,YAAiBJ,EAAlB,UAI7B,CAAC,CAAEJ,SAAS,CAAEP,YAAY,CAAEM,eDlCXmD,CAAc,CAC/BzD,WACAM,WACAC,UAEImD,EAAW9D,EAAeK,GAC1B0D,EAAW/D,EAAeM,GAC1B0D,EAAWhE,EAAeS,GAC1BwD,EAAY,CAACC,IAASC,KAAMD,IAASE,WAAWC,SAASjE,GAAYkE,IAAUC,QAAUD,IAAUF,UACnGI,EAAOhE,aAAH,EAAGA,EAAUgE,MACfC,EAAiBC,GAAYC,YAAmBH,GAExD,OACE,eAAC,IAAD,CACEI,QAAShE,EACTiE,KAAMH,EACNI,YAAaC,YAAUL,GAAWA,OAAUM,EAC5CtC,MAAO5B,EAAOQ,KACdmD,gBAAiBA,EACjBQ,gBAAc,cANhB,WAQInB,GAAYC,IACZ,uBAAMrB,MAAO5B,EAAOoC,KAApB,UACGY,GAAY,cAAC,IAAD,CAAOoB,KAAM7E,EAAO8E,KAAMrE,EAAOoC,KAAKlB,MAAiBF,MAAOhB,EAAOoC,KAAKpB,QACtFiC,GACC,qBACEqB,QAAQ,OACRC,IAAKC,YAAiBhF,EAAUO,GAChC6B,MAAO5B,EAAOwC,MACdiC,IAAKC,YAAe,CAAElF,kBAM7BmF,QAAQlF,IAAU,cAACmF,EAAA,EAAD,CAAWC,QAASvF,EAAUwF,KAAMrF,IAEtDyD,GACC,sBAAMtB,MAAO5B,EAAOL,MAApB,SACE,cAAC,IAAD,CAAOoF,OAAO,EAAMC,KAAM7B,EAA1B,SACE,cAACyB,EAAA,EAAD,CAAWC,QAASvF,EAAUwF,KAAMnF,YAQhDN,EAAgB4F,YAAc,cAEfC,kBAAaC,YAAaC,YAAU/F,K,yBE1FnD,MA+BMgG,EAAmD,CACvDC,MADuD,WAIvDC,QAJuD,WAOvDlC,KAPuD,WAUvDI,QAVuD,WAavD+B,iBAbuD,WAgBvDlC,UAAW,Y,OCxCN,MAAMmC,EAAmB,IAAqE,IAAlEC,GAAIC,EAAN,MAAgBC,EAAhB,SAAuBtG,EAAvB,OAAiCuG,EAAjC,SAAyCjG,GAA2B,EACnG,MACMkG,ED+CqB,KAA8C,cAA7C,gCAAyBD,GAAoB,EACzE,MAAME,EAAYC,YAAmBC,EAAa,UAChDJ,aADgD,EAChDA,mBADgD,EACrBK,IADqB,kBAEhDL,aAFgD,EAEhDA,mBAFgD,EAErBK,IAFqB,kBAGhDL,aAHgD,EAGhDA,aAHgD,EAG3BK,IAHvB,WAMA,MAAO,CACL1F,KADK,GAEL2F,MAAOC,YAjEX,WAiEqBf,EAAR,GAA0CU,IAAcG,IAAdH,UAbvD,YAcIM,KAAMD,YArDV,WAqDmBL,IAAcG,IAAdH,QA7CnB,cCZqBO,CAAc,CAAEL,YADfM,cAC4BjH,WAAUuG,WAE1D,OACE,gCACE,cAAC,IAAD,IACA,cAAC,IAAD,UACE,qBAAKW,UAAWV,EAAWK,MAA3B,SACGP,EAAMa,IAAI,CAACJ,EAAMK,IAChB,qBAA2CF,UAAWV,EAAWO,KAAjE,SACE,cAAC,EAAD,CACE/G,SAAUA,EACVM,SAAU8G,IAAM9G,EAChB+F,SAAUA,KACNU,KALG,gBAAeV,KAAYe,cAelDjB,EAAiBR,YAAc,eAEhBQ","file":"pex-static/34/76.2ae6453cdc57389385bc.chunk.js","sourcesContent":["export default (url: string, language?: string) => {\n  if (url && url.length && language) {\n    let parsedLanguage;\n    if (language.split('-').length === 2) {\n      parsedLanguage = [language.split('-')[0], language.split('-')[1].toUpperCase()].join('-');\n    } else {\n      parsedLanguage = language;\n    }\n    return url.replace('{{language}}', parsedLanguage);\n  }\n  return url;\n};\n","import React, { ComponentType } from 'react';\nimport { withHover } from '@team-griffin/stylr';\nimport Glyph, { IconName } from '@uds/glyphs';\nimport { ReactRouterLink } from '@uds/react-router-adapter';\nimport Badge, { Kind as BadgeKind } from '@uds/badge';\nimport { Colorway } from '@uds/theme-utils';\nimport callToAction from 'presentation/hocs/callToAction';\nimport createImageAlt from 'presentation/utils/createImageAlt';\nimport withLanguage from 'presentation/hocs/withLanguage';\nimport urlLanguageParse from 'presentation/utils/urlLanguageParse';\nimport { isNilOrEmpty } from 'presentation/utils/generalUtils';\nimport Shortcode, { ShortcodeProps } from 'components/Shortcode';\nimport { useIsExternalRoute } from 'domain/selectors/common';\nimport { isHashUrl } from 'domain/url';\n\nimport useStylesheet from './DesktopTier.stylesheet';\n\ninterface OuterProps {\n  ribbonId?: string;\n  colorway: Colorway;\n  imageUrl?: string;\n  badge?: ShortcodeProps;\n  glyph?: IconName;\n  selected?: boolean;\n  behavior?: {\n    type?: string;\n    goto?: string;\n  };\n  label?: ShortcodeProps;\n}\n\nexport interface InnerProps extends OuterProps {\n  currentLanguage: string;\n  handleClick?: (evt?: any) => void;\n  hover: boolean;\n}\n\nfunction isValueDefined<T = unknown>(value: T | undefined): value is T {\n  return !isNilOrEmpty(value);\n}\n\nexport const PureDesktopTier = ({\n  colorway,\n  glyph,\n  imageUrl,\n  label,\n  behavior,\n  badge,\n  selected,\n  hover,\n  handleClick,\n  currentLanguage,\n}: InnerProps) => {\n  const { styles } = useStylesheet({\n    colorway,\n    selected,\n    hover,\n  });\n  const hasGlyph = isValueDefined(glyph);\n  const hasImage = isValueDefined(imageUrl);\n  const hasBadge = isValueDefined(badge);\n  const badgeKind = [Colorway.DARK, Colorway.HIGHLIGHT].includes(colorway) ? BadgeKind.PRIMARY : BadgeKind.HIGHLIGHT;\n  const goto = behavior?.goto;\n  const [ isExternalRoute, tierUrl ] = useIsExternalRoute(goto);\n\n  return (\n    <ReactRouterLink\n      onClick={handleClick}\n      href={tierUrl}\n      scrollToRef={isHashUrl(tierUrl) ? tierUrl : undefined}\n      style={styles.root}\n      isExternalRoute={isExternalRoute}\n      data-selector=\"tier-button\"\n    >\n      {(hasGlyph || hasImage) && (\n        <span style={styles.icon}>\n          {hasGlyph && <Glyph name={glyph} size={styles.icon.width as number} color={styles.icon.color as string} />}\n          {hasImage && (\n            <img\n              loading=\"lazy\"\n              src={urlLanguageParse(imageUrl, currentLanguage)}\n              style={styles.image}\n              alt={createImageAlt({ imageUrl })}\n            />\n          )}\n        </span>\n      )}\n\n      {Boolean(label) && <Shortcode against={colorway} code={label} />}\n\n      {hasBadge && (\n        <span style={styles.badge}>\n          <Badge flush={true} kind={badgeKind}>\n            <Shortcode against={colorway} code={badge} />\n          </Badge>\n        </span>\n      )}\n    </ReactRouterLink>\n  );\n};\n\nPureDesktopTier.displayName = 'DesktopTier';\n\nexport default callToAction(withLanguage(withHover(PureDesktopTier))) as ComponentType<OuterProps>;\n","import { useStyles } from '@team-griffin/stylr';\nimport cssSides, { Side } from '@team-griffin/css-sides';\nimport longhand from '@team-griffin/css-longhand';\nimport { gu2px, useTheme, Colorway } from '@uds/theme-utils';\nimport { content } from '@ux/type-size';\nimport { getContrastColor, getTitleColor } from 'presentation/utils/colorway';\nimport rgba from 'presentation/utils/rgba';\n\nexport default ({\n  colorway,\n  selected,\n  hover,\n}: {\n  colorway: Colorway;\n  selected: boolean | undefined;\n  hover: boolean;\n}) => {\n  const { theme } = useTheme();\n  const { spacing, typography } = theme;\n  const contrastColor = getContrastColor(theme, colorway);\n\n  return useStyles(\n    {\n      default: {\n        root: {\n          display: 'flex',\n          alignItems: 'center',\n          height: '100%',\n          position: 'relative',\n          textAlign: 'center',\n          fontFamily: typography.display,\n          ...content(),\n          color: getTitleColor(theme, colorway),\n          width: '100%',\n          borderWidth: 0,\n          outline: 0,\n          cursor: 'pointer',\n          paddingTop: gu2px(2, spacing),\n          paddingBottom: gu2px(2, spacing),\n          ...cssSides('padding', Side.X, 0),\n          ...longhand('borderBottom', {\n            width: 4,\n            style: 'solid',\n            color: 'transparent',\n          }),\n          backgroundColor: 'transparent',\n          transition: 'border-bottom-color 0.3s ease-in-out',\n          textDecoration: 'none',\n        },\n        text: {\n          overflow: 'hidden',\n          textOverflow: 'ellipsis',\n          whiteSpace: 'nowrap',\n        },\n        icon: {\n          display: 'flex',\n          alignItems: 'center',\n          justifyContent: 'center',\n          width: gu2px(3, spacing),\n          height: gu2px(3, spacing),\n          color: contrastColor,\n          marginRight: gu2px(1, spacing),\n        },\n        image: {\n          width: gu2px(3, spacing),\n          height: gu2px(3, spacing),\n          minWidth: gu2px(3, spacing),\n          objectFit: 'cover',\n          objectPosition: 'center',\n        },\n        badge: {\n          marginLeft: gu2px(1, spacing),\n        },\n      },\n\n      selected: {\n        root: {\n          borderBottomColor: contrastColor,\n        },\n      },\n\n      hover: {\n        root: {\n          borderBottomColor: rgba(getContrastColor(theme, colorway), 0.9),\n        },\n      },\n    },\n    [{ hover }, { colorway }, { selected }],\n  );\n};\n","import { css, cx } from 'linaria';\nimport { cssTheme, Colorway } from '@uds/theme-utils';\nimport { BreakpointProps } from '@ux/responsive';\nimport { Alignment } from 'domain/constants/alignment';\nimport { Layout } from 'domain/constants/layout';\nimport findResponsiveItem from 'presentation/utils/findResponsiveItem';\n\ninterface Props {\n  breakpoints: BreakpointProps;\n  colorway: Colorway;\n  layout: Layout;\n}\n\nconst tiers = css`\n  display: flex;\n  border-bottom: 2px solid rgba(var(--tiers-border-color), 0.2);\n  overflow-x: auto;\n  overflow-y: hidden;\n\n  &::-webkit-scrollbar {\n    display: none; /*    Chrome     */\n    -ms-overflow-style: none; /* IE and Edge   */\n    scrollbar-width: none; /*    Firefox    */\n  }\n`;\n\nconst link = css`\n  padding-right: ${cssTheme.gu3};\n  padding-left: ${cssTheme.gu3};\n  margin-right: ${cssTheme.gu1};\n  margin-bottom: -2px;\n  flex: 0 0 auto;\n`;\n\nconst centeredLink = css`\n  &.${link}:first-child {\n    margin-left: auto;\n  }\n\n  &.${link}:last-child {\n    margin-right: auto;\n  }\n`;\n\nconst tiersBorderBottomColor: Record<Colorway, string> = {\n  LIGHT: css`\n    --tiers-border-color: ${cssTheme.palette.rgb.grey06};\n  `,\n  NEUTRAL: css`\n    --tiers-border-color: ${cssTheme.palette.rgb.grey06};\n  `,\n  DARK: css`\n    --tiers-border-color: ${cssTheme.palette.rgb.grey06};\n  `,\n  PRIMARY: css`\n    --tiers-border-color: ${cssTheme.palette.rgb.primaryContrast};\n  `,\n  PRIMARY_GRADIENT: css`\n    --tiers-border-color: ${cssTheme.palette.rgb.primaryContrast};\n  `,\n  HIGHLIGHT: css`\n    --tiers-border-color: ${cssTheme.palette.rgb.highlightContrast};\n  `,\n};\n\nconst justifyContent = css`\n  justify-content: flex-start;\n`;\n\nexport const getClassNames = ({ breakpoints, colorway, layout }: Props) => {\n  const alignment = findResponsiveItem(breakpoints, [\n    layout?.alignmentMobile ?? Alignment.STARTING,\n    layout?.alignmentTablet ?? Alignment.STARTING,\n    layout?.alignment ?? Alignment.STARTING,\n  ]);\n\n  return {\n    root: {},\n    tiers: cx(tiers, tiersBorderBottomColor[colorway], alignment === Alignment.STARTING && justifyContent),\n    link: cx(link, alignment === Alignment.CENTER && centeredLink),\n  };\n};\n","/* eslint-disable react/no-array-index-key */\nimport React from 'react';\nimport Helmet from 'react-helmet';\nimport { useBreakpoints } from '@ux/responsive';\nimport { Container } from '@uds/grid';\nimport { Colorway } from '@uds/theme-utils';\nimport { Layout } from 'domain/constants/layout';\n\nimport Tier from './DesktopTier';\nimport { Link } from './Tiers';\nimport { getClassNames } from './Desktop.stylesheet';\n\ninterface OuterProps {\n  id: string;\n  links: Array<Link>;\n  colorway: Colorway;\n  selected: number;\n  layout: Layout;\n}\n\nexport const PureDesktopTiers = ({ id: ribbonId, links, colorway, layout, selected }: OuterProps) => {\n  const breakpoints = useBreakpoints();\n  const classNames = getClassNames({ breakpoints, colorway, layout });\n\n  return (\n    <div>\n      <Helmet />\n      <Container>\n        <nav className={classNames.tiers}>\n          {links.map((link, i) => (\n            <div key={`Tier_desktop_${ribbonId}_${i}`} className={classNames.link}>\n              <Tier\n                colorway={colorway}\n                selected={i === selected}\n                ribbonId={ribbonId}\n                {...link}\n              />\n            </div>\n          ))}\n        </nav>\n      </Container>\n    </div>\n  );\n};\n\nPureDesktopTiers.displayName = 'DesktopTiers';\n\nexport default PureDesktopTiers;\n"],"sourceRoot":""}