@stigg/react-sdk 7.7.1-beta.1 → 7.8.0

package/dist/src/components/checkout/planHeader/PlanHeader.d.ts

@@ -0,0 +1,6 @@
+import { CheckoutContainerProps } from '../CheckoutContainer';
+type PlanHeaderProps = {
+    allowChangePlan?: boolean;
+} & Pick<CheckoutContainerProps, 'onChangePlan'>;
+export declare function PlanHeader({ allowChangePlan, onChangePlan }: PlanHeaderProps): JSX.Element;
+export {};

package/dist/src/components/checkout/planHeader/index.d.ts

@@ -0,0 +1 @@
+export * from './PlanHeader';

package/dist/src/components/checkout/progressBar/CheckoutProgressBar.d.ts

@@ -0,0 +1 @@
+export declare const CheckoutProgressBar: () => JSX.Element | null;

package/dist/src/components/checkout/progressBar/CheckoutProgressBar.style.d.ts

@@ -0,0 +1,17 @@
+/// <reference types="react" />
+export declare const StyledProgress: import('@emotion/styled').StyledComponent<import('@mui/material/LinearProgress').LinearProgressProps & {
+    theme?: import('@emotion/react').Theme | undefined;
+} & {
+    $disabled?: boolean | undefined;
+}, {}, {}>;
+export declare const StyledStepButton: import('@emotion/styled').StyledComponent<import('@mui/material/Button').ButtonOwnProps & Omit<import('@mui/material').ButtonBaseOwnProps, "classes"> & import('@mui/material/OverridableComponent').CommonProps & Omit<Pick<import('react').DetailedHTMLProps<import('react').ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "key" | keyof import('react').ButtonHTMLAttributes<HTMLButtonElement>> & {
+    ref?: ((instance: HTMLButtonElement | null) => void) | import('react').RefObject<HTMLButtonElement> | null | undefined;
+}, "style" | "href" | "className" | "tabIndex" | "color" | "children" | "disabled" | "action" | "size" | "variant" | "classes" | "centerRipple" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "onFocusVisible" | "sx" | "TouchRippleProps" | "touchRippleRef" | "disableElevation" | "disableFocusRipple" | "endIcon" | "fullWidth" | "startIcon"> & {
+    theme?: import('@emotion/react').Theme | undefined;
+}, {}, {}>;
+export declare const StyledIcon: import('@emotion/styled').StyledComponent<import('../../common/Icon').IconProps & {
+    theme?: import('@emotion/react').Theme | undefined;
+} & {
+    $disabled?: boolean | undefined;
+    $shouldFill?: boolean | undefined;
+}, {}, {}>;

package/dist/src/components/checkout/promotionCode/AddPromotionCode.d.ts

@@ -0,0 +1,2 @@
+import { PromotionCodeSectionProps } from './PromotionCodeSection';
+export declare const AddPromotionCode: ({ disabled, checkoutLocalization, onMockCheckoutPreview, }: PromotionCodeSectionProps) => JSX.Element;

package/dist/src/components/checkout/promotionCode/AddPromotionCodeButton.d.ts

@@ -0,0 +1,7 @@
+import { CheckoutLocalization } from '../configurations/textOverrides';
+export type AddPromotionCodeButtonProps = {
+    onAddClick: () => void;
+    checkoutLocalization: CheckoutLocalization;
+    disabled: boolean;
+};
+export declare const AddPromotionCodeButton: ({ onAddClick, checkoutLocalization, disabled }: AddPromotionCodeButtonProps) => JSX.Element;

package/dist/src/components/checkout/promotionCode/AppliedPromotionCode.d.ts

@@ -0,0 +1,10 @@
+export declare const StyledIcon: import('@emotion/styled').StyledComponent<import('../../common/Icon').IconProps & {
+    theme?: import('@emotion/react').Theme | undefined;
+} & {
+    $shouldFill?: boolean | undefined;
+}, {}, {}>;
+export type AppliedPromotionCodeProps = {
+    promotionCode: string;
+    onClearPromotionCode: () => void;
+};
+export declare const AppliedPromotionCode: ({ promotionCode, onClearPromotionCode }: AppliedPromotionCodeProps) => JSX.Element;

package/dist/src/components/checkout/promotionCode/PromotionCodeSection.d.ts

@@ -0,0 +1,8 @@
+import { CheckoutLocalization } from '../configurations/textOverrides';
+import { MockCheckoutPreviewCallback } from '../types';
+export type PromotionCodeSectionProps = {
+    disabled: boolean;
+    checkoutLocalization: CheckoutLocalization;
+    onMockCheckoutPreview?: MockCheckoutPreviewCallback;
+};
+export declare const PromotionCodeSection: ({ disabled, checkoutLocalization, onMockCheckoutPreview, }: PromotionCodeSectionProps) => JSX.Element;

package/dist/src/components/checkout/promotionCode/index.d.ts

@@ -0,0 +1 @@
+export * from './PromotionCodeSection';

package/dist/src/components/checkout/steps/addons/CheckoutAddonsStep.d.ts

@@ -0,0 +1,4 @@
+import { OnAddonChangeCallback } from '../../types';
+export declare function CheckoutAddonsStep({ onAddonChange }: {
+    onAddonChange?: OnAddonChangeCallback;
+}): JSX.Element;

package/dist/src/components/checkout/steps/addons/CheckoutAddonsStep.style.d.ts

