@bunnyapp/components 1.8.0-beta.56 → 1.8.0-beta.58

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@bunnyapp/components",
-  "version": "1.8.0-beta.56",
+  "version": "1.8.0-beta.58",
   "description": "Components from the Bunny portal to embed Bunny UI functionality into your application.",
   "main": "dist/cjs/index.js",
   "module": "dist/esm/index.js",
@@ -23,7 +23,9 @@
     "dependency-cruiser": "npx depcruise --exclude '^node_modules' --output-type dot src | dot -T svg > dependencygraph.svg",
     "codegen": "gql-tada generate output",
     "fetch-schema": "gql-tada generate schema 'https://bunny.bunny.internal/graphql' --header \"Authorization: $(grep '^API_TOKEN' .env | cut -d'=' -f2)\"",
-    "codegen-check": "gql-tada check"
+    "codegen-check": "gql-tada check",
+    "check:appearance": "tsx src/ui/appearance/scripts/dumpAppearance.ts",
+    "prepare": "husky"
   },
   "keywords": [],
   "author": "Bunny",
@@ -54,6 +56,7 @@
     "eslint-plugin-storybook": "^10.4.0",
     "glob": "^11.0.3",
     "gql.tada": "^1.9.0",
+    "husky": "^9.1.7",
     "less": "^4.4.2",
     "msw": "^2.11.6",
     "patch-package": "^8.0.1",
@@ -68,6 +71,7 @@
     "rollup-plugin-visualizer": "^7.0.1",
     "storybook": "^10.4.0",
     "tailwindcss": "^3.4.18",
+    "tsx": "^4.23.15",
     "typescript": "^5.9.3",
     "vite": "^6.4.1"
   },

package/dist/cjs/types/src/UI/Tooltip.d.ts

@@ -1,2 +0,0 @@
-import { TooltipProps as AntdTooltipProps } from 'antd';
-export declare function Tooltip(props: AntdTooltipProps): import("react").JSX.Element;

package/dist/cjs/types/src/components/Card.d.ts

@@ -1,6 +0,0 @@
-declare const Card: ({ children, className, style, }: {
-    children: React.ReactNode;
-    className?: string;
-    style?: React.CSSProperties;
-}) => import("react").JSX.Element;
-export default Card;

package/dist/cjs/types/src/components/Checkout/utils/storeNewPaymentMethod.d.ts

@@ -1,8 +0,0 @@
-import type { CheckoutNewPaymentMethod } from '../../CheckoutShared/hooks/useNewPaymentMethod';
-/** Stores a card entered in the form on the account through its plugin and returns the stored payment method's id. */
-export declare function storeNewPaymentMethod({ paymentMethod, accountId, token, apiHost, }: {
-    paymentMethod: CheckoutNewPaymentMethod;
-    accountId: string;
-    token?: string;
-    apiHost: string;
-}): Promise<string>;

package/dist/cjs/types/src/components/CheckoutShared/appearance/CheckoutAppearanceProvider.d.ts

@@ -1,14 +0,0 @@
-import { ReactNode } from 'react';
-import { type ResolvedAppearance } from './resolveAppearance';
-import type { Appearance } from './types';
-declare const useResolvedAppearance: () => ResolvedAppearance;
-export { useResolvedAppearance };
-/**
- * Resolves the appearance once and renders the root every rule is scoped to, with the rules as one
- * `<style>`. The antd token is read here and nowhere else on the screen: it carries the brand color,
- * dark mode and `configProviderProps` into the default variables.
- */
-export declare function CheckoutAppearanceProvider({ appearance, children, }: {
-    appearance?: Appearance;
-    children: ReactNode;
-}): import("react").JSX.Element;

package/dist/cjs/types/src/components/CheckoutShared/appearance/adapters/stripe.d.ts

