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

package/dist/PlanCard/PricingAmount.js

@@ -1,117 +1,82 @@
-import _styled from "@emotion/styled/base";
-import { FlexBox, Text } from '@codecademy/gamut';
-import { theme } from '@codecademy/gamut-styles';
-import React from 'react';
-import { getCurrencyPrefix, getCurrencySymbol } from './types';
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-const Amount = /*#__PURE__*/_styled(Text, {
-  target: "elw3jo70",
-  label: "Amount"
-})("font-weight:bold;color:", theme.colors.text, ";font-size:", ({
-  isMultiple
-}) => isMultiple ? '44px' : '64px', ";line-height:", ({
-  isMultiple
-}) => isMultiple ? '64px' : '80px', ";", theme.breakpoints.xl, "{font-size:64px;line-height:80px;}" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uL3NyYy9QbGFuQ2FyZC9QcmljaW5nQW1vdW50LnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFZb0QiLCJmaWxlIjoiLi4vLi4vc3JjL1BsYW5DYXJkL1ByaWNpbmdBbW91bnQudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgRmxleEJveCwgVGV4dCB9IGZyb20gJ0Bjb2RlY2FkZW15L2dhbXV0JztcbmltcG9ydCB7IHRoZW1lIH0gZnJvbSAnQGNvZGVjYWRlbXkvZ2FtdXQtc3R5bGVzJztcbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJztcbmltcG9ydCBSZWFjdCBmcm9tICdyZWFjdCc7XG5cbmltcG9ydCB7XG4gIEN1cnJlbmN5LFxuICBnZXRDdXJyZW5jeVByZWZpeCxcbiAgZ2V0Q3VycmVuY3lTeW1ib2wsXG4gIFBsYW5UeXBlLFxufSBmcm9tICcuL3R5cGVzJztcblxuY29uc3QgQW1vdW50ID0gc3R5bGVkKFRleHQpPHsgaXNNdWx0aXBsZTogYm9vbGVhbiB9PmBcbiAgZm9udC13ZWlnaHQ6IGJvbGQ7XG4gIGNvbG9yOiAke3RoZW1lLmNvbG9ycy50ZXh0fTtcbiAgZm9udC1zaXplOiAkeyh7IGlzTXVsdGlwbGUgfSkgPT4gKGlzTXVsdGlwbGUgPyAnNDRweCcgOiAnNjRweCcpfTtcbiAgbGluZS1oZWlnaHQ6ICR7KHsgaXNNdWx0aXBsZSB9KSA9PiAoaXNNdWx0aXBsZSA/ICc2NHB4JyA6ICc4MHB4Jyl9O1xuICAke3RoZW1lLmJyZWFrcG9pbnRzLnhsfSB7XG4gICAgZm9udC1zaXplOiA2NHB4O1xuICAgIGxpbmUtaGVpZ2h0OiA4MHB4O1xuICB9XG5gO1xuXG5pbnRlcmZhY2UgUHJpY2luZ0Ftb3VudFByb3BzIHtcbiAgcHJvZHVjdDogUGxhblR5cGU7XG4gIHByaWNlOiBzdHJpbmc7XG4gIG1vbnRobHlQcmljZT86IHN0cmluZztcbiAgY3VycmVuY3k6IEN1cnJlbmN5O1xuICB0ZXJtTW9udGhzPzogbnVtYmVyO1xuICBjb21wYWN0PzogYm9vbGVhbjtcbiAgaXNNdWx0aXBsZTogYm9vbGVhbjtcbiAgaW5VcHNlbGxNb2RhbD86IGJvb2xlYW47XG59XG5cbmV4cG9ydCBjb25zdCBQcmljaW5nQW1vdW50OiBSZWFjdC5GQzxQcmljaW5nQW1vdW50UHJvcHM+ID0gKHtcbiAgY3VycmVuY3ksXG4gIG1vbnRobHlQcmljZSxcbiAgcHJvZHVjdCxcbiAgcHJpY2UsXG4gIHRlcm1Nb250aHMsXG4gIGNvbXBhY3QgPSBmYWxzZSxcbiAgaXNNdWx0aXBsZSxcbiAgaW5VcHNlbGxNb2RhbCA9IGZhbHNlLFxufSkgPT4ge1xuICBjb25zdCBjeWNsZSA9IHRlcm1Nb250aHMgPT09IDEgPyAnbW9udGhseScgOiAnYW5udWFsbHknO1xuICBjb25zdCBbZG9sbGFycywgY2VudHNdID0gcHJpY2Uuc3BsaXQoJy4nKTtcbiAgbGV0IGFyaWFMYWJlbCA9IGAke2dldEN1cnJlbmN5UHJlZml4KGN1cnJlbmN5KX0ke2dldEN1cnJlbmN5U3ltYm9sKFxuICAgIGN1cnJlbmN5XG4gICl9JHtkb2xsYXJzfSR7Y2VudHMgPyBgLiR7Y2VudHN9YCA6ICcnfWA7XG4gIGlmIChwcm9kdWN0ICE9PSAnYmFzaWMnKSB7XG4gICAgYXJpYUxhYmVsICs9IGAgYSBtb250aCwgYmlsbGVkICR7Y3ljbGV9YDtcbiAgICBpZiAoaW5VcHNlbGxNb2RhbCkgYXJpYUxhYmVsICs9ICcsIG1vbnRobHkgcHJpY2luZyBhbHNvIGF2YWlsYWJsZSc7XG4gICAgaWYgKG1vbnRobHlQcmljZSkge1xuICAgICAgYXJpYUxhYmVsICs9IGAgb3IgJHtnZXRDdXJyZW5jeVByZWZpeChjdXJyZW5jeSl9JHtnZXRDdXJyZW5jeVN5bWJvbChcbiAgICAgICAgY3VycmVuY3lcbiAgICAgICl9JHttb250aGx5UHJpY2V9IGJpbGxlZCBtb250aGx5YDtcbiAgICB9XG4gIH1cblxuICByZXR1cm4gKFxuICAgIDw+XG4gICAgICA8RmxleEJveFxuICAgICAgICBkYXRhLXRlc3RpZD1cInByaWNpbmctYW1vdW50XCJcbiAgICAgICAgbGluZUhlaWdodD1cInRpdGxlXCJcbiAgICAgICAgbWI9e2NvbXBhY3QgPyAwIDogOH1cbiAgICAgICAgY29sdW1uXG4gICAgICAgIGFsaWduSXRlbXM9XCJjZW50ZXJcIlxuICAgICAgPlxuICAgICAgICA8VGV4dCBzY3JlZW5yZWFkZXIgZGF0YS10ZXN0aWQ9XCJwcmljaW5nLWFtb3VudC1sYWJlbFwiPlxuICAgICAgICAgIHthcmlhTGFiZWx9XG4gICAgICAgIDwvVGV4dD5cbiAgICAgICAgey8qIGZvciBzY3JlZW4gcmVhZGVyIG9wdGltaXphdGlvbiAqL31cbiAgICAgICAgPEZsZXhCb3hcbiAgICAgICAgICBhcmlhLWhpZGRlblxuICAgICAgICAgIHJvd1xuICAgICAgICAgIGFsaWduSXRlbXM9XCJjZW50ZXJcIlxuICAgICAgICAgIGhlaWdodD17aXNNdWx0aXBsZSA/IHsgXzogNTAsIHhsOiAndW5zZXQnIH0gOiAndW5zZXQnfVxuICAgICAgICA+XG4gICAgICAgICAgPEZsZXhCb3ggbXI9ezR9IGFsaWduSXRlbXM9XCJzdGFydFwiPlxuICAgICAgICAgICAgPFRleHRcbiAgICAgICAgICAgICAgY29sb3I9XCJ0ZXh0XCJcbiAgICAgICAgICAgICAgbXQ9e3sgXzogMTIsIHhsOiAxNiB9fVxuICAgICAgICAgICAgICBmb250V2VpZ2h0PVwiYm9sZFwiXG4gICAgICAgICAgICAgIGZvbnRTaXplPXszNH1cbiAgICAgICAgICAgID57YCR7Z2V0Q3VycmVuY3lQcmVmaXgoY3VycmVuY3kpfSR7Z2V0Q3VycmVuY3lTeW1ib2woXG4gICAgICAgICAgICAgIGN1cnJlbmN5XG4gICAgICAgICAgICApfWB9PC9UZXh0PlxuICAgICAgICAgICAgPEFtb3VudCBpc011bHRpcGxlPXtpc011bHRpcGxlfT57YCR7ZG9sbGFyc31gfTwvQW1vdW50PlxuICAgICAgICAgICAge3Byb2R1Y3QgPT09ICdiYXNpYycgPyBudWxsIDogKFxuICAgICAgICAgICAgICA8RmxleEJveCBjb2x1bW4gYWxpZ25JdGVtcz1cImZsZXgtZW5kXCIgbWw9ezR9PlxuICAgICAgICAgICAgICAgIDxUZXh0XG4gICAgICAgICAgICAgICAgICBjb2xvcj1cInRleHRcIlxuICAgICAgICAgICAgICAgICAgZm9udFdlaWdodD1cImJvbGRcIlxuICAgICAgICAgICAgICAgICAgZm9udFNpemU9ezIyfVxuICAgICAgICAgICAgICAgICAgbXQ9e3sgXzogMTIsIHhsOiAxNiB9fVxuICAgICAgICAgICAgICAgID5cbiAgICAgICAgICAgICAgICAgIHtjZW50cyA/IGAuJHtjZW50c31gIDogPHNwYW4+Jm5ic3A7PC9zcGFuPn1cbiAgICAgICAgICAgICAgICA8L1RleHQ+XG4gICAgICAgICAgICAgICAgPFRleHQgbXQ9e3sgXzogMCwgeGw6IDQgfX0gY29sb3I9XCJ0ZXh0LXNlY29uZGFyeVwiPlxuICAgICAgICAgICAgICAgICAgL21vXG4gICAgICAgICAgICAgICAgPC9UZXh0PlxuICAgICAgICAgICAgICA8L0ZsZXhCb3g+XG4gICAgICAgICAgICApfVxuICAgICAgICAgIDwvRmxleEJveD5cbiAgICAgICAgPC9GbGV4Qm94PlxuICAgICAgICA8VGV4dCBjb2xvcj1cInRleHQtc2Vjb25kYXJ5XCIgY2VudGVyIG10PXtjb21wYWN0ID8gMCA6IHsgXzogOCwgeGw6IDAgfX0+XG4gICAgICAgICAge3Byb2R1Y3QgPT09ICdiYXNpYycgPyAoXG4gICAgICAgICAgICA8VGV4dCBtYj17MjR9PkFsd2F5cyBmcmVlPC9UZXh0PlxuICAgICAgICAgICkgOiAoXG4gICAgICAgICAgICA8PlxuICAgICAgICAgICAgICA8VGV4dCBtYj17Y29tcGFjdCA/IDAgOiA4fSBhcmlhLWhpZGRlbj5cbiAgICAgICAgICAgICAgICB7YEJpbGxlZCAke2N5Y2xlfSR7aW5VcHNlbGxNb2RhbCA/ICcqJyA6ICcnfWB9XG4gICAgICAgICAgICAgIDwvVGV4dD5cbiAgICAgICAgICAgICAgPGJyIC8+XG4gICAgICAgICAgICAgIHttb250aGx5UHJpY2UgJiYgKFxuICAgICAgICAgICAgICAgIDxUZXh0IGFyaWEtaGlkZGVuPlxuICAgICAgICAgICAgICAgICAge2BvciAke2dldEN1cnJlbmN5UHJlZml4KGN1cnJlbmN5KX0ke2dldEN1cnJlbmN5U3ltYm9sKFxuICAgICAgICAgICAgICAgICAgICBjdXJyZW5jeVxuICAgICAgICAgICAgICAgICAgKX0ke21vbnRobHlQcmljZX0gYmlsbGVkIG1vbnRobHlgfVxuICAgICAgICAgICAgICAgIDwvVGV4dD5cbiAgICAgICAgICAgICAgKX1cbiAgICAgICAgICAgIDwvPlxuICAgICAgICAgICl9XG4gICAgICAgIDwvVGV4dD5cbiAgICAgIDwvRmxleEJveD5cbiAgICA8Lz5cbiAgKTtcbn07XG4iXX0= */"));
-export 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 = `${getCurrencyPrefix(currency)}${getCurrencySymbol(currency)}${dollars}${cents ? `.${cents}` : ''}`;
-  if (product !== 'basic') {
-    ariaLabel += ` a month, billed ${cycle}`;
-    if (inUpsellModal) ariaLabel += ', monthly pricing also available';
-    if (monthlyPrice) {
-      ariaLabel += ` or ${getCurrencyPrefix(currency)}${getCurrencySymbol(currency)}${monthlyPrice} billed monthly`;
-    }
-  }
-  return /*#__PURE__*/_jsx(_Fragment, {
-    children: /*#__PURE__*/_jsxs(FlexBox, {
-      "data-testid": "pricing-amount",
-      lineHeight: "title",
-      mb: compact ? 0 : 8,
-      column: true,
-      alignItems: "center",
-      children: [/*#__PURE__*/_jsx(Text, {
-        screenreader: true,
-        "data-testid": "pricing-amount-label",
-        children: ariaLabel
-      }), /*#__PURE__*/_jsx(FlexBox, {
-        "aria-hidden": true,
-        row: true,
-        alignItems: "center",
-        height: isMultiple ? {
-          _: 50,
-          xl: 'unset'
-        } : 'unset',
-        children: /*#__PURE__*/_jsxs(FlexBox, {
-          mr: 4,
-          alignItems: "start",
-          children: [/*#__PURE__*/_jsx(Text, {
-            color: "text",
-            mt: {
-              _: 12,
-              xl: 16
-            },
-            fontWeight: "bold",
-            fontSize: 34,
-            children: `${getCurrencyPrefix(currency)}${getCurrencySymbol(currency)}`
-          }), /*#__PURE__*/_jsx(Amount, {
-            isMultiple: isMultiple,
-            children: `${dollars}`
-          }), product === 'basic' ? null : /*#__PURE__*/_jsxs(FlexBox, {
-            column: true,
-            alignItems: "flex-end",
-            ml: 4,
-            children: [/*#__PURE__*/_jsx(Text, {
-              color: "text",
-              fontWeight: "bold",
-              fontSize: 22,
-              mt: {
-                _: 12,
-                xl: 16
-              },
-              children: cents ? `.${cents}` : /*#__PURE__*/_jsx("span", {
-                children: "\xA0"
-              })
-            }), /*#__PURE__*/_jsx(Text, {
-              mt: {
-                _: 0,
-                xl: 4
-              },
-              color: "text-secondary",
-              children: "/mo"
-            })]
-          })]
-        })
-      }), /*#__PURE__*/_jsx(Text, {
-        color: "text-secondary",
-        center: true,
-        mt: compact ? 0 : {
-          _: 8,
-          xl: 0
-        },
-        children: product === 'basic' ? /*#__PURE__*/_jsx(Text, {
-          mb: 24,
-          children: "Always free"
-        }) : /*#__PURE__*/_jsxs(_Fragment, {
-          children: [/*#__PURE__*/_jsx(Text, {
-            mb: compact ? 0 : 8,
-            "aria-hidden": true,
-            children: `Billed ${cycle}${inUpsellModal ? '*' : ''}`
-          }), /*#__PURE__*/_jsx("br", {}), monthlyPrice && /*#__PURE__*/_jsx(Text, {
-            "aria-hidden": true,
-            children: `or ${getCurrencyPrefix(currency)}${getCurrencySymbol(currency)}${monthlyPrice} billed monthly`
-          })]
-        })
-      })]
-    })
-  });
-};
+import { getCurrencyPrefix, getCurrencySymbol } from "./types.js";
+import { FlexBox, Text } from "@codecademy/gamut";
+import { theme } from "@codecademy/gamut-styles";
+import styled from "@emotion/styled";
+import React from "react";
+
+//#region src/PlanCard/PricingAmount.tsx
+const Amount = /* @__PURE__ */ styled(Text, {
+	target: "e12vo0d50",
+	label: "brand-Amount"
+})("font-weight:bold;color:", theme.colors.text, ";font-size:", ({ isMultiple }) => isMultiple ? "44px" : "64px", ";line-height:", ({ isMultiple }) => isMultiple ? "64px" : "80px", ";", theme.breakpoints.xl, "{font-size:64px;line-height:80px;}", "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiL2hvbWUvcnVubmVyL3dvcmsvbW9uby9tb25vL2xpYnMvdWkvYnJhbmQvc3JjL1BsYW5DYXJkL1ByaWNpbmdBbW91bnQudHN4Iiwic291cmNlcyI6WyIvaG9tZS9ydW5uZXIvd29yay9tb25vL21vbm8vbGlicy91aS9icmFuZC9zcmMvUGxhbkNhcmQvUHJpY2luZ0Ftb3VudC50c3giXSwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgRmxleEJveCwgVGV4dCB9IGZyb20gJ0Bjb2RlY2FkZW15L2dhbXV0JztcbmltcG9ydCB7IHRoZW1lIH0gZnJvbSAnQGNvZGVjYWRlbXkvZ2FtdXQtc3R5bGVzJztcbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJztcbmltcG9ydCBSZWFjdCBmcm9tICdyZWFjdCc7XG5cbmltcG9ydCB7XG4gIEN1cnJlbmN5LFxuICBnZXRDdXJyZW5jeVByZWZpeCxcbiAgZ2V0Q3VycmVuY3lTeW1ib2wsXG4gIFBsYW5UeXBlLFxufSBmcm9tICcuL3R5cGVzJztcblxuY29uc3QgQW1vdW50ID0gc3R5bGVkKFRleHQpPHsgaXNNdWx0aXBsZTogYm9vbGVhbiB9PmBcbiAgZm9udC13ZWlnaHQ6IGJvbGQ7XG4gIGNvbG9yOiAke3RoZW1lLmNvbG9ycy50ZXh0fTtcbiAgZm9udC1zaXplOiAkeyh7IGlzTXVsdGlwbGUgfSkgPT4gKGlzTXVsdGlwbGUgPyAnNDRweCcgOiAnNjRweCcpfTtcbiAgbGluZS1oZWlnaHQ6ICR7KHsgaXNNdWx0aXBsZSB9KSA9PiAoaXNNdWx0aXBsZSA/ICc2NHB4JyA6ICc4MHB4Jyl9O1xuICAke3RoZW1lLmJyZWFrcG9pbnRzLnhsfSB7XG4gICAgZm9udC1zaXplOiA2NHB4O1xuICAgIGxpbmUtaGVpZ2h0OiA4MHB4O1xuICB9XG5gO1xuXG5pbnRlcmZhY2UgUHJpY2luZ0Ftb3VudFByb3BzIHtcbiAgcHJvZHVjdDogUGxhblR5cGU7XG4gIHByaWNlOiBzdHJpbmc7XG4gIG1vbnRobHlQcmljZT86IHN0cmluZztcbiAgY3VycmVuY3k6IEN1cnJlbmN5O1xuICB0ZXJtTW9udGhzPzogbnVtYmVyO1xuICBjb21wYWN0PzogYm9vbGVhbjtcbiAgaXNNdWx0aXBsZTogYm9vbGVhbjtcbiAgaW5VcHNlbGxNb2RhbD86IGJvb2xlYW47XG59XG5cbmV4cG9ydCBjb25zdCBQcmljaW5nQW1vdW50OiBSZWFjdC5GQzxQcmljaW5nQW1vdW50UHJvcHM+ID0gKHtcbiAgY3VycmVuY3ksXG4gIG1vbnRobHlQcmljZSxcbiAgcHJvZHVjdCxcbiAgcHJpY2UsXG4gIHRlcm1Nb250aHMsXG4gIGNvbXBhY3QgPSBmYWxzZSxcbiAgaXNNdWx0aXBsZSxcbiAgaW5VcHNlbGxNb2RhbCA9IGZhbHNlLFxufSkgPT4ge1xuICBjb25zdCBjeWNsZSA9IHRlcm1Nb250aHMgPT09IDEgPyAnbW9udGhseScgOiAnYW5udWFsbHknO1xuICBjb25zdCBbZG9sbGFycywgY2VudHNdID0gcHJpY2Uuc3BsaXQoJy4nKTtcbiAgbGV0IGFyaWFMYWJlbCA9IGAke2dldEN1cnJlbmN5UHJlZml4KGN1cnJlbmN5KX0ke2dldEN1cnJlbmN5U3ltYm9sKFxuICAgIGN1cnJlbmN5XG4gICl9JHtkb2xsYXJzfSR7Y2VudHMgPyBgLiR7Y2VudHN9YCA6ICcnfWA7XG4gIGlmIChwcm9kdWN0ICE9PSAnYmFzaWMnKSB7XG4gICAgYXJpYUxhYmVsICs9IGAgYSBtb250aCwgYmlsbGVkICR7Y3ljbGV9YDtcbiAgICBpZiAoaW5VcHNlbGxNb2RhbCkgYXJpYUxhYmVsICs9ICcsIG1vbnRobHkgcHJpY2luZyBhbHNvIGF2YWlsYWJsZSc7XG4gICAgaWYgKG1vbnRobHlQcmljZSkge1xuICAgICAgYXJpYUxhYmVsICs9IGAgb3IgJHtnZXRDdXJyZW5jeVByZWZpeChjdXJyZW5jeSl9JHtnZXRDdXJyZW5jeVN5bWJvbChcbiAgICAgICAgY3VycmVuY3lcbiAgICAgICl9JHttb250aGx5UHJpY2V9IGJpbGxlZCBtb250aGx5YDtcbiAgICB9XG4gIH1cblxuICByZXR1cm4gKFxuICAgIDw+XG4gICAgICA8RmxleEJveFxuICAgICAgICBkYXRhLXRlc3RpZD1cInByaWNpbmctYW1vdW50XCJcbiAgICAgICAgbGluZUhlaWdodD1cInRpdGxlXCJcbiAgICAgICAgbWI9e2NvbXBhY3QgPyAwIDogOH1cbiAgICAgICAgY29sdW1uXG4gICAgICAgIGFsaWduSXRlbXM9XCJjZW50ZXJcIlxuICAgICAgPlxuICAgICAgICA8VGV4dCBzY3JlZW5yZWFkZXIgZGF0YS10ZXN0aWQ9XCJwcmljaW5nLWFtb3VudC1sYWJlbFwiPlxuICAgICAgICAgIHthcmlhTGFiZWx9XG4gICAgICAgIDwvVGV4dD5cbiAgICAgICAgey8qIGZvciBzY3JlZW4gcmVhZGVyIG9wdGltaXphdGlvbiAqL31cbiAgICAgICAgPEZsZXhCb3hcbiAgICAgICAgICBhcmlhLWhpZGRlblxuICAgICAgICAgIHJvd1xuICAgICAgICAgIGFsaWduSXRlbXM9XCJjZW50ZXJcIlxuICAgICAgICAgIGhlaWdodD17aXNNdWx0aXBsZSA/IHsgXzogNTAsIHhsOiAndW5zZXQnIH0gOiAndW5zZXQnfVxuICAgICAgICA+XG4gICAgICAgICAgPEZsZXhCb3ggbXI9ezR9IGFsaWduSXRlbXM9XCJzdGFydFwiPlxuICAgICAgICAgICAgPFRleHRcbiAgICAgICAgICAgICAgY29sb3I9XCJ0ZXh0XCJcbiAgICAgICAgICAgICAgbXQ9e3sgXzogMTIsIHhsOiAxNiB9fVxuICAgICAgICAgICAgICBmb250V2VpZ2h0PVwiYm9sZFwiXG4gICAgICAgICAgICAgIGZvbnRTaXplPXszNH1cbiAgICAgICAgICAgID57YCR7Z2V0Q3VycmVuY3lQcmVmaXgoY3VycmVuY3kpfSR7Z2V0Q3VycmVuY3lTeW1ib2woXG4gICAgICAgICAgICAgIGN1cnJlbmN5XG4gICAgICAgICAgICApfWB9PC9UZXh0PlxuICAgICAgICAgICAgPEFtb3VudCBpc011bHRpcGxlPXtpc011bHRpcGxlfT57YCR7ZG9sbGFyc31gfTwvQW1vdW50PlxuICAgICAgICAgICAge3Byb2R1Y3QgPT09ICdiYXNpYycgPyBudWxsIDogKFxuICAgICAgICAgICAgICA8RmxleEJveCBjb2x1bW4gYWxpZ25JdGVtcz1cImZsZXgtZW5kXCIgbWw9ezR9PlxuICAgICAgICAgICAgICAgIDxUZXh0XG4gICAgICAgICAgICAgICAgICBjb2xvcj1cInRleHRcIlxuICAgICAgICAgICAgICAgICAgZm9udFdlaWdodD1cImJvbGRcIlxuICAgICAgICAgICAgICAgICAgZm9udFNpemU9ezIyfVxuICAgICAgICAgICAgICAgICAgbXQ9e3sgXzogMTIsIHhsOiAxNiB9fVxuICAgICAgICAgICAgICAgID5cbiAgICAgICAgICAgICAgICAgIHtjZW50cyA/IGAuJHtjZW50c31gIDogPHNwYW4+Jm5ic3A7PC9zcGFuPn1cbiAgICAgICAgICAgICAgICA8L1RleHQ+XG4gICAgICAgICAgICAgICAgPFRleHQgbXQ9e3sgXzogMCwgeGw6IDQgfX0gY29sb3I9XCJ0ZXh0LXNlY29uZGFyeVwiPlxuICAgICAgICAgICAgICAgICAgL21vXG4gICAgICAgICAgICAgICAgPC9UZXh0PlxuICAgICAgICAgICAgICA8L0ZsZXhCb3g+XG4gICAgICAgICAgICApfVxuICAgICAgICAgIDwvRmxleEJveD5cbiAgICAgICAgPC9GbGV4Qm94PlxuICAgICAgICA8VGV4dCBjb2xvcj1cInRleHQtc2Vjb25kYXJ5XCIgY2VudGVyIG10PXtjb21wYWN0ID8gMCA6IHsgXzogOCwgeGw6IDAgfX0+XG4gICAgICAgICAge3Byb2R1Y3QgPT09ICdiYXNpYycgPyAoXG4gICAgICAgICAgICA8VGV4dCBtYj17MjR9PkFsd2F5cyBmcmVlPC9UZXh0PlxuICAgICAgICAgICkgOiAoXG4gICAgICAgICAgICA8PlxuICAgICAgICAgICAgICA8VGV4dCBtYj17Y29tcGFjdCA/IDAgOiA4fSBhcmlhLWhpZGRlbj5cbiAgICAgICAgICAgICAgICB7YEJpbGxlZCAke2N5Y2xlfSR7aW5VcHNlbGxNb2RhbCA/ICcqJyA6ICcnfWB9XG4gICAgICAgICAgICAgIDwvVGV4dD5cbiAgICAgICAgICAgICAgPGJyIC8+XG4gICAgICAgICAgICAgIHttb250aGx5UHJpY2UgJiYgKFxuICAgICAgICAgICAgICAgIDxUZXh0IGFyaWEtaGlkZGVuPlxuICAgICAgICAgICAgICAgICAge2BvciAke2dldEN1cnJlbmN5UHJlZml4KGN1cnJlbmN5KX0ke2dldEN1cnJlbmN5U3ltYm9sKFxuICAgICAgICAgICAgICAgICAgICBjdXJyZW5jeVxuICAgICAgICAgICAgICAgICAgKX0ke21vbnRobHlQcmljZX0gYmlsbGVkIG1vbnRobHlgfVxuICAgICAgICAgICAgICAgIDwvVGV4dD5cbiAgICAgICAgICAgICAgKX1cbiAgICAgICAgICAgIDwvPlxuICAgICAgICAgICl9XG4gICAgICAgIDwvVGV4dD5cbiAgICAgIDwvRmxleEJveD5cbiAgICA8Lz5cbiAgKTtcbn07XG4iXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBWWUifQ== */");
+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 = `${getCurrencyPrefix(currency)}${getCurrencySymbol(currency)}${dollars}${cents ? `.${cents}` : ""}`;
+	if (product !== "basic") {
+		ariaLabel += ` a month, billed ${cycle}`;
+		if (inUpsellModal) ariaLabel += ", monthly pricing also available";
+		if (monthlyPrice) ariaLabel += ` or ${getCurrencyPrefix(currency)}${getCurrencySymbol(currency)}${monthlyPrice} billed monthly`;
+	}
+	return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(FlexBox, {
+		"data-testid": "pricing-amount",
+		lineHeight: "title",
+		mb: compact ? 0 : 8,
+		column: true,
+		alignItems: "center"
+	}, /* @__PURE__ */ React.createElement(Text, {
+		screenreader: true,
+		"data-testid": "pricing-amount-label"
+	}, ariaLabel), /* @__PURE__ */ React.createElement(FlexBox, {
+		"aria-hidden": true,
+		row: true,
+		alignItems: "center",
+		height: isMultiple ? {
+			_: 50,
+			xl: "unset"
+		} : "unset"
+	}, /* @__PURE__ */ React.createElement(FlexBox, {
+		mr: 4,
+		alignItems: "start"
+	}, /* @__PURE__ */ React.createElement(Text, {
+		color: "text",
+		mt: {
+			_: 12,
+			xl: 16
+		},
+		fontWeight: "bold",
+		fontSize: 34
+	}, `${getCurrencyPrefix(currency)}${getCurrencySymbol(currency)}`), /* @__PURE__ */ React.createElement(Amount, { isMultiple }, `${dollars}`), product === "basic" ? null : /* @__PURE__ */ React.createElement(FlexBox, {
+		column: true,
+		alignItems: "flex-end",
+		ml: 4
+	}, /* @__PURE__ */ React.createElement(Text, {
+		color: "text",
+		fontWeight: "bold",
+		fontSize: 22,
+		mt: {
+			_: 12,
+			xl: 16
+		}
+	}, cents ? `.${cents}` : /* @__PURE__ */ React.createElement("span", null, "\xA0")), /* @__PURE__ */ React.createElement(Text, {
+		mt: {
+			_: 0,
+			xl: 4
+		},
+		color: "text-secondary"
+	}, "/mo")))), /* @__PURE__ */ React.createElement(Text, {
+		color: "text-secondary",
+		center: true,
+		mt: compact ? 0 : {
+			_: 8,
+			xl: 0
+		}
+	}, product === "basic" ? /* @__PURE__ */ React.createElement(Text, { mb: 24 }, "Always free") : /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(Text, {
+		mb: compact ? 0 : 8,
+		"aria-hidden": true
+	}, `Billed ${cycle}${inUpsellModal ? "*" : ""}`), /* @__PURE__ */ React.createElement("br", null), monthlyPrice && /* @__PURE__ */ React.createElement(Text, { "aria-hidden": true }, `or ${getCurrencyPrefix(currency)}${getCurrencySymbol(currency)}${monthlyPrice} billed monthly`)))));
+};
+
+//#endregion
+export { PricingAmount };
+//# sourceMappingURL=PricingAmount.js.map

