@guardian/support-dotcom-components 0.0.0-beta-20251028082458

package/dist/shared/types/props/design.d.ts

@@ -0,0 +1,164 @@
+import { z } from 'zod';
+export declare const hexColourSchema: z.ZodObject<{
+    r: z.ZodString;
+    g: z.ZodString;
+    b: z.ZodString;
+    kind: z.ZodLiteral<"hex">;
+}, z.core.$strip>;
+export declare const configurableDesignSchema: z.ZodObject<{
+    visual: z.ZodOptional<z.ZodNullable<z.ZodDiscriminatedUnion<[z.ZodObject<{
+        mobileUrl: z.ZodString;
+        tabletUrl: z.ZodString;
+        desktopUrl: z.ZodString;
+        altText: z.ZodString;
+        kind: z.ZodLiteral<"Image">;
+    }, z.core.$strip>, z.ZodObject<{
+        buttonColour: z.ZodOptional<z.ZodNullable<z.ZodObject<{
+            r: z.ZodString;
+            g: z.ZodString;
+            b: z.ZodString;
+            kind: z.ZodLiteral<"hex">;
+        }, z.core.$strip>>>;
+        buttonTextColour: z.ZodOptional<z.ZodNullable<z.ZodObject<{
+            r: z.ZodString;
+            g: z.ZodString;
+            b: z.ZodString;
+            kind: z.ZodLiteral<"hex">;
+        }, z.core.$strip>>>;
+        buttonBorderColour: z.ZodOptional<z.ZodNullable<z.ZodObject<{
+            r: z.ZodString;
+            g: z.ZodString;
+            b: z.ZodString;
+            kind: z.ZodLiteral<"hex">;
+        }, z.core.$strip>>>;
+        buttonSelectColour: z.ZodOptional<z.ZodNullable<z.ZodObject<{
+            r: z.ZodString;
+            g: z.ZodString;
+            b: z.ZodString;
+            kind: z.ZodLiteral<"hex">;
+        }, z.core.$strip>>>;
+        buttonSelectTextColour: z.ZodOptional<z.ZodNullable<z.ZodObject<{
+            r: z.ZodString;
+            g: z.ZodString;
+            b: z.ZodString;
+            kind: z.ZodLiteral<"hex">;
+        }, z.core.$strip>>>;
+        buttonSelectBorderColour: z.ZodOptional<z.ZodNullable<z.ZodObject<{
+            r: z.ZodString;
+            g: z.ZodString;
+            b: z.ZodString;
+            kind: z.ZodLiteral<"hex">;
+        }, z.core.$strip>>>;
+        buttonSelectMarkerColour: z.ZodOptional<z.ZodNullable<z.ZodObject<{
+            r: z.ZodString;
+            g: z.ZodString;
+            b: z.ZodString;
+            kind: z.ZodLiteral<"hex">;
+        }, z.core.$strip>>>;
+        pillTextColour: z.ZodOptional<z.ZodNullable<z.ZodObject<{
+            r: z.ZodString;
+            g: z.ZodString;
+            b: z.ZodString;
+            kind: z.ZodLiteral<"hex">;
+        }, z.core.$strip>>>;
+        pillBackgroundColour: z.ZodOptional<z.ZodNullable<z.ZodObject<{
+            r: z.ZodString;
+            g: z.ZodString;
+            b: z.ZodString;
+            kind: z.ZodLiteral<"hex">;
+        }, z.core.$strip>>>;
+        kind: z.ZodLiteral<"ChoiceCards">;
+    }, z.core.$strip>], "kind">>>;
+    colours: z.ZodObject<{
+        basic: z.ZodObject<{
+            background: z.ZodObject<{
+                r: z.ZodString;
+                g: z.ZodString;
+                b: z.ZodString;
+                kind: z.ZodLiteral<"hex">;
+            }, z.core.$strip>;
+            bodyText: z.ZodObject<{
+                r: z.ZodString;
+                g: z.ZodString;
+                b: z.ZodString;
+                kind: z.ZodLiteral<"hex">;
+            }, z.core.$strip>;
+        }, z.core.$strip>;
+    }, z.core.$strip>;
+}, z.core.$strip>;
+type HexChar = '0' | '1' | '2' | '3' | '4' | '5' | '6' | '7' | '8' | '9' | 'A' | 'B' | 'C' | 'D' | 'E' | 'F';
+type HexValue = `${HexChar}${HexChar}`;
+export interface HexColour {
+    r: HexValue;
+    g: HexValue;
+    b: HexValue;
+    kind: 'hex';
+}
+export declare const hexColourToString: (h: HexColour) => string;
+interface CtaStateDesign {
+    text: HexColour;
+    background: HexColour;
+    border?: HexColour;
+}
+export interface CtaDesign {
+    default: CtaStateDesign;
+}
+interface TickerDesign {
+    filledProgress: HexColour;
+    progressBarBackground: HexColour;
+    headlineColour: HexColour;
+    totalColour: HexColour;
+    goalColour: HexColour;
+}
+export interface BannerDesignHeaderImage {
+    mobileUrl: string;
+    tabletUrl: string;
+    desktopUrl: string;
+    altText: string;
+}
+export interface BannerDesignImage extends BannerDesignHeaderImage {
+    kind: 'Image';
+}
+interface ChoiceCardsDesign {
+    kind: 'ChoiceCards';
+    buttonColour?: HexColour;
+    buttonTextColour?: HexColour;
+    buttonBorderColour?: HexColour;
+    buttonSelectColour?: HexColour;
+    buttonSelectTextColour?: HexColour;
+    buttonSelectBorderColour?: HexColour;
+    buttonSelectMarkerColour?: HexColour;
+    pillTextColour?: HexColour;
+    pillBackgroundColour?: HexColour;
+}
+type Visual = BannerDesignImage | ChoiceCardsDesign;
+type FontSize = 'small' | 'medium' | 'large';
+interface Font {
+    size: FontSize;
+}
+export interface ConfigurableDesign {
+    visual?: Visual;
+    headerImage?: BannerDesignHeaderImage;
+    fonts?: {
+        heading: Font;
+    };
+    colours: {
+        basic: {
+            background: HexColour;
+            bodyText: HexColour;
+            headerText: HexColour;
+            articleCountText: HexColour;
+            logo: HexColour;
+        };
+        highlightedText: {
+            text: HexColour;
+            highlight: HexColour;
+        };
+        primaryCta: CtaDesign;
+        secondaryCta: CtaDesign;
+        closeButton: CtaDesign;
+        ticker: TickerDesign;
+    };
+}
+export {};
+//# sourceMappingURL=design.d.ts.map

