@codecademy/brand 4.0.0-alpha.14deb86052.0 → 4.0.0-alpha.65b0979c7d.0

package/dist/LandingPage/PageFeaturesWithReferences.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"PageFeaturesWithReferences.d.ts","names":[],"sources":["../../src/LandingPage/PageFeaturesWithReferences.tsx"],"sourcesContent":[],"mappings":";;;;;;;UAkBiB,+BAAA,SACP,sBACN;;AAFJ;;EAQgB,OAAA,CAAA,EAFJ,OAEI;EAPN,OAAA,CAAA,EAAA,CAAA,GAAA,CAAA,GAAA,CAAA,GAAA,CAAA;EACN,WAAA,CAAA,EAMY,eANZ,EAAA;EAAgB,eAAA,CAAA,EAAA;IAcP,GAAA,EAAA,MAAA;;;;;cAAA,4BAA4B,OAAA,CAAM,GAC7C"}

package/dist/LandingPage/PageFeaturesWithReferences.js

@@ -123,4 +123,5 @@ const PageFeaturesWithReferences = ({ eyebrow, title, desc, cta, testId, rightCo
 };
 
 //#endregion
-export { PageFeaturesWithReferences };
+export { PageFeaturesWithReferences };
+//# sourceMappingURL=PageFeaturesWithReferences.js.map

package/dist/LandingPage/PageFeaturesWithReferences.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PageFeaturesWithReferences.js","names":["PageFeaturesWithReferences: React.FC<\n  PageFeaturesWithReferencesProps\n>"],"sources":["../../src/LandingPage/PageFeaturesWithReferences.tsx"],"sourcesContent":["import {\n  Box,\n  Column,\n  FlexBox,\n  LayoutGrid,\n  WithChildrenProp,\n} from '@codecademy/gamut';\nimport { DotDense } from '@codecademy/gamut-patterns';\nimport * as React from 'react';\n\nimport { FeatureList, FeatureListItem } from '../FeatureList';\nimport { CTA } from './CTA';\nimport { Description } from './Description';\nimport { Eyebrow } from './PageSingleFeature';\nimport { Title } from './Title';\nimport { TitleWithEyebrow } from './TitleWithEyebrow';\nimport { LandingPageBaseProps } from './types';\n\nexport interface PageFeaturesWithReferencesProps\n  extends LandingPageBaseProps,\n    WithChildrenProp {\n  /**\n   * Object containing eyebrow text shown above title and optional accent boolean\n   */\n  eyebrow?: Eyebrow;\n  maxCols?: 1 | 2 | 3 | 4;\n  featureList?: FeatureListItem[];\n  rightCoverImage?: {\n    url: string;\n  };\n  rightCoverPattern?: 'DotLoose' | 'DotDense';\n  showImageOnMobile?: boolean;\n}\n\nexport const PageFeaturesWithReferences: React.FC<\n  PageFeaturesWithReferencesProps\n> = ({\n  eyebrow,\n  title,\n  desc,\n  cta,\n  testId,\n  rightCoverImage,\n  showImageOnMobile,\n  rightCoverPattern,\n  onAnchorClick,\n  featureList,\n}) => {\n  const hasRightCoverImage = rightCoverImage && rightCoverImage?.url;\n\n  return (\n    <LayoutGrid data-testid={testId} p={0} m={0} gap={{ _: 8, sm: 48 }}>\n      <Column\n        size={{\n          _: 12,\n          sm: 12,\n          md: hasRightCoverImage ? 7 : 12,\n          lg: hasRightCoverImage ? 6 : 12,\n        }}\n        p={{ _: 4, sm: 8, md: 24 }}\n      >\n        <FlexBox flexDirection=\"column\" p={0} m={0} gap={0}>\n          <div>\n            {title && (\n              <FlexBox>\n                {eyebrow ? (\n                  <TitleWithEyebrow\n                    title={title}\n                    eyebrow={eyebrow}\n                    isPageHeading={false}\n                    titleStyle={{\n                      fontWeight: 700,\n                      fontSize: { _: 44, sm: 44 },\n                    }}\n                    eyebrowStyle={{\n                      fontWeight: 'lighter',\n                      fontSize: { _: 16, sm: 16 },\n                    }}\n                  />\n                ) : (\n                  <Title isPageHeading={false}>{title}</Title>\n                )}\n              </FlexBox>\n            )}\n            {desc && (\n              <FlexBox>\n                <Description text={desc} onAnchorClick={onAnchorClick} />\n              </FlexBox>\n            )}\n            {cta && (\n              <Box mt={32}>\n                <CTA\n                  href={cta.href}\n                  onClick={cta.onClick}\n                  buttonType={cta.buttonType}\n                >\n                  {cta.text}\n                </CTA>\n              </Box>\n            )}\n          </div>\n          {featureList && featureList?.length > 0 && (\n            <FeatureList featureList={featureList} />\n          )}\n        </FlexBox>\n      </Column>\n      {hasRightCoverImage && (\n        <Column\n          display={{\n            _: !showImageOnMobile ? 'none' : 'initial',\n            sm: 'initial',\n          }}\n          size={{\n            _: 12,\n            md: 4,\n            lg: 6,\n          }}\n          height=\"100%\"\n        >\n          <Box\n            position=\"relative\"\n            width=\"100%\"\n            height={{ _: '400px', md: '100%' }}\n          >\n            {rightCoverPattern && (\n              <Box\n                position=\"absolute\"\n                width={125}\n                height=\"calc(100% + 8rem)\"\n                zIndex={1}\n                left=\"calc(50% - 4rem)\"\n                top=\"-4rem\"\n                display={{ _: 'none', xs: 'none', sm: 'block' }}\n              >\n                <DotDense />\n              </Box>\n            )}\n            <img\n              // eslint-disable-next-line gamut/no-inline-style\n              style={{\n                width: '100%',\n                height: '100%',\n                objectFit: 'contain',\n                justifySelf: 'center',\n                position: 'absolute',\n                zIndex: 2,\n              }}\n              src={rightCoverImage.url}\n              alt={title || 'N/A'}\n            />\n          </Box>\n        </Column>\n      )}\n    </LayoutGrid>\n  );\n};\n"],"mappings":";;;;;;;;;;;AAkCA,MAAaA,8BAER,EACH,SACA,OACA,MACA,KACA,QACA,iBACA,mBACA,mBACA,eACA,kBACI;CACJ,MAAM,qBAAqB,mBAAmB,iBAAiB;AAE/D,QACE,qBAAC;EAAW,eAAa;EAAQ,GAAG;EAAG,GAAG;EAAG,KAAK;GAAE,GAAG;GAAG,IAAI;GAAI;aAChE,oBAAC;GACC,MAAM;IACJ,GAAG;IACH,IAAI;IACJ,IAAI,qBAAqB,IAAI;IAC7B,IAAI,qBAAqB,IAAI;IAC9B;GACD,GAAG;IAAE,GAAG;IAAG,IAAI;IAAG,IAAI;IAAI;aAE1B,qBAAC;IAAQ,eAAc;IAAS,GAAG;IAAG,GAAG;IAAG,KAAK;eAC/C,qBAAC;KACE,SACC,oBAAC,qBACE,UACC,oBAAC;MACQ;MACE;MACT,eAAe;MACf,YAAY;OACV,YAAY;OACZ,UAAU;QAAE,GAAG;QAAI,IAAI;QAAI;OAC5B;MACD,cAAc;OACZ,YAAY;OACZ,UAAU;QAAE,GAAG;QAAI,IAAI;QAAI;OAC5B;OACD,GAEF,oBAAC;MAAM,eAAe;gBAAQ;OAAc,GAEtC;KAEX,QACC,oBAAC,qBACC,oBAAC;MAAY,MAAM;MAAqB;OAAiB,GACjD;KAEX,OACC,oBAAC;MAAI,IAAI;gBACP,oBAAC;OACC,MAAM,IAAI;OACV,SAAS,IAAI;OACb,YAAY,IAAI;iBAEf,IAAI;QACD;OACF;QAEJ,EACL,eAAe,aAAa,SAAS,KACpC,oBAAC,eAAyB,cAAe;KAEnC;IACH,EACR,sBACC,oBAAC;GACC,SAAS;IACP,GAAG,CAAC,oBAAoB,SAAS;IACjC,IAAI;IACL;GACD,MAAM;IACJ,GAAG;IACH,IAAI;IACJ,IAAI;IACL;GACD,QAAO;aAEP,qBAAC;IACC,UAAS;IACT,OAAM;IACN,QAAQ;KAAE,GAAG;KAAS,IAAI;KAAQ;eAEjC,qBACC,oBAAC;KACC,UAAS;KACT,OAAO;KACP,QAAO;KACP,QAAQ;KACR,MAAK;KACL,KAAI;KACJ,SAAS;MAAE,GAAG;MAAQ,IAAI;MAAQ,IAAI;MAAS;eAE/C,oBAAC,aAAW;MACR,EAER,oBAAC;KAEC,OAAO;MACL,OAAO;MACP,QAAQ;MACR,WAAW;MACX,aAAa;MACb,UAAU;MACV,QAAQ;MACT;KACD,KAAK,gBAAgB;KACrB,KAAK,SAAS;MACd;KACE;IACC;GAEA"}

package/dist/LandingPage/PageHero.d.ts

@@ -8,4 +8,5 @@ type PageHeroProps = Omit<PageSingleFeatureProps, 'mediaWidth' | 'hideImageOnMob
 };
 declare const PageHero: React$1.FC<PageHeroProps>;
 //#endregion
-export { PageHero, PageHeroProps };
+export { PageHero, PageHeroProps };
+//# sourceMappingURL=PageHero.d.ts.map

package/dist/LandingPage/PageHero.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"PageHero.d.ts","names":[],"sources":["../../src/LandingPage/PageHero.tsx"],"sourcesContent":[],"mappings":";;;;KAqBY,aAAA,GAAgB,KAC1B;;EADU,UAAA,CAAA,EAAA,OAAa,GAAA,MACvB;AAOF,CAAA;cAAa,UAAU,OAAA,CAAM,GAAG"}

package/dist/LandingPage/PageHero.js