@@ -0,0 +1,18 @@
+/// <reference types="react" />
+export declare const CheckoutAddonsContainer: import('@emotion/styled').StyledComponent<import('@mui/material/Grid').GridOwnProps & import('@mui/material/OverridableComponent').CommonProps & Omit<Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "key" | keyof import('react').HTMLAttributes<HTMLDivElement>> & {
+    ref?: ((instance: HTMLDivElement | null) => void) | import('react').RefObject<HTMLDivElement> | null | undefined;
+}, "p" | "style" | "className" | "color" | "children" | "height" | "width" | "alignContent" | "alignItems" | "alignSelf" | "bottom" | "boxShadow" | "boxSizing" | "columnGap" | "direction" | "display" | "flexBasis" | "flexDirection" | "flexGrow" | "flexShrink" | "flexWrap" | "fontFamily" | "fontSize" | "fontStyle" | "fontWeight" | "gridAutoColumns" | "gridAutoFlow" | "gridAutoRows" | "gridTemplateAreas" | "gridTemplateColumns" | "gridTemplateRows" | "justifyContent" | "justifyItems" | "justifySelf" | "left" | "letterSpacing" | "lineHeight" | "marginBottom" | "marginLeft" | "marginRight" | "marginTop" | "maxHeight" | "maxWidth" | "minHeight" | "minWidth" | "order" | "paddingBottom" | "paddingLeft" | "paddingRight" | "paddingTop" | "position" | "right" | "rowGap" | "textAlign" | "textOverflow" | "textTransform" | "top" | "visibility" | "whiteSpace" | "zIndex" | "border" | "borderBottom" | "borderColor" | "borderLeft" | "borderRadius" | "borderRight" | "borderTop" | "columns" | "flex" | "gap" | "gridArea" | "gridColumn" | "gridRow" | "margin" | "overflow" | "padding" | "typography" | "spacing" | "m" | "classes" | "sx" | "container" | "bgcolor" | "mt" | "mr" | "mb" | "ml" | "mx" | "marginX" | "my" | "marginY" | "pt" | "pr" | "pb" | "pl" | "px" | "paddingX" | "py" | "paddingY" | "displayPrint" | "wrap" | "xs" | "sm" | "md" | "lg" | "xl" | "columnSpacing" | "item" | "rowSpacing" | "zeroMinWidth"> & {
+    theme?: import('@emotion/react').Theme | undefined;
+}, {}, {}>;
+export declare const AddonListItemContainer: import('@emotion/styled').StyledComponent<import('@mui/material/Grid').GridOwnProps & import('@mui/material/OverridableComponent').CommonProps & Omit<Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "key" | keyof import('react').HTMLAttributes<HTMLDivElement>> & {
+    ref?: ((instance: HTMLDivElement | null) => void) | import('react').RefObject<HTMLDivElement> | null | undefined;
+}, "p" | "style" | "className" | "color" | "children" | "height" | "width" | "alignContent" | "alignItems" | "alignSelf" | "bottom" | "boxShadow" | "boxSizing" | "columnGap" | "direction" | "display" | "flexBasis" | "flexDirection" | "flexGrow" | "flexShrink" | "flexWrap" | "fontFamily" | "fontSize" | "fontStyle" | "fontWeight" | "gridAutoColumns" | "gridAutoFlow" | "gridAutoRows" | "gridTemplateAreas" | "gridTemplateColumns" | "gridTemplateRows" | "justifyContent" | "justifyItems" | "justifySelf" | "left" | "letterSpacing" | "lineHeight" | "marginBottom" | "marginLeft" | "marginRight" | "marginTop" | "maxHeight" | "maxWidth" | "minHeight" | "minWidth" | "order" | "paddingBottom" | "paddingLeft" | "paddingRight" | "paddingTop" | "position" | "right" | "rowGap" | "textAlign" | "textOverflow" | "textTransform" | "top" | "visibility" | "whiteSpace" | "zIndex" | "border" | "borderBottom" | "borderColor" | "borderLeft" | "borderRadius" | "borderRight" | "borderTop" | "columns" | "flex" | "gap" | "gridArea" | "gridColumn" | "gridRow" | "margin" | "overflow" | "padding" | "typography" | "spacing" | "m" | "classes" | "sx" | "container" | "bgcolor" | "mt" | "mr" | "mb" | "ml" | "mx" | "marginX" | "my" | "marginY" | "pt" | "pr" | "pb" | "pl" | "px" | "paddingX" | "py" | "paddingY" | "displayPrint" | "wrap" | "xs" | "sm" | "md" | "lg" | "xl" | "columnSpacing" | "item" | "rowSpacing" | "zeroMinWidth"> & {
+    theme?: import('@emotion/react').Theme | undefined;
+}, {}, {}>;
+export declare const TrashButton: import('@emotion/styled').StyledComponent<import('@mui/material').ButtonOwnProps & Omit<import('@mui/material').ButtonBaseOwnProps, "classes"> & import('@mui/material/OverridableComponent').CommonProps & Omit<Pick<import('react').DetailedHTMLProps<import('react').ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "key" | keyof import('react').ButtonHTMLAttributes<HTMLButtonElement>> & {
+    ref?: ((instance: HTMLButtonElement | null) => void) | import('react').RefObject<HTMLButtonElement> | null | undefined;
+}, "style" | "href" | "className" | "tabIndex" | "color" | "children" | "disabled" | "action" | "size" | "variant" | "classes" | "centerRipple" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "onFocusVisible" | "sx" | "TouchRippleProps" | "touchRippleRef" | "disableElevation" | "disableFocusRipple" | "endIcon" | "fullWidth" | "startIcon"> & {
+    component?: import('react').ElementType<any> | undefined;
+} & import('../../components').StyledButtonProps & {
+    theme?: import('@emotion/react').Theme | undefined;
+}, {}, {}>;

package/dist/src/components/checkout/steps/addons/addon.utils.d.ts

