@edx/frontend-app-subscription-manage 1.0.1 → 1.2.0

package/dist/styles/components/edxUnlimitedBanner.scss

@@ -0,0 +1,138 @@
+
+.edx-banner {
+  background: #0a1628;
+  border-radius: 10px;
+  overflow: hidden;
+  display: flex;
+  align-items: stretch;
+  min-height: 120px;
+  position: relative;
+
+  &__content {
+    flex: 1 1 0;
+    padding: 28px 32px 28px 28px;
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    gap: 10px;
+    z-index: 1;
+  }
+
+  &__eyebrow {
+    display: flex;
+    align-items: center;
+  }
+
+  &__headline {
+    margin: 0;
+    color: #fff;
+    font-size: clamp(1.1rem, 2.2vw, 1.55rem);
+    font-weight: 700;
+    line-height: 1.25;
+    letter-spacing: -0.01em;
+  }
+
+  &__body {
+    margin: 0;
+    color: rgba(255, 255, 255, 0.78);
+    font-size: clamp(0.78rem, 1.3vw, 0.88rem);
+    line-height: 1.55;
+    max-width: 540px;
+  }
+
+  &__cta-wrapper {
+    margin-top: 4px;
+  }
+
+  &__cta {
+    display: inline-block;
+    background: #e2522a;
+    color: #fff;
+    font-weight: 700;
+    font-size: 0.82rem;
+    padding: 9px 20px;
+    border-radius: 6px;
+    text-decoration: none;
+    letter-spacing: 0.01em;
+    transition: background 0.15s;
+    white-space: nowrap;
+
+    &:hover {
+      background: #c94420;
+      color: #fff;
+      text-decoration: none;
+    }
+  }
+
+  &__bullet {
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    width: 28px;
+    height: 28px;
+    border-radius: 50%;
+    background: rgba(255, 255, 255, 0.15);
+    flex-shrink: 0;
+    margin-right: 10px;
+  }
+
+  &__badge {
+    display: inline-flex;
+    align-items: center;
+    gap: 0;
+    vertical-align: middle;
+    position: relative;
+    top: -2px;
+  }
+
+  &__badge-edx {
+    background: #fff;
+    border-radius: 4px 0 0 4px;
+    padding: 2px 5px 2px 6px;
+    font-weight: 800;
+    font-size: 0.78em;
+    letter-spacing: -0.02em;
+    color: #000;
+    line-height: 1.15;
+    font-style: normal;
+  }
+
+  &__badge-unlimited {
+    background: #000;
+    border-radius: 0 4px 4px 0;
+    padding: 2px 6px 2px 4px;
+    font-weight: 600;
+    font-size: 0.64em;
+    letter-spacing: 0.02em;
+    color: #c5b8ff;
+    line-height: 1.15;
+    font-style: normal;
+    text-transform: lowercase;
+  }
+
+  &__photo {
+    flex-shrink: 0;
+    width: clamp(120px, 22%, 240px);
+    position: relative;
+    overflow: hidden;
+
+    img {
+      position: absolute;
+      inset: 0;
+      width: 100%;
+      height: 100%;
+      object-fit: cover;
+      object-position: center top;
+    }
+  }
+
+
+  &__placeholder {
+    flex-shrink: 0;
+    width: clamp(100px, 20%, 200px);
+    background: rgba(255, 255, 255, 0.06);
+    display: flex;
+    align-items: center;
+    justify-content: center;
+  }
+}

package/dist/styles/components/enrollmentSummary.scss

@@ -0,0 +1,13 @@
+.enrolled__banner {
+    div:first-child {
+        border-top-left-radius: var(--pgn-size-border-radius-base);
+        border-top-right-radius: var(--pgn-size-border-radius-base);
+    }
+
+    div:last-child {
+        border: 1px solid var(--pgn-color-light-400);
+        border-top: 0;
+        border-bottom-left-radius: var(--pgn-size-border-radius-base);
+        border-bottom-right-radius: var(--pgn-size-border-radius-base);
+    }
+}

package/dist/styles/components/paymentFields.scss

@@ -0,0 +1,15 @@
+.payment--field {
+    .card__expiry,
+    .card__cvc {
+        width: 10.75rem;
+    }
+
+    .form-control {
+        border-radius: 5px;
+        border: 1px solid #E6E6E6;
+        background: #FFF;
+
+        /* default/box-shadow-default */
+        box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.02), 0 1px 1px 0 rgba(0, 0, 0, 0.03);
+    }
+}

package/dist/styles/components/paymentForm.scss