@@ -1,9 +0,0 @@
-import type { Appearance as StripeAppearance, StripeElementsOptions } from '@stripe/stripe-js';
-import type { ResolvedAppearance } from '../resolveAppearance';
-/** The resolved appearance in Stripe's terms, so the Payment Element is drawn like the form's own fields. */
-export declare function toStripeAppearance({ variables, rules, sharedSelectors, darkMode, pageFontFamily, }: ResolvedAppearance): StripeAppearance;
-/** `appearance` and `fonts` for Stripe's `<Elements>`. `fonts` can't change once the group is created. */
-export declare function useStripeAppearance(): {
-    appearance: StripeAppearance;
-    fonts: NonNullable<StripeElementsOptions['fonts']>;
-};

package/dist/cjs/types/src/components/CheckoutShared/appearance/appearance.types.test.d.ts

@@ -1,3 +0,0 @@
-import type { Appearance } from './types';
-export declare const rejected: Appearance[];
-export declare const accepted: Appearance[];

package/dist/cjs/types/src/components/CheckoutShared/appearance/index.d.ts

@@ -1,3 +0,0 @@
-export { useStripeAppearance } from './adapters/stripe';
-export { CheckoutAppearanceProvider } from './CheckoutAppearanceProvider';
-export type { Appearance, AppearanceBlockStyle, AppearanceFont, AppearanceRules, AppearanceRuleStyle, AppearanceVariables, } from './types';

package/dist/cjs/types/src/components/CheckoutShared/appearance/resolveAppearance.d.ts

@@ -1,21 +0,0 @@
-import type { GlobalToken } from 'antd';
-import type { Appearance, AppearanceFont } from './types';
-import { type ResolvedVariables } from './variables';
-/** Selector → style. Holds the public selectors and the internal ones the screen's other elements use. */
-export type RulesMap = Record<string, Record<string, string>>;
-export type ResolvedAppearance = {
-    variables: ResolvedVariables;
-    rules: RulesMap;
-    /** The selectors the payment provider's fields have too; their rules are handed over as they are. */
-    sharedSelectors: string[];
-    fonts: AppearanceFont[] | undefined;
-    darkMode: boolean;
-    /** The font our text inherits from the page, once measured. */
-    pageFontFamily: string | undefined;
-};
-/**
- * Variables (our defaults, then the customer's) → the default rules built from them → the customer's
- * rules merged in per selector. The result is the one rules map both our CSS and the payment
- * provider's appearance are made from.
- */
-export declare function resolveAppearance(token: GlobalToken, darkMode: boolean, isMobile: boolean, appearance?: Appearance, pageFontFamily?: string): ResolvedAppearance;

package/dist/cjs/types/src/components/CheckoutShared/appearance/ruleGroups.d.ts

@@ -1,17 +0,0 @@
-import type { AppearanceBlockStyle, AppearanceRuleStyle } from './types';
-/**
- * What one rule source returns. All three groups are required (write `{}` when one is empty), so the
- * registry's derived types can index every source by group.
- */
-export type RuleGroups = {
-    /** Not in the API: base classes and elements customers reach only through variables. Any CSS. */
-    internal: Record<string, Record<string, string>>;
-    /** Public, and applied to our own fields and to the payment provider's alike: only the properties its fields accept. */
-    shared: Record<string, AppearanceRuleStyle>;
-    /** Public, Bunny-only elements: can also size them. */
-    block: Record<string, AppearanceBlockStyle>;
-};
-/** What a rule source can read besides the variables. */
-export type RuleContext = {
-    isMobile: boolean;
-};

package/dist/cjs/types/src/components/CheckoutShared/appearance/rules.d.ts