@@ -15,4 +15,5 @@ const PageHero = ({ showImageOnMobile, textLength = "long", ...props }) => /* @_
 });
 
 //#endregion
-export { PageHero };
+export { PageHero };
+//# sourceMappingURL=PageHero.js.map

package/dist/LandingPage/PageHero.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PageHero.js","names":["PageHero: React.FC<PageHeroProps>"],"sources":["../../src/LandingPage/PageHero.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport {\n  MediaColumnsSize,\n  PageSingleFeature,\n  PageSingleFeatureProps,\n} from './PageSingleFeature';\n\nconst getMediaWidth = (\n  mediaType: 'image' | 'video' | undefined,\n  textLength: PageHeroProps['textLength']\n): MediaColumnsSize | undefined => {\n  if (mediaType === 'video') {\n    return 5;\n  }\n  if (mediaType === 'image') {\n    return textLength === 'short' ? 6 : 3;\n  }\n  return undefined;\n};\n\nexport type PageHeroProps = Omit<\n  PageSingleFeatureProps,\n  'mediaWidth' | 'hideImageOnMobile' | 'isPageHeading'\n> & {\n  showImageOnMobile?: boolean;\n  textLength?: 'short' | 'long';\n};\n\nexport const PageHero: React.FC<PageHeroProps> = ({\n  showImageOnMobile,\n  textLength = 'long',\n  ...props\n}) => (\n  <PageSingleFeature\n    {...props}\n    isPageHeading\n    hideImageOnMobile={!showImageOnMobile}\n    mediaWidth={getMediaWidth(props.media?.type, textLength)}\n  />\n);\n"],"mappings":";;;;;AAQA,MAAM,iBACJ,WACA,eACiC;AACjC,KAAI,cAAc,QAChB,QAAO;AAET,KAAI,cAAc,QAChB,QAAO,eAAe,UAAU,IAAI;;AAaxC,MAAaA,YAAqC,EAChD,mBACA,aAAa,QACb,GAAG,YAEH,oBAAC;CACC,GAAI;CACJ;CACA,mBAAmB,CAAC;CACpB,YAAY,cAAc,MAAM,OAAO,MAAM,WAAW;EACxD"}

package/dist/LandingPage/PagePrefooter.d.ts

@@ -6,4 +6,5 @@ declare const PagePrefooter: React$1.FC<LandingPageBaseProps & {
   additionalCtas?: CtaProps[];
 }>;
 //#endregion
-export { PagePrefooter };
+export { PagePrefooter };
+//# sourceMappingURL=PagePrefooter.d.ts.map

package/dist/LandingPage/PagePrefooter.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"PagePrefooter.d.ts","names":[],"sources":["../../src/LandingPage/PagePrefooter.tsx"],"sourcesContent":[],"mappings":";;;;cAQa,eAAe,OAAA,CAAM,GAChC;mBAA0C;AAD5C,CAAA,CAAA"}

package/dist/LandingPage/PagePrefooter.js

@@ -61,4 +61,5 @@ const PagePrefooter = ({ title, desc, cta, onAnchorClick, testId, additionalCtas
 };
 
 //#endregion
-export { PagePrefooter };
+export { PagePrefooter };
+//# sourceMappingURL=PagePrefooter.js.map

package/dist/LandingPage/PagePrefooter.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PagePrefooter.js","names":["PagePrefooter: React.FC<\n  LandingPageBaseProps & { additionalCtas?: CtaProps[] }\n>","cta"],"sources":["../../src/LandingPage/PagePrefooter.tsx"],"sourcesContent":["import { Box, FlexBox } from '@codecademy/gamut';\nimport * as React from 'react';\n\nimport { CTA } from './CTA';\nimport { Description } from './Description';\nimport { Title } from './Title';\nimport { CtaProps, LandingPageBaseProps } from './types';\n\nexport const PagePrefooter: React.FC<\n  LandingPageBaseProps & { additionalCtas?: CtaProps[] }\n> = ({ title, desc, cta, onAnchorClick, testId, additionalCtas }) => {\n  const SectionTitle = title && <Title>{title}</Title>;\n  const Desc = desc && (\n    <Description text={desc} onAnchorClick={onAnchorClick} />\n  );\n\n  const hasAdditionalCtas = additionalCtas && additionalCtas.length > 0;\n\n  return cta ? (\n    <FlexBox\n      data-testid={testId}\n      flexDirection={{ _: 'column', sm: 'row' }}\n      justifyContent=\"space-between\"\n      alignItems={{ sm: 'center' }}\n    >\n      <Box flex={1}>\n        {SectionTitle}\n        {Desc}\n      </Box>\n      <FlexBox\n        mt={{ _: 32, sm: 0 }}\n        ml={{ sm: 32 }}\n        gap={16}\n        flexDirection={{\n          _: 'column',\n          md: 'row',\n        }}\n        maxWidth={{ _: '100%', sm: 'max-content' }}\n      >\n        <CTA\n          key={cta.text}\n          href={cta.href}\n          onClick={cta.onClick}\n          buttonType={hasAdditionalCtas ? 'fill' : cta.buttonType}\n        >\n          {cta.text}\n        </CTA>\n        {hasAdditionalCtas\n          ? additionalCtas.map((cta) => {\n              if (!cta) {\n                return null;\n              }\n\n              return (\n                <CTA\n                  key={cta.text}\n                  href={cta.href}\n                  onClick={cta.onClick}\n                  buttonType=\"fill\"\n                >\n                  {cta.text}\n                </CTA>\n              );\n            })\n          : null}\n      </FlexBox>\n    </FlexBox>\n  ) : (\n    <div data-testid={testId}>\n      {SectionTitle}\n      {Desc}\n    </div>\n  );\n};\n"],"mappings":";;;;;;;;AAQA,MAAaA,iBAER,EAAE,OAAO,MAAM,KAAK,eAAe,QAAQ,qBAAqB;CACnE,MAAM,eAAe,SAAS,oBAAC,mBAAO,QAAc;CACpD,MAAM,OAAO,QACX,oBAAC;EAAY,MAAM;EAAqB;GAAiB;CAG3D,MAAM,oBAAoB,kBAAkB,eAAe,SAAS;AAEpE,QAAO,MACL,qBAAC;EACC,eAAa;EACb,eAAe;GAAE,GAAG;GAAU,IAAI;GAAO;EACzC,gBAAe;EACf,YAAY,EAAE,IAAI,UAAU;aAE5B,qBAAC;GAAI,MAAM;cACR,cACA;IACG,EACN,qBAAC;GACC,IAAI;IAAE,GAAG;IAAI,IAAI;IAAG;GACpB,IAAI,EAAE,IAAI,IAAI;GACd,KAAK;GACL,eAAe;IACb,GAAG;IACH,IAAI;IACL;GACD,UAAU;IAAE,GAAG;IAAQ,IAAI;IAAe;cAE1C,oBAAC;IAEC,MAAM,IAAI;IACV,SAAS,IAAI;IACb,YAAY,oBAAoB,SAAS,IAAI;cAE5C,IAAI;MALA,IAAI,KAML,EACL,oBACG,eAAe,KAAK,UAAQ;AAC1B,QAAI,CAACC,MACH,QAAO;AAGT,WACE,oBAAC;KAEC,MAAMA,MAAI;KACV,SAASA,MAAI;KACb,YAAW;eAEVA,MAAI;OALAA,MAAI,KAML;KAER,GACF;IACI;GACF,GAEV,qBAAC;EAAI,eAAa;aACf,cACA;GACG"}

package/dist/LandingPage/PageSingleFeature.d.ts

@@ -57,4 +57,5 @@ type PageSingleFeatureProps = LandingPageBaseProps & {
 };
 declare const PageSingleFeature: React$1.FC<PageSingleFeatureProps>;
 //#endregion
-export { ColumnSize, Eyebrow, FeaturedImage, FeaturedImageProps, ImageProps, MediaColumnsSize, MediaProps, PageSingleFeature, PageSingleFeatureProps };
+export { ColumnSize, Eyebrow, FeaturedImage, FeaturedImageProps, ImageProps, MediaColumnsSize, MediaProps, PageSingleFeature, PageSingleFeatureProps };
+//# sourceMappingURL=PageSingleFeature.d.ts.map

package/dist/LandingPage/PageSingleFeature.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"PageSingleFeature.d.ts","names":[],"sources":["../../src/LandingPage/PageSingleFeature.tsx"],"sourcesContent":[],"mappings":";;;;;;KAoBY,UAAA,GAAa,QAAQ;KACrB,gBAAA,GAAmB,QAAQ;AAD3B,KAGA,UAAA,GAHU;EACV,GAAA,EAAA,MAAA;EAEA,GAAA,EAAA,MAAA;AAKZ,CAAA;AASY,KATA,UAAA,GASO,CAAA;EAKP,IAAA,EAAA,OAAA;EAIC,OAAA,CAAA,EAAA,MAqBZ;AAED,CAAA,GArCQ,UAqCI,CAAA,GAAA,CAAA;EAAyB,IAAA,EAAA,OAAA;CAIzB,GAtCJ,UAsCI,CAAA;AAYF,KAhDE,OAAA,GAgDF;EAIK,MAAA,CAAA,EAAA,OAAA;EAII,IAAA,EAAA,MAAA;CAIH;AAAe,KAvDnB,kBAAA,GAAqB,UAuDF,GAAA;EAGlB,OAAA,CAAA,EAAA,MAAA;;;cAtDA,eAAe,OAAA,CAAM,GAAG;KAuBzB,sBAAA,GAAyB;;;;YAIzB;;;;;;;;;;;;UAYF;;;;eAIK;;;;mBAII;;;;gBAIH;;cAGH,mBAAmB,OAAA,CAAM,GAAG"}

package/dist/LandingPage/PageSingleFeature.js

@@ -102,4 +102,5 @@ const PageSingleFeature = ({ cta, desc, eyebrow, hideImageOnMobile, isPageHeadin
 };
 
 //#endregion
-export { FeaturedImage, PageSingleFeature };
+export { FeaturedImage, PageSingleFeature };
+//# sourceMappingURL=PageSingleFeature.js.map

package/dist/LandingPage/PageSingleFeature.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PageSingleFeature.js","names":["FeaturedImage: React.FC<FeaturedImageProps>","PageSingleFeature: React.FC<PageSingleFeatureProps>","cta"],"sources":["../../src/LandingPage/PageSingleFeature.tsx"],"sourcesContent":["import {\n  Anchor,\n  Box,\n  Column,\n  ColumnProps,\n  FlexBox,\n  LayoutGrid,\n  Video,\n  VideoProps,\n} from '@codecademy/gamut';\nimport * as React from 'react';\n\nimport { FeatureList, FeatureListItem } from '../FeatureList';\nimport { PausableImage } from '../PausableImage';\nimport { CTA } from './CTA';\nimport { Description } from './Description';\nimport { Title } from './Title';\nimport { TitleWithEyebrow } from './TitleWithEyebrow';\nimport { CtaProps, LandingPageBaseProps } from './types';\n\nexport type ColumnSize = Extract<ColumnProps['size'], number>;\nexport type MediaColumnsSize = Extract<ColumnSize, 3 | 4 | 5 | 6>;\n\nexport type ImageProps = {\n  src: string;\n  alt: string;\n};\n\nexport type MediaProps =\n  | ({\n      type: 'image';\n      linkUrl?: string;\n    } & ImageProps)\n  | ({\n      type: 'video';\n    } & VideoProps);\n\nexport type Eyebrow = {\n  accent?: boolean;\n  text: string;\n};\n\nexport type FeaturedImageProps = ImageProps & {\n  linkUrl?: string;\n  hideImageOnMobile?: boolean;\n};\nexport const FeaturedImage: React.FC<FeaturedImageProps> = ({\n  src,\n  alt,\n  linkUrl,\n  hideImageOnMobile,\n}) => {\n  const Container = linkUrl ? Anchor : Box;\n\n  return (\n    <Container\n      display={{\n        _: hideImageOnMobile ? 'none' : 'initial',\n        sm: 'initial',\n      }}\n      href={linkUrl}\n      width={1}\n      tabIndex={linkUrl ? 0 : undefined}\n    >\n      <PausableImage src={src} alt={alt} data-testid=\"feature-image\" />\n    </Container>\n  );\n};\n\nexport type PageSingleFeatureProps = LandingPageBaseProps & {\n  /**\n   * Object containing eyebrow text shown above title and optional accent boolean\n   */\n  eyebrow?: Eyebrow;\n  /**\n   * Whether the image should be hidden on mobile. Note that videos are always shown on mobile for accessibility\n   */\n  hideImageOnMobile?: boolean;\n  /**\n   * If the heading is the page h1 heading or a smaller heading\n   */\n  isPageHeading?: boolean;\n  /**\n   * Whether to show an image or a video, with the associated props to do so\n   */\n  media?: MediaProps;\n  /**\n   * Number of columns out of 12 that the media should take up, defaults to 6. The remaining columns will be used for the text\n   */\n  mediaWidth?: MediaColumnsSize;\n  /**\n   * Optional array of additional CTAs if more than one CTA is added to the section. These will appear after the provided singular CTA.\n   */\n  additionalCtas?: CtaProps[];\n  /**\n   * Optional array of features to display in a list.\n   */\n  featureList?: FeatureListItem[];\n};\n\nexport const PageSingleFeature: React.FC<PageSingleFeatureProps> = ({\n  cta,\n  desc,\n  eyebrow,\n  hideImageOnMobile,\n  isPageHeading,\n  media,\n  mediaWidth = 6,\n  onAnchorClick,\n  testId,\n  title,\n  additionalCtas,\n  featureList,\n}) => {\n  const hasAdditionalCtas = additionalCtas && additionalCtas.length > 0;\n\n  const primaryContent = (\n    <>\n      {title &&\n        (eyebrow ? (\n          <TitleWithEyebrow\n            title={title}\n            eyebrow={eyebrow}\n            isPageHeading={isPageHeading}\n          />\n        ) : (\n          <Title isPageHeading={isPageHeading}>{title}</Title>\n        ))}\n      {desc && <Description text={desc} onAnchorClick={onAnchorClick} />}\n      {cta && (\n        <FlexBox\n          mt={32}\n          gap={16}\n          flexDirection={{\n            _: 'column',\n            sm: cta.buttonType === 'fill' && mediaWidth < 5 ? 'row' : 'column',\n            md: 'row',\n          }}\n          maxWidth={{ _: '100%', sm: 'max-content' }}\n        >\n          <CTA\n            key={cta.text}\n            href={cta.href}\n            onClick={cta.onClick}\n            buttonType={hasAdditionalCtas ? 'fill' : cta.buttonType}\n          >\n            {cta.text}\n          </CTA>\n          {hasAdditionalCtas\n            ? additionalCtas.map((cta) => {\n                if (!cta) {\n                  return null;\n                }\n\n                return (\n                  <CTA\n                    key={cta.text}\n                    href={cta.href}\n                    onClick={cta.onClick}\n                    buttonType=\"fill\"\n                  >\n                    {cta.text}\n                  </CTA>\n                );\n              })\n            : null}\n        </FlexBox>\n      )}\n      {featureList && <FeatureList featureList={featureList} />}\n    </>\n  );\n\n  if (!media) {\n    return <div data-testid={testId}>{primaryContent}</div>;\n  }\n\n  const textWidth = (12 - mediaWidth) as ColumnSize;\n\n  return (\n    <LayoutGrid data-testid={testId} rowGap={16} columnGap={{ _: 8, sm: 32 }}>\n      <Column\n        size={{ sm: textWidth }}\n        alignContent=\"flex-start\"\n        alignSelf={!desc ? 'center' : 'flex-start'}\n      >\n        {primaryContent}\n      </Column>\n      <Column\n        size={{ sm: mediaWidth }}\n        gridRowStart={{ _: hideImageOnMobile ? 'initial' : 1, sm: 'initial' }}\n        alignContent=\"flex-start\"\n      >\n        {media.type === 'image' && (\n          <FeaturedImage {...media} hideImageOnMobile={hideImageOnMobile} />\n        )}\n        {media.type === 'video' && <Video {...media} />}\n      </Column>\n    </LayoutGrid>\n  );\n};\n"],"mappings":";;;;;;;;;;;AA8CA,MAAaA,iBAA+C,EAC1D,KACA,KACA,SACA,wBACI;AAGJ,QACE,oBAHgB,UAAU,SAAS;EAIjC,SAAS;GACP,GAAG,oBAAoB,SAAS;GAChC,IAAI;GACL;EACD,MAAM;EACN,OAAO;EACP,UAAU,UAAU,IAAI;YAExB,oBAAC;GAAmB;GAAU;GAAK,eAAY;IAAkB;GACvD;;AAmChB,MAAaC,qBAAuD,EAClE,KACA,MACA,SACA,mBACA,eACA,OACA,aAAa,GACb,eACA,QACA,OACA,gBACA,kBACI;CACJ,MAAM,oBAAoB,kBAAkB,eAAe,SAAS;CAEpE,MAAM,iBACJ;EACG,UACE,UACC,oBAAC;GACQ;GACE;GACM;IACf,GAEF,oBAAC;GAAqB;aAAgB;IAAc;EAEvD,QAAQ,oBAAC;GAAY,MAAM;GAAqB;IAAiB;EACjE,OACC,qBAAC;GACC,IAAI;GACJ,KAAK;GACL,eAAe;IACb,GAAG;IACH,IAAI,IAAI,eAAe,UAAU,aAAa,IAAI,QAAQ;IAC1D,IAAI;IACL;GACD,UAAU;IAAE,GAAG;IAAQ,IAAI;IAAe;cAE1C,oBAAC;IAEC,MAAM,IAAI;IACV,SAAS,IAAI;IACb,YAAY,oBAAoB,SAAS,IAAI;cAE5C,IAAI;MALA,IAAI,KAML,EACL,oBACG,eAAe,KAAK,UAAQ;AAC1B,QAAI,CAACC,MACH,QAAO;AAGT,WACE,oBAAC;KAEC,MAAMA,MAAI;KACV,SAASA,MAAI;KACb,YAAW;eAEVA,MAAI;OALAA,MAAI,KAML;KAER,GACF;IACI;EAEX,eAAe,oBAAC,eAAyB,cAAe;KACxD;AAGL,KAAI,CAAC,MACH,QAAO,oBAAC;EAAI,eAAa;YAAS;GAAqB;CAGzD,MAAM,YAAa,KAAK;AAExB,QACE,qBAAC;EAAW,eAAa;EAAQ,QAAQ;EAAI,WAAW;GAAE,GAAG;GAAG,IAAI;GAAI;aACtE,oBAAC;GACC,MAAM,EAAE,IAAI,WAAW;GACvB,cAAa;GACb,WAAW,CAAC,OAAO,WAAW;aAE7B;IACM,EACT,qBAAC;GACC,MAAM,EAAE,IAAI,YAAY;GACxB,cAAc;IAAE,GAAG,oBAAoB,YAAY;IAAG,IAAI;IAAW;GACrE,cAAa;cAEZ,MAAM,SAAS,WACd,oBAAC;IAAc,GAAI;IAA0B;KAAqB,EAEnE,MAAM,SAAS,WAAW,oBAAC,SAAM,GAAI,QAAS;IACxC;GACE"}

package/dist/LandingPage/PageTestimonials.d.ts

@@ -22,4 +22,5 @@ interface PageTestimonialsProps extends LandingPageBaseProps, WithChildrenProp {
 }
 declare const PageTestimonials: React$1.FC<PageTestimonialsProps>;
 //#endregion
-export { LiveLearningTestimonialItem, PageTestimonials, PageTestimonialsProps };
+export { LiveLearningTestimonialItem, PageTestimonials, PageTestimonialsProps };
+//# sourceMappingURL=PageTestimonials.d.ts.map

package/dist/LandingPage/PageTestimonials.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"PageTestimonials.d.ts","names":[],"sources":["../../src/LandingPage/PageTestimonials.tsx"],"sourcesContent":[],"mappings":";;;;;;UAoBiB,2BAAA;;IAAA,GAAA,EAAA,MAAA;EAiEA,CAAA;EAGL,SAAA,EAAA,MAAA;EACK,QAAA,EAAA,MAAA;EAHP,QAAA,EAAA,MAAA;EACN,OAAA,EAAA,MAAA;EAAgB,UAAA,EAAA,MAAA;EAoDP,SAAA,EAAA,MAAA;;;UAtDI,qBAAA,SACP,sBACN;YACQ;iBACK;;cAkDJ,kBAAkB,OAAA,CAAM,GAAG"}

package/dist/LandingPage/PageTestimonials.js

@@ -102,4 +102,5 @@ const PageTestimonials = ({ testimonials, testId }) => {
 };
 
 //#endregion
-export { PageTestimonials };
+export { PageTestimonials };
+//# sourceMappingURL=PageTestimonials.js.map

package/dist/LandingPage/PageTestimonials.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PageTestimonials.js","names":["PageTestimonials: React.FC<PageTestimonialsProps>"],"sources":["../../src/LandingPage/PageTestimonials.tsx"],"sourcesContent":["import {\n  Box,\n  Card,\n  Column,\n  FlexBox,\n  LayoutGrid,\n  Markdown,\n  Text,\n  WithChildrenProp,\n} from '@codecademy/gamut';\nimport { MiniQuoteIcon, PersonFilledIcon } from '@codecademy/gamut-icons';\nimport { theme } from '@codecademy/gamut-styles';\nimport styled from '@emotion/styled';\nimport * as React from 'react';\nimport { ReactNode } from 'react';\n\nimport { Avatar } from '../Avatar';\nimport { Eyebrow } from './PageSingleFeature';\nimport { LandingPageBaseProps } from './types';\n\nexport interface LiveLearningTestimonialItem {\n  image: {\n    url: string;\n  };\n  firstName: string;\n  lastName: string;\n  jobTitle: string;\n  company: string;\n  shortQuote: string;\n  longQuote: string;\n  href: string;\n}\n\nconst UserProfile = ({\n  fullName,\n  jobTitle,\n  image,\n}: {\n  fullName: string;\n  jobTitle: string;\n  image: string;\n}): ReactNode => (\n  <FlexBox flexDirection=\"row\" gap={12} alignItems=\"center\">\n    <FlexBox\n      background={theme.colors['blue-300']}\n      borderRadius=\"full\"\n      alignItems=\"center\"\n      justifyContent=\"center\"\n      borderWidth={1}\n      borderColor=\"black\"\n      borderStyle=\"solid\"\n      minWidth={64}\n      minHeight={64}\n      overflow=\"hidden\"\n    >\n      {image ? (\n        <Avatar\n          src={image}\n          alt={fullName || 'N/A'}\n          size={64}\n          disableDropshadow\n        />\n      ) : (\n        <PersonFilledIcon color=\"black\" size={60} mt={12} borderRadius=\"full\" />\n      )}\n    </FlexBox>\n    <Box display=\"flex\" flexDirection=\"column\" gap={4}>\n      <Text fontWeight=\"bold\" fontSize={16}>\n        {fullName}\n      </Text>\n      <Text fontSize={16} color=\"gray-800\">\n        {jobTitle}\n      </Text>\n    </Box>\n  </FlexBox>\n);\n\nconst StyledCard = styled(Card)(\n  ({ bg }: { bg?: string }) => `\n  background: ${bg};\n  display: flex;\n  flex-direction: column;\n`\n);\n\nexport interface PageTestimonialsProps\n  extends LandingPageBaseProps,\n    WithChildrenProp {\n  eyebrow?: Eyebrow;\n  testimonials?: LiveLearningTestimonialItem[];\n}\n\nconst TestimonialCard = ({\n  testimonial,\n  bg,\n}: {\n  testimonial: LiveLearningTestimonialItem;\n  bg?: string;\n}): ReactNode => (\n  <StyledCard shadow=\"patternLeft\" borderRadius=\"lg\" p={24} bg={bg}>\n    <MiniQuoteIcon size={18} mt=\"auto\" />\n    <Box mt={12} mb={24}>\n      <Markdown text={testimonial?.longQuote} />\n    </Box>\n    <UserProfile\n      fullName={testimonial?.firstName + ' ' + testimonial?.lastName}\n      jobTitle={testimonial?.jobTitle}\n      image={testimonial?.image?.url}\n    />\n  </StyledCard>\n);\n\nconst TestimonialCards = ({\n  testimonials,\n}: {\n  testimonials: LiveLearningTestimonialItem[];\n}): ReactNode => {\n  const backgroundVariants = [\n    theme.colors['yellow-0'],\n    theme.colors['pink-0'],\n    theme.colors['blue-0'],\n  ];\n  return testimonials?.map((item, index) => (\n    <Column\n      key={item.lastName.replaceAll(' ', '-')}\n      size={{\n        _: 12,\n        sm: 6,\n        md: 4,\n      }}\n    >\n      <TestimonialCard\n        testimonial={item}\n        bg={backgroundVariants[index % backgroundVariants.length]}\n      />\n    </Column>\n  ));\n};\n\nexport const PageTestimonials: React.FC<PageTestimonialsProps> = ({\n  testimonials,\n  testId,\n}) => {\n  return (\n    <LayoutGrid data-testid={testId} gap={32}>\n      {testimonials && testimonials?.length > 0 && (\n        <TestimonialCards testimonials={testimonials} />\n      )}\n    </LayoutGrid>\n  );\n};\n"],"mappings":";;;;;;;;;AAiCA,MAAM,eAAe,EACnB,UACA,UACA,YAMA,qBAAC;CAAQ,eAAc;CAAM,KAAK;CAAI,YAAW;YAC/C,oBAAC;EACC,YAAY,MAAM,OAAO;EACzB,cAAa;EACb,YAAW;EACX,gBAAe;EACf,aAAa;EACb,aAAY;EACZ,aAAY;EACZ,UAAU;EACV,WAAW;EACX,UAAS;YAER,QACC,oBAAC;GACC,KAAK;GACL,KAAK,YAAY;GACjB,MAAM;GACN;IACA,GAEF,oBAAC;GAAiB,OAAM;GAAQ,MAAM;GAAI,IAAI;GAAI,cAAa;IAAS;GAElE,EACV,qBAAC;EAAI,SAAQ;EAAO,eAAc;EAAS,KAAK;aAC9C,oBAAC;GAAK,YAAW;GAAO,UAAU;aAC/B;IACI,EACP,oBAAC;GAAK,UAAU;GAAI,OAAM;aACvB;IACI;GACH;EACE;AAGZ,MAAM,aAAa,OAAO,KAAK,EAC5B,EAAE,SAA0B;gBACf,GAAG;;;EAIlB;AASD,MAAM,mBAAmB,EACvB,aACA,SAKA,qBAAC;CAAW,QAAO;CAAc,cAAa;CAAK,GAAG;CAAQ;;EAC5D,oBAAC;GAAc,MAAM;GAAI,IAAG;IAAS;EACrC,oBAAC;GAAI,IAAI;GAAI,IAAI;aACf,oBAAC,YAAS,MAAM,aAAa,YAAa;IACtC;EACN,oBAAC;GACC,UAAU,aAAa,YAAY,MAAM,aAAa;GACtD,UAAU,aAAa;GACvB,OAAO,aAAa,OAAO;IAC3B;;EACS;AAGf,MAAM,oBAAoB,EACxB,mBAGe;CACf,MAAM,qBAAqB;EACzB,MAAM,OAAO;EACb,MAAM,OAAO;EACb,MAAM,OAAO;EACd;AACD,QAAO,cAAc,KAAK,MAAM,UAC9B,oBAAC;EAEC,MAAM;GACJ,GAAG;GACH,IAAI;GACJ,IAAI;GACL;YAED,oBAAC;GACC,aAAa;GACb,IAAI,mBAAmB,QAAQ,mBAAmB;IAClD;IAVG,KAAK,SAAS,WAAW,KAAK,IAAI,CAWhC,CACT;;AAGJ,MAAaA,oBAAqD,EAChE,cACA,aACI;AACJ,QACE,oBAAC;EAAW,eAAa;EAAQ,KAAK;YACnC,gBAAgB,cAAc,SAAS,KACtC,oBAAC,oBAA+B,eAAgB;GAEvC"}

package/dist/LandingPage/PageVideoGallery.d.ts

@@ -12,4 +12,5 @@ type PageVideoGalleryProps = LandingPageBaseProps & {
 };
 declare const PageVideoGallery: React$1.FC<PageVideoGalleryProps>;
 //#endregion
-export { PageVideo, PageVideoGallery, PageVideoGalleryProps };
+export { PageVideo, PageVideoGallery, PageVideoGalleryProps };
+//# sourceMappingURL=PageVideoGallery.d.ts.map

package/dist/LandingPage/PageVideoGallery.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"PageVideoGallery.d.ts","names":[],"sources":["../../src/LandingPage/PageVideoGallery.tsx"],"sourcesContent":[],"mappings":";;;;KAwCY,SAAA;;EAAA,KAAA,EAAA,MAAS;EAMT,gBAAA,CAAA,EAAA,MAAqB;AAIjC,CAAA;KAJY,qBAAA,GAAwB;UAC1B;;cAGG,kBAAkB,OAAA,CAAM,GAAG"}

package/dist/LandingPage/PageVideoGallery.js

@@ -64,4 +64,5 @@ const PageVideoGallery = ({ videos, title, desc, onAnchorClick, cta, testId }) =
 ] });
 
 //#endregion
