{"version":3,"sources":["webpack:///./presentation/components/ribbons/tiers/Tiers.tsx","webpack:///./presentation/components/ribbons/tiers/ConnectedTiers.ts","webpack:///./presentation/components/ribbons/tiers/index.ts","webpack:///./presentation/utils/ribbonPadding.ts","webpack:///src/presentation/hocs/errorBoundary.tsx","webpack:///./presentation/hocs/withRibbonImpression.ts","webpack:///./presentation/utils/ribbonWidth.ts","webpack:///./presentation/hocs/deepLink.tsx","webpack:///./presentation/components/ribbons/Ribbon/Ribbon.tsx","webpack:///./presentation/components/ribbons/Ribbon/ConnectedRibbon.ts","webpack:///./presentation/components/ribbons/Ribbon/index.ts","webpack:///./presentation/utils/getBreakpoints.ts","webpack:///./presentation/hocs/visibilitySet.tsx"],"names":["DesktopTiers","lazy","MobileTiers","enhance","pureEnhance","hocs","errorBoundary","visibilitySet","hooks","defaultProps","links","withBreakpointsHook","theme","loading","colorway","layout","isMinSm","name","props","Ribbon","id","flush","type","fallback","withRouter","withProps","connect","state","location","window","currentUrl","origin","pathname","selected","r","hash","isVisibilitySetActive","getSelected","externalRoutes","getExternalRoutes","Tiers","spacing","isMinLg","shrinkLeading","shrinkTrailing","getPaddingSize","shrinkSide","isFlush","leading","Flush","LEADING","trailing","TRAILING","paddingTop","gu2px","paddingBottom","stylesheet","useTheme","useBreakpoints","useStyles","default","root","backgroundColor","getBackgroundColor","color","getTitleColor","ribbonPadding","cssSides","Side","textAlign","isMinMd","ErrorBoundary","styles","style","compose","withState","lifecycle","componentDidCatch","this","hooksA","pipe","mapProps","selector","useMemo","getRibbonAnalytics","analytics","useSelector","dispatch","useDispatch","actions","bindActionCreators","sendImpression","withHandlers","onImpression","ribbonName","ribbonType","hooksB","isFullyInViewport","stopWatcher","useEffect","mapPropsHoc","branch","Watch","deepLink","componentDidMount","scrollWhenReady","animationComplete","setTimeout","scroller","scrollTo","duration","delay","smooth","WrappedComponent","mapFit","fit","Fit","FULLSCREEN","minHeight","FILL","flex","flexBasis","AUTO","height","isFinite","targetRef","useRef","palette","duoLayout","activeFit","findResponsiveItem","getBreakpoints","padding","duoLayoutFlex","duoRibbonWidth","position","display","flexDirection","width","percentage","inner","ribbon","modifier","Colorway","PRIMARY_GRADIENT","backgroundImage","primary","primaryGradient","children","ref","withRibbonImpression","BaseComponent"],"mappings":"ufAYA,MAAMA,EAAeC,eAAK,IAAM,uDAC1BC,EAAcD,eAAK,IAAM,uDA8EhBE,MAfQC,YACrB,QAAS,CACPC,KAAM,CACJC,IACAC,KAEFC,MAAO,CACLC,uBAAa,CACXC,MAAO,KAETC,MAKSR,CA1DU,EACvBS,QACAC,UACAC,WACAC,SACAC,UACAC,UACGC,KAEH,kBAACC,EAAA,EAAD,CACEC,GAAIF,EAAME,GACVR,MAAOA,EACPG,OAAQA,EACRD,SAAUA,EACVO,OAAO,EACPR,QAASA,EACTI,KAAMA,EACNK,KAAK,SAGcN,EACf,kBAAC,WAAD,CAAUO,SAAU,+BAClB,kBAACvB,EAAD,GACEY,MAAOA,EACPE,SAAUA,EACVC,OAAQA,GACJG,KAKR,kBAAC,WAAD,CAAUK,SAAU,+BAClB,kBAACrB,EAAD,GACEU,MAAOA,EACPE,SAAUA,GACNI,OCJDf,MA/CCC,YACd,iBAAkB,CAChBC,KAAM,CACJmB,KAEFhB,MAAO,CACLiB,oBAAWP,GAmCFQ,YAlCWC,IAChB,MAAM,MAAEjB,GAAUQ,EACZU,EAAWC,OAAOD,SAClBE,EAAaF,EAASG,OAASH,EAASI,SA0B9C,MAAO,CACLC,SA1BkBC,IAClBA,IAAY,IACZA,IACEA,IACEA,IAAU,CACRA,IAAS,CAAE,WAAY,QAAUN,EAASI,UAC1CE,IAAS,CAAE,WAAY,QAAUN,EAASO,MAC1CD,IAAS,CAAE,WAAY,QAAUJ,KAEnCI,IAAU,CACRA,IAAgBA,IAAM,iBAAkB,YACxCA,IACEA,IAAS,GAAI,CAAE,WAAY,kBAC3BE,IAEAF,IAAQA,IAAM,CAAEP,SAOTU,CAAY3B,GAK3B4B,eAJqBC,YAAkBZ,KAOpCD,MAMAvB,CAAQqC,GC9DRA,a,oBCFf,0EAKe,MACbC,UACAzB,UACA0B,UACA3B,SACAM,YASA,GAAIa,IAASb,GAAO,GAElB,MAAO,GAGT,MAAM,cAEJsB,EAFI,eAIJC,GACEV,IAAY,GAAInB,GASd8B,EAAiB,CAACC,EAAoBC,IAEtCA,EACK,EAGFb,IAAO,CACZ,CAAEA,IAASY,GAAY,GAAO,IAAMZ,IAClCA,KAAS,GACTA,IAAS,GACTA,IAAS,IAHyBA,CAIlClB,IACF,CAAEkB,IAAS,WAAW,GAAOA,IAAS,IACtC,CAAEA,IAAS,WAAW,GAAOA,IAAS,IACtC,CAAEA,IAAKA,IAAS,KARXA,CASJ,CACDQ,UACA1B,UACA2B,gBACAC,mBAIEI,EAAUH,EAAe,gBAAiBxB,IAAU4B,IAAMC,SAC1DC,EAAWN,EAAe,iBAAkBxB,IAAU4B,IAAMG,UAElE,MAAO,CACLC,WAAYC,YAAMN,EAASP,GAC3Bc,cAAeD,YAAMH,EAAUV,M,oBClEnC,4GA2BA,MAAMe,EAAa,EAAC,oBAAoBnC,YACtC,MAAM,MAAET,GAAU6C,eACZ,4BAAoBf,GAAYgB,eAChC,QAAEjB,GAAR,EAEA,OAAOkB,YACL,CACEC,QAAS,CACPC,KAAM,CACJC,gBAAiBC,YAAmBnD,EADhC,GAEJoD,MAAOC,YAAcrD,EAFjB,MAGDsD,YAAc,wCAKf7C,aAEC8C,YAAS,OAAQC,IAAT,EAAiBd,YAAM,EAV9B,IAWJe,UAAW,WAGfrD,QAAS,CACP6C,KAAM,IACDM,YAAS,OAAQC,IAAT,EAAiBd,YAAM,EAAvB,OAIjB,CAAC,CAAExC,YAAY,CAAEE,WAAW,CAAEsD,cAInB,QACb,MAAMC,EAAgB,IACpBrC,kBADoB,GAEpB,EAAGsC,YACD,yBAAKC,MAAOD,EAAZ,MACE,2BACE,uBAASpD,GAAT,6BAIN,GAAuB,oBATzB,IAYA,OAAOsD,YACLC,YAAU,aAAc,iBADZ,GAEZC,YAAU,CACRC,kBAAmB,WAEjBC,KAAA,2BAGJrD,YARKiD,IAAP,K,8KC5DF,MAAMK,EAASC,eACbC,mBAAU/D,IACR,MAAM,GAAEE,GAAOF,EACTgE,EAAWC,kBAAQ,IAAMC,YAAmBhE,GAAK,CAAEA,IACnDiE,EAAYC,YAAYJ,GACxBK,EAAWC,cACXC,EAAUC,6BAAmB,CAAEC,oBAAkBJ,GAEvD,OAAOrD,IAAgBhB,EAAO,CAC5BmE,YACAI,cAGJG,uBAAa,CACXC,aAAc,EACZ5E,OACAK,OACA+D,YACAI,SACEE,qBASE,IAAMA,EAAe,IACtBN,EACHS,WAAY7E,EACZ8E,WAAYzE,OAKZ0E,EAAShB,eACbvD,oBAAU,EACRwE,oBACAC,cACAL,eACAR,gBAOAc,oBAAU,KACJF,IACFC,IACAL,EAAaR,KAEd,CAAEY,OAIM7F,kBAAY,mBAAoB,CAC7CC,KAAM,CACJ+F,YAAYrB,GACZsB,YACEnE,IAAgBA,IAAaA,KAAU,aACvCoE,SAEFF,YAAYJ,M,mCC3DD,I,wBC2BAO,MApCE7B,YACflD,IACAoD,YAAU,CACR4B,kBAAmB,WAKjB,GAAI1B,KAAK5D,MAAMU,SAASO,OAAU,IAAG2C,KAAK5D,MAAMD,KAAQ,CACtD,MAAMwF,EAAkB,KAGtB,GAAI3B,KAAK5D,MAAML,UAAYiE,KAAK5D,MAAMwF,kBACpC,OAAOC,WAAWF,EAAiB,KAGrCG,WAASC,SAAS/B,KAAK5D,MAAMD,KAAM,CACjC6F,SAAU,IACVC,MAAO,IACPC,QAAQ,KAGZL,WAAWF,EAAiB,SAIjCQ,GACS/F,GACN,kBAAC,WAAD,KACE,kBAAC,UAAD,CAASD,KAAMC,EAAMD,OACrB,kBAACgG,EAAqB/F,K,wECK9B,MAAMgG,EAAUC,GAAajF,IAAO,CAClC,CAAEA,IAASkF,IAAIC,YAAanF,IAAS,CACnCoF,UAAW,WAEb,CAAEpF,IAASkF,IAAIG,MAAOrF,IAAS,CAC7BsF,KAAM,EACNC,UAAW,UAEb,CAAEvF,IAASkF,IAAIM,MAAOxF,IAAS,CAC7ByF,OAAQ,UAEV,CAAEC,SAAU1F,IAAS,CACnBoF,UAAWH,KAEb,CAAEjF,IAAKA,IAAS,CACdyF,OAAQ,WAfiBzF,CAiB1BiF,GAkIYhH,MA9BQC,YAAY,SAAU,CAC3CC,KAAM,CACJkG,GAEF/F,MAAO,CACLiB,oBAAU,KAgBD,CACLoG,UAhBgBC,iBAAO,OAmB3BnH,IACAc,oBA5He,EACjBb,QACAE,WACAD,UACAE,SACAM,WACGH,MAEH,MAAM,QACJ6G,EADI,QAEJtF,GACE7B,GACE,IAEJuG,GACEjF,IAAY,GAAInB,IAEd,QACJC,EADI,QAEJsD,EAFI,QAGJ5B,EAHI,UAIJsF,GACE9G,EAEE+G,EAAYC,YAChBC,YAAejH,GACfiG,GAGIiB,EAAUlE,YAAc,CAC5BzB,UACAzB,UACA0B,UACA3B,SACAM,UAGIgH,EFnGsB,GAC5B/D,UACA0D,gBAKA,IAAK1D,GAAwB,MAAb0D,EACd,MAAO,GAIT,MAAO,CACLR,MAFgBlD,GAAW0D,EAAa,GAAK,KAEtC,MEsFaM,CAAe,CACnChE,UACA0D,cAGF,OAAOrE,YAAU,CACfC,QAAS,CACPC,KAAM,CACJC,gBAAiBC,YAAmBnD,EAAOE,GAC3CyH,SAAU,WACVC,QAAS,OACTC,cAAe,SACfC,MAAOC,YAAW,QACfzB,EAAOe,MACPG,KACAC,GAELO,MAAO,CACLpB,KAAM,EACNC,UAAW,OACXe,QAAS,OACTb,OAAQ,QAEVkB,OAAQ,CACNL,QAAS,OACTC,cAAe,SACfC,MAAOC,YAAW,OAItB,CAACG,YAAS,WAAYC,IAASC,mBAAoB,CACjDnF,KAAM,CACJoF,gBAAkB,6BAA4BlB,EAAQmB,YAAYnB,EAAQoB,sBAG7E,CACD,CAAEtI,WACF,CAAEC,YACF,CAAEE,WACF,CAAEsD,WACF,CAAE5B,iBAmDSvC,CA/CW,EACxBqE,SACAqD,YACAuB,cAEA,6BAAS3E,MAAOD,EAAOX,MACrB,yBAAKY,MAAOD,EAAOoE,OACjB,yBACEnE,MAAOD,EAAOqE,OACdQ,IAAKxB,GAEJuB,MCjJMjJ,MAJCC,YAAY,kBAAmB,CAC7CC,KAAM,CAAEiJ,IAGKnJ,CAAQgB,GCJRA,O,oBCLf,aAMgBD,OAAoBgB,IAAO,CACzC,UACA,UACA,UACA,WACChB,I,oBCXH,oCAGgBqI,OAAuBrH,IACrCA,IAAO,WACNhB,GAAU,kBAACqI,EAAkBrI,GAC7BA,GACC,yBAAKuD,MAAO,CAAE+D,QAAS,SACrB,kBAACe,EAAkBrI","file":"pex-static/40/58.8663796b8b2470f7ce2d.chunk.js","sourcesContent":["import React, { lazy, Suspense } from 'react';\nimport {\n  defaultProps,\n} from '@team-griffin/rehook';\n// import { fastCompare } from '@ux/perf';\nimport Ribbon from 'components/ribbons/Ribbon';\nimport { withBreakpointsHook, BreakpointProps } from '@ux/responsive';\nimport errorBoundary from 'presentation/hocs/errorBoundary';\nimport visibilitySet from 'presentation/hocs/visibilitySet';\nimport pureEnhance from '@ux/pure-enhance';\nimport { RibbonProps } from 'domain/constants/ribbons';\n\nconst DesktopTiers = lazy(() => import('./Desktop'));\nconst MobileTiers = lazy(() => import('./Mobile'));\n\nexport type Link = {\n  href?: string,\n  first?: boolean,\n  behavior: {\n    goto: string,\n  },\n};\n\nexport interface OuterProps extends RibbonProps {\n  selected: number,\n  externalRoutes: string[],\n  links?: Link[],\n}\ninterface DefaultProps extends OuterProps {\n  links: Link[],\n}\ninterface InnerProps extends DefaultProps, BreakpointProps {}\n\nexport const PureTiers = ({\n  theme,\n  loading,\n  colorway,\n  layout,\n  isMinSm,\n  name,\n  ...props\n}: InnerProps) => (\n  <Ribbon\n    id={props.id}\n    theme={theme}\n    layout={layout}\n    colorway={colorway}\n    flush={true}\n    loading={loading}\n    name={name}\n    type=\"Tiers\"\n  >\n    <Choose>\n      <When condition={isMinSm}>\n        <Suspense fallback={<div/>}>\n          <DesktopTiers\n            theme={theme}\n            colorway={colorway}\n            layout={layout}\n            {...props}\n          />\n        </Suspense>\n      </When>\n      <Otherwise>\n        <Suspense fallback={<div/>}>\n          <MobileTiers\n            theme={theme}\n            colorway={colorway}\n            {...props}\n          />\n        </Suspense>\n      </Otherwise>\n    </Choose>\n  </Ribbon>\n);\n\nexport const enhance = pureEnhance<InnerProps, OuterProps>(\n  'Tiers', {\n    hocs: [\n      errorBoundary,\n      visibilitySet,\n    ],\n    hooks: [\n      defaultProps({\n        links: [],\n      }),\n      withBreakpointsHook,\n    ],\n  },\n);\n\nexport default enhance(PureTiers);\n","import { connect } from '@ux/fabric';\nimport { withRouter } from 'react-router';\nimport * as r from 'ramda';\nimport {\n  isVisibilitySetActive,\n} from 'domain/selectors/ribbons';\nimport { getExternalRoutes } from 'domain/selectors/common';\nimport Tiers, { OuterProps as PureProps } from './Tiers';\nimport pureEnhance from '@ux/pure-enhance';\nimport { withProps } from '@team-griffin/rehook';\n\ninterface ConnectedProps {\n  selected: number,\n}\ninterface InnerProps extends PureProps {}\ninterface OuterProps extends Omit<InnerProps, keyof ConnectedProps> {}\n\nconst enhance = pureEnhance<InnerProps, OuterProps>(\n  'ConnectedTiers', {\n    hocs: [\n      withRouter,\n    ],\n    hooks: [\n      withProps((props: OuterProps) => {\n        const mapState = (state: any) => {\n          const { links } = props;\n          const location = window.location;\n          const currentUrl = location.origin + location.pathname;\n          const getSelected = r.pipe(\n            r.defaultTo([]),\n            r.findIndex(\n              r.either(\n                r.anyPass([\n                  r.pathEq([ 'behavior', 'goto' ], location.pathname),\n                  r.pathEq([ 'behavior', 'goto' ], location.hash),\n                  r.pathEq([ 'behavior', 'goto' ], currentUrl),\n                ]),\n                r.allPass([\n                  r.propSatisfies(r.has('visibilitySet'), 'behavior'),\n                  r.pipe(\n                    r.pathOr([], [ 'behavior', 'visibilitySet' ]),\n                    isVisibilitySetActive,\n                    //@ts-ignore\n                    r.apply(r.__, [ state ]),\n                  ),\n                ]),\n              ),\n            ),\n          );\n\n          const selected = getSelected(links);\n          const externalRoutes = getExternalRoutes(state);\n\n          return {\n            selected,\n            externalRoutes,\n          };\n        };\n        return connect(mapState)();\n      }),\n    ],\n  },\n);\n\nexport default enhance(Tiers);\n","import Tiers from './ConnectedTiers';\n\nexport default Tiers;\n","import { Flush } from 'domain/constants/ribbons';\nimport { gu2px } from '@ux/theme-utils';\nimport * as r from 'ramda';\nimport { Layout } from 'domain/constants/layout';\n\nexport default ({\n  spacing,\n  isMinSm,\n  isMinLg,\n  layout,\n  flush,\n}: {\n  spacing: number,\n  isMinSm: boolean,\n  isMinLg: boolean,\n  layout?: Layout,\n  flush?: Flush|boolean,\n}) => {\n\n  if (r.equals(flush, true)) {\n    // Component will handle all padding, used on full bleed image ribbons\n    return {};\n  }\n\n  const {\n    //@ts-ignore\n    shrinkLeading,\n    //@ts-ignore\n    shrinkTrailing,\n  } = r.defaultTo({}, layout);\n\n  /*\n    shrinkSide:\n      shrink[Leading/Trailing] prop is true then return a reduced padding\n      depending on screen size\n    isFlush:\n      leading or trailing edge has been designated as flush, no padding\n  */\n  const getPaddingSize = (shrinkSide: string, isFlush: boolean) => {\n\n    if (isFlush) {\n      return 0;\n    }\n\n    return r.cond([\n      [ r.propEq(shrinkSide, true), () => r.ifElse(\n        r.equals(true),\n        r.always(1),\n        r.always(0.5),\n      )(isMinSm) ],\n      [ r.propEq('isMinLg', true), r.always(6) ],\n      [ r.propEq('isMinSm', true), r.always(5) ],\n      [ r.T, r.always(4) ],\n    ])({\n      isMinLg,\n      isMinSm,\n      shrinkLeading,\n      shrinkTrailing,\n    });\n  };\n\n  const leading = getPaddingSize('shrinkLeading', flush === Flush.LEADING);\n  const trailing = getPaddingSize('shrinkTrailing', flush === Flush.TRAILING);\n\n  return {\n    paddingTop: gu2px(leading, spacing),\n    paddingBottom: gu2px(trailing, spacing),\n  };\n};\n","import React, { CSSProperties } from 'react';\nimport { compose, lifecycle, withState, withProps } from 'recompose';\nimport Message from '@ux/message';\nimport { Container } from '@ux/grid';\nimport * as r from 'ramda';\nimport cssSides, { Side } from '@team-griffin/css-sides';\nimport { getBackgroundColor, getTitleColor } from 'presentation/utils/colorway';\nimport { gu2px, useTheme } from '@ux/theme-utils';\nimport ribbonPadding from 'presentation/utils/ribbonPadding';\nimport { useStyles } from '@team-griffin/stylr';\nimport { Colorway } from 'domain/constants/colorway';\nimport { Layout } from 'domain/constants/layout';\nimport { Flush } from 'domain/constants/ribbons';\nimport { BreakpointProps, useBreakpoints } from '@ux/responsive';\n\ninterface OuterProps extends BreakpointProps {\n  colorway: Colorway;\n  layout: Layout;\n  flush?: Flush | boolean;\n}\n\ninterface InnerProps extends OuterProps {\n  styles: {\n    root: CSSProperties;\n  };\n  hasErrored: boolean;\n}\nconst stylesheet = ({ colorway, layout, flush }: InnerProps) => {\n  const { theme } = useTheme();\n  const { isMinSm, isMinMd, isMinLg } = useBreakpoints();\n  const { spacing } = theme;\n\n  return useStyles(\n    {\n      default: {\n        root: {\n          backgroundColor: getBackgroundColor(theme, colorway),\n          color: getTitleColor(theme, colorway),\n          ...ribbonPadding({\n            spacing,\n            isMinSm,\n            isMinLg,\n            layout,\n            flush,\n          }),\n          ...cssSides('Side', Side.X, gu2px(3, spacing)),\n          textAlign: 'center',\n        },\n      },\n      isMinSm: {\n        root: {\n          ...cssSides('Side', Side.X, gu2px(4, spacing)),\n        },\n      },\n    },\n    [{ colorway }, { isMinSm }, { isMinMd }],\n  );\n};\n\nexport default (WrappedComponent: any) => {\n  const ErrorBoundary = r.ifElse(\n    r.propEq('hasErrored', true),\n    ({ styles }) => (\n      <div style={styles.root}>\n        <Container>\n          <Message id=\"usf.ribbons.error.text\"/>\n        </Container>\n      </div>\n    ),\n    (props: InnerProps) => <WrappedComponent {...props}/>,\n  );\n\n  return compose(\n    withState('hasErrored', 'setHasErrored', false),\n    lifecycle({\n      componentDidCatch: function() {\n        //@ts-ignore\n        this.props.setHasErrored(true);\n      },\n    }),\n    withProps(stylesheet),\n  )(ErrorBoundary);\n};\n","import { useMemo, useEffect } from 'react';\nimport { branch, mapProps as mapPropsHoc } from 'recompose';\nimport pureEnhance from '@ux/pure-enhance';\nimport { useDispatch, useSelector } from 'react-redux';\nimport { bindActionCreators } from 'redux';\nimport { pipe, withProps, mapProps, withHandlers } from '@team-griffin/rehook';\nimport { Watch } from 'scrollmonitor-react';\nimport * as r from 'ramda';\nimport { sendImpression } from 'application/signals/ribbons';\nimport { getRibbonAnalytics } from 'domain/selectors/ribbons';\nimport { Type } from 'domain/constants/ribbons';\n\nconst hooksA = pipe(\n  mapProps((props: any) => {\n    const { id } = props;\n    const selector = useMemo(() => getRibbonAnalytics(id), [ id ]);\n    const analytics = useSelector(selector);\n    const dispatch = useDispatch();\n    const actions = bindActionCreators({ sendImpression }, dispatch);\n\n    return r.mergeDeepLeft(props, {\n      analytics,\n      actions,\n    });\n  }),\n  withHandlers({\n    onImpression: ({\n      name,\n      type,\n      analytics,\n      actions: {\n        sendImpression,\n      },\n    }: {\n      name: string,\n      type: Type,\n      analytics: any,\n      actions: {\n        sendImpression: Function,\n      }\n    }) => () => sendImpression({\n      ...analytics,\n      ribbonName: name,\n      ribbonType: type,\n    }),\n  }),\n);\n\nconst hooksB = pipe(\n  withProps(({\n    isFullyInViewport,\n    stopWatcher,\n    onImpression,\n    analytics,\n  }: {\n    isFullyInViewport: boolean,\n    stopWatcher: () => void,\n    onImpression: (a: any) => void,\n    analytics: any,\n  }) => {\n    useEffect(() => {\n      if (isFullyInViewport) {\n        stopWatcher();\n        onImpression(analytics);\n      }\n    }, [ isFullyInViewport ]);\n  }),\n);\n\nexport default pureEnhance('RibbonImpression', {\n  hocs: [\n    mapPropsHoc(hooksA),\n    branch(\n      r.propSatisfies(r.complement(r.isNil), 'analytics'),\n      Watch,\n    ),\n    mapPropsHoc(hooksB),\n  ],\n});\n","export const duoRibbonWidth = ({\n  isMinMd,\n  duoLayout,\n}: {\n  isMinMd: boolean,\n  duoLayout?: boolean,\n}) => {\n  if (!isMinMd || duoLayout == null) {\n    return {};\n  }\n\n  const flexSize = (isMinMd && duoLayout) ? 50 : 100;\n  return {\n    flex: `${flexSize}%`,\n  };\n};\n\nexport default null;","import React, { Fragment } from 'react';\nimport {\n  compose,\n  lifecycle,\n} from 'recompose';\nimport { withRouter } from 'react-router';\nimport { Element, scroller } from 'react-scroll';\n\nconst deepLink = compose(\n  withRouter,\n  lifecycle({\n    componentDidMount: function() {\n      //Adding some ts-ignores here so it doesn't throw not recognizing\n      //this.props\n\n      //@ts-ignore\n      if (this.props.location.hash === `#${this.props.name}`) {\n        const scrollWhenReady = () => {\n          // we can't scroll to eagerly or we'll end up in the wrong place\n          //@ts-ignore\n          if (this.props.loading || !this.props.animationComplete) {\n            return setTimeout(scrollWhenReady, 100);\n          }\n          //@ts-ignore\n          scroller.scrollTo(this.props.name, {\n            duration: 500,\n            delay: 100,\n            smooth: true,\n          });\n        };\n        setTimeout(scrollWhenReady, 100);\n      }\n    },\n  }),\n  (WrappedComponent: any) => {\n    return (props: any) => (\n      <Fragment>\n        <Element name={props.name}/>\n        <WrappedComponent {...props}/>\n      </Fragment>\n    );\n  },\n);\n\nexport default deepLink;\n","import React, { useRef, useLayoutEffect, CSSProperties, ReactNode, Ref } from 'react';\nimport { withProps } from '@team-griffin/rehook';\nimport pureEnhance from '@ux/pure-enhance';\nimport { withBreakpointsHook, BreakpointProps } from '@ux/responsive';\nimport findResponsiveItem from 'presentation/utils/findResponsiveItem';\nimport getBreakpoints from 'presentation/utils/getBreakpoints';\nimport ribbonPadding from 'presentation/utils/ribbonPadding';\nimport { duoRibbonWidth } from 'presentation/utils/ribbonWidth';\nimport { percentage, modifier } from '@ux/style-utils';\nimport deepLink from 'presentation/hocs/deepLink';\nimport { getBackgroundColor } from 'presentation/utils/colorway';\nimport { useStyles } from '@team-griffin/stylr';\nimport { Colorway } from 'domain/constants/colorway';\nimport { Fit, Flush, RibbonProps } from 'domain/constants/ribbons';\nimport * as r from 'ramda';\n\nexport {\n  Flush,\n};\n\ninterface OuterProps extends RibbonProps {\n  children?: ReactNode,\n}\ninterface WithHandlerProps extends OuterProps {\n  setAnimationComplete: Function,\n  setRibbonHeight: Function,\n  setHeight: Function,\n  onAnimationEnd: (props: {\n    newHeight: number;\n  }) => void,\n}\n\ninterface InnerProps extends WithHandlerProps, BreakpointProps {\n  rendered: boolean,\n  targetRef: Ref<any>,\n  duration: number,\n  styles: {\n    root: CSSProperties,\n    inner: CSSProperties,\n    ribbon: CSSProperties,\n  }\n}\n\nconst mapFit = (fit: Fit) => r.cond([\n  [ r.equals(Fit.FULLSCREEN), r.always({\n    minHeight: '100vh',\n  }) ],\n  [ r.equals(Fit.FILL), r.always({\n    flex: 1,\n    flexBasis: 'auto',\n  }) ],\n  [ r.equals(Fit.AUTO), r.always({\n    height: 'auto',\n  }) ],\n  [ isFinite, r.always({\n    minHeight: fit,\n  }) ],\n  [ r.T, r.always({\n    height: 'auto',\n  }) ],\n])(fit);\n\nconst stylesheet = ({\n  theme,\n  colorway,\n  loading,\n  layout,\n  flush,\n  ...props\n}: InnerProps) => {\n  const {\n    palette,\n    spacing,\n  } = theme;\n  const {\n  //@ts-ignore\n    fit,\n  } = r.defaultTo({}, layout);\n\n  const {\n    isMinSm,\n    isMinMd,\n    isMinLg,\n    duoLayout,\n  } = props;\n\n  const activeFit = findResponsiveItem(\n    getBreakpoints(props),\n    fit,\n  );\n\n  const padding = ribbonPadding({\n    spacing,\n    isMinSm,\n    isMinLg,\n    layout,\n    flush,\n  });\n\n  const duoLayoutFlex = duoRibbonWidth({\n    isMinMd,\n    duoLayout,\n  });\n\n  return useStyles({\n    default: {\n      root: {\n        backgroundColor: getBackgroundColor(theme, colorway),\n        position: 'relative',\n        display: 'flex',\n        flexDirection: 'column',\n        width: percentage(100),\n        ...mapFit(activeFit),\n        ...padding,\n        ...duoLayoutFlex,\n      },\n      inner: {\n        flex: 1,\n        flexBasis: 'auto',\n        display: 'flex',\n        height: 'auto',\n      },\n      ribbon: {\n        display: 'flex',\n        flexDirection: 'column',\n        width: percentage(100),\n      },\n    },\n\n    [modifier('colorway', Colorway.PRIMARY_GRADIENT)]: {\n      root: {\n        backgroundImage: `linear-gradient(to right, ${palette.primary}, ${palette.primaryGradient})`,\n      },\n    },\n  }, [\n    { loading },\n    { colorway },\n    { isMinSm },\n    { isMinMd },\n    { isMinLg },\n  ]);\n};\n\nexport const PureRibbon = ({\n  styles,\n  targetRef,\n  children,\n}: InnerProps) => (\n  <section style={styles.root}>\n    <div style={styles.inner}>\n      <div\n        style={styles.ribbon}\n        ref={targetRef}\n      >\n        {children}\n      </div>\n    </div>\n  </section>\n);\n\nexport const enhance = pureEnhance('Ribbon', {\n  hocs: [\n    deepLink,\n  ],\n  hooks: [\n    withProps(() => {\n      const targetRef = useRef({});\n\n      if (process.env.NODE_ENV !== 'production') {\n        useLayoutEffect(() => {\n        // when backstop runs on ribbons, this lets us filter out a lot of false\n        // positives and a lot of race condition fails by only initialising\n        // the snapshot once loading has finished + a delay to wait for fonts etc to load\n        // eslint-disable-next-line\n          setTimeout(() => {\n            // eslint-disable-next-line\n            console.log('BACKSTOP_RIBBON_READY');\n          }, 3000);\n        }, [ targetRef.current ]);\n      }\n\n      return {\n        targetRef,\n      };\n    }),\n    withBreakpointsHook,\n    withProps(stylesheet),\n  ],\n});\n\nexport default enhance(PureRibbon);\n","import pureEnhance from '@ux/pure-enhance';\nimport withRibbonImpression from 'presentation/hocs/withRibbonImpression';\n\nimport Ribbon from './Ribbon';\n\nconst enhance = pureEnhance('ConnectedRibbon', {\n  hocs: [ withRibbonImpression ],\n});\n\nexport default enhance(Ribbon);\n","import Ribbon from './ConnectedRibbon';\nimport { Flush } from './Ribbon';\n\nexport { Flush };\n\nexport default Ribbon;\n","import * as r from 'ramda';\nimport { BreakpointProps } from '@ux/responsive';\n\ninterface anyProps extends BreakpointProps {\n  [key: string]: any,\n}\nexport default (props: anyProps) => r.pick([\n  'isMinSm',\n  'isMinMd',\n  'isMinLg',\n  'isMinXl',\n], props) as anyProps;\n","import React from 'react';\nimport * as r from 'ramda';\n\nexport default (BaseComponent: any) => r.ifElse(\n  r.prop('visible'),\n  (props) => <BaseComponent {...props}/>,\n  (props) => (\n    <div style={{ display: 'none' }}>\n      <BaseComponent {...props}/>\n    </div>\n  ),\n);\n"],"sourceRoot":""}