@@ -0,0 +1,15 @@
+import { Addon, BillingPeriod, Currency, SubscriptionAddon } from '@stigg/js-client-sdk';
+type FilterAddonsBaseProps = {
+    billingPeriod?: BillingPeriod;
+    currency: Currency;
+    billingCountryCode?: string;
+};
+export declare const sortAddons: (addons: Addon[]) => Addon[];
+export declare const sortSubscriptionAddons: (addons: SubscriptionAddon[]) => SubscriptionAddon[];
+export declare function filterAddons({ addons, billingCountryCode, currency, }: {
+    addons?: Addon[];
+} & FilterAddonsBaseProps): Addon[];
+export declare function filterSubscriptionAddons({ addons, billingPeriod, billingCountryCode, currency, }: {
+    addons?: SubscriptionAddon[];
+} & FilterAddonsBaseProps): SubscriptionAddon[];
+export {};

package/dist/src/components/checkout/steps/addons/components/AddonInputContainer.d.ts

@@ -0,0 +1,15 @@
+import { CheckoutLocalization } from '../../../configurations/textOverrides';
+import { Addon, SubscriptionAddon } from '@stigg/js-client-sdk';
+type AddonInputContainerProps = {
+    addon: Addon;
+    addonState?: SubscriptionAddon;
+    hasChanges: boolean;
+    errorMessage?: string;
+    isPriceForBillingPeriodAvailable: boolean;
+    checkoutLocalization: CheckoutLocalization;
+    handleQuantityChange: (quantity?: number | null) => Promise<void>;
+    handleUndo: () => Promise<void>;
+    handleRemoveAddon: () => Promise<void>;
+};
+export declare function AddonInputContainer({ addon, addonState, hasChanges, errorMessage, isPriceForBillingPeriodAvailable, checkoutLocalization, handleQuantityChange, handleUndo, handleRemoveAddon, }: AddonInputContainerProps): JSX.Element;
+export {};

package/dist/src/components/checkout/steps/addons/components/AddonTextContainer.d.ts

@@ -0,0 +1,9 @@
+import { CheckoutLocalization } from '../../../configurations/textOverrides';
+import { Addon, BillingPeriod } from '@stigg/js-client-sdk';
+type AddonTextContainerProps = {
+    addon: Addon;
+    billingPeriod: BillingPeriod;
+    checkoutLocalization: CheckoutLocalization;
+};
+export declare function AddonTextContainer({ addon, billingPeriod, checkoutLocalization }: AddonTextContainerProps): JSX.Element;
+export {};

package/dist/src/components/checkout/steps/addons/index.d.ts

@@ -0,0 +1 @@
+export * from './CheckoutAddonsStep';

package/dist/src/components/checkout/steps/payment/PaymentMethods.d.ts

@@ -0,0 +1,19 @@
+import { Customer } from '@stigg/js-client-sdk';
+import { CheckoutLocalization } from '../../configurations/textOverrides';
+import { CheckoutContainerProps } from '../../CheckoutContainer';
+export type PaymentMethodLayoutProps = {
+    checked: boolean;
+    text: React.ReactNode;
+    subtitle?: React.ReactNode;
+    readOnly?: boolean;
+};
+export type PaymentMethodProps = Pick<Customer, 'paymentMethodDetails'> & Pick<PaymentMethodLayoutProps, 'checked' | 'readOnly'> & {
+    onSelect: () => void;
+};
+export type NewPaymentMethodProps = Pick<PaymentMethodLayoutProps, 'checked' | 'readOnly'> & {
+    onSelect: () => void;
+    checkoutLocalization: CheckoutLocalization;
+    hasExistingPaymentMethod: boolean;
+} & Pick<CheckoutContainerProps, 'onBillingAddressChange' | 'collectPhoneNumber' | 'onCheckout' | 'onCheckoutCompleted'>;
+export declare function ExistingPaymentMethod({ checked, paymentMethodDetails, readOnly, onSelect }: PaymentMethodProps): JSX.Element | null;
+export declare function NewPaymentMethod({ hasExistingPaymentMethod, checked, onSelect, readOnly, checkoutLocalization, onBillingAddressChange, collectPhoneNumber, onCheckout, onCheckoutCompleted, }: NewPaymentMethodProps): JSX.Element;

package/dist/src/components/checkout/steps/payment/PaymentMethods.style.d.ts

