@codecademy/brand 4.0.0-alpha.a575634273.0 → 4.0.0-alpha.b03641fd89.0

package/dist/Banner/EnhancedBanner.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"EnhancedBanner.js","names":["EnhancedBanner: React.FC<EnhancedBannerProps>","variant"],"sources":["../../src/Banner/EnhancedBanner.tsx"],"sourcesContent":["import {\n  Box,\n  FillButton,\n  FlexBox,\n  IconButton,\n  Markdown,\n  Text,\n} from '@codecademy/gamut';\nimport { MiniDeleteIcon } from '@codecademy/gamut-icons';\nimport { Background, BackgroundProps, css } from '@codecademy/gamut-styles';\nimport { useTheme } from '@emotion/react';\nimport styled from '@emotion/styled';\nimport { useMemo } from 'react';\n\nimport { BannerVariant } from '.';\nimport { CountdownTimer } from './CountdownTimer';\n\nexport interface EnhancedBannerProps\n  extends Omit<BackgroundProps, 'bg' | 'containerType'> {\n  variant?: BannerVariant | null;\n  onClose?: () => void;\n  onCtaClick?: () => void;\n  ctaAriaLabel?: string;\n  header?: string | null;\n  subheader?: string | null;\n  cta?: { title: string; href: string } | null;\n  countdownTo?: string | null;\n  onCountdownExpire?: () => void;\n}\n\nconst bannerVariants = {\n  navy: 'navy',\n  yellow: 'yellow',\n  subtle: 'background-hover',\n} as const;\n\nconst bannerStyles = {\n  width: '100%',\n  p: 4,\n  display: 'grid',\n  gridTemplateColumns: '2rem minmax(0, 1fr) 2rem',\n  gridTemplateAreas: \"'empty content close'\",\n  columnGap: 8,\n  alignItems: 'center',\n  textAlign: 'center',\n} as const;\n\nconst BannerBg = styled(Background)(css(bannerStyles));\nconst BannerBox = styled(Box)(css(bannerStyles));\n\nconst StyledMarkdown = styled(Markdown)`\n  overflow: hidden;\n  text-overflow: ellipsis;\n  display: -webkit-box;\n  -webkit-line-clamp: 2;\n  -webkit-box-orient: vertical;\n`;\n\nconst StyledTitle = styled(StyledMarkdown)`\n  p {\n    font-size: 22px;\n    font-weight: 700;\n  }\n`;\n\nconst StyledSubheader = styled(StyledMarkdown)`\n  p {\n    font-size: 16px;\n  }\n`;\n\nexport const EnhancedBanner: React.FC<EnhancedBannerProps> = ({\n  variant = 'navy',\n  onClose,\n  onCtaClick,\n  ctaAriaLabel,\n  header,\n  subheader,\n  cta,\n  countdownTo,\n  onCountdownExpire,\n  ...rest\n}) => {\n  const validCta = useMemo(\n    () => (cta && cta.title && cta.href ? cta : undefined),\n    [cta]\n  );\n  const { mode } = useTheme();\n  const isDarkMode = mode === 'dark';\n\n  if (!header) return null;\n\n  const renderEnhanced = () => {\n    const textBlock = (\n      <Box textAlign={{ _: 'center', md: 'left' }} width=\"100%\">\n        <StyledTitle text={header} />\n        {subheader && <StyledSubheader text={subheader} />}\n      </Box>\n    );\n\n    return (\n      <FlexBox\n        flexDirection={{ _: 'column', md: 'row' }}\n        alignItems=\"center\"\n        justifyContent=\"center\"\n        width=\"100%\"\n        p={8}\n        gap={{ _: 16, md: 40 }}\n      >\n        <FlexBox gap={16} alignItems=\"center\">\n          {countdownTo && (\n            <CountdownTimer\n              targetDate={countdownTo}\n              onExpire={onCountdownExpire}\n            />\n          )}\n          {validCta && (\n            <Box display={{ _: 'flex', md: 'none' }} ml={0}>\n              <FillButton\n                variant=\"primary\"\n                href={validCta.href}\n                onClick={onCtaClick}\n              >\n                {validCta.title}\n              </FillButton>\n            </Box>\n          )}\n        </FlexBox>\n\n        <Text maxWidth={{ _: '100%', md: '50%' }}>{textBlock}</Text>\n\n        {validCta && (\n          <Box display={{ _: 'none', md: 'flex' }}>\n            <FillButton\n              variant={isDarkMode ? 'secondary' : 'primary'}\n              href={validCta.href}\n              onClick={onCtaClick}\n            >\n              {validCta.title}\n            </FillButton>\n          </Box>\n        )}\n      </FlexBox>\n    );\n  };\n\n  const backgroundVariant = isDarkMode ? 'yellow' : variant;\n  const Container = backgroundVariant === 'subtle' ? BannerBox : BannerBg;\n\n  return (\n    <Container {...rest} bg={bannerVariants[backgroundVariant ?? 'navy']}>\n      <Box gridArea=\"content\" fontSize=\"inherit\">\n        {renderEnhanced()}\n      </Box>\n      {onClose && (\n        <Box gridArea=\"close\" alignSelf=\"center\">\n          <IconButton\n            variant=\"secondary\"\n            size=\"small\"\n            icon={MiniDeleteIcon}\n            onClick={onClose}\n            tip=\"Close banner\"\n            tipProps={{ alignment: 'left-center' }}\n          />\n        </Box>\n      )}\n    </Container>\n  );\n};\n"],"mappings":";;;;;;;;;;AA8BA,MAAM,iBAAiB;CACrB,MAAM;CACN,QAAQ;CACR,QAAQ;CACT;AAED,MAAM,eAAe;CACnB,OAAO;CACP,GAAG;CACH,SAAS;CACT,qBAAqB;CACrB,mBAAmB;CACnB,WAAW;CACX,YAAY;CACZ,WAAW;CACZ;AAED,MAAM,WAAW,OAAO,WAAW,CAAC,IAAI,aAAa,CAAC;AACtD,MAAM,YAAY,OAAO,IAAI,CAAC,IAAI,aAAa,CAAC;AAEhD,MAAM,iBAAiB,OAAO,SAAS;;;;;;;AAQvC,MAAM,cAAc,OAAO,eAAe;;;;;;AAO1C,MAAM,kBAAkB,OAAO,eAAe;;;;;AAM9C,MAAaA,kBAAiD,EAC5D,qBAAU,QACV,SACA,YACA,cACA,QACA,WACA,KACA,aACA,mBACA,GAAG,WACC;CACJ,MAAM,WAAW,cACR,OAAO,IAAI,SAAS,IAAI,OAAO,MAAM,QAC5C,CAAC,IAAI,CACN;CACD,MAAM,EAAE,SAAS,UAAU;CAC3B,MAAM,aAAa,SAAS;AAE5B,KAAI,CAAC,OAAQ,QAAO;CAEpB,MAAM,uBAAuB;EAC3B,MAAM,YACJ,qBAAC;GAAI,WAAW;IAAE,GAAG;IAAU,IAAI;IAAQ;GAAE,OAAM;cACjD,oBAAC,eAAY,MAAM,SAAU,EAC5B,aAAa,oBAAC,mBAAgB,MAAM,YAAa;IAC9C;AAGR,SACE,qBAAC;GACC,eAAe;IAAE,GAAG;IAAU,IAAI;IAAO;GACzC,YAAW;GACX,gBAAe;GACf,OAAM;GACN,GAAG;GACH,KAAK;IAAE,GAAG;IAAI,IAAI;IAAI;;IAEtB,qBAAC;KAAQ,KAAK;KAAI,YAAW;gBAC1B,eACC,oBAAC;MACC,YAAY;MACZ,UAAU;OACV,EAEH,YACC,oBAAC;MAAI,SAAS;OAAE,GAAG;OAAQ,IAAI;OAAQ;MAAE,IAAI;gBAC3C,oBAAC;OACC,SAAQ;OACR,MAAM,SAAS;OACf,SAAS;iBAER,SAAS;QACC;OACT;MAEA;IAEV,oBAAC;KAAK,UAAU;MAAE,GAAG;MAAQ,IAAI;MAAO;eAAG;MAAiB;IAE3D,YACC,oBAAC;KAAI,SAAS;MAAE,GAAG;MAAQ,IAAI;MAAQ;eACrC,oBAAC;MACC,SAAS,aAAa,cAAc;MACpC,MAAM,SAAS;MACf,SAAS;gBAER,SAAS;OACC;MACT;;IAEA;;CAId,MAAM,oBAAoB,aAAa,WAAWC;AAGlD,QACE,qBAHgB,sBAAsB,WAAW,YAAY;EAGlD,GAAI;EAAM,IAAI,eAAe,qBAAqB;aAC3D,oBAAC;GAAI,UAAS;GAAU,UAAS;aAC9B,gBAAgB;IACb,EACL,WACC,oBAAC;GAAI,UAAS;GAAQ,WAAU;aAC9B,oBAAC;IACC,SAAQ;IACR,MAAK;IACL,MAAM;IACN,SAAS;IACT,KAAI;IACJ,UAAU,EAAE,WAAW,eAAe;KACtC;IACE;GAEE"}

package/dist/Banner/index.d.ts

@@ -21,4 +21,5 @@ interface BannerProps extends Omit<BackgroundProps, 'bg' | 'containerType'> {
 }
 declare const Banner: React$1.FC<BannerProps>;
 //#endregion
-export { Banner, BannerProps, BannerVariant };
+export { Banner, BannerProps, BannerVariant };
+//# sourceMappingURL=index.d.ts.map

package/dist/Banner/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","names":[],"sources":["../../src/Banner/index.tsx"],"sourcesContent":[],"mappings":";;;;;KAOY,aAAA,gBAA6B;cACnC;EADM,SAAA,IAAA,EAAA,MAAa;EACnB,SAAA,MAAA,EAII,QAAA;EAOO,SAAA,MACf,EAAA,kBAAA;CAAa;AACH,UAFK,WAAA,SACP,IACE,CADG,eACH,EAAA,IAAA,GAAA,eAAA,CAAA,CAAA;EAEA,QAAA,EAFA,SAEA,GAAA,MAAA;EAHF;EAAI,OAAA,CAAA,EAGF,aAHE,GAAA,IAAA;EAkDD;;;;;;cAAA,QAAQ,OAAA,CAAM,GAAG"}

package/dist/Banner/index.js