-export { PageVideoGallery };
+export { PageVideoGallery };
+//# sourceMappingURL=PageVideoGallery.js.map

package/dist/LandingPage/PageVideoGallery.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PageVideoGallery.js","names":["PageVideoGallery: React.FC<PageVideoGalleryProps>"],"sources":["../../src/LandingPage/PageVideoGallery.tsx"],"sourcesContent":["import { Box, Video } from '@codecademy/gamut';\nimport { mediaQueries } from '@codecademy/gamut-styles';\nimport styled from '@emotion/styled';\nimport * as React from 'react';\n\nimport { CTA } from './CTA';\nimport { Description } from './Description';\nimport { Title } from './Title';\nimport { LandingPageBaseProps } from './types';\n\nconst Grid = styled.div`\n  display: grid;\n  grid-template: 1fr / 1fr;\n  gap: 8px;\n\n  ${mediaQueries.sm} {\n    // there must be a mathematical explanation for why ~12:5 is the correct ratio for\n    // the column widths but I do not know what it is. Regardless, the effect is that\n    // all three videos will maintain a 16:9 aspect ratio with an even gap between them.\n\n    grid-template: 1fr 1fr / 12fr 5fr;\n\n    gap: 16px;\n  }\n  ${mediaQueries.md} {\n    gap: 24px;\n  }\n  ${mediaQueries.lg} {\n    gap: 32px;\n  }\n`;\n\nconst GridVideo = styled(Video)`\n  ${mediaQueries.sm} {\n    &:first-of-type {\n      grid-row: 1 / span 2;\n    }\n  }\n`;\n\nexport type PageVideo = {\n  url: string;\n  title: string;\n  placeholderImage?: string;\n};\n\nexport type PageVideoGalleryProps = LandingPageBaseProps & {\n  videos: PageVideo[];\n};\n\nexport const PageVideoGallery: React.FC<PageVideoGalleryProps> = ({\n  videos,\n  title,\n  desc,\n  onAnchorClick,\n  cta,\n  testId,\n}) => (\n  <div>\n    {(title || desc) && (\n      <Box mb={32}>\n        {title && <Title>{title}</Title>}\n        {desc && <Description text={desc} onAnchorClick={onAnchorClick} />}\n      </Box>\n    )}\n    <Grid data-testid={testId}>\n      {videos.map((video) => (\n        <GridVideo\n          key={video.url}\n          videoUrl={video.url}\n          videoTitle={video.title}\n          placeholderImage={video.placeholderImage || true}\n        />\n      ))}\n    </Grid>\n    {cta && (\n      <Box mt={32}>\n        <CTA href={cta.href} onClick={cta.onClick} buttonType={cta.buttonType}>\n          {cta.text}\n        </CTA>\n      </Box>\n    )}\n  </div>\n);\n"],"mappings":";;;;;;;;;;AAUA,MAAM,OAAO,OAAO,GAAG;;;;;IAKnB,aAAa,GAAG;;;;;;;;;IAShB,aAAa,GAAG;;;IAGhB,aAAa,GAAG;;;;AAKpB,MAAM,YAAY,OAAO,MAAM;IAC3B,aAAa,GAAG;;;;;;AAiBpB,MAAaA,oBAAqD,EAChE,QACA,OACA,MACA,eACA,KACA,aAEA,qBAAC;EACG,SAAS,SACT,qBAAC;EAAI,IAAI;aACN,SAAS,oBAAC,mBAAO,QAAc,EAC/B,QAAQ,oBAAC;GAAY,MAAM;GAAqB;IAAiB;GAC9D;CAER,oBAAC;EAAK,eAAa;YAChB,OAAO,KAAK,UACX,oBAAC;GAEC,UAAU,MAAM;GAChB,YAAY,MAAM;GAClB,kBAAkB,MAAM,oBAAoB;KAHvC,MAAM,IAIX,CACF;GACG;CACN,OACC,oBAAC;EAAI,IAAI;YACP,oBAAC;GAAI,MAAM,IAAI;GAAM,SAAS,IAAI;GAAS,YAAY,IAAI;aACxD,IAAI;IACD;GACF;IAEJ"}