@@ -0,0 +1,27 @@
+/// <reference types="react" />
+export declare const PaymentMethodContainer: import('@emotion/styled').StyledComponent<import('@mui/material/Grid').GridOwnProps & import('@mui/material/OverridableComponent').CommonProps & Omit<Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "key" | keyof import('react').HTMLAttributes<HTMLDivElement>> & {
+    ref?: ((instance: HTMLDivElement | null) => void) | import('react').RefObject<HTMLDivElement> | null | undefined;
+}, "p" | "style" | "className" | "color" | "children" | "height" | "width" | "alignContent" | "alignItems" | "alignSelf" | "bottom" | "boxShadow" | "boxSizing" | "columnGap" | "direction" | "display" | "flexBasis" | "flexDirection" | "flexGrow" | "flexShrink" | "flexWrap" | "fontFamily" | "fontSize" | "fontStyle" | "fontWeight" | "gridAutoColumns" | "gridAutoFlow" | "gridAutoRows" | "gridTemplateAreas" | "gridTemplateColumns" | "gridTemplateRows" | "justifyContent" | "justifyItems" | "justifySelf" | "left" | "letterSpacing" | "lineHeight" | "marginBottom" | "marginLeft" | "marginRight" | "marginTop" | "maxHeight" | "maxWidth" | "minHeight" | "minWidth" | "order" | "paddingBottom" | "paddingLeft" | "paddingRight" | "paddingTop" | "position" | "right" | "rowGap" | "textAlign" | "textOverflow" | "textTransform" | "top" | "visibility" | "whiteSpace" | "zIndex" | "border" | "borderBottom" | "borderColor" | "borderLeft" | "borderRadius" | "borderRight" | "borderTop" | "columns" | "flex" | "gap" | "gridArea" | "gridColumn" | "gridRow" | "margin" | "overflow" | "padding" | "typography" | "spacing" | "m" | "classes" | "sx" | "container" | "bgcolor" | "mt" | "mr" | "mb" | "ml" | "mx" | "marginX" | "my" | "marginY" | "pt" | "pr" | "pb" | "pl" | "px" | "paddingX" | "py" | "paddingY" | "displayPrint" | "wrap" | "xs" | "sm" | "md" | "lg" | "xl" | "columnSpacing" | "item" | "rowSpacing" | "zeroMinWidth"> & {
+    theme?: import('@emotion/react').Theme | undefined;
+} & {
+    $disabled?: boolean | undefined;
+}, {}, {}>;
+export declare const NewPaymentMethodContainer: import('@emotion/styled').StyledComponent<import('@mui/material/Grid').GridOwnProps & import('@mui/material/OverridableComponent').CommonProps & Omit<Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "key" | keyof import('react').HTMLAttributes<HTMLDivElement>> & {
+    ref?: ((instance: HTMLDivElement | null) => void) | import('react').RefObject<HTMLDivElement> | null | undefined;
+}, "p" | "style" | "className" | "color" | "children" | "height" | "width" | "alignContent" | "alignItems" | "alignSelf" | "bottom" | "boxShadow" | "boxSizing" | "columnGap" | "direction" | "display" | "flexBasis" | "flexDirection" | "flexGrow" | "flexShrink" | "flexWrap" | "fontFamily" | "fontSize" | "fontStyle" | "fontWeight" | "gridAutoColumns" | "gridAutoFlow" | "gridAutoRows" | "gridTemplateAreas" | "gridTemplateColumns" | "gridTemplateRows" | "justifyContent" | "justifyItems" | "justifySelf" | "left" | "letterSpacing" | "lineHeight" | "marginBottom" | "marginLeft" | "marginRight" | "marginTop" | "maxHeight" | "maxWidth" | "minHeight" | "minWidth" | "order" | "paddingBottom" | "paddingLeft" | "paddingRight" | "paddingTop" | "position" | "right" | "rowGap" | "textAlign" | "textOverflow" | "textTransform" | "top" | "visibility" | "whiteSpace" | "zIndex" | "border" | "borderBottom" | "borderColor" | "borderLeft" | "borderRadius" | "borderRight" | "borderTop" | "columns" | "flex" | "gap" | "gridArea" | "gridColumn" | "gridRow" | "margin" | "overflow" | "padding" | "typography" | "spacing" | "m" | "classes" | "sx" | "container" | "bgcolor" | "mt" | "mr" | "mb" | "ml" | "mx" | "marginX" | "my" | "marginY" | "pt" | "pr" | "pb" | "pl" | "px" | "paddingX" | "py" | "paddingY" | "displayPrint" | "wrap" | "xs" | "sm" | "md" | "lg" | "xl" | "columnSpacing" | "item" | "rowSpacing" | "zeroMinWidth"> & {
+    theme?: import('@emotion/react').Theme | undefined;
+} & {
+    $disabled?: boolean | undefined;
+} & {
+    $hideBorders?: boolean | undefined;
+}, {}, {}>;
+export declare const PaymentMethodLayoutContainer: import('@emotion/styled').StyledComponent<import('@mui/material/Grid').GridOwnProps & import('@mui/material/OverridableComponent').CommonProps & Omit<Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "key" | keyof import('react').HTMLAttributes<HTMLDivElement>> & {
+    ref?: ((instance: HTMLDivElement | null) => void) | import('react').RefObject<HTMLDivElement> | null | undefined;
+}, "p" | "style" | "className" | "color" | "children" | "height" | "width" | "alignContent" | "alignItems" | "alignSelf" | "bottom" | "boxShadow" | "boxSizing" | "columnGap" | "direction" | "display" | "flexBasis" | "flexDirection" | "flexGrow" | "flexShrink" | "flexWrap" | "fontFamily" | "fontSize" | "fontStyle" | "fontWeight" | "gridAutoColumns" | "gridAutoFlow" | "gridAutoRows" | "gridTemplateAreas" | "gridTemplateColumns" | "gridTemplateRows" | "justifyContent" | "justifyItems" | "justifySelf" | "left" | "letterSpacing" | "lineHeight" | "marginBottom" | "marginLeft" | "marginRight" | "marginTop" | "maxHeight" | "maxWidth" | "minHeight" | "minWidth" | "order" | "paddingBottom" | "paddingLeft" | "paddingRight" | "paddingTop" | "position" | "right" | "rowGap" | "textAlign" | "textOverflow" | "textTransform" | "top" | "visibility" | "whiteSpace" | "zIndex" | "border" | "borderBottom" | "borderColor" | "borderLeft" | "borderRadius" | "borderRight" | "borderTop" | "columns" | "flex" | "gap" | "gridArea" | "gridColumn" | "gridRow" | "margin" | "overflow" | "padding" | "typography" | "spacing" | "m" | "classes" | "sx" | "container" | "bgcolor" | "mt" | "mr" | "mb" | "ml" | "mx" | "marginX" | "my" | "marginY" | "pt" | "pr" | "pb" | "pl" | "px" | "paddingX" | "py" | "paddingY" | "displayPrint" | "wrap" | "xs" | "sm" | "md" | "lg" | "xl" | "columnSpacing" | "item" | "rowSpacing" | "zeroMinWidth"> & {
+    theme?: import('@emotion/react').Theme | undefined;
+}, {}, {}>;
+export declare const PaymentMethodTextContainer: import('@emotion/styled').StyledComponent<import('@mui/material/Grid').GridOwnProps & import('@mui/material/OverridableComponent').CommonProps & Omit<Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "key" | keyof import('react').HTMLAttributes<HTMLDivElement>> & {
+    ref?: ((instance: HTMLDivElement | null) => void) | import('react').RefObject<HTMLDivElement> | null | undefined;
+}, "p" | "style" | "className" | "color" | "children" | "height" | "width" | "alignContent" | "alignItems" | "alignSelf" | "bottom" | "boxShadow" | "boxSizing" | "columnGap" | "direction" | "display" | "flexBasis" | "flexDirection" | "flexGrow" | "flexShrink" | "flexWrap" | "fontFamily" | "fontSize" | "fontStyle" | "fontWeight" | "gridAutoColumns" | "gridAutoFlow" | "gridAutoRows" | "gridTemplateAreas" | "gridTemplateColumns" | "gridTemplateRows" | "justifyContent" | "justifyItems" | "justifySelf" | "left" | "letterSpacing" | "lineHeight" | "marginBottom" | "marginLeft" | "marginRight" | "marginTop" | "maxHeight" | "maxWidth" | "minHeight" | "minWidth" | "order" | "paddingBottom" | "paddingLeft" | "paddingRight" | "paddingTop" | "position" | "right" | "rowGap" | "textAlign" | "textOverflow" | "textTransform" | "top" | "visibility" | "whiteSpace" | "zIndex" | "border" | "borderBottom" | "borderColor" | "borderLeft" | "borderRadius" | "borderRight" | "borderTop" | "columns" | "flex" | "gap" | "gridArea" | "gridColumn" | "gridRow" | "margin" | "overflow" | "padding" | "typography" | "spacing" | "m" | "classes" | "sx" | "container" | "bgcolor" | "mt" | "mr" | "mb" | "ml" | "mx" | "marginX" | "my" | "marginY" | "pt" | "pr" | "pb" | "pl" | "px" | "paddingX" | "py" | "paddingY" | "displayPrint" | "wrap" | "xs" | "sm" | "md" | "lg" | "xl" | "columnSpacing" | "item" | "rowSpacing" | "zeroMinWidth"> & {
+    theme?: import('@emotion/react').Theme | undefined;
+}, {}, {}>;