@@ -77,4 +77,5 @@ const Banner = ({ children, ctaAriaLabel, variant: variant$1 = "navy", onCtaClic
 };
 
 //#endregion
-export { Banner };
+export { Banner };
+//# sourceMappingURL=index.js.map

package/dist/Banner/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":["variant","Banner: React.FC<BannerProps>","safeVariant: BannerVariant"],"sources":["../../src/Banner/index.tsx"],"sourcesContent":["import { Box, IconButton, Markdown, TextButton } from '@codecademy/gamut';\nimport { MiniDeleteIcon } from '@codecademy/gamut-icons';\nimport { Background, BackgroundProps, css } from '@codecademy/gamut-styles';\nimport styled from '@emotion/styled';\nimport { ReactNode, useMemo } from 'react';\nimport * as React from 'react';\n\nexport type BannerVariant = keyof typeof bannerVariants;\nconst bannerVariants = {\n  navy: 'navy',\n  yellow: 'yellow',\n  subtle: 'background-hover',\n} as const;\n\nconst isAllowedVariant = (\n  variant: string | undefined | null\n): variant is BannerVariant =>\n  Object.keys(bannerVariants).includes(variant as BannerVariant);\n\nexport interface BannerProps\n  extends Omit<BackgroundProps, 'bg' | 'containerType'> {\n  children: ReactNode | string;\n  /** Visual variation for banners, defaults to navy */\n  variant?: BannerVariant | null;\n  /**  Callback called when the user closes the banner. */\n  onClose?: () => void;\n  /** Call to action click callback */\n  onCtaClick?: () => void;\n  ctaAriaLabel?: string;\n}\n\nconst bannerStyles = {\n  width: '100%',\n  p: 4,\n  display: 'grid',\n  gridTemplateColumns: '2rem minmax(0, 1fr) 2rem',\n  gridTemplateAreas: \"'empty content close'\",\n  columnGap: 8,\n  alignItems: 'center',\n  textAlign: 'center',\n} as const;\n\nconst BannerContainerBackground = styled(Background)(css(bannerStyles));\n\nconst BannerContainerBox = styled(Box)(css(bannerStyles));\n\nconst BannerMarkdown = styled(Markdown)(css({ fontSize: 'inherit' }));\n\nconst bindBannerAnchor = (\n  onCtaClick?: BannerProps['onCtaClick'],\n  ctaAriaLabel?: string\n) => ({\n  allowedAttributes: ['href', 'target'],\n  component: TextButton,\n  processNode: (_node: unknown, props: { onClick?: () => void }) => (\n    <TextButton\n      {...props}\n      onClick={() => {\n        onCtaClick?.();\n        props?.onClick?.();\n      }}\n      mx={4}\n      size=\"small\"\n      target=\"_BLANK\"\n      aria-label={ctaAriaLabel}\n      display={{ _: 'block', xs: 'inline-flex' }}\n    />\n  ),\n});\n\nexport const Banner: React.FC<BannerProps> = ({\n  children,\n  ctaAriaLabel,\n  variant = 'navy',\n  onCtaClick,\n  onClose,\n  ...rest\n}) => {\n  const overrides = useMemo(\n    () => ({\n      a: bindBannerAnchor(onCtaClick, ctaAriaLabel),\n    }),\n    [onCtaClick, ctaAriaLabel]\n  );\n\n  // Contentful is unable to programmatically communicate what values it does/doesn't allow in these kinds of fields,\n  // which makes it difficult for us to ensure the Contentful configuration hasn't diverged from Gamut restrictions.\n  const safeVariant: BannerVariant = isAllowedVariant(variant)\n    ? variant\n    : 'navy';\n\n  const BannerContainer =\n    safeVariant === 'subtle' ? BannerContainerBox : BannerContainerBackground;\n\n  return (\n    <BannerContainer {...rest} bg={bannerVariants[safeVariant]}>\n      <Box gridArea=\"content\" fontSize=\"inherit\">\n        {typeof children === 'string' ? (\n          <BannerMarkdown\n            overrides={overrides}\n            text={children}\n            skipDefaultOverrides={{ a: true }}\n          />\n        ) : (\n          children\n        )}\n      </Box>\n      {onClose && (\n        <Box gridArea=\"close\" alignSelf=\"start\">\n          <IconButton\n            variant=\"secondary\"\n            size=\"small\"\n            icon={MiniDeleteIcon}\n            onClick={onClose}\n            tip=\"Close banner\"\n            tipProps={{ alignment: 'bottom-center', placement: 'floating' }}\n          />\n        </Box>\n      )}\n    </BannerContainer>\n  );\n};\n"],"mappings":";;;;;;;;AAQA,MAAM,iBAAiB;CACrB,MAAM;CACN,QAAQ;CACR,QAAQ;CACT;AAED,MAAM,oBACJ,cAEA,OAAO,KAAK,eAAe,CAAC,SAASA,UAAyB;AAchE,MAAM,eAAe;CACnB,OAAO;CACP,GAAG;CACH,SAAS;CACT,qBAAqB;CACrB,mBAAmB;CACnB,WAAW;CACX,YAAY;CACZ,WAAW;CACZ;AAED,MAAM,4BAA4B,OAAO,WAAW,CAAC,IAAI,aAAa,CAAC;AAEvE,MAAM,qBAAqB,OAAO,IAAI,CAAC,IAAI,aAAa,CAAC;AAEzD,MAAM,iBAAiB,OAAO,SAAS,CAAC,IAAI,EAAE,UAAU,WAAW,CAAC,CAAC;AAErE,MAAM,oBACJ,YACA,kBACI;CACJ,mBAAmB,CAAC,QAAQ,SAAS;CACrC,WAAW;CACX,cAAc,OAAgB,UAC5B,oBAAC;EACC,GAAI;EACJ,eAAe;AACb,iBAAc;AACd,UAAO,WAAW;;EAEpB,IAAI;EACJ,MAAK;EACL,QAAO;EACP,cAAY;EACZ,SAAS;GAAE,GAAG;GAAS,IAAI;GAAe;GAC1C;CAEL;AAED,MAAaC,UAAiC,EAC5C,UACA,cACA,qBAAU,QACV,YACA,SACA,GAAG,WACC;CACJ,MAAM,YAAY,eACT,EACL,GAAG,iBAAiB,YAAY,aAAa,EAC9C,GACD,CAAC,YAAY,aAAa,CAC3B;CAID,MAAMC,cAA6B,iBAAiBF,UAAQ,GACxDA,YACA;AAKJ,QACE,qBAHA,gBAAgB,WAAW,qBAAqB;EAG/B,GAAI;EAAM,IAAI,eAAe;aAC5C,oBAAC;GAAI,UAAS;GAAU,UAAS;aAC9B,OAAO,aAAa,WACnB,oBAAC;IACY;IACX,MAAM;IACN,sBAAsB,EAAE,GAAG,MAAM;KACjC,GAEF;IAEE,EACL,WACC,oBAAC;GAAI,UAAS;GAAQ,WAAU;aAC9B,oBAAC;IACC,SAAQ;IACR,MAAK;IACL,MAAM;IACN,SAAS;IACT,KAAI;IACJ,UAAU;KAAE,WAAW;KAAiB,WAAW;KAAY;KAC/D;IACE;GAEQ"}

package/dist/BetaSticker/index.d.ts

@@ -6,4 +6,5 @@ type BetaStickerProps = {
 };
 declare const BetaSticker: React$1.FC<BetaStickerProps>;
 //#endregion
-export { BetaSticker };
+export { BetaSticker };
+//# sourceMappingURL=index.d.ts.map

package/dist/BetaSticker/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","names":[],"sources":["../../src/BetaSticker/index.tsx"],"sourcesContent":[],"mappings":";;;KA2BK,gBAAA;;AAzB0B,CAAA;AA6BlB,cAAA,WAAsB,EAAT,OAAA,CAAM,EAAG,CAAA,gBAAD,CAAA"}

package/dist/BetaSticker/index.js

@@ -57,4 +57,5 @@ const BetaSticker = ({ size = "normal" }) => {
 };
 
 //#endregion
-export { BetaSticker };
+export { BetaSticker };
+//# sourceMappingURL=index.js.map

package/dist/BetaSticker/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":["BetaSticker: React.FC<BetaStickerProps>"],"sources":["../../src/BetaSticker/index.tsx"],"sourcesContent":["import { variant } from '@codecademy/gamut-styles';\nimport styled from '@emotion/styled';\nimport * as React from 'react';\n\nconst BetaStickerContainer = styled.svg(\n  variant({\n    defaultVariant: 'normal',\n    base: {\n      lineHeight: 0,\n    },\n    variants: {\n      small: {\n        height: 16,\n        width: 32,\n      },\n      normal: {\n        height: 26,\n        width: 52,\n      },\n      medium: {\n        height: 22,\n        width: 42,\n      },\n    },\n  })\n);\n\ntype BetaStickerProps = {\n  size?: 'normal' | 'small' | 'medium';\n};\n\nexport const BetaSticker: React.FC<BetaStickerProps> = ({\n  size = 'normal',\n}) => {\n  return (\n    <BetaStickerContainer\n      variant={size}\n      viewBox=\"0 0 52 27\"\n      fill=\"none\"\n      xmlns=\"http://www.w3.org/2000/svg\"\n    >\n      <title>Beta</title>\n      <path\n        fillRule=\"evenodd\"\n        clipRule=\"evenodd\"\n        d=\"M2 0.5H0V24.5V26.5H2H52V24.5H2V0.5Z\"\n        fill=\"currentColor\"\n      />\n      <path\n        d=\"M8 19.1H11.792C14.256 19.1 15.936 18.092 15.936 15.5C15.936 14.092 15.232 13.292 14.288 12.876C15.056 12.348 15.536 11.484 15.536 10.492C15.536 8.076 13.84 7.5 11.6 7.5H8V19.1ZM10.4 12.268V9.452H11.568C12.544 9.452 13.024 9.932 13.024 10.86C13.024 11.788 12.544 12.268 11.568 12.268H10.4ZM13.392 15.58C13.392 16.604 12.88 17.116 11.696 17.116H10.4V14.028H11.696C12.88 14.028 13.392 14.54 13.392 15.58Z\"\n        fill=\"currentColor\"\n      />\n      <path\n        d=\"M18.5677 19.1H25.5917V17.036H20.9677V14.204H25.2717V12.14H20.9677V9.564H25.5917V7.5H18.5677V19.1Z\"\n        fill=\"currentColor\"\n      />\n      <path\n        d=\"M31.1675 19.1H33.5675V9.564H36.8475V7.5H27.8875V9.564H31.1675V19.1Z\"\n        fill=\"currentColor\"\n      />\n      <path\n        d=\"M38.2312 19.1H40.7913L41.3193 16.684H44.0393L44.5673 19.1H47.1913L44.1992 7.5H41.2073L38.2312 19.1ZM42.6953 10.556L43.6233 14.812H41.7353L42.6953 10.556Z\"\n        fill=\"currentColor\"\n      />\n    </BetaStickerContainer>\n  );\n};\n"],"mappings":";;;;;;AAIA,MAAM,uBAAuB,OAAO,IAClC,QAAQ;CACN,gBAAgB;CAChB,MAAM,EACJ,YAAY,GACb;CACD,UAAU;EACR,OAAO;GACL,QAAQ;GACR,OAAO;GACR;EACD,QAAQ;GACN,QAAQ;GACR,OAAO;GACR;EACD,QAAQ;GACN,QAAQ;GACR,OAAO;GACR;EACF;CACF,CAAC,CACH;AAMD,MAAaA,eAA2C,EACtD,OAAO,eACH;AACJ,QACE,qBAAC;EACC,SAAS;EACT,SAAQ;EACR,MAAK;EACL,OAAM;;GAEN,oBAAC,qBAAM,SAAY;GACnB,oBAAC;IACC,UAAS;IACT,UAAS;IACT,GAAE;IACF,MAAK;KACL;GACF,oBAAC;IACC,GAAE;IACF,MAAK;KACL;GACF,oBAAC;IACC,GAAE;IACF,MAAK;KACL;GACF,oBAAC;IACC,GAAE;IACF,MAAK;KACL;GACF,oBAAC;IACC,GAAE;IACF,MAAK;KACL;;GACmB"}

package/dist/CareerPathCard/index.d.ts

@@ -23,4 +23,5 @@ type CareerPathCardProps = {
 };
 declare const CareerPathCard: react3.ForwardRefExoticComponent<CareerPathCardProps & react3.RefAttributes<HTMLAnchorElement>>;
 //#endregion
-export { CareerPathCard };
+export { CareerPathCard };
+//# sourceMappingURL=index.d.ts.map

package/dist/CareerPathCard/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","names":[],"sources":["../../src/CareerPathCard/index.tsx"],"sourcesContent":[],"mappings":";;;;;KAcK,mBAAA;;;EAAA,gBAAA,EAGe,gBAHI;EAGJ,gBAAA,CAAA,EAAA,MAAA,GAAA,IAAA;EAEL,UAAA,CAAA,EAAA,gBAAA,GAAA,IAAA;EAKE,gBAAA,CAAA,EAAA,OAAA;EAEN,QAAM,EAAA,MAAA;EACN,WAAM,EAAA,MAAA;EAAS,UAAA,CAAA,EAAA,OAAA;EAMb,YAAA,CAAA,EATI,WA4DhB;EAnD0B,cAAA,CAAA,EAAA,MAAA,GAAA,IAAA;EAAA,MAAA,CAAA,EAPhB,KAAA,CAAM,SAOU;EAAA,MAAA,CAAA,EANhB,KAAA,CAAM,SAMU;EAAA,YAAA,CAAA,EAAA,OAAA;EAAA,IAAA,EAAA,MAAA;;;cAAd,gBAAc,MAAA,CAAA,0BAAA,sBAAA,MAAA,CAAA,cAAA"}

package/dist/CareerPathCard/index.js