package/dist/PlanCard/PricingAmount.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PricingAmount.js","names":["FlexBox","Text","theme","styled","React","getCurrencyPrefix","getCurrencySymbol","Amount","colors","text","isMultiple","breakpoints","xl","PricingAmount","currency","monthlyPrice","product","price","termMonths","compact","inUpsellModal","cycle","dollars","cents","split","ariaLabel","data-testid","lineHeight","mb","column","alignItems","screenreader","aria-hidden","row","height","_","mr","color","mt","fontWeight","fontSize","ml","span","center","br"],"sources":["../../src/PlanCard/PricingAmount.tsx"],"sourcesContent":["import { FlexBox, Text } from '@codecademy/gamut';\nimport { theme } from '@codecademy/gamut-styles';\nimport styled from '@emotion/styled';\nimport React from 'react';\n\nimport {\n  Currency,\n  getCurrencyPrefix,\n  getCurrencySymbol,\n  PlanType,\n} from './types';\n\nconst Amount = styled(Text)<{ isMultiple: boolean }>`\n  font-weight: bold;\n  color: ${theme.colors.text};\n  font-size: ${({ isMultiple }) => (isMultiple ? '44px' : '64px')};\n  line-height: ${({ isMultiple }) => (isMultiple ? '64px' : '80px')};\n  ${theme.breakpoints.xl} {\n    font-size: 64px;\n    line-height: 80px;\n  }\n`;\n\ninterface PricingAmountProps {\n  product: PlanType;\n  price: string;\n  monthlyPrice?: string;\n  currency: Currency;\n  termMonths?: number;\n  compact?: boolean;\n  isMultiple: boolean;\n  inUpsellModal?: boolean;\n}\n\nexport const PricingAmount: React.FC<PricingAmountProps> = ({\n  currency,\n  monthlyPrice,\n  product,\n  price,\n  termMonths,\n  compact = false,\n  isMultiple,\n  inUpsellModal = false,\n}) => {\n  const cycle = termMonths === 1 ? 'monthly' : 'annually';\n  const [dollars, cents] = price.split('.');\n  let ariaLabel = `${getCurrencyPrefix(currency)}${getCurrencySymbol(\n    currency\n  )}${dollars}${cents ? `.${cents}` : ''}`;\n  if (product !== 'basic') {\n    ariaLabel += ` a month, billed ${cycle}`;\n    if (inUpsellModal) ariaLabel += ', monthly pricing also available';\n    if (monthlyPrice) {\n      ariaLabel += ` or ${getCurrencyPrefix(currency)}${getCurrencySymbol(\n        currency\n      )}${monthlyPrice} billed monthly`;\n    }\n  }\n\n  return (\n    <>\n      <FlexBox\n        data-testid=\"pricing-amount\"\n        lineHeight=\"title\"\n        mb={compact ? 0 : 8}\n        column\n        alignItems=\"center\"\n      >\n        <Text screenreader data-testid=\"pricing-amount-label\">\n          {ariaLabel}\n        </Text>\n        {/* for screen reader optimization */}\n        <FlexBox\n          aria-hidden\n          row\n          alignItems=\"center\"\n          height={isMultiple ? { _: 50, xl: 'unset' } : 'unset'}\n        >\n          <FlexBox mr={4} alignItems=\"start\">\n            <Text\n              color=\"text\"\n              mt={{ _: 12, xl: 16 }}\n              fontWeight=\"bold\"\n              fontSize={34}\n            >{`${getCurrencyPrefix(currency)}${getCurrencySymbol(\n              currency\n            )}`}</Text>\n            <Amount isMultiple={isMultiple}>{`${dollars}`}</Amount>\n            {product === 'basic' ? null : (\n              <FlexBox column alignItems=\"flex-end\" ml={4}>\n                <Text\n                  color=\"text\"\n                  fontWeight=\"bold\"\n                  fontSize={22}\n                  mt={{ _: 12, xl: 16 }}\n                >\n                  {cents ? `.${cents}` : <span>&nbsp;</span>}\n                </Text>\n                <Text mt={{ _: 0, xl: 4 }} color=\"text-secondary\">\n                  /mo\n                </Text>\n              </FlexBox>\n            )}\n          </FlexBox>\n        </FlexBox>\n        <Text color=\"text-secondary\" center mt={compact ? 0 : { _: 8, xl: 0 }}>\n          {product === 'basic' ? (\n            <Text mb={24}>Always free</Text>\n          ) : (\n            <>\n              <Text mb={compact ? 0 : 8} aria-hidden>\n                {`Billed ${cycle}${inUpsellModal ? '*' : ''}`}\n              </Text>\n              <br />\n              {monthlyPrice && (\n                <Text aria-hidden>\n                  {`or ${getCurrencyPrefix(currency)}${getCurrencySymbol(\n                    currency\n                  )}${monthlyPrice} billed monthly`}\n                </Text>\n              )}\n            </>\n          )}\n        </Text>\n      </FlexBox>\n    </>\n  );\n};\n"],"mappings":";;;;;;;AAYA,MAAMO,SAASJ,uBAAOF,MAAAA;;;8BAEXC,MAAMM,OAAOC,MAAI,gBACZ,EAAEC,iBAAkBA,aAAa,SAAS,QAAA,kBACxC,EAAEA,iBAAkBA,aAAa,SAAS,QAAA,KACxDR,MAAMS,YAAYC,IAAE,sCAAA,s0KAAA;AAiBxB,MAAaC,iBAA+C,EAC1DC,UACAC,cACAC,SACAC,OACAC,YACAC,UAAU,OACVT,YACAU,gBAAgB,YACjB;CACC,MAAMC,QAAQH,eAAe,IAAI,YAAY;CAC7C,MAAM,CAACI,SAASC,SAASN,MAAMO,MAAM,IAAA;CACrC,IAAIC,YAAY,GAAGpB,kBAAkBS,SAAAA,GAAYR,kBAC/CQ,SAAAA,GACEQ,UAAUC,QAAQ,IAAIA,UAAU;AACpC,KAAIP,YAAY,SAAS;AACvBS,eAAa,oBAAoBJ;AACjC,MAAID,cAAeK,cAAa;AAChC,MAAIV,aACFU,cAAa,OAAOpB,kBAAkBS,SAAAA,GAAYR,kBAChDQ,SAAAA,GACEC,aAAa;;AAIrB,QACE,sBAAA,cAAA,MAAA,UAAA,MACE,sBAAA,cAACf,SAAAA;EACC0B,eAAY;EACZC,YAAW;EACXC,IAAIT,UAAU,IAAI;EAClBU,QAAAA;EACAC,YAAW;IAEX,sBAAA,cAAC7B,MAAAA;EAAK8B,cAAAA;EAAaL,eAAY;IAC5BD,UAAAA,EAGH,sBAAA,cAACzB,SAAAA;EACCgC,eAAAA;EACAC,KAAAA;EACAH,YAAW;EACXI,QAAQxB,aAAa;GAAEyB,GAAG;GAAIvB,IAAI;GAAQ,GAAI;IAE9C,sBAAA,cAACZ,SAAAA;EAAQoC,IAAI;EAAGN,YAAW;IACzB,sBAAA,cAAC7B,MAAAA;EACCoC,OAAM;EACNC,IAAI;GAAEH,GAAG;GAAIvB,IAAI;GAAG;EACpB2B,YAAW;EACXC,UAAU;IACV,GAAGnC,kBAAkBS,SAAAA,GAAYR,kBACjCQ,SAAAA,GACC,EACH,sBAAA,cAACP,QAAAA,EAAmBG,cAAa,GAAGY,UAAS,EAC5CN,YAAY,UAAU,OACrB,sBAAA,cAAChB,SAAAA;EAAQ6B,QAAAA;EAAOC,YAAW;EAAWW,IAAI;IACxC,sBAAA,cAACxC,MAAAA;EACCoC,OAAM;EACNE,YAAW;EACXC,UAAU;EACVF,IAAI;GAAEH,GAAG;GAAIvB,IAAI;GAAG;IAEnBW,QAAQ,IAAIA,UAAU,sBAAA,cAACmB,QAAAA,MAAK,OAAA,CAAA,EAE/B,sBAAA,cAACzC,MAAAA;EAAKqC,IAAI;GAAEH,GAAG;GAAGvB,IAAI;GAAE;EAAGyB,OAAM;IAAiB,MAAA,CAAA,CAAA,CAAA,EAO1D,sBAAA,cAACpC,MAAAA;EAAKoC,OAAM;EAAiBM,QAAAA;EAAOL,IAAInB,UAAU,IAAI;GAAEgB,GAAG;GAAGvB,IAAI;GAAE;IACjEI,YAAY,UACX,sBAAA,cAACf,MAAAA,EAAK2B,IAAI,MAAI,cAAA,GAEd,sBAAA,cAAA,MAAA,UAAA,MACE,sBAAA,cAAC3B,MAAAA;EAAK2B,IAAIT,UAAU,IAAI;EAAGa,eAAAA;IACxB,UAAUX,QAAQD,gBAAgB,MAAM,KAAI,EAE/C,sBAAA,cAACwB,MAAAA,KAAAA,EACA7B,gBACC,sBAAA,cAACd,MAAAA,EAAK+B,eAAAA,QACH,MAAM3B,kBAAkBS,SAAAA,GAAYR,kBACnCQ,SAAAA,GACEC,aAAa,iBAAgB,CAAA,CAAA,CAAA,CAAA"}