package/dist/src/components/checkout/steps/payment/PaymentStep.d.ts

@@ -0,0 +1,2 @@
+import { CheckoutContainerProps } from '../../CheckoutContainer';
+export declare function PaymentStep({ onBillingAddressChange, collectPhoneNumber, onCheckout, onCheckoutCompleted, }: Pick<CheckoutContainerProps, 'onBillingAddressChange' | 'collectPhoneNumber' | 'onCheckout' | 'onCheckoutCompleted'>): JSX.Element;

package/dist/src/components/checkout/steps/payment/index.d.ts

@@ -0,0 +1 @@
+export * from './PaymentStep';

package/dist/src/components/checkout/steps/payment/stripe/StripePaymentForm.d.ts

@@ -0,0 +1,2 @@
+import { CheckoutContainerProps } from '../../../CheckoutContainer';
+export declare function StripePaymentForm({ onBillingAddressChange, collectPhoneNumber, }: Pick<CheckoutContainerProps, 'onBillingAddressChange' | 'collectPhoneNumber'>): JSX.Element;

package/dist/src/components/checkout/steps/payment/stripe/index.d.ts

@@ -0,0 +1,3 @@
+export * from './StripePaymentForm';
+export * from './useStripeIntegration';
+export * from './useSubmit';

package/dist/src/components/checkout/steps/payment/stripe/stripe.utils.d.ts

@@ -0,0 +1,33 @@
+import { ApplySubscriptionResults } from '@stigg/js-client-sdk';
+import { Stripe, StripeElements } from '@stripe/stripe-js';
+type StripeElementsProps = {
+    stripe: Stripe | null;
+    elements: StripeElements | null;
+};
+export declare function handleStripeFormValidations({ elements }: Pick<StripeElementsProps, 'elements'>): Promise<{
+    success: boolean;
+    errorMessage: string;
+} | {
+    success: boolean;
+    errorMessage?: undefined;
+}>;
+export declare function handleStripeNextAction({ applySubscriptionResults, stripe, }: {
+    applySubscriptionResults: ApplySubscriptionResults;
+    stripe: Stripe | null;
+}): Promise<{
+    errorMessage: string;
+    subscription?: undefined;
+} | {
+    subscription: import('@stigg/js-client-sdk').Subscription | undefined;
+    errorMessage?: undefined;
+}>;
+export declare function handleNewPaymentMethod({ stripe, elements, setupIntentClientSecret, }: {
+    stripe: Stripe | null;
+    elements: StripeElements | null;
+    setupIntentClientSecret?: string;
+}): Promise<{
+    success: boolean;
+    errorMessage?: string;
+    paymentMethodId?: string;
+}>;
+export {};

package/dist/src/components/checkout/steps/payment/stripe/useStripeIntegration.d.ts

@@ -0,0 +1,5 @@
+import { Stripe } from '@stripe/stripe-js';
+export declare function useStripeIntegration(): {
+    stripePromise: Promise<Stripe | null> | null;
+    setupIntentClientSecret: string | undefined;
+};

package/dist/src/components/checkout/steps/payment/stripe/useSubmit.d.ts

@@ -0,0 +1,15 @@
+import { ApplySubscriptionResults } from '@stigg/js-client-sdk';
+import { CheckoutContainerProps } from '../../../CheckoutContainer';
+export type HandleSubmitResult = {
+    results?: ApplySubscriptionResults;
+    success: boolean;
+    errorMessage?: string;
+};
+export type UseSubmitProps = {
+    onSuccess?: () => void;
+    isMocked?: boolean;
+} & Pick<CheckoutContainerProps, 'onCheckout' | 'onCheckoutCompleted' | 'disableSuccessAnimation'>;
+export declare function useSubmit({ isMocked, onCheckout, onCheckoutCompleted, onSuccess, disableSuccessAnimation, }: UseSubmitProps): {
+    handleSubmit: (e: any) => Promise<HandleSubmitResult>;
+    isLoading: boolean;
+};