package/dist/shared/types/props/design.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"design.d.ts","sourceRoot":"","sources":["../../../../src/shared/types/props/design.ts"],"names":[],"mappings":"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"}

package/dist/shared/types/props/epic.d.ts

@@ -0,0 +1,429 @@
+import type { ComponentEvent } from '@guardian/ophan-tracker-js';
+import { z } from 'zod';
+import type { EpicVariant } from '../abTests';
+import type { ArticleCounts, Stage, Tracking } from './shared';
+export interface EpicProps {
+    variant: EpicVariant;
+    tracking: Tracking;
+    countryCode?: string;
+    articleCounts: ArticleCounts;
+    onReminderOpen?: () => void;
+    fetchEmail?: () => Promise<string | null>;
+    submitComponentEvent?: (componentEvent: ComponentEvent) => Promise<void>;
+    openCmp?: () => void;
+    hasConsentForArticleCount?: boolean;
+    stage?: Stage;
+}
+export declare const contributionFrequencySchema: z.ZodEnum<{
+    ONE_OFF: "ONE_OFF";
+    MONTHLY: "MONTHLY";
+    ANNUAL: "ANNUAL";
+}>;
+export declare const variantSchema: z.ZodObject<{
+    name: z.ZodString;
+    heading: z.ZodOptional<z.ZodString>;
+    paragraphs: z.ZodArray<z.ZodString>;
+    highlightedText: z.ZodOptional<z.ZodString>;
+    tickerSettings: z.ZodOptional<z.ZodObject<{
+        currencySymbol: z.ZodString;
+        copy: z.ZodObject<{
+            countLabel: z.ZodString;
+            goalCopy: z.ZodOptional<z.ZodString>;
+        }, z.core.$strip>;
+        name: z.ZodEnum<{
+            global: "global";
+            US: "US";
+            AU: "AU";
+        }>;
+        tickerData: z.ZodOptional<z.ZodObject<{
+            total: z.ZodNumber;
+            goal: z.ZodNumber;
+        }, z.core.$strip>>;
+    }, z.core.$strip>>;
+    cta: z.ZodOptional<z.ZodObject<{
+        text: z.ZodString;
+        baseUrl: z.ZodString;
+    }, z.core.$strip>>;
+    secondaryCta: z.ZodOptional<z.ZodDiscriminatedUnion<[z.ZodObject<{
+        type: z.ZodLiteral<import("./shared").SecondaryCtaType.Custom>;
+        cta: z.ZodObject<{
+            text: z.ZodString;
+            baseUrl: z.ZodString;
+        }, z.core.$strip>;
+    }, z.core.$strip>, z.ZodObject<{
+        type: z.ZodLiteral<import("./shared").SecondaryCtaType.ContributionsReminder>;
+    }, z.core.$strip>], "type">>;
+    newsletterSignup: z.ZodOptional<z.ZodObject<{
+        newsletterId: z.ZodString;
+        successDescription: z.ZodString;
+    }, z.core.$strip>>;
+    image: z.ZodOptional<z.ZodObject<{
+        mainUrl: z.ZodString;
+        mobileUrl: z.ZodOptional<z.ZodString>;
+        tabletUrl: z.ZodOptional<z.ZodString>;
+        desktopUrl: z.ZodOptional<z.ZodString>;
+        leftColUrl: z.ZodOptional<z.ZodString>;
+        wideUrl: z.ZodOptional<z.ZodString>;
+        altText: z.ZodString;
+    }, z.core.$strip>>;
+    showReminderFields: z.ZodOptional<z.ZodObject<{
+        reminderCta: z.ZodString;
+        reminderLabel: z.ZodString;
+        reminderPeriod: z.ZodString;
+    }, z.core.$strip>>;
+    separateArticleCount: z.ZodOptional<z.ZodObject<{
+        type: z.ZodLiteral<"above">;
+        copy: z.ZodOptional<z.ZodString>;
+        countType: z.ZodOptional<z.ZodEnum<{
+            for52Weeks: "for52Weeks";
+            forTargetedWeeks: "forTargetedWeeks";
+        }>>;
+    }, z.core.$strip>>;
+    promoCodes: z.ZodOptional<z.ZodNullable<z.ZodArray<z.ZodString>>>;
+    maxViews: z.ZodOptional<z.ZodObject<{
+        maxViewsCount: z.ZodNumber;
+        maxViewsDays: z.ZodNumber;
+        minDaysBetweenViews: z.ZodNumber;
+    }, z.core.$strip>>;
+    showSignInLink: z.ZodOptional<z.ZodBoolean>;
+    bylineWithImage: z.ZodOptional<z.ZodObject<{
+        name: z.ZodString;
+        description: z.ZodOptional<z.ZodString>;
+        headshot: z.ZodOptional<z.ZodObject<{
+            mainUrl: z.ZodString;
+            mobileUrl: z.ZodOptional<z.ZodString>;
+            tabletUrl: z.ZodOptional<z.ZodString>;
+            desktopUrl: z.ZodOptional<z.ZodString>;
+            leftColUrl: z.ZodOptional<z.ZodString>;
+            wideUrl: z.ZodOptional<z.ZodString>;
+            altText: z.ZodString;
+        }, z.core.$strip>>;
+    }, z.core.$strip>>;
+    showChoiceCards: z.ZodOptional<z.ZodBoolean>;
+    choiceCardsSettings: z.ZodOptional<z.ZodNullable<z.ZodObject<{
+        choiceCards: z.ZodArray<z.ZodObject<{
+            product: z.ZodDiscriminatedUnion<[z.ZodObject<{
+                supportTier: z.ZodLiteral<"Contribution">;
+                ratePlan: z.ZodUnion<readonly [z.ZodLiteral<"Monthly">, z.ZodLiteral<"Annual">]>;
+            }, z.core.$strip>, z.ZodObject<{
+                supportTier: z.ZodLiteral<"SupporterPlus">;
+                ratePlan: z.ZodUnion<readonly [z.ZodLiteral<"Monthly">, z.ZodLiteral<"Annual">]>;
+            }, z.core.$strip>, z.ZodObject<{
+                supportTier: z.ZodLiteral<"OneOff">;
+            }, z.core.$strip>], "supportTier">;
+            label: z.ZodString;
+            isDefault: z.ZodBoolean;
+            benefitsLabel: z.ZodOptional<z.ZodNullable<z.ZodString>>;
+            benefits: z.ZodArray<z.ZodObject<{
+                copy: z.ZodString;
+            }, z.core.$strip>>;
+            pill: z.ZodOptional<z.ZodNullable<z.ZodObject<{
+                copy: z.ZodString;
+                textColour: z.ZodOptional<z.ZodNullable<z.ZodObject<{
+                    r: z.ZodString;
+                    g: z.ZodString;
+                    b: z.ZodString;
+                    kind: z.ZodLiteral<"hex">;
+                }, z.core.$strip>>>;
+                backgroundColour: z.ZodOptional<z.ZodNullable<z.ZodObject<{
+                    r: z.ZodString;
+                    g: z.ZodString;
+                    b: z.ZodString;
+                    kind: z.ZodLiteral<"hex">;
+                }, z.core.$strip>>>;
+            }, z.core.$strip>>>;
+            destination: z.ZodOptional<z.ZodNullable<z.ZodUnion<readonly [z.ZodLiteral<"LandingPage">, z.ZodLiteral<"Checkout">]>>>;
+        }, z.core.$strip>>;
+        mobileChoiceCards: z.ZodOptional<z.ZodNullable<z.ZodArray<z.ZodObject<{
+            product: z.ZodDiscriminatedUnion<[z.ZodObject<{
+                supportTier: z.ZodLiteral<"Contribution">;
+                ratePlan: z.ZodUnion<readonly [z.ZodLiteral<"Monthly">, z.ZodLiteral<"Annual">]>;
+            }, z.core.$strip>, z.ZodObject<{
+                supportTier: z.ZodLiteral<"SupporterPlus">;
+                ratePlan: z.ZodUnion<readonly [z.ZodLiteral<"Monthly">, z.ZodLiteral<"Annual">]>;
+            }, z.core.$strip>, z.ZodObject<{
+                supportTier: z.ZodLiteral<"OneOff">;
+            }, z.core.$strip>], "supportTier">;
+            label: z.ZodString;
+            isDefault: z.ZodBoolean;
+            benefitsLabel: z.ZodOptional<z.ZodNullable<z.ZodString>>;
+            benefits: z.ZodArray<z.ZodObject<{
+                copy: z.ZodString;
+            }, z.core.$strip>>;
+            pill: z.ZodOptional<z.ZodNullable<z.ZodObject<{
+                copy: z.ZodString;
+                textColour: z.ZodOptional<z.ZodNullable<z.ZodObject<{
+                    r: z.ZodString;
+                    g: z.ZodString;
+                    b: z.ZodString;
+                    kind: z.ZodLiteral<"hex">;
+                }, z.core.$strip>>>;
+                backgroundColour: z.ZodOptional<z.ZodNullable<z.ZodObject<{
+                    r: z.ZodString;
+                    g: z.ZodString;
+                    b: z.ZodString;
+                    kind: z.ZodLiteral<"hex">;
+                }, z.core.$strip>>>;
+            }, z.core.$strip>>>;
+            destination: z.ZodOptional<z.ZodNullable<z.ZodUnion<readonly [z.ZodLiteral<"LandingPage">, z.ZodLiteral<"Checkout">]>>>;
+        }, z.core.$strip>>>>;
+    }, z.core.$strip>>>;
+    choiceCardAmounts: z.ZodOptional<z.ZodObject<{
+        testName: z.ZodString;
+        variantName: z.ZodString;
+        defaultContributionType: z.ZodEnum<{
+            ONE_OFF: "ONE_OFF";
+            MONTHLY: "MONTHLY";
+            ANNUAL: "ANNUAL";
+        }>;
+        displayContributionType: z.ZodArray<z.ZodEnum<{
+            ONE_OFF: "ONE_OFF";
+            MONTHLY: "MONTHLY";
+            ANNUAL: "ANNUAL";
+        }>>;
+        amountsCardData: z.ZodObject<{
+            ONE_OFF: z.ZodObject<{
+                amounts: z.ZodArray<z.ZodNumber>;
+                defaultAmount: z.ZodNumber;
+                hideChooseYourAmount: z.ZodOptional<z.ZodBoolean>;
+            }, z.core.$strip>;
+            MONTHLY: z.ZodObject<{
+                amounts: z.ZodArray<z.ZodNumber>;
+                defaultAmount: z.ZodNumber;
+                hideChooseYourAmount: z.ZodOptional<z.ZodBoolean>;
+            }, z.core.$strip>;
+            ANNUAL: z.ZodObject<{
+                amounts: z.ZodArray<z.ZodNumber>;
+                defaultAmount: z.ZodNumber;
+                hideChooseYourAmount: z.ZodOptional<z.ZodBoolean>;
+            }, z.core.$strip>;
+        }, z.core.$strip>;
+    }, z.core.$strip>>;
+    defaultChoiceCardFrequency: z.ZodOptional<z.ZodEnum<{
+        ONE_OFF: "ONE_OFF";
+        MONTHLY: "MONTHLY";
+        ANNUAL: "ANNUAL";
+    }>>;
+}, z.core.$strip>;
+export declare const epicPropsSchema: z.ZodObject<{
+    variant: z.ZodObject<{
+        name: z.ZodString;
+        heading: z.ZodOptional<z.ZodString>;
+        paragraphs: z.ZodArray<z.ZodString>;
+        highlightedText: z.ZodOptional<z.ZodString>;
+        tickerSettings: z.ZodOptional<z.ZodObject<{
+            currencySymbol: z.ZodString;
+            copy: z.ZodObject<{
+                countLabel: z.ZodString;
+                goalCopy: z.ZodOptional<z.ZodString>;
+            }, z.core.$strip>;
+            name: z.ZodEnum<{
+                global: "global";
+                US: "US";
+                AU: "AU";
+            }>;
+            tickerData: z.ZodOptional<z.ZodObject<{
+                total: z.ZodNumber;
+                goal: z.ZodNumber;
+            }, z.core.$strip>>;
+        }, z.core.$strip>>;
+        cta: z.ZodOptional<z.ZodObject<{
+            text: z.ZodString;
+            baseUrl: z.ZodString;
+        }, z.core.$strip>>;
+        secondaryCta: z.ZodOptional<z.ZodDiscriminatedUnion<[z.ZodObject<{
+            type: z.ZodLiteral<import("./shared").SecondaryCtaType.Custom>;
+            cta: z.ZodObject<{
+                text: z.ZodString;
+                baseUrl: z.ZodString;
+            }, z.core.$strip>;
+        }, z.core.$strip>, z.ZodObject<{
+            type: z.ZodLiteral<import("./shared").SecondaryCtaType.ContributionsReminder>;
+        }, z.core.$strip>], "type">>;
+        newsletterSignup: z.ZodOptional<z.ZodObject<{
+            newsletterId: z.ZodString;
+            successDescription: z.ZodString;
+        }, z.core.$strip>>;
+        image: z.ZodOptional<z.ZodObject<{
+            mainUrl: z.ZodString;
+            mobileUrl: z.ZodOptional<z.ZodString>;
+            tabletUrl: z.ZodOptional<z.ZodString>;
+            desktopUrl: z.ZodOptional<z.ZodString>;
+            leftColUrl: z.ZodOptional<z.ZodString>;
+            wideUrl: z.ZodOptional<z.ZodString>;
+            altText: z.ZodString;
+        }, z.core.$strip>>;
+        showReminderFields: z.ZodOptional<z.ZodObject<{
+            reminderCta: z.ZodString;
+            reminderLabel: z.ZodString;
+            reminderPeriod: z.ZodString;
+        }, z.core.$strip>>;
+        separateArticleCount: z.ZodOptional<z.ZodObject<{
+            type: z.ZodLiteral<"above">;
+            copy: z.ZodOptional<z.ZodString>;
+            countType: z.ZodOptional<z.ZodEnum<{
+                for52Weeks: "for52Weeks";
+                forTargetedWeeks: "forTargetedWeeks";
+            }>>;
+        }, z.core.$strip>>;
+        promoCodes: z.ZodOptional<z.ZodNullable<z.ZodArray<z.ZodString>>>;
+        maxViews: z.ZodOptional<z.ZodObject<{
+            maxViewsCount: z.ZodNumber;
+            maxViewsDays: z.ZodNumber;
+            minDaysBetweenViews: z.ZodNumber;
+        }, z.core.$strip>>;
+        showSignInLink: z.ZodOptional<z.ZodBoolean>;
+        bylineWithImage: z.ZodOptional<z.ZodObject<{
+            name: z.ZodString;
+            description: z.ZodOptional<z.ZodString>;
+            headshot: z.ZodOptional<z.ZodObject<{
+                mainUrl: z.ZodString;
+                mobileUrl: z.ZodOptional<z.ZodString>;
+                tabletUrl: z.ZodOptional<z.ZodString>;
+                desktopUrl: z.ZodOptional<z.ZodString>;
+                leftColUrl: z.ZodOptional<z.ZodString>;
+                wideUrl: z.ZodOptional<z.ZodString>;
+                altText: z.ZodString;
+            }, z.core.$strip>>;
+        }, z.core.$strip>>;
+        showChoiceCards: z.ZodOptional<z.ZodBoolean>;
+        choiceCardsSettings: z.ZodOptional<z.ZodNullable<z.ZodObject<{
+            choiceCards: z.ZodArray<z.ZodObject<{
+                product: z.ZodDiscriminatedUnion<[z.ZodObject<{
+                    supportTier: z.ZodLiteral<"Contribution">;
+                    ratePlan: z.ZodUnion<readonly [z.ZodLiteral<"Monthly">, z.ZodLiteral<"Annual">]>;
+                }, z.core.$strip>, z.ZodObject<{
+                    supportTier: z.ZodLiteral<"SupporterPlus">;
+                    ratePlan: z.ZodUnion<readonly [z.ZodLiteral<"Monthly">, z.ZodLiteral<"Annual">]>;
+                }, z.core.$strip>, z.ZodObject<{
+                    supportTier: z.ZodLiteral<"OneOff">;
+                }, z.core.$strip>], "supportTier">;
+                label: z.ZodString;
+                isDefault: z.ZodBoolean;
+                benefitsLabel: z.ZodOptional<z.ZodNullable<z.ZodString>>;
+                benefits: z.ZodArray<z.ZodObject<{
+                    copy: z.ZodString;
+                }, z.core.$strip>>;
+                pill: z.ZodOptional<z.ZodNullable<z.ZodObject<{
+                    copy: z.ZodString;
+                    textColour: z.ZodOptional<z.ZodNullable<z.ZodObject<{
+                        r: z.ZodString;
+                        g: z.ZodString;
+                        b: z.ZodString;
+                        kind: z.ZodLiteral<"hex">;
+                    }, z.core.$strip>>>;
+                    backgroundColour: z.ZodOptional<z.ZodNullable<z.ZodObject<{
+                        r: z.ZodString;
+                        g: z.ZodString;
+                        b: z.ZodString;
+                        kind: z.ZodLiteral<"hex">;
+                    }, z.core.$strip>>>;
+                }, z.core.$strip>>>;
+                destination: z.ZodOptional<z.ZodNullable<z.ZodUnion<readonly [z.ZodLiteral<"LandingPage">, z.ZodLiteral<"Checkout">]>>>;
+            }, z.core.$strip>>;
+            mobileChoiceCards: z.ZodOptional<z.ZodNullable<z.ZodArray<z.ZodObject<{
+                product: z.ZodDiscriminatedUnion<[z.ZodObject<{
+                    supportTier: z.ZodLiteral<"Contribution">;
+                    ratePlan: z.ZodUnion<readonly [z.ZodLiteral<"Monthly">, z.ZodLiteral<"Annual">]>;
+                }, z.core.$strip>, z.ZodObject<{
+                    supportTier: z.ZodLiteral<"SupporterPlus">;
+                    ratePlan: z.ZodUnion<readonly [z.ZodLiteral<"Monthly">, z.ZodLiteral<"Annual">]>;
+                }, z.core.$strip>, z.ZodObject<{
+                    supportTier: z.ZodLiteral<"OneOff">;
+                }, z.core.$strip>], "supportTier">;
+                label: z.ZodString;
+                isDefault: z.ZodBoolean;
+                benefitsLabel: z.ZodOptional<z.ZodNullable<z.ZodString>>;
+                benefits: z.ZodArray<z.ZodObject<{
+                    copy: z.ZodString;
+                }, z.core.$strip>>;
+                pill: z.ZodOptional<z.ZodNullable<z.ZodObject<{
+                    copy: z.ZodString;
+                    textColour: z.ZodOptional<z.ZodNullable<z.ZodObject<{
+                        r: z.ZodString;
+                        g: z.ZodString;
+                        b: z.ZodString;
+                        kind: z.ZodLiteral<"hex">;
+                    }, z.core.$strip>>>;
+                    backgroundColour: z.ZodOptional<z.ZodNullable<z.ZodObject<{
+                        r: z.ZodString;
+                        g: z.ZodString;
+                        b: z.ZodString;
+                        kind: z.ZodLiteral<"hex">;
+                    }, z.core.$strip>>>;
+                }, z.core.$strip>>>;
+                destination: z.ZodOptional<z.ZodNullable<z.ZodUnion<readonly [z.ZodLiteral<"LandingPage">, z.ZodLiteral<"Checkout">]>>>;
+            }, z.core.$strip>>>>;
+        }, z.core.$strip>>>;
+        choiceCardAmounts: z.ZodOptional<z.ZodObject<{
+            testName: z.ZodString;
+            variantName: z.ZodString;
+            defaultContributionType: z.ZodEnum<{
+                ONE_OFF: "ONE_OFF";
+                MONTHLY: "MONTHLY";
+                ANNUAL: "ANNUAL";
+            }>;
+            displayContributionType: z.ZodArray<z.ZodEnum<{
+                ONE_OFF: "ONE_OFF";
+                MONTHLY: "MONTHLY";
+                ANNUAL: "ANNUAL";
+            }>>;
+            amountsCardData: z.ZodObject<{
+                ONE_OFF: z.ZodObject<{
+                    amounts: z.ZodArray<z.ZodNumber>;
+                    defaultAmount: z.ZodNumber;
+                    hideChooseYourAmount: z.ZodOptional<z.ZodBoolean>;
+                }, z.core.$strip>;
+                MONTHLY: z.ZodObject<{
+                    amounts: z.ZodArray<z.ZodNumber>;
+                    defaultAmount: z.ZodNumber;
+                    hideChooseYourAmount: z.ZodOptional<z.ZodBoolean>;
+                }, z.core.$strip>;
+                ANNUAL: z.ZodObject<{
+                    amounts: z.ZodArray<z.ZodNumber>;
+                    defaultAmount: z.ZodNumber;
+                    hideChooseYourAmount: z.ZodOptional<z.ZodBoolean>;
+                }, z.core.$strip>;
+            }, z.core.$strip>;
+        }, z.core.$strip>>;
+        defaultChoiceCardFrequency: z.ZodOptional<z.ZodEnum<{
+            ONE_OFF: "ONE_OFF";
+            MONTHLY: "MONTHLY";
+            ANNUAL: "ANNUAL";
+        }>>;
+    }, z.core.$strip>;
+    tracking: z.ZodObject<{
+        abTestName: z.ZodString;
+        abTestVariant: z.ZodString;
+        campaignCode: z.ZodString;
+        componentType: z.ZodEnum<{
+            ACQUISITIONS_EPIC: "ACQUISITIONS_EPIC";
+            ACQUISITIONS_ENGAGEMENT_BANNER: "ACQUISITIONS_ENGAGEMENT_BANNER";
+            ACQUISITIONS_HEADER: "ACQUISITIONS_HEADER";
+            ACQUISITIONS_OTHER: "ACQUISITIONS_OTHER";
+            ACQUISITIONS_SUBSCRIPTIONS_BANNER: "ACQUISITIONS_SUBSCRIPTIONS_BANNER";
+        }>;
+        products: z.ZodOptional<z.ZodNullable<z.ZodArray<z.ZodEnum<{
+            CONTRIBUTION: "CONTRIBUTION";
+            MEMBERSHIP_SUPPORTER: "MEMBERSHIP_SUPPORTER";
+            DIGITAL_SUBSCRIPTION: "DIGITAL_SUBSCRIPTION";
+            PRINT_SUBSCRIPTION: "PRINT_SUBSCRIPTION";
+        }>>>>;
+        labels: z.ZodOptional<z.ZodNullable<z.ZodArray<z.ZodString>>>;
+        ophanPageId: z.ZodString;
+        platformId: z.ZodString;
+        referrerUrl: z.ZodString;
+    }, z.core.$strip>;
+    countryCode: z.ZodOptional<z.ZodNullable<z.ZodString>>;
+    articleCounts: z.ZodObject<{
+        for52Weeks: z.ZodNumber;
+        forTargetedWeeks: z.ZodNumber;
+    }, z.core.$strip>;
+    onReminderOpen: z.ZodOptional<z.ZodNullable<z.ZodAny>>;
+    fetchEmail: z.ZodOptional<z.ZodNullable<z.ZodAny>>;
+    submitComponentEvent: z.ZodOptional<z.ZodNullable<z.ZodAny>>;
+    openCmp: z.ZodOptional<z.ZodNullable<z.ZodAny>>;
+    hasConsentForArticleCount: z.ZodOptional<z.ZodNullable<z.ZodBoolean>>;
+    stage: z.ZodOptional<z.ZodNullable<z.ZodString>>;
+}, z.core.$strip>;
+//# sourceMappingURL=epic.d.ts.map