@@ -1,27 +0,0 @@
-import { screenRules } from '../components/CheckoutScreen.rules';
-import { demoPayCardBoxRules } from '../components/CheckoutForm/DemoPayCardBox.rules';
-import { fieldRules } from '../components/CheckoutForm/Field.rules';
-import { paymentTileRules } from '../components/CheckoutForm/PaymentTile.rules';
-import { buttonRules } from '../components/controls/Button.rules';
-import { selectRules } from '../components/controls/Select.rules';
-import { textInputRules } from '../components/controls/TextInput.rules';
-import type { AppearanceBlockStyle, AppearanceRuleStyle } from './types';
-/**
- * Every rule source. A selector belongs to one source (resolving throws in development otherwise), and
- * a rule that overrides another uses a compound selector (`.Input.Select`), so the order here doesn't
- * matter. Within a source, `internal` comes first, then `shared`, then `block`. The public types below
- * derive from this list. Sources are `function` declarations so the emitted `.d.ts` refers to them by
- * name and keeps their keys' JSDoc.
- */
-export declare const RULE_SOURCES: readonly [typeof screenRules, typeof fieldRules, typeof textInputRules, typeof selectRules, typeof demoPayCardBoxRules, typeof paymentTileRules, typeof buttonRules];
-type Source = ReturnType<(typeof RULE_SOURCES)[number]>;
-type UnionToIntersection<U> = (U extends unknown ? (x: U) => void : never) extends (x: infer I) => void ? I : never;
-type SharedGroups = UnionToIntersection<Source['shared']>;
-type BlockGroups = UnionToIntersection<Source['block']>;
-export type AppearanceRules = {
-    [K in keyof SharedGroups]?: AppearanceRuleStyle;
-} & {
-    [K in keyof BlockGroups]?: AppearanceBlockStyle;
-};
-export type SharedSelector = keyof SharedGroups;
-export {};

package/dist/cjs/types/src/components/CheckoutShared/appearance/rulesToCss.d.ts

@@ -1,5 +0,0 @@
-import type { RulesMap } from './resolveAppearance';
-/** The class on the element the rules are scoped to. */
-export declare const ROOT_CLASS = "bunny-appearance";
-/** The rules map as CSS for our own DOM. Selectors with no style (`.Summary` by default) are left out. */
-export declare function rulesToCss(rules: RulesMap): string;

package/dist/cjs/types/src/components/CheckoutShared/appearance/types.d.ts

