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

package/dist/PageSection/index.cjs

@@ -1,65 +0,0 @@
-const require_rolldown_runtime = require('../_virtual/rolldown_runtime.cjs');
-let _codecademy_gamut = require("@codecademy/gamut");
-let react = require("react");
-react = require_rolldown_runtime.__toESM(react);
-let react_jsx_runtime = require("react/jsx-runtime");
-
-//#region src/PageSection/index.tsx
-function isSectionButtonATextButton(button) {
-	return button.text !== void 0;
-}
-const PageSection = ({ title, headerButton, headerSecondaryButton, footerButton, children }) => {
-	const renderSectionButton = (sectionButton) => {
-		if (!isSectionButtonATextButton(sectionButton)) return sectionButton;
-		const { text, ...buttonProps } = sectionButton;
-		return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_codecademy_gamut.TextButton, {
-			...buttonProps,
-			children: text
-		});
-	};
-	const maybeRenderHeaderButton = () => {
-		if (!headerButton) return null;
-		return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_codecademy_gamut.Box, {
-			ml: 4,
-			display: "inline",
-			children: renderSectionButton(headerButton)
-		});
-	};
-	const maybeRenderHeaderSecondaryButton = () => {
-		if (!headerSecondaryButton) return null;
-		return renderSectionButton(headerSecondaryButton);
-	};
-	const renderSectionHeader = () => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(_codecademy_gamut.FlexBox, {
-		height: "2.5rem",
-		mb: 8,
-		justifyContent: "space-between",
-		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)(_codecademy_gamut.FlexBox, {
-			alignItems: "center",
-			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_codecademy_gamut.Text, {
-				as: "h2",
-				fontSize: 22,
-				children: title
-			}), maybeRenderHeaderButton()]
-		}), maybeRenderHeaderSecondaryButton()]
-	});
-	const maybeRenderSectionFooter = () => {
-		if (!footerButton) return null;
-		return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_codecademy_gamut.FlexBox, {
-			justifyContent: "flex-end",
-			mt: 16,
-			children: renderSectionButton(footerButton)
-		});
-	};
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(_codecademy_gamut.FlexBox, {
-		flexDirection: "column",
-		mb: 48,
-		children: [
-			renderSectionHeader(),
-			children,
-			maybeRenderSectionFooter()
-		]
-	});
-};
-
-//#endregion
-exports.PageSection = PageSection;

package/dist/PageSection/index.d.cts

@@ -1,20 +0,0 @@
-import { WithChildrenProp } from "@codecademy/gamut";
-import * as React$1 from "react";
-import { AriaAttributes, ReactNode } from "react";
-
-//#region src/PageSection/index.d.ts
-type TextButtonMinimumProps = AriaAttributes & {
-  text: string;
-  href?: string;
-  onClick?: () => void;
-};
-type SectionButton = TextButtonMinimumProps | ReactNode;
-interface PageSectionProps extends WithChildrenProp {
-  title: string;
-  headerButton?: SectionButton;
-  headerSecondaryButton?: SectionButton;
-  footerButton?: SectionButton;
-}
-declare const PageSection: React$1.FC<PageSectionProps>;
-//#endregion
-export { PageSection, PageSectionProps, SectionButton };

package/dist/PastDue/PastDueModalContents/index.cjs

@@ -1,28 +0,0 @@
-const require_rolldown_runtime = require('../../_virtual/rolldown_runtime.cjs');
-const require_pastDueMessages = require('../pastDueMessages.cjs');
-let _codecademy_gamut = require("@codecademy/gamut");
-let react = require("react");
-react = require_rolldown_runtime.__toESM(react);
-let react_jsx_runtime = require("react/jsx-runtime");
-
-//#region src/PastDue/PastDueModalContents/index.tsx
-const PastDueModalContents = ({ pastDueErrorCode, isSilverPlan, closeButton, updatePaymentButton }) => {
-	const pastDueErrorMessage = require_pastDueMessages.pastDueErrorMessages(isSilverPlan, false)[pastDueErrorCode] || require_pastDueMessages.pastDueErrorMessages(isSilverPlan, false).default;
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_codecademy_gamut.FlexBox, {
-		column: true,
-		children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(_codecademy_gamut.Box, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_codecademy_gamut.Text, {
-			mb: 12,
-			children: pastDueErrorMessage.text1
-		}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_codecademy_gamut.Text, {
-			mb: 12,
-			children: pastDueErrorMessage.text2
-		})] })
-	}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(_codecademy_gamut.FlexBox, {
-		justifyContent: "end",
-		alignItems: "end",
-		children: [closeButton, updatePaymentButton]
-	})] });
-};
-
-//#endregion
-exports.PastDueModalContents = PastDueModalContents;