package/dist/shared/types/props/epic.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"epic.d.ts","sourceRoot":"","sources":["../../../../src/shared/types/props/epic.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,4BAA4B,CAAC;AACjE,OAAO,EAAE,CAAC,EAAE,MAAM,KAAK,CAAC;AACxB,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,YAAY,CAAC;AAE9C,OAAO,KAAK,EAAE,aAAa,EAAE,KAAK,EAAE,QAAQ,EAAE,MAAM,UAAU,CAAC;AAY/D,MAAM,WAAW,SAAS;IACtB,OAAO,EAAE,WAAW,CAAC;IACrB,QAAQ,EAAE,QAAQ,CAAC;IACnB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,aAAa,EAAE,aAAa,CAAC;IAC7B,cAAc,CAAC,EAAE,MAAM,IAAI,CAAC;IAC5B,UAAU,CAAC,EAAE,MAAM,OAAO,CAAC,MAAM,GAAG,IAAI,CAAC,CAAC;IAC1C,oBAAoB,CAAC,EAAE,CAAC,cAAc,EAAE,cAAc,KAAK,OAAO,CAAC,IAAI,CAAC,CAAC;IACzE,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,yBAAyB,CAAC,EAAE,OAAO,CAAC;IACpC,KAAK,CAAC,EAAE,KAAK,CAAC;CACjB;AAkBD,eAAO,MAAM,2BAA2B;;;;EAA2C,CAAC;AA+BpF,eAAO,MAAM,aAAa;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;iBAoBxB,CAAC;AAEH,eAAO,MAAM,eAAe;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;iBAW1B,CAAC"}