@@ -1,144 +0,0 @@
-import type { AppearanceRules } from './rules';
-/**
- * The values the default look is built from: set one when a change should carry through everything
- * built from it. Names follow Stripe's Appearance API; the ones Stripe has too are handed to the
- * payment fields as they are. Every variable is optional, and literal values only (no `var()`).
- */
-export type AppearanceVariables = {
-    /**
-     * The primary button, text links, the selected payment method, focused borders, the loading spinner.
-     * Its hover and pressed shades and the default focus ring are derived from it, so use a plain color.
-     * @default antd `colorPrimary` (your Bunny brand color)
-     */
-    colorPrimary?: string;
-    /**
-     * The form column, inputs and payment method tiles.
-     * @default antd `colorBgContainer` (white; dark in dark mode)
-     */
-    colorBackground?: string;
-    /**
-     * Body text and input text.
-     * @default antd `colorText`
-     */
-    colorText?: string;
-    /**
-     * Muted text: the "Subscribe to" line, footer links, the back arrow.
-     * @default antd `colorTextSecondary`
-     */
-    colorTextSecondary?: string;
-    /**
-     * Placeholders, the empty country select and its chevron.
-     * @default antd `colorTextPlaceholder`
-     */
-    colorTextPlaceholder?: string;
-    /**
-     * Invalid field borders and error messages.
-     * @default antd `colorError`
-     */
-    colorDanger?: string;
-    /**
-     * Discount amounts and the success check (its tint and strong shade are derived from it, so use a plain color).
-     * @default antd `colorSuccess`
-     */
-    colorSuccess?: string;
-    /**
-     * All text on the screen. The payment fields can't inherit your page's font: declare web fonts in `fonts`.
-     * @default `'inherit'` (your page's font)
-     */
-    fontFamily?: string;
-    /**
-     * Body, input and button text. On phones, input text is raised to 16px when this is a smaller `px` value.
-     * @default antd `fontSize` (`14px`)
-     */
-    fontSizeBase?: string;
-    /**
-     * Corners of inputs, payment method tiles and buttons.
-     * @default antd `borderRadius` (`4px`)
-     */
-    borderRadius?: string;
-    /**
-     * Vertical space between form rows.
-     * @default `'20px'`
-     */
-    gridRowSpacing?: string;
-    /**
-     * The ring around a focused input or payment method.
-     * @default `0 0 0 2px` in a tint of `colorPrimary`
-     * @example '0 0 0 3px rgba(20, 83, 45, 0.25)'
-     */
-    focusBoxShadow?: string;
-    /**
-     * The summary column and the loading overlay.
-     * @default `'#f8fafc'` (dark mode: `'#121212'`)
-     */
-    colorBackgroundSummary?: string;
-    /**
-     * Borders of inputs, payment method tiles and secondary buttons; also dividers, when set.
-     * @default antd `colorBorder`
-     */
-    colorBorder?: string;
-    /**
-     * Width of those borders and of the dividers.
-     * @default `'2px'`
-     */
-    borderWidth?: string;
-};
-export type RuleProperty = 'color' | 'backgroundColor' | 'border' | 'borderTop' | 'borderRight' | 'borderBottom' | 'borderLeft' | 'borderColor' | 'borderWidth' | 'borderStyle' | 'borderRadius' | 'boxShadow' | 'fontFamily' | 'fontSize' | 'fontWeight' | 'letterSpacing' | 'lineHeight' | 'margin' | 'marginTop' | 'marginRight' | 'marginBottom' | 'marginLeft' | 'padding' | 'paddingTop' | 'paddingRight' | 'paddingBottom' | 'paddingLeft' | 'textTransform' | 'textDecoration' | 'transition' | 'outline' | 'outlineOffset';
-/** What a rule can set: the CSS properties (camelCase) a payment provider's hosted fields accept too. */
-export type AppearanceRuleStyle = Partial<Record<RuleProperty, string>>;
-/** Rules for elements only we draw can also size them. */
-export type AppearanceBlockStyle = AppearanceRuleStyle & Partial<Record<'background' | 'maxWidth' | 'minHeight' | 'opacity', string>>;
-/** Selector → style override. The selectors come from the rule sources' public groups (see `rules.ts`). */
-export type { AppearanceRules };
-/**
- * A font the payment provider's fields must load themselves (they render in an iframe and can't see
- * your page's fonts): a stylesheet of `@font-face` rules, or one font file. Your page loads its own copy.
- */
-export type AppearanceFont = {
-    /** URL of a stylesheet of `@font-face` rules, such as a Google Fonts link. */
-    cssSrc: string;
-} | {
-    /** The name to use in `fontFamily`. */
-    family: string;
-    /** The font file, as a CSS `src` value: `url(https://...)`. */
-    src: string;
-    /** CSS `font-weight`, such as `'400'` or `'400 700'`. */
-    weight?: string;
-    /** CSS `font-style`. */
-    style?: 'normal' | 'italic' | 'oblique';
-    /** CSS `font-display`. */
-    display?: string;
-    /** CSS `unicode-range`. */
-    unicodeRange?: string;
-};
-/**
- * Restyles the Signup and Checkout screens, modelled on Stripe's Appearance API: `variables` feed the
- * default rules, your `rules` are merged over them selector by selector, and `fonts` are loaded by the
- * payment fields. The payment provider's fields follow the shared rules too. See "Styling Signup and
- * Checkout" in the package README.
- * @example
- * <Signup
- *   priceListCode="..."
- *   appearance={{
- *     variables: { colorPrimary: '#14532d', colorBackgroundSummary: '#f6f1e7', borderRadius: '0px' },
- *     rules: {
- *       '.Label': { textTransform: 'uppercase', letterSpacing: '0.08em' },
- *       '.Input:focus': { borderColor: '#14532d', boxShadow: '0 0 0 1px #14532d' },
- *       '.Button': { backgroundColor: '#1c1917', padding: '14px 16px' },
- *     },
- *     fonts: [{ cssSrc: 'https://fonts.googleapis.com/css2?family=Source+Serif+4:wght@400;600&display=swap' }],
- *   }}
- * />
- */
-export type Appearance = {
-    /** The values the default rules are built from. */
-    variables?: AppearanceVariables;
-    /** Per-selector overrides, merged over the defaults property by property. Literal values only. */
-    rules?: AppearanceRules;
-    /**
-     * Fonts the payment fields load in their iframe. Set them once, up front: changing them after the
-     * payment form mounts remounts it and clears what was typed.
-     * @example [{ cssSrc: 'https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap' }]
-     */
-    fonts?: AppearanceFont[];
-};