@@ -0,0 +1,105 @@
+// styles/components/paymentForm.scss
+
+.payment-form {
+  &__heading {
+    font-size: 1.1rem;
+  }
+
+  &__help {
+    a {
+      text-decoration: underline;
+      text-underline-offset: 0.2rem;
+    }
+  }
+
+  // ── Payment method accordion ─────────────────────────────────────────────
+
+  &__method {
+    border-radius: 8px;
+    border: 1px solid #E7E9EF;
+    background: #FFF;
+    overflow: hidden;
+    background: #F6F8FA;
+    &--selected {
+      background-color: white;
+    }
+  }
+
+  // Header row: radio + icon(s) + name — full-width clickable label
+  &__method-header {
+    display: flex;
+    align-items: center;
+    gap: 0.6rem;
+    padding: 0.9rem 1rem;
+    margin: 0;
+    cursor: pointer;
+    width: 100%;
+    font-weight: 600;
+    font-size: 0.95rem;
+  }
+
+  &__radio {
+    flex-shrink: 0;
+    width: 1.1rem;
+    height: 1.1rem;
+    accent-color: #000000;
+    cursor: pointer;
+  }
+
+  &__method-name {
+    flex: 1;
+  }
+
+  // Expanded card panel — no extra heading, just fields
+  &__card-panel {
+    padding: 0 1rem 1rem;
+    background: #fff;
+  }
+
+  // Icon badges for Google Pay / PayPal
+  &__method-icon {
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    width: 1.5rem;
+    height: 1.5rem;
+    border-radius: 4px;
+    color: #fff;
+    font-weight: 800;
+    font-size: 0.7rem;
+    flex-shrink: 0;
+
+    &--gpay {
+      background: #4285f4;
+    }
+
+    &--paypal {
+      background: #003087;
+    }
+  }
+
+  .payment__field--country {
+      select {
+        border-radius: 5px;
+        border: 1px solid #E6E6E6;
+        box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.02), 0 1px 1px 0 rgba(0, 0, 0, 0.03);
+      }
+    }
+
+  // ── Submit button ────────────────────────────────────────────────────────
+  &__submit {
+    border-radius: 2rem;
+    font-weight: 700;
+    padding: 0.75rem 1.5rem;
+  }
+
+  &__terms {
+    line-height: 1.6;
+  }
+}
+
+@media (--pgn-size-breakpoint-min-width-lg) {
+  .payment-form { 
+    padding: 32px;
+  }
+}

package/dist/styles/components/statusScreens.scss