package/dist/LandingPage/Title.d.ts

@@ -24,4 +24,5 @@ declare const titleProps: {
 };
 declare const Title: React$1.FC<TitleProps>;
 //#endregion
-export { Title, TitleProps, titleProps };
+export { Title, TitleProps, titleProps };
+//# sourceMappingURL=Title.d.ts.map

package/dist/LandingPage/Title.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Title.d.ts","names":[],"sources":["../../src/LandingPage/Title.tsx"],"sourcesContent":[],"mappings":";;;;UAGiB,UAAA,SAAmB;;AAApC;AAIa,cAAA,UAgBH,EAAA;EAEG,SAOZ,OAAA,EAAA;;;;;;;;;;;;;;;;cAPY,OAAO,OAAA,CAAM,GAAG"}

package/dist/LandingPage/Title.js

@@ -27,4 +27,5 @@ const Title = ({ isPageHeading, children }) => /* @__PURE__ */ jsx(Text, {
 });
 
 //#endregion
-export { Title, titleProps };
+export { Title, titleProps };
+//# sourceMappingURL=Title.js.map

package/dist/LandingPage/Title.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Title.js","names":["Title: React.FC<TitleProps>"],"sources":["../../src/LandingPage/Title.tsx"],"sourcesContent":["import { Text, WithChildrenProp } from '@codecademy/gamut';\nimport * as React from 'react';\n\nexport interface TitleProps extends WithChildrenProp {\n  isPageHeading?: boolean;\n}\n\nexport const titleProps = {\n  heading: {\n    as: 'h1',\n    fontSize: {\n      _: 34,\n      sm: 44,\n      lg: 64,\n    },\n  },\n  subheading: {\n    as: 'h2',\n    fontSize: {\n      _: 26,\n      lg: 34,\n    },\n  },\n} as const;\n\nexport const Title: React.FC<TitleProps> = ({ isPageHeading, children }) => (\n  <Text\n    maxWidth=\"58rem\"\n    {...titleProps[isPageHeading ? 'heading' : 'subheading']}\n  >\n    {children}\n  </Text>\n);\n"],"mappings":";;;;;AAOA,MAAa,aAAa;CACxB,SAAS;EACP,IAAI;EACJ,UAAU;GACR,GAAG;GACH,IAAI;GACJ,IAAI;GACL;EACF;CACD,YAAY;EACV,IAAI;EACJ,UAAU;GACR,GAAG;GACH,IAAI;GACL;EACF;CACF;AAED,MAAaA,SAA+B,EAAE,eAAe,eAC3D,oBAAC;CACC,UAAS;CACT,GAAI,WAAW,gBAAgB,YAAY;CAE1C;EACI"}

package/dist/LandingPage/TitleWithEyebrow.d.ts

@@ -12,4 +12,5 @@ interface TitleWithEyebrowProps {
 }
 declare const TitleWithEyebrow: React.FC<TitleWithEyebrowProps>;
 //#endregion
-export { TitleWithEyebrow, TitleWithEyebrowProps };
+export { TitleWithEyebrow, TitleWithEyebrowProps };
+//# sourceMappingURL=TitleWithEyebrow.d.ts.map

package/dist/LandingPage/TitleWithEyebrow.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"TitleWithEyebrow.d.ts","names":[],"sources":["../../src/LandingPage/TitleWithEyebrow.tsx"],"sourcesContent":[],"mappings":";;;;;UAMiB,qBAAA;WACN;EADM,KAAA,EAAA,MAAA,GAAA,SAAqB;EAC3B,aAAA,EAAA,OAAA,GAAA,SAAA;EAGS,UAAA,CAAA,EAAL,IAAK,CAAA,SAAA,EAAA,IAAA,GAAA,eAAA,GAAA,UAAA,CAAA;EAAL,YAAA,CAAA,EACE,IADF,CACO,SADP,EAAA,IAAA,GAAA,eAAA,GAAA,UAAA,CAAA;;AACE,cAGJ,gBAHI,EAGc,KAAA,CAAM,EAHpB,CAGuB,qBAHvB,CAAA"}

package/dist/LandingPage/TitleWithEyebrow.js

@@ -34,4 +34,5 @@ const TitleWithEyebrow = ({ title, eyebrow, isPageHeading, titleStyle, eyebrowSt
 })] });
 
 //#endregion
-export { TitleWithEyebrow };
+export { TitleWithEyebrow };
+//# sourceMappingURL=TitleWithEyebrow.js.map

package/dist/LandingPage/TitleWithEyebrow.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TitleWithEyebrow.js","names":["TitleWithEyebrow: React.FC<TitleWithEyebrowProps>"],"sources":["../../src/LandingPage/TitleWithEyebrow.tsx"],"sourcesContent":["import { Text, TextProps } from '@codecademy/gamut';\nimport React from 'react';\n\nimport { Eyebrow } from './PageSingleFeature';\nimport { Title } from './Title';\n\nexport interface TitleWithEyebrowProps {\n  eyebrow: Eyebrow;\n  title: string | undefined;\n  isPageHeading: boolean | undefined;\n  titleStyle?: Omit<TextProps, 'as' | 'truncateLines' | 'truncate'>;\n  eyebrowStyle?: Omit<TextProps, 'as' | 'truncateLines' | 'truncate'>;\n}\n\nexport const TitleWithEyebrow: React.FC<TitleWithEyebrowProps> = ({\n  title,\n  eyebrow,\n  isPageHeading,\n  titleStyle,\n  eyebrowStyle,\n}) => (\n  <div>\n    <Title isPageHeading={isPageHeading}>\n      <Text\n        fontSize={{ _: 20, sm: 22 }}\n        fontFamily=\"accent\"\n        mb={16}\n        display=\"block\"\n        color={eyebrow.accent ? 'blue' : undefined}\n        {...eyebrowStyle}\n      >\n        {eyebrow.text}\n      </Text>\n    </Title>\n    <Text\n      fontSize={isPageHeading ? { _: 34, sm: 44, lg: 64 } : { _: 26, lg: 34 }}\n      fontWeight={700}\n      lineHeight=\"title\"\n      {...titleStyle}\n    >\n      {title}\n    </Text>\n  </div>\n);\n"],"mappings":";;;;;;AAcA,MAAaA,oBAAqD,EAChE,OACA,SACA,eACA,YACA,mBAEA,qBAAC,oBACC,oBAAC;CAAqB;WACpB,oBAAC;EACC,UAAU;GAAE,GAAG;GAAI,IAAI;GAAI;EAC3B,YAAW;EACX,IAAI;EACJ,SAAQ;EACR,OAAO,QAAQ,SAAS,SAAS;EACjC,GAAI;YAEH,QAAQ;GACJ;EACD,EACR,oBAAC;CACC,UAAU,gBAAgB;EAAE,GAAG;EAAI,IAAI;EAAI,IAAI;EAAI,GAAG;EAAE,GAAG;EAAI,IAAI;EAAI;CACvE,YAAY;CACZ,YAAW;CACX,GAAI;WAEH;EACI,IACH"}

package/dist/LandingPage/types.d.ts

@@ -28,4 +28,5 @@ type LandingPageBaseProps = {
 };
 type CtaProps = LandingPageBaseProps['cta'];
 //#endregion
-export { CtaProps, LandingPageBaseProps };
+export { CtaProps, LandingPageBaseProps };
+//# sourceMappingURL=types.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","names":[],"sources":["../../src/LandingPage/types.tsx"],"sourcesContent":[],"mappings":";KAAY,oBAAA;EAAA,KAAA,CAAA,EAAA,MAAA;EAS+B;;;EAaN,IAAA,CAAA,EAAA,MAAA;EAOzB;;;0BApBc,KAAA,CAAM,WAAW;;;;;;;;;;;;;cAa7B,KAAA,CAAM;;;;;KAOR,QAAA,GAAW"}