package/dist/cjs/types/src/components/CheckoutShared/appearance/variables.d.ts

@@ -1,29 +0,0 @@
-import { type GlobalToken } from 'antd';
-import type { AppearanceVariables } from './types';
-/** Every variable, plus the shades the default rules need that customers don't set. */
-type VariablesAndShades = Required<AppearanceVariables> & {
-    colorPrimaryHover: string;
-    colorPrimaryActive: string;
-    colorOnPrimary: string;
-    colorTextDisabled: string;
-    colorBackgroundDisabled: string;
-    colorBorderSecondary: string;
-    colorFill: string;
-    colorDivider: string;
-    colorSuccessBackground: string;
-    colorSuccessStrong: string;
-    boxShadowPane: string;
-    boxShadowPaneStacked: string;
-};
-/** The variables and shades, plus values built from them that several rule sources share. */
-export type ResolvedVariables = VariablesAndShades & {
-    controlBorder: string;
-    controlTransition: string;
-    focusOutline: {
-        outline: string;
-        outlineOffset: string;
-    };
-};
-/** Our defaults with the customer's variables over them, and every shade derived from the result. */
-export declare function resolveVariables(token: GlobalToken, darkMode: boolean, customer?: AppearanceVariables): ResolvedVariables;
-export {};

package/dist/cjs/types/src/components/CheckoutShared/components/CheckoutForm/DemoPayCardBox.d.ts

@@ -1,6 +0,0 @@
-/**
- * DemoPay's card inputs drawn as one bordered box: number (with brands) on top, expiry + CVC below.
- * The inputs are PaymentForm's antd ones (test-only, not themed by the appearance); the box around
- * them is.
- */
-export default function DemoPayCardBox(): import("react").JSX.Element;

package/dist/cjs/types/src/components/CheckoutShared/components/CheckoutForm/PaymentTile.d.ts

@@ -1,10 +0,0 @@
-import type { ButtonHTMLAttributes } from 'react';
-/**
- * An equal-width selectable tile: icon above label, the selected one outlined in the primary color.
- * Styled by the appearance's `.Tab` rules, like the tabs of Stripe's Payment Element.
- */
-export default function PaymentTile({ selected, ...props }: {
-    selected: boolean;
-} & Pick<ButtonHTMLAttributes<HTMLButtonElement>, 'onClick' | 'children'>): import("react").JSX.Element;
-/** CardImage's SVGs are 70x48; shrink them to the icon height of the other tiles. */
-export declare const CardBrand: any;

package/dist/cjs/types/src/components/CheckoutShared/components/CheckoutForm/PluginTiles.d.ts

@@ -1,4 +0,0 @@
-/** One tile per payment plugin. Picking one pays with a new card on it. */
-export default function PluginTiles({ labelId }: {
-    labelId: string;
-}): import("react").JSX.Element;

package/dist/cjs/types/src/components/CheckoutShared/components/CheckoutForm/SavedPaymentMethodTiles.d.ts

@@ -1,4 +0,0 @@
-/** One tile per saved payment method (card brand and last digits), then a "New card" tile. */
-export default function SavedPaymentMethodTiles({ labelId }: {
-    labelId: string;
-}): import("react").JSX.Element;

package/dist/cjs/types/src/components/CheckoutShared/components/CheckoutForm/StripePaymentElement.d.ts

@@ -1,8 +0,0 @@
-/**
- * Stripe's Payment Element: one tab per payment method the tenant's Stripe account offers, styled
- * through the Elements group's appearance (see `appearance/adapters/stripe`). The name, email,
- * country and postal code come from the form's own fields and are passed on confirm, so the element
- * doesn't ask for them again; without a country field it asks for the country and postal code itself.
- * Read-only follows the antd Form it sits in, like the other inputs.
- */
-export default function StripePaymentElement(): import("react").JSX.Element;