package/dist/PlanCard/RecommendedBadge.cjs

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

package/dist/PlanCard/RecommendedBadge.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"RecommendedBadge.cjs","names":["FlexBox","Text","MiniStarIcon","React","RecommendedBadge","props","position","top","bg","color","p","borderRadiusTop","borderRadiusBottom","center","mr","size","fontFamily","lineHeight","fontSize"],"sources":["../../src/PlanCard/RecommendedBadge.tsx"],"sourcesContent":["import { FlexBox, FlexBoxProps, Text } from '@codecademy/gamut';\nimport { MiniStarIcon } from '@codecademy/gamut-icons';\nimport React from 'react';\n\nexport const RecommendedBadge: React.FC<FlexBoxProps> = (props) => (\n  <FlexBox\n    position=\"absolute\"\n    top={-28}\n    bg=\"navy\"\n    color=\"white\"\n    p={8}\n    borderRadiusTop=\"sm\"\n    borderRadiusBottom=\"none\"\n    center\n    {...props}\n  >\n    <MiniStarIcon mr={8} size={12} />\n    <Text fontFamily=\"accent\" lineHeight={0} fontSize={14}>\n      Recommended\n    </Text>\n  </FlexBox>\n);\n"],"mappings":";;;;;;;AAIA,MAAaI,oBAA4CC,UACvD,8BAAA,cAACL,2BAAAA;CACCM,UAAS;CACTC,KAAK;CACLC,IAAG;CACHC,OAAM;CACNC,GAAG;CACHC,iBAAgB;CAChBC,oBAAmB;CACnBC,QAAAA;CACC,GAAGR;GAEJ,8BAAA,cAACH,sCAAAA;CAAaY,IAAI;CAAGC,MAAM;IAC3B,8BAAA,cAACd,wBAAAA;CAAKe,YAAW;CAASC,YAAY;CAAGC,UAAU;GAAI,cAAA,CAAA"}