package/dist/PastDue/PastDueModalContents/index.d.cts

@@ -1,12 +0,0 @@
-import React from "react";
-
-//#region src/PastDue/PastDueModalContents/index.d.ts
-interface PastDueModalProps {
-  pastDueErrorCode: string;
-  isSilverPlan: boolean;
-  closeButton: React.ReactNode;
-  updatePaymentButton: React.ReactNode;
-}
-declare const PastDueModalContents: React.FC<React.PropsWithChildren<PastDueModalProps>>;
-//#endregion
-export { PastDueModalContents, PastDueModalProps };

package/dist/PastDue/index.cjs

@@ -1,5 +0,0 @@
-const require_pastDueMessages = require('./pastDueMessages.cjs');
-const require_index = require('./PastDueModalContents/index.cjs');
-
-exports.PastDueModalContents = require_index.PastDueModalContents;
-exports.pastDueErrorMessages = require_pastDueMessages.pastDueErrorMessages;

package/dist/PastDue/index.d.cts

@@ -1,3 +0,0 @@
-import { PastDueModalContents, PastDueModalProps } from "./PastDueModalContents/index.cjs";
-import { pastDueErrorMessages } from "./pastDueMessages.cjs";
-export { PastDueModalContents, PastDueModalProps, pastDueErrorMessages };

package/dist/PastDue/pastDueMessages.cjs

@@ -1,55 +0,0 @@
-const require_rolldown_runtime = require('../_virtual/rolldown_runtime.cjs');
-let _codecademy_gamut = require("@codecademy/gamut");
-let _emotion_styled = require("@emotion/styled");
-_emotion_styled = require_rolldown_runtime.__toESM(_emotion_styled);
-let react_jsx_runtime = require("react/jsx-runtime");
-
-//#region src/PastDue/pastDueMessages.tsx
-const StyledAnchor = (0, _emotion_styled.default)(_codecademy_gamut.Anchor)`
-  ${({ theme, isAlert }) => isAlert ? `color: ${theme.colors.white}` : ""};
-`;
-const pastDueErrorMessages = (isSilverPlan, isAlert) => ({
-	insufficient_funds: {
-		text1: `Your payment did not go through due to insufficient funds.`,
-		text2: `To keep learning with Codecademy ${isSilverPlan ? "Plus" : "Pro"}, please update your payment method.`
-	},
-	declined: {
-		text1: `Your payment did not go through. Contact your bank or card issuer to find out more.`,
-		text2: `To keep learning with Codecademy ${isSilverPlan ? "Plus" : "Pro"}, please update your payment method.`
-	},
-	temporary_hold: {
-		text1: `Your payment method was placed on a temporary hold. Contact your bank or card issuer to find out more.`,
-		text2: `To keep learning with Codecademy ${isSilverPlan ? "Plus" : "Pro"}, please update your payment method.`
-	},
-	invalid_transaction: {
-		text1: `Your payment did not go through. Contact your bank or card issuer to find out more about possible transaction restrictions.`,
-		text2: `To keep learning with Codecademy ${isSilverPlan ? "Plus" : "Pro"}, please update your payment method.`
-	},
-	invalid_account_number: {
-		text1: `Your payment did not go through because your card details may be incorrect.`,
-		text2: `To keep learning with Codecademy ${isSilverPlan ? "Plus" : "Pro"}, please update your card details or payment method.`
-	},
-	expired_card: {
-		text1: `Your payment did not go through because your card is expired.`,
-		text2: `To keep learning with Codecademy ${isSilverPlan ? "Plus" : "Pro"}, please update your payment method.`
-	},
-	default: {
-		text1: `Your payment did not go through. To keep learning with Codecademy ${isSilverPlan ? "Plus" : "Pro"}, please update your payment method.`,
-		text2: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [
-			"Let our",
-			" ",
-			/* @__PURE__ */ (0, react_jsx_runtime.jsx)(StyledAnchor, {
-				href: "https://help.codecademy.com/hc/en-us",
-				target: "_blank",
-				rel: "noreferrer",
-				isAlert,
-				children: "customer support"
-			}),
-			" ",
-			"team know if you have further questions."
-		] })
-	}
-});
-
-//#endregion
-exports.pastDueErrorMessages = pastDueErrorMessages;