package/dist/shared/types/props/gutter.d.ts

@@ -0,0 +1,75 @@
+import type { ComponentEvent } from '@guardian/ophan-tracker-js';
+import { z } from 'zod';
+import type { Cta, Image, Tracking } from './shared';
+export interface GutterContent {
+    image: Image;
+    bodyCopy: string[];
+    cta?: Cta;
+}
+export declare const gutterContentSchema: z.ZodObject<{
+    image: z.ZodObject<{
+        mainUrl: z.ZodString;
+        mobileUrl: z.ZodOptional<z.ZodString>;
+        tabletUrl: z.ZodOptional<z.ZodString>;
+        desktopUrl: z.ZodOptional<z.ZodString>;
+        leftColUrl: z.ZodOptional<z.ZodString>;
+        wideUrl: z.ZodOptional<z.ZodString>;
+        altText: z.ZodString;
+    }, z.core.$strip>;
+    bodyCopy: z.ZodArray<z.ZodString>;
+    cta: z.ZodOptional<z.ZodObject<{
+        text: z.ZodString;
+        baseUrl: z.ZodString;
+    }, z.core.$strip>>;
+}, z.core.$strip>;
+export interface GutterProps {
+    content: GutterContent;
+    tracking: Tracking;
+    countryCode?: string;
+    submitComponentEvent?: (componentEvent: ComponentEvent) => Promise<void>;
+    promoCodes?: string[];
+}
+export declare const gutterPropsSchema: z.ZodObject<{
+    content: z.ZodObject<{
+        image: z.ZodObject<{
+            mainUrl: z.ZodString;
+            mobileUrl: z.ZodOptional<z.ZodString>;
+            tabletUrl: z.ZodOptional<z.ZodString>;
+            desktopUrl: z.ZodOptional<z.ZodString>;
+            leftColUrl: z.ZodOptional<z.ZodString>;
+            wideUrl: z.ZodOptional<z.ZodString>;
+            altText: z.ZodString;
+        }, z.core.$strip>;
+        bodyCopy: z.ZodArray<z.ZodString>;
+        cta: z.ZodOptional<z.ZodObject<{
+            text: z.ZodString;
+            baseUrl: z.ZodString;
+        }, z.core.$strip>>;
+    }, z.core.$strip>;
+    tracking: z.ZodObject<{
+        abTestName: z.ZodString;
+        abTestVariant: z.ZodString;
+        campaignCode: z.ZodString;
+        componentType: z.ZodEnum<{
+            ACQUISITIONS_EPIC: "ACQUISITIONS_EPIC";
+            ACQUISITIONS_ENGAGEMENT_BANNER: "ACQUISITIONS_ENGAGEMENT_BANNER";
+            ACQUISITIONS_HEADER: "ACQUISITIONS_HEADER";
+            ACQUISITIONS_OTHER: "ACQUISITIONS_OTHER";
+            ACQUISITIONS_SUBSCRIPTIONS_BANNER: "ACQUISITIONS_SUBSCRIPTIONS_BANNER";
+        }>;
+        products: z.ZodOptional<z.ZodNullable<z.ZodArray<z.ZodEnum<{
+            CONTRIBUTION: "CONTRIBUTION";
+            MEMBERSHIP_SUPPORTER: "MEMBERSHIP_SUPPORTER";
+            DIGITAL_SUBSCRIPTION: "DIGITAL_SUBSCRIPTION";
+            PRINT_SUBSCRIPTION: "PRINT_SUBSCRIPTION";
+        }>>>>;
+        labels: z.ZodOptional<z.ZodNullable<z.ZodArray<z.ZodString>>>;
+        ophanPageId: z.ZodString;
+        platformId: z.ZodString;
+        referrerUrl: z.ZodString;
+    }, z.core.$strip>;
+    countryCode: z.ZodOptional<z.ZodString>;
+    submitComponentEvent: z.ZodAny;
+    promoCodes: z.ZodOptional<z.ZodNullable<z.ZodArray<z.ZodString>>>;
+}, z.core.$strip>;
+//# sourceMappingURL=gutter.d.ts.map