@@ -30,4 +30,5 @@ const CareerPathCard = forwardRef(({ imageUrl, courseCount, shortDescription, di
 });
 
 //#endregion
-export { CareerPathCard };
+export { CareerPathCard };
+//# sourceMappingURL=index.js.map

package/dist/CareerPathCard/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":[],"sources":["../../src/CareerPathCard/index.tsx"],"sourcesContent":["import { HeadingTags } from '@codecademy/gamut';\nimport { forwardRef, PropsWithRef } from 'react';\n\nimport { getPathImageUrl } from '../ContentGroupBaseCard/helpers';\nimport { ContentGroupBaseCard } from '../ContentGroupBaseCard/index';\nimport {\n  CertificateComponent,\n  CourseCountComponent,\n} from '../ContentGroupBaseCard/shared';\nimport {\n  CourseDifficulty,\n  EnrollmentStatus,\n} from '../ContentGroupBaseCard/types';\n\ntype CareerPathCardProps = {\n  title: string;\n  lessonCount: number;\n  enrollmentStatus: EnrollmentStatus;\n  shortDescription?: string | null;\n  difficulty?: CourseDifficulty | null;\n  hasCareerJourney?: boolean;\n  imageUrl: string;\n  courseCount: number;\n  isFullSize?: boolean;\n  headingLevel?: HeadingTags;\n  timeToComplete?: number | null;\n  header?: React.ReactNode;\n  footer?: React.ReactNode;\n  openInNewTab?: boolean;\n  href: string;\n  onClick: () => void;\n};\n\nexport const CareerPathCard = forwardRef<\n  HTMLAnchorElement,\n  PropsWithRef<CareerPathCardProps>\n>(\n  (\n    {\n      imageUrl,\n      courseCount,\n      shortDescription,\n      difficulty,\n      enrollmentStatus,\n      lessonCount,\n      title,\n      isFullSize,\n      hasCareerJourney,\n      headingLevel = 'h3',\n      timeToComplete,\n      header,\n      footer,\n      openInNewTab = false,\n      href,\n      onClick,\n    },\n    ref\n  ) => {\n    return (\n      <ContentGroupBaseCard\n        headerBackgroundColor=\"navy\"\n        headerText=\"Career path\"\n        title={title}\n        headingLevel={headingLevel}\n        description={shortDescription}\n        difficulty={difficulty}\n        numLessons={lessonCount}\n        shadow=\"outline\"\n        imageSrc={getPathImageUrl(enrollmentStatus, imageUrl)}\n        isFullSize={isFullSize}\n        enrollmentStatus={enrollmentStatus}\n        timeToComplete={timeToComplete}\n        header={header}\n        footer={footer}\n        href={href}\n        openInNewTab={openInNewTab}\n        onClick={onClick}\n        ref={ref}\n      >\n        <CourseCountComponent count={courseCount} />\n        <CertificateComponent professionalCert={!!hasCareerJourney} />\n      </ContentGroupBaseCard>\n    );\n  }\n);\n"],"mappings":";;;;;;;AAiCA,MAAa,iBAAiB,YAK1B,EACE,UACA,aACA,kBACA,YACA,kBACA,aACA,OACA,YACA,kBACA,eAAe,MACf,gBACA,QACA,QACA,eAAe,OACf,MACA,WAEF,QACG;AACH,QACE,qBAAC;EACC,uBAAsB;EACtB,YAAW;EACJ;EACO;EACd,aAAa;EACD;EACZ,YAAY;EACZ,QAAO;EACP,UAAU,gBAAgB,kBAAkB,SAAS;EACzC;EACM;EACF;EACR;EACA;EACF;EACQ;EACL;EACJ;aAEL,oBAAC,wBAAqB,OAAO,cAAe,EAC5C,oBAAC,wBAAqB,kBAAkB,CAAC,CAAC,mBAAoB;GACzC;EAG5B"}

package/dist/Carousel/elements.js

@@ -7,4 +7,5 @@ const arrowButtonStates = states({ disabled: { borderColor: "background-disabled
 const ArrowButton = styled(IconButton)(css({ borderColor: "currentColor" }), arrowButtonStates);
 
 //#endregion
-export { ArrowButton };
+export { ArrowButton };
+//# sourceMappingURL=elements.js.map

package/dist/Carousel/elements.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"elements.js","names":[],"sources":["../../src/Carousel/elements.tsx"],"sourcesContent":["import { IconButton } from '@codecademy/gamut';\nimport { css, states } from '@codecademy/gamut-styles';\nimport { StyleProps } from '@codecademy/variance';\nimport styled from '@emotion/styled';\n\nconst arrowButtonStates = states({\n  disabled: { borderColor: 'background-disabled' },\n});\nexport const ArrowButton = styled(IconButton)<\n  StyleProps<typeof arrowButtonStates>\n>(css({ borderColor: 'currentColor' }), arrowButtonStates);\n"],"mappings":";;;;;AAKA,MAAM,oBAAoB,OAAO,EAC/B,UAAU,EAAE,aAAa,uBAAuB,EACjD,CAAC;AACF,MAAa,cAAc,OAAO,WAAW,CAE3C,IAAI,EAAE,aAAa,gBAAgB,CAAC,EAAE,kBAAkB"}

package/dist/Carousel/index.d.ts

@@ -25,4 +25,5 @@ declare const PatternedContainer: React.FC<React.PropsWithChildren<{
 }>>;
 declare const Carousel: React.FC<CarouselProps>;
 //#endregion
-export { Carousel, PatternedContainer };
+export { Carousel, PatternedContainer };
+//# sourceMappingURL=index.d.ts.map

package/dist/Carousel/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","names":[],"sources":["../../src/Carousel/index.tsx"],"sourcesContent":[],"mappings":";;;;;;;KAuBK,UAAA,gBAA0B;KAE1B,aAAA;EAFA,KAAA,EAGI,GAAA,CAAI,OAHE,EAAA;EAEV,YAAA,CAAA,EAAA,CAAa,KAAA,EAEO,aAFP,EAAA,GAAA,IAAA;EACT,OAAI,CAAA,EAED,OAFC;EACY,mBAAA,CAAA,EAAA,OAAA;EACb,WAAA,CAAA,EAAA,OAAA;EAGgB,gBAAA,CAAA,EAAP,MAAO,CAAA,UAAA,EAAA,OAAA,CAAA,GAAA,CAAA,CAAA,KAAA,EAAA,MAAA,EAAA,GAAA,OAAA,CAAA;EAAP,aAAA,CAAA,EAAA,KAAA,GAAA,QAAA;EAEX,KAAI,CAAA,EAAJ,GAAA,CAAI,OAAA;EAAO,OAAA,CAAA,EAAA,cAAA,GAAA,aAAA;AA+CrB,CAAA;AAGe,cAHF,kBAGE,EAHkB,KAAA,CAAM,EAGxB,CAFb,KAAA,CAAM,iBAEO,CAAA;EAFb,EAAA,CAAM,EAEC,KAAA,CAAM,WAFP,CAAA,GAAA,CAAA;EADyB,aAAM,CAAA,EAAA,OAAA;EAAE,WAAA,CAAA,EAAA,OAAA;EAwC5B,YA6JZ,CAAA,EAAA,OAAA;;cA7JY,UAAU,KAAA,CAAM,GAAG"}

package/dist/Carousel/index.js

@@ -186,4 +186,5 @@ const Carousel = ({ items, leftPadding = false, onArrowClick, options: optionsPr
 };
 
 //#endregion
-export { Carousel, PatternedContainer };
+export { Carousel, PatternedContainer };
+//# sourceMappingURL=index.js.map

package/dist/Carousel/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":["SplideTrack","UnstyledSplideTrack","SplideSlide","UnstyledSplideSlide","PatternedContainer: React.FC<\n  React.PropsWithChildren<{\n    // eslint-disable-next-line @typescript-eslint/no-explicit-any\n    as?: React.ElementType<any>;\n    bottomPadding?: boolean;\n    leftPadding?: boolean;\n    overflowAuto?: boolean;\n  }>\n>","Carousel: React.FC<CarouselProps>","arrowDisplay: BoxProps['display']","variant","index","showArrowDisplay"],"sources":["../../src/Carousel/index.tsx"],"sourcesContent":["// eslint-disable-next-line gamut/no-css-standalone\nimport '@splidejs/splide/dist/css/splide.min.css';\n\nimport { Box, BoxProps, FlexBox } from '@codecademy/gamut';\nimport {\n  MiniChevronLeftIcon,\n  MiniChevronRightIcon,\n} from '@codecademy/gamut-icons';\nimport { CheckerDense } from '@codecademy/gamut-patterns';\nimport { breakpoints } from '@codecademy/gamut-styles';\nimport { UserClickData } from '@codecademy/tracking';\nimport isPropValid from '@emotion/is-prop-valid';\nimport styled from '@emotion/styled';\nimport {\n  Options,\n  Splide,\n  SplideSlide as UnstyledSplideSlide,\n  SplideTrack as UnstyledSplideTrack,\n} from '@splidejs/react-splide';\nimport React, { useEffect, useMemo, useRef, useState } from 'react';\n\nimport { ArrowButton } from './elements';\n\ntype Breakpoint = keyof typeof breakpoints;\n\ntype CarouselProps = {\n  items: JSX.Element[];\n  onArrowClick?: (props: UserClickData) => void;\n  options?: Options;\n  patternedBackground?: boolean;\n  leftPadding?: boolean;\n  showArrowDisplay?: Record<Breakpoint, boolean> | ((count: number) => boolean);\n  arrowPosition?: 'top' | 'bottom';\n  title?: JSX.Element;\n  variant?: 'catalog_home' | 'catalog_hub';\n};\n\nconst CarouselWrapper = styled(Box)`\n  transform: translateX(-1rem);\n  width: calc(100% + 2rem);\n`;\n\nconst SplideTrack = styled(UnstyledSplideTrack, {\n  shouldForwardProp: isPropValid,\n})`\n  padding-top: ${(props: { patternedBackground?: boolean }) =>\n    props.patternedBackground ? '1rem' : '0'};\n  padding-bottom: ${(props: { patternedBackground?: boolean }) =>\n    props.patternedBackground ? '2rem' : '0'};\n`;\n\nconst SplideSlide = styled(UnstyledSplideSlide, {\n  shouldForwardProp: isPropValid,\n})`\n  display: flex;\n  flex-shrink: ${(props: { noShrink?: boolean }) =>\n    props.noShrink ? 'initial' : 0};\n`;\n\nconst defaultOptions = {\n  gap: '2rem',\n  perPage: 3,\n  pagination: false,\n  keyboard: false,\n  slideFocus: false,\n  arrows: false,\n  perMove: 2,\n  padding: '1rem',\n  breakpoints: {\n    [parseInt(breakpoints.md, 10)]: {\n      perPage: 2,\n      perMove: 1,\n    },\n  },\n};\n\nconst StyledBox = styled(FlexBox)`\n  list-style-type: none;\n`;\n\nexport const PatternedContainer: React.FC<\n  React.PropsWithChildren<{\n    // eslint-disable-next-line @typescript-eslint/no-explicit-any\n    as?: React.ElementType<any>;\n    bottomPadding?: boolean;\n    leftPadding?: boolean;\n    overflowAuto?: boolean;\n  }>\n> = ({ as, children, bottomPadding, leftPadding, overflowAuto }) => {\n  return (\n    <Box position=\"relative\" py={24} px={8}>\n      <Box\n        borderRadius=\"lg\"\n        overflow=\"hidden\"\n        position=\"absolute\"\n        top={0}\n        bottom={0}\n        left={0}\n        width=\"100%\"\n        zIndex={0}\n      >\n        <CheckerDense />\n      </Box>\n      <StyledBox\n        as={as}\n        columnGap={64}\n        position=\"relative\"\n        overflowX={overflowAuto ? 'auto' : 'hidden'}\n        pt={16}\n        pb={bottomPadding ? 24 : 0}\n        pl={{ xl: leftPadding ? 16 : 0 }}\n        m={0}\n        zIndex={1}\n      >\n        {children}\n      </StyledBox>\n    </Box>\n  );\n};\n\nexport const Carousel: React.FC<CarouselProps> = ({\n  items,\n  leftPadding = false,\n  onArrowClick,\n  options: optionsProp = {},\n  patternedBackground = false,\n  showArrowDisplay,\n  arrowPosition = 'top',\n  title,\n  variant = 'catalog_home',\n}) => {\n  const ref = useRef<Splide | null>(null);\n  const [index, setIndex] = useState(0);\n  const [lastIndex, setLastIndex] = useState<number | null>();\n\n  // required in the case where items conditionally update (i.e. loading cards to actual cards)\n  useEffect(() => {\n    if (ref.current?.splide?.options.perPage) {\n      setLastIndex(items.length - ref.current.splide.options.perPage);\n    } else {\n      setLastIndex(items.length);\n    }\n  }, [items, ref.current?.splide?.options.perPage]);\n\n  const options = useMemo(() => {\n    return {\n      ...defaultOptions,\n      ...optionsProp,\n    };\n  }, [optionsProp]);\n\n  const arrowDisplay: BoxProps['display'] = useMemo(() => {\n    switch (items.length) {\n      case 1:\n      case 2:\n        return 'none';\n      default:\n        return 'flex';\n    }\n  }, [items]);\n\n  const onClickForward = () => {\n    onArrowClick?.({ target: 'forward_arrow' });\n    ref.current?.go('>');\n  };\n  const onClickBack = () => {\n    onArrowClick?.({ target: 'backward_arrow' });\n    ref.current?.go('<');\n  };\n  const determineLastIndex = (perPage: number) => {\n    setLastIndex(items.length - perPage);\n  };\n\n  const isCatalogHubVariant = variant === 'catalog_hub';\n\n  const CarouselContent = (\n    <Splide\n      onMove={({ index }) => setIndex(index)}\n      onUpdated={(splide) => {\n        if (splide.options.perPage) determineLastIndex(splide.options.perPage);\n      }}\n      onMounted={(splide) => {\n        if (splide.options.perPage) determineLastIndex(splide.options.perPage);\n        if (splide.options.autoplay) {\n          splide.Components.Autoplay.play();\n        }\n      }}\n      hasTrack={false}\n      ref={ref}\n      options={{ ...options }}\n    >\n      <SplideTrack patternedBackground={patternedBackground}>\n        {items.map((item, index) => (\n          <SplideSlide\n            noShrink={items.length === 1 && options.perPage !== 1}\n            // index should be ok since order should not change\n            // eslint-disable-next-line react/no-array-index-key\n            key={index}\n          >\n            {item}\n          </SplideSlide>\n        ))}\n      </SplideTrack>\n    </Splide>\n  );\n\n  const shouldDisplayArrow = (\n    showArrowDisplay?: CarouselProps['showArrowDisplay']\n  ) => {\n    if (showArrowDisplay) {\n      if (typeof showArrowDisplay === 'function') {\n        return showArrowDisplay(items.length) ? 'flex' : 'none';\n      }\n      const displayProps = { _: '', xs: '', sm: '', md: '', lg: '', xl: '' };\n      Object.keys(displayProps).forEach((screensize: Breakpoint) => {\n        displayProps[screensize] =\n          isCatalogHubVariant || showArrowDisplay?.[screensize]\n            ? 'flex'\n            : arrowDisplay;\n      });\n      return displayProps;\n    }\n\n    return isCatalogHubVariant ? 'flex' : arrowDisplay;\n  };\n\n  const arrows = (\n    <Box display={shouldDisplayArrow(showArrowDisplay)} pr={0}>\n      <ArrowButton\n        disabled={index === 0}\n        icon={MiniChevronLeftIcon}\n        mr={8}\n        onClick={onClickBack}\n        px={4}\n        tip=\"Scroll backward\"\n        tipProps={{ placement: 'floating' }}\n      />\n      <ArrowButton\n        disabled={index === lastIndex}\n        icon={MiniChevronRightIcon}\n        onClick={onClickForward}\n        px={4}\n        tip=\"Scroll forward\"\n        tipProps={{ placement: 'floating' }}\n      />\n    </Box>\n  );\n\n  return (\n    <>\n      <FlexBox\n        justifyContent={{\n          _: title ? 'space-between' : isCatalogHubVariant ? 'start' : 'end',\n          md: title ? 'space-between' : 'end',\n        }}\n        pb={8}\n        alignItems=\"baseline\"\n      >\n        {title ? (\n          <FlexBox pb={patternedBackground ? 8 : 0}>{title}</FlexBox>\n        ) : null}\n        {arrowPosition === 'top' ? arrows : null}\n      </FlexBox>\n      {patternedBackground ? (\n        <PatternedContainer leftPadding={leftPadding}>\n          <CarouselWrapper>{CarouselContent}</CarouselWrapper>\n        </PatternedContainer>\n      ) : (\n        <CarouselWrapper>{CarouselContent}</CarouselWrapper>\n      )}\n      {arrowPosition === 'bottom' ? (\n        <FlexBox justifyContent=\"flex-end\" pt={8}>\n          {arrows}\n        </FlexBox>\n      ) : null}\n    </>\n  );\n};\n"],"mappings":"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"}

package/dist/CertificationPathCard/index.d.ts

@@ -24,4 +24,5 @@ interface CertificationPathCardProps {
 }
 declare const CertificationPathCard: react5.ForwardRefExoticComponent<CertificationPathCardProps & react5.RefAttributes<HTMLAnchorElement>>;
 //#endregion
-export { CertificationPathCard, CertificationPathCardProps };
+export { CertificationPathCard, CertificationPathCardProps };
+//# sourceMappingURL=index.d.ts.map

package/dist/CertificationPathCard/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","names":[],"sources":["../../src/CertificationPathCard/index.tsx"],"sourcesContent":[],"mappings":";;;;;UAUU,4BAAA;;;AAF6B;AAOtB,UAAA,0BAAA,CAA0B;EAGvB,KAAA,EAAA,MAAA;EAEL,WAAA,EAAA,MAAA;EACW,gBAAA,EAHN,gBAGM;EACT,gBAAA,CAAA,EAAA,MAAA,GAAA,IAAA;EAEN,UAAM,CAAA,EAJF,gBAIE,GAAA,IAAA;EACN,qBAAM,CAAA,EAJS,4BAIT,GAAA,IAAA;EAAS,YAAA,CAAA,EAHT,WAGS;EAMb,cAAA,CAAA,EAAA,MAAA,GA0DZ,IAAA;EA1DiC,MAAA,CAAA,EAPvB,KAAA,CAAM,SAOiB;EAAA,MAAA,CAAA,EANvB,KAAA,CAAM,SAMiB;EAAA,YAAA,CAAA,EAAA,OAAA;EAAA,IAAA,EAAA,MAAA;EAAA,OAAA,EAAA,GAAA,GAAA,IAAA;;cAArB,uBAAqB,MAAA,CAAA,0BAAA,6BAAA,MAAA,CAAA,cAAA"}

package/dist/CertificationPathCard/index.js

@@ -37,4 +37,5 @@ const CertificationPathCard = forwardRef(({ title, courseCount, enrollmentStatus
 });
 
 //#endregion
-export { CertificationPathCard };
+export { CertificationPathCard };
+//# sourceMappingURL=index.js.map

package/dist/CertificationPathCard/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":[],"sources":["../../src/CertificationPathCard/index.tsx"],"sourcesContent":["import { HeadingTags } from '@codecademy/gamut';\nimport { forwardRef, PropsWithRef } from 'react';\n\nimport { ContentGroupBaseCard } from '../ContentGroupBaseCard';\nimport { CourseCountComponent } from '../ContentGroupBaseCard/shared';\nimport {\n  CourseDifficulty,\n  EnrollmentStatus,\n} from '../ContentGroupBaseCard/types';\n\ninterface CertificationProviderDetails {\n  name: string;\n  logoUrl: string;\n}\n\nexport interface CertificationPathCardProps {\n  title: string;\n  courseCount: number;\n  enrollmentStatus: EnrollmentStatus;\n  shortDescription?: string | null;\n  difficulty?: CourseDifficulty | null;\n  certificationProvider?: CertificationProviderDetails | null;\n  headingLevel?: HeadingTags;\n  timeToComplete?: number | null;\n  header?: React.ReactNode;\n  footer?: React.ReactNode;\n  openInNewTab?: boolean;\n  href: string;\n  onClick: () => void;\n}\n\nexport const CertificationPathCard = forwardRef<\n  HTMLAnchorElement,\n  PropsWithRef<CertificationPathCardProps>\n>(\n  (\n    {\n      title,\n      courseCount,\n      enrollmentStatus,\n      shortDescription,\n      difficulty,\n      certificationProvider,\n      headingLevel,\n      timeToComplete,\n      header,\n      footer,\n      openInNewTab = false,\n      href,\n      onClick,\n    },\n    ref\n  ) => {\n    const logoWidthOverrides: Record<string, number> = {\n      AWS: 28,\n      Microsoft: 20,\n      HRCI: 28,\n      'Red Hat': 20,\n    };\n\n    return (\n      <ContentGroupBaseCard\n        headerBackgroundColor=\"orange-100\"\n        headerText=\"Certification path\"\n        title={title}\n        headingLevel={headingLevel}\n        description={shortDescription}\n        difficulty={difficulty}\n        numLessons={courseCount}\n        shadow=\"outline\"\n        enrollmentStatus={enrollmentStatus}\n        timeToComplete={timeToComplete}\n        brandDetails={{\n          name: certificationProvider?.name || '',\n          logoUrl: certificationProvider?.logoUrl || '',\n          logoHeight:\n            logoWidthOverrides[certificationProvider?.name || ''] || 24,\n        }}\n        header={header}\n        footer={footer}\n        openInNewTab={openInNewTab}\n        href={href}\n        onClick={onClick}\n        ref={ref}\n      >\n        <CourseCountComponent count={courseCount} />\n      </ContentGroupBaseCard>\n    );\n  }\n);\n"],"mappings":";;;;;;AA+BA,MAAa,wBAAwB,YAKjC,EACE,OACA,aACA,kBACA,kBACA,YACA,uBACA,cACA,gBACA,QACA,QACA,eAAe,OACf,MACA,WAEF,QACG;AAQH,QACE,oBAAC;EACC,uBAAsB;EACtB,YAAW;EACJ;EACO;EACd,aAAa;EACD;EACZ,YAAY;EACZ,QAAO;EACW;EACF;EAChB,cAAc;GACZ,MAAM,uBAAuB,QAAQ;GACrC,SAAS,uBAAuB,WAAW;GAC3C,YAtB6C;IACjD,KAAK;IACL,WAAW;IACX,MAAM;IACN,WAAW;IACZ,CAkB0B,uBAAuB,QAAQ,OAAO;GAC5D;EACO;EACA;EACM;EACR;EACG;EACJ;YAEL,oBAAC,wBAAqB,OAAO,cAAe;GACvB;EAG5B"}

package/dist/CoachingSessionCard/index.d.ts

@@ -21,4 +21,5 @@ interface CoachingSessionCardProps {
 }
 declare const CoachingSessionCard: React.FC<CoachingSessionCardProps>;
 //#endregion
-export { CoachingSessionCard, CoachingSessionCardProps };
+export { CoachingSessionCard, CoachingSessionCardProps };
+//# sourceMappingURL=index.d.ts.map

package/dist/CoachingSessionCard/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","names":[],"sources":["../../src/CoachingSessionCard/index.tsx"],"sourcesContent":[],"mappings":";UAmBiB,wBAAA;EAAA,OAAA,EAAA;IAqBJ,EAAA,EAAA,MAAA;;;;;;;;;;;;;;;;;;cAAA,qBAAqB,KAAA,CAAM,GAAG"}

package/dist/CoachingSessionCard/index.js

@@ -83,4 +83,5 @@ const CoachingSessionCard = ({ session, ctas }) => /* @__PURE__ */ jsx(Card, {
 });
 
 //#endregion
-export { CoachingSessionCard };
+export { CoachingSessionCard };
+//# sourceMappingURL=index.js.map

package/dist/CoachingSessionCard/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":["CoachingSessionCard: React.FC<CoachingSessionCardProps>"],"sources":["../../src/CoachingSessionCard/index.tsx"],"sourcesContent":["import {\n  Card,\n  FillButton,\n  FlexBox,\n  StrokeButton,\n  Text,\n  TextButton,\n} from '@codecademy/gamut';\nimport { CalendarIcon, ClockIcon } from '@codecademy/gamut-icons';\nimport { formatInTimeZone } from 'date-fns-tz';\n\nconst formatTime = (timeString: string, format: string) => {\n  return formatInTimeZone(\n    new Date(timeString),\n    Intl.DateTimeFormat().resolvedOptions().timeZone,\n    format\n  );\n};\n\nexport interface CoachingSessionCardProps {\n  session: {\n    id: string;\n    startTime: string;\n    endTime: string;\n    coachOfferingCategoryName: string;\n    participantName?: string | null;\n    zoomJoinUrl?: string | null;\n    rescheduleUrl?: string | null;\n    status?: string | null;\n  };\n  ctas?: {\n    text: string;\n    href?: string;\n    onClick?: () => void;\n    buttonType?: 'fill' | 'stroke' | 'text';\n    disabled?: boolean;\n    variant?: 'primary' | 'secondary' | 'danger';\n  }[];\n}\n\nexport const CoachingSessionCard: React.FC<CoachingSessionCardProps> = ({\n  session,\n  ctas,\n}) => (\n  <Card borderRadius=\"xl\" p={32} height=\"auto\">\n    <FlexBox column>\n      <Text mb={12}>\n        <Text fontWeight=\"bold\">{session.coachOfferingCategoryName}</Text>{' '}\n        coaching session with{' '}\n        <Text fontWeight=\"bold\">{session.participantName}</Text>\n      </Text>\n      <FlexBox alignItems=\"center\" gap={16} mb={24}>\n        <FlexBox alignItems=\"center\" gap={8}>\n          <CalendarIcon size={16} />\n          <Text variant=\"p-small\" color=\"text-secondary\">\n            {new Date(session.startTime).toLocaleDateString(undefined, {\n              weekday: 'long',\n              month: 'long',\n              day: 'numeric',\n              year: 'numeric',\n            })}\n          </Text>\n        </FlexBox>\n        <FlexBox alignItems=\"center\" gap={8}>\n          <ClockIcon size={16} />\n          <Text variant=\"p-small\" color=\"text-secondary\">\n            {`${formatTime(session.startTime, 'h:mm aa')} - ${formatTime(\n              session.endTime,\n              'h:mm aa z'\n            )}`}\n          </Text>\n        </FlexBox>\n        {session.status && (\n          <Text variant=\"p-small\" fontWeight=\"bold\">\n            Status: {session.status}\n          </Text>\n        )}\n      </FlexBox>\n      <FlexBox alignItems=\"center\" gap={8}>\n        {ctas?.map((cta) => {\n          const Button =\n            cta.buttonType === 'fill'\n              ? FillButton\n              : cta.buttonType === 'stroke'\n              ? StrokeButton\n              : TextButton;\n          return (\n            <Button\n              href={cta.href}\n              key={cta.text}\n              onClick={cta.onClick}\n              disabled={cta.disabled}\n              variant={cta.variant}\n            >\n              {cta.text}\n            </Button>\n          );\n        })}\n      </FlexBox>\n    </FlexBox>\n  </Card>\n);\n"],"mappings":";;;;;;AAWA,MAAM,cAAc,YAAoB,WAAmB;AACzD,QAAO,iBACL,IAAI,KAAK,WAAW,EACpB,KAAK,gBAAgB,CAAC,iBAAiB,CAAC,UACxC,OACD;;AAwBH,MAAaA,uBAA2D,EACtE,SACA,WAEA,oBAAC;CAAK,cAAa;CAAK,GAAG;CAAI,QAAO;WACpC,qBAAC;EAAQ;;GACP,qBAAC;IAAK,IAAI;;KACR,oBAAC;MAAK,YAAW;gBAAQ,QAAQ;OAAiC;KAAC;KAAI;KACjD;KACtB,oBAAC;MAAK,YAAW;gBAAQ,QAAQ;OAAuB;;KACnD;GACP,qBAAC;IAAQ,YAAW;IAAS,KAAK;IAAI,IAAI;;KACxC,qBAAC;MAAQ,YAAW;MAAS,KAAK;iBAChC,oBAAC,gBAAa,MAAM,KAAM,EAC1B,oBAAC;OAAK,SAAQ;OAAU,OAAM;iBAC3B,IAAI,KAAK,QAAQ,UAAU,CAAC,mBAAmB,QAAW;QACzD,SAAS;QACT,OAAO;QACP,KAAK;QACL,MAAM;QACP,CAAC;QACG;OACC;KACV,qBAAC;MAAQ,YAAW;MAAS,KAAK;iBAChC,oBAAC,aAAU,MAAM,KAAM,EACvB,oBAAC;OAAK,SAAQ;OAAU,OAAM;iBAC3B,GAAG,WAAW,QAAQ,WAAW,UAAU,CAAC,KAAK,WAChD,QAAQ,SACR,YACD;QACI;OACC;KACT,QAAQ,UACP,qBAAC;MAAK,SAAQ;MAAU,YAAW;iBAAO,YAC/B,QAAQ;OACZ;;KAED;GACV,oBAAC;IAAQ,YAAW;IAAS,KAAK;cAC/B,MAAM,KAAK,QAAQ;AAOlB,YACE,oBANA,IAAI,eAAe,SACf,aACA,IAAI,eAAe,WACnB,eACA;MAGF,MAAM,IAAI;MAEV,SAAS,IAAI;MACb,UAAU,IAAI;MACd,SAAS,IAAI;gBAEZ,IAAI;QALA,IAAI,KAMF;MAEX;KACM;;GACF;EACL"}

package/dist/CommunityEventCard/EventTypeIcon.js

@@ -57,4 +57,5 @@ const EventTypeIcon = ({ eventType }) => {
 };
 
 //#endregion
-export { EventTypeIcon };
+export { EventTypeIcon };
+//# sourceMappingURL=EventTypeIcon.js.map

package/dist/CommunityEventCard/EventTypeIcon.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"EventTypeIcon.js","names":["eventTypeMap: Record<string, EventTypeMapProps | undefined>","EventTypeIcon: React.FC<EventTypeIconProps>"],"sources":["../../src/CommunityEventCard/EventTypeIcon.tsx"],"sourcesContent":["import { FlexBox } from '@codecademy/gamut';\nimport {\n  BookFlipPageIcon,\n  BriefcaseIcon,\n  KeyboardIcon,\n  MicrophoneIcon,\n  PersonPonytailIcon,\n  QuestionMarkIcon,\n  RulerTriangleIcon,\n  YoutubePlayIcon,\n} from '@codecademy/gamut-icons';\n\ninterface EventTypeMapProps {\n  icon: typeof BookFlipPageIcon;\n  copy: string;\n}\n\nexport const eventTypeMap: Record<string, EventTypeMapProps | undefined> = {\n  careergrowth: {\n    icon: BriefcaseIcon,\n    copy: 'Career growth',\n  },\n  hackathon: {\n    icon: KeyboardIcon,\n    copy: 'Hackathon',\n  },\n  networking: {\n    icon: PersonPonytailIcon,\n    copy: 'Networking',\n  },\n  'q&a': {\n    icon: QuestionMarkIcon,\n    copy: 'Q&A',\n  },\n  studysession: {\n    icon: BookFlipPageIcon,\n    copy: 'Study session',\n  },\n  webinar: {\n    icon: MicrophoneIcon,\n    copy: 'Webinar',\n  },\n  workshop: {\n    icon: RulerTriangleIcon,\n    copy: 'Workshop',\n  },\n  youtube: {\n    icon: YoutubePlayIcon,\n    copy: 'YouTube',\n  },\n};\n\ninterface EventTypeIconProps {\n  eventType?: string | null;\n}\n\nexport const EventTypeIcon: React.FC<EventTypeIconProps> = ({ eventType }) => {\n  const key = eventType?.toLowerCase().replace(/\\s/, '');\n  const IconComponent = key ? eventTypeMap[key]?.icon : undefined;\n  const iconLoaded = key && IconComponent;\n  return (\n    <FlexBox\n      display=\"flex\"\n      alignItems=\"center\"\n      fontFamily=\"accent\"\n      fontSize={14}\n      aria-label={key && `${key} event`}\n      aria-hidden={!iconLoaded}\n    >\n      {iconLoaded && (\n        <>\n          <IconComponent aria-hidden alignSelf=\"center\" mr={8} />\n          {eventTypeMap[key]?.copy}\n        </>\n      )}\n    </FlexBox>\n  );\n};\n"],"mappings":";;;;;AAiBA,MAAaA,eAA8D;CACzE,cAAc;EACZ,MAAM;EACN,MAAM;EACP;CACD,WAAW;EACT,MAAM;EACN,MAAM;EACP;CACD,YAAY;EACV,MAAM;EACN,MAAM;EACP;CACD,OAAO;EACL,MAAM;EACN,MAAM;EACP;CACD,cAAc;EACZ,MAAM;EACN,MAAM;EACP;CACD,SAAS;EACP,MAAM;EACN,MAAM;EACP;CACD,UAAU;EACR,MAAM;EACN,MAAM;EACP;CACD,SAAS;EACP,MAAM;EACN,MAAM;EACP;CACF;AAMD,MAAaC,iBAA+C,EAAE,gBAAgB;CAC5E,MAAM,MAAM,WAAW,aAAa,CAAC,QAAQ,MAAM,GAAG;CACtD,MAAM,gBAAgB,MAAM,aAAa,MAAM,OAAO;CACtD,MAAM,aAAa,OAAO;AAC1B,QACE,oBAAC;EACC,SAAQ;EACR,YAAW;EACX,YAAW;EACX,UAAU;EACV,cAAY,OAAO,GAAG,IAAI;EAC1B,eAAa,CAAC;YAEb,cACC,4CACE,oBAAC;GAAc;GAAY,WAAU;GAAS,IAAI;IAAK,EACtD,aAAa,MAAM,QACnB;GAEG"}

package/dist/CommunityEventCard/index.d.ts

@@ -28,4 +28,5 @@ interface CommunityEventCardProps {
 declare const formatTime: (startDate: string, endDate: string) => string;
 declare const CommunityEventCard: React.FC<CommunityEventCardProps>;
 //#endregion
-export { CommunityEventCard, CommunityEventCardProps, formatTime };
+export { CommunityEventCard, CommunityEventCardProps, formatTime };
+//# sourceMappingURL=index.d.ts.map

package/dist/CommunityEventCard/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","names":[],"sources":["../../src/CommunityEventCard/index.tsx"],"sourcesContent":[],"mappings":";UAyBiB,uBAAA;EAAA,KAAA,EAAA,MAAA;EA4CJ,SAAA,EAAA,MAsBZ;EAEY,OAAA,EAAA,MAAA;;;;;;;;;;;;mBArDM;;;;;;;;;;;cA6BN;cAwBA,oBAAoB,KAAA,CAAM,GAAG"}

package/dist/CommunityEventCard/index.js

@@ -253,4 +253,5 @@ const CommunityEventCard = ({ title, startDate, endDate, descriptionShort, url,
 };
 
 //#endregion
-export { CommunityEventCard, formatTime };
+export { CommunityEventCard, formatTime };
+//# sourceMappingURL=index.js.map

package/dist/CommunityEventCard/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":["CommunityEventCard: React.FC<CommunityEventCardProps>","mobileDevice: boolean"],"sources":["../../src/CommunityEventCard/index.tsx"],"sourcesContent":["import {\n  Anchor,\n  Box,\n  Card,\n  FillButton,\n  FlexBox,\n  Spinner,\n  Text,\n} from '@codecademy/gamut';\nimport {\n  CalendarIcon,\n  CheckFilledIcon,\n  LockIcon,\n  PeopleIcon,\n  RoundPinIcon,\n} from '@codecademy/gamut-icons';\nimport { pxRem, theme } from '@codecademy/gamut-styles';\nimport styled from '@emotion/styled';\nimport { format, parseJSON } from 'date-fns';\nimport { motion } from 'framer-motion';\nimport isMobile from 'ismobilejs';\nimport { useEffect, useRef, useState } from 'react';\n\nimport { EventTypeIcon } from './EventTypeIcon';\n\nexport interface CommunityEventCardProps {\n  title: string;\n  startDate: string;\n  endDate: string;\n  descriptionShort: string;\n  url: string;\n  totalAttendees?: number | null;\n  audienceType: string;\n  isProEvent?: boolean;\n  isProUser?: boolean;\n  isAnonUser?: boolean;\n  isTrialEligible?: boolean;\n  upsellUrl?: string;\n  venueType?: string;\n  inPersonLocation?: string | null;\n  sendRSVP?: () => Promise<boolean>;\n  handleCardClick?: () => void;\n  handleAnonUserCardClick?: () => void;\n  handleRSVPClick?: () => void;\n  handleUpgradeCTAClick?: () => void;\n  handleOnRSVPSuccess?: () => void;\n  handleOnRSVPFailure?: () => void;\n  isRegistered?: boolean;\n  hideButton?: boolean;\n  type?: string | null;\n}\n\nconst HoverCard = styled(Card)`\n  border-radius: 4px;\n  &:hover {\n    cursor: pointer;\n  }\n`;\n\nconst StyledLink = styled(Anchor)`\n  flex-grow: 1;\n  text-decoration: none;\n  color: ${theme.colors.navy};\n  &:hover,\n  &:focus {\n    text-decoration: none;\n  }\n`;\n\nexport const formatTime = (startDate: string, endDate: string) => {\n  const startTime = parseJSON(startDate);\n  const startHour = format(startTime, 'h');\n  const startMinutes = format(startTime, 'mm');\n  const startTimeOfDay = format(startTime, 'a').toLowerCase();\n  const endTime = parseJSON(endDate);\n  const endHour = format(endTime, 'h');\n  const endMinutes = format(endTime, 'mm');\n  const endTimeOfDay = format(endTime, 'a').toLowerCase();\n  let text = `${startHour}`;\n  if (startMinutes !== '00') {\n    text += `:${startMinutes}`;\n  }\n  if (startTimeOfDay !== endTimeOfDay) {\n    text += `${startTimeOfDay}`;\n  }\n  text += `-${endHour}`;\n  if (endMinutes !== '00') {\n    text += `:${endMinutes}`;\n  }\n  text += `${endTimeOfDay}`;\n  return text;\n};\n\nexport const CommunityEventCard: React.FC<CommunityEventCardProps> = ({\n  title,\n  startDate,\n  endDate,\n  descriptionShort,\n  url,\n  totalAttendees = null,\n  audienceType,\n  inPersonLocation = null,\n  isProEvent,\n  isProUser,\n  isAnonUser,\n  isTrialEligible,\n  upsellUrl,\n  sendRSVP,\n  hideButton,\n  handleCardClick,\n  handleAnonUserCardClick,\n  handleRSVPClick,\n  handleUpgradeCTAClick,\n  handleOnRSVPSuccess,\n  handleOnRSVPFailure,\n  isRegistered,\n  type,\n}) => {\n  const cannotShowButton = hideButton || isAnonUser;\n  const [isMobileDevice, setIsMobileDevice] = useState(true);\n  const [showCardButton, setShowCardButton] = useState(\n    cannotShowButton ? false : isMobileDevice\n  );\n  const [rsvpSuccessful, setRsvpSuccessful] = useState(false);\n  const [rsvpLoading, setRsvpLoading] = useState(false);\n  const isAttending = rsvpSuccessful || isRegistered;\n  const cardLinkRef = useRef<HTMLAnchorElement>(null);\n\n  useEffect(() => {\n    const mobileDevice: boolean = isMobile().any;\n    setIsMobileDevice(mobileDevice);\n    setShowCardButton(mobileDevice);\n  }, []);\n  useEffect(() => {\n    // focus should only be set once because we only set rsvp true after save a spot button is clicked\n    if (rsvpSuccessful) {\n      cardLinkRef.current?.focus();\n      setRsvpLoading(false);\n    }\n  }, [rsvpSuccessful]);\n\n  const nonProButtonText = isTrialEligible\n    ? 'Start 7-day free trial'\n    : 'Upgrade';\n  const eventTime = formatTime(startDate, endDate);\n  const hideYear = eventTime.length > 11;\n  const canAccessPro = !(isProEvent && !isProUser);\n  const revealCardButton = () => {\n    if (!cannotShowButton && !isAttending) {\n      setShowCardButton(true);\n    }\n  };\n  const isSafari =\n    typeof navigator !== 'undefined' &&\n    /^((?!chrome|android).)*safari/i.test(navigator.userAgent);\n  return (\n    <HoverCard\n      display=\"flex\"\n      flexDirection=\"column\"\n      height={pxRem(318)}\n      justifyContent=\"space-between\"\n      variant=\"white\"\n      isInteractive\n      p={0}\n      pt={isProEvent || isAttending ? 0 : 16}\n      position=\"relative\"\n      overflow=\"hidden\"\n      onTouchStart={revealCardButton}\n      onFocus={revealCardButton}\n      onMouseEnter={revealCardButton}\n      onMouseLeave={() => {\n        if (!rsvpLoading && !isMobileDevice) {\n          setShowCardButton(false);\n        }\n      }}\n      tabIndex={isSafari ? 0 : undefined}\n    >\n      <StyledLink\n        href={url}\n        onClick={\n          isAnonUser\n            ? (e: React.MouseEvent) => {\n                e.preventDefault();\n                handleCardClick?.();\n                handleAnonUserCardClick?.();\n              }\n            : () => handleCardClick?.()\n        }\n        ref={cardLinkRef}\n        target=\"_blank\"\n      >\n        {isAttending ? (\n          <motion.div\n            key=\"success\"\n            initial={{ opacity: 0, y: -16 }}\n            animate={{ opacity: 1, y: 0, transition: { ease: 'easeInOut' } }}\n          >\n            <FlexBox\n              position=\"absolute\"\n              top={0}\n              width=\"100%\"\n              alignItems=\"center\"\n              borderBottom=\"solid\"\n              borderStyleBottom={{\n                '1': 'solid',\n              }}\n              px={16}\n              py={4}\n              borderColor=\"black\"\n              bg=\"hyper\"\n              color=\"white\"\n            >\n              <CheckFilledIcon mr={8} />\n              <Text fontSize={14}>\n                <Text screenreader>\n                  {isRegistered\n                    ? \"You're going to the event\"\n                    : \"You've saved a spot for the event\"}\n                </Text>\n                <Text aria-hidden>You&apos;re going!</Text>\n              </Text>\n            </FlexBox>\n          </motion.div>\n        ) : (\n          isProEvent && (\n            <FlexBox\n              position=\"absolute\"\n              top={0}\n              width=\"100%\"\n              bg=\"navy\"\n              color=\"white\"\n              px={16}\n              py={4}\n              borderBottom=\"solid\"\n              borderStyleBottom={{ '1': 'solid' }}\n            >\n              <Text fontSize={14}>Pro/Plus</Text>\n            </FlexBox>\n          )\n        )}\n        <FlexBox\n          flexDirection=\"column\"\n          justifyContent=\"space-between\"\n          height=\"100%\"\n        >\n          <Box\n            p={16}\n            pb={8}\n            pt={isAttending || isProEvent ? (36 as never) : 0}\n            flexGrow={1}\n          >\n            <Text truncate=\"ellipsis\" truncateLines={2} fontSize={22} as=\"h3\">\n              {title}\n            </Text>\n            {audienceType === 'in_person' && (\n              <FlexBox alignItems=\"center\" mb={8} mt={4}>\n                <RoundPinIcon mr={8} mb={4} size={16} />\n                <Text\n                  fontFamily=\"accent\"\n                  color=\"navy-600\"\n                  truncate=\"ellipsis\"\n                  truncateLines={1}\n                  fontSize={14}\n                >\n                  {inPersonLocation ?? 'In-person event'}\n                </Text>\n              </FlexBox>\n            )}\n            <FlexBox\n              justifyContent=\"space-between\"\n              alignItems=\"center\"\n              fontSize={14}\n              fontFamily=\"accent\"\n              my={8}\n            >\n              <FlexBox alignItems=\"center\">\n                <CalendarIcon alignSelf=\"center\" mr={8} />\n                {format(\n                  parseJSON(startDate),\n                  hideYear ? \"MMM dd'...'\" : 'MMM dd, yyyy'\n                )}\n              </FlexBox>\n              {eventTime}\n            </FlexBox>\n            <Text truncate=\"ellipsis\" truncateLines={3}>\n              {descriptionShort}\n            </Text>\n          </Box>\n          <FlexBox justifyContent=\"space-between\" p={16} pt={8} tabIndex={0}>\n            <EventTypeIcon eventType={type} />\n            {totalAttendees !== null && totalAttendees > 0 && (\n              <Text display=\"flex\" fontFamily=\"accent\" fontSize={14}>\n                <PeopleIcon alignSelf=\"center\" mr={8} aria-hidden />\n                {totalAttendees === 100\n                  ? '100+'\n                  : rsvpSuccessful\n                  ? totalAttendees + 1\n                  : totalAttendees}\n              </Text>\n            )}\n          </FlexBox>\n        </FlexBox>\n      </StyledLink>\n      {showCardButton && sendRSVP && !isAttending && !isAnonUser && (\n        <motion.div\n          key=\"rsvp\"\n          initial={{ opacity: 0 }}\n          animate={{ opacity: 1 }}\n        >\n          {canAccessPro ? (\n            <FillButton\n              width=\"calc(100% - 32px)\"\n              mx={16}\n              position=\"absolute\"\n              bottom={48}\n              disabled={rsvpLoading}\n              onClick={async () => {\n                setRsvpLoading(true);\n                handleRSVPClick?.();\n                const didRsvp = await sendRSVP();\n                if (didRsvp) {\n                  handleOnRSVPSuccess?.();\n                } else {\n                  handleOnRSVPFailure?.();\n                }\n                setRsvpSuccessful(didRsvp);\n              }}\n              onBlur={() => {\n                if (!rsvpLoading && !isMobileDevice) {\n                  setShowCardButton(false);\n                }\n              }}\n            >\n              {rsvpLoading ? <Spinner size={16} /> : 'Save a spot'}\n            </FillButton>\n          ) : (\n            <FillButton\n              width=\"calc(100% - 32px)\"\n              mx={16}\n              position=\"absolute\"\n              bottom={48}\n              href={upsellUrl}\n              variant=\"secondary\"\n              onClick={() => handleUpgradeCTAClick?.()}\n            >\n              <FlexBox alignItems=\"center\">\n                <LockIcon mr={8} />\n                {nonProButtonText}\n              </FlexBox>\n            </FillButton>\n          )}\n        </motion.div>\n      )}\n    </HoverCard>\n  );\n};\n"],"mappings":"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"}

package/dist/CommunityEventToast/index.d.ts

@@ -6,4 +6,5 @@ interface CommunityEventToastProps {
 }
 declare const CommunityEventToast: React.FC<CommunityEventToastProps>;
 //#endregion
-export { CommunityEventToast };
+export { CommunityEventToast };
+//# sourceMappingURL=index.d.ts.map

package/dist/CommunityEventToast/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","names":[],"sources":["../../src/CommunityEventToast/index.tsx"],"sourcesContent":[],"mappings":";;;UAIU,wBAAA;;AAFgB;AAMb,cAAA,mBAA8B,EAAT,KAAA,CAAM,EAAG,CAAA,wBAAD,CAAA"}

package/dist/CommunityEventToast/index.js

@@ -30,4 +30,5 @@ const CommunityEventToast = ({ onClose }) => {
 };
 
 //#endregion
-export { CommunityEventToast };
+export { CommunityEventToast };
+//# sourceMappingURL=index.js.map

package/dist/CommunityEventToast/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":["CommunityEventToast: React.FC<CommunityEventToastProps>"],"sources":["../../src/CommunityEventToast/index.tsx"],"sourcesContent":["import { Box, FlexBox, Text, Toaster } from '@codecademy/gamut';\nimport { CalendarIcon } from '@codecademy/gamut-icons';\nimport React from 'react';\n\ninterface CommunityEventToastProps {\n  onClose: () => void;\n}\n\nexport const CommunityEventToast: React.FC<CommunityEventToastProps> = ({\n  onClose,\n}) => {\n  return (\n    <Toaster\n      toasts={[\n        {\n          children: (\n            <Box>\n              <FlexBox alignItems=\"center\">\n                <CalendarIcon size={16} mr={8} mb={8} />\n                <Text variant=\"p-base\" fontWeight=\"title\" mb={4}>\n                  You&apos;re going!\n                </Text>\n              </FlexBox>\n              <Text variant=\"p-small\">\n                Please remember to mark your calendar.\n              </Text>\n            </Box>\n          ),\n          id: 'you-are-going-toast',\n        },\n      ]}\n      onClose={onClose}\n    />\n  );\n};\n"],"mappings":";;;;;;AAQA,MAAaA,uBAA2D,EACtE,cACI;AACJ,QACE,oBAAC;EACC,QAAQ,CACN;GACE,UACE,qBAAC,kBACC,qBAAC;IAAQ,YAAW;eAClB,oBAAC;KAAa,MAAM;KAAI,IAAI;KAAG,IAAI;MAAK,EACxC,oBAAC;KAAK,SAAQ;KAAS,YAAW;KAAQ,IAAI;eAAG;MAE1C;KACC,EACV,oBAAC;IAAK,SAAQ;cAAU;KAEjB,IACH;GAER,IAAI;GACL,CACF;EACQ;GACT"}

package/dist/ContentGroupBaseCard/helpers.d.ts

@@ -5,4 +5,5 @@ declare const getPathImageUrl: (enrollment: EnrollmentStatus, imageUrl: string)
 declare const getTimeToCompleteDisplayAmount: (amount: number) => number | "< 1";
 declare const getTimeToCompleteDisplayDuration: (amount: number) => "hour" | "hours";
 //#endregion
-export { getPathImageUrl, getTimeToCompleteDisplayAmount, getTimeToCompleteDisplayDuration };
+export { getPathImageUrl, getTimeToCompleteDisplayAmount, getTimeToCompleteDisplayDuration };
+//# sourceMappingURL=helpers.d.ts.map

package/dist/ContentGroupBaseCard/helpers.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"helpers.d.ts","names":[],"sources":["../../src/ContentGroupBaseCard/helpers.ts"],"sourcesContent":[],"mappings":";;;cAEa,8BACC;cAYD;AAbA,cAgBA,gCAfiB,EAAA,CAAA,MAAA,EAAA,MAAA,EAAA,GAAA,MAAA,GAAA,OAAA"}

package/dist/ContentGroupBaseCard/helpers.js

@@ -10,4 +10,5 @@ const getTimeToCompleteDisplayAmount = (amount) => amount <= 0 ? "< 1" : amount;
 const getTimeToCompleteDisplayDuration = (amount) => amount <= 1 ? "hour" : "hours";
 
 //#endregion
-export { getPathImageUrl, getTimeToCompleteDisplayAmount, getTimeToCompleteDisplayDuration };
+export { getPathImageUrl, getTimeToCompleteDisplayAmount, getTimeToCompleteDisplayDuration };
+//# sourceMappingURL=helpers.js.map

package/dist/ContentGroupBaseCard/helpers.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"helpers.js","names":[],"sources":["../../src/ContentGroupBaseCard/helpers.ts"],"sourcesContent":["import { EnrollmentStatus } from './types';\n\nexport const getPathImageUrl = (\n  enrollment: EnrollmentStatus,\n  imageUrl: string\n) => {\n  if (enrollment === EnrollmentStatus.InProgress) {\n    return imageUrl.replace('-inProgress', '');\n  }\n  if (enrollment === EnrollmentStatus.Completed) {\n    return imageUrl.replace('-completed', '');\n  }\n  return imageUrl;\n};\n\nexport const getTimeToCompleteDisplayAmount = (amount: number) =>\n  amount <= 0 ? '< 1' : amount;\n\nexport const getTimeToCompleteDisplayDuration = (amount: number) =>\n  amount <= 1 ? 'hour' : 'hours';\n"],"mappings":";;;AAEA,MAAa,mBACX,YACA,aACG;AACH,KAAI,eAAe,iBAAiB,WAClC,QAAO,SAAS,QAAQ,eAAe,GAAG;AAE5C,KAAI,eAAe,iBAAiB,UAClC,QAAO,SAAS,QAAQ,cAAc,GAAG;AAE3C,QAAO;;AAGT,MAAa,kCAAkC,WAC7C,UAAU,IAAI,QAAQ;AAExB,MAAa,oCAAoC,WAC/C,UAAU,IAAI,SAAS"}

package/dist/ContentGroupBaseCard/index.d.ts

@@ -37,4 +37,5 @@ declare const ContentGroupBaseCardHeaderBackground: _emotion_styled2.StyledCompo
 }, {}, {}>;
 declare const ContentGroupBaseCard: React.ForwardRefExoticComponent<ContentGroupBaseCardProps & React.RefAttributes<HTMLAnchorElement>>;
 //#endregion
-export { ContentGroupBaseCard, ContentGroupBaseCardHeaderBackground, ContentGroupBaseCardProps };
+export { ContentGroupBaseCard, ContentGroupBaseCardHeaderBackground, ContentGroupBaseCardProps };
+//# sourceMappingURL=index.d.ts.map

package/dist/ContentGroupBaseCard/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","names":[],"sources":["../../src/ContentGroupBaseCard/index.tsx"],"sourcesContent":[],"mappings":";;;;;;;;;KAkCY,yBAAA;yBACa;;;iBAGR;EAJL,WAAA,CAAA,EAAA,MAAA,GAAA,IAAA;EACa,UAAA,CAAA,EAKV,gBALU,GAAA,IAAA;EAGR,UAAA,EAAA,MAAA;EAEF,QAAA,CAAA,EAAA,MAAA;EAKM,UAAA,CAAA,EAAA,OAAA;EAOR,MAAM,CAAA,EAAA,MAAA,GAAA,SAAA;EACR,gBAAM,CAAA,EARI,gBAQJ;EACN,cAAM,CAAA,EAAA,MAAA,GAAA,IAAA;EAAS,YAAA,CAAA,EAAA;IAgBb,IAAA,EAAA,MAAA;IAQZ,OAAA,EAAA,MAAA;IARgD,UAAA,EAAA,MAAA;EAAA,CAAA;EAAA,QAAA,CAAA,EAlBpC,KAAA,CAAM,SAkB8B;EAAA,MAAA,CAAA,EAjBtC,KAAA,CAAM,SAiBgC;WAhBtC,KAAA,CAAM,SAgBgC;EAAA,YAAA,CAAA,EAAA,OAAA;EAUpC,IAAA,EAAA,MAAA;EAAoB,OAAA,EAAA,GAAA,GAAA,IAAA;CAAA;AAAA,cAVpB,oCAUoB,mBAVgB,eAUhB,CAVgB,IAUhB,CAFhC,yBAAA,CARgD,eAAA,EAUhB,KAAA,CAAA,GAVgB,KAAA,CAAA,aAUhB,CAVgB,cAUhB,CAAA,GAAA;EAAA,KAAA,CAAA,EAVgB,eAAA,CAAA,KAUhB;CAAA,EAAA,CAAA,CAAA,EAAA,CAAA,CAAA,CAAA;cAApB,sBAAoB,KAAA,CAAA,0BAAA,4BAAA,KAAA,CAAA,cAAA"}

package/dist/ContentGroupBaseCard/index.js

@@ -207,4 +207,5 @@ const ContentGroupBaseCard = forwardRef(({ headerBackgroundColor, headerText, ti
 });
 
 //#endregion
-export { ContentGroupBaseCard, ContentGroupBaseCardHeaderBackground };
+export { ContentGroupBaseCard, ContentGroupBaseCardHeaderBackground };
+//# sourceMappingURL=index.js.map

package/dist/ContentGroupBaseCard/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":["enrollmentAssets: EnrollmentStatusAssets"],"sources":["../../src/ContentGroupBaseCard/index.tsx"],"sourcesContent":["import {\n  Anchor,\n  Box,\n  Card,\n  FlexBox,\n  HeadingTags,\n  Text,\n} from '@codecademy/gamut';\nimport { LevelIcon } from '@codecademy/gamut-icons';\nimport { Background, Colors, css, theme } from '@codecademy/gamut-styles';\nimport styled from '@emotion/styled';\nimport pluralize from 'pluralize';\nimport React, { forwardRef, PropsWithRef } from 'react';\n\nimport {\n  getTimeToCompleteDisplayAmount,\n  getTimeToCompleteDisplayDuration,\n} from './helpers';\nimport { Divider } from './shared';\nimport { CourseDifficulty, EnrollmentStatus } from './types';\n\nconst Image = Box.withComponent('img');\n\nconst CardAnchor = styled(Anchor)(\n  css({\n    '&:hover, &:focus, &:focus-visible': {\n      color: 'text',\n    },\n    '&:before': {\n      inset: 2,\n    },\n  })\n);\n\nexport type ContentGroupBaseCardProps = {\n  headerBackgroundColor: Colors;\n  headerText: string;\n  title: string;\n  headingLevel?: HeadingTags;\n  description?: string | null;\n  difficulty?: CourseDifficulty | null;\n  numLessons: number;\n  imageSrc?: string;\n  isFullSize?: boolean;\n  shadow?: 'none' | 'outline';\n  enrollmentStatus?: EnrollmentStatus;\n  timeToComplete?: number | null;\n  brandDetails?: {\n    name: string;\n    logoUrl: string;\n    logoHeight: number;\n  };\n  children?: React.ReactNode;\n  header?: React.ReactNode;\n  footer?: React.ReactNode;\n  openInNewTab?: boolean;\n  href: string;\n  onClick: () => void;\n};\n\ntype EnrollmentStatusAssets = {\n  [status in\n    | EnrollmentStatus.InProgress\n    | EnrollmentStatus.Completed\n    | EnrollmentStatus.None]: {\n    text: string;\n    backgroundColor: Colors;\n  };\n};\n\nexport const ContentGroupBaseCardHeaderBackground = styled(Background)(\n  css({\n    pl: 12,\n    py: 4,\n    borderRadiusTop: 'md',\n    borderRadiusBottom: 'none',\n    boxShadow: `inset 0 0 0 1px ${theme.colors.white}`,\n  })\n);\n\nexport const ContentGroupBaseCard = forwardRef<\n  HTMLAnchorElement,\n  PropsWithRef<ContentGroupBaseCardProps>\n>(\n  (\n    {\n      headerBackgroundColor,\n      headerText,\n      title,\n      headingLevel,\n      description,\n      difficulty,\n      numLessons,\n      imageSrc,\n      isFullSize = false,\n      shadow = 'none',\n      enrollmentStatus,\n      timeToComplete,\n      brandDetails,\n      children,\n      header,\n      footer,\n      openInNewTab = false,\n      href,\n      onClick,\n    },\n    ref\n  ) => {\n    const enrollmentAssets: EnrollmentStatusAssets = {\n      completed: { text: headerText + ' completed!', backgroundColor: 'green' },\n      inProgress: { text: 'In progress...', backgroundColor: 'yellow' },\n      none: { text: headerText, backgroundColor: headerBackgroundColor },\n    };\n\n    const isEnrolled =\n      enrollmentStatus === EnrollmentStatus.InProgress ||\n      enrollmentStatus === EnrollmentStatus.Completed;\n\n    const isBeginnerContainer = difficulty === CourseDifficulty.Beginner;\n\n    const renderTimeToCompleteOrNumLessons = () => {\n      if (typeof timeToComplete === 'number' && timeToComplete >= 0) {\n        const displayAmount = getTimeToCompleteDisplayAmount(timeToComplete);\n        const displayDuration =\n          getTimeToCompleteDisplayDuration(timeToComplete);\n        return (\n          <>\n            <Text screenreader>{`${displayAmount} ${displayDuration}`}</Text>\n            <Text variant=\"p-small\" pl={4} whiteSpace=\"nowrap\" aria-hidden>\n              <b>{displayAmount}</b> {displayDuration}\n            </Text>\n          </>\n        );\n      }\n      if (numLessons > 0) {\n        const label = pluralize('Lesson', numLessons);\n        return (\n          <>\n            <Text screenreader>{`${numLessons} ${label}`}</Text>\n            <Text variant=\"p-small\" pl={4} whiteSpace=\"nowrap\" aria-hidden>\n              <b>{numLessons}</b> {label}\n            </Text>\n          </>\n        );\n      }\n\n      return null;\n    };\n\n    return (\n      <Card\n        variant={isEnrolled ? 'beige' : 'white'}\n        borderRadius=\"md\"\n        borderColor=\"border-primary\"\n        overflow=\"hidden\"\n        display=\"flex\"\n        flexDirection=\"column\"\n        shadow={shadow}\n        isInteractive\n        p={0}\n        height=\"100%\"\n        // eslint-disable-next-line gamut/no-inline-style\n        style={{ cursor: 'pointer' }}\n        onClick={(e: React.MouseEvent) => {\n          // only handle clicks if they didn't come from the anchor to avoid double navigation\n          if ((e.target as HTMLElement).closest('a') === null) {\n            e.preventDefault();\n            onClick?.();\n          }\n        }}\n      >\n        <Box position=\"relative\">\n          <CardAnchor\n            href={href}\n            onClick={onClick}\n            variant=\"interface\"\n            display=\"block\"\n            ref={ref}\n            target={openInNewTab ? '_blank' : undefined}\n          >\n            {header || (\n              <ContentGroupBaseCardHeaderBackground\n                bg={\n                  enrollmentStatus\n                    ? enrollmentAssets[enrollmentStatus].backgroundColor\n                    : headerBackgroundColor\n                }\n              >\n                <Text fontFamily=\"accent\" fontSize={14}>\n                  {enrollmentStatus\n                    ? enrollmentAssets[enrollmentStatus].text\n                    : headerText}\n                </Text>\n              </ContentGroupBaseCardHeaderBackground>\n            )}\n            <FlexBox\n              px={12}\n              pt={4}\n              flexDirection=\"column\"\n              alignItems=\"flex-start\"\n            >\n              {brandDetails?.logoUrl && (\n                <Image\n                  src={brandDetails.logoUrl}\n                  alt={brandDetails.name}\n                  width=\"auto\"\n                  height={brandDetails.logoHeight}\n                  mt={12}\n                />\n              )}\n              <Text\n                variant=\"title-xs\"\n                as={headingLevel}\n                pt={brandDetails?.logoUrl ? 8 : 12}\n                pb={4}\n              >\n                {title}\n              </Text>\n            </FlexBox>\n          </CardAnchor>\n        </Box>\n        <FlexBox\n          flexDirection=\"column\"\n          textAlign=\"left\"\n          mx={12}\n          my={4}\n          height=\"100%\"\n          maxWidth={isFullSize ? { md: 'calc(100% - 228px)' } : '100%'}\n        >\n          {description && (\n            <Text\n              variant=\"p-small\"\n              truncate=\"ellipsis\"\n              truncateLines={3}\n              mb={16}\n            >\n              {description}\n            </Text>\n          )}\n          <Box as=\"ul\" listStyle=\"none\" p={0} m={0} mt=\"auto\">\n            {children}\n            <Box as=\"li\">\n              <Divider />\n              <FlexBox justifyContent=\"space-between\" flexWrap=\"wrap\">\n                {difficulty && (\n                  <FlexBox alignItems=\"center\">\n                    <LevelIcon />\n                    <Text screenreader>{`${difficulty}${\n                      isBeginnerContainer ? ' Friendly' : ''\n                    }.`}</Text>\n                    <Text\n                      variant=\"p-small\"\n                      pl={8}\n                      whiteSpace=\"nowrap\"\n                      data-testid=\"card-difficulty\"\n                      aria-hidden\n                    >\n                      <b>{difficulty}</b>\n                      {isBeginnerContainer && <> Friendly</>}\n                    </Text>\n                  </FlexBox>\n                )}\n                {renderTimeToCompleteOrNumLessons()}\n              </FlexBox>\n            </Box>\n          </Box>\n          {footer}\n        </FlexBox>\n        <Box\n          display={isFullSize ? { _: 'none', md: 'flex' } : 'none'}\n          alignItems=\"center\"\n          justifyContent=\"center\"\n          px={64}\n          position=\"absolute\"\n          top={32}\n          bottom={0}\n          right={0}\n        >\n          <Image aria-hidden width={100} height={100} src={imageSrc} />\n        </Box>\n      </Card>\n    );\n  }\n);\n"],"mappings":"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"}

package/dist/ContentGroupBaseCard/shared.js

@@ -72,4 +72,5 @@ const CourseCountComponent = ({ count }) => {
 };
 
 //#endregion
-export { CertificateComponent, CourseCountComponent, Divider };
+export { CertificateComponent, CourseCountComponent, Divider };
+//# sourceMappingURL=shared.js.map

package/dist/ContentGroupBaseCard/shared.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"shared.js","names":["Divider: React.FC","CertificateComponent: React.FC<{ professionalCert?: boolean }>","CourseCountComponent: React.FC<{ count: number }>"],"sources":["../../src/ContentGroupBaseCard/shared.tsx"],"sourcesContent":["import { Box, FlexBox, Text } from '@codecademy/gamut';\nimport { CertificateIcon } from '@codecademy/gamut-icons';\nimport { CheckerDense } from '@codecademy/gamut-patterns';\nimport { css } from '@codecademy/gamut-styles';\nimport styled from '@emotion/styled';\nimport pluralize from 'pluralize';\n\nconst DottedLine = styled(CheckerDense)(\n  css({\n    height: '1px',\n    display: 'flex',\n    position: 'absolute',\n    marginTop: '-1px',\n  })\n);\n\nexport const Divider: React.FC = () => {\n  return (\n    // the height and position properties are necessary for iOS devices\n    <Box py={4} height={0} position=\"relative\" aria-hidden>\n      <DottedLine />\n    </Box>\n  );\n};\n\nexport const CertificateComponent: React.FC<{ professionalCert?: boolean }> = ({\n  professionalCert,\n}) => {\n  const certificateType = professionalCert\n    ? `Professional Certification`\n    : `Certificate`;\n  return (\n    <Box as=\"li\">\n      <Divider />\n      <FlexBox alignItems=\"center\">\n        <CertificateIcon />\n        <Text screenreader>{`With ${certificateType}`}</Text>\n        <Text variant=\"p-small\" pl={8} aria-hidden>\n          With <b>{certificateType}</b>\n        </Text>\n      </FlexBox>\n    </Box>\n  );\n};\n\nexport const CourseCountComponent: React.FC<{ count: number }> = ({\n  count,\n}) => {\n  const label = pluralize('Courses', count);\n\n  return (\n    <Box as=\"li\">\n      <Divider />\n      <Text screenreader>{`Includes ${count} ${label}`}</Text>\n      <Text variant=\"p-small\" aria-hidden>\n        Includes{' '}\n        <b>\n          {count} {label}\n        </b>\n      </Text>\n    </Box>\n  );\n};\n"],"mappings":";;;;;;;;;AAOA,MAAM,aAAa,OAAO,aAAa,CACrC,IAAI;CACF,QAAQ;CACR,SAAS;CACT,UAAU;CACV,WAAW;CACZ,CAAC,CACH;AAED,MAAaA,gBAA0B;AACrC,QAEE,oBAAC;EAAI,IAAI;EAAG,QAAQ;EAAG,UAAS;EAAW;YACzC,oBAAC,eAAa;GACV;;AAIV,MAAaC,wBAAkE,EAC7E,uBACI;CACJ,MAAM,kBAAkB,mBACpB,+BACA;AACJ,QACE,qBAAC;EAAI,IAAG;aACN,oBAAC,YAAU,EACX,qBAAC;GAAQ,YAAW;;IAClB,oBAAC,oBAAkB;IACnB,oBAAC;KAAK;eAAc,QAAQ;MAAyB;IACrD,qBAAC;KAAK,SAAQ;KAAU,IAAI;KAAG;gBAAY,SACpC,oBAAC,iBAAG,kBAAoB;MACxB;;IACC;GACN;;AAIV,MAAaC,wBAAqD,EAChE,YACI;CACJ,MAAM,QAAQ,UAAU,WAAW,MAAM;AAEzC,QACE,qBAAC;EAAI,IAAG;;GACN,oBAAC,YAAU;GACX,oBAAC;IAAK;cAAc,YAAY,MAAM,GAAG;KAAe;GACxD,qBAAC;IAAK,SAAQ;IAAU;;KAAY;KACzB;KACT,qBAAC;MACE;MAAM;MAAE;SACP;;KACC;;GACH"}

package/dist/ContentGroupBaseCard/types.d.ts

@@ -10,4 +10,5 @@ declare enum EnrollmentStatus {
   None = "none",
 }
 //#endregion
-export { CourseDifficulty, EnrollmentStatus };
+export { CourseDifficulty, EnrollmentStatus };
+//# sourceMappingURL=types.d.ts.map

package/dist/ContentGroupBaseCard/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","names":[],"sources":["../../src/ContentGroupBaseCard/types.ts"],"sourcesContent":[],"mappings":";aAAY,gBAAA;EAAA,QAAA,GAAA,UAAgB;EAMhB,YAAA,GAAA,cAAgB;;;aAAhB,gBAAA"}

package/dist/ContentGroupBaseCard/types.js

@@ -13,4 +13,5 @@ let EnrollmentStatus = /* @__PURE__ */ function(EnrollmentStatus$1) {
 }({});
 
 //#endregion
-export { CourseDifficulty, EnrollmentStatus };
+export { CourseDifficulty, EnrollmentStatus };
+//# sourceMappingURL=types.js.map

package/dist/ContentGroupBaseCard/types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.js","names":[],"sources":["../../src/ContentGroupBaseCard/types.ts"],"sourcesContent":["export enum CourseDifficulty {\n  Beginner = 'Beginner',\n  Intermediate = 'Intermediate',\n  Advanced = 'Advanced',\n}\n\nexport enum EnrollmentStatus {\n  InProgress = 'inProgress',\n  Completed = 'completed',\n  None = 'none',\n}\n"],"mappings":";AAAA,IAAY,gEAAL;AACL;AACA;AACA;;;AAGF,IAAY,gEAAL;AACL;AACA;AACA"}

package/dist/CourseCard/index.d.ts

@@ -22,4 +22,5 @@ type CourseCardProps = {
 };
 declare const CourseCard: react7.ForwardRefExoticComponent<CourseCardProps & react7.RefAttributes<HTMLAnchorElement>>;
 //#endregion
-export { CourseCard, CourseCardProps };
+export { CourseCard, CourseCardProps };
+//# sourceMappingURL=index.d.ts.map

package/dist/CourseCard/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","names":[],"sources":["../../src/CourseCard/index.tsx"],"sourcesContent":[],"mappings":";;;;;KAUY,eAAA;;;EAAA,iBAAA,EAAe,OAAA;EAIP,gBAAA,EAAA,gBAAA;EAGL,GAAA,EAAA,OAAA;EAEE,gBAAA,CAAA,EAAA,MAAA,GAAA,IAAA;EAEN,UAAM,CAAA,EAJF,gBAIE,GAAA,IAAA;EACN,UAAM,CAAA,EAAA,OAAA;EAAS,YAAA,CAAA,EAHT,WAGS;EAMb,cAoDZ,CAAA,EAAA,MAAA,GAAA,IAAA;EApDsB,MAAA,CAAA,EAPZ,KAAA,CAAM,SAOM;EAAA,MAAA,CAAA,EANZ,KAAA,CAAM,SAMM;EAAA,YAAA,CAAA,EAAA,OAAA;EAAA,IAAA,EAAA,MAAA;EAAA,OAAA,EAAA,GAAA,GAAA,IAAA;;cAAV,YAAU,MAAA,CAAA,0BAAA,kBAAA,MAAA,CAAA,cAAA"}

package/dist/CourseCard/index.js

@@ -28,4 +28,5 @@ const CourseCard = forwardRef(({ title, lessonCount, grantsCertificate, shortDes
 });
 
 //#endregion
-export { CourseCard };
+export { CourseCard };
+//# sourceMappingURL=index.js.map

package/dist/CourseCard/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":[],"sources":["../../src/CourseCard/index.tsx"],"sourcesContent":["import { HeadingTags } from '@codecademy/gamut';\nimport { forwardRef, PropsWithRef } from 'react';\n\nimport { ContentGroupBaseCard } from '../ContentGroupBaseCard';\nimport { CertificateComponent } from '../ContentGroupBaseCard/shared';\nimport {\n  CourseDifficulty,\n  EnrollmentStatus,\n} from '../ContentGroupBaseCard/types';\n\nexport type CourseCardProps = {\n  title: string;\n  lessonCount: number;\n  grantsCertificate: boolean;\n  enrollmentStatus: EnrollmentStatus;\n  pro: boolean;\n  shortDescription?: string | null;\n  difficulty?: CourseDifficulty | null;\n  isFullSize?: boolean;\n  headingLevel?: HeadingTags;\n  timeToComplete?: number | null;\n  header?: React.ReactNode;\n  footer?: React.ReactNode;\n  openInNewTab?: boolean;\n  href: string;\n  onClick: () => void;\n};\n\nexport const CourseCard = forwardRef<\n  HTMLAnchorElement,\n  PropsWithRef<CourseCardProps>\n>(\n  (\n    {\n      title,\n      lessonCount,\n      grantsCertificate,\n      shortDescription,\n      difficulty,\n      enrollmentStatus,\n      pro,\n      isFullSize,\n      headingLevel = 'h3',\n      timeToComplete,\n      header,\n      footer,\n      openInNewTab = false,\n      href,\n      onClick,\n    },\n    ref\n  ) => {\n    // only show certificates for pro exclusive courses, since only pro users can do pro courses & only pro users can gain certificates\n    // edge case here: pro users who are logged in wont be able to tell - from the card - that a free course can grant them a cert as well\n    const showCertificate = grantsCertificate && pro;\n\n    return (\n      <ContentGroupBaseCard\n        headerBackgroundColor=\"green-100\"\n        headingLevel={headingLevel}\n        headerText={pro ? 'Course' : 'Free course'}\n        title={title}\n        description={shortDescription}\n        difficulty={difficulty}\n        numLessons={lessonCount}\n        isFullSize={isFullSize}\n        imageSrc=\"https://static-assets.codecademy.com/Courses/Course-Cards/pillars.svg\"\n        enrollmentStatus={enrollmentStatus}\n        timeToComplete={timeToComplete}\n        header={header}\n        footer={footer}\n        openInNewTab={openInNewTab}\n        href={href}\n        onClick={onClick}\n        ref={ref}\n      >\n        {showCertificate && <CertificateComponent />}\n      </ContentGroupBaseCard>\n    );\n  }\n);\n"],"mappings":";;;;;;AA4BA,MAAa,aAAa,YAKtB,EACE,OACA,aACA,mBACA,kBACA,YACA,kBACA,KACA,YACA,eAAe,MACf,gBACA,QACA,QACA,eAAe,OACf,MACA,WAEF,QACG;AAKH,QACE,oBAAC;EACC,uBAAsB;EACR;EACd,YAAY,MAAM,WAAW;EACtB;EACP,aAAa;EACD;EACZ,YAAY;EACA;EACZ,UAAS;EACS;EACF;EACR;EACA;EACM;EACR;EACG;EACJ;YApBe,qBAAqB,OAsBrB,oBAAC,yBAAuB;GACvB;EAG5B"}

package/dist/CurriculumCard/BottomTag/index.d.ts

@@ -3,4 +3,5 @@ import "react";
 //#region src/CurriculumCard/BottomTag/index.d.ts
 type TagColor = 'blue' | 'green' | 'pink';
 //#endregion
-export { TagColor };
+export { TagColor };
+//# sourceMappingURL=index.d.ts.map

package/dist/CurriculumCard/BottomTag/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","names":[],"sources":["../../../src/CurriculumCard/BottomTag/index.tsx"],"sourcesContent":[],"mappings":";;;KAGY,QAAA"}

package/dist/CurriculumCard/BottomTag/index.js

@@ -25,4 +25,5 @@ const BottomTag = ({ text, color }) => {
 };
 
 //#endregion
-export { BottomTag };
+export { BottomTag };
+//# sourceMappingURL=index.js.map

package/dist/CurriculumCard/BottomTag/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":["BottomTag: React.FC<BottomTagProps>"],"sources":["../../../src/CurriculumCard/BottomTag/index.tsx"],"sourcesContent":["import { Box, Text } from '@codecademy/gamut';\nimport * as React from 'react';\n\nexport type TagColor = 'blue' | 'green' | 'pink';\nexport type BottomTagProps = {\n  text: string;\n  color: TagColor;\n};\n\nconst colorMap = {\n  blue: 'paleBlue',\n  green: 'paleGreen',\n  pink: `palePink`,\n} as const;\n\nexport const BottomTag: React.FC<BottomTagProps> = ({ text, color }) => {\n  return (\n    <Box position=\"absolute\" bottom={0} right={0} bg={colorMap[color]}>\n      <Text py={4} p={12} variant=\"title-xs\" fontSize={14}>\n        {text}\n      </Text>\n    </Box>\n  );\n};\n"],"mappings":";;;;;AASA,MAAM,WAAW;CACf,MAAM;CACN,OAAO;CACP,MAAM;CACP;AAED,MAAaA,aAAuC,EAAE,MAAM,YAAY;AACtE,QACE,oBAAC;EAAI,UAAS;EAAW,QAAQ;EAAG,OAAO;EAAG,IAAI,SAAS;YACzD,oBAAC;GAAK,IAAI;GAAG,GAAG;GAAI,SAAQ;GAAW,UAAU;aAC9C;IACI;GACH"}

package/dist/CurriculumCard/Difficulty/helpers.d.ts

@@ -10,4 +10,5 @@ import { ContainerDifficulty, ContainerDifficultyUnion } from "./types.js";
  */
 declare const getDifficultyNumber: <Type extends ContainerDifficultyUnion | ContainerDifficulty>(difficulty: Type) => 0 | 1 | 2;
 //#endregion
-export { getDifficultyNumber };
+export { getDifficultyNumber };
+//# sourceMappingURL=helpers.d.ts.map

package/dist/CurriculumCard/Difficulty/helpers.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"helpers.d.ts","names":[],"sources":["../../../src/CurriculumCard/Difficulty/helpers.ts"],"sourcesContent":[],"mappings":";;;;;;AAQA;;;;AAGkB,cAHL,mBAGK,EAAA,CAAA,aAFH,wBAEG,GAFwB,mBAExB,CAAA,CAAA,UAAA,EAAJ,IAAI,EAAA,GAAA,CAAA,GAAA,CAAA,GAAA,CAAA"}

package/dist/CurriculumCard/Difficulty/helpers.js

@@ -14,4 +14,5 @@ const getDifficultyNumber = (difficulty) => {
 };
 
 //#endregion
-export { getDifficultyNumber };
+export { getDifficultyNumber };
+//# sourceMappingURL=helpers.js.map

package/dist/CurriculumCard/Difficulty/helpers.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"helpers.js","names":[],"sources":["../../../src/CurriculumCard/Difficulty/helpers.ts"],"sourcesContent":["import { ContainerDifficulty, ContainerDifficultyUnion } from './types';\n\n/**\n * calculate the number associated with the difficulty level for a particular content\n *\n * @param difficulty level of difficulty for a particular content\n * @returns 0 indicating beginner, 1 intermediate and 2 for advanced content.\n */\nexport const getDifficultyNumber = <\n  Type extends ContainerDifficultyUnion | ContainerDifficulty\n>(\n  difficulty: Type\n): 0 | 1 | 2 => {\n  if (difficulty === ContainerDifficulty.Beginner) return 0;\n  if (difficulty === ContainerDifficulty.Intermediate) return 1;\n\n  return 2;\n};\n"],"mappings":";;;;;;;;;AAQA,MAAa,uBAGX,eACc;AACd,KAAI,eAAe,oBAAoB,SAAU,QAAO;AACxD,KAAI,eAAe,oBAAoB,aAAc,QAAO;AAE5D,QAAO"}

package/dist/CurriculumCard/Difficulty/index.d.ts

@@ -4,4 +4,5 @@ import * as React$1 from "react";
 //#region src/CurriculumCard/Difficulty/index.d.ts
 declare const Difficulty: React$1.FC<ContentDifficultyProps>;
 //#endregion
-export { Difficulty };
+export { Difficulty };
+//# sourceMappingURL=index.d.ts.map

package/dist/CurriculumCard/Difficulty/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","names":[],"sources":["../../../src/CurriculumCard/Difficulty/index.tsx"],"sourcesContent":[],"mappings":";;;;cAmCa,YAAY,OAAA,CAAM,GAAG"}

package/dist/CurriculumCard/Difficulty/index.js

@@ -37,4 +37,5 @@ const Difficulty = ({ difficulty, variant: variant$1 }) => {
 };
 
 //#endregion
-export { Difficulty };
+export { Difficulty };
+//# sourceMappingURL=index.js.map

package/dist/CurriculumCard/Difficulty/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":["Difficulty: React.FC<ContentDifficultyProps>","variant"],"sources":["../../../src/CurriculumCard/Difficulty/index.tsx"],"sourcesContent":["import { Box, Text } from '@codecademy/gamut';\nimport { pxRem, system, theme } from '@codecademy/gamut-styles';\nimport styled from '@emotion/styled';\nimport times from 'lodash/times';\nimport uniqueId from 'lodash/uniqueId';\nimport * as React from 'react';\n\nimport { getDifficultyNumber } from './helpers';\nimport { ContentDifficultyProps, DifficultyString } from './types';\n\nconst DifficultySpan = styled(Box)(\n  system.variant({\n    base: {\n      display: 'inline-block',\n      marginRight: pxRem(4),\n      verticalAlign: 'middle',\n      border: 1,\n      background: theme.colors.navy,\n      marginBottom: pxRem(1),\n      borderRadius: 'full',\n    },\n    defaultVariant: 'small',\n    variants: {\n      small: {\n        width: pxRem(8),\n        height: pxRem(8),\n      },\n      medium: {\n        width: pxRem(10),\n        height: pxRem(10),\n      },\n    },\n  })\n);\n\nexport const Difficulty: React.FC<ContentDifficultyProps> = ({\n  difficulty,\n  variant,\n}) => {\n  const difficultyNumber = getDifficultyNumber(difficulty);\n\n  return (\n    <>\n      {times(difficultyNumber + 1, () => (\n        <DifficultySpan key={uniqueId()} variant={variant} />\n      ))}\n      <Text>{DifficultyString[difficultyNumber]}</Text>\n    </>\n  );\n};\n"],"mappings":";;;;;;;;;;;AAUA,MAAM,iBAAiB,OAAO,IAAI,CAChC,OAAO,QAAQ;CACb,MAAM;EACJ,SAAS;EACT,aAAa,MAAM,EAAE;EACrB,eAAe;EACf,QAAQ;EACR,YAAY,MAAM,OAAO;EACzB,cAAc,MAAM,EAAE;EACtB,cAAc;EACf;CACD,gBAAgB;CAChB,UAAU;EACR,OAAO;GACL,OAAO,MAAM,EAAE;GACf,QAAQ,MAAM,EAAE;GACjB;EACD,QAAQ;GACN,OAAO,MAAM,GAAG;GAChB,QAAQ,MAAM,GAAG;GAClB;EACF;CACF,CAAC,CACH;AAED,MAAaA,cAAgD,EAC3D,YACA,yBACI;CACJ,MAAM,mBAAmB,oBAAoB,WAAW;AAExD,QACE,4CACG,MAAM,mBAAmB,SACxB,oBAAC,kBAAgC,SAASC,aAArB,UAAU,CAAsB,CACrD,EACF,oBAAC,kBAAM,iBAAiB,oBAAyB,IAChD"}