package/dist/PlanCard/RecommendedBadge.js

@@ -1,24 +1,27 @@
-import { FlexBox, Text } from '@codecademy/gamut';
-import { MiniStarIcon } from '@codecademy/gamut-icons';
-import React from 'react';
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-export const RecommendedBadge = props => /*#__PURE__*/_jsxs(FlexBox, {
-  position: "absolute",
-  top: -28,
-  bg: "navy",
-  color: "white",
-  p: 8,
-  borderRadiusTop: "sm",
-  borderRadiusBottom: "none",
-  center: true,
-  ...props,
-  children: [/*#__PURE__*/_jsx(MiniStarIcon, {
-    mr: 8,
-    size: 12
-  }), /*#__PURE__*/_jsx(Text, {
-    fontFamily: "accent",
-    lineHeight: 0,
-    fontSize: 14,
-    children: "Recommended"
-  })]
-});
+import { FlexBox, Text } from "@codecademy/gamut";
+import React from "react";
+import { MiniStarIcon } from "@codecademy/gamut-icons";
+
+//#region src/PlanCard/RecommendedBadge.tsx
+const RecommendedBadge = (props) => /* @__PURE__ */ React.createElement(FlexBox, {
+	position: "absolute",
+	top: -28,
+	bg: "navy",
+	color: "white",
+	p: 8,
+	borderRadiusTop: "sm",
+	borderRadiusBottom: "none",
+	center: true,
+	...props
+}, /* @__PURE__ */ React.createElement(MiniStarIcon, {
+	mr: 8,
+	size: 12
+}), /* @__PURE__ */ React.createElement(Text, {
+	fontFamily: "accent",
+	lineHeight: 0,
+	fontSize: 14
+}, "Recommended"));
+
+//#endregion
+export { RecommendedBadge };
+//# sourceMappingURL=RecommendedBadge.js.map