package/dist/PastDue/pastDueMessages.d.cts

@@ -1,8 +0,0 @@
-//#region src/PastDue/pastDueMessages.d.ts
-interface PastDueErrorMessage {
-  text1: string;
-  text2: string | JSX.Element;
-}
-declare const pastDueErrorMessages: (isSilverPlan: boolean, isAlert: boolean) => Record<string, PastDueErrorMessage>;
-//#endregion
-export { pastDueErrorMessages };

package/dist/PausableImage/BaseImage/index.cjs

@@ -1,77 +0,0 @@
-const require_rolldown_runtime = require('../../_virtual/rolldown_runtime.cjs');
-const require_PausableImage_index = require('../index.cjs');
-let _codecademy_gamut = require("@codecademy/gamut");
-let _emotion_styled = require("@emotion/styled");
-_emotion_styled = require_rolldown_runtime.__toESM(_emotion_styled);
-let react = require("react");
-react = require_rolldown_runtime.__toESM(react);
-let react_jsx_runtime = require("react/jsx-runtime");
-let _codecademy_gamut_icons = require("@codecademy/gamut-icons");
-let react_freezeframe = require("react-freezeframe");
-react_freezeframe = require_rolldown_runtime.__toESM(react_freezeframe);
-
-//#region src/PausableImage/BaseImage/index.tsx
-const Container = _emotion_styled.default.div`
-  align-items: center;
-  justify-content: center;
-  height: 100%;
-  display: flex;
-  position: relative;
-  width: 100%;
-
-  > img,
-  > .react-freezeframe,
-  > .react-freezeframe img {
-    max-width: 100%;
-  }
-  .ff-container .ff-canvas {
-    transition: none;
-  }
-  .ff-loading-icon::before {
-    display: none;
-  }
-`;
-const PlayingImage = require_PausableImage_index.imageStyles;
-const StyledFreezeframe = (0, _emotion_styled.default)(react_freezeframe.default)(require_PausableImage_index.imageStyles);
-const BaseImage = ({ alt, ...rest }) => {
-	const [paused, setPaused] = (0, react.useState)(false);
-	const [liveText, buttonLabel, Icon, Image] = paused ? [
-		`${alt}, paused`,
-		"Play animated image",
-		_codecademy_gamut_icons.PlayIcon,
-		StyledFreezeframe
-	] : [
-		`${alt}, playing`,
-		"Pause animated image",
-		_codecademy_gamut_icons.PauseIcon,
-		PlayingImage
-	];
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(Container, { children: [
-		/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Image, {
-			alt,
-			...rest
-		}),
-		/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_codecademy_gamut.HiddenText, {
-			"aria-live": "polite",
-			children: alt ? liveText : buttonLabel
-		}),
-		/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_codecademy_gamut.FillButton, {
-			bottom: 0,
-			m: 8,
-			onClick: () => setPaused(!paused),
-			position: "absolute",
-			right: 0,
-			variant: "secondary",
-			zIndex: 1,
-			"aria-label": buttonLabel,
-			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Icon, { color: "currentColor" })
-		})
-	] });
-};
-var BaseImage_default = BaseImage;
-
-//#endregion
-exports.BaseImage = BaseImage;
-exports.Container = Container;
-exports.PlayingImage = PlayingImage;
-exports.default = BaseImage_default;

package/dist/PausableImage/index.cjs

@@ -1,32 +0,0 @@
-const require_rolldown_runtime = require('../_virtual/rolldown_runtime.cjs');
-let _emotion_styled = require("@emotion/styled");
-_emotion_styled = require_rolldown_runtime.__toESM(_emotion_styled);
-let react = require("react");
-react = require_rolldown_runtime.__toESM(react);
-let react_jsx_runtime = require("react/jsx-runtime");
-let _emotion_react = require("@emotion/react");
-
-//#region src/PausableImage/index.tsx
-const BaseImage = react.lazy(() => Promise.resolve().then(() => require("./BaseImage/index.cjs")));
-const imageStyles = _emotion_styled.default.img((0, _emotion_react.css)({
-	height: "auto",
-	maxHeight: "100%",
-	maxWidth: "100%",
-	"&[src$=\".svg\"]": { width: "100%" }
-}));
-const StaticImage = imageStyles;
-const PausableImage = (props) => {
-	const staticImage = /* @__PURE__ */ (0, react_jsx_runtime.jsx)(StaticImage, { ...props });
-	const [isMounted, setIsMounted] = react.useState(false);
-	react.useEffect(() => {
-		setIsMounted(true);
-	}, []);
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_jsx_runtime.Fragment, { children: isMounted && props.src?.endsWith(".gif") ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react.Suspense, {
-		fallback: staticImage,
-		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(BaseImage, { ...props })
-	}) : staticImage });
-};
-
-//#endregion
-exports.PausableImage = PausableImage;
-exports.imageStyles = imageStyles;