package/dist/src/components/checkout/steps/payment/zuora/ZuoraPaymentForm.d.ts

@@ -0,0 +1,2 @@
+import { CheckoutContainerProps } from '../../../CheckoutContainer';
+export declare function ZuoraPaymentForm({ onCheckout, onCheckoutCompleted, }: Pick<CheckoutContainerProps, 'onCheckout' | 'onCheckoutCompleted'>): JSX.Element | null;

package/dist/src/components/checkout/steps/payment/zuora/index.d.ts

@@ -0,0 +1,4 @@
+export { ZuoraPaymentForm } from './ZuoraPaymentForm';
+export { useZuoraIntegration } from './useZuoraIntegration';
+export { isZuoraLibraryAvailable, loadZuoraLibrary, createZuoraPaymentFormConfig } from './zuora.utils';
+export type { ZuoraInstance, ZuoraPaymentFormConfig, ZuoraPaymentForm as ZuoraPaymentFormType, ZuoraPaymentResult, } from './zuora.utils';

package/dist/src/components/checkout/steps/payment/zuora/useZuoraIntegration.d.ts

@@ -0,0 +1,5 @@
+export declare function useZuoraIntegration(): {
+    isZuoraIntegration: boolean;
+    isInitialized: boolean;
+    createPaymentSession: () => Promise<string>;
+};

package/dist/src/components/checkout/steps/payment/zuora/useZuoraSubmit.d.ts

@@ -0,0 +1,11 @@
+import { CheckoutContainerProps } from '../../../CheckoutContainer';
+export type ZuoraSubmitResult = {
+    success: boolean;
+    errorMessage?: string;
+};
+export type UseZuoraSubmitProps = {
+    onSuccess?: () => void;
+} & Pick<CheckoutContainerProps, 'onCheckout' | 'onCheckoutCompleted' | 'disableSuccessAnimation'>;
+export declare function useZuoraSubmit({ onCheckout, onCheckoutCompleted, onSuccess, disableSuccessAnimation, }: UseZuoraSubmitProps): {
+    handleZuoraSubmit: (paymentMethodId?: string) => Promise<ZuoraSubmitResult>;
+};

package/dist/src/components/checkout/steps/payment/zuora/zuora.utils.d.ts

@@ -0,0 +1,34 @@
+import { Currency } from '@stigg/js-client-sdk';
+declare global {
+    interface Window {
+        Zuora: (publishableKey: string) => ZuoraInstance;
+    }
+}
+export type ZuoraInstance = {
+    createPaymentForm: (config: ZuoraPaymentFormConfig) => Promise<ZuoraPaymentForm>;
+};
+export type ZuoraPaymentFormConfig = {
+    locale?: string;
+    region?: string;
+    currency?: string;
+    amount?: string;
+    profile?: string;
+    createPaymentSession: () => Promise<string>;
+    onComplete: (result: ZuoraPaymentResult) => Promise<void>;
+};
+export type ZuoraPaymentForm = {
+    mount: (containerId: string) => void;
+};
+export type ZuoraPaymentResult = {
+    success: boolean;
+    paymentMethodId?: string;
+    paymentId?: string;
+    error?: {
+        type: string;
+        code: string;
+        message: string;
+    };
+};
+export declare function isZuoraLibraryAvailable(): boolean;
+export declare function loadZuoraLibrary(): void;
+export declare function createZuoraPaymentFormConfig(createPaymentSession: () => Promise<string>, onComplete: (result: ZuoraPaymentResult) => Promise<void>, currency: Currency, billingCountryCode?: string): ZuoraPaymentFormConfig;

package/dist/src/components/checkout/steps/plan/BillingPeriodPicker.d.ts

@@ -0,0 +1,8 @@
+import { Plan } from '@stigg/js-client-sdk';
+import { CheckoutLocalization } from '../../configurations/textOverrides';
+type BillingPeriodPickerProps = {
+    plan?: Plan;
+    checkoutLocalization: CheckoutLocalization;
+};
+export declare function BillingPeriodPicker({ plan, checkoutLocalization }: BillingPeriodPickerProps): JSX.Element | null;
+export {};

package/dist/src/components/checkout/steps/plan/BillingPeriodPicker.style.d.ts

