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

package/dist/Carousel/index.js.map

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

package/dist/CertificationPathCard/index.cjs

@@ -0,0 +1,40 @@
+const require_runtime = require('../_virtual/_rolldown/runtime.cjs');
+const require_shared = require('../ContentGroupBaseCard/shared.cjs');
+const require_index = require('../ContentGroupBaseCard/index.cjs');
+let react = require("react");
+
+//#region src/CertificationPathCard/index.tsx
+const CertificationPathCard = /* @__PURE__ */ (0, react.forwardRef)(({ title, courseCount, enrollmentStatus, shortDescription, difficulty, certificationProvider, headingLevel, timeToComplete, header, footer, openInNewTab = false, href, onClick }, ref) => {
+	return /* @__PURE__ */ React.createElement(require_index.ContentGroupBaseCard, {
+		headerBackgroundColor: "orange-100",
+		headerText: "Certification path",
+		title,
+		headingLevel,
+		description: shortDescription,
+		difficulty,
+		numLessons: courseCount,
+		shadow: "outline",
+		enrollmentStatus,
+		timeToComplete,
+		brandDetails: {
+			name: certificationProvider?.name || "",
+			logoUrl: certificationProvider?.logoUrl || "",
+			logoHeight: {
+				AWS: 28,
+				Microsoft: 20,
+				HRCI: 28,
+				"Red Hat": 20
+			}[certificationProvider?.name || ""] || 24
+		},
+		header,
+		footer,
+		openInNewTab,
+		href,
+		onClick,
+		ref
+	}, /* @__PURE__ */ React.createElement(require_shared.CourseCountComponent, { count: courseCount }));
+});
+
+//#endregion
+exports.CertificationPathCard = CertificationPathCard;
+//# sourceMappingURL=index.cjs.map