package/dist/PausableImage/index.d.cts

@@ -1,16 +0,0 @@
-import * as React$1 from "react";
-import * as _emotion_react4 from "@emotion/react";
-import * as _emotion_styled0 from "@emotion/styled";
-
-//#region src/PausableImage/index.d.ts
-interface PauseableImageProps {
-  src: string;
-  alt: string;
-}
-declare const imageStyles: _emotion_styled0.StyledComponent<{
-  theme?: _emotion_react4.Theme;
-  as?: React$1.ElementType;
-}, React$1.DetailedHTMLProps<React$1.ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>, {}>;
-declare const PausableImage: React$1.FC<PauseableImageProps>;
-//#endregion
-export { PausableImage, imageStyles };

package/dist/PlanCard/PlanCardBanner.cjs

@@ -1,30 +0,0 @@
-const require_rolldown_runtime = require('../_virtual/rolldown_runtime.cjs');
-let _codecademy_gamut = require("@codecademy/gamut");
-let _codecademy_gamut_styles = require("@codecademy/gamut-styles");
-let _emotion_styled = require("@emotion/styled");
-_emotion_styled = require_rolldown_runtime.__toESM(_emotion_styled);
-let react = require("react");
-react = require_rolldown_runtime.__toESM(react);
-let react_jsx_runtime = require("react/jsx-runtime");
-
-//#region src/PlanCard/PlanCardBanner.tsx
-const BackgroundFlex = (0, _emotion_styled.default)(_codecademy_gamut_styles.Background)((0, _codecademy_gamut_styles.css)({
-	display: "flex",
-	p: 8,
-	justifyContent: "center",
-	alignItems: "center"
-}));
-const PlanCardBanner = ({ text, icon }) => {
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(BackgroundFlex, {
-		bg: "navy",
-		children: [icon && icon, /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_codecademy_gamut.Text, {
-			fontFamily: "accent",
-			fontSize: 14,
-			ml: 8,
-			children: text
-		})]
-	});
-};
-
-//#endregion
-exports.PlanCardBanner = PlanCardBanner;

package/dist/PlanCard/PlanCardBanner.d.cts

@@ -1,10 +0,0 @@
-import React from "react";
-
-//#region src/PlanCard/PlanCardBanner.d.ts
-interface PlanCardBannerProps {
-  text: string;
-  icon?: React.ReactNode;
-}
-declare const PlanCardBanner: React.FC<PlanCardBannerProps>;
-//#endregion
-export { PlanCardBanner };

package/dist/PlanCard/PlanFeature.cjs

