{"version":3,"file":"responsive.component-GFQwZ6dd.js","sources":["../../../app/javascript/components/card/styles.ts","../../../app/javascript/components/card/card.component.tsx","../../../app/javascript/hooks/windowWidth.ts","../../../app/javascript/components/responsive/responsive.component.tsx"],"sourcesContent":["import styled from 'styled-components'\n\nimport { textOverflowEllipses } from '~/styles/mixins'\nimport { font } from '~/styles/utils'\n\nexport const Header = styled.header`\n  padding-bottom: 18px;\n  display: flex;\n  justify-content: space-between;\n  align-items: flex-start;\n\n  &.with-separator {\n    border-bottom: 1px solid $cool-grey;\n  }\n\n  .amp-card-title {\n    ${font('bold')};\n    ${textOverflowEllipses};\n    font-size: 24px;\n    text-transform: uppercase;\n    margin: 0;\n    margin-right: 1rem;\n  }\n\n  .amp-card-icon {\n    margin-right: 5px;\n  }\n`\n","import classNames from 'classnames'\nimport React from 'react'\nimport './card.scss'\n\nimport type { ReactNode } from 'react'\n\ntype Props = {\n  children: ReactNode\n  className?: string\n  elementName?: 'div' | 'li'\n  style?: object\n  withBorder?: boolean\n  id?: string\n  'data-testid'?: string\n}\n\nexport default function Card({\n  children,\n  className,\n  elementName = 'div',\n  style,\n  withBorder = false,\n  'data-testid': dataTestId,\n  id,\n}: Props) {\n  const Element = elementName\n  return (\n    <Element\n      data-testid={dataTestId}\n      className={classNames('amp-card', className, {\n        'with-border': withBorder,\n      })}\n      style={style}\n      id={id}\n    >\n      {children}\n    </Element>\n  )\n}\n","import { useState, useEffect } from 'react'\n\nconst useWindowWidth = () => {\n  const [windowWidth, setWindowWidth] = useState(window.innerWidth)\n\n  useEffect(() => {\n    const updateWindowWidth = () => {\n      setWindowWidth(window.innerWidth)\n    }\n\n    window.addEventListener('resize', updateWindowWidth)\n\n    return () => {\n      window.removeEventListener('resize', updateWindowWidth)\n    }\n  }, [])\n\n  return windowWidth\n}\n\nexport default useWindowWidth\n","import React from 'react'\n\nimport { DESKTOP_WIDTH } from '~/config'\nimport useWindowWidth from '~/hooks/windowWidth'\n\nimport type { Props } from './responsive.types'\n\n/**\n * In the event that Mobile and NotMobile have multiple children or children which are not themselves\n * React Elements (e.g. strings), children need to be wrapped in a single parent node. A React Fragment satisfies\n * this requirement without altering DOM structure.\n */\n\nexport const Mobile = ({ children }: Props) => {\n  const windowWidth = useWindowWidth()\n  if (windowWidth >= DESKTOP_WIDTH || !children) return null\n\n  return <>{children}</>\n}\n\nexport const NotMobile = ({ children }: Props) => {\n  const windowWidth = useWindowWidth()\n  if (windowWidth < DESKTOP_WIDTH || !children) return null\n\n  return <>{children}</>\n}\n"],"names":["Header","styled","font","textOverflowEllipses","Card","children","className","elementName","style","withBorder","dataTestId","id","Element","React","classNames","useWindowWidth","windowWidth","setWindowWidth","useState","useEffect","updateWindowWidth","Mobile","DESKTOP_WIDTH","NotMobile"],"mappings":"gIAKO,MAAMA,EAASC,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,MAWvBC,EAAK,MAAM,CAAC;AAAA,MACZC,CAAoB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,ECD1B,SAAwBC,EAAK,CAC3B,SAAAC,EACA,UAAAC,EACA,YAAAC,EAAc,MACd,MAAAC,EACA,WAAAC,EAAa,GACb,cAAeC,EACf,GAAAC,CACF,EAAU,CACR,MAAMC,EAAUL,EAEd,OAAAM,EAAA,cAACD,EAAA,CACC,cAAaF,EACb,UAAWI,EAAW,WAAYR,EAAW,CAC3C,cAAeG,CAAA,CAChB,EACD,MAAAD,EACA,GAAAG,CAAA,EAECN,CACH,CAEJ,CCpCA,MAAMU,EAAiB,IAAM,CAC3B,KAAM,CAACC,EAAaC,CAAc,EAAIC,EAAAA,SAAS,OAAO,UAAU,EAEhEC,OAAAA,EAAAA,UAAU,IAAM,CACd,MAAMC,EAAoB,IAAM,CAC9BH,EAAe,OAAO,UAAU,CAClC,EAEO,cAAA,iBAAiB,SAAUG,CAAiB,EAE5C,IAAM,CACJ,OAAA,oBAAoB,SAAUA,CAAiB,CACxD,CACF,EAAG,EAAE,EAEEJ,CACT,ECLaK,EAAS,CAAC,CAAE,SAAAhB,KACHU,EAAe,GAChBO,GAAiB,CAACjB,EAAiB,qCAE5CA,CAAS,EAGRkB,EAAY,CAAC,CAAE,SAAAlB,KACNU,EAAe,EACjBO,GAAiB,CAACjB,EAAiB,qCAE3CA,CAAS"}