package/dist/CertificationPathCard/index.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.cjs","names":["forwardRef","ContentGroupBaseCard","CourseCountComponent","CertificationPathCard","title","courseCount","enrollmentStatus","shortDescription","difficulty","certificationProvider","headingLevel","timeToComplete","header","footer","openInNewTab","href","onClick","ref","logoWidthOverrides","AWS","Microsoft","HRCI","headerBackgroundColor","headerText","description","numLessons","shadow","brandDetails","name","logoUrl","logoHeight","count"],"sources":["../../src/CertificationPathCard/index.tsx"],"sourcesContent":["import { HeadingTags } from '@codecademy/gamut';\nimport { forwardRef, PropsWithRef } from 'react';\n\nimport { ContentGroupBaseCard } from '../ContentGroupBaseCard';\nimport { CourseCountComponent } from '../ContentGroupBaseCard/shared';\nimport {\n  CourseDifficulty,\n  EnrollmentStatus,\n} from '../ContentGroupBaseCard/types';\n\ninterface CertificationProviderDetails {\n  name: string;\n  logoUrl: string;\n}\n\nexport interface CertificationPathCardProps {\n  title: string;\n  courseCount: number;\n  enrollmentStatus: EnrollmentStatus;\n  shortDescription?: string | null;\n  difficulty?: CourseDifficulty | null;\n  certificationProvider?: CertificationProviderDetails | null;\n  headingLevel?: HeadingTags;\n  timeToComplete?: number | null;\n  header?: React.ReactNode;\n  footer?: React.ReactNode;\n  openInNewTab?: boolean;\n  href: string;\n  onClick: () => void;\n}\n\nexport const CertificationPathCard = forwardRef<\n  HTMLAnchorElement,\n  PropsWithRef<CertificationPathCardProps>\n>(\n  (\n    {\n      title,\n      courseCount,\n      enrollmentStatus,\n      shortDescription,\n      difficulty,\n      certificationProvider,\n      headingLevel,\n      timeToComplete,\n      header,\n      footer,\n      openInNewTab = false,\n      href,\n      onClick,\n    },\n    ref\n  ) => {\n    const logoWidthOverrides: Record<string, number> = {\n      AWS: 28,\n      Microsoft: 20,\n      HRCI: 28,\n      'Red Hat': 20,\n    };\n\n    return (\n      <ContentGroupBaseCard\n        headerBackgroundColor=\"orange-100\"\n        headerText=\"Certification path\"\n        title={title}\n        headingLevel={headingLevel}\n        description={shortDescription}\n        difficulty={difficulty}\n        numLessons={courseCount}\n        shadow=\"outline\"\n        enrollmentStatus={enrollmentStatus}\n        timeToComplete={timeToComplete}\n        brandDetails={{\n          name: certificationProvider?.name || '',\n          logoUrl: certificationProvider?.logoUrl || '',\n          logoHeight:\n            logoWidthOverrides[certificationProvider?.name || ''] || 24,\n        }}\n        header={header}\n        footer={footer}\n        openInNewTab={openInNewTab}\n        href={href}\n        onClick={onClick}\n        ref={ref}\n      >\n        <CourseCountComponent count={courseCount} />\n      </ContentGroupBaseCard>\n    );\n  }\n);\n"],"mappings":";;;;;;AA+BA,MAAaG,wBAAwBH,uCAKjC,EACEI,OACAC,aACAC,kBACAC,kBACAC,YACAC,uBACAC,cACAC,gBACAC,QACAC,QACAC,eAAe,OACfC,MACAC,WAEFC,QAAAA;AASA,QACE,sBAAA,cAAChB,oCAAAA;EACCqB,uBAAsB;EACtBC,YAAW;EACJnB;EACOM;EACdc,aAAajB;EACDC;EACZiB,YAAYpB;EACZqB,QAAO;EACWpB;EACFK;EAChBgB,cAAc;GACZC,MAAMnB,uBAAuBmB,QAAQ;GACrCC,SAASpB,uBAAuBoB,WAAW;GAC3CC,YAtB6C;IACjDX,KAAK;IACLC,WAAW;IACXC,MAAM;IACN,WAAW;IACb,CAkB2BZ,uBAAuBmB,QAAQ,OAAO;GAC7D;EACQhB;EACAC;EACMC;EACRC;EACGC;EACJC;IAEL,sBAAA,cAACf,qCAAAA,EAAqB6B,OAAO1B;EAGnC"}

package/dist/CertificationPathCard/index.d.cts

@@ -0,0 +1,28 @@
+import { CourseDifficulty, EnrollmentStatus } from "../ContentGroupBaseCard/types.cjs";
+import { HeadingTags } from "@codecademy/gamut";
+import * as react from "react";
+
+//#region src/CertificationPathCard/index.d.ts
+interface CertificationProviderDetails {
+  name: string;
+  logoUrl: string;
+}
+interface CertificationPathCardProps {
+  title: string;
+  courseCount: number;
+  enrollmentStatus: EnrollmentStatus;
+  shortDescription?: string | null;
+  difficulty?: CourseDifficulty | null;
+  certificationProvider?: CertificationProviderDetails | null;
+  headingLevel?: HeadingTags;
+  timeToComplete?: number | null;
+  header?: React.ReactNode;
+  footer?: React.ReactNode;
+  openInNewTab?: boolean;
+  href: string;
+  onClick: () => void;
+}
+declare const CertificationPathCard: react.ForwardRefExoticComponent<CertificationPathCardProps & react.RefAttributes<HTMLAnchorElement>>;
+//#endregion
+export { CertificationPathCard, CertificationPathCardProps };
+//# sourceMappingURL=index.d.cts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.cts","names":[],"sources":["../../src/CertificationPathCard/index.tsx"],"mappings":";;;;;UAUU,4BAAA;EACR,IAAA;EACA,OAAA;AAAA;AAAA,UAGe,0BAAA;EACf,KAAA;EACA,WAAA;EACA,gBAAA,EAAkB,gBAAA;EAClB,gBAAA;EACA,UAAA,GAAa,gBAAA;EACb,qBAAA,GAAwB,4BAAA;EACxB,YAAA,GAAe,WAAA;EACf,cAAA;EACA,MAAA,GAAS,KAAA,CAAM,SAAA;EACf,MAAA,GAAS,KAAA,CAAM,SAAA;EACf,YAAA;EACA,IAAA;EACA,OAAA;AAAA;AAAA,cAGW,qBAAA,EAAqB,KAAA,CAAA,yBAAA,CAAA,0BAAA,GAAA,KAAA,CAAA,aAAA,CAAA,iBAAA"}

package/dist/CertificationPathCard/index.d.ts

@@ -1,23 +1,28 @@
-import { HeadingTags } from '@codecademy/gamut';
-import { CourseDifficulty, EnrollmentStatus } from '../ContentGroupBaseCard/types';
+import { CourseDifficulty, EnrollmentStatus } from "../ContentGroupBaseCard/types.js";
+import { HeadingTags } from "@codecademy/gamut";
+import * as react from "react";
+
+//#region src/CertificationPathCard/index.d.ts
 interface CertificationProviderDetails {
-    name: string;
-    logoUrl: string;
+  name: string;
+  logoUrl: string;
 }
-export interface CertificationPathCardProps {
-    title: string;
-    courseCount: number;
-    enrollmentStatus: EnrollmentStatus;
-    shortDescription?: string | null;
-    difficulty?: CourseDifficulty | null;
-    certificationProvider?: CertificationProviderDetails | null;
-    headingLevel?: HeadingTags;
-    timeToComplete?: number | null;
-    header?: React.ReactNode;
-    footer?: React.ReactNode;
-    openInNewTab?: boolean;
-    href: string;
-    onClick: () => void;
+interface CertificationPathCardProps {
+  title: string;
+  courseCount: number;
+  enrollmentStatus: EnrollmentStatus;
+  shortDescription?: string | null;
+  difficulty?: CourseDifficulty | null;
+  certificationProvider?: CertificationProviderDetails | null;
+  headingLevel?: HeadingTags;
+  timeToComplete?: number | null;
+  header?: React.ReactNode;
+  footer?: React.ReactNode;
+  openInNewTab?: boolean;
+  href: string;
+  onClick: () => void;
 }
-export declare const CertificationPathCard: import("react").ForwardRefExoticComponent<CertificationPathCardProps & import("react").RefAttributes<HTMLAnchorElement>>;
-export {};
+declare const CertificationPathCard: react.ForwardRefExoticComponent<CertificationPathCardProps & react.RefAttributes<HTMLAnchorElement>>;
+//#endregion
+export { CertificationPathCard, CertificationPathCardProps };
+//# sourceMappingURL=index.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","names":[],"sources":["../../src/CertificationPathCard/index.tsx"],"mappings":";;;;;UAUU,4BAAA;EACR,IAAA;EACA,OAAA;AAAA;AAAA,UAGe,0BAAA;EACf,KAAA;EACA,WAAA;EACA,gBAAA,EAAkB,gBAAA;EAClB,gBAAA;EACA,UAAA,GAAa,gBAAA;EACb,qBAAA,GAAwB,4BAAA;EACxB,YAAA,GAAe,WAAA;EACf,cAAA;EACA,MAAA,GAAS,KAAA,CAAM,SAAA;EACf,MAAA,GAAS,KAAA,CAAM,SAAA;EACf,YAAA;EACA,IAAA;EACA,OAAA;AAAA;AAAA,cAGW,qBAAA,EAAqB,KAAA,CAAA,yBAAA,CAAA,0BAAA,GAAA,KAAA,CAAA,aAAA,CAAA,iBAAA"}

package/dist/CertificationPathCard/index.js

@@ -1,52 +1,39 @@
-import { forwardRef } from 'react';
-import { ContentGroupBaseCard } from '../ContentGroupBaseCard';
-import { CourseCountComponent } from '../ContentGroupBaseCard/shared';
-import { jsx as _jsx } from "react/jsx-runtime";
-export const CertificationPathCard = /*#__PURE__*/forwardRef(({
-  title,
-  courseCount,
-  enrollmentStatus,
-  shortDescription,
-  difficulty,
-  certificationProvider,
-  headingLevel,
-  timeToComplete,
-  header,
-  footer,
-  openInNewTab = false,
-  href,
-  onClick
-}, ref) => {
-  const logoWidthOverrides = {
-    AWS: 28,
-    Microsoft: 20,
-    HRCI: 28,
-    'Red Hat': 20
-  };
-  return /*#__PURE__*/_jsx(ContentGroupBaseCard, {
-    headerBackgroundColor: "orange-100",
-    headerText: "Certification path",
-    title: title,
-    headingLevel: headingLevel,
-    description: shortDescription,
-    difficulty: difficulty,
-    numLessons: courseCount,
-    shadow: "outline",
-    enrollmentStatus: enrollmentStatus,
-    timeToComplete: timeToComplete,
-    brandDetails: {
-      name: certificationProvider?.name || '',
-      logoUrl: certificationProvider?.logoUrl || '',
-      logoHeight: logoWidthOverrides[certificationProvider?.name || ''] || 24
-    },
-    header: header,
-    footer: footer,
-    openInNewTab: openInNewTab,
-    href: href,
-    onClick: onClick,
-    ref: ref,
-    children: /*#__PURE__*/_jsx(CourseCountComponent, {
-      count: courseCount
-    })
-  });
-});
+import { CourseCountComponent } from "../ContentGroupBaseCard/shared.js";
+import { ContentGroupBaseCard } from "../ContentGroupBaseCard/index.js";
+import { forwardRef } from "react";
+
+//#region src/CertificationPathCard/index.tsx
+const CertificationPathCard = /* @__PURE__ */ forwardRef(({ title, courseCount, enrollmentStatus, shortDescription, difficulty, certificationProvider, headingLevel, timeToComplete, header, footer, openInNewTab = false, href, onClick }, ref) => {
+	return /* @__PURE__ */ React.createElement(ContentGroupBaseCard, {
+		headerBackgroundColor: "orange-100",
+		headerText: "Certification path",
+		title,
+		headingLevel,
+		description: shortDescription,
+		difficulty,
+		numLessons: courseCount,
+		shadow: "outline",
+		enrollmentStatus,
+		timeToComplete,
+		brandDetails: {
+			name: certificationProvider?.name || "",
+			logoUrl: certificationProvider?.logoUrl || "",
+			logoHeight: {
+				AWS: 28,
+				Microsoft: 20,
+				HRCI: 28,
+				"Red Hat": 20
+			}[certificationProvider?.name || ""] || 24
+		},
+		header,
+		footer,
+		openInNewTab,
+		href,
+		onClick,
+		ref
+	}, /* @__PURE__ */ React.createElement(CourseCountComponent, { count: courseCount }));
+});
+
+//#endregion
+export { CertificationPathCard };
+//# sourceMappingURL=index.js.map

package/dist/CertificationPathCard/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":["forwardRef","ContentGroupBaseCard","CourseCountComponent","CertificationPathCard","title","courseCount","enrollmentStatus","shortDescription","difficulty","certificationProvider","headingLevel","timeToComplete","header","footer","openInNewTab","href","onClick","ref","logoWidthOverrides","AWS","Microsoft","HRCI","headerBackgroundColor","headerText","description","numLessons","shadow","brandDetails","name","logoUrl","logoHeight","count"],"sources":["../../src/CertificationPathCard/index.tsx"],"sourcesContent":["import { HeadingTags } from '@codecademy/gamut';\nimport { forwardRef, PropsWithRef } from 'react';\n\nimport { ContentGroupBaseCard } from '../ContentGroupBaseCard';\nimport { CourseCountComponent } from '../ContentGroupBaseCard/shared';\nimport {\n  CourseDifficulty,\n  EnrollmentStatus,\n} from '../ContentGroupBaseCard/types';\n\ninterface CertificationProviderDetails {\n  name: string;\n  logoUrl: string;\n}\n\nexport interface CertificationPathCardProps {\n  title: string;\n  courseCount: number;\n  enrollmentStatus: EnrollmentStatus;\n  shortDescription?: string | null;\n  difficulty?: CourseDifficulty | null;\n  certificationProvider?: CertificationProviderDetails | null;\n  headingLevel?: HeadingTags;\n  timeToComplete?: number | null;\n  header?: React.ReactNode;\n  footer?: React.ReactNode;\n  openInNewTab?: boolean;\n  href: string;\n  onClick: () => void;\n}\n\nexport const CertificationPathCard = forwardRef<\n  HTMLAnchorElement,\n  PropsWithRef<CertificationPathCardProps>\n>(\n  (\n    {\n      title,\n      courseCount,\n      enrollmentStatus,\n      shortDescription,\n      difficulty,\n      certificationProvider,\n      headingLevel,\n      timeToComplete,\n      header,\n      footer,\n      openInNewTab = false,\n      href,\n      onClick,\n    },\n    ref\n  ) => {\n    const logoWidthOverrides: Record<string, number> = {\n      AWS: 28,\n      Microsoft: 20,\n      HRCI: 28,\n      'Red Hat': 20,\n    };\n\n    return (\n      <ContentGroupBaseCard\n        headerBackgroundColor=\"orange-100\"\n        headerText=\"Certification path\"\n        title={title}\n        headingLevel={headingLevel}\n        description={shortDescription}\n        difficulty={difficulty}\n        numLessons={courseCount}\n        shadow=\"outline\"\n        enrollmentStatus={enrollmentStatus}\n        timeToComplete={timeToComplete}\n        brandDetails={{\n          name: certificationProvider?.name || '',\n          logoUrl: certificationProvider?.logoUrl || '',\n          logoHeight:\n            logoWidthOverrides[certificationProvider?.name || ''] || 24,\n        }}\n        header={header}\n        footer={footer}\n        openInNewTab={openInNewTab}\n        href={href}\n        onClick={onClick}\n        ref={ref}\n      >\n        <CourseCountComponent count={courseCount} />\n      </ContentGroupBaseCard>\n    );\n  }\n);\n"],"mappings":";;;;;AA+BA,MAAaG,wBAAwBH,4BAKjC,EACEI,OACAC,aACAC,kBACAC,kBACAC,YACAC,uBACAC,cACAC,gBACAC,QACAC,QACAC,eAAe,OACfC,MACAC,WAEFC,QAAAA;AASA,QACE,sBAAA,cAAChB,sBAAAA;EACCqB,uBAAsB;EACtBC,YAAW;EACJnB;EACOM;EACdc,aAAajB;EACDC;EACZiB,YAAYpB;EACZqB,QAAO;EACWpB;EACFK;EAChBgB,cAAc;GACZC,MAAMnB,uBAAuBmB,QAAQ;GACrCC,SAASpB,uBAAuBoB,WAAW;GAC3CC,YAtB6C;IACjDX,KAAK;IACLC,WAAW;IACXC,MAAM;IACN,WAAW;IACb,CAkB2BZ,uBAAuBmB,QAAQ,OAAO;GAC7D;EACQhB;EACAC;EACMC;EACRC;EACGC;EACJC;IAEL,sBAAA,cAACf,sBAAAA,EAAqB6B,OAAO1B;EAGnC"}

package/dist/CoachingSessionCard/index.cjs

@@ -0,0 +1,54 @@
+const require_runtime = require('../_virtual/_rolldown/runtime.cjs');
+let _codecademy_gamut = require("@codecademy/gamut");
+let _codecademy_gamut_icons = require("@codecademy/gamut-icons");
+let date_fns_tz = require("date-fns-tz");
+
+//#region src/CoachingSessionCard/index.tsx
+const formatTime = (timeString, format) => {
+	return (0, date_fns_tz.formatInTimeZone)(new Date(timeString), Intl.DateTimeFormat().resolvedOptions().timeZone, format);
+};
+const CoachingSessionCard = ({ session, ctas }) => /* @__PURE__ */ React.createElement(_codecademy_gamut.Card, {
+	borderRadius: "xl",
+	p: 32,
+	height: "auto"
+}, /* @__PURE__ */ React.createElement(_codecademy_gamut.FlexBox, { column: true }, /* @__PURE__ */ React.createElement(_codecademy_gamut.Text, { mb: 12 }, /* @__PURE__ */ React.createElement(_codecademy_gamut.Text, { fontWeight: "bold" }, session.coachOfferingCategoryName), " ", "coaching session with", " ", /* @__PURE__ */ React.createElement(_codecademy_gamut.Text, { fontWeight: "bold" }, session.participantName)), /* @__PURE__ */ React.createElement(_codecademy_gamut.FlexBox, {
+	alignItems: "center",
+	gap: 16,
+	mb: 24
+}, /* @__PURE__ */ React.createElement(_codecademy_gamut.FlexBox, {
+	alignItems: "center",
+	gap: 8
+}, /* @__PURE__ */ React.createElement(_codecademy_gamut_icons.CalendarIcon, { size: 16 }), /* @__PURE__ */ React.createElement(_codecademy_gamut.Text, {
+	variant: "p-small",
+	color: "text-secondary"
+}, new Date(session.startTime).toLocaleDateString(void 0, {
+	weekday: "long",
+	month: "long",
+	day: "numeric",
+	year: "numeric"
+}))), /* @__PURE__ */ React.createElement(_codecademy_gamut.FlexBox, {
+	alignItems: "center",
+	gap: 8
+}, /* @__PURE__ */ React.createElement(_codecademy_gamut_icons.ClockIcon, { size: 16 }), /* @__PURE__ */ React.createElement(_codecademy_gamut.Text, {
+	variant: "p-small",
+	color: "text-secondary"
+}, `${formatTime(session.startTime, "h:mm aa")} - ${formatTime(session.endTime, "h:mm aa z")}`)), session.status && /* @__PURE__ */ React.createElement(_codecademy_gamut.Text, {
+	variant: "p-small",
+	fontWeight: "bold"
+}, "Status: ", session.status)), /* @__PURE__ */ React.createElement(_codecademy_gamut.FlexBox, {
+	alignItems: "center",
+	gap: 8
+}, ctas?.map((cta) => {
+	const Button = cta.buttonType === "fill" ? _codecademy_gamut.FillButton : cta.buttonType === "stroke" ? _codecademy_gamut.StrokeButton : _codecademy_gamut.TextButton;
+	return /* @__PURE__ */ React.createElement(Button, {
+		href: cta.href,
+		key: cta.text,
+		onClick: cta.onClick,
+		disabled: cta.disabled,
+		variant: cta.variant
+	}, cta.text);
+}))));
+
+//#endregion
+exports.CoachingSessionCard = CoachingSessionCard;
+//# sourceMappingURL=index.cjs.map

package/dist/CoachingSessionCard/index.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.cjs","names":["Card","FillButton","FlexBox","StrokeButton","Text","TextButton","CalendarIcon","ClockIcon","formatInTimeZone","formatTime","timeString","format","Date","Intl","DateTimeFormat","resolvedOptions","timeZone","CoachingSessionCard","session","ctas","borderRadius","p","height","column","mb","fontWeight","coachOfferingCategoryName","participantName","alignItems","gap","size","variant","color","startTime","toLocaleDateString","undefined","weekday","month","day","year","endTime","status","map","cta","Button","buttonType","href","key","text","onClick","disabled"],"sources":["../../src/CoachingSessionCard/index.tsx"],"sourcesContent":["import {\n  Card,\n  FillButton,\n  FlexBox,\n  StrokeButton,\n  Text,\n  TextButton,\n} from '@codecademy/gamut';\nimport { CalendarIcon, ClockIcon } from '@codecademy/gamut-icons';\nimport { formatInTimeZone } from 'date-fns-tz';\n\nconst formatTime = (timeString: string, format: string) => {\n  return formatInTimeZone(\n    new Date(timeString),\n    Intl.DateTimeFormat().resolvedOptions().timeZone,\n    format\n  );\n};\n\nexport interface CoachingSessionCardProps {\n  session: {\n    id: string;\n    startTime: string;\n    endTime: string;\n    coachOfferingCategoryName: string;\n    participantName?: string | null;\n    zoomJoinUrl?: string | null;\n    rescheduleUrl?: string | null;\n    status?: string | null;\n  };\n  ctas?: {\n    text: string;\n    href?: string;\n    onClick?: () => void;\n    buttonType?: 'fill' | 'stroke' | 'text';\n    disabled?: boolean;\n    variant?: 'primary' | 'secondary' | 'danger';\n  }[];\n}\n\nexport const CoachingSessionCard: React.FC<CoachingSessionCardProps> = ({\n  session,\n  ctas,\n}) => (\n  <Card borderRadius=\"xl\" p={32} height=\"auto\">\n    <FlexBox column>\n      <Text mb={12}>\n        <Text fontWeight=\"bold\">{session.coachOfferingCategoryName}</Text>{' '}\n        coaching session with{' '}\n        <Text fontWeight=\"bold\">{session.participantName}</Text>\n      </Text>\n      <FlexBox alignItems=\"center\" gap={16} mb={24}>\n        <FlexBox alignItems=\"center\" gap={8}>\n          <CalendarIcon size={16} />\n          <Text variant=\"p-small\" color=\"text-secondary\">\n            {new Date(session.startTime).toLocaleDateString(undefined, {\n              weekday: 'long',\n              month: 'long',\n              day: 'numeric',\n              year: 'numeric',\n            })}\n          </Text>\n        </FlexBox>\n        <FlexBox alignItems=\"center\" gap={8}>\n          <ClockIcon size={16} />\n          <Text variant=\"p-small\" color=\"text-secondary\">\n            {`${formatTime(session.startTime, 'h:mm aa')} - ${formatTime(\n              session.endTime,\n              'h:mm aa z'\n            )}`}\n          </Text>\n        </FlexBox>\n        {session.status && (\n          <Text variant=\"p-small\" fontWeight=\"bold\">\n            Status: {session.status}\n          </Text>\n        )}\n      </FlexBox>\n      <FlexBox alignItems=\"center\" gap={8}>\n        {ctas?.map((cta) => {\n          const Button =\n            cta.buttonType === 'fill'\n              ? FillButton\n              : cta.buttonType === 'stroke'\n              ? StrokeButton\n              : TextButton;\n          return (\n            <Button\n              href={cta.href}\n              key={cta.text}\n              onClick={cta.onClick}\n              disabled={cta.disabled}\n              variant={cta.variant}\n            >\n              {cta.text}\n            </Button>\n          );\n        })}\n      </FlexBox>\n    </FlexBox>\n  </Card>\n);\n"],"mappings":";;;;;;AAWA,MAAMS,cAAcC,YAAoBC,WAAAA;AACtC,0CACE,IAAIC,KAAKF,WAAAA,EACTG,KAAKC,gBAAc,CAAGC,iBAAe,CAAGC,UACxCL,OAAAA;;AAyBJ,MAAaM,uBAA2D,EACtEC,SACAC,WAEA,sBAAA,cAACnB,wBAAAA;CAAKoB,cAAa;CAAKC,GAAG;CAAIC,QAAO;GACpC,sBAAA,cAACpB,2BAAAA,EAAQqB,QAAAA,QACP,sBAAA,cAACnB,wBAAAA,EAAKoB,IAAI,MACR,sBAAA,cAACpB,wBAAAA,EAAKqB,YAAW,UAAQP,QAAQQ,0BAAyB,EAAS,KAAI,yBACjD,KACtB,sBAAA,cAACtB,wBAAAA,EAAKqB,YAAW,UAAQP,QAAQS,gBAAe,CAAA,EAElD,sBAAA,cAACzB,2BAAAA;CAAQ0B,YAAW;CAASC,KAAK;CAAIL,IAAI;GACxC,sBAAA,cAACtB,2BAAAA;CAAQ0B,YAAW;CAASC,KAAK;GAChC,sBAAA,cAACvB,sCAAAA,EAAawB,MAAM,OACpB,sBAAA,cAAC1B,wBAAAA;CAAK2B,SAAQ;CAAUC,OAAM;GAC3B,IAAIpB,KAAKM,QAAQe,UAAS,CAAEC,mBAAmBC,QAAW;CACzDC,SAAS;CACTC,OAAO;CACPC,KAAK;CACLC,MAAM;CACR,CAAA,CAAA,CAAA,EAGJ,sBAAA,cAACrC,2BAAAA;CAAQ0B,YAAW;CAASC,KAAK;GAChC,sBAAA,cAACtB,mCAAAA,EAAUuB,MAAM,OACjB,sBAAA,cAAC1B,wBAAAA;CAAK2B,SAAQ;CAAUC,OAAM;GAC3B,GAAGvB,WAAWS,QAAQe,WAAW,UAAA,CAAW,KAAKxB,WAChDS,QAAQsB,SACR,YAAA,GACC,CAAA,EAGNtB,QAAQuB,UACP,sBAAA,cAACrC,wBAAAA;CAAK2B,SAAQ;CAAUN,YAAW;GAAO,YAC/BP,QAAQuB,OAAM,CAAA,EAI7B,sBAAA,cAACvC,2BAAAA;CAAQ0B,YAAW;CAASC,KAAK;GAC/BV,MAAMuB,KAAKC,QAAAA;CACV,MAAMC,SACJD,IAAIE,eAAe,SACf5C,+BACA0C,IAAIE,eAAe,WACnB1C,iCACAE;AACN,QACE,sBAAA,cAACuC,QAAAA;EACCE,MAAMH,IAAIG;EACVC,KAAKJ,IAAIK;EACTC,SAASN,IAAIM;EACbC,UAAUP,IAAIO;EACdnB,SAASY,IAAIZ;IAEZY,IAAIK,KAAI;EAGf,CAAA,CAAA,CAAA"}

package/dist/CoachingSessionCard/index.d.cts

@@ -0,0 +1,25 @@
+//#region src/CoachingSessionCard/index.d.ts
+interface CoachingSessionCardProps {
+  session: {
+    id: string;
+    startTime: string;
+    endTime: string;
+    coachOfferingCategoryName: string;
+    participantName?: string | null;
+    zoomJoinUrl?: string | null;
+    rescheduleUrl?: string | null;
+    status?: string | null;
+  };
+  ctas?: {
+    text: string;
+    href?: string;
+    onClick?: () => void;
+    buttonType?: 'fill' | 'stroke' | 'text';
+    disabled?: boolean;
+    variant?: 'primary' | 'secondary' | 'danger';
+  }[];
+}
+declare const CoachingSessionCard: React.FC<CoachingSessionCardProps>;
+//#endregion
+export { CoachingSessionCard, CoachingSessionCardProps };
+//# sourceMappingURL=index.d.cts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.cts","names":[],"sources":["../../src/CoachingSessionCard/index.tsx"],"mappings":";UAmBiB,wBAAA;EACf,OAAA;IACE,EAAA;IACA,SAAA;IACA,OAAA;IACA,yBAAA;IACA,eAAA;IACA,WAAA;IACA,aAAA;IACA,MAAA;EAAA;EAEF,IAAA;IACE,IAAA;IACA,IAAA;IACA,OAAA;IACA,UAAA;IACA,QAAA;IACA,OAAA;EAAA;AAAA;AAAA,cAIS,mBAAA,EAAqB,KAAA,CAAM,EAAA,CAAG,wBAAA"}

package/dist/CoachingSessionCard/index.d.ts

@@ -1,21 +1,25 @@
-export interface CoachingSessionCardProps {
-    session: {
-        id: string;
-        startTime: string;
-        endTime: string;
-        coachOfferingCategoryName: string;
-        participantName?: string | null;
-        zoomJoinUrl?: string | null;
-        rescheduleUrl?: string | null;
-        status?: string | null;
-    };
-    ctas?: {
-        text: string;
-        href?: string;
-        onClick?: () => void;
-        buttonType?: 'fill' | 'stroke' | 'text';
-        disabled?: boolean;
-        variant?: 'primary' | 'secondary' | 'danger';
-    }[];
+//#region src/CoachingSessionCard/index.d.ts
+interface CoachingSessionCardProps {
+  session: {
+    id: string;
+    startTime: string;
+    endTime: string;
+    coachOfferingCategoryName: string;
+    participantName?: string | null;
+    zoomJoinUrl?: string | null;
+    rescheduleUrl?: string | null;
+    status?: string | null;
+  };
+  ctas?: {
+    text: string;
+    href?: string;
+    onClick?: () => void;
+    buttonType?: 'fill' | 'stroke' | 'text';
+    disabled?: boolean;
+    variant?: 'primary' | 'secondary' | 'danger';
+  }[];
 }
-export declare const CoachingSessionCard: React.FC<CoachingSessionCardProps>;
+declare const CoachingSessionCard: React.FC<CoachingSessionCardProps>;
+//#endregion
+export { CoachingSessionCard, CoachingSessionCardProps };
+//# sourceMappingURL=index.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","names":[],"sources":["../../src/CoachingSessionCard/index.tsx"],"mappings":";UAmBiB,wBAAA;EACf,OAAA;IACE,EAAA;IACA,SAAA;IACA,OAAA;IACA,yBAAA;IACA,eAAA;IACA,WAAA;IACA,aAAA;IACA,MAAA;EAAA;EAEF,IAAA;IACE,IAAA;IACA,IAAA;IACA,OAAA;IACA,UAAA;IACA,QAAA;IACA,OAAA;EAAA;AAAA;AAAA,cAIS,mBAAA,EAAqB,KAAA,CAAM,EAAA,CAAG,wBAAA"}

package/dist/CoachingSessionCard/index.js

@@ -1,75 +1,53 @@
-import { Card, FillButton, FlexBox, StrokeButton, Text, TextButton } from '@codecademy/gamut';
-import { CalendarIcon, ClockIcon } from '@codecademy/gamut-icons';
-import { formatInTimeZone } from 'date-fns-tz';
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Card, FillButton, FlexBox, StrokeButton, Text, TextButton } from "@codecademy/gamut";
+import { CalendarIcon, ClockIcon } from "@codecademy/gamut-icons";
+import { formatInTimeZone } from "date-fns-tz";
+
+//#region src/CoachingSessionCard/index.tsx
 const formatTime = (timeString, format) => {
-  return formatInTimeZone(new Date(timeString), Intl.DateTimeFormat().resolvedOptions().timeZone, format);
+	return formatInTimeZone(new Date(timeString), Intl.DateTimeFormat().resolvedOptions().timeZone, format);
 };
-export const CoachingSessionCard = ({
-  session,
-  ctas
-}) => /*#__PURE__*/_jsx(Card, {
-  borderRadius: "xl",
-  p: 32,
-  height: "auto",
-  children: /*#__PURE__*/_jsxs(FlexBox, {
-    column: true,
-    children: [/*#__PURE__*/_jsxs(Text, {
-      mb: 12,
-      children: [/*#__PURE__*/_jsx(Text, {
-        fontWeight: "bold",
-        children: session.coachOfferingCategoryName
-      }), ' ', "coaching session with", ' ', /*#__PURE__*/_jsx(Text, {
-        fontWeight: "bold",
-        children: session.participantName
-      })]
-    }), /*#__PURE__*/_jsxs(FlexBox, {
-      alignItems: "center",
-      gap: 16,
-      mb: 24,
-      children: [/*#__PURE__*/_jsxs(FlexBox, {
-        alignItems: "center",
-        gap: 8,
-        children: [/*#__PURE__*/_jsx(CalendarIcon, {
-          size: 16
-        }), /*#__PURE__*/_jsx(Text, {
-          variant: "p-small",
-          color: "text-secondary",
-          children: new Date(session.startTime).toLocaleDateString(undefined, {
-            weekday: 'long',
-            month: 'long',
-            day: 'numeric',
-            year: 'numeric'
-          })
-        })]
-      }), /*#__PURE__*/_jsxs(FlexBox, {
-        alignItems: "center",
-        gap: 8,
-        children: [/*#__PURE__*/_jsx(ClockIcon, {
-          size: 16
-        }), /*#__PURE__*/_jsx(Text, {
-          variant: "p-small",
-          color: "text-secondary",
-          children: `${formatTime(session.startTime, 'h:mm aa')} - ${formatTime(session.endTime, 'h:mm aa z')}`
-        })]
-      }), session.status && /*#__PURE__*/_jsxs(Text, {
-        variant: "p-small",
-        fontWeight: "bold",
-        children: ["Status: ", session.status]
-      })]
-    }), /*#__PURE__*/_jsx(FlexBox, {
-      alignItems: "center",
-      gap: 8,
-      children: ctas?.map(cta => {
-        const Button = cta.buttonType === 'fill' ? FillButton : cta.buttonType === 'stroke' ? StrokeButton : TextButton;
-        return /*#__PURE__*/_jsx(Button, {
-          href: cta.href,
-          onClick: cta.onClick,
-          disabled: cta.disabled,
-          variant: cta.variant,
-          children: cta.text
-        }, cta.text);
-      })
-    })]
-  })
-});
+const CoachingSessionCard = ({ session, ctas }) => /* @__PURE__ */ React.createElement(Card, {
+	borderRadius: "xl",
+	p: 32,
+	height: "auto"
+}, /* @__PURE__ */ React.createElement(FlexBox, { column: true }, /* @__PURE__ */ React.createElement(Text, { mb: 12 }, /* @__PURE__ */ React.createElement(Text, { fontWeight: "bold" }, session.coachOfferingCategoryName), " ", "coaching session with", " ", /* @__PURE__ */ React.createElement(Text, { fontWeight: "bold" }, session.participantName)), /* @__PURE__ */ React.createElement(FlexBox, {
+	alignItems: "center",
+	gap: 16,
+	mb: 24
+}, /* @__PURE__ */ React.createElement(FlexBox, {
+	alignItems: "center",
+	gap: 8
+}, /* @__PURE__ */ React.createElement(CalendarIcon, { size: 16 }), /* @__PURE__ */ React.createElement(Text, {
+	variant: "p-small",
+	color: "text-secondary"
+}, new Date(session.startTime).toLocaleDateString(void 0, {
+	weekday: "long",
+	month: "long",
+	day: "numeric",
+	year: "numeric"
+}))), /* @__PURE__ */ React.createElement(FlexBox, {
+	alignItems: "center",
+	gap: 8
+}, /* @__PURE__ */ React.createElement(ClockIcon, { size: 16 }), /* @__PURE__ */ React.createElement(Text, {
+	variant: "p-small",
+	color: "text-secondary"
+}, `${formatTime(session.startTime, "h:mm aa")} - ${formatTime(session.endTime, "h:mm aa z")}`)), session.status && /* @__PURE__ */ React.createElement(Text, {
+	variant: "p-small",
+	fontWeight: "bold"
+}, "Status: ", session.status)), /* @__PURE__ */ React.createElement(FlexBox, {
+	alignItems: "center",
+	gap: 8
+}, ctas?.map((cta) => {
+	const Button = cta.buttonType === "fill" ? FillButton : cta.buttonType === "stroke" ? StrokeButton : TextButton;
+	return /* @__PURE__ */ React.createElement(Button, {
+		href: cta.href,
+		key: cta.text,
+		onClick: cta.onClick,
+		disabled: cta.disabled,
+		variant: cta.variant
+	}, cta.text);
+}))));
+
+//#endregion
+export { CoachingSessionCard };
+//# sourceMappingURL=index.js.map

package/dist/CoachingSessionCard/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":["Card","FillButton","FlexBox","StrokeButton","Text","TextButton","CalendarIcon","ClockIcon","formatInTimeZone","formatTime","timeString","format","Date","Intl","DateTimeFormat","resolvedOptions","timeZone","CoachingSessionCard","session","ctas","borderRadius","p","height","column","mb","fontWeight","coachOfferingCategoryName","participantName","alignItems","gap","size","variant","color","startTime","toLocaleDateString","undefined","weekday","month","day","year","endTime","status","map","cta","Button","buttonType","href","key","text","onClick","disabled"],"sources":["../../src/CoachingSessionCard/index.tsx"],"sourcesContent":["import {\n  Card,\n  FillButton,\n  FlexBox,\n  StrokeButton,\n  Text,\n  TextButton,\n} from '@codecademy/gamut';\nimport { CalendarIcon, ClockIcon } from '@codecademy/gamut-icons';\nimport { formatInTimeZone } from 'date-fns-tz';\n\nconst formatTime = (timeString: string, format: string) => {\n  return formatInTimeZone(\n    new Date(timeString),\n    Intl.DateTimeFormat().resolvedOptions().timeZone,\n    format\n  );\n};\n\nexport interface CoachingSessionCardProps {\n  session: {\n    id: string;\n    startTime: string;\n    endTime: string;\n    coachOfferingCategoryName: string;\n    participantName?: string | null;\n    zoomJoinUrl?: string | null;\n    rescheduleUrl?: string | null;\n    status?: string | null;\n  };\n  ctas?: {\n    text: string;\n    href?: string;\n    onClick?: () => void;\n    buttonType?: 'fill' | 'stroke' | 'text';\n    disabled?: boolean;\n    variant?: 'primary' | 'secondary' | 'danger';\n  }[];\n}\n\nexport const CoachingSessionCard: React.FC<CoachingSessionCardProps> = ({\n  session,\n  ctas,\n}) => (\n  <Card borderRadius=\"xl\" p={32} height=\"auto\">\n    <FlexBox column>\n      <Text mb={12}>\n        <Text fontWeight=\"bold\">{session.coachOfferingCategoryName}</Text>{' '}\n        coaching session with{' '}\n        <Text fontWeight=\"bold\">{session.participantName}</Text>\n      </Text>\n      <FlexBox alignItems=\"center\" gap={16} mb={24}>\n        <FlexBox alignItems=\"center\" gap={8}>\n          <CalendarIcon size={16} />\n          <Text variant=\"p-small\" color=\"text-secondary\">\n            {new Date(session.startTime).toLocaleDateString(undefined, {\n              weekday: 'long',\n              month: 'long',\n              day: 'numeric',\n              year: 'numeric',\n            })}\n          </Text>\n        </FlexBox>\n        <FlexBox alignItems=\"center\" gap={8}>\n          <ClockIcon size={16} />\n          <Text variant=\"p-small\" color=\"text-secondary\">\n            {`${formatTime(session.startTime, 'h:mm aa')} - ${formatTime(\n              session.endTime,\n              'h:mm aa z'\n            )}`}\n          </Text>\n        </FlexBox>\n        {session.status && (\n          <Text variant=\"p-small\" fontWeight=\"bold\">\n            Status: {session.status}\n          </Text>\n        )}\n      </FlexBox>\n      <FlexBox alignItems=\"center\" gap={8}>\n        {ctas?.map((cta) => {\n          const Button =\n            cta.buttonType === 'fill'\n              ? FillButton\n              : cta.buttonType === 'stroke'\n              ? StrokeButton\n              : TextButton;\n          return (\n            <Button\n              href={cta.href}\n              key={cta.text}\n              onClick={cta.onClick}\n              disabled={cta.disabled}\n              variant={cta.variant}\n            >\n              {cta.text}\n            </Button>\n          );\n        })}\n      </FlexBox>\n    </FlexBox>\n  </Card>\n);\n"],"mappings":";;;;;AAWA,MAAMS,cAAcC,YAAoBC,WAAAA;AACtC,QAAOH,iBACL,IAAII,KAAKF,WAAAA,EACTG,KAAKC,gBAAc,CAAGC,iBAAe,CAAGC,UACxCL,OAAAA;;AAyBJ,MAAaM,uBAA2D,EACtEC,SACAC,WAEA,sBAAA,cAACnB,MAAAA;CAAKoB,cAAa;CAAKC,GAAG;CAAIC,QAAO;GACpC,sBAAA,cAACpB,SAAAA,EAAQqB,QAAAA,QACP,sBAAA,cAACnB,MAAAA,EAAKoB,IAAI,MACR,sBAAA,cAACpB,MAAAA,EAAKqB,YAAW,UAAQP,QAAQQ,0BAAyB,EAAS,KAAI,yBACjD,KACtB,sBAAA,cAACtB,MAAAA,EAAKqB,YAAW,UAAQP,QAAQS,gBAAe,CAAA,EAElD,sBAAA,cAACzB,SAAAA;CAAQ0B,YAAW;CAASC,KAAK;CAAIL,IAAI;GACxC,sBAAA,cAACtB,SAAAA;CAAQ0B,YAAW;CAASC,KAAK;GAChC,sBAAA,cAACvB,cAAAA,EAAawB,MAAM,OACpB,sBAAA,cAAC1B,MAAAA;CAAK2B,SAAQ;CAAUC,OAAM;GAC3B,IAAIpB,KAAKM,QAAQe,UAAS,CAAEC,mBAAmBC,QAAW;CACzDC,SAAS;CACTC,OAAO;CACPC,KAAK;CACLC,MAAM;CACR,CAAA,CAAA,CAAA,EAGJ,sBAAA,cAACrC,SAAAA;CAAQ0B,YAAW;CAASC,KAAK;GAChC,sBAAA,cAACtB,WAAAA,EAAUuB,MAAM,OACjB,sBAAA,cAAC1B,MAAAA;CAAK2B,SAAQ;CAAUC,OAAM;GAC3B,GAAGvB,WAAWS,QAAQe,WAAW,UAAA,CAAW,KAAKxB,WAChDS,QAAQsB,SACR,YAAA,GACC,CAAA,EAGNtB,QAAQuB,UACP,sBAAA,cAACrC,MAAAA;CAAK2B,SAAQ;CAAUN,YAAW;GAAO,YAC/BP,QAAQuB,OAAM,CAAA,EAI7B,sBAAA,cAACvC,SAAAA;CAAQ0B,YAAW;CAASC,KAAK;GAC/BV,MAAMuB,KAAKC,QAAAA;CACV,MAAMC,SACJD,IAAIE,eAAe,SACf5C,aACA0C,IAAIE,eAAe,WACnB1C,eACAE;AACN,QACE,sBAAA,cAACuC,QAAAA;EACCE,MAAMH,IAAIG;EACVC,KAAKJ,IAAIK;EACTC,SAASN,IAAIM;EACbC,UAAUP,IAAIO;EACdnB,SAASY,IAAIZ;IAEZY,IAAIK,KAAI;EAGf,CAAA,CAAA,CAAA"}

package/dist/CommunityEventCard/EventTypeIcon.cjs

@@ -0,0 +1,60 @@
+const require_runtime = require('../_virtual/_rolldown/runtime.cjs');
+let _codecademy_gamut = require("@codecademy/gamut");
+let _codecademy_gamut_icons = require("@codecademy/gamut-icons");
+
+//#region src/CommunityEventCard/EventTypeIcon.tsx
+const eventTypeMap = {
+	careergrowth: {
+		icon: _codecademy_gamut_icons.BriefcaseIcon,
+		copy: "Career growth"
+	},
+	hackathon: {
+		icon: _codecademy_gamut_icons.KeyboardIcon,
+		copy: "Hackathon"
+	},
+	networking: {
+		icon: _codecademy_gamut_icons.PersonPonytailIcon,
+		copy: "Networking"
+	},
+	"q&a": {
+		icon: _codecademy_gamut_icons.QuestionMarkIcon,
+		copy: "Q&A"
+	},
+	studysession: {
+		icon: _codecademy_gamut_icons.BookFlipPageIcon,
+		copy: "Study session"
+	},
+	webinar: {
+		icon: _codecademy_gamut_icons.MicrophoneIcon,
+		copy: "Webinar"
+	},
+	workshop: {
+		icon: _codecademy_gamut_icons.RulerTriangleIcon,
+		copy: "Workshop"
+	},
+	youtube: {
+		icon: _codecademy_gamut_icons.YoutubePlayIcon,
+		copy: "YouTube"
+	}
+};
+const EventTypeIcon = ({ eventType }) => {
+	const key = eventType?.toLowerCase().replace(/\s/, "");
+	const IconComponent = key ? eventTypeMap[key]?.icon : void 0;
+	const iconLoaded = key && IconComponent;
+	return /* @__PURE__ */ React.createElement(_codecademy_gamut.FlexBox, {
+		display: "flex",
+		alignItems: "center",
+		fontFamily: "accent",
+		fontSize: 14,
+		"aria-label": key && `${key} event`,
+		"aria-hidden": !iconLoaded
+	}, iconLoaded && /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(IconComponent, {
+		"aria-hidden": true,
+		alignSelf: "center",
+		mr: 8
+	}), eventTypeMap[key]?.copy));
+};
+
+//#endregion
+exports.EventTypeIcon = EventTypeIcon;
+//# sourceMappingURL=EventTypeIcon.cjs.map