@@ -0,0 +1,29 @@
+// styles/components/successScreen.scss
+
+.success-screen {
+  &__headline {
+    font-size: clamp(1.6rem, 3vw, 2.2rem);
+    color: #1a3a2a; // dark green as in design
+  }
+
+  &__ctas {
+    flex-wrap: wrap;
+    gap: 0.75rem;
+  }
+
+  &__cta-primary {
+    border-radius: 2rem;
+    font-weight: 700;
+    padding: 0.65rem 1.5rem;
+  }
+
+  &__benefits {
+    list-style: disc;
+    padding-left: 1.25rem;
+
+    li {
+      color: var(--gray-700, #495057);
+      line-height: 1.6;
+    }
+  }
+}

package/dist/types.d.ts

@@ -0,0 +1,222 @@
+import type { Status, Phase } from './constants';
+export type { Status, Phase };
+export interface TwouCustomerContact {
+    email?: string;
+}
+export interface TwouCustomerParty {
+    paName: string;
+    indFirstName?: string;
+    indLastName?: string;
+    paContacts: {
+        edges: {
+            node: TwouCustomerContact;
+        }[];
+    };
+}
+export interface TwouCustomer {
+    uid: string;
+    parId: string;
+    parParty: TwouCustomerParty;
+}
+export type GqlRunner = (query: string, variables?: Record<string, unknown>, retry?: boolean) => Promise<any>;
+export interface Cart {
+    biId: string;
+    uid: string;
+}
+export interface CartIds {
+    customerUid: string;
+    salableUid: string;
+    billingPlanUid: string;
+}
+export type BillingCycle = 'monthly' | 'annual';
+export type BillingPeriod = 'MONTHLY' | 'ANNUAL' | 'QUARTERLY' | string;
+export interface BillingPlanOwnershipModel {
+    uid: string;
+    omName: string;
+}
+export interface BillingPlan {
+    uid: string;
+    stripePriceId: string;
+    /** Price amount e.g. "39.99" */
+    amount: string;
+    /** Currency code e.g. "USD" */
+    currency: string;
+    isTemplate: boolean;
+    ownershipModel: BillingPlanOwnershipModel;
+}
+export interface SubscriptionDetails {
+    biId: string;
+    trialStart: string | null;
+    trialEnd: string | null;
+    renewalType: string | null;
+    cardLast4: string | null;
+    cardBrand: string | null;
+    stripePaymentMethodId: string | null;
+    planName: string | null;
+}
+export interface CurrentUserSubscriberResult {
+    isSubscriber: boolean;
+    subscriptionBiId: string | null;
+    status: string | null;
+    subscriptionStartDate: string | null;
+    currentPeriodEnd: string | null;
+}
+/** Course shown on checkout / post-checkout when arriving via ?course_run_key=. */
+export interface CourseDetail {
+    maId: string;
+    maName: string;
+    maDescription: string | null;
+    tShortDescription: string | null;
+    imageUrl: string | null;
+    tCourseKey: string | null;
+    tBrandText: string | null;
+    tPrimarySubjectArea: string | null;
+    tLevelType: string | null;
+    tLanguage: string | null;
+    tPacingType: string | null;
+    tDurationLow: number | null;
+    tDurationHigh: number | null;
+    tDurationUnit: string | null;
+    tEffortLow: number | null;
+    tEffortHigh: number | null;
+    tEffortUnit: string | null;
+    tUrlCourse: string | null;
+    tB2cSubscriptionInclusion: boolean | null;
+    tHasOfacRestrictions: boolean | null;
+    tCatalogActive: boolean | null;
+}
+/** Returned by getBillingPlans — all available plans for the product. */
+export interface BillingPlansResult {
+    plans: BillingPlan[];
+}
+/** Returned by getSalableUid — the product uid and its ownership models. */
+export interface ProductInfo {
+    uid: string;
+    maName: string;
+    ownershipModels: {
+        uid: string;
+        omName: string;
+    }[];
+}
+export interface CartStatusResult {
+    status: Status | null;
+    stripeSubscriptionId: string | null;
+    lastComment: string;
+}
+export interface CartBillingAddress {
+    tFirstName: string;
+    tLastName: string;
+    upaLine1: string;
+    upaCity: string;
+    upaPostcode: string;
+    gadStateOrProvince: string;
+    gadCountry: {
+        iso2Code: string;
+    };
+}
+export interface UpdateCartItemArgs {
+    cartItemUid: string;
+    billingAddress?: CartBillingAddress;
+    paymentMethodId?: string;
+}
+/** Auto-renewal consent captured on TwouCart at checkout confirmation (SUBS-228). */
+export interface CheckoutConsent {
+    /** Main auto-renewal checkbox — always required at submit. */
+    tConsentRecurring: boolean;
+    /** UK/CA resident checkbox; null when that checkbox is not shown. */
+    tConsentUkCa: boolean | null;
+    /** ISO-8601 timestamp when consent was captured. */
+    tConsentAt: string;
+    /** Exact disclosure text shown to the learner (audit trail). */
+    tConsentText: string;
+}
+export interface UpdateCartConsentArgs {
+    cartUid: string;
+    consent: CheckoutConsent;
+}
+export interface BillingInfo {
+    firstName: string;
+    lastName: string;
+    city: string;
+    zip: string;
+    country: string;
+    line1: string;
+    state: string;
+}
+export interface CheckoutClient {
+    gql: GqlRunner;
+    setToken: (token: string) => void;
+    createCart: (vars: CartIds) => Promise<Cart>;
+    getCartItem: (biId: string) => Promise<{
+        cartUid: string;
+        cartItemUid: string;
+    }>;
+    updateCartItem: (args: UpdateCartItemArgs) => Promise<void>;
+    updateCartConsent: (args: UpdateCartConsentArgs) => Promise<void>;
+    placeOrder: (cartUid: string) => Promise<unknown>;
+    getCartStatus: (biId: string) => Promise<CartStatusResult>;
+    findSubscriptionBiId: (biId: string) => Promise<SubscriptionDetails | null>;
+    getSalableUid: (maId: string) => Promise<ProductInfo>;
+    getBillingPlans: () => Promise<BillingPlansResult>;
+    getActiveSubscriptions: () => Promise<{
+        active: number;
+    }>;
+    isCurrentUserSubscriber: () => Promise<CurrentUserSubscriberResult | null>;
+    getCourseDetail: (courseKey: string) => Promise<CourseDetail | null>;
+}
+export interface DevAuth {
+    iamUrl: string;
+    clientId: string;
+    clientSecret: string;
+}
+export interface StripeElementChangeEvent {
+    error?: {
+        message?: string;
+    };
+    [key: string]: unknown;
+}
+export interface StripeElementLike {
+    mount: (node: HTMLElement) => void;
+    on: (event: string, handler: (e: StripeElementChangeEvent) => void) => void;
+    unmount?: () => void;
+}
+export interface StripeElementsLike {
+    create: (type: string, options?: Record<string, unknown>) => StripeElementLike;
+}
+export interface StripeError {
+    message?: string;
+    code?: string;
+}
+export interface PaymentMethodResult {
+    paymentMethod?: {
+        id: string;
+    };
+    error?: StripeError;
+}
+export interface ConfirmResult {
+    error?: StripeError;
+    setupIntent?: unknown;
+    paymentIntent?: unknown;
+}
+export interface CreatePaymentMethodParams {
+    type: 'card';
+    card: StripeElementLike;
+    billing_details?: Record<string, unknown>;
+}
+export interface StripeLike {
+    elements: () => StripeElementsLike;
+    createPaymentMethod: (params: CreatePaymentMethodParams) => Promise<PaymentMethodResult>;
+    confirmCardSetup: (clientSecret: string) => Promise<ConfirmResult>;
+    confirmCardPayment: (clientSecret: string) => Promise<ConfirmResult>;
+}
+declare global {
+    interface Window {
+        Stripe?: (publishableKey: string) => StripeLike;
+    }
+}
+export interface TrialDateRange {
+    /** e.g. "June 22, 2026" */
+    displayStart: string;
+    /** e.g. "June 29, 2026" */
+    displayEnd: string;
+}

package/dist/types.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=types.js.map

package/dist/types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../src/types.ts"],"names":[],"mappings":"","sourcesContent":["import type { Status, Phase } from './constants';\n\nexport type { Status, Phase };\n\n// --- Bootstrap domain --------------------------------------------------------\nexport interface TwouCustomerContact {\n  email?: string,\n}\n\nexport interface TwouCustomerParty {\n  paName: string,\n  indFirstName?: string,\n  indLastName?: string,\n  paContacts: { edges: { node: TwouCustomerContact }[] },\n}\n\nexport interface TwouCustomer {\n  uid: string,\n  parId: string,\n  parParty: TwouCustomerParty,\n}\n\nexport type GqlRunner = (query: string, variables?: Record<string, unknown>, retry?: boolean) => Promise<any>;\n\n// --- Cart domain -------------------------------------------------------------\nexport interface Cart {\n  biId: string,\n  uid: string,\n}\n\nexport interface CartIds {\n  customerUid: string,\n  salableUid: string,\n  billingPlanUid: string,\n}\n\nexport type BillingCycle = 'monthly' | 'annual';\n\nexport type BillingPeriod = 'MONTHLY' | 'ANNUAL' | 'QUARTERLY' | string;\n\nexport interface BillingPlanOwnershipModel {\n  uid: string,\n  omName: string,\n}\n\nexport interface BillingPlan {\n  uid: string,\n  stripePriceId: string,\n  /** Price amount e.g. \"39.99\" */\n  amount: string,\n  /** Currency code e.g. \"USD\" */\n  currency: string,\n  isTemplate: boolean,\n  ownershipModel: BillingPlanOwnershipModel,\n}\n\nexport interface SubscriptionDetails {\n  biId: string, // \"BI301ZDAD6CMICG2\"\n  trialStart: string | null,\n  trialEnd: string | null,\n  renewalType: string | null, // \"Annual\" | \"Monthly\"\n  cardLast4: string | null, // \"4242\"\n  cardBrand: string | null, // \"visa\" | \"mastercard\" etc\n  stripePaymentMethodId: string | null,\n  planName: string | null, // \"Monthly Subscription\"\n}\n\nexport interface CurrentUserSubscriberResult {\n  isSubscriber: boolean,\n  subscriptionBiId: string | null,\n  status: string | null,\n  subscriptionStartDate: string | null,\n  currentPeriodEnd: string | null,\n}\n\n/** Course shown on checkout / post-checkout when arriving via ?course_run_key=. */\nexport interface CourseDetail {\n  maId: string,\n  maName: string,\n  maDescription: string | null,\n  tShortDescription: string | null,\n  imageUrl: string | null,\n  tCourseKey: string | null,\n  tBrandText: string | null,\n  tPrimarySubjectArea: string | null,\n  tLevelType: string | null,\n  tLanguage: string | null,\n  tPacingType: string | null,\n  tDurationLow: number | null,\n  tDurationHigh: number | null,\n  tDurationUnit: string | null,\n  tEffortLow: number | null,\n  tEffortHigh: number | null,\n  tEffortUnit: string | null,\n  tUrlCourse: string | null,\n  tB2cSubscriptionInclusion: boolean | null,\n  tHasOfacRestrictions: boolean | null,\n  tCatalogActive: boolean | null,\n}\n\n/** Returned by getBillingPlans — all available plans for the product. */\nexport interface BillingPlansResult {\n  plans: BillingPlan[],\n}\n\n/** Returned by getSalableUid — the product uid and its ownership models. */\nexport interface ProductInfo {\n  uid: string,\n  maName: string,\n  ownershipModels: { uid: string, omName: string }[],\n}\n\nexport interface CartStatusResult {\n  status: Status | null,\n  stripeSubscriptionId: string | null,\n  lastComment: string,\n}\n\nexport interface CartBillingAddress {\n  tFirstName: string,\n  tLastName: string,\n  upaLine1: string,\n  upaCity: string,\n  upaPostcode: string,\n  gadStateOrProvince: string,\n  gadCountry: { iso2Code: string },\n}\n\nexport interface UpdateCartItemArgs {\n  cartItemUid: string,\n  billingAddress?: CartBillingAddress,\n  paymentMethodId?: string,\n}\n\n/** Auto-renewal consent captured on TwouCart at checkout confirmation (SUBS-228). */\nexport interface CheckoutConsent {\n  /** Main auto-renewal checkbox — always required at submit. */\n  tConsentRecurring: boolean,\n  /** UK/CA resident checkbox; null when that checkbox is not shown. */\n  tConsentUkCa: boolean | null,\n  /** ISO-8601 timestamp when consent was captured. */\n  tConsentAt: string,\n  /** Exact disclosure text shown to the learner (audit trail). */\n  tConsentText: string,\n}\n\nexport interface UpdateCartConsentArgs {\n  cartUid: string,\n  consent: CheckoutConsent,\n}\n\nexport interface BillingInfo {\n  firstName: string,\n  lastName: string,\n  city: string,\n  zip: string,\n  country: string,\n  line1: string,\n  state: string,\n}\n\n// --- Checkout client surface -------------------------------------------------\nexport interface CheckoutClient {\n  gql: GqlRunner,\n  setToken: (token: string) => void,\n  createCart: (vars: CartIds) => Promise<Cart>,\n  getCartItem: (biId: string) => Promise<{ cartUid: string, cartItemUid: string }>,\n  updateCartItem: (args: UpdateCartItemArgs) => Promise<void>,\n  updateCartConsent: (args: UpdateCartConsentArgs) => Promise<void>,\n  placeOrder: (cartUid: string) => Promise<unknown>,\n  getCartStatus: (biId: string) => Promise<CartStatusResult>,\n  findSubscriptionBiId: (biId: string) => Promise<SubscriptionDetails | null>,\n  getSalableUid: (maId: string) => Promise<ProductInfo>,\n  getBillingPlans: () => Promise<BillingPlansResult>,\n  getActiveSubscriptions: () => Promise<{ active: number }>,\n  isCurrentUserSubscriber: () => Promise<CurrentUserSubscriberResult | null>,\n  getCourseDetail: (courseKey: string) => Promise<CourseDetail | null>,\n}\n\nexport interface DevAuth {\n  iamUrl: string,\n  clientId: string,\n  clientSecret: string,\n}\n\n// --- Minimal Stripe.js types -------------------------------------------------\n// Just the surface this module uses. If you depend on `@stripe/stripe-js`,\n// you can replace these with its richer types.\nexport interface StripeElementChangeEvent {\n  error?: { message?: string },\n  [key: string]: unknown,\n}\n\nexport interface StripeElementLike {\n  mount: (node: HTMLElement) => void,\n  on: (event: string, handler: (e: StripeElementChangeEvent) => void) => void,\n  unmount?: () => void,\n}\n\nexport interface StripeElementsLike {\n  create: (type: string, options?: Record<string, unknown>) => StripeElementLike,\n}\n\nexport interface StripeError {\n  message?: string,\n  code?: string,\n}\n\nexport interface PaymentMethodResult {\n  paymentMethod?: { id: string },\n  error?: StripeError,\n}\n\nexport interface ConfirmResult {\n  error?: StripeError,\n  setupIntent?: unknown,\n  paymentIntent?: unknown,\n}\n\nexport interface CreatePaymentMethodParams {\n  type: 'card',\n  card: StripeElementLike,\n  billing_details?: Record<string, unknown>,\n}\n\nexport interface StripeLike {\n  elements: () => StripeElementsLike,\n  createPaymentMethod: (params: CreatePaymentMethodParams) => Promise<PaymentMethodResult>,\n  confirmCardSetup: (clientSecret: string) => Promise<ConfirmResult>,\n  confirmCardPayment: (clientSecret: string) => Promise<ConfirmResult>,\n}\n\ndeclare global {\n  interface Window {\n    Stripe?: (publishableKey: string) => StripeLike,\n  }\n}\n\nexport interface TrialDateRange {\n  /** e.g. \"June 22, 2026\" */\n  displayStart: string,\n  /** e.g. \"June 29, 2026\" */\n  displayEnd: string,\n}\n"]}

package/dist/utils/auth.d.ts

@@ -0,0 +1,7 @@
+import type { CheckoutClient } from '../types';
+interface CheckoutClientConfig {
+    apiUrl: string;
+    confirmIntentUrl?: string;
+}
+export declare function createCheckoutClient({ apiUrl }: CheckoutClientConfig): CheckoutClient;
+export {};

package/dist/utils/auth.js

@@ -0,0 +1,28 @@
+/**
+ * api/index.ts — composes the pieces into a single checkout client and
+ * re-exports the API utilities.
+ */
+import { createGqlClient } from './graphqlClient';
+import * as cart from './cartApi';
+import * as bootstrap from './bootstrapApi';
+export function createCheckoutClient({ apiUrl }) {
+    const { gql, setToken } = createGqlClient({ apiUrl });
+    const fetchStatus = (biId) => cart.getCartStatus(gql, biId);
+    return {
+        gql,
+        setToken,
+        createCart: (vars) => cart.createCart(gql, vars),
+        getCartItem: (biId) => cart.getCartItem(gql, biId),
+        updateCartItem: (args) => cart.updateCartItem(gql, args),
+        updateCartConsent: (args) => cart.updateCartConsent(gql, args),
+        placeOrder: (cartUid) => cart.placeOrder(gql, cartUid),
+        getCartStatus: fetchStatus,
+        findSubscriptionBiId: (biId) => cart.findSubscriptionBiId(gql, biId),
+        getSalableUid: (maId) => bootstrap.getSalableUid(gql, maId),
+        getBillingPlans: () => bootstrap.getBillingPlans(gql),
+        getActiveSubscriptions: () => bootstrap.getActiveSubscriptions(gql),
+        isCurrentUserSubscriber: () => bootstrap.isCurrentUserSubscriber(gql),
+        getCourseDetail: (courseKey) => bootstrap.getCourseDetail(gql, courseKey),
+    };
+}
+//# sourceMappingURL=auth.js.map

package/dist/utils/auth.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"auth.js","sourceRoot":"","sources":["../../src/utils/auth.ts"],"names":[],"mappings":"AAAA;;;GAGG;AACH,OAAO,EAAE,eAAe,EAAE,MAAM,iBAAiB,CAAC;AAClD,OAAO,KAAK,IAAI,MAAM,WAAW,CAAC;AAClC,OAAO,KAAK,SAAS,MAAM,gBAAgB,CAAC;AAU5C,MAAM,UAAU,oBAAoB,CAClC,EAAE,MAAM,EAAwB;IAEhC,MAAM,EAAE,GAAG,EAAE,QAAQ,EAAE,GAAG,eAAe,CAAC,EAAE,MAAM,EAAE,CAAC,CAAC;IACtD,MAAM,WAAW,GAAG,CAAC,IAAY,EAAE,EAAE,CAAC,IAAI,CAAC,aAAa,CAAC,GAAG,EAAE,IAAI,CAAC,CAAC;IAEpE,OAAO;QACL,GAAG;QACH,QAAQ;QACR,UAAU,EAAE,CAAC,IAAa,EAAE,EAAE,CAAC,IAAI,CAAC,UAAU,CAAC,GAAG,EAAE,IAAI,CAAC;QACzD,WAAW,EAAE,CAAC,IAAI,EAAE,EAAE,CAAC,IAAI,CAAC,WAAW,CAAC,GAAG,EAAE,IAAI,CAAC;QAClD,cAAc,EAAE,CAAC,IAAwB,EAAE,EAAE,CAAC,IAAI,CAAC,cAAc,CAAC,GAAG,EAAE,IAAI,CAAC;QAC5E,iBAAiB,EAAE,CAAC,IAA2B,EAAE,EAAE,CAAC,IAAI,CAAC,iBAAiB,CAAC,GAAG,EAAE,IAAI,CAAC;QACrF,UAAU,EAAE,CAAC,OAAO,EAAE,EAAE,CAAC,IAAI,CAAC,UAAU,CAAC,GAAG,EAAE,OAAO,CAAC;QACtD,aAAa,EAAE,WAAW;QAC1B,oBAAoB,EAAE,CAAC,IAAI,EAAE,EAAE,CAAC,IAAI,CAAC,oBAAoB,CAAC,GAAG,EAAE,IAAI,CAAC;QACpE,aAAa,EAAE,CAAC,IAAI,EAAE,EAAE,CAAC,SAAS,CAAC,aAAa,CAAC,GAAG,EAAE,IAAI,CAAC;QAC3D,eAAe,EAAE,GAAG,EAAE,CAAC,SAAS,CAAC,eAAe,CAAC,GAAG,CAAC;QACrD,sBAAsB,EAAE,GAAG,EAAE,CAAC,SAAS,CAAC,sBAAsB,CAAC,GAAG,CAAC;QACnE,uBAAuB,EAAE,GAAG,EAAE,CAAC,SAAS,CAAC,uBAAuB,CAAC,GAAG,CAAC;QACrE,eAAe,EAAE,CAAC,SAAS,EAAE,EAAE,CAAC,SAAS,CAAC,eAAe,CAAC,GAAG,EAAE,SAAS,CAAC;KAC1E,CAAC;AACJ,CAAC","sourcesContent":["/**\n * api/index.ts — composes the pieces into a single checkout client and\n * re-exports the API utilities.\n */\nimport { createGqlClient } from './graphqlClient';\nimport * as cart from './cartApi';\nimport * as bootstrap from './bootstrapApi';\nimport type {\n  CheckoutClient, CartIds, UpdateCartItemArgs, UpdateCartConsentArgs,\n} from '../types';\n\ninterface CheckoutClientConfig {\n  apiUrl: string,\n  confirmIntentUrl?: string,\n}\n\nexport function createCheckoutClient(\n  { apiUrl }: CheckoutClientConfig,\n): CheckoutClient {\n  const { gql, setToken } = createGqlClient({ apiUrl });\n  const fetchStatus = (biId: string) => cart.getCartStatus(gql, biId);\n\n  return {\n    gql,\n    setToken,\n    createCart: (vars: CartIds) => cart.createCart(gql, vars),\n    getCartItem: (biId) => cart.getCartItem(gql, biId),\n    updateCartItem: (args: UpdateCartItemArgs) => cart.updateCartItem(gql, args),\n    updateCartConsent: (args: UpdateCartConsentArgs) => cart.updateCartConsent(gql, args),\n    placeOrder: (cartUid) => cart.placeOrder(gql, cartUid),\n    getCartStatus: fetchStatus,\n    findSubscriptionBiId: (biId) => cart.findSubscriptionBiId(gql, biId),\n    getSalableUid: (maId) => bootstrap.getSalableUid(gql, maId),\n    getBillingPlans: () => bootstrap.getBillingPlans(gql),\n    getActiveSubscriptions: () => bootstrap.getActiveSubscriptions(gql),\n    isCurrentUserSubscriber: () => bootstrap.isCurrentUserSubscriber(gql),\n    getCourseDetail: (courseKey) => bootstrap.getCourseDetail(gql, courseKey),\n  };\n}\n"]}