package/dist/PlanCard/RecommendedBadge.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"RecommendedBadge.js","names":["FlexBox","Text","MiniStarIcon","React","RecommendedBadge","props","position","top","bg","color","p","borderRadiusTop","borderRadiusBottom","center","mr","size","fontFamily","lineHeight","fontSize"],"sources":["../../src/PlanCard/RecommendedBadge.tsx"],"sourcesContent":["import { FlexBox, FlexBoxProps, Text } from '@codecademy/gamut';\nimport { MiniStarIcon } from '@codecademy/gamut-icons';\nimport React from 'react';\n\nexport const RecommendedBadge: React.FC<FlexBoxProps> = (props) => (\n  <FlexBox\n    position=\"absolute\"\n    top={-28}\n    bg=\"navy\"\n    color=\"white\"\n    p={8}\n    borderRadiusTop=\"sm\"\n    borderRadiusBottom=\"none\"\n    center\n    {...props}\n  >\n    <MiniStarIcon mr={8} size={12} />\n    <Text fontFamily=\"accent\" lineHeight={0} fontSize={14}>\n      Recommended\n    </Text>\n  </FlexBox>\n);\n"],"mappings":";;;;;AAIA,MAAaI,oBAA4CC,UACvD,sBAAA,cAACL,SAAAA;CACCM,UAAS;CACTC,KAAK;CACLC,IAAG;CACHC,OAAM;CACNC,GAAG;CACHC,iBAAgB;CAChBC,oBAAmB;CACnBC,QAAAA;CACC,GAAGR;GAEJ,sBAAA,cAACH,cAAAA;CAAaY,IAAI;CAAGC,MAAM;IAC3B,sBAAA,cAACd,MAAAA;CAAKe,YAAW;CAASC,YAAY;CAAGC,UAAU;GAAI,cAAA,CAAA"}