package/dist/cjs/types/src/components/CheckoutShared/components/controls/Button.d.ts

@@ -1,24 +0,0 @@
-import type { ButtonHTMLAttributes, ReactNode } from 'react';
-declare const VARIANT_CLASS: {
-    /** The filled main action, styled by the appearance's `.Button` rules. */
-    primary: string;
-    /** A bordered secondary action. */
-    plain: string;
-    /** Reads as a link in the text. */
-    link: string;
-    /** A small square holding only an icon; give it an `aria-label`. */
-    icon: string;
-};
-type Props = Pick<ButtonHTMLAttributes<HTMLButtonElement>, 'type' | 'disabled' | 'onClick' | 'aria-label'> & {
-    variant?: keyof typeof VARIANT_CLASS;
-    /** Shows a spinner in place of the icon and ignores clicks, without looking disabled. */
-    loading?: boolean;
-    icon?: ReactNode;
-    /** Renders a link that looks like the button. */
-    href?: string;
-    className?: string;
-    children?: ReactNode;
-};
-/** A native button (or a link, given `href`). */
-export default function Button({ variant, loading, icon, href, className, children, type, onClick, ...props }: Props): import("react").JSX.Element;
-export {};

package/dist/cjs/types/src/components/CheckoutShared/components/controls/Select.d.ts

@@ -1,17 +0,0 @@
-import { InputHTMLAttributes } from 'react';
-type Option = {
-    value: string;
-    label: string;
-};
-/**
- * A select with a menu of our own, so the open list is styled by the appearance too (a native
- * select's list is drawn by the browser). The closed control is a text input under the same
- * `.Input` rules as the others, with a chevron; typing in it filters the options by label or
- * value. Works as the child of a `Form.Item`, like `TextInput`.
- */
-declare const Select: import("react").ForwardRefExoticComponent<Omit<InputHTMLAttributes<HTMLInputElement>, "value" | "onChange"> & {
-    options: Option[];
-    value?: string;
-    onChange?: (value: string) => void;
-} & import("react").RefAttributes<HTMLInputElement>>;
-export default Select;

package/dist/cjs/types/src/components/CheckoutShared/components/controls/Select.rules.d.ts

@@ -1,55 +0,0 @@
-import type { ResolvedVariables } from '../../appearance/variables';
-export declare function selectRules(v: ResolvedVariables): {
-    internal: {
-        '.Input.Select': {
-            paddingRight: string;
-            backgroundImage: string;
-            backgroundRepeat: string;
-            backgroundPosition: string;
-            cursor: string;
-        };
-        '.Menu': {
-            position: string;
-            zIndex: string;
-            top: string;
-            left: string;
-            right: string;
-            maxHeight: string;
-            overflowY: string;
-            margin: string;
-            padding: string;
-            listStyle: string;
-            border: string;
-            borderRadius: string;
-            backgroundColor: string;
-            boxShadow: string;
-        };
-        '.Menu[data-placement="top"]': {
-            top: string;
-            bottom: string;
-        };
-        '.Option': {
-            padding: string;
-            borderRadius: string;
-            lineHeight: string;
-            color: string;
-            overflow: string;
-            textOverflow: string;
-            whiteSpace: string;
-            cursor: string;
-        };
-        '.Option[data-active="true"]': {
-            backgroundColor: string;
-        };
-        '.Option[aria-selected="true"]': {
-            fontWeight: string;
-        };
-        '.MenuEmpty': {
-            padding: string;
-            lineHeight: string;
-            color: string;
-        };
-    };
-    shared: {};
-    block: {};
-};

package/dist/cjs/types/src/components/CheckoutShared/components/controls/Spinner.d.ts

@@ -1,4 +0,0 @@
-/** A spinning arc in the current text color. Decorative: say what is loading next to it. */
-export default function Spinner({ size }: {
-    size?: number;
-}): import("react").JSX.Element;

