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

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_styled1.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: react5.ForwardRefExoticComponent<CourseCardProps & react5.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"}

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

@@ -22,4 +22,5 @@ declare enum DifficultyString {
   'Advanced' = 2,
 }
 //#endregion
-export { ContainerDifficulty, ContainerDifficultyUnion, ContentDifficultyProps, DifficultyString, DifficultyVariant };
+export { ContainerDifficulty, ContainerDifficultyUnion, ContentDifficultyProps, DifficultyString, DifficultyVariant };
+//# sourceMappingURL=types.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","names":[],"sources":["../../../src/CurriculumCard/Difficulty/types.ts"],"sourcesContent":[],"mappings":";;AAGA;AASA;AAEY,aAXA,mBAAA;EAaA,QAAA,GAAA,UAAA;EACE,YAAA,GAAA,cAAA;EAAsB,QAAA,GAAA,UAAA;;;AAIpC;;KATY,wBAAA,MAA8B;KAE9B,iBAAA;KAEA,sBAAA;cACE,sBAAsB;YACxB;;aAGA,gBAAA"}

package/dist/CurriculumCard/Difficulty/types.js

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

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

@@ -0,0 +1 @@
+{"version":3,"file":"types.js","names":[],"sources":["../../../src/CurriculumCard/Difficulty/types.ts"],"sourcesContent":["/**\n * Exported enums sometimes come up undefined when used in Jest tests because of the way they are compiled. Be careful when using this in test mocks.\n */\nexport enum ContainerDifficulty {\n  Beginner = 'Beginner',\n  Intermediate = 'Intermediate',\n  Advanced = 'Advanced',\n}\n\n/**\n * converting ContainerDifficulty enum into union type\n */\nexport type ContainerDifficultyUnion = `${ContainerDifficulty}`;\n\nexport type DifficultyVariant = 'small' | 'medium';\n\nexport type ContentDifficultyProps = {\n  difficulty: ContainerDifficulty | ContainerDifficultyUnion;\n  variant?: DifficultyVariant;\n};\n\nexport enum DifficultyString {\n  'Beginner friendly',\n  'Intermediate',\n  'Advanced',\n}\n"],"mappings":";;;;AAGA,IAAY,sEAAL;AACL;AACA;AACA;;;AAeF,IAAY,gEAAL;AACL;AACA;AACA"}

package/dist/CurriculumCard/Footer/index.js

@@ -44,4 +44,5 @@ const Footer = ({ beta, progressState, tag, tagColor, footerTextVariant }) => {
 };
 
 //#endregion
-export { Footer };
+export { Footer };
+//# sourceMappingURL=index.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":["Footer: React.FC<FooterProps>"],"sources":["../../../src/CurriculumCard/Footer/index.tsx"],"sourcesContent":["import { Box, FlexBox, Text } from '@codecademy/gamut';\nimport * as React from 'react';\n\nimport { BetaSticker } from '../../BetaSticker';\nimport { BottomTag, TagColor } from '../BottomTag/index';\n\nexport type FooterProps = {\n  beta?: boolean;\n  progressState?: 'completed' | 'inProgress';\n  tag?: string;\n  tagColor?: TagColor;\n  footerTextVariant?: 'enrolled' | 'inProgress';\n};\n\nexport const Footer: React.FC<FooterProps> = ({\n  beta,\n  progressState,\n  tag,\n  tagColor,\n  footerTextVariant,\n}) => {\n  if (progressState) {\n    return (\n      <Box mt=\"auto\">\n        {progressState === 'completed' && (\n          <Text fontSize={16} fontFamily=\"accent\" textColor=\"yellow\">\n            Completed\n          </Text>\n        )}\n        {progressState === 'inProgress' && (\n          <FlexBox\n            flexWrap=\"wrap\"\n            justifyContent=\"space-between\"\n            alignItems=\"flex-end\"\n            width=\"100%\"\n          >\n            <Text fontFamily=\"accent\" fontSize={14}>\n              {footerTextVariant === 'inProgress'\n                ? 'In Progress...'\n                : 'Enrolled...'}\n            </Text>\n            <Text textColor=\"hyper\">Keep Going</Text>\n          </FlexBox>\n        )}\n      </Box>\n    );\n  }\n  if (beta) {\n    return (\n      <Box position=\"absolute\" bottom={0} right={0} pb={16} pr={16}>\n        <BetaSticker />\n      </Box>\n    );\n  }\n  if (tag && tagColor) {\n    return <BottomTag text={tag} color={tagColor} />;\n  }\n  return null;\n};\n"],"mappings":";;;;;;;AAcA,MAAaA,UAAiC,EAC5C,MACA,eACA,KACA,UACA,wBACI;AACJ,KAAI,cACF,QACE,qBAAC;EAAI,IAAG;aACL,kBAAkB,eACjB,oBAAC;GAAK,UAAU;GAAI,YAAW;GAAS,WAAU;aAAS;IAEpD,EAER,kBAAkB,gBACjB,qBAAC;GACC,UAAS;GACT,gBAAe;GACf,YAAW;GACX,OAAM;cAEN,oBAAC;IAAK,YAAW;IAAS,UAAU;cACjC,sBAAsB,eACnB,mBACA;KACC,EACP,oBAAC;IAAK,WAAU;cAAQ;KAAiB;IACjC;GAER;AAGV,KAAI,KACF,QACE,oBAAC;EAAI,UAAS;EAAW,QAAQ;EAAG,OAAO;EAAG,IAAI;EAAI,IAAI;YACxD,oBAAC,gBAAc;GACX;AAGV,KAAI,OAAO,SACT,QAAO,oBAAC;EAAU,MAAM;EAAK,OAAO;GAAY;AAElD,QAAO"}

package/dist/CurriculumCard/Image/index.js

@@ -44,4 +44,5 @@ const Image = ({ image, progressState, isSmall }) => {
 };
 
 //#endregion
-export { Image };
+export { Image };
+//# sourceMappingURL=index.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":["Image: React.FC<ImageProps>"],"sources":["../../../src/CurriculumCard/Image/index.tsx"],"sourcesContent":["import { variant } from '@codecademy/gamut-styles';\nimport styled from '@emotion/styled';\nimport { useState } from 'react';\nimport * as React from 'react';\nimport { useIsomorphicLayoutEffect } from 'react-use';\n\nimport { BASE_STATIC_ASSET_PATH } from '../../remoteAssets/components';\n\nconst variants = variant({\n  base: {\n    display: 'block',\n    margin: '0 auto',\n  },\n  variants: {\n    default: {\n      width: 160,\n    },\n    small: {\n      width: 111,\n    },\n  },\n});\n\nconst StyledImg = styled.img(variants);\n\ntype ProgressState = 'inProgress' | 'completed';\n\nconst getPlaceholderAssetPath = (pathProgressState?: ProgressState) => {\n  const progressState = pathProgressState ? `-${pathProgressState}` : '';\n  return `${BASE_STATIC_ASSET_PATH}/curriculum/path/placeholder${progressState}.svg`;\n};\n\nexport type ImageProps = {\n  image: string;\n  progressState?: ProgressState;\n  isSmall?: boolean;\n};\n\nexport const Image: React.FC<ImageProps> = ({\n  image,\n  progressState,\n  isSmall,\n}) => {\n  const [ready, setReady] = useState(false);\n  const [error, setError] = useState(false);\n\n  /** Delay initial render once to ensure that rehydration does not conflict with portal mounting */\n  useIsomorphicLayoutEffect(() => {\n    setReady(typeof document !== 'undefined');\n  }, []);\n\n  if (!ready) return null;\n\n  const addDefaultImageSource = (event: React.SyntheticEvent) => {\n    if (!error) {\n      (event.target as HTMLImageElement).onerror = null;\n      (event.target as HTMLImageElement).src =\n        getPlaceholderAssetPath(progressState);\n      setError(true);\n    }\n  };\n\n  return (\n    <StyledImg\n      variant={isSmall ? 'small' : 'default'}\n      src={image}\n      alt=\"\"\n      onError={addDefaultImageSource}\n    />\n  );\n};\n"],"mappings":";;;;;;;;AAQA,MAAM,WAAW,QAAQ;CACvB,MAAM;EACJ,SAAS;EACT,QAAQ;EACT;CACD,UAAU;EACR,SAAS,EACP,OAAO,KACR;EACD,OAAO,EACL,OAAO,KACR;EACF;CACF,CAAC;AAEF,MAAM,YAAY,OAAO,IAAI,SAAS;AAItC,MAAM,2BAA2B,sBAAsC;AAErE,QAAO,GAAG,uBAAuB,8BADX,oBAAoB,IAAI,sBAAsB,GACS;;AAS/E,MAAaA,SAA+B,EAC1C,OACA,eACA,cACI;CACJ,MAAM,CAAC,OAAO,YAAY,SAAS,MAAM;CACzC,MAAM,CAAC,OAAO,YAAY,SAAS,MAAM;;AAGzC,iCAAgC;AAC9B,WAAS,OAAO,aAAa,YAAY;IACxC,EAAE,CAAC;AAEN,KAAI,CAAC,MAAO,QAAO;CAEnB,MAAM,yBAAyB,UAAgC;AAC7D,MAAI,CAAC,OAAO;AACV,GAAC,MAAM,OAA4B,UAAU;AAC7C,GAAC,MAAM,OAA4B,MACjC,wBAAwB,cAAc;AACxC,YAAS,KAAK;;;AAIlB,QACE,oBAAC;EACC,SAAS,UAAU,UAAU;EAC7B,KAAK;EACL,KAAI;EACJ,SAAS;GACT"}