package/dist/PlanCard/consts.cjs

@@ -0,0 +1,221 @@
+
+//#region src/PlanCard/consts.ts
+const planDetails = {
+	pro: {
+		id: "pro",
+		title: "Pro",
+		tag: "Learn a skill",
+		variant: "yellow",
+		features: [
+			{
+				name: "Unlimited AI learning assistance",
+				available: true
+			},
+			{
+				name: "Real-world projects",
+				available: true
+			},
+			{
+				name: "All courses",
+				available: true
+			},
+			{
+				name: "Skill paths",
+				available: true
+			},
+			{
+				name: "Career paths",
+				available: true
+			},
+			{
+				name: "Interview prep",
+				available: true
+			},
+			{
+				name: "Professional certifications",
+				available: true
+			},
+			{
+				name: "Career services",
+				available: true
+			},
+			{
+				name: "Assessments",
+				available: true
+			}
+		]
+	},
+	"pro-student": {
+		id: "pro",
+		title: "Pro Student",
+		tag: "Build a career",
+		variant: "yellow",
+		features: [
+			{
+				name: "Unlimited AI learning assistance",
+				available: true
+			},
+			{
+				name: "Real-world projects",
+				available: true
+			},
+			{
+				name: "All courses",
+				available: true
+			},
+			{
+				name: "Skill paths",
+				available: true
+			},
+			{
+				name: "Career paths",
+				available: true
+			},
+			{
+				name: "Interview prep",
+				available: true
+			},
+			{
+				name: "Professional certifications",
+				available: true
+			},
+			{
+				name: "Assessments",
+				available: true
+			}
+		]
+	},
+	"pro-gold": {
+		id: "pro-gold",
+		title: "Pro",
+		tag: "Build a career",
+		variant: "yellow",
+		features: [
+			{
+				name: "Unlimited AI learning assistance",
+				available: true
+			},
+			{
+				name: "Real-world projects",
+				available: true
+			},
+			{
+				name: "All courses",
+				available: true
+			},
+			{
+				name: "Skill paths",
+				available: true
+			},
+			{
+				name: "Career paths",
+				available: true
+			},
+			{
+				name: "Interview prep",
+				available: true
+			},
+			{
+				name: "Professional certifications",
+				available: true
+			},
+			{
+				name: "Career services",
+				available: true
+			},
+			{
+				name: "Assessments",
+				available: true
+			}
+		]
+	},
+	"pro-silver": {
+		id: "pro-silver",
+		title: "Plus",
+		tag: "Learn a skill",
+		variant: "paleYellow",
+		features: [
+			{
+				name: "Unlimited AI learning assistance",
+				available: true
+			},
+			{
+				name: "Real-world projects",
+				available: true
+			},
+			{
+				name: "All courses",
+				available: true
+			},
+			{
+				name: "Skill paths",
+				available: true
+			},
+			{
+				name: "Career paths",
+				available: false
+			},
+			{
+				name: "Interview prep",
+				available: false
+			},
+			{
+				name: "Professional certifications",
+				available: false
+			},
+			{
+				name: "Career services",
+				available: false
+			},
+			{
+				name: "Assessments",
+				available: false
+			}
+		]
+	},
+	"bootcamp-all-access-pass": {
+		id: "bootcamp-all-access-pass",
+		title: "Bootcamp All Access Pass",
+		tag: "Includes 1 year of Pro",
+		variant: "navy-800",
+		features: [
+			{
+				name: "Includes 1 year of Pro",
+				available: true,
+				isHighlighted: true
+			},
+			{
+				name: "Beginner friendly",
+				available: true
+			},
+			{
+				name: "Premium certificate",
+				available: true
+			},
+			{
+				name: "Job assistance sessions",
+				available: true
+			},
+			{
+				name: "Real-world projects",
+				available: true
+			},
+			{
+				name: "Live doubt clearing",
+				available: true
+			},
+			{
+				name: "Access to real world experts",
+				available: true
+			},
+			{
+				name: "Community access",
+				available: true
+			}
+		]
+	}
+};
+
+//#endregion
+exports.planDetails = planDetails;
+//# sourceMappingURL=consts.cjs.map