@@ -0,0 +1,28 @@
+/// <reference types="react" />
+export declare const BillingPeriodPickerContainer: import('@emotion/styled').StyledComponent<import('@mui/system').BoxOwnProps<import('@mui/material').Theme> & Omit<Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "key" | keyof import('react').HTMLAttributes<HTMLDivElement>> & {
+    ref?: ((instance: HTMLDivElement | null) => void) | import('react').RefObject<HTMLDivElement> | null | undefined;
+}, keyof import('@mui/system').BoxOwnProps<import('@mui/material').Theme>> & {
+    theme?: import('@emotion/react').Theme | undefined;
+}, {}, {}>;
+export declare const BillingPeriodButton: import('@emotion/styled').StyledComponent<{
+    theme?: import('@emotion/react').Theme | undefined;
+    as?: import('react').ElementType<any> | undefined;
+} & {
+    $isActive?: boolean | undefined;
+    $disabled?: boolean | undefined;
+    $isOnlyBillingPeriod?: boolean | undefined;
+}, import('react').DetailedHTMLProps<import('react').ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, {}>;
+export declare const BillingPeriodOptions: import('@emotion/styled').StyledComponent<import('@mui/system').BoxOwnProps<import('@mui/material').Theme> & Omit<Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "key" | keyof import('react').HTMLAttributes<HTMLDivElement>> & {
+    ref?: ((instance: HTMLDivElement | null) => void) | import('react').RefObject<HTMLDivElement> | null | undefined;
+}, keyof import('@mui/system').BoxOwnProps<import('@mui/material').Theme>> & {
+    theme?: import('@emotion/react').Theme | undefined;
+}, {}, {}>;
+export declare const BillingPeriodPrice: import('@emotion/styled').StyledComponent<{
+    theme?: import('@emotion/react').Theme | undefined;
+    as?: import('react').ElementType<any> | undefined;
+}, import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const DiscountChip: import('@emotion/styled').StyledComponent<import('@mui/material/Chip').ChipOwnProps & import('@mui/material/OverridableComponent').CommonProps & Omit<Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "key" | keyof import('react').HTMLAttributes<HTMLDivElement>> & {
+    ref?: ((instance: HTMLDivElement | null) => void) | import('react').RefObject<HTMLDivElement> | null | undefined;
+}, "label" | "style" | "className" | "tabIndex" | "color" | "children" | "disabled" | "size" | "variant" | "icon" | "classes" | "sx" | "avatar" | "clickable" | "deleteIcon" | "onDelete" | "skipFocusWhenDisabled"> & {
+    theme?: import('@emotion/react').Theme | undefined;
+}, {}, {}>;

package/dist/src/components/checkout/steps/plan/CheckoutChargeList.d.ts

@@ -0,0 +1,22 @@
+import { BillableFeatureInput } from '@stigg/api-client-js/src/generated/sdk';
+import { BillingPeriod, Plan, Price } from '@stigg/js-client-sdk';
+import { usePlanStepModel } from '../../hooks';
+import { OnBillableFeatureChangeCallback } from '../../types';
+export type UsePlanStepModel = ReturnType<typeof usePlanStepModel>;
+type CheckoutChargeListProps = {
+    plan?: Plan;
+    billingPeriod: BillingPeriod;
+    onBillableFeatureChange?: OnBillableFeatureChangeCallback;
+};
+export declare function PlanCharge({ charge, setBillableFeature, billableFeature, onValidationChange, onBillableFeatureChange, }: {
+    charge: Price;
+    billableFeature?: BillableFeatureInput;
+    setBillableFeature: UsePlanStepModel['setBillableFeature'];
+    onValidationChange: ({ featureId, isValid }: {
+        featureId: string;
+        isValid: boolean;
+    }) => void;
+    onBillableFeatureChange?: OnBillableFeatureChangeCallback;
+}): JSX.Element;
+export declare function CheckoutChargeList({ plan, billingPeriod, onBillableFeatureChange }: CheckoutChargeListProps): JSX.Element;
+export {};

package/dist/src/components/checkout/steps/plan/CheckoutPlanStep.d.ts

@@ -0,0 +1,2 @@
+import { CheckoutContainerProps } from '../../CheckoutContainer';
+export declare const CheckoutPlanStep: ({ onChangePlan, onBillableFeatureChange, }: Pick<CheckoutContainerProps, 'onChangePlan' | 'onBillableFeatureChange'>) => JSX.Element;

package/dist/src/components/checkout/steps/plan/CheckoutPlanStep.style.d.ts

@@ -0,0 +1,6 @@
+/// <reference types="react" />
+export declare const CheckoutPlanContainer: import('@emotion/styled').StyledComponent<import('@mui/system').BoxOwnProps<import('@mui/material').Theme> & Omit<Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "key" | keyof import('react').HTMLAttributes<HTMLDivElement>> & {
+    ref?: ((instance: HTMLDivElement | null) => void) | import('react').RefObject<HTMLDivElement> | null | undefined;
+}, keyof import('@mui/system').BoxOwnProps<import('@mui/material').Theme>> & {
+    theme?: import('@emotion/react').Theme | undefined;
+}, {}, {}>;

package/dist/src/components/checkout/steps/plan/index.d.ts

@@ -0,0 +1 @@
+export * from './CheckoutPlanStep';

package/dist/src/components/checkout/summary/CheckoutSuccess.d.ts

@@ -0,0 +1,5 @@
+import { CheckoutLocalization } from '../configurations/textOverrides';
+export declare const ANIMATION_DURATION = 5000;
+export declare function CheckoutSuccess({ checkoutLocalization }: {
+    checkoutLocalization: CheckoutLocalization;
+}): JSX.Element;

package/dist/src/components/checkout/summary/CheckoutSummary.d.ts

@@ -0,0 +1,15 @@
+import { CheckoutContainerProps } from '../CheckoutContainer';
+export declare const SummaryContainer: import('@emotion/styled').StyledComponent<import('@mui/system').BoxOwnProps<import('@mui/material').Theme> & Omit<Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "key" | keyof import('react').HTMLAttributes<HTMLDivElement>> & {
+    ref?: ((instance: HTMLDivElement | null) => void) | import('react').RefObject<HTMLDivElement> | null | undefined;
+}, keyof import('@mui/system').BoxOwnProps<import('@mui/material').Theme>> & {
+    theme?: import('@emotion/react').Theme | undefined;
+}, {}, {}>;
+export declare const SummaryCard: import('@emotion/styled').StyledComponent<import('@mui/material/Paper').PaperOwnProps & import('@mui/material/OverridableComponent').CommonProps & Omit<Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "key" | keyof import('react').HTMLAttributes<HTMLDivElement>> & {
+    ref?: ((instance: HTMLDivElement | null) => void) | import('react').RefObject<HTMLDivElement> | null | undefined;
+}, "style" | "className" | "children" | "variant" | "classes" | "sx" | "square" | "elevation"> & {
+    theme?: import('@emotion/react').Theme | undefined;
+}, {}, {}>;
+export declare const CheckoutSummary: ({ onCheckout, onCheckoutCompleted, disablePromotionCode, disableSuccessAnimation, isFreeDowngrade, onMockCheckoutPreview, showWatermark, }: CheckoutContainerProps & {
+    isFreeDowngrade: boolean;
+    showWatermark: boolean;
+}) => JSX.Element;