package/dist/LayoutMenu/AccordionMenu.d.ts

@@ -15,4 +15,5 @@ type Section = {
   items: SectionItem[];
 };
 //#endregion
-export { Section, SectionItem };
+export { Section, SectionItem };
+//# sourceMappingURL=AccordionMenu.d.ts.map

package/dist/LayoutMenu/AccordionMenu.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AccordionMenu.d.ts","names":[],"sources":["../../src/LayoutMenu/AccordionMenu.tsx"],"sourcesContent":[],"mappings":";;;;KA8BY,WAAA;;EAAA,IAAA,EAAA,MAAA;EAQA,IAAA,EAAA,MAAO;mBAJA,OAAA,CAAM;UACf,GAAA,CAAI;;KAGF,OAAA;;;SAGH"}

package/dist/LayoutMenu/AccordionMenu.js

@@ -57,4 +57,5 @@ const AccordionMenu = ({ section, onSectionToggle, onItemClick, selectedItem, ve
 };
 
 //#endregion
-export { AccordionMenu, isSection };
+export { AccordionMenu, isSection };
+//# sourceMappingURL=AccordionMenu.js.map

package/dist/LayoutMenu/AccordionMenu.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AccordionMenu.js","names":["theme","AccordionMenu: React.FC<AccordionMenuProps>","React"],"sources":["../../src/LayoutMenu/AccordionMenu.tsx"],"sourcesContent":["import { AccordionAreaDeprecated, Anchor, Text } from '@codecademy/gamut';\nimport { MiniChevronDownIcon } from '@codecademy/gamut-icons';\nimport { css, states, transitionConcat } from '@codecademy/gamut-styles';\nimport { StyleProps } from '@codecademy/variance';\nimport { Scale } from '@codecademy/variance/dist/types/config';\nimport styled from '@emotion/styled';\nimport * as React from 'react';\n\nimport { LayoutMenuSection } from './LayoutMenuSection';\n\nconst StyledAccordionArea = styled(AccordionAreaDeprecated)`\n  padding-bottom: ${({ theme }) => theme.spacing[32]};\n  position: relative;\n  left: -4px;\n`;\n\nconst chevronStates = states({\n  expanded: { transform: 'rotate(180deg)' },\n});\n\nconst ExpandChevron = styled(MiniChevronDownIcon)<\n  StyleProps<typeof chevronStates>\n>(\n  css({\n    transform: 'rotate(0deg)',\n    transition: transitionConcat(['transform'], 'slow', 'ease-out'),\n  }),\n  chevronStates\n);\n\nexport type SectionItem = {\n  title: string;\n  slug: string;\n  href: string;\n  onClick: (event: React.MouseEvent) => void;\n  badge?: JSX.Element;\n};\n\nexport type Section = {\n  title: string;\n  slug: string;\n  items: SectionItem[];\n};\n\nexport const isSection = (item: Section | React.ReactNode): item is Section => {\n  return (\n    typeof item === 'object' &&\n    item !== null &&\n    'title' in item &&\n    'slug' in item &&\n    'items' in item\n  );\n};\n\nexport type AccordionMenuProps = {\n  section: Section;\n  onSectionToggle: (sectionSlug: string) => void;\n  onItemClick: () => void;\n  selectedItem?: string;\n  verticalSpacing?: Scale<{\n    readonly property: 'padding';\n    readonly scale: 'spacing';\n  }>;\n};\n\nexport const AccordionMenu: React.FC<AccordionMenuProps> = ({\n  section,\n  onSectionToggle,\n  onItemClick,\n  selectedItem,\n  verticalSpacing,\n}) => {\n  const [expanded, setExpanded] = React.useState(true);\n\n  return (\n    <StyledAccordionArea\n      expanded={expanded}\n      top={\n        <Anchor\n          variant=\"interface\"\n          py={12}\n          px={4}\n          onClick={() => {\n            onSectionToggle(section.slug);\n            setExpanded((prev) => !prev);\n          }}\n          aria-expanded={expanded}\n          display=\"flex\"\n        >\n          {/* eslint-disable-next-line gamut/no-inline-style */}\n          <Text variant=\"title-xs\" style={{ flex: 1 }} textAlign=\"left\">\n            {section.title}\n          </Text>\n          <ExpandChevron\n            ml={12}\n            size={14}\n            expanded={expanded}\n            position=\"relative\"\n            top={4}\n          />\n        </Anchor>\n      }\n    >\n      <LayoutMenuSection\n        items={section.items}\n        selectedItem={selectedItem}\n        onItemClick={onItemClick}\n        verticalSpacing={verticalSpacing}\n      />\n    </StyledAccordionArea>\n  );\n};\n"],"mappings":";;;;;;;;;AAUA,MAAM,sBAAsB,OAAO,wBAAwB;qBACtC,EAAE,qBAAYA,QAAM,QAAQ,IAAI;;;;AAKrD,MAAM,gBAAgB,OAAO,EAC3B,UAAU,EAAE,WAAW,kBAAkB,EAC1C,CAAC;AAEF,MAAM,gBAAgB,OAAO,oBAAoB,CAG/C,IAAI;CACF,WAAW;CACX,YAAY,iBAAiB,CAAC,YAAY,EAAE,QAAQ,WAAW;CAChE,CAAC,EACF,cACD;AAgBD,MAAa,aAAa,SAAqD;AAC7E,QACE,OAAO,SAAS,YAChB,SAAS,QACT,WAAW,QACX,UAAU,QACV,WAAW;;AAef,MAAaC,iBAA+C,EAC1D,SACA,iBACA,aACA,cACA,sBACI;CACJ,MAAM,CAAC,UAAU,eAAeC,QAAM,SAAS,KAAK;AAEpD,QACE,oBAAC;EACW;EACV,KACE,qBAAC;GACC,SAAQ;GACR,IAAI;GACJ,IAAI;GACJ,eAAe;AACb,oBAAgB,QAAQ,KAAK;AAC7B,iBAAa,SAAS,CAAC,KAAK;;GAE9B,iBAAe;GACf,SAAQ;cAGR,oBAAC;IAAK,SAAQ;IAAW,OAAO,EAAE,MAAM,GAAG;IAAE,WAAU;cACpD,QAAQ;KACJ,EACP,oBAAC;IACC,IAAI;IACJ,MAAM;IACI;IACV,UAAS;IACT,KAAK;KACL;IACK;YAGX,oBAAC;GACC,OAAO,QAAQ;GACD;GACD;GACI;IACjB;GACkB"}

package/dist/LayoutMenu/LayoutMenu.d.ts

@@ -45,4 +45,5 @@ interface LayoutMenuProps extends WithChildrenProp {
 }
 declare const LayoutMenu: React$1.FC<LayoutMenuProps>;
 //#endregion
-export { LayoutMenu, LayoutMenuProps };
+export { LayoutMenu, LayoutMenuProps };
+//# sourceMappingURL=LayoutMenu.d.ts.map

package/dist/LayoutMenu/LayoutMenu.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"LayoutMenu.d.ts","names":[],"sources":["../../src/LayoutMenu/LayoutMenu.tsx"],"sourcesContent":[],"mappings":";;;;;;UAgBiB,eAAA,SAAwB;;AAAzC;;EASuB,UAAM,EAAA,MAAA;EAoBT;;;;EAmCP,QAAA,EAAA,CAvDA,OAwIZ,GAxIsB,OAAA,CAAM,SAuDK,CAAA,EAAA;;;;;;;;;;;;;;;;;;;;oBAnCd;;;;;oBAKA;;;;;cA8BP,YAAY,OAAA,CAAM,GAAG"}

package/dist/LayoutMenu/LayoutMenu.js

@@ -102,4 +102,5 @@ const LayoutMenu = ({ closeLabel, sections, onSectionToggle, selectedItem, mobil
 };
 
 //#endregion
-export { LayoutMenu };
+export { LayoutMenu };
+//# sourceMappingURL=LayoutMenu.js.map

package/dist/LayoutMenu/LayoutMenu.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"LayoutMenu.js","names":["LayoutMenu: React.FC<LayoutMenuProps>","React"],"sources":["../../src/LayoutMenu/LayoutMenu.tsx"],"sourcesContent":["import { Box, Flyout, StrokeButton, WithChildrenProp } from '@codecademy/gamut';\nimport { variant } from '@codecademy/gamut-styles';\nimport { Scale } from '@codecademy/variance/dist/types/config';\nimport styled from '@emotion/styled';\nimport { useState } from 'react';\nimport * as React from 'react';\n\nimport { LogoCodecademy } from '../Logos';\nimport {\n  AccordionMenu,\n  isSection,\n  Section,\n  SectionItem,\n} from './AccordionMenu';\nimport { LayoutMenuSection } from './LayoutMenuSection';\n\nexport interface LayoutMenuProps extends WithChildrenProp {\n  /**\n   * Accessibility label for the mobile Flyout's close button.\n   */\n  closeLabel: string;\n  /**\n   * An array of sections containing the title, slug, and items, each of which will become an accordion. Each item contains a title, slug, and onClick.\n   * Arbitrary react nodes can also be passed and will be rendered as-is.\n   */\n  sections: (Section | React.ReactNode)[];\n  /**\n   * The slug of the current selected item\n   */\n  selectedItem?: string;\n  /**\n   * Callback to be run on click of the accordion button\n   */\n  onSectionToggle: (sectionSlug: string) => void;\n  /**\n   * Text shown in mobile button that opens flyout on click\n   */\n  mobileButtonText: string;\n  /**\n   * Breakpoint above which the menu button displays as a full sidebar\n   */\n  breakpoint?: 'xs' | 'sm' | 'md' | 'lg' | 'xl';\n  /**\n   * An array of section items, each of which become an additional link on top of the accordion section.\n   */\n  topLinkSections?: SectionItem[];\n  /**\n   * Set fixed height for menu with overflow\n   */\n  menuHeight?: 'sm' | 'md' | 'lg';\n  verticalSpacing?: Scale<{\n    readonly property: 'padding';\n    readonly scale: 'spacing';\n  }>;\n}\n\nconst StyleBox = styled(Box)(\n  variant({\n    prop: 'menuHeight',\n    base: {\n      overflowY: 'auto',\n      overflowX: 'hidden',\n      paddingTop: '4px',\n      paddingLeft: '4px',\n    },\n    variants: {\n      sm: {\n        height: '630px',\n      },\n      md: {\n        height: '1000px',\n      },\n      lg: {\n        height: '1370px',\n        paddingLeft: '8px',\n      },\n    },\n  })\n);\n\nexport const LayoutMenu: React.FC<LayoutMenuProps> = ({\n  closeLabel,\n  sections,\n  onSectionToggle,\n  selectedItem,\n  mobileButtonText,\n  breakpoint = 'lg',\n  children,\n  topLinkSections,\n  menuHeight,\n  verticalSpacing,\n}) => {\n  const [expanded, setExpanded] = useState(false);\n\n  const accordionMenuSections = sections.map((section, i) => (\n    <Box as=\"li\" key={isSection(section) ? section.slug : i}>\n      {isSection(section) ? (\n        <AccordionMenu\n          section={section}\n          onSectionToggle={onSectionToggle}\n          onItemClick={() => setExpanded(false)}\n          selectedItem={selectedItem}\n          verticalSpacing={verticalSpacing}\n        />\n      ) : (\n        // eslint-disable-next-line react/no-array-index-key\n        <React.Fragment key={i}>{section}</React.Fragment>\n      )}\n    </Box>\n  ));\n\n  const topLinkLayoutMenuSections = topLinkSections && (\n    <Box as=\"li\">\n      <LayoutMenuSection\n        items={topLinkSections}\n        onItemClick={() => setExpanded(false)}\n        selectedItem={selectedItem}\n        pb={32}\n      />\n    </Box>\n  );\n\n  return (\n    <nav>\n      <Box display={{ _: 'block', [breakpoint]: 'none' }}>\n        <Flyout\n          closeLabel={closeLabel}\n          expanded={expanded}\n          onClose={() => setExpanded(false)}\n          title={<LogoCodecademy mb={32} />}\n        >\n          <Box as=\"ul\" listStyleType=\"none\" py={0} px={16} m={0}>\n            {topLinkLayoutMenuSections}\n            {accordionMenuSections}\n            {children ? <Box as=\"li\">{children}</Box> : null}\n          </Box>\n        </Flyout>\n        <StrokeButton\n          aria-expanded={expanded}\n          variant=\"secondary\"\n          width={1}\n          onClick={() => setExpanded(true)}\n        >\n          {mobileButtonText}\n        </StrokeButton>\n      </Box>\n      <StyleBox\n        as=\"ul\"\n        listStyleType=\"none\"\n        p={0}\n        m={0}\n        menuHeight={menuHeight}\n        display={{ _: 'none', [breakpoint]: 'block' }}\n        data-testid=\"desktop-menu\"\n      >\n        {topLinkLayoutMenuSections}\n        {accordionMenuSections}\n        {children ? <Box as=\"li\">{children}</Box> : null}\n      </StyleBox>\n    </nav>\n  );\n};\n"],"mappings":";;;;;;;;;;;AAwDA,MAAM,WAAW,OAAO,IAAI,CAC1B,QAAQ;CACN,MAAM;CACN,MAAM;EACJ,WAAW;EACX,WAAW;EACX,YAAY;EACZ,aAAa;EACd;CACD,UAAU;EACR,IAAI,EACF,QAAQ,SACT;EACD,IAAI,EACF,QAAQ,UACT;EACD,IAAI;GACF,QAAQ;GACR,aAAa;GACd;EACF;CACF,CAAC,CACH;AAED,MAAaA,cAAyC,EACpD,YACA,UACA,iBACA,cACA,kBACA,aAAa,MACb,UACA,iBACA,YACA,sBACI;CACJ,MAAM,CAAC,UAAU,eAAe,SAAS,MAAM;CAE/C,MAAM,wBAAwB,SAAS,KAAK,SAAS,MACnD,oBAAC;EAAI,IAAG;YACL,UAAU,QAAQ,GACjB,oBAAC;GACU;GACQ;GACjB,mBAAmB,YAAY,MAAM;GACvB;GACG;IACjB,GAGF,oBAACC,QAAM,sBAAkB,WAAJ,EAA6B;IAXpC,UAAU,QAAQ,GAAG,QAAQ,OAAO,EAahD,CACN;CAEF,MAAM,4BAA4B,mBAChC,oBAAC;EAAI,IAAG;YACN,oBAAC;GACC,OAAO;GACP,mBAAmB,YAAY,MAAM;GACvB;GACd,IAAI;IACJ;GACE;AAGR,QACE,qBAAC,oBACC,qBAAC;EAAI,SAAS;GAAE,GAAG;IAAU,aAAa;GAAQ;aAChD,oBAAC;GACa;GACF;GACV,eAAe,YAAY,MAAM;GACjC,OAAO,oBAAC,kBAAe,IAAI,KAAM;aAEjC,qBAAC;IAAI,IAAG;IAAK,eAAc;IAAO,IAAI;IAAG,IAAI;IAAI,GAAG;;KACjD;KACA;KACA,WAAW,oBAAC;MAAI,IAAG;MAAM;OAAe,GAAG;;KACxC;IACC,EACT,oBAAC;GACC,iBAAe;GACf,SAAQ;GACR,OAAO;GACP,eAAe,YAAY,KAAK;aAE/B;IACY;GACX,EACN,qBAAC;EACC,IAAG;EACH,eAAc;EACd,GAAG;EACH,GAAG;EACS;EACZ,SAAS;GAAE,GAAG;IAAS,aAAa;GAAS;EAC7C,eAAY;;GAEX;GACA;GACA,WAAW,oBAAC;IAAI,IAAG;IAAM;KAAe,GAAG;;GACnC,IACP"}

package/dist/LayoutMenu/LayoutMenuSection.js

@@ -33,4 +33,5 @@ const LayoutMenuSection = ({ items, selectedItem, onItemClick, verticalSpacing =
 });
 
 //#endregion
-export { LayoutMenuSection };
+export { LayoutMenuSection };
+//# sourceMappingURL=LayoutMenuSection.js.map

package/dist/LayoutMenu/LayoutMenuSection.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"LayoutMenuSection.js","names":["LayoutMenuSection: React.FC<LayoutMenuSectionProps>"],"sources":["../../src/LayoutMenu/LayoutMenuSection.tsx"],"sourcesContent":["import { Box, FlexBox } from '@codecademy/gamut';\nimport { system } from '@codecademy/gamut-styles';\nimport { StyleProps } from '@codecademy/variance';\nimport { Scale } from '@codecademy/variance/dist/types/config';\nimport * as React from 'react';\n\nimport { SectionItem } from './AccordionMenu';\nimport { SectionItemLink } from './SectionItemLink';\nimport { SelectedSectionItem } from './SelectedSectionItem';\n\nexport type LayoutMenuSectionStyles = StyleProps<typeof system.space>;\n\nexport type LayoutMenuSectionProps = LayoutMenuSectionStyles & {\n  items: SectionItem[];\n  selectedItem?: string;\n  onItemClick: () => void;\n  verticalSpacing?: Scale<{\n    readonly property: 'padding';\n    readonly scale: 'spacing';\n  }>;\n};\n\nexport const LayoutMenuSection: React.FC<LayoutMenuSectionProps> = ({\n  items,\n  selectedItem,\n  onItemClick,\n  verticalSpacing = 8,\n  ...styleProps\n}) => (\n  <Box as=\"ul\" listStyleType=\"none\" p={0} m={0} {...styleProps}>\n    {items.map((item) => (\n      <Box as=\"li\" key={item.slug} py={verticalSpacing} px={4}>\n        {selectedItem === item.slug ? (\n          <SelectedSectionItem>\n            <FlexBox alignItems=\"center\">\n              {item.title}\n              {item.badge}\n            </FlexBox>\n          </SelectedSectionItem>\n        ) : (\n          <SectionItemLink\n            href={item.href}\n            onClick={(event) => {\n              item.onClick(event);\n              onItemClick();\n            }}\n          >\n            <FlexBox alignItems=\"center\">\n              {item.title}\n              {item.badge}\n            </FlexBox>\n          </SectionItemLink>\n        )}\n      </Box>\n    ))}\n  </Box>\n);\n"],"mappings":";;;;;;;AAsBA,MAAaA,qBAAuD,EAClE,OACA,cACA,aACA,kBAAkB,GAClB,GAAG,iBAEH,oBAAC;CAAI,IAAG;CAAK,eAAc;CAAO,GAAG;CAAG,GAAG;CAAG,GAAI;WAC/C,MAAM,KAAK,SACV,oBAAC;EAAI,IAAG;EAAqB,IAAI;EAAiB,IAAI;YACnD,iBAAiB,KAAK,OACrB,oBAAC,iCACC,qBAAC;GAAQ,YAAW;cACjB,KAAK,OACL,KAAK;IACE,GACU,GAEtB,oBAAC;GACC,MAAM,KAAK;GACX,UAAU,UAAU;AAClB,SAAK,QAAQ,MAAM;AACnB,iBAAa;;aAGf,qBAAC;IAAQ,YAAW;eACjB,KAAK,OACL,KAAK;KACE;IACM;IApBJ,KAAK,KAsBjB,CACN;EACE"}