package/dist/cjs/types/src/components/CheckoutShared/components/controls/TextInput.d.ts

@@ -1,7 +0,0 @@
-import { InputHTMLAttributes } from 'react';
-/**
- * A native text input styled by the appearance's `.Input` rules. Takes what `Form.Item` gives its
- * child (`id`, `value`, `onChange`, `aria-invalid`, a ref to focus), so it works as one unchanged.
- */
-declare const TextInput: import("react").ForwardRefExoticComponent<InputHTMLAttributes<HTMLInputElement> & import("react").RefAttributes<HTMLInputElement>>;
-export default TextInput;

package/dist/cjs/types/src/components/CheckoutShared/contexts/CheckoutPaymentMethodsContext.d.ts

@@ -1,37 +0,0 @@
-import { FragmentOf } from 'gql.tada';
-import { ReactNode } from 'react';
-import { SavedPaymentMethodTiles_PaymentMethodFragment } from '../graphql/fragments/SavedPaymentMethodTiles_PaymentMethodFragment';
-import { CheckoutPaymentPlugin } from '../utils/asPluginData';
-export declare const STRIPE_FRONTEND = "StripePayment";
-export declare const DEMO_PAY_FRONTEND = "DemoPayPayment";
-export type CheckoutSavedPaymentMethod = FragmentOf<typeof SavedPaymentMethodTiles_PaymentMethodFragment> & {
-    id: string;
-};
-type CheckoutPaymentMethodsValue = {
-    plugins: CheckoutPaymentPlugin[];
-    stripePlugin: CheckoutPaymentPlugin | undefined;
-    /** The highlighted plugin: the one chosen, or the one owning the selected saved payment method. */
-    selectedPlugin: CheckoutPaymentPlugin | undefined;
-    selectedPluginName: string | undefined;
-    /** Choose a plugin and pay with a new card on it. */
-    setSelectedPluginId: (id: string) => void;
-    /** Payment methods already stored on the account, if the flow has one. */
-    savedPaymentMethods: CheckoutSavedPaymentMethod[];
-    selectedSavedPaymentMethod: CheckoutSavedPaymentMethod | undefined;
-    setSelectedSavedPaymentMethodId: (id: string) => void;
-    /** Drop the saved payment method and pay with a new card on the highlighted plugin. */
-    selectNewPaymentMethod: () => void;
-};
-declare const useCheckoutPaymentMethods: () => CheckoutPaymentMethodsValue;
-/**
- * Payment plugins the checkout form has a payment form for, plus the account's saved payment methods
- * when there is an account. The form shows them as two sections: which plugin, then which saved
- * method (or a new card). By default the account's default (or first) saved method is selected,
- * otherwise a new card on the first plugin. Selecting a saved method highlights the plugin it
- * belongs to; selecting a plugin switches to a new card on it.
- */
-export declare function CheckoutPaymentMethodsProvider({ savedPaymentMethods, children, }: {
-    savedPaymentMethods?: CheckoutSavedPaymentMethod[];
-    children: ReactNode;
-}): import("react").JSX.Element;
-export { useCheckoutPaymentMethods };

package/dist/cjs/types/src/components/CheckoutShared/hooks/useNewPaymentMethod.d.ts

@@ -1,10 +0,0 @@
-import type { CheckoutFormValues } from '../contexts/CheckoutConfigContext';
-import type { CheckoutPaymentPlugin } from '../utils/asPluginData';
-/** A payment method entered in the form, ready for the plugin to store: a Stripe payment method token or DemoPay's card metadata. */
-export type CheckoutNewPaymentMethod = {
-    plugin: CheckoutPaymentPlugin;
-    token?: string;
-    metadata?: Record<string, string>;
-};
-/** Turns what was entered in the selected plugin's payment form into something the API can store. */
-export declare function useNewPaymentMethod(): (values: CheckoutFormValues, accountId?: string) => Promise<CheckoutNewPaymentMethod>;

package/dist/cjs/types/src/components/CheckoutShared/hooks/useStripePaymentMethodId.d.ts

