{"version":3,"sources":["webpack:///./src/helpers/media.ts","webpack:///./src/helpers/ssr.ts","webpack:///./src/hooks/useIntersectionObserver.ts","webpack:///./src/hooks/useInView.ts","webpack:///./src/stories/Components/Cards/Card/Card.tsx","webpack:///./img/brand/true-blue.svg","webpack:///./src/helpers/icons.tsx","webpack:///./src/hooks/useMedia.ts","webpack:///./src/helpers/animation.ts","webpack:///./src/helpers/grids.ts","webpack:///./src/core/enums.ts","webpack:///./src/stories/Components/Cards/Card/Card.styles.ts"],"names":["Device","from","size","until","isSSR","window","document","useIntersectionObserver","callback","options","observerRef","useRef","rootRef","elementRef","useEffect","current","IntersectionObserver","root","observe","disconnect","useInView","reverse","isEditMode","useState","inView","setInView","entries","isIntersecting","Card","props","threshold","delayInterval","rowItems","undefined","index","React","createElement","CardStyles","href","url","ref","delay","Image","alt","title","loading","src","ImageTransform","imageUrl","width","entropyCrop","getIcon","icon","height","fill","brand","blue","base","wrapper","Icon","Title","subTitle","length","SubTitle","Wrapper","Fragment","None","TrueBlue","style","stroke","maxWidth","TrueBlueUrl","useMedia","queries","values","defaultValue","mediaQueryLists","map","query","matchMedia","getValue","findIndex","mql","matches","value","setValue","handler","forEach","addListener","removeListener","easeInOutCubic","keyframes","fadeIn","duration","easingFunc","css","fadeInUp","amount","slideUp","order","animateOnExit","baseFixed","Tablet","SitePadding","TabletLarge","DesktopSmall","DesktopLarge","SitePaddingBreakoutLeft","SitePaddingBreakoutRight","SitePaddingBreakout","Default","Fixed","MediaType","Tag","styled","span","fonts","helvetica","img","animation","h1","h2","a","white","MobileLarge","Desktop"],"mappings":"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","file":"4-b5b435eeb7b02bdbf3f4.js","sourcesContent":["export var Device;\r\n(function (Device) {\r\n    Device[Device[\"MobileSmall\"] = 320] = \"MobileSmall\";\r\n    Device[Device[\"Mobile\"] = 375] = \"Mobile\";\r\n    Device[Device[\"MobileLarge\"] = 480] = \"MobileLarge\";\r\n    Device[Device[\"Tablet\"] = 768] = \"Tablet\";\r\n    Device[Device[\"TabletLarge\"] = 1024] = \"TabletLarge\";\r\n    Device[Device[\"DesktopSmall\"] = 1280] = \"DesktopSmall\";\r\n    Device[Device[\"Desktop\"] = 1366] = \"Desktop\";\r\n    Device[Device[\"DesktopLarge\"] = 1600] = \"DesktopLarge\";\r\n    Device[Device[\"ActualDesktop\"] = 1920] = \"ActualDesktop\";\r\n    Device[Device[\"DesktopXL\"] = 2560] = \"DesktopXL\";\r\n})(Device || (Device = {}));\r\nexport function from(size) {\r\n    return `(min-width: ${size}px)`;\r\n}\r\nexport function until(size) {\r\n    return `(max-width: ${size - 1}px)`;\r\n}\r\n","export const isSSR = !(typeof window != 'undefined' && window.document);\r\n","import { useEffect, useRef } from 'react';\r\n/**\r\n * Use the IntersectionObserver to track visibility of an element in the viewport.\r\n * @param {IntersectionObserverCallback} callback\r\n * @param {IntersectionObserverInit} options\r\n * @returns {UseIntersectionObserverReturn}\r\n */\r\nfunction useIntersectionObserver(callback, options = {}) {\r\n    const observerRef = useRef(null);\r\n    const rootRef = useRef(null);\r\n    const elementRef = useRef(null);\r\n    useEffect(() => {\r\n        if (!elementRef.current) {\r\n            return undefined;\r\n        }\r\n        observerRef.current = new IntersectionObserver(callback, {\r\n            root: rootRef.current,\r\n            ...options,\r\n        });\r\n        observerRef.current.observe(elementRef.current);\r\n        return () => {\r\n            if (observerRef.current === null) {\r\n                return;\r\n            }\r\n            observerRef.current.disconnect();\r\n        };\r\n    }, [callback, options]);\r\n    return { elementRef, observerRef, rootRef };\r\n}\r\nexport default useIntersectionObserver;\r\n","import { useState } from 'react';\r\nimport useIntersectionObserver from './useIntersectionObserver';\r\nexport function useInView(options, reverse = false, isEditMode = false) {\r\n    const [inView, setInView] = useState(false);\r\n    const { elementRef } = useIntersectionObserver((entries) => {\r\n        if (entries[0].isIntersecting) {\r\n            setInView(true);\r\n        }\r\n        else if (reverse === true) {\r\n            setInView(false);\r\n        }\r\n    }, options);\r\n    return [elementRef, isEditMode ? true : inView];\r\n}\r\n","import { getIcon } from '@helpers/icons';\r\nimport { useInView } from '@hooks/useInView';\r\nimport { brand } from '@tti/brand-empire';\r\nimport ImageTransform from '@tti/image-transform';\r\nimport React from 'react';\r\nimport { CardStyles } from './Card.styles';\r\nconst Card = (props) => {\r\n    const [elementRef, inView] = useInView({ threshold: 0.3 });\r\n    const delayInterval = props.rowItems && props.index !== undefined ? (props.index % props.rowItems) * 100 : 0;\r\n    return (React.createElement(CardStyles.Card, { href: props.url, ref: elementRef, inView: inView, delay: delayInterval },\r\n        React.createElement(CardStyles.Image, { alt: props.title, loading: \"lazy\", src: `${new ImageTransform(props.imageUrl).width(600).entropyCrop().url}`, inView: inView }),\r\n        getIcon(props.icon, { width: 87, height: 62, fill: brand.blue.base, wrapper: CardStyles.Icon }),\r\n        React.createElement(CardStyles.Title, { inView: inView },\r\n            React.createElement(\"span\", null, props.title)),\r\n        props.subTitle && props.subTitle.length > 0 ? (React.createElement(CardStyles.SubTitle, { inView: inView },\r\n            React.createElement(\"span\", null, props.subTitle))) : null));\r\n};\r\nexport default Card;\r\n","export default __webpack_public_path__ + \"5f2ac44612accc36ad0b2c8bf3d2119b.svg\";","import { Icon } from '@core/enums';\r\nimport React, { Fragment } from 'react';\r\nimport TrueBlueUrl from '!file-loader!@img/brand/true-blue.svg';\r\nexport function getIcon(icon, options) {\r\n    const Wrapper = options?.wrapper === undefined ? Fragment : options.wrapper;\r\n    switch (icon) {\r\n        default:\r\n        case Icon.None:\r\n            return null;\r\n        case Icon.TrueBlue:\r\n            return (React.createElement(Wrapper, null,\r\n                React.createElement(\"svg\", { width: options?.width, height: options?.height, style: { stroke: options?.stroke, fill: options?.fill, maxWidth: '100%' } },\r\n                    React.createElement(\"use\", { href: `${TrueBlueUrl}#icon` }))));\r\n    }\r\n}\r\n","import { isSSR } from '@helpers/ssr';\r\nimport { useEffect, useState } from 'react';\r\n/**\r\n * Store a value in state based on the specified media queries.\r\n * @param {Array<string>} queries\r\n * @param {Array<T>} values\r\n * @param {T} defaultValue\r\n */\r\nfunction useMedia(queries, values, defaultValue) {\r\n    // Avoid error with SSR.\r\n    if (isSSR) {\r\n        return defaultValue;\r\n    }\r\n    // Array containing a media query list for each query\r\n    const mediaQueryLists = queries.map((query) => window.matchMedia(query));\r\n    // Function that gets value based on matching media query\r\n    const getValue = () => {\r\n        // Get index of first media query that matches\r\n        const index = mediaQueryLists.findIndex((mql) => mql.matches);\r\n        // Return related value or defaultValue if none\r\n        return typeof values[index] !== 'undefined' ? values[index] : defaultValue;\r\n    };\r\n    // State and setter for matched value\r\n    const [value, setValue] = useState(getValue);\r\n    useEffect(() => {\r\n        // Event listener callback\r\n        // Note: By defining getValue outside of useEffect we ensure that it has ...\r\n        // ... current values of hook args (as this hook callback is created once on mount).\r\n        const handler = () => setValue(getValue);\r\n        // Set a listener for each media query with above handler as callback.\r\n        mediaQueryLists.forEach((mql) => mql.addListener(handler));\r\n        // Remove listeners on cleanup\r\n        return () => mediaQueryLists.forEach((mql) => mql.removeListener(handler));\r\n    }, []); // Empty array ensures effect is only run on mount and unmount\r\n    return value;\r\n}\r\nexport default useMedia;\r\n","import { css, keyframes } from 'styled-components';\r\nconst easeInOutCubic = 'cubic-bezier(0.645, 0.045, 0.355, 1)';\r\nexport default {\r\n    easeInOutCubic,\r\n};\r\nconst reset = keyframes `\r\n  100% {\r\n    transform: translate(0%, 0%);\r\n    opacity: 1;\r\n  }\r\n`;\r\nexport function fadeInLeft(amount, duration, delay, easingFunc) {\r\n    return css `\r\n    opacity: 0;\r\n    transform: translateX(-${amount}px);\r\n    animation: ${reset} ${duration}ms ${delay}ms ${easingFunc} forwards;\r\n  `;\r\n}\r\nexport function fadeIn(inView, duration, delay, easingFunc) {\r\n    return css `\r\n    transition: opacity ${duration}ms ${delay}ms ${easingFunc};\r\n\r\n    ${inView\r\n        ? css `\r\n          opacity: 1;\r\n        `\r\n        : css `\r\n          opacity: 0;\r\n        `}\r\n  `;\r\n}\r\nexport function fadeInUp(inView, amount, duration, delay, easingFunc) {\r\n    return css `\r\n    transition: opacity ${duration}ms ${delay}ms ${easingFunc}, transform ${duration}ms ${delay}ms ${easingFunc};\r\n\r\n    ${inView\r\n        ? css `\r\n          opacity: 1;\r\n          transform: none;\r\n        `\r\n        : css `\r\n          opacity: 0;\r\n          transform: translateY(${amount}px);\r\n        `}\r\n  `;\r\n}\r\nexport function slideUp(inView, order, delay = 300, easingFunc = easeInOutCubic, animateOnExit = true) {\r\n    if (inView) {\r\n        return css `\r\n      transform: translateY(0%);\r\n      transition: transform 650ms ${delay + order * 100}ms ${easingFunc};\r\n    `;\r\n    }\r\n    else if (animateOnExit) {\r\n        return css `\r\n      transform: translateY(120%);\r\n      transition: transform 650ms ${delay + order * 100}ms ${easingFunc};\r\n    `;\r\n    }\r\n    else {\r\n        return css `\r\n      transform: translateY(120%);\r\n    `;\r\n    }\r\n}\r\nexport function greyscaleImgFade(inView, duration, delay, filterDelay, easingFunc) {\r\n    return css `\r\n    transition: opacity ${duration}ms ${delay}ms ${easingFunc}, filter ${duration}ms ${filterDelay}ms ${easingFunc};\r\n\r\n    ${inView\r\n        ? css `\r\n          opacity: 1;\r\n          filter: grayscale(0);\r\n        `\r\n        : css `\r\n          opacity: 0;\r\n          filter: grayscale(1);\r\n        `}\r\n  `;\r\n}\r\n","import { css } from 'styled-components';\r\nimport { Device, from } from './media';\r\nconst base = css `\r\n  display: grid;\r\n  grid-gap: 16px;\r\n  width: 100%;\r\n  grid-template-columns: repeat(12, 1fr);\r\n`;\r\nconst baseFixed = css `\r\n  display: grid;\r\n  grid-gap: 16px;\r\n  width: 100%;\r\n  // 78px being the width of one column at 375 of the base grid above\r\n  grid-auto-columns: 78px;\r\n\r\n  @media ${from(Device.Tablet)} {\r\n    // 117px being the width of one column at 1920 of the base grid above\r\n    grid-auto-columns: 117px;\r\n  }\r\n`;\r\nexport const SitePadding = css `\r\n  padding-left: 18px;\r\n  padding-right: 18px;\r\n\r\n  @media ${from(Device.Tablet)} {\r\n    padding-left: 40px;\r\n    padding-right: 40px;\r\n  }\r\n\r\n  @media ${from(Device.TabletLarge)} {\r\n    padding-left: 70px;\r\n    padding-right: 70px;\r\n  }\r\n\r\n  @media ${from(Device.DesktopSmall)} {\r\n    padding-left: 130px;\r\n    padding-right: 130px;\r\n  }\r\n\r\n  @media ${from(Device.DesktopLarge)} {\r\n    padding-left: 170px;\r\n    padding-right: 170px;\r\n  }\r\n`;\r\nconst SitePaddingBreakoutLeft = css `\r\n  left: 0;\r\n  right: 0px;\r\n  grid-column: span 12;\r\n  margin-left: -18px;\r\n\r\n  @media ${from(Device.Tablet)} {\r\n    margin-left: -40px;\r\n  }\r\n\r\n  @media ${from(Device.TabletLarge)} {\r\n    margin-left: -70px;\r\n  }\r\n\r\n  @media ${from(Device.DesktopSmall)} {\r\n    margin-left: -130px;\r\n  }\r\n\r\n  @media ${from(Device.DesktopLarge)} {\r\n    margin-left: -170px;\r\n  }\r\n`;\r\nconst SitePaddingBreakoutRight = css `\r\n  left: 0;\r\n  right: 0px;\r\n  grid-column: span 12;\r\n  margin-right: -18px;\r\n\r\n  @media ${from(Device.Tablet)} {\r\n    margin-right: -40px;\r\n  }\r\n\r\n  @media ${from(Device.TabletLarge)} {\r\n    margin-right: -70px;\r\n  }\r\n\r\n  @media ${from(Device.DesktopSmall)} {\r\n    margin-right: -130px;\r\n  }\r\n\r\n  @media ${from(Device.DesktopLarge)} {\r\n    margin-right: -170px;\r\n  }\r\n`;\r\nconst SitePaddingBreakout = css `\r\n  left: 0;\r\n  right: 0px;\r\n  grid-column: span 12;\r\n  margin-left: -18px;\r\n  margin-right: -18px;\r\n\r\n  @media ${from(Device.Tablet)} {\r\n    margin-left: -40px;\r\n    margin-right: -40px;\r\n  }\r\n\r\n  @media ${from(Device.TabletLarge)} {\r\n    margin-left: -70px;\r\n    margin-right: -70px;\r\n  }\r\n\r\n  @media ${from(Device.DesktopSmall)} {\r\n    margin-left: -130px;\r\n    margin-right: -130px;\r\n  }\r\n\r\n  @media ${from(Device.DesktopLarge)} {\r\n    margin-left: -170px;\r\n    margin-right: -170px;\r\n  }\r\n`;\r\nconst Default = css `\r\n  ${base};\r\n  ${SitePadding};\r\n`;\r\nconst Fixed = css `\r\n  ${baseFixed};\r\n`;\r\nexport default {\r\n    Default,\r\n    Fixed,\r\n    SitePaddingBreakout,\r\n    SitePaddingBreakoutLeft,\r\n    SitePaddingBreakoutRight,\r\n    base,\r\n};\r\n","export var MediaType;\r\n(function (MediaType) {\r\n    MediaType[MediaType[\"Image\"] = 0] = \"Image\";\r\n    MediaType[MediaType[\"Video\"] = 1] = \"Video\";\r\n})(MediaType || (MediaType = {}));\r\nexport var Icon;\r\n(function (Icon) {\r\n    Icon[Icon[\"None\"] = 0] = \"None\";\r\n    Icon[Icon[\"TrueBlue\"] = 1] = \"TrueBlue\";\r\n})(Icon || (Icon = {}));\r\n","import animation, { fadeIn, slideUp } from '@helpers/animation';\r\nimport { Device, from, until } from '@helpers/media';\r\nimport { brand, fonts } from '@tti/brand-empire';\r\nimport styled from 'styled-components';\r\nconst Tag = styled.span `\r\n  ${fonts.helvetica['57-condensed']};\r\n  font-size: 20px;\r\n  height: 20px;\r\n  display: block;\r\n\r\n  display: -webkit-box;\r\n  -webkit-line-clamp: 1;\r\n  -webkit-box-orient: vertical;\r\n  overflow: hidden;\r\n  text-overflow: ellipsis;\r\n\r\n  @media ${from(Device.TabletLarge)} {\r\n    span {\r\n      ${({ inView }) => slideUp(inView, 1)};\r\n    }\r\n  }\r\n`;\r\nconst Image = styled.img `\r\n  min-height: 170px;\r\n  max-height: 250px;\r\n  margin: 40px 0px;\r\n  object-fit: scale-down;\r\n\r\n  @media ${from(Device.TabletLarge)} {\r\n    ${({ inView }) => fadeIn(inView, 650, 450, animation.easeInOutCubic)};\r\n  }\r\n`;\r\nconst Title = styled.h1 `\r\n  ${fonts.helvetica['77-condensed-bold']};\r\n  font-size: 22px;\r\n\r\n  display: -webkit-box;\r\n  -webkit-line-clamp: 2;\r\n  -webkit-box-orient: vertical;\r\n  overflow: hidden;\r\n  text-overflow: ellipsis;\r\n\r\n  @media ${from(Device.TabletLarge)} {\r\n    span {\r\n      ${({ inView }) => slideUp(inView, 3)};\r\n    }\r\n  }\r\n`;\r\nconst SubTitle = styled.h2 `\r\n  ${fonts.helvetica['57-condensed']};\r\n  margin-top: 20px;\r\n  font-size: 16px;\r\n  height: 34px;\r\n\r\n  display: -webkit-box;\r\n  -webkit-line-clamp: 2;\r\n  -webkit-box-orient: vertical;\r\n  overflow: hidden;\r\n  text-overflow: ellipsis;\r\n\r\n  @media ${from(Device.TabletLarge)} {\r\n    font-size: 19px;\r\n    height: 38px;\r\n    margin-top: 50px;\r\n\r\n    span {\r\n      ${({ inView }) => slideUp(inView, 4)};\r\n    }\r\n  }\r\n`;\r\nconst Icon = styled.span `\r\n  display: inline-block;\r\n  margin-bottom: 10px;\r\n\r\n  @media ${until(Device.TabletLarge)} {\r\n    margin-bottom: 10px;\r\n    width: 60px;\r\n  }\r\n`;\r\nconst Card = styled.a `\r\n  background-color: ${brand.white};\r\n  padding: 16px;\r\n  text-align: center;\r\n  color: inherit;\r\n  transition: transform 375ms ${animation.easeInOutCubic}, box-shadow 375ms ${animation.easeInOutCubic};\r\n  min-height: 500px;\r\n\r\n  display: flex;\r\n  flex-direction: column;\r\n  justify-content: space-between;\r\n  align-items: center;\r\n\r\n  @media ${from(Device.MobileLarge)} {\r\n    grid-column: span 6;\r\n  }\r\n\r\n  @media ${from(Device.TabletLarge)} {\r\n    padding: 24px 18px;\r\n\r\n    ${({ inView, delay }) => fadeIn(inView, 650, delay, animation.easeInOutCubic)};\r\n  }\r\n\r\n  @media ${from(Device.Desktop)} {\r\n    padding: 31px 18px;\r\n  }\r\n\r\n  ${Icon} {\r\n    @media ${from(Device.TabletLarge)} {\r\n      ${({ inView }) => fadeIn(inView, 650, 450, animation.easeInOutCubic)};\r\n    }\r\n  }\r\n`;\r\nexport const CardStyles = {\r\n    Card,\r\n    Tag,\r\n    Image,\r\n    Icon,\r\n    Title,\r\n    SubTitle,\r\n};\r\n"],"sourceRoot":""}