package/dist/CurriculumCard/Subtitle/helpers.js

@@ -5,4 +5,5 @@ const pluralizeWithS = (scope, scopeCount) => {
 };
 
 //#endregion
-export { pluralizeWithS };
+export { pluralizeWithS };
+//# sourceMappingURL=helpers.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"helpers.js","names":[],"sources":["../../../src/CurriculumCard/Subtitle/helpers.tsx"],"sourcesContent":["/* Quick and easy credit: https://stackoverflow.com/a/39835908 */\nexport const pluralizeWithS = (scope: string, scopeCount: number) => {\n  // Out of all of our content types, only quizzes need a different way to be pluralized\n  if (scope.charAt(scope.length - 1) === 'z') {\n    return `${scope}${scopeCount !== 1 ? 'zes' : ''}`;\n  }\n\n  return `${scope}${scopeCount !== 1 ? 's' : ''}`;\n};\n"],"mappings":";AACA,MAAa,kBAAkB,OAAe,eAAuB;AAEnE,KAAI,MAAM,OAAO,MAAM,SAAS,EAAE,KAAK,IACrC,QAAO,GAAG,QAAQ,eAAe,IAAI,QAAQ;AAG/C,QAAO,GAAG,QAAQ,eAAe,IAAI,MAAM"}

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

@@ -8,4 +8,5 @@ type SubtitleProps = Pick<ContentDifficultyProps, 'difficulty'> & {
   difficultyVariant?: DifficultyVariant;
 };
 //#endregion
-export { SubtitleProps };
+export { SubtitleProps };
+//# sourceMappingURL=index.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","names":[],"sources":["../../../src/CurriculumCard/Subtitle/index.tsx"],"sourcesContent":[],"mappings":";;;;KAQY,aAAA,GAAgB,KAAK;SACxB;EADG,eAAA,CAAa,EAAA,OAAA;EAAQ,iBAAA,CAAA,EAGX,iBAHW;CAAL"}

package/dist/CurriculumCard/Subtitle/index.js