package/dist/LayoutMenu/SectionItemLink.d.ts

@@ -8,4 +8,5 @@ interface SectionItemLinkProps extends WithChildrenProp {
 }
 declare const SectionItemLink: React$1.FC<SectionItemLinkProps>;
 //#endregion
-export { SectionItemLink, SectionItemLinkProps };
+export { SectionItemLink, SectionItemLinkProps };
+//# sourceMappingURL=SectionItemLink.d.ts.map

package/dist/LayoutMenu/SectionItemLink.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SectionItemLink.d.ts","names":[],"sources":["../../src/LayoutMenu/SectionItemLink.tsx"],"sourcesContent":[],"mappings":";;;;UAGiB,oBAAA,SAA6B;mBAC3B,OAAA,CAAM;EADR,IAAA,EAAA,MAAA;AAKjB;cAAa,iBAAiB,OAAA,CAAM,GAAG"}

package/dist/LayoutMenu/SectionItemLink.js

@@ -14,4 +14,5 @@ const SectionItemLink = ({ onClick, href, children }) => {
 };
 
 //#endregion
-export { SectionItemLink };
+export { SectionItemLink };
+//# sourceMappingURL=SectionItemLink.js.map

package/dist/LayoutMenu/SectionItemLink.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SectionItemLink.js","names":["SectionItemLink: React.FC<SectionItemLinkProps>"],"sources":["../../src/LayoutMenu/SectionItemLink.tsx"],"sourcesContent":["import { Anchor, WithChildrenProp } from '@codecademy/gamut';\nimport * as React from 'react';\n\nexport interface SectionItemLinkProps extends WithChildrenProp {\n  onClick: (event: React.MouseEvent) => void;\n  href: string;\n}\n\nexport const SectionItemLink: React.FC<SectionItemLinkProps> = ({\n  onClick,\n  href,\n  children,\n}) => {\n  return (\n    <Anchor variant=\"interface\" display=\"block\" href={href} onClick={onClick}>\n      {children}\n    </Anchor>\n  );\n};\n"],"mappings":";;;;;AAQA,MAAaA,mBAAmD,EAC9D,SACA,MACA,eACI;AACJ,QACE,oBAAC;EAAO,SAAQ;EAAY,SAAQ;EAAc;EAAe;EAC9D;GACM"}

package/dist/LayoutMenu/SelectedSectionItem.d.ts

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

package/dist/LayoutMenu/SelectedSectionItem.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SelectedSectionItem.d.ts","names":[],"sources":["../../src/LayoutMenu/SelectedSectionItem.tsx"],"sourcesContent":[],"mappings":";;;;cAGa,qBAAqB,OAAA,CAAM,GAAG"}

package/dist/LayoutMenu/SelectedSectionItem.js

@@ -17,4 +17,5 @@ const SelectedSectionItem = ({ children }) => {
 };
 
 //#endregion
-export { SelectedSectionItem };
+export { SelectedSectionItem };
+//# sourceMappingURL=SelectedSectionItem.js.map

package/dist/LayoutMenu/SelectedSectionItem.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SelectedSectionItem.js","names":["SelectedSectionItem: React.FC<WithChildrenProp>"],"sources":["../../src/LayoutMenu/SelectedSectionItem.tsx"],"sourcesContent":["import { Box, Text, WithChildrenProp } from '@codecademy/gamut';\nimport * as React from 'react';\n\nexport const SelectedSectionItem: React.FC<WithChildrenProp> = ({\n  children,\n}) => {\n  return (\n    <Box borderLeft={1} borderWidthLeft=\"6px\" pl={12} aria-current=\"true\">\n      <Text fontWeight=\"title\">{children}</Text>\n    </Box>\n  );\n};\n"],"mappings":";;;;;AAGA,MAAaA,uBAAmD,EAC9D,eACI;AACJ,QACE,oBAAC;EAAI,YAAY;EAAG,iBAAgB;EAAM,IAAI;EAAI,gBAAa;YAC7D,oBAAC;GAAK,YAAW;GAAS;IAAgB;GACtC"}

package/dist/LayoutMenuVariant/AccordionMenu.d.ts

@@ -16,4 +16,5 @@ type Section = {
   items: SectionItem[];
 };
 //#endregion
-export { Section, SectionItem };
+export { Section, SectionItem };
+//# sourceMappingURL=AccordionMenu.d.ts.map

package/dist/LayoutMenuVariant/AccordionMenu.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AccordionMenu.d.ts","names":[],"sources":["../../src/LayoutMenuVariant/AccordionMenu.tsx"],"sourcesContent":[],"mappings":";;;;KAuCY,WAAA;;EAAA,IAAA,EAAA,MAAA;EAIO,IAAM,EAAA,MAAA;EACf,OAAI,EAAA,CAAA,KAAA,EADK,KAAA,CAAM,UACX,EAAA,GAAA,IAAA;EAC0B,KAAA,CAAA,EAD9B,GAAA,CAAI,OAC0B;EAA5B,OAAM,CAAA,EAAN,KAAA,CAAM,cAAA,CAAA,OAAsB,MAAtB,CAAA,CAAA,SAAA,CAAA;CAAc;AAGpB,KAAA,OAAA,GAAO;;;SAGV"}

package/dist/LayoutMenuVariant/AccordionMenu.js

@@ -70,4 +70,5 @@ const AccordionMenu = ({ section, onSectionToggle, onItemClick }) => {
 };
 
 //#endregion
-export { AccordionMenu };
+export { AccordionMenu };
+//# sourceMappingURL=AccordionMenu.js.map