@@ -1,9 +0,0 @@
-import type { CheckoutFormValues } from '../contexts/CheckoutConfigContext';
-type PayerValues = Pick<CheckoutFormValues, 'email' | 'nameOnCard' | 'billingCountry' | 'billingZip'>;
-/**
- * Sets the payment method in the Payment Element up in the browser (SetupIntent + confirmSetup,
- * which runs any 3DS challenge) and returns the Stripe payment method id. Without an account,
- * Stripe's customer is provisioned from the email.
- */
-export declare function useStripePaymentMethodId(): (values: PayerValues, accountId?: string) => Promise<string>;
-export {};

package/dist/cjs/types/src/components/CheckoutShared/utils/asPluginData.d.ts

@@ -1,6 +0,0 @@
-import usePaymentPlugins from '@/hooks/usePaymentPlugins';
-import { PluginData } from '@/types/frontendTypes';
-export type CheckoutPaymentPlugin = ReturnType<typeof usePaymentPlugins>['paymentPlugins'][number];
-/** The `paymentPlugins` GraphQL row doesn't share a type with the legacy `PluginData` the plugin helpers expect. */
-export declare const asPluginData: (plugin: CheckoutPaymentPlugin) => PluginData;
-export declare const pluginFrontendName: (plugin: CheckoutPaymentPlugin | undefined) => string | undefined;

package/dist/cjs/types/src/components/CheckoutShared/utils/validateDemoPayCard.d.ts

@@ -1,5 +0,0 @@
-/** Throws when the DemoPay card box can't be submitted. */
-export declare function validateDemoPayCard(card: {
-    expiry: string;
-    cvc: string;
-}): void;

package/dist/cjs/types/src/components/CustomizedAntdComponents/Tag.d.ts

@@ -1,37 +0,0 @@
-declare const tagStyleMap: {
-    blue: {
-        color: string;
-        background: string;
-    };
-    green: {
-        color: string;
-        background: string;
-    };
-    red: {
-        color: string;
-        background: string;
-    };
-    orange: {
-        color: string;
-        background: string;
-    };
-    yellow: {
-        color: string;
-        background: string;
-    };
-    purple: {
-        color: string;
-        background: string;
-    };
-    black: {
-        color: string;
-        background: string;
-    };
-};
-declare const CustomizedTag: ({ children, color, className, style, }: {
-    children: React.ReactNode;
-    color?: keyof typeof tagStyleMap;
-    className?: string;
-    style?: React.CSSProperties;
-}) => import("react").JSX.Element;
-export default CustomizedTag;

package/dist/cjs/types/src/components/PaymentForm/DemoPay/CreditCard/CreditCard.d.ts

@@ -1,25 +0,0 @@
-import { FragmentOf } from 'gql.tada';
-import { ShadowType } from '../../../../types/shadowType';
-export declare const CreditCard_PaymentMethodFragment: import("gql.tada").TadaDocumentNode<{
-    [$tada.fragmentRefs]: {
-        CardImage_PaymentMethodFragment: "PaymentMethod";
-    };
-    id: string;
-    expirationDate: unknown;
-    metadata: {
-        identifier: string | null;
-    } | null;
-}, {}, {
-    fragment: "CreditCard_PaymentMethodFragment";
-    on: "PaymentMethod";
-    masked: true;
-}>;
-type CreditCardProps = {
-    onClickRemove: () => void;
-    onClickUpdate: () => void;
-    paymentMethod: FragmentOf<typeof CreditCard_PaymentMethodFragment>;
-    shadow?: ShadowType;
-    cardEnabled?: boolean;
-};
-declare const CreditCard: ({ onClickRemove, onClickUpdate, paymentMethod: maskedPaymentMethod, shadow, cardEnabled, }: CreditCardProps) => import("react").JSX.Element;
-export default CreditCard;

package/dist/cjs/types/src/components/PaymentForm/DemoPay/CreditCard/index.d.ts

@@ -1 +0,0 @@
-export { MiniCreditCard } from './MiniCreditCard';