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

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,aA2JjB;;;aAxJY;;;;;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: react9.ForwardRefExoticComponent<(Omit<{
   children?: react9.ReactNode | undefined;
 }, "ref">) & react9.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

package/dist/FeatureList/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":[],"sources":["../../src/FeatureList/index.tsx"],"sourcesContent":["import { FlexBox, Text } from '@codecademy/gamut';\nimport { GamutIconProps } from '@codecademy/gamut-icons';\nimport { theme } from '@codecademy/gamut-styles';\nimport styled from '@emotion/styled';\n\nexport type FeatureListItem = {\n  title: string;\n  description: string | null;\n  icon: React.ComponentType<React.PropsWithChildren<GamutIconProps>> | null;\n  iconColor: string | null;\n};\n\nexport interface IFeatureListProps {\n  featureList: FeatureListItem[];\n}\n\nconst StyledIconContainer = styled(FlexBox)<{ iconColor: string }>`\n  color: ${({ iconColor }) => iconColor};\n`;\n\nexport const FeatureList = ({ featureList }: IFeatureListProps) => {\n  return (\n    <FlexBox flexDirection=\"column\" gap={16} mt={24}>\n      {featureList.map((feature) => (\n        <FlexBox\n          key={feature.title}\n          flexDirection=\"row\"\n          gap={12}\n          alignItems={feature.description ? 'flex-start' : 'center'}\n        >\n          {feature.icon && (\n            <StyledIconContainer\n              iconColor={feature.iconColor || theme.colors.text}\n            >\n              <feature.icon size={feature.description ? 24 : 20} />\n            </StyledIconContainer>\n          )}\n          <FlexBox flexDirection=\"column\" gap={feature.description ? 8 : 0}>\n            <Text\n              fontSize={16}\n              fontWeight={feature.description ? 'bold' : 'normal'}\n            >\n              {feature.title}\n            </Text>\n            {feature.description && (\n              <Text fontSize={14}>{feature.description}</Text>\n            )}\n          </FlexBox>\n        </FlexBox>\n      ))}\n    </FlexBox>\n  );\n};\n"],"mappings":";;;;;;AAgBA,MAAM,sBAAsB,OAAO,QAAQ,AAAuB;YACtD,EAAE,gBAAgB,UAAU;;AAGxC,MAAa,eAAe,EAAE,kBAAqC;AACjE,QACE,oBAAC;EAAQ,eAAc;EAAS,KAAK;EAAI,IAAI;YAC1C,YAAY,KAAK,YAChB,qBAAC;GAEC,eAAc;GACd,KAAK;GACL,YAAY,QAAQ,cAAc,eAAe;cAEhD,QAAQ,QACP,oBAAC;IACC,WAAW,QAAQ,aAAa,MAAM,OAAO;cAE7C,oBAAC,QAAQ,QAAK,MAAM,QAAQ,cAAc,KAAK,KAAM;KACjC,EAExB,qBAAC;IAAQ,eAAc;IAAS,KAAK,QAAQ,cAAc,IAAI;eAC7D,oBAAC;KACC,UAAU;KACV,YAAY,QAAQ,cAAc,SAAS;eAE1C,QAAQ;MACJ,EACN,QAAQ,eACP,oBAAC;KAAK,UAAU;eAAK,QAAQ;MAAmB;KAE1C;KAtBL,QAAQ,MAuBL,CACV;GACM"}

package/dist/GlobalFooter/FooterHeading.js

@@ -23,4 +23,5 @@ function FooterHeadingDefaults({ as = "h2", variant = "p-small", mb = 16, fontWe
 const FooterHeading = styled(FooterHeadingDefaults)``;
 
 //#endregion
-export { FooterHeading };
+export { FooterHeading };
+//# sourceMappingURL=FooterHeading.js.map

package/dist/GlobalFooter/FooterHeading.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FooterHeading.js","names":[],"sources":["../../src/GlobalFooter/FooterHeading.tsx"],"sourcesContent":["import { Text } from '@codecademy/gamut';\nimport styled from '@emotion/styled';\n\nconst defaultFontSize = { sm: 16 } as const;\nconst defaultMarginTop = [24, , 0] as const;\n\nfunction FooterHeadingDefaults({\n  as = 'h2',\n  variant = 'p-small',\n  mb = 16,\n  fontWeight = 'bold',\n  fontSize = defaultFontSize,\n  mt = defaultMarginTop,\n  ...props\n}: React.ComponentProps<typeof Text>) {\n  return (\n    <Text\n      as={as}\n      variant={variant}\n      mb={mb}\n      fontWeight={fontWeight}\n      fontSize={fontSize}\n      mt={mt}\n      {...props}\n    />\n  );\n}\n\nexport const FooterHeading = styled(FooterHeadingDefaults)``;\n"],"mappings":";;;;;AAGA,MAAM,kBAAkB,EAAE,IAAI,IAAI;AAClC,MAAM,mBAAmB;CAAC;;CAAM;CAAE;AAElC,SAAS,sBAAsB,EAC7B,KAAK,MACL,UAAU,WACV,KAAK,IACL,aAAa,QACb,WAAW,iBACX,KAAK,kBACL,GAAG,SACiC;AACpC,QACE,oBAAC;EACK;EACK;EACL;EACQ;EACF;EACN;EACJ,GAAI;GACJ;;AAIN,MAAa,gBAAgB,OAAO,sBAAsB"}

package/dist/GlobalFooter/FooterLegal/LegalLinks.js

@@ -71,4 +71,5 @@ const LegalLinks = ({ onClick }) => {
 };
 
 //#endregion
-export { LegalLinks };
+export { LegalLinks };
+//# sourceMappingURL=LegalLinks.js.map

package/dist/GlobalFooter/FooterLegal/LegalLinks.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"LegalLinks.js","names":["LegalLinks: React.FC<LegalLinksProps>"],"sources":["../../../src/GlobalFooter/FooterLegal/LegalLinks.tsx"],"sourcesContent":["import { Anchor } from '@codecademy/gamut';\nimport { theme } from '@codecademy/gamut-styles';\nimport styled from '@emotion/styled';\nimport * as React from 'react';\n\nimport { GlobalFooterClickHandler } from '../types';\n\nconst urls = [\n  ['Privacy Policy', '/policy', 'policy'],\n  ['Cookie Policy', '/cookie-policy', 'cookie_policy'],\n  [\n    'Do Not Sell My Personal Information',\n    'https://privacy.codecademy.com',\n    'data_privacy',\n  ],\n  ['Terms', '/terms', 'terms'],\n];\n\nconst LinksList = styled.ul`\n  align-items: center;\n  display: flex;\n  flex-wrap: wrap;\n  justify-content: center;\n  list-style-type: none;\n  margin-bottom: 0.5rem;\n  padding-left: 0;\n\n  ${theme.breakpoints.md} {\n    justify-content: flex-start;\n    display: inline-flex;\n  }\n`;\n\nconst LinksItem = styled.li`\n  &::after {\n    content: '|';\n    margin: 0 0.375rem;\n    font-size: 1rem;\n  }\n\n  &:last-of-type::after {\n    opacity: 0;\n  }\n`;\n\nexport type LegalLinksProps = {\n  onClick: GlobalFooterClickHandler;\n};\n\nexport const LegalLinks: React.FC<LegalLinksProps> = ({ onClick }) => {\n  return (\n    <LinksList aria-label=\"Legal\" role=\"list\">\n      {urls.map(([children, href, target]) => {\n        return (\n          <LinksItem key={href}>\n            <Anchor\n              href={href}\n              onClick={(event: React.MouseEvent<HTMLAnchorElement>) =>\n                onClick({ event, target })\n              }\n              variant=\"interface\"\n            >\n              {children}\n            </Anchor>\n          </LinksItem>\n        );\n      })}\n    </LinksList>\n  );\n};\n"],"mappings":";;;;;;;AAOA,MAAM,OAAO;CACX;EAAC;EAAkB;EAAW;EAAS;CACvC;EAAC;EAAiB;EAAkB;EAAgB;CACpD;EACE;EACA;EACA;EACD;CACD;EAAC;EAAS;EAAU;EAAQ;CAC7B;AAED,MAAM,YAAY,OAAO,EAAE;;;;;;;;;IASvB,MAAM,YAAY,GAAG;;;;;AAMzB,MAAM,YAAY,OAAO,EAAE;;;;;;;;;;;AAgB3B,MAAaA,cAAyC,EAAE,cAAc;AACpE,QACE,oBAAC;EAAU,cAAW;EAAQ,MAAK;YAChC,KAAK,KAAK,CAAC,UAAU,MAAM,YAAY;AACtC,UACE,oBAAC,uBACC,oBAAC;IACO;IACN,UAAU,UACR,QAAQ;KAAE;KAAO;KAAQ,CAAC;IAE5B,SAAQ;IAEP;KACM,IATK,KAUJ;IAEd;GACQ"}

package/dist/GlobalFooter/FooterLegal/MadeIn.js

@@ -73,4 +73,5 @@ const MadeIn = ({ onClick }) => {
 };
 
 //#endregion
-export { MadeIn };
+export { MadeIn };
+//# sourceMappingURL=MadeIn.js.map

package/dist/GlobalFooter/FooterLegal/MadeIn.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MadeIn.js","names":["MadeIn: React.FC<MadeInProps>"],"sources":["../../../src/GlobalFooter/FooterLegal/MadeIn.tsx"],"sourcesContent":["import { Anchor, Box } from '@codecademy/gamut';\nimport { css } from '@emotion/react';\nimport styled from '@emotion/styled';\nimport * as React from 'react';\n\nconst heartStyles = css`\n  display: inline-block;\n  filter: saturate(0.7);\n  margin-right: 0.25rem;\n  min-width: 1.75em;\n  text-align: center;\n`;\n\nconst HeartAnchorContainer = styled(Anchor)`\n  ${heartStyles}\n  cursor: pointer;\n`;\n\nconst HeartContainer = styled.span`\n  ${heartStyles}\n`;\n\nexport type MadeInProps = {\n  onClick?: (text: string) => void;\n};\n\nexport const MadeIn: React.FC<MadeInProps> = ({ onClick }) => {\n  const onMadeClick = () => onClick?.('Made');\n  const onHeartClick = () => onClick?.('❤');\n  const onNYCClick = () => onClick?.('NYC');\n  const onCodecademyClick = () => onClick?.('Codecademy');\n\n  const year = new Date().getFullYear();\n\n  return (\n    <Box\n      display={{ md: 'inline-block' }}\n      textAlign={{ _: 'center', md: 'right' }}\n    >\n      {onClick ? (\n        <>\n          <Anchor variant=\"interface\" onClick={onMadeClick}>\n            Made\n          </Anchor>{' '}\n          with\n          <HeartAnchorContainer variant=\"interface\" onClick={onHeartClick}>\n            ️❤️\n          </HeartAnchorContainer>\n          in{' '}\n          <Anchor variant=\"interface\" onClick={onNYCClick}>\n            NYC\n          </Anchor>{' '}\n          ©{` ${year} `}\n          <Anchor variant=\"interface\" onClick={onCodecademyClick}>\n            Codecademy\n          </Anchor>\n        </>\n      ) : (\n        <>\n          Made with <HeartContainer aria-label=\"love\">❤️</HeartContainer>in NYC\n          © {year} Codecademy\n        </>\n      )}\n    </Box>\n  );\n};\n"],"mappings":";;;;;;;AAKA,MAAM,cAAc,GAAG;;;;;;;AAQvB,MAAM,uBAAuB,OAAO,OAAO;IACvC,YAAY;;;AAIhB,MAAM,iBAAiB,OAAO,IAAI;IAC9B,YAAY;;AAOhB,MAAaA,UAAiC,EAAE,cAAc;CAC5D,MAAM,oBAAoB,UAAU,OAAO;CAC3C,MAAM,qBAAqB,UAAU,IAAI;CACzC,MAAM,mBAAmB,UAAU,MAAM;CACzC,MAAM,0BAA0B,UAAU,aAAa;CAEvD,MAAM,wBAAO,IAAI,MAAM,EAAC,aAAa;AAErC,QACE,oBAAC;EACC,SAAS,EAAE,IAAI,gBAAgB;EAC/B,WAAW;GAAE,GAAG;GAAU,IAAI;GAAS;YAEtC,UACC;GACE,oBAAC;IAAO,SAAQ;IAAY,SAAS;cAAa;KAEzC;GAAC;GAAI;GAEd,oBAAC;IAAqB,SAAQ;IAAY,SAAS;cAAc;KAE1C;;GACpB;GACH,oBAAC;IAAO,SAAQ;IAAY,SAAS;cAAY;KAExC;GAAC;GAAI;GACZ,IAAI,KAAK;GACX,oBAAC;IAAO,SAAQ;IAAY,SAAS;cAAmB;KAE/C;MACR,GAEH;GAAE;GACU,oBAAC;IAAe,cAAW;cAAO;KAAmB;;GAC5D;GAAK;MACP;GAED"}

package/dist/GlobalFooter/FooterLegal/index.js

@@ -23,4 +23,5 @@ const FooterLegal = ({ onClick, onMadeInClick }) => {
 };
 
 //#endregion
-export { FooterLegal };
+export { FooterLegal };
+//# sourceMappingURL=index.js.map

package/dist/GlobalFooter/FooterLegal/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":["FooterLegal: React.FC<FooterLegalProps>"],"sources":["../../../src/GlobalFooter/FooterLegal/index.tsx"],"sourcesContent":["import { theme, themed } from '@codecademy/gamut-styles';\nimport styled from '@emotion/styled';\nimport * as React from 'react';\n\nimport { GlobalFooterClickHandler } from '../types';\nimport { LegalLinks } from './LegalLinks';\nimport { MadeIn } from './MadeIn';\n\nconst LegalLocalContainer = styled.div`\n  border-top: 1px solid ${themed('colors.navy')};\n  font-size: 0.875rem;\n  padding: 1rem 0 0.5rem;\n  margin: 0;\n\n  ${theme.breakpoints.md} {\n    align-items: baseline;\n    display: flex;\n    justify-content: space-between;\n  }\n`;\n\nexport type FooterLegalProps = {\n  onClick: GlobalFooterClickHandler;\n  onMadeInClick?: (text: string) => void;\n};\n\nexport const FooterLegal: React.FC<FooterLegalProps> = ({\n  onClick,\n  onMadeInClick,\n}) => {\n  return (\n    <LegalLocalContainer>\n      <LegalLinks onClick={onClick} />\n      <MadeIn onClick={onMadeInClick} />\n    </LegalLocalContainer>\n  );\n};\n"],"mappings":";;;;;;;;AAQA,MAAM,sBAAsB,OAAO,GAAG;0BACZ,OAAO,cAAc,CAAC;;;;;IAK5C,MAAM,YAAY,GAAG;;;;;;AAYzB,MAAaA,eAA2C,EACtD,SACA,oBACI;AACJ,QACE,qBAAC,kCACC,oBAAC,cAAoB,UAAW,EAChC,oBAAC,UAAO,SAAS,gBAAiB,IACd"}

package/dist/GlobalFooter/FooterLinks.js

@@ -43,4 +43,5 @@ const FooterLinkItemWithAnchor = ({ trackingTarget, footerOnClick, ...anchorProp
 };
 
 //#endregion
-export { FooterLinkItem, FooterLinkItemWithAnchor, FooterLinkItems };
+export { FooterLinkItem, FooterLinkItemWithAnchor, FooterLinkItems };
+//# sourceMappingURL=FooterLinks.js.map

package/dist/GlobalFooter/FooterLinks.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FooterLinks.js","names":["FooterLinkItemWithAnchor: React.FC<\n  ComponentProps<typeof Anchor> & {\n    trackingTarget: string;\n    footerOnClick: GlobalFooterClickHandler;\n  }\n>"],"sources":["../../src/GlobalFooter/FooterLinks.tsx"],"sourcesContent":["import { Anchor, Box } from '@codecademy/gamut';\nimport { theme } from '@codecademy/gamut-styles';\nimport styled from '@emotion/styled';\nimport { ComponentProps, useCallback } from 'react';\nimport * as React from 'react';\n\nimport { GlobalFooterClickHandler } from './types';\n\nfunction FooterLinkItemsDefaults({\n  as = 'ul',\n  pl = 0,\n  mb = 0,\n  ...props\n}: React.ComponentProps<typeof Box>) {\n  return <Box as={as} pl={pl} mb={mb} {...props} />;\n}\n\nexport const FooterLinkItems = styled(FooterLinkItemsDefaults)`\n  list-style-type: none;\n`;\n\nexport const FooterLinkItem = styled.li`\n  font-size: 0.875rem;\n  margin: 0.5rem 0;\n\n  ${theme.breakpoints.sm} {\n    font-size: 1rem;\n    margin: 0.25rem 0;\n  }\n\n  ${theme.breakpoints.md} {\n    margin: 0.15rem 0;\n  }\n`;\n\nexport const FooterLinkItemWithAnchor: React.FC<\n  ComponentProps<typeof Anchor> & {\n    trackingTarget: string;\n    footerOnClick: GlobalFooterClickHandler;\n  }\n> = ({ trackingTarget, footerOnClick, ...anchorProps }) => {\n  const anchorOnClick = useCallback(\n    (event: React.MouseEvent<Element, MouseEvent>) => {\n      footerOnClick({ event, target: trackingTarget });\n    },\n    [footerOnClick, trackingTarget]\n  );\n\n  return (\n    <FooterLinkItem>\n      <Anchor {...anchorProps} onClick={anchorOnClick} />\n    </FooterLinkItem>\n  );\n};\n"],"mappings":";;;;;;;AAQA,SAAS,wBAAwB,EAC/B,KAAK,MACL,KAAK,GACL,KAAK,GACL,GAAG,SACgC;AACnC,QAAO,oBAAC;EAAQ;EAAQ;EAAQ;EAAI,GAAI;GAAS;;AAGnD,MAAa,kBAAkB,OAAO,wBAAwB;;;AAI9D,MAAa,iBAAiB,OAAO,EAAE;;;;IAInC,MAAM,YAAY,GAAG;;;;;IAKrB,MAAM,YAAY,GAAG;;;;AAKzB,MAAaA,4BAKR,EAAE,gBAAgB,eAAe,GAAG,kBAAkB;CACzD,MAAM,gBAAgB,aACnB,UAAiD;AAChD,gBAAc;GAAE;GAAO,QAAQ;GAAgB,CAAC;IAElD,CAAC,eAAe,eAAe,CAChC;AAED,QACE,oBAAC,4BACC,oBAAC;EAAO,GAAI;EAAa,SAAS;GAAiB,GACpC"}

package/dist/GlobalFooter/FooterNavLinks/CatalogLinks.js

@@ -291,4 +291,5 @@ const CatalogLinks = ({ onClick }) => {
 };
 
 //#endregion
-export { CatalogLinks };
+export { CatalogLinks };
+//# sourceMappingURL=CatalogLinks.js.map

package/dist/GlobalFooter/FooterNavLinks/CatalogLinks.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CatalogLinks.js","names":["variant","theme","CatalogLinks: React.FC<CatalogLinksProps>","downloadOnTheAppStore","getItOnGooglePlay"],"sources":["../../../src/GlobalFooter/FooterNavLinks/CatalogLinks.tsx"],"sourcesContent":["import { Anchor, Box, BoxProps, Column, LayoutGrid } from '@codecademy/gamut';\nimport { theme, themed, variant } from '@codecademy/gamut-styles';\nimport styled from '@emotion/styled';\nimport * as React from 'react';\n\nimport { FooterHeading } from '../FooterHeading';\nimport { FooterLinkItem, FooterLinkItems } from '../FooterLinks';\nimport { GlobalFooterClickHandler } from '../types';\nimport downloadOnTheAppStore from './assets/download-on-the-app-store.svg';\nimport getItOnGooglePlay from './assets/get-it-on-google-play.png';\n\nconst defaultWidth = {\n  _: '50%',\n  md: '90%',\n};\n\nfunction MobileImageLinkDefaults({\n  display = 'inline-block',\n  variant = 'interface',\n  width = defaultWidth,\n  ...props\n}: React.ComponentProps<typeof Anchor>) {\n  return (\n    <Anchor width={width} display={display} variant={variant} {...props} />\n  );\n}\n\nfunction MobileImageItemDefaults({\n  as = 'li',\n  display = 'inline-block',\n  my = 8,\n  ...props\n}: React.ComponentProps<typeof Box>) {\n  return <Box as={as} display={display} my={my} {...props} />;\n}\n\nconst MobileImageItem = styled(MobileImageItemDefaults)();\n\nconst MobileImageLink = styled(MobileImageLinkDefaults)();\n\nconst CatalogLinksContainer = styled.div`\n  border-top: 1px solid ${themed('colors.navy')};\n  margin-top: 2rem;\n\n  ${theme.breakpoints.sm} {\n    padding-top: 2rem;\n  }\n\n  ${theme.breakpoints.md} {\n    border-left: 1px solid ${({ theme }) => theme.colors.navy};\n    border-top: none;\n    margin-left: 0;\n    margin-top: 0;\n    padding-left: 2rem;\n    padding-top: 0;\n  }\n\n  ${theme.breakpoints.lg} {\n    padding-left: 4rem;\n  }\n`;\n\nconst CatalogLinkArea = styled(FooterLinkItems)<{ variant?: 'fullHeight' }>`\n  display: flex;\n  flex-direction: column;\n  flex-wrap: wrap;\n  margin-bottom: 1rem;\n\n  ${variant({ variants: { fullHeight: { maxHeight: { md: 'none' } } } })}\n`;\n\nconst CatalogFooterLinkItem = styled(FooterLinkItem)`\n  margin: 0.25rem 0;\n`;\n\nconst languages = [\n  ['bash', 'Bash'],\n  ['c', 'C'],\n  ['c-plus-plus', 'C++'],\n  ['c-sharp', 'C#'],\n  ['go', 'Go'],\n  ['html-css', 'HTML & CSS'],\n  ['java', 'Java'],\n  ['javascript', 'JavaScript'],\n  ['kotlin', 'Kotlin'],\n  ['php', 'PHP'],\n  ['python', 'Python'],\n  ['r', 'R'],\n  ['ruby', 'Ruby'],\n  ['sql', 'SQL'],\n  ['swift', 'Swift'],\n];\n\nconst subjects = [\n  ['artificial-intelligence', 'AI'],\n  ['cloud-computing', 'Cloud computing'],\n  ['code-foundations', 'Code foundations'],\n  ['computer-science', 'Computer science'],\n  ['cybersecurity', 'Cybersecurity'],\n  ['data-analytics', 'Data analytics'],\n  ['data-science', 'Data science'],\n  ['data-visualization', 'Data visualization'],\n  ['developer-tools', 'Developer tools'],\n  ['devops', 'DevOps'],\n  ['game-development', 'Game development'],\n  ['information-technology', 'IT'],\n  ['machine-learning', 'Machine learning'],\n  ['math', 'Math'],\n  ['mobile-development', 'Mobile development'],\n  ['web-design', 'Web design'],\n  ['web-development', 'Web development'],\n];\n\nexport type CatalogLinksProps = {\n  onClick: GlobalFooterClickHandler;\n  userGeo?: string;\n};\n\nexport const CatalogLinks: React.FC<CatalogLinksProps> = ({ onClick }) => {\n  const languagesList = (\n    <Box>\n      <FooterHeading>Languages</FooterHeading>\n      <CatalogLinkArea variant=\"fullHeight\">\n        {languages.map(([slug, text]) => (\n          <CatalogFooterLinkItem key={slug}>\n            <Anchor\n              href={`/catalog/language/${slug}`}\n              onClick={(event: React.MouseEvent<HTMLAnchorElement>) =>\n                onClick({ event, target: slug })\n              }\n              variant=\"interface\"\n              whiteSpace=\"nowrap\"\n            >\n              {text}\n            </Anchor>\n          </CatalogFooterLinkItem>\n        ))}\n      </CatalogLinkArea>\n    </Box>\n  );\n\n  const subjectsList = (\n    <Box>\n      <FooterHeading>Subjects</FooterHeading>\n      <CatalogLinkArea variant=\"fullHeight\">\n        {subjects.map(([slug, text]) => (\n          <CatalogFooterLinkItem key={slug}>\n            <Anchor\n              href={`/catalog/subject/${slug}`}\n              onClick={(event: React.MouseEvent<HTMLAnchorElement>) =>\n                onClick({ event, target: slug })\n              }\n              variant=\"interface\"\n              whiteSpace=\"nowrap\"\n            >\n              {text}\n            </Anchor>\n          </CatalogFooterLinkItem>\n        ))}\n      </CatalogLinkArea>\n    </Box>\n  );\n\n  const careerBuildingList = (\n    <Box>\n      <FooterHeading>Career building</FooterHeading>\n      <CatalogLinkArea variant=\"fullHeight\">\n        <CatalogFooterLinkItem>\n          <Anchor\n            href=\"/catalog/all\"\n            onClick={(event: React.MouseEvent<HTMLAnchorElement>) =>\n              onClick({ event, target: 'catalog' })\n            }\n            variant=\"interface\"\n            whiteSpace=\"nowrap\"\n          >\n            Career paths\n          </Anchor>\n        </CatalogFooterLinkItem>\n        <CatalogFooterLinkItem>\n          <Anchor\n            href=\"/career-center\"\n            onClick={(event: React.MouseEvent<HTMLAnchorElement>) =>\n              onClick({ event, target: 'career_services' })\n            }\n            variant=\"interface\"\n            whiteSpace=\"nowrap\"\n          >\n            Career Center\n          </Anchor>\n        </CatalogFooterLinkItem>\n        <CatalogFooterLinkItem>\n          <Anchor\n            href=\"/pages/interview-prep\"\n            onClick={(event: React.MouseEvent<HTMLAnchorElement>) =>\n              onClick({ event, target: 'interview_prep' })\n            }\n            variant=\"interface\"\n            whiteSpace=\"nowrap\"\n          >\n            Interview prep\n          </Anchor>\n        </CatalogFooterLinkItem>\n        <CatalogFooterLinkItem>\n          <Anchor\n            href=\"/pages/pro-certifications\"\n            onClick={(event: React.MouseEvent<HTMLAnchorElement>) =>\n              onClick({ event, target: 'pro_certifications' })\n            }\n            variant=\"interface\"\n            whiteSpace=\"nowrap\"\n          >\n            Professional certification\n          </Anchor>\n        </CatalogFooterLinkItem>\n        <CatalogFooterLinkItem>\n          <Anchor\n            href=\"/bootcamps\"\n            onClick={(event: React.MouseEvent<HTMLAnchorElement>) =>\n              onClick({ event, target: 'bootcamps' })\n            }\n            variant=\"interface\"\n          >\n            Bootcamps\n          </Anchor>\n        </CatalogFooterLinkItem>\n        <CatalogFooterLinkItem aria-hidden>—</CatalogFooterLinkItem>\n        <CatalogFooterLinkItem>\n          <Anchor\n            href=\"/catalog/all\"\n            onClick={(event: React.MouseEvent<HTMLAnchorElement>) =>\n              onClick({ event, target: 'fullCatalog' })\n            }\n            variant=\"interface\"\n          >\n            Full catalog\n          </Anchor>\n        </CatalogFooterLinkItem>\n        <CatalogFooterLinkItem>\n          <Anchor\n            href=\"/catalog/subject/beta\"\n            onClick={(event: React.MouseEvent<HTMLAnchorElement>) =>\n              onClick({ event, target: 'betaContent' })\n            }\n            variant=\"interface\"\n          >\n            Beta content\n          </Anchor>\n        </CatalogFooterLinkItem>\n        <CatalogFooterLinkItem>\n          <Anchor\n            href=\"https://trello.com/b/vAgDXtT6/codecademy-releases-roadmap\"\n            onClick={(event: React.MouseEvent<HTMLAnchorElement>) =>\n              onClick({ event, target: 'roadmap' })\n            }\n            variant=\"interface\"\n          >\n            Roadmap\n          </Anchor>\n        </CatalogFooterLinkItem>\n      </CatalogLinkArea>\n    </Box>\n  );\n\n  const appStoreLinks = (display: BoxProps['display']) => (\n    <Box display={display}>\n      <FooterHeading>Mobile</FooterHeading>\n      <FooterLinkItems display=\"flex\" flexDirection=\"column\">\n        <MobileImageItem>\n          <MobileImageLink\n            href=\"https://itunes.apple.com/us/app/codecademy-go/id1376029326\"\n            onClick={(event: React.MouseEvent<HTMLAnchorElement>) =>\n              onClick({ event, target: 'apple_store' })\n            }\n            target=\"_blank\"\n            rel=\"noopener\"\n          >\n            <img\n              alt=\"Download on the App Store\"\n              height=\"calc(40px + 1rem)\"\n              src={downloadOnTheAppStore}\n              width=\"calc(120px + 1.5rem)\"\n            />\n          </MobileImageLink>\n        </MobileImageItem>\n        <MobileImageItem>\n          <MobileImageLink\n            href=\"https://play.google.com/store/apps/details?id=com.ryzac.codecademygo\"\n            onClick={(event: React.MouseEvent<HTMLAnchorElement>) =>\n              onClick({ event, target: 'google_play' })\n            }\n            target=\"_blank\"\n            rel=\"noopener\"\n          >\n            <img\n              alt=\"Get it on Google Play\"\n              height=\"calc(40px + 1rem)\"\n              src={getItOnGooglePlay}\n              width=\"calc(133px + 1.5rem)\"\n            />\n          </MobileImageLink>\n        </MobileImageItem>\n      </FooterLinkItems>\n    </Box>\n  );\n\n  // Footer items change placement depending on screen size\n  return (\n    <CatalogLinksContainer>\n      <LayoutGrid columnGap={24}>\n        <Column size={{ _: 6, sm: 4 }}>{subjectsList}</Column>\n        <Column size={{ _: 6, sm: 4 }}>{languagesList}</Column>\n        <Column size={{ _: 6, sm: 4 }} gridTemplateRows=\"min-content\">\n          {careerBuildingList}\n          {/* desktop/tablet */}\n          {appStoreLinks({ _: 'none', sm: 'unset' })}\n        </Column>\n        <Column size={6} display={{ _: 'block', sm: 'none' }}>\n          {/* mobile */}\n          {appStoreLinks({ _: 'unset', sm: 'none' })}\n        </Column>\n      </LayoutGrid>\n    </CatalogLinksContainer>\n  );\n};\n"],"mappings":"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"}

package/dist/GlobalFooter/FooterNavLinks/CompanyLinks.js

@@ -249,4 +249,5 @@ const CompanyLinks = ({ hidePricing, onClick, userGeo, referralRockUrls, isBusin
 };
 
 //#endregion
-export { CompanyLinks };
+export { CompanyLinks };
+//# sourceMappingURL=CompanyLinks.js.map

package/dist/GlobalFooter/FooterNavLinks/CompanyLinks.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CompanyLinks.js","names":["CompanyLinks: React.FC<CompanyLinksProps>"],"sources":["../../../src/GlobalFooter/FooterNavLinks/CompanyLinks.tsx"],"sourcesContent":["import { Anchor, Box, BoxProps, Column, LayoutGrid } from '@codecademy/gamut';\nimport * as React from 'react';\n\nimport { LogoFromSkillsoft } from '../..';\nimport { footerResourcesList } from '../../lib/resourcesList';\nimport { FooterHeading } from '../FooterHeading';\nimport {\n  FooterLinkItem,\n  FooterLinkItems,\n  FooterLinkItemWithAnchor,\n} from '../FooterLinks';\nimport { GlobalFooterClickHandler } from '../types';\nimport { ReferAFriendLinkWithModal } from './ReferralRock/ReferAFriendLinkWithModal';\nimport type { ReferralRockUrls } from './ReferralRock/types';\nimport { SocialMediaLinks } from './SocialMediaLinks';\n\nexport type CompanyLinksProps = {\n  hidePricing?: boolean;\n  onClick: GlobalFooterClickHandler;\n  userGeo?: string;\n  referralRockUrls?: ReferralRockUrls;\n  isBusinessUser?: boolean;\n};\n\nexport const CompanyLinks: React.FC<CompanyLinksProps> = ({\n  hidePricing,\n  onClick,\n  userGeo,\n  referralRockUrls,\n  isBusinessUser,\n}) => {\n  const community = (\n    <Box>\n      <FooterHeading>Community</FooterHeading>\n      <FooterLinkItems>\n        <FooterLinkItem>\n          <Anchor\n            href=\"https://community.codecademy.com/c/start-here/\"\n            onClick={(event: React.MouseEvent<HTMLAnchorElement>) =>\n              onClick({ event, target: 'visit-community' })\n            }\n            target=\"_blank\"\n            variant=\"interface\"\n          >\n            Visit community\n          </Anchor>\n        </FooterLinkItem>\n        <FooterLinkItem>\n          <Anchor\n            href=\"https://try.codecademy.com/code-crew/\"\n            onClick={(event: React.MouseEvent<HTMLAnchorElement>) =>\n              onClick({ event, target: 'code-crew' })\n            }\n            target=\"_blank\"\n            variant=\"interface\"\n          >\n            Code Crew\n          </Anchor>\n        </FooterLinkItem>\n        <FooterLinkItem>\n          <Anchor\n            href=\"/events\"\n            onClick={(event: React.MouseEvent<HTMLAnchorElement>) =>\n              onClick({ event, target: 'events' })\n            }\n            variant=\"interface\"\n          >\n            Events\n          </Anchor>\n        </FooterLinkItem>\n        <FooterLinkItem>\n          <Anchor\n            href=\"https://www.codecademy.com/resources/blog/category/learner-stories\"\n            onClick={(event: React.MouseEvent<HTMLAnchorElement>) =>\n              onClick({ event, target: 'learner-stories' })\n            }\n            target=\"_blank\"\n            variant=\"interface\"\n          >\n            Learner Stories\n          </Anchor>\n        </FooterLinkItem>\n        {referralRockUrls && userGeo !== 'IN' ? (\n          <ReferAFriendLinkWithModal\n            referralRockUrls={referralRockUrls}\n            onClick={onClick}\n          />\n        ) : null}\n      </FooterLinkItems>\n    </Box>\n  );\n\n  const company = (\n    <>\n      <FooterHeading>Company</FooterHeading>\n      <FooterLinkItems>\n        <FooterLinkItem>\n          <Anchor\n            href=\"/about\"\n            onClick={(event: React.MouseEvent<HTMLAnchorElement>) =>\n              onClick({ event, target: 'about' })\n            }\n            variant=\"interface\"\n          >\n            About\n          </Anchor>\n        </FooterLinkItem>\n        <FooterLinkItem>\n          <Anchor\n            href=\"/about/careers\"\n            onClick={(event: React.MouseEvent<HTMLAnchorElement>) =>\n              onClick({ event, target: 'jobs' })\n            }\n            variant=\"interface\"\n          >\n            Careers\n          </Anchor>\n        </FooterLinkItem>\n        <FooterLinkItem>\n          <Anchor\n            href=\"/pages/codecademy-affiliate-program\"\n            onClick={(event: React.MouseEvent<HTMLAnchorElement>) =>\n              onClick({ event, target: 'affiliate_program' })\n            }\n            variant=\"interface\"\n          >\n            Affiliates\n          </Anchor>\n        </FooterLinkItem>\n        <FooterLinkItem>\n          <Anchor\n            href=\"/pages/partnerships\"\n            onClick={(event: React.MouseEvent<HTMLAnchorElement>) =>\n              onClick({ event, target: 'partnerships' })\n            }\n            variant=\"interface\"\n          >\n            Partnerships\n          </Anchor>\n        </FooterLinkItem>\n        <FooterLinkItem>\n          <SocialMediaLinks />\n        </FooterLinkItem>\n      </FooterLinkItems>\n    </>\n  );\n\n  const plans = (\n    <Box mb={{ _: 0, sm: 24 }}>\n      <FooterHeading>Plans</FooterHeading>\n      <FooterLinkItems>\n        <FooterLinkItem>\n          <Anchor\n            href=\"/pages/paid-plans\"\n            onClick={(event: React.MouseEvent<HTMLAnchorElement>) =>\n              onClick({ event, target: 'pro_membership' })\n            }\n            variant=\"interface\"\n          >\n            For individuals\n          </Anchor>\n        </FooterLinkItem>\n        <FooterLinkItem>\n          <Anchor\n            href=\"/student-center\"\n            onClick={(event: React.MouseEvent<HTMLAnchorElement>) =>\n              onClick({ event, target: 'students' })\n            }\n            variant=\"interface\"\n          >\n            For students\n          </Anchor>\n        </FooterLinkItem>\n        {!isBusinessUser && (\n          <FooterLinkItem>\n            <Anchor\n              href=\"/business\"\n              onClick={(event: React.MouseEvent<HTMLAnchorElement>) =>\n                onClick({ event, target: 'business_landing' })\n              }\n              variant=\"interface\"\n            >\n              For business\n            </Anchor>\n          </FooterLinkItem>\n        )}\n        <FooterLinkItem>\n          <Anchor\n            href=\"/pages/codecademy-discount-codes\"\n            onClick={(event: React.MouseEvent<HTMLAnchorElement>) =>\n              onClick({ event, target: 'codecademy-discounts' })\n            }\n            variant=\"interface\"\n          >\n            Discounts\n          </Anchor>\n        </FooterLinkItem>\n      </FooterLinkItems>\n    </Box>\n  );\n\n  const resources = (display: BoxProps['display']) => (\n    <Box display={display}>\n      <FooterHeading>Resources</FooterHeading>\n      <FooterLinkItems>\n        {footerResourcesList.map(\n          ({ id, trackingTarget, href, text, newTab }) => (\n            <FooterLinkItemWithAnchor\n              key={id}\n              footerOnClick={onClick}\n              trackingTarget={trackingTarget}\n              href={href}\n              variant=\"interface\"\n              target={newTab ? '_blank' : ''}\n            >\n              {text}\n            </FooterLinkItemWithAnchor>\n          )\n        )}\n      </FooterLinkItems>\n    </Box>\n  );\n\n  const support = (display: BoxProps['display']) => (\n    <Box display={display} mt={{ _: 0, sm: 24 }}>\n      <FooterHeading>Support</FooterHeading>\n      <FooterLinkItems>\n        <FooterLinkItem>\n          <Anchor\n            href=\"https://help.codecademy.com\"\n            onClick={(event: React.MouseEvent<HTMLAnchorElement>) =>\n              onClick({ event, target: 'help' })\n            }\n            target=\"_blank\"\n            variant=\"interface\"\n          >\n            Help Center\n          </Anchor>\n        </FooterLinkItem>\n      </FooterLinkItems>\n    </Box>\n  );\n\n  const logo = (display: BoxProps['display']) => (\n    <Box display={display} mt=\"auto\">\n      <FooterHeading as=\"span\">\n        <LogoFromSkillsoft height={40} />\n      </FooterHeading>\n    </Box>\n  );\n\n  // Footer items change placement depending on screen size\n  return (\n    <LayoutGrid>\n      <Column size={{ _: 6, sm: 4 }} order={1} gridTemplateRows=\"min-content\">\n        {company}\n        {/* mobile */}\n        {resources({ _: 'unset', sm: 'none' })}\n        {support({ _: 'unset', sm: 'none' })}\n      </Column>\n      <Column\n        size={{ _: 6, sm: 4 }}\n        order={{ _: 3, sm: 2 }}\n        gridTemplateRows=\"min-content\"\n      >\n        {/* desktop/tablet */}\n        {resources({ _: 'none', sm: 'unset' })}\n        {support({ _: 'none', sm: 'unset' })}\n      </Column>\n      <Column\n        size={{ _: 6, sm: 4 }}\n        order={{ _: 2, sm: 3 }}\n        gridTemplateRows=\"min-content\"\n      >\n        {hidePricing ? null : plans}\n        {community}\n        {/* mobile */}\n        {logo({ _: 'unset', sm: 'none' })}\n      </Column>\n      <Column\n        size={4}\n        order={4}\n        gridTemplateRows=\"min-content\"\n        mt=\"auto\"\n        display={{ _: 'none', sm: 'block' }}\n      >\n        {/* desktop/tablet */}\n        {logo({ _: 'none', sm: 'unset' })}\n      </Column>\n    </LayoutGrid>\n  );\n};\n"],"mappings":";;;;;;;;;;;AAwBA,MAAaA,gBAA6C,EACxD,aACA,SACA,SACA,kBACA,qBACI;CACJ,MAAM,YACJ,qBAAC,kBACC,oBAAC,2BAAc,cAAyB,EACxC,qBAAC;EACC,oBAAC,4BACC,oBAAC;GACC,MAAK;GACL,UAAU,UACR,QAAQ;IAAE;IAAO,QAAQ;IAAmB,CAAC;GAE/C,QAAO;GACP,SAAQ;aACT;IAEQ,GACM;EACjB,oBAAC,4BACC,oBAAC;GACC,MAAK;GACL,UAAU,UACR,QAAQ;IAAE;IAAO,QAAQ;IAAa,CAAC;GAEzC,QAAO;GACP,SAAQ;aACT;IAEQ,GACM;EACjB,oBAAC,4BACC,oBAAC;GACC,MAAK;GACL,UAAU,UACR,QAAQ;IAAE;IAAO,QAAQ;IAAU,CAAC;GAEtC,SAAQ;aACT;IAEQ,GACM;EACjB,oBAAC,4BACC,oBAAC;GACC,MAAK;GACL,UAAU,UACR,QAAQ;IAAE;IAAO,QAAQ;IAAmB,CAAC;GAE/C,QAAO;GACP,SAAQ;aACT;IAEQ,GACM;EAChB,oBAAoB,YAAY,OAC/B,oBAAC;GACmB;GACT;IACT,GACA;KACY,IACd;CAGR,MAAM,UACJ,4CACE,oBAAC,2BAAc,YAAuB,EACtC,qBAAC;EACC,oBAAC,4BACC,oBAAC;GACC,MAAK;GACL,UAAU,UACR,QAAQ;IAAE;IAAO,QAAQ;IAAS,CAAC;GAErC,SAAQ;aACT;IAEQ,GACM;EACjB,oBAAC,4BACC,oBAAC;GACC,MAAK;GACL,UAAU,UACR,QAAQ;IAAE;IAAO,QAAQ;IAAQ,CAAC;GAEpC,SAAQ;aACT;IAEQ,GACM;EACjB,oBAAC,4BACC,oBAAC;GACC,MAAK;GACL,UAAU,UACR,QAAQ;IAAE;IAAO,QAAQ;IAAqB,CAAC;GAEjD,SAAQ;aACT;IAEQ,GACM;EACjB,oBAAC,4BACC,oBAAC;GACC,MAAK;GACL,UAAU,UACR,QAAQ;IAAE;IAAO,QAAQ;IAAgB,CAAC;GAE5C,SAAQ;aACT;IAEQ,GACM;EACjB,oBAAC,4BACC,oBAAC,qBAAmB,GACL;KACD,IACjB;CAGL,MAAM,QACJ,qBAAC;EAAI,IAAI;GAAE,GAAG;GAAG,IAAI;GAAI;aACvB,oBAAC,2BAAc,UAAqB,EACpC,qBAAC;GACC,oBAAC,4BACC,oBAAC;IACC,MAAK;IACL,UAAU,UACR,QAAQ;KAAE;KAAO,QAAQ;KAAkB,CAAC;IAE9C,SAAQ;cACT;KAEQ,GACM;GACjB,oBAAC,4BACC,oBAAC;IACC,MAAK;IACL,UAAU,UACR,QAAQ;KAAE;KAAO,QAAQ;KAAY,CAAC;IAExC,SAAQ;cACT;KAEQ,GACM;GAChB,CAAC,kBACA,oBAAC,4BACC,oBAAC;IACC,MAAK;IACL,UAAU,UACR,QAAQ;KAAE;KAAO,QAAQ;KAAoB,CAAC;IAEhD,SAAQ;cACT;KAEQ,GACM;GAEnB,oBAAC,4BACC,oBAAC;IACC,MAAK;IACL,UAAU,UACR,QAAQ;KAAE;KAAO,QAAQ;KAAwB,CAAC;IAEpD,SAAQ;cACT;KAEQ,GACM;MACD;GACd;CAGR,MAAM,aAAa,YACjB,qBAAC;EAAa;aACZ,oBAAC,2BAAc,cAAyB,EACxC,oBAAC,6BACE,oBAAoB,KAClB,EAAE,IAAI,gBAAgB,MAAM,MAAM,aACjC,oBAAC;GAEC,eAAe;GACC;GACV;GACN,SAAQ;GACR,QAAQ,SAAS,WAAW;aAE3B;KAPI,GAQoB,CAE9B,GACe;GACd;CAGR,MAAM,WAAW,YACf,qBAAC;EAAa;EAAS,IAAI;GAAE,GAAG;GAAG,IAAI;GAAI;aACzC,oBAAC,2BAAc,YAAuB,EACtC,oBAAC,6BACC,oBAAC,4BACC,oBAAC;GACC,MAAK;GACL,UAAU,UACR,QAAQ;IAAE;IAAO,QAAQ;IAAQ,CAAC;GAEpC,QAAO;GACP,SAAQ;aACT;IAEQ,GACM,GACD;GACd;CAGR,MAAM,QAAQ,YACZ,oBAAC;EAAa;EAAS,IAAG;YACxB,oBAAC;GAAc,IAAG;aAChB,oBAAC,qBAAkB,QAAQ,KAAM;IACnB;GACZ;AAIR,QACE,qBAAC;EACC,qBAAC;GAAO,MAAM;IAAE,GAAG;IAAG,IAAI;IAAG;GAAE,OAAO;GAAG,kBAAiB;;IACvD;IAEA,UAAU;KAAE,GAAG;KAAS,IAAI;KAAQ,CAAC;IACrC,QAAQ;KAAE,GAAG;KAAS,IAAI;KAAQ,CAAC;;IAC7B;EACT,qBAAC;GACC,MAAM;IAAE,GAAG;IAAG,IAAI;IAAG;GACrB,OAAO;IAAE,GAAG;IAAG,IAAI;IAAG;GACtB,kBAAiB;cAGhB,UAAU;IAAE,GAAG;IAAQ,IAAI;IAAS,CAAC,EACrC,QAAQ;IAAE,GAAG;IAAQ,IAAI;IAAS,CAAC;IAC7B;EACT,qBAAC;GACC,MAAM;IAAE,GAAG;IAAG,IAAI;IAAG;GACrB,OAAO;IAAE,GAAG;IAAG,IAAI;IAAG;GACtB,kBAAiB;;IAEhB,cAAc,OAAO;IACrB;IAEA,KAAK;KAAE,GAAG;KAAS,IAAI;KAAQ,CAAC;;IAC1B;EACT,oBAAC;GACC,MAAM;GACN,OAAO;GACP,kBAAiB;GACjB,IAAG;GACH,SAAS;IAAE,GAAG;IAAQ,IAAI;IAAS;aAGlC,KAAK;IAAE,GAAG;IAAQ,IAAI;IAAS,CAAC;IAC1B;KACE"}

package/dist/GlobalFooter/FooterNavLinks/ReferralRock/ReferAFriendLinkWithModal.js

@@ -240,4 +240,5 @@ const ReferAFriendLinkWithModal = ({ referralRockUrls, onClick }) => {
 };
 
 //#endregion
-export { ReferAFriendLinkWithModal };
+export { ReferAFriendLinkWithModal };
+//# sourceMappingURL=ReferAFriendLinkWithModal.js.map