package/dist/utils/billingDetails.d.ts

@@ -0,0 +1,30 @@
+import type { BillingPlan, BillingCycle } from '../types';
+export interface PlanPrice {
+    uid: string;
+    stripePriceId: string;
+    amount: string;
+    currency: string;
+    label: string;
+}
+/**
+ * getPlanPrice — returns the price for the selected billing cycle.
+ *
+ * Matches plans by looking for "annual"/"year" or "month" in omName.
+ * Falls back to the first plan if no match is found.
+ *
+ * @example
+ *   getPlanPrice(billingPlans, 'monthly')
+ *   // → { uid: '...', amount: '11', currency: 'USD', label: '$11 USD/month' }
+ *
+ *   getPlanPrice(billingPlans, 'annual')
+ *   // → { uid: '...', amount: '111', currency: 'USD', label: '$111 USD/year' }
+ */
+export declare function getPlanPrice(plans: BillingPlan[], cycle: BillingCycle): PlanPrice | null;
+/**
+ * getRenewalLabel — returns a "Then $X/month" style label for CartSummary.
+ *
+ * @example
+ *   getRenewalLabel(billingPlans, 'monthly') // → "Then $11 USD/month"
+ *   getRenewalLabel(billingPlans, 'annual')  // → "Then $111 USD/year"
+ */
+export declare function getRenewalLabel(plans: BillingPlan[], cycle: BillingCycle): string;