package/dist/shared/types/props/gutter.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"gutter.d.ts","sourceRoot":"","sources":["../../../../src/shared/types/props/gutter.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,4BAA4B,CAAC;AACjE,OAAO,EAAE,CAAC,EAAE,MAAM,KAAK,CAAC;AACxB,OAAO,KAAK,EAAE,GAAG,EAAE,KAAK,EAAE,QAAQ,EAAE,MAAM,UAAU,CAAC;AAGrD,MAAM,WAAW,aAAa;IAC1B,KAAK,EAAE,KAAK,CAAC;IACb,QAAQ,EAAE,MAAM,EAAE,CAAC;IACnB,GAAG,CAAC,EAAE,GAAG,CAAC;CACb;AAED,eAAO,MAAM,mBAAmB;;;;;;;;;;;;;;;iBAI9B,CAAC;AAEH,MAAM,WAAW,WAAW;IACxB,OAAO,EAAE,aAAa,CAAC;IACvB,QAAQ,EAAE,QAAQ,CAAC;IACnB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,oBAAoB,CAAC,EAAE,CAAC,cAAc,EAAE,cAAc,KAAK,OAAO,CAAC,IAAI,CAAC,CAAC;IACzE,UAAU,CAAC,EAAE,MAAM,EAAE,CAAC;CACzB;AAED,eAAO,MAAM,iBAAiB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;iBAM5B,CAAC"}