package/dist/src/components/checkout/summary/CheckoutSummarySkeleton.d.ts

@@ -0,0 +1,3 @@
+export declare const CheckoutSummarySkeleton: ({ showWatermark }: {
+    showWatermark: boolean;
+}) => JSX.Element;

package/dist/src/components/checkout/summary/components/CheckoutCaptions.d.ts

@@ -0,0 +1,11 @@
+import { BillingPeriod, Plan, Subscription, SubscriptionPreviewV2 } from '@stigg/js-client-sdk';
+import { CheckoutLocalization } from '../../configurations/textOverrides';
+export type CheckoutCaptionProps = {
+    subscriptionPreview?: SubscriptionPreviewV2 | null;
+    isFetchingSubscriptionPreview: boolean;
+    activeSubscription?: Subscription | null;
+    plan?: Plan;
+    checkoutLocalization: CheckoutLocalization;
+    billingPeriod: BillingPeriod;
+};
+export declare function CheckoutCaptions(props: CheckoutCaptionProps): JSX.Element;

package/dist/src/components/checkout/summary/components/GraduatedPriceBreakdown.d.ts

@@ -0,0 +1,6 @@
+import { Price } from '@stigg/js-client-sdk';
+export type GraduatedPriceBreakdownProps = {
+    price: Price;
+    unitQuantity: number;
+};
+export declare function GraduatedPriceBreakdown({ price, unitQuantity }: GraduatedPriceBreakdownProps): JSX.Element | null;

package/dist/src/components/checkout/summary/components/LineItems.d.ts

@@ -0,0 +1,37 @@
+import { Price, SubscriptionPreviewInvoice, SubscriptionPreviewV2 } from '@stigg/js-client-sdk';
+import { CheckoutLocalization } from '../../configurations/textOverrides';
+export declare const LineItemContainer: import('@emotion/styled').StyledComponent<{
+    theme?: import('@emotion/react').Theme | undefined;
+    as?: import('react').ElementType<any> | undefined;
+}, import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const NestedBreakdownContainer: import('@emotion/styled').StyledComponent<{
+    theme?: import('@emotion/react').Theme | undefined;
+    as?: import('react').ElementType<any> | undefined;
+}, import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const LineItemRow: import('@emotion/styled').StyledComponent<{
+    theme?: import('@emotion/react').Theme | undefined;
+    as?: import('react').ElementType<any> | undefined;
+}, import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const BilledPriceLineItem: ({ checkoutLocalization, label, quantity, price, }: {
+    checkoutLocalization: CheckoutLocalization;
+    label: string;
+    quantity: number;
+    price: Price;
+}) => JSX.Element;
+export declare const FreeChargeLineItem: ({ label }: {
+    label: string;
+}) => JSX.Element;
+export declare const DiscountLineItem: ({ subscriptionPreview, isFetchingSubscriptionPreview, checkoutLocalization, }: {
+    subscriptionPreview: SubscriptionPreviewV2;
+    isFetchingSubscriptionPreview: boolean;
+    checkoutLocalization: CheckoutLocalization;
+}) => JSX.Element | null;
+export declare const AppliedCreditsLineItem: ({ subscriptionPreview, isFetchingSubscriptionPreview, checkoutLocalization, }: {
+    subscriptionPreview: SubscriptionPreviewV2 | null;
+    isFetchingSubscriptionPreview: boolean;
+    checkoutLocalization: CheckoutLocalization;
+}) => JSX.Element | null;
+export declare const TaxLineItem: ({ tax, taxDetails, isFetchingSubscriptionPreview, checkoutLocalization, }: {
+    isFetchingSubscriptionPreview: boolean;
+    checkoutLocalization: CheckoutLocalization;
+} & Pick<SubscriptionPreviewInvoice, "taxDetails" | "tax">) => JSX.Element | null;

package/dist/src/components/checkout/summary/components/WithSkeleton.d.ts

@@ -0,0 +1,6 @@
+import { FC, PropsWithChildren } from 'react';
+export declare const WithSkeleton: FC<PropsWithChildren<{
+    isLoading: boolean;
+    width?: number | string;
+    height?: number | string;
+}>>;

package/dist/src/components/checkout/summary/components/getPriceBreakdownString.d.ts

@@ -0,0 +1,15 @@
+import { BillingModel, BillingPeriod, Currency, Price } from '@stigg/js-client-sdk';
+export type GetPriceBreakdownStringProps = {
+    totalAmount: number;
+    quantity: number;
+    tiersMode: Price['tiersMode'];
+    tiers: Price['tiers'];
+    currency: Currency;
+    pricingModel: BillingModel;
+    billingPeriod: BillingPeriod;
+    blockSize?: number | null;
+    priceAmount?: Price['amount'];
+    availableBillingPeriods?: Set<BillingPeriod>;
+};
+export declare function formatPricePerUnit({ quantity, totalAmount, pricingModel, billingPeriod, currency, blockSize, priceAmount, availableBillingPeriods, }: GetPriceBreakdownStringProps): string;
+export declare function getPriceBreakdownString(params: GetPriceBreakdownStringProps): string;

package/dist/src/components/checkout/summary/index.d.ts

@@ -0,0 +1,2 @@
+export * from './CheckoutSummary';
+export * from './CheckoutSummarySkeleton';