package/dist/utils/billingDetails.js

@@ -0,0 +1,47 @@
+/**
+ * getPlanPrice — returns the price for the selected billing cycle.
+ *
+ * Matches plans by looking for "annual"/"year" or "month" in omName.
+ * Falls back to the first plan if no match is found.
+ *
+ * @example
+ *   getPlanPrice(billingPlans, 'monthly')
+ *   // → { uid: '...', amount: '11', currency: 'USD', label: '$11 USD/month' }
+ *
+ *   getPlanPrice(billingPlans, 'annual')
+ *   // → { uid: '...', amount: '111', currency: 'USD', label: '$111 USD/year' }
+ */
+export function getPlanPrice(plans, cycle) {
+    var _a;
+    if (!plans.length)
+        return null;
+    const isAnnual = cycle === 'annual';
+    const match = (_a = plans.find((p) => {
+        var _a, _b;
+        const name = (_b = (_a = p.ownershipModel.omName) === null || _a === void 0 ? void 0 : _a.toLowerCase()) !== null && _b !== void 0 ? _b : '';
+        return isAnnual
+            ? name.includes('annual') || name.includes('year')
+            : name.includes('month');
+    })) !== null && _a !== void 0 ? _a : plans[0];
+    return {
+        uid: match.uid,
+        stripePriceId: match.stripePriceId,
+        amount: match.amount,
+        currency: match.currency,
+        label: `$${match.amount} ${match.currency}/${isAnnual ? 'year' : 'month'}`,
+    };
+}
+/**
+ * getRenewalLabel — returns a "Then $X/month" style label for CartSummary.
+ *
+ * @example
+ *   getRenewalLabel(billingPlans, 'monthly') // → "Then $11 USD/month"
+ *   getRenewalLabel(billingPlans, 'annual')  // → "Then $111 USD/year"
+ */
+export function getRenewalLabel(plans, cycle) {
+    const price = getPlanPrice(plans, cycle);
+    if (!price)
+        return '';
+    return `Then $${price.amount} ${price.currency}/${cycle === 'annual' ? 'year' : 'month'}`;
+}
+//# sourceMappingURL=billingDetails.js.map