@@ -1,91 +0,0 @@
-const require_rolldown_runtime = require('../_virtual/rolldown_runtime.cjs');
-let _codecademy_gamut = require("@codecademy/gamut");
-let _codecademy_gamut_styles = require("@codecademy/gamut-styles");
-let _emotion_styled = require("@emotion/styled");
-_emotion_styled = require_rolldown_runtime.__toESM(_emotion_styled);
-let react = require("react");
-react = require_rolldown_runtime.__toESM(react);
-let react_jsx_runtime = require("react/jsx-runtime");
-let _codecademy_gamut_icons = require("@codecademy/gamut-icons");
-
-//#region src/PlanCard/PlanFeature.tsx
-const ListItem = (0, _emotion_styled.default)(_codecademy_gamut.FlexBox)((0, _codecademy_gamut_styles.css)({ listStyleType: "none" })).withComponent("li");
-const PlanFeature = ({ feature, available, isNew, isHighlighted, isMultiple }) => {
-	const Icon = isHighlighted ? _codecademy_gamut_icons.StarFilledIcon : available ? _codecademy_gamut_icons.MiniCheckCircleIcon : _codecademy_gamut_icons.CloseCircleIcon;
-	if (isHighlighted) return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(_codecademy_gamut.Badge, {
-		size: "sm",
-		variant: "accent",
-		py: 12,
-		mb: 4,
-		ml: "-4px",
-		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Icon, {
-			size: 14,
-			mr: 8,
-			flexShrink: 0,
-			"aria-hidden": true
-		}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(_codecademy_gamut.Text, {
-			fontSize: "small",
-			children: [feature, /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_codecademy_gamut.Text, {
-				screenreader: true,
-				children: " included."
-			})]
-		})]
-	});
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(_codecademy_gamut.FlexBox, {
-		as: ListItem,
-		alignItems: isMultiple ? "center" : {
-			_: "center",
-			xs: "flex-start"
-		},
-		mr: isMultiple ? "unset" : {
-			_: "unset",
-			xs: 24,
-			sm: 8
-		},
-		width: isMultiple ? "unset" : {
-			_: "unset",
-			xs: "50%"
-		},
-		"data-testid": "plan-feature",
-		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Icon, {
-			mr: 8,
-			mt: isMultiple ? 0 : { xs: 4 },
-			flexShrink: 0,
-			color: available ? "feedback-success" : "gray-600",
-			"aria-hidden": true
-		}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(_codecademy_gamut.FlexBox, {
-			flexWrap: {
-				_: "nowrap",
-				md: "wrap",
-				lg: "nowrap"
-			},
-			alignItems: "baseline",
-			children: [available ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_jsx_runtime.Fragment, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(_codecademy_gamut.Text, {
-				width: "100%",
-				children: [feature, /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_codecademy_gamut.Text, {
-					screenreader: true,
-					children: " included."
-				})]
-			}) }) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_jsx_runtime.Fragment, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(_codecademy_gamut.Text, {
-				textDecoration: "line-through",
-				color: "text-disabled",
-				children: [feature, /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_codecademy_gamut.Text, {
-					screenreader: true,
-					children: " not included."
-				})]
-			}) }), isNew && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_codecademy_gamut.Badge, {
-				size: "sm",
-				variant: "accent",
-				ml: {
-					_: 4,
-					md: 0,
-					lg: 4
-				},
-				children: "New"
-			})]
-		})]
-	}, feature);
-};
-
-//#endregion
-exports.PlanFeature = PlanFeature;

package/dist/PlanCard/PopularBadge.cjs

@@ -1,20 +0,0 @@
-const require_rolldown_runtime = require('../_virtual/rolldown_runtime.cjs');
-let _codecademy_gamut = require("@codecademy/gamut");
-let react = require("react");
-react = require_rolldown_runtime.__toESM(react);
-let react_jsx_runtime = require("react/jsx-runtime");
-
-//#region src/PlanCard/PopularBadge.tsx
-const PopularBadge = (props) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_codecademy_gamut.FlexBox, {
-	position: "absolute",
-	top: -10,
-	...props,
-	children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_codecademy_gamut.Badge, {
-		variant: "accent",
-		size: "sm",
-		children: "Most popular"
-	})
-});
-
-//#endregion
-exports.PopularBadge = PopularBadge;

package/dist/PlanCard/PricingAmount.cjs