package/dist/PlanCard/consts.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"consts.cjs","names":["planDetails","pro","id","title","tag","variant","features","name","available","isHighlighted"],"sources":["../../src/PlanCard/consts.ts"],"sourcesContent":["interface Detail {\n  id: string;\n  title: string;\n  tag: string;\n  variant: 'paleYellow' | 'yellow' | 'black' | 'navy-800';\n  features: {\n    name: string;\n    available: boolean;\n    isNew?: boolean;\n    isHighlighted?: boolean;\n  }[];\n}\n\ntype PlanDetails = Record<string, Detail>;\n\nexport const planDetails: PlanDetails = {\n  pro: {\n    id: 'pro',\n    title: 'Pro',\n    tag: 'Learn a skill',\n    variant: 'yellow',\n    features: [\n      { name: 'Unlimited AI learning assistance', available: true },\n      { name: 'Real-world projects', available: true },\n      { name: 'All courses', available: true },\n      { name: 'Skill paths', available: true },\n      { name: 'Career paths', available: true },\n      { name: 'Interview prep', available: true },\n      { name: 'Professional certifications', available: true },\n      { name: 'Career services', available: true },\n      { name: 'Assessments', available: true },\n    ],\n  },\n  'pro-student': {\n    id: 'pro',\n    title: 'Pro Student',\n    tag: 'Build a career',\n    variant: 'yellow',\n    features: [\n      { name: 'Unlimited AI learning assistance', available: true },\n      { name: 'Real-world projects', available: true },\n      { name: 'All courses', available: true },\n      { name: 'Skill paths', available: true },\n      { name: 'Career paths', available: true },\n      { name: 'Interview prep', available: true },\n      { name: 'Professional certifications', available: true },\n      { name: 'Assessments', available: true },\n    ],\n  },\n  'pro-gold': {\n    id: 'pro-gold',\n    title: 'Pro',\n    tag: 'Build a career',\n    variant: 'yellow',\n    features: [\n      { name: 'Unlimited AI learning assistance', available: true },\n      { name: 'Real-world projects', available: true },\n      { name: 'All courses', available: true },\n      { name: 'Skill paths', available: true },\n      { name: 'Career paths', available: true },\n      { name: 'Interview prep', available: true },\n      { name: 'Professional certifications', available: true },\n      { name: 'Career services', available: true },\n      { name: 'Assessments', available: true },\n    ],\n  },\n  'pro-silver': {\n    id: 'pro-silver',\n    title: 'Plus',\n    tag: 'Learn a skill',\n    variant: 'paleYellow',\n    features: [\n      { name: 'Unlimited AI learning assistance', available: true },\n      { name: 'Real-world projects', available: true },\n      { name: 'All courses', available: true },\n      { name: 'Skill paths', available: true },\n      { name: 'Career paths', available: false },\n      { name: 'Interview prep', available: false },\n      { name: 'Professional certifications', available: false },\n      { name: 'Career services', available: false },\n      { name: 'Assessments', available: false },\n    ],\n  },\n  'bootcamp-all-access-pass': {\n    id: 'bootcamp-all-access-pass',\n    title: 'Bootcamp All Access Pass',\n    tag: 'Includes 1 year of Pro',\n    variant: 'navy-800',\n    features: [\n      { name: 'Includes 1 year of Pro', available: true, isHighlighted: true },\n      { name: 'Beginner friendly', available: true },\n      { name: 'Premium certificate', available: true },\n      { name: 'Job assistance sessions', available: true },\n      { name: 'Real-world projects', available: true },\n      { name: 'Live doubt clearing', available: true },\n      { name: 'Access to real world experts', available: true },\n      { name: 'Community access', available: true },\n    ],\n  },\n};\n"],"mappings":";;AAeA,MAAaA,cAA2B;CACtCC,KAAK;EACHC,IAAI;EACJC,OAAO;EACPC,KAAK;EACLC,SAAS;EACTC,UAAU;GACR;IAAEC,MAAM;IAAoCC,WAAW;IAAK;GAC5D;IAAED,MAAM;IAAuBC,WAAW;IAAK;GAC/C;IAAED,MAAM;IAAeC,WAAW;IAAK;GACvC;IAAED,MAAM;IAAeC,WAAW;IAAK;GACvC;IAAED,MAAM;IAAgBC,WAAW;IAAK;GACxC;IAAED,MAAM;IAAkBC,WAAW;IAAK;GAC1C;IAAED,MAAM;IAA+BC,WAAW;IAAK;GACvD;IAAED,MAAM;IAAmBC,WAAW;IAAK;GAC3C;IAAED,MAAM;IAAeC,WAAW;IAAK;GACxC;EACH;CACA,eAAe;EACbN,IAAI;EACJC,OAAO;EACPC,KAAK;EACLC,SAAS;EACTC,UAAU;GACR;IAAEC,MAAM;IAAoCC,WAAW;IAAK;GAC5D;IAAED,MAAM;IAAuBC,WAAW;IAAK;GAC/C;IAAED,MAAM;IAAeC,WAAW;IAAK;GACvC;IAAED,MAAM;IAAeC,WAAW;IAAK;GACvC;IAAED,MAAM;IAAgBC,WAAW;IAAK;GACxC;IAAED,MAAM;IAAkBC,WAAW;IAAK;GAC1C;IAAED,MAAM;IAA+BC,WAAW;IAAK;GACvD;IAAED,MAAM;IAAeC,WAAW;IAAK;GACxC;EACH;CACA,YAAY;EACVN,IAAI;EACJC,OAAO;EACPC,KAAK;EACLC,SAAS;EACTC,UAAU;GACR;IAAEC,MAAM;IAAoCC,WAAW;IAAK;GAC5D;IAAED,MAAM;IAAuBC,WAAW;IAAK;GAC/C;IAAED,MAAM;IAAeC,WAAW;IAAK;GACvC;IAAED,MAAM;IAAeC,WAAW;IAAK;GACvC;IAAED,MAAM;IAAgBC,WAAW;IAAK;GACxC;IAAED,MAAM;IAAkBC,WAAW;IAAK;GAC1C;IAAED,MAAM;IAA+BC,WAAW;IAAK;GACvD;IAAED,MAAM;IAAmBC,WAAW;IAAK;GAC3C;IAAED,MAAM;IAAeC,WAAW;IAAK;GACxC;EACH;CACA,cAAc;EACZN,IAAI;EACJC,OAAO;EACPC,KAAK;EACLC,SAAS;EACTC,UAAU;GACR;IAAEC,MAAM;IAAoCC,WAAW;IAAK;GAC5D;IAAED,MAAM;IAAuBC,WAAW;IAAK;GAC/C;IAAED,MAAM;IAAeC,WAAW;IAAK;GACvC;IAAED,MAAM;IAAeC,WAAW;IAAK;GACvC;IAAED,MAAM;IAAgBC,WAAW;IAAM;GACzC;IAAED,MAAM;IAAkBC,WAAW;IAAM;GAC3C;IAAED,MAAM;IAA+BC,WAAW;IAAM;GACxD;IAAED,MAAM;IAAmBC,WAAW;IAAM;GAC5C;IAAED,MAAM;IAAeC,WAAW;IAAM;GACzC;EACH;CACA,4BAA4B;EAC1BN,IAAI;EACJC,OAAO;EACPC,KAAK;EACLC,SAAS;EACTC,UAAU;GACR;IAAEC,MAAM;IAA0BC,WAAW;IAAMC,eAAe;IAAK;GACvE;IAAEF,MAAM;IAAqBC,WAAW;IAAK;GAC7C;IAAED,MAAM;IAAuBC,WAAW;IAAK;GAC/C;IAAED,MAAM;IAA2BC,WAAW;IAAK;GACnD;IAAED,MAAM;IAAuBC,WAAW;IAAK;GAC/C;IAAED,MAAM;IAAuBC,WAAW;IAAK;GAC/C;IAAED,MAAM;IAAgCC,WAAW;IAAK;GACxD;IAAED,MAAM;IAAoBC,WAAW;IAAK;GAC7C;EACH;CACF"}