package/dist/LayoutMenuVariant/AccordionMenu.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AccordionMenu.js","names":["theme","AccordionMenu: React.FC<AccordionMenuProps>"],"sources":["../../src/LayoutMenuVariant/AccordionMenu.tsx"],"sourcesContent":["import { AccordionAreaDeprecated, Anchor, Box, Text } from '@codecademy/gamut';\nimport { MiniChevronDownIcon } from '@codecademy/gamut-icons';\nimport { css, states, transitionConcat } from '@codecademy/gamut-styles';\nimport { StyleProps } from '@codecademy/variance';\nimport styled from '@emotion/styled';\nimport React, { useState } from 'react';\n\nimport { LayoutMenuSection } from './LayoutMenuSection';\n\nconst StyledAccordionArea = styled(AccordionAreaDeprecated)`\n  padding-block: ${({ theme }) => theme.spacing[16]};\n  position: relative;\n  left: -4px;\n\n  &:not(:first-child) {\n    border-top: 1px solid ${({ theme }) => theme.colors['navy-300']};\n  }\n`;\n\nconst StyledAnchor = styled(Anchor)`\n  :hover {\n    color: inherit;\n  }\n`;\n\nconst chevronStates = states({\n  expanded: { transform: 'rotate(180deg)' },\n});\n\nconst ExpandChevron = styled(MiniChevronDownIcon)<\n  StyleProps<typeof chevronStates>\n>(\n  css({\n    transform: 'rotate(0deg)',\n    transition: transitionConcat(['transform'], 'slow', 'ease-out'),\n  }),\n  chevronStates\n);\n\nexport type SectionItem = {\n  title: string;\n  slug: string;\n  href: string;\n  onClick: (event: React.MouseEvent) => void;\n  badge?: JSX.Element;\n  variant?: React.ComponentProps<typeof Anchor>['variant'];\n};\n\nexport type Section = {\n  title: string;\n  slug: string;\n  items: SectionItem[];\n};\n\nexport type AccordionMenuProps = {\n  section: Section;\n  onSectionToggle: (sectionSlug: string) => void;\n  onItemClick: () => void;\n};\n\nexport const AccordionMenu: React.FC<AccordionMenuProps> = ({\n  section,\n  onSectionToggle,\n  onItemClick,\n}) => {\n  const [expanded, setExpanded] = useState(true);\n\n  return (\n    <StyledAccordionArea\n      expanded={expanded}\n      top={\n        <StyledAnchor\n          variant=\"interface\"\n          pb={12}\n          px={4}\n          onClick={() => {\n            onSectionToggle(section.slug);\n            setExpanded((prev) => !prev);\n          }}\n          aria-expanded={expanded}\n          display=\"flex\"\n          width=\"100%\"\n        >\n          <Box display=\"flex\" justifyContent=\"space-between\" width=\"100%\">\n            <Text\n              variant=\"p-small\"\n              // eslint-disable-next-line gamut/no-inline-style\n              style={{ flex: 1, fontWeight: 'bold' }}\n              textAlign=\"left\"\n            >\n              {section.title}\n            </Text>\n            <ExpandChevron\n              ml={12}\n              size={16}\n              expanded={expanded}\n              position=\"relative\"\n              top={4}\n            />\n          </Box>\n        </StyledAnchor>\n      }\n    >\n      <LayoutMenuSection items={section.items} onItemClick={onItemClick} />\n    </StyledAccordionArea>\n  );\n};\n"],"mappings":";;;;;;;;;AASA,MAAM,sBAAsB,OAAO,wBAAwB;oBACvC,EAAE,qBAAYA,QAAM,QAAQ,IAAI;;;;;6BAKvB,EAAE,qBAAYA,QAAM,OAAO,YAAY;;;AAIpE,MAAM,eAAe,OAAO,OAAO;;;;;AAMnC,MAAM,gBAAgB,OAAO,EAC3B,UAAU,EAAE,WAAW,kBAAkB,EAC1C,CAAC;AAEF,MAAM,gBAAgB,OAAO,oBAAoB,CAG/C,IAAI;CACF,WAAW;CACX,YAAY,iBAAiB,CAAC,YAAY,EAAE,QAAQ,WAAW;CAChE,CAAC,EACF,cACD;AAuBD,MAAaC,iBAA+C,EAC1D,SACA,iBACA,kBACI;CACJ,MAAM,CAAC,UAAU,eAAe,SAAS,KAAK;AAE9C,QACE,oBAAC;EACW;EACV,KACE,oBAAC;GACC,SAAQ;GACR,IAAI;GACJ,IAAI;GACJ,eAAe;AACb,oBAAgB,QAAQ,KAAK;AAC7B,iBAAa,SAAS,CAAC,KAAK;;GAE9B,iBAAe;GACf,SAAQ;GACR,OAAM;aAEN,qBAAC;IAAI,SAAQ;IAAO,gBAAe;IAAgB,OAAM;eACvD,oBAAC;KACC,SAAQ;KAER,OAAO;MAAE,MAAM;MAAG,YAAY;MAAQ;KACtC,WAAU;eAET,QAAQ;MACJ,EACP,oBAAC;KACC,IAAI;KACJ,MAAM;KACI;KACV,UAAS;KACT,KAAK;MACL;KACE;IACO;YAGjB,oBAAC;GAAkB,OAAO,QAAQ;GAAoB;IAAe;GACjD"}

package/dist/LayoutMenuVariant/LayoutMenu.d.ts

@@ -40,4 +40,5 @@ interface LayoutMenuProps extends WithChildrenProp {
 }
 declare const LayoutMenu: React.FC<LayoutMenuProps>;
 //#endregion
-export { LayoutMenu, LayoutMenuProps };
+export { LayoutMenu, LayoutMenuProps };
+//# sourceMappingURL=LayoutMenu.d.ts.map

package/dist/LayoutMenuVariant/LayoutMenu.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"LayoutMenu.d.ts","names":[],"sources":["../../src/LayoutMenuVariant/LayoutMenu.tsx"],"sourcesContent":[],"mappings":";;;;;;UAUiB,eAAA,SAAwB;;AAAzC;;EAoBmC,UAAA,EAAA,MAAA;EAAd;;;EApBoC,QAAA,EAQ7C,OAR6C,EAAA;EA6D5C;;;;;;;;;;;qBAzCQ,cAAc;;;;;;;;oBAQf;;;;;;cAiCP,YAAY,KAAA,CAAM,GAAG"}

package/dist/LayoutMenuVariant/LayoutMenu.js

@@ -82,4 +82,5 @@ const LayoutMenu = ({ closeLabel, sections, onSectionToggle, mobileButtonText, m
 };
 
 //#endregion
-export { LayoutMenu };
+export { LayoutMenu };
+//# sourceMappingURL=LayoutMenu.js.map

package/dist/LayoutMenuVariant/LayoutMenu.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"LayoutMenu.js","names":["LayoutMenu: React.FC<LayoutMenuProps>"],"sources":["../../src/LayoutMenuVariant/LayoutMenu.tsx"],"sourcesContent":["import { Box, Flyout, StrokeButton, WithChildrenProp } from '@codecademy/gamut';\nimport { GamutIconProps } from '@codecademy/gamut-icons';\nimport { variant } from '@codecademy/gamut-styles';\nimport styled from '@emotion/styled';\nimport React, { ComponentType, useState } from 'react';\n\nimport { LogoCodecademy } from '../Logos';\nimport { AccordionMenu, Section, SectionItem } from './AccordionMenu';\nimport { LayoutMenuSection } from './LayoutMenuSection';\n\nexport interface LayoutMenuProps extends WithChildrenProp {\n  /**\n   * Accessibility label for the mobile Flyout's close button.\n   */\n  closeLabel: string;\n  /**\n   * An array of sections containing the title, slug, and items, each of which will become an accordion. Each item contains a title, slug, and onClick.\n   */\n  sections: Section[];\n  /**\n   * Callback to be run on click of the accordion button\n   */\n  onSectionToggle: (sectionSlug: string) => void;\n  /**\n   * Text shown in mobile button that opens flyout on click\n   */\n  mobileButtonText: string;\n  /**\n   * Icon shown in mobile button that opens flyout on click\n   */\n  mobileButtonIcon?: ComponentType<GamutIconProps>;\n  /**\n   * Breakpoint above which the menu button displays as a full sidebar\n   */\n  breakpoint?: 'xs' | 'sm' | 'md' | 'lg' | 'xl';\n  /**\n   * An array of section items, each of which become an additional link on top of the accordion section.\n   */\n  topLinkSections?: SectionItem[];\n  /**\n   * Set fixed height for menu with overflow\n   */\n  menuHeight?: 'sm' | 'md' | 'lg';\n}\n\nconst StyleBox = styled(Box)(\n  variant({\n    prop: 'menuHeight',\n    base: {\n      borderColor: 'black',\n      borderStyleBottom: 'solid',\n      borderWidthBottom: '1px',\n      overflowY: 'auto',\n      overflowX: 'hidden',\n      paddingTop: '4px',\n      paddingLeft: '4px',\n    },\n    variants: {\n      sm: {\n        height: '630px',\n      },\n      md: {\n        height: '1000px',\n      },\n      lg: {\n        height: '1370px',\n      },\n    },\n  })\n);\n\nexport const LayoutMenu: React.FC<LayoutMenuProps> = ({\n  closeLabel,\n  sections,\n  onSectionToggle,\n  mobileButtonText,\n  mobileButtonIcon,\n  breakpoint = 'lg',\n  children,\n  topLinkSections,\n  menuHeight,\n}) => {\n  const [expanded, setExpanded] = useState(false);\n\n  const accordionMenuSections = sections.map((section) => (\n    <AccordionMenu\n      key={section.slug}\n      section={section}\n      onSectionToggle={onSectionToggle}\n      onItemClick={() => setExpanded(false)}\n    />\n  ));\n\n  const topLinkLayoutMenuSections = topLinkSections && (\n    <LayoutMenuSection\n      items={topLinkSections}\n      onItemClick={() => setExpanded(false)}\n      pb={32}\n    />\n  );\n\n  return (\n    <nav aria-label=\"Secondary\">\n      <Box display={{ _: 'block', [breakpoint]: 'none' }}>\n        <Flyout\n          closeLabel={closeLabel}\n          expanded={expanded}\n          onClose={() => setExpanded(false)}\n          title={<LogoCodecademy mb={32} />}\n        >\n          <Box px={24}>\n            {topLinkLayoutMenuSections}\n            {accordionMenuSections}\n            {children}\n          </Box>\n        </Flyout>\n        <StrokeButton\n          aria-expanded={expanded}\n          variant=\"secondary\"\n          width={1}\n          icon={mobileButtonIcon}\n          onClick={() => setExpanded(true)}\n        >\n          {mobileButtonText}\n        </StrokeButton>\n      </Box>\n      <StyleBox\n        menuHeight={menuHeight}\n        display={{ _: 'none', [breakpoint]: 'block' }}\n        data-testid=\"desktop-menu\"\n      >\n        {topLinkLayoutMenuSections}\n        {accordionMenuSections}\n        {children}\n      </StyleBox>\n    </nav>\n  );\n};\n"],"mappings":";;;;;;;;;;AA6CA,MAAM,WAAW,OAAO,IAAI,CAC1B,QAAQ;CACN,MAAM;CACN,MAAM;EACJ,aAAa;EACb,mBAAmB;EACnB,mBAAmB;EACnB,WAAW;EACX,WAAW;EACX,YAAY;EACZ,aAAa;EACd;CACD,UAAU;EACR,IAAI,EACF,QAAQ,SACT;EACD,IAAI,EACF,QAAQ,UACT;EACD,IAAI,EACF,QAAQ,UACT;EACF;CACF,CAAC,CACH;AAED,MAAaA,cAAyC,EACpD,YACA,UACA,iBACA,kBACA,kBACA,aAAa,MACb,UACA,iBACA,iBACI;CACJ,MAAM,CAAC,UAAU,eAAe,SAAS,MAAM;CAE/C,MAAM,wBAAwB,SAAS,KAAK,YAC1C,oBAAC;EAEU;EACQ;EACjB,mBAAmB,YAAY,MAAM;IAHhC,QAAQ,KAIb,CACF;CAEF,MAAM,4BAA4B,mBAChC,oBAAC;EACC,OAAO;EACP,mBAAmB,YAAY,MAAM;EACrC,IAAI;GACJ;AAGJ,QACE,qBAAC;EAAI,cAAW;aACd,qBAAC;GAAI,SAAS;IAAE,GAAG;KAAU,aAAa;IAAQ;cAChD,oBAAC;IACa;IACF;IACV,eAAe,YAAY,MAAM;IACjC,OAAO,oBAAC,kBAAe,IAAI,KAAM;cAEjC,qBAAC;KAAI,IAAI;;MACN;MACA;MACA;;MACG;KACC,EACT,oBAAC;IACC,iBAAe;IACf,SAAQ;IACR,OAAO;IACP,MAAM;IACN,eAAe,YAAY,KAAK;cAE/B;KACY;IACX,EACN,qBAAC;GACa;GACZ,SAAS;IAAE,GAAG;KAAS,aAAa;IAAS;GAC7C,eAAY;;IAEX;IACA;IACA;;IACQ;GACP"}

package/dist/LayoutMenuVariant/LayoutMenuSection.js