@@ -1,122 +0,0 @@
-const require_rolldown_runtime = require('../_virtual/rolldown_runtime.cjs');
-const require_types = require('./types.cjs');
-let _codecademy_gamut = require("@codecademy/gamut");
-let _codecademy_gamut_styles = require("@codecademy/gamut-styles");
-let _emotion_styled = require("@emotion/styled");
-_emotion_styled = require_rolldown_runtime.__toESM(_emotion_styled);
-let react = require("react");
-react = require_rolldown_runtime.__toESM(react);
-let react_jsx_runtime = require("react/jsx-runtime");
-
-//#region src/PlanCard/PricingAmount.tsx
-const Amount = (0, _emotion_styled.default)(_codecademy_gamut.Text)`
-  font-weight: bold;
-  color: ${_codecademy_gamut_styles.theme.colors.text};
-  font-size: ${({ isMultiple }) => isMultiple ? "44px" : "64px"};
-  line-height: ${({ isMultiple }) => isMultiple ? "64px" : "80px"};
-  ${_codecademy_gamut_styles.theme.breakpoints.xl} {
-    font-size: 64px;
-    line-height: 80px;
-  }
-`;
-const PricingAmount = ({ currency, monthlyPrice, product, price, termMonths, compact = false, isMultiple, inUpsellModal = false }) => {
-	const cycle = termMonths === 1 ? "monthly" : "annually";
-	const [dollars, cents] = price.split(".");
-	let ariaLabel = `${require_types.getCurrencyPrefix(currency)}${require_types.getCurrencySymbol(currency)}${dollars}${cents ? `.${cents}` : ""}`;
-	if (product !== "basic") {
-		ariaLabel += ` a month, billed ${cycle}`;
-		if (inUpsellModal) ariaLabel += ", monthly pricing also available";
-		if (monthlyPrice) ariaLabel += ` or ${require_types.getCurrencyPrefix(currency)}${require_types.getCurrencySymbol(currency)}${monthlyPrice} billed monthly`;
-	}
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_jsx_runtime.Fragment, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(_codecademy_gamut.FlexBox, {
-		"data-testid": "pricing-amount",
-		lineHeight: "title",
-		mb: compact ? 0 : 8,
-		column: true,
-		alignItems: "center",
-		children: [
-			/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_codecademy_gamut.Text, {
-				screenreader: true,
-				"data-testid": "pricing-amount-label",
-				children: ariaLabel
-			}),
-			/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_codecademy_gamut.FlexBox, {
-				"aria-hidden": true,
-				row: true,
-				alignItems: "center",
-				height: isMultiple ? {
-					_: 50,
-					xl: "unset"
-				} : "unset",
-				children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(_codecademy_gamut.FlexBox, {
-					mr: 4,
-					alignItems: "start",
-					children: [
-						/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_codecademy_gamut.Text, {
-							color: "text",
-							mt: {
-								_: 12,
-								xl: 16
-							},
-							fontWeight: "bold",
-							fontSize: 34,
-							children: `${require_types.getCurrencyPrefix(currency)}${require_types.getCurrencySymbol(currency)}`
-						}),
-						/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Amount, {
-							isMultiple,
-							children: `${dollars}`
-						}),
-						product === "basic" ? null : /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(_codecademy_gamut.FlexBox, {
-							column: true,
-							alignItems: "flex-end",
-							ml: 4,
-							children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_codecademy_gamut.Text, {
-								color: "text",
-								fontWeight: "bold",
-								fontSize: 22,
-								mt: {
-									_: 12,
-									xl: 16
-								},
-								children: cents ? `.${cents}` : /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", { children: "\xA0" })
-							}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_codecademy_gamut.Text, {
-								mt: {
-									_: 0,
-									xl: 4
-								},
-								color: "text-secondary",
-								children: "/mo"
-							})]
-						})
-					]
-				})
-			}),
-			/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_codecademy_gamut.Text, {
-				color: "text-secondary",
-				center: true,
-				mt: compact ? 0 : {
-					_: 8,
-					xl: 0
-				},
-				children: product === "basic" ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_codecademy_gamut.Text, {
-					mb: 24,
-					children: "Always free"
-				}) : /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [
-					/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_codecademy_gamut.Text, {
-						mb: compact ? 0 : 8,
-						"aria-hidden": true,
-						children: `Billed ${cycle}${inUpsellModal ? "*" : ""}`
-					}),
-					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("br", {}),
-					monthlyPrice && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_codecademy_gamut.Text, {
-						"aria-hidden": true,
-						children: `or ${require_types.getCurrencyPrefix(currency)}${require_types.getCurrencySymbol(currency)}${monthlyPrice} billed monthly`
-					})
-				] })
-			})
-		]
-	}) });
-};
-
-//#endregion
-exports.PricingAmount = PricingAmount;

package/dist/PlanCard/RecommendedBadge.cjs

@@ -1,31 +0,0 @@
-const require_rolldown_runtime = require('../_virtual/rolldown_runtime.cjs');
-let _codecademy_gamut = require("@codecademy/gamut");
-let react = require("react");
-react = require_rolldown_runtime.__toESM(react);
-let react_jsx_runtime = require("react/jsx-runtime");
-let _codecademy_gamut_icons = require("@codecademy/gamut-icons");
-
-//#region src/PlanCard/RecommendedBadge.tsx
-const RecommendedBadge = (props) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(_codecademy_gamut.FlexBox, {
-	position: "absolute",
-	top: -28,
-	bg: "navy",
-	color: "white",
-	p: 8,
-	borderRadiusTop: "sm",
-	borderRadiusBottom: "none",
-	center: true,
-	...props,
-	children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_codecademy_gamut_icons.MiniStarIcon, {
-		mr: 8,
-		size: 12
-	}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_codecademy_gamut.Text, {
-		fontFamily: "accent",
-		lineHeight: 0,
-		fontSize: 14,
-		children: "Recommended"
-	})]
-});
-
-//#endregion
-exports.RecommendedBadge = RecommendedBadge;