@@ -34,4 +34,5 @@ const Subtitle = ({ difficulty, scope, showAltSubtitle = false, difficultyVarian
 };
 
 //#endregion
-export { Subtitle };
+export { Subtitle };
+//# sourceMappingURL=index.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":["Subtitle: React.FC<SubtitleProps>"],"sources":["../../../src/CurriculumCard/Subtitle/index.tsx"],"sourcesContent":["import { FlexBox, Text } from '@codecademy/gamut';\nimport capitalize from 'lodash/capitalize';\nimport * as React from 'react';\n\nimport { Difficulty } from '../Difficulty';\nimport { ContentDifficultyProps, DifficultyVariant } from '../Difficulty/types';\nimport { pluralizeWithS } from './helpers';\n\nexport type SubtitleProps = Pick<ContentDifficultyProps, 'difficulty'> & {\n  scope: Record<string, number>;\n  showAltSubtitle?: boolean;\n  difficultyVariant?: DifficultyVariant;\n};\n\nexport const Subtitle: React.FC<SubtitleProps> = ({\n  difficulty,\n  scope,\n  showAltSubtitle = false,\n  difficultyVariant,\n}) => {\n  const scopeToMap = Object.keys(scope).filter((val) => scope[val] > 0);\n\n  const separatingChar = showAltSubtitle ? '|' : ',';\n\n  return (\n    <>\n      {!showAltSubtitle && (\n        <FlexBox fontSize={14} alignItems=\"center\">\n          <Difficulty variant={difficultyVariant} difficulty={difficulty} />\n          {scopeToMap.length ? separatingChar : null}\n        </FlexBox>\n      )}\n      {scopeToMap.map((scopeType, index) => (\n        <Text\n          ml={showAltSubtitle && index === 0 ? 0 : 4}\n          variant=\"p-small\"\n          key={`${scopeType}-count`}\n        >\n          <b>{scope[scopeType]}</b>{' '}\n          <Text textColor=\"gray-900\">\n            {capitalize(pluralizeWithS(scopeType, scope[scopeType]))}\n          </Text>{' '}\n          {index < scopeToMap.length - 1 && separatingChar}{' '}\n        </Text>\n      ))}\n    </>\n  );\n};\n"],"mappings":";;;;;;;;AAcA,MAAaA,YAAqC,EAChD,YACA,OACA,kBAAkB,OAClB,wBACI;CACJ,MAAM,aAAa,OAAO,KAAK,MAAM,CAAC,QAAQ,QAAQ,MAAM,OAAO,EAAE;CAErE,MAAM,iBAAiB,kBAAkB,MAAM;AAE/C,QACE,4CACG,CAAC,mBACA,qBAAC;EAAQ,UAAU;EAAI,YAAW;aAChC,oBAAC;GAAW,SAAS;GAA+B;IAAc,EACjE,WAAW,SAAS,iBAAiB;GAC9B,EAEX,WAAW,KAAK,WAAW,UAC1B,qBAAC;EACC,IAAI,mBAAmB,UAAU,IAAI,IAAI;EACzC,SAAQ;;GAGR,oBAAC,iBAAG,MAAM,aAAe;GAAC;GAC1B,oBAAC;IAAK,WAAU;cACb,WAAW,eAAe,WAAW,MAAM,WAAW,CAAC;KACnD;GAAC;GACP,QAAQ,WAAW,SAAS,KAAK;GAAgB;;IAN7C,GAAG,UAAU,QAOb,CACP,IACD"}

package/dist/CurriculumCard/index.d.ts

@@ -60,4 +60,5 @@ type CurriculumCardProps = SubtitleProps & {
  */
 declare const CurriculumCard: React$1.FC<CurriculumCardProps>;
 //#endregion
-export { CardProps, CurriculumCard, CurriculumCardProps, FooterTextVariantType, ProgressState };
+export { CardProps, CurriculumCard, CurriculumCardProps, FooterTextVariantType, ProgressState };
+//# sourceMappingURL=index.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","names":[],"sources":["../../src/CurriculumCard/index.tsx"],"sourcesContent":[],"mappings":";;;;;;KAWY,aAAA;KAEA,qBAAA;AAFA,KAWA,SAAA,GAAY,OAAA,CAAM,cAXL,CAAA,OAW2B,IAX3B,CAAA;AAEb,KAWA,mBAAA,GAAsB,aAXD,GAAA;EASrB,IAAA,CAAA,EAAA,OAAS;EAET;;;EAWM,IAAA,EAAA,MAAA;EAGL,KAAA,EAAA,MAAA;EAKS,YAAA,CAAA,EAZL,WAYK;EAqBR,KAAA,CAAA,EAAA,MAAA;EAID,UAAA,CAAA,EAAA,OAAA;EAAS,YAAA,CAAA,EAAA,OAAA;EAgBT,aAAA,CAAA,EAjDK,aAiDoB;;;aA9CzB;;;;;sBAKS;;;;;;;;;;;;;;;;;;;;cAqBR;;;;aAID;;;;;;;;cAgBA,gBAAgB,OAAA,CAAM,GAAG"}

package/dist/CurriculumCard/index.js

@@ -116,4 +116,5 @@ const CurriculumCard = ({ beta, difficulty, description, headingLevel = "h3", im
 };
 
 //#endregion
-export { CurriculumCard };
+export { CurriculumCard };
+//# sourceMappingURL=index.js.map

package/dist/CurriculumCard/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":["CurriculumCard: React.FC<CurriculumCardProps>"],"sources":["../../src/CurriculumCard/index.tsx"],"sourcesContent":["import { Box, Card, FlexBox, HeadingTags, Text } from '@codecademy/gamut';\nimport { pxRem, theme } from '@codecademy/gamut-styles';\nimport styled from '@emotion/styled';\nimport { useMemo } from 'react';\nimport * as React from 'react';\n\nimport { TagColor } from './BottomTag/index';\nimport { Footer } from './Footer/index';\nimport { Image } from './Image/index';\nimport { Subtitle, SubtitleProps } from './Subtitle';\n\nexport type ProgressState = 'inProgress' | 'completed';\n\nexport type FooterTextVariantType = 'enrolled' | 'inProgress';\n\nconst cardHeight = 180;\n\nconst cardStyles = {\n  inProgress: 'yellow',\n  completed: 'navy',\n} as const;\n\nexport type CardProps = React.ComponentProps<typeof Card>;\n\nexport type CurriculumCardProps = SubtitleProps & {\n  beta?: boolean;\n  /**\n   * Displays the curriculum type above the title\n   */\n  text: string;\n  title: string;\n  headingLevel?: HeadingTags;\n  image?: string;\n  isFullSize?: boolean;\n  isStaticSize?: boolean;\n  progressState?: ProgressState;\n  showProLogo?: boolean;\n  tag?: string;\n  tagColor?: TagColor;\n  showAltSubtitle?: boolean;\n  /**\n   * Changes In Progress card footer text from \"Enrolled...\" to \"In Progress...\"\n   */\n  footerTextVariant?: FooterTextVariantType;\n  /**\n   * optional text to be displayed below card subtitle\n   */\n  description?: string;\n  /**\n   * allows description to be shown in card body.\n   */\n  showDescription?: boolean;\n  /**\n   * career path cards are displayed with a variant style / decorative element\n   */\n  showCareerPathVariant?: boolean;\n  /**\n   * displays inner content with a horizontal orientation\n   */\n  horizontalOrientation?: boolean;\n\n  /**\n   * custom minimum height for curriculum card in pixels\n   */\n  minHeight?: CardProps['minHeight'];\n  /**\n   * custom minimum width for curriculum card in pixels\n   */\n  minWidth?: CardProps['minWidth'];\n};\n\nconst LineDecoration = styled(Box)`\n  border-top: 1px solid\n    ${({ inProgress }: { inProgress?: boolean }) =>\n      inProgress ? theme.colors.navy : theme.colors['navy-200']};\n`;\n\n/**\n *\n * @deprecated  This component is deprecated\n *\n * Please use the CareerPathCard, SkillPathCard, or CourseCard instead\n */\n\nexport const CurriculumCard: React.FC<CurriculumCardProps> = ({\n  beta,\n  difficulty,\n  description,\n  headingLevel = 'h3',\n  image,\n  isFullSize = false,\n  isStaticSize = false,\n  progressState,\n  scope,\n  tag,\n  tagColor,\n  text,\n  title,\n  showCareerPathVariant,\n  showAltSubtitle = false,\n  footerTextVariant = 'enrolled',\n  showDescription,\n  difficultyVariant,\n  horizontalOrientation,\n  minHeight,\n  minWidth,\n  showProLogo: pro,\n}) => {\n  const boxVariant = progressState && cardStyles[progressState];\n\n  const isCareerPathVariant =\n    text.toLowerCase() === 'career path' && showCareerPathVariant;\n\n  const minimumHeight = useMemo(() => {\n    if (minHeight) return minHeight;\n    return isStaticSize\n      ? pxRem(285)\n      : isFullSize\n      ? pxRem(cardHeight * 2 + 32)\n      : pxRem(cardHeight);\n  }, [isFullSize, isStaticSize, minHeight]);\n\n  const contentType = text === 'Course' && !pro ? 'Free Course' : text;\n  return (\n    <Card\n      display=\"flex\"\n      flexDirection={{\n        _: 'column',\n        xs: horizontalOrientation ? 'row' : 'column',\n      }}\n      minHeight={minimumHeight}\n      minWidth={minWidth}\n      variant={boxVariant ?? 'white'}\n      isInteractive\n      position=\"relative\"\n    >\n      <Box\n        maxWidth={horizontalOrientation ? 418 : 'none'}\n        pr={{ _: 0, xs: horizontalOrientation ? 40 : 0 }}\n      >\n        <Text display=\"flex\" fontSize={14} mb={12} fontFamily=\"accent\">\n          {contentType}\n        </Text>\n        <Text as={headingLevel} mb={4} fontSize={20}>\n          {title}\n        </Text>\n        {!progressState && (\n          <FlexBox flexWrap=\"wrap\" alignItems=\"center\">\n            <Subtitle\n              scope={scope}\n              difficulty={difficulty}\n              showAltSubtitle={showAltSubtitle}\n              difficultyVariant={difficultyVariant}\n            />\n          </FlexBox>\n        )}\n        {isCareerPathVariant && (\n          <LineDecoration inProgress={progressState === 'inProgress'} my={8} />\n        )}\n        {(isCareerPathVariant || showDescription) && (\n          <Text pt={8} pb={16} fontSize={14}>\n            {description}\n          </Text>\n        )}\n      </Box>\n      {isFullSize && image && (\n        <FlexBox\n          my=\"auto\"\n          ml=\"auto\"\n          mr={horizontalOrientation ? 0 : 'auto'}\n          pt={16}\n          pb={isCareerPathVariant ? 32 : 0}\n          pr={{ _: 0, xs: horizontalOrientation ? 24 : 0 }}\n        >\n          <Image\n            isSmall={isCareerPathVariant}\n            image={image}\n            progressState={progressState}\n          />\n        </FlexBox>\n      )}\n      <Footer\n        beta={beta}\n        progressState={progressState}\n        tag={tag}\n        tagColor={tagColor}\n        footerTextVariant={footerTextVariant}\n      />\n    </Card>\n  );\n};\n"],"mappings":";;;;;;;;;;AAeA,MAAM,aAAa;AAEnB,MAAM,aAAa;CACjB,YAAY;CACZ,WAAW;CACZ;AAmDD,MAAM,iBAAiB,OAAO,IAAI;;OAE3B,EAAE,iBACH,aAAa,MAAM,OAAO,OAAO,MAAM,OAAO,YAAY;;;;;;;;AAUhE,MAAaA,kBAAiD,EAC5D,MACA,YACA,aACA,eAAe,MACf,OACA,aAAa,OACb,eAAe,OACf,eACA,OACA,KACA,UACA,MACA,OACA,uBACA,kBAAkB,OAClB,oBAAoB,YACpB,iBACA,mBACA,uBACA,WACA,UACA,aAAa,UACT;CACJ,MAAM,aAAa,iBAAiB,WAAW;CAE/C,MAAM,sBACJ,KAAK,aAAa,KAAK,iBAAiB;CAE1C,MAAM,gBAAgB,cAAc;AAClC,MAAI,UAAW,QAAO;AACtB,SAAO,eACH,MAAM,IAAI,GACV,aACA,MAAM,aAAa,IAAI,GAAG,GAC1B,MAAM,WAAW;IACpB;EAAC;EAAY;EAAc;EAAU,CAAC;AAGzC,QACE,qBAAC;EACC,SAAQ;EACR,eAAe;GACb,GAAG;GACH,IAAI,wBAAwB,QAAQ;GACrC;EACD,WAAW;EACD;EACV,SAAS,cAAc;EACvB;EACA,UAAS;;GAET,qBAAC;IACC,UAAU,wBAAwB,MAAM;IACxC,IAAI;KAAE,GAAG;KAAG,IAAI,wBAAwB,KAAK;KAAG;;KAEhD,oBAAC;MAAK,SAAQ;MAAO,UAAU;MAAI,IAAI;MAAI,YAAW;gBAlBxC,SAAS,YAAY,CAAC,MAAM,gBAAgB;OAoBnD;KACP,oBAAC;MAAK,IAAI;MAAc,IAAI;MAAG,UAAU;gBACtC;OACI;KACN,CAAC,iBACA,oBAAC;MAAQ,UAAS;MAAO,YAAW;gBAClC,oBAAC;OACQ;OACK;OACK;OACE;QACnB;OACM;KAEX,uBACC,oBAAC;MAAe,YAAY,kBAAkB;MAAc,IAAI;OAAK;MAErE,uBAAuB,oBACvB,oBAAC;MAAK,IAAI;MAAG,IAAI;MAAI,UAAU;gBAC5B;OACI;;KAEL;GACL,cAAc,SACb,oBAAC;IACC,IAAG;IACH,IAAG;IACH,IAAI,wBAAwB,IAAI;IAChC,IAAI;IACJ,IAAI,sBAAsB,KAAK;IAC/B,IAAI;KAAE,GAAG;KAAG,IAAI,wBAAwB,KAAK;KAAG;cAEhD,oBAAC;KACC,SAAS;KACF;KACQ;MACf;KACM;GAEZ,oBAAC;IACO;IACS;IACV;IACK;IACS;KACnB;;GACG"}

package/dist/DropdownButton/DropdownList.d.ts

@@ -16,4 +16,5 @@ type DropdownListProps = {
   onClose?: () => void;
 } & Pick<DropdownButtonProps, 'isMenu'>;
 //#endregion
-export { DropdownListProps };
+export { DropdownListProps };
+//# sourceMappingURL=DropdownList.d.ts.map

package/dist/DropdownButton/DropdownList.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"DropdownList.d.ts","names":[],"sources":["../../src/DropdownButton/DropdownList.tsx"],"sourcesContent":[],"mappings":";;;;;KAMK,WAAA,GAAc,QACjB,KAAK;KAGK,YAAA;EAJP,EAAA,EAAA,MAAA;EACE,IAAA,CAAA,EAKE,OAAA,CAAM,aALR,CAKsB,cALtB,CAAA;EAAL,IAAA,EAAA,MAAA;EADiB,YAAA,CAAA,EAAA,CAAA,KAAA,EAQM,OAAA,CAAM,UARZ,EAAA,GAAA,IAAA;CAAO,GAStB,WATsB;AAId,KAOA,iBAAA,GAPY;EAEK,aAAA,EAAA,CAMX,YANW,GAAA,WAAA,CAAA,EAAA;EAApB,YAAM,CAAA,EAAA,MAAA;EAEU,OAAM,CAAA,EAAA,GAAA,GAAA,IAAA;CAC3B,GAMA,IANA,CAMK,mBANL,EAAA,QAAA,CAAA"}

package/dist/DropdownButton/DropdownList.js

@@ -52,4 +52,5 @@ const DropdownList = ({ dropdownItems, isMenu, menuButtonId, onClose }) => {
 };
 
 //#endregion
-export { DropdownList };
+export { DropdownList };
+//# sourceMappingURL=DropdownList.js.map

package/dist/DropdownButton/DropdownList.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DropdownList.js","names":["DropdownList: React.FC<DropdownListProps>","React"],"sources":["../../src/DropdownButton/DropdownList.tsx"],"sourcesContent":["import { Menu, MenuItem, MenuSeparator } from '@codecademy/gamut';\nimport { GamutIconProps } from '@codecademy/gamut-icons';\nimport * as React from 'react';\n\nimport { DropdownButtonProps } from '.';\n\ntype AnchorProps = Partial<\n  Pick<HTMLAnchorElement, 'href' | 'target' | 'ariaLabel'>\n>;\n\nexport type DropdownItem = {\n  id: string;\n  icon?: React.ComponentType<GamutIconProps>;\n  text: string;\n  clickHandler?: (event: React.MouseEvent) => void;\n} & AnchorProps;\n\nexport type DropdownListProps = {\n  dropdownItems: (DropdownItem | 'separator')[];\n  menuButtonId?: string;\n  onClose?: () => void;\n} & Pick<DropdownButtonProps, 'isMenu'>;\n\nexport const DropdownList: React.FC<DropdownListProps> = ({\n  dropdownItems,\n  isMenu,\n  menuButtonId,\n  onClose,\n}) => {\n  const listRefs = React.useRef<React.RefObject<HTMLAnchorElement>[]>(\n    dropdownItems.map(() => React.createRef())\n  );\n\n  const handleKeyDown = (\n    event: React.KeyboardEvent | React.KeyboardEvent,\n    index: number\n  ) => {\n    if (event.key === 'Tab') {\n      event.preventDefault();\n      onClose?.();\n    } else if (event.key === 'ArrowUp') {\n      event.preventDefault();\n      if (index > 0) {\n        const isSeparatorEl = dropdownItems[index - 1] === 'separator';\n        const decrementVal = isSeparatorEl ? 2 : 1;\n        // Move focus to the previous item in the list\n        listRefs.current[index - decrementVal].current?.focus();\n      }\n    } else if (event.key === 'ArrowDown') {\n      event.preventDefault();\n      if (index < dropdownItems.length - 1) {\n        const isSeparatorEl = dropdownItems[index + 1] === 'separator';\n        const incrementVal = isSeparatorEl ? 2 : 1;\n        // Move focus to the next item in the list\n        listRefs.current[index + incrementVal].current?.focus();\n      }\n    }\n  };\n\n  return (\n    <Menu\n      variant=\"popover\"\n      border=\"none\"\n      minWidth=\"max-content\"\n      py={4}\n      role={isMenu ? 'menu' : undefined}\n      aria-labelledby={menuButtonId || ''}\n    >\n      {dropdownItems.map((item, i) => {\n        if (item === 'separator') {\n          return (\n            // eslint-disable-next-line react/no-array-index-key\n            <MenuSeparator key={`dropdown-separator-${i}`} aria-hidden=\"true\" />\n          );\n        }\n\n        const { id, text, clickHandler, icon, ...linkProps } = item;\n\n        const onClick = (event: React.MouseEvent) => {\n          clickHandler?.(event);\n          onClose?.();\n        };\n\n        return (\n          <MenuItem\n            key={id}\n            data-testid={`dropdown-item-${id}`}\n            onClick={onClick}\n            icon={icon}\n            tabIndex={0}\n            onKeyDown={(e) => handleKeyDown(e, i)}\n            ref={listRefs.current[i]}\n            {...linkProps}\n          >\n            {text}\n          </MenuItem>\n        );\n      })}\n    </Menu>\n  );\n};\n"],"mappings":";;;;;AAuBA,MAAaA,gBAA6C,EACxD,eACA,QACA,cACA,cACI;CACJ,MAAM,WAAWC,QAAM,OACrB,cAAc,UAAUA,QAAM,WAAW,CAAC,CAC3C;CAED,MAAM,iBACJ,OACA,UACG;AACH,MAAI,MAAM,QAAQ,OAAO;AACvB,SAAM,gBAAgB;AACtB,cAAW;aACF,MAAM,QAAQ,WAAW;AAClC,SAAM,gBAAgB;AACtB,OAAI,QAAQ,GAAG;IAEb,MAAM,eADgB,cAAc,QAAQ,OAAO,cACd,IAAI;AAEzC,aAAS,QAAQ,QAAQ,cAAc,SAAS,OAAO;;aAEhD,MAAM,QAAQ,aAAa;AACpC,SAAM,gBAAgB;AACtB,OAAI,QAAQ,cAAc,SAAS,GAAG;IAEpC,MAAM,eADgB,cAAc,QAAQ,OAAO,cACd,IAAI;AAEzC,aAAS,QAAQ,QAAQ,cAAc,SAAS,OAAO;;;;AAK7D,QACE,oBAAC;EACC,SAAQ;EACR,QAAO;EACP,UAAS;EACT,IAAI;EACJ,MAAM,SAAS,SAAS;EACxB,mBAAiB,gBAAgB;YAEhC,cAAc,KAAK,MAAM,MAAM;AAC9B,OAAI,SAAS,YACX,QAEE,oBAAC,iBAA8C,eAAY,UAAvC,sBAAsB,IAA0B;GAIxE,MAAM,EAAE,IAAI,MAAM,cAAc,MAAM,GAAG,cAAc;GAEvD,MAAM,WAAW,UAA4B;AAC3C,mBAAe,MAAM;AACrB,eAAW;;AAGb,UACE,oBAAC;IAEC,eAAa,iBAAiB;IACrB;IACH;IACN,UAAU;IACV,YAAY,MAAM,cAAc,GAAG,EAAE;IACrC,KAAK,SAAS,QAAQ;IACtB,GAAI;cAEH;MATI,GAUI;IAEb;GACG"}

package/dist/DropdownButton/index.d.ts

@@ -77,4 +77,5 @@ declare const DropdownButton: react7.ForwardRefExoticComponent<(Omit<{
   children?: react7.ReactNode | undefined;
 }, "ref">) & react7.RefAttributes<DropdownButtonRefType>>;
 //#endregion
-export { DropdownButton, DropdownButtonProps, DropdownButtonRefType };
+export { DropdownButton, DropdownButtonProps, DropdownButtonRefType };
+//# sourceMappingURL=index.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","names":[],"sources":["../../src/DropdownButton/index.tsx"],"sourcesContent":[],"mappings":"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"}

package/dist/DropdownButton/index.js

@@ -134,4 +134,5 @@ const DropdownButton = forwardRef(({ align = "left", buttonType = "fill", childr
 });
 
 //#endregion
-export { DropdownButton };
+export { DropdownButton };
+//# sourceMappingURL=index.js.map

package/dist/DropdownButton/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":["clickTarget: React.ReactNode","variant"],"sources":["../../src/DropdownButton/index.tsx"],"sourcesContent":["import {\n  ButtonProps,\n  FillButton,\n  IconButton,\n  Popover,\n  PopoverProps,\n  PopoverYPositionType,\n  StrokeButton,\n  TextButton,\n} from '@codecademy/gamut';\nimport {\n  ArrowChevronDownFilledIcon,\n  MiniKebabMenuIcon,\n} from '@codecademy/gamut-icons';\nimport { css, pxRem, styledOptions } from '@codecademy/gamut-styles';\nimport styled from '@emotion/styled';\nimport {\n  forwardRef,\n  PropsWithChildren,\n  useId,\n  useImperativeHandle,\n  useRef,\n  useState,\n} from 'react';\nimport * as React from 'react';\n\nimport { DropdownList, DropdownListProps } from './DropdownList';\nimport { useDynamicPopoverPosition } from './useDynamicPopoverPosition';\n\nconst DownArrow = styled(ArrowChevronDownFilledIcon, styledOptions)<{\n  isOpen?: boolean;\n}>`\n  margin-left: ${pxRem(8)};\n  transition: transform 0.35s ease-out;\n  ${({ isOpen }) => isOpen && 'transform: rotate(-180deg)'};\n`;\n\nconst HorizontalKebabIcon = styled(MiniKebabMenuIcon)(\n  css({\n    transform: 'rotate(90deg)',\n  })\n);\n\nexport type DropdownButtonRefType = {\n  focus: HTMLButtonElement['focus'];\n};\n\nexport type DropdownButtonProps = PropsWithChildren<\n  {\n    align?: PopoverProps['align'];\n    buttonType?: 'fill' | 'stroke' | 'text' | 'kebab' | 'horizontalKebab';\n    defaultPosition?: PopoverYPositionType['position'];\n    dropdownItems: DropdownListProps['dropdownItems'];\n    horizontalOffset?: number;\n    /**\n     * Sets the size of the down arrow icon in the buttons that have text or the kebab and horizontal kebab icons.\n     */\n    iconSize?: number;\n    /**\n     * If the dropdown should semantically be a menu\n     */\n    isMenu?: boolean;\n    onClick?: (event: React.MouseEvent) => void;\n    tipProps?: React.ComponentProps<typeof IconButton>['tipProps'];\n    verticalOffset?: number;\n  } & ButtonProps\n>;\n\nexport const DropdownButton = forwardRef<\n  DropdownButtonRefType,\n  DropdownButtonProps\n>(\n  (\n    {\n      align = 'left',\n      buttonType = 'fill',\n      children,\n      defaultPosition = 'below',\n      dropdownItems,\n      horizontalOffset,\n      iconSize,\n      isMenu,\n      onClick,\n      tipProps,\n      verticalOffset = 0,\n      size,\n      variant = 'primary',\n      ...buttonStyleProps\n    },\n    ref\n  ) => {\n    const buttonId = useId();\n    const targetRef = useRef<HTMLAnchorElement | HTMLButtonElement>(null);\n    const { position, popoverContainerRefCallback } = useDynamicPopoverPosition(\n      {\n        targetRef,\n        verticalOffset,\n        defaultPosition,\n      }\n    );\n\n    const [isOpen, setIsOpen] = useState(false);\n\n    useImperativeHandle(ref, () => ({\n      focus: () => targetRef.current?.focus(),\n    }));\n\n    const handleClick = (event: React.MouseEvent) => {\n      if (!isOpen) {\n        onClick?.(event);\n      }\n      setIsOpen(!isOpen);\n    };\n    const handleRequestClosed = () => {\n      setIsOpen(false);\n    };\n\n    const textButtonDefaultSize = 'normal';\n    const iconButtonDefaultSize = 'small';\n\n    let clickTarget: React.ReactNode;\n    switch (buttonType) {\n      case 'fill':\n        clickTarget = (\n          <FillButton\n            ref={targetRef}\n            aria-expanded={isOpen}\n            id={buttonId}\n            onClick={handleClick}\n            data-testid=\"dropdown-fill-button\"\n            size={size || textButtonDefaultSize}\n            variant={variant}\n            {...(buttonStyleProps ?? {})}\n          >\n            {children}\n            <DownArrow isOpen={isOpen} size={iconSize || 12} />\n          </FillButton>\n        );\n        break;\n      case 'stroke':\n        clickTarget = (\n          <StrokeButton\n            ref={targetRef}\n            aria-expanded={isOpen}\n            id={buttonId}\n            onClick={handleClick}\n            data-testid=\"dropdown-stroke-button\"\n            size={size || textButtonDefaultSize}\n            variant={variant}\n            {...(buttonStyleProps ?? {})}\n          >\n            {children}\n            <DownArrow isOpen={isOpen} size={iconSize || 12} />\n          </StrokeButton>\n        );\n        break;\n      case 'text':\n        clickTarget = (\n          <TextButton\n            ref={targetRef}\n            id={buttonId}\n            onClick={handleClick}\n            data-testid=\"dropdown-stroke-button\"\n            size={size || textButtonDefaultSize}\n            variant={variant}\n            {...(buttonStyleProps ?? {})}\n          >\n            {children}\n            <DownArrow isOpen={isOpen} size={12} />\n          </TextButton>\n        );\n        break;\n      case 'kebab':\n        clickTarget = (\n          <IconButton\n            ref={targetRef}\n            aria-expanded={isOpen}\n            aria-haspopup=\"menu\"\n            id={buttonId}\n            icon={() => <MiniKebabMenuIcon size={iconSize} />}\n            size={size || iconButtonDefaultSize}\n            variant=\"secondary\"\n            onClick={handleClick}\n            data-testid=\"dropdown-kebab-button\"\n            tip=\"Show options\"\n            tipProps={tipProps}\n            {...(buttonStyleProps ?? {})}\n          />\n        );\n        break;\n      case 'horizontalKebab':\n        clickTarget = (\n          <IconButton\n            aria-label=\"Options\"\n            ref={targetRef}\n            aria-expanded={isOpen}\n            aria-haspopup=\"menu\"\n            id={buttonId}\n            icon={() => <HorizontalKebabIcon size={iconSize} />}\n            size={size || iconButtonDefaultSize}\n            variant=\"secondary\"\n            onClick={handleClick}\n            data-testid=\"dropdown-horizontal-kebab-button\"\n            tipProps={tipProps}\n            tip=\"Show more options\"\n            {...(buttonStyleProps ?? {})}\n          />\n        );\n    }\n\n    return (\n      <>\n        {clickTarget}\n        {dropdownItems.length !== 0 && (\n          <Popover\n            popoverContainerRef={popoverContainerRefCallback}\n            targetRef={targetRef}\n            isOpen={isOpen}\n            onRequestClose={handleRequestClosed}\n            align={align}\n            verticalOffset={verticalOffset}\n            horizontalOffset={horizontalOffset}\n            position={position}\n            outline\n          >\n            <DropdownList\n              dropdownItems={dropdownItems}\n              isMenu={isMenu}\n              menuButtonId={buttonId}\n              onClose={handleRequestClosed}\n            />\n          </Popover>\n        )}\n      </>\n    );\n  }\n);\n"],"mappings":";;;;;;;;;;AA6BA,MAAM,YAAY,OAAO,4BAA4B,cAAc,AAEjE;iBACe,MAAM,EAAE,CAAC;;KAErB,EAAE,aAAa,UAAU,6BAA6B;;AAG3D,MAAM,sBAAsB,OAAO,kBAAkB,CACnD,IAAI,EACF,WAAW,iBACZ,CAAC,CACH;AA2BD,MAAa,iBAAiB,YAK1B,EACE,QAAQ,QACR,aAAa,QACb,UACA,kBAAkB,SAClB,eACA,kBACA,UACA,QACA,SACA,UACA,iBAAiB,GACjB,MACA,qBAAU,WACV,GAAG,oBAEL,QACG;CACH,MAAM,WAAW,OAAO;CACxB,MAAM,YAAY,OAA8C,KAAK;CACrE,MAAM,EAAE,UAAU,gCAAgC,0BAChD;EACE;EACA;EACA;EACD,CACF;CAED,MAAM,CAAC,QAAQ,aAAa,SAAS,MAAM;AAE3C,qBAAoB,YAAY,EAC9B,aAAa,UAAU,SAAS,OAAO,EACxC,EAAE;CAEH,MAAM,eAAe,UAA4B;AAC/C,MAAI,CAAC,OACH,WAAU,MAAM;AAElB,YAAU,CAAC,OAAO;;CAEpB,MAAM,4BAA4B;AAChC,YAAU,MAAM;;CAGlB,MAAM,wBAAwB;CAC9B,MAAM,wBAAwB;CAE9B,IAAIA;AACJ,SAAQ,YAAR;EACE,KAAK;AACH,iBACE,qBAAC;IACC,KAAK;IACL,iBAAe;IACf,IAAI;IACJ,SAAS;IACT,eAAY;IACZ,MAAM,QAAQ;IACd,SAASC;IACT,GAAK,oBAAoB,EAAE;eAE1B,UACD,oBAAC;KAAkB;KAAQ,MAAM,YAAY;MAAM;KACxC;AAEf;EACF,KAAK;AACH,iBACE,qBAAC;IACC,KAAK;IACL,iBAAe;IACf,IAAI;IACJ,SAAS;IACT,eAAY;IACZ,MAAM,QAAQ;IACd,SAASA;IACT,GAAK,oBAAoB,EAAE;eAE1B,UACD,oBAAC;KAAkB;KAAQ,MAAM,YAAY;MAAM;KACtC;AAEjB;EACF,KAAK;AACH,iBACE,qBAAC;IACC,KAAK;IACL,IAAI;IACJ,SAAS;IACT,eAAY;IACZ,MAAM,QAAQ;IACd,SAASA;IACT,GAAK,oBAAoB,EAAE;eAE1B,UACD,oBAAC;KAAkB;KAAQ,MAAM;MAAM;KAC5B;AAEf;EACF,KAAK;AACH,iBACE,oBAAC;IACC,KAAK;IACL,iBAAe;IACf,iBAAc;IACd,IAAI;IACJ,YAAY,oBAAC,qBAAkB,MAAM,WAAY;IACjD,MAAM,QAAQ;IACd,SAAQ;IACR,SAAS;IACT,eAAY;IACZ,KAAI;IACM;IACV,GAAK,oBAAoB,EAAE;KAC3B;AAEJ;EACF,KAAK,kBACH,eACE,oBAAC;GACC,cAAW;GACX,KAAK;GACL,iBAAe;GACf,iBAAc;GACd,IAAI;GACJ,YAAY,oBAAC,uBAAoB,MAAM,WAAY;GACnD,MAAM,QAAQ;GACd,SAAQ;GACR,SAAS;GACT,eAAY;GACF;GACV,KAAI;GACJ,GAAK,oBAAoB,EAAE;IAC3B;;AAIR,QACE,4CACG,aACA,cAAc,WAAW,KACxB,oBAAC;EACC,qBAAqB;EACV;EACH;EACR,gBAAgB;EACT;EACS;EACE;EACR;EACV;YAEA,oBAAC;GACgB;GACP;GACR,cAAc;GACd,SAAS;IACT;GACM,IAEX;EAGR"}

package/dist/DropdownButton/useDynamicPopoverPosition.js

@@ -37,4 +37,5 @@ const useDynamicPopoverPosition = ({ targetRef, verticalOffset, defaultPosition
 };
 
 //#endregion
-export { useDynamicPopoverPosition };
+export { useDynamicPopoverPosition };
+//# sourceMappingURL=useDynamicPopoverPosition.js.map

package/dist/DropdownButton/useDynamicPopoverPosition.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useDynamicPopoverPosition.js","names":["popoverContainerRefCallback: RefCallback<HTMLElement | null>"],"sources":["../../src/DropdownButton/useDynamicPopoverPosition.ts"],"sourcesContent":["import { PopoverYPositionType } from '@codecademy/gamut';\nimport { RefCallback, RefObject, useCallback, useState } from 'react';\nimport { useWindowScroll, useWindowSize } from 'react-use';\n\n// space between target and edge of window\ntype Clearance = {\n  above: number;\n  below: number;\n};\n\nconst getClearance = (targetEl: HTMLElement, winHeight: number): Clearance => {\n  const { top, bottom } = targetEl.getBoundingClientRect();\n  return {\n    above: top,\n    below: winHeight - bottom,\n  };\n};\n\nconst getClearanceNeeded = (\n  popoverContainerEl: HTMLElement,\n  verticalOffset: number\n): number => {\n  const { height } = popoverContainerEl.getBoundingClientRect();\n  return verticalOffset + height;\n};\n\ntype Position = Required<PopoverYPositionType>['position'];\n\nexport type UseDynamicPopoverPositionProps = {\n  targetRef: RefObject<HTMLElement>;\n  verticalOffset: number;\n  defaultPosition: Position;\n};\n\nexport type UseDynamicPopoverPositionReturn = {\n  position: Position;\n  popoverContainerRefCallback: RefCallback<HTMLElement | null>;\n};\n\nexport const useDynamicPopoverPosition = ({\n  targetRef,\n  verticalOffset,\n  defaultPosition,\n}: UseDynamicPopoverPositionProps): UseDynamicPopoverPositionReturn => {\n  const [popoverContainerEl, setPopoverContainerEl] =\n    useState<HTMLElement | null>(null);\n\n  // called when the popover container is renderd or removed\n  const popoverContainerRefCallback: RefCallback<HTMLElement | null> =\n    useCallback((instance: HTMLElement | null) => {\n      setPopoverContainerEl(instance);\n    }, []);\n\n  const { height: winHeight } = useWindowSize(); // re-calc on window resize\n  useWindowScroll(); // re-calc on scroll\n\n  if (targetRef?.current && popoverContainerEl) {\n    const clearance = getClearance(targetRef.current, winHeight);\n    const clearanceNeeded = getClearanceNeeded(\n      popoverContainerEl,\n      verticalOffset\n    );\n    const clearedAbove = clearance.above >= clearanceNeeded;\n    const clearedBelow = clearance.below >= clearanceNeeded;\n    const verticallyCentered = clearance.above === clearance.below;\n\n    if (!verticallyCentered && (!clearedAbove || !clearedBelow)) {\n      return {\n        position: clearance.above > clearance.below ? 'above' : 'below',\n        popoverContainerRefCallback,\n      };\n    }\n  }\n\n  return {\n    position: defaultPosition,\n    popoverContainerRefCallback,\n  };\n};\n"],"mappings":";;;;AAUA,MAAM,gBAAgB,UAAuB,cAAiC;CAC5E,MAAM,EAAE,KAAK,WAAW,SAAS,uBAAuB;AACxD,QAAO;EACL,OAAO;EACP,OAAO,YAAY;EACpB;;AAGH,MAAM,sBACJ,oBACA,mBACW;CACX,MAAM,EAAE,WAAW,mBAAmB,uBAAuB;AAC7D,QAAO,iBAAiB;;AAgB1B,MAAa,6BAA6B,EACxC,WACA,gBACA,sBACqE;CACrE,MAAM,CAAC,oBAAoB,yBACzB,SAA6B,KAAK;CAGpC,MAAMA,8BACJ,aAAa,aAAiC;AAC5C,wBAAsB,SAAS;IAC9B,EAAE,CAAC;CAER,MAAM,EAAE,QAAQ,cAAc,eAAe;AAC7C,kBAAiB;AAEjB,KAAI,WAAW,WAAW,oBAAoB;EAC5C,MAAM,YAAY,aAAa,UAAU,SAAS,UAAU;EAC5D,MAAM,kBAAkB,mBACtB,oBACA,eACD;EACD,MAAM,eAAe,UAAU,SAAS;EACxC,MAAM,eAAe,UAAU,SAAS;AAGxC,MAAI,EAFuB,UAAU,UAAU,UAAU,WAE7B,CAAC,gBAAgB,CAAC,cAC5C,QAAO;GACL,UAAU,UAAU,QAAQ,UAAU,QAAQ,UAAU;GACxD;GACD;;AAIL,QAAO;EACL,UAAU;EACV;EACD"}

package/dist/EditorialImage/index.d.ts

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

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","names":[],"sources":["../../src/EditorialImage/index.tsx"],"sourcesContent":[],"mappings":";;;KAKY,mBAAA;;EAAA,KAAA,EAAA,MAAA;EASC;;;;;cAAA,gBAAgB,OAAA,CAAM,GAAG"}

package/dist/EditorialImage/index.js

@@ -16,4 +16,5 @@ const EditorialImage = ({ image, alt, caption }) => /* @__PURE__ */ jsxs("div",
 })] });
 
 //#endregion
-export { EditorialImage };
+export { EditorialImage };
+//# sourceMappingURL=index.js.map

package/dist/EditorialImage/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":["EditorialImage: React.FC<EditorialImageProps>","styles"],"sources":["../../src/EditorialImage/index.tsx"],"sourcesContent":["import * as React from 'react';\n\n// eslint-disable-next-line gamut/no-css-standalone\nimport styles from './styles.module.scss';\n\nexport type EditorialImageProps = {\n  /** The URL used for the image src */\n  image: string;\n  /** Alternative text for the image  */\n  alt: string;\n  /** An optional caption that will display below the image  */\n  caption?: string;\n};\n\nexport const EditorialImage: React.FC<EditorialImageProps> = ({\n  image,\n  alt,\n  caption,\n}) => (\n  <div>\n    <div className={styles.imageContainer}>\n      <img className={styles.image} alt={alt} src={image} />\n    </div>\n    {caption && <span className={styles.caption}>{caption}</span>}\n  </div>\n);\n"],"mappings":";;;;;AAcA,MAAaA,kBAAiD,EAC5D,OACA,KACA,cAEA,qBAAC,oBACC,oBAAC;CAAI,WAAWC,sBAAO;WACrB,oBAAC;EAAI,WAAWA,sBAAO;EAAY;EAAK,KAAK;GAAS;EAClD,EACL,WAAW,oBAAC;CAAK,WAAWA,sBAAO;WAAU;EAAe,IACzD"}

package/dist/EditorialImage/styles.module.js

@@ -2,4 +2,5 @@
 var styles_module_default = "assets/styles.module-CAlrRbjX.scss";
 
 //#endregion
-export { styles_module_default as default };
+export { styles_module_default as default };
+//# sourceMappingURL=styles.module.js.map

package/dist/EditorialImage/styles.module.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"styles.module.js","names":[],"sources":["../../src/EditorialImage/styles.module.scss"],"sourcesContent":["__ROLLDOWN_ASSET_FILENAME__"],"mappings":";4BAAA,oCAAA"}

package/dist/EmptySection/index.d.ts

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

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","names":[],"sources":["../../src/EmptySection/index.tsx"],"sourcesContent":[],"mappings":";;;;;;;KAUY,iBAAA;;;AAAZ;EAQgC,QAAA,CAAA,EAAA,MAAA;EAAc;;;EAK9B,QAAM,CAAA,EALT,OAAA,CAAM,YAKG,CALU,WAKV,GALwB,mBAKxB,CAAA;EAAa;AA0GnC;;;gBA1GgB,OAAA,CAAM,cAAc;;;;;;;;;;cA0GvB,cAAc,OAAA,CAAM,GAAG"}

package/dist/EmptySection/index.js

@@ -153,4 +153,5 @@ const EmptySection = ({ bodyText, children, headingText, illustration: Illustrat
 };
 
 //#endregion
-export { EmptySection };
+export { EmptySection };
+//# sourceMappingURL=index.js.map

package/dist/EmptySection/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":["EmptySection: React.FC<EmptySectionProps>"],"sources":["../../src/EmptySection/index.tsx"],"sourcesContent":["import { ButtonProps, FlexBox, Text } from '@codecademy/gamut';\nimport { IllustrationProps } from '@codecademy/gamut-illustrations';\nimport { DotLoose } from '@codecademy/gamut-patterns';\nimport { pxRem, styledOptions, variant } from '@codecademy/gamut-styles';\nimport { StyleProps } from '@codecademy/variance';\nimport styled from '@emotion/styled';\nimport * as React from 'react';\n\nimport { DropdownButtonProps } from '..';\n\nexport type EmptySectionProps = {\n  /**\n   * Paragraph text that displays beneath the heading text\n   */\n  bodyText?: string;\n  /**\n   * Button or dropdown button with an action for the user to take\n   */\n  children?: React.ReactElement<ButtonProps | DropdownButtonProps>;\n  /**\n   * The larger heading text that appears over the body text\n   */\n  headingText: string;\n  illustration: React.ComponentType<IllustrationProps>;\n  /**\n   * Whether the illustration appears to the left or right of the rest of the section's content\n   */\n  illustrationPosition?: 'left' | 'right';\n  /**\n   * Whether the pattern background stretches to the end of the left or right of the viewport\n   */\n  stretchDirection: 'left' | 'right' | 'none';\n};\n\nconst EmptyContainer = styled(FlexBox)(\n  variant({\n    prop: 'stretchDirection',\n    defaultVariant: 'left',\n    base: {\n      justifySelf: 'center',\n      position: 'relative',\n      px: 32,\n      py: { _: 64, lg: 96 },\n      width: 1,\n    },\n    variants: {\n      left: {\n        pl: { sm: 0 },\n        pr: { sm: 64, lg: 96 },\n      },\n      right: {\n        pr: { sm: 0 },\n        pl: { sm: 64, lg: 96 },\n      },\n      none: {},\n    },\n  })\n);\n\nconst Dots = styled(DotLoose)(\n  variant({\n    prop: 'stretchDirection',\n    defaultVariant: 'left',\n    base: {\n      position: 'absolute',\n      top: 0,\n      bottom: 0,\n      left: -16,\n    },\n    variants: {\n      left: {\n        left: {\n          xs: -32,\n          sm: -64,\n          lg: -96,\n          xl: 'calc((1248px - 100vw) / 2)',\n        },\n        width: {\n          _: '100vw',\n          xs: 'calc(100vw - 32px)',\n          sm: 'calc(100vw - 64px)',\n          lg: 'calc(100vw - 96px)',\n          xl: 'calc(1248px + ((100vw - 1248px) / 2))',\n        },\n      },\n      right: {\n        left: { xs: 0 },\n        width: {\n          _: '100vw',\n          xs: 'calc(100vw - 32px)',\n          sm: 'calc(100vw - 64px)',\n          lg: 'calc(100vw - 96px)',\n          xl: 'calc(1248px + ((100vw - 1248px) / 2))',\n        },\n      },\n      none: {\n        left: 0,\n        width: '100%',\n      },\n    },\n  })\n);\n\nconst illustrationPositionVariants = variant({\n  prop: 'illustrationPosition',\n  defaultVariant: 'right',\n  base: {\n    mx: { _: 'auto', sm: 0 },\n    mb: { _: 32, sm: 0 },\n  },\n  variants: {\n    left: {\n      mr: { sm: 48 },\n    },\n    right: {\n      ml: { sm: 48 },\n    },\n  },\n});\n\ntype IllustrationContainerProps = StyleProps<\n  typeof illustrationPositionVariants\n>;\n\nconst IllustrationContainer = styled(\n  'div',\n  styledOptions\n)<IllustrationContainerProps>(illustrationPositionVariants);\n\nexport const EmptySection: React.FC<EmptySectionProps> = ({\n  bodyText,\n  children,\n  headingText,\n  illustration: Illustration,\n  stretchDirection,\n  illustrationPosition = stretchDirection === 'right' ? 'left' : 'right',\n}) => {\n  const flexDirection =\n    illustrationPosition === 'right' ? 'row-reverse' : 'row';\n\n  return (\n    <EmptyContainer stretchDirection={stretchDirection}>\n      <Dots stretchDirection={stretchDirection} />\n      <FlexBox\n        maxWidth=\"822px\"\n        flexBasis=\"100%\"\n        position=\"relative\"\n        bg=\"background-current\"\n        py={48}\n        px={{ _: 16, sm: 48, md: 64 }}\n        zIndex={1}\n        flexDirection={{ _: 'column', sm: flexDirection }}\n        justifyContent={{ _: 'space-around', md: 'space-between' }}\n        alignItems=\"center\"\n        textAlign={{ _: 'center', sm: 'start' }}\n      >\n        <IllustrationContainer illustrationPosition={illustrationPosition}>\n          <Illustration width={pxRem(100)} />\n        </IllustrationContainer>\n        <FlexBox\n          flexDirection=\"column\"\n          alignItems={{ _: 'center', sm: 'start' }}\n        >\n          <Text as=\"h2\" fontSize={22} mb={8}>\n            {headingText}\n          </Text>\n          {bodyText && <Text mb={32}>{bodyText}</Text>}\n          {children}\n        </FlexBox>\n      </FlexBox>\n    </EmptyContainer>\n  );\n};\n"],"mappings":";;;;;;;;AAkCA,MAAM,iBAAiB,OAAO,QAAQ,CACpC,QAAQ;CACN,MAAM;CACN,gBAAgB;CAChB,MAAM;EACJ,aAAa;EACb,UAAU;EACV,IAAI;EACJ,IAAI;GAAE,GAAG;GAAI,IAAI;GAAI;EACrB,OAAO;EACR;CACD,UAAU;EACR,MAAM;GACJ,IAAI,EAAE,IAAI,GAAG;GACb,IAAI;IAAE,IAAI;IAAI,IAAI;IAAI;GACvB;EACD,OAAO;GACL,IAAI,EAAE,IAAI,GAAG;GACb,IAAI;IAAE,IAAI;IAAI,IAAI;IAAI;GACvB;EACD,MAAM,EAAE;EACT;CACF,CAAC,CACH;AAED,MAAM,OAAO,OAAO,SAAS,CAC3B,QAAQ;CACN,MAAM;CACN,gBAAgB;CAChB,MAAM;EACJ,UAAU;EACV,KAAK;EACL,QAAQ;EACR,MAAM;EACP;CACD,UAAU;EACR,MAAM;GACJ,MAAM;IACJ,IAAI;IACJ,IAAI;IACJ,IAAI;IACJ,IAAI;IACL;GACD,OAAO;IACL,GAAG;IACH,IAAI;IACJ,IAAI;IACJ,IAAI;IACJ,IAAI;IACL;GACF;EACD,OAAO;GACL,MAAM,EAAE,IAAI,GAAG;GACf,OAAO;IACL,GAAG;IACH,IAAI;IACJ,IAAI;IACJ,IAAI;IACJ,IAAI;IACL;GACF;EACD,MAAM;GACJ,MAAM;GACN,OAAO;GACR;EACF;CACF,CAAC,CACH;AAED,MAAM,+BAA+B,QAAQ;CAC3C,MAAM;CACN,gBAAgB;CAChB,MAAM;EACJ,IAAI;GAAE,GAAG;GAAQ,IAAI;GAAG;EACxB,IAAI;GAAE,GAAG;GAAI,IAAI;GAAG;EACrB;CACD,UAAU;EACR,MAAM,EACJ,IAAI,EAAE,IAAI,IAAI,EACf;EACD,OAAO,EACL,IAAI,EAAE,IAAI,IAAI,EACf;EACF;CACF,CAAC;AAMF,MAAM,wBAAwB,OAC5B,OACA,cACD,CAA6B,6BAA6B;AAE3D,MAAaA,gBAA6C,EACxD,UACA,UACA,aACA,cAAc,cACd,kBACA,uBAAuB,qBAAqB,UAAU,SAAS,cAC3D;AAIJ,QACE,qBAAC;EAAiC;aAChC,oBAAC,QAAuB,mBAAoB,EAC5C,qBAAC;GACC,UAAS;GACT,WAAU;GACV,UAAS;GACT,IAAG;GACH,IAAI;GACJ,IAAI;IAAE,GAAG;IAAI,IAAI;IAAI,IAAI;IAAI;GAC7B,QAAQ;GACR,eAAe;IAAE,GAAG;IAAU,IAblC,yBAAyB,UAAU,gBAAgB;IAaE;GACjD,gBAAgB;IAAE,GAAG;IAAgB,IAAI;IAAiB;GAC1D,YAAW;GACX,WAAW;IAAE,GAAG;IAAU,IAAI;IAAS;cAEvC,oBAAC;IAA4C;cAC3C,oBAAC,gBAAa,OAAO,MAAM,IAAI,GAAI;KACb,EACxB,qBAAC;IACC,eAAc;IACd,YAAY;KAAE,GAAG;KAAU,IAAI;KAAS;;KAExC,oBAAC;MAAK,IAAG;MAAK,UAAU;MAAI,IAAI;gBAC7B;OACI;KACN,YAAY,oBAAC;MAAK,IAAI;gBAAK;OAAgB;KAC3C;;KACO;IACF;GACK"}

package/dist/ErrorContents/index.d.ts

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

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","names":[],"sources":["../../src/ErrorContents/index.tsx"],"sourcesContent":[],"mappings":";;;KAGY,kBAAA;;AAAZ;AAOA;;;cAAa,eAAe,OAAA,CAAM,GAAG"}

package/dist/ErrorContents/index.js

@@ -59,4 +59,5 @@ const ErrorContents = ({ supportInformation }) => /* @__PURE__ */ jsxs(Box, {
 });
 
 //#endregion
-export { ErrorContents };
+export { ErrorContents };
+//# sourceMappingURL=index.js.map

package/dist/ErrorContents/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":["ErrorContents: React.FC<ErrorContentsProps>"],"sources":["../../src/ErrorContents/index.tsx"],"sourcesContent":["import { Anchor, Box, Text } from '@codecademy/gamut';\nimport * as React from 'react';\n\nexport type ErrorContentsProps = {\n  /**\n   * Any debug info to display, such as [\"User ID\", <user-id>].\n   */\n  supportInformation?: [string, string][];\n};\n\nexport const ErrorContents: React.FC<ErrorContentsProps> = ({\n  supportInformation,\n}) => (\n  <Box maxWidth=\"40rem\" my={96} mx=\"auto\" as=\"main\">\n    <Text as=\"h1\" fontSize={44}>\n      Something has gone wrong\n    </Text>\n    <Text as=\"p\" my={16}>\n      We&apos;re sorry, and our best are working to fix this. In the meantime,\n      have you tried the following?\n    </Text>\n    <Box as=\"ul\">\n      <li>Refreshing this page.</li>\n      <li>Clearing your browser cache.</li>\n    </Box>\n    <Text as=\"p\">\n      If that doesn&apos;t help, please let us know on our{' '}\n      <Anchor href=\"https://help.codecademy.com/hc/en-us\">Help Center</Anchor>!\n    </Text>\n\n    {supportInformation && (\n      <Box as=\"details\" fontSize={16} textColor=\"gray-900\">\n        <Box as=\"summary\" mt={48} mb={8}>\n          Support information\n        </Box>\n        {supportInformation.map(([key, value]) => (\n          <Text as=\"code\" display=\"block\" fontSize=\"small\" key={key}>\n            {key}: {value}\n          </Text>\n        ))}\n      </Box>\n    )}\n  </Box>\n);\n"],"mappings":";;;;;AAUA,MAAaA,iBAA+C,EAC1D,yBAEA,qBAAC;CAAI,UAAS;CAAQ,IAAI;CAAI,IAAG;CAAO,IAAG;;EACzC,oBAAC;GAAK,IAAG;GAAK,UAAU;aAAI;IAErB;EACP,oBAAC;GAAK,IAAG;GAAI,IAAI;aAAI;IAGd;EACP,qBAAC;GAAI,IAAG;cACN,oBAAC,kBAAG,0BAA0B,EAC9B,oBAAC,kBAAG,iCAAiC;IACjC;EACN,qBAAC;GAAK,IAAG;;IAAI;IAC0C;IACrD,oBAAC;KAAO,MAAK;eAAuC;MAAoB;;;IACnE;EAEN,sBACC,qBAAC;GAAI,IAAG;GAAU,UAAU;GAAI,WAAU;cACxC,oBAAC;IAAI,IAAG;IAAU,IAAI;IAAI,IAAI;cAAG;KAE3B,EACL,mBAAmB,KAAK,CAAC,KAAK,WAC7B,qBAAC;IAAK,IAAG;IAAO,SAAQ;IAAQ,UAAS;;KACtC;KAAI;KAAG;;MAD4C,IAE/C,CACP;IACE;;EAEJ"}

package/dist/FeatureList/index.d.ts

@@ -15,4 +15,5 @@ declare const FeatureList: ({
   featureList
 }: IFeatureListProps) => react_jsx_runtime0.JSX.Element;
 //#endregion
-export { FeatureList, FeatureListItem, IFeatureListProps };
+export { FeatureList, FeatureListItem, IFeatureListProps };
+//# sourceMappingURL=index.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","names":[],"sources":["../../src/FeatureList/index.tsx"],"sourcesContent":[],"mappings":";;;;KAKY,eAAA;;;EAAA,IAAA,EAGJ,KAAA,CAAM,aAHa,CAGC,KAAA,CAAM,iBAHP,CAGyB,cAHzB,CAAA,CAAA,GAAA,IAAA;EAGyB,SAAA,EAAA,MAAA,GAAA,IAAA;CAAxB;AAAd,UAIG,iBAAA,CAJH;EAAa,WAAA,EAKZ,eALY,EAAA;AAI3B;AAQa,cAAA,WAgCZ,EAAA,CAAA;EAAA;AAAA,CAAA,EAhC4C,iBAgC5C,EAAA,GAhC6D,kBAAA,CAAA,GAAA,CAAA,OAgC7D"}

package/dist/FeatureList/index.js

@@ -36,4 +36,5 @@ const FeatureList = ({ featureList }) => {
 };
 
 //#endregion
-export { FeatureList };
+export { FeatureList };
+//# sourceMappingURL=index.js.map