package/dist/utils/billingDetails.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"billingDetails.js","sourceRoot":"","sources":["../../src/utils/billingDetails.ts"],"names":[],"mappings":"AAUA;;;;;;;;;;;;GAYG;AACH,MAAM,UAAU,YAAY,CAC1B,KAAoB,EACpB,KAAmB;;IAEnB,IAAI,CAAC,KAAK,CAAC,MAAM;QAAE,OAAO,IAAI,CAAC;IAE/B,MAAM,QAAQ,GAAG,KAAK,KAAK,QAAQ,CAAC;IAEpC,MAAM,KAAK,GAAG,MAAA,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,EAAE;;QAC7B,MAAM,IAAI,GAAG,MAAA,MAAA,CAAC,CAAC,cAAc,CAAC,MAAM,0CAAE,WAAW,EAAE,mCAAI,EAAE,CAAC;QAC1D,OAAO,QAAQ;YACb,CAAC,CAAC,IAAI,CAAC,QAAQ,CAAC,QAAQ,CAAC,IAAI,IAAI,CAAC,QAAQ,CAAC,MAAM,CAAC;YAClD,CAAC,CAAC,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,CAAC;IAC7B,CAAC,CAAC,mCAAI,KAAK,CAAC,CAAC,CAAC,CAAC;IAEf,OAAO;QACL,GAAG,EAAE,KAAK,CAAC,GAAG;QACd,aAAa,EAAE,KAAK,CAAC,aAAa;QAClC,MAAM,EAAE,KAAK,CAAC,MAAM;QACpB,QAAQ,EAAE,KAAK,CAAC,QAAQ;QACxB,KAAK,EAAE,IAAI,KAAK,CAAC,MAAM,IAAI,KAAK,CAAC,QAAQ,IAAI,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,OAAO,EAAE;KAC3E,CAAC;AACJ,CAAC;AAED;;;;;;GAMG;AACH,MAAM,UAAU,eAAe,CAC7B,KAAoB,EACpB,KAAmB;IAEnB,MAAM,KAAK,GAAG,YAAY,CAAC,KAAK,EAAE,KAAK,CAAC,CAAC;IACzC,IAAI,CAAC,KAAK;QAAE,OAAO,EAAE,CAAC;IACtB,OAAO,SAAS,KAAK,CAAC,MAAM,IAAI,KAAK,CAAC,QAAQ,IAAI,KAAK,KAAK,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,OAAO,EAAE,CAAC;AAC5F,CAAC","sourcesContent":["import type { BillingPlan, BillingCycle } from '../types';\n\nexport interface PlanPrice {\n  uid: string,\n  stripePriceId: string,\n  amount: string,\n  currency: string,\n  label: string, // e.g. \"$11 USD/month\"\n}\n\n/**\n * getPlanPrice — returns the price for the selected billing cycle.\n *\n * Matches plans by looking for \"annual\"/\"year\" or \"month\" in omName.\n * Falls back to the first plan if no match is found.\n *\n * @example\n *   getPlanPrice(billingPlans, 'monthly')\n *   // → { uid: '...', amount: '11', currency: 'USD', label: '$11 USD/month' }\n *\n *   getPlanPrice(billingPlans, 'annual')\n *   // → { uid: '...', amount: '111', currency: 'USD', label: '$111 USD/year' }\n */\nexport function getPlanPrice(\n  plans: BillingPlan[],\n  cycle: BillingCycle,\n): PlanPrice | null {\n  if (!plans.length) return null;\n\n  const isAnnual = cycle === 'annual';\n\n  const match = plans.find((p) => {\n    const name = p.ownershipModel.omName?.toLowerCase() ?? '';\n    return isAnnual\n      ? name.includes('annual') || name.includes('year')\n      : name.includes('month');\n  }) ?? plans[0];\n\n  return {\n    uid: match.uid,\n    stripePriceId: match.stripePriceId,\n    amount: match.amount,\n    currency: match.currency,\n    label: `$${match.amount} ${match.currency}/${isAnnual ? 'year' : 'month'}`,\n  };\n}\n\n/**\n * getRenewalLabel — returns a \"Then $X/month\" style label for CartSummary.\n *\n * @example\n *   getRenewalLabel(billingPlans, 'monthly') // → \"Then $11 USD/month\"\n *   getRenewalLabel(billingPlans, 'annual')  // → \"Then $111 USD/year\"\n */\nexport function getRenewalLabel(\n  plans: BillingPlan[],\n  cycle: BillingCycle,\n): string {\n  const price = getPlanPrice(plans, cycle);\n  if (!price) return '';\n  return `Then $${price.amount} ${price.currency}/${cycle === 'annual' ? 'year' : 'month'}`;\n}\n"]}