@@ -31,4 +31,5 @@ const LayoutMenuSection = ({ items, onItemClick, ...styleProps }) => /* @__PURE_
 });
 
 //#endregion
-export { LayoutMenuSection };
+export { LayoutMenuSection };
+//# sourceMappingURL=LayoutMenuSection.js.map

package/dist/LayoutMenuVariant/LayoutMenuSection.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"LayoutMenuSection.js","names":["LayoutMenuSection: React.FC<LayoutMenuSectionProps>"],"sources":["../../src/LayoutMenuVariant/LayoutMenuSection.tsx"],"sourcesContent":["import { Box, FlexBox } from '@codecademy/gamut';\nimport { system } from '@codecademy/gamut-styles';\nimport { StyleProps } from '@codecademy/variance';\nimport styled from '@emotion/styled';\nimport React from 'react';\n\nimport { SectionItem } from './AccordionMenu';\nimport { SectionItemLink } from './SectionItemLink';\n\nexport type LayoutMenuSectionStyles = StyleProps<typeof system.space>;\n\nexport type LayoutMenuSectionProps = LayoutMenuSectionStyles & {\n  items: SectionItem[];\n  onItemClick: () => void;\n};\n\nconst StyledBox = styled(Box)`\n  list-style: none;\n`;\nexport const LayoutMenuSection: React.FC<LayoutMenuSectionProps> = ({\n  items,\n  onItemClick,\n  ...styleProps\n}) => (\n  <Box {...styleProps} as=\"menu\" px={4} m={0}>\n    {items.map((item) => (\n      <StyledBox key={item.slug} as=\"li\">\n        <SectionItemLink\n          href={item.href}\n          onClick={(event) => {\n            item.onClick(event);\n            onItemClick();\n          }}\n          variant={item.variant ?? 'interface'}\n        >\n          <FlexBox alignItems=\"center\">\n            {item.title}\n            {item.badge}\n          </FlexBox>\n        </SectionItemLink>\n      </StyledBox>\n    ))}\n  </Box>\n);\n"],"mappings":";;;;;;;AAgBA,MAAM,YAAY,OAAO,IAAI;;;AAG7B,MAAaA,qBAAuD,EAClE,OACA,aACA,GAAG,iBAEH,oBAAC;CAAI,GAAI;CAAY,IAAG;CAAO,IAAI;CAAG,GAAG;WACtC,MAAM,KAAK,SACV,oBAAC;EAA0B,IAAG;YAC5B,oBAAC;GACC,MAAM,KAAK;GACX,UAAU,UAAU;AAClB,SAAK,QAAQ,MAAM;AACnB,iBAAa;;GAEf,SAAS,KAAK,WAAW;aAEzB,qBAAC;IAAQ,YAAW;eACjB,KAAK,OACL,KAAK;KACE;IACM;IAbJ,KAAK,KAcT,CACZ;EACE"}

package/dist/LayoutMenuVariant/SectionItemLink.d.ts

@@ -9,4 +9,5 @@ interface SectionItemLinkProps extends WithChildrenProp {
 }
 declare const SectionItemLink: React.FC<SectionItemLinkProps>;
 //#endregion
-export { SectionItemLink, SectionItemLinkProps };
+export { SectionItemLink, SectionItemLinkProps };
+//# sourceMappingURL=SectionItemLink.d.ts.map

package/dist/LayoutMenuVariant/SectionItemLink.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SectionItemLink.d.ts","names":[],"sources":["../../src/LayoutMenuVariant/SectionItemLink.tsx"],"sourcesContent":[],"mappings":";;;;UAGiB,oBAAA,SAA6B;mBAC3B,KAAA,CAAM;EADR,IAAA,EAAA,MAAA;EACE,OAAM,CAAA,EAEb,KAAA,CAAM,cAFO,CAAA,OAEe,MAFf,CAAA,CAAA,SAAA,CAAA;;AAEP,cAGL,eAHK,EAGY,KAAA,CAAM,EAHlB,CAGqB,oBAHrB,CAAA"}

package/dist/LayoutMenuVariant/SectionItemLink.js

@@ -14,4 +14,5 @@ const SectionItemLink = ({ onClick, href, variant = "interface", children }) =>
 };
 
 //#endregion
-export { SectionItemLink };
+export { SectionItemLink };
+//# sourceMappingURL=SectionItemLink.js.map

package/dist/LayoutMenuVariant/SectionItemLink.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SectionItemLink.js","names":["SectionItemLink: React.FC<SectionItemLinkProps>"],"sources":["../../src/LayoutMenuVariant/SectionItemLink.tsx"],"sourcesContent":["import { Anchor, WithChildrenProp } from '@codecademy/gamut';\nimport React from 'react';\n\nexport interface SectionItemLinkProps extends WithChildrenProp {\n  onClick: (event: React.MouseEvent) => void;\n  href: string;\n  variant?: React.ComponentProps<typeof Anchor>['variant'];\n}\n\nexport const SectionItemLink: React.FC<SectionItemLinkProps> = ({\n  onClick,\n  href,\n  variant = 'interface',\n  children,\n}) => {\n  return (\n    <Anchor variant={variant} display=\"block\" href={href} onClick={onClick}>\n      {children}\n    </Anchor>\n  );\n};\n"],"mappings":";;;;;AASA,MAAaA,mBAAmD,EAC9D,SACA,MACA,UAAU,aACV,eACI;AACJ,QACE,oBAAC;EAAgB;EAAS,SAAQ;EAAc;EAAe;EAC5D;GACM"}

package/dist/LayoutMenuVariant/index.d.ts

@@ -6,4 +6,5 @@ declare namespace index_d_exports {
   export { LayoutMenu, LayoutMenuProps, SectionItemLink, SectionItemLinkProps };
 }
 //#endregion
-export { LayoutMenu, LayoutMenuProps, SectionItemLink, SectionItemLinkProps, index_d_exports };
+export { LayoutMenu, LayoutMenuProps, SectionItemLink, SectionItemLinkProps, index_d_exports };
+//# sourceMappingURL=index.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","names":[],"sources":["../../src/LayoutMenuVariant/index.ts"],"sourcesContent":[],"mappings":""}

package/dist/LayoutMenuVariant/index.js

@@ -9,4 +9,5 @@ var LayoutMenuVariant_exports = /* @__PURE__ */ __export({
 });
 
 //#endregion
-export { LayoutMenu, LayoutMenuVariant_exports, SectionItemLink };
+export { LayoutMenu, LayoutMenuVariant_exports, SectionItemLink };
+//# sourceMappingURL=index.js.map

package/dist/LayoutMenuVariant/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":[],"sources":["../../src/LayoutMenuVariant/index.ts"],"sourcesContent":["export * from './LayoutMenu';\nexport * from './SectionItemLink';\n"],"mappings":""}

package/dist/LearningOutcomeAssessmentScores/AssessmentDetail.js

@@ -47,4 +47,5 @@ const AssessmentDetail = ({ isHighestScore, score, scoreAchievedAt }) => {
 };
 
 //#endregion
-export { AssessmentDetail };
+export { AssessmentDetail };
+//# sourceMappingURL=AssessmentDetail.js.map

package/dist/LearningOutcomeAssessmentScores/AssessmentDetail.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AssessmentDetail.js","names":["AssessmentDetail: React.FC<AssessmentDetailProps>"],"sources":["../../src/LearningOutcomeAssessmentScores/AssessmentDetail.tsx"],"sourcesContent":["import { Box, FlexBox, Text } from '@codecademy/gamut';\nimport React from 'react';\n\ninterface AssessmentDetailProps {\n  isHighestScore?: boolean;\n  score?: number | null;\n  scoreAchievedAt?: string | null;\n}\n\nexport const AssessmentDetail: React.FC<AssessmentDetailProps> = ({\n  isHighestScore,\n  score,\n  scoreAchievedAt,\n}) => {\n  const hasPassedAssessment = score && score >= 70;\n\n  return (\n    <FlexBox\n      borderColor=\"background-hover\"\n      borderRight={isHighestScore ? 1 : 'none'}\n      width=\"100%\"\n      p={16}\n      column\n    >\n      <Text fontWeight={700}>\n        {isHighestScore ? 'Highest score' : 'Most recent'}\n      </Text>\n      {score != null ? (\n        <>\n          <FlexBox mt={8} alignItems=\"center\">\n            <Text\n              variant=\"title-sm\"\n              data-testid=\"score-percent\"\n              mr={4}\n              color={hasPassedAssessment ? 'green-700' : undefined}\n            >\n              {`${score}%`}\n            </Text>\n            <Box>\n              {!hasPassedAssessment && (\n                <Box\n                  data-testid=\"failed-assessment-indicator\"\n                  borderRadius=\"full\"\n                  dimensions={16}\n                  bg=\"orange-500\"\n                  mb={4}\n                />\n              )}\n            </Box>\n          </FlexBox>\n          {!!scoreAchievedAt && (\n            <Text textColor=\"text-secondary\">{scoreAchievedAt}</Text>\n          )}\n        </>\n      ) : (\n        <FlexBox column color=\"text-secondary\">\n          <Text fontWeight={700} my={4} aria-hidden>\n            -\n          </Text>\n          <Text>Not tested yet</Text>\n        </FlexBox>\n      )}\n    </FlexBox>\n  );\n};\n"],"mappings":";;;;;AASA,MAAaA,oBAAqD,EAChE,gBACA,OACA,sBACI;CACJ,MAAM,sBAAsB,SAAS,SAAS;AAE9C,QACE,qBAAC;EACC,aAAY;EACZ,aAAa,iBAAiB,IAAI;EAClC,OAAM;EACN,GAAG;EACH;aAEA,oBAAC;GAAK,YAAY;aACf,iBAAiB,kBAAkB;IAC/B,EACN,SAAS,OACR,4CACE,qBAAC;GAAQ,IAAI;GAAG,YAAW;cACzB,oBAAC;IACC,SAAQ;IACR,eAAY;IACZ,IAAI;IACJ,OAAO,sBAAsB,cAAc;cAE1C,GAAG,MAAM;KACL,EACP,oBAAC,iBACE,CAAC,uBACA,oBAAC;IACC,eAAY;IACZ,cAAa;IACb,YAAY;IACZ,IAAG;IACH,IAAI;KACJ,GAEA;IACE,EACT,CAAC,CAAC,mBACD,oBAAC;GAAK,WAAU;aAAkB;IAAuB,IAE1D,GAEH,qBAAC;GAAQ;GAAO,OAAM;cACpB,oBAAC;IAAK,YAAY;IAAK,IAAI;IAAG;cAAY;KAEnC,EACP,oBAAC,kBAAK,mBAAqB;IACnB;GAEJ"}

package/dist/LearningOutcomeAssessmentScores/index.d.ts

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

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","names":[],"sources":["../../src/LearningOutcomeAssessmentScores/index.tsx"],"sourcesContent":[],"mappings":";UAIU,qBAAA;EAAA,YAAA,EAAA,MAAA,GAAA,IAAqB,GAAA,SAAA;EAOlB,sBAAA,EAAA,MAAA,GAAA,IA0BZ,GAAA,SAzBC;;;;cADW,iCAAiC,KAAA,CAAM,GAClD"}

package/dist/LearningOutcomeAssessmentScores/index.js

@@ -21,4 +21,5 @@ const LearningOutcomeAssessmentScores = ({ highestScore, highestScoreAchievedAt,
 };
 
 //#endregion
-export { LearningOutcomeAssessmentScores };
+export { LearningOutcomeAssessmentScores };
+//# sourceMappingURL=index.js.map

package/dist/LearningOutcomeAssessmentScores/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":["LearningOutcomeAssessmentScores: React.FC<\n  AssessmentScoresProps\n>"],"sources":["../../src/LearningOutcomeAssessmentScores/index.tsx"],"sourcesContent":["import { FlexBox } from '@codecademy/gamut';\n\nimport { AssessmentDetail } from './AssessmentDetail';\n\ninterface AssessmentScoresProps {\n  highestScore: number | null | undefined;\n  highestScoreAchievedAt: string | null | undefined;\n  latestScore: number | null | undefined;\n  latestScoreAchievedAt: string | null | undefined;\n}\n\nexport const LearningOutcomeAssessmentScores: React.FC<\n  AssessmentScoresProps\n> = ({\n  highestScore,\n  highestScoreAchievedAt,\n  latestScore,\n  latestScoreAchievedAt,\n}) => {\n  return (\n    <FlexBox\n      borderColor=\"background-hover\"\n      border={1}\n      borderRadius=\"md\"\n      width=\"100%\"\n    >\n      <AssessmentDetail\n        isHighestScore\n        score={highestScore}\n        scoreAchievedAt={highestScoreAchievedAt}\n      />\n      <AssessmentDetail\n        score={latestScore}\n        scoreAchievedAt={latestScoreAchievedAt}\n      />\n    </FlexBox>\n  );\n};\n"],"mappings":";;;;;AAWA,MAAaA,mCAER,EACH,cACA,wBACA,aACA,4BACI;AACJ,QACE,qBAAC;EACC,aAAY;EACZ,QAAQ;EACR,cAAa;EACb,OAAM;aAEN,oBAAC;GACC;GACA,OAAO;GACP,iBAAiB;IACjB,EACF,oBAAC;GACC,OAAO;GACP,iBAAiB;IACjB;GACM"}