@codecademy/brand 4.0.0 → 5.0.0-alpha.19accb830.0

package/dist/AppHeader/AppHeaderElements/AppHeaderCatalogDropdown/NavPanels.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"NavPanels.cjs","names":["Anchor","Box","Card","FlexBox","GridBox","Text","LevelIcon","styled","useGlobalHeaderDynamicDataContext","useGlobalHeaderItemClick","liveLearningNavPanelItems","AppHeaderDietCard","useAppHeaderDropdownContext","useAppHeaderSectionContext","PanelLayout","SkillTile","CERTIFICATION_PROVIDERS","popularLanguages","popularSubjects","CourseTopicsPanel","globalHeaderItemClick","tabIndex","description","href","onClick","event","type","text","id","heading","linkItem","trackingTarget","variant","fontWeight","as","gridTemplateColumns","_","xs","md","gap","pl","listStyle","mb","map","item","li","key","DietCardGrid","children","sm","m","p","listStyleType","CareerPathsPanel","globalHeaderDynamicData","totalCareerPathCount","catalogDropdown","careerPaths","linkText","promotedCareerPaths","path","title","hours","durationHours","icon","difficulty","urlPath","SkillPathsPanel","totalSkillPathCount","skillPaths","promotedSkillPaths","Image","withComponent","GrayscaleToColorHoverLink","theme","colors","overrideImgFilters","hyper","ProviderTile","name","imgSrc","handleClose","lowercasedProviderName","toLowerCase","width","height","display","src","alt","CertificationPathsPanel","totalCertificationPathCount","certificationPaths","fontSize","logoUrl","hubType","LiveLearningImage","getImageUrl","LiveLearningPanel","data","overflow","border","borderColor","borderRadius","isInteractive","loading","flexDirection"],"sources":["../../../../src/AppHeader/AppHeaderElements/AppHeaderCatalogDropdown/NavPanels.tsx"],"sourcesContent":["import { Anchor, Box, Card, FlexBox, GridBox, Text } from '@codecademy/gamut';\nimport { LevelIcon } from '@codecademy/gamut-icons';\nimport styled from '@emotion/styled';\n\nimport { CourseDifficulty } from '../../../ContentGroupBaseCard/types';\nimport {\n  useGlobalHeaderDynamicDataContext,\n  useGlobalHeaderItemClick,\n} from '../../../GlobalHeader/context';\nimport { liveLearningNavPanelItems } from '../../../lib/catalogList';\nimport { AppHeaderDietCard } from '../AppHeaderDietCard';\nimport { useAppHeaderDropdownContext } from '../AppHeaderDropdownProvider';\nimport { useAppHeaderSectionContext } from '../AppHeaderSection/AppHeaderSectionContext';\nimport { PanelLayout } from '../AppHeaderSection/PanelLayout';\nimport { SkillTile } from '../AppHeaderSkillTile';\nimport {\n  CERTIFICATION_PROVIDERS,\n  popularLanguages,\n  popularSubjects,\n} from './consts';\n\nexport const CourseTopicsPanel = () => {\n  const { globalHeaderItemClick } = useGlobalHeaderItemClick();\n  const { tabIndex } = useAppHeaderSectionContext();\n\n  const description = (\n    <>\n      Explore free or paid courses in a wide variety of topics. With something\n      for every skill level, it&apos;s easy to find a course that fits your\n      goals. Not sure where to start? &nbsp;\n      <Anchor\n        tabIndex={tabIndex}\n        href=\"/welcome/find-a-course\"\n        onClick={(event: React.MouseEvent<HTMLAnchorElement, MouseEvent>) =>\n          globalHeaderItemClick(event, {\n            type: 'link',\n            href: '/welcome/find-a-course',\n            text: 'Take the quiz',\n            id: 'take-the-quiz',\n          })\n        }\n      >\n        Take the quiz\n      </Anchor>\n    </>\n  );\n\n  return (\n    <PanelLayout\n      heading=\"Course topics\"\n      description={description}\n      linkItem={{\n        type: 'link',\n        href: '/catalog',\n        text: 'Explore the full catalog',\n        trackingTarget: 'topnav_catalog',\n        id: 'explore-all-courses',\n      }}\n    >\n      <Text variant=\"p-large\" fontWeight={700} as=\"h3\">\n        Popular languages\n      </Text>\n      <GridBox\n        gridTemplateColumns={{ _: '1fr', xs: '1fr 1fr', md: '1fr 1fr 1fr' }}\n        gap={8}\n        pl={0}\n        as=\"ul\"\n        listStyle=\"none\"\n        mb={24}\n      >\n        {popularLanguages.map((item) => (\n          <li key={item.id}>\n            <SkillTile item={item} />\n          </li>\n        ))}\n      </GridBox>\n\n      <Text variant=\"p-large\" fontWeight={700} as=\"h3\">\n        Popular subjects\n      </Text>\n      <GridBox\n        gridTemplateColumns={{ _: '1fr', xs: '1fr 1fr', md: '1fr 1fr 1fr' }}\n        gap={8}\n        pl={0}\n        as=\"ul\"\n        listStyle=\"none\"\n      >\n        {popularSubjects.map((item) => (\n          <li key={item.id}>\n            <SkillTile item={item} />\n          </li>\n        ))}\n      </GridBox>\n    </PanelLayout>\n  );\n};\n\nexport const DietCardGrid = ({ children }: { children: React.ReactNode }) => {\n  return (\n    <GridBox\n      as=\"ul\"\n      gridTemplateColumns={{\n        _: '1fr',\n        sm: 'repeat(2, minmax(0, 1fr))',\n        md: 'repeat(3, minmax(0, 1fr))',\n      }}\n      gap={16}\n      m={0}\n      p={0}\n      listStyleType=\"none\"\n    >\n      {children}\n    </GridBox>\n  );\n};\n\nexport const CareerPathsPanel = () => {\n  const { globalHeaderDynamicData } = useGlobalHeaderDynamicDataContext();\n  const totalCareerPathCount =\n    globalHeaderDynamicData?.catalogDropdown.careerPaths.totalCareerPathCount;\n  const linkText = `Explore all${\n    totalCareerPathCount ? ` ${totalCareerPathCount}` : ''\n  } career paths`;\n\n  return (\n    <PanelLayout\n      heading=\"Career paths\"\n      description=\"Choose your career and we'll teach you the skills to get job-ready. Each Career Path contains a curated list of lessons, quizzes, videos, and projects to help you learn and practice real-world skills.\"\n      linkItem={{\n        type: 'link',\n        href: '/catalog?type=career-path',\n        text: linkText,\n        trackingTarget: 'topnav_catalog_header_explore_all_career_paths',\n        id: 'explore-all-career-paths',\n      }}\n    >\n      <DietCardGrid>\n        {globalHeaderDynamicData?.catalogDropdown.careerPaths.promotedCareerPaths.map(\n          (path) => {\n            return (\n              <AppHeaderDietCard\n                key={`${path.title}-card`}\n                title={path.title}\n                hours={path.durationHours}\n                icon={<LevelIcon />}\n                difficulty={path.difficulty as CourseDifficulty}\n                href={path.urlPath}\n                trackingTarget={`careerpath_${path.title}`}\n              />\n            );\n          }\n        )}\n      </DietCardGrid>\n    </PanelLayout>\n  );\n};\n\nexport const SkillPathsPanel = () => {\n  const { globalHeaderDynamicData } = useGlobalHeaderDynamicDataContext();\n  const totalSkillPathCount =\n    globalHeaderDynamicData?.catalogDropdown.skillPaths.totalSkillPathCount;\n  const linkText = `Explore all${\n    totalSkillPathCount ? ` ${totalSkillPathCount}` : ''\n  } skill paths`;\n\n  return (\n    <PanelLayout\n      heading=\"Skill paths\"\n      description=\"Build in demand skills fast with a short, curated path. Each one includes interactive content to help you learn and apply your new skill in just a few months.\"\n      linkItem={{\n        type: 'link',\n        href: '/catalog?type=skill-path',\n        text: linkText,\n        trackingTarget: 'topnav_catalog_header_explore_all_skill_paths',\n        id: 'explore-all-skill-paths',\n      }}\n    >\n      <DietCardGrid>\n        {globalHeaderDynamicData?.catalogDropdown.skillPaths.promotedSkillPaths.map(\n          (path) => {\n            return (\n              <AppHeaderDietCard\n                key={`${path.title}-card`}\n                title={path.title}\n                hours={path.durationHours}\n                icon={<LevelIcon />}\n                difficulty={path.difficulty as CourseDifficulty}\n                href={path.urlPath}\n                trackingTarget={`skill_${path.title}`}\n              />\n            );\n          }\n        )}\n      </DietCardGrid>\n    </PanelLayout>\n  );\n};\n\nconst Image = Box.withComponent('img');\n\nconst GrayscaleToColorHoverLink = styled(Anchor)<{\n  overrideImgFilters?: boolean;\n}>`\n  border: 1px solid ${({ theme }) => theme.colors['border-tertiary']};\n  border-radius: 8px;\n  filter: grayscale(1);\n  transition: filter 0.2s ease-out;\n  img {\n    filter: ${({ overrideImgFilters }) =>\n      overrideImgFilters ? 'contrast(5)' : 'brightness(0.25)'};\n    transition: filter 0.2s ease-out;\n  }\n  &:hover,\n  &:focus {\n    filter: grayscale(0);\n    img {\n      filter: brightness(1);\n    }\n    border-color: ${({ theme }) => theme.colors.hyper};\n    background-color: ${({ theme }) => theme.colors['navy-100']};\n  }\n`;\n\nconst ProviderTile = ({\n  name,\n  href,\n  imgSrc,\n  tabIndex,\n}: {\n  name: string;\n  href: string;\n  imgSrc: string;\n  tabIndex: number;\n}) => {\n  const { globalHeaderItemClick } = useGlobalHeaderItemClick();\n  const { handleClose } = useAppHeaderDropdownContext();\n\n  const lowercasedProviderName = name.toLowerCase();\n\n  return (\n    <GrayscaleToColorHoverLink\n      href={href}\n      variant=\"interface\"\n      key={name}\n      tabIndex={tabIndex}\n      width=\"100%\"\n      height={48}\n      p={8}\n      display=\"block\"\n      onClick={(event: React.MouseEvent<HTMLAnchorElement, MouseEvent>) => {\n        globalHeaderItemClick(event, {\n          type: 'link',\n          id: `topnav_catalog_cert_${lowercasedProviderName}`,\n          href,\n          text: name,\n          trackingTarget: `topnav_catalog_cert_${lowercasedProviderName}`,\n        });\n        handleClose();\n      }}\n      overrideImgFilters={name.toLowerCase() === 'kubernetes'}\n    >\n      <Image src={imgSrc} alt={name} display=\"block\" m=\"auto\" />\n    </GrayscaleToColorHoverLink>\n  );\n};\n\nexport const CertificationPathsPanel = () => {\n  const { globalHeaderDynamicData } = useGlobalHeaderDynamicDataContext();\n  const { tabIndex } = useAppHeaderSectionContext();\n  const totalCertificationPathCount =\n    globalHeaderDynamicData?.catalogDropdown.certificationPaths\n      .totalCertificationPathCount;\n  const linkText = `Explore all${\n    totalCertificationPathCount ? ` ${totalCertificationPathCount}` : ''\n  } certification paths`;\n\n  return (\n    <PanelLayout\n      heading=\"Certification paths\"\n      description=\"Prepare for top industry certifications with a guided path. Each one includes expert-reviewed lessons, hands-on projects, and practice tests to help you pass the exam.\"\n      linkItem={{\n        type: 'link',\n        href: '/catalog/certification-prep',\n        text: linkText,\n        trackingTarget: 'topnav_catalog_header_explore_all_certification_paths',\n        id: 'explore-all-certification-paths',\n      }}\n    >\n      <Text as=\"h3\" fontSize={18} fontWeight=\"bold\">\n        Providers\n      </Text>\n      <GridBox\n        gridTemplateColumns={{\n          _: '1fr',\n          xs: 'repeat(2, 1fr)',\n          sm: 'repeat(3, 1fr)',\n          md: 'repeat(4, 1fr)',\n        }}\n        gap={16}\n        width=\"100%\"\n        as=\"ul\"\n        listStyle=\"none\"\n        p={0}\n        m={0}\n      >\n        {CERTIFICATION_PROVIDERS.map(({ name, logoUrl, hubType }) => (\n          <Box as=\"li\" key={name} width=\"100%\">\n            <ProviderTile\n              name={name}\n              href={\n                hubType === 'subhub'\n                  ? `/search?query=${name} certifications`\n                  : `/catalog/certification-prep?provider=${name.toLowerCase()}`\n              }\n              imgSrc={logoUrl}\n              tabIndex={tabIndex}\n            />\n          </Box>\n        ))}\n      </GridBox>\n    </PanelLayout>\n  );\n};\n\nconst LiveLearningImage = styled.img`\n  object-fit: cover;\n  width: 100%;\n`;\n\nconst getImageUrl = (id: string) =>\n  `https://static-assets.codecademy.com/assets/components/cards/global-header/live-learning/v1/${id}.webp`;\n\nexport const LiveLearningPanel = () => {\n  const { globalHeaderItemClick } = useGlobalHeaderItemClick();\n  const { tabIndex } = useAppHeaderSectionContext();\n  const { handleClose } = useAppHeaderDropdownContext();\n\n  return (\n    <PanelLayout\n      heading=\"Live learning\"\n      description={liveLearningNavPanelItems.description}\n    >\n      <GridBox\n        gridTemplateColumns={{ _: '1fr', md: 'repeat(2, 1fr)' }}\n        gap={16}\n      >\n        {liveLearningNavPanelItems.data.map((item) => (\n          <Anchor\n            href={item.href}\n            key={item.id}\n            variant=\"interface\"\n            onClick={(\n              event: React.MouseEvent<HTMLAnchorElement, MouseEvent>\n            ) => {\n              globalHeaderItemClick(event, item);\n              handleClose();\n            }}\n            tabIndex={tabIndex}\n          >\n            <Card\n              key={item.id}\n              overflow=\"hidden\"\n              border={1}\n              borderColor=\"border-tertiary\"\n              borderRadius=\"lg\"\n              isInteractive\n              p={0}\n            >\n              <LiveLearningImage\n                src={getImageUrl(item.id)}\n                alt=\"\"\n                loading=\"lazy\"\n              />\n              <FlexBox flexDirection=\"column\" gap={8} p={16}>\n                <Text variant=\"title-xs\">{item.text}</Text>\n                {'description' in item && <Text>{item.description}</Text>}\n              </FlexBox>\n            </Card>\n          </Anchor>\n        ))}\n      </GridBox>\n    </PanelLayout>\n  );\n};\